@moneyforward/mfui-components 3.0.0 → 3.2.0

package/dist/src/index.d.ts

@@ -21,6 +21,7 @@ export * from './MainNavigation';
 export * from './SelectBox';
 export * from './SidePane';
 export * from './Toast';
+export * from './ToggleSwitch';
 export * from './Pagination';
 export * from './Tag';
 export * from './ProgressIndicator';

package/dist/src/index.js

@@ -21,6 +21,7 @@ export * from './MainNavigation';
 export * from './SelectBox';
 export * from './SidePane';
 export * from './Toast';
+export * from './ToggleSwitch';
 export * from './Pagination';
 export * from './Tag';
 export * from './ProgressIndicator';

package/dist/src/shared/ClearButton/ClearButton.d.ts

@@ -1,5 +1,6 @@
-import { type IconButtonInternalProps, type IconButtonProps } from '../../IconButton/IconButton.types';
+import { type IconButtonProps } from '../../IconButton/IconButton.types';
+export type ClearButtonSize = 'small' | 'default' | 'large';
 export type ClearButtonProps = Omit<IconButtonProps, 'children' | 'outlined'> & {
-    size?: IconButtonInternalProps['size'];
+    size?: ClearButtonSize;
 };
-export declare function ClearButton({ size, 'aria-label': ariaLabel, ...iconButtonProps }: ClearButtonProps): import("react/jsx-runtime").JSX.Element;
+export declare function ClearButton({ size, 'aria-label': ariaLabel, className, ...iconButtonProps }: ClearButtonProps): import("react/jsx-runtime").JSX.Element;

package/dist/src/shared/ClearButton/ClearButton.js

@@ -1,6 +1,18 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Close } from '@moneyforward/mfui-icons-react';
+import { cx } from '../../../styled-system/css';
+import { clearButtonSlotRecipe } from '../../../styled-system/recipes';
 import { InternalIconButton as IconButton } from '../../IconButton/IconButton';
-export function ClearButton({ size = 'default', 'aria-label': ariaLabel = '値をクリアする', ...iconButtonProps }) {
-    return (_jsx(IconButton, { size: size, "aria-label": ariaLabel, ...iconButtonProps, children: _jsx(Close, {}) }));
+/**
+ * Maps ClearButton sizes to the corresponding IconButton sizes.
+ * ClearButton supports 'large' for wrapper sizing, but IconButton only has 'small' and 'default'.
+ */
+const iconButtonSizeMap = {
+    small: 'small',
+    default: 'default',
+    large: 'default',
+};
+export function ClearButton({ size = 'default', 'aria-label': ariaLabel = '値をクリアする', className, ...iconButtonProps }) {
+    const classes = clearButtonSlotRecipe({ size });
+    return (_jsx("div", { className: cx(classes.root, 'mfui-ClearButton__root', className), children: _jsx(IconButton, { size: iconButtonSizeMap[size], "aria-label": ariaLabel, ...iconButtonProps, children: _jsx(Close, {}) }) }));
 }

package/dist/src/utilities/dom/getTargetDomNode.js

@@ -14,7 +14,7 @@ export function getTargetDomNode(fallbackTargetDOMNode, hangingElement) {
     if (fallbackTargetDOMNode) {
         return fallbackTargetDOMNode;
     }
-    const rootNode = getRootNode(hangingElement);
+    const rootNode = getRootNode(hangingElement, { allowDetached: true });
     // When rootNode is not available, it means it running on server side, force assign it as HTMLElement to satisfies TypeScript
     if (!rootNode) {
         return undefined;
@@ -32,5 +32,7 @@ export function getTargetDomNode(fallbackTargetDOMNode, hangingElement) {
     if (rootNode instanceof Document) {
         return rootNode.body;
     }
-    return rootNode;
+    // Element is detached from DOM (e.g., during Responsive Design Mode toggle in Chrome DevTools)
+    // Fall back to document.body to prevent crash
+    return document.body;
 }

package/dist/src/utilities/dom/useFixedColumns.js

@@ -37,19 +37,45 @@ export const useFixedColumns = ({ enableRowSelection = false, columnIndex, leftF
         if (!cellRef.current)
             return;
         const cell = cellRef.current;
+        const row = cell.closest('tr');
         const table = cell.closest('table');
-        if (!table)
+        if (!row || !table)
             return;
-        const tableRect = table.getBoundingClientRect();
-        const cellRect = cell.getBoundingClientRect();
-        // Calculate distance from left edge
-        const leftPosition = cellRect.left - tableRect.left;
-        // Calculate distance from right edge
-        const rightPosition = tableRect.right - cellRect.right;
-        setCellRect({
-            left: leftPosition,
-            right: rightPosition,
+        const calculatePosition = () => {
+            const cells = [...row.querySelectorAll('th, td')];
+            const cellIndex = cells.indexOf(cell);
+            if (cellIndex === -1)
+                return;
+            // Calculate left position by summing widths of previous cells
+            let leftPosition = 0;
+            for (let i = 0; i < cellIndex; i++) {
+                const cellElement = cells[i];
+                if (cellElement) {
+                    leftPosition += cellElement.offsetWidth;
+                }
+            }
+            // Calculate right position by summing widths of following cells
+            let rightPosition = 0;
+            for (let i = cellIndex + 1; i < cells.length; i++) {
+                const cellElement = cells[i];
+                if (cellElement) {
+                    rightPosition += cellElement.offsetWidth;
+                }
+            }
+            setCellRect({
+                left: leftPosition,
+                right: rightPosition,
+            });
+        };
+        calculatePosition();
+        // Recalculate on table resize (e.g., when content changes after sorting)
+        const resizeObserver = new ResizeObserver(() => {
+            calculatePosition();
         });
+        resizeObserver.observe(table);
+        return () => {
+            resizeObserver.disconnect();
+        };
     }, []);
     useLayoutEffect(() => {
         if (isCheckboxColumn && leftFixedColumnIndex !== undefined) {

package/dist/styled-system/css/conditions.js

@@ -1,5 +1,5 @@
 import { withoutSpace } from '../helpers.js';
-const conditionsStr = "_hover,_focus,_focusWithin,_focusVisible,_disabled,_active,_visited,_target,_readOnly,_readWrite,_empty,_checked,_enabled,_expanded,_highlighted,_complete,_incomplete,_dragging,_before,_after,_firstLetter,_firstLine,_marker,_selection,_file,_backdrop,_first,_last,_only,_even,_odd,_firstOfType,_lastOfType,_onlyOfType,_peerFocus,_peerHover,_peerActive,_peerFocusWithin,_peerFocusVisible,_peerDisabled,_peerChecked,_peerInvalid,_peerExpanded,_peerPlaceholderShown,_groupFocus,_groupHover,_groupActive,_groupFocusWithin,_groupFocusVisible,_groupDisabled,_groupChecked,_groupExpanded,_groupInvalid,_indeterminate,_required,_valid,_invalid,_autofill,_inRange,_outOfRange,_placeholder,_placeholderShown,_pressed,_selected,_grabbed,_underValue,_overValue,_atValue,_default,_optional,_open,_closed,_fullscreen,_loading,_hidden,_current,_currentPage,_currentStep,_today,_unavailable,_rangeStart,_rangeEnd,_now,_topmost,_motionReduce,_motionSafe,_print,_landscape,_portrait,_dark,_light,_osDark,_osLight,_highContrast,_lessContrast,_moreContrast,_ltr,_rtl,_scrollbar,_scrollbarThumb,_scrollbarTrack,_horizontal,_vertical,_icon,_starting,_noscript,_invertedColors,_notDisabled,_notFocused,_focusable,_focusInputInside,_hasCheckboxInside,_hasDisabledCheckboxInside,_hasFocusedCheckboxInside,_hasFocusedCheckedCheckboxInside,_hasCheckedCheckboxInside,_hasRadioButtonInside,_hasFocusedRadioButtonInside,_hasFocusedCheckedRadioButtonInside,_hasDisabledRadioButtonInside,_hasCheckedRadioButtonInside,sm,smOnly,smDown,lg,lgOnly,lgDown,smToLg,base";
+const conditionsStr = "_hover,_focus,_focusWithin,_focusVisible,_disabled,_active,_visited,_target,_readOnly,_readWrite,_empty,_checked,_enabled,_expanded,_highlighted,_complete,_incomplete,_dragging,_before,_after,_firstLetter,_firstLine,_marker,_selection,_file,_backdrop,_first,_last,_only,_even,_odd,_firstOfType,_lastOfType,_onlyOfType,_peerFocus,_peerHover,_peerActive,_peerFocusWithin,_peerFocusVisible,_peerDisabled,_peerChecked,_peerInvalid,_peerExpanded,_peerPlaceholderShown,_groupFocus,_groupHover,_groupActive,_groupFocusWithin,_groupFocusVisible,_groupDisabled,_groupChecked,_groupExpanded,_groupInvalid,_indeterminate,_required,_valid,_invalid,_autofill,_inRange,_outOfRange,_placeholder,_placeholderShown,_pressed,_selected,_grabbed,_underValue,_overValue,_atValue,_default,_optional,_open,_closed,_fullscreen,_loading,_hidden,_current,_currentPage,_currentStep,_today,_unavailable,_rangeStart,_rangeEnd,_now,_topmost,_motionReduce,_motionSafe,_print,_landscape,_portrait,_dark,_light,_osDark,_osLight,_highContrast,_lessContrast,_moreContrast,_ltr,_rtl,_scrollbar,_scrollbarThumb,_scrollbarTrack,_horizontal,_vertical,_icon,_starting,_noscript,_invertedColors,_notDisabled,_notFocused,_focusable,_focusInputInside,_hasCheckboxInside,_hasDisabledCheckboxInside,_hasFocusedCheckboxInside,_hasFocusedCheckedCheckboxInside,_hasCheckedCheckboxInside,_hasRadioButtonInside,_hasFocusedRadioButtonInside,_hasFocusedCheckedRadioButtonInside,_hasDisabledRadioButtonInside,_hasCheckedRadioButtonInside,_hasToggleSwitchInside,_hasFocusedToggleSwitchInside,_hasFocusedCheckedToggleSwitchInside,_hasDisabledToggleSwitchInside,_hasCheckedToggleSwitchInside,sm,smOnly,smDown,lg,lgOnly,lgDown,smToLg,base";
 const conditions = new Set(conditionsStr.split(','));
 const conditionRegex = /^@|&|&$/;
 export function isCondition(value) {

package/dist/styled-system/jsx/is-valid-prop.js

@@ -1,7 +1,7 @@
 import { splitProps } from '../helpers.js';
 import { memo } from '../helpers.js';
 // src/index.ts
-var userGeneratedStr = "css,pos,insetX,insetY,insetEnd,end,insetStart,start,flexDir,p,pl,pr,pt,pb,py,paddingY,paddingX,px,pe,paddingEnd,ps,paddingStart,ml,mr,mt,mb,m,my,marginY,mx,marginX,me,marginEnd,ms,marginStart,ringWidth,ringColor,ring,ringOffset,w,minW,maxW,h,minH,maxH,textShadowColor,bgPosition,bgPositionX,bgPositionY,bgAttachment,bgClip,bg,bgColor,bgOrigin,bgImage,bgRepeat,bgBlendMode,bgSize,bgGradient,bgLinear,bgRadial,bgConic,rounded,roundedTopLeft,roundedTopRight,roundedBottomRight,roundedBottomLeft,roundedTop,roundedRight,roundedBottom,roundedLeft,roundedStartStart,roundedStartEnd,roundedStart,roundedEndStart,roundedEndEnd,roundedEnd,borderX,borderXWidth,borderXColor,borderY,borderYWidth,borderYColor,borderStart,borderStartWidth,borderStartColor,borderEnd,borderEndWidth,borderEndColor,shadow,shadowColor,x,y,z,scrollMarginY,scrollMarginX,scrollPaddingY,scrollPaddingX,aspectRatio,boxDecorationBreak,zIndex,boxSizing,objectPosition,objectFit,overscrollBehavior,overscrollBehaviorX,overscrollBehaviorY,position,top,left,inset,insetInline,insetBlock,insetBlockEnd,insetBlockStart,insetInlineEnd,insetInlineStart,right,bottom,float,visibility,display,hideFrom,hideBelow,flexBasis,flex,flexDirection,flexGrow,flexShrink,gridTemplateColumns,gridTemplateRows,gridColumn,gridRow,gridColumnStart,gridColumnEnd,gridAutoFlow,gridAutoColumns,gridAutoRows,gap,gridGap,gridRowGap,gridColumnGap,rowGap,columnGap,justifyContent,alignContent,alignItems,alignSelf,padding,paddingLeft,paddingRight,paddingTop,paddingBottom,paddingBlock,paddingBlockEnd,paddingBlockStart,paddingInline,paddingInlineEnd,paddingInlineStart,marginLeft,marginRight,marginTop,marginBottom,margin,marginBlock,marginBlockEnd,marginBlockStart,marginInline,marginInlineEnd,marginInlineStart,spaceX,spaceY,outlineWidth,outlineColor,outline,outlineOffset,focusRing,focusVisibleRing,focusRingColor,focusRingOffset,focusRingWidth,focusRingStyle,divideX,divideY,divideColor,divideStyle,width,inlineSize,minWidth,minInlineSize,maxWidth,maxInlineSize,height,blockSize,minHeight,minBlockSize,maxHeight,maxBlockSize,boxSize,color,fontFamily,fontSize,fontSizeAdjust,fontPalette,fontKerning,fontFeatureSettings,fontWeight,fontSmoothing,fontVariant,fontVariantAlternates,fontVariantCaps,fontVariationSettings,fontVariantNumeric,letterSpacing,lineHeight,textAlign,textDecoration,textDecorationColor,textEmphasisColor,textDecorationStyle,textDecorationThickness,textUnderlineOffset,textTransform,textIndent,textShadow,WebkitTextFillColor,textOverflow,verticalAlign,wordBreak,textWrap,truncate,lineClamp,listStyleType,listStylePosition,listStyleImage,listStyle,backgroundPosition,backgroundPositionX,backgroundPositionY,backgroundAttachment,backgroundClip,background,backgroundColor,backgroundOrigin,backgroundImage,backgroundRepeat,backgroundBlendMode,backgroundSize,backgroundGradient,backgroundLinear,backgroundRadial,backgroundConic,textGradient,gradientFromPosition,gradientToPosition,gradientFrom,gradientTo,gradientVia,gradientViaPosition,borderRadius,borderTopLeftRadius,borderTopRightRadius,borderBottomRightRadius,borderBottomLeftRadius,borderTopRadius,borderRightRadius,borderBottomRadius,borderLeftRadius,borderStartStartRadius,borderStartEndRadius,borderStartRadius,borderEndStartRadius,borderEndEndRadius,borderEndRadius,border,borderWidth,borderTopWidth,borderLeftWidth,borderRightWidth,borderBottomWidth,borderBlockStartWidth,borderBlockEndWidth,borderColor,borderInline,borderInlineWidth,borderInlineColor,borderBlock,borderBlockWidth,borderBlockColor,borderLeft,borderLeftColor,borderInlineStart,borderInlineStartWidth,borderInlineStartColor,borderRight,borderRightColor,borderInlineEnd,borderInlineEndWidth,borderInlineEndColor,borderTop,borderTopColor,borderBottom,borderBottomColor,borderBlockEnd,borderBlockEndColor,borderBlockStart,borderBlockStartColor,opacity,boxShadow,boxShadowColor,mixBlendMode,filter,brightness,contrast,grayscale,hueRotate,invert,saturate,sepia,dropShadow,blur,backdropFilter,backdropBlur,backdropBrightness,backdropContrast,backdropGrayscale,backdropHueRotate,backdropInvert,backdropOpacity,backdropSaturate,backdropSepia,borderCollapse,borderSpacing,borderSpacingX,borderSpacingY,tableLayout,transitionTimingFunction,transitionDelay,transitionDuration,transitionProperty,transition,animation,animationName,animationTimingFunction,animationDuration,animationDelay,animationPlayState,animationComposition,animationFillMode,animationDirection,animationIterationCount,animationRange,animationState,animationRangeStart,animationRangeEnd,animationTimeline,transformOrigin,transformBox,transformStyle,transform,rotate,rotateX,rotateY,rotateZ,scale,scaleX,scaleY,translate,translateX,translateY,translateZ,accentColor,caretColor,scrollBehavior,scrollbar,scrollbarColor,scrollbarGutter,scrollbarWidth,scrollMargin,scrollMarginLeft,scrollMarginRight,scrollMarginTop,scrollMarginBottom,scrollMarginBlock,scrollMarginBlockEnd,scrollMarginBlockStart,scrollMarginInline,scrollMarginInlineEnd,scrollMarginInlineStart,scrollPadding,scrollPaddingBlock,scrollPaddingBlockStart,scrollPaddingBlockEnd,scrollPaddingInline,scrollPaddingInlineEnd,scrollPaddingInlineStart,scrollPaddingLeft,scrollPaddingRight,scrollPaddingTop,scrollPaddingBottom,scrollSnapAlign,scrollSnapStop,scrollSnapType,scrollSnapStrictness,scrollSnapMargin,scrollSnapMarginTop,scrollSnapMarginBottom,scrollSnapMarginLeft,scrollSnapMarginRight,scrollSnapCoordinate,scrollSnapDestination,scrollSnapPointsX,scrollSnapPointsY,scrollSnapTypeX,scrollSnapTypeY,scrollTimeline,scrollTimelineAxis,scrollTimelineName,touchAction,userSelect,overflow,overflowWrap,overflowX,overflowY,overflowAnchor,overflowBlock,overflowInline,overflowClipBox,overflowClipMargin,overscrollBehaviorBlock,overscrollBehaviorInline,fill,stroke,strokeWidth,strokeDasharray,strokeDashoffset,strokeLinecap,strokeLinejoin,strokeMiterlimit,strokeOpacity,srOnly,debug,appearance,backfaceVisibility,clipPath,hyphens,mask,maskImage,maskSize,textSizeAdjust,container,containerName,containerType,cursor,colorPalette,_hover,_focus,_focusWithin,_focusVisible,_disabled,_active,_visited,_target,_readOnly,_readWrite,_empty,_checked,_enabled,_expanded,_highlighted,_complete,_incomplete,_dragging,_before,_after,_firstLetter,_firstLine,_marker,_selection,_file,_backdrop,_first,_last,_only,_even,_odd,_firstOfType,_lastOfType,_onlyOfType,_peerFocus,_peerHover,_peerActive,_peerFocusWithin,_peerFocusVisible,_peerDisabled,_peerChecked,_peerInvalid,_peerExpanded,_peerPlaceholderShown,_groupFocus,_groupHover,_groupActive,_groupFocusWithin,_groupFocusVisible,_groupDisabled,_groupChecked,_groupExpanded,_groupInvalid,_indeterminate,_required,_valid,_invalid,_autofill,_inRange,_outOfRange,_placeholder,_placeholderShown,_pressed,_selected,_grabbed,_underValue,_overValue,_atValue,_default,_optional,_open,_closed,_fullscreen,_loading,_hidden,_current,_currentPage,_currentStep,_today,_unavailable,_rangeStart,_rangeEnd,_now,_topmost,_motionReduce,_motionSafe,_print,_landscape,_portrait,_dark,_light,_osDark,_osLight,_highContrast,_lessContrast,_moreContrast,_ltr,_rtl,_scrollbar,_scrollbarThumb,_scrollbarTrack,_horizontal,_vertical,_icon,_starting,_noscript,_invertedColors,_notDisabled,_notFocused,_focusable,_focusInputInside,_hasCheckboxInside,_hasDisabledCheckboxInside,_hasFocusedCheckboxInside,_hasFocusedCheckedCheckboxInside,_hasCheckedCheckboxInside,_hasRadioButtonInside,_hasFocusedRadioButtonInside,_hasFocusedCheckedRadioButtonInside,_hasDisabledRadioButtonInside,_hasCheckedRadioButtonInside,sm,smOnly,smDown,lg,lgOnly,lgDown,smToLg";
+var userGeneratedStr = "css,pos,insetX,insetY,insetEnd,end,insetStart,start,flexDir,p,pl,pr,pt,pb,py,paddingY,paddingX,px,pe,paddingEnd,ps,paddingStart,ml,mr,mt,mb,m,my,marginY,mx,marginX,me,marginEnd,ms,marginStart,ringWidth,ringColor,ring,ringOffset,w,minW,maxW,h,minH,maxH,textShadowColor,bgPosition,bgPositionX,bgPositionY,bgAttachment,bgClip,bg,bgColor,bgOrigin,bgImage,bgRepeat,bgBlendMode,bgSize,bgGradient,bgLinear,bgRadial,bgConic,rounded,roundedTopLeft,roundedTopRight,roundedBottomRight,roundedBottomLeft,roundedTop,roundedRight,roundedBottom,roundedLeft,roundedStartStart,roundedStartEnd,roundedStart,roundedEndStart,roundedEndEnd,roundedEnd,borderX,borderXWidth,borderXColor,borderY,borderYWidth,borderYColor,borderStart,borderStartWidth,borderStartColor,borderEnd,borderEndWidth,borderEndColor,shadow,shadowColor,x,y,z,scrollMarginY,scrollMarginX,scrollPaddingY,scrollPaddingX,aspectRatio,boxDecorationBreak,zIndex,boxSizing,objectPosition,objectFit,overscrollBehavior,overscrollBehaviorX,overscrollBehaviorY,position,top,left,inset,insetInline,insetBlock,insetBlockEnd,insetBlockStart,insetInlineEnd,insetInlineStart,right,bottom,float,visibility,display,hideFrom,hideBelow,flexBasis,flex,flexDirection,flexGrow,flexShrink,gridTemplateColumns,gridTemplateRows,gridColumn,gridRow,gridColumnStart,gridColumnEnd,gridAutoFlow,gridAutoColumns,gridAutoRows,gap,gridGap,gridRowGap,gridColumnGap,rowGap,columnGap,justifyContent,alignContent,alignItems,alignSelf,padding,paddingLeft,paddingRight,paddingTop,paddingBottom,paddingBlock,paddingBlockEnd,paddingBlockStart,paddingInline,paddingInlineEnd,paddingInlineStart,marginLeft,marginRight,marginTop,marginBottom,margin,marginBlock,marginBlockEnd,marginBlockStart,marginInline,marginInlineEnd,marginInlineStart,spaceX,spaceY,outlineWidth,outlineColor,outline,outlineOffset,focusRing,focusVisibleRing,focusRingColor,focusRingOffset,focusRingWidth,focusRingStyle,divideX,divideY,divideColor,divideStyle,width,inlineSize,minWidth,minInlineSize,maxWidth,maxInlineSize,height,blockSize,minHeight,minBlockSize,maxHeight,maxBlockSize,boxSize,color,fontFamily,fontSize,fontSizeAdjust,fontPalette,fontKerning,fontFeatureSettings,fontWeight,fontSmoothing,fontVariant,fontVariantAlternates,fontVariantCaps,fontVariationSettings,fontVariantNumeric,letterSpacing,lineHeight,textAlign,textDecoration,textDecorationColor,textEmphasisColor,textDecorationStyle,textDecorationThickness,textUnderlineOffset,textTransform,textIndent,textShadow,WebkitTextFillColor,textOverflow,verticalAlign,wordBreak,textWrap,truncate,lineClamp,listStyleType,listStylePosition,listStyleImage,listStyle,backgroundPosition,backgroundPositionX,backgroundPositionY,backgroundAttachment,backgroundClip,background,backgroundColor,backgroundOrigin,backgroundImage,backgroundRepeat,backgroundBlendMode,backgroundSize,backgroundGradient,backgroundLinear,backgroundRadial,backgroundConic,textGradient,gradientFromPosition,gradientToPosition,gradientFrom,gradientTo,gradientVia,gradientViaPosition,borderRadius,borderTopLeftRadius,borderTopRightRadius,borderBottomRightRadius,borderBottomLeftRadius,borderTopRadius,borderRightRadius,borderBottomRadius,borderLeftRadius,borderStartStartRadius,borderStartEndRadius,borderStartRadius,borderEndStartRadius,borderEndEndRadius,borderEndRadius,border,borderWidth,borderTopWidth,borderLeftWidth,borderRightWidth,borderBottomWidth,borderBlockStartWidth,borderBlockEndWidth,borderColor,borderInline,borderInlineWidth,borderInlineColor,borderBlock,borderBlockWidth,borderBlockColor,borderLeft,borderLeftColor,borderInlineStart,borderInlineStartWidth,borderInlineStartColor,borderRight,borderRightColor,borderInlineEnd,borderInlineEndWidth,borderInlineEndColor,borderTop,borderTopColor,borderBottom,borderBottomColor,borderBlockEnd,borderBlockEndColor,borderBlockStart,borderBlockStartColor,opacity,boxShadow,boxShadowColor,mixBlendMode,filter,brightness,contrast,grayscale,hueRotate,invert,saturate,sepia,dropShadow,blur,backdropFilter,backdropBlur,backdropBrightness,backdropContrast,backdropGrayscale,backdropHueRotate,backdropInvert,backdropOpacity,backdropSaturate,backdropSepia,borderCollapse,borderSpacing,borderSpacingX,borderSpacingY,tableLayout,transitionTimingFunction,transitionDelay,transitionDuration,transitionProperty,transition,animation,animationName,animationTimingFunction,animationDuration,animationDelay,animationPlayState,animationComposition,animationFillMode,animationDirection,animationIterationCount,animationRange,animationState,animationRangeStart,animationRangeEnd,animationTimeline,transformOrigin,transformBox,transformStyle,transform,rotate,rotateX,rotateY,rotateZ,scale,scaleX,scaleY,translate,translateX,translateY,translateZ,accentColor,caretColor,scrollBehavior,scrollbar,scrollbarColor,scrollbarGutter,scrollbarWidth,scrollMargin,scrollMarginLeft,scrollMarginRight,scrollMarginTop,scrollMarginBottom,scrollMarginBlock,scrollMarginBlockEnd,scrollMarginBlockStart,scrollMarginInline,scrollMarginInlineEnd,scrollMarginInlineStart,scrollPadding,scrollPaddingBlock,scrollPaddingBlockStart,scrollPaddingBlockEnd,scrollPaddingInline,scrollPaddingInlineEnd,scrollPaddingInlineStart,scrollPaddingLeft,scrollPaddingRight,scrollPaddingTop,scrollPaddingBottom,scrollSnapAlign,scrollSnapStop,scrollSnapType,scrollSnapStrictness,scrollSnapMargin,scrollSnapMarginTop,scrollSnapMarginBottom,scrollSnapMarginLeft,scrollSnapMarginRight,scrollSnapCoordinate,scrollSnapDestination,scrollSnapPointsX,scrollSnapPointsY,scrollSnapTypeX,scrollSnapTypeY,scrollTimeline,scrollTimelineAxis,scrollTimelineName,touchAction,userSelect,overflow,overflowWrap,overflowX,overflowY,overflowAnchor,overflowBlock,overflowInline,overflowClipBox,overflowClipMargin,overscrollBehaviorBlock,overscrollBehaviorInline,fill,stroke,strokeWidth,strokeDasharray,strokeDashoffset,strokeLinecap,strokeLinejoin,strokeMiterlimit,strokeOpacity,srOnly,debug,appearance,backfaceVisibility,clipPath,hyphens,mask,maskImage,maskSize,textSizeAdjust,container,containerName,containerType,cursor,colorPalette,_hover,_focus,_focusWithin,_focusVisible,_disabled,_active,_visited,_target,_readOnly,_readWrite,_empty,_checked,_enabled,_expanded,_highlighted,_complete,_incomplete,_dragging,_before,_after,_firstLetter,_firstLine,_marker,_selection,_file,_backdrop,_first,_last,_only,_even,_odd,_firstOfType,_lastOfType,_onlyOfType,_peerFocus,_peerHover,_peerActive,_peerFocusWithin,_peerFocusVisible,_peerDisabled,_peerChecked,_peerInvalid,_peerExpanded,_peerPlaceholderShown,_groupFocus,_groupHover,_groupActive,_groupFocusWithin,_groupFocusVisible,_groupDisabled,_groupChecked,_groupExpanded,_groupInvalid,_indeterminate,_required,_valid,_invalid,_autofill,_inRange,_outOfRange,_placeholder,_placeholderShown,_pressed,_selected,_grabbed,_underValue,_overValue,_atValue,_default,_optional,_open,_closed,_fullscreen,_loading,_hidden,_current,_currentPage,_currentStep,_today,_unavailable,_rangeStart,_rangeEnd,_now,_topmost,_motionReduce,_motionSafe,_print,_landscape,_portrait,_dark,_light,_osDark,_osLight,_highContrast,_lessContrast,_moreContrast,_ltr,_rtl,_scrollbar,_scrollbarThumb,_scrollbarTrack,_horizontal,_vertical,_icon,_starting,_noscript,_invertedColors,_notDisabled,_notFocused,_focusable,_focusInputInside,_hasCheckboxInside,_hasDisabledCheckboxInside,_hasFocusedCheckboxInside,_hasFocusedCheckedCheckboxInside,_hasCheckedCheckboxInside,_hasRadioButtonInside,_hasFocusedRadioButtonInside,_hasFocusedCheckedRadioButtonInside,_hasDisabledRadioButtonInside,_hasCheckedRadioButtonInside,_hasToggleSwitchInside,_hasFocusedToggleSwitchInside,_hasFocusedCheckedToggleSwitchInside,_hasDisabledToggleSwitchInside,_hasCheckedToggleSwitchInside,sm,smOnly,smDown,lg,lgOnly,lgDown,smToLg";
 var userGenerated = userGeneratedStr.split(",");
 var cssPropertiesStr = "WebkitAppearance,WebkitBorderBefore,WebkitBorderBeforeColor,WebkitBorderBeforeStyle,WebkitBorderBeforeWidth,WebkitBoxReflect,WebkitLineClamp,WebkitMask,WebkitMaskAttachment,WebkitMaskClip,WebkitMaskComposite,WebkitMaskImage,WebkitMaskOrigin,WebkitMaskPosition,WebkitMaskPositionX,WebkitMaskPositionY,WebkitMaskRepeat,WebkitMaskRepeatX,WebkitMaskRepeatY,WebkitMaskSize,WebkitOverflowScrolling,WebkitTapHighlightColor,WebkitTextFillColor,WebkitTextStroke,WebkitTextStrokeColor,WebkitTextStrokeWidth,WebkitTouchCallout,WebkitUserModify,WebkitUserSelect,accentColor,alignContent,alignItems,alignSelf,alignTracks,all,anchorName,anchorScope,animation,animationComposition,animationDelay,animationDirection,animationDuration,animationFillMode,animationIterationCount,animationName,animationPlayState,animationRange,animationRangeEnd,animationRangeStart,animationTimeline,animationTimingFunction,appearance,aspectRatio,backdropFilter,backfaceVisibility,background,backgroundAttachment,backgroundBlendMode,backgroundClip,backgroundColor,backgroundImage,backgroundOrigin,backgroundPosition,backgroundPositionX,backgroundPositionY,backgroundRepeat,backgroundSize,blockSize,border,borderBlock,borderBlockColor,borderBlockEnd,borderBlockEndColor,borderBlockEndStyle,borderBlockEndWidth,borderBlockStart,borderBlockStartColor,borderBlockStartStyle,borderBlockStartWidth,borderBlockStyle,borderBlockWidth,borderBottom,borderBottomColor,borderBottomLeftRadius,borderBottomRightRadius,borderBottomStyle,borderBottomWidth,borderCollapse,borderColor,borderEndEndRadius,borderEndStartRadius,borderImage,borderImageOutset,borderImageRepeat,borderImageSlice,borderImageSource,borderImageWidth,borderInline,borderInlineColor,borderInlineEnd,borderInlineEndColor,borderInlineEndStyle,borderInlineEndWidth,borderInlineStart,borderInlineStartColor,borderInlineStartStyle,borderInlineStartWidth,borderInlineStyle,borderInlineWidth,borderLeft,borderLeftColor,borderLeftStyle,borderLeftWidth,borderRadius,borderRight,borderRightColor,borderRightStyle,borderRightWidth,borderSpacing,borderStartEndRadius,borderStartStartRadius,borderStyle,borderTop,borderTopColor,borderTopLeftRadius,borderTopRightRadius,borderTopStyle,borderTopWidth,borderWidth,bottom,boxAlign,boxDecorationBreak,boxDirection,boxFlex,boxFlexGroup,boxLines,boxOrdinalGroup,boxOrient,boxPack,boxShadow,boxSizing,breakAfter,breakBefore,breakInside,captionSide,caret,caretColor,caretShape,clear,clip,clipPath,clipRule,color,colorInterpolationFilters,colorScheme,columnCount,columnFill,columnGap,columnRule,columnRuleColor,columnRuleStyle,columnRuleWidth,columnSpan,columnWidth,columns,contain,containIntrinsicBlockSize,containIntrinsicHeight,containIntrinsicInlineSize,containIntrinsicSize,containIntrinsicWidth,container,containerName,containerType,content,contentVisibility,counterIncrement,counterReset,counterSet,cursor,cx,cy,d,direction,display,dominantBaseline,emptyCells,fieldSizing,fill,fillOpacity,fillRule,filter,flex,flexBasis,flexDirection,flexFlow,flexGrow,flexShrink,flexWrap,float,floodColor,floodOpacity,font,fontFamily,fontFeatureSettings,fontKerning,fontLanguageOverride,fontOpticalSizing,fontPalette,fontSize,fontSizeAdjust,fontSmooth,fontStretch,fontStyle,fontSynthesis,fontSynthesisPosition,fontSynthesisSmallCaps,fontSynthesisStyle,fontSynthesisWeight,fontVariant,fontVariantAlternates,fontVariantCaps,fontVariantEastAsian,fontVariantEmoji,fontVariantLigatures,fontVariantNumeric,fontVariantPosition,fontVariationSettings,fontWeight,forcedColorAdjust,gap,grid,gridArea,gridAutoColumns,gridAutoFlow,gridAutoRows,gridColumn,gridColumnEnd,gridColumnGap,gridColumnStart,gridGap,gridRow,gridRowEnd,gridRowGap,gridRowStart,gridTemplate,gridTemplateAreas,gridTemplateColumns,gridTemplateRows,hangingPunctuation,height,hyphenateCharacter,hyphenateLimitChars,hyphens,imageOrientation,imageRendering,imageResolution,imeMode,initialLetter,initialLetterAlign,inlineSize,inset,insetBlock,insetBlockEnd,insetBlockStart,insetInline,insetInlineEnd,insetInlineStart,interpolateSize,isolation,justifyContent,justifyItems,justifySelf,justifyTracks,left,letterSpacing,lightingColor,lineBreak,lineClamp,lineHeight,lineHeightStep,listStyle,listStyleImage,listStylePosition,listStyleType,margin,marginBlock,marginBlockEnd,marginBlockStart,marginBottom,marginInline,marginInlineEnd,marginInlineStart,marginLeft,marginRight,marginTop,marginTrim,marker,markerEnd,markerMid,markerStart,mask,maskBorder,maskBorderMode,maskBorderOutset,maskBorderRepeat,maskBorderSlice,maskBorderSource,maskBorderWidth,maskClip,maskComposite,maskImage,maskMode,maskOrigin,maskPosition,maskRepeat,maskSize,maskType,masonryAutoFlow,mathDepth,mathShift,mathStyle,maxBlockSize,maxHeight,maxInlineSize,maxLines,maxWidth,minBlockSize,minHeight,minInlineSize,minWidth,mixBlendMode,objectFit,objectPosition,offset,offsetAnchor,offsetDistance,offsetPath,offsetPosition,offsetRotate,opacity,order,orphans,outline,outlineColor,outlineOffset,outlineStyle,outlineWidth,overflow,overflowAnchor,overflowBlock,overflowClipBox,overflowClipMargin,overflowInline,overflowWrap,overflowX,overflowY,overlay,overscrollBehavior,overscrollBehaviorBlock,overscrollBehaviorInline,overscrollBehaviorX,overscrollBehaviorY,padding,paddingBlock,paddingBlockEnd,paddingBlockStart,paddingBottom,paddingInline,paddingInlineEnd,paddingInlineStart,paddingLeft,paddingRight,paddingTop,page,pageBreakAfter,pageBreakBefore,pageBreakInside,paintOrder,perspective,perspectiveOrigin,placeContent,placeItems,placeSelf,pointerEvents,position,positionAnchor,positionArea,positionTry,positionTryFallbacks,positionTryOrder,positionVisibility,printColorAdjust,quotes,r,resize,right,rotate,rowGap,rubyAlign,rubyMerge,rubyPosition,rx,ry,scale,scrollBehavior,scrollMargin,scrollMarginBlock,scrollMarginBlockEnd,scrollMarginBlockStart,scrollMarginBottom,scrollMarginInline,scrollMarginInlineEnd,scrollMarginInlineStart,scrollMarginLeft,scrollMarginRight,scrollMarginTop,scrollPadding,scrollPaddingBlock,scrollPaddingBlockEnd,scrollPaddingBlockStart,scrollPaddingBottom,scrollPaddingInline,scrollPaddingInlineEnd,scrollPaddingInlineStart,scrollPaddingLeft,scrollPaddingRight,scrollPaddingTop,scrollSnapAlign,scrollSnapCoordinate,scrollSnapDestination,scrollSnapPointsX,scrollSnapPointsY,scrollSnapStop,scrollSnapType,scrollSnapTypeX,scrollSnapTypeY,scrollTimeline,scrollTimelineAxis,scrollTimelineName,scrollbarColor,scrollbarGutter,scrollbarWidth,shapeImageThreshold,shapeMargin,shapeOutside,shapeRendering,stopColor,stopOpacity,stroke,strokeDasharray,strokeDashoffset,strokeLinecap,strokeLinejoin,strokeMiterlimit,strokeOpacity,strokeWidth,tabSize,tableLayout,textAlign,textAlignLast,textAnchor,textBox,textBoxEdge,textBoxTrim,textCombineUpright,textDecoration,textDecorationColor,textDecorationLine,textDecorationSkip,textDecorationSkipInk,textDecorationStyle,textDecorationThickness,textEmphasis,textEmphasisColor,textEmphasisPosition,textEmphasisStyle,textIndent,textJustify,textOrientation,textOverflow,textRendering,textShadow,textSizeAdjust,textSpacingTrim,textTransform,textUnderlineOffset,textUnderlinePosition,textWrap,textWrapMode,textWrapStyle,timelineScope,top,touchAction,transform,transformBox,transformOrigin,transformStyle,transition,transitionBehavior,transitionDelay,transitionDuration,transitionProperty,transitionTimingFunction,translate,unicodeBidi,userSelect,vectorEffect,verticalAlign,viewTimeline,viewTimelineAxis,viewTimelineInset,viewTimelineName,viewTransitionName,visibility,whiteSpace,whiteSpaceCollapse,widows,width,willChange,wordBreak,wordSpacing,wordWrap,writingMode,x,y,zIndex,zoom,alignmentBaseline,baselineShift,colorInterpolation,colorRendering,glyphOrientationVertical";
 var allCssProperties = cssPropertiesStr.split(",").concat(userGenerated);

package/dist/styled-system/recipes/clear-button-slot-recipe.d.ts

@@ -0,0 +1,36 @@
+/* eslint-disable */
+import type { ConditionalValue } from '../types/index';
+import type { DistributiveOmit, Pretty } from '../types/system-types';
+
+interface ClearButtonSlotRecipeVariant {
+  /**
+ * @default "default"
+ */
+size: "small" | "default" | "large"
+}
+
+type ClearButtonSlotRecipeVariantMap = {
+  [key in keyof ClearButtonSlotRecipeVariant]: Array<ClearButtonSlotRecipeVariant[key]>
+}
+
+type ClearButtonSlotRecipeSlot = "root"
+
+export type ClearButtonSlotRecipeVariantProps = {
+  [key in keyof ClearButtonSlotRecipeVariant]?: ConditionalValue<ClearButtonSlotRecipeVariant[key]> | undefined
+}
+
+export interface ClearButtonSlotRecipeRecipe {
+  __slot: ClearButtonSlotRecipeSlot
+  __type: ClearButtonSlotRecipeVariantProps
+  (props?: ClearButtonSlotRecipeVariantProps): Pretty<Record<ClearButtonSlotRecipeSlot, string>>
+  raw: (props?: ClearButtonSlotRecipeVariantProps) => ClearButtonSlotRecipeVariantProps
+  variantMap: ClearButtonSlotRecipeVariantMap
+  variantKeys: Array<keyof ClearButtonSlotRecipeVariant>
+  splitVariantProps<Props extends ClearButtonSlotRecipeVariantProps>(props: Props): [ClearButtonSlotRecipeVariantProps, Pretty<DistributiveOmit<Props, keyof ClearButtonSlotRecipeVariantProps>>]
+  getVariantProps: (props?: ClearButtonSlotRecipeVariantProps) => ClearButtonSlotRecipeVariantProps
+}
+
+/**
+ * Slot class created for the MFUI ClearButton component. Adds mobile-friendly tap area on smDown.
+ */
+export declare const clearButtonSlotRecipe: ClearButtonSlotRecipeRecipe

package/dist/styled-system/recipes/clear-button-slot-recipe.js

@@ -0,0 +1,38 @@
+import { compact, getSlotCompoundVariant, memo, splitProps } from '../helpers.js';
+import { createRecipe } from './create-recipe.js';
+const clearButtonSlotRecipeDefaultVariants = {
+    "size": "default"
+};
+const clearButtonSlotRecipeCompoundVariants = [];
+const clearButtonSlotRecipeSlotNames = [
+    [
+        "root",
+        "ClearButton__root"
+    ]
+];
+const clearButtonSlotRecipeSlotFns = /* @__PURE__ */ clearButtonSlotRecipeSlotNames.map(([slotName, slotKey]) => [slotName, createRecipe(slotKey, clearButtonSlotRecipeDefaultVariants, getSlotCompoundVariant(clearButtonSlotRecipeCompoundVariants, slotName))]);
+const clearButtonSlotRecipeFn = memo((props = {}) => {
+    return Object.fromEntries(clearButtonSlotRecipeSlotFns.map(([slotName, slotFn]) => [slotName, slotFn.recipeFn(props)]));
+});
+const clearButtonSlotRecipeVariantKeys = [
+    "size"
+];
+const getVariantProps = (variants) => ({ ...clearButtonSlotRecipeDefaultVariants, ...compact(variants) });
+export const clearButtonSlotRecipe = /* @__PURE__ */ Object.assign(clearButtonSlotRecipeFn, {
+    __recipe__: false,
+    __name__: 'clearButtonSlotRecipe',
+    raw: (props) => props,
+    classNameMap: {},
+    variantKeys: clearButtonSlotRecipeVariantKeys,
+    variantMap: {
+        "size": [
+            "small",
+            "default",
+            "large"
+        ]
+    },
+    splitVariantProps(props) {
+        return splitProps(props, clearButtonSlotRecipeVariantKeys);
+    },
+    getVariantProps
+});

package/dist/styled-system/recipes/index.d.ts

@@ -12,6 +12,7 @@ export * from './dropdown-menu-divider-slot-recipe';
 export * from './dropdown-menu-heading-slot-recipe';
 export * from './dropdown-menu-item-slot-recipe';
 export * from './checkbox-slot-recipe';
+export * from './clear-button-slot-recipe';
 export * from './heading-slot-recipe';
 export * from './dialog-slot-recipe';
 export * from './radio-button-slot-recipe';
@@ -86,4 +87,5 @@ export * from './month-range-picker-panel-slot-recipe';
 export * from './month-range-picker-navigation-slot-recipe';
 export * from './month-range-picker-content-slot-recipe';
 export * from './accordion-slot-recipe';
-export * from './split-view-slot-recipe';
+export * from './split-view-slot-recipe';
+export * from './toggle-switch-slot-recipe';

package/dist/styled-system/recipes/index.js

@@ -11,6 +11,7 @@ export * from './dropdown-menu-divider-slot-recipe.js';
 export * from './dropdown-menu-heading-slot-recipe.js';
 export * from './dropdown-menu-item-slot-recipe.js';
 export * from './checkbox-slot-recipe.js';
+export * from './clear-button-slot-recipe.js';
 export * from './heading-slot-recipe.js';
 export * from './dialog-slot-recipe.js';
 export * from './radio-button-slot-recipe.js';
@@ -86,3 +87,4 @@ export * from './month-range-picker-navigation-slot-recipe.js';
 export * from './month-range-picker-content-slot-recipe.js';
 export * from './accordion-slot-recipe.js';
 export * from './split-view-slot-recipe.js';
+export * from './toggle-switch-slot-recipe.js';

package/dist/styled-system/recipes/select-box-slot-recipe.d.ts

@@ -6,7 +6,7 @@ interface SelectBoxSlotRecipeVariant {
   /**
  * @default "medium"
  */
-size: "small" | "medium"
+size: "small" | "medium" | "large"
 showGroupOptionDivider: boolean
 }
 
@@ -14,7 +14,7 @@ type SelectBoxSlotRecipeVariantMap = {
   [key in keyof SelectBoxSlotRecipeVariant]: Array<SelectBoxSlotRecipeVariant[key]>
 }
 
-type SelectBoxSlotRecipeSlot = "trigger" | "triggerWrapper" | "clearButtonWrapper" | "popover" | "menuHeader" | "optionPanel" | "scrollWrapper" | "listBox" | "listItem" | "skeletonItem" | "emptyMessage"
+type SelectBoxSlotRecipeSlot = "trigger" | "triggerWrapper" | "clearButtonWrapper" | "popover" | "menuHeader" | "optionPanel" | "scrollWrapper" | "listBox" | "listItem" | "skeletonItem" | "emptyMessage" | "infiniteScrollError" | "infiniteScrollErrorMessage" | "infiniteScrollErrorButton" | "infiniteScrollErrorIcon" | "infiniteScrollLoading"
 
 export type SelectBoxSlotRecipeVariantProps = {
   [key in keyof SelectBoxSlotRecipeVariant]?: ConditionalValue<SelectBoxSlotRecipeVariant[key]> | undefined

package/dist/styled-system/recipes/select-box-slot-recipe.js

@@ -48,6 +48,26 @@ const selectBoxSlotRecipeSlotNames = [
     [
         "emptyMessage",
         "SelectBox__emptyMessage"
+    ],
+    [
+        "infiniteScrollError",
+        "SelectBox__infiniteScrollError"
+    ],
+    [
+        "infiniteScrollErrorMessage",
+        "SelectBox__infiniteScrollErrorMessage"
+    ],
+    [
+        "infiniteScrollErrorButton",
+        "SelectBox__infiniteScrollErrorButton"
+    ],
+    [
+        "infiniteScrollErrorIcon",
+        "SelectBox__infiniteScrollErrorIcon"
+    ],
+    [
+        "infiniteScrollLoading",
+        "SelectBox__infiniteScrollLoading"
     ]
 ];
 const selectBoxSlotRecipeSlotFns = /* @__PURE__ */ selectBoxSlotRecipeSlotNames.map(([slotName, slotKey]) => [slotName, createRecipe(slotKey, selectBoxSlotRecipeDefaultVariants, getSlotCompoundVariant(selectBoxSlotRecipeCompoundVariants, slotName))]);
@@ -68,7 +88,8 @@ export const selectBoxSlotRecipe = /* @__PURE__ */ Object.assign(selectBoxSlotRe
     variantMap: {
         "size": [
             "small",
-            "medium"
+            "medium",
+            "large"
         ],
         "showGroupOptionDivider": [
             "true",

package/dist/styled-system/recipes/toggle-switch-slot-recipe.d.ts

@@ -0,0 +1,33 @@
+/* eslint-disable */
+import type { ConditionalValue } from '../types/index';
+import type { DistributiveOmit, Pretty } from '../types/system-types';
+
+interface ToggleSwitchSlotRecipeVariant {
+  
+}
+
+type ToggleSwitchSlotRecipeVariantMap = {
+  [key in keyof ToggleSwitchSlotRecipeVariant]: Array<ToggleSwitchSlotRecipeVariant[key]>
+}
+
+type ToggleSwitchSlotRecipeSlot = "root" | "input" | "handle"
+
+export type ToggleSwitchSlotRecipeVariantProps = {
+  [key in keyof ToggleSwitchSlotRecipeVariant]?: ConditionalValue<ToggleSwitchSlotRecipeVariant[key]> | undefined
+}
+
+export interface ToggleSwitchSlotRecipeRecipe {
+  __slot: ToggleSwitchSlotRecipeSlot
+  __type: ToggleSwitchSlotRecipeVariantProps
+  (props?: ToggleSwitchSlotRecipeVariantProps): Pretty<Record<ToggleSwitchSlotRecipeSlot, string>>
+  raw: (props?: ToggleSwitchSlotRecipeVariantProps) => ToggleSwitchSlotRecipeVariantProps
+  variantMap: ToggleSwitchSlotRecipeVariantMap
+  variantKeys: Array<keyof ToggleSwitchSlotRecipeVariant>
+  splitVariantProps<Props extends ToggleSwitchSlotRecipeVariantProps>(props: Props): [ToggleSwitchSlotRecipeVariantProps, Pretty<DistributiveOmit<Props, keyof ToggleSwitchSlotRecipeVariantProps>>]
+  getVariantProps: (props?: ToggleSwitchSlotRecipeVariantProps) => ToggleSwitchSlotRecipeVariantProps
+}
+
+/**
+ * Slot class created for the MFUI ToggleSwitch component.
+ */
+export declare const toggleSwitchSlotRecipe: ToggleSwitchSlotRecipeRecipe

package/dist/styled-system/recipes/toggle-switch-slot-recipe.js

@@ -0,0 +1,36 @@
+import { compact, getSlotCompoundVariant, memo, splitProps } from '../helpers.js';
+import { createRecipe } from './create-recipe.js';
+const toggleSwitchSlotRecipeDefaultVariants = {};
+const toggleSwitchSlotRecipeCompoundVariants = [];
+const toggleSwitchSlotRecipeSlotNames = [
+    [
+        "root",
+        "ToggleSwitch__root"
+    ],
+    [
+        "input",
+        "ToggleSwitch__input"
+    ],
+    [
+        "handle",
+        "ToggleSwitch__handle"
+    ]
+];
+const toggleSwitchSlotRecipeSlotFns = /* @__PURE__ */ toggleSwitchSlotRecipeSlotNames.map(([slotName, slotKey]) => [slotName, createRecipe(slotKey, toggleSwitchSlotRecipeDefaultVariants, getSlotCompoundVariant(toggleSwitchSlotRecipeCompoundVariants, slotName))]);
+const toggleSwitchSlotRecipeFn = memo((props = {}) => {
+    return Object.fromEntries(toggleSwitchSlotRecipeSlotFns.map(([slotName, slotFn]) => [slotName, slotFn.recipeFn(props)]));
+});
+const toggleSwitchSlotRecipeVariantKeys = [];
+const getVariantProps = (variants) => ({ ...toggleSwitchSlotRecipeDefaultVariants, ...compact(variants) });
+export const toggleSwitchSlotRecipe = /* @__PURE__ */ Object.assign(toggleSwitchSlotRecipeFn, {
+    __recipe__: false,
+    __name__: 'toggleSwitchSlotRecipe',
+    raw: (props) => props,
+    classNameMap: {},
+    variantKeys: toggleSwitchSlotRecipeVariantKeys,
+    variantMap: {},
+    splitVariantProps(props) {
+        return splitProps(props, toggleSwitchSlotRecipeVariantKeys);
+    },
+    getVariantProps
+});

package/dist/styled-system/types/conditions.d.ts

@@ -244,6 +244,16 @@ export interface Conditions {
 	"_hasDisabledRadioButtonInside": string
 	/** `&:has(input[type="radio"]:not(:disabled):checked)` */
 	"_hasCheckedRadioButtonInside": string
+	/** `&:has(input[type="checkbox"][role="switch"]:not(:disabled))` */
+	"_hasToggleSwitchInside": string
+	/** `&:has(input[type="checkbox"][role="switch"]:not(:disabled):focus-visible)` */
+	"_hasFocusedToggleSwitchInside": string
+	/** `&:has(input[type="checkbox"][role="switch"]:not(:disabled):focus-visible:checked)` */
+	"_hasFocusedCheckedToggleSwitchInside": string
+	/** `&:has(input[type="checkbox"][role="switch"]:disabled)` */
+	"_hasDisabledToggleSwitchInside": string
+	/** `&:has(input[type="checkbox"][role="switch"]:not(:disabled):checked)` */
+	"_hasCheckedToggleSwitchInside": string
 	/** `@media screen and (min-width: 37.5rem)` */
 	"sm": string
 	/** `@media screen and (min-width: 37.5rem) and (max-width: 74.9975rem)` */