@adaptive-ds/solid-ui 0.11.0

package/dist/interactive/tabs/TabsTop.js

@@ -0,0 +1,201 @@
+import { delegateEvents, template, insert, createComponent, effect, setAttribute, className } from "solid-js/web";
+import { Key } from "@solid-primitives/keyed";
+import { createUniqueId } from "solid-js";
+import { classArr } from "../../utils/classArr.js";
+import { tabsTopTextDefault } from "./TabsTopText.js";
+var _tmpl$ = /* @__PURE__ */ template(`<div role=tablist>`), _tmpl$2 = /* @__PURE__ */ template(`<div>`), _tmpl$3 = /* @__PURE__ */ template(`<button type=button role=tab>`), _tmpl$4 = /* @__PURE__ */ template(`<div role=tabpanel tabindex=0>`);
+function TabsTop(p) {
+  const baseId = createUniqueId();
+  return [(() => {
+    var _el$ = _tmpl$();
+    insert(_el$, createComponent(Key, {
+      get each() {
+        return p.getOptions();
+      },
+      by: (value) => value,
+      get fallback() {
+        return createComponent(NoTabOptions, {
+          get ["class"]() {
+            return p.class;
+          },
+          get texts() {
+            return p.texts;
+          }
+        });
+      },
+      children: (value) => createComponent(TabOption, {
+        baseId,
+        get value() {
+          return value();
+        },
+        get valueSignal() {
+          return p.valueSignal;
+        },
+        get disabled() {
+          return p.disabled;
+        },
+        get valueAmount() {
+          return p.valueAmount;
+        },
+        get valueText() {
+          return p.valueText;
+        },
+        get valueChildren() {
+          return p.valueChildren;
+        }
+      })
+    }));
+    effect((_p$) => {
+      var _v$ = p.id, _v$2 = p.disabled, _v$3 = classArr(
+        "flex flex-wrap gap-2",
+        // "grid gap-2 rounded-md p-2",
+        "bg-white dark:bg-black",
+        // bg
+        "border border-slate-200 dark:border-slate-700",
+        // border
+        p.class
+      );
+      _v$ !== _p$.e && setAttribute(_el$, "id", _p$.e = _v$);
+      _v$2 !== _p$.t && setAttribute(_el$, "data-disabled", _p$.t = _v$2);
+      _v$3 !== _p$.a && className(_el$, _p$.a = _v$3);
+      return _p$;
+    }, {
+      e: void 0,
+      t: void 0,
+      a: void 0
+    });
+    return _el$;
+  })(), (() => {
+    var _el$2 = _tmpl$2();
+    insert(_el$2, createComponent(Key, {
+      get each() {
+        return p.getOptions();
+      },
+      by: (value) => value,
+      get fallback() {
+        return createComponent(NoTabOptions, {
+          get ["class"]() {
+            return p.class;
+          },
+          get texts() {
+            return p.texts;
+          }
+        });
+      },
+      children: (value) => createComponent(TabContent, {
+        baseId,
+        get value() {
+          return value();
+        },
+        get valueSignal() {
+          return p.valueSignal;
+        },
+        get disabled() {
+          return p.disabled;
+        },
+        get valueAmount() {
+          return p.valueAmount;
+        },
+        get valueText() {
+          return p.valueText;
+        },
+        get valueChildren() {
+          return p.valueChildren;
+        }
+      })
+    }));
+    return _el$2;
+  })()];
+}
+function NoTabOptions(p) {
+  const texts = p.texts ?? tabsTopTextDefault;
+  return (() => {
+    var _el$3 = _tmpl$2();
+    insert(_el$3, () => texts.noEntries);
+    effect(() => className(_el$3, p.class));
+    return _el$3;
+  })();
+}
+function TabOption(p) {
+  return (() => {
+    var _el$4 = _tmpl$3();
+    _el$4.$$click = (e) => setActiveTab(p);
+    insert(_el$4, () => getText(p));
+    effect((_p$) => {
+      var _v$4 = isSelected(p), _v$5 = makeTriggerId(p.baseId, p.value), _v$6 = makeContentId(p.baseId, p.value), _v$7 = isSelected(p) ? "active" : "inactive", _v$8 = p.disabled, _v$9 = p.disabled, _v$0 = classArr(
+        // "block",
+        "cursor-pointer select-none",
+        "rounded-sm",
+        "px-3 py-2 text-center",
+        isSelected(p) ? "bg-blue-500 text-white" : "hover:bg-slate-50 dark:hover:bg-slate-900",
+        // bg hover
+        "flex gap-2",
+        p.class
+      );
+      _v$4 !== _p$.e && setAttribute(_el$4, "aria-selected", _p$.e = _v$4);
+      _v$5 !== _p$.t && setAttribute(_el$4, "id", _p$.t = _v$5);
+      _v$6 !== _p$.a && setAttribute(_el$4, "aria-controls", _p$.a = _v$6);
+      _v$7 !== _p$.o && setAttribute(_el$4, "data-state", _p$.o = _v$7);
+      _v$8 !== _p$.i && setAttribute(_el$4, "data-disabled", _p$.i = _v$8);
+      _v$9 !== _p$.n && (_el$4.disabled = _p$.n = _v$9);
+      _v$0 !== _p$.s && className(_el$4, _p$.s = _v$0);
+      return _p$;
+    }, {
+      e: void 0,
+      t: void 0,
+      a: void 0,
+      o: void 0,
+      i: void 0,
+      n: void 0,
+      s: void 0
+    });
+    return _el$4;
+  })();
+}
+function TabContent(p) {
+  return (() => {
+    var _el$5 = _tmpl$4();
+    insert(_el$5, () => p.valueChildren(p.value));
+    effect((_p$) => {
+      var _v$1 = makeContentId(p.baseId, p.value), _v$10 = isSelected(p) ? "active" : "inactive", _v$11 = makeTriggerId(p.baseId, p.value), _v$12 = !isSelected(p), _v$13 = classArr("");
+      _v$1 !== _p$.e && setAttribute(_el$5, "id", _p$.e = _v$1);
+      _v$10 !== _p$.t && setAttribute(_el$5, "data-state", _p$.t = _v$10);
+      _v$11 !== _p$.a && setAttribute(_el$5, "aria-labelledby", _p$.a = _v$11);
+      _v$12 !== _p$.o && (_el$5.hidden = _p$.o = _v$12);
+      _v$13 !== _p$.i && className(_el$5, _p$.i = _v$13);
+      return _p$;
+    }, {
+      e: void 0,
+      t: void 0,
+      a: void 0,
+      o: void 0,
+      i: void 0
+    });
+    return _el$5;
+  })();
+}
+function makeTriggerId(baseId, value) {
+  return `${baseId}-${value}-trigger`;
+}
+function makeContentId(baseId, value) {
+  return `${baseId}-${value}-content`;
+}
+function setActiveTab(p) {
+  let prev = p.valueSignal.get();
+  if (prev === p.value) return;
+  p.valueSignal.set(p.value);
+}
+function isSelected(p) {
+  return p.value === p.valueSignal.get();
+}
+function getText(p) {
+  const amount = p.valueAmount?.(p.value);
+  const text = p.valueText?.(p.value) || p.value;
+  if (!amount) return text;
+  return `${text} (${amount})`;
+}
+delegateEvents(["click"]);
+export {
+  TabsTop
+};
+//# sourceMappingURL=TabsTop.js.map

package/dist/interactive/tabs/TabsTop.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TabsTop.js","sources":["../../../lib/interactive/tabs/TabsTop.tsx"],"sourcesContent":["import { Key } from \"@solid-primitives/keyed\"\nimport type { JSXElement } from \"solid-js\"\nimport { createUniqueId } from \"solid-js\"\nimport { classArr } from \"~ui/utils/classArr\"\nimport type { SignalObject } from \"~ui/utils/createSignalObject\"\nimport type { HasGetOptions } from \"~ui/utils/HasGetOptions\"\nimport type { HasValueSignalString } from \"~ui/utils/HasValueSignalString\"\nimport type { MayHaveValueText } from \"~ui/utils/HasValueText\"\nimport type { MayHaveChildren } from \"~ui/utils/MayHaveChildren\"\nimport type { MayHaveClass } from \"~ui/utils/MayHaveClass\"\nimport type { TabsTopText } from \"~ui/interactive/tabs/TabsTopText\"\nimport { tabsTopTextDefault } from \"~ui/interactive/tabs/TabsTopText\"\n\nexport interface TabsTopProps\n  extends HasValueSignalString,\n    HasGetOptions,\n    MayHaveValueText,\n    MayHaveChildren,\n    MayHaveClass {\n  valueIcon?: (value: string) => string\n  valueAmount?: (value: string) => number | undefined\n  valueChildren: (value: string) => JSXElement\n  id?: string\n  disabled?: boolean\n  texts?: TabsTopText\n}\n\n/**\n * https://www.radix-ui.com/primitives/docs/components/tabs\n * https://github.com/radix-ui/primitives/blob/main/packages/react/tabs/src/Tabs.tsx\n **/\nexport function TabsTop(p: TabsTopProps) {\n  const baseId = createUniqueId()\n  return (\n    <>\n      <div\n        id={p.id}\n        role=\"tablist\"\n        data-disabled={p.disabled}\n        class={classArr(\n          \"flex flex-wrap gap-2\",\n          // \"grid gap-2 rounded-md p-2\",\n          \"bg-white dark:bg-black\", // bg\n          \"border border-slate-200 dark:border-slate-700\", // border\n          p.class,\n        )}\n      >\n        <Key each={p.getOptions()} by={(value) => value} fallback={<NoTabOptions class={p.class} texts={p.texts} />}>\n          {(value) => (\n            <TabOption\n              baseId={baseId}\n              value={value()}\n              valueSignal={p.valueSignal}\n              disabled={p.disabled}\n              valueAmount={p.valueAmount}\n              valueText={p.valueText}\n              valueChildren={p.valueChildren}\n            />\n          )}\n        </Key>\n      </div>\n      <div>\n        <Key each={p.getOptions()} by={(value) => value} fallback={<NoTabOptions class={p.class} texts={p.texts} />}>\n          {(value) => (\n            <TabContent\n              baseId={baseId}\n              value={value()}\n              valueSignal={p.valueSignal}\n              disabled={p.disabled}\n              valueAmount={p.valueAmount}\n              valueText={p.valueText}\n              valueChildren={p.valueChildren}\n            />\n          )}\n        </Key>\n      </div>\n    </>\n  )\n}\n\nfunction NoTabOptions(p: { class?: string; texts?: TabsTopText }) {\n  const texts = p.texts ?? tabsTopTextDefault\n  return <div class={p.class}>{texts.noEntries}</div>\n}\n\ninterface TabOptionProps extends MayHaveClass {\n  baseId: string\n  value: string\n  valueSignal: SignalObject<string>\n  disabled?: boolean\n  valueAmount?: (value: string) => number | undefined\n  valueText?: (value: string) => string\n  valueChildren: (value: string) => JSXElement\n}\n\nfunction TabOption(p: TabOptionProps): JSXElement {\n  // console.log(\"TabOption\", p.value, \"value:\", p.valueSignal.get())\n  return (\n    <button\n      type=\"button\"\n      role=\"tab\"\n      aria-selected={isSelected(p)}\n      id={makeTriggerId(p.baseId, p.value)}\n      aria-controls={makeContentId(p.baseId, p.value)}\n      data-state={isSelected(p) ? \"active\" : \"inactive\"}\n      data-disabled={p.disabled}\n      disabled={p.disabled}\n      class={classArr(\n        // \"block\",\n        \"cursor-pointer select-none\",\n        \"rounded-sm\",\n        \"px-3 py-2 text-center\",\n        isSelected(p) ? \"bg-blue-500 text-white\" : \"hover:bg-slate-50 dark:hover:bg-slate-900\", // bg hover\n        \"flex gap-2\",\n        p.class,\n      )}\n      onClick={(e) => setActiveTab(p)}\n    >\n      {getText(p)}\n    </button>\n  )\n}\n\nfunction TabContent(p: TabOptionProps): JSXElement {\n  return (\n    <div\n      id={makeContentId(p.baseId, p.value)}\n      role=\"tabpanel\"\n      data-state={isSelected(p) ? \"active\" : \"inactive\"}\n      aria-labelledby={makeTriggerId(p.baseId, p.value)}\n      hidden={!isSelected(p)}\n      tabIndex={0}\n      class={classArr(\"\")}\n    >\n      {p.valueChildren(p.value)}\n    </div>\n  )\n}\n\nfunction makeTriggerId(baseId: string, value: string) {\n  return `${baseId}-${value}-trigger`\n}\n\nfunction makeContentId(baseId: string, value: string) {\n  return `${baseId}-${value}-content`\n}\n\ninterface SetActiveTabProps extends HasValueSignalString {\n  value: string\n}\n\nfunction setActiveTab(p: SetActiveTabProps) {\n  let prev = p.valueSignal.get()\n  // console.log(\"setActiveTab\", p.value, \"prev:\", prev)\n  if (prev === p.value) return\n  p.valueSignal.set(p.value)\n}\n\ninterface OptionProps {\n  value: string\n  valueSignal: SignalObject<string>\n}\n\nfunction isSelected(p: OptionProps) {\n  return p.value === p.valueSignal.get()\n}\n\ninterface GetTextProps {\n  value: string\n  valueAmount?: (value: string) => number | undefined\n  valueText?: (value: string) => string\n}\n\nfunction getText(p: GetTextProps): string {\n  const amount = p.valueAmount?.(p.value)\n  const text = p.valueText?.(p.value) || p.value\n  if (!amount) return text\n  return `${text} (${amount})`\n}\n"],"names":["TabsTop","p","baseId","createUniqueId","_el$","_tmpl$","_$insert","_$createComponent","Key","each","getOptions","by","value","fallback","NoTabOptions","class","texts","children","TabOption","valueSignal","disabled","valueAmount","valueText","valueChildren","_$effect","_p$","_v$","id","_v$2","_v$3","classArr","e","_$setAttribute","t","a","_$className","undefined","_el$2","_tmpl$2","TabContent","tabsTopTextDefault","_el$3","noEntries","_el$4","_tmpl$3","$$click","setActiveTab","getText","_v$4","isSelected","_v$5","makeTriggerId","_v$6","makeContentId","_v$7","_v$8","_v$9","_v$0","o","i","n","s","_el$5","_tmpl$4","_v$1","_v$10","_v$11","_v$12","_v$13","hidden","prev","get","set","amount","text","_$delegateEvents"],"mappings":"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"}

package/dist/interactive/tabs/TabsTopText.d.ts

@@ -0,0 +1,7 @@
+export type TabsTopText = {
+    noEntries: string;
+};
+export declare const tabsTopTextDefault: {
+    readonly noEntries: string;
+};
+//# sourceMappingURL=TabsTopText.d.ts.map

package/dist/interactive/tabs/TabsTopText.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TabsTopText.d.ts","sourceRoot":"","sources":["../../../lib/interactive/tabs/TabsTopText.ts"],"names":[],"mappings":"AAEA,MAAM,MAAM,WAAW,GAAG;IACxB,SAAS,EAAE,MAAM,CAAA;CAClB,CAAA;AAED,eAAO,MAAM,kBAAkB;;CAEC,CAAA"}

package/dist/interactive/tabs/TabsTopText.js

@@ -0,0 +1,8 @@
+import { ttt } from "../../i18n/ttt.js";
+const tabsTopTextDefault = {
+  noEntries: ttt("No entries")
+};
+export {
+  tabsTopTextDefault
+};
+//# sourceMappingURL=TabsTopText.js.map

package/dist/interactive/tabs/TabsTopText.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TabsTopText.js","sources":["../../../lib/interactive/tabs/TabsTopText.ts"],"sourcesContent":["import { ttt } from \"~ui/i18n/ttt\"\n\nexport type TabsTopText = {\n  noEntries: string\n}\n\nexport const tabsTopTextDefault = {\n  noEntries: ttt(\"No entries\"),\n} as const satisfies TabsTopText\n"],"names":[],"mappings":";AAMO,MAAM,qBAAqB;AAAA,EAChC,WAAW,IAAI,YAAY;AAC7B;"}

package/dist/interactive/theme/ThemeButton.d.ts

@@ -0,0 +1,8 @@
+import { MayHaveClass } from '../../utils/MayHaveClass';
+import { ThemeButtonText } from './ThemeButtonText';
+export interface ThemeButtonProps extends MayHaveClass {
+    showText?: boolean;
+    texts?: ThemeButtonText;
+}
+export declare function ThemeButton(p: ThemeButtonProps): import("solid-js").JSX.Element;
+//# sourceMappingURL=ThemeButton.d.ts.map

package/dist/interactive/theme/ThemeButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ThemeButton.d.ts","sourceRoot":"","sources":["../../../lib/interactive/theme/ThemeButton.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAA;AAC1D,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,uCAAuC,CAAA;AAG5E,MAAM,WAAW,gBAAiB,SAAQ,YAAY;IACpD,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,KAAK,CAAC,EAAE,eAAe,CAAA;CACxB;AAED,wBAAgB,WAAW,CAAC,CAAC,EAAE,gBAAgB,kCA0B9C"}

package/dist/interactive/theme/ThemeButton.js

@@ -0,0 +1,51 @@
+import { createComponent } from "solid-js/web";
+import { createEffect, onCleanup } from "solid-js";
+import { buttonVariant } from "../button/buttonCva.js";
+import { ButtonIconOnly } from "../button/ButtonIconOnly.js";
+import { themeInit, themeSignal, themeRotate } from "./themeSignal.js";
+import { themeIcon } from "./themeVariant.js";
+import { classMerge } from "../../utils/classMerge.js";
+import { themeButtonTextDefault } from "./ThemeButtonText.js";
+function ThemeButton(p) {
+  createEffect(themeInit);
+  const handleGlobalKeyDown = createGlobalKeyHandler();
+  const texts = p.texts ?? themeButtonTextDefault;
+  createEffect(() => {
+    window.addEventListener("keydown", handleGlobalKeyDown);
+    onCleanup(() => window.removeEventListener("keydown", handleGlobalKeyDown));
+  });
+  const currentTheme = themeSignal.get();
+  const themeName = texts[currentTheme];
+  return createComponent(ButtonIconOnly, {
+    get title() {
+      return texts.currentTheme(themeName);
+    },
+    get icon() {
+      return themeIcon(currentTheme);
+    },
+    get variant() {
+      return buttonVariant.ghost;
+    },
+    get ["class"]() {
+      return classMerge(p.class);
+    },
+    onClick: themeRotate,
+    get children() {
+      return p.showText && themeName;
+    }
+  });
+}
+function createGlobalKeyHandler(navigate) {
+  return (e) => {
+    if (e.key === "s" && e.altKey) {
+      e.preventDefault();
+      themeRotate();
+    } else if (e.key === "d" && e.altKey) {
+      e.preventDefault();
+    }
+  };
+}
+export {
+  ThemeButton
+};
+//# sourceMappingURL=ThemeButton.js.map

package/dist/interactive/theme/ThemeButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ThemeButton.js","sources":["../../../lib/interactive/theme/ThemeButton.tsx"],"sourcesContent":["import { createEffect, onCleanup } from \"solid-js\"\nimport { buttonVariant } from \"~ui/interactive/button/buttonCva\"\nimport { ButtonIconOnly } from \"~ui/interactive/button/ButtonIconOnly\"\nimport { themeInit, themeRotate, themeSignal } from \"~ui/interactive/theme/themeSignal\"\nimport { themeIcon } from \"~ui/interactive/theme/themeVariant\"\nimport { classMerge } from \"~ui/utils/classMerge\"\nimport type { MayHaveClass } from \"~ui/utils/MayHaveClass\"\nimport type { ThemeButtonText } from \"~ui/interactive/theme/ThemeButtonText\"\nimport { themeButtonTextDefault } from \"~ui/interactive/theme/ThemeButtonText\"\n\nexport interface ThemeButtonProps extends MayHaveClass {\n  showText?: boolean\n  texts?: ThemeButtonText\n}\n\nexport function ThemeButton(p: ThemeButtonProps) {\n  createEffect(themeInit)\n  const navigate = (to: string) => {}\n  const handleGlobalKeyDown = createGlobalKeyHandler(navigate)\n\n  const texts = p.texts ?? themeButtonTextDefault\n\n  createEffect(() => {\n    window.addEventListener(\"keydown\", handleGlobalKeyDown)\n    onCleanup(() => window.removeEventListener(\"keydown\", handleGlobalKeyDown))\n  })\n\n  const currentTheme = themeSignal.get()\n  const themeName = texts[currentTheme]\n\n  return (\n    <ButtonIconOnly\n      title={texts.currentTheme(themeName)}\n      icon={themeIcon(currentTheme)}\n      variant={buttonVariant.ghost}\n      class={classMerge(p.class)}\n      onClick={themeRotate}\n    >\n      {p.showText && themeName}\n    </ButtonIconOnly>\n  )\n}\n\nfunction createGlobalKeyHandler(navigate: (to: string) => void) {\n  return (e: KeyboardEvent) => {\n    if (e.key === \"s\" && e.altKey) {\n      e.preventDefault()\n      themeRotate()\n    } else if (e.key === \"d\" && e.altKey) {\n      e.preventDefault()\n      navigate(\"/demos\")\n    }\n  }\n}\n"],"names":["ThemeButton","p","createEffect","themeInit","handleGlobalKeyDown","createGlobalKeyHandler","texts","themeButtonTextDefault","window","addEventListener","onCleanup","removeEventListener","currentTheme","themeSignal","get","themeName","_$createComponent","ButtonIconOnly","title","icon","themeIcon","variant","buttonVariant","ghost","classMerge","class","onClick","themeRotate","children","showText","navigate","e","key","altKey","preventDefault"],"mappings":";;;;;;;;AAeO,SAASA,YAAYC,GAAqB;AAC/CC,eAAaC,SAAS;AAEtB,QAAMC,sBAAsBC,uBAA+B;AAE3D,QAAMC,QAAQL,EAAEK,SAASC;AAEzBL,eAAa,MAAM;AACjBM,WAAOC,iBAAiB,WAAWL,mBAAmB;AACtDM,cAAU,MAAMF,OAAOG,oBAAoB,WAAWP,mBAAmB,CAAC;AAAA,EAC5E,CAAC;AAED,QAAMQ,eAAeC,YAAYC,IAAAA;AACjC,QAAMC,YAAYT,MAAMM,YAAY;AAEpC,SAAAI,gBACGC,gBAAc;AAAA,IAAA,IACbC,QAAK;AAAA,aAAEZ,MAAMM,aAAaG,SAAS;AAAA,IAAC;AAAA,IAAA,IACpCI,OAAI;AAAA,aAAEC,UAAUR,YAAY;AAAA,IAAC;AAAA,IAAA,IAC7BS,UAAO;AAAA,aAAEC,cAAcC;AAAAA,IAAK;AAAA,IAAA,KAAA,OAAA,IAAA;AAAA,aACrBC,WAAWvB,EAAEwB,KAAK;AAAA,IAAC;AAAA,IAC1BC,SAASC;AAAAA,IAAW,IAAAC,WAAA;AAAA,aAEnB3B,EAAE4B,YAAYd;AAAAA,IAAS;AAAA,EAAA,CAAA;AAG9B;AAEA,SAASV,uBAAuByB,UAAgC;AAC9D,SAAO,CAACC,MAAqB;AAC3B,QAAIA,EAAEC,QAAQ,OAAOD,EAAEE,QAAQ;AAC7BF,QAAEG,eAAAA;AACFP,kBAAAA;AAAAA,IACF,WAAWI,EAAEC,QAAQ,OAAOD,EAAEE,QAAQ;AACpCF,QAAEG,eAAAA;AAAAA,IAEJ;AAAA,EACF;AACF;"}

package/dist/interactive/theme/ThemeButtonText.d.ts

@@ -0,0 +1,15 @@
+export type ThemeButtonText = {
+    light: string;
+    dark: string;
+    os: string;
+    currentTheme: (theme: string) => string;
+    setTheme: (theme: string) => string;
+};
+export declare const themeButtonTextDefault: {
+    readonly light: string;
+    readonly dark: string;
+    readonly os: string;
+    readonly currentTheme: (theme: string) => string;
+    readonly setTheme: (theme: string) => string;
+};
+//# sourceMappingURL=ThemeButtonText.d.ts.map

package/dist/interactive/theme/ThemeButtonText.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ThemeButtonText.d.ts","sourceRoot":"","sources":["../../../lib/interactive/theme/ThemeButtonText.ts"],"names":[],"mappings":"AAEA,MAAM,MAAM,eAAe,GAAG;IAC5B,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,MAAM,CAAA;IACZ,EAAE,EAAE,MAAM,CAAA;IACV,YAAY,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAA;IACvC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAA;CACpC,CAAA;AAED,eAAO,MAAM,sBAAsB;;;;mCAIX,MAAM;+BACV,MAAM;CACU,CAAA"}

package/dist/interactive/theme/ThemeButtonText.js

@@ -0,0 +1,12 @@
+import { ttt1, ttt } from "../../i18n/ttt.js";
+const themeButtonTextDefault = {
+  light: ttt("Light"),
+  dark: ttt("Dark"),
+  os: ttt("Operation system"),
+  currentTheme: (theme) => ttt1("Current theme: [X]", theme),
+  setTheme: (theme) => ttt1("Theme set: [X]", theme)
+};
+export {
+  themeButtonTextDefault
+};
+//# sourceMappingURL=ThemeButtonText.js.map

package/dist/interactive/theme/ThemeButtonText.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ThemeButtonText.js","sources":["../../../lib/interactive/theme/ThemeButtonText.ts"],"sourcesContent":["import { ttt, ttt1 } from \"~ui/i18n/ttt\"\n\nexport type ThemeButtonText = {\n  light: string\n  dark: string\n  os: string\n  currentTheme: (theme: string) => string\n  setTheme: (theme: string) => string\n}\n\nexport const themeButtonTextDefault = {\n  light: ttt(\"Light\"),\n  dark: ttt(\"Dark\"),\n  os: ttt(\"Operation system\"),\n  currentTheme: (theme: string) => ttt1(\"Current theme: [X]\", theme),\n  setTheme: (theme: string) => ttt1(\"Theme set: [X]\", theme),\n} as const satisfies ThemeButtonText\n"],"names":[],"mappings":";AAUO,MAAM,yBAAyB;AAAA,EACpC,OAAO,IAAI,OAAO;AAAA,EAClB,MAAM,IAAI,MAAM;AAAA,EAChB,IAAI,IAAI,kBAAkB;AAAA,EAC1B,cAAc,CAAC,UAAkB,KAAK,sBAAsB,KAAK;AAAA,EACjE,UAAU,CAAC,UAAkB,KAAK,kBAAkB,KAAK;AAC3D;"}

package/dist/interactive/theme/themeSignal.d.ts

@@ -0,0 +1,6 @@
+import { ThemeVariant } from './themeVariant';
+export declare const themeSignal: import('../../utils/createSignalObject').SignalObject<"dark" | "light" | "os">;
+export declare function themeInit(): void;
+export declare function themeSet(theme: ThemeVariant, saveToStorage: boolean): void;
+export declare function themeRotate(): void;
+//# sourceMappingURL=themeSignal.d.ts.map

package/dist/interactive/theme/themeSignal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"themeSignal.d.ts","sourceRoot":"","sources":["../../../lib/interactive/theme/themeSignal.ts"],"names":[],"mappings":"AAEA,OAAO,EAOL,KAAK,YAAY,EAElB,MAAM,oCAAoC,CAAA;AAK3C,eAAO,MAAM,WAAW,8EAAoD,CAAA;AAE5E,wBAAgB,SAAS,SAIxB;AAED,wBAAgB,QAAQ,CAAC,KAAK,EAAE,YAAY,EAAE,aAAa,EAAE,OAAO,QAKnE;AAmBD,wBAAgB,WAAW,SAS1B"}

package/dist/interactive/theme/themeSignal.js

@@ -0,0 +1,50 @@
+import * as v from "valibot";
+import { themeButtonTextDefault } from "./ThemeButtonText.js";
+import { themeVariant, getThemeFromStorageOrBrowserPref, setThemeToBrowser, themeLocalStorageKey, nextTheme2, themeIcon, themeSchema } from "./themeVariant.js";
+import { toastAdd } from "../toast/toastAdd.js";
+import { toastVariant } from "../toast/toastVariant.js";
+import { createSignalObject } from "../../utils/createSignalObject.js";
+const themeSignal = createSignalObject(themeVariant.os);
+function themeInit() {
+  const theme = getThemeFromStorageOrBrowserPref();
+  themeSet(theme, false);
+  themeRegisterStorageListener();
+}
+function themeSet(theme, saveToStorage) {
+  themeSignal.set(theme);
+  setThemeToBrowser(theme);
+  if (!saveToStorage) return;
+  localStorage.setItem(themeLocalStorageKey, theme);
+}
+function themeRegisterStorageListener() {
+  const onStorage = (e) => {
+    if (e.key !== themeLocalStorageKey) return;
+    const themeString = e.newValue;
+    const result = v.safeParse(themeSchema, themeString);
+    if (!result.success) {
+      console.log("failed to parse storage event");
+      return;
+    }
+    themeSet(result.output, false);
+  };
+  window.addEventListener("storage", onStorage);
+  return () => {
+    window.removeEventListener("storage", onStorage);
+  };
+}
+function themeRotate() {
+  const currentTheme = themeSignal.get();
+  const newTheme = nextTheme2(currentTheme);
+  const themeText = themeButtonTextDefault[newTheme];
+  const title = themeButtonTextDefault.setTheme(themeText);
+  const icon = themeIcon(newTheme);
+  toastAdd({ title, icon, variant: toastVariant.default });
+  themeSet(newTheme, true);
+}
+export {
+  themeInit,
+  themeRotate,
+  themeSet,
+  themeSignal
+};
+//# sourceMappingURL=themeSignal.js.map

package/dist/interactive/theme/themeSignal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"themeSignal.js","sources":["../../../lib/interactive/theme/themeSignal.ts"],"sourcesContent":["import * as v from \"valibot\"\nimport { themeButtonTextDefault } from \"~ui/interactive/theme/ThemeButtonText\"\nimport {\n  getThemeFromStorageOrBrowserPref,\n  nextTheme2,\n  setThemeToBrowser,\n  themeIcon,\n  themeLocalStorageKey,\n  themeSchema,\n  type ThemeVariant,\n  themeVariant,\n} from \"~ui/interactive/theme/themeVariant\"\nimport { toastAdd } from \"~ui/interactive/toast/toastAdd\"\nimport { toastVariant } from \"~ui/interactive/toast/toastVariant\"\nimport { createSignalObject } from \"~ui/utils/createSignalObject\"\n\nexport const themeSignal = createSignalObject<ThemeVariant>(themeVariant.os)\n\nexport function themeInit() {\n  const theme = getThemeFromStorageOrBrowserPref()\n  themeSet(theme, false)\n  themeRegisterStorageListener()\n}\n\nexport function themeSet(theme: ThemeVariant, saveToStorage: boolean) {\n  themeSignal.set(theme)\n  setThemeToBrowser(theme)\n  if (!saveToStorage) return\n  localStorage.setItem(themeLocalStorageKey, theme)\n}\n\nfunction themeRegisterStorageListener() {\n  const onStorage = (e: StorageEvent) => {\n    if (e.key !== themeLocalStorageKey) return\n    const themeString = e.newValue\n    const result = v.safeParse(themeSchema, themeString)\n    if (!result.success) {\n      console.log(\"failed to parse storage event\")\n      return\n    }\n    themeSet(result.output, false)\n  }\n  window.addEventListener(\"storage\", onStorage)\n  return () => {\n    window.removeEventListener(\"storage\", onStorage)\n  }\n}\n\nexport function themeRotate() {\n  const currentTheme = themeSignal.get()\n  const newTheme = nextTheme2(currentTheme)\n\n  const themeText = themeButtonTextDefault[newTheme]\n  const title = themeButtonTextDefault.setTheme(themeText)\n  const icon = themeIcon(newTheme)\n  toastAdd({ title, icon, variant: toastVariant.default })\n  themeSet(newTheme, true)\n}\n"],"names":[],"mappings":";;;;;;AAgBO,MAAM,cAAc,mBAAiC,aAAa,EAAE;AAEpE,SAAS,YAAY;AAC1B,QAAM,QAAQ,iCAAA;AACd,WAAS,OAAO,KAAK;AACrB,+BAAA;AACF;AAEO,SAAS,SAAS,OAAqB,eAAwB;AACpE,cAAY,IAAI,KAAK;AACrB,oBAAkB,KAAK;AACvB,MAAI,CAAC,cAAe;AACpB,eAAa,QAAQ,sBAAsB,KAAK;AAClD;AAEA,SAAS,+BAA+B;AACtC,QAAM,YAAY,CAAC,MAAoB;AACrC,QAAI,EAAE,QAAQ,qBAAsB;AACpC,UAAM,cAAc,EAAE;AACtB,UAAM,SAAS,EAAE,UAAU,aAAa,WAAW;AACnD,QAAI,CAAC,OAAO,SAAS;AACnB,cAAQ,IAAI,+BAA+B;AAC3C;AAAA,IACF;AACA,aAAS,OAAO,QAAQ,KAAK;AAAA,EAC/B;AACA,SAAO,iBAAiB,WAAW,SAAS;AAC5C,SAAO,MAAM;AACX,WAAO,oBAAoB,WAAW,SAAS;AAAA,EACjD;AACF;AAEO,SAAS,cAAc;AAC5B,QAAM,eAAe,YAAY,IAAA;AACjC,QAAM,WAAW,WAAW,YAAY;AAExC,QAAM,YAAY,uBAAuB,QAAQ;AACjD,QAAM,QAAQ,uBAAuB,SAAS,SAAS;AACvD,QAAM,OAAO,UAAU,QAAQ;AAC/B,WAAS,EAAE,OAAO,MAAM,SAAS,aAAa,SAAS;AACvD,WAAS,UAAU,IAAI;AACzB;"}

package/dist/interactive/theme/themeVariant.d.ts

@@ -0,0 +1,20 @@
+import * as v from "valibot";
+export type ThemeVariant = keyof typeof themeVariant;
+export declare const themeVariant: {
+    readonly light: "light";
+    readonly dark: "dark";
+    readonly os: "os";
+};
+export declare const themeSchema: v.EnumSchema<{
+    readonly light: "light";
+    readonly dark: "dark";
+    readonly os: "os";
+}, undefined>;
+export declare const themeLocalStorageKey = "theme";
+export declare function nextTheme3(current: string | undefined): ThemeVariant;
+export declare function nextTheme2(current: string | undefined): ThemeVariant;
+export declare function themeIcon(t: string | undefined): string;
+export declare function setThemeToBrowser(t: ThemeVariant): void;
+export declare function getThemeFromBrowserPref(): "dark" | "light";
+export declare function getThemeFromStorageOrBrowserPref(): ThemeVariant;
+//# sourceMappingURL=themeVariant.d.ts.map

package/dist/interactive/theme/themeVariant.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"themeVariant.d.ts","sourceRoot":"","sources":["../../../lib/interactive/theme/themeVariant.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,CAAC,MAAM,SAAS,CAAA;AAE5B,MAAM,MAAM,YAAY,GAAG,MAAM,OAAO,YAAY,CAAA;AAEpD,eAAO,MAAM,YAAY;;;;CAIf,CAAA;AAEV,eAAO,MAAM,WAAW;;;;aAAuB,CAAA;AAE/C,eAAO,MAAM,oBAAoB,UAAU,CAAA;AAE3C,wBAAgB,UAAU,CAAC,OAAO,EAAE,MAAM,GAAG,SAAS,GAAG,YAAY,CAWpE;AAED,wBAAgB,UAAU,CAAC,OAAO,EAAE,MAAM,GAAG,SAAS,GAAG,YAAY,CAWpE;AAED,wBAAgB,SAAS,CAAC,CAAC,EAAE,MAAM,GAAG,SAAS,UAS9C;AAED,wBAAgB,iBAAiB,CAAC,CAAC,EAAE,YAAY,QAShD;AAmBD,wBAAgB,uBAAuB,qBAItC;AAED,wBAAgB,gCAAgC,IAAI,YAAY,CAiB/D"}

package/dist/interactive/theme/themeVariant.js

@@ -0,0 +1,95 @@
+import { mdiBrightnessAuto, mdiWeatherNight, mdiWhiteBalanceSunny } from "@mdi/js";
+import * as v from "valibot";
+const themeVariant = {
+  light: "light",
+  dark: "dark",
+  os: "os"
+};
+const themeSchema = v.enum(themeVariant);
+const themeLocalStorageKey = "theme";
+function nextTheme3(current) {
+  switch (current) {
+    case themeVariant.light:
+      return themeVariant.dark;
+    case themeVariant.dark:
+      return themeVariant.os;
+    case themeVariant.os:
+      return themeVariant.light;
+    default:
+      return themeVariant.dark;
+  }
+}
+function nextTheme2(current) {
+  switch (current) {
+    case themeVariant.light:
+      return themeVariant.dark;
+    case themeVariant.dark:
+      return themeVariant.light;
+    case themeVariant.os:
+      return themeVariant.light;
+    default:
+      return themeVariant.dark;
+  }
+}
+function themeIcon(t) {
+  switch (t) {
+    case themeVariant.light:
+      return mdiWhiteBalanceSunny;
+    case themeVariant.dark:
+      return mdiWeatherNight;
+    default:
+      return mdiBrightnessAuto;
+  }
+}
+function setThemeToBrowser(t) {
+  switch (t) {
+    case themeVariant.light:
+      return setBrowserThemeLight();
+    case themeVariant.dark:
+      return setBrowserThemeDark();
+    case themeVariant.os:
+      return setBrowserThemeOs();
+  }
+}
+function setBrowserThemeDark() {
+  document.documentElement.classList.add("dark");
+}
+function setBrowserThemeLight() {
+  document.documentElement.classList.remove("dark");
+}
+function setBrowserThemeOs() {
+  const prefersDark = window.matchMedia("(prefers-color-scheme: dark)").matches;
+  if (prefersDark) setBrowserThemeDark();
+  else setBrowserThemeLight();
+}
+function getThemeFromBrowserPref() {
+  const prefersDark = window.matchMedia("(prefers-color-scheme: dark)").matches;
+  if (prefersDark) return themeVariant.dark;
+  return themeVariant.light;
+}
+function getThemeFromStorageOrBrowserPref() {
+  if (typeof window === "undefined") {
+    return getThemeFromBrowserPref();
+  }
+  const stored = localStorage?.getItem(themeLocalStorageKey) ?? null;
+  if (!stored) {
+    return getThemeFromBrowserPref();
+  }
+  const result = v.safeParse(themeSchema, stored);
+  if (!result.success) {
+    return getThemeFromBrowserPref();
+  }
+  return result.output;
+}
+export {
+  getThemeFromBrowserPref,
+  getThemeFromStorageOrBrowserPref,
+  nextTheme2,
+  nextTheme3,
+  setThemeToBrowser,
+  themeIcon,
+  themeLocalStorageKey,
+  themeSchema,
+  themeVariant
+};
+//# sourceMappingURL=themeVariant.js.map

package/dist/interactive/theme/themeVariant.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"themeVariant.js","sources":["../../../lib/interactive/theme/themeVariant.ts"],"sourcesContent":["import { mdiBrightnessAuto, mdiWeatherNight, mdiWhiteBalanceSunny } from \"@mdi/js\"\nimport * as v from \"valibot\"\n\nexport type ThemeVariant = keyof typeof themeVariant\n\nexport const themeVariant = {\n  light: \"light\",\n  dark: \"dark\",\n  os: \"os\",\n} as const\n\nexport const themeSchema = v.enum(themeVariant)\n\nexport const themeLocalStorageKey = \"theme\"\n\nexport function nextTheme3(current: string | undefined): ThemeVariant {\n  switch (current) {\n    case themeVariant.light:\n      return themeVariant.dark\n    case themeVariant.dark:\n      return themeVariant.os\n    case themeVariant.os:\n      return themeVariant.light\n    default:\n      return themeVariant.dark\n  }\n}\n\nexport function nextTheme2(current: string | undefined): ThemeVariant {\n  switch (current) {\n    case themeVariant.light:\n      return themeVariant.dark\n    case themeVariant.dark:\n      return themeVariant.light\n    case themeVariant.os:\n      return themeVariant.light\n    default:\n      return themeVariant.dark\n  }\n}\n\nexport function themeIcon(t: string | undefined) {\n  switch (t) {\n    case themeVariant.light:\n      return mdiWhiteBalanceSunny\n    case themeVariant.dark:\n      return mdiWeatherNight\n    default:\n      return mdiBrightnessAuto // mdiWhiteBalanceAuto\n  }\n}\n\nexport function setThemeToBrowser(t: ThemeVariant) {\n  switch (t) {\n    case themeVariant.light:\n      return setBrowserThemeLight()\n    case themeVariant.dark:\n      return setBrowserThemeDark()\n    case themeVariant.os:\n      return setBrowserThemeOs()\n  }\n}\n\nfunction setBrowserThemeDark() {\n  // console.log(\"setBrowserThemeDark\")\n  document.documentElement.classList.add(\"dark\")\n}\n\nfunction setBrowserThemeLight() {\n  // console.log(\"setBrowserThemeLight\")\n  document.documentElement.classList.remove(\"dark\")\n}\n\n// 2023: 93% - https://caniuse.com/?search=prefers-color-scheme\nfunction setBrowserThemeOs() {\n  const prefersDark = window.matchMedia(\"(prefers-color-scheme: dark)\").matches\n  if (prefersDark) setBrowserThemeDark()\n  else setBrowserThemeLight()\n}\n\nexport function getThemeFromBrowserPref() {\n  const prefersDark = window.matchMedia(\"(prefers-color-scheme: dark)\").matches\n  if (prefersDark) return themeVariant.dark\n  return themeVariant.light\n}\n\nexport function getThemeFromStorageOrBrowserPref(): ThemeVariant {\n  const op = \"getThemeFromStorageOrBrowserPref\"\n  if (typeof window === \"undefined\") {\n    // console.log(op, \"themeInit: window undefined\")\n    return getThemeFromBrowserPref()\n  }\n  const stored = localStorage?.getItem(themeLocalStorageKey) ?? null\n  if (!stored) {\n    // console.log(op, \"!stored\", stored)\n    return getThemeFromBrowserPref()\n  }\n  const result = v.safeParse(themeSchema, stored)\n  if (!result.success) {\n    // console.log(op, \"!parsed.success\", result.issues, stored)\n    return getThemeFromBrowserPref()\n  }\n  return result.output\n}\n"],"names":[],"mappings":";;AAKO,MAAM,eAAe;AAAA,EAC1B,OAAO;AAAA,EACP,MAAM;AAAA,EACN,IAAI;AACN;AAEO,MAAM,cAAc,EAAE,KAAK,YAAY;AAEvC,MAAM,uBAAuB;AAE7B,SAAS,WAAW,SAA2C;AACpE,UAAQ,SAAA;AAAA,IACN,KAAK,aAAa;AAChB,aAAO,aAAa;AAAA,IACtB,KAAK,aAAa;AAChB,aAAO,aAAa;AAAA,IACtB,KAAK,aAAa;AAChB,aAAO,aAAa;AAAA,IACtB;AACE,aAAO,aAAa;AAAA,EAAA;AAE1B;AAEO,SAAS,WAAW,SAA2C;AACpE,UAAQ,SAAA;AAAA,IACN,KAAK,aAAa;AAChB,aAAO,aAAa;AAAA,IACtB,KAAK,aAAa;AAChB,aAAO,aAAa;AAAA,IACtB,KAAK,aAAa;AAChB,aAAO,aAAa;AAAA,IACtB;AACE,aAAO,aAAa;AAAA,EAAA;AAE1B;AAEO,SAAS,UAAU,GAAuB;AAC/C,UAAQ,GAAA;AAAA,IACN,KAAK,aAAa;AAChB,aAAO;AAAA,IACT,KAAK,aAAa;AAChB,aAAO;AAAA,IACT;AACE,aAAO;AAAA,EAAA;AAEb;AAEO,SAAS,kBAAkB,GAAiB;AACjD,UAAQ,GAAA;AAAA,IACN,KAAK,aAAa;AAChB,aAAO,qBAAA;AAAA,IACT,KAAK,aAAa;AAChB,aAAO,oBAAA;AAAA,IACT,KAAK,aAAa;AAChB,aAAO,kBAAA;AAAA,EAAkB;AAE/B;AAEA,SAAS,sBAAsB;AAE7B,WAAS,gBAAgB,UAAU,IAAI,MAAM;AAC/C;AAEA,SAAS,uBAAuB;AAE9B,WAAS,gBAAgB,UAAU,OAAO,MAAM;AAClD;AAGA,SAAS,oBAAoB;AAC3B,QAAM,cAAc,OAAO,WAAW,8BAA8B,EAAE;AACtE,MAAI,YAAa,qBAAA;AAAA,MACZ,sBAAA;AACP;AAEO,SAAS,0BAA0B;AACxC,QAAM,cAAc,OAAO,WAAW,8BAA8B,EAAE;AACtE,MAAI,oBAAoB,aAAa;AACrC,SAAO,aAAa;AACtB;AAEO,SAAS,mCAAiD;AAE/D,MAAI,OAAO,WAAW,aAAa;AAEjC,WAAO,wBAAA;AAAA,EACT;AACA,QAAM,SAAS,cAAc,QAAQ,oBAAoB,KAAK;AAC9D,MAAI,CAAC,QAAQ;AAEX,WAAO,wBAAA;AAAA,EACT;AACA,QAAM,SAAS,EAAE,UAAU,aAAa,MAAM;AAC9C,MAAI,CAAC,OAAO,SAAS;AAEnB,WAAO,wBAAA;AAAA,EACT;AACA,SAAO,OAAO;AAChB;"}

package/dist/interactive/toast/GlobalToasterState.d.ts

@@ -0,0 +1,7 @@
+import { ToastPropsInternal } from './ToastProps';
+export type GlobalToasterState = {
+    toasts: ToastPropsInternal[];
+    timeouts: Record<string, ReturnType<typeof setTimeout>>;
+};
+export declare function createToasterState(): GlobalToasterState;
+//# sourceMappingURL=GlobalToasterState.d.ts.map

package/dist/interactive/toast/GlobalToasterState.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GlobalToasterState.d.ts","sourceRoot":"","sources":["../../../lib/interactive/toast/GlobalToasterState.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,kCAAkC,CAAA;AAE1E,MAAM,MAAM,kBAAkB,GAAG;IAC/B,MAAM,EAAE,kBAAkB,EAAE,CAAA;IAC5B,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC,CAAA;CACxD,CAAA;AAED,wBAAgB,kBAAkB,IAAI,kBAAkB,CAEvD"}

package/dist/interactive/toast/GlobalToasterState.js

@@ -0,0 +1,7 @@
+function createToasterState() {
+  return { toasts: [], timeouts: {} };
+}
+export {
+  createToasterState
+};
+//# sourceMappingURL=GlobalToasterState.js.map

package/dist/interactive/toast/GlobalToasterState.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GlobalToasterState.js","sources":["../../../lib/interactive/toast/GlobalToasterState.ts"],"sourcesContent":["import type { ToastPropsInternal } from \"~ui/interactive/toast/ToastProps\"\n\nexport type GlobalToasterState = {\n  toasts: ToastPropsInternal[]\n  timeouts: Record<string, ReturnType<typeof setTimeout>>\n}\n\nexport function createToasterState(): GlobalToasterState {\n  return { toasts: [], timeouts: {} }\n}\n"],"names":[],"mappings":"AAOO,SAAS,qBAAyC;AACvD,SAAO,EAAE,QAAQ,IAAI,UAAU,CAAA,EAAC;AAClC;"}

package/dist/interactive/toast/Toast.d.ts

@@ -0,0 +1,3 @@
+import { ToastPropsInternal } from './ToastProps';
+export declare function Toast(p: ToastPropsInternal): import("solid-js").JSX.Element;
+//# sourceMappingURL=Toast.d.ts.map

package/dist/interactive/toast/Toast.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toast.d.ts","sourceRoot":"","sources":["../../../lib/interactive/toast/Toast.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,kBAAkB,EAAc,MAAM,kCAAkC,CAAA;AAOtF,wBAAgB,KAAK,CAAC,CAAC,EAAE,kBAAkB,kCAgB1C"}