@xaui/native 0.9.1-alpha.4 → 0.9.1-alpha.40

package/dist/chunk-73RKQC5X.js

@@ -0,0 +1,104 @@
+import {
+  createRecipe
+} from "./chunk-4GTAZM2C.js";
+import {
+  useXAUITheme
+} from "./chunk-A3EGFI6T.js";
+import {
+  Slot
+} from "./chunk-K72UDPVN.js";
+import {
+  useStyleProps
+} from "./chunk-M63GFNKV.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-7DPL3ZDS.cjs

@@ -0,0 +1,21 @@
+"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; }// src/hooks/use-press-state.ts
+var _react = require('react');
+function usePressState(handlers = {}) {
+  const [isPressed, setIsPressed] = _react.useState.call(void 0, false);
+  const latest = _react.useRef.call(void 0, handlers);
+  latest.current = handlers;
+  const onPressIn = _react.useCallback.call(void 0, (event) => {
+    setIsPressed(true);
+    _optionalChain([latest, 'access', _ => _.current, 'access', _2 => _2.onPressIn, 'optionalCall', _3 => _3(event)]);
+  }, []);
+  const onPressOut = _react.useCallback.call(void 0, (event) => {
+    setIsPressed(false);
+    _optionalChain([latest, 'access', _4 => _4.current, 'access', _5 => _5.onPressOut, 'optionalCall', _6 => _6(event)]);
+  }, []);
+  const press = _react.useRef.call(void 0, { onPressIn, onPressOut }).current;
+  return [isPressed, press];
+}
+
+
+
+exports.usePressState = usePressState;

package/dist/chunk-7EIHHOHP.cjs

@@ -0,0 +1,42 @@
+"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 _chunkEJQCQPETcjs = require('./chunk-EJQCQPET.cjs');
+
+// src/hooks/use-controllable-state.ts
+var _react = require('react');
+function useControllableState({
+  value,
+  defaultValue,
+  onChange
+}) {
+  const [uncontrolled, setUncontrolled] = _react.useState.call(void 0, defaultValue);
+  const isControlled = value !== void 0;
+  const current = isControlled ? value : uncontrolled;
+  useControlWarning(isControlled);
+  const latest = _react.useRef.call(void 0, current);
+  latest.current = current;
+  const onChangeRef = _react.useRef.call(void 0, onChange);
+  onChangeRef.current = onChange;
+  const controlled = _react.useRef.call(void 0, isControlled);
+  controlled.current = isControlled;
+  const set = _react.useCallback.call(void 0, (next) => {
+    const resolved = typeof next === "function" ? next(latest.current) : next;
+    if (resolved === latest.current) return;
+    if (!controlled.current) setUncontrolled(resolved);
+    _optionalChain([onChangeRef, 'access', _ => _.current, 'optionalCall', _2 => _2(resolved)]);
+  }, []);
+  return [current, set];
+}
+function useControlWarning(isControlled) {
+  const wasControlled = _react.useRef.call(void 0, isControlled);
+  if (wasControlled.current !== isControlled) {
+    _chunkEJQCQPETcjs.warnDev.call(void 0, 
+      `a component switched from ${wasControlled.current ? "controlled" : "uncontrolled"} to ${isControlled ? "controlled" : "uncontrolled"}. Decide for the life of the component: pass \`value\` always, or never. Passing \`undefined\` for a value you do control reads as "uncontrolled" here.`
+    );
+    wasControlled.current = isControlled;
+  }
+}
+
+
+
+exports.useControllableState = useControllableState;

package/dist/chunk-7GHM4GKL.cjs

@@ -0,0 +1,119 @@
+"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 _chunkH4E4HDEPcjs = require('./chunk-H4E4HDEP.cjs');
+
+// src/system/slot/children-to-string.ts
+var _react = require('react');
+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-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] = _chunkH4E4HDEPcjs.mergeRefs.call(void 0, 
+        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 = _chunkH4E4HDEPcjs.mergeRefs.call(void 0, 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));
+}
+
+
+
+
+
+
+exports.childrenToString = childrenToString; exports.createSlotContext = createSlotContext; exports.mergeProps = mergeProps; exports.Slot = Slot;

package/dist/chunk-7YF5NAHQ.cjs

@@ -0,0 +1,74 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } }
+
+
+
+
+
+
+var _chunkJ3MB4PI5cjs = require('./chunk-J3MB4PI5.cjs');
+
+
+var _chunk7GHM4GKLcjs = require('./chunk-7GHM4GKL.cjs');
+
+
+var _chunkTK44VBIEcjs = require('./chunk-TK44VBIE.cjs');
+
+// src/components/text-area/text-area-field.tsx
+var _react = require('react');
+
+// src/components/text-area/text-area.context.ts
+var [TextAreaProvider, useTextArea] = _chunk7GHM4GKLcjs.createSlotContext.call(void 0, "TextArea");
+
+// src/components/text-area/text-area-field.tsx
+var _jsxruntime = require('react/jsx-runtime');
+var TextAreaField = _react.forwardRef.call(void 0, 
+  function TextAreaField2({ style, scrollEnabled, ...props }, ref) {
+    const { textAreaStyle, textArea } = _chunkJ3MB4PI5cjs.useTextField.call(void 0, );
+    const { rows, maxRows } = useTextArea();
+    const [styleProps, rest] = _chunkTK44VBIEcjs.useStyleProps.call(void 0, props);
+    const height = _react.useMemo.call(void 0, () => {
+      const chrome = textArea.paddingVertical * 2;
+      return {
+        minHeight: rows * textArea.lineHeight + chrome,
+        // Unset, the field grows for as long as the text does. With a ceiling it stops
+        // there and scrolls, which is the only case that needs `scrollEnabled` — a
+        // multiline field that can grow has nothing to scroll.
+        maxHeight: maxRows ? maxRows * textArea.lineHeight + chrome : void 0
+      };
+    }, [rows, maxRows, textArea]);
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      _chunkJ3MB4PI5cjs.TextFieldField,
+      {
+        ref,
+        multiline: true,
+        scrollEnabled: _nullishCoalesce(scrollEnabled, () => ( maxRows !== void 0)),
+        ...rest,
+        style: [textAreaStyle, height, styleProps, style]
+      }
+    );
+  }
+);
+TextAreaField.displayName = "XAUI.TextArea.Field";
+
+// src/components/text-area/text-area.tsx
+
+
+var DEFAULT_ROWS = 3;
+var TextAreaRoot = _react.forwardRef.call(void 0, function TextArea({ rows = DEFAULT_ROWS, maxRows, children, ...props }, ref) {
+  const context = _react.useMemo.call(void 0, () => ({ rows, maxRows }), [rows, maxRows]);
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, TextAreaProvider, { value: context, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkJ3MB4PI5cjs.TextFieldRoot, { ref, ...props, children }) });
+});
+TextAreaRoot.displayName = "XAUI.TextArea.Root";
+
+// src/components/text-area/index.ts
+var TextArea2 = Object.assign(TextAreaRoot, {
+  Label: _chunkJ3MB4PI5cjs.TextFieldLabel,
+  Field: TextAreaField,
+  Description: _chunkJ3MB4PI5cjs.TextFieldDescription,
+  Error: _chunkJ3MB4PI5cjs.TextFieldError
+});
+
+
+
+
+exports.useTextArea = useTextArea; exports.TextArea = TextArea2;

package/dist/{chunk-X2K2FX3W.js → chunk-A3EGFI6T.js}

@@ -107,7 +107,10 @@ function deriveTint(tint, theme) {
     foreground,
     soft: alpha(tint, 0.15),
     softForeground: mix(tint, theme.colors.foreground, 0.2),
-    pressed: mix(tint, foreground, 0.1),
+    // Towards the mode's ink, not the tint's own foreground — the same single direction
+    // the token layer takes (P2-API-REVIEW §E). A raw tint has to behave like `accent`
+    // under the finger as much as it does at rest.
+    pressed: mix(tint, theme.colors.foreground, 0.1),
     softPressed: alpha(tint, 0.2)
   };
   cache.set(key, derived);
@@ -119,7 +122,9 @@ export {
   useXAUITheme,
   useColorMode,
   useThemeColor,
+  isHex,
   mix,
   alpha,
+  contrastOn,
   deriveTint
 };