@momo-webplatform/mobase 0.0.43 → 0.0.45

package/publish/esm/components/RadioGroup/RadioGroup.js

@@ -1,26 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import * as React from "react";
-import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
-import { Circle } from "lucide-react";
-import { cn } from "../../helpers/utils";
-import { cva } from "class-variance-authority";
-const radioGroupVariants = cva("grid cursor-pointer gap-2 text-gray-900 text-sm", {
-    variants: {
-        orientation: {
-            horizontal: "grid-cols-2",
-            vertical: "grid-cols-1",
-        },
-    },
-    defaultVariants: {
-        orientation: "vertical",
-    },
-});
-const RadioGroup = React.forwardRef(({ disabled, orientation, className, ...props }, ref) => {
-    return (_jsx(RadioGroupPrimitive.Root, { className: cn("", radioGroupVariants({ orientation }), className), ...props, ref: ref }));
-});
-RadioGroup.displayName = RadioGroupPrimitive.Root.displayName;
-const RadioGroupItem = React.forwardRef(({ className, ...props }, ref) => {
-    return (_jsx(RadioGroupPrimitive.Item, { ref: ref, className: cn("aspect-square h-4 w-4 rounded-full border  border-gray-700 disabled:bg-gray-300 disabled:data-[state=checked]:text-gray-500 data-[state=checked]:text-white disabled:data-[state=checked]:bg-gray-300 data-[state=checked]:bg-pink-500  disabled:border-none data-[state=checked]:border-none text-primary ring-offset-background focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-default disabled:opacity-40", className), ...props, children: _jsx(RadioGroupPrimitive.Indicator, { className: "flex items-center justify-center w-full h-full rounded-full ", children: _jsx(Circle, { className: "h-2 w-2 fill-current text-current" }) }) }));
-});
-RadioGroupItem.displayName = RadioGroupPrimitive.Item.displayName;
-export { RadioGroup, RadioGroupItem };

package/publish/esm/components/RadioGroup/index.d.ts

@@ -1 +0,0 @@
-export { RadioGroup, RadioGroupItem } from "./RadioGroup";

package/publish/esm/components/RadioGroup/index.js

@@ -1 +0,0 @@
-export { RadioGroup, RadioGroupItem } from "./RadioGroup";

package/publish/esm/components/SearchBar/SearchBar.d.ts

@@ -1,7 +0,0 @@
-import { InputHTMLAttributes } from "react";
-export interface SearchBarProps extends InputHTMLAttributes<HTMLInputElement> {
-    inputClassName?: string;
-    size?: 1 | 2;
-    onClickClear?: (inputValue: string) => void;
-}
-export declare const SearchBar: import("react").ForwardRefExoticComponent<SearchBarProps & import("react").RefAttributes<HTMLInputElement>>;

package/publish/esm/components/SearchBar/SearchBar.js

@@ -1,45 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, useEffect, useRef, useState, } from "react";
-import { MagnifyingGlassIcon } from "@heroicons/react/20/solid";
-import { XCircleIcon } from "@heroicons/react/24/outline";
-import { cn } from "../../helpers/utils";
-export const SearchBar = forwardRef(({ disabled, className, inputClassName, size, onChange, onFocus, onClickClear, value, defaultValue, type = "text", ...restProps }, ref) => {
-    const [clearable, setClearable] = useState(false);
-    const rootRef = useRef(null);
-    const handleShowClearButton = (inputValue) => {
-        if (inputValue && !clearable) {
-            setClearable(true);
-        }
-        if (!inputValue && clearable) {
-            setClearable(false);
-        }
-    };
-    const onChangeFactory = (event) => {
-        handleShowClearButton(event.target.value);
-        onChange?.(event);
-    };
-    const onFocusFactory = (event) => {
-        handleShowClearButton(event.target.value);
-        onFocus?.(event);
-    };
-    const handleClear = () => {
-        const inputTarget = rootRef.current?.querySelector("input");
-        if (!inputTarget)
-            return;
-        onClickClear?.(inputTarget.value);
-        inputTarget.value = "";
-        inputTarget.focus();
-        setClearable(false);
-    };
-    useEffect(() => {
-        handleShowClearButton(defaultValue || value);
-    }, [value, defaultValue]);
-    return (_jsxs("div", { className: cn(className), ref: rootRef, children: [_jsxs("div", { className: "relative flex items-center", children: [_jsx("div", { className: "absolute left-3 top-1/2 -translate-y-1/2 shrink-0 text-gray-500 duration-200 ", children: _jsx(MagnifyingGlassIcon, { className: "w-4 h-4 text-gray-500" }) }), _jsx("input", { disabled: disabled, type: type, ref: ref, className: cn("mobase-text-input-box text-gray-900 h-10 bg-white w-full transition-all text-sm rounded-md border border-gray-400  placeholder:text-gray-500 px-9  focus:border-pink-500 disabled:bg-gray-50 disabled:border-gray-300 disabled:pointer-events-none block disabled:opacity-50", inputClassName), onChange: onChangeFactory, onFocus: onFocusFactory, value: value, defaultValue: defaultValue, ...restProps }), clearable && (_jsx("button", { "aria-label": "button", type: "button", className: "absolute right-3 top-1/2 -translate-y-1/2 shrink-0 cursor-pointer text-gray-500 duration-200 hover:opacity-70 disabled:pointer-events-none", disabled: disabled, onClick: handleClear, children: _jsx(XCircleIcon, { strokeWidth: 2, width: 20, height: 20 }) }))] }), _jsx("style", { children: `
-            .mobase-text-input-box:hover {
-                box-shadow: 0px 0px 0px 1px rgb(var(--mobase-gray-400) / 1) inset;
-            }
-            .mobase-text-input-box:focus {
-                box-shadow: 0px 0px 0px 1px rgb(var(--mobase-pink-500) / 1) inset;
-            }
-          ` })] }));
-});

package/publish/esm/components/SearchBar/index.d.ts

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

package/publish/esm/components/SearchBar/index.js

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

package/publish/esm/components/Select/Select.d.ts

@@ -1,19 +0,0 @@
-import * as React from "react";
-import * as SelectPrimitive from "@radix-ui/react-select";
-declare const Select: React.ForwardRefExoticComponent<SelectPrimitive.SelectProps & {
-    className?: string | undefined;
-    label?: string | null | undefined;
-    message?: string | null | undefined;
-    size?: 2 | 1 | undefined;
-    isError?: boolean | undefined;
-} & React.RefAttributes<never>>;
-declare const SelectValue: React.ForwardRefExoticComponent<SelectPrimitive.SelectValueProps & React.RefAttributes<HTMLSpanElement>>;
-declare const SelectTrigger: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
-declare const SelectScrollUpButton: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectScrollUpButtonProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
-declare const SelectScrollDownButton: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectScrollDownButtonProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
-declare const SelectContent: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
-declare const SelectGroup: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectGroupProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
-declare const SelectLabel: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectLabelProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
-declare const SelectItem: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
-declare const SelectSeparator: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectSeparatorProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
-export { Select, SelectGroup, SelectValue, SelectTrigger, SelectContent, SelectLabel, SelectItem, SelectSeparator, SelectScrollUpButton, SelectScrollDownButton, };

package/publish/esm/components/Select/Select.js

@@ -1,32 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import * as React from "react";
-import { ChevronDownIcon, ChevronUpIcon, CheckIcon, XCircleIcon, } from "@heroicons/react/16/solid";
-import { QuestionMarkCircleIcon } from "@heroicons/react/24/outline";
-import * as SelectPrimitive from "@radix-ui/react-select";
-import { cn } from "../../helpers/utils";
-const Select = React.forwardRef(({ className, children, label, message, size, isError, disabled, ...props }) => (_jsxs("div", { className: cn("select-mobase relative", className, disabled ? "disabled" : "", isError
-        ? "[&>.select-mobase-button]:border-red-500 [&>.select-mobase-button]:ring-red-500 [&>.select-mobase-button]:ring-1"
-        : "", size === 2
-        ? "[&>.select-mobase-button]:text-base [&>.select-mobase-button]:h-12"
-        : ""), children: [label && (_jsx("span", { className: cn("mobase-select-label absolute bg-white -top-2 px-1.5 left-2 text-xs text-gray-500 z-[1]", size === 2 && "text-sm -top-2.5", isError && "text-red-500"), children: label })), _jsx(SelectPrimitive.Root, { disabled: disabled, ...props, children: children }), message && (_jsxs("div", { className: cn("mobase-select-message flex space-x-1 items-center mt-1 text-gray-500", isError && "text-red-500"), children: [isError ? (_jsx(XCircleIcon, { width: 16, height: 16 })) : (_jsx(QuestionMarkCircleIcon, { width: 16, height: 16 })), _jsx("span", { className: cn(size === 2 ? "text-sm" : "text-xs"), children: message })] }))] })));
-const SelectValue = SelectPrimitive.Value;
-const SelectTrigger = React.forwardRef(({ className, children, ...props }, ref) => (_jsxs(SelectPrimitive.Trigger, { ref: ref, className: cn("select-mobase-button bg-white w-full ring-0 transition-all focus-visible:border-pink-500 focus-visible:ring-offset-0 focus-visible:ring-offset-transparent focus-visible:ring-1 focus-visible:!ring-pink-500 rounded-md border border-gray-400 data-[placeholder]:text-gray-500 p-3 disabled:bg-gray-50 disabled:border-gray-300  disabled:pointer-events-none flex items-center justify-between data-[state=open]:border-pink-500 data-[state=open]:ring-1 hover:ring-1 hover:ring-gray-400 data-[state=open]:ring-pink-500 text-gray-900 h-11 ring-inset text-sm", className), ...props, children: [_jsx("div", { className: "line-clamp-1 text-left", children: children }), _jsx(SelectPrimitive.Icon, { asChild: true, children: _jsx(ChevronDownIcon, { className: "h-4 w-4 text-gray-500 flex-none" }) })] })));
-SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
-const SelectScrollUpButton = React.forwardRef(({ className, ...props }, ref) => (_jsx(SelectPrimitive.ScrollUpButton, { ref: ref, className: cn("flex cursor-default items-center justify-center py-1", className), ...props, children: _jsx(ChevronUpIcon, { className: "h-5 w-5" }) })));
-SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
-const SelectScrollDownButton = React.forwardRef(({ className, ...props }, ref) => (_jsx(SelectPrimitive.ScrollDownButton, { ref: ref, className: cn("flex cursor-default items-center justify-center py-1 bg-gradient-to-t from-white to-transparent", className), ...props, children: _jsx(ChevronDownIcon, { className: "h-5 w-5" }) })));
-SelectScrollDownButton.displayName =
-    SelectPrimitive.ScrollDownButton.displayName;
-const SelectContent = React.forwardRef(({ className, children, position = "popper", ...props }, ref) => (_jsx(SelectPrimitive.Portal, { children: _jsxs(SelectPrimitive.Content, { ref: ref, className: cn("relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border border-gray-300 bg-white text-gray-900 shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2", position === "popper" &&
-            "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1", className), position: position, ...props, children: [_jsx(SelectScrollUpButton, {}), _jsx(SelectPrimitive.Viewport, { className: cn("p-0", position === "popper" &&
-                    "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"), children: children }), _jsx(SelectScrollDownButton, {})] }) })));
-SelectContent.displayName = SelectPrimitive.Content.displayName;
-const SelectGroup = React.forwardRef(({ className, children, ...props }, ref) => (_jsx(SelectPrimitive.Group, { ref: ref, className: cn("relative p-1 after:w-full border-b border-gray-200 last:border-0", className), ...props, children: children })));
-const SelectLabel = React.forwardRef(({ className, ...props }, ref) => (_jsx(SelectPrimitive.Label, { ref: ref, className: cn("pr-2 pl-8 py-1.5 text-sm font-semibold z-[1]", className), ...props })));
-SelectLabel.displayName = SelectPrimitive.Label.displayName;
-const SelectItem = React.forwardRef(({ className, children, ...props }, ref) => {
-    return (_jsxs(SelectPrimitive.Item, { ref: ref, className: cn("relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pr-2 pl-8 text-sm outline-none focus:bg-gray-100 focus:text-gray-900 data-[disabled]:pointer-events-none data-[disabled]:opacity-50", className), ...props, children: [_jsx("span", { className: "absolute left-2 flex h-4 w-4 items-center justify-center", children: _jsx(SelectPrimitive.ItemIndicator, { children: _jsx(CheckIcon, { className: "h-4 w-4" }) }) }), _jsx(SelectPrimitive.ItemText, { children: children })] }));
-});
-const SelectSeparator = React.forwardRef(({ className, ...props }, ref) => (_jsx(SelectPrimitive.Separator, { ref: ref, className: cn("-mx-1 my-1 h-px bg-muted", className), ...props })));
-SelectSeparator.displayName = SelectPrimitive.Separator.displayName;
-export { Select, SelectGroup, SelectValue, SelectTrigger, SelectContent, SelectLabel, SelectItem, SelectSeparator, SelectScrollUpButton, SelectScrollDownButton, };

package/publish/esm/components/Select/index.d.ts

@@ -1 +0,0 @@
-export { Select, SelectGroup, SelectValue, SelectTrigger, SelectContent, SelectLabel, SelectItem, SelectSeparator, SelectScrollUpButton, SelectScrollDownButton, } from "./Select";

package/publish/esm/components/Select/index.js

@@ -1 +0,0 @@
-export { Select, SelectGroup, SelectValue, SelectTrigger, SelectContent, SelectLabel, SelectItem, SelectSeparator, SelectScrollUpButton, SelectScrollDownButton, } from "./Select";

package/publish/esm/components/Stepper/Stepper.d.ts

@@ -1,15 +0,0 @@
-import { InputHTMLAttributes } from "react";
-export interface StepperProps extends InputHTMLAttributes<HTMLInputElement> {
-    value?: number;
-    min?: number;
-    max?: number;
-    step?: number;
-    inputClassName?: string;
-    stepperClassName?: string;
-    disabledInput?: boolean;
-    disabled?: boolean;
-    onChangeInputStepper?: (inputValue: number | string) => void;
-    onDecrement?: (inputValue: number | string) => void;
-    onIncrement?: (inputValue: number | string) => void;
-}
-export declare const Stepper: import("react").ForwardRefExoticComponent<StepperProps & import("react").RefAttributes<HTMLInputElement>>;

package/publish/esm/components/Stepper/Stepper.js

@@ -1,97 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { MinusCircleIcon, PlusCircleIcon } from "@heroicons/react/24/outline";
-import { IconButton } from "../IconButton";
-import { useRef, forwardRef, useState, useEffect, } from "react";
-import { cn } from "../../helpers/utils";
-export const Stepper = forwardRef(({ value = 0, min = 0, max = 999, disabled = false, disabledInput = false, step = 1, inputClassName = "", stepperClassName = "", className = "", onChange = () => { }, onChangeInputStepper, onDecrement, onIncrement, ...restProps }, ref) => {
-    const rootRef = useRef(null);
-    const [isDisablePlus, setIsDisablePlus] = useState(false);
-    const [isDisableMinus, setIsDisableMinus] = useState(false);
-    const [inputValue, setInputValue] = useState("");
-    const spanRef = useRef(null);
-    const handleDisable = (inputValue) => {
-        if (Number(inputValue) >= max) {
-            setIsDisablePlus(true);
-        }
-        else {
-            setIsDisablePlus(false);
-        }
-        if (Number(inputValue) > min) {
-            setIsDisableMinus(false);
-        }
-        else {
-            setIsDisableMinus(true);
-        }
-    };
-    const onIncrementChange = () => {
-        if (disabled || isDisablePlus)
-            return;
-        const inputTarget = rootRef?.current?.querySelector("input");
-        if (!inputTarget)
-            return;
-        let newValue = 0;
-        newValue = Math.min(Number(inputTarget.value) + step, max);
-        handleDisable(newValue);
-        inputTarget.value = String(newValue);
-        setInputValue(inputTarget.value || "");
-        onChangeInputStepper?.(inputTarget.value);
-        onIncrement?.(inputTarget.value);
-    };
-    const onDecrementChange = () => {
-        if (disabled || isDisableMinus)
-            return;
-        const inputTarget = rootRef?.current?.querySelector("input");
-        if (!inputTarget)
-            return;
-        let newValue = 0;
-        newValue = Math.max(Number(inputTarget.value) - step, 0);
-        handleDisable(newValue);
-        inputTarget.value = String(newValue);
-        setInputValue(inputTarget.value || "");
-        onChangeInputStepper?.(inputTarget.value);
-        onDecrement?.(inputTarget.value);
-    };
-    const onStepperInputChange = (e) => {
-        if (!e)
-            return;
-        let inputValue = e?.target?.value;
-        if (!inputValue?.match(/^[0-9]*$/)) {
-            inputValue = inputValue.replace(/[^0-9]/g, "");
-        }
-        handleDisable(inputValue);
-        const numericValue = parseInt(inputValue, 10);
-        if (Number.isNaN(numericValue) || numericValue < min) {
-            e.target.value = String(min);
-        }
-        else if (numericValue >= max) {
-            e.target.value = String(max);
-        }
-        else {
-            e.target.value = String(numericValue);
-        }
-        setInputValue(e?.target?.value || "");
-        onChangeInputStepper?.(e.target.value);
-        onChange?.(e);
-    };
-    useEffect(() => {
-        const inputTarget = rootRef?.current?.querySelector("input");
-        if (!inputTarget)
-            return;
-        handleDisable(inputTarget?.value);
-    }, []);
-    useEffect(() => {
-        const inputTarget = rootRef?.current?.querySelector("input");
-        if (inputTarget && spanRef?.current) {
-            inputTarget.style.width = `${spanRef.current.offsetWidth + 10}px`;
-        }
-    }, [inputValue]);
-    return (_jsxs("div", { ref: rootRef, className: "flex items-center space-x-1", children: [_jsx(IconButton, { id: "btn-minus", className: cn(!isDisableMinus && !disabled
-                    ? "cursor-pointer text-pink-500"
-                    : "text-gray-400 cursor-default", stepperClassName), variant: "transparent", onClick: onDecrementChange, children: _jsx(MinusCircleIcon, { className: "w-8 h-8 " }) }), _jsxs("div", { children: [_jsx("input", { pattern: "[0-9]*", inputMode: "numeric", defaultValue: value, ref: ref, min: min, max: max, onChange: (e) => onStepperInputChange(e), id: "numberInput", disabled: disabled || disabledInput, autoComplete: "off", ...restProps, className: cn("text-gray-800 min-w-7 border-gray-400 border transition-width duration-100 focus-visible:outline-none focus-visible:ring-0 focus:ring-0 shadow-none focus-visible:ring-offset-0 w-7 h-7 rounded-md text-center bg-white", inputClassName) }), _jsx("span", { ref: spanRef, style: {
-                            visibility: "hidden",
-                            position: "absolute",
-                            whiteSpace: "pre",
-                        }, children: inputValue || " " })] }), _jsx(IconButton, { id: "btn-plus", className: cn(!isDisablePlus && !disabled
-                    ? "cursor-pointer text-pink-500"
-                    : "text-gray-400 cursor-default", stepperClassName), variant: "transparent", onClick: onIncrementChange, children: _jsx(PlusCircleIcon, { className: "w-8 h-8 " }) })] }));
-});

package/publish/esm/components/Stepper/index.d.ts

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

package/publish/esm/components/Stepper/index.js

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

package/publish/esm/components/Switch/Switch.d.ts

@@ -1,4 +0,0 @@
-import * as React from "react";
-import * as SwitchPrimitives from "@radix-ui/react-switch";
-declare const Switch: React.ForwardRefExoticComponent<Omit<SwitchPrimitives.SwitchProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
-export { Switch };

package/publish/esm/components/Switch/Switch.js

@@ -1,7 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import * as React from "react";
-import * as SwitchPrimitives from "@radix-ui/react-switch";
-import { cn } from "../../helpers/utils";
-const Switch = React.forwardRef(({ className, ...props }, ref) => (_jsx(SwitchPrimitives.Root, { className: cn("peer inline-flex h-5 w-10 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-default disabled:opacity-20 data-[state=checked]:bg-pink-500   data-[state=unchecked]:bg-gray-400", className), ...props, ref: ref, children: _jsx(SwitchPrimitives.Thumb, { className: cn("pointer-events-none relative cik  before:content-[''] before:absolute before:w-1.5 before:h-1.5 before:rounded-full before:bg-pink-600 before:-translate-x-1/2 before:translate-y-1 disabled:opacity-20 before:data-[state=unchecked]:bg-gray-400 block h-3.5 w-3.5 bg-white rounded-full shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-5 data-[state=unchecked]:translate-x-0.5") }) })));
-Switch.displayName = SwitchPrimitives.Root.displayName;
-export { Switch };

package/publish/esm/components/Switch/index.d.ts

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

package/publish/esm/components/Switch/index.js

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

package/publish/esm/components/Tabs/Tabs.d.ts

@@ -1,16 +0,0 @@
-import * as React from "react";
-import * as TabsPrimitive from "@radix-ui/react-tabs";
-declare const Tabs: React.ForwardRefExoticComponent<TabsPrimitive.TabsProps & React.RefAttributes<HTMLDivElement>>;
-declare const TabsList: React.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsListProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
-    /**
-     * Control the size of the tabs list..
-     */
-    size?: "base" | "sm" | undefined;
-    /**
-     * The direction of navigation between toolbar items.
-     */
-    isDivider?: boolean | undefined;
-} & React.RefAttributes<HTMLDivElement>>;
-declare const TabsTrigger: React.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
-declare const TabsContent: React.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
-export { Tabs, TabsList, TabsTrigger, TabsContent };

package/publish/esm/components/Tabs/Tabs.js

@@ -1,12 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import * as React from "react";
-import * as TabsPrimitive from "@radix-ui/react-tabs";
-import { cn } from "../../helpers/utils";
-const Tabs = TabsPrimitive.Root;
-const TabsList = React.forwardRef(({ className, size = "sm", isDivider = false, ...props }, ref) => (_jsx(TabsPrimitive.List, { ref: ref, className: cn("inline-flex w-full flex-row items-center bg-muted text-muted-foreground space-x-5 overflow-x-auto [&::-webkit-scrollbar]:hidden", `text-${size}`, isDivider && "border-b border-gray-200", className), ...props })));
-TabsList.displayName = TabsPrimitive.List.displayName;
-const TabsTrigger = React.forwardRef(({ className, ...props }, ref) => (_jsx(TabsPrimitive.Trigger, { ref: ref, className: cn("inline-flex items-center justify-center whitespace-nowrap h-8 font-semibold ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 border-b border-transparent data-[state=active]:text-pink-500 data-[state=active]:border-pink-500 text-gray-900 hover:text-pink-500", className), ...props })));
-TabsTrigger.displayName = TabsPrimitive.Trigger.displayName;
-const TabsContent = React.forwardRef(({ className, ...props }, ref) => (_jsx(TabsPrimitive.Content, { ref: ref, className: cn("mt-3 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 text-gray-900", className), ...props })));
-TabsContent.displayName = TabsPrimitive.Content.displayName;
-export { Tabs, TabsList, TabsTrigger, TabsContent };

package/publish/esm/components/Tabs/index.d.ts

@@ -1 +0,0 @@
-export { Tabs, TabsList, TabsTrigger, TabsContent } from "./Tabs";

package/publish/esm/components/Tabs/index.js

@@ -1 +0,0 @@
-export { Tabs, TabsList, TabsTrigger, TabsContent } from "./Tabs";

package/publish/esm/components/TextArea/TextArea.d.ts

@@ -1,9 +0,0 @@
-import { TextareaHTMLAttributes } from "react";
-export interface TextAreaProps extends TextareaHTMLAttributes<HTMLTextAreaElement> {
-    label?: string;
-    message?: string;
-    isError?: boolean;
-    inputClassName?: string;
-    size?: 1 | 2;
-}
-export declare const TextArea: import("react").ForwardRefExoticComponent<TextAreaProps & import("react").RefAttributes<HTMLTextAreaElement>>;

package/publish/esm/components/TextArea/TextArea.js

@@ -1,35 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef } from "react";
-import { QuestionMarkCircleIcon } from "@heroicons/react/24/outline";
-import { XCircleIcon } from "@heroicons/react/24/solid";
-import { cn } from "../../helpers/utils";
-export const TextArea = forwardRef(({ disabled, isError, message, label, className, inputClassName, size, rows = 3, ...restProps }, ref) => {
-    return (_jsxs("div", { className: cn("relative", className, isError && "mobase-text-area-error"), children: [label && (_jsx("span", { className: cn("mobase-text-area-label absolute bg-white -top-2.5 px-1.5 left-2 text-sm text-gray-500", size === 2 && " -top-2.5 text-sm"), children: label })), _jsx("textarea", { disabled: disabled, ref: ref, className: cn("mobase-text-area-box bg-white w-full text-sm transition-all rounded-md border border-gray-400  placeholder:text-gray-500 p-3 text-gray-900 focus:border-pink-500 disabled:bg-gray-50 disabled:border-gray-300 outline-none block", size === 2 && "text-base", inputClassName), rows: rows, ...restProps }), message && (_jsxs("div", { className: "mobase-text-area-message flex space-x-1 items-center mt-0.5", children: [isError ? (_jsx(XCircleIcon, { width: 16, height: 16, className: "text-red-500" })) : (_jsx(QuestionMarkCircleIcon, { width: 16, height: 16, className: "text-gray-500" })), _jsx("span", { className: cn("text-gray-500 ", size === 2 ? "text-sm" : "text-xs"), children: message })] })), _jsx("style", { children: `
-            .mobase-text-area-box:hover {
-              box-shadow: 0px 0px 0px 1px rgb(var(--mobase-gray-400) / 1) inset;
-            }
-
-            .mobase-text-area-box:focus, .mobase-text-area-box:focus-visible {
-              box-shadow: 0px 0px 0px 1px rgb(var(--mobase-pink-500) / 1) inset;
-            }
-
-            .mobase-text-area-box:disabled {
-              box-shadow: none;
-            }
-
-            .mobase-text-area-error {
-              .mobase-text-area-label {
-                color: rgb(var(--mobase-red-500) / 1);
-              }
-
-              .mobase-text-area-box {
-                box-shadow: 0px 0px 0px 1px rgb(var(--mobase-red-500) / 1) inset;
-                border-color: rgb(var(--mobase-red-500) / 1);
-              }
-
-              .mobase-text-area-message span {
-                color: rgb(var(--mobase-red-500) / 1);
-              }
-            }
-          ` })] }));
-});

package/publish/esm/components/TextArea/index.d.ts

@@ -1,2 +0,0 @@
-export { TextArea } from "./TextArea";
-export type { TextAreaProps } from "./TextArea";

package/publish/esm/components/TextArea/index.js

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

package/publish/esm/components/TextButton/TextButton.d.ts

@@ -1,22 +0,0 @@
-import * as React from "react";
-import { type VariantProps } from "class-variance-authority";
-declare const textButtonVariants: (props?: ({
-    variant?: "default" | "primary" | "secondary" | null | undefined;
-    size?: "default" | "lg" | null | undefined;
-} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
-export interface TextButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof textButtonVariants> {
-    /**
-     * CSS class to be appended to the root element.
-     */
-    className?: string;
-    /**
-     * Change the default rendered element for the one passed as a child, merging their props and behavior.
-     */
-    asChild?: boolean;
-    /**
-     * Disabled interaction and applies disabled styles
-     */
-    isDisabled?: boolean;
-}
-declare const TextButton: React.ForwardRefExoticComponent<TextButtonProps & React.RefAttributes<HTMLButtonElement>>;
-export { TextButton, textButtonVariants };

package/publish/esm/components/TextButton/TextButton.js

@@ -1,36 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import * as React from "react";
-import { Slot } from "@radix-ui/react-slot";
-import { cva } from "class-variance-authority";
-import { cn } from "../../helpers/utils";
-// /dwd
-const textButtonVariants = cva("inline-flex items-center justify-center whitespace-nowrap font-semibold transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed border border-transparent flex-nowrap", {
-    variants: {
-        /**
-         * Determines style variation of Button component.
-         */
-        variant: {
-            default: "text-blue-700 hover:underline hover:bg-blue-50 disabled:bg-transparent disabled:text-gray-400 disabled:no-underline",
-            primary: "text-pink-500 hover:underline hover:bg-pink-50 disabled:bg-transparent disabled:text-gray-400 disabled:no-underline",
-            secondary: "text-gray-700 hover:underline hover:text-blue-700 hover:bg-blue-50 disabled:bg-transparent disabled:text-gray-400 disabled:no-underline",
-        },
-        /**
-         * Determines size variation of Button component.
-         */
-        size: {
-            default: "text-sm",
-            lg: "text-base",
-        },
-    },
-    defaultVariants: {
-        variant: "default",
-        size: "default",
-    },
-});
-const TextButton = React.forwardRef(({ className, variant = "default", size = "default", asChild = false, isDisabled = false, ...props }, ref) => {
-    const Comp = asChild ? Slot : "button";
-    const buttonClassName = cn(textButtonVariants({ variant, size, className }));
-    return (_jsx(Comp, { className: buttonClassName, disabled: isDisabled, ref: ref, ...props, children: props.children }));
-});
-TextButton.displayName = "TextButton";
-export { TextButton, textButtonVariants };

package/publish/esm/components/TextButton/index.d.ts

@@ -1,2 +0,0 @@
-export { TextButton, textButtonVariants } from "./TextButton";
-export type { TextButtonProps } from "./TextButton";

package/publish/esm/components/TextButton/index.js

@@ -1 +0,0 @@
-export { TextButton, textButtonVariants } from "./TextButton";

package/publish/esm/components/TextInput/TextInput.d.ts

@@ -1,11 +0,0 @@
-import { InputHTMLAttributes } from "react";
-export interface TextInputProps extends InputHTMLAttributes<HTMLInputElement> {
-    label?: string;
-    message?: string;
-    isError?: boolean;
-    inputClassName?: string;
-    withClearButton?: boolean;
-    size?: 1 | 2;
-    onClickClear?: (inputValue: string) => void;
-}
-export declare const TextInput: import("react").ForwardRefExoticComponent<TextInputProps & import("react").RefAttributes<HTMLInputElement>>;

package/publish/esm/components/TextInput/TextInput.js

@@ -1,62 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, useEffect, useRef, useState, } from "react";
-import { QuestionMarkCircleIcon, XCircleIcon, XCircleIcon as XCircleIconSolid, } from "@heroicons/react/16/solid";
-import { cn } from "../../helpers/utils";
-export const TextInput = forwardRef(({ disabled, isError, message, label, className, inputClassName, withClearButton, size, onChange, onFocus, onClickClear, value, defaultValue, type = "text", ...restProps }, ref) => {
-    const [clearable, setClearable] = useState(false);
-    const rootRef = useRef(null);
-    const handleShowClearButton = (inputValue) => {
-        if (inputValue && !clearable) {
-            setClearable(true);
-        }
-        if (!inputValue && clearable) {
-            setClearable(false);
-        }
-    };
-    const onChangeFactory = (event) => {
-        if (withClearButton)
-            handleShowClearButton(event.target.value);
-        onChange?.(event);
-    };
-    const onFocusFactory = (event) => {
-        if (withClearButton)
-            handleShowClearButton(event.target.value);
-        onFocus?.(event);
-    };
-    const handleClear = () => {
-        const inputTarget = rootRef.current?.querySelector("input");
-        if (!inputTarget)
-            return;
-        onClickClear?.(inputTarget.value);
-        inputTarget.value = "";
-        inputTarget.focus();
-        setClearable(false);
-    };
-    useEffect(() => {
-        handleShowClearButton(defaultValue || value);
-    }, [value, defaultValue]);
-    return (_jsxs("div", { className: cn(className, isError && "mobase-text-input-error"), ref: rootRef, children: [_jsxs("div", { className: "relative", children: [label && (_jsx("span", { className: cn("mobase-text-input-label absolute bg-white -top-2 px-1.5 left-2 text-xs text-gray-500", size === 2 && " -top-2.5 text-sm"), children: label })), _jsx("input", { disabled: disabled, type: type, ref: ref, className: cn("mobase-text-input-box bg-white w-full transition-all text-sm rounded-md border border-gray-400  placeholder:text-gray-500 p-3 text-gray-900 h-11 focus:border-pink-500 disabled:bg-gray-50 disabled:border-gray-300 disabled:pointer-events-none block outline-none", size === 2 && "h-12 text-base", inputClassName), onChange: onChangeFactory, onFocus: onFocusFactory, value: value, defaultValue: defaultValue, ...restProps }), withClearButton && clearable && (_jsx("button", { "aria-label": "button", type: "button", className: "absolute right-3 top-1/2 -translate-y-1/2 shrink-0 cursor-pointer text-gray-500 duration-200 hover:opacity-70 disabled:pointer-events-none", disabled: disabled, onClick: handleClear, children: _jsx(XCircleIcon, { strokeWidth: 2, width: 20, height: 20 }) }))] }), message && (_jsxs("div", { className: "mobase-text-input-message flex space-x-1 items-center mt-0.5", children: [isError ? (_jsx(XCircleIconSolid, { width: 16, height: 16, className: "text-red-500" })) : (_jsx(QuestionMarkCircleIcon, { width: 16, height: 16, className: "text-gray-500" })), _jsx("span", { className: cn("text-gray-500 ", size === 2 ? "text-sm" : "text-xs"), children: message })] })), _jsx("style", { children: `
-            .mobase-text-input-box:hover {
-                box-shadow: 0px 0px 0px 1px rgb(var(--mobase-gray-400) / 1) inset;
-            }
-
-            .mobase-text-input-box:focus , .mobase-text-input-box:focus-visible {
-                box-shadow: 0px 0px 0px 1px rgb(var(--mobase-pink-500) / 1) inset;
-            }
-
-            .mobase-text-input-error {
-              .mobase-text-input-label {
-                color: rgb(var(--mobase-red-500) / 1);
-              }
-
-              .mobase-text-input-box {
-                box-shadow: 0px 0px 0px 1px rgb(var(--mobase-red-500) / 1) inset;
-                border-color: rgb(var(--mobase-red-500) / 1);
-              }
-
-              .mobase-text-input-message span {
-                color: rgb(var(--mobase-red-500) / 1);
-              }
-            }
-          ` })] }));
-});

package/publish/esm/components/TextInput/index.d.ts

@@ -1,2 +0,0 @@
-export { TextInput } from "./TextInput";
-export type { TextInputProps } from "./TextInput";

package/publish/esm/components/TextInput/index.js

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

package/publish/esm/components/Toast/Toast.d.ts

@@ -1,15 +0,0 @@
-import * as React from "react";
-import * as ToastPrimitives from "@radix-ui/react-toast";
-import { type VariantProps } from "class-variance-authority";
-declare const ToastProvider: React.FC<ToastPrimitives.ToastProviderProps>;
-declare const ToastViewport: React.ForwardRefExoticComponent<Omit<ToastPrimitives.ToastViewportProps & React.RefAttributes<HTMLOListElement>, "ref"> & React.RefAttributes<HTMLOListElement>>;
-declare const Toast: React.ForwardRefExoticComponent<Omit<ToastPrimitives.ToastProps & React.RefAttributes<HTMLLIElement>, "ref"> & VariantProps<(props?: ({
-    variant?: "sucess" | "warning" | "error" | null | undefined;
-} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string> & React.RefAttributes<HTMLLIElement>>;
-declare const ToastAction: React.ForwardRefExoticComponent<Omit<ToastPrimitives.ToastActionProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
-declare const ToastClose: React.ForwardRefExoticComponent<Omit<ToastPrimitives.ToastCloseProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
-declare const ToastTitle: React.ForwardRefExoticComponent<Omit<ToastPrimitives.ToastTitleProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
-declare const ToastDescription: React.ForwardRefExoticComponent<Omit<ToastPrimitives.ToastDescriptionProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
-type ToastProps = React.ComponentPropsWithoutRef<typeof Toast>;
-type ToastActionElement = React.ReactElement<typeof ToastAction>;
-export { type ToastProps, type ToastActionElement, ToastProvider, ToastViewport, Toast, ToastTitle, ToastDescription, ToastClose, ToastAction, };

package/publish/esm/components/Toast/Toast.js

@@ -1,34 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import * as React from "react";
-import * as ToastPrimitives from "@radix-ui/react-toast";
-import { cva } from "class-variance-authority";
-import { cn } from "../../helpers/utils";
-import { XMarkIcon, CheckCircleIcon, ExclamationTriangleIcon, InformationCircleIcon, } from "@heroicons/react/20/solid";
-const ToastProvider = ToastPrimitives.Provider;
-const ToastViewport = React.forwardRef(({ className, ...props }, ref) => (_jsx(ToastPrimitives.Viewport, { ref: ref, className: cn("fixed bottom-0 z-[100] flex max-h-screen w-full flex-col-reverse p-4 left-0 sm:right-0 sm:left-auto sm:top-0 sm:bottom-auto sm:flex-col md:max-w-[420px]", className), ...props })));
-ToastViewport.displayName = ToastPrimitives.Viewport.displayName;
-const toastVariants = cva("group pointer-events-auto relative w-full overflow-hidden rounded-md border py-4 pr-10 pl-10 shadow-lg transition-all data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:transition-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[swipe=end]:animate-out data-[state=closed]:fade-out-80 data-[state=closed]:slide-out-to-right-full data-[state=open]:slide-in-from-bottom-full data-[state=open]:sm:slide-in-from-top-full bg-white text-gray-900 border border-gray-200 border-l-4", {
-    variants: {
-        variant: {
-            sucess: "border-l-green-500",
-            warning: "border-l-yellow-500",
-            error: "border-l-red-500",
-        },
-    },
-    defaultVariants: {
-        variant: "sucess",
-    },
-});
-const Toast = React.forwardRef(({ className, variant = "sucess", children, ...props }, ref) => {
-    return (_jsxs(ToastPrimitives.Root, { ref: ref, className: cn(toastVariants({ variant }), className), ...props, children: [_jsxs("div", { className: "w-5 h-5 flex items-center justify-center absolute top-4 left-3", children: [variant === "sucess" && (_jsx(CheckCircleIcon, { className: "w-5 h-5 text-green-500" })), variant === "warning" && (_jsx(ExclamationTriangleIcon, { className: "w-5 h-5 text-yellow-500" })), variant === "error" && (_jsx(InformationCircleIcon, { className: "w-5 h-5 text-red-500" }))] }), children] }));
-});
-Toast.displayName = ToastPrimitives.Root.displayName;
-const ToastAction = React.forwardRef(({ className, ...props }, ref) => (_jsx(ToastPrimitives.Action, { ref: ref, className: cn("inline-flex shrink-0 items-center justify-center bg-transparent text-sm font-medium ring-offset-background transition-colors hover:bg-secondary focus:outline-none focus:ring-0 focus:ring-ring focus:ring-offset-0 disabled:pointer-events-none disabled:opacity-50 text-blue-600 hover:underline mt-2", className), ...props })));
-ToastAction.displayName = ToastPrimitives.Action.displayName;
-const ToastClose = React.forwardRef(({ className, ...props }, ref) => (_jsx(ToastPrimitives.Close, { ref: ref, className: cn("absolute right-2 top-2 rounded-md  transition-opacity hover:opacity-70 focus:opacity-100 focus:outline-none focus:ring-2 text-gray-800 w-8 h-8 flex items-center justify-center", className), "toast-close": "", ...props, children: _jsx(XMarkIcon, { className: "h-5 w-5" }) })));
-ToastClose.displayName = ToastPrimitives.Close.displayName;
-const ToastTitle = React.forwardRef(({ className, ...props }, ref) => (_jsx(ToastPrimitives.Title, { ref: ref, className: cn("text-base font-semibold leading-tight", className), ...props })));
-ToastTitle.displayName = ToastPrimitives.Title.displayName;
-const ToastDescription = React.forwardRef(({ className, ...props }, ref) => (_jsx(ToastPrimitives.Description, { ref: ref, className: cn("text-sm opacity-90", className), ...props })));
-ToastDescription.displayName = ToastPrimitives.Description.displayName;
-export { ToastProvider, ToastViewport, Toast, ToastTitle, ToastDescription, ToastClose, ToastAction, };

package/publish/esm/components/Toast/index.d.ts

@@ -1,2 +0,0 @@
-export { useToast, toast } from "./useToast";
-export { Toaster } from "./toaster";