@12-apps/ui 6.20.0 → 6.22.0

package/dist/native/layout/Card.js

@@ -0,0 +1,494 @@
+import {
+  BLACK,
+  PulseRing,
+  WHITE,
+  drop,
+  halo
+} from "../chunks/chunk-NRN37A5K.js";
+import {
+  renderTextChildren
+} from "../chunks/chunk-5GJ5OG5R.js";
+import {
+  childTestId,
+  resolveTestId,
+  withoutTestIdProps
+} from "../chunks/chunk-AR5O4BEY.js";
+import {
+  muiTypeStyle
+} from "../chunks/chunk-2UFNPDYT.js";
+import {
+  useUiTheme
+} from "../chunks/chunk-GWGIWQO7.js";
+import {
+  alpha
+} from "../chunks/chunk-LEMMXZFN.js";
+
+// src/components/layout/Card/Card.native.tsx
+import * as React2 from "react";
+import {
+  ActivityIndicator,
+  Platform,
+  Pressable,
+  StyleSheet as StyleSheet2,
+  View as View2
+} from "react-native";
+
+// src/components/layout/Card/Card.helpers.ts
+var CARD_DEFAULTS = {
+  variant: "elevated",
+  interactive: false,
+  glow: false,
+  pulse: false,
+  borderRadius: "md",
+  loading: false
+};
+var definedProps = (props) => Object.fromEntries(
+  Object.entries(props).filter(([, value]) => value !== void 0)
+);
+var resolveCardProps = (props) => ({ ...CARD_DEFAULTS, ...definedProps(props) });
+
+// src/components/layout/Card/Card.metrics.ts
+var CARD_RADIUS_UNITS = {
+  none: 0,
+  sm: 0.5,
+  md: 1,
+  lg: 2,
+  xl: 3
+};
+var CARD_RADIUS_FULL = "50%";
+var CARD_BORDER_WIDTH = 1;
+var CARD_PAPER_SHADOW = [
+  { offsetX: 0, offsetY: 2, blurRadius: 1, spreadDistance: -1, color: "rgba(0, 0, 0, 0.2)" },
+  { offsetX: 0, offsetY: 1, blurRadius: 1, spreadDistance: 0, color: "rgba(0, 0, 0, 0.14)" },
+  { offsetX: 0, offsetY: 1, blurRadius: 3, spreadDistance: 0, color: "rgba(0, 0, 0, 0.12)" }
+];
+var CARD_GLASS = {
+  backgroundAlpha: { rest: 0.1, lifted: 0.15 },
+  borderAlpha: { rest: 0.2, lifted: 0.3 },
+  blurPx: 20,
+  shadow: { offsetY: 8, blurRadius: 32, alpha: 0.1 }
+};
+var CARD_GRADIENT = {
+  angleDeg: 135,
+  shadow: { offsetY: 4, blurRadius: 20, alpha: 0.3 }
+};
+var CARD_NEUMORPHIC = {
+  spread: { rest: 8, lifted: 12 },
+  blurFactor: 2,
+  alpha: {
+    dark: { near: 0.3, far: 0.1 },
+    light: { near: { rest: 0.2, lifted: 0.3 }, far: { rest: 0.8, lifted: 0.9 } }
+  }
+};
+function neumorphicShadows(lifted, near, far) {
+  const spread = lifted ? CARD_NEUMORPHIC.spread.lifted : CARD_NEUMORPHIC.spread.rest;
+  const blurRadius = spread * CARD_NEUMORPHIC.blurFactor;
+  return [
+    { offsetX: spread, offsetY: spread, blurRadius, spreadDistance: 0, color: near },
+    { offsetX: -spread, offsetY: -spread, blurRadius, spreadDistance: 0, color: far }
+  ];
+}
+var CARD_SECTION_BACKGROUND = {
+  dark: { rest: "rgba(0, 0, 0, 0.2)", lifted: "rgba(0, 0, 0, 0.25)" },
+  light: { rest: "rgba(0, 0, 0, 0.02)", lifted: "rgba(0, 0, 0, 0.04)" }
+};
+var CARD_GLOW = {
+  rest: { blurRadius: 20, alpha: 0.3 },
+  lifted: { blurRadius: 30, alpha: 0.4 }
+};
+var CARD_PULSE = {
+  alpha: 0.3,
+  durationMs: 2e3,
+  spread: 15,
+  /** The fraction of the cycle the ring is still visible for. */
+  fadeAt: 0.7,
+  zIndex: -1
+};
+var CARD_LOADING = { opacity: 0.6, spinnerZIndex: 10, spinnerSize: 40 };
+var CARD_CONTENT_PADDING_UNITS = { normal: 2, dense: 1 };
+var CARD_HEADER = {
+  padding: 16,
+  avatarGap: 16,
+  action: { marginTop: -4, marginRight: -8, marginBottom: -4 }
+};
+var CARD_HEADER_CHILDREN_PADDING_UNITS = 2;
+var CARD_ACTIONS = { padding: 8, gap: 8 };
+var CARD_MEDIA_HEIGHT = 200;
+
+// src/components/layout/Card/Card.look.native.ts
+function cardRadius(theme, radius) {
+  if (radius === "full") return CARD_RADIUS_FULL;
+  return theme.spacing(CARD_RADIUS_UNITS[radius] ?? CARD_RADIUS_UNITS.md);
+}
+function glassSurface(theme, lifted) {
+  return {
+    surface: {
+      backgroundColor: alpha(theme.palette.background.paper, CARD_GLASS.backgroundAlpha.rest),
+      borderWidth: CARD_BORDER_WIDTH,
+      borderStyle: "solid",
+      borderColor: alpha(theme.palette.primary.main, CARD_GLASS.borderAlpha.rest),
+      boxShadow: drop(
+        CARD_GLASS.shadow.offsetY,
+        CARD_GLASS.shadow.blurRadius,
+        alpha(BLACK, CARD_GLASS.shadow.alpha)
+      )
+    },
+    hover: {
+      backgroundColor: alpha(
+        theme.palette.background.paper,
+        lifted ? CARD_GLASS.backgroundAlpha.lifted : CARD_GLASS.backgroundAlpha.rest
+      ),
+      borderColor: alpha(theme.palette.primary.main, CARD_GLASS.borderAlpha.lifted)
+    }
+  };
+}
+function neumorphicSurface(theme, lifted) {
+  const { dark, light } = CARD_NEUMORPHIC.alpha;
+  const pair = (raised) => theme.mode === "dark" ? neumorphicShadows(raised, alpha(BLACK, dark.near), alpha(WHITE, dark.far)) : neumorphicShadows(
+    raised,
+    alpha(theme.palette.grey[400], raised ? light.near.lifted : light.near.rest),
+    alpha(WHITE, raised ? light.far.lifted : light.far.rest)
+  );
+  return {
+    surface: {
+      backgroundColor: theme.mode === "dark" ? theme.palette.grey[800] : theme.palette.grey[100],
+      boxShadow: pair(false),
+      borderWidth: 0
+    },
+    hover: { boxShadow: pair(lifted) }
+  };
+}
+function sectionSurface(theme, lifted) {
+  const wash = CARD_SECTION_BACKGROUND[theme.mode === "dark" ? "dark" : "light"];
+  return {
+    surface: { backgroundColor: wash.rest, borderWidth: 0, boxShadow: void 0 },
+    hover: { backgroundColor: lifted ? wash.lifted : wash.rest }
+  };
+}
+function cardSurface(theme, variant, lifted) {
+  switch (variant) {
+    case "outlined":
+      return {
+        surface: {
+          borderWidth: CARD_BORDER_WIDTH,
+          borderStyle: "solid",
+          borderColor: theme.palette.divider,
+          boxShadow: void 0
+        },
+        hover: { borderColor: lifted ? theme.palette.primary.main : theme.palette.divider }
+      };
+    case "glass":
+      return glassSurface(theme, lifted);
+    case "gradient":
+      return {
+        surface: {
+          backgroundColor: theme.palette.primary.main,
+          boxShadow: drop(
+            CARD_GRADIENT.shadow.offsetY,
+            CARD_GRADIENT.shadow.blurRadius,
+            alpha(theme.palette.primary.main, CARD_GRADIENT.shadow.alpha)
+          )
+        },
+        hover: {
+          backgroundColor: lifted ? theme.palette.primary.dark : theme.palette.primary.main
+        }
+      };
+    case "neumorphic":
+      return neumorphicSurface(theme, lifted);
+    case "section":
+      return sectionSurface(theme, lifted);
+    default:
+      return { surface: {}, hover: {} };
+  }
+}
+var cardInk = (theme, variant) => variant === "gradient" ? theme.palette.primary.contrastText : theme.palette.text.primary;
+function cardLook(theme, a) {
+  const radius = cardRadius(theme, a.borderRadius);
+  const chosen = cardSurface(theme, a.variant, a.interactive);
+  const base = {
+    position: "relative",
+    borderRadius: radius,
+    backgroundColor: theme.palette.background.paper,
+    overflow: a.pulse || a.glow ? "visible" : "hidden",
+    opacity: a.loading ? CARD_LOADING.opacity : 1,
+    pointerEvents: a.loading ? "none" : "auto"
+  };
+  return {
+    radius,
+    ink: cardInk(theme, a.variant),
+    container: {
+      ...base,
+      boxShadow: CARD_PAPER_SHADOW,
+      ...a.interactive ? { cursor: "pointer" } : null,
+      ...a.glow ? { boxShadow: halo(CARD_GLOW.rest.blurRadius, alpha(theme.palette.primary.main, CARD_GLOW.rest.alpha)) } : null,
+      ...chosen.surface
+    },
+    pressed: {
+      ...a.glow ? { boxShadow: halo(CARD_GLOW.lifted.blurRadius, alpha(theme.palette.primary.main, CARD_GLOW.lifted.alpha)) } : null,
+      ...chosen.hover
+    }
+  };
+}
+
+// src/components/layout/Card/CardParts.native.tsx
+import * as React from "react";
+import {
+  Image,
+  StyleSheet,
+  Text as RNText,
+  View
+} from "react-native";
+import { jsx, jsxs } from "react/jsx-runtime";
+var CardInkContext = React.createContext(null);
+var slotTextStyle = (theme, ink) => ({
+  ...muiTypeStyle(theme, "body1"),
+  color: ink ?? theme.palette.text.primary
+});
+var cardTitleStyle = (theme, hasAvatar, ink = null) => ({
+  ...muiTypeStyle(theme, hasAvatar ? "body2" : "h5"),
+  color: ink ?? theme.palette.text.primary
+});
+var cardSubtitleStyle = (theme, hasAvatar) => ({
+  ...muiTypeStyle(theme, hasAvatar ? "body2" : "body1"),
+  color: theme.palette.text.secondary
+});
+function CardHeader({
+  title,
+  subtitle,
+  action,
+  avatar,
+  children,
+  ...others
+}) {
+  const theme = useUiTheme();
+  const ink = React.useContext(CardInkContext);
+  const testID = resolveTestId(others, "card-header");
+  const { style, ...viewProps } = withoutTestIdProps(others);
+  if (children) {
+    return /* @__PURE__ */ jsx(
+      View,
+      {
+        testID,
+        style: [{ padding: theme.spacing(CARD_HEADER_CHILDREN_PADDING_UNITS) }, style],
+        ...viewProps,
+        children: renderTextChildren(children, slotTextStyle(theme, ink))
+      }
+    );
+  }
+  const hasAvatar = avatar != null;
+  return /* @__PURE__ */ jsxs(View, { testID, style: [styles.header, style], ...viewProps, children: [
+    hasAvatar ? /* @__PURE__ */ jsx(View, { style: styles.headerAvatar, children: avatar }) : null,
+    /* @__PURE__ */ jsxs(View, { style: styles.headerContent, children: [
+      title != null ? /* @__PURE__ */ jsx(RNText, { testID: childTestId(others, "title", "card"), style: cardTitleStyle(theme, hasAvatar, ink), children: title }) : null,
+      subtitle != null ? /* @__PURE__ */ jsx(
+        RNText,
+        {
+          testID: childTestId(others, "subtitle", "card"),
+          style: cardSubtitleStyle(theme, hasAvatar),
+          children: subtitle
+        }
+      ) : null
+    ] }),
+    action != null ? /* @__PURE__ */ jsx(View, { style: styles.headerAction, children: action }) : null
+  ] });
+}
+CardHeader.displayName = "CardHeader";
+function CardContent({
+  children,
+  dense = false,
+  ...others
+}) {
+  const theme = useUiTheme();
+  const ink = React.useContext(CardInkContext);
+  const testID = resolveTestId(others, "card-content");
+  const { style, ...viewProps } = withoutTestIdProps(others);
+  const padding = theme.spacing(
+    dense ? CARD_CONTENT_PADDING_UNITS.dense : CARD_CONTENT_PADDING_UNITS.normal
+  );
+  return /* @__PURE__ */ jsx(View, { testID, style: [{ padding }, style], ...viewProps, children: renderTextChildren(children, slotTextStyle(theme, ink)) });
+}
+CardContent.displayName = "CardContent";
+var JUSTIFY = {
+  left: "flex-start",
+  center: "center",
+  right: "flex-end",
+  "space-between": "space-between"
+};
+function CardActions({
+  children,
+  disableSpacing = false,
+  alignment = "left",
+  ...others
+}) {
+  const theme = useUiTheme();
+  const ink = React.useContext(CardInkContext);
+  const testID = resolveTestId(others, "card-actions");
+  const { style, ...viewProps } = withoutTestIdProps(others);
+  return /* @__PURE__ */ jsx(
+    View,
+    {
+      testID,
+      style: [
+        styles.actions,
+        { justifyContent: JUSTIFY[alignment], gap: disableSpacing ? void 0 : CARD_ACTIONS.gap },
+        style
+      ],
+      ...viewProps,
+      children: renderTextChildren(children, slotTextStyle(theme, ink))
+    }
+  );
+}
+CardActions.displayName = "CardActions";
+function mediaHeight(height) {
+  if (typeof height === "number") return height;
+  const parsed = Number(height);
+  return Number.isFinite(parsed) ? parsed : height;
+}
+function CardMedia({
+  image,
+  title,
+  height = CARD_MEDIA_HEIGHT,
+  children,
+  ...others
+}) {
+  const testID = resolveTestId(others, "card-media");
+  const { style, ...viewProps } = withoutTestIdProps(others);
+  return /* @__PURE__ */ jsxs(
+    View,
+    {
+      testID,
+      style: [{ height: mediaHeight(height), width: "100%", overflow: "hidden" }, style],
+      ...viewProps,
+      children: [
+        image != null ? /* @__PURE__ */ jsx(
+          Image,
+          {
+            source: { uri: image },
+            accessibilityLabel: title,
+            resizeMode: "cover",
+            style: StyleSheet.absoluteFill
+          }
+        ) : null,
+        children
+      ]
+    }
+  );
+}
+CardMedia.displayName = "CardMedia";
+var styles = StyleSheet.create({
+  header: {
+    flexDirection: "row",
+    alignItems: "center",
+    padding: CARD_HEADER.padding
+  },
+  headerAvatar: {
+    flexGrow: 0,
+    flexShrink: 0,
+    flexBasis: "auto",
+    marginRight: CARD_HEADER.avatarGap
+  },
+  headerContent: {
+    flexGrow: 1,
+    flexShrink: 1,
+    flexBasis: "auto",
+    minWidth: 0
+  },
+  headerAction: {
+    flexGrow: 0,
+    flexShrink: 0,
+    flexBasis: "auto",
+    alignSelf: "flex-start",
+    marginTop: CARD_HEADER.action.marginTop,
+    marginRight: CARD_HEADER.action.marginRight,
+    marginBottom: CARD_HEADER.action.marginBottom
+  },
+  actions: {
+    flexDirection: "row",
+    alignItems: "center",
+    padding: CARD_ACTIONS.padding
+  }
+});
+
+// src/components/layout/Card/Card.native.tsx
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+function Spinner({ color, testID }) {
+  return /* @__PURE__ */ jsx2(View2, { testID, style: [styles2.spinner, { zIndex: CARD_LOADING.spinnerZIndex }], children: /* @__PURE__ */ jsx2(
+    ActivityIndicator,
+    {
+      size: Platform.OS === "ios" ? "large" : CARD_LOADING.spinnerSize,
+      color
+    }
+  ) });
+}
+var Card = React2.forwardRef((rawProps, ref) => {
+  const resolved = resolveCardProps(rawProps);
+  const { children, loading, pulse, onClick, onPress, onFocus, onBlur, ...others } = resolved;
+  const theme = useUiTheme();
+  const look = cardLook(theme, resolved);
+  const testID = resolveTestId(others, "card");
+  const idFor = (suffix) => childTestId(others, suffix, "card");
+  const rest = withoutTestIdProps(others);
+  const {
+    variant: _variant,
+    interactive,
+    glow: _glow,
+    borderRadius: _borderRadius,
+    style,
+    expandable: _expandable,
+    expanded: _expanded,
+    onExpandToggle: _onExpandToggle,
+    entranceAnimation: _entranceAnimation,
+    animationDelay: _animationDelay,
+    skeleton: _skeleton,
+    hoverScale: _hoverScale,
+    ...viewProps
+  } = rest;
+  const idle = !loading;
+  const handlePress = (event) => {
+    onClick?.(event);
+    onPress?.(event);
+  };
+  const body = /* @__PURE__ */ jsxs2(CardInkContext.Provider, { value: look.ink, children: [
+    pulse ? /* @__PURE__ */ jsx2(
+      PulseRing,
+      {
+        color: theme.palette.primary.main,
+        radius: look.radius,
+        spread: CARD_PULSE.spread,
+        durationMs: CARD_PULSE.durationMs,
+        fadeAt: CARD_PULSE.fadeAt,
+        opacity: CARD_PULSE.alpha,
+        testID: idFor("pulse")
+      }
+    ) : null,
+    loading ? /* @__PURE__ */ jsx2(Spinner, { color: theme.palette.primary.main, testID: idFor("loading") }) : null,
+    renderTextChildren(children, { ...muiTypeStyle(theme, "body1"), color: look.ink })
+  ] });
+  const shared = { testID, onFocus: idle ? onFocus : void 0, onBlur: idle ? onBlur : void 0 };
+  if (!interactive && !onClick && !onPress) {
+    return /* @__PURE__ */ jsx2(View2, { ref, style: [look.container, style], ...shared, ...viewProps, children: body });
+  }
+  const container = ({ pressed }) => [
+    look.container,
+    pressed && idle ? look.pressed : null,
+    style
+  ];
+  return /* @__PURE__ */ jsx2(Pressable, { ref, style: container, onPress: idle ? handlePress : void 0, ...shared, ...viewProps, children: body });
+});
+Card.displayName = "Card";
+var styles2 = StyleSheet2.create({
+  spinner: {
+    ...StyleSheet2.absoluteFillObject,
+    alignItems: "center",
+    justifyContent: "center",
+    pointerEvents: "none"
+  }
+});
+export {
+  Card,
+  CardActions,
+  CardContent,
+  CardHeader,
+  CardMedia
+};
+//# sourceMappingURL=Card.js.map

package/dist/native/layout/Card.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/layout/Card/Card.native.tsx","../../../src/components/layout/Card/Card.helpers.ts","../../../src/components/layout/Card/Card.metrics.ts","../../../src/components/layout/Card/Card.look.native.ts","../../../src/components/layout/Card/CardParts.native.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n  ActivityIndicator,\n  Platform,\n  Pressable,\n  StyleSheet,\n  View,\n  type GestureResponderEvent,\n  type PressableStateCallbackType,\n  type StyleProp,\n  type ViewStyle,\n} from 'react-native';\n\nimport { resolveCardProps } from './Card.helpers';\nimport { cardLook } from './Card.look.native';\nimport { CARD_LOADING, CARD_PULSE } from './Card.metrics';\nimport { CardInkContext } from './CardParts.native';\nimport type { CardProps } from './Card.types.native';\nimport { PulseRing } from '../../../platform/pulse-ring.native';\nimport { childTestId, resolveTestId, withoutTestIdProps } from '../../../platform/test-id';\nimport { renderTextChildren } from '../../../platform/text-children';\nimport { useUiTheme } from '../../../provider/use-ui-theme.native';\nimport { muiTypeStyle } from '../../../tokens/mui-type';\n\n// The shared stories import all five names from `./Card`, which resolves here\n// under Metro and in the native Storybook; the slots live in their own file to\n// keep this one about the envelope, and are re-exported so that import works.\nexport { CardActions, CardContent, CardHeader, CardMedia } from './CardParts.native';\n\n/** The spinner a loading card centres over itself; `role` comes from `ActivityIndicator`. */\nfunction Spinner({ color, testID }: { color: string; testID: string }): React.JSX.Element {\n  return (\n    <View testID={testID} style={[styles.spinner, { zIndex: CARD_LOADING.spinnerZIndex }]}>\n      <ActivityIndicator\n        size={Platform.OS === 'ios' ? 'large' : CARD_LOADING.spinnerSize}\n        color={color}\n      />\n    </View>\n  );\n}\n\nexport const Card = React.forwardRef<View, CardProps>((rawProps, ref) => {\n  const resolved = resolveCardProps(rawProps);\n  const { children, loading, pulse, onClick, onPress, onFocus, onBlur, ...others } = resolved;\n  const theme = useUiTheme();\n  const look = cardLook(theme, resolved);\n\n  const testID = resolveTestId(others, 'card');\n  const idFor = (suffix: string): string => childTestId(others, suffix, 'card');\n  const rest = withoutTestIdProps(others);\n  // `cardLook` consumed these, and the reserved ones paint nothing on either\n  // renderer; none of them is a `View` prop.\n  const {\n    variant: _variant,\n    interactive,\n    glow: _glow,\n    borderRadius: _borderRadius,\n    style,\n    expandable: _expandable,\n    expanded: _expanded,\n    onExpandToggle: _onExpandToggle,\n    entranceAnimation: _entranceAnimation,\n    animationDelay: _animationDelay,\n    skeleton: _skeleton,\n    hoverScale: _hoverScale,\n    ...viewProps\n  } = rest;\n\n  // A loading card is inert: no handler fires and pointer events are off, so a\n  // half-rendered card cannot be pressed through. Same rule as the web.\n  const idle = !loading;\n  const handlePress = (event: GestureResponderEvent): void => {\n    onClick?.(event);\n    onPress?.(event);\n  };\n\n  // The ink goes to the SLOTS through context and to bare text children\n  // directly: on the web one `color` on the card covers both, because CSS\n  // inherits and React Native does not.\n  const body = (\n    <CardInkContext.Provider value={look.ink}>\n      {pulse ? (\n        <PulseRing\n          color={theme.palette.primary.main}\n          radius={look.radius}\n          spread={CARD_PULSE.spread}\n          durationMs={CARD_PULSE.durationMs}\n          fadeAt={CARD_PULSE.fadeAt}\n          opacity={CARD_PULSE.alpha}\n          testID={idFor('pulse')}\n        />\n      ) : null}\n      {loading ? <Spinner color={theme.palette.primary.main} testID={idFor('loading')} /> : null}\n      {renderTextChildren(children, { ...muiTypeStyle(theme, 'body1'), color: look.ink })}\n    </CardInkContext.Provider>\n  );\n\n  const shared = { testID, onFocus: idle ? onFocus : undefined, onBlur: idle ? onBlur : undefined };\n\n  if (!interactive && !onClick && !onPress) {\n    return (\n      <View ref={ref} style={[look.container, style]} {...shared} {...viewProps}>\n        {body}\n      </View>\n    );\n  }\n\n  const container = ({ pressed }: PressableStateCallbackType): StyleProp<ViewStyle> => [\n    look.container,\n    pressed && idle ? look.pressed : null,\n    style,\n  ];\n\n  return (\n    <Pressable ref={ref} style={container} onPress={idle ? handlePress : undefined} {...shared} {...viewProps}>\n      {body}\n    </Pressable>\n  );\n});\n\nCard.displayName = 'Card';\n\nconst styles = StyleSheet.create({\n  spinner: {\n    ...StyleSheet.absoluteFillObject,\n    alignItems: 'center',\n    justifyContent: 'center',\n    pointerEvents: 'none',\n  },\n});\n","import type { CardBaseProps } from './Card.base';\n\ntype CardDefaultedKeys =\n  | 'variant'\n  | 'interactive'\n  | 'glow'\n  | 'pulse'\n  | 'borderRadius'\n  | 'loading';\n\n/**\n * Generic over the renderer's own props: the web and the native `Card` pass\n * different handler types (and different style props) through, and both come\n * back out untouched.\n */\ntype ResolvedCardProps<P extends CardBaseProps> = P &\n  Required<Pick<CardBaseProps, CardDefaultedKeys>>;\n\nconst CARD_DEFAULTS: Required<Pick<CardBaseProps, CardDefaultedKeys>> = {\n  variant: 'elevated',\n  interactive: false,\n  glow: false,\n  pulse: false,\n  borderRadius: 'md',\n  loading: false,\n};\n\n// Strips explicitly-undefined props before the merge, so `glow={undefined}` still\n// falls back to the default exactly as a destructuring default would.\nconst definedProps = <P extends CardBaseProps>(props: P): Partial<P> =>\n  Object.fromEntries(\n    Object.entries(props).filter(([, value]) => value !== undefined),\n  ) as Partial<P>;\n\nexport const resolveCardProps = <P extends CardBaseProps>(props: P): ResolvedCardProps<P> =>\n  ({ ...CARD_DEFAULTS, ...definedProps(props) }) as ResolvedCardProps<P>;\n","import type { CardBorderRadius } from './Card.base';\nimport type { UiShadow } from '../../../tokens/shadow';\n\n/**\n * THE NUMBERS BOTH `Card` RENDERERS DRAW WITH.\n *\n * `Card.styles.ts` (web, emotion over MUI) and `Card.native.tsx` /\n * `Card.look.native.ts` (React Native) read this one table. The web turns the\n * radii into `theme.spacing()` and the shadows into CSS strings (`shadowCss`\n * in `src/tokens/shadow.ts` writes exactly the text it always has); native\n * hands the same shadow objects to `boxShadow` and the same numbers to a\n * `StyleSheet`.\n *\n * Nothing here imports a renderer, a theme or a colour: a shadow's COLOUR is\n * the caller's, because the two sides reach for the same arithmetic through\n * different doors (`alpha` from `@mui/material/styles` on the web, from\n * `src/tokens/color` natively — a port of it, asserted equal).\n */\n\n/* ── The envelope ─────────────────────────────────────────────────────────── */\n\n/**\n * `theme.spacing(n)` per named radius. `none` is written as a bare `0` by the\n * web rather than `spacing(0)`, so it is spelled that way on both sides.\n */\nexport const CARD_RADIUS_UNITS: Record<Exclude<CardBorderRadius, 'full'>, number> = {\n  none: 0,\n  sm: 0.5,\n  md: 1,\n  lg: 2,\n  xl: 3,\n};\n\n/** `full` is a percentage of the box, not a length. */\nexport const CARD_RADIUS_FULL = '50%';\n\n/** The hairline `outlined` and `glass` draw. */\nexport const CARD_BORDER_WIDTH = 1;\n\n/* ── Shadows ──────────────────────────────────────────────────────────────── */\n\n/** A card's shadows are `UiShadow`s; `src/tokens/shadow.ts` says why they have a shape. */\nexport type CardShadow = UiShadow;\n\n/**\n * MUI's `theme.shadows[1]` — the elevation a `Paper` paints and therefore the\n * shadow every `elevated` card on the web already has.\n *\n * It is restated here rather than derived because the web never names it: it\n * arrives through `MuiCard` -> `MuiPaper`, and React Native has no Paper to\n * inherit it from. (`variant=\"elevated\"`'s own `elevation: 4` is not a CSS\n * property and paints nothing — see {@link CARD_ELEVATION}.)\n */\nexport const CARD_PAPER_SHADOW: readonly UiShadow[] = [\n  { offsetX: 0, offsetY: 2, blurRadius: 1, spreadDistance: -1, color: 'rgba(0, 0, 0, 0.2)' },\n  { offsetX: 0, offsetY: 1, blurRadius: 1, spreadDistance: 0, color: 'rgba(0, 0, 0, 0.14)' },\n  { offsetX: 0, offsetY: 1, blurRadius: 3, spreadDistance: 0, color: 'rgba(0, 0, 0, 0.12)' },\n];\n\n/**\n * What `elevated` declares at rest and on hover.\n *\n * `elevation` is not a CSS property, so on the web these paint NOTHING and an\n * elevated card shows `MuiPaper`'s own elevation-1 shadow. Kept because they\n * are what the source says, and mirrored natively by leaving\n * {@link CARD_PAPER_SHADOW} in place for both states.\n */\nexport const CARD_ELEVATION = { rest: 4, lifted: 8 } as const;\n\n/* ── Variant surfaces ─────────────────────────────────────────────────────── */\n\n/** `glass`: a 0.1 wash of the paper behind a 20px blur, inside a primary hairline. */\nexport const CARD_GLASS = {\n  backgroundAlpha: { rest: 0.1, lifted: 0.15 },\n  borderAlpha: { rest: 0.2, lifted: 0.3 },\n  blurPx: 20,\n  shadow: { offsetY: 8, blurRadius: 32, alpha: 0.1 },\n} as const;\n\n/** `gradient`: primary into secondary at 135°, over a hue-tinted drop shadow. */\nexport const CARD_GRADIENT = {\n  angleDeg: 135,\n  shadow: { offsetY: 4, blurRadius: 20, alpha: 0.3 },\n} as const;\n\n/** `neumorphic`: two opposed shadows, blurred twice their offset. */\nexport const CARD_NEUMORPHIC = {\n  spread: { rest: 8, lifted: 12 },\n  blurFactor: 2,\n  alpha: {\n    dark: { near: 0.3, far: 0.1 },\n    light: { near: { rest: 0.2, lifted: 0.3 }, far: { rest: 0.8, lifted: 0.9 } },\n  },\n} as const;\n\n/**\n * The offset pair `neumorphic` paints, given the two colours the mode picked:\n * `near` down-right, `far` up-left, both blurred twice the offset.\n */\nexport function neumorphicShadows(lifted: boolean, near: string, far: string): UiShadow[] {\n  const spread = lifted ? CARD_NEUMORPHIC.spread.lifted : CARD_NEUMORPHIC.spread.rest;\n  const blurRadius = spread * CARD_NEUMORPHIC.blurFactor;\n  return [\n    { offsetX: spread, offsetY: spread, blurRadius, spreadDistance: 0, color: near },\n    { offsetX: -spread, offsetY: -spread, blurRadius, spreadDistance: 0, color: far },\n  ];\n}\n\n/**\n * `section`: a flat ink wash rather than a palette slot, so a section reads as\n * a recess in whatever surface it sits on.\n */\nexport const CARD_SECTION_BACKGROUND = {\n  dark: { rest: 'rgba(0, 0, 0, 0.2)', lifted: 'rgba(0, 0, 0, 0.25)' },\n  light: { rest: 'rgba(0, 0, 0, 0.02)', lifted: 'rgba(0, 0, 0, 0.04)' },\n} as const;\n\n/* ── Decorations ──────────────────────────────────────────────────────────── */\n\n/** `glow`: a haloed primary shadow that widens under the pointer. */\nexport const CARD_GLOW = {\n  rest: { blurRadius: 20, alpha: 0.3 },\n  lifted: { blurRadius: 30, alpha: 0.4 },\n} as const;\n\n/**\n * `pulse`: a ring of the primary hue that grows 15px out of the card's edge and\n * fades, every two seconds. The web draws it as an `::after` box-shadow spread\n * behind the paper (`z-index: -1`).\n */\nexport const CARD_PULSE = {\n  alpha: 0.3,\n  durationMs: 2000,\n  spread: 15,\n  /** The fraction of the cycle the ring is still visible for. */\n  fadeAt: 0.7,\n  zIndex: -1,\n} as const;\n\n/** `interactive`: the card rises 2px under the pointer and settles while pressed. */\nexport const CARD_INTERACTIVE_LIFT = 2;\n\n/** `loading`: the card dims, stops taking pointers and centres a spinner over itself. */\nexport const CARD_LOADING = { opacity: 0.6, spinnerZIndex: 10, spinnerSize: 40 } as const;\n\n/* ── The slots ────────────────────────────────────────────────────────────── */\n\n/** `CardContent`: `theme.spacing(2)`, halved by `dense`. */\nexport const CARD_CONTENT_PADDING_UNITS = { normal: 2, dense: 1 } as const;\n\n/**\n * `CardHeader`, in MUI's own px: 16 all round, the avatar 16 from the content,\n * the action pulled back out of the padding on three sides.\n */\nexport const CARD_HEADER = {\n  padding: 16,\n  avatarGap: 16,\n  action: { marginTop: -4, marginRight: -8, marginBottom: -4 },\n} as const;\n\n/** A `CardHeader` given raw `children` is a plain `theme.spacing(2)` box instead. */\nexport const CARD_HEADER_CHILDREN_PADDING_UNITS = 2;\n\n/**\n * `CardActions`, in MUI's own px: 8 all round, and 8 between the actions unless\n * `disableSpacing` turns the run off.\n */\nexport const CARD_ACTIONS = { padding: 8, gap: 8 } as const;\n\n/** `CardMedia`'s default height. */\nexport const CARD_MEDIA_HEIGHT = 200;\n","import type { ViewStyle } from 'react-native';\n\nimport type { CardBorderRadius, CardVariant } from './Card.base';\nimport {\n  CARD_BORDER_WIDTH,\n  CARD_GLASS,\n  CARD_GLOW,\n  CARD_GRADIENT,\n  CARD_LOADING,\n  CARD_NEUMORPHIC,\n  CARD_PAPER_SHADOW,\n  CARD_RADIUS_FULL,\n  CARD_RADIUS_UNITS,\n  CARD_SECTION_BACKGROUND,\n  neumorphicShadows,\n} from './Card.metrics';\nimport { alpha } from '../../../tokens/color';\nimport { BLACK, WHITE, drop, halo, type UiShadow } from '../../../tokens/shadow';\nimport type { UiTheme } from '../../../tokens/theme';\n\n/**\n * WHAT THE NATIVE `Card` PAINTS — the arithmetic, with no JSX in sight.\n *\n * The web builds one `sx` object by spreading base, `interactive`, `glow`,\n * `pulse` and finally the variant's own surface over each other; whichever\n * wrote a property last wins. The composition here spreads the SAME things in\n * the SAME order, which is why `glow` shows through an `elevated` card (whose\n * surface declares no shadow) and is buried by a `glass` one (whose surface\n * does) on both renderers.\n */\n\n/** The named radius as a length. `full` stays a percentage of the box. */\nexport function cardRadius(theme: UiTheme, radius: CardBorderRadius): number | string {\n  if (radius === 'full') return CARD_RADIUS_FULL;\n  return theme.spacing(CARD_RADIUS_UNITS[radius] ?? CARD_RADIUS_UNITS.md);\n}\n\ninterface Surface {\n  surface: ViewStyle;\n  /** What the web changes on `:hover`; native applies it while pressed. */\n  hover: ViewStyle;\n}\n\nfunction glassSurface(theme: UiTheme, lifted: boolean): Surface {\n  return {\n    surface: {\n      backgroundColor: alpha(theme.palette.background.paper, CARD_GLASS.backgroundAlpha.rest),\n      borderWidth: CARD_BORDER_WIDTH,\n      borderStyle: 'solid',\n      borderColor: alpha(theme.palette.primary.main, CARD_GLASS.borderAlpha.rest),\n      boxShadow: drop(\n        CARD_GLASS.shadow.offsetY,\n        CARD_GLASS.shadow.blurRadius,\n        alpha(BLACK, CARD_GLASS.shadow.alpha),\n      ),\n    },\n    hover: {\n      backgroundColor: alpha(\n        theme.palette.background.paper,\n        lifted ? CARD_GLASS.backgroundAlpha.lifted : CARD_GLASS.backgroundAlpha.rest,\n      ),\n      borderColor: alpha(theme.palette.primary.main, CARD_GLASS.borderAlpha.lifted),\n    },\n  };\n}\n\nfunction neumorphicSurface(theme: UiTheme, lifted: boolean): Surface {\n  const { dark, light } = CARD_NEUMORPHIC.alpha;\n  const pair = (raised: boolean): UiShadow[] =>\n    theme.mode === 'dark'\n      ? neumorphicShadows(raised, alpha(BLACK, dark.near), alpha(WHITE, dark.far))\n      : neumorphicShadows(\n          raised,\n          alpha(theme.palette.grey[400], raised ? light.near.lifted : light.near.rest),\n          alpha(WHITE, raised ? light.far.lifted : light.far.rest),\n        );\n\n  return {\n    surface: {\n      backgroundColor: theme.mode === 'dark' ? theme.palette.grey[800] : theme.palette.grey[100],\n      boxShadow: pair(false),\n      borderWidth: 0,\n    },\n    hover: { boxShadow: pair(lifted) },\n  };\n}\n\nfunction sectionSurface(theme: UiTheme, lifted: boolean): Surface {\n  const wash = CARD_SECTION_BACKGROUND[theme.mode === 'dark' ? 'dark' : 'light'];\n  return {\n    surface: { backgroundColor: wash.rest, borderWidth: 0, boxShadow: undefined },\n    hover: { backgroundColor: lifted ? wash.lifted : wash.rest },\n  };\n}\n\n/**\n * Each variant's resting surface and whatever it changes on hover — the same\n * split `Card.styles.ts` makes, in React Native's property names.\n *\n * `gradient` is the one honest gap: React Native core has no gradient fill, so\n * it paints the gradient's FIRST stop. The parity ledger records it.\n */\nexport function cardSurface(theme: UiTheme, variant: CardVariant, lifted: boolean): Surface {\n  switch (variant) {\n    case 'outlined':\n      return {\n        surface: {\n          borderWidth: CARD_BORDER_WIDTH,\n          borderStyle: 'solid',\n          borderColor: theme.palette.divider,\n          boxShadow: undefined,\n        },\n        hover: { borderColor: lifted ? theme.palette.primary.main : theme.palette.divider },\n      };\n    case 'glass':\n      return glassSurface(theme, lifted);\n    case 'gradient':\n      return {\n        surface: {\n          backgroundColor: theme.palette.primary.main,\n          boxShadow: drop(\n            CARD_GRADIENT.shadow.offsetY,\n            CARD_GRADIENT.shadow.blurRadius,\n            alpha(theme.palette.primary.main, CARD_GRADIENT.shadow.alpha),\n          ),\n        },\n        hover: {\n          backgroundColor: lifted ? theme.palette.primary.dark : theme.palette.primary.main,\n        },\n      };\n    case 'neumorphic':\n      return neumorphicSurface(theme, lifted);\n    case 'section':\n      return sectionSurface(theme, lifted);\n    default:\n      // `elevated` declares only MUI's inert `elevation`, so the paper shadow\n      // the base laid down (or a `glow` over it) is what shows.\n      return { surface: {}, hover: {} };\n  }\n}\n\n/** The ink a card's own text inherits: `gradient` flips it, everything else is body ink. */\nexport const cardInk = (theme: UiTheme, variant: CardVariant): string =>\n  variant === 'gradient' ? theme.palette.primary.contrastText : theme.palette.text.primary;\n\nexport interface CardLookArgs {\n  variant: CardVariant;\n  interactive: boolean;\n  glow: boolean;\n  pulse: boolean;\n  loading: boolean;\n  borderRadius: CardBorderRadius;\n}\n\nexport interface CardLook {\n  container: ViewStyle;\n  /** Applied while pressed, standing in for the web's `:hover`. */\n  pressed: ViewStyle;\n  radius: number | string;\n  ink: string;\n}\n\n/**\n * Everything the card paints, decided once per render.\n *\n * `overflow` is the one place native needs a rule the web does not. MUI's\n * `Card` clips its children, and the pulse ring has to reach 15px past the\n * edge — but a view's own shadow is clipped by its own overflow on a device,\n * so a `glow` the caller asked for would simply not paint. Both decorations\n * therefore turn the clip off, exactly as `Button.native.tsx` does.\n */\nexport function cardLook(theme: UiTheme, a: CardLookArgs): CardLook {\n  const radius = cardRadius(theme, a.borderRadius);\n  const chosen = cardSurface(theme, a.variant, a.interactive);\n\n  const base: ViewStyle = {\n    position: 'relative',\n    borderRadius: radius,\n    backgroundColor: theme.palette.background.paper,\n    overflow: a.pulse || a.glow ? 'visible' : 'hidden',\n    opacity: a.loading ? CARD_LOADING.opacity : 1,\n    pointerEvents: a.loading ? 'none' : 'auto',\n  };\n\n  return {\n    radius,\n    ink: cardInk(theme, a.variant),\n    container: {\n      ...base,\n      boxShadow: CARD_PAPER_SHADOW,\n      ...(a.interactive ? { cursor: 'pointer' } : null),\n      ...(a.glow\n        ? { boxShadow: halo(CARD_GLOW.rest.blurRadius, alpha(theme.palette.primary.main, CARD_GLOW.rest.alpha)) }\n        : null),\n      ...chosen.surface,\n    },\n    pressed: {\n      ...(a.glow\n        ? { boxShadow: halo(CARD_GLOW.lifted.blurRadius, alpha(theme.palette.primary.main, CARD_GLOW.lifted.alpha)) }\n        : null),\n      ...chosen.hover,\n    },\n  };\n}\n","import * as React from 'react';\nimport {\n  Image,\n  StyleSheet,\n  Text as RNText,\n  View,\n  type DimensionValue,\n  type TextStyle,\n  type ViewStyle,\n} from 'react-native';\n\nimport {\n  CARD_ACTIONS,\n  CARD_CONTENT_PADDING_UNITS,\n  CARD_HEADER,\n  CARD_HEADER_CHILDREN_PADDING_UNITS,\n  CARD_MEDIA_HEIGHT,\n} from './Card.metrics';\nimport type {\n  CardActionsAlignment,\n  CardActionsProps,\n  CardContentProps,\n  CardHeaderProps,\n  CardMediaProps,\n} from './Card.types.native';\nimport { childTestId, resolveTestId, withoutTestIdProps } from '../../../platform/test-id';\nimport { renderTextChildren } from '../../../platform/text-children';\nimport { useUiTheme } from '../../../provider/use-ui-theme.native';\nimport { muiTypeStyle } from '../../../tokens/mui-type';\nimport type { UiTheme } from '../../../tokens/theme';\n\n/**\n * THE FOUR SLOTS A CARD IS BUILT OUT OF, ON REACT NATIVE.\n *\n * Each one is a `View` carrying the padding MUI's own `CardHeader`,\n * `CardContent`, `CardActions` and `CardMedia` declare in px — the web half\n * overrides only `padding` and `justify-content`, so the rest of the numbers\n * come from MUI and are restated in `Card.metrics.ts` rather than re-invented.\n */\n\n/**\n * THE INK A CARD PUBLISHES TO ITS SLOTS.\n *\n * `Card.styles.ts` puts `color: primary.contrastText` on the gradient card\n * ITSELF and lets CSS inheritance carry it into the header and the body. React\n * Native inherits nothing across views, so the card publishes its ink here and\n * every slot reads it — which is the difference between a legible gradient card\n * and near-black text on indigo.\n *\n * `null` is \"no card above me\": a slot rendered on its own falls back to the\n * body ink, exactly as it would on the web.\n */\nexport const CardInkContext = React.createContext<string | null>(null);\n\n/** The body text of a slot, in MUI's `body1`, so a bare string is not unstyled. */\nconst slotTextStyle = (theme: UiTheme, ink: string | null): TextStyle => ({\n  ...muiTypeStyle(theme, 'body1'),\n  color: ink ?? theme.palette.text.primary,\n});\n\n/** MUI's header title: `h5`, or `body2` when an avatar shares the row. */\nexport const cardTitleStyle = (\n  theme: UiTheme,\n  hasAvatar: boolean,\n  ink: string | null = null,\n): TextStyle => ({\n  ...muiTypeStyle(theme, hasAvatar ? 'body2' : 'h5'),\n  color: ink ?? theme.palette.text.primary,\n});\n\n/**\n * MUI's header subheader: `body1` (or `body2` beside an avatar), in the muted\n * ink — which does NOT follow the card's own ink, because MUI's `CardHeader`\n * pins the subheader to `textSecondary` explicitly rather than inheriting.\n */\nexport const cardSubtitleStyle = (theme: UiTheme, hasAvatar: boolean): TextStyle => ({\n  ...muiTypeStyle(theme, hasAvatar ? 'body2' : 'body1'),\n  color: theme.palette.text.secondary,\n});\n\nexport function CardHeader({\n  title,\n  subtitle,\n  action,\n  avatar,\n  children,\n  ...others\n}: CardHeaderProps): React.JSX.Element {\n  const theme = useUiTheme();\n  const ink = React.useContext(CardInkContext);\n  const testID = resolveTestId(others, 'card-header');\n  const { style, ...viewProps } = withoutTestIdProps(others);\n\n  if (children) {\n    return (\n      <View\n        testID={testID}\n        style={[{ padding: theme.spacing(CARD_HEADER_CHILDREN_PADDING_UNITS) }, style]}\n        {...viewProps}\n      >\n        {renderTextChildren(children, slotTextStyle(theme, ink))}\n      </View>\n    );\n  }\n\n  const hasAvatar = avatar != null;\n  return (\n    <View testID={testID} style={[styles.header, style]} {...viewProps}>\n      {hasAvatar ? <View style={styles.headerAvatar}>{avatar}</View> : null}\n      <View style={styles.headerContent}>\n        {title != null ? (\n          <RNText testID={childTestId(others, 'title', 'card')} style={cardTitleStyle(theme, hasAvatar, ink)}>\n            {title}\n          </RNText>\n        ) : null}\n        {subtitle != null ? (\n          <RNText\n            testID={childTestId(others, 'subtitle', 'card')}\n            style={cardSubtitleStyle(theme, hasAvatar)}\n          >\n            {subtitle}\n          </RNText>\n        ) : null}\n      </View>\n      {action != null ? <View style={styles.headerAction}>{action}</View> : null}\n    </View>\n  );\n}\n\nCardHeader.displayName = 'CardHeader';\n\nexport function CardContent({\n  children,\n  dense = false,\n  ...others\n}: CardContentProps): React.JSX.Element {\n  const theme = useUiTheme();\n  const ink = React.useContext(CardInkContext);\n  const testID = resolveTestId(others, 'card-content');\n  const { style, ...viewProps } = withoutTestIdProps(others);\n  const padding = theme.spacing(\n    dense ? CARD_CONTENT_PADDING_UNITS.dense : CARD_CONTENT_PADDING_UNITS.normal,\n  );\n\n  return (\n    <View testID={testID} style={[{ padding }, style]} {...viewProps}>\n      {renderTextChildren(children, slotTextStyle(theme, ink))}\n    </View>\n  );\n}\n\nCardContent.displayName = 'CardContent';\n\nconst JUSTIFY: Record<CardActionsAlignment, NonNullable<ViewStyle['justifyContent']>> = {\n  left: 'flex-start',\n  center: 'center',\n  right: 'flex-end',\n  'space-between': 'space-between',\n};\n\nexport function CardActions({\n  children,\n  disableSpacing = false,\n  alignment = 'left',\n  ...others\n}: CardActionsProps): React.JSX.Element {\n  const theme = useUiTheme();\n  const ink = React.useContext(CardInkContext);\n  const testID = resolveTestId(others, 'card-actions');\n  const { style, ...viewProps } = withoutTestIdProps(others);\n\n  return (\n    <View\n      testID={testID}\n      style={[\n        styles.actions,\n        { justifyContent: JUSTIFY[alignment], gap: disableSpacing ? undefined : CARD_ACTIONS.gap },\n        style,\n      ]}\n      {...viewProps}\n    >\n      {renderTextChildren(children, slotTextStyle(theme, ink))}\n    </View>\n  );\n}\n\nCardActions.displayName = 'CardActions';\n\n/**\n * `height` accepts the web's spellings: a number, a numeric string (`\"200\"`, as\n * an `<img height>` takes) or a percentage.\n */\nexport function mediaHeight(height: number | string): DimensionValue {\n  if (typeof height === 'number') return height;\n  const parsed = Number(height);\n  return Number.isFinite(parsed) ? parsed : (height as DimensionValue);\n}\n\nexport function CardMedia({\n  image,\n  title,\n  height = CARD_MEDIA_HEIGHT,\n  children,\n  ...others\n}: CardMediaProps): React.JSX.Element {\n  const testID = resolveTestId(others, 'card-media');\n  const { style, ...viewProps } = withoutTestIdProps(others);\n\n  return (\n    <View\n      testID={testID}\n      style={[{ height: mediaHeight(height), width: '100%', overflow: 'hidden' }, style]}\n      {...viewProps}\n    >\n      {image != null ? (\n        <Image\n          source={{ uri: image }}\n          accessibilityLabel={title}\n          resizeMode=\"cover\"\n          style={StyleSheet.absoluteFill}\n        />\n      ) : null}\n      {children}\n    </View>\n  );\n}\n\nCardMedia.displayName = 'CardMedia';\n\nconst styles = StyleSheet.create({\n  header: {\n    flexDirection: 'row',\n    alignItems: 'center',\n    padding: CARD_HEADER.padding,\n  },\n  headerAvatar: {\n    flexGrow: 0,\n    flexShrink: 0,\n    flexBasis: 'auto',\n    marginRight: CARD_HEADER.avatarGap,\n  },\n  headerContent: {\n    flexGrow: 1,\n    flexShrink: 1,\n    flexBasis: 'auto',\n    minWidth: 0,\n  },\n  headerAction: {\n    flexGrow: 0,\n    flexShrink: 0,\n    flexBasis: 'auto',\n    alignSelf: 'flex-start',\n    marginTop: CARD_HEADER.action.marginTop,\n    marginRight: CARD_HEADER.action.marginRight,\n    marginBottom: CARD_HEADER.action.marginBottom,\n  },\n  actions: {\n    flexDirection: 'row',\n    alignItems: 'center',\n    padding: CARD_ACTIONS.padding,\n  },\n});\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,YAAYA,YAAW;AACvB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA,cAAAC;AAAA,EACA,QAAAC;AAAA,OAKK;;;ACOP,IAAM,gBAAkE;AAAA,EACtE,SAAS;AAAA,EACT,aAAa;AAAA,EACb,MAAM;AAAA,EACN,OAAO;AAAA,EACP,cAAc;AAAA,EACd,SAAS;AACX;AAIA,IAAM,eAAe,CAA0B,UAC7C,OAAO;AAAA,EACL,OAAO,QAAQ,KAAK,EAAE,OAAO,CAAC,CAAC,EAAE,KAAK,MAAM,UAAU,MAAS;AACjE;AAEK,IAAM,mBAAmB,CAA0B,WACvD,EAAE,GAAG,eAAe,GAAG,aAAa,KAAK,EAAE;;;ACVvC,IAAM,oBAAuE;AAAA,EAClF,MAAM;AAAA,EACN,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAGO,IAAM,mBAAmB;AAGzB,IAAM,oBAAoB;AAgB1B,IAAM,oBAAyC;AAAA,EACpD,EAAE,SAAS,GAAG,SAAS,GAAG,YAAY,GAAG,gBAAgB,IAAI,OAAO,qBAAqB;AAAA,EACzF,EAAE,SAAS,GAAG,SAAS,GAAG,YAAY,GAAG,gBAAgB,GAAG,OAAO,sBAAsB;AAAA,EACzF,EAAE,SAAS,GAAG,SAAS,GAAG,YAAY,GAAG,gBAAgB,GAAG,OAAO,sBAAsB;AAC3F;AAeO,IAAM,aAAa;AAAA,EACxB,iBAAiB,EAAE,MAAM,KAAK,QAAQ,KAAK;AAAA,EAC3C,aAAa,EAAE,MAAM,KAAK,QAAQ,IAAI;AAAA,EACtC,QAAQ;AAAA,EACR,QAAQ,EAAE,SAAS,GAAG,YAAY,IAAI,OAAO,IAAI;AACnD;AAGO,IAAM,gBAAgB;AAAA,EAC3B,UAAU;AAAA,EACV,QAAQ,EAAE,SAAS,GAAG,YAAY,IAAI,OAAO,IAAI;AACnD;AAGO,IAAM,kBAAkB;AAAA,EAC7B,QAAQ,EAAE,MAAM,GAAG,QAAQ,GAAG;AAAA,EAC9B,YAAY;AAAA,EACZ,OAAO;AAAA,IACL,MAAM,EAAE,MAAM,KAAK,KAAK,IAAI;AAAA,IAC5B,OAAO,EAAE,MAAM,EAAE,MAAM,KAAK,QAAQ,IAAI,GAAG,KAAK,EAAE,MAAM,KAAK,QAAQ,IAAI,EAAE;AAAA,EAC7E;AACF;AAMO,SAAS,kBAAkB,QAAiB,MAAc,KAAyB;AACxF,QAAM,SAAS,SAAS,gBAAgB,OAAO,SAAS,gBAAgB,OAAO;AAC/E,QAAM,aAAa,SAAS,gBAAgB;AAC5C,SAAO;AAAA,IACL,EAAE,SAAS,QAAQ,SAAS,QAAQ,YAAY,gBAAgB,GAAG,OAAO,KAAK;AAAA,IAC/E,EAAE,SAAS,CAAC,QAAQ,SAAS,CAAC,QAAQ,YAAY,gBAAgB,GAAG,OAAO,IAAI;AAAA,EAClF;AACF;AAMO,IAAM,0BAA0B;AAAA,EACrC,MAAM,EAAE,MAAM,sBAAsB,QAAQ,sBAAsB;AAAA,EAClE,OAAO,EAAE,MAAM,uBAAuB,QAAQ,sBAAsB;AACtE;AAKO,IAAM,YAAY;AAAA,EACvB,MAAM,EAAE,YAAY,IAAI,OAAO,IAAI;AAAA,EACnC,QAAQ,EAAE,YAAY,IAAI,OAAO,IAAI;AACvC;AAOO,IAAM,aAAa;AAAA,EACxB,OAAO;AAAA,EACP,YAAY;AAAA,EACZ,QAAQ;AAAA;AAAA,EAER,QAAQ;AAAA,EACR,QAAQ;AACV;AAMO,IAAM,eAAe,EAAE,SAAS,KAAK,eAAe,IAAI,aAAa,GAAG;AAKxE,IAAM,6BAA6B,EAAE,QAAQ,GAAG,OAAO,EAAE;AAMzD,IAAM,cAAc;AAAA,EACzB,SAAS;AAAA,EACT,WAAW;AAAA,EACX,QAAQ,EAAE,WAAW,IAAI,aAAa,IAAI,cAAc,GAAG;AAC7D;AAGO,IAAM,qCAAqC;AAM3C,IAAM,eAAe,EAAE,SAAS,GAAG,KAAK,EAAE;AAG1C,IAAM,oBAAoB;;;AC1I1B,SAAS,WAAW,OAAgB,QAA2C;AACpF,MAAI,WAAW,OAAQ,QAAO;AAC9B,SAAO,MAAM,QAAQ,kBAAkB,MAAM,KAAK,kBAAkB,EAAE;AACxE;AAQA,SAAS,aAAa,OAAgB,QAA0B;AAC9D,SAAO;AAAA,IACL,SAAS;AAAA,MACP,iBAAiB,MAAM,MAAM,QAAQ,WAAW,OAAO,WAAW,gBAAgB,IAAI;AAAA,MACtF,aAAa;AAAA,MACb,aAAa;AAAA,MACb,aAAa,MAAM,MAAM,QAAQ,QAAQ,MAAM,WAAW,YAAY,IAAI;AAAA,MAC1E,WAAW;AAAA,QACT,WAAW,OAAO;AAAA,QAClB,WAAW,OAAO;AAAA,QAClB,MAAM,OAAO,WAAW,OAAO,KAAK;AAAA,MACtC;AAAA,IACF;AAAA,IACA,OAAO;AAAA,MACL,iBAAiB;AAAA,QACf,MAAM,QAAQ,WAAW;AAAA,QACzB,SAAS,WAAW,gBAAgB,SAAS,WAAW,gBAAgB;AAAA,MAC1E;AAAA,MACA,aAAa,MAAM,MAAM,QAAQ,QAAQ,MAAM,WAAW,YAAY,MAAM;AAAA,IAC9E;AAAA,EACF;AACF;AAEA,SAAS,kBAAkB,OAAgB,QAA0B;AACnE,QAAM,EAAE,MAAM,MAAM,IAAI,gBAAgB;AACxC,QAAM,OAAO,CAAC,WACZ,MAAM,SAAS,SACX,kBAAkB,QAAQ,MAAM,OAAO,KAAK,IAAI,GAAG,MAAM,OAAO,KAAK,GAAG,CAAC,IACzE;AAAA,IACE;AAAA,IACA,MAAM,MAAM,QAAQ,KAAK,GAAG,GAAG,SAAS,MAAM,KAAK,SAAS,MAAM,KAAK,IAAI;AAAA,IAC3E,MAAM,OAAO,SAAS,MAAM,IAAI,SAAS,MAAM,IAAI,IAAI;AAAA,EACzD;AAEN,SAAO;AAAA,IACL,SAAS;AAAA,MACP,iBAAiB,MAAM,SAAS,SAAS,MAAM,QAAQ,KAAK,GAAG,IAAI,MAAM,QAAQ,KAAK,GAAG;AAAA,MACzF,WAAW,KAAK,KAAK;AAAA,MACrB,aAAa;AAAA,IACf;AAAA,IACA,OAAO,EAAE,WAAW,KAAK,MAAM,EAAE;AAAA,EACnC;AACF;AAEA,SAAS,eAAe,OAAgB,QAA0B;AAChE,QAAM,OAAO,wBAAwB,MAAM,SAAS,SAAS,SAAS,OAAO;AAC7E,SAAO;AAAA,IACL,SAAS,EAAE,iBAAiB,KAAK,MAAM,aAAa,GAAG,WAAW,OAAU;AAAA,IAC5E,OAAO,EAAE,iBAAiB,SAAS,KAAK,SAAS,KAAK,KAAK;AAAA,EAC7D;AACF;AASO,SAAS,YAAY,OAAgB,SAAsB,QAA0B;AAC1F,UAAQ,SAAS;AAAA,IACf,KAAK;AACH,aAAO;AAAA,QACL,SAAS;AAAA,UACP,aAAa;AAAA,UACb,aAAa;AAAA,UACb,aAAa,MAAM,QAAQ;AAAA,UAC3B,WAAW;AAAA,QACb;AAAA,QACA,OAAO,EAAE,aAAa,SAAS,MAAM,QAAQ,QAAQ,OAAO,MAAM,QAAQ,QAAQ;AAAA,MACpF;AAAA,IACF,KAAK;AACH,aAAO,aAAa,OAAO,MAAM;AAAA,IACnC,KAAK;AACH,aAAO;AAAA,QACL,SAAS;AAAA,UACP,iBAAiB,MAAM,QAAQ,QAAQ;AAAA,UACvC,WAAW;AAAA,YACT,cAAc,OAAO;AAAA,YACrB,cAAc,OAAO;AAAA,YACrB,MAAM,MAAM,QAAQ,QAAQ,MAAM,cAAc,OAAO,KAAK;AAAA,UAC9D;AAAA,QACF;AAAA,QACA,OAAO;AAAA,UACL,iBAAiB,SAAS,MAAM,QAAQ,QAAQ,OAAO,MAAM,QAAQ,QAAQ;AAAA,QAC/E;AAAA,MACF;AAAA,IACF,KAAK;AACH,aAAO,kBAAkB,OAAO,MAAM;AAAA,IACxC,KAAK;AACH,aAAO,eAAe,OAAO,MAAM;AAAA,IACrC;AAGE,aAAO,EAAE,SAAS,CAAC,GAAG,OAAO,CAAC,EAAE;AAAA,EACpC;AACF;AAGO,IAAM,UAAU,CAAC,OAAgB,YACtC,YAAY,aAAa,MAAM,QAAQ,QAAQ,eAAe,MAAM,QAAQ,KAAK;AA4B5E,SAAS,SAAS,OAAgB,GAA2B;AAClE,QAAM,SAAS,WAAW,OAAO,EAAE,YAAY;AAC/C,QAAM,SAAS,YAAY,OAAO,EAAE,SAAS,EAAE,WAAW;AAE1D,QAAM,OAAkB;AAAA,IACtB,UAAU;AAAA,IACV,cAAc;AAAA,IACd,iBAAiB,MAAM,QAAQ,WAAW;AAAA,IAC1C,UAAU,EAAE,SAAS,EAAE,OAAO,YAAY;AAAA,IAC1C,SAAS,EAAE,UAAU,aAAa,UAAU;AAAA,IAC5C,eAAe,EAAE,UAAU,SAAS;AAAA,EACtC;AAEA,SAAO;AAAA,IACL;AAAA,IACA,KAAK,QAAQ,OAAO,EAAE,OAAO;AAAA,IAC7B,WAAW;AAAA,MACT,GAAG;AAAA,MACH,WAAW;AAAA,MACX,GAAI,EAAE,cAAc,EAAE,QAAQ,UAAU,IAAI;AAAA,MAC5C,GAAI,EAAE,OACF,EAAE,WAAW,KAAK,UAAU,KAAK,YAAY,MAAM,MAAM,QAAQ,QAAQ,MAAM,UAAU,KAAK,KAAK,CAAC,EAAE,IACtG;AAAA,MACJ,GAAG,OAAO;AAAA,IACZ;AAAA,IACA,SAAS;AAAA,MACP,GAAI,EAAE,OACF,EAAE,WAAW,KAAK,UAAU,OAAO,YAAY,MAAM,MAAM,QAAQ,QAAQ,MAAM,UAAU,OAAO,KAAK,CAAC,EAAE,IAC1G;AAAA,MACJ,GAAG,OAAO;AAAA,IACZ;AAAA,EACF;AACF;;;AC3MA,YAAY,WAAW;AACvB;AAAA,EACE;AAAA,EACA;AAAA,EACA,QAAQ;AAAA,EACR;AAAA,OAIK;AAsFD,cAcA,YAdA;AA3CC,IAAM,iBAAuB,oBAA6B,IAAI;AAGrE,IAAM,gBAAgB,CAAC,OAAgB,SAAmC;AAAA,EACxE,GAAG,aAAa,OAAO,OAAO;AAAA,EAC9B,OAAO,OAAO,MAAM,QAAQ,KAAK;AACnC;AAGO,IAAM,iBAAiB,CAC5B,OACA,WACA,MAAqB,UACN;AAAA,EACf,GAAG,aAAa,OAAO,YAAY,UAAU,IAAI;AAAA,EACjD,OAAO,OAAO,MAAM,QAAQ,KAAK;AACnC;AAOO,IAAM,oBAAoB,CAAC,OAAgB,eAAmC;AAAA,EACnF,GAAG,aAAa,OAAO,YAAY,UAAU,OAAO;AAAA,EACpD,OAAO,MAAM,QAAQ,KAAK;AAC5B;AAEO,SAAS,WAAW;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAuC;AACrC,QAAM,QAAQ,WAAW;AACzB,QAAM,MAAY,iBAAW,cAAc;AAC3C,QAAM,SAAS,cAAc,QAAQ,aAAa;AAClD,QAAM,EAAE,OAAO,GAAG,UAAU,IAAI,mBAAmB,MAAM;AAEzD,MAAI,UAAU;AACZ,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,OAAO,CAAC,EAAE,SAAS,MAAM,QAAQ,kCAAkC,EAAE,GAAG,KAAK;AAAA,QAC5E,GAAG;AAAA,QAEH,6BAAmB,UAAU,cAAc,OAAO,GAAG,CAAC;AAAA;AAAA,IACzD;AAAA,EAEJ;AAEA,QAAM,YAAY,UAAU;AAC5B,SACE,qBAAC,QAAK,QAAgB,OAAO,CAAC,OAAO,QAAQ,KAAK,GAAI,GAAG,WACtD;AAAA,gBAAY,oBAAC,QAAK,OAAO,OAAO,cAAe,kBAAO,IAAU;AAAA,IACjE,qBAAC,QAAK,OAAO,OAAO,eACjB;AAAA,eAAS,OACR,oBAAC,UAAO,QAAQ,YAAY,QAAQ,SAAS,MAAM,GAAG,OAAO,eAAe,OAAO,WAAW,GAAG,GAC9F,iBACH,IACE;AAAA,MACH,YAAY,OACX;AAAA,QAAC;AAAA;AAAA,UACC,QAAQ,YAAY,QAAQ,YAAY,MAAM;AAAA,UAC9C,OAAO,kBAAkB,OAAO,SAAS;AAAA,UAExC;AAAA;AAAA,MACH,IACE;AAAA,OACN;AAAA,IACC,UAAU,OAAO,oBAAC,QAAK,OAAO,OAAO,cAAe,kBAAO,IAAU;AAAA,KACxE;AAEJ;AAEA,WAAW,cAAc;AAElB,SAAS,YAAY;AAAA,EAC1B;AAAA,EACA,QAAQ;AAAA,EACR,GAAG;AACL,GAAwC;AACtC,QAAM,QAAQ,WAAW;AACzB,QAAM,MAAY,iBAAW,cAAc;AAC3C,QAAM,SAAS,cAAc,QAAQ,cAAc;AACnD,QAAM,EAAE,OAAO,GAAG,UAAU,IAAI,mBAAmB,MAAM;AACzD,QAAM,UAAU,MAAM;AAAA,IACpB,QAAQ,2BAA2B,QAAQ,2BAA2B;AAAA,EACxE;AAEA,SACE,oBAAC,QAAK,QAAgB,OAAO,CAAC,EAAE,QAAQ,GAAG,KAAK,GAAI,GAAG,WACpD,6BAAmB,UAAU,cAAc,OAAO,GAAG,CAAC,GACzD;AAEJ;AAEA,YAAY,cAAc;AAE1B,IAAM,UAAkF;AAAA,EACtF,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,iBAAiB;AACnB;AAEO,SAAS,YAAY;AAAA,EAC1B;AAAA,EACA,iBAAiB;AAAA,EACjB,YAAY;AAAA,EACZ,GAAG;AACL,GAAwC;AACtC,QAAM,QAAQ,WAAW;AACzB,QAAM,MAAY,iBAAW,cAAc;AAC3C,QAAM,SAAS,cAAc,QAAQ,cAAc;AACnD,QAAM,EAAE,OAAO,GAAG,UAAU,IAAI,mBAAmB,MAAM;AAEzD,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,OAAO;AAAA,QACL,OAAO;AAAA,QACP,EAAE,gBAAgB,QAAQ,SAAS,GAAG,KAAK,iBAAiB,SAAY,aAAa,IAAI;AAAA,QACzF;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEH,6BAAmB,UAAU,cAAc,OAAO,GAAG,CAAC;AAAA;AAAA,EACzD;AAEJ;AAEA,YAAY,cAAc;AAMnB,SAAS,YAAY,QAAyC;AACnE,MAAI,OAAO,WAAW,SAAU,QAAO;AACvC,QAAM,SAAS,OAAO,MAAM;AAC5B,SAAO,OAAO,SAAS,MAAM,IAAI,SAAU;AAC7C;AAEO,SAAS,UAAU;AAAA,EACxB;AAAA,EACA;AAAA,EACA,SAAS;AAAA,EACT;AAAA,EACA,GAAG;AACL,GAAsC;AACpC,QAAM,SAAS,cAAc,QAAQ,YAAY;AACjD,QAAM,EAAE,OAAO,GAAG,UAAU,IAAI,mBAAmB,MAAM;AAEzD,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,OAAO,CAAC,EAAE,QAAQ,YAAY,MAAM,GAAG,OAAO,QAAQ,UAAU,SAAS,GAAG,KAAK;AAAA,MAChF,GAAG;AAAA,MAEH;AAAA,iBAAS,OACR;AAAA,UAAC;AAAA;AAAA,YACC,QAAQ,EAAE,KAAK,MAAM;AAAA,YACrB,oBAAoB;AAAA,YACpB,YAAW;AAAA,YACX,OAAO,WAAW;AAAA;AAAA,QACpB,IACE;AAAA,QACH;AAAA;AAAA;AAAA,EACH;AAEJ;AAEA,UAAU,cAAc;AAExB,IAAM,SAAS,WAAW,OAAO;AAAA,EAC/B,QAAQ;AAAA,IACN,eAAe;AAAA,IACf,YAAY;AAAA,IACZ,SAAS,YAAY;AAAA,EACvB;AAAA,EACA,cAAc;AAAA,IACZ,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,aAAa,YAAY;AAAA,EAC3B;AAAA,EACA,eAAe;AAAA,IACb,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,UAAU;AAAA,EACZ;AAAA,EACA,cAAc;AAAA,IACZ,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,WAAW;AAAA,IACX,WAAW,YAAY,OAAO;AAAA,IAC9B,aAAa,YAAY,OAAO;AAAA,IAChC,cAAc,YAAY,OAAO;AAAA,EACnC;AAAA,EACA,SAAS;AAAA,IACP,eAAe;AAAA,IACf,YAAY;AAAA,IACZ,SAAS,aAAa;AAAA,EACxB;AACF,CAAC;;;AJpOK,gBAAAC,MA+CF,QAAAC,aA/CE;AAHN,SAAS,QAAQ,EAAE,OAAO,OAAO,GAAyD;AACxF,SACE,gBAAAD,KAACE,OAAA,EAAK,QAAgB,OAAO,CAACC,QAAO,SAAS,EAAE,QAAQ,aAAa,cAAc,CAAC,GAClF,0BAAAH;AAAA,IAAC;AAAA;AAAA,MACC,MAAM,SAAS,OAAO,QAAQ,UAAU,aAAa;AAAA,MACrD;AAAA;AAAA,EACF,GACF;AAEJ;AAEO,IAAM,OAAa,kBAA4B,CAAC,UAAU,QAAQ;AACvE,QAAM,WAAW,iBAAiB,QAAQ;AAC1C,QAAM,EAAE,UAAU,SAAS,OAAO,SAAS,SAAS,SAAS,QAAQ,GAAG,OAAO,IAAI;AACnF,QAAM,QAAQ,WAAW;AACzB,QAAM,OAAO,SAAS,OAAO,QAAQ;AAErC,QAAM,SAAS,cAAc,QAAQ,MAAM;AAC3C,QAAM,QAAQ,CAAC,WAA2B,YAAY,QAAQ,QAAQ,MAAM;AAC5E,QAAM,OAAO,mBAAmB,MAAM;AAGtC,QAAM;AAAA,IACJ,SAAS;AAAA,IACT;AAAA,IACA,MAAM;AAAA,IACN,cAAc;AAAA,IACd;AAAA,IACA,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,gBAAgB;AAAA,IAChB,mBAAmB;AAAA,IACnB,gBAAgB;AAAA,IAChB,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,GAAG;AAAA,EACL,IAAI;AAIJ,QAAM,OAAO,CAAC;AACd,QAAM,cAAc,CAAC,UAAuC;AAC1D,cAAU,KAAK;AACf,cAAU,KAAK;AAAA,EACjB;AAKA,QAAM,OACJ,gBAAAC,MAAC,eAAe,UAAf,EAAwB,OAAO,KAAK,KAClC;AAAA,YACC,gBAAAD;AAAA,MAAC;AAAA;AAAA,QACC,OAAO,MAAM,QAAQ,QAAQ;AAAA,QAC7B,QAAQ,KAAK;AAAA,QACb,QAAQ,WAAW;AAAA,QACnB,YAAY,WAAW;AAAA,QACvB,QAAQ,WAAW;AAAA,QACnB,SAAS,WAAW;AAAA,QACpB,QAAQ,MAAM,OAAO;AAAA;AAAA,IACvB,IACE;AAAA,IACH,UAAU,gBAAAA,KAAC,WAAQ,OAAO,MAAM,QAAQ,QAAQ,MAAM,QAAQ,MAAM,SAAS,GAAG,IAAK;AAAA,IACrF,mBAAmB,UAAU,EAAE,GAAG,aAAa,OAAO,OAAO,GAAG,OAAO,KAAK,IAAI,CAAC;AAAA,KACpF;AAGF,QAAM,SAAS,EAAE,QAAQ,SAAS,OAAO,UAAU,QAAW,QAAQ,OAAO,SAAS,OAAU;AAEhG,MAAI,CAAC,eAAe,CAAC,WAAW,CAAC,SAAS;AACxC,WACE,gBAAAA,KAACE,OAAA,EAAK,KAAU,OAAO,CAAC,KAAK,WAAW,KAAK,GAAI,GAAG,QAAS,GAAG,WAC7D,gBACH;AAAA,EAEJ;AAEA,QAAM,YAAY,CAAC,EAAE,QAAQ,MAAwD;AAAA,IACnF,KAAK;AAAA,IACL,WAAW,OAAO,KAAK,UAAU;AAAA,IACjC;AAAA,EACF;AAEA,SACE,gBAAAF,KAAC,aAAU,KAAU,OAAO,WAAW,SAAS,OAAO,cAAc,QAAY,GAAG,QAAS,GAAG,WAC7F,gBACH;AAEJ,CAAC;AAED,KAAK,cAAc;AAEnB,IAAMG,UAASC,YAAW,OAAO;AAAA,EAC/B,SAAS;AAAA,IACP,GAAGA,YAAW;AAAA,IACd,YAAY;AAAA,IACZ,gBAAgB;AAAA,IAChB,eAAe;AAAA,EACjB;AACF,CAAC;","names":["React","StyleSheet","View","jsx","jsxs","View","styles","StyleSheet"]}

package/dist/native/layout/Container.js

@@ -1,11 +1,11 @@
 import {
   resolveTestId,
   withoutTestIdProps
-} from "../chunks/chunk-M4DTJDWU.js";
+} from "../chunks/chunk-AR5O4BEY.js";
 import {
   useUiTheme
-} from "../chunks/chunk-YTHR4Y5P.js";
-import "../chunks/chunk-P3PL4WBO.js";
+} from "../chunks/chunk-GWGIWQO7.js";
+import "../chunks/chunk-LEMMXZFN.js";
 
 // src/components/layout/Container/Container.native.tsx
 import * as React from "react";

package/dist/native/layout/Skeleton.js

@@ -1,16 +1,16 @@
-import {
-  useLoopedProgress
-} from "../chunks/chunk-MLQIOKQZ.js";
 import {
   resolveTestId,
   withoutTestIdProps
-} from "../chunks/chunk-M4DTJDWU.js";
+} from "../chunks/chunk-AR5O4BEY.js";
+import {
+  useLoopedProgress
+} from "../chunks/chunk-MLQIOKQZ.js";
 import {
   useUiTheme
-} from "../chunks/chunk-YTHR4Y5P.js";
+} from "../chunks/chunk-GWGIWQO7.js";
 import {
   alpha
-} from "../chunks/chunk-P3PL4WBO.js";
+} from "../chunks/chunk-LEMMXZFN.js";
 
 // src/components/layout/Skeleton/Skeleton.native.tsx
 import * as React from "react";

package/dist/native/layout/Spacer.js

@@ -1,13 +1,13 @@
 import {
   resolveTestId,
   withoutTestIdProps
-} from "../chunks/chunk-M4DTJDWU.js";
+} from "../chunks/chunk-AR5O4BEY.js";
 import {
   useUiTheme
-} from "../chunks/chunk-YTHR4Y5P.js";
+} from "../chunks/chunk-GWGIWQO7.js";
 import {
   cssLengthToPx
-} from "../chunks/chunk-P3PL4WBO.js";
+} from "../chunks/chunk-LEMMXZFN.js";
 
 // src/components/layout/Spacer/Spacer.native.tsx
 import * as React from "react";

package/dist/native/layout/Stack.js

@@ -1,9 +1,9 @@
 import {
   Box
-} from "../chunks/chunk-EKKNUEA6.js";
-import "../chunks/chunk-M4DTJDWU.js";
-import "../chunks/chunk-YTHR4Y5P.js";
-import "../chunks/chunk-P3PL4WBO.js";
+} from "../chunks/chunk-75JQYVDZ.js";
+import "../chunks/chunk-AR5O4BEY.js";
+import "../chunks/chunk-GWGIWQO7.js";
+import "../chunks/chunk-LEMMXZFN.js";
 
 // src/components/layout/Stack/Stack.native.tsx
 import * as React2 from "react";

package/dist/native/provider.js

@@ -1,10 +1,10 @@
 import {
   UiThemeContext,
   useUiTheme
-} from "./chunks/chunk-YTHR4Y5P.js";
+} from "./chunks/chunk-GWGIWQO7.js";
 import {
   createUiTheme
-} from "./chunks/chunk-P3PL4WBO.js";
+} from "./chunks/chunk-LEMMXZFN.js";
 
 // src/provider/UiProvider.native.tsx
 import * as React from "react";

package/dist/native/tokens.js

@@ -30,7 +30,7 @@ import {
   lighten,
   px,
   recomposeColor
-} from "./chunks/chunk-P3PL4WBO.js";
+} from "./chunks/chunk-LEMMXZFN.js";
 export {
   COLOR_VALUES,
   DEFAULT_BRAND,