npm - @smwb/ui-solid - Versions diffs - 0.12.0 → 0.13.0 - Mend

@smwb/ui-solid 0.12.0 → 0.13.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (850) hide show

package/dist/source/components/navigation/tabs/tab/tab.jsx CHANGED Viewed

@@ -1,6 +1,6 @@
 import "@smwb/ui-styles/less/tokens.entry.less";
 import "@smwb/ui-styles/less/components/tabs/tab/tab.entry.less";
-import { Show, children, mergeProps, splitProps } from "solid-js";
+import { Show, children, createSignal, mergeProps, splitProps } from "solid-js";
 import { Dynamic } from "solid-js/web";
 import cn from "clsx";
 import { Ripple } from "../../../base/ripple";
@@ -9,7 +9,8 @@ import { mergeRefs } from "../../../../primitives/mergeRefs";
 import { callHandler } from "../../../../primitives/callHandler";
 function Tab(props) {
   const ctx = useTabsContext();
-  const index = ctx ? ctx.registerTab() : -1;
+  const [root, setRoot] = createSignal();
+  const index = ctx ? ctx.registerTab(root) : () => -1;
   const merged = mergeProps({ isActive: false, stacked: false }, props);
   const [local, rest] = splitProps(merged, [
     "class",
@@ -21,27 +22,27 @@ function Tab(props) {
     "tag",
     "disabled",
     "onClick",
-    "ref"
+    "ref",
+    // The tab sets this on its root too; its own handler calls the caller's first.
+    "onPointerDown"
   ]);
   const icon = children(() => local.icon);
   const label = children(() => local.label);
   let rippleActions;
-  const active = () => ctx ? ctx.value() === index : local.isActive;
+  const active = () => ctx ? ctx.value() === index() : local.isActive;
   const onClick = (event) => {
-    if (ctx) {
-      ctx.onChange(event, index);
-    } else {
-      callHandler(local.onClick, event);
-    }
+    callHandler(local.onClick, event);
+    ctx?.onChange(event, index());
   };
   const onPointerDown = (event) => {
+    callHandler(local.onPointerDown, event);
     rippleActions?.onRipple(event);
   };
   const tag = () => local.tag ?? "button";
   return <Dynamic
     component={tag()}
     {...rest}
-    ref={mergeRefs(local.ref)}
+    ref={mergeRefs(local.ref, setRoot)}
     class={cn("smwb-tab", local.class, {
       "smwb-tab--active": active(),
       "smwb-tab--stacked": local.stacked,
@@ -55,12 +56,7 @@ function Tab(props) {
     tabindex={active() ? 0 : -1}
     disabled={tag() === "button" ? local.disabled : void 0}
   >
-      <span
-    class="smwb-tab__content"
-    ref={mergeRefs(local.contentRef, (el) => {
-      if (ctx?.indicatorContent) ctx.setContentRef(index, el);
-    })}
-  >
+      <span class="smwb-tab__content" ref={mergeRefs(local.contentRef)}>
         <Show when={icon()}>
           <span class="smwb-tab__icon">{icon()}</span>
         </Show>

package/dist/source/components/navigation/tabs/tab/tab.jsx.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../../src/components/navigation/tabs/tab/tab.tsx"],"sourcesContent":["import \"@smwb/ui-styles/less/tokens.entry.less\";\nimport \"@smwb/ui-styles/less/components/tabs/tab/tab.entry.less\";\nimport { type JSX, type ParentProps, 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 { useTabsContext } from \"../tabsContext\";\nimport { mergeRefs, type Ref } from \"../../../../primitives/mergeRefs\";\nimport { callHandler } from \"../../../../primitives/callHandler\";\n\nexport interface TabProps extends JSX.HTMLAttributes<HTMLButtonElement \| HTMLAnchorElement> {\n label?: JSX.Element;\n isActive?: boolean;\n contentRef?: Ref<HTMLSpanElement>;\n icon?: JSX.Element;\n stacked?: boolean;\n tag?: string;\n /** With `tag=\"a\"`: where the link goes, so the tab stays a real link. */\n href?: string;\n disabled?: boolean;\n ref?: Ref<HTMLButtonElement \| HTMLAnchorElement>;\n}\n\nexport function Tab(props: ParentProps<TabProps>): JSX.Element {\n const ctx = useTabsContext();\n const index = ctx ? ctx.registerTab() : -1;\n const merged = mergeProps({ isActive: false, stacked: false }, props);\n const [local, rest] = splitProps(merged, [\n \"class\",\n \"label\",\n \"isActive\",\n \"contentRef\",\n \"icon\",\n \"stacked\",\n \"tag\",\n \"disabled\",\n \"onClick\",\n \"ref\",\n ]);\n\n // Read the icon and the label once: markup passed as a prop is created anew on\n // every read, and during hydration the copy made for the <Show> test has no\n // server DOM node to adopt (\"Unable to find DOM nodes for hydration key\").\n const icon = children(() => local.icon);\n const label = children(() => local.label);\n\n let rippleActions: RippleActionsRef \| undefined;\n\n const active = (): boolean => (ctx ? ctx.value() === index : local.isActive);\n\n const onClick: JSX.EventHandler<HTMLButtonElement \| HTMLAnchorElement, MouseEvent> = (event) => {\n if ~~(ctx)~~ ~~{\n ctx.onChange(event~~, ~~index);\n }~~ ~~else~~ {\n callHandler(local.onClick, event);\n }\n };\n\n const onPointerDown = (event~~: PointerEvent~~): ~~void~~ => {\n rippleActions?.onRipple(event);\n };\n\n const tag = (): string => local.tag ?? \"button\";\n\n return (\n <Dynamic\n component={tag()}\n {...rest}\n ref={mergeRefs(local.ref)}\n class={cn(\"smwb-tab\", local.class, {\n \"smwb-tab--active\": active(),\n \"smwb-tab--stacked\": local.stacked,\n \"smwb-tab--disabled\": local.disabled,\n })}\n onClick={onClick}\n onPointerDown={onPointerDown}\n role=\"tab\"\n aria-selected={active()}\n aria-disabled={local.disabled \|\| undefined}\n tabindex={active() ? 0 : -1}\n disabled={tag() === \"button\" ? local.disabled : undefined}\n >\n <span\n class=\"smwb-tab__content\"\n ref={mergeRefs(local.contentRef~~, (el~~) ~~=> {\n if (ctx?.indicatorContent) ctx.setContentRef(index, el as HTMLSpanElement);\n~~ }~~)}\n~~ >\n <Show when={icon()}>\n <span class=\"smwb-tab__icon\">{icon()}</span>\n </Show>\n <Show when={label()}>\n <span class=\"smwb-tab__text-label\">{label()}</span>\n </Show>\n </span>\n <Ripple actionRef={(actions) => (rippleActions = actions)} classes={{ child: \"tab__ripple-child\" }} />\n </Dynamic>\n );\n}\n\nexport default Tab;\n"],"mappings":"AAAA,OAAO;AACP,OAAO;AACP,SAAqC,MAAM,UAAU,YAAY,kBAAkB;~~AACnF~~,SAAS,eAAe;AACxB,OAAO,QAAQ;AACf,SAAS,cAAqC;AAC9C,SAAS,sBAAsB;AAC/B,SAAS,iBAA2B;AACpC,SAAS,mBAAmB;AAerB,SAAS,IAAI,OAA2C;AAC7D,QAAM,MAAM,eAAe;AAC3B,QAAM,QAAQ,MAAM,IAAI,YAAY,IAAI;~~AACxC~~,QAAM,SAAS,WAAW,EAAE,UAAU,OAAO,SAAS,MAAM,GAAG,KAAK;AACpE,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;AAKD,QAAM,OAAO,SAAS,MAAM,MAAM,IAAI;AACtC,QAAM,QAAQ,SAAS,MAAM,MAAM,KAAK;AAExC,MAAI;AAEJ,QAAM,SAAS,MAAgB,MAAM,IAAI,MAAM,MAAM,~~QAAQ~~,MAAM;~~AAEnE~~,QAAM,UAA+E,CAAC,UAAU;~~AAC9F~~,~~QAAI~~,~~KAAK;AACP~~,~~UAAI,~~SAAS,~~OAAO,~~KAAK;~~AAAA~~,~~IAC3B~~,OAAO~~;AACL~~,~~kBAAY,~~MAAM,~~SAAS,KAAK~~;AAAA,~~IAClC~~;~~AAAA,EACF;~~AAEA,QAAM,~~gBAAgB~~,CAAC,~~UAA8B~~;~~AACnD~~,mBAAe,SAAS,KAAK;AAAA,EAC/B;AAEA,QAAM,MAAM,MAAc,MAAM,OAAO;AAEvC,SACE,CAAC;AAAA,IACC,WAAW,IAAI;AAAA,QACX;AAAA,IACJ,KAAK,UAAU,MAAM,~~GAAG~~;AAAA,~~IACxB~~,OAAO,GAAG,YAAY,MAAM,OAAO;AAAA,MACjC,oBAAoB,OAAO;AAAA,MAC3B,qBAAqB,MAAM;AAAA,MAC3B,sBAAsB,MAAM;AAAA,IAC9B,CAAC;AAAA,IACD,SAAS;AAAA,IACT,eAAe;AAAA,~~IACf~~,KAAK;AAAA,IACL,eAAe,OAAO;AAAA,IACtB,eAAe,MAAM,YAAY;AAAA,IACjC,UAAU,OAAO,IAAI,IAAI;AAAA,IACzB,UAAU,IAAI,MAAM,WAAW,MAAM,WAAW;AAAA,GACjD;AAAA,MACC,CAAC~~;AAAA~~,~~IACC~~,MAAM~~;AAAA~~,~~IACN~~,KAAK,UAAU,MAAM,~~YAAY~~,~~CAAC,OAAO~~;~~AACvC,UAAI,KAAK,iBAAkB,KAAI,cAAc,OAAO,EAAqB;~~AAAA,~~IAC3E~~,CAAC~~;AAAA~~,~~GACF;AAAA,QACC,CAAC,~~KAAK,MAAM,KAAK,GAAG;AAAA,UAClB,CAAC,KAAK,MAAM,kBAAkB,KAAK,EAAE,EAApC,KAA2C;AAAA,QAC9C,EAFC,KAEM;AAAA,QACP,CAAC,KAAK,MAAM,MAAM,GAAG;AAAA,UACnB,CAAC,KAAK,MAAM,wBAAwB,MAAM,EAAE,EAA3C,KAAkD;AAAA,QACrD,EAFC,KAEM;AAAA,MACT,~~EAZC~~,~~KAYM~~;AAAA,MACP,CAAC,OAAO,WAAW,CAAC,YAAa,gBAAgB,SAAU,SAAS,EAAE,OAAO,oBAAoB,GAAG,EAAE;AAAA,IACxG,~~EA/BC~~;~~AAiCL~~;AAEA,IAAO,cAAQ;","names":[],"file":"tab.jsx"}
1	+ {"version":3,"sources":["../../../../../../src/components/navigation/tabs/tab/tab.tsx"],"sourcesContent":["import \"@smwb/ui-styles/less/tokens.entry.less\";\nimport \"@smwb/ui-styles/less/components/tabs/tab/tab.entry.less\";\nimport { type JSX, type ParentProps, Show, children, createSignal, mergeProps, splitProps } from \"solid-js\";\nimport { Dynamic } from \"solid-js/web\";\nimport cn from \"clsx\";\nimport { Ripple, type RippleActionsRef } from \"../../../base/ripple\";\nimport { useTabsContext } from \"../tabsContext\";\nimport { mergeRefs, type Ref } from \"../../../../primitives/mergeRefs\";\nimport { callHandler } from \"../../../../primitives/callHandler\";\n\nexport interface TabProps extends JSX.HTMLAttributes<HTMLButtonElement \| HTMLAnchorElement> {\n label?: JSX.Element;\n isActive?: boolean;\n contentRef?: Ref<HTMLSpanElement>;\n icon?: JSX.Element;\n stacked?: boolean;\n tag?: string;\n /** With `tag=\"a\"`: where the link goes, so the tab stays a real link. */\n href?: string;\n disabled?: boolean;\n ref?: Ref<HTMLButtonElement \| HTMLAnchorElement>;\n}\n\nexport function Tab(props: ParentProps<TabProps>): JSX.Element {\n const ctx = useTabsContext();\n const [root, setRoot] = createSignal<HTMLButtonElement \| HTMLAnchorElement>();\n // The tab's position in the tab list: it follows the tab when tabs around it\n // are added, removed or reordered.\n const index = ctx ? ctx.registerTab(root) : () => -1;\n const merged = mergeProps({ isActive: false, stacked: false }, props);\n const [local, rest] = splitProps(merged, [\n \"class\",\n \"label\",\n \"isActive\",\n \"contentRef\",\n \"icon\",\n \"stacked\",\n \"tag\",\n \"disabled\",\n \"onClick\",\n \"ref\",\n // The tab sets this on its root too; its own handler calls the caller's first.\n \"onPointerDown\",\n ]);\n\n // Read the icon and the label once: markup passed as a prop is created anew on\n // every read, and during hydration the copy made for the <Show> test has no\n // server DOM node to adopt (\"Unable to find DOM nodes for hydration key\").\n const icon = children(() => local.icon);\n const label = children(() => local.label);\n\n let rippleActions: RippleActionsRef \| undefined;\n\n const active = (): boolean => (ctx ? ctx.value() === index() : local.isActive);\n\n const onClick: JSX.EventHandler<HTMLButtonElement \| HTMLAnchorElement, MouseEvent> = (event) => {\n // Inside Tabs too the caller's onClick runs first, then the tab list picks the tab.\n callHandler(local.onClick, event);\n ctx?.onChange(event, index());\n };\n\n const onPointerDown: JSX.EventHandler<HTMLButtonElement \| HTMLAnchorElement, PointerEvent> = (event) => {\n callHandler(local.onPointerDown, event);\n rippleActions?.onRipple(event);\n };\n\n const tag = (): string => local.tag ?? \"button\";\n\n return (\n <Dynamic\n component={tag()}\n {...rest}\n ref={mergeRefs(local.ref, setRoot)}\n class={cn(\"smwb-tab\", local.class, {\n \"smwb-tab--active\": active(),\n \"smwb-tab--stacked\": local.stacked,\n \"smwb-tab--disabled\": local.disabled,\n })}\n onClick={onClick}\n onPointerDown={onPointerDown}\n // The role, the selection and the roving tabindex belong to the tab list:\n // they win over the caller's. A tab that is not disabled keeps the\n // caller's aria-disabled.\n role=\"tab\"\n aria-selected={active()}\n aria-disabled={local.disabled \|\| undefined}\n tabindex={active() ? 0 : -1}\n disabled={tag() === \"button\" ? local.disabled : undefined}\n >\n <span class=\"smwb-tab__content\" ref={mergeRefs(local.contentRef)}>\n <Show when={icon()}>\n <span class=\"smwb-tab__icon\">{icon()}</span>\n </Show>\n <Show when={label()}>\n <span class=\"smwb-tab__text-label\">{label()}</span>\n </Show>\n </span>\n <Ripple actionRef={(actions) => (rippleActions = actions)} classes={{ child: \"tab__ripple-child\" }} />\n </Dynamic>\n );\n}\n\nexport default Tab;\n"],"mappings":"AAAA,OAAO;AACP,OAAO;AACP,SAAqC,MAAM,UAAU,cAAc,YAAY,kBAAkB;AACjG,SAAS,eAAe;AACxB,OAAO,QAAQ;AACf,SAAS,cAAqC;AAC9C,SAAS,sBAAsB;AAC/B,SAAS,iBAA2B;AACpC,SAAS,mBAAmB;AAerB,SAAS,IAAI,OAA2C;AAC7D,QAAM,MAAM,eAAe;AAC3B,QAAM,CAAC,MAAM,OAAO,IAAI,aAAoD;AAG5E,QAAM,QAAQ,MAAM,IAAI,YAAY,IAAI,IAAI,MAAM;AAClD,QAAM,SAAS,WAAW,EAAE,UAAU,OAAO,SAAS,MAAM,GAAG,KAAK;AACpE,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;AAAA,IAEA;AAAA,EACF,CAAC;AAKD,QAAM,OAAO,SAAS,MAAM,MAAM,IAAI;AACtC,QAAM,QAAQ,SAAS,MAAM,MAAM,KAAK;AAExC,MAAI;AAEJ,QAAM,SAAS,MAAgB,MAAM,IAAI,MAAM,MAAM,MAAM,IAAI,MAAM;AAErE,QAAM,UAA+E,CAAC,UAAU;AAE9F,gBAAY,MAAM,SAAS,KAAK;AAChC,SAAK,SAAS,OAAO,MAAM,CAAC;AAAA,EAC9B;AAEA,QAAM,gBAAuF,CAAC,UAAU;AACtG,gBAAY,MAAM,eAAe,KAAK;AACtC,mBAAe,SAAS,KAAK;AAAA,EAC/B;AAEA,QAAM,MAAM,MAAc,MAAM,OAAO;AAEvC,SACE,CAAC;AAAA,IACC,WAAW,IAAI;AAAA,QACX;AAAA,IACJ,KAAK,UAAU,MAAM,KAAK,OAAO;AAAA,IACjC,OAAO,GAAG,YAAY,MAAM,OAAO;AAAA,MACjC,oBAAoB,OAAO;AAAA,MAC3B,qBAAqB,MAAM;AAAA,MAC3B,sBAAsB,MAAM;AAAA,IAC9B,CAAC;AAAA,IACD,SAAS;AAAA,IACT,eAAe;AAAA,IAIf,KAAK;AAAA,IACL,eAAe,OAAO;AAAA,IACtB,eAAe,MAAM,YAAY;AAAA,IACjC,UAAU,OAAO,IAAI,IAAI;AAAA,IACzB,UAAU,IAAI,MAAM,WAAW,MAAM,WAAW;AAAA,GACjD;AAAA,MACC,CAAC,KAAK,MAAM,oBAAoB,KAAK,UAAU,MAAM,UAAU,GAAG;AAAA,QAChE,CAAC,KAAK,MAAM,KAAK,GAAG;AAAA,UAClB,CAAC,KAAK,MAAM,kBAAkB,KAAK,EAAE,EAApC,KAA2C;AAAA,QAC9C,EAFC,KAEM;AAAA,QACP,CAAC,KAAK,MAAM,MAAM,GAAG;AAAA,UACnB,CAAC,KAAK,MAAM,wBAAwB,MAAM,EAAE,EAA3C,KAAkD;AAAA,QACrD,EAFC,KAEM;AAAA,MACT,EAPC,KAOM;AAAA,MACP,CAAC,OAAO,WAAW,CAAC,YAAa,gBAAgB,SAAU,SAAS,EAAE,OAAO,oBAAoB,GAAG,EAAE;AAAA,IACxG,EA7BC;AA+BL;AAEA,IAAO,cAAQ;","names":[],"file":"tab.jsx"}

package/dist/source/components/navigation/tabs/tabs.jsx CHANGED Viewed

@@ -1,6 +1,19 @@
 import "@smwb/ui-styles/less/tokens.entry.less";
 import "@smwb/ui-styles/less/components/tabs/tabs.entry.less";
-import { Show, createEffect, createSignal, mergeProps, on, onCleanup, onMount, splitProps } from "solid-js";
+import {
+  Show,
+  children,
+  createComputed,
+  createEffect,
+  createMemo,
+  createSignal,
+  mergeProps,
+  on,
+  onCleanup,
+  onMount,
+  splitProps
+} from "solid-js";
+import { isServer } from "solid-js/web";
 import cn from "clsx";
 import { debounce } from "../../../utils/debounce";
 import { animate } from "../../../utils/animate";
@@ -10,6 +23,13 @@ import { Icon } from "../../base/icon";
 import { mergeRefs } from "../../../primitives/mergeRefs";
 const VIEW_NEXT_TAB_PX = 40;
 const SCROLL_PAGE = 0.8;
+function TabListItems(props) {
+  const resolved = children(() => props.children);
+  if (!isServer) {
+    createComputed(() => props.onItems(resolved.toArray().filter((node) => node instanceof Element)));
+  }
+  return <>{resolved()}</>;
+}
 function Tabs(props) {
   const merged = mergeProps(
     {
@@ -42,8 +62,8 @@ function Tabs(props) {
   const [overflowEnd, setOverflowEnd] = createSignal(false);
   let tabsEl;
   let tabListEl;
-  let tabCounter = 0;
-  const contentRefs = [];
+  const [items, setItems] = createSignal();
+  let created = 0;
   const getTabsMeta = () => {
     let tabsMeta;
     if (tabsEl) {
@@ -56,7 +76,7 @@ function Tabs(props) {
       const tab = tabListEl.children[local.value];
       tabMeta = tab ? tab.getBoundingClientRect() : null;
       if (local.indicatorContent) {
-        tabContentMeta = contentRefs[local.value]?.getBoundingClientRect() ?? null;
+        tabContentMeta = tab?.querySelector(".smwb-tab__content")?.getBoundingClientRect() ?? null;
       }
     }
     return { tabsMeta, tabMeta, tabContentMeta };
@@ -110,7 +130,7 @@ function Tabs(props) {
     }
   };
   onMount(() => setMounted(true));
-  createEffect(on(() => local.value, () => updateIndicatorState()));
+  createEffect(on([() => local.value, items], () => updateIndicatorState()));
   onMount(() => {
     const onResize = debounce(() => {
       updateIndicatorState();
@@ -140,10 +160,14 @@ function Tabs(props) {
   const contextValue = {
     value: () => local.value,
     onChange: local.onChange,
-    indicatorContent: local.indicatorContent,
-    registerTab: () => tabCounter++,
-    setContentRef: (index, el) => {
-      contentRefs[index] = el;
+    registerTab: (element) => {
+      const order = created++;
+      return createMemo(() => {
+        const list = items();
+        if (!list) return order;
+        const el = element();
+        return el ? list.findIndex((item) => item.contains(el)) : -1;
+      });
     }
   };
   const showScrollButtons = () => local.scrollable && local.scrollButtons && (overflowStart() || overflowEnd());
@@ -183,7 +207,7 @@ function Tabs(props) {
     ref={(el) => tabsEl = el}
   >
           <div class="smwb-tabs__scroll-area" ref={(el) => tabListEl = el} role="tablist" aria-label={local["aria-label"]}>
-            {local.children}
+            <TabListItems onItems={setItems}>{local.children}</TabListItems>
           </div>
           <Show when={mounted()}>
             <span

package/dist/source/components/navigation/tabs/tabs.jsx.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../src/components/navigation/tabs/tabs.tsx"],"sourcesContent":["import \"@smwb/ui-styles/less/tokens.entry.less\";\nimport \"@smwb/ui-styles/less/components/tabs/tabs.entry.less\";\nimport { type JSX, type ParentProps, Show, createEffect, createSignal, mergeProps, on, onCleanup, onMount, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { debounce } from \"../../../utils/debounce\";\nimport { animate } from \"../../../utils/animate\";\nimport { TabsContext, type TabsContextValue } from \"./tabsContext\";\nimport { Tab } from \"./tab/tab\";\nimport { Icon } from \"../../base/icon\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport interface TabsProps {\n value: number;\n onChange: (event: MouseEvent & { currentTarget: HTMLElement; target: Element }, index: number) => void;\n indicatorContent?: boolean;\n /*\n Let the tab row scroll sideways instead of clipping it. The edge beyond which\n * more tabs are hidden fades out.\n /\n scrollable?: boolean;\n /* With `scrollable`: buttons at both ends that scroll the row while it overflows. /\n scrollButtons?: boolean;\n /* Compact tabs: labels as written (no capitals, no letter spacing) and less padding. /\n dense?: boolean;\n /* Accessible label of the button that scrolls back. /\n scrollBackAriaLabel?: string;\n /* Accessible label of the button that scrolls forward. /\n scrollForwardAriaLabel?: string;\n class?: string;\n children?: JSX.Element;\n \"aria-label\"?: string;\n ref?: Ref<HTMLDivElement>;\n}\n\ninterface IndicatorStyle {\n root: { left?: number; width?: number };\n content?: { width: number };\n}\n\nconst VIEW_NEXT_TAB_PX = 40;\n/* A scroll button moves the row by this share of its visible width. /\nconst SCROLL_PAGE = 0.8;\n\nexport function Tabs(props: ParentProps<TabsProps>): JSX.Element {\n const merged = mergeProps(\n {\n indicatorContent: false,\n scrollable: false,\n scrollButtons: false,\n dense: false,\n scrollBackAriaLabel: \"Scroll tabs back\",\n scrollForwardAriaLabel: \"Scroll tabs forward\",\n },\n props\n );\n const [local, rest] = splitProps(merged, [\n \"class\",\n \"children\",\n \"onChange\",\n \"value\",\n \"indicatorContent\",\n \"scrollable\",\n \"scrollButtons\",\n \"dense\",\n \"scrollBackAriaLabel\",\n \"scrollForwardAriaLabel\",\n \"aria-label\",\n \"ref\",\n ]);\n\n const [mounted, setMounted] = createSignal(false);\n const [indicatorStyle, setIndicatorStyle] = createSignal<IndicatorStyle>({ root: {} });\n // Whether tabs are hidden past the start / the end of a scrollable row. Only\n // measured in the browser, so the server markup shows neither.\n const [overflowStart, setOverflowStart] = createSignal(false);\n const [overflowEnd, setOverflowEnd] = createSignal(false);\n\n let tabsEl: HTMLDivElement \| undefined;\n let tabListEl: HTMLDivElement \| undefined;\n let tabCounter = 0;\n const contentRefs: HTMLSpanElement[] = [];\n\n const getTabsMeta = () => {\n let tabsMeta: { clientWidth: number; scrollLeft: number; left: number; right: number } \| undefined;\n if (tabsEl) {\n const rect = tabsEl.getBoundingClientRect();\n tabsMeta = { clientWidth: tabsEl.clientWidth, scrollLeft: tabsEl.scrollLeft, left: rect.left, right: rect.right };\n }\n let tabMeta: DOMRect \| null = null;\n let tabContentMeta: DOMRect \| null = null;\n if (tabsEl && tabListEl && tabListEl.children.length > 0) {\n const tab = tabListEl.children[local.value];\n tabMeta = tab ? tab.getBoundingClientRect() : null;\n if (local.indicatorContent) {\n tabContentMeta = contentRefs[local.value]?.getBoundingClientRect() ?? null;\n }\n }\n return { tabsMeta, tabMeta, tabContentMeta };\n };\n\n const updateIndicatorState = (): void => {\n const { tabsMeta, tabMeta, tabContentMeta } = getTabsMeta();\n let startValue = 0;\n if (tabMeta && tabsMeta) {\n startValue = tabMeta.left - tabsMeta.left + tabsMeta.scrollLeft;\n }\n const next: IndicatorStyle = { root: { left: startValue, width: tabMeta ? tabMeta.width : 0 } };\n if (local.indicatorContent && tabContentMeta) {\n next.content = { width: tabContentMeta.width };\n }\n const prev = indicatorStyle();\n if (prev.root.left === undefined \|\| prev.root.width === undefined) {\n setIndicatorStyle(next);\n return;\n }\n const dStart = Math.abs((prev.root.left ?? 0) - (next.root.left ?? 0));\n const dSize = Math.abs((prev.root.width ?? 0) - (next.root.width ?? 0));\n if (dStart >= 1 \|\| dSize >= 1) {\n setIndicatorStyle(next);\n }\n };\n\n const updateOverflow = (): void => {\n if (!tabsEl \|\| !local.scrollable) {\n setOverflowStart(false);\n setOverflowEnd(false);\n return;\n }\n const max = tabsEl.scrollWidth - tabsEl.clientWidth;\n setOverflowStart(tabsEl.scrollLeft > 1);\n setOverflowEnd(tabsEl.scrollLeft < max - 1);\n };\n\n const scroll = (scrollValue: number): void => {\n if (!tabsEl) return;\n animate(tabsEl, \"scrollLeft\", scrollValue, { duration: 300 });\n };\n\n const scrollByPage = (direction: -1 \| 1): void => {\n if (!tabsEl) return;\n scroll(tabsEl.scrollLeft + direction tabsEl.clientWidth * SCROLL_PAGE);\n };\n\n const scrollSelectedIntoView = (): void => {\n const { tabsMeta, tabMeta } = getTabsMeta();\n if (!tabMeta \|\| !tabsMeta) return;\n if (tabMeta.left < tabsMeta.left) {\n scroll(tabsMeta.scrollLeft + (tabMeta.left - tabsMeta.left) - VIEW_NEXT_TAB_PX);\n } else if (tabMeta.right > tabsMeta.right) {\n scroll(tabsMeta.scrollLeft + (tabMeta.right - tabsMeta.right) + VIEW_NEXT_TAB_PX);\n }\n };\n\n onMount(() => setMounted(true));\n\n // Re-measure when the active value changes (and on mount).\n createEffect(on(() => local.value, () => updateIndicatorState()));\n\n // Keep the indicator and the overflow state in sync with resizes: of the\n // window, of the row, and of each tab (a label can grow with its data).\n onMount(() => {\n const onResize = debounce(() => {\n updateIndicatorState();\n updateOverflow();\n }, 166);\n const view = tabsEl?.ownerDocument.defaultView;\n view?.addEventListener(\"resize\", onResize);\n tabsEl?.addEventListener(\"scroll\", updateOverflow, { passive: true });\n let resizeObserver: ResizeObserver \| undefined;\n if (typeof ResizeObserver !== \"undefined\" && tabListEl) {\n resizeObserver = new ResizeObserver(onResize);\n if (tabsEl) resizeObserver.observe(tabsEl);\n Array.from(tabListEl.children).forEach((child) => resizeObserver?.observe(child));\n }\n updateOverflow();\n onCleanup(() => {\n onResize.cancel();\n view?.removeEventListener(\"resize\", onResize);\n tabsEl?.removeEventListener(\"scroll\", updateOverflow);\n resizeObserver?.disconnect();\n });\n });\n\n // Scroll the selected tab into view when the indicator moves.\n createEffect(() => {\n indicatorStyle();\n scrollSelectedIntoView();\n });\n\n const contextValue: TabsContextValue = {\n value: () => local.value,\n onChange: local.onChange,\n indicatorContent: local.indicatorContent,\n registerTab: () => tabCounter++,\n setContentRef: (index, el) => {\n contentRefs[index] = el;\n },\n };\n\n const showScrollButtons = (): boolean => local.scrollable && local.scrollButtons && (overflowStart() \|\| overflowEnd());\n\n return (\n <TabsContext.Provider value={contextValue}>\n <div\n {...rest}\n class={cn(\n \"smwb-tabs\",\n {\n \"smwb-tabs--dense\": local.dense,\n \"smwb-tabs--overflow-start\": overflowStart(),\n \"smwb-tabs--overflow-end\": overflowEnd(),\n },\n local.class\n )}\n role=\"tabpanel\"\n ref={mergeRefs(local.ref)}\n >\n <Show when={showScrollButtons()}>\n <button\n type=\"button\"\n class=\"smwb-tabs__scroll-button smwb-tabs__scroll-button--start\"\n aria-label={local.scrollBackAriaLabel}\n disabled={!overflowStart()}\n onClick={() => scrollByPage(-1)}\n >\n <Icon name=\"chevron_left\" size={20} />\n </button>\n </Show>\n {/* The scroller's class is static so it is on the element from the start:\n a ref on Tabs can find the row by class right away. */}\n <div\n class=\"smwb-tabs__scroller\"\n classList={{ \"smwb-tabs__scroller--scrollable\": local.scrollable }}\n ref={(el) => (tabsEl = el)}\n >\n <div class=\"smwb-tabs__scroll-area\" ref={(el) => (tabListEl = el)} role=\"tablist\" aria-label={local[\"aria-label\"]}>\n {local.children}\n </div>\n <Show when={mounted()}>\n <span\n class=\"smwb-tabs__indicator\"\n style={{\n left: `${indicatorStyle().root.left ?? 0}px`,\n width: `${indicatorStyle().root.width ?? 0}px`,\n }}\n >\n <span\n class=\"smwb-tabs__indicator-content\"\n style={indicatorStyle().content ? { width: `${indicatorStyle().content?.width ?? 0}px` } : {}}\n />\n </span>\n </Show>\n </div>\n <Show when={showScrollButtons()}>\n <button\n type=\"button\"\n class=\"smwb-tabs__scroll-button smwb-tabs__scroll-button--end\"\n aria-label={local.scrollForwardAriaLabel}\n disabled={!overflowEnd()}\n onClick={() => scrollByPage(1)}\n >\n <Icon name=\"chevron_right\" size={20} />\n </button>\n </Show>\n </div>\n </TabsContext.Provider>\n );\n}\n\nexport { Tab };\nexport type { TabProps } from \"./tab/tab\";\nexport default Tabs;\n"],"mappings":"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","names":[],"file":"tabs.jsx"}
1	+ {"version":3,"sources":["../../../../../src/components/navigation/tabs/tabs.tsx"],"sourcesContent":["import \"@smwb/ui-styles/less/tokens.entry.less\";\nimport \"@smwb/ui-styles/less/components/tabs/tabs.entry.less\";\nimport {\n type JSX,\n type ParentProps,\n Show,\n children,\n createComputed,\n createEffect,\n createMemo,\n createSignal,\n mergeProps,\n on,\n onCleanup,\n onMount,\n splitProps,\n} from \"solid-js\";\nimport { isServer } from \"solid-js/web\";\nimport cn from \"clsx\";\nimport { debounce } from \"../../../utils/debounce\";\nimport { animate } from \"../../../utils/animate\";\nimport { TabsContext, type TabsContextValue } from \"./tabsContext\";\nimport { Tab } from \"./tab/tab\";\nimport { Icon } from \"../../base/icon\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport interface TabsProps {\n /*\n Index of the selected tab: its position in the row. Tabs count in the order they\n * render, so a tab behind a `<Show>` that is off takes no index, and tabs added,\n * removed or reordered count by their new place.\n /\n value: number;\n /* Called with the index of the clicked tab, counted as for `value`. /\n onChange: (event: MouseEvent & { currentTarget: HTMLElement; target: Element }, index: number) => void;\n /* Draw the indicator as wide as the selected tab's label rather than the whole tab. /\n indicatorContent?: boolean;\n /\n Let the tab row scroll sideways instead of clipping it. The edge beyond which\n * more tabs are hidden fades out.\n /\n scrollable?: boolean;\n /* With `scrollable`: buttons at both ends that scroll the row while it overflows. /\n scrollButtons?: boolean;\n /* Compact tabs: labels as written (no capitals, no letter spacing) and less padding. /\n dense?: boolean;\n /* Accessible label of the button that scrolls back. /\n scrollBackAriaLabel?: string;\n /* Accessible label of the button that scrolls forward. /\n scrollForwardAriaLabel?: string;\n class?: string;\n children?: JSX.Element;\n \"aria-label\"?: string;\n ref?: Ref<HTMLDivElement>;\n}\n\ninterface IndicatorStyle {\n root: { left?: number; width?: number };\n content?: { width: number };\n}\n\nconst VIEW_NEXT_TAB_PX = 40;\n/* A scroll button moves the row by this share of its visible width. /\nconst SCROLL_PAGE = 0.8;\n\n/\n The tab list's children, resolved once, with their elements reported in order\n * whenever they change. It renders inside the context provider, so the tabs it\n * creates find their Tabs.\n /\nfunction TabListItems(props: { children?: JSX.Element; onItems: (items: Element[]) => void }): JSX.Element {\n const resolved = children(() => props.children);\n if (!isServer) {\n createComputed(() => props.onItems(resolved.toArray().filter((node) => node instanceof Element)));\n }\n return <>{resolved()}</>;\n}\n\nexport function Tabs(props: ParentProps<TabsProps>): JSX.Element {\n const merged = mergeProps(\n {\n indicatorContent: false,\n scrollable: false,\n scrollButtons: false,\n dense: false,\n scrollBackAriaLabel: \"Scroll tabs back\",\n scrollForwardAriaLabel: \"Scroll tabs forward\",\n },\n props\n );\n const [local, rest] = splitProps(merged, [\n \"class\",\n \"children\",\n \"onChange\",\n \"value\",\n \"indicatorContent\",\n \"scrollable\",\n \"scrollButtons\",\n \"dense\",\n \"scrollBackAriaLabel\",\n \"scrollForwardAriaLabel\",\n \"aria-label\",\n \"ref\",\n ]);\n\n const [mounted, setMounted] = createSignal(false);\n const [indicatorStyle, setIndicatorStyle] = createSignal<IndicatorStyle>({ root: {} });\n // Whether tabs are hidden past the start / the end of a scrollable row. Only\n // measured in the browser, so the server markup shows neither.\n const [overflowStart, setOverflowStart] = createSignal(false);\n const [overflowEnd, setOverflowEnd] = createSignal(false);\n\n let tabsEl: HTMLDivElement \| undefined;\n let tabListEl: HTMLDivElement \| undefined;\n // The tab list's elements in order, known once its children have resolved in\n // the browser. Before that, and on the server, a tab's index is the order it\n // was created in, which is its order in the markup.\n const [items, setItems] = createSignal<Element[]>();\n let created = 0;\n\n const getTabsMeta = () => {\n let tabsMeta: { clientWidth: number; scrollLeft: number; left: number; right: number } \| undefined;\n if (tabsEl) {\n const rect = tabsEl.getBoundingClientRect();\n tabsMeta = { clientWidth: tabsEl.clientWidth, scrollLeft: tabsEl.scrollLeft, left: rect.left, right: rect.right };\n }\n let tabMeta: DOMRect \| null = null;\n let tabContentMeta: DOMRect \| null = null;\n if (tabsEl && tabListEl && tabListEl.children.length > 0) {\n const tab = tabListEl.children[local.value];\n tabMeta = tab ? tab.getBoundingClientRect() : null;\n if (local.indicatorContent) {\n tabContentMeta = tab?.querySelector(\".smwb-tab__content\")?.getBoundingClientRect() ?? null;\n }\n }\n return { tabsMeta, tabMeta, tabContentMeta };\n };\n\n const updateIndicatorState = (): void => {\n const { tabsMeta, tabMeta, tabContentMeta } = getTabsMeta();\n let startValue = 0;\n if (tabMeta && tabsMeta) {\n startValue = tabMeta.left - tabsMeta.left + tabsMeta.scrollLeft;\n }\n const next: IndicatorStyle = { root: { left: startValue, width: tabMeta ? tabMeta.width : 0 } };\n if (local.indicatorContent && tabContentMeta) {\n next.content = { width: tabContentMeta.width };\n }\n const prev = indicatorStyle();\n if (prev.root.left === undefined \|\| prev.root.width === undefined) {\n setIndicatorStyle(next);\n return;\n }\n const dStart = Math.abs((prev.root.left ?? 0) - (next.root.left ?? 0));\n const dSize = Math.abs((prev.root.width ?? 0) - (next.root.width ?? 0));\n if (dStart >= 1 \|\| dSize >= 1) {\n setIndicatorStyle(next);\n }\n };\n\n const updateOverflow = (): void => {\n if (!tabsEl \|\| !local.scrollable) {\n setOverflowStart(false);\n setOverflowEnd(false);\n return;\n }\n const max = tabsEl.scrollWidth - tabsEl.clientWidth;\n setOverflowStart(tabsEl.scrollLeft > 1);\n setOverflowEnd(tabsEl.scrollLeft < max - 1);\n };\n\n const scroll = (scrollValue: number): void => {\n if (!tabsEl) return;\n animate(tabsEl, \"scrollLeft\", scrollValue, { duration: 300 });\n };\n\n const scrollByPage = (direction: -1 \| 1): void => {\n if (!tabsEl) return;\n scroll(tabsEl.scrollLeft + direction tabsEl.clientWidth * SCROLL_PAGE);\n };\n\n const scrollSelectedIntoView = (): void => {\n const { tabsMeta, tabMeta } = getTabsMeta();\n if (!tabMeta \|\| !tabsMeta) return;\n if (tabMeta.left < tabsMeta.left) {\n scroll(tabsMeta.scrollLeft + (tabMeta.left - tabsMeta.left) - VIEW_NEXT_TAB_PX);\n } else if (tabMeta.right > tabsMeta.right) {\n scroll(tabsMeta.scrollLeft + (tabMeta.right - tabsMeta.right) + VIEW_NEXT_TAB_PX);\n }\n };\n\n onMount(() => setMounted(true));\n\n // Re-measure when the active value or the tabs change (and on mount).\n createEffect(on([() => local.value, items], () => updateIndicatorState()));\n\n // Keep the indicator and the overflow state in sync with resizes: of the\n // window, of the row, and of each tab (a label can grow with its data).\n onMount(() => {\n const onResize = debounce(() => {\n updateIndicatorState();\n updateOverflow();\n }, 166);\n const view = tabsEl?.ownerDocument.defaultView;\n view?.addEventListener(\"resize\", onResize);\n tabsEl?.addEventListener(\"scroll\", updateOverflow, { passive: true });\n let resizeObserver: ResizeObserver \| undefined;\n if (typeof ResizeObserver !== \"undefined\" && tabListEl) {\n resizeObserver = new ResizeObserver(onResize);\n if (tabsEl) resizeObserver.observe(tabsEl);\n Array.from(tabListEl.children).forEach((child) => resizeObserver?.observe(child));\n }\n updateOverflow();\n onCleanup(() => {\n onResize.cancel();\n view?.removeEventListener(\"resize\", onResize);\n tabsEl?.removeEventListener(\"scroll\", updateOverflow);\n resizeObserver?.disconnect();\n });\n });\n\n // Scroll the selected tab into view when the indicator moves.\n createEffect(() => {\n indicatorStyle();\n scrollSelectedIntoView();\n });\n\n const contextValue: TabsContextValue = {\n value: () => local.value,\n onChange: local.onChange,\n registerTab: (element) => {\n const order = created++;\n return createMemo(() => {\n const list = items();\n if (!list) return order;\n const el = element();\n return el ? list.findIndex((item) => item.contains(el)) : -1;\n });\n },\n };\n\n const showScrollButtons = (): boolean => local.scrollable && local.scrollButtons && (overflowStart() \|\| overflowEnd());\n\n return (\n <TabsContext.Provider value={contextValue}>\n <div\n {...rest}\n class={cn(\n \"smwb-tabs\",\n {\n \"smwb-tabs--dense\": local.dense,\n \"smwb-tabs--overflow-start\": overflowStart(),\n \"smwb-tabs--overflow-end\": overflowEnd(),\n },\n local.class\n )}\n role=\"tabpanel\"\n ref={mergeRefs(local.ref)}\n >\n <Show when={showScrollButtons()}>\n <button\n type=\"button\"\n class=\"smwb-tabs__scroll-button smwb-tabs__scroll-button--start\"\n aria-label={local.scrollBackAriaLabel}\n disabled={!overflowStart()}\n onClick={() => scrollByPage(-1)}\n >\n <Icon name=\"chevron_left\" size={20} />\n </button>\n </Show>\n {/* The scroller's class is static so it is on the element from the start:\n a ref on Tabs can find the row by class right away. */}\n <div\n class=\"smwb-tabs__scroller\"\n classList={{ \"smwb-tabs__scroller--scrollable\": local.scrollable }}\n ref={(el) => (tabsEl = el)}\n >\n <div class=\"smwb-tabs__scroll-area\" ref={(el) => (tabListEl = el)} role=\"tablist\" aria-label={local[\"aria-label\"]}>\n <TabListItems onItems={setItems}>{local.children}</TabListItems>\n </div>\n <Show when={mounted()}>\n <span\n class=\"smwb-tabs__indicator\"\n style={{\n left: `${indicatorStyle().root.left ?? 0}px`,\n width: `${indicatorStyle().root.width ?? 0}px`,\n }}\n >\n <span\n class=\"smwb-tabs__indicator-content\"\n style={indicatorStyle().content ? { width: `${indicatorStyle().content?.width ?? 0}px` } : {}}\n />\n </span>\n </Show>\n </div>\n <Show when={showScrollButtons()}>\n <button\n type=\"button\"\n class=\"smwb-tabs__scroll-button smwb-tabs__scroll-button--end\"\n aria-label={local.scrollForwardAriaLabel}\n disabled={!overflowEnd()}\n onClick={() => scrollByPage(1)}\n >\n <Icon name=\"chevron_right\" size={20} />\n </button>\n </Show>\n </div>\n </TabsContext.Provider>\n );\n}\n\nexport { Tab };\nexport type { TabProps } from \"./tab/tab\";\nexport default Tabs;\n"],"mappings":"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","names":[],"file":"tabs.jsx"}

package/dist/source/components/navigation/tabs/tabsContext.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/components/navigation/tabs/tabsContext.ts"],
-  "sourcesContent": ["import { type Accessor, createContext, useContext } from \"solid-js\";\n\nexport interface TabsContextValue {\n  value: Accessor<number>;\n  onChange: (event: MouseEvent & { currentTarget: HTMLElement; target: Element }, index: number) => void;\n  indicatorContent: boolean;\n  /** Each Tab registers on setup to learn its index (in DOM order). */\n  registerTab: () => number;\n  setContentRef: (index: number, el: HTMLSpanElement) => void;\n}\n\nexport const TabsContext = createContext<TabsContextValue>();\n\nexport const useTabsContext = (): TabsContextValue | undefined => useContext(TabsContext);\n"],
-  "mappings": "AAAA,SAAwB,eAAe,kBAAkB;AAWlD,MAAM,cAAc,cAAgC;AAEpD,MAAM,iBAAiB,MAAoC,WAAW,WAAW;",
+  "sourcesContent": ["import { type Accessor, createContext, useContext } from \"solid-js\";\n\nexport interface TabsContextValue {\n  value: Accessor<number>;\n  onChange: (event: MouseEvent & { currentTarget: HTMLElement; target: Element }, index: number) => void;\n  /**\n   * Each Tab registers on setup with its root element (set once it renders) and\n   * gets back its index: its position in the tab list, which follows the tab when\n   * tabs are added, removed or reordered.\n   */\n  registerTab: (element: Accessor<Element | undefined>) => Accessor<number>;\n}\n\nexport const TabsContext = createContext<TabsContextValue>();\n\nexport const useTabsContext = (): TabsContextValue | undefined => useContext(TabsContext);\n"],
+  "mappings": "AAAA,SAAwB,eAAe,kBAAkB;AAalD,MAAM,cAAc,cAAgC;AAEpD,MAAM,iBAAiB,MAAoC,WAAW,WAAW;",
   "names": []
 }

package/dist/source/connects/rt/table/table.jsx CHANGED Viewed

@@ -99,15 +99,19 @@ function Table(props) {
     return settings ? { paginationSettings: settings } : {};
   });
   const align = () => local.cellAlign ?? "left";
+  const headerActions = (header) => {
+    const actions = header.isPlaceholder ? void 0 : header.column.columnDef.meta?.headerActions;
+    return actions ? flexRender(actions, header.getContext()) : void 0;
+  };
   const cellLabel = (column) => {
     const label = column.meta?.label ?? (typeof column.header === "string" ? column.header : void 0);
-    return label ? { label } : {};
+    return { label: label || false };
   };
   return <SmwbTable
     {...rest}
     {...paginationProp()}
     isLoading={local.isLoading ?? false}
-    hovered={!!local.onBodyRowClick}
+    hovered={rest.hovered ?? !!local.onBodyRowClick}
   >
       <TableHead>
         <For each={table.getHeaderGroups()}>
@@ -125,6 +129,7 @@ function Table(props) {
       onClick={() => {
         local.onHeadCellClick?.(header.column.columnDef);
       }}
+      actions={headerActions(header)}
       {...header.getSize() ? { style: { width: `${header.getSize()}px` } } : {}}
     >
                       <Show when={!header.isPlaceholder}>

package/dist/source/connects/rt/table/table.jsx.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../src/connects/rt/table/table.tsx"],"sourcesContent":["import { For, Show, createMemo, createSignal, splitProps, type JSX } from \"solid-js\";\nimport {\n createSolidTable,\n flexRender,\n getCoreRowModel,\n getExpandedRowModel,\n getPaginationRowModel,\n getSortedRowModel,\n type ColumnDef,\n type Row,\n type RowData,\n type SortingState,\n type TableOptions,\n} from \"@tanstack/solid-table\";\n\nimport {\n Table as SmwbTable,\n TableBody,\n TableCell,\n TableHead,\n TableHeadCell,\n TableRow,\n type SortDirection,\n type TableProps as SmwbTableProps,\n type TablePaginationProps,\n} from \"../../../components/dataDisplay/table\";\nimport { ProgressIndicator } from \"../../../components/feedBack/progressIndicator\";\nimport { Message } from \"../../../components/feedBack/message\";\n\ndeclare module \"@tanstack/table-core\" {\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n interface ColumnMeta<TData extends RowData, TValue> {\n /** Extra attributes for every body cell of the column. /\n cellProps?: JSX.ThHTMLAttributes<HTMLTableCellElement>;\n /* The column's name on each cell when rows stack as cards (`stackBelow`); a string `header` is used by default. /\n label?: string;\n }\n}\n\nexport interface RtTableProps<TData extends RowData, TValue = unknown> extends SmwbTableProps {\n data: TData[];\n columns: ColumnDef<TData, TValue>[];\n /* Enables the sort affordance in head cells and the sorted row model. /\n sortable?: boolean;\n /* Initial sorting, e.g. `[{ id: \"name\", desc: false }]`. /\n defaultSorting?: SortingState;\n onSortingChange?: (sorting: SortingState) => void;\n withPagination?: boolean;\n /* Rows come from the outside page by page; the total is unknown. /\n isInfinite?: boolean;\n limit?: number;\n limitOptions?: number[];\n onNextPage?: () => void;\n onPrevPage?: () => void;\n expandable?: boolean;\n getRowCanExpand?: (row: Row<TData>) => boolean;\n renderSubComponent?: (props: { row: Row<TData> }) => JSX.Element;\n cellAlign?: \"left\" \| \"right\" \| \"center\";\n error?: string;\n onHeadCellClick?: (column: ColumnDef<TData, TValue>) => void;\n onBodyRowClick?: (row: Row<TData>, event: MouseEvent) => void;\n}\n\n/\n TanStack Table bound to the smwb table components.\n \n The connector owns only what the two sides must agree on — row models, the\n * sort affordance in the head cell, the pagination footer, and the loading /\n * error / empty rows. Everything else stays TanStack's: columns are plain\n * `ColumnDef`s and cells are rendered through `flexRender`, so any column\n * definition written against the React connector works here unchanged.\n \n `@tanstack/solid-table` is an optional peer: it ships with the connector's\n * subpath only, and a consumer that never imports the subpath never installs it.\n */\nexport function Table<TData extends RowData, TValue = unknown>(\n props: RtTableProps<TData, TValue>\n): JSX.Element {\n const [local, rest] = splitProps(props, [\n \"data\",\n \"columns\",\n \"sortable\",\n \"defaultSorting\",\n \"onSortingChange\",\n \"withPagination\",\n \"isInfinite\",\n \"limit\",\n \"limitOptions\",\n \"onNextPage\",\n \"onPrevPage\",\n \"expandable\",\n \"getRowCanExpand\",\n \"renderSubComponent\",\n \"cellAlign\",\n \"error\",\n \"onHeadCellClick\",\n \"onBodyRowClick\",\n \"isLoading\",\n ]);\n\n const limit = (): number => local.limit ?? 5;\n const [sorting, setSorting] = createSignal<SortingState>(local.defaultSorting ?? []);\n\n // Options are a getter object: Solid has no render pass to rebuild them on,\n // so the table reads current data, columns and sorting on every access.\n const table = createSolidTable({\n get data() {\n return local.data;\n },\n get columns() {\n return local.columns;\n },\n state: {\n get sorting() {\n return sorting();\n },\n },\n initialState: { pagination: { pageIndex: 0, pageSize: limit() } },\n manualPagination: local.isInfinite,\n getCoreRowModel: getCoreRowModel(),\n onSortingChange: (updater) => {\n const next = typeof updater === \"function\" ? updater(sorting()) : updater;\n setSorting(next);\n local.onSortingChange?.(next);\n },\n get getSortedRowModel() {\n return local.sortable ? getSortedRowModel() : undefined;\n },\n get getPaginationRowModel() {\n return local.withPagination ? getPaginationRowModel() : undefined;\n },\n get getExpandedRowModel() {\n return local.expandable ? getExpandedRowModel() : undefined;\n },\n get getRowCanExpand() {\n return local.expandable ? local.getRowCanExpand : undefined;\n },\n } as TableOptions<TData>);\n\n const pagination = createMemo<TablePaginationProps \| undefined>(() => {\n if (!local.withPagination) return undefined;\n const state = table.getState().pagination;\n const base = {\n limit: state.pageSize,\n page: state.pageIndex + 1,\n limitOptions: local.limitOptions ?? [5, 10, 15],\n onNext: () => {\n table.nextPage();\n local.onNextPage?.();\n },\n onPrev: () => {\n table.previousPage();\n local.onPrevPage?.();\n },\n onLimitChange: (value: number) => table.setPageSize(value),\n };\n return local.isInfinite\n ? { ...base, hasNextPage: local.data.length >= state.pageSize }\n : { ...base, totalCount: table.getFilteredRowModel().rows.length };\n });\n\n const columnCount = (): number => table.getVisibleFlatColumns().length \|\| 1;\n\n // Spread instead of a prop: with exactOptionalPropertyTypes an explicit\n // `undefined` is not the same as an absent prop, and the footer is absent\n // whenever pagination is off.\n const paginationProp = createMemo(() => {\n const settings = pagination();\n return settings ? { paginationSettings: settings } : {};\n });\n\n const align = (): \"left\" \| \"right\" \| \"center\" => local.cellAlign ?? \"left\";\n // A body cell's label for the stacked layout: the column's meta.label, or its\n // header when that is plain text.\n const cellLabel = (column: ColumnDef<TData, TValue>): { label?: string } => {\n const label = column.meta?.label ?? (typeof column.header === \"string\" ? column.header : undefined);\n return label ? { label } : {};\n };\n\n return (\n <SmwbTable\n {...rest}\n {...paginationProp()}\n isLoading={local.isLoading ?? false}\n hovered={!!local.onBodyRowClick}\n >\n <TableHead>\n <For each={table.getHeaderGroups()}>\n {(headerGroup) => (\n <TableRow>\n <For each={headerGroup.headers}>\n {(header) => {\n const canSort = (): boolean => !!local.sortable && header.column.getCanSort();\n return (\n <TableHeadCell\n cellAlign={align()}\n sortable={canSort()}\n sortDirection={(header.column.getIsSorted() \|\| false) as SortDirection}\n onSort={() => {\n if (canSort()) header.column.toggleSorting();\n }}\n onClick={() => {\n local.onHeadCellClick?.(header.column.columnDef);\n }}\n {...(header.getSize() ? { style: { width: `${header.getSize()}px` } } : {})}\n >\n <Show when={!header.isPlaceholder}>\n {flexRender(header.column.columnDef.header, header.getContext())}\n </Show>\n </TableHeadCell>\n );\n }}\n </For>\n </TableRow>\n )}\n </For>\n </TableHead>\n\n <TableBody>\n <Show\n when={!local.isLoading}\n fallback={\n <TableRow class=\"smwb-table__loader__row\">\n <TableCell class=\"smwb-table__loader\" colSpan={columnCount()}>\n <ProgressIndicator variant=\"circular\" type=\"indeterminate\" />\n </TableCell>\n </TableRow>\n }\n >\n <Show\n when={!local.error}\n fallback={\n <TableRow class=\"smwb-table__loader__row\">\n <TableCell class=\"smwb-table__loader\" colSpan={columnCount()}>\n <Message variant=\"filled\" type=\"error\">\n {local.error}\n </Message>\n </TableCell>\n </TableRow>\n }\n >\n <For each={table.getRowModel().rows}>\n {(row) => (\n <>\n <TableRow onClick={(event: MouseEvent) => local.onBodyRowClick?.(row, event)}>\n <For each={row.getVisibleCells()}>\n {(cell) => (\n <TableCell\n cellAlign={align()}\n {...cellLabel(cell.column.columnDef as ColumnDef<TData, TValue>)}\n {...cell.column.columnDef.meta?.cellProps}\n >\n {flexRender(cell.column.columnDef.cell, cell.getContext())}\n </TableCell>\n )}\n </For>\n </TableRow>\n <Show when={row.getIsExpanded() && local.renderSubComponent}>\n <TableRow>\n <TableCell colSpan={row.getVisibleCells().length}>\n {local.renderSubComponent?.({ row })}\n </TableCell>\n </TableRow>\n </Show>\n </>\n )}\n </For>\n </Show>\n </Show>\n </TableBody>\n </SmwbTable>\n );\n}\n\nexport default Table;\n"],"mappings":"AAAA,SAAS,KAAK,MAAM,YAAY,cAAc,kBAA4B;AAC1E;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAMK;AAEP;AAAA,EACE,SAAS;AAAA,EACT;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAIK;AACP,SAAS,yBAAyB;AAClC,SAAS,eAAe;AAgDjB,SAAS,MACd,OACa;AACb,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,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,QAAQ,MAAc,MAAM,SAAS;AAC3C,QAAM,CAAC,SAAS,UAAU,IAAI,aAA2B,MAAM,kBAAkB,CAAC,CAAC;AAInF,QAAM,QAAQ,iBAAiB;AAAA,IAC7B,IAAI,OAAO;AACT,aAAO,MAAM;AAAA,IACf;AAAA,IACA,IAAI,UAAU;AACZ,aAAO,MAAM;AAAA,IACf;AAAA,IACA,OAAO;AAAA,MACL,IAAI,UAAU;AACZ,eAAO,QAAQ;AAAA,MACjB;AAAA,IACF;AAAA,IACA,cAAc,EAAE,YAAY,EAAE,WAAW,GAAG,UAAU,MAAM,EAAE,EAAE;AAAA,IAChE,kBAAkB,MAAM;AAAA,IACxB,iBAAiB,gBAAgB;AAAA,IACjC,iBAAiB,CAAC,YAAY;AAC5B,YAAM,OAAO,OAAO,YAAY,aAAa,QAAQ,QAAQ,CAAC,IAAI;AAClE,iBAAW,IAAI;AACf,YAAM,kBAAkB,IAAI;AAAA,IAC9B;AAAA,IACA,IAAI,oBAAoB;AACtB,aAAO,MAAM,WAAW,kBAAkB,IAAI;AAAA,IAChD;AAAA,IACA,IAAI,wBAAwB;AAC1B,aAAO,MAAM,iBAAiB,sBAAsB,IAAI;AAAA,IAC1D;AAAA,IACA,IAAI,sBAAsB;AACxB,aAAO,MAAM,aAAa,oBAAoB,IAAI;AAAA,IACpD;AAAA,IACA,IAAI,kBAAkB;AACpB,aAAO,MAAM,aAAa,MAAM,kBAAkB;AAAA,IACpD;AAAA,EACF,CAAwB;AAExB,QAAM,aAAa,WAA6C,MAAM;AACpE,QAAI,CAAC,MAAM,eAAgB,QAAO;AAClC,UAAM,QAAQ,MAAM,SAAS,EAAE;AAC/B,UAAM,OAAO;AAAA,MACX,OAAO,MAAM;AAAA,MACb,MAAM,MAAM,YAAY;AAAA,MACxB,cAAc,MAAM,gBAAgB,CAAC,GAAG,IAAI,EAAE;AAAA,MAC9C,QAAQ,MAAM;AACZ,cAAM,SAAS;AACf,cAAM,aAAa;AAAA,MACrB;AAAA,MACA,QAAQ,MAAM;AACZ,cAAM,aAAa;AACnB,cAAM,aAAa;AAAA,MACrB;AAAA,MACA,eAAe,CAAC,UAAkB,MAAM,YAAY,KAAK;AAAA,IAC3D;AACA,WAAO,MAAM,aACT,EAAE,GAAG,MAAM,aAAa,MAAM,KAAK,UAAU,MAAM,SAAS,IAC5D,EAAE,GAAG,MAAM,YAAY,MAAM,oBAAoB,EAAE,KAAK,OAAO;AAAA,EACrE,CAAC;AAED,QAAM,cAAc,MAAc,MAAM,sBAAsB,EAAE,UAAU;AAK1E,QAAM,iBAAiB,WAAW,MAAM;AACtC,UAAM,WAAW,WAAW;AAC5B,WAAO,WAAW,EAAE,oBAAoB,SAAS,IAAI,CAAC;AAAA,EACxD,CAAC;AAED,QAAM,QAAQ,MAAmC,MAAM,aAAa;AAGpE,QAAM,YAAY,CAAC,WAAyD;AAC1E,UAAM,QAAQ,OAAO,MAAM,UAAU,OAAO,OAAO,WAAW,WAAW,OAAO,SAAS;AACzF,WAAO,QAAQ,EAAE,MAAM,IAAI,CAAC;AAAA,EAC9B;AAEA,SACE,CAAC;AAAA,QACK;AAAA,QACA,eAAe;AAAA,IACnB,WAAW,MAAM,aAAa;AAAA,IAC9B,SAAS,CAAC,CAAC,MAAM;AAAA,GAClB;AAAA,MACC,CAAC,UAAU;AAAA,QACT,CAAC,IAAI,MAAM,MAAM,gBAAgB,GAAG;AAAA,WACjC,CAAC,gBACA,CAAC,SAAS;AAAA,cACR,CAAC,IAAI,MAAM,YAAY,SAAS;AAAA,iBAC7B,CAAC,WAAW;AACX,UAAM,UAAU,MAAe,CAAC,CAAC,MAAM,YAAY,OAAO,OAAO,WAAW;AAC5E,WACE,CAAC;AAAA,MACC,WAAW,MAAM;AAAA,MACjB,UAAU,QAAQ;AAAA,MAClB,eAAgB,OAAO,OAAO,YAAY,KAAK;AAAA,MAC/C,QAAQ,MAAM;AACZ,YAAI,QAAQ,EAAG,QAAO,OAAO,cAAc;AAAA,MAC7C;AAAA,MACA,SAAS,MAAM;AACb,cAAM,kBAAkB,OAAO,OAAO,SAAS;AAAA,MACjD;AAAA,UACK,OAAO,QAAQ,IAAI,EAAE,OAAO,EAAE,OAAO,GAAG,OAAO,QAAQ,CAAC,KAAK,EAAE,IAAI,CAAC;AAAA,KAC1E;AAAA,sBACC,CAAC,KAAK,MAAM,CAAC,OAAO,eAAe;AAAA,yBAChC,WAAW,OAAO,OAAO,UAAU,QAAQ,OAAO,WAAW,CAAC,EAAE;AAAA,sBACnE,EAFC,KAEM;AAAA,oBACT,EAfC;AAAA,EAiBL,EAAE;AAAA,cACJ,EAtBC,IAsBK;AAAA,YACR,EAxBC,UAyBD;AAAA,QACJ,EA5BC,IA4BK;AAAA,MACR,EA9BC,UA8BW;AAAA;AAAA,MAEZ,CAAC,UAAU;AAAA,QACT,CAAC;AAAA,IACC,MAAM,CAAC,MAAM;AAAA,IACb,UACE,CAAC,SAAS,MAAM,0BAA0B;AAAA,cACxC,CAAC,UAAU,MAAM,qBAAqB,SAAS,YAAY,GAAG;AAAA,gBAC5D,CAAC,kBAAkB,QAAQ,WAAW,KAAK,gBAAgB,EAAE;AAAA,cAC/D,EAFC,UAEW;AAAA,YACd,EAJC;AAAA,GAMJ;AAAA,UACC,CAAC;AAAA,IACC,MAAM,CAAC,MAAM;AAAA,IACb,UACE,CAAC,SAAS,MAAM,0BAA0B;AAAA,gBACxC,CAAC,UAAU,MAAM,qBAAqB,SAAS,YAAY,GAAG;AAAA,kBAC5D,CAAC,QAAQ,QAAQ,SAAS,KAAK,QAAQ;AAAA,qBACpC,MAAM,MAAM;AAAA,kBACf,EAFC,QAES;AAAA,gBACZ,EAJC,UAIW;AAAA,cACd,EANC;AAAA,GAQJ;AAAA,YACC,CAAC,IAAI,MAAM,MAAM,YAAY,EAAE,MAAM;AAAA,eAClC,CAAC,QACA,EAAE;AAAA,kBACA,CAAC,SAAS,SAAS,CAAC,UAAsB,MAAM,iBAAiB,KAAK,KAAK,GAAG;AAAA,oBAC5E,CAAC,IAAI,MAAM,IAAI,gBAAgB,GAAG;AAAA,uBAC/B,CAAC,SACA,CAAC;AAAA,IACC,WAAW,MAAM;AAAA,QACb,UAAU,KAAK,OAAO,SAAqC;AAAA,QAC3D,KAAK,OAAO,UAAU,MAAM;AAAA,GACjC;AAAA,2BACE,WAAW,KAAK,OAAO,UAAU,MAAM,KAAK,WAAW,CAAC,EAAE;AAAA,wBAC7D,EANC,WAOD;AAAA,oBACJ,EAVC,IAUK;AAAA,kBACR,EAZC,SAYU;AAAA,kBACX,CAAC,KAAK,MAAM,IAAI,cAAc,KAAK,MAAM,oBAAoB;AAAA,oBAC3D,CAAC,SAAS;AAAA,sBACR,CAAC,UAAU,SAAS,IAAI,gBAAgB,EAAE,QAAQ;AAAA,yBAC/C,MAAM,qBAAqB,EAAE,IAAI,CAAC,EAAE;AAAA,sBACvC,EAFC,UAEW;AAAA,oBACd,EAJC,SAIU;AAAA,kBACb,EANC,KAMM;AAAA,gBACT,IACA;AAAA,YACJ,EAzBC,IAyBK;AAAA,UACR,EAtCC,KAsCM;AAAA,QACT,EAjDC,KAiDM;AAAA,MACT,EAnDC,UAmDW;AAAA,IACd,EA1FC;AA4FL;AAEA,IAAO,gBAAQ;","names":[],"file":"table.jsx"}
1	+ {"version":3,"sources":["../../../../../src/connects/rt/table/table.tsx"],"sourcesContent":["import { For, Show, createMemo, createSignal, splitProps, type JSX } from \"solid-js\";\nimport {\n createSolidTable,\n flexRender,\n getCoreRowModel,\n getExpandedRowModel,\n getPaginationRowModel,\n getSortedRowModel,\n type ColumnDef,\n type Header,\n type HeaderContext,\n type Row,\n type RowData,\n type SortingState,\n type TableOptions,\n} from \"@tanstack/solid-table\";\n\nimport {\n Table as SmwbTable,\n TableBody,\n TableCell,\n TableHead,\n TableHeadCell,\n TableRow,\n type SortDirection,\n type TableProps as SmwbTableProps,\n type TablePaginationProps,\n} from \"../../../components/dataDisplay/table\";\nimport { ProgressIndicator } from \"../../../components/feedBack/progressIndicator\";\nimport { Message } from \"../../../components/feedBack/message\";\n\ndeclare module \"@tanstack/table-core\" {\n interface ColumnMeta<TData extends RowData, TValue> {\n /** Extra attributes for every body cell of the column. /\n cellProps?: JSX.ThHTMLAttributes<HTMLTableCellElement>;\n /* The column's name on each cell when rows stack as cards (`stackBelow`); a string `header` is used by default. /\n label?: string;\n /\n The column's controls in its head cell, such as a filter field or a menu\n * button. They go to the cell's `actions`, after the sort control and\n * outside it, so they stay out of its accessible name, while `header` is\n * drawn inside it. Whatever `flexRender` takes: a component that gets the\n * header context (`{ column, header, table }`), as `header` does, or\n * markup. Markup is made once, with the column definitions, so it is drawn\n * in one head cell at a time; a component draws the controls anew in each.\n /\n headerActions?: JSX.Element \| ((context: HeaderContext<TData, TValue>) => JSX.Element);\n }\n}\n\nexport interface RtTableProps<TData extends RowData, TValue = unknown> extends SmwbTableProps {\n data: TData[];\n /\n TanStack column definitions. A column's `meta` may add `headerActions`\n * (controls drawn beside the sort control in its head cell), `label` (its\n * name on stacked rows) and `cellProps` (attributes of its body cells).\n /\n columns: ColumnDef<TData, TValue>[];\n /* Enables the sort affordance in head cells and the sorted row model. /\n sortable?: boolean;\n /* Initial sorting, e.g. `[{ id: \"name\", desc: false }]`. /\n defaultSorting?: SortingState;\n onSortingChange?: (sorting: SortingState) => void;\n withPagination?: boolean;\n /* Rows come from the outside page by page; the total is unknown. /\n isInfinite?: boolean;\n limit?: number;\n limitOptions?: number[];\n onNextPage?: () => void;\n onPrevPage?: () => void;\n expandable?: boolean;\n getRowCanExpand?: (row: Row<TData>) => boolean;\n renderSubComponent?: (props: { row: Row<TData> }) => JSX.Element;\n cellAlign?: \"left\" \| \"right\" \| \"center\";\n error?: string;\n onHeadCellClick?: (column: ColumnDef<TData, TValue>) => void;\n onBodyRowClick?: (row: Row<TData>, event: MouseEvent) => void;\n}\n\n/\n TanStack Table bound to the smwb table components.\n \n The connector owns only what the two sides must agree on — row models, the\n * sort affordance in the head cell, the pagination footer, and the loading /\n * error / empty rows. Everything else stays TanStack's: columns are plain\n * `ColumnDef`s and cells are rendered through `flexRender`, so any column\n * definition written against the React connector works here unchanged.\n \n `@tanstack/solid-table` is an optional peer: it ships with the connector's\n * subpath only, and a consumer that never imports the subpath never installs it.\n */\nexport function Table<TData extends RowData, TValue = unknown>(\n props: RtTableProps<TData, TValue>\n): JSX.Element {\n const [local, rest] = splitProps(props, [\n \"data\",\n \"columns\",\n \"sortable\",\n \"defaultSorting\",\n \"onSortingChange\",\n \"withPagination\",\n \"isInfinite\",\n \"limit\",\n \"limitOptions\",\n \"onNextPage\",\n \"onPrevPage\",\n \"expandable\",\n \"getRowCanExpand\",\n \"renderSubComponent\",\n \"cellAlign\",\n \"error\",\n \"onHeadCellClick\",\n \"onBodyRowClick\",\n \"isLoading\",\n ]);\n\n const limit = (): number => local.limit ?? 5;\n const [sorting, setSorting] = createSignal<SortingState>(local.defaultSorting ?? []);\n\n // Options are a getter object: Solid has no render pass to rebuild them on,\n // so the table reads current data, columns and sorting on every access.\n const table = createSolidTable({\n get data() {\n return local.data;\n },\n get columns() {\n return local.columns;\n },\n state: {\n get sorting() {\n return sorting();\n },\n },\n initialState: { pagination: { pageIndex: 0, pageSize: limit() } },\n manualPagination: local.isInfinite,\n getCoreRowModel: getCoreRowModel(),\n onSortingChange: (updater) => {\n const next = typeof updater === \"function\" ? updater(sorting()) : updater;\n setSorting(next);\n local.onSortingChange?.(next);\n },\n get getSortedRowModel() {\n return local.sortable ? getSortedRowModel() : undefined;\n },\n get getPaginationRowModel() {\n return local.withPagination ? getPaginationRowModel() : undefined;\n },\n get getExpandedRowModel() {\n return local.expandable ? getExpandedRowModel() : undefined;\n },\n get getRowCanExpand() {\n return local.expandable ? local.getRowCanExpand : undefined;\n },\n } as TableOptions<TData>);\n\n const pagination = createMemo<TablePaginationProps \| undefined>(() => {\n if (!local.withPagination) return undefined;\n const state = table.getState().pagination;\n const base = {\n limit: state.pageSize,\n page: state.pageIndex + 1,\n limitOptions: local.limitOptions ?? [5, 10, 15],\n onNext: () => {\n table.nextPage();\n local.onNextPage?.();\n },\n onPrev: () => {\n table.previousPage();\n local.onPrevPage?.();\n },\n onLimitChange: (value: number) => table.setPageSize(value),\n };\n return local.isInfinite\n ? { ...base, hasNextPage: local.data.length >= state.pageSize }\n : { ...base, totalCount: table.getFilteredRowModel().rows.length };\n });\n\n const columnCount = (): number => table.getVisibleFlatColumns().length \|\| 1;\n\n // Spread instead of a prop: with exactOptionalPropertyTypes an explicit\n // `undefined` is not the same as an absent prop, and the footer is absent\n // whenever pagination is off.\n const paginationProp = createMemo(() => {\n const settings = pagination();\n return settings ? { paginationSettings: settings } : {};\n });\n\n const align = (): \"left\" \| \"right\" \| \"center\" => local.cellAlign ?? \"left\";\n // A column's controls for its head cell, drawn beside the sort control.\n const headerActions = (header: Header<TData, unknown>): JSX.Element => {\n const actions = header.isPlaceholder ? undefined : header.column.columnDef.meta?.headerActions;\n return actions ? flexRender(actions, header.getContext()) : undefined;\n };\n // A body cell's label for the stacked layout: the column's meta.label, or its\n // header when that is plain text. Without either the cell stays unlabelled: it\n // takes no label from the head cell's content, which may be a control.\n const cellLabel = (column: ColumnDef<TData, TValue>): { label: string \| false } => {\n const label = column.meta?.label ?? (typeof column.header === \"string\" ? column.header : undefined);\n return { label: label \|\| false };\n };\n\n return (\n <SmwbTable\n {...rest}\n {...paginationProp()}\n isLoading={local.isLoading ?? false}\n // `hovered` is a default: the caller's own wins, and an explicit\n // undefined keeps it.\n hovered={rest.hovered ?? !!local.onBodyRowClick}\n >\n <TableHead>\n <For each={table.getHeaderGroups()}>\n {(headerGroup) => (\n <TableRow>\n <For each={headerGroup.headers}>\n {(header) => {\n const canSort = (): boolean => !!local.sortable && header.column.getCanSort();\n return (\n <TableHeadCell\n cellAlign={align()}\n sortable={canSort()}\n sortDirection={(header.column.getIsSorted() \|\| false) as SortDirection}\n onSort={() => {\n if (canSort()) header.column.toggleSorting();\n }}\n onClick={() => {\n local.onHeadCellClick?.(header.column.columnDef);\n }}\n actions={headerActions(header)}\n {...(header.getSize() ? { style: { width: `${header.getSize()}px` } } : {})}\n >\n <Show when={!header.isPlaceholder}>\n {flexRender(header.column.columnDef.header, header.getContext())}\n </Show>\n </TableHeadCell>\n );\n }}\n </For>\n </TableRow>\n )}\n </For>\n </TableHead>\n\n <TableBody>\n <Show\n when={!local.isLoading}\n fallback={\n <TableRow class=\"smwb-table__loader__row\">\n <TableCell class=\"smwb-table__loader\" colSpan={columnCount()}>\n <ProgressIndicator variant=\"circular\" type=\"indeterminate\" />\n </TableCell>\n </TableRow>\n }\n >\n <Show\n when={!local.error}\n fallback={\n <TableRow class=\"smwb-table__loader__row\">\n <TableCell class=\"smwb-table__loader\" colSpan={columnCount()}>\n <Message variant=\"filled\" type=\"error\">\n {local.error}\n </Message>\n </TableCell>\n </TableRow>\n }\n >\n <For each={table.getRowModel().rows}>\n {(row) => (\n <>\n <TableRow onClick={(event: MouseEvent) => local.onBodyRowClick?.(row, event)}>\n <For each={row.getVisibleCells()}>\n {(cell) => (\n <TableCell\n cellAlign={align()}\n {...cellLabel(cell.column.columnDef as ColumnDef<TData, TValue>)}\n {...cell.column.columnDef.meta?.cellProps}\n >\n {flexRender(cell.column.columnDef.cell, cell.getContext())}\n </TableCell>\n )}\n </For>\n </TableRow>\n <Show when={row.getIsExpanded() && local.renderSubComponent}>\n <TableRow>\n <TableCell colSpan={row.getVisibleCells().length}>\n {local.renderSubComponent?.({ row })}\n </TableCell>\n </TableRow>\n </Show>\n </>\n )}\n </For>\n </Show>\n </Show>\n </TableBody>\n </SmwbTable>\n );\n}\n\nexport default Table;\n"],"mappings":"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","names":[],"file":"table.jsx"}

package/dist/source/index.js CHANGED Viewed

@@ -57,6 +57,7 @@ import { Timeline, TimelineGroup, TimelineItem } from "./components/dataDisplay/
 import { Carousel } from "./components/dataDisplay/carousel";
 import { ImagesList, ImagesListItem, ImagesListItemModal } from "./components/dataDisplay/imagesList";
 import { Kanban, KanbanColumn, KanbanCard } from "./components/dataDisplay/kanban";
+import { DagView, dagLayout } from "./components/dataDisplay/dagView";
 import {
   Chat,
   ChatLayout,
@@ -229,6 +230,7 @@ export {
   CountPreview,
   DEFAULT_METER_THRESHOLDS,
   DEFAULT_TIME_FORMAT,
+  DagView,
   DataPickerDays,
   DataPickerHeader,
   DataPickerInput,
@@ -353,6 +355,7 @@ export {
   createTheme,
   createTimeInput,
   createVirtualList,
+  dagLayout,
   formatChatTimestamp,
   formatDateTimeByPattern,
   getChatLayoutActions,

package/dist/source/index.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/index.ts"],
-  "sourcesContent": ["// Public entry point for @smwb/ui-solid.\n// Exports are added as components are ported (see src/components/**).\n\n// primitives\nexport { mergeRefs } from \"./primitives/mergeRefs\";\nexport type { Ref, RefCallback } from \"./primitives/mergeRefs\";\nexport { createId } from \"./primitives/createId\";\nexport { createControllableState } from \"./primitives/createControllableState\";\nexport type { CreateControllableStateParams } from \"./primitives/createControllableState\";\nexport { createTheme, Theme } from \"./primitives/createTheme\";\nexport { createFloating } from \"./primitives/createFloating\";\nexport type { CreateFloatingOptions, FloatingState } from \"./primitives/createFloating\";\nexport { createFocusTrap } from \"./primitives/createFocusTrap\";\nexport type { CreateFocusTrapOptions } from \"./primitives/createFocusTrap\";\nexport { createCssTransition } from \"./primitives/createCssTransition\";\nexport type {\n  CreateCssTransitionOptions,\n  CssTransitionState,\n  CssTransitionClassNames,\n} from \"./primitives/createCssTransition\";\nexport { createDropzone } from \"./primitives/createDropzone\";\nexport type { DropzoneOptions, DropzoneState } from \"./primitives/createDropzone\";\nexport { createVirtualList } from \"./primitives/createVirtualList\";\nexport type { CreateVirtualListParams, VirtualListResult } from \"./primitives/createVirtualList\";\nexport { createMaskedInput } from \"./primitives/createMaskedInput\";\nexport type { CreateMaskedInputOptions, MaskedInputState } from \"./primitives/createMaskedInput\";\nexport { createMediaQuery } from \"./primitives/createMediaQuery\";\nexport { createPersistedJson } from \"./primitives/createPersistedJson\";\nexport type { PersistedJson } from \"./primitives/createPersistedJson\";\nexport { createRovingTabIndex } from \"./primitives/createRovingTabIndex\";\nexport type { CreateRovingTabIndexOptions } from \"./primitives/createRovingTabIndex\";\nexport { createHoverPopover } from \"./primitives/createHoverPopover\";\nexport type {\n  CreateHoverPopoverOptions,\n  HoverPopoverState,\n  HoverPopoverPoint,\n  HoverPopoverReferenceProps,\n  HoverPopoverFloatingProps,\n} from \"./primitives/createHoverPopover\";\n\n// utils\nexport { resolvePlacement, buildFloatingMiddleware, placements } from \"./utils/floating\";\nexport type { Placement, ResolvedPlacement } from \"./utils/floating\";\n\n// base\nexport { Icon, IconProvider, IconContext, useIconSource, createIconVersion } from \"./components/base/icon\";\nexport type { IconProps, IconColor, IconProviderProps, IconContextValue } from \"./components/base/icon\";\n// Icon registry API. The icons themselves live behind \"@smwb/ui-solid/icons\" so\n// an app bundles only the ones it registers.\nexport {\n  registerIcons,\n  unregisterIcons,\n  clearIcons,\n  getIcon,\n  hasIcon,\n  listIcons,\n  normalizeIconName,\n} from \"./icons/registry\";\nexport type { IconInput } from \"./icons/registry\";\nexport { configureIcons, getIconConfig, resetIconConfig } from \"./icons/config\";\nexport type { IconConfig } from \"./icons/config\";\nexport { subscribeIcons, getIconVersion } from \"./icons/store\";\nexport type { IconDefinition, IconSource } from \"./icons/types\";\nexport { Ripple } from \"./components/base/ripple\";\nexport type { RippleProps, RippleActionsRef, RippleClasses } from \"./components/base/ripple\";\nexport { AnimateHeight } from \"./components/base/animateHeight\";\nexport type { AnimateHeightProps, Height } from \"./components/base/animateHeight\";\n\n// dataDisplay\nexport { Typography } from \"./components/dataDisplay/typography\";\nexport type { TypographyProps, TypographyVariant, TypographyColor } from \"./components/dataDisplay/typography\";\nexport { Badge } from \"./components/dataDisplay/badge\";\nexport type { BadgeProps } from \"./components/dataDisplay/badge\";\nexport { Card } from \"./components/dataDisplay/card\";\nexport type { CardProps } from \"./components/dataDisplay/card\";\nexport { Stat, StatGroup } from \"./components/dataDisplay/stat\";\nexport type { StatProps, StatGroupProps, StatTone } from \"./components/dataDisplay/stat\";\nexport { Chip } from \"./components/dataDisplay/chip\";\nexport type { ChipProps, ChipColor } from \"./components/dataDisplay/chip\";\nexport { LazyImage } from \"./components/dataDisplay/lazyImage\";\nexport type { LazyImageProps } from \"./components/dataDisplay/lazyImage\";\nexport { ChipGroup } from \"./components/dataDisplay/chipGroup\";\nexport type { ChipGroupProps, ChipGroupOption } from \"./components/dataDisplay/chipGroup\";\nexport { Meter, meterColor, DEFAULT_METER_THRESHOLDS } from \"./components/dataDisplay/meter\";\nexport type { MeterProps, MeterColor, MeterThreshold } from \"./components/dataDisplay/meter\";\nexport { ThumbCard } from \"./components/dataDisplay/thumbCard\";\nexport type { ThumbCardProps } from \"./components/dataDisplay/thumbCard\";\nexport { AssetGrid } from \"./components/dataDisplay/assetGrid\";\nexport type { AssetGridProps } from \"./components/dataDisplay/assetGrid\";\nexport { Avatar, AvatarGroup } from \"./components/dataDisplay/avatar\";\nexport type { AvatarProps, AvatarGroupProps, AvatarSize } from \"./components/dataDisplay/avatar\";\nexport { PersonChip, initialsOf, avatarColor } from \"./components/dataDisplay/personChip\";\nexport type { PersonChipProps } from \"./components/dataDisplay/personChip\";\nexport { List, ListItem } from \"./components/dataDisplay/list\";\nexport type { ListProps, ListItemProps } from \"./components/dataDisplay/list\";\nexport { DescriptionList, DescriptionItem } from \"./components/dataDisplay/descriptionList\";\nexport type {\n  DescriptionListProps,\n  DescriptionItemProps,\n  DescriptionListEntry,\n  DescriptionListLayout,\n} from \"./components/dataDisplay/descriptionList\";\nexport { Accordion } from \"./components/dataDisplay/accordion\";\nexport type { AccordionProps } from \"./components/dataDisplay/accordion\";\nexport { ExpansionPanel } from \"./components/dataDisplay/expansionPanel\";\nexport type {\n  ExpansionPanelProps,\n  ExpansionPanelLabels,\n  ExpansionPanelRenderContext,\n  ExpansionPanelControlsContext,\n  ExpansionMode,\n} from \"./components/dataDisplay/expansionPanel\";\nexport {\n  Table,\n  TableHead,\n  TableBody,\n  TableRow,\n  TableCell,\n  TableHeadCell,\n  TablePagination,\n} from \"./components/dataDisplay/table\";\nexport type {\n  TableProps,\n  TableHeadProps,\n  TableBodyProps,\n  TableRowProps,\n  TableCellProps,\n  TableHeadCellProps,\n  TablePaginationProps,\n  SortDirection,\n} from \"./components/dataDisplay/table\";\nexport { TreeView } from \"./components/dataDisplay/treeView\";\nexport type { TreeViewProps, ITreeNodeItem } from \"./components/dataDisplay/treeView\";\nexport { Timeline, TimelineGroup, TimelineItem } from \"./components/dataDisplay/timeline\";\nexport type {\n  TimelineProps,\n  TimelineGroupProps,\n  TimelineItemProps,\n  TimelineTone,\n} from \"./components/dataDisplay/timeline\";\nexport { Carousel } from \"./components/dataDisplay/carousel\";\nexport type { CarouselProps } from \"./components/dataDisplay/carousel\";\nexport { ImagesList, ImagesListItem, ImagesListItemModal } from \"./components/dataDisplay/imagesList\";\nexport type {\n  ImagesListProps,\n  ImagesListItemProps,\n  ImagesListItemModalProps,\n  ImageItem,\n} from \"./components/dataDisplay/imagesList\";\nexport { Kanban, KanbanColumn, KanbanCard } from \"./components/dataDisplay/kanban\";\nexport type { KanbanProps, KanbanColumnProps, KanbanCardProps } from \"./components/dataDisplay/kanban\";\nexport {\n  Chat,\n  ChatLayout,\n  ChatOverlayLayout,\n  ChatShell,\n  ChatHeader,\n  ChatMessages,\n  ChatMessageItem,\n  ChatMessageIncoming,\n  ChatMessageOutgoing,\n  ChatMessageSystem,\n  ChatMessageBubble,\n  ChatMessageSkeleton,\n  ChatMessageStatus,\n  ChatMessageAvatar,\n  ChatAttachments,\n  ChatAttachmentImage,\n  ChatIconButton,\n  ChatComposer,\n  createChatInfiniteScroll,\n  createChatFileUpload,\n  resolveChatFileUploadMaxFiles,\n  createChatStickToBottom,\n  isScrolledToBottom,\n  scrollChatToBottom,\n  CHAT_EXPAND_LAYOUTS,\n  CHAT_DEFAULT_FILE_UPLOAD_MAX_FILES,\n  CHAT_MESSAGE_DELIVERY_STATUSES,\n  CHAT_MESSAGE_STATUS_ICONS,\n  CHAT_MESSAGE_STATUS_LABELS,\n  isImageAttachment,\n  formatChatTimestamp,\n  resolveAllowedLayouts,\n  isChatMessageDeliveryStatus,\n  resolveChatMessageStatusIcon,\n  resolveChatMessageStatusLabel,\n  shouldComposerNewlineOnEnter,\n  getChatLayoutActions,\n  shouldShowChatCloseButton,\n} from \"./components/dataDisplay/chat\";\nexport type {\n  ChatProps,\n  ChatLayoutProps,\n  ChatLayoutChatProps,\n  ChatOverlayLayoutProps,\n  ChatOverlayLayoutChatProps,\n  ChatShellProps,\n  ChatHeaderProps,\n  ChatMessagesProps,\n  ChatMessageItemProps,\n  ChatMessageIncomingProps,\n  ChatMessageOutgoingProps,\n  ChatMessageSystemProps,\n  ChatMessageBubbleProps,\n  ChatMessageSkeletonProps,\n  ChatMessageStatusProps,\n  ChatMessageAvatarProps,\n  ChatAttachmentsProps,\n  ChatAttachmentImageProps,\n  ChatIconButtonProps,\n  ChatComposerProps,\n  CreateChatInfiniteScrollParams,\n  CreateChatFileUploadOptions,\n  ChatFileUploadState,\n  CreateChatStickToBottomParams,\n  ChatMessage,\n  ChatAttachment,\n  ChatAuthor,\n  ChatMessageVariant,\n  ChatLayoutMode,\n  ChatAnchor,\n  ChatThemeMode,\n  ChatMessageRenderContext,\n  ChatLayoutSide,\n  ChatMessageDeliveryStatus,\n  ChatMessageStatusValue,\n  ChatMessageStatusIcons,\n  ChatMessageStatusRenderContext,\n  ChatComposerNewlineOptions,\n} from \"./components/dataDisplay/chat\";\n\n// feedBack\nexport { Skeleton } from \"./components/feedBack/skeleton\";\nexport type { SkeletonProps } from \"./components/feedBack/skeleton\";\nexport { Message, MessageContainer } from \"./components/feedBack/message\";\nexport type { MessageProps, MessageSeverity } from \"./components/feedBack/message\";\nexport { ProgressIndicator, CircularProgress } from \"./components/feedBack/progressIndicator\";\nexport type {\n  ProgressIndicatorProps,\n  ProgressColor,\n  CircularProgressProps,\n} from \"./components/feedBack/progressIndicator\";\nexport { Tooltip } from \"./components/feedBack/tooltip\";\nexport type { TooltipProps, TooltipTrigger } from \"./components/feedBack/tooltip\";\nexport { Modal } from \"./components/feedBack/modal\";\nexport type { ModalProps, ModalSlotProps } from \"./components/feedBack/modal\";\nexport { SaveAssetDialog } from \"./components/feedBack/saveAssetDialog\";\nexport type { SaveAssetDialogProps } from \"./components/feedBack/saveAssetDialog\";\nexport { ConfirmDialog } from \"./components/feedBack/confirmDialog\";\nexport type { ConfirmDialogProps } from \"./components/feedBack/confirmDialog\";\nexport { EmptyState } from \"./components/feedBack/emptyState\";\nexport type { EmptyStateProps } from \"./components/feedBack/emptyState\";\nexport { SnackbarProvider, Snackbar, useSnackbar } from \"./components/feedBack/snackbar\";\nexport type {\n  SnackbarsProviderProps,\n  SnackbarProps,\n  SnackbarOptions,\n  AddSnackbar,\n  AddSnackbarOptions,\n  Variants as SnackbarVariant,\n  Position as SnackbarPosition,\n} from \"./components/feedBack/snackbar\";\n\n// utility\nexport { ClickAwayListener } from \"./components/clickAwayListener\";\nexport type { ClickAwayListenerProps } from \"./components/clickAwayListener\";\n\n// layout\nexport { Divider } from \"./components/layout/divider\";\nexport type { DividerProps, DividerColor } from \"./components/layout/divider\";\nexport { Stack } from \"./components/layout/stack\";\nexport type { StackProps, StackSpacing } from \"./components/layout/stack\";\nexport { Page } from \"./components/layout/page\";\nexport type { PageProps, PageMaxWidth } from \"./components/layout/page\";\nexport { PageHeader } from \"./components/layout/pageHeader\";\nexport type { PageHeaderProps } from \"./components/layout/pageHeader\";\nexport { SectionHeader } from \"./components/layout/sectionHeader\";\nexport type { SectionHeaderProps } from \"./components/layout/sectionHeader\";\nexport { Grid, Row, Column, Container } from \"./components/layout/grid\";\nexport type {\n  RowProps,\n  ColumnProps,\n  ContainerProps,\n  BreakpointType,\n  ColumnSpan,\n  OffsetType,\n  Breakpoint,\n  ResponsiveBool,\n  ContainerMaxWidth,\n} from \"./components/layout/grid\";\nexport { AppLayout } from \"./components/layout/appLayout\";\nexport type { AppLayoutProps } from \"./components/layout/appLayout\";\nexport { ScreenDivider } from \"./components/layout/screenDivider\";\nexport type { ScreenDividerProps } from \"./components/layout/screenDivider\";\nexport { Sheet } from \"./components/layout/sheet\";\nexport type { SheetProps } from \"./components/layout/sheet\";\nexport { FloatingWindow } from \"./components/layout/floatingWindow\";\nexport type {\n  FloatingWindowProps,\n  FloatingWindowPosition,\n  FloatingWindowSize,\n  FloatingWindowResizeDir,\n} from \"./components/layout/floatingWindow\";\n\n// navigation\nexport { AppBar } from \"./components/navigation/appBar\";\nexport type { AppBarProps, AppBarColor } from \"./components/navigation/appBar\";\nexport { Breadcrumbs } from \"./components/navigation/breadcrumbs\";\nexport type { BreadcrumbsProps } from \"./components/navigation/breadcrumbs\";\nexport { Pagination } from \"./components/navigation/pagination\";\nexport type { PaginationProps, PaginationColor } from \"./components/navigation/pagination\";\nexport { Stepper } from \"./components/navigation/stepper\";\nexport type { StepperProps, StepItem } from \"./components/navigation/stepper\";\nexport { Sidebar } from \"./components/navigation/sidebar\";\nexport type { SidebarProps, SidebarMenuItemProps, SidebarVariant } from \"./components/navigation/sidebar\";\nexport { Tabs, Tab, TabsContext, useTabsContext } from \"./components/navigation/tabs\";\nexport type { TabsProps, TabProps, TabsContextValue } from \"./components/navigation/tabs\";\nexport { BottomBar } from \"./components/navigation/bottomBar\";\nexport type { BottomBarProps, BottomBarMenuItemProps } from \"./components/navigation/bottomBar\";\nexport {\n  Menu,\n  MenuFloating,\n  MenuList,\n  MenuItem,\n  MenuItemIcon,\n  MenuItemText,\n  MenuDivider,\n  MenuSubmenu,\n  MenuContext,\n  useMenuContext,\n  buildMenuFloatingMiddleware,\n} from \"./components/navigation/menu\";\nexport type {\n  MenuProps,\n  MenuFloatingProps,\n  MenuListProps,\n  MenuItemProps,\n  MenuItemIconProps,\n  MenuItemTextProps,\n  MenuDividerProps,\n  MenuSubmenuProps,\n  MenuContextValue,\n} from \"./components/navigation/menu\";\nexport { OverflowMenu } from \"./components/navigation/overflowMenu\";\nexport type { OverflowMenuProps, OverflowMenuItem } from \"./components/navigation/overflowMenu\";\n\n// inputs\nexport { Button } from \"./components/inputs/button\";\nexport type { ButtonProps } from \"./components/inputs/button\";\nexport { ButtonGroup } from \"./components/inputs/buttonGroups\";\nexport type { ButtonGroupProps } from \"./components/inputs/buttonGroups\";\nexport { Checkbox } from \"./components/inputs/checkbox\";\nexport type {\n  CheckboxProps,\n  SelectionControlSize,\n  SelectionControlColor,\n  SelectionChangeEvent,\n} from \"./components/inputs/checkbox\";\nexport { RadioButton } from \"./components/inputs/radioButton\";\nexport type { RadioButtonProps } from \"./components/inputs/radioButton\";\nexport { Toggle } from \"./components/inputs/toggle\";\nexport type { ToggleProps } from \"./components/inputs/toggle\";\nexport { Rating } from \"./components/inputs/rating\";\nexport type { RatingProps, RatingColor } from \"./components/inputs/rating\";\nexport { Slider } from \"./components/inputs/slider\";\nexport type { SliderProps, SliderValue, SliderMark } from \"./components/inputs/slider\";\nexport { ValueSlider } from \"./components/inputs/valueSlider\";\nexport type { ValueSliderProps } from \"./components/inputs/valueSlider\";\nexport { FileInput } from \"./components/inputs/fileInput\";\nexport type { FileInputProps } from \"./components/inputs/fileInput\";\nexport { FileDrop, PreviewWrapper, Preview, CountPreview, isImageFile } from \"./components/inputs/fileDrop\";\nexport type {\n  FileUploadProps,\n  PreviewWrapperProps,\n  PreviewProps,\n  CountPreviewProps,\n} from \"./components/inputs/fileDrop\";\nexport { SelectField, DropdownMenu } from \"./components/inputs/selectField\";\nexport type {\n  SelectFieldProps,\n  OnSelectChange,\n  DropdownItem,\n  DropdownItemProps,\n} from \"./components/inputs/selectField\";\nexport {\n  DatePicker,\n  OpenView,\n  DataPickerDays,\n  DataPickerHeader,\n  DataPickerInput,\n  DatePickerActionLabel,\n  DatePickerDay,\n  DatePickerIconButton,\n  DatePickerList,\n  createDateInput,\n} from \"./components/inputs/datePicker\";\nexport type {\n  DatePickerProps,\n  DataPickerDaysProps,\n  DataPickerHeaderProps,\n  DataPickerInputProps,\n  ActionLabelProps,\n  DatePickerDayProps,\n  DataPickerIconButtonProps,\n  DatePickerListProps,\n  CreateDateInputProps,\n  DateInputState,\n} from \"./components/inputs/datePicker\";\nexport {\n  TimePicker,\n  TimePickerInput,\n  TimePickerColumns,\n  createTimeInput,\n  DEFAULT_TIME_FORMAT,\n} from \"./components/inputs/timePicker\";\nexport type { TimePickerProps, TimePickerInputProps, TimePickerColumnsProps } from \"./components/inputs/timePicker\";\nexport {\n  DateTimePicker,\n  DateTimePickerInput,\n  createDateTimeInput,\n  getCurrentDateTimeFormat,\n  getDisplayDateTime,\n  formatDateTimeByPattern,\n  isDateTimePatternMatch,\n  parseDateTimeByPattern,\n} from \"./components/inputs/dateTimePicker\";\nexport type {\n  DateTimePickerProps,\n  DateTimePickerInputProps,\n  CreateDateTimeInputProps,\n  DateTimeInputState,\n} from \"./components/inputs/dateTimePicker\";\nexport { FloatingButton } from \"./components/inputs/floatingButton\";\nexport type { FloatingButtonProps, FloatingButtonColor } from \"./components/inputs/floatingButton\";\nexport { TextField, TextFieldWrapper, TextFieldAdornment } from \"./components/inputs/textField\";\nexport type {\n  TextFieldProps,\n  TextFieldWrapperProps,\n  TextFieldAdornmentProps,\n  TextFieldVariant,\n} from \"./components/inputs/textField\";\n"],
-  "mappings": "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",
+  "sourcesContent": ["// Public entry point for @smwb/ui-solid.\n// Exports are added as components are ported (see src/components/**).\n\n// primitives\nexport { mergeRefs } from \"./primitives/mergeRefs\";\nexport type { Ref, RefCallback } from \"./primitives/mergeRefs\";\nexport { createId } from \"./primitives/createId\";\nexport { createControllableState } from \"./primitives/createControllableState\";\nexport type { CreateControllableStateParams } from \"./primitives/createControllableState\";\nexport { createTheme, Theme } from \"./primitives/createTheme\";\nexport { createFloating } from \"./primitives/createFloating\";\nexport type { CreateFloatingOptions, FloatingState } from \"./primitives/createFloating\";\nexport { createFocusTrap } from \"./primitives/createFocusTrap\";\nexport type { CreateFocusTrapOptions } from \"./primitives/createFocusTrap\";\nexport { createCssTransition } from \"./primitives/createCssTransition\";\nexport type {\n  CreateCssTransitionOptions,\n  CssTransitionState,\n  CssTransitionClassNames,\n} from \"./primitives/createCssTransition\";\nexport { createDropzone } from \"./primitives/createDropzone\";\nexport type { DropzoneOptions, DropzoneState } from \"./primitives/createDropzone\";\nexport { createVirtualList } from \"./primitives/createVirtualList\";\nexport type { CreateVirtualListParams, VirtualListResult } from \"./primitives/createVirtualList\";\nexport { createMaskedInput } from \"./primitives/createMaskedInput\";\nexport type { CreateMaskedInputOptions, MaskedInputState } from \"./primitives/createMaskedInput\";\nexport { createMediaQuery } from \"./primitives/createMediaQuery\";\nexport { createPersistedJson } from \"./primitives/createPersistedJson\";\nexport type { PersistedJson } from \"./primitives/createPersistedJson\";\nexport { createRovingTabIndex } from \"./primitives/createRovingTabIndex\";\nexport type { CreateRovingTabIndexOptions } from \"./primitives/createRovingTabIndex\";\nexport { createHoverPopover } from \"./primitives/createHoverPopover\";\nexport type {\n  CreateHoverPopoverOptions,\n  HoverPopoverState,\n  HoverPopoverPoint,\n  HoverPopoverReferenceProps,\n  HoverPopoverFloatingProps,\n} from \"./primitives/createHoverPopover\";\n\n// utils\nexport { resolvePlacement, buildFloatingMiddleware, placements } from \"./utils/floating\";\nexport type { Placement, ResolvedPlacement } from \"./utils/floating\";\n\n// base\nexport { Icon, IconProvider, IconContext, useIconSource, createIconVersion } from \"./components/base/icon\";\nexport type { IconProps, IconColor, IconProviderProps, IconContextValue } from \"./components/base/icon\";\n// Icon registry API. The icons themselves live behind \"@smwb/ui-solid/icons\" so\n// an app bundles only the ones it registers.\nexport {\n  registerIcons,\n  unregisterIcons,\n  clearIcons,\n  getIcon,\n  hasIcon,\n  listIcons,\n  normalizeIconName,\n} from \"./icons/registry\";\nexport type { IconInput } from \"./icons/registry\";\nexport { configureIcons, getIconConfig, resetIconConfig } from \"./icons/config\";\nexport type { IconConfig } from \"./icons/config\";\nexport { subscribeIcons, getIconVersion } from \"./icons/store\";\nexport type { IconDefinition, IconSource } from \"./icons/types\";\nexport { Ripple } from \"./components/base/ripple\";\nexport type { RippleProps, RippleActionsRef, RippleClasses } from \"./components/base/ripple\";\nexport { AnimateHeight } from \"./components/base/animateHeight\";\nexport type { AnimateHeightProps, Height } from \"./components/base/animateHeight\";\n\n// dataDisplay\nexport { Typography } from \"./components/dataDisplay/typography\";\nexport type { TypographyProps, TypographyVariant, TypographyColor } from \"./components/dataDisplay/typography\";\nexport { Badge } from \"./components/dataDisplay/badge\";\nexport type { BadgeProps } from \"./components/dataDisplay/badge\";\nexport { Card } from \"./components/dataDisplay/card\";\nexport type { CardProps } from \"./components/dataDisplay/card\";\nexport { Stat, StatGroup } from \"./components/dataDisplay/stat\";\nexport type { StatProps, StatGroupProps, StatTone } from \"./components/dataDisplay/stat\";\nexport { Chip } from \"./components/dataDisplay/chip\";\nexport type { ChipProps, ChipColor } from \"./components/dataDisplay/chip\";\nexport { LazyImage } from \"./components/dataDisplay/lazyImage\";\nexport type { LazyImageProps } from \"./components/dataDisplay/lazyImage\";\nexport { ChipGroup } from \"./components/dataDisplay/chipGroup\";\nexport type { ChipGroupProps, ChipGroupOption } from \"./components/dataDisplay/chipGroup\";\nexport { Meter, meterColor, DEFAULT_METER_THRESHOLDS } from \"./components/dataDisplay/meter\";\nexport type { MeterProps, MeterColor, MeterThreshold } from \"./components/dataDisplay/meter\";\nexport { ThumbCard } from \"./components/dataDisplay/thumbCard\";\nexport type { ThumbCardProps } from \"./components/dataDisplay/thumbCard\";\nexport { AssetGrid } from \"./components/dataDisplay/assetGrid\";\nexport type { AssetGridProps } from \"./components/dataDisplay/assetGrid\";\nexport { Avatar, AvatarGroup } from \"./components/dataDisplay/avatar\";\nexport type { AvatarProps, AvatarGroupProps, AvatarSize } from \"./components/dataDisplay/avatar\";\nexport { PersonChip, initialsOf, avatarColor } from \"./components/dataDisplay/personChip\";\nexport type { PersonChipProps } from \"./components/dataDisplay/personChip\";\nexport { List, ListItem } from \"./components/dataDisplay/list\";\nexport type { ListProps, ListItemProps } from \"./components/dataDisplay/list\";\nexport { DescriptionList, DescriptionItem } from \"./components/dataDisplay/descriptionList\";\nexport type {\n  DescriptionListProps,\n  DescriptionItemProps,\n  DescriptionListEntry,\n  DescriptionListLayout,\n} from \"./components/dataDisplay/descriptionList\";\nexport { Accordion } from \"./components/dataDisplay/accordion\";\nexport type { AccordionProps } from \"./components/dataDisplay/accordion\";\nexport { ExpansionPanel } from \"./components/dataDisplay/expansionPanel\";\nexport type {\n  ExpansionPanelProps,\n  ExpansionPanelLabels,\n  ExpansionPanelRenderContext,\n  ExpansionPanelControlsContext,\n  ExpansionMode,\n} from \"./components/dataDisplay/expansionPanel\";\nexport {\n  Table,\n  TableHead,\n  TableBody,\n  TableRow,\n  TableCell,\n  TableHeadCell,\n  TablePagination,\n} from \"./components/dataDisplay/table\";\nexport type {\n  TableProps,\n  TableHeadProps,\n  TableBodyProps,\n  TableRowProps,\n  TableCellProps,\n  TableHeadCellProps,\n  TablePaginationProps,\n  SortDirection,\n} from \"./components/dataDisplay/table\";\nexport { TreeView } from \"./components/dataDisplay/treeView\";\nexport type { TreeViewProps, ITreeNodeItem } from \"./components/dataDisplay/treeView\";\nexport { Timeline, TimelineGroup, TimelineItem } from \"./components/dataDisplay/timeline\";\nexport type {\n  TimelineProps,\n  TimelineGroupProps,\n  TimelineItemProps,\n  TimelineTone,\n} from \"./components/dataDisplay/timeline\";\nexport { Carousel } from \"./components/dataDisplay/carousel\";\nexport type { CarouselProps } from \"./components/dataDisplay/carousel\";\nexport { ImagesList, ImagesListItem, ImagesListItemModal } from \"./components/dataDisplay/imagesList\";\nexport type {\n  ImagesListProps,\n  ImagesListItemProps,\n  ImagesListItemModalProps,\n  ImageItem,\n} from \"./components/dataDisplay/imagesList\";\nexport { Kanban, KanbanColumn, KanbanCard } from \"./components/dataDisplay/kanban\";\nexport type { KanbanProps, KanbanColumnProps, KanbanCardProps } from \"./components/dataDisplay/kanban\";\nexport { DagView, dagLayout } from \"./components/dataDisplay/dagView\";\nexport type {\n  DagViewProps,\n  DagViewNode,\n  DagViewEdge,\n  DagViewStatus,\n  DagViewViewport,\n  DagViewApi,\n  DagViewNodeState,\n  DagViewLabels,\n  DagLayoutInput,\n  DagLayoutResult,\n} from \"./components/dataDisplay/dagView\";\nexport {\n  Chat,\n  ChatLayout,\n  ChatOverlayLayout,\n  ChatShell,\n  ChatHeader,\n  ChatMessages,\n  ChatMessageItem,\n  ChatMessageIncoming,\n  ChatMessageOutgoing,\n  ChatMessageSystem,\n  ChatMessageBubble,\n  ChatMessageSkeleton,\n  ChatMessageStatus,\n  ChatMessageAvatar,\n  ChatAttachments,\n  ChatAttachmentImage,\n  ChatIconButton,\n  ChatComposer,\n  createChatInfiniteScroll,\n  createChatFileUpload,\n  resolveChatFileUploadMaxFiles,\n  createChatStickToBottom,\n  isScrolledToBottom,\n  scrollChatToBottom,\n  CHAT_EXPAND_LAYOUTS,\n  CHAT_DEFAULT_FILE_UPLOAD_MAX_FILES,\n  CHAT_MESSAGE_DELIVERY_STATUSES,\n  CHAT_MESSAGE_STATUS_ICONS,\n  CHAT_MESSAGE_STATUS_LABELS,\n  isImageAttachment,\n  formatChatTimestamp,\n  resolveAllowedLayouts,\n  isChatMessageDeliveryStatus,\n  resolveChatMessageStatusIcon,\n  resolveChatMessageStatusLabel,\n  shouldComposerNewlineOnEnter,\n  getChatLayoutActions,\n  shouldShowChatCloseButton,\n} from \"./components/dataDisplay/chat\";\nexport type {\n  ChatProps,\n  ChatLayoutProps,\n  ChatLayoutChatProps,\n  ChatOverlayLayoutProps,\n  ChatOverlayLayoutChatProps,\n  ChatShellProps,\n  ChatHeaderProps,\n  ChatMessagesProps,\n  ChatMessageItemProps,\n  ChatMessageIncomingProps,\n  ChatMessageOutgoingProps,\n  ChatMessageSystemProps,\n  ChatMessageBubbleProps,\n  ChatMessageSkeletonProps,\n  ChatMessageStatusProps,\n  ChatMessageAvatarProps,\n  ChatAttachmentsProps,\n  ChatAttachmentImageProps,\n  ChatIconButtonProps,\n  ChatComposerProps,\n  CreateChatInfiniteScrollParams,\n  CreateChatFileUploadOptions,\n  ChatFileUploadState,\n  CreateChatStickToBottomParams,\n  ChatMessage,\n  ChatAttachment,\n  ChatAuthor,\n  ChatMessageVariant,\n  ChatLayoutMode,\n  ChatAnchor,\n  ChatThemeMode,\n  ChatMessageRenderContext,\n  ChatLayoutSide,\n  ChatMessageDeliveryStatus,\n  ChatMessageStatusValue,\n  ChatMessageStatusIcons,\n  ChatMessageStatusRenderContext,\n  ChatComposerNewlineOptions,\n} from \"./components/dataDisplay/chat\";\n\n// feedBack\nexport { Skeleton } from \"./components/feedBack/skeleton\";\nexport type { SkeletonProps } from \"./components/feedBack/skeleton\";\nexport { Message, MessageContainer } from \"./components/feedBack/message\";\nexport type { MessageProps, MessageSeverity } from \"./components/feedBack/message\";\nexport { ProgressIndicator, CircularProgress } from \"./components/feedBack/progressIndicator\";\nexport type {\n  ProgressIndicatorProps,\n  ProgressColor,\n  CircularProgressProps,\n} from \"./components/feedBack/progressIndicator\";\nexport { Tooltip } from \"./components/feedBack/tooltip\";\nexport type { TooltipProps, TooltipTrigger } from \"./components/feedBack/tooltip\";\nexport { Modal } from \"./components/feedBack/modal\";\nexport type { ModalProps, ModalSlotProps } from \"./components/feedBack/modal\";\nexport { SaveAssetDialog } from \"./components/feedBack/saveAssetDialog\";\nexport type { SaveAssetDialogProps } from \"./components/feedBack/saveAssetDialog\";\nexport { ConfirmDialog } from \"./components/feedBack/confirmDialog\";\nexport type { ConfirmDialogProps } from \"./components/feedBack/confirmDialog\";\nexport { EmptyState } from \"./components/feedBack/emptyState\";\nexport type { EmptyStateProps } from \"./components/feedBack/emptyState\";\nexport { SnackbarProvider, Snackbar, useSnackbar } from \"./components/feedBack/snackbar\";\nexport type {\n  SnackbarsProviderProps,\n  SnackbarProps,\n  SnackbarOptions,\n  AddSnackbar,\n  AddSnackbarOptions,\n  Variants as SnackbarVariant,\n  Position as SnackbarPosition,\n} from \"./components/feedBack/snackbar\";\n\n// utility\nexport { ClickAwayListener } from \"./components/clickAwayListener\";\nexport type { ClickAwayListenerProps } from \"./components/clickAwayListener\";\n\n// layout\nexport { Divider } from \"./components/layout/divider\";\nexport type { DividerProps, DividerColor } from \"./components/layout/divider\";\nexport { Stack } from \"./components/layout/stack\";\nexport type { StackProps, StackSpacing } from \"./components/layout/stack\";\nexport { Page } from \"./components/layout/page\";\nexport type { PageProps, PageMaxWidth } from \"./components/layout/page\";\nexport { PageHeader } from \"./components/layout/pageHeader\";\nexport type { PageHeaderProps } from \"./components/layout/pageHeader\";\nexport { SectionHeader } from \"./components/layout/sectionHeader\";\nexport type { SectionHeaderProps } from \"./components/layout/sectionHeader\";\nexport { Grid, Row, Column, Container } from \"./components/layout/grid\";\nexport type {\n  RowProps,\n  ColumnProps,\n  ContainerProps,\n  BreakpointType,\n  ColumnSpan,\n  OffsetType,\n  Breakpoint,\n  ResponsiveBool,\n  ContainerMaxWidth,\n} from \"./components/layout/grid\";\nexport { AppLayout } from \"./components/layout/appLayout\";\nexport type { AppLayoutProps } from \"./components/layout/appLayout\";\nexport { ScreenDivider } from \"./components/layout/screenDivider\";\nexport type { ScreenDividerProps } from \"./components/layout/screenDivider\";\nexport { Sheet } from \"./components/layout/sheet\";\nexport type { SheetProps } from \"./components/layout/sheet\";\nexport { FloatingWindow } from \"./components/layout/floatingWindow\";\nexport type {\n  FloatingWindowProps,\n  FloatingWindowPosition,\n  FloatingWindowSize,\n  FloatingWindowResizeDir,\n} from \"./components/layout/floatingWindow\";\n\n// navigation\nexport { AppBar } from \"./components/navigation/appBar\";\nexport type { AppBarProps, AppBarColor } from \"./components/navigation/appBar\";\nexport { Breadcrumbs } from \"./components/navigation/breadcrumbs\";\nexport type { BreadcrumbsProps } from \"./components/navigation/breadcrumbs\";\nexport { Pagination } from \"./components/navigation/pagination\";\nexport type { PaginationProps, PaginationColor } from \"./components/navigation/pagination\";\nexport { Stepper } from \"./components/navigation/stepper\";\nexport type { StepperProps, StepItem } from \"./components/navigation/stepper\";\nexport { Sidebar } from \"./components/navigation/sidebar\";\nexport type { SidebarProps, SidebarMenuItemProps, SidebarVariant } from \"./components/navigation/sidebar\";\nexport { Tabs, Tab, TabsContext, useTabsContext } from \"./components/navigation/tabs\";\nexport type { TabsProps, TabProps, TabsContextValue } from \"./components/navigation/tabs\";\nexport { BottomBar } from \"./components/navigation/bottomBar\";\nexport type { BottomBarProps, BottomBarMenuItemProps } from \"./components/navigation/bottomBar\";\nexport {\n  Menu,\n  MenuFloating,\n  MenuList,\n  MenuItem,\n  MenuItemIcon,\n  MenuItemText,\n  MenuDivider,\n  MenuSubmenu,\n  MenuContext,\n  useMenuContext,\n  buildMenuFloatingMiddleware,\n} from \"./components/navigation/menu\";\nexport type {\n  MenuProps,\n  MenuFloatingProps,\n  MenuListProps,\n  MenuItemProps,\n  MenuItemIconProps,\n  MenuItemTextProps,\n  MenuDividerProps,\n  MenuSubmenuProps,\n  MenuContextValue,\n} from \"./components/navigation/menu\";\nexport { OverflowMenu } from \"./components/navigation/overflowMenu\";\nexport type { OverflowMenuProps, OverflowMenuItem } from \"./components/navigation/overflowMenu\";\n\n// inputs\nexport { Button } from \"./components/inputs/button\";\nexport type { ButtonProps } from \"./components/inputs/button\";\nexport { ButtonGroup } from \"./components/inputs/buttonGroups\";\nexport type { ButtonGroupProps } from \"./components/inputs/buttonGroups\";\nexport { Checkbox } from \"./components/inputs/checkbox\";\nexport type {\n  CheckboxProps,\n  SelectionControlSize,\n  SelectionControlColor,\n  SelectionChangeEvent,\n} from \"./components/inputs/checkbox\";\nexport { RadioButton } from \"./components/inputs/radioButton\";\nexport type { RadioButtonProps } from \"./components/inputs/radioButton\";\nexport { Toggle } from \"./components/inputs/toggle\";\nexport type { ToggleProps } from \"./components/inputs/toggle\";\nexport { Rating } from \"./components/inputs/rating\";\nexport type { RatingProps, RatingColor } from \"./components/inputs/rating\";\nexport { Slider } from \"./components/inputs/slider\";\nexport type { SliderProps, SliderValue, SliderMark } from \"./components/inputs/slider\";\nexport { ValueSlider } from \"./components/inputs/valueSlider\";\nexport type { ValueSliderProps } from \"./components/inputs/valueSlider\";\nexport { FileInput } from \"./components/inputs/fileInput\";\nexport type { FileInputProps } from \"./components/inputs/fileInput\";\nexport { FileDrop, PreviewWrapper, Preview, CountPreview, isImageFile } from \"./components/inputs/fileDrop\";\nexport type {\n  FileUploadProps,\n  PreviewWrapperProps,\n  PreviewProps,\n  CountPreviewProps,\n} from \"./components/inputs/fileDrop\";\nexport { SelectField, DropdownMenu } from \"./components/inputs/selectField\";\nexport type {\n  SelectFieldProps,\n  OnSelectChange,\n  DropdownItem,\n  DropdownItemProps,\n} from \"./components/inputs/selectField\";\nexport {\n  DatePicker,\n  OpenView,\n  DataPickerDays,\n  DataPickerHeader,\n  DataPickerInput,\n  DatePickerActionLabel,\n  DatePickerDay,\n  DatePickerIconButton,\n  DatePickerList,\n  createDateInput,\n} from \"./components/inputs/datePicker\";\nexport type {\n  DatePickerProps,\n  DataPickerDaysProps,\n  DataPickerHeaderProps,\n  DataPickerInputProps,\n  ActionLabelProps,\n  DatePickerDayProps,\n  DataPickerIconButtonProps,\n  DatePickerListProps,\n  CreateDateInputProps,\n  DateInputState,\n} from \"./components/inputs/datePicker\";\nexport {\n  TimePicker,\n  TimePickerInput,\n  TimePickerColumns,\n  createTimeInput,\n  DEFAULT_TIME_FORMAT,\n} from \"./components/inputs/timePicker\";\nexport type { TimePickerProps, TimePickerInputProps, TimePickerColumnsProps } from \"./components/inputs/timePicker\";\nexport {\n  DateTimePicker,\n  DateTimePickerInput,\n  createDateTimeInput,\n  getCurrentDateTimeFormat,\n  getDisplayDateTime,\n  formatDateTimeByPattern,\n  isDateTimePatternMatch,\n  parseDateTimeByPattern,\n} from \"./components/inputs/dateTimePicker\";\nexport type {\n  DateTimePickerProps,\n  DateTimePickerInputProps,\n  CreateDateTimeInputProps,\n  DateTimeInputState,\n} from \"./components/inputs/dateTimePicker\";\nexport { FloatingButton } from \"./components/inputs/floatingButton\";\nexport type { FloatingButtonProps, FloatingButtonColor } from \"./components/inputs/floatingButton\";\nexport { TextField, TextFieldWrapper, TextFieldAdornment } from \"./components/inputs/textField\";\nexport type {\n  TextFieldProps,\n  TextFieldWrapperProps,\n  TextFieldAdornmentProps,\n  TextFieldVariant,\n} from \"./components/inputs/textField\";\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/source/primitives/createCssTransition.js CHANGED Viewed

@@ -7,7 +7,9 @@ function createCssTransition(options) {
   let timer;
   let raf1;
   let raf2;
+  let generation = 0;
   const clearTimers = () => {
+    generation++;
     if (timer !== void 0) clearTimeout(timer);
     if (raf1 !== void 0) cancelAnimationFrame(raf1);
     if (raf2 !== void 0) cancelAnimationFrame(raf2);
@@ -16,11 +18,18 @@ function createCssTransition(options) {
     raf2 = void 0;
   };
   const run = (start, active, done, duration, onEnd) => {
+    const own = generation;
     setClasses(start ?? "");
     raf1 = requestAnimationFrame(() => {
-      raf2 = requestAnimationFrame(() => setClasses(join(start, active)));
+      raf1 = void 0;
+      if (own !== generation) return;
+      raf2 = requestAnimationFrame(() => {
+        raf2 = void 0;
+        if (own === generation) setClasses(join(start, active));
+      });
     });
     timer = setTimeout(() => {
+      clearTimers();
       if (onEnd) onEnd();
       else setClasses(done ?? "");
     }, duration);

package/dist/source/primitives/createCssTransition.js.map CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/primitives/createCssTransition.ts"],
-  "sourcesContent": ["import { type Accessor, createEffect, createSignal, onCleanup } from \"solid-js\";\n\nexport interface CssTransitionClassNames {\n  appear?: string;\n  appearActive?: string;\n  appearDone?: string;\n  enter?: string;\n  enterActive?: string;\n  enterDone?: string;\n  exit?: string;\n  exitActive?: string;\n  exitDone?: string;\n}\n\nexport interface CreateCssTransitionOptions {\n  in: Accessor<boolean>;\n  timeout: { appear?: number; enter: number; exit: number };\n  classNames: CssTransitionClassNames;\n  /** Animate the very first mount when `in` is already true. */\n  appear?: boolean;\n}\n\nexport interface CssTransitionState {\n  /** Whether the node should be in the DOM (mountOnEnter + unmountOnExit). */\n  mounted: Accessor<boolean>;\n  /** Transition classes to apply to the node for the current phase. */\n  classes: Accessor<string>;\n}\n\nconst join = (...parts: Array<string | undefined>): string => parts.filter(Boolean).join(\" \");\n\n/**\n * Single-node CSS transition with mountOnEnter + unmountOnExit semantics \u2014 a\n * dependency-free replacement for react-transition-group's CSSTransition. Uses\n * a double rAF to flush the start class before the active class so the CSS\n * transition runs, and a timeout to advance to the done/unmounted phase.\n */\nexport function createCssTransition(options: CreateCssTransitionOptions): CssTransitionState {\n  const [mounted, setMounted] = createSignal(options.in());\n  const [classes, setClasses] = createSignal(\"\");\n\n  let first = true;\n  let timer: ReturnType<typeof setTimeout> | undefined;\n  let raf1: number | undefined;\n  let raf2: number | undefined;\n\n  const clearTimers = (): void => {\n    if (timer !== undefined) clearTimeout(timer);\n    if (raf1 !== undefined) cancelAnimationFrame(raf1);\n    if (raf2 !== undefined) cancelAnimationFrame(raf2);\n    timer = undefined;\n    raf1 = undefined;\n    raf2 = undefined;\n  };\n\n  const run = (start: string | undefined, active: string | undefined, done: string | undefined, duration: number, onEnd?: () => void): void => {\n    setClasses(start ?? \"\");\n    raf1 = requestAnimationFrame(() => {\n      raf2 = requestAnimationFrame(() => setClasses(join(start, active)));\n    });\n    timer = setTimeout(() => {\n      if (onEnd) onEnd();\n      else setClasses(done ?? \"\");\n    }, duration);\n  };\n\n  createEffect(() => {\n    const show = options.in();\n    clearTimers();\n    const cls = options.classNames;\n\n    if (show) {\n      setMounted(true);\n      if (first && !options.appear) {\n        setClasses(cls.enterDone ?? \"\");\n      } else {\n        const useAppear = first && !!options.appear;\n        run(\n          useAppear ? cls.appear : cls.enter,\n          useAppear ? cls.appearActive : cls.enterActive,\n          useAppear ? (cls.appearDone ?? cls.enterDone) : cls.enterDone,\n          useAppear ? (options.timeout.appear ?? options.timeout.enter) : options.timeout.enter\n        );\n      }\n    } else if (mounted()) {\n      run(cls.exit, cls.exitActive, cls.exitDone, options.timeout.exit, () => {\n        setMounted(false);\n        setClasses(\"\");\n      });\n    }\n    first = false;\n  });\n\n  onCleanup(clearTimers);\n\n  return { mounted, classes };\n}\n"],
-  "mappings": "AAAA,SAAwB,cAAc,cAAc,iBAAiB;AA6BrE,MAAM,OAAO,IAAI,UAA6C,MAAM,OAAO,OAAO,EAAE,KAAK,GAAG;AAQrF,SAAS,oBAAoB,SAAyD;AAC3F,QAAM,CAAC,SAAS,UAAU,IAAI,aAAa,QAAQ,GAAG,CAAC;AACvD,QAAM,CAAC,SAAS,UAAU,IAAI,aAAa,EAAE;AAE7C,MAAI,QAAQ;AACZ,MAAI;AACJ,MAAI;AACJ,MAAI;AAEJ,QAAM,cAAc,MAAY;AAC9B,QAAI,UAAU,OAAW,cAAa,KAAK;AAC3C,QAAI,SAAS,OAAW,sBAAqB,IAAI;AACjD,QAAI,SAAS,OAAW,sBAAqB,IAAI;AACjD,YAAQ;AACR,WAAO;AACP,WAAO;AAAA,EACT;AAEA,QAAM,MAAM,CAAC,OAA2B,QAA4B,MAA0B,UAAkB,UAA6B;AAC3I,eAAW,SAAS,EAAE;AACtB,WAAO,sBAAsB,MAAM;AACjC,aAAO,sBAAsB,MAAM,WAAW,KAAK,OAAO,MAAM,CAAC,CAAC;AAAA,IACpE,CAAC;AACD,YAAQ,WAAW,MAAM;AACvB,UAAI,MAAO,OAAM;AAAA,UACZ,YAAW,QAAQ,EAAE;AAAA,IAC5B,GAAG,QAAQ;AAAA,EACb;AAEA,eAAa,MAAM;AACjB,UAAM,OAAO,QAAQ,GAAG;AACxB,gBAAY;AACZ,UAAM,MAAM,QAAQ;AAEpB,QAAI,MAAM;AACR,iBAAW,IAAI;AACf,UAAI,SAAS,CAAC,QAAQ,QAAQ;AAC5B,mBAAW,IAAI,aAAa,EAAE;AAAA,MAChC,OAAO;AACL,cAAM,YAAY,SAAS,CAAC,CAAC,QAAQ;AACrC;AAAA,UACE,YAAY,IAAI,SAAS,IAAI;AAAA,UAC7B,YAAY,IAAI,eAAe,IAAI;AAAA,UACnC,YAAa,IAAI,cAAc,IAAI,YAAa,IAAI;AAAA,UACpD,YAAa,QAAQ,QAAQ,UAAU,QAAQ,QAAQ,QAAS,QAAQ,QAAQ;AAAA,QAClF;AAAA,MACF;AAAA,IACF,WAAW,QAAQ,GAAG;AACpB,UAAI,IAAI,MAAM,IAAI,YAAY,IAAI,UAAU,QAAQ,QAAQ,MAAM,MAAM;AACtE,mBAAW,KAAK;AAChB,mBAAW,EAAE;AAAA,MACf,CAAC;AAAA,IACH;AACA,YAAQ;AAAA,EACV,CAAC;AAED,YAAU,WAAW;AAErB,SAAO,EAAE,SAAS,QAAQ;AAC5B;",
+  "sourcesContent": ["import { type Accessor, createEffect, createSignal, onCleanup } from \"solid-js\";\n\nexport interface CssTransitionClassNames {\n  appear?: string;\n  appearActive?: string;\n  appearDone?: string;\n  enter?: string;\n  enterActive?: string;\n  enterDone?: string;\n  exit?: string;\n  exitActive?: string;\n  exitDone?: string;\n}\n\nexport interface CreateCssTransitionOptions {\n  in: Accessor<boolean>;\n  timeout: { appear?: number; enter: number; exit: number };\n  classNames: CssTransitionClassNames;\n  /** Animate the very first mount when `in` is already true. */\n  appear?: boolean;\n}\n\nexport interface CssTransitionState {\n  /** Whether the node should be in the DOM (mountOnEnter + unmountOnExit). */\n  mounted: Accessor<boolean>;\n  /** Transition classes to apply to the node for the current phase. */\n  classes: Accessor<string>;\n}\n\nconst join = (...parts: Array<string | undefined>): string => parts.filter(Boolean).join(\" \");\n\n/**\n * Single-node CSS transition with mountOnEnter + unmountOnExit semantics \u2014 a\n * dependency-free replacement for react-transition-group's CSSTransition. Uses\n * a double rAF to flush the start class before the active class so the CSS\n * transition runs, and a timeout to advance to the done/unmounted phase.\n *\n * Each phase settles once: when the timeout fires, the pending rAFs are\n * cancelled and can no longer rewrite the classes. At a low frame rate the\n * second rAF can land after the timeout, and it used to overwrite the done\n * class with the start/active classes, parking the node in its off-screen\n * state.\n */\nexport function createCssTransition(options: CreateCssTransitionOptions): CssTransitionState {\n  const [mounted, setMounted] = createSignal(options.in());\n  const [classes, setClasses] = createSignal(\"\");\n\n  let first = true;\n  let timer: ReturnType<typeof setTimeout> | undefined;\n  let raf1: number | undefined;\n  let raf2: number | undefined;\n  // Bumped whenever a phase settles or is replaced; a frame callback from an\n  // older phase sees a different value and does nothing.\n  let generation = 0;\n\n  const clearTimers = (): void => {\n    generation++;\n    if (timer !== undefined) clearTimeout(timer);\n    if (raf1 !== undefined) cancelAnimationFrame(raf1);\n    if (raf2 !== undefined) cancelAnimationFrame(raf2);\n    timer = undefined;\n    raf1 = undefined;\n    raf2 = undefined;\n  };\n\n  const run = (start: string | undefined, active: string | undefined, done: string | undefined, duration: number, onEnd?: () => void): void => {\n    const own = generation;\n    setClasses(start ?? \"\");\n    raf1 = requestAnimationFrame(() => {\n      raf1 = undefined;\n      if (own !== generation) return;\n      raf2 = requestAnimationFrame(() => {\n        raf2 = undefined;\n        if (own === generation) setClasses(join(start, active));\n      });\n    });\n    timer = setTimeout(() => {\n      clearTimers();\n      if (onEnd) onEnd();\n      else setClasses(done ?? \"\");\n    }, duration);\n  };\n\n  createEffect(() => {\n    const show = options.in();\n    clearTimers();\n    const cls = options.classNames;\n\n    if (show) {\n      setMounted(true);\n      if (first && !options.appear) {\n        setClasses(cls.enterDone ?? \"\");\n      } else {\n        const useAppear = first && !!options.appear;\n        run(\n          useAppear ? cls.appear : cls.enter,\n          useAppear ? cls.appearActive : cls.enterActive,\n          useAppear ? (cls.appearDone ?? cls.enterDone) : cls.enterDone,\n          useAppear ? (options.timeout.appear ?? options.timeout.enter) : options.timeout.enter\n        );\n      }\n    } else if (mounted()) {\n      run(cls.exit, cls.exitActive, cls.exitDone, options.timeout.exit, () => {\n        setMounted(false);\n        setClasses(\"\");\n      });\n    }\n    first = false;\n  });\n\n  onCleanup(clearTimers);\n\n  return { mounted, classes };\n}\n"],
+  "mappings": "AAAA,SAAwB,cAAc,cAAc,iBAAiB;AA6BrE,MAAM,OAAO,IAAI,UAA6C,MAAM,OAAO,OAAO,EAAE,KAAK,GAAG;AAcrF,SAAS,oBAAoB,SAAyD;AAC3F,QAAM,CAAC,SAAS,UAAU,IAAI,aAAa,QAAQ,GAAG,CAAC;AACvD,QAAM,CAAC,SAAS,UAAU,IAAI,aAAa,EAAE;AAE7C,MAAI,QAAQ;AACZ,MAAI;AACJ,MAAI;AACJ,MAAI;AAGJ,MAAI,aAAa;AAEjB,QAAM,cAAc,MAAY;AAC9B;AACA,QAAI,UAAU,OAAW,cAAa,KAAK;AAC3C,QAAI,SAAS,OAAW,sBAAqB,IAAI;AACjD,QAAI,SAAS,OAAW,sBAAqB,IAAI;AACjD,YAAQ;AACR,WAAO;AACP,WAAO;AAAA,EACT;AAEA,QAAM,MAAM,CAAC,OAA2B,QAA4B,MAA0B,UAAkB,UAA6B;AAC3I,UAAM,MAAM;AACZ,eAAW,SAAS,EAAE;AACtB,WAAO,sBAAsB,MAAM;AACjC,aAAO;AACP,UAAI,QAAQ,WAAY;AACxB,aAAO,sBAAsB,MAAM;AACjC,eAAO;AACP,YAAI,QAAQ,WAAY,YAAW,KAAK,OAAO,MAAM,CAAC;AAAA,MACxD,CAAC;AAAA,IACH,CAAC;AACD,YAAQ,WAAW,MAAM;AACvB,kBAAY;AACZ,UAAI,MAAO,OAAM;AAAA,UACZ,YAAW,QAAQ,EAAE;AAAA,IAC5B,GAAG,QAAQ;AAAA,EACb;AAEA,eAAa,MAAM;AACjB,UAAM,OAAO,QAAQ,GAAG;AACxB,gBAAY;AACZ,UAAM,MAAM,QAAQ;AAEpB,QAAI,MAAM;AACR,iBAAW,IAAI;AACf,UAAI,SAAS,CAAC,QAAQ,QAAQ;AAC5B,mBAAW,IAAI,aAAa,EAAE;AAAA,MAChC,OAAO;AACL,cAAM,YAAY,SAAS,CAAC,CAAC,QAAQ;AACrC;AAAA,UACE,YAAY,IAAI,SAAS,IAAI;AAAA,UAC7B,YAAY,IAAI,eAAe,IAAI;AAAA,UACnC,YAAa,IAAI,cAAc,IAAI,YAAa,IAAI;AAAA,UACpD,YAAa,QAAQ,QAAQ,UAAU,QAAQ,QAAQ,QAAS,QAAQ,QAAQ;AAAA,QAClF;AAAA,MACF;AAAA,IACF,WAAW,QAAQ,GAAG;AACpB,UAAI,IAAI,MAAM,IAAI,YAAY,IAAI,UAAU,QAAQ,QAAQ,MAAM,MAAM;AACtE,mBAAW,KAAK;AAChB,mBAAW,EAAE;AAAA,MACf,CAAC;AAAA,IACH;AACA,YAAQ;AAAA,EACV,CAAC;AAED,YAAU,WAAW;AAErB,SAAO,EAAE,SAAS,QAAQ;AAC5B;",
   "names": []
 }