@smwb/ui-solid 0.4.0 → 0.5.0

package/dist/headless/source/components/layout/appLayout/appLayout.jsx

@@ -1,4 +1,4 @@
-import { Show, mergeProps, splitProps } from "solid-js";
+import { Show, children, mergeProps, splitProps } from "solid-js";
 import cn from "clsx";
 import { Icon } from "../../base/icon";
 import { createControllableState } from "../../../primitives/createControllableState";
@@ -41,6 +41,9 @@ function AppLayout(props) {
     onChange: (next) => local.onSidebarCollapsedChange?.(next)
   });
   const sidebarId = createId();
+  const headerSlot = children(() => local.header);
+  const sidebarSlot = children(() => local.sidebar);
+  const footerSlot = children(() => local.footer);
   const style = () => ({
     "--smui-app-sidebar-w": collapsed() ? len(local.sidebarCollapsedWidth) : len(local.sidebarWidth),
     ...typeof local.style === "object" && local.style ? local.style : {}
@@ -56,11 +59,11 @@ function AppLayout(props) {
     )}
     style={style()}
   >
-      <Show when={local.header}>
-        <div class="smwb-app-layout__header">{local.header}</div>
+      <Show when={headerSlot()}>
+        <div class="smwb-app-layout__header">{headerSlot()}</div>
       </Show>
       <div class="smwb-app-layout__body">
-        <Show when={local.sidebar}>
+        <Show when={sidebarSlot()}>
           <aside id={sidebarId} class="smwb-app-layout__sidebar">
             <Show when={local.collapsible}>
               <div class="smwb-app-layout__collapse">
@@ -81,13 +84,13 @@ function AppLayout(props) {
                 </Show>
               </div>
             </Show>
-            {local.sidebar}
+            {sidebarSlot()}
           </aside>
         </Show>
         <div class="smwb-app-layout__content">
           {local.children}
-          <Show when={local.footer}>
-            <div class="smwb-app-layout__footer">{local.footer}</div>
+          <Show when={footerSlot()}>
+            <div class="smwb-app-layout__footer">{footerSlot()}</div>
           </Show>
         </div>
       </div>
@@ -98,4 +101,4 @@ export {
   AppLayout,
   appLayout_default as default
 };
-//# sourceMappingURL=appLayout.js.map
+//# sourceMappingURL=appLayout.jsx.map

package/dist/headless/source/components/layout/appLayout/appLayout.jsx.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../src/components/layout/appLayout/appLayout.tsx"],"sourcesContent":["import { type JSX, type ParentProps, Show, mergeProps, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Icon } from \"../../base/icon\";\nimport { createControllableState } from \"../../../primitives/createControllableState\";\nimport { createId } from \"../../../primitives/createId\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport interface AppLayoutProps extends JSX.HTMLAttributes<HTMLDivElement> {\n  /** Top bar slot (e.g. <AppBar />). Spans full width. */\n  header?: JSX.Element;\n  /** Side navigation slot (e.g. <Sidebar />). */\n  sidebar?: JSX.Element;\n  /** Footer slot, below the content. */\n  footer?: JSX.Element;\n  /** Sidebar width (px or any CSS length). */\n  sidebarWidth?: number | string;\n  /** Controlled collapsed state of the sidebar rail. */\n  sidebarCollapsed?: boolean;\n  /** Initial collapsed state (uncontrolled). */\n  defaultSidebarCollapsed?: boolean;\n  /** Called whenever the collapsed state changes. */\n  onSidebarCollapsedChange?: (collapsed: boolean) => void;\n  /** Renders a built-in toggle button to collapse/expand the sidebar. */\n  collapsible?: boolean;\n  /** Custom toggle node replacing the default icon button. */\n  collapseToggle?: JSX.Element;\n  /** Accessible label for the default toggle button. */\n  collapseToggleAriaLabel?: string;\n  /** Sidebar collapsed width. */\n  sidebarCollapsedWidth?: number | string;\n  /** Keep the header pinned while content scrolls. */\n  stickyHeader?: boolean;\n  ref?: Ref<HTMLDivElement>;\n}\n\nconst len = (v: number | string): string => (typeof v === \"number\" ? `${v}px` : v);\n\nexport function AppLayout(props: ParentProps<AppLayoutProps>): JSX.Element {\n  const merged = mergeProps(\n    {\n      sidebarWidth: 260 as number | string,\n      defaultSidebarCollapsed: false,\n      collapsible: false,\n      collapseToggleAriaLabel: \"Toggle navigation\",\n      sidebarCollapsedWidth: 72 as number | string,\n      stickyHeader: true,\n    },\n    props\n  );\n  const [local, rest] = splitProps(merged, [\n    \"header\",\n    \"sidebar\",\n    \"footer\",\n    \"sidebarWidth\",\n    \"sidebarCollapsed\",\n    \"defaultSidebarCollapsed\",\n    \"onSidebarCollapsedChange\",\n    \"collapsible\",\n    \"collapseToggle\",\n    \"collapseToggleAriaLabel\",\n    \"sidebarCollapsedWidth\",\n    \"stickyHeader\",\n    \"class\",\n    \"style\",\n    \"children\",\n    \"ref\",\n  ]);\n\n  const [collapsed, setCollapsed] = createControllableState<boolean>({\n    value: () => local.sidebarCollapsed,\n    defaultValue: local.defaultSidebarCollapsed,\n    onChange: (next) => local.onSidebarCollapsedChange?.(next),\n  });\n\n  const sidebarId = createId();\n\n  const style = (): JSX.CSSProperties => ({\n    \"--smui-app-sidebar-w\": collapsed() ? len(local.sidebarCollapsedWidth) : len(local.sidebarWidth),\n    ...(typeof local.style === \"object\" && local.style ? local.style : {}),\n  });\n\n  return (\n    <div\n      {...rest}\n      ref={mergeRefs(local.ref)}\n      data-testid=\"app-layout\"\n      class={cn(\n        \"smwb-app-layout\",\n        { \"smwb-app-layout_sticky-header\": local.stickyHeader, \"smwb-app-layout_collapsed\": collapsed() },\n        local.class\n      )}\n      style={style()}\n    >\n      <Show when={local.header}>\n        <div class=\"smwb-app-layout__header\">{local.header}</div>\n      </Show>\n      <div class=\"smwb-app-layout__body\">\n        <Show when={local.sidebar}>\n          <aside id={sidebarId} class=\"smwb-app-layout__sidebar\">\n            <Show when={local.collapsible}>\n              <div class=\"smwb-app-layout__collapse\">\n                <Show\n                  when={local.collapseToggle}\n                  fallback={\n                    <button\n                      type=\"button\"\n                      class=\"smwb-app-layout__collapse-btn\"\n                      aria-label={local.collapseToggleAriaLabel}\n                      aria-expanded={!collapsed()}\n                      aria-controls={sidebarId}\n                      onClick={() => setCollapsed(!collapsed())}\n                    >\n                      <Icon name={collapsed() ? \"chevron_right\" : \"chevron_left\"} size={20} />\n                    </button>\n                  }\n                >\n                  {local.collapseToggle}\n                </Show>\n              </div>\n            </Show>\n            {local.sidebar}\n          </aside>\n        </Show>\n        <div class=\"smwb-app-layout__content\">\n          {local.children}\n          <Show when={local.footer}>\n            <div class=\"smwb-app-layout__footer\">{local.footer}</div>\n          </Show>\n        </div>\n      </div>\n    </div>\n  );\n}\n\nexport default AppLayout;\n"],"mappings":"AAAA,SAAqC,MAAM,YAAY,kBAAkB;AACzE,OAAO,QAAQ;AACf,SAAS,YAAY;AACrB,SAAS,+BAA+B;AACxC,SAAS,gBAAgB;AACzB,SAAS,iBAA2B;AA8BpC,MAAM,MAAM,CAAC,MAAgC,OAAO,MAAM,WAAW,GAAG,CAAC,OAAO;AAEzE,SAAS,UAAU,OAAiD;AACzE,QAAM,SAAS;AAAA,IACb;AAAA,MACE,cAAc;AAAA,MACd,yBAAyB;AAAA,MACzB,aAAa;AAAA,MACb,yBAAyB;AAAA,MACzB,uBAAuB;AAAA,MACvB,cAAc;AAAA,IAChB;AAAA,IACA;AAAA,EACF;AACA,QAAM,CAAC,OAAO,IAAI,IAAI,WAAW,QAAQ;AAAA,IACvC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,CAAC,WAAW,YAAY,IAAI,wBAAiC;AAAA,IACjE,OAAO,MAAM,MAAM;AAAA,IACnB,cAAc,MAAM;AAAA,IACpB,UAAU,CAAC,SAAS,MAAM,2BAA2B,IAAI;AAAA,EAC3D,CAAC;AAED,QAAM,YAAY,SAAS;AAE3B,QAAM,QAAQ,OAA0B;AAAA,IACtC,wBAAwB,UAAU,IAAI,IAAI,MAAM,qBAAqB,IAAI,IAAI,MAAM,YAAY;AAAA,IAC/F,GAAI,OAAO,MAAM,UAAU,YAAY,MAAM,QAAQ,MAAM,QAAQ,CAAC;AAAA,EACtE;AAEA,SACE,CAAC;AAAA,QACK;AAAA,IACJ,KAAK,UAAU,MAAM,GAAG;AAAA,IACxB,YAAY;AAAA,IACZ,OAAO;AAAA,MACL;AAAA,MACA,EAAE,iCAAiC,MAAM,cAAc,6BAA6B,UAAU,EAAE;AAAA,MAChG,MAAM;AAAA,IACR;AAAA,IACA,OAAO,MAAM;AAAA,GACd;AAAA,MACC,CAAC,KAAK,MAAM,MAAM,QAAQ;AAAA,QACxB,CAAC,IAAI,MAAM,2BAA2B,MAAM,OAAO,EAAlD,IAAwD;AAAA,MAC3D,EAFC,KAEM;AAAA,MACP,CAAC,IAAI,MAAM,wBAAwB;AAAA,QACjC,CAAC,KAAK,MAAM,MAAM,SAAS;AAAA,UACzB,CAAC,MAAM,IAAI,WAAW,MAAM,2BAA2B;AAAA,YACrD,CAAC,KAAK,MAAM,MAAM,aAAa;AAAA,cAC7B,CAAC,IAAI,MAAM,4BAA4B;AAAA,gBACrC,CAAC;AAAA,IACC,MAAM,MAAM;AAAA,IACZ,UACE,CAAC;AAAA,MACC,KAAK;AAAA,MACL,MAAM;AAAA,MACN,YAAY,MAAM;AAAA,MAClB,eAAe,CAAC,UAAU;AAAA,MAC1B,eAAe;AAAA,MACf,SAAS,MAAM,aAAa,CAAC,UAAU,CAAC;AAAA,KACzC;AAAA,sBACC,CAAC,KAAK,MAAM,UAAU,IAAI,kBAAkB,gBAAgB,MAAM,IAAI,EAAE;AAAA,oBAC1E,EATC;AAAA,GAWJ;AAAA,mBACE,MAAM,eAAe;AAAA,gBACxB,EAhBC,KAgBM;AAAA,cACT,EAlBC,IAkBK;AAAA,YACR,EApBC,KAoBM;AAAA,aACN,MAAM,QAAQ;AAAA,UACjB,EAvBC,MAuBO;AAAA,QACV,EAzBC,KAyBM;AAAA,QACP,CAAC,IAAI,MAAM,2BAA2B;AAAA,WACnC,MAAM,SAAS;AAAA,UAChB,CAAC,KAAK,MAAM,MAAM,QAAQ;AAAA,YACxB,CAAC,IAAI,MAAM,2BAA2B,MAAM,OAAO,EAAlD,IAAwD;AAAA,UAC3D,EAFC,KAEM;AAAA,QACT,EALC,IAKK;AAAA,MACR,EAjCC,IAiCK;AAAA,IACR,EAhDC;AAkDL;AAEA,IAAO,oBAAQ;","names":[],"file":"appLayout.jsx"}
+{"version":3,"sources":["../../../../../../src/components/layout/appLayout/appLayout.tsx"],"sourcesContent":["import { type JSX, type ParentProps, Show, children, mergeProps, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Icon } from \"../../base/icon\";\nimport { createControllableState } from \"../../../primitives/createControllableState\";\nimport { createId } from \"../../../primitives/createId\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport interface AppLayoutProps extends JSX.HTMLAttributes<HTMLDivElement> {\n  /** Top bar slot (e.g. <AppBar />). Spans full width. */\n  header?: JSX.Element;\n  /** Side navigation slot (e.g. <Sidebar />). */\n  sidebar?: JSX.Element;\n  /** Footer slot, below the content. */\n  footer?: JSX.Element;\n  /** Sidebar width (px or any CSS length). */\n  sidebarWidth?: number | string;\n  /** Controlled collapsed state of the sidebar rail. */\n  sidebarCollapsed?: boolean;\n  /** Initial collapsed state (uncontrolled). */\n  defaultSidebarCollapsed?: boolean;\n  /** Called whenever the collapsed state changes. */\n  onSidebarCollapsedChange?: (collapsed: boolean) => void;\n  /** Renders a built-in toggle button to collapse/expand the sidebar. */\n  collapsible?: boolean;\n  /** Custom toggle node replacing the default icon button. */\n  collapseToggle?: JSX.Element;\n  /** Accessible label for the default toggle button. */\n  collapseToggleAriaLabel?: string;\n  /** Sidebar collapsed width. */\n  sidebarCollapsedWidth?: number | string;\n  /** Keep the header pinned while content scrolls. */\n  stickyHeader?: boolean;\n  ref?: Ref<HTMLDivElement>;\n}\n\nconst len = (v: number | string): string => (typeof v === \"number\" ? `${v}px` : v);\n\nexport function AppLayout(props: ParentProps<AppLayoutProps>): JSX.Element {\n  const merged = mergeProps(\n    {\n      sidebarWidth: 260 as number | string,\n      defaultSidebarCollapsed: false,\n      collapsible: false,\n      collapseToggleAriaLabel: \"Toggle navigation\",\n      sidebarCollapsedWidth: 72 as number | string,\n      stickyHeader: true,\n    },\n    props\n  );\n  const [local, rest] = splitProps(merged, [\n    \"header\",\n    \"sidebar\",\n    \"footer\",\n    \"sidebarWidth\",\n    \"sidebarCollapsed\",\n    \"defaultSidebarCollapsed\",\n    \"onSidebarCollapsedChange\",\n    \"collapsible\",\n    \"collapseToggle\",\n    \"collapseToggleAriaLabel\",\n    \"sidebarCollapsedWidth\",\n    \"stickyHeader\",\n    \"class\",\n    \"style\",\n    \"children\",\n    \"ref\",\n  ]);\n\n  const [collapsed, setCollapsed] = createControllableState<boolean>({\n    value: () => local.sidebarCollapsed,\n    defaultValue: local.defaultSidebarCollapsed,\n    onChange: (next) => local.onSidebarCollapsedChange?.(next),\n  });\n\n  const sidebarId = createId();\n\n  // Resolve slot props through `children()` so each is created once, in THIS\n  // component's reactive context. A pre-created element passed straight into a\n  // <Show> gets its hydration key at the caller's position but renders at the\n  // Show's, so the hydration walk can't find it (\"Unable to find DOM nodes for\n  // key\"). Resolving here keeps the key sequence aligned on server and client.\n  const headerSlot = children(() => local.header);\n  const sidebarSlot = children(() => local.sidebar);\n  const footerSlot = children(() => local.footer);\n\n  const style = (): JSX.CSSProperties => ({\n    \"--smui-app-sidebar-w\": collapsed() ? len(local.sidebarCollapsedWidth) : len(local.sidebarWidth),\n    ...(typeof local.style === \"object\" && local.style ? local.style : {}),\n  });\n\n  return (\n    <div\n      {...rest}\n      ref={mergeRefs(local.ref)}\n      data-testid=\"app-layout\"\n      class={cn(\n        \"smwb-app-layout\",\n        { \"smwb-app-layout_sticky-header\": local.stickyHeader, \"smwb-app-layout_collapsed\": collapsed() },\n        local.class\n      )}\n      style={style()}\n    >\n      <Show when={headerSlot()}>\n        <div class=\"smwb-app-layout__header\">{headerSlot()}</div>\n      </Show>\n      <div class=\"smwb-app-layout__body\">\n        <Show when={sidebarSlot()}>\n          <aside id={sidebarId} class=\"smwb-app-layout__sidebar\">\n            <Show when={local.collapsible}>\n              <div class=\"smwb-app-layout__collapse\">\n                <Show\n                  when={local.collapseToggle}\n                  fallback={\n                    <button\n                      type=\"button\"\n                      class=\"smwb-app-layout__collapse-btn\"\n                      aria-label={local.collapseToggleAriaLabel}\n                      aria-expanded={!collapsed()}\n                      aria-controls={sidebarId}\n                      onClick={() => setCollapsed(!collapsed())}\n                    >\n                      <Icon name={collapsed() ? \"chevron_right\" : \"chevron_left\"} size={20} />\n                    </button>\n                  }\n                >\n                  {local.collapseToggle}\n                </Show>\n              </div>\n            </Show>\n            {sidebarSlot()}\n          </aside>\n        </Show>\n        <div class=\"smwb-app-layout__content\">\n          {local.children}\n          <Show when={footerSlot()}>\n            <div class=\"smwb-app-layout__footer\">{footerSlot()}</div>\n          </Show>\n        </div>\n      </div>\n    </div>\n  );\n}\n\nexport default AppLayout;\n"],"mappings":"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","names":[],"file":"appLayout.jsx"}

package/dist/headless/source/components/layout/divider/divider.jsx

@@ -65,4 +65,4 @@ export {
   Divider,
   divider_default as default
 };
-//# sourceMappingURL=divider.js.map
+//# sourceMappingURL=divider.jsx.map

package/dist/headless/source/components/layout/grid/grid.jsx

@@ -109,4 +109,4 @@ export {
   justifyContentOptions,
   wrapOptions
 };
-//# sourceMappingURL=grid.js.map
+//# sourceMappingURL=grid.jsx.map

package/dist/headless/source/components/layout/page/page.jsx

@@ -25,4 +25,4 @@ export {
   Page,
   page_default as default
 };
-//# sourceMappingURL=page.js.map
+//# sourceMappingURL=page.jsx.map

package/dist/headless/source/components/layout/pageHeader/pageHeader.jsx

@@ -49,4 +49,4 @@ export {
   PageHeader,
   pageHeader_default as default
 };
-//# sourceMappingURL=pageHeader.js.map
+//# sourceMappingURL=pageHeader.jsx.map

package/dist/headless/source/components/layout/screenDivider/screenDivider.jsx

@@ -126,4 +126,4 @@ export {
   ScreenDivider,
   screenDivider_default as default
 };
-//# sourceMappingURL=screenDivider.js.map
+//# sourceMappingURL=screenDivider.jsx.map

package/dist/headless/source/components/layout/sheet/sheet.jsx

@@ -258,4 +258,4 @@ export {
   Sheet,
   sheet_default as default
 };
-//# sourceMappingURL=sheet.js.map
+//# sourceMappingURL=sheet.jsx.map

package/dist/headless/source/components/layout/stack/stack.jsx

@@ -50,4 +50,4 @@ export {
   Stack,
   stack_default as default
 };
-//# sourceMappingURL=stack.js.map
+//# sourceMappingURL=stack.jsx.map

package/dist/headless/source/components/navigation/appBar/appBar.jsx

@@ -62,4 +62,4 @@ export {
   AppBar,
   appBar_default as default
 };
-//# sourceMappingURL=appBar.js.map
+//# sourceMappingURL=appBar.jsx.map

package/dist/headless/source/components/navigation/bottomBar/bottomBar.jsx

@@ -1,4 +1,4 @@
-import { For, Show, createSignal, mergeProps, splitProps } from "solid-js";
+import { For, Show, children, createSignal, mergeProps, splitProps } from "solid-js";
 import { Dynamic } from "solid-js/web";
 import cn from "clsx";
 import { Icon } from "../../base/icon";
@@ -10,6 +10,7 @@ import { callHandler } from "../../../primitives/callHandler";
 function BarItem(props) {
   const [local, rest] = splitProps(props, ["isActive", "icon", "title", "as", "href", "ref"]);
   let rippleActions;
+  const icon = children(() => local.icon);
   const onPointerDown = (event) => {
     rippleActions?.onRipple(event);
   };
@@ -22,8 +23,8 @@ function BarItem(props) {
     onPointerDown={onPointerDown}
     {...rest}
   >
-      <Show when={local.icon}>
-        <span class="smwb-bottom-bar__item-icon">{local.icon}</span>
+      <Show when={icon()}>
+        <span class="smwb-bottom-bar__item-icon">{icon()}</span>
       </Show>
       <Show when={local.title}>
         <span class="smwb-bottom-bar__item-title">{local.title}</span>
@@ -131,4 +132,4 @@ export {
   BottomBar,
   bottomBar_default as default
 };
-//# sourceMappingURL=bottomBar.js.map
+//# sourceMappingURL=bottomBar.jsx.map

package/dist/headless/source/components/navigation/bottomBar/bottomBar.jsx.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../src/components/navigation/bottomBar/bottomBar.tsx"],"sourcesContent":["import { type JSX, For, Show, createSignal, mergeProps, splitProps } from \"solid-js\";\nimport { Dynamic } from \"solid-js/web\";\nimport cn from \"clsx\";\nimport { Icon } from \"../../base/icon\";\nimport { Ripple, type RippleActionsRef } from \"../../base/ripple\";\nimport { Menu, MenuItem, MenuItemIcon, MenuItemText } from \"../menu\";\nimport { createControllableState } from \"../../../primitives/createControllableState\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\nimport { callHandler } from \"../../../primitives/callHandler\";\nimport type { SidebarMenuItemProps } from \"../sidebar/sidebar\";\n\nexport type BottomBarMenuItemProps = SidebarMenuItemProps;\n\nexport interface BottomBarProps extends JSX.HTMLAttributes<HTMLElement> {\n  menuItems?: SidebarMenuItemProps[];\n  visibleCount?: number;\n  activeItem?: number | null;\n  defaultActiveItem?: number | null;\n  onActiveItemChange?: (index: number) => void;\n  overflowMenuAriaLabel?: string;\n  ref?: Ref<HTMLElement>;\n}\n\ninterface BarItemProps extends Omit<JSX.HTMLAttributes<HTMLDivElement>, \"title\"> {\n  icon?: JSX.Element;\n  title?: string;\n  isActive?: boolean;\n  as?: string | undefined;\n  href?: string | undefined;\n  ref?: Ref<HTMLDivElement>;\n}\n\nfunction BarItem(props: BarItemProps): JSX.Element {\n  const [local, rest] = splitProps(props, [\"isActive\", \"icon\", \"title\", \"as\", \"href\", \"ref\"]);\n  let rippleActions: RippleActionsRef | undefined;\n  const onPointerDown = (event: PointerEvent): void => {\n    rippleActions?.onRipple(event);\n  };\n  return (\n    <Dynamic\n      component={local.as ?? \"div\"}\n      ref={mergeRefs(local.ref)}\n      href={local.href}\n      role=\"menuitem\"\n      class={cn(\"smwb-bottom-bar__item\", { \"smwb-bottom-bar__item_active\": local.isActive })}\n      onPointerDown={onPointerDown}\n      {...rest}\n    >\n      <Show when={local.icon}>\n        <span class=\"smwb-bottom-bar__item-icon\">{local.icon}</span>\n      </Show>\n      <Show when={local.title}>\n        <span class=\"smwb-bottom-bar__item-title\">{local.title}</span>\n      </Show>\n      <Ripple actionRef={(actions) => (rippleActions = actions)} />\n    </Dynamic>\n  );\n}\n\nexport function BottomBar(props: BottomBarProps): JSX.Element {\n  const merged = mergeProps(\n    {\n      menuItems: [] as SidebarMenuItemProps[],\n      visibleCount: 4,\n      defaultActiveItem: null as number | null,\n      overflowMenuAriaLabel: \"More navigation\",\n    },\n    props\n  );\n  const [local, rest] = splitProps(merged, [\n    \"class\",\n    \"menuItems\",\n    \"visibleCount\",\n    \"activeItem\",\n    \"defaultActiveItem\",\n    \"onActiveItemChange\",\n    \"overflowMenuAriaLabel\",\n    \"ref\",\n  ]);\n\n  const [activeItem, setActiveItem] = createControllableState<number | null>({\n    value: () => local.activeItem,\n    defaultValue: local.defaultActiveItem,\n    onChange: (next) => {\n      if (next !== null) local.onActiveItemChange?.(next);\n    },\n  });\n  const [overflowOpen, setOverflowOpen] = createSignal(false);\n  const [overflowAnchor, setOverflowAnchor] = createSignal<HTMLElement | null>(null);\n\n  const safeVisibleCount = (): number => Math.max(0, local.visibleCount);\n  const visibleItems = (): SidebarMenuItemProps[] => local.menuItems.slice(0, safeVisibleCount());\n  const overflowItems = (): SidebarMenuItemProps[] => local.menuItems.slice(safeVisibleCount());\n  const hasOverflow = (): boolean => overflowItems().length > 0;\n  const overflowActive = (): boolean =>\n    hasOverflow() && activeItem() !== null && (activeItem() as number) >= safeVisibleCount();\n\n  return (\n    <nav {...rest} ref={mergeRefs(local.ref)} class={cn(\"smwb-bottom-bar\", local.class)} role=\"navigation\">\n      <div class=\"smwb-bottom-bar__nav\" role=\"menubar\">\n        <For each={visibleItems()}>\n          {(item, idx) => (\n            <BarItem\n              as={item.as}\n              isActive={activeItem() === idx()}\n              onClick={(event) => {\n                setActiveItem(idx());\n                callHandler(item.onClick, event);\n              }}\n              icon={item.icon}\n              title={item.title}\n              href={item.href}\n            />\n          )}\n        </For>\n        <Show when={hasOverflow()}>\n          <BarItem\n            ref={(el) => setOverflowAnchor(el as HTMLElement)}\n            isActive={overflowActive()}\n            onClick={() => setOverflowOpen((prev) => !prev)}\n            icon={<Icon name=\"menu\" size={24} />}\n            aria-label={local.overflowMenuAriaLabel}\n            aria-haspopup=\"menu\"\n            aria-expanded={overflowOpen()}\n          />\n        </Show>\n      </div>\n      <Show when={hasOverflow()}>\n        <Menu\n          isOpen={overflowOpen()}\n          onClose={() => setOverflowOpen(false)}\n          anchorElement={overflowAnchor()}\n          placement=\"top\"\n          dense\n        >\n          <For each={overflowItems()}>\n            {(item, idx) => {\n              const itemIndex = (): number => safeVisibleCount() + idx();\n              return (\n                <MenuItem\n                  selected={activeItem() === itemIndex()}\n                  href={item.href}\n                  onClick={(event) => {\n                    setActiveItem(itemIndex());\n                    callHandler(\n                      item.onClick,\n                      event as unknown as MouseEvent & { currentTarget: HTMLDivElement; target: Element }\n                    );\n                    setOverflowOpen(false);\n                  }}\n                >\n                  <Show when={item.icon}>\n                    <MenuItemIcon>{item.icon}</MenuItemIcon>\n                  </Show>\n                  <MenuItemText inset={!item.icon}>{item.title}</MenuItemText>\n                </MenuItem>\n              );\n            }}\n          </For>\n        </Menu>\n      </Show>\n    </nav>\n  );\n}\n\nexport default BottomBar;\n"],"mappings":"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","names":[],"file":"bottomBar.jsx"}
+{"version":3,"sources":["../../../../../../src/components/navigation/bottomBar/bottomBar.tsx"],"sourcesContent":["import { type JSX, For, Show, children, createSignal, mergeProps, splitProps } from \"solid-js\";\nimport { Dynamic } from \"solid-js/web\";\nimport cn from \"clsx\";\nimport { Icon } from \"../../base/icon\";\nimport { Ripple, type RippleActionsRef } from \"../../base/ripple\";\nimport { Menu, MenuItem, MenuItemIcon, MenuItemText } from \"../menu\";\nimport { createControllableState } from \"../../../primitives/createControllableState\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\nimport { callHandler } from \"../../../primitives/callHandler\";\nimport type { SidebarMenuItemProps } from \"../sidebar/sidebar\";\n\nexport type BottomBarMenuItemProps = SidebarMenuItemProps;\n\nexport interface BottomBarProps extends JSX.HTMLAttributes<HTMLElement> {\n  menuItems?: SidebarMenuItemProps[];\n  visibleCount?: number;\n  activeItem?: number | null;\n  defaultActiveItem?: number | null;\n  onActiveItemChange?: (index: number) => void;\n  overflowMenuAriaLabel?: string;\n  ref?: Ref<HTMLElement>;\n}\n\ninterface BarItemProps extends Omit<JSX.HTMLAttributes<HTMLDivElement>, \"title\"> {\n  icon?: JSX.Element;\n  title?: string;\n  isActive?: boolean;\n  as?: string | undefined;\n  href?: string | undefined;\n  ref?: Ref<HTMLDivElement>;\n}\n\nfunction BarItem(props: BarItemProps): JSX.Element {\n  const [local, rest] = splitProps(props, [\"isActive\", \"icon\", \"title\", \"as\", \"href\", \"ref\"]);\n  let rippleActions: RippleActionsRef | undefined;\n  // Resolve the icon in this item's context so a pre-created element passed via\n  // menuItems hydrates (see the same fix in Sidebar/AppLayout).\n  const icon = children(() => local.icon);\n  const onPointerDown = (event: PointerEvent): void => {\n    rippleActions?.onRipple(event);\n  };\n  return (\n    <Dynamic\n      component={local.as ?? \"div\"}\n      ref={mergeRefs(local.ref)}\n      href={local.href}\n      role=\"menuitem\"\n      class={cn(\"smwb-bottom-bar__item\", { \"smwb-bottom-bar__item_active\": local.isActive })}\n      onPointerDown={onPointerDown}\n      {...rest}\n    >\n      <Show when={icon()}>\n        <span class=\"smwb-bottom-bar__item-icon\">{icon()}</span>\n      </Show>\n      <Show when={local.title}>\n        <span class=\"smwb-bottom-bar__item-title\">{local.title}</span>\n      </Show>\n      <Ripple actionRef={(actions) => (rippleActions = actions)} />\n    </Dynamic>\n  );\n}\n\nexport function BottomBar(props: BottomBarProps): JSX.Element {\n  const merged = mergeProps(\n    {\n      menuItems: [] as SidebarMenuItemProps[],\n      visibleCount: 4,\n      defaultActiveItem: null as number | null,\n      overflowMenuAriaLabel: \"More navigation\",\n    },\n    props\n  );\n  const [local, rest] = splitProps(merged, [\n    \"class\",\n    \"menuItems\",\n    \"visibleCount\",\n    \"activeItem\",\n    \"defaultActiveItem\",\n    \"onActiveItemChange\",\n    \"overflowMenuAriaLabel\",\n    \"ref\",\n  ]);\n\n  const [activeItem, setActiveItem] = createControllableState<number | null>({\n    value: () => local.activeItem,\n    defaultValue: local.defaultActiveItem,\n    onChange: (next) => {\n      if (next !== null) local.onActiveItemChange?.(next);\n    },\n  });\n  const [overflowOpen, setOverflowOpen] = createSignal(false);\n  const [overflowAnchor, setOverflowAnchor] = createSignal<HTMLElement | null>(null);\n\n  const safeVisibleCount = (): number => Math.max(0, local.visibleCount);\n  const visibleItems = (): SidebarMenuItemProps[] => local.menuItems.slice(0, safeVisibleCount());\n  const overflowItems = (): SidebarMenuItemProps[] => local.menuItems.slice(safeVisibleCount());\n  const hasOverflow = (): boolean => overflowItems().length > 0;\n  const overflowActive = (): boolean =>\n    hasOverflow() && activeItem() !== null && (activeItem() as number) >= safeVisibleCount();\n\n  return (\n    <nav {...rest} ref={mergeRefs(local.ref)} class={cn(\"smwb-bottom-bar\", local.class)} role=\"navigation\">\n      <div class=\"smwb-bottom-bar__nav\" role=\"menubar\">\n        <For each={visibleItems()}>\n          {(item, idx) => (\n            <BarItem\n              as={item.as}\n              isActive={activeItem() === idx()}\n              onClick={(event) => {\n                setActiveItem(idx());\n                callHandler(item.onClick, event);\n              }}\n              icon={item.icon}\n              title={item.title}\n              href={item.href}\n            />\n          )}\n        </For>\n        <Show when={hasOverflow()}>\n          <BarItem\n            ref={(el) => setOverflowAnchor(el as HTMLElement)}\n            isActive={overflowActive()}\n            onClick={() => setOverflowOpen((prev) => !prev)}\n            icon={<Icon name=\"menu\" size={24} />}\n            aria-label={local.overflowMenuAriaLabel}\n            aria-haspopup=\"menu\"\n            aria-expanded={overflowOpen()}\n          />\n        </Show>\n      </div>\n      <Show when={hasOverflow()}>\n        <Menu\n          isOpen={overflowOpen()}\n          onClose={() => setOverflowOpen(false)}\n          anchorElement={overflowAnchor()}\n          placement=\"top\"\n          dense\n        >\n          <For each={overflowItems()}>\n            {(item, idx) => {\n              const itemIndex = (): number => safeVisibleCount() + idx();\n              return (\n                <MenuItem\n                  selected={activeItem() === itemIndex()}\n                  href={item.href}\n                  onClick={(event) => {\n                    setActiveItem(itemIndex());\n                    callHandler(\n                      item.onClick,\n                      event as unknown as MouseEvent & { currentTarget: HTMLDivElement; target: Element }\n                    );\n                    setOverflowOpen(false);\n                  }}\n                >\n                  <Show when={item.icon}>\n                    <MenuItemIcon>{item.icon}</MenuItemIcon>\n                  </Show>\n                  <MenuItemText inset={!item.icon}>{item.title}</MenuItemText>\n                </MenuItem>\n              );\n            }}\n          </For>\n        </Menu>\n      </Show>\n    </nav>\n  );\n}\n\nexport default BottomBar;\n"],"mappings":"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","names":[],"file":"bottomBar.jsx"}

package/dist/headless/source/components/navigation/breadcrumbs/breadcrumbs.jsx

@@ -59,4 +59,4 @@ export {
   Breadcrumbs,
   breadcrumbs_default as default
 };
-//# sourceMappingURL=breadcrumbs.js.map
+//# sourceMappingURL=breadcrumbs.jsx.map

package/dist/headless/source/components/navigation/menu/menu.jsx

@@ -24,4 +24,4 @@ export {
   Menu,
   menu_default as default
 };
-//# sourceMappingURL=menu.js.map
+//# sourceMappingURL=menu.jsx.map

package/dist/headless/source/components/navigation/menu/menuComponent.jsx

@@ -15,4 +15,4 @@ export {
   MenuComponent,
   menuComponent_default as default
 };
-//# sourceMappingURL=menuComponent.js.map
+//# sourceMappingURL=menuComponent.jsx.map

package/dist/headless/source/components/navigation/menu/menuDivider.jsx

@@ -16,4 +16,4 @@ export {
   MenuDivider,
   menuDivider_default as default
 };
-//# sourceMappingURL=menuDivider.js.map
+//# sourceMappingURL=menuDivider.jsx.map

package/dist/headless/source/components/navigation/menu/menuFloating.jsx

@@ -81,4 +81,4 @@ export {
   buildMenuFloatingMiddleware,
   menuFloating_default as default
 };
-//# sourceMappingURL=menuFloating.js.map
+//# sourceMappingURL=menuFloating.jsx.map

package/dist/headless/source/components/navigation/menu/menuItem.jsx

@@ -65,4 +65,4 @@ export {
   MenuItem,
   menuItem_default as default
 };
-//# sourceMappingURL=menuItem.js.map
+//# sourceMappingURL=menuItem.jsx.map

package/dist/headless/source/components/navigation/menu/menuItemIcon.jsx

@@ -22,4 +22,4 @@ export {
   MenuItemIcon,
   menuItemIcon_default as default
 };
-//# sourceMappingURL=menuItemIcon.js.map
+//# sourceMappingURL=menuItemIcon.jsx.map

package/dist/headless/source/components/navigation/menu/menuItemText.jsx

@@ -22,4 +22,4 @@ export {
   MenuItemText,
   menuItemText_default as default
 };
-//# sourceMappingURL=menuItemText.js.map
+//# sourceMappingURL=menuItemText.jsx.map

package/dist/headless/source/components/navigation/menu/menuList.jsx

@@ -43,4 +43,4 @@ export {
   MenuList,
   menuList_default as default
 };
-//# sourceMappingURL=menuList.js.map
+//# sourceMappingURL=menuList.jsx.map

package/dist/headless/source/components/navigation/menu/menuSubmenu.jsx

@@ -83,4 +83,4 @@ export {
   MenuSubmenu,
   menuSubmenu_default as default
 };
-//# sourceMappingURL=menuSubmenu.js.map
+//# sourceMappingURL=menuSubmenu.jsx.map

package/dist/headless/source/components/navigation/overflowMenu/index.js

@@ -0,0 +1,5 @@
+import { OverflowMenu } from "./overflowMenu";
+export {
+  OverflowMenu
+};
+//# sourceMappingURL=index.js.map

package/dist/headless/source/components/navigation/overflowMenu/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../src/components/navigation/overflowMenu/index.ts"],
+  "sourcesContent": ["export { OverflowMenu } from \"./overflowMenu\";\nexport type { OverflowMenuProps, OverflowMenuItem } from \"./overflowMenu\";\n"],
+  "mappings": "AAAA,SAAS,oBAAoB;",
+  "names": []
+}

package/dist/headless/source/components/navigation/overflowMenu/overflowMenu.jsx

@@ -0,0 +1,60 @@
+import { For, Show, createSignal, mergeProps, splitProps } from "solid-js";
+import cn from "clsx";
+import { Button } from "../../inputs/button";
+import { Icon } from "../../base/icon";
+import { Menu, MenuItem } from "../menu";
+function OverflowMenu(props) {
+  const merged = mergeProps({ icon: "more_vert" }, props);
+  const [local] = splitProps(merged, ["items", "icon", "placement", "aria-label", "disabled", "class"]);
+  const [anchor, setAnchor] = createSignal(null);
+  const [open, setOpen] = createSignal(false);
+  const close = () => {
+    setOpen(false);
+  };
+  const onItemClick = (item) => {
+    if (item.disabled) return;
+    item.onSelect?.();
+    close();
+  };
+  return <span class={cn("smwb-overflow-menu", local.class)}>
+      <Button
+    ref={(el) => {
+      setAnchor(el);
+    }}
+    variant="text"
+    size="small"
+    icon={local.icon}
+    aria-label={local["aria-label"] ?? "More actions"}
+    aria-haspopup="menu"
+    disabled={!!local.disabled}
+    onClick={() => {
+      setOpen((value) => !value);
+    }}
+  />
+      <Menu
+    isOpen={open()}
+    onClose={close}
+    anchorElement={anchor()}
+    {...local.placement ? { placement: local.placement } : {}}
+  >
+        <For each={local.items}>
+          {(item) => <MenuItem
+    class={cn({ "smwb-overflow-menu__item--danger": item.danger })}
+    disabled={item.disabled}
+    onClick={() => onItemClick(item)}
+  >
+              <Show when={item.icon}>
+                {typeof item.icon === "string" ? <Icon name={item.icon} /> : item.icon}
+              </Show>
+              {item.label}
+            </MenuItem>}
+        </For>
+      </Menu>
+    </span>;
+}
+var overflowMenu_default = OverflowMenu;
+export {
+  OverflowMenu,
+  overflowMenu_default as default
+};
+//# sourceMappingURL=overflowMenu.jsx.map

package/dist/headless/source/components/navigation/overflowMenu/overflowMenu.jsx.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/components/navigation/overflowMenu/overflowMenu.tsx"],"sourcesContent":["import { type JSX, For, Show, createSignal, mergeProps, splitProps } from \"solid-js\";\nimport type { Placement } from \"@floating-ui/dom\";\nimport cn from \"clsx\";\nimport { Button } from \"../../inputs/button\";\nimport { Icon } from \"../../base/icon\";\nimport { Menu, MenuItem } from \"../menu\";\n\nexport interface OverflowMenuItem {\n  id: string;\n  label: string;\n  icon?: JSX.Element | string;\n  danger?: boolean;\n  disabled?: boolean;\n  onSelect?: () => void;\n}\n\nexport interface OverflowMenuProps {\n  items: OverflowMenuItem[];\n  /** Trigger icon name (default `more_vert`). */\n  icon?: string;\n  placement?: Placement;\n  \"aria-label\"?: string;\n  disabled?: boolean;\n  class?: string;\n}\n\n/**\n * A one-shot kebab / overflow menu: a trigger icon button wired to a floating\n * `Menu` over an `items` array, with open/close state baked in. The card 3-dot\n * menu every app hand-builds (button + absolutely-positioned surface + open\n * state) collapses to passing an items list.\n */\nexport function OverflowMenu(props: OverflowMenuProps): JSX.Element {\n  const merged = mergeProps({ icon: \"more_vert\" }, props);\n  const [local] = splitProps(merged, [\"items\", \"icon\", \"placement\", \"aria-label\", \"disabled\", \"class\"]);\n\n  const [anchor, setAnchor] = createSignal<HTMLElement | null>(null);\n  const [open, setOpen] = createSignal(false);\n  const close = (): void => {\n    setOpen(false);\n  };\n\n  const onItemClick = (item: OverflowMenuItem): void => {\n    if (item.disabled) return;\n    item.onSelect?.();\n    close();\n  };\n\n  return (\n    <span class={cn(\"smwb-overflow-menu\", local.class)}>\n      <Button\n        ref={(el) => {\n          setAnchor(el as HTMLElement);\n        }}\n        variant=\"text\"\n        size=\"small\"\n        icon={local.icon}\n        aria-label={local[\"aria-label\"] ?? \"More actions\"}\n        aria-haspopup=\"menu\"\n        disabled={!!local.disabled}\n        onClick={() => {\n          setOpen((value) => !value);\n        }}\n      />\n      <Menu\n        isOpen={open()}\n        onClose={close}\n        anchorElement={anchor()}\n        {...(local.placement ? { placement: local.placement } : {})}\n      >\n        <For each={local.items}>\n          {(item) => (\n            <MenuItem\n              class={cn({ \"smwb-overflow-menu__item--danger\": item.danger })}\n              disabled={item.disabled}\n              onClick={() => onItemClick(item)}\n            >\n              <Show when={item.icon}>\n                {typeof item.icon === \"string\" ? <Icon name={item.icon} /> : (item.icon as JSX.Element)}\n              </Show>\n              {item.label}\n            </MenuItem>\n          )}\n        </For>\n      </Menu>\n    </span>\n  );\n}\n\nexport default OverflowMenu;\n"],"mappings":"AAAA,SAAmB,KAAK,MAAM,cAAc,YAAY,kBAAkB;AAE1E,OAAO,QAAQ;AACf,SAAS,cAAc;AACvB,SAAS,YAAY;AACrB,SAAS,MAAM,gBAAgB;AA2BxB,SAAS,aAAa,OAAuC;AAClE,QAAM,SAAS,WAAW,EAAE,MAAM,YAAY,GAAG,KAAK;AACtD,QAAM,CAAC,KAAK,IAAI,WAAW,QAAQ,CAAC,SAAS,QAAQ,aAAa,cAAc,YAAY,OAAO,CAAC;AAEpG,QAAM,CAAC,QAAQ,SAAS,IAAI,aAAiC,IAAI;AACjE,QAAM,CAAC,MAAM,OAAO,IAAI,aAAa,KAAK;AAC1C,QAAM,QAAQ,MAAY;AACxB,YAAQ,KAAK;AAAA,EACf;AAEA,QAAM,cAAc,CAAC,SAAiC;AACpD,QAAI,KAAK,SAAU;AACnB,SAAK,WAAW;AAChB,UAAM;AAAA,EACR;AAEA,SACE,CAAC,KAAK,OAAO,GAAG,sBAAsB,MAAM,KAAK,GAAG;AAAA,MAClD,CAAC;AAAA,IACC,KAAK,CAAC,OAAO;AACX,gBAAU,EAAiB;AAAA,IAC7B;AAAA,IACA,QAAQ;AAAA,IACR,KAAK;AAAA,IACL,MAAM,MAAM;AAAA,IACZ,YAAY,MAAM,YAAY,KAAK;AAAA,IACnC,cAAc;AAAA,IACd,UAAU,CAAC,CAAC,MAAM;AAAA,IAClB,SAAS,MAAM;AACb,cAAQ,CAAC,UAAU,CAAC,KAAK;AAAA,IAC3B;AAAA,EACF,EAAE;AAAA,MACF,CAAC;AAAA,IACC,QAAQ,KAAK;AAAA,IACb,SAAS;AAAA,IACT,eAAe,OAAO;AAAA,QACjB,MAAM,YAAY,EAAE,WAAW,MAAM,UAAU,IAAI,CAAC;AAAA,GAC1D;AAAA,QACC,CAAC,IAAI,MAAM,MAAM,OAAO;AAAA,WACrB,CAAC,SACA,CAAC;AAAA,IACC,OAAO,GAAG,EAAE,oCAAoC,KAAK,OAAO,CAAC;AAAA,IAC7D,UAAU,KAAK;AAAA,IACf,SAAS,MAAM,YAAY,IAAI;AAAA,GAChC;AAAA,cACC,CAAC,KAAK,MAAM,KAAK,MAAM;AAAA,iBACpB,OAAO,KAAK,SAAS,WAAW,CAAC,KAAK,MAAM,KAAK,MAAM,KAAM,KAAK,KAAqB;AAAA,cAC1F,EAFC,KAEM;AAAA,eACN,KAAK,MAAM;AAAA,YACd,EATC,UAUD;AAAA,QACJ,EAbC,IAaK;AAAA,MACR,EApBC,KAoBM;AAAA,IACT,EApCC;AAsCL;AAEA,IAAO,uBAAQ;","names":[],"file":"overflowMenu.jsx"}

package/dist/headless/source/components/navigation/pagination/pagination.jsx

@@ -139,4 +139,4 @@ export {
   Pagination,
   pagination_default as default
 };
-//# sourceMappingURL=pagination.js.map
+//# sourceMappingURL=pagination.jsx.map

package/dist/headless/source/components/navigation/sidebar/sidebar.jsx

@@ -1,4 +1,4 @@
-import { For, Show, mergeProps, splitProps } from "solid-js";
+import { For, Show, children, mergeProps, splitProps } from "solid-js";
 import { Dynamic } from "solid-js/web";
 import cn from "clsx";
 import { Ripple } from "../../base/ripple";
@@ -8,6 +8,7 @@ import { mergeRefs } from "../../../primitives/mergeRefs";
 function NavItem(props) {
   const [local, rest] = splitProps(props, ["isActive", "icon", "title", "as", "href", "variant"]);
   let rippleActions;
+  const icon = children(() => local.icon);
   const onPointerDown = (event) => {
     rippleActions?.onRipple(event);
   };
@@ -19,8 +20,8 @@ function NavItem(props) {
     onPointerDown={onPointerDown}
     {...rest}
   >
-      <Show when={local.icon}>
-        <span class="smwb-nav-item__icon">{local.icon}</span>
+      <Show when={icon()}>
+        <span class="smwb-nav-item__icon">{icon()}</span>
       </Show>
       <Show when={local.title}>
         <span class="smwb-nav-item__title">{local.title}</span>
@@ -111,4 +112,4 @@ export {
   Sidebar,
   sidebar_default as default
 };
-//# sourceMappingURL=sidebar.js.map
+//# sourceMappingURL=sidebar.jsx.map

package/dist/headless/source/components/navigation/sidebar/sidebar.jsx.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../src/components/navigation/sidebar/sidebar.tsx"],"sourcesContent":["import { type JSX, For, Show, mergeProps, splitProps } from \"solid-js\";\nimport { Dynamic } from \"solid-js/web\";\nimport cn from \"clsx\";\nimport { Ripple, type RippleActionsRef } from \"../../base/ripple\";\nimport { Icon } from \"../../base/icon\";\nimport { createControllableState } from \"../../../primitives/createControllableState\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport type SidebarVariant = \"compact\" | \"default\" | \"compactMini\";\n\nexport interface SidebarMenuItemProps extends Omit<JSX.HTMLAttributes<HTMLDivElement>, \"title\"> {\n  icon?: JSX.Element;\n  title: string;\n  isActive?: boolean;\n  onClick?: JSX.EventHandlerUnion<HTMLDivElement, MouseEvent>;\n  as?: string | undefined;\n  href?: string | undefined;\n  variant?: SidebarVariant | undefined;\n}\n\nexport interface SidebarProps extends JSX.HTMLAttributes<HTMLElement> {\n  variant?: SidebarVariant;\n  menuItems?: SidebarMenuItemProps[];\n  /** Controlled index of the active menu item. */\n  activeItem?: number | null;\n  /** Default active index (uncontrolled). */\n  defaultActiveItem?: number | null;\n  /** Called with the index of the activated item. */\n  onActiveItemChange?: (index: number) => void;\n  /** Render a built-in toggle that collapses the rail to an icon-only mini rail. */\n  collapsible?: boolean;\n  /** Controlled collapsed state. */\n  collapsed?: boolean;\n  /** Initial collapsed state (uncontrolled). */\n  defaultCollapsed?: boolean;\n  /** Called whenever the collapsed state changes. */\n  onCollapsedChange?: (collapsed: boolean) => void;\n  /** Accessible label for the built-in collapse toggle. */\n  collapseToggleAriaLabel?: string;\n  ref?: Ref<HTMLElement>;\n}\n\nfunction NavItem(props: SidebarMenuItemProps): JSX.Element {\n  const [local, rest] = splitProps(props, [\"isActive\", \"icon\", \"title\", \"as\", \"href\", \"variant\"]);\n  let rippleActions: RippleActionsRef | undefined;\n\n  const onPointerDown = (event: PointerEvent): void => {\n    rippleActions?.onRipple(event);\n  };\n\n  return (\n    <Dynamic\n      component={local.as ?? \"div\"}\n      href={local.href}\n      role=\"menuitem\"\n      class={cn(\"sidebar__nav__item\", \"smwb-nav-item\", local.variant, { active: local.isActive })}\n      onPointerDown={onPointerDown}\n      {...rest}\n    >\n      <Show when={local.icon}>\n        <span class=\"smwb-nav-item__icon\">{local.icon}</span>\n      </Show>\n      <Show when={local.title}>\n        <span class=\"smwb-nav-item__title\">{local.title}</span>\n      </Show>\n      <Ripple actionRef={(actions) => (rippleActions = actions)} />\n    </Dynamic>\n  );\n}\n\nexport function Sidebar(props: SidebarProps): JSX.Element {\n  const merged = mergeProps(\n    {\n      variant: \"default\" as SidebarVariant,\n      defaultActiveItem: null as number | null,\n      collapsible: false,\n      defaultCollapsed: false,\n      collapseToggleAriaLabel: \"Toggle navigation\",\n    },\n    props\n  );\n  const [local, rest] = splitProps(merged, [\n    \"class\",\n    \"variant\",\n    \"menuItems\",\n    \"activeItem\",\n    \"defaultActiveItem\",\n    \"onActiveItemChange\",\n    \"collapsible\",\n    \"collapsed\",\n    \"defaultCollapsed\",\n    \"onCollapsedChange\",\n    \"collapseToggleAriaLabel\",\n    \"ref\",\n  ]);\n\n  const [activeItem, setActiveItem] = createControllableState<number | null>({\n    value: () => local.activeItem,\n    defaultValue: local.defaultActiveItem,\n    onChange: (next) => {\n      if (next !== null) local.onActiveItemChange?.(next);\n    },\n  });\n\n  const [collapsed, setCollapsed] = createControllableState<boolean>({\n    value: () => local.collapsed,\n    defaultValue: local.defaultCollapsed,\n    onChange: (next) => local.onCollapsedChange?.(next),\n  });\n\n  // When collapsed the rail always shows the icon-only mini variant.\n  const effectiveVariant = (): SidebarVariant => (local.collapsible && collapsed() ? \"compactMini\" : local.variant);\n\n  return (\n    <aside\n      {...rest}\n      ref={mergeRefs(local.ref)}\n      class={cn(\"smwb-sidebar\", local.class, `smwb-${effectiveVariant()}`, {\n        \"smwb-sidebar_collapsible\": local.collapsible,\n        \"smwb-sidebar_collapsed\": local.collapsible && collapsed(),\n      })}\n      role=\"menubar\"\n    >\n      <Show when={local.collapsible}>\n        <div class=\"smwb-sidebar__collapse\">\n          <button\n            type=\"button\"\n            class=\"smwb-sidebar__collapse-btn\"\n            aria-label={local.collapseToggleAriaLabel}\n            aria-expanded={!collapsed()}\n            onClick={() => setCollapsed(!collapsed())}\n          >\n            <Icon name={collapsed() ? \"chevron_right\" : \"chevron_left\"} size={20} />\n          </button>\n        </div>\n      </Show>\n      <nav class=\"smwb-sidebar__nav\">\n        <For each={local.menuItems ?? []}>\n          {(item, idx) => (\n            <NavItem\n              as={item.as}\n              isActive={activeItem() === idx()}\n              onClick={(event) => {\n                setActiveItem(idx());\n                if (typeof item.onClick === \"function\") item.onClick(event);\n              }}\n              icon={item.icon}\n              title={item.title}\n              href={item.href}\n              variant={effectiveVariant()}\n            />\n          )}\n        </For>\n      </nav>\n    </aside>\n  );\n}\n\nexport default Sidebar;\n"],"mappings":"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","names":[],"file":"sidebar.jsx"}
+{"version":3,"sources":["../../../../../../src/components/navigation/sidebar/sidebar.tsx"],"sourcesContent":["import { type JSX, For, Show, children, mergeProps, splitProps } from \"solid-js\";\nimport { Dynamic } from \"solid-js/web\";\nimport cn from \"clsx\";\nimport { Ripple, type RippleActionsRef } from \"../../base/ripple\";\nimport { Icon } from \"../../base/icon\";\nimport { createControllableState } from \"../../../primitives/createControllableState\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport type SidebarVariant = \"compact\" | \"default\" | \"compactMini\";\n\nexport interface SidebarMenuItemProps extends Omit<JSX.HTMLAttributes<HTMLDivElement>, \"title\"> {\n  icon?: JSX.Element;\n  title: string;\n  isActive?: boolean;\n  onClick?: JSX.EventHandlerUnion<HTMLDivElement, MouseEvent>;\n  as?: string | undefined;\n  href?: string | undefined;\n  variant?: SidebarVariant | undefined;\n}\n\nexport interface SidebarProps extends JSX.HTMLAttributes<HTMLElement> {\n  variant?: SidebarVariant;\n  menuItems?: SidebarMenuItemProps[];\n  /** Controlled index of the active menu item. */\n  activeItem?: number | null;\n  /** Default active index (uncontrolled). */\n  defaultActiveItem?: number | null;\n  /** Called with the index of the activated item. */\n  onActiveItemChange?: (index: number) => void;\n  /** Render a built-in toggle that collapses the rail to an icon-only mini rail. */\n  collapsible?: boolean;\n  /** Controlled collapsed state. */\n  collapsed?: boolean;\n  /** Initial collapsed state (uncontrolled). */\n  defaultCollapsed?: boolean;\n  /** Called whenever the collapsed state changes. */\n  onCollapsedChange?: (collapsed: boolean) => void;\n  /** Accessible label for the built-in collapse toggle. */\n  collapseToggleAriaLabel?: string;\n  ref?: Ref<HTMLElement>;\n}\n\nfunction NavItem(props: SidebarMenuItemProps): JSX.Element {\n  const [local, rest] = splitProps(props, [\"isActive\", \"icon\", \"title\", \"as\", \"href\", \"variant\"]);\n  let rippleActions: RippleActionsRef | undefined;\n\n  // Resolve the icon in THIS item's context. A pre-created element passed via\n  // menuItems is keyed at the consumer's position but rendered here, so under\n  // SSR the hydration walk can't find it; children() realigns the key sequence.\n  const icon = children(() => local.icon);\n\n  const onPointerDown = (event: PointerEvent): void => {\n    rippleActions?.onRipple(event);\n  };\n\n  return (\n    <Dynamic\n      component={local.as ?? \"div\"}\n      href={local.href}\n      role=\"menuitem\"\n      class={cn(\"sidebar__nav__item\", \"smwb-nav-item\", local.variant, { active: local.isActive })}\n      onPointerDown={onPointerDown}\n      {...rest}\n    >\n      <Show when={icon()}>\n        <span class=\"smwb-nav-item__icon\">{icon()}</span>\n      </Show>\n      <Show when={local.title}>\n        <span class=\"smwb-nav-item__title\">{local.title}</span>\n      </Show>\n      <Ripple actionRef={(actions) => (rippleActions = actions)} />\n    </Dynamic>\n  );\n}\n\nexport function Sidebar(props: SidebarProps): JSX.Element {\n  const merged = mergeProps(\n    {\n      variant: \"default\" as SidebarVariant,\n      defaultActiveItem: null as number | null,\n      collapsible: false,\n      defaultCollapsed: false,\n      collapseToggleAriaLabel: \"Toggle navigation\",\n    },\n    props\n  );\n  const [local, rest] = splitProps(merged, [\n    \"class\",\n    \"variant\",\n    \"menuItems\",\n    \"activeItem\",\n    \"defaultActiveItem\",\n    \"onActiveItemChange\",\n    \"collapsible\",\n    \"collapsed\",\n    \"defaultCollapsed\",\n    \"onCollapsedChange\",\n    \"collapseToggleAriaLabel\",\n    \"ref\",\n  ]);\n\n  const [activeItem, setActiveItem] = createControllableState<number | null>({\n    value: () => local.activeItem,\n    defaultValue: local.defaultActiveItem,\n    onChange: (next) => {\n      if (next !== null) local.onActiveItemChange?.(next);\n    },\n  });\n\n  const [collapsed, setCollapsed] = createControllableState<boolean>({\n    value: () => local.collapsed,\n    defaultValue: local.defaultCollapsed,\n    onChange: (next) => local.onCollapsedChange?.(next),\n  });\n\n  // When collapsed the rail always shows the icon-only mini variant.\n  const effectiveVariant = (): SidebarVariant => (local.collapsible && collapsed() ? \"compactMini\" : local.variant);\n\n  return (\n    <aside\n      {...rest}\n      ref={mergeRefs(local.ref)}\n      class={cn(\"smwb-sidebar\", local.class, `smwb-${effectiveVariant()}`, {\n        \"smwb-sidebar_collapsible\": local.collapsible,\n        \"smwb-sidebar_collapsed\": local.collapsible && collapsed(),\n      })}\n      role=\"menubar\"\n    >\n      <Show when={local.collapsible}>\n        <div class=\"smwb-sidebar__collapse\">\n          <button\n            type=\"button\"\n            class=\"smwb-sidebar__collapse-btn\"\n            aria-label={local.collapseToggleAriaLabel}\n            aria-expanded={!collapsed()}\n            onClick={() => setCollapsed(!collapsed())}\n          >\n            <Icon name={collapsed() ? \"chevron_right\" : \"chevron_left\"} size={20} />\n          </button>\n        </div>\n      </Show>\n      <nav class=\"smwb-sidebar__nav\">\n        <For each={local.menuItems ?? []}>\n          {(item, idx) => (\n            <NavItem\n              as={item.as}\n              isActive={activeItem() === idx()}\n              onClick={(event) => {\n                setActiveItem(idx());\n                if (typeof item.onClick === \"function\") item.onClick(event);\n              }}\n              icon={item.icon}\n              title={item.title}\n              href={item.href}\n              variant={effectiveVariant()}\n            />\n          )}\n        </For>\n      </nav>\n    </aside>\n  );\n}\n\nexport default Sidebar;\n"],"mappings":"AAAA,SAAmB,KAAK,MAAM,UAAU,YAAY,kBAAkB;AACtE,SAAS,eAAe;AACxB,OAAO,QAAQ;AACf,SAAS,cAAqC;AAC9C,SAAS,YAAY;AACrB,SAAS,+BAA+B;AACxC,SAAS,iBAA2B;AAoCpC,SAAS,QAAQ,OAA0C;AACzD,QAAM,CAAC,OAAO,IAAI,IAAI,WAAW,OAAO,CAAC,YAAY,QAAQ,SAAS,MAAM,QAAQ,SAAS,CAAC;AAC9F,MAAI;AAKJ,QAAM,OAAO,SAAS,MAAM,MAAM,IAAI;AAEtC,QAAM,gBAAgB,CAAC,UAA8B;AACnD,mBAAe,SAAS,KAAK;AAAA,EAC/B;AAEA,SACE,CAAC;AAAA,IACC,WAAW,MAAM,MAAM;AAAA,IACvB,MAAM,MAAM;AAAA,IACZ,KAAK;AAAA,IACL,OAAO,GAAG,sBAAsB,iBAAiB,MAAM,SAAS,EAAE,QAAQ,MAAM,SAAS,CAAC;AAAA,IAC1F,eAAe;AAAA,QACX;AAAA,GACL;AAAA,MACC,CAAC,KAAK,MAAM,KAAK,GAAG;AAAA,QAClB,CAAC,KAAK,MAAM,uBAAuB,KAAK,EAAE,EAAzC,KAAgD;AAAA,MACnD,EAFC,KAEM;AAAA,MACP,CAAC,KAAK,MAAM,MAAM,OAAO;AAAA,QACvB,CAAC,KAAK,MAAM,wBAAwB,MAAM,MAAM,EAA/C,KAAsD;AAAA,MACzD,EAFC,KAEM;AAAA,MACP,CAAC,OAAO,WAAW,CAAC,YAAa,gBAAgB,SAAU,EAAE;AAAA,IAC/D,EAfC;AAiBL;AAEO,SAAS,QAAQ,OAAkC;AACxD,QAAM,SAAS;AAAA,IACb;AAAA,MACE,SAAS;AAAA,MACT,mBAAmB;AAAA,MACnB,aAAa;AAAA,MACb,kBAAkB;AAAA,MAClB,yBAAyB;AAAA,IAC3B;AAAA,IACA;AAAA,EACF;AACA,QAAM,CAAC,OAAO,IAAI,IAAI,WAAW,QAAQ;AAAA,IACvC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,CAAC,YAAY,aAAa,IAAI,wBAAuC;AAAA,IACzE,OAAO,MAAM,MAAM;AAAA,IACnB,cAAc,MAAM;AAAA,IACpB,UAAU,CAAC,SAAS;AAClB,UAAI,SAAS,KAAM,OAAM,qBAAqB,IAAI;AAAA,IACpD;AAAA,EACF,CAAC;AAED,QAAM,CAAC,WAAW,YAAY,IAAI,wBAAiC;AAAA,IACjE,OAAO,MAAM,MAAM;AAAA,IACnB,cAAc,MAAM;AAAA,IACpB,UAAU,CAAC,SAAS,MAAM,oBAAoB,IAAI;AAAA,EACpD,CAAC;AAGD,QAAM,mBAAmB,MAAuB,MAAM,eAAe,UAAU,IAAI,gBAAgB,MAAM;AAEzG,SACE,CAAC;AAAA,QACK;AAAA,IACJ,KAAK,UAAU,MAAM,GAAG;AAAA,IACxB,OAAO,GAAG,gBAAgB,MAAM,OAAO,QAAQ,iBAAiB,CAAC,IAAI;AAAA,MACnE,4BAA4B,MAAM;AAAA,MAClC,0BAA0B,MAAM,eAAe,UAAU;AAAA,IAC3D,CAAC;AAAA,IACD,KAAK;AAAA,GACN;AAAA,MACC,CAAC,KAAK,MAAM,MAAM,aAAa;AAAA,QAC7B,CAAC,IAAI,MAAM,yBAAyB;AAAA,UAClC,CAAC;AAAA,IACC,KAAK;AAAA,IACL,MAAM;AAAA,IACN,YAAY,MAAM;AAAA,IAClB,eAAe,CAAC,UAAU;AAAA,IAC1B,SAAS,MAAM,aAAa,CAAC,UAAU,CAAC;AAAA,GACzC;AAAA,YACC,CAAC,KAAK,MAAM,UAAU,IAAI,kBAAkB,gBAAgB,MAAM,IAAI,EAAE;AAAA,UAC1E,EARC,OAQQ;AAAA,QACX,EAVC,IAUK;AAAA,MACR,EAZC,KAYM;AAAA,MACP,CAAC,IAAI,MAAM,oBAAoB;AAAA,QAC7B,CAAC,IAAI,MAAM,MAAM,aAAa,CAAC,GAAG;AAAA,WAC/B,CAAC,MAAM,QACN,CAAC;AAAA,IACC,IAAI,KAAK;AAAA,IACT,UAAU,WAAW,MAAM,IAAI;AAAA,IAC/B,SAAS,CAAC,UAAU;AAClB,oBAAc,IAAI,CAAC;AACnB,UAAI,OAAO,KAAK,YAAY,WAAY,MAAK,QAAQ,KAAK;AAAA,IAC5D;AAAA,IACA,MAAM,KAAK;AAAA,IACX,OAAO,KAAK;AAAA,IACZ,MAAM,KAAK;AAAA,IACX,SAAS,iBAAiB;AAAA,EAC5B,GACA;AAAA,QACJ,EAfC,IAeK;AAAA,MACR,EAjBC,IAiBK;AAAA,IACR,EAxCC;AA0CL;AAEA,IAAO,kBAAQ;","names":[],"file":"sidebar.jsx"}

package/dist/headless/source/components/navigation/stepper/stepper.jsx

@@ -79,4 +79,4 @@ export {
   Stepper,
   stepper_default as default
 };
-//# sourceMappingURL=stepper.js.map
+//# sourceMappingURL=stepper.jsx.map

package/dist/headless/source/components/navigation/tabs/tab/tab.jsx

@@ -72,4 +72,4 @@ export {
   Tab,
   tab_default as default
 };
-//# sourceMappingURL=tab.js.map
+//# sourceMappingURL=tab.jsx.map

package/dist/headless/source/components/navigation/tabs/tabs.jsx

@@ -138,4 +138,4 @@ export {
   Tabs,
   tabs_default as default
 };
-//# sourceMappingURL=tabs.js.map
+//# sourceMappingURL=tabs.jsx.map

package/dist/headless/source/index.js

@@ -16,6 +16,10 @@ import { Typography } from "./components/dataDisplay/typography";
 import { Badge } from "./components/dataDisplay/badge";
 import { Card } from "./components/dataDisplay/card";
 import { Chip } from "./components/dataDisplay/chip";
+import { LazyImage } from "./components/dataDisplay/lazyImage";
+import { ChipGroup } from "./components/dataDisplay/chipGroup";
+import { ThumbCard } from "./components/dataDisplay/thumbCard";
+import { AssetGrid } from "./components/dataDisplay/assetGrid";
 import { Avatar, AvatarGroup } from "./components/dataDisplay/avatar";
 import { List, ListItem } from "./components/dataDisplay/list";
 import { Accordion } from "./components/dataDisplay/accordion";
@@ -77,6 +81,7 @@ import { Message, MessageContainer } from "./components/feedBack/message";
 import { ProgressIndicator, CircularProgress } from "./components/feedBack/progressIndicator";
 import { Tooltip } from "./components/feedBack/tooltip";
 import { Modal } from "./components/feedBack/modal";
+import { SaveAssetDialog } from "./components/feedBack/saveAssetDialog";
 import { SnackbarProvider, Snackbar, useSnackbar } from "./components/feedBack/snackbar";
 import { ClickAwayListener } from "./components/clickAwayListener";
 import { Divider } from "./components/layout/divider";
@@ -107,6 +112,7 @@ import {
   useMenuContext,
   buildMenuFloatingMiddleware
 } from "./components/navigation/menu";
+import { OverflowMenu } from "./components/navigation/overflowMenu";
 import { Button } from "./components/inputs/button";
 import { ButtonGroup } from "./components/inputs/buttonGroups";
 import { Checkbox } from "./components/inputs/checkbox";
@@ -114,6 +120,7 @@ import { RadioButton } from "./components/inputs/radioButton";
 import { Toggle } from "./components/inputs/toggle";
 import { Rating } from "./components/inputs/rating";
 import { Slider } from "./components/inputs/slider";
+import { ValueSlider } from "./components/inputs/valueSlider";
 import { FileInput } from "./components/inputs/fileInput";
 import { FileDrop, PreviewWrapper, Preview, CountPreview, isImageFile } from "./components/inputs/fileDrop";
 import { SelectField, DropdownMenu } from "./components/inputs/selectField";
@@ -147,6 +154,7 @@ export {
   AnimateHeight,
   AppBar,
   AppLayout,
+  AssetGrid,
   Avatar,
   AvatarGroup,
   Badge,
@@ -181,6 +189,7 @@ export {
   ChatShell,
   Checkbox,
   Chip,
+  ChipGroup,
   CircularProgress,
   ClickAwayListener,
   Column,
@@ -208,6 +217,7 @@ export {
   ImagesList,
   ImagesListItem,
   ImagesListItemModal,
+  LazyImage,
   List,
   ListItem,
   Menu,
@@ -223,6 +233,7 @@ export {
   MessageContainer,
   Modal,
   OpenView,
+  OverflowMenu,
   Page,
   PageHeader,
   Pagination,
@@ -233,6 +244,7 @@ export {
   Rating,
   Ripple,
   Row,
+  SaveAssetDialog,
   ScreenDivider,
   SelectField,
   Sheet,
@@ -257,6 +269,7 @@ export {
   TextFieldAdornment,
   TextFieldWrapper,
   Theme,
+  ThumbCard,
   TimePicker,
   TimePickerColumns,
   TimePickerInput,
@@ -264,6 +277,7 @@ export {
   Tooltip,
   TreeView,
   Typography,
+  ValueSlider,
   buildFloatingMiddleware,
   buildMenuFloatingMiddleware,
   createChatFileUpload,