@moduix/solid-tailwind 1.0.0

package/dist/components/date-input/DateInput.js

@@ -0,0 +1,136 @@
+import { createComponent, mergeProps, spread, template } from "solid-js/web";
+import { DateInput, useDateInput, useDateInputContext } from "@ark-ui/solid/date-input";
+import { splitProps } from "solid-js";
+import { cn } from "../../internal/cn.js";
+var _tmpl$ = /*#__PURE__*/ template("<span data-slot=date-input-separator>");
+function DateInputRoot(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'children',
+        'class'
+    ]);
+    return createComponent(DateInput.Root, mergeProps({
+        get asChild () {
+            return local.asChild;
+        },
+        "data-slot": "date-input-root",
+        get ["class"] () {
+            return cn('inline-flex w-full max-w-none flex-col items-start gap-1 data-disabled:opacity-50', local.class);
+        }
+    }, others, {
+        get children () {
+            return local.children;
+        }
+    }));
+}
+function DateInputRootProvider(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'children',
+        'class'
+    ]);
+    return createComponent(DateInput.RootProvider, mergeProps({
+        get asChild () {
+            return local.asChild;
+        },
+        "data-slot": "date-input-root-provider",
+        get ["class"] () {
+            return cn('inline-flex w-full max-w-none flex-col items-start gap-1 data-disabled:opacity-50', local.class);
+        }
+    }, others, {
+        get children () {
+            return local.children;
+        }
+    }));
+}
+function DateInputLabel(props) {
+    const [local, others] = splitProps(props, [
+        'class'
+    ]);
+    return createComponent(DateInput.Label, mergeProps({
+        "data-slot": "date-input-label",
+        get ["class"] () {
+            return cn('text-sm leading-5 font-medium text-foreground', local.class);
+        }
+    }, others));
+}
+function DateInputControl(props) {
+    const [local, others] = splitProps(props, [
+        'class'
+    ]);
+    return createComponent(DateInput.Control, mergeProps({
+        "data-slot": "date-input-control",
+        get ["class"] () {
+            return cn('box-border inline-flex min-h-control-md w-full items-center rounded-md border border-border bg-background px-3 py-1 text-foreground outline-1 -outline-offset-1 outline-transparent transition-[border-color,outline-color,opacity] duration-200 ease-in-out focus-within:outline-ring data-disabled:pointer-events-none data-focus:outline-ring data-invalid:border-destructive data-invalid:focus-within:outline-destructive data-invalid:data-focus:outline-destructive motion-reduce:transition-none', local.class);
+        }
+    }, others));
+}
+function DateInputSegmentGroup(props) {
+    const [local, others] = splitProps(props, [
+        'class'
+    ]);
+    return createComponent(DateInput.SegmentGroup, mergeProps({
+        "data-slot": "date-input-segment-group",
+        get ["class"] () {
+            return cn('inline-flex items-center gap-0.5 tabular-nums', local.class);
+        }
+    }, others));
+}
+function DateInputSegment(props) {
+    const [local, others] = splitProps(props, [
+        'class'
+    ]);
+    return createComponent(DateInput.Segment, mergeProps({
+        "data-slot": "date-input-segment",
+        get ["class"] () {
+            return cn('min-w-[2ch] cursor-text rounded-sm px-1 py-0 text-center leading-6 text-current outline-0 transition-colors duration-200 ease-in-out [font:inherit] focus-visible:bg-ring/18 focus-visible:text-foreground data-disabled:cursor-default data-placeholder-shown:text-muted-foreground data-readonly:cursor-default data-[type=literal]:pointer-events-none data-[type=literal]:min-w-auto data-[type=literal]:bg-transparent data-[type=literal]:px-0 data-[type=literal]:text-muted-foreground motion-reduce:transition-none', local.class);
+        }
+    }, others));
+}
+function DateInputSegments(props) {
+    return createComponent(DateInputSegmentGroup, mergeProps(props, {
+        get children () {
+            return createComponent(DateInput.SegmentContext, {
+                children: (segment)=>createComponent(DateInputSegment, {
+                        segment: segment
+                    })
+            });
+        }
+    }));
+}
+function DateInputSeparator(props) {
+    const [local, others] = splitProps(props, [
+        'aria-hidden',
+        'class',
+        'role'
+    ]);
+    return (()=>{
+        var _el$ = _tmpl$();
+        spread(_el$, mergeProps({
+            get ["aria-hidden"] () {
+                return local['aria-hidden'] ?? true;
+            },
+            get role () {
+                return local.role ?? 'presentation';
+            },
+            get ["class"] () {
+                return cn('text-muted-foreground select-none', local.class);
+            }
+        }, others), false, false);
+        return _el$;
+    })();
+}
+const DateInput_DateInput = Object.assign(DateInputRoot, {
+    Root: DateInputRoot,
+    RootProvider: DateInputRootProvider,
+    HiddenInput: DateInput.HiddenInput,
+    Label: DateInputLabel,
+    Control: DateInputControl,
+    SegmentGroup: DateInputSegmentGroup,
+    Segment: DateInputSegment,
+    Segments: DateInputSegments,
+    Separator: DateInputSeparator,
+    Context: DateInput.Context,
+    SegmentContext: DateInput.SegmentContext
+});
+export { DateInput_DateInput as DateInput, useDateInput, useDateInputContext };

package/dist/components/date-input/DateInput.jsx

@@ -0,0 +1,76 @@
+import { DateInput, useDateInput, useDateInputContext } from "@ark-ui/solid/date-input";
+import { splitProps } from "solid-js";
+import { cn } from "../../internal/cn.jsx";
+function DateInputRoot(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'children',
+        'class'
+    ]);
+    return <DateInput.Root asChild={local.asChild} data-slot="date-input-root" class={cn('inline-flex w-full max-w-none flex-col items-start gap-1 data-disabled:opacity-50', local.class)} {...others}>
+      {local.children}
+    </DateInput.Root>;
+}
+function DateInputRootProvider(props) {
+    const [local, others] = splitProps(props, [
+        'asChild',
+        'children',
+        'class'
+    ]);
+    return <DateInput.RootProvider asChild={local.asChild} data-slot="date-input-root-provider" class={cn('inline-flex w-full max-w-none flex-col items-start gap-1 data-disabled:opacity-50', local.class)} {...others}>
+      {local.children}
+    </DateInput.RootProvider>;
+}
+function DateInputLabel(props) {
+    const [local, others] = splitProps(props, [
+        'class'
+    ]);
+    return <DateInput.Label data-slot="date-input-label" class={cn('text-sm leading-5 font-medium text-foreground', local.class)} {...others}/>;
+}
+function DateInputControl(props) {
+    const [local, others] = splitProps(props, [
+        'class'
+    ]);
+    return <DateInput.Control data-slot="date-input-control" class={cn('box-border inline-flex min-h-control-md w-full items-center rounded-md border border-border bg-background px-3 py-1 text-foreground outline-1 -outline-offset-1 outline-transparent transition-[border-color,outline-color,opacity] duration-200 ease-in-out focus-within:outline-ring data-disabled:pointer-events-none data-focus:outline-ring data-invalid:border-destructive data-invalid:focus-within:outline-destructive data-invalid:data-focus:outline-destructive motion-reduce:transition-none', local.class)} {...others}/>;
+}
+function DateInputSegmentGroup(props) {
+    const [local, others] = splitProps(props, [
+        'class'
+    ]);
+    return <DateInput.SegmentGroup data-slot="date-input-segment-group" class={cn('inline-flex items-center gap-0.5 tabular-nums', local.class)} {...others}/>;
+}
+function DateInputSegment(props) {
+    const [local, others] = splitProps(props, [
+        'class'
+    ]);
+    return <DateInput.Segment data-slot="date-input-segment" class={cn('min-w-[2ch] cursor-text rounded-sm px-1 py-0 text-center leading-6 text-current outline-0 transition-colors duration-200 ease-in-out [font:inherit] focus-visible:bg-ring/18 focus-visible:text-foreground data-disabled:cursor-default data-placeholder-shown:text-muted-foreground data-readonly:cursor-default data-[type=literal]:pointer-events-none data-[type=literal]:min-w-auto data-[type=literal]:bg-transparent data-[type=literal]:px-0 data-[type=literal]:text-muted-foreground motion-reduce:transition-none', local.class)} {...others}/>;
+}
+function DateInputSegments(props) {
+    return <DateInputSegmentGroup {...props}>
+      <DateInput.SegmentContext>
+        {(segment)=><DateInputSegment segment={segment}/>}
+      </DateInput.SegmentContext>
+    </DateInputSegmentGroup>;
+}
+function DateInputSeparator(props) {
+    const [local, others] = splitProps(props, [
+        'aria-hidden',
+        'class',
+        'role'
+    ]);
+    return <span data-slot="date-input-separator" aria-hidden={local['aria-hidden'] ?? true} role={local.role ?? 'presentation'} class={cn('text-muted-foreground select-none', local.class)} {...others}/>;
+}
+const DateInput_DateInput = Object.assign(DateInputRoot, {
+    Root: DateInputRoot,
+    RootProvider: DateInputRootProvider,
+    HiddenInput: DateInput.HiddenInput,
+    Label: DateInputLabel,
+    Control: DateInputControl,
+    SegmentGroup: DateInputSegmentGroup,
+    Segment: DateInputSegment,
+    Segments: DateInputSegments,
+    Separator: DateInputSeparator,
+    Context: DateInput.Context,
+    SegmentContext: DateInput.SegmentContext
+});
+export { DateInput_DateInput as DateInput, useDateInput, useDateInputContext };

package/dist/components/date-input/index.d.ts

@@ -0,0 +1 @@
+export { DateInput, useDateInput, useDateInputContext, type DateInputDateValue } from './DateInput.js';

package/dist/components/date-input/index.js

@@ -0,0 +1 @@
+export { DateInput, useDateInput, useDateInputContext } from "./DateInput.js";

package/dist/components/date-input/index.jsx

@@ -0,0 +1 @@
+export { DateInput, useDateInput, useDateInputContext } from "./DateInput.jsx";

package/dist/components/date-picker/DatePicker.d.ts

@@ -0,0 +1,98 @@
+import { DatePicker as DatePickerPrimitive, useDatePicker, useDatePickerContext, type UseDatePickerReturn } from '@ark-ui/solid/date-picker';
+import type { ComponentProps } from 'solid-js';
+import { type OverlayPortalProps } from '../../internal/overlayPortal.js';
+type DatePickerRootProps = ComponentProps<typeof DatePickerPrimitive.Root> & OverlayPortalProps;
+type DatePickerRootProviderProps = ComponentProps<typeof DatePickerPrimitive.RootProvider> & OverlayPortalProps;
+type DatePickerFieldProps = ComponentProps<typeof DatePickerPrimitive.Control> & {
+    clearLabel?: string;
+    clearTriggerProps?: ComponentProps<typeof DatePickerPrimitive.ClearTrigger>;
+    inputProps?: ComponentProps<typeof DatePickerPrimitive.Input>;
+    placeholder?: ComponentProps<typeof DatePickerPrimitive.Input>['placeholder'];
+    triggerLabel?: string;
+    triggerProps?: ComponentProps<typeof DatePickerPrimitive.Trigger>;
+};
+type DatePickerRangeFieldProps = ComponentProps<typeof DatePickerPrimitive.Control> & {
+    clearLabel?: string;
+    clearTriggerProps?: ComponentProps<typeof DatePickerPrimitive.ClearTrigger>;
+    endInputProps?: ComponentProps<typeof DatePickerPrimitive.Input>;
+    endPlaceholder?: ComponentProps<typeof DatePickerPrimitive.Input>['placeholder'];
+    startInputProps?: ComponentProps<typeof DatePickerPrimitive.Input>;
+    startPlaceholder?: ComponentProps<typeof DatePickerPrimitive.Input>['placeholder'];
+    triggerLabel?: string;
+    triggerProps?: ComponentProps<typeof DatePickerPrimitive.Trigger>;
+};
+type DatePickerApi = ReturnType<UseDatePickerReturn>;
+type DatePickerOffset = ReturnType<DatePickerApi['getOffset']>;
+type DatePickerDayTableProps = ComponentProps<typeof DatePickerPrimitive.Table> & {
+    offset?: DatePickerOffset;
+    showHeader?: boolean;
+    showWeekNumbers?: boolean;
+};
+declare function DatePickerRoot(props: DatePickerRootProps): import("solid-js").JSX.Element;
+declare function DatePickerRootProvider(props: DatePickerRootProviderProps): import("solid-js").JSX.Element;
+declare function DatePickerLabel(props: ComponentProps<typeof DatePickerPrimitive.Label>): import("solid-js").JSX.Element;
+declare function DatePickerControl(props: ComponentProps<typeof DatePickerPrimitive.Control>): import("solid-js").JSX.Element;
+declare function DatePickerField(props: DatePickerFieldProps): import("solid-js").JSX.Element;
+declare function DatePickerRangeField(props: DatePickerRangeFieldProps): import("solid-js").JSX.Element;
+declare function DatePickerInput(props: ComponentProps<typeof DatePickerPrimitive.Input>): import("solid-js").JSX.Element;
+declare function DatePickerTrigger(props: ComponentProps<typeof DatePickerPrimitive.Trigger>): import("solid-js").JSX.Element;
+declare function DatePickerClearTrigger(props: ComponentProps<typeof DatePickerPrimitive.ClearTrigger>): import("solid-js").JSX.Element;
+declare function DatePickerPositioner(props: ComponentProps<typeof DatePickerPrimitive.Positioner>): import("solid-js").JSX.Element;
+declare function DatePickerContent(props: ComponentProps<typeof DatePickerPrimitive.Content>): import("solid-js").JSX.Element;
+declare function DatePickerView(props: ComponentProps<typeof DatePickerPrimitive.View>): import("solid-js").JSX.Element;
+declare function DatePickerViewControl(props: ComponentProps<typeof DatePickerPrimitive.ViewControl>): import("solid-js").JSX.Element;
+declare function DatePickerPrevTrigger(props: ComponentProps<typeof DatePickerPrimitive.PrevTrigger>): import("solid-js").JSX.Element;
+declare function DatePickerNextTrigger(props: ComponentProps<typeof DatePickerPrimitive.NextTrigger>): import("solid-js").JSX.Element;
+declare function DatePickerRangeText(props: ComponentProps<typeof DatePickerPrimitive.RangeText>): import("solid-js").JSX.Element;
+declare function DatePickerViewTrigger(props: ComponentProps<typeof DatePickerPrimitive.ViewTrigger>): import("solid-js").JSX.Element;
+declare function DatePickerTable(props: ComponentProps<typeof DatePickerPrimitive.Table>): import("solid-js").JSX.Element;
+declare function DatePickerTableHead(props: ComponentProps<typeof DatePickerPrimitive.TableHead>): import("solid-js").JSX.Element;
+declare function DatePickerTableBody(props: ComponentProps<typeof DatePickerPrimitive.TableBody>): import("solid-js").JSX.Element;
+declare function DatePickerTableRow(props: ComponentProps<typeof DatePickerPrimitive.TableRow>): import("solid-js").JSX.Element;
+declare function DatePickerTableHeader(props: ComponentProps<typeof DatePickerPrimitive.TableHeader>): import("solid-js").JSX.Element;
+declare function DatePickerWeekNumberHeaderCell(props: ComponentProps<typeof DatePickerPrimitive.WeekNumberHeaderCell>): import("solid-js").JSX.Element;
+declare function DatePickerWeekNumberCell(props: ComponentProps<typeof DatePickerPrimitive.WeekNumberCell>): import("solid-js").JSX.Element;
+declare function DatePickerTableCell(props: ComponentProps<typeof DatePickerPrimitive.TableCell>): import("solid-js").JSX.Element;
+declare function DatePickerTableCellTrigger(props: ComponentProps<typeof DatePickerPrimitive.TableCellTrigger>): import("solid-js").JSX.Element;
+declare function DatePickerDayTable(props: DatePickerDayTableProps): import("solid-js").JSX.Element;
+declare function DatePickerMonthSelect(props: ComponentProps<typeof DatePickerPrimitive.MonthSelect>): import("solid-js").JSX.Element;
+declare function DatePickerYearSelect(props: ComponentProps<typeof DatePickerPrimitive.YearSelect>): import("solid-js").JSX.Element;
+declare function DatePickerPresetTrigger(props: ComponentProps<typeof DatePickerPrimitive.PresetTrigger>): import("solid-js").JSX.Element;
+declare function DatePickerValueText(props: ComponentProps<typeof DatePickerPrimitive.ValueText>): import("solid-js").JSX.Element;
+type DatePickerComponent = typeof DatePickerRoot & {
+    Root: typeof DatePickerRoot;
+    RootProvider: typeof DatePickerRootProvider;
+    Context: typeof DatePickerPrimitive.Context;
+    Label: typeof DatePickerLabel;
+    Control: typeof DatePickerControl;
+    Field: typeof DatePickerField;
+    RangeField: typeof DatePickerRangeField;
+    Input: typeof DatePickerInput;
+    Trigger: typeof DatePickerTrigger;
+    ClearTrigger: typeof DatePickerClearTrigger;
+    Positioner: typeof DatePickerPositioner;
+    Content: typeof DatePickerContent;
+    View: typeof DatePickerView;
+    ViewControl: typeof DatePickerViewControl;
+    PrevTrigger: typeof DatePickerPrevTrigger;
+    NextTrigger: typeof DatePickerNextTrigger;
+    ViewTrigger: typeof DatePickerViewTrigger;
+    RangeText: typeof DatePickerRangeText;
+    ValueText: typeof DatePickerValueText;
+    Table: typeof DatePickerTable;
+    TableHead: typeof DatePickerTableHead;
+    TableBody: typeof DatePickerTableBody;
+    TableRow: typeof DatePickerTableRow;
+    TableHeader: typeof DatePickerTableHeader;
+    TableCell: typeof DatePickerTableCell;
+    TableCellTrigger: typeof DatePickerTableCellTrigger;
+    DayTable: typeof DatePickerDayTable;
+    WeekNumberHeaderCell: typeof DatePickerWeekNumberHeaderCell;
+    WeekNumberCell: typeof DatePickerWeekNumberCell;
+    MonthSelect: typeof DatePickerMonthSelect;
+    YearSelect: typeof DatePickerYearSelect;
+    PresetTrigger: typeof DatePickerPresetTrigger;
+};
+declare const DatePicker: DatePickerComponent;
+export { DatePicker, useDatePicker, useDatePickerContext };
+export type { DatePickerDayTableProps, DatePickerFieldProps, DatePickerRangeFieldProps, DatePickerRootProps, DatePickerRootProviderProps, };