docs: emberjs example

packages/ember-imask/.editorconfig

@@ -0,0 +1,19 @@
+# EditorConfig helps developers define and maintain consistent
+# coding styles between different editors and IDEs
+# editorconfig.org
+
+root = true
+
+[*]
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+indent_style = space
+indent_size = 2
+
+[*.hbs]
+insert_final_newline = false
+
+[*.{diff,md}]
+trim_trailing_whitespace = false

packages/ember-imask/.ember-cli

@@ -0,0 +1,9 @@
+{
+  /**
+    Ember CLI sends analytics information by default. The data is completely
+    anonymous, but there are times when you might want to disable this behavior.
+
+    Setting `disableAnalytics` to true will prevent any data from being sent.
+  */
+  "disableAnalytics": false
+}

packages/ember-imask/.eslintignore

@@ -0,0 +1,20 @@
+# unconventional js
+/blueprints/*/files/
+/vendor/
+
+# compiled output
+/dist/
+/tmp/
+
+# dependencies
+/bower_components/
+/node_modules/
+
+# misc
+/coverage/
+!.*
+
+# ember-try
+/.node_modules.ember-try/
+/bower.json.ember-try
+/package.json.ember-try

packages/ember-imask/.eslintrc.js

@@ -0,0 +1,53 @@
+'use strict';
+
+module.exports = {
+  root: true,
+  parser: 'babel-eslint',
+  parserOptions: {
+    ecmaVersion: 2018,
+    sourceType: 'module',
+    ecmaFeatures: {
+      legacyDecorators: true
+    }
+  },
+  plugins: [
+    'ember'
+  ],
+  extends: [
+    'eslint:recommended',
+    'plugin:ember/recommended'
+  ],
+  env: {
+    browser: true
+  },
+  rules: {},
+  overrides: [
+    // node files
+    {
+      files: [
+        '.eslintrc.js',
+        '.template-lintrc.js',
+        'ember-cli-build.js',
+        'testem.js',
+        'blueprints/*/index.js',
+        'config/**/*.js',
+        'lib/*/index.js',
+        'server/**/*.js'
+      ],
+      parserOptions: {
+        sourceType: 'script'
+      },
+      env: {
+        browser: false,
+        node: true
+      },
+      plugins: ['node'],
+      extends: ['plugin:node/recommended'],
+      rules: {
+        // this can be removed once the following is fixed
+        // https://github.com/mysticatea/eslint-plugin-node/issues/77
+        'node/no-unpublished-require': 'off'
+      }
+    }
+  ]
+};

packages/ember-imask/.gitignore

@@ -0,0 +1,25 @@
+# See https://help.github.com/ignore-files/ for more about ignoring files.
+
+# compiled output
+/dist/
+/tmp/
+
+# dependencies
+/bower_components/
+/node_modules/
+
+# misc
+/.env*
+/.pnp*
+/.sass-cache
+/connect.lock
+/coverage/
+/libpeerconnection.log
+/npm-debug.log*
+/testem.log
+/yarn-error.log
+
+# ember-try
+/.node_modules.ember-try/
+/bower.json.ember-try
+/package.json.ember-try

packages/ember-imask/.template-lintrc.js

@@ -0,0 +1,5 @@
+'use strict';
+
+module.exports = {
+  extends: 'octane'
+};

packages/ember-imask/.travis.yml

@@ -0,0 +1,31 @@
+---
+language: node_js
+node_js:
+  - "10"
+
+dist: xenial
+
+addons:
+  chrome: stable
+
+cache:
+  yarn: true
+
+env:
+  global:
+    # See https://git.io/vdao3 for details.
+    - JOBS=1
+
+branches:
+  only:
+    - master
+
+before_install:
+  - curl -o- -L https://yarnpkg.com/install.sh | bash
+  - export PATH=$HOME/.yarn/bin:$PATH
+
+install:
+  - yarn install --non-interactive
+
+script:
+  - yarn test

packages/ember-imask/.watchmanconfig

@@ -0,0 +1,3 @@
+{
+  "ignore_dirs": ["tmp", "dist"]
+}

packages/ember-imask/README.md

@@ -0,0 +1,56 @@
+# How to use imask on emberjs
+
+<a href="https://opencollective.com/imask/donate" target="_blank">
+  <img src="https://opencollective.com/imask/donate/button.png?color=blue" width=300 />
+</a>
+
+## Install
+
+`yarn add --dev imask`
+
+## Dependencies
+
+- [ember-auto-import](https://github.com/ef4/ember-auto-import)
+- [ember-modifier](https://github.com/ember-modifier/ember-modifier)
+
+## Mask Input Example
+
+`ember g modifier imask-number`
+
+//app/modifiers/imask-number.js
+
+```javascript
+import { modifier } from "ember-modifier";
+import IMask from "imask";
+
+export default modifier(function imaskNumber(element /*, params, hash*/) {
+  const mask = IMask(element, {
+    mask: Number,
+    min: -10000,
+    max: 10000,
+    thousandsSeparator: " ",
+  });
+
+  return () => mask.destroy();
+});
+```
+
+```handlebars
+<Input @value={{this.number}} {{imask-number}} />
+```
+
+## This folder is an ember example with imask setup
+
+### Installation
+
+- `yarn install`
+
+### Running / Development
+
+- `ember serve`
+- Visit your app at [http://localhost:4200](http://localhost:4200).
+
+### Routes
+
+- [number-mask](http://localhost:4200/number-mask)
+- [phone-mask](http://localhost:4200/phone-mask)

packages/ember-imask/app/app.js

@@ -0,0 +1,12 @@
+import Application from '@ember/application';
+import Resolver from 'ember-resolver';
+import loadInitializers from 'ember-load-initializers';
+import config from './config/environment';
+
+export default class App extends Application {
+  modulePrefix = config.modulePrefix;
+  podModulePrefix = config.podModulePrefix;
+  Resolver = Resolver;
+}
+
+loadInitializers(App, config.modulePrefix);

packages/ember-imask/app/index.html

@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <title>EmberImask</title>
+    <meta name="description" content="">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+
+    {{content-for "head"}}
+
+    <link integrity="" rel="stylesheet" href="{{rootURL}}assets/vendor.css">
+    <link integrity="" rel="stylesheet" href="{{rootURL}}assets/ember-imask.css">
+
+    {{content-for "head-footer"}}
+  </head>
+  <body>
+    {{content-for "body"}}
+
+    <script src="{{rootURL}}assets/vendor.js"></script>
+    <script src="{{rootURL}}assets/ember-imask.js"></script>
+
+    {{content-for "body-footer"}}
+  </body>
+</html>

packages/ember-imask/app/modifiers/imask-number.js

@@ -0,0 +1,13 @@
+import { modifier } from "ember-modifier";
+import IMask from "imask";
+
+export default modifier(function imaskNumber(element /*, params, hash*/) {
+  const mask = IMask(element, {
+    mask: Number,
+    min: -10000,
+    max: 10000,
+    thousandsSeparator: " ",
+  });
+
+  return () => mask.destroy();
+});

packages/ember-imask/app/modifiers/imask-phone.js

@@ -0,0 +1,10 @@
+import { modifier } from "ember-modifier";
+import IMask from "imask";
+
+export default modifier(function imaskPhone(element /*, params, hash*/) {
+  const mask = IMask(element, {
+    mask: "+{7}(000)000-00-00",
+  });
+
+  return () => mask.destroy();
+});

packages/ember-imask/app/router.js

@@ -0,0 +1,12 @@
+import EmberRouter from '@ember/routing/router';
+import config from './config/environment';
+
+export default class Router extends EmberRouter {
+  location = config.locationType;
+  rootURL = config.rootURL;
+}
+
+Router.map(function() {
+  this.route('number-mask');
+  this.route('phone-mask');
+});

packages/ember-imask/app/routes/number-mask.js

@@ -0,0 +1,4 @@
+import Route from '@ember/routing/route';
+
+export default class NumberMaskRoute extends Route {
+}

packages/ember-imask/app/routes/phone-mask.js

@@ -0,0 +1,4 @@
+import Route from '@ember/routing/route';
+
+export default class PhoneMaskRoute extends Route {
+}

packages/ember-imask/app/templates/application.hbs

@@ -0,0 +1,4 @@
+{{!-- The following component displays Ember's default welcome message. --}}
+<LinkTo @route="number-mask">Number</LinkTo>
+<LinkTo @route="phone-mask">Phone</LinkTo>
+{{outlet}}

packages/ember-imask/app/templates/number-mask.hbs

@@ -0,0 +1 @@
+<Input @value={{this.number}} {{imask-number}} /> : {{this.number}}

packages/ember-imask/app/templates/phone-mask.hbs

@@ -0,0 +1 @@
+<Input @value={{this.phone}} {{imask-phone}} /> : {{this.phone}}

packages/ember-imask/config/environment.js

@@ -0,0 +1,51 @@
+'use strict';
+
+module.exports = function(environment) {
+  let ENV = {
+    modulePrefix: 'ember-imask',
+    environment,
+    rootURL: '/',
+    locationType: 'auto',
+    EmberENV: {
+      FEATURES: {
+        // Here you can enable experimental features on an ember canary build
+        // e.g. EMBER_NATIVE_DECORATOR_SUPPORT: true
+      },
+      EXTEND_PROTOTYPES: {
+        // Prevent Ember Data from overriding Date.parse.
+        Date: false
+      }
+    },
+
+    APP: {
+      // Here you can pass flags/options to your application instance
+      // when it is created
+    }
+  };
+
+  if (environment === 'development') {
+    // ENV.APP.LOG_RESOLVER = true;
+    // ENV.APP.LOG_ACTIVE_GENERATION = true;
+    // ENV.APP.LOG_TRANSITIONS = true;
+    // ENV.APP.LOG_TRANSITIONS_INTERNAL = true;
+    // ENV.APP.LOG_VIEW_LOOKUPS = true;
+  }
+
+  if (environment === 'test') {
+    // Testem prefers this...
+    ENV.locationType = 'none';
+
+    // keep test console output quieter
+    ENV.APP.LOG_ACTIVE_GENERATION = false;
+    ENV.APP.LOG_VIEW_LOOKUPS = false;
+
+    ENV.APP.rootElement = '#ember-testing';
+    ENV.APP.autoboot = false;
+  }
+
+  if (environment === 'production') {
+    // here you can enable a production-specific feature
+  }
+
+  return ENV;
+};

packages/ember-imask/config/optional-features.json

@@ -0,0 +1,6 @@
+{
+  "application-template-wrapper": false,
+  "default-async-observers": true,
+  "jquery-integration": false,
+  "template-only-glimmer-components": true
+}