@smwb/ui-solid 0.1.0

package/dist/components/layout/screenDivider/screenDivider.js

@@ -0,0 +1,80 @@
+import { isServer as X, use as Y, insert as L, setAttribute as c, effect as F, className as v, style as $, template as N, delegateEvents as O } from "solid-js/web";
+import '../../../assets/styles/less/components/screenDivider/screenDivider.entry.css';/* empty css                                                                     */
+import { mergeProps as T, splitProps as U, createSignal as x, createEffect as f, children as j, onCleanup as q } from "solid-js";
+import m from "clsx";
+import { throttle as B } from "../../../utils/throttle.js";
+import { mergeRefs as G } from "../../../primitives/mergeRefs.js";
+var J = /* @__PURE__ */ N("<div data-testid=screen-divider><div></div><span class=smwb-screen-divider__resizer role=separator aria-valuemin=0 aria-valuemax=100 tabindex=0></span><div>");
+const C = (a, d) => d * (a / 100), _ = (a, d) => !a && d ? 100 - d : a || 50;
+function te(a) {
+  const d = T({
+    orientation: "horizontal",
+    keyboardStep: 5,
+    resizerAriaLabel: "Resize panels"
+  }, a), [e] = U(d, ["class", "orientation", "sizeFirst", "sizeSecond", "children", "onSizeChange", "keyboardStep", "resizerAriaLabel", "ref"]);
+  let u;
+  const [l, s] = x(_(e.sizeFirst, e.sizeSecond)), [h, b] = x(!1);
+  f(() => {
+    s(_(e.sizeFirst, e.sizeSecond));
+  }), f(() => {
+    e.onSizeChange?.(l());
+  });
+  const M = j(() => e.children), p = () => M.toArray(), y = B((t) => {
+    if (!h()) return;
+    const n = u;
+    if (n)
+      if (e.orientation === "vertical") {
+        let r = t.clientY - n.offsetTop;
+        r < 0 && (r = 0);
+        const o = r / n.clientHeight * 100;
+        C(o, n.clientWidth) > 5 && o < 101 && s(o - 7);
+      } else {
+        let r = t.clientX - n.offsetLeft;
+        r < 0 && (r = 0);
+        const o = r / n.clientWidth * 100;
+        C(o, n.clientWidth) > 5 && o < 101 && s(o);
+      }
+  }, 1e3 / 60), R = () => {
+    b(!0);
+  }, g = () => {
+    b(!1);
+  };
+  f(() => {
+    X || (h() ? (document.body.addEventListener("pointerup", g), document.body.addEventListener("pointermove", y), document.body.style.cursor = e.orientation === "horizontal" ? "e-resize" : "n-resize") : document.body.style.cursor = "default", q(() => {
+      document.body.removeEventListener("pointerup", g), document.body.removeEventListener("pointermove", y);
+    }));
+  });
+  const K = (t) => {
+    const n = e.orientation === "vertical" ? "ArrowUp" : "ArrowLeft", r = e.orientation === "vertical" ? "ArrowDown" : "ArrowRight";
+    t.key === n ? (t.preventDefault(), s((o) => Math.max(0, o - e.keyboardStep))) : t.key === r ? (t.preventDefault(), s((o) => Math.min(100, o + e.keyboardStep))) : t.key === "Home" ? (t.preventDefault(), s(0)) : t.key === "End" && (t.preventDefault(), s(100));
+  }, P = () => e.orientation === "vertical" ? {
+    height: `${l()}%`
+  } : {
+    width: `${l()}%`
+  }, W = () => e.orientation === "vertical" ? {
+    height: `${100 - l()}%`
+  } : {
+    width: `${100 - l()}%`
+  };
+  return (() => {
+    var t = J(), n = t.firstChild, r = n.nextSibling, o = r.nextSibling, w = G(e.ref, (i) => u = i);
+    return typeof w == "function" && Y(w, t), L(n, () => p()[0] ?? ""), r.$$keydown = K, r.$$pointerdown = R, c(r, "draggable", !1), L(o, () => p()[1] ?? ""), F((i) => {
+      var z = m("smwb-screen-divider__wrapper", `smwb-${e.orientation}`, e.class), S = m("smwb-screen-divider__first", `smwb-${e.orientation}`), H = P(), D = e.orientation === "vertical" ? "horizontal" : "vertical", k = Math.round(l()), A = e.resizerAriaLabel, E = m("smwb-screen-divider__second", `smwb-${e.orientation}`), I = W();
+      return z !== i.e && v(t, i.e = z), S !== i.t && v(n, i.t = S), i.a = $(n, H, i.a), D !== i.o && c(r, "aria-orientation", i.o = D), k !== i.i && c(r, "aria-valuenow", i.i = k), A !== i.n && c(r, "aria-label", i.n = A), E !== i.s && v(o, i.s = E), i.h = $(o, I, i.h), i;
+    }, {
+      e: void 0,
+      t: void 0,
+      a: void 0,
+      o: void 0,
+      i: void 0,
+      n: void 0,
+      s: void 0,
+      h: void 0
+    }), t;
+  })();
+}
+O(["pointerdown", "keydown"]);
+export {
+  te as ScreenDivider
+};
+//# sourceMappingURL=screenDivider.js.map

package/dist/components/layout/screenDivider/screenDivider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"screenDivider.js","sources":["../../../../src/components/layout/screenDivider/screenDivider.tsx"],"sourcesContent":["import {\n  type JSX,\n  type ParentProps,\n  children as resolveChildren,\n  createEffect,\n  createSignal,\n  mergeProps,\n  onCleanup,\n  splitProps,\n} from \"solid-js\";\nimport { isServer } from \"solid-js/web\";\nimport cn from \"clsx\";\nimport { throttle } from \"../../../utils/throttle\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport interface ScreenDividerProps {\n  sizeFirst?: number;\n  sizeSecond?: number;\n  class?: string;\n  orientation?: \"horizontal\" | \"vertical\";\n  /** Called with the first pane size (percent) whenever it changes. */\n  onSizeChange?: (sizeFirst: number) => void;\n  /** Step (in percent) applied on arrow-key resize. */\n  keyboardStep?: number;\n  /** Accessible label for the resizer handle. */\n  resizerAriaLabel?: string;\n  ref?: Ref<HTMLDivElement>;\n}\n\nconst toPixels = (percent: number, parentSize: number): number => parentSize * (percent / 100);\n\nconst getInitialDivider = (sizeFirst?: number | null, sizeSecond?: number | null): number => {\n  if (!sizeFirst && sizeSecond) {\n    return 100 - sizeSecond;\n  }\n  if (sizeFirst) {\n    return sizeFirst;\n  }\n  return 50;\n};\n\nexport function ScreenDivider(props: ParentProps<ScreenDividerProps>): JSX.Element {\n  const merged = mergeProps(\n    { orientation: \"horizontal\" as const, keyboardStep: 5, resizerAriaLabel: \"Resize panels\" },\n    props\n  );\n  const [local] = splitProps(merged, [\n    \"class\",\n    \"orientation\",\n    \"sizeFirst\",\n    \"sizeSecond\",\n    \"children\",\n    \"onSizeChange\",\n    \"keyboardStep\",\n    \"resizerAriaLabel\",\n    \"ref\",\n  ]);\n\n  let wrapperEl: HTMLDivElement | undefined;\n  const [divider, setDivider] = createSignal(getInitialDivider(local.sizeFirst, local.sizeSecond));\n  const [isDragging, setIsDragging] = createSignal(false);\n\n  // Sync with controlled size props.\n  createEffect(() => {\n    setDivider(getInitialDivider(local.sizeFirst, local.sizeSecond));\n  });\n\n  // Report size changes.\n  createEffect(() => {\n    local.onSizeChange?.(divider());\n  });\n\n  const resolved = resolveChildren(() => local.children);\n  const child = (): unknown[] => resolved.toArray();\n\n  const dragOver = throttle((event: PointerEvent) => {\n    if (!isDragging()) return;\n    const wrapper = wrapperEl;\n    if (!wrapper) return;\n    if (local.orientation === \"vertical\") {\n      let relativeMouseY = event.clientY - wrapper.offsetTop;\n      if (relativeMouseY < 0) relativeMouseY = 0;\n      const newDivider = (relativeMouseY / wrapper.clientHeight) * 100;\n      if (toPixels(newDivider, wrapper.clientWidth) > 5 && newDivider < 101) {\n        setDivider(newDivider - 7);\n      }\n    } else {\n      let relativeMouseX = event.clientX - wrapper.offsetLeft;\n      if (relativeMouseX < 0) relativeMouseX = 0;\n      const newDivider = (relativeMouseX / wrapper.clientWidth) * 100;\n      if (toPixels(newDivider, wrapper.clientWidth) > 5 && newDivider < 101) {\n        setDivider(newDivider);\n      }\n    }\n  }, 1000 / 60);\n\n  const handleDragStart = (): void => {\n    setIsDragging(true);\n  };\n  const handleDragEnd = (): void => {\n    setIsDragging(false);\n  };\n\n  createEffect(() => {\n    if (isServer) return;\n    if (isDragging()) {\n      document.body.addEventListener(\"pointerup\", handleDragEnd);\n      document.body.addEventListener(\"pointermove\", dragOver);\n      document.body.style.cursor = local.orientation === \"horizontal\" ? \"e-resize\" : \"n-resize\";\n    } else {\n      document.body.style.cursor = \"default\";\n    }\n    onCleanup(() => {\n      document.body.removeEventListener(\"pointerup\", handleDragEnd);\n      document.body.removeEventListener(\"pointermove\", dragOver);\n    });\n  });\n\n  const onResizerKeyDown: JSX.EventHandler<HTMLSpanElement, KeyboardEvent> = (event) => {\n    const decreaseKey = local.orientation === \"vertical\" ? \"ArrowUp\" : \"ArrowLeft\";\n    const increaseKey = local.orientation === \"vertical\" ? \"ArrowDown\" : \"ArrowRight\";\n    if (event.key === decreaseKey) {\n      event.preventDefault();\n      setDivider((prev) => Math.max(0, prev - local.keyboardStep));\n    } else if (event.key === increaseKey) {\n      event.preventDefault();\n      setDivider((prev) => Math.min(100, prev + local.keyboardStep));\n    } else if (event.key === \"Home\") {\n      event.preventDefault();\n      setDivider(0);\n    } else if (event.key === \"End\") {\n      event.preventDefault();\n      setDivider(100);\n    }\n  };\n\n  const firstChildStyle = (): JSX.CSSProperties =>\n    local.orientation === \"vertical\" ? { height: `${divider()}%` } : { width: `${divider()}%` };\n  const secondChildStyle = (): JSX.CSSProperties =>\n    local.orientation === \"vertical\" ? { height: `${100 - divider()}%` } : { width: `${100 - divider()}%` };\n\n  return (\n    <div\n      class={cn(\"smwb-screen-divider__wrapper\", `smwb-${local.orientation}`, local.class)}\n      ref={mergeRefs(local.ref, (el) => (wrapperEl = el))}\n      data-testid=\"screen-divider\"\n    >\n      <div class={cn(\"smwb-screen-divider__first\", `smwb-${local.orientation}`)} style={firstChildStyle()}>\n        {(child()[0] ?? \"\") as JSX.Element}\n      </div>\n      <span\n        class=\"smwb-screen-divider__resizer\"\n        onPointerDown={handleDragStart}\n        draggable={false}\n        role=\"separator\"\n        aria-orientation={local.orientation === \"vertical\" ? \"horizontal\" : \"vertical\"}\n        aria-valuenow={Math.round(divider())}\n        aria-valuemin={0}\n        aria-valuemax={100}\n        aria-label={local.resizerAriaLabel}\n        tabindex={0}\n        onKeyDown={onResizerKeyDown}\n      />\n      <div class={cn(\"smwb-screen-divider__second\", `smwb-${local.orientation}`)} style={secondChildStyle()}>\n        {(child()[1] ?? \"\") as JSX.Element}\n      </div>\n    </div>\n  );\n}\n\nexport default ScreenDivider;\n"],"names":["toPixels","percent","parentSize","getInitialDivider","sizeFirst","sizeSecond","ScreenDivider","props","merged","mergeProps","orientation","keyboardStep","resizerAriaLabel","local","splitProps","wrapperEl","divider","setDivider","createSignal","isDragging","setIsDragging","createEffect","onSizeChange","resolved","resolveChildren","children","child","toArray","dragOver","throttle","event","wrapper","relativeMouseY","clientY","offsetTop","newDivider","clientHeight","clientWidth","relativeMouseX","clientX","offsetLeft","handleDragStart","handleDragEnd","isServer","document","body","addEventListener","style","cursor","onCleanup","removeEventListener","onResizerKeyDown","decreaseKey","increaseKey","key","preventDefault","prev","Math","max","min","firstChildStyle","height","width","secondChildStyle","_el$","_tmpl$","_el$2","firstChild","_el$3","nextSibling","_el$4","_ref$","mergeRefs","ref","el","_$use","_$insert","$$keydown","$$pointerdown","_$setAttribute","_$effect","_p$","_v$","cn","class","_v$2","_v$3","_v$4","_v$5","round","_v$6","_v$7","_v$8","e","_$className","t","a","_$style","o","i","n","s","h","undefined","_$delegateEvents"],"mappings":"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"}

package/dist/components/layout/sheet/index.d.ts

@@ -0,0 +1,2 @@
+export { Sheet, default } from "./sheet";
+export type { SheetProps } from "./sheet";

package/dist/components/layout/sheet/sheet.d.ts

@@ -0,0 +1,32 @@
+import { type JSX, type ParentProps } from "solid-js";
+import { type Ref } from "../../../primitives/mergeRefs";
+export interface SheetProps extends Omit<JSX.HTMLAttributes<HTMLDivElement>, "onResize"> {
+    placement?: "top" | "bottom" | "right" | "left";
+    isOpen: boolean;
+    onClose?: (() => void) | undefined;
+    variant?: "default" | "modal";
+    withSizeToggle?: boolean;
+    /** Hide built-in header actions; onClose still handles Esc and backdrop. */
+    hideHeaderActions?: boolean;
+    reverseHeaderActions?: boolean;
+    size?: string;
+    disableOutsideClick?: boolean;
+    /** Close the sheet when Escape is pressed. */
+    closeOnEsc?: boolean;
+    /** Allow drag-to-resize (mobile bottom-sheet style). Off by default. */
+    resizable?: boolean;
+    /** Minimum size in px while resizing (default 80). */
+    minSize?: number;
+    /** Maximum size in px while resizing (default: viewport dimension). */
+    maxSize?: number;
+    /** Step in px for keyboard resizing (default 24). */
+    resizeStep?: number;
+    /** Accessible label for the resize handle. */
+    resizeHandleAriaLabel?: string;
+    /** Called with the new size in px while/after resizing. */
+    onResize?: (size: number) => void;
+    "aria-label"?: string;
+    ref?: Ref<HTMLDivElement>;
+}
+export declare function Sheet(props: ParentProps<SheetProps>): JSX.Element;
+export default Sheet;

package/dist/components/layout/sheet/sheet.js

@@ -0,0 +1,261 @@
+import { createComponent as o, Portal as j, insert as d, effect as _, className as H, template as v, mergeProps as L, use as V, spread as q, setAttribute as w, memo as F, delegateEvents as G } from "solid-js/web";
+import '../../../assets/styles/less/components/sheet/sheet.entry.css';/* empty css                                                     */
+import { mergeProps as T, splitProps as R, createSignal as B, createEffect as M, onCleanup as J, Show as g } from "solid-js";
+import C from "clsx";
+import { createCssTransition as I } from "../../../primitives/createCssTransition.js";
+import { mergeRefs as Q } from "../../../primitives/mergeRefs.js";
+import { ClickAwayListener as Z } from "../../clickAwayListener/clickAwayListener.js";
+import { Button as P } from "../../inputs/button/button.js";
+import { Icon as E } from "../../base/icon/icon.js";
+var ee = /* @__PURE__ */ v("<div class=smwb-sheet__drag-handle data-testid=sheet-drag-handle role=separator tabindex=0><span class=smwb-sheet__drag-handle-bar>"), te = /* @__PURE__ */ v("<div class=smwb-sheet__header>"), ne = /* @__PURE__ */ v("<div class=smwb-sheet__inner>"), x = /* @__PURE__ */ v("<div>");
+const re = (m) => m === "bottom" || m === "top";
+function ie(m) {
+  const S = T({
+    size: "60%",
+    withSizeToggle: !0,
+    hideHeaderActions: !1,
+    reverseHeaderActions: !1,
+    resizable: !1,
+    minSize: 80,
+    resizeStep: 24,
+    resizeHandleAriaLabel: "Resize sheet"
+  }, m), [e, y] = R(S, ["isOpen", "placement", "class", "mode", "size", "variant", "onClose", "withSizeToggle", "hideHeaderActions", "reverseHeaderActions", "resizable", "minSize", "maxSize", "resizeStep", "resizeHandleAriaLabel", "onResize", "style", "handleClose", "handleSizeButton", "children", "ref"]);
+  let p;
+  const [c, u] = B(null), a = () => re(e.placement), f = I({
+    in: () => e.isOpen,
+    timeout: {
+      enter: 120,
+      exit: 120
+    },
+    classNames: {
+      enterDone: "smwb-sheet_entered"
+    },
+    appear: !0
+  }), z = (t) => {
+    const s = a() ? window.innerHeight : window.innerWidth, n = e.maxSize ?? s;
+    return Math.max(e.minSize, Math.min(n, t));
+  }, r = () => {
+    const t = p?.getBoundingClientRect();
+    return t ? a() ? t.height : t.width : e.minSize;
+  }, l = (t) => {
+    const s = z(t);
+    u(s), e.onResize?.(s);
+  };
+  let h = null;
+  const K = (t) => {
+    t.preventDefault(), h = {
+      start: a() ? t.clientY : t.clientX,
+      size: r()
+    };
+    try {
+      t.currentTarget.setPointerCapture?.(t.pointerId);
+    } catch {
+    }
+  }, N = (t) => {
+    if (!h) return;
+    const n = (a() ? t.clientY : t.clientX) - h.start, i = e.placement === "bottom" || e.placement === "right" ? -n : n;
+    l(h.size + i);
+  }, A = (t) => {
+    h = null, t.currentTarget.hasPointerCapture?.(t.pointerId) && t.currentTarget.releasePointerCapture?.(t.pointerId);
+  }, W = (t) => {
+    const s = c() ?? r(), n = e.maxSize ?? (a() ? window.innerHeight : window.innerWidth), i = e.placement === "bottom" ? "ArrowUp" : e.placement === "top" ? "ArrowDown" : e.placement === "left" ? "ArrowRight" : "ArrowLeft", b = e.placement === "bottom" ? "ArrowDown" : e.placement === "top" ? "ArrowUp" : e.placement === "left" ? "ArrowLeft" : "ArrowRight";
+    t.key === i ? (t.preventDefault(), l(s + e.resizeStep)) : t.key === b ? (t.preventDefault(), l(s - e.resizeStep)) : t.key === "Home" ? (t.preventDefault(), l(e.minSize)) : t.key === "End" && (t.preventDefault(), l(n));
+  };
+  M(() => {
+    if (!e.isOpen) {
+      u(null);
+      return;
+    }
+    p?.focus();
+  });
+  const U = () => !e.hideHeaderActions && (!!e.onClose || e.withSizeToggle), X = () => {
+    const t = [];
+    return e.withSizeToggle && t.push(o(P, {
+      variant: "outlined",
+      size: "small",
+      get onClick() {
+        return e.handleSizeButton;
+      },
+      get children() {
+        return o(E, {
+          name: "open_in_full"
+        });
+      }
+    })), e.onClose && t.push(o(P, {
+      variant: "outlined",
+      size: "small",
+      get onClick() {
+        return e.handleClose;
+      },
+      get children() {
+        return o(E, {
+          name: "close"
+        });
+      }
+    })), e.reverseHeaderActions && t.reverse(), t;
+  }, Y = () => {
+    if (e.resizable && c() !== null) {
+      const t = `${c()}px`;
+      return {
+        ...a() ? {
+          height: t
+        } : {
+          width: t
+        },
+        transition: "none"
+      };
+    }
+    return {};
+  };
+  return (() => {
+    var t = x(), s = Q(e.ref, (n) => p = n);
+    return typeof s == "function" && V(s, t), q(t, L(y, {
+      "data-testid": "sheet",
+      tabindex: -1,
+      role: "dialog",
+      get "aria-modal"() {
+        return e.variant === "modal" || void 0;
+      },
+      get class() {
+        return C("smwb-sheet", e.class, `smwb-sheet_${e.variant}`, `smwb-${e.placement}`, f.classes(), {
+          "smwb-expanded": e.mode === "expanded",
+          "smwb-small": e.mode === "small",
+          "smwb-sheet_resizable": e.resizable
+        });
+      },
+      get style() {
+        return {
+          "--sizeProp": e.size,
+          ...Y(),
+          ...typeof e.style == "object" && e.style ? e.style : {}
+        };
+      }
+    }), !1, !0), d(t, o(g, {
+      get when() {
+        return e.resizable;
+      },
+      get children() {
+        var n = ee();
+        return n.$$keydown = W, n.addEventListener("pointercancel", A), n.$$pointerup = A, n.$$pointermove = N, n.$$pointerdown = K, _((i) => {
+          var b = a() ? "horizontal" : "vertical", k = e.resizeHandleAriaLabel, $ = e.minSize, O = Math.round(e.maxSize ?? (a() ? window.innerHeight : window.innerWidth)), D = Math.round(c() ?? r());
+          return b !== i.e && w(n, "aria-orientation", i.e = b), k !== i.t && w(n, "aria-label", i.t = k), $ !== i.a && w(n, "aria-valuemin", i.a = $), O !== i.o && w(n, "aria-valuemax", i.o = O), D !== i.i && w(n, "aria-valuenow", i.i = D), i;
+        }, {
+          e: void 0,
+          t: void 0,
+          a: void 0,
+          o: void 0,
+          i: void 0
+        }), n;
+      }
+    }), null), d(t, o(g, {
+      get when() {
+        return U();
+      },
+      get children() {
+        var n = te();
+        return d(n, X), n;
+      }
+    }), null), d(t, o(g, {
+      get when() {
+        return F(() => !!e.isOpen)() && e.mode !== "small";
+      },
+      get children() {
+        var n = ne();
+        return d(n, () => e.children), n;
+      }
+    }), null), t;
+  })();
+}
+function he(m) {
+  const S = T({
+    variant: "default",
+    placement: "bottom",
+    closeOnEsc: !0
+  }, m), [e, y] = R(S, ["isOpen", "onClose", "variant", "children", "placement", "disableOutsideClick", "closeOnEsc", "ref"]), [p, c] = B(null), u = I({
+    in: () => e.isOpen,
+    timeout: {
+      enter: 70,
+      exit: 70
+    },
+    classNames: {
+      enterDone: "smwb-entered"
+    },
+    appear: !0
+  });
+  M(() => {
+    if (!e.isOpen || !e.closeOnEsc || !e.onClose) return;
+    const r = (l) => {
+      l.key === "Escape" && e.onClose?.();
+    };
+    document.addEventListener("keydown", r), J(() => document.removeEventListener("keydown", r));
+  });
+  const a = () => {
+    c((r) => r === "expanded" ? "small" : r === null ? "expanded" : null);
+  }, f = () => {
+    e.onClose?.(), c(null);
+  }, z = () => o(ie, L(y, {
+    ref(r) {
+      var l = e.ref;
+      typeof l == "function" ? l(r) : e.ref = r;
+    },
+    get isOpen() {
+      return e.isOpen;
+    },
+    get onClose() {
+      return e.onClose;
+    },
+    handleSizeButton: a,
+    handleClose: f,
+    get mode() {
+      return p();
+    },
+    get placement() {
+      return e.placement;
+    },
+    get variant() {
+      return e.variant;
+    },
+    get children() {
+      return e.children;
+    }
+  }));
+  return o(g, {
+    get when() {
+      return u.mounted();
+    },
+    get children() {
+      return o(j, {
+        get mount() {
+          return document.body;
+        },
+        get children() {
+          return o(g, {
+            get when() {
+              return e.variant === "default";
+            },
+            get fallback() {
+              return (() => {
+                var r = x();
+                return d(r, o(Z, {
+                  onClickAway: () => !e.disableOutsideClick && f(),
+                  get children() {
+                    return z();
+                  }
+                })), _(() => H(r, C("smwb-sheet__overlay", "smwb-dark", `smwb-${e.placement}`, `smwb-sheet_${e.variant}`, u.classes()))), r;
+              })();
+            },
+            get children() {
+              var r = x();
+              return d(r, z), _(() => H(r, C(e.disableOutsideClick ? "smwb-sheet__overlay" : "smwb-sheet__default", u.classes()))), r;
+            }
+          });
+        }
+      });
+    }
+  });
+}
+G(["pointerdown", "pointermove", "pointerup", "keydown"]);
+export {
+  he as Sheet
+};
+//# sourceMappingURL=sheet.js.map

package/dist/components/layout/sheet/sheet.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sheet.js","sources":["../../../../src/components/layout/sheet/sheet.tsx"],"sourcesContent":["import { type JSX, type ParentProps, Show, createEffect, createSignal, mergeProps, onCleanup, splitProps } from \"solid-js\";\nimport { Portal } from \"solid-js/web\";\nimport cn from \"clsx\";\nimport { Button } from \"../../inputs/button\";\nimport { Icon } from \"../../base/icon\";\nimport { ClickAwayListener } from \"../../clickAwayListener\";\nimport { createCssTransition } from \"../../../primitives/createCssTransition\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport interface SheetProps extends Omit<JSX.HTMLAttributes<HTMLDivElement>, \"onResize\"> {\n  placement?: \"top\" | \"bottom\" | \"right\" | \"left\";\n  isOpen: boolean;\n  onClose?: (() => void) | undefined;\n  variant?: \"default\" | \"modal\";\n  withSizeToggle?: boolean;\n  /** Hide built-in header actions; onClose still handles Esc and backdrop. */\n  hideHeaderActions?: boolean;\n  reverseHeaderActions?: boolean;\n  size?: string;\n  disableOutsideClick?: boolean;\n  /** Close the sheet when Escape is pressed. */\n  closeOnEsc?: boolean;\n  /** Allow drag-to-resize (mobile bottom-sheet style). Off by default. */\n  resizable?: boolean;\n  /** Minimum size in px while resizing (default 80). */\n  minSize?: number;\n  /** Maximum size in px while resizing (default: viewport dimension). */\n  maxSize?: number;\n  /** Step in px for keyboard resizing (default 24). */\n  resizeStep?: number;\n  /** Accessible label for the resize handle. */\n  resizeHandleAriaLabel?: string;\n  /** Called with the new size in px while/after resizing. */\n  onResize?: (size: number) => void;\n  \"aria-label\"?: string;\n  ref?: Ref<HTMLDivElement>;\n}\n\ntype Mode = \"small\" | \"expanded\" | null;\n\nconst isVerticalAxis = (placement: SheetProps[\"placement\"]): boolean => placement === \"bottom\" || placement === \"top\";\n\ninterface SheetBlockProps extends ParentProps<SheetProps> {\n  mode: Mode;\n  handleSizeButton: () => void;\n  handleClose: () => void;\n}\n\nfunction SheetBlock(props: SheetBlockProps): JSX.Element {\n  const merged = mergeProps(\n    {\n      size: \"60%\",\n      withSizeToggle: true,\n      hideHeaderActions: false,\n      reverseHeaderActions: false,\n      resizable: false,\n      minSize: 80,\n      resizeStep: 24,\n      resizeHandleAriaLabel: \"Resize sheet\",\n    },\n    props\n  );\n  const [local, rest] = splitProps(merged, [\n    \"isOpen\",\n    \"placement\",\n    \"class\",\n    \"mode\",\n    \"size\",\n    \"variant\",\n    \"onClose\",\n    \"withSizeToggle\",\n    \"hideHeaderActions\",\n    \"reverseHeaderActions\",\n    \"resizable\",\n    \"minSize\",\n    \"maxSize\",\n    \"resizeStep\",\n    \"resizeHandleAriaLabel\",\n    \"onResize\",\n    \"style\",\n    \"handleClose\",\n    \"handleSizeButton\",\n    \"children\",\n    \"ref\",\n  ]);\n\n  let rootEl: HTMLDivElement | undefined;\n  const [dragSize, setDragSize] = createSignal<number | null>(null);\n  const vertical = (): boolean => isVerticalAxis(local.placement);\n\n  const inner = createCssTransition({\n    in: () => local.isOpen,\n    timeout: { enter: 120, exit: 120 },\n    classNames: { enterDone: \"smwb-sheet_entered\" },\n    appear: true,\n  });\n\n  const clamp = (px: number): number => {\n    const viewport = vertical() ? window.innerHeight : window.innerWidth;\n    const max = local.maxSize ?? viewport;\n    return Math.max(local.minSize, Math.min(max, px));\n  };\n\n  const currentSizePx = (): number => {\n    const rect = rootEl?.getBoundingClientRect();\n    if (!rect) return local.minSize;\n    return vertical() ? rect.height : rect.width;\n  };\n\n  const applySize = (px: number): void => {\n    const next = clamp(px);\n    setDragSize(next);\n    local.onResize?.(next);\n  };\n\n  let drag: { start: number; size: number } | null = null;\n\n  const onPointerDown = (event: PointerEvent & { currentTarget: HTMLDivElement }): void => {\n    event.preventDefault();\n    drag = { start: vertical() ? event.clientY : event.clientX, size: currentSizePx() };\n    try {\n      event.currentTarget.setPointerCapture?.(event.pointerId);\n    } catch {\n      /* best-effort */\n    }\n  };\n\n  const onPointerMove = (event: PointerEvent): void => {\n    if (!drag) return;\n    const pos = vertical() ? event.clientY : event.clientX;\n    const delta = pos - drag.start;\n    const grow = local.placement === \"bottom\" || local.placement === \"right\" ? -delta : delta;\n    applySize(drag.size + grow);\n  };\n\n  const endDrag = (event: PointerEvent & { currentTarget: HTMLDivElement }): void => {\n    drag = null;\n    if (event.currentTarget.hasPointerCapture?.(event.pointerId)) {\n      event.currentTarget.releasePointerCapture?.(event.pointerId);\n    }\n  };\n\n  const onHandleKeyDown: JSX.EventHandler<HTMLDivElement, KeyboardEvent> = (event) => {\n    const base = dragSize() ?? currentSizePx();\n    const max = local.maxSize ?? (vertical() ? window.innerHeight : window.innerWidth);\n    const incKey =\n      local.placement === \"bottom\" ? \"ArrowUp\" : local.placement === \"top\" ? \"ArrowDown\" : local.placement === \"left\" ? \"ArrowRight\" : \"ArrowLeft\";\n    const decKey =\n      local.placement === \"bottom\" ? \"ArrowDown\" : local.placement === \"top\" ? \"ArrowUp\" : local.placement === \"left\" ? \"ArrowLeft\" : \"ArrowRight\";\n    if (event.key === incKey) {\n      event.preventDefault();\n      applySize(base + local.resizeStep);\n    } else if (event.key === decKey) {\n      event.preventDefault();\n      applySize(base - local.resizeStep);\n    } else if (event.key === \"Home\") {\n      event.preventDefault();\n      applySize(local.minSize);\n    } else if (event.key === \"End\") {\n      event.preventDefault();\n      applySize(max);\n    }\n  };\n\n  createEffect(() => {\n    if (!local.isOpen) {\n      setDragSize(null);\n      return;\n    }\n    rootEl?.focus();\n  });\n\n  const showActions = (): boolean => !local.hideHeaderActions && (!!local.onClose || local.withSizeToggle);\n  const actionNodes = (): JSX.Element[] => {\n    const nodes: JSX.Element[] = [];\n    if (local.withSizeToggle) {\n      nodes.push(\n        <Button variant=\"outlined\" size=\"small\" onClick={local.handleSizeButton}>\n          <Icon name=\"open_in_full\" />\n        </Button>\n      );\n    }\n    if (local.onClose) {\n      nodes.push(\n        <Button variant=\"outlined\" size=\"small\" onClick={local.handleClose}>\n          <Icon name=\"close\" />\n        </Button>\n      );\n    }\n    if (local.reverseHeaderActions) nodes.reverse();\n    return nodes;\n  };\n\n  const sizeStyle = (): JSX.CSSProperties => {\n    if (local.resizable && dragSize() !== null) {\n      const px = `${dragSize()}px`;\n      return { ...(vertical() ? { height: px } : { width: px }), transition: \"none\" };\n    }\n    return {};\n  };\n\n  return (\n    <div\n      {...rest}\n      ref={mergeRefs(local.ref, (el) => (rootEl = el as HTMLDivElement))}\n      data-testid=\"sheet\"\n      tabindex={-1}\n      role=\"dialog\"\n      aria-modal={local.variant === \"modal\" || undefined}\n      class={cn(\"smwb-sheet\", local.class, `smwb-sheet_${local.variant}`, `smwb-${local.placement}`, inner.classes(), {\n        \"smwb-expanded\": local.mode === \"expanded\",\n        \"smwb-small\": local.mode === \"small\",\n        \"smwb-sheet_resizable\": local.resizable,\n      })}\n      style={{\n        \"--sizeProp\": local.size,\n        ...sizeStyle(),\n        ...(typeof local.style === \"object\" && local.style ? local.style : {}),\n      }}\n    >\n      <Show when={local.resizable}>\n        <div\n          class=\"smwb-sheet__drag-handle\"\n          data-testid=\"sheet-drag-handle\"\n          role=\"separator\"\n          tabindex={0}\n          aria-orientation={vertical() ? \"horizontal\" : \"vertical\"}\n          aria-label={local.resizeHandleAriaLabel}\n          aria-valuemin={local.minSize}\n          aria-valuemax={Math.round(local.maxSize ?? (vertical() ? window.innerHeight : window.innerWidth))}\n          aria-valuenow={Math.round(dragSize() ?? currentSizePx())}\n          onPointerDown={onPointerDown}\n          onPointerMove={onPointerMove}\n          onPointerUp={endDrag}\n          onPointerCancel={endDrag}\n          onKeyDown={onHandleKeyDown}\n        >\n          <span class=\"smwb-sheet__drag-handle-bar\" />\n        </div>\n      </Show>\n      <Show when={showActions()}>\n        <div class=\"smwb-sheet__header\">{actionNodes()}</div>\n      </Show>\n      <Show when={local.isOpen && local.mode !== \"small\"}>\n        <div class=\"smwb-sheet__inner\">{local.children}</div>\n      </Show>\n    </div>\n  );\n}\n\nexport function Sheet(props: ParentProps<SheetProps>): JSX.Element {\n  const merged = mergeProps({ variant: \"default\" as const, placement: \"bottom\" as const, closeOnEsc: true }, props);\n  const [local, rest] = splitProps(merged, [\n    \"isOpen\",\n    \"onClose\",\n    \"variant\",\n    \"children\",\n    \"placement\",\n    \"disableOutsideClick\",\n    \"closeOnEsc\",\n    \"ref\",\n  ]);\n\n  const [mode, setMode] = createSignal<Mode>(null);\n\n  const outer = createCssTransition({\n    in: () => local.isOpen,\n    timeout: { enter: 70, exit: 70 },\n    classNames: { enterDone: \"smwb-entered\" },\n    appear: true,\n  });\n\n  createEffect(() => {\n    if (!local.isOpen || !local.closeOnEsc || !local.onClose) return;\n    const onKeyDown = (event: KeyboardEvent): void => {\n      if (event.key === \"Escape\") local.onClose?.();\n    };\n    document.addEventListener(\"keydown\", onKeyDown);\n    onCleanup(() => document.removeEventListener(\"keydown\", onKeyDown));\n  });\n\n  const handleSizeButton = (): void => {\n    setMode((prev) => (prev === \"expanded\" ? \"small\" : prev === null ? \"expanded\" : null));\n  };\n  const handleClose = (): void => {\n    local.onClose?.();\n    setMode(null);\n  };\n\n  const block = (): JSX.Element => (\n    <SheetBlock\n      {...rest}\n      ref={local.ref}\n      isOpen={local.isOpen}\n      onClose={local.onClose}\n      handleSizeButton={handleSizeButton}\n      handleClose={handleClose}\n      mode={mode()}\n      placement={local.placement}\n      variant={local.variant}\n    >\n      {local.children}\n    </SheetBlock>\n  );\n\n  return (\n    <Show when={outer.mounted()}>\n      <Portal mount={document.body}>\n        <Show\n          when={local.variant === \"default\"}\n          fallback={\n            <div class={cn(\"smwb-sheet__overlay\", \"smwb-dark\", `smwb-${local.placement}`, `smwb-sheet_${local.variant}`, outer.classes())}>\n              <ClickAwayListener onClickAway={() => !local.disableOutsideClick && handleClose()}>\n                {block()}\n              </ClickAwayListener>\n            </div>\n          }\n        >\n          <div class={cn(local.disableOutsideClick ? \"smwb-sheet__overlay\" : \"smwb-sheet__default\", outer.classes())}>\n            {block()}\n          </div>\n        </Show>\n      </Portal>\n    </Show>\n  );\n}\n\nexport default Sheet;\n"],"names":["isVerticalAxis","placement","SheetBlock","props","merged","mergeProps","size","withSizeToggle","hideHeaderActions","reverseHeaderActions","resizable","minSize","resizeStep","resizeHandleAriaLabel","local","rest","splitProps","rootEl","dragSize","setDragSize","createSignal","vertical","inner","createCssTransition","in","isOpen","timeout","enter","exit","classNames","enterDone","appear","clamp","px","viewport","window","innerHeight","innerWidth","max","maxSize","Math","min","currentSizePx","rect","getBoundingClientRect","height","width","applySize","next","onResize","drag","onPointerDown","event","preventDefault","start","clientY","clientX","currentTarget","setPointerCapture","pointerId","onPointerMove","delta","grow","endDrag","hasPointerCapture","releasePointerCapture","onHandleKeyDown","base","incKey","decKey","key","createEffect","focus","showActions","onClose","actionNodes","nodes","push","_$createComponent","Button","variant","onClick","handleSizeButton","children","Icon","name","handleClose","reverse","sizeStyle","transition","_el$","_tmpl$4","_ref$","mergeRefs","ref","el","_$use","_$spread","_$mergeProps","undefined","cn","class","classes","mode","style","_$insert","Show","when","_el$2","_tmpl$","$$keydown","addEventListener","$$pointerup","$$pointermove","$$pointerdown","_$effect","_p$","_v$","_v$2","_v$3","_v$4","round","_v$5","e","_$setAttribute","t","a","o","i","_el$3","_tmpl$2","_$memo","_el$4","_tmpl$3","Sheet","closeOnEsc","setMode","outer","onKeyDown","document","onCleanup","removeEventListener","prev","block","r$","_ref$2","mounted","Portal","mount","body","fallback","_el$6","ClickAwayListener","onClickAway","disableOutsideClick","_$className","_el$5","_$delegateEvents"],"mappings":"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"}

package/dist/components/layout/stack/index.d.ts

@@ -0,0 +1,2 @@
+export { Stack, default } from "./stack";
+export type { StackProps, StackSpacing } from "./stack";

package/dist/components/layout/stack/stack.d.ts

@@ -0,0 +1,16 @@
+import { type JSX, type ParentProps } from "solid-js";
+import { type Ref } from "../../../primitives/mergeRefs";
+export type StackSpacing = number | "none" | "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl" | "xxxl";
+export interface StackProps extends JSX.HTMLAttributes<HTMLDivElement> {
+    direction?: "row" | "row-reverse" | "column" | "column-reverse";
+    /** Gap between items: scale keyword, or a number = N × spacing unit. */
+    spacing?: StackSpacing;
+    align?: "start" | "center" | "end" | "stretch" | "baseline";
+    justify?: "start" | "center" | "end" | "space-between" | "space-around" | "space-evenly";
+    wrap?: boolean;
+    /** Optional element rendered between each child. */
+    divider?: JSX.Element;
+    ref?: Ref<HTMLDivElement>;
+}
+export declare function Stack(props: ParentProps<StackProps>): JSX.Element;
+export default Stack;

package/dist/components/layout/stack/stack.js

@@ -0,0 +1,60 @@
+import { use as u, spread as y, mergeProps as v, insert as a, createComponent as i, template as o } from "solid-js/web";
+import '../../../assets/styles/less/components/stack/stack.entry.css';/* empty css                                                     */
+import { mergeProps as h, splitProps as w, children as $, Show as c, For as x } from "solid-js";
+import _ from "clsx";
+import { mergeRefs as b } from "../../../primitives/mergeRefs.js";
+var k = /* @__PURE__ */ o("<div>"), j = /* @__PURE__ */ o("<div class=smwb-stack__divider>");
+const l = (r) => r === "start" || r === "end" ? `flex-${r}` : r, P = (r) => typeof r == "number" ? `calc(var(--smui-spacing-unit, 4px) * ${r})` : r === "none" ? "0" : `var(--smui-space-${r})`;
+function R(r) {
+  const p = h({
+    direction: "column",
+    spacing: "md"
+  }, r), [e, d] = w(p, ["direction", "spacing", "align", "justify", "wrap", "divider", "class", "style", "children", "ref"]), m = $(() => e.children);
+  return (() => {
+    var t = k(), n = b(e.ref);
+    return typeof n == "function" && u(n, t), y(t, v(d, {
+      "data-testid": "stack",
+      get class() {
+        return _("smwb-stack", e.class);
+      },
+      get style() {
+        return {
+          display: "flex",
+          "flex-direction": e.direction,
+          "flex-wrap": e.wrap ? "wrap" : void 0,
+          "align-items": l(e.align),
+          "justify-content": l(e.justify),
+          gap: P(e.spacing),
+          ...typeof e.style == "object" && e.style ? e.style : {}
+        };
+      }
+    }), !1, !0), a(t, i(c, {
+      get when() {
+        return e.divider;
+      },
+      get fallback() {
+        return e.children;
+      },
+      get children() {
+        return i(x, {
+          get each() {
+            return m.toArray();
+          },
+          children: (f, g) => [i(c, {
+            get when() {
+              return g() > 0;
+            },
+            get children() {
+              var s = j();
+              return a(s, () => e.divider), s;
+            }
+          }), f]
+        });
+      }
+    })), t;
+  })();
+}
+export {
+  R as Stack
+};
+//# sourceMappingURL=stack.js.map

package/dist/components/layout/stack/stack.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"stack.js","sources":["../../../../src/components/layout/stack/stack.tsx"],"sourcesContent":["import { type JSX, type ParentProps, For, Show, children as resolveChildren, mergeProps, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport type StackSpacing = number | \"none\" | \"xxs\" | \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\" | \"xxl\" | \"xxxl\";\n\nexport interface StackProps extends JSX.HTMLAttributes<HTMLDivElement> {\n  direction?: \"row\" | \"row-reverse\" | \"column\" | \"column-reverse\";\n  /** Gap between items: scale keyword, or a number = N × spacing unit. */\n  spacing?: StackSpacing;\n  align?: \"start\" | \"center\" | \"end\" | \"stretch\" | \"baseline\";\n  justify?: \"start\" | \"center\" | \"end\" | \"space-between\" | \"space-around\" | \"space-evenly\";\n  wrap?: boolean;\n  /** Optional element rendered between each child. */\n  divider?: JSX.Element;\n  ref?: Ref<HTMLDivElement>;\n}\n\nconst flexAlign = (v?: string): string | undefined => (v === \"start\" || v === \"end\" ? `flex-${v}` : v);\n\nconst resolveGap = (s: StackSpacing): string =>\n  typeof s === \"number\" ? `calc(var(--smui-spacing-unit, 4px) * ${s})` : s === \"none\" ? \"0\" : `var(--smui-space-${s})`;\n\nexport function Stack(props: ParentProps<StackProps>): JSX.Element {\n  const merged = mergeProps({ direction: \"column\" as const, spacing: \"md\" as StackSpacing }, props);\n  const [local, rest] = splitProps(merged, [\n    \"direction\",\n    \"spacing\",\n    \"align\",\n    \"justify\",\n    \"wrap\",\n    \"divider\",\n    \"class\",\n    \"style\",\n    \"children\",\n    \"ref\",\n  ]);\n\n  const resolved = resolveChildren(() => local.children);\n\n  return (\n    <div\n      {...rest}\n      ref={mergeRefs(local.ref)}\n      data-testid=\"stack\"\n      class={cn(\"smwb-stack\", local.class)}\n      style={{\n        display: \"flex\",\n        \"flex-direction\": local.direction,\n        \"flex-wrap\": local.wrap ? \"wrap\" : undefined,\n        \"align-items\": flexAlign(local.align),\n        \"justify-content\": flexAlign(local.justify),\n        gap: resolveGap(local.spacing),\n        ...(typeof local.style === \"object\" && local.style ? local.style : {}),\n      }}\n    >\n      <Show when={local.divider} fallback={local.children}>\n        <For each={resolved.toArray()}>\n          {(child, index) => (\n            <>\n              <Show when={index() > 0}>\n                <div class=\"smwb-stack__divider\">{local.divider}</div>\n              </Show>\n              {child}\n            </>\n          )}\n        </For>\n      </Show>\n    </div>\n  );\n}\n\nexport default Stack;\n"],"names":["flexAlign","v","resolveGap","s","Stack","props","merged","mergeProps","direction","spacing","local","rest","splitProps","resolved","resolveChildren","children","_el$","_tmpl$","_ref$","mergeRefs","ref","_$use","_$spread","_$mergeProps","cn","class","style","display","wrap","undefined","align","justify","gap","_$insert","_$createComponent","Show","when","divider","fallback","For","each","toArray","child","index","_el$2","_tmpl$2"],"mappings":";;;;;;AAmBA,MAAMA,IAAYA,CAACC,MAAoCA,MAAM,WAAWA,MAAM,QAAQ,QAAQA,CAAC,KAAKA,GAE9FC,IAAaA,CAACC,MAClB,OAAOA,KAAM,WAAW,wCAAwCA,CAAC,MAAMA,MAAM,SAAS,MAAM,oBAAoBA,CAAC;AAE5G,SAASC,EAAMC,GAA6C;AACjE,QAAMC,IAASC,EAAW;AAAA,IAAEC,WAAW;AAAA,IAAmBC,SAAS;AAAA,EAAA,GAAwBJ,CAAK,GAC1F,CAACK,GAAOC,CAAI,IAAIC,EAAWN,GAAQ,CACvC,aACA,WACA,SACA,WACA,QACA,WACA,SACA,SACA,YACA,KAAK,CACN,GAEKO,IAAWC,EAAgB,MAAMJ,EAAMK,QAAQ;AAErD,UAAA,MAAA;AAAA,QAAAC,IAAAC,EAAAA,GAAAC,IAGSC,EAAUT,EAAMU,GAAG;AAAC,kBAAAF,KAAA,cAAAG,EAAAH,GAAAF,CAAA,GAAAM,EAAAN,GAAAO,EADrBZ,GAAI;AAAA,MAAA,eAEI;AAAA,MAAO,IAAA,QAAA;AAAA,eACZa,EAAG,cAAcd,EAAMe,KAAK;AAAA,MAAC;AAAA,MAAA,IACpCC,QAAK;AAAA,eAAE;AAAA,UACLC,SAAS;AAAA,UACT,kBAAkBjB,EAAMF;AAAAA,UACxB,aAAaE,EAAMkB,OAAO,SAASC;AAAAA,UACnC,eAAe7B,EAAUU,EAAMoB,KAAK;AAAA,UACpC,mBAAmB9B,EAAUU,EAAMqB,OAAO;AAAA,UAC1CC,KAAK9B,EAAWQ,EAAMD,OAAO;AAAA,UAC7B,GAAI,OAAOC,EAAMgB,SAAU,YAAYhB,EAAMgB,QAAQhB,EAAMgB,QAAQ,CAAA;AAAA,QAAC;AAAA,MACrE;AAAA,IAAA,CAAA,GAAA,IAAA,EAAA,GAAAO,EAAAjB,GAAAkB,EAEAC,GAAI;AAAA,MAAA,IAACC,OAAI;AAAA,eAAE1B,EAAM2B;AAAAA,MAAO;AAAA,MAAA,IAAEC,WAAQ;AAAA,eAAE5B,EAAMK;AAAAA,MAAQ;AAAA,MAAA,IAAAA,WAAA;AAAA,eAAAmB,EAChDK,GAAG;AAAA,UAAA,IAACC,OAAI;AAAA,mBAAE3B,EAAS4B,QAAAA;AAAAA,UAAS;AAAA,UAAA1B,UAC1BA,CAAC2B,GAAOC,MAAK,CAAAT,EAETC,GAAI;AAAA,YAAA,IAACC,OAAI;AAAA,qBAAEO,MAAU;AAAA,YAAC;AAAA,YAAA,IAAA5B,WAAA;AAAA,kBAAA6B,IAAAC,EAAAA;AAAAZ,qBAAAA,EAAAW,GAAA,MACalC,EAAM2B,OAAO,GAAAO;AAAAA,YAAA;AAAA,UAAA,CAAA,GAEhDF,CAAK;AAAA,QAAA,CAET;AAAA,MAAA;AAAA,IAAA,CAAA,CAAA,GAAA1B;AAAAA,EAAA,GAAA;AAKX;"}

package/dist/components/navigation/appBar/appBar.d.ts

@@ -0,0 +1,18 @@
+import { type JSX, type ParentProps } from "solid-js";
+import { type Ref } from "../../../primitives/mergeRefs";
+export type AppBarColor = "default" | "primary" | "secondary" | "error" | "success" | "warning" | "info";
+export interface AppBarProps extends Omit<JSX.HTMLAttributes<HTMLElement>, "title"> {
+    dense?: boolean;
+    position?: "relative" | "static" | "absolute" | "sticky" | "fixed";
+    placement?: "top" | "bottom";
+    leftContent?: JSX.Element;
+    midContent?: JSX.Element;
+    rightContent?: JSX.Element;
+    title?: JSX.Element | string;
+    midContentAlign?: "middle" | "left" | "right";
+    /** Semantic background color. */
+    color?: AppBarColor;
+    ref?: Ref<HTMLElement>;
+}
+export declare function AppBar(props: ParentProps<AppBarProps>): JSX.Element;
+export default AppBar;

package/dist/components/navigation/appBar/appBar.js

@@ -0,0 +1,58 @@
+import { createComponent as i, Dynamic as b, mergeProps as g, insert as r, effect as _, className as u, template as p } from "solid-js/web";
+import '../../../assets/styles/less/components/appBar/appBar.entry.css';/* empty css                                                       */
+import { mergeProps as h, splitProps as w, Show as a } from "solid-js";
+import s from "clsx";
+import { mergeRefs as $ } from "../../../primitives/mergeRefs.js";
+var v = /* @__PURE__ */ p("<div class=smwb-appbar__left__title>"), C = /* @__PURE__ */ p("<div class=smwb-appbar__inner><div class=smwb-appbar__left></div><div></div><div class=smwb-appbar__right>");
+function k(m) {
+  const c = h({
+    position: "static",
+    placement: "top",
+    midContentAlign: "middle",
+    color: "default"
+  }, m), [e, d] = w(c, ["class", "children", "dense", "position", "placement", "leftContent", "midContent", "midContentAlign", "rightContent", "title", "color", "ref"]);
+  return i(b, g({
+    get component() {
+      return e.placement === "top" ? "header" : "footer";
+    }
+  }, d, {
+    ref(n) {
+      var t = $(e.ref);
+      typeof t == "function" && t(n);
+    },
+    "data-testid": "app-bar",
+    get class() {
+      return s("smwb-appbar", e.class, `smwb-${e.position}`, `smwb-${e.placement}`, {
+        "smwb-dense": e.dense
+      }, e.color !== "default" && `smwb-appbar_color-${e.color}`);
+    },
+    get children() {
+      return i(a, {
+        get when() {
+          return e.children;
+        },
+        get fallback() {
+          return (() => {
+            var n = C(), t = n.firstChild, l = t.nextSibling, f = l.nextSibling;
+            return r(t, i(a, {
+              get when() {
+                return e.title;
+              },
+              get children() {
+                var o = v();
+                return r(o, () => e.title), o;
+              }
+            }), null), r(t, () => e.leftContent, null), r(l, () => e.midContent), r(f, () => e.rightContent), _(() => u(l, s("smwb-appbar__mid", `smwb-${e.midContentAlign}`))), n;
+          })();
+        },
+        get children() {
+          return e.children;
+        }
+      });
+    }
+  }));
+}
+export {
+  k as AppBar
+};
+//# sourceMappingURL=appBar.js.map