@12-apps/ui 6.17.1 → 6.18.0

package/dist/native/form/Button.js

@@ -0,0 +1,321 @@
+import {
+  childTestId,
+  resolveTestId,
+  withoutTestIdProps
+} from "../chunks/chunk-M4DTJDWU.js";
+import {
+  useUiTheme
+} from "../chunks/chunk-VGBKUL6D.js";
+import {
+  alpha,
+  darken,
+  lighten
+} from "../chunks/chunk-L2UUNK2M.js";
+
+// src/components/form/Button/Button.native.tsx
+import * as React from "react";
+import {
+  ActivityIndicator,
+  Animated,
+  Easing,
+  Platform,
+  Pressable,
+  StyleSheet,
+  Text as RNText,
+  View
+} from "react-native";
+
+// src/components/form/Button/Button.helpers.ts
+var BUTTON_DEFAULTS = {
+  variant: "solid",
+  color: "primary",
+  size: "md",
+  loading: false,
+  iconPosition: "left",
+  glow: false,
+  pulse: false,
+  ripple: true,
+  active: false
+};
+var definedProps = (props) => Object.fromEntries(
+  Object.entries(props).filter(([, value]) => value !== void 0)
+);
+var resolveButtonProps = (props) => ({ ...BUTTON_DEFAULTS, ...definedProps(props) });
+
+// src/components/form/Button/Button.metrics.ts
+var BUTTON_SIZES = {
+  xs: { paddingVertical: 2, paddingHorizontal: 8, fontSize: 12 },
+  sm: { paddingVertical: 6, paddingHorizontal: 12, fontSize: 14 },
+  md: { paddingVertical: 8, paddingHorizontal: 16, fontSize: 16 },
+  lg: { paddingVertical: 10, paddingHorizontal: 20, fontSize: 18 },
+  xl: { paddingVertical: 12, paddingHorizontal: 24, fontSize: 20 }
+};
+var ICON_ONLY_PADDING = {
+  xs: 2,
+  sm: 5,
+  md: 7,
+  lg: 9,
+  xl: 11
+};
+var BUTTON_FONT_WEIGHT = 500;
+var BUTTON_RADIUS_UNITS = 1;
+var BUTTON_ICON_GAP_UNITS = 0.5;
+var BUTTON_SPINNER_SIZE = 16;
+var BUTTON_LINE_HEIGHT = 1.75;
+var BUTTON_WASH_ALPHA = 0.1;
+var GLASS_BACKGROUND_ALPHA = 0.1;
+var GLASS_BACKGROUND_ALPHA_PRESSED = 0.2;
+var GLASS_BORDER_ALPHA = 0.2;
+var GLOW_INNER_ALPHA = 0.6;
+var GLOW_RADIUS = 20;
+var PULSE_ALPHA = 0.3;
+var PULSE_DURATION_MS = 2e3;
+var PULSE_SPREAD = 15;
+function buttonPalette(theme, color) {
+  if (color === "neutral") {
+    return {
+      main: theme.palette.grey[700],
+      dark: theme.palette.grey[800],
+      light: theme.palette.grey[500],
+      contrastText: "#fff"
+    };
+  }
+  return theme.palette[color];
+}
+var quietInk = (theme, palette) => theme.mode === "dark" ? lighten(palette.main, 0.35) : darken(palette.main, 0.3);
+function gradientStops(theme, color, palette) {
+  switch (color) {
+    case "primary":
+      return [theme.palette.primary.main, theme.palette.secondary.main];
+    case "secondary":
+      return [theme.palette.secondary.main, theme.palette.primary.main];
+    case "success":
+    case "warning":
+      return [theme.palette[color].light, theme.palette[color].dark];
+    case "danger":
+      return [theme.palette.danger.light, theme.palette.danger.dark];
+    default:
+      return [palette.main, palette.dark];
+  }
+}
+
+// src/components/form/Button/Button.native.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var MIN_WIDTH = 64;
+function paintFor(theme, variant, color, palette, active) {
+  const wash = alpha(palette.main, BUTTON_WASH_ALPHA);
+  switch (variant) {
+    case "outline":
+      return {
+        container: { backgroundColor: "transparent", borderWidth: 1, borderColor: palette.main },
+        pressed: { backgroundColor: wash, borderColor: palette.dark },
+        label: { color: palette.main }
+      };
+    case "ghost":
+      return {
+        container: { backgroundColor: "transparent" },
+        pressed: { backgroundColor: wash },
+        label: { color: quietInk(theme, palette) }
+      };
+    case "text":
+      return {
+        container: { backgroundColor: active ? wash : "transparent" },
+        pressed: { backgroundColor: wash },
+        label: { color: quietInk(theme, palette) }
+      };
+    case "glass":
+      return {
+        container: {
+          backgroundColor: alpha(theme.palette.background.paper, GLASS_BACKGROUND_ALPHA),
+          borderWidth: 1,
+          borderColor: alpha(theme.palette.divider, GLASS_BORDER_ALPHA)
+        },
+        pressed: { backgroundColor: alpha(theme.palette.background.paper, GLASS_BACKGROUND_ALPHA_PRESSED) },
+        label: { color: palette.main }
+      };
+    case "gradient": {
+      const [from, to] = gradientStops(theme, color, palette);
+      return {
+        container: { backgroundColor: from },
+        pressed: { backgroundColor: to },
+        label: { color: "#fff" }
+      };
+    }
+    default:
+      return {
+        container: { backgroundColor: palette.main },
+        pressed: { backgroundColor: palette.dark },
+        label: { color: palette.contrastText || "#fff" }
+      };
+  }
+}
+function disabledPaint(theme, variant) {
+  const filled = variant === "solid" || variant === "gradient" || variant === "glass";
+  return {
+    container: filled ? { backgroundColor: theme.palette.action.disabledBackground, borderWidth: 0 } : variant === "outline" ? { backgroundColor: "transparent", borderWidth: 1, borderColor: theme.palette.action.disabledBackground } : { backgroundColor: "transparent" },
+    pressed: {},
+    label: { color: theme.palette.action.disabled }
+  };
+}
+function sizeStyle(theme, size, iconOnly, hasIcon) {
+  const metrics = BUTTON_SIZES[size];
+  if (iconOnly) {
+    return { padding: ICON_ONLY_PADDING[size], minWidth: 0 };
+  }
+  return {
+    paddingVertical: metrics.paddingVertical,
+    paddingHorizontal: metrics.paddingHorizontal,
+    minWidth: MIN_WIDTH,
+    gap: hasIcon ? theme.spacing(BUTTON_ICON_GAP_UNITS) : void 0
+  };
+}
+function glowStyle(palette) {
+  return Platform.select({
+    android: { elevation: 8 },
+    default: {
+      shadowColor: palette.main,
+      shadowOpacity: GLOW_INNER_ALPHA,
+      shadowRadius: GLOW_RADIUS,
+      shadowOffset: { width: 0, height: 0 }
+    }
+  });
+}
+function Pulse({ color, radius, testID }) {
+  const progress = React.useRef(new Animated.Value(0)).current;
+  React.useEffect(() => {
+    const loop = Animated.loop(
+      Animated.timing(progress, {
+        toValue: 1,
+        duration: PULSE_DURATION_MS,
+        easing: Easing.out(Easing.ease),
+        useNativeDriver: Platform.OS !== "web"
+      })
+    );
+    loop.start();
+    return () => loop.stop();
+  }, [progress]);
+  return /* @__PURE__ */ jsx(
+    Animated.View,
+    {
+      testID,
+      "aria-hidden": true,
+      style: [
+        StyleSheet.absoluteFill,
+        {
+          pointerEvents: "none",
+          borderRadius: radius,
+          backgroundColor: color,
+          opacity: progress.interpolate({ inputRange: [0, 0.7, 1], outputRange: [PULSE_ALPHA, 0, 0] }),
+          transform: [
+            { scale: progress.interpolate({ inputRange: [0, 0.7, 1], outputRange: [1, 1 + PULSE_SPREAD / 40, 1] }) }
+          ]
+        }
+      ]
+    }
+  );
+}
+function renderChildren(children, label) {
+  return React.Children.map(
+    children,
+    (child) => typeof child === "string" || typeof child === "number" ? /* @__PURE__ */ jsx(RNText, { style: label, numberOfLines: 1, children: child }) : child
+  );
+}
+function buttonLook(theme, props) {
+  const { variant, color, size, loading, icon, children, glow, pulse, active, disabled, style } = props;
+  const palette = buttonPalette(theme, color);
+  const iconOnly = !loading && icon != null && children == null;
+  const inactive = Boolean(disabled) || loading;
+  const paint = inactive ? disabledPaint(theme, variant) : paintFor(theme, variant, color, palette, active);
+  const radius = theme.spacing(BUTTON_RADIUS_UNITS);
+  const metrics = BUTTON_SIZES[size];
+  const overflow = pulse || glow ? "visible" : "hidden";
+  const sized = sizeStyle(theme, size, iconOnly, icon != null && !loading);
+  const glowing = glow && !inactive ? glowStyle(palette) : null;
+  return {
+    inactive,
+    palette,
+    radius,
+    label: {
+      fontFamily: theme.typography.fontFamily,
+      fontSize: metrics.fontSize,
+      lineHeight: metrics.fontSize * BUTTON_LINE_HEIGHT,
+      fontWeight: String(BUTTON_FONT_WEIGHT),
+      textAlign: "center",
+      ...paint.label
+    },
+    container: (state) => [
+      styles.base,
+      { borderRadius: radius, overflow },
+      sized,
+      paint.container,
+      state.pressed && !inactive ? paint.pressed : null,
+      glowing,
+      style
+    ]
+  };
+}
+function Spinner({ color, testID }) {
+  return /* @__PURE__ */ jsx(
+    ActivityIndicator,
+    {
+      size: Platform.OS === "ios" ? "small" : BUTTON_SPINNER_SIZE,
+      color,
+      testID,
+      accessibilityLabel: "loading"
+    }
+  );
+}
+var Button = React.forwardRef((rawProps, ref) => {
+  const resolved = resolveButtonProps(rawProps);
+  const { loading, icon, iconPosition, pulse, ripple, children, onClick, onPress, ...others } = resolved;
+  const theme = useUiTheme();
+  const look = buttonLook(theme, resolved);
+  const testId = resolveTestId(others, "button");
+  const idFor = (suffix) => childTestId(others, suffix, "button");
+  const rest = withoutTestIdProps(others);
+  const { variant: _v, color: _c, size: _s, glow: _g, active: _a, disabled: _d, style: _st, ...pressable } = rest;
+  const handlePress = (event) => {
+    onClick?.(event);
+    onPress?.(event);
+  };
+  const iconNode = !loading && icon ? /* @__PURE__ */ jsx(View, { style: styles.icon, testID: idFor("icon"), children: icon }) : null;
+  return /* @__PURE__ */ jsxs(
+    Pressable,
+    {
+      ref,
+      role: "button",
+      "aria-disabled": look.inactive,
+      "aria-busy": loading,
+      disabled: look.inactive,
+      onPress: handlePress,
+      android_ripple: ripple && !look.inactive ? { color: alpha(look.palette.main, 0.2), borderless: false } : void 0,
+      style: look.container,
+      testID: testId,
+      ...pressable,
+      children: [
+        pulse && !look.inactive ? /* @__PURE__ */ jsx(Pulse, { color: look.palette.main, radius: look.radius, testID: idFor("pulse") }) : null,
+        iconPosition === "left" ? iconNode : null,
+        loading ? /* @__PURE__ */ jsx(Spinner, { color: look.label.color, testID: idFor("loading") }) : renderChildren(children, look.label),
+        iconPosition === "right" ? iconNode : null
+      ]
+    }
+  );
+});
+Button.displayName = "Button";
+var styles = StyleSheet.create({
+  base: {
+    flexDirection: "row",
+    alignItems: "center",
+    justifyContent: "center",
+    alignSelf: "flex-start",
+    position: "relative"
+  },
+  icon: {
+    alignItems: "center",
+    justifyContent: "center"
+  }
+});
+export {
+  Button
+};
+//# sourceMappingURL=Button.js.map

package/dist/native/form/Button.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/form/Button/Button.native.tsx","../../../src/components/form/Button/Button.helpers.ts","../../../src/components/form/Button/Button.metrics.ts"],"sourcesContent":["import * as React from 'react';\nimport {\n  ActivityIndicator,\n  Animated,\n  Easing,\n  Platform,\n  Pressable,\n  StyleSheet,\n  Text as RNText,\n  View,\n  type GestureResponderEvent,\n  type PressableStateCallbackType,\n  type StyleProp,\n  type TextStyle,\n  type ViewStyle,\n} from 'react-native';\n\nimport { resolveButtonProps } from './Button.helpers';\nimport {\n  BUTTON_FONT_WEIGHT,\n  BUTTON_ICON_GAP_UNITS,\n  BUTTON_LINE_HEIGHT,\n  BUTTON_RADIUS_UNITS,\n  BUTTON_SIZES,\n  BUTTON_SPINNER_SIZE,\n  BUTTON_WASH_ALPHA,\n  GLASS_BACKGROUND_ALPHA,\n  GLASS_BACKGROUND_ALPHA_PRESSED,\n  GLASS_BORDER_ALPHA,\n  GLOW_INNER_ALPHA,\n  GLOW_RADIUS,\n  ICON_ONLY_PADDING,\n  PULSE_ALPHA,\n  PULSE_DURATION_MS,\n  PULSE_SPREAD,\n  buttonPalette,\n  gradientStops,\n  quietInk,\n} from './Button.metrics';\nimport type { ButtonProps, ButtonVariant } from './Button.types.native';\nimport { childTestId, resolveTestId, withoutTestIdProps } from '../../../platform/test-id';\nimport { useUiTheme } from '../../../provider/use-ui-theme.native';\nimport { alpha } from '../../../tokens/color';\nimport type { ColorValue, SizeValue } from '../../../tokens/vocabulary';\nimport type { UiPaletteColor, UiTheme } from '../../../tokens/theme';\n\n/** MUI's `min-width` for a button that carries a label. */\nconst MIN_WIDTH = 64;\n\ninterface Paint {\n  container: ViewStyle;\n  pressed: ViewStyle;\n  label: TextStyle;\n}\n\n/**\n * What the web's `VARIANT_STYLES` paint, as three React Native styles: at rest,\n * while pressed (the web's `:hover`, which touch has no equivalent of), and the\n * label. Same palette arithmetic, same alphas.\n *\n * `gradient` is the one honest gap: React Native core has no gradient fill, so\n * it paints the gradient's first stop. A host wanting the real thing adds a\n * gradient library; the parity ledger records this.\n */\nfunction paintFor(\n  theme: UiTheme,\n  variant: ButtonVariant,\n  color: ColorValue,\n  palette: UiPaletteColor,\n  active: boolean,\n): Paint {\n  const wash = alpha(palette.main, BUTTON_WASH_ALPHA);\n  switch (variant) {\n    case 'outline':\n      return {\n        container: { backgroundColor: 'transparent', borderWidth: 1, borderColor: palette.main },\n        pressed: { backgroundColor: wash, borderColor: palette.dark },\n        label: { color: palette.main },\n      };\n    case 'ghost':\n      return {\n        container: { backgroundColor: 'transparent' },\n        pressed: { backgroundColor: wash },\n        label: { color: quietInk(theme, palette) },\n      };\n    case 'text':\n      return {\n        container: { backgroundColor: active ? wash : 'transparent' },\n        pressed: { backgroundColor: wash },\n        label: { color: quietInk(theme, palette) },\n      };\n    case 'glass':\n      return {\n        container: {\n          backgroundColor: alpha(theme.palette.background.paper, GLASS_BACKGROUND_ALPHA),\n          borderWidth: 1,\n          borderColor: alpha(theme.palette.divider, GLASS_BORDER_ALPHA),\n        },\n        pressed: { backgroundColor: alpha(theme.palette.background.paper, GLASS_BACKGROUND_ALPHA_PRESSED) },\n        label: { color: palette.main },\n      };\n    case 'gradient': {\n      const [from, to] = gradientStops(theme, color, palette);\n      return {\n        container: { backgroundColor: from },\n        pressed: { backgroundColor: to },\n        label: { color: '#fff' },\n      };\n    }\n    default:\n      return {\n        container: { backgroundColor: palette.main },\n        pressed: { backgroundColor: palette.dark },\n        label: { color: palette.contrastText || '#fff' },\n      };\n  }\n}\n\n/** MUI's disabled treatment per variant family, so a disabled button reads as one on both sides. */\nfunction disabledPaint(theme: UiTheme, variant: ButtonVariant): Paint {\n  const filled = variant === 'solid' || variant === 'gradient' || variant === 'glass';\n  return {\n    container: filled\n      ? { backgroundColor: theme.palette.action.disabledBackground, borderWidth: 0 }\n      : variant === 'outline'\n        ? { backgroundColor: 'transparent', borderWidth: 1, borderColor: theme.palette.action.disabledBackground }\n        : { backgroundColor: 'transparent' },\n    pressed: {},\n    label: { color: theme.palette.action.disabled },\n  };\n}\n\nfunction sizeStyle(theme: UiTheme, size: SizeValue, iconOnly: boolean, hasIcon: boolean): ViewStyle {\n  const metrics = BUTTON_SIZES[size];\n  if (iconOnly) {\n    return { padding: ICON_ONLY_PADDING[size], minWidth: 0 };\n  }\n  return {\n    paddingVertical: metrics.paddingVertical,\n    paddingHorizontal: metrics.paddingHorizontal,\n    minWidth: MIN_WIDTH,\n    gap: hasIcon ? theme.spacing(BUTTON_ICON_GAP_UNITS) : undefined,\n  };\n}\n\nfunction glowStyle(palette: UiPaletteColor): ViewStyle {\n  return Platform.select<ViewStyle>({\n    android: { elevation: 8 },\n    default: {\n      shadowColor: palette.main,\n      shadowOpacity: GLOW_INNER_ALPHA,\n      shadowRadius: GLOW_RADIUS,\n      shadowOffset: { width: 0, height: 0 },\n    },\n  });\n}\n\n/** The web's `::after` pulse ring: a looped scale-and-fade behind the button. */\nfunction Pulse({ color, radius, testID }: { color: string; radius: number; testID: string }): React.JSX.Element {\n  const progress = React.useRef(new Animated.Value(0)).current;\n\n  React.useEffect(() => {\n    const loop = Animated.loop(\n      Animated.timing(progress, {\n        toValue: 1,\n        duration: PULSE_DURATION_MS,\n        easing: Easing.out(Easing.ease),\n        useNativeDriver: Platform.OS !== 'web',\n      }),\n    );\n    loop.start();\n    return () => loop.stop();\n  }, [progress]);\n\n  return (\n    <Animated.View\n      testID={testID}\n      aria-hidden\n      style={[\n        StyleSheet.absoluteFill,\n        {\n          pointerEvents: 'none',\n          borderRadius: radius,\n          backgroundColor: color,\n          opacity: progress.interpolate({ inputRange: [0, 0.7, 1], outputRange: [PULSE_ALPHA, 0, 0] }),\n          transform: [\n            { scale: progress.interpolate({ inputRange: [0, 0.7, 1], outputRange: [1, 1 + PULSE_SPREAD / 40, 1] }) },\n          ],\n        },\n      ]}\n    />\n  );\n}\n\n/**\n * A string or number child is the label and gets the label style; anything\n * else is rendered as given. No test id of its own: the web puts none on the\n * label, and a shared story that counts `/perf-button-/` must count buttons.\n */\nfunction renderChildren(children: React.ReactNode, label: TextStyle): React.ReactNode {\n  return React.Children.map(children, (child) =>\n    typeof child === 'string' || typeof child === 'number' ? (\n      <RNText style={label} numberOfLines={1}>\n        {child}\n      </RNText>\n    ) : (\n      child\n    ),\n  );\n}\n\ntype ResolvedProps = ReturnType<typeof resolveButtonProps<ButtonProps>>;\n\ninterface ButtonLook {\n  inactive: boolean;\n  palette: UiPaletteColor;\n  radius: number;\n  label: TextStyle;\n  container: (state: PressableStateCallbackType) => StyleProp<ViewStyle>;\n}\n\n/**\n * Everything the button paints, decided once per render from the resolved\n * props and the theme. Kept out of the component so the component reads as\n * structure — what renders where — and this reads as arithmetic.\n */\nfunction buttonLook(theme: UiTheme, props: ResolvedProps): ButtonLook {\n  const { variant, color, size, loading, icon, children, glow, pulse, active, disabled, style } = props;\n  const palette = buttonPalette(theme, color);\n  const iconOnly = !loading && icon != null && children == null;\n  const inactive = Boolean(disabled) || loading;\n  const paint = inactive ? disabledPaint(theme, variant) : paintFor(theme, variant, color, palette, active);\n  const radius = theme.spacing(BUTTON_RADIUS_UNITS);\n  const metrics = BUTTON_SIZES[size];\n  // The web button is `overflow: hidden` (its ripple needs it) unless the pulse\n  // ring turns it visible; on native the glow's shadow needs it visible too,\n  // because a view's own shadow is clipped by its own overflow there.\n  const overflow: ViewStyle['overflow'] = pulse || glow ? 'visible' : 'hidden';\n  const sized = sizeStyle(theme, size, iconOnly, icon != null && !loading);\n  const glowing = glow && !inactive ? glowStyle(palette) : null;\n\n  return {\n    inactive,\n    palette,\n    radius,\n    label: {\n      fontFamily: theme.typography.fontFamily,\n      fontSize: metrics.fontSize,\n      lineHeight: metrics.fontSize * BUTTON_LINE_HEIGHT,\n      fontWeight: String(BUTTON_FONT_WEIGHT) as TextStyle['fontWeight'],\n      textAlign: 'center',\n      ...paint.label,\n    },\n    container: (state) => [\n      styles.base,\n      { borderRadius: radius, overflow },\n      sized,\n      paint.container,\n      state.pressed && !inactive ? paint.pressed : null,\n      glowing,\n      style,\n    ],\n  };\n}\n\n/** The spinner that replaces the label while loading; `role` comes from react-native's ActivityIndicator. */\nfunction Spinner({ color, testID }: { color: string; testID: string }): React.JSX.Element {\n  return (\n    <ActivityIndicator\n      size={Platform.OS === 'ios' ? 'small' : BUTTON_SPINNER_SIZE}\n      color={color}\n      testID={testID}\n      accessibilityLabel=\"loading\"\n    />\n  );\n}\n\nexport const Button = React.forwardRef<View, ButtonProps>((rawProps, ref) => {\n  const resolved = resolveButtonProps(rawProps);\n  const { loading, icon, iconPosition, pulse, ripple, children, onClick, onPress, ...others } = resolved;\n  const theme = useUiTheme();\n  const look = buttonLook(theme, resolved);\n\n  // The shared stories pass `'data-testid'` as a plain prop; honour it here and\n  // keep all three spellings off the element (react-native-web would drop them).\n  const testId = resolveTestId(others, 'button');\n  const idFor = (suffix: string) => childTestId(others, suffix, 'button');\n  const rest = withoutTestIdProps(others);\n  // `buttonLook` consumed these; they are not Pressable props.\n  const { variant: _v, color: _c, size: _s, glow: _g, active: _a, disabled: _d, style: _st, ...pressable } = rest;\n\n  const handlePress = (event: GestureResponderEvent): void => {\n    onClick?.(event);\n    onPress?.(event);\n  };\n\n  const iconNode =\n    !loading && icon ? (\n      <View style={styles.icon} testID={idFor('icon')}>\n        {icon}\n      </View>\n    ) : null;\n\n  return (\n    <Pressable\n      ref={ref}\n      role=\"button\"\n      aria-disabled={look.inactive}\n      aria-busy={loading}\n      disabled={look.inactive}\n      onPress={handlePress}\n      android_ripple={ripple && !look.inactive ? { color: alpha(look.palette.main, 0.2), borderless: false } : undefined}\n      style={look.container}\n      testID={testId}\n      {...pressable}\n    >\n      {pulse && !look.inactive ? <Pulse color={look.palette.main} radius={look.radius} testID={idFor('pulse')} /> : null}\n      {iconPosition === 'left' ? iconNode : null}\n      {loading ? <Spinner color={look.label.color as string} testID={idFor('loading')} /> : renderChildren(children, look.label)}\n      {iconPosition === 'right' ? iconNode : null}\n    </Pressable>\n  );\n});\n\nButton.displayName = 'Button';\n\nconst styles = StyleSheet.create({\n  base: {\n    flexDirection: 'row',\n    alignItems: 'center',\n    justifyContent: 'center',\n    alignSelf: 'flex-start',\n    position: 'relative',\n  },\n  icon: {\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n});\n","import type { ButtonBaseProps } from './Button.base';\n\ntype ButtonDefaultedKeys =\n  | 'variant'\n  | 'color'\n  | 'size'\n  | 'loading'\n  | 'iconPosition'\n  | 'glow'\n  | 'pulse'\n  | 'ripple'\n  | 'active';\n\n/**\n * Generic over the renderer's own props: the web and the native `Button` pass\n * different handler types through, and both come back out untouched.\n */\ntype ResolvedButtonProps<P extends ButtonBaseProps> = P &\n  Required<Pick<ButtonBaseProps, ButtonDefaultedKeys>>;\n\nconst BUTTON_DEFAULTS: Required<Pick<ButtonBaseProps, ButtonDefaultedKeys>> = {\n  variant: 'solid',\n  color: 'primary',\n  size: 'md',\n  loading: false,\n  iconPosition: 'left',\n  glow: false,\n  pulse: false,\n  ripple: true,\n  active: false,\n};\n\n// Strips explicitly-undefined props before the merge, so `size={undefined}` still\n// falls back to the default exactly as a destructuring default would.\nconst definedProps = <P extends ButtonBaseProps>(props: P): Partial<P> =>\n  Object.fromEntries(\n    Object.entries(props).filter(([, value]) => value !== undefined),\n  ) as Partial<P>;\n\nexport const resolveButtonProps = <P extends ButtonBaseProps>(props: P): ResolvedButtonProps<P> =>\n  ({ ...BUTTON_DEFAULTS, ...definedProps(props) }) as ResolvedButtonProps<P>;\n","import { darken, lighten } from '../../../tokens/color';\nimport type { ColorValue, SizeValue } from '../../../tokens/vocabulary';\nimport type { UiPaletteColor, UiTheme } from '../../../tokens/theme';\n\n/**\n * THE NUMBERS BOTH `Button` RENDERERS DRAW WITH.\n *\n * `Button.styles.ts` (web, emotion) and `Button.native.tsx` (React Native)\n * read this one table. The web turns the px into rem and the padding into a\n * shorthand string; native uses the numbers as they are. Neither restates a\n * value, which is what keeps a native `md` button 16px tall of padding and\n * 16px of type exactly like the web one.\n */\nexport interface ButtonSizeMetrics {\n  paddingVertical: number;\n  paddingHorizontal: number;\n  fontSize: number;\n}\n\nexport const BUTTON_SIZES: Record<SizeValue, ButtonSizeMetrics> = {\n  xs: { paddingVertical: 2, paddingHorizontal: 8, fontSize: 12 },\n  sm: { paddingVertical: 6, paddingHorizontal: 12, fontSize: 14 },\n  md: { paddingVertical: 8, paddingHorizontal: 16, fontSize: 16 },\n  lg: { paddingVertical: 10, paddingHorizontal: 20, fontSize: 18 },\n  xl: { paddingVertical: 12, paddingHorizontal: 24, fontSize: 20 },\n};\n\n/** A button that is only an icon is square: uniform padding, no min-width. */\nexport const ICON_ONLY_PADDING: Record<SizeValue, number> = {\n  xs: 2,\n  sm: 5,\n  md: 7,\n  lg: 9,\n  xl: 11,\n};\n\nexport const BUTTON_FONT_WEIGHT = 500;\n/** `theme.spacing(1)`. */\nexport const BUTTON_RADIUS_UNITS = 1;\n/** Between the icon and the label: `theme.spacing(0.5)`. */\nexport const BUTTON_ICON_GAP_UNITS = 0.5;\nexport const BUTTON_SPINNER_SIZE = 16;\n/** MUI's `line-height` for button text. */\nexport const BUTTON_LINE_HEIGHT = 1.75;\n\n/** The wash behind an outline, ghost or text button while it is hovered or pressed. */\nexport const BUTTON_WASH_ALPHA = 0.1;\nexport const GLASS_BACKGROUND_ALPHA = 0.1;\nexport const GLASS_BACKGROUND_ALPHA_PRESSED = 0.2;\nexport const GLASS_BORDER_ALPHA = 0.2;\nexport const GLOW_INNER_ALPHA = 0.6;\nexport const GLOW_OUTER_ALPHA = 0.3;\nexport const GLOW_RADIUS = 20;\nexport const PULSE_ALPHA = 0.3;\nexport const PULSE_DURATION_MS = 2000;\nexport const PULSE_SPREAD = 15;\n\n/**\n * `neutral` has no palette slot of its own in MUI, so `Button.styles.ts` has\n * always drawn it from three greys. Same three greys here.\n */\nexport function buttonPalette(theme: UiTheme, color: ColorValue): UiPaletteColor {\n  if (color === 'neutral') {\n    return {\n      main: theme.palette.grey[700],\n      dark: theme.palette.grey[800],\n      light: theme.palette.grey[500],\n      contrastText: '#fff',\n    };\n  }\n  return theme.palette[color];\n}\n\n/**\n * The label colour for `ghost` and `text`: one step darker than `main` in\n * light mode (lighter in dark), because `main` is chosen to sit UNDER white and\n * is not legible AS text on a tinted surface. See the web `quietInk`.\n */\nexport const quietInk = (theme: UiTheme, palette: UiPaletteColor): string =>\n  theme.mode === 'dark' ? lighten(palette.main, 0.35) : darken(palette.main, 0.3);\n\n/** Gradients run between two related hues; the named colours pick a specific pair. */\nexport function gradientStops(\n  theme: UiTheme,\n  color: ColorValue,\n  palette: UiPaletteColor,\n): [string, string] {\n  switch (color) {\n    case 'primary':\n      return [theme.palette.primary.main, theme.palette.secondary.main];\n    case 'secondary':\n      return [theme.palette.secondary.main, theme.palette.primary.main];\n    case 'success':\n    case 'warning':\n      return [theme.palette[color].light, theme.palette[color].dark];\n    case 'danger':\n      return [theme.palette.danger.light, theme.palette.danger.dark];\n    default:\n      return [palette.main, palette.dark];\n  }\n}\n"],"mappings":"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","names":[]}

package/dist/native/icons.js

@@ -0,0 +1,108 @@
+import {
+  COLOR_VALUES
+} from "./chunks/chunk-5WLOVHKK.js";
+import {
+  resolveTestId
+} from "./chunks/chunk-M4DTJDWU.js";
+import {
+  useUiTheme
+} from "./chunks/chunk-VGBKUL6D.js";
+import "./chunks/chunk-L2UUNK2M.js";
+
+// src/icons/Icon.native.tsx
+import Svg, { Path } from "react-native-svg";
+
+// src/icons/icon-color.ts
+var isColorValue = (color) => COLOR_VALUES.includes(color);
+function iconFill(theme, color, inherit) {
+  if (color === void 0 || color === "inherit") return inherit;
+  if (isColorValue(color)) {
+    return color === "neutral" ? theme.palette.text.secondary : theme.palette[color].main;
+  }
+  return color;
+}
+
+// src/icons/Icon.types.ts
+var ICON_SIZES = {
+  xs: 16,
+  sm: 20,
+  md: 24,
+  lg: 32,
+  xl: 40
+};
+var iconSize = (size) => typeof size === "number" ? size : ICON_SIZES[size ?? "md"];
+
+// src/icons/paths.generated.ts
+var ICON_PATHS = {
+  Add: ["M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6z"],
+  ArrowBack: ["M20 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.41-1.41L7.83 13H20z"],
+  ArrowDownward: ["m20 12-1.41-1.41L13 16.17V4h-2v12.17l-5.58-5.59L4 12l8 8z"],
+  ArrowForward: ["m12 4-1.41 1.41L16.17 11H4v2h12.17l-5.58 5.59L12 20l8-8z"],
+  ArrowUpward: ["m4 12 1.41 1.41L11 7.83V20h2V7.83l5.58 5.59L20 12l-8-8z"],
+  Check: ["M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"],
+  CheckCircle: ["M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2m-2 15-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8z"],
+  ChevronLeft: ["M15.41 7.41 14 6l-6 6 6 6 1.41-1.41L10.83 12z"],
+  ChevronRight: ["M10 6 8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"],
+  Close: ["M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"],
+  ContentCopy: ["M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2m0 16H8V7h11z"],
+  Delete: ["M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6zM19 4h-3.5l-1-1h-5l-1 1H5v2h14z"],
+  Edit: ["M3 17.25V21h3.75L17.81 9.94l-3.75-3.75zM20.71 7.04c.39-.39.39-1.02 0-1.41l-2.34-2.34a.996.996 0 0 0-1.41 0l-1.83 1.83 3.75 3.75z"],
+  Error: ["M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2m1 15h-2v-2h2zm0-4h-2V7h2z"],
+  ErrorOutline: ["M11 15h2v2h-2zm0-8h2v6h-2zm.99-5C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2M12 20c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8"],
+  ExpandLess: ["m12 8-6 6 1.41 1.41L12 10.83l4.59 4.58L18 14z"],
+  ExpandMore: ["M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6z"],
+  FilterList: ["M10 18h4v-2h-4zM3 6v2h18V6zm3 7h12v-2H6z"],
+  Info: ["M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2m1 15h-2v-6h2zm0-8h-2V7h2z"],
+  InfoOutlined: ["M11 7h2v2h-2zm0 4h2v6h-2zm1-9C6.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"],
+  KeyboardArrowDown: ["M7.41 8.59 12 13.17l4.59-4.58L18 10l-6 6-6-6z"],
+  KeyboardArrowUp: ["M7.41 15.41 12 10.83l4.59 4.58L18 14l-6-6-6 6z"],
+  Menu: ["M3 18h18v-2H3zm0-5h18v-2H3zm0-7v2h18V6z"],
+  MoreHoriz: ["M6 10c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2m12 0c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2m-6 0c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2"],
+  MoreVert: ["M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2m0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2m0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2"],
+  NavigateBefore: ["M15.41 7.41 14 6l-6 6 6 6 1.41-1.41L10.83 12z"],
+  NavigateNext: ["M10 6 8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"],
+  Person: ["M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4m0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4"],
+  Refresh: ["M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4z"],
+  Remove: ["M19 13H5v-2h14z"],
+  Save: ["M17 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V7zm-5 16c-1.66 0-3-1.34-3-3s1.34-3 3-3 3 1.34 3 3-1.34 3-3 3m3-10H5V5h10z"],
+  Search: ["M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19zm-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"],
+  Settings: ["M19.14 12.94c.04-.3.06-.61.06-.94 0-.32-.02-.64-.07-.94l2.03-1.58c.18-.14.23-.41.12-.61l-1.92-3.32c-.12-.22-.37-.29-.59-.22l-2.39.96c-.5-.38-1.03-.7-1.62-.94l-.36-2.54c-.04-.24-.24-.41-.48-.41h-3.84c-.24 0-.43.17-.47.41l-.36 2.54c-.59.24-1.13.57-1.62.94l-2.39-.96c-.22-.08-.47 0-.59.22L2.74 8.87c-.12.21-.08.47.12.61l2.03 1.58c-.05.3-.09.63-.09.94s.02.64.07.94l-2.03 1.58c-.18.14-.23.41-.12.61l1.92 3.32c.12.22.37.29.59.22l2.39-.96c.5.38 1.03.7 1.62.94l.36 2.54c.05.24.24.41.48.41h3.84c.24 0 .44-.17.47-.41l.36-2.54c.59-.24 1.13-.56 1.62-.94l2.39.96c.22.08.47 0 .59-.22l1.92-3.32c.12-.22.07-.47-.12-.61zM12 15.6c-1.98 0-3.6-1.62-3.6-3.6s1.62-3.6 3.6-3.6 3.6 1.62 3.6 3.6-1.62 3.6-3.6 3.6"],
+  Visibility: ["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"],
+  VisibilityOff: ["M12 7c2.76 0 5 2.24 5 5 0 .65-.13 1.26-.36 1.83l2.92 2.92c1.51-1.26 2.7-2.89 3.43-4.75-1.73-4.39-6-7.5-11-7.5-1.4 0-2.74.25-3.98.7l2.16 2.16C10.74 7.13 11.35 7 12 7M2 4.27l2.28 2.28.46.46C3.08 8.3 1.78 10.02 1 12c1.73 4.39 6 7.5 11 7.5 1.55 0 3.03-.3 4.38-.84l.42.42L19.73 22 21 20.73 3.27 3zM7.53 9.8l1.55 1.55c-.05.21-.08.43-.08.65 0 1.66 1.34 3 3 3 .22 0 .44-.03.65-.08l1.55 1.55c-.67.33-1.41.53-2.2.53-2.76 0-5-2.24-5-5 0-.79.2-1.53.53-2.2m4.31-.78 3.15 3.15.02-.16c0-1.66-1.34-3-3-3z"],
+  Warning: ["M1 21h22L12 2zm12-3h-2v-2h2zm0-4h-2v-4h2z"],
+  WarningAmber: ["M12 5.99 19.53 19H4.47zM12 2 1 21h22z", "M13 16h-2v2h2zm0-6h-2v5h2z"]
+};
+var ICON_NAMES = Object.keys(ICON_PATHS);
+
+// src/icons/Icon.native.tsx
+import { jsx } from "react/jsx-runtime";
+function Icon({ name, size, color, label, style, ...rest }) {
+  const theme = useUiTheme();
+  const px = iconSize(size);
+  const fill = iconFill(theme, color, theme.palette.text.primary);
+  const testId = resolveTestId(rest, `icon-${name}`);
+  return /* @__PURE__ */ jsx(
+    Svg,
+    {
+      width: px,
+      height: px,
+      viewBox: "0 0 24 24",
+      fill,
+      style,
+      testID: testId,
+      role: "img",
+      "aria-label": label,
+      "aria-hidden": !label,
+      children: ICON_PATHS[name].map((d) => /* @__PURE__ */ jsx(Path, { d, fill }, d))
+    }
+  );
+}
+Icon.displayName = "Icon";
+export {
+  ICON_NAMES,
+  ICON_PATHS,
+  ICON_SIZES,
+  Icon,
+  iconSize
+};
+//# sourceMappingURL=icons.js.map

package/dist/native/icons.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/icons/Icon.native.tsx","../../src/icons/icon-color.ts","../../src/icons/Icon.types.ts","../../src/icons/paths.generated.ts"],"sourcesContent":["import * as React from 'react';\nimport type { StyleProp, ViewStyle } from 'react-native';\nimport Svg, { Path } from 'react-native-svg';\n\nimport { iconFill } from './icon-color';\nimport { iconSize, type IconBaseProps } from './Icon.types';\nimport { ICON_PATHS } from './paths.generated';\nimport { resolveTestId } from '../platform/test-id';\nimport { useUiTheme } from '../provider/use-ui-theme.native';\n\nexport interface IconProps extends IconBaseProps {\n  style?: StyleProp<ViewStyle>;\n}\n\n/**\n * The native `Icon`: `react-native-svg` drawing the same generated path the web\n * `SvgIcon` draws, in the same 24-unit box, at the same px size.\n */\nexport function Icon({ name, size, color, label, style, ...rest }: IconProps): React.JSX.Element {\n  const theme = useUiTheme();\n  const px = iconSize(size);\n  const fill = iconFill(theme, color, theme.palette.text.primary);\n  const testId = resolveTestId(rest, `icon-${name}`);\n\n  return (\n    <Svg\n      width={px}\n      height={px}\n      viewBox=\"0 0 24 24\"\n      fill={fill}\n      style={style}\n      testID={testId}\n      role=\"img\"\n      aria-label={label}\n      aria-hidden={!label}\n    >\n      {ICON_PATHS[name].map((d) => (\n        <Path key={d} d={d} fill={fill} />\n      ))}\n    </Svg>\n  );\n}\n\nIcon.displayName = 'Icon';\n","import { COLOR_VALUES, type ColorValue } from '../tokens/vocabulary';\nimport type { UiTheme } from '../tokens/theme';\n\nconst isColorValue = (color: string): color is ColorValue =>\n  (COLOR_VALUES as readonly string[]).includes(color);\n\n/**\n * The fill for an icon's `color` prop, on either renderer.\n *\n * A house colour resolves to the palette slot's `main`; `inherit` is the\n * caller's problem (the web passes `currentColor`, native the text colour); any\n * other string is taken as a CSS colour and passed through.\n */\nexport function iconFill(theme: UiTheme, color: string | undefined, inherit: string): string {\n  if (color === undefined || color === 'inherit') return inherit;\n  if (isColorValue(color)) {\n    return color === 'neutral' ? theme.palette.text.secondary : theme.palette[color].main;\n  }\n  return color;\n}\n","import type { IconName } from './paths.generated';\nimport type { ColorValue, SizeValue } from '../tokens/vocabulary';\n\nexport type { IconName };\n\n/**\n * The glyph sizes, in px. `md` is MUI's `SvgIcon` default (24) and `sm` its\n * `small` (20); the rest continue the house scale in 4px steps either side.\n */\nexport const ICON_SIZES: Record<SizeValue, number> = {\n  xs: 16,\n  sm: 20,\n  md: 24,\n  lg: 32,\n  xl: 40,\n};\n\nexport interface IconBaseProps {\n  /** Which glyph. The list is `src/icons/glyphs.json`; both renderers draw the same paths. */\n  name: IconName;\n  /** A step of the house scale, or an exact px size. */\n  size?: SizeValue | number;\n  /**\n   * A house colour, `inherit` (the surrounding text's colour on the web, the\n   * theme's primary text on native, which has no `currentColor`), or any CSS\n   * colour string.\n   */\n  color?: ColorValue | 'inherit' | string;\n  /**\n   * The name a screen reader gives the glyph. Omit for a decorative icon: it\n   * is then hidden from assistive technology on both renderers.\n   */\n  label?: string;\n  testID?: string;\n  dataTestId?: string;\n}\n\n/** The px size for either spelling of `size`. */\nexport const iconSize = (size: SizeValue | number | undefined): number =>\n  typeof size === 'number' ? size : ICON_SIZES[size ?? 'md'];\n","// GENERATED by scripts/generate-icon-paths.mjs from src/icons/glyphs.json.\n// Do not edit: run `pnpm icons:generate`; `pnpm icons:check` fails CI on drift.\n//\n// Each entry is the `d` of every <path> in the matching @mui/icons-material\n// module, in a 24x24 viewBox — the SAME geometry the web renders through\n// SvgIcon, so the native Icon draws the identical glyph.\n\n/** Path data per glyph, in a 0 0 24 24 viewBox. */\nexport const ICON_PATHS = {\n  Add: [\"M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6z\"],\n  ArrowBack: [\"M20 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.41-1.41L7.83 13H20z\"],\n  ArrowDownward: [\"m20 12-1.41-1.41L13 16.17V4h-2v12.17l-5.58-5.59L4 12l8 8z\"],\n  ArrowForward: [\"m12 4-1.41 1.41L16.17 11H4v2h12.17l-5.58 5.59L12 20l8-8z\"],\n  ArrowUpward: [\"m4 12 1.41 1.41L11 7.83V20h2V7.83l5.58 5.59L20 12l-8-8z\"],\n  Check: [\"M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z\"],\n  CheckCircle: [\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2m-2 15-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8z\"],\n  ChevronLeft: [\"M15.41 7.41 14 6l-6 6 6 6 1.41-1.41L10.83 12z\"],\n  ChevronRight: [\"M10 6 8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z\"],\n  Close: [\"M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z\"],\n  ContentCopy: [\"M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2m0 16H8V7h11z\"],\n  Delete: [\"M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6zM19 4h-3.5l-1-1h-5l-1 1H5v2h14z\"],\n  Edit: [\"M3 17.25V21h3.75L17.81 9.94l-3.75-3.75zM20.71 7.04c.39-.39.39-1.02 0-1.41l-2.34-2.34a.996.996 0 0 0-1.41 0l-1.83 1.83 3.75 3.75z\"],\n  Error: [\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2m1 15h-2v-2h2zm0-4h-2V7h2z\"],\n  ErrorOutline: [\"M11 15h2v2h-2zm0-8h2v6h-2zm.99-5C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2M12 20c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8\"],\n  ExpandLess: [\"m12 8-6 6 1.41 1.41L12 10.83l4.59 4.58L18 14z\"],\n  ExpandMore: [\"M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6z\"],\n  FilterList: [\"M10 18h4v-2h-4zM3 6v2h18V6zm3 7h12v-2H6z\"],\n  Info: [\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2m1 15h-2v-6h2zm0-8h-2V7h2z\"],\n  InfoOutlined: [\"M11 7h2v2h-2zm0 4h2v6h-2zm1-9C6.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\"],\n  KeyboardArrowDown: [\"M7.41 8.59 12 13.17l4.59-4.58L18 10l-6 6-6-6z\"],\n  KeyboardArrowUp: [\"M7.41 15.41 12 10.83l4.59 4.58L18 14l-6-6-6 6z\"],\n  Menu: [\"M3 18h18v-2H3zm0-5h18v-2H3zm0-7v2h18V6z\"],\n  MoreHoriz: [\"M6 10c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2m12 0c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2m-6 0c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2\"],\n  MoreVert: [\"M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2m0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2m0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2\"],\n  NavigateBefore: [\"M15.41 7.41 14 6l-6 6 6 6 1.41-1.41L10.83 12z\"],\n  NavigateNext: [\"M10 6 8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z\"],\n  Person: [\"M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4m0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4\"],\n  Refresh: [\"M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4z\"],\n  Remove: [\"M19 13H5v-2h14z\"],\n  Save: [\"M17 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V7zm-5 16c-1.66 0-3-1.34-3-3s1.34-3 3-3 3 1.34 3 3-1.34 3-3 3m3-10H5V5h10z\"],\n  Search: [\"M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19zm-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\"],\n  Settings: [\"M19.14 12.94c.04-.3.06-.61.06-.94 0-.32-.02-.64-.07-.94l2.03-1.58c.18-.14.23-.41.12-.61l-1.92-3.32c-.12-.22-.37-.29-.59-.22l-2.39.96c-.5-.38-1.03-.7-1.62-.94l-.36-2.54c-.04-.24-.24-.41-.48-.41h-3.84c-.24 0-.43.17-.47.41l-.36 2.54c-.59.24-1.13.57-1.62.94l-2.39-.96c-.22-.08-.47 0-.59.22L2.74 8.87c-.12.21-.08.47.12.61l2.03 1.58c-.05.3-.09.63-.09.94s.02.64.07.94l-2.03 1.58c-.18.14-.23.41-.12.61l1.92 3.32c.12.22.37.29.59.22l2.39-.96c.5.38 1.03.7 1.62.94l.36 2.54c.05.24.24.41.48.41h3.84c.24 0 .44-.17.47-.41l.36-2.54c.59-.24 1.13-.56 1.62-.94l2.39.96c.22.08.47 0 .59-.22l1.92-3.32c.12-.22.07-.47-.12-.61zM12 15.6c-1.98 0-3.6-1.62-3.6-3.6s1.62-3.6 3.6-3.6 3.6 1.62 3.6 3.6-1.62 3.6-3.6 3.6\"],\n  Visibility: [\"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\"],\n  VisibilityOff: [\"M12 7c2.76 0 5 2.24 5 5 0 .65-.13 1.26-.36 1.83l2.92 2.92c1.51-1.26 2.7-2.89 3.43-4.75-1.73-4.39-6-7.5-11-7.5-1.4 0-2.74.25-3.98.7l2.16 2.16C10.74 7.13 11.35 7 12 7M2 4.27l2.28 2.28.46.46C3.08 8.3 1.78 10.02 1 12c1.73 4.39 6 7.5 11 7.5 1.55 0 3.03-.3 4.38-.84l.42.42L19.73 22 21 20.73 3.27 3zM7.53 9.8l1.55 1.55c-.05.21-.08.43-.08.65 0 1.66 1.34 3 3 3 .22 0 .44-.03.65-.08l1.55 1.55c-.67.33-1.41.53-2.2.53-2.76 0-5-2.24-5-5 0-.79.2-1.53.53-2.2m4.31-.78 3.15 3.15.02-.16c0-1.66-1.34-3-3-3z\"],\n  Warning: [\"M1 21h22L12 2zm12-3h-2v-2h2zm0-4h-2v-4h2z\"],\n  WarningAmber: [\"M12 5.99 19.53 19H4.47zM12 2 1 21h22z\",\"M13 16h-2v2h2zm0-6h-2v5h2z\"],\n} as const;\n\nexport type IconName = keyof typeof ICON_PATHS;\n\nexport const ICON_NAMES = Object.keys(ICON_PATHS) as readonly IconName[];\n"],"mappings":"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","names":[]}

package/dist/native/layout/Box.js

@@ -0,0 +1,12 @@
+import {
+  Box,
+  resolveBoxLayout
+} from "../chunks/chunk-QZ233LRH.js";
+import "../chunks/chunk-M4DTJDWU.js";
+import "../chunks/chunk-VGBKUL6D.js";
+import "../chunks/chunk-L2UUNK2M.js";
+export {
+  Box,
+  resolveBoxLayout
+};
+//# sourceMappingURL=Box.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/native/layout/Stack.js

@@ -0,0 +1,30 @@
+import {
+  Box
+} from "../chunks/chunk-QZ233LRH.js";
+import "../chunks/chunk-M4DTJDWU.js";
+import "../chunks/chunk-VGBKUL6D.js";
+import "../chunks/chunk-L2UUNK2M.js";
+
+// src/components/layout/Stack/Stack.native.tsx
+import * as React2 from "react";
+
+// src/components/layout/Stack/with-dividers.ts
+import * as React from "react";
+function withDividers(children, divider) {
+  if (divider === void 0 || divider === null) return children;
+  const items = React.Children.toArray(children);
+  return items.flatMap(
+    (child, index) => index === 0 ? [child] : [React.createElement(React.Fragment, { key: `divider-${index}` }, divider), child]
+  );
+}
+
+// src/components/layout/Stack/Stack.native.tsx
+import { jsx } from "react/jsx-runtime";
+var Stack = React2.forwardRef(
+  ({ direction = "column", gap = 0, divider, children, ...rest }, ref) => /* @__PURE__ */ jsx(Box, { ref, direction, gap, ...rest, children: withDividers(children, divider) })
+);
+Stack.displayName = "Stack";
+export {
+  Stack
+};
+//# sourceMappingURL=Stack.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/layout/Stack/Stack.native.tsx","../../../src/components/layout/Stack/with-dividers.ts"],"sourcesContent":["import * as React from 'react';\nimport type { View } from 'react-native';\n\nimport type { StackProps } from './Stack.types.native';\nimport { withDividers } from './with-dividers';\nimport { Box } from '../Box/Box.native';\n\nexport const Stack = React.forwardRef<View, StackProps>(\n  ({ direction = 'column', gap = 0, divider, children, ...rest }, ref) => (\n    <Box ref={ref} direction={direction} gap={gap} {...rest}>\n      {withDividers(children, divider)}\n    </Box>\n  ),\n);\n\nStack.displayName = 'Stack';\n","import * as React from 'react';\n\n/** The children with `divider` cloned between each adjacent pair. */\nexport function withDividers(\n  children: React.ReactNode,\n  divider: React.ReactNode | undefined,\n): React.ReactNode {\n  if (divider === undefined || divider === null) return children;\n  const items = React.Children.toArray(children);\n  return items.flatMap((child, index) =>\n    index === 0\n      ? [child]\n      : [React.createElement(React.Fragment, { key: `divider-${index}` }, divider), child],\n  );\n}\n"],"mappings":";;;;;;;;AAAA,YAAYA,YAAW;;;ACAvB,YAAY,WAAW;AAGhB,SAAS,aACd,UACA,SACiB;AACjB,MAAI,YAAY,UAAa,YAAY,KAAM,QAAO;AACtD,QAAM,QAAc,eAAS,QAAQ,QAAQ;AAC7C,SAAO,MAAM;AAAA,IAAQ,CAAC,OAAO,UAC3B,UAAU,IACN,CAAC,KAAK,IACN,CAAO,oBAAoB,gBAAU,EAAE,KAAK,WAAW,KAAK,GAAG,GAAG,OAAO,GAAG,KAAK;AAAA,EACvF;AACF;;;ADLI;AAFG,IAAM,QAAc;AAAA,EACzB,CAAC,EAAE,YAAY,UAAU,MAAM,GAAG,SAAS,UAAU,GAAG,KAAK,GAAG,QAC9D,oBAAC,OAAI,KAAU,WAAsB,KAAW,GAAG,MAChD,uBAAa,UAAU,OAAO,GACjC;AAEJ;AAEA,MAAM,cAAc;","names":["React"]}

package/dist/native/provider.js

@@ -0,0 +1,26 @@
+import {
+  UiThemeContext,
+  useUiTheme
+} from "./chunks/chunk-VGBKUL6D.js";
+import {
+  createUiTheme
+} from "./chunks/chunk-L2UUNK2M.js";
+
+// src/provider/UiProvider.native.tsx
+import * as React from "react";
+
+// src/provider/UiProvider.types.ts
+var isUiTheme = (theme) => theme !== void 0 && "palette" in theme && "spacing" in theme && typeof theme.spacing === "function";
+
+// src/provider/UiProvider.native.tsx
+import { jsx } from "react/jsx-runtime";
+function UiProvider({ theme, children }) {
+  const ui = React.useMemo(() => isUiTheme(theme) ? theme : createUiTheme(theme), [theme]);
+  return /* @__PURE__ */ jsx(UiThemeContext.Provider, { value: ui, children });
+}
+UiProvider.displayName = "UiProvider";
+export {
+  UiProvider,
+  useUiTheme
+};
+//# sourceMappingURL=provider.js.map

package/dist/native/provider.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/provider/UiProvider.native.tsx","../../src/provider/UiProvider.types.ts"],"sourcesContent":["import * as React from 'react';\n\nimport { UiThemeContext } from './ui-theme-context';\nimport { isUiTheme, type UiProviderProps } from './UiProvider.types';\nimport { createUiTheme } from '../tokens/theme';\n\n/** The native `UiProvider`: the theme every native component reads. */\nexport function UiProvider({ theme, children }: UiProviderProps): React.JSX.Element {\n  const ui = React.useMemo(() => (isUiTheme(theme) ? theme : createUiTheme(theme)), [theme]);\n  return <UiThemeContext.Provider value={ui}>{children}</UiThemeContext.Provider>;\n}\n\nUiProvider.displayName = 'UiProvider';\n","import type * as React from 'react';\n\nimport type { UiTheme, UiThemeOptions } from '../tokens/theme';\n\nexport interface UiProviderProps {\n  /**\n   * A built `UiTheme`, or the options to build one. Omit for the package\n   * default: the platform's light theme.\n   */\n  theme?: UiTheme | UiThemeOptions;\n  children: React.ReactNode;\n}\n\n/**\n * Options may carry a `palette` too (the seeds), so the discriminant is the\n * one thing only a BUILT theme has: `spacing` as a function. Options carry a\n * numeric `spacingUnit` instead.\n */\nexport const isUiTheme = (theme: UiTheme | UiThemeOptions | undefined): theme is UiTheme =>\n  theme !== undefined && 'palette' in theme && 'spacing' in theme && typeof theme.spacing === 'function';\n"],"mappings":";;;;;;;;;AAAA,YAAY,WAAW;;;ACkBhB,IAAM,YAAY,CAAC,UACxB,UAAU,UAAa,aAAa,SAAS,aAAa,SAAS,OAAO,MAAM,YAAY;;;ADVrF;AAFF,SAAS,WAAW,EAAE,OAAO,SAAS,GAAuC;AAClF,QAAM,KAAW,cAAQ,MAAO,UAAU,KAAK,IAAI,QAAQ,cAAc,KAAK,GAAI,CAAC,KAAK,CAAC;AACzF,SAAO,oBAAC,eAAe,UAAf,EAAwB,OAAO,IAAK,UAAS;AACvD;AAEA,WAAW,cAAc;","names":[]}