qstd 0.3.45 → 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/tooltip.d.ts.map +1 -1
- package/dist/preset/index.cjs +1 -5
- package/dist/preset/index.d.ts.map +1 -1
- package/dist/preset/index.js +1 -5
- package/dist/react/index.cjs +166 -167
- package/dist/react/index.css +0 -1
- package/dist/react/index.js +162 -163
- package/package.json +1 -1
- package/styled-system/styles.css +0 -1
package/dist/react/index.cjs
CHANGED
|
@@ -3,7 +3,7 @@ require("./index.css");
|
|
|
3
3
|
|
|
4
4
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
5
5
|
|
|
6
|
-
var
|
|
6
|
+
var React3 = require('react');
|
|
7
7
|
var reactDom = require('react-dom');
|
|
8
8
|
var framerMotion = require('framer-motion');
|
|
9
9
|
var react = require('@floating-ui/react');
|
|
@@ -36,7 +36,7 @@ function _interopNamespace(e) {
|
|
|
36
36
|
return Object.freeze(n);
|
|
37
37
|
}
|
|
38
38
|
|
|
39
|
-
var
|
|
39
|
+
var React3__namespace = /*#__PURE__*/_interopNamespace(React3);
|
|
40
40
|
|
|
41
41
|
// src/react/index.ts
|
|
42
42
|
|
|
@@ -444,10 +444,10 @@ function styledFn(Dynamic, configOrCva = {}, options = {}) {
|
|
|
444
444
|
const __cvaFn__ = composeCvaFn(Dynamic.__cva__, cvaFn);
|
|
445
445
|
const __shouldForwardProps__ = composeShouldForwardProps(Dynamic, shouldForwardProp);
|
|
446
446
|
const __base__ = Dynamic.__base__ || Dynamic;
|
|
447
|
-
const StyledComponent = /* @__PURE__ */
|
|
447
|
+
const StyledComponent = /* @__PURE__ */ React3.forwardRef(function StyledComponent2(props, ref) {
|
|
448
448
|
const { as: Element2 = __base__, unstyled, children, ...restProps } = props;
|
|
449
|
-
const combinedProps =
|
|
450
|
-
const [htmlProps2, forwardedProps, variantProps, styleProps, elementProps] =
|
|
449
|
+
const combinedProps = React3.useMemo(() => Object.assign({}, defaultProps, restProps), [restProps]);
|
|
450
|
+
const [htmlProps2, forwardedProps, variantProps, styleProps, elementProps] = React3.useMemo(() => {
|
|
451
451
|
return splitProps(combinedProps, normalizeHTMLProps.keys, __shouldForwardProps__, __cvaFn__.variantKeys, isCssProperty);
|
|
452
452
|
}, [combinedProps]);
|
|
453
453
|
function recipeClass() {
|
|
@@ -467,7 +467,7 @@ function styledFn(Dynamic, configOrCva = {}, options = {}) {
|
|
|
467
467
|
}
|
|
468
468
|
return configOrCva.__recipe__ ? recipeClass() : cvaClass();
|
|
469
469
|
};
|
|
470
|
-
return
|
|
470
|
+
return React3.createElement(Element2, {
|
|
471
471
|
ref,
|
|
472
472
|
...forwardedProps,
|
|
473
473
|
...elementProps,
|
|
@@ -631,14 +631,14 @@ function Menu(props) {
|
|
|
631
631
|
trigger,
|
|
632
632
|
...rest
|
|
633
633
|
} = props;
|
|
634
|
-
const hoverTimeoutRef =
|
|
635
|
-
const [isOpen, setOpen] =
|
|
634
|
+
const hoverTimeoutRef = React3__namespace.default.useRef(null);
|
|
635
|
+
const [isOpen, setOpen] = React3__namespace.default.useState(isOpenControlled ?? false);
|
|
636
636
|
const onOpenChange = (open) => {
|
|
637
637
|
const newOpenState = typeof open === "function" ? open(isOpen) : open;
|
|
638
638
|
props.onOpenOrClose?.(newOpenState);
|
|
639
639
|
setOpen(newOpenState);
|
|
640
640
|
};
|
|
641
|
-
|
|
641
|
+
React3__namespace.default.useEffect(() => {
|
|
642
642
|
if (typeof isOpenControlled !== "boolean") return;
|
|
643
643
|
setOpen(isOpenControlled);
|
|
644
644
|
}, [isOpenControlled]);
|
|
@@ -713,11 +713,11 @@ function Menu(props) {
|
|
|
713
713
|
},
|
|
714
714
|
isOpen
|
|
715
715
|
);
|
|
716
|
-
|
|
716
|
+
React3__namespace.default.useEffect(() => {
|
|
717
717
|
if (!hideData?.referenceHidden) return;
|
|
718
718
|
closeMenuImmediate();
|
|
719
719
|
}, [hideData, closeMenuImmediate]);
|
|
720
|
-
|
|
720
|
+
React3__namespace.default.useEffect(() => {
|
|
721
721
|
return () => {
|
|
722
722
|
if (hoverTimeoutRef.current) clearTimeout(hoverTimeoutRef.current);
|
|
723
723
|
};
|
|
@@ -743,10 +743,10 @@ function Menu(props) {
|
|
|
743
743
|
onMouseLeave: handleMenuMouseLeave
|
|
744
744
|
} : {};
|
|
745
745
|
const transformOrigin = floatingContext.placement.startsWith("top") ? "bottom left" : "top left";
|
|
746
|
-
const childArray =
|
|
746
|
+
const childArray = React3__namespace.default.Children.toArray(children);
|
|
747
747
|
let customContainerEl = null;
|
|
748
748
|
for (const c of childArray) {
|
|
749
|
-
if (
|
|
749
|
+
if (React3__namespace.default.isValidElement(c)) {
|
|
750
750
|
const anyType = c.type;
|
|
751
751
|
if (c.props?.["data-menu-container"] || anyType?.isBlockMenuContainer) {
|
|
752
752
|
customContainerEl = c;
|
|
@@ -775,7 +775,7 @@ function Menu(props) {
|
|
|
775
775
|
...restStyle || {}
|
|
776
776
|
};
|
|
777
777
|
const mergedClassName = [defaultsClassName, childProps.className].filter(Boolean).join(" ");
|
|
778
|
-
const contentNode =
|
|
778
|
+
const contentNode = React3__namespace.default.cloneElement(
|
|
779
779
|
customContainerEl,
|
|
780
780
|
{
|
|
781
781
|
// Defaults are now in mergedClassName via css()
|
|
@@ -861,7 +861,7 @@ function Menu(props) {
|
|
|
861
861
|
);
|
|
862
862
|
}
|
|
863
863
|
function useOutsideClick(ref, handler, enabled = true) {
|
|
864
|
-
|
|
864
|
+
React3__namespace.default.useEffect(() => {
|
|
865
865
|
if (!enabled) return;
|
|
866
866
|
const listener = (event) => {
|
|
867
867
|
if (!ref.current || ref.current.contains(event.target)) {
|
|
@@ -971,9 +971,9 @@ var prepareFiles = async (acceptedFiles) => {
|
|
|
971
971
|
);
|
|
972
972
|
};
|
|
973
973
|
var findChildrenByDisplayName = (children, displayName2) => {
|
|
974
|
-
return
|
|
974
|
+
return React3__namespace.default.Children.toArray(children).find(
|
|
975
975
|
(child) => {
|
|
976
|
-
if (
|
|
976
|
+
if (React3__namespace.default.isValidElement(child)) {
|
|
977
977
|
const childType = child.type;
|
|
978
978
|
return childType.displayName === displayName2;
|
|
979
979
|
} else {
|
|
@@ -1153,7 +1153,7 @@ function getIcon(position, Icon2, props) {
|
|
|
1153
1153
|
if (loadingIcons.includes(chosen)) {
|
|
1154
1154
|
const Cmp = loadingIconsMap[chosen];
|
|
1155
1155
|
const sizePx = typeof loadingIconSize === "number" ? `${loadingIconSize}px` : "12px";
|
|
1156
|
-
return
|
|
1156
|
+
return React3__namespace.default.createElement(Cmp, {
|
|
1157
1157
|
width: sizePx,
|
|
1158
1158
|
height: sizePx
|
|
1159
1159
|
});
|
|
@@ -1168,11 +1168,11 @@ function getIcon(position, Icon2, props) {
|
|
|
1168
1168
|
spin: props.spin
|
|
1169
1169
|
}
|
|
1170
1170
|
);
|
|
1171
|
-
} else if (
|
|
1171
|
+
} else if (React3__namespace.default.isValidElement(chosen)) {
|
|
1172
1172
|
return chosen;
|
|
1173
1173
|
} else if (typeof chosen === "function") {
|
|
1174
1174
|
const iconProps = typeof loadingIconSize === "number" || typeof loadingIconSize === "string" ? { size: loadingIconSize } : void 0;
|
|
1175
|
-
return
|
|
1175
|
+
return React3__namespace.default.createElement(chosen, iconProps);
|
|
1176
1176
|
} else if (typeof chosen === "object" && chosen !== null && "iconName" in chosen) {
|
|
1177
1177
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
1178
1178
|
reactFontawesome.FontAwesomeIcon,
|
|
@@ -1222,8 +1222,8 @@ function getIcon(position, Icon2, props) {
|
|
|
1222
1222
|
}
|
|
1223
1223
|
);
|
|
1224
1224
|
} else if (typeof Icon2 === "function") {
|
|
1225
|
-
return
|
|
1226
|
-
} else if (
|
|
1225
|
+
return React3__namespace.default.createElement(Icon2);
|
|
1226
|
+
} else if (React3__namespace.default.isValidElement(Icon2)) {
|
|
1227
1227
|
return Icon2;
|
|
1228
1228
|
} else return null;
|
|
1229
1229
|
}
|
|
@@ -1268,9 +1268,9 @@ var TrackNameKey = "Track";
|
|
|
1268
1268
|
var ThumbNameKey = "Thumb";
|
|
1269
1269
|
var Button = motionTags.button;
|
|
1270
1270
|
var Base = motionTags.div;
|
|
1271
|
-
var SwitchContext =
|
|
1271
|
+
var SwitchContext = React3__namespace.default.createContext(null);
|
|
1272
1272
|
var useSwitchContext = () => {
|
|
1273
|
-
const context2 =
|
|
1273
|
+
const context2 = React3__namespace.default.useContext(SwitchContext);
|
|
1274
1274
|
if (!context2) {
|
|
1275
1275
|
throw new Error("Switch compound components must be used within Switch");
|
|
1276
1276
|
}
|
|
@@ -1289,9 +1289,9 @@ function Switch(props) {
|
|
|
1289
1289
|
_motion,
|
|
1290
1290
|
...rest
|
|
1291
1291
|
} = props;
|
|
1292
|
-
const [x, setX] =
|
|
1293
|
-
const [pressed, setPressed] =
|
|
1294
|
-
const [growThumb, setGrowThumb] =
|
|
1292
|
+
const [x, setX] = React3__namespace.default.useState(0);
|
|
1293
|
+
const [pressed, setPressed] = React3__namespace.default.useState(false);
|
|
1294
|
+
const [growThumb, setGrowThumb] = React3__namespace.default.useState(false);
|
|
1295
1295
|
const borderWidth = 4;
|
|
1296
1296
|
const trackWidth = thumbSize * 1.5;
|
|
1297
1297
|
const borderRadius = thumbSize * 2.5;
|
|
@@ -1302,7 +1302,7 @@ function Switch(props) {
|
|
|
1302
1302
|
start: stopwatchStart,
|
|
1303
1303
|
clear: stopwatchClear
|
|
1304
1304
|
} = useStopwatch();
|
|
1305
|
-
|
|
1305
|
+
React3__namespace.default.useEffect(() => {
|
|
1306
1306
|
if (pressed && !disabled) {
|
|
1307
1307
|
stopwatchStart();
|
|
1308
1308
|
} else {
|
|
@@ -1310,12 +1310,12 @@ function Switch(props) {
|
|
|
1310
1310
|
stopwatchClear();
|
|
1311
1311
|
}
|
|
1312
1312
|
}, [pressed, disabled, stopwatchStart, stopwatchClear]);
|
|
1313
|
-
|
|
1313
|
+
React3__namespace.default.useEffect(() => {
|
|
1314
1314
|
if (stopwatchTime > 200) {
|
|
1315
1315
|
setGrowThumb(true);
|
|
1316
1316
|
}
|
|
1317
1317
|
}, [stopwatchTime]);
|
|
1318
|
-
|
|
1318
|
+
React3__namespace.default.useEffect(() => {
|
|
1319
1319
|
setX(checked ? checkedPosition : 0);
|
|
1320
1320
|
}, [checked, checkedPosition]);
|
|
1321
1321
|
const toggle = () => {
|
|
@@ -1380,10 +1380,10 @@ function Switch(props) {
|
|
|
1380
1380
|
children,
|
|
1381
1381
|
ThumbNameKey
|
|
1382
1382
|
);
|
|
1383
|
-
const trackElement = track ?
|
|
1383
|
+
const trackElement = track ? React3__namespace.default.cloneElement(track, {
|
|
1384
1384
|
_motion,
|
|
1385
|
-
children: thumb ?
|
|
1386
|
-
}) : /* @__PURE__ */ jsxRuntime.jsx(Track, { _motion, children: thumb ?
|
|
1385
|
+
children: thumb ? React3__namespace.default.cloneElement(thumb, { _motion }) : /* @__PURE__ */ jsxRuntime.jsx(Thumb, { _motion })
|
|
1386
|
+
}) : /* @__PURE__ */ jsxRuntime.jsx(Track, { _motion, children: thumb ? React3__namespace.default.cloneElement(thumb, { _motion }) : /* @__PURE__ */ jsxRuntime.jsx(Thumb, { _motion }) });
|
|
1387
1387
|
return /* @__PURE__ */ jsxRuntime.jsx(SwitchContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxRuntime.jsx(framerMotion.MotionConfig, { transition: _motion, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
1388
1388
|
Button,
|
|
1389
1389
|
{
|
|
@@ -1509,10 +1509,10 @@ function Thumb(props) {
|
|
|
1509
1509
|
Track.displayName = TrackNameKey;
|
|
1510
1510
|
Thumb.displayName = ThumbNameKey;
|
|
1511
1511
|
function useStopwatch(props = {}) {
|
|
1512
|
-
const [active, setActive] =
|
|
1513
|
-
const [time, setTime] =
|
|
1512
|
+
const [active, setActive] = React3__namespace.default.useState(false);
|
|
1513
|
+
const [time, setTime] = React3__namespace.default.useState(0);
|
|
1514
1514
|
const timeInterval = props?.interval ?? 10;
|
|
1515
|
-
|
|
1515
|
+
React3__namespace.default.useEffect(() => {
|
|
1516
1516
|
let interval = null;
|
|
1517
1517
|
if (active) {
|
|
1518
1518
|
interval = setInterval(() => {
|
|
@@ -1523,19 +1523,19 @@ function useStopwatch(props = {}) {
|
|
|
1523
1523
|
}
|
|
1524
1524
|
return () => clearInterval(interval);
|
|
1525
1525
|
}, [active, timeInterval]);
|
|
1526
|
-
const start =
|
|
1527
|
-
const stop =
|
|
1528
|
-
const clear =
|
|
1526
|
+
const start = React3__namespace.default.useCallback(() => setActive(true), []);
|
|
1527
|
+
const stop = React3__namespace.default.useCallback(() => setActive(false), []);
|
|
1528
|
+
const clear = React3__namespace.default.useCallback(() => {
|
|
1529
1529
|
setActive(false);
|
|
1530
1530
|
setTime(0);
|
|
1531
1531
|
}, []);
|
|
1532
|
-
return
|
|
1532
|
+
return React3__namespace.default.useMemo(
|
|
1533
1533
|
() => ({ time, start, stop, clear }),
|
|
1534
1534
|
[time, start, stop, clear]
|
|
1535
1535
|
);
|
|
1536
1536
|
}
|
|
1537
1537
|
var switch_default = Switch;
|
|
1538
|
-
var RadioContext =
|
|
1538
|
+
var RadioContext = React3__namespace.default.createContext(null);
|
|
1539
1539
|
var Base2 = base;
|
|
1540
1540
|
var MotionDiv2 = motionTags.div;
|
|
1541
1541
|
function Radio(props) {
|
|
@@ -1552,14 +1552,14 @@ function Radio(props) {
|
|
|
1552
1552
|
onAnimationComplete: _onAnimationComplete,
|
|
1553
1553
|
...rest
|
|
1554
1554
|
} = props;
|
|
1555
|
-
const groupId =
|
|
1555
|
+
const groupId = React3__namespace.default.useId();
|
|
1556
1556
|
const isControlled = controlledValue !== void 0;
|
|
1557
|
-
const [uncontrolled, setUncontrolled] =
|
|
1557
|
+
const [uncontrolled, setUncontrolled] = React3__namespace.default.useState(
|
|
1558
1558
|
defaultValue
|
|
1559
1559
|
);
|
|
1560
1560
|
const selectedValue = isControlled ? controlledValue ?? null : uncontrolled;
|
|
1561
|
-
const itemsRef =
|
|
1562
|
-
const [activeId, setActiveId] =
|
|
1561
|
+
const itemsRef = React3__namespace.default.useRef([]);
|
|
1562
|
+
const [activeId, setActiveId] = React3__namespace.default.useState("");
|
|
1563
1563
|
const setSelectedValue = (val) => {
|
|
1564
1564
|
if (!isControlled) setUncontrolled(val);
|
|
1565
1565
|
onChange?.(val);
|
|
@@ -1612,7 +1612,7 @@ function Radio(props) {
|
|
|
1612
1612
|
setActiveId(found.id);
|
|
1613
1613
|
}
|
|
1614
1614
|
};
|
|
1615
|
-
|
|
1615
|
+
React3__namespace.default.useEffect(() => {
|
|
1616
1616
|
if (!selectedValue) return;
|
|
1617
1617
|
const selected = itemsRef.current.find((x) => x.value === selectedValue);
|
|
1618
1618
|
if (selected && !selected.disabled) setActiveId(selected.id);
|
|
@@ -1653,7 +1653,7 @@ function Radio(props) {
|
|
|
1653
1653
|
},
|
|
1654
1654
|
children: [
|
|
1655
1655
|
(options ?? []).map(
|
|
1656
|
-
(opt) => renderOption ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
1656
|
+
(opt) => renderOption ? /* @__PURE__ */ jsxRuntime.jsx(React3__namespace.default.Fragment, { children: renderOption(opt) }, opt.value) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
1657
1657
|
Item,
|
|
1658
1658
|
{
|
|
1659
1659
|
value: opt.value,
|
|
@@ -1685,16 +1685,16 @@ function Item(props) {
|
|
|
1685
1685
|
onAnimationComplete: _onAnimationComplete,
|
|
1686
1686
|
...rest
|
|
1687
1687
|
} = props;
|
|
1688
|
-
const ctx =
|
|
1689
|
-
const ref =
|
|
1690
|
-
const [isFocused, setIsFocused] =
|
|
1688
|
+
const ctx = React3__namespace.default.useContext(RadioContext);
|
|
1689
|
+
const ref = React3__namespace.default.useRef(null);
|
|
1690
|
+
const [isFocused, setIsFocused] = React3__namespace.default.useState(false);
|
|
1691
1691
|
const groupDisabled = ctx?.disabled;
|
|
1692
1692
|
const disabled = !!(groupDisabled || itemDisabled);
|
|
1693
1693
|
const groupId = ctx?.groupId ?? "";
|
|
1694
1694
|
const id = `radio-item-${groupId}-${value}`;
|
|
1695
1695
|
const registerItem = ctx?.registerItem;
|
|
1696
1696
|
const unregisterItem = ctx?.unregisterItem;
|
|
1697
|
-
|
|
1697
|
+
React3__namespace.default.useEffect(() => {
|
|
1698
1698
|
if (!registerItem || !unregisterItem) return;
|
|
1699
1699
|
registerItem({ id, value, disabled, ref });
|
|
1700
1700
|
return () => unregisterItem(id);
|
|
@@ -1710,12 +1710,12 @@ function Item(props) {
|
|
|
1710
1710
|
const isActive = isActiveId(id);
|
|
1711
1711
|
const shouldUseGrid = gridProp || !!colsProp;
|
|
1712
1712
|
const renderLabel = () => {
|
|
1713
|
-
const onlyChild =
|
|
1713
|
+
const onlyChild = React3__namespace.default.Children.count(children) === 1 ? React3__namespace.default.Children.toArray(children)[0] : null;
|
|
1714
1714
|
if (typeof onlyChild === "string") {
|
|
1715
1715
|
return /* @__PURE__ */ jsxRuntime.jsx(Base2, { "data-radio-label": true, children: onlyChild });
|
|
1716
1716
|
}
|
|
1717
|
-
if (
|
|
1718
|
-
return
|
|
1717
|
+
if (React3__namespace.default.isValidElement(onlyChild)) {
|
|
1718
|
+
return React3__namespace.default.cloneElement(
|
|
1719
1719
|
onlyChild,
|
|
1720
1720
|
{ "data-radio-label": true }
|
|
1721
1721
|
);
|
|
@@ -1832,7 +1832,7 @@ function Item(props) {
|
|
|
1832
1832
|
var LabelNameKey = "Label";
|
|
1833
1833
|
var Base3 = base;
|
|
1834
1834
|
var isBrowser = typeof window !== "undefined";
|
|
1835
|
-
var useIsomorphicLayoutEffect = isBrowser ?
|
|
1835
|
+
var useIsomorphicLayoutEffect = isBrowser ? React3__namespace.default.useLayoutEffect : React3__namespace.default.useEffect;
|
|
1836
1836
|
function pick(props, obj) {
|
|
1837
1837
|
return props.reduce((acc, prop) => {
|
|
1838
1838
|
acc[prop] = obj[prop];
|
|
@@ -1963,21 +1963,21 @@ function Textarea(props) {
|
|
|
1963
1963
|
...rest
|
|
1964
1964
|
} = props;
|
|
1965
1965
|
const isControlled = props.value !== void 0;
|
|
1966
|
-
const libRef =
|
|
1966
|
+
const libRef = React3__namespace.default.useRef(null);
|
|
1967
1967
|
const ref = assignRefs(libRef, userRef);
|
|
1968
|
-
const heightRef =
|
|
1969
|
-
const [_value, _setValue] =
|
|
1968
|
+
const heightRef = React3__namespace.default.useRef(0);
|
|
1969
|
+
const [_value, _setValue] = React3__namespace.default.useState("");
|
|
1970
1970
|
const value = props.value ?? _value;
|
|
1971
1971
|
const label = findChildrenByDisplayName(
|
|
1972
1972
|
children,
|
|
1973
1973
|
LabelNameKey
|
|
1974
1974
|
);
|
|
1975
|
-
const labelWithProps = label ?
|
|
1975
|
+
const labelWithProps = label ? React3__namespace.default.cloneElement(label, {
|
|
1976
1976
|
required: props.required,
|
|
1977
1977
|
value: props.value,
|
|
1978
1978
|
error
|
|
1979
1979
|
}) : null;
|
|
1980
|
-
const resizeTextarea =
|
|
1980
|
+
const resizeTextarea = React3__namespace.default.useCallback(() => {
|
|
1981
1981
|
const node = libRef.current;
|
|
1982
1982
|
if (!node) return;
|
|
1983
1983
|
const nodeSizingData = getSizingData(node);
|
|
@@ -2003,20 +2003,20 @@ function Textarea(props) {
|
|
|
2003
2003
|
useIsomorphicLayoutEffect(() => {
|
|
2004
2004
|
resizeTextarea();
|
|
2005
2005
|
}, [rest.value, rest.placeholder, resizeTextarea]);
|
|
2006
|
-
|
|
2006
|
+
React3__namespace.default.useEffect(() => {
|
|
2007
2007
|
if (!isBrowser) return;
|
|
2008
2008
|
const onResize = () => resizeTextarea();
|
|
2009
2009
|
window.addEventListener("resize", onResize);
|
|
2010
2010
|
return () => window.removeEventListener("resize", onResize);
|
|
2011
2011
|
}, [rest.placeholder, rest.value, resizeTextarea]);
|
|
2012
|
-
|
|
2012
|
+
React3__namespace.default.useEffect(() => {
|
|
2013
2013
|
const fonts = isBrowser ? document.fonts : void 0;
|
|
2014
2014
|
if (!fonts || typeof fonts.addEventListener !== "function") return;
|
|
2015
2015
|
const onFontsLoaded = () => resizeTextarea();
|
|
2016
2016
|
fonts.addEventListener("loadingdone", onFontsLoaded);
|
|
2017
2017
|
return () => fonts.removeEventListener("loadingdone", onFontsLoaded);
|
|
2018
2018
|
}, [rest.placeholder, rest.value, resizeTextarea]);
|
|
2019
|
-
|
|
2019
|
+
React3__namespace.default.useEffect(() => {
|
|
2020
2020
|
const node = libRef.current;
|
|
2021
2021
|
const form = node?.form;
|
|
2022
2022
|
if (!node || !form || isControlled) return;
|
|
@@ -2158,8 +2158,8 @@ function Icon(props) {
|
|
|
2158
2158
|
}
|
|
2159
2159
|
);
|
|
2160
2160
|
} else if (typeof IconComp === "function") {
|
|
2161
|
-
return
|
|
2162
|
-
} else if (
|
|
2161
|
+
return React3__namespace.default.createElement(IconComp);
|
|
2162
|
+
} else if (React3__namespace.default.isValidElement(IconComp)) {
|
|
2163
2163
|
return IconComp;
|
|
2164
2164
|
}
|
|
2165
2165
|
return null;
|
|
@@ -2188,13 +2188,13 @@ function Input(props) {
|
|
|
2188
2188
|
children,
|
|
2189
2189
|
RightSideNameKey
|
|
2190
2190
|
);
|
|
2191
|
-
const labelWithProps = label ?
|
|
2191
|
+
const labelWithProps = label ? React3__namespace.default.cloneElement(label, {
|
|
2192
2192
|
hasLeftIcon: !!leftIcon,
|
|
2193
2193
|
required: props.required,
|
|
2194
2194
|
value: props.value,
|
|
2195
2195
|
error
|
|
2196
2196
|
}) : null;
|
|
2197
|
-
const rightSideWithProps = rightSide ?
|
|
2197
|
+
const rightSideWithProps = rightSide ? React3__namespace.default.cloneElement(rightSide, {
|
|
2198
2198
|
onChange: props.onChange,
|
|
2199
2199
|
value: props.value
|
|
2200
2200
|
}) : null;
|
|
@@ -2339,29 +2339,29 @@ function Label2(props) {
|
|
|
2339
2339
|
Label2.displayName = LabelNameKey2;
|
|
2340
2340
|
function useResizeObserver(opts = {}) {
|
|
2341
2341
|
const onResize = opts.onResize;
|
|
2342
|
-
const onResizeRef =
|
|
2343
|
-
|
|
2342
|
+
const onResizeRef = React3__namespace.default.useRef(void 0);
|
|
2343
|
+
React3__namespace.default.useLayoutEffect(() => {
|
|
2344
2344
|
onResizeRef.current = onResize;
|
|
2345
2345
|
}, [onResize]);
|
|
2346
2346
|
const round = opts.round || Math.round;
|
|
2347
|
-
const resizeObserverRef =
|
|
2348
|
-
const [size, setSize] =
|
|
2347
|
+
const resizeObserverRef = React3__namespace.default.useRef(null);
|
|
2348
|
+
const [size, setSize] = React3__namespace.default.useState({
|
|
2349
2349
|
width: void 0,
|
|
2350
2350
|
height: void 0
|
|
2351
2351
|
});
|
|
2352
|
-
const didUnmount =
|
|
2353
|
-
|
|
2352
|
+
const didUnmount = React3__namespace.default.useRef(false);
|
|
2353
|
+
React3__namespace.default.useEffect(() => {
|
|
2354
2354
|
didUnmount.current = false;
|
|
2355
2355
|
return () => {
|
|
2356
2356
|
didUnmount.current = true;
|
|
2357
2357
|
};
|
|
2358
2358
|
}, []);
|
|
2359
|
-
const previous =
|
|
2359
|
+
const previous = React3__namespace.default.useRef({
|
|
2360
2360
|
width: void 0,
|
|
2361
2361
|
height: void 0
|
|
2362
2362
|
});
|
|
2363
2363
|
const refCallback = useResolvedElement(
|
|
2364
|
-
|
|
2364
|
+
React3__namespace.default.useCallback(
|
|
2365
2365
|
(element) => {
|
|
2366
2366
|
if (!resizeObserverRef.current || resizeObserverRef.current.box !== opts.box || resizeObserverRef.current.round !== round) {
|
|
2367
2367
|
resizeObserverRef.current = {
|
|
@@ -2401,7 +2401,7 @@ function useResizeObserver(opts = {}) {
|
|
|
2401
2401
|
),
|
|
2402
2402
|
opts.ref
|
|
2403
2403
|
);
|
|
2404
|
-
return
|
|
2404
|
+
return React3__namespace.default.useMemo(
|
|
2405
2405
|
() => ({
|
|
2406
2406
|
ref: refCallback,
|
|
2407
2407
|
width: size.width,
|
|
@@ -2413,12 +2413,12 @@ function useResizeObserver(opts = {}) {
|
|
|
2413
2413
|
);
|
|
2414
2414
|
}
|
|
2415
2415
|
function useResolvedElement(subscriber, refOrElement) {
|
|
2416
|
-
const lastReportRef =
|
|
2417
|
-
const refOrElementRef =
|
|
2418
|
-
|
|
2416
|
+
const lastReportRef = React3__namespace.default.useRef(null);
|
|
2417
|
+
const refOrElementRef = React3__namespace.default.useRef(null);
|
|
2418
|
+
React3__namespace.default.useLayoutEffect(() => {
|
|
2419
2419
|
refOrElementRef.current = refOrElement;
|
|
2420
2420
|
}, [refOrElement]);
|
|
2421
|
-
const cbElementRef =
|
|
2421
|
+
const cbElementRef = React3__namespace.default.useRef(null);
|
|
2422
2422
|
const evaluateSubscription = () => {
|
|
2423
2423
|
const cbElement = cbElementRef.current;
|
|
2424
2424
|
const refOrElement2 = refOrElementRef.current;
|
|
@@ -2437,10 +2437,10 @@ function useResolvedElement(subscriber, refOrElement) {
|
|
|
2437
2437
|
cleanup: element ? subscriber(element) : void 0
|
|
2438
2438
|
};
|
|
2439
2439
|
};
|
|
2440
|
-
|
|
2440
|
+
React3__namespace.default.useEffect(() => {
|
|
2441
2441
|
evaluateSubscription();
|
|
2442
2442
|
});
|
|
2443
|
-
|
|
2443
|
+
React3__namespace.default.useEffect(() => {
|
|
2444
2444
|
return () => {
|
|
2445
2445
|
if (lastReportRef.current && lastReportRef.current.cleanup) {
|
|
2446
2446
|
lastReportRef.current.cleanup();
|
|
@@ -2466,7 +2466,7 @@ var use_resize_observer_default = useResizeObserver;
|
|
|
2466
2466
|
var MotionDiv3 = motionTags.div;
|
|
2467
2467
|
var MotionBtn = motionTags.button;
|
|
2468
2468
|
var displayName = "AccordionItem";
|
|
2469
|
-
var AccordionContext =
|
|
2469
|
+
var AccordionContext = React3__namespace.default.createContext({});
|
|
2470
2470
|
function AccordionProvider(props) {
|
|
2471
2471
|
const [state, setState] = useImmer.useImmer({
|
|
2472
2472
|
allowMultiple: false,
|
|
@@ -2476,7 +2476,7 @@ function AccordionProvider(props) {
|
|
|
2476
2476
|
return /* @__PURE__ */ jsxRuntime.jsx(AccordionContext.Provider, { value: { setState, state }, children: props.children });
|
|
2477
2477
|
}
|
|
2478
2478
|
function useAccordion() {
|
|
2479
|
-
const context2 =
|
|
2479
|
+
const context2 = React3__namespace.default.useContext(AccordionContext);
|
|
2480
2480
|
if (context2 === void 0) {
|
|
2481
2481
|
throw new Error("useAccordion must be used within a AccordionProvider");
|
|
2482
2482
|
}
|
|
@@ -2485,23 +2485,23 @@ function useAccordion() {
|
|
|
2485
2485
|
function AccordionComponent(props) {
|
|
2486
2486
|
const accordion = useAccordion();
|
|
2487
2487
|
const accordionState = accordion.state;
|
|
2488
|
-
|
|
2488
|
+
React3__namespace.default.useEffect(() => {
|
|
2489
2489
|
accordion.setState((draft) => {
|
|
2490
2490
|
draft.allowMultiple = !!props.allowMultiple;
|
|
2491
2491
|
draft.allowToggle = !!props.allowToggle;
|
|
2492
2492
|
});
|
|
2493
2493
|
}, [props.allowMultiple, props.allowToggle]);
|
|
2494
|
-
|
|
2494
|
+
React3__namespace.default.Children.forEach(props.children, (x) => {
|
|
2495
2495
|
if (typeof x.type === "function" && "displayName" in x.type && x.type.displayName !== displayName) {
|
|
2496
2496
|
throw new Error("Accordion can only have AccordionItems as children");
|
|
2497
2497
|
}
|
|
2498
2498
|
});
|
|
2499
|
-
const children =
|
|
2500
|
-
if (!
|
|
2501
|
-
return
|
|
2499
|
+
const children = React3__namespace.default.Children.map(props.children, (child, i) => {
|
|
2500
|
+
if (!React3__namespace.default.isValidElement(child)) return child;
|
|
2501
|
+
return React3__namespace.default.cloneElement(child, { idx: i });
|
|
2502
2502
|
});
|
|
2503
2503
|
const defaultOpenIdxList = JSON.stringify(props.defaultOpenIdx ?? []);
|
|
2504
|
-
|
|
2504
|
+
React3__namespace.default.useEffect(
|
|
2505
2505
|
() => {
|
|
2506
2506
|
if (accordionState.open.length === children.length) return;
|
|
2507
2507
|
const defaultOpenIdx = props.defaultOpenIdx;
|
|
@@ -2608,16 +2608,16 @@ var MotionDiv4 = motionTags.div;
|
|
|
2608
2608
|
var MotionBtn2 = motionTags.button;
|
|
2609
2609
|
var breakpoint = ["(min-width: 600px)"];
|
|
2610
2610
|
function DrawerComponent(props) {
|
|
2611
|
-
const ref =
|
|
2612
|
-
const dragHandleRef =
|
|
2611
|
+
const ref = React3__namespace.default.useRef(null);
|
|
2612
|
+
const dragHandleRef = React3__namespace.default.useRef(null);
|
|
2613
2613
|
const [isDesktop] = useMatchMedia(breakpoint);
|
|
2614
|
-
const closeFnRef =
|
|
2615
|
-
const prevOpenRef =
|
|
2614
|
+
const closeFnRef = React3__namespace.default.useRef(null);
|
|
2615
|
+
const prevOpenRef = React3__namespace.default.useRef(null);
|
|
2616
2616
|
const dragControls = framerMotion.useDragControls();
|
|
2617
2617
|
const { open, setOpen } = useDrawer();
|
|
2618
2618
|
const { onClose, onExitComplete, ...rest } = props;
|
|
2619
|
-
const [mounted, setMounted] =
|
|
2620
|
-
|
|
2619
|
+
const [mounted, setMounted] = React3__namespace.default.useState(false);
|
|
2620
|
+
React3__namespace.default.useEffect(() => {
|
|
2621
2621
|
setMounted(true);
|
|
2622
2622
|
}, []);
|
|
2623
2623
|
const y = framerMotion.useMotionValue(0);
|
|
@@ -2630,7 +2630,7 @@ function DrawerComponent(props) {
|
|
|
2630
2630
|
y.stop();
|
|
2631
2631
|
setOpen(false);
|
|
2632
2632
|
};
|
|
2633
|
-
|
|
2633
|
+
React3__namespace.default.useEffect(() => {
|
|
2634
2634
|
closeFnRef.current = () => {
|
|
2635
2635
|
closeDrawer();
|
|
2636
2636
|
onClose?.();
|
|
@@ -2650,7 +2650,7 @@ function DrawerComponent(props) {
|
|
|
2650
2650
|
);
|
|
2651
2651
|
}
|
|
2652
2652
|
};
|
|
2653
|
-
|
|
2653
|
+
React3__namespace.default.useLayoutEffect(() => {
|
|
2654
2654
|
const wasOpen = prevOpenRef.current;
|
|
2655
2655
|
const isOpen = props.open;
|
|
2656
2656
|
if (isOpen) {
|
|
@@ -2660,7 +2660,7 @@ function DrawerComponent(props) {
|
|
|
2660
2660
|
}
|
|
2661
2661
|
prevOpenRef.current = isOpen;
|
|
2662
2662
|
}, [props.open]);
|
|
2663
|
-
|
|
2663
|
+
React3__namespace.default.useEffect(() => {
|
|
2664
2664
|
const container = ref.current;
|
|
2665
2665
|
if (!open || !container) return;
|
|
2666
2666
|
container.setAttribute("tabindex", "0");
|
|
@@ -2682,7 +2682,7 @@ function DrawerComponent(props) {
|
|
|
2682
2682
|
document.body.style.overflow = "auto";
|
|
2683
2683
|
};
|
|
2684
2684
|
}, [open, props.closeOnEsc]);
|
|
2685
|
-
|
|
2685
|
+
React3__namespace.default.useEffect(() => {
|
|
2686
2686
|
if (!props.open) return;
|
|
2687
2687
|
const unsubscribeY = y.on("change", (latestY) => {
|
|
2688
2688
|
if (latestY > 150) {
|
|
@@ -2851,19 +2851,19 @@ function DrawerComponent(props) {
|
|
|
2851
2851
|
document.getElementById("portal")
|
|
2852
2852
|
);
|
|
2853
2853
|
}
|
|
2854
|
-
var DrawerContext =
|
|
2854
|
+
var DrawerContext = React3__namespace.default.createContext({
|
|
2855
2855
|
open: false,
|
|
2856
2856
|
setOpen: () => {
|
|
2857
2857
|
return;
|
|
2858
2858
|
}
|
|
2859
2859
|
});
|
|
2860
2860
|
function DrawerProvider(props) {
|
|
2861
|
-
const [open, setOpen] =
|
|
2861
|
+
const [open, setOpen] = React3__namespace.default.useState(false);
|
|
2862
2862
|
const value = { open, setOpen };
|
|
2863
2863
|
return /* @__PURE__ */ jsxRuntime.jsx(DrawerContext.Provider, { value, children: props.children });
|
|
2864
2864
|
}
|
|
2865
2865
|
function useDrawer() {
|
|
2866
|
-
const context2 =
|
|
2866
|
+
const context2 = React3__namespace.default.useContext(DrawerContext);
|
|
2867
2867
|
if (context2 === void 0) {
|
|
2868
2868
|
throw new Error("useDrawer must be used within a DrawerProvider");
|
|
2869
2869
|
}
|
|
@@ -2876,7 +2876,7 @@ function BtnGroup(props) {
|
|
|
2876
2876
|
const [isDesktop] = useMatchMedia(breakpoint);
|
|
2877
2877
|
const { children, ...rest } = props;
|
|
2878
2878
|
if (isDesktop) {
|
|
2879
|
-
return /* @__PURE__ */ jsxRuntime.jsx(MotionDiv4, { flex: true, alignI: true, gap: 4, ...rest, children:
|
|
2879
|
+
return /* @__PURE__ */ jsxRuntime.jsx(MotionDiv4, { flex: true, alignI: true, gap: 4, ...rest, children: React3__namespace.default.Children.toArray(children).toReversed() });
|
|
2880
2880
|
} else {
|
|
2881
2881
|
return /* @__PURE__ */ jsxRuntime.jsx(MotionDiv4, { grid: true, rowG: 14, ...props });
|
|
2882
2882
|
}
|
|
@@ -2929,7 +2929,7 @@ function CloseBtn(props) {
|
|
|
2929
2929
|
}
|
|
2930
2930
|
}
|
|
2931
2931
|
function Backdrop(props) {
|
|
2932
|
-
const allowOutsideClickRef =
|
|
2932
|
+
const allowOutsideClickRef = React3__namespace.default.useRef(true);
|
|
2933
2933
|
const [isDesktop] = useMatchMedia(breakpoint);
|
|
2934
2934
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
2935
2935
|
MotionDiv4,
|
|
@@ -2960,11 +2960,11 @@ function Backdrop(props) {
|
|
|
2960
2960
|
}
|
|
2961
2961
|
function useMatchMedia(queries) {
|
|
2962
2962
|
const isClient = typeof window !== "undefined";
|
|
2963
|
-
const [value, setValue] =
|
|
2963
|
+
const [value, setValue] = React3__namespace.default.useState(() => {
|
|
2964
2964
|
if (!isClient) return queries.map(() => false);
|
|
2965
2965
|
return queries.map((q) => window.matchMedia(q).matches);
|
|
2966
2966
|
});
|
|
2967
|
-
|
|
2967
|
+
React3__namespace.default.useLayoutEffect(() => {
|
|
2968
2968
|
if (!isClient) return;
|
|
2969
2969
|
const mediaQueryLists = queries.map((q) => window.matchMedia(q));
|
|
2970
2970
|
const handler = () => {
|
|
@@ -2983,9 +2983,9 @@ var TrackBgNameKey = "TrackBg";
|
|
|
2983
2983
|
var TrackFillNameKey = "TrackFill";
|
|
2984
2984
|
function Progress(props) {
|
|
2985
2985
|
const { children, steps, value, max: maxProp, ...rest } = props;
|
|
2986
|
-
const [progress, setProgress] =
|
|
2986
|
+
const [progress, setProgress] = React3__namespace.default.useState(0);
|
|
2987
2987
|
const max = maxProp ?? 100;
|
|
2988
|
-
|
|
2988
|
+
React3__namespace.default.useEffect(() => {
|
|
2989
2989
|
setProgress(Math.min((value ?? 0) / max, 1) * 100);
|
|
2990
2990
|
}, [value, max]);
|
|
2991
2991
|
const width = `${progress}%`;
|
|
@@ -3025,7 +3025,7 @@ function Progress(props) {
|
|
|
3025
3025
|
TrackFillNameKey
|
|
3026
3026
|
);
|
|
3027
3027
|
const barHeight = rest.h ?? 8;
|
|
3028
|
-
const bgEl = trackBgChild ?
|
|
3028
|
+
const bgEl = trackBgChild ? React3__namespace.default.cloneElement(trackBgChild, {
|
|
3029
3029
|
gridArea: "1 / 1",
|
|
3030
3030
|
h: barHeight,
|
|
3031
3031
|
w: trackBgChild.props.w ?? true
|
|
@@ -3040,7 +3040,7 @@ function Progress(props) {
|
|
|
3040
3040
|
bg: { base: "neutral.200", _dark: "neutral.700" }
|
|
3041
3041
|
}
|
|
3042
3042
|
);
|
|
3043
|
-
const fillEl = trackFillChild ?
|
|
3043
|
+
const fillEl = trackFillChild ? React3__namespace.default.cloneElement(trackFillChild, {
|
|
3044
3044
|
gridArea: "1 / 1",
|
|
3045
3045
|
h: barHeight,
|
|
3046
3046
|
roundedLeft: 9999,
|
|
@@ -3114,9 +3114,9 @@ var MotionDiv6 = motionTags.div;
|
|
|
3114
3114
|
var TrackNameKey2 = "SliderTrack";
|
|
3115
3115
|
var FillNameKey = "SliderFill";
|
|
3116
3116
|
var ThumbNameKey2 = "SliderThumb";
|
|
3117
|
-
var SliderContext =
|
|
3117
|
+
var SliderContext = React3__namespace.default.createContext(null);
|
|
3118
3118
|
var useSliderContext = () => {
|
|
3119
|
-
const context2 =
|
|
3119
|
+
const context2 = React3__namespace.default.useContext(SliderContext);
|
|
3120
3120
|
if (!context2) {
|
|
3121
3121
|
throw new Error("Slider compound components must be used within Slider");
|
|
3122
3122
|
}
|
|
@@ -3136,15 +3136,15 @@ function Slider(props) {
|
|
|
3136
3136
|
...rest
|
|
3137
3137
|
} = props;
|
|
3138
3138
|
const isControlled = controlledValue !== void 0;
|
|
3139
|
-
const [internalValue, setInternalValue] =
|
|
3139
|
+
const [internalValue, setInternalValue] = React3__namespace.default.useState(defaultValue);
|
|
3140
3140
|
const value = isControlled ? controlledValue : internalValue;
|
|
3141
|
-
const [isDragging, setIsDragging] =
|
|
3142
|
-
const trackRef =
|
|
3141
|
+
const [isDragging, setIsDragging] = React3__namespace.default.useState(false);
|
|
3142
|
+
const trackRef = React3__namespace.default.useRef(null);
|
|
3143
3143
|
const percent = Math.min(
|
|
3144
3144
|
100,
|
|
3145
3145
|
Math.max(0, (value - min) / (max - min) * 100)
|
|
3146
3146
|
);
|
|
3147
|
-
const clampValue =
|
|
3147
|
+
const clampValue = React3__namespace.default.useCallback(
|
|
3148
3148
|
(rawValue) => {
|
|
3149
3149
|
let clamped = Math.max(min, Math.min(max, rawValue));
|
|
3150
3150
|
if (step !== void 0 && step > 0) {
|
|
@@ -3155,7 +3155,7 @@ function Slider(props) {
|
|
|
3155
3155
|
},
|
|
3156
3156
|
[min, max, step]
|
|
3157
3157
|
);
|
|
3158
|
-
const getValueFromClientX =
|
|
3158
|
+
const getValueFromClientX = React3__namespace.default.useCallback(
|
|
3159
3159
|
(clientX) => {
|
|
3160
3160
|
const track = trackRef.current;
|
|
3161
3161
|
if (!track) return value;
|
|
@@ -3167,7 +3167,7 @@ function Slider(props) {
|
|
|
3167
3167
|
},
|
|
3168
3168
|
[min, max, value, clampValue]
|
|
3169
3169
|
);
|
|
3170
|
-
const updateValue =
|
|
3170
|
+
const updateValue = React3__namespace.default.useCallback(
|
|
3171
3171
|
(newValue) => {
|
|
3172
3172
|
if (disabled) return;
|
|
3173
3173
|
if (!isControlled) {
|
|
@@ -3184,7 +3184,7 @@ function Slider(props) {
|
|
|
3184
3184
|
const newValue = getValueFromClientX(e.clientX);
|
|
3185
3185
|
updateValue(newValue);
|
|
3186
3186
|
};
|
|
3187
|
-
|
|
3187
|
+
React3__namespace.default.useEffect(() => {
|
|
3188
3188
|
if (!isDragging) return;
|
|
3189
3189
|
const controller = new AbortController();
|
|
3190
3190
|
const handleMove = (e) => {
|
|
@@ -3254,19 +3254,19 @@ function Slider(props) {
|
|
|
3254
3254
|
trackRef
|
|
3255
3255
|
};
|
|
3256
3256
|
const height = rest.h ?? 8;
|
|
3257
|
-
const trackEl = trackChild ?
|
|
3257
|
+
const trackEl = trackChild ? React3__namespace.default.cloneElement(trackChild, {
|
|
3258
3258
|
sliderPercent: percent,
|
|
3259
3259
|
sliderValue: value,
|
|
3260
3260
|
sliderMin: min,
|
|
3261
3261
|
sliderMax: max
|
|
3262
3262
|
}) : /* @__PURE__ */ jsxRuntime.jsx(SliderTrack, {});
|
|
3263
|
-
const fillEl = fillChild ?
|
|
3263
|
+
const fillEl = fillChild ? React3__namespace.default.cloneElement(fillChild, {
|
|
3264
3264
|
sliderPercent: percent,
|
|
3265
3265
|
sliderValue: value,
|
|
3266
3266
|
sliderMin: min,
|
|
3267
3267
|
sliderMax: max
|
|
3268
3268
|
}) : /* @__PURE__ */ jsxRuntime.jsx(SliderFill, {});
|
|
3269
|
-
const thumbEl = thumbChild ?
|
|
3269
|
+
const thumbEl = thumbChild ? React3__namespace.default.cloneElement(thumbChild, {
|
|
3270
3270
|
sliderPercent: percent,
|
|
3271
3271
|
sliderValue: value,
|
|
3272
3272
|
sliderMin: min,
|
|
@@ -3402,12 +3402,12 @@ function Checkbox(props) {
|
|
|
3402
3402
|
onAnimationComplete: _onAnimationComplete,
|
|
3403
3403
|
...rest
|
|
3404
3404
|
} = props;
|
|
3405
|
-
const [checked, setChecked] =
|
|
3406
|
-
const [indeterminate, setIndeterminate] =
|
|
3407
|
-
|
|
3405
|
+
const [checked, setChecked] = React3__namespace.default.useState(false);
|
|
3406
|
+
const [indeterminate, setIndeterminate] = React3__namespace.default.useState(false);
|
|
3407
|
+
React3__namespace.default.useEffect(() => {
|
|
3408
3408
|
setChecked(!!rest.checked);
|
|
3409
3409
|
}, [rest.checked]);
|
|
3410
|
-
|
|
3410
|
+
React3__namespace.default.useEffect(() => {
|
|
3411
3411
|
setIndeterminate(!!rest.indeterminate);
|
|
3412
3412
|
}, [rest.indeterminate]);
|
|
3413
3413
|
const isIndeterminate = typeof rest.indeterminate === "boolean";
|
|
@@ -3512,15 +3512,15 @@ function Tooltip(props) {
|
|
|
3512
3512
|
delay = 80,
|
|
3513
3513
|
className
|
|
3514
3514
|
} = props;
|
|
3515
|
-
const referenceRef =
|
|
3516
|
-
const arrowRef =
|
|
3517
|
-
const closeTimerRef =
|
|
3515
|
+
const referenceRef = React3__namespace.default.useRef(null);
|
|
3516
|
+
const arrowRef = React3__namespace.default.useRef(null);
|
|
3517
|
+
const closeTimerRef = React3__namespace.default.useRef(
|
|
3518
3518
|
null
|
|
3519
3519
|
);
|
|
3520
|
-
const containerRef =
|
|
3521
|
-
const [open, setOpen] =
|
|
3522
|
-
const [isMounted, setIsMounted] =
|
|
3523
|
-
const [containerBg, setContainerBg] =
|
|
3520
|
+
const containerRef = React3__namespace.default.useRef(null);
|
|
3521
|
+
const [open, setOpen] = React3__namespace.default.useState(false);
|
|
3522
|
+
const [isMounted, setIsMounted] = React3__namespace.default.useState(false);
|
|
3523
|
+
const [containerBg, setContainerBg] = React3__namespace.default.useState();
|
|
3524
3524
|
const { x, y, refs, strategy, middlewareData, context: context2 } = react.useFloating({
|
|
3525
3525
|
open,
|
|
3526
3526
|
onOpenChange: setOpen,
|
|
@@ -3550,7 +3550,7 @@ function Tooltip(props) {
|
|
|
3550
3550
|
role
|
|
3551
3551
|
]);
|
|
3552
3552
|
const referenceProps = getReferenceProps({});
|
|
3553
|
-
|
|
3553
|
+
React3__namespace.default.useEffect(() => {
|
|
3554
3554
|
if (closeTimerRef.current) {
|
|
3555
3555
|
clearTimeout(closeTimerRef.current);
|
|
3556
3556
|
closeTimerRef.current = null;
|
|
@@ -3570,7 +3570,7 @@ function Tooltip(props) {
|
|
|
3570
3570
|
}
|
|
3571
3571
|
};
|
|
3572
3572
|
}, [open]);
|
|
3573
|
-
|
|
3573
|
+
React3__namespace.default.useEffect(() => {
|
|
3574
3574
|
if (!follow || !referenceRef.current) return;
|
|
3575
3575
|
const el = referenceRef.current;
|
|
3576
3576
|
const onMove = (e) => {
|
|
@@ -3585,7 +3585,7 @@ function Tooltip(props) {
|
|
|
3585
3585
|
el.removeEventListener("pointermove", onMove);
|
|
3586
3586
|
};
|
|
3587
3587
|
}, [follow, refs]);
|
|
3588
|
-
|
|
3588
|
+
React3__namespace.default.useEffect(() => {
|
|
3589
3589
|
if (!(open || isMounted)) return;
|
|
3590
3590
|
const el = containerRef.current;
|
|
3591
3591
|
if (!el) return;
|
|
@@ -3608,14 +3608,14 @@ function Tooltip(props) {
|
|
|
3608
3608
|
const arrowAnchorStyle = side.startsWith("top") ? { bottom: -anchorOffset } : side.startsWith("bottom") ? { top: -anchorOffset } : side.startsWith("left") ? { right: -anchorOffset } : { left: -anchorOffset };
|
|
3609
3609
|
const arrowStyle = side.startsWith("top") || side.startsWith("bottom") ? { left: arrowX || void 0, ...arrowAnchorStyle } : { top: arrowY || void 0, ...arrowAnchorStyle };
|
|
3610
3610
|
const transformOrigin = side.startsWith("top") ? "center bottom" : side.startsWith("bottom") ? "center top" : side.startsWith("left") ? "right center" : side.startsWith("right") ? "left center" : "center";
|
|
3611
|
-
const childrenArray =
|
|
3611
|
+
const childrenArray = React3__namespace.default.Children.toArray(children);
|
|
3612
3612
|
const hasMultipleChildren = childrenArray.length > 1;
|
|
3613
3613
|
let child;
|
|
3614
3614
|
if (hasMultipleChildren) {
|
|
3615
3615
|
child = /* @__PURE__ */ jsxRuntime.jsx("div", { style: { display: "inline-block" }, children });
|
|
3616
3616
|
} else {
|
|
3617
|
-
const only =
|
|
3618
|
-
const isDomElement =
|
|
3617
|
+
const only = React3__namespace.default.Children.only(children);
|
|
3618
|
+
const isDomElement = React3__namespace.default.isValidElement(only) && typeof only.type === "string";
|
|
3619
3619
|
child = isDomElement ? only : (
|
|
3620
3620
|
// Ensure the wrapper reliably captures mouseenter/pointerenter and can contain block elements
|
|
3621
3621
|
/* @__PURE__ */ jsxRuntime.jsx("div", { style: { display: "inline-block" }, children: only })
|
|
@@ -3634,7 +3634,7 @@ function Tooltip(props) {
|
|
|
3634
3634
|
originalRef.current = node;
|
|
3635
3635
|
}
|
|
3636
3636
|
};
|
|
3637
|
-
const cloned =
|
|
3637
|
+
const cloned = React3__namespace.default.cloneElement(
|
|
3638
3638
|
child,
|
|
3639
3639
|
// eslint-disable-next-line react-hooks/refs -- ref callback is invoked after render, not during
|
|
3640
3640
|
{
|
|
@@ -3647,14 +3647,14 @@ function Tooltip(props) {
|
|
|
3647
3647
|
let arrowEl = null;
|
|
3648
3648
|
let floatingNode = null;
|
|
3649
3649
|
const findRoleTooltipElement = (node) => {
|
|
3650
|
-
if (!
|
|
3650
|
+
if (!React3__namespace.default.isValidElement(node)) return null;
|
|
3651
3651
|
const el = node;
|
|
3652
3652
|
if (el.props?.role === "tooltip") return el;
|
|
3653
3653
|
const kids = el.props?.children;
|
|
3654
3654
|
if (!kids) return null;
|
|
3655
|
-
const arr =
|
|
3655
|
+
const arr = React3__namespace.default.Children.toArray(kids);
|
|
3656
3656
|
for (const c of arr) {
|
|
3657
|
-
if (
|
|
3657
|
+
if (React3__namespace.default.isValidElement(c)) {
|
|
3658
3658
|
const childEl = c;
|
|
3659
3659
|
if (childEl.props?.role === "tooltip") {
|
|
3660
3660
|
return childEl;
|
|
@@ -3663,9 +3663,8 @@ function Tooltip(props) {
|
|
|
3663
3663
|
}
|
|
3664
3664
|
return null;
|
|
3665
3665
|
};
|
|
3666
|
-
const
|
|
3667
|
-
|
|
3668
|
-
if (isCustomTooltip) {
|
|
3666
|
+
const customEl = findRoleTooltipElement(content);
|
|
3667
|
+
if (customEl) {
|
|
3669
3668
|
const el = customEl;
|
|
3670
3669
|
const childProps = el.props || {};
|
|
3671
3670
|
const floatingProps = getFloatingProps({});
|
|
@@ -3762,7 +3761,7 @@ function Tooltip(props) {
|
|
|
3762
3761
|
originalChildRef.current = node;
|
|
3763
3762
|
}
|
|
3764
3763
|
};
|
|
3765
|
-
return
|
|
3764
|
+
return React3__namespace.default.cloneElement(
|
|
3766
3765
|
el,
|
|
3767
3766
|
// eslint-disable-next-line react-hooks/refs -- ref callback is invoked after render, not during
|
|
3768
3767
|
{
|
|
@@ -3866,7 +3865,7 @@ function Block(props) {
|
|
|
3866
3865
|
tooltip,
|
|
3867
3866
|
...rest
|
|
3868
3867
|
} = anyProps;
|
|
3869
|
-
const fileInputRef =
|
|
3868
|
+
const fileInputRef = React3__namespace.useRef(null);
|
|
3870
3869
|
const isLoading = anyProps.isLoading;
|
|
3871
3870
|
const multiple = anyProps.multiple;
|
|
3872
3871
|
const is = anyProps.is;
|
|
@@ -3903,7 +3902,7 @@ function Block(props) {
|
|
|
3903
3902
|
...anyProps
|
|
3904
3903
|
}
|
|
3905
3904
|
) : extract.filepickerAllowed ? /* @__PURE__ */ jsxRuntime.jsxs("div", { onClick: () => fileInputRef.current?.click(), children: [
|
|
3906
|
-
|
|
3905
|
+
React3__namespace.createElement(
|
|
3907
3906
|
Comp,
|
|
3908
3907
|
{
|
|
3909
3908
|
cursor: "pointer",
|
|
@@ -3938,11 +3937,11 @@ function Block(props) {
|
|
|
3938
3937
|
value: ""
|
|
3939
3938
|
}
|
|
3940
3939
|
)
|
|
3941
|
-
] }) : extract.isVoidElement ?
|
|
3940
|
+
] }) : extract.isVoidElement ? React3__namespace.createElement(Comp, {
|
|
3942
3941
|
...isLoading && { "data-loading": isLoading },
|
|
3943
3942
|
onContextMenu: (e) => e.preventDefault(),
|
|
3944
3943
|
...initialStyles
|
|
3945
|
-
}) :
|
|
3944
|
+
}) : React3__namespace.createElement(
|
|
3946
3945
|
Comp,
|
|
3947
3946
|
{
|
|
3948
3947
|
...isLoading && { "data-loading": isLoading },
|
|
@@ -4042,22 +4041,22 @@ var saveTheme = (theme) => {
|
|
|
4042
4041
|
}
|
|
4043
4042
|
};
|
|
4044
4043
|
function useTheme() {
|
|
4045
|
-
const [value, setValue] =
|
|
4044
|
+
const [value, setValue] = React3__namespace.default.useState(() => {
|
|
4046
4045
|
return getDomTheme() ?? getStoredTheme() ?? "light";
|
|
4047
4046
|
});
|
|
4048
|
-
const valueRef =
|
|
4049
|
-
const isInternalRef =
|
|
4050
|
-
|
|
4047
|
+
const valueRef = React3__namespace.default.useRef(value);
|
|
4048
|
+
const isInternalRef = React3__namespace.default.useRef(false);
|
|
4049
|
+
React3__namespace.default.useEffect(() => {
|
|
4051
4050
|
valueRef.current = value;
|
|
4052
4051
|
}, [value]);
|
|
4053
|
-
|
|
4052
|
+
React3__namespace.default.useLayoutEffect(() => {
|
|
4054
4053
|
const domTheme = getDomTheme();
|
|
4055
4054
|
if (domTheme && domTheme !== valueRef.current) {
|
|
4056
4055
|
valueRef.current = domTheme;
|
|
4057
4056
|
setValue(domTheme);
|
|
4058
4057
|
}
|
|
4059
4058
|
}, []);
|
|
4060
|
-
|
|
4059
|
+
React3__namespace.default.useEffect(() => {
|
|
4061
4060
|
const ac = new AbortController();
|
|
4062
4061
|
window.addEventListener(
|
|
4063
4062
|
"storage",
|
|
@@ -4089,7 +4088,7 @@ function useTheme() {
|
|
|
4089
4088
|
);
|
|
4090
4089
|
return () => ac.abort();
|
|
4091
4090
|
}, []);
|
|
4092
|
-
const toggle =
|
|
4091
|
+
const toggle = React3__namespace.default.useCallback((theme) => {
|
|
4093
4092
|
const next = theme ?? (valueRef.current === "light" ? "dark" : "light");
|
|
4094
4093
|
valueRef.current = next;
|
|
4095
4094
|
setValue(next);
|
|
@@ -4102,8 +4101,8 @@ function useTheme() {
|
|
|
4102
4101
|
|
|
4103
4102
|
// src/react/index.ts
|
|
4104
4103
|
function useDebounce(value, delay = 500) {
|
|
4105
|
-
const [debouncedValue, setDebouncedValue] =
|
|
4106
|
-
|
|
4104
|
+
const [debouncedValue, setDebouncedValue] = React3__namespace.default.useState(value);
|
|
4105
|
+
React3__namespace.default.useEffect(() => {
|
|
4107
4106
|
const handler = setTimeout(() => {
|
|
4108
4107
|
setDebouncedValue(value);
|
|
4109
4108
|
}, delay);
|
|
@@ -4114,10 +4113,10 @@ function useDebounce(value, delay = 500) {
|
|
|
4114
4113
|
return debouncedValue;
|
|
4115
4114
|
}
|
|
4116
4115
|
function useThrottle(value, interval = 500) {
|
|
4117
|
-
const [throttledValue, setThrottledValue] =
|
|
4118
|
-
const lastUpdate =
|
|
4119
|
-
const timeoutRef =
|
|
4120
|
-
|
|
4116
|
+
const [throttledValue, setThrottledValue] = React3__namespace.default.useState(value);
|
|
4117
|
+
const lastUpdate = React3__namespace.default.useRef(0);
|
|
4118
|
+
const timeoutRef = React3__namespace.default.useRef(null);
|
|
4119
|
+
React3__namespace.default.useEffect(() => {
|
|
4121
4120
|
const now = Date.now();
|
|
4122
4121
|
const timeSinceLastUpdate = now - lastUpdate.current;
|
|
4123
4122
|
if (timeSinceLastUpdate >= interval) {
|
|
@@ -4143,11 +4142,11 @@ function useThrottle(value, interval = 500) {
|
|
|
4143
4142
|
function useMatchMedia2(queries, defaultValues = []) {
|
|
4144
4143
|
const initialValues = defaultValues.length ? defaultValues : Array(queries.length).fill(false);
|
|
4145
4144
|
const isClient = typeof window !== "undefined";
|
|
4146
|
-
const [value, setValue] =
|
|
4145
|
+
const [value, setValue] = React3__namespace.default.useState(() => {
|
|
4147
4146
|
if (!isClient) return initialValues;
|
|
4148
4147
|
return queries.map((q) => window.matchMedia(q).matches);
|
|
4149
4148
|
});
|
|
4150
|
-
|
|
4149
|
+
React3__namespace.default.useLayoutEffect(() => {
|
|
4151
4150
|
if (!isClient) return;
|
|
4152
4151
|
const mediaQueryLists = queries.map((q) => window.matchMedia(q));
|
|
4153
4152
|
const handler = () => {
|