@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/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 React65, { createContext, forwardRef, useRef, useEffect, useState, useCallback, useMemo, useContext } from 'react';
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 = React65.forwardRef(
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 = React65.forwardRef(
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 = React65.forwardRef(
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 = React65.forwardRef(
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 = React65.forwardRef(
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 = React65.forwardRef(
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 = React65.forwardRef(
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] = React65.useState(false);
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 = React65.forwardRef(
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 = React65.forwardRef(
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] = React65.useState(false);
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 = React65.forwardRef(
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 = React65.forwardRef(
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 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" }) }));
4739
- var ForwardRef492 = forwardRef(Refresh);
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 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" }) }));
4742
- var ForwardRef502 = forwardRef(Remove);
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 Remove_default = ForwardRef502;
4745
- 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" }) }));
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 RemoveCircle_default = ForwardRef512;
4749
- 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" }) }));
4750
- var ForwardRef522 = forwardRef(RemoveCircleOutline);
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 RemoveCircleOutline_default = ForwardRef522;
4753
- 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" }) }));
4754
- var ForwardRef532 = forwardRef(Search);
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 Search_default = ForwardRef532;
4757
- 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" }) }));
4758
- var ForwardRef542 = forwardRef(Settings);
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 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" }) }));
4761
- var ForwardRef552 = forwardRef(StarBorder);
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 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" }) }));
4764
- var ForwardRef562 = forwardRef(StarHalf);
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 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" }) }));
4767
- var ForwardRef572 = forwardRef(StarRate);
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 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" }) }));
4770
- var ForwardRef582 = forwardRef(User);
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 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" }) }));
4773
- var ForwardRef592 = forwardRef(Visibility);
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 Visibility_default = ForwardRef592;
4776
- 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" }) }));
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 VisibilityOff_default = ForwardRef602;
4780
- 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" }) }));
4781
- var ForwardRef612 = forwardRef(VolumeOff);
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 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" }) }));
4784
- var ForwardRef622 = forwardRef(VolumeUp);
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 = React65.forwardRef(
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 = React65.forwardRef(
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 = React65.forwardRef(
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 = React65.forwardRef(
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 = React65.forwardRef(
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 = React65.forwardRef(
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 = React65.forwardRef(
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 = React65.forwardRef((_a, ref) => {
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 = React65.forwardRef(
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 = React65.forwardRef(
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] = React65.useState(defaultChecked);
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 = React65.forwardRef(
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 = React65.forwardRef(
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 = React65.forwardRef(
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 = React65.forwardRef(
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] = React65.useState(0);
8443
- React65.useEffect(() => {
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 = React65.createContext({
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 = React65.forwardRef(
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
- } = React65.useContext(AccordionContext);
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 = React65.forwardRef(
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] = React65.useState(
8623
+ const [internalValue, setInternalValue] = React66.useState(
8621
8624
  defaultValue != null ? defaultValue : []
8622
8625
  );
8623
8626
  const openValues = isControlled ? controlledValue : internalValue;
8624
- const toggle = React65.useCallback(
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 = React65.useMemo(
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 = React65.forwardRef(
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 = React65.createContext({
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 = () => React65.useContext(DrawerContext);
8803
+ var useDrawerContext = () => React66.useContext(DrawerContext);
8801
8804
  var FADE_DURATION = 220;
8802
- var DrawerOverlay = React65.forwardRef(({ accessible = false }, _ref) => {
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 = React65.createContext(null);
8837
- var useDrawerDragContext = () => React65.useContext(DrawerDragContext);
8838
- var DrawerFooterContext = React65.createContext(false);
8839
- var useDrawerFooterContext = () => React65.useContext(DrawerFooterContext);
8840
- var DrawerHeaderContext = React65.createContext(null);
8841
- var useDrawerHeaderContext = () => React65.useContext(DrawerHeaderContext);
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 = React65.forwardRef(
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 !== panelHeightRef.current && capped > 0) {
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 && !entryRanRef.current && capped > 0) {
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 = React65.Children.toArray(children).some(
9030
- (child) => React65.isValidElement(child) && child.type.displayName === "Drawer.Footer"
9076
+ const hasFooter = React66.Children.toArray(children).some(
9077
+ (child) => React66.isValidElement(child) && child.type.displayName === "Drawer.Footer"
9031
9078
  );
9032
- const headerChild = React65.Children.toArray(children).find(
9033
- (child) => React65.isValidElement(child) && child.type.displayName === "Drawer.Header"
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 = React65.forwardRef(
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 = React65.forwardRef(
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
- React65.Children.forEach(children, (child) => {
9238
- if (React65.isValidElement(child) && child.type === DrawerClose) {
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 = React65.forwardRef(
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 = React65.forwardRef(
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 = React65.forwardRef(
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 = React65.forwardRef(
9431
+ var DrawerBody = React66.forwardRef(
9383
9432
  (_a, ref) => {
9384
- var _b = _a, { children, contentContainerStyle } = _b, props = __objRest(_b, ["children", "contentContainerStyle"]);
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 { height: windowHeight } = useWindowDimensions();
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 bodyMaxHeight = windowHeight - 300;
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 = React65.forwardRef(
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 = React65.forwardRef(
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 = React65.forwardRef(
9565
+ var DrawerTrigger = React66.forwardRef(
9493
9566
  ({ children }, ref) => {
9494
- const { openDrawer } = React65.useContext(DrawerContext);
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 } = React65.useContext(DrawerContext);
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 = React65.forwardRef(
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 = React65.forwardRef(
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: React65.Children.map(children, (child, index) => {
9674
- if (!React65.isValidElement(child)) return child;
9675
- return /* @__PURE__ */ jsx(StyledChildSlot, { slotInline: isInline, children: React65.cloneElement(
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 = React65.forwardRef(
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] = React65.useState(defaultChecked);
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 = React65.forwardRef(
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 = React65.forwardRef(
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] = React65.useState(
9982
+ const [internalValue, setInternalValue] = React66.useState(
9910
9983
  typeof defaultValue === "string" ? defaultValue : ""
9911
9984
  );
9912
- const [copied, setCopied] = React65.useState(false);
9913
- const timeoutRef = React65.useRef(
9985
+ const [copied, setCopied] = React66.useState(false);
9986
+ const timeoutRef = React66.useRef(
9914
9987
  void 0
9915
9988
  );
9916
- React65.useEffect(() => {
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
- React65.useEffect(() => {
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 = React65.forwardRef(
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 = React65.createContext({
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 = React65.forwardRef(
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 } = React65.useContext(FilterTabContext);
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 = React65.forwardRef(
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] = React65.useState(defaultValue);
10282
+ const [internalValue, setInternalValue] = React66.useState(defaultValue);
10210
10283
  const selectedValues = isControlled ? controlledValue : internalValue;
10211
- const toggle = React65.useCallback(
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 = React65.useMemo(
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 = React65.forwardRef(
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] = React65.useState(false);
10342
- const [isEdited, setIsEdited] = React65.useState(false);
10343
- const initialValueRef = React65.useRef((_a2 = value != null ? value : defaultValue) != null ? _a2 : "");
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 = React65.useCallback(
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 = React65.useCallback(
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 = React65.useCallback(
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 = React65.forwardRef(
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 = React65.forwardRef((_a, ref) => {
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] = React65.useState(false);
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 = React65.forwardRef((_a, ref) => {
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 = React65.forwardRef((_a, ref) => {
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 = React65.forwardRef(
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 = React65.forwardRef(
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 = React65.forwardRef(
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 = React65.forwardRef(
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 = React65.forwardRef(
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] = React65.useState(
11233
+ const [internalValue, setInternalValue] = React66.useState(
11158
11234
  derivedDefaultValue != null ? derivedDefaultValue : ""
11159
11235
  );
11160
11236
  const currentValue = isControlled ? value : internalValue;
11161
- const handleSelect = React65.useCallback(
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 React65.Children.map(children, (child) => {
11183
- if (!React65.isValidElement(child)) return child;
11184
- return React65.cloneElement(child, {
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 = React65.forwardRef((_a, ref) => {
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] = React65.useState("");
11212
- const inputRef = React65.useRef(null);
11213
- React65.useImperativeHandle(ref, () => inputRef.current);
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 = React65.forwardRef(
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 = React65.useId();
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 = React65.forwardRef(
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 = React65.useRef(null);
11489
- const [containerWidth, setContainerWidth] = React65.useState(0);
11490
- const [contentWidth, setContentWidth] = React65.useState(0);
11491
- const [scrollX, setScrollX] = React65.useState(0);
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 = React65.forwardRef(
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 = React65.Children.toArray(children);
11687
+ const childrenArray = React66.Children.toArray(children);
11612
11688
  const firstChildValue = childrenArray.map((child) => {
11613
- if (!React65.isValidElement(child)) return void 0;
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] = React65.useState(
11694
+ const [uncontrolledValue, setUncontrolledValue] = React66.useState(
11619
11695
  () => derivedDefaultValue != null ? derivedDefaultValue : ""
11620
11696
  );
11621
11697
  const currentValue = isControlled ? value : uncontrolledValue;
11622
- const handleSelect = React65.useCallback(
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 (!React65.isValidElement(child)) return child;
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 = React65.forwardRef(
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 = React65.forwardRef(
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 = React65.forwardRef((_a, ref) => {
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 = React65.forwardRef(
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 = React65.forwardRef(
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] = React65.useState(false);
12025
- const [showContent, setShowContent] = React65.useState(false);
12026
- const [internalValue, setInternalValue] = React65.useState(
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] = React65.useState("");
12030
- const [clearKey, setClearKey] = React65.useState(0);
12031
- const searchInputRef = React65.useRef(null);
12032
- React65.useEffect(() => {
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 = React65.Children.toArray(children).some(
12066
- (child) => React65.isValidElement(child) && child.type === SelectFieldContent
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 = React65.Children.toArray(children);
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 (React65.isValidElement(child) && child.type === SelectFieldItem) {
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 (React65.isValidElement(child) && child.type === SelectFieldItem) {
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 React65.cloneElement(
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 = React65.forwardRef(
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 = React65.forwardRef(
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] = React65.useState(defaultValue);
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 = React65.forwardRef(
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 = React65.forwardRef(
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 = React65.isValidElement(children) ? children : null;
13334
- const trigger = child ? React65.cloneElement(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 = React65.forwardRef(
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 = React65.forwardRef(
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: React65.createElement(media.illustration, {
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)(({ containerGap, containerMaxWidth }) => ({
13731
+ var StyledContainer3 = styled50(View)(({ containerMaxWidth }) => ({
13656
13732
  flexDirection: "column",
13657
- gap: containerGap,
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 = React65.forwardRef(
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
- containerGap,
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
- containerGap: parseTokenValue52(datePicker.spacing.gap),
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, { cellHeight, children: /* @__PURE__ */ jsx(
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: "sm",
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: "sm",
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 = React65.forwardRef(
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] = React65.useState(defaultValue);
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 = React65.forwardRef(
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(React65.Fragment, { children: [
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(React65.Fragment, { children: [
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 = React65.forwardRef(
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 = React65.forwardRef(
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 = React65.forwardRef(
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
- ) : React65.isValidElement(image) ? image : /* @__PURE__ */ jsx(
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 = React65.forwardRef(
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 = React65.createContext(void 0);
15048
+ var TabNavigationContext = React66.createContext(void 0);
14967
15049
  var useTabNavigationContext = () => {
14968
- const context = React65.useContext(TabNavigationContext);
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 = React65.forwardRef(
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 = React65.forwardRef(
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 = React65.forwardRef(
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 = React65.forwardRef(
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] = React65.useState(
15170
+ const [uncontrolledValue, setUncontrolledValue] = React66.useState(
15089
15171
  () => defaultValue != null ? defaultValue : ""
15090
15172
  );
15091
15173
  const currentValue = isControlled ? value : uncontrolledValue;
15092
- const handleValueChange = React65.useCallback(
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 = React65.useMemo(
15183
+ const contextValue = React66.useMemo(
15102
15184
  () => ({ layout, animation }),
15103
15185
  [layout, animation]
15104
15186
  );