@xaui/native 0.9.1-alpha.16 → 0.9.1-alpha.18

package/dist/chunk-5SU7FXWH.cjs

@@ -0,0 +1,448 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
+
+
+var _chunk6N5JXRUZcjs = require('./chunk-6N5JXRUZ.cjs');
+
+// src/system/style-props/use-style-props.ts
+var _react = require('react');
+
+// src/utils/style-props.ts
+var STYLE_PROP_KEYS = [
+  // Flex and layout
+  "alignContent",
+  "alignItems",
+  "alignSelf",
+  "aspectRatio",
+  "boxSizing",
+  "columnGap",
+  "direction",
+  "display",
+  "flex",
+  "flexBasis",
+  "flexDirection",
+  "flexGrow",
+  "flexShrink",
+  "flexWrap",
+  "gap",
+  "justifyContent",
+  "overflow",
+  "rowGap",
+  // Position
+  "bottom",
+  "end",
+  "inset",
+  "insetBlock",
+  "insetBlockEnd",
+  "insetBlockStart",
+  "insetInline",
+  "insetInlineEnd",
+  "insetInlineStart",
+  "position",
+  "start",
+  "top",
+  "zIndex",
+  // Margin
+  "margin",
+  "marginBlock",
+  "marginBlockEnd",
+  "marginBlockStart",
+  "marginBottom",
+  "marginEnd",
+  "marginHorizontal",
+  "marginInline",
+  "marginInlineEnd",
+  "marginInlineStart",
+  "marginStart",
+  "marginTop",
+  "marginVertical",
+  // Padding
+  "padding",
+  "paddingBlock",
+  "paddingBlockEnd",
+  "paddingBlockStart",
+  "paddingBottom",
+  "paddingEnd",
+  "paddingHorizontal",
+  "paddingInline",
+  "paddingInlineEnd",
+  "paddingInlineStart",
+  "paddingStart",
+  "paddingTop",
+  "paddingVertical",
+  // Size
+  "height",
+  "maxHeight",
+  "maxWidth",
+  "minHeight",
+  "minWidth",
+  "width",
+  // Border
+  "borderBlockColor",
+  "borderBlockEndColor",
+  "borderBlockStartColor",
+  "borderBottomColor",
+  "borderBottomEndRadius",
+  "borderBottomStartRadius",
+  "borderBottomWidth",
+  "borderColor",
+  "borderCurve",
+  "borderEndColor",
+  "borderEndEndRadius",
+  "borderEndStartRadius",
+  "borderEndWidth",
+  "borderRadius",
+  "borderStartColor",
+  "borderStartEndRadius",
+  "borderStartStartRadius",
+  "borderStartWidth",
+  "borderStyle",
+  "borderTopColor",
+  "borderTopEndRadius",
+  "borderTopStartRadius",
+  "borderTopWidth",
+  "borderWidth",
+  // Fill, shadow, and the rest of a box's paint
+  "backfaceVisibility",
+  "backgroundColor",
+  "boxShadow",
+  "cursor",
+  "elevation",
+  "experimental_backgroundImage",
+  "filter",
+  "isolation",
+  "mixBlendMode",
+  "opacity",
+  "outlineColor",
+  "outlineOffset",
+  "outlineStyle",
+  "outlineWidth",
+  "shadowColor",
+  "shadowOffset",
+  "shadowOpacity",
+  "shadowRadius",
+  // Transform
+  "rotation",
+  "scaleX",
+  "scaleY",
+  "transform",
+  "transformMatrix",
+  "transformOrigin",
+  "translateX",
+  "translateY",
+  // Text — a text slot only
+  "color",
+  "fontFamily",
+  "fontSize",
+  "fontStyle",
+  "fontVariant",
+  "fontWeight",
+  "includeFontPadding",
+  "letterSpacing",
+  "lineHeight",
+  "textAlign",
+  "textAlignVertical",
+  "textDecorationColor",
+  "textDecorationLine",
+  "textDecorationStyle",
+  "textShadowColor",
+  "textShadowOffset",
+  "textShadowRadius",
+  "textTransform",
+  "userSelect",
+  "verticalAlign",
+  "writingDirection",
+  // Image — an image slot only
+  "objectFit",
+  "overlayColor",
+  "resizeMode",
+  "tintColor"
+];
+var STYLE_PROP_KEY_SET = new Set(STYLE_PROP_KEYS);
+function splitStyleProps(props) {
+  const styleProps = {};
+  const rest = {};
+  for (const [key, value] of Object.entries(props)) {
+    if (STYLE_PROP_KEY_SET.has(key)) styleProps[key] = value;
+    else rest[key] = value;
+  }
+  return [styleProps, rest];
+}
+
+// src/system/style-props/use-style-props.ts
+function useStyleProps(props) {
+  const [styleProps, rest] = splitStyleProps(props);
+  const key = _chunk6N5JXRUZcjs.stableHash.call(void 0, styleProps);
+  return [_react.useMemo.call(void 0, () => styleProps, [key]), rest];
+}
+
+// src/system/slot/children-to-string.ts
+
+function childrenToString(children) {
+  const text = stringify(children);
+  return text === null || text === "" ? null : text;
+}
+function stringify(node) {
+  if (node === null || node === void 0 || typeof node === "boolean") return "";
+  if (typeof node === "string") return node;
+  if (typeof node === "number") return String(node);
+  if (_react.isValidElement.call(void 0, node)) return null;
+  if (Array.isArray(node)) {
+    let text = "";
+    for (const child of node) {
+      const part = stringify(child);
+      if (part === null) return null;
+      text += part;
+    }
+    return text;
+  }
+  return null;
+}
+
+// src/system/slot/create-slot-context.ts
+
+function createSlotContext(name) {
+  const Context = _react.createContext.call(void 0, null);
+  Context.displayName = `XAUI.${name}.Context`;
+  function useSlotContext() {
+    const value = _react.useContext.call(void 0, Context);
+    if (value === null) {
+      const error = new Error(
+        `XAUI: use${name} must be called inside <${name}>. A slot reads the values its root resolved, so it can only be rendered as a child of one.`
+      );
+      _optionalChain([Error, 'access', _ => _.captureStackTrace, 'optionalCall', _2 => _2(
+        error,
+        useSlotContext
+      )]);
+      throw error;
+    }
+    return value;
+  }
+  return [Context.Provider, useSlotContext];
+}
+
+// src/system/slot/merge-refs.ts
+function mergeRefs(...refs) {
+  return (value) => {
+    for (const ref of refs) {
+      if (typeof ref === "function") ref(value);
+      else if (ref) ref.current = value;
+    }
+  };
+}
+
+// src/system/slot/merge-props.ts
+var EVENT_HANDLER = /^on[A-Z]/;
+function mergeProps(ours, theirs) {
+  const merged = { ...ours };
+  for (const key of Object.keys(theirs)) {
+    const ourValue = ours[key];
+    const theirValue = theirs[key];
+    if (EVENT_HANDLER.test(key)) {
+      merged[key] = composeHandlers(ourValue, theirValue);
+    } else if (key === "style") {
+      merged[key] = mergeStyles(ourValue, theirValue);
+    } else if (key === "ref") {
+      merged[key] = mergeRefs(
+        ourValue,
+        theirValue
+      );
+    } else {
+      merged[key] = theirValue;
+    }
+  }
+  return merged;
+}
+function composeHandlers(ours, theirs) {
+  if (typeof ours !== "function") return theirs;
+  if (typeof theirs !== "function") return ours;
+  return (...args) => {
+    ;
+    ours(...args);
+    return theirs(...args);
+  };
+}
+function mergeStyles(ours, theirs) {
+  if (typeof ours === "function" || typeof theirs === "function") {
+    return (state) => [
+      resolveStyle(ours, state),
+      resolveStyle(theirs, state)
+    ];
+  }
+  return [ours, theirs];
+}
+function resolveStyle(style, state) {
+  return typeof style === "function" ? style(state) : style;
+}
+
+// src/system/slot/slot.tsx
+
+var Slot = _react.forwardRef.call(void 0, function Slot2({ children, ...ours }, ref) {
+  if (!_react.isValidElement.call(void 0, children)) {
+    throw new Error(
+      "XAUI: asChild expects exactly one React element as its child, and merges the component's props into it. Text, a fragment, several children or none give it nothing to merge into \u2014 drop `asChild` to render the component itself."
+    );
+  }
+  const child = children;
+  const merged = mergeProps(ours, child.props);
+  merged.ref = mergeRefs(ref, refOf(child));
+  return _react.cloneElement.call(void 0, child, merged);
+});
+Slot.displayName = "XAUI.Slot";
+function refOf(element) {
+  const fromProps = element.props.ref;
+  const fromElement = element.ref;
+  return _nullishCoalesce(fromProps, () => ( fromElement));
+}
+
+// src/system/recipe/resolve-tint.ts
+var TINT_SLICE_BY_SUFFIX = [
+  [/SoftForeground$/, "softForeground"],
+  [/SoftPressed$/, "softPressed"],
+  [/Soft$/, "soft"],
+  [/Foreground$/, "foreground"],
+  [/Pressed$/, "pressed"]
+];
+function tintSliceFor(token) {
+  for (const [suffix, slice] of TINT_SLICE_BY_SUFFIX) {
+    if (suffix.test(token)) return slice;
+  }
+  return "base";
+}
+function resolveTint(tokens, color, theme) {
+  const tint = _chunk6N5JXRUZcjs.deriveTint.call(void 0, color, theme);
+  const colors = {};
+  for (const [role, token] of Object.entries(_nullishCoalesce(tokens, () => ( {})))) {
+    colors[role] = tint[tintSliceFor(token)];
+  }
+  return colors;
+}
+
+// src/system/recipe/style-cache.ts
+var _reactnative = require('react-native');
+
+// src/system/recipe/variant-map.ts
+var STATE_ORDER = ["focused", "pressed", "disabled"];
+function resolveSelection(defaultVariants, selection) {
+  const resolved = { ...defaultVariants };
+  for (const [axis, value] of Object.entries(_nullishCoalesce(selection, () => ( {})))) {
+    if (value !== void 0) resolved[axis] = value;
+  }
+  return resolved;
+}
+function resolveVariantColors(tokens, theme) {
+  const colors = {};
+  for (const [role, token] of entriesOf(tokens)) {
+    const value = theme.colors[token];
+    if (value === void 0) {
+      throw new Error(
+        `XAUI: the recipe names "${token}" for its "${role}" role, but the theme has no such colour token. Check the spelling against XAUIColors.`
+      );
+    }
+    colors[role] = value;
+  }
+  return colors;
+}
+function activeStateFns(states, active) {
+  const fns = [];
+  for (const state of STATE_ORDER) {
+    const fn = active[state] ? _optionalChain([states, 'optionalAccess', _3 => _3[state]]) : void 0;
+    if (fn) fns.push(fn);
+  }
+  return fns;
+}
+function collectStyleFns(config, selection, states) {
+  const fns = [];
+  if (config.base) fns.push(config.base);
+  if (config.paint) fns.push(config.paint);
+  for (const [axis, values] of Object.entries(_nullishCoalesce(config.variants, () => ( {})))) {
+    const value = selection[axis];
+    const fn = value === void 0 ? void 0 : values[value];
+    if (fn) fns.push(fn);
+  }
+  for (const compound of _nullishCoalesce(config.compoundVariants, () => ( []))) {
+    if (appliesTo(compound.when, selection)) fns.push(compound.style);
+  }
+  return [...fns, ...activeStateFns(config.states, states)];
+}
+function appliesTo(when, selection) {
+  return Object.entries(when).every(([axis, value]) => selection[axis] === value);
+}
+function entriesOf(tokens) {
+  return Object.entries(_nullishCoalesce(tokens, () => ( {})));
+}
+
+// src/system/recipe/style-cache.ts
+function createStyleCache(slots) {
+  const entries = /* @__PURE__ */ new Map();
+  return {
+    read(key, build) {
+      const hit = entries.get(key);
+      if (hit) return hit;
+      const built = build();
+      const complete = {};
+      for (const slot of slots) complete[slot] = _nullishCoalesce(built[slot], () => ( {}));
+      const created = _reactnative.StyleSheet.create(complete);
+      entries.set(key, created);
+      return created;
+    },
+    get size() {
+      return entries.size;
+    },
+    clear() {
+      entries.clear();
+    }
+  };
+}
+function cacheKey(theme, selection, states) {
+  const axes = Object.keys(selection).sort().map((axis) => `${axis}:${_nullishCoalesce(selection[axis], () => ( "-"))}`).join("|");
+  const active = STATE_ORDER.filter((state) => states[state]).join(",");
+  return `${theme.id}|${theme.mode}|${axes}|${active}`;
+}
+
+// src/system/recipe/create-recipe.ts
+function createRecipe(config) {
+  const cache = createStyleCache(config.slots);
+  const tokensFor = (variant) => variant === void 0 ? void 0 : _optionalChain([config, 'access', _4 => _4.variantTokens, 'optionalAccess', _5 => _5[variant]]);
+  return {
+    slots: config.slots,
+    resolve({ theme, selection, states = {} }) {
+      const resolved = resolveSelection(config.defaultVariants, selection);
+      return cache.read(cacheKey(theme, resolved, states), () => {
+        const colors = resolveVariantColors(tokensFor(resolved.variant), theme);
+        return apply(collectStyleFns(config, resolved, states), theme, colors);
+      });
+    },
+    tint({ theme, color, selection, states = {} }) {
+      if (!config.paint) return {};
+      const resolved = resolveSelection(config.defaultVariants, selection);
+      const tokens = tokensFor(resolved.variant);
+      if (!tokens) return {};
+      const colors = resolveTint(tokens, color, theme);
+      const fns = [config.paint, ...activeStateFns(config.states, states)];
+      return apply(fns, theme, colors);
+    }
+  };
+}
+function apply(fns, theme, colors) {
+  const merged = {};
+  for (const fn of fns) {
+    const produced = fn(theme, colors);
+    for (const slot of Object.keys(produced)) {
+      const style = produced[slot];
+      if (!style) continue;
+      const previous = merged[slot];
+      merged[slot] = previous ? { ...previous, ...style } : style;
+    }
+  }
+  return merged;
+}
+
+
+
+
+
+
+
+
+
+exports.useStyleProps = useStyleProps; exports.childrenToString = childrenToString; exports.createSlotContext = createSlotContext; exports.mergeRefs = mergeRefs; exports.mergeProps = mergeProps; exports.Slot = Slot; exports.createRecipe = createRecipe;

package/dist/chunk-6PZF4PI7.js

@@ -0,0 +1,100 @@
+import {
+  Slot,
+  createRecipe,
+  useStyleProps
+} from "./chunk-4K3LZS7M.js";
+import {
+  useXAUITheme
+} from "./chunk-XJARE6SC.js";
+
+// src/components/typography/typography.tsx
+import { forwardRef } from "react";
+import { Text } from "react-native";
+
+// src/components/typography/typography.recipe.ts
+var SLOTS = ["root"];
+var VARIANT_TOKENS = {
+  h1: { fg: "foreground" },
+  h2: { fg: "foreground" },
+  h3: { fg: "foreground" },
+  h4: { fg: "foreground" },
+  h5: { fg: "foreground" },
+  h6: { fg: "foreground" },
+  body: { fg: "foreground" },
+  "body-sm": { fg: "foreground" },
+  "body-xs": { fg: "foreground" },
+  code: { fg: "foreground" }
+};
+var ROLES = {
+  h1: { step: "4xl", weight: "bold", family: "heading", letterSpacing: -0.5 },
+  h2: { step: "3xl", weight: "bold", family: "heading", letterSpacing: -0.4 },
+  h3: { step: "2xl", weight: "bold", family: "heading", letterSpacing: -0.3 },
+  h4: { step: "xl", weight: "semibold", family: "heading" },
+  h5: { step: "lg", weight: "semibold", family: "heading" },
+  h6: { step: "md", weight: "semibold", family: "heading" },
+  body: { step: "md", weight: "regular", family: "body" },
+  "body-sm": { step: "sm", weight: "regular", family: "body" },
+  "body-xs": { step: "xs", weight: "regular", family: "body" },
+  code: { step: "sm", weight: "regular", family: "mono", chip: true }
+};
+function metricsOf({ step, weight, family, letterSpacing, chip }) {
+  return (theme) => ({
+    root: {
+      fontSize: theme.fontSizes[step],
+      lineHeight: theme.lineHeights[step],
+      fontWeight: theme.fontWeights[weight],
+      fontFamily: theme.fontFamilies[family],
+      ...letterSpacing === void 0 ? {} : { letterSpacing },
+      ...chip === void 0 ? {} : {
+        alignSelf: "flex-start",
+        backgroundColor: theme.colors.default,
+        paddingHorizontal: theme.spacing(1.5),
+        paddingVertical: theme.spacing(0.5),
+        borderRadius: theme.radius.md
+      }
+    }
+  });
+}
+var ROLE_AXIS = Object.fromEntries(
+  Object.entries(ROLES).map(([name, spec]) => [name, metricsOf(spec)])
+);
+var typographyRecipe = createRecipe({
+  slots: SLOTS,
+  variantTokens: VARIANT_TOKENS,
+  // Ink only. The chip's fill is a token, not a role, so it belongs to the metrics above —
+  // where it also stays inside the cache key instead of being recomputed with the tint.
+  paint: (_theme, colors) => ({ root: { color: colors.fg } }),
+  variants: { variant: ROLE_AXIS },
+  defaultVariants: { variant: "body" }
+});
+
+// src/components/typography/typography.tsx
+import { jsx } from "react/jsx-runtime";
+var Typography = forwardRef(function Typography2({ children, variant, color, asChild = false, style, ...props }, ref) {
+  const theme = useXAUITheme();
+  const [styleProps, rest] = useStyleProps(props);
+  const selection = { variant };
+  const styles = typographyRecipe.resolve({ theme, selection });
+  const tint = color ? typographyRecipe.tint({ theme, color, selection }) : void 0;
+  const rootStyle = [styles.root, tint?.root, styleProps, style];
+  const Root = asChild ? Slot : Text;
+  return /* @__PURE__ */ jsx(Root, { ref, style: rootStyle, ...rest, children });
+});
+Typography.displayName = "XAUI.Typography";
+
+// src/components/typography/text-span.tsx
+import { forwardRef as forwardRef2 } from "react";
+import { Text as Text2 } from "react-native";
+import { jsx as jsx2 } from "react/jsx-runtime";
+var TextSpan = forwardRef2(function TextSpan2({ children, asChild = false, style, ...props }, ref) {
+  const [styleProps, rest] = useStyleProps(props);
+  const Root = asChild ? Slot : Text2;
+  return /* @__PURE__ */ jsx2(Root, { ref, style: [styleProps, style], ...rest, children });
+});
+TextSpan.displayName = "XAUI.TextSpan";
+
+export {
+  typographyRecipe,
+  Typography,
+  TextSpan
+};

package/dist/chunk-6VTBGBPP.cjs

@@ -0,0 +1,100 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
+
+
+
+var _chunk5SU7FXWHcjs = require('./chunk-5SU7FXWH.cjs');
+
+
+var _chunk6N5JXRUZcjs = require('./chunk-6N5JXRUZ.cjs');
+
+// src/components/typography/typography.tsx
+var _react = require('react');
+var _reactnative = require('react-native');
+
+// src/components/typography/typography.recipe.ts
+var SLOTS = ["root"];
+var VARIANT_TOKENS = {
+  h1: { fg: "foreground" },
+  h2: { fg: "foreground" },
+  h3: { fg: "foreground" },
+  h4: { fg: "foreground" },
+  h5: { fg: "foreground" },
+  h6: { fg: "foreground" },
+  body: { fg: "foreground" },
+  "body-sm": { fg: "foreground" },
+  "body-xs": { fg: "foreground" },
+  code: { fg: "foreground" }
+};
+var ROLES = {
+  h1: { step: "4xl", weight: "bold", family: "heading", letterSpacing: -0.5 },
+  h2: { step: "3xl", weight: "bold", family: "heading", letterSpacing: -0.4 },
+  h3: { step: "2xl", weight: "bold", family: "heading", letterSpacing: -0.3 },
+  h4: { step: "xl", weight: "semibold", family: "heading" },
+  h5: { step: "lg", weight: "semibold", family: "heading" },
+  h6: { step: "md", weight: "semibold", family: "heading" },
+  body: { step: "md", weight: "regular", family: "body" },
+  "body-sm": { step: "sm", weight: "regular", family: "body" },
+  "body-xs": { step: "xs", weight: "regular", family: "body" },
+  code: { step: "sm", weight: "regular", family: "mono", chip: true }
+};
+function metricsOf({ step, weight, family, letterSpacing, chip }) {
+  return (theme) => ({
+    root: {
+      fontSize: theme.fontSizes[step],
+      lineHeight: theme.lineHeights[step],
+      fontWeight: theme.fontWeights[weight],
+      fontFamily: theme.fontFamilies[family],
+      ...letterSpacing === void 0 ? {} : { letterSpacing },
+      ...chip === void 0 ? {} : {
+        alignSelf: "flex-start",
+        backgroundColor: theme.colors.default,
+        paddingHorizontal: theme.spacing(1.5),
+        paddingVertical: theme.spacing(0.5),
+        borderRadius: theme.radius.md
+      }
+    }
+  });
+}
+var ROLE_AXIS = Object.fromEntries(
+  Object.entries(ROLES).map(([name, spec]) => [name, metricsOf(spec)])
+);
+var typographyRecipe = _chunk5SU7FXWHcjs.createRecipe.call(void 0, {
+  slots: SLOTS,
+  variantTokens: VARIANT_TOKENS,
+  // Ink only. The chip's fill is a token, not a role, so it belongs to the metrics above —
+  // where it also stays inside the cache key instead of being recomputed with the tint.
+  paint: (_theme, colors) => ({ root: { color: colors.fg } }),
+  variants: { variant: ROLE_AXIS },
+  defaultVariants: { variant: "body" }
+});
+
+// src/components/typography/typography.tsx
+var _jsxruntime = require('react/jsx-runtime');
+var Typography = _react.forwardRef.call(void 0, function Typography2({ children, variant, color, asChild = false, style, ...props }, ref) {
+  const theme = _chunk6N5JXRUZcjs.useXAUITheme.call(void 0, );
+  const [styleProps, rest] = _chunk5SU7FXWHcjs.useStyleProps.call(void 0, props);
+  const selection = { variant };
+  const styles = typographyRecipe.resolve({ theme, selection });
+  const tint = color ? typographyRecipe.tint({ theme, color, selection }) : void 0;
+  const rootStyle = [styles.root, _optionalChain([tint, 'optionalAccess', _ => _.root]), styleProps, style];
+  const Root = asChild ? _chunk5SU7FXWHcjs.Slot : _reactnative.Text;
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Root, { ref, style: rootStyle, ...rest, children });
+});
+Typography.displayName = "XAUI.Typography";
+
+// src/components/typography/text-span.tsx
+
+
+
+var TextSpan = _react.forwardRef.call(void 0, function TextSpan2({ children, asChild = false, style, ...props }, ref) {
+  const [styleProps, rest] = _chunk5SU7FXWHcjs.useStyleProps.call(void 0, props);
+  const Root = asChild ? _chunk5SU7FXWHcjs.Slot : _reactnative.Text;
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Root, { ref, style: [styleProps, style], ...rest, children });
+});
+TextSpan.displayName = "XAUI.TextSpan";
+
+
+
+
+
+exports.typographyRecipe = typographyRecipe; exports.Typography = Typography; exports.TextSpan = TextSpan;

package/dist/{chunk-KCUT47FY.cjs → chunk-BHAHJHAI.cjs}

@@ -47,6 +47,7 @@ function deriveColors(s) {
 }
 
 // src/theme/scales.ts
+
 var SPACING_UNIT = 4;
 var RADIUS_BASE = 12;
 function buildRadius(base) {
@@ -98,7 +99,10 @@ var fontWeights = {
 var fontFamilies = {
   body: "System",
   heading: "System",
-  mono: "monospace"
+  // `'monospace'` is an Android family name, not a generic one: iOS does not resolve it and
+  // silently falls back to the system face, so code set with it is not monospaced there.
+  // Menlo is the face iOS ships, and it is what HeroUI Native selects for the same reason.
+  mono: _reactnative.Platform.OS === "ios" ? "Menlo" : "monospace"
 };
 var borderWidth = { default: 1, field: 1 };
 var opacity = { disabled: 0.5 };

package/dist/{chunk-UOJBK5Z4.js → chunk-L3AQNVRN.js}

@@ -1,6 +1,6 @@
 import {
   useStyleProps
-} from "./chunk-64L44HEI.js";
+} from "./chunk-4K3LZS7M.js";
 
 // src/system/portal/portal.tsx
 import { useContext, useId, useLayoutEffect } from "react";

package/dist/{chunk-BAACHVM4.cjs → chunk-M2VYRHVS.cjs}

@@ -1,6 +1,6 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
 
-var _chunkPUER6Y4Mcjs = require('./chunk-PUER6Y4M.cjs');
+var _chunk5SU7FXWHcjs = require('./chunk-5SU7FXWH.cjs');
 
 // src/system/portal/portal.tsx
 var _react = require('react');
@@ -31,7 +31,7 @@ var styles = _reactnative.StyleSheet.create({
   container: { flex: 1 }
 });
 function PortalHost({ children, ...props }) {
-  const [styleProps] = _chunkPUER6Y4Mcjs.useStyleProps.call(void 0, props);
+  const [styleProps] = _chunk5SU7FXWHcjs.useStyleProps.call(void 0, props);
   const [portals, setPortals] = _react.useState.call(void 0, /* @__PURE__ */ new Map());
   const addPortal = _react.useCallback.call(void 0, (key, element) => {
     setPortals((current) => new Map(current).set(key, element));