@smwb/ui-solid 0.11.1 → 0.12.0

package/dist/headless/components/feedBack/saveAssetDialog/saveAssetDialog.js

@@ -1,12 +1,12 @@
-import { createComponent as r, insert as l, effect as s, setAttribute as g, className as p, template as u } from "solid-js/web";
-import { splitProps as b, Show as o } from "solid-js";
-import v from "clsx";
+import { createComponent as r, insert as l, effect as s, setAttribute as p, className as b, template as c } from "solid-js/web";
+import { splitProps as v, Show as o } from "solid-js";
+import h from "clsx";
 import { Modal as a } from "../modal/modal.js";
 import { TextField as C } from "../../inputs/textField/textField.js";
 import { Button as i } from "../../inputs/button/button.js";
-var h = /* @__PURE__ */ u("<div class=smwb-save-asset-dialog__preview><img alt>"), f = /* @__PURE__ */ u("<div>");
-function $(c) {
-  const [e] = b(c, ["open", "title", "nameLabel", "name", "onNameChange", "previewSrc", "onCapture", "captureLabel", "busy", "confirmLabel", "cancelLabel", "onConfirm", "onClose", "children", "class"]), m = () => e.onNameChange !== void 0 || e.name !== void 0;
+var f = /* @__PURE__ */ c("<div class=smwb-save-asset-dialog__preview><img alt>"), w = /* @__PURE__ */ c("<div>");
+function k(m) {
+  const [e] = v(m, ["open", "title", "nameLabel", "name", "onNameChange", "previewSrc", "onCapture", "captureLabel", "busy", "confirmLabel", "cancelLabel", "onConfirm", "onClose", "children", "class"]), d = () => e.onNameChange !== void 0 || e.name !== void 0, u = () => e.title ?? "Save";
   return r(a, {
     get open() {
       return e.open;
@@ -14,18 +14,21 @@ function $(c) {
     get onClose() {
       return e.onClose;
     },
-    size: "small",
+    size: "medium",
+    get "aria-label"() {
+      return u();
+    },
     get children() {
       return [r(a.Header, {
         get children() {
-          return e.title ?? "Save";
+          return u();
         }
       }), r(a.Content, {
         get children() {
-          var t = f();
+          var t = w();
           return l(t, r(o, {
             get when() {
-              return m();
+              return d();
             },
             get children() {
               return r(C, {
@@ -35,6 +38,7 @@ function $(c) {
                 get value() {
                   return e.name ?? "";
                 },
+                fullWidth: !0,
                 get disabled() {
                   return !!e.busy;
                 },
@@ -46,8 +50,8 @@ function $(c) {
               return e.previewSrc;
             },
             get children() {
-              var n = h(), d = n.firstChild;
-              return s(() => g(d, "src", e.previewSrc)), n;
+              var n = f(), g = n.firstChild;
+              return s(() => p(g, "src", e.previewSrc)), n;
             }
           }), null), l(t, r(o, {
             get when() {
@@ -66,7 +70,7 @@ function $(c) {
                 }
               });
             }
-          }), null), l(t, () => e.children, null), s(() => p(t, v("smwb-save-asset-dialog__body", e.class))), t;
+          }), null), l(t, () => e.children, null), s(() => b(t, h("smwb-save-asset-dialog__body", e.class))), t;
         }
       }), r(a.Footer, {
         get children() {
@@ -95,6 +99,6 @@ function $(c) {
   });
 }
 export {
-  $ as SaveAssetDialog
+  k as SaveAssetDialog
 };
 //# sourceMappingURL=saveAssetDialog.js.map

package/dist/headless/components/feedBack/saveAssetDialog/saveAssetDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"saveAssetDialog.js","sources":["../../../../../src/components/feedBack/saveAssetDialog/saveAssetDialog.tsx"],"sourcesContent":["import { type JSX, Show, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Modal } from \"../modal\";\nimport { Button } from \"../../inputs/button\";\nimport { TextField } from \"../../inputs/textField\";\n\nexport interface SaveAssetDialogProps {\n  open: boolean;\n  title?: string;\n  /** Label for the name field. Omit `onNameChange` AND `name` to hide the field. */\n  nameLabel?: string;\n  name?: string;\n  onNameChange?: (name: string) => void;\n  /** Preview image URL (e.g. a freshly captured thumbnail). */\n  previewSrc?: string;\n  /** Shows a Capture button when provided. */\n  onCapture?: () => void;\n  captureLabel?: string;\n  /** Disables the actions + name field while a save/capture is in flight. */\n  busy?: boolean;\n  confirmLabel?: string;\n  cancelLabel?: string;\n  onConfirm: () => void;\n  onClose: () => void;\n  /** Extra content between the name field/preview and the actions. */\n  children?: JSX.Element;\n  class?: string;\n}\n\n/**\n * A \"name it / preview a thumbnail / confirm-cancel\" dialog on `Modal` — the\n * save/capture flow apps hand-build for every asset. Pairs with srv-solid's\n * asset store: `onConfirm` uploads the captured `previewSrc`.\n */\nexport function SaveAssetDialog(props: SaveAssetDialogProps): JSX.Element {\n  const [local] = splitProps(props, [\n    \"open\",\n    \"title\",\n    \"nameLabel\",\n    \"name\",\n    \"onNameChange\",\n    \"previewSrc\",\n    \"onCapture\",\n    \"captureLabel\",\n    \"busy\",\n    \"confirmLabel\",\n    \"cancelLabel\",\n    \"onConfirm\",\n    \"onClose\",\n    \"children\",\n    \"class\",\n  ]);\n\n  const showNameField = (): boolean => local.onNameChange !== undefined || local.name !== undefined;\n\n  return (\n    <Modal open={local.open} onClose={local.onClose} size=\"small\">\n      <Modal.Header>{local.title ?? \"Save\"}</Modal.Header>\n      <Modal.Content>\n        <div class={cn(\"smwb-save-asset-dialog__body\", local.class)}>\n          <Show when={showNameField()}>\n            <TextField\n              label={local.nameLabel ?? \"Name\"}\n              value={local.name ?? \"\"}\n              disabled={!!local.busy}\n              onChange={(event) => local.onNameChange?.((event.currentTarget as HTMLInputElement).value)}\n            />\n          </Show>\n          <Show when={local.previewSrc}>\n            <div class=\"smwb-save-asset-dialog__preview\">\n              <img src={local.previewSrc} alt=\"\" />\n            </div>\n          </Show>\n          <Show when={local.onCapture}>\n            <Button\n              variant=\"outlined\"\n              size=\"small\"\n              disabled={!!local.busy}\n              onClick={() => local.onCapture?.()}\n              label={local.captureLabel ?? \"Capture preview\"}\n            />\n          </Show>\n          {local.children}\n        </div>\n      </Modal.Content>\n      <Modal.Footer>\n        <Button variant=\"text\" disabled={!!local.busy} onClick={() => local.onClose()} label={local.cancelLabel ?? \"Cancel\"} />\n        <Button variant=\"contained\" disabled={!!local.busy} onClick={() => local.onConfirm()} label={local.confirmLabel ?? \"Save\"} />\n      </Modal.Footer>\n    </Modal>\n  );\n}\n\nexport default SaveAssetDialog;\n"],"names":["SaveAssetDialog","props","local","splitProps","showNameField","onNameChange","undefined","name","_$createComponent","Modal","open","onClose","size","children","Header","title","Content","_el$","_tmpl$2","_$insert","Show","when","TextField","label","nameLabel","value","disabled","busy","onChange","event","currentTarget","previewSrc","_el$2","_tmpl$","_el$3","firstChild","_$effect","_$setAttribute","onCapture","Button","variant","onClick","captureLabel","_$className","cn","class","Footer","cancelLabel","onConfirm","confirmLabel"],"mappings":"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"}
+{"version":3,"file":"saveAssetDialog.js","sources":["../../../../../src/components/feedBack/saveAssetDialog/saveAssetDialog.tsx"],"sourcesContent":["import { type JSX, Show, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Modal } from \"../modal\";\nimport { Button } from \"../../inputs/button\";\nimport { TextField } from \"../../inputs/textField\";\n\nexport interface SaveAssetDialogProps {\n  open: boolean;\n  title?: string;\n  /** Label for the name field. Omit `onNameChange` AND `name` to hide the field. */\n  nameLabel?: string;\n  name?: string;\n  onNameChange?: (name: string) => void;\n  /** Preview image URL (e.g. a freshly captured thumbnail). */\n  previewSrc?: string;\n  /** Shows a Capture button when provided. */\n  onCapture?: () => void;\n  captureLabel?: string;\n  /** Disables the actions + name field while a save/capture is in flight. */\n  busy?: boolean;\n  confirmLabel?: string;\n  cancelLabel?: string;\n  onConfirm: () => void;\n  onClose: () => void;\n  /** Extra content between the name field/preview and the actions. */\n  children?: JSX.Element;\n  class?: string;\n}\n\n/**\n * A \"name it / preview a thumbnail / confirm-cancel\" dialog on `Modal` — the\n * save/capture flow apps hand-build for every asset. Pairs with srv-solid's\n * asset store: `onConfirm` uploads the captured `previewSrc`.\n */\nexport function SaveAssetDialog(props: SaveAssetDialogProps): JSX.Element {\n  const [local] = splitProps(props, [\n    \"open\",\n    \"title\",\n    \"nameLabel\",\n    \"name\",\n    \"onNameChange\",\n    \"previewSrc\",\n    \"onCapture\",\n    \"captureLabel\",\n    \"busy\",\n    \"confirmLabel\",\n    \"cancelLabel\",\n    \"onConfirm\",\n    \"onClose\",\n    \"children\",\n    \"class\",\n  ]);\n\n  const showNameField = (): boolean => local.onNameChange !== undefined || local.name !== undefined;\n  // The visible heading also names the dialog for screen readers.\n  const heading = (): string => local.title ?? \"Save\";\n\n  return (\n    <Modal open={local.open} onClose={local.onClose} size=\"medium\" aria-label={heading()}>\n      <Modal.Header>{heading()}</Modal.Header>\n      <Modal.Content>\n        <div class={cn(\"smwb-save-asset-dialog__body\", local.class)}>\n          <Show when={showNameField()}>\n            <TextField\n              label={local.nameLabel ?? \"Name\"}\n              value={local.name ?? \"\"}\n              fullWidth\n              disabled={!!local.busy}\n              onChange={(event) => local.onNameChange?.((event.currentTarget as HTMLInputElement).value)}\n            />\n          </Show>\n          <Show when={local.previewSrc}>\n            <div class=\"smwb-save-asset-dialog__preview\">\n              <img src={local.previewSrc} alt=\"\" />\n            </div>\n          </Show>\n          <Show when={local.onCapture}>\n            <Button\n              variant=\"outlined\"\n              size=\"small\"\n              disabled={!!local.busy}\n              onClick={() => local.onCapture?.()}\n              label={local.captureLabel ?? \"Capture preview\"}\n            />\n          </Show>\n          {local.children}\n        </div>\n      </Modal.Content>\n      <Modal.Footer>\n        <Button variant=\"text\" disabled={!!local.busy} onClick={() => local.onClose()} label={local.cancelLabel ?? \"Cancel\"} />\n        <Button variant=\"contained\" disabled={!!local.busy} onClick={() => local.onConfirm()} label={local.confirmLabel ?? \"Save\"} />\n      </Modal.Footer>\n    </Modal>\n  );\n}\n\nexport default SaveAssetDialog;\n"],"names":["SaveAssetDialog","props","local","splitProps","showNameField","onNameChange","undefined","name","heading","title","_$createComponent","Modal","open","onClose","size","children","Header","Content","_el$","_tmpl$2","_$insert","Show","when","TextField","label","nameLabel","value","fullWidth","disabled","busy","onChange","event","currentTarget","previewSrc","_el$2","_tmpl$","_el$3","firstChild","_$effect","_$setAttribute","onCapture","Button","variant","onClick","captureLabel","_$className","cn","class","Footer","cancelLabel","onConfirm","confirmLabel"],"mappings":";;;;;;;AAkCO,SAASA,EAAgBC,GAA0C;AACxE,QAAM,CAACC,CAAK,IAAIC,EAAWF,GAAO,CAChC,QACA,SACA,aACA,QACA,gBACA,cACA,aACA,gBACA,QACA,gBACA,eACA,aACA,WACA,YACA,OAAO,CACR,GAEKG,IAAgBA,MAAeF,EAAMG,iBAAiBC,UAAaJ,EAAMK,SAASD,QAElFE,IAAUA,MAAcN,EAAMO,SAAS;AAE7C,SAAAC,EACGC,GAAK;AAAA,IAAA,IAACC,OAAI;AAAA,aAAEV,EAAMU;AAAAA,IAAI;AAAA,IAAA,IAAEC,UAAO;AAAA,aAAEX,EAAMW;AAAAA,IAAO;AAAA,IAAEC,MAAI;AAAA,IAAA,IAAA,eAAA;AAAA,aAAsBN,EAAAA;AAAAA,IAAS;AAAA,IAAA,IAAAO,WAAA;AAAA,aAAA,CAAAL,EACjFC,EAAMK,QAAM;AAAA,QAAA,IAAAD,WAAA;AAAA,iBAAEP,EAAAA;AAAAA,QAAS;AAAA,MAAA,CAAA,GAAAE,EACvBC,EAAMM,SAAO;AAAA,QAAA,IAAAF,WAAA;AAAA,cAAAG,IAAAC,EAAAA;AAAAC,iBAAAA,EAAAF,GAAAR,EAETW,GAAI;AAAA,YAAA,IAACC,OAAI;AAAA,qBAAElB,EAAAA;AAAAA,YAAe;AAAA,YAAA,IAAAW,WAAA;AAAA,qBAAAL,EACxBa,GAAS;AAAA,gBAAA,IACRC,QAAK;AAAA,yBAAEtB,EAAMuB,aAAa;AAAA,gBAAM;AAAA,gBAAA,IAChCC,QAAK;AAAA,yBAAExB,EAAMK,QAAQ;AAAA,gBAAE;AAAA,gBACvBoB,WAAS;AAAA,gBAAA,IACTC,WAAQ;AAAA,yBAAE,CAAC,CAAC1B,EAAM2B;AAAAA,gBAAI;AAAA,gBACtBC,UAAWC,CAAAA,MAAU7B,EAAMG,eAAgB0B,EAAMC,cAAmCN,KAAK;AAAA,cAAA,CAAC;AAAA,YAAA;AAAA,UAAA,CAAA,GAAA,IAAA,GAAAN,EAAAF,GAAAR,EAG7FW,GAAI;AAAA,YAAA,IAACC,OAAI;AAAA,qBAAEpB,EAAM+B;AAAAA,YAAU;AAAA,YAAA,IAAAlB,WAAA;AAAA,kBAAAmB,IAAAC,EAAAA,GAAAC,IAAAF,EAAAG;AAAAC,qBAAAA,QAAAC,EAAAH,GAAA,OAEdlC,EAAM+B,UAAU,CAAA,GAAAC;AAAAA,YAAA;AAAA,UAAA,CAAA,GAAA,IAAA,GAAAd,EAAAF,GAAAR,EAG7BW,GAAI;AAAA,YAAA,IAACC,OAAI;AAAA,qBAAEpB,EAAMsC;AAAAA,YAAS;AAAA,YAAA,IAAAzB,WAAA;AAAA,qBAAAL,EACxB+B,GAAM;AAAA,gBACLC,SAAO;AAAA,gBACP5B,MAAI;AAAA,gBAAA,IACJc,WAAQ;AAAA,yBAAE,CAAC,CAAC1B,EAAM2B;AAAAA,gBAAI;AAAA,gBACtBc,SAASA,MAAMzC,EAAMsC,YAAAA;AAAAA,gBAAa,IAClChB,QAAK;AAAA,yBAAEtB,EAAM0C,gBAAgB;AAAA,gBAAiB;AAAA,cAAA,CAAA;AAAA,YAAA;AAAA,UAAA,CAAA,GAAA,IAAA,GAAAxB,EAAAF,GAAA,MAGjDhB,EAAMa,UAAQ,IAAA,GAAAuB,EAAA,MAAAO,EAAA3B,GAxBL4B,EAAG,gCAAgC5C,EAAM6C,KAAK,CAAC,CAAA,GAAA7B;AAAAA,QAAA;AAAA,MAAA,CAAA,GAAAR,EA2B5DC,EAAMqC,QAAM;AAAA,QAAA,IAAAjC,WAAA;AAAA,iBAAA,CAAAL,EACV+B,GAAM;AAAA,YAACC,SAAO;AAAA,YAAA,IAAQd,WAAQ;AAAA,qBAAE,CAAC,CAAC1B,EAAM2B;AAAAA,YAAI;AAAA,YAAEc,SAASA,MAAMzC,EAAMW,QAAAA;AAAAA,YAAS,IAAEW,QAAK;AAAA,qBAAEtB,EAAM+C,eAAe;AAAA,YAAQ;AAAA,UAAA,CAAA,GAAAvC,EAClH+B,GAAM;AAAA,YAACC,SAAO;AAAA,YAAA,IAAad,WAAQ;AAAA,qBAAE,CAAC,CAAC1B,EAAM2B;AAAAA,YAAI;AAAA,YAAEc,SAASA,MAAMzC,EAAMgD,UAAAA;AAAAA,YAAW,IAAE1B,QAAK;AAAA,qBAAEtB,EAAMiD,gBAAgB;AAAA,YAAM;AAAA,UAAA,CAAA,CAAA;AAAA,QAAA;AAAA,MAAA,CAAA,CAAA;AAAA,IAAA;AAAA,EAAA,CAAA;AAIjI;"}

package/dist/headless/components/feedBack/tooltip/tooltip.js

@@ -1,12 +1,12 @@
-import { use as f, addEventListener as m, insert as p, createComponent as F, effect as P, className as R, style as S, template as _, delegateEvents as A } from "solid-js/web";
-import { mergeProps as E, splitProps as X, createSignal as h, onCleanup as Y, Show as H } from "solid-js";
-import L from "clsx";
-import { offset as M } from "@floating-ui/dom";
-import { resolvePlacement as N } from "../../../utils/floating.js";
-import { createFloating as V } from "../../../primitives/createFloating.js";
-import { mergeRefs as j } from "../../../primitives/mergeRefs.js";
-var q = /* @__PURE__ */ _("<div>"), z = /* @__PURE__ */ _("<div class=smwb-tooltip__wrapper role=tooltip><div class=smwb-tooltip__ref>");
-function W(w) {
+import { use as p, addEventListener as m, insert as u, createComponent as F, effect as P, className as R, style as S, template as _, delegateEvents as A } from "solid-js/web";
+import { mergeProps as E, splitProps as M, createSignal as y, onCleanup as X, Show as Y } from "solid-js";
+import H from "clsx";
+import { offset as L, flip as N, shift as V } from "@floating-ui/dom";
+import { resolvePlacement as j } from "../../../utils/floating.js";
+import { createFloating as q } from "../../../primitives/createFloating.js";
+import { mergeRefs as z } from "../../../primitives/mergeRefs.js";
+var B = /* @__PURE__ */ _("<div>"), G = /* @__PURE__ */ _("<div class=smwb-tooltip__wrapper role=tooltip><div class=smwb-tooltip__ref>");
+function ee(w) {
   const D = E({
     placement: "top",
     offset: {
@@ -16,12 +16,12 @@ function W(w) {
     trigger: "hover",
     openDelay: 0,
     closeDelay: 0
-  }, w), [e] = X(D, ["class", "children", "placement", "offset", "message", "open", "trigger", "openDelay", "closeDelay", "ref"]), [T, n] = h(!1), [k, $] = h(!1);
+  }, w), [e] = M(D, ["class", "children", "placement", "offset", "message", "open", "trigger", "openDelay", "closeDelay", "ref"]), [T, n] = y(!1), [k, $] = y(!1);
   let s = null, i = null;
   const c = () => {
     s !== null && (clearTimeout(s), s = null), i !== null && (clearTimeout(i), i = null);
   };
-  Y(c);
+  X(c);
   const C = () => {
     if (c(), e.openDelay <= 0) {
       n(!0);
@@ -34,26 +34,33 @@ function W(w) {
       return;
     }
     i = setTimeout(() => n(!1), e.closeDelay);
-  }, u = () => N(e.placement), r = V({
-    placement: () => u().placement,
-    middleware: () => [M({
-      mainAxis: e.offset?.offsetY ?? 0,
-      crossAxis: e.offset?.offsetX ?? 0
-    }), u().autoMiddleware]
+  }, f = () => j(e.placement), r = q({
+    placement: () => f().placement,
+    middleware: () => [
+      L({
+        mainAxis: e.offset?.offsetY ?? 0,
+        crossAxis: e.offset?.offsetX ?? 0
+      }),
+      // A fixed placement turns to the other side, and slides along it, when the
+      // viewport has no room for it.
+      ...f().autoMiddleware ? [f().autoMiddleware] : [N(), V({
+        padding: 8
+      })]
+    ]
   }), b = () => e.trigger === "manual" ? e.open === !0 : e.trigger === "click" ? k() : T();
   return (() => {
-    var a = z(), o = a.firstChild, g = j(e.ref);
-    typeof g == "function" && f(g, a), m(o, "click", e.trigger === "click" ? () => $((t) => !t) : void 0, !0), m(o, "pointerleave", e.trigger === "hover" ? O : void 0), m(o, "pointerenter", e.trigger === "hover" ? C : void 0);
-    var v = r.setReference;
-    return typeof v == "function" ? f(v, o) : r.setReference = o, p(o, () => e.children), p(a, F(H, {
+    var a = G(), o = a.firstChild, g = z(e.ref);
+    typeof g == "function" && p(g, a), m(o, "click", e.trigger === "click" ? () => $((t) => !t) : void 0, !0), m(o, "pointerleave", e.trigger === "hover" ? O : void 0), m(o, "pointerenter", e.trigger === "hover" ? C : void 0);
+    var d = r.setReference;
+    return typeof d == "function" ? p(d, o) : r.setReference = o, u(o, () => e.children), u(a, F(Y, {
       get when() {
         return b();
       },
       get children() {
-        var t = q(), d = r.setFloating;
-        return typeof d == "function" ? f(d, t) : r.setFloating = t, p(t, () => e.message), P((l) => {
-          var y = L("smwb-tooltip", e.class), x = r.floatingStyles();
-          return y !== l.e && R(t, l.e = y), l.t = S(t, x, l.t), l;
+        var t = B(), v = r.setFloating;
+        return typeof v == "function" ? p(v, t) : r.setFloating = t, u(t, () => e.message), P((l) => {
+          var h = H("smwb-tooltip", e.class), x = r.floatingStyles();
+          return h !== l.e && R(t, l.e = h), l.t = S(t, x, l.t), l;
         }, {
           e: void 0,
           t: void 0
@@ -64,6 +71,6 @@ function W(w) {
 }
 A(["click"]);
 export {
-  W as Tooltip
+  ee as Tooltip
 };
 //# sourceMappingURL=tooltip.js.map

package/dist/headless/components/feedBack/tooltip/tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"tooltip.js","sources":["../../../../../src/components/feedBack/tooltip/tooltip.tsx"],"sourcesContent":["import { type JSX, type ParentProps, Show, createSignal, mergeProps, onCleanup, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { offset as offsetMiddleware } from \"@floating-ui/dom\";\nimport { type Placement, resolvePlacement } from \"../../../utils/floating\";\nimport { createFloating } from \"../../../primitives/createFloating\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport type TooltipTrigger = \"hover\" | \"click\" | \"manual\";\n\nexport interface TooltipProps {\n  class?: string;\n  offset?: {\n    offsetX?: number;\n    offsetY?: number;\n  };\n  message: JSX.Element;\n  placement?: Placement;\n  /** Controls tooltip visibility when trigger is manual. */\n  open?: boolean;\n  /** hover (default): show on pointer enter; click: toggle; manual: use open only. */\n  trigger?: TooltipTrigger;\n  openDelay?: number;\n  closeDelay?: number;\n  ref?: Ref<HTMLDivElement>;\n}\n\nexport function Tooltip(props: ParentProps<TooltipProps>): JSX.Element {\n  const merged = mergeProps(\n    {\n      placement: \"top\" as Placement,\n      offset: { offsetX: 0, offsetY: 0 },\n      trigger: \"hover\" as TooltipTrigger,\n      openDelay: 0,\n      closeDelay: 0,\n    },\n    props\n  );\n  const [local] = splitProps(merged, [\n    \"class\",\n    \"children\",\n    \"placement\",\n    \"offset\",\n    \"message\",\n    \"open\",\n    \"trigger\",\n    \"openDelay\",\n    \"closeDelay\",\n    \"ref\",\n  ]);\n\n  const [hoverOpen, setHoverOpen] = createSignal(false);\n  const [clickOpen, setClickOpen] = createSignal(false);\n  let openTimer: ReturnType<typeof setTimeout> | null = null;\n  let closeTimer: ReturnType<typeof setTimeout> | null = null;\n\n  const clearTimers = (): void => {\n    if (openTimer !== null) {\n      clearTimeout(openTimer);\n      openTimer = null;\n    }\n    if (closeTimer !== null) {\n      clearTimeout(closeTimer);\n      closeTimer = null;\n    }\n  };\n  onCleanup(clearTimers);\n\n  const scheduleOpen = (): void => {\n    clearTimers();\n    if (local.openDelay <= 0) {\n      setHoverOpen(true);\n      return;\n    }\n    openTimer = setTimeout(() => setHoverOpen(true), local.openDelay);\n  };\n  const scheduleClose = (): void => {\n    clearTimers();\n    if (local.closeDelay <= 0) {\n      setHoverOpen(false);\n      return;\n    }\n    closeTimer = setTimeout(() => setHoverOpen(false), local.closeDelay);\n  };\n\n  const resolved = () => resolvePlacement(local.placement);\n  const floating = createFloating({\n    placement: () => resolved().placement,\n    middleware: () => [\n      offsetMiddleware({ mainAxis: local.offset?.offsetY ?? 0, crossAxis: local.offset?.offsetX ?? 0 }),\n      resolved().autoMiddleware,\n    ],\n  });\n\n  const isVisible = (): boolean =>\n    local.trigger === \"manual\" ? local.open === true : local.trigger === \"click\" ? clickOpen() : hoverOpen();\n\n  return (\n    <div class=\"smwb-tooltip__wrapper\" role=\"tooltip\" ref={mergeRefs(local.ref)}>\n      <div\n        class=\"smwb-tooltip__ref\"\n        ref={floating.setReference}\n        onPointerEnter={local.trigger === \"hover\" ? scheduleOpen : undefined}\n        onPointerLeave={local.trigger === \"hover\" ? scheduleClose : undefined}\n        onClick={local.trigger === \"click\" ? () => setClickOpen((prev) => !prev) : undefined}\n      >\n        {local.children}\n      </div>\n      <Show when={isVisible()}>\n        <div ref={floating.setFloating} class={cn(\"smwb-tooltip\", local.class)} style={floating.floatingStyles()}>\n          {local.message}\n        </div>\n      </Show>\n    </div>\n  );\n}\n\nexport default Tooltip;\n"],"names":["Tooltip","props","merged","mergeProps","placement","offset","offsetX","offsetY","trigger","openDelay","closeDelay","local","splitProps","hoverOpen","setHoverOpen","createSignal","clickOpen","setClickOpen","openTimer","closeTimer","clearTimers","clearTimeout","onCleanup","scheduleOpen","setTimeout","scheduleClose","resolved","resolvePlacement","floating","createFloating","middleware","offsetMiddleware","mainAxis","crossAxis","autoMiddleware","isVisible","open","_el$","_tmpl$2","_el$2","firstChild","_ref$","mergeRefs","ref","_$use","_$addEventListener","prev","undefined","_ref$2","setReference","_$insert","children","_$createComponent","Show","when","_el$3","_tmpl$","_ref$3","setFloating","message","_$effect","_p$","_v$","cn","class","_v$2","floatingStyles","e","_$className","t","_$style","_$delegateEvents"],"mappings":"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"}
+{"version":3,"file":"tooltip.js","sources":["../../../../../src/components/feedBack/tooltip/tooltip.tsx"],"sourcesContent":["import { type JSX, type ParentProps, Show, createSignal, mergeProps, onCleanup, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { flip, offset as offsetMiddleware, shift } from \"@floating-ui/dom\";\nimport { type Placement, resolvePlacement } from \"../../../utils/floating\";\nimport { createFloating } from \"../../../primitives/createFloating\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport type TooltipTrigger = \"hover\" | \"click\" | \"manual\";\n\nexport interface TooltipProps {\n  class?: string;\n  offset?: {\n    offsetX?: number;\n    offsetY?: number;\n  };\n  message: JSX.Element;\n  placement?: Placement;\n  /** Controls tooltip visibility when trigger is manual. */\n  open?: boolean;\n  /** hover (default): show on pointer enter; click: toggle; manual: use open only. */\n  trigger?: TooltipTrigger;\n  openDelay?: number;\n  closeDelay?: number;\n  ref?: Ref<HTMLDivElement>;\n}\n\nexport function Tooltip(props: ParentProps<TooltipProps>): JSX.Element {\n  const merged = mergeProps(\n    {\n      placement: \"top\" as Placement,\n      offset: { offsetX: 0, offsetY: 0 },\n      trigger: \"hover\" as TooltipTrigger,\n      openDelay: 0,\n      closeDelay: 0,\n    },\n    props\n  );\n  const [local] = splitProps(merged, [\n    \"class\",\n    \"children\",\n    \"placement\",\n    \"offset\",\n    \"message\",\n    \"open\",\n    \"trigger\",\n    \"openDelay\",\n    \"closeDelay\",\n    \"ref\",\n  ]);\n\n  const [hoverOpen, setHoverOpen] = createSignal(false);\n  const [clickOpen, setClickOpen] = createSignal(false);\n  let openTimer: ReturnType<typeof setTimeout> | null = null;\n  let closeTimer: ReturnType<typeof setTimeout> | null = null;\n\n  const clearTimers = (): void => {\n    if (openTimer !== null) {\n      clearTimeout(openTimer);\n      openTimer = null;\n    }\n    if (closeTimer !== null) {\n      clearTimeout(closeTimer);\n      closeTimer = null;\n    }\n  };\n  onCleanup(clearTimers);\n\n  const scheduleOpen = (): void => {\n    clearTimers();\n    if (local.openDelay <= 0) {\n      setHoverOpen(true);\n      return;\n    }\n    openTimer = setTimeout(() => setHoverOpen(true), local.openDelay);\n  };\n  const scheduleClose = (): void => {\n    clearTimers();\n    if (local.closeDelay <= 0) {\n      setHoverOpen(false);\n      return;\n    }\n    closeTimer = setTimeout(() => setHoverOpen(false), local.closeDelay);\n  };\n\n  const resolved = () => resolvePlacement(local.placement);\n  const floating = createFloating({\n    placement: () => resolved().placement,\n    middleware: () => [\n      offsetMiddleware({ mainAxis: local.offset?.offsetY ?? 0, crossAxis: local.offset?.offsetX ?? 0 }),\n      // A fixed placement turns to the other side, and slides along it, when the\n      // viewport has no room for it.\n      ...(resolved().autoMiddleware ? [resolved().autoMiddleware] : [flip(), shift({ padding: 8 })]),\n    ],\n  });\n\n  const isVisible = (): boolean =>\n    local.trigger === \"manual\" ? local.open === true : local.trigger === \"click\" ? clickOpen() : hoverOpen();\n\n  return (\n    <div class=\"smwb-tooltip__wrapper\" role=\"tooltip\" ref={mergeRefs(local.ref)}>\n      <div\n        class=\"smwb-tooltip__ref\"\n        ref={floating.setReference}\n        onPointerEnter={local.trigger === \"hover\" ? scheduleOpen : undefined}\n        onPointerLeave={local.trigger === \"hover\" ? scheduleClose : undefined}\n        onClick={local.trigger === \"click\" ? () => setClickOpen((prev) => !prev) : undefined}\n      >\n        {local.children}\n      </div>\n      <Show when={isVisible()}>\n        <div ref={floating.setFloating} class={cn(\"smwb-tooltip\", local.class)} style={floating.floatingStyles()}>\n          {local.message}\n        </div>\n      </Show>\n    </div>\n  );\n}\n\nexport default Tooltip;\n"],"names":["Tooltip","props","merged","mergeProps","placement","offset","offsetX","offsetY","trigger","openDelay","closeDelay","local","splitProps","hoverOpen","setHoverOpen","createSignal","clickOpen","setClickOpen","openTimer","closeTimer","clearTimers","clearTimeout","onCleanup","scheduleOpen","setTimeout","scheduleClose","resolved","resolvePlacement","floating","createFloating","middleware","offsetMiddleware","mainAxis","crossAxis","autoMiddleware","flip","shift","padding","isVisible","open","_el$","_tmpl$2","_el$2","firstChild","_ref$","mergeRefs","ref","_$use","_$addEventListener","prev","undefined","_ref$2","setReference","_$insert","children","_$createComponent","Show","when","_el$3","_tmpl$","_ref$3","setFloating","message","_$effect","_p$","_v$","cn","class","_v$2","floatingStyles","e","_$className","t","_$style","_$delegateEvents"],"mappings":"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"}

package/dist/headless/components/inputs/button/button.js

@@ -1,13 +1,13 @@
-import { createComponent as n, use as d, spread as b, mergeProps as l, insert as g, template as _, memo as h } from "solid-js/web";
-import { mergeProps as R, splitProps as z, Show as s } from "solid-js";
-import T from "clsx";
-import { mergeRefs as w } from "../../../primitives/mergeRefs.js";
-import { useButtonGroup as W } from "../buttonGroups/buttonGroupContext.js";
-import { Ripple as k } from "../../base/ripple/ripple.js";
-import { Icon as C } from "../../base/icon/icon.js";
-var D = /* @__PURE__ */ _("<a data-testid=button-link>"), B = /* @__PURE__ */ _("<button data-testid=button>");
-function q($) {
-  const t = W(), v = R({
+import { createComponent as n, use as b, spread as g, mergeProps as i, insert as h, template as _, memo as w } from "solid-js/web";
+import { mergeProps as z, splitProps as T, children as W, Show as s } from "solid-js";
+import k from "clsx";
+import { mergeRefs as v } from "../../../primitives/mergeRefs.js";
+import { useButtonGroup as C } from "../buttonGroups/buttonGroupContext.js";
+import { Ripple as D } from "../../base/ripple/ripple.js";
+import { Icon as B } from "../../base/icon/icon.js";
+var x = /* @__PURE__ */ _("<a data-testid=button-link>"), A = /* @__PURE__ */ _("<button data-testid=button>");
+function H($) {
+  const t = C(), P = z({
     get variant() {
       return t?.variant ?? "contained";
     },
@@ -17,30 +17,31 @@ function q($) {
     get colorTheme() {
       return t?.colorTheme ?? "primary";
     }
-  }, $), [e, a] = z(v, ["label", "variant", "icon", "iconProps", "href", "class", "disabled", "children", "fullWidth", "rippleCenter", "disableRipple", "size", "colorTheme", "color", "ref"]), c = () => e.color ?? t?.color ?? e.colorTheme, i = () => e.disabled ?? t?.disabled, P = () => e.fullWidth ?? t?.fullWidth;
+  }, $), [e, a] = T(P, ["label", "variant", "icon", "iconProps", "href", "class", "disabled", "children", "fullWidth", "rippleCenter", "disableRipple", "size", "colorTheme", "color", "ref"]), c = () => e.color ?? t?.color ?? e.colorTheme, l = () => e.disabled ?? t?.disabled, y = () => e.fullWidth ?? t?.fullWidth;
   let m;
-  const p = () => T("smwb-button", `smwb-${e.variant}`, `smwb-${e.size}`, c() === "primary" ? "smwb-primary" : `smwb-button_color-${c()}`, t && "smwb-button-group__grouped", e.class, {
-    "smwb-disabled": i(),
-    "smwb-full-width": P()
+  const p = () => k("smwb-button", `smwb-${e.variant}`, `smwb-${e.size}`, c() === "primary" ? "smwb-primary" : `smwb-button_color-${c()}`, t && "smwb-button-group__grouped", e.class, {
+    "smwb-disabled": l(),
+    "smwb-full-width": y()
   }), u = (r) => {
-    i() || m?.onRipple(r);
-  }, y = () => typeof e.icon == "string" ? n(C, l(() => e.iconProps ?? {}, {
-    get name() {
-      return e.icon;
-    }
-  })) : e.icon, f = () => [n(s, {
+    l() || m?.onRipple(r);
+  }, d = W(() => e.icon), R = () => {
+    const r = d();
+    return typeof r == "string" ? n(B, i(() => e.iconProps ?? {}, {
+      name: r
+    })) : r;
+  }, f = () => [n(s, {
     get when() {
-      return e.icon;
+      return d();
     },
     get children() {
-      return y();
+      return R();
     }
-  }), h(() => h(() => !!e.label)() ? e.label : e.children), n(s, {
+  }), w(() => w(() => !!e.label)() ? e.label : e.children), n(s, {
     get when() {
       return !e.disableRipple;
     },
     get children() {
-      return n(k, {
+      return n(D, {
         actionRef: (r) => m = r,
         get center() {
           return e.rippleCenter;
@@ -54,21 +55,21 @@ function q($) {
     },
     get fallback() {
       return (() => {
-        var r = B(), o = w(e.ref);
-        return typeof o == "function" && d(o, r), b(r, l(a, {
+        var r = A(), o = v(e.ref);
+        return typeof o == "function" && b(o, r), g(r, i(a, {
           get class() {
             return p();
           },
           onPointerDown: u,
           get disabled() {
-            return !!i();
+            return !!l();
           }
-        }), !1, !0), g(r, f), r;
+        }), !1, !0), h(r, f), r;
       })();
     },
     get children() {
-      var r = D(), o = w(e.ref);
-      return typeof o == "function" && d(o, r), b(r, l(a, {
+      var r = x(), o = v(e.ref);
+      return typeof o == "function" && b(o, r), g(r, i(a, {
         get class() {
           return p();
         },
@@ -78,11 +79,11 @@ function q($) {
         target: "_blank",
         rel: "noreferrer",
         onPointerDown: u
-      }), !1, !0), g(r, f), r;
+      }), !1, !0), h(r, f), r;
     }
   });
 }
 export {
-  q as Button
+  H as Button
 };
 //# sourceMappingURL=button.js.map

package/dist/headless/components/inputs/button/button.js.map

@@ -1 +1 @@
-{"version":3,"file":"button.js","sources":["../../../../../src/components/inputs/button/button.tsx"],"sourcesContent":["import { type JSX, type ParentProps, Show, mergeProps, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Ripple, type RippleActionsRef } from \"../../base/ripple\";\nimport { Icon, type IconProps } from \"../../base/icon\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\nimport { useButtonGroup } from \"../buttonGroups/buttonGroupContext\";\n\nexport interface ButtonProps extends JSX.HTMLAttributes<HTMLButtonElement | HTMLAnchorElement> {\n  /** Button text. */\n  label?: string;\n  /** Visual style of the button. */\n  variant?: \"contained\" | \"text\" | \"outlined\";\n  /** Button size. */\n  size?: \"small\" | \"medium\" | \"large\";\n  /** Icon as an element (e.g. <Icon/>) or a string (icon name / url / base64). */\n  icon?: JSX.Element | string;\n  /** Props forwarded to the <Icon/> when `icon` is a string. */\n  iconProps?: Omit<IconProps, \"name\">;\n  /** @deprecated use `color`. Kept for backward compatibility. */\n  colorTheme?: \"primary\";\n  /** Semantic color, resolved through `--smwb-*Color*` tokens. */\n  color?: \"primary\" | \"secondary\" | \"error\" | \"success\" | \"warning\" | \"info\";\n  /** When set, the component renders as an <a>. */\n  href?: string;\n  disabled?: boolean;\n  type?: \"button\" | \"submit\" | \"reset\";\n  /** Stretch to the full width of the container. */\n  fullWidth?: boolean;\n  /** Center the ripple effect. */\n  rippleCenter?: boolean;\n  /** Disable the ripple effect. */\n  disableRipple?: boolean;\n  ref?: Ref<HTMLButtonElement | HTMLAnchorElement>;\n}\n\nexport function Button(props: ParentProps<ButtonProps>): JSX.Element {\n  const group = useButtonGroup();\n  const merged = mergeProps(\n    {\n      get variant(): NonNullable<ButtonProps[\"variant\"]> {\n        return group?.variant ?? \"contained\";\n      },\n      get size(): NonNullable<ButtonProps[\"size\"]> {\n        return group?.size ?? \"medium\";\n      },\n      get colorTheme(): NonNullable<ButtonProps[\"colorTheme\"]> {\n        return group?.colorTheme ?? \"primary\";\n      },\n    },\n    props\n  );\n  const [local, rest] = splitProps(merged, [\n    \"label\",\n    \"variant\",\n    \"icon\",\n    \"iconProps\",\n    \"href\",\n    \"class\",\n    \"disabled\",\n    \"children\",\n    \"fullWidth\",\n    \"rippleCenter\",\n    \"disableRipple\",\n    \"size\",\n    \"colorTheme\",\n    \"color\",\n    \"ref\",\n  ]);\n\n  const color = (): string => local.color ?? group?.color ?? local.colorTheme;\n  const disabled = (): boolean | undefined => local.disabled ?? group?.disabled;\n  const fullWidth = (): boolean | undefined => local.fullWidth ?? group?.fullWidth;\n  let rippleActions: RippleActionsRef | undefined;\n\n  const classes = (): string =>\n    cn(\n      \"smwb-button\",\n      `smwb-${local.variant}`,\n      `smwb-${local.size}`,\n      color() === \"primary\" ? \"smwb-primary\" : `smwb-button_color-${color()}`,\n      group && \"smwb-button-group__grouped\",\n      local.class,\n      {\n        \"smwb-disabled\": disabled(),\n        \"smwb-full-width\": fullWidth(),\n      }\n    );\n\n  // Ripple on pointerdown so it fires for touch and pen, not just mouse.\n  const onPointerDown = (event: PointerEvent): void => {\n    if (!disabled()) {\n      rippleActions?.onRipple(event);\n    }\n  };\n\n  const iconElement = (): JSX.Element =>\n    typeof local.icon === \"string\" ? <Icon {...(local.iconProps ?? {})} name={local.icon} /> : (local.icon as JSX.Element);\n\n  const content = (): JSX.Element => (\n    <>\n      <Show when={local.icon}>{iconElement()}</Show>\n      {local.label ? local.label : local.children}\n      <Show when={!local.disableRipple}>\n        <Ripple actionRef={(actions) => (rippleActions = actions)} center={local.rippleCenter} />\n      </Show>\n    </>\n  );\n\n  return (\n    <Show\n      when={local.href}\n      fallback={\n        <button\n          data-testid=\"button\"\n          {...rest}\n          ref={mergeRefs(local.ref)}\n          class={classes()}\n          onPointerDown={onPointerDown}\n          disabled={!!disabled()}\n        >\n          {content()}\n        </button>\n      }\n    >\n      <a\n        data-testid=\"button-link\"\n        {...rest}\n        ref={mergeRefs(local.ref)}\n        class={classes()}\n        href={local.href}\n        target=\"_blank\"\n        rel=\"noreferrer\"\n        onPointerDown={onPointerDown}\n      >\n        {content()}\n      </a>\n    </Show>\n  );\n}\n\nexport default Button;\n"],"names":["Button","props","group","useButtonGroup","merged","mergeProps","variant","size","colorTheme","local","rest","splitProps","color","disabled","fullWidth","rippleActions","classes","cn","class","onPointerDown","event","onRipple","iconElement","icon","_$createComponent","Icon","_$mergeProps","iconProps","name","content","Show","when","children","_$memo","label","disableRipple","Ripple","actionRef","actions","center","rippleCenter","href","fallback","_el$2","_tmpl$2","_ref$2","mergeRefs","ref","_$use","_$spread","_$insert","_el$","_tmpl$","_ref$"],"mappings":"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"}
+{"version":3,"file":"button.js","sources":["../../../../../src/components/inputs/button/button.tsx"],"sourcesContent":["import { type JSX, type ParentProps, Show, children, mergeProps, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Ripple, type RippleActionsRef } from \"../../base/ripple\";\nimport { Icon, type IconProps } from \"../../base/icon\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\nimport { useButtonGroup } from \"../buttonGroups/buttonGroupContext\";\n\nexport interface ButtonProps extends JSX.HTMLAttributes<HTMLButtonElement | HTMLAnchorElement> {\n  /** Button text. */\n  label?: string;\n  /** Visual style of the button. */\n  variant?: \"contained\" | \"text\" | \"outlined\";\n  /** Button size. */\n  size?: \"small\" | \"medium\" | \"large\";\n  /** Icon as an element (e.g. <Icon/>) or a string (icon name / url / base64). */\n  icon?: JSX.Element | string;\n  /** Props forwarded to the <Icon/> when `icon` is a string. */\n  iconProps?: Omit<IconProps, \"name\">;\n  /** @deprecated use `color`. Kept for backward compatibility. */\n  colorTheme?: \"primary\";\n  /** Semantic color, resolved through `--smwb-*Color*` tokens. */\n  color?: \"primary\" | \"secondary\" | \"error\" | \"success\" | \"warning\" | \"info\";\n  /** When set, the component renders as an <a>. */\n  href?: string;\n  disabled?: boolean;\n  type?: \"button\" | \"submit\" | \"reset\";\n  /** Stretch to the full width of the container. */\n  fullWidth?: boolean;\n  /** Center the ripple effect. */\n  rippleCenter?: boolean;\n  /** Disable the ripple effect. */\n  disableRipple?: boolean;\n  ref?: Ref<HTMLButtonElement | HTMLAnchorElement>;\n}\n\nexport function Button(props: ParentProps<ButtonProps>): JSX.Element {\n  const group = useButtonGroup();\n  const merged = mergeProps(\n    {\n      get variant(): NonNullable<ButtonProps[\"variant\"]> {\n        return group?.variant ?? \"contained\";\n      },\n      get size(): NonNullable<ButtonProps[\"size\"]> {\n        return group?.size ?? \"medium\";\n      },\n      get colorTheme(): NonNullable<ButtonProps[\"colorTheme\"]> {\n        return group?.colorTheme ?? \"primary\";\n      },\n    },\n    props\n  );\n  const [local, rest] = splitProps(merged, [\n    \"label\",\n    \"variant\",\n    \"icon\",\n    \"iconProps\",\n    \"href\",\n    \"class\",\n    \"disabled\",\n    \"children\",\n    \"fullWidth\",\n    \"rippleCenter\",\n    \"disableRipple\",\n    \"size\",\n    \"colorTheme\",\n    \"color\",\n    \"ref\",\n  ]);\n\n  const color = (): string => local.color ?? group?.color ?? local.colorTheme;\n  const disabled = (): boolean | undefined => local.disabled ?? group?.disabled;\n  const fullWidth = (): boolean | undefined => local.fullWidth ?? group?.fullWidth;\n  let rippleActions: RippleActionsRef | undefined;\n\n  const classes = (): string =>\n    cn(\n      \"smwb-button\",\n      `smwb-${local.variant}`,\n      `smwb-${local.size}`,\n      color() === \"primary\" ? \"smwb-primary\" : `smwb-button_color-${color()}`,\n      group && \"smwb-button-group__grouped\",\n      local.class,\n      {\n        \"smwb-disabled\": disabled(),\n        \"smwb-full-width\": fullWidth(),\n      }\n    );\n\n  // Ripple on pointerdown so it fires for touch and pen, not just mouse.\n  const onPointerDown = (event: PointerEvent): void => {\n    if (!disabled()) {\n      rippleActions?.onRipple(event);\n    }\n  };\n\n  // Read the icon once: markup passed as a prop is created anew on every read,\n  // and during hydration the copy made for a <Show> test has no server DOM node.\n  const icon = children(() => local.icon);\n  const iconElement = (): JSX.Element => {\n    const resolved = icon();\n    return typeof resolved === \"string\" ? <Icon {...(local.iconProps ?? {})} name={resolved} /> : resolved;\n  };\n\n  const content = (): JSX.Element => (\n    <>\n      <Show when={icon()}>{iconElement()}</Show>\n      {local.label ? local.label : local.children}\n      <Show when={!local.disableRipple}>\n        <Ripple actionRef={(actions) => (rippleActions = actions)} center={local.rippleCenter} />\n      </Show>\n    </>\n  );\n\n  return (\n    <Show\n      when={local.href}\n      fallback={\n        <button\n          data-testid=\"button\"\n          {...rest}\n          ref={mergeRefs(local.ref)}\n          class={classes()}\n          onPointerDown={onPointerDown}\n          disabled={!!disabled()}\n        >\n          {content()}\n        </button>\n      }\n    >\n      <a\n        data-testid=\"button-link\"\n        {...rest}\n        ref={mergeRefs(local.ref)}\n        class={classes()}\n        href={local.href}\n        target=\"_blank\"\n        rel=\"noreferrer\"\n        onPointerDown={onPointerDown}\n      >\n        {content()}\n      </a>\n    </Show>\n  );\n}\n\nexport default Button;\n"],"names":["Button","props","group","useButtonGroup","merged","mergeProps","variant","size","colorTheme","local","rest","splitProps","color","disabled","fullWidth","rippleActions","classes","cn","class","onPointerDown","event","onRipple","icon","children","iconElement","resolved","_$createComponent","Icon","_$mergeProps","iconProps","name","content","Show","when","_$memo","label","disableRipple","Ripple","actionRef","actions","center","rippleCenter","href","fallback","_el$2","_tmpl$2","_ref$2","mergeRefs","ref","_$use","_$spread","_$insert","_el$","_tmpl$","_ref$"],"mappings":"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"}

package/dist/headless/components/inputs/datePicker/dataPickerInput.js

@@ -1,24 +1,24 @@
-import { createComponent as n, mergeProps as i } from "solid-js/web";
-import { splitProps as u, Show as a } from "solid-js";
-import { DatePickerIconButton as c } from "./datePickerIconButton.js";
-import { createDateInput as g } from "./useDateInput.js";
-import { mergeRefs as p } from "../../../primitives/mergeRefs.js";
-import { TextField as m } from "../textField/textField.js";
-import { Icon as f } from "../../base/icon/icon.js";
-function s(t) {
+import { createComponent as n, mergeProps as u } from "solid-js/web";
+import { splitProps as c, children as g, Show as l } from "solid-js";
+import { DatePickerIconButton as p } from "./datePickerIconButton.js";
+import { createDateInput as m } from "./useDateInput.js";
+import { mergeRefs as f } from "../../../primitives/mergeRefs.js";
+import { TextField as s } from "../textField/textField.js";
+import { Icon as h } from "../../base/icon/icon.js";
+function b(t) {
   t.stopPropagation();
 }
-function P(t) {
-  const [e, l] = u(t, ["value", "onChange", "onBlur", "onToggle", "disabled", "disableCalendar", "calendarIcon", "format", "ref"]), r = g({
+function D(t) {
+  const [e, d] = c(t, ["value", "onChange", "onBlur", "onToggle", "disabled", "disableCalendar", "calendarIcon", "format", "ref"]), o = g(() => e.disableCalendar ? void 0 : e.calendarIcon), r = m({
     value: e.value,
     onChange: e.onChange,
     onBlur: e.onBlur,
     format: e.format
   });
-  return n(m, i({
-    ref(d) {
-      var o = p(e.ref, r.ref);
-      typeof o == "function" && o(d);
+  return n(s, u({
+    ref(i) {
+      var a = f(e.ref, r.ref);
+      typeof a == "function" && a(i);
     },
     get value() {
       return r.value();
@@ -34,26 +34,26 @@ function P(t) {
     },
     type: "tel",
     get endAdornment() {
-      return n(a, {
+      return n(l, {
         get when() {
           return !e.disableCalendar;
         },
         get children() {
-          return n(c, {
+          return n(p, {
             edge: "end",
             onClick: () => e.onToggle(),
-            onMouseDown: s,
+            onMouseDown: b,
             get disabled() {
               return !!e.disabled;
             },
             "data-testid": "date-picker-icon-button",
             get children() {
-              return n(a, {
+              return n(l, {
                 get when() {
-                  return e.calendarIcon;
+                  return o();
                 },
                 get fallback() {
-                  return n(f, {
+                  return n(h, {
                     name: "calendar_today",
                     fill: 1,
                     weight: 500,
@@ -61,7 +61,7 @@ function P(t) {
                   });
                 },
                 get children() {
-                  return e.calendarIcon;
+                  return o();
                 }
               });
             }
@@ -72,9 +72,9 @@ function P(t) {
     get disabled() {
       return !!e.disabled;
     }
-  }, l));
+  }, d));
 }
 export {
-  P as DataPickerInput
+  D as DataPickerInput
 };
 //# sourceMappingURL=dataPickerInput.js.map

package/dist/headless/components/inputs/datePicker/dataPickerInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"dataPickerInput.js","sources":["../../../../../src/components/inputs/datePicker/dataPickerInput.tsx"],"sourcesContent":["import { type JSX, Show, splitProps } from \"solid-js\";\nimport { TextField } from \"../textField\";\nimport { DatePickerIconButton } from \"./datePickerIconButton\";\nimport { createDateInput } from \"./useDateInput\";\nimport { Icon } from \"../../base/icon\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\nimport type { DatePickerProps } from \"./datePicker\";\n\nexport interface DataPickerInputProps extends Omit<DatePickerProps, \"placement\" | \"onToggle\"> {\n  onToggle: () => void;\n  ref?: Ref<HTMLInputElement>;\n}\n\nfunction stopPropagation(event: Event): void {\n  event.stopPropagation();\n}\n\nexport function DataPickerInput(props: DataPickerInputProps): JSX.Element {\n  const [local, rest] = splitProps(props, [\n    \"value\",\n    \"onChange\",\n    \"onBlur\",\n    \"onToggle\",\n    \"disabled\",\n    \"disableCalendar\",\n    \"calendarIcon\",\n    \"format\",\n    \"ref\",\n  ]);\n\n  const masked = createDateInput({\n    value: local.value,\n    onChange: local.onChange,\n    onBlur: local.onBlur,\n    format: local.format,\n  });\n\n  return (\n    <TextField\n      ref={mergeRefs(local.ref, masked.ref)}\n      value={masked.value()}\n      onChange={masked.onInput}\n      onBlur={masked.onBlur}\n      placeholder={masked.placeholder()}\n      type=\"tel\"\n      endAdornment={\n        <Show when={!local.disableCalendar}>\n          <DatePickerIconButton\n            edge=\"end\"\n            onClick={() => local.onToggle()}\n            onMouseDown={stopPropagation}\n            disabled={Boolean(local.disabled)}\n            data-testid=\"date-picker-icon-button\"\n          >\n            <Show when={local.calendarIcon} fallback={<Icon name=\"calendar_today\" fill={1} weight={500} size={24} />}>\n              {local.calendarIcon}\n            </Show>\n          </DatePickerIconButton>\n        </Show>\n      }\n      disabled={Boolean(local.disabled)}\n      {...rest}\n    />\n  );\n}\n\nexport default DataPickerInput;\n"],"names":["stopPropagation","event","DataPickerInput","props","local","rest","splitProps","masked","createDateInput","value","onChange","onBlur","format","_$createComponent","TextField","_$mergeProps","ref","r$","_ref$","mergeRefs","onInput","placeholder","type","endAdornment","Show","when","disableCalendar","children","DatePickerIconButton","edge","onClick","onToggle","onMouseDown","disabled","Boolean","calendarIcon","fallback","Icon","name","fill","weight","size"],"mappings":";;;;;;;AAaA,SAASA,EAAgBC,GAAoB;AAC3CA,EAAAA,EAAMD,gBAAAA;AACR;AAEO,SAASE,EAAgBC,GAA0C;AACxE,QAAM,CAACC,GAAOC,CAAI,IAAIC,EAAWH,GAAO,CACtC,SACA,YACA,UACA,YACA,YACA,mBACA,gBACA,UACA,KAAK,CACN,GAEKI,IAASC,EAAgB;AAAA,IAC7BC,OAAOL,EAAMK;AAAAA,IACbC,UAAUN,EAAMM;AAAAA,IAChBC,QAAQP,EAAMO;AAAAA,IACdC,QAAQR,EAAMQ;AAAAA,EAAAA,CACf;AAED,SAAAC,EACGC,GAASC,EAAA;AAAA,IAAAC,IAAAC,GAAA;AAAA,UAAAC,IACHC,EAAUf,EAAMY,KAAKT,EAAOS,GAAG;AAAC,aAAAE,KAAA,cAAAA,EAAAD,CAAA;AAAA,IAAA;AAAA,IAAA,IACrCR,QAAK;AAAA,aAAEF,EAAOE,MAAAA;AAAAA,IAAO;AAAA,IAAA,IACrBC,WAAQ;AAAA,aAAEH,EAAOa;AAAAA,IAAO;AAAA,IAAA,IACxBT,SAAM;AAAA,aAAEJ,EAAOI;AAAAA,IAAM;AAAA,IAAA,IACrBU,cAAW;AAAA,aAAEd,EAAOc,YAAAA;AAAAA,IAAa;AAAA,IACjCC,MAAI;AAAA,IAAA,IACJC,eAAY;AAAA,aAAAV,EACTW,GAAI;AAAA,QAAA,IAACC,OAAI;AAAA,iBAAE,CAACrB,EAAMsB;AAAAA,QAAe;AAAA,QAAA,IAAAC,WAAA;AAAA,iBAAAd,EAC/Be,GAAoB;AAAA,YACnBC,MAAI;AAAA,YACJC,SAASA,MAAM1B,EAAM2B,SAAAA;AAAAA,YACrBC,aAAahC;AAAAA,YAAe,IAC5BiC,WAAQ;AAAA,qBAAEC,EAAQ9B,EAAM6B;AAAAA,YAAS;AAAA,YAAA,eAAA;AAAA,YAAA,IAAAN,WAAA;AAAA,qBAAAd,EAGhCW,GAAI;AAAA,gBAAA,IAACC,OAAI;AAAA,yBAAErB,EAAM+B;AAAAA,gBAAY;AAAA,gBAAA,IAAEC,WAAQ;AAAA,yBAAAvB,EAAGwB,GAAI;AAAA,oBAACC,MAAI;AAAA,oBAAkBC,MAAM;AAAA,oBAAGC,QAAQ;AAAA,oBAAKC,MAAM;AAAA,kBAAA,CAAE;AAAA,gBAAA;AAAA,gBAAA,IAAAd,WAAA;AAAA,yBACjGvB,EAAM+B;AAAAA,gBAAY;AAAA,cAAA,CAAA;AAAA,YAAA;AAAA,UAAA,CAAA;AAAA,QAAA;AAAA,MAAA,CAAA;AAAA,IAAA;AAAA,IAAA,IAK3BF,WAAQ;AAAA,aAAEC,EAAQ9B,EAAM6B;AAAAA,IAAS;AAAA,EAAA,GAC7B5B,CAAI,CAAA;AAGd;"}
+{"version":3,"file":"dataPickerInput.js","sources":["../../../../../src/components/inputs/datePicker/dataPickerInput.tsx"],"sourcesContent":["import { type JSX, Show, children, splitProps } from \"solid-js\";\nimport { TextField } from \"../textField\";\nimport { DatePickerIconButton } from \"./datePickerIconButton\";\nimport { createDateInput } from \"./useDateInput\";\nimport { Icon } from \"../../base/icon\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\nimport type { DatePickerProps } from \"./datePicker\";\n\nexport interface DataPickerInputProps extends Omit<DatePickerProps, \"placement\" | \"onToggle\"> {\n  onToggle: () => void;\n  ref?: Ref<HTMLInputElement>;\n}\n\nfunction stopPropagation(event: Event): void {\n  event.stopPropagation();\n}\n\nexport function DataPickerInput(props: DataPickerInputProps): JSX.Element {\n  const [local, rest] = splitProps(props, [\n    \"value\",\n    \"onChange\",\n    \"onBlur\",\n    \"onToggle\",\n    \"disabled\",\n    \"disableCalendar\",\n    \"calendarIcon\",\n    \"format\",\n    \"ref\",\n  ]);\n\n  // Read the icon once, and only while the calendar button is drawn.\n  const calendarIcon = children(() => (local.disableCalendar ? undefined : local.calendarIcon));\n\n  const masked = createDateInput({\n    value: local.value,\n    onChange: local.onChange,\n    onBlur: local.onBlur,\n    format: local.format,\n  });\n\n  return (\n    <TextField\n      ref={mergeRefs(local.ref, masked.ref)}\n      value={masked.value()}\n      onChange={masked.onInput}\n      onBlur={masked.onBlur}\n      placeholder={masked.placeholder()}\n      type=\"tel\"\n      endAdornment={\n        <Show when={!local.disableCalendar}>\n          <DatePickerIconButton\n            edge=\"end\"\n            onClick={() => local.onToggle()}\n            onMouseDown={stopPropagation}\n            disabled={Boolean(local.disabled)}\n            data-testid=\"date-picker-icon-button\"\n          >\n            <Show when={calendarIcon()} fallback={<Icon name=\"calendar_today\" fill={1} weight={500} size={24} />}>\n              {calendarIcon()}\n            </Show>\n          </DatePickerIconButton>\n        </Show>\n      }\n      disabled={Boolean(local.disabled)}\n      {...rest}\n    />\n  );\n}\n\nexport default DataPickerInput;\n"],"names":["stopPropagation","event","DataPickerInput","props","local","rest","splitProps","calendarIcon","children","disableCalendar","undefined","masked","createDateInput","value","onChange","onBlur","format","_$createComponent","TextField","_$mergeProps","ref","r$","_ref$","mergeRefs","onInput","placeholder","type","endAdornment","Show","when","DatePickerIconButton","edge","onClick","onToggle","onMouseDown","disabled","Boolean","fallback","Icon","name","fill","weight","size"],"mappings":";;;;;;;AAaA,SAASA,EAAgBC,GAAoB;AAC3CA,EAAAA,EAAMD,gBAAAA;AACR;AAEO,SAASE,EAAgBC,GAA0C;AACxE,QAAM,CAACC,GAAOC,CAAI,IAAIC,EAAWH,GAAO,CACtC,SACA,YACA,UACA,YACA,YACA,mBACA,gBACA,UACA,KAAK,CACN,GAGKI,IAAeC,EAAS,MAAOJ,EAAMK,kBAAkBC,SAAYN,EAAMG,YAAa,GAEtFI,IAASC,EAAgB;AAAA,IAC7BC,OAAOT,EAAMS;AAAAA,IACbC,UAAUV,EAAMU;AAAAA,IAChBC,QAAQX,EAAMW;AAAAA,IACdC,QAAQZ,EAAMY;AAAAA,EAAAA,CACf;AAED,SAAAC,EACGC,GAASC,EAAA;AAAA,IAAAC,IAAAC,GAAA;AAAA,UAAAC,IACHC,EAAUnB,EAAMgB,KAAKT,EAAOS,GAAG;AAAC,aAAAE,KAAA,cAAAA,EAAAD,CAAA;AAAA,IAAA;AAAA,IAAA,IACrCR,QAAK;AAAA,aAAEF,EAAOE,MAAAA;AAAAA,IAAO;AAAA,IAAA,IACrBC,WAAQ;AAAA,aAAEH,EAAOa;AAAAA,IAAO;AAAA,IAAA,IACxBT,SAAM;AAAA,aAAEJ,EAAOI;AAAAA,IAAM;AAAA,IAAA,IACrBU,cAAW;AAAA,aAAEd,EAAOc,YAAAA;AAAAA,IAAa;AAAA,IACjCC,MAAI;AAAA,IAAA,IACJC,eAAY;AAAA,aAAAV,EACTW,GAAI;AAAA,QAAA,IAACC,OAAI;AAAA,iBAAE,CAACzB,EAAMK;AAAAA,QAAe;AAAA,QAAA,IAAAD,WAAA;AAAA,iBAAAS,EAC/Ba,GAAoB;AAAA,YACnBC,MAAI;AAAA,YACJC,SAASA,MAAM5B,EAAM6B,SAAAA;AAAAA,YACrBC,aAAalC;AAAAA,YAAe,IAC5BmC,WAAQ;AAAA,qBAAEC,EAAQhC,EAAM+B;AAAAA,YAAS;AAAA,YAAA,eAAA;AAAA,YAAA,IAAA3B,WAAA;AAAA,qBAAAS,EAGhCW,GAAI;AAAA,gBAAA,IAACC,OAAI;AAAA,yBAAEtB,EAAAA;AAAAA,gBAAc;AAAA,gBAAA,IAAE8B,WAAQ;AAAA,yBAAApB,EAAGqB,GAAI;AAAA,oBAACC,MAAI;AAAA,oBAAkBC,MAAM;AAAA,oBAAGC,QAAQ;AAAA,oBAAKC,MAAM;AAAA,kBAAA,CAAE;AAAA,gBAAA;AAAA,gBAAA,IAAAlC,WAAA;AAAA,yBAC7FD,EAAAA;AAAAA,gBAAc;AAAA,cAAA,CAAA;AAAA,YAAA;AAAA,UAAA,CAAA;AAAA,QAAA;AAAA,MAAA,CAAA;AAAA,IAAA;AAAA,IAAA,IAKvB4B,WAAQ;AAAA,aAAEC,EAAQhC,EAAM+B;AAAAA,IAAS;AAAA,EAAA,GAC7B9B,CAAI,CAAA;AAGd;"}