qstd 0.3.44 → 0.3.46
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +27 -7
- package/dist/block/drawer.d.ts +2 -6
- package/dist/block/drawer.d.ts.map +1 -1
- package/dist/block/fns.d.ts +1 -0
- package/dist/block/fns.d.ts.map +1 -1
- package/dist/block/index.d.ts +0 -7
- package/dist/block/index.d.ts.map +1 -1
- package/dist/block/tooltip.d.ts +2 -3
- package/dist/block/tooltip.d.ts.map +1 -1
- package/dist/block/types.d.ts +4 -0
- package/dist/block/types.d.ts.map +1 -1
- package/dist/preset/index.cjs +3 -6
- package/dist/preset/index.d.ts.map +1 -1
- package/dist/preset/index.js +3 -6
- package/dist/react/index.cjs +456 -464
- package/dist/react/index.css +3 -4
- package/dist/react/index.js +452 -460
- package/dist/shared/api/types.d.ts +1 -1
- package/dist/shared/api/types.d.ts.map +1 -1
- package/package.json +1 -1
- package/styled-system/css/conditions.mjs +1 -1
- package/styled-system/jsx/is-valid-prop.mjs +1 -1
- package/styled-system/styles.css +4 -5
- package/styled-system/types/conditions.d.ts +2 -0
package/dist/react/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import "./index.css";
|
|
2
|
-
import * as
|
|
3
|
-
import
|
|
2
|
+
import * as React3 from 'react';
|
|
3
|
+
import React3__default, { forwardRef, useMemo, createElement } from 'react';
|
|
4
4
|
import { createPortal } from 'react-dom';
|
|
5
5
|
import { motion, MotionConfig, LayoutGroup, AnimatePresence, useDragControls, useMotionValue } from 'framer-motion';
|
|
6
6
|
import { useFloating, offset, flip, shift, hide, autoUpdate, FloatingPortal, arrow, useHover, safePolygon, useFocus, useDismiss, useRole, useInteractions } from '@floating-ui/react';
|
|
@@ -233,7 +233,7 @@ function normalizeHTMLProps(props) {
|
|
|
233
233
|
normalizeHTMLProps.keys = htmlProps;
|
|
234
234
|
|
|
235
235
|
// styled-system/css/conditions.mjs
|
|
236
|
-
var 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,_activeMouse,_activeKeyboard,_checkbox,_radioLabel,_radioDisabled,_radioSelected,_radioCircleOuter,_radioCircleInner,_radioFocusRing,_path,_svg,_labelLifted,xs,xsOnly,xsDown,sm,smOnly,smDown,md,mdOnly,mdDown,lg,lgOnly,lgDown,xl,xlOnly,xlDown,2xl,2xlOnly,2xlDown,xsToSm,xsToMd,xsToLg,xsToXl,xsTo2xl,smToMd,smToLg,smToXl,smTo2xl,mdToLg,mdToXl,mdTo2xl,lgToXl,lgTo2xl,xlTo2xl,@/xs,@/sm,@/md,@/lg,@/xl,@/2xl,@/3xl,@/4xl,@/5xl,@/6xl,@/7xl,@/8xl,base";
|
|
236
|
+
var 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,_activeMouse,_activeKeyboard,_checkbox,_radioLabel,_radioDisabled,_radioSelected,_radioCircleOuter,_radioCircleInner,_radioFocusRing,_path,_svg,_tooltip,_labelLifted,xs,xsOnly,xsDown,sm,smOnly,smDown,md,mdOnly,mdDown,lg,lgOnly,lgDown,xl,xlOnly,xlDown,2xl,2xlOnly,2xlDown,xsToSm,xsToMd,xsToLg,xsToXl,xsTo2xl,smToMd,smToLg,smToXl,smTo2xl,mdToLg,mdToXl,mdTo2xl,lgToXl,lgTo2xl,xlTo2xl,@/xs,@/sm,@/md,@/lg,@/xl,@/2xl,@/3xl,@/4xl,@/5xl,@/6xl,@/7xl,@/8xl,base";
|
|
237
237
|
var conditions = new Set(conditionsStr.split(","));
|
|
238
238
|
var conditionRegex = /^@|&|&$/;
|
|
239
239
|
function isCondition(value) {
|
|
@@ -380,7 +380,7 @@ function getCompoundVariantCss(compoundVariants, variantMap) {
|
|
|
380
380
|
}
|
|
381
381
|
|
|
382
382
|
// styled-system/jsx/is-valid-prop.mjs
|
|
383
|
-
var userGeneratedStr = "css,ar,pos,insetX,insetY,insetEnd,end,insetStart,start,flexDir,colStart,colEnd,autoCols,rowG,colG,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,br,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,rowStart,rowEnd,rounded,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,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,grid,center,relative,absolute,fixed,sticky,size,pointer,strokeColor,cols,rows,placeI,placeC,placeS,alignI,alignC,alignS,justifyI,justifyC,justifyS,colN,spaceBetween,rowN,gridRowStart,gridRowEnd,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,_activeMouse,_activeKeyboard,_checkbox,_radioLabel,_radioDisabled,_radioSelected,_radioCircleOuter,_radioCircleInner,_radioFocusRing,_path,_svg,_labelLifted,xs,xsOnly,xsDown,sm,smOnly,smDown,md,mdOnly,mdDown,lg,lgOnly,lgDown,xl,xlOnly,xlDown,2xl,2xlOnly,2xlDown,xsToSm,xsToMd,xsToLg,xsToXl,xsTo2xl,smToMd,smToLg,smToXl,smTo2xl,mdToLg,mdToXl,mdTo2xl,lgToXl,lgTo2xl,xlTo2xl,@/xs,@/sm,@/md,@/lg,@/xl,@/2xl,@/3xl,@/4xl,@/5xl,@/6xl,@/7xl,@/8xl,textStyle";
|
|
383
|
+
var userGeneratedStr = "css,ar,pos,insetX,insetY,insetEnd,end,insetStart,start,flexDir,colStart,colEnd,autoCols,rowG,colG,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,br,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,rowStart,rowEnd,rounded,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,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,grid,center,relative,absolute,fixed,sticky,size,pointer,strokeColor,cols,rows,placeI,placeC,placeS,alignI,alignC,alignS,justifyI,justifyC,justifyS,colN,spaceBetween,rowN,gridRowStart,gridRowEnd,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,_activeMouse,_activeKeyboard,_checkbox,_radioLabel,_radioDisabled,_radioSelected,_radioCircleOuter,_radioCircleInner,_radioFocusRing,_path,_svg,_tooltip,_labelLifted,xs,xsOnly,xsDown,sm,smOnly,smDown,md,mdOnly,mdDown,lg,lgOnly,lgDown,xl,xlOnly,xlDown,2xl,2xlOnly,2xlDown,xsToSm,xsToMd,xsToLg,xsToXl,xsTo2xl,smToMd,smToLg,smToXl,smTo2xl,mdToLg,mdToXl,mdTo2xl,lgToXl,lgTo2xl,xlTo2xl,@/xs,@/sm,@/md,@/lg,@/xl,@/2xl,@/3xl,@/4xl,@/5xl,@/6xl,@/7xl,@/8xl,textStyle";
|
|
384
384
|
var userGenerated = userGeneratedStr.split(",");
|
|
385
385
|
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";
|
|
386
386
|
var allCssProperties = cssPropertiesStr.split(",").concat(userGenerated);
|
|
@@ -608,14 +608,14 @@ function Menu(props) {
|
|
|
608
608
|
trigger,
|
|
609
609
|
...rest
|
|
610
610
|
} = props;
|
|
611
|
-
const hoverTimeoutRef =
|
|
612
|
-
const [isOpen, setOpen] =
|
|
611
|
+
const hoverTimeoutRef = React3__default.useRef(null);
|
|
612
|
+
const [isOpen, setOpen] = React3__default.useState(isOpenControlled ?? false);
|
|
613
613
|
const onOpenChange = (open) => {
|
|
614
614
|
const newOpenState = typeof open === "function" ? open(isOpen) : open;
|
|
615
615
|
props.onOpenOrClose?.(newOpenState);
|
|
616
616
|
setOpen(newOpenState);
|
|
617
617
|
};
|
|
618
|
-
|
|
618
|
+
React3__default.useEffect(() => {
|
|
619
619
|
if (typeof isOpenControlled !== "boolean") return;
|
|
620
620
|
setOpen(isOpenControlled);
|
|
621
621
|
}, [isOpenControlled]);
|
|
@@ -690,11 +690,11 @@ function Menu(props) {
|
|
|
690
690
|
},
|
|
691
691
|
isOpen
|
|
692
692
|
);
|
|
693
|
-
|
|
693
|
+
React3__default.useEffect(() => {
|
|
694
694
|
if (!hideData?.referenceHidden) return;
|
|
695
695
|
closeMenuImmediate();
|
|
696
696
|
}, [hideData, closeMenuImmediate]);
|
|
697
|
-
|
|
697
|
+
React3__default.useEffect(() => {
|
|
698
698
|
return () => {
|
|
699
699
|
if (hoverTimeoutRef.current) clearTimeout(hoverTimeoutRef.current);
|
|
700
700
|
};
|
|
@@ -720,10 +720,10 @@ function Menu(props) {
|
|
|
720
720
|
onMouseLeave: handleMenuMouseLeave
|
|
721
721
|
} : {};
|
|
722
722
|
const transformOrigin = floatingContext.placement.startsWith("top") ? "bottom left" : "top left";
|
|
723
|
-
const childArray =
|
|
723
|
+
const childArray = React3__default.Children.toArray(children);
|
|
724
724
|
let customContainerEl = null;
|
|
725
725
|
for (const c of childArray) {
|
|
726
|
-
if (
|
|
726
|
+
if (React3__default.isValidElement(c)) {
|
|
727
727
|
const anyType = c.type;
|
|
728
728
|
if (c.props?.["data-menu-container"] || anyType?.isBlockMenuContainer) {
|
|
729
729
|
customContainerEl = c;
|
|
@@ -752,7 +752,7 @@ function Menu(props) {
|
|
|
752
752
|
...restStyle || {}
|
|
753
753
|
};
|
|
754
754
|
const mergedClassName = [defaultsClassName, childProps.className].filter(Boolean).join(" ");
|
|
755
|
-
const contentNode =
|
|
755
|
+
const contentNode = React3__default.cloneElement(
|
|
756
756
|
customContainerEl,
|
|
757
757
|
{
|
|
758
758
|
// Defaults are now in mergedClassName via css()
|
|
@@ -838,7 +838,7 @@ function Menu(props) {
|
|
|
838
838
|
);
|
|
839
839
|
}
|
|
840
840
|
function useOutsideClick(ref, handler, enabled = true) {
|
|
841
|
-
|
|
841
|
+
React3__default.useEffect(() => {
|
|
842
842
|
if (!enabled) return;
|
|
843
843
|
const listener = (event) => {
|
|
844
844
|
if (!ref.current || ref.current.contains(event.target)) {
|
|
@@ -948,9 +948,9 @@ var prepareFiles = async (acceptedFiles) => {
|
|
|
948
948
|
);
|
|
949
949
|
};
|
|
950
950
|
var findChildrenByDisplayName = (children, displayName2) => {
|
|
951
|
-
return
|
|
951
|
+
return React3__default.Children.toArray(children).find(
|
|
952
952
|
(child) => {
|
|
953
|
-
if (
|
|
953
|
+
if (React3__default.isValidElement(child)) {
|
|
954
954
|
const childType = child.type;
|
|
955
955
|
return childType.displayName === displayName2;
|
|
956
956
|
} else {
|
|
@@ -1130,7 +1130,7 @@ function getIcon(position, Icon2, props) {
|
|
|
1130
1130
|
if (loadingIcons.includes(chosen)) {
|
|
1131
1131
|
const Cmp = loadingIconsMap[chosen];
|
|
1132
1132
|
const sizePx = typeof loadingIconSize === "number" ? `${loadingIconSize}px` : "12px";
|
|
1133
|
-
return
|
|
1133
|
+
return React3__default.createElement(Cmp, {
|
|
1134
1134
|
width: sizePx,
|
|
1135
1135
|
height: sizePx
|
|
1136
1136
|
});
|
|
@@ -1145,11 +1145,11 @@ function getIcon(position, Icon2, props) {
|
|
|
1145
1145
|
spin: props.spin
|
|
1146
1146
|
}
|
|
1147
1147
|
);
|
|
1148
|
-
} else if (
|
|
1148
|
+
} else if (React3__default.isValidElement(chosen)) {
|
|
1149
1149
|
return chosen;
|
|
1150
1150
|
} else if (typeof chosen === "function") {
|
|
1151
1151
|
const iconProps = typeof loadingIconSize === "number" || typeof loadingIconSize === "string" ? { size: loadingIconSize } : void 0;
|
|
1152
|
-
return
|
|
1152
|
+
return React3__default.createElement(chosen, iconProps);
|
|
1153
1153
|
} else if (typeof chosen === "object" && chosen !== null && "iconName" in chosen) {
|
|
1154
1154
|
return /* @__PURE__ */ jsx(
|
|
1155
1155
|
FontAwesomeIcon,
|
|
@@ -1199,8 +1199,8 @@ function getIcon(position, Icon2, props) {
|
|
|
1199
1199
|
}
|
|
1200
1200
|
);
|
|
1201
1201
|
} else if (typeof Icon2 === "function") {
|
|
1202
|
-
return
|
|
1203
|
-
} else if (
|
|
1202
|
+
return React3__default.createElement(Icon2);
|
|
1203
|
+
} else if (React3__default.isValidElement(Icon2)) {
|
|
1204
1204
|
return Icon2;
|
|
1205
1205
|
} else return null;
|
|
1206
1206
|
}
|
|
@@ -1245,9 +1245,9 @@ var TrackNameKey = "Track";
|
|
|
1245
1245
|
var ThumbNameKey = "Thumb";
|
|
1246
1246
|
var Button = motionTags.button;
|
|
1247
1247
|
var Base = motionTags.div;
|
|
1248
|
-
var SwitchContext =
|
|
1248
|
+
var SwitchContext = React3__default.createContext(null);
|
|
1249
1249
|
var useSwitchContext = () => {
|
|
1250
|
-
const context2 =
|
|
1250
|
+
const context2 = React3__default.useContext(SwitchContext);
|
|
1251
1251
|
if (!context2) {
|
|
1252
1252
|
throw new Error("Switch compound components must be used within Switch");
|
|
1253
1253
|
}
|
|
@@ -1266,9 +1266,9 @@ function Switch(props) {
|
|
|
1266
1266
|
_motion,
|
|
1267
1267
|
...rest
|
|
1268
1268
|
} = props;
|
|
1269
|
-
const [x, setX] =
|
|
1270
|
-
const [pressed, setPressed] =
|
|
1271
|
-
const [growThumb, setGrowThumb] =
|
|
1269
|
+
const [x, setX] = React3__default.useState(0);
|
|
1270
|
+
const [pressed, setPressed] = React3__default.useState(false);
|
|
1271
|
+
const [growThumb, setGrowThumb] = React3__default.useState(false);
|
|
1272
1272
|
const borderWidth = 4;
|
|
1273
1273
|
const trackWidth = thumbSize * 1.5;
|
|
1274
1274
|
const borderRadius = thumbSize * 2.5;
|
|
@@ -1279,7 +1279,7 @@ function Switch(props) {
|
|
|
1279
1279
|
start: stopwatchStart,
|
|
1280
1280
|
clear: stopwatchClear
|
|
1281
1281
|
} = useStopwatch();
|
|
1282
|
-
|
|
1282
|
+
React3__default.useEffect(() => {
|
|
1283
1283
|
if (pressed && !disabled) {
|
|
1284
1284
|
stopwatchStart();
|
|
1285
1285
|
} else {
|
|
@@ -1287,12 +1287,12 @@ function Switch(props) {
|
|
|
1287
1287
|
stopwatchClear();
|
|
1288
1288
|
}
|
|
1289
1289
|
}, [pressed, disabled, stopwatchStart, stopwatchClear]);
|
|
1290
|
-
|
|
1290
|
+
React3__default.useEffect(() => {
|
|
1291
1291
|
if (stopwatchTime > 200) {
|
|
1292
1292
|
setGrowThumb(true);
|
|
1293
1293
|
}
|
|
1294
1294
|
}, [stopwatchTime]);
|
|
1295
|
-
|
|
1295
|
+
React3__default.useEffect(() => {
|
|
1296
1296
|
setX(checked ? checkedPosition : 0);
|
|
1297
1297
|
}, [checked, checkedPosition]);
|
|
1298
1298
|
const toggle = () => {
|
|
@@ -1357,10 +1357,10 @@ function Switch(props) {
|
|
|
1357
1357
|
children,
|
|
1358
1358
|
ThumbNameKey
|
|
1359
1359
|
);
|
|
1360
|
-
const trackElement = track ?
|
|
1360
|
+
const trackElement = track ? React3__default.cloneElement(track, {
|
|
1361
1361
|
_motion,
|
|
1362
|
-
children: thumb ?
|
|
1363
|
-
}) : /* @__PURE__ */ jsx(Track, { _motion, children: thumb ?
|
|
1362
|
+
children: thumb ? React3__default.cloneElement(thumb, { _motion }) : /* @__PURE__ */ jsx(Thumb, { _motion })
|
|
1363
|
+
}) : /* @__PURE__ */ jsx(Track, { _motion, children: thumb ? React3__default.cloneElement(thumb, { _motion }) : /* @__PURE__ */ jsx(Thumb, { _motion }) });
|
|
1364
1364
|
return /* @__PURE__ */ jsx(SwitchContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(MotionConfig, { transition: _motion, children: /* @__PURE__ */ jsx(
|
|
1365
1365
|
Button,
|
|
1366
1366
|
{
|
|
@@ -1486,10 +1486,10 @@ function Thumb(props) {
|
|
|
1486
1486
|
Track.displayName = TrackNameKey;
|
|
1487
1487
|
Thumb.displayName = ThumbNameKey;
|
|
1488
1488
|
function useStopwatch(props = {}) {
|
|
1489
|
-
const [active, setActive] =
|
|
1490
|
-
const [time, setTime] =
|
|
1489
|
+
const [active, setActive] = React3__default.useState(false);
|
|
1490
|
+
const [time, setTime] = React3__default.useState(0);
|
|
1491
1491
|
const timeInterval = props?.interval ?? 10;
|
|
1492
|
-
|
|
1492
|
+
React3__default.useEffect(() => {
|
|
1493
1493
|
let interval = null;
|
|
1494
1494
|
if (active) {
|
|
1495
1495
|
interval = setInterval(() => {
|
|
@@ -1500,19 +1500,19 @@ function useStopwatch(props = {}) {
|
|
|
1500
1500
|
}
|
|
1501
1501
|
return () => clearInterval(interval);
|
|
1502
1502
|
}, [active, timeInterval]);
|
|
1503
|
-
const start =
|
|
1504
|
-
const stop =
|
|
1505
|
-
const clear =
|
|
1503
|
+
const start = React3__default.useCallback(() => setActive(true), []);
|
|
1504
|
+
const stop = React3__default.useCallback(() => setActive(false), []);
|
|
1505
|
+
const clear = React3__default.useCallback(() => {
|
|
1506
1506
|
setActive(false);
|
|
1507
1507
|
setTime(0);
|
|
1508
1508
|
}, []);
|
|
1509
|
-
return
|
|
1509
|
+
return React3__default.useMemo(
|
|
1510
1510
|
() => ({ time, start, stop, clear }),
|
|
1511
1511
|
[time, start, stop, clear]
|
|
1512
1512
|
);
|
|
1513
1513
|
}
|
|
1514
1514
|
var switch_default = Switch;
|
|
1515
|
-
var RadioContext =
|
|
1515
|
+
var RadioContext = React3__default.createContext(null);
|
|
1516
1516
|
var Base2 = base;
|
|
1517
1517
|
var MotionDiv2 = motionTags.div;
|
|
1518
1518
|
function Radio(props) {
|
|
@@ -1529,14 +1529,14 @@ function Radio(props) {
|
|
|
1529
1529
|
onAnimationComplete: _onAnimationComplete,
|
|
1530
1530
|
...rest
|
|
1531
1531
|
} = props;
|
|
1532
|
-
const groupId =
|
|
1532
|
+
const groupId = React3__default.useId();
|
|
1533
1533
|
const isControlled = controlledValue !== void 0;
|
|
1534
|
-
const [uncontrolled, setUncontrolled] =
|
|
1534
|
+
const [uncontrolled, setUncontrolled] = React3__default.useState(
|
|
1535
1535
|
defaultValue
|
|
1536
1536
|
);
|
|
1537
1537
|
const selectedValue = isControlled ? controlledValue ?? null : uncontrolled;
|
|
1538
|
-
const itemsRef =
|
|
1539
|
-
const [activeId, setActiveId] =
|
|
1538
|
+
const itemsRef = React3__default.useRef([]);
|
|
1539
|
+
const [activeId, setActiveId] = React3__default.useState("");
|
|
1540
1540
|
const setSelectedValue = (val) => {
|
|
1541
1541
|
if (!isControlled) setUncontrolled(val);
|
|
1542
1542
|
onChange?.(val);
|
|
@@ -1589,7 +1589,7 @@ function Radio(props) {
|
|
|
1589
1589
|
setActiveId(found.id);
|
|
1590
1590
|
}
|
|
1591
1591
|
};
|
|
1592
|
-
|
|
1592
|
+
React3__default.useEffect(() => {
|
|
1593
1593
|
if (!selectedValue) return;
|
|
1594
1594
|
const selected = itemsRef.current.find((x) => x.value === selectedValue);
|
|
1595
1595
|
if (selected && !selected.disabled) setActiveId(selected.id);
|
|
@@ -1630,7 +1630,7 @@ function Radio(props) {
|
|
|
1630
1630
|
},
|
|
1631
1631
|
children: [
|
|
1632
1632
|
(options ?? []).map(
|
|
1633
|
-
(opt) => renderOption ? /* @__PURE__ */ jsx(
|
|
1633
|
+
(opt) => renderOption ? /* @__PURE__ */ jsx(React3__default.Fragment, { children: renderOption(opt) }, opt.value) : /* @__PURE__ */ jsx(
|
|
1634
1634
|
Item,
|
|
1635
1635
|
{
|
|
1636
1636
|
value: opt.value,
|
|
@@ -1662,16 +1662,16 @@ function Item(props) {
|
|
|
1662
1662
|
onAnimationComplete: _onAnimationComplete,
|
|
1663
1663
|
...rest
|
|
1664
1664
|
} = props;
|
|
1665
|
-
const ctx =
|
|
1666
|
-
const ref =
|
|
1667
|
-
const [isFocused, setIsFocused] =
|
|
1665
|
+
const ctx = React3__default.useContext(RadioContext);
|
|
1666
|
+
const ref = React3__default.useRef(null);
|
|
1667
|
+
const [isFocused, setIsFocused] = React3__default.useState(false);
|
|
1668
1668
|
const groupDisabled = ctx?.disabled;
|
|
1669
1669
|
const disabled = !!(groupDisabled || itemDisabled);
|
|
1670
1670
|
const groupId = ctx?.groupId ?? "";
|
|
1671
1671
|
const id = `radio-item-${groupId}-${value}`;
|
|
1672
1672
|
const registerItem = ctx?.registerItem;
|
|
1673
1673
|
const unregisterItem = ctx?.unregisterItem;
|
|
1674
|
-
|
|
1674
|
+
React3__default.useEffect(() => {
|
|
1675
1675
|
if (!registerItem || !unregisterItem) return;
|
|
1676
1676
|
registerItem({ id, value, disabled, ref });
|
|
1677
1677
|
return () => unregisterItem(id);
|
|
@@ -1687,12 +1687,12 @@ function Item(props) {
|
|
|
1687
1687
|
const isActive = isActiveId(id);
|
|
1688
1688
|
const shouldUseGrid = gridProp || !!colsProp;
|
|
1689
1689
|
const renderLabel = () => {
|
|
1690
|
-
const onlyChild =
|
|
1690
|
+
const onlyChild = React3__default.Children.count(children) === 1 ? React3__default.Children.toArray(children)[0] : null;
|
|
1691
1691
|
if (typeof onlyChild === "string") {
|
|
1692
1692
|
return /* @__PURE__ */ jsx(Base2, { "data-radio-label": true, children: onlyChild });
|
|
1693
1693
|
}
|
|
1694
|
-
if (
|
|
1695
|
-
return
|
|
1694
|
+
if (React3__default.isValidElement(onlyChild)) {
|
|
1695
|
+
return React3__default.cloneElement(
|
|
1696
1696
|
onlyChild,
|
|
1697
1697
|
{ "data-radio-label": true }
|
|
1698
1698
|
);
|
|
@@ -1809,7 +1809,7 @@ function Item(props) {
|
|
|
1809
1809
|
var LabelNameKey = "Label";
|
|
1810
1810
|
var Base3 = base;
|
|
1811
1811
|
var isBrowser = typeof window !== "undefined";
|
|
1812
|
-
var useIsomorphicLayoutEffect = isBrowser ?
|
|
1812
|
+
var useIsomorphicLayoutEffect = isBrowser ? React3__default.useLayoutEffect : React3__default.useEffect;
|
|
1813
1813
|
function pick(props, obj) {
|
|
1814
1814
|
return props.reduce((acc, prop) => {
|
|
1815
1815
|
acc[prop] = obj[prop];
|
|
@@ -1940,21 +1940,21 @@ function Textarea(props) {
|
|
|
1940
1940
|
...rest
|
|
1941
1941
|
} = props;
|
|
1942
1942
|
const isControlled = props.value !== void 0;
|
|
1943
|
-
const libRef =
|
|
1943
|
+
const libRef = React3__default.useRef(null);
|
|
1944
1944
|
const ref = assignRefs(libRef, userRef);
|
|
1945
|
-
const heightRef =
|
|
1946
|
-
const [_value, _setValue] =
|
|
1945
|
+
const heightRef = React3__default.useRef(0);
|
|
1946
|
+
const [_value, _setValue] = React3__default.useState("");
|
|
1947
1947
|
const value = props.value ?? _value;
|
|
1948
1948
|
const label = findChildrenByDisplayName(
|
|
1949
1949
|
children,
|
|
1950
1950
|
LabelNameKey
|
|
1951
1951
|
);
|
|
1952
|
-
const labelWithProps = label ?
|
|
1952
|
+
const labelWithProps = label ? React3__default.cloneElement(label, {
|
|
1953
1953
|
required: props.required,
|
|
1954
1954
|
value: props.value,
|
|
1955
1955
|
error
|
|
1956
1956
|
}) : null;
|
|
1957
|
-
const resizeTextarea =
|
|
1957
|
+
const resizeTextarea = React3__default.useCallback(() => {
|
|
1958
1958
|
const node = libRef.current;
|
|
1959
1959
|
if (!node) return;
|
|
1960
1960
|
const nodeSizingData = getSizingData(node);
|
|
@@ -1980,20 +1980,20 @@ function Textarea(props) {
|
|
|
1980
1980
|
useIsomorphicLayoutEffect(() => {
|
|
1981
1981
|
resizeTextarea();
|
|
1982
1982
|
}, [rest.value, rest.placeholder, resizeTextarea]);
|
|
1983
|
-
|
|
1983
|
+
React3__default.useEffect(() => {
|
|
1984
1984
|
if (!isBrowser) return;
|
|
1985
1985
|
const onResize = () => resizeTextarea();
|
|
1986
1986
|
window.addEventListener("resize", onResize);
|
|
1987
1987
|
return () => window.removeEventListener("resize", onResize);
|
|
1988
1988
|
}, [rest.placeholder, rest.value, resizeTextarea]);
|
|
1989
|
-
|
|
1989
|
+
React3__default.useEffect(() => {
|
|
1990
1990
|
const fonts = isBrowser ? document.fonts : void 0;
|
|
1991
1991
|
if (!fonts || typeof fonts.addEventListener !== "function") return;
|
|
1992
1992
|
const onFontsLoaded = () => resizeTextarea();
|
|
1993
1993
|
fonts.addEventListener("loadingdone", onFontsLoaded);
|
|
1994
1994
|
return () => fonts.removeEventListener("loadingdone", onFontsLoaded);
|
|
1995
1995
|
}, [rest.placeholder, rest.value, resizeTextarea]);
|
|
1996
|
-
|
|
1996
|
+
React3__default.useEffect(() => {
|
|
1997
1997
|
const node = libRef.current;
|
|
1998
1998
|
const form = node?.form;
|
|
1999
1999
|
if (!node || !form || isControlled) return;
|
|
@@ -2135,8 +2135,8 @@ function Icon(props) {
|
|
|
2135
2135
|
}
|
|
2136
2136
|
);
|
|
2137
2137
|
} else if (typeof IconComp === "function") {
|
|
2138
|
-
return
|
|
2139
|
-
} else if (
|
|
2138
|
+
return React3__default.createElement(IconComp);
|
|
2139
|
+
} else if (React3__default.isValidElement(IconComp)) {
|
|
2140
2140
|
return IconComp;
|
|
2141
2141
|
}
|
|
2142
2142
|
return null;
|
|
@@ -2165,13 +2165,13 @@ function Input(props) {
|
|
|
2165
2165
|
children,
|
|
2166
2166
|
RightSideNameKey
|
|
2167
2167
|
);
|
|
2168
|
-
const labelWithProps = label ?
|
|
2168
|
+
const labelWithProps = label ? React3__default.cloneElement(label, {
|
|
2169
2169
|
hasLeftIcon: !!leftIcon,
|
|
2170
2170
|
required: props.required,
|
|
2171
2171
|
value: props.value,
|
|
2172
2172
|
error
|
|
2173
2173
|
}) : null;
|
|
2174
|
-
const rightSideWithProps = rightSide ?
|
|
2174
|
+
const rightSideWithProps = rightSide ? React3__default.cloneElement(rightSide, {
|
|
2175
2175
|
onChange: props.onChange,
|
|
2176
2176
|
value: props.value
|
|
2177
2177
|
}) : null;
|
|
@@ -2316,29 +2316,29 @@ function Label2(props) {
|
|
|
2316
2316
|
Label2.displayName = LabelNameKey2;
|
|
2317
2317
|
function useResizeObserver(opts = {}) {
|
|
2318
2318
|
const onResize = opts.onResize;
|
|
2319
|
-
const onResizeRef =
|
|
2320
|
-
|
|
2319
|
+
const onResizeRef = React3__default.useRef(void 0);
|
|
2320
|
+
React3__default.useLayoutEffect(() => {
|
|
2321
2321
|
onResizeRef.current = onResize;
|
|
2322
2322
|
}, [onResize]);
|
|
2323
2323
|
const round = opts.round || Math.round;
|
|
2324
|
-
const resizeObserverRef =
|
|
2325
|
-
const [size, setSize] =
|
|
2324
|
+
const resizeObserverRef = React3__default.useRef(null);
|
|
2325
|
+
const [size, setSize] = React3__default.useState({
|
|
2326
2326
|
width: void 0,
|
|
2327
2327
|
height: void 0
|
|
2328
2328
|
});
|
|
2329
|
-
const didUnmount =
|
|
2330
|
-
|
|
2329
|
+
const didUnmount = React3__default.useRef(false);
|
|
2330
|
+
React3__default.useEffect(() => {
|
|
2331
2331
|
didUnmount.current = false;
|
|
2332
2332
|
return () => {
|
|
2333
2333
|
didUnmount.current = true;
|
|
2334
2334
|
};
|
|
2335
2335
|
}, []);
|
|
2336
|
-
const previous =
|
|
2336
|
+
const previous = React3__default.useRef({
|
|
2337
2337
|
width: void 0,
|
|
2338
2338
|
height: void 0
|
|
2339
2339
|
});
|
|
2340
2340
|
const refCallback = useResolvedElement(
|
|
2341
|
-
|
|
2341
|
+
React3__default.useCallback(
|
|
2342
2342
|
(element) => {
|
|
2343
2343
|
if (!resizeObserverRef.current || resizeObserverRef.current.box !== opts.box || resizeObserverRef.current.round !== round) {
|
|
2344
2344
|
resizeObserverRef.current = {
|
|
@@ -2378,7 +2378,7 @@ function useResizeObserver(opts = {}) {
|
|
|
2378
2378
|
),
|
|
2379
2379
|
opts.ref
|
|
2380
2380
|
);
|
|
2381
|
-
return
|
|
2381
|
+
return React3__default.useMemo(
|
|
2382
2382
|
() => ({
|
|
2383
2383
|
ref: refCallback,
|
|
2384
2384
|
width: size.width,
|
|
@@ -2390,12 +2390,12 @@ function useResizeObserver(opts = {}) {
|
|
|
2390
2390
|
);
|
|
2391
2391
|
}
|
|
2392
2392
|
function useResolvedElement(subscriber, refOrElement) {
|
|
2393
|
-
const lastReportRef =
|
|
2394
|
-
const refOrElementRef =
|
|
2395
|
-
|
|
2393
|
+
const lastReportRef = React3__default.useRef(null);
|
|
2394
|
+
const refOrElementRef = React3__default.useRef(null);
|
|
2395
|
+
React3__default.useLayoutEffect(() => {
|
|
2396
2396
|
refOrElementRef.current = refOrElement;
|
|
2397
2397
|
}, [refOrElement]);
|
|
2398
|
-
const cbElementRef =
|
|
2398
|
+
const cbElementRef = React3__default.useRef(null);
|
|
2399
2399
|
const evaluateSubscription = () => {
|
|
2400
2400
|
const cbElement = cbElementRef.current;
|
|
2401
2401
|
const refOrElement2 = refOrElementRef.current;
|
|
@@ -2414,10 +2414,10 @@ function useResolvedElement(subscriber, refOrElement) {
|
|
|
2414
2414
|
cleanup: element ? subscriber(element) : void 0
|
|
2415
2415
|
};
|
|
2416
2416
|
};
|
|
2417
|
-
|
|
2417
|
+
React3__default.useEffect(() => {
|
|
2418
2418
|
evaluateSubscription();
|
|
2419
2419
|
});
|
|
2420
|
-
|
|
2420
|
+
React3__default.useEffect(() => {
|
|
2421
2421
|
return () => {
|
|
2422
2422
|
if (lastReportRef.current && lastReportRef.current.cleanup) {
|
|
2423
2423
|
lastReportRef.current.cleanup();
|
|
@@ -2443,7 +2443,7 @@ var use_resize_observer_default = useResizeObserver;
|
|
|
2443
2443
|
var MotionDiv3 = motionTags.div;
|
|
2444
2444
|
var MotionBtn = motionTags.button;
|
|
2445
2445
|
var displayName = "AccordionItem";
|
|
2446
|
-
var AccordionContext =
|
|
2446
|
+
var AccordionContext = React3__default.createContext({});
|
|
2447
2447
|
function AccordionProvider(props) {
|
|
2448
2448
|
const [state, setState] = useImmer({
|
|
2449
2449
|
allowMultiple: false,
|
|
@@ -2453,7 +2453,7 @@ function AccordionProvider(props) {
|
|
|
2453
2453
|
return /* @__PURE__ */ jsx(AccordionContext.Provider, { value: { setState, state }, children: props.children });
|
|
2454
2454
|
}
|
|
2455
2455
|
function useAccordion() {
|
|
2456
|
-
const context2 =
|
|
2456
|
+
const context2 = React3__default.useContext(AccordionContext);
|
|
2457
2457
|
if (context2 === void 0) {
|
|
2458
2458
|
throw new Error("useAccordion must be used within a AccordionProvider");
|
|
2459
2459
|
}
|
|
@@ -2462,23 +2462,23 @@ function useAccordion() {
|
|
|
2462
2462
|
function AccordionComponent(props) {
|
|
2463
2463
|
const accordion = useAccordion();
|
|
2464
2464
|
const accordionState = accordion.state;
|
|
2465
|
-
|
|
2465
|
+
React3__default.useEffect(() => {
|
|
2466
2466
|
accordion.setState((draft) => {
|
|
2467
2467
|
draft.allowMultiple = !!props.allowMultiple;
|
|
2468
2468
|
draft.allowToggle = !!props.allowToggle;
|
|
2469
2469
|
});
|
|
2470
2470
|
}, [props.allowMultiple, props.allowToggle]);
|
|
2471
|
-
|
|
2471
|
+
React3__default.Children.forEach(props.children, (x) => {
|
|
2472
2472
|
if (typeof x.type === "function" && "displayName" in x.type && x.type.displayName !== displayName) {
|
|
2473
2473
|
throw new Error("Accordion can only have AccordionItems as children");
|
|
2474
2474
|
}
|
|
2475
2475
|
});
|
|
2476
|
-
const children =
|
|
2477
|
-
if (!
|
|
2478
|
-
return
|
|
2476
|
+
const children = React3__default.Children.map(props.children, (child, i) => {
|
|
2477
|
+
if (!React3__default.isValidElement(child)) return child;
|
|
2478
|
+
return React3__default.cloneElement(child, { idx: i });
|
|
2479
2479
|
});
|
|
2480
2480
|
const defaultOpenIdxList = JSON.stringify(props.defaultOpenIdx ?? []);
|
|
2481
|
-
|
|
2481
|
+
React3__default.useEffect(
|
|
2482
2482
|
() => {
|
|
2483
2483
|
if (accordionState.open.length === children.length) return;
|
|
2484
2484
|
const defaultOpenIdx = props.defaultOpenIdx;
|
|
@@ -2585,16 +2585,16 @@ var MotionDiv4 = motionTags.div;
|
|
|
2585
2585
|
var MotionBtn2 = motionTags.button;
|
|
2586
2586
|
var breakpoint = ["(min-width: 600px)"];
|
|
2587
2587
|
function DrawerComponent(props) {
|
|
2588
|
-
const ref =
|
|
2589
|
-
const dragHandleRef =
|
|
2588
|
+
const ref = React3__default.useRef(null);
|
|
2589
|
+
const dragHandleRef = React3__default.useRef(null);
|
|
2590
2590
|
const [isDesktop] = useMatchMedia(breakpoint);
|
|
2591
|
-
const closeFnRef =
|
|
2592
|
-
const prevOpenRef =
|
|
2591
|
+
const closeFnRef = React3__default.useRef(null);
|
|
2592
|
+
const prevOpenRef = React3__default.useRef(null);
|
|
2593
2593
|
const dragControls = useDragControls();
|
|
2594
2594
|
const { open, setOpen } = useDrawer();
|
|
2595
2595
|
const { onClose, onExitComplete, ...rest } = props;
|
|
2596
|
-
const [mounted, setMounted] =
|
|
2597
|
-
|
|
2596
|
+
const [mounted, setMounted] = React3__default.useState(false);
|
|
2597
|
+
React3__default.useEffect(() => {
|
|
2598
2598
|
setMounted(true);
|
|
2599
2599
|
}, []);
|
|
2600
2600
|
const y = useMotionValue(0);
|
|
@@ -2607,7 +2607,7 @@ function DrawerComponent(props) {
|
|
|
2607
2607
|
y.stop();
|
|
2608
2608
|
setOpen(false);
|
|
2609
2609
|
};
|
|
2610
|
-
|
|
2610
|
+
React3__default.useEffect(() => {
|
|
2611
2611
|
closeFnRef.current = () => {
|
|
2612
2612
|
closeDrawer();
|
|
2613
2613
|
onClose?.();
|
|
@@ -2627,7 +2627,7 @@ function DrawerComponent(props) {
|
|
|
2627
2627
|
);
|
|
2628
2628
|
}
|
|
2629
2629
|
};
|
|
2630
|
-
|
|
2630
|
+
React3__default.useLayoutEffect(() => {
|
|
2631
2631
|
const wasOpen = prevOpenRef.current;
|
|
2632
2632
|
const isOpen = props.open;
|
|
2633
2633
|
if (isOpen) {
|
|
@@ -2637,7 +2637,7 @@ function DrawerComponent(props) {
|
|
|
2637
2637
|
}
|
|
2638
2638
|
prevOpenRef.current = isOpen;
|
|
2639
2639
|
}, [props.open]);
|
|
2640
|
-
|
|
2640
|
+
React3__default.useEffect(() => {
|
|
2641
2641
|
const container = ref.current;
|
|
2642
2642
|
if (!open || !container) return;
|
|
2643
2643
|
container.setAttribute("tabindex", "0");
|
|
@@ -2659,7 +2659,7 @@ function DrawerComponent(props) {
|
|
|
2659
2659
|
document.body.style.overflow = "auto";
|
|
2660
2660
|
};
|
|
2661
2661
|
}, [open, props.closeOnEsc]);
|
|
2662
|
-
|
|
2662
|
+
React3__default.useEffect(() => {
|
|
2663
2663
|
if (!props.open) return;
|
|
2664
2664
|
const unsubscribeY = y.on("change", (latestY) => {
|
|
2665
2665
|
if (latestY > 150) {
|
|
@@ -2680,159 +2680,167 @@ function DrawerComponent(props) {
|
|
|
2680
2680
|
};
|
|
2681
2681
|
if (!mounted) return null;
|
|
2682
2682
|
return createPortal(
|
|
2683
|
-
/* @__PURE__ */ jsx(
|
|
2684
|
-
|
|
2683
|
+
/* @__PURE__ */ jsx(
|
|
2684
|
+
AnimatePresence,
|
|
2685
2685
|
{
|
|
2686
|
-
|
|
2687
|
-
|
|
2688
|
-
|
|
2686
|
+
initial: false,
|
|
2687
|
+
mode: "wait",
|
|
2688
|
+
onExitComplete,
|
|
2689
|
+
children: open && /* @__PURE__ */ jsx(
|
|
2690
|
+
Backdrop,
|
|
2689
2691
|
{
|
|
2690
|
-
|
|
2691
|
-
|
|
2692
|
-
|
|
2693
|
-
|
|
2694
|
-
|
|
2695
|
-
|
|
2696
|
-
|
|
2697
|
-
|
|
2698
|
-
|
|
2699
|
-
|
|
2700
|
-
|
|
2701
|
-
|
|
2702
|
-
|
|
2703
|
-
|
|
2704
|
-
|
|
2705
|
-
|
|
2706
|
-
|
|
2707
|
-
|
|
2708
|
-
|
|
2709
|
-
|
|
2710
|
-
|
|
2711
|
-
|
|
2712
|
-
|
|
2713
|
-
|
|
2714
|
-
|
|
2715
|
-
|
|
2716
|
-
|
|
2717
|
-
|
|
2718
|
-
|
|
2719
|
-
|
|
2692
|
+
onClick: () => onBackdropClick(),
|
|
2693
|
+
children: /* @__PURE__ */ jsx(
|
|
2694
|
+
MotionDiv4,
|
|
2695
|
+
{
|
|
2696
|
+
grid: true,
|
|
2697
|
+
onClick: (e) => e.stopPropagation(),
|
|
2698
|
+
position: "fixed",
|
|
2699
|
+
initial: "initial",
|
|
2700
|
+
animate: "animate",
|
|
2701
|
+
exit: "exit",
|
|
2702
|
+
...isDesktop ? {
|
|
2703
|
+
drag: false,
|
|
2704
|
+
style: void 0,
|
|
2705
|
+
dragControls: null,
|
|
2706
|
+
dragConstraints: void 0,
|
|
2707
|
+
// style: null,
|
|
2708
|
+
// dragConstraints: null,
|
|
2709
|
+
height: props.height ?? "max-content!",
|
|
2710
|
+
// "min(50%, 300px)",
|
|
2711
|
+
width: props.width ?? "clamp(50%, 700px, 90%)",
|
|
2712
|
+
pt: 6,
|
|
2713
|
+
// px: 4,
|
|
2714
|
+
margin: "auto",
|
|
2715
|
+
borderRadius: 12,
|
|
2716
|
+
zIndex: 1,
|
|
2717
|
+
variants: {
|
|
2718
|
+
initial: { opacity: 0, scale: 0.5 },
|
|
2719
|
+
animate: {
|
|
2720
|
+
opacity: 1,
|
|
2721
|
+
scale: 1,
|
|
2722
|
+
transition: {
|
|
2723
|
+
type: "spring",
|
|
2724
|
+
damping: 20,
|
|
2725
|
+
stiffness: 300
|
|
2726
|
+
}
|
|
2727
|
+
},
|
|
2728
|
+
exit: {
|
|
2729
|
+
opacity: 0,
|
|
2730
|
+
scale: 0.3,
|
|
2731
|
+
transition: { type: "spring", duration: 0.45 }
|
|
2732
|
+
}
|
|
2720
2733
|
}
|
|
2721
|
-
}
|
|
2722
|
-
|
|
2723
|
-
|
|
2724
|
-
|
|
2725
|
-
|
|
2726
|
-
|
|
2727
|
-
|
|
2728
|
-
|
|
2729
|
-
|
|
2730
|
-
|
|
2731
|
-
|
|
2732
|
-
|
|
2733
|
-
|
|
2734
|
-
|
|
2735
|
-
|
|
2736
|
-
|
|
2737
|
-
|
|
2738
|
-
|
|
2739
|
-
|
|
2740
|
-
|
|
2741
|
-
|
|
2742
|
-
|
|
2743
|
-
|
|
2744
|
-
|
|
2745
|
-
|
|
2746
|
-
|
|
2747
|
-
|
|
2748
|
-
|
|
2749
|
-
|
|
2750
|
-
|
|
2734
|
+
} : {
|
|
2735
|
+
w: "100vw",
|
|
2736
|
+
left: 0,
|
|
2737
|
+
right: 0,
|
|
2738
|
+
bottom: 0,
|
|
2739
|
+
borderTopLeftRadius: 12,
|
|
2740
|
+
borderTopRightRadius: 12,
|
|
2741
|
+
overflow: "hidden",
|
|
2742
|
+
// Note: Can't use framer-motion's `y` prop because it conflicts
|
|
2743
|
+
// with the drag motion value. Use CSS transform instead.
|
|
2744
|
+
variants: {
|
|
2745
|
+
initial: {
|
|
2746
|
+
transform: "translateY(100%)",
|
|
2747
|
+
opacity: 0.5
|
|
2748
|
+
},
|
|
2749
|
+
animate: {
|
|
2750
|
+
transform: "translateY(0%)",
|
|
2751
|
+
opacity: 1,
|
|
2752
|
+
transition: {
|
|
2753
|
+
type: "spring",
|
|
2754
|
+
damping: 22,
|
|
2755
|
+
stiffness: 400,
|
|
2756
|
+
mass: 0.7
|
|
2757
|
+
}
|
|
2758
|
+
},
|
|
2759
|
+
exit: {
|
|
2760
|
+
transform: "translateY(100%)",
|
|
2761
|
+
opacity: 0,
|
|
2762
|
+
transition: {
|
|
2763
|
+
type: "tween",
|
|
2764
|
+
duration: 0.2,
|
|
2765
|
+
ease: [0.4, 0, 1, 1]
|
|
2766
|
+
// ease-in for quick exit
|
|
2767
|
+
}
|
|
2768
|
+
}
|
|
2769
|
+
},
|
|
2770
|
+
drag: "y",
|
|
2771
|
+
style: { y },
|
|
2772
|
+
dragControls,
|
|
2773
|
+
onPointerDown: (e) => onDragStart(e),
|
|
2774
|
+
// drag={hasBackdrop ? "y" : false}
|
|
2775
|
+
dragElastic: 0,
|
|
2776
|
+
// prevent drawer from being dragged higher than what its opened to
|
|
2777
|
+
dragConstraints: { top: 0 },
|
|
2778
|
+
onDragEnd: (_, drag) => {
|
|
2779
|
+
if (props.drag === false) return;
|
|
2780
|
+
const pageHeight = document.documentElement.scrollHeight;
|
|
2781
|
+
const yCoord = drag.point.y;
|
|
2782
|
+
const velocity = drag.velocity.y;
|
|
2783
|
+
const releaseThreshold = 0.8;
|
|
2784
|
+
const releasePct = yCoord / pageHeight;
|
|
2785
|
+
if (velocity > 25 && releasePct >= releaseThreshold || velocity > 750) {
|
|
2786
|
+
props.onClose?.();
|
|
2787
|
+
}
|
|
2751
2788
|
}
|
|
2752
2789
|
},
|
|
2753
|
-
|
|
2754
|
-
|
|
2755
|
-
|
|
2756
|
-
|
|
2757
|
-
|
|
2758
|
-
|
|
2759
|
-
|
|
2760
|
-
|
|
2790
|
+
boxSizing: "border-box",
|
|
2791
|
+
boxShadow: "hsl(0deg 0% 0% / 60%) 0px -4px 20px",
|
|
2792
|
+
bg: { base: "neutral.100", _dark: "neutral.900" },
|
|
2793
|
+
color: "text-primary",
|
|
2794
|
+
ref,
|
|
2795
|
+
...rest,
|
|
2796
|
+
children: /* @__PURE__ */ jsxs(
|
|
2797
|
+
MotionDiv4,
|
|
2798
|
+
{
|
|
2799
|
+
grid: true,
|
|
2800
|
+
...isDesktop ? { position: "relative" } : { rows: "max-content 1fr" },
|
|
2801
|
+
children: [
|
|
2802
|
+
!isDesktop && props.hideHandle !== false && /* @__PURE__ */ jsx(
|
|
2803
|
+
MotionDiv4,
|
|
2804
|
+
{
|
|
2805
|
+
grid: true,
|
|
2806
|
+
justifySelf: "center",
|
|
2807
|
+
h: 6,
|
|
2808
|
+
w: 34,
|
|
2809
|
+
mt: "16px",
|
|
2810
|
+
mb: 4,
|
|
2811
|
+
br: 20,
|
|
2812
|
+
bg: { base: "neutral.400", _dark: "neutral.600" },
|
|
2813
|
+
cursor: props.drag ? "row-resize" : "default",
|
|
2814
|
+
ref: dragHandleRef
|
|
2815
|
+
}
|
|
2816
|
+
),
|
|
2817
|
+
props.children
|
|
2818
|
+
]
|
|
2761
2819
|
}
|
|
2762
|
-
|
|
2820
|
+
)
|
|
2763
2821
|
},
|
|
2764
|
-
|
|
2765
|
-
style: { y },
|
|
2766
|
-
dragControls,
|
|
2767
|
-
onPointerDown: (e) => onDragStart(e),
|
|
2768
|
-
// drag={hasBackdrop ? "y" : false}
|
|
2769
|
-
dragElastic: 0,
|
|
2770
|
-
// prevent drawer from being dragged higher than what its opened to
|
|
2771
|
-
dragConstraints: { top: 0 },
|
|
2772
|
-
onDragEnd: (_, drag) => {
|
|
2773
|
-
if (props.drag === false) return;
|
|
2774
|
-
const pageHeight = document.documentElement.scrollHeight;
|
|
2775
|
-
const yCoord = drag.point.y;
|
|
2776
|
-
const velocity = drag.velocity.y;
|
|
2777
|
-
const releaseThreshold = 0.8;
|
|
2778
|
-
const releasePct = yCoord / pageHeight;
|
|
2779
|
-
if (velocity > 25 && releasePct >= releaseThreshold || velocity > 750) {
|
|
2780
|
-
props.onClose?.();
|
|
2781
|
-
}
|
|
2782
|
-
}
|
|
2783
|
-
},
|
|
2784
|
-
boxSizing: "border-box",
|
|
2785
|
-
boxShadow: "hsl(0deg 0% 0% / 60%) 0px -4px 20px",
|
|
2786
|
-
bg: { base: "neutral.100", _dark: "neutral.900" },
|
|
2787
|
-
color: "text-primary",
|
|
2788
|
-
ref,
|
|
2789
|
-
...rest,
|
|
2790
|
-
children: /* @__PURE__ */ jsxs(
|
|
2791
|
-
MotionDiv4,
|
|
2792
|
-
{
|
|
2793
|
-
grid: true,
|
|
2794
|
-
...isDesktop ? { position: "relative" } : { rows: "max-content 1fr" },
|
|
2795
|
-
children: [
|
|
2796
|
-
!isDesktop && props.hideHandle !== false && /* @__PURE__ */ jsx(
|
|
2797
|
-
MotionDiv4,
|
|
2798
|
-
{
|
|
2799
|
-
grid: true,
|
|
2800
|
-
justifySelf: "center",
|
|
2801
|
-
h: 6,
|
|
2802
|
-
w: 34,
|
|
2803
|
-
mt: "16px",
|
|
2804
|
-
mb: 4,
|
|
2805
|
-
br: 20,
|
|
2806
|
-
bg: { base: "neutral.400", _dark: "neutral.600" },
|
|
2807
|
-
cursor: props.drag ? "row-resize" : "default",
|
|
2808
|
-
ref: dragHandleRef
|
|
2809
|
-
}
|
|
2810
|
-
),
|
|
2811
|
-
props.children
|
|
2812
|
-
]
|
|
2813
|
-
}
|
|
2822
|
+
"drawer"
|
|
2814
2823
|
)
|
|
2815
|
-
}
|
|
2816
|
-
"drawer"
|
|
2824
|
+
}
|
|
2817
2825
|
)
|
|
2818
2826
|
}
|
|
2819
|
-
)
|
|
2827
|
+
),
|
|
2820
2828
|
document.getElementById("portal")
|
|
2821
2829
|
);
|
|
2822
2830
|
}
|
|
2823
|
-
var DrawerContext =
|
|
2831
|
+
var DrawerContext = React3__default.createContext({
|
|
2824
2832
|
open: false,
|
|
2825
2833
|
setOpen: () => {
|
|
2826
2834
|
return;
|
|
2827
2835
|
}
|
|
2828
2836
|
});
|
|
2829
2837
|
function DrawerProvider(props) {
|
|
2830
|
-
const [open, setOpen] =
|
|
2838
|
+
const [open, setOpen] = React3__default.useState(false);
|
|
2831
2839
|
const value = { open, setOpen };
|
|
2832
2840
|
return /* @__PURE__ */ jsx(DrawerContext.Provider, { value, children: props.children });
|
|
2833
2841
|
}
|
|
2834
2842
|
function useDrawer() {
|
|
2835
|
-
const context2 =
|
|
2843
|
+
const context2 = React3__default.useContext(DrawerContext);
|
|
2836
2844
|
if (context2 === void 0) {
|
|
2837
2845
|
throw new Error("useDrawer must be used within a DrawerProvider");
|
|
2838
2846
|
}
|
|
@@ -2845,7 +2853,7 @@ function BtnGroup(props) {
|
|
|
2845
2853
|
const [isDesktop] = useMatchMedia(breakpoint);
|
|
2846
2854
|
const { children, ...rest } = props;
|
|
2847
2855
|
if (isDesktop) {
|
|
2848
|
-
return /* @__PURE__ */ jsx(MotionDiv4, { flex: true, alignI: true, gap: 4, ...rest, children:
|
|
2856
|
+
return /* @__PURE__ */ jsx(MotionDiv4, { flex: true, alignI: true, gap: 4, ...rest, children: React3__default.Children.toArray(children).toReversed() });
|
|
2849
2857
|
} else {
|
|
2850
2858
|
return /* @__PURE__ */ jsx(MotionDiv4, { grid: true, rowG: 14, ...props });
|
|
2851
2859
|
}
|
|
@@ -2898,7 +2906,7 @@ function CloseBtn(props) {
|
|
|
2898
2906
|
}
|
|
2899
2907
|
}
|
|
2900
2908
|
function Backdrop(props) {
|
|
2901
|
-
const allowOutsideClickRef =
|
|
2909
|
+
const allowOutsideClickRef = React3__default.useRef(true);
|
|
2902
2910
|
const [isDesktop] = useMatchMedia(breakpoint);
|
|
2903
2911
|
return /* @__PURE__ */ jsx(
|
|
2904
2912
|
MotionDiv4,
|
|
@@ -2929,11 +2937,11 @@ function Backdrop(props) {
|
|
|
2929
2937
|
}
|
|
2930
2938
|
function useMatchMedia(queries) {
|
|
2931
2939
|
const isClient = typeof window !== "undefined";
|
|
2932
|
-
const [value, setValue] =
|
|
2940
|
+
const [value, setValue] = React3__default.useState(() => {
|
|
2933
2941
|
if (!isClient) return queries.map(() => false);
|
|
2934
2942
|
return queries.map((q) => window.matchMedia(q).matches);
|
|
2935
2943
|
});
|
|
2936
|
-
|
|
2944
|
+
React3__default.useLayoutEffect(() => {
|
|
2937
2945
|
if (!isClient) return;
|
|
2938
2946
|
const mediaQueryLists = queries.map((q) => window.matchMedia(q));
|
|
2939
2947
|
const handler = () => {
|
|
@@ -2952,9 +2960,9 @@ var TrackBgNameKey = "TrackBg";
|
|
|
2952
2960
|
var TrackFillNameKey = "TrackFill";
|
|
2953
2961
|
function Progress(props) {
|
|
2954
2962
|
const { children, steps, value, max: maxProp, ...rest } = props;
|
|
2955
|
-
const [progress, setProgress] =
|
|
2963
|
+
const [progress, setProgress] = React3__default.useState(0);
|
|
2956
2964
|
const max = maxProp ?? 100;
|
|
2957
|
-
|
|
2965
|
+
React3__default.useEffect(() => {
|
|
2958
2966
|
setProgress(Math.min((value ?? 0) / max, 1) * 100);
|
|
2959
2967
|
}, [value, max]);
|
|
2960
2968
|
const width = `${progress}%`;
|
|
@@ -2994,7 +3002,7 @@ function Progress(props) {
|
|
|
2994
3002
|
TrackFillNameKey
|
|
2995
3003
|
);
|
|
2996
3004
|
const barHeight = rest.h ?? 8;
|
|
2997
|
-
const bgEl = trackBgChild ?
|
|
3005
|
+
const bgEl = trackBgChild ? React3__default.cloneElement(trackBgChild, {
|
|
2998
3006
|
gridArea: "1 / 1",
|
|
2999
3007
|
h: barHeight,
|
|
3000
3008
|
w: trackBgChild.props.w ?? true
|
|
@@ -3009,7 +3017,7 @@ function Progress(props) {
|
|
|
3009
3017
|
bg: { base: "neutral.200", _dark: "neutral.700" }
|
|
3010
3018
|
}
|
|
3011
3019
|
);
|
|
3012
|
-
const fillEl = trackFillChild ?
|
|
3020
|
+
const fillEl = trackFillChild ? React3__default.cloneElement(trackFillChild, {
|
|
3013
3021
|
gridArea: "1 / 1",
|
|
3014
3022
|
h: barHeight,
|
|
3015
3023
|
roundedLeft: 9999,
|
|
@@ -3083,9 +3091,9 @@ var MotionDiv6 = motionTags.div;
|
|
|
3083
3091
|
var TrackNameKey2 = "SliderTrack";
|
|
3084
3092
|
var FillNameKey = "SliderFill";
|
|
3085
3093
|
var ThumbNameKey2 = "SliderThumb";
|
|
3086
|
-
var SliderContext =
|
|
3094
|
+
var SliderContext = React3__default.createContext(null);
|
|
3087
3095
|
var useSliderContext = () => {
|
|
3088
|
-
const context2 =
|
|
3096
|
+
const context2 = React3__default.useContext(SliderContext);
|
|
3089
3097
|
if (!context2) {
|
|
3090
3098
|
throw new Error("Slider compound components must be used within Slider");
|
|
3091
3099
|
}
|
|
@@ -3105,15 +3113,15 @@ function Slider(props) {
|
|
|
3105
3113
|
...rest
|
|
3106
3114
|
} = props;
|
|
3107
3115
|
const isControlled = controlledValue !== void 0;
|
|
3108
|
-
const [internalValue, setInternalValue] =
|
|
3116
|
+
const [internalValue, setInternalValue] = React3__default.useState(defaultValue);
|
|
3109
3117
|
const value = isControlled ? controlledValue : internalValue;
|
|
3110
|
-
const [isDragging, setIsDragging] =
|
|
3111
|
-
const trackRef =
|
|
3118
|
+
const [isDragging, setIsDragging] = React3__default.useState(false);
|
|
3119
|
+
const trackRef = React3__default.useRef(null);
|
|
3112
3120
|
const percent = Math.min(
|
|
3113
3121
|
100,
|
|
3114
3122
|
Math.max(0, (value - min) / (max - min) * 100)
|
|
3115
3123
|
);
|
|
3116
|
-
const clampValue =
|
|
3124
|
+
const clampValue = React3__default.useCallback(
|
|
3117
3125
|
(rawValue) => {
|
|
3118
3126
|
let clamped = Math.max(min, Math.min(max, rawValue));
|
|
3119
3127
|
if (step !== void 0 && step > 0) {
|
|
@@ -3124,7 +3132,7 @@ function Slider(props) {
|
|
|
3124
3132
|
},
|
|
3125
3133
|
[min, max, step]
|
|
3126
3134
|
);
|
|
3127
|
-
const getValueFromClientX =
|
|
3135
|
+
const getValueFromClientX = React3__default.useCallback(
|
|
3128
3136
|
(clientX) => {
|
|
3129
3137
|
const track = trackRef.current;
|
|
3130
3138
|
if (!track) return value;
|
|
@@ -3136,7 +3144,7 @@ function Slider(props) {
|
|
|
3136
3144
|
},
|
|
3137
3145
|
[min, max, value, clampValue]
|
|
3138
3146
|
);
|
|
3139
|
-
const updateValue =
|
|
3147
|
+
const updateValue = React3__default.useCallback(
|
|
3140
3148
|
(newValue) => {
|
|
3141
3149
|
if (disabled) return;
|
|
3142
3150
|
if (!isControlled) {
|
|
@@ -3153,7 +3161,7 @@ function Slider(props) {
|
|
|
3153
3161
|
const newValue = getValueFromClientX(e.clientX);
|
|
3154
3162
|
updateValue(newValue);
|
|
3155
3163
|
};
|
|
3156
|
-
|
|
3164
|
+
React3__default.useEffect(() => {
|
|
3157
3165
|
if (!isDragging) return;
|
|
3158
3166
|
const controller = new AbortController();
|
|
3159
3167
|
const handleMove = (e) => {
|
|
@@ -3223,19 +3231,19 @@ function Slider(props) {
|
|
|
3223
3231
|
trackRef
|
|
3224
3232
|
};
|
|
3225
3233
|
const height = rest.h ?? 8;
|
|
3226
|
-
const trackEl = trackChild ?
|
|
3234
|
+
const trackEl = trackChild ? React3__default.cloneElement(trackChild, {
|
|
3227
3235
|
sliderPercent: percent,
|
|
3228
3236
|
sliderValue: value,
|
|
3229
3237
|
sliderMin: min,
|
|
3230
3238
|
sliderMax: max
|
|
3231
3239
|
}) : /* @__PURE__ */ jsx(SliderTrack, {});
|
|
3232
|
-
const fillEl = fillChild ?
|
|
3240
|
+
const fillEl = fillChild ? React3__default.cloneElement(fillChild, {
|
|
3233
3241
|
sliderPercent: percent,
|
|
3234
3242
|
sliderValue: value,
|
|
3235
3243
|
sliderMin: min,
|
|
3236
3244
|
sliderMax: max
|
|
3237
3245
|
}) : /* @__PURE__ */ jsx(SliderFill, {});
|
|
3238
|
-
const thumbEl = thumbChild ?
|
|
3246
|
+
const thumbEl = thumbChild ? React3__default.cloneElement(thumbChild, {
|
|
3239
3247
|
sliderPercent: percent,
|
|
3240
3248
|
sliderValue: value,
|
|
3241
3249
|
sliderMin: min,
|
|
@@ -3361,27 +3369,113 @@ function SliderThumb(props) {
|
|
|
3361
3369
|
}
|
|
3362
3370
|
SliderThumb.displayName = ThumbNameKey2;
|
|
3363
3371
|
var Base5 = base;
|
|
3364
|
-
var
|
|
3372
|
+
var Svg = motionTags.svg;
|
|
3373
|
+
var CheckboxBtn = motionTags.button;
|
|
3374
|
+
function Checkbox(props) {
|
|
3365
3375
|
const {
|
|
3366
3376
|
children,
|
|
3367
|
-
|
|
3368
|
-
|
|
3369
|
-
|
|
3370
|
-
onAnimationComplete,
|
|
3377
|
+
onClick: _onClick,
|
|
3378
|
+
onAnimationStart: _onAnimationStart,
|
|
3379
|
+
onAnimationComplete: _onAnimationComplete,
|
|
3371
3380
|
...rest
|
|
3372
3381
|
} = props;
|
|
3373
|
-
|
|
3382
|
+
const [checked, setChecked] = React3__default.useState(false);
|
|
3383
|
+
const [indeterminate, setIndeterminate] = React3__default.useState(false);
|
|
3384
|
+
React3__default.useEffect(() => {
|
|
3385
|
+
setChecked(!!rest.checked);
|
|
3386
|
+
}, [rest.checked]);
|
|
3387
|
+
React3__default.useEffect(() => {
|
|
3388
|
+
setIndeterminate(!!rest.indeterminate);
|
|
3389
|
+
}, [rest.indeterminate]);
|
|
3390
|
+
const isIndeterminate = typeof rest.indeterminate === "boolean";
|
|
3391
|
+
const checkboxSelector = rest._checkbox;
|
|
3392
|
+
const hasCheckboxBg = checkboxSelector && hasAnyProp(checkboxSelector, ["bg", "background", "backgroundColor"]);
|
|
3393
|
+
const checkedSelector = rest._checked;
|
|
3394
|
+
const hasCheckedBg = checkedSelector && hasAnyProp(checkedSelector, ["bg", "background", "backgroundColor"]);
|
|
3395
|
+
return /* @__PURE__ */ jsxs(
|
|
3374
3396
|
Base5,
|
|
3375
3397
|
{
|
|
3376
|
-
|
|
3377
|
-
|
|
3378
|
-
|
|
3379
|
-
|
|
3398
|
+
...!hasAnyProp(rest, ["grid", "flex", "display"]) && {
|
|
3399
|
+
alignI: true,
|
|
3400
|
+
flex: true
|
|
3401
|
+
},
|
|
3402
|
+
gap: 2,
|
|
3403
|
+
cursor: "pointer",
|
|
3404
|
+
userSelect: "none",
|
|
3380
3405
|
...rest,
|
|
3381
|
-
|
|
3406
|
+
onClick: () => rest.onChecked?.(!rest.checked),
|
|
3407
|
+
children: [
|
|
3408
|
+
/* @__PURE__ */ jsx(
|
|
3409
|
+
CheckboxBtn,
|
|
3410
|
+
{
|
|
3411
|
+
"data-checkbox": true,
|
|
3412
|
+
...checked && { "data-checked": checked },
|
|
3413
|
+
w: "24px",
|
|
3414
|
+
p: 1,
|
|
3415
|
+
br: 6,
|
|
3416
|
+
cursor: "pointer",
|
|
3417
|
+
boxSizing: "border-box",
|
|
3418
|
+
outline: "none !important",
|
|
3419
|
+
...!hasCheckboxBg && {
|
|
3420
|
+
bg: { base: "neutral.200", _dark: "neutral.700" }
|
|
3421
|
+
},
|
|
3422
|
+
...!hasCheckedBg && {
|
|
3423
|
+
_checked: { bg: "blue.500", transition: ".14s background ease-out" }
|
|
3424
|
+
},
|
|
3425
|
+
_active: { scale: 0.9 },
|
|
3426
|
+
color: "neutral.100",
|
|
3427
|
+
transition: ".14s background ease-out .1s",
|
|
3428
|
+
_focus: { boxShadow: "0 0 0 6px hsl(0 0% 100% / 0.05)" },
|
|
3429
|
+
children: /* @__PURE__ */ jsx(
|
|
3430
|
+
Svg,
|
|
3431
|
+
{
|
|
3432
|
+
fill: "none",
|
|
3433
|
+
width: "100%",
|
|
3434
|
+
viewBox: "0 0 24 24",
|
|
3435
|
+
stroke: "currentColor",
|
|
3436
|
+
strokeWidth: 4,
|
|
3437
|
+
children: /* @__PURE__ */ jsxs(AnimatePresence, { mode: "wait", children: [
|
|
3438
|
+
isIndeterminate && indeterminate && /* @__PURE__ */ jsx(
|
|
3439
|
+
motion.path,
|
|
3440
|
+
{
|
|
3441
|
+
initial: { scaleX: 0 },
|
|
3442
|
+
animate: { scaleX: 1 },
|
|
3443
|
+
exit: { scaleX: 0 },
|
|
3444
|
+
transition: {
|
|
3445
|
+
type: "tween",
|
|
3446
|
+
ease: "easeOut",
|
|
3447
|
+
duration: 0.3,
|
|
3448
|
+
delay: 0.2
|
|
3449
|
+
},
|
|
3450
|
+
strokeLinecap: "round",
|
|
3451
|
+
d: "M6 12 L18 12"
|
|
3452
|
+
},
|
|
3453
|
+
"indeterminate"
|
|
3454
|
+
),
|
|
3455
|
+
!indeterminate && checked && /* @__PURE__ */ jsx(
|
|
3456
|
+
motion.path,
|
|
3457
|
+
{
|
|
3458
|
+
initial: { pathLength: 0 },
|
|
3459
|
+
animate: { pathLength: 1 },
|
|
3460
|
+
exit: { pathLength: 0 },
|
|
3461
|
+
transition: { type: "tween", ease: "easeOut", duration: 0.2 },
|
|
3462
|
+
strokeLinecap: "round",
|
|
3463
|
+
strokeLinejoin: "round",
|
|
3464
|
+
d: "M5 13l4 4L19 7"
|
|
3465
|
+
},
|
|
3466
|
+
"check"
|
|
3467
|
+
)
|
|
3468
|
+
] })
|
|
3469
|
+
}
|
|
3470
|
+
)
|
|
3471
|
+
}
|
|
3472
|
+
),
|
|
3473
|
+
children
|
|
3474
|
+
]
|
|
3382
3475
|
}
|
|
3383
3476
|
);
|
|
3384
|
-
}
|
|
3477
|
+
}
|
|
3478
|
+
var Base6 = base;
|
|
3385
3479
|
function Tooltip(props) {
|
|
3386
3480
|
const {
|
|
3387
3481
|
children,
|
|
@@ -3395,9 +3489,15 @@ function Tooltip(props) {
|
|
|
3395
3489
|
delay = 80,
|
|
3396
3490
|
className
|
|
3397
3491
|
} = props;
|
|
3398
|
-
const referenceRef =
|
|
3399
|
-
const arrowRef =
|
|
3400
|
-
const
|
|
3492
|
+
const referenceRef = React3__default.useRef(null);
|
|
3493
|
+
const arrowRef = React3__default.useRef(null);
|
|
3494
|
+
const closeTimerRef = React3__default.useRef(
|
|
3495
|
+
null
|
|
3496
|
+
);
|
|
3497
|
+
const containerRef = React3__default.useRef(null);
|
|
3498
|
+
const [open, setOpen] = React3__default.useState(false);
|
|
3499
|
+
const [isMounted, setIsMounted] = React3__default.useState(false);
|
|
3500
|
+
const [containerBg, setContainerBg] = React3__default.useState();
|
|
3401
3501
|
const { x, y, refs, strategy, middlewareData, context: context2 } = useFloating({
|
|
3402
3502
|
open,
|
|
3403
3503
|
onOpenChange: setOpen,
|
|
@@ -3406,6 +3506,7 @@ function Tooltip(props) {
|
|
|
3406
3506
|
offset(offsetVal),
|
|
3407
3507
|
flip(),
|
|
3408
3508
|
shift({ padding: 6 }),
|
|
3509
|
+
// eslint-disable-next-line react-hooks/refs -- arrowRef is passed as object, not read during render
|
|
3409
3510
|
arrow({ element: arrowRef })
|
|
3410
3511
|
],
|
|
3411
3512
|
whileElementsMounted: autoUpdate,
|
|
@@ -3426,7 +3527,27 @@ function Tooltip(props) {
|
|
|
3426
3527
|
role
|
|
3427
3528
|
]);
|
|
3428
3529
|
const referenceProps = getReferenceProps({});
|
|
3429
|
-
|
|
3530
|
+
React3__default.useEffect(() => {
|
|
3531
|
+
if (closeTimerRef.current) {
|
|
3532
|
+
clearTimeout(closeTimerRef.current);
|
|
3533
|
+
closeTimerRef.current = null;
|
|
3534
|
+
}
|
|
3535
|
+
if (open) {
|
|
3536
|
+
setIsMounted(true);
|
|
3537
|
+
} else {
|
|
3538
|
+
closeTimerRef.current = setTimeout(() => {
|
|
3539
|
+
setIsMounted(false);
|
|
3540
|
+
closeTimerRef.current = null;
|
|
3541
|
+
}, 160);
|
|
3542
|
+
}
|
|
3543
|
+
return () => {
|
|
3544
|
+
if (closeTimerRef.current) {
|
|
3545
|
+
clearTimeout(closeTimerRef.current);
|
|
3546
|
+
closeTimerRef.current = null;
|
|
3547
|
+
}
|
|
3548
|
+
};
|
|
3549
|
+
}, [open]);
|
|
3550
|
+
React3__default.useEffect(() => {
|
|
3430
3551
|
if (!follow || !referenceRef.current) return;
|
|
3431
3552
|
const el = referenceRef.current;
|
|
3432
3553
|
const onMove = (e) => {
|
|
@@ -3441,6 +3562,21 @@ function Tooltip(props) {
|
|
|
3441
3562
|
el.removeEventListener("pointermove", onMove);
|
|
3442
3563
|
};
|
|
3443
3564
|
}, [follow, refs]);
|
|
3565
|
+
React3__default.useEffect(() => {
|
|
3566
|
+
if (!(open || isMounted)) return;
|
|
3567
|
+
const el = containerRef.current;
|
|
3568
|
+
if (!el) return;
|
|
3569
|
+
try {
|
|
3570
|
+
const cs = getComputedStyle(el);
|
|
3571
|
+
const bg = cs.backgroundColor;
|
|
3572
|
+
if (bg && bg !== "transparent" && bg !== "rgba(0, 0, 0, 0)") {
|
|
3573
|
+
setContainerBg(bg);
|
|
3574
|
+
} else {
|
|
3575
|
+
setContainerBg("rgba(20,20,20,0.95)");
|
|
3576
|
+
}
|
|
3577
|
+
} catch {
|
|
3578
|
+
}
|
|
3579
|
+
}, [open, isMounted]);
|
|
3444
3580
|
const arrowX = middlewareData?.arrow?.x ?? 0;
|
|
3445
3581
|
const arrowY = middlewareData?.arrow?.y ?? 0;
|
|
3446
3582
|
const side = context2.placement || "top";
|
|
@@ -3449,14 +3585,14 @@ function Tooltip(props) {
|
|
|
3449
3585
|
const arrowAnchorStyle = side.startsWith("top") ? { bottom: -anchorOffset } : side.startsWith("bottom") ? { top: -anchorOffset } : side.startsWith("left") ? { right: -anchorOffset } : { left: -anchorOffset };
|
|
3450
3586
|
const arrowStyle = side.startsWith("top") || side.startsWith("bottom") ? { left: arrowX || void 0, ...arrowAnchorStyle } : { top: arrowY || void 0, ...arrowAnchorStyle };
|
|
3451
3587
|
const transformOrigin = side.startsWith("top") ? "center bottom" : side.startsWith("bottom") ? "center top" : side.startsWith("left") ? "right center" : side.startsWith("right") ? "left center" : "center";
|
|
3452
|
-
const childrenArray =
|
|
3588
|
+
const childrenArray = React3__default.Children.toArray(children);
|
|
3453
3589
|
const hasMultipleChildren = childrenArray.length > 1;
|
|
3454
3590
|
let child;
|
|
3455
3591
|
if (hasMultipleChildren) {
|
|
3456
3592
|
child = /* @__PURE__ */ jsx("div", { style: { display: "inline-block" }, children });
|
|
3457
3593
|
} else {
|
|
3458
|
-
const only =
|
|
3459
|
-
const isDomElement =
|
|
3594
|
+
const only = React3__default.Children.only(children);
|
|
3595
|
+
const isDomElement = React3__default.isValidElement(only) && typeof only.type === "string";
|
|
3460
3596
|
child = isDomElement ? only : (
|
|
3461
3597
|
// Ensure the wrapper reliably captures mouseenter/pointerenter and can contain block elements
|
|
3462
3598
|
/* @__PURE__ */ jsx("div", { style: { display: "inline-block" }, children: only })
|
|
@@ -3469,80 +3605,43 @@ function Tooltip(props) {
|
|
|
3469
3605
|
}
|
|
3470
3606
|
const childWithRef = child;
|
|
3471
3607
|
const originalRef = childWithRef?.ref;
|
|
3472
|
-
if (typeof originalRef === "function")
|
|
3473
|
-
|
|
3608
|
+
if (typeof originalRef === "function") {
|
|
3609
|
+
originalRef(node);
|
|
3610
|
+
} else if (originalRef && "current" in originalRef) {
|
|
3474
3611
|
originalRef.current = node;
|
|
3612
|
+
}
|
|
3475
3613
|
};
|
|
3476
|
-
const
|
|
3477
|
-
const cloned = React13__default.cloneElement(
|
|
3614
|
+
const cloned = React3__default.cloneElement(
|
|
3478
3615
|
child,
|
|
3616
|
+
// eslint-disable-next-line react-hooks/refs -- ref callback is invoked after render, not during
|
|
3479
3617
|
{
|
|
3480
|
-
...
|
|
3618
|
+
...referenceProps,
|
|
3481
3619
|
ref: mergedRef,
|
|
3482
3620
|
"data-tooltip-ref": true
|
|
3483
3621
|
}
|
|
3484
3622
|
);
|
|
3485
3623
|
if (disabled) return /* @__PURE__ */ jsx(Fragment, { children: cloned });
|
|
3486
|
-
const [isMounted, setIsMounted] = React13__default.useState(false);
|
|
3487
|
-
const closeTimerRef = React13__default.useRef(
|
|
3488
|
-
null
|
|
3489
|
-
);
|
|
3490
|
-
React13__default.useEffect(() => {
|
|
3491
|
-
if (closeTimerRef.current) {
|
|
3492
|
-
clearTimeout(closeTimerRef.current);
|
|
3493
|
-
closeTimerRef.current = null;
|
|
3494
|
-
}
|
|
3495
|
-
if (open) {
|
|
3496
|
-
setIsMounted(true);
|
|
3497
|
-
} else {
|
|
3498
|
-
closeTimerRef.current = setTimeout(() => {
|
|
3499
|
-
setIsMounted(false);
|
|
3500
|
-
closeTimerRef.current = null;
|
|
3501
|
-
}, 160);
|
|
3502
|
-
}
|
|
3503
|
-
return () => {
|
|
3504
|
-
if (closeTimerRef.current) {
|
|
3505
|
-
clearTimeout(closeTimerRef.current);
|
|
3506
|
-
closeTimerRef.current = null;
|
|
3507
|
-
}
|
|
3508
|
-
};
|
|
3509
|
-
}, [open]);
|
|
3510
3624
|
let arrowEl = null;
|
|
3511
3625
|
let floatingNode = null;
|
|
3512
3626
|
const findRoleTooltipElement = (node) => {
|
|
3513
|
-
if (!
|
|
3627
|
+
if (!React3__default.isValidElement(node)) return null;
|
|
3514
3628
|
const el = node;
|
|
3515
3629
|
if (el.props?.role === "tooltip") return el;
|
|
3516
3630
|
const kids = el.props?.children;
|
|
3517
3631
|
if (!kids) return null;
|
|
3518
|
-
const arr =
|
|
3632
|
+
const arr = React3__default.Children.toArray(kids);
|
|
3519
3633
|
for (const c of arr) {
|
|
3520
|
-
if (
|
|
3521
|
-
|
|
3634
|
+
if (React3__default.isValidElement(c)) {
|
|
3635
|
+
const childEl = c;
|
|
3636
|
+
if (childEl.props?.role === "tooltip") {
|
|
3637
|
+
return childEl;
|
|
3638
|
+
}
|
|
3522
3639
|
}
|
|
3523
3640
|
}
|
|
3524
3641
|
return null;
|
|
3525
3642
|
};
|
|
3526
|
-
const
|
|
3527
|
-
|
|
3528
|
-
const containerRef = React13__default.useRef(null);
|
|
3529
|
-
const [containerBg, setContainerBg] = React13__default.useState();
|
|
3530
|
-
React13__default.useEffect(() => {
|
|
3531
|
-
if (!(open || isMounted)) return;
|
|
3532
|
-
const el = containerRef.current;
|
|
3533
|
-
if (!el) return;
|
|
3534
|
-
try {
|
|
3535
|
-
const cs = getComputedStyle(el);
|
|
3536
|
-
const bg = cs.backgroundColor;
|
|
3537
|
-
if (bg && bg !== "transparent" && bg !== "rgba(0, 0, 0, 0)") {
|
|
3538
|
-
setContainerBg(bg);
|
|
3539
|
-
} else {
|
|
3540
|
-
setContainerBg("rgba(20,20,20,0.95)");
|
|
3541
|
-
}
|
|
3542
|
-
} catch {
|
|
3543
|
-
}
|
|
3544
|
-
}, [open, isMounted, isCustomTooltip]);
|
|
3545
|
-
if (isCustomTooltip) {
|
|
3643
|
+
const customEl = findRoleTooltipElement(content);
|
|
3644
|
+
if (customEl) {
|
|
3546
3645
|
const el = customEl;
|
|
3547
3646
|
const childProps = el.props || {};
|
|
3548
3647
|
const floatingProps = getFloatingProps({});
|
|
@@ -3575,17 +3674,19 @@ function Tooltip(props) {
|
|
|
3575
3674
|
...childProps,
|
|
3576
3675
|
...floatingProps});
|
|
3577
3676
|
Object.keys(floatingProps).forEach((key) => {
|
|
3578
|
-
|
|
3579
|
-
|
|
3677
|
+
const floatingValue = floatingProps[key];
|
|
3678
|
+
if (key.startsWith("on") && typeof floatingValue === "function") {
|
|
3580
3679
|
childProps[key];
|
|
3581
3680
|
}
|
|
3582
3681
|
});
|
|
3583
3682
|
const originalRef = el.ref;
|
|
3584
3683
|
const mergedFloatingRef = (node) => {
|
|
3585
3684
|
refs.setFloating(node);
|
|
3586
|
-
if (typeof originalRef === "function")
|
|
3587
|
-
|
|
3685
|
+
if (typeof originalRef === "function") {
|
|
3686
|
+
originalRef(node);
|
|
3687
|
+
} else if (originalRef && "current" in originalRef) {
|
|
3588
3688
|
originalRef.current = node;
|
|
3689
|
+
}
|
|
3589
3690
|
};
|
|
3590
3691
|
arrowEl = showArrow ? /* @__PURE__ */ jsx(
|
|
3591
3692
|
"div",
|
|
@@ -3631,12 +3732,15 @@ function Tooltip(props) {
|
|
|
3631
3732
|
const originalChildRef = el.ref;
|
|
3632
3733
|
const mergedChildRef = (node) => {
|
|
3633
3734
|
containerRef.current = node;
|
|
3634
|
-
if (typeof originalChildRef === "function")
|
|
3635
|
-
|
|
3735
|
+
if (typeof originalChildRef === "function") {
|
|
3736
|
+
originalChildRef(node);
|
|
3737
|
+
} else if (originalChildRef && "current" in originalChildRef) {
|
|
3636
3738
|
originalChildRef.current = node;
|
|
3739
|
+
}
|
|
3637
3740
|
};
|
|
3638
|
-
return
|
|
3741
|
+
return React3__default.cloneElement(
|
|
3639
3742
|
el,
|
|
3743
|
+
// eslint-disable-next-line react-hooks/refs -- ref callback is invoked after render, not during
|
|
3640
3744
|
{
|
|
3641
3745
|
// Spread childProps first
|
|
3642
3746
|
...childProps,
|
|
@@ -3699,7 +3803,7 @@ function Tooltip(props) {
|
|
|
3699
3803
|
transition: { type: "spring", stiffness: 520, damping: 34 },
|
|
3700
3804
|
children: [
|
|
3701
3805
|
/* @__PURE__ */ jsx(
|
|
3702
|
-
|
|
3806
|
+
Base6,
|
|
3703
3807
|
{
|
|
3704
3808
|
role: "tooltip",
|
|
3705
3809
|
style: { position: "relative" },
|
|
@@ -3707,9 +3811,9 @@ function Tooltip(props) {
|
|
|
3707
3811
|
color: "white",
|
|
3708
3812
|
px: "10px",
|
|
3709
3813
|
py: "8px",
|
|
3814
|
+
fontSize: 13,
|
|
3710
3815
|
borderRadius: 6,
|
|
3711
3816
|
boxShadow: "0 6px 18px rgba(0,0,0,0.18)",
|
|
3712
|
-
fontSize: 13,
|
|
3713
3817
|
ref: containerRef,
|
|
3714
3818
|
children: content
|
|
3715
3819
|
}
|
|
@@ -3727,113 +3831,6 @@ function Tooltip(props) {
|
|
|
3727
3831
|
)
|
|
3728
3832
|
] });
|
|
3729
3833
|
}
|
|
3730
|
-
var Base6 = base;
|
|
3731
|
-
var Svg = motionTags.svg;
|
|
3732
|
-
var CheckboxBtn = motionTags.button;
|
|
3733
|
-
function Checkbox(props) {
|
|
3734
|
-
const {
|
|
3735
|
-
children,
|
|
3736
|
-
onClick: _onClick,
|
|
3737
|
-
onAnimationStart: _onAnimationStart,
|
|
3738
|
-
onAnimationComplete: _onAnimationComplete,
|
|
3739
|
-
...rest
|
|
3740
|
-
} = props;
|
|
3741
|
-
const [checked, setChecked] = React13__default.useState(false);
|
|
3742
|
-
const [indeterminate, setIndeterminate] = React13__default.useState(false);
|
|
3743
|
-
React13__default.useEffect(() => {
|
|
3744
|
-
setChecked(!!rest.checked);
|
|
3745
|
-
}, [rest.checked]);
|
|
3746
|
-
React13__default.useEffect(() => {
|
|
3747
|
-
setIndeterminate(!!rest.indeterminate);
|
|
3748
|
-
}, [rest.indeterminate]);
|
|
3749
|
-
const isIndeterminate = typeof rest.indeterminate === "boolean";
|
|
3750
|
-
const checkboxSelector = rest._checkbox;
|
|
3751
|
-
const hasCheckboxBg = checkboxSelector && hasAnyProp(checkboxSelector, ["bg", "background", "backgroundColor"]);
|
|
3752
|
-
const checkedSelector = rest._checked;
|
|
3753
|
-
const hasCheckedBg = checkedSelector && hasAnyProp(checkedSelector, ["bg", "background", "backgroundColor"]);
|
|
3754
|
-
return /* @__PURE__ */ jsxs(
|
|
3755
|
-
Base6,
|
|
3756
|
-
{
|
|
3757
|
-
...!hasAnyProp(rest, ["grid", "flex", "display"]) && {
|
|
3758
|
-
alignI: true,
|
|
3759
|
-
flex: true
|
|
3760
|
-
},
|
|
3761
|
-
gap: 2,
|
|
3762
|
-
cursor: "pointer",
|
|
3763
|
-
userSelect: "none",
|
|
3764
|
-
...rest,
|
|
3765
|
-
onClick: () => rest.onChecked?.(!rest.checked),
|
|
3766
|
-
children: [
|
|
3767
|
-
/* @__PURE__ */ jsx(
|
|
3768
|
-
CheckboxBtn,
|
|
3769
|
-
{
|
|
3770
|
-
"data-checkbox": true,
|
|
3771
|
-
...checked && { "data-checked": checked },
|
|
3772
|
-
w: "24px",
|
|
3773
|
-
p: 1,
|
|
3774
|
-
br: 6,
|
|
3775
|
-
cursor: "pointer",
|
|
3776
|
-
boxSizing: "border-box",
|
|
3777
|
-
outline: "none !important",
|
|
3778
|
-
...!hasCheckboxBg && {
|
|
3779
|
-
bg: { base: "neutral.200", _dark: "neutral.700" }
|
|
3780
|
-
},
|
|
3781
|
-
...!hasCheckedBg && {
|
|
3782
|
-
_checked: { bg: "blue.500", transition: ".14s background ease-out" }
|
|
3783
|
-
},
|
|
3784
|
-
_active: { scale: 0.9 },
|
|
3785
|
-
color: "neutral.100",
|
|
3786
|
-
transition: ".14s background ease-out .1s",
|
|
3787
|
-
_focus: { boxShadow: "0 0 0 6px hsl(0 0% 100% / 0.05)" },
|
|
3788
|
-
children: /* @__PURE__ */ jsx(
|
|
3789
|
-
Svg,
|
|
3790
|
-
{
|
|
3791
|
-
fill: "none",
|
|
3792
|
-
width: "100%",
|
|
3793
|
-
viewBox: "0 0 24 24",
|
|
3794
|
-
stroke: "currentColor",
|
|
3795
|
-
strokeWidth: 4,
|
|
3796
|
-
children: /* @__PURE__ */ jsxs(AnimatePresence, { mode: "wait", children: [
|
|
3797
|
-
isIndeterminate && indeterminate && /* @__PURE__ */ jsx(
|
|
3798
|
-
motion.path,
|
|
3799
|
-
{
|
|
3800
|
-
initial: { scaleX: 0 },
|
|
3801
|
-
animate: { scaleX: 1 },
|
|
3802
|
-
exit: { scaleX: 0 },
|
|
3803
|
-
transition: {
|
|
3804
|
-
type: "tween",
|
|
3805
|
-
ease: "easeOut",
|
|
3806
|
-
duration: 0.3,
|
|
3807
|
-
delay: 0.2
|
|
3808
|
-
},
|
|
3809
|
-
strokeLinecap: "round",
|
|
3810
|
-
d: "M6 12 L18 12"
|
|
3811
|
-
},
|
|
3812
|
-
"indeterminate"
|
|
3813
|
-
),
|
|
3814
|
-
!indeterminate && checked && /* @__PURE__ */ jsx(
|
|
3815
|
-
motion.path,
|
|
3816
|
-
{
|
|
3817
|
-
initial: { pathLength: 0 },
|
|
3818
|
-
animate: { pathLength: 1 },
|
|
3819
|
-
exit: { pathLength: 0 },
|
|
3820
|
-
transition: { type: "tween", ease: "easeOut", duration: 0.2 },
|
|
3821
|
-
strokeLinecap: "round",
|
|
3822
|
-
strokeLinejoin: "round",
|
|
3823
|
-
d: "M5 13l4 4L19 7"
|
|
3824
|
-
},
|
|
3825
|
-
"check"
|
|
3826
|
-
)
|
|
3827
|
-
] })
|
|
3828
|
-
}
|
|
3829
|
-
)
|
|
3830
|
-
}
|
|
3831
|
-
),
|
|
3832
|
-
children
|
|
3833
|
-
]
|
|
3834
|
-
}
|
|
3835
|
-
);
|
|
3836
|
-
}
|
|
3837
3834
|
var Hr = motionTags.hr;
|
|
3838
3835
|
var Skeleton = motionTags.div;
|
|
3839
3836
|
function Block(props) {
|
|
@@ -3845,7 +3842,7 @@ function Block(props) {
|
|
|
3845
3842
|
tooltip,
|
|
3846
3843
|
...rest
|
|
3847
3844
|
} = anyProps;
|
|
3848
|
-
const fileInputRef =
|
|
3845
|
+
const fileInputRef = React3.useRef(null);
|
|
3849
3846
|
const isLoading = anyProps.isLoading;
|
|
3850
3847
|
const multiple = anyProps.multiple;
|
|
3851
3848
|
const is = anyProps.is;
|
|
@@ -3882,7 +3879,7 @@ function Block(props) {
|
|
|
3882
3879
|
...anyProps
|
|
3883
3880
|
}
|
|
3884
3881
|
) : extract.filepickerAllowed ? /* @__PURE__ */ jsxs("div", { onClick: () => fileInputRef.current?.click(), children: [
|
|
3885
|
-
|
|
3882
|
+
React3.createElement(
|
|
3886
3883
|
Comp,
|
|
3887
3884
|
{
|
|
3888
3885
|
cursor: "pointer",
|
|
@@ -3917,11 +3914,11 @@ function Block(props) {
|
|
|
3917
3914
|
value: ""
|
|
3918
3915
|
}
|
|
3919
3916
|
)
|
|
3920
|
-
] }) : extract.isVoidElement ?
|
|
3917
|
+
] }) : extract.isVoidElement ? React3.createElement(Comp, {
|
|
3921
3918
|
...isLoading && { "data-loading": isLoading },
|
|
3922
3919
|
onContextMenu: (e) => e.preventDefault(),
|
|
3923
3920
|
...initialStyles
|
|
3924
|
-
}) :
|
|
3921
|
+
}) : React3.createElement(
|
|
3925
3922
|
Comp,
|
|
3926
3923
|
{
|
|
3927
3924
|
...isLoading && { "data-loading": isLoading },
|
|
@@ -3946,13 +3943,9 @@ function Block(props) {
|
|
|
3946
3943
|
return component;
|
|
3947
3944
|
}
|
|
3948
3945
|
}
|
|
3949
|
-
var TaggedTooltipContainer = Object.assign(TooltipContainer, {
|
|
3950
|
-
isBlockTooltipContainer: true
|
|
3951
|
-
});
|
|
3952
3946
|
var TaggedMenuContainer = Object.assign(MenuContainer, {
|
|
3953
3947
|
isBlockMenuContainer: true
|
|
3954
3948
|
});
|
|
3955
|
-
var TooltipNamespace = { Container: TaggedTooltipContainer };
|
|
3956
3949
|
var MenuNamespace = { Container: TaggedMenuContainer };
|
|
3957
3950
|
var InputNamespace = {
|
|
3958
3951
|
Label: Label2,
|
|
@@ -3987,7 +3980,6 @@ var CompoundBlock = Object.assign(Block, {
|
|
|
3987
3980
|
Progress: ProgressNamespace,
|
|
3988
3981
|
Slider: SliderNamespace,
|
|
3989
3982
|
Textarea: TextareaNamespace,
|
|
3990
|
-
Tooltip: TooltipNamespace,
|
|
3991
3983
|
Switch: SwitchNamespace,
|
|
3992
3984
|
Drawer: DrawerNamespace,
|
|
3993
3985
|
Menu: MenuNamespace,
|
|
@@ -4026,22 +4018,22 @@ var saveTheme = (theme) => {
|
|
|
4026
4018
|
}
|
|
4027
4019
|
};
|
|
4028
4020
|
function useTheme() {
|
|
4029
|
-
const [value, setValue] =
|
|
4021
|
+
const [value, setValue] = React3__default.useState(() => {
|
|
4030
4022
|
return getDomTheme() ?? getStoredTheme() ?? "light";
|
|
4031
4023
|
});
|
|
4032
|
-
const valueRef =
|
|
4033
|
-
const isInternalRef =
|
|
4034
|
-
|
|
4024
|
+
const valueRef = React3__default.useRef(value);
|
|
4025
|
+
const isInternalRef = React3__default.useRef(false);
|
|
4026
|
+
React3__default.useEffect(() => {
|
|
4035
4027
|
valueRef.current = value;
|
|
4036
4028
|
}, [value]);
|
|
4037
|
-
|
|
4029
|
+
React3__default.useLayoutEffect(() => {
|
|
4038
4030
|
const domTheme = getDomTheme();
|
|
4039
4031
|
if (domTheme && domTheme !== valueRef.current) {
|
|
4040
4032
|
valueRef.current = domTheme;
|
|
4041
4033
|
setValue(domTheme);
|
|
4042
4034
|
}
|
|
4043
4035
|
}, []);
|
|
4044
|
-
|
|
4036
|
+
React3__default.useEffect(() => {
|
|
4045
4037
|
const ac = new AbortController();
|
|
4046
4038
|
window.addEventListener(
|
|
4047
4039
|
"storage",
|
|
@@ -4073,7 +4065,7 @@ function useTheme() {
|
|
|
4073
4065
|
);
|
|
4074
4066
|
return () => ac.abort();
|
|
4075
4067
|
}, []);
|
|
4076
|
-
const toggle =
|
|
4068
|
+
const toggle = React3__default.useCallback((theme) => {
|
|
4077
4069
|
const next = theme ?? (valueRef.current === "light" ? "dark" : "light");
|
|
4078
4070
|
valueRef.current = next;
|
|
4079
4071
|
setValue(next);
|
|
@@ -4086,8 +4078,8 @@ function useTheme() {
|
|
|
4086
4078
|
|
|
4087
4079
|
// src/react/index.ts
|
|
4088
4080
|
function useDebounce(value, delay = 500) {
|
|
4089
|
-
const [debouncedValue, setDebouncedValue] =
|
|
4090
|
-
|
|
4081
|
+
const [debouncedValue, setDebouncedValue] = React3__default.useState(value);
|
|
4082
|
+
React3__default.useEffect(() => {
|
|
4091
4083
|
const handler = setTimeout(() => {
|
|
4092
4084
|
setDebouncedValue(value);
|
|
4093
4085
|
}, delay);
|
|
@@ -4098,10 +4090,10 @@ function useDebounce(value, delay = 500) {
|
|
|
4098
4090
|
return debouncedValue;
|
|
4099
4091
|
}
|
|
4100
4092
|
function useThrottle(value, interval = 500) {
|
|
4101
|
-
const [throttledValue, setThrottledValue] =
|
|
4102
|
-
const lastUpdate =
|
|
4103
|
-
const timeoutRef =
|
|
4104
|
-
|
|
4093
|
+
const [throttledValue, setThrottledValue] = React3__default.useState(value);
|
|
4094
|
+
const lastUpdate = React3__default.useRef(0);
|
|
4095
|
+
const timeoutRef = React3__default.useRef(null);
|
|
4096
|
+
React3__default.useEffect(() => {
|
|
4105
4097
|
const now = Date.now();
|
|
4106
4098
|
const timeSinceLastUpdate = now - lastUpdate.current;
|
|
4107
4099
|
if (timeSinceLastUpdate >= interval) {
|
|
@@ -4127,11 +4119,11 @@ function useThrottle(value, interval = 500) {
|
|
|
4127
4119
|
function useMatchMedia2(queries, defaultValues = []) {
|
|
4128
4120
|
const initialValues = defaultValues.length ? defaultValues : Array(queries.length).fill(false);
|
|
4129
4121
|
const isClient = typeof window !== "undefined";
|
|
4130
|
-
const [value, setValue] =
|
|
4122
|
+
const [value, setValue] = React3__default.useState(() => {
|
|
4131
4123
|
if (!isClient) return initialValues;
|
|
4132
4124
|
return queries.map((q) => window.matchMedia(q).matches);
|
|
4133
4125
|
});
|
|
4134
|
-
|
|
4126
|
+
React3__default.useLayoutEffect(() => {
|
|
4135
4127
|
if (!isClient) return;
|
|
4136
4128
|
const mediaQueryLists = queries.map((q) => window.matchMedia(q));
|
|
4137
4129
|
const handler = () => {
|