@smwb/ui-solid 0.3.0 → 0.4.1

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

@@ -0,0 +1,63 @@
+import "@smwb/ui-styles/less/components/breadcrumbs/breadcrumbs.entry.less";
+import { For, Show, children as resolveChildren, mergeProps, splitProps } from "solid-js";
+import cn from "clsx";
+import { createControllableState } from "../../../primitives/createControllableState";
+import { mergeRefs } from "../../../primitives/mergeRefs";
+function Breadcrumbs(props) {
+  const merged = mergeProps(
+    { separator: "/", maxItems: 8, itemsBeforeCollapse: 1, itemsAfterCollapse: 1, expandLabel: "Show path" },
+    props
+  );
+  const [local, rest] = splitProps(merged, [
+    "class",
+    "separator",
+    "maxItems",
+    "itemsBeforeCollapse",
+    "itemsAfterCollapse",
+    "expanded",
+    "onExpand",
+    "expandLabel",
+    "children",
+    "ref"
+  ]);
+  const [expanded, setExpanded] = createControllableState({
+    value: () => local.expanded,
+    defaultValue: false,
+    onChange: () => local.onExpand?.()
+  });
+  const resolved = resolveChildren(() => local.children);
+  const crumbs = () => resolved.toArray();
+  const collapsed = () => !expanded() && crumbs().length > local.maxItems && local.itemsBeforeCollapse + local.itemsAfterCollapse < crumbs().length;
+  const handleExpand = () => setExpanded(true);
+  const rendered = () => {
+    const all = crumbs();
+    if (!collapsed()) return all;
+    return [
+      ...all.slice(0, local.itemsBeforeCollapse),
+      <button type="button" class="smwb-breadcrumbs__expand" aria-label={local.expandLabel} onClick={handleExpand}>
+          …
+        </button>,
+      ...all.slice(all.length - local.itemsAfterCollapse)
+    ];
+  };
+  return <nav {...rest} ref={mergeRefs(local.ref)} data-testid="breadcrumbs" aria-label="breadcrumb" class={cn("smwb-breadcrumbs", local.class)}>
+      <ol class="smwb-breadcrumbs__list">
+        <For each={rendered()}>
+          {(crumb, index) => <>
+              <li class="smwb-breadcrumbs__item">{crumb}</li>
+              <Show when={index() < rendered().length - 1}>
+                <li class="smwb-breadcrumbs__separator" aria-hidden="true">
+                  {local.separator}
+                </li>
+              </Show>
+            </>}
+        </For>
+      </ol>
+    </nav>;
+}
+var breadcrumbs_default = Breadcrumbs;
+export {
+  Breadcrumbs,
+  breadcrumbs_default as default
+};
+//# sourceMappingURL=breadcrumbs.jsx.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/components/navigation/breadcrumbs/breadcrumbs.tsx"],"sourcesContent":["import \"@smwb/ui-styles/less/components/breadcrumbs/breadcrumbs.entry.less\";\nimport { type JSX, type ParentProps, For, Show, children as resolveChildren, mergeProps, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { createControllableState } from \"../../../primitives/createControllableState\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport interface BreadcrumbsProps extends JSX.HTMLAttributes<HTMLElement> {\n  /** Node placed between every crumb. */\n  separator?: JSX.Element;\n  /** Collapse the middle of the trail when there are more than `maxItems` crumbs. */\n  maxItems?: number;\n  /** How many leading crumbs to keep when collapsed. */\n  itemsBeforeCollapse?: number;\n  /** How many trailing crumbs to keep when collapsed. */\n  itemsAfterCollapse?: number;\n  /** Controlled expanded state. */\n  expanded?: boolean;\n  /** Fired when the user activates the expand control. */\n  onExpand?: () => void;\n  /** Accessible label for the expand button. */\n  expandLabel?: string;\n  ref?: Ref<HTMLElement>;\n}\n\nexport function Breadcrumbs(props: ParentProps<BreadcrumbsProps>): JSX.Element {\n  const merged = mergeProps(\n    { separator: \"/\" as JSX.Element, maxItems: 8, itemsBeforeCollapse: 1, itemsAfterCollapse: 1, expandLabel: \"Show path\" },\n    props\n  );\n  const [local, rest] = splitProps(merged, [\n    \"class\",\n    \"separator\",\n    \"maxItems\",\n    \"itemsBeforeCollapse\",\n    \"itemsAfterCollapse\",\n    \"expanded\",\n    \"onExpand\",\n    \"expandLabel\",\n    \"children\",\n    \"ref\",\n  ]);\n\n  const [expanded, setExpanded] = createControllableState<boolean>({\n    value: () => local.expanded,\n    defaultValue: false,\n    onChange: () => local.onExpand?.(),\n  });\n\n  const resolved = resolveChildren(() => local.children);\n  const crumbs = (): unknown[] => resolved.toArray();\n\n  const collapsed = (): boolean =>\n    !expanded() &&\n    crumbs().length > local.maxItems &&\n    local.itemsBeforeCollapse + local.itemsAfterCollapse < crumbs().length;\n\n  const handleExpand = (): void => setExpanded(true);\n\n  const rendered = (): unknown[] => {\n    const all = crumbs();\n    if (!collapsed()) return all;\n    return [\n      ...all.slice(0, local.itemsBeforeCollapse),\n      (\n        <button type=\"button\" class=\"smwb-breadcrumbs__expand\" aria-label={local.expandLabel} onClick={handleExpand}>\n          …\n        </button>\n      ),\n      ...all.slice(all.length - local.itemsAfterCollapse),\n    ];\n  };\n\n  return (\n    <nav {...rest} ref={mergeRefs(local.ref)} data-testid=\"breadcrumbs\" aria-label=\"breadcrumb\" class={cn(\"smwb-breadcrumbs\", local.class)}>\n      <ol class=\"smwb-breadcrumbs__list\">\n        <For each={rendered()}>\n          {(crumb, index) => (\n            <>\n              <li class=\"smwb-breadcrumbs__item\">{crumb as JSX.Element}</li>\n              <Show when={index() < rendered().length - 1}>\n                <li class=\"smwb-breadcrumbs__separator\" aria-hidden=\"true\">\n                  {local.separator}\n                </li>\n              </Show>\n            </>\n          )}\n        </For>\n      </ol>\n    </nav>\n  );\n}\n\nexport default Breadcrumbs;\n"],"mappings":"AAAA,OAAO;AACP,SAAqC,KAAK,MAAM,YAAY,iBAAiB,YAAY,kBAAkB;AAC3G,OAAO,QAAQ;AACf,SAAS,+BAA+B;AACxC,SAAS,iBAA2B;AAoB7B,SAAS,YAAY,OAAmD;AAC7E,QAAM,SAAS;AAAA,IACb,EAAE,WAAW,KAAoB,UAAU,GAAG,qBAAqB,GAAG,oBAAoB,GAAG,aAAa,YAAY;AAAA,IACtH;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,EACF,CAAC;AAED,QAAM,CAAC,UAAU,WAAW,IAAI,wBAAiC;AAAA,IAC/D,OAAO,MAAM,MAAM;AAAA,IACnB,cAAc;AAAA,IACd,UAAU,MAAM,MAAM,WAAW;AAAA,EACnC,CAAC;AAED,QAAM,WAAW,gBAAgB,MAAM,MAAM,QAAQ;AACrD,QAAM,SAAS,MAAiB,SAAS,QAAQ;AAEjD,QAAM,YAAY,MAChB,CAAC,SAAS,KACV,OAAO,EAAE,SAAS,MAAM,YACxB,MAAM,sBAAsB,MAAM,qBAAqB,OAAO,EAAE;AAElE,QAAM,eAAe,MAAY,YAAY,IAAI;AAEjD,QAAM,WAAW,MAAiB;AAChC,UAAM,MAAM,OAAO;AACnB,QAAI,CAAC,UAAU,EAAG,QAAO;AACzB,WAAO;AAAA,MACL,GAAG,IAAI,MAAM,GAAG,MAAM,mBAAmB;AAAA,MAEvC,CAAC,OAAO,KAAK,SAAS,MAAM,2BAA2B,YAAY,MAAM,aAAa,SAAS,cAAc;AAAA;AAAA,QAE7G,EAFC;AAAA,MAIH,GAAG,IAAI,MAAM,IAAI,SAAS,MAAM,kBAAkB;AAAA,IACpD;AAAA,EACF;AAEA,SACE,CAAC,QAAQ,MAAM,KAAK,UAAU,MAAM,GAAG,GAAG,YAAY,cAAc,WAAW,aAAa,OAAO,GAAG,oBAAoB,MAAM,KAAK,GAAG;AAAA,MACtI,CAAC,GAAG,MAAM,yBAAyB;AAAA,QACjC,CAAC,IAAI,MAAM,SAAS,GAAG;AAAA,WACpB,CAAC,OAAO,UACP,EAAE;AAAA,cACA,CAAC,GAAG,MAAM,0BAA0B,MAAqB,EAAxD,GAA6D;AAAA,cAC9D,CAAC,KAAK,MAAM,MAAM,IAAI,SAAS,EAAE,SAAS,GAAG;AAAA,gBAC3C,CAAC,GAAG,MAAM,8BAA8B,YAAY,OAAO;AAAA,mBACxD,MAAM,UAAU;AAAA,gBACnB,EAFC,GAEI;AAAA,cACP,EAJC,KAIM;AAAA,YACT,IACA;AAAA,QACJ,EAXC,IAWK;AAAA,MACR,EAbC,GAaI;AAAA,IACP,EAfC;AAiBL;AAEA,IAAO,sBAAQ;","names":[],"file":"breadcrumbs.jsx"}

package/dist/source/components/navigation/breadcrumbs/index.js

@@ -0,0 +1,6 @@
+import { Breadcrumbs, default as default2 } from "./breadcrumbs";
+export {
+  Breadcrumbs,
+  default2 as default
+};
+//# sourceMappingURL=index.js.map

package/dist/source/components/navigation/breadcrumbs/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/components/navigation/breadcrumbs/index.ts"],
+  "sourcesContent": ["export { Breadcrumbs, default } from \"./breadcrumbs\";\nexport type { BreadcrumbsProps } from \"./breadcrumbs\";\n"],
+  "mappings": "AAAA,SAAS,aAAa,WAAAA,gBAAe;",
+  "names": ["default"]
+}

package/dist/source/components/navigation/menu/index.js

@@ -0,0 +1,23 @@
+import { Menu } from "./menu";
+import { MenuFloating, buildMenuFloatingMiddleware } from "./menuFloating";
+import { MenuList } from "./menuList";
+import { MenuItem } from "./menuItem";
+import { MenuItemIcon } from "./menuItemIcon";
+import { MenuItemText } from "./menuItemText";
+import { MenuDivider } from "./menuDivider";
+import { MenuSubmenu } from "./menuSubmenu";
+import { MenuContext, useMenuContext } from "./menuContext";
+export {
+  Menu,
+  MenuContext,
+  MenuDivider,
+  MenuFloating,
+  MenuItem,
+  MenuItemIcon,
+  MenuItemText,
+  MenuList,
+  MenuSubmenu,
+  buildMenuFloatingMiddleware,
+  useMenuContext
+};
+//# sourceMappingURL=index.js.map

package/dist/source/components/navigation/menu/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/components/navigation/menu/index.ts"],
+  "sourcesContent": ["export { Menu } from \"./menu\";\nexport type { MenuProps } from \"./menu\";\nexport { MenuFloating, buildMenuFloatingMiddleware } from \"./menuFloating\";\nexport type { MenuFloatingProps } from \"./menuFloating\";\nexport { MenuList } from \"./menuList\";\nexport type { MenuListProps } from \"./menuList\";\nexport { MenuItem } from \"./menuItem\";\nexport type { MenuItemProps } from \"./menuItem\";\nexport { MenuItemIcon } from \"./menuItemIcon\";\nexport type { MenuItemIconProps } from \"./menuItemIcon\";\nexport { MenuItemText } from \"./menuItemText\";\nexport type { MenuItemTextProps } from \"./menuItemText\";\nexport { MenuDivider } from \"./menuDivider\";\nexport type { MenuDividerProps } from \"./menuDivider\";\nexport { MenuSubmenu } from \"./menuSubmenu\";\nexport type { MenuSubmenuProps } from \"./menuSubmenu\";\nexport { MenuContext, useMenuContext } from \"./menuContext\";\nexport type { MenuContextValue } from \"./menuContext\";\n"],
+  "mappings": "AAAA,SAAS,YAAY;AAErB,SAAS,cAAc,mCAAmC;AAE1D,SAAS,gBAAgB;AAEzB,SAAS,gBAAgB;AAEzB,SAAS,oBAAoB;AAE7B,SAAS,oBAAoB;AAE7B,SAAS,mBAAmB;AAE5B,SAAS,mBAAmB;AAE5B,SAAS,aAAa,sBAAsB;",
+  "names": []
+}

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

@@ -0,0 +1,28 @@
+import "@smwb/ui-styles/less/components/menu/menu.entry.less";
+import { mergeProps, splitProps } from "solid-js";
+import { MenuContext } from "./menuContext";
+import { MenuComponent } from "./menuComponent";
+function Menu(props) {
+  const merged = mergeProps({ dense: false, variant: "floating" }, props);
+  const [local, rest] = splitProps(merged, ["dense", "variant", "children", "ref"]);
+  const value = {
+    get dense() {
+      return local.dense;
+    },
+    get variant() {
+      return local.variant;
+    },
+    onClose: () => rest.onClose?.()
+  };
+  return <MenuContext.Provider value={value}>
+      <MenuComponent ref={local.ref} {...rest}>
+        {local.children}
+      </MenuComponent>
+    </MenuContext.Provider>;
+}
+var menu_default = Menu;
+export {
+  Menu,
+  menu_default as default
+};
+//# sourceMappingURL=menu.jsx.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/components/navigation/menu/menu.tsx"],"sourcesContent":["import \"@smwb/ui-styles/less/components/menu/menu.entry.less\";\nimport { type JSX, type ParentProps, mergeProps, splitProps } from \"solid-js\";\nimport { MenuContext } from \"./menuContext\";\nimport { MenuComponent } from \"./menuComponent\";\nimport type { MenuFloatingProps } from \"./menuFloating\";\n\nexport type MenuProps = MenuFloatingProps & {\n  variant?: \"static\" | \"floating\";\n  dense?: boolean;\n};\n\nexport function Menu(props: ParentProps<MenuProps>): JSX.Element {\n  const merged = mergeProps({ dense: false, variant: \"floating\" as const }, props);\n  const [local, rest] = splitProps(merged, [\"dense\", \"variant\", \"children\", \"ref\"]);\n\n  const value = {\n    get dense() {\n      return local.dense;\n    },\n    get variant() {\n      return local.variant;\n    },\n    onClose: () => rest.onClose?.(),\n  };\n\n  return (\n    <MenuContext.Provider value={value}>\n      <MenuComponent ref={local.ref} {...rest}>\n        {local.children}\n      </MenuComponent>\n    </MenuContext.Provider>\n  );\n}\n\nexport default Menu;\n"],"mappings":"AAAA,OAAO;AACP,SAAqC,YAAY,kBAAkB;AACnE,SAAS,mBAAmB;AAC5B,SAAS,qBAAqB;AAQvB,SAAS,KAAK,OAA4C;AAC/D,QAAM,SAAS,WAAW,EAAE,OAAO,OAAO,SAAS,WAAoB,GAAG,KAAK;AAC/E,QAAM,CAAC,OAAO,IAAI,IAAI,WAAW,QAAQ,CAAC,SAAS,WAAW,YAAY,KAAK,CAAC;AAEhF,QAAM,QAAQ;AAAA,IACZ,IAAI,QAAQ;AACV,aAAO,MAAM;AAAA,IACf;AAAA,IACA,IAAI,UAAU;AACZ,aAAO,MAAM;AAAA,IACf;AAAA,IACA,SAAS,MAAM,KAAK,UAAU;AAAA,EAChC;AAEA,SACE,CAAC,YAAY,SAAS,OAAO,OAAO;AAAA,MAClC,CAAC,cAAc,KAAK,MAAM,SAAS,MAAM;AAAA,SACtC,MAAM,SAAS;AAAA,MAClB,EAFC,cAEe;AAAA,IAClB,EAJC,YAAY;AAMjB;AAEA,IAAO,eAAQ;","names":[],"file":"menu.jsx"}

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

@@ -0,0 +1,18 @@
+import { Show } from "solid-js";
+import { useMenuContext } from "./menuContext";
+import { MenuList } from "./menuList";
+import { MenuFloating } from "./menuFloating";
+function MenuComponent(props) {
+  const ctx = useMenuContext();
+  return <Show when={ctx.variant === "static"} fallback={<MenuFloating {...props} />}>
+      <MenuList ref={props.ref} class={props.class}>
+        {props.children}
+      </MenuList>
+    </Show>;
+}
+var menuComponent_default = MenuComponent;
+export {
+  MenuComponent,
+  menuComponent_default as default
+};
+//# sourceMappingURL=menuComponent.jsx.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/components/navigation/menu/menuComponent.tsx"],"sourcesContent":["import { type JSX, type ParentProps, Show } from \"solid-js\";\nimport { useMenuContext } from \"./menuContext\";\nimport { MenuList } from \"./menuList\";\nimport { MenuFloating, type MenuFloatingProps } from \"./menuFloating\";\n\nexport function MenuComponent(props: ParentProps<MenuFloatingProps>): JSX.Element {\n  const ctx = useMenuContext();\n  return (\n    <Show when={ctx.variant === \"static\"} fallback={<MenuFloating {...props} />}>\n      <MenuList ref={props.ref} class={props.class}>\n        {props.children}\n      </MenuList>\n    </Show>\n  );\n}\n\nexport default MenuComponent;\n"],"mappings":"AAAA,SAAqC,YAAY;AACjD,SAAS,sBAAsB;AAC/B,SAAS,gBAAgB;AACzB,SAAS,oBAA4C;AAE9C,SAAS,cAAc,OAAoD;AAChF,QAAM,MAAM,eAAe;AAC3B,SACE,CAAC,KAAK,MAAM,IAAI,YAAY,UAAU,UAAU,CAAC,iBAAiB,OAAO,IAAI;AAAA,MAC3E,CAAC,SAAS,KAAK,MAAM,KAAK,OAAO,MAAM,OAAO;AAAA,SAC3C,MAAM,SAAS;AAAA,MAClB,EAFC,SAEU;AAAA,IACb,EAJC;AAML;AAEA,IAAO,wBAAQ;","names":[],"file":"menuComponent.jsx"}

package/dist/source/components/navigation/menu/menuContext.js

@@ -0,0 +1,14 @@
+import { createContext, useContext } from "solid-js";
+const MenuContext = createContext({
+  dense: false,
+  variant: "floating",
+  onClose: () => void 0
+});
+function useMenuContext() {
+  return useContext(MenuContext);
+}
+export {
+  MenuContext,
+  useMenuContext
+};
+//# sourceMappingURL=menuContext.js.map

package/dist/source/components/navigation/menu/menuContext.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/components/navigation/menu/menuContext.ts"],
+  "sourcesContent": ["import { createContext, useContext } from \"solid-js\";\n\nexport interface MenuContextValue {\n  dense: boolean;\n  variant: \"static\" | \"floating\";\n  onClose: () => void;\n}\n\nexport const MenuContext = createContext<MenuContextValue>({\n  dense: false,\n  variant: \"floating\",\n  onClose: () => undefined,\n});\n\nexport function useMenuContext(): MenuContextValue {\n  return useContext(MenuContext);\n}\n"],
+  "mappings": "AAAA,SAAS,eAAe,kBAAkB;AAQnC,MAAM,cAAc,cAAgC;AAAA,EACzD,OAAO;AAAA,EACP,SAAS;AAAA,EACT,SAAS,MAAM;AACjB,CAAC;AAEM,SAAS,iBAAmC;AACjD,SAAO,WAAW,WAAW;AAC/B;",
+  "names": []
+}

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

@@ -0,0 +1,19 @@
+import { splitProps } from "solid-js";
+import cn from "clsx";
+import { useMenuContext } from "./menuContext";
+import { mergeRefs } from "../../../primitives/mergeRefs";
+function MenuDivider(props) {
+  const ctx = useMenuContext();
+  const [local, rest] = splitProps(props, ["class", "ref"]);
+  return <li
+    {...rest}
+    ref={mergeRefs(local.ref)}
+    class={cn("smwb-menu__divider", local.class, ctx.variant === "static" && "smwb-menu__divider--vertical")}
+  />;
+}
+var menuDivider_default = MenuDivider;
+export {
+  MenuDivider,
+  menuDivider_default as default
+};
+//# sourceMappingURL=menuDivider.jsx.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/components/navigation/menu/menuDivider.tsx"],"sourcesContent":["import { type JSX, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { useMenuContext } from \"./menuContext\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport interface MenuDividerProps extends JSX.HTMLAttributes<HTMLLIElement> {\n  ref?: Ref<HTMLLIElement>;\n}\n\nexport function MenuDivider(props: MenuDividerProps): JSX.Element {\n  const ctx = useMenuContext();\n  const [local, rest] = splitProps(props, [\"class\", \"ref\"]);\n  return (\n    <li\n      {...rest}\n      ref={mergeRefs(local.ref)}\n      class={cn(\"smwb-menu__divider\", local.class, ctx.variant === \"static\" && \"smwb-menu__divider--vertical\")}\n    />\n  );\n}\n\nexport default MenuDivider;\n"],"mappings":"AAAA,SAAmB,kBAAkB;AACrC,OAAO,QAAQ;AACf,SAAS,sBAAsB;AAC/B,SAAS,iBAA2B;AAM7B,SAAS,YAAY,OAAsC;AAChE,QAAM,MAAM,eAAe;AAC3B,QAAM,CAAC,OAAO,IAAI,IAAI,WAAW,OAAO,CAAC,SAAS,KAAK,CAAC;AACxD,SACE,CAAC;AAAA,QACK;AAAA,IACJ,KAAK,UAAU,MAAM,GAAG;AAAA,IACxB,OAAO,GAAG,sBAAsB,MAAM,OAAO,IAAI,YAAY,YAAY,8BAA8B;AAAA,EACzG;AAEJ;AAEA,IAAO,sBAAQ;","names":[],"file":"menuDivider.jsx"}

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

@@ -0,0 +1,84 @@
+import { Show, createEffect, createSignal, mergeProps, onCleanup, splitProps } from "solid-js";
+import { buildFloatingMiddleware, resolvePlacement } from "../../../utils/floating";
+import { createFloating } from "../../../primitives/createFloating";
+import { ClickAwayListener } from "../../clickAwayListener";
+import { MenuList } from "./menuList";
+import { mergeRefs } from "../../../primitives/mergeRefs";
+function buildMenuFloatingMiddleware(resolved, custom) {
+  return buildFloatingMiddleware(resolved, custom);
+}
+const FADE_MS = 150;
+function MenuFloating(props) {
+  const merged = mergeProps({ placement: "bottom-start" }, props);
+  const [local, rest] = splitProps(merged, [
+    "anchorElement",
+    "isOpen",
+    "onClose",
+    "placement",
+    "middleware",
+    "style",
+    "children",
+    "ref"
+  ]);
+  let menuEl;
+  const resolved = () => resolvePlacement(local.placement);
+  const floating = createFloating({
+    placement: () => resolved().placement,
+    middleware: () => buildMenuFloatingMiddleware(resolved(), local.middleware)
+  });
+  createEffect(() => {
+    floating.setReference(local.anchorElement ?? null);
+  });
+  const [mounted, setMounted] = createSignal(Boolean(local.isOpen));
+  const [shown, setShown] = createSignal(false);
+  let raf;
+  let timer;
+  createEffect(() => {
+    const open = Boolean(local.isOpen);
+    if (open) {
+      if (timer !== void 0) {
+        clearTimeout(timer);
+        timer = void 0;
+      }
+      setMounted(true);
+      raf = requestAnimationFrame(() => setShown(true));
+    } else {
+      setShown(false);
+      if (mounted()) {
+        timer = setTimeout(() => setMounted(false), FADE_MS);
+      }
+    }
+  });
+  onCleanup(() => {
+    if (raf !== void 0) cancelAnimationFrame(raf);
+    if (timer !== void 0) clearTimeout(timer);
+  });
+  const onAwayClick = (event) => {
+    if (!local.isOpen || !local.onClose || !menuEl) return;
+    const target = event.target;
+    if (menuEl.contains(target) || local.anchorElement?.contains(target)) {
+      return;
+    }
+    local.onClose();
+  };
+  const style = () => ({
+    ...floating.floatingStyles(),
+    ...typeof local.style === "object" && local.style ? local.style : {},
+    transition: `opacity ${FADE_MS}ms ease-in-out`,
+    opacity: shown() ? 1 : 0
+  });
+  return <Show when={mounted()}>
+      <ClickAwayListener onClickAway={onAwayClick}>
+        <MenuList {...rest} ref={mergeRefs(local.ref, floating.setFloating, (el) => menuEl = el)} style={style()}>
+          {local.children}
+        </MenuList>
+      </ClickAwayListener>
+    </Show>;
+}
+var menuFloating_default = MenuFloating;
+export {
+  MenuFloating,
+  buildMenuFloatingMiddleware,
+  menuFloating_default as default
+};
+//# sourceMappingURL=menuFloating.jsx.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/components/navigation/menu/menuFloating.tsx"],"sourcesContent":["import { type JSX, type ParentProps, Show, createEffect, createSignal, mergeProps, onCleanup, splitProps } from \"solid-js\";\nimport type { Middleware } from \"@floating-ui/dom\";\nimport { buildFloatingMiddleware, type Placement, resolvePlacement, type ResolvedPlacement } from \"../../../utils/floating\";\nimport { createFloating } from \"../../../primitives/createFloating\";\nimport { ClickAwayListener } from \"../../clickAwayListener\";\nimport { MenuList } from \"./menuList\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport function buildMenuFloatingMiddleware(resolved: ResolvedPlacement, custom?: Middleware[]): Middleware[] {\n  return buildFloatingMiddleware(resolved, custom);\n}\n\nexport interface MenuFloatingProps extends JSX.HTMLAttributes<HTMLDivElement> {\n  anchorElement?: Element | null | undefined;\n  isOpen?: boolean;\n  onClose?: () => void;\n  placement?: Placement;\n  middleware?: Middleware[] | undefined;\n  ref?: Ref<HTMLDivElement>;\n}\n\nconst FADE_MS = 150;\n\nexport function MenuFloating(props: ParentProps<MenuFloatingProps>): JSX.Element {\n  const merged = mergeProps({ placement: \"bottom-start\" as Placement }, props);\n  const [local, rest] = splitProps(merged, [\n    \"anchorElement\",\n    \"isOpen\",\n    \"onClose\",\n    \"placement\",\n    \"middleware\",\n    \"style\",\n    \"children\",\n    \"ref\",\n  ]);\n\n  let menuEl: HTMLElement | undefined;\n  const resolved = (): ResolvedPlacement => resolvePlacement(local.placement);\n  const floating = createFloating({\n    placement: () => resolved().placement,\n    middleware: () => buildMenuFloatingMiddleware(resolved(), local.middleware),\n  });\n\n  createEffect(() => {\n    floating.setReference(local.anchorElement ?? null);\n  });\n\n  // mountOnEnter + unmountOnExit fade lifecycle (replaces RTG Transition).\n  const [mounted, setMounted] = createSignal(Boolean(local.isOpen));\n  const [shown, setShown] = createSignal(false);\n  let raf: number | undefined;\n  let timer: ReturnType<typeof setTimeout> | undefined;\n\n  createEffect(() => {\n    const open = Boolean(local.isOpen);\n    if (open) {\n      if (timer !== undefined) {\n        clearTimeout(timer);\n        timer = undefined;\n      }\n      setMounted(true);\n      raf = requestAnimationFrame(() => setShown(true));\n    } else {\n      setShown(false);\n      if (mounted()) {\n        timer = setTimeout(() => setMounted(false), FADE_MS);\n      }\n    }\n  });\n  onCleanup(() => {\n    if (raf !== undefined) cancelAnimationFrame(raf);\n    if (timer !== undefined) clearTimeout(timer);\n  });\n\n  const onAwayClick = (event: MouseEvent | TouchEvent): void => {\n    if (!local.isOpen || !local.onClose || !menuEl) return;\n    const target = event.target as HTMLElement;\n    if (menuEl.contains(target) || (local.anchorElement as HTMLElement | null)?.contains(target)) {\n      return;\n    }\n    local.onClose();\n  };\n\n  const style = (): JSX.CSSProperties => ({\n    ...floating.floatingStyles(),\n    ...(typeof local.style === \"object\" && local.style ? local.style : {}),\n    transition: `opacity ${FADE_MS}ms ease-in-out`,\n    opacity: shown() ? 1 : 0,\n  });\n\n  return (\n    <Show when={mounted()}>\n      <ClickAwayListener onClickAway={onAwayClick}>\n        <MenuList {...rest} ref={mergeRefs(local.ref, floating.setFloating, (el) => (menuEl = el))} style={style()}>\n          {local.children}\n        </MenuList>\n      </ClickAwayListener>\n    </Show>\n  );\n}\n\nexport default MenuFloating;\n"],"mappings":"AAAA,SAAqC,MAAM,cAAc,cAAc,YAAY,WAAW,kBAAkB;AAEhH,SAAS,yBAAyC,wBAAgD;AAClG,SAAS,sBAAsB;AAC/B,SAAS,yBAAyB;AAClC,SAAS,gBAAgB;AACzB,SAAS,iBAA2B;AAE7B,SAAS,4BAA4B,UAA6B,QAAqC;AAC5G,SAAO,wBAAwB,UAAU,MAAM;AACjD;AAWA,MAAM,UAAU;AAET,SAAS,aAAa,OAAoD;AAC/E,QAAM,SAAS,WAAW,EAAE,WAAW,eAA4B,GAAG,KAAK;AAC3E,QAAM,CAAC,OAAO,IAAI,IAAI,WAAW,QAAQ;AAAA,IACvC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,MAAI;AACJ,QAAM,WAAW,MAAyB,iBAAiB,MAAM,SAAS;AAC1E,QAAM,WAAW,eAAe;AAAA,IAC9B,WAAW,MAAM,SAAS,EAAE;AAAA,IAC5B,YAAY,MAAM,4BAA4B,SAAS,GAAG,MAAM,UAAU;AAAA,EAC5E,CAAC;AAED,eAAa,MAAM;AACjB,aAAS,aAAa,MAAM,iBAAiB,IAAI;AAAA,EACnD,CAAC;AAGD,QAAM,CAAC,SAAS,UAAU,IAAI,aAAa,QAAQ,MAAM,MAAM,CAAC;AAChE,QAAM,CAAC,OAAO,QAAQ,IAAI,aAAa,KAAK;AAC5C,MAAI;AACJ,MAAI;AAEJ,eAAa,MAAM;AACjB,UAAM,OAAO,QAAQ,MAAM,MAAM;AACjC,QAAI,MAAM;AACR,UAAI,UAAU,QAAW;AACvB,qBAAa,KAAK;AAClB,gBAAQ;AAAA,MACV;AACA,iBAAW,IAAI;AACf,YAAM,sBAAsB,MAAM,SAAS,IAAI,CAAC;AAAA,IAClD,OAAO;AACL,eAAS,KAAK;AACd,UAAI,QAAQ,GAAG;AACb,gBAAQ,WAAW,MAAM,WAAW,KAAK,GAAG,OAAO;AAAA,MACrD;AAAA,IACF;AAAA,EACF,CAAC;AACD,YAAU,MAAM;AACd,QAAI,QAAQ,OAAW,sBAAqB,GAAG;AAC/C,QAAI,UAAU,OAAW,cAAa,KAAK;AAAA,EAC7C,CAAC;AAED,QAAM,cAAc,CAAC,UAAyC;AAC5D,QAAI,CAAC,MAAM,UAAU,CAAC,MAAM,WAAW,CAAC,OAAQ;AAChD,UAAM,SAAS,MAAM;AACrB,QAAI,OAAO,SAAS,MAAM,KAAM,MAAM,eAAsC,SAAS,MAAM,GAAG;AAC5F;AAAA,IACF;AACA,UAAM,QAAQ;AAAA,EAChB;AAEA,QAAM,QAAQ,OAA0B;AAAA,IACtC,GAAG,SAAS,eAAe;AAAA,IAC3B,GAAI,OAAO,MAAM,UAAU,YAAY,MAAM,QAAQ,MAAM,QAAQ,CAAC;AAAA,IACpE,YAAY,WAAW,OAAO;AAAA,IAC9B,SAAS,MAAM,IAAI,IAAI;AAAA,EACzB;AAEA,SACE,CAAC,KAAK,MAAM,QAAQ,GAAG;AAAA,MACrB,CAAC,kBAAkB,aAAa,aAAa;AAAA,QAC3C,CAAC,aAAa,MAAM,KAAK,UAAU,MAAM,KAAK,SAAS,aAAa,CAAC,OAAQ,SAAS,EAAG,GAAG,OAAO,MAAM,GAAG;AAAA,WACzG,MAAM,SAAS;AAAA,QAClB,EAFC,SAEU;AAAA,MACb,EAJC,kBAImB;AAAA,IACtB,EANC;AAQL;AAEA,IAAO,uBAAQ;","names":[],"file":"menuFloating.jsx"}

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

@@ -0,0 +1,68 @@
+import { Show, splitProps } from "solid-js";
+import { Dynamic } from "solid-js/web";
+import cn from "clsx";
+import { useMenuContext } from "./menuContext";
+import { Ripple } from "../../base/ripple";
+import { mergeRefs } from "../../../primitives/mergeRefs";
+import { callHandler } from "../../../primitives/callHandler";
+function MenuItem(props) {
+  const ctx = useMenuContext();
+  const [local, rest] = splitProps(props, [
+    "children",
+    "class",
+    "disabled",
+    "selected",
+    "onClick",
+    "href",
+    "linkElement",
+    "linkProps",
+    "value",
+    "optionRenderer",
+    "ref"
+  ]);
+  let rippleActions;
+  const onClick = (event) => {
+    if (local.disabled) {
+      if (local.href) event.preventDefault();
+      return;
+    }
+    callHandler(local.onClick, event);
+  };
+  const onPointerDown = (event) => {
+    if (!local.disabled) rippleActions?.onRipple(event);
+  };
+  const classes = () => cn("smwb-menu__item", local.class, {
+    "smwb-menu__item--dense": ctx.dense,
+    "smwb-menu__item--disabled": local.disabled,
+    "smwb-menu__item--selected": local.selected
+  });
+  return <Show when={!local.optionRenderer} fallback={local.optionRenderer?.(props)}>
+      <li
+    {...rest}
+    role="menuitem"
+    ref={mergeRefs(local.ref)}
+    class={classes()}
+    tabindex={local.disabled ? void 0 : 0}
+    onClick={onClick}
+    data-value={local.value}
+    onPointerDown={onPointerDown}
+  >
+        <Show
+    when={local.href}
+    fallback={<span class="smwb-menu__item-inner">{local.children}</span>}
+  >
+          <Dynamic component={local.linkElement ?? "a"} class="smwb-menu__item-inner" href={local.href} {...local.linkProps ?? {}}>
+            {local.children}
+            <span class="smwb-menu__item__helper-text" />
+          </Dynamic>
+        </Show>
+        <Ripple actionRef={(actions) => rippleActions = actions} />
+      </li>
+    </Show>;
+}
+var menuItem_default = MenuItem;
+export {
+  MenuItem,
+  menuItem_default as default
+};
+//# sourceMappingURL=menuItem.jsx.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/components/navigation/menu/menuItem.tsx"],"sourcesContent":["import { type JSX, type ParentProps, Show, splitProps } from \"solid-js\";\nimport { Dynamic } from \"solid-js/web\";\nimport cn from \"clsx\";\nimport { useMenuContext } from \"./menuContext\";\nimport { Ripple, type RippleActionsRef } from \"../../base/ripple\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\nimport { callHandler } from \"../../../primitives/callHandler\";\n\nexport interface MenuItemProps extends JSX.HTMLAttributes<HTMLLIElement> {\n  disabled?: boolean | undefined;\n  selected?: boolean | undefined;\n  href?: string | undefined;\n  linkElement?: string;\n  linkProps?: JSX.AnchorHTMLAttributes<HTMLAnchorElement>;\n  value?: unknown;\n  optionRenderer?: ((args: MenuItemProps) => JSX.Element) | undefined;\n  onClick?: JSX.EventHandlerUnion<HTMLLIElement, MouseEvent>;\n  ref?: Ref<HTMLLIElement>;\n}\n\nexport function MenuItem(props: ParentProps<MenuItemProps>): JSX.Element {\n  const ctx = useMenuContext();\n  const [local, rest] = splitProps(props, [\n    \"children\",\n    \"class\",\n    \"disabled\",\n    \"selected\",\n    \"onClick\",\n    \"href\",\n    \"linkElement\",\n    \"linkProps\",\n    \"value\",\n    \"optionRenderer\",\n    \"ref\",\n  ]);\n\n  let rippleActions: RippleActionsRef | undefined;\n\n  const onClick: JSX.EventHandler<HTMLLIElement, MouseEvent> = (event) => {\n    if (local.disabled) {\n      if (local.href) event.preventDefault();\n      return;\n    }\n    callHandler(local.onClick, event);\n  };\n\n  const onPointerDown = (event: PointerEvent): void => {\n    if (!local.disabled) rippleActions?.onRipple(event);\n  };\n\n  const classes = (): string =>\n    cn(\"smwb-menu__item\", local.class, {\n      \"smwb-menu__item--dense\": ctx.dense,\n      \"smwb-menu__item--disabled\": local.disabled,\n      \"smwb-menu__item--selected\": local.selected,\n    });\n\n  return (\n    <Show when={!local.optionRenderer} fallback={local.optionRenderer?.(props)}>\n      <li\n        {...rest}\n        role=\"menuitem\"\n        ref={mergeRefs(local.ref)}\n        class={classes()}\n        tabindex={local.disabled ? undefined : 0}\n        onClick={onClick}\n        data-value={local.value as string | number | undefined}\n        onPointerDown={onPointerDown}\n      >\n        <Show\n          when={local.href}\n          fallback={<span class=\"smwb-menu__item-inner\">{local.children}</span>}\n        >\n          <Dynamic component={local.linkElement ?? \"a\"} class=\"smwb-menu__item-inner\" href={local.href} {...(local.linkProps ?? {})}>\n            {local.children}\n            <span class=\"smwb-menu__item__helper-text\" />\n          </Dynamic>\n        </Show>\n        <Ripple actionRef={(actions) => (rippleActions = actions)} />\n      </li>\n    </Show>\n  );\n}\n\nexport default MenuItem;\n"],"mappings":"AAAA,SAAqC,MAAM,kBAAkB;AAC7D,SAAS,eAAe;AACxB,OAAO,QAAQ;AACf,SAAS,sBAAsB;AAC/B,SAAS,cAAqC;AAC9C,SAAS,iBAA2B;AACpC,SAAS,mBAAmB;AAcrB,SAAS,SAAS,OAAgD;AACvE,QAAM,MAAM,eAAe;AAC3B,QAAM,CAAC,OAAO,IAAI,IAAI,WAAW,OAAO;AAAA,IACtC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,MAAI;AAEJ,QAAM,UAAuD,CAAC,UAAU;AACtE,QAAI,MAAM,UAAU;AAClB,UAAI,MAAM,KAAM,OAAM,eAAe;AACrC;AAAA,IACF;AACA,gBAAY,MAAM,SAAS,KAAK;AAAA,EAClC;AAEA,QAAM,gBAAgB,CAAC,UAA8B;AACnD,QAAI,CAAC,MAAM,SAAU,gBAAe,SAAS,KAAK;AAAA,EACpD;AAEA,QAAM,UAAU,MACd,GAAG,mBAAmB,MAAM,OAAO;AAAA,IACjC,0BAA0B,IAAI;AAAA,IAC9B,6BAA6B,MAAM;AAAA,IACnC,6BAA6B,MAAM;AAAA,EACrC,CAAC;AAEH,SACE,CAAC,KAAK,MAAM,CAAC,MAAM,gBAAgB,UAAU,MAAM,iBAAiB,KAAK,GAAG;AAAA,MAC1E,CAAC;AAAA,QACK;AAAA,IACJ,KAAK;AAAA,IACL,KAAK,UAAU,MAAM,GAAG;AAAA,IACxB,OAAO,QAAQ;AAAA,IACf,UAAU,MAAM,WAAW,SAAY;AAAA,IACvC,SAAS;AAAA,IACT,YAAY,MAAM;AAAA,IAClB,eAAe;AAAA,GAChB;AAAA,QACC,CAAC;AAAA,IACC,MAAM,MAAM;AAAA,IACZ,UAAU,CAAC,KAAK,MAAM,yBAAyB,MAAM,SAAS,EAAnD;AAAA,GACZ;AAAA,UACC,CAAC,QAAQ,WAAW,MAAM,eAAe,KAAK,MAAM,wBAAwB,MAAM,MAAM,UAAW,MAAM,aAAa,CAAC,GAAI;AAAA,aACxH,MAAM,SAAS;AAAA,YAChB,CAAC,KAAK,MAAM,+BAA+B,EAAE;AAAA,UAC/C,EAHC,QAGS;AAAA,QACZ,EARC,KAQM;AAAA,QACP,CAAC,OAAO,WAAW,CAAC,YAAa,gBAAgB,SAAU,EAAE;AAAA,MAC/D,EApBC,GAoBI;AAAA,IACP,EAtBC;AAwBL;AAEA,IAAO,mBAAQ;","names":[],"file":"menuItem.jsx"}

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

@@ -0,0 +1,25 @@
+import { splitProps } from "solid-js";
+import cn from "clsx";
+import { useMenuContext } from "./menuContext";
+import { mergeRefs } from "../../../primitives/mergeRefs";
+function MenuItemIcon(props) {
+  const ctx = useMenuContext();
+  const [local, rest] = splitProps(props, ["children", "class", "edge", "ref"]);
+  return <span
+    {...rest}
+    ref={mergeRefs(local.ref)}
+    class={cn("smwb-menu__icon", local.class, {
+      "smwb-menu__icon--dense": ctx.dense,
+      "smwb-menu__icon--start": local.edge === "start",
+      "smwb-menu__icon--end": local.edge === "end"
+    })}
+  >
+      {local.children}
+    </span>;
+}
+var menuItemIcon_default = MenuItemIcon;
+export {
+  MenuItemIcon,
+  menuItemIcon_default as default
+};
+//# sourceMappingURL=menuItemIcon.jsx.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/components/navigation/menu/menuItemIcon.tsx"],"sourcesContent":["import { type JSX, type ParentProps, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { useMenuContext } from \"./menuContext\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport interface MenuItemIconProps extends JSX.HTMLAttributes<HTMLSpanElement> {\n  edge?: \"start\" | \"end\";\n  ref?: Ref<HTMLSpanElement>;\n}\n\nexport function MenuItemIcon(props: ParentProps<MenuItemIconProps>): JSX.Element {\n  const ctx = useMenuContext();\n  const [local, rest] = splitProps(props, [\"children\", \"class\", \"edge\", \"ref\"]);\n  return (\n    <span\n      {...rest}\n      ref={mergeRefs(local.ref)}\n      class={cn(\"smwb-menu__icon\", local.class, {\n        \"smwb-menu__icon--dense\": ctx.dense,\n        \"smwb-menu__icon--start\": local.edge === \"start\",\n        \"smwb-menu__icon--end\": local.edge === \"end\",\n      })}\n    >\n      {local.children}\n    </span>\n  );\n}\n\nexport default MenuItemIcon;\n"],"mappings":"AAAA,SAAqC,kBAAkB;AACvD,OAAO,QAAQ;AACf,SAAS,sBAAsB;AAC/B,SAAS,iBAA2B;AAO7B,SAAS,aAAa,OAAoD;AAC/E,QAAM,MAAM,eAAe;AAC3B,QAAM,CAAC,OAAO,IAAI,IAAI,WAAW,OAAO,CAAC,YAAY,SAAS,QAAQ,KAAK,CAAC;AAC5E,SACE,CAAC;AAAA,QACK;AAAA,IACJ,KAAK,UAAU,MAAM,GAAG;AAAA,IACxB,OAAO,GAAG,mBAAmB,MAAM,OAAO;AAAA,MACxC,0BAA0B,IAAI;AAAA,MAC9B,0BAA0B,MAAM,SAAS;AAAA,MACzC,wBAAwB,MAAM,SAAS;AAAA,IACzC,CAAC;AAAA,GACF;AAAA,OACE,MAAM,SAAS;AAAA,IAClB,EAVC;AAYL;AAEA,IAAO,uBAAQ;","names":[],"file":"menuItemIcon.jsx"}

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

@@ -0,0 +1,25 @@
+import { mergeProps, splitProps } from "solid-js";
+import cn from "clsx";
+import { useMenuContext } from "./menuContext";
+import { mergeRefs } from "../../../primitives/mergeRefs";
+function MenuItemText(props) {
+  const ctx = useMenuContext();
+  const merged = mergeProps({ inset: false }, props);
+  const [local, rest] = splitProps(merged, ["children", "class", "inset", "ref"]);
+  return <span
+    {...rest}
+    ref={mergeRefs(local.ref)}
+    class={cn("smwb-menu__text", local.class, {
+      "smwb-menu__text--inset": local.inset,
+      "smwb-menu__text--dense": ctx.dense
+    })}
+  >
+      {local.children}
+    </span>;
+}
+var menuItemText_default = MenuItemText;
+export {
+  MenuItemText,
+  menuItemText_default as default
+};
+//# sourceMappingURL=menuItemText.jsx.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/components/navigation/menu/menuItemText.tsx"],"sourcesContent":["import { type JSX, type ParentProps, mergeProps, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { useMenuContext } from \"./menuContext\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport interface MenuItemTextProps extends JSX.HTMLAttributes<HTMLSpanElement> {\n  inset?: boolean;\n  ref?: Ref<HTMLSpanElement>;\n}\n\nexport function MenuItemText(props: ParentProps<MenuItemTextProps>): JSX.Element {\n  const ctx = useMenuContext();\n  const merged = mergeProps({ inset: false }, props);\n  const [local, rest] = splitProps(merged, [\"children\", \"class\", \"inset\", \"ref\"]);\n  return (\n    <span\n      {...rest}\n      ref={mergeRefs(local.ref)}\n      class={cn(\"smwb-menu__text\", local.class, {\n        \"smwb-menu__text--inset\": local.inset,\n        \"smwb-menu__text--dense\": ctx.dense,\n      })}\n    >\n      {local.children}\n    </span>\n  );\n}\n\nexport default MenuItemText;\n"],"mappings":"AAAA,SAAqC,YAAY,kBAAkB;AACnE,OAAO,QAAQ;AACf,SAAS,sBAAsB;AAC/B,SAAS,iBAA2B;AAO7B,SAAS,aAAa,OAAoD;AAC/E,QAAM,MAAM,eAAe;AAC3B,QAAM,SAAS,WAAW,EAAE,OAAO,MAAM,GAAG,KAAK;AACjD,QAAM,CAAC,OAAO,IAAI,IAAI,WAAW,QAAQ,CAAC,YAAY,SAAS,SAAS,KAAK,CAAC;AAC9E,SACE,CAAC;AAAA,QACK;AAAA,IACJ,KAAK,UAAU,MAAM,GAAG;AAAA,IACxB,OAAO,GAAG,mBAAmB,MAAM,OAAO;AAAA,MACxC,0BAA0B,MAAM;AAAA,MAChC,0BAA0B,IAAI;AAAA,IAChC,CAAC;AAAA,GACF;AAAA,OACE,MAAM,SAAS;AAAA,IAClB,EATC;AAWL;AAEA,IAAO,uBAAQ;","names":[],"file":"menuItemText.jsx"}

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

@@ -0,0 +1,46 @@
+import { splitProps } from "solid-js";
+import cn from "clsx";
+import { useMenuContext } from "./menuContext";
+import { mergeRefs } from "../../../primitives/mergeRefs";
+function MenuList(props) {
+  const ctx = useMenuContext();
+  const [local, rest] = splitProps(props, ["children", "class", "ref"]);
+  const onKeyDown = (event) => {
+    const items = Array.from(
+      event.currentTarget.querySelectorAll('[role="menuitem"]:not([aria-disabled="true"])')
+    );
+    if (items.length === 0) return;
+    const currentIndex = items.indexOf(document.activeElement);
+    if (event.key === "ArrowDown") {
+      event.preventDefault();
+      items[(currentIndex + 1 + items.length) % items.length]?.focus();
+    } else if (event.key === "ArrowUp") {
+      event.preventDefault();
+      items[(currentIndex - 1 + items.length) % items.length]?.focus();
+    } else if (event.key === "Home") {
+      event.preventDefault();
+      items[0]?.focus();
+    } else if (event.key === "End") {
+      event.preventDefault();
+      items[items.length - 1]?.focus();
+    } else if (event.key === "Escape") {
+      ctx.onClose();
+    }
+  };
+  return <div {...rest} ref={mergeRefs(local.ref)} class={cn("smwb-menu", local.class, `smwb-menu--${ctx.variant}`)}>
+      <ul
+    class={cn("smwb-menu__list", `smwb-menu__list--${ctx.variant}`)}
+    role="menu"
+    aria-orientation="vertical"
+    onKeyDown={onKeyDown}
+  >
+        {local.children}
+      </ul>
+    </div>;
+}
+var menuList_default = MenuList;
+export {
+  MenuList,
+  menuList_default as default
+};
+//# sourceMappingURL=menuList.jsx.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/components/navigation/menu/menuList.tsx"],"sourcesContent":["import { type JSX, type ParentProps, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { useMenuContext } from \"./menuContext\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport interface MenuListProps extends JSX.HTMLAttributes<HTMLDivElement> {\n  ref?: Ref<HTMLDivElement>;\n}\n\nexport function MenuList(props: ParentProps<MenuListProps>): JSX.Element {\n  const ctx = useMenuContext();\n  const [local, rest] = splitProps(props, [\"children\", \"class\", \"ref\"]);\n\n  const onKeyDown: JSX.EventHandler<HTMLUListElement, KeyboardEvent> = (event) => {\n    const items = Array.from(\n      event.currentTarget.querySelectorAll<HTMLElement>('[role=\"menuitem\"]:not([aria-disabled=\"true\"])')\n    );\n    if (items.length === 0) return;\n    const currentIndex = items.indexOf(document.activeElement as HTMLElement);\n\n    if (event.key === \"ArrowDown\") {\n      event.preventDefault();\n      items[(currentIndex + 1 + items.length) % items.length]?.focus();\n    } else if (event.key === \"ArrowUp\") {\n      event.preventDefault();\n      items[(currentIndex - 1 + items.length) % items.length]?.focus();\n    } else if (event.key === \"Home\") {\n      event.preventDefault();\n      items[0]?.focus();\n    } else if (event.key === \"End\") {\n      event.preventDefault();\n      items[items.length - 1]?.focus();\n    } else if (event.key === \"Escape\") {\n      ctx.onClose();\n    }\n  };\n\n  return (\n    <div {...rest} ref={mergeRefs(local.ref)} class={cn(\"smwb-menu\", local.class, `smwb-menu--${ctx.variant}`)}>\n      <ul\n        class={cn(\"smwb-menu__list\", `smwb-menu__list--${ctx.variant}`)}\n        role=\"menu\"\n        aria-orientation=\"vertical\"\n        onKeyDown={onKeyDown}\n      >\n        {local.children}\n      </ul>\n    </div>\n  );\n}\n\nexport default MenuList;\n"],"mappings":"AAAA,SAAqC,kBAAkB;AACvD,OAAO,QAAQ;AACf,SAAS,sBAAsB;AAC/B,SAAS,iBAA2B;AAM7B,SAAS,SAAS,OAAgD;AACvE,QAAM,MAAM,eAAe;AAC3B,QAAM,CAAC,OAAO,IAAI,IAAI,WAAW,OAAO,CAAC,YAAY,SAAS,KAAK,CAAC;AAEpE,QAAM,YAA+D,CAAC,UAAU;AAC9E,UAAM,QAAQ,MAAM;AAAA,MAClB,MAAM,cAAc,iBAA8B,+CAA+C;AAAA,IACnG;AACA,QAAI,MAAM,WAAW,EAAG;AACxB,UAAM,eAAe,MAAM,QAAQ,SAAS,aAA4B;AAExE,QAAI,MAAM,QAAQ,aAAa;AAC7B,YAAM,eAAe;AACrB,aAAO,eAAe,IAAI,MAAM,UAAU,MAAM,MAAM,GAAG,MAAM;AAAA,IACjE,WAAW,MAAM,QAAQ,WAAW;AAClC,YAAM,eAAe;AACrB,aAAO,eAAe,IAAI,MAAM,UAAU,MAAM,MAAM,GAAG,MAAM;AAAA,IACjE,WAAW,MAAM,QAAQ,QAAQ;AAC/B,YAAM,eAAe;AACrB,YAAM,CAAC,GAAG,MAAM;AAAA,IAClB,WAAW,MAAM,QAAQ,OAAO;AAC9B,YAAM,eAAe;AACrB,YAAM,MAAM,SAAS,CAAC,GAAG,MAAM;AAAA,IACjC,WAAW,MAAM,QAAQ,UAAU;AACjC,UAAI,QAAQ;AAAA,IACd;AAAA,EACF;AAEA,SACE,CAAC,QAAQ,MAAM,KAAK,UAAU,MAAM,GAAG,GAAG,OAAO,GAAG,aAAa,MAAM,OAAO,cAAc,IAAI,OAAO,EAAE,GAAG;AAAA,MAC1G,CAAC;AAAA,IACC,OAAO,GAAG,mBAAmB,oBAAoB,IAAI,OAAO,EAAE;AAAA,IAC9D,KAAK;AAAA,IACL,iBAAiB;AAAA,IACjB,WAAW;AAAA,GACZ;AAAA,SACE,MAAM,SAAS;AAAA,MAClB,EAPC,GAOI;AAAA,IACP,EATC;AAWL;AAEA,IAAO,mBAAQ;","names":[],"file":"menuList.jsx"}

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

@@ -0,0 +1,86 @@
+import { createSignal, splitProps } from "solid-js";
+import { offset } from "@floating-ui/dom";
+import cn from "clsx";
+import { MenuContext, useMenuContext } from "./menuContext";
+import { MenuFloating } from "./menuFloating";
+function MenuSubmenu(props) {
+  const parentCtx = useMenuContext();
+  const [local] = splitProps(props, ["placement", "onClose", "toggleElement", "children", "openOnHover", "class"]);
+  const [isOpen, setIsOpen] = createSignal(false);
+  const [anchor, setAnchor] = createSignal(null);
+  const middleware = [
+    offset(({ placement }) => {
+      switch (placement) {
+        case "right-start":
+        case "left-start":
+          return { crossAxis: -8, mainAxis: 0 };
+        case "right-end":
+        case "left-end":
+          return { crossAxis: 8, mainAxis: 0 };
+        default:
+          return { crossAxis: 0, mainAxis: 0 };
+      }
+    })
+  ];
+  const onToggle = (event) => {
+    if (event.button !== 0) return;
+    setIsOpen((prev) => !prev);
+  };
+  const close = () => {
+    setIsOpen(false);
+    local.onClose?.();
+  };
+  const onToggleKeyDown = (event) => {
+    if (event.key === "ArrowRight" || event.key === "Enter" || event.key === " ") {
+      event.preventDefault();
+      setIsOpen(true);
+    } else if (event.key === "ArrowLeft" || event.key === "Escape") {
+      setIsOpen(false);
+    }
+  };
+  const onContentClick = (event) => {
+    const item = event.target.closest('[role="menuitem"]');
+    if (item && !item.hasAttribute("aria-haspopup")) {
+      close();
+      parentCtx.onClose();
+    }
+  };
+  const value = {
+    get dense() {
+      return parentCtx.dense;
+    },
+    variant: "floating",
+    onClose: close
+  };
+  return <MenuContext.Provider value={value}>
+      <li
+    role="menuitem"
+    ref={setAnchor}
+    class={cn("smwb-menu__item", local.class, { "smwb-menu__item--selected": isOpen() })}
+    tabindex={0}
+    aria-haspopup="menu"
+    aria-expanded={isOpen()}
+    onClick={onToggle}
+    onKeyDown={onToggleKeyDown}
+    onMouseEnter={local.openOnHover ? () => setIsOpen(true) : void 0}
+  >
+        <span class="smwb-menu__item-inner">{local.toggleElement}</span>
+      </li>
+      <MenuFloating
+    placement={local.placement ?? "right-start"}
+    isOpen={isOpen()}
+    onClose={close}
+    anchorElement={anchor()}
+    middleware={middleware}
+    onClick={onContentClick}
+  >
+        {local.children}
+      </MenuFloating>
+    </MenuContext.Provider>;
+}
+var menuSubmenu_default = MenuSubmenu;
+export {
+  MenuSubmenu,
+  menuSubmenu_default as default
+};
+//# sourceMappingURL=menuSubmenu.jsx.map