@ceed/cds 0.0.186 → 0.0.187-treeshaking.1

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

@@ -1,3 +1,3 @@
-import { Pagination } from "./Pagination";
-export * from "./Pagination";
+import { Pagination } from "./Pagination.js";
+export * from "./Pagination.js";
 export default Pagination;

package/dist/components/Pagination/index.js

@@ -0,0 +1,5 @@
+import { Pagination } from './Pagination.js';
+
+
+
+export { Pagination, Pagination as default };

package/dist/components/PercentageInput/PercentageInput.js

@@ -0,0 +1,85 @@
+import React__default, { useCallback, useState, useMemo } from 'react';
+import { NumericFormat } from 'react-number-format';
+import { styled, useThemeProps } from '@mui/joy';
+import { Input } from '../Input/Input.js';
+import { useControlledState } from '../../hooks/use-controlled-state/index.js';
+
+const padDecimal = (value, decimalScale) => {
+    const [integer, decimal = ""] = `${value}`.split(".");
+    return Number(`${integer}${decimal.padEnd(decimalScale, "0")}`);
+};
+const TextMaskAdapter = React__default.forwardRef(function TextMaskAdapter(props, ref) {
+    // prop destruction
+    const { onChange, min, max, ...innerProps } = props;
+    // lib hooks
+    // state, ref, querystring hooks
+    // form hooks
+    // query hooks
+    // calculated values
+    // effects
+    // handlers
+    return (React__default.createElement(NumericFormat, { ...innerProps, onValueChange: ({ value }) => {
+            onChange?.({
+                target: {
+                    name: props.name,
+                    value,
+                },
+            });
+        }, valueIsNumericString: true, thousandSeparator: true, suffix: "%", getInputRef: ref, allowNegative: true }));
+});
+const PercentageInputRoot = styled(Input, {
+    name: "PercentageInput",
+    slot: "Root",
+    overridesResolver: (props, styles) => styles.root,
+})({});
+const PercentageInput = React__default.forwardRef(function PercentageInput(inProps, ref) {
+    // prop destruction
+    const props = useThemeProps({ props: inProps, name: "PercentageInput" });
+    const { name, onChange, label, error, helperText, required, disabled, useMinorUnit, maxDecimalScale = 0, min, max, 
+    // NOTE: 스타일 관련된 props는 최상위 엘리먼트에 적용한다.
+    sx, className, ...innerProps } = props;
+    // lib hooks
+    // state, ref, querystring hooks
+    const [_value, setValue] = useControlledState(props.value, props.defaultValue, useCallback((value) => onChange?.({ target: { name, value } }), [onChange, name]));
+    const [internalError, setInternalError] = useState((max && _value && _value > max) || (min && _value && _value < min));
+    // form hooks
+    // query hooks
+    // calculated values
+    const value = useMemo(() => {
+        if (_value && useMinorUnit) {
+            return _value / Math.pow(10, maxDecimalScale);
+        }
+        return _value;
+    }, [_value, useMinorUnit, maxDecimalScale]);
+    // effects
+    // handlers
+    const handleChange = useCallback((event) => {
+        if (event.target.value === "") {
+            setValue(undefined);
+            return;
+        }
+        const originalAmount = Number(event.target.value);
+        if ((min && originalAmount < min) || (max && originalAmount > max)) {
+            setInternalError(true);
+        }
+        else {
+            setInternalError(false);
+        }
+        const amount = useMinorUnit
+            ? padDecimal(originalAmount, maxDecimalScale)
+            : originalAmount;
+        setValue(amount);
+    }, [setValue, useMinorUnit, maxDecimalScale, min, max]);
+    return (React__default.createElement(PercentageInputRoot, { ...innerProps, ref: ref, value: value, onChange: handleChange, error: internalError || error, disabled: disabled, required: required, color: internalError || error ? "danger" : props.color, label: label, helperText: helperText, slotProps: {
+            input: {
+                component: TextMaskAdapter,
+                "aria-label": innerProps["aria-label"],
+                decimalScale: maxDecimalScale,
+            },
+        }, sx: {
+            ...sx,
+        }, className: className }));
+});
+PercentageInput.displayName = "PercentageInput";
+
+export { PercentageInput };

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

@@ -1,3 +1,3 @@
-import { PercentageInput } from './PercentageInput';
-export * from './PercentageInput';
+import { PercentageInput } from "./PercentageInput.js";
+export * from "./PercentageInput.js";
 export default PercentageInput;

package/dist/components/Radio/Radio.js

@@ -0,0 +1,11 @@
+import { Radio as Radio$1, RadioGroup as RadioGroup$1 } from '@mui/joy';
+import { motion } from 'framer-motion';
+
+const MotionRadio = motion(Radio$1);
+const Radio = MotionRadio;
+Radio.displayName = "Radio";
+const MotionRadioGroup = motion(RadioGroup$1);
+const RadioGroup = MotionRadioGroup;
+RadioGroup.displayName = "RadioGroup";
+
+export { Radio, RadioGroup };

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

@@ -1,3 +1,3 @@
-import { Radio } from "./Radio";
-export * from "./Radio";
+import { Radio } from "./Radio.js";
+export * from "./Radio.js";
 export default Radio;

package/dist/components/RadioList/RadioList.d.ts

@@ -1,5 +1,5 @@
 import React, { ComponentProps, ReactNode } from "react";
-import { RadioGroup } from "../Radio/Radio";
+import { RadioGroup } from "../Radio/Radio.js";
 declare function RadioList(props: {
     items: {
         label: ReactNode;

package/dist/components/RadioList/RadioList.js

@@ -0,0 +1,18 @@
+import React__default from 'react';
+import { RadioGroup, Radio } from '../Radio/Radio.js';
+
+function RadioList(props) {
+    // prop destruction
+    const { items, ...innerProps } = props;
+    // lib hooks
+    // state, ref, querystring hooks
+    // form hooks
+    // query hooks
+    // calculated values
+    // effects
+    // handlers
+    return (React__default.createElement(RadioGroup, { ...innerProps }, items.map((item) => (React__default.createElement(Radio, { key: `${item.value}`, value: item.value, label: item.label })))));
+}
+RadioList.displayName = "RadioList";
+
+export { RadioList };

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

@@ -1,3 +1,3 @@
-import { RadioList } from "./RadioList";
-export * from "./RadioList";
+import { RadioList } from "./RadioList.js";
+export * from "./RadioList.js";
 export default RadioList;

package/dist/components/Select/Select.d.ts

@@ -9,7 +9,7 @@ declare const Option: import("framer-motion").CustomDomComponent<{
     label?: string | React.ReactElement<any, string | React.JSXElementConstructor<any>> | undefined;
     variant?: import("@mui/types").OverridableStringUnion<import("@mui/joy").VariantProp, import("@mui/joy").OptionPropsVariantOverrides> | undefined;
     value: any;
-    sx?: import("@mui/joy/styles/types").SxProps | undefined;
+    sx?: import("@mui/joy/styles/types/theme.js").SxProps | undefined;
 } & import("@mui/joy").OptionSlotsAndSlotProps & Omit<Omit<React.DetailedHTMLProps<React.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & {
     ref?: ((instance: HTMLLIElement | null) => void) | React.RefObject<HTMLLIElement> | null | undefined;
 }, "label" | "children" | "color" | "variant" | "sx" | "disabled" | "value" | keyof import("@mui/joy").OptionSlotsAndSlotProps>>;

package/dist/components/Select/Select.js

@@ -0,0 +1,56 @@
+import React__default, { useMemo } from 'react';
+import { Option as Option$1, Select as Select$1 } from '@mui/joy';
+import { motion } from 'framer-motion';
+import { FormControl } from '../FormControl/FormControl.js';
+import { FormLabel } from '../FormLabel/FormLabel.js';
+import { FormHelperText } from '../FormHelperText/FormHelperText.js';
+
+// NOTE: Context를 공유하는 컴포넌트는 한 파일로 번들링되어야 Framer에서 문제 없이 동작할수 있다.
+// 파일별로 필요한 패키지를 모두 import 하도록 되어 있기 때문에 다른 파일에서 내보내면 Context가 고유하게 2개 생기는것이 원인이다.
+const MotionOption = motion(Option$1);
+const Option = MotionOption;
+Option.displayName = "Option";
+function Select(props) {
+    // prop destruction
+    const { label, helperText, error, size, color, disabled, required, onChange, 
+    // NOTE: 스타일 관련된 props는 최상위 엘리먼트에 적용한다.
+    sx, className, ...innerProps } = props;
+    // lib hooks
+    // state, ref, querystring hooks
+    // form hooks
+    // query hooks
+    // calculated values
+    const options = useMemo(() => props.options.map((option) => {
+        if (typeof option !== "object") {
+            return {
+                value: option,
+                label: option,
+            };
+        }
+        return option;
+    }), [props.options]);
+    // effects
+    // handlers
+    const handleChange = (event, newValue) => {
+        const _event = event || { target: {} };
+        const newEvent = {
+            ..._event,
+            target: {
+                // @ts-expect-error target에 name이 있을 수 있다.
+                name: _event.target?.name || props.name,
+                value: newValue || undefined,
+            },
+        };
+        onChange?.(newEvent);
+    };
+    const select = (React__default.createElement(Select$1, { ...innerProps, required: required, disabled: disabled, size: size, color: error ? "danger" : color, onChange: handleChange }, options.map((option) => (React__default.createElement(Option, { key: option.value, value: option.value }, option.label)))));
+    return (React__default.createElement(FormControl, { required: required, disabled: disabled, size: size, color: color, error: error, 
+        // NOTE: 스타일 관련된 props는 최상위 엘리먼트에 적용한다.
+        sx: sx, className: className },
+        label && React__default.createElement(FormLabel, null, label),
+        select,
+        helperText && React__default.createElement(FormHelperText, null, helperText)));
+}
+Select.displayName = "Select";
+
+export { Option, Select };

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

@@ -1,3 +1,3 @@
-import { Select } from "./Select";
-export * from "./Select";
+import { Select } from "./Select.js";
+export * from "./Select.js";
 export default Select;

package/dist/components/Select/index.js

@@ -0,0 +1,6 @@
+import { Select } from './Select.js';
+export { Option } from './Select.js';
+
+
+
+export { Select, Select as default };

package/dist/components/Sheet/Sheet.js

@@ -0,0 +1,8 @@
+import { Sheet as Sheet$1 } from '@mui/joy';
+import { motion } from 'framer-motion';
+
+const MotionSheet = motion(Sheet$1);
+const Sheet = MotionSheet;
+Sheet.displayName = "Sheet";
+
+export { Sheet };

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

@@ -1,3 +1,3 @@
-import { Sheet } from "./Sheet";
-export * from "./Sheet";
+import { Sheet } from "./Sheet.js";
+export * from "./Sheet.js";
 export default Sheet;

package/dist/components/Sheet/index.js

@@ -0,0 +1,5 @@
+import { Sheet } from './Sheet.js';
+
+
+
+export { Sheet, Sheet as default };

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

@@ -1,3 +1,3 @@
-import { Stack } from "./Stack";
-export * from "./Stack";
+import { Stack } from "./Stack.js";
+export * from "./Stack.js";
 export default Stack;

package/dist/components/Stack/index.js

@@ -0,0 +1,2 @@
+import { Stack } from '@mui/joy';
+export { Stack, Stack as default } from '@mui/joy';

package/dist/components/Stepper/Stepper.js

@@ -0,0 +1,66 @@
+import React__default from 'react';
+import { styled, Step as Step$1, StepIndicator as StepIndicator$1, Stepper as Stepper$1, stepIndicatorClasses, stepClasses, Stack } from '@mui/joy';
+import CheckIcon from '../../external/@mui/icons-material/esm/Check.js';
+import { motion } from 'framer-motion';
+import { Typography } from '../Typography/Typography.js';
+
+const Step = styled(Step$1)({});
+Step.displayName = "Step";
+const StepIndicator = styled(StepIndicator$1)({});
+StepIndicator.displayName = "StepIndicator";
+const StyledStepper = styled(Stepper$1)(({ theme }) => ({
+    "--StepIndicator-size": "24px",
+    "--Step-gap": theme.spacing(2),
+    "--joy-palette-success-solidBg": "var(--joy-palette-success-400)",
+    [`& .${stepIndicatorClasses.root}`]: {
+        fontSize: "var(--ceed-fontSize-xs)",
+    },
+}));
+const MotionStepper = motion(StyledStepper);
+function Stepper(props) {
+    // prop destruction
+    const { steps, activeColor = "primary.500", inactiveColor = "neutral.400", activeLineColor = "primary.500", inactiveLineColor = "neutral.300", activeStep, } = props;
+    // lib hooks
+    // state, ref, querystring hooks
+    // form hooks
+    // query hooks
+    // calculated values
+    // effects
+    // handlers
+    return (React__default.createElement(MotionStepper, { sx: (theme) => ({
+            "--StepIndicator-size": "24px",
+            "--Step-gap": theme.spacing(2),
+            [`& .${stepIndicatorClasses.root}`]: {
+                fontSize: "var(--ceed-fontSize-xs)",
+            },
+            [`& .${stepClasses.completed}`]: {
+                "&::after": { bgcolor: activeLineColor },
+                [`& .${stepIndicatorClasses.root}`]: {
+                    bgcolor: activeColor,
+                },
+            },
+            [`& .${stepClasses.active}`]: {
+                "&::after": { bgcolor: inactiveLineColor },
+                [`& .${stepIndicatorClasses.root}`]: {
+                    bgcolor: activeColor,
+                },
+            },
+            [`& .${stepClasses.disabled}`]: {
+                "&::after": { bgcolor: inactiveLineColor },
+                [`& .${stepIndicatorClasses.root}`]: {
+                    bgcolor: inactiveColor,
+                },
+            },
+        }) }, steps.map((step, i) => {
+        const active = activeStep === i + 1;
+        const completed = activeStep > i + 1;
+        const disabled = activeStep < i + 1;
+        const hasContent = step.label || step.extraContent;
+        return (React__default.createElement(Step, { indicator: React__default.createElement(StepIndicator, { variant: "solid", color: "primary" }, completed ? React__default.createElement(CheckIcon, null) : step.indicatorContent), active: active, completed: completed, disabled: disabled }, hasContent && (React__default.createElement(Stack, null,
+            step.label && (React__default.createElement(Typography, { level: "title-sm" }, step.label)),
+            step.extraContent && (React__default.createElement(Typography, { level: "body-xs" }, step.extraContent))))));
+    })));
+}
+Stepper.displayName = "Stepper";
+
+export { Step, StepIndicator, Stepper };

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

@@ -1,3 +1,3 @@
-import { Stepper } from './Stepper';
-export * from './Stepper';
+import { Stepper } from "./Stepper.js";
+export * from "./Stepper.js";
 export default Stepper;

package/dist/components/Switch/Switch.js

@@ -0,0 +1,46 @@
+import React__default from 'react';
+import { Switch as Switch$1, styled, switchClasses } from '@mui/joy';
+import { motion } from 'framer-motion';
+
+const MotionSwitch = motion(Switch$1);
+const StyledThumb = styled(motion.div)({
+    "--Icon-fontSize": "calc(var(--Switch-thumbSize) * 0.75)",
+    display: "inline-flex",
+    justifyContent: "center",
+    alignItems: "center",
+    position: "absolute",
+    left: "var(--Switch-thumbOffset)",
+    width: "var(--Switch-thumbWidth)",
+    height: "var(--Switch-thumbSize)",
+    borderRadius: "var(--Switch-thumbRadius)",
+    boxShadow: "var(--Switch-thumbShadow)",
+    color: "var(--Switch-thumbColor)",
+    backgroundColor: "var(--Switch-thumbBackground)",
+    [`&.${switchClasses.checked}`]: {
+        left: "unset",
+        right: "var(--Switch-thumbOffset)",
+    },
+});
+const Thumb = (props) => (React__default.createElement(StyledThumb, { ...props, layout: true, transition: spring }));
+const spring = {
+    type: "spring",
+    stiffness: 700,
+    damping: 30,
+};
+const Switch = (props) => {
+    // prop destruction
+    // lib hooks
+    // state, ref, querystring hooks
+    // form hooks
+    // query hooks
+    // calculated values
+    // effects
+    // handlers
+    return (React__default.createElement(MotionSwitch, { ...props, slots: {
+            thumb: Thumb,
+            ...props.slots,
+        } }));
+};
+Switch.displayName = "Switch";
+
+export { Switch };

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

@@ -1,3 +1,3 @@
-import { Switch } from "./Switch";
-export * from "./Switch";
+import { Switch } from "./Switch.js";
+export * from "./Switch.js";
 export default Switch;

package/dist/components/Table/Table.js

@@ -0,0 +1,64 @@
+import React__default from 'react';
+import { Table as Table$1 } from '@mui/joy';
+import { Checkbox } from '../Checkbox/Checkbox.js';
+
+const Table = (props) => {
+    // prop destruction
+    const { children, ...inheritProps } = props;
+    // lib hooks
+    // state, ref, querystring hooks
+    // form hooks
+    // query hooks
+    // calculated values
+    // effects
+    // handlers
+    return React__default.createElement(Table$1, { ...inheritProps }, children);
+};
+Table.displayName = "Table";
+function TableHead(props) {
+    // prop destruction
+    const { headCells, showCheckbox, onCheckboxChange, slots: { checkbox: RenderCheckbox = Checkbox } = {}, slotProps: { checkbox: checkboxProps = {} } = {}, } = props;
+    // lib hooks
+    // state, ref, querystring hooks
+    // form hooks
+    // query hooks
+    // calculated values
+    // effects
+    // handlers
+    return (React__default.createElement("thead", null,
+        React__default.createElement("tr", null,
+            showCheckbox && (React__default.createElement("th", { style: {
+                    width: "40px",
+                    textAlign: "center",
+                } },
+                React__default.createElement(RenderCheckbox, { onChange: onCheckboxChange, ...checkboxProps }))),
+            headCells.map((headCell) => (React__default.createElement("th", { key: headCell.label, style: {
+                    width: headCell.width,
+                    minWidth: headCell.minWidth,
+                    maxWidth: headCell.maxWidth,
+                    textAlign: headCell.numeric ? "right" : "left",
+                } }, headCell.label))))));
+}
+TableHead.displayName = "TableHead";
+function TableBody(props) {
+    // prop destruction
+    const { rows, cellOrder, rowOptions, showCheckbox, onCheckboxChange, slots: { checkbox: RenderCheckbox = Checkbox } = {}, slotProps: { checkbox: checkboxProps = {} } = {}, } = props;
+    // lib hooks
+    // state, ref, querystring hooks
+    // form hooks
+    // query hooks
+    // calculated values
+    // effects
+    // handlers
+    return (React__default.createElement("tbody", null, rows.map((row, rowIndex) => (React__default.createElement("tr", { key: rowIndex },
+        showCheckbox && (React__default.createElement("td", { style: {
+                textAlign: "center",
+            } },
+            React__default.createElement(RenderCheckbox, { onChange: (event) => onCheckboxChange?.(event, rowIndex), ...checkboxProps }))),
+        cellOrder.map((cellKey) => (React__default.createElement("td", { key: cellKey, style: {
+                textAlign: rowOptions?.[cellKey]?.numeric ? "right" : "left",
+            } }, row[cellKey]))))))));
+}
+TableBody.displayName = "TableBody";
+
+export { Table, TableBody, TableHead };

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

@@ -1,3 +1,3 @@
-import { Table } from "./Table";
-export * from "./Table";
+import { Table } from "./Table.js";
+export * from "./Table.js";
 export default Table;

package/dist/components/Tabs/Tabs.js

@@ -0,0 +1,17 @@
+import { Tabs as Tabs$1, Tab as Tab$1, TabList as TabList$1, TabPanel as TabPanel$1 } from '@mui/joy';
+import { motion } from 'framer-motion';
+
+const MotionTabs = motion(Tabs$1);
+const Tabs = MotionTabs;
+Tabs.displayName = "Tabs";
+const MotionTab = motion(Tab$1);
+const Tab = MotionTab;
+Tab.displayName = "Tab";
+const MotionTabList = motion(TabList$1);
+const TabList = MotionTabList;
+TabList.displayName = "TabList";
+const MotionTabPanel = motion(TabPanel$1);
+const TabPanel = MotionTabPanel;
+TabPanel.displayName = "TabPanel";
+
+export { Tab, TabList, TabPanel, Tabs };

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

@@ -1,3 +1,3 @@
-import { Tabs } from "./Tabs";
-export * from "./Tabs";
+import { Tabs } from "./Tabs.js";
+export * from "./Tabs.js";
 export default Tabs;

package/dist/components/Textarea/Textarea.d.ts

@@ -3,24 +3,10 @@ import { TextareaProps } from "@mui/joy";
 import { MotionProps } from "framer-motion";
 declare const Textarea: {
     (props: {
-        label?: string | undefined;
-        error?: boolean | undefined;
+        label?: string;
+        error?: boolean;
         helperText?: React.ReactNode;
-    } & {
-        component?: React.ElementType<any, keyof React.JSX.IntrinsicElements> | undefined;
-    } & import("@mui/joy").TextareaSlotsAndSlotProps & Pick<React.TextareaHTMLAttributes<HTMLTextAreaElement>, "defaultValue" | "autoFocus" | "id" | "onFocus" | "onBlur" | "onChange" | "onKeyDown" | "onKeyUp" | "onClick" | "disabled" | "required" | "name" | "value" | "autoComplete" | "placeholder" | "readOnly"> & {
-        color?: import("@mui/types").OverridableStringUnion<import("@mui/joy").ColorPaletteProp, import("@mui/joy").TextareaPropsColorOverrides> | undefined;
-        endDecorator?: React.ReactNode;
-        error?: boolean | undefined;
-        maxRows?: string | number | undefined;
-        minRows?: string | number | undefined;
-        startDecorator?: React.ReactNode;
-        size?: import("@mui/types").OverridableStringUnion<"sm" | "md" | "lg", import("@mui/joy").TextareaPropsSizeOverrides> | undefined;
-        sx?: import("@mui/joy/styles/types").SxProps | undefined;
-        variant?: import("@mui/types").OverridableStringUnion<import("@mui/joy").VariantProp, import("@mui/joy").TextareaPropsVariantOverrides> | undefined;
-    } & Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-        ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
-    }, "color" | "defaultValue" | "autoFocus" | "id" | "onFocus" | "onBlur" | "onChange" | "onKeyDown" | "onKeyUp" | "onClick" | "variant" | "sx" | "disabled" | "size" | "error" | "required" | "endDecorator" | "startDecorator" | "name" | "value" | "component" | "autoComplete" | "placeholder" | "readOnly" | keyof import("@mui/joy").TextareaSlotsAndSlotProps | "maxRows" | "minRows"> & MotionProps): React.JSX.Element;
+    } & TextareaProps & MotionProps): React.JSX.Element;
     displayName: string;
 };
 export { Textarea };

package/dist/components/Textarea/Textarea.js

@@ -0,0 +1,31 @@
+import React__default from 'react';
+import { Textarea as Textarea$1 } from '@mui/joy';
+import { motion } from 'framer-motion';
+import { FormControl } from '../FormControl/FormControl.js';
+import { FormLabel } from '../FormLabel/FormLabel.js';
+import { FormHelperText } from '../FormHelperText/FormHelperText.js';
+
+const MotionTextarea = motion(Textarea$1);
+const Textarea = (props) => {
+    // prop destruction
+    const { label, error, helperText, color, size, disabled, required, minRows = 2, maxRows = 4, 
+    // NOTE: 스타일 관련된 props는 최상위 엘리먼트에 적용한다.
+    sx, className, ...innerProps } = props;
+    // lib hooks
+    // state, ref, querystring hooks
+    // form hooks
+    // query hooks
+    // calculated values
+    // effects
+    // handlers
+    const textarea = (React__default.createElement(MotionTextarea, { required: required, disabled: disabled, color: error ? "danger" : color, size: size, minRows: minRows, maxRows: maxRows, ...innerProps }));
+    return (React__default.createElement(FormControl, { required: required, disabled: disabled, color: color, size: size, error: error, 
+        // NOTE: 스타일 관련된 props는 최상위 엘리먼트에 적용한다.
+        sx: sx, className: className },
+        label && React__default.createElement(FormLabel, null, label),
+        textarea,
+        helperText && React__default.createElement(FormHelperText, null, helperText)));
+};
+Textarea.displayName = "Textarea";
+
+export { Textarea };

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

@@ -1,3 +1,3 @@
-import { Textarea } from "./Textarea";
-export * from "./Textarea";
+import { Textarea } from "./Textarea.js";
+export * from "./Textarea.js";
 export default Textarea;

package/dist/components/Textarea/index.js

@@ -0,0 +1,5 @@
+import { Textarea } from './Textarea.js';
+
+
+
+export { Textarea, Textarea as default };

package/dist/components/ThemeProvider/ThemeProvider.d.ts

@@ -1,12 +1,12 @@
 import React, { ComponentProps } from "react";
 import { CssBaseline, extendTheme, StyleOverrides, Theme } from "@mui/joy";
-import { CalendarOwnerState, CalendarProps, CalendarSlot } from "../Calendar/types";
-import { CurrencyInput } from "../CurrencyInput";
-import { DatePickerProps } from "../DatePicker";
-import { DateRangePickerProps } from "../DateRangePicker";
-import { MonthPickerProps } from "../MonthPicker";
-import { MonthRangePickerProps } from "../MonthRangePicker";
-import { PercentageInputProps } from "../PercentageInput";
+import { CalendarOwnerState, CalendarProps, CalendarSlot } from "../Calendar/types.js";
+import { CurrencyInput } from "../CurrencyInput/index.js";
+import { DatePickerProps } from "../DatePicker/index.js";
+import { DateRangePickerProps } from "../DateRangePicker/index.js";
+import { MonthPickerProps } from "../MonthPicker/index.js";
+import { MonthRangePickerProps } from "../MonthRangePicker/index.js";
+import { PercentageInputProps } from "../PercentageInput/index.js";
 declare module "@mui/joy/styles" {
     interface TypographySystemOverrides {
         "marketing-lg": true;