@moduix/solid 1.0.0

package/dist/components/spinner/Spinner.module.jsx

@@ -0,0 +1,7 @@
+import "./Spinner_module.css";
+const Spinner_module = {
+    root: "root-nmONyX",
+    indicator: "indicator-Oef4O8",
+    ring: "ring-STi4_I"
+};
+export default Spinner_module;

package/dist/components/spinner/Spinner_module.css

@@ -0,0 +1,59 @@
+@layer moduix.components {
+  .root-nmONyX, [data-scope="spinner"][data-part="root"] {
+    --_spinner-size: var(--moduix-spinner-size, var(--moduix-spinner-size-md, var(--moduix-spacing-5)));
+    width: var(--_spinner-size);
+    height: var(--_spinner-size);
+    color: var(--moduix-spinner-color, currentColor);
+    vertical-align: middle;
+    flex: none;
+    justify-content: center;
+    align-items: center;
+    display: inline-flex;
+  }
+
+  .indicator-Oef4O8, [data-scope="spinner"][data-part="indicator"] {
+    width: 100%;
+    height: 100%;
+    animation: var(--moduix-spinner-animation, var(--moduix-animation-spin));
+    justify-content: center;
+    align-items: center;
+    display: inline-flex;
+  }
+
+  .ring-STi4_I, [data-scope="spinner"][data-part="ring"] {
+    box-sizing: border-box;
+    border: var(--moduix-spinner-ring-border-width, var(--moduix-border-width-md)) solid
+      var(--moduix-spinner-ring-track-color, color-mix(in oklab, currentColor 22%, transparent));
+    border-block-start-color: var(--moduix-spinner-color, currentColor);
+    border-radius: var(--moduix-spinner-radius, var(--moduix-radius-full));
+    width: 100%;
+    height: 100%;
+    display: block;
+  }
+
+  .indicator-Oef4O8 :where(svg), [data-scope="spinner"][data-part="indicator"] :where(svg) {
+    width: 100%;
+    height: 100%;
+  }
+
+  .root-nmONyX[data-size="xs"], [data-scope="spinner"][data-part="root"][data-size="xs"] {
+    --_spinner-size: var(--moduix-spinner-size, var(--moduix-spinner-size-xs, var(--moduix-spacing-3)));
+  }
+
+  .root-nmONyX[data-size="inherit"], [data-scope="spinner"][data-part="root"][data-size="inherit"] {
+    --_spinner-size: 1em;
+  }
+
+  .root-nmONyX[data-size="sm"], [data-scope="spinner"][data-part="root"][data-size="sm"] {
+    --_spinner-size: var(--moduix-spinner-size, var(--moduix-spinner-size-sm, var(--moduix-spacing-4)));
+  }
+
+  .root-nmONyX[data-size="lg"], [data-scope="spinner"][data-part="root"][data-size="lg"] {
+    --_spinner-size: var(--moduix-spinner-size, var(--moduix-spinner-size-lg, var(--moduix-spacing-7)));
+  }
+
+  .root-nmONyX[data-size="xl"], [data-scope="spinner"][data-part="root"][data-size="xl"] {
+    --_spinner-size: var(--moduix-spinner-size, var(--moduix-spinner-size-xl, var(--moduix-size-md)));
+  }
+}
+

package/dist/components/spinner/index.d.ts

@@ -0,0 +1 @@
+export { Spinner } from './Spinner.js';

package/dist/components/spinner/index.js

@@ -0,0 +1 @@
+export { Spinner } from "./Spinner.js";

package/dist/components/spinner/index.jsx

@@ -0,0 +1 @@
+export { Spinner } from "./Spinner.jsx";

package/dist/components/split-button/SplitButton.d.ts

@@ -0,0 +1,41 @@
+import type { ComponentProps, JSX } from 'solid-js';
+import { Button } from '../button/index.js';
+import { Menu } from '../menu/index.js';
+type ButtonProps = ComponentProps<typeof Button>;
+type SplitButtonVariant = Exclude<NonNullable<ButtonProps['variant']>, 'link'>;
+type SplitButtonSize = Exclude<NonNullable<ButtonProps['size']>, 'icon-sm' | 'icon-md' | 'icon-lg'>;
+type SplitButtonRootProps = Omit<ComponentProps<typeof Menu.Root>, 'children'> & {
+    'aria-label'?: string;
+    'aria-labelledby'?: string;
+    children?: JSX.Element;
+    class?: string;
+    ref?: HTMLDivElement | ((element: HTMLDivElement) => void);
+    size?: SplitButtonSize;
+    variant?: SplitButtonVariant;
+};
+type SplitButtonActionProps = Omit<ButtonProps, 'size' | 'variant'> & {
+    size?: SplitButtonSize;
+    variant?: SplitButtonVariant;
+};
+type SplitButtonTriggerProps = Omit<ComponentProps<typeof Menu.Trigger>, 'asChild' | 'children' | 'class'> & {
+    children?: JSX.Element;
+    class?: string;
+    size?: SplitButtonSize;
+    variant?: SplitButtonVariant;
+};
+type SplitButtonContentProps = ComponentProps<typeof Menu.Content>;
+type SplitButtonPositionerProps = ComponentProps<typeof Menu.Positioner>;
+declare function SplitButtonRoot(props: SplitButtonRootProps): JSX.Element;
+declare function SplitButtonAction(props: SplitButtonActionProps): JSX.Element;
+declare function SplitButtonTrigger(props: SplitButtonTriggerProps): JSX.Element;
+declare function SplitButtonPositioner(props: SplitButtonPositionerProps): JSX.Element;
+declare function SplitButtonContent(props: SplitButtonContentProps): JSX.Element;
+type SplitButtonComponent = typeof SplitButtonRoot & {
+    Root: typeof SplitButtonRoot;
+    Action: typeof SplitButtonAction;
+    Trigger: typeof SplitButtonTrigger;
+    Positioner: typeof SplitButtonPositioner;
+    Content: typeof SplitButtonContent;
+};
+declare const SplitButton: SplitButtonComponent;
+export { SplitButton };

package/dist/components/split-button/SplitButton.js

@@ -0,0 +1,168 @@
+import { className, createComponent, effect, insert, memo, mergeProps, setAttribute, template, use } from "solid-js/web";
+import { clsx } from "clsx";
+import { children, createContext, splitProps, useContext } from "solid-js";
+import { ChevronDownIcon } from "../../internal/icons/ui/Icons.js";
+import { Button } from "../button/index.js";
+import { Menu } from "../menu/index.js";
+import SplitButton_module from "./SplitButton.module.js";
+var _tmpl$ = /*#__PURE__*/ template("<div role=group data-scope=split-button data-part=root data-slot=split-button-root>");
+const SplitButtonContext = createContext(null);
+function useSplitButtonContext(componentName) {
+    const context = useContext(SplitButtonContext);
+    if (!context) throw new Error(`${componentName} must be used within SplitButton.Root.`);
+    return context;
+}
+function SplitButtonRoot(props) {
+    const [local, others] = splitProps(props, [
+        'aria-label',
+        'aria-labelledby',
+        'children',
+        'class',
+        'onSelect',
+        'positioning',
+        'ref',
+        'size',
+        'variant'
+    ]);
+    return createComponent(SplitButtonContext.Provider, {
+        value: {
+            size: ()=>local.size ?? 'md',
+            variant: ()=>local.variant ?? 'default'
+        },
+        get children () {
+            return createComponent(Menu.Root, mergeProps({
+                get onSelect () {
+                    return local.onSelect;
+                },
+                get positioning () {
+                    return {
+                        placement: 'bottom-end',
+                        gutter: 4,
+                        ...local.positioning
+                    };
+                }
+            }, others, {
+                get children () {
+                    var _el$ = _tmpl$();
+                    var _ref$ = local.ref;
+                    "function" == typeof _ref$ ? use(_ref$, _el$) : local.ref = _el$;
+                    insert(_el$, ()=>local.children);
+                    effect((_p$)=>{
+                        var _v$ = local['aria-label'], _v$2 = local['aria-labelledby'], _v$3 = clsx(SplitButton_module.root, local.class);
+                        _v$ !== _p$.e && setAttribute(_el$, "aria-label", _p$.e = _v$);
+                        _v$2 !== _p$.t && setAttribute(_el$, "aria-labelledby", _p$.t = _v$2);
+                        _v$3 !== _p$.a && className(_el$, _p$.a = _v$3);
+                        return _p$;
+                    }, {
+                        e: void 0,
+                        t: void 0,
+                        a: void 0
+                    });
+                    return _el$;
+                }
+            }));
+        }
+    });
+}
+function SplitButtonAction(props) {
+    const [local, others] = splitProps(props, [
+        'class',
+        'size',
+        'variant'
+    ]);
+    const context = useSplitButtonContext('SplitButton.Action');
+    return createComponent(Button, mergeProps(others, {
+        "data-slot": "split-button-action",
+        get size () {
+            return local.size ?? context.size();
+        },
+        get variant () {
+            return local.variant ?? context.variant();
+        },
+        get ["class"] () {
+            return clsx(SplitButton_module.action, local.class);
+        }
+    }));
+}
+function SplitButtonTrigger(props) {
+    const [local, others] = splitProps(props, [
+        'children',
+        'class',
+        'size',
+        'variant',
+        'aria-label'
+    ]);
+    const context = useSplitButtonContext('SplitButton.Trigger');
+    const resolvedChildren = children(()=>local.children);
+    const isIconOnly = ()=>null == resolvedChildren();
+    const ariaLabel = ()=>isIconOnly() ? local['aria-label'] ?? 'More actions' : local['aria-label'];
+    return createComponent(Menu.Trigger, mergeProps(others, {
+        asChild: (triggerProps)=>createComponent(Button, mergeProps(triggerProps, {
+                "data-slot": "split-button-trigger",
+                get size () {
+                    return local.size ?? context.size();
+                },
+                get variant () {
+                    return local.variant ?? context.variant();
+                },
+                get ["class"] () {
+                    return clsx(SplitButton_module.trigger, local.class);
+                },
+                get ["aria-label"] () {
+                    return ariaLabel();
+                },
+                get children () {
+                    return resolvedChildren() ?? createComponent(ChevronDownIcon, {});
+                }
+            })),
+        "data-slot": "split-button-trigger",
+        get ["aria-label"] () {
+            return ariaLabel();
+        },
+        get ["class"] () {
+            return clsx(SplitButton_module.trigger, local.class);
+        }
+    }));
+}
+function SplitButtonPositioner(props) {
+    const [local, others] = splitProps(props, [
+        'class'
+    ]);
+    return createComponent(Menu.Positioner, mergeProps(others, {
+        "data-slot": "split-button-positioner",
+        get ["class"] () {
+            return local.class;
+        }
+    }));
+}
+function SplitButtonContent(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'children',
+        'class'
+    ]);
+    return createComponent(Menu.Content, mergeProps(others, {
+        get asChild () {
+            return local.asChild;
+        },
+        "data-slot": "split-button-content",
+        get ["class"] () {
+            return local.class;
+        },
+        get children () {
+            return memo(()=>!!local.asChild)() ? local.children : createComponent(Menu.Viewport, {
+                get children () {
+                    return local.children;
+                }
+            });
+        }
+    }));
+}
+const SplitButton = Object.assign(SplitButtonRoot, {
+    Root: SplitButtonRoot,
+    Action: SplitButtonAction,
+    Trigger: SplitButtonTrigger,
+    Positioner: SplitButtonPositioner,
+    Content: SplitButtonContent
+});
+export { SplitButton };

package/dist/components/split-button/SplitButton.jsx

@@ -0,0 +1,88 @@
+import { clsx } from "clsx";
+import { children, createContext, splitProps, useContext } from "solid-js";
+import { ChevronDownIcon } from "../../internal/icons/ui/Icons.jsx";
+import { Button } from "../button/index.jsx";
+import { Menu } from "../menu/index.jsx";
+import SplitButton_module from "./SplitButton.module.jsx";
+const SplitButtonContext = createContext(null);
+function useSplitButtonContext(componentName) {
+    const context = useContext(SplitButtonContext);
+    if (!context) throw new Error(`${componentName} must be used within SplitButton.Root.`);
+    return context;
+}
+function SplitButtonRoot(props) {
+    const [local, others] = splitProps(props, [
+        'aria-label',
+        'aria-labelledby',
+        'children',
+        'class',
+        'onSelect',
+        'positioning',
+        'ref',
+        'size',
+        'variant'
+    ]);
+    return <SplitButtonContext.Provider value={{
+        size: ()=>local.size ?? 'md',
+        variant: ()=>local.variant ?? 'default'
+    }}>
+      <Menu.Root onSelect={local.onSelect} positioning={{
+        placement: 'bottom-end',
+        gutter: 4,
+        ...local.positioning
+    }} {...others}>
+        <div role="group" aria-label={local['aria-label']} aria-labelledby={local['aria-labelledby']} data-scope="split-button" data-part="root" data-slot="split-button-root" class={clsx(SplitButton_module.root, local.class)} ref={local.ref}>
+          {local.children}
+        </div>
+      </Menu.Root>
+    </SplitButtonContext.Provider>;
+}
+function SplitButtonAction(props) {
+    const [local, others] = splitProps(props, [
+        'class',
+        'size',
+        'variant'
+    ]);
+    const context = useSplitButtonContext('SplitButton.Action');
+    return <Button {...others} data-slot="split-button-action" size={local.size ?? context.size()} variant={local.variant ?? context.variant()} class={clsx(SplitButton_module.action, local.class)}/>;
+}
+function SplitButtonTrigger(props) {
+    const [local, others] = splitProps(props, [
+        'children',
+        'class',
+        'size',
+        'variant',
+        'aria-label'
+    ]);
+    const context = useSplitButtonContext('SplitButton.Trigger');
+    const resolvedChildren = children(()=>local.children);
+    const isIconOnly = ()=>null == resolvedChildren();
+    const ariaLabel = ()=>isIconOnly() ? local['aria-label'] ?? 'More actions' : local['aria-label'];
+    return <Menu.Trigger {...others} asChild={(triggerProps)=><Button {...triggerProps()} data-slot="split-button-trigger" size={local.size ?? context.size()} variant={local.variant ?? context.variant()} class={clsx(SplitButton_module.trigger, local.class)} aria-label={ariaLabel()}>
+          {resolvedChildren() ?? <ChevronDownIcon/>}
+        </Button>} data-slot="split-button-trigger" aria-label={ariaLabel()} class={clsx(SplitButton_module.trigger, local.class)}/>;
+}
+function SplitButtonPositioner(props) {
+    const [local, others] = splitProps(props, [
+        'class'
+    ]);
+    return <Menu.Positioner {...others} data-slot="split-button-positioner" class={local.class}/>;
+}
+function SplitButtonContent(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'children',
+        'class'
+    ]);
+    return <Menu.Content {...others} asChild={local.asChild} data-slot="split-button-content" class={local.class}>
+      {local.asChild ? local.children : <Menu.Viewport>{local.children}</Menu.Viewport>}
+    </Menu.Content>;
+}
+const SplitButton = Object.assign(SplitButtonRoot, {
+    Root: SplitButtonRoot,
+    Action: SplitButtonAction,
+    Trigger: SplitButtonTrigger,
+    Positioner: SplitButtonPositioner,
+    Content: SplitButtonContent
+});
+export { SplitButton };

package/dist/components/split-button/SplitButton.module.js

@@ -0,0 +1,7 @@
+import "./SplitButton_module.css";
+const SplitButton_module = {
+    root: "root-NBz_ov",
+    action: "action-muqo4R",
+    trigger: "trigger-DZQRcF"
+};
+export default SplitButton_module;

package/dist/components/split-button/SplitButton.module.jsx

@@ -0,0 +1,7 @@
+import "./SplitButton_module.css";
+const SplitButton_module = {
+    root: "root-NBz_ov",
+    action: "action-muqo4R",
+    trigger: "trigger-DZQRcF"
+};
+export default SplitButton_module;

package/dist/components/split-button/SplitButton_module.css

@@ -0,0 +1,52 @@
+@layer moduix.components {
+  .root-NBz_ov {
+    align-items: stretch;
+    display: inline-flex;
+  }
+
+  .action-muqo4R {
+    border-start-end-radius: 0;
+    border-end-end-radius: 0;
+  }
+
+  .trigger-DZQRcF {
+    min-width: 0;
+    padding-inline: var(--moduix-split-button-trigger-padding-x-md, var(--moduix-spacing-3));
+    border-start-start-radius: 0;
+    border-end-start-radius: 0;
+    margin-inline-start: calc(var(--moduix-button-border-width, var(--moduix-border-width-sm)) * -1);
+    position: relative;
+  }
+
+  .trigger-DZQRcF:before {
+    content: "";
+    inset-block: var(--moduix-split-button-separator-inset, var(--moduix-spacing-1-5));
+    width: var(--moduix-split-button-separator-width, var(--moduix-border-width-sm));
+    background-color: var(--moduix-split-button-separator-color, currentColor);
+    opacity: var(--moduix-split-button-separator-opacity, .16);
+    pointer-events: none;
+    position: absolute;
+    inset-inline-start: var(--moduix-split-button-separator-offset, 0);
+  }
+
+  .trigger-DZQRcF[data-variant="outline"]:before, .trigger-DZQRcF[data-variant="destructive-outline"]:before {
+    opacity: 0;
+  }
+
+  .trigger-DZQRcF[data-size="xs"] {
+    padding-inline: var(--moduix-split-button-trigger-padding-x-xs, var(--moduix-spacing-2));
+  }
+
+  .trigger-DZQRcF[data-size="sm"] {
+    padding-inline: var(--moduix-split-button-trigger-padding-x-sm, var(--moduix-spacing-2-5));
+  }
+
+  .trigger-DZQRcF[data-size="lg"] {
+    padding-inline: var(--moduix-split-button-trigger-padding-x-lg, var(--moduix-spacing-3-5));
+  }
+
+  .trigger-DZQRcF[data-size="xl"] {
+    padding-inline: var(--moduix-split-button-trigger-padding-x-xl, var(--moduix-spacing-4));
+  }
+}
+

package/dist/components/split-button/index.d.ts

@@ -0,0 +1 @@
+export { SplitButton } from './SplitButton.js';

package/dist/components/split-button/index.js

@@ -0,0 +1 @@
+export { SplitButton } from "./SplitButton.js";

package/dist/components/split-button/index.jsx

@@ -0,0 +1 @@
+export { SplitButton } from "./SplitButton.jsx";

package/dist/components/splitter/Splitter.d.ts

@@ -0,0 +1,18 @@
+import type { SplitterPanelData } from '@ark-ui/solid/splitter';
+import { createSplitterRegistry, Splitter as SplitterPrimitive, useSplitter, useSplitterContext } from '@ark-ui/solid/splitter';
+import type { ComponentProps, JSX } from 'solid-js';
+declare function SplitterRoot(props: ComponentProps<typeof SplitterPrimitive.Root>): JSX.Element;
+declare function SplitterRootProvider(props: ComponentProps<typeof SplitterPrimitive.RootProvider>): JSX.Element;
+declare function SplitterPanel(props: ComponentProps<typeof SplitterPrimitive.Panel>): JSX.Element;
+declare function SplitterResizeTriggerIndicator(props: ComponentProps<typeof SplitterPrimitive.ResizeTriggerIndicator>): JSX.Element;
+declare function SplitterResizeTrigger(props: ComponentProps<typeof SplitterPrimitive.ResizeTrigger>): JSX.Element;
+type SplitterComponent = typeof SplitterRoot & {
+    Root: typeof SplitterRoot;
+    RootProvider: typeof SplitterRootProvider;
+    Context: typeof SplitterPrimitive.Context;
+    Panel: typeof SplitterPanel;
+    ResizeTrigger: typeof SplitterResizeTrigger;
+    ResizeTriggerIndicator: typeof SplitterResizeTriggerIndicator;
+};
+declare const Splitter: SplitterComponent;
+export { createSplitterRegistry, Splitter, type SplitterPanelData, useSplitter, useSplitterContext, };

package/dist/components/splitter/Splitter.js

@@ -0,0 +1,105 @@
+import { createComponent, memo, mergeProps } from "solid-js/web";
+import { Splitter, createSplitterRegistry, useSplitter, useSplitterContext } from "@ark-ui/solid/splitter";
+import { clsx } from "clsx";
+import { splitProps } from "solid-js";
+import Splitter_module from "./Splitter.module.js";
+const rootStyle = {
+    width: 'var(--moduix-splitter-width, 100%)',
+    height: 'var(--moduix-splitter-height, 28rem)'
+};
+function getRootStyle(style) {
+    if ('string' == typeof style) return `width:${rootStyle.width};height:${rootStyle.height};${style}`;
+    return {
+        ...rootStyle,
+        ...style
+    };
+}
+function SplitterRoot(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'class',
+        'style'
+    ]);
+    return createComponent(Splitter.Root, mergeProps({
+        get asChild () {
+            return local.asChild;
+        },
+        "data-slot": "splitter-root",
+        get ["class"] () {
+            return clsx(Splitter_module.root, local.class);
+        },
+        get style () {
+            return getRootStyle(local.style);
+        }
+    }, others));
+}
+function SplitterRootProvider(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'class',
+        'style'
+    ]);
+    return createComponent(Splitter.RootProvider, mergeProps({
+        get asChild () {
+            return local.asChild;
+        },
+        "data-slot": "splitter-root-provider",
+        get ["class"] () {
+            return clsx(Splitter_module.root, local.class);
+        },
+        get style () {
+            return getRootStyle(local.style);
+        }
+    }, others));
+}
+function SplitterPanel(props) {
+    const [local, others] = splitProps(props, [
+        'class'
+    ]);
+    return createComponent(Splitter.Panel, mergeProps({
+        "data-slot": "splitter-panel",
+        get ["class"] () {
+            return clsx(Splitter_module.panel, local.class);
+        }
+    }, others));
+}
+function SplitterResizeTriggerIndicator(props) {
+    const [local, others] = splitProps(props, [
+        'class'
+    ]);
+    return createComponent(Splitter.ResizeTriggerIndicator, mergeProps({
+        "data-slot": "splitter-resize-trigger-indicator",
+        get ["class"] () {
+            return clsx(Splitter_module.resizeTriggerIndicator, local.class);
+        }
+    }, others));
+}
+function SplitterResizeTrigger(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'children',
+        'class'
+    ]);
+    return createComponent(Splitter.ResizeTrigger, mergeProps({
+        get asChild () {
+            return local.asChild;
+        },
+        "data-slot": "splitter-resize-trigger",
+        get ["class"] () {
+            return clsx(Splitter_module.resizeTrigger, local.class);
+        }
+    }, others, {
+        get children () {
+            return memo(()=>!!(void 0 === local.children && !local.asChild))() ? createComponent(SplitterResizeTriggerIndicator, {}) : local.children;
+        }
+    }));
+}
+const Splitter_Splitter = Object.assign(SplitterRoot, {
+    Root: SplitterRoot,
+    RootProvider: SplitterRootProvider,
+    Context: Splitter.Context,
+    Panel: SplitterPanel,
+    ResizeTrigger: SplitterResizeTrigger,
+    ResizeTriggerIndicator: SplitterResizeTriggerIndicator
+});
+export { Splitter_Splitter as Splitter, createSplitterRegistry, useSplitter, useSplitterContext };

package/dist/components/splitter/Splitter.jsx

@@ -0,0 +1,62 @@
+import { Splitter, createSplitterRegistry, useSplitter, useSplitterContext } from "@ark-ui/solid/splitter";
+import { clsx } from "clsx";
+import { splitProps } from "solid-js";
+import Splitter_module from "./Splitter.module.jsx";
+const rootStyle = {
+    width: 'var(--moduix-splitter-width, 100%)',
+    height: 'var(--moduix-splitter-height, 28rem)'
+};
+function getRootStyle(style) {
+    if ('string' == typeof style) return `width:${rootStyle.width};height:${rootStyle.height};${style}`;
+    return {
+        ...rootStyle,
+        ...style
+    };
+}
+function SplitterRoot(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'class',
+        'style'
+    ]);
+    return <Splitter.Root asChild={local.asChild} data-slot="splitter-root" class={clsx(Splitter_module.root, local.class)} style={getRootStyle(local.style)} {...others}/>;
+}
+function SplitterRootProvider(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'class',
+        'style'
+    ]);
+    return <Splitter.RootProvider asChild={local.asChild} data-slot="splitter-root-provider" class={clsx(Splitter_module.root, local.class)} style={getRootStyle(local.style)} {...others}/>;
+}
+function SplitterPanel(props) {
+    const [local, others] = splitProps(props, [
+        'class'
+    ]);
+    return <Splitter.Panel data-slot="splitter-panel" class={clsx(Splitter_module.panel, local.class)} {...others}/>;
+}
+function SplitterResizeTriggerIndicator(props) {
+    const [local, others] = splitProps(props, [
+        'class'
+    ]);
+    return <Splitter.ResizeTriggerIndicator data-slot="splitter-resize-trigger-indicator" class={clsx(Splitter_module.resizeTriggerIndicator, local.class)} {...others}/>;
+}
+function SplitterResizeTrigger(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'children',
+        'class'
+    ]);
+    return <Splitter.ResizeTrigger asChild={local.asChild} data-slot="splitter-resize-trigger" class={clsx(Splitter_module.resizeTrigger, local.class)} {...others}>
+      {void 0 === local.children && !local.asChild ? <SplitterResizeTriggerIndicator/> : local.children}
+    </Splitter.ResizeTrigger>;
+}
+const Splitter_Splitter = Object.assign(SplitterRoot, {
+    Root: SplitterRoot,
+    RootProvider: SplitterRootProvider,
+    Context: Splitter.Context,
+    Panel: SplitterPanel,
+    ResizeTrigger: SplitterResizeTrigger,
+    ResizeTriggerIndicator: SplitterResizeTriggerIndicator
+});
+export { Splitter_Splitter as Splitter, createSplitterRegistry, useSplitter, useSplitterContext };

package/dist/components/splitter/Splitter.module.js

@@ -0,0 +1,8 @@
+import "./Splitter_module.css";
+const Splitter_module = {
+    root: "root-qJovVx",
+    panel: "panel-s3apyp",
+    resizeTrigger: "resizeTrigger-RVtsVR",
+    resizeTriggerIndicator: "resizeTriggerIndicator-V3g1ak"
+};
+export default Splitter_module;

package/dist/components/splitter/Splitter.module.jsx

@@ -0,0 +1,8 @@
+import "./Splitter_module.css";
+const Splitter_module = {
+    root: "root-qJovVx",
+    panel: "panel-s3apyp",
+    resizeTrigger: "resizeTrigger-RVtsVR",
+    resizeTriggerIndicator: "resizeTriggerIndicator-V3g1ak"
+};
+export default Splitter_module;