ember-source 7.3.0-alpha.5 → 7.3.0-beta.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (159) hide show
  1. package/build-metadata.json +3 -3
  2. package/dist/dev/packages/@ember/-internals/deprecations/index.js +9 -0
  3. package/dist/dev/packages/@ember/-internals/glimmer/index.js +7 -7
  4. package/dist/dev/packages/@ember/-internals/routing/index.js +2 -2
  5. package/dist/dev/packages/@ember/-internals/runtime/index.js +1 -1
  6. package/dist/dev/packages/@ember/-internals/runtime/lib/ext/rsvp.js +1 -1
  7. package/dist/dev/packages/@ember/-internals/runtime/lib/mixins/action_handler.js +4 -0
  8. package/dist/dev/packages/@ember/-internals/runtime/lib/mixins/target_action_support.js +3 -0
  9. package/dist/dev/packages/@ember/-internals/views/lib/mixins/action_support.js +2 -0
  10. package/dist/dev/packages/@ember/application/index.js +3 -3
  11. package/dist/dev/packages/@ember/application/instance.js +9 -9
  12. package/dist/dev/packages/@ember/component/helper.js +2 -2
  13. package/dist/dev/packages/@ember/component/index.js +3 -3
  14. package/dist/dev/packages/@ember/engine/index.js +3 -3
  15. package/dist/dev/packages/@ember/engine/instance.js +1 -1
  16. package/dist/dev/packages/@ember/helper/index.js +1132 -79
  17. package/dist/dev/packages/@ember/modifier/on.js +1 -1
  18. package/dist/dev/packages/@ember/object/compat.js +0 -32
  19. package/dist/dev/packages/@ember/renderer/index.js +1 -1
  20. package/dist/dev/packages/@ember/routing/-internals.js +2 -2
  21. package/dist/dev/packages/@ember/routing/index.js +11 -28
  22. package/dist/dev/packages/@ember/routing/lib/utils.js +2 -2
  23. package/dist/dev/packages/@ember/routing/route.js +2 -2
  24. package/dist/dev/packages/@ember/routing/router-service.js +9 -9
  25. package/dist/dev/packages/@ember/routing/router.js +2 -2
  26. package/dist/dev/packages/@ember/template-compiler/lib/compile-options.js +3 -3
  27. package/dist/dev/packages/@ember/template-compiler/lib/template.js +2 -2
  28. package/dist/dev/packages/@ember/template-factory/index.js +1 -1
  29. package/dist/dev/packages/@glimmer/opcode-compiler/index.js +2 -2
  30. package/dist/dev/packages/@glimmer/program/index.js +3 -3
  31. package/dist/dev/packages/@glimmer/runtime/index.js +7 -7
  32. package/dist/dev/packages/@glimmer/wire-format/index.js +2 -5
  33. package/dist/dev/packages/ember/version.js +1 -1
  34. package/dist/dev/packages/ember-template-compiler/index.js +2 -2
  35. package/dist/dev/packages/router_js/index.js +2 -2
  36. package/dist/dev/packages/rsvp/index.js +1 -2281
  37. package/dist/dev/packages/shared-chunks/{arguments-CDkbOqTS.js → arguments-DniR8eF2.js} +5 -18
  38. package/dist/dev/packages/shared-chunks/{compiler-QUSl_urU.js → compiler-BHFFl-fv.js} +1 -1
  39. package/dist/dev/packages/shared-chunks/{curly-BbL6STF2.js → curly-BCD_vyHq.js} +1 -1
  40. package/dist/dev/packages/shared-chunks/{element-BYLB-q7a.js → element-Cgoi4ldD.js} +0 -24
  41. package/dist/dev/packages/shared-chunks/get-zsePWrJL.js +40 -0
  42. package/dist/dev/packages/shared-chunks/hash-BFu91gtE.js +57 -0
  43. package/dist/dev/packages/shared-chunks/{index-Czn34wUZ.js → index-B5gBbO_p.js} +193 -77
  44. package/dist/dev/packages/shared-chunks/{index-DaFzpTIE.js → index-BYUSIu_W.js} +3 -3
  45. package/dist/dev/packages/shared-chunks/{invoke-d9sqa50M.js → invoke-CgF42joE.js} +1 -1
  46. package/dist/dev/packages/shared-chunks/{not-DYh6AY9Z.js → not-0cVb-rLf.js} +1 -1
  47. package/dist/dev/packages/shared-chunks/{on-DlF0Wy7P.js → on-CVIjn2C-.js} +22 -11
  48. package/dist/dev/packages/shared-chunks/{opcodes-CplRyHl_.js → opcodes-DDajoGhq.js} +0 -4
  49. package/dist/dev/packages/shared-chunks/{outlet-B4qORyui.js → outlet-BO5-QFmm.js} +3 -3
  50. package/dist/dev/packages/shared-chunks/{program-context-Dq8xN2HI.js → program-context-BBB1Ga5h.js} +2 -2
  51. package/dist/dev/packages/shared-chunks/{render-CtH73XOv.js → render-D_Rawf-r.js} +2 -2
  52. package/dist/{prod/packages/shared-chunks/rsvp.es-DR7yS7qg.js → dev/packages/shared-chunks/rsvp-aLN_pQtn.js} +152 -148
  53. package/dist/dev/packages/shared-chunks/{setup-registry-h519ZsHS.js → setup-registry-Dp5dtaLa.js} +35 -13
  54. package/dist/{prod/packages/shared-chunks/syscall-ops-CN7STuUn.js → dev/packages/shared-chunks/syscall-ops-CkPT1Kfx.js} +1 -2
  55. package/dist/dev/packages/shared-chunks/{textarea-DEvw4ezm.js → textarea-DvS6Xmdh.js} +3 -23
  56. package/dist/dev/packages/shared-chunks/{unique-id-DQOhouG1.js → unique-id-Csxuh1I7.js} +0 -4
  57. package/dist/dev/packages/shared-chunks/{unrecognized-url-error-B8loxkay.js → unrecognized-url-error-cXUp-SK3.js} +1 -1
  58. package/dist/prod/packages/@ember/-internals/deprecations/index.js +9 -0
  59. package/dist/prod/packages/@ember/-internals/glimmer/index.js +7 -7
  60. package/dist/prod/packages/@ember/-internals/routing/index.js +2 -2
  61. package/dist/prod/packages/@ember/-internals/runtime/index.js +1 -1
  62. package/dist/prod/packages/@ember/-internals/runtime/lib/ext/rsvp.js +1 -1
  63. package/dist/prod/packages/@ember/-internals/runtime/lib/mixins/action_handler.js +4 -0
  64. package/dist/prod/packages/@ember/-internals/runtime/lib/mixins/target_action_support.js +3 -0
  65. package/dist/prod/packages/@ember/-internals/views/lib/mixins/action_support.js +2 -0
  66. package/dist/prod/packages/@ember/application/index.js +3 -3
  67. package/dist/prod/packages/@ember/application/instance.js +9 -9
  68. package/dist/prod/packages/@ember/component/helper.js +2 -2
  69. package/dist/prod/packages/@ember/component/index.js +3 -3
  70. package/dist/prod/packages/@ember/engine/index.js +3 -3
  71. package/dist/prod/packages/@ember/engine/instance.js +1 -1
  72. package/dist/prod/packages/@ember/helper/index.js +1132 -79
  73. package/dist/prod/packages/@ember/modifier/on.js +1 -1
  74. package/dist/prod/packages/@ember/object/compat.js +0 -32
  75. package/dist/prod/packages/@ember/renderer/index.js +1 -1
  76. package/dist/prod/packages/@ember/routing/index.js +10 -27
  77. package/dist/prod/packages/@ember/routing/lib/utils.js +2 -2
  78. package/dist/prod/packages/@ember/routing/route.js +2 -2
  79. package/dist/prod/packages/@ember/routing/router-service.js +9 -9
  80. package/dist/prod/packages/@ember/routing/router.js +2 -2
  81. package/dist/prod/packages/@ember/template-compiler/lib/compile-options.js +3 -3
  82. package/dist/prod/packages/@ember/template-compiler/lib/template.js +2 -2
  83. package/dist/prod/packages/@ember/template-factory/index.js +1 -1
  84. package/dist/prod/packages/@glimmer/opcode-compiler/index.js +2 -2
  85. package/dist/prod/packages/@glimmer/program/index.js +3 -3
  86. package/dist/prod/packages/@glimmer/runtime/index.js +7 -7
  87. package/dist/prod/packages/@glimmer/wire-format/index.js +2 -5
  88. package/dist/prod/packages/ember/version.js +1 -1
  89. package/dist/prod/packages/ember-template-compiler/index.js +2 -2
  90. package/dist/prod/packages/router_js/index.js +2 -2
  91. package/dist/prod/packages/rsvp/index.js +1 -2281
  92. package/dist/prod/packages/shared-chunks/{arguments-BzAkZVBa.js → arguments-CCYATlEH.js} +1 -18
  93. package/dist/prod/packages/shared-chunks/{compiler-lBSssiWp.js → compiler-Wt5SWcrF.js} +1 -1
  94. package/dist/prod/packages/shared-chunks/{curly-CU2jYOtm.js → curly-CdvJuTyW.js} +1 -1
  95. package/dist/prod/packages/shared-chunks/{element-DgHdPZ8u.js → element-BmBjPjkQ.js} +0 -24
  96. package/dist/prod/packages/shared-chunks/get-CEjFJzGs.js +40 -0
  97. package/dist/prod/packages/shared-chunks/hash-BitfXhCx.js +57 -0
  98. package/dist/prod/packages/shared-chunks/{index-XmtQRWbX.js → index-C4VEqlp7.js} +193 -77
  99. package/dist/prod/packages/shared-chunks/{index-Bf53M8eS.js → index-kwuZeaNz.js} +3 -3
  100. package/dist/prod/packages/shared-chunks/{invoke-DhQ5QRp2.js → invoke-4JGJYH7Z.js} +1 -1
  101. package/dist/prod/packages/shared-chunks/{not-BOIVROuv.js → not-Dn5s9qVZ.js} +1 -1
  102. package/dist/prod/packages/shared-chunks/{on-BZHAxzdq.js → on-ov4KAucw.js} +22 -11
  103. package/dist/prod/packages/shared-chunks/{opcodes-CplRyHl_.js → opcodes-DDajoGhq.js} +0 -4
  104. package/dist/prod/packages/shared-chunks/{outlet-CsNMfeOj.js → outlet-BWnaVOrA.js} +3 -3
  105. package/dist/prod/packages/shared-chunks/{program-context-COSioH46.js → program-context-WVlzpPdi.js} +2 -2
  106. package/dist/prod/packages/shared-chunks/{render-Bf7GviCY.js → render-BAVl5E6X.js} +2 -2
  107. package/dist/{dev/packages/shared-chunks/rsvp.es-DR7yS7qg.js → prod/packages/shared-chunks/rsvp-aLN_pQtn.js} +152 -148
  108. package/dist/prod/packages/shared-chunks/{setup-registry-DFSQHIUs.js → setup-registry-DI1Agp-0.js} +35 -13
  109. package/dist/{dev/packages/shared-chunks/syscall-ops-CN7STuUn.js → prod/packages/shared-chunks/syscall-ops-CkPT1Kfx.js} +1 -2
  110. package/dist/prod/packages/shared-chunks/{textarea-DMmdvgk2.js → textarea-B-sssXGa.js} +3 -23
  111. package/dist/prod/packages/shared-chunks/{unique-id-o2pS74go.js → unique-id-BJb1p8EG.js} +0 -4
  112. package/dist/prod/packages/shared-chunks/{unrecognized-url-error-jjQ-FqKB.js → unrecognized-url-error-xC654tCo.js} +1 -1
  113. package/docs/data.json +1237 -1395
  114. package/package.json +5 -4
  115. package/types/stable/@ember/-internals/deprecations/index.d.ts +6 -0
  116. package/types/stable/@ember/-internals/glimmer/index.d.ts +7 -380
  117. package/types/stable/@ember/-internals/glimmer/lib/component.d.ts +1 -1
  118. package/types/stable/@ember/-internals/glimmer/lib/helper.d.ts +2 -2
  119. package/types/stable/@ember/-internals/glimmer/lib/helpers/each-in.d.ts +171 -62
  120. package/types/stable/@ember/-internals/glimmer/lib/helpers/element.d.ts +0 -24
  121. package/types/stable/@ember/-internals/glimmer/lib/helpers/mut.d.ts +3 -2
  122. package/types/stable/@ember/-internals/glimmer/lib/helpers/readonly.d.ts +3 -1
  123. package/types/stable/@ember/-internals/glimmer/lib/helpers/unbound.d.ts +6 -2
  124. package/types/stable/@ember/-internals/glimmer/lib/helpers/unique-id.d.ts +0 -3
  125. package/types/stable/@ember/-internals/glimmer/lib/syntax/mount.d.ts +4 -2
  126. package/types/stable/@ember/-internals/glimmer/lib/syntax/outlet.d.ts +7 -2
  127. package/types/stable/@ember/helper/index.d.ts +1113 -73
  128. package/types/stable/@ember/object/compat.d.ts +0 -32
  129. package/types/stable/@ember/object/core.d.ts +1 -1
  130. package/types/stable/@ember/routing/router-service.d.ts +9 -9
  131. package/types/stable/@glimmer/interfaces/lib/compile/wire-format/api.d.ts +1 -9
  132. package/types/stable/@glimmer/interfaces/lib/compile/wire-format/opcodes.d.ts +0 -4
  133. package/types/stable/@glimmer/interfaces/lib/vm-opcodes.d.ts +0 -4
  134. package/types/stable/@glimmer/opcode-compiler/lib/opcode-builder/helpers/conditional.d.ts +1 -1
  135. package/types/stable/@glimmer/opcode-compiler/lib/syntax/statements.d.ts +1 -1
  136. package/types/stable/@glimmer/runtime/lib/helpers/array.d.ts +0 -33
  137. package/types/stable/@glimmer/runtime/lib/helpers/concat.d.ts +0 -25
  138. package/types/stable/@glimmer/runtime/lib/helpers/fn.d.ts +0 -70
  139. package/types/stable/@glimmer/runtime/lib/helpers/get.d.ts +0 -69
  140. package/types/stable/@glimmer/runtime/lib/helpers/hash.d.ts +0 -36
  141. package/types/stable/index.d.ts +0 -14
  142. package/dist/dev/packages/shared-chunks/get-6I3sjd-I.js +0 -135
  143. package/dist/dev/packages/shared-chunks/hash-6NDs_5_f.js +0 -198
  144. package/dist/prod/packages/shared-chunks/get-Dago5uGl.js +0 -135
  145. package/dist/prod/packages/shared-chunks/hash-gEXIsSO4.js +0 -198
  146. package/types/stable/@ember/-internals/glimmer/lib/helpers/array.d.ts +0 -43
  147. package/types/stable/@ember/-internals/glimmer/lib/helpers/component.d.ts +0 -93
  148. package/types/stable/@ember/-internals/glimmer/lib/helpers/concat.d.ts +0 -32
  149. package/types/stable/@ember/-internals/glimmer/lib/helpers/fn.d.ts +0 -77
  150. package/types/stable/@ember/-internals/glimmer/lib/helpers/get.d.ts +0 -94
  151. package/types/stable/@ember/-internals/glimmer/lib/helpers/hash.d.ts +0 -46
  152. package/types/stable/@ember/-internals/glimmer/lib/helpers/helper.d.ts +0 -43
  153. package/types/stable/@ember/-internals/glimmer/lib/helpers/if-unless.d.ts +0 -228
  154. package/types/stable/@ember/-internals/glimmer/lib/helpers/log.d.ts +0 -19
  155. package/types/stable/@ember/-internals/glimmer/lib/helpers/modifier.d.ts +0 -42
  156. package/types/stable/@ember/-internals/glimmer/lib/helpers/page-title.d.ts +0 -24
  157. package/types/stable/@ember/-internals/glimmer/lib/modifiers/on.d.ts +0 -95
  158. package/types/stable/@ember/-internals/glimmer/lib/syntax/in-element.d.ts +0 -49
  159. package/types/stable/@ember/-internals/glimmer/lib/syntax/let.d.ts +0 -43
@@ -1,77 +0,0 @@
1
- declare module '@ember/-internals/glimmer/lib/helpers/fn' {
2
- /**
3
- @module ember
4
- */
5
- /**
6
- The `fn` helper allows you to ensure a function that you are passing off
7
- to another component, helper, or modifier has access to arguments that are
8
- available in the template.
9
-
10
- For example, if you have an `each` helper looping over a number of items, you
11
- may need to pass a function that expects to receive the item as an argument
12
- to a component invoked within the loop. Here's how you could use the `fn`
13
- helper to pass both the function and its arguments together:
14
-
15
- ```app/components/items-listing.gjs
16
- <template>
17
- {{#each @items as |item|}}
18
- <DisplayItem @item=item @select={{fn this.handleSelected item}} />
19
- {{/each}}
20
- </template>
21
- ```
22
-
23
- ```app/components/items-list.gjs
24
- import Component from '@glimmer/component';
25
- import { action } from '@ember/object';
26
-
27
- export default class ItemsList extends Component {
28
- @action
29
- handleSelected(item) {
30
- // ...snip...
31
- }
32
- }
33
- ```
34
-
35
- In this case the `DisplayItem` component will receive a normal function
36
- that it can invoke. When it invokes the function, the `handleSelected`
37
- function will receive the `item` and any arguments passed, thanks to the
38
- `fn` helper.
39
-
40
- Let's take look at what that means in a couple circumstances:
41
-
42
- - When invoked as `this.args.select()` the `handleSelected` function will
43
- receive the `item` from the loop as its first and only argument.
44
- - When invoked as `this.args.select('foo')` the `handleSelected` function
45
- will receive the `item` from the loop as its first argument and the
46
- string `'foo'` as its second argument.
47
-
48
- In the example above, we used `@action` to ensure that `handleSelected` is
49
- properly bound to the `items-list`, but let's explore what happens if we
50
- left out `@action`:
51
-
52
- ```app/components/items-list.gjs
53
- import Component from '@glimmer/component';
54
-
55
- export default class ItemsList extends Component {
56
- handleSelected(item) {
57
- // ...snip...
58
- }
59
- }
60
- ```
61
-
62
- In this example, when `handleSelected` is invoked inside the `display-item`
63
- component, it will **not** have access to the component instance. In other
64
- words, it will have no `this` context, so please make sure your functions
65
- are bound (via `@action` or other means) before passing into `fn`!
66
-
67
- See also [partial application](https://en.wikipedia.org/wiki/Partial_application).
68
-
69
- `fn` is built-in and does not need to be imported.
70
-
71
- @method fn
72
- @for @ember/helper
73
- @public
74
- @since 3.11.0
75
- */
76
- export {};
77
- }
@@ -1,94 +0,0 @@
1
- declare module '@ember/-internals/glimmer/lib/helpers/get' {
2
- /**
3
- @module ember
4
- */
5
- /**
6
- Dynamically look up a property on an object or an element in an array.
7
- The second argument to `{{get}}` should have a string or number value,
8
- although it can be bound.
9
-
10
- For example, these two usages are equivalent:
11
-
12
- ```app/components/developer-detail.gjs
13
- import Component from '@glimmer/component';
14
- import { tracked } from '@glimmer/tracking';
15
- import { get } from '@ember/object';
16
-
17
- export default class extends Component {
18
- @tracked developer = {
19
- name: "Sandi Metz",
20
- language: "Ruby"
21
- }
22
-
23
- <template>
24
- {{this.developer.name}}
25
- {{get this.developer "name"}}
26
- </template>
27
- }
28
- ```
29
-
30
- If there were several facts about a person, the `{{get}}` helper can dynamically
31
- pick one:
32
-
33
- ```app/templates/application.gjs
34
- import DeveloperDetail from '../components/developer-detail';
35
-
36
- <template>
37
- <DeveloperDetail @factName="language" />
38
- </template
39
- ```
40
-
41
- ```handlebars
42
- {{get this.developer @factName}}
43
- ```
44
-
45
- For a more complex example, this template would allow the user to switch
46
- between showing the user's name and preferred coding language with a click:
47
-
48
- ```app/components/developer-detail.gjs
49
- import Component from '@glimmer/component';
50
- import { tracked } from '@glimmer/tracking';
51
- import { get } from '@ember/object';
52
-
53
- export default class extends Component {
54
- @tracked developer = {
55
- name: "Sandi Metz",
56
- language: "Ruby"
57
- }
58
-
59
- @tracked currentFact = 'name'
60
-
61
- @action
62
- showFact(fact) {
63
- this.currentFact = fact;
64
- }
65
-
66
- <template>
67
- {{get this.developer this.currentFact}}
68
-
69
- <button {{on 'click' (fn this.showFact "name")}}>Show name</button>
70
- <button {{on 'click' (fn this.showFact "language")}}>Show language</button>
71
- </template>
72
- }
73
- ```
74
-
75
- The `{{get}}` helper can also be used for array element access via index.
76
- This would display the value of the first element in the array `this.names`:
77
-
78
- ```handlebars
79
- {{get this.names 0}}
80
- ```
81
-
82
- Array element access also works with a dynamic second argument:
83
-
84
- ```handlebars
85
- {{get this.names @index}}
86
- ```
87
-
88
- @public
89
- @method get
90
- @for @ember/helper
91
- @since 2.1.0
92
- */
93
- export {};
94
- }
@@ -1,46 +0,0 @@
1
- declare module '@ember/-internals/glimmer/lib/helpers/hash' {
2
- /**
3
- @module ember
4
- */
5
- /**
6
- Use the `{{hash}}` helper to create a hash to pass as an option to your
7
- components. This is especially useful for contextual components where you can
8
- just yield a hash:
9
-
10
- ```handlebars
11
- {{yield (hash
12
- name='Sarah'
13
- title=office
14
- )}}
15
- ```
16
-
17
- Would result in an object such as:
18
-
19
- ```js
20
- { name: 'Sarah', title: this.get('office') }
21
- ```
22
-
23
- Where the `title` is bound to updates of the `office` property.
24
-
25
- Note that the hash is an empty object with no prototype chain, therefore
26
- common methods like `toString` are not available in the resulting hash.
27
- If you need to use such a method, you can use the `call` or `apply`
28
- approach:
29
-
30
- ```js
31
- function toString(obj) {
32
- return Object.prototype.toString.apply(obj);
33
- }
34
- ```
35
-
36
- The `hash` helper is a built-in keyword and does not need to be imported as of v7.1.0.
37
-
38
- @method hash
39
- @for @ember/helper
40
- @param {Object} options
41
- @return {Object} Hash
42
- @since 2.3.0
43
- @public
44
- */
45
- export {};
46
- }
@@ -1,43 +0,0 @@
1
- declare module '@ember/-internals/glimmer/lib/helpers/helper' {
2
- /**
3
- @module ember
4
- */
5
- /**
6
- Use the `{{helper}}` helper to create contextual helper so
7
- that it can be passed around as first-class values in templates.
8
-
9
- ```handlebars
10
- {{#let (helper "join-words" "foo" "bar" separator=" ") as |foo-bar|}}
11
-
12
- {{!-- this is equivalent to invoking `{{join-words "foo" "bar" separator=" "}}` --}}
13
- {{foo-bar}}
14
-
15
- {{!-- this will pass the helper itself into the component, instead of invoking it now --}}
16
- <MyComponent @helper={{helper foo-bar "baz"}} />
17
-
18
- {{!-- this will yield the helper itself ("contextual helper"), instead of invoking it now --}}
19
- {{yield foo-bar}}
20
- {{/let}}
21
- ```
22
-
23
- ### Arguments
24
-
25
- The `{{helper}}` helper works similarly to the [`{{component}}`](./component?anchor=component) and
26
- [`{{modifier}}`](./modifier?anchor=modifier) helper:
27
-
28
- * When passed a string (e.g. `(helper "foo")`) as the first argument,
29
- it will produce an opaque, internal "helper definition" object
30
- that can be passed around and invoked elsewhere.
31
-
32
- * Any additional positional and/or named arguments (a.k.a. params and hash)
33
- will be stored ("curried") inside the definition object, such that, when invoked,
34
- these arguments will be passed along to the referenced helper.
35
-
36
-
37
- @method helper
38
- @for Ember.Templates.helpers
39
- @public
40
- @since 3.27.0
41
- */
42
- export {};
43
- }
@@ -1,228 +0,0 @@
1
- declare module '@ember/-internals/glimmer/lib/helpers/if-unless' {
2
- /**
3
- @module ember
4
- */
5
- /**
6
- The `if` helper allows you to conditionally render one of two branches,
7
- depending on the "truthiness" of a property.
8
- For example the following values are all falsey: `false`, `undefined`, `null`, `""`, `0`, `NaN` or an empty array.
9
-
10
- This helper has two forms, block and inline.
11
-
12
- ## Block form
13
-
14
- You can use the block form of `if` to conditionally render a section of the template.
15
-
16
- To use it, pass the conditional value to the `if` helper,
17
- using the block form to wrap the section of template you want to conditionally render.
18
- Like so:
19
-
20
- ```app/templates/application.gjs
21
- import Weather from '../components/weather';
22
-
23
- <template>
24
- <Weather />
25
- </template>
26
- ```
27
-
28
- ```app/components/weather.gjs
29
- <template>
30
- {{! will not render because greeting is undefined}}
31
- {{#if @isRaining}}
32
- Yes, grab an umbrella!
33
- {{/if}}
34
- </template>
35
- ```
36
-
37
- You can also define what to show if the property is falsey by using
38
- the `else` helper.
39
-
40
- ```app/components/weather.gjs
41
- <template>
42
- {{#if @isRaining}}
43
- Yes, grab an umbrella!
44
- {{else}}
45
- No, it's lovely outside!
46
- {{/if}}
47
- </template>
48
- ```
49
-
50
- You are also able to combine `else` and `if` helpers to create more complex
51
- conditional logic.
52
-
53
- For the following template:
54
-
55
- ```app/components/weather.gjs
56
- <template>
57
- {{#if @isRaining}}
58
- Yes, grab an umbrella!
59
- {{else if @isCold}}
60
- Grab a coat, it's chilly!
61
- {{else}}
62
- No, it's lovely outside!
63
- {{/if}}
64
- </template>
65
- ```
66
-
67
- If you call it by saying `isCold` is true:
68
-
69
- ```app/templates/application.gjs
70
- import Weather from '../components/weather';
71
-
72
- <template>
73
- <Weather @isCold={{true}} />
74
- </template>
75
- ```
76
-
77
- Then `Grab a coat, it's chilly!` will be rendered.
78
-
79
- ## Inline form
80
-
81
- The inline `if` helper conditionally renders a single property or string.
82
-
83
- In this form, the `if` helper receives three arguments, the conditional value,
84
- the value to render when truthy, and the value to render when falsey.
85
-
86
- For example, if `useLongGreeting` is truthy, the following:
87
-
88
- ```app/templates/application.gjs
89
- import Greeting from '../components/greeting';
90
-
91
- <template>
92
- <Greeting @useLongGreeting={{true}} />
93
- <template>
94
- ```
95
-
96
- ```app/components/greeting.gjs
97
- <template>
98
- {{if @useLongGreeting "Hello" "Hi"}} Alex
99
- <template>
100
- ```
101
-
102
- Will render:
103
-
104
- ```html
105
- Hello Alex
106
- ```
107
-
108
- One detail to keep in mind is that both branches of the `if` helper will be evaluated,
109
- so if you have `{{if condition "foo" (expensive-operation "bar")`,
110
- `expensive-operation` will always calculate.
111
-
112
- `if` is built-in and does not need to be imported.
113
-
114
- @method if
115
- @for Ember.Templates.helpers
116
- @public
117
- */
118
- /**
119
- The `unless` helper is the inverse of the `if` helper. It displays if a value
120
- is falsey ("not true" or "is false"). Example values that will display with
121
- `unless`: `false`, `undefined`, `null`, `""`, `0`, `NaN` or an empty array.
122
-
123
- ## Inline form
124
-
125
- The inline `unless` helper conditionally renders a single property or string.
126
- This helper acts like a ternary operator. If the first property is falsy,
127
- the second argument will be displayed, otherwise, the third argument will be
128
- displayed
129
-
130
- For example, if you pass a falsey `useLongGreeting` to the `Greeting` component:
131
-
132
- ```app/templates/application.gjs
133
- import Greeting from '../components/greeting';
134
-
135
- <template>
136
- <Greeting @useLongGreeting={{false}} />
137
- </template>
138
- ```
139
-
140
- ```app/components/greeting.gjs
141
- <template>
142
- {{unless @useLongGreeting "Hi" "Hello"}} Ben
143
- </template>
144
- ```
145
-
146
- Then it will display:
147
-
148
- ```html
149
- Hi Ben
150
- ```
151
-
152
- ## Block form
153
-
154
- Like the `if` helper, the `unless` helper also has a block form.
155
-
156
- The following will not render anything:
157
-
158
- ```app/templates/application.gjs
159
- import Greeting from '../components/greeting';
160
-
161
- <template>
162
- <Greeting />
163
- </template>
164
- ```
165
-
166
- ```app/components/greeting.gjs
167
- <template>
168
- {{#unless @greeting}}
169
- No greeting was found. Why not set one?
170
- {{/unless}}
171
- </template>
172
- ```
173
-
174
- You can also use an `else` helper with the `unless` block. The
175
- `else` will display if the value is truthy.
176
-
177
- If you have the following component:
178
-
179
- ```app/components/logged-in.gjs
180
- <template>
181
- {{#unless @userData}}
182
- Please login.
183
- {{else}}
184
- Welcome back!
185
- {{/unless}}
186
- </template>
187
- ```
188
-
189
- Calling it with a truthy `userData`:
190
-
191
- ```app/templates/application.gjs
192
- import LoggedIn from '../components/logged-in';
193
-
194
- <template>
195
- <LoggedIn @userData={{hash username="Zoey"}} />
196
- </template>
197
- ```
198
-
199
- Will render:
200
-
201
- ```html
202
- Welcome back!
203
- ```
204
-
205
- and calling it with a falsey `userData`:
206
-
207
- ```app/templates/application.gjs
208
- import LoggedIn from '../components/logged-in';
209
-
210
- <template>
211
- <LoggedIn @userData={{false}} />
212
- </template>
213
- ```
214
-
215
- Will render:
216
-
217
- ```html
218
- Please login.
219
- ```
220
-
221
- `unless` is built-in and does not need to be imported.
222
-
223
- @method unless
224
- @for Ember.Templates.helpers
225
- @public
226
- */
227
- export {};
228
- }
@@ -1,19 +0,0 @@
1
- declare module '@ember/-internals/glimmer/lib/helpers/log' {
2
- /**
3
- @module ember
4
- */
5
- /**
6
- `log` allows you to output the value of variables in the current rendering
7
- context. `log` also accepts primitive types such as strings or numbers.
8
-
9
- ```handlebars
10
- {{log "myVariable:" myVariable }}
11
- ```
12
-
13
- @method log
14
- @for Ember.Templates.helpers
15
- @param {Array} params
16
- @public
17
- */
18
- export {};
19
- }
@@ -1,42 +0,0 @@
1
- declare module '@ember/-internals/glimmer/lib/helpers/modifier' {
2
- /**
3
- @module ember
4
- */
5
- /**
6
- Use the `{{modifier}}` helper to create contextual modifier so
7
- that it can be passed around as first-class values in templates.
8
-
9
- ```handlebars
10
- {{#let (modifier "click-outside" click=this.submit) as |on-click-outside|}}
11
-
12
- {{!-- this is equivalent to `<MyComponent {{click-outside click=this.submit}} />` --}}
13
- <MyComponent {{on-click-outside}} />
14
-
15
- {{!-- this will pass the modifier itself into the component, instead of invoking it now --}}
16
- <MyComponent @modifier={{modifier on-click-outside "extra" "args"}} />
17
-
18
- {{!-- this will yield the modifier itself ("contextual modifier"), instead of invoking it now --}}
19
- {{yield on-click-outside}}
20
- {{/let}}
21
- ```
22
-
23
- ### Arguments
24
-
25
- The `{{modifier}}` helper works similarly to the [`{{component}}`](./component?anchor=component) and
26
- [`{{helper}}`](./helper?anchor=helper) helper:
27
-
28
- * When passed a string (e.g. `(modifier "foo")`) as the first argument,
29
- it will produce an opaque, internal "modifier definition" object
30
- that can be passed around and invoked elsewhere.
31
-
32
- * Any additional positional and/or named arguments (a.k.a. params and hash)
33
- will be stored ("curried") inside the definition object, such that, when invoked,
34
- these arguments will be passed along to the referenced modifier.
35
-
36
- @method modifier
37
- @for Ember.Templates.helpers
38
- @public
39
- @since 3.27.0
40
- */
41
- export {};
42
- }
@@ -1,24 +0,0 @@
1
- declare module '@ember/-internals/glimmer/lib/helpers/page-title' {
2
- /**
3
- @module ember
4
- */
5
- /**
6
- `page-title` allows you to set the title of any page in your application and
7
- append additional titles for each route. For complete documentation, see
8
- https://github.com/ember-cli/ember-page-title.
9
-
10
- ```gjs
11
- import pageTitle from 'ember-page-title/helpers/page-title';
12
-
13
- <template>
14
- {{pageTitle "My Page Title" }}
15
- </template>
16
- ```
17
-
18
- @method page-title
19
- @for Ember.Templates.helpers
20
- @param {String} param
21
- @public
22
- */
23
- export {};
24
- }
@@ -1,95 +0,0 @@
1
- declare module '@ember/-internals/glimmer/lib/modifiers/on' {
2
- /**
3
- @module ember
4
- */
5
- /**
6
- The `{{on}}` modifier lets you easily add event listeners (it uses
7
- [EventTarget.addEventListener](https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener)
8
- internally).
9
-
10
- For example, if you'd like to run a function on your component when a `<button>`
11
- in the components template is clicked you might do something like:
12
-
13
- ```app/components/like-post.gjs
14
- import Component from '@glimmer/component';
15
- import { action } from '@ember/object';
16
-
17
- export default class LikePost extends Component {
18
- @action
19
- saveLike() {
20
- // someone likes your post!
21
- // better send a request off to your server...
22
- }
23
-
24
- <template>
25
- <button {{on 'click' this.saveLike}}>Like this post!</button>
26
- </template>
27
- }
28
- ```
29
-
30
- ### Arguments
31
-
32
- `{{on}}` accepts two positional arguments, and a few named arguments.
33
-
34
- The positional arguments are:
35
-
36
- - `event` -- the name to use when calling `addEventListener`
37
- - `callback` -- the function to be passed to `addEventListener`
38
-
39
- The named arguments are:
40
-
41
- - capture -- a `true` value indicates that events of this type will be dispatched
42
- to the registered listener before being dispatched to any EventTarget beneath it
43
- in the DOM tree.
44
- - once -- indicates that the listener should be invoked at most once after being
45
- added. If true, the listener would be automatically removed when invoked.
46
- - passive -- if `true`, indicates that the function specified by listener will never
47
- call preventDefault(). If a passive listener does call preventDefault(), the user
48
- agent will do nothing other than generate a console warning. See
49
- [Improving scrolling performance with passive listeners](https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#Improving_scrolling_performance_with_passive_listeners)
50
- to learn more.
51
-
52
- The callback function passed to `{{on}}` will receive any arguments that are passed
53
- to the event handler. Most commonly this would be the `event` itself.
54
-
55
- If you would like to pass additional arguments to the function you should use
56
- the `{{fn}}` helper.
57
-
58
- For example, in our example case above if you'd like to pass in the post that
59
- was being liked when the button is clicked you could do something like:
60
-
61
- ```hbs
62
- <button {{on 'click' (fn this.saveLike @post)}}>Like this post!</button>
63
- ```
64
-
65
- In this case, the `saveLike` function will receive two arguments: the click event
66
- and the value of `@post`.
67
-
68
- ### Function Context
69
-
70
- In the example above, we used `@action` to ensure that `likePost` is
71
- properly bound to the `LikePost` Component, but let's explore what happens if we
72
- left out `@action`:
73
-
74
- ```app/components/like-post.gjs
75
- import Component from '@glimmer/component';
76
-
77
- export default class LikePost extends Component {
78
- saveLike() {
79
- // ...snip...
80
- }
81
- }
82
- ```
83
-
84
- In this example, when the button is clicked `saveLike` will be invoked,
85
- it will **not** have access to the component instance. In other
86
- words, it will have no `this` context, so please make sure your functions
87
- are bound (via `@action` or other means) before passing into `on`!
88
-
89
- @method on
90
- @for Ember.Templates.helpers
91
- @public
92
- @since 3.11.0
93
- */
94
- export {};
95
- }