ember-primitives 0.39.0 → 0.40.0

package/declarations/dom-context.d.ts

@@ -0,0 +1,58 @@
+import Component from "@glimmer/component";
+import type { Newable } from "./type-utils";
+import type Owner from "@ember/owner";
+export declare class Provide<Data extends object> extends Component<{
+    Args: {
+        /**
+         * What data do you want to provide to the DOM subtree?
+         *
+         * If this is a function or class, it will be instantiated and given an
+         * owner + destroyable linkage via `createStore`
+         */
+        data: Data | (() => Data) | Newable<Data>;
+        /**
+         * Optionally, you may use string-based keys to reference the data in the Provide.
+         *
+         * This is not recommended though, because when using a class or other object-like structure,
+         * the type in the `<Consume>` component can be derived from that class or object-like structure.
+         * With string keys, the `<Consume>` type will be unknown.
+         */
+        key?: string;
+    };
+    Blocks: {
+        /**
+         * The content that this component will _provide_ data to the entire hierarchy.
+         */
+        default: [];
+    };
+}> {
+    get data(): Data;
+    element: HTMLDivElement;
+    constructor(owner: Owner, args: {
+        data: Data | (() => Data) | Newable<Data>;
+        key?: string;
+    });
+}
+type DataForKey<Key> = Key extends string ? unknown : Key extends Newable<infer T> ? T : Key extends () => infer T ? T : Key;
+export declare class Consume<Key extends object | string> extends Component<{
+    Args: {
+        key: Key;
+    };
+    Blocks: {
+        default: [
+            context: {
+                data: DataForKey<Key>;
+            }
+        ];
+    };
+}> {
+    getData: () => DataForKey<Key>;
+    element: HTMLDivElement;
+    constructor(owner: Owner, args: {
+        key: Key;
+    });
+    get context(): {
+        readonly data: DataForKey<Key>;
+    };
+}
+export {};

package/dist/dom-context.js

@@ -0,0 +1,86 @@
+import Component from '@glimmer/component';
+import { tracked, cached } from '@glimmer/tracking';
+import { assert } from '@ember/debug';
+import { createStore } from 'ember-primitives/store';
+import { precompileTemplate } from '@ember/template-compilation';
+import { setComponentTemplate } from '@ember/component';
+import { g, i, n } from 'decorator-transforms/runtime';
+
+const LOOKUP = new WeakMap();
+class Provide extends Component {
+  get data() {
+    assert(`@data is missing in <Provide>. Please pass @data.`, "data" in this.args);
+    /**
+    * This covers both classes and functions
+    */
+    if (typeof this.args.data === "function") {
+      return createStore(this, this.args.data);
+    }
+    /**
+    * Non-instantiable value
+    */
+    return this.args.data;
+  }
+  element;
+  constructor(owner, args) {
+    super(owner, args);
+    const element = document.createElement("div");
+    element.style.display = "contents";
+    const key = this.args.key ?? this.args.data;
+    LOOKUP.set(element, [key, () => this.data]);
+    this.element = element;
+  }
+  static {
+    setComponentTemplate(precompileTemplate("\n    {{this.element}}\n\n    {{#in-element this.element}}\n      {{yield}}\n    {{/in-element}}\n  ", {
+      strictMode: true
+    }), this);
+  }
+}
+function findForKey(startElement, key) {
+  let parent = startElement;
+  while (parent = parent.parentElement) {
+    const maybe = LOOKUP.get(parent);
+    if (!maybe) {
+      continue;
+    }
+    if (maybe[0] === key) {
+      return maybe[1];
+    }
+  }
+}
+class Consume extends Component {
+  static {
+    g(this.prototype, "getData", [tracked]);
+  }
+  #getData = (i(this, "getData"), void 0); // SAFETY: We do a runtime assert in the getter below.
+  element;
+  constructor(owner, args) {
+    super(owner, args);
+    this.element = document.createElement("div");
+    this.element.style.display = "contents";
+  }
+  get context() {
+    // eslint-disable-next-line @typescript-eslint/no-this-alias
+    const self = this;
+    return {
+      get data() {
+        const getData = findForKey(self.element, self.args.key);
+        assert(`Could not find provided context in <Consume>. Please assure that there is a corresponding <Provide> component before using this <Consume> component`, getData);
+        // SAFETY: return type handled by getter's signature
+        // eslint-disable-next-line @typescript-eslint/no-unsafe-return
+        return getData();
+      }
+    };
+  }
+  static {
+    n(this.prototype, "context", [cached]);
+  }
+  static {
+    setComponentTemplate(precompileTemplate("\n    {{this.element}}\n\n    {{#in-element this.element}}\n      {{yield this.context}}\n    {{/in-element}}\n  ", {
+      strictMode: true
+    }), this);
+  }
+}
+
+export { Consume, Provide };
+//# sourceMappingURL=dom-context.js.map

package/dist/dom-context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dom-context.js","sources":["../src/dom-context.gts"],"sourcesContent":["import Component from \"@glimmer/component\";\nimport { cached, tracked } from \"@glimmer/tracking\";\nimport { assert } from \"@ember/debug\";\n\nimport { createStore } from \"ember-primitives/store\";\n\nimport type { Newable } from \"./type-utils\";\nimport type Owner from \"@ember/owner\";\n\n/**\n * IMPLEMENTATION NOTE:\n *   we don't use https://github.com/webcomponents-cg/community-protocols/blob/main/proposals/context.md\n *   because it is not inherently reactive.\n *\n *   Its *event* based, which opts you out of fine-grained reactivity.\n *   We want minimal effort fine-grained reactivity.\n *\n * This Technique follows the DOM tree, and is synchronous,\n * allowing correct fine-grained signals-based reactivity.\n *\n * We *could* do less work to find Providers,\n * but only if we forgoe DOM-tree scoping.\n * We must traverse the DOM hierarchy to validate that we aren't accessing providers from different subtrees.\n */\nconst LOOKUP = new WeakMap<Element, [unknown, () => unknown]>();\n\nexport class Provide<Data extends object> extends Component<{\n  Args: {\n    /**\n     * What data do you want to provide to the DOM subtree?\n     *\n     * If this is a function or class, it will be instantiated and given an\n     * owner + destroyable linkage via `createStore`\n     */\n    data: Data | (() => Data) | Newable<Data>;\n\n    /**\n     * Optionally, you may use string-based keys to reference the data in the Provide.\n     *\n     * This is not recommended though, because when using a class or other object-like structure,\n     * the type in the `<Consume>` component can be derived from that class or object-like structure.\n     * With string keys, the `<Consume>` type will be unknown.\n     */\n    key?: string;\n  };\n  Blocks: {\n    /**\n     * The content that this component will _provide_ data to the entire hierarchy.\n     */\n    default: [];\n  };\n}> {\n  get data() {\n    assert(`@data is missing in <Provide>. Please pass @data.`, \"data\" in this.args);\n\n    /**\n     * This covers both classes and functions\n     */\n    if (typeof this.args.data === \"function\") {\n      return createStore<Data>(this, this.args.data);\n    }\n\n    /**\n     * Non-instantiable value\n     */\n    return this.args.data;\n  }\n\n  element: HTMLDivElement;\n\n  constructor(\n    owner: Owner,\n    args: {\n      data: Data | (() => Data) | Newable<Data>;\n      key?: string;\n    },\n  ) {\n    super(owner, args);\n\n    const element = document.createElement(\"div\");\n\n    element.style.display = \"contents\";\n\n    const key = this.args.key ?? this.args.data;\n\n    LOOKUP.set(element, [key, () => this.data]);\n    this.element = element;\n  }\n\n  <template>\n    {{this.element}}\n\n    {{#in-element this.element}}\n      {{yield}}\n    {{/in-element}}\n  </template>\n}\n\nfunction findForKey<Data>(startElement: Element, key: string | object): undefined | (() => Data) {\n  let parent: Element | null = startElement;\n\n  while ((parent = parent.parentElement)) {\n    const maybe = LOOKUP.get(parent);\n\n    if (!maybe) {\n      continue;\n    }\n\n    if (maybe[0] === key) {\n      return maybe[1] as () => Data;\n    }\n  }\n}\n\ntype DataForKey<Key> = Key extends string\n  ? unknown\n  : Key extends Newable<infer T>\n    ? T\n    : Key extends () => infer T\n      ? T\n      : Key;\n\nexport class Consume<Key extends object | string> extends Component<{\n  Args: {\n    key: Key;\n  };\n  Blocks: {\n    default: [\n      context: {\n        data: DataForKey<Key>;\n      },\n    ];\n  };\n}> {\n  // SAFETY: We do a runtime assert in the getter below.\n  @tracked getData!: () => DataForKey<Key>;\n\n  element: HTMLDivElement;\n\n  constructor(owner: Owner, args: { key: Key }) {\n    super(owner, args);\n\n    this.element = document.createElement(\"div\");\n    this.element.style.display = \"contents\";\n  }\n\n  @cached\n  get context() {\n    // eslint-disable-next-line @typescript-eslint/no-this-alias\n    const self = this;\n\n    return {\n      get data(): DataForKey<Key> {\n        const getData = findForKey<Key>(self.element, self.args.key);\n\n        assert(\n          `Could not find provided context in <Consume>. Please assure that there is a corresponding <Provide> component before using this <Consume> component`,\n          getData,\n        );\n\n        // SAFETY: return type handled by getter's signature\n        // eslint-disable-next-line @typescript-eslint/no-unsafe-return\n        return getData() as any;\n      },\n    };\n  }\n\n  <template>\n    {{this.element}}\n\n    {{#in-element this.element}}\n      {{yield this.context}}\n    {{/in-element}}\n  </template>\n}\n"],"names":["LOOKUP","WeakMap","Provide","Component","data","assert","args","createStore","element","constructor","owner","document","createElement","style","display","key","set","setComponentTemplate","precompileTemplate","strictMode","findForKey","startElement","parent","parentElement","maybe","get","Consume","tracked","i","void 0","context","self","getData","n","prototype","cached"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ember-primitives",
-  "version": "0.39.0",
+  "version": "0.40.0",
   "description": "Making apps easier to build",
   "sideEffects": [
     "*.css"