@q9labsai/chalk-react-native 4.1.17 → 5.0.1

package/dist/chunk-OIBT2FNM.js

@@ -0,0 +1,1479 @@
+import {
+  useMeasuredRef
+} from "./chunk-GYVZSOGQ.js";
+
+// src/frame/device-layout.tsx
+import { createContext, useContext, useMemo } from "react";
+import { useWindowDimensions } from "react-native";
+import { useSafeAreaInsets } from "react-native-safe-area-context";
+
+// src/frame/regions.ts
+function arrangementFor(width, height) {
+  return width > height ? "landscape" : "portrait";
+}
+var STAGE_GAP = 8;
+function frameRegions(arrangement, width, height, insets, cardOpen = false) {
+  const { top, bottom, left, right } = insets;
+  if (arrangement === "portrait") {
+    const headerHeight = 52;
+    const dockHeight = 52;
+    const dockBottom = bottom + 8 + 6;
+    const stageTop2 = top + headerHeight;
+    return {
+      header: { x: left, y: top, width: width - left - right, height: headerHeight },
+      stage: { x: left + STAGE_GAP, y: stageTop2, width: width - left - right - 2 * STAGE_GAP, height: height - stageTop2 - (bottom + 8 + dockHeight + 14) - 8 },
+      dock: { x: left, y: height - dockBottom - dockHeight, width: width - left - right, height: dockHeight }
+    };
+  }
+  if (arrangement === "landscape") {
+    const dockHeight = 52;
+    const topEdge = top + 8;
+    return {
+      header: { x: left, y: topEdge, width: width - left - right, height: 44 },
+      stage: { x: left + STAGE_GAP, y: topEdge, width: width - left - right - 2 * STAGE_GAP, height: height - topEdge - bottom - 4 },
+      dock: { x: left, y: height - (bottom + 6) - dockHeight, width: width - left - right, height: dockHeight }
+    };
+  }
+  const stageTop = top + 60;
+  return {
+    header: { x: 0, y: top, width, height: 60 },
+    stage: { x: 16, y: stageTop, width: width - 32 - (cardOpen ? 352 : 0), height: height - stageTop - (bottom + 16 + 44 + 16) },
+    dock: { x: 0, y: height - (bottom + 16) - 44, width, height: 44 }
+  };
+}
+
+// src/frame/device-layout.tsx
+import { jsx } from "react/jsx-runtime";
+var DeviceLayoutContext = createContext(null);
+function DeviceLayoutProvider({ children }) {
+  const { width, height } = useWindowDimensions();
+  const insets = useSafeAreaInsets();
+  const value = useMemo(() => {
+    const arrangement = arrangementFor(width, height);
+    return { arrangement, phone: arrangement !== "pad", width, height, insets };
+  }, [height, insets, width]);
+  return /* @__PURE__ */ jsx(DeviceLayoutContext.Provider, { value, children });
+}
+function useDeviceLayout() {
+  const layout = useContext(DeviceLayoutContext);
+  if (!layout) throw new Error("Chalk primitives must be rendered inside <Chalk>.");
+  return layout;
+}
+
+// src/theme/tokens.ts
+import { Easing } from "react-native-reanimated";
+var dark = {
+  canvas: "#0B0C0E",
+  surface: "#151619",
+  tile: "#151619",
+  raised: "#1D1F23",
+  popover: "#1D1F23",
+  hover: "#272A2F",
+  pressed: "#30333A",
+  line: "rgba(255,255,255,0.08)",
+  lineStrong: "rgba(255,255,255,0.14)",
+  text: "#ECECEE",
+  textStrong: "#FFFFFF",
+  textSoft: "#C4C6CC",
+  textMuted: "#9A9CA3",
+  focus: "#ECECEE",
+  danger: "#E5484D",
+  dangerPressed: "#C93D42",
+  dangerText: "#FF6B6B",
+  success: "#80B879",
+  warning: "#D9B641",
+  info: "#55AAC9"
+};
+var light = {
+  canvas: "#F3F3F5",
+  surface: "#FFFFFF",
+  tile: "#E2E2E7",
+  raised: "#ECECF0",
+  popover: "#FFFFFF",
+  hover: "#E1E1E6",
+  pressed: "#D3D3D9",
+  line: "rgba(0,0,0,0.09)",
+  lineStrong: "rgba(0,0,0,0.15)",
+  text: "#18181B",
+  textStrong: "#000000",
+  textSoft: "#3D3E45",
+  textMuted: "#5C5D65",
+  focus: "#18181B",
+  danger: "#D93A3F",
+  dangerPressed: "#C93D42",
+  dangerText: "#BF272C",
+  success: "#2B8A3E",
+  warning: "#8A6400",
+  info: "#1B70A0"
+};
+var palettes = { dark, light };
+var fixed = {
+  overlay: "rgba(12,14,18,0.75)",
+  overlayStrong: "rgba(12,14,18,0.82)",
+  overlayPressed: "rgba(40,42,48,0.95)",
+  overlayText: "#FFFFFF",
+  overlayDanger: "#FF6B6B",
+  overlayWarning: "#E2BD3A",
+  onDanger: "#FFFFFF",
+  hand: "#DCB740",
+  handText: "#16140C",
+  scrim: "rgba(0,0,0,0.55)",
+  liveRing: "rgba(255,255,255,0.9)",
+  liveRingShade: "rgba(0,0,0,0.35)",
+  switchKnob: "#FFFFFF",
+  /** QR codes stay black on white in both themes so every camera reads them. */
+  qrLight: "#FFFFFF",
+  qrDark: "#000000",
+  shadow: "#000000",
+  transparent: "transparent",
+  /** The selected segment of a compact segmented control. */
+  segmentShadow: "0px 1px 2px rgba(0,0,0,0.2)"
+};
+var fileKindColors = { pdf: "#C42B2B", doc: "#2F5FB3", xls: "#1E7A46", ppt: "#B8481E", other: "#5C5D65" };
+var chatOverlays = { photoMore: "rgba(0,0,0,0.5)", uploading: "rgba(0,0,0,0.45)", ring: "#FFFFFF" };
+var viewer = {
+  backdrop: "rgba(8,8,10,0.94)",
+  text: "#ECECEE",
+  textMuted: "#A1A2A9",
+  button: "rgba(255,255,255,0.08)",
+  buttonPressed: "rgba(255,255,255,0.16)"
+};
+var identityColors = ["#315F72", "#5C6650", "#6B5B4F", "#64576B", "#49645D", "#665D42", "#4D5D73", "#6D5158"];
+var elevations = {
+  dark: { popover: "0px 12px 32px rgba(0,0,0,0.5)", toast: "0px 8px 24px rgba(0,0,0,0.4)", floatTile: "0px 0px 0px 1px rgba(255,255,255,0.14), 0px 6px 18px rgba(0,0,0,0.5)", ringOnCanvas: false },
+  light: { popover: "0px 0px 0px 1px rgba(0,0,0,0.09), 0px 12px 32px rgba(0,0,0,0.12)", toast: "0px 0px 0px 1px rgba(0,0,0,0.09), 0px 12px 32px rgba(0,0,0,0.12)", floatTile: "0px 0px 0px 1px rgba(0,0,0,0.15), 0px 6px 18px rgba(0,0,0,0.5)", ringOnCanvas: true }
+};
+var fontFamilies = {
+  400: "Figtree-Regular",
+  500: "Figtree-Medium",
+  600: "Figtree-SemiBold",
+  700: "Figtree-Bold"
+};
+var LINE_HEIGHT = 1.4;
+function textStyle(fontSize, weight) {
+  return { fontFamily: fontFamilies[weight], fontSize, lineHeight: fontSize * LINE_HEIGHT };
+}
+var type = {
+  statusTitle: textStyle(22, 600),
+  limboTitle: textStyle(20, 600),
+  progress: textStyle(17, 600),
+  sheetTitle: textStyle(16, 600),
+  phoneRow: textStyle(16, 400),
+  cardTitle: textStyle(15, 600),
+  wideButton: textStyle(15, 600),
+  body: textStyle(14, 400),
+  bodyMedium: textStyle(14, 500),
+  bodyStrong: textStyle(14, 600),
+  button: textStyle(13, 600),
+  meta: textStyle(13, 400),
+  label: textStyle(12, 500),
+  section: textStyle(12, 600),
+  caption: textStyle(11, 600)
+};
+var radii = {
+  tag: 6,
+  field: 10,
+  menuRow: 9,
+  menu: 12,
+  tile: 12,
+  tilePhone: 14,
+  card: 16,
+  sheet: 24,
+  round: 999
+};
+var sizes = {
+  control: 44,
+  dockPhone: 52,
+  headerButton: 40,
+  menuRow: 40,
+  menuRowPhone: 48,
+  toastMinHeight: 48,
+  handleWidth: 36,
+  handleHeight: 5
+};
+var durations = {
+  press: 150,
+  chromeFade: 250,
+  menu: 180,
+  toastIn: 200,
+  toastOut: 160,
+  card: 200,
+  sheet: 240,
+  scrim: 200,
+  move: 220,
+  enter: 220,
+  leave: 160,
+  copyMorph: 200,
+  copyReset: 2e3,
+  veil: 300,
+  avatarTurn: 300,
+  speakingLevel: 90,
+  landscapeHide: 4e3,
+  toastInfo: 5e3
+};
+var emphasized = Easing.bezier(0.16, 1, 0.3, 1);
+var move = Easing.bezier(0.2, 0.8, 0.2, 1);
+var easeOut = Easing.bezier(0, 0, 0.58, 1);
+var standard = Easing.bezier(0.4, 0, 0.2, 1);
+var easings = { emphasized, move, easeOut, standard, linear: Easing.linear };
+var pressScale = { round: 0.94, pill: 0.97, small: 0.92, big: 0.98 };
+
+// src/theme/theme.tsx
+import { createContext as createContext2, useContext as useContext2 } from "react";
+import { jsx as jsx2 } from "react/jsx-runtime";
+var themes = {
+  dark: { scheme: "dark", colors: palettes.dark, elevation: elevations.dark },
+  light: { scheme: "light", colors: palettes.light, elevation: elevations.light }
+};
+var ThemeContext = createContext2(themes.dark);
+function ThemeProvider({ colorScheme, children }) {
+  return /* @__PURE__ */ jsx2(ThemeContext.Provider, { value: themes[colorScheme], children });
+}
+function useTheme() {
+  return useContext2(ThemeContext);
+}
+
+// src/primitives/ChalkText.tsx
+import { Text } from "react-native";
+import { jsx as jsx3 } from "react/jsx-runtime";
+function ChalkText({ variant = "body", tone = "text", color, tabular = false, style, ...rest }) {
+  const { colors } = useTheme();
+  const textStyle2 = [type[variant], { color: color ?? colors[tone] }, tabular ? TABULAR : null, style];
+  const ref = useMeasuredRef(rest.testID, textStyle2);
+  return /* @__PURE__ */ jsx3(Text, { ...rest, ref, style: textStyle2 });
+}
+var TABULAR = { fontVariant: ["tabular-nums"] };
+
+// src/icons/Icon.tsx
+import { memo } from "react";
+import Svg, { Circle, Path, Rect } from "react-native-svg";
+
+// src/icons/icon-paths.ts
+var iconElements = {
+  mic: [
+    { kind: "rect", x: 9, y: 2, width: 6, height: 12, rx: 3 },
+    { kind: "path", d: "M19 10v1a7 7 0 0 1-14 0v-1M12 18v4" }
+  ],
+  micOff: [{ kind: "path", d: "M2 2l20 20M15 9.3V5a3 3 0 0 0-5.7-1.3M9 9v2a3 3 0 0 0 5.1 2.1M17 17a7 7 0 0 1-12-6v-1M19 10v1a7 7 0 0 1-.1 1.2M12 18v4" }],
+  cam: [
+    { kind: "path", d: "M16 10.5l5-3v9l-5-3z" },
+    { kind: "rect", x: 2, y: 6, width: 14, height: 12, rx: 2 }
+  ],
+  camOff: [{ kind: "path", d: "M2 2l20 20M10.7 6H14a2 2 0 0 1 2 2v3.3l1 1 4-2.8v8M16 16a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h2" }],
+  down: [{ kind: "path", d: "M6 9l6 6 6-6" }],
+  shield: [{ kind: "path", d: "M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z" }],
+  globe: [
+    { kind: "circle", cx: 12, cy: 12, r: 9 },
+    { kind: "path", d: "M3 12h18M12 3a14 14 0 0 1 0 18M12 3a14 14 0 0 0 0 18" }
+  ],
+  pause: [{ kind: "path", d: "M9 5v14M15 5v14", strokeWidth: 2.5 }],
+  shareOff: [
+    { kind: "rect", x: 2, y: 3, width: 20, height: 14, rx: 2 },
+    { kind: "path", d: "M8 21h8M12 17v4M9.5 7.5l5 5M14.5 7.5l-5 5" }
+  ],
+  monitor: [
+    { kind: "rect", x: 2, y: 3, width: 20, height: 14, rx: 2 },
+    { kind: "path", d: "M8 21h8M12 17v4" }
+  ],
+  appwin: [
+    { kind: "rect", x: 3, y: 4, width: 18, height: 16, rx: 2 },
+    { kind: "path", d: "M3 9h18M6.5 6.5h.01M9 6.5h.01" }
+  ],
+  tabi: [
+    { kind: "path", d: "M3 20V7a2 2 0 0 1 2-2h5l2 3h7a2 2 0 0 1 2 2v10z" },
+    { kind: "path", d: "M3 11h18" }
+  ],
+  swap: [{ kind: "path", d: "M17 3l4 4-4 4M21 7H9M7 21l-4-4 4-4M3 17h12" }],
+  fill: [
+    { kind: "rect", x: 3, y: 5, width: 18, height: 14, rx: 2 },
+    { kind: "path", d: "M7 12h10M7 12l2.5-2.5M7 12l2.5 2.5M17 12l-2.5-2.5M17 12l-2.5 2.5" }
+  ],
+  fit: [
+    { kind: "rect", x: 3, y: 5, width: 18, height: 14, rx: 2 },
+    { kind: "rect", x: 7.5, y: 9, width: 9, height: 6, rx: 1 }
+  ],
+  zoomIn: [
+    { kind: "circle", cx: 11, cy: 11, r: 7 },
+    { kind: "path", d: "M21 21l-4.3-4.3M8 11h6M11 8v6" }
+  ],
+  zoomOut: [
+    { kind: "circle", cx: 11, cy: 11, r: 7 },
+    { kind: "path", d: "M21 21l-4.3-4.3M8 11h6" }
+  ],
+  pip: [
+    { kind: "rect", x: 2, y: 4, width: 20, height: 16, rx: 2 },
+    { kind: "rect", x: 12, y: 12, width: 7, height: 5, rx: 1, fill: "currentColor" }
+  ],
+  undo: [
+    { kind: "path", d: "M9 14L4 9l5-5" },
+    { kind: "path", d: "M4 9h10.5a5.5 5.5 0 0 1 0 11H11" }
+  ],
+  redo: [
+    { kind: "path", d: "M15 14l5-5-5-5" },
+    { kind: "path", d: "M20 9H9.5a5.5 5.5 0 0 0 0 11H13" }
+  ],
+  vol: [
+    { kind: "path", d: "M11 5L6 9H2v6h4l5 4z" },
+    { kind: "path", d: "M15.5 8.5a5 5 0 0 1 0 7M19 5a10 10 0 0 1 0 14" }
+  ],
+  qr: [
+    { kind: "rect", x: 3, y: 3, width: 7, height: 7, rx: 1.5 },
+    { kind: "rect", x: 14, y: 3, width: 7, height: 7, rx: 1.5 },
+    { kind: "rect", x: 3, y: 14, width: 7, height: 7, rx: 1.5 },
+    { kind: "path", d: "M14 14h3v3M21 14v.01M14 21h3M21 17v4h-1" }
+  ],
+  up2: [{ kind: "path", d: "M18 15l-6-6-6 6" }],
+  right: [{ kind: "path", d: "M9 18l6-6-6-6" }],
+  share: [
+    { kind: "rect", x: 2, y: 3, width: 20, height: 14, rx: 2 },
+    { kind: "path", d: "M8 21h8M12 17v4M9 10l3-3 3 3M12 7v6" }
+  ],
+  smile: [
+    { kind: "circle", cx: 12, cy: 12, r: 9 },
+    { kind: "path", d: "M8.5 14.5s1.3 1.8 3.5 1.8 3.5-1.8 3.5-1.8M9 9.5h.01M15 9.5h.01" }
+  ],
+  pen: [
+    { kind: "path", d: "M17 3a2.85 2.85 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5z" },
+    { kind: "path", d: "M15 5l4 4" }
+  ],
+  rec: [
+    { kind: "circle", cx: 12, cy: 12, r: 9 },
+    { kind: "circle", cx: 12, cy: 12, r: 3.5, fill: "currentColor" }
+  ],
+  max: [{ kind: "path", d: "M8 3H5a2 2 0 0 0-2 2v3M21 8V5a2 2 0 0 0-2-2h-3M3 16v3a2 2 0 0 0 2 2h3M16 21h3a2 2 0 0 0 2-2v-3" }],
+  min: [{ kind: "path", d: "M8 3v3a2 2 0 0 1-2 2H3M21 8h-3a2 2 0 0 1-2-2V3M3 16h3a2 2 0 0 1 2 2v3M16 21v-3a2 2 0 0 1 2-2h3" }],
+  hang: [
+    {
+      kind: "path",
+      transform: "rotate(135 12 12)",
+      d: "M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1 1 .4 1.9.7 2.8a2 2 0 0 1-.5 2.1L8.1 9.9a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.4c.9.3 1.8.6 2.8.7a2 2 0 0 1 1.7 2z"
+    }
+  ],
+  link: [
+    { kind: "path", d: "M10 13a5 5 0 0 0 7.5.5l3-3a5 5 0 0 0-7-7l-1.8 1.7" },
+    { kind: "path", d: "M14 11a5 5 0 0 0-7.5-.5l-3 3a5 5 0 0 0 7 7l1.7-1.7" }
+  ],
+  chat: [{ kind: "path", d: "M7.9 20A9 9 0 1 0 4 16.1L2 22z" }],
+  grid: [
+    { kind: "rect", x: 3, y: 3, width: 7.5, height: 7.5, rx: 1.5 },
+    { kind: "rect", x: 13.5, y: 3, width: 7.5, height: 7.5, rx: 1.5 },
+    { kind: "rect", x: 3, y: 13.5, width: 7.5, height: 7.5, rx: 1.5 },
+    { kind: "rect", x: 13.5, y: 13.5, width: 7.5, height: 7.5, rx: 1.5 }
+  ],
+  spot: [
+    { kind: "rect", x: 3, y: 3, width: 18, height: 12.5, rx: 2 },
+    { kind: "path", d: "M4 20.5h3M10.5 20.5h3M17 20.5h3" }
+  ],
+  more: [{ kind: "path", d: "M5 12h.01M12 12h.01M19 12h.01", strokeWidth: 3 }],
+  x: [{ kind: "path", d: "M18 6L6 18M6 6l12 12" }],
+  clip: [{ kind: "path", d: "M20.5 11.2l-8.4 8.4a5 5 0 0 1-7.1-7.1l8.4-8.4a3.3 3.3 0 0 1 4.7 4.7l-8.4 8.4a1.7 1.7 0 0 1-2.4-2.4l7.7-7.7" }],
+  dl: [{ kind: "path", d: "M12 4v11M7 10.5l5 5 5-5M5 20h14" }],
+  left: [{ kind: "path", d: "M15 18l-6-6 6-6" }],
+  plus: [{ kind: "path", d: "M12 5v14M5 12h14" }],
+  alert: [
+    { kind: "circle", cx: 12, cy: 12, r: 9 },
+    { kind: "path", d: "M12 7.5v5.5M12 16.5v.01" }
+  ],
+  lock: [
+    { kind: "rect", x: 5, y: 11, width: 14, height: 9, rx: 2 },
+    { kind: "path", d: "M8 11V8a4 4 0 0 1 8 0v3" }
+  ],
+  clock: [
+    { kind: "circle", cx: 12, cy: 12, r: 9 },
+    { kind: "path", d: "M12 7v5l3 2" }
+  ],
+  img: [
+    { kind: "rect", x: 3, y: 4, width: 18, height: 16, rx: 2.5 },
+    { kind: "circle", cx: 9, cy: 10, r: 1.8 },
+    { kind: "path", d: "M21 15.5l-4.8-4.8L6 20" }
+  ],
+  smileP: [
+    { kind: "path", d: "M20.9 11a9 9 0 1 1-7.9-7.9" },
+    { kind: "path", d: "M8.5 14.5s1.3 1.8 3.5 1.8 3.5-1.8 3.5-1.8M9 9.5h.01M15 9.5h.01M19 2v6M16 5h6" }
+  ],
+  check: [{ kind: "path", d: "M20 6L9 17l-5-5" }],
+  hand: [
+    { kind: "path", d: "M18 11V6a2 2 0 0 0-4 0v5M14 10V4a2 2 0 0 0-4 0v6M10 10.5V6a2 2 0 0 0-4 0v8" },
+    { kind: "path", d: "M18 8a2 2 0 1 1 4 0v6a8 8 0 0 1-8 8h-2c-2.8 0-4.5-.9-6-2.3l-3.6-3.6a2 2 0 0 1 2.8-2.8L7 15" }
+  ],
+  pin: [{ kind: "path", d: "M12 17v5M9 10.8a2 2 0 0 1-1.1 1.8l-1.8.9A2 2 0 0 0 5 15.2V17h14v-1.8a2 2 0 0 0-1.1-1.8l-1.8-.9a2 2 0 0 1-1.1-1.8V7a1 1 0 0 1 1-1 2 2 0 0 0 0-4H8a2 2 0 0 0 0 4 1 1 0 0 1 1 1z" }],
+  search: [
+    { kind: "circle", cx: 11, cy: 11, r: 7 },
+    { kind: "path", d: "M21 21l-4.3-4.3" }
+  ],
+  up: [{ kind: "path", d: "M12 19V5M5 12l7-7 7 7" }],
+  retry: [
+    { kind: "path", d: "M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8" },
+    { kind: "path", d: "M3 3v5h5" }
+  ],
+  home: [{ kind: "path", d: "M3 10.5L12 3l9 7.5V20a1 1 0 0 1-1 1h-5v-6H9v6H4a1 1 0 0 1-1-1z" }],
+  users: [
+    { kind: "path", d: "M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2" },
+    { kind: "circle", cx: 9, cy: 7, r: 4 },
+    { kind: "path", d: "M22 21v-2a4 4 0 0 0-3-3.9M16 3.1a4 4 0 0 1 0 7.8" }
+  ],
+  pointer: [{ kind: "path", d: "M4 4l7 17 2.5-7.5L21 11z" }],
+  square: [{ kind: "rect", x: 4, y: 4, width: 16, height: 16, rx: 2 }],
+  type: [{ kind: "path", d: "M4 7V4h16v3M9 20h6M12 4v16" }],
+  eraser: [{ kind: "path", d: "M7 21l-4.3-4.3a1 1 0 0 1 0-1.4l10-10a1 1 0 0 1 1.4 0l5.6 5.6a1 1 0 0 1 0 1.4L13 21M22 21H7M5 11l9 9" }],
+  copy: [
+    { kind: "rect", x: 9, y: 9, width: 12, height: 12, rx: 2 },
+    { kind: "path", d: "M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1" }
+  ],
+  edit: [
+    { kind: "path", d: "M12 20h9" },
+    { kind: "path", d: "M16.5 3.5a2.1 2.1 0 0 1 3 3L7 19l-4 1 1-4z" }
+  ],
+  flip: [
+    { kind: "path", d: "M20 12a8 8 0 0 0-14.3-4.9M4 12a8 8 0 0 0 14.3 4.9" },
+    { kind: "path", d: "M5.2 3.2v4.2h4.2M18.8 20.8v-4.2h-4.2" }
+  ],
+  earpiece: [{ kind: "path", d: "M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1 1 .4 1.9.7 2.8a2 2 0 0 1-.5 2.1L8.1 9.9a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.4c.9.3 1.8.6 2.8.7a2 2 0 0 1 1.7 2z" }],
+  buds: [{ kind: "path", d: "M8 3.5A3.5 3.5 0 0 0 4.5 7v1A2.5 2.5 0 0 0 7 10.5h1V20a1.5 1.5 0 0 0 3 0V6.5A3 3 0 0 0 8 3.5zM16 3.5A3.5 3.5 0 0 1 19.5 7v1a2.5 2.5 0 0 1-2.5 2.5h-1V20a1.5 1.5 0 0 1-3 0V6.5a3 3 0 0 1 3-3z" }],
+  iosShare: [
+    { kind: "path", d: "M12 3v12M8 7l4-4 4 4" },
+    { kind: "path", d: "M8 10H6a2 2 0 0 0-2 2v7a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-7a2 2 0 0 0-2-2h-2" }
+  ],
+  paste: [
+    { kind: "rect", x: 8, y: 2, width: 8, height: 4, rx: 1 },
+    { kind: "path", d: "M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2" }
+  ],
+  file: [
+    { kind: "path", d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" },
+    { kind: "path", d: "M14 2v6h6" }
+  ],
+  trash: [{ kind: "path", d: "M3 6h18M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2M19 6l-1 14a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2L5 6" }],
+  moon: [{ kind: "path", d: "M21 12.8A9 9 0 1 1 11.2 3a7 7 0 0 0 9.8 9.8z" }]
+};
+
+// src/icons/Icon.tsx
+import { jsx as jsx4 } from "react/jsx-runtime";
+var Icon = memo(function Icon2({ name, color, size = 20, strokeWidth = 1.75 }) {
+  return /* @__PURE__ */ jsx4(Svg, { accessibilityElementsHidden: true, fill: "none", height: size, importantForAccessibility: "no-hide-descendants", stroke: color, strokeLinecap: "round", strokeLinejoin: "round", strokeWidth, viewBox: "0 0 24 24", width: size, children: iconElements[name].map((element, index) => renderElement(element, index, color)) });
+});
+function renderElement(element, key, color) {
+  const shared = { fill: element.fill === "currentColor" ? color : "none", strokeWidth: element.strokeWidth, transform: element.transform };
+  switch (element.kind) {
+    case "path":
+      return /* @__PURE__ */ jsx4(Path, { ...shared, d: element.d }, key);
+    case "rect":
+      return /* @__PURE__ */ jsx4(Rect, { ...shared, height: element.height, rx: element.rx, width: element.width, x: element.x, y: element.y }, key);
+    case "circle":
+      return /* @__PURE__ */ jsx4(Circle, { ...shared, cx: element.cx, cy: element.cy, r: element.r }, key);
+  }
+}
+
+// src/motion/press.ts
+import { useCallback } from "react";
+import { useAnimatedStyle, useSharedValue, withTiming as withTiming2 } from "react-native-reanimated";
+
+// src/motion/motion.ts
+import { ReduceMotion, useReducedMotion, withTiming } from "react-native-reanimated";
+var timings = {
+  press: { duration: durations.press, easing: easings.easeOut, reduceMotion: ReduceMotion.System },
+  fade: { duration: durations.chromeFade, easing: easings.easeOut, reduceMotion: ReduceMotion.System },
+  menu: { duration: durations.menu, easing: easings.emphasized, reduceMotion: ReduceMotion.System },
+  toastIn: { duration: durations.toastIn, easing: easings.emphasized, reduceMotion: ReduceMotion.System },
+  toastOut: { duration: durations.toastOut, easing: easings.easeOut, reduceMotion: ReduceMotion.System },
+  scrim: { duration: durations.scrim, easing: easings.easeOut, reduceMotion: ReduceMotion.System },
+  sheet: { duration: durations.sheet, easing: easings.emphasized, reduceMotion: ReduceMotion.System },
+  move: { duration: durations.move, easing: easings.move, reduceMotion: ReduceMotion.System },
+  enter: { duration: durations.enter, easing: easings.move, reduceMotion: ReduceMotion.System },
+  leave: { duration: durations.leave, easing: easings.easeOut, reduceMotion: ReduceMotion.System },
+  copyMorph: { duration: durations.copyMorph, easing: easings.emphasized, reduceMotion: ReduceMotion.System },
+  switch: { duration: durations.press, easing: easings.easeOut, reduceMotion: ReduceMotion.System },
+  avatarTurn: { duration: durations.avatarTurn, easing: easings.standard, reduceMotion: ReduceMotion.System },
+  level: { duration: durations.speakingLevel, easing: easings.linear, reduceMotion: ReduceMotion.System }
+};
+
+// src/motion/press.ts
+function usePressAnimation(family) {
+  const down = useSharedValue(0);
+  const scale = useSharedValue(1);
+  const pressedScale = pressScale[family];
+  const onPressIn = useCallback(() => {
+    down.value = 1;
+    scale.value = withTiming2(pressedScale, timings.press);
+  }, [down, pressedScale, scale]);
+  const onPressOut = useCallback(() => {
+    down.value = 0;
+    scale.value = withTiming2(1, timings.press);
+  }, [down, scale]);
+  const scaleStyle = useAnimatedStyle(() => {
+    "worklet";
+    return { transform: [{ scale: scale.value }] };
+  });
+  return { down, onPressIn, onPressOut, scaleStyle };
+}
+
+// src/primitives/IconButton.tsx
+import { forwardRef, memo as memo2 } from "react";
+import { Pressable, StyleSheet, View } from "react-native";
+import Animated, { useAnimatedStyle as useAnimatedStyle2 } from "react-native-reanimated";
+import { jsx as jsx5, jsxs } from "react/jsx-runtime";
+var IconButton = memo2(
+  forwardRef(function IconButton2({ icon, accessibilityLabel, onPress, size = 44, tone = "raised", selected = false, off = false, caption, expanded, onCanvas = false, disabled = false, testID }, ref) {
+    const { colors, elevation } = useTheme();
+    const press = usePressAnimation("round");
+    const base = selected ? colors.text : BASE[tone](colors);
+    const pressedColor = selected ? colors.text : tone === "danger" ? colors.dangerPressed : colors.pressed;
+    const iconColor = selected ? colors.canvas : tone === "danger" ? fixed.onDanger : off ? colors.dangerText : tone === "ghost" ? colors.textMuted : colors.text;
+    const ring = onCanvas && elevation.ringOnCanvas && tone !== "danger";
+    const { down } = press;
+    const roundStyle = [styles.round, { width: size, height: size, borderRadius: size / 2 }, ring ? { boxShadow: `0px 0px 0px 1px ${colors.line}` } : null, disabled ? styles.disabled : null];
+    const roundRef = useMeasuredRef(testID, [roundStyle, { backgroundColor: base }]);
+    const background = useAnimatedStyle2(() => {
+      "worklet";
+      return { backgroundColor: down.value ? pressedColor : base };
+    });
+    return /* @__PURE__ */ jsxs(
+      Pressable,
+      {
+        accessibilityLabel,
+        accessibilityRole: "button",
+        accessibilityState: { selected, disabled, expanded },
+        disabled,
+        hitSlop: size < 44 ? (44 - size) / 2 : void 0,
+        onPress,
+        onPressIn: press.onPressIn,
+        onPressOut: press.onPressOut,
+        ref,
+        testID,
+        children: [
+          /* @__PURE__ */ jsx5(Animated.View, { ref: roundRef, style: [roundStyle, background, press.scaleStyle], children: /* @__PURE__ */ jsx5(Icon, { color: iconColor, name: icon, size: tone === "ghost" ? 18 : 20 }) }),
+          caption ? /* @__PURE__ */ jsx5(View, { pointerEvents: "none", style: styles.captionBox, children: /* @__PURE__ */ jsx5(ChalkText, { numberOfLines: 1, tone: "textMuted", variant: "caption", children: caption }) }) : null
+        ]
+      }
+    );
+  })
+);
+var BASE = {
+  raised: (colors) => colors.raised,
+  surface: (colors) => colors.surface,
+  danger: (colors) => colors.danger,
+  ghost: () => fixed.transparent
+};
+var styles = StyleSheet.create({
+  round: { alignItems: "center", justifyContent: "center" },
+  disabled: { opacity: 0.45 },
+  // `.rl`: absolutely placed so the dock keeps its height; its bottom sits 17 pt below the button.
+  captionBox: { position: "absolute", left: -20, right: -20, bottom: -17, alignItems: "center" }
+});
+
+// src/primitives/PillButton.tsx
+import { forwardRef as forwardRef2, memo as memo3 } from "react";
+import { Pressable as Pressable2, StyleSheet as StyleSheet2 } from "react-native";
+import Animated2 from "react-native-reanimated";
+import { jsx as jsx6, jsxs as jsxs2 } from "react/jsx-runtime";
+var HEIGHT = { sm: 32, md: 36, lg: 40, wide: 48, big: 52, inline: 40, card: 44, field: 48 };
+var PADDING = { sm: 12, md: 14, lg: 14, wide: 14, big: 14, inline: 12, card: 14, field: 18 };
+var TEXT = { sm: "button", md: "button", lg: "bodyStrong", wide: "wideButton", big: "sheetTitle", inline: "button", card: "button", field: "button" };
+var ICON = { sm: 18, md: 18, lg: 18, wide: 18, big: 20, inline: 18, card: 18, field: 18 };
+var PillButton = memo3(
+  forwardRef2(function PillButton2({ label, onPress, variant = "secondary", size = "md", icon, accessibilityLabel, disabled = false, testID }, ref) {
+    const { colors } = useTheme();
+    const press = usePressAnimation(size === "big" ? "big" : "pill");
+    const background = disabled ? colors.hover : variant === "primary" ? colors.text : variant === "danger" ? colors.danger : size === "big" ? colors.raised : colors.hover;
+    const foreground = disabled ? colors.textMuted : variant === "primary" ? colors.canvas : variant === "danger" ? fixed.onDanger : colors.text;
+    const full = size === "wide" || size === "big" || size === "card";
+    return /* @__PURE__ */ jsx6(Pressable2, { accessibilityLabel, accessibilityRole: "button", accessibilityState: { disabled }, disabled, onPress, onPressIn: press.onPressIn, onPressOut: press.onPressOut, ref, style: full ? styles2.full : null, testID, children: /* @__PURE__ */ jsxs2(Animated2.View, { style: [styles2.pill, { height: HEIGHT[size], paddingHorizontal: PADDING[size], backgroundColor: background }, press.scaleStyle], children: [
+      icon ? /* @__PURE__ */ jsx6(Icon, { color: foreground, name: icon, size: ICON[size] }) : null,
+      /* @__PURE__ */ jsx6(ChalkText, { color: foreground, numberOfLines: 1, variant: TEXT[size], children: label })
+    ] }) });
+  })
+);
+var styles2 = StyleSheet2.create({
+  pill: { flexDirection: "row", alignItems: "center", justifyContent: "center", gap: 6, borderRadius: 999 },
+  full: { alignSelf: "stretch" }
+});
+
+// src/primitives/announce.ts
+import { AccessibilityInfo, Platform } from "react-native";
+function announce(message) {
+  if (Platform.OS === "ios") AccessibilityInfo.announceForAccessibilityWithOptions(message, { queue: true });
+  else AccessibilityInfo.announceForAccessibility(message);
+}
+
+// src/primitives/toast/ToastStack.tsx
+import { createContext as createContext4, useContext as useContext4, useMemo as useMemo2, useState as useState2, useSyncExternalStore as useSyncExternalStore2 } from "react";
+import { StyleSheet as StyleSheet4, View as View3 } from "react-native";
+import Animated3, { useReducedMotion as useReducedMotion2, withTiming as withTiming3 } from "react-native-reanimated";
+
+// src/frame/portal.tsx
+import { createContext as createContext3, Fragment, useContext as useContext3, useLayoutEffect, useRef, useState, useSyncExternalStore } from "react";
+import { Fragment as Fragment2, jsx as jsx7 } from "react/jsx-runtime";
+function createPortalStore() {
+  let layers = { sheets: [], menus: [], toasts: [] };
+  const listeners = /* @__PURE__ */ new Set();
+  const publish = (layer, next) => {
+    layers = { ...layers, [layer]: next };
+    for (const listener of listeners) listener();
+  };
+  return {
+    set(layer, key, node) {
+      const current = layers[layer];
+      const index = current.findIndex((entry) => entry.key === key);
+      publish(layer, index < 0 ? [...current, { key, node }] : current.map((entry) => entry.key === key ? { key, node } : entry));
+    },
+    remove(layer, key) {
+      publish(
+        layer,
+        layers[layer].filter((entry) => entry.key !== key)
+      );
+    },
+    subscribe(listener) {
+      listeners.add(listener);
+      return () => listeners.delete(listener);
+    },
+    entries: (layer) => layers[layer]
+  };
+}
+var PortalContext = createContext3(null);
+function PortalProvider({ children }) {
+  const [store] = useState(createPortalStore);
+  return /* @__PURE__ */ jsx7(PortalContext.Provider, { value: store, children });
+}
+function usePortalStore() {
+  const store = useContext3(PortalContext);
+  if (!store) throw new Error("Chalk portals must be rendered inside <Chalk>.");
+  return store;
+}
+var nextKey = 0;
+function Portal({ layer, children }) {
+  const store = usePortalStore();
+  const key = useRef(-1);
+  if (key.current < 0) key.current = nextKey++;
+  useLayoutEffect(() => {
+    store.set(layer, key.current, children);
+  });
+  useLayoutEffect(() => {
+    const own = key.current;
+    return () => store.remove(layer, own);
+  }, [layer, store]);
+  return null;
+}
+function PortalHost({ layer }) {
+  const entries = usePortalEntries(layer);
+  return /* @__PURE__ */ jsx7(Fragment2, { children: entries.map((entry) => /* @__PURE__ */ jsx7(Fragment, { children: entry.node }, entry.key)) });
+}
+function usePortalEntries(layer) {
+  const store = usePortalStore();
+  return useSyncExternalStore(
+    store.subscribe,
+    () => store.entries(layer),
+    () => store.entries(layer)
+  );
+}
+function usePortalCount(layer) {
+  const store = usePortalStore();
+  return useSyncExternalStore(
+    store.subscribe,
+    () => store.entries(layer).length,
+    () => store.entries(layer).length
+  );
+}
+
+// src/primitives/toast/Toast.tsx
+import { memo as memo4 } from "react";
+import { StyleSheet as StyleSheet3, Text as Text2, View as View2 } from "react-native";
+import { jsx as jsx8, jsxs as jsxs3 } from "react/jsx-runtime";
+var Toast = memo4(function Toast2({ toast, onDismiss }) {
+  const { colors, elevation } = useTheme();
+  const parts = typeof toast.message === "string" ? [toast.message] : toast.message;
+  const testID = toast.testID ?? `toast.${toast.id}`;
+  const toastStyle = [styles3.toast, { backgroundColor: colors.popover, borderColor: colors.line, boxShadow: elevation.toast }];
+  const ref = useMeasuredRef(testID, toastStyle);
+  return /* @__PURE__ */ jsxs3(View2, { accessibilityLiveRegion: toast.kind === "error" ? "assertive" : "polite", accessibilityRole: toast.kind === "error" ? "alert" : "summary", ref, style: toastStyle, testID, children: [
+    toast.leading,
+    /* @__PURE__ */ jsx8(ChalkText, { numberOfLines: toast.wrap ? void 0 : 1, style: [styles3.message, toast.wrap ? styles3.wrapped : null], children: parts.map(
+      (part, index) => typeof part === "string" ? part : /* @__PURE__ */ jsx8(Text2, { style: styles3.strong, children: part.strong }, index)
+    ) }),
+    toast.actions?.map((action) => /* @__PURE__ */ jsx8(PillButton, { label: action.label, onPress: action.onPress, testID: action.testID, variant: action.variant ?? "secondary" }, action.label)),
+    toast.dismissible ? /* @__PURE__ */ jsx8(IconButton, { accessibilityLabel: "Dismiss", icon: "x", onPress: onDismiss, size: 36, tone: "ghost" }) : null
+  ] });
+});
+var styles3 = StyleSheet3.create({
+  toast: { flexDirection: "row", alignItems: "center", gap: 10, minHeight: 48, paddingVertical: 6, paddingRight: 6, paddingLeft: 14, borderWidth: 1, borderRadius: 12 },
+  message: { flexShrink: 1, marginRight: 4 },
+  wrapped: { lineHeight: 14 * 1.35, paddingVertical: 4 },
+  strong: { fontFamily: fontFamilies[600] }
+});
+
+// src/primitives/toast/toast-store.ts
+var MAX_VISIBLE = 3;
+function messageText(message) {
+  return typeof message === "string" ? message : message.map((part) => typeof part === "string" ? part : part.strong).join("");
+}
+function createToastStore() {
+  let toasts = [];
+  let nextId = 0;
+  const timers = /* @__PURE__ */ new Map();
+  const listeners = /* @__PURE__ */ new Set();
+  const publish = (next) => {
+    toasts = next;
+    for (const listener of listeners) listener();
+  };
+  const dismiss = (id) => {
+    clearTimeout(timers.get(id));
+    timers.delete(id);
+    if (toasts.some((toast) => toast.id === id)) publish(toasts.filter((toast) => toast.id !== id));
+  };
+  return {
+    show(input) {
+      const toast = { ...input, id: ++nextId, kind: input.kind ?? "info" };
+      const kept = toasts.slice(Math.max(0, toasts.length - (MAX_VISIBLE - 1)));
+      for (const dropped of toasts.slice(0, toasts.length - kept.length)) dismiss(dropped.id);
+      publish([...kept, toast]);
+      if (toast.kind === "info")
+        timers.set(
+          toast.id,
+          setTimeout(() => dismiss(toast.id), durations.toastInfo)
+        );
+      announce(messageText(toast.message));
+      return toast.id;
+    },
+    dismiss,
+    clear() {
+      for (const toast of toasts) dismiss(toast.id);
+    },
+    subscribe(listener) {
+      listeners.add(listener);
+      return () => listeners.delete(listener);
+    },
+    getSnapshot: () => toasts
+  };
+}
+
+// src/primitives/toast/ToastStack.tsx
+import { jsx as jsx9 } from "react/jsx-runtime";
+var ToastContext = createContext4(null);
+var ToastClearanceContext = createContext4(null);
+function ToastProvider({ children }) {
+  const [store] = useState2(createToastStore);
+  const [bottom, setBottom] = useState2(null);
+  const clearance = useMemo2(() => ({ bottom, setBottom }), [bottom]);
+  return /* @__PURE__ */ jsx9(ToastContext.Provider, { value: store, children: /* @__PURE__ */ jsx9(ToastClearanceContext.Provider, { value: clearance, children }) });
+}
+function useToasts() {
+  const store = useContext4(ToastContext);
+  if (!store) throw new Error("useToasts must be used inside <Chalk>.");
+  return store;
+}
+function useToastClearance() {
+  const clearance = useContext4(ToastClearanceContext);
+  if (!clearance) throw new Error("useToastClearance must be used inside <Chalk>.");
+  return clearance.setBottom;
+}
+function ToastStack() {
+  const store = useContext4(ToastContext);
+  const clearance = useContext4(ToastClearanceContext);
+  if (!store || !clearance) throw new Error("ToastStack must be inside <Chalk>.");
+  const toasts = useSyncExternalStore2(store.subscribe, store.getSnapshot, store.getSnapshot);
+  const layout = useDeviceLayout();
+  const sheetUp = usePortalCount("sheets") > 0;
+  const reduceMotion = useReducedMotion2();
+  const atTop = layout.phone && sheetUp;
+  const offset = layout.arrangement === "pad" ? 88 : layout.arrangement === "landscape" ? 70 : 76;
+  const position = atTop ? { top: layout.insets.top + 8, flexDirection: "column-reverse" } : { bottom: layout.insets.bottom + (clearance.bottom ?? offset) };
+  return /* @__PURE__ */ jsx9(View3, { pointerEvents: "box-none", style: [styles4.stack, position], testID: "frame.toasts", children: toasts.map((toast) => /* @__PURE__ */ jsx9(Animated3.View, { entering: reduceMotion ? void 0 : toastEntering, exiting: reduceMotion ? void 0 : toastExiting, style: { maxWidth: layout.width - 32 }, children: /* @__PURE__ */ jsx9(Toast, { onDismiss: () => store.dismiss(toast.id), toast }) }, toast.id)) });
+}
+var toastEntering = () => {
+  "worklet";
+  return {
+    initialValues: { opacity: 0, transform: [{ translateY: 8 }] },
+    animations: { opacity: withTiming3(1, timings.toastIn), transform: [{ translateY: withTiming3(0, timings.toastIn) }] }
+  };
+};
+var toastExiting = () => {
+  "worklet";
+  return {
+    initialValues: { opacity: 1, transform: [{ translateY: 0 }] },
+    animations: { opacity: withTiming3(0, timings.toastOut), transform: [{ translateY: withTiming3(4, timings.toastOut) }] }
+  };
+};
+var styles4 = StyleSheet4.create({
+  stack: { position: "absolute", left: 0, right: 0, alignItems: "center", gap: 8 }
+});
+
+// src/primitives/BottomSheet.tsx
+import { createContext as createContext5, useCallback as useCallback2, useContext as useContext5, useEffect as useEffect2, useRef as useRef3, useState as useState3 } from "react";
+import { AccessibilityInfo as AccessibilityInfo2, findNodeHandle, Pressable as Pressable3, StyleSheet as StyleSheet5, View as View4 } from "react-native";
+import { Gesture, GestureDetector } from "react-native-gesture-handler";
+import Animated4, { runOnJS, useAnimatedKeyboard, useAnimatedStyle as useAnimatedStyle3, useReducedMotion as useReducedMotion3, useSharedValue as useSharedValue2, withTiming as withTiming4 } from "react-native-reanimated";
+
+// src/frame/back-handler.ts
+import { useEffect, useRef as useRef2 } from "react";
+import { BackHandler } from "react-native";
+function useBackHandler(active, onBack) {
+  const latest = useRef2(onBack);
+  latest.current = onBack;
+  useEffect(() => {
+    if (!active) return;
+    const subscription = BackHandler.addEventListener("hardwareBackPress", () => {
+      latest.current();
+      return true;
+    });
+    return () => subscription.remove();
+  }, [active]);
+}
+
+// src/haptics/haptics.ts
+import { impactAsync, ImpactFeedbackStyle, NotificationFeedbackType, notificationAsync, selectionAsync } from "expo-haptics";
+var haptics = {
+  mute: () => fire(impactAsync(ImpactFeedbackStyle.Light)),
+  handRaise: () => fire(impactAsync(ImpactFeedbackStyle.Medium)),
+  leave: () => fire(notificationAsync(NotificationFeedbackType.Warning)),
+  sheetDetent: () => fire(selectionAsync())
+};
+function fire(feedback) {
+  feedback.catch(() => void 0);
+}
+
+// src/primitives/BottomSheet.tsx
+import { jsx as jsx10, jsxs as jsxs4 } from "react/jsx-runtime";
+var CLOSE_DISTANCE = 80;
+var BOTTOM_PADDING = 10;
+var KEYBOARD_PADDING = 12;
+var SheetDragContext = createContext5(null);
+function BottomSheet({ open, onClose, accessibilityLabel, children, title, heightRatio, inset = 12, variant = "sheet", returnFocusRef, testID }) {
+  const { colors } = useTheme();
+  const layout = useDeviceLayout();
+  const reduceMotion = useReducedMotion3();
+  const keyboard = useAnimatedKeyboard();
+  const [mounted, setMounted] = useState3(open);
+  const height = useSharedValue2(0);
+  const offset = useSharedValue2(layout.height);
+  const drag = useSharedValue2(0);
+  const shown = useSharedValue2(0);
+  const titleRef = useRef3(null);
+  useBackHandler(open, onClose);
+  const show = useCallback2(() => {
+    drag.value = 0;
+    if (reduceMotion) {
+      offset.value = 0;
+      shown.value = 1;
+    } else {
+      offset.value = withTiming4(0, timings.sheet);
+      shown.value = withTiming4(1, timings.scrim);
+    }
+    const node = titleRef.current && findNodeHandle(titleRef.current);
+    if (node) setTimeout(() => AccessibilityInfo2.setAccessibilityFocus(node), durations.sheet);
+  }, [drag, offset, reduceMotion, shown]);
+  const hide = useCallback2(() => {
+    if (reduceMotion) {
+      shown.value = 0;
+      offset.value = height.value || layout.height;
+      setMounted(false);
+      return;
+    }
+    const finish = (finished) => {
+      "worklet";
+      if (finished) runOnJS(setMounted)(false);
+    };
+    shown.value = withTiming4(0, timings.scrim);
+    offset.value = withTiming4(height.value || layout.height, timings.sheet, finish);
+  }, [height, layout.height, offset, reduceMotion, shown]);
+  const wasOpen = useRef3(open);
+  useEffect2(() => {
+    if (open === wasOpen.current) return;
+    wasOpen.current = open;
+    if (!open) return hide();
+    setMounted(true);
+    if (height.value > 0) show();
+  }, [height, hide, open, show]);
+  const wasMounted = useRef3(mounted);
+  useEffect2(() => {
+    const closed = wasMounted.current && !mounted;
+    wasMounted.current = mounted;
+    if (!closed || !returnFocusRef?.current) return;
+    const node = findNodeHandle(returnFocusRef.current);
+    if (node) AccessibilityInfo2.setAccessibilityFocus(node);
+  }, [mounted, returnFocusRef]);
+  const onLayout = useCallback2(
+    (event) => {
+      const first = height.value === 0;
+      const measured = event.nativeEvent.layout.height;
+      height.value = measured;
+      if (!first || !open) return;
+      offset.value = reduceMotion ? 0 : measured;
+      show();
+    },
+    [height, offset, open, reduceMotion, show]
+  );
+  const card = variant === "card";
+  const sheetStyle = useAnimatedStyle3(() => {
+    "worklet";
+    return {
+      opacity: reduceMotion ? shown.value : 1,
+      paddingBottom: card ? 0 : keyboard.height.value > 0 ? KEYBOARD_PADDING : layout.insets.bottom + BOTTOM_PADDING,
+      maxHeight: layout.height - layout.insets.top - 8 - keyboard.height.value,
+      transform: [{ translateY: offset.value + drag.value - keyboard.height.value }]
+    };
+  });
+  const scrimStyle = useAnimatedStyle3(() => {
+    "worklet";
+    return { opacity: shown.value };
+  });
+  const width = layout.arrangement === "pad" ? 440 : layout.arrangement === "landscape" ? 460 : layout.width;
+  const surfaceStyle = [
+    styles5.sheet,
+    { backgroundColor: variant === "popover" ? colors.popover : colors.surface, width, left: (layout.width - width) / 2, paddingHorizontal: card ? 0 : inset },
+    card ? { borderTopWidth: 1, borderColor: colors.line } : null,
+    variant === "popover" ? { borderTopWidth: 1, borderColor: colors.lineStrong } : null,
+    heightRatio ? { height: layout.height * heightRatio } : null
+  ];
+  const surfaceRef = useMeasuredRef(testID, surfaceStyle);
+  if (!mounted) return null;
+  return /* @__PURE__ */ jsxs4(Portal, { layer: "sheets", children: [
+    /* @__PURE__ */ jsx10(Animated4.View, { style: [StyleSheet5.absoluteFill, { backgroundColor: fixed.scrim }, scrimStyle], children: /* @__PURE__ */ jsx10(Pressable3, { accessible: false, onPress: onClose, style: StyleSheet5.absoluteFill, testID: testID ? `${testID}.scrim` : void 0 }) }),
+    /* @__PURE__ */ jsx10(SheetDragContext.Provider, { value: { drag, close: onClose }, children: /* @__PURE__ */ jsxs4(Animated4.View, { accessibilityLabel, accessibilityViewIsModal: true, onAccessibilityEscape: onClose, onLayout, ref: surfaceRef, style: [surfaceStyle, sheetStyle], testID, children: [
+      /* @__PURE__ */ jsxs4(SheetDragRegion, { children: [
+        /* @__PURE__ */ jsx10(View4, { accessibilityLabel: title ? void 0 : accessibilityLabel, accessibilityRole: title ? void 0 : "header", accessible: !title, ref: title ? void 0 : titleRef, style: card ? styles5.cardGrabArea : styles5.grabArea, testID: testID ? `${testID}.grabber` : void 0, children: /* @__PURE__ */ jsx10(View4, { style: [styles5.grabber, { backgroundColor: colors.lineStrong }] }) }),
+        title ? /* @__PURE__ */ jsx10(View4, { accessibilityRole: "header", accessible: true, ref: titleRef, style: styles5.header, children: /* @__PURE__ */ jsx10(ChalkText, { numberOfLines: 1, variant: "sheetTitle", children: title }) }) : null
+      ] }),
+      children
+    ] }) })
+  ] });
+}
+function SheetDragRegion({ children }) {
+  const sheet = useContext5(SheetDragContext);
+  if (!sheet) throw new Error("SheetDragRegion must be inside a BottomSheet.");
+  const { drag, close } = sheet;
+  const gesture = Gesture.Pan().activeOffsetY(4).onUpdate((event) => {
+    "worklet";
+    const next = Math.max(0, event.translationY);
+    if (next > CLOSE_DISTANCE !== drag.value > CLOSE_DISTANCE) runOnJS(haptics.sheetDetent)();
+    drag.value = next;
+  }).onEnd(() => {
+    "worklet";
+    if (drag.value > CLOSE_DISTANCE) runOnJS(close)();
+    else drag.value = withTiming4(0, timings.sheet);
+  });
+  return /* @__PURE__ */ jsx10(GestureDetector, { gesture, children: /* @__PURE__ */ jsx10(View4, { collapsable: false, children }) });
+}
+var styles5 = StyleSheet5.create({
+  sheet: { position: "absolute", bottom: 0, paddingTop: 8, borderTopLeftRadius: radii.sheet, borderTopRightRadius: radii.sheet },
+  grabArea: { alignItems: "center", paddingTop: 4, paddingBottom: 12 },
+  cardGrabArea: { alignItems: "center" },
+  grabber: { width: 36, height: 5, borderRadius: 3 },
+  header: { flexDirection: "row", alignItems: "center", gap: 12, paddingTop: 4, paddingHorizontal: 8, paddingBottom: 14 }
+});
+
+// src/primitives/Menu.tsx
+import { createContext as createContext6, useCallback as useCallback3, useContext as useContext6, useEffect as useEffect3, useLayoutEffect as useLayoutEffect2, useMemo as useMemo3, useRef as useRef4, useState as useState4 } from "react";
+import { AccessibilityInfo as AccessibilityInfo3, findNodeHandle as findNodeHandle2, Keyboard, Pressable as Pressable4, ScrollView, StyleSheet as StyleSheet6, View as View5 } from "react-native";
+import Animated5, { useAnimatedStyle as useAnimatedStyle4, useReducedMotion as useReducedMotion4, useSharedValue as useSharedValue3, withTiming as withTiming5 } from "react-native-reanimated";
+
+// src/primitives/menu-placement.ts
+var GAP = 6;
+var MARGIN = 8;
+function placeMenu(trigger, menu, screen, insets, keyboardHeight = 0) {
+  const top = insets.top + MARGIN;
+  const bottom = screen.height - Math.max(insets.bottom, keyboardHeight) - MARGIN;
+  const left = insets.left + MARGIN;
+  const right = screen.width - insets.right - MARGIN;
+  const maxHeight = menu.height > bottom - top ? bottom - top : null;
+  const height = maxHeight ?? menu.height;
+  const roomBelow = bottom - (trigger.y + trigger.height + GAP);
+  const roomAbove = trigger.y - GAP - top;
+  const below = height <= roomBelow || roomBelow >= roomAbove;
+  const y = below ? trigger.y + trigger.height + GAP : trigger.y - GAP - height;
+  return {
+    x: clamp(trigger.x + trigger.width / 2 - menu.width / 2, left, right - menu.width),
+    y: clamp(y, top, bottom - height),
+    maxHeight,
+    side: below ? "below" : "above"
+  };
+}
+function clamp(value, min, max) {
+  return Math.max(min, Math.min(max, value));
+}
+
+// src/primitives/Menu.tsx
+import { jsx as jsx11, jsxs as jsxs5 } from "react/jsx-runtime";
+var MenuFocusContext = createContext6(null);
+function Menu({ open, onClose, anchorRef, accessibilityLabel, children, minWidth = 250, testID }) {
+  const { colors, elevation } = useTheme();
+  const layout = useDeviceLayout();
+  const reduceMotion = useReducedMotion4();
+  const [trigger, setTrigger] = useState4(null);
+  const [placement, setPlacement] = useState4(null);
+  const firstItem = useRef4(null);
+  const keyboardHeight = useKeyboardHeight();
+  const shown = useSharedValue3(0);
+  useBackHandler(open, onClose);
+  useEffect3(() => {
+    if (!open) {
+      firstItem.current = null;
+      setTrigger(null);
+      setPlacement(null);
+      shown.value = 0;
+      return;
+    }
+    anchorRef.current?.measureInWindow((x, y, width, height) => setTrigger({ x, y, width, height }));
+  }, [anchorRef, open, shown]);
+  const viewport = `${layout.width}x${layout.height}`;
+  const openedIn = useRef4(viewport);
+  useEffect3(() => {
+    if (!open) openedIn.current = viewport;
+    else if (viewport !== openedIn.current) onClose();
+  }, [onClose, open, viewport]);
+  const wasOpen = useRef4(open);
+  useEffect3(() => {
+    const closed = wasOpen.current && !open;
+    wasOpen.current = open;
+    if (!closed || !anchorRef.current) return;
+    const node = findNodeHandle2(anchorRef.current);
+    if (node) AccessibilityInfo3.setAccessibilityFocus(node);
+  }, [anchorRef, open]);
+  const onLayout = useCallback3(
+    (event) => {
+      if (!trigger || placement) return;
+      const { width, height } = event.nativeEvent.layout;
+      setPlacement(placeMenu(trigger, { width, height }, layout, layout.insets, keyboardHeight));
+      shown.value = reduceMotion ? 1 : withTiming5(1, timings.menu);
+    },
+    [keyboardHeight, layout, placement, reduceMotion, shown, trigger]
+  );
+  useEffect3(() => {
+    if (!placement || !firstItem.current) return;
+    const node = findNodeHandle2(firstItem.current);
+    if (node) AccessibilityInfo3.setAccessibilityFocus(node);
+  }, [placement]);
+  const surfaceStyle = useAnimatedStyle4(() => {
+    "worklet";
+    return { opacity: shown.value, transform: [{ translateY: reduceMotion ? 0 : (1 - shown.value) * 4 }] };
+  });
+  const focus = useMemo3(
+    () => ({
+      claim: (node) => {
+        firstItem.current ??= node;
+      }
+    }),
+    []
+  );
+  const surfaceStatic = [styles6.surface, { minWidth, backgroundColor: colors.popover, borderColor: colors.lineStrong, boxShadow: elevation.popover }, placement ? { left: placement.x, top: placement.y, maxHeight: placement.maxHeight ?? void 0 } : styles6.measuring];
+  const surfaceRef = useMeasuredRef(testID, surfaceStatic);
+  if (!open || !trigger) return null;
+  return /* @__PURE__ */ jsxs5(Portal, { layer: "menus", children: [
+    /* @__PURE__ */ jsx11(Pressable4, { accessible: false, onPress: onClose, style: StyleSheet6.absoluteFill, testID: testID ? `${testID}.backdrop` : void 0 }),
+    /* @__PURE__ */ jsx11(Animated5.View, { accessibilityLabel, accessibilityRole: "menu", accessibilityViewIsModal: true, onAccessibilityEscape: onClose, onLayout, ref: surfaceRef, style: [surfaceStatic, surfaceStyle], testID, children: /* @__PURE__ */ jsx11(MenuFocusContext.Provider, { value: focus, children: /* @__PURE__ */ jsx11(ScrollView, { bounces: false, scrollEnabled: placement?.maxHeight != null, children }) }) })
+  ] });
+}
+function MenuItem({ label, onPress, icon, detail, trailing, checked, danger = false, testID }) {
+  const { colors } = useTheme();
+  const { phone } = useDeviceLayout();
+  const focus = useContext6(MenuFocusContext);
+  const ref = useRef4(null);
+  useLayoutEffect2(() => {
+    if (ref.current) focus?.claim(ref.current);
+  }, [focus]);
+  const tone = danger ? "dangerText" : "text";
+  return /* @__PURE__ */ jsxs5(
+    Pressable4,
+    {
+      accessibilityLabel: trailing ? `${label}, ${trailing}` : label,
+      accessibilityRole: "menuitem",
+      accessibilityState: checked === void 0 ? void 0 : { checked },
+      onPress,
+      ref,
+      style: ({ pressed }) => [styles6.item, { minHeight: phone ? sizes.menuRowPhone : sizes.menuRow }, pressed ? { backgroundColor: colors.hover } : null],
+      testID,
+      children: [
+        checked === void 0 ? null : /* @__PURE__ */ jsx11(View5, { style: styles6.check, children: checked ? /* @__PURE__ */ jsx11(Icon, { color: colors.text, name: "check", size: 18 }) : null }),
+        icon ? /* @__PURE__ */ jsx11(Icon, { color: danger ? colors.dangerText : colors.textMuted, name: icon, size: 18 }) : null,
+        /* @__PURE__ */ jsxs5(View5, { style: styles6.labels, children: [
+          /* @__PURE__ */ jsx11(ChalkText, { numberOfLines: 1, tone, children: label }),
+          detail ? /* @__PURE__ */ jsx11(ChalkText, { tone: "textMuted", variant: "label", children: detail }) : null
+        ] }),
+        trailing ? /* @__PURE__ */ jsx11(ChalkText, { tone: "textMuted", variant: "meta", children: trailing }) : null
+      ]
+    }
+  );
+}
+function MenuSection({ label }) {
+  return /* @__PURE__ */ jsx11(View5, { accessibilityRole: "header", accessible: true, style: styles6.section, children: /* @__PURE__ */ jsx11(ChalkText, { tone: "textMuted", variant: "section", children: label }) });
+}
+function useKeyboardHeight() {
+  const [height, setHeight] = useState4(0);
+  useEffect3(() => {
+    const show = Keyboard.addListener("keyboardDidShow", (event) => setHeight(event.endCoordinates.height));
+    const hide = Keyboard.addListener("keyboardDidHide", () => setHeight(0));
+    return () => {
+      show.remove();
+      hide.remove();
+    };
+  }, []);
+  return height;
+}
+var styles6 = StyleSheet6.create({
+  surface: { position: "absolute", padding: 6, borderWidth: 1, borderRadius: radii.menu },
+  measuring: { left: 0, top: 0, opacity: 0 },
+  item: { flexDirection: "row", alignItems: "center", gap: 10, paddingHorizontal: 10, borderRadius: radii.menuRow },
+  check: { width: 18, alignItems: "center" },
+  labels: { flex: 1, minWidth: 0, gap: 2 },
+  section: { paddingTop: 8, paddingHorizontal: 10, paddingBottom: 4 },
+  separator: { height: 1, marginVertical: 6, marginHorizontal: 4 }
+});
+
+// src/primitives/SheetGroup.tsx
+import { Children, Fragment as Fragment3 } from "react";
+import { Pressable as Pressable5, StyleSheet as StyleSheet7, View as View6 } from "react-native";
+import { Fragment as Fragment4, jsx as jsx12, jsxs as jsxs6 } from "react/jsx-runtime";
+function SheetGroup({ children, testID }) {
+  const { colors } = useTheme();
+  const rows = Children.toArray(children);
+  return /* @__PURE__ */ jsx12(View6, { style: [styles7.group, { backgroundColor: colors.raised }], testID, children: rows.map((row, index) => /* @__PURE__ */ jsxs6(Fragment3, { children: [
+    index > 0 ? /* @__PURE__ */ jsx12(View6, { style: [styles7.divider, { backgroundColor: colors.line }] }) : null,
+    row
+  ] }, index)) });
+}
+function SheetRow({ label, icon, end, badge, accessibilityLabel = label, onPress, danger = false, testID }) {
+  const { colors } = useTheme();
+  const content = /* @__PURE__ */ jsxs6(Fragment4, { children: [
+    icon ? /* @__PURE__ */ jsx12(Icon, { color: danger ? colors.dangerText : colors.textSoft, name: icon }) : null,
+    /* @__PURE__ */ jsx12(ChalkText, { numberOfLines: 1, style: badge ? styles7.labelShrink : styles7.label, tone: danger ? "dangerText" : "text", variant: "phoneRow", children: label }),
+    badge ? /* @__PURE__ */ jsx12(View6, { style: styles7.badge, children: badge }) : null,
+    end
+  ] });
+  if (!onPress) {
+    return /* @__PURE__ */ jsx12(View6, { style: styles7.row, testID, children: content });
+  }
+  return /* @__PURE__ */ jsx12(Pressable5, { accessibilityLabel, accessibilityRole: "button", onPress, style: ({ pressed }) => [styles7.row, pressed ? { backgroundColor: colors.pressed } : null], testID, children: content });
+}
+var styles7 = StyleSheet7.create({
+  group: { borderRadius: 16, overflow: "hidden" },
+  divider: { height: 1 },
+  row: { flexDirection: "row", alignItems: "center", gap: 14, minHeight: 52, paddingHorizontal: 16 },
+  label: { flex: 1 },
+  labelShrink: { flexShrink: 1 },
+  badge: { marginLeft: 2, marginRight: "auto" }
+});
+
+// src/primitives/SegmentedControl.tsx
+import { Pressable as Pressable6, StyleSheet as StyleSheet8, View as View7 } from "react-native";
+import { jsx as jsx13 } from "react/jsx-runtime";
+function SegmentedControl({ options, value, onChange, accessibilityLabel, size = "regular", testID }) {
+  const { colors } = useTheme();
+  const compact = size === "compact";
+  const trackStyle = [styles8.track, { backgroundColor: compact ? colors.hover : colors.surface }];
+  const trackRef = useMeasuredRef(testID, trackStyle);
+  return /* @__PURE__ */ jsx13(View7, { accessibilityLabel, accessibilityRole: "radiogroup", ref: trackRef, style: trackStyle, testID, children: options.map((option) => /* @__PURE__ */ jsx13(Segment, { compact, onChange, option, selected: option.value === value }, option.value)) });
+}
+function Segment({ option, selected, compact, onChange }) {
+  const { colors } = useTheme();
+  const style = [styles8.segment, { height: compact ? 30 : 38 }, selected ? compact ? [{ backgroundColor: colors.popover }, styles8.lifted] : { backgroundColor: colors.pressed } : null];
+  const ref = useMeasuredRef(option.testID, style);
+  return /* @__PURE__ */ jsx13(Pressable6, { accessibilityLabel: option.label, accessibilityRole: "radio", accessibilityState: { selected, checked: selected }, hitSlop: compact ? 7 : 3, onPress: () => onChange(option.value), ref, style, testID: option.testID, children: /* @__PURE__ */ jsx13(ChalkText, { tone: selected ? "text" : "textMuted", variant: compact ? "button" : "bodyStrong", children: option.label }) });
+}
+var styles8 = StyleSheet8.create({
+  track: { flexDirection: "row", padding: 3, borderRadius: 999 },
+  segment: { justifyContent: "center", paddingHorizontal: 14, borderRadius: 999 },
+  lifted: { boxShadow: fixed.segmentShadow }
+});
+
+// src/primitives/CopyButton.tsx
+import { memo as memo5, useCallback as useCallback4, useEffect as useEffect4, useRef as useRef5, useState as useState5 } from "react";
+import { Pressable as Pressable7, StyleSheet as StyleSheet9 } from "react-native";
+import Animated6, { useAnimatedStyle as useAnimatedStyle5, useSharedValue as useSharedValue4, withTiming as withTiming6 } from "react-native-reanimated";
+import { jsx as jsx14, jsxs as jsxs7 } from "react/jsx-runtime";
+var CopyButton = memo5(function CopyButton2({ onCopy, accessibilityLabel, announcement, testID }) {
+  const { colors } = useTheme();
+  const press = usePressAnimation("small");
+  const [copied, setCopied] = useState5(false);
+  const done = useSharedValue4(0);
+  const reset = useRef5(null);
+  useEffect4(() => {
+    done.value = withTiming6(copied ? 1 : 0, timings.copyMorph);
+  }, [copied, done]);
+  useEffect4(() => () => clearReset(reset), []);
+  const copy = useCallback4(async () => {
+    await onCopy();
+    setCopied(true);
+    announce(announcement);
+    clearReset(reset);
+    reset.current = setTimeout(() => setCopied(false), durations.copyReset);
+  }, [announcement, onCopy]);
+  const copyIconStyle = useAnimatedStyle5(() => {
+    "worklet";
+    return { opacity: 1 - done.value, transform: [{ scale: 1 - 0.6 * done.value }, { rotate: `${20 * done.value}deg` }] };
+  });
+  const checkIconStyle = useAnimatedStyle5(() => {
+    "worklet";
+    return { opacity: done.value, transform: [{ scale: 0.4 + 0.6 * done.value }, { rotate: `${-20 * (1 - done.value)}deg` }] };
+  });
+  const { down } = press;
+  const pressed = colors.pressed;
+  const backgroundStyle = useAnimatedStyle5(() => {
+    "worklet";
+    return { backgroundColor: down.value ? pressed : fixed.transparent };
+  });
+  return /* @__PURE__ */ jsx14(Pressable7, { accessibilityLabel, accessibilityRole: "button", hitSlop: 4, onPress: copy, onPressIn: press.onPressIn, onPressOut: press.onPressOut, testID, children: /* @__PURE__ */ jsxs7(Animated6.View, { style: [styles9.button, backgroundStyle, press.scaleStyle], children: [
+    /* @__PURE__ */ jsx14(Animated6.View, { style: [styles9.icon, copyIconStyle], children: /* @__PURE__ */ jsx14(Icon, { color: colors.text, name: "copy", size: 18 }) }),
+    /* @__PURE__ */ jsx14(Animated6.View, { style: [styles9.icon, checkIconStyle], children: /* @__PURE__ */ jsx14(Icon, { color: colors.success, name: "check", size: 18 }) })
+  ] }) });
+});
+function clearReset(reset) {
+  if (reset.current) clearTimeout(reset.current);
+  reset.current = null;
+}
+var styles9 = StyleSheet9.create({
+  button: { width: 36, height: 36, borderRadius: 18, alignItems: "center", justifyContent: "center" },
+  icon: { position: "absolute" }
+});
+
+// src/primitives/Switch.tsx
+import { memo as memo6, useEffect as useEffect5 } from "react";
+import { Pressable as Pressable8, StyleSheet as StyleSheet10 } from "react-native";
+import Animated7, { useAnimatedStyle as useAnimatedStyle6, useSharedValue as useSharedValue5, withTiming as withTiming7 } from "react-native-reanimated";
+import { jsx as jsx15 } from "react/jsx-runtime";
+var Switch = memo6(function Switch2({ value, onValueChange, accessibilityLabel, testID }) {
+  const { colors } = useTheme();
+  const on = useSharedValue5(value ? 1 : 0);
+  useEffect5(() => {
+    on.value = withTiming7(value ? 1 : 0, timings.switch);
+  }, [on, value]);
+  const knobStyle = useAnimatedStyle6(() => {
+    "worklet";
+    return { transform: [{ translateX: on.value * 14 }] };
+  });
+  return /* @__PURE__ */ jsx15(Pressable8, { accessibilityLabel, accessibilityRole: "switch", accessibilityState: { checked: value }, hitSlop: 11, onPress: () => onValueChange(!value), testID, children: /* @__PURE__ */ jsx15(Animated7.View, { style: [styles10.track, { backgroundColor: value ? colors.success : colors.pressed }], children: /* @__PURE__ */ jsx15(Animated7.View, { style: [styles10.knob, knobStyle] }) }) });
+});
+var styles10 = StyleSheet10.create({
+  track: { width: 36, height: 22, borderRadius: 999 },
+  knob: { position: "absolute", left: 3, top: 3, width: 16, height: 16, borderRadius: 8, backgroundColor: fixed.switchKnob }
+});
+
+// src/avatar/FaceAvatar.tsx
+import { createFacehashScene, getColor, getForegroundColor } from "@q9labsai/facehash";
+import { memo as memo7, useCallback as useCallback5, useEffect as useEffect6, useMemo as useMemo4 } from "react";
+import { Platform as Platform2, StyleSheet as StyleSheet11, View as View8 } from "react-native";
+import Animated8, { cancelAnimation, useAnimatedStyle as useAnimatedStyle7, useReducedMotion as useReducedMotion5, useSharedValue as useSharedValue6, withDelay, withRepeat, withSequence, withTiming as withTiming8 } from "react-native-reanimated";
+import Svg2, { G, Path as Path2, Text as SvgText } from "react-native-svg";
+import { jsx as jsx16, jsxs as jsxs8 } from "react/jsx-runtime";
+var INTENSITY = { bold: "dramatic", subtle: "subtle" };
+var MONO = Platform2.select({ ios: "Menlo", default: "monospace" });
+var FRONT_HOLD_MS = 1400;
+var LOOK_INTERVAL_MS = 1800;
+var LOOK_MS = 700;
+var BOB = 5;
+var MOUTH = 0.55;
+var CLOSED = 0.05;
+var FaceAvatar = memo7(function FaceAvatar2({ name, size, style = "subtle", level, lookAround = false, testID }) {
+  const reduceMotion = useReducedMotion5();
+  const scene = useMemo4(() => createFacehashScene({ name, colorsLength: identityColors.length, intensity3d: INTENSITY[style] }), [name, style]);
+  const background = getColor(identityColors, scene.data.colorIndex);
+  const foreground = getForegroundColor(background);
+  const geometry = scene.faceGeometry;
+  const box = scene.faceBox;
+  const eyeCenter = box.y + geometry.leftEyeAnchor.y * (box.height / geometry.viewBox.height);
+  const unit = size / 100;
+  const projection = scene.projection;
+  const turned = useSharedValue6(1);
+  const blink = useSharedValue6(1);
+  const lookX = useSharedValue6(0);
+  const lookY = useSharedValue6(0);
+  useEffect6(() => {
+    if (reduceMotion) {
+      blink.value = 1;
+      return;
+    }
+    const { delay, duration } = scene.data.blinkTimings.left;
+    const total = duration * 1e3;
+    const close = { duration: total * 0.04, easing: easings.standard };
+    blink.value = withDelay(delay * 1e3, withRepeat(withSequence(withDelay(total * 0.92, withTiming8(CLOSED, close)), withTiming8(1, close)), -1));
+    return () => cancelAnimation(blink);
+  }, [blink, reduceMotion, scene]);
+  useEffect6(() => {
+    if (!lookAround || reduceMotion) return;
+    const timer = setInterval(() => {
+      if (Math.random() < 0.5 || turned.value < 1) return;
+      lookX.value = withTiming8((Math.random() * 2 - 1) * 6, { duration: LOOK_MS, easing: easings.standard });
+      lookY.value = withTiming8((Math.random() * 2 - 1) * 4, { duration: LOOK_MS, easing: easings.standard });
+    }, LOOK_INTERVAL_MS);
+    return () => clearInterval(timer);
+  }, [lookAround, lookX, lookY, reduceMotion, turned]);
+  const turnToFront = useCallback5(() => {
+    if (reduceMotion) return;
+    turned.value = withSequence(withTiming8(0, timings.avatarTurn), withDelay(FRONT_HOLD_MS, withTiming8(1, timings.avatarTurn)));
+    lookX.value = withTiming8(0, { duration: 250, easing: easings.standard });
+    lookY.value = withTiming8(0, { duration: 250, easing: easings.standard });
+    blink.value = withSequence(withTiming8(CLOSED, { duration: 150, easing: easings.standard }), withTiming8(1, { duration: 150, easing: easings.standard }));
+  }, [blink, lookX, lookY, reduceMotion, turned]);
+  const bobStyle = useAnimatedStyle7(() => {
+    "worklet";
+    return { transform: [{ translateY: level ? -level.value * BOB * unit : 0 }] };
+  });
+  const poseStyle = useAnimatedStyle7(() => {
+    "worklet";
+    const t = turned.value;
+    return {
+      transform: [{ translateX: projection.translateX * unit * t }, { translateY: projection.translateY * unit * t }, { skewX: `${projection.skewX * t}deg` }, { skewY: `${projection.skewY * t}deg` }, { scaleX: 1 + (projection.scaleX - 1) * t }, { scaleY: 1 + (projection.scaleY - 1) * t }]
+    };
+  });
+  const eyesLookStyle = useAnimatedStyle7(() => {
+    "worklet";
+    return { transform: [{ translateX: lookX.value * unit }, { translateY: lookY.value * unit }] };
+  });
+  const mouthLookStyle = useAnimatedStyle7(() => {
+    "worklet";
+    return { transform: [{ translateX: lookX.value / 2 * unit }, { translateY: lookY.value / 2 * unit }] };
+  });
+  const blinkStyle = useAnimatedStyle7(() => {
+    "worklet";
+    return { transform: [{ scaleY: blink.value }] };
+  });
+  const mouthStyle = useAnimatedStyle7(() => {
+    "worklet";
+    return { transform: [{ scaleY: 1 + (level ? level.value : 0) * MOUTH }] };
+  });
+  const faceTransform = `translate(${box.x} ${box.y}) scale(${box.width / geometry.viewBox.width} ${box.height / geometry.viewBox.height})`;
+  return /* @__PURE__ */ jsx16(View8, { onTouchStart: turnToFront, style: [styles11.circle, { width: size, height: size, borderRadius: size / 2, backgroundColor: background }], testID, children: /* @__PURE__ */ jsx16(Animated8.View, { style: [StyleSheet11.absoluteFill, bobStyle], children: /* @__PURE__ */ jsxs8(Animated8.View, { style: [StyleSheet11.absoluteFill, poseStyle], children: [
+    /* @__PURE__ */ jsx16(Animated8.View, { style: [StyleSheet11.absoluteFill, eyesLookStyle], children: /* @__PURE__ */ jsx16(Animated8.View, { style: [StyleSheet11.absoluteFill, { transformOrigin: `50% ${eyeCenter}%` }, blinkStyle], children: /* @__PURE__ */ jsx16(Svg2, { height: size, viewBox: "0 0 100 100", width: size, children: /* @__PURE__ */ jsx16(G, { transform: faceTransform, children: [...geometry.leftEyePaths, ...geometry.rightEyePaths].map((d) => /* @__PURE__ */ jsx16(Path2, { d, fill: foreground }, d)) }) }) }) }),
+    /* @__PURE__ */ jsx16(Animated8.View, { style: [StyleSheet11.absoluteFill, mouthLookStyle], children: /* @__PURE__ */ jsx16(Animated8.View, { style: [StyleSheet11.absoluteFill, styles11.mouthOrigin, mouthStyle], children: /* @__PURE__ */ jsx16(Svg2, { height: size, viewBox: "0 0 100 100", width: size, children: /* @__PURE__ */ jsx16(SvgText, { alignmentBaseline: "middle", fill: foreground, fontFamily: MONO, fontSize: scene.initialLayout.fontSize, fontWeight: "700", textAnchor: "middle", x: scene.initialLayout.x, y: scene.initialLayout.y, children: scene.data.initial }) }) }) })
+  ] }) }) });
+});
+var styles11 = StyleSheet11.create({
+  circle: { overflow: "hidden" },
+  // The initial sits on y = 70 with a 26-unit font, so its baseline is near y = 79.
+  mouthOrigin: { transformOrigin: "50% 79%" }
+});
+
+// src/limbo/Limbo.tsx
+import { useEffect as useEffect7, useRef as useRef6 } from "react";
+import { AccessibilityInfo as AccessibilityInfo4, findNodeHandle as findNodeHandle3, StyleSheet as StyleSheet12, View as View9 } from "react-native";
+import Animated9, { cancelAnimation as cancelAnimation2, Easing as Easing2, useAnimatedStyle as useAnimatedStyle8, useReducedMotion as useReducedMotion6, useSharedValue as useSharedValue7, withRepeat as withRepeat2, withTiming as withTiming9 } from "react-native-reanimated";
+import { Fragment as Fragment5, jsx as jsx17, jsxs as jsxs9 } from "react/jsx-runtime";
+function Limbo({ state, callName, recording }) {
+  const { colors } = useTheme();
+  const cardStyle = [styles12.card, { backgroundColor: colors.surface, borderColor: colors.line }];
+  const cardRef = useMeasuredRef("limbo.card", cardStyle);
+  const actionRef = useRef6(null);
+  const consent = recording && (state.kind === "joining" || state.kind === "knocking") ? /* @__PURE__ */ jsx17(Consent, {}) : null;
+  useEffect7(() => {
+    const node = actionRef.current && findNodeHandle3(actionRef.current);
+    if (node) AccessibilityInfo4.setAccessibilityFocus(node);
+  }, [state.kind]);
+  return /* @__PURE__ */ jsx17(View9, { pointerEvents: "box-none", style: styles12.limbo, testID: "frame.limbo", children: /* @__PURE__ */ jsxs9(View9, { accessibilityLiveRegion: state.kind === "refused" ? "assertive" : "polite", accessibilityRole: state.kind === "refused" ? "alert" : "summary", ref: cardRef, style: cardStyle, testID: "limbo.card", children: [
+    state.kind === "joining" ? /* @__PURE__ */ jsx17(Progress, { message: `${state.rejoining ? "Rejoining" : "Joining"} ${callName}\u2026` }) : state.kind === "knocking" ? /* @__PURE__ */ jsxs9(Fragment5, { children: [
+      /* @__PURE__ */ jsx17(Title, { children: `Asking to join ${callName}` }),
+      /* @__PURE__ */ jsx17(Line, { children: "The host will let you in." }),
+      consent,
+      /* @__PURE__ */ jsx17(View9, { style: styles12.action, children: /* @__PURE__ */ jsx17(PillButton, { label: "Cancel", onPress: state.onCancel, ref: actionRef, testID: "limbo.cancel" }) })
+    ] }) : state.kind === "refused" ? /* @__PURE__ */ jsxs9(Fragment5, { children: [
+      /* @__PURE__ */ jsx17(Title, { children: "The host didn\u2019t let you in" }),
+      /* @__PURE__ */ jsx17(View9, { style: styles12.action, children: /* @__PURE__ */ jsx17(PillButton, { label: "Ask again", onPress: state.onAskAgain, ref: actionRef, testID: "limbo.ask-again", variant: "primary" }) })
+    ] }) : state.kind === "reconnecting" ? /* @__PURE__ */ jsxs9(Fragment5, { children: [
+      /* @__PURE__ */ jsx17(Progress, { message: "Reconnecting\u2026" }),
+      state.queuedMessages > 0 ? /* @__PURE__ */ jsx17(Line, { children: `${state.queuedMessages} message${state.queuedMessages > 1 ? "s" : ""} will send when you\u2019re back` }) : null
+    ] }) : /* @__PURE__ */ jsxs9(Fragment5, { children: [
+      /* @__PURE__ */ jsx17(HoldIcon, {}),
+      /* @__PURE__ */ jsx17(Title, { children: "Your call is on hold" }),
+      /* @__PURE__ */ jsx17(Line, { children: `You\u2019re on a phone call. You\u2019ll be back in ${callName} when it ends.` })
+    ] }),
+    state.kind === "joining" ? consent : null
+  ] }) });
+}
+function Title({ children }) {
+  return /* @__PURE__ */ jsx17(ChalkText, { accessibilityRole: "header", style: styles12.center, testID: "limbo.title", variant: "limboTitle", children });
+}
+function Line({ children }) {
+  return /* @__PURE__ */ jsx17(ChalkText, { style: styles12.center, testID: "limbo.line", tone: "textSoft", children });
+}
+function Progress({ message }) {
+  return /* @__PURE__ */ jsxs9(View9, { style: styles12.row, children: [
+    /* @__PURE__ */ jsx17(Spinner, {}),
+    /* @__PURE__ */ jsx17(ChalkText, { testID: "limbo.progress", variant: "progress", children: message })
+  ] });
+}
+function HoldIcon() {
+  const { colors } = useTheme();
+  const style = [styles12.holdIcon, { backgroundColor: colors.raised }];
+  const ref = useMeasuredRef("limbo.hold-icon", style);
+  return /* @__PURE__ */ jsx17(View9, { ref, style, testID: "limbo.hold-icon", children: /* @__PURE__ */ jsx17(Icon, { color: colors.success, name: "earpiece" }) });
+}
+function Consent() {
+  const { colors } = useTheme();
+  return /* @__PURE__ */ jsxs9(View9, { style: styles12.consent, testID: "limbo.consent", children: [
+    /* @__PURE__ */ jsx17(Icon, { color: colors.dangerText, name: "rec", size: 14 }),
+    /* @__PURE__ */ jsx17(ChalkText, { tone: "textMuted", variant: "label", style: styles12.consentText, children: "This call is recorded. By joining, you agree to be recorded." })
+  ] });
+}
+function Spinner() {
+  const { colors } = useTheme();
+  const reduceMotion = useReducedMotion6();
+  const turn = useSharedValue7(0);
+  useEffect7(() => {
+    if (reduceMotion) return;
+    turn.value = withRepeat2(withTiming9(1, { duration: 900, easing: Easing2.linear }), -1);
+    return () => cancelAnimation2(turn);
+  }, [reduceMotion, turn]);
+  const style = useAnimatedStyle8(() => {
+    "worklet";
+    return { transform: [{ rotate: `${turn.value * 360}deg` }] };
+  });
+  return /* @__PURE__ */ jsx17(Animated9.View, { style: [styles12.spinner, { borderColor: colors.lineStrong, borderTopColor: reduceMotion ? colors.textMuted : colors.text }, style] });
+}
+var styles12 = StyleSheet12.create({
+  limbo: { ...StyleSheet12.absoluteFillObject, alignItems: "center", justifyContent: "center" },
+  card: { alignItems: "center", gap: 8, maxWidth: "100%", paddingVertical: 22, paddingHorizontal: 28, borderWidth: 1, borderRadius: 16, marginHorizontal: 16 },
+  row: { flexDirection: "row", alignItems: "center", gap: 10 },
+  center: { textAlign: "center" },
+  // `.lmsg .pb` adds 10 pt above the button on top of the card's 8 pt gap.
+  action: { marginTop: 10 },
+  holdIcon: { width: 44, height: 44, borderRadius: 22, alignItems: "center", justifyContent: "center", marginBottom: 4 },
+  consent: { flexDirection: "row", alignItems: "center", gap: 6, marginTop: 4 },
+  // `.consent` is 12 pt at the body weight.
+  consentText: { fontFamily: fontFamilies[400], flexShrink: 1 },
+  spinner: { width: 18, height: 18, borderRadius: 9, borderWidth: 2 }
+});
+
+export {
+  STAGE_GAP,
+  frameRegions,
+  DeviceLayoutProvider,
+  useDeviceLayout,
+  PortalProvider,
+  Portal,
+  PortalHost,
+  usePortalCount,
+  fixed,
+  fileKindColors,
+  chatOverlays,
+  viewer,
+  elevations,
+  fontFamilies,
+  type,
+  radii,
+  sizes,
+  durations,
+  easings,
+  pressScale,
+  timings,
+  ThemeProvider,
+  useTheme,
+  ChalkText,
+  Icon,
+  usePressAnimation,
+  IconButton,
+  PillButton,
+  announce,
+  ToastProvider,
+  useToasts,
+  useToastClearance,
+  ToastStack,
+  useBackHandler,
+  haptics,
+  BottomSheet,
+  SheetDragRegion,
+  Menu,
+  MenuItem,
+  MenuSection,
+  SheetGroup,
+  SheetRow,
+  SegmentedControl,
+  CopyButton,
+  Switch,
+  FaceAvatar,
+  Limbo
+};