@butternutbox/pawprint-native 0.14.0 → 0.15.0

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
@@ -10148,6 +10148,128 @@ var Tooltip = React66.forwardRef(
10148
10148
  );
10149
10149
  Tooltip.displayName = "Tooltip";
10150
10150
  var parseTokenValue53 = (value) => parseFloat(value);
10151
+ var Row = styled51(Pressable)(({ theme: theme2, divider }) => {
10152
+ const { spacing } = theme2.tokens.semantics.dimensions;
10153
+ const { colour } = theme2.tokens.semantics;
10154
+ return {
10155
+ width: "100%",
10156
+ alignItems: "center",
10157
+ justifyContent: "center",
10158
+ paddingVertical: parseTokenValue53(spacing.md),
10159
+ paddingHorizontal: parseTokenValue53(spacing.md),
10160
+ borderBottomWidth: divider ? 1 : 0,
10161
+ borderBottomColor: colour.border.divider
10162
+ };
10163
+ });
10164
+ var MenuItem = React66.forwardRef((_a, ref) => {
10165
+ var _b = _a, { variant = "action", onPress, children, divider = true } = _b, rest = __objRest(_b, ["variant", "onPress", "children", "divider"]);
10166
+ const theme2 = useTheme();
10167
+ const { colour, typography } = theme2.tokens.semantics;
10168
+ const labelColour = variant === "destructive" ? colour.text.error : colour.text.action.default;
10169
+ const label = typeof children === "string" || typeof children === "number" ? String(children) : void 0;
10170
+ return /* @__PURE__ */ jsx(
10171
+ Row,
10172
+ __spreadProps(__spreadValues({
10173
+ ref,
10174
+ divider,
10175
+ onPress,
10176
+ accessible: true,
10177
+ accessibilityRole: "menuitem",
10178
+ accessibilityLabel: label
10179
+ }, rest), {
10180
+ children: label !== void 0 ? /* @__PURE__ */ jsx(
10181
+ Typography,
10182
+ {
10183
+ token: typography.body.medium.md,
10184
+ align: "center",
10185
+ color: labelColour,
10186
+ children: label
10187
+ }
10188
+ ) : children
10189
+ })
10190
+ );
10191
+ });
10192
+ MenuItem.displayName = "Menu.Item";
10193
+ var parseTokenValue54 = (value) => parseFloat(value);
10194
+ var DismissLayer = styled51(Pressable)({
10195
+ position: "absolute",
10196
+ top: 0,
10197
+ left: 0,
10198
+ right: 0,
10199
+ bottom: 0
10200
+ });
10201
+ var Anchor = styled51(View)(({ theme: theme2, align }) => {
10202
+ const inset = parseTokenValue54(theme2.tokens.semantics.dimensions.spacing.md);
10203
+ return __spreadValues({
10204
+ position: "absolute"
10205
+ }, align === "right" ? { right: inset } : { left: inset });
10206
+ });
10207
+ var Card = styled51(Pressable)(({ theme: theme2, width }) => {
10208
+ const { borderRadius } = theme2.tokens.semantics.dimensions;
10209
+ const { shadow, background } = theme2.tokens.semantics.colour;
10210
+ return {
10211
+ width,
10212
+ maxWidth: "90%",
10213
+ borderRadius: parseTokenValue54(borderRadius.md),
10214
+ overflow: "hidden",
10215
+ backgroundColor: background.surface.default,
10216
+ // Shadow token colour carries its own alpha, so opacity stays at 1.
10217
+ shadowColor: shadow.md.color,
10218
+ shadowOffset: {
10219
+ width: parseTokenValue54(shadow.md.offsetX),
10220
+ height: parseTokenValue54(shadow.md.offsetY)
10221
+ },
10222
+ shadowOpacity: 1,
10223
+ shadowRadius: parseTokenValue54(shadow.md.blur),
10224
+ elevation: 8
10225
+ };
10226
+ });
10227
+ var MenuRoot = ({
10228
+ open,
10229
+ onClose,
10230
+ anchorOffset = 0,
10231
+ align = "right",
10232
+ width = 360,
10233
+ closeAccessibilityLabel = "Close menu",
10234
+ children
10235
+ }) => {
10236
+ return /* @__PURE__ */ jsxs(
10237
+ Modal,
10238
+ {
10239
+ visible: open,
10240
+ transparent: true,
10241
+ statusBarTranslucent: true,
10242
+ animationType: "fade",
10243
+ onRequestClose: onClose,
10244
+ children: [
10245
+ /* @__PURE__ */ jsx(
10246
+ DismissLayer,
10247
+ {
10248
+ onPress: onClose,
10249
+ accessible: false,
10250
+ accessibilityLabel: closeAccessibilityLabel
10251
+ }
10252
+ ),
10253
+ /* @__PURE__ */ jsx(Anchor, { align, style: { top: anchorOffset }, children: /* @__PURE__ */ jsx(
10254
+ Card,
10255
+ {
10256
+ width,
10257
+ onPress: () => {
10258
+ },
10259
+ accessible: false,
10260
+ accessibilityRole: "menu",
10261
+ children
10262
+ }
10263
+ ) })
10264
+ ]
10265
+ }
10266
+ );
10267
+ };
10268
+ MenuRoot.displayName = "Menu";
10269
+ var Menu2 = Object.assign(MenuRoot, {
10270
+ Item: MenuItem
10271
+ });
10272
+ var parseTokenValue55 = (value) => parseFloat(value);
10151
10273
  var StyledInsightRoot = styled51(View)(
10152
10274
  ({
10153
10275
  rootGap,
@@ -10192,26 +10314,26 @@ var MessageCardInsight = React66.forwardRef(
10192
10314
  const isSupporting = variant === "supporting";
10193
10315
  const supporting = insightCard.spacing.supporting;
10194
10316
  const standalone = insightCard.spacing.standalone;
10195
- const radiusStandalone = parseTokenValue53(
10317
+ const radiusStandalone = parseTokenValue55(
10196
10318
  insightCard.borderRadius.standalone.default
10197
10319
  );
10198
- const radiusSupporting = parseTokenValue53(
10320
+ const radiusSupporting = parseTokenValue55(
10199
10321
  insightCard.borderRadius.supporting.bottom
10200
10322
  );
10201
10323
  return /* @__PURE__ */ jsxs(
10202
10324
  StyledInsightRoot,
10203
10325
  __spreadProps(__spreadValues({
10204
10326
  ref,
10205
- rootGap: parseTokenValue53(
10327
+ rootGap: parseTokenValue55(
10206
10328
  isSupporting ? supporting.gap : standalone.gap
10207
10329
  ),
10208
- rootPaddingH: parseTokenValue53(
10330
+ rootPaddingH: parseTokenValue55(
10209
10331
  isSupporting ? semanticSpacing.md : standalone.horizontalPadding
10210
10332
  ),
10211
- rootPaddingTop: parseTokenValue53(
10333
+ rootPaddingTop: parseTokenValue55(
10212
10334
  isSupporting ? supporting.topPadding : standalone.verticalPadding
10213
10335
  ),
10214
- rootPaddingBottom: parseTokenValue53(
10336
+ rootPaddingBottom: parseTokenValue55(
10215
10337
  isSupporting ? supporting.bottomPadding : standalone.verticalPadding
10216
10338
  ),
10217
10339
  rootBorderTopLeftRadius: isSupporting ? 0 : radiusStandalone,
@@ -10219,7 +10341,7 @@ var MessageCardInsight = React66.forwardRef(
10219
10341
  rootBorderBottomLeftRadius: isSupporting ? radiusSupporting : radiusStandalone,
10220
10342
  rootBorderBottomRightRadius: isSupporting ? radiusSupporting : radiusStandalone,
10221
10343
  rootBgColor: insightCard.colour.background.default,
10222
- rootMinWidth: parseTokenValue53(insightCard.size.minWidth),
10344
+ rootMinWidth: parseTokenValue55(insightCard.size.minWidth),
10223
10345
  accessible: true,
10224
10346
  accessibilityRole: "summary"
10225
10347
  }, rest), {
@@ -10228,7 +10350,7 @@ var MessageCardInsight = React66.forwardRef(
10228
10350
  /* @__PURE__ */ jsxs(
10229
10351
  StyledInsightContent,
10230
10352
  {
10231
- contentGap: parseTokenValue53(standalone.content.gap),
10353
+ contentGap: parseTokenValue55(standalone.content.gap),
10232
10354
  children: [
10233
10355
  title && /* @__PURE__ */ jsx(
10234
10356
  Typography,
@@ -10320,9 +10442,9 @@ var MessageCardBanner = React66.forwardRef(
10320
10442
  StyledBannerRoot,
10321
10443
  __spreadProps(__spreadValues({
10322
10444
  ref,
10323
- rootGap: parseTokenValue53(dimensions3.spacing.md),
10324
- rootPadding: parseTokenValue53(dimensions3.spacing.md),
10325
- rootBorderRadius: parseTokenValue53(dimensions3.borderRadius.md),
10445
+ rootGap: parseTokenValue55(dimensions3.spacing.md),
10446
+ rootPadding: parseTokenValue55(dimensions3.spacing.md),
10447
+ rootBorderRadius: parseTokenValue55(dimensions3.borderRadius.md),
10326
10448
  rootBgColor: bgColor,
10327
10449
  accessible: true,
10328
10450
  accessibilityRole: "summary"
@@ -10334,7 +10456,7 @@ var MessageCardBanner = React66.forwardRef(
10334
10456
  }) }) : (media == null ? void 0 : media.type) === "image" ? /* @__PURE__ */ jsx(
10335
10457
  StyledBannerImage,
10336
10458
  {
10337
- imageRadius: parseTokenValue53(dimensions3.borderRadius.sm),
10459
+ imageRadius: parseTokenValue55(dimensions3.borderRadius.sm),
10338
10460
  imageBgColor: colour.background.surface.secondary,
10339
10461
  children: /* @__PURE__ */ jsx(
10340
10462
  Image,
@@ -10350,12 +10472,12 @@ var MessageCardBanner = React66.forwardRef(
10350
10472
  /* @__PURE__ */ jsxs(
10351
10473
  StyledBannerContents,
10352
10474
  {
10353
- contentsGap: parseTokenValue53(dimensions3.spacing.xs),
10475
+ contentsGap: parseTokenValue55(dimensions3.spacing.xs),
10354
10476
  children: [
10355
10477
  /* @__PURE__ */ jsxs(
10356
10478
  StyledBannerCopy,
10357
10479
  {
10358
- copyGap: parseTokenValue53(dimensions3.spacing["3xs"]),
10480
+ copyGap: parseTokenValue55(dimensions3.spacing["3xs"]),
10359
10481
  children: [
10360
10482
  title && /* @__PURE__ */ jsx(Typography, { variant: "heading", size: "xs", color: "primary", children: title }),
10361
10483
  /* @__PURE__ */ jsx(Typography, { variant: "body", size: "md", color: "secondary", children })
@@ -10386,7 +10508,7 @@ var MessageCard = {
10386
10508
  Insight: MessageCardInsight,
10387
10509
  Banner: MessageCardBanner
10388
10510
  };
10389
- var parseTokenValue54 = (value) => parseFloat(value);
10511
+ var parseTokenValue56 = (value) => parseFloat(value);
10390
10512
  var slideEaseOut = Easing$1.out(Easing$1.quad);
10391
10513
  var MONTH_SLIDE_ENTERING = {
10392
10514
  forward: FadeInRight.duration(250).easing(slideEaseOut),
@@ -10547,17 +10669,17 @@ var DatePicker = React66.forwardRef(
10547
10669
  } = useMemo(
10548
10670
  () => ({
10549
10671
  // Gap between the week-day header and the month header.
10550
- weekGap: parseTokenValue54(datePicker.spacing.gap),
10672
+ weekGap: parseTokenValue56(datePicker.spacing.gap),
10551
10673
  // Gap between the month header and the dates grid.
10552
- datesGap: parseTokenValue54(theme2.tokens.semantics.dimensions.spacing.md),
10553
- containerMaxWidth: parseTokenValue54(dt.size.width) * 7,
10554
- headerGap: parseTokenValue54(datePicker.month.spacing.gap),
10555
- cellHeight: parseTokenValue54(dt.size.height),
10556
- indicatorSize: parseTokenValue54(dt.size.indicator),
10557
- indicatorBorderRadius: parseTokenValue54(dt.borderRadius.indicator),
10558
- selectedBorderWidth: parseTokenValue54(dt.borderWidth.indicator.selected),
10559
- disabledOpacity: parseTokenValue54(dt.opacity.disabled),
10560
- rowGap: parseTokenValue54(datePicker.dates.spacing.gap)
10674
+ datesGap: parseTokenValue56(theme2.tokens.semantics.dimensions.spacing.md),
10675
+ containerMaxWidth: parseTokenValue56(dt.size.width) * 7,
10676
+ headerGap: parseTokenValue56(datePicker.month.spacing.gap),
10677
+ cellHeight: parseTokenValue56(dt.size.height),
10678
+ indicatorSize: parseTokenValue56(dt.size.indicator),
10679
+ indicatorBorderRadius: parseTokenValue56(dt.borderRadius.indicator),
10680
+ selectedBorderWidth: parseTokenValue56(dt.borderWidth.indicator.selected),
10681
+ disabledOpacity: parseTokenValue56(dt.opacity.disabled),
10682
+ rowGap: parseTokenValue56(datePicker.dates.spacing.gap)
10561
10683
  }),
10562
10684
  [datePicker, dt, theme2]
10563
10685
  );
@@ -10835,7 +10957,7 @@ var buildPointerPath = (r) => {
10835
10957
  "Z"
10836
10958
  ].join(" ");
10837
10959
  };
10838
- var parseTokenValue55 = (value) => parseFloat(value);
10960
+ var parseTokenValue57 = (value) => parseFloat(value);
10839
10961
  var StyledRoot16 = styled51(View)(({ rootGap }) => ({
10840
10962
  flexDirection: "column",
10841
10963
  gap: rootGap,
@@ -10925,21 +11047,21 @@ var PictureSelector = React66.forwardRef(
10925
11047
  if (!isControlled) setInternalValue(nextValue);
10926
11048
  onValueChange == null ? void 0 : onValueChange(nextValue);
10927
11049
  };
10928
- const rootGap = parseTokenValue55(pictureSelector.spacing.container.gap);
10929
- const rowGap = parseTokenValue55(pictureSelector.spacing.buttons.gap);
10930
- const stackGap = parseTokenValue55(pictureButton.spacing.container.gap);
10931
- const buttonPadding = parseTokenValue55(pictureButton.spacing.padding);
10932
- const buttonBorderRadius = parseTokenValue55(
11050
+ const rootGap = parseTokenValue57(pictureSelector.spacing.container.gap);
11051
+ const rowGap = parseTokenValue57(pictureSelector.spacing.buttons.gap);
11052
+ const stackGap = parseTokenValue57(pictureButton.spacing.container.gap);
11053
+ const buttonPadding = parseTokenValue57(pictureButton.spacing.padding);
11054
+ const buttonBorderRadius = parseTokenValue57(
10933
11055
  pictureButton.borderRadius.default
10934
11056
  );
10935
- const borderWidthDefault = parseTokenValue55(
11057
+ const borderWidthDefault = parseTokenValue57(
10936
11058
  pictureButton.borderWidth.default
10937
11059
  );
10938
- const borderWidthActive = parseTokenValue55(pictureButton.borderWidth.active);
11060
+ const borderWidthActive = parseTokenValue57(pictureButton.borderWidth.active);
10939
11061
  const pointerPath = buildPointerPath(
10940
- parseTokenValue55(pictureButton.pointer.borderRadius.default)
11062
+ parseTokenValue57(pictureButton.pointer.borderRadius.default)
10941
11063
  );
10942
- const resolvedMinWidth = itemMinWidth != null ? itemMinWidth : parseTokenValue55(pictureButton.size.minWidth);
11064
+ const resolvedMinWidth = itemMinWidth != null ? itemMinWidth : parseTokenValue57(pictureButton.size.minWidth);
10943
11065
  const resolvedMinHeight = itemMinHeight != null ? itemMinHeight : resolvedMinWidth;
10944
11066
  return /* @__PURE__ */ jsxs(
10945
11067
  StyledRoot16,
@@ -11032,7 +11154,7 @@ var DEFAULT_UNIT_LABELS = {
11032
11154
  seconds: { singular: "sec", plural: "secs" }
11033
11155
  };
11034
11156
  var resolveLabel = (label, value) => typeof label === "string" ? label : value === 1 ? label.singular : label.plural;
11035
- var parseTokenValue56 = (value) => parseFloat(value);
11157
+ var parseTokenValue58 = (value) => parseFloat(value);
11036
11158
  var pad = (value) => String(Math.max(0, Math.floor(value))).padStart(2, "0");
11037
11159
  var StackedRoot = styled51(View)(({ rootGap }) => ({
11038
11160
  flexDirection: "row",
@@ -11162,28 +11284,28 @@ var Countdown = React66.forwardRef(
11162
11284
  InlineRoot,
11163
11285
  __spreadProps(__spreadValues({
11164
11286
  ref,
11165
- rootGap: parseTokenValue56(countdown.spacing.gap),
11166
- rootVerticalPadding: parseTokenValue56(
11287
+ rootGap: parseTokenValue58(countdown.spacing.gap),
11288
+ rootVerticalPadding: parseTokenValue58(
11167
11289
  countdown.spacing.verticalPadding
11168
11290
  ),
11169
- rootHorizontalPadding: parseTokenValue56(
11291
+ rootHorizontalPadding: parseTokenValue58(
11170
11292
  countdown.spacing.horizontalPadding
11171
11293
  ),
11172
11294
  rootBgColor: countdown.colour.background.default,
11173
- rootBorderRadius: parseTokenValue56(countdown.borderRadius.default)
11295
+ rootBorderRadius: parseTokenValue58(countdown.borderRadius.default)
11174
11296
  }, rest), {
11175
11297
  children: [
11176
11298
  label != null && /* @__PURE__ */ jsx(Typography, { variant: "body", weight: "bold", size: "md", color: "primary", children: label }),
11177
11299
  /* @__PURE__ */ jsx(
11178
11300
  InlineGroup,
11179
11301
  {
11180
- groupGap: parseTokenValue56(countdown.countdownGroup.spacing.gap),
11302
+ groupGap: parseTokenValue58(countdown.countdownGroup.spacing.gap),
11181
11303
  children: units.map((unit, index) => /* @__PURE__ */ jsxs(React66.Fragment, { children: [
11182
11304
  index > 0 && colon(`colon-${unit.key}`),
11183
11305
  /* @__PURE__ */ jsxs(
11184
11306
  InlineCount,
11185
11307
  {
11186
- countGap: parseTokenValue56(countdown.count.spacing.gap),
11308
+ countGap: parseTokenValue58(countdown.count.spacing.gap),
11187
11309
  children: [
11188
11310
  /* @__PURE__ */ jsx(
11189
11311
  Typography,
@@ -11219,33 +11341,33 @@ var Countdown = React66.forwardRef(
11219
11341
  StackedRoot,
11220
11342
  __spreadProps(__spreadValues({
11221
11343
  ref,
11222
- rootGap: parseTokenValue56(countdown.spacing.gap)
11344
+ rootGap: parseTokenValue58(countdown.spacing.gap)
11223
11345
  }, rest), {
11224
11346
  children: units.map((unit, index) => /* @__PURE__ */ jsxs(React66.Fragment, { children: [
11225
11347
  index > 0 && colon(`colon-${unit.key}`),
11226
11348
  /* @__PURE__ */ jsxs(
11227
11349
  StackedItem,
11228
11350
  {
11229
- itemGap: parseTokenValue56(countdownItem.spacing.gap),
11230
- itemVerticalPadding: parseTokenValue56(
11351
+ itemGap: parseTokenValue58(countdownItem.spacing.gap),
11352
+ itemVerticalPadding: parseTokenValue58(
11231
11353
  countdownItem.spacing.verticalPadding
11232
11354
  ),
11233
- itemHorizontalPadding: parseTokenValue56(
11355
+ itemHorizontalPadding: parseTokenValue58(
11234
11356
  countdownItem.spacing.horizontalPadding
11235
11357
  ),
11236
11358
  itemBgColor: countdownItem.colour.background.default,
11237
- itemBorderRadius: parseTokenValue56(
11359
+ itemBorderRadius: parseTokenValue58(
11238
11360
  countdownItem.borderRadius.default
11239
11361
  ),
11240
11362
  children: [
11241
11363
  /* @__PURE__ */ jsx(
11242
11364
  StackedCountBox,
11243
11365
  {
11244
- countPaddingTop: parseTokenValue56(
11366
+ countPaddingTop: parseTokenValue58(
11245
11367
  countdownItem.count.spacing.paddingTop
11246
11368
  ),
11247
11369
  countBgColor: countdownItem.count.colour.background.default,
11248
- countBorderRadius: parseTokenValue56(
11370
+ countBorderRadius: parseTokenValue58(
11249
11371
  countdownItem.count.borderRadius.default
11250
11372
  ),
11251
11373
  children: /* @__PURE__ */ jsx(
@@ -11275,7 +11397,7 @@ var Countdown = React66.forwardRef(
11275
11397
  }
11276
11398
  );
11277
11399
  Countdown.displayName = "Countdown";
11278
- var parseTokenValue57 = (value) => {
11400
+ var parseTokenValue59 = (value) => {
11279
11401
  if (typeof value === "number") return value;
11280
11402
  return parseFloat(value);
11281
11403
  };
@@ -11286,14 +11408,14 @@ var BadgeContainer = styled51(View)(({ theme: theme2 }) => {
11286
11408
  return {
11287
11409
  display: "flex",
11288
11410
  flexDirection: "row",
11289
- gap: parseTokenValue57(spacing["2xs"]),
11411
+ gap: parseTokenValue59(spacing["2xs"]),
11290
11412
  alignItems: "center",
11291
11413
  justifyContent: "center",
11292
- height: parseTokenValue57(sizing["2xl"]),
11293
- paddingRight: parseTokenValue57(spacing.xs),
11414
+ height: parseTokenValue59(sizing["2xl"]),
11415
+ paddingRight: parseTokenValue59(spacing.xs),
11294
11416
  backgroundColor: colour.background.container.brand,
11295
- borderTopRightRadius: parseTokenValue57(borderRadius.xs),
11296
- borderBottomRightRadius: parseTokenValue57(borderRadius.xs)
11417
+ borderTopRightRadius: parseTokenValue59(borderRadius.xs),
11418
+ borderBottomRightRadius: parseTokenValue59(borderRadius.xs)
11297
11419
  };
11298
11420
  });
11299
11421
  var BadgeIcon = styled51(View)(({ theme: theme2 }) => {
@@ -11303,9 +11425,9 @@ var BadgeIcon = styled51(View)(({ theme: theme2 }) => {
11303
11425
  display: "flex",
11304
11426
  alignItems: "center",
11305
11427
  justifyContent: "center",
11306
- width: parseTokenValue57(sizing.md),
11307
- height: parseTokenValue57(sizing.md),
11308
- marginLeft: parseTokenValue57(spacing.xs),
11428
+ width: parseTokenValue59(sizing.md),
11429
+ height: parseTokenValue59(sizing.md),
11430
+ marginLeft: parseTokenValue59(spacing.xs),
11309
11431
  flexShrink: 0
11310
11432
  };
11311
11433
  });
@@ -11354,7 +11476,7 @@ var Grid = React66.forwardRef(
11354
11476
  }
11355
11477
  );
11356
11478
  Grid.displayName = "ProductListingCard.Grid";
11357
- var parseTokenValue58 = (value) => {
11479
+ var parseTokenValue60 = (value) => {
11358
11480
  if (typeof value === "number") return value;
11359
11481
  return parseFloat(value);
11360
11482
  };
@@ -11363,7 +11485,7 @@ var StyledRoot17 = styled51(Pressable)(({ theme: theme2 }) => {
11363
11485
  return {
11364
11486
  display: "flex",
11365
11487
  flexDirection: "column",
11366
- gap: parseTokenValue58(spacing.md),
11488
+ gap: parseTokenValue60(spacing.md),
11367
11489
  alignItems: "flex-start",
11368
11490
  width: "100%"
11369
11491
  };
@@ -11373,7 +11495,7 @@ var ImageContainer = styled51(View)(({ theme: theme2 }) => ({
11373
11495
  width: "100%",
11374
11496
  aspectRatio: 1,
11375
11497
  overflow: "hidden",
11376
- borderRadius: parseTokenValue58(
11498
+ borderRadius: parseTokenValue60(
11377
11499
  theme2.tokens.semantics.dimensions.borderRadius.md
11378
11500
  )
11379
11501
  }));
@@ -11384,7 +11506,7 @@ var StyledImage2 = styled51(Image)({
11384
11506
  });
11385
11507
  var BadgeContainer2 = styled51(View)(({ theme: theme2 }) => ({
11386
11508
  position: "absolute",
11387
- top: parseTokenValue58(theme2.tokens.semantics.dimensions.spacing.md),
11509
+ top: parseTokenValue60(theme2.tokens.semantics.dimensions.spacing.md),
11388
11510
  left: 0
11389
11511
  }));
11390
11512
  var ContentContainer = styled51(View)(({ theme: theme2 }) => {
@@ -11392,7 +11514,7 @@ var ContentContainer = styled51(View)(({ theme: theme2 }) => {
11392
11514
  return {
11393
11515
  display: "flex",
11394
11516
  flexDirection: "column",
11395
- gap: parseTokenValue58(spacing.md),
11517
+ gap: parseTokenValue60(spacing.md),
11396
11518
  alignItems: "flex-start",
11397
11519
  width: "100%"
11398
11520
  };
@@ -11406,7 +11528,7 @@ var DetailsContainer = styled51(View)({
11406
11528
  var CategoryWrapper = styled51(View)(({ theme: theme2 }) => {
11407
11529
  const spacing = theme2.tokens.semantics.dimensions.spacing;
11408
11530
  return {
11409
- marginBottom: parseTokenValue58(spacing["3xs"])
11531
+ marginBottom: parseTokenValue60(spacing["3xs"])
11410
11532
  };
11411
11533
  });
11412
11534
  var TitleContainer = styled51(View)({
@@ -11754,7 +11876,7 @@ var useTabNavigationContext = () => {
11754
11876
  }
11755
11877
  return context;
11756
11878
  };
11757
- var parseTokenValue59 = (value) => parseFloat(value);
11879
+ var parseTokenValue61 = (value) => parseFloat(value);
11758
11880
  var StyledFixedList = styled51(View)({
11759
11881
  flexDirection: "row",
11760
11882
  alignItems: "stretch",
@@ -11820,13 +11942,13 @@ var TabNavigationTab = React66.forwardRef(
11820
11942
  StyledTab,
11821
11943
  __spreadProps(__spreadValues({
11822
11944
  ref,
11823
- tabHeight: parseTokenValue59(tabitem.size.height),
11824
- tabMinWidth: parseTokenValue59(tabitem.size.minWidth),
11825
- tabPaddingTop: parseTokenValue59(spacing.topPadding),
11826
- tabPaddingBottom: parseTokenValue59(spacing.bottomPadding),
11827
- tabPaddingHorizontal: parseTokenValue59(spacing.horizontalPadding),
11828
- tabGap: parseTokenValue59(spacing.gap),
11829
- tabBorderWidth: parseTokenValue59(borderWidth.default),
11945
+ tabHeight: parseTokenValue61(tabitem.size.height),
11946
+ tabMinWidth: parseTokenValue61(tabitem.size.minWidth),
11947
+ tabPaddingTop: parseTokenValue61(spacing.topPadding),
11948
+ tabPaddingBottom: parseTokenValue61(spacing.bottomPadding),
11949
+ tabPaddingHorizontal: parseTokenValue61(spacing.horizontalPadding),
11950
+ tabGap: parseTokenValue61(spacing.gap),
11951
+ tabBorderWidth: parseTokenValue61(borderWidth.default),
11830
11952
  tabBorderColor: borderColour,
11831
11953
  tabFlex: layout === "fixed" ? 1 : void 0
11832
11954
  }, rest), {
@@ -11908,6 +12030,6 @@ var TabNavigation = Object.assign(TabNavigationRoot, {
11908
12030
  Panel: TabNavigationPanel
11909
12031
  });
11910
12032
 
11911
- export { Accordion, Animated5 as Animated, Avatar, BRAND_FONTS, Badge, Button, ButtonDock, ButtonGroup, CarouselControls, Checkbox, CheckboxGroup, CopyField, CopyFieldInput, Countdown, DatePicker, Divider, Drawer, FilterTab, Hint, Icon, IconButton, Illustration, Input, InputDescription, InputError, InputField, InputLabel, InputText, Link, Logo, MessageCard, MessageCardBanner, MessageCardInsight, NativeSelectPicker, Notification, NumberField, NumberInput, NumberInputField, PasswordField, PasswordFieldInput, PasswordFieldRequirements, PawprintProvider, PictureSelector, ProductDisplayCard, ProductListingCardWithBadgeAndGrid as ProductListingCard, Progress, Radio, RadioGroup, RadioTile, SearchField, SearchFieldInput, SegmentedControl, SelectField, SelectFieldContent, SelectFieldItem, SelectFieldTrigger, SelectFieldValue, Slider, Spinner, StackedNotifications, Switch, TabNavigation, Tag, TextArea, TextAreaField, TextAreaLabel, ThemeProvider, Tooltip, Typography, createPawprintTheme, fadeAnimation, fadeDownAnimation, fadeUpAnimation, registerLogo, resolveFont, resolveLogo, scaleAnimation, slideInAnimation, slideOutAnimation, theme, useCopyField, usePasswordField, usePawprint, useSearchField, useSelectField };
12033
+ export { Accordion, Animated5 as Animated, Avatar, BRAND_FONTS, Badge, Button, ButtonDock, ButtonGroup, CarouselControls, Checkbox, CheckboxGroup, CopyField, CopyFieldInput, Countdown, DatePicker, Divider, Drawer, FilterTab, Hint, Icon, IconButton, Illustration, Input, InputDescription, InputError, InputField, InputLabel, InputText, Link, Logo, Menu2 as Menu, MenuItem, MessageCard, MessageCardBanner, MessageCardInsight, NativeSelectPicker, Notification, NumberField, NumberInput, NumberInputField, PasswordField, PasswordFieldInput, PasswordFieldRequirements, PawprintProvider, PictureSelector, ProductDisplayCard, ProductListingCardWithBadgeAndGrid as ProductListingCard, Progress, Radio, RadioGroup, RadioTile, SearchField, SearchFieldInput, SegmentedControl, SelectField, SelectFieldContent, SelectFieldItem, SelectFieldTrigger, SelectFieldValue, Slider, Spinner, StackedNotifications, Switch, TabNavigation, Tag, TextArea, TextAreaField, TextAreaLabel, ThemeProvider, Tooltip, Typography, createPawprintTheme, fadeAnimation, fadeDownAnimation, fadeUpAnimation, registerLogo, resolveFont, resolveLogo, scaleAnimation, slideInAnimation, slideOutAnimation, theme, useCopyField, usePasswordField, usePawprint, useSearchField, useSelectField };
11912
12034
  //# sourceMappingURL=index.js.map
11913
12035
  //# sourceMappingURL=index.js.map