ember-source 7.1.0-alpha.5 → 7.1.0
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.
- package/build-metadata.json +3 -3
- package/dist/dev/packages/@ember/-internals/glimmer/index.js +11 -11
- package/dist/dev/packages/@ember/-internals/runtime/lib/mixins/target_action_support.js +1 -1
- package/dist/dev/packages/@ember/-internals/views/index.js +0 -1
- package/dist/dev/packages/@ember/-internals/views/lib/views/core_view.js +1 -1
- package/dist/dev/packages/@ember/application/index.js +1 -1
- package/dist/dev/packages/@ember/application/instance.js +1 -1
- package/dist/dev/packages/@ember/array/index.js +4 -0
- package/dist/dev/packages/@ember/component/helper.js +1 -1
- package/dist/dev/packages/@ember/component/index.js +15 -9
- package/dist/dev/packages/@ember/component/template-only.js +1 -1
- package/dist/dev/packages/@ember/engine/index.js +1 -3
- package/dist/dev/packages/@ember/helper/index.js +8 -37
- package/dist/dev/packages/@ember/modifier/index.js +2 -2
- package/dist/dev/packages/@ember/modifier/on.js +1 -1
- package/dist/dev/packages/@ember/object/index.js +22 -17
- package/dist/dev/packages/@ember/reactive/collections.js +2 -0
- package/dist/dev/packages/@ember/renderer/index.js +1 -1
- package/dist/dev/packages/@ember/routing/index.js +11 -7
- package/dist/dev/packages/@ember/routing/route.js +3 -3
- package/dist/dev/packages/@ember/routing/router-service.js +20 -13
- package/dist/dev/packages/@ember/template-compiler/lib/compile-options.js +3 -3
- package/dist/dev/packages/@ember/template-compiler/lib/template.js +3 -3
- package/dist/dev/packages/@ember/template-factory/index.js +1 -1
- package/dist/dev/packages/@glimmer/destroyable/index.js +1 -1
- package/dist/dev/packages/@glimmer/manager/index.js +3 -3
- package/dist/dev/packages/@glimmer/node/index.js +2 -2
- package/dist/dev/packages/@glimmer/opcode-compiler/index.js +2 -5
- package/dist/dev/packages/@glimmer/program/index.js +4 -4
- package/dist/dev/packages/@glimmer/runtime/index.js +10 -12
- package/dist/dev/packages/@glimmer/vm/index.js +1 -1
- package/dist/dev/packages/ember/version.js +1 -1
- package/dist/dev/packages/ember-template-compiler/index.js +2 -2
- package/dist/dev/packages/shared-chunks/{api-AYt3zE12.js → api-BAmlf_CN.js} +1 -1
- package/dist/dev/packages/shared-chunks/{api-WvJPuo9z.js → api-BawZUDYD.js} +1 -1
- package/dist/dev/packages/shared-chunks/assert-Zqc4wiAV.js +6 -0
- package/dist/dev/packages/shared-chunks/{compiler-CXB_8GdR.js → compiler-QUSl_urU.js} +2 -3
- package/dist/dev/packages/shared-chunks/{curly-CvC8E_4-.js → curly-BBzF_bI8.js} +1 -1
- package/dist/dev/packages/shared-chunks/curried-BZnYakIg.js +5 -0
- package/dist/dev/packages/shared-chunks/{debug-to-string-CFb7h0lY.js → debug-to-string-C6LsA_qz.js} +1 -2
- package/dist/dev/packages/shared-chunks/{element-C-QcIABg.js → element-Cf3hqNOD.js} +4 -2
- package/dist/dev/packages/shared-chunks/{element-builder-kHVx0F__.js → element-builder--iTIJyCB.js} +1 -1
- package/dist/dev/packages/shared-chunks/{get-CpJjYeJO.js → get-BehtPmsu.js} +31 -34
- package/dist/dev/packages/shared-chunks/{hash-D3BENmhU.js → hash-BTwOuDGQ.js} +17 -11
- package/dist/dev/packages/shared-chunks/{helper-DlC4YesW.js → helper-BubrhyuN.js} +20 -8
- package/dist/dev/packages/shared-chunks/{index-CTxkmV78.js → index-CL1zjHwo.js} +91 -113
- package/dist/dev/packages/shared-chunks/{index-DmGmwWPJ.js → index-CyZiGiEI.js} +5 -6
- package/dist/dev/packages/shared-chunks/{internal-CbQSKXEm.js → internal-CAL-jHZt.js} +2 -2
- package/dist/dev/packages/shared-chunks/{internal-helper-Dsl9_7H_.js → internal-helper-Ez7zbEIa.js} +1 -1
- package/dist/dev/packages/shared-chunks/{invoke-B6j6DdDz.js → invoke-B8M5fQQS.js} +2 -2
- package/dist/dev/packages/shared-chunks/{on-D8QwT-eN.js → on-BQii6ILK.js} +8 -8
- package/dist/dev/packages/shared-chunks/{or-DBU9Ge4r.js → or-BTH3yuFG.js} +1 -1
- package/dist/dev/packages/shared-chunks/{program-context-CqcQMsfa.js → program-context-CadjldRr.js} +4 -3
- package/dist/{prod/packages/shared-chunks/registers-DoamZwaG.js → dev/packages/shared-chunks/registers-C_W2qYHJ.js} +1 -1
- package/dist/dev/packages/shared-chunks/{rehydrate-builder-DdzXTaJk.js → rehydrate-builder-DCyIgnCR.js} +2 -2
- package/dist/dev/packages/shared-chunks/{render-DDdabL30.js → render-CpKaO-BO.js} +9 -8
- package/dist/dev/packages/shared-chunks/{chunk-3SQBS3Y5-Cj4eryg1.js → runtime-CYyqkz5q-BOdRhmsS.js} +4 -59
- package/dist/dev/packages/shared-chunks/{serialize-builder-B3u9Wr3n.js → serialize-builder-DxgGRvH_.js} +1 -1
- package/dist/dev/packages/shared-chunks/{setup-registry-XxD0xvgf.js → setup-registry-BQZJfq-Y.js} +7 -7
- package/dist/dev/packages/shared-chunks/syscall-ops-BPFtDquC.js +133 -0
- package/dist/dev/packages/shared-chunks/{template-kM-7TTcc.js → template-R_5UMHhb.js} +1 -1
- package/dist/dev/packages/shared-chunks/{template-only-Yluyu0DY.js → template-only-BqOt8bDl.js} +1 -1
- package/dist/dev/packages/shared-chunks/{textarea-C0Us0PNJ.js → textarea-lD4apgrP.js} +9 -5
- package/dist/dev/packages/shared-chunks/{unique-id-A83bjEE-.js → unique-id-CgmHQiwi.js} +1 -1
- package/dist/dev/packages/shared-chunks/{untouchable-this-cH6_N2LJ.js → untouchable-this-B3DVwpHS.js} +6 -6
- package/dist/dev/packages/shared-chunks/vm-ops-ImHv0Wtg.js +12 -0
- package/dist/prod/packages/@ember/-internals/container/index.js +2 -3
- package/dist/prod/packages/@ember/-internals/glimmer/index.js +9 -9
- package/dist/prod/packages/@ember/-internals/meta/lib/meta.js +0 -2
- package/dist/prod/packages/@ember/-internals/metal/index.js +16 -17
- package/dist/prod/packages/@ember/-internals/routing/index.js +1 -2
- package/dist/prod/packages/@ember/-internals/runtime/lib/ext/rsvp.js +0 -1
- package/dist/prod/packages/@ember/-internals/runtime/lib/mixins/-proxy.js +4 -5
- package/dist/prod/packages/@ember/-internals/runtime/lib/mixins/action_handler.js +1 -2
- package/dist/prod/packages/@ember/-internals/runtime/lib/mixins/registry_proxy.js +0 -1
- package/dist/prod/packages/@ember/-internals/runtime/lib/mixins/target_action_support.js +3 -4
- package/dist/prod/packages/@ember/-internals/utils/index.js +0 -1
- package/dist/prod/packages/@ember/-internals/views/index.js +0 -1
- package/dist/prod/packages/@ember/-internals/views/lib/mixins/action_support.js +1 -2
- package/dist/prod/packages/@ember/-internals/views/lib/system/event_dispatcher.js +2 -3
- package/dist/prod/packages/@ember/-internals/views/lib/system/utils.js +0 -1
- package/dist/prod/packages/@ember/-internals/views/lib/views/core_view.js +2 -2
- package/dist/prod/packages/@ember/-internals/views/lib/views/states.js +0 -1
- package/dist/prod/packages/@ember/application/index.js +3 -3
- package/dist/prod/packages/@ember/application/instance.js +3 -4
- package/dist/prod/packages/@ember/application/namespace.js +1 -2
- package/dist/prod/packages/@ember/array/index.js +9 -6
- package/dist/prod/packages/@ember/array/proxy.js +5 -6
- package/dist/prod/packages/@ember/component/helper.js +1 -1
- package/dist/prod/packages/@ember/component/index.js +15 -10
- package/dist/prod/packages/@ember/controller/index.js +3 -3
- package/dist/prod/packages/@ember/debug/data-adapter.js +1 -1
- package/dist/prod/packages/@ember/engine/index.js +3 -6
- package/dist/prod/packages/@ember/engine/instance.js +0 -1
- package/dist/prod/packages/@ember/helper/index.js +5 -34
- package/dist/prod/packages/@ember/modifier/on.js +1 -1
- package/dist/prod/packages/@ember/object/-internals.js +0 -1
- package/dist/prod/packages/@ember/object/compat.js +1 -2
- package/dist/prod/packages/@ember/object/computed.js +2 -2
- package/dist/prod/packages/@ember/object/core.js +5 -6
- package/dist/prod/packages/@ember/object/evented.js +2 -2
- package/dist/prod/packages/@ember/object/events.js +1 -1
- package/dist/prod/packages/@ember/object/index.js +30 -25
- package/dist/prod/packages/@ember/object/internals.js +0 -1
- package/dist/prod/packages/@ember/object/lib/computed/computed_macros.js +4 -5
- package/dist/prod/packages/@ember/object/lib/computed/reduce_computed_macros.js +2 -3
- package/dist/prod/packages/@ember/object/mixin.js +4 -5
- package/dist/prod/packages/@ember/object/observable.js +7 -8
- package/dist/prod/packages/@ember/object/observers.js +1 -1
- package/dist/prod/packages/@ember/object/promise-proxy-mixin.js +3 -3
- package/dist/prod/packages/@ember/reactive/collections.js +2 -0
- package/dist/prod/packages/@ember/renderer/index.js +1 -1
- package/dist/prod/packages/@ember/routing/history-location.js +0 -1
- package/dist/prod/packages/@ember/routing/index.js +10 -7
- package/dist/prod/packages/@ember/routing/lib/dsl.js +0 -2
- package/dist/prod/packages/@ember/routing/lib/generate_controller.js +1 -2
- package/dist/prod/packages/@ember/routing/lib/routing-service.js +2 -3
- package/dist/prod/packages/@ember/routing/lib/utils.js +1 -2
- package/dist/prod/packages/@ember/routing/none-location.js +0 -1
- package/dist/prod/packages/@ember/routing/route.js +9 -10
- package/dist/prod/packages/@ember/routing/router-service.js +22 -16
- package/dist/prod/packages/@ember/routing/router.js +3 -4
- package/dist/prod/packages/@ember/runloop/index.js +1 -2
- package/dist/prod/packages/@ember/service/index.js +1 -1
- package/dist/prod/packages/@ember/template-compiler/lib/compile-options.js +3 -4
- package/dist/prod/packages/@ember/template-compiler/lib/plugins/assert-against-attrs.js +0 -1
- package/dist/prod/packages/@ember/template-compiler/lib/plugins/assert-against-named-outlets.js +0 -1
- package/dist/prod/packages/@ember/template-compiler/lib/plugins/assert-input-helper-without-block.js +0 -1
- package/dist/prod/packages/@ember/template-compiler/lib/plugins/assert-reserved-named-arguments.js +0 -2
- package/dist/prod/packages/@ember/template-compiler/lib/plugins/transform-each-track-array.js +0 -1
- package/dist/prod/packages/@ember/template-compiler/lib/plugins/transform-in-element.js +0 -1
- package/dist/prod/packages/@ember/template-compiler/lib/plugins/transform-resolutions.js +0 -1
- package/dist/prod/packages/@ember/template-compiler/lib/template.js +2 -2
- package/dist/prod/packages/@ember/template-factory/index.js +1 -1
- package/dist/prod/packages/@ember/utils/lib/compare.js +0 -1
- package/dist/prod/packages/@ember/utils/lib/is_empty.js +1 -1
- package/dist/prod/packages/@glimmer/node/index.js +2 -2
- package/dist/prod/packages/@glimmer/opcode-compiler/index.js +2 -5
- package/dist/prod/packages/@glimmer/program/index.js +2 -2
- package/dist/prod/packages/@glimmer/runtime/index.js +9 -11
- package/dist/prod/packages/@glimmer/tracking/index.js +1 -1
- package/dist/prod/packages/@glimmer/vm/index.js +1 -1
- package/dist/prod/packages/ember/version.js +1 -1
- package/dist/prod/packages/ember-template-compiler/index.js +2 -3
- package/dist/prod/packages/shared-chunks/{alias-CLuFeKoV.js → alias-DBW_V5vD.js} +5 -6
- package/dist/prod/packages/shared-chunks/{array-DHdr4__s.js → array-D6Couewv.js} +2 -3
- package/dist/prod/packages/shared-chunks/assert-Zqc4wiAV.js +6 -0
- package/dist/prod/packages/shared-chunks/{chain-tags-BJqcuCM1.js → chain-tags-C9rFtQ_x.js} +0 -1
- package/dist/prod/packages/shared-chunks/{compiler-DjQtTQGk.js → compiler-c4yUVrl_.js} +2 -3
- package/dist/prod/packages/shared-chunks/{computed-2Udcmflw.js → computed-DjCIU_ht.js} +3 -4
- package/dist/prod/packages/shared-chunks/{container-D5NwW5Fd.js → container-BYOnjnwz.js} +0 -1
- package/dist/prod/packages/shared-chunks/{curly-BsqvV8G0.js → curly-ZzX43b50.js} +2 -3
- package/dist/prod/packages/shared-chunks/curried-BZnYakIg.js +5 -0
- package/dist/prod/packages/shared-chunks/{debug-render-tree-BLtnOSbb.js → debug-render-tree-CF5O4-WI.js} +4 -4
- package/dist/prod/packages/shared-chunks/{decorator-DBCISop4.js → decorator-9ikVwsjY.js} +0 -1
- package/dist/prod/packages/shared-chunks/{element-BjFr0tO0.js → element-9DRa_9dO.js} +2 -1
- package/dist/prod/packages/shared-chunks/{element-builder-BPjq0rxK.js → element-builder-CnlTPNyw.js} +1 -1
- package/dist/prod/packages/shared-chunks/{events-970OxD6Q.js → events-DYrYz3V8.js} +0 -1
- package/dist/prod/packages/shared-chunks/{get-D5wxdTkY.js → get-Dt5L0TcU.js} +31 -34
- package/dist/prod/packages/shared-chunks/{get_properties-BcAC5sGx.js → get_properties-Nn08mLAH.js} +1 -1
- package/dist/prod/packages/shared-chunks/{hash-DcUe-meU.js → hash-Dkj3I4L4.js} +16 -10
- package/dist/prod/packages/shared-chunks/{helper-Da672z4a.js → helper-CN6UzshW.js} +18 -7
- package/dist/prod/packages/shared-chunks/{index--2U-v2nf.js → index-Bj71BDDA.js} +4 -5
- package/dist/prod/packages/shared-chunks/{index-D87qoERP.js → index-ClxHbCe9.js} +90 -112
- package/dist/prod/packages/shared-chunks/{injected_property-D9B-fPiH.js → injected_property--eJunJph.js} +2 -3
- package/dist/prod/packages/shared-chunks/{invoke-Dr_CRwA_.js → invoke-Cj5zMqHz.js} +1 -1
- package/dist/prod/packages/shared-chunks/{libraries-DaXpIDYN.js → libraries-_k-4KK5_.js} +1 -2
- package/dist/prod/packages/shared-chunks/{observers-Co4JALkS.js → observers-CDkeR0nI.js} +2 -2
- package/dist/prod/packages/shared-chunks/{on-C3ZQiUUD.js → on-CWgOWNSL.js} +7 -7
- package/dist/prod/packages/shared-chunks/{or-oTVMuHc8.js → or-Crsa2wci.js} +1 -1
- package/dist/prod/packages/shared-chunks/{program-context-CGMN-aQM.js → program-context-B8HKU7wu.js} +4 -3
- package/dist/prod/packages/shared-chunks/{property_get-hWJ0nGhW.js → property_get-CAFdpRyu.js} +0 -1
- package/dist/prod/packages/shared-chunks/{property_set-Dj5-ScWk.js → property_set-BunbMFtp.js} +3 -4
- package/dist/{dev/packages/shared-chunks/registers-DoamZwaG.js → prod/packages/shared-chunks/registers-C_W2qYHJ.js} +1 -1
- package/dist/prod/packages/shared-chunks/{rehydrate-builder-BKg2X6Lo.js → rehydrate-builder-DJ8k-6fg.js} +2 -2
- package/dist/prod/packages/shared-chunks/{render-nx5-PsDW.js → render-DkJJmoI4.js} +7 -6
- package/dist/prod/packages/shared-chunks/{chunk-3SQBS3Y5-Cj4eryg1.js → runtime-CYyqkz5q-BOdRhmsS.js} +4 -59
- package/dist/prod/packages/shared-chunks/{serialize-builder-BGbC30SN.js → serialize-builder-R3Ozg0sC.js} +1 -1
- package/dist/prod/packages/shared-chunks/{set_properties-oPyURk67.js → set_properties-LT3RzRmJ.js} +2 -2
- package/dist/prod/packages/shared-chunks/{setup-registry-TiaKLj5k.js → setup-registry-B3DhqtxX.js} +7 -8
- package/dist/prod/packages/shared-chunks/syscall-ops-BPFtDquC.js +133 -0
- package/dist/prod/packages/shared-chunks/{textarea-CPKZ1c_O.js → textarea-Byj32raR.js} +9 -6
- package/dist/prod/packages/shared-chunks/{tracked-CffAABMz.js → tracked-DAVrVqJl.js} +2 -3
- package/dist/prod/packages/shared-chunks/vm-ops-ImHv0Wtg.js +12 -0
- package/docs/data.json +196 -216
- package/lib/index.js +0 -1
- package/package.json +14 -15
- package/types/stable/@ember/-internals/glimmer/index.d.ts +165 -121
- package/types/stable/@ember/-internals/glimmer/lib/component.d.ts +8 -2
- package/types/stable/@ember/-internals/glimmer/lib/glimmer-tracking-docs.d.ts +12 -12
- package/types/stable/@ember/-internals/glimmer/lib/helper.d.ts +18 -6
- package/types/stable/@ember/-internals/glimmer/lib/helpers/array.d.ts +3 -1
- package/types/stable/@ember/-internals/glimmer/lib/helpers/component.d.ts +65 -121
- package/types/stable/@ember/-internals/glimmer/lib/helpers/concat.d.ts +8 -4
- package/types/stable/@ember/-internals/glimmer/lib/helpers/each-in.d.ts +16 -14
- package/types/stable/@ember/-internals/glimmer/lib/helpers/element.d.ts +2 -0
- package/types/stable/@ember/-internals/glimmer/lib/helpers/fn.d.ts +11 -7
- package/types/stable/@ember/-internals/glimmer/lib/helpers/get.d.ts +23 -29
- package/types/stable/@ember/-internals/glimmer/lib/helpers/hash.d.ts +3 -1
- package/types/stable/@ember/-internals/glimmer/lib/helpers/if-unless.d.ts +95 -49
- package/types/stable/@ember/-internals/glimmer/lib/helpers/mut.d.ts +23 -54
- package/types/stable/@ember/-internals/glimmer/lib/helpers/page-title.d.ts +6 -2
- package/types/stable/@ember/-internals/glimmer/lib/helpers/readonly.d.ts +4 -8
- package/types/stable/@ember/-internals/glimmer/lib/modifiers/on.d.ts +10 -10
- package/types/stable/@ember/-internals/glimmer/lib/syntax/in-element.d.ts +2 -0
- package/types/stable/@ember/-internals/glimmer/lib/syntax/let.d.ts +2 -14
- package/types/stable/@ember/-internals/glimmer/lib/syntax/mount.d.ts +15 -11
- package/types/stable/@ember/-internals/glimmer/lib/syntax/outlet.d.ts +17 -10
- package/types/stable/@ember/-internals/runtime/lib/mixins/target_action_support.d.ts +1 -1
- package/types/stable/@ember/-internals/views/index.d.ts +0 -1
- package/types/stable/@ember/array/index.d.ts +4 -0
- package/types/stable/@ember/controller/index.d.ts +1 -1
- package/types/stable/@ember/helper/index.d.ts +0 -29
- package/types/stable/@ember/object/index.d.ts +4 -3
- package/types/stable/@ember/object/observable.d.ts +4 -0
- package/types/stable/@ember/routing/route.d.ts +1 -1
- package/types/stable/@ember/routing/router-service.d.ts +20 -12
- package/types/stable/@glimmer/runtime/lib/helpers/array.d.ts +1 -1
- package/types/stable/@glimmer/runtime/lib/helpers/concat.d.ts +8 -3
- package/types/stable/@glimmer/runtime/lib/helpers/fn.d.ts +13 -7
- package/types/stable/@glimmer/runtime/lib/helpers/get.d.ts +21 -29
- package/types/stable/@glimmer/runtime/lib/helpers/hash.d.ts +1 -1
- package/types/stable/@glimmer/syntax/lib/get-template-locals.d.ts +1 -1
- package/types/stable/@glimmer/tracking/index.d.ts +12 -12
- package/types/stable/index.d.ts +0 -1
- package/dist/dev/packages/@ember/-internals/views/lib/component_lookup.js +0 -14
- package/dist/dev/packages/shared-chunks/assert-CUCJBR2C.js +0 -19
- package/dist/dev/packages/shared-chunks/curried-BVwSNqpf.js +0 -628
- package/dist/dev/packages/shared-chunks/opcode-metadata-9iSW5JGP.js +0 -285
- package/dist/prod/packages/@ember/-internals/views/lib/component_lookup.js +0 -14
- package/dist/prod/packages/shared-chunks/assert-CUCJBR2C.js +0 -19
- package/dist/prod/packages/shared-chunks/curried-BVwSNqpf.js +0 -628
- package/dist/prod/packages/shared-chunks/opcode-metadata-9iSW5JGP.js +0 -285
- package/types/stable/@ember/-internals/views/lib/component_lookup.d.ts +0 -8
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { a as createComputeRef, U as UNDEFINED_REFERENCE, v as valueForRef } from './reference-BshxG6wn.js';
|
|
2
|
-
import { f as reifyPositional } from './debug-render-tree-
|
|
3
|
-
import { i as internalHelper } from './hash-
|
|
2
|
+
import { f as reifyPositional } from './debug-render-tree-CF5O4-WI.js';
|
|
3
|
+
import { i as internalHelper } from './hash-Dkj3I4L4.js';
|
|
4
4
|
import { setPath, getPath } from '../@glimmer/global-context/index.js';
|
|
5
5
|
import { i as isDict } from './collections-C3Y8z_9v.js';
|
|
6
6
|
|
|
@@ -19,10 +19,15 @@ const normalizeTextValue = value => {
|
|
|
19
19
|
|
|
20
20
|
Example:
|
|
21
21
|
|
|
22
|
-
```handlebars
|
|
23
|
-
{{some-component name=(concat firstName " " lastName)}}
|
|
24
22
|
|
|
25
|
-
|
|
23
|
+
```gjs
|
|
24
|
+
import { concat } from '@ember/helper';
|
|
25
|
+
|
|
26
|
+
<template>
|
|
27
|
+
{{yield (concat firstName " " lastName)}}
|
|
28
|
+
|
|
29
|
+
{{! would yield name="<first name value> <last name value>" to the component}}
|
|
30
|
+
</template>
|
|
26
31
|
```
|
|
27
32
|
|
|
28
33
|
or for angle bracket invocation, you actually don't need concat at all.
|
|
@@ -46,28 +51,31 @@ const concat = internalHelper(({
|
|
|
46
51
|
|
|
47
52
|
For example, these two usages are equivalent:
|
|
48
53
|
|
|
49
|
-
```app/components/developer-detail.
|
|
54
|
+
```app/components/developer-detail.gjs
|
|
50
55
|
import Component from '@glimmer/component';
|
|
51
56
|
import { tracked } from '@glimmer/tracking';
|
|
57
|
+
import { get } from '@ember/object';
|
|
52
58
|
|
|
53
59
|
export default class extends Component {
|
|
54
60
|
@tracked developer = {
|
|
55
61
|
name: "Sandi Metz",
|
|
56
62
|
language: "Ruby"
|
|
57
63
|
}
|
|
64
|
+
|
|
65
|
+
<template>
|
|
66
|
+
{{this.developer.name}}
|
|
67
|
+
{{get this.developer "name"}}
|
|
68
|
+
</template>
|
|
58
69
|
}
|
|
59
70
|
```
|
|
60
71
|
|
|
61
|
-
```handlebars
|
|
62
|
-
{{this.developer.name}}
|
|
63
|
-
{{get this.developer "name"}}
|
|
64
|
-
```
|
|
65
|
-
|
|
66
72
|
If there were several facts about a person, the `{{get}}` helper can dynamically
|
|
67
73
|
pick one:
|
|
68
74
|
|
|
69
|
-
```app/templates/application.
|
|
70
|
-
<
|
|
75
|
+
```app/templates/application.gjs
|
|
76
|
+
<template>
|
|
77
|
+
<DeveloperDetail @factName="language" />
|
|
78
|
+
</template>
|
|
71
79
|
```
|
|
72
80
|
|
|
73
81
|
```handlebars
|
|
@@ -77,10 +85,11 @@ const concat = internalHelper(({
|
|
|
77
85
|
For a more complex example, this template would allow the user to switch
|
|
78
86
|
between showing the user's height and weight with a click:
|
|
79
87
|
|
|
80
|
-
```app/components/developer-detail.
|
|
88
|
+
```app/components/developer-detail.gjs
|
|
81
89
|
import Component from '@glimmer/component';
|
|
82
90
|
import { tracked } from '@glimmer/tracking';
|
|
83
|
-
|
|
91
|
+
import { get } from '@ember/object';
|
|
92
|
+
|
|
84
93
|
export default class extends Component {
|
|
85
94
|
@tracked developer = {
|
|
86
95
|
name: "Sandi Metz",
|
|
@@ -92,28 +101,16 @@ const concat = internalHelper(({
|
|
|
92
101
|
showFact = (fact) => {
|
|
93
102
|
this.currentFact = fact;
|
|
94
103
|
}
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
```app/components/developer-detail.js
|
|
99
|
-
{{get this.developer this.currentFact}}
|
|
100
|
-
|
|
101
|
-
<button {{on 'click' (fn this.showFact "name")}}>Show name</button>
|
|
102
|
-
<button {{on 'click' (fn this.showFact "language")}}>Show language</button>
|
|
103
|
-
```
|
|
104
|
+
|
|
105
|
+
<template>
|
|
106
|
+
{{get this.developer this.currentFact}}
|
|
104
107
|
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
<button {{on 'click' (fn this.showFact "name")}}>Show name</button>
|
|
111
|
-
<button {{on 'click' (fn this.showFact "language")}}>Show language</button>
|
|
108
|
+
<button {{on 'click' (fn this.showFact "name")}}>Show name</button>
|
|
109
|
+
<button {{on 'click' (fn this.showFact "language")}}>Show language</button>
|
|
110
|
+
</template>
|
|
111
|
+
}
|
|
112
112
|
```
|
|
113
113
|
|
|
114
|
-
Would allow the user to swap what fact is being displayed, and also edit
|
|
115
|
-
that fact via a two-way mutable binding.
|
|
116
|
-
|
|
117
114
|
@public
|
|
118
115
|
@method get
|
|
119
116
|
*/
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { a as createComputeRef, i as isInvokableRef, u as updateRef } from './reference-BshxG6wn.js';
|
|
2
|
-
import { f as reifyPositional, g as check, e as reifyNamed } from './debug-render-tree-
|
|
2
|
+
import { f as reifyPositional, g as check, e as reifyNamed } from './debug-render-tree-CF5O4-WI.js';
|
|
3
3
|
import { j as setInternalHelperManager } from './api-zh_k31vb.js';
|
|
4
4
|
|
|
5
5
|
function internalHelper(helper) {
|
|
@@ -19,7 +19,7 @@ function internalHelper(helper) {
|
|
|
19
19
|
```
|
|
20
20
|
or
|
|
21
21
|
```handlebars
|
|
22
|
-
{{
|
|
22
|
+
{{yield people=(array
|
|
23
23
|
'Tom Dale'
|
|
24
24
|
'Yehuda Katz'
|
|
25
25
|
this.myOtherPerson)
|
|
@@ -64,13 +64,17 @@ const context = buildUntouchableThis();
|
|
|
64
64
|
to a component invoked within the loop. Here's how you could use the `fn`
|
|
65
65
|
helper to pass both the function and its arguments together:
|
|
66
66
|
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
67
|
+
```app/components/items-listing.gjs
|
|
68
|
+
import DisplayItem from './display-item';
|
|
69
|
+
|
|
70
|
+
<template>
|
|
71
|
+
{{#each @items as |item|}}
|
|
72
|
+
<DisplayItem @item=item @select={{fn this.handleSelected item}} />
|
|
73
|
+
{{/each}}
|
|
74
|
+
</template>
|
|
71
75
|
```
|
|
72
76
|
|
|
73
|
-
```app/components/items-list.
|
|
77
|
+
```app/components/items-list.gjs
|
|
74
78
|
import Component from '@glimmer/component';
|
|
75
79
|
import { action } from '@ember/object';
|
|
76
80
|
|
|
@@ -81,7 +85,7 @@ const context = buildUntouchableThis();
|
|
|
81
85
|
}
|
|
82
86
|
```
|
|
83
87
|
|
|
84
|
-
In this case the `
|
|
88
|
+
In this case the `DisplayItem` component will receive a normal function
|
|
85
89
|
that it can invoke. When it invokes the function, the `handleSelected`
|
|
86
90
|
function will receive the `item` and any arguments passed, thanks to the
|
|
87
91
|
`fn` helper.
|
|
@@ -98,7 +102,7 @@ const context = buildUntouchableThis();
|
|
|
98
102
|
`handleSelected` is properly bound to the `items-list`, but let's explore what
|
|
99
103
|
happens if we left out the arrow function:
|
|
100
104
|
|
|
101
|
-
```app/components/items-list.
|
|
105
|
+
```app/components/items-list.gjs
|
|
102
106
|
import Component from '@glimmer/component';
|
|
103
107
|
|
|
104
108
|
export default class ItemsList extends Component {
|
|
@@ -115,6 +119,8 @@ const context = buildUntouchableThis();
|
|
|
115
119
|
|
|
116
120
|
See also [partial application](https://en.wikipedia.org/wiki/Partial_application).
|
|
117
121
|
|
|
122
|
+
`fn` is built-in and does not require any additional imports.
|
|
123
|
+
|
|
118
124
|
@method fn
|
|
119
125
|
@public
|
|
120
126
|
*/
|
|
@@ -138,7 +144,7 @@ const fn = internalHelper(({
|
|
|
138
144
|
|
|
139
145
|
/**
|
|
140
146
|
Use the `{{hash}}` helper to create a hash to pass as an option to your
|
|
141
|
-
components. This is
|
|
147
|
+
components. This is especially useful for contextual components where you can
|
|
142
148
|
just yield a hash:
|
|
143
149
|
|
|
144
150
|
```handlebars
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { setOwner } from '../@ember/-internals/owner/index.js';
|
|
2
2
|
import { FrameworkObject } from '../@ember/object/-internals.js';
|
|
3
3
|
import { g as getDebugName } from './get-debug-name-BDxIL2Y1.js';
|
|
4
|
-
import './env-DXxsTFkM.js';
|
|
5
4
|
import { join } from '../@ember/runloop/index.js';
|
|
6
5
|
import { a as getInternalHelperManager, i as helperCapabilities } from './api-zh_k31vb.js';
|
|
7
6
|
import { b as setHelperManager } from './api-CM1trl_4.js';
|
|
@@ -28,20 +27,32 @@ const IS_CLASSIC_HELPER = Symbol('IS_CLASSIC_HELPER');
|
|
|
28
27
|
Ember Helpers are functions that can compute values, and are used in templates.
|
|
29
28
|
For example, this code calls a helper named `format-currency`:
|
|
30
29
|
|
|
31
|
-
```app/templates/application.
|
|
32
|
-
|
|
30
|
+
```app/templates/application.gjs
|
|
31
|
+
import Cost from '../components/cost';
|
|
32
|
+
|
|
33
|
+
<template>
|
|
34
|
+
<Cost @cents={{230}} />
|
|
35
|
+
</template>
|
|
33
36
|
```
|
|
34
37
|
|
|
35
|
-
```app/components/cost.
|
|
36
|
-
|
|
38
|
+
```app/components/cost.gjs
|
|
39
|
+
import formatCurrency from '../helpers/format-currency';
|
|
40
|
+
|
|
41
|
+
<template>
|
|
42
|
+
<div>{{formatCurrency @cents currency="$"}}</div>
|
|
43
|
+
</template>
|
|
37
44
|
```
|
|
38
45
|
|
|
39
46
|
Additionally a helper can be called as a nested helper.
|
|
40
47
|
In this example, we show the formatted currency value if the `showMoney`
|
|
41
48
|
named argument is truthy.
|
|
42
49
|
|
|
43
|
-
```
|
|
44
|
-
|
|
50
|
+
```gjs
|
|
51
|
+
import formatCurrency from '../helpers/format-currency';
|
|
52
|
+
|
|
53
|
+
<template>
|
|
54
|
+
{{if @showMoney (formatCurrency @cents currency="$")}}
|
|
55
|
+
</template>
|
|
45
56
|
```
|
|
46
57
|
|
|
47
58
|
Helpers defined using a class must provide a `compute` function. For example:
|
|
@@ -1,14 +1,13 @@
|
|
|
1
1
|
import { a as assign } from './object-utils-AijlD-JH.js';
|
|
2
2
|
import { b as EMPTY_STRING_ARRAY, E as EMPTY_ARRAY, e as enumerate, r as reverse } from './array-utils-CZQxrdD3.js';
|
|
3
|
-
import {
|
|
4
|
-
import './
|
|
5
|
-
import './reference-BshxG6wn.js';
|
|
3
|
+
import { r as VM_PRIMITIVE_OP, aF as encodeHandle, av as VM_CONCAT_OP, am as VM_GET_VARIABLE_OP, q as VM_CONSTANT_REFERENCE_OP, aq as VM_GET_PROPERTY_OP, at as VM_HAS_BLOCK_OP, as as VM_SPREAD_BLOCK_OP, E as VM_COMPILE_BLOCK_OP, au as VM_HAS_BLOCK_PARAMS_OP, aw as VM_IF_INLINE_OP, ax as VM_NOT_OP, ay as VM_GET_DYNAMIC_VAR_OP, az as VM_LOG_OP, y as VM_FETCH_OP, u as VM_PRIMITIVE_REFERENCE_OP, al as VM_HELPER_OP, v as VM_DUP_OP, ak as VM_DYNAMIC_HELPER_OP, w as VM_POP_OP, $ as VM_CAPTURE_ARGS_OP, aj as VM_CURRY_OP, aG as isSmallInt, aH as encodeImmediate, m as VM_PUSH_DYNAMIC_SCOPE_OP, z as VM_BIND_DYNAMIC_SCOPE_OP, n as VM_POP_DYNAMIC_SCOPE_OP, ar as VM_GET_BLOCK_OP, F as VM_INVOKE_YIELD_OP, l as VM_POP_SCOPE_OP, k as VM_CHILD_SCOPE_OP, an as VM_SET_VARIABLE_OP, o as VM_CONSTANT_OP, D as VM_PUSH_BLOCK_SCOPE_OP, C as VM_PUSH_SYMBOL_TABLE_OP, _ as VM_PUSH_EMPTY_ARGS_OP, Z as VM_PUSH_ARGS_OP, A as VM_ENTER_OP, I as VM_JUMP_EQ_OP, B as VM_EXIT_OP, H as VM_JUMP_UNLESS_OP, X as VM_PUSH_COMPONENT_DEFINITION_OP, x as VM_LOAD_OP, a3 as VM_BEGIN_COMPONENT_TRANSACTION_OP, a1 as VM_CREATE_COMPONENT_OP, a2 as VM_REGISTER_COMPONENT_DESTRUCTOR_OP, a8 as VM_GET_COMPONENT_SELF_OP, ap as VM_ROOT_SCOPE_OP, ao as VM_SET_BLOCK_OP, ag as VM_DID_RENDER_LAYOUT_OP, ah as VM_COMMIT_COMPONENT_TRANSACTION_OP, a0 as VM_PREPARE_ARGS_OP, ac as VM_VIRTUAL_ROOT_SCOPE_OP, ad as VM_SET_NAMED_VARIABLES_OP, ae as VM_SET_BLOCKS_OP, af as VM_INVOKE_COMPONENT_LAYOUT_OP, a4 as VM_PUT_COMPONENT_OPERATIONS_OP, N as VM_OPEN_DYNAMIC_ELEMENT_OP, a7 as VM_DID_CREATE_ELEMENT_OP, Q as VM_FLUSH_ELEMENT_OP, R as VM_CLOSE_ELEMENT_OP, e as VM_RESOLVE_CURRIED_COMPONENT_OP, Y as VM_RESOLVE_DYNAMIC_COMPONENT_OP, f as VM_PUSH_DYNAMIC_COMPONENT_INSTANCE_OP, aa as VM_GET_COMPONENT_LAYOUT_OP, ab as VM_POPULATE_LAYOUT_OP, a9 as VM_GET_COMPONENT_TAG_NAME_OP, L as VM_COMMENT_OP, S as VM_MODIFIER_OP, T as VM_DYNAMIC_MODIFIER_OP, U as VM_STATIC_ATTR_OP, a6 as VM_STATIC_COMPONENT_ATTR_OP, W as VM_DYNAMIC_ATTR_OP, a5 as VM_COMPONENT_ATTR_OP, M as VM_OPEN_ELEMENT_OP, ai as VM_DEBUGGER_OP, K as VM_TEXT_OP, aA as VM_DYNAMIC_CONTENT_TYPE_OP, O as VM_PUSH_REMOTE_ELEMENT_OP, P as VM_POP_REMOTE_ELEMENT_OP, J as VM_TO_BOOLEAN_OP, aB as VM_ENTER_LIST_OP, aD as VM_ITERATE_OP, aC as VM_EXIT_LIST_OP } from './syscall-ops-BPFtDquC.js';
|
|
4
|
+
import { b as VM_RETURN_OP, i as isMachineOp, f as VM_PUSH_FRAME_OP, e as VM_POP_FRAME_OP, d as VM_INVOKE_VIRTUAL_OP, c as VM_JUMP_OP, a as VM_RETURN_TO_OP, V as VM_INVOKE_STATIC_OP } from './vm-ops-ImHv0Wtg.js';
|
|
6
5
|
import { e as expect, u as unwrap, S as StackImpl, a as isPresentArray, d as dict } from './collections-C3Y8z_9v.js';
|
|
7
|
-
import { a as assert } from './assert-
|
|
6
|
+
import { a as assert } from './assert-Zqc4wiAV.js';
|
|
8
7
|
import { InstructionEncoderImpl } from '../@glimmer/encoder/index.js';
|
|
9
8
|
import { A as ARG_SHIFT, M as MACHINE_MASK, I as InternalComponentCapabilities } from './flags-B9qxc-pB.js';
|
|
10
9
|
import { o as opcodes } from './opcodes-CplRyHl_.js';
|
|
11
|
-
import { a as $v0, f as $fp, $ as $s0,
|
|
10
|
+
import { a as $v0, f as $fp, $ as $s0, g as $sp, h as $s1 } from './registers-C_W2qYHJ.js';
|
|
12
11
|
import { ContentType } from '../@glimmer/vm/index.js';
|
|
13
12
|
import { h as hasCapability } from './capabilities-_5e35539.js';
|
|
14
13
|
|
|
@@ -10,22 +10,22 @@ import { associateDestroyableChild, isDestroyed, destroy, registerDestructor, is
|
|
|
10
10
|
import { artifacts } from '../@glimmer/program/index.js';
|
|
11
11
|
import { R as RuntimeOpImpl } from './program-B7CWdS8W.js';
|
|
12
12
|
import { v as valueForRef, U as UNDEFINED_REFERENCE, a as createComputeRef, c as createConstRef, j as createInvokableRef, k as createReadOnlyRef, l as createUnboundRef, g as childRefFromParts, u as updateRef } from './reference-BshxG6wn.js';
|
|
13
|
-
import { c as clientBuilder } from './element-builder-
|
|
14
|
-
import { E as EMPTY_ARGS, c as createCapturedArgs, b as EMPTY_POSITIONAL, d as curry } from './debug-render-tree-
|
|
15
|
-
import { g as runtimeOptions, i as inTransaction, r as renderComponent$1, d as renderMain } from './render-
|
|
13
|
+
import { c as clientBuilder } from './element-builder-CnlTPNyw.js';
|
|
14
|
+
import { E as EMPTY_ARGS, c as createCapturedArgs, b as EMPTY_POSITIONAL, d as curry } from './debug-render-tree-CF5O4-WI.js';
|
|
15
|
+
import { g as runtimeOptions, i as inTransaction, r as renderComponent$1, d as renderMain } from './render-DkJJmoI4.js';
|
|
16
16
|
import { d as dict } from './collections-C3Y8z_9v.js';
|
|
17
|
-
import { u as unwrapTemplate, a as CurlyComponentManager, i as initialRenderInstrumentDetails, b as ComponentStateBucket, D as DIRTY_TAG, c as isCurlyManager, B as BOUNDS } from './curly-
|
|
17
|
+
import { u as unwrapTemplate, a as CurlyComponentManager, i as initialRenderInstrumentDetails, b as ComponentStateBucket, D as DIRTY_TAG, c as isCurlyManager, B as BOUNDS } from './curly-ZzX43b50.js';
|
|
18
18
|
import { C as CONSTANT_TAG, a as consumeTag, x as isTracking, D as DIRTY_TAG$1, p as createTag, d as valueForTag, i as CURRENT_TAG, v as validateTag } from './cache-BIlOoPA7.js';
|
|
19
19
|
import { a as RSVP } from './rsvp-CnCSY930.js';
|
|
20
20
|
import '../@ember/engine/instance.js';
|
|
21
21
|
import { _instrumentStart } from '../@ember/instrumentation/index.js';
|
|
22
22
|
import { c as capabilityFlagsFrom } from './capabilities-_5e35539.js';
|
|
23
|
-
import { t as templateFactory } from './index
|
|
24
|
-
import { g as getFactoryFor } from './container-
|
|
25
|
-
import { g as get, a as _getProp } from './property_get-
|
|
26
|
-
import { _ as _setProp, s as set } from './property_set-
|
|
23
|
+
import { t as templateFactory } from './index-Bj71BDDA.js';
|
|
24
|
+
import { g as getFactoryFor } from './container-BYOnjnwz.js';
|
|
25
|
+
import { g as get, a as _getProp } from './property_get-CAFdpRyu.js';
|
|
26
|
+
import { _ as _setProp, s as set } from './property_set-BunbMFtp.js';
|
|
27
27
|
import setGlobalContext from '../@glimmer/global-context/index.js';
|
|
28
|
-
import { t as tagForObject, o as objectAt, a as tagForProperty } from './chain-tags-
|
|
28
|
+
import { t as tagForObject, o as objectAt, a as tagForProperty } from './chain-tags-C9rFtQ_x.js';
|
|
29
29
|
import { isEmberArray } from '../@ember/array/-internals.js';
|
|
30
30
|
import { i as isObject } from './spec-BXl1reqK.js';
|
|
31
31
|
import { t as tagFor } from './meta-B9mldqPL.js';
|
|
@@ -36,18 +36,18 @@ import { i as isHTMLSafe } from './index-D-xTBV4B.js';
|
|
|
36
36
|
import { isArray } from '../@ember/array/index.js';
|
|
37
37
|
import { g as getComponentTemplate } from './template-Dc_cBOoX.js';
|
|
38
38
|
import { c as hasInternalComponentManager, j as setInternalHelperManager, g as getInternalComponentManager } from './api-zh_k31vb.js';
|
|
39
|
-
import { h as hash, f as fn, a as array } from './hash-
|
|
40
|
-
import { g as get$1, c as concat } from './get-
|
|
41
|
-
import { o as on } from './on-
|
|
39
|
+
import { h as hash, f as fn, a as array } from './hash-Dkj3I4L4.js';
|
|
40
|
+
import { g as get$1, c as concat } from './get-Dt5L0TcU.js';
|
|
41
|
+
import { o as on } from './on-CWgOWNSL.js';
|
|
42
42
|
import { T as TEMPLATE_ONLY_COMPONENT_MANAGER, t as templateOnlyComponent } from './template-only-BtLl0uH0.js';
|
|
43
|
-
import { i as isClassicHelper, C as CLASSIC_HELPER_MANAGER } from './helper-
|
|
43
|
+
import { i as isClassicHelper, C as CLASSIC_HELPER_MANAGER } from './helper-CN6UzshW.js';
|
|
44
44
|
import { dasherize } from '../@ember/-internals/string/index.js';
|
|
45
45
|
import { a as uniqueId } from './unique-id-CfHImDRV.js';
|
|
46
46
|
import '../route-recognizer/index.js';
|
|
47
47
|
import './unrecognized-url-error-DDBwfzdm.js';
|
|
48
48
|
import '../@ember/routing/lib/routing-service.js';
|
|
49
49
|
import { generateControllerFactory } from '../@ember/routing/lib/generate_controller.js';
|
|
50
|
-
import { E as EvaluationContextImpl } from './program-context-
|
|
50
|
+
import { E as EvaluationContextImpl } from './program-context-B8HKU7wu.js';
|
|
51
51
|
|
|
52
52
|
function instrumentationPayload$1(def) {
|
|
53
53
|
// "main" used to be the outlet name, keeping it around for compatibility
|
|
@@ -239,7 +239,7 @@ class RootComponentDefinition {
|
|
|
239
239
|
*/
|
|
240
240
|
|
|
241
241
|
/**
|
|
242
|
-
The `{{#each}}`
|
|
242
|
+
The `{{#each}}` keyword loops over elements in a collection. It is an extension
|
|
243
243
|
of the base Handlebars `{{#each}}` helper.
|
|
244
244
|
|
|
245
245
|
The default behavior of `{{#each}}` is to yield its inner block once for every
|
|
@@ -283,6 +283,8 @@ class RootComponentDefinition {
|
|
|
283
283
|
{{/each}}
|
|
284
284
|
</ul>
|
|
285
285
|
```
|
|
286
|
+
|
|
287
|
+
`#each` is a keyword and does not need to be imported.
|
|
286
288
|
|
|
287
289
|
### Specifying Keys
|
|
288
290
|
|
|
@@ -350,11 +352,11 @@ class RootComponentDefinition {
|
|
|
350
352
|
*/
|
|
351
353
|
|
|
352
354
|
/**
|
|
353
|
-
The `{{each-in}}`
|
|
355
|
+
The `{{#each-in}}` keyword loops over properties on an object.
|
|
354
356
|
|
|
355
357
|
For example, given this component definition:
|
|
356
358
|
|
|
357
|
-
```app/components/developer-details.
|
|
359
|
+
```app/components/developer-details.gjs
|
|
358
360
|
import Component from '@glimmer/component';
|
|
359
361
|
import { tracked } from '@glimmer/tracking';
|
|
360
362
|
|
|
@@ -363,21 +365,19 @@ class RootComponentDefinition {
|
|
|
363
365
|
"name": "Shelly Sails",
|
|
364
366
|
"age": 42
|
|
365
367
|
};
|
|
368
|
+
|
|
369
|
+
<template>
|
|
370
|
+
<ul>
|
|
371
|
+
{{#each-in this.developer as |key value|}}
|
|
372
|
+
<li>{{key}}: {{value}}</li>
|
|
373
|
+
{{/each-in}}
|
|
374
|
+
</ul>
|
|
375
|
+
</template>
|
|
366
376
|
}
|
|
367
377
|
```
|
|
368
378
|
|
|
369
379
|
This template would display all properties on the `developer`
|
|
370
|
-
object in a list:
|
|
371
|
-
|
|
372
|
-
```app/components/developer-details.hbs
|
|
373
|
-
<ul>
|
|
374
|
-
{{#each-in this.developer as |key value|}}
|
|
375
|
-
<li>{{key}}: {{value}}</li>
|
|
376
|
-
{{/each-in}}
|
|
377
|
-
</ul>
|
|
378
|
-
```
|
|
379
|
-
|
|
380
|
-
Outputting their name and age:
|
|
380
|
+
object in a list, outputting their name and age:
|
|
381
381
|
|
|
382
382
|
```html
|
|
383
383
|
<ul>
|
|
@@ -385,6 +385,8 @@ class RootComponentDefinition {
|
|
|
385
385
|
<li>age: 42</li>
|
|
386
386
|
</ul>
|
|
387
387
|
```
|
|
388
|
+
|
|
389
|
+
`#each-in` is a keyword and does not need to be imported.
|
|
388
390
|
|
|
389
391
|
@method each-in
|
|
390
392
|
@for Ember.Templates.helpers
|
|
@@ -776,73 +778,42 @@ const trackArray = internalHelper(({
|
|
|
776
778
|
*/
|
|
777
779
|
|
|
778
780
|
/**
|
|
779
|
-
The `mut` helper
|
|
780
|
-
|
|
781
|
-
|
|
782
|
-
|
|
781
|
+
The `mut` helper is a shortcut for updating for args.
|
|
782
|
+
|
|
783
|
+
However, defining update functions on your backing class is preferable to using `mut`.
|
|
784
|
+
|
|
785
|
+
More directly: Don't use `mut`.
|
|
783
786
|
|
|
784
|
-
|
|
785
|
-
|
|
786
|
-
|
|
787
|
-
|
|
788
|
-
or
|
|
789
|
-
|
|
790
|
-
```handlebars
|
|
791
|
-
{{my-child childClickCount=(mut totalClicks)}}
|
|
792
|
-
```
|
|
793
|
-
|
|
794
|
-
The child `Component` can then modify the parent's value just by modifying its own
|
|
795
|
-
property:
|
|
796
|
-
|
|
797
|
-
```javascript
|
|
798
|
-
// my-child.js
|
|
799
|
-
export default class MyChild extends Component {
|
|
800
|
-
click() {
|
|
801
|
-
this.incrementProperty('childClickCount');
|
|
802
|
-
}
|
|
803
|
-
}
|
|
804
|
-
```
|
|
805
|
-
|
|
806
|
-
Note that for curly components (`{{my-component}}`) the bindings are already mutable,
|
|
807
|
-
making the `mut` unnecessary.
|
|
808
|
-
|
|
809
|
-
Additionally, the `mut` helper can be combined with the `fn` helper to
|
|
810
|
-
mutate a value. For example:
|
|
811
|
-
|
|
812
|
-
```handlebars
|
|
813
|
-
<MyChild @childClickCount={{this.totalClicks}} @click-count-change={{fn (mut totalClicks))}} />
|
|
814
|
-
```
|
|
815
|
-
|
|
816
|
-
or
|
|
787
|
+
The `mut` helper, when used with `fn`, will return a function that
|
|
788
|
+
sets the value passed to `mut` to its first argument. As an example, we can create a
|
|
789
|
+
button that increments a value passing the value directly to the `fn`:
|
|
817
790
|
|
|
818
791
|
```handlebars
|
|
819
|
-
|
|
792
|
+
<MyChild @childClickCount={{this.totalClicks}} @clickCountChange={{fn (mut this.totalClicks)}} />
|
|
820
793
|
```
|
|
821
794
|
|
|
822
|
-
The child `Component` would invoke the function with the new click
|
|
795
|
+
The child `Component` would invoke the function with the new click count:
|
|
823
796
|
|
|
824
|
-
```
|
|
825
|
-
|
|
797
|
+
```app/components/my-child.gjs
|
|
798
|
+
import Component from '@glimmer/component';
|
|
799
|
+
import { action } from '@ember/object';
|
|
800
|
+
|
|
826
801
|
export default class MyChild extends Component {
|
|
827
|
-
|
|
828
|
-
|
|
802
|
+
@action
|
|
803
|
+
update() {
|
|
804
|
+
this.args.clickCountChange(this.args.childClickCount + 1);
|
|
829
805
|
}
|
|
806
|
+
|
|
807
|
+
<template>
|
|
808
|
+
<button {{on "click" this.update}}>
|
|
809
|
+
Click me!
|
|
810
|
+
</button>
|
|
811
|
+
</template>
|
|
830
812
|
}
|
|
831
813
|
```
|
|
832
814
|
|
|
833
815
|
The `mut` helper changes the `totalClicks` value to what was provided as the `fn` argument.
|
|
834
816
|
|
|
835
|
-
The `mut` helper, when used with `fn`, will return a function that
|
|
836
|
-
sets the value passed to `mut` to its first argument. As an example, we can create a
|
|
837
|
-
button that increments a value passing the value directly to the `fn`:
|
|
838
|
-
|
|
839
|
-
```handlebars
|
|
840
|
-
{{! inc helper is not provided by Ember }}
|
|
841
|
-
<button onclick={{fn (mut count) (inc count)}}>
|
|
842
|
-
Increment count
|
|
843
|
-
</button>
|
|
844
|
-
```
|
|
845
|
-
|
|
846
817
|
@method mut
|
|
847
818
|
@param {Object} [attr] the "two-way" attribute that can be modified.
|
|
848
819
|
@for Ember.Templates.helpers
|
|
@@ -864,6 +835,10 @@ const mut = internalHelper(({
|
|
|
864
835
|
/**
|
|
865
836
|
The `readonly` helper let's you specify that a binding is one-way only,
|
|
866
837
|
instead of two-way.
|
|
838
|
+
|
|
839
|
+
This is a vestigial helper from the days of `@ember/component` and does not apply to
|
|
840
|
+
components extending from `@glimmer/component`.
|
|
841
|
+
|
|
867
842
|
When you pass a `readonly` binding from an outer context (e.g. parent component),
|
|
868
843
|
to to an inner context (e.g. child component), you are saying that changing that
|
|
869
844
|
property in the inner context does not change the value in the outer context.
|
|
@@ -876,14 +851,6 @@ const mut = internalHelper(({
|
|
|
876
851
|
}
|
|
877
852
|
```
|
|
878
853
|
|
|
879
|
-
```app/templates/components/my-parent.hbs
|
|
880
|
-
{{log totalClicks}} // -> 3
|
|
881
|
-
<MyChild @childClickCount={{readonly totalClicks}} />
|
|
882
|
-
```
|
|
883
|
-
```
|
|
884
|
-
{{my-child childClickCount=(readonly totalClicks)}}
|
|
885
|
-
```
|
|
886
|
-
|
|
887
854
|
Now, when you update `childClickCount`:
|
|
888
855
|
|
|
889
856
|
```app/components/my-child.js
|
|
@@ -1160,15 +1127,14 @@ class MountDefinition {
|
|
|
1160
1127
|
|
|
1161
1128
|
For example, the following template mounts the `ember-chat` engine:
|
|
1162
1129
|
|
|
1163
|
-
```
|
|
1164
|
-
{{! application.hbs }}
|
|
1130
|
+
```app/templates/application.gjs
|
|
1165
1131
|
{{mount "ember-chat"}}
|
|
1166
1132
|
```
|
|
1167
1133
|
|
|
1168
1134
|
Additionally, you can also pass in a `model` argument that will be
|
|
1169
1135
|
set as the engines model. This can be an existing object:
|
|
1170
1136
|
|
|
1171
|
-
```
|
|
1137
|
+
```hbs
|
|
1172
1138
|
<div>
|
|
1173
1139
|
{{mount 'admin' model=userSettings}}
|
|
1174
1140
|
</div>
|
|
@@ -1176,15 +1142,20 @@ class MountDefinition {
|
|
|
1176
1142
|
|
|
1177
1143
|
Or an inline `hash`, and you can even pass components:
|
|
1178
1144
|
|
|
1145
|
+
```gjs
|
|
1146
|
+
import SignInButton from '../components/sign-in-button';
|
|
1147
|
+
<template>
|
|
1148
|
+
<div>
|
|
1149
|
+
<h1>Application template!</h1>
|
|
1150
|
+
{{mount 'admin' model=(hash
|
|
1151
|
+
title='Secret Admin'
|
|
1152
|
+
signInButton=SignInButton
|
|
1153
|
+
)}}
|
|
1154
|
+
</div>
|
|
1155
|
+
</template>
|
|
1179
1156
|
```
|
|
1180
|
-
|
|
1181
|
-
|
|
1182
|
-
{{mount 'admin' model=(hash
|
|
1183
|
-
title='Secret Admin'
|
|
1184
|
-
signInButton=(component 'sign-in-button')
|
|
1185
|
-
)}}
|
|
1186
|
-
</div>
|
|
1187
|
-
```
|
|
1157
|
+
|
|
1158
|
+
`mount` is built-in and does not need to be imported.
|
|
1188
1159
|
|
|
1189
1160
|
@method mount
|
|
1190
1161
|
@param {String} name Name of the engine to mount.
|
|
@@ -1316,23 +1287,30 @@ function makeRouteTemplate(owner, name, template) {
|
|
|
1316
1287
|
/**
|
|
1317
1288
|
The `{{outlet}}` helper lets you specify where a child route will render in
|
|
1318
1289
|
your template. An important use of the `{{outlet}}` helper is in your
|
|
1319
|
-
application's `application.
|
|
1320
|
-
|
|
1321
|
-
```app/templates/application.
|
|
1322
|
-
|
|
1323
|
-
|
|
1324
|
-
|
|
1325
|
-
|
|
1326
|
-
|
|
1327
|
-
|
|
1328
|
-
|
|
1329
|
-
|
|
1290
|
+
application's `application.gjs` file:
|
|
1291
|
+
|
|
1292
|
+
```app/templates/application.gjs
|
|
1293
|
+
import MyHeader from '../components/my-header';
|
|
1294
|
+
import MyFooter from '../components/my-footer';
|
|
1295
|
+
|
|
1296
|
+
<template>
|
|
1297
|
+
<MyHeader />
|
|
1298
|
+
|
|
1299
|
+
<div class="my-dynamic-content">
|
|
1300
|
+
<!-- this content will change based on the current route, which depends on the current URL -->
|
|
1301
|
+
{{outlet}}
|
|
1302
|
+
</div>
|
|
1303
|
+
|
|
1304
|
+
<MyFooter />
|
|
1305
|
+
</template>
|
|
1330
1306
|
```
|
|
1331
1307
|
|
|
1332
1308
|
See the [routing guide](https://guides.emberjs.com/release/routing/rendering-a-template/) for more
|
|
1333
1309
|
information on how your `route` interacts with the `{{outlet}}` helper.
|
|
1334
1310
|
Note: Your content __will not render__ if there isn't an `{{outlet}}` for it.
|
|
1335
1311
|
|
|
1312
|
+
`outlet` is built-in and does not need to be imported.
|
|
1313
|
+
|
|
1336
1314
|
@method outlet
|
|
1337
1315
|
@for Ember.Templates.helpers
|
|
1338
1316
|
@public
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { getOwner } from '../@ember/-internals/owner/index.js';
|
|
2
|
-
import './
|
|
3
|
-
import {
|
|
4
|
-
import { i as isElementDescriptor } from './decorator-DBCISop4.js';
|
|
2
|
+
import { c as computed, d as defineProperty } from './computed-DjCIU_ht.js';
|
|
3
|
+
import { i as isElementDescriptor } from './decorator-9ikVwsjY.js';
|
|
5
4
|
|
|
6
5
|
let DEBUG_INJECTION_FUNCTIONS;
|
|
7
6
|
|
|
@@ -2,7 +2,7 @@ import { associateDestroyableChild } from '../@glimmer/destroyable/index.js';
|
|
|
2
2
|
import { a as getInternalHelperManager, f as hasValue, h as hasDestroyable } from './api-zh_k31vb.js';
|
|
3
3
|
import { getOwner } from '../@glimmer/owner/index.js';
|
|
4
4
|
import { b as createCache, g as getValue } from './cache-BIlOoPA7.js';
|
|
5
|
-
import { E as EMPTY_ARGS, a as EMPTY_NAMED, b as EMPTY_POSITIONAL } from './debug-render-tree-
|
|
5
|
+
import { E as EMPTY_ARGS, a as EMPTY_NAMED, b as EMPTY_POSITIONAL } from './debug-render-tree-CF5O4-WI.js';
|
|
6
6
|
|
|
7
7
|
function getArgs(proxy) {
|
|
8
8
|
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- @fixme
|
|
@@ -3,8 +3,8 @@ import { peekMeta } from '../@ember/-internals/meta/lib/meta.js';
|
|
|
3
3
|
import { registerDestructor } from '../@glimmer/destroyable/index.js';
|
|
4
4
|
import { d as valueForTag, v as validateTag, i as CURRENT_TAG } from './cache-BIlOoPA7.js';
|
|
5
5
|
import { a as tagMetaFor } from './meta-B9mldqPL.js';
|
|
6
|
-
import { g as getChainTagsForKey } from './chain-tags-
|
|
7
|
-
import { a as addListener, r as removeListener, s as sendEvent } from './events-
|
|
6
|
+
import { g as getChainTagsForKey } from './chain-tags-C9rFtQ_x.js';
|
|
7
|
+
import { a as addListener, r as removeListener, s as sendEvent } from './events-DYrYz3V8.js';
|
|
8
8
|
|
|
9
9
|
const AFTER_OBSERVERS = ':change';
|
|
10
10
|
function changeEvent(keyName) {
|