From 7165a7866bac30d29587000d3df184491e992715 Mon Sep 17 00:00:00 2001 From: Dylan Piercey Date: Wed, 13 Nov 2024 10:53:44 -0700 Subject: [PATCH] chore: improve size snapshot/tooling (#2362) chore: improve size snapshot/tooling --- .prettierignore | 1 + .sizes.json | 50 +- .sizes/comments.csr/entry.js | 158 +- .sizes/comments.ssr/entry.js | 131 +- .sizes/counter.csr/entry.js | 31 +- .sizes/counter.ssr/entry.js | 22 +- .sizes/dom.js | 2419 ++++++++++------- .sizes/name-cache.json | 1 + packages/runtime-tags/tsconfig.json | 1 + .../__snapshots__/.name-cache.json | 11 + .../dom.expected/template.hydrate.js | 30 +- .../__snapshots__/.name-cache.json | 7 + .../dom.expected/template.hydrate.js | 10 +- .../at-tags/__snapshots__/.name-cache.json | 7 + .../dom.expected/template.hydrate.js | 7 +- .../__snapshots__/.name-cache.json | 10 + .../dom.expected/template.hydrate.js | 27 +- .../__snapshots__/.name-cache.json | 5 + .../__snapshots__/.name-cache.json | 5 + .../__snapshots__/.name-cache.json | 5 + .../__snapshots__/.name-cache.json | 5 + .../__snapshots__/.name-cache.json | 5 + .../__snapshots__/.name-cache.json | 13 + .../dom.expected/template.hydrate.js | 31 +- .../__snapshots__/.name-cache.json | 13 + .../dom.expected/template.hydrate.js | 31 +- .../__snapshots__/.name-cache.json | 15 + .../dom.expected/template.hydrate.js | 60 +- .../__snapshots__/.name-cache.json | 13 + .../dom.expected/template.hydrate.js | 39 +- .../__snapshots__/.name-cache.json | 13 + .../dom.expected/template.hydrate.js | 31 +- .../__snapshots__/.name-cache.json | 13 + .../dom.expected/template.hydrate.js | 41 +- .../__snapshots__/.name-cache.json | 10 + .../dom.expected/template.hydrate.js | 25 +- .../__snapshots__/.name-cache.json | 15 + .../dom.expected/template.hydrate.js | 59 +- .../__snapshots__/.name-cache.json | 15 + .../dom.expected/template.hydrate.js | 59 +- .../__snapshots__/.name-cache.json | 5 + .../__snapshots__/.name-cache.json | 12 + .../dom.expected/template.hydrate.js | 25 +- .../__snapshots__/.name-cache.json | 14 + .../dom.expected/template.hydrate.js | 59 +- .../__snapshots__/.name-cache.json | 10 + .../dom.expected/template.hydrate.js | 25 +- .../__snapshots__/.name-cache.json | 8 + .../dom.expected/template.hydrate.js | 11 +- .../__snapshots__/.name-cache.json | 8 + .../dom.expected/template.hydrate.js | 7 +- .../__snapshots__/.name-cache.json | 13 + .../dom.expected/template.hydrate.js | 31 +- .../__snapshots__/.name-cache.json | 5 + .../__snapshots__/.name-cache.json | 5 + .../__snapshots__/.name-cache.json | 10 + .../dom.expected/template.hydrate.js | 25 +- .../__snapshots__/.name-cache.json | 11 + .../dom.expected/template.hydrate.js | 43 +- .../__snapshots__/.name-cache.json | 9 + .../dom.expected/template.hydrate.js | 15 +- .../__snapshots__/.name-cache.json | 26 + .../dom.expected/template.hydrate.js | 123 +- .../__snapshots__/.name-cache.json | 8 + .../dom.expected/template.hydrate.js | 16 +- .../__snapshots__/.name-cache.json | 23 + .../dom.expected/template.hydrate.js | 95 +- .../__snapshots__/.name-cache.json | 23 + .../dom.expected/template.hydrate.js | 99 +- .../__snapshots__/.name-cache.json | 11 + .../dom.expected/template.hydrate.js | 39 +- .../__snapshots__/.name-cache.json | 12 + .../dom.expected/template.hydrate.js | 41 +- .../__snapshots__/.name-cache.json | 11 + .../dom.expected/template.hydrate.js | 42 +- .../__snapshots__/.name-cache.json | 15 + .../dom.expected/template.hydrate.js | 57 +- .../__snapshots__/.name-cache.json | 17 + .../dom.expected/template.hydrate.js | 63 +- .../__snapshots__/.name-cache.json | 16 + .../dom.expected/template.hydrate.js | 69 +- .../__snapshots__/.name-cache.json | 5 + .../__snapshots__/.name-cache.json | 12 + .../dom.expected/template.hydrate.js | 29 +- .../__snapshots__/.name-cache.json | 10 + .../dom.expected/template.hydrate.js | 25 +- .../__snapshots__/.name-cache.json | 14 + .../dom.expected/template.hydrate.js | 41 +- .../__snapshots__/.name-cache.json | 12 + .../dom.expected/template.hydrate.js | 31 +- .../__snapshots__/.name-cache.json | 17 + .../dom.expected/template.hydrate.js | 67 +- .../__snapshots__/.name-cache.json | 20 + .../dom.expected/template.hydrate.js | 101 +- .../__snapshots__/.name-cache.json | 33 + .../dom.expected/template.hydrate.js | 190 +- .../__snapshots__/.name-cache.json | 14 + .../dom.expected/template.hydrate.js | 43 +- .../__snapshots__/.name-cache.json | 16 + .../dom.expected/template.hydrate.js | 65 +- .../__snapshots__/.name-cache.json | 29 + .../dom.expected/template.hydrate.js | 165 +- .../__snapshots__/.name-cache.json | 20 + .../dom.expected/template.hydrate.js | 97 +- .../__snapshots__/.name-cache.json | 32 + .../dom.expected/template.hydrate.js | 185 +- .../__snapshots__/.name-cache.json | 14 + .../dom.expected/template.hydrate.js | 44 +- .../__snapshots__/.name-cache.json | 16 + .../dom.expected/template.hydrate.js | 62 +- .../__snapshots__/.name-cache.json | 12 + .../dom.expected/template.hydrate.js | 37 +- .../__snapshots__/.name-cache.json | 11 + .../dom.expected/template.hydrate.js | 39 +- .../__snapshots__/.name-cache.json | 5 + .../const-tag/__snapshots__/.name-cache.json | 5 + .../__snapshots__/.name-cache.json | 12 + .../dom.expected/template.hydrate.js | 33 +- .../__snapshots__/.name-cache.json | 12 + .../dom.expected/template.hydrate.js | 67 +- .../__snapshots__/.name-cache.json | 14 + .../dom.expected/template.hydrate.js | 68 +- .../__snapshots__/.name-cache.json | 12 + .../dom.expected/template.hydrate.js | 67 +- .../__snapshots__/.name-cache.json | 10 + .../dom.expected/template.hydrate.js | 21 +- .../__snapshots__/.name-cache.json | 10 + .../dom.expected/template.hydrate.js | 21 +- .../__snapshots__/.name-cache.json | 11 + .../dom.expected/template.hydrate.js | 29 +- .../__snapshots__/.name-cache.json | 10 + .../dom.expected/template.hydrate.js | 21 +- .../__snapshots__/.name-cache.json | 10 + .../dom.expected/template.hydrate.js | 21 +- .../__snapshots__/.name-cache.json | 11 + .../dom.expected/template.hydrate.js | 35 +- .../__snapshots__/.name-cache.json | 9 + .../dom.expected/template.hydrate.js | 14 +- .../__snapshots__/.name-cache.json | 12 + .../dom.expected/template.hydrate.js | 32 +- .../__snapshots__/.name-cache.json | 5 + .../__snapshots__/.name-cache.json | 5 + .../__snapshots__/.name-cache.json | 17 + .../dom.expected/template.hydrate.js | 68 +- .../__snapshots__/.name-cache.json | 16 + .../dom.expected/template.hydrate.js | 62 +- .../__snapshots__/.name-cache.json | 14 + .../dom.expected/template.hydrate.js | 55 +- .../__snapshots__/.name-cache.json | 7 + .../dom.expected/template.hydrate.js | 8 +- .../__snapshots__/.name-cache.json | 5 + .../__snapshots__/.name-cache.json | 7 + .../dom.expected/template.hydrate.js | 8 +- .../__snapshots__/.name-cache.json | 7 + .../dom.expected/template.hydrate.js | 8 +- .../__snapshots__/.name-cache.json | 10 + .../dom.expected/template.hydrate.js | 33 +- .../__snapshots__/.name-cache.json | 15 + .../dom.expected/template.hydrate.js | 62 +- .../__snapshots__/.name-cache.json | 11 + .../dom.expected/template.hydrate.js | 31 +- .../__snapshots__/.name-cache.json | 14 + .../dom.expected/template.hydrate.js | 49 +- .../do-tag/__snapshots__/.name-cache.json | 10 + .../dom.expected/template.hydrate.js | 22 +- .../__snapshots__/.name-cache.json | 16 + .../dom.expected/template.hydrate.js | 48 +- .../__snapshots__/.name-cache.json | 12 + .../dom.expected/template.hydrate.js | 44 +- .../__snapshots__/.name-cache.json | 10 + .../dom.expected/template.hydrate.js | 29 +- .../__snapshots__/.name-cache.json | 14 + .../dom.expected/template.hydrate.js | 49 +- .../__snapshots__/.name-cache.json | 12 + .../dom.expected/template.hydrate.js | 45 +- .../__snapshots__/.name-cache.json | 12 + .../dom.expected/template.hydrate.js | 41 +- .../__snapshots__/.name-cache.json | 10 + .../dom.expected/template.hydrate.js | 25 +- .../__snapshots__/.name-cache.json | 17 + .../dom.expected/template.hydrate.js | 51 +- .../__snapshots__/.name-cache.json | 23 + .../dom.expected/template.hydrate.js | 73 +- .../__snapshots__/.name-cache.json | 5 + .../__snapshots__/.name-cache.json | 12 + .../dom.expected/template.hydrate.js | 41 +- .../__snapshots__/.name-cache.json | 13 + .../dom.expected/template.hydrate.js | 42 +- .../__snapshots__/.name-cache.json | 16 + .../dom.expected/template.hydrate.js | 72 +- .../__snapshots__/.name-cache.json | 10 + .../dom.expected/template.hydrate.js | 27 +- .../__snapshots__/.name-cache.json | 8 + .../dom.expected/template.hydrate.js | 17 +- .../effect-tag/__snapshots__/.name-cache.json | 8 + .../dom.expected/template.hydrate.js | 13 +- .../entities/__snapshots__/.name-cache.json | 5 + .../__snapshots__/.name-cache.json | 16 + .../dom.expected/template.hydrate.js | 66 +- .../__snapshots__/.name-cache.json | 15 + .../dom.expected/template.hydrate.js | 47 +- .../__snapshots__/.name-cache.json | 5 + .../__snapshots__/.name-cache.json | 10 + .../dom.expected/template.hydrate.js | 22 +- .../for-tag/__snapshots__/.name-cache.json | 5 + .../__snapshots__/.name-cache.json | 5 + .../__snapshots__/.name-cache.json | 10 + .../dom.expected/template.hydrate.js | 27 +- .../__snapshots__/.name-cache.json | 9 + .../dom.expected/template.hydrate.js | 23 +- .../__snapshots__/.name-cache.json | 5 + .../id-tag/__snapshots__/.name-cache.json | 5 + .../__snapshots__/.name-cache.json | 12 + .../dom.expected/template.hydrate.js | 29 +- .../if-tag/__snapshots__/.name-cache.json | 7 + .../dom.expected/template.hydrate.js | 14 +- .../__snapshots__/.name-cache.json | 5 + .../__snapshots__/.name-cache.json | 5 + .../__snapshots__/.name-cache.json | 7 + .../dom.expected/template.hydrate.js | 6 +- .../import-tag/__snapshots__/.name-cache.json | 5 + .../__snapshots__/.name-cache.json | 19 + .../dom.expected/template.hydrate.js | 107 +- .../__snapshots__/.name-cache.json | 12 + .../dom.expected/template.hydrate.js | 47 +- .../__snapshots__/.name-cache.json | 12 + .../dom.expected/template.hydrate.js | 47 +- .../__snapshots__/.name-cache.json | 10 + .../dom.expected/template.hydrate.js | 25 +- .../__snapshots__/.name-cache.json | 11 + .../dom.expected/template.hydrate.js | 19 +- .../__snapshots__/.name-cache.json | 14 + .../dom.expected/template.hydrate.js | 52 +- .../let-tag/__snapshots__/.name-cache.json | 12 + .../dom.expected/template.hydrate.js | 37 +- .../__snapshots__/.name-cache.json | 9 + .../dom.expected/template.hydrate.js | 9 +- .../__snapshots__/.name-cache.json | 13 + .../dom.expected/template.hydrate.js | 44 +- .../__snapshots__/.name-cache.json | 11 + .../dom.expected/template.hydrate.js | 35 +- .../__snapshots__/.name-cache.json | 12 + .../dom.expected/template.hydrate.js | 40 +- .../log-tag/__snapshots__/.name-cache.json | 10 + .../dom.expected/template.hydrate.js | 10 +- .../__snapshots__/.name-cache.json | 5 + .../__snapshots__/.name-cache.json | 9 + .../dom.expected/template.hydrate.js | 16 +- .../__snapshots__/.name-cache.json | 9 + .../dom.expected/template.hydrate.js | 16 +- .../__snapshots__/.name-cache.json | 8 + .../dom.expected/template.hydrate.js | 15 +- .../__snapshots__/.name-cache.json | 8 + .../dom.expected/template.hydrate.js | 7 +- .../__snapshots__/.name-cache.json | 12 + .../dom.expected/template.hydrate.js | 38 +- .../__snapshots__/.name-cache.json | 5 + .../__snapshots__/.name-cache.json | 10 + .../dom.expected/template.hydrate.js | 52 +- .../__snapshots__/.name-cache.json | 9 + .../dom.expected/template.hydrate.js | 16 +- .../__snapshots__/.name-cache.json | 5 + .../__snapshots__/.name-cache.json | 5 + .../__snapshots__/.name-cache.json | 13 + .../dom.expected/template.hydrate.js | 43 +- .../__snapshots__/.name-cache.json | 16 + .../dom.expected/template.hydrate.js | 79 +- .../__snapshots__/.name-cache.json | 7 + .../dom.expected/template.hydrate.js | 6 +- .../__snapshots__/.name-cache.json | 14 + .../dom.expected/template.hydrate.js | 47 +- .../__snapshots__/.name-cache.json | 8 + .../dom.expected/template.hydrate.js | 12 +- .../__snapshots__/.name-cache.json | 20 + .../dom.expected/template.hydrate.js | 104 +- .../__snapshots__/.name-cache.json | 15 + .../dom.expected/template.hydrate.js | 51 +- .../__snapshots__/.name-cache.json | 5 + .../__snapshots__/.name-cache.json | 8 + .../dom.expected/template.hydrate.js | 13 +- .../__snapshots__/.name-cache.json | 5 + .../__snapshots__/.name-cache.json | 5 + .../__snapshots__/.name-cache.json | 10 + .../dom.expected/template.hydrate.js | 19 +- .../__snapshots__/.name-cache.json | 5 + .../src/__tests__/main.test.ts | 24 +- .../src/__tests__/utils/bundle.ts | 33 +- packages/translator-tags/tsconfig.json | 1 + scripts/sizes.ts | 82 +- 289 files changed, 6000 insertions(+), 3917 deletions(-) create mode 100644 .sizes/name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/assignment-before-tag-var/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/at-tag-inside-if-tag/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/at-tags/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/attr-boolean-dynamic/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/attr-boolean/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/attr-escape/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/attr-falsey/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/attr-template-literal-escape/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/basic-chain/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/basic-component-attrs/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/basic-component-input-alias/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/basic-component-input-same-source-alias-within-pattern/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/basic-component-input-same-source-alias/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/basic-component-input/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/basic-component-renderBody/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/basic-component/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/basic-conditional-counter-multiple-nodes/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/basic-conditional-counter/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/basic-converge-in-if/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/basic-counter-const-event-handler/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/basic-counter-multiplier/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/basic-counter/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/basic-dynamic-native-tag/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/basic-effect-no-deps/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/basic-execution-order/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/basic-export/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/basic-flush-here/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/basic-fn-with-block/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/basic-handler-multi-ref-nested/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/basic-handler-refless/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/basic-inert-collapsible-tree/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/basic-layout/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/basic-nested-for/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/basic-nested-params/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/basic-nested-scope-custom-tag/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/basic-nested-scope-dynamic-tag/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/basic-nested-scope-for/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/basic-nested-scope-if/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/basic-push-pop-list/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/basic-shared-node-ref/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/basic-static/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/basic-toggle-show/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/basic-unused-ref/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/batched-updates-cleanup/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/batched-updates/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/body-content/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/cleanup-n-child-for-shallow/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/cleanup-n-child-if-deep/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/cleanup-n-child-if-same-scope/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/cleanup-n-child-if-shallow/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-for-deep/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-for-shallow/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-if-deep/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-if-same-scope/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-if-shallow/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/component-attrs-intersection/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/component-attrs-static-code/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/const-tag-destructure/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/const-tag/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/controllable-checked-spread/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/controllable-checked-value/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/controllable-checked-values-spread/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/controllable-checked-values/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/controllable-checked/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/controllable-input-value/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/controllable-select-dynamic-spread/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/controllable-select/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/controllable-textarea-value/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/counter-intersection/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/create-and-clear-rows-loop-from/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/create-and-clear-rows-loop-in/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/custom-tag-child-analyze/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/custom-tag-default-value/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/custom-tag-parameters-from-args/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/custom-tag-parameters-from-attributes/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/custom-tag-parameters-from-single-arg/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/custom-tag-render-body/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/custom-tag-template/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/custom-tag-var-expression/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/custom-tag-var-multiple/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/custom-tag-var/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/define-tag-for-attribute-tag/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/define-tag-object/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/define-tag-render/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/do-tag/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/dollar-global-client/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/dynamic-closures/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/dynamic-event-handlers/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/dynamic-native-dynamic-tag/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/dynamic-tag-args-tag-var/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/dynamic-tag-args/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/dynamic-tag-attr-signal/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/dynamic-tag-custom-native/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/dynamic-tag-custom-tags/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/dynamic-tag-native/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/dynamic-tag-single-arg/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/dynamic-tag-sometimes-null/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/dynamic-tag-with-updating-body/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/effect-counter/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/effect-serialize-promise/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/effect-tag/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/entities/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/for-destructure/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/for-event-handler/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/for-tag-siblings/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/for-tag-with-state/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/for-tag/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/hello-dynamic/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/html-comment-counter/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/html-comment-var/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/html-entity/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/id-tag/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/if-default-false/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/if-tag/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/import-tag-conflict/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/import-tag-shorthand/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/import-tag-ternary/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/import-tag/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/let-tag-controllable-child/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/let-tag-controllable-id/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/let-tag-controllable-static/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/let-tag-derived/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/let-tag-set-in-effect/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/let-tag-with-intersection/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/let-tag/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/let-undefined-until-dom/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/lifecycle-tag-assignment/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/lifecycle-tag-this/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/lifecycle-tag/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/log-tag/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/migrate-input/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/move-and-clear-children/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/move-and-clear-top-level/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/native-tag-ref-effect-child/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/native-tag-ref-effect/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/nested-assignment-expression/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/placeholders/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/reassignment-expression-counter/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/remove-and-add-rows/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/return-tag-no-var/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/same-source-alias-pattern-and-identifier/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/same-source-non-alias/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/shadow-same-scope/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/tag-resolution-priority/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/tag-var-destructure/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/toggle-first-child/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/toggle-nested/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/update-attr/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/update-dynamic-attrs/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/update-html/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/update-text/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/user-effect-abort-signal/__snapshots__/.name-cache.json create mode 100644 packages/translator-tags/src/__tests__/fixtures/walk-over-child/__snapshots__/.name-cache.json diff --git a/.prettierignore b/.prettierignore index a49f021e4a..8f19a8512c 100644 --- a/.prettierignore +++ b/.prettierignore @@ -2,6 +2,7 @@ __snapshots__ !packages/marko/src/node_modules .cache .nvm +.sizes .sizes.json .vscode *actual* diff --git a/.sizes.json b/.sizes.json index 6c019f2d0d..f2f7be8e7e 100644 --- a/.sizes.json +++ b/.sizes.json @@ -7,68 +7,68 @@ { "name": "*", "total": { - "min": 19082, - "brotli": 6876 + "min": 17806, + "brotli": 6448 } }, { "name": "counter", "user": { - "min": 272, - "brotli": 195 + "min": 222, + "brotli": 159 }, "runtime": { - "min": 3725, + "min": 3737, "brotli": 1580 }, "total": { - "min": 3997, - "brotli": 1775 + "min": 3959, + "brotli": 1739 } }, { "name": "counter 💧", "user": { - "min": 201, - "brotli": 150 + "min": 137, + "brotli": 114 }, "runtime": { - "min": 3171, - "brotli": 1430 + "min": 3137, + "brotli": 1416 }, "total": { - "min": 3372, - "brotli": 1580 + "min": 3274, + "brotli": 1530 } }, { "name": "comments", "user": { - "min": 1126, - "brotli": 595 + "min": 1028, + "brotli": 518 }, "runtime": { - "min": 7815, - "brotli": 3196 + "min": 7744, + "brotli": 3141 }, "total": { - "min": 8941, - "brotli": 3791 + "min": 8772, + "brotli": 3659 } }, { "name": "comments 💧", "user": { - "min": 972, - "brotli": 531 + "min": 872, + "brotli": 470 }, "runtime": { - "min": 8829, - "brotli": 3601 + "min": 8751, + "brotli": 3547 }, "total": { - "min": 9801, - "brotli": 4132 + "min": 9623, + "brotli": 4017 } } ] diff --git a/.sizes/comments.csr/entry.js b/.sizes/comments.csr/entry.js index a1d51c30f0..2c0e723bd2 100644 --- a/.sizes/comments.csr/entry.js +++ b/.sizes/comments.csr/entry.js @@ -1,126 +1,116 @@ -import { - r as s, - e as a, - c as n, - o as t, - s as o, - a as c, - v as i, - i as m, - b as e, - d as l, - f as u, - g as d, - h as r, - j as b, - l as f, - k as p, - m as v, -} from "./runtime-C9sq24Du.js"; -const $ = "", - h = r( +// size: 1028 (min) 518 (brotli) +const _expr_comment_id$ifBody = intersection( 2, - (s) => { + (_scope) => { const { - _: { 6: a, 8: n }, - } = s; - I(s[0], { comments: a.comments, path: n }); + _: { 6: comment, 8: id }, + } = _scope; + _input_$1(_scope[0], { comments: comment.comments, path: id }); }, - () => p(0, I), + () => inChild(0, _input_$1), ), - k = c(8, 0, void 0, () => h), - K = c(6, 0, void 0, () => h), - T = s( + _id$ifBody = closure(8, 0, void 0, () => _expr_comment_id$ifBody), + _comment$ifBody = closure(6, 0, void 0, () => _expr_comment_id$ifBody), + _ifBody = register( "QURHKITf", - n( - `${$}`, + createRenderer( + "", "/ b&", - (s) => { - s[0]; + (_scope) => { + _scope[0]; }, - () => [k, K], + () => [_id$ifBody, _comment$ifBody], ), ), - _ = r( + _expr_input_i$forBody = intersection( 2, - (s) => { + (_scope) => { const { - _: { 2: a }, - 7: n, - } = s; - U(s, `${a.path || "c"}-${n}`); + _: { 2: input }, + 7: i, + } = _scope; + _id$forBody(_scope, `${input.path || "c"}-${i}`); }, - () => U, + () => _id$forBody, ), - j = b(4), - E = a("ZcKJNKFe", (s) => - t( - s[2], + _if$forBody = conditional(4), + _open$forBody_effect = effect("ZcKJNKFe", (_scope) => + on( + _scope[2], "click", - ((s) => { - const { 9: a } = s; + ((_scope) => { + const { 9: open } = _scope; return function () { - F(s, !a); + _open$forBody(_scope, !open); }; - })(s), + })(_scope), ), ), - F = o(9, (s, a) => { - e(s[0], "hidden", !a), l(s[3], a ? "[-]" : "[+]"), E(s); + _open$forBody = state(9, (_scope, open) => { + attr(_scope[0], "hidden", !open), + data(_scope[3], open ? "[-]" : "[+]"), + _open$forBody_effect(_scope); }), - U = i( + _id$forBody = value( 8, - (s, a) => e(s[0], "id", a), - () => u(k, 4), + (_scope, id) => attr(_scope[0], "id", id), + () => inConditionalScope(_id$ifBody, 4), ), - Z = i(7, 0, () => _), - g = i( + _i$forBody = value(7, 0, () => _expr_input_i$forBody), + _comment$forBody = value( 6, - (s, a) => { - l(s[1], a.text), j(s, a.comments ? T : null); + (_scope, comment) => { + data(_scope[1], comment.text), + _if$forBody(_scope, comment.comments ? _ifBody : null); }, - () => m([j, u(K, 4)]), + () => intersections([_if$forBody, inConditionalScope(_comment$ifBody, 4)]), ), - x = i( + _params_2$forBody = value( 5, - (s, a) => { - g(s, a[0]), Z(s, a[1]); + (_scope, _params_2) => { + _comment$forBody(_scope, _params_2[0]), _i$forBody(_scope, _params_2[1]); }, - () => m([g, Z]), + () => intersections([_comment$forBody, _i$forBody]), ), - D = c(2, 0, void 0, () => _), - H = f( + _input$forBody = closure(2, 0, void 0, () => _expr_input_i$forBody), + _for = loopOf( 0, - s( + register( "$F_EaYZk", - n( + createRenderer( "
    • ", " E l D l%", - (s) => { - F(s, !0); + (_scope) => { + _open$forBody(_scope, !0); }, - () => [D], - () => x, + () => [_input$forBody], + () => _params_2$forBody, ), ), ), - I = i( + _input_$1 = value( 2, - (s, a) => H(s, [a.comments]), - () => m([H, d(D, 0)]), + (_scope, input) => _for(_scope, [input.comments]), + () => intersections([_for, inLoopScope(_input$forBody, 0)]), ), - J = `${$}`, - N = i( + _input_ = value( 2, - (s, a) => I(s[0], a), - () => p(0, I), + (_scope, input) => _input_$1(_scope[0], input), + () => inChild(0, _input_$1), ), - Q = i( + _params__ = value( 1, - (s, a) => N(s, a[0]), - () => N, + (_scope, _params_) => _input_(_scope, _params_[0]), + () => _input_, ); -function R(s) { - s[0]; +function _setup_(_scope) { + _scope[0]; } -v("rUbTinTf", J, "/ b&", R, void 0, () => Q).mount(); +createTemplate( + "rUbTinTf", + "", + "/ b&", + _setup_, + void 0, + () => _params__, +).mount(); diff --git a/.sizes/comments.ssr/entry.js b/.sizes/comments.ssr/entry.js index bebad8abd5..eae7d1a9df 100644 --- a/.sizes/comments.ssr/entry.js +++ b/.sizes/comments.ssr/entry.js @@ -1,111 +1,96 @@ -import { - r as s, - e as a, - c as t, - o as n, - s as o, - a as c, - v as i, - b as m, - d as e, - i as l, - f as u, - g as d, - h as r, - j as p, - k as b, - l as f, - m as h, -} from "./runtime-BsJqPx8B.js"; -const v = u( +// size: 872 (min) 470 (brotli) +const _expr_comment_id$ifBody = intersection( 2, - (s) => { + (_scope) => { const { - _: { 6: a, 8: t }, - } = s; - J(s[0], { comments: a.comments, path: t }); + _: { 6: comment, 8: id }, + } = _scope; + _input_(_scope[0], { comments: comment.comments, path: id }); }, - () => b(0, J), + () => inChild(0, _input_), ), - k = c(8, 0, void 0, () => v), - K = c(6, 0, void 0, () => v), - $ = s( + _id$ifBody = closure(8, 0, void 0, () => _expr_comment_id$ifBody), + _comment$ifBody = closure(6, 0, void 0, () => _expr_comment_id$ifBody), + _ifBody = register( "QURHKITf", - t( + createRenderer( "", "/ b&", - (s) => { - s[0]; + (_scope) => { + _scope[0]; }, - () => [k, K], + () => [_id$ifBody, _comment$ifBody], ), ), - _ = u( + _expr_input_i$forBody = intersection( 2, - (s) => { + (_scope) => { const { - _: { 2: a }, - 7: t, - } = s; - Z(s, `${a.path || "c"}-${t}`); + _: { 2: input }, + 7: i, + } = _scope; + _id$forBody(_scope, `${input.path || "c"}-${i}`); }, - () => Z, + () => _id$forBody, ), - j = d(4), - E = a("ZcKJNKFe", (s) => - n( - s[2], + _if$forBody = conditional(4), + _open$forBody_effect = effect("ZcKJNKFe", (_scope) => + on( + _scope[2], "click", - ((s) => { - const { 9: a } = s; + ((_scope) => { + const { 9: open } = _scope; return function () { - F(s, !a); + _open$forBody(_scope, !open); }; - })(s), + })(_scope), ), ), - F = o(9, (s, a) => { - m(s[0], "hidden", !a), e(s[3], a ? "[-]" : "[+]"), E(s); + _open$forBody = state(9, (_scope, open) => { + attr(_scope[0], "hidden", !open), + data(_scope[3], open ? "[-]" : "[+]"), + _open$forBody_effect(_scope); }), - Z = i( + _id$forBody = value( 8, - (s, a) => m(s[0], "id", a), - () => r(k, 4), + (_scope, id) => attr(_scope[0], "id", id), + () => inConditionalScope(_id$ifBody, 4), ), - g = i(7, 0, () => _), - x = i( + _i$forBody = value(7, 0, () => _expr_input_i$forBody), + _comment$forBody = value( 6, - (s, a) => { - e(s[1], a.text), j(s, a.comments ? $ : null); + (_scope, comment) => { + data(_scope[1], comment.text), + _if$forBody(_scope, comment.comments ? _ifBody : null); }, - () => l([j, r(K, 4)]), + () => intersections([_if$forBody, inConditionalScope(_comment$ifBody, 4)]), ), - D = i( + _params_2$forBody = value( 5, - (s, a) => { - x(s, a[0]), g(s, a[1]); + (_scope, _params_2) => { + _comment$forBody(_scope, _params_2[0]), _i$forBody(_scope, _params_2[1]); }, - () => l([x, g]), + () => intersections([_comment$forBody, _i$forBody]), ), - H = c(2, 0, void 0, () => _), - I = f( + _input$forBody = closure(2, 0, void 0, () => _expr_input_i$forBody), + _for = loopOf( 0, - s( + register( "$F_EaYZk", - t( + createRenderer( "
    • ", " E l D l%", - (s) => { - F(s, !0); + (_scope) => { + _open$forBody(_scope, !0); }, - () => [H], - () => D, + () => [_input$forBody], + () => _params_2$forBody, ), ), ), - J = i( + _input_ = value( 2, - (s, a) => I(s, [a.comments]), - () => l([I, p(H, 0)]), + (_scope, input) => _for(_scope, [input.comments]), + () => intersections([_for, inLoopScope(_input$forBody, 0)]), ); -h(); +init(); diff --git a/.sizes/counter.csr/entry.js b/.sizes/counter.csr/entry.js index a8bed95196..989e72eacf 100644 --- a/.sizes/counter.csr/entry.js +++ b/.sizes/counter.csr/entry.js @@ -1,20 +1,25 @@ -import { e as t, c as n, o, s, d as c } from "./runtime-iO38DTrJ.js"; -const i = t("XBSGKvBc", (t) => - o( - t[0], +// size: 222 (min) 159 (brotli) +const _clickCount_effect = effect("XBSGKvBc", (_scope) => + on( + _scope[0], "click", - ((t) => { - const { 2: n } = t; + ((_scope) => { + const { 2: clickCount } = _scope; return function () { - u(t, n + 1); + _clickCount(_scope, clickCount + 1); }; - })(t), + })(_scope), ), ), - u = s(2, (t, n) => { - c(t[1], n), i(t); + _clickCount = state(2, (_scope, clickCount) => { + data(_scope[1], clickCount), _clickCount_effect(_scope); }); -function a(t) { - u(t, 0); +function _setup_(_scope) { + _clickCount(_scope, 0); } -n("tPaZsVqd", "
    ", "D D m", a).mount(); +createTemplate( + "tPaZsVqd", + "
    ", + "D D m", + _setup_, +).mount(); diff --git a/.sizes/counter.ssr/entry.js b/.sizes/counter.ssr/entry.js index 08b8d8a8ae..6350afd914 100644 --- a/.sizes/counter.ssr/entry.js +++ b/.sizes/counter.ssr/entry.js @@ -1,17 +1,17 @@ -import { e as s, o as c, s as n, d as o, i as t } from "./runtime-bm0WoCsz.js"; -const a = s("XBSGKvBc", (s) => - c( - s[0], +// size: 137 (min) 114 (brotli) +const _clickCount_effect = effect("XBSGKvBc", (_scope) => + on( + _scope[0], "click", - ((s) => { - const { 2: c } = s; + ((_scope) => { + const { 2: clickCount } = _scope; return function () { - i(s, c + 1); + _clickCount(_scope, clickCount + 1); }; - })(s), + })(_scope), ), ), - i = n(2, (s, c) => { - o(s[1], c), a(s); + _clickCount = state(2, (_scope, clickCount) => { + data(_scope[1], clickCount), _clickCount_effect(_scope); }); -t(); +init(); diff --git a/.sizes/dom.js b/.sizes/dom.js index 70487fb9d3..d92ea38844 100644 --- a/.sizes/dom.js +++ b/.sizes/dom.js @@ -1,1330 +1,1655 @@ -var e = [], - t = Symbol(); -function n(n) { - return (n[Symbol.iterator] = i), (n[t] = e), n; +// size: 17806 (min) 6448 (brotli) +var empty = [], + rest = Symbol(); +function attrTag(attrs2) { + return ( + (attrs2[Symbol.iterator] = attrTagIterator), (attrs2[rest] = empty), attrs2 + ); } -function r(r, i) { - return r ? (r[t] === e ? (r[t] = [i]) : r[t].push(i), r) : n(i); +function attrTags(first, attrs2) { + return first + ? (first[rest] === empty + ? (first[rest] = [attrs2]) + : first[rest].push(attrs2), + first) + : attrTag(attrs2); } -function* i() { - yield this, yield* this[t]; +function* attrTagIterator() { + yield this, yield* this[rest]; } -function l(e, t) { - for (let n in e) t(n, e[n]); +function forIn(obj, cb) { + for (let key in obj) cb(key, obj[key]); } -function o(e, t) { - if (e) { - let n = 0; - for (let r of e) t(r, n++); +function forOf(list, cb) { + if (list) { + let i = 0; + for (let item of list) cb(item, i++); } } -function f(e, t, n, r) { - let i = t || 0, - l = n || 1; - for (let t = (e - i) / l, n = 0; n <= t; n++) r(i + n * l); +function forTo(to, from, step, cb) { + let start = from || 0, + delta = step || 1; + for (let steps = (to - start) / delta, i = 0; i <= steps; i++) + cb(start + i * delta); } -var u, - a = (() => { - let { port1: e, port2: t } = new MessageChannel(); +var isScheduled, + port2 = (() => { + let { port1: port1, port2: port22 } = new MessageChannel(); return ( - (e.onmessage = () => { - (u = !1), Q(); + (port1.onmessage = () => { + (isScheduled = !1), run(); }), - t + port22 ); })(); -function c() { - Q(), requestAnimationFrame(s); -} -function s() { - a.postMessage(0); -} -function d(e) { - return { u: 1, $global: e }; -} -var h = d({}); -function g(e) { - return (h.a = h.b = e), h; -} -function p(e) { - v(e), e.d?.h?.delete(e); - let t = e.x?.c; - if (t) for (let n of t) n.j?.(e); - return e; -} -function v(e) { - e.h?.forEach(v); - let t = e.l; - if (t) for (let e of t.values()) e.abort(); -} -function b(e) { - let t = e.d; - for (; t && !t.h?.has(e); ) (t.h ||= new Set()).add(e), (t = (e = t).d); -} -function m(e) { - p(e); - let t = e.a, - n = e.b.nextSibling; - for (; t !== n; ) { - let e = t.nextSibling; - t.remove(), (t = e); +function flushAndWaitFrame() { + run(), requestAnimationFrame(triggerMacroTask); +} +function triggerMacroTask() { + port2.postMessage(0); +} +function createScope($global) { + return { u: 1, $global: $global }; +} +var emptyScope = createScope({}); +function getEmptyScope(marker) { + return (emptyScope.a = emptyScope.b = marker), emptyScope; +} +function destroyScope(scope) { + _destroyScope(scope), scope.d?.h?.delete(scope); + let closureSignals = scope.x?.c; + if (closureSignals) for (let signal of closureSignals) signal.j?.(scope); + return scope; +} +function _destroyScope(scope) { + scope.h?.forEach(_destroyScope); + let controllers = scope.l; + if (controllers) for (let ctrl of controllers.values()) ctrl.abort(); +} +function onDestroy(scope) { + let parentScope = scope.d; + for (; parentScope && !parentScope.h?.has(scope); ) + (parentScope.h ||= new Set()).add(scope), + (parentScope = (scope = parentScope).d); +} +function removeAndDestroyScope(scope) { + destroyScope(scope); + let current = scope.a, + stop = scope.b.nextSibling; + for (; current !== stop; ) { + let next = current.nextSibling; + current.remove(), (current = next); } } -function y(e, t, n) { - let r = e.a, - i = e.b.nextSibling; - for (; r !== i; ) { - let e = r.nextSibling; - t.insertBefore(r, n), (r = e); +function insertBefore(scope, parent, nextSibling) { + let current = scope.a, + stop = scope.b.nextSibling; + for (; current !== stop; ) { + let next = current.nextSibling; + parent.insertBefore(current, nextSibling), (current = next); } } -var k = {}, - w = class { +var registeredValues = {}, + Render = class { m = []; n = {}; - y = { _: k }; - constructor(e, t, n) { - (this.z = e), (this.A = t), (this.o = n), (this.p = e[n]), this.q(); + y = { _: registeredValues }; + constructor(renders, runtimeId, renderId) { + (this.z = renders), + (this.A = runtimeId), + (this.o = renderId), + (this.p = renders[renderId]), + this.q(); } w() { this.p.w(), this.q(); } q() { - let e = this.p, - t = this.y, - n = this.n, - r = e.v, - i = new Map(); - if (r.length) { - let t = e.i.length, - l = new Map(); - e.v = []; - let o = (e, t = this.f, r = e) => { - let o = (n[t] ||= {}), - f = r; - for (; 8 === (f = f.previousSibling).nodeType; ); - o.b = f; - let u = (o.a ||= f), - a = l.size; - for (let [e, n] of l) { - if (!a--) break; - e !== t && - 4 & u.compareDocumentPosition(n) && - 2 & r.compareDocumentPosition(n) && - (i.set("" + e, t), l.delete(e)); + let data2 = this.p, + serializeContext = this.y, + scopeLookup = this.n, + visits = data2.v, + cleanupOwners = new Map(); + if (visits.length) { + let commentPrefixLen = data2.i.length, + cleanupMarkers = new Map(); + data2.v = []; + let sectionEnd = (visit, scopeId = this.f, curNode = visit) => { + let scope = (scopeLookup[scopeId] ||= {}), + endNode = curNode; + for (; 8 === (endNode = endNode.previousSibling).nodeType; ); + scope.b = endNode; + let startNode = (scope.a ||= endNode), + len = cleanupMarkers.size; + for (let [markerScopeId, markerNode] of cleanupMarkers) { + if (!len--) break; + markerScopeId !== scopeId && + 4 & startNode.compareDocumentPosition(markerNode) && + 2 & curNode.compareDocumentPosition(markerNode) && + (cleanupOwners.set("" + markerScopeId, scopeId), + cleanupMarkers.delete(markerScopeId)); } - return l.set(t, e), o; + return cleanupMarkers.set(scopeId, visit), scope; }; - for (let e of r) { - let r = e.data, - i = r[t], - f = parseInt(r.slice(t + 1)), - u = (n[f] ||= {}), - a = r.indexOf(" ") + 1, - c = a ? r.slice(a) : ""; - if ("*" === i) u[c] = e.previousSibling; - else if ("$" === i) l.set(f, e); - else if ("[" === i) - this.f && (c && o(e), this.m.push(this.f)), (this.f = f), (u.a = e); - else if ("]" === i) { - if (((u[c] = e), f < this.f)) { - let t = e.parentNode, - n = o(e).a; - t && t !== n.parentNode && t.prepend(n), (this.f = this.m.pop()); + for (let visit of visits) { + let commentText = visit.data, + token = commentText[commentPrefixLen], + scopeId = parseInt(commentText.slice(commentPrefixLen + 1)), + scope = (scopeLookup[scopeId] ||= {}), + dataIndex = commentText.indexOf(" ") + 1, + data3 = dataIndex ? commentText.slice(dataIndex) : ""; + if ("*" === token) scope[data3] = visit.previousSibling; + else if ("$" === token) cleanupMarkers.set(scopeId, visit); + else if ("[" === token) + this.f && (data3 && sectionEnd(visit), this.m.push(this.f)), + (this.f = scopeId), + (scope.a = visit); + else if ("]" === token) { + if (((scope[data3] = visit), scopeId < this.f)) { + let currParent = visit.parentNode, + startNode = sectionEnd(visit).a; + currParent && + currParent !== startNode.parentNode && + currParent.prepend(startNode), + (this.f = this.m.pop()); } - } else if ("|" === i) { - u[parseInt(c)] = e; - let t = JSON.parse("[" + c.slice(c.indexOf(" ") + 1) + "]"), - n = e; - for (let r = t.length - 1; r >= 0; r--) n = o(e, t[r], n).b; + } else if ("|" === token) { + scope[parseInt(data3)] = visit; + let childScopeIds = JSON.parse( + "[" + data3.slice(data3.indexOf(" ") + 1) + "]", + ), + curNode = visit; + for (let i = childScopeIds.length - 1; i >= 0; i--) + curNode = sectionEnd(visit, childScopeIds[i], curNode).b; } } } - let l = e.r; - if (l) { - e.r = []; - let r = l.length, - o = 0; + let resumes = data2.r; + if (resumes) { + data2.r = []; + let len = resumes.length, + i = 0; try { - for (C = !0; o < r; ) { - let e = l[o++]; - if ("function" == typeof e) { - let r = e(t), - { $global: l } = n; - l || - ((n.$global = l = r.$ || {}), - (l.runtimeId = this.A), - (l.renderId = this.o)); - for (let e in r) - if ("$" !== e) { - let t = r[e], - o = n[e]; - (t.$global = l), o !== t && (n[e] = Object.assign(t, o)); - let f = i.get(e); - f && ((t.d = r[f]), b(t)); + for (isResuming = !0; i < len; ) { + let resumeData = resumes[i++]; + if ("function" == typeof resumeData) { + let scopes = resumeData(serializeContext), + { $global: $global } = scopeLookup; + $global || + ((scopeLookup.$global = $global = scopes.$ || {}), + ($global.runtimeId = this.A), + ($global.renderId = this.o)); + for (let scopeId in scopes) + if ("$" !== scopeId) { + let scope = scopes[scopeId], + prevScope = scopeLookup[scopeId]; + (scope.$global = $global), + prevScope !== scope && + (scopeLookup[scopeId] = Object.assign(scope, prevScope)); + let cleanupOwnerId = cleanupOwners.get(scopeId); + cleanupOwnerId && + ((scope.d = scopes[cleanupOwnerId]), onDestroy(scope)); } } else - o === r || "string" != typeof l[o] + i === len || "string" != typeof resumes[i] ? delete this.z[this.o] - : k[l[o++]](n[e]); + : registeredValues[resumes[i++]](scopeLookup[resumeData]); } } finally { - C = !1; + isResuming = !1; } } } }, - C = !1; -function A(e, t) { - return (k[e] = t), t; -} -function S(e, t) { - return (k[e] = (e) => (n) => t(e, n)), t; -} -function N(e = "M") { - let t, - n = (r) => (n[r] = t[r] = new w(t, e, r)); - function r(r) { - t = r; - for (let e in r) n(e); - Object.defineProperty(window, e, { configurable: !0, value: n }); + isResuming = !1; +function register(id, obj) { + return (registeredValues[id] = obj), obj; +} +function registerBoundSignal(id, signal) { + return ( + (registeredValues[id] = (scope) => (valueOrOp) => signal(scope, valueOrOp)), + signal + ); +} +function init(runtimeId = "M") { + let renders, + resumeRender = (renderId) => + (resumeRender[renderId] = renders[renderId] = + new Render(renders, runtimeId, renderId)); + function setRenders(v) { + renders = v; + for (let renderId in v) resumeRender(renderId); + Object.defineProperty(window, runtimeId, { + configurable: !0, + value: resumeRender, + }); } - window[e] - ? r(window[e]) - : Object.defineProperty(window, e, { configurable: !0, set: r }); -} -function x(e, t) { - return A(e, t.g), t; -} -function $(e, t) { - return A(e, (e) => () => e[t]); -} -var M = {}, - E = {}, - I = {}; -function T(e, t, n) { - let r = _(e, t, n), - i = e + "#"; - return (e, t, n) => ( - H - ? r(e, t === M || t === E || t === I || n || void 0 === e[i] ? t : E) - : n - ? n(t) - : (function (e, t, n) { - u || ((u = !0), queueMicrotask(c)), - (H = !0), - t(e, M), - (H = !1), - X.push(e, t, n); - })(e, r, t), - t + window[runtimeId] + ? setRenders(window[runtimeId]) + : Object.defineProperty(window, runtimeId, { + configurable: !0, + set: setRenders, + }); +} +function registerSubscriber(id, signal) { + return register(id, signal.g), signal; +} +function nodeRef(id, key) { + return register(id, (scope) => () => scope[key]); +} +var MARK = {}, + CLEAN = {}, + DIRTY = {}; +function state(valueAccessor, fn, getIntersection) { + let valueSignal = value(valueAccessor, fn, getIntersection), + markAccessor = valueAccessor + "#"; + return (scope, valueOrOp, valueChange) => ( + rendering + ? valueSignal( + scope, + valueOrOp === MARK || + valueOrOp === CLEAN || + valueOrOp === DIRTY || + valueChange || + void 0 === scope[markAccessor] + ? valueOrOp + : CLEAN, + ) + : valueChange + ? valueChange(valueOrOp) + : (function (scope, signal, value2) { + isScheduled || + ((isScheduled = !0), queueMicrotask(flushAndWaitFrame)), + (rendering = !0), + signal(scope, MARK), + (rendering = !1), + pendingSignals.push(scope, signal, value2); + })(scope, valueSignal, valueOrOp), + valueOrOp ); } -function _(e, t, n) { - let r = e + "#", - i = n && ((e, t) => (i = n())(e, t)); - return (n, l) => { - if (l === M) 1 === (n[r] = (n[r] ?? 0) + 1) && i?.(n, M); - else if (l !== I) { - let o = void 0 !== n[r]; - 1 === (n[r] ||= 1) && - (l === E || (o && n[e] === l) - ? i?.(n, E) - : ((n[e] = l), t && t(n, l), i?.(n, I))), - n[r]--; +function value(valueAccessor, fn, getIntersection) { + let markAccessor = valueAccessor + "#", + intersection2 = + getIntersection && + ((scope, op) => (intersection2 = getIntersection())(scope, op)); + return (scope, valueOrOp) => { + if (valueOrOp === MARK) + 1 === (scope[markAccessor] = (scope[markAccessor] ?? 0) + 1) && + intersection2?.(scope, MARK); + else if (valueOrOp !== DIRTY) { + let existing = void 0 !== scope[markAccessor]; + 1 === (scope[markAccessor] ||= 1) && + (valueOrOp === CLEAN || (existing && scope[valueAccessor] === valueOrOp) + ? intersection2?.(scope, CLEAN) + : ((scope[valueAccessor] = valueOrOp), + fn && fn(scope, valueOrOp), + intersection2?.(scope, DIRTY))), + scope[markAccessor]--; } }; } -var O = 0; -function B(e, t, n) { - let r = "?" + O++, - i = r + "#", - l = n && ((e, t) => (l = n())(e, t)); - return (n, o) => { - o === M - ? 1 === (n[i] = (n[i] ?? 0) + 1) && l?.(n, M) - : void 0 === n[i] - ? ((n[i] = e - 1), (n[r] = !0)) - : 0 == --n[i] - ? o === I || n[r] - ? ((n[r] = !1), t(n, 0), l?.(n, I)) - : l?.(n, E) - : (n[r] ||= o === I); +var accessorId = 0; +function intersection(count, fn, getIntersection) { + let dirtyAccessor = "?" + accessorId++, + markAccessor = dirtyAccessor + "#", + intersection2 = + getIntersection && + ((scope, op) => (intersection2 = getIntersection())(scope, op)); + return (scope, op) => { + op === MARK + ? 1 === (scope[markAccessor] = (scope[markAccessor] ?? 0) + 1) && + intersection2?.(scope, MARK) + : void 0 === scope[markAccessor] + ? ((scope[markAccessor] = count - 1), (scope[dirtyAccessor] = !0)) + : 0 == --scope[markAccessor] + ? op === DIRTY || scope[dirtyAccessor] + ? ((scope[dirtyAccessor] = !1), + fn(scope, 0), + intersection2?.(scope, DIRTY)) + : intersection2?.(scope, CLEAN) + : (scope[dirtyAccessor] ||= op === DIRTY); }; } -var V = (e) => e._; -function j(e, t, n = V, r) { - let i = "?" + O++, - l = i + 1, - o = "function" == typeof e ? e : () => e, - f = r && ((e, t) => (f = r())(e, t)); - return (e, r) => { - if (r === M) 1 === (e[l] = (e[l] ?? 0) + 1) && f?.(e, M); +var defaultGetOwnerScope = (scope) => scope._; +function closure( + ownerValueAccessor, + fn, + getOwnerScope = defaultGetOwnerScope, + getIntersection, +) { + let dirtyAccessor = "?" + accessorId++, + markAccessor = dirtyAccessor + 1, + getOwnerValueAccessor = + "function" == typeof ownerValueAccessor + ? ownerValueAccessor + : () => ownerValueAccessor, + intersection2 = + getIntersection && + ((scope, op) => (intersection2 = getIntersection())(scope, op)); + return (scope, op) => { + if (op === MARK) + 1 === (scope[markAccessor] = (scope[markAccessor] ?? 0) + 1) && + intersection2?.(scope, MARK); else { - let u, a; - if (void 0 === e[l]) { - (u = n(e)), (a = o(e)); - let t = u[a + "#"], - i = void 0 === t ? !u.u : 0 === t; - (e[l] = i ? 1 : 2), (r = I); + let ownerScope, ownerValueAccessor2; + if (void 0 === scope[markAccessor]) { + (ownerScope = getOwnerScope(scope)), + (ownerValueAccessor2 = getOwnerValueAccessor(scope)); + let ownerMark = ownerScope[ownerValueAccessor2 + "#"], + ownerHasRun = void 0 === ownerMark ? !ownerScope.u : 0 === ownerMark; + (scope[markAccessor] = ownerHasRun ? 1 : 2), (op = DIRTY); } - 0 == --e[l] - ? r === I || e[i] - ? ((e[i] = !1), - (u ||= n(e)), - (a ||= o(e)), - t && t(e, u[a]), - f?.(e, I)) - : f?.(e, E) - : (e[i] ||= r === I); + 0 == --scope[markAccessor] + ? op === DIRTY || scope[dirtyAccessor] + ? ((scope[dirtyAccessor] = !1), + (ownerScope ||= getOwnerScope(scope)), + (ownerValueAccessor2 ||= getOwnerValueAccessor(scope)), + fn && fn(scope, ownerScope[ownerValueAccessor2]), + intersection2?.(scope, DIRTY)) + : intersection2?.(scope, CLEAN) + : (scope[dirtyAccessor] ||= op === DIRTY); } }; } -function R(e, t, n = V, r) { - let i = "function" == typeof e ? e : () => e, - l = j(i, t, n, r), - o = new WeakMap(); +function dynamicClosure( + ownerValueAccessor, + fn, + getOwnerScope = defaultGetOwnerScope, + getIntersection, +) { + let getOwnerValueAccessor = + "function" == typeof ownerValueAccessor + ? ownerValueAccessor + : () => ownerValueAccessor, + signalFn = closure( + getOwnerValueAccessor, + fn, + getOwnerScope, + getIntersection, + ), + subscribeFns = new WeakMap(); return ( - (l.g = (e) => { - let t = (t) => l(e, t), - r = n(e), - f = i(e) + "*"; - o.set(e, t), (r[f] ||= new Set()).add(t); + (signalFn.g = (scope) => { + let subscribeFn = (value2) => signalFn(scope, value2), + ownerScope = getOwnerScope(scope), + providerSubscriptionsAccessor = getOwnerValueAccessor(scope) + "*"; + subscribeFns.set(scope, subscribeFn), + (ownerScope[providerSubscriptionsAccessor] ||= new Set()).add( + subscribeFn, + ); }), - (l.j = (e) => { - let t = n(e), - r = i(e) + "*"; - t[r]?.delete(o.get(e)), o.delete(e); + (signalFn.j = (scope) => { + let ownerScope = getOwnerScope(scope), + providerSubscriptionsAccessor = getOwnerValueAccessor(scope) + "*"; + ownerScope[providerSubscriptionsAccessor]?.delete( + subscribeFns.get(scope), + ), + subscribeFns.delete(scope); }), - l + signalFn ); } -function q(e, t) { - let n = (n, r) => { - let i = n[t]; - for (let t of e) t(i, r); +function childClosures(closureSignals, childAccessor) { + let signal = (scope, op) => { + let childScope = scope[childAccessor]; + for (let closureSignal of closureSignals) closureSignal(childScope, op); }; return ( - (n.g = (n) => { - let r = n[t]; - for (let t of e) t.g?.(r); + (signal.g = (scope) => { + let childScope = scope[childAccessor]; + for (let closureSignal of closureSignals) closureSignal.g?.(childScope); }), - (n.j = (n) => { - let r = n[t]; - for (let t of e) t.j?.(r); + (signal.j = (scope) => { + let childScope = scope[childAccessor]; + for (let closureSignal of closureSignals) closureSignal.j?.(childScope); }), - n + signal ); } -function D(e) { - let t = e + "*"; - return (e, n) => { - let r = e[t]; - if (r) for (let e of r) e(n); +function dynamicSubscribers(valueAccessor) { + let subscribersAccessor = valueAccessor + "*"; + return (scope, op) => { + let subscribers = scope[subscribersAccessor]; + if (subscribers) for (let subscriber of subscribers) subscriber(op); }; } -function P(e, t, n) { - e[t]["/"] = (t) => n(e, t); +function setTagVar(scope, childAccessor, tagVarSignal2) { + scope[childAccessor]["/"] = (valueOrOp) => tagVarSignal2(scope, valueOrOp); } -var W = (e, t) => e["/"]?.(t), - L = (e, t, n) => { - let r = e?.c; - if (r) for (let e of r) e(t, n); +var tagVarSignal = (scope, valueOrOp) => scope["/"]?.(valueOrOp), + renderBodyClosures = (renderBody, childScope, op) => { + let signals = renderBody?.c; + if (signals) for (let signal of signals) signal(childScope, op); }, - z = new WeakMap(); -function F({ $global: e }) { - let t = z.get(e) || 0; - return z.set(e, t + 1), "c" + e.runtimeId + e.renderId + t.toString(36); -} -function U(e, t) { - return (n, r) => { - t(n[e], r); + tagIdsByGlobal = new WeakMap(); +function nextTagId({ $global: $global }) { + let id = tagIdsByGlobal.get($global) || 0; + return ( + tagIdsByGlobal.set($global, id + 1), + "c" + $global.runtimeId + $global.renderId + id.toString(36) + ); +} +function inChild(childAccessor, signal) { + return (scope, valueOrOp) => { + signal(scope[childAccessor], valueOrOp); }; } -function G(e) { - return (t, n) => { - for (let r of e) r(t, n); +function intersections(signals) { + return (scope, op) => { + for (let signal of signals) signal(scope, op); }; } -function J(e, t) { +function effect(id, fn) { return ( - A(e, t), - (e) => { - K(e, t); + register(id, fn), + (scope) => { + queueEffect(scope, fn); } ); } -var X = [], - Z = [], - H = !1; -function K(e, t) { - Z.push(e, t); +var pendingSignals = [], + pendingEffects = [], + rendering = !1; +function queueEffect(scope, fn) { + pendingEffects.push(scope, fn); } -function Q() { - let e = X, - t = Z; +function run() { + let signals = pendingSignals, + effects = pendingEffects; try { - (H = !0), (X = []), te(e); + (rendering = !0), (pendingSignals = []), runSignals(signals); } finally { - H = !1; + rendering = !1; } - (Z = []), ee(t); + (pendingEffects = []), runEffects(effects); } -function Y(e) { - let t = X, - n = Z, - r = (Z = []), - i = (X = []); +function prepareEffects(fn) { + let prevSignals = pendingSignals, + prevEffects = pendingEffects, + preparedEffects = (pendingEffects = []), + preparedSignals = (pendingSignals = []); try { - (H = !0), e(), (X = t), te(i); + (rendering = !0), + fn(), + (pendingSignals = prevSignals), + runSignals(preparedSignals); } finally { - (H = !1), (X = t), (Z = n); + (rendering = !1), + (pendingSignals = prevSignals), + (pendingEffects = prevEffects); } - return r; + return preparedEffects; } -function ee(e = Z) { - for (let t = 0; t < e.length; t += 2) { - let n = e[t]; - (0, e[t + 1])(n); +function runEffects(effects = pendingEffects) { + for (let i = 0; i < effects.length; i += 2) { + let scope = effects[i]; + (0, effects[i + 1])(scope); } } -function te(e) { - for (let t = 0; t < e.length; t += 3) { - let n = e[t + 0]; - (0, e[t + 1])(n, e[t + 2]); +function runSignals(signals) { + for (let i = 0; i < signals.length; i += 3) { + let scope = signals[i + 0]; + (0, signals[i + 1])(scope, signals[i + 2]); } } -function ne(e, t) { - let n = e.l; - if (n) { - let e = n.get(t); - e && (K(null, () => e.abort()), n.delete(t)); +function resetAbortSignal(scope, id) { + let controllers = scope.l; + if (controllers) { + let ctrl = controllers.get(id); + ctrl && (queueEffect(null, () => ctrl.abort()), controllers.delete(id)); } } -function re(e, t) { - let n = (e.l ||= new Map()), - r = n.get(t); - return r || (b(e), n.set(t, (r = new AbortController()))), r.signal; +function getAbortSignal(scope, id) { + let controllers = (scope.l ||= new Map()), + controller = controllers.get(id); + return ( + controller || + (onDestroy(scope), + controllers.set(id, (controller = new AbortController()))), + controller.signal + ); } -function ie(e, t) { - return t ? e : ""; +function stringifyClassObject(name, value2) { + return value2 ? name : ""; } -var le = /^(--|ta|or|li|z)|n-c|i(do|nk|m|t)|w$|we/; -function oe(e, t) { - return t || 0 === t - ? `${e}:${"number" == typeof t && t && !le.test(e) ? t + "px" : t}` +var NON_DIMENSIONAL = /^(--|ta|or|li|z)|n-c|i(do|nk|m|t)|w$|we/; +function stringifyStyleObject(name, value2) { + return value2 || 0 === value2 + ? `${name}:${"number" == typeof value2 && value2 && !NON_DIMENSIONAL.test(name) ? value2 + "px" : value2}` : ""; } -function fe(e, t, n) { - switch (typeof e) { +function toDelimitedString(val, delimiter, stringify) { + switch (typeof val) { case "string": - return e; + return val; case "object": - if (null !== e) { - let r = "", - i = ""; - if (Array.isArray(e)) - for (let l of e) { - let e = fe(l, t, n); - "" !== e && ((r += i + e), (i = t)); + if (null !== val) { + let result = "", + curDelimiter = ""; + if (Array.isArray(val)) + for (let v of val) { + let part = toDelimitedString(v, delimiter, stringify); + "" !== part && + ((result += curDelimiter + part), (curDelimiter = delimiter)); } else - for (let l in e) { - let o = n(l, e[l]); - "" !== o && ((r += i + o), (i = t)); + for (let name in val) { + let part = stringify(name, val[name]); + "" !== part && + ((result += curDelimiter + part), (curDelimiter = delimiter)); } - return r; + return result; } } return ""; } -function ue(e) { - if (e) return e.renderBody || e.default || e; -} -var ae = 2147483647; -var ce = new Map(), - se = he(); -function de(e, t, n) { - let r = ce.get(t); - r || ce.set(t, (r = new WeakMap())), - r.has(e) || se(e, t, ge), - r.set(e, n || void 0); -} -function he() { - let e = new WeakMap(); - return function (t, n, r) { - let i = t.getRootNode(), - l = e.get(i); - l || e.set(i, (l = new Set())), - l.has(n) || (l.add(n), i.addEventListener(n, r, !0)); +function normalizeDynamicRenderer(value2) { + if (value2) return value2.renderBody || value2.default || value2; +} +var elementHandlersByEvent = new Map(), + defaultDelegator = createDelegator(); +function on(element, type, handler) { + let handlersByElement = elementHandlersByEvent.get(type); + handlersByElement || + elementHandlersByEvent.set(type, (handlersByElement = new WeakMap())), + handlersByElement.has(element) || + defaultDelegator(element, type, handleDelegated), + handlersByElement.set(element, handler || void 0); +} +function createDelegator() { + let delegatedEventsByRoot = new WeakMap(); + return function (node, type, handler) { + let root = node.getRootNode(), + delegatedEvents = delegatedEventsByRoot.get(root); + delegatedEvents || + delegatedEventsByRoot.set(root, (delegatedEvents = new Set())), + delegatedEvents.has(type) || + (delegatedEvents.add(type), root.addEventListener(type, handler, !0)); }; } -function ge(e) { - let t = e.target; - if (t) { - let n = ce.get(e.type); - if ((n.get(t)?.(e, t), e.bubbles)) - for (; (t = t.parentElement) && !e.cancelBubble; ) n.get(t)?.(e, t); +function handleDelegated(ev) { + let target = ev.target; + if (target) { + let handlersByElement = elementHandlersByEvent.get(ev.type); + if ((handlersByElement.get(target)?.(ev, target), ev.bubbles)) + for (; (target = target.parentElement) && !ev.cancelBubble; ) + handlersByElement.get(target)?.(ev, target); } } -function pe(e) { - return e.replace(/[^\p{L}\p{N}]/gu, ""); -} -function ve(e, t, n, r) { - Ee(e, t, 0, Pe(n), r); -} -function be(e, t) { - let n = e[t]; - _e(n, "input", je, () => { - let r = e[t + ";"]; - r && - ((e[t + "="] = 6), - r(n.checked), - Q(), - 6 === e[t + "="] && (n.checked = !n.checked)); +function stripSpacesAndPunctuation(str) { + return str.replace(/[^\p{L}\p{N}]/gu, ""); +} +function controllable_input_checked( + scope, + nodeAccessor, + checked, + checkedChange, +) { + setCheckboxValue( + scope, + nodeAccessor, + 0, + normalizeBoolProp(checked), + checkedChange, + ); +} +function controllable_input_checked_effect(scope, nodeAccessor) { + let el = scope[nodeAccessor]; + syncControllable(el, "input", hasCheckboxChanged, () => { + let checkedChange = scope[nodeAccessor + ";"]; + checkedChange && + ((scope[nodeAccessor + "="] = 6), + checkedChange(el.checked), + run(), + 6 === scope[nodeAccessor + "="] && (el.checked = !el.checked)); }); } -function me(e, t, n, r, i) { - (e[t + ":"] = n), - Ge(e[t], "value", i), - Ee(e, t, 1, Array.isArray(n) ? n.includes(i) : n === i, r); -} -function ye(e, t) { - let n = e[t]; - _e(n, "input", je, () => { - let r = e[t + ";"]; - if (r) { - let i = e[t + ":"]; - (e[t + "="] = 6), - r( - Array.isArray(i) - ? (function (e, t, n) { - let r = e.indexOf(t); +function controllable_input_checkedValue( + scope, + nodeAccessor, + checkedValue, + checkedValueChange, + value2, +) { + (scope[nodeAccessor + ":"] = checkedValue), + attr(scope[nodeAccessor], "value", value2), + setCheckboxValue( + scope, + nodeAccessor, + 1, + Array.isArray(checkedValue) + ? checkedValue.includes(value2) + : checkedValue === value2, + checkedValueChange, + ); +} +function controllable_input_checkedValue_effect(scope, nodeAccessor) { + let el = scope[nodeAccessor]; + syncControllable(el, "input", hasCheckboxChanged, () => { + let checkedValueChange = scope[nodeAccessor + ";"]; + if (checkedValueChange) { + let oldValue = scope[nodeAccessor + ":"]; + (scope[nodeAccessor + "="] = 6), + checkedValueChange( + Array.isArray(oldValue) + ? (function (arr, val, push) { + let index = arr.indexOf(val); return ( - (n - ? !~r && [...e, t] - : ~r && e.slice(0, r).concat(e.slice(r + 1))) || e + (push + ? !~index && [...arr, val] + : ~index && + arr.slice(0, index).concat(arr.slice(index + 1))) || arr ); - })(i, n.value, n.checked) - : n.checked - ? n.value + })(oldValue, el.value, el.checked) + : el.checked + ? el.value : void 0, ), - Q(), - 6 === e[t + "="] && (n.checked = !n.checked); + run(), + 6 === scope[nodeAccessor + "="] && (el.checked = !el.checked); } }); } -function ke(e, t, n, r) { - let i = e[t], - l = De(n); - (e[t + ";"] = r), - r - ? ((e[t + "="] = 0), - (e[t + ":"] = n), - i.isConnected ? Me(i, l) : (i.defaultValue = l)) - : ((e[t + "="] = 5), (i.defaultValue = l)); -} -function we(e, t) { - let n = e[t]; - C && (e[t + ":"] = n.defaultValue), - _e(n, "input", Ve, (r) => { - let i = e[t + ";"]; - i && - ((e[t + "="] = 6), - r && ($e = r.inputType), - i(n.value), - Q(), - 6 === e[t + "="] && Me(n, e[t + ":"]), - ($e = "")); +function controllable_input_value(scope, nodeAccessor, value2, valueChange) { + let el = scope[nodeAccessor], + normalizedValue = normalizeStrProp(value2); + (scope[nodeAccessor + ";"] = valueChange), + valueChange + ? ((scope[nodeAccessor + "="] = 0), + (scope[nodeAccessor + ":"] = value2), + el.isConnected + ? setValueAndUpdateSelection(el, normalizedValue) + : (el.defaultValue = normalizedValue)) + : ((scope[nodeAccessor + "="] = 5), (el.defaultValue = normalizedValue)); +} +function controllable_input_value_effect(scope, nodeAccessor) { + let el = scope[nodeAccessor]; + isResuming && (scope[nodeAccessor + ":"] = el.defaultValue), + syncControllable(el, "input", hasValueChanged, (ev) => { + let valueChange = scope[nodeAccessor + ";"]; + valueChange && + ((scope[nodeAccessor + "="] = 6), + ev && (inputType = ev.inputType), + valueChange(el.value), + run(), + 6 === scope[nodeAccessor + "="] && + setValueAndUpdateSelection(el, scope[nodeAccessor + ":"]), + (inputType = "")); }); } -function Ce(e, t, n, r) { - (e[t + ";"] = r), - r ? ((e[t + "="] = 3), (e[t + ":"] = n)) : (e[t + "="] = 5), - Se(e[t], n, r); -} -function Ae(e, t) { - let n = e[t]; - _e(n, "input", Re, () => { - let r = e[t + ";"]; - r && - ((e[t + "="] = 6), - r( - Array.isArray(e[t + ":"]) ? Array.from(n.selectedOptions, We) : n.value, +function controllable_select_value(scope, nodeAccessor, value2, valueChange) { + (scope[nodeAccessor + ";"] = valueChange), + valueChange + ? ((scope[nodeAccessor + "="] = 3), (scope[nodeAccessor + ":"] = value2)) + : (scope[nodeAccessor + "="] = 5), + setSelectOptions(scope[nodeAccessor], value2, valueChange); +} +function controllable_select_value_effect(scope, nodeAccessor) { + let el = scope[nodeAccessor]; + syncControllable(el, "input", hasSelectChanged, () => { + let valueChange = scope[nodeAccessor + ";"]; + valueChange && + ((scope[nodeAccessor + "="] = 6), + valueChange( + Array.isArray(scope[nodeAccessor + ":"]) + ? Array.from(el.selectedOptions, toValueProp) + : el.value, ), - Q(), - 6 === e[t + "="] && Se(n, e[t + ":"], r)); + run(), + 6 === scope[nodeAccessor + "="] && + setSelectOptions(el, scope[nodeAccessor + ":"], valueChange)); }); } -function Se(e, t, n) { - if (Array.isArray(t)) - for (let r of e.options) { - let e = t.includes(r.value); - n ? (r.selected = e) : (r.defaultSelected = e); +function setSelectOptions(el, value2, valueChange) { + if (Array.isArray(value2)) + for (let opt of el.options) { + let selected = value2.includes(opt.value); + valueChange + ? (opt.selected = selected) + : (opt.defaultSelected = selected); } else { - let r = De(t); - if (n) e.value = r; - else for (let t of e.options) t.defaultSelected = t.value === r; + let normalizedValue = normalizeStrProp(value2); + if (valueChange) el.value = normalizedValue; + else + for (let opt of el.options) + opt.defaultSelected = opt.value === normalizedValue; } } -function Ne(e, t, n, r) { - (e[t + ";"] = r), (e[t + "="] = r ? 4 : 5), (e[t].open = Pe(n)); -} -function xe(e, t) { - let n = e[t]; - _e( - n, - "DIALOG" === n.tagName ? "close" : "toggle", - () => e[t + ";"] && n.open !== e[t + ":"], +function controllable_detailsOrDialog_open( + scope, + nodeAccessor, + open, + openChange, +) { + (scope[nodeAccessor + ";"] = openChange), + (scope[nodeAccessor + "="] = openChange ? 4 : 5), + (scope[nodeAccessor].open = normalizeBoolProp(open)); +} +function controllable_detailsOrDialog_open_effect(scope, nodeAccessor) { + let el = scope[nodeAccessor]; + syncControllable( + el, + "DIALOG" === el.tagName ? "close" : "toggle", + () => scope[nodeAccessor + ";"] && el.open !== scope[nodeAccessor + ":"], () => { - let r = e[t + ";"]; - r && - ((e[t + "="] = 6), - r(n.open), - Q(), - 6 === e[t + "="] && (n.open = !n.open)); + let openChange = scope[nodeAccessor + ";"]; + openChange && + ((scope[nodeAccessor + "="] = 6), + openChange(el.open), + run(), + 6 === scope[nodeAccessor + "="] && (el.open = !el.open)); }, ); } -var $e = ""; -function Me(e, t) { - let n = e.value; - if (n !== t) - if (e.getRootNode().activeElement === e) { - let r = e.selectionStart; - e.value = t; - let i = (function (e, t, n, r) { - if (n !== t.length || /kw/.test(r)) { - let r = t.slice(0, n), - i = t.slice(n); - if (e.startsWith(r)) return n; - if (e.endsWith(i)) return e.length - i.length; +var inputType = ""; +function setValueAndUpdateSelection(el, value2) { + let initialValue = el.value; + if (initialValue !== value2) + if (el.getRootNode().activeElement === el) { + let initialPosition = el.selectionStart; + el.value = value2; + let updatedPosition = (function ( + updatedValue, + initialValue, + initialPosition, + inputType2, + ) { + if (initialPosition !== initialValue.length || /kw/.test(inputType2)) { + let before = initialValue.slice(0, initialPosition), + after = initialValue.slice(initialPosition); + if (updatedValue.startsWith(before)) return initialPosition; + if (updatedValue.endsWith(after)) + return updatedValue.length - after.length; { - let t = pe(r).length, - n = 0, - i = 0; - for (; i < t; ) pe(e[n]) && i++, n++; - return n; + let relevantChars = stripSpacesAndPunctuation(before).length, + pos = 0, + relevantIndex = 0; + for (; relevantIndex < relevantChars; ) + stripSpacesAndPunctuation(updatedValue[pos]) && relevantIndex++, + pos++; + return pos; } } return -1; - })(e.value, n, r, $e); - ~i && e.setSelectionRange(i, i); - } else e.value = t; -} -function Ee(e, t, n, r, i) { - (e[t + ";"] = i), - i - ? ((e[t + "="] = n), (e[t].checked = r)) - : ((e[t + "="] = 5), (e[t].defaultChecked = r)); -} -var Ie = he(), - Te = new WeakMap(); -function _e(e, t, n, r) { - Te.set(e, r), - Ie(e, t, Oe), - e.form && Ie(e.form, "reset", Be), - C && n(e) && queueMicrotask(r); -} -function Oe(e) { - Te.get(e.target)?.(e); -} -function Be(e) { - let t = []; - for (let n of e.target.elements) { - let e = Te.get(n); - e && qe(n) && t.push(e); + })(el.value, initialValue, initialPosition, inputType); + ~updatedPosition && + el.setSelectionRange(updatedPosition, updatedPosition); + } else el.value = value2; +} +function setCheckboxValue(scope, nodeAccessor, type, checked, checkedChange) { + (scope[nodeAccessor + ";"] = checkedChange), + checkedChange + ? ((scope[nodeAccessor + "="] = type), + (scope[nodeAccessor].checked = checked)) + : ((scope[nodeAccessor + "="] = 5), + (scope[nodeAccessor].defaultChecked = checked)); +} +var delegateFormControl = createDelegator(), + formChangeHandlers = new WeakMap(); +function syncControllable(el, event, hasChanged, onChange) { + formChangeHandlers.set(el, onChange), + delegateFormControl(el, event, onFormChange), + el.form && delegateFormControl(el.form, "reset", onFormReset), + isResuming && hasChanged(el) && queueMicrotask(onChange); +} +function onFormChange(ev) { + formChangeHandlers.get(ev.target)?.(ev); +} +function onFormReset(ev) { + let handlers = []; + for (let el of ev.target.elements) { + let handler = formChangeHandlers.get(el); + handler && hasFormElementChanged(el) && handlers.push(handler); } requestAnimationFrame(() => { - if (!e.defaultPrevented) for (let e of t) e(); + if (!ev.defaultPrevented) for (let change of handlers) change(); }); } -function Ve(e) { - return e.value !== e.defaultValue; +function hasValueChanged(el) { + return el.value !== el.defaultValue; } -function je(e) { - return e.checked !== e.defaultChecked; +function hasCheckboxChanged(el) { + return el.checked !== el.defaultChecked; } -function Re(e) { - for (let t of e.options) if (t.selected !== t.defaultSelected) return !0; +function hasSelectChanged(el) { + for (let opt of el.options) + if (opt.selected !== opt.defaultSelected) return !0; } -function qe(e) { - return e.options ? Re(e) : Ve(e) || je(e); +function hasFormElementChanged(el) { + return el.options + ? hasSelectChanged(el) + : hasValueChanged(el) || hasCheckboxChanged(el); } -function De(e) { - return it(e) || ""; +function normalizeStrProp(value2) { + return normalizeAttrValue(value2) || ""; } -function Pe(e) { - return null != e && !1 !== e; +function normalizeBoolProp(value2) { + return null != value2 && !1 !== value2; } -function We(e) { - return e.value; +function toValueProp(it) { + return it.value; } -var Le = document.createTextNode(""), - ze = new Range(); -function Fe(e) { - return ze.createContextualFragment(e); +var fallback = document.createTextNode(""), + parser = new Range(); +function parseHTML(html2) { + return parser.createContextualFragment(html2); } -var Ue = /^on[A-Z-]/; -function Ge(e, t, n) { - Je(e, t, it(n)); +var eventHandlerReg = /^on[A-Z-]/; +function attr(element, name, value2) { + setAttribute(element, name, normalizeAttrValue(value2)); } -function Je(e, t, n) { - e.getAttribute(t) != n && - (void 0 === n ? e.removeAttribute(t) : e.setAttribute(t, n)); +function setAttribute(element, name, value2) { + element.getAttribute(name) != value2 && + (void 0 === value2 + ? element.removeAttribute(name) + : element.setAttribute(name, value2)); } -function Xe(e, t) { - Je( - e, +function classAttr(element, value2) { + setAttribute( + element, "class", - (function (e) { - return fe(e, " ", ie); - })(t) || void 0, + (function (value2) { + return toDelimitedString(value2, " ", stringifyClassObject); + })(value2) || void 0, ); } -function Ze(e, t) { - Je( - e, +function styleAttr(element, value2) { + setAttribute( + element, "style", - (function (e) { - return fe(e, ";", oe); - })(t) || void 0, + (function (value2) { + return toDelimitedString(value2, ";", stringifyStyleObject); + })(value2) || void 0, + ); +} +function data(node, value2) { + let normalizedValue = (function (value2) { + return value2 || 0 === value2 ? value2 + "" : "‍"; + })(value2); + node.data !== normalizedValue && (node.data = normalizedValue); +} +function attrs(scope, nodeAccessor, nextAttrs) { + let el = scope[nodeAccessor]; + for (let { name: name } of el.attributes) + (nextAttrs && (name in nextAttrs || hasAttrAlias(el, name, nextAttrs))) || + el.removeAttribute(name); + attrsInternal(scope, nodeAccessor, nextAttrs); +} +function hasAttrAlias(element, attr2, nextAttrs) { + return ( + "checked" === attr2 && + "INPUT" === element.tagName && + "checkedValue" in nextAttrs ); } -function He(e, t) { - let n = (function (e) { - return e || 0 === e ? e + "" : "‍"; - })(t); - e.data !== n && (e.data = n); -} -function Ke(e, t, n) { - let r = e[t]; - for (let { name: e } of r.attributes) - (n && (e in n || Qe(r, e, n))) || r.removeAttribute(e); - et(e, t, n); -} -function Qe(e, t, n) { - return "checked" === t && "INPUT" === e.tagName && "checkedValue" in n; -} -function Ye(e, t, n, r) { - let i = e[t], - l = {}; - for (let { name: e } of i.attributes) - !r[e] && (!n || !(e in n)) && i.removeAttribute(e); - for (let e in n) r[e] || (l[e] = n[e]); - et(e, t, l); -} -function et(e, t, n) { - let r, - i, - l = e[t]; - switch (l.tagName) { +function partialAttrs(scope, nodeAccessor, nextAttrs, skip) { + let el = scope[nodeAccessor], + partial = {}; + for (let { name: name } of el.attributes) + !skip[name] && + (!nextAttrs || !(name in nextAttrs)) && + el.removeAttribute(name); + for (let key in nextAttrs) skip[key] || (partial[key] = nextAttrs[key]); + attrsInternal(scope, nodeAccessor, partial); +} +function attrsInternal(scope, nodeAccessor, nextAttrs) { + let events, + skip, + el = scope[nodeAccessor]; + switch (el.tagName) { case "INPUT": - if ("checked" in n || "checkedChange" in n) - ve(e, t, n.checked, n.checkedChange); - else if ("checkedValue" in n || "checkedValueChange" in n) - me(e, t, n.checkedValue, n.checkedValueChange, n.value); + if ("checked" in nextAttrs || "checkedChange" in nextAttrs) + controllable_input_checked( + scope, + nodeAccessor, + nextAttrs.checked, + nextAttrs.checkedChange, + ); + else if ("checkedValue" in nextAttrs || "checkedValueChange" in nextAttrs) + controllable_input_checkedValue( + scope, + nodeAccessor, + nextAttrs.checkedValue, + nextAttrs.checkedValueChange, + nextAttrs.value, + ); else { - if (!("value" in n) && !("valueChange" in n)) break; - ke(e, t, n.value, n.valueChange); + if (!("value" in nextAttrs) && !("valueChange" in nextAttrs)) break; + controllable_input_value( + scope, + nodeAccessor, + nextAttrs.value, + nextAttrs.valueChange, + ); } - i = /^(?:value|checked(?:Value)?)(?:Change)?$/; + skip = /^(?:value|checked(?:Value)?)(?:Change)?$/; break; case "SELECT": - ("value" in n || "valueChange" in n) && - (Ce(e, t, n.value, n.valueChange), (i = /^value(?:Change)?$/)); + ("value" in nextAttrs || "valueChange" in nextAttrs) && + (controllable_select_value( + scope, + nodeAccessor, + nextAttrs.value, + nextAttrs.valueChange, + ), + (skip = /^value(?:Change)?$/)); break; case "TEXTAREA": - ("value" in n || "valueChange" in n) && - (ke(e, t, n.value, n.valueChange), (i = /^value(?:Change)?$/)); + ("value" in nextAttrs || "valueChange" in nextAttrs) && + (controllable_input_value( + scope, + nodeAccessor, + nextAttrs.value, + nextAttrs.valueChange, + ), + (skip = /^value(?:Change)?$/)); break; case "DETAILS": case "DIALOG": - ("open" in n || "openChange" in n) && - (Ne(e, t, n.open, n.openChange), (i = /^open(?:Change)?$/)); + ("open" in nextAttrs || "openChange" in nextAttrs) && + (controllable_detailsOrDialog_open( + scope, + nodeAccessor, + nextAttrs.open, + nextAttrs.openChange, + ), + (skip = /^open(?:Change)?$/)); } - for (let o in n) { - let f = n[o]; - switch (o) { + for (let name in nextAttrs) { + let value2 = nextAttrs[name]; + switch (name) { case "class": - Xe(l, f); + classAttr(el, value2); break; case "style": - Ze(l, f); + styleAttr(el, value2); break; case "renderBody": break; default: - Ue.test(o) - ? ((r ||= e[t + "~"] = {})[ - "-" === o[2] ? o.slice(3) : o.slice(2).toLowerCase() - ] = f) - : i?.test(o) || Ge(l, o, f); + eventHandlerReg.test(name) + ? ((events ||= scope[nodeAccessor + "~"] = {})[ + "-" === name[2] ? name.slice(3) : name.slice(2).toLowerCase() + ] = value2) + : skip?.test(name) || attr(el, name, value2); } } } -function tt(e, t) { - let n = e[t], - r = e[t + "~"]; - switch (e[t + "="]) { +function attrsEvents(scope, nodeAccessor) { + let el = scope[nodeAccessor], + events = scope[nodeAccessor + "~"]; + switch (scope[nodeAccessor + "="]) { case 0: - be(e, t); + controllable_input_checked_effect(scope, nodeAccessor); break; case 1: - ye(e, t); + controllable_input_checkedValue_effect(scope, nodeAccessor); break; case 2: - we(e, t); + controllable_input_value_effect(scope, nodeAccessor); break; case 3: - Ae(e, t); + controllable_select_value_effect(scope, nodeAccessor); break; case 4: - xe(e, t); + controllable_detailsOrDialog_open_effect(scope, nodeAccessor); } - for (let e in r) de(n, e, r[e]); -} -function nt(e, t, n) { - let r = e[n], - i = e[n + "-"] || r, - l = r.parentNode, - o = i.nextSibling, - f = Fe(t || 0 === t ? t + "" : ""); - (e[n] = f.firstChild), (e[n + "-"] = f.lastChild), l.insertBefore(f, r); - let u = r; - for (; u !== o; ) { - let e = u.nextSibling; - u.remove(), (u = e); + for (let name in events) on(el, name, events[name]); +} +function html(scope, value2, index) { + let firstChild = scope[index], + lastChild = scope[index + "-"] || firstChild, + parentNode = firstChild.parentNode, + afterReference = lastChild.nextSibling, + newContent = parseHTML(value2 || 0 === value2 ? value2 + "" : ""); + (scope[index] = newContent.firstChild), + (scope[index + "-"] = newContent.lastChild), + parentNode.insertBefore(newContent, firstChild); + let current = firstChild; + for (; current !== afterReference; ) { + let next = current.nextSibling; + current.remove(), (current = next); } } -function rt(e, t, n) { - let r = e[n], - i = e[n + "-"], - l = e[t]; - if (i) for (let e in i) e in r || (l[e] = void 0); - for (let e in r) l[e] = r[e]; - e[n + "-"] = r; -} -function it(e) { - if (e || 0 === e) return !0 === e ? "" : e + ""; -} -function lt(e, t, n) { - let r = e[t]; - r - ? (Object.assign(r, n), r.onUpdate?.()) - : ((e[t] = n), - n.onMount?.(), - (re(e, "-" + t).onabort = () => n.onDestroy?.())); -} -var ot = document.createTreeWalker(document); -function ft(e) { - let t = e.length; - for (; e.charCodeAt(--t) > 47; ); - return e.slice(0, t + 1); -} -function ut(e, t, n) { - (ot.currentNode = e), - at(t, n, n, 0), - (ot.currentNode = document.documentElement); -} -function at(e, t, n, r) { - let i, - l = 0, - o = 0, - f = 0; - for (n !== t && (t.d = n); (i = e.charCodeAt(r++)); ) - if (((o = l), (l = 0), i >= 117)) l = 10 * o + i - 117; - else if (i >= 107) { - for (i = 10 * o + i - 107; i--; ) ot.parentNode(); - ot.nextSibling(); - } else if (i >= 97) for (i = 10 * o + i - 97; i--; ) ot.nextSibling(); - else if (i >= 67) for (i = 20 * o + i - 67; i--; ) ot.nextNode(); - else if (47 === i) r = at(e, (t[f++] = d(t.$global)), n, r); +function props(scope, nodeIndex, index) { + let nextProps = scope[index], + prevProps = scope[index + "-"], + node = scope[nodeIndex]; + if (prevProps) + for (let name in prevProps) name in nextProps || (node[name] = void 0); + for (let name in nextProps) node[name] = nextProps[name]; + scope[index + "-"] = nextProps; +} +function normalizeAttrValue(value2) { + if (value2 || 0 === value2) return !0 === value2 ? "" : value2 + ""; +} +function lifecycle(scope, index, thisObj) { + let instance = scope[index]; + instance + ? (Object.assign(instance, thisObj), instance.onUpdate?.()) + : ((scope[index] = thisObj), + thisObj.onMount?.(), + (getAbortSignal(scope, "-" + index).onabort = () => + thisObj.onDestroy?.())); +} +var walker = document.createTreeWalker(document); +function trimWalkString(walkString) { + let end = walkString.length; + for (; walkString.charCodeAt(--end) > 47; ); + return walkString.slice(0, end + 1); +} +function walk(startNode, walkCodes, scope) { + (walker.currentNode = startNode), + walkInternal(walkCodes, scope, scope, 0), + (walker.currentNode = document.documentElement); +} +function walkInternal(walkCodes, scope, cleanupOwnerScope, currentWalkIndex) { + let value2, + storedMultiplier = 0, + currentMultiplier = 0, + currentScopeIndex = 0; + for ( + cleanupOwnerScope !== scope && (scope.d = cleanupOwnerScope); + (value2 = walkCodes.charCodeAt(currentWalkIndex++)); + + ) + if ( + ((currentMultiplier = storedMultiplier), + (storedMultiplier = 0), + value2 >= 117) + ) + storedMultiplier = 10 * currentMultiplier + value2 - 117; + else if (value2 >= 107) { + for (value2 = 10 * currentMultiplier + value2 - 107; value2--; ) + walker.parentNode(); + walker.nextSibling(); + } else if (value2 >= 97) + for (value2 = 10 * currentMultiplier + value2 - 97; value2--; ) + walker.nextSibling(); + else if (value2 >= 67) + for (value2 = 20 * currentMultiplier + value2 - 67; value2--; ) + walker.nextNode(); + else if (47 === value2) + currentWalkIndex = walkInternal( + walkCodes, + (scope[currentScopeIndex++] = createScope(scope.$global)), + cleanupOwnerScope, + currentWalkIndex, + ); else { - if (38 === i) return r; - if (32 === i) t[f++] = ot.currentNode; + if (38 === value2) return currentWalkIndex; + if (32 === value2) scope[currentScopeIndex++] = walker.currentNode; else { - let e = (t[f++] = document.createTextNode("")), - n = ot.currentNode; - n.parentNode.replaceChild(e, n), (ot.currentNode = e); + let newNode = (scope[currentScopeIndex++] = + document.createTextNode("")), + current = walker.currentNode; + current.parentNode.replaceChild(newNode, current), + (walker.currentNode = newNode); } } - return r; -} -function ct(e, t, n) { - let r = d(t); - if (((r._ = r.d = e.B || n), (r.x = e), dt(e, r), e.c)) - for (let t of e.c) t.g?.(r); - return r; -} -function st(e, t, n) { - if ("string" != typeof e) return ct(e, t, n); - let r = d(t); - return (r._ = r.d = n), (r[0] = r.a = r.b = document.createElement(e)), r; + return currentWalkIndex; +} +function createScopeWithRenderer(renderer, $global, ownerScope) { + let newScope = createScope($global); + if ( + ((newScope._ = newScope.d = renderer.B || ownerScope), + (newScope.x = renderer), + initRenderer(renderer, newScope), + renderer.c) + ) + for (let signal of renderer.c) signal.g?.(newScope); + return newScope; +} +function createScopeWithTagNameOrRenderer( + tagNameOrRenderer, + $global, + ownerScope, +) { + if ("string" != typeof tagNameOrRenderer) + return createScopeWithRenderer(tagNameOrRenderer, $global, ownerScope); + let newScope = createScope($global); + return ( + (newScope._ = newScope.d = ownerScope), + (newScope[0] = + newScope.a = + newScope.b = + document.createElement(tagNameOrRenderer)), + newScope + ); } -function dt(e, t) { - let n = e.k(); +function initRenderer(renderer, scope) { + let dom = renderer.k(); return ( - ut(11 === n.nodeType ? n.firstChild : n, e.C, t), - (t.a = 11 === n.nodeType ? n.firstChild : n), - (t.b = 11 === n.nodeType ? n.lastChild : n), - e.s && e.s(t), - n + walk(11 === dom.nodeType ? dom.firstChild : dom, renderer.C, scope), + (scope.a = 11 === dom.nodeType ? dom.firstChild : dom), + (scope.b = 11 === dom.nodeType ? dom.lastChild : dom), + renderer.s && renderer.s(scope), + dom ); } -function ht(e, t, n) { - return (r, i) => { - let l = r[e + "("]; - if (!l || i === I) return; - let o = r[e + "!"]; - if (i === M || i === E) return l.e?.(o, i); - let f = t?.(r); - if ("string" == typeof l) kt(o, 0, f), Ke(o, 0, i()); - else if (l.e) { - let e = i(); - l.e(o, n ? e : [f ? { ...e, renderBody: f } : e]); +function dynamicTagAttrs(nodeAccessor, getRenderBody, inputIsArgs) { + return (scope, attrsOrOp) => { + let renderer = scope[nodeAccessor + "("]; + if (!renderer || attrsOrOp === DIRTY) return; + let childScope = scope[nodeAccessor + "!"]; + if (attrsOrOp === MARK || attrsOrOp === CLEAN) + return renderer.e?.(childScope, attrsOrOp); + let renderBody = getRenderBody?.(scope); + if ("string" == typeof renderer) + setConditionalRendererOnlyChild(childScope, 0, renderBody), + attrs(childScope, 0, attrsOrOp()); + else if (renderer.e) { + let attributes = attrsOrOp(); + renderer.e( + childScope, + inputIsArgs + ? attributes + : [ + renderBody + ? { ...attributes, renderBody: renderBody } + : attributes, + ], + ); } }; } -function gt(e, t, n, r, i) { - let l, - o, - f = {}, - u = t ? ft(t) : " "; - return (t) => ({ - t: f, - D: e, - C: u, - s: n, - k: vt, - B: t, +function createRendererWithOwner( + template, + rawWalks, + setup, + getClosureSignals, + getArgs, +) { + let args, + closureSignals, + id = {}, + walks = rawWalks ? trimWalkString(rawWalks) : " "; + return (owner) => ({ + t: id, + D: template, + C: walks, + s: setup, + k: _clone, + B: owner, E: void 0, get e() { - return (l ||= i?.()); + return (args ||= getArgs?.()); }, get c() { - return (o ||= new Set(r?.())); + return (closureSignals ||= new Set(getClosureSignals?.())); }, }); } -function pt(e, t, n, r, i) { - return gt(e, t, n, r, i)(); -} -function vt() { - return (this.E ||= (function (e) { - let t = Fe(e); - return t.firstChild === t.lastChild ? t.firstChild || Le : t; +function createRenderer(template, walks, setup, getClosureSignals, getArgs) { + return createRendererWithOwner( + template, + walks, + setup, + getClosureSignals, + getArgs, + )(); +} +function _clone() { + return (this.E ||= (function (html2) { + let content = parseHTML(html2); + return content.firstChild === content.lastChild + ? content.firstChild || fallback + : content; })(this.D)).cloneNode(!0); } -var bt = function (e, t, n) { - let r = e + "(", - i = e + "!", - l = n && ((e, t) => (l = n())(e, t)); - return (n, o) => { - if (o === I) return; - let f = n[r], - u = o; - if (o !== M && o !== E) { - let i = ue(o); - _t(i, f) - ? ((f = n[r] = i), - (function (e, t, n) { - let r, - i = e[t + "!"]; - n - ? ((r = e[t + "!"] = st(n, e.$global, e)), (i = i || g(e[t]))) - : ((r = g(e[t])), (e[t + "!"] = void 0)), - y(r, i.a.parentNode, i.a), - m(i); - })(n, e, i), - t && t(n), - (u = I)) - : (u = E); +var conditional = function (nodeAccessor, fn, getIntersection) { + let rendererAccessor = nodeAccessor + "(", + childScopeAccessor = nodeAccessor + "!", + intersection2 = + getIntersection && + ((scope, op) => (intersection2 = getIntersection())(scope, op)); + return (scope, newRendererOrOp) => { + if (newRendererOrOp === DIRTY) return; + let currentRenderer = scope[rendererAccessor], + op = newRendererOrOp; + if (newRendererOrOp !== MARK && newRendererOrOp !== CLEAN) { + let normalizedRenderer = normalizeDynamicRenderer(newRendererOrOp); + isDifferentRenderer(normalizedRenderer, currentRenderer) + ? ((currentRenderer = scope[rendererAccessor] = normalizedRenderer), + (function (scope, nodeAccessor, newRenderer) { + let newScope, + prevScope = scope[nodeAccessor + "!"]; + newRenderer + ? ((newScope = scope[nodeAccessor + "!"] = + createScopeWithTagNameOrRenderer( + newRenderer, + scope.$global, + scope, + )), + (prevScope = prevScope || getEmptyScope(scope[nodeAccessor]))) + : ((newScope = getEmptyScope(scope[nodeAccessor])), + (scope[nodeAccessor + "!"] = void 0)), + insertBefore(newScope, prevScope.a.parentNode, prevScope.a), + removeAndDestroyScope(prevScope); + })(scope, nodeAccessor, normalizedRenderer), + fn && fn(scope), + (op = DIRTY)) + : (op = CLEAN); } - l?.(n, u), L(f, n[i], u); + intersection2?.(scope, op), + renderBodyClosures(currentRenderer, scope[childScopeAccessor], op); }; }; -function mt(e, t) { - let n = t + "!", - r = t + "("; - return (t, i) => { - let l = t[n]; - if (l) { - let n = t[r]; - (!n?.c || n.c.has(e)) && e(l, i); +function inConditionalScope(signal, nodeAccessor) { + let scopeAccessor = nodeAccessor + "!", + rendererAccessor = nodeAccessor + "("; + return (scope, op) => { + let conditionalScope = scope[scopeAccessor]; + if (conditionalScope) { + let conditionalRenderer = scope[rendererAccessor]; + (!conditionalRenderer?.c || conditionalRenderer.c.has(signal)) && + signal(conditionalScope, op); } }; } -var yt = function (e, t, n) { - let r = e + "(", - i = e + "!", - l = n && ((e, t) => (l = n())(e, t)); - return (n, o) => { - if (o === I) return; - let f = n[r], - u = o; - if (o !== M && o !== E) { - let i = ue(o); - _t(i, f) ? ((f = n[r] = i), kt(n, e, i), t && t(n), (u = I)) : (u = E); +var conditionalOnlyChild = function (nodeAccessor, fn, getIntersection) { + let rendererAccessor = nodeAccessor + "(", + childScopeAccessor = nodeAccessor + "!", + intersection2 = + getIntersection && + ((scope, op) => (intersection2 = getIntersection())(scope, op)); + return (scope, newRendererOrOp) => { + if (newRendererOrOp === DIRTY) return; + let currentRenderer = scope[rendererAccessor], + op = newRendererOrOp; + if (newRendererOrOp !== MARK && newRendererOrOp !== CLEAN) { + let normalizedRenderer = normalizeDynamicRenderer(newRendererOrOp); + isDifferentRenderer(normalizedRenderer, currentRenderer) + ? ((currentRenderer = scope[rendererAccessor] = normalizedRenderer), + setConditionalRendererOnlyChild( + scope, + nodeAccessor, + normalizedRenderer, + ), + fn && fn(scope), + (op = DIRTY)) + : (op = CLEAN); } - l?.(n, u), L(f, n[i], u); + intersection2?.(scope, op), + renderBodyClosures(currentRenderer, scope[childScopeAccessor], op); }; }; -function kt(e, t, n) { - let r = e[t + "!"], - i = e[t]; - if (((i.textContent = ""), n)) { - y((e[t + "!"] = st(n, e.$global, e)), i, null); +function setConditionalRendererOnlyChild(scope, nodeAccessor, newRenderer) { + let prevScope = scope[nodeAccessor + "!"], + referenceNode = scope[nodeAccessor]; + if (((referenceNode.textContent = ""), newRenderer)) { + insertBefore( + (scope[nodeAccessor + "!"] = createScopeWithTagNameOrRenderer( + newRenderer, + scope.$global, + scope, + )), + referenceNode, + null, + ); } - r && p(r); -} -var wt = new Map([[Symbol(), g(void 0)]]), - Ct = [g(void 0)], - At = new Map(), - St = []; -function Nt(e, t) { - return Mt(e, t, ([e, t = It], n) => { - o( - e, - "string" == typeof t - ? (e, r) => n(e[t], [e, r]) - : (e, r) => n(t(e, r), [e, r]), + prevScope && destroyScope(prevScope); +} +var emptyMarkerMap = new Map([[Symbol(), getEmptyScope(void 0)]]), + emptyMarkerArray = [getEmptyScope(void 0)], + emptyMap = new Map(), + emptyArray = []; +function loopOf(nodeAccessor, renderer) { + return loop(nodeAccessor, renderer, ([all, by = bySecondArg], cb) => { + forOf( + all, + "string" == typeof by + ? (item, i) => cb(item[by], [item, i]) + : (item, i) => cb(by(item, i), [item, i]), ); }); } -function xt(e, t) { - return Mt(e, t, ([e, t = Tt], n) => l(e, (e, r) => n(t(e, r), [e, r]))); -} -function $t(e, t) { - return Mt(e, t, ([e, t, n, r = Tt], i) => f(e, t, n, (e) => i(r(e), [e]))); -} -function Mt(e, t, n) { - let r = e + "!", - i = t.c, - l = t.e; - return (o, f) => { - if (f === I) return; - if (f === M || f === E) { - let t = o[r] ?? o[e + "("]?.values() ?? []; - if (t !== Ct) - for (let e of t) { - l?.(e, f); - for (let t of i) t(e, f); +function loopIn(nodeAccessor, renderer) { + return loop(nodeAccessor, renderer, ([obj, by = byFirstArg], cb) => + forIn(obj, (key, value2) => cb(by(key, value2), [key, value2])), + ); +} +function loopTo(nodeAccessor, renderer) { + return loop(nodeAccessor, renderer, ([to, from, step, by = byFirstArg], cb) => + forTo(to, from, step, (v) => cb(by(v), [v])), + ); +} +function loop(nodeAccessor, renderer, forEach) { + let loopScopeAccessor = nodeAccessor + "!", + closureSignals = renderer.c, + params = renderer.e; + return (scope, valueOrOp) => { + if (valueOrOp === DIRTY) return; + if (valueOrOp === MARK || valueOrOp === CLEAN) { + let loopScopes = + scope[loopScopeAccessor] ?? scope[nodeAccessor + "("]?.values() ?? []; + if (loopScopes !== emptyMarkerArray) + for (let childScope of loopScopes) { + params?.(childScope, valueOrOp); + for (let signal of closureSignals) signal(childScope, valueOrOp); } return; } - let u, - a, - c, - s, - d = o[e], - h = 8 === d.nodeType || 3 === d.nodeType, - v = o[e + "("] || (h ? wt : At), - b = o[e + "!"] || Array.from(v.values()), - k = !0; + let newMap, + newArray, + afterReference, + parentNode, + referenceNode = scope[nodeAccessor], + referenceIsMarker = + 8 === referenceNode.nodeType || 3 === referenceNode.nodeType, + oldMap = + scope[nodeAccessor + "("] || + (referenceIsMarker ? emptyMarkerMap : emptyMap), + oldArray = scope[nodeAccessor + "!"] || Array.from(oldMap.values()), + needsReconciliation = !0; if ( - (n(f, (e, n) => { - let r = v.get(e), - f = E; - if ((r || ((r = ct(t, o.$global, o)), (f = I)), l && l(r, n), i)) - for (let e of i) e(r, f); - u ? (u.set(e, r), a.push(r)) : ((u = new Map([[e, r]])), (a = [r])); + (forEach(valueOrOp, (key, args) => { + let childScope = oldMap.get(key), + closureOp = CLEAN; + if ( + (childScope || + ((childScope = createScopeWithRenderer( + renderer, + scope.$global, + scope, + )), + (closureOp = DIRTY)), + params && params(childScope, args), + closureSignals) + ) + for (let signal of closureSignals) signal(childScope, closureOp); + newMap + ? (newMap.set(key, childScope), newArray.push(childScope)) + : ((newMap = new Map([[key, childScope]])), + (newArray = [childScope])); }), - u || - (h - ? ((u = wt), (a = Ct), g(d)) - : (b.forEach(p), (d.textContent = ""), (u = At), (a = St), (k = !1))), - k) + newMap || + (referenceIsMarker + ? ((newMap = emptyMarkerMap), + (newArray = emptyMarkerArray), + getEmptyScope(referenceNode)) + : (oldArray.forEach(destroyScope), + (referenceNode.textContent = ""), + (newMap = emptyMap), + (newArray = emptyArray), + (needsReconciliation = !1))), + needsReconciliation) ) { - if (h) { - v === wt && g(d); - let e = b[b.length - 1]; - (c = e.b.nextSibling), (s = e.a.parentNode); - } else (c = null), (s = d); - !(function (e, t, n, r) { + if (referenceIsMarker) { + oldMap === emptyMarkerMap && getEmptyScope(referenceNode); + let oldLastChild = oldArray[oldArray.length - 1]; + (afterReference = oldLastChild.b.nextSibling), + (parentNode = oldLastChild.a.parentNode); + } else (afterReference = null), (parentNode = referenceNode); + !(function (parent, oldScopes, newScopes, afterReference) { let i, - l, - o, - f, - u, - a, - c = 0, - s = 0, - d = t.length - 1, - h = n.length - 1, - g = t[c], - p = n[s], - v = t[d], - b = n[h]; - e: { - for (; g === p; ) { - if ((++c, ++s, c > d || s > h)) break e; - (g = t[c]), (p = n[s]); + j, + k, + nextSibling, + oldScope, + newScope, + oldStart = 0, + newStart = 0, + oldEnd = oldScopes.length - 1, + newEnd = newScopes.length - 1, + oldStartScope = oldScopes[oldStart], + newStartScope = newScopes[newStart], + oldEndScope = oldScopes[oldEnd], + newEndScope = newScopes[newEnd]; + outer: { + for (; oldStartScope === newStartScope; ) { + if ( + (++oldStart, ++newStart, oldStart > oldEnd || newStart > newEnd) + ) + break outer; + (oldStartScope = oldScopes[oldStart]), + (newStartScope = newScopes[newStart]); } - for (; v === b; ) { - if ((--d, --h, c > d || s > h)) break e; - (v = t[d]), (b = n[h]); + for (; oldEndScope === newEndScope; ) { + if ((--oldEnd, --newEnd, oldStart > oldEnd || newStart > newEnd)) + break outer; + (oldEndScope = oldScopes[oldEnd]), + (newEndScope = newScopes[newEnd]); } } - if (c > d) { - if (s <= h) { - (o = h + 1), (f = o < n.length ? n[o].a : r); + if (oldStart > oldEnd) { + if (newStart <= newEnd) { + (k = newEnd + 1), + (nextSibling = + k < newScopes.length ? newScopes[k].a : afterReference); do { - y(n[s++], e, f); - } while (s <= h); + insertBefore(newScopes[newStart++], parent, nextSibling); + } while (newStart <= newEnd); } - } else if (s > h) + } else if (newStart > newEnd) do { - m(t[c++]); - } while (c <= d); + removeAndDestroyScope(oldScopes[oldStart++]); + } while (oldStart <= oldEnd); else { - let g = d - c + 1, - p = h - s + 1, - v = t, - b = new Array(p); - for (i = 0; i < p; ++i) b[i] = -1; - let k = 0, - w = 0, - C = new Map(); - for (l = s; l <= h; ++l) C.set(n[l], l); - for (i = c; i <= d && w < p; ++i) - (u = t[i]), - (l = C.get(u)), - void 0 !== l && - ((k = k > l ? ae : l), - ++w, - (a = n[l]), - (b[l - s] = i), - (v[i] = null)); - if (g === t.length && 0 === w) { - for (; s < p; ++s) y(n[s], e, r); - for (; c < g; ++c) m(t[c]); + let oldLength = oldEnd - oldStart + 1, + newLength = newEnd - newStart + 1, + aNullable = oldScopes, + sources = new Array(newLength); + for (i = 0; i < newLength; ++i) sources[i] = -1; + let pos = 0, + synced = 0, + keyIndex = new Map(); + for (j = newStart; j <= newEnd; ++j) keyIndex.set(newScopes[j], j); + for (i = oldStart; i <= oldEnd && synced < newLength; ++i) + (oldScope = oldScopes[i]), + (j = keyIndex.get(oldScope)), + void 0 !== j && + ((pos = pos > j ? 2147483647 : j), + ++synced, + (newScope = newScopes[j]), + (sources[j - newStart] = i), + (aNullable[i] = null)); + if (oldLength === oldScopes.length && 0 === synced) { + for (; newStart < newLength; ++newStart) + insertBefore(newScopes[newStart], parent, afterReference); + for (; oldStart < oldLength; ++oldStart) + removeAndDestroyScope(oldScopes[oldStart]); } else { - for (i = g - w; i > 0; ) (u = v[c++]), null !== u && (m(u), i--); - if (k === ae) { - let t = (function (e) { - let t, - n, - r = e.slice(), - i = []; - i.push(0); - for (let l = 0, o = e.length; l < o; ++l) { - if (-1 === e[l]) continue; - let o = i[i.length - 1]; - if (e[o] < e[l]) (r[l] = o), i.push(l); + for (i = oldLength - synced; i > 0; ) + (oldScope = aNullable[oldStart++]), + null !== oldScope && (removeAndDestroyScope(oldScope), i--); + if (2147483647 === pos) { + let seq = (function (a) { + let u, + v, + p = a.slice(), + result = []; + result.push(0); + for (let i = 0, il = a.length; i < il; ++i) { + if (-1 === a[i]) continue; + let j = result[result.length - 1]; + if (a[j] < a[i]) (p[i] = j), result.push(i); else { - for (t = 0, n = i.length - 1; t < n; ) { - let r = ((t + n) / 2) | 0; - e[i[r]] < e[l] ? (t = r + 1) : (n = r); + for (u = 0, v = result.length - 1; u < v; ) { + let c = ((u + v) / 2) | 0; + a[result[c]] < a[i] ? (u = c + 1) : (v = c); } - e[l] < e[i[t]] && (t > 0 && (r[l] = i[t - 1]), (i[t] = l)); + a[i] < a[result[u]] && + (u > 0 && (p[i] = result[u - 1]), (result[u] = i)); } } - for (t = i.length, n = i[t - 1]; t-- > 0; ) - (i[t] = n), (n = r[n]); - return i; - })(b); - for (l = t.length - 1, o = n.length, i = p - 1; i >= 0; --i) - -1 === b[i] || l < 0 || i !== t[l] - ? ((k = i + s), - (a = n[k++]), - (f = k < o ? n[k].a : r), - y(a, e, f)) - : --l; - } else if (w !== p) - for (o = n.length, i = p - 1; i >= 0; --i) - -1 === b[i] && - ((k = i + s), - (a = n[k++]), - (f = k < o ? n[k].a : r), - y(a, e, f)); + for (u = result.length, v = result[u - 1]; u-- > 0; ) + (result[u] = v), (v = p[v]); + return result; + })(sources); + for ( + j = seq.length - 1, k = newScopes.length, i = newLength - 1; + i >= 0; + --i + ) + -1 === sources[i] || j < 0 || i !== seq[j] + ? ((pos = i + newStart), + (newScope = newScopes[pos++]), + (nextSibling = pos < k ? newScopes[pos].a : afterReference), + insertBefore(newScope, parent, nextSibling)) + : --j; + } else if (synced !== newLength) + for (k = newScopes.length, i = newLength - 1; i >= 0; --i) + -1 === sources[i] && + ((pos = i + newStart), + (newScope = newScopes[pos++]), + (nextSibling = pos < k ? newScopes[pos].a : afterReference), + insertBefore(newScope, parent, nextSibling)); } } - })(s, b, a, c); + })(parentNode, oldArray, newArray, afterReference); } - (o[e + "("] = u), (o[e + "!"] = a); + (scope[nodeAccessor + "("] = newMap), + (scope[nodeAccessor + "!"] = newArray); }; } -function Et(e, t) { - let n = t + "!"; - return (r, i) => { - let l = r[n] ?? r[t + "("]?.values() ?? []; - if (l !== Ct) for (let t of l) e(t, i); +function inLoopScope(signal, loopNodeAccessor) { + let loopScopeAccessor = loopNodeAccessor + "!"; + return (scope, op) => { + let loopScopes = + scope[loopScopeAccessor] ?? scope[loopNodeAccessor + "("]?.values() ?? []; + if (loopScopes !== emptyMarkerArray) + for (let scope2 of loopScopes) signal(scope2, op); }; } -function It(e, t) { - return t; +function bySecondArg(_item, index) { + return index; } -function Tt(e) { - return e; +function byFirstArg(name) { + return name; } -function _t(e, t) { - return e !== t && (e?.t || 0) !== t?.t; +function isDifferentRenderer(a, b) { + return a !== b && (a?.t || 0) !== b?.t; } -var Ot = new Map(), - Bt = { - patchConditionals: function (e) { - (bt = e(bt)), (yt = e(yt)); +var classIdToScope = new Map(), + compat = { + patchConditionals: function (fn) { + (conditional = fn(conditional)), + (conditionalOnlyChild = fn(conditionalOnlyChild)); }, - queueEffect: K, + queueEffect: queueEffect, init() { - A("$C_s", (e) => { - Ot.set(e.m5c, e); + register("$C_s", (scope) => { + classIdToScope.set(scope.m5c, scope); }); }, - registerRenderer(e) { - A("$C_r", e); + registerRenderer(fn) { + register("$C_r", fn); }, - isOp: (e) => e === M || e === E || e === I, - isRenderer: (e) => void 0 !== e.k, - getStartNode: (e) => e.a, - setScopeNodes(e, t, n) { - (e.a = t), (e.b = n); + isOp: (value2) => value2 === MARK || value2 === CLEAN || value2 === DIRTY, + isRenderer: (renderer) => void 0 !== renderer.k, + getStartNode: (scope) => scope.a, + setScopeNodes(scope, startNode, endNode) { + (scope.a = startNode), (scope.b = endNode); }, runComponentEffects() { - ee(this.effects); + runEffects(this.effects); }, - resolveRegistered: (e, { runtimeId: t, componentIdPrefix: n }) => - Array.isArray(e) && "string" == typeof e[0] - ? (function (e, t) { - let n = k[e]; - return t ? n(t) : n; - })(e[0], 2 === e.length && window[t]?.["s" === n ? "_" : n]?.n[e[1]]) - : e, - createRenderer(e, t, n) { - let r = pt("", void 0, e, void 0, n && (() => n)); - return (r.k = t), r; + resolveRegistered: ( + value2, + { runtimeId: runtimeId, componentIdPrefix: componentIdPrefix }, + ) => + Array.isArray(value2) && "string" == typeof value2[0] + ? (function (id, scope) { + let val = registeredValues[id]; + return scope ? val(scope) : val; + })( + value2[0], + 2 === value2.length && + window[runtimeId]?.[ + "s" === componentIdPrefix ? "_" : componentIdPrefix + ]?.n[value2[1]], + ) + : value2, + createRenderer(setup, clone, args) { + let renderer = createRenderer( + "", + void 0, + setup, + void 0, + args && (() => args), + ); + return (renderer.k = clone), renderer; }, - render(e, t, n, r) { - let i = t.scope; - i || ((i = Ot.get(t.id)), i && ((t.scope = i), Ot.delete(t.id))); - let l = n.e || Vt, - o = !1; + render(out, component, renderer, input) { + let scope = component.scope; + scope || + ((scope = classIdToScope.get(component.id)), + scope && + ((component.scope = scope), classIdToScope.delete(component.id))); + let args = renderer.e || noop, + existing = !1; if ( - ((t.effects = Y(() => { - if (i) l(i, M), (o = !0); + ((component.effects = prepareEffects(() => { + if (scope) args(scope, MARK), (existing = !0); else { - i = t.scope = ct(n, e.global); - let r = n.c; - if (r) for (let e of r) e(t.scope, E); + scope = component.scope = createScopeWithRenderer( + renderer, + out.global, + ); + let closures = renderer.c; + if (closures) + for (let signal of closures) signal(component.scope, CLEAN); } - l(i, r); + args(scope, input); })), - !o) + !existing) ) - return i.a === i.b ? i.a : i.a.parentNode; + return scope.a === scope.b ? scope.a : scope.a.parentNode; }, }; -function Vt() {} -var jt = (e, ...t) => { - let n = pt(...t); - return (n.mount = Rt), (n._ = n), A(e, n); +function noop() {} +var createTemplate = (templateId, ...rendererArgs) => { + let renderer = createRenderer(...rendererArgs); + return ( + (renderer.mount = mount), + (renderer._ = renderer), + register(templateId, renderer) + ); }; -function Rt(e = {}, t, n) { - let r, - i, - { $global: l } = e; - l - ? (({ $global: l, ...e } = e), - (l = { runtimeId: "M", renderId: "_", ...l })) - : (l = { runtimeId: "M", renderId: "_" }); - let o = this.e, - f = Y(() => { - (r = d(l)), (i = dt(this, r)), o && o(r, [e]); +function mount(input = {}, reference, position) { + let scope, + dom, + { $global: $global } = input; + $global + ? (({ $global: $global, ...input } = input), + ($global = { runtimeId: "M", renderId: "_", ...$global })) + : ($global = { runtimeId: "M", renderId: "_" }); + let args = this.e, + effects = prepareEffects(() => { + (scope = createScope($global)), + (dom = initRenderer(this, scope)), + args && args(scope, [input]); }); - switch (n) { + switch (position) { case "afterbegin": - t.insertBefore(i, t.firstChild); + reference.insertBefore(dom, reference.firstChild); break; case "afterend": - t.parentElement.insertBefore(i, t.nextSibling); + reference.parentElement.insertBefore(dom, reference.nextSibling); break; case "beforebegin": - t.parentElement.insertBefore(i, t); + reference.parentElement.insertBefore(dom, reference); break; default: - t.appendChild(i); + reference.appendChild(dom); } return ( - ee(f), + runEffects(effects), { - update: (e) => { - o && - ee( - Y(() => { - o(r, M), o(r, [e]); + update: (newInput) => { + args && + runEffects( + prepareEffects(() => { + args(scope, MARK), args(scope, [newInput]); }), ); }, destroy: () => { - m(r); + removeAndDestroyScope(scope); }, } ); } -export { - Ge as attr, - n as attrTag, - r as attrTags, - Ke as attrs, - tt as attrsEvents, - q as childClosures, - Xe as classAttr, - j as closure, - Bt as compat, - bt as conditional, - yt as conditionalOnlyChild, - Ne as controllable_detailsOrDialog_open, - xe as controllable_detailsOrDialog_open_effect, - ve as controllable_input_checked, - me as controllable_input_checkedValue, - ye as controllable_input_checkedValue_effect, - be as controllable_input_checked_effect, - ke as controllable_input_value, - we as controllable_input_value_effect, - Ce as controllable_select_value, - Ae as controllable_select_value_effect, - ke as controllable_textarea_value, - we as controllable_textarea_value_effect, - pt as createRenderer, - gt as createRendererWithOwner, - d as createScope, - jt as createTemplate, - He as data, - R as dynamicClosure, - D as dynamicSubscribers, - ht as dynamicTagAttrs, - J as effect, - l as forIn, - o as forOf, - f as forTo, - re as getAbortSignal, - nt as html, - U as inChild, - mt as inConditionalScope, - Et as inLoopScope, - N as init, - B as intersection, - G as intersections, - lt as lifecycle, - xt as loopIn, - Nt as loopOf, - $t as loopTo, - F as nextTagId, - $ as nodeRef, - de as on, - Ye as partialAttrs, - rt as props, - A as register, - S as registerBoundSignal, - x as registerSubscriber, - ne as resetAbortSignal, - Q as run, - P as setTagVar, - T as state, - Ze as styleAttr, - W as tagVarSignal, - _ as value, -}; diff --git a/.sizes/name-cache.json b/.sizes/name-cache.json new file mode 100644 index 0000000000..8f6125ba56 --- /dev/null +++ b/.sizes/name-cache.json @@ -0,0 +1 @@ +{"vars":{"props":{"$empty":"e","$rest":"t","$attrTag":"n","$attrTags":"r","$attrTagIterator":"i","$forIn":"l","$forOf":"o","$forTo":"f","$isScheduled":"u","$port2":"a","$flushAndWaitFrame":"c","$triggerMacroTask":"s","$noop":"d","$createScope":"h","$emptyScope":"g","$getEmptyScope":"p","$destroyScope":"v","$_destroyScope":"b","$onDestroy":"m","$removeAndDestroyScope":"k","$insertBefore":"y","$registeredValues":"w","$Render":"C","$isResuming":"A","$register":"S","$registerBoundSignal":"N","$init":"x","$registerSubscriber":"$","$nodeRef":"M","$MARK":"E","$CLEAN":"I","$DIRTY":"T","$state":"_","$value":"O","$accessorId":"B","$intersection":"V","$defaultGetOwnerScope":"j","$closure":"R","$dynamicClosure":"q","$childClosures":"D","$dynamicSubscribers":"P","$setTagVar":"W","$tagVarSignal":"L","$renderBodyClosures":"z","$tagIdsByGlobal":"F","$nextTagId":"U","$inChild":"G","$intersections":"J","$effect":"X","$pendingSignals":"Z","$pendingEffects":"H","$rendering":"K","$queueEffect":"Q","$run":"Y","$prepareEffects":"ee","$runEffects":"te","$runSignals":"ne","$resetAbortSignal":"re","$getAbortSignal":"ie","$stringifyClassObject":"le","$NON_DIMENSIONAL":"oe","$stringifyStyleObject":"fe","$toDelimitedString":"ue","$normalizeDynamicRenderer":"ae","$elementHandlersByEvent":"ce","$defaultDelegator":"se","$on":"de","$createDelegator":"he","$handleDelegated":"ge","$stripSpacesAndPunctuation":"pe","$controllable_input_checked":"ve","$controllable_input_checked_effect":"be","$controllable_input_checkedValue":"me","$controllable_input_checkedValue_effect":"ke","$controllable_input_value":"ye","$controllable_input_value_effect":"we","$controllable_select_value":"Ce","$controllable_select_value_effect":"Ae","$setSelectOptions":"Se","$controllable_detailsOrDialog_open":"Ne","$controllable_detailsOrDialog_open_effect":"xe","$inputType":"$e","$setValueAndUpdateSelection":"Me","$setCheckboxValue":"Ee","$delegateFormControl":"Ie","$formChangeHandlers":"Te","$syncControllable":"_e","$onFormChange":"Oe","$onFormReset":"Be","$hasValueChanged":"Ve","$hasCheckboxChanged":"je","$hasSelectChanged":"Re","$hasFormElementChanged":"qe","$normalizeStrProp":"De","$normalizeBoolProp":"Pe","$toValueProp":"We","$fallback":"Le","$parser":"ze","$parseHTML":"Fe","$eventHandlerReg":"Ue","$attr":"Ge","$setAttribute":"Je","$classAttr":"Xe","$styleAttr":"Ze","$data":"He","$attrs":"Ke","$hasAttrAlias":"Qe","$partialAttrs":"Ye","$attrsInternal":"et","$attrsEvents":"tt","$html":"nt","$props":"rt","$normalizeAttrValue":"it","$lifecycle":"lt","$walker":"ot","$trimWalkString":"ft","$walk":"ut","$walkInternal":"at","$createScopeWithRenderer":"ct","$createScopeWithTagNameOrRenderer":"st","$initRenderer":"dt","$dynamicTagAttrs":"ht","$createRendererWithOwner":"gt","$createRenderer":"pt","$_clone":"vt","$conditional":"bt","$inConditionalScope":"mt","$conditionalOnlyChild":"kt","$setConditionalRendererOnlyChild":"yt","$emptyMarkerMap":"wt","$emptyMarkerArray":"Ct","$emptyMap":"At","$emptyArray":"St","$loopOf":"Nt","$loopIn":"xt","$loopTo":"$t","$loop":"Mt","$inLoopScope":"Et","$bySecondArg":"It","$byFirstArg":"Tt","$isDifferentRenderer":"_t","$classIdToScope":"Ot","$compat":"Bt","$createTemplate":"Vt","$mount":"jt","$parseHTMLOrSingleNode":"Wt","$marker":"qt","$_clickCount_effect":"Dt","$_clickCount":"Xt","$_setup_":"Zt","$_expr_comment_id$ifBody":"ss","$_id$ifBody":"as","$_comment$ifBody":"ns","$_ifBody":"ts","$_expr_input_i$forBody":"os","$_if$forBody":"cs","$_open$forBody_effect":"is","$_open$forBody":"ms","$_id$forBody":"ls","$_i$forBody":"us","$_comment$forBody":"es","$_params_2$forBody":"ds","$_input$forBody":"rs","$_for":"bs","$_input_$1":"fs","$_input_":"ps","$_params__":"vs"}}} \ No newline at end of file diff --git a/packages/runtime-tags/tsconfig.json b/packages/runtime-tags/tsconfig.json index caead593ac..775e6ff47a 100644 --- a/packages/runtime-tags/tsconfig.json +++ b/packages/runtime-tags/tsconfig.json @@ -1,6 +1,7 @@ { "extends": "../../tsconfig.json", "include": ["src"], + "exclude": ["**/__snapshots__"], "compilerOptions": { "outDir": "dist", "rootDir": "src", diff --git a/packages/translator-tags/src/__tests__/fixtures/assignment-before-tag-var/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/assignment-before-tag-var/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..89ec21043d --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/assignment-before-tag-var/__snapshots__/.name-cache.json @@ -0,0 +1,11 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "a", + "$_lastClickCount": "o", + "$_clickCount_effect": "m", + "$_clickCount": "r" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/assignment-before-tag-var/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/assignment-before-tag-var/__snapshots__/dom.expected/template.hydrate.js index c2e884ccbf..5d431ab9da 100644 --- a/packages/translator-tags/src/__tests__/fixtures/assignment-before-tag-var/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/assignment-before-tag-var/__snapshots__/dom.expected/template.hydrate.js @@ -1,21 +1,21 @@ -// size: 279 (min) 167 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as a } from "@marko/runtime-tags/dom"; -const o = t.state(4, (a, o) => t.data(a[2], o)), - m = t.effect("a0", (a) => - t.on( - a[0], +// size: 190 (min) 126 (brotli) +const _lastClickCount = _$.state(4, (_scope, lastClickCount) => + _$.data(_scope[2], lastClickCount), + ), + _clickCount_effect = _$.effect("a0", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { - const { 3: a } = t; + ((_scope) => { + const { 3: clickCount } = _scope; return function () { - o(t, a), r(t, a + 1); + _lastClickCount(_scope, clickCount), + _clickCount(_scope, clickCount + 1); }; - })(a), + })(_scope), ), ), - r = t.state(3, (a, o) => { - t.data(a[1], o), m(a); + _clickCount = _$.state(3, (_scope, clickCount) => { + _$.data(_scope[1], clickCount), _clickCount_effect(_scope); }); -a(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/at-tag-inside-if-tag/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/at-tag-inside-if-tag/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..88d014a716 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/at-tag-inside-if-tag/__snapshots__/.name-cache.json @@ -0,0 +1,7 @@ +{ + "vars": { + "props": { + "$_$": "e" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/at-tag-inside-if-tag/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/at-tag-inside-if-tag/__snapshots__/dom.expected/template.hydrate.js index 31c6135385..ea3396488f 100644 --- a/packages/translator-tags/src/__tests__/fixtures/at-tag-inside-if-tag/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/at-tag-inside-if-tag/__snapshots__/dom.expected/template.hydrate.js @@ -1,6 +1,4 @@ -// size: 175 (min) 107 (brotli) - -import * as e from "@marko/runtime-tags/dom"; -e.dynamicTagAttrs(0), - e.register("b0", e.createRendererWithOwner("Goodbye", "")), - e.register("b1", e.createRendererWithOwner("Hello", "")); +// size: 133 (min) 82 (brotli) +_$.dynamicTagAttrs(0), + _$.register("b0", _$.createRendererWithOwner("Goodbye", "")), + _$.register("b1", _$.createRendererWithOwner("Hello", "")); diff --git a/packages/translator-tags/src/__tests__/fixtures/at-tags/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/at-tags/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..558dc826a8 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/at-tags/__snapshots__/.name-cache.json @@ -0,0 +1,7 @@ +{ + "vars": { + "props": { + "$_$": "r" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/at-tags/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/at-tags/__snapshots__/dom.expected/template.hydrate.js index 2b99526bdf..d2d8cdfa94 100644 --- a/packages/translator-tags/src/__tests__/fixtures/at-tags/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/at-tags/__snapshots__/dom.expected/template.hydrate.js @@ -1,4 +1,3 @@ -// size: 117 (min) 98 (brotli) - -import * as r from "@marko/runtime-tags/dom"; -r.dynamicTagAttrs(0), r.register("b0", r.createRendererWithOwner("Foo!", "")); +// size: 75 (min) 70 (brotli) +_$.dynamicTagAttrs(0), + _$.register("b0", _$.createRendererWithOwner("Foo!", "")); diff --git a/packages/translator-tags/src/__tests__/fixtures/attr-boolean-dynamic/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/attr-boolean-dynamic/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..33a34f6a4c --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/attr-boolean-dynamic/__snapshots__/.name-cache.json @@ -0,0 +1,10 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "a", + "$_disabled_effect": "o", + "$_disabled": "r" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/attr-boolean-dynamic/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/attr-boolean-dynamic/__snapshots__/dom.expected/template.hydrate.js index 0cfee7ddc5..3ce0f417f4 100644 --- a/packages/translator-tags/src/__tests__/fixtures/attr-boolean-dynamic/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/attr-boolean-dynamic/__snapshots__/dom.expected/template.hydrate.js @@ -1,20 +1,19 @@ -// size: 279 (min) 175 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as a } from "@marko/runtime-tags/dom"; -const o = t.effect("a0", (a) => - t.on( - a[1], +// size: 190 (min) 135 (brotli) +const _disabled_effect = _$.effect("a0", (_scope) => + _$.on( + _scope[1], "click", - ((t) => { - const { 3: a } = t; + ((_scope) => { + const { 3: disabled } = _scope; return function () { - r(t, !a); + _disabled(_scope, !disabled); }; - })(a), + })(_scope), ), ), - r = t.state(3, (a, r) => { - t.attr(a[0], "disabled", r), t.data(a[2], r ? "enable" : "disable"), o(a); + _disabled = _$.state(3, (_scope, disabled) => { + _$.attr(_scope[0], "disabled", disabled), + _$.data(_scope[2], disabled ? "enable" : "disable"), + _disabled_effect(_scope); }); -a(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/attr-boolean/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/attr-boolean/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..db413faf9a --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/attr-boolean/__snapshots__/.name-cache.json @@ -0,0 +1,5 @@ +{ + "vars": { + "props": {} + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/attr-escape/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/attr-escape/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..db413faf9a --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/attr-escape/__snapshots__/.name-cache.json @@ -0,0 +1,5 @@ +{ + "vars": { + "props": {} + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/attr-falsey/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/attr-falsey/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..db413faf9a --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/attr-falsey/__snapshots__/.name-cache.json @@ -0,0 +1,5 @@ +{ + "vars": { + "props": {} + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/attr-template-literal-escape/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/attr-template-literal-escape/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..db413faf9a --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/attr-template-literal-escape/__snapshots__/.name-cache.json @@ -0,0 +1,5 @@ +{ + "vars": { + "props": {} + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-chain/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/basic-chain/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..db413faf9a --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/basic-chain/__snapshots__/.name-cache.json @@ -0,0 +1,5 @@ +{ + "vars": { + "props": {} + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-component-attrs/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/basic-component-attrs/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..d55082c38c --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/basic-component-attrs/__snapshots__/.name-cache.json @@ -0,0 +1,13 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "o", + "$_text_": "i", + "$_onClick__effect": "n", + "$_onClick_": "r", + "$_onClick": "e", + "$_clickCount": "a" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-component-attrs/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/basic-component-attrs/__snapshots__/dom.expected/template.hydrate.js index 8cd73a294e..c774cfa0bc 100644 --- a/packages/translator-tags/src/__tests__/fixtures/basic-component-attrs/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/basic-component-attrs/__snapshots__/dom.expected/template.hydrate.js @@ -1,24 +1,21 @@ -// size: 390 (min) 219 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as o } from "@marko/runtime-tags/dom"; -const i = t.value(5, (o, i) => t.data(o[1], i)), - n = t.effect("a0", (o) => { - const { 4: i } = o; - t.on(o[0], "click", i); +// size: 301 (min) 178 (brotli) +const _text_ = _$.value(5, (_scope, text) => _$.data(_scope[1], text)), + _onClick__effect = _$.effect("a0", (_scope) => { + const { 4: onClick } = _scope; + _$.on(_scope[0], "click", onClick); }), - r = t.value(4, (t, o) => n(t)), - e = t.register("b0", (t) => { - const { 1: o } = t; + _onClick_ = _$.value(4, (_scope, onClick) => _onClick__effect(_scope)), + _onClick = _$.register("b0", (_scope) => { + const { 1: clickCount } = _scope; return function () { - a(t, o + 1); + _clickCount(_scope, clickCount + 1); }; }), - a = t.state( + _clickCount = _$.state( 1, - (t, o) => { - i(t[0], o), r(t[0], e(t)); + (_scope, clickCount) => { + _text_(_scope[0], clickCount), _onClick_(_scope[0], _onClick(_scope)); }, - () => t.intersections([t.inChild(0, i), t.inChild(0, r)]), + () => _$.intersections([_$.inChild(0, _text_), _$.inChild(0, _onClick_)]), ); -o(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-component-input-alias/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/basic-component-input-alias/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..5fbc3727aa --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/basic-component-input-alias/__snapshots__/.name-cache.json @@ -0,0 +1,13 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "o", + "$_onClick__effect": "i", + "$_onClick_": "n", + "$_text_": "r", + "$_onClick": "e", + "$_clickCount": "a" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-component-input-alias/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/basic-component-input-alias/__snapshots__/dom.expected/template.hydrate.js index b1eb5fa308..42c7645c37 100644 --- a/packages/translator-tags/src/__tests__/fixtures/basic-component-input-alias/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/basic-component-input-alias/__snapshots__/dom.expected/template.hydrate.js @@ -1,24 +1,21 @@ -// size: 390 (min) 220 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as o } from "@marko/runtime-tags/dom"; -const i = t.effect("a0", (o) => { - const { 5: i } = o; - t.on(o[0], "click", i); +// size: 301 (min) 183 (brotli) +const _onClick__effect = _$.effect("a0", (_scope) => { + const { 5: onClick } = _scope; + _$.on(_scope[0], "click", onClick); }), - n = t.value(5, (t, o) => i(t)), - r = t.value(4, (o, i) => t.data(o[1], i)), - e = t.register("b0", (t) => { - const { 1: o } = t; + _onClick_ = _$.value(5, (_scope, onClick) => _onClick__effect(_scope)), + _text_ = _$.value(4, (_scope, text) => _$.data(_scope[1], text)), + _onClick = _$.register("b0", (_scope) => { + const { 1: clickCount } = _scope; return function () { - a(t, o + 1); + _clickCount(_scope, clickCount + 1); }; }), - a = t.state( + _clickCount = _$.state( 1, - (t, o) => { - r(t[0], o), n(t[0], e(t)); + (_scope, clickCount) => { + _text_(_scope[0], clickCount), _onClick_(_scope[0], _onClick(_scope)); }, - () => t.intersections([t.inChild(0, r), t.inChild(0, n)]), + () => _$.intersections([_$.inChild(0, _text_), _$.inChild(0, _onClick_)]), ); -o(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-component-input-same-source-alias-within-pattern/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/basic-component-input-same-source-alias-within-pattern/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..994ee29363 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/basic-component-input-same-source-alias-within-pattern/__snapshots__/.name-cache.json @@ -0,0 +1,15 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "i", + "$_text_": "n", + "$_pattern__": "e", + "$_onClick__effect": "r", + "$_onClick_": "o", + "$_onClick": "a", + "$_onClick2": "s", + "$_clickCount": "c" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-component-input-same-source-alias-within-pattern/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/basic-component-input-same-source-alias-within-pattern/__snapshots__/dom.expected/template.hydrate.js index 8faff8d413..9ce93af41c 100644 --- a/packages/translator-tags/src/__tests__/fixtures/basic-component-input-same-source-alias-within-pattern/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/basic-component-input-same-source-alias-within-pattern/__snapshots__/dom.expected/template.hydrate.js @@ -1,42 +1,44 @@ -// size: 584 (min) 265 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as i } from "@marko/runtime-tags/dom"; -const n = t.value(7, (i, n) => { - t.data(i[1], n), - ((i, n) => { - t.data(i[2], n); - })(i, n); +// size: 495 (min) 228 (brotli) +const _text_ = _$.value(7, (_scope, text) => { + _$.data(_scope[1], text), + ((_scope, textAlias) => { + _$.data(_scope[2], textAlias); + })(_scope, text); }), - e = t.value(6, (t, i) => n(t, i.text)), - r = t.effect("a0", (i) => { - const { 5: n } = i; - t.on(i[0], "click", n); + _pattern__ = _$.value(6, (_scope, _pattern_) => + _text_(_scope, _pattern_.text), + ), + _onClick__effect = _$.effect("a0", (_scope) => { + const { 5: onClick } = _scope; + _$.on(_scope[0], "click", onClick); }), - o = t.value(5, (t, i) => r(t)), - a = t.register("b0", (t) => { - const { 2: i } = t; + _onClick_ = _$.value(5, (_scope, onClick) => _onClick__effect(_scope)), + _onClick = _$.register("b0", (_scope) => { + const { 2: clickCount } = _scope; return function () { - c(t, i + 1); + _clickCount(_scope, clickCount + 1); }; }), - s = t.register("b1", (t) => { - const { 2: i } = t; + _onClick2 = _$.register("b1", (_scope) => { + const { 2: clickCount } = _scope; return function () { - c(t, i + 1); + _clickCount(_scope, clickCount + 1); }; }), - c = t.state( + _clickCount = _$.state( 2, - (t, i) => { - e(t[0], { text: i }), o(t[0], a(t)), n(t[1], i), o(t[1], s(t)); + (_scope, clickCount) => { + _pattern__(_scope[0], { text: clickCount }), + _onClick_(_scope[0], _onClick(_scope)), + _text_(_scope[1], clickCount), + _onClick_(_scope[1], _onClick2(_scope)); }, () => - t.intersections([ - t.inChild(0, e), - t.inChild(0, o), - t.inChild(1, n), - t.inChild(1, o), + _$.intersections([ + _$.inChild(0, _pattern__), + _$.inChild(0, _onClick_), + _$.inChild(1, _text_), + _$.inChild(1, _onClick_), ]), ); -i(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-component-input-same-source-alias/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/basic-component-input-same-source-alias/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..34898b1c0f --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/basic-component-input-same-source-alias/__snapshots__/.name-cache.json @@ -0,0 +1,13 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "o", + "$_text_": "a", + "$_onClick__effect": "i", + "$_onClick_": "n", + "$_onClick": "r", + "$_clickCount": "e" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-component-input-same-source-alias/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/basic-component-input-same-source-alias/__snapshots__/dom.expected/template.hydrate.js index 9d77b8856c..26be9cc8d7 100644 --- a/packages/translator-tags/src/__tests__/fixtures/basic-component-input-same-source-alias/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/basic-component-input-same-source-alias/__snapshots__/dom.expected/template.hydrate.js @@ -1,29 +1,26 @@ -// size: 423 (min) 225 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as o } from "@marko/runtime-tags/dom"; -const a = t.value(6, (o, a) => { - t.data(o[1], a), - ((o, a) => { - t.data(o[2], a); - })(o, a); +// size: 334 (min) 189 (brotli) +const _text_ = _$.value(6, (_scope, text) => { + _$.data(_scope[1], text), + ((_scope, textAlias) => { + _$.data(_scope[2], textAlias); + })(_scope, text); }), - i = t.effect("a0", (o) => { - const { 5: a } = o; - t.on(o[0], "click", a); + _onClick__effect = _$.effect("a0", (_scope) => { + const { 5: onClick } = _scope; + _$.on(_scope[0], "click", onClick); }), - n = t.value(5, (t, o) => i(t)), - r = t.register("b0", (t) => { - const { 1: o } = t; + _onClick_ = _$.value(5, (_scope, onClick) => _onClick__effect(_scope)), + _onClick = _$.register("b0", (_scope) => { + const { 1: clickCount } = _scope; return function () { - e(t, o + 1); + _clickCount(_scope, clickCount + 1); }; }), - e = t.state( + _clickCount = _$.state( 1, - (t, o) => { - a(t[0], o), n(t[0], r(t)); + (_scope, clickCount) => { + _text_(_scope[0], clickCount), _onClick_(_scope[0], _onClick(_scope)); }, - () => t.intersections([t.inChild(0, a), t.inChild(0, n)]), + () => _$.intersections([_$.inChild(0, _text_), _$.inChild(0, _onClick_)]), ); -o(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-component-input/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/basic-component-input/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..d55082c38c --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/basic-component-input/__snapshots__/.name-cache.json @@ -0,0 +1,13 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "o", + "$_text_": "i", + "$_onClick__effect": "n", + "$_onClick_": "r", + "$_onClick": "e", + "$_clickCount": "a" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-component-input/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/basic-component-input/__snapshots__/dom.expected/template.hydrate.js index 8cd73a294e..c774cfa0bc 100644 --- a/packages/translator-tags/src/__tests__/fixtures/basic-component-input/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/basic-component-input/__snapshots__/dom.expected/template.hydrate.js @@ -1,24 +1,21 @@ -// size: 390 (min) 219 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as o } from "@marko/runtime-tags/dom"; -const i = t.value(5, (o, i) => t.data(o[1], i)), - n = t.effect("a0", (o) => { - const { 4: i } = o; - t.on(o[0], "click", i); +// size: 301 (min) 178 (brotli) +const _text_ = _$.value(5, (_scope, text) => _$.data(_scope[1], text)), + _onClick__effect = _$.effect("a0", (_scope) => { + const { 4: onClick } = _scope; + _$.on(_scope[0], "click", onClick); }), - r = t.value(4, (t, o) => n(t)), - e = t.register("b0", (t) => { - const { 1: o } = t; + _onClick_ = _$.value(4, (_scope, onClick) => _onClick__effect(_scope)), + _onClick = _$.register("b0", (_scope) => { + const { 1: clickCount } = _scope; return function () { - a(t, o + 1); + _clickCount(_scope, clickCount + 1); }; }), - a = t.state( + _clickCount = _$.state( 1, - (t, o) => { - i(t[0], o), r(t[0], e(t)); + (_scope, clickCount) => { + _text_(_scope[0], clickCount), _onClick_(_scope[0], _onClick(_scope)); }, - () => t.intersections([t.inChild(0, i), t.inChild(0, r)]), + () => _$.intersections([_$.inChild(0, _text_), _$.inChild(0, _onClick_)]), ); -o(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-component-renderBody/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/basic-component-renderBody/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..41e164efcf --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/basic-component-renderBody/__snapshots__/.name-cache.json @@ -0,0 +1,13 @@ +{ + "vars": { + "props": { + "$_$": "r", + "$init": "t", + "$_onClick__effect": "e", + "$_onClick_": "i", + "$_onClick": "n", + "$_clickCount$myButtonBody": "s", + "$_clickCount": "o" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-component-renderBody/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/basic-component-renderBody/__snapshots__/dom.expected/template.hydrate.js index 3d63977627..341bc818bd 100644 --- a/packages/translator-tags/src/__tests__/fixtures/basic-component-renderBody/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/basic-component-renderBody/__snapshots__/dom.expected/template.hydrate.js @@ -1,30 +1,31 @@ -// size: 519 (min) 281 (brotli) - -import * as r from "@marko/runtime-tags/dom"; -import { init as t } from "@marko/runtime-tags/dom"; -r.dynamicTagAttrs(1); -const e = r.effect("a0", (t) => { - const { 4: e } = t; - r.on(t[0], "click", e); +// size: 430 (min) 241 (brotli) +_$.dynamicTagAttrs(1); +const _onClick__effect = _$.effect("a0", (_scope) => { + const { 4: onClick } = _scope; + _$.on(_scope[0], "click", onClick); }), - i = r.value(4, (r, t) => e(r)), - n = r.register("b0", (r) => { - const { 1: t } = r; + _onClick_ = _$.value(4, (_scope, onClick) => _onClick__effect(_scope)), + _onClick = _$.register("b0", (_scope) => { + const { 1: clickCount } = _scope; return function () { - o(r, t + 1); + _clickCount(_scope, clickCount + 1); }; }), - s = r.registerSubscriber( + _clickCount$myButtonBody = _$.registerSubscriber( "b1", - r.dynamicClosure(1, (t, e) => r.data(t[0], e)), + _$.dynamicClosure(1, (_scope, clickCount) => + _$.data(_scope[0], clickCount), + ), ); -r.register( +_$.register( "b2", - r.createRendererWithOwner(" ", " ", void 0, () => [s]), + _$.createRendererWithOwner(" ", " ", void 0, () => [ + _clickCount$myButtonBody, + ]), ); -const o = r.state( +const _clickCount = _$.state( 1, - (r, t) => i(r[0], n(r)), - () => r.intersections([r.inChild(0, i), r.dynamicSubscribers(1)]), + (_scope, clickCount) => _onClick_(_scope[0], _onClick(_scope)), + () => _$.intersections([_$.inChild(0, _onClick_), _$.dynamicSubscribers(1)]), ); -t(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-component/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/basic-component/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..c83864a1ac --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/basic-component/__snapshots__/.name-cache.json @@ -0,0 +1,10 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "o", + "$_clickCount_effect": "m", + "$_clickCount": "r" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-component/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/basic-component/__snapshots__/dom.expected/template.hydrate.js index 52c647ca19..504ff27457 100644 --- a/packages/translator-tags/src/__tests__/fixtures/basic-component/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/basic-component/__snapshots__/dom.expected/template.hydrate.js @@ -1,20 +1,17 @@ -// size: 235 (min) 173 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as o } from "@marko/runtime-tags/dom"; -const m = t.effect("a0", (o) => - t.on( - o[0], +// size: 146 (min) 127 (brotli) +const _clickCount_effect = _$.effect("a0", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { - const { 2: o } = t; + ((_scope) => { + const { 2: clickCount } = _scope; return function () { - r(t, o + 1); + _clickCount(_scope, clickCount + 1); }; - })(o), + })(_scope), ), ), - r = t.state(2, (o, r) => { - t.data(o[1], r), m(o); + _clickCount = _$.state(2, (_scope, clickCount) => { + _$.data(_scope[1], clickCount), _clickCount_effect(_scope); }); -o(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-conditional-counter-multiple-nodes/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/basic-conditional-counter-multiple-nodes/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..c91238ff1b --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/basic-conditional-counter-multiple-nodes/__snapshots__/.name-cache.json @@ -0,0 +1,15 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "o", + "$_count$ifBody": "n", + "$_ifBody": "e", + "$_if": "r", + "$_count_effect": "c", + "$_count": "i", + "$_show_effect": "a", + "$_show": "s" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-conditional-counter-multiple-nodes/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/basic-conditional-counter-multiple-nodes/__snapshots__/dom.expected/template.hydrate.js index 938591d52a..6eaae00aec 100644 --- a/packages/translator-tags/src/__tests__/fixtures/basic-conditional-counter-multiple-nodes/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/basic-conditional-counter-multiple-nodes/__snapshots__/dom.expected/template.hydrate.js @@ -1,47 +1,46 @@ -// size: 530 (min) 263 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as o } from "@marko/runtime-tags/dom"; -const n = t.closure(4, (o, n) => t.data(o[0], n)), - e = t.register( +// size: 441 (min) 228 (brotli) +const _count$ifBody = _$.closure(4, (_scope, count) => + _$.data(_scope[0], count), + ), + _ifBody = _$.register( "a0", - t.createRenderer("The count is ", "b%", void 0, () => [n]), + _$.createRenderer("The count is ", "b%", void 0, () => [_count$ifBody]), ), - r = t.conditional(2, 0), - c = t.effect("a1", (o) => - t.on( - o[0], + _if = _$.conditional(2, 0), + _count_effect = _$.effect("a1", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { - const { 4: o } = t; + ((_scope) => { + const { 4: count } = _scope; return function () { - i(t, o + 1); + _count(_scope, count + 1); }; - })(o), + })(_scope), ), ), - i = t.state( + _count = _$.state( 4, - (t, o) => c(t), - () => t.inConditionalScope(n, 2), + (_scope, count) => _count_effect(_scope), + () => _$.inConditionalScope(_count$ifBody, 2), ), - a = t.effect("a2", (o) => - t.on( - o[1], + _show_effect = _$.effect("a2", (_scope) => + _$.on( + _scope[1], "click", - ((t) => { - const { 3: o } = t; + ((_scope) => { + const { 3: show } = _scope; return function () { - s(t, !o); + _show(_scope, !show); }; - })(o), + })(_scope), ), ), - s = t.state( + _show = _$.state( 3, - (t, o) => { - a(t), r(t, o ? e : null); + (_scope, show) => { + _show_effect(_scope), _if(_scope, show ? _ifBody : null); }, - () => r, + () => _if, ); -o(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-conditional-counter/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/basic-conditional-counter/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..22dc80039a --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/basic-conditional-counter/__snapshots__/.name-cache.json @@ -0,0 +1,15 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "n", + "$_count$ifBody": "o", + "$_ifBody": "e", + "$_if": "r", + "$_count_effect": "a", + "$_count": "c", + "$_show_effect": "i", + "$_show": "s" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-conditional-counter/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/basic-conditional-counter/__snapshots__/dom.expected/template.hydrate.js index c8883fd484..927f93ef9e 100644 --- a/packages/translator-tags/src/__tests__/fixtures/basic-conditional-counter/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/basic-conditional-counter/__snapshots__/dom.expected/template.hydrate.js @@ -1,47 +1,46 @@ -// size: 528 (min) 262 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as n } from "@marko/runtime-tags/dom"; -const o = t.closure(4, (n, o) => t.data(n[0], o)), - e = t.register( +// size: 439 (min) 224 (brotli) +const _count$ifBody = _$.closure(4, (_scope, count) => + _$.data(_scope[0], count), + ), + _ifBody = _$.register( "a0", - t.createRenderer(" ", "D ", void 0, () => [o]), + _$.createRenderer(" ", "D ", void 0, () => [_count$ifBody]), ), - r = t.conditional(2, 0), - a = t.effect("a1", (n) => - t.on( - n[0], + _if = _$.conditional(2, 0), + _count_effect = _$.effect("a1", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { - const { 4: n } = t; + ((_scope) => { + const { 4: count } = _scope; return function () { - c(t, n + 1); + _count(_scope, count + 1); }; - })(n), + })(_scope), ), ), - c = t.state( + _count = _$.state( 4, - (t, n) => a(t), - () => t.inConditionalScope(o, 2), + (_scope, count) => _count_effect(_scope), + () => _$.inConditionalScope(_count$ifBody, 2), ), - i = t.effect("a2", (n) => - t.on( - n[1], + _show_effect = _$.effect("a2", (_scope) => + _$.on( + _scope[1], "click", - ((t) => { - const { 3: n } = t; + ((_scope) => { + const { 3: show } = _scope; return function () { - s(t, !n); + _show(_scope, !show); }; - })(n), + })(_scope), ), ), - s = t.state( + _show = _$.state( 3, - (t, n) => { - i(t), r(t, n ? e : null); + (_scope, show) => { + _show_effect(_scope), _if(_scope, show ? _ifBody : null); }, - () => r, + () => _if, ); -n(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-converge-in-if/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/basic-converge-in-if/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..db413faf9a --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/basic-converge-in-if/__snapshots__/.name-cache.json @@ -0,0 +1,5 @@ +{ + "vars": { + "props": {} + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-counter-const-event-handler/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/basic-counter-const-event-handler/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..49f14297ea --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/basic-counter-const-event-handler/__snapshots__/.name-cache.json @@ -0,0 +1,12 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "o", + "$_increment": "r", + "$_increment2_effect": "a", + "$_increment2": "m", + "$_clickCount": "e" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-counter-const-event-handler/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/basic-counter-const-event-handler/__snapshots__/dom.expected/template.hydrate.js index 4e0fd2c1fa..9b4dc7ec25 100644 --- a/packages/translator-tags/src/__tests__/fixtures/basic-counter-const-event-handler/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/basic-counter-const-event-handler/__snapshots__/dom.expected/template.hydrate.js @@ -1,19 +1,16 @@ -// size: 300 (min) 182 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as o } from "@marko/runtime-tags/dom"; -const r = t.register("a0", (t) => { - const { 2: o } = t; +// size: 211 (min) 142 (brotli) +const _increment = _$.register("a0", (_scope) => { + const { 2: clickCount } = _scope; return function () { - e(t, o + 1); + _clickCount(_scope, clickCount + 1); }; }), - a = t.effect("a1", (o) => { - const { 3: r } = o; - t.on(o[0], "click", r); + _increment2_effect = _$.effect("a1", (_scope) => { + const { 3: increment } = _scope; + _$.on(_scope[0], "click", increment); }), - m = t.value(3, (t, o) => a(t)), - e = t.state(2, (o, a) => { - t.data(o[1], a), m(o, r(o)); + _increment2 = _$.value(3, (_scope, increment) => _increment2_effect(_scope)), + _clickCount = _$.state(2, (_scope, clickCount) => { + _$.data(_scope[1], clickCount), _increment2(_scope, _increment(_scope)); }); -o(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-counter-multiplier/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/basic-counter-multiplier/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..b49802f632 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/basic-counter-multiplier/__snapshots__/.name-cache.json @@ -0,0 +1,14 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "o", + "$_expr_count_multiplier": "n", + "$_multipliedCount": "a", + "$_multiplier_effect": "c", + "$_multiplier": "e", + "$_count_effect": "r", + "$_count": "i" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-counter-multiplier/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/basic-counter-multiplier/__snapshots__/dom.expected/template.hydrate.js index 48a8191ffd..f80f7a2078 100644 --- a/packages/translator-tags/src/__tests__/fixtures/basic-counter-multiplier/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/basic-counter-multiplier/__snapshots__/dom.expected/template.hydrate.js @@ -1,46 +1,45 @@ -// size: 460 (min) 226 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as o } from "@marko/runtime-tags/dom"; -const n = t.intersection(2, (t) => { - const { 4: o, 5: n } = t; - a(t, o * n); +// size: 371 (min) 190 (brotli) +const _expr_count_multiplier = _$.intersection(2, (_scope) => { + const { 4: count, 5: multiplier } = _scope; + _multipliedCount(_scope, count * multiplier); }), - a = t.value(6, (o, n) => t.data(o[3], n)), - c = t.effect("a0", (o) => - t.on( - o[0], + _multipliedCount = _$.value(6, (_scope, multipliedCount) => + _$.data(_scope[3], multipliedCount), + ), + _multiplier_effect = _$.effect("a0", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { - const { 5: o } = t; + ((_scope) => { + const { 5: multiplier } = _scope; return function () { - e(t, o + 1); + _multiplier(_scope, multiplier + 1); }; - })(o), + })(_scope), ), ), - e = t.state( + _multiplier = _$.state( 5, - (o, n) => { - t.data(o[1], n), c(o); + (_scope, multiplier) => { + _$.data(_scope[1], multiplier), _multiplier_effect(_scope); }, - () => n, + () => _expr_count_multiplier, ), - r = t.effect("a1", (o) => - t.on( - o[2], + _count_effect = _$.effect("a1", (_scope) => + _$.on( + _scope[2], "click", - ((t) => { - const { 4: o } = t; + ((_scope) => { + const { 4: count } = _scope; return function () { - i(t, o + 1); + _count(_scope, count + 1); }; - })(o), + })(_scope), ), ), - i = t.state( + _count = _$.state( 4, - (t, o) => r(t), - () => n, + (_scope, count) => _count_effect(_scope), + () => _expr_count_multiplier, ); -o(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-counter/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/basic-counter/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..c83864a1ac --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/basic-counter/__snapshots__/.name-cache.json @@ -0,0 +1,10 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "o", + "$_clickCount_effect": "m", + "$_clickCount": "r" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-counter/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/basic-counter/__snapshots__/dom.expected/template.hydrate.js index 52c647ca19..504ff27457 100644 --- a/packages/translator-tags/src/__tests__/fixtures/basic-counter/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/basic-counter/__snapshots__/dom.expected/template.hydrate.js @@ -1,20 +1,17 @@ -// size: 235 (min) 173 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as o } from "@marko/runtime-tags/dom"; -const m = t.effect("a0", (o) => - t.on( - o[0], +// size: 146 (min) 127 (brotli) +const _clickCount_effect = _$.effect("a0", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { - const { 2: o } = t; + ((_scope) => { + const { 2: clickCount } = _scope; return function () { - r(t, o + 1); + _clickCount(_scope, clickCount + 1); }; - })(o), + })(_scope), ), ), - r = t.state(2, (o, r) => { - t.data(o[1], r), m(o); + _clickCount = _$.state(2, (_scope, clickCount) => { + _$.data(_scope[1], clickCount), _clickCount_effect(_scope); }); -o(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-dynamic-native-tag/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/basic-dynamic-native-tag/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..28b800cd11 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/basic-dynamic-native-tag/__snapshots__/.name-cache.json @@ -0,0 +1,8 @@ +{ + "vars": { + "props": { + "$_$": "r", + "$_tagNameBody": "e" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-dynamic-native-tag/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/basic-dynamic-native-tag/__snapshots__/dom.expected/template.hydrate.js index a7059e7b65..99bb944c66 100644 --- a/packages/translator-tags/src/__tests__/fixtures/basic-dynamic-native-tag/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/basic-dynamic-native-tag/__snapshots__/dom.expected/template.hydrate.js @@ -1,5 +1,6 @@ -// size: 134 (min) 105 (brotli) - -import * as r from "@marko/runtime-tags/dom"; -const e = r.register("a0", r.createRendererWithOwner("Hello World", "")); -r.dynamicTagAttrs(0, e); +// size: 92 (min) 74 (brotli) +const _tagNameBody = _$.register( + "a0", + _$.createRendererWithOwner("Hello World", ""), +); +_$.dynamicTagAttrs(0, _tagNameBody); diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-effect-no-deps/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/basic-effect-no-deps/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..695c8cb30b --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/basic-effect-no-deps/__snapshots__/.name-cache.json @@ -0,0 +1,8 @@ +{ + "vars": { + "props": { + "$_$": "m", + "$init": "o" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-effect-no-deps/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/basic-effect-no-deps/__snapshots__/dom.expected/template.hydrate.js index c3716abd95..e2d146bbfc 100644 --- a/packages/translator-tags/src/__tests__/fixtures/basic-effect-no-deps/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/basic-effect-no-deps/__snapshots__/dom.expected/template.hydrate.js @@ -1,5 +1,2 @@ -// size: 147 (min) 91 (brotli) - -import * as m from "@marko/runtime-tags/dom"; -import { init as o } from "@marko/runtime-tags/dom"; -m.effect("a0", (m) => (document.body.className = "no-deps")), o(); +// size: 58 (min) 47 (brotli) +_$.effect("a0", (_scope) => (document.body.className = "no-deps")), init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-execution-order/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/basic-execution-order/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..f9d6fb4fad --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/basic-execution-order/__snapshots__/.name-cache.json @@ -0,0 +1,13 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "o", + "$_message$ifBody": "e", + "$_ifBody": "a", + "$_if": "n", + "$_show": "r", + "$_message": "i" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-execution-order/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/basic-execution-order/__snapshots__/dom.expected/template.hydrate.js index cfaf2d2d28..51c58d213c 100644 --- a/packages/translator-tags/src/__tests__/fixtures/basic-execution-order/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/basic-execution-order/__snapshots__/dom.expected/template.hydrate.js @@ -1,22 +1,21 @@ -// size: 388 (min) 219 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as o } from "@marko/runtime-tags/dom"; -const e = t.closure(2, (o, e) => t.data(o[0], e.text)), - a = t.register( +// size: 299 (min) 191 (brotli) +const _message$ifBody = _$.closure(2, (_scope, message) => + _$.data(_scope[0], message.text), + ), + _ifBody = _$.register( "a0", - t.createRenderer(" ", " ", void 0, () => [e]), + _$.createRenderer(" ", " ", void 0, () => [_message$ifBody]), ), - n = t.conditional(1, 0), - r = t.state( + _if = _$.conditional(1, 0), + _show = _$.state( 3, - (t, o) => n(t, o ? a : null), - () => n, + (_scope, show) => _if(_scope, show ? _ifBody : null), + () => _if, ), - i = t.state(2, 0, () => t.inConditionalScope(e, 1)); -t.effect("a1", (o) => - t.on(o[0], "click", function () { - i(o, null), r(o, !1); + _message = _$.state(2, 0, () => _$.inConditionalScope(_message$ifBody, 1)); +_$.effect("a1", (_scope) => + _$.on(_scope[0], "click", function () { + _message(_scope, null), _show(_scope, !1); }), ), - o(); + init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-export/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/basic-export/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..db413faf9a --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/basic-export/__snapshots__/.name-cache.json @@ -0,0 +1,5 @@ +{ + "vars": { + "props": {} + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-flush-here/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/basic-flush-here/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..db413faf9a --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/basic-flush-here/__snapshots__/.name-cache.json @@ -0,0 +1,5 @@ +{ + "vars": { + "props": {} + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-fn-with-block/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/basic-fn-with-block/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..2c8371037a --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/basic-fn-with-block/__snapshots__/.name-cache.json @@ -0,0 +1,10 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "o", + "$_count_effect": "m", + "$_count": "r" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-fn-with-block/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/basic-fn-with-block/__snapshots__/dom.expected/template.hydrate.js index 52c647ca19..e72945d9e8 100644 --- a/packages/translator-tags/src/__tests__/fixtures/basic-fn-with-block/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/basic-fn-with-block/__snapshots__/dom.expected/template.hydrate.js @@ -1,20 +1,17 @@ -// size: 235 (min) 173 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as o } from "@marko/runtime-tags/dom"; -const m = t.effect("a0", (o) => - t.on( - o[0], +// size: 146 (min) 127 (brotli) +const _count_effect = _$.effect("a0", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { - const { 2: o } = t; + ((_scope) => { + const { 2: count } = _scope; return function () { - r(t, o + 1); + _count(_scope, count + 1); }; - })(o), + })(_scope), ), ), - r = t.state(2, (o, r) => { - t.data(o[1], r), m(o); + _count = _$.state(2, (_scope, count) => { + _$.data(_scope[1], count), _count_effect(_scope); }); -o(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-handler-multi-ref-nested/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/basic-handler-multi-ref-nested/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..9d19117d46 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/basic-handler-multi-ref-nested/__snapshots__/.name-cache.json @@ -0,0 +1,11 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "o", + "$_expr_a_b_effect": "n", + "$_expr_a_b": "r", + "$_a": "m" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-handler-multi-ref-nested/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/basic-handler-multi-ref-nested/__snapshots__/dom.expected/template.hydrate.js index e95a23ef0a..64e96ef675 100644 --- a/packages/translator-tags/src/__tests__/fixtures/basic-handler-multi-ref-nested/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/basic-handler-multi-ref-nested/__snapshots__/dom.expected/template.hydrate.js @@ -1,33 +1,30 @@ -// size: 319 (min) 191 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as o } from "@marko/runtime-tags/dom"; -const n = t.effect("a0", (o) => - t.on( - o[0], +// size: 230 (min) 156 (brotli) +const _expr_a_b_effect = _$.effect("a0", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { - const { 2: o, 3: n } = t; + ((_scope) => { + const { 2: a, 3: b } = _scope; return function () { - m( - t, - o.map( - ((t) => { - const { 3: o } = t; - return (t) => o; - })(t), + _a( + _scope, + a.map( + ((_scope) => { + const { 3: b } = _scope; + return (a) => b; + })(_scope), ), ); }; - })(o), + })(_scope), ), ), - r = t.intersection(2, (t) => { - n(t); + _expr_a_b = _$.intersection(2, (_scope) => { + _expr_a_b_effect(_scope); }), - m = t.state( + _a = _$.state( 2, - (o, n) => t.data(o[1], n.join("")), - () => r, + (_scope, a) => _$.data(_scope[1], a.join("")), + () => _expr_a_b, ); -o(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-handler-refless/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/basic-handler-refless/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..dc46dd370c --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/basic-handler-refless/__snapshots__/.name-cache.json @@ -0,0 +1,9 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "o", + "$_data": "m" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-handler-refless/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/basic-handler-refless/__snapshots__/dom.expected/template.hydrate.js index 7553443ae1..0dfd55209d 100644 --- a/packages/translator-tags/src/__tests__/fixtures/basic-handler-refless/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/basic-handler-refless/__snapshots__/dom.expected/template.hydrate.js @@ -1,11 +1,8 @@ -// size: 196 (min) 125 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as o } from "@marko/runtime-tags/dom"; -const m = t.state(2, (o, m) => t.data(o[1], m)); -t.effect("a0", (o) => - t.on(o[0], "click", function () { - m(o, 1); +// size: 107 (min) 89 (brotli) +const _data = _$.state(2, (_scope, data) => _$.data(_scope[1], data)); +_$.effect("a0", (_scope) => + _$.on(_scope[0], "click", function () { + _data(_scope, 1); }), ), - o(); + init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-inert-collapsible-tree/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/basic-inert-collapsible-tree/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..01db3d85e6 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/basic-inert-collapsible-tree/__snapshots__/.name-cache.json @@ -0,0 +1,26 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "e", + "$_expr_comment_id$ifBody": "o", + "$_id$ifBody": "n", + "$_comment$ifBody": "i", + "$_setup$ifBody": "r", + "$_ifBody": "a", + "$_expr_input_i$forBody": "c", + "$_if$forBody": "s", + "$_open$forBody_effect": "l", + "$_open$forBody": "m", + "$_id$forBody": "u", + "$_i$forBody": "d", + "$_comment$forBody": "p", + "$_params_2$forBody": "v", + "$_input$forBody": "f", + "$_setup$forBody": "g", + "$_forBody": "h", + "$_for": "b", + "$_input_": "k" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-inert-collapsible-tree/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/basic-inert-collapsible-tree/__snapshots__/dom.expected/template.hydrate.js index 33dd5b9c2a..b39d1f0c46 100644 --- a/packages/translator-tags/src/__tests__/fixtures/basic-inert-collapsible-tree/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/basic-inert-collapsible-tree/__snapshots__/dom.expected/template.hydrate.js @@ -1,91 +1,98 @@ -// size: 1182 (min) 541 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as e } from "@marko/runtime-tags/dom"; -const o = t.intersection( +// size: 1093 (min) 508 (brotli) +const _expr_comment_id$ifBody = _$.intersection( 2, - (t) => { + (_scope) => { const { - _: { 6: e, 8: o }, - } = t; - k(t[0], { comments: e.comments, path: o }); + _: { 6: comment, 8: id }, + } = _scope; + _input_(_scope[0], { comments: comment.comments, path: id }); }, - () => t.inChild(0, k), + () => _$.inChild(0, _input_), ), - n = t.closure(8, 0, void 0, () => o), - i = t.closure(6, 0, void 0, () => o), - r = (t) => { - t[0]; + _id$ifBody = _$.closure(8, 0, void 0, () => _expr_comment_id$ifBody), + _comment$ifBody = _$.closure(6, 0, void 0, () => _expr_comment_id$ifBody), + _setup$ifBody = (_scope) => { + _scope[0]; }, - a = t.register( + _ifBody = _$.register( "a0", - t.createRenderer("", "/ b&", r, () => [n, i]), + _$.createRenderer("", "/ b&", _setup$ifBody, () => [ + _id$ifBody, + _comment$ifBody, + ]), ), - c = t.intersection( + _expr_input_i$forBody = _$.intersection( 2, - (t) => { + (_scope) => { const { - _: { 2: e }, - 7: o, - } = t; - u(t, `${e.path || "c"}-${o}`); + _: { 2: input }, + 7: i, + } = _scope; + _id$forBody(_scope, `${input.path || "c"}-${i}`); }, - () => u, + () => _id$forBody, ), - s = t.conditional(4, 0), - l = t.effect("a1", (e) => - t.on( - e[2], + _if$forBody = _$.conditional(4, 0), + _open$forBody_effect = _$.effect("a1", (_scope) => + _$.on( + _scope[2], "click", - ((t) => { - const { 9: e } = t; + ((_scope) => { + const { 9: open } = _scope; return function () { - m(t, !e); + _open$forBody(_scope, !open); }; - })(e), + })(_scope), ), ), - m = t.state(9, (e, o) => { - t.attr(e[0], "hidden", !o), t.data(e[3], o ? "[-]" : "[+]"), l(e); + _open$forBody = _$.state(9, (_scope, open) => { + _$.attr(_scope[0], "hidden", !open), + _$.data(_scope[3], open ? "[-]" : "[+]"), + _open$forBody_effect(_scope); }), - u = t.value( + _id$forBody = _$.value( 8, - (e, o) => t.attr(e[0], "id", o), - () => t.inConditionalScope(n, 4), + (_scope, id) => _$.attr(_scope[0], "id", id), + () => _$.inConditionalScope(_id$ifBody, 4), ), - d = t.value(7, 0, () => c), - p = t.value( + _i$forBody = _$.value(7, 0, () => _expr_input_i$forBody), + _comment$forBody = _$.value( 6, - (e, o) => { - t.data(e[1], o.text), s(e, o.comments ? a : null); + (_scope, comment) => { + _$.data(_scope[1], comment.text), + _if$forBody(_scope, comment.comments ? _ifBody : null); }, - () => t.intersections([s, t.inConditionalScope(i, 4)]), + () => + _$.intersections([ + _if$forBody, + _$.inConditionalScope(_comment$ifBody, 4), + ]), ), - v = t.value( + _params_2$forBody = _$.value( 5, - (t, e) => { - p(t, e[0]), d(t, e[1]); + (_scope, _params_2) => { + _comment$forBody(_scope, _params_2[0]), _i$forBody(_scope, _params_2[1]); }, - () => t.intersections([p, d]), + () => _$.intersections([_comment$forBody, _i$forBody]), ), - f = t.closure(2, 0, void 0, () => c), - g = (t) => { - m(t, !0); + _input$forBody = _$.closure(2, 0, void 0, () => _expr_input_i$forBody), + _setup$forBody = (_scope) => { + _open$forBody(_scope, !0); }, - h = t.register( + _forBody = _$.register( "a2", - t.createRenderer( + _$.createRenderer( "
    • ", " E l D l%", - g, - () => [f], - () => v, + _setup$forBody, + () => [_input$forBody], + () => _params_2$forBody, ), ), - b = t.loopOf(0, h), - k = t.value( + _for = _$.loopOf(0, _forBody), + _input_ = _$.value( 2, - (t, e) => b(t, [e.comments]), - () => t.intersections([b, t.inLoopScope(f, 0)]), + (_scope, input) => _for(_scope, [input.comments]), + () => _$.intersections([_for, _$.inLoopScope(_input$forBody, 0)]), ); -e(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-layout/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/basic-layout/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..225d4ec358 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/basic-layout/__snapshots__/.name-cache.json @@ -0,0 +1,8 @@ +{ + "vars": { + "props": { + "$_$": "r", + "$_name$layoutBody": "e" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-layout/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/basic-layout/__snapshots__/dom.expected/template.hydrate.js index 22052a6fa7..ad1fdafcad 100644 --- a/packages/translator-tags/src/__tests__/fixtures/basic-layout/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/basic-layout/__snapshots__/dom.expected/template.hydrate.js @@ -1,12 +1,12 @@ -// size: 230 (min) 167 (brotli) - -import * as r from "@marko/runtime-tags/dom"; -r.dynamicTagAttrs(0); -const e = r.registerSubscriber( +// size: 188 (min) 129 (brotli) +_$.dynamicTagAttrs(0); +const _name$layoutBody = _$.registerSubscriber( "b0", - r.dynamicClosure(3, (e, t) => r.data(e[0], t)), + _$.dynamicClosure(3, (_scope, name) => _$.data(_scope[0], name)), ); -r.register( +_$.register( "b1", - r.createRendererWithOwner("

    Hello

    ", "Db%", void 0, () => [e]), + _$.createRendererWithOwner("

    Hello

    ", "Db%", void 0, () => [ + _name$layoutBody, + ]), ); diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-nested-for/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/basic-nested-for/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..d930aa09b8 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/basic-nested-for/__snapshots__/.name-cache.json @@ -0,0 +1,23 @@ +{ + "vars": { + "props": { + "$_$": "e", + "$init": "o", + "$_name_": "r", + "$_expr_outer_inner$forBody": "t", + "$_outer$forBody": "i", + "$_inner$forBody": "n", + "$_params_3$forBody": "a", + "$_setup$forBody": "c", + "$_forBody2": "s", + "$_for$forBody": "l", + "$_outer$forBody2": "d", + "$_items$forBody": "u", + "$_params_2$forBody": "m", + "$_forBody": "v", + "$_for": "p", + "$_items_effect": "f", + "$_items": "g" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-nested-for/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/basic-nested-for/__snapshots__/dom.expected/template.hydrate.js index 7c150f0adb..a26e51a37b 100644 --- a/packages/translator-tags/src/__tests__/fixtures/basic-nested-for/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/basic-nested-for/__snapshots__/dom.expected/template.hydrate.js @@ -1,80 +1,77 @@ -// size: 840 (min) 408 (brotli) - -import * as e from "@marko/runtime-tags/dom"; -import { init as o } from "@marko/runtime-tags/dom"; -const r = e.value(3, (o, r) => e.data(o[0], r)), - t = e.intersection( +// size: 751 (min) 367 (brotli) +const _name_ = _$.value(3, (_scope, name) => _$.data(_scope[0], name)), + _expr_outer_inner$forBody = _$.intersection( 2, - (e) => { + (_scope) => { const { - _: { 2: o }, - 2: t, - } = e; - r(e[0], `${o}.${t}`); + _: { 2: outer }, + 2: inner, + } = _scope; + _name_(_scope[0], `${outer}.${inner}`); }, - () => e.inChild(0, r), + () => _$.inChild(0, _name_), ), - i = e.closure(2, 0, void 0, () => t), - n = e.value(2, 0, () => t), - a = e.value( + _outer$forBody = _$.closure(2, 0, void 0, () => _expr_outer_inner$forBody), + _inner$forBody = _$.value(2, 0, () => _expr_outer_inner$forBody), + _params_3$forBody = _$.value( 1, - (e, o) => n(e, o[0]), - () => n, + (_scope, _params_3) => _inner$forBody(_scope, _params_3[0]), + () => _inner$forBody, ), - c = (e) => { - e[0]; + _setup$forBody = (_scope) => { + _scope[0]; }, - s = e.register( + _forBody2 = _$.register( "b0", - e.createRenderer( + _$.createRenderer( "
    ", "/D l&", - c, - () => [i], - () => a, + _setup$forBody, + () => [_outer$forBody], + () => _params_3$forBody, ), ), - l = e.loopOf(0, s), - d = e.value(2, 0, () => e.inLoopScope(i, 0)), - u = e.closure( + _for$forBody = _$.loopOf(0, _forBody2), + _outer$forBody2 = _$.value(2, 0, () => _$.inLoopScope(_outer$forBody, 0)), + _items$forBody = _$.closure( 2, - (e, o) => l(e, [o]), + (_scope, items) => _for$forBody(_scope, [items]), void 0, - () => l, + () => _for$forBody, ), - m = e.value( + _params_2$forBody = _$.value( 1, - (e, o) => d(e, o[0]), - () => d, + (_scope, _params_2) => _outer$forBody2(_scope, _params_2[0]), + () => _outer$forBody2, ), - v = e.register( + _forBody = _$.register( "b1", - e.createRenderer( + _$.createRenderer( "", "D%D", void 0, - () => [u], - () => m, + () => [_items$forBody], + () => _params_2$forBody, ), ), - p = e.loopOf(1, v), - f = e.effect("b2", (o) => - e.on( - o[0], + _for = _$.loopOf(1, _forBody), + _items_effect = _$.effect("b2", (_scope) => + _$.on( + _scope[0], "click", - ((e) => { - const { 2: o } = e; + ((_scope) => { + const { 2: items } = _scope; return function () { - g(e, [...o, o.length]); + _items(_scope, [...items, items.length]); }; - })(o), + })(_scope), ), ), - g = e.state( + _items = _$.state( 2, - (e, o) => { - f(e), p(e, [o]); + (_scope, items) => { + _items_effect(_scope), _for(_scope, [items]); }, - () => e.intersections([p, e.inLoopScope(u, 1)]), + () => _$.intersections([_for, _$.inLoopScope(_items$forBody, 1)]), ); -o(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-nested-params/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/basic-nested-params/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..b54a0635b2 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/basic-nested-params/__snapshots__/.name-cache.json @@ -0,0 +1,23 @@ +{ + "vars": { + "props": { + "$_$": "e", + "$init": "r", + "$_renderBody_input": "i", + "$_expr_Text_value": "t", + "$_dynamicTagName": "a", + "$_value_": "n", + "$_renderBody_": "o", + "$_inner$childBody": "c", + "$_outer$childBody": "s", + "$_params_3$childBody": "d", + "$_childBody2": "u", + "$_y$childBody": "m", + "$_outer$childBody2": "l", + "$_params_2$childBody": "v", + "$_setup$childBody": "b", + "$_x_effect": "g", + "$_x": "f" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-nested-params/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/basic-nested-params/__snapshots__/dom.expected/template.hydrate.js index b1b7e87ed1..ae038f6e7e 100644 --- a/packages/translator-tags/src/__tests__/fixtures/basic-nested-params/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/basic-nested-params/__snapshots__/dom.expected/template.hydrate.js @@ -1,84 +1,83 @@ -// size: 966 (min) 421 (brotli) - -import * as e from "@marko/runtime-tags/dom"; -import { init as r } from "@marko/runtime-tags/dom"; -const i = e.dynamicTagAttrs(0), - t = e.intersection( +// size: 877 (min) 389 (brotli) +const _renderBody_input = _$.dynamicTagAttrs(0), + _expr_Text_value = _$.intersection( 2, - (e) => { - const { 4: r } = e; - i(e, () => r); + (_scope) => { + const { 4: value } = _scope; + _renderBody_input(_scope, () => value); }, - () => i, + () => _renderBody_input, ), - a = e.conditional(0, 0, () => t), - n = e.value(4, 0, () => t), - o = e.value( + _dynamicTagName = _$.conditional(0, 0, () => _expr_Text_value), + _value_ = _$.value(4, 0, () => _expr_Text_value), + _renderBody_ = _$.value( 3, - (e, r) => a(e, r), - () => a, + (_scope, renderBody) => _dynamicTagName(_scope, renderBody), + () => _dynamicTagName, ), - c = e.value(3, (r, i) => e.data(r[1], i)), - s = e.registerSubscriber( + _inner$childBody = _$.value(3, (_scope, inner) => _$.data(_scope[1], inner)), + _outer$childBody = _$.registerSubscriber( "b0", - e.dynamicClosure(2, (r, i) => e.data(r[0], i)), + _$.dynamicClosure(2, (_scope, outer) => _$.data(_scope[0], outer)), ), - d = e.value(2, (e, r) => c(e, r[0])), - u = e.register( + _params_3$childBody = _$.value(2, (_scope, _params_3) => + _inner$childBody(_scope, _params_3[0]), + ), + _childBody2 = _$.register( "b1", - e.createRendererWithOwner( + _$.createRendererWithOwner( "
    .
    ", "D%c%", void 0, - () => [s], - () => d, + () => [_outer$childBody], + () => _params_3$childBody, ), ), - m = e.registerSubscriber( + _y$childBody = _$.registerSubscriber( "b2", - e.dynamicClosure( + _$.dynamicClosure( 3, - (e, r) => n(e[0], r), + (_scope, y) => _value_(_scope[0], y), void 0, - () => e.inChild(0, n), + () => _$.inChild(0, _value_), ), ), - l = e.value(2, 0, () => e.dynamicSubscribers(2)), - v = e.value( + _outer$childBody2 = _$.value(2, 0, () => _$.dynamicSubscribers(2)), + _params_2$childBody = _$.value( 1, - (e, r) => l(e, r[0]), - () => l, + (_scope, _params_2) => _outer$childBody2(_scope, _params_2[0]), + () => _outer$childBody2, ), - b = (e) => { - e[0], o(e[0], u(e)); + _setup$childBody = (_scope) => { + _scope[0], _renderBody_(_scope[0], _childBody2(_scope)); }; -e.register( +_$.register( "b3", - e.createRendererWithOwner( + _$.createRendererWithOwner( "
    ", "/D%l&", - b, - () => [m], - () => v, + _setup$childBody, + () => [_y$childBody], + () => _params_2$childBody, ), ); -const g = e.effect("b4", (r) => - e.on( - r[0], +const _x_effect = _$.effect("b4", (_scope) => + _$.on( + _scope[0], "click", - ((e) => { - const { 2: r } = e; + ((_scope) => { + const { 2: x } = _scope; return function () { - f(e, r + 1); + _x(_scope, x + 1); }; - })(r), + })(_scope), ), ), - f = e.state( + _x = _$.state( 2, - (e, r) => { - g(e), n(e[1], r); + (_scope, x) => { + _x_effect(_scope), _value_(_scope[1], x); }, - () => e.inChild(1, n), + () => _$.inChild(1, _value_), ); -r(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-nested-scope-custom-tag/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/basic-nested-scope-custom-tag/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..6888272892 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/basic-nested-scope-custom-tag/__snapshots__/.name-cache.json @@ -0,0 +1,11 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "r", + "$_count$childBody_effect": "e", + "$_count$childBody": "o", + "$_count": "n" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-nested-scope-custom-tag/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/basic-nested-scope-custom-tag/__snapshots__/dom.expected/template.hydrate.js index 7f0146c1b4..b047a3c13d 100644 --- a/packages/translator-tags/src/__tests__/fixtures/basic-nested-scope-custom-tag/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/basic-nested-scope-custom-tag/__snapshots__/dom.expected/template.hydrate.js @@ -1,31 +1,30 @@ -// size: 437 (min) 251 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as r } from "@marko/runtime-tags/dom"; -t.dynamicTagAttrs(0); -const e = t.effect("b0", (r) => - t.on( - r[0], +// size: 348 (min) 216 (brotli) +_$.dynamicTagAttrs(0); +const _count$childBody_effect = _$.effect("b0", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { + ((_scope) => { const { - _: { 1: r }, - } = t; + _: { 1: count }, + } = _scope; return function () { - n(t._, r + 1); + _count(_scope._, count + 1); }; - })(r), + })(_scope), ), ), - o = t.registerSubscriber( + _count$childBody = _$.registerSubscriber( "b1", - t.dynamicClosure(1, (r, o) => { - t.data(r[1], o), e(r); + _$.dynamicClosure(1, (_scope, count) => { + _$.data(_scope[1], count), _count$childBody_effect(_scope); }), ); -t.register( +_$.register( "b2", - t.createRendererWithOwner("", " D ", void 0, () => [o]), + _$.createRendererWithOwner("", " D ", void 0, () => [ + _count$childBody, + ]), ); -const n = t.state(1, 0, () => t.dynamicSubscribers(1)); -r(); +const _count = _$.state(1, 0, () => _$.dynamicSubscribers(1)); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-nested-scope-dynamic-tag/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/basic-nested-scope-dynamic-tag/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..d90c53bde6 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/basic-nested-scope-dynamic-tag/__snapshots__/.name-cache.json @@ -0,0 +1,12 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "r", + "$_count$falseChildBody_effect": "e", + "$_count$falseChildBody": "n", + "$_falseChildBody": "o", + "$_count": "i" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-nested-scope-dynamic-tag/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/basic-nested-scope-dynamic-tag/__snapshots__/dom.expected/template.hydrate.js index 59b8778f71..1820cbc717 100644 --- a/packages/translator-tags/src/__tests__/fixtures/basic-nested-scope-dynamic-tag/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/basic-nested-scope-dynamic-tag/__snapshots__/dom.expected/template.hydrate.js @@ -1,32 +1,31 @@ -// size: 462 (min) 257 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as r } from "@marko/runtime-tags/dom"; -t.dynamicTagAttrs(0); -const e = t.effect("b0", (r) => - t.on( - r[0], +// size: 373 (min) 222 (brotli) +_$.dynamicTagAttrs(0); +const _count$falseChildBody_effect = _$.effect("b0", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { + ((_scope) => { const { - _: { 1: r }, - } = t; + _: { 1: count }, + } = _scope; return function () { - i(t._, r + 1); + _count(_scope._, count + 1); }; - })(r), + })(_scope), ), ), - n = t.registerSubscriber( + _count$falseChildBody = _$.registerSubscriber( "b1", - t.dynamicClosure(1, (r, n) => { - t.data(r[1], n), e(r); + _$.dynamicClosure(1, (_scope, count) => { + _$.data(_scope[1], count), _count$falseChildBody_effect(_scope); }), ), - o = t.register( + _falseChildBody = _$.register( "b2", - t.createRendererWithOwner("", " D ", void 0, () => [n]), + _$.createRendererWithOwner("", " D ", void 0, () => [ + _count$falseChildBody, + ]), ); -t.dynamicTagAttrs(0, o); -const i = t.state(1, 0, () => t.dynamicSubscribers(1)); -r(); +_$.dynamicTagAttrs(0, _falseChildBody); +const _count = _$.state(1, 0, () => _$.dynamicSubscribers(1)); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-nested-scope-for/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/basic-nested-scope-for/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..6338b7d28d --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/basic-nested-scope-for/__snapshots__/.name-cache.json @@ -0,0 +1,11 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "o", + "$_expr_selected_num$forBody": "e", + "$_selected$forBody": "r", + "$_selected": "a" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-nested-scope-for/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/basic-nested-scope-for/__snapshots__/dom.expected/template.hydrate.js index 534496a2ed..fb7a3ad8e4 100644 --- a/packages/translator-tags/src/__tests__/fixtures/basic-nested-scope-for/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/basic-nested-scope-for/__snapshots__/dom.expected/template.hydrate.js @@ -1,27 +1,29 @@ -// size: 386 (min) 221 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as o } from "@marko/runtime-tags/dom"; -const e = t.intersection(2, (o) => { +// size: 297 (min) 193 (brotli) +const _expr_selected_num$forBody = _$.intersection(2, (_scope) => { const { - _: { 1: e }, - 3: r, - } = o; - t.attr(o[0], "data-selected", e === r), - t.attr(o[0], "data-multiple", r % e == 0); + _: { 1: selected }, + 3: num, + } = _scope; + _$.attr(_scope[0], "data-selected", selected === num), + _$.attr(_scope[0], "data-multiple", num % selected == 0); }); -t.effect("a0", (o) => - t.on( - o[0], +_$.effect("a0", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { - const { 3: o } = t; + ((_scope) => { + const { 3: num } = _scope; return function () { - a(t._, o); + _selected(_scope._, num); }; - })(o), + })(_scope), ), ); -const r = t.closure(1, 0, void 0, () => e), - a = t.state(1, 0, () => t.inLoopScope(r, 0)); -o(); +const _selected$forBody = _$.closure( + 1, + 0, + void 0, + () => _expr_selected_num$forBody, + ), + _selected = _$.state(1, 0, () => _$.inLoopScope(_selected$forBody, 0)); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-nested-scope-if/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/basic-nested-scope-if/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..6438b145a2 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/basic-nested-scope-if/__snapshots__/.name-cache.json @@ -0,0 +1,15 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "e", + "$_clickCount$elseBody": "o", + "$_elseBody": "n", + "$_clickCount$ifBody_effect": "r", + "$_clickCount$ifBody": "i", + "$_ifBody": "a", + "$_if": "c", + "$_clickCount": "s" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-nested-scope-if/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/basic-nested-scope-if/__snapshots__/dom.expected/template.hydrate.js index bccc12eeb0..1ecb12df73 100644 --- a/packages/translator-tags/src/__tests__/fixtures/basic-nested-scope-if/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/basic-nested-scope-if/__snapshots__/dom.expected/template.hydrate.js @@ -1,47 +1,48 @@ -// size: 607 (min) 305 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as e } from "@marko/runtime-tags/dom"; -const o = t.closure(1, (e, o) => t.data(e[0], o)), - n = t.register( +// size: 518 (min) 272 (brotli) +const _clickCount$elseBody = _$.closure(1, (_scope, clickCount) => + _$.data(_scope[0], clickCount), + ), + _elseBody = _$.register( "a0", - t.createRenderer( + _$.createRenderer( "The button was clicked times.", "Db%", void 0, - () => [o], + () => [_clickCount$elseBody], ), ), - r = t.effect("a1", (e) => - t.on( - e[0], + _clickCount$ifBody_effect = _$.effect("a1", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { + ((_scope) => { const { - _: { 1: e }, - } = t; + _: { 1: clickCount }, + } = _scope; return function () { - s(t._, e + 1); + _clickCount(_scope._, clickCount + 1); }; - })(e), + })(_scope), ), ), - i = t.closure(1, (e, o) => { - t.data(e[1], o), r(e); + _clickCount$ifBody = _$.closure(1, (_scope, clickCount) => { + _$.data(_scope[1], clickCount), _clickCount$ifBody_effect(_scope); }), - a = t.register( + _ifBody = _$.register( "a2", - t.createRenderer("", " D ", void 0, () => [i]), + _$.createRenderer("", " D ", void 0, () => [ + _clickCount$ifBody, + ]), ), - c = t.conditional(0, 0), - s = t.state( + _if = _$.conditional(0, 0), + _clickCount = _$.state( 1, - (t, e) => c(t, e < 3 ? a : n), + (_scope, clickCount) => _if(_scope, clickCount < 3 ? _ifBody : _elseBody), () => - t.intersections([ - c, - t.inConditionalScope(i, 0), - t.inConditionalScope(o, 0), + _$.intersections([ + _if, + _$.inConditionalScope(_clickCount$ifBody, 0), + _$.inConditionalScope(_clickCount$elseBody, 0), ]), ); -e(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-push-pop-list/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/basic-push-pop-list/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..a0985e8363 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/basic-push-pop-list/__snapshots__/.name-cache.json @@ -0,0 +1,17 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "e", + "$_item$forBody": "o", + "$_params_2$forBody": "r", + "$_forBody": "n", + "$_expr_id_items_effect": "a", + "$_expr_id_items": "c", + "$_for": "i", + "$_items_effect": "s", + "$_items": "m", + "$_id": "f" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-push-pop-list/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/basic-push-pop-list/__snapshots__/dom.expected/template.hydrate.js index 96d825e3db..f5bdd3a7fc 100644 --- a/packages/translator-tags/src/__tests__/fixtures/basic-push-pop-list/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/basic-push-pop-list/__snapshots__/dom.expected/template.hydrate.js @@ -1,48 +1,47 @@ -// size: 574 (min) 306 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as e } from "@marko/runtime-tags/dom"; -const o = t.value(2, (e, o) => t.data(e[0], o)), - r = t.value(1, (t, e) => o(t, e[0])), - n = t.register( +// size: 485 (min) 250 (brotli) +const _item$forBody = _$.value(2, (_scope, item) => _$.data(_scope[0], item)), + _params_2$forBody = _$.value(1, (_scope, _params_2) => + _item$forBody(_scope, _params_2[0]), + ), + _forBody = _$.register( "a0", - t.createRenderer(" ", " ", void 0, void 0, () => r), + _$.createRenderer(" ", " ", void 0, void 0, () => _params_2$forBody), ), - a = t.effect("a1", (e) => - t.on( - e[1], + _expr_id_items_effect = _$.effect("a1", (_scope) => + _$.on( + _scope[1], "click", - ((t) => { - const { 3: e, 4: o } = t; + ((_scope) => { + const { 3: id, 4: items } = _scope; return function () { - const r = e + 1; - f(t, r), m(t, [...o, r]); + const nextId = id + 1; + _id(_scope, nextId), _items(_scope, [...items, nextId]); }; - })(e), + })(_scope), ), ), - c = t.intersection(2, (t) => { - a(t); + _expr_id_items = _$.intersection(2, (_scope) => { + _expr_id_items_effect(_scope); }), - i = t.loopOf(0, n), - s = t.effect("a2", (e) => - t.on( - e[2], + _for = _$.loopOf(0, _forBody), + _items_effect = _$.effect("a2", (_scope) => + _$.on( + _scope[2], "click", - ((t) => { - const { 4: e } = t; + ((_scope) => { + const { 4: items } = _scope; return function () { - m(t, e.slice(0, -1)); + _items(_scope, items.slice(0, -1)); }; - })(e), + })(_scope), ), ), - m = t.state( + _items = _$.state( 4, - (t, e) => { - s(t), i(t, [e]); + (_scope, items) => { + _items_effect(_scope), _for(_scope, [items]); }, - () => c, + () => _expr_id_items, ), - f = t.state(3, 0, () => c); -e(); + _id = _$.state(3, 0, () => _expr_id_items); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-shared-node-ref/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/basic-shared-node-ref/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..7eff8e175e --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/basic-shared-node-ref/__snapshots__/.name-cache.json @@ -0,0 +1,16 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "e", + "$_x$forBody": "r", + "$_params_2$forBody": "o", + "$_forBody": "n", + "$_for": "a", + "$_list_effect": "c", + "$_list": "i", + "$_open_effect": "f", + "$_open": "m" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-shared-node-ref/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/basic-shared-node-ref/__snapshots__/dom.expected/template.hydrate.js index 8bd421a049..908df68a1a 100644 --- a/packages/translator-tags/src/__tests__/fixtures/basic-shared-node-ref/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/basic-shared-node-ref/__snapshots__/dom.expected/template.hydrate.js @@ -1,48 +1,53 @@ -// size: 577 (min) 303 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as e } from "@marko/runtime-tags/dom"; -const r = t.value(2, (e, r) => t.data(e[0], r)), - o = t.value(1, (t, e) => r(t, e[0])), - n = t.register( +// size: 488 (min) 250 (brotli) +const _x$forBody = _$.value(2, (_scope, x) => _$.data(_scope[0], x)), + _params_2$forBody = _$.value(1, (_scope, _params_2) => + _x$forBody(_scope, _params_2[0]), + ), + _forBody = _$.register( "a0", - t.createRenderer("
    • ", "D ", void 0, void 0, () => o), + _$.createRenderer( + "
    • ", + "D ", + void 0, + void 0, + () => _params_2$forBody, + ), ), - a = t.loopOf(0, n), - c = t.effect("a1", (e) => - t.on( - e[2], + _for = _$.loopOf(0, _forBody), + _list_effect = _$.effect("a1", (_scope) => + _$.on( + _scope[2], "click", - ((t) => { - const { 4: e } = t; + ((_scope) => { + const { 4: list } = _scope; return function () { - i(t, [].concat(e).reverse()); + _list(_scope, [].concat(list).reverse()); }; - })(e), + })(_scope), ), ), - i = t.state(4, (t, e) => { - c(t), - a(t, [ - e, - function (t) { - return t; + _list = _$.state(4, (_scope, list) => { + _list_effect(_scope), + _for(_scope, [ + list, + function (x) { + return x; }, ]); }), - f = t.effect("a2", (e) => - t.on( - e[1], + _open_effect = _$.effect("a2", (_scope) => + _$.on( + _scope[1], "click", - ((t) => { - const { 3: e } = t; + ((_scope) => { + const { 3: open } = _scope; return function () { - m(t, !e); + _open(_scope, !open); }; - })(e), + })(_scope), ), ), - m = t.state(3, (e, r) => { - t.attr(e[0], "hidden", !r), f(e); + _open = _$.state(3, (_scope, open) => { + _$.attr(_scope[0], "hidden", !open), _open_effect(_scope); }); -e(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-static/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/basic-static/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..db413faf9a --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/basic-static/__snapshots__/.name-cache.json @@ -0,0 +1,5 @@ +{ + "vars": { + "props": {} + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-toggle-show/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/basic-toggle-show/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..1de5506d95 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/basic-toggle-show/__snapshots__/.name-cache.json @@ -0,0 +1,12 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "o", + "$_ifBody": "r", + "$_if": "e", + "$_show_effect": "n", + "$_show": "a" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-toggle-show/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/basic-toggle-show/__snapshots__/dom.expected/template.hydrate.js index c2daf60e42..8c0245b3b6 100644 --- a/packages/translator-tags/src/__tests__/fixtures/basic-toggle-show/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/basic-toggle-show/__snapshots__/dom.expected/template.hydrate.js @@ -1,22 +1,19 @@ -// size: 303 (min) 191 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as o } from "@marko/runtime-tags/dom"; -const r = t.register("a0", t.createRenderer("Hello!", "")), - e = t.conditional(0, 0), - n = t.effect("a1", (o) => - t.on( - o[1], +// size: 214 (min) 146 (brotli) +const _ifBody = _$.register("a0", _$.createRenderer("Hello!", "")), + _if = _$.conditional(0, 0), + _show_effect = _$.effect("a1", (_scope) => + _$.on( + _scope[1], "click", - ((t) => { - const { 2: o } = t; + ((_scope) => { + const { 2: show } = _scope; return function () { - a(t, !o); + _show(_scope, !show); }; - })(o), + })(_scope), ), ), - a = t.state(2, (t, o) => { - n(t), e(t, o ? r : null); + _show = _$.state(2, (_scope, show) => { + _show_effect(_scope), _if(_scope, show ? _ifBody : null); }); -o(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-unused-ref/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/basic-unused-ref/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..c83864a1ac --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/basic-unused-ref/__snapshots__/.name-cache.json @@ -0,0 +1,10 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "o", + "$_clickCount_effect": "m", + "$_clickCount": "r" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/basic-unused-ref/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/basic-unused-ref/__snapshots__/dom.expected/template.hydrate.js index 52c647ca19..504ff27457 100644 --- a/packages/translator-tags/src/__tests__/fixtures/basic-unused-ref/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/basic-unused-ref/__snapshots__/dom.expected/template.hydrate.js @@ -1,20 +1,17 @@ -// size: 235 (min) 173 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as o } from "@marko/runtime-tags/dom"; -const m = t.effect("a0", (o) => - t.on( - o[0], +// size: 146 (min) 127 (brotli) +const _clickCount_effect = _$.effect("a0", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { - const { 2: o } = t; + ((_scope) => { + const { 2: clickCount } = _scope; return function () { - r(t, o + 1); + _clickCount(_scope, clickCount + 1); }; - })(o), + })(_scope), ), ), - r = t.state(2, (o, r) => { - t.data(o[1], r), m(o); + _clickCount = _$.state(2, (_scope, clickCount) => { + _$.data(_scope[1], clickCount), _clickCount_effect(_scope); }); -o(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/batched-updates-cleanup/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/batched-updates-cleanup/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..ebed362cf7 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/batched-updates-cleanup/__snapshots__/.name-cache.json @@ -0,0 +1,14 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "o", + "$_message$ifBody": "e", + "$_ifBody": "n", + "$_if": "a", + "$_message": "r", + "$_show_effect": "i", + "$_show": "s" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/batched-updates-cleanup/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/batched-updates-cleanup/__snapshots__/dom.expected/template.hydrate.js index 1802fe2b7e..5740bbea69 100644 --- a/packages/translator-tags/src/__tests__/fixtures/batched-updates-cleanup/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/batched-updates-cleanup/__snapshots__/dom.expected/template.hydrate.js @@ -1,31 +1,30 @@ -// size: 435 (min) 253 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as o } from "@marko/runtime-tags/dom"; -const e = t.closure(3, (o, e) => t.data(o[0], e)), - n = t.register( +// size: 346 (min) 217 (brotli) +const _message$ifBody = _$.closure(3, (_scope, message) => + _$.data(_scope[0], message), + ), + _ifBody = _$.register( "a0", - t.createRenderer(" ", "D ", void 0, () => [e]), + _$.createRenderer(" ", "D ", void 0, () => [_message$ifBody]), ), - a = t.conditional(1, 0), - r = t.state(3, 0, () => t.inConditionalScope(e, 1)), - i = t.effect("a1", (o) => - t.on( - o[0], + _if = _$.conditional(1, 0), + _message = _$.state(3, 0, () => _$.inConditionalScope(_message$ifBody, 1)), + _show_effect = _$.effect("a1", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { - const { 2: o } = t; + ((_scope) => { + const { 2: show } = _scope; return function () { - r(t, "bye"), s(t, !o); + _message(_scope, "bye"), _show(_scope, !show); }; - })(o), + })(_scope), ), ), - s = t.state( + _show = _$.state( 2, - (t, o) => { - i(t), a(t, o ? n : null); + (_scope, show) => { + _show_effect(_scope), _if(_scope, show ? _ifBody : null); }, - () => a, + () => _if, ); -o(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/batched-updates/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/batched-updates/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..46a17aa114 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/batched-updates/__snapshots__/.name-cache.json @@ -0,0 +1,12 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "o", + "$_expr_a_b_effect": "n", + "$_expr_a_b": "r", + "$_b": "a", + "$_a": "m" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/batched-updates/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/batched-updates/__snapshots__/dom.expected/template.hydrate.js index 6187f2ff2f..0bc86d3a40 100644 --- a/packages/translator-tags/src/__tests__/fixtures/batched-updates/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/batched-updates/__snapshots__/dom.expected/template.hydrate.js @@ -1,23 +1,20 @@ -// size: 316 (min) 186 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as o } from "@marko/runtime-tags/dom"; -const n = t.effect("a0", (o) => - t.on( - o[0], +// size: 227 (min) 146 (brotli) +const _expr_a_b_effect = _$.effect("a0", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { - const { 2: o, 3: n } = t; + ((_scope) => { + const { 2: a, 3: b } = _scope; return function () { - m(t, o + 1), a(t, n + 1); + _a(_scope, a + 1), _b(_scope, b + 1); }; - })(o), + })(_scope), ), ), - r = t.intersection(2, (o) => { - const { 2: r, 3: a } = o; - t.data(o[1], r + a), n(o); + _expr_a_b = _$.intersection(2, (_scope) => { + const { 2: a, 3: b } = _scope; + _$.data(_scope[1], a + b), _expr_a_b_effect(_scope); }), - a = t.state(3, 0, () => r), - m = t.state(2, 0, () => r); -o(); + _b = _$.state(3, 0, () => _expr_a_b), + _a = _$.state(2, 0, () => _expr_a_b); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/body-content/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/body-content/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..b2b58b55fd --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/body-content/__snapshots__/.name-cache.json @@ -0,0 +1,17 @@ +{ + "vars": { + "props": { + "$_$": "r", + "$init": "e", + "$_renderBody_input": "t", + "$_dynamicTagName": "i", + "$_attrs__effect": "n", + "$_renderBody_": "a", + "$_input_": "o", + "$_onClick": "s", + "$_clickCount$FancyButtonBody": "d", + "$_FancyButtonBody": "c", + "$_clickCount": "m" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/body-content/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/body-content/__snapshots__/dom.expected/template.hydrate.js index 08c060383d..4350d0a985 100644 --- a/packages/translator-tags/src/__tests__/fixtures/body-content/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/body-content/__snapshots__/dom.expected/template.hydrate.js @@ -1,48 +1,53 @@ -// size: 672 (min) 358 (brotli) - -import * as r from "@marko/runtime-tags/dom"; -import { init as e } from "@marko/runtime-tags/dom"; -const t = r.dynamicTagAttrs(1), - i = r.conditional( +// size: 583 (min) 311 (brotli) +const _renderBody_input = _$.dynamicTagAttrs(1), + _dynamicTagName = _$.conditional( 1, - (r) => t(r, () => ({})), - () => t, + (_scope) => _renderBody_input(_scope, () => ({})), + () => _renderBody_input, ), - n = r.effect("a0", (e) => { - r.attrsEvents(e, 0); + _attrs__effect = _$.effect("a0", (_scope) => { + _$.attrsEvents(_scope, 0); }), - a = r.value( + _renderBody_ = _$.value( 4, - (r, e) => i(r, e), - () => i, + (_scope, renderBody) => _dynamicTagName(_scope, renderBody), + () => _dynamicTagName, ), - o = r.value( + _input_ = _$.value( 3, - (e, t) => { - ((e, t) => { - r.attrs(e, 0, t), n(e); - })(e, t), - a(e, t.renderBody); + (_scope, input) => { + ((_scope, attrs) => { + _$.attrs(_scope, 0, attrs), _attrs__effect(_scope); + })(_scope, input), + _renderBody_(_scope, input.renderBody); }, - () => a, + () => _renderBody_, ), - s = r.register("b0", (r) => { - const { 1: e } = r; + _onClick = _$.register("b0", (_scope) => { + const { 1: clickCount } = _scope; return function () { - m(r, e + 1); + _clickCount(_scope, clickCount + 1); }; }), - d = r.registerSubscriber( + _clickCount$FancyButtonBody = _$.registerSubscriber( "b1", - r.dynamicClosure(1, (e, t) => r.data(e[0], t)), + _$.dynamicClosure(1, (_scope, clickCount) => + _$.data(_scope[0], clickCount), + ), ), - c = r.register( + _FancyButtonBody = _$.register( "b2", - r.createRendererWithOwner(" ", " ", void 0, () => [d]), + _$.createRendererWithOwner(" ", " ", void 0, () => [ + _clickCount$FancyButtonBody, + ]), ), - m = r.state( + _clickCount = _$.state( 1, - (r, e) => o(r[0], { onClick: s(r), renderBody: c(r) }), - () => r.intersections([r.inChild(0, o), r.dynamicSubscribers(1)]), + (_scope, clickCount) => + _input_(_scope[0], { + onClick: _onClick(_scope), + renderBody: _FancyButtonBody(_scope), + }), + () => _$.intersections([_$.inChild(0, _input_), _$.dynamicSubscribers(1)]), ); -e(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/cleanup-n-child-for-shallow/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/cleanup-n-child-for-shallow/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..cd10f2002c --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/cleanup-n-child-for-shallow/__snapshots__/.name-cache.json @@ -0,0 +1,20 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "e", + "$_expr_name_write_effect": "n", + "$_expr_name_write": "o", + "$_write_": "r", + "$_name_": "a", + "$_write$forBody": "i", + "$_item$forBody": "s", + "$_params_2$forBody": "l", + "$_setup$forBody": "c", + "$_forBody": "d", + "$_for": "u", + "$_items_effect": "m", + "$_items": "f" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/cleanup-n-child-for-shallow/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/cleanup-n-child-for-shallow/__snapshots__/dom.expected/template.hydrate.js index d2fabccbd4..8cff647367 100644 --- a/packages/translator-tags/src/__tests__/fixtures/cleanup-n-child-for-shallow/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/cleanup-n-child-for-shallow/__snapshots__/dom.expected/template.hydrate.js @@ -1,82 +1,81 @@ -// size: 923 (min) 454 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as e } from "@marko/runtime-tags/dom"; -const n = t.effect("a0", (e) => { - const { 5: n, 6: o } = e; - o(`mounted ${n}`), - (t.getAbortSignal(e, 0).onabort = ((t) => { - const { 5: e, 6: n } = t; +// size: 834 (min) 421 (brotli) +const _expr_name_write_effect = _$.effect("a0", (_scope) => { + const { 5: name, 6: write } = _scope; + write(`mounted ${name}`), + (_$.getAbortSignal(_scope, 0).onabort = ((_scope) => { + const { 5: name, 6: write } = _scope; return () => { - n(`destroyed ${e}`); + write(`destroyed ${name}`); }; - })(e)); + })(_scope)); }), - o = t.intersection(2, (e) => { - t.resetAbortSignal(e, 0), n(e); + _expr_name_write = _$.intersection(2, (_scope) => { + _$.resetAbortSignal(_scope, 0), _expr_name_write_effect(_scope); }), - r = t.value(6, 0, () => o), - a = t.value( + _write_ = _$.value(6, 0, () => _expr_name_write), + _name_ = _$.value( 5, - (e, n) => { - t.data(e[0], n), t.data(e[1], n), t.data(e[2], n); + (_scope, name) => { + _$.data(_scope[0], name), + _$.data(_scope[1], name), + _$.data(_scope[2], name); }, - () => o, + () => _expr_name_write, ); -t.register( +_$.register( "b0", - (t) => - function (e) { - t[1].innerHTML += "\n" + e; + (_scope) => + function (msg) { + _scope[1].innerHTML += "\n" + msg; }, ); -const i = t.closure( +const _write$forBody = _$.closure( 4, - (t, e) => r(t[0], e), + (_scope, write) => _write_(_scope[0], write), void 0, - () => t.inChild(0, r), + () => _$.inChild(0, _write_), ), - s = t.value( + _item$forBody = _$.value( 2, - (t, e) => a(t[0], e), - () => t.inChild(0, a), + (_scope, item) => _name_(_scope[0], item), + () => _$.inChild(0, _name_), ), - l = t.value( + _params_2$forBody = _$.value( 1, - (t, e) => s(t, e[0]), - () => s, + (_scope, _params_2) => _item$forBody(_scope, _params_2[0]), + () => _item$forBody, ), - c = (t) => { - t[0]; + _setup$forBody = (_scope) => { + _scope[0]; }, - d = t.register( + _forBody = _$.register( "b1", - t.createRenderer( + _$.createRenderer( "

    ", "/D lD lD l&", - c, - () => [i], - () => l, + _setup$forBody, + () => [_write$forBody], + () => _params_2$forBody, ), ), - u = t.loopOf(2, d), - m = t.effect("b2", (e) => - t.on( - e[0], + _for = _$.loopOf(2, _forBody), + _items_effect = _$.effect("b2", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { - const { 3: e } = t; + ((_scope) => { + const { 3: items } = _scope; return function () { - f(t, e.length ? e.slice(0, -1) : [1, 2, 3]); + _items(_scope, items.length ? items.slice(0, -1) : [1, 2, 3]); }; - })(e), + })(_scope), ), ), - f = t.state( + _items = _$.state( 3, - (t, e) => { - m(t), u(t, [e]); + (_scope, items) => { + _items_effect(_scope), _for(_scope, [items]); }, - () => u, + () => _for, ); -e(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/cleanup-n-child-if-deep/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/cleanup-n-child-if-deep/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..be1395003b --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/cleanup-n-child-if-deep/__snapshots__/.name-cache.json @@ -0,0 +1,33 @@ +{ + "vars": { + "props": { + "$_$": "e", + "$init": "n", + "$_template_": "t", + "$_expr_name_write_effect": "r", + "$_expr_name_write": "i", + "$_write_": "o", + "$_name_": "c", + "$_write$ifBody3": "a", + "$_setup$ifBody3": "l", + "$_ifBody3": "d", + "$_if$ifBody": "s", + "$_write$ifBody2": "u", + "$_showInner$ifBody": "b", + "$_setup$ifBody2": "m", + "$_ifBody2": "f", + "$_if$ifBody2": "D", + "$_write$ifBody": "g", + "$_showMiddle$ifBody": "v", + "$_setup$ifBody": "p", + "$_ifBody": "C", + "$_if": "_", + "$_showInner_effect": "k", + "$_showInner": "y", + "$_showMiddle_effect": "S", + "$_showMiddle": "$", + "$_showOuter_effect": "h", + "$_showOuter": "R" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/cleanup-n-child-if-deep/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/cleanup-n-child-if-deep/__snapshots__/dom.expected/template.hydrate.js index 413e236f50..cf2bbc66b5 100644 --- a/packages/translator-tags/src/__tests__/fixtures/cleanup-n-child-if-deep/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/cleanup-n-child-if-deep/__snapshots__/dom.expected/template.hydrate.js @@ -1,145 +1,155 @@ -// size: 1705 (min) 611 (brotli) - -import * as e from "@marko/runtime-tags/dom"; -import { init as n } from "@marko/runtime-tags/dom"; -const t = "
    a
    a

    a

    ", - r = "D%lD%lD%l", - i = e.effect("a0", (n) => { - const { 5: t, 6: r } = n; - r(`${t} mounted`), - (e.getAbortSignal(n, 0).onabort = ((e) => { - const { 5: n, 6: t } = e; +// size: 1617 (min) 571 (brotli) +const _template_ = "
    a
    a

    a

    ", + _expr_name_write_effect = _$.effect("a0", (_scope) => { + const { 5: name, 6: write } = _scope; + write(`${name} mounted`), + (_$.getAbortSignal(_scope, 0).onabort = ((_scope) => { + const { 5: name, 6: write } = _scope; return () => { - t(`${n} destroyed`); + write(`${name} destroyed`); }; - })(n)); + })(_scope)); }), - o = e.intersection(2, (n) => { - e.resetAbortSignal(n, 0), i(n); + _expr_name_write = _$.intersection(2, (_scope) => { + _$.resetAbortSignal(_scope, 0), _expr_name_write_effect(_scope); }), - c = e.value(6, 0, () => o), - a = e.value( + _write_ = _$.value(6, 0, () => _expr_name_write), + _name_ = _$.value( 5, - (n, t) => { - e.data(n[0], t), e.data(n[1], t), e.data(n[2], t); + (_scope, name) => { + _$.data(_scope[0], name), + _$.data(_scope[1], name), + _$.data(_scope[2], name); }, - () => o, + () => _expr_name_write, ); -e.register( +_$.register( "b0", - (e) => - function (n) { - e[3].innerHTML += "\n" + n; + (_scope) => + function (msg) { + _scope[3].innerHTML += "\n" + msg; }, ); -const d = e.dynamicClosure( +const _write$ifBody3 = _$.dynamicClosure( 8, - (e, n) => c(e[0], n), - (e) => e._._._, - () => e.inChild(0, c), + (_scope, write) => _write_(_scope[0], write), + (_scope) => _scope._._._, + () => _$.inChild(0, _write_), ), - s = (e) => { - e[0], a(e[0], "Inner"); + _setup$ifBody3 = (_scope) => { + _scope[0], _name_(_scope[0], "Inner"); }, - l = e.register( + _ifBody3 = _$.register( "b1", - e.createRenderer(`${t}`, `/${r}&`, s, () => [d]), + _$.createRenderer(`${_template_}`, "/D%lD%lD%l&", _setup$ifBody3, () => [ + _write$ifBody3, + ]), ), - u = e.conditional(1, 0), - b = e.dynamicClosure( + _if$ifBody = _$.conditional(1, 0), + _write$ifBody2 = _$.dynamicClosure( 8, - (e, n) => c(e[0], n), - (e) => e._._, - () => e.inChild(0, c), + (_scope, write) => _write_(_scope[0], write), + (_scope) => _scope._._, + () => _$.inChild(0, _write_), ), - m = e.registerSubscriber( + _showInner$ifBody = _$.registerSubscriber( "b2", - e.dynamicClosure( + _$.dynamicClosure( 7, - (e, n) => u(e, n ? l : null), - (e) => e._._, - () => u, + (_scope, showInner) => _if$ifBody(_scope, showInner ? _ifBody3 : null), + (_scope) => _scope._._, + () => _if$ifBody, ), ), - f = (e) => { - e[0], a(e[0], "Middle"); + _setup$ifBody2 = (_scope) => { + _scope[0], _name_(_scope[0], "Middle"); }, - g = e.register( + _ifBody2 = _$.register( "b3", - e.createRenderer(`
    ${t}
    `, `D/${r}&%`, f, () => [b, m]), + _$.createRenderer( + `
    ${_template_}
    `, + "D/D%lD%lD%l&%", + _setup$ifBody2, + () => [_write$ifBody2, _showInner$ifBody], + ), ), - v = e.conditional(1, 0), - $ = e.closure( + _if$ifBody2 = _$.conditional(1, 0), + _write$ifBody = _$.closure( 8, - (e, n) => c(e[0], n), + (_scope, write) => _write_(_scope[0], write), void 0, - () => e.inChild(0, c), + () => _$.inChild(0, _write_), ), - p = e.closure( + _showMiddle$ifBody = _$.closure( 6, - (e, n) => v(e, n ? g : null), + (_scope, showMiddle) => _if$ifBody2(_scope, showMiddle ? _ifBody2 : null), void 0, - () => v, + () => _if$ifBody2, ), - C = (e) => { - e[0], a(e[0], "Outer"); + _setup$ifBody = (_scope) => { + _scope[0], _name_(_scope[0], "Outer"); }, - _ = e.register( + _ifBody = _$.register( "b4", - e.createRenderer(`
    ${t}
    `, `D/${r}&%`, C, () => [$, p]), + _$.createRenderer( + `
    ${_template_}
    `, + "D/D%lD%lD%l&%", + _setup$ifBody, + () => [_write$ifBody, _showMiddle$ifBody], + ), ), - k = e.conditional(4, 0), - y = e.effect("b5", (n) => - e.on( - n[2], + _if = _$.conditional(4, 0), + _showInner_effect = _$.effect("b5", (_scope) => + _$.on( + _scope[2], "click", - ((e) => { - const { 7: n } = e; + ((_scope) => { + const { 7: showInner } = _scope; return function () { - D(e, !n); + _showInner(_scope, !showInner); }; - })(n), + })(_scope), ), ), - D = e.state( + _showInner = _$.state( 7, - (e, n) => y(e), - () => e.dynamicSubscribers(7), + (_scope, showInner) => _showInner_effect(_scope), + () => _$.dynamicSubscribers(7), ), - S = e.effect("b6", (n) => - e.on( - n[1], + _showMiddle_effect = _$.effect("b6", (_scope) => + _$.on( + _scope[1], "click", - ((e) => { - const { 6: n } = e; + ((_scope) => { + const { 6: showMiddle } = _scope; return function () { - h(e, !n); + _showMiddle(_scope, !showMiddle); }; - })(n), + })(_scope), ), ), - h = e.state( + _showMiddle = _$.state( 6, - (e, n) => S(e), - () => e.inConditionalScope(p, 4), + (_scope, showMiddle) => _showMiddle_effect(_scope), + () => _$.inConditionalScope(_showMiddle$ifBody, 4), ), - R = e.effect("b7", (n) => - e.on( - n[0], + _showOuter_effect = _$.effect("b7", (_scope) => + _$.on( + _scope[0], "click", - ((e) => { - const { 5: n } = e; + ((_scope) => { + const { 5: showOuter } = _scope; return function () { - A(e, !n); + _showOuter(_scope, !showOuter); }; - })(n), + })(_scope), ), ), - A = e.state( + _showOuter = _$.state( 5, - (e, n) => { - R(e), k(e, n ? _ : null); + (_scope, showOuter) => { + _showOuter_effect(_scope), _if(_scope, showOuter ? _ifBody : null); }, - () => k, + () => _if, ); -n(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/cleanup-n-child-if-same-scope/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/cleanup-n-child-if-same-scope/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..c03a166da0 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/cleanup-n-child-if-same-scope/__snapshots__/.name-cache.json @@ -0,0 +1,14 @@ +{ + "vars": { + "props": { + "$_$": "n", + "$init": "t", + "$_setup$ifBody_effect": "e", + "$_setup$ifBody": "r", + "$_ifBody": "o", + "$_if": "a", + "$_show_effect": "i", + "$_show": "m" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/cleanup-n-child-if-same-scope/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/cleanup-n-child-if-same-scope/__snapshots__/dom.expected/template.hydrate.js index 39e148bb8a..95399c89a7 100644 --- a/packages/translator-tags/src/__tests__/fixtures/cleanup-n-child-if-same-scope/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/cleanup-n-child-if-same-scope/__snapshots__/dom.expected/template.hydrate.js @@ -1,34 +1,31 @@ -// size: 491 (min) 270 (brotli) - -import * as n from "@marko/runtime-tags/dom"; -import { init as t } from "@marko/runtime-tags/dom"; -const e = n.effect("a0", (t) => { - (t._[1].innerHTML += "\nmounted"), - (n.getAbortSignal(t, 0).onabort = () => { - t._[1].innerHTML += "\ndestroyed"; +// size: 402 (min) 240 (brotli) +const _setup$ifBody_effect = _$.effect("a0", (_scope) => { + (_scope._[1].innerHTML += "\nmounted"), + (_$.getAbortSignal(_scope, 0).onabort = () => { + _scope._[1].innerHTML += "\ndestroyed"; }); }), - r = (t) => { - n.resetAbortSignal(t, 0), e(t); + _setup$ifBody = (_scope) => { + _$.resetAbortSignal(_scope, 0), _setup$ifBody_effect(_scope); }, - o = n.register( + _ifBody = _$.register( "a1", - n.createRenderer("
    a
    b

    c

    ", "", r), + _$.createRenderer("
    a
    b

    c

    ", "", _setup$ifBody), ), - a = n.conditional(2, 0), - i = n.effect("a2", (t) => - n.on( - t[0], + _if = _$.conditional(2, 0), + _show_effect = _$.effect("a2", (_scope) => + _$.on( + _scope[0], "click", - ((n) => { - const { 3: t } = n; + ((_scope) => { + const { 3: show } = _scope; return function () { - m(n, !t); + _show(_scope, !show); }; - })(t), + })(_scope), ), ), - m = n.state(3, (n, t) => { - i(n), a(n, t ? o : null); + _show = _$.state(3, (_scope, show) => { + _show_effect(_scope), _if(_scope, show ? _ifBody : null); }); -t(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/cleanup-n-child-if-shallow/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/cleanup-n-child-if-shallow/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..c456517296 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/cleanup-n-child-if-shallow/__snapshots__/.name-cache.json @@ -0,0 +1,16 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "e", + "$_input__effect": "r", + "$_input_": "n", + "$_write": "o", + "$_setup$ifBody": "i", + "$_ifBody": "a", + "$_if": "s", + "$_show_effect": "c", + "$_show": "m" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/cleanup-n-child-if-shallow/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/cleanup-n-child-if-shallow/__snapshots__/dom.expected/template.hydrate.js index 481f8b8759..bb63b866ac 100644 --- a/packages/translator-tags/src/__tests__/fixtures/cleanup-n-child-if-shallow/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/cleanup-n-child-if-shallow/__snapshots__/dom.expected/template.hydrate.js @@ -1,48 +1,49 @@ -// size: 620 (min) 328 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as e } from "@marko/runtime-tags/dom"; -const r = t.effect("a0", (e) => { - const { 1: r } = e; - r.write("mounted"), - (t.getAbortSignal(e, 0).onabort = ((t) => { - const { 1: e } = t; +// size: 531 (min) 293 (brotli) +const _input__effect = _$.effect("a0", (_scope) => { + const { 1: input } = _scope; + input.write("mounted"), + (_$.getAbortSignal(_scope, 0).onabort = ((_scope) => { + const { 1: input } = _scope; return () => { - e.write("destroyed"); + input.write("destroyed"); }; - })(e)); + })(_scope)); }), - n = t.value(1, (e, n) => { - t.resetAbortSignal(e, 0), r(e); + _input_ = _$.value(1, (_scope, input) => { + _$.resetAbortSignal(_scope, 0), _input__effect(_scope); }), - o = t.register( + _write = _$.register( "b0", - (t) => - function (e) { - t._[1].innerHTML = e; + (_scope) => + function (state) { + _scope._[1].innerHTML = state; }, ), - i = (t) => { - t[0], n(t[0], { write: o(t) }); + _setup$ifBody = (_scope) => { + _scope[0], _input_(_scope[0], { write: _write(_scope) }); }, - a = t.register( + _ifBody = _$.register( "b1", - t.createRenderer("
    a
    b

    c

    ", "/d&", i), + _$.createRenderer( + "
    a
    b

    c

    ", + "/d&", + _setup$ifBody, + ), ), - s = t.conditional(2, 0), - c = t.effect("b2", (e) => - t.on( - e[0], + _if = _$.conditional(2, 0), + _show_effect = _$.effect("b2", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { - const { 3: e } = t; + ((_scope) => { + const { 3: show } = _scope; return function () { - m(t, !e); + _show(_scope, !show); }; - })(e), + })(_scope), ), ), - m = t.state(3, (t, e) => { - c(t), s(t, e ? a : null); + _show = _$.state(3, (_scope, show) => { + _show_effect(_scope), _if(_scope, show ? _ifBody : null); }); -e(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-for-deep/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-for-deep/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..df07d22a52 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-for-deep/__snapshots__/.name-cache.json @@ -0,0 +1,29 @@ +{ + "vars": { + "props": { + "$_$": "e", + "$init": "i", + "$_expr_name_write_effect": "o", + "$_expr_name_write": "t", + "$_write_": "n", + "$_name_": "r", + "$_expr_outerItem_middleItem$forBody": "s", + "$_write$forBody2": "c", + "$_outerItem$forBody2": "d", + "$_middleItem$forBody": "l", + "$_params_3$forBody": "a", + "$_setup$forBody2": "v", + "$_forBody2": "u", + "$_for$forBody": "m", + "$_write$forBody": "f", + "$_outerItem$forBody": "g", + "$_items$forBody": "p", + "$_params_2$forBody": "b", + "$_setup$forBody": "h", + "$_forBody": "C", + "$_for": "D", + "$_items_effect": "S", + "$_items": "$" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-for-deep/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-for-deep/__snapshots__/dom.expected/template.hydrate.js index 27067cd40b..d24a7ed236 100644 --- a/packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-for-deep/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-for-deep/__snapshots__/dom.expected/template.hydrate.js @@ -1,123 +1,132 @@ -// size: 1355 (min) 574 (brotli) - -import * as e from "@marko/runtime-tags/dom"; -import { init as i } from "@marko/runtime-tags/dom"; -const o = "
    ", - t = e.effect("a0", (i) => { - e.getAbortSignal(i, 0).onabort = ((e) => { - const { 3: i, 4: o } = e; +// size: 1265 (min) 528 (brotli) +const _expr_name_write_effect = _$.effect("a0", (_scope) => { + _$.getAbortSignal(_scope, 0).onabort = ((_scope) => { + const { 3: name, 4: write } = _scope; return () => { - o(`destroyed ${i}`); + write(`destroyed ${name}`); }; - })(i); + })(_scope); }), - n = e.intersection(2, (i) => { - e.resetAbortSignal(i, 0), t(i); + _expr_name_write = _$.intersection(2, (_scope) => { + _$.resetAbortSignal(_scope, 0), _expr_name_write_effect(_scope); }), - r = e.value(4, 0, () => n), - s = e.value( + _write_ = _$.value(4, 0, () => _expr_name_write), + _name_ = _$.value( 3, - (i, o) => e.data(i[0], o), - () => n, + (_scope, name) => _$.data(_scope[0], name), + () => _expr_name_write, ); -e.register( +_$.register( "b0", - (e) => - function (i) { - e[1].innerHTML += "\n" + i; + (_scope) => + function (msg) { + _scope[1].innerHTML += "\n" + msg; }, ); -const c = e.intersection( +const _expr_outerItem_middleItem$forBody = _$.intersection( 2, - (e) => { + (_scope) => { const { - _: { 3: i }, - 2: o, - } = e; - s(e[0], `${i}.${o}`); + _: { 3: outerItem }, + 2: middleItem, + } = _scope; + _name_(_scope[0], `${outerItem}.${middleItem}`); }, - () => e.inChild(0, s), + () => _$.inChild(0, _name_), ), - l = e.dynamicClosure( + _write$forBody2 = _$.dynamicClosure( 4, - (e, i) => r(e[0], i), - (e) => e._._, - () => e.inChild(0, r), + (_scope, write) => _write_(_scope[0], write), + (_scope) => _scope._._, + () => _$.inChild(0, _write_), ), - a = e.closure(3, 0, void 0, () => c), - d = e.value(2, 0, () => c), - u = e.value( + _outerItem$forBody2 = _$.closure( + 3, + 0, + void 0, + () => _expr_outerItem_middleItem$forBody, + ), + _middleItem$forBody = _$.value( + 2, + 0, + () => _expr_outerItem_middleItem$forBody, + ), + _params_3$forBody = _$.value( 1, - (e, i) => d(e, i[0]), - () => d, + (_scope, _params_3) => _middleItem$forBody(_scope, _params_3[0]), + () => _middleItem$forBody, ), - v = (e) => { - e[0]; + _setup$forBody2 = (_scope) => { + _scope[0]; }, - m = e.register( + _forBody2 = _$.register( "b1", - e.createRenderer( - `
    ${o}
    `, + _$.createRenderer( + "
    ", "D/D l&", - v, - () => [l, a], - () => u, + _setup$forBody2, + () => [_write$forBody2, _outerItem$forBody2], + () => _params_3$forBody, ), ), - f = e.loopOf(1, m), - g = e.closure( + _for$forBody = _$.loopOf(1, _forBody2), + _write$forBody = _$.closure( 4, - (e, i) => r(e[0], i), + (_scope, write) => _write_(_scope[0], write), void 0, - () => e.inChild(0, r), + () => _$.inChild(0, _write_), ), - p = e.value( + _outerItem$forBody = _$.value( 3, - (e, i) => s(e[0], `${i}`), - () => e.intersections([e.inChild(0, s), e.inLoopScope(a, 1)]), + (_scope, outerItem) => _name_(_scope[0], `${outerItem}`), + () => + _$.intersections([ + _$.inChild(0, _name_), + _$.inLoopScope(_outerItem$forBody2, 1), + ]), ), - b = e.closure( + _items$forBody = _$.closure( 3, - (e, i) => f(e, [i]), + (_scope, items) => _for$forBody(_scope, [items]), void 0, - () => f, + () => _for$forBody, ), - $ = e.value( + _params_2$forBody = _$.value( 2, - (e, i) => p(e, i[0]), - () => p, + (_scope, _params_2) => _outerItem$forBody(_scope, _params_2[0]), + () => _outerItem$forBody, ), - h = (e) => { - e[0]; + _setup$forBody = (_scope) => { + _scope[0]; }, - C = e.register( + _forBody = _$.register( "b2", - e.createRenderer( - `
    ${o}
    `, + _$.createRenderer( + "
    ", "D/D l&%", - h, - () => [g, b], - () => $, + _setup$forBody, + () => [_write$forBody, _items$forBody], + () => _params_2$forBody, ), ), - D = e.loopOf(2, C), - S = e.effect("b3", (i) => - e.on( - i[0], + _for = _$.loopOf(2, _forBody), + _items_effect = _$.effect("b3", (_scope) => + _$.on( + _scope[0], "click", - ((e) => { - const { 3: i } = e; + ((_scope) => { + const { 3: items } = _scope; return function () { - k(e, i.length ? i.slice(0, -1) : [1, 2, 3]); + _items(_scope, items.length ? items.slice(0, -1) : [1, 2, 3]); }; - })(i), + })(_scope), ), ), - k = e.state( + _items = _$.state( 3, - (e, i) => { - S(e), D(e, [i]); + (_scope, items) => { + _items_effect(_scope), _for(_scope, [items]); }, - () => e.intersections([D, e.inLoopScope(b, 2)]), + () => _$.intersections([_for, _$.inLoopScope(_items$forBody, 2)]), ); -i(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-for-shallow/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-for-shallow/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..5d69a4a12f --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-for-shallow/__snapshots__/.name-cache.json @@ -0,0 +1,20 @@ +{ + "vars": { + "props": { + "$_$": "e", + "$init": "t", + "$_expr_name_write_effect": "n", + "$_expr_name_write": "o", + "$_write_": "r", + "$_name_": "i", + "$_write$forBody": "a", + "$_item$forBody": "s", + "$_params_2$forBody": "c", + "$_setup$forBody": "l", + "$_forBody": "d", + "$_for": "u", + "$_items_effect": "m", + "$_items": "f" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-for-shallow/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-for-shallow/__snapshots__/dom.expected/template.hydrate.js index 66bcf7b98f..a6d9274629 100644 --- a/packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-for-shallow/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-for-shallow/__snapshots__/dom.expected/template.hydrate.js @@ -1,80 +1,77 @@ -// size: 863 (min) 429 (brotli) - -import * as e from "@marko/runtime-tags/dom"; -import { init as t } from "@marko/runtime-tags/dom"; -const n = e.effect("a0", (t) => { - const { 3: n, 4: o } = t; - o(`mounted ${n}`), - (e.getAbortSignal(t, 0).onabort = ((e) => { - const { 3: t, 4: n } = e; +// size: 774 (min) 395 (brotli) +const _expr_name_write_effect = _$.effect("a0", (_scope) => { + const { 3: name, 4: write } = _scope; + write(`mounted ${name}`), + (_$.getAbortSignal(_scope, 0).onabort = ((_scope) => { + const { 3: name, 4: write } = _scope; return () => { - n(`destroyed ${t}`); + write(`destroyed ${name}`); }; - })(t)); + })(_scope)); }), - o = e.intersection(2, (t) => { - e.resetAbortSignal(t, 0), n(t); + _expr_name_write = _$.intersection(2, (_scope) => { + _$.resetAbortSignal(_scope, 0), _expr_name_write_effect(_scope); }), - r = e.value(4, 0, () => o), - i = e.value( + _write_ = _$.value(4, 0, () => _expr_name_write), + _name_ = _$.value( 3, - (t, n) => e.data(t[0], n), - () => o, + (_scope, name) => _$.data(_scope[0], name), + () => _expr_name_write, ); -e.register( +_$.register( "b0", - (e) => - function (t) { - e[1].innerHTML += "\n" + t; + (_scope) => + function (msg) { + _scope[1].innerHTML += "\n" + msg; }, ); -const a = e.closure( +const _write$forBody = _$.closure( 4, - (e, t) => r(e[0], t), + (_scope, write) => _write_(_scope[0], write), void 0, - () => e.inChild(0, r), + () => _$.inChild(0, _write_), ), - s = e.value( + _item$forBody = _$.value( 2, - (e, t) => i(e[0], t), - () => e.inChild(0, i), + (_scope, item) => _name_(_scope[0], item), + () => _$.inChild(0, _name_), ), - c = e.value( + _params_2$forBody = _$.value( 1, - (e, t) => s(e, t[0]), - () => s, + (_scope, _params_2) => _item$forBody(_scope, _params_2[0]), + () => _item$forBody, ), - l = (e) => { - e[0]; + _setup$forBody = (_scope) => { + _scope[0]; }, - d = e.register( + _forBody = _$.register( "b1", - e.createRenderer( + _$.createRenderer( "
    ", "/D l&", - l, - () => [a], - () => c, + _setup$forBody, + () => [_write$forBody], + () => _params_2$forBody, ), ), - u = e.loopOf(2, d), - m = e.effect("b2", (t) => - e.on( - t[0], + _for = _$.loopOf(2, _forBody), + _items_effect = _$.effect("b2", (_scope) => + _$.on( + _scope[0], "click", - ((e) => { - const { 3: t } = e; + ((_scope) => { + const { 3: items } = _scope; return function () { - f(e, t.length ? t.slice(0, -1) : [1, 2, 3]); + _items(_scope, items.length ? items.slice(0, -1) : [1, 2, 3]); }; - })(t), + })(_scope), ), ), - f = e.state( + _items = _$.state( 3, - (e, t) => { - m(e), u(e, [t]); + (_scope, items) => { + _items_effect(_scope), _for(_scope, [items]); }, - () => u, + () => _for, ); -t(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-if-deep/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-if-deep/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..536ac6b67b --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-if-deep/__snapshots__/.name-cache.json @@ -0,0 +1,32 @@ +{ + "vars": { + "props": { + "$_$": "e", + "$init": "n", + "$_expr_name_write_effect": "t", + "$_expr_name_write": "r", + "$_write_": "i", + "$_name_": "o", + "$_write$ifBody3": "c", + "$_setup$ifBody3": "l", + "$_ifBody3": "s", + "$_if$ifBody": "d", + "$_write$ifBody2": "a", + "$_showInner$ifBody": "u", + "$_setup$ifBody2": "b", + "$_ifBody2": "m", + "$_if$ifBody2": "f", + "$_write$ifBody": "g", + "$_showMiddle$ifBody": "p", + "$_setup$ifBody": "v", + "$_ifBody": "C", + "$_if": "_", + "$_showInner_effect": "k", + "$_showInner": "y", + "$_showMiddle_effect": "D", + "$_showMiddle": "S", + "$_showOuter_effect": "h", + "$_showOuter": "R" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-if-deep/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-if-deep/__snapshots__/dom.expected/template.hydrate.js index 9bb7d70dc5..8a2e08468b 100644 --- a/packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-if-deep/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-if-deep/__snapshots__/dom.expected/template.hydrate.js @@ -1,143 +1,150 @@ -// size: 1629 (min) 594 (brotli) - -import * as e from "@marko/runtime-tags/dom"; -import { init as n } from "@marko/runtime-tags/dom"; -const t = "

    ", - r = "D l", - i = e.effect("a0", (n) => { - const { 3: t, 4: r } = n; - r(`${t} mounted`), - (e.getAbortSignal(n, 0).onabort = ((e) => { - const { 3: n, 4: t } = e; +// size: 1528 (min) 542 (brotli) +const _expr_name_write_effect = _$.effect("a0", (_scope) => { + const { 3: name, 4: write } = _scope; + write(`${name} mounted`), + (_$.getAbortSignal(_scope, 0).onabort = ((_scope) => { + const { 3: name, 4: write } = _scope; return () => { - t(`${n} destroyed`); + write(`${name} destroyed`); }; - })(n)); + })(_scope)); }), - o = e.intersection(2, (n) => { - e.resetAbortSignal(n, 0), i(n); + _expr_name_write = _$.intersection(2, (_scope) => { + _$.resetAbortSignal(_scope, 0), _expr_name_write_effect(_scope); }), - c = e.value(4, 0, () => o), - s = e.value( + _write_ = _$.value(4, 0, () => _expr_name_write), + _name_ = _$.value( 3, - (n, t) => e.data(n[0], t), - () => o, + (_scope, name) => _$.data(_scope[0], name), + () => _expr_name_write, ); -e.register( +_$.register( "b0", - (e) => - function (n) { - e[3].innerHTML += "\n" + n; + (_scope) => + function (msg) { + _scope[3].innerHTML += "\n" + msg; }, ); -const d = e.dynamicClosure( +const _write$ifBody3 = _$.dynamicClosure( 8, - (e, n) => c(e[0], n), - (e) => e._._._, - () => e.inChild(0, c), + (_scope, write) => _write_(_scope[0], write), + (_scope) => _scope._._._, + () => _$.inChild(0, _write_), ), - a = (e) => { - e[0], s(e[0], "Inner"); + _setup$ifBody3 = (_scope) => { + _scope[0], _name_(_scope[0], "Inner"); }, - l = e.register( + _ifBody3 = _$.register( "b1", - e.createRenderer(`${t}`, `/${r}&`, a, () => [d]), + _$.createRenderer("

    ", "/D l&", _setup$ifBody3, () => [ + _write$ifBody3, + ]), ), - u = e.conditional(1, 0), - b = e.dynamicClosure( + _if$ifBody = _$.conditional(1, 0), + _write$ifBody2 = _$.dynamicClosure( 8, - (e, n) => c(e[0], n), - (e) => e._._, - () => e.inChild(0, c), + (_scope, write) => _write_(_scope[0], write), + (_scope) => _scope._._, + () => _$.inChild(0, _write_), ), - m = e.registerSubscriber( + _showInner$ifBody = _$.registerSubscriber( "b2", - e.dynamicClosure( + _$.dynamicClosure( 7, - (e, n) => u(e, n ? l : null), - (e) => e._._, - () => u, + (_scope, showInner) => _if$ifBody(_scope, showInner ? _ifBody3 : null), + (_scope) => _scope._._, + () => _if$ifBody, ), ), - f = (e) => { - e[0], s(e[0], "Middle"); + _setup$ifBody2 = (_scope) => { + _scope[0], _name_(_scope[0], "Middle"); }, - g = e.register( + _ifBody2 = _$.register( "b3", - e.createRenderer(`
    ${t}
    `, `D/${r}&%`, f, () => [b, m]), + _$.createRenderer( + "

    ", + "D/D l&%", + _setup$ifBody2, + () => [_write$ifBody2, _showInner$ifBody], + ), ), - v = e.conditional(1, 0), - $ = e.closure( + _if$ifBody2 = _$.conditional(1, 0), + _write$ifBody = _$.closure( 8, - (e, n) => c(e[0], n), + (_scope, write) => _write_(_scope[0], write), void 0, - () => e.inChild(0, c), + () => _$.inChild(0, _write_), ), - C = e.closure( + _showMiddle$ifBody = _$.closure( 6, - (e, n) => v(e, n ? g : null), + (_scope, showMiddle) => _if$ifBody2(_scope, showMiddle ? _ifBody2 : null), void 0, - () => v, + () => _if$ifBody2, ), - _ = (e) => { - e[0], s(e[0], "Outer"); + _setup$ifBody = (_scope) => { + _scope[0], _name_(_scope[0], "Outer"); }, - k = e.register( + _ifBody = _$.register( "b4", - e.createRenderer(`
    ${t}
    `, `D/${r}&%`, _, () => [$, C]), + _$.createRenderer( + "

    ", + "D/D l&%", + _setup$ifBody, + () => [_write$ifBody, _showMiddle$ifBody], + ), ), - p = e.conditional(4, 0), - y = e.effect("b5", (n) => - e.on( - n[2], + _if = _$.conditional(4, 0), + _showInner_effect = _$.effect("b5", (_scope) => + _$.on( + _scope[2], "click", - ((e) => { - const { 7: n } = e; + ((_scope) => { + const { 7: showInner } = _scope; return function () { - S(e, !n); + _showInner(_scope, !showInner); }; - })(n), + })(_scope), ), ), - S = e.state( + _showInner = _$.state( 7, - (e, n) => y(e), - () => e.dynamicSubscribers(7), + (_scope, showInner) => _showInner_effect(_scope), + () => _$.dynamicSubscribers(7), ), - h = e.effect("b6", (n) => - e.on( - n[1], + _showMiddle_effect = _$.effect("b6", (_scope) => + _$.on( + _scope[1], "click", - ((e) => { - const { 6: n } = e; + ((_scope) => { + const { 6: showMiddle } = _scope; return function () { - D(e, !n); + _showMiddle(_scope, !showMiddle); }; - })(n), + })(_scope), ), ), - D = e.state( + _showMiddle = _$.state( 6, - (e, n) => h(e), - () => e.inConditionalScope(C, 4), + (_scope, showMiddle) => _showMiddle_effect(_scope), + () => _$.inConditionalScope(_showMiddle$ifBody, 4), ), - R = e.effect("b7", (n) => - e.on( - n[0], + _showOuter_effect = _$.effect("b7", (_scope) => + _$.on( + _scope[0], "click", - ((e) => { - const { 5: n } = e; + ((_scope) => { + const { 5: showOuter } = _scope; return function () { - A(e, !n); + _showOuter(_scope, !showOuter); }; - })(n), + })(_scope), ), ), - A = e.state( + _showOuter = _$.state( 5, - (e, n) => { - R(e), p(e, n ? k : null); + (_scope, showOuter) => { + _showOuter_effect(_scope), _if(_scope, showOuter ? _ifBody : null); }, - () => p, + () => _if, ); -n(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-if-same-scope/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-if-same-scope/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..2b06a02d75 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-if-same-scope/__snapshots__/.name-cache.json @@ -0,0 +1,14 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "e", + "$_setup$ifBody_effect": "n", + "$_setup$ifBody": "r", + "$_ifBody": "o", + "$_if": "i", + "$_show_effect": "a", + "$_show": "m" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-if-same-scope/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-if-same-scope/__snapshots__/dom.expected/template.hydrate.js index 09864f36de..bad938cabc 100644 --- a/packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-if-same-scope/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-if-same-scope/__snapshots__/dom.expected/template.hydrate.js @@ -1,31 +1,31 @@ -// size: 473 (min) 261 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as e } from "@marko/runtime-tags/dom"; -const n = t.effect("a0", (e) => { - (e._[1].innerHTML += "\nmounted"), - (t.getAbortSignal(e, 0).onabort = () => { - e._[1].innerHTML += "\ndestroyed"; +// size: 384 (min) 224 (brotli) +const _setup$ifBody_effect = _$.effect("a0", (_scope) => { + (_scope._[1].innerHTML += "\nmounted"), + (_$.getAbortSignal(_scope, 0).onabort = () => { + _scope._[1].innerHTML += "\ndestroyed"; }); }), - r = (e) => { - t.resetAbortSignal(e, 0), n(e); + _setup$ifBody = (_scope) => { + _$.resetAbortSignal(_scope, 0), _setup$ifBody_effect(_scope); }, - o = t.register("a1", t.createRenderer("
    child
    ", "", r)), - i = t.conditional(2, 0), - a = t.effect("a2", (e) => - t.on( - e[0], + _ifBody = _$.register( + "a1", + _$.createRenderer("
    child
    ", "", _setup$ifBody), + ), + _if = _$.conditional(2, 0), + _show_effect = _$.effect("a2", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { - const { 3: e } = t; + ((_scope) => { + const { 3: show } = _scope; return function () { - m(t, !e); + _show(_scope, !show); }; - })(e), + })(_scope), ), ), - m = t.state(3, (t, e) => { - a(t), i(t, e ? o : null); + _show = _$.state(3, (_scope, show) => { + _show_effect(_scope), _if(_scope, show ? _ifBody : null); }); -e(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-if-shallow/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-if-shallow/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..923f9fb0bd --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-if-shallow/__snapshots__/.name-cache.json @@ -0,0 +1,16 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "e", + "$_input__effect": "r", + "$_input_": "n", + "$_write": "o", + "$_setup$ifBody": "i", + "$_ifBody": "a", + "$_if": "c", + "$_show_effect": "s", + "$_show": "m" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-if-shallow/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-if-shallow/__snapshots__/dom.expected/template.hydrate.js index de132585bf..14d90be790 100644 --- a/packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-if-shallow/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/cleanup-single-child-if-shallow/__snapshots__/dom.expected/template.hydrate.js @@ -1,45 +1,45 @@ -// size: 602 (min) 320 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as e } from "@marko/runtime-tags/dom"; -const r = t.effect("a0", (e) => { - const { 1: r } = e; - r.write("mounted"), - (t.getAbortSignal(e, 0).onabort = ((t) => { - const { 1: e } = t; +// size: 513 (min) 285 (brotli) +const _input__effect = _$.effect("a0", (_scope) => { + const { 1: input } = _scope; + input.write("mounted"), + (_$.getAbortSignal(_scope, 0).onabort = ((_scope) => { + const { 1: input } = _scope; return () => { - e.write("destroyed"); + input.write("destroyed"); }; - })(e)); + })(_scope)); }), - n = t.value(1, (e, n) => { - t.resetAbortSignal(e, 0), r(e); + _input_ = _$.value(1, (_scope, input) => { + _$.resetAbortSignal(_scope, 0), _input__effect(_scope); }), - o = t.register( + _write = _$.register( "b0", - (t) => - function (e) { - t._[1].innerHTML = e; + (_scope) => + function (state) { + _scope._[1].innerHTML = state; }, ), - i = (t) => { - t[0], n(t[0], { write: o(t) }); + _setup$ifBody = (_scope) => { + _scope[0], _input_(_scope[0], { write: _write(_scope) }); }, - a = t.register("b1", t.createRenderer("
    child
    ", "/b&", i)), - c = t.conditional(2, 0), - s = t.effect("b2", (e) => - t.on( - e[0], + _ifBody = _$.register( + "b1", + _$.createRenderer("
    child
    ", "/b&", _setup$ifBody), + ), + _if = _$.conditional(2, 0), + _show_effect = _$.effect("b2", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { - const { 3: e } = t; + ((_scope) => { + const { 3: show } = _scope; return function () { - m(t, !e); + _show(_scope, !show); }; - })(e), + })(_scope), ), ), - m = t.state(3, (t, e) => { - s(t), c(t, e ? a : null); + _show = _$.state(3, (_scope, show) => { + _show_effect(_scope), _if(_scope, show ? _ifBody : null); }); -e(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/component-attrs-intersection/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/component-attrs-intersection/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..817ef3911e --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/component-attrs-intersection/__snapshots__/.name-cache.json @@ -0,0 +1,12 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "o", + "$_expr_value_dummy": "n", + "$_value_": "r", + "$_count_effect": "i", + "$_count": "m" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/component-attrs-intersection/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/component-attrs-intersection/__snapshots__/dom.expected/template.hydrate.js index a385238bdb..59f4eb8ccf 100644 --- a/packages/translator-tags/src/__tests__/fixtures/component-attrs-intersection/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/component-attrs-intersection/__snapshots__/dom.expected/template.hydrate.js @@ -1,29 +1,26 @@ -// size: 333 (min) 198 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as o } from "@marko/runtime-tags/dom"; -const n = t.intersection(2, (o) => { - const { 3: n, 4: r } = o; - t.data(o[0], n); +// size: 244 (min) 161 (brotli) +const _expr_value_dummy = _$.intersection(2, (_scope) => { + const { 3: value, 4: dummy } = _scope; + _$.data(_scope[0], value); }), - r = t.value(3, 0, () => n), - i = t.effect("b0", (o) => - t.on( - o[1], + _value_ = _$.value(3, 0, () => _expr_value_dummy), + _count_effect = _$.effect("b0", (_scope) => + _$.on( + _scope[1], "click", - ((t) => { - const { 2: o } = t; + ((_scope) => { + const { 2: count } = _scope; return function () { - m(t, o + 1); + _count(_scope, count + 1); }; - })(o), + })(_scope), ), ), - m = t.state( + _count = _$.state( 2, - (t, o) => { - i(t), r(t[0], o); + (_scope, count) => { + _count_effect(_scope), _value_(_scope[0], count); }, - () => t.inChild(0, r), + () => _$.inChild(0, _value_), ); -o(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/component-attrs-static-code/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/component-attrs-static-code/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..0497ec261e --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/component-attrs-static-code/__snapshots__/.name-cache.json @@ -0,0 +1,11 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "o", + "$_expr_input_count": "r", + "$_count_effect": "e", + "$_count": "n" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/component-attrs-static-code/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/component-attrs-static-code/__snapshots__/dom.expected/template.hydrate.js index 7df94e39e1..d5c64d7aec 100644 --- a/packages/translator-tags/src/__tests__/fixtures/component-attrs-static-code/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/component-attrs-static-code/__snapshots__/dom.expected/template.hydrate.js @@ -1,30 +1,27 @@ -// size: 389 (min) 225 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as o } from "@marko/runtime-tags/dom"; -const r = t.intersection(2, (o) => { - const { 3: r, 4: e } = o; - t.data(o[1], r.format(e)); +// size: 300 (min) 185 (brotli) +const _expr_input_count = _$.intersection(2, (_scope) => { + const { 3: input, 4: count } = _scope; + _$.data(_scope[1], input.format(count)); }), - e = t.effect("a0", (o) => - t.on( - o[0], + _count_effect = _$.effect("a0", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { - const { 4: o } = t; + ((_scope) => { + const { 4: count } = _scope; return function () { - n(t, o + 1); + _count(_scope, count + 1); }; - })(o), + })(_scope), ), ), - n = t.state( + _count = _$.state( 4, - (t, o) => e(t), - () => r, + (_scope, count) => _count_effect(_scope), + () => _expr_input_count, ); -t.register("b1", function (t) { - return "$" + t.toFixed(2); +_$.register("b1", function (n) { + return "$" + n.toFixed(2); }), - t.register("b0", (t) => "$" + t.toFixed(2)), - o(); + _$.register("b0", (n) => "$" + n.toFixed(2)), + init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/const-tag-destructure/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/const-tag-destructure/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..db413faf9a --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/const-tag-destructure/__snapshots__/.name-cache.json @@ -0,0 +1,5 @@ +{ + "vars": { + "props": {} + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/const-tag/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/const-tag/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..db413faf9a --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/const-tag/__snapshots__/.name-cache.json @@ -0,0 +1,5 @@ +{ + "vars": { + "props": {} + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/controllable-checked-spread/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/controllable-checked-spread/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..bfbaa8f447 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/controllable-checked-spread/__snapshots__/.name-cache.json @@ -0,0 +1,12 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "e", + "$_input__effect": "a", + "$_input_": "r", + "$_checkedChange": "o", + "$_checked": "m" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/controllable-checked-spread/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/controllable-checked-spread/__snapshots__/dom.expected/template.hydrate.js index f36785e00f..0a481aa8b6 100644 --- a/packages/translator-tags/src/__tests__/fixtures/controllable-checked-spread/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/controllable-checked-spread/__snapshots__/dom.expected/template.hydrate.js @@ -1,23 +1,24 @@ -// size: 356 (min) 204 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as e } from "@marko/runtime-tags/dom"; -const a = t.effect("a0", (e) => t.attrsEvents(e, 0)), - r = t.value(2, (e, r) => { - t.attrs(e, 0, { type: "checkbox", ...r }), a(e); +// size: 267 (min) 173 (brotli) +const _input__effect = _$.effect("a0", (_scope) => _$.attrsEvents(_scope, 0)), + _input_ = _$.value(2, (_scope, input) => { + _$.attrs(_scope, 0, { type: "checkbox", ...input }), _input__effect(_scope); }), - o = t.register( + _checkedChange = _$.register( "b0", - (t) => - function (e) { - m(t, e); + (_scope) => + function (_new_checked) { + _checked(_scope, _new_checked); }, ), - m = t.state( + _checked = _$.state( 2, - (e, a) => { - t.data(e[1], String(a)), r(e[0], { checked: a, checkedChange: o(e) }); + (_scope, checked) => { + _$.data(_scope[1], String(checked)), + _input_(_scope[0], { + checked: checked, + checkedChange: _checkedChange(_scope), + }); }, - () => t.inChild(0, r), + () => _$.inChild(0, _input_), ); -e(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/controllable-checked-value/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/controllable-checked-value/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..9432ff80b3 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/controllable-checked-value/__snapshots__/.name-cache.json @@ -0,0 +1,12 @@ +{ + "vars": { + "props": { + "$_$": "e", + "$init": "t", + "$_checkedValueChange": "c", + "$_checkedValueChange2": "a", + "$_checkedValueChange3": "l", + "$_checkedValue": "o" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/controllable-checked-value/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/controllable-checked-value/__snapshots__/dom.expected/template.hydrate.js index d752c66359..bd710b9338 100644 --- a/packages/translator-tags/src/__tests__/fixtures/controllable-checked-value/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/controllable-checked-value/__snapshots__/dom.expected/template.hydrate.js @@ -1,37 +1,52 @@ -// size: 580 (min) 193 (brotli) - -import * as e from "@marko/runtime-tags/dom"; -import { init as t } from "@marko/runtime-tags/dom"; -const c = e.register( +// size: 491 (min) 154 (brotli) +const _checkedValueChange = _$.register( "a0", - (e) => - function (t) { - o(e, t); + (_scope) => + function (_new_checkedValue) { + _checkedValue(_scope, _new_checkedValue); }, ), - a = e.register( + _checkedValueChange2 = _$.register( "a1", - (e) => - function (t) { - o(e, t); + (_scope) => + function (_new_checkedValue2) { + _checkedValue(_scope, _new_checkedValue2); }, ), - l = e.register( + _checkedValueChange3 = _$.register( "a1", - (e) => - function (t) { - o(e, t); + (_scope) => + function (_new_checkedValue3) { + _checkedValue(_scope, _new_checkedValue3); }, ), - o = e.state(4, (t, o) => { - e.controllable_input_checkedValue(t, 0, o, c(t), "a"), - e.controllable_input_checkedValue(t, 1, o, a(t), "b"), - e.controllable_input_checkedValue(t, 2, o, l(t), "c"), - e.data(t[3], o); + _checkedValue = _$.state(4, (_scope, checkedValue) => { + _$.controllable_input_checkedValue( + _scope, + 0, + checkedValue, + _checkedValueChange(_scope), + "a", + ), + _$.controllable_input_checkedValue( + _scope, + 1, + checkedValue, + _checkedValueChange2(_scope), + "b", + ), + _$.controllable_input_checkedValue( + _scope, + 2, + checkedValue, + _checkedValueChange3(_scope), + "c", + ), + _$.data(_scope[3], checkedValue); }); -e.effect("a2", (t) => { - e.controllable_input_checkedValue_effect(t, 0), - e.controllable_input_checkedValue_effect(t, 1), - e.controllable_input_checkedValue_effect(t, 2); +_$.effect("a2", (_scope) => { + _$.controllable_input_checkedValue_effect(_scope, 0), + _$.controllable_input_checkedValue_effect(_scope, 1), + _$.controllable_input_checkedValue_effect(_scope, 2); }), - t(); + init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/controllable-checked-values-spread/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/controllable-checked-values-spread/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..9b87b411f2 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/controllable-checked-values-spread/__snapshots__/.name-cache.json @@ -0,0 +1,14 @@ +{ + "vars": { + "props": { + "$_$": "e", + "$init": "a", + "$_input__effect": "t", + "$_input_": "c", + "$_checkedValueChange": "i", + "$_checkedValueChange2": "n", + "$_checkedValueChange3": "r", + "$_checkedValue": "u" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/controllable-checked-values-spread/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/controllable-checked-values-spread/__snapshots__/dom.expected/template.hydrate.js index 139903d64d..8326488af7 100644 --- a/packages/translator-tags/src/__tests__/fixtures/controllable-checked-values-spread/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/controllable-checked-values-spread/__snapshots__/dom.expected/template.hydrate.js @@ -1,40 +1,54 @@ -// size: 623 (min) 255 (brotli) - -import * as e from "@marko/runtime-tags/dom"; -import { init as a } from "@marko/runtime-tags/dom"; -const t = e.effect("a0", (a) => e.attrsEvents(a, 0)), - c = e.value(2, (a, c) => { - e.attrs(a, 0, { type: "checkbox", ...c }), t(a); +// size: 534 (min) 214 (brotli) +const _input__effect = _$.effect("a0", (_scope) => _$.attrsEvents(_scope, 0)), + _input_ = _$.value(2, (_scope, input) => { + _$.attrs(_scope, 0, { type: "checkbox", ...input }), _input__effect(_scope); }), - i = e.register( + _checkedValueChange = _$.register( "b0", - (e) => - function (a) { - u(e, a); + (_scope) => + function (_new_checkedValue) { + _checkedValue(_scope, _new_checkedValue); }, ), - n = e.register( + _checkedValueChange2 = _$.register( "b1", - (e) => - function (a) { - u(e, a); + (_scope) => + function (_new_checkedValue2) { + _checkedValue(_scope, _new_checkedValue2); }, ), - r = e.register( + _checkedValueChange3 = _$.register( "b1", - (e) => - function (a) { - u(e, a); + (_scope) => + function (_new_checkedValue3) { + _checkedValue(_scope, _new_checkedValue3); }, ), - u = e.state( + _checkedValue = _$.state( 4, - (a, t) => { - e.data(a[3], t), - c(a[0], { checkedValue: t, checkedValueChange: i(a), value: "a" }), - c(a[1], { checkedValue: t, checkedValueChange: n(a), value: "b" }), - c(a[2], { checkedValue: t, checkedValueChange: r(a), value: "c" }); + (_scope, checkedValue) => { + _$.data(_scope[3], checkedValue), + _input_(_scope[0], { + checkedValue: checkedValue, + checkedValueChange: _checkedValueChange(_scope), + value: "a", + }), + _input_(_scope[1], { + checkedValue: checkedValue, + checkedValueChange: _checkedValueChange2(_scope), + value: "b", + }), + _input_(_scope[2], { + checkedValue: checkedValue, + checkedValueChange: _checkedValueChange3(_scope), + value: "c", + }); }, - () => e.intersections([e.inChild(0, c), e.inChild(1, c), e.inChild(2, c)]), + () => + _$.intersections([ + _$.inChild(0, _input_), + _$.inChild(1, _input_), + _$.inChild(2, _input_), + ]), ); -a(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/controllable-checked-values/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/controllable-checked-values/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..9432ff80b3 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/controllable-checked-values/__snapshots__/.name-cache.json @@ -0,0 +1,12 @@ +{ + "vars": { + "props": { + "$_$": "e", + "$init": "t", + "$_checkedValueChange": "c", + "$_checkedValueChange2": "a", + "$_checkedValueChange3": "l", + "$_checkedValue": "o" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/controllable-checked-values/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/controllable-checked-values/__snapshots__/dom.expected/template.hydrate.js index d752c66359..bd710b9338 100644 --- a/packages/translator-tags/src/__tests__/fixtures/controllable-checked-values/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/controllable-checked-values/__snapshots__/dom.expected/template.hydrate.js @@ -1,37 +1,52 @@ -// size: 580 (min) 193 (brotli) - -import * as e from "@marko/runtime-tags/dom"; -import { init as t } from "@marko/runtime-tags/dom"; -const c = e.register( +// size: 491 (min) 154 (brotli) +const _checkedValueChange = _$.register( "a0", - (e) => - function (t) { - o(e, t); + (_scope) => + function (_new_checkedValue) { + _checkedValue(_scope, _new_checkedValue); }, ), - a = e.register( + _checkedValueChange2 = _$.register( "a1", - (e) => - function (t) { - o(e, t); + (_scope) => + function (_new_checkedValue2) { + _checkedValue(_scope, _new_checkedValue2); }, ), - l = e.register( + _checkedValueChange3 = _$.register( "a1", - (e) => - function (t) { - o(e, t); + (_scope) => + function (_new_checkedValue3) { + _checkedValue(_scope, _new_checkedValue3); }, ), - o = e.state(4, (t, o) => { - e.controllable_input_checkedValue(t, 0, o, c(t), "a"), - e.controllable_input_checkedValue(t, 1, o, a(t), "b"), - e.controllable_input_checkedValue(t, 2, o, l(t), "c"), - e.data(t[3], o); + _checkedValue = _$.state(4, (_scope, checkedValue) => { + _$.controllable_input_checkedValue( + _scope, + 0, + checkedValue, + _checkedValueChange(_scope), + "a", + ), + _$.controllable_input_checkedValue( + _scope, + 1, + checkedValue, + _checkedValueChange2(_scope), + "b", + ), + _$.controllable_input_checkedValue( + _scope, + 2, + checkedValue, + _checkedValueChange3(_scope), + "c", + ), + _$.data(_scope[3], checkedValue); }); -e.effect("a2", (t) => { - e.controllable_input_checkedValue_effect(t, 0), - e.controllable_input_checkedValue_effect(t, 1), - e.controllable_input_checkedValue_effect(t, 2); +_$.effect("a2", (_scope) => { + _$.controllable_input_checkedValue_effect(_scope, 0), + _$.controllable_input_checkedValue_effect(_scope, 1), + _$.controllable_input_checkedValue_effect(_scope, 2); }), - t(); + init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/controllable-checked/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/controllable-checked/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..7cb63aed7e --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/controllable-checked/__snapshots__/.name-cache.json @@ -0,0 +1,10 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "e", + "$_checkedChange": "o", + "$_checked": "r" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/controllable-checked/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/controllable-checked/__snapshots__/dom.expected/template.hydrate.js index cfb0f605f8..47c361be93 100644 --- a/packages/translator-tags/src/__tests__/fixtures/controllable-checked/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/controllable-checked/__snapshots__/dom.expected/template.hydrate.js @@ -1,15 +1,14 @@ -// size: 292 (min) 167 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as e } from "@marko/runtime-tags/dom"; -const o = t.register( +// size: 203 (min) 138 (brotli) +const _checkedChange = _$.register( "a0", - (t) => - function (e) { - r(t, e); + (_scope) => + function (_new_checked) { + _checked(_scope, _new_checked); }, ), - r = t.state(2, (e, r) => { - t.controllable_input_checked(e, 0, r, o(e)), t.data(e[1], String(r)); + _checked = _$.state(2, (_scope, checked) => { + _$.controllable_input_checked(_scope, 0, checked, _checkedChange(_scope)), + _$.data(_scope[1], String(checked)); }); -t.effect("a1", (e) => t.controllable_input_checked_effect(e, 0)), e(); +_$.effect("a1", (_scope) => _$.controllable_input_checked_effect(_scope, 0)), + init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/controllable-input-value/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/controllable-input-value/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..85d528207f --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/controllable-input-value/__snapshots__/.name-cache.json @@ -0,0 +1,10 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "a", + "$_valueChange": "o", + "$_value": "e" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/controllable-input-value/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/controllable-input-value/__snapshots__/dom.expected/template.hydrate.js index a945c07ca2..f59127aff1 100644 --- a/packages/translator-tags/src/__tests__/fixtures/controllable-input-value/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/controllable-input-value/__snapshots__/dom.expected/template.hydrate.js @@ -1,15 +1,14 @@ -// size: 280 (min) 168 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as a } from "@marko/runtime-tags/dom"; -const o = t.register( +// size: 191 (min) 134 (brotli) +const _valueChange = _$.register( "a0", - (t) => - function (a) { - e(t, a); + (_scope) => + function (_new_value) { + _value(_scope, _new_value); }, ), - e = t.state(2, (a, e) => { - t.controllable_input_value(a, 0, e, o(a)), t.data(a[1], e); + _value = _$.state(2, (_scope, value) => { + _$.controllable_input_value(_scope, 0, value, _valueChange(_scope)), + _$.data(_scope[1], value); }); -t.effect("a1", (a) => t.controllable_input_value_effect(a, 0)), a(); +_$.effect("a1", (_scope) => _$.controllable_input_value_effect(_scope, 0)), + init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/controllable-select-dynamic-spread/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/controllable-select-dynamic-spread/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..a291f3d128 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/controllable-select-dynamic-spread/__snapshots__/.name-cache.json @@ -0,0 +1,11 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "o", + "$_setup$tagSelectBody_effect": "r", + "$_setup$tagSelectBody": "a", + "$_tagSelectBody": "e" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/controllable-select-dynamic-spread/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/controllable-select-dynamic-spread/__snapshots__/dom.expected/template.hydrate.js index 982a06fdd7..00934f96e4 100644 --- a/packages/translator-tags/src/__tests__/fixtures/controllable-select-dynamic-spread/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/controllable-select-dynamic-spread/__snapshots__/dom.expected/template.hydrate.js @@ -1,22 +1,21 @@ -// size: 403 (min) 193 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as o } from "@marko/runtime-tags/dom"; -const r = t.effect("a0", (o) => { - t.attrsEvents(o, 0), t.attrsEvents(o, 1), t.attrsEvents(o, 2); +// size: 314 (min) 165 (brotli) +const _setup$tagSelectBody_effect = _$.effect("a0", (_scope) => { + _$.attrsEvents(_scope, 0), + _$.attrsEvents(_scope, 1), + _$.attrsEvents(_scope, 2); }), - a = (o) => { - t.attrs(o, 0, { value: "a" }), - t.attrs(o, 1, { value: "b" }), - t.attrs(o, 2, { value: "c" }), - r(o); + _setup$tagSelectBody = (_scope) => { + _$.attrs(_scope, 0, { value: "a" }), + _$.attrs(_scope, 1, { value: "b" }), + _$.attrs(_scope, 2, { value: "c" }), + _setup$tagSelectBody_effect(_scope); }, - e = t.register( + _tagSelectBody = _$.register( "a1", - t.createRendererWithOwner( + _$.createRendererWithOwner( "", " b b ", - a, + _setup$tagSelectBody, ), ); -t.dynamicTagAttrs(0, e), o(); +_$.dynamicTagAttrs(0, _tagSelectBody), init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/controllable-select/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/controllable-select/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..770e2728bf --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/controllable-select/__snapshots__/.name-cache.json @@ -0,0 +1,10 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "e", + "$_valueChange": "a", + "$_value": "o" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/controllable-select/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/controllable-select/__snapshots__/dom.expected/template.hydrate.js index 5b46d8e947..f9f69dbb7d 100644 --- a/packages/translator-tags/src/__tests__/fixtures/controllable-select/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/controllable-select/__snapshots__/dom.expected/template.hydrate.js @@ -1,15 +1,14 @@ -// size: 282 (min) 165 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as e } from "@marko/runtime-tags/dom"; -const a = t.register( +// size: 193 (min) 125 (brotli) +const _valueChange = _$.register( "a0", - (t) => - function (e) { - o(t, e); + (_scope) => + function (v) { + _value(_scope, v); }, ), - o = t.state(2, (e, o) => { - t.controllable_select_value(e, 0, o, a(e)), t.data(e[1], o); + _value = _$.state(2, (_scope, value) => { + _$.controllable_select_value(_scope, 0, value, _valueChange(_scope)), + _$.data(_scope[1], value); }); -t.effect("a1", (e) => t.controllable_select_value_effect(e, 0)), e(); +_$.effect("a1", (_scope) => _$.controllable_select_value_effect(_scope, 0)), + init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/controllable-textarea-value/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/controllable-textarea-value/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..370fe935ca --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/controllable-textarea-value/__snapshots__/.name-cache.json @@ -0,0 +1,10 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "a", + "$_valueChange": "e", + "$_value": "o" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/controllable-textarea-value/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/controllable-textarea-value/__snapshots__/dom.expected/template.hydrate.js index 1da4466a7f..bf6bc19e17 100644 --- a/packages/translator-tags/src/__tests__/fixtures/controllable-textarea-value/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/controllable-textarea-value/__snapshots__/dom.expected/template.hydrate.js @@ -1,15 +1,14 @@ -// size: 286 (min) 162 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as a } from "@marko/runtime-tags/dom"; -const e = t.register( +// size: 197 (min) 119 (brotli) +const _valueChange = _$.register( "a0", - (t) => - function (a) { - o(t, a); + (_scope) => + function (_new_value) { + _value(_scope, _new_value); }, ), - o = t.state(2, (a, o) => { - t.controllable_textarea_value(a, 0, o, e(a)), t.data(a[1], o); + _value = _$.state(2, (_scope, value) => { + _$.controllable_textarea_value(_scope, 0, value, _valueChange(_scope)), + _$.data(_scope[1], value); }); -t.effect("a1", (a) => t.controllable_textarea_value_effect(a, 0)), a(); +_$.effect("a1", (_scope) => _$.controllable_textarea_value_effect(_scope, 0)), + init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/counter-intersection/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/counter-intersection/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..1120b09b4b --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/counter-intersection/__snapshots__/.name-cache.json @@ -0,0 +1,11 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "o", + "$_expr_a_b": "a", + "$_b": "n", + "$_a": "c" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/counter-intersection/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/counter-intersection/__snapshots__/dom.expected/template.hydrate.js index f9e15b7e25..b028101adc 100644 --- a/packages/translator-tags/src/__tests__/fixtures/counter-intersection/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/counter-intersection/__snapshots__/dom.expected/template.hydrate.js @@ -1,27 +1,24 @@ -// size: 353 (min) 180 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as o } from "@marko/runtime-tags/dom"; -const a = t.intersection(2, (o) => { - const { 5: a, 6: n } = o; - t.data(o[4], a + n); +// size: 264 (min) 148 (brotli) +const _expr_a_b = _$.intersection(2, (_scope) => { + const { 5: a, 6: b } = _scope; + _$.data(_scope[4], a + b); }), - n = t.state( + _b = _$.state( 6, - (o, a) => t.data(o[3], a), - () => a, + (_scope, b) => _$.data(_scope[3], b), + () => _expr_a_b, ), - c = t.state( + _a = _$.state( 5, - (o, a) => t.data(o[1], a), - () => a, + (_scope, a) => _$.data(_scope[1], a), + () => _expr_a_b, ); -t.effect("a0", (o) => { - t.on(o[0], "click", function () { - c(o, 10); +_$.effect("a0", (_scope) => { + _$.on(_scope[0], "click", function () { + _a(_scope, 10); }), - t.on(o[2], "click", function () { - n(o, 5); + _$.on(_scope[2], "click", function () { + _b(_scope, 5); }); }), - o(); + init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/create-and-clear-rows-loop-from/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/create-and-clear-rows-loop-from/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..bcc9e14da6 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/create-and-clear-rows-loop-from/__snapshots__/.name-cache.json @@ -0,0 +1,9 @@ +{ + "vars": { + "props": { + "$_$": "e", + "$_n$forBody": "a", + "$_params_2$forBody": "r" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/create-and-clear-rows-loop-from/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/create-and-clear-rows-loop-from/__snapshots__/dom.expected/template.hydrate.js index 862c6ee6f2..075244516a 100644 --- a/packages/translator-tags/src/__tests__/fixtures/create-and-clear-rows-loop-from/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/create-and-clear-rows-loop-from/__snapshots__/dom.expected/template.hydrate.js @@ -1,9 +1,9 @@ -// size: 186 (min) 135 (brotli) - -import * as e from "@marko/runtime-tags/dom"; -const a = e.value(2, (a, r) => e.data(a[0], r)), - r = e.value(1, (e, r) => a(e, r[0])); -e.register( +// size: 144 (min) 123 (brotli) +const _n$forBody = _$.value(2, (_scope, n) => _$.data(_scope[0], n)), + _params_2$forBody = _$.value(1, (_scope, _params_2) => + _n$forBody(_scope, _params_2[0]), + ); +_$.register( "a0", - e.createRenderer(", ", "%", void 0, void 0, () => r), + _$.createRenderer(", ", "%", void 0, void 0, () => _params_2$forBody), ); diff --git a/packages/translator-tags/src/__tests__/fixtures/create-and-clear-rows-loop-in/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/create-and-clear-rows-loop-in/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..d7ecbceab9 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/create-and-clear-rows-loop-in/__snapshots__/.name-cache.json @@ -0,0 +1,12 @@ +{ + "vars": { + "props": { + "$_$": "e", + "$_key$forBody2": "a", + "$_params_3$forBody": "r", + "$_text$forBody": "t", + "$_key$forBody": "d", + "$_params_2$forBody": "o" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/create-and-clear-rows-loop-in/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/create-and-clear-rows-loop-in/__snapshots__/dom.expected/template.hydrate.js index 87a1b27be4..f9aa3c9392 100644 --- a/packages/translator-tags/src/__tests__/fixtures/create-and-clear-rows-loop-in/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/create-and-clear-rows-loop-in/__snapshots__/dom.expected/template.hydrate.js @@ -1,18 +1,24 @@ -// size: 396 (min) 185 (brotli) - -import * as e from "@marko/runtime-tags/dom"; -const a = e.value(2, (a, r) => e.data(a[0], r)), - r = e.value(1, (e, r) => a(e, r[0])); -e.register( +// size: 354 (min) 156 (brotli) +const _key$forBody2 = _$.value(2, (_scope, key) => _$.data(_scope[0], key)), + _params_3$forBody = _$.value(1, (_scope, _params_3) => + _key$forBody2(_scope, _params_3[0]), + ); +_$.register( "a0", - e.createRenderer("

    ", "D ", void 0, void 0, () => r), + _$.createRenderer("

    ", "D ", void 0, void 0, () => _params_3$forBody), ); -const t = e.value(4, (a, r) => e.data(a[1], r)), - d = e.value(3, (a, r) => e.data(a[0], r)), - o = e.value(2, (e, a) => { - d(e, a[0]), t(e, a[1]); +const _text$forBody = _$.value(4, (_scope, text) => _$.data(_scope[1], text)), + _key$forBody = _$.value(3, (_scope, key) => _$.data(_scope[0], key)), + _params_2$forBody = _$.value(2, (_scope, _params_2) => { + _key$forBody(_scope, _params_2[0]), _text$forBody(_scope, _params_2[1]); }); -e.register( +_$.register( "a1", - e.createRenderer("

    :

    ", "D%c%", void 0, void 0, () => o), + _$.createRenderer( + "

    :

    ", + "D%c%", + void 0, + void 0, + () => _params_2$forBody, + ), ); diff --git a/packages/translator-tags/src/__tests__/fixtures/custom-tag-child-analyze/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/custom-tag-child-analyze/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..db413faf9a --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/custom-tag-child-analyze/__snapshots__/.name-cache.json @@ -0,0 +1,5 @@ +{ + "vars": { + "props": {} + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/custom-tag-default-value/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/custom-tag-default-value/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..db413faf9a --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/custom-tag-default-value/__snapshots__/.name-cache.json @@ -0,0 +1,5 @@ +{ + "vars": { + "props": {} + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/custom-tag-parameters-from-args/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/custom-tag-parameters-from-args/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..fbe05724a9 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/custom-tag-parameters-from-args/__snapshots__/.name-cache.json @@ -0,0 +1,17 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "e", + "$_inputRenderBody_input": "a", + "$_expr_Text_x_y": "i", + "$_expr_x_y_effect": "n", + "$_expr_x_y": "o", + "$_y": "r", + "$_x": "s", + "$_count2$customTagBody": "c", + "$_count$customTagBody": "d", + "$_params_2$customTagBody": "m" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/custom-tag-parameters-from-args/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/custom-tag-parameters-from-args/__snapshots__/dom.expected/template.hydrate.js index 105b45c38c..a97b31fb10 100644 --- a/packages/translator-tags/src/__tests__/fixtures/custom-tag-parameters-from-args/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/custom-tag-parameters-from-args/__snapshots__/dom.expected/template.hydrate.js @@ -1,54 +1,56 @@ -// size: 690 (min) 338 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as e } from "@marko/runtime-tags/dom"; -const a = t.dynamicTagAttrs(3, void 0, 1), - i = t.intersection( +// size: 601 (min) 301 (brotli) +const _inputRenderBody_input = _$.dynamicTagAttrs(3, void 0, 1), + _expr_Text_x_y = _$.intersection( 3, - (t) => { - const { 6: e, 7: i } = t; - a(t, () => [e, i]); + (_scope) => { + const { 6: x, 7: y } = _scope; + _inputRenderBody_input(_scope, () => [x, y]); }, - () => a, + () => _inputRenderBody_input, ), - n = t.effect("a0", (e) => - t.on( - e[0], + _expr_x_y_effect = _$.effect("a0", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { - const { 6: e, 7: a } = t; + ((_scope) => { + const { 6: x, 7: y } = _scope; return function () { - s(t, e + 1), r(t, a + 1); + _x(_scope, x + 1), _y(_scope, y + 1); }; - })(e), + })(_scope), ), ), - o = t.intersection(2, (t) => { - n(t); + _expr_x_y = _$.intersection(2, (_scope) => { + _expr_x_y_effect(_scope); }), - r = t.state( + _y = _$.state( 7, - (e, a) => t.data(e[2], a), - () => t.intersections([o, i]), + (_scope, y) => _$.data(_scope[2], y), + () => _$.intersections([_expr_x_y, _expr_Text_x_y]), ), - s = t.state( + _x = _$.state( 6, - (e, a) => t.data(e[1], a), - () => t.intersections([o, i]), + (_scope, x) => _$.data(_scope[1], x), + () => _$.intersections([_expr_x_y, _expr_Text_x_y]), ), - c = t.value(4, (e, a) => t.data(e[1], a)), - d = t.value(3, (e, a) => t.data(e[0], a)), - m = t.value(2, (t, e) => { - d(t, e[0]), c(t, e[1]); + _count2$customTagBody = _$.value(4, (_scope, count2) => + _$.data(_scope[1], count2), + ), + _count$customTagBody = _$.value(3, (_scope, count) => + _$.data(_scope[0], count), + ), + _params_2$customTagBody = _$.value(2, (_scope, _params_2) => { + _count$customTagBody(_scope, _params_2[0]), + _count2$customTagBody(_scope, _params_2[1]); }); -t.register( +_$.register( "b0", - t.createRendererWithOwner( + _$.createRendererWithOwner( "
    Counts: ,
    ", "Db%c%", void 0, void 0, - () => m, + () => _params_2$customTagBody, ), ), - e(); + init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/custom-tag-parameters-from-attributes/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/custom-tag-parameters-from-attributes/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..5d864937dd --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/custom-tag-parameters-from-attributes/__snapshots__/.name-cache.json @@ -0,0 +1,16 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "a", + "$_inputRenderBody_input": "e", + "$_expr_Text_input_x": "n", + "$_x_effect": "o", + "$_x": "r", + "$_name$customTagBody": "i", + "$_count$customTagBody": "m", + "$_pattern_$customTagBody": "c", + "$_params_2$customTagBody": "d" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/custom-tag-parameters-from-attributes/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/custom-tag-parameters-from-attributes/__snapshots__/dom.expected/template.hydrate.js index 6bebd7ce17..ea5ebb76b6 100644 --- a/packages/translator-tags/src/__tests__/fixtures/custom-tag-parameters-from-attributes/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/custom-tag-parameters-from-attributes/__snapshots__/dom.expected/template.hydrate.js @@ -1,49 +1,51 @@ -// size: 612 (min) 331 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as a } from "@marko/runtime-tags/dom"; -const e = t.dynamicTagAttrs(2), - n = t.intersection( +// size: 523 (min) 296 (brotli) +const _inputRenderBody_input = _$.dynamicTagAttrs(2), + _expr_Text_input_x = _$.intersection( 3, - (t) => { - const { 4: a, 5: n } = t; - e(t, () => ({ count: n, name: a.name })); + (_scope) => { + const { 4: input, 5: x } = _scope; + _inputRenderBody_input(_scope, () => ({ count: x, name: input.name })); }, - () => e, + () => _inputRenderBody_input, ), - o = t.effect("a0", (a) => - t.on( - a[0], + _x_effect = _$.effect("a0", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { - const { 5: a } = t; + ((_scope) => { + const { 5: x } = _scope; return function () { - r(t, a + 1); + _x(_scope, x + 1); }; - })(a), + })(_scope), ), ), - r = t.state( + _x = _$.state( 5, - (a, e) => { - t.data(a[1], e), o(a); + (_scope, x) => { + _$.data(_scope[1], x), _x_effect(_scope); }, - () => n, + () => _expr_Text_input_x, ), - i = t.value(5, (a, e) => t.data(a[0], e)), - m = t.value(4, (a, e) => t.data(a[1], e)), - c = t.value(3, (t, a) => { - m(t, a.count), i(t, a.name); + _name$customTagBody = _$.value(5, (_scope, name) => _$.data(_scope[0], name)), + _count$customTagBody = _$.value(4, (_scope, count) => + _$.data(_scope[1], count), + ), + _pattern_$customTagBody = _$.value(3, (_scope, _pattern_) => { + _count$customTagBody(_scope, _pattern_.count), + _name$customTagBody(_scope, _pattern_.name); }), - d = t.value(2, (t, a) => c(t, a[0])); -t.register( + _params_2$customTagBody = _$.value(2, (_scope, _params_2) => + _pattern_$customTagBody(_scope, _params_2[0]), + ); +_$.register( "b0", - t.createRendererWithOwner( + _$.createRendererWithOwner( "
    Count ():
    ", "Db%c%", void 0, void 0, - () => d, + () => _params_2$customTagBody, ), ), - a(); + init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/custom-tag-parameters-from-single-arg/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/custom-tag-parameters-from-single-arg/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..a8d05b05a7 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/custom-tag-parameters-from-single-arg/__snapshots__/.name-cache.json @@ -0,0 +1,14 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "e", + "$_inputRenderBody_input": "r", + "$_expr_Text_x": "o", + "$_x_effect": "a", + "$_x": "i", + "$_count$customTagBody": "n", + "$_params_2$customTagBody": "m" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/custom-tag-parameters-from-single-arg/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/custom-tag-parameters-from-single-arg/__snapshots__/dom.expected/template.hydrate.js index e605d6d7fd..5979483cb2 100644 --- a/packages/translator-tags/src/__tests__/fixtures/custom-tag-parameters-from-single-arg/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/custom-tag-parameters-from-single-arg/__snapshots__/dom.expected/template.hydrate.js @@ -1,45 +1,46 @@ -// size: 492 (min) 285 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as e } from "@marko/runtime-tags/dom"; -const r = t.dynamicTagAttrs(2), - o = t.intersection( +// size: 403 (min) 248 (brotli) +const _inputRenderBody_input = _$.dynamicTagAttrs(2), + _expr_Text_x = _$.intersection( 2, - (t) => { - const { 5: e } = t; - r(t, () => e); + (_scope) => { + const { 5: x } = _scope; + _inputRenderBody_input(_scope, () => x); }, - () => r, + () => _inputRenderBody_input, ), - a = t.effect("a0", (e) => - t.on( - e[0], + _x_effect = _$.effect("a0", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { - const { 5: e } = t; + ((_scope) => { + const { 5: x } = _scope; return function () { - i(t, e + 1); + _x(_scope, x + 1); }; - })(e), + })(_scope), ), ), - i = t.state( + _x = _$.state( 5, - (e, r) => { - t.data(e[1], r), a(e); + (_scope, x) => { + _$.data(_scope[1], x), _x_effect(_scope); }, - () => o, + () => _expr_Text_x, ), - n = t.value(2, (e, r) => t.data(e[0], r)), - m = t.value(1, (t, e) => n(t, e[0])); -t.register( + _count$customTagBody = _$.value(2, (_scope, count) => + _$.data(_scope[0], count), + ), + _params_2$customTagBody = _$.value(1, (_scope, _params_2) => + _count$customTagBody(_scope, _params_2[0]), + ); +_$.register( "b0", - t.createRendererWithOwner( + _$.createRendererWithOwner( "
    Count:
    ", "Db%", void 0, void 0, - () => m, + () => _params_2$customTagBody, ), ), - e(); + init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/custom-tag-render-body/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/custom-tag-render-body/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..88d014a716 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/custom-tag-render-body/__snapshots__/.name-cache.json @@ -0,0 +1,7 @@ +{ + "vars": { + "props": { + "$_$": "e" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/custom-tag-render-body/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/custom-tag-render-body/__snapshots__/dom.expected/template.hydrate.js index 8d6fda3495..a6279fe43f 100644 --- a/packages/translator-tags/src/__tests__/fixtures/custom-tag-render-body/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/custom-tag-render-body/__snapshots__/dom.expected/template.hydrate.js @@ -1,5 +1,3 @@ -// size: 137 (min) 100 (brotli) - -import * as e from "@marko/runtime-tags/dom"; -e.dynamicTagAttrs(1), - e.register("b0", e.createRendererWithOwner("This is the body content", "")); +// size: 95 (min) 73 (brotli) +_$.dynamicTagAttrs(1), + _$.register("b0", _$.createRendererWithOwner("This is the body content", "")); diff --git a/packages/translator-tags/src/__tests__/fixtures/custom-tag-template/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/custom-tag-template/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..db413faf9a --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/custom-tag-template/__snapshots__/.name-cache.json @@ -0,0 +1,5 @@ +{ + "vars": { + "props": {} + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/custom-tag-var-expression/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/custom-tag-var-expression/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..b1b8ef4241 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/custom-tag-var-expression/__snapshots__/.name-cache.json @@ -0,0 +1,7 @@ +{ + "vars": { + "props": { + "$_$": "a" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/custom-tag-var-expression/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/custom-tag-var-expression/__snapshots__/dom.expected/template.hydrate.js index c1f1f4916c..e26fa27cc3 100644 --- a/packages/translator-tags/src/__tests__/fixtures/custom-tag-var-expression/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/custom-tag-var-expression/__snapshots__/dom.expected/template.hydrate.js @@ -1,7 +1,5 @@ -// size: 105 (min) 91 (brotli) - -import * as a from "@marko/runtime-tags/dom"; -a.registerBoundSignal( +// size: 63 (min) 67 (brotli) +_$.registerBoundSignal( "b0", - a.value(2, (r, m) => a.data(r[1], m)), + _$.value(2, (_scope, data) => _$.data(_scope[1], data)), ); diff --git a/packages/translator-tags/src/__tests__/fixtures/custom-tag-var-multiple/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/custom-tag-var-multiple/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..b1b8ef4241 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/custom-tag-var-multiple/__snapshots__/.name-cache.json @@ -0,0 +1,7 @@ +{ + "vars": { + "props": { + "$_$": "a" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/custom-tag-var-multiple/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/custom-tag-var-multiple/__snapshots__/dom.expected/template.hydrate.js index c1f1f4916c..e26fa27cc3 100644 --- a/packages/translator-tags/src/__tests__/fixtures/custom-tag-var-multiple/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/custom-tag-var-multiple/__snapshots__/dom.expected/template.hydrate.js @@ -1,7 +1,5 @@ -// size: 105 (min) 91 (brotli) - -import * as a from "@marko/runtime-tags/dom"; -a.registerBoundSignal( +// size: 63 (min) 67 (brotli) +_$.registerBoundSignal( "b0", - a.value(2, (r, m) => a.data(r[1], m)), + _$.value(2, (_scope, data) => _$.data(_scope[1], data)), ); diff --git a/packages/translator-tags/src/__tests__/fixtures/custom-tag-var/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/custom-tag-var/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..c821928dca --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/custom-tag-var/__snapshots__/.name-cache.json @@ -0,0 +1,10 @@ +{ + "vars": { + "props": { + "$_$": "a", + "$init": "t", + "$_x_effect": "r", + "$_x": "o" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/custom-tag-var/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/custom-tag-var/__snapshots__/dom.expected/template.hydrate.js index 1a7a2b296f..11a3e23a18 100644 --- a/packages/translator-tags/src/__tests__/fixtures/custom-tag-var/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/custom-tag-var/__snapshots__/dom.expected/template.hydrate.js @@ -1,28 +1,25 @@ -// size: 339 (min) 195 (brotli) - -import * as a from "@marko/runtime-tags/dom"; -import { init as t } from "@marko/runtime-tags/dom"; -const r = a.effect("a0", (t) => - a.on( - t[0], +// size: 250 (min) 155 (brotli) +const _x_effect = _$.effect("a0", (_scope) => + _$.on( + _scope[0], "click", - ((a) => { - const { 2: t } = a; + ((_scope) => { + const { 2: x } = _scope; return function () { - o(a, t + 1); + _x(_scope, x + 1); }; - })(t), + })(_scope), ), ), - o = a.state( + _x = _$.state( 2, - (t, o) => { - a.data(t[1], o), r(t), a.tagVarSignal(t, o); + (_scope, x) => { + _$.data(_scope[1], x), _x_effect(_scope), _$.tagVarSignal(_scope, x); }, - () => a.tagVarSignal, + () => _$.tagVarSignal, ); -a.registerBoundSignal( +_$.registerBoundSignal( "b0", - a.value(2, (t, r) => a.data(t[1], r)), + _$.value(2, (_scope, data) => _$.data(_scope[1], data)), ), - t(); + init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/define-tag-for-attribute-tag/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/define-tag-for-attribute-tag/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..653eb2e0c5 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/define-tag-for-attribute-tag/__snapshots__/.name-cache.json @@ -0,0 +1,15 @@ +{ + "vars": { + "props": { + "$_$": "e", + "$init": "t", + "$_inputThingRenderBody_input": "n", + "$_dynamicTagName": "r", + "$_input_": "i", + "$_defineBody": "o", + "$_myThing": "a", + "$_selected_effect": "s", + "$_selected": "c" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/define-tag-for-attribute-tag/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/define-tag-for-attribute-tag/__snapshots__/dom.expected/template.hydrate.js index 596d66c9d7..c1698607b8 100644 --- a/packages/translator-tags/src/__tests__/fixtures/define-tag-for-attribute-tag/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/define-tag-for-attribute-tag/__snapshots__/dom.expected/template.hydrate.js @@ -1,44 +1,48 @@ -// size: 569 (min) 310 (brotli) - -import * as e from "@marko/runtime-tags/dom"; -import { init as t } from "@marko/runtime-tags/dom"; -const n = e.dynamicTagAttrs(1), - r = e.conditional( +// size: 480 (min) 275 (brotli) +const _inputThingRenderBody_input = _$.dynamicTagAttrs(1), + _dynamicTagName = _$.conditional( 1, - (e) => n(e, () => ({})), - () => n, + (_scope) => _inputThingRenderBody_input(_scope, () => ({})), + () => _inputThingRenderBody_input, ), - i = e.value( + _input_ = _$.value( 3, - (t, n) => { - e.classAttr(t[0], { selected: n.thing.selected }), - r(t, n.thing.renderBody); + (_scope, input) => { + _$.classAttr(_scope[0], { selected: input.thing.selected }), + _dynamicTagName(_scope, input.thing.renderBody); }, - () => r, + () => _dynamicTagName, ), - o = e.register("b0", e.createRendererWithOwner("The thing", "")), - a = e.value( + _defineBody = _$.register( + "b0", + _$.createRendererWithOwner("The thing", ""), + ), + _myThing = _$.value( 3, - (e, t) => i(e[0], { thing: t }), - () => e.inChild(0, i), + (_scope, myThing) => _input_(_scope[0], { thing: myThing }), + () => _$.inChild(0, _input_), ), - s = e.effect("b1", (t) => - e.on( - t[1], + _selected_effect = _$.effect("b1", (_scope) => + _$.on( + _scope[1], "click", - ((e) => { - const { 2: t } = e; + ((_scope) => { + const { 2: selected } = _scope; return function () { - c(e, !t); + _selected(_scope, !selected); }; - })(t), + })(_scope), ), ), - c = e.state( + _selected = _$.state( 2, - (e, t) => { - s(e), a(e, { selected: t, renderBody: o(e) }); + (_scope, selected) => { + _selected_effect(_scope), + _myThing(_scope, { + selected: selected, + renderBody: _defineBody(_scope), + }); }, - () => a, + () => _myThing, ); -t(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/define-tag-object/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/define-tag-object/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..5547c0d739 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/define-tag-object/__snapshots__/.name-cache.json @@ -0,0 +1,11 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "o", + "$_myObj": "a", + "$_x_effect": "r", + "$_x": "m" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/define-tag-object/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/define-tag-object/__snapshots__/dom.expected/template.hydrate.js index d2fb3d0073..f3d5be1b9e 100644 --- a/packages/translator-tags/src/__tests__/fixtures/define-tag-object/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/define-tag-object/__snapshots__/dom.expected/template.hydrate.js @@ -1,21 +1,22 @@ -// size: 309 (min) 190 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as o } from "@marko/runtime-tags/dom"; -const a = t.value(4, (o, a) => t.data(o[0], JSON.stringify(a))), - r = t.effect("a0", (o) => - t.on( - o[1], +// size: 220 (min) 154 (brotli) +const _myObj = _$.value(4, (_scope, myObj) => + _$.data(_scope[0], JSON.stringify(myObj)), + ), + _x_effect = _$.effect("a0", (_scope) => + _$.on( + _scope[1], "click", - ((t) => { - const { 3: o } = t; + ((_scope) => { + const { 3: x } = _scope; return function () { - m(t, o + 1); + _x(_scope, x + 1); }; - })(o), + })(_scope), ), ), - m = t.state(3, (o, m) => { - t.data(o[2], m), r(o), a(o, { foo: 1, bar: m + 1 }); + _x = _$.state(3, (_scope, x) => { + _$.data(_scope[2], x), + _x_effect(_scope), + _myObj(_scope, { foo: 1, bar: x + 1 }); }); -o(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/define-tag-render/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/define-tag-render/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..2cd81bdb28 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/define-tag-render/__snapshots__/.name-cache.json @@ -0,0 +1,14 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "a", + "$_y$defineBody_effect": "e", + "$_y$defineBody": "r", + "$_name$defineBody": "o", + "$_pattern_$defineBody": "n", + "$_params_2$defineBody": "i", + "$_setup$defineBody": "m" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/define-tag-render/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/define-tag-render/__snapshots__/dom.expected/template.hydrate.js index 6eb337ef5f..c52243cb02 100644 --- a/packages/translator-tags/src/__tests__/fixtures/define-tag-render/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/define-tag-render/__snapshots__/dom.expected/template.hydrate.js @@ -1,37 +1,38 @@ -// size: 506 (min) 293 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as a } from "@marko/runtime-tags/dom"; -const e = t.effect("a0", (a) => - t.on( - a[2], +// size: 417 (min) 250 (brotli) +const _y$defineBody_effect = _$.effect("a0", (_scope) => + _$.on( + _scope[2], "click", - ((t) => { - const { 7: a } = t; + ((_scope) => { + const { 7: y } = _scope; return function () { - r(t, a + 1); + _y$defineBody(_scope, y + 1); }; - })(a), + })(_scope), ), ), - r = t.state(7, (a, r) => { - t.data(a[1], r), t.data(a[3], r), e(a); + _y$defineBody = _$.state(7, (_scope, y) => { + _$.data(_scope[1], y), _$.data(_scope[3], y), _y$defineBody_effect(_scope); }), - o = t.value(6, (a, e) => t.data(a[0], e)), - n = t.value(5, (t, a) => o(t, a.name)), - i = t.value(4, (t, a) => n(t, a[0])), - m = (t) => { - r(t, 1); + _name$defineBody = _$.value(6, (_scope, name) => _$.data(_scope[0], name)), + _pattern_$defineBody = _$.value(5, (_scope, _pattern_) => + _name$defineBody(_scope, _pattern_.name), + ), + _params_2$defineBody = _$.value(4, (_scope, _params_2) => + _pattern_$defineBody(_scope, _params_2[0]), + ), + _setup$defineBody = (_scope) => { + _y$defineBody(_scope, 1); }; -t.register( +_$.register( "a1", - t.createRendererWithOwner( + _$.createRendererWithOwner( "
    Hello
    ", "Db%c%l D ", - m, + _setup$defineBody, void 0, - () => i, + () => _params_2$defineBody, ), ), - t.dynamicTagAttrs(0), - a(); + _$.dynamicTagAttrs(0), + init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/do-tag/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/do-tag/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..e8f02feab6 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/do-tag/__snapshots__/.name-cache.json @@ -0,0 +1,10 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "r", + "$log": "e", + "$_logOutput": "o" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/do-tag/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/do-tag/__snapshots__/dom.expected/template.hydrate.js index fe8720e0fb..d510b88b11 100644 --- a/packages/translator-tags/src/__tests__/fixtures/do-tag/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/do-tag/__snapshots__/dom.expected/template.hydrate.js @@ -1,17 +1,15 @@ -// size: 311 (min) 175 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as r } from "@marko/runtime-tags/dom"; -import e from "./test-log"; -t.register("a1", function () { - e.static += "rendered"; +// size: 196 (min) 119 (brotli) +_$.register("a1", function () { + log.static += "rendered"; }), - t.register( + _$.register( "a0", - (t) => + (_scope) => function () { - e.const += "rendered"; + log.const += "rendered"; }, ); -const o = t.state(3, (r, e) => t.data(r[0], e)); -t.effect("a2", (t) => o(t, JSON.stringify(e))), r(); +const _logOutput = _$.state(3, (_scope, logOutput) => + _$.data(_scope[0], logOutput), +); +_$.effect("a2", (_scope) => _logOutput(_scope, JSON.stringify(log))), init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/dollar-global-client/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/dollar-global-client/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..ed0fc6f070 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/dollar-global-client/__snapshots__/.name-cache.json @@ -0,0 +1,16 @@ +{ + "vars": { + "props": { + "$_$": "a", + "$init": "e", + "$_setup$ifBody2": "n", + "$_ifBody2": "t", + "$_setup$ifBody": "r", + "$_ifBody": "o", + "$_if2": "s", + "$_if": "i", + "$_show_effect": "l", + "$_show": "c" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/dollar-global-client/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/dollar-global-client/__snapshots__/dom.expected/template.hydrate.js index ce3025cff6..4395affd4f 100644 --- a/packages/translator-tags/src/__tests__/fixtures/dollar-global-client/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/dollar-global-client/__snapshots__/dom.expected/template.hydrate.js @@ -1,33 +1,35 @@ -// size: 488 (min) 250 (brotli) - -import * as a from "@marko/runtime-tags/dom"; -import { init as e } from "@marko/runtime-tags/dom"; -const n = (e) => { - a.data(e[0], e.$global.x); +// size: 399 (min) 215 (brotli) +const _setup$ifBody2 = (_scope) => { + _$.data(_scope[0], _scope.$global.x); }, - t = a.register( + _ifBody2 = _$.register( "a0", - a.createRenderer("", "D ", n), + _$.createRenderer("", "D ", _setup$ifBody2), ), - r = (e) => { - a.data(e[0], e.$global.x); + _setup$ifBody = (_scope) => { + _$.data(_scope[0], _scope.$global.x); }, - o = a.register("a1", a.createRenderer(" ", "D ", r)), - s = a.conditional(1, 0), - i = a.conditional(0, 0), - l = a.effect("a2", (e) => - a.on( - e[2], + _ifBody = _$.register( + "a1", + _$.createRenderer(" ", "D ", _setup$ifBody), + ), + _if2 = _$.conditional(1, 0), + _if = _$.conditional(0, 0), + _show_effect = _$.effect("a2", (_scope) => + _$.on( + _scope[2], "click", - ((a) => { - const { 3: e } = a; + ((_scope) => { + const { 3: show } = _scope; return function () { - c(a, !e); + _show(_scope, !show); }; - })(e), + })(_scope), ), ), - c = a.state(3, (a, e) => { - l(a), i(a, e ? o : null), s(a, e ? null : t); + _show = _$.state(3, (_scope, show) => { + _show_effect(_scope), + _if(_scope, show ? _ifBody : null), + _if2(_scope, show ? null : _ifBody2); }); -e(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/dynamic-closures/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/dynamic-closures/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..d7a76312be --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/dynamic-closures/__snapshots__/.name-cache.json @@ -0,0 +1,12 @@ +{ + "vars": { + "props": { + "$_$": "r", + "$init": "e", + "$_c$customTagBody": "t", + "$_b$customTagBody": "a", + "$_setup$customTagBody": "i", + "$_c": "c" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/dynamic-closures/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/dynamic-closures/__snapshots__/dom.expected/template.hydrate.js index 3aff77eade..cd15a74416 100644 --- a/packages/translator-tags/src/__tests__/fixtures/dynamic-closures/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/dynamic-closures/__snapshots__/dom.expected/template.hydrate.js @@ -1,32 +1,34 @@ -// size: 534 (min) 248 (brotli) - -import * as r from "@marko/runtime-tags/dom"; -import { init as e } from "@marko/runtime-tags/dom"; -r.dynamicTagAttrs(0); -r.registerSubscriber( +// size: 445 (min) 212 (brotli) +_$.dynamicTagAttrs(0); +_$.registerSubscriber( "b0", - r.dynamicClosure( + _$.dynamicClosure( 4, - (e, t) => r.data(e[2], t), - (r) => r._._, + (_scope, c) => _$.data(_scope[2], c), + (_scope) => _scope._._, ), ); -const t = r.registerSubscriber( +const _c$customTagBody = _$.registerSubscriber( "b1", - r.dynamicClosure(4, (e, t) => r.data(e[2], t)), + _$.dynamicClosure(4, (_scope, c) => _$.data(_scope[2], c)), ), - a = r.dynamicClosure(3, (e, t) => r.data(e[1], t)), - i = (e) => { - r.data(e[0], 1); + _b$customTagBody = _$.dynamicClosure(3, (_scope, b) => _$.data(_scope[1], b)), + _setup$customTagBody = (_scope) => { + _$.data(_scope[0], 1); }; -r.register( +_$.register( "b2", - r.createRendererWithOwner(" ", "%c%c%", i, () => [t, a]), + _$.createRendererWithOwner( + " ", + "%c%c%", + _setup$customTagBody, + () => [_c$customTagBody, _b$customTagBody], + ), ); -const c = r.state(4, 0, () => r.dynamicSubscribers(4)); -r.effect("b3", (e) => - r.on(e[0], "click", function () { - c(e, 4); +const _c = _$.state(4, 0, () => _$.dynamicSubscribers(4)); +_$.effect("b3", (_scope) => + _$.on(_scope[0], "click", function () { + _c(_scope, 4); }), ), - e(); + init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/dynamic-event-handlers/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/dynamic-event-handlers/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..c83864a1ac --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/dynamic-event-handlers/__snapshots__/.name-cache.json @@ -0,0 +1,10 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "o", + "$_clickCount_effect": "m", + "$_clickCount": "r" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/dynamic-event-handlers/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/dynamic-event-handlers/__snapshots__/dom.expected/template.hydrate.js index 669f81f53b..8189976c61 100644 --- a/packages/translator-tags/src/__tests__/fixtures/dynamic-event-handlers/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/dynamic-event-handlers/__snapshots__/dom.expected/template.hydrate.js @@ -1,22 +1,19 @@ -// size: 249 (min) 159 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as o } from "@marko/runtime-tags/dom"; -const m = t.effect("a0", (o) => { - const { 2: m } = o; - t.on( - o[0], +// size: 160 (min) 122 (brotli) +const _clickCount_effect = _$.effect("a0", (_scope) => { + const { 2: clickCount } = _scope; + _$.on( + _scope[0], "click", - m <= 1 && - ((t) => { - const { 2: o } = t; + clickCount <= 1 && + ((_scope) => { + const { 2: clickCount } = _scope; return () => { - r(t, o + 1); + _clickCount(_scope, clickCount + 1); }; - })(o), + })(_scope), ); }), - r = t.state(2, (o, r) => { - t.data(o[1], r), m(o); + _clickCount = _$.state(2, (_scope, clickCount) => { + _$.data(_scope[1], clickCount), _clickCount_effect(_scope); }); -o(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/dynamic-native-dynamic-tag/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/dynamic-native-dynamic-tag/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..0b5274af08 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/dynamic-native-dynamic-tag/__snapshots__/.name-cache.json @@ -0,0 +1,14 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "n", + "$_tagNameBody": "o", + "$_tagName_input": "r", + "$_expr_Text_className": "e", + "$_dynamicTagName": "a", + "$_tagName_effect": "i", + "$_tagName": "s" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/dynamic-native-dynamic-tag/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/dynamic-native-dynamic-tag/__snapshots__/dom.expected/template.hydrate.js index 5e3c7e42cb..7ec45a7007 100644 --- a/packages/translator-tags/src/__tests__/fixtures/dynamic-native-dynamic-tag/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/dynamic-native-dynamic-tag/__snapshots__/dom.expected/template.hydrate.js @@ -1,35 +1,36 @@ -// size: 450 (min) 267 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as n } from "@marko/runtime-tags/dom"; -const o = t.register("a0", t.createRendererWithOwner("body content", "")), - r = t.dynamicTagAttrs(0, o), - e = t.intersection( +// size: 361 (min) 228 (brotli) +const _tagNameBody = _$.register( + "a0", + _$.createRendererWithOwner("body content", ""), + ), + _tagName_input = _$.dynamicTagAttrs(0, _tagNameBody), + _expr_Text_className = _$.intersection( 2, - (t) => { - const { 3: n } = t; - r(t, () => ({ class: n })); + (_scope) => { + const { 3: className } = _scope; + _tagName_input(_scope, () => ({ class: className })); }, - () => r, + () => _tagName_input, ), - a = t.conditional(0, 0, () => e), - i = t.effect("a1", (n) => - t.on( - n[1], + _dynamicTagName = _$.conditional(0, 0, () => _expr_Text_className), + _tagName_effect = _$.effect("a1", (_scope) => + _$.on( + _scope[1], "click", - ((t) => { - const { 2: n } = t; + ((_scope) => { + const { 2: tagName } = _scope; return function () { - s(t, "span" === n ? "div" : "span"); + _tagName(_scope, "span" === tagName ? "div" : "span"); }; - })(n), + })(_scope), ), ), - s = t.state( + _tagName = _$.state( 2, - (t, n) => { - i(t), a(t, n || o(t)); + (_scope, tagName) => { + _tagName_effect(_scope), + _dynamicTagName(_scope, tagName || _tagNameBody(_scope)); }, - () => a, + () => _dynamicTagName, ); -n(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-args-tag-var/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-args-tag-var/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..c17a8ff147 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-args-tag-var/__snapshots__/.name-cache.json @@ -0,0 +1,12 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "o", + "$_tags0_input": "n", + "$_expr_Text_x": "a", + "$_x_effect": "r", + "$_x": "e" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-args-tag-var/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-args-tag-var/__snapshots__/dom.expected/template.hydrate.js index 70e56c5f4b..bd1ef9752a 100644 --- a/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-args-tag-var/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-args-tag-var/__snapshots__/dom.expected/template.hydrate.js @@ -1,37 +1,34 @@ -// size: 396 (min) 219 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as o } from "@marko/runtime-tags/dom"; -const n = t.dynamicTagAttrs(2), - a = t.intersection( +// size: 307 (min) 189 (brotli) +const _tags0_input = _$.dynamicTagAttrs(2), + _expr_Text_x = _$.intersection( 2, - (t) => { - const { 4: o } = t; - n(t, () => o); + (_scope) => { + const { 4: x } = _scope; + _tags0_input(_scope, () => x); }, - () => n, + () => _tags0_input, ); -t.registerBoundSignal( +_$.registerBoundSignal( "b0", - t.value(5, (o, n) => t.data(o[3], n)), + _$.value(5, (_scope, y) => _$.data(_scope[3], y)), ); -const r = t.effect("b1", (o) => - t.on( - o[0], +const _x_effect = _$.effect("b1", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { - const { 4: o } = t; + ((_scope) => { + const { 4: x } = _scope; return function () { - e(t, o + 1); + _x(_scope, x + 1); }; - })(o), + })(_scope), ), ), - e = t.state( + _x = _$.state( 4, - (o, n) => { - t.data(o[1], n), r(o); + (_scope, x) => { + _$.data(_scope[1], x), _x_effect(_scope); }, - () => a, + () => _expr_Text_x, ); -o(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-args/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-args/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..e522394a4d --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-args/__snapshots__/.name-cache.json @@ -0,0 +1,12 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "o", + "$_tags0_input": "n", + "$_expr_Text_x": "r", + "$_x_effect": "m", + "$_x": "a" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-args/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-args/__snapshots__/dom.expected/template.hydrate.js index 35ea813958..0fc281859c 100644 --- a/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-args/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-args/__snapshots__/dom.expected/template.hydrate.js @@ -1,33 +1,30 @@ -// size: 344 (min) 210 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as o } from "@marko/runtime-tags/dom"; -const n = t.dynamicTagAttrs(2, void 0, 1), - r = t.intersection( +// size: 255 (min) 174 (brotli) +const _tags0_input = _$.dynamicTagAttrs(2, void 0, 1), + _expr_Text_x = _$.intersection( 2, - (t) => { - const { 3: o } = t; - n(t, () => [o, "foo"]); + (_scope) => { + const { 3: x } = _scope; + _tags0_input(_scope, () => [x, "foo"]); }, - () => n, + () => _tags0_input, ), - m = t.effect("b0", (o) => - t.on( - o[0], + _x_effect = _$.effect("b0", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { - const { 3: o } = t; + ((_scope) => { + const { 3: x } = _scope; return function () { - a(t, o + 1); + _x(_scope, x + 1); }; - })(o), + })(_scope), ), ), - a = t.state( + _x = _$.state( 3, - (o, n) => { - t.data(o[1], n), m(o); + (_scope, x) => { + _$.data(_scope[1], x), _x_effect(_scope); }, - () => r, + () => _expr_Text_x, ); -o(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-attr-signal/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-attr-signal/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..597c45a9bd --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-attr-signal/__snapshots__/.name-cache.json @@ -0,0 +1,10 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "o", + "$_className_effect": "r", + "$_className": "m" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-attr-signal/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-attr-signal/__snapshots__/dom.expected/template.hydrate.js index 750a555221..fc34f076d9 100644 --- a/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-attr-signal/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-attr-signal/__snapshots__/dom.expected/template.hydrate.js @@ -1,20 +1,17 @@ -// size: 252 (min) 162 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as o } from "@marko/runtime-tags/dom"; -const r = t.effect("a0", (o) => - t.on( - o[1], +// size: 163 (min) 125 (brotli) +const _className_effect = _$.effect("a0", (_scope) => + _$.on( + _scope[1], "click", - ((t) => { - const { 2: o } = t; + ((_scope) => { + const { 2: className } = _scope; return function () { - m(t, "A" === o ? "B" : "A"); + _className(_scope, "A" === className ? "B" : "A"); }; - })(o), + })(_scope), ), ), - m = t.state(2, (o, m) => { - t.classAttr(o[0], m), r(o); + _className = _$.state(2, (_scope, className) => { + _$.classAttr(_scope[0], className), _className_effect(_scope); }); -o(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-custom-native/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-custom-native/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..fb548170c1 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-custom-native/__snapshots__/.name-cache.json @@ -0,0 +1,17 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "a", + "$_setup_": "i", + "$_id_": "o", + "$_input_": "d", + "$_params__": "e", + "$child": "m", + "$_tagName_input": "n", + "$_dynamicTagName": "r", + "$_tagName_effect": "c", + "$_tagName": "s" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-custom-native/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-custom-native/__snapshots__/dom.expected/template.hydrate.js index 21afdd6547..37cf0a4f62 100644 --- a/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-custom-native/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-custom-native/__snapshots__/dom.expected/template.hydrate.js @@ -1,42 +1,39 @@ -// size: 519 (min) 297 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as a } from "@marko/runtime-tags/dom"; -const i = () => {}, - o = t.value(3, (a, i) => t.data(a[0], i)), - d = t.value(2, (t, a) => o(t, a.id)), - e = t.value(1, (t, a) => d(t, a[0])); -var m = t.createTemplate( +// size: 430 (min) 258 (brotli) +const _setup_ = () => {}, + _id_ = _$.value(3, (_scope, id) => _$.data(_scope[0], id)), + _input_ = _$.value(2, (_scope, input) => _id_(_scope, input.id)), + _params__ = _$.value(1, (_scope, _params_) => _input_(_scope, _params_[0])); +var child = _$.createTemplate( "a", "
    Id is
    ", "Db%l", - i, + _setup_, void 0, - () => e, + () => _params__, ); -const n = t.dynamicTagAttrs(1), - r = t.conditional( +const _tagName_input = _$.dynamicTagAttrs(1), + _dynamicTagName = _$.conditional( 1, - (t) => n(t, () => ({ id: "dynamic" })), - () => n, + (_scope) => _tagName_input(_scope, () => ({ id: "dynamic" })), + () => _tagName_input, ), - c = t.effect("b0", (a) => - t.on( - a[0], + _tagName_effect = _$.effect("b0", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { - const { 2: a } = t; + ((_scope) => { + const { 2: tagName } = _scope; return function () { - s(t, a === m ? "div" : m); + _tagName(_scope, tagName === child ? "div" : child); }; - })(a), + })(_scope), ), ), - s = t.state( + _tagName = _$.state( 2, - (t, a) => { - c(t), r(t, a); + (_scope, tagName) => { + _tagName_effect(_scope), _dynamicTagName(_scope, tagName); }, - () => r, + () => _dynamicTagName, ); -a(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-custom-tags/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-custom-tags/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..9ad5e5348a --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-custom-tags/__snapshots__/.name-cache.json @@ -0,0 +1,23 @@ +{ + "vars": { + "props": { + "$_$": "a", + "$init": "t", + "$_setup_$1": "e", + "$_value_$1": "o", + "$_input_$1": "i", + "$_params__$1": "l", + "$child1": "v", + "$_setup_": "n", + "$_value_": "r", + "$_input_": "c", + "$_params__": "d", + "$child2": "m", + "$_tagName_input": "s", + "$_expr_Text_val": "u", + "$_dynamicTagName": "f", + "$_tagName_effect": "h", + "$_tagName": "p" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-custom-tags/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-custom-tags/__snapshots__/dom.expected/template.hydrate.js index 2ac90eeeb0..84b72d0ec5 100644 --- a/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-custom-tags/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-custom-tags/__snapshots__/dom.expected/template.hydrate.js @@ -1,58 +1,57 @@ -// size: 764 (min) 333 (brotli) - -import * as a from "@marko/runtime-tags/dom"; -import { init as t } from "@marko/runtime-tags/dom"; -const e = () => {}, - o = a.value(3, (t, e) => a.data(t[0], e)), - i = a.value(2, (a, t) => o(a, t.value)), - l = a.value(1, (a, t) => i(a, t[0])); -var v = a.createTemplate( +// size: 675 (min) 293 (brotli) +const _setup_$1 = () => {}, + _value_$1 = _$.value(3, (_scope, value) => _$.data(_scope[0], value)), + _input_$1 = _$.value(2, (_scope, input) => _value_$1(_scope, input.value)), + _params__$1 = _$.value(1, (_scope, _params_) => + _input_$1(_scope, _params_[0]), + ); +var child1 = _$.createTemplate( "a", "
    Child 1 has
    ", "Db%l", - e, + _setup_$1, void 0, - () => l, + () => _params__$1, ); -const n = () => {}, - r = a.value(3, (t, e) => a.data(t[0], e)), - c = a.value(2, (a, t) => r(a, t.value)), - d = a.value(1, (a, t) => c(a, t[0])); -var m = a.createTemplate( +const _setup_ = () => {}, + _value_ = _$.value(3, (_scope, value) => _$.data(_scope[0], value)), + _input_ = _$.value(2, (_scope, input) => _value_(_scope, input.value)), + _params__ = _$.value(1, (_scope, _params_) => _input_(_scope, _params_[0])); +var child2 = _$.createTemplate( "b", "
    Child 2 has
    ", "Db%l", - n, + _setup_, void 0, - () => d, + () => _params__, ); -const s = a.dynamicTagAttrs(0), - u = a.intersection( +const _tagName_input = _$.dynamicTagAttrs(0), + _expr_Text_val = _$.intersection( 2, - (a) => { - const { 3: t } = a; - s(a, () => ({ value: t })); + (_scope) => { + const { 3: val } = _scope; + _tagName_input(_scope, () => ({ value: val })); }, - () => s, + () => _tagName_input, ), - f = a.conditional(0, 0, () => u), - h = a.effect("c0", (t) => - a.on( - t[1], + _dynamicTagName = _$.conditional(0, 0, () => _expr_Text_val), + _tagName_effect = _$.effect("c0", (_scope) => + _$.on( + _scope[1], "click", - ((a) => { - const { 2: t } = a; + ((_scope) => { + const { 2: tagName } = _scope; return function () { - p(a, t === v ? m : v); + _tagName(_scope, tagName === child1 ? child2 : child1); }; - })(t), + })(_scope), ), ), - p = a.state( + _tagName = _$.state( 2, - (a, t) => { - h(a), f(a, t); + (_scope, tagName) => { + _tagName_effect(_scope), _dynamicTagName(_scope, tagName); }, - () => f, + () => _dynamicTagName, ); -t(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-native/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-native/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..db413faf9a --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-native/__snapshots__/.name-cache.json @@ -0,0 +1,5 @@ +{ + "vars": { + "props": {} + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-single-arg/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-single-arg/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..e522394a4d --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-single-arg/__snapshots__/.name-cache.json @@ -0,0 +1,12 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "o", + "$_tags0_input": "n", + "$_expr_Text_x": "r", + "$_x_effect": "m", + "$_x": "a" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-single-arg/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-single-arg/__snapshots__/dom.expected/template.hydrate.js index 6dbfd8a2c8..3a5e07f4b9 100644 --- a/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-single-arg/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-single-arg/__snapshots__/dom.expected/template.hydrate.js @@ -1,33 +1,30 @@ -// size: 327 (min) 205 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as o } from "@marko/runtime-tags/dom"; -const n = t.dynamicTagAttrs(2), - r = t.intersection( +// size: 238 (min) 161 (brotli) +const _tags0_input = _$.dynamicTagAttrs(2), + _expr_Text_x = _$.intersection( 2, - (t) => { - const { 3: o } = t; - n(t, () => o); + (_scope) => { + const { 3: x } = _scope; + _tags0_input(_scope, () => x); }, - () => n, + () => _tags0_input, ), - m = t.effect("b0", (o) => - t.on( - o[0], + _x_effect = _$.effect("b0", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { - const { 3: o } = t; + ((_scope) => { + const { 3: x } = _scope; return function () { - a(t, o + 1); + _x(_scope, x + 1); }; - })(o), + })(_scope), ), ), - a = t.state( + _x = _$.state( 3, - (o, n) => { - t.data(o[1], n), m(o); + (_scope, x) => { + _$.data(_scope[1], x), _x_effect(_scope); }, - () => r, + () => _expr_Text_x, ); -o(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-sometimes-null/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-sometimes-null/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..14d193c7c5 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-sometimes-null/__snapshots__/.name-cache.json @@ -0,0 +1,13 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "r", + "$_xBody": "n", + "$_x_input": "o", + "$_dynamicTagName": "e", + "$_x_effect": "a", + "$_x": "i" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-sometimes-null/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-sometimes-null/__snapshots__/dom.expected/template.hydrate.js index bea079b9df..9aa7fc3f39 100644 --- a/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-sometimes-null/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-sometimes-null/__snapshots__/dom.expected/template.hydrate.js @@ -1,31 +1,31 @@ -// size: 387 (min) 241 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as r } from "@marko/runtime-tags/dom"; -const n = t.register("a0", t.createRendererWithOwner("Body Content", "")), - o = t.dynamicTagAttrs(0, n), - e = t.conditional( +// size: 298 (min) 210 (brotli) +const _xBody = _$.register( + "a0", + _$.createRendererWithOwner("Body Content", ""), + ), + _x_input = _$.dynamicTagAttrs(0, _xBody), + _dynamicTagName = _$.conditional( 0, - (t) => o(t, () => ({})), - () => o, + (_scope) => _x_input(_scope, () => ({})), + () => _x_input, ), - a = t.effect("a1", (r) => - t.on( - r[1], + _x_effect = _$.effect("a1", (_scope) => + _$.on( + _scope[1], "click", - ((t) => { - const { 2: r } = t; + ((_scope) => { + const { 2: x } = _scope; return function () { - i(t, r ? null : "div"); + _x(_scope, x ? null : "div"); }; - })(r), + })(_scope), ), ), - i = t.state( + _x = _$.state( 2, - (t, r) => { - a(t), e(t, r || n(t)); + (_scope, x) => { + _x_effect(_scope), _dynamicTagName(_scope, x || _xBody(_scope)); }, - () => e, + () => _dynamicTagName, ); -r(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-with-updating-body/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-with-updating-body/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..a056172664 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-with-updating-body/__snapshots__/.name-cache.json @@ -0,0 +1,16 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "n", + "$_count_effect": "o", + "$_count": "r", + "$_setup$tagNameBody": "e", + "$_tagNameBody": "a", + "$_tagName_input": "c", + "$_dynamicTagName": "i", + "$_tagName_effect": "s", + "$_tagName": "m" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-with-updating-body/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-with-updating-body/__snapshots__/dom.expected/template.hydrate.js index 1c4cabaaa9..9363b15bb9 100644 --- a/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-with-updating-body/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/dynamic-tag-with-updating-body/__snapshots__/dom.expected/template.hydrate.js @@ -1,54 +1,56 @@ -// size: 597 (min) 314 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as n } from "@marko/runtime-tags/dom"; -const o = t.effect("a0", (n) => - t.on( - n[0], +// size: 502 (min) 268 (brotli) +const _count_effect = _$.effect("a0", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { - const { 2: n } = t; + ((_scope) => { + const { 2: count } = _scope; return function () { - r(t, n + 1); + _count(_scope, count + 1); }; - })(n), + })(_scope), ), ), - r = t.state(2, (n, r) => { - t.data(n[1], r), o(n); + _count = _$.state(2, (_scope, count) => { + _$.data(_scope[1], count), _count_effect(_scope); }); -const e = (t) => { - !(function (t) { - r(t, 0); - })(t[0]); +const _setup$tagNameBody = (_scope) => { + !(function (_scope) { + _count(_scope, 0); + })(_scope[0]); }, - c = t.register( + _tagNameBody = _$.register( "b0", - t.createRendererWithOwner("", "/ D l&", e), + _$.createRendererWithOwner( + "", + "/ D l&", + _setup$tagNameBody, + ), ), - a = t.dynamicTagAttrs(0, c), - i = t.conditional( + _tagName_input = _$.dynamicTagAttrs(0, _tagNameBody), + _dynamicTagName = _$.conditional( 0, - (t) => a(t, () => ({})), - () => a, + (_scope) => _tagName_input(_scope, () => ({})), + () => _tagName_input, ), - s = t.effect("b1", (n) => - t.on( - n[1], + _tagName_effect = _$.effect("b1", (_scope) => + _$.on( + _scope[1], "click", - ((t) => { - const { 2: n } = t; + ((_scope) => { + const { 2: tagName } = _scope; return function () { - m(t, "span" === n ? "div" : "span"); + _tagName(_scope, "span" === tagName ? "div" : "span"); }; - })(n), + })(_scope), ), ), - m = t.state( + _tagName = _$.state( 2, - (t, n) => { - s(t), i(t, n || c(t)); + (_scope, tagName) => { + _tagName_effect(_scope), + _dynamicTagName(_scope, tagName || _tagNameBody(_scope)); }, - () => i, + () => _dynamicTagName, ); -n(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/effect-counter/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/effect-counter/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..349241f659 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/effect-counter/__snapshots__/.name-cache.json @@ -0,0 +1,10 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "o", + "$_clickCount_effect": "n", + "$_clickCount": "e" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/effect-counter/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/effect-counter/__snapshots__/dom.expected/template.hydrate.js index 5c7d21153f..506f9ec7cd 100644 --- a/packages/translator-tags/src/__tests__/fixtures/effect-counter/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/effect-counter/__snapshots__/dom.expected/template.hydrate.js @@ -1,20 +1,17 @@ -// size: 281 (min) 157 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as o } from "@marko/runtime-tags/dom"; -const n = t.effect("a0", (o) => { - const { 1: n } = o; - (document.getElementById("button").textContent = n), - t.on( - o[0], +// size: 192 (min) 120 (brotli) +const _clickCount_effect = _$.effect("a0", (_scope) => { + const { 1: clickCount } = _scope; + (document.getElementById("button").textContent = clickCount), + _$.on( + _scope[0], "click", - ((t) => { - const { 1: o } = t; + ((_scope) => { + const { 1: clickCount } = _scope; return function () { - e(t, o + 1); + _clickCount(_scope, clickCount + 1); }; - })(o), + })(_scope), ); }), - e = t.state(1, (t, o) => n(t)); -o(); + _clickCount = _$.state(1, (_scope, clickCount) => _clickCount_effect(_scope)); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/effect-serialize-promise/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/effect-serialize-promise/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..1d429faa51 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/effect-serialize-promise/__snapshots__/.name-cache.json @@ -0,0 +1,8 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "e" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/effect-serialize-promise/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/effect-serialize-promise/__snapshots__/dom.expected/template.hydrate.js index b9ce244785..e72c1adfda 100644 --- a/packages/translator-tags/src/__tests__/fixtures/effect-serialize-promise/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/effect-serialize-promise/__snapshots__/dom.expected/template.hydrate.js @@ -1,13 +1,10 @@ -// size: 209 (min) 118 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as e } from "@marko/runtime-tags/dom"; -t.effect("a0", (t) => { - ((t) => { - const { 0: e } = t; +// size: 120 (min) 83 (brotli) +_$.effect("a0", (_scope) => { + ((_scope) => { + const { 0: promise } = _scope; return async () => { - document.getElementById("ref").textContent = await e; + document.getElementById("ref").textContent = await promise; }; - })(t)(); + })(_scope)(); }), - e(); + init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/effect-tag/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/effect-tag/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..0dd589d167 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/effect-tag/__snapshots__/.name-cache.json @@ -0,0 +1,8 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "m" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/effect-tag/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/effect-tag/__snapshots__/dom.expected/template.hydrate.js index f12e247daf..89ed36a8e1 100644 --- a/packages/translator-tags/src/__tests__/fixtures/effect-tag/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/effect-tag/__snapshots__/dom.expected/template.hydrate.js @@ -1,9 +1,6 @@ -// size: 173 (min) 103 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as m } from "@marko/runtime-tags/dom"; -t.effect("a0", (t) => { - const { 0: m } = t; - document.getElementById("ref").textContent = m; +// size: 84 (min) 66 (brotli) +_$.effect("a0", (_scope) => { + const { 0: x } = _scope; + document.getElementById("ref").textContent = x; }), - m(); + init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/entities/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/entities/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..db413faf9a --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/entities/__snapshots__/.name-cache.json @@ -0,0 +1,5 @@ +{ + "vars": { + "props": {} + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/for-destructure/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/for-destructure/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..7eb37bdd10 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/for-destructure/__snapshots__/.name-cache.json @@ -0,0 +1,16 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "e", + "$_description$forBody": "a", + "$_name$forBody": "r", + "$_pattern_$forBody": "i", + "$_params_2$forBody": "o", + "$_forBody": "n", + "$_for": "c", + "$_items_effect": "m", + "$_items": "s" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/for-destructure/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/for-destructure/__snapshots__/dom.expected/template.hydrate.js index 5d4a4901e1..8431d3b43c 100644 --- a/packages/translator-tags/src/__tests__/fixtures/for-destructure/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/for-destructure/__snapshots__/dom.expected/template.hydrate.js @@ -1,44 +1,52 @@ -// size: 633 (min) 321 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as e } from "@marko/runtime-tags/dom"; -const a = t.value(5, (e, a) => t.data(e[1], a)), - r = t.value(4, (e, a) => t.data(e[0], a)), - i = t.value(3, (t, e) => { - r(t, e.name), a(t, e.description); +// size: 544 (min) 268 (brotli) +const _description$forBody = _$.value(5, (_scope, description) => + _$.data(_scope[1], description), + ), + _name$forBody = _$.value(4, (_scope, name) => _$.data(_scope[0], name)), + _pattern_$forBody = _$.value(3, (_scope, _pattern_) => { + _name$forBody(_scope, _pattern_.name), + _description$forBody(_scope, _pattern_.description); }), - o = t.value(2, (t, e) => i(t, e[0])), - n = t.register( + _params_2$forBody = _$.value(2, (_scope, _params_2) => + _pattern_$forBody(_scope, _params_2[0]), + ), + _forBody = _$.register( "a0", - t.createRenderer("
    :
    ", "D%c%", void 0, void 0, () => o), + _$.createRenderer( + "
    :
    ", + "D%c%", + void 0, + void 0, + () => _params_2$forBody, + ), ), - c = t.loopOf(0, n), - m = t.effect("a1", (e) => { - t.on( - e[1], + _for = _$.loopOf(0, _forBody), + _items_effect = _$.effect("a1", (_scope) => { + _$.on( + _scope[1], "click", - ((t) => { - const { 3: e } = t; + ((_scope) => { + const { 3: items } = _scope; return function () { - s(t, [ - ...e, + _items(_scope, [ + ...items, { name: "JavaScript", description: "Java, but scriptier" }, ]); }; - })(e), + })(_scope), ), - t.on( - e[2], + _$.on( + _scope[2], "click", - ((t) => { - const { 3: e } = t; + ((_scope) => { + const { 3: items } = _scope; return function () { - s(t, e.slice(0, -1)); + _items(_scope, items.slice(0, -1)); }; - })(e), + })(_scope), ); }), - s = t.state(3, (t, e) => { - m(t), c(t, [e]); + _items = _$.state(3, (_scope, items) => { + _items_effect(_scope), _for(_scope, [items]); }); -e(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/for-event-handler/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/for-event-handler/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..ced835a376 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/for-event-handler/__snapshots__/.name-cache.json @@ -0,0 +1,15 @@ +{ + "vars": { + "props": { + "$_$": "o", + "$init": "t", + "$_i$forBody": "e", + "$_params_2$forBody": "r", + "$_num$forBody_effect": "n", + "$_num$forBody": "a", + "$_forBody": "i", + "$_for": "c", + "$_num": "m" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/for-event-handler/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/for-event-handler/__snapshots__/dom.expected/template.hydrate.js index 56424579f1..78eb58d4d6 100644 --- a/packages/translator-tags/src/__tests__/fixtures/for-event-handler/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/for-event-handler/__snapshots__/dom.expected/template.hydrate.js @@ -1,38 +1,37 @@ -// size: 481 (min) 272 (brotli) - -import * as o from "@marko/runtime-tags/dom"; -import { init as t } from "@marko/runtime-tags/dom"; -const e = o.value(3, (t, e) => o.data(t[1], e)), - r = o.value(2, (o, t) => e(o, t[0])), - n = o.effect("a0", (t) => - o.on( - t[0], +// size: 392 (min) 229 (brotli) +const _i$forBody = _$.value(3, (_scope, i) => _$.data(_scope[1], i)), + _params_2$forBody = _$.value(2, (_scope, _params_2) => + _i$forBody(_scope, _params_2[0]), + ), + _num$forBody_effect = _$.effect("a0", (_scope) => + _$.on( + _scope[0], "click", - ((o) => { + ((_scope) => { const { - _: { 1: t }, - } = o; + _: { 1: num }, + } = _scope; return function () { - m(o._, t + 1); + _num(_scope._, num + 1); }; - })(t), + })(_scope), ), ), - a = o.closure(1, (o, t) => n(o)), - i = o.register( + _num$forBody = _$.closure(1, (_scope, num) => _num$forBody_effect(_scope)), + _forBody = _$.register( "a1", - o.createRenderer( + _$.createRenderer( "", " D ", void 0, - () => [a], - () => r, + () => [_num$forBody], + () => _params_2$forBody, ), ), - c = o.loopTo(0, i), - m = o.state( + _for = _$.loopTo(0, _forBody), + _num = _$.state( 1, - (o, t) => c(o, [t, 0, 1]), - () => o.intersections([c, o.inLoopScope(a, 0)]), + (_scope, num) => _for(_scope, [num, 0, 1]), + () => _$.intersections([_for, _$.inLoopScope(_num$forBody, 0)]), ); -t(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/for-tag-siblings/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/for-tag-siblings/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..db413faf9a --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/for-tag-siblings/__snapshots__/.name-cache.json @@ -0,0 +1,5 @@ +{ + "vars": { + "props": {} + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/for-tag-with-state/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/for-tag-with-state/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..318e5c427a --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/for-tag-with-state/__snapshots__/.name-cache.json @@ -0,0 +1,10 @@ +{ + "vars": { + "props": { + "$_$": "a", + "$_i$forBody2": "e", + "$_val$forBody2": "r", + "$_params_3$forBody": "d" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/for-tag-with-state/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/for-tag-with-state/__snapshots__/dom.expected/template.hydrate.js index c491a71db9..d6c46d2e40 100644 --- a/packages/translator-tags/src/__tests__/fixtures/for-tag-with-state/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/for-tag-with-state/__snapshots__/dom.expected/template.hydrate.js @@ -1,12 +1,16 @@ -// size: 252 (min) 171 (brotli) - -import * as a from "@marko/runtime-tags/dom"; -const e = a.value(4, (e, r) => a.data(e[0], r)), - r = a.value(3, (e, r) => a.data(e[1], r)), - d = a.value(2, (a, d) => { - r(a, d[0]), e(a, d[1]); +// size: 210 (min) 142 (brotli) +const _i$forBody2 = _$.value(4, (_scope, i) => _$.data(_scope[0], i)), + _val$forBody2 = _$.value(3, (_scope, val) => _$.data(_scope[1], val)), + _params_3$forBody = _$.value(2, (_scope, _params_3) => { + _val$forBody2(_scope, _params_3[0]), _i$forBody2(_scope, _params_3[1]); }); -a.register( +_$.register( "a0", - a.createRenderer("
    :
    ", "D%c%", void 0, void 0, () => d), + _$.createRenderer( + "
    :
    ", + "D%c%", + void 0, + void 0, + () => _params_3$forBody, + ), ); diff --git a/packages/translator-tags/src/__tests__/fixtures/for-tag/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/for-tag/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..db413faf9a --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/for-tag/__snapshots__/.name-cache.json @@ -0,0 +1,5 @@ +{ + "vars": { + "props": {} + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/hello-dynamic/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/hello-dynamic/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..db413faf9a --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/hello-dynamic/__snapshots__/.name-cache.json @@ -0,0 +1,5 @@ +{ + "vars": { + "props": {} + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/html-comment-counter/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/html-comment-counter/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..649f014be1 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/html-comment-counter/__snapshots__/.name-cache.json @@ -0,0 +1,10 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "o", + "$_count_effect": "a", + "$_count": "m" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/html-comment-counter/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/html-comment-counter/__snapshots__/dom.expected/template.hydrate.js index 6ad3c7434c..483f4c2fd0 100644 --- a/packages/translator-tags/src/__tests__/fixtures/html-comment-counter/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/html-comment-counter/__snapshots__/dom.expected/template.hydrate.js @@ -1,20 +1,19 @@ -// size: 271 (min) 173 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as o } from "@marko/runtime-tags/dom"; -const a = t.effect("a0", (o) => - t.on( - o[0], +// size: 182 (min) 130 (brotli) +const _count_effect = _$.effect("a0", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { - const { 3: o } = t; + ((_scope) => { + const { 3: count } = _scope; return function () { - m(t, o + 1); + _count(_scope, count + 1); }; - })(o), + })(_scope), ), ), - m = t.state(3, (o, m) => { - t.data(o[1], m), t.data(o[2], `${m} + ${m} = ${m + m}`), a(o); + _count = _$.state(3, (_scope, count) => { + _$.data(_scope[1], count), + _$.data(_scope[2], `${count} + ${count} = ${count + count}`), + _count_effect(_scope); }); -o(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/html-comment-var/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/html-comment-var/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..72cdbede4a --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/html-comment-var/__snapshots__/.name-cache.json @@ -0,0 +1,9 @@ +{ + "vars": { + "props": { + "$_$": "a", + "$init": "t", + "$_tagName": "e" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/html-comment-var/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/html-comment-var/__snapshots__/dom.expected/template.hydrate.js index b8c5ea0245..40768c1801 100644 --- a/packages/translator-tags/src/__tests__/fixtures/html-comment-var/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/html-comment-var/__snapshots__/dom.expected/template.hydrate.js @@ -1,19 +1,16 @@ -// size: 340 (min) 182 (brotli) - -import * as a from "@marko/runtime-tags/dom"; -import { init as t } from "@marko/runtime-tags/dom"; -const e = a.state( +// size: 251 (min) 125 (brotli) +const _tagName = _$.state( 1, - (t, e) => a.tagVarSignal(t, e), - () => a.tagVarSignal, + (_scope, tagName) => _$.tagVarSignal(_scope, tagName), + () => _$.tagVarSignal, ); -a.effect("a0", (a) => e(a, a[0].parentElement.tagName)), - a.registerBoundSignal( +_$.effect("a0", (_scope) => _tagName(_scope, _scope[0].parentElement.tagName)), + _$.registerBoundSignal( "b0", - a.value(5, (t, e) => a.data(t[3], e)), + _$.value(5, (_scope, spanName) => _$.data(_scope[3], spanName)), ), - a.registerBoundSignal( + _$.registerBoundSignal( "b1", - a.value(4, (t, e) => a.data(t[1], e)), + _$.value(4, (_scope, divName) => _$.data(_scope[1], divName)), ), - t(); + init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/html-entity/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/html-entity/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..db413faf9a --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/html-entity/__snapshots__/.name-cache.json @@ -0,0 +1,5 @@ +{ + "vars": { + "props": {} + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/id-tag/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/id-tag/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..db413faf9a --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/id-tag/__snapshots__/.name-cache.json @@ -0,0 +1,5 @@ +{ + "vars": { + "props": {} + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/if-default-false/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/if-default-false/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..099580ae1e --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/if-default-false/__snapshots__/.name-cache.json @@ -0,0 +1,12 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "r", + "$_ifBody": "o", + "$_if": "e", + "$_show_effect": "n", + "$_show": "a" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/if-default-false/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/if-default-false/__snapshots__/dom.expected/template.hydrate.js index 7e5f3587a5..9c4f90de23 100644 --- a/packages/translator-tags/src/__tests__/fixtures/if-default-false/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/if-default-false/__snapshots__/dom.expected/template.hydrate.js @@ -1,22 +1,19 @@ -// size: 299 (min) 185 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as r } from "@marko/runtime-tags/dom"; -const o = t.register("a0", t.createRenderer("hi", "")), - e = t.conditional(1, 0), - n = t.effect("a1", (r) => - t.on( - r[0], +// size: 210 (min) 155 (brotli) +const _ifBody = _$.register("a0", _$.createRenderer("hi", "")), + _if = _$.conditional(1, 0), + _show_effect = _$.effect("a1", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { - const { 2: r } = t; + ((_scope) => { + const { 2: show } = _scope; return function () { - a(t, !r); + _show(_scope, !show); }; - })(r), + })(_scope), ), ), - a = t.state(2, (t, r) => { - n(t), e(t, r ? o : null); + _show = _$.state(2, (_scope, show) => { + _show_effect(_scope), _if(_scope, show ? _ifBody : null); }); -r(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/if-tag/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/if-tag/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..88d014a716 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/if-tag/__snapshots__/.name-cache.json @@ -0,0 +1,7 @@ +{ + "vars": { + "props": { + "$_$": "e" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/if-tag/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/if-tag/__snapshots__/dom.expected/template.hydrate.js index a040b64cef..4670f33665 100644 --- a/packages/translator-tags/src/__tests__/fixtures/if-tag/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/if-tag/__snapshots__/dom.expected/template.hydrate.js @@ -1,8 +1,6 @@ -// size: 260 (min) 94 (brotli) - -import * as e from "@marko/runtime-tags/dom"; -e.register("a0", e.createRenderer("C", "")), - e.register("a1", e.createRenderer("B", "")), - e.register("a2", e.createRenderer("A", "")), - e.register("a3", e.createRenderer("World", "")), - e.register("a4", e.createRenderer("Hello", "")); +// size: 218 (min) 71 (brotli) +_$.register("a0", _$.createRenderer("C", "")), + _$.register("a1", _$.createRenderer("B", "")), + _$.register("a2", _$.createRenderer("A", "")), + _$.register("a3", _$.createRenderer("World", "")), + _$.register("a4", _$.createRenderer("Hello", "")); diff --git a/packages/translator-tags/src/__tests__/fixtures/import-tag-conflict/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/import-tag-conflict/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..db413faf9a --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/import-tag-conflict/__snapshots__/.name-cache.json @@ -0,0 +1,5 @@ +{ + "vars": { + "props": {} + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/import-tag-shorthand/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/import-tag-shorthand/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..db413faf9a --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/import-tag-shorthand/__snapshots__/.name-cache.json @@ -0,0 +1,5 @@ +{ + "vars": { + "props": {} + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/import-tag-ternary/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/import-tag-ternary/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..efead7e8fb --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/import-tag-ternary/__snapshots__/.name-cache.json @@ -0,0 +1,7 @@ +{ + "vars": { + "props": { + "$_$": "m" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/import-tag-ternary/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/import-tag-ternary/__snapshots__/dom.expected/template.hydrate.js index 3b03c92136..8cc5fa3462 100644 --- a/packages/translator-tags/src/__tests__/fixtures/import-tag-ternary/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/import-tag-ternary/__snapshots__/dom.expected/template.hydrate.js @@ -1,4 +1,2 @@ -// size: 63 (min) 65 (brotli) - -import * as m from "@marko/runtime-tags/dom"; -m.dynamicTagAttrs(0); +// size: 21 (min) 25 (brotli) +_$.dynamicTagAttrs(0); diff --git a/packages/translator-tags/src/__tests__/fixtures/import-tag/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/import-tag/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..db413faf9a --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/import-tag/__snapshots__/.name-cache.json @@ -0,0 +1,5 @@ +{ + "vars": { + "props": {} + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/let-tag-controllable-child/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/let-tag-controllable-child/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..17e69fd055 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/let-tag-controllable-child/__snapshots__/.name-cache.json @@ -0,0 +1,19 @@ +{ + "vars": { + "props": { + "$_$": "a", + "$init": "t", + "$_expr__otherState_change_otherState_effect": "e", + "$_expr__otherState_change_otherState": "n", + "$_expr__state_change_state_effect": "o", + "$_expr__state_change_state": "i", + "$_otherState": "u", + "$_otherState_change": "r", + "$_state": "c", + "$_state_change": "l", + "$_input_": "s", + "$_valueChange": "v", + "$_source": "m" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/let-tag-controllable-child/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/let-tag-controllable-child/__snapshots__/dom.expected/template.hydrate.js index 3e4b29021e..deda7b8662 100644 --- a/packages/translator-tags/src/__tests__/fixtures/let-tag-controllable-child/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/let-tag-controllable-child/__snapshots__/dom.expected/template.hydrate.js @@ -1,73 +1,84 @@ -// size: 812 (min) 325 (brotli) - -import * as a from "@marko/runtime-tags/dom"; -import { init as t } from "@marko/runtime-tags/dom"; -const e = a.effect("a0", (t) => - a.on( - t[3], +// size: 723 (min) 290 (brotli) +const _expr__otherState_change_otherState_effect = _$.effect("a0", (_scope) => + _$.on( + _scope[3], "click", - ((a) => { - const { 10: t, 11: e } = a; + ((_scope) => { + const { 10: _otherState_change, 11: otherState } = _scope; return function () { - u(a, e + 1, t); + _otherState(_scope, otherState + 1, _otherState_change); }; - })(t), + })(_scope), ), ), - n = a.intersection(2, (a) => { - e(a); + _expr__otherState_change_otherState = _$.intersection(2, (_scope) => { + _expr__otherState_change_otherState_effect(_scope); }), - o = a.effect("a1", (t) => - a.on( - t[0], + _expr__state_change_state_effect = _$.effect("a1", (_scope) => + _$.on( + _scope[0], "click", - ((a) => { - const { 8: t, 9: e } = a; + ((_scope) => { + const { 8: _state_change, 9: state } = _scope; return function () { - c(a, e + 1, t); + _state(_scope, state + 1, _state_change); }; - })(t), + })(_scope), ), ), - i = a.intersection(2, (a) => { - o(a); + _expr__state_change_state = _$.intersection(2, (_scope) => { + _expr__state_change_state_effect(_scope); }), - u = a.state( + _otherState = _$.state( 11, - (t, e) => a.data(t[5], e), - () => n, + (_scope, otherState) => _$.data(_scope[5], otherState), + () => _expr__otherState_change_otherState, ), - r = a.value(10, 0, () => n), - c = a.state( + _otherState_change = _$.value( + 10, + 0, + () => _expr__otherState_change_otherState, + ), + _state = _$.state( 9, - (t, e) => a.data(t[2], e), - () => i, + (_scope, state) => _$.data(_scope[2], state), + () => _expr__state_change_state, ), - l = a.value(8, 0, () => i), - s = a.value( + _state_change = _$.value(8, 0, () => _expr__state_change_state), + _input_ = _$.value( 7, - (t, e) => { - a.data(t[1], e.value), - a.data(t[4], e.value), - l(t, e.valueChange), - c(t, e.value, t[8]), - r(t, e.valueChange), - u(t, e.value, t[10]); + (_scope, input) => { + _$.data(_scope[1], input.value), + _$.data(_scope[4], input.value), + _state_change(_scope, input.valueChange), + _state(_scope, input.value, _scope[8]), + _otherState_change(_scope, input.valueChange), + _otherState(_scope, input.value, _scope[10]); }, - () => a.intersections([l, c, r, u]), + () => + _$.intersections([ + _state_change, + _state, + _otherState_change, + _otherState, + ]), ), - v = a.register( + _valueChange = _$.register( "b0", - (a) => - function (t) { - m(a, t); + (_scope) => + function (_new_source) { + _source(_scope, _new_source); }, ), - m = a.state( + _source = _$.state( 2, - (t, e) => { - a.data(t[1], e), s(t[0], { value: e, valueChange: v(t) }); + (_scope, source) => { + _$.data(_scope[1], source), + _input_(_scope[0], { + value: source, + valueChange: _valueChange(_scope), + }); }, - () => a.inChild(0, s), + () => _$.inChild(0, _input_), ); -t(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/let-tag-controllable-id/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/let-tag-controllable-id/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..a214f6b10a --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/let-tag-controllable-id/__snapshots__/.name-cache.json @@ -0,0 +1,12 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "o", + "$_expr_handler_y_effect": "a", + "$_expr_handler_y": "r", + "$_y": "n", + "$_x": "e" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/let-tag-controllable-id/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/let-tag-controllable-id/__snapshots__/dom.expected/template.hydrate.js index a528601629..0dc46e2224 100644 --- a/packages/translator-tags/src/__tests__/fixtures/let-tag-controllable-id/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/let-tag-controllable-id/__snapshots__/dom.expected/template.hydrate.js @@ -1,39 +1,36 @@ -// size: 377 (min) 213 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as o } from "@marko/runtime-tags/dom"; -t.register( +// size: 288 (min) 176 (brotli) +_$.register( "a0", - (t) => - function (o) { - e(t, o + 1); + (_scope) => + function (newValue) { + _x(_scope, newValue + 1); }, ); -const a = t.effect("a1", (o) => - t.on( - o[0], +const _expr_handler_y_effect = _$.effect("a1", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { - const { 4: o, 5: a } = t; + ((_scope) => { + const { 4: handler, 5: y } = _scope; return function () { - n(t, a + 1, o); + _y(_scope, y + 1, handler); }; - })(o), + })(_scope), ), ), - r = t.intersection(2, (t) => { - a(t); + _expr_handler_y = _$.intersection(2, (_scope) => { + _expr_handler_y_effect(_scope); }), - n = t.state( + _y = _$.state( 5, - (o, a) => t.data(o[2], a), - () => r, + (_scope, y) => _$.data(_scope[2], y), + () => _expr_handler_y, ), - e = t.state( + _x = _$.state( 3, - (o, a) => { - t.data(o[1], a), n(o, a, o[4]); + (_scope, x) => { + _$.data(_scope[1], x), _y(_scope, x, _scope[4]); }, - () => n, + () => _y, ); -o(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/let-tag-controllable-static/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/let-tag-controllable-static/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..ab965c2ba7 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/let-tag-controllable-static/__snapshots__/.name-cache.json @@ -0,0 +1,12 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "o", + "$_expr__y_change_y_effect": "a", + "$_expr__y_change_y": "r", + "$_y": "n", + "$_x": "e" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/let-tag-controllable-static/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/let-tag-controllable-static/__snapshots__/dom.expected/template.hydrate.js index c518916bd8..4a41917f4e 100644 --- a/packages/translator-tags/src/__tests__/fixtures/let-tag-controllable-static/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/let-tag-controllable-static/__snapshots__/dom.expected/template.hydrate.js @@ -1,39 +1,36 @@ -// size: 370 (min) 210 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as o } from "@marko/runtime-tags/dom"; -t.register( +// size: 281 (min) 171 (brotli) +_$.register( "a0", - (t) => - function (o) { - e(t, o + 1); + (_scope) => + function (newValue) { + _x(_scope, newValue + 1); }, ); -const a = t.effect("a1", (o) => - t.on( - o[0], +const _expr__y_change_y_effect = _$.effect("a1", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { - const { 4: o, 5: a } = t; + ((_scope) => { + const { 4: _y_change, 5: y } = _scope; return function () { - o(a + 1); + _y_change(y + 1); }; - })(o), + })(_scope), ), ), - r = t.intersection(2, (t) => { - a(t); + _expr__y_change_y = _$.intersection(2, (_scope) => { + _expr__y_change_y_effect(_scope); }), - n = t.state( + _y = _$.state( 5, - (o, a) => t.data(o[2], a), - () => r, + (_scope, y) => _$.data(_scope[2], y), + () => _expr__y_change_y, ), - e = t.state( + _x = _$.state( 3, - (o, a) => { - t.data(o[1], a), n(o, a, 1); + (_scope, x) => { + _$.data(_scope[1], x), _y(_scope, x, 1); }, - () => n, + () => _y, ); -o(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/let-tag-derived/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/let-tag-derived/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..e038e9e1d1 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/let-tag-derived/__snapshots__/.name-cache.json @@ -0,0 +1,10 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "o", + "$_b_effect": "m", + "$_b": "r" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/let-tag-derived/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/let-tag-derived/__snapshots__/dom.expected/template.hydrate.js index 2b34fb2ce6..672a0ba544 100644 --- a/packages/translator-tags/src/__tests__/fixtures/let-tag-derived/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/let-tag-derived/__snapshots__/dom.expected/template.hydrate.js @@ -1,18 +1,15 @@ -// size: 230 (min) 154 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as o } from "@marko/runtime-tags/dom"; -const m = t.effect("a0", (o) => - t.on( - o[0], +// size: 141 (min) 129 (brotli) +const _b_effect = _$.effect("a0", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { - const { 6: o } = t; - return () => (r(t, o + 1), o); - })(o), + ((_scope) => { + const { 6: b } = _scope; + return () => (_b(_scope, b + 1), b); + })(_scope), ), ), - r = t.state(6, (o, r) => { - t.data(o[2], r), m(o); + _b = _$.state(6, (_scope, b) => { + _$.data(_scope[2], b), _b_effect(_scope); }); -o(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/let-tag-set-in-effect/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/let-tag-set-in-effect/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..514f8b8b01 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/let-tag-set-in-effect/__snapshots__/.name-cache.json @@ -0,0 +1,11 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "a", + "$_y": "m", + "$_x_effect": "o", + "$_x": "r" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/let-tag-set-in-effect/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/let-tag-set-in-effect/__snapshots__/dom.expected/template.hydrate.js index 68a0c2605d..fb91d35ef5 100644 --- a/packages/translator-tags/src/__tests__/fixtures/let-tag-set-in-effect/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/let-tag-set-in-effect/__snapshots__/dom.expected/template.hydrate.js @@ -1,13 +1,10 @@ -// size: 231 (min) 144 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as a } from "@marko/runtime-tags/dom"; -const m = t.state(3, (a, m) => t.data(a[1], m)), - o = t.effect("a0", (t) => { - const { 2: a } = t; - m(t, a), r(t, 2); +// size: 142 (min) 103 (brotli) +const _y = _$.state(3, (_scope, y) => _$.data(_scope[1], y)), + _x_effect = _$.effect("a0", (_scope) => { + const { 2: x } = _scope; + _y(_scope, x), _x(_scope, 2); }), - r = t.state(2, (a, m) => { - t.data(a[0], m), o(a); + _x = _$.state(2, (_scope, x) => { + _$.data(_scope[0], x), _x_effect(_scope); }); -a(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/let-tag-with-intersection/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/let-tag-with-intersection/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..5c1fb551c7 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/let-tag-with-intersection/__snapshots__/.name-cache.json @@ -0,0 +1,14 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "a", + "$_expr_y_z": "o", + "$_a": "e", + "$_z": "r", + "$_y": "n", + "$_x_effect": "m", + "$_x": "s" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/let-tag-with-intersection/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/let-tag-with-intersection/__snapshots__/dom.expected/template.hydrate.js index 1d89479aa6..55ccb38ccc 100644 --- a/packages/translator-tags/src/__tests__/fixtures/let-tag-with-intersection/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/let-tag-with-intersection/__snapshots__/dom.expected/template.hydrate.js @@ -1,37 +1,37 @@ -// size: 457 (min) 230 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as a } from "@marko/runtime-tags/dom"; -const o = t.intersection(2, (t) => { - const { 6: a, 7: o } = t; - e(t, a + o); +// size: 368 (min) 200 (brotli) +const _expr_y_z = _$.intersection(2, (_scope) => { + const { 6: y, 7: z } = _scope; + _a(_scope, y + z); }), - e = t.value(8, (a, o) => t.data(a[4], o)), - r = t.value( + _a = _$.value(8, (_scope, a) => _$.data(_scope[4], a)), + _z = _$.value( 7, - (a, o) => t.data(a[3], o), - () => o, + (_scope, z) => _$.data(_scope[3], z), + () => _expr_y_z, ), - n = t.value( + _y = _$.value( 6, - (a, o) => t.data(a[2], o), - () => o, + (_scope, y) => _$.data(_scope[2], y), + () => _expr_y_z, ), - m = t.effect("a0", (a) => - t.on( - a[0], + _x_effect = _$.effect("a0", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { - const { 5: a } = t; - return () => (s(t, a + 1), a); - })(a), + ((_scope) => { + const { 5: x } = _scope; + return () => (_x(_scope, x + 1), x); + })(_scope), ), ), - s = t.state( + _x = _$.state( 5, - (a, o) => { - t.data(a[1], o), m(a), n(a, o + 1), r(a, o + 2); + (_scope, x) => { + _$.data(_scope[1], x), + _x_effect(_scope), + _y(_scope, x + 1), + _z(_scope, x + 2); }, - () => t.intersections([n, r]), + () => _$.intersections([_y, _z]), ); -a(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/let-tag/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/let-tag/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..93f0790d87 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/let-tag/__snapshots__/.name-cache.json @@ -0,0 +1,12 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "a", + "$_expr_x_y_effect": "o", + "$_expr_x_y": "r", + "$_y": "m", + "$_x": "e" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/let-tag/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/let-tag/__snapshots__/dom.expected/template.hydrate.js index 14b882bbf6..1edb956560 100644 --- a/packages/translator-tags/src/__tests__/fixtures/let-tag/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/let-tag/__snapshots__/dom.expected/template.hydrate.js @@ -1,28 +1,25 @@ -// size: 313 (min) 183 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as a } from "@marko/runtime-tags/dom"; -const o = t.effect("a0", (a) => - t.on( - a[0], +// size: 224 (min) 144 (brotli) +const _expr_x_y_effect = _$.effect("a0", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { - const { 3: a, 4: o } = t; - return () => e(t, m(t, a + o)); - })(a), + ((_scope) => { + const { 3: x, 4: y } = _scope; + return () => _x(_scope, _y(_scope, x + y)); + })(_scope), ), ), - r = t.intersection(2, (t) => { - o(t); + _expr_x_y = _$.intersection(2, (_scope) => { + _expr_x_y_effect(_scope); }), - m = t.state( + _y = _$.state( 4, - (a, o) => t.data(a[2], o), - () => r, + (_scope, y) => _$.data(_scope[2], y), + () => _expr_x_y, ), - e = t.state( + _x = _$.state( 3, - (a, o) => t.data(a[1], o), - () => r, + (_scope, x) => _$.data(_scope[1], x), + () => _expr_x_y, ); -a(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/let-undefined-until-dom/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/let-undefined-until-dom/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..4796c31793 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/let-undefined-until-dom/__snapshots__/.name-cache.json @@ -0,0 +1,9 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "m", + "$_x": "a" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/let-undefined-until-dom/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/let-undefined-until-dom/__snapshots__/dom.expected/template.hydrate.js index b34ac5365e..caed739859 100644 --- a/packages/translator-tags/src/__tests__/fixtures/let-undefined-until-dom/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/let-undefined-until-dom/__snapshots__/dom.expected/template.hydrate.js @@ -1,6 +1,3 @@ -// size: 175 (min) 119 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as m } from "@marko/runtime-tags/dom"; -const a = t.state(1, (m, a) => t.data(m[0], a)); -t.effect("a0", (t) => a(t, "Client Only")), m(); +// size: 86 (min) 77 (brotli) +const _x = _$.state(1, (_scope, x) => _$.data(_scope[0], x)); +_$.effect("a0", (_scope) => _x(_scope, "Client Only")), init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/lifecycle-tag-assignment/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/lifecycle-tag-assignment/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..877dcd0d7a --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/lifecycle-tag-assignment/__snapshots__/.name-cache.json @@ -0,0 +1,13 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "n", + "$_prev": "o", + "$_onMount": "r", + "$_onUpdate": "c", + "$_x_effect": "a", + "$_x": "e" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/lifecycle-tag-assignment/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/lifecycle-tag-assignment/__snapshots__/dom.expected/template.hydrate.js index f59a9be913..6d5651292d 100644 --- a/packages/translator-tags/src/__tests__/fixtures/lifecycle-tag-assignment/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/lifecycle-tag-assignment/__snapshots__/dom.expected/template.hydrate.js @@ -1,34 +1,34 @@ -// size: 434 (min) 212 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as n } from "@marko/runtime-tags/dom"; -const o = t.state(4, (n, o) => t.data(n[1], o)), - r = (t) => { - const { 3: n } = t; +// size: 345 (min) 174 (brotli) +const _prev = _$.state(4, (_scope, prev) => _$.data(_scope[1], prev)), + _onMount = (_scope) => { + const { 3: x } = _scope; return function () { - this.cur = n; + this.cur = x; }; }, - c = (t) => { - const { 3: n } = t; + _onUpdate = (_scope) => { + const { 3: x } = _scope; return function () { - o(t, this.cur), (this.cur = n); + _prev(_scope, this.cur), (this.cur = x); }; }, - a = t.effect("a0", (n) => { - t.lifecycle(n, 4, { onMount: r(n), onUpdate: c(n) }), - t.on( - n[2], + _x_effect = _$.effect("a0", (_scope) => { + _$.lifecycle(_scope, 4, { + onMount: _onMount(_scope), + onUpdate: _onUpdate(_scope), + }), + _$.on( + _scope[2], "click", - ((t) => { - const { 3: n } = t; + ((_scope) => { + const { 3: x } = _scope; return function () { - e(t, n + 1); + _x(_scope, x + 1); }; - })(n), + })(_scope), ); }), - e = t.state(3, (n, o) => { - t.data(n[0], o), a(n); + _x = _$.state(3, (_scope, x) => { + _$.data(_scope[0], x), _x_effect(_scope); }); -n(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/lifecycle-tag-this/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/lifecycle-tag-this/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..d07804f6b4 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/lifecycle-tag-this/__snapshots__/.name-cache.json @@ -0,0 +1,11 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "n", + "$_onUpdate": "o", + "$_x_effect": "e", + "$_x": "r" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/lifecycle-tag-this/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/lifecycle-tag-this/__snapshots__/dom.expected/template.hydrate.js index f920cc5b61..19c422a2e7 100644 --- a/packages/translator-tags/src/__tests__/fixtures/lifecycle-tag-this/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/lifecycle-tag-this/__snapshots__/dom.expected/template.hydrate.js @@ -1,31 +1,28 @@ -// size: 408 (min) 215 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as n } from "@marko/runtime-tags/dom"; -const o = (t) => { - const { 1: n } = t; +// size: 319 (min) 179 (brotli) +const _onUpdate = (_scope) => { + const { 1: x } = _scope; return function () { - (document.getElementById("ref").textContent = `x=${n}, was=${this.cur}`), - (this.cur = n); + (document.getElementById("ref").textContent = `x=${x}, was=${this.cur}`), + (this.cur = x); }; }, - e = t.effect("a0", (n) => { - t.lifecycle(n, 3, { + _x_effect = _$.effect("a0", (_scope) => { + _$.lifecycle(_scope, 3, { onMount: function () { this.onUpdate(); }, - onUpdate: o(n), + onUpdate: _onUpdate(_scope), }), - t.on( - n[0], + _$.on( + _scope[0], "click", - ((t) => { - const { 1: n } = t; + ((_scope) => { + const { 1: x } = _scope; return function () { - r(t, n + 1); + _x(_scope, x + 1); }; - })(n), + })(_scope), ); }), - r = t.state(1, (t, n) => e(t)); -n(); + _x = _$.state(1, (_scope, x) => _x_effect(_scope)); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/lifecycle-tag/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/lifecycle-tag/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..b0581c9ca2 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/lifecycle-tag/__snapshots__/.name-cache.json @@ -0,0 +1,12 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "n", + "$_onMount": "e", + "$_onUpdate": "o", + "$_x_effect": "r", + "$_x": "c" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/lifecycle-tag/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/lifecycle-tag/__snapshots__/dom.expected/template.hydrate.js index 11adc8f24e..42bf80d50c 100644 --- a/packages/translator-tags/src/__tests__/fixtures/lifecycle-tag/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/lifecycle-tag/__snapshots__/dom.expected/template.hydrate.js @@ -1,31 +1,31 @@ -// size: 453 (min) 201 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as n } from "@marko/runtime-tags/dom"; -const e = (t) => { - const { 1: n } = t; +// size: 364 (min) 166 (brotli) +const _onMount = (_scope) => { + const { 1: x } = _scope; return function () { - document.getElementById("ref").textContent = "Mount " + n; + document.getElementById("ref").textContent = "Mount " + x; }; }, - o = (t) => { - const { 1: n } = t; + _onUpdate = (_scope) => { + const { 1: x } = _scope; return function () { - document.getElementById("ref").textContent = "Update " + n; + document.getElementById("ref").textContent = "Update " + x; }; }, - r = t.effect("a0", (n) => { - t.lifecycle(n, 3, { onMount: e(n), onUpdate: o(n) }), - t.on( - n[0], + _x_effect = _$.effect("a0", (_scope) => { + _$.lifecycle(_scope, 3, { + onMount: _onMount(_scope), + onUpdate: _onUpdate(_scope), + }), + _$.on( + _scope[0], "click", - ((t) => { - const { 1: n } = t; + ((_scope) => { + const { 1: x } = _scope; return function () { - c(t, n + 1); + _x(_scope, x + 1); }; - })(n), + })(_scope), ); }), - c = t.state(1, (t, n) => r(t)); -n(); + _x = _$.state(1, (_scope, x) => _x_effect(_scope)); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/log-tag/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/log-tag/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..987e6d721b --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/log-tag/__snapshots__/.name-cache.json @@ -0,0 +1,10 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "m", + "$testLog": "o", + "$_output": "r" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/log-tag/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/log-tag/__snapshots__/dom.expected/template.hydrate.js index 70449191de..19d0dcd166 100644 --- a/packages/translator-tags/src/__tests__/fixtures/log-tag/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/log-tag/__snapshots__/dom.expected/template.hydrate.js @@ -1,7 +1,3 @@ -// size: 205 (min) 135 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as m } from "@marko/runtime-tags/dom"; -import o from "./test-log"; -const r = t.state(2, (m, o) => t.data(m[0], o)); -t.effect("a0", (t) => r(t, JSON.stringify(o))), m(); +// size: 90 (min) 84 (brotli) +const _output = _$.state(2, (_scope, output) => _$.data(_scope[0], output)); +_$.effect("a0", (_scope) => _output(_scope, JSON.stringify(testLog))), init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/migrate-input/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/migrate-input/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..db413faf9a --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/migrate-input/__snapshots__/.name-cache.json @@ -0,0 +1,5 @@ +{ + "vars": { + "props": {} + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/move-and-clear-children/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/move-and-clear-children/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..3d6f97dc1f --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/move-and-clear-children/__snapshots__/.name-cache.json @@ -0,0 +1,9 @@ +{ + "vars": { + "props": { + "$_$": "e", + "$_child$forBody": "a", + "$_params_2$forBody": "r" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/move-and-clear-children/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/move-and-clear-children/__snapshots__/dom.expected/template.hydrate.js index 3bfdd3f4dc..d481565fee 100644 --- a/packages/translator-tags/src/__tests__/fixtures/move-and-clear-children/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/move-and-clear-children/__snapshots__/dom.expected/template.hydrate.js @@ -1,9 +1,11 @@ -// size: 187 (min) 129 (brotli) - -import * as e from "@marko/runtime-tags/dom"; -const a = e.value(2, (a, r) => e.data(a[0], r.text)), - r = e.value(1, (e, r) => a(e, r[0])); -e.register( +// size: 145 (min) 103 (brotli) +const _child$forBody = _$.value(2, (_scope, child) => + _$.data(_scope[0], child.text), + ), + _params_2$forBody = _$.value(1, (_scope, _params_2) => + _child$forBody(_scope, _params_2[0]), + ); +_$.register( "a0", - e.createRenderer(" ", " ", void 0, void 0, () => r), + _$.createRenderer(" ", " ", void 0, void 0, () => _params_2$forBody), ); diff --git a/packages/translator-tags/src/__tests__/fixtures/move-and-clear-top-level/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/move-and-clear-top-level/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..3d6f97dc1f --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/move-and-clear-top-level/__snapshots__/.name-cache.json @@ -0,0 +1,9 @@ +{ + "vars": { + "props": { + "$_$": "e", + "$_child$forBody": "a", + "$_params_2$forBody": "r" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/move-and-clear-top-level/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/move-and-clear-top-level/__snapshots__/dom.expected/template.hydrate.js index 3bfdd3f4dc..d481565fee 100644 --- a/packages/translator-tags/src/__tests__/fixtures/move-and-clear-top-level/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/move-and-clear-top-level/__snapshots__/dom.expected/template.hydrate.js @@ -1,9 +1,11 @@ -// size: 187 (min) 129 (brotli) - -import * as e from "@marko/runtime-tags/dom"; -const a = e.value(2, (a, r) => e.data(a[0], r.text)), - r = e.value(1, (e, r) => a(e, r[0])); -e.register( +// size: 145 (min) 103 (brotli) +const _child$forBody = _$.value(2, (_scope, child) => + _$.data(_scope[0], child.text), + ), + _params_2$forBody = _$.value(1, (_scope, _params_2) => + _child$forBody(_scope, _params_2[0]), + ); +_$.register( "a0", - e.createRenderer(" ", " ", void 0, void 0, () => r), + _$.createRenderer(" ", " ", void 0, void 0, () => _params_2$forBody), ); diff --git a/packages/translator-tags/src/__tests__/fixtures/native-tag-ref-effect-child/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/native-tag-ref-effect-child/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..113b62ec05 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/native-tag-ref-effect-child/__snapshots__/.name-cache.json @@ -0,0 +1,8 @@ +{ + "vars": { + "props": { + "$_$": "o", + "$init": "t" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/native-tag-ref-effect-child/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/native-tag-ref-effect-child/__snapshots__/dom.expected/template.hydrate.js index c82443281a..f7bb76f915 100644 --- a/packages/translator-tags/src/__tests__/fixtures/native-tag-ref-effect-child/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/native-tag-ref-effect-child/__snapshots__/dom.expected/template.hydrate.js @@ -1,10 +1,7 @@ -// size: 170 (min) 118 (brotli) - -import * as o from "@marko/runtime-tags/dom"; -import { init as t } from "@marko/runtime-tags/dom"; -o.effect("a0", (o) => { - const { 2: t } = o; - t().textContent = "hello"; +// size: 81 (min) 77 (brotli) +_$.effect("a0", (_scope) => { + const { 2: el } = _scope; + el().textContent = "hello"; }), - o.nodeRef("b0", 0), - t(); + _$.nodeRef("b0", 0), + init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/native-tag-ref-effect/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/native-tag-ref-effect/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..0dd589d167 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/native-tag-ref-effect/__snapshots__/.name-cache.json @@ -0,0 +1,8 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "m" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/native-tag-ref-effect/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/native-tag-ref-effect/__snapshots__/dom.expected/template.hydrate.js index 268adfe036..1ac73b1644 100644 --- a/packages/translator-tags/src/__tests__/fixtures/native-tag-ref-effect/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/native-tag-ref-effect/__snapshots__/dom.expected/template.hydrate.js @@ -1,5 +1,2 @@ -// size: 138 (min) 91 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as m } from "@marko/runtime-tags/dom"; -t.effect("a0", (t) => (t[0].textContent = "hello")), m(); +// size: 49 (min) 53 (brotli) +_$.effect("a0", (_scope) => (_scope[0].textContent = "hello")), init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/nested-assignment-expression/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/nested-assignment-expression/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..495dd422a8 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/nested-assignment-expression/__snapshots__/.name-cache.json @@ -0,0 +1,12 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "a", + "$_lastCount2": "o", + "$_lastCount": "m", + "$_clickCount_effect": "r", + "$_clickCount": "n" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/nested-assignment-expression/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/nested-assignment-expression/__snapshots__/dom.expected/template.hydrate.js index a36f95a18b..587120e909 100644 --- a/packages/translator-tags/src/__tests__/fixtures/nested-assignment-expression/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/nested-assignment-expression/__snapshots__/dom.expected/template.hydrate.js @@ -1,23 +1,27 @@ -// size: 333 (min) 181 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as a } from "@marko/runtime-tags/dom"; -const o = t.state(6, (a, o) => t.data(a[3], o)), - m = t.state(5, (a, o) => t.data(a[2], o)), - r = t.effect("a0", (a) => - t.on( - a[0], +// size: 244 (min) 141 (brotli) +const _lastCount2 = _$.state(6, (_scope, lastCount2) => + _$.data(_scope[3], lastCount2), + ), + _lastCount = _$.state(5, (_scope, lastCount) => + _$.data(_scope[2], lastCount), + ), + _clickCount_effect = _$.effect("a0", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { - const { 4: a } = t; + ((_scope) => { + const { 4: clickCount } = _scope; return function () { - const r = m(t, (n(t, a + 1), a)); - o(t, r); + const last = _lastCount( + _scope, + (_clickCount(_scope, clickCount + 1), clickCount), + ); + _lastCount2(_scope, last); }; - })(a), + })(_scope), ), ), - n = t.state(4, (a, o) => { - t.data(a[1], o), r(a); + _clickCount = _$.state(4, (_scope, clickCount) => { + _$.data(_scope[1], clickCount), _clickCount_effect(_scope); }); -a(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/placeholders/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/placeholders/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..db413faf9a --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/placeholders/__snapshots__/.name-cache.json @@ -0,0 +1,5 @@ +{ + "vars": { + "props": {} + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/reassignment-expression-counter/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/reassignment-expression-counter/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..4c8a338ccc --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/reassignment-expression-counter/__snapshots__/.name-cache.json @@ -0,0 +1,10 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "n", + "$_count_effect": "o", + "$_count": "c" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/reassignment-expression-counter/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/reassignment-expression-counter/__snapshots__/dom.expected/template.hydrate.js index ee32ed9bec..f25e229304 100644 --- a/packages/translator-tags/src/__tests__/fixtures/reassignment-expression-counter/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/reassignment-expression-counter/__snapshots__/dom.expected/template.hydrate.js @@ -1,40 +1,40 @@ -// size: 408 (min) 173 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as n } from "@marko/runtime-tags/dom"; -const o = t.effect("a0", (n) => { - t.on( - n[0], +// size: 319 (min) 138 (brotli) +const _count_effect = _$.effect("a0", (_scope) => { + _$.on( + _scope[0], "click", - ((t) => { - const { 6: n } = t; + ((_scope) => { + const { 6: count } = _scope; return function () { - c(t, n + 2); + _count(_scope, count + 2); }; - })(n), + })(_scope), ), - t.on( - n[2], + _$.on( + _scope[2], "click", - ((t) => { - const { 6: n } = t; + ((_scope) => { + const { 6: count } = _scope; return function () { - c(t, 3 * n); + _count(_scope, 3 * count); }; - })(n), + })(_scope), ), - t.on( - n[4], + _$.on( + _scope[4], "click", - ((t) => { - const { 6: n } = t; + ((_scope) => { + const { 6: count } = _scope; return function () { - c(t, n ** 3); + _count(_scope, count ** 3); }; - })(n), + })(_scope), ); }), - c = t.state(6, (n, c) => { - t.data(n[1], c), t.data(n[3], c), t.data(n[5], c), o(n); + _count = _$.state(6, (_scope, count) => { + _$.data(_scope[1], count), + _$.data(_scope[3], count), + _$.data(_scope[5], count), + _count_effect(_scope); }); -n(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/remove-and-add-rows/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/remove-and-add-rows/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..3d6f97dc1f --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/remove-and-add-rows/__snapshots__/.name-cache.json @@ -0,0 +1,9 @@ +{ + "vars": { + "props": { + "$_$": "e", + "$_child$forBody": "a", + "$_params_2$forBody": "r" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/remove-and-add-rows/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/remove-and-add-rows/__snapshots__/dom.expected/template.hydrate.js index 3bfdd3f4dc..d481565fee 100644 --- a/packages/translator-tags/src/__tests__/fixtures/remove-and-add-rows/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/remove-and-add-rows/__snapshots__/dom.expected/template.hydrate.js @@ -1,9 +1,11 @@ -// size: 187 (min) 129 (brotli) - -import * as e from "@marko/runtime-tags/dom"; -const a = e.value(2, (a, r) => e.data(a[0], r.text)), - r = e.value(1, (e, r) => a(e, r[0])); -e.register( +// size: 145 (min) 103 (brotli) +const _child$forBody = _$.value(2, (_scope, child) => + _$.data(_scope[0], child.text), + ), + _params_2$forBody = _$.value(1, (_scope, _params_2) => + _child$forBody(_scope, _params_2[0]), + ); +_$.register( "a0", - e.createRenderer(" ", " ", void 0, void 0, () => r), + _$.createRenderer(" ", " ", void 0, void 0, () => _params_2$forBody), ); diff --git a/packages/translator-tags/src/__tests__/fixtures/return-tag-no-var/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/return-tag-no-var/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..db413faf9a --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/return-tag-no-var/__snapshots__/.name-cache.json @@ -0,0 +1,5 @@ +{ + "vars": { + "props": {} + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/same-source-alias-pattern-and-identifier/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/same-source-alias-pattern-and-identifier/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..db413faf9a --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/same-source-alias-pattern-and-identifier/__snapshots__/.name-cache.json @@ -0,0 +1,5 @@ +{ + "vars": { + "props": {} + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/same-source-non-alias/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/same-source-non-alias/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..cc0faaa0e1 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/same-source-non-alias/__snapshots__/.name-cache.json @@ -0,0 +1,13 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "a", + "$createWrapper": "r", + "$_a": "o", + "$_pattern_": "e", + "$_count_effect": "n", + "$_count": "m" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/same-source-non-alias/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/same-source-non-alias/__snapshots__/dom.expected/template.hydrate.js index 717294b92d..3f6d597bde 100644 --- a/packages/translator-tags/src/__tests__/fixtures/same-source-non-alias/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/same-source-non-alias/__snapshots__/dom.expected/template.hydrate.js @@ -1,31 +1,28 @@ -// size: 376 (min) 209 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as a } from "@marko/runtime-tags/dom"; -function r(t) { - return { a: t }; +// size: 287 (min) 168 (brotli) +function createWrapper(a) { + return { a: a }; } -t.register("a0", r); -const o = t.value(5, (a, r) => { - t.data(a[1], r), - ((a, r) => { - t.data(a[2], r); - })(a, r); +_$.register("a0", createWrapper); +const _a = _$.value(5, (_scope, a) => { + _$.data(_scope[1], a), + ((_scope, b) => { + _$.data(_scope[2], b); + })(_scope, a); }), - e = t.value(4, (t, a) => o(t, a.a)), - n = t.effect("a1", (a) => - t.on( - a[0], + _pattern_ = _$.value(4, (_scope, _pattern_) => _a(_scope, _pattern_.a)), + _count_effect = _$.effect("a1", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { - const { 3: a } = t; + ((_scope) => { + const { 3: count } = _scope; return function () { - m(t, a + 1); + _count(_scope, count + 1); }; - })(a), + })(_scope), ), ), - m = t.state(3, (t, a) => { - n(t), e(t, r(a)); + _count = _$.state(3, (_scope, count) => { + _count_effect(_scope), _pattern_(_scope, createWrapper(count)); }); -a(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/shadow-same-scope/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/shadow-same-scope/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..fc1c430759 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/shadow-same-scope/__snapshots__/.name-cache.json @@ -0,0 +1,16 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "n", + "$_count4_effect": "a", + "$_count4": "c", + "$_count3_effect": "o", + "$_count3": "e", + "$_count2_effect": "r", + "$_count2": "f", + "$_count_effect": "i", + "$_count": "s" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/shadow-same-scope/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/shadow-same-scope/__snapshots__/dom.expected/template.hydrate.js index 1374bea323..00fa9dbf73 100644 --- a/packages/translator-tags/src/__tests__/fixtures/shadow-same-scope/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/shadow-same-scope/__snapshots__/dom.expected/template.hydrate.js @@ -1,65 +1,62 @@ -// size: 647 (min) 210 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as n } from "@marko/runtime-tags/dom"; -const a = t.effect("a0", (n) => - t.on( - n[6], +// size: 558 (min) 169 (brotli) +const _count4_effect = _$.effect("a0", (_scope) => + _$.on( + _scope[6], "click", - ((t) => { - const { 11: n } = t; + ((_scope) => { + const { 11: _count3 } = _scope; return function () { - c(t, n + 1); + _count4(_scope, _count3 + 1); }; - })(n), + })(_scope), ), ), - c = t.state(11, (n, c) => { - t.data(n[7], c), a(n); + _count4 = _$.state(11, (_scope, _count3) => { + _$.data(_scope[7], _count3), _count4_effect(_scope); }), - o = t.effect("a1", (n) => - t.on( - n[4], + _count3_effect = _$.effect("a1", (_scope) => + _$.on( + _scope[4], "click", - ((t) => { - const { 10: n } = t; + ((_scope) => { + const { 10: _count2 } = _scope; return function () { - e(t, n + 1); + _count3(_scope, _count2 + 1); }; - })(n), + })(_scope), ), ), - e = t.state(10, (n, a) => { - t.data(n[5], a), o(n); + _count3 = _$.state(10, (_scope, _count2) => { + _$.data(_scope[5], _count2), _count3_effect(_scope); }), - r = t.effect("a2", (n) => - t.on( - n[2], + _count2_effect = _$.effect("a2", (_scope) => + _$.on( + _scope[2], "click", - ((t) => { - const { 9: n } = t; + ((_scope) => { + const { 9: _count } = _scope; return function () { - f(t, n + 1); + _count2(_scope, _count + 1); }; - })(n), + })(_scope), ), ), - f = t.state(9, (n, a) => { - t.data(n[3], a), r(n); + _count2 = _$.state(9, (_scope, _count) => { + _$.data(_scope[3], _count), _count2_effect(_scope); }), - i = t.effect("a3", (n) => - t.on( - n[0], + _count_effect = _$.effect("a3", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { - const { 8: n } = t; + ((_scope) => { + const { 8: count } = _scope; return function () { - s(t, n + 1); + _count(_scope, count + 1); }; - })(n), + })(_scope), ), ), - s = t.state(8, (n, a) => { - t.data(n[1], a), i(n); + _count = _$.state(8, (_scope, count) => { + _$.data(_scope[1], count), _count_effect(_scope); }); -n(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/tag-resolution-priority/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/tag-resolution-priority/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..efead7e8fb --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/tag-resolution-priority/__snapshots__/.name-cache.json @@ -0,0 +1,7 @@ +{ + "vars": { + "props": { + "$_$": "m" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/tag-resolution-priority/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/tag-resolution-priority/__snapshots__/dom.expected/template.hydrate.js index a33c89f60c..71a75fe191 100644 --- a/packages/translator-tags/src/__tests__/fixtures/tag-resolution-priority/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/tag-resolution-priority/__snapshots__/dom.expected/template.hydrate.js @@ -1,4 +1,2 @@ -// size: 63 (min) 66 (brotli) - -import * as m from "@marko/runtime-tags/dom"; -m.dynamicTagAttrs(1); +// size: 21 (min) 25 (brotli) +_$.dynamicTagAttrs(1); diff --git a/packages/translator-tags/src/__tests__/fixtures/tag-var-destructure/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/tag-var-destructure/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..15020019d0 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/tag-var-destructure/__snapshots__/.name-cache.json @@ -0,0 +1,14 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "a", + "$noop": "r", + "$_e": "o", + "$_d": "e", + "$_c": "i", + "$_b": "s", + "$_a": "m" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/tag-var-destructure/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/tag-var-destructure/__snapshots__/dom.expected/template.hydrate.js index ddc6c70d91..e497e45000 100644 --- a/packages/translator-tags/src/__tests__/fixtures/tag-var-destructure/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/tag-var-destructure/__snapshots__/dom.expected/template.hydrate.js @@ -1,33 +1,30 @@ -// size: 552 (min) 286 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as a } from "@marko/runtime-tags/dom"; -function r(t) {} -t.register("a0", r); -const o = t.state(10, (a, r) => t.data(a[5], JSON.stringify(r))), - e = t.state(9, (a, r) => t.data(a[4], r)), - i = t.state(8, (a, r) => t.data(a[3], JSON.stringify(r))), - s = t.state(7, (a, r) => t.data(a[2], r)), - m = t.state(6, (a, r) => t.data(a[1], r)); -t.effect("a1", (a) => - t.on(a[0], "click", function () { - let t, r, n, c, f, d; +// size: 463 (min) 222 (brotli) +function noop(_) {} +_$.register("a0", noop); +const _e = _$.state(10, (_scope, e) => _$.data(_scope[5], JSON.stringify(e))), + _d = _$.state(9, (_scope, d) => _$.data(_scope[4], d)), + _c = _$.state(8, (_scope, c) => _$.data(_scope[3], JSON.stringify(c))), + _b = _$.state(7, (_scope, b) => _$.data(_scope[2], b)), + _a = _$.state(6, (_scope, a) => _$.data(_scope[1], a)); +_$.effect("a1", (_scope) => + _$.on(_scope[0], "click", function () { + let local, _a2, _b2, _c2, _d2, _e2; ({ - a: r, - _b: { _b: n }, - local: t, - ...c + a: _a2, + _b: { _b: _b2 }, + local: local, + ..._c2 } = { a: 1, _b: { _b: 2 }, local: 3, c: 4 }), - m(a, r), - s(a, n), - i(a, c), + _a(_scope, _a2), + _b(_scope, _b2), + _c(_scope, _c2), ([ { - arr: [t, f, , ...d], + arr: [local, _d2, , ..._e2], }, ] = [{ arr: [6, 7, 8, 9] }]), - e(a, f), - o(a, d); + _d(_scope, _d2), + _e(_scope, _e2); }), ), - a(); + init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/toggle-first-child/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/toggle-first-child/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..78a9d494b0 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/toggle-first-child/__snapshots__/.name-cache.json @@ -0,0 +1,8 @@ +{ + "vars": { + "props": { + "$_$": "r", + "$_value$ifBody": "a" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/toggle-first-child/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/toggle-first-child/__snapshots__/dom.expected/template.hydrate.js index 0793d1ffcb..9d26c15947 100644 --- a/packages/translator-tags/src/__tests__/fixtures/toggle-first-child/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/toggle-first-child/__snapshots__/dom.expected/template.hydrate.js @@ -1,8 +1,8 @@ -// size: 161 (min) 122 (brotli) - -import * as r from "@marko/runtime-tags/dom"; -const a = r.closure(3, (a, e) => r.data(a[0], e)); -r.register( +// size: 119 (min) 109 (brotli) +const _value$ifBody = _$.closure(3, (_scope, value) => + _$.data(_scope[0], value), +); +_$.register( "a0", - r.createRenderer(" ", "D ", void 0, () => [a]), + _$.createRenderer(" ", "D ", void 0, () => [_value$ifBody]), ); diff --git a/packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..e98769fd6b --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/.name-cache.json @@ -0,0 +1,20 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "n", + "$_count$ifBody_effect": "e", + "$_count$ifBody": "o", + "$_ifBody2": "r", + "$_if$ifBody": "i", + "$_inner$ifBody_effect": "c", + "$_inner$ifBody": "a", + "$_ifBody": "u", + "$_if": "s", + "$_count": "d", + "$_inner": "l", + "$_outer_effect": "m", + "$_outer": "f" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/dom.expected/template.hydrate.js index af1c780b6e..5ddd22997d 100644 --- a/packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/toggle-nested-2/__snapshots__/dom.expected/template.hydrate.js @@ -1,86 +1,88 @@ -// size: 913 (min) 392 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as n } from "@marko/runtime-tags/dom"; -const e = t.effect("a0", (n) => - t.on( - n[0], +// size: 824 (min) 341 (brotli) +const _count$ifBody_effect = _$.effect("a0", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { + ((_scope) => { const { _: { - _: { 4: n }, + _: { 4: count }, }, - } = t; + } = _scope; return function () { - d(t._._, n + 1); + _count(_scope._._, count + 1); }; - })(n), + })(_scope), ), ), - o = t.registerSubscriber( + _count$ifBody = _$.registerSubscriber( "a1", - t.dynamicClosure( + _$.dynamicClosure( 4, - (n, o) => { - t.data(n[1], o), e(n); + (_scope, count) => { + _$.data(_scope[1], count), _count$ifBody_effect(_scope); }, - (t) => t._._, + (_scope) => _scope._._, ), ), - r = t.register( + _ifBody2 = _$.register( "a2", - t.createRenderer("", " D ", void 0, () => [o]), + _$.createRenderer("", " D ", void 0, () => [ + _count$ifBody, + ]), ), - i = t.conditional(1, 0), - c = t.effect("a3", (n) => - t.on( - n[0], + _if$ifBody = _$.conditional(1, 0), + _inner$ifBody_effect = _$.effect("a3", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { + ((_scope) => { const { - _: { 3: n }, - } = t; + _: { 3: inner }, + } = _scope; return function () { - l(t._, !n); + _inner(_scope._, !inner); }; - })(n), + })(_scope), ), ), - a = t.closure( + _inner$ifBody = _$.closure( 3, - (t, n) => { - c(t), i(t, n ? r : null); + (_scope, inner) => { + _inner$ifBody_effect(_scope), _if$ifBody(_scope, inner ? _ifBody2 : null); }, void 0, - () => i, + () => _if$ifBody, ), - u = t.register( + _ifBody = _$.register( "a4", - t.createRenderer("", " b%D", void 0, () => [ - a, - ]), + _$.createRenderer( + "", + " b%D", + void 0, + () => [_inner$ifBody], + ), ), - s = t.conditional(1, 0), - d = t.state(4, 0, () => t.dynamicSubscribers(4)), - l = t.state(3, 0, () => t.inConditionalScope(a, 1)), - m = t.effect("a5", (n) => - t.on( - n[0], + _if = _$.conditional(1, 0), + _count = _$.state(4, 0, () => _$.dynamicSubscribers(4)), + _inner = _$.state(3, 0, () => _$.inConditionalScope(_inner$ifBody, 1)), + _outer_effect = _$.effect("a5", (_scope) => + _$.on( + _scope[0], "click", - ((t) => { - const { 2: n } = t; + ((_scope) => { + const { 2: outer } = _scope; return function () { - f(t, !n); + _outer(_scope, !outer); }; - })(n), + })(_scope), ), ), - f = t.state( + _outer = _$.state( 2, - (t, n) => { - m(t), s(t, n ? u : null); + (_scope, outer) => { + _outer_effect(_scope), _if(_scope, outer ? _ifBody : null); }, - () => s, + () => _if, ); -n(); +init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/toggle-nested/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/toggle-nested/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..2e11e0604c --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/toggle-nested/__snapshots__/.name-cache.json @@ -0,0 +1,15 @@ +{ + "vars": { + "props": { + "$_$": "e", + "$_value2$ifBody": "r", + "$_ifBody3": "a", + "$_value1$ifBody": "i", + "$_ifBody2": "o", + "$_if$ifBody2": "s", + "$_if$ifBody": "n", + "$_value2$ifBody2": "t", + "$_value1$ifBody2": "d" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/toggle-nested/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/toggle-nested/__snapshots__/dom.expected/template.hydrate.js index de4211916c..53db2e4a42 100644 --- a/packages/translator-tags/src/__tests__/fixtures/toggle-nested/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/toggle-nested/__snapshots__/dom.expected/template.hydrate.js @@ -1,45 +1,46 @@ -// size: 593 (min) 225 (brotli) - -import * as e from "@marko/runtime-tags/dom"; -const r = e.registerSubscriber( +// size: 551 (min) 198 (brotli) +const _value2$ifBody = _$.registerSubscriber( "a0", - e.dynamicClosure( + _$.dynamicClosure( 5, - (r, a) => e.data(r[0], a), - (e) => e._._, + (_scope, value2) => _$.data(_scope[0], value2), + (_scope) => _scope._._, ), ), - a = e.register( + _ifBody3 = _$.register( "a1", - e.createRenderer(" ", "D ", void 0, () => [r]), + _$.createRenderer(" ", "D ", void 0, () => [_value2$ifBody]), ), - i = e.registerSubscriber( + _value1$ifBody = _$.registerSubscriber( "a2", - e.dynamicClosure( + _$.dynamicClosure( 4, - (r, a) => e.data(r[0], a), - (e) => e._._, + (_scope, value1) => _$.data(_scope[0], value1), + (_scope) => _scope._._, ), ), - o = e.register( + _ifBody2 = _$.register( "a3", - e.createRenderer(" ", "D ", void 0, () => [i]), + _$.createRenderer(" ", "D ", void 0, () => [_value1$ifBody]), ), - s = e.conditional(1, 0), - n = e.conditional(0, 0), - t = e.closure( + _if$ifBody2 = _$.conditional(1, 0), + _if$ifBody = _$.conditional(0, 0), + _value2$ifBody2 = _$.closure( 5, - (e, r) => s(e, r ? a : null), + (_scope, value2) => _if$ifBody2(_scope, value2 ? _ifBody3 : null), void 0, - () => s, + () => _if$ifBody2, ), - d = e.closure( + _value1$ifBody2 = _$.closure( 4, - (e, r) => n(e, r ? o : null), + (_scope, value1) => _if$ifBody(_scope, value1 ? _ifBody2 : null), void 0, - () => n, + () => _if$ifBody, ); -e.register( +_$.register( "a4", - e.createRenderer("", "D%b%D", void 0, () => [t, d]), + _$.createRenderer("", "D%b%D", void 0, () => [ + _value2$ifBody2, + _value1$ifBody2, + ]), ); diff --git a/packages/translator-tags/src/__tests__/fixtures/update-attr/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/update-attr/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..db413faf9a --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/update-attr/__snapshots__/.name-cache.json @@ -0,0 +1,5 @@ +{ + "vars": { + "props": {} + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/update-dynamic-attrs/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/update-dynamic-attrs/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..7f5df2e12b --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/update-dynamic-attrs/__snapshots__/.name-cache.json @@ -0,0 +1,8 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "r" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/update-dynamic-attrs/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/update-dynamic-attrs/__snapshots__/dom.expected/template.hydrate.js index ecb00965fc..1235941ccb 100644 --- a/packages/translator-tags/src/__tests__/fixtures/update-dynamic-attrs/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/update-dynamic-attrs/__snapshots__/dom.expected/template.hydrate.js @@ -1,9 +1,6 @@ -// size: 192 (min) 107 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as r } from "@marko/runtime-tags/dom"; -t.effect("a0", (r) => t.attrsEvents(r, 1)), - t.effect("a1", (r) => { - t.attrsEvents(r, 0), t.attrsEvents(r, 2); +// size: 103 (min) 71 (brotli) +_$.effect("a0", (_scope) => _$.attrsEvents(_scope, 1)), + _$.effect("a1", (_scope) => { + _$.attrsEvents(_scope, 0), _$.attrsEvents(_scope, 2); }), - r(); + init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/update-html/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/update-html/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..db413faf9a --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/update-html/__snapshots__/.name-cache.json @@ -0,0 +1,5 @@ +{ + "vars": { + "props": {} + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/update-text/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/update-text/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..db413faf9a --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/update-text/__snapshots__/.name-cache.json @@ -0,0 +1,5 @@ +{ + "vars": { + "props": {} + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/user-effect-abort-signal/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/user-effect-abort-signal/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..88ad439394 --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/user-effect-abort-signal/__snapshots__/.name-cache.json @@ -0,0 +1,10 @@ +{ + "vars": { + "props": { + "$_$": "t", + "$init": "a", + "$_b": "o", + "$_a": "m" + } + } +} diff --git a/packages/translator-tags/src/__tests__/fixtures/user-effect-abort-signal/__snapshots__/dom.expected/template.hydrate.js b/packages/translator-tags/src/__tests__/fixtures/user-effect-abort-signal/__snapshots__/dom.expected/template.hydrate.js index caaba58364..911416fa47 100644 --- a/packages/translator-tags/src/__tests__/fixtures/user-effect-abort-signal/__snapshots__/dom.expected/template.hydrate.js +++ b/packages/translator-tags/src/__tests__/fixtures/user-effect-abort-signal/__snapshots__/dom.expected/template.hydrate.js @@ -1,14 +1,11 @@ -// size: 274 (min) 168 (brotli) - -import * as t from "@marko/runtime-tags/dom"; -import { init as a } from "@marko/runtime-tags/dom"; -const o = t.state(5, (a, o) => t.data(a[1], o)), - m = t.state(4, (a, o) => t.data(a[0], o)); -t.effect("a0", (a) => { - const { 3: r } = a; +// size: 185 (min) 131 (brotli) +const _b = _$.state(5, (_scope, b) => _$.data(_scope[1], b)), + _a = _$.state(4, (_scope, a) => _$.data(_scope[0], a)); +_$.effect("a0", (_scope) => { + const { 3: input } = _scope; { - const e = m(a, r.value + 1); - t.getAbortSignal(a, 0).onabort = () => o(a, e); + const previousValue = _a(_scope, input.value + 1); + _$.getAbortSignal(_scope, 0).onabort = () => _b(_scope, previousValue); } }), - a(); + init(); diff --git a/packages/translator-tags/src/__tests__/fixtures/walk-over-child/__snapshots__/.name-cache.json b/packages/translator-tags/src/__tests__/fixtures/walk-over-child/__snapshots__/.name-cache.json new file mode 100644 index 0000000000..db413faf9a --- /dev/null +++ b/packages/translator-tags/src/__tests__/fixtures/walk-over-child/__snapshots__/.name-cache.json @@ -0,0 +1,5 @@ +{ + "vars": { + "props": {} + } +} diff --git a/packages/translator-tags/src/__tests__/main.test.ts b/packages/translator-tags/src/__tests__/main.test.ts index edfc7ba596..7a0a49f434 100644 --- a/packages/translator-tags/src/__tests__/main.test.ts +++ b/packages/translator-tags/src/__tests__/main.test.ts @@ -7,6 +7,7 @@ import type { DOMWindow } from "jsdom"; import snap from "mocha-snap"; import path from "path"; import glob from "tiny-glob"; +import { isDeepStrictEqual } from "util"; import * as translator from ".."; import { bundle } from "./utils/bundle"; @@ -69,6 +70,18 @@ describe("translator-tags", () => { const browserFile = resolve("browser.ts"); const templateFile = resolve("template.marko"); const hasTemplate = fs.existsSync(templateFile); + const nameCacheFile = resolve("__snapshots__/.name-cache.json"); + const nameCache = (() => { + try { + return JSON.parse(fs.readFileSync(nameCacheFile, "utf-8")) as Record< + string, + unknown + >; + } catch { + return {}; + } + })(); + const initialNameCache = structuredClone(nameCache); const config: TestConfig = (() => { try { return require(resolve("test.ts")); @@ -142,7 +155,7 @@ describe("translator-tags", () => { !skipResume && !config.error_compiler ) { - await targetSnap(() => bundle(file, finalConfig), { + await targetSnap(() => bundle(file, nameCache, finalConfig), { file: name.replace(".marko", ".hydrate.js"), dir: fixtureDir, }); @@ -353,6 +366,15 @@ describe("translator-tags", () => { return (resumeResult = { browser, tracker }); }; + after(() => { + if (!isDeepStrictEqual(initialNameCache, nameCache)) { + fs.writeFileSync( + nameCacheFile, + JSON.stringify(nameCache, null, 2) + "\n", + ); + } + }); + describe("compile", () => { (skipHTML ? it.skip : it)("html", () => snapAllTemplates(htmlConfig)); diff --git a/packages/translator-tags/src/__tests__/utils/bundle.ts b/packages/translator-tags/src/__tests__/utils/bundle.ts index 0f735f1b98..01834aa0bd 100644 --- a/packages/translator-tags/src/__tests__/utils/bundle.ts +++ b/packages/translator-tags/src/__tests__/utils/bundle.ts @@ -4,6 +4,7 @@ import fs from "fs/promises"; import path from "path"; import { format } from "prettier"; import { type OutputChunk, rollup } from "rollup"; +import { minify } from "terser"; import glob from "tiny-glob"; import zlib from "zlib"; @@ -14,6 +15,7 @@ interface Sizes { export async function bundle( entryTemplate: string, + nameCache: Record, compilerConfig: compiler.Config, ) { const cache = new Map(); @@ -88,7 +90,7 @@ export async function bundle( return null; }, }, - pluginTerser({ compress: {}, mangle: { module: true } }), + pluginTerser({ compress: {}, mangle: false }), ], }); @@ -98,14 +100,16 @@ export async function bundle( }); const chunks = output.filter((chunk) => "code" in chunk) as OutputChunk[]; const size = addSizes( - await Promise.all(chunks.map((chunk) => getSizesForSrc(chunk.code))), + await Promise.all( + chunks.map((chunk) => getSizesForSrc(chunk.code, nameCache)), + ), ); if (size.min === 0) { return `// size: 0\n`; } - let result = `// size: ${size.min} (min) ${size.brotli} (brotli)`; + let result = ""; for (const chunk of chunks) { if (chunk.type === "chunk" && chunk.code) { if (chunks.length > 1) { @@ -116,10 +120,22 @@ export async function bundle( } } - return result; + return `// size: ${size.min} (min) ${size.brotli} (brotli)\n${stripModuleCode(result)}`; } -async function getSizesForSrc(minified: string): Promise { +async function getSizesForSrc( + code: string, + nameCache: Record, +): Promise { + const minified = stripModuleCode( + ( + await minify(code, { + nameCache, + compress: {}, + mangle: { module: true }, + }) + ).code!, + ); return { min: Buffer.byteLength(minified), brotli: Buffer.byteLength(await brotli(minified)), @@ -142,3 +158,10 @@ function brotli(src: string): Promise { ), ); } + +function stripModuleCode(code: string) { + return code.replace( + /\s*(?:export\s*\{[^}]+\}|import\s*.*\s*from\s*['"][^'"]+['"]);?\s*/gm, + "", + ); +} diff --git a/packages/translator-tags/tsconfig.json b/packages/translator-tags/tsconfig.json index 527777718e..117540d5ae 100644 --- a/packages/translator-tags/tsconfig.json +++ b/packages/translator-tags/tsconfig.json @@ -1,6 +1,7 @@ { "extends": "../../tsconfig.json", "include": ["src"], + "exclude": ["**/__snapshots__"], "compilerOptions": { "outDir": "dist", "rootDir": "src", diff --git a/scripts/sizes.ts b/scripts/sizes.ts index 8a4072af93..666cc5735f 100644 --- a/scripts/sizes.ts +++ b/scripts/sizes.ts @@ -5,11 +5,20 @@ import fs from "fs"; import kleur from "kleur"; import path from "path"; import { format } from "prettier"; -import { type OutputChunk, rollup } from "rollup"; +import { type OutputAsset, type OutputChunk, rollup } from "rollup"; import { table } from "table"; +import { minify } from "terser"; import zlib from "zlib"; const compiledOutputDir = path.join(process.cwd(), ".sizes"); +const nameCacheFile = path.join(process.cwd(), ".sizes", "name-cache.json"); +const nameCache = (() => { + try { + return JSON.parse(fs.readFileSync(nameCacheFile, "utf-8")); + } catch { + return {}; + } +})(); fs.rmSync(compiledOutputDir, { recursive: true }); fs.mkdirSync(compiledOutputDir); @@ -51,6 +60,7 @@ async function run(configPath: string) { console.log(renderTable(current, previous, measure)); writeData(configPath, current); + await fs.promises.writeFile(nameCacheFile, JSON.stringify(nameCache)); } function loadData(configPath: string): Saved { @@ -181,12 +191,26 @@ async function getResults(examples: Record) { return results; } -async function getSizesForSrc(minified: string): Promise { - const [brotlied] = await Promise.all([brotli(minified)]); +async function analyzeChunk(chunk: OutputChunk) { + const { name, code } = chunk; + const minified = stripModuleCode( + ( + await minify(code, { + nameCache, + compress: {}, + mangle: { module: true }, + }) + ).code!, + ); + const sizes = { + min: Buffer.byteLength(minified), + brotli: Buffer.byteLength(await brotli(minified)), + }; return { - min: minified.length, - brotli: brotlied.length, + name: name + ".js", + code: `// size: ${sizes.min} (min) ${sizes.brotli} (brotli)\n${stripModuleCode(code)}`, + sizes, }; } @@ -238,7 +262,7 @@ async function bundleExample(examplePath: string, hydrate: boolean) { )}; import { init } from "@marko/runtime-tags/dom"; init();` : `import template from ${JSON.stringify(examplePath)};template.mount();`, }), - pluginTerser({ compress: {}, mangle: { module: true } }), + pluginTerser({ compress: {}, mangle: false }), ], }); @@ -251,25 +275,20 @@ async function bundleExample(examplePath: string, hydrate: boolean) { } }, }); - const runtimeChunk = output.find( - (o) => o.name === "runtime" && "code" in o, - ) as OutputChunk; - const userCodeChunks = output.filter( - (o) => o !== runtimeChunk && "code" in o, - ) as OutputChunk[]; - const runtimeSize = runtimeChunk && (await getSizesForSrc(runtimeChunk.code)); - const userSize = addSizes( - await Promise.all( - userCodeChunks.map((chunk) => getSizesForSrc(chunk.code)), - ), - ); - const totalSize = addSizes([userSize, runtimeSize].filter(Boolean)); + const runtimeChunk = output.find(isRuntimeChunk); + const [analyzedRuntimeCode, analyzedUserCode] = await Promise.all([ + runtimeChunk && analyzeChunk(runtimeChunk), + Promise.all(output.filter(isUserChunk).map(analyzeChunk)), + ]); + const runtimeSize = analyzedRuntimeCode?.sizes; + const userSize = addSizes(analyzedUserCode.map((it) => it.sizes)); + const totalSize = runtimeSize ? addSizes([userSize, runtimeSize]) : userSize; const files: Record = {}; - for (const chunk of isRuntime ? output : userCodeChunks) { - if (chunk.type === "chunk") { - files[chunk.name + ".js"] = chunk.code; - } + + for (const { name, code } of analyzedUserCode) { + files[name] = code; } + return [userSize, runtimeSize, totalSize, files] as const; } @@ -280,3 +299,20 @@ function brotli(src: string): Promise { ), ); } + +function stripModuleCode(code: string) { + return code.replace( + /\s*(?:export\s*\{[^}]+\}|import\s*.*\s*from\s*['"][^'"]+['"]);?\s*/gm, + "", + ); +} + +function isUserChunk(chunk: OutputChunk | OutputAsset): chunk is OutputChunk { + return chunk.name !== "runtime" && "code" in chunk; +} + +function isRuntimeChunk( + chunk: OutputChunk | OutputAsset, +): chunk is OutputChunk { + return chunk.name === "runtime" && "code" in chunk; +}