@butternutbox/pawprint-native 0.10.7 → 0.10.8
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/.turbo/turbo-build.log +5 -5
- package/CHANGELOG.md +8 -0
- package/dist/index.cjs +811 -729
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +324 -242
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
- package/src/components/molecules/DatePicker/DatePicker.tsx +31 -26
- package/src/components/molecules/Drawer/Drawer.stories.tsx +110 -0
- package/src/components/molecules/Drawer/DrawerBody.tsx +42 -9
- package/src/components/molecules/Drawer/DrawerContent.tsx +101 -38
- package/src/components/molecules/Drawer/DrawerMeasureContext.ts +22 -0
- package/src/components/molecules/Radio/Radio.tsx +3 -0
package/dist/index.js
CHANGED
|
@@ -9,7 +9,7 @@ import ibmPlexSansCondensed400 from './ibm-plex-sans-condensed-400-normal.ttf';
|
|
|
9
9
|
import ibmPlexSansCondensed500 from './ibm-plex-sans-condensed-500-normal.ttf';
|
|
10
10
|
import ibmPlexSansCondensed600 from './ibm-plex-sans-condensed-600-normal.ttf';
|
|
11
11
|
import ibmPlexSansCondensed700 from './ibm-plex-sans-condensed-700-normal.ttf';
|
|
12
|
-
import
|
|
12
|
+
import React66, { createContext, forwardRef, useRef, useEffect, useState, useCallback, useMemo, useContext } from 'react';
|
|
13
13
|
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
14
14
|
import * as AvatarPrimitive from '@rn-primitives/avatar';
|
|
15
15
|
import { Text, View, Animated, Pressable, TextInput, Easing, StyleSheet, useWindowDimensions, PanResponder, Image, ScrollView, Keyboard, ActionSheetIOS, TouchableOpacity, Platform, Modal, TouchableWithoutFeedback, FlatList, Linking, Clipboard, Alert } from 'react-native';
|
|
@@ -190,7 +190,7 @@ var VARIANT_DEFAULTS = {
|
|
|
190
190
|
display: { size: "lg" }
|
|
191
191
|
};
|
|
192
192
|
var StyledText = styled50(Text)({});
|
|
193
|
-
var Typography =
|
|
193
|
+
var Typography = React66.forwardRef(
|
|
194
194
|
(props, ref) => {
|
|
195
195
|
const theme2 = useTheme();
|
|
196
196
|
const { typography, colour } = theme2.tokens.semantics;
|
|
@@ -280,7 +280,7 @@ var StyledIconRoot = styled50(View)(({ iconDimension }) => ({
|
|
|
280
280
|
width: iconDimension,
|
|
281
281
|
height: iconDimension
|
|
282
282
|
}));
|
|
283
|
-
var Icon =
|
|
283
|
+
var Icon = React66.forwardRef(
|
|
284
284
|
(_a, ref) => {
|
|
285
285
|
var _b = _a, {
|
|
286
286
|
icon: IconComponent,
|
|
@@ -3880,7 +3880,7 @@ var AVATAR_SIZE_TO_ICON_SIZE = {
|
|
|
3880
3880
|
md: "md",
|
|
3881
3881
|
lg: "xl"
|
|
3882
3882
|
};
|
|
3883
|
-
var AvatarRoot =
|
|
3883
|
+
var AvatarRoot = React66.forwardRef(
|
|
3884
3884
|
(_a, ref) => {
|
|
3885
3885
|
var _b = _a, {
|
|
3886
3886
|
src,
|
|
@@ -3939,7 +3939,7 @@ function getVisibleDots(count, activeIndex) {
|
|
|
3939
3939
|
const windowStart = Math.min(Math.max(activeIndex - 2, 0), count - 5);
|
|
3940
3940
|
return Array.from({ length: 5 }, (_, i) => windowStart + i);
|
|
3941
3941
|
}
|
|
3942
|
-
var CarouselControls =
|
|
3942
|
+
var CarouselControls = React66.forwardRef(
|
|
3943
3943
|
(_a, ref) => {
|
|
3944
3944
|
var _b = _a, { count, activeIndex, showBackground = true } = _b, props = __objRest(_b, ["count", "activeIndex", "showBackground"]);
|
|
3945
3945
|
const theme2 = useTheme();
|
|
@@ -4026,7 +4026,7 @@ var StyledBadge = styled50(View)(({ theme: theme2, badgeVariant, badgeSize, pinn
|
|
|
4026
4026
|
backgroundColor: backgroundColorMap[badgeVariant]
|
|
4027
4027
|
}, borderRadiusStyles), positionStyles);
|
|
4028
4028
|
});
|
|
4029
|
-
var Badge =
|
|
4029
|
+
var Badge = React66.forwardRef(
|
|
4030
4030
|
(_a, ref) => {
|
|
4031
4031
|
var _b = _a, {
|
|
4032
4032
|
variant = "primary",
|
|
@@ -4101,7 +4101,7 @@ var Badge = React65.forwardRef(
|
|
|
4101
4101
|
Badge.displayName = "Badge";
|
|
4102
4102
|
var parseTokenValue6 = (value) => parseFloat(value);
|
|
4103
4103
|
var StyledSpinner = styled50(View)({});
|
|
4104
|
-
var Spinner =
|
|
4104
|
+
var Spinner = React66.forwardRef(
|
|
4105
4105
|
(_a, ref) => {
|
|
4106
4106
|
var _b = _a, { size = "md", variant = "dark", style } = _b, rest = __objRest(_b, ["size", "variant", "style"]);
|
|
4107
4107
|
const theme2 = useTheme();
|
|
@@ -4208,7 +4208,7 @@ var StyledSpinnerWrapper = styled50(View)({
|
|
|
4208
4208
|
alignItems: "center",
|
|
4209
4209
|
justifyContent: "center"
|
|
4210
4210
|
});
|
|
4211
|
-
var Button =
|
|
4211
|
+
var Button = React66.forwardRef(
|
|
4212
4212
|
(_a, ref) => {
|
|
4213
4213
|
var _b = _a, {
|
|
4214
4214
|
variant = "filled",
|
|
@@ -4240,7 +4240,7 @@ var Button = React65.forwardRef(
|
|
|
4240
4240
|
const typographyKey = sizeToTypographyKey[size];
|
|
4241
4241
|
const typography = buttons.text[typographyKey];
|
|
4242
4242
|
resolveFont(typography.fontFamily, typography.fontWeight);
|
|
4243
|
-
const [pressed, setPressed] =
|
|
4243
|
+
const [pressed, setPressed] = React66.useState(false);
|
|
4244
4244
|
const getVariantStyles = (isPressed) => {
|
|
4245
4245
|
if (variant === "filled") {
|
|
4246
4246
|
const bgTokens = buttons.filledButton.colour.background[colour];
|
|
@@ -4351,7 +4351,7 @@ var StyledHint = styled50(View)(({
|
|
|
4351
4351
|
backgroundColor: hintVariantMap[hintVariant]
|
|
4352
4352
|
};
|
|
4353
4353
|
});
|
|
4354
|
-
var Hint =
|
|
4354
|
+
var Hint = React66.forwardRef(
|
|
4355
4355
|
(_a, ref) => {
|
|
4356
4356
|
var _b = _a, { variant = "default" } = _b, rest = __objRest(_b, ["variant"]);
|
|
4357
4357
|
return /* @__PURE__ */ jsx(StyledHint, __spreadValues({ ref, hintVariant: variant }, rest));
|
|
@@ -4393,7 +4393,7 @@ var StyledSpinnerWrapper2 = styled50(View)({
|
|
|
4393
4393
|
alignItems: "center",
|
|
4394
4394
|
justifyContent: "center"
|
|
4395
4395
|
});
|
|
4396
|
-
var IconButton =
|
|
4396
|
+
var IconButton = React66.forwardRef(
|
|
4397
4397
|
(_a, ref) => {
|
|
4398
4398
|
var _b = _a, {
|
|
4399
4399
|
icon: IconComponent,
|
|
@@ -4419,7 +4419,7 @@ var IconButton = React65.forwardRef(
|
|
|
4419
4419
|
const dimension = parseTokenValue9(sizeTokens.height);
|
|
4420
4420
|
const iconSizing = theme2.tokens.components.icons.sizing.icons.core;
|
|
4421
4421
|
const iconDimension = parseTokenValue9(iconSizing[sizeToIconSizeToken[size]]);
|
|
4422
|
-
const [pressed, setPressed] =
|
|
4422
|
+
const [pressed, setPressed] = React66.useState(false);
|
|
4423
4423
|
const getVariantStyles = (isPressed) => {
|
|
4424
4424
|
if (variant === "filled") {
|
|
4425
4425
|
const filled = buttons.iconButton.filledButton;
|
|
@@ -4502,7 +4502,7 @@ var StyledRoot2 = styled50(View)(({ illustrationHeight }) => ({
|
|
|
4502
4502
|
flexShrink: 0,
|
|
4503
4503
|
height: illustrationHeight
|
|
4504
4504
|
}));
|
|
4505
|
-
var Illustration =
|
|
4505
|
+
var Illustration = React66.forwardRef(
|
|
4506
4506
|
(_a, ref) => {
|
|
4507
4507
|
var _b = _a, {
|
|
4508
4508
|
illustration: IllustrationComponent,
|
|
@@ -4538,7 +4538,7 @@ var StyledLabelRow = styled50(View)(({ labelGap }) => ({
|
|
|
4538
4538
|
alignItems: "center",
|
|
4539
4539
|
gap: labelGap
|
|
4540
4540
|
}));
|
|
4541
|
-
var InputLabel =
|
|
4541
|
+
var InputLabel = React66.forwardRef(
|
|
4542
4542
|
(_a, ref) => {
|
|
4543
4543
|
var _b = _a, { optionalText, state = "default", children } = _b, rest = __objRest(_b, ["optionalText", "state", "children"]);
|
|
4544
4544
|
const theme2 = useTheme();
|
|
@@ -4735,54 +4735,57 @@ ForwardRef472.category = "core";
|
|
|
4735
4735
|
var PlayArrow = (props, ref) => /* @__PURE__ */ jsx(Svg, __spreadProps2(__spreadValues2(__spreadProps2(__spreadValues2({ xmlns: "http://www.w3.org/2000/svg", width: 24, height: 24 }, { fill: props.color || "currentColor" }), { viewBox: "0 0 24 24", ref }), props), { children: /* @__PURE__ */ jsx(Path, { d: "M8 6.82v10.36c0 .79.87 1.27 1.54.84l8.14-5.18a1 1 0 0 0 0-1.69L9.54 5.98A.998.998 0 0 0 8 6.82" }) }));
|
|
4736
4736
|
var ForwardRef482 = forwardRef(PlayArrow);
|
|
4737
4737
|
ForwardRef482.category = "core";
|
|
4738
|
-
var
|
|
4739
|
-
var ForwardRef492 = forwardRef(
|
|
4738
|
+
var Range = (props, ref) => /* @__PURE__ */ jsx(Svg, __spreadProps2(__spreadValues2(__spreadProps2(__spreadValues2({ xmlns: "http://www.w3.org/2000/svg", width: 24, height: 24 }, { fill: props.color || "currentColor" }), { viewBox: "0 0 24 24", ref }), props), { children: /* @__PURE__ */ jsx(Path, { d: "m5.83 12 2.46-2.46a.996.996 0 1 0-1.41-1.41L3.7 11.3a.996.996 0 0 0 0 1.41l3.18 3.17a.996.996 0 1 0 1.41-1.41zm12.34 0-2.46 2.46a.996.996 0 1 0 1.41 1.41l3.18-3.17a.996.996 0 0 0 0-1.41l-3.17-3.17a.996.996 0 1 0-1.41 1.41z" }) }));
|
|
4739
|
+
var ForwardRef492 = forwardRef(Range);
|
|
4740
4740
|
ForwardRef492.category = "core";
|
|
4741
|
-
var
|
|
4742
|
-
var ForwardRef502 = forwardRef(
|
|
4741
|
+
var Refresh = (props, ref) => /* @__PURE__ */ jsx(Svg, __spreadProps2(__spreadValues2(__spreadProps2(__spreadValues2({ xmlns: "http://www.w3.org/2000/svg", width: 24, height: 24 }, { fill: props.color || "currentColor" }), { viewBox: "0 0 24 24", ref }), props), { children: /* @__PURE__ */ jsx(Path, { d: "M17.65 6.35a7.95 7.95 0 0 0-6.48-2.31c-3.67.37-6.69 3.35-7.1 7.02C3.52 15.91 7.27 20 12 20a7.98 7.98 0 0 0 7.21-4.56c.32-.67-.16-1.44-.9-1.44-.37 0-.72.2-.88.53a5.994 5.994 0 0 1-6.8 3.31c-2.22-.49-4.01-2.3-4.48-4.52A6.002 6.002 0 0 1 12 6c1.66 0 3.14.69 4.22 1.78l-1.51 1.51c-.63.63-.19 1.71.7 1.71H19c.55 0 1-.45 1-1V6.41c0-.89-1.08-1.34-1.71-.71z" }) }));
|
|
4742
|
+
var ForwardRef502 = forwardRef(Refresh);
|
|
4743
4743
|
ForwardRef502.category = "core";
|
|
4744
|
-
var
|
|
4745
|
-
var
|
|
4746
|
-
var ForwardRef512 = forwardRef(RemoveCircle);
|
|
4744
|
+
var Remove = (props, ref) => /* @__PURE__ */ jsx(Svg, __spreadProps2(__spreadValues2(__spreadProps2(__spreadValues2({ xmlns: "http://www.w3.org/2000/svg", width: 24, height: 24 }, { fill: props.color || "currentColor" }), { viewBox: "0 0 24 24", ref }), props), { children: /* @__PURE__ */ jsx(Path, { d: "M18 13H6c-.55 0-1-.45-1-1s.45-1 1-1h12c.55 0 1 .45 1 1s-.45 1-1 1" }) }));
|
|
4745
|
+
var ForwardRef512 = forwardRef(Remove);
|
|
4747
4746
|
ForwardRef512.category = "core";
|
|
4748
|
-
var
|
|
4749
|
-
var
|
|
4750
|
-
var ForwardRef522 = forwardRef(
|
|
4747
|
+
var Remove_default = ForwardRef512;
|
|
4748
|
+
var RemoveCircle = (props, ref) => /* @__PURE__ */ jsx(Svg, __spreadProps2(__spreadValues2(__spreadProps2(__spreadValues2({ xmlns: "http://www.w3.org/2000/svg", width: 24, height: 24 }, { fill: props.color || "currentColor" }), { viewBox: "0 0 24 24", ref }), props), { children: /* @__PURE__ */ jsx(Path, { d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2m4 11H8c-.55 0-1-.45-1-1s.45-1 1-1h8c.55 0 1 .45 1 1s-.45 1-1 1" }) }));
|
|
4749
|
+
var ForwardRef522 = forwardRef(RemoveCircle);
|
|
4751
4750
|
ForwardRef522.category = "core";
|
|
4752
|
-
var
|
|
4753
|
-
var
|
|
4754
|
-
var ForwardRef532 = forwardRef(
|
|
4751
|
+
var RemoveCircle_default = ForwardRef522;
|
|
4752
|
+
var RemoveCircleOutline = (props, ref) => /* @__PURE__ */ jsx(Svg, __spreadProps2(__spreadValues2(__spreadProps2(__spreadValues2({ xmlns: "http://www.w3.org/2000/svg", width: 24, height: 24 }, { fill: props.color || "currentColor" }), { viewBox: "0 0 24 24", ref }), props), { children: /* @__PURE__ */ jsx(Path, { d: "M7 12c0 .55.45 1 1 1h8c.55 0 1-.45 1-1s-.45-1-1-1H8c-.55 0-1 .45-1 1m5-10C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2m0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8" }) }));
|
|
4753
|
+
var ForwardRef532 = forwardRef(RemoveCircleOutline);
|
|
4755
4754
|
ForwardRef532.category = "core";
|
|
4756
|
-
var
|
|
4757
|
-
var
|
|
4758
|
-
var ForwardRef542 = forwardRef(
|
|
4755
|
+
var RemoveCircleOutline_default = ForwardRef532;
|
|
4756
|
+
var Search = (props, ref) => /* @__PURE__ */ jsx(Svg, __spreadProps2(__spreadValues2(__spreadProps2(__spreadValues2({ xmlns: "http://www.w3.org/2000/svg", width: 24, height: 24 }, { fill: props.color || "currentColor" }), { viewBox: "0 0 24 24", ref }), props), { children: /* @__PURE__ */ jsx(Path, { d: "M15.5 14h-.79l-.28-.27a6.5 6.5 0 0 0 1.48-5.34c-.47-2.78-2.79-5-5.59-5.34a6.505 6.505 0 0 0-7.27 7.27c.34 2.8 2.56 5.12 5.34 5.59a6.5 6.5 0 0 0 5.34-1.48l.27.28v.79l4.25 4.25c.41.41 1.08.41 1.49 0s.41-1.08 0-1.49zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14" }) }));
|
|
4757
|
+
var ForwardRef542 = forwardRef(Search);
|
|
4759
4758
|
ForwardRef542.category = "core";
|
|
4760
|
-
var
|
|
4761
|
-
var
|
|
4759
|
+
var Search_default = ForwardRef542;
|
|
4760
|
+
var Settings = (props, ref) => /* @__PURE__ */ jsx(Svg, __spreadProps2(__spreadValues2(__spreadProps2(__spreadValues2({ xmlns: "http://www.w3.org/2000/svg", width: 24, height: 24 }, { fill: props.color || "currentColor" }), { viewBox: "0 0 24 24", ref }), props), { children: /* @__PURE__ */ jsx(Path, { d: "M19.5 12c0-.23-.01-.45-.03-.68l1.86-1.41c.4-.3.51-.86.26-1.3l-1.87-3.23a.987.987 0 0 0-1.25-.42l-2.15.91c-.37-.26-.76-.49-1.17-.68l-.29-2.31c-.06-.5-.49-.88-.99-.88h-3.73c-.51 0-.94.38-1 .88l-.29 2.31c-.41.19-.8.42-1.17.68l-2.15-.91c-.46-.2-1-.02-1.25.42L2.41 8.62c-.25.44-.14.99.26 1.3l1.86 1.41a7.3 7.3 0 0 0 0 1.35l-1.86 1.41c-.4.3-.51.86-.26 1.3l1.87 3.23c.25.44.79.62 1.25.42l2.15-.91c.37.26.76.49 1.17.68l.29 2.31c.06.5.49.88.99.88h3.73c.5 0 .93-.38.99-.88l.29-2.31c.41-.19.8-.42 1.17-.68l2.15.91c.46.2 1 .02 1.25-.42l1.87-3.23c.25-.44.14-.99-.26-1.3l-1.86-1.41c.03-.23.04-.45.04-.68m-7.46 3.5c-1.93 0-3.5-1.57-3.5-3.5s1.57-3.5 3.5-3.5 3.5 1.57 3.5 3.5-1.57 3.5-3.5 3.5" }) }));
|
|
4761
|
+
var ForwardRef552 = forwardRef(Settings);
|
|
4762
4762
|
ForwardRef552.category = "core";
|
|
4763
|
-
var
|
|
4764
|
-
var ForwardRef562 = forwardRef(
|
|
4763
|
+
var StarBorder = (props, ref) => /* @__PURE__ */ jsx(Svg, __spreadProps2(__spreadValues2(__spreadProps2(__spreadValues2({ xmlns: "http://www.w3.org/2000/svg", width: 24, height: 24 }, { fill: props.color || "currentColor" }), { viewBox: "0 0 24 24", ref }), props), { children: /* @__PURE__ */ jsx(Path, { d: "m19.65 9.04-4.84-.42-1.89-4.45c-.34-.81-1.5-.81-1.84 0L9.19 8.63l-4.83.41c-.88.07-1.24 1.17-.57 1.75l3.67 3.18-1.1 4.72c-.2.86.73 1.54 1.49 1.08l4.15-2.5 4.15 2.51c.76.46 1.69-.22 1.49-1.08l-1.1-4.73 3.67-3.18c.67-.58.32-1.68-.56-1.75M12 15.4l-3.76 2.27 1-4.28-3.32-2.88 4.38-.38L12 6.1l1.71 4.04 4.38.38-3.32 2.88 1 4.28z" }) }));
|
|
4764
|
+
var ForwardRef562 = forwardRef(StarBorder);
|
|
4765
4765
|
ForwardRef562.category = "core";
|
|
4766
|
-
var
|
|
4767
|
-
var ForwardRef572 = forwardRef(
|
|
4766
|
+
var StarHalf = (props, ref) => /* @__PURE__ */ jsx(Svg, __spreadProps2(__spreadValues2(__spreadProps2(__spreadValues2({ xmlns: "http://www.w3.org/2000/svg", width: 24, height: 24 }, { fill: props.color || "currentColor" }), { viewBox: "0 0 24 24", ref }), props), { children: /* @__PURE__ */ jsx(Path, { d: "m19.65 9.04-4.84-.42-1.89-4.45c-.34-.81-1.5-.81-1.84 0L9.19 8.63l-4.83.41c-.88.07-1.24 1.17-.57 1.75l3.67 3.18-1.1 4.72c-.2.86.73 1.54 1.49 1.08l4.15-2.5 4.15 2.51c.76.46 1.69-.22 1.49-1.08l-1.1-4.73 3.67-3.18c.67-.58.32-1.68-.56-1.75M12 15.4V6.1l1.71 4.04 4.38.38-3.32 2.88 1 4.28z" }) }));
|
|
4767
|
+
var ForwardRef572 = forwardRef(StarHalf);
|
|
4768
4768
|
ForwardRef572.category = "core";
|
|
4769
|
-
var
|
|
4770
|
-
var ForwardRef582 = forwardRef(
|
|
4769
|
+
var StarRate = (props, ref) => /* @__PURE__ */ jsx(Svg, __spreadProps2(__spreadValues2(__spreadProps2(__spreadValues2({ xmlns: "http://www.w3.org/2000/svg", width: 24, height: 24 }, { fill: props.color || "currentColor" }), { viewBox: "0 0 24 24", ref }), props), { children: /* @__PURE__ */ jsx(Path, { d: "m11.957 17.498 4.15 2.51c.76.46 1.69-.22 1.49-1.08l-1.1-4.72 3.67-3.18c.67-.58.31-1.68-.57-1.75l-4.83-.41-1.89-4.46c-.34-.81-1.5-.81-1.84 0l-1.89 4.45-4.83.41c-.88.07-1.24 1.17-.57 1.75l3.67 3.18-1.1 4.72c-.2.86.73 1.54 1.49 1.08z" }) }));
|
|
4770
|
+
var ForwardRef582 = forwardRef(StarRate);
|
|
4771
4771
|
ForwardRef582.category = "core";
|
|
4772
|
-
var
|
|
4773
|
-
var ForwardRef592 = forwardRef(
|
|
4772
|
+
var User = (props, ref) => /* @__PURE__ */ jsx(Svg, __spreadProps2(__spreadValues2(__spreadProps2(__spreadValues2({ xmlns: "http://www.w3.org/2000/svg", width: 24, height: 24 }, { fill: props.color || "currentColor" }), { viewBox: "0 0 24 24", ref }), props), { children: /* @__PURE__ */ jsx(Path, { d: "M12 12a4.665 4.665 0 0 0 4.667-4.667A4.665 4.665 0 0 0 12 2.667a4.665 4.665 0 0 0-4.667 4.666A4.665 4.665 0 0 0 12 12m0-7a2.34 2.34 0 0 1 2.333 2.333A2.34 2.34 0 0 1 12 9.667a2.34 2.34 0 0 1-2.333-2.334A2.34 2.34 0 0 1 12 5m0 8.167c-3.115 0-9.333 1.563-9.333 4.666v2.334a1.17 1.17 0 0 0 1.166 1.166h16.334a1.17 1.17 0 0 0 1.166-1.166v-2.334c0-3.103-6.218-4.666-9.333-4.666M19 19H5v-1.155c.233-.84 3.85-2.345 7-2.345s6.767 1.505 7 2.333z" }) }));
|
|
4773
|
+
var ForwardRef592 = forwardRef(User);
|
|
4774
4774
|
ForwardRef592.category = "core";
|
|
4775
|
-
var
|
|
4776
|
-
var
|
|
4777
|
-
var ForwardRef602 = forwardRef(VisibilityOff);
|
|
4775
|
+
var Visibility = (props, ref) => /* @__PURE__ */ jsx(Svg, __spreadProps2(__spreadValues2(__spreadProps2(__spreadValues2({ xmlns: "http://www.w3.org/2000/svg", width: 24, height: 24 }, { fill: props.color || "currentColor" }), { viewBox: "0 0 24 24", ref }), props), { children: /* @__PURE__ */ jsx(Path, { d: "M12 4.5C7 4.5 2.73 7.61 1 12c1.73 4.39 6 7.5 11 7.5s9.27-3.11 11-7.5c-1.73-4.39-6-7.5-11-7.5M12 17c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5m0-8c-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3-1.34-3-3-3" }) }));
|
|
4776
|
+
var ForwardRef602 = forwardRef(Visibility);
|
|
4778
4777
|
ForwardRef602.category = "core";
|
|
4779
|
-
var
|
|
4780
|
-
var
|
|
4781
|
-
var ForwardRef612 = forwardRef(
|
|
4778
|
+
var Visibility_default = ForwardRef602;
|
|
4779
|
+
var VisibilityOff = (props, ref) => /* @__PURE__ */ jsx(Svg, __spreadProps2(__spreadValues2(__spreadProps2(__spreadValues2({ xmlns: "http://www.w3.org/2000/svg", width: 24, height: 24 }, { fill: props.color || "currentColor" }), { viewBox: "0 0 24 24", ref }), props), { children: /* @__PURE__ */ jsx(Path, { d: "M12 6.5c2.76 0 5 2.24 5 5 0 .51-.1 1-.24 1.46l3.06 3.06c1.39-1.23 2.49-2.77 3.18-4.53C21.27 7.11 17 4 12 4c-1.27 0-2.49.2-3.64.57l2.17 2.17c.47-.14.96-.24 1.47-.24M2.71 3.16a.996.996 0 0 0 0 1.41l1.97 1.97A11.9 11.9 0 0 0 1 11.5C2.73 15.89 7 19 12 19c1.52 0 2.97-.3 4.31-.82l2.72 2.72a.996.996 0 1 0 1.41-1.41L4.13 3.16c-.39-.39-1.03-.39-1.42 0M12 16.5c-2.76 0-5-2.24-5-5 0-.77.18-1.5.49-2.14l1.57 1.57c-.03.18-.06.37-.06.57 0 1.66 1.34 3 3 3 .2 0 .38-.03.57-.07L14.14 16c-.65.32-1.37.5-2.14.5m2.97-5.33a2.97 2.97 0 0 0-2.64-2.64z" }) }));
|
|
4780
|
+
var ForwardRef612 = forwardRef(VisibilityOff);
|
|
4782
4781
|
ForwardRef612.category = "core";
|
|
4783
|
-
var
|
|
4784
|
-
var
|
|
4782
|
+
var VisibilityOff_default = ForwardRef612;
|
|
4783
|
+
var VolumeOff = (props, ref) => /* @__PURE__ */ jsx(Svg, __spreadProps2(__spreadValues2(__spreadProps2(__spreadValues2({ xmlns: "http://www.w3.org/2000/svg", width: 24, height: 24 }, { fill: props.color || "currentColor" }), { viewBox: "0 0 24 24", ref }), props), { children: /* @__PURE__ */ jsx(Path, { d: "M3.63 3.63a.996.996 0 0 0 0 1.41L7.29 8.7 7 9H4c-.55 0-1 .45-1 1v4c0 .55.45 1 1 1h3l3.29 3.29c.63.63 1.71.18 1.71-.71v-4.17l4.18 4.18c-.49.37-1.02.68-1.6.91-.36.15-.58.53-.58.92 0 .72.73 1.18 1.39.91.8-.33 1.55-.77 2.22-1.31l1.34 1.34a.996.996 0 1 0 1.41-1.41L5.05 3.63c-.39-.39-1.02-.39-1.42 0M19 12c0 .82-.15 1.61-.41 2.34l1.53 1.53c.56-1.17.88-2.48.88-3.87 0-3.83-2.4-7.11-5.78-8.4-.59-.23-1.22.23-1.22.86v.19c0 .38.25.71.61.85C17.18 6.54 19 9.06 19 12m-8.71-6.29-.17.17L12 7.76V6.41c0-.89-1.08-1.33-1.71-.7M16.5 12A4.5 4.5 0 0 0 14 7.97v1.79l2.48 2.48c.01-.08.02-.16.02-.24" }) }));
|
|
4784
|
+
var ForwardRef622 = forwardRef(VolumeOff);
|
|
4785
4785
|
ForwardRef622.category = "core";
|
|
4786
|
+
var VolumeUp = (props, ref) => /* @__PURE__ */ jsx(Svg, __spreadProps2(__spreadValues2(__spreadProps2(__spreadValues2({ xmlns: "http://www.w3.org/2000/svg", width: 24, height: 24 }, { fill: props.color || "currentColor" }), { viewBox: "0 0 24 24", ref }), props), { children: /* @__PURE__ */ jsx(Path, { d: "M3 10v4c0 .55.45 1 1 1h3l3.29 3.29c.63.63 1.71.18 1.71-.71V6.41c0-.89-1.08-1.34-1.71-.71L7 9H4c-.55 0-1 .45-1 1m13.5 2A4.5 4.5 0 0 0 14 7.97v8.05c1.48-.73 2.5-2.25 2.5-4.02M14 4.45v.2c0 .38.25.71.6.85A7 7 0 0 1 19 12c0 2.94-1.82 5.47-4.4 6.5-.36.14-.6.47-.6.85v.2c0 .63.63 1.07 1.21.85A8.98 8.98 0 0 0 21 12c0-3.84-2.4-7.11-5.79-8.4-.58-.23-1.21.22-1.21.85" }) }));
|
|
4787
|
+
var ForwardRef632 = forwardRef(VolumeUp);
|
|
4788
|
+
ForwardRef632.category = "core";
|
|
4786
4789
|
var parseTokenValue12 = (value) => parseFloat(value);
|
|
4787
4790
|
var StyledInputWrapper = styled50(Animated.View)(({ theme: theme2, isDisabled, containerWidth, containerHeight }) => {
|
|
4788
4791
|
const { spacing, colour, borderRadius, size } = theme2.tokens.components.inputs;
|
|
@@ -4835,7 +4838,7 @@ var StyledIconSlot = styled50(View)({
|
|
|
4835
4838
|
justifyContent: "center",
|
|
4836
4839
|
flexShrink: 0
|
|
4837
4840
|
});
|
|
4838
|
-
var InputField =
|
|
4841
|
+
var InputField = React66.forwardRef(
|
|
4839
4842
|
(_a, ref) => {
|
|
4840
4843
|
var _b = _a, {
|
|
4841
4844
|
leadingIcon,
|
|
@@ -4994,7 +4997,7 @@ var InputField = React65.forwardRef(
|
|
|
4994
4997
|
}
|
|
4995
4998
|
);
|
|
4996
4999
|
InputField.displayName = "Input.Field";
|
|
4997
|
-
var InputText =
|
|
5000
|
+
var InputText = React66.forwardRef(
|
|
4998
5001
|
(_a, ref) => {
|
|
4999
5002
|
var _b = _a, { placeholderTextColor } = _b, rest = __objRest(_b, ["placeholderTextColor"]);
|
|
5000
5003
|
const theme2 = useTheme();
|
|
@@ -5013,7 +5016,7 @@ var StyledDescriptionRow = styled50(View)({
|
|
|
5013
5016
|
flexDirection: "row",
|
|
5014
5017
|
alignItems: "center"
|
|
5015
5018
|
});
|
|
5016
|
-
var InputDescription =
|
|
5019
|
+
var InputDescription = React66.forwardRef(
|
|
5017
5020
|
(_a, ref) => {
|
|
5018
5021
|
var _b = _a, { state = "default", children } = _b, rest = __objRest(_b, ["state", "children"]);
|
|
5019
5022
|
const theme2 = useTheme();
|
|
@@ -5033,7 +5036,7 @@ var StyledErrorRow = styled50(View)({
|
|
|
5033
5036
|
flexDirection: "row",
|
|
5034
5037
|
alignItems: "center"
|
|
5035
5038
|
});
|
|
5036
|
-
var InputError =
|
|
5039
|
+
var InputError = React66.forwardRef(
|
|
5037
5040
|
(_a, ref) => {
|
|
5038
5041
|
var _b = _a, { children } = _b, rest = __objRest(_b, ["children"]);
|
|
5039
5042
|
const theme2 = useTheme();
|
|
@@ -5056,7 +5059,7 @@ var StyledRoot3 = styled50(View)(({ theme: theme2 }) => {
|
|
|
5056
5059
|
gap: parseTokenValue13(spacing.gap)
|
|
5057
5060
|
};
|
|
5058
5061
|
});
|
|
5059
|
-
var InputRoot =
|
|
5062
|
+
var InputRoot = React66.forwardRef(
|
|
5060
5063
|
(_a, ref) => {
|
|
5061
5064
|
var _b = _a, {
|
|
5062
5065
|
label,
|
|
@@ -5100,7 +5103,7 @@ var Input = Object.assign(InputRoot, {
|
|
|
5100
5103
|
Description: InputDescription,
|
|
5101
5104
|
Error: InputError
|
|
5102
5105
|
});
|
|
5103
|
-
var Link =
|
|
5106
|
+
var Link = React66.forwardRef(
|
|
5104
5107
|
(_a, ref) => {
|
|
5105
5108
|
var _b = _a, {
|
|
5106
5109
|
size = "md",
|
|
@@ -7698,7 +7701,7 @@ var StyledRoot4 = styled50(View)({
|
|
|
7698
7701
|
justifyContent: "center",
|
|
7699
7702
|
flexShrink: 0
|
|
7700
7703
|
});
|
|
7701
|
-
var Logo =
|
|
7704
|
+
var Logo = React66.forwardRef(
|
|
7702
7705
|
(_a, ref) => {
|
|
7703
7706
|
var _b = _a, { brand, variant = "primary", "aria-label": ariaLabel } = _b, rest = __objRest(_b, ["brand", "variant", "aria-label"]);
|
|
7704
7707
|
const effectiveVariant = brand === "bcorp" ? "primary" : variant;
|
|
@@ -7737,7 +7740,7 @@ var StyledInputContainer = styled50(View)(({ hasInlineHelp }) => ({
|
|
|
7737
7740
|
flexDirection: "column",
|
|
7738
7741
|
gap: hasInlineHelp ? 2 : 0
|
|
7739
7742
|
}));
|
|
7740
|
-
var NumberInputField =
|
|
7743
|
+
var NumberInputField = React66.forwardRef((_a, ref) => {
|
|
7741
7744
|
var _b = _a, { fieldText, inlineHelpText } = _b, props = __objRest(_b, ["fieldText", "inlineHelpText"]);
|
|
7742
7745
|
const theme2 = useTheme();
|
|
7743
7746
|
const { colour, description } = theme2.tokens.components.inputs;
|
|
@@ -7834,7 +7837,7 @@ var StyledRoot5 = styled50(View)(({ theme: theme2 }) => {
|
|
|
7834
7837
|
gap: parseTokenValue15(spacing.gap)
|
|
7835
7838
|
};
|
|
7836
7839
|
});
|
|
7837
|
-
var NumberInputRoot =
|
|
7840
|
+
var NumberInputRoot = React66.forwardRef(
|
|
7838
7841
|
(_a, ref) => {
|
|
7839
7842
|
var _b = _a, {
|
|
7840
7843
|
label,
|
|
@@ -7929,7 +7932,7 @@ var StyledContent = styled50(View)(({ contentGap }) => ({
|
|
|
7929
7932
|
flex: 1,
|
|
7930
7933
|
minWidth: 0
|
|
7931
7934
|
}));
|
|
7932
|
-
var Switch =
|
|
7935
|
+
var Switch = React66.forwardRef(
|
|
7933
7936
|
(_a, ref) => {
|
|
7934
7937
|
var _b = _a, {
|
|
7935
7938
|
label,
|
|
@@ -7949,7 +7952,7 @@ var Switch = React65.forwardRef(
|
|
|
7949
7952
|
const theme2 = useTheme();
|
|
7950
7953
|
const { size, colour, opacity, borderWidth, spacing, typography } = theme2.tokens.components.switch;
|
|
7951
7954
|
const isControlled = controlledChecked !== void 0;
|
|
7952
|
-
const [internalChecked, setInternalChecked] =
|
|
7955
|
+
const [internalChecked, setInternalChecked] = React66.useState(defaultChecked);
|
|
7953
7956
|
const isChecked = isControlled ? controlledChecked : internalChecked;
|
|
7954
7957
|
const controlWidth = parseTokenValue16(size.control.width);
|
|
7955
7958
|
const controlHeight = parseTokenValue16(size.control.height);
|
|
@@ -8055,7 +8058,7 @@ var StyledTag = styled50(View)(({ theme: theme2, tagVariant, tagSize }) => {
|
|
|
8055
8058
|
backgroundColor: backgroundColorMap[tagVariant]
|
|
8056
8059
|
};
|
|
8057
8060
|
});
|
|
8058
|
-
var Tag =
|
|
8061
|
+
var Tag = React66.forwardRef(
|
|
8059
8062
|
(_a, ref) => {
|
|
8060
8063
|
var _b = _a, { variant = "primary", size = "medium", icon, children } = _b, rest = __objRest(_b, ["variant", "size", "icon", "children"]);
|
|
8061
8064
|
const theme2 = useTheme();
|
|
@@ -8155,7 +8158,7 @@ var IconWrapper2 = styled50(View)(({ side }) => {
|
|
|
8155
8158
|
zIndex: 1
|
|
8156
8159
|
};
|
|
8157
8160
|
});
|
|
8158
|
-
var TextAreaField =
|
|
8161
|
+
var TextAreaField = React66.forwardRef(
|
|
8159
8162
|
(_a, ref) => {
|
|
8160
8163
|
var _b = _a, {
|
|
8161
8164
|
leadingIcon,
|
|
@@ -8348,7 +8351,7 @@ var StyledCharCountWrapper = styled50(View)(({ charCountGap, charCountPadding })
|
|
|
8348
8351
|
gap: charCountGap,
|
|
8349
8352
|
paddingLeft: charCountPadding
|
|
8350
8353
|
}));
|
|
8351
|
-
var TextAreaLabel =
|
|
8354
|
+
var TextAreaLabel = React66.forwardRef(
|
|
8352
8355
|
(_a, ref) => {
|
|
8353
8356
|
var _b = _a, {
|
|
8354
8357
|
optionalText,
|
|
@@ -8412,7 +8415,7 @@ var StyledRoot6 = styled50(View)(({ theme: theme2 }) => {
|
|
|
8412
8415
|
gap: parseTokenValue20(spacing.gap)
|
|
8413
8416
|
};
|
|
8414
8417
|
});
|
|
8415
|
-
var TextAreaRoot =
|
|
8418
|
+
var TextAreaRoot = React66.forwardRef(
|
|
8416
8419
|
(_a, ref) => {
|
|
8417
8420
|
var _b = _a, {
|
|
8418
8421
|
label,
|
|
@@ -8439,8 +8442,8 @@ var TextAreaRoot = React65.forwardRef(
|
|
|
8439
8442
|
"defaultValue",
|
|
8440
8443
|
"onChangeText"
|
|
8441
8444
|
]);
|
|
8442
|
-
const [charCount, setCharCount] =
|
|
8443
|
-
|
|
8445
|
+
const [charCount, setCharCount] = React66.useState(0);
|
|
8446
|
+
React66.useEffect(() => {
|
|
8444
8447
|
if (value !== void 0) {
|
|
8445
8448
|
setCharCount(String(value).length);
|
|
8446
8449
|
} else if (defaultValue !== void 0) {
|
|
@@ -8493,7 +8496,7 @@ var TextArea = Object.assign(TextAreaRoot, {
|
|
|
8493
8496
|
Description: InputDescription,
|
|
8494
8497
|
Error: InputError
|
|
8495
8498
|
});
|
|
8496
|
-
var AccordionContext =
|
|
8499
|
+
var AccordionContext = React66.createContext({
|
|
8497
8500
|
openValues: [],
|
|
8498
8501
|
toggle: () => {
|
|
8499
8502
|
},
|
|
@@ -8524,7 +8527,7 @@ var StyledDivider = styled50(View)(({ dividerColor, dividerMarginTop }) => ({
|
|
|
8524
8527
|
backgroundColor: dividerColor,
|
|
8525
8528
|
marginTop: dividerMarginTop
|
|
8526
8529
|
}));
|
|
8527
|
-
var AccordionItem =
|
|
8530
|
+
var AccordionItem = React66.forwardRef(
|
|
8528
8531
|
(_a, ref) => {
|
|
8529
8532
|
var _b = _a, { title, children, value, disabled: itemDisabled } = _b, rest = __objRest(_b, ["title", "children", "value", "disabled"]);
|
|
8530
8533
|
const theme2 = useTheme();
|
|
@@ -8534,7 +8537,7 @@ var AccordionItem = React65.forwardRef(
|
|
|
8534
8537
|
toggle,
|
|
8535
8538
|
disabled: rootDisabled,
|
|
8536
8539
|
size
|
|
8537
|
-
} =
|
|
8540
|
+
} = React66.useContext(AccordionContext);
|
|
8538
8541
|
const itemValue = value != null ? value : title;
|
|
8539
8542
|
const isOpen = openValues.includes(itemValue);
|
|
8540
8543
|
const isDisabled = itemDisabled || rootDisabled;
|
|
@@ -8595,7 +8598,7 @@ var AccordionItem = React65.forwardRef(
|
|
|
8595
8598
|
}
|
|
8596
8599
|
);
|
|
8597
8600
|
AccordionItem.displayName = "Accordion.Item";
|
|
8598
|
-
var AccordionRoot =
|
|
8601
|
+
var AccordionRoot = React66.forwardRef(
|
|
8599
8602
|
(_a, ref) => {
|
|
8600
8603
|
var _b = _a, {
|
|
8601
8604
|
children,
|
|
@@ -8617,11 +8620,11 @@ var AccordionRoot = React65.forwardRef(
|
|
|
8617
8620
|
const theme2 = useTheme();
|
|
8618
8621
|
const { accordion } = theme2.tokens.components;
|
|
8619
8622
|
const isControlled = controlledValue !== void 0;
|
|
8620
|
-
const [internalValue, setInternalValue] =
|
|
8623
|
+
const [internalValue, setInternalValue] = React66.useState(
|
|
8621
8624
|
defaultValue != null ? defaultValue : []
|
|
8622
8625
|
);
|
|
8623
8626
|
const openValues = isControlled ? controlledValue : internalValue;
|
|
8624
|
-
const toggle =
|
|
8627
|
+
const toggle = React66.useCallback(
|
|
8625
8628
|
(itemValue) => {
|
|
8626
8629
|
const isOpen = openValues.includes(itemValue);
|
|
8627
8630
|
let next;
|
|
@@ -8639,7 +8642,7 @@ var AccordionRoot = React65.forwardRef(
|
|
|
8639
8642
|
},
|
|
8640
8643
|
[openValues, multiple, isControlled, onValueChange]
|
|
8641
8644
|
);
|
|
8642
|
-
const ctx =
|
|
8645
|
+
const ctx = React66.useMemo(
|
|
8643
8646
|
() => ({ openValues, toggle, disabled, size }),
|
|
8644
8647
|
[openValues, toggle, disabled, size]
|
|
8645
8648
|
);
|
|
@@ -8769,7 +8772,7 @@ function buildDelayedEntering(variant, delayMs) {
|
|
|
8769
8772
|
b.delay(delayMs);
|
|
8770
8773
|
return b;
|
|
8771
8774
|
}
|
|
8772
|
-
var Animated5 =
|
|
8775
|
+
var Animated5 = React66.forwardRef(
|
|
8773
8776
|
(_a, ref) => {
|
|
8774
8777
|
var _b = _a, { variant = "fade", delay, exit = true, children } = _b, props = __objRest(_b, ["variant", "delay", "exit", "children"]);
|
|
8775
8778
|
const delayMs = delay !== void 0 && delay > 0 ? Math.round(delay * 1e3) : 0;
|
|
@@ -8787,7 +8790,7 @@ var Animated5 = React65.forwardRef(
|
|
|
8787
8790
|
}
|
|
8788
8791
|
);
|
|
8789
8792
|
Animated5.displayName = "Animated";
|
|
8790
|
-
var DrawerContext =
|
|
8793
|
+
var DrawerContext = React66.createContext({
|
|
8791
8794
|
isOpen: false,
|
|
8792
8795
|
modalVisible: false,
|
|
8793
8796
|
openDrawer: () => {
|
|
@@ -8797,9 +8800,9 @@ var DrawerContext = React65.createContext({
|
|
|
8797
8800
|
onExitComplete: () => {
|
|
8798
8801
|
}
|
|
8799
8802
|
});
|
|
8800
|
-
var useDrawerContext = () =>
|
|
8803
|
+
var useDrawerContext = () => React66.useContext(DrawerContext);
|
|
8801
8804
|
var FADE_DURATION = 220;
|
|
8802
|
-
var DrawerOverlay =
|
|
8805
|
+
var DrawerOverlay = React66.forwardRef(({ accessible = false }, _ref) => {
|
|
8803
8806
|
const theme2 = useTheme();
|
|
8804
8807
|
const { isOpen, closeDrawer } = useDrawerContext();
|
|
8805
8808
|
const opacity = useRef(new Animated.Value(0)).current;
|
|
@@ -8833,12 +8836,14 @@ var DrawerOverlay = React65.forwardRef(({ accessible = false }, _ref) => {
|
|
|
8833
8836
|
);
|
|
8834
8837
|
});
|
|
8835
8838
|
DrawerOverlay.displayName = "Drawer.Overlay";
|
|
8836
|
-
var DrawerDragContext =
|
|
8837
|
-
var useDrawerDragContext = () =>
|
|
8838
|
-
var
|
|
8839
|
-
var
|
|
8840
|
-
var
|
|
8841
|
-
var
|
|
8839
|
+
var DrawerDragContext = React66.createContext(null);
|
|
8840
|
+
var useDrawerDragContext = () => React66.useContext(DrawerDragContext);
|
|
8841
|
+
var DrawerMeasureContext = React66.createContext(null);
|
|
8842
|
+
var useDrawerMeasureContext = () => React66.useContext(DrawerMeasureContext);
|
|
8843
|
+
var DrawerFooterContext = React66.createContext(false);
|
|
8844
|
+
var useDrawerFooterContext = () => React66.useContext(DrawerFooterContext);
|
|
8845
|
+
var DrawerHeaderContext = React66.createContext(null);
|
|
8846
|
+
var useDrawerHeaderContext = () => React66.useContext(DrawerHeaderContext);
|
|
8842
8847
|
var OPEN_DURATION = 320;
|
|
8843
8848
|
var CLOSE_DURATION = 220;
|
|
8844
8849
|
var DISMISS_THRESHOLD = 80;
|
|
@@ -8874,7 +8879,7 @@ var StyledPanel2 = styled50(View)(
|
|
|
8874
8879
|
overflow: "hidden"
|
|
8875
8880
|
})
|
|
8876
8881
|
);
|
|
8877
|
-
var DrawerContent =
|
|
8882
|
+
var DrawerContent = React66.forwardRef(
|
|
8878
8883
|
(_a, ref) => {
|
|
8879
8884
|
var _b = _a, { children } = _b, props = __objRest(_b, ["children"]);
|
|
8880
8885
|
var _a2;
|
|
@@ -8884,6 +8889,7 @@ var DrawerContent = React65.forwardRef(
|
|
|
8884
8889
|
const { isOpen, closeDrawer, onExitComplete } = useDrawerContext();
|
|
8885
8890
|
const { height: windowHeight } = useWindowDimensions();
|
|
8886
8891
|
const maxHeight = windowHeight * 0.9;
|
|
8892
|
+
const bodyMaxHeight = windowHeight - 300;
|
|
8887
8893
|
const closeDrawerRef = useRef(closeDrawer);
|
|
8888
8894
|
useEffect(() => {
|
|
8889
8895
|
closeDrawerRef.current = closeDrawer;
|
|
@@ -8955,19 +8961,60 @@ var DrawerContent = React65.forwardRef(
|
|
|
8955
8961
|
}, [isOpen, runEntry, runExit]);
|
|
8956
8962
|
const onLayout = useCallback(
|
|
8957
8963
|
({ nativeEvent }) => {
|
|
8964
|
+
if (entryRanRef.current) return;
|
|
8958
8965
|
const h = nativeEvent.layout.height;
|
|
8959
8966
|
const capped = Math.min(h, maxHeight);
|
|
8960
|
-
if (capped
|
|
8967
|
+
if (capped <= 0) return;
|
|
8968
|
+
if (capped !== panelHeightRef.current) {
|
|
8961
8969
|
setPanelHeight(capped);
|
|
8962
8970
|
panelHeightRef.current = capped;
|
|
8963
8971
|
}
|
|
8964
|
-
if (isOpenRef.current
|
|
8965
|
-
panelHeightRef.current = capped;
|
|
8972
|
+
if (isOpenRef.current) {
|
|
8966
8973
|
runEntry();
|
|
8967
8974
|
}
|
|
8968
8975
|
},
|
|
8969
8976
|
[runEntry, maxHeight]
|
|
8970
8977
|
);
|
|
8978
|
+
const chromeRef = useRef(0);
|
|
8979
|
+
const bodyContentRef = useRef(0);
|
|
8980
|
+
const applyDesiredHeight = useCallback(() => {
|
|
8981
|
+
const chrome = chromeRef.current;
|
|
8982
|
+
const content = bodyContentRef.current;
|
|
8983
|
+
const current = panelHeightRef.current;
|
|
8984
|
+
if (chrome <= 0 || content <= 0 || current <= 0) return;
|
|
8985
|
+
const desired = Math.min(
|
|
8986
|
+
chrome + Math.min(content, bodyMaxHeight),
|
|
8987
|
+
maxHeight
|
|
8988
|
+
);
|
|
8989
|
+
if (Math.abs(desired - current) > 1) {
|
|
8990
|
+
panelHeightRef.current = desired;
|
|
8991
|
+
setPanelHeight(desired);
|
|
8992
|
+
}
|
|
8993
|
+
}, [maxHeight, bodyMaxHeight]);
|
|
8994
|
+
const setBodyFrameHeight = useCallback(
|
|
8995
|
+
(frameHeight) => {
|
|
8996
|
+
if (chromeRef.current <= 0) {
|
|
8997
|
+
const current = panelHeightRef.current;
|
|
8998
|
+
if (frameHeight > 0 && current > frameHeight) {
|
|
8999
|
+
chromeRef.current = current - frameHeight;
|
|
9000
|
+
}
|
|
9001
|
+
}
|
|
9002
|
+
applyDesiredHeight();
|
|
9003
|
+
},
|
|
9004
|
+
[applyDesiredHeight]
|
|
9005
|
+
);
|
|
9006
|
+
const setBodyContentHeight = useCallback(
|
|
9007
|
+
(contentHeight) => {
|
|
9008
|
+
if (contentHeight <= 0) return;
|
|
9009
|
+
bodyContentRef.current = contentHeight;
|
|
9010
|
+
applyDesiredHeight();
|
|
9011
|
+
},
|
|
9012
|
+
[applyDesiredHeight]
|
|
9013
|
+
);
|
|
9014
|
+
const measureContextValue = useMemo(
|
|
9015
|
+
() => ({ setBodyFrameHeight, setBodyContentHeight }),
|
|
9016
|
+
[setBodyFrameHeight, setBodyContentHeight]
|
|
9017
|
+
);
|
|
8971
9018
|
const panResponder = useRef(
|
|
8972
9019
|
PanResponder.create({
|
|
8973
9020
|
// Claim the responder as soon as a touch starts on the grabber so the
|
|
@@ -9026,16 +9073,16 @@ var DrawerContent = React65.forwardRef(
|
|
|
9026
9073
|
() => ({ panHandlers: panResponder.panHandlers }),
|
|
9027
9074
|
[panResponder.panHandlers]
|
|
9028
9075
|
);
|
|
9029
|
-
const hasFooter =
|
|
9030
|
-
(child) =>
|
|
9076
|
+
const hasFooter = React66.Children.toArray(children).some(
|
|
9077
|
+
(child) => React66.isValidElement(child) && child.type.displayName === "Drawer.Footer"
|
|
9031
9078
|
);
|
|
9032
|
-
const headerChild =
|
|
9033
|
-
(child) =>
|
|
9079
|
+
const headerChild = React66.Children.toArray(children).find(
|
|
9080
|
+
(child) => React66.isValidElement(child) && child.type.displayName === "Drawer.Header"
|
|
9034
9081
|
);
|
|
9035
9082
|
const headerContextValue = headerChild != null ? {
|
|
9036
9083
|
variant: (_a2 = headerChild.props.variant) != null ? _a2 : "titleAndText"
|
|
9037
9084
|
} : null;
|
|
9038
|
-
return /* @__PURE__ */ jsx(DrawerHeaderContext.Provider, { value: headerContextValue, children: /* @__PURE__ */ jsx(DrawerFooterContext.Provider, { value: hasFooter, children: /* @__PURE__ */ jsx(DrawerDragContext.Provider, { value: dragContextValue, children: /* @__PURE__ */ jsx(
|
|
9085
|
+
return /* @__PURE__ */ jsx(DrawerHeaderContext.Provider, { value: headerContextValue, children: /* @__PURE__ */ jsx(DrawerFooterContext.Provider, { value: hasFooter, children: /* @__PURE__ */ jsx(DrawerMeasureContext.Provider, { value: measureContextValue, children: /* @__PURE__ */ jsx(DrawerDragContext.Provider, { value: dragContextValue, children: /* @__PURE__ */ jsx(
|
|
9039
9086
|
Animated.View,
|
|
9040
9087
|
{
|
|
9041
9088
|
style: [
|
|
@@ -9065,7 +9112,7 @@ var DrawerContent = React65.forwardRef(
|
|
|
9065
9112
|
})
|
|
9066
9113
|
)
|
|
9067
9114
|
}
|
|
9068
|
-
) }) }) });
|
|
9115
|
+
) }) }) }) });
|
|
9069
9116
|
}
|
|
9070
9117
|
);
|
|
9071
9118
|
DrawerContent.displayName = "Drawer.Content";
|
|
@@ -9093,7 +9140,7 @@ var StyledBar = styled50(View)(({ barWidth, barHeight, barBorderRadius, barColor
|
|
|
9093
9140
|
borderRadius: barBorderRadius,
|
|
9094
9141
|
backgroundColor: barColor
|
|
9095
9142
|
}));
|
|
9096
|
-
var DrawerGrabber =
|
|
9143
|
+
var DrawerGrabber = React66.forwardRef(
|
|
9097
9144
|
(props, ref) => {
|
|
9098
9145
|
var _a;
|
|
9099
9146
|
const theme2 = useTheme();
|
|
@@ -9121,7 +9168,7 @@ var DrawerGrabber = React65.forwardRef(
|
|
|
9121
9168
|
);
|
|
9122
9169
|
DrawerGrabber.displayName = "Drawer.Grabber";
|
|
9123
9170
|
var parseTokenValue24 = (value) => parseFloat(value);
|
|
9124
|
-
var DrawerClose =
|
|
9171
|
+
var DrawerClose = React66.forwardRef(
|
|
9125
9172
|
(_a, ref) => {
|
|
9126
9173
|
var _b = _a, { "aria-label": ariaLabel = "Close" } = _b, props = __objRest(_b, ["aria-label"]);
|
|
9127
9174
|
const theme2 = useTheme();
|
|
@@ -9234,8 +9281,8 @@ var StyledTitleContent = styled50(View)(
|
|
|
9234
9281
|
function splitChildren(children) {
|
|
9235
9282
|
let closeChild = null;
|
|
9236
9283
|
const otherChildren = [];
|
|
9237
|
-
|
|
9238
|
-
if (
|
|
9284
|
+
React66.Children.forEach(children, (child) => {
|
|
9285
|
+
if (React66.isValidElement(child) && child.type === DrawerClose) {
|
|
9239
9286
|
closeChild = child;
|
|
9240
9287
|
} else {
|
|
9241
9288
|
otherChildren.push(child);
|
|
@@ -9243,7 +9290,7 @@ function splitChildren(children) {
|
|
|
9243
9290
|
});
|
|
9244
9291
|
return { closeChild, otherChildren };
|
|
9245
9292
|
}
|
|
9246
|
-
var DrawerHeader =
|
|
9293
|
+
var DrawerHeader = React66.forwardRef(
|
|
9247
9294
|
(_a, ref) => {
|
|
9248
9295
|
var _b = _a, { variant = "titleAndText", imageSource, children } = _b, props = __objRest(_b, ["variant", "imageSource", "children"]);
|
|
9249
9296
|
var _a2, _b2, _c, _d, _e, _f;
|
|
@@ -9330,7 +9377,7 @@ var DrawerHeader = React65.forwardRef(
|
|
|
9330
9377
|
}
|
|
9331
9378
|
);
|
|
9332
9379
|
DrawerHeader.displayName = "Drawer.Header";
|
|
9333
|
-
var DrawerTitle =
|
|
9380
|
+
var DrawerTitle = React66.forwardRef(
|
|
9334
9381
|
(_a, ref) => {
|
|
9335
9382
|
var _b = _a, { children } = _b, props = __objRest(_b, ["children"]);
|
|
9336
9383
|
const theme2 = useTheme();
|
|
@@ -9346,7 +9393,7 @@ var DrawerTitle = React65.forwardRef(
|
|
|
9346
9393
|
}
|
|
9347
9394
|
);
|
|
9348
9395
|
DrawerTitle.displayName = "Drawer.Title";
|
|
9349
|
-
var DrawerDescription =
|
|
9396
|
+
var DrawerDescription = React66.forwardRef(
|
|
9350
9397
|
(_a, ref) => {
|
|
9351
9398
|
var _b = _a, { children } = _b, props = __objRest(_b, ["children"]);
|
|
9352
9399
|
const theme2 = useTheme();
|
|
@@ -9368,31 +9415,56 @@ var StyledScrollView = styled50(ScrollView)(
|
|
|
9368
9415
|
bodyPaddingHorizontal,
|
|
9369
9416
|
bodyPaddingRight,
|
|
9370
9417
|
bodyGap,
|
|
9371
|
-
bodyMaxHeight,
|
|
9372
9418
|
bodyPaddingBottom
|
|
9373
9419
|
}) => ({
|
|
9420
|
+
// flex: 1 fills the bounded panel so the ScrollView can scroll. The panel
|
|
9421
|
+
// (DrawerContent) is the single height authority — the body must NOT set
|
|
9422
|
+
// its own maxHeight, or it would cap independently of the panel and corrupt
|
|
9423
|
+
// the panel's chrome measurement.
|
|
9374
9424
|
flex: 1,
|
|
9375
9425
|
paddingLeft: bodyPaddingHorizontal,
|
|
9376
9426
|
paddingRight: bodyPaddingRight,
|
|
9377
9427
|
gap: bodyGap,
|
|
9378
|
-
maxHeight: bodyMaxHeight,
|
|
9379
9428
|
paddingBottom: bodyPaddingBottom
|
|
9380
9429
|
})
|
|
9381
9430
|
);
|
|
9382
|
-
var DrawerBody =
|
|
9431
|
+
var DrawerBody = React66.forwardRef(
|
|
9383
9432
|
(_a, ref) => {
|
|
9384
|
-
var _b = _a, {
|
|
9433
|
+
var _b = _a, {
|
|
9434
|
+
children,
|
|
9435
|
+
contentContainerStyle,
|
|
9436
|
+
onLayout,
|
|
9437
|
+
onContentSizeChange
|
|
9438
|
+
} = _b, props = __objRest(_b, [
|
|
9439
|
+
"children",
|
|
9440
|
+
"contentContainerStyle",
|
|
9441
|
+
"onLayout",
|
|
9442
|
+
"onContentSizeChange"
|
|
9443
|
+
]);
|
|
9385
9444
|
const theme2 = useTheme();
|
|
9386
9445
|
const { spacing } = theme2.tokens.components.drawer;
|
|
9387
9446
|
const { buttons } = theme2.tokens.components;
|
|
9388
9447
|
const { content } = spacing;
|
|
9389
9448
|
const headerContext = useDrawerHeaderContext();
|
|
9390
9449
|
const footerContext = useDrawerFooterContext();
|
|
9391
|
-
const
|
|
9450
|
+
const measureContext = useDrawerMeasureContext();
|
|
9392
9451
|
const gap = parseTokenValue26(content.slot.gap);
|
|
9393
9452
|
const horizontalPadding = parseTokenValue26(content.slot.horizontalPadding);
|
|
9394
9453
|
const topPadding = parseTokenValue26(content.slot.verticalPadding);
|
|
9395
|
-
const
|
|
9454
|
+
const handleLayout = useCallback(
|
|
9455
|
+
(event) => {
|
|
9456
|
+
measureContext == null ? void 0 : measureContext.setBodyFrameHeight(event.nativeEvent.layout.height);
|
|
9457
|
+
onLayout == null ? void 0 : onLayout(event);
|
|
9458
|
+
},
|
|
9459
|
+
[measureContext, onLayout]
|
|
9460
|
+
);
|
|
9461
|
+
const handleContentSizeChange = useCallback(
|
|
9462
|
+
(width, height) => {
|
|
9463
|
+
measureContext == null ? void 0 : measureContext.setBodyContentHeight(height);
|
|
9464
|
+
onContentSizeChange == null ? void 0 : onContentSizeChange(width, height);
|
|
9465
|
+
},
|
|
9466
|
+
[measureContext, onContentSizeChange]
|
|
9467
|
+
);
|
|
9396
9468
|
const paddingRight = headerContext === null ? parseTokenValue26(spacing.close.right.md) + parseTokenValue26(buttons.size.sm.height) : horizontalPadding;
|
|
9397
9469
|
const bodyPaddingBottom = !footerContext ? parseTokenValue26(theme2.tokens.semantics.dimensions.spacing["2xl"]) : 0;
|
|
9398
9470
|
return /* @__PURE__ */ jsx(
|
|
@@ -9402,8 +9474,9 @@ var DrawerBody = React65.forwardRef(
|
|
|
9402
9474
|
bodyPaddingHorizontal: horizontalPadding,
|
|
9403
9475
|
bodyPaddingRight: paddingRight,
|
|
9404
9476
|
bodyGap: gap,
|
|
9405
|
-
bodyMaxHeight,
|
|
9406
9477
|
bodyPaddingBottom,
|
|
9478
|
+
onLayout: handleLayout,
|
|
9479
|
+
onContentSizeChange: handleContentSizeChange,
|
|
9407
9480
|
contentContainerStyle: [
|
|
9408
9481
|
{
|
|
9409
9482
|
gap,
|
|
@@ -9426,7 +9499,7 @@ var StyledFooter = styled50(View)(({ footerPaddingTop, footerPaddingHorizontal,
|
|
|
9426
9499
|
paddingHorizontal: footerPaddingHorizontal,
|
|
9427
9500
|
paddingBottom: footerPaddingBottom
|
|
9428
9501
|
}));
|
|
9429
|
-
var DrawerFooter =
|
|
9502
|
+
var DrawerFooter = React66.forwardRef(
|
|
9430
9503
|
(_a, ref) => {
|
|
9431
9504
|
var _b = _a, { children } = _b, props = __objRest(_b, ["children"]);
|
|
9432
9505
|
const theme2 = useTheme();
|
|
@@ -9448,7 +9521,7 @@ var DrawerFooter = React65.forwardRef(
|
|
|
9448
9521
|
}
|
|
9449
9522
|
);
|
|
9450
9523
|
DrawerFooter.displayName = "Drawer.Footer";
|
|
9451
|
-
var DrawerRoot =
|
|
9524
|
+
var DrawerRoot = React66.forwardRef(
|
|
9452
9525
|
(_a, ref) => {
|
|
9453
9526
|
var _b = _a, {
|
|
9454
9527
|
open: controlledOpen,
|
|
@@ -9489,15 +9562,15 @@ var DrawerRoot = React65.forwardRef(
|
|
|
9489
9562
|
}
|
|
9490
9563
|
);
|
|
9491
9564
|
DrawerRoot.displayName = "Drawer";
|
|
9492
|
-
var DrawerTrigger =
|
|
9565
|
+
var DrawerTrigger = React66.forwardRef(
|
|
9493
9566
|
({ children }, ref) => {
|
|
9494
|
-
const { openDrawer } =
|
|
9567
|
+
const { openDrawer } = React66.useContext(DrawerContext);
|
|
9495
9568
|
return /* @__PURE__ */ jsx(Slot, { ref, onPress: openDrawer, children });
|
|
9496
9569
|
}
|
|
9497
9570
|
);
|
|
9498
9571
|
DrawerTrigger.displayName = "Drawer.Trigger";
|
|
9499
9572
|
var DrawerPortal = ({ children, topContent }) => {
|
|
9500
|
-
const { modalVisible, closeDrawer } =
|
|
9573
|
+
const { modalVisible, closeDrawer } = React66.useContext(DrawerContext);
|
|
9501
9574
|
if (!modalVisible) return null;
|
|
9502
9575
|
return /* @__PURE__ */ jsx(
|
|
9503
9576
|
Modal,
|
|
@@ -9568,7 +9641,7 @@ var StyledButtonGroup = styled50(View)(({ groupDirection, groupAlign, groupJusti
|
|
|
9568
9641
|
gap: groupGap,
|
|
9569
9642
|
width: "100%"
|
|
9570
9643
|
}, groupDirection === "column" ? { maxWidth: 520 } : {}));
|
|
9571
|
-
var ButtonDock =
|
|
9644
|
+
var ButtonDock = React66.forwardRef(
|
|
9572
9645
|
(_a, ref) => {
|
|
9573
9646
|
var _b = _a, { variant = "stacked", leadingContent, description, children } = _b, rest = __objRest(_b, ["variant", "leadingContent", "description", "children"]);
|
|
9574
9647
|
const theme2 = useTheme();
|
|
@@ -9648,7 +9721,7 @@ var StyledButtonRow = styled50(View)(({ rowDirection, rowAlign, rowGap }) => __s
|
|
|
9648
9721
|
var StyledChildSlot = styled50(View)(
|
|
9649
9722
|
({ slotInline }) => __spreadValues({}, slotInline ? { flex: 1, minWidth: 0 } : { width: "100%", alignSelf: "stretch" })
|
|
9650
9723
|
);
|
|
9651
|
-
var ButtonGroup =
|
|
9724
|
+
var ButtonGroup = React66.forwardRef(
|
|
9652
9725
|
(_a, ref) => {
|
|
9653
9726
|
var _b = _a, { layout = "stacked", description, children } = _b, rest = __objRest(_b, ["layout", "description", "children"]);
|
|
9654
9727
|
const theme2 = useTheme();
|
|
@@ -9670,9 +9743,9 @@ var ButtonGroup = React65.forwardRef(
|
|
|
9670
9743
|
rowGap: parseTokenValue29(
|
|
9671
9744
|
isInline ? buttonGroup.spacing.sideBySide.gap : buttonGroup.spacing.stacked.gap
|
|
9672
9745
|
),
|
|
9673
|
-
children:
|
|
9674
|
-
if (!
|
|
9675
|
-
return /* @__PURE__ */ jsx(StyledChildSlot, { slotInline: isInline, children:
|
|
9746
|
+
children: React66.Children.map(children, (child, index) => {
|
|
9747
|
+
if (!React66.isValidElement(child)) return child;
|
|
9748
|
+
return /* @__PURE__ */ jsx(StyledChildSlot, { slotInline: isInline, children: React66.cloneElement(
|
|
9676
9749
|
child,
|
|
9677
9750
|
{
|
|
9678
9751
|
fullWidth: true
|
|
@@ -9747,7 +9820,7 @@ var StyledIllustration = styled50(View)(({ illustrationSize }) => ({
|
|
|
9747
9820
|
height: illustrationSize,
|
|
9748
9821
|
overflow: "hidden"
|
|
9749
9822
|
}));
|
|
9750
|
-
var Checkbox =
|
|
9823
|
+
var Checkbox = React66.forwardRef(
|
|
9751
9824
|
(_a, ref) => {
|
|
9752
9825
|
var _b = _a, {
|
|
9753
9826
|
variant = "standalone",
|
|
@@ -9774,7 +9847,7 @@ var Checkbox = React65.forwardRef(
|
|
|
9774
9847
|
const { checkbox } = theme2.tokens.components;
|
|
9775
9848
|
const { dimensions: dimensions3 } = theme2.tokens.semantics;
|
|
9776
9849
|
const isControlled = controlledChecked !== void 0;
|
|
9777
|
-
const [internalChecked, setInternalChecked] =
|
|
9850
|
+
const [internalChecked, setInternalChecked] = React66.useState(defaultChecked);
|
|
9778
9851
|
const isChecked = isControlled ? controlledChecked : internalChecked;
|
|
9779
9852
|
const handleCheckedChange = (checked) => {
|
|
9780
9853
|
if (!isControlled) {
|
|
@@ -9869,7 +9942,7 @@ var StyledGroup = styled50(View)(({ groupDirection, groupGap }) => ({
|
|
|
9869
9942
|
flexDirection: groupDirection,
|
|
9870
9943
|
gap: groupGap
|
|
9871
9944
|
}));
|
|
9872
|
-
var CheckboxGroup =
|
|
9945
|
+
var CheckboxGroup = React66.forwardRef(
|
|
9873
9946
|
(_a, ref) => {
|
|
9874
9947
|
var _b = _a, { orientation = "vertical", children } = _b, rest = __objRest(_b, ["orientation", "children"]);
|
|
9875
9948
|
const theme2 = useTheme();
|
|
@@ -9887,7 +9960,7 @@ var CheckboxGroup = React65.forwardRef(
|
|
|
9887
9960
|
}
|
|
9888
9961
|
);
|
|
9889
9962
|
CheckboxGroup.displayName = "CheckboxGroup";
|
|
9890
|
-
var CopyFieldInput =
|
|
9963
|
+
var CopyFieldInput = React66.forwardRef(
|
|
9891
9964
|
(_a, ref) => {
|
|
9892
9965
|
var _b = _a, {
|
|
9893
9966
|
onCopy,
|
|
@@ -9906,19 +9979,19 @@ var CopyFieldInput = React65.forwardRef(
|
|
|
9906
9979
|
"editable",
|
|
9907
9980
|
"defaultValue"
|
|
9908
9981
|
]);
|
|
9909
|
-
const [internalValue, setInternalValue] =
|
|
9982
|
+
const [internalValue, setInternalValue] = React66.useState(
|
|
9910
9983
|
typeof defaultValue === "string" ? defaultValue : ""
|
|
9911
9984
|
);
|
|
9912
|
-
const [copied, setCopied] =
|
|
9913
|
-
const timeoutRef =
|
|
9985
|
+
const [copied, setCopied] = React66.useState(false);
|
|
9986
|
+
const timeoutRef = React66.useRef(
|
|
9914
9987
|
void 0
|
|
9915
9988
|
);
|
|
9916
|
-
|
|
9989
|
+
React66.useEffect(() => {
|
|
9917
9990
|
if (defaultValue !== void 0 && value === void 0) {
|
|
9918
9991
|
setInternalValue(typeof defaultValue === "string" ? defaultValue : "");
|
|
9919
9992
|
}
|
|
9920
9993
|
}, [defaultValue, value]);
|
|
9921
|
-
|
|
9994
|
+
React66.useEffect(() => {
|
|
9922
9995
|
return () => {
|
|
9923
9996
|
if (timeoutRef.current) {
|
|
9924
9997
|
clearTimeout(timeoutRef.current);
|
|
@@ -9985,7 +10058,7 @@ var StyledRoot8 = styled50(View)(({ theme: theme2 }) => {
|
|
|
9985
10058
|
gap: parseTokenValue32(spacing.gap)
|
|
9986
10059
|
};
|
|
9987
10060
|
});
|
|
9988
|
-
var CopyFieldRoot =
|
|
10061
|
+
var CopyFieldRoot = React66.forwardRef(
|
|
9989
10062
|
(_a, ref) => {
|
|
9990
10063
|
var _b = _a, {
|
|
9991
10064
|
label,
|
|
@@ -10053,7 +10126,7 @@ var useCopyField = (options = {}) => {
|
|
|
10053
10126
|
onCopy: handleCopy
|
|
10054
10127
|
};
|
|
10055
10128
|
};
|
|
10056
|
-
var FilterTabContext =
|
|
10129
|
+
var FilterTabContext = React66.createContext({
|
|
10057
10130
|
size: "sm",
|
|
10058
10131
|
selectedValues: [],
|
|
10059
10132
|
toggle: () => {
|
|
@@ -10092,7 +10165,7 @@ var StyledItem2 = styled50(Pressable)(
|
|
|
10092
10165
|
flexShrink: 0
|
|
10093
10166
|
})
|
|
10094
10167
|
);
|
|
10095
|
-
var FilterTabItem =
|
|
10168
|
+
var FilterTabItem = React66.forwardRef(
|
|
10096
10169
|
(_a, ref) => {
|
|
10097
10170
|
var _b = _a, {
|
|
10098
10171
|
value,
|
|
@@ -10112,7 +10185,7 @@ var FilterTabItem = React65.forwardRef(
|
|
|
10112
10185
|
"accessibilityLabel"
|
|
10113
10186
|
]);
|
|
10114
10187
|
const theme2 = useTheme();
|
|
10115
|
-
const { size, selectedValues, toggle } =
|
|
10188
|
+
const { size, selectedValues, toggle } = React66.useContext(FilterTabContext);
|
|
10116
10189
|
const isSelected = selectedValues.includes(value);
|
|
10117
10190
|
const isIconOnly = !!IconOnlyIcon && !label;
|
|
10118
10191
|
const isActive = isSelected && !disabled;
|
|
@@ -10186,7 +10259,7 @@ var FilterTabItem = React65.forwardRef(
|
|
|
10186
10259
|
}
|
|
10187
10260
|
);
|
|
10188
10261
|
FilterTabItem.displayName = "FilterTab.Item";
|
|
10189
|
-
var FilterTabRoot =
|
|
10262
|
+
var FilterTabRoot = React66.forwardRef(
|
|
10190
10263
|
(_a, ref) => {
|
|
10191
10264
|
var _b = _a, {
|
|
10192
10265
|
size = "sm",
|
|
@@ -10206,9 +10279,9 @@ var FilterTabRoot = React65.forwardRef(
|
|
|
10206
10279
|
const theme2 = useTheme();
|
|
10207
10280
|
const { filterTabs } = theme2.tokens.components;
|
|
10208
10281
|
const isControlled = controlledValue !== void 0;
|
|
10209
|
-
const [internalValue, setInternalValue] =
|
|
10282
|
+
const [internalValue, setInternalValue] = React66.useState(defaultValue);
|
|
10210
10283
|
const selectedValues = isControlled ? controlledValue : internalValue;
|
|
10211
|
-
const toggle =
|
|
10284
|
+
const toggle = React66.useCallback(
|
|
10212
10285
|
(itemValue) => {
|
|
10213
10286
|
let next;
|
|
10214
10287
|
if (multiple) {
|
|
@@ -10221,7 +10294,7 @@ var FilterTabRoot = React65.forwardRef(
|
|
|
10221
10294
|
},
|
|
10222
10295
|
[selectedValues, isControlled, onValueChange, multiple]
|
|
10223
10296
|
);
|
|
10224
|
-
const contextValue =
|
|
10297
|
+
const contextValue = React66.useMemo(
|
|
10225
10298
|
() => ({ size, selectedValues, toggle }),
|
|
10226
10299
|
[size, selectedValues, toggle]
|
|
10227
10300
|
);
|
|
@@ -10291,7 +10364,7 @@ var StyledRow = styled50(View)(({ rowGap }) => ({
|
|
|
10291
10364
|
alignItems: "center",
|
|
10292
10365
|
gap: rowGap
|
|
10293
10366
|
}));
|
|
10294
|
-
var NumberFieldInput =
|
|
10367
|
+
var NumberFieldInput = React66.forwardRef(
|
|
10295
10368
|
(_a, ref) => {
|
|
10296
10369
|
var _b = _a, {
|
|
10297
10370
|
fieldSize = "lg",
|
|
@@ -10338,9 +10411,9 @@ var NumberFieldInput = React65.forwardRef(
|
|
|
10338
10411
|
const theme2 = useTheme();
|
|
10339
10412
|
const tokens3 = theme2.tokens.components.numberField;
|
|
10340
10413
|
const inputTokens3 = theme2.tokens.components.inputs;
|
|
10341
|
-
const [isFocused, setIsFocused] =
|
|
10342
|
-
const [isEdited, setIsEdited] =
|
|
10343
|
-
const initialValueRef =
|
|
10414
|
+
const [isFocused, setIsFocused] = React66.useState(false);
|
|
10415
|
+
const [isEdited, setIsEdited] = React66.useState(false);
|
|
10416
|
+
const initialValueRef = React66.useRef((_a2 = value != null ? value : defaultValue) != null ? _a2 : "");
|
|
10344
10417
|
const isLarge = fieldSize === "lg";
|
|
10345
10418
|
const sizeTokens = isLarge ? tokens3.spacing.large : tokens3.spacing.small;
|
|
10346
10419
|
const buttonSize = isLarge ? "lg" : "sm";
|
|
@@ -10357,14 +10430,14 @@ var NumberFieldInput = React65.forwardRef(
|
|
|
10357
10430
|
if (isEdited) return tokens3.colour.field.border.edited;
|
|
10358
10431
|
return tokens3.colour.field.border.default;
|
|
10359
10432
|
};
|
|
10360
|
-
const handleFocus =
|
|
10433
|
+
const handleFocus = React66.useCallback(
|
|
10361
10434
|
(e) => {
|
|
10362
10435
|
setIsFocused(true);
|
|
10363
10436
|
onFocus == null ? void 0 : onFocus(e);
|
|
10364
10437
|
},
|
|
10365
10438
|
[onFocus]
|
|
10366
10439
|
);
|
|
10367
|
-
const handleBlur =
|
|
10440
|
+
const handleBlur = React66.useCallback(
|
|
10368
10441
|
(e) => {
|
|
10369
10442
|
setIsFocused(false);
|
|
10370
10443
|
if (value != null && onChangeText) {
|
|
@@ -10383,7 +10456,7 @@ var NumberFieldInput = React65.forwardRef(
|
|
|
10383
10456
|
const numericValue = value != null ? Number(value) : Number(defaultValue != null ? defaultValue : 0);
|
|
10384
10457
|
const isAtMin = min != null && numericValue <= min;
|
|
10385
10458
|
const isAtMax = max != null && numericValue >= max;
|
|
10386
|
-
const handleChangeText =
|
|
10459
|
+
const handleChangeText = React66.useCallback(
|
|
10387
10460
|
(text) => {
|
|
10388
10461
|
setIsEdited(text !== initialValueRef.current);
|
|
10389
10462
|
onChangeText == null ? void 0 : onChangeText(text);
|
|
@@ -10482,7 +10555,7 @@ var StyledRoot10 = styled50(View)(({ rootGap, fullWidth }) => __spreadValues({
|
|
|
10482
10555
|
var StyledLabelGroup = styled50(View)(({ labelGap }) => ({
|
|
10483
10556
|
gap: labelGap
|
|
10484
10557
|
}));
|
|
10485
|
-
var NumberField =
|
|
10558
|
+
var NumberField = React66.forwardRef(
|
|
10486
10559
|
(_a, ref) => {
|
|
10487
10560
|
var _b = _a, {
|
|
10488
10561
|
label,
|
|
@@ -10597,9 +10670,9 @@ var NumberField = React65.forwardRef(
|
|
|
10597
10670
|
);
|
|
10598
10671
|
NumberField.displayName = "NumberField";
|
|
10599
10672
|
var HIT_SLOP = 12;
|
|
10600
|
-
var PasswordFieldInput =
|
|
10673
|
+
var PasswordFieldInput = React66.forwardRef((_a, ref) => {
|
|
10601
10674
|
var _b = _a, { onValueChange, value, state, editable } = _b, inputFieldProps = __objRest(_b, ["onValueChange", "value", "state", "editable"]);
|
|
10602
|
-
const [showPassword, setShowPassword] =
|
|
10675
|
+
const [showPassword, setShowPassword] = React66.useState(false);
|
|
10603
10676
|
const handleValueChange = (newValue) => {
|
|
10604
10677
|
onValueChange == null ? void 0 : onValueChange(newValue);
|
|
10605
10678
|
};
|
|
@@ -10644,7 +10717,7 @@ var StyledErrorRow2 = styled50(View)(({ gap }) => ({
|
|
|
10644
10717
|
alignItems: "center",
|
|
10645
10718
|
gap
|
|
10646
10719
|
}));
|
|
10647
|
-
var PasswordFieldError =
|
|
10720
|
+
var PasswordFieldError = React66.forwardRef((_a, ref) => {
|
|
10648
10721
|
var _b = _a, { children } = _b, rest = __objRest(_b, ["children"]);
|
|
10649
10722
|
const theme2 = useTheme();
|
|
10650
10723
|
const { listItem } = theme2.tokens.components.validationList;
|
|
@@ -10683,7 +10756,7 @@ var StyledRequirementItem = styled50(View)(
|
|
|
10683
10756
|
gap: itemGap
|
|
10684
10757
|
})
|
|
10685
10758
|
);
|
|
10686
|
-
var PasswordFieldRequirements =
|
|
10759
|
+
var PasswordFieldRequirements = React66.forwardRef((_a, ref) => {
|
|
10687
10760
|
var _b = _a, { requirements } = _b, rest = __objRest(_b, ["requirements"]);
|
|
10688
10761
|
const theme2 = useTheme();
|
|
10689
10762
|
const { listItem, list } = theme2.tokens.components.validationList;
|
|
@@ -10739,7 +10812,7 @@ var StyledRoot11 = styled50(View)(({ theme: theme2 }) => {
|
|
|
10739
10812
|
gap: parseTokenValue38(spacing.gap)
|
|
10740
10813
|
};
|
|
10741
10814
|
});
|
|
10742
|
-
var PasswordFieldRoot =
|
|
10815
|
+
var PasswordFieldRoot = React66.forwardRef(
|
|
10743
10816
|
(_a, ref) => {
|
|
10744
10817
|
var _b = _a, {
|
|
10745
10818
|
label,
|
|
@@ -10874,7 +10947,7 @@ var StyledIndicator = styled50(View)(({ indicatorBorderRadius, indicatorBgColor
|
|
|
10874
10947
|
backgroundColor: indicatorBgColor
|
|
10875
10948
|
}));
|
|
10876
10949
|
var clamp = (value, min, max) => Math.max(min, Math.min(max, value));
|
|
10877
|
-
var Progress =
|
|
10950
|
+
var Progress = React66.forwardRef(
|
|
10878
10951
|
(_a, ref) => {
|
|
10879
10952
|
var _b = _a, {
|
|
10880
10953
|
value = 0,
|
|
@@ -11002,6 +11075,9 @@ var StyledIndicator2 = styled50(View)(({ indicatorSize, indicatorBgColor }) => (
|
|
|
11002
11075
|
backgroundColor: indicatorBgColor
|
|
11003
11076
|
}));
|
|
11004
11077
|
var StyledTextContent = styled50(View)(({ textContentGap }) => ({
|
|
11078
|
+
// Take the row's remaining width so long label/subText wraps within the tile
|
|
11079
|
+
// instead of pushing the trailing asset past the tile's edge.
|
|
11080
|
+
flex: 1,
|
|
11005
11081
|
flexDirection: "column",
|
|
11006
11082
|
gap: textContentGap
|
|
11007
11083
|
}));
|
|
@@ -11014,7 +11090,7 @@ var StyledTagWrapper = styled50(View)(
|
|
|
11014
11090
|
paddingTop: tagTopPadding
|
|
11015
11091
|
})
|
|
11016
11092
|
);
|
|
11017
|
-
var Radio =
|
|
11093
|
+
var Radio = React66.forwardRef(
|
|
11018
11094
|
(_a, ref) => {
|
|
11019
11095
|
var _b = _a, {
|
|
11020
11096
|
variant = "standalone",
|
|
@@ -11118,7 +11194,7 @@ var Radio = React65.forwardRef(
|
|
|
11118
11194
|
}
|
|
11119
11195
|
);
|
|
11120
11196
|
Radio.displayName = "Radio";
|
|
11121
|
-
var RadioTile =
|
|
11197
|
+
var RadioTile = React66.forwardRef(
|
|
11122
11198
|
(props, ref) => /* @__PURE__ */ jsx(Radio, __spreadProps(__spreadValues({ ref }, props), { variant: "tile" }))
|
|
11123
11199
|
);
|
|
11124
11200
|
RadioTile.displayName = "RadioTile";
|
|
@@ -11127,7 +11203,7 @@ var StyledRadioGroup = styled50(View)(({ groupDirection, groupGap }) => ({
|
|
|
11127
11203
|
flexDirection: groupDirection,
|
|
11128
11204
|
gap: groupGap
|
|
11129
11205
|
}));
|
|
11130
|
-
var RadioGroupRoot =
|
|
11206
|
+
var RadioGroupRoot = React66.forwardRef(
|
|
11131
11207
|
(_a, ref) => {
|
|
11132
11208
|
var _b = _a, {
|
|
11133
11209
|
name: _name,
|
|
@@ -11154,11 +11230,11 @@ var RadioGroupRoot = React65.forwardRef(
|
|
|
11154
11230
|
const optionsFirstValue = (_a2 = options == null ? void 0 : options[0]) == null ? void 0 : _a2.value;
|
|
11155
11231
|
const derivedDefaultValue = defaultValue != null ? defaultValue : optionsFirstValue;
|
|
11156
11232
|
const isControlled = value !== void 0;
|
|
11157
|
-
const [internalValue, setInternalValue] =
|
|
11233
|
+
const [internalValue, setInternalValue] = React66.useState(
|
|
11158
11234
|
derivedDefaultValue != null ? derivedDefaultValue : ""
|
|
11159
11235
|
);
|
|
11160
11236
|
const currentValue = isControlled ? value : internalValue;
|
|
11161
|
-
const handleSelect =
|
|
11237
|
+
const handleSelect = React66.useCallback(
|
|
11162
11238
|
(newValue) => {
|
|
11163
11239
|
if (!isControlled) {
|
|
11164
11240
|
setInternalValue(newValue);
|
|
@@ -11179,9 +11255,9 @@ var RadioGroupRoot = React65.forwardRef(
|
|
|
11179
11255
|
option.value
|
|
11180
11256
|
));
|
|
11181
11257
|
}
|
|
11182
|
-
return
|
|
11183
|
-
if (!
|
|
11184
|
-
return
|
|
11258
|
+
return React66.Children.map(children, (child) => {
|
|
11259
|
+
if (!React66.isValidElement(child)) return child;
|
|
11260
|
+
return React66.cloneElement(child, {
|
|
11185
11261
|
selected: currentValue === child.props.value,
|
|
11186
11262
|
onSelect: handleSelect,
|
|
11187
11263
|
disabled: disabled || child.props.disabled
|
|
@@ -11206,11 +11282,11 @@ var RadioGroup = Object.assign(RadioGroupRoot, {
|
|
|
11206
11282
|
Radio,
|
|
11207
11283
|
Tile: RadioTile
|
|
11208
11284
|
});
|
|
11209
|
-
var SearchFieldInput =
|
|
11285
|
+
var SearchFieldInput = React66.forwardRef((_a, ref) => {
|
|
11210
11286
|
var _b = _a, { onClear, onValueChange, value, state } = _b, inputFieldProps = __objRest(_b, ["onClear", "onValueChange", "value", "state"]);
|
|
11211
|
-
const [internalValue, setInternalValue] =
|
|
11212
|
-
const inputRef =
|
|
11213
|
-
|
|
11287
|
+
const [internalValue, setInternalValue] = React66.useState("");
|
|
11288
|
+
const inputRef = React66.useRef(null);
|
|
11289
|
+
React66.useImperativeHandle(ref, () => inputRef.current);
|
|
11214
11290
|
const handleValueChange = (newValue) => {
|
|
11215
11291
|
setInternalValue(newValue);
|
|
11216
11292
|
onValueChange == null ? void 0 : onValueChange(newValue);
|
|
@@ -11256,7 +11332,7 @@ var StyledRoot13 = styled50(View)(({ theme: theme2 }) => {
|
|
|
11256
11332
|
gap: parseTokenValue42(spacing.gap)
|
|
11257
11333
|
};
|
|
11258
11334
|
});
|
|
11259
|
-
var SearchFieldRoot =
|
|
11335
|
+
var SearchFieldRoot = React66.forwardRef(
|
|
11260
11336
|
(_a, ref) => {
|
|
11261
11337
|
var _b = _a, {
|
|
11262
11338
|
label,
|
|
@@ -11386,7 +11462,7 @@ var ScrollIndicatorGradient = ({
|
|
|
11386
11462
|
side,
|
|
11387
11463
|
color
|
|
11388
11464
|
}) => {
|
|
11389
|
-
const uid =
|
|
11465
|
+
const uid = React66.useId();
|
|
11390
11466
|
const gradientId = `sc-scroll-indicator-${side}-${uid}`;
|
|
11391
11467
|
const isTrailing = side === "trailing";
|
|
11392
11468
|
return /* @__PURE__ */ jsx(View, { style: StyleSheet.absoluteFill, pointerEvents: "none", children: /* @__PURE__ */ jsxs(Svg, { width: "100%", height: "100%", preserveAspectRatio: "none", children: [
|
|
@@ -11469,7 +11545,7 @@ var SegmentedControlItemBase = ({
|
|
|
11469
11545
|
}
|
|
11470
11546
|
);
|
|
11471
11547
|
};
|
|
11472
|
-
var SegmentedControlItem =
|
|
11548
|
+
var SegmentedControlItem = React66.forwardRef(
|
|
11473
11549
|
(_props, _ref) => {
|
|
11474
11550
|
return null;
|
|
11475
11551
|
}
|
|
@@ -11485,10 +11561,10 @@ var IntrinsicTrack = (_a) => {
|
|
|
11485
11561
|
"renderItems",
|
|
11486
11562
|
"forwardedRef"
|
|
11487
11563
|
]);
|
|
11488
|
-
const scrollRef =
|
|
11489
|
-
const [containerWidth, setContainerWidth] =
|
|
11490
|
-
const [contentWidth, setContentWidth] =
|
|
11491
|
-
const [scrollX, setScrollX] =
|
|
11564
|
+
const scrollRef = React66.useRef(null);
|
|
11565
|
+
const [containerWidth, setContainerWidth] = React66.useState(0);
|
|
11566
|
+
const [contentWidth, setContentWidth] = React66.useState(0);
|
|
11567
|
+
const [scrollX, setScrollX] = React66.useState(0);
|
|
11492
11568
|
const epsilon = 2;
|
|
11493
11569
|
const maxScroll = Math.max(0, contentWidth - containerWidth);
|
|
11494
11570
|
const canScrollLeft = scrollX > epsilon;
|
|
@@ -11584,7 +11660,7 @@ var IntrinsicTrack = (_a) => {
|
|
|
11584
11660
|
})
|
|
11585
11661
|
);
|
|
11586
11662
|
};
|
|
11587
|
-
var SegmentedControlRoot =
|
|
11663
|
+
var SegmentedControlRoot = React66.forwardRef(
|
|
11588
11664
|
(_a, ref) => {
|
|
11589
11665
|
var _b = _a, {
|
|
11590
11666
|
options,
|
|
@@ -11608,18 +11684,18 @@ var SegmentedControlRoot = React65.forwardRef(
|
|
|
11608
11684
|
const { spacing, borderRadius, colour } = theme2.tokens.components.segmentedControl;
|
|
11609
11685
|
const { dimensions: dimensions3 } = theme2.tokens.semantics;
|
|
11610
11686
|
const optionsFirstValue = (_a2 = options == null ? void 0 : options[0]) == null ? void 0 : _a2.value;
|
|
11611
|
-
const childrenArray =
|
|
11687
|
+
const childrenArray = React66.Children.toArray(children);
|
|
11612
11688
|
const firstChildValue = childrenArray.map((child) => {
|
|
11613
|
-
if (!
|
|
11689
|
+
if (!React66.isValidElement(child)) return void 0;
|
|
11614
11690
|
return child.props.value;
|
|
11615
11691
|
}).find((v) => typeof v === "string");
|
|
11616
11692
|
const derivedDefaultValue = (_b2 = defaultValue != null ? defaultValue : optionsFirstValue) != null ? _b2 : firstChildValue;
|
|
11617
11693
|
const isControlled = typeof value === "string";
|
|
11618
|
-
const [uncontrolledValue, setUncontrolledValue] =
|
|
11694
|
+
const [uncontrolledValue, setUncontrolledValue] = React66.useState(
|
|
11619
11695
|
() => derivedDefaultValue != null ? derivedDefaultValue : ""
|
|
11620
11696
|
);
|
|
11621
11697
|
const currentValue = isControlled ? value : uncontrolledValue;
|
|
11622
|
-
const handleSelect =
|
|
11698
|
+
const handleSelect = React66.useCallback(
|
|
11623
11699
|
(newValue) => {
|
|
11624
11700
|
if (!isControlled) {
|
|
11625
11701
|
setUncontrolledValue(newValue);
|
|
@@ -11645,7 +11721,7 @@ var SegmentedControlRoot = React65.forwardRef(
|
|
|
11645
11721
|
));
|
|
11646
11722
|
}
|
|
11647
11723
|
return childrenArray.map((child) => {
|
|
11648
|
-
if (!
|
|
11724
|
+
if (!React66.isValidElement(child)) return child;
|
|
11649
11725
|
const childProps = child.props;
|
|
11650
11726
|
return /* @__PURE__ */ jsx(
|
|
11651
11727
|
SegmentedControlItemBase,
|
|
@@ -11716,7 +11792,7 @@ var StyledArrowIcon = styled50(Animated.View)({
|
|
|
11716
11792
|
alignItems: "center",
|
|
11717
11793
|
justifyContent: "center"
|
|
11718
11794
|
});
|
|
11719
|
-
var SelectFieldTrigger =
|
|
11795
|
+
var SelectFieldTrigger = React66.forwardRef(
|
|
11720
11796
|
(_a, ref) => {
|
|
11721
11797
|
var _b = _a, {
|
|
11722
11798
|
state = "default",
|
|
@@ -11815,7 +11891,7 @@ var SelectFieldTrigger = React65.forwardRef(
|
|
|
11815
11891
|
}
|
|
11816
11892
|
);
|
|
11817
11893
|
SelectFieldTrigger.displayName = "SelectField.Trigger";
|
|
11818
|
-
var SelectFieldValue =
|
|
11894
|
+
var SelectFieldValue = React66.forwardRef(
|
|
11819
11895
|
(_a, ref) => {
|
|
11820
11896
|
var _b = _a, { placeholder } = _b, rest = __objRest(_b, ["placeholder"]);
|
|
11821
11897
|
const theme2 = useTheme();
|
|
@@ -11859,7 +11935,7 @@ var StyledContentInner = styled50(View)(({ theme: theme2 }) => {
|
|
|
11859
11935
|
overflow: "hidden"
|
|
11860
11936
|
};
|
|
11861
11937
|
});
|
|
11862
|
-
var SelectFieldContent =
|
|
11938
|
+
var SelectFieldContent = React66.forwardRef((_a, ref) => {
|
|
11863
11939
|
var _b = _a, { children } = _b, rest = __objRest(_b, ["children"]);
|
|
11864
11940
|
const theme2 = useTheme();
|
|
11865
11941
|
const { spacing } = theme2.tokens.components.inputs;
|
|
@@ -11934,7 +12010,7 @@ var StyledHintText = styled50(Text)(({ theme: theme2 }) => {
|
|
|
11934
12010
|
flexShrink: 0
|
|
11935
12011
|
};
|
|
11936
12012
|
});
|
|
11937
|
-
var SelectFieldItem =
|
|
12013
|
+
var SelectFieldItem = React66.forwardRef(
|
|
11938
12014
|
(_a, ref) => {
|
|
11939
12015
|
var _b = _a, { value, leadingIcon, hintText, children, disabled, isSelected } = _b, rest = __objRest(_b, ["value", "leadingIcon", "hintText", "children", "disabled", "isSelected"]);
|
|
11940
12016
|
const theme2 = useTheme();
|
|
@@ -11986,7 +12062,7 @@ var StyledRoot14 = styled50(View)(({ theme: theme2 }) => {
|
|
|
11986
12062
|
gap: parseTokenValue47(spacing.gap)
|
|
11987
12063
|
};
|
|
11988
12064
|
});
|
|
11989
|
-
var SelectFieldRoot =
|
|
12065
|
+
var SelectFieldRoot = React66.forwardRef(
|
|
11990
12066
|
(_a, ref) => {
|
|
11991
12067
|
var _b = _a, {
|
|
11992
12068
|
label,
|
|
@@ -12021,15 +12097,15 @@ var SelectFieldRoot = React65.forwardRef(
|
|
|
12021
12097
|
"searchPlaceholder",
|
|
12022
12098
|
"noResultsText"
|
|
12023
12099
|
]);
|
|
12024
|
-
const [isOpen, setIsOpen] =
|
|
12025
|
-
const [showContent, setShowContent] =
|
|
12026
|
-
const [internalValue, setInternalValue] =
|
|
12100
|
+
const [isOpen, setIsOpen] = React66.useState(false);
|
|
12101
|
+
const [showContent, setShowContent] = React66.useState(false);
|
|
12102
|
+
const [internalValue, setInternalValue] = React66.useState(
|
|
12027
12103
|
defaultValue != null ? defaultValue : null
|
|
12028
12104
|
);
|
|
12029
|
-
const [searchQuery, setSearchQuery] =
|
|
12030
|
-
const [clearKey, setClearKey] =
|
|
12031
|
-
const searchInputRef =
|
|
12032
|
-
|
|
12105
|
+
const [searchQuery, setSearchQuery] = React66.useState("");
|
|
12106
|
+
const [clearKey, setClearKey] = React66.useState(0);
|
|
12107
|
+
const searchInputRef = React66.useRef(null);
|
|
12108
|
+
React66.useEffect(() => {
|
|
12033
12109
|
if (!isOpen) {
|
|
12034
12110
|
setShowContent(false);
|
|
12035
12111
|
return;
|
|
@@ -12062,8 +12138,8 @@ var SelectFieldRoot = React65.forwardRef(
|
|
|
12062
12138
|
keyboardSub.remove();
|
|
12063
12139
|
};
|
|
12064
12140
|
}, [isOpen, searchable]);
|
|
12065
|
-
const isCompound =
|
|
12066
|
-
(child) =>
|
|
12141
|
+
const isCompound = React66.Children.toArray(children).some(
|
|
12142
|
+
(child) => React66.isValidElement(child) && child.type === SelectFieldContent
|
|
12067
12143
|
);
|
|
12068
12144
|
if (isCompound) {
|
|
12069
12145
|
return /* @__PURE__ */ jsx(StyledRoot14, __spreadProps(__spreadValues({ ref }, rest), { children }));
|
|
@@ -12078,11 +12154,11 @@ var SelectFieldRoot = React65.forwardRef(
|
|
|
12078
12154
|
if (!open) setSearchQuery("");
|
|
12079
12155
|
};
|
|
12080
12156
|
const currentValue = value !== void 0 ? value : internalValue;
|
|
12081
|
-
const allItems =
|
|
12157
|
+
const allItems = React66.Children.toArray(children);
|
|
12082
12158
|
const filteredItems = searchable ? allItems.filter((child) => {
|
|
12083
12159
|
var _a2;
|
|
12084
12160
|
if (!searchQuery) return true;
|
|
12085
|
-
if (
|
|
12161
|
+
if (React66.isValidElement(child) && child.type === SelectFieldItem) {
|
|
12086
12162
|
const label2 = String(
|
|
12087
12163
|
(_a2 = child.props.children) != null ? _a2 : ""
|
|
12088
12164
|
);
|
|
@@ -12151,10 +12227,10 @@ var SelectFieldRoot = React65.forwardRef(
|
|
|
12151
12227
|
] })),
|
|
12152
12228
|
showContent && /* @__PURE__ */ jsxs(SelectFieldContent, { children: [
|
|
12153
12229
|
filteredItems.map((child) => {
|
|
12154
|
-
if (
|
|
12230
|
+
if (React66.isValidElement(child) && child.type === SelectFieldItem) {
|
|
12155
12231
|
const selectedValue = currentValue && typeof currentValue === "object" && "value" in currentValue ? currentValue.value : currentValue;
|
|
12156
12232
|
const childProps = child.props;
|
|
12157
|
-
return
|
|
12233
|
+
return React66.cloneElement(
|
|
12158
12234
|
child,
|
|
12159
12235
|
{
|
|
12160
12236
|
isSelected: childProps.value === selectedValue
|
|
@@ -12321,7 +12397,7 @@ var useIconAnimation = () => {
|
|
|
12321
12397
|
iconAnimationStyles
|
|
12322
12398
|
};
|
|
12323
12399
|
};
|
|
12324
|
-
var NativeSelectPicker =
|
|
12400
|
+
var NativeSelectPicker = React66.forwardRef(
|
|
12325
12401
|
(_a, ref) => {
|
|
12326
12402
|
var _b = _a, {
|
|
12327
12403
|
items,
|
|
@@ -12480,7 +12556,7 @@ var StyledLabelSlot = styled50(View)(({ labelSlotGap }) => ({
|
|
|
12480
12556
|
gap: labelSlotGap,
|
|
12481
12557
|
flexShrink: 0
|
|
12482
12558
|
}));
|
|
12483
|
-
var Slider =
|
|
12559
|
+
var Slider = React66.forwardRef(
|
|
12484
12560
|
(_a, ref) => {
|
|
12485
12561
|
var _b = _a, {
|
|
12486
12562
|
value: controlledValue,
|
|
@@ -12515,7 +12591,7 @@ var Slider = React65.forwardRef(
|
|
|
12515
12591
|
const { slider, buttons } = theme2.tokens.components;
|
|
12516
12592
|
const { dimensions: dimensions3 } = theme2.tokens.semantics;
|
|
12517
12593
|
const isControlled = controlledValue !== void 0;
|
|
12518
|
-
const [internalValue, setInternalValue] =
|
|
12594
|
+
const [internalValue, setInternalValue] = React66.useState(defaultValue);
|
|
12519
12595
|
const currentValue = isControlled ? controlledValue : internalValue;
|
|
12520
12596
|
const thumbSize = parseTokenValue48(buttons.size.md.height);
|
|
12521
12597
|
const trackHeight = parseTokenValue48(slider.sizing.track.height);
|
|
@@ -12898,7 +12974,7 @@ var StyledCloseButton = styled50(Pressable)({
|
|
|
12898
12974
|
flexShrink: 0,
|
|
12899
12975
|
padding: 0
|
|
12900
12976
|
});
|
|
12901
|
-
var Notification =
|
|
12977
|
+
var Notification = React66.forwardRef(
|
|
12902
12978
|
(props, ref) => {
|
|
12903
12979
|
const _a = props, {
|
|
12904
12980
|
variant = "inline",
|
|
@@ -13242,7 +13318,7 @@ function NibTriangle({
|
|
|
13242
13318
|
}
|
|
13243
13319
|
);
|
|
13244
13320
|
}
|
|
13245
|
-
var Tooltip =
|
|
13321
|
+
var Tooltip = React66.forwardRef(
|
|
13246
13322
|
(_a, ref) => {
|
|
13247
13323
|
var _b = _a, { text, alignment = "middle", position = "bottom", children } = _b, props = __objRest(_b, ["text", "alignment", "position", "children"]);
|
|
13248
13324
|
const theme2 = useTheme();
|
|
@@ -13330,8 +13406,8 @@ var Tooltip = React65.forwardRef(
|
|
|
13330
13406
|
return bubble;
|
|
13331
13407
|
}
|
|
13332
13408
|
if (Platform.OS === "web") {
|
|
13333
|
-
const child =
|
|
13334
|
-
const trigger = child ?
|
|
13409
|
+
const child = React66.isValidElement(children) ? children : null;
|
|
13410
|
+
const trigger = child ? React66.cloneElement(child, {
|
|
13335
13411
|
onPress: () => {
|
|
13336
13412
|
var _a2, _b2;
|
|
13337
13413
|
(_b2 = (_a2 = child.props).onPress) == null ? void 0 : _b2.call(_a2);
|
|
@@ -13408,7 +13484,7 @@ var StyledInsightContent = styled50(View)(
|
|
|
13408
13484
|
gap: contentGap
|
|
13409
13485
|
})
|
|
13410
13486
|
);
|
|
13411
|
-
var MessageCardInsight =
|
|
13487
|
+
var MessageCardInsight = React66.forwardRef(
|
|
13412
13488
|
(_a, ref) => {
|
|
13413
13489
|
var _b = _a, { variant = "standalone", icon, illustration, title, children } = _b, rest = __objRest(_b, ["variant", "icon", "illustration", "title", "children"]);
|
|
13414
13490
|
const theme2 = useTheme();
|
|
@@ -13519,7 +13595,7 @@ var StyledBannerCopy = styled50(View)(({ copyGap }) => ({
|
|
|
13519
13595
|
gap: copyGap,
|
|
13520
13596
|
width: "100%"
|
|
13521
13597
|
}));
|
|
13522
|
-
var MessageCardBanner =
|
|
13598
|
+
var MessageCardBanner = React66.forwardRef(
|
|
13523
13599
|
(_a, ref) => {
|
|
13524
13600
|
var _b = _a, {
|
|
13525
13601
|
colourScheme = "primary",
|
|
@@ -13553,7 +13629,7 @@ var MessageCardBanner = React65.forwardRef(
|
|
|
13553
13629
|
accessibilityRole: "summary"
|
|
13554
13630
|
}, rest), {
|
|
13555
13631
|
children: [
|
|
13556
|
-
(media == null ? void 0 : media.type) === "illustration" ? /* @__PURE__ */ jsx(StyledBannerIllustrationSlot, { children:
|
|
13632
|
+
(media == null ? void 0 : media.type) === "illustration" ? /* @__PURE__ */ jsx(StyledBannerIllustrationSlot, { children: React66.createElement(media.illustration, {
|
|
13557
13633
|
width: 108,
|
|
13558
13634
|
height: 108
|
|
13559
13635
|
}) }) : (media == null ? void 0 : media.type) === "image" ? /* @__PURE__ */ jsx(
|
|
@@ -13652,29 +13728,32 @@ function defaultGetDateState(date) {
|
|
|
13652
13728
|
function getDefaultMonthLabel(year, month, locale) {
|
|
13653
13729
|
return format(new Date(year, month, 1), "MMMM yyyy", { locale });
|
|
13654
13730
|
}
|
|
13655
|
-
var StyledContainer3 = styled50(View)(({
|
|
13731
|
+
var StyledContainer3 = styled50(View)(({ containerMaxWidth }) => ({
|
|
13656
13732
|
flexDirection: "column",
|
|
13657
|
-
|
|
13733
|
+
// Fill the parent by default (capped by maxWidth) so consumers don't need a
|
|
13734
|
+
// wrapper. Overridable via the `style` prop.
|
|
13735
|
+
width: "100%",
|
|
13658
13736
|
maxWidth: containerMaxWidth
|
|
13659
13737
|
}));
|
|
13660
13738
|
var StyledMonthHeader = styled50(View)(
|
|
13661
|
-
({ headerGap }) => ({
|
|
13739
|
+
({ headerGap, datesGap }) => ({
|
|
13662
13740
|
flexDirection: "row",
|
|
13663
13741
|
alignItems: "center",
|
|
13664
|
-
gap: headerGap
|
|
13742
|
+
gap: headerGap,
|
|
13743
|
+
// Gap between the month header and the dates grid.
|
|
13744
|
+
marginBottom: datesGap
|
|
13665
13745
|
})
|
|
13666
13746
|
);
|
|
13667
|
-
var StyledWeekRow = styled50(View)({
|
|
13668
|
-
flexDirection: "row"
|
|
13747
|
+
var StyledWeekRow = styled50(View)(({ weekGap }) => ({
|
|
13748
|
+
flexDirection: "row",
|
|
13749
|
+
// Gap between the week-day header and the month header.
|
|
13750
|
+
marginBottom: weekGap
|
|
13751
|
+
}));
|
|
13752
|
+
var StyledWeekCell = styled50(View)({
|
|
13753
|
+
flex: 1,
|
|
13754
|
+
alignItems: "center",
|
|
13755
|
+
justifyContent: "center"
|
|
13669
13756
|
});
|
|
13670
|
-
var StyledWeekCell = styled50(View)(
|
|
13671
|
-
({ cellHeight }) => ({
|
|
13672
|
-
flex: 1,
|
|
13673
|
-
alignItems: "center",
|
|
13674
|
-
justifyContent: "center",
|
|
13675
|
-
height: cellHeight
|
|
13676
|
-
})
|
|
13677
|
-
);
|
|
13678
13757
|
var StyledDatesGrid = styled50(View)(({ rowGap }) => ({
|
|
13679
13758
|
flexDirection: "column",
|
|
13680
13759
|
gap: rowGap
|
|
@@ -13710,7 +13789,7 @@ var StyledIndicator3 = styled50(View)(
|
|
|
13710
13789
|
justifyContent: "center"
|
|
13711
13790
|
})
|
|
13712
13791
|
);
|
|
13713
|
-
var DatePicker =
|
|
13792
|
+
var DatePicker = React66.forwardRef(
|
|
13714
13793
|
(_a, ref) => {
|
|
13715
13794
|
var _b = _a, {
|
|
13716
13795
|
year,
|
|
@@ -13756,7 +13835,8 @@ var DatePicker = React65.forwardRef(
|
|
|
13756
13835
|
const dt = datePicker.dateItem;
|
|
13757
13836
|
const [slideDir, setSlideDir] = useState("forward");
|
|
13758
13837
|
const {
|
|
13759
|
-
|
|
13838
|
+
weekGap,
|
|
13839
|
+
datesGap,
|
|
13760
13840
|
containerMaxWidth,
|
|
13761
13841
|
headerGap,
|
|
13762
13842
|
cellHeight,
|
|
@@ -13767,7 +13847,10 @@ var DatePicker = React65.forwardRef(
|
|
|
13767
13847
|
rowGap
|
|
13768
13848
|
} = useMemo(
|
|
13769
13849
|
() => ({
|
|
13770
|
-
|
|
13850
|
+
// Gap between the week-day header and the month header.
|
|
13851
|
+
weekGap: parseTokenValue52(datePicker.spacing.gap),
|
|
13852
|
+
// Gap between the month header and the dates grid.
|
|
13853
|
+
datesGap: parseTokenValue52(theme2.tokens.semantics.dimensions.spacing.md),
|
|
13771
13854
|
containerMaxWidth: parseTokenValue52(dt.size.width) * 7,
|
|
13772
13855
|
headerGap: parseTokenValue52(datePicker.month.spacing.gap),
|
|
13773
13856
|
cellHeight: parseTokenValue52(dt.size.height),
|
|
@@ -13777,7 +13860,7 @@ var DatePicker = React65.forwardRef(
|
|
|
13777
13860
|
disabledOpacity: parseTokenValue52(dt.opacity.disabled),
|
|
13778
13861
|
rowGap: parseTokenValue52(datePicker.dates.spacing.gap)
|
|
13779
13862
|
}),
|
|
13780
|
-
[datePicker, dt]
|
|
13863
|
+
[datePicker, dt, theme2]
|
|
13781
13864
|
);
|
|
13782
13865
|
const resolvedGetDateState = useCallback(
|
|
13783
13866
|
(date) => {
|
|
@@ -13887,11 +13970,10 @@ var DatePicker = React65.forwardRef(
|
|
|
13887
13970
|
StyledContainer3,
|
|
13888
13971
|
__spreadProps(__spreadValues({
|
|
13889
13972
|
ref,
|
|
13890
|
-
containerGap,
|
|
13891
13973
|
containerMaxWidth
|
|
13892
13974
|
}, rest), {
|
|
13893
13975
|
children: [
|
|
13894
|
-
showWeekHeader && /* @__PURE__ */ jsx(StyledWeekRow, { accessibilityElementsHidden: true, children: weekDayLabels.map((label) => /* @__PURE__ */ jsx(StyledWeekCell, {
|
|
13976
|
+
showWeekHeader && /* @__PURE__ */ jsx(StyledWeekRow, { weekGap, accessibilityElementsHidden: true, children: weekDayLabels.map((label) => /* @__PURE__ */ jsx(StyledWeekCell, { children: /* @__PURE__ */ jsx(
|
|
13895
13977
|
Typography,
|
|
13896
13978
|
{
|
|
13897
13979
|
token: datePicker.week.typography,
|
|
@@ -13900,13 +13982,13 @@ var DatePicker = React65.forwardRef(
|
|
|
13900
13982
|
children: label
|
|
13901
13983
|
}
|
|
13902
13984
|
) }, label)) }),
|
|
13903
|
-
/* @__PURE__ */ jsxs(StyledMonthHeader, { headerGap, children: [
|
|
13985
|
+
/* @__PURE__ */ jsxs(StyledMonthHeader, { headerGap, datesGap, children: [
|
|
13904
13986
|
/* @__PURE__ */ jsx(View, { style: { opacity: showPrevControl ? 1 : 0 }, children: /* @__PURE__ */ jsx(
|
|
13905
13987
|
IconButton,
|
|
13906
13988
|
{
|
|
13907
13989
|
icon: KeyboardArrowLeft_default,
|
|
13908
13990
|
variant: "filled",
|
|
13909
|
-
size: "
|
|
13991
|
+
size: "md",
|
|
13910
13992
|
colour: "primary",
|
|
13911
13993
|
"aria-label": "Previous month",
|
|
13912
13994
|
onPress: showPrevControl ? handlePrevMonth : void 0,
|
|
@@ -13927,7 +14009,7 @@ var DatePicker = React65.forwardRef(
|
|
|
13927
14009
|
{
|
|
13928
14010
|
icon: KeyboardArrowRight_default,
|
|
13929
14011
|
variant: "filled",
|
|
13930
|
-
size: "
|
|
14012
|
+
size: "md",
|
|
13931
14013
|
colour: "primary",
|
|
13932
14014
|
"aria-label": "Next month",
|
|
13933
14015
|
onPress: showNextControl ? handleNextMonth : void 0,
|
|
@@ -14107,7 +14189,7 @@ var StyledPointer = styled50(Svg)(
|
|
|
14107
14189
|
opacity: pointerVisible ? 1 : 0
|
|
14108
14190
|
})
|
|
14109
14191
|
);
|
|
14110
|
-
var PictureSelector =
|
|
14192
|
+
var PictureSelector = React66.forwardRef(
|
|
14111
14193
|
(_a, ref) => {
|
|
14112
14194
|
var _b = _a, {
|
|
14113
14195
|
label,
|
|
@@ -14134,7 +14216,7 @@ var PictureSelector = React65.forwardRef(
|
|
|
14134
14216
|
const { pictureSelector } = theme2.tokens.components;
|
|
14135
14217
|
const { pictureButton } = pictureSelector;
|
|
14136
14218
|
const isControlled = value !== void 0;
|
|
14137
|
-
const [internalValue, setInternalValue] =
|
|
14219
|
+
const [internalValue, setInternalValue] = React66.useState(defaultValue);
|
|
14138
14220
|
const selectedValue = isControlled ? value : internalValue;
|
|
14139
14221
|
const selectedItem = items.find((item) => item.value === selectedValue);
|
|
14140
14222
|
const hasInsight = Boolean(
|
|
@@ -14318,7 +14400,7 @@ var InlineCount = styled50(View)(({ countGap }) => ({
|
|
|
14318
14400
|
alignItems: "center",
|
|
14319
14401
|
gap: countGap
|
|
14320
14402
|
}));
|
|
14321
|
-
var Countdown =
|
|
14403
|
+
var Countdown = React66.forwardRef(
|
|
14322
14404
|
(_a, ref) => {
|
|
14323
14405
|
var _b = _a, {
|
|
14324
14406
|
layout = "stacked",
|
|
@@ -14397,7 +14479,7 @@ var Countdown = React65.forwardRef(
|
|
|
14397
14479
|
InlineGroup,
|
|
14398
14480
|
{
|
|
14399
14481
|
groupGap: parseTokenValue54(countdown.countdownGroup.spacing.gap),
|
|
14400
|
-
children: units.map((unit, index) => /* @__PURE__ */ jsxs(
|
|
14482
|
+
children: units.map((unit, index) => /* @__PURE__ */ jsxs(React66.Fragment, { children: [
|
|
14401
14483
|
index > 0 && colon(`colon-${unit.key}`),
|
|
14402
14484
|
/* @__PURE__ */ jsxs(
|
|
14403
14485
|
InlineCount,
|
|
@@ -14440,7 +14522,7 @@ var Countdown = React65.forwardRef(
|
|
|
14440
14522
|
ref,
|
|
14441
14523
|
rootGap: parseTokenValue54(countdown.spacing.gap)
|
|
14442
14524
|
}, rest), {
|
|
14443
|
-
children: units.map((unit, index) => /* @__PURE__ */ jsxs(
|
|
14525
|
+
children: units.map((unit, index) => /* @__PURE__ */ jsxs(React66.Fragment, { children: [
|
|
14444
14526
|
index > 0 && colon(`colon-${unit.key}`),
|
|
14445
14527
|
/* @__PURE__ */ jsxs(
|
|
14446
14528
|
StackedItem,
|
|
@@ -14528,7 +14610,7 @@ var BadgeIcon = styled50(View)(({ theme: theme2 }) => {
|
|
|
14528
14610
|
flexShrink: 0
|
|
14529
14611
|
};
|
|
14530
14612
|
});
|
|
14531
|
-
var Badge2 =
|
|
14613
|
+
var Badge2 = React66.forwardRef(
|
|
14532
14614
|
(_a, ref) => {
|
|
14533
14615
|
var _b = _a, { icon, text } = _b, rest = __objRest(_b, ["icon", "text"]);
|
|
14534
14616
|
return /* @__PURE__ */ jsxs(BadgeContainer, __spreadProps(__spreadValues({ ref }, rest), { children: [
|
|
@@ -14546,7 +14628,7 @@ var StyledGrid = styled50(View)(({ theme: theme2 }) => {
|
|
|
14546
14628
|
"grid-row-gap": spacing.xl
|
|
14547
14629
|
};
|
|
14548
14630
|
});
|
|
14549
|
-
var Grid =
|
|
14631
|
+
var Grid = React66.forwardRef(
|
|
14550
14632
|
(_a, ref) => {
|
|
14551
14633
|
var _b = _a, { children, xs = 1, md = 2, lg = 3 } = _b, rest = __objRest(_b, ["children", "xs", "md", "lg"]);
|
|
14552
14634
|
const { width } = useWindowDimensions();
|
|
@@ -14645,7 +14727,7 @@ var PricingContainer = styled50(View)(({ theme: theme2 }) => {
|
|
|
14645
14727
|
width: "100%"
|
|
14646
14728
|
};
|
|
14647
14729
|
});
|
|
14648
|
-
var _ProductListingCard =
|
|
14730
|
+
var _ProductListingCard = React66.forwardRef(
|
|
14649
14731
|
(_a, ref) => {
|
|
14650
14732
|
var _b = _a, {
|
|
14651
14733
|
image,
|
|
@@ -14687,7 +14769,7 @@ var _ProductListingCard = React65.forwardRef(
|
|
|
14687
14769
|
accessibilityLabel: imageAlt,
|
|
14688
14770
|
accessible: true
|
|
14689
14771
|
}
|
|
14690
|
-
) :
|
|
14772
|
+
) : React66.isValidElement(image) ? image : /* @__PURE__ */ jsx(
|
|
14691
14773
|
StyledImage2,
|
|
14692
14774
|
{
|
|
14693
14775
|
source: image,
|
|
@@ -14833,7 +14915,7 @@ var StyledNoneBanner = styled50(View)(({ theme: theme2 }) => {
|
|
|
14833
14915
|
borderBottomRightRadius: radiusMd
|
|
14834
14916
|
};
|
|
14835
14917
|
});
|
|
14836
|
-
var ProductDisplayCard =
|
|
14918
|
+
var ProductDisplayCard = React66.forwardRef(
|
|
14837
14919
|
(_a, ref) => {
|
|
14838
14920
|
var _b = _a, {
|
|
14839
14921
|
title,
|
|
@@ -14963,9 +15045,9 @@ var ProductDisplayCard = React65.forwardRef(
|
|
|
14963
15045
|
}
|
|
14964
15046
|
);
|
|
14965
15047
|
ProductDisplayCard.displayName = "ProductDisplayCard";
|
|
14966
|
-
var TabNavigationContext =
|
|
15048
|
+
var TabNavigationContext = React66.createContext(void 0);
|
|
14967
15049
|
var useTabNavigationContext = () => {
|
|
14968
|
-
const context =
|
|
15050
|
+
const context = React66.useContext(TabNavigationContext);
|
|
14969
15051
|
if (!context) {
|
|
14970
15052
|
throw new Error(
|
|
14971
15053
|
"TabNavigation.List, TabNavigation.Tab and TabNavigation.Panel must be used within a TabNavigation component."
|
|
@@ -15004,7 +15086,7 @@ var StyledTab = styled50(Pressable)(
|
|
|
15004
15086
|
borderBottomColor: tabBorderColor
|
|
15005
15087
|
}, tabFlex !== void 0 ? { flex: tabFlex } : { flexShrink: 0 })
|
|
15006
15088
|
);
|
|
15007
|
-
var TabNavigationList =
|
|
15089
|
+
var TabNavigationList = React66.forwardRef(
|
|
15008
15090
|
(_a, ref) => {
|
|
15009
15091
|
var _b = _a, { children } = _b, rest = __objRest(_b, ["children"]);
|
|
15010
15092
|
const { layout } = useTabNavigationContext();
|
|
@@ -15023,7 +15105,7 @@ var TabNavigationList = React65.forwardRef(
|
|
|
15023
15105
|
}
|
|
15024
15106
|
);
|
|
15025
15107
|
TabNavigationList.displayName = "TabNavigation.List";
|
|
15026
|
-
var TabNavigationTab =
|
|
15108
|
+
var TabNavigationTab = React66.forwardRef(
|
|
15027
15109
|
(_a, ref) => {
|
|
15028
15110
|
var _b = _a, { value, disabled = false, icon, avatar, children } = _b, rest = __objRest(_b, ["value", "disabled", "icon", "avatar", "children"]);
|
|
15029
15111
|
const { layout } = useTabNavigationContext();
|
|
@@ -15059,7 +15141,7 @@ var TabNavigationTab = React65.forwardRef(
|
|
|
15059
15141
|
}
|
|
15060
15142
|
);
|
|
15061
15143
|
TabNavigationTab.displayName = "TabNavigation.Tab";
|
|
15062
|
-
var TabNavigationPanel =
|
|
15144
|
+
var TabNavigationPanel = React66.forwardRef(
|
|
15063
15145
|
(_a, ref) => {
|
|
15064
15146
|
var _b = _a, { value, children } = _b, rest = __objRest(_b, ["value", "children"]);
|
|
15065
15147
|
const { animation } = useTabNavigationContext();
|
|
@@ -15067,7 +15149,7 @@ var TabNavigationPanel = React65.forwardRef(
|
|
|
15067
15149
|
}
|
|
15068
15150
|
);
|
|
15069
15151
|
TabNavigationPanel.displayName = "TabNavigation.Panel";
|
|
15070
|
-
var TabNavigationRoot =
|
|
15152
|
+
var TabNavigationRoot = React66.forwardRef(
|
|
15071
15153
|
(_a, ref) => {
|
|
15072
15154
|
var _b = _a, {
|
|
15073
15155
|
value,
|
|
@@ -15085,11 +15167,11 @@ var TabNavigationRoot = React65.forwardRef(
|
|
|
15085
15167
|
"children"
|
|
15086
15168
|
]);
|
|
15087
15169
|
const isControlled = typeof value === "string";
|
|
15088
|
-
const [uncontrolledValue, setUncontrolledValue] =
|
|
15170
|
+
const [uncontrolledValue, setUncontrolledValue] = React66.useState(
|
|
15089
15171
|
() => defaultValue != null ? defaultValue : ""
|
|
15090
15172
|
);
|
|
15091
15173
|
const currentValue = isControlled ? value : uncontrolledValue;
|
|
15092
|
-
const handleValueChange =
|
|
15174
|
+
const handleValueChange = React66.useCallback(
|
|
15093
15175
|
(newValue) => {
|
|
15094
15176
|
if (!isControlled) {
|
|
15095
15177
|
setUncontrolledValue(newValue);
|
|
@@ -15098,7 +15180,7 @@ var TabNavigationRoot = React65.forwardRef(
|
|
|
15098
15180
|
},
|
|
15099
15181
|
[isControlled, onValueChange]
|
|
15100
15182
|
);
|
|
15101
|
-
const contextValue =
|
|
15183
|
+
const contextValue = React66.useMemo(
|
|
15102
15184
|
() => ({ layout, animation }),
|
|
15103
15185
|
[layout, animation]
|
|
15104
15186
|
);
|