@admin-layout/gluestack-ui-mobile 10.0.9-alpha.9 → 10.1.1-alpha.8

package/lib/components/ui/select/index.web.d.ts

@@ -0,0 +1,162 @@
+import React from 'react';
+import type { VariantProps } from '@gluestack-ui/nativewind-utils';
+declare const StyledSelect: React.ForwardRefExoticComponent<Omit<any, "ref"> & React.RefAttributes<HTMLSelectElement>>;
+declare const selectStyle: import("@gluestack-ui/nativewind-utils/types").TVReturnType<{
+    size: {
+        sm: string;
+        md: string;
+        lg: string;
+    };
+    variant: {
+        outline: string;
+        filled: string;
+        unstyled: string;
+    };
+    state: {
+        error: string;
+        success: string;
+    };
+} | ({
+    size: {
+        sm: string;
+        md: string;
+        lg: string;
+    };
+    variant: {
+        outline: string;
+        filled: string;
+        unstyled: string;
+    };
+    state: {
+        error: string;
+        success: string;
+    };
+} & {
+    size: {
+        sm: import("tailwind-merge").ClassNameValue | {
+            base?: import("tailwind-merge").ClassNameValue;
+        };
+        md: import("tailwind-merge").ClassNameValue | {
+            base?: import("tailwind-merge").ClassNameValue;
+        };
+        lg: import("tailwind-merge").ClassNameValue | {
+            base?: import("tailwind-merge").ClassNameValue;
+        };
+    };
+    variant: {
+        outline: import("tailwind-merge").ClassNameValue | {
+            base?: import("tailwind-merge").ClassNameValue;
+        };
+        filled: import("tailwind-merge").ClassNameValue | {
+            base?: import("tailwind-merge").ClassNameValue;
+        };
+        unstyled: import("tailwind-merge").ClassNameValue | {
+            base?: import("tailwind-merge").ClassNameValue;
+        };
+    };
+    state: {
+        error: import("tailwind-merge").ClassNameValue | {
+            base?: import("tailwind-merge").ClassNameValue;
+        };
+        success: import("tailwind-merge").ClassNameValue | {
+            base?: import("tailwind-merge").ClassNameValue;
+        };
+    };
+}), undefined, "px-4 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent appearance-none bg-white", import("tailwind-variants/dist/config").TVConfig<{
+    size: {
+        sm: string;
+        md: string;
+        lg: string;
+    };
+    variant: {
+        outline: string;
+        filled: string;
+        unstyled: string;
+    };
+    state: {
+        error: string;
+        success: string;
+    };
+}, {
+    size: {
+        sm: string;
+        md: string;
+        lg: string;
+    };
+    variant: {
+        outline: string;
+        filled: string;
+        unstyled: string;
+    };
+    state: {
+        error: string;
+        success: string;
+    };
+}>, {
+    size: {
+        sm: string;
+        md: string;
+        lg: string;
+    };
+    variant: {
+        outline: string;
+        filled: string;
+        unstyled: string;
+    };
+    state: {
+        error: string;
+        success: string;
+    };
+}, undefined, import("@gluestack-ui/nativewind-utils/types").TVReturnType<{
+    size: {
+        sm: string;
+        md: string;
+        lg: string;
+    };
+    variant: {
+        outline: string;
+        filled: string;
+        unstyled: string;
+    };
+    state: {
+        error: string;
+        success: string;
+    };
+}, undefined, "px-4 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent appearance-none bg-white", import("tailwind-variants/dist/config").TVConfig<{
+    size: {
+        sm: string;
+        md: string;
+        lg: string;
+    };
+    variant: {
+        outline: string;
+        filled: string;
+        unstyled: string;
+    };
+    state: {
+        error: string;
+        success: string;
+    };
+}, {
+    size: {
+        sm: string;
+        md: string;
+        lg: string;
+    };
+    variant: {
+        outline: string;
+        filled: string;
+        unstyled: string;
+    };
+    state: {
+        error: string;
+        success: string;
+    };
+}>, unknown, unknown, undefined>>;
+export declare const SelectOption: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.OptionHTMLAttributes<HTMLOptionElement>, HTMLOptionElement>, "ref"> & React.RefAttributes<HTMLOptionElement>>;
+type ISelectProps = React.ComponentProps<typeof StyledSelect> & VariantProps<typeof selectStyle> & {
+    className?: string;
+    onValueChange?: (value: string) => void;
+};
+declare const Select: React.ForwardRefExoticComponent<Omit<ISelectProps, "ref"> & React.RefAttributes<HTMLSelectElement>>;
+export { Select };

package/lib/components/ui/select/index.web.js

@@ -0,0 +1,51 @@
+'use client';
+import React, { forwardRef } from 'react';
+import { tva } from '@gluestack-ui/nativewind-utils/tva';
+const SCOPE = 'SELECT';
+const StyledSelect = forwardRef(({ onValueChange, onChange, placeholder, children, ...props }, ref) => {
+    const handleChange = (e) => {
+        if (onChange) {
+            onChange(e);
+        }
+        if (onValueChange) {
+            onValueChange(e.target.value);
+        }
+    };
+    return (React.createElement("select", { ref: ref, onChange: handleChange, ...props },
+        placeholder && (React.createElement("option", { value: "", disabled: true }, placeholder)),
+        children));
+});
+StyledSelect.displayName = 'StyledSelect';
+const selectStyle = tva({
+    base: 'px-4 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent appearance-none bg-white',
+    variants: {
+        size: {
+            sm: 'text-sm h-8',
+            md: 'text-base h-10',
+            lg: 'text-lg h-12',
+        },
+        variant: {
+            outline: 'bg-transparent',
+            filled: 'bg-gray-100',
+            unstyled: '',
+        },
+        state: {
+            error: 'border-red-500 focus:ring-red-500',
+            success: 'border-green-500 focus:ring-green-500',
+        },
+    },
+    defaultVariants: {
+        size: 'md',
+        variant: 'outline',
+    },
+});
+export const SelectOption = forwardRef((props, ref) => {
+    return React.createElement("option", { ref: ref, ...props });
+});
+SelectOption.displayName = 'SelectOption';
+const Select = React.forwardRef(({ className, size, variant, state, ...props }, ref) => {
+    return (React.createElement(StyledSelect, { ref: ref, className: selectStyle({ size, variant, state, class: className }), ...props }));
+});
+Select.displayName = 'Select';
+export { Select };
+//# sourceMappingURL=index.web.js.map

package/lib/components/ui/select/index.web.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.web.js","sourceRoot":"","sources":["../../../../src/components/ui/select/index.web.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;AACb,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAE1C,OAAO,EAAE,GAAG,EAAE,MAAM,oCAAoC,CAAC;AAKzD,MAAM,KAAK,GAAG,QAAQ,CAAC;AAEvB,MAAM,YAAY,GAAG,UAAU,CAC3B,CAAC,EAAE,aAAa,EAAE,QAAQ,EAAE,WAAW,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IAClE,MAAM,YAAY,GAAG,CAAC,CAAuC,EAAE,EAAE;QAC7D,IAAI,QAAQ,EAAE,CAAC;YACX,QAAQ,CAAC,CAAC,CAAC,CAAC;QAChB,CAAC;QACD,IAAI,aAAa,EAAE,CAAC;YAChB,aAAa,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QAClC,CAAC;IACL,CAAC,CAAC;IAEF,OAAO,CACH,gCAAQ,GAAG,EAAE,GAAG,EAAE,QAAQ,EAAE,YAAY,KAAM,KAAK;QAC9C,WAAW,IAAI,CACZ,gCAAQ,KAAK,EAAC,EAAE,EAAC,QAAQ,UACpB,WAAW,CACP,CACZ;QACA,QAAQ,CACJ,CACZ,CAAC;AACN,CAAC,CACJ,CAAC;AAEF,YAAY,CAAC,WAAW,GAAG,cAAc,CAAC;AAE1C,MAAM,WAAW,GAAG,GAAG,CAAC;IACpB,IAAI,EAAE,mJAAmJ;IACzJ,QAAQ,EAAE;QACN,IAAI,EAAE;YACF,EAAE,EAAE,aAAa;YACjB,EAAE,EAAE,gBAAgB;YACpB,EAAE,EAAE,cAAc;SACrB;QACD,OAAO,EAAE;YACL,OAAO,EAAE,gBAAgB;YACzB,MAAM,EAAE,aAAa;YACrB,QAAQ,EAAE,EAAE;SACf;QACD,KAAK,EAAE;YACH,KAAK,EAAE,mCAAmC;YAC1C,OAAO,EAAE,uCAAuC;SACnD;KACJ;IACD,eAAe,EAAE;QACb,IAAI,EAAE,IAAI;QACV,OAAO,EAAE,SAAS;KACrB;CACJ,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,YAAY,GAAG,UAAU,CAAoD,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IACrG,OAAO,gCAAQ,GAAG,EAAE,GAAG,KAAM,KAAK,GAAI,CAAC;AAC3C,CAAC,CAAC,CAAC;AAEH,YAAY,CAAC,WAAW,GAAG,cAAc,CAAC;AAQ1C,MAAM,MAAM,GAAG,KAAK,CAAC,UAAU,CAC3B,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IACnD,OAAO,CACH,oBAAC,YAAY,IAAC,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,WAAW,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,KAAM,KAAK,GAAI,CAC5G,CAAC;AACN,CAAC,CACJ,CAAC;AAEF,MAAM,CAAC,WAAW,GAAG,QAAQ,CAAC;AAE9B,OAAO,EAAE,MAAM,EAAE,CAAC"}

package/lib/components/ui/slider/index.web.d.ts

@@ -0,0 +1,223 @@
+import React from 'react';
+import type { VariantProps } from '@gluestack-ui/nativewind-utils';
+export declare const UISlider: import("@gluestack-ui/slider/lib/types").ISliderComponentType<Omit<Omit<React.HTMLProps<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    context?: any;
+} & React.RefAttributes<React.ForwardRefExoticComponent<Omit<React.HTMLProps<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>>, Omit<React.HTMLProps<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>, Omit<React.HTMLProps<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>, Omit<React.HTMLProps<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const sliderStyle: import("@gluestack-ui/nativewind-utils/types").TVReturnType<{
+    orientation: {
+        horizontal: string;
+        vertical: string;
+    };
+    size: {
+        sm: string;
+        md: string;
+        lg: string;
+    };
+    isReversed: {
+        true: string;
+        false: string;
+    };
+} | ({
+    orientation: {
+        horizontal: string;
+        vertical: string;
+    };
+    size: {
+        sm: string;
+        md: string;
+        lg: string;
+    };
+    isReversed: {
+        true: string;
+        false: string;
+    };
+} & {
+    orientation: {
+        horizontal: import("tailwind-merge").ClassNameValue | {
+            base?: import("tailwind-merge").ClassNameValue;
+        };
+        vertical: import("tailwind-merge").ClassNameValue | {
+            base?: import("tailwind-merge").ClassNameValue;
+        };
+    };
+    size: {
+        sm: import("tailwind-merge").ClassNameValue | {
+            base?: import("tailwind-merge").ClassNameValue;
+        };
+        md: import("tailwind-merge").ClassNameValue | {
+            base?: import("tailwind-merge").ClassNameValue;
+        };
+        lg: import("tailwind-merge").ClassNameValue | {
+            base?: import("tailwind-merge").ClassNameValue;
+        };
+    };
+    isReversed: {
+        true: import("tailwind-merge").ClassNameValue | {
+            base?: import("tailwind-merge").ClassNameValue;
+        };
+        false: import("tailwind-merge").ClassNameValue | {
+            base?: import("tailwind-merge").ClassNameValue;
+        };
+    };
+}), undefined, "justify-center items-center data-[disabled=true]:opacity-40 data-[disabled=true]:pointer-events-none", import("tailwind-variants/dist/config").TVConfig<{
+    orientation: {
+        horizontal: string;
+        vertical: string;
+    };
+    size: {
+        sm: string;
+        md: string;
+        lg: string;
+    };
+    isReversed: {
+        true: string;
+        false: string;
+    };
+}, {
+    orientation: {
+        horizontal: string;
+        vertical: string;
+    };
+    size: {
+        sm: string;
+        md: string;
+        lg: string;
+    };
+    isReversed: {
+        true: string;
+        false: string;
+    };
+}>, {
+    orientation: {
+        horizontal: string;
+        vertical: string;
+    };
+    size: {
+        sm: string;
+        md: string;
+        lg: string;
+    };
+    isReversed: {
+        true: string;
+        false: string;
+    };
+}, undefined, import("@gluestack-ui/nativewind-utils/types").TVReturnType<{
+    orientation: {
+        horizontal: string;
+        vertical: string;
+    };
+    size: {
+        sm: string;
+        md: string;
+        lg: string;
+    };
+    isReversed: {
+        true: string;
+        false: string;
+    };
+}, undefined, "justify-center items-center data-[disabled=true]:opacity-40 data-[disabled=true]:pointer-events-none", import("tailwind-variants/dist/config").TVConfig<{
+    orientation: {
+        horizontal: string;
+        vertical: string;
+    };
+    size: {
+        sm: string;
+        md: string;
+        lg: string;
+    };
+    isReversed: {
+        true: string;
+        false: string;
+    };
+}, {
+    orientation: {
+        horizontal: string;
+        vertical: string;
+    };
+    size: {
+        sm: string;
+        md: string;
+        lg: string;
+    };
+    isReversed: {
+        true: string;
+        false: string;
+    };
+}>, unknown, unknown, undefined>>;
+declare const sliderThumbStyle: import("@gluestack-ui/nativewind-utils/types").TVReturnType<{
+    size: {
+        sm: string;
+        md: string;
+        lg: string;
+    };
+} | ({} & {
+    size: {
+        sm: string;
+        md: string;
+        lg: string;
+    };
+}), undefined, "bg-primary-500 absolute rounded-full data-[focus=true]:bg-primary-600 data-[active=true]:bg-primary-600 data-[hover=true]:bg-primary-600 data-[disabled=true]:bg-primary-500 cursor-pointer data-[active=true]:outline data-[active=true]:outline-4 data-[active=true]:outline-primary-400 shadow-hard-1", import("tailwind-variants/dist/config").TVConfig<unknown, unknown>, unknown, undefined, import("@gluestack-ui/nativewind-utils/types").TVReturnType<unknown, undefined, "bg-primary-500 absolute rounded-full data-[focus=true]:bg-primary-600 data-[active=true]:bg-primary-600 data-[hover=true]:bg-primary-600 data-[disabled=true]:bg-primary-500 cursor-pointer data-[active=true]:outline data-[active=true]:outline-4 data-[active=true]:outline-primary-400 shadow-hard-1", import("tailwind-variants/dist/config").TVConfig<unknown, unknown>, unknown, unknown, undefined>>;
+declare const sliderTrackStyle: import("@gluestack-ui/nativewind-utils/types").TVReturnType<{
+    orientation: {
+        horizontal: string;
+        vertical: string;
+    };
+    isReversed: {
+        true: string;
+        false: string;
+    };
+    size: {
+        sm: string;
+        md: string;
+        lg: string;
+    };
+} | ({} & {
+    orientation: {
+        horizontal: string;
+        vertical: string;
+    };
+    isReversed: {
+        true: string;
+        false: string;
+    };
+    size: {
+        sm: string;
+        md: string;
+        lg: string;
+    };
+}), undefined, "bg-background-300 rounded-lg overflow-hidden", import("tailwind-variants/dist/config").TVConfig<unknown, unknown>, unknown, undefined, import("@gluestack-ui/nativewind-utils/types").TVReturnType<unknown, undefined, "bg-background-300 rounded-lg overflow-hidden", import("tailwind-variants/dist/config").TVConfig<unknown, unknown>, unknown, unknown, undefined>>;
+declare const sliderFilledTrackStyle: import("@gluestack-ui/nativewind-utils/types").TVReturnType<{
+    orientation: {
+        horizontal: string;
+        vertical: string;
+    };
+} | ({} & {
+    orientation: {
+        horizontal: string;
+        vertical: string;
+    };
+}), undefined, "bg-primary-500 data-[focus=true]:bg-primary-600 data-[active=true]:bg-primary-600 data-[hover=true]:bg-primary-600", import("tailwind-variants/dist/config").TVConfig<unknown, unknown>, unknown, undefined, import("@gluestack-ui/nativewind-utils/types").TVReturnType<unknown, undefined, "bg-primary-500 data-[focus=true]:bg-primary-600 data-[active=true]:bg-primary-600 data-[hover=true]:bg-primary-600", import("tailwind-variants/dist/config").TVConfig<unknown, unknown>, unknown, unknown, undefined>>;
+interface BaseSliderProps {
+    className?: string;
+    size?: 'sm' | 'md' | 'lg';
+    orientation?: 'horizontal' | 'vertical';
+    isReversed?: boolean;
+    style?: React.CSSProperties;
+    children?: React.ReactNode;
+    onClick?: (event: React.MouseEvent<HTMLDivElement>) => void;
+    onMouseDown?: (event: React.MouseEvent<HTMLDivElement>) => void;
+    onMouseUp?: (event: React.MouseEvent<HTMLDivElement>) => void;
+    onMouseEnter?: (event: React.MouseEvent<HTMLDivElement>) => void;
+    onMouseLeave?: (event: React.MouseEvent<HTMLDivElement>) => void;
+}
+type ISliderProps = React.ComponentProps<typeof UISlider> & VariantProps<typeof sliderStyle> & BaseSliderProps;
+declare const Slider: React.ForwardRefExoticComponent<Omit<ISliderProps, "ref"> & React.RefAttributes<Omit<Omit<React.HTMLProps<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    context?: any;
+} & React.RefAttributes<React.ForwardRefExoticComponent<Omit<React.HTMLProps<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>>>>;
+type ISliderThumbProps = React.ComponentProps<typeof UISlider.Thumb> & VariantProps<typeof sliderThumbStyle> & BaseSliderProps;
+declare const SliderThumb: React.ForwardRefExoticComponent<Omit<ISliderThumbProps, "ref"> & React.RefAttributes<Omit<React.HTMLProps<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>>;
+type ISliderTrackProps = React.ComponentProps<typeof UISlider.Track> & VariantProps<typeof sliderTrackStyle> & BaseSliderProps;
+declare const SliderTrack: React.ForwardRefExoticComponent<Omit<ISliderTrackProps, "ref"> & React.RefAttributes<Omit<React.HTMLProps<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>>;
+type ISliderFilledTrackProps = React.ComponentProps<typeof UISlider.FilledTrack> & VariantProps<typeof sliderFilledTrackStyle> & BaseSliderProps;
+declare const SliderFilledTrack: React.ForwardRefExoticComponent<Omit<ISliderFilledTrackProps, "ref"> & React.RefAttributes<Omit<React.HTMLProps<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>>;
+export { Slider, SliderThumb, SliderTrack, SliderFilledTrack };

package/lib/components/ui/slider/index.web.js

@@ -0,0 +1,189 @@
+'use client';
+import { createSlider } from '@gluestack-ui/slider';
+import React from 'react';
+import { tva } from '@gluestack-ui/nativewind-utils/tva';
+import { withStyleContext, useStyleContext } from '@gluestack-ui/nativewind-utils/withStyleContext';
+const SCOPE = 'SLIDER';
+// Create styled components for web
+const StyledRoot = React.forwardRef((props, ref) => (React.createElement("div", { ref: ref, ...props })));
+const StyledThumb = React.forwardRef((props, ref) => (React.createElement("div", { ref: ref, ...props })));
+const StyledTrack = React.forwardRef((props, ref) => (React.createElement("div", { ref: ref, ...props })));
+const StyledFilledTrack = React.forwardRef((props, ref) => (React.createElement("div", { ref: ref, ...props })));
+const StyledThumbInteraction = React.forwardRef((props, ref) => (React.createElement("div", { ref: ref, ...props })));
+const Root = withStyleContext(StyledRoot, SCOPE);
+export const UISlider = createSlider({
+    Root,
+    Thumb: StyledThumb,
+    Track: StyledTrack,
+    FilledTrack: StyledFilledTrack,
+    ThumbInteraction: StyledThumbInteraction,
+});
+// Remove problematic cssInterop for now as it's causing type issues
+// cssInterop(UISlider.Track, {
+//     target: false,
+//     nativeStyleToProp: {
+//         style: true,
+//     },
+// });
+const sliderStyle = tva({
+    base: 'justify-center items-center data-[disabled=true]:opacity-40 data-[disabled=true]:pointer-events-none',
+    variants: {
+        orientation: {
+            horizontal: 'w-full',
+            vertical: 'h-full',
+        },
+        size: {
+            sm: '',
+            md: '',
+            lg: '',
+        },
+        isReversed: {
+            true: '',
+            false: '',
+        },
+    },
+});
+const sliderThumbStyle = tva({
+    base: 'bg-primary-500 absolute rounded-full data-[focus=true]:bg-primary-600 data-[active=true]:bg-primary-600 data-[hover=true]:bg-primary-600 data-[disabled=true]:bg-primary-500 cursor-pointer data-[active=true]:outline data-[active=true]:outline-4 data-[active=true]:outline-primary-400 shadow-hard-1',
+    parentVariants: {
+        size: {
+            sm: 'h-4 w-4',
+            md: 'h-5 w-5',
+            lg: 'h-6 w-6',
+        },
+    },
+});
+const sliderTrackStyle = tva({
+    base: 'bg-background-300 rounded-lg overflow-hidden',
+    parentVariants: {
+        orientation: {
+            horizontal: 'w-full',
+            vertical: 'h-full',
+        },
+        isReversed: {
+            true: '',
+            false: '',
+        },
+        size: {
+            sm: '',
+            md: '',
+            lg: '',
+        },
+    },
+    parentCompoundVariants: [
+        {
+            orientation: 'horizontal',
+            size: 'sm',
+            class: 'h-1 flex-row',
+        },
+        {
+            orientation: 'horizontal',
+            size: 'sm',
+            isReversed: true,
+            class: 'h-1 flex-row-reverse',
+        },
+        {
+            orientation: 'horizontal',
+            size: 'md',
+            class: 'h-1 flex-row',
+        },
+        {
+            orientation: 'horizontal',
+            size: 'md',
+            isReversed: true,
+            class: 'h-[5px] flex-row-reverse',
+        },
+        {
+            orientation: 'horizontal',
+            size: 'lg',
+            class: 'h-1.5 flex-row',
+        },
+        {
+            orientation: 'horizontal',
+            size: 'lg',
+            isReversed: true,
+            class: 'h-1.5 flex-row-reverse',
+        },
+        {
+            orientation: 'vertical',
+            size: 'sm',
+            class: 'w-1 flex-col-reverse',
+        },
+        {
+            orientation: 'vertical',
+            size: 'sm',
+            isReversed: true,
+            class: 'w-1 flex-col',
+        },
+        {
+            orientation: 'vertical',
+            size: 'md',
+            class: 'w-[5px] flex-col-reverse',
+        },
+        {
+            orientation: 'vertical',
+            size: 'md',
+            isReversed: true,
+            class: 'w-[5px] flex-col',
+        },
+        {
+            orientation: 'vertical',
+            size: 'lg',
+            class: 'w-1.5 flex-col-reverse',
+        },
+        {
+            orientation: 'vertical',
+            size: 'lg',
+            isReversed: true,
+            class: 'w-1.5 flex-col',
+        },
+    ],
+});
+const sliderFilledTrackStyle = tva({
+    base: 'bg-primary-500 data-[focus=true]:bg-primary-600 data-[active=true]:bg-primary-600 data-[hover=true]:bg-primary-600',
+    parentVariants: {
+        orientation: {
+            horizontal: 'h-full',
+            vertical: 'w-full',
+        },
+    },
+});
+const Slider = React.forwardRef(({ className, size = 'md', orientation = 'horizontal', isReversed = false, ...props }, ref) => {
+    return (React.createElement(UISlider, { ref: ref, isReversed: isReversed, orientation: orientation, ...props, className: sliderStyle({
+            orientation,
+            isReversed,
+            class: className,
+        }), context: { size, orientation, isReversed } }));
+});
+const SliderThumb = React.forwardRef(({ className, size, ...props }, ref) => {
+    const { size: parentSize } = useStyleContext(SCOPE);
+    return (React.createElement(UISlider.Thumb, { ref: ref, ...props, className: sliderThumbStyle({
+            parentVariants: {
+                size: parentSize,
+            },
+            size,
+            class: className,
+        }) }));
+});
+const SliderTrack = React.forwardRef(({ className, ...props }, ref) => {
+    const { orientation: parentOrientation, size: parentSize, isReversed } = useStyleContext(SCOPE);
+    return (React.createElement(UISlider.Track, { ref: ref, ...props, className: sliderTrackStyle({
+            parentVariants: {
+                orientation: parentOrientation,
+                size: parentSize,
+                isReversed,
+            },
+            class: className,
+        }) }));
+});
+const SliderFilledTrack = React.forwardRef(({ className, ...props }, ref) => {
+    const { orientation: parentOrientation } = useStyleContext(SCOPE);
+    return (React.createElement(UISlider.FilledTrack, { ref: ref, ...props, className: sliderFilledTrackStyle({
+            parentVariants: {
+                orientation: parentOrientation,
+            },
+            class: className,
+        }) }));
+});
+export { Slider, SliderThumb, SliderTrack, SliderFilledTrack };
+//# sourceMappingURL=index.web.js.map

package/lib/components/ui/slider/index.web.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.web.js","sourceRoot":"","sources":["../../../../src/components/ui/slider/index.web.tsx"],"names":[],"mappings":"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"}