@moneyforward/mfui-components 2.48.2 → 3.0.0

package/dist/cjs/src/Accordion/Accordion.js

@@ -1,139 +0,0 @@
-"use strict";
-'use client';
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Accordion = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const mfui_icons_react_1 = require("@moneyforward/mfui-icons-react");
-const css_1 = require("../../styled-system/css");
-const recipes_1 = require("../../styled-system/recipes");
-const Typography_1 = require("../Typography");
-const FocusIndicator_1 = require("../FocusIndicator");
-const AccordionContext = (0, react_1.createContext)(null);
-const AccordionItemContext = (0, react_1.createContext)(null);
-const useAccordionContext = () => {
-    const context = (0, react_1.useContext)(AccordionContext);
-    if (!context) {
-        throw new Error('Accordion compound components cannot be rendered outside the Accordion component');
-    }
-    return context;
-};
-const useAccordionItemContext = () => {
-    const context = (0, react_1.useContext)(AccordionItemContext);
-    if (!context) {
-        throw new Error('Accordion.Trigger and Accordion.Target must be rendered inside the Accordion.Item component');
-    }
-    return context;
-};
-function AccordionBase({ children, size = 'medium', width, defaultOpenItems = [] }) {
-    const defaultOpenItemsMap = (0, react_1.useMemo)(() => Object.fromEntries(defaultOpenItems.map((id) => [id, true])), [defaultOpenItems]);
-    const [openItems, setOpenItems] = (0, react_1.useState)(defaultOpenItemsMap);
-    const toggleItem = (0, react_1.useCallback)((id) => {
-        setOpenItems((previous) => ({
-            ...previous,
-            [id]: !previous[id],
-        }));
-    }, []);
-    const contextValue = (0, react_1.useMemo)(() => ({
-        size,
-        openItems,
-        toggleItem,
-    }), [size, openItems, toggleItem]);
-    const containerStyle = {
-        ...(width && { width }),
-    };
-    return ((0, jsx_runtime_1.jsx)("div", { style: containerStyle, children: (0, jsx_runtime_1.jsx)(AccordionContext.Provider, { value: contextValue, children: children }) }));
-}
-function AccordionItem({ children, id, enableAutoUnmount = true }) {
-    const { openItems, toggleItem } = useAccordionContext();
-    const isOpen = openItems[id] || false;
-    const toggle = (0, react_1.useCallback)(() => {
-        toggleItem(id);
-    }, [toggleItem, id]);
-    const contextValue = (0, react_1.useMemo)(() => ({
-        isOpen,
-        toggle,
-        enableAutoUnmount,
-        id,
-    }), [isOpen, toggle, enableAutoUnmount, id]);
-    return ((0, jsx_runtime_1.jsx)("section", { children: (0, jsx_runtime_1.jsx)(AccordionItemContext.Provider, { value: contextValue, children: children }) }));
-}
-const AccordionTrigger = (0, react_1.forwardRef)(({ children, className, onClick, ...props }, ref) => {
-    const { size } = useAccordionContext();
-    const { isOpen, toggle, id } = useAccordionItemContext();
-    const classes = (0, recipes_1.accordionSlotRecipe)({ isOpen, size });
-    const handleClick = (0, react_1.useCallback)((event) => {
-        toggle();
-        onClick?.(event);
-    }, [onClick, toggle]);
-    return ((0, jsx_runtime_1.jsx)(FocusIndicator_1.FocusIndicator, { children: (0, jsx_runtime_1.jsxs)("button", { ref: ref, className: (0, css_1.cx)(classes.trigger, 'mfui-Accordion__trigger', className), "aria-expanded": isOpen, "aria-controls": id, onClick: handleClick, ...props, children: [(0, jsx_runtime_1.jsx)(Typography_1.Typography, { variant: "controlLabel", children: children }), isOpen ? (0, jsx_runtime_1.jsx)(mfui_icons_react_1.DisclosureBasicExpanded, {}) : (0, jsx_runtime_1.jsx)(mfui_icons_react_1.DisclosureBasicCollapsed, {})] }) }));
-});
-const AccordionTarget = (0, react_1.forwardRef)(({ children, className, style, ...props }, ref) => {
-    const { size } = useAccordionContext();
-    const { isOpen, enableAutoUnmount, id } = useAccordionItemContext();
-    const classes = (0, recipes_1.accordionSlotRecipe)({ isOpen, size });
-    if (enableAutoUnmount && !isOpen) {
-        return null;
-    }
-    return ((0, jsx_runtime_1.jsx)("div", { ref: ref, id: id, className: (0, css_1.cx)(classes.target, 'mfui-Accordion__target', className), style: {
-            ...style,
-            display: !enableAutoUnmount && !isOpen ? 'none' : undefined,
-        }, ...props, children: (0, jsx_runtime_1.jsx)(Typography_1.Typography, { variant: "body", children: children }) }));
-});
-/**
- * The `Accordion` component.
- *
- * It renders a collapsible content container with expandable/collapsible sections.
- *
- * This component should be used as a wrapper for all Accordion composition components.
- * The composition components are provided as sub-components of Accordion.
- *
- * **EXPERIMENTAL**: This component is experimental and may be changed or removed in the future.
- *
- * You can use them as follows:
- *
- * @example
- * ```jsx
- * <Accordion size="small" defaultOpenItems={['accordion-1']}>
- *   <Accordion.Item id="accordion-1">
- *     <Accordion.Trigger>Section 1</Accordion.Trigger>
- *     <Accordion.Target>Content for section 1</Accordion.Target>
- *   </Accordion.Item>
- *   <Accordion.Item id="accordion-2">
- *     <Accordion.Trigger>Section 2</Accordion.Trigger>
- *     <Accordion.Target>Content for section 2</Accordion.Target>
- *   </Accordion.Item>
- * </Accordion>
- * ```
- */
-exports.Accordion = Object.assign(AccordionBase, {
-    /**
-     * The `AccordionItem` component.
-     * This component should be used inside the `Accordion` component.
-     *
-     * Provides an expandable/collapsible section within an Accordion.
-     */
-    Item: AccordionItem,
-    /**
-     * The `AccordionTarget` component.
-     * This component should be used inside the `AccordionItem` component.
-     *
-     * The collapsible content area that is shown/hidden when the trigger is activated.
-     *
-     * It renders and extends the props of `div` element.
-     *
-     * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/div
-     */
-    Target: AccordionTarget,
-    /**
-     * The `AccordionTrigger` component.
-     * This component should be used inside the `AccordionItem` component.
-     *
-     * The trigger button that toggles the accordion target's visibility.
-     *
-     * It renders and extends the props of `button` element.
-     *
-     * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button
-     */
-    Trigger: AccordionTrigger,
-});

package/dist/cjs/src/Accordion/Accordion.types.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

package/dist/cjs/src/Accordion/index.js

@@ -1,5 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Accordion = void 0;
-var Accordion_1 = require("./Accordion");
-Object.defineProperty(exports, "Accordion", { enumerable: true, get: function () { return Accordion_1.Accordion; } });

package/dist/cjs/src/Badge/Badge.js

@@ -1,37 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Badge = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const css_1 = require("../../styled-system/css");
-const recipes_1 = require("../../styled-system/recipes");
-const Typography_1 = require("../Typography");
-/**
- * The general-purpose Badge component.
- * This component switches the variants of looks depends on the props: dot, count and children:
- *  - If `dot` is `true`, the badge will be displayed as a dot.
- *  - If `count` is not `undefined`, the badge will be displayed as a number calculated by `digit` prop.
- *  - If `children` is not `undefined`, the badge will be displayed in the top-right corner of the children.
- *   - In addition, the `aria-describedby` attribute will be added to the children to link the aria-label of the badge.
- *
- * Also extends the props of `<span>` element.
- *
- * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/span
- */
-exports.Badge = (0, react_1.forwardRef)(({ dot, count: number, digit, className, children, ...props }, ref) => {
-    const classes = (0, recipes_1.badgeSlotRecipe)({ hasChildren: children !== undefined });
-    const displayContent = (() => {
-        if (number === undefined)
-            return;
-        if (digit === undefined)
-            return String(number);
-        const maxValue = 10 ** digit - 1;
-        return number > maxValue ? `${String(maxValue)}+` : String(number);
-    })();
-    const badgeId = (0, react_1.useId)();
-    const displayBadge = dot !== undefined || number !== undefined;
-    // If the badge is not displayed, just return the children.
-    if (!displayBadge)
-        return children;
-    return ((0, jsx_runtime_1.jsxs)("span", { ref: ref, className: (0, css_1.cx)(classes.root, 'mfui-Badge__root', className), id: badgeId, ...props, children: [children ? (0, react_1.cloneElement)(children, { 'aria-describedby': badgeId }) : null, (0, jsx_runtime_1.jsx)("span", { className: (0, css_1.cx)(classes.indicator, 'mfui-Badge__indicator'), children: number !== undefined ? (0, jsx_runtime_1.jsx)(Typography_1.Typography, { variant: "condensedBody", children: displayContent }) : null })] }));
-});

package/dist/cjs/src/Badge/Badge.types.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

package/dist/cjs/src/Badge/index.js

@@ -1,5 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Badge = void 0;
-var Badge_1 = require("./Badge");
-Object.defineProperty(exports, "Badge", { enumerable: true, get: function () { return Badge_1.Badge; } });

package/dist/cjs/src/Button/Button.js

@@ -1,57 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Button = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const mfui_icons_react_1 = require("@moneyforward/mfui-icons-react");
-const css_1 = require("../../styled-system/css");
-const Typography_1 = require("../Typography");
-const FocusIndicator_1 = require("../FocusIndicator");
-const recipes_1 = require("../../styled-system/recipes");
-const ProgressIndicator_1 = require("../ProgressIndicator");
-/**
- * The general-purpose Button component.
- * This component switches the variants of looks depends on the props: size, priority, destructive, disabled, leftIcon, isDropdownTrigger.
- *
- * Also extends the props of `<button>` element or `<a>` element depending on whether the href prop is provided.
- *
- * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button
- *
- * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a
- */
-exports.Button = (0, react_1.forwardRef)(({ children, className, size = 'medium', priority = 'secondary', destructive = false, leftIcon, rightIcon, isDropdownTrigger = false, loading = false, disabled = false, 
-// The default type for button element is "submit", but we override it to "button".
-type = 'button', href, customLinkComponent, ...props }, ref) => {
-    const classes = (0, recipes_1.buttonSlotRecipe)({ size, priority, destructive });
-    const typographyVariant = (0, react_1.useMemo)(() => (size === 'large' ? 'impactControlLabel' : 'controlLabel'), [size]);
-    // For disabling also when loading
-    const isDisabled = disabled || loading;
-    const isButton = disabled || href === undefined;
-    const Tag = (0, react_1.useMemo)(() => {
-        // If disabled, always render as a button since the link component doesn't support disabled prop
-        if (isButton) {
-            return 'button';
-        }
-        return customLinkComponent ?? 'a';
-    }, [isButton, customLinkComponent]);
-    const tagProps = (0, react_1.useMemo)(() => {
-        if (isButton) {
-            // props for button component
-            return {
-                ref,
-                className: (0, css_1.cx)(classes.root, 'mfui-Button__root', className),
-                disabled: isDisabled,
-                type,
-                ...props,
-            };
-        }
-        // props for link component
-        return {
-            ref,
-            className: (0, css_1.cx)(classes.root, 'mfui-Button__root', className),
-            href,
-            ...props,
-        };
-    }, [isButton, classes.root, className, href, isDisabled, type, props, ref]);
-    return ((0, jsx_runtime_1.jsx)(FocusIndicator_1.FocusIndicator, { children: (0, jsx_runtime_1.jsxs)(Tag, { ...tagProps, children: [leftIcon ? (0, jsx_runtime_1.jsx)("div", { className: (0, css_1.cx)(classes.leftIcon, 'mfui-Button__leftIcon'), children: leftIcon }) : null, loading ? ((0, jsx_runtime_1.jsx)(ProgressIndicator_1.ProgressIndicator, { className: (0, css_1.cx)(classes.loadingIndicator, 'mfui-Button__loadingIndicator') })) : null, typeof children === 'string' ? (0, jsx_runtime_1.jsx)(Typography_1.Typography, { variant: typographyVariant, children: children }) : children, rightIcon ? (0, jsx_runtime_1.jsx)("div", { className: (0, css_1.cx)(classes.rightIcon, 'mfui-Button__rightIcon'), children: rightIcon }) : null, isDropdownTrigger ? (0, jsx_runtime_1.jsx)(mfui_icons_react_1.Dropdown, { className: (0, css_1.cx)(classes.dropdownIcon, 'mfui-Button__dropdownIcon') }) : null] }) }));
-});

package/dist/cjs/src/Button/Button.types.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

package/dist/cjs/src/Button/index.js

@@ -1,5 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Button = void 0;
-var Button_1 = require("./Button");
-Object.defineProperty(exports, "Button", { enumerable: true, get: function () { return Button_1.Button; } });

package/dist/cjs/src/Checkbox/Checkbox.js

@@ -1,68 +0,0 @@
-"use strict";
-'use client';
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Checkbox = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const mfui_icons_react_1 = require("@moneyforward/mfui-icons-react");
-const css_1 = require("../../styled-system/css");
-const FocusIndicator_1 = require("../FocusIndicator");
-const recipes_1 = require("../../styled-system/recipes");
-const Typography_1 = require("../Typography");
-const mergeRefs_1 = require("../utilities/dom/mergeRefs");
-const CheckboxGroupContext_1 = require("../CheckboxGroup/CheckboxGroupContext");
-/**
- * The general-purpose Checkbox component.
- * This component turns on/off the label depends on the prop: label.
- *
- * Also extends the props of `<input type="checkbox">` element.
- *
- * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox
- */
-exports.Checkbox = (0, react_1.forwardRef)(({ className, label, indeterminate = false, name, checked, defaultChecked, disabled, onChange, ...props }, ref) => {
-    const checkboxInputRef = (0, react_1.useRef)(null);
-    const checkboxGroupContext = (0, react_1.useContext)(CheckboxGroupContext_1.CheckboxGroupContext);
-    const [localChecked, setLocalChecked] = (0, react_1.useState)(!!defaultChecked);
-    const [localIndeterminate, setLocalIndeterminate] = (0, react_1.useState)(indeterminate);
-    const classes = (0, recipes_1.checkboxSlotRecipe)();
-    const WrapperTag = label ? 'label' : 'span';
-    const wrapperProps = {
-        className: (0, css_1.cx)(classes.root, 'mfui-Checkbox__root', className),
-        htmlFor: label ? props.id : undefined,
-    };
-    const isChecked = checkboxGroupContext.values !== undefined
-        ? checkboxGroupContext.values.includes(props.value)
-        : (checked ?? localChecked);
-    const isIndeterminate = checkboxGroupContext.values === undefined && localIndeterminate;
-    (0, react_1.useEffect)(() => {
-        if (checkboxInputRef.current) {
-            checkboxInputRef.current.indeterminate = checkboxGroupContext.values === undefined ? localIndeterminate : false;
-        }
-    }, [checkboxInputRef, localIndeterminate, checkboxGroupContext.values]);
-    (0, react_1.useEffect)(() => {
-        setLocalIndeterminate(indeterminate);
-    }, [indeterminate]);
-    const icon = (() => {
-        if (isIndeterminate) {
-            return (0, jsx_runtime_1.jsx)(mfui_icons_react_1.CheckboxIndeterminate, {});
-        }
-        if (isChecked) {
-            return (0, jsx_runtime_1.jsx)(mfui_icons_react_1.CheckboxChecked, {});
-        }
-        return (0, jsx_runtime_1.jsx)(mfui_icons_react_1.CheckboxUnchecked, {});
-    })();
-    return ((0, jsx_runtime_1.jsxs)(WrapperTag, { ...wrapperProps, children: [(0, jsx_runtime_1.jsx)("span", { className: (0, css_1.cx)(classes.icon, 'mfui-Checkbox__icon'), "aria-hidden": "true", "data-mfui-content": "checkbox-icon", children: icon }), (0, jsx_runtime_1.jsx)(FocusIndicator_1.FocusIndicator, { hideWhiteBorder: true, children: (0, jsx_runtime_1.jsx)("input", { ref: (0, mergeRefs_1.mergeRefs)(ref, checkboxInputRef), type: "checkbox", checked: isChecked, disabled: checkboxGroupContext.disabled ?? disabled, name: checkboxGroupContext.name ?? name, className: (0, css_1.cx)(classes.input, 'mfui-Checkbox__input'), "data-mfui-indeterminate": isIndeterminate, "data-mfui-content": "checkbox-input", onChange: (event) => {
-                        if (typeof checkboxGroupContext.onChange === 'function') {
-                            checkboxGroupContext.onChange(event);
-                            return;
-                        }
-                        onChange?.(event);
-                        // If the event is defaultPrevented in "onChange" prop via "e.preventDefault()", do not update local
-                        // states.
-                        if (event.defaultPrevented) {
-                            return;
-                        }
-                        setLocalChecked(event.target.checked);
-                        setLocalIndeterminate(false);
-                    }, ...props }) }), label ? ((0, jsx_runtime_1.jsx)(Typography_1.Typography, { variant: "controlLabel", className: (0, css_1.cx)(classes.label, 'mfui-Checkbox__label'), "data-mfui-content": "checkbox-label", children: label })) : null] }));
-});

package/dist/cjs/src/Checkbox/Checkbox.types.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

package/dist/cjs/src/Checkbox/index.js

@@ -1,5 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Checkbox = void 0;
-var Checkbox_1 = require("./Checkbox");
-Object.defineProperty(exports, "Checkbox", { enumerable: true, get: function () { return Checkbox_1.Checkbox; } });

package/dist/cjs/src/CheckboxCard/CheckboxCard.d.ts

@@ -1,15 +0,0 @@
-import { type CheckboxCardResponsiveSlot } from './CheckboxCard.types';
-/**
- * A component that transforms checkboxes into card-style selectable elements.
- * This component turns on/off the label depends on the prop: label, detail and layout.
- *
- * Also extends the props of `<input type="checkbox">` element.
- *
- * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox
- */
-export declare const CheckboxCard: import("react").ForwardRefExoticComponent<{
-    layout?: import("../../styled-system/recipes").CheckboxCardSlotRecipeVariant["layout"];
-    label: string;
-    renderDetailsSlot?: CheckboxCardResponsiveSlot | import("./CheckboxCard.types").CheckboxCardRenderDetailsSlot;
-    disableResponsive?: import("../../styled-system/recipes").CheckboxCardSlotRecipeVariant["disableResponsive"];
-} & Omit<import("../Checkbox").CheckboxProps, "label"> & import("react").RefAttributes<HTMLInputElement>>;

package/dist/cjs/src/CheckboxCard/CheckboxCard.js

@@ -1,42 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.CheckboxCard = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const css_1 = require("../../styled-system/css");
-const FocusIndicator_1 = require("../FocusIndicator");
-const recipes_1 = require("../../styled-system/recipes");
-const Checkbox_1 = require("../Checkbox");
-const Typography_1 = require("../Typography");
-const responsive_1 = require("../utilities/responsive");
-/**
- * A component that transforms checkboxes into card-style selectable elements.
- * This component turns on/off the label depends on the prop: label, detail and layout.
- *
- * Also extends the props of `<input type="checkbox">` element.
- *
- * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox
- */
-exports.CheckboxCard = (0, react_1.forwardRef)(({ label, layout = 'vertical', renderDetailsSlot, disableResponsive = false, className, ...props }, ref) => {
-    const checkboxState = (0, react_1.useMemo)(() => ({
-        checked: props.checked,
-        disabled: props.disabled,
-        indeterminate: props.indeterminate,
-    }), [props.checked, props.disabled, props.indeterminate]);
-    // Convert renderDetailsSlot to ResponsiveSlot format for consistent handling
-    const responsiveSlot = (0, responsive_1.isResponsiveSlot)(renderDetailsSlot)
-        ? renderDetailsSlot
-        : { base: renderDetailsSlot, narrowViewport: undefined };
-    const classes = (0, recipes_1.checkboxCardSlotRecipe)({
-        layout: !renderDetailsSlot ? 'vertical' : layout,
-        disableResponsive,
-        isResponsive: Boolean(responsiveSlot.narrowViewport),
-    });
-    return ((0, jsx_runtime_1.jsxs)("div", { className: (0, css_1.cx)(classes.root, 'mfui-CheckboxCard__root', className), children: [(0, jsx_runtime_1.jsx)(FocusIndicator_1.FocusIndicator, { disableNestedFocus: true, children: (0, jsx_runtime_1.jsxs)(Typography_1.Typography, { variant: "label", className: (0, css_1.cx)(classes.inputWrapper, 'mfui-CheckboxCard__inputWrapper'), as: "label", htmlFor: props.id, children: [(0, jsx_runtime_1.jsx)(Checkbox_1.Checkbox, { ref: ref, ...props, className: (0, css_1.cx)(classes.input, 'mfui-CheckboxCard__input') }), (0, jsx_runtime_1.jsx)("span", { className: (0, css_1.cx)(classes.label, 'mfui-CheckboxCard__label'), children: label })] }) }), responsiveSlot.narrowViewport && disableResponsive ? (
-            /* When responsive is disabled, render single element but with both contents using CSS for switching */
-            (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { "data-mfui-content": "details", className: (0, css_1.cx)(classes.details, classes.detailsWide, 'mfui-CheckboxCard__details'), children: responsiveSlot.base(checkboxState) }), (0, jsx_runtime_1.jsx)("div", { "data-mfui-content": "details", className: (0, css_1.cx)(classes.details, classes.detailsNarrow, 'mfui-CheckboxCard__details'), children: responsiveSlot.narrowViewport(checkboxState) })] })) : responsiveSlot.narrowViewport ? (
-            /* When responsive is enabled, render separate wide/narrow elements */
-            (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { "data-mfui-content": "details", className: (0, css_1.cx)(classes.details, classes.detailsWide, 'mfui-CheckboxCard__details'), children: responsiveSlot.base(checkboxState) }), (0, jsx_runtime_1.jsx)("div", { "data-mfui-content": "details", className: (0, css_1.cx)(classes.details, classes.detailsNarrow, 'mfui-CheckboxCard__details'), children: responsiveSlot.narrowViewport(checkboxState) })] })) : responsiveSlot.base ? (
-            /* For function-based renderDetailsSlot or ResponsiveSlot with only base, use single details element */
-            (0, jsx_runtime_1.jsx)("div", { "data-mfui-content": "details", className: (0, css_1.cx)(classes.details, 'mfui-CheckboxCard__details'), children: responsiveSlot.base(checkboxState) })) : null] }));
-});

package/dist/cjs/src/CheckboxCard/CheckboxCard.types.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

package/dist/cjs/src/CheckboxCard/index.js

@@ -1,5 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.CheckboxCard = void 0;
-var CheckboxCard_1 = require("./CheckboxCard");
-Object.defineProperty(exports, "CheckboxCard", { enumerable: true, get: function () { return CheckboxCard_1.CheckboxCard; } });

package/dist/cjs/src/CheckboxGroup/CheckboxGroup.js

@@ -1,48 +0,0 @@
-"use strict";
-'use client';
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.CheckboxGroup = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const CheckboxGroupContext_1 = require("./CheckboxGroupContext");
-const css_1 = require("../../styled-system/css");
-const recipes_1 = require("../../styled-system/recipes");
-/**
- * The general-purpose CheckboxGroup component.
- *
- * The CheckboxGroup component is designed to ensure that only one checkbox can be selected at a time within the
- * group, simplifying the state management and data handling for forms.
- *
- * This component will wrap all checkbox in a group and control their check state.
- *
- * Also extends the props of `<div>` element.
- *
- * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/div
- */
-exports.CheckboxGroup = (0, react_1.forwardRef)(({ className, defaultValues, values, disabled, name, onChange, children, ...props }, ref) => {
-    const classes = (0, recipes_1.checkboxGroupSlotRecipe)();
-    const [localValues, setLocalValues] = (0, react_1.useState)(defaultValues ?? []);
-    const handleOnChange = (0, react_1.useCallback)((event) => {
-        const oldValues = values ?? localValues;
-        let newValues = [...oldValues];
-        if (event.target.checked) {
-            newValues.push(event.target.value);
-        }
-        else {
-            newValues = newValues.filter((value) => value !== event.target.value);
-        }
-        if (values === undefined) {
-            setLocalValues(newValues);
-        }
-        if (onChange) {
-            onChange(newValues);
-        }
-    }, [localValues, onChange, values]);
-    const contextValue = (0, react_1.useMemo)(() => ({
-        disabled,
-        name,
-        values: values ?? localValues,
-        onChange: handleOnChange,
-    }), [disabled, handleOnChange, localValues, name, values]);
-    return ((0, jsx_runtime_1.jsx)("div", { ref: ref, ...props, className: (0, css_1.cx)(classes.root, 'mfui-CheckboxGroup__root', className), children: (0, jsx_runtime_1.jsx)(CheckboxGroupContext_1.CheckboxGroupContext.Provider, { value: contextValue, children: children }) }));
-});

package/dist/cjs/src/CheckboxGroup/CheckboxGroup.types.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

package/dist/cjs/src/CheckboxGroup/CheckboxGroupContext.js

@@ -1,6 +0,0 @@
-"use strict";
-'use client';
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.CheckboxGroupContext = void 0;
-const react_1 = require("react");
-exports.CheckboxGroupContext = (0, react_1.createContext)({});

package/dist/cjs/src/CheckboxGroup/index.js

@@ -1,5 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.CheckboxGroup = void 0;
-var CheckboxGroup_1 = require("./CheckboxGroup");
-Object.defineProperty(exports, "CheckboxGroup", { enumerable: true, get: function () { return CheckboxGroup_1.CheckboxGroup; } });