@moduix/solid-tailwind 1.0.0

package/dist/components/separator/Separator.js

@@ -0,0 +1,127 @@
+import { createComponent, memo, mergeProps } from "solid-js/web";
+import { ark } from "@ark-ui/solid/factory";
+import { cva } from "class-variance-authority";
+import { splitProps } from "solid-js";
+import { cn } from "../../internal/cn.js";
+const separatorVariants = cva('block shrink-0 border-border', {
+    variants: {
+        orientation: {
+            horizontal: 'h-0 w-full',
+            vertical: 'h-[1em] w-0'
+        },
+        size: {
+            xs: '',
+            sm: '',
+            md: '',
+            lg: ''
+        },
+        variant: {
+            solid: 'border-solid',
+            dashed: 'border-dashed',
+            dotted: 'border-dotted'
+        }
+    },
+    compoundVariants: [
+        {
+            orientation: 'horizontal',
+            size: 'xs',
+            class: 'border-t-[0.5px]'
+        },
+        {
+            orientation: 'horizontal',
+            size: 'sm',
+            class: 'border-t'
+        },
+        {
+            orientation: 'horizontal',
+            size: 'md',
+            class: 'border-t-2'
+        },
+        {
+            orientation: 'horizontal',
+            size: 'lg',
+            class: 'border-t-[3px]'
+        },
+        {
+            orientation: 'vertical',
+            size: 'xs',
+            class: 'border-s-[0.5px]'
+        },
+        {
+            orientation: 'vertical',
+            size: 'sm',
+            class: 'border-s'
+        },
+        {
+            orientation: 'vertical',
+            size: 'md',
+            class: 'border-s-2'
+        },
+        {
+            orientation: 'vertical',
+            size: 'lg',
+            class: 'border-s-[3px]'
+        }
+    ],
+    defaultVariants: {
+        orientation: 'horizontal',
+        size: 'sm',
+        variant: 'solid'
+    }
+});
+function SeparatorRoot(props) {
+    const [local, others] = splitProps(props, [
+        'aria-orientation',
+        'asChild',
+        'class',
+        'data-orientation',
+        'data-part',
+        'data-scope',
+        'data-size',
+        'data-slot',
+        'data-variant',
+        'orientation',
+        'role',
+        'size',
+        'variant'
+    ]);
+    const orientation = ()=>local.orientation ?? 'horizontal';
+    const role = ()=>local.role ?? 'separator';
+    const size = ()=>local.size ?? 'sm';
+    const variant = ()=>local.variant ?? 'solid';
+    return createComponent(ark.span, mergeProps({
+        get asChild () {
+            return local.asChild;
+        }
+    }, others, {
+        get role () {
+            return role();
+        },
+        get ["aria-orientation"] () {
+            return memo(()=>'separator' === role())() ? orientation() : void 0;
+        },
+        "data-scope": "separator",
+        "data-part": "root",
+        "data-slot": "separator-root",
+        get ["data-orientation"] () {
+            return orientation();
+        },
+        get ["data-size"] () {
+            return size();
+        },
+        get ["data-variant"] () {
+            return variant();
+        },
+        get ["class"] () {
+            return cn(separatorVariants({
+                orientation: orientation(),
+                size: size(),
+                variant: variant()
+            }), local.class);
+        }
+    }));
+}
+const Separator = Object.assign(SeparatorRoot, {
+    Root: SeparatorRoot
+});
+export { Separator };

package/dist/components/separator/Separator.jsx

@@ -0,0 +1,100 @@
+import { ark } from "@ark-ui/solid/factory";
+import { cva } from "class-variance-authority";
+import { splitProps } from "solid-js";
+import { cn } from "../../internal/cn.jsx";
+const separatorVariants = cva('block shrink-0 border-border', {
+    variants: {
+        orientation: {
+            horizontal: 'h-0 w-full',
+            vertical: 'h-[1em] w-0'
+        },
+        size: {
+            xs: '',
+            sm: '',
+            md: '',
+            lg: ''
+        },
+        variant: {
+            solid: 'border-solid',
+            dashed: 'border-dashed',
+            dotted: 'border-dotted'
+        }
+    },
+    compoundVariants: [
+        {
+            orientation: 'horizontal',
+            size: 'xs',
+            class: 'border-t-[0.5px]'
+        },
+        {
+            orientation: 'horizontal',
+            size: 'sm',
+            class: 'border-t'
+        },
+        {
+            orientation: 'horizontal',
+            size: 'md',
+            class: 'border-t-2'
+        },
+        {
+            orientation: 'horizontal',
+            size: 'lg',
+            class: 'border-t-[3px]'
+        },
+        {
+            orientation: 'vertical',
+            size: 'xs',
+            class: 'border-s-[0.5px]'
+        },
+        {
+            orientation: 'vertical',
+            size: 'sm',
+            class: 'border-s'
+        },
+        {
+            orientation: 'vertical',
+            size: 'md',
+            class: 'border-s-2'
+        },
+        {
+            orientation: 'vertical',
+            size: 'lg',
+            class: 'border-s-[3px]'
+        }
+    ],
+    defaultVariants: {
+        orientation: 'horizontal',
+        size: 'sm',
+        variant: 'solid'
+    }
+});
+function SeparatorRoot(props) {
+    const [local, others] = splitProps(props, [
+        'aria-orientation',
+        'asChild',
+        'class',
+        'data-orientation',
+        'data-part',
+        'data-scope',
+        'data-size',
+        'data-slot',
+        'data-variant',
+        'orientation',
+        'role',
+        'size',
+        'variant'
+    ]);
+    const orientation = ()=>local.orientation ?? 'horizontal';
+    const role = ()=>local.role ?? 'separator';
+    const size = ()=>local.size ?? 'sm';
+    const variant = ()=>local.variant ?? 'solid';
+    return <ark.span asChild={local.asChild} {...others} role={role()} aria-orientation={'separator' === role() ? orientation() : void 0} data-scope="separator" data-part="root" data-slot="separator-root" data-orientation={orientation()} data-size={size()} data-variant={variant()} class={cn(separatorVariants({
+        orientation: orientation(),
+        size: size(),
+        variant: variant()
+    }), local.class)}/>;
+}
+const Separator = Object.assign(SeparatorRoot, {
+    Root: SeparatorRoot
+});
+export { Separator };

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

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

package/dist/components/separator/index.js

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

package/dist/components/separator/index.jsx

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

package/dist/components/sidebar/Sidebar.d.ts

@@ -0,0 +1,82 @@
+import type { HTMLArkProps } from '@ark-ui/solid/factory';
+import type { Accessor, ComponentProps } from 'solid-js';
+import { Input } from '../input/index.js';
+import { Separator } from '../separator/index.js';
+import { Splitter } from '../splitter/index.js';
+import { Tooltip } from '../tooltip/index.js';
+type SidebarSide = 'left' | 'right';
+type SidebarRootProps = Omit<ComponentProps<typeof Splitter.Root>, 'orientation' | 'panels'> & {
+    panelId?: string;
+    side?: SidebarSide;
+};
+type SidebarPanelProps = Omit<ComponentProps<typeof Splitter.Panel>, 'id'>;
+type SidebarResizeTriggerProps = Omit<ComponentProps<typeof Splitter.ResizeTrigger>, 'id'>;
+type SidebarTriggerProps = HTMLArkProps<'button'>;
+declare function SidebarRoot(props: SidebarRootProps): import("solid-js").JSX.Element;
+declare function useSidebar(): {
+    collapsed: () => boolean;
+    side: Accessor<SidebarSide>;
+    state: () => "collapsed" | "expanded";
+    toggleSidebar: () => void;
+};
+declare function SidebarPanel(props: SidebarPanelProps): import("solid-js").JSX.Element;
+declare function SidebarInset(props: SidebarPanelProps): import("solid-js").JSX.Element;
+declare function SidebarResizeTrigger(props: SidebarResizeTriggerProps): import("solid-js").JSX.Element;
+declare function SidebarTrigger(props: SidebarTriggerProps): import("solid-js").JSX.Element;
+declare function SidebarLabel(props: HTMLArkProps<'span'>): import("solid-js").JSX.Element;
+declare function SidebarHeader(props: HTMLArkProps<'header'>): import("solid-js").JSX.Element;
+declare function SidebarContent(props: HTMLArkProps<'div'>): import("solid-js").JSX.Element;
+declare function SidebarExpandedContent(props: HTMLArkProps<'div'>): import("solid-js").JSX.Element;
+declare function SidebarCollapsedContent(props: HTMLArkProps<'div'>): import("solid-js").JSX.Element;
+declare function SidebarFooter(props: HTMLArkProps<'footer'>): import("solid-js").JSX.Element;
+declare function SidebarGroup(props: HTMLArkProps<'section'>): import("solid-js").JSX.Element;
+declare function SidebarGroupHeader(props: HTMLArkProps<'div'>): import("solid-js").JSX.Element;
+declare function SidebarGroupLabel(props: HTMLArkProps<'h3'>): import("solid-js").JSX.Element;
+declare function SidebarGroupAction(props: HTMLArkProps<'button'>): import("solid-js").JSX.Element;
+declare function SidebarNavigationList(props: HTMLArkProps<'ul'>): import("solid-js").JSX.Element;
+declare function SidebarNavigationItem(props: HTMLArkProps<'li'>): import("solid-js").JSX.Element;
+declare function SidebarNavigationButton(props: HTMLArkProps<'button'> & {
+    active?: boolean;
+    size?: 'sm' | 'md' | 'lg';
+}): import("solid-js").JSX.Element;
+declare function SidebarNavigationBadge(props: HTMLArkProps<'span'>): import("solid-js").JSX.Element;
+declare function SidebarNavigationSubList(props: HTMLArkProps<'ul'>): import("solid-js").JSX.Element;
+declare function SidebarNavigationSubItem(props: HTMLArkProps<'li'>): import("solid-js").JSX.Element;
+declare function SidebarNavigationSubButton(props: HTMLArkProps<'a'> & {
+    active?: boolean;
+}): import("solid-js").JSX.Element;
+declare function SidebarTooltip(props: Omit<ComponentProps<typeof Tooltip>, 'children' | 'disabled' | 'positioning'> & {
+    children: NonNullable<ComponentProps<typeof Tooltip.Trigger>['asChild']>;
+    content: ComponentProps<typeof Tooltip.Content>['children'];
+    positioning?: ComponentProps<typeof Tooltip>['positioning'];
+}): import("solid-js").JSX.Element;
+declare function SidebarInput(props: ComponentProps<typeof Input.Root>): import("solid-js").JSX.Element;
+declare function SidebarSeparator(props: ComponentProps<typeof Separator.Root>): import("solid-js").JSX.Element;
+declare const Sidebar: typeof SidebarRoot & {
+    Root: typeof SidebarRoot;
+    Panel: typeof SidebarPanel;
+    Inset: typeof SidebarInset;
+    ResizeTrigger: typeof SidebarResizeTrigger;
+    Trigger: typeof SidebarTrigger;
+    Label: typeof SidebarLabel;
+    Input: typeof SidebarInput;
+    Header: typeof SidebarHeader;
+    Content: typeof SidebarContent;
+    ExpandedContent: typeof SidebarExpandedContent;
+    CollapsedContent: typeof SidebarCollapsedContent;
+    Footer: typeof SidebarFooter;
+    Separator: typeof SidebarSeparator;
+    Group: typeof SidebarGroup;
+    GroupHeader: typeof SidebarGroupHeader;
+    GroupLabel: typeof SidebarGroupLabel;
+    GroupAction: typeof SidebarGroupAction;
+    NavigationList: typeof SidebarNavigationList;
+    NavigationItem: typeof SidebarNavigationItem;
+    Tooltip: typeof SidebarTooltip;
+    NavigationButton: typeof SidebarNavigationButton;
+    NavigationBadge: typeof SidebarNavigationBadge;
+    NavigationSubList: typeof SidebarNavigationSubList;
+    NavigationSubItem: typeof SidebarNavigationSubItem;
+    NavigationSubButton: typeof SidebarNavigationSubButton;
+};
+export { Sidebar, useSidebar };