diff --git a/types/ember__component/checkbox.d.ts b/types/ember__component/checkbox.d.ts new file mode 100644 index 0000000000..a71ee3602e --- /dev/null +++ b/types/ember__component/checkbox.d.ts @@ -0,0 +1,3 @@ +import Ember from 'ember'; + +export default class Checkbox extends Ember.Checkbox { } diff --git a/types/ember__component/helper.d.ts b/types/ember__component/helper.d.ts new file mode 100644 index 0000000000..e89e6eab84 --- /dev/null +++ b/types/ember__component/helper.d.ts @@ -0,0 +1,17 @@ +import Ember from 'ember'; + +export default class Helper extends Ember.Helper { } +/** + * In many cases, the ceremony of a full `Helper` class is not required. + * The `helper` method create pure-function helpers without instances. For + * example: + * ```app/helpers/format-currency.js + * import { helper } from '@ember/component/helper'; + * export default helper(function(params, hash) { + * let cents = params[0]; + * let currency = hash.currency; + * return `${currency}${cents * 0.01}`; + * }); + * ``` + */ +export function helper(helperFn: (params: any[], hash?: any) => any): any; diff --git a/types/ember__component/index.d.ts b/types/ember__component/index.d.ts new file mode 100644 index 0000000000..147d717e2b --- /dev/null +++ b/types/ember__component/index.d.ts @@ -0,0 +1,9 @@ +// Type definitions for @ember/component 3.0 +// Project: http://emberjs.com/ +// Definitions by: Mike North +// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped +// TypeScript Version: 2.8 + +import Ember from 'ember'; + +export default class Component extends Ember.Component { } diff --git a/types/ember__component/test/component.ts b/types/ember__component/test/component.ts new file mode 100644 index 0000000000..1d0b164647 --- /dev/null +++ b/types/ember__component/test/component.ts @@ -0,0 +1,123 @@ +import Component from '@ember/component'; +import Object, { computed, get } from '@ember/object'; +import hbs from 'htmlbars-inline-precompile'; +import { assertType } from "./lib/assert"; + +Component.extend({ + layout: hbs` +
+ {{yield}} +
+ `, +}); + +Component.extend({ + layout: 'my-layout', +}); + +const MyComponent = Component.extend(); +assertType(get(MyComponent, 'positionalParams')); + +const component1 = Component.extend({ + actions: { + hello(name: string) { + console.log('Hello', name); + }, + }, +}); + +Component.extend({ + name: '', + hello(name: string) { + this.set('name', name); + }, +}); + +Component.extend({ + tagName: 'em', +}); + +Component.extend({ + classNames: ['my-class', 'my-other-class'], +}); + +Component.extend({ + classNameBindings: ['propertyA', 'propertyB'], + propertyA: 'from-a', + propertyB: computed(function() { + if (!this.get('propertyA')) { + return 'from-b'; + } + }), +}); + +Component.extend({ + classNameBindings: ['hovered'], + hovered: true, +}); + +Component.extend({ + classNameBindings: ['messages.empty'], + messages: Object.create({ + empty: true, + }), +}); + +Component.extend({ + classNameBindings: ['isEnabled:enabled:disabled'], + isEnabled: true, +}); + +Component.extend({ + classNameBindings: ['isEnabled::disabled'], + isEnabled: true, +}); + +Component.extend({ + tagName: 'a', + attributeBindings: ['href'], + href: 'http://google.com', +}); + +Component.extend({ + tagName: 'a', + attributeBindings: ['url:href'], + url: 'http://google.com', +}); + +Component.extend({ + tagName: 'use', + attributeBindings: ['xlinkHref:xlink:href'], + xlinkHref: '#triangle', +}); + +Component.extend({ + tagName: 'input', + attributeBindings: ['disabled'], + disabled: false, +}); + +Component.extend({ + tagName: 'input', + attributeBindings: ['disabled'], + disabled: computed(() => { + if ('someLogic') { + return true; + } else { + return false; + } + }), +}); + +Component.extend({ + tagName: 'form', + attributeBindings: ['novalidate'], + novalidate: null, +}); + +Component.extend({ + click(event: object) { + // will be called when an instance's + // rendered element is clicked + }, +}); diff --git a/types/ember__component/test/helper.ts b/types/ember__component/test/helper.ts new file mode 100644 index 0000000000..bee6cc1d46 --- /dev/null +++ b/types/ember__component/test/helper.ts @@ -0,0 +1,25 @@ +import { assertType } from './lib/assert'; +import Helper, { helper } from '@ember/component/helper'; + +class Timestamp extends Helper { + timer?: ReturnType; + now = new Date(); + init() { + super.init(); + this.timer = setInterval(() => { + this.set('now', new Date()); + this.recompute(); + }, 100); + } + willDestroy() { + clearInterval(this.timer); + } +} + +const addHelper = helper(function add([a, b]: number[]) { + return a + b; +}); + +const dasherizeHelper = helper(function dasherize([str]: string[], { delim = '-'}) { + return str.split(/[\s\n\_\.]+/g).join(delim); +}); diff --git a/types/ember__component/test/lib/assert.ts b/types/ember__component/test/lib/assert.ts new file mode 100755 index 0000000000..262d18bc2c --- /dev/null +++ b/types/ember__component/test/lib/assert.ts @@ -0,0 +1,5 @@ +/** Static assertion that `value` has type `T` */ +// Disable tslint here b/c the generic is used to let us do a type coercion and +// validate that coercion works for the type value "passed into" the function. +// tslint:disable-next-line:no-unnecessary-generics +export declare function assertType(value: T): T; diff --git a/types/ember__component/text-area.d.ts b/types/ember__component/text-area.d.ts new file mode 100644 index 0000000000..859700a2d8 --- /dev/null +++ b/types/ember__component/text-area.d.ts @@ -0,0 +1,3 @@ +import Ember from 'ember'; + +export default class TextArea extends Ember.TextArea { } diff --git a/types/ember__component/text-field.d.ts b/types/ember__component/text-field.d.ts new file mode 100644 index 0000000000..873995224b --- /dev/null +++ b/types/ember__component/text-field.d.ts @@ -0,0 +1,3 @@ +import Ember from 'ember'; + +export default class TextField extends Ember.TextField { } diff --git a/types/ember__component/tsconfig.json b/types/ember__component/tsconfig.json new file mode 100644 index 0000000000..22181f6879 --- /dev/null +++ b/types/ember__component/tsconfig.json @@ -0,0 +1,35 @@ +{ + "compilerOptions": { + "module": "commonjs", + "target": "es5", + "lib": [ + "es6", + "dom" + ], + "noImplicitAny": true, + "noImplicitThis": true, + "strictNullChecks": true, + "strictFunctionTypes": true, + "baseUrl": "../", + "typeRoots": [ + "../" + ], + "paths": { + "@ember/component": ["ember__component"], + "@ember/component/*": ["ember__component/*"] + }, + "types": [], + "noEmit": true, + "forceConsistentCasingInFileNames": true + }, + "files": [ + "index.d.ts", + "checkbox.d.ts", + "text-area.d.ts", + "text-field.d.ts", + "helper.d.ts", + "test/lib/assert.ts", + "test/component.ts", + "test/helper.ts" + ] +} diff --git a/types/ember__component/tslint.json b/types/ember__component/tslint.json new file mode 100644 index 0000000000..10d875b8db --- /dev/null +++ b/types/ember__component/tslint.json @@ -0,0 +1,4 @@ +{ + "extends": "dtslint/dt.json", + "rules": {} +}