ember-primitives 0.12.0 → 0.13.0

package/declarations/components/-private/utils.d.ts

@@ -2,5 +2,5 @@
  * If the user provides an onChange or similar function, use that,
  * otherwise fallback to the uncontrolled toggle
  */
-export declare function toggleWithFallback(uncontrolledToggle: () => void, controlledToggle?: () => void): void;
+export declare function toggleWithFallback(uncontrolledToggle: (...args: unknown[]) => void, controlledToggle?: (...args: unknown[]) => void, ...args: unknown[]): void;
 //# sourceMappingURL=utils.d.ts.map

package/declarations/components/-private/utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/components/-private/utils.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,wBAAgB,kBAAkB,CAAC,kBAAkB,EAAE,MAAM,IAAI,EAAE,gBAAgB,CAAC,EAAE,MAAM,IAAI,QAM/F"}
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/components/-private/utils.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,wBAAgB,kBAAkB,CAChC,kBAAkB,EAAE,CAAC,GAAG,IAAI,EAAE,OAAO,EAAE,KAAK,IAAI,EAChD,gBAAgB,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,OAAO,EAAE,KAAK,IAAI,EAC/C,GAAG,IAAI,EAAE,OAAO,EAAE,QAOnB"}

package/declarations/components/toggle-group.d.ts

@@ -0,0 +1,57 @@
+import Component from '@glimmer/component';
+import type { ComponentLike } from '@glint/template';
+export interface ItemSignature<Value = any> {
+    /**
+     * The button element will have aria-pressed="true" on it when the button is in the pressed state.
+     */
+    Element: HTMLButtonElement;
+    Args: {
+        /**
+         * When used in a group of Toggles, this option will be helpful to
+         * know which toggle was pressed if you're using the same @onChange
+         * handler for multiple toggles.
+         */
+        value?: Value;
+    };
+    Blocks: {
+        default: [
+            /**
+             * the current pressed state of the toggle button
+             *
+             * Useful when using the toggle button as an uncontrolled component
+             */
+            pressed: boolean
+        ];
+    };
+}
+export type Item<Value = any> = ComponentLike<ItemSignature<Value>>;
+export declare class ToggleGroup<Value = any> extends Component<{
+    Element: HTMLDivElement;
+    Args: {
+        /**
+         * Optionally set the initial toggle state
+         */
+        value?: Value;
+        /**
+         * Callback for when the toggle-group's state is changed.
+         *
+         * Can be used to control the state of the component.
+         *
+         *
+         * When none of the toggles are selected, undefined will be passed.
+         */
+        onChange: (value: Value | undefined) => void;
+    };
+    Blocks: {
+        default: [
+            {
+                Item: Item;
+            }
+        ];
+    };
+}> {
+    activePressed?: Value;
+    handleToggle: (value: Value) => void;
+    isPressed: (value: Value | undefined) => boolean;
+}
+//# sourceMappingURL=toggle-group.d.ts.map

package/declarations/components/toggle-group.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"toggle-group.d.ts","sourceRoot":"","sources":["../../src/components/toggle-group.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,oBAAoB,CAAC;AAY3C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAUrD,MAAM,WAAW,aAAa,CAAC,KAAK,GAAG,GAAG;IACxC;;OAEG;IACH,OAAO,EAAE,iBAAiB,CAAC;IAC3B,IAAI,EAAE;QACJ;;;;WAIG;QACH,KAAK,CAAC,EAAE,KAAK,CAAC;KACf,CAAC;IACF,MAAM,EAAE;QACN,OAAO,EAAE;YACP;;;;eAIG;YACH,OAAO,EAAE,OAAO;SACjB,CAAC;KACH,CAAC;CACH;AAGD,MAAM,MAAM,IAAI,CAAC,KAAK,GAAG,GAAG,IAAI,aAAa,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC,CAAC;AAGpE,qBAAa,WAAW,CAAC,KAAK,GAAG,GAAG,CAAE,SAAQ,SAAS,CAAC;IACtD,OAAO,EAAE,cAAc,CAAC;IACxB,IAAI,EAAE;QACJ;;WAEG;QACH,KAAK,CAAC,EAAE,KAAK,CAAC;QACd;;;;;;;WAOG;QACH,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,GAAG,SAAS,KAAK,IAAI,CAAC;KAC9C,CAAC;IACF,MAAM,EAAE;QACN,OAAO,EAAE;YACP;gBACE,IAAI,EAAE,IAAI,CAAC;aACZ;SACF,CAAC;KACH,CAAC;CACH,CAAC;IACyB,aAAa,CAAC,EAAE,KAAK,CAAC;IAE/C,YAAY,UAAW,KAAK,UAU1B;IAEF,SAAS,UAAW,KAAK,GAAG,SAAS,aAAkC;CAexE"}

package/declarations/components/toggle.d.ts

@@ -1,5 +1,5 @@
 import type { TOC } from '@ember/component/template-only';
-export interface Signature {
+export interface Signature<Value = any> {
     Element: HTMLButtonElement;
     Args: {
         /**
@@ -12,8 +12,24 @@ export interface Signature {
          * Callback for when the toggle's state is changed.
          *
          * Can be used to control the state of the component.
+         *
+         * if a `@value` is passed to this `<Toggle>`, that @value will
+         * be passed to the `@onChange` handler.
+         *
+         * This can be useful when using the same function for the `@onChange`
+         * handler with multiple `<Toggle>` components.
+         */
+        onChange?: (value?: Value | undefined) => void;
+        /**
+         * When used in a group of Toggles, this option will be helpful to
+         * know which toggle was pressed if you're using the same @onChange
+         * handler for multiple toggles.
+         */
+        value?: Value;
+        /**
+         * When controlling state in a wrapping component, this function can be used in conjunction with `@value` to determine if this `<Toggle>` should appear pressed.
          */
-        onChange?: () => void;
+        isPressed?: (value?: Value | undefined) => boolean;
     };
     Blocks: {
         default: [

package/declarations/components/toggle.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"toggle.d.ts","sourceRoot":"","sources":["../../src/components/toggle.ts"],"names":[],"mappings":";AAOA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,gCAAgC,CAAC;AAE1D,MAAM,WAAW,SAAS;IACxB,OAAO,EAAE,iBAAiB,CAAC;IAC3B,IAAI,EAAE;QACJ;;;;WAIG;QACH,OAAO,CAAC,EAAE,OAAO,CAAC;QAClB;;;;WAIG;QACH,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;KACvB,CAAC;IACF,MAAM,EAAE;QACN,OAAO,EAAE;YACP;;;;eAIG;YACH,OAAO,EAAE,OAAO;SACjB,CAAC;KACH,CAAC;CACH;AAED,eAAO,MAAM,MAAM,EAAE,GAAG,CAAC,SAAS,CAmBhC,CAAC;AAEH,eAAe,MAAM,CAAC"}
+{"version":3,"file":"toggle.d.ts","sourceRoot":"","sources":["../../src/components/toggle.ts"],"names":[],"mappings":";AAOA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,gCAAgC,CAAC;AAG1D,MAAM,WAAW,SAAS,CAAC,KAAK,GAAG,GAAG;IACpC,OAAO,EAAE,iBAAiB,CAAC;IAC3B,IAAI,EAAE;QACJ;;;;WAIG;QACH,OAAO,CAAC,EAAE,OAAO,CAAC;QAClB;;;;;;;;;;WAUG;QACH,QAAQ,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,KAAK,GAAG,SAAS,KAAK,IAAI,CAAC;QAE/C;;;;WAIG;QACH,KAAK,CAAC,EAAE,KAAK,CAAC;QAEd;;WAEG;QACH,SAAS,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,KAAK,GAAG,SAAS,KAAK,OAAO,CAAC;KACpD,CAAC;IACF,MAAM,EAAE;QACN,OAAO,EAAE;YACP;;;;eAIG;YACH,OAAO,EAAE,OAAO;SACjB,CAAC;KACH,CAAC;CACH;AAaD,eAAO,MAAM,MAAM,EAAE,GAAG,CAAC,SAAS,CAmBhC,CAAC;AAEH,eAAe,MAAM,CAAC"}

package/declarations/index.d.ts

@@ -16,5 +16,7 @@ export { Scroller } from "./components/scroller";
 export { Shadowed } from "./components/shadowed";
 export { Switch } from "./components/switch";
 export { Toggle } from "./components/toggle";
+export { ToggleGroup } from "./components/toggle-group";
 export * from './helpers.ts';
+export type { default as SetupService } from './services/ember-primitives/setup.ts';
 //# sourceMappingURL=index.d.ts.map

package/declarations/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAMA,OAAO,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAC;AACvD,YAAY,EACV,iCAAiC,EACjC,gCAAgC,EAChC,8BAA8B,EAC9B,iCAAiC,GAClC,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AACjD,OAAO,EAAE,MAAM,EAAE,MAAM,IAAI,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAClE,OAAO,EAAE,YAAY,EAAE,MAAM,gCAAgC,CAAC;AAC9D,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,YAAY,EAAE,MAAM,6CAA6C,CAAC;AAC3E,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,GAAG,EAAE,QAAQ,EAAE,MAAM,0CAA0C,CAAC;AACzE,OAAO,EAAE,OAAO,EAAE,MAAM,0BAA0B,CAAC;AACnD,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AACjD,OAAO,EAAE,aAAa,EAAE,MAAM,iCAAiC,CAAC;AAChE,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,iCAAiC,CAAC;AACrE,OAAO,EAAE,QAAQ,EAAE,MAAM,2BAA2B,CAAC;AACrD,OAAO,EAAE,QAAQ,EAAE,MAAM,2BAA2B,CAAC;AACrD,OAAO,EAAE,QAAQ,EAAE,MAAM,2BAA2B,CAAC;AACrD,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AACjD,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AACjD,cAAc,cAAc,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAaA,OAAO,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAC;AACvD,YAAY,EACV,iCAAiC,EACjC,gCAAgC,EAChC,8BAA8B,EAC9B,iCAAiC,GAClC,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AACjD,OAAO,EAAE,MAAM,EAAE,MAAM,IAAI,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAClE,OAAO,EAAE,YAAY,EAAE,MAAM,gCAAgC,CAAC;AAC9D,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,YAAY,EAAE,MAAM,6CAA6C,CAAC;AAC3E,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,GAAG,EAAE,QAAQ,EAAE,MAAM,0CAA0C,CAAC;AACzE,OAAO,EAAE,OAAO,EAAE,MAAM,0BAA0B,CAAC;AACnD,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AACjD,OAAO,EAAE,aAAa,EAAE,MAAM,iCAAiC,CAAC;AAChE,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,iCAAiC,CAAC;AACrE,OAAO,EAAE,QAAQ,EAAE,MAAM,2BAA2B,CAAC;AACrD,OAAO,EAAE,QAAQ,EAAE,MAAM,2BAA2B,CAAC;AACrD,OAAO,EAAE,QAAQ,EAAE,MAAM,2BAA2B,CAAC;AACrD,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AACjD,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AACjD,OAAO,EAAE,WAAW,EAAE,MAAM,+BAA+B,CAAC;AAC5D,cAAc,cAAc,CAAC;AAC7B,YAAY,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,sCAAsC,CAAC"}

package/declarations/services/ember-primitives/setup.d.ts

@@ -0,0 +1,27 @@
+import Service from '@ember/service';
+/**
+ * @internal
+ */
+export declare const PRIMITIVES: unique symbol;
+export default class EmberPrimitivesSetup extends Service {
+    #private;
+    /**
+     * Sets up required features for accessibility.
+     */
+    setup: ({ tabster, setTabsterRoot, }?: {
+        /**
+         * Let this setup function initalize tabster.
+         * https://tabster.io/docs/core
+         *
+         * This should be done only once per application as we don't want
+         * focus managers fighting with each other.
+         *
+         * Defaults to `true`,
+         *
+         * Will fallback to an existing tabster instance automatically if `getCurrentTabster` returns a value.
+         */
+        tabster?: boolean | undefined;
+        setTabsterRoot?: boolean | undefined;
+    }) => void;
+}
+//# sourceMappingURL=setup.d.ts.map

package/declarations/services/ember-primitives/setup.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"setup.d.ts","sourceRoot":"","sources":["../../../src/services/ember-primitives/setup.ts"],"names":[],"mappings":";;AACA,OAAO,OAAO,MAAM,gBAAgB,CAAC;AAIrC;;GAEG;AACH,eAAO,MAAM,UAAU,eAAyC,CAAC;AAEjE,MAAM,CAAC,OAAO,OAAO,oBAAqB,SAAQ,OAAO;;IACvD;;OAEG;IACH,KAAK;QAIH;;;;;;;;;;WAUG;;;eAkBH;CAKH"}

package/declarations/test-support/a11y.d.ts

@@ -0,0 +1,7 @@
+import type Owner from '@ember/owner';
+/**
+ * Sets up all support utilities for primitive components.
+ * Including the tabster root.
+ */
+export declare function setup(owner: Owner): void;
+//# sourceMappingURL=a11y.d.ts.map

package/declarations/test-support/a11y.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"a11y.d.ts","sourceRoot":"","sources":["../../src/test-support/a11y.ts"],"names":[],"mappings":";;;;AAGA,OAAO,KAAK,KAAK,MAAM,cAAc,CAAC;AAEtC;;;GAGG;AACH,wBAAgB,KAAK,CAAC,KAAK,EAAE,KAAK,QAQjC"}

package/dist/_app_/components/toggle-group.js

@@ -0,0 +1 @@
+export { default } from "ember-primitives/components/toggle-group";

package/dist/_app_/services/ember-primitives/setup.js

@@ -0,0 +1 @@
+export { default } from "ember-primitives/services/ember-primitives/setup";

package/dist/components/-private/utils.js

@@ -2,11 +2,11 @@
  * If the user provides an onChange or similar function, use that,
  * otherwise fallback to the uncontrolled toggle
  */
-function toggleWithFallback(uncontrolledToggle, controlledToggle) {
+function toggleWithFallback(uncontrolledToggle, controlledToggle, ...args) {
   if (controlledToggle) {
-    return controlledToggle();
+    return controlledToggle(...args);
   }
-  uncontrolledToggle();
+  uncontrolledToggle(...args);
 }
 
 export { toggleWithFallback };

package/dist/components/-private/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sources":["../../../src/components/-private/utils.ts"],"sourcesContent":["/**\n * If the user provides an onChange or similar function, use that,\n * otherwise fallback to the uncontrolled toggle\n */\nexport function toggleWithFallback(uncontrolledToggle: () => void, controlledToggle?: () => void) {\n  if (controlledToggle) {\n    return controlledToggle();\n  }\n\n  uncontrolledToggle();\n}\n"],"names":["toggleWithFallback","uncontrolledToggle","controlledToggle"],"mappings":"AAAA;AACA;AACA;AACA;AACO,SAASA,kBAAkBA,CAACC,kBAA8B,EAAEC,gBAA6B,EAAE;AAChG,EAAA,IAAIA,gBAAgB,EAAE;IACpB,OAAOA,gBAAgB,EAAE,CAAA;AAC3B,GAAA;AAEAD,EAAAA,kBAAkB,EAAE,CAAA;AACtB;;;;"}
+{"version":3,"file":"utils.js","sources":["../../../src/components/-private/utils.ts"],"sourcesContent":["/**\n * If the user provides an onChange or similar function, use that,\n * otherwise fallback to the uncontrolled toggle\n */\nexport function toggleWithFallback(\n  uncontrolledToggle: (...args: unknown[]) => void,\n  controlledToggle?: (...args: unknown[]) => void,\n  ...args: unknown[]\n) {\n  if (controlledToggle) {\n    return controlledToggle(...args);\n  }\n\n  uncontrolledToggle(...args);\n}\n"],"names":["toggleWithFallback","uncontrolledToggle","controlledToggle","args"],"mappings":"AAAA;AACA;AACA;AACA;AACO,SAASA,kBAAkBA,CAChCC,kBAAgD,EAChDC,gBAA+C,EAC/C,GAAGC,IAAe,EAClB;AACA,EAAA,IAAID,gBAAgB,EAAE;AACpB,IAAA,OAAOA,gBAAgB,CAAC,GAAGC,IAAI,CAAC,CAAA;AAClC,GAAA;EAEAF,kBAAkB,CAAC,GAAGE,IAAI,CAAC,CAAA;AAC7B;;;;"}

package/dist/components/toggle-group.js

@@ -0,0 +1,48 @@
+import Component from '@glimmer/component';
+import { Types } from 'tabster';
+import { localCopy } from 'tracked-toolbox';
+import { g, i } from 'decorator-transforms/runtime';
+import { hash } from '@ember/helper';
+import { Toggle } from './toggle.js';
+import { precompileTemplate } from '@ember/template-compilation';
+import { setComponentTemplate } from '@ember/component';
+
+const TABSTER_CONFIG = JSON.stringify({
+  mover: {
+    direction: Types.MoverDirections.Both,
+    cyclic: true
+  }
+});
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+class ToggleGroup extends Component {
+  static {
+    g(this.prototype, "activePressed", [localCopy('args.value')]);
+  }
+  #activePressed = (i(this, "activePressed"), void 0);
+  handleToggle = value1 => {
+    if (this.activePressed === value1) {
+      this.activePressed = undefined;
+      return;
+    }
+    this.activePressed = value1;
+    this.args.onChange?.(this.activePressed);
+  };
+  isPressed = value1 => value1 === this.activePressed;
+  static {
+    setComponentTemplate(precompileTemplate("\n    <div data-tabster={{TABSTER_CONFIG}} ...attributes>\n      {{yield (hash Item=(component Toggle onChange=this.handleToggle isPressed=this.isPressed))}}\n    </div>\n  ", {
+      scope: () => ({
+        TABSTER_CONFIG,
+        hash,
+        Toggle
+      }),
+      strictMode: true
+    }), this);
+  }
+}
+
+export { ToggleGroup };
+//# sourceMappingURL=toggle-group.js.map

package/dist/components/toggle-group.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"toggle-group.js","sources":["../../src/components/toggle-group.gts"],"sourcesContent":["import { template } from \"@ember/template-compiler\";\nimport Component from '@glimmer/component';\nimport { hash } from '@ember/helper';\nimport { Types } from 'tabster';\n// The consumer will need to provide types for tracked-toolbox.\n// Or.. better yet, we PR to trakcked-toolbox to provide them\n// eslint-disable-next-line @typescript-eslint/ban-ts-comment\n// @ts-ignore\nimport { localCopy } from 'tracked-toolbox';\nimport { Toggle } from './toggle.gts';\nimport type { ComponentLike } from '@glint/template';\nconst TABSTER_CONFIG = JSON.stringify({\n    mover: {\n        direction: Types.MoverDirections.Both,\n        cyclic: true\n    }\n});\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport interface ItemSignature<Value = any> {\n    /**\n   * The button element will have aria-pressed=\"true\" on it when the button is in the pressed state.\n   */ Element: HTMLButtonElement;\n    Args: {\n        /**\n     * When used in a group of Toggles, this option will be helpful to\n     * know which toggle was pressed if you're using the same @onChange\n     * handler for multiple toggles.\n     */ value?: Value;\n    };\n    Blocks: {\n        default: [/**\n       * the current pressed state of the toggle button\n       *\n       * Useful when using the toggle button as an uncontrolled component\n       */ pressed: boolean];\n    };\n}\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport type Item<Value = any> = ComponentLike<ItemSignature<Value>>;\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport class ToggleGroup<Value = any> extends Component<{\n    Element: HTMLDivElement;\n    Args: {\n        /**\n     * Optionally set the initial toggle state\n     */ value?: Value;\n        /**\n     * Callback for when the toggle-group's state is changed.\n     *\n     * Can be used to control the state of the component.\n     *\n     *\n     * When none of the toggles are selected, undefined will be passed.\n     */ onChange: (value: Value | undefined) => void;\n    };\n    Blocks: {\n        default: [{\n                Item: Item;\n            }];\n    };\n}> {\n    @localCopy('args.value')\n    activePressed?: Value;\n    handleToggle = (value1: Value)=>{\n        if (this.activePressed === value1) {\n            this.activePressed = undefined;\n            return;\n        }\n        this.activePressed = value1;\n        this.args.onChange?.(this.activePressed);\n    };\n    isPressed = (value1: Value | undefined)=>value1 === this.activePressed;\n    static{\n        template(`\n    <div data-tabster={{TABSTER_CONFIG}} ...attributes>\n      {{yield (hash Item=(component Toggle onChange=this.handleToggle isPressed=this.isPressed))}}\n    </div>\n  `, {\n            component: this,\n            eval () {\n                return eval(arguments[0]);\n            }\n        });\n    }\n}\n"],"names":["TABSTER_CONFIG","JSON","stringify","mover","direction","Types","MoverDirections","Both","cyclic","ToggleGroup","Component","g","this","prototype","localCopy","i","void 0","handleToggle","value1","activePressed","undefined","args","onChange","isPressed","setComponentTemplate","precompileTemplate","scope","hash","Toggle","strictMode"],"mappings":";;;;;;;;;AAWA,MAAMA,cAAc,GAAGC,IAAI,CAACC,SAAS,CAAC;AAClCC,EAAAA,KAAK,EAAE;AACHC,IAAAA,SAAS,EAAEC,KAAK,CAACC,eAAe,CAACC,IAAI;AACrCC,IAAAA,MAAM,EAAE,IAAA;AACZ,GAAA;AACJ,CAAC,CAAC,CAAA;AACF;;AAoBA;;AAEA;AACO,MAAMC,WAAW,SAAsBC,SAAS,CAoBpD;AAAA,EAAA;IAAAC,CAAA,CAAAC,IAAA,CAAAC,SAAA,oBACEC,SAAS,CAAC,YAAY,CAAC,CAAA,CAAA,CAAA;AAAA,GAAA;AAAA,EAAA,cAAA,IAAAC,CAAA,CAAAH,IAAA,oBAAAI,KAAA,CAAA,EAAA;EAExBC,YAAY,GAAIC,MAAa,IAAG;AAC5B,IAAA,IAAI,IAAI,CAACC,aAAa,KAAKD,MAAM,EAAE;MAC/B,IAAI,CAACC,aAAa,GAAGC,SAAS,CAAA;AAC9B,MAAA,OAAA;AACJ,KAAA;IACA,IAAI,CAACD,aAAa,GAAGD,MAAM,CAAA;IAC3B,IAAI,CAACG,IAAI,CAACC,QAAQ,GAAG,IAAI,CAACH,aAAa,CAAC,CAAA;GAC3C,CAAA;AACDI,EAAAA,SAAS,GAAIL,MAAyB,IAAGA,MAAM,KAAK,IAAI,CAACC,aAAa,CAAA;AACtE,EAAA;IACIK,oBAAA,CAAAC,kBAAA,CAIH,+KAAA,EAAA;AAAAC,MAAAA,KAAA,EAAAA,OAAA;QAAA1B,cAAA;QAAA2B,IAAA;AAAAC,QAAAA,MAAAA;AAAA,OAAA,CAAA;MAAAC,UAAA,EAAA,IAAA;KAKI,CAAC,EAJa,IAAI,CAAA,CAAA;AAKvB,GAAA;AACJ;;;;"}

package/dist/components/toggle.js

@@ -6,9 +6,16 @@ import { precompileTemplate } from '@ember/template-compilation';
 import { setComponentTemplate } from '@ember/component';
 import templateOnly from '@ember/component/template-only';
 
-const Toggle = setComponentTemplate(precompileTemplate("\n  {{#let (cell @pressed) as |pressed|}}\n    <button type=\"button\" aria-pressed=\"{{pressed.current}}\" {{on \"click\" (fn toggleWithFallback pressed.toggle @onChange)}} ...attributes>\n      {{yield pressed.current}}\n    </button>\n  {{/let}}\n", {
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+function isPressed(pressed1, value1, isPressed1) {
+  if (!value1) return Boolean(pressed1);
+  if (!isPressed1) return Boolean(pressed1);
+  return isPressed1(value1);
+}
+const Toggle = setComponentTemplate(precompileTemplate("\n  {{#let (cell (isPressed @pressed @value @isPressed)) as |pressed|}}\n    <button type=\"button\" aria-pressed=\"{{pressed.current}}\" {{on \"click\" (fn toggleWithFallback pressed.toggle @onChange @value)}} ...attributes>\n      {{yield pressed.current}}\n    </button>\n  {{/let}}\n", {
   scope: () => ({
     cell,
+    isPressed,
     on,
     fn,
     toggleWithFallback

package/dist/components/toggle.js.map

@@ -1 +1 @@
-{"version":3,"file":"toggle.js","sources":["../../src/components/toggle.gts"],"sourcesContent":["import { template } from \"@ember/template-compiler\";\nimport { fn } from '@ember/helper';\nimport { on } from '@ember/modifier';\nimport { cell } from 'ember-resources';\nimport { toggleWithFallback } from './-private/utils.ts';\nimport type { TOC } from '@ember/component/template-only';\nexport interface Signature {\n    Element: HTMLButtonElement;\n    Args: {\n        /**\n     * The pressed-state of the toggle.\n     *\n     * Can be used to control the state of the component.\n     */ pressed?: boolean;\n        /**\n     * Callback for when the toggle's state is changed.\n     *\n     * Can be used to control the state of the component.\n     */ onChange?: () => void;\n    };\n    Blocks: {\n        default: [/**\n       * the current pressed state of the toggle button\n       *\n       * Useful when using the toggle button as an uncontrolled component\n       */ pressed: boolean];\n    };\n}\nexport const Toggle: TOC<Signature> = template(`\n  {{#let (cell @pressed) as |pressed|}}\n    <button\n      type=\"button\"\n      aria-pressed=\"{{pressed.current}}\"\n      {{on \"click\" (fn toggleWithFallback pressed.toggle @onChange)}}\n      ...attributes\n    >\n      {{yield pressed.current}}\n    </button>\n  {{/let}}\n`, {\n    eval () {\n        return eval(arguments[0]);\n    }\n});\nexport default Toggle;\n"],"names":["Toggle","setComponentTemplate","precompileTemplate","scope","cell","on","fn","toggleWithFallback","strictMode","templateOnly"],"mappings":";;;;;;;;MA4BaA,MAAsB,GAAAC,oBAAA,CAAGC,kBAAA,CAWnC,4PAAA,EAAA;AAAAC,EAAAA,KAAA,EAAAA,OAAA;IAAAC,IAAA;IAAAC,EAAA;IAAAC,EAAA;AAAAC,IAAAA,kBAAAA;AAAA,GAAA,CAAA;EAAAC,UAAA,EAAA,IAAA;AAIH,CAAC,CAAC,EAAAC,YAAA,EAAA;;;;"}
+{"version":3,"file":"toggle.js","sources":["../../src/components/toggle.gts"],"sourcesContent":["import { template } from \"@ember/template-compiler\";\nimport { fn } from '@ember/helper';\nimport { on } from '@ember/modifier';\nimport { cell } from 'ember-resources';\nimport { toggleWithFallback } from './-private/utils.ts';\nimport type { TOC } from '@ember/component/template-only';\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport interface Signature<Value = any> {\n    Element: HTMLButtonElement;\n    Args: {\n        /**\n     * The pressed-state of the toggle.\n     *\n     * Can be used to control the state of the component.\n     */ pressed?: boolean;\n        /**\n     * Callback for when the toggle's state is changed.\n     *\n     * Can be used to control the state of the component.\n     *\n     * if a `@value` is passed to this `<Toggle>`, that @value will\n     * be passed to the `@onChange` handler.\n     *\n     * This can be useful when using the same function for the `@onChange`\n     * handler with multiple `<Toggle>` components.\n     */ onChange?: (value?: Value | undefined) => void;\n        /**\n     * When used in a group of Toggles, this option will be helpful to\n     * know which toggle was pressed if you're using the same @onChange\n     * handler for multiple toggles.\n     */ value?: Value;\n        /**\n     * When controlling state in a wrapping component, this function can be used in conjunction with `@value` to determine if this `<Toggle>` should appear pressed.\n     */ isPressed?: (value?: Value | undefined) => boolean;\n    };\n    Blocks: {\n        default: [/**\n       * the current pressed state of the toggle button\n       *\n       * Useful when using the toggle button as an uncontrolled component\n       */ pressed: boolean];\n    };\n}\nfunction isPressed(pressed1?: boolean, value1?: unknown, isPressed1?: (value?: unknown) => boolean): boolean {\n    if (!value1) return Boolean(pressed1);\n    if (!isPressed1) return Boolean(pressed1);\n    return isPressed1(value1);\n}\nexport const Toggle: TOC<Signature> = template(`\n  {{#let (cell (isPressed @pressed @value @isPressed)) as |pressed|}}\n    <button\n      type=\"button\"\n      aria-pressed=\"{{pressed.current}}\"\n      {{on \"click\" (fn toggleWithFallback pressed.toggle @onChange @value)}}\n      ...attributes\n    >\n      {{yield pressed.current}}\n    </button>\n  {{/let}}\n`, {\n    eval () {\n        return eval(arguments[0]);\n    }\n});\nexport default Toggle;\n"],"names":["isPressed","pressed1","value1","isPressed1","Boolean","Toggle","setComponentTemplate","precompileTemplate","scope","cell","on","fn","toggleWithFallback","strictMode","templateOnly"],"mappings":";;;;;;;;AAMA;AAqCA,SAASA,SAASA,CAACC,QAAkB,EAAEC,MAAgB,EAAEC,UAAyC,EAAW;AACzG,EAAA,IAAI,CAACD,MAAM,EAAE,OAAOE,OAAO,CAACH,QAAQ,CAAC,CAAA;AACrC,EAAA,IAAI,CAACE,UAAU,EAAE,OAAOC,OAAO,CAACH,QAAQ,CAAC,CAAA;EACzC,OAAOE,UAAU,CAACD,MAAM,CAAC,CAAA;AAC7B,CAAA;MACaG,MAAsB,GAAAC,oBAAA,CAAGC,kBAAA,CAWnC,iSAAA,EAAA;AAAAC,EAAAA,KAAA,EAAAA,OAAA;IAAAC,IAAA;IAAAT,SAAA;IAAAU,EAAA;IAAAC,EAAA;AAAAC,IAAAA,kBAAAA;AAAA,GAAA,CAAA;EAAAC,UAAA,EAAA,IAAA;AAIH,CAAC,CAAC,EAAAC,YAAA,EAAA;;;;"}

package/dist/index.js

@@ -16,8 +16,16 @@ export { Scroller } from './components/scroller.js';
 export { Shadowed } from './components/shadowed.js';
 export { Switch } from './components/switch.js';
 export { Toggle } from './components/toggle.js';
+export { ToggleGroup } from './components/toggle-group.js';
 export { service } from './helpers/service.js';
 
+/**
+ * DANGER: this is a *barrel file*
+ *
+ * It forces the whole library to be loaded and all dependencies.
+ *
+ * If you have a small app, you probably don't want to import from here -- instead import from each sub-path.
+ */
 if (macroCondition(isDevelopingApp())) {
   importSync('./components/violations.css');
 }

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../src/index.ts"],"sourcesContent":["import { importSync, isDevelopingApp, macroCondition } from '@embroider/macros';\n\nif (macroCondition(isDevelopingApp())) {\n  importSync('./components/violations.css');\n}\n\nexport { Accordion } from './components/accordion.gts';\nexport type {\n  AccordionContentExternalSignature,\n  AccordionHeaderExternalSignature,\n  AccordionItemExternalSignature,\n  AccordionTriggerExternalSignature,\n} from './components/accordion/public.ts';\nexport { Avatar } from './components/avatar.gts';\nexport { Dialog, Dialog as Modal } from './components/dialog.gts';\nexport { ExternalLink } from './components/external-link.gts';\nexport { Form } from './components/form.gts';\nexport { StickyFooter } from './components/layout/sticky-footer/index.gts';\nexport { Link } from './components/link.gts';\nexport { OTP, OTPInput } from './components/one-time-password/index.gts';\nexport { Popover } from './components/popover.gts';\nexport { Portal } from './components/portal.gts';\nexport { PortalTargets } from './components/portal-targets.gts';\nexport { TARGETS as PORTALS } from './components/portal-targets.gts';\nexport { Progress } from './components/progress.gts';\nexport { Scroller } from './components/scroller.gts';\nexport { Shadowed } from './components/shadowed.gts';\nexport { Switch } from './components/switch.gts';\nexport { Toggle } from './components/toggle.gts';\nexport * from './helpers.ts';\n"],"names":["macroCondition","isDevelopingApp","importSync"],"mappings":";;;;;;;;;;;;;;;;;;;;AAEA,IAAIA,cAAc,CAACC,eAAe,EAAE,CAAC,EAAE;EACrCC,UAAU,CAAC,6BAA6B,CAAC,CAAA;AAC3C"}
+{"version":3,"file":"index.js","sources":["../src/index.ts"],"sourcesContent":["/**\n * DANGER: this is a *barrel file*\n *\n * It forces the whole library to be loaded and all dependencies.\n *\n * If you have a small app, you probably don't want to import from here -- instead import from each sub-path.\n */\nimport { importSync, isDevelopingApp, macroCondition } from '@embroider/macros';\n\nif (macroCondition(isDevelopingApp())) {\n  importSync('./components/violations.css');\n}\n\nexport { Accordion } from './components/accordion.gts';\nexport type {\n  AccordionContentExternalSignature,\n  AccordionHeaderExternalSignature,\n  AccordionItemExternalSignature,\n  AccordionTriggerExternalSignature,\n} from './components/accordion/public.ts';\nexport { Avatar } from './components/avatar.gts';\nexport { Dialog, Dialog as Modal } from './components/dialog.gts';\nexport { ExternalLink } from './components/external-link.gts';\nexport { Form } from './components/form.gts';\nexport { StickyFooter } from './components/layout/sticky-footer/index.gts';\nexport { Link } from './components/link.gts';\nexport { OTP, OTPInput } from './components/one-time-password/index.gts';\nexport { Popover } from './components/popover.gts';\nexport { Portal } from './components/portal.gts';\nexport { PortalTargets } from './components/portal-targets.gts';\nexport { TARGETS as PORTALS } from './components/portal-targets.gts';\nexport { Progress } from './components/progress.gts';\nexport { Scroller } from './components/scroller.gts';\nexport { Shadowed } from './components/shadowed.gts';\nexport { Switch } from './components/switch.gts';\nexport { Toggle } from './components/toggle.gts';\nexport { ToggleGroup } from './components/toggle-group.gts';\nexport * from './helpers.ts';\nexport type { default as SetupService } from './services/ember-primitives/setup.ts';\n"],"names":["macroCondition","isDevelopingApp","importSync"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA,IAAIA,cAAc,CAACC,eAAe,EAAE,CAAC,EAAE;EACrCC,UAAU,CAAC,6BAA6B,CAAC,CAAA;AAC3C"}

package/dist/services/ember-primitives/setup.js

@@ -0,0 +1,35 @@
+import Service from '@ember/service';
+import { getTabster, createTabster, getMover } from 'tabster';
+
+/* eslint-disable @typescript-eslint/no-explicit-any */
+
+/**
+ * @internal
+ */
+const PRIMITIVES = Symbol.for('ember-primitives-globals');
+class EmberPrimitivesSetup extends Service {
+  /**
+   * Sets up required features for accessibility.
+   */
+  setup = ({
+    tabster,
+    setTabsterRoot
+  } = {}) => {
+    tabster ??= true;
+    setTabsterRoot ??= true;
+    if (!tabster) {
+      return;
+    }
+    let existing = getTabster(window);
+    this.#setupTabster(existing ?? createTabster(window));
+    if (setTabsterRoot) {
+      document.body.setAttribute('data-tabster', '{ "root": {} }');
+    }
+  };
+  #setupTabster = tabster => {
+    getMover(tabster);
+  };
+}
+
+export { PRIMITIVES, EmberPrimitivesSetup as default };
+//# sourceMappingURL=setup.js.map

package/dist/services/ember-primitives/setup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"setup.js","sources":["../../../src/services/ember-primitives/setup.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport Service from '@ember/service';\n\nimport { createTabster, getMover, getTabster } from 'tabster';\n\n/**\n * @internal\n */\nexport const PRIMITIVES = Symbol.for('ember-primitives-globals');\n\nexport default class EmberPrimitivesSetup extends Service {\n  /**\n   * Sets up required features for accessibility.\n   */\n  setup = ({\n    tabster,\n    setTabsterRoot,\n  }: {\n    /**\n     * Let this setup function initalize tabster.\n     * https://tabster.io/docs/core\n     *\n     * This should be done only once per application as we don't want\n     * focus managers fighting with each other.\n     *\n     * Defaults to `true`,\n     *\n     * Will fallback to an existing tabster instance automatically if `getCurrentTabster` returns a value.\n     */\n    tabster?: boolean;\n    setTabsterRoot?: boolean;\n  } = {}) => {\n    tabster ??= true;\n    setTabsterRoot ??= true;\n\n    if (!tabster) {\n      return;\n    }\n\n    let existing = getTabster(window);\n\n    this.#setupTabster(existing ?? createTabster(window));\n\n    if (setTabsterRoot) {\n      document.body.setAttribute('data-tabster', '{ \"root\": {} }');\n    }\n  };\n\n  #setupTabster = (tabster: ReturnType<typeof createTabster>) => {\n    getMover(tabster);\n  };\n}\n"],"names":["PRIMITIVES","Symbol","for","EmberPrimitivesSetup","Service","setup","tabster","setTabsterRoot","existing","getTabster","window","createTabster","document","body","setAttribute","getMover"],"mappings":";;;AAAA;;AAKA;AACA;AACA;AACO,MAAMA,UAAU,GAAGC,MAAM,CAACC,GAAG,CAAC,0BAA0B,EAAC;AAEjD,MAAMC,oBAAoB,SAASC,OAAO,CAAC;AACxD;AACF;AACA;AACEC,EAAAA,KAAK,GAAGA,CAAC;IACPC,OAAO;AACPC,IAAAA,cAAAA;GAeD,GAAG,EAAE,KAAK;AACTD,IAAAA,OAAO,KAAK,IAAI,CAAA;AAChBC,IAAAA,cAAc,KAAK,IAAI,CAAA;IAEvB,IAAI,CAACD,OAAO,EAAE;AACZ,MAAA,OAAA;AACF,KAAA;AAEA,IAAA,IAAIE,QAAQ,GAAGC,UAAU,CAACC,MAAM,CAAC,CAAA;IAEjC,IAAI,CAAC,aAAa,CAACF,QAAQ,IAAIG,aAAa,CAACD,MAAM,CAAC,CAAC,CAAA;AAErD,IAAA,IAAIH,cAAc,EAAE;MAClBK,QAAQ,CAACC,IAAI,CAACC,YAAY,CAAC,cAAc,EAAE,gBAAgB,CAAC,CAAA;AAC9D,KAAA;GACD,CAAA;EAED,aAAa,GAAIR,OAAyC,IAAK;IAC7DS,QAAQ,CAACT,OAAO,CAAC,CAAA;GAClB,CAAA;AACH;;;;"}

package/dist/test-support/a11y.js

@@ -0,0 +1,17 @@
+import { assert } from '@ember/debug';
+
+/**
+ * Sets up all support utilities for primitive components.
+ * Including the tabster root.
+ */
+function setup(owner) {
+  let service = owner.lookup('service:ember-primitives/setup');
+  assert('Could not find the ember-primitives service', service);
+  service.setup({
+    setTabsterRoot: false
+  });
+  document.querySelector('#ember-testing')?.setAttribute('data-tabster', '{ "root": {} }');
+}
+
+export { setup };
+//# sourceMappingURL=a11y.js.map

package/dist/test-support/a11y.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"a11y.js","sources":["../../src/test-support/a11y.ts"],"sourcesContent":["import { assert } from '@ember/debug';\n\nimport type SetupService from '../services/ember-primitives/setup.ts';\nimport type Owner from '@ember/owner';\n\n/**\n * Sets up all support utilities for primitive components.\n * Including the tabster root.\n */\nexport function setup(owner: Owner) {\n  let service = owner.lookup('service:ember-primitives/setup');\n\n  assert('Could not find the ember-primitives service', service);\n\n  (service as SetupService).setup({ setTabsterRoot: false });\n\n  document.querySelector('#ember-testing')?.setAttribute('data-tabster', '{ \"root\": {} }');\n}\n"],"names":["setup","owner","service","lookup","assert","setTabsterRoot","document","querySelector","setAttribute"],"mappings":";;AAKA;AACA;AACA;AACA;AACO,SAASA,KAAKA,CAACC,KAAY,EAAE;AAClC,EAAA,IAAIC,OAAO,GAAGD,KAAK,CAACE,MAAM,CAAC,gCAAgC,CAAC,CAAA;AAE5DC,EAAAA,MAAM,CAAC,6CAA6C,EAAEF,OAAO,CAAC,CAAA;EAE7DA,OAAO,CAAkBF,KAAK,CAAC;AAAEK,IAAAA,cAAc,EAAE,KAAA;AAAM,GAAC,CAAC,CAAA;EAE1DC,QAAQ,CAACC,aAAa,CAAC,gBAAgB,CAAC,EAAEC,YAAY,CAAC,cAAc,EAAE,gBAAgB,CAAC,CAAA;AAC1F;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ember-primitives",
-  "version": "0.12.0",
+  "version": "0.13.0",
   "description": "Making apps easier to build",
   "sideEffects": [
     "*.css"
@@ -25,6 +25,7 @@
     "ember-element-helper": "^0.8.4",
     "ember-velcro": "^2.1.3",
     "reactiveweb": "^1.2.0",
+    "tabster": "^7.0.1",
     "tracked-toolbox": "^2.0.0"
   },
   "devDependencies": {
@@ -97,8 +98,10 @@
       "./components/scroller.js": "./dist/_app_/components/scroller.js",
       "./components/shadowed.js": "./dist/_app_/components/shadowed.js",
       "./components/switch.js": "./dist/_app_/components/switch.js",
+      "./components/toggle-group.js": "./dist/_app_/components/toggle-group.js",
       "./components/toggle.js": "./dist/_app_/components/toggle.js",
-      "./helpers/service.js": "./dist/_app_/helpers/service.js"
+      "./helpers/service.js": "./dist/_app_/helpers/service.js",
+      "./services/ember-primitives/setup.js": "./dist/_app_/services/ember-primitives/setup.js"
     }
   },
   "exports": {