@xaui/native 0.9.1-alpha.5 → 0.9.1-alpha.7

package/dist/{chunk-PSSG6C3Q.cjs → chunk-46M765BS.cjs}

@@ -741,4 +741,4 @@ function stringify(node) {
 
 
 
-exports.IconContext = IconContext; exports.useIconContext = useIconContext; exports.Icon = Icon; exports.PortalContext = PortalContext; exports.Portal = Portal; exports.PortalHost = PortalHost; exports.createSlotContext = createSlotContext; exports.useFeedback = useFeedback; exports.PRESS_SCALE = PRESS_SCALE; exports.PRESS_DURATION = PRESS_DURATION; exports.RELEASE_DURATION = RELEASE_DURATION; exports.HIGHLIGHT_OPACITY = HIGHLIGHT_OPACITY; exports.RIPPLE_OPACITY = RIPPLE_OPACITY; exports.RIPPLE_DURATION = RIPPLE_DURATION; exports.RIPPLE_COVERAGE = RIPPLE_COVERAGE; exports.resolveAnimation = resolveAnimation; exports.resolveSlotAnimation = resolveSlotAnimation; exports.mergeRefs = mergeRefs; exports.mergeProps = mergeProps; exports.Slot = Slot; exports.PressableFeedback = PressableFeedback3; exports.createRecipe = createRecipe; exports.childrenToString = childrenToString;
+exports.mergeRefs = mergeRefs; exports.IconContext = IconContext; exports.useIconContext = useIconContext; exports.Icon = Icon; exports.PortalContext = PortalContext; exports.Portal = Portal; exports.PortalHost = PortalHost; exports.createSlotContext = createSlotContext; exports.useFeedback = useFeedback; exports.PRESS_SCALE = PRESS_SCALE; exports.PRESS_DURATION = PRESS_DURATION; exports.RELEASE_DURATION = RELEASE_DURATION; exports.HIGHLIGHT_OPACITY = HIGHLIGHT_OPACITY; exports.RIPPLE_OPACITY = RIPPLE_OPACITY; exports.RIPPLE_DURATION = RIPPLE_DURATION; exports.RIPPLE_COVERAGE = RIPPLE_COVERAGE; exports.resolveAnimation = resolveAnimation; exports.resolveSlotAnimation = resolveSlotAnimation; exports.mergeProps = mergeProps; exports.Slot = Slot; exports.PressableFeedback = PressableFeedback3; exports.createRecipe = createRecipe; exports.childrenToString = childrenToString;

package/dist/index.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+"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; }
 
 
 
@@ -22,7 +22,7 @@
 
 
 
-var _chunkPSSG6C3Qcjs = require('./chunk-PSSG6C3Q.cjs');
+var _chunk46M765BScjs = require('./chunk-46M765BS.cjs');
 
 
 
@@ -43,14 +43,82 @@ var _chunkAW63PTQ4cjs = require('./chunk-AW63PTQ4.cjs');
 
 var _chunk3QBT3Q65cjs = require('./chunk-3QBT3Q65.cjs');
 
+// src/hooks/use-controllable-state.ts
+var _react = require('react');
 
+// src/utils/warn-dev.ts
+function warnDev(message) {
+  if (typeof __DEV__ !== "undefined" && !__DEV__) return;
+  console.warn(`XAUI: ${message}`);
+}
 
+// src/hooks/use-controllable-state.ts
+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) {
+    warnDev(
+      `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;
+  }
+}
 
+// src/hooks/use-merged-ref.ts
 
+function useMergedRef(...refs) {
+  return _react.useMemo.call(void 0, () => _chunk46M765BScjs.mergeRefs.call(void 0, ...refs), refs);
+}
 
+// src/hooks/use-press-state.ts
 
+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', _3 => _3.current, 'access', _4 => _4.onPressIn, 'optionalCall', _5 => _5(event)]);
+  }, []);
+  const onPressOut = _react.useCallback.call(void 0, (event) => {
+    setIsPressed(false);
+    _optionalChain([latest, 'access', _6 => _6.current, 'access', _7 => _7.onPressOut, 'optionalCall', _8 => _8(event)]);
+  }, []);
+  const press = _react.useRef.call(void 0, { onPressIn, onPressOut }).current;
+  return [isPressed, press];
+}
 
+// src/hooks/use-previous.ts
 
+function usePrevious(value) {
+  const previous = _react.useRef.call(void 0, void 0);
+  _react.useEffect.call(void 0, () => {
+    previous.current = value;
+  }, [value]);
+  return previous.current;
+}
 
 
 
@@ -81,4 +149,17 @@ var _chunk3QBT3Q65cjs = require('./chunk-3QBT3Q65.cjs');
 
 
 
-exports.HIGHLIGHT_OPACITY = _chunkPSSG6C3Qcjs.HIGHLIGHT_OPACITY; exports.Icon = _chunkPSSG6C3Qcjs.Icon; exports.IconContext = _chunkPSSG6C3Qcjs.IconContext; exports.PRESS_DURATION = _chunkPSSG6C3Qcjs.PRESS_DURATION; exports.PRESS_SCALE = _chunkPSSG6C3Qcjs.PRESS_SCALE; exports.Portal = _chunkPSSG6C3Qcjs.Portal; exports.PortalContext = _chunkPSSG6C3Qcjs.PortalContext; exports.PortalHost = _chunkPSSG6C3Qcjs.PortalHost; exports.PressableFeedback = _chunkPSSG6C3Qcjs.PressableFeedback; exports.RELEASE_DURATION = _chunkPSSG6C3Qcjs.RELEASE_DURATION; exports.RIPPLE_COVERAGE = _chunkPSSG6C3Qcjs.RIPPLE_COVERAGE; exports.RIPPLE_DURATION = _chunkPSSG6C3Qcjs.RIPPLE_DURATION; exports.RIPPLE_OPACITY = _chunkPSSG6C3Qcjs.RIPPLE_OPACITY; exports.Slot = _chunkPSSG6C3Qcjs.Slot; exports.ThemeContext = _chunk3QBT3Q65cjs.ThemeContext; exports.XAUIProvider = _chunkAW63PTQ4cjs.XAUIProvider; exports.buildRadius = _chunkAW63PTQ4cjs.buildRadius; exports.buildShadows = _chunkAW63PTQ4cjs.buildShadows; exports.childrenToString = _chunkPSSG6C3Qcjs.childrenToString; exports.createRecipe = _chunkPSSG6C3Qcjs.createRecipe; exports.createSlotContext = _chunkPSSG6C3Qcjs.createSlotContext; exports.createTheme = _chunkAW63PTQ4cjs.createTheme; exports.defaultTheme = _chunkAW63PTQ4cjs.defaultTheme; exports.deriveColors = _chunkAW63PTQ4cjs.deriveColors; exports.deriveTint = _chunk3QBT3Q65cjs.deriveTint; exports.mergeProps = _chunkPSSG6C3Qcjs.mergeProps; exports.mergeRefs = _chunkPSSG6C3Qcjs.mergeRefs; exports.palette = _chunkAW63PTQ4cjs.palette; exports.primitives = _chunkAW63PTQ4cjs.primitives; exports.resolveAnimation = _chunkPSSG6C3Qcjs.resolveAnimation; exports.resolveSlotAnimation = _chunkPSSG6C3Qcjs.resolveSlotAnimation; exports.sourceKeys = _chunkAW63PTQ4cjs.sourceKeys; exports.tokens = _chunkAW63PTQ4cjs.tokens; exports.useColorMode = _chunk3QBT3Q65cjs.useColorMode; exports.useFeedback = _chunkPSSG6C3Qcjs.useFeedback; exports.useIconContext = _chunkPSSG6C3Qcjs.useIconContext; exports.useThemeColor = _chunk3QBT3Q65cjs.useThemeColor; exports.useXAUITheme = _chunk3QBT3Q65cjs.useXAUITheme;
+
+
+
+
+
+
+
+
+
+
+
+
+
+exports.HIGHLIGHT_OPACITY = _chunk46M765BScjs.HIGHLIGHT_OPACITY; exports.Icon = _chunk46M765BScjs.Icon; exports.IconContext = _chunk46M765BScjs.IconContext; exports.PRESS_DURATION = _chunk46M765BScjs.PRESS_DURATION; exports.PRESS_SCALE = _chunk46M765BScjs.PRESS_SCALE; exports.Portal = _chunk46M765BScjs.Portal; exports.PortalContext = _chunk46M765BScjs.PortalContext; exports.PortalHost = _chunk46M765BScjs.PortalHost; exports.PressableFeedback = _chunk46M765BScjs.PressableFeedback; exports.RELEASE_DURATION = _chunk46M765BScjs.RELEASE_DURATION; exports.RIPPLE_COVERAGE = _chunk46M765BScjs.RIPPLE_COVERAGE; exports.RIPPLE_DURATION = _chunk46M765BScjs.RIPPLE_DURATION; exports.RIPPLE_OPACITY = _chunk46M765BScjs.RIPPLE_OPACITY; exports.Slot = _chunk46M765BScjs.Slot; exports.ThemeContext = _chunk3QBT3Q65cjs.ThemeContext; exports.XAUIProvider = _chunkAW63PTQ4cjs.XAUIProvider; exports.buildRadius = _chunkAW63PTQ4cjs.buildRadius; exports.buildShadows = _chunkAW63PTQ4cjs.buildShadows; exports.childrenToString = _chunk46M765BScjs.childrenToString; exports.createRecipe = _chunk46M765BScjs.createRecipe; exports.createSlotContext = _chunk46M765BScjs.createSlotContext; exports.createTheme = _chunkAW63PTQ4cjs.createTheme; exports.defaultTheme = _chunkAW63PTQ4cjs.defaultTheme; exports.deriveColors = _chunkAW63PTQ4cjs.deriveColors; exports.deriveTint = _chunk3QBT3Q65cjs.deriveTint; exports.mergeProps = _chunk46M765BScjs.mergeProps; exports.mergeRefs = _chunk46M765BScjs.mergeRefs; exports.palette = _chunkAW63PTQ4cjs.palette; exports.primitives = _chunkAW63PTQ4cjs.primitives; exports.resolveAnimation = _chunk46M765BScjs.resolveAnimation; exports.resolveSlotAnimation = _chunk46M765BScjs.resolveSlotAnimation; exports.sourceKeys = _chunkAW63PTQ4cjs.sourceKeys; exports.tokens = _chunkAW63PTQ4cjs.tokens; exports.useColorMode = _chunk3QBT3Q65cjs.useColorMode; exports.useControllableState = useControllableState; exports.useFeedback = _chunk46M765BScjs.useFeedback; exports.useIconContext = _chunk46M765BScjs.useIconContext; exports.useMergedRef = useMergedRef; exports.usePressState = usePressState; exports.usePrevious = usePrevious; exports.useThemeColor = _chunk3QBT3Q65cjs.useThemeColor; exports.useXAUITheme = _chunk3QBT3Q65cjs.useXAUITheme;

package/dist/index.d.cts

@@ -1,6 +1,64 @@
-export { AnimationConfig, AnimationProp, AsChildProps, Axes, CompoundVariant, FeedbackContext, FeedbackVariant, HIGHLIGHT_OPACITY, Icon, IconComponentProps, IconContext, IconContextValue, IconProps, MergeableProps, PRESS_DURATION, PRESS_SCALE, Portal, PortalContext, PortalHost, PortalHostProps, PortalMethods, PortalProps, PossibleRef, PressableFeedback, PressableFeedbackHighlightProps, PressableFeedbackProps, PressableFeedbackRippleProps, RELEASE_DURATION, RIPPLE_COVERAGE, RIPPLE_DURATION, RIPPLE_OPACITY, Recipe, RecipeConfig, ResolveArgs, ResolvedAnimation, ResolvedSelection, ResolvedStyles, Selection, Slot, SlotAnimation, SlotProps, SlotStyle, SlotStyles, StateName, States, StyleFn, TintArgs, VariantColors, VariantRole, VariantTokens, childrenToString, createRecipe, createSlotContext, mergeProps, mergeRefs, resolveAnimation, resolveSlotAnimation, useFeedback, useIconContext } from './system/index.cjs';
+import { RefCallback } from 'react';
+import { PossibleRef } from './system/index.cjs';
+export { AnimationConfig, AnimationProp, AsChildProps, Axes, CompoundVariant, FeedbackContext, FeedbackVariant, HIGHLIGHT_OPACITY, Icon, IconComponentProps, IconContext, IconContextValue, IconProps, MergeableProps, PRESS_DURATION, PRESS_SCALE, Portal, PortalContext, PortalHost, PortalHostProps, PortalMethods, PortalProps, PressableFeedback, PressableFeedbackHighlightProps, PressableFeedbackProps, PressableFeedbackRippleProps, RELEASE_DURATION, RIPPLE_COVERAGE, RIPPLE_DURATION, RIPPLE_OPACITY, Recipe, RecipeConfig, ResolveArgs, ResolvedAnimation, ResolvedSelection, ResolvedStyles, Selection, Slot, SlotAnimation, SlotProps, SlotStyle, SlotStyles, StateName, States, StyleFn, TintArgs, VariantColors, VariantRole, VariantTokens, childrenToString, createRecipe, createSlotContext, mergeProps, mergeRefs, resolveAnimation, resolveSlotAnimation, useFeedback, useIconContext } from './system/index.cjs';
+import { GestureResponderEvent } from 'react-native';
 export { ColorModePreference, PaletteFamily, PaletteShade, ThemeContext, XAUIProvider, XAUIProviderProps, XAUITint, buildRadius, buildShadows, createTheme, defaultTheme, deriveColors, deriveTint, palette, primitives, sourceKeys, tokens, useColorMode, useThemeColor, useXAUITheme } from './theme/index.cjs';
 export { C as ColorMode, F as FontSizeKey, a as FontWeightKey, R as RadiusKey, S as Size, X as XAUIColors, b as XAUIDerivedColors, c as XAUIPrimitiveColors, d as XAUIRadius, e as XAUIShadow, f as XAUISourceColors, g as XAUITheme, h as XAUIThemeConfig, i as XAUIThemeSet } from './theme.type-C9bFJKFm.cjs';
-import 'react';
-import 'react-native';
 import 'react-native-reanimated';
+
+type ControllableStateOptions<T> = {
+    /** Present means controlled: the caller owns the value and this never stores one. */
+    value?: T;
+    /** The starting value when uncontrolled. */
+    defaultValue: T;
+    /** Called with every new value, controlled or not. */
+    onChange?: (value: T) => void;
+};
+/**
+ * One state that works both ways, so a component never has two code paths for "the
+ * caller drives this" and "we do".
+ *
+ * The setter is stable across renders and reads the current value from a ref, so a
+ * handler built on it can be passed to a memoized child without rebuilding it on every
+ * render — which is the whole reason components reach for this rather than a local
+ * `useState` plus an `if`.
+ */
+declare function useControllableState<T>({ value, defaultValue, onChange, }: ControllableStateOptions<T>): [T, (next: T | ((current: T) => T)) => void];
+
+/**
+ * `mergeRefs` for a component that renders: memoized on the refs it was given, so React
+ * does not detach and reattach every one of them on each render — which it does whenever
+ * a ref callback changes identity, and which costs a node measurement every time.
+ */
+declare function useMergedRef<T>(...refs: Array<PossibleRef<T>>): RefCallback<T>;
+
+type PressHandlers = {
+    onPressIn?: (event: GestureResponderEvent) => void;
+    onPressOut?: (event: GestureResponderEvent) => void;
+};
+/**
+ * The press state a root owns, with the handlers that maintain it.
+ *
+ * It exists because every pressable component needs the same three things and gets one
+ * of them wrong on its own: the state has to be *up here* — the recipe resolves on it
+ * (R5) — the caller's handlers must be **composed, never replaced**, and the returned
+ * handlers must keep their identity so passing them down does not defeat a memo.
+ *
+ * ```tsx
+ * const [isPressed, pressHandlers] = usePressState(props)
+ * const styles = recipe.resolve({ theme, selection, states: { pressed: isPressed } })
+ * <PressableFeedback isPressed={isPressed} {...pressHandlers} />
+ * ```
+ */
+declare function usePressState(handlers?: PressHandlers): [boolean, Required<PressHandlers>];
+
+/**
+ * The value from the render before this one, `undefined` on the first.
+ *
+ * Written in an effect rather than during render on purpose: reading it mid-render would
+ * make "previous" mean something different depending on whether React re-ran the render,
+ * which under StrictMode it does.
+ */
+declare function usePrevious<T>(value: T): T | undefined;
+
+export { type ControllableStateOptions, PossibleRef, type PressHandlers, useControllableState, useMergedRef, usePressState, usePrevious };

package/dist/index.d.ts

@@ -1,6 +1,64 @@
-export { AnimationConfig, AnimationProp, AsChildProps, Axes, CompoundVariant, FeedbackContext, FeedbackVariant, HIGHLIGHT_OPACITY, Icon, IconComponentProps, IconContext, IconContextValue, IconProps, MergeableProps, PRESS_DURATION, PRESS_SCALE, Portal, PortalContext, PortalHost, PortalHostProps, PortalMethods, PortalProps, PossibleRef, PressableFeedback, PressableFeedbackHighlightProps, PressableFeedbackProps, PressableFeedbackRippleProps, RELEASE_DURATION, RIPPLE_COVERAGE, RIPPLE_DURATION, RIPPLE_OPACITY, Recipe, RecipeConfig, ResolveArgs, ResolvedAnimation, ResolvedSelection, ResolvedStyles, Selection, Slot, SlotAnimation, SlotProps, SlotStyle, SlotStyles, StateName, States, StyleFn, TintArgs, VariantColors, VariantRole, VariantTokens, childrenToString, createRecipe, createSlotContext, mergeProps, mergeRefs, resolveAnimation, resolveSlotAnimation, useFeedback, useIconContext } from './system/index.js';
+import { RefCallback } from 'react';
+import { PossibleRef } from './system/index.js';
+export { AnimationConfig, AnimationProp, AsChildProps, Axes, CompoundVariant, FeedbackContext, FeedbackVariant, HIGHLIGHT_OPACITY, Icon, IconComponentProps, IconContext, IconContextValue, IconProps, MergeableProps, PRESS_DURATION, PRESS_SCALE, Portal, PortalContext, PortalHost, PortalHostProps, PortalMethods, PortalProps, PressableFeedback, PressableFeedbackHighlightProps, PressableFeedbackProps, PressableFeedbackRippleProps, RELEASE_DURATION, RIPPLE_COVERAGE, RIPPLE_DURATION, RIPPLE_OPACITY, Recipe, RecipeConfig, ResolveArgs, ResolvedAnimation, ResolvedSelection, ResolvedStyles, Selection, Slot, SlotAnimation, SlotProps, SlotStyle, SlotStyles, StateName, States, StyleFn, TintArgs, VariantColors, VariantRole, VariantTokens, childrenToString, createRecipe, createSlotContext, mergeProps, mergeRefs, resolveAnimation, resolveSlotAnimation, useFeedback, useIconContext } from './system/index.js';
+import { GestureResponderEvent } from 'react-native';
 export { ColorModePreference, PaletteFamily, PaletteShade, ThemeContext, XAUIProvider, XAUIProviderProps, XAUITint, buildRadius, buildShadows, createTheme, defaultTheme, deriveColors, deriveTint, palette, primitives, sourceKeys, tokens, useColorMode, useThemeColor, useXAUITheme } from './theme/index.js';
 export { C as ColorMode, F as FontSizeKey, a as FontWeightKey, R as RadiusKey, S as Size, X as XAUIColors, b as XAUIDerivedColors, c as XAUIPrimitiveColors, d as XAUIRadius, e as XAUIShadow, f as XAUISourceColors, g as XAUITheme, h as XAUIThemeConfig, i as XAUIThemeSet } from './theme.type-C9bFJKFm.js';
-import 'react';
-import 'react-native';
 import 'react-native-reanimated';
+
+type ControllableStateOptions<T> = {
+    /** Present means controlled: the caller owns the value and this never stores one. */
+    value?: T;
+    /** The starting value when uncontrolled. */
+    defaultValue: T;
+    /** Called with every new value, controlled or not. */
+    onChange?: (value: T) => void;
+};
+/**
+ * One state that works both ways, so a component never has two code paths for "the
+ * caller drives this" and "we do".
+ *
+ * The setter is stable across renders and reads the current value from a ref, so a
+ * handler built on it can be passed to a memoized child without rebuilding it on every
+ * render — which is the whole reason components reach for this rather than a local
+ * `useState` plus an `if`.
+ */
+declare function useControllableState<T>({ value, defaultValue, onChange, }: ControllableStateOptions<T>): [T, (next: T | ((current: T) => T)) => void];
+
+/**
+ * `mergeRefs` for a component that renders: memoized on the refs it was given, so React
+ * does not detach and reattach every one of them on each render — which it does whenever
+ * a ref callback changes identity, and which costs a node measurement every time.
+ */
+declare function useMergedRef<T>(...refs: Array<PossibleRef<T>>): RefCallback<T>;
+
+type PressHandlers = {
+    onPressIn?: (event: GestureResponderEvent) => void;
+    onPressOut?: (event: GestureResponderEvent) => void;
+};
+/**
+ * The press state a root owns, with the handlers that maintain it.
+ *
+ * It exists because every pressable component needs the same three things and gets one
+ * of them wrong on its own: the state has to be *up here* — the recipe resolves on it
+ * (R5) — the caller's handlers must be **composed, never replaced**, and the returned
+ * handlers must keep their identity so passing them down does not defeat a memo.
+ *
+ * ```tsx
+ * const [isPressed, pressHandlers] = usePressState(props)
+ * const styles = recipe.resolve({ theme, selection, states: { pressed: isPressed } })
+ * <PressableFeedback isPressed={isPressed} {...pressHandlers} />
+ * ```
+ */
+declare function usePressState(handlers?: PressHandlers): [boolean, Required<PressHandlers>];
+
+/**
+ * The value from the render before this one, `undefined` on the first.
+ *
+ * Written in an effect rather than during render on purpose: reading it mid-render would
+ * make "previous" mean something different depending on whether React re-ran the render,
+ * which under StrictMode it does.
+ */
+declare function usePrevious<T>(value: T): T | undefined;
+
+export { type ControllableStateOptions, PossibleRef, type PressHandlers, useControllableState, useMergedRef, usePressState, usePrevious };

package/dist/index.js

@@ -22,7 +22,7 @@ import {
   resolveSlotAnimation,
   useFeedback,
   useIconContext
-} from "./chunk-AUDOMZR3.js";
+} from "./chunk-GYK2CAX4.js";
 import {
   XAUIProvider,
   buildRadius,
@@ -42,6 +42,83 @@ import {
   useThemeColor,
   useXAUITheme
 } from "./chunk-X2K2FX3W.js";
+
+// src/hooks/use-controllable-state.ts
+import { useCallback, useRef, useState } from "react";
+
+// src/utils/warn-dev.ts
+function warnDev(message) {
+  if (typeof __DEV__ !== "undefined" && !__DEV__) return;
+  console.warn(`XAUI: ${message}`);
+}
+
+// src/hooks/use-controllable-state.ts
+function useControllableState({
+  value,
+  defaultValue,
+  onChange
+}) {
+  const [uncontrolled, setUncontrolled] = useState(defaultValue);
+  const isControlled = value !== void 0;
+  const current = isControlled ? value : uncontrolled;
+  useControlWarning(isControlled);
+  const latest = useRef(current);
+  latest.current = current;
+  const onChangeRef = useRef(onChange);
+  onChangeRef.current = onChange;
+  const controlled = useRef(isControlled);
+  controlled.current = isControlled;
+  const set = useCallback((next) => {
+    const resolved = typeof next === "function" ? next(latest.current) : next;
+    if (resolved === latest.current) return;
+    if (!controlled.current) setUncontrolled(resolved);
+    onChangeRef.current?.(resolved);
+  }, []);
+  return [current, set];
+}
+function useControlWarning(isControlled) {
+  const wasControlled = useRef(isControlled);
+  if (wasControlled.current !== isControlled) {
+    warnDev(
+      `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;
+  }
+}
+
+// src/hooks/use-merged-ref.ts
+import { useMemo } from "react";
+function useMergedRef(...refs) {
+  return useMemo(() => mergeRefs(...refs), refs);
+}
+
+// src/hooks/use-press-state.ts
+import { useCallback as useCallback2, useRef as useRef2, useState as useState2 } from "react";
+function usePressState(handlers = {}) {
+  const [isPressed, setIsPressed] = useState2(false);
+  const latest = useRef2(handlers);
+  latest.current = handlers;
+  const onPressIn = useCallback2((event) => {
+    setIsPressed(true);
+    latest.current.onPressIn?.(event);
+  }, []);
+  const onPressOut = useCallback2((event) => {
+    setIsPressed(false);
+    latest.current.onPressOut?.(event);
+  }, []);
+  const press = useRef2({ onPressIn, onPressOut }).current;
+  return [isPressed, press];
+}
+
+// src/hooks/use-previous.ts
+import { useEffect, useRef as useRef3 } from "react";
+function usePrevious(value) {
+  const previous = useRef3(void 0);
+  useEffect(() => {
+    previous.current = value;
+  }, [value]);
+  return previous.current;
+}
 export {
   HIGHLIGHT_OPACITY,
   Icon,
@@ -77,8 +154,12 @@ export {
   sourceKeys,
   tokens,
   useColorMode,
+  useControllableState,
   useFeedback,
   useIconContext,
+  useMergedRef,
+  usePressState,
+  usePrevious,
   useThemeColor,
   useXAUITheme
 };

package/dist/system/index.cjs

@@ -22,7 +22,7 @@
 
 
 
-var _chunkPSSG6C3Qcjs = require('../chunk-PSSG6C3Q.cjs');
+var _chunk46M765BScjs = require('../chunk-46M765BS.cjs');
 require('../chunk-3QBT3Q65.cjs');
 
 
@@ -48,4 +48,4 @@ require('../chunk-3QBT3Q65.cjs');
 
 
 
-exports.HIGHLIGHT_OPACITY = _chunkPSSG6C3Qcjs.HIGHLIGHT_OPACITY; exports.Icon = _chunkPSSG6C3Qcjs.Icon; exports.IconContext = _chunkPSSG6C3Qcjs.IconContext; exports.PRESS_DURATION = _chunkPSSG6C3Qcjs.PRESS_DURATION; exports.PRESS_SCALE = _chunkPSSG6C3Qcjs.PRESS_SCALE; exports.Portal = _chunkPSSG6C3Qcjs.Portal; exports.PortalContext = _chunkPSSG6C3Qcjs.PortalContext; exports.PortalHost = _chunkPSSG6C3Qcjs.PortalHost; exports.PressableFeedback = _chunkPSSG6C3Qcjs.PressableFeedback; exports.RELEASE_DURATION = _chunkPSSG6C3Qcjs.RELEASE_DURATION; exports.RIPPLE_COVERAGE = _chunkPSSG6C3Qcjs.RIPPLE_COVERAGE; exports.RIPPLE_DURATION = _chunkPSSG6C3Qcjs.RIPPLE_DURATION; exports.RIPPLE_OPACITY = _chunkPSSG6C3Qcjs.RIPPLE_OPACITY; exports.Slot = _chunkPSSG6C3Qcjs.Slot; exports.childrenToString = _chunkPSSG6C3Qcjs.childrenToString; exports.createRecipe = _chunkPSSG6C3Qcjs.createRecipe; exports.createSlotContext = _chunkPSSG6C3Qcjs.createSlotContext; exports.mergeProps = _chunkPSSG6C3Qcjs.mergeProps; exports.mergeRefs = _chunkPSSG6C3Qcjs.mergeRefs; exports.resolveAnimation = _chunkPSSG6C3Qcjs.resolveAnimation; exports.resolveSlotAnimation = _chunkPSSG6C3Qcjs.resolveSlotAnimation; exports.useFeedback = _chunkPSSG6C3Qcjs.useFeedback; exports.useIconContext = _chunkPSSG6C3Qcjs.useIconContext;
+exports.HIGHLIGHT_OPACITY = _chunk46M765BScjs.HIGHLIGHT_OPACITY; exports.Icon = _chunk46M765BScjs.Icon; exports.IconContext = _chunk46M765BScjs.IconContext; exports.PRESS_DURATION = _chunk46M765BScjs.PRESS_DURATION; exports.PRESS_SCALE = _chunk46M765BScjs.PRESS_SCALE; exports.Portal = _chunk46M765BScjs.Portal; exports.PortalContext = _chunk46M765BScjs.PortalContext; exports.PortalHost = _chunk46M765BScjs.PortalHost; exports.PressableFeedback = _chunk46M765BScjs.PressableFeedback; exports.RELEASE_DURATION = _chunk46M765BScjs.RELEASE_DURATION; exports.RIPPLE_COVERAGE = _chunk46M765BScjs.RIPPLE_COVERAGE; exports.RIPPLE_DURATION = _chunk46M765BScjs.RIPPLE_DURATION; exports.RIPPLE_OPACITY = _chunk46M765BScjs.RIPPLE_OPACITY; exports.Slot = _chunk46M765BScjs.Slot; exports.childrenToString = _chunk46M765BScjs.childrenToString; exports.createRecipe = _chunk46M765BScjs.createRecipe; exports.createSlotContext = _chunk46M765BScjs.createSlotContext; exports.mergeProps = _chunk46M765BScjs.mergeProps; exports.mergeRefs = _chunk46M765BScjs.mergeRefs; exports.resolveAnimation = _chunk46M765BScjs.resolveAnimation; exports.resolveSlotAnimation = _chunk46M765BScjs.resolveSlotAnimation; exports.useFeedback = _chunk46M765BScjs.useFeedback; exports.useIconContext = _chunk46M765BScjs.useIconContext;

package/dist/system/index.d.cts

@@ -1,10 +1,25 @@
 import * as react from 'react';
-import { ComponentType, ReactNode, Provider, Ref, RefCallback } from 'react';
+import { Ref, ComponentType, ReactNode, Provider, RefCallback } from 'react';
 import * as react_native from 'react-native';
 import { ImageSourcePropType, StyleProp, ImageStyle, PressableProps, ViewStyle, TextStyle } from 'react-native';
 import { SharedValue } from 'react-native-reanimated';
 import { g as XAUITheme, X as XAUIColors } from '../theme.type-C9bFJKFm.cjs';
 
+/** Anything React accepts as a ref, plus the absence of one. */
+type PossibleRef<T> = Ref<T> | undefined;
+/**
+ * The props `mergeProps` knows how to combine. Deliberately loose: it merges whatever a
+ * root hands to whatever child it was given, and neither side is knowable from here.
+ */
+type MergeableProps = Record<string, unknown>;
+type AsChildProps = {
+    /**
+     * Merge this component's props into its single child instead of rendering an element
+     * of its own — a navigation `Link` as a `Button`, a bespoke trigger as a `Select`.
+     */
+    asChild?: boolean;
+};
+
 /**
  * The props Lucide, Ionicons and `react-native-vector-icons` all accept — the shape
  * `as` is handed. It is a convention rather than an interface anyone published, which is
@@ -389,21 +404,6 @@ declare function childrenToString(children: ReactNode): string | null;
  */
 declare function createSlotContext<T>(name: string): readonly [Provider<T | null>, () => T];
 
-/** Anything React accepts as a ref, plus the absence of one. */
-type PossibleRef<T> = Ref<T> | undefined;
-/**
- * The props `mergeProps` knows how to combine. Deliberately loose: it merges whatever a
- * root hands to whatever child it was given, and neither side is knowable from here.
- */
-type MergeableProps = Record<string, unknown>;
-type AsChildProps = {
-    /**
-     * Merge this component's props into its single child instead of rendering an element
-     * of its own — a navigation `Link` as a `Button`, a bespoke trigger as a `Select`.
-     */
-    asChild?: boolean;
-};
-
 /**
  * Merges a root's own props into the child it renders through `asChild` (R12). Four
  * rules, and the child wins wherever they do not apply — it is the more specific intent:

package/dist/system/index.d.ts

@@ -1,10 +1,25 @@
 import * as react from 'react';
-import { ComponentType, ReactNode, Provider, Ref, RefCallback } from 'react';
+import { Ref, ComponentType, ReactNode, Provider, RefCallback } from 'react';
 import * as react_native from 'react-native';
 import { ImageSourcePropType, StyleProp, ImageStyle, PressableProps, ViewStyle, TextStyle } from 'react-native';
 import { SharedValue } from 'react-native-reanimated';
 import { g as XAUITheme, X as XAUIColors } from '../theme.type-C9bFJKFm.js';
 
+/** Anything React accepts as a ref, plus the absence of one. */
+type PossibleRef<T> = Ref<T> | undefined;
+/**
+ * The props `mergeProps` knows how to combine. Deliberately loose: it merges whatever a
+ * root hands to whatever child it was given, and neither side is knowable from here.
+ */
+type MergeableProps = Record<string, unknown>;
+type AsChildProps = {
+    /**
+     * Merge this component's props into its single child instead of rendering an element
+     * of its own — a navigation `Link` as a `Button`, a bespoke trigger as a `Select`.
+     */
+    asChild?: boolean;
+};
+
 /**
  * The props Lucide, Ionicons and `react-native-vector-icons` all accept — the shape
  * `as` is handed. It is a convention rather than an interface anyone published, which is
@@ -389,21 +404,6 @@ declare function childrenToString(children: ReactNode): string | null;
  */
 declare function createSlotContext<T>(name: string): readonly [Provider<T | null>, () => T];
 
-/** Anything React accepts as a ref, plus the absence of one. */
-type PossibleRef<T> = Ref<T> | undefined;
-/**
- * The props `mergeProps` knows how to combine. Deliberately loose: it merges whatever a
- * root hands to whatever child it was given, and neither side is knowable from here.
- */
-type MergeableProps = Record<string, unknown>;
-type AsChildProps = {
-    /**
-     * Merge this component's props into its single child instead of rendering an element
-     * of its own — a navigation `Link` as a `Button`, a bespoke trigger as a `Select`.
-     */
-    asChild?: boolean;
-};
-
 /**
  * Merges a root's own props into the child it renders through `asChild` (R12). Four
  * rules, and the child wins wherever they do not apply — it is the more specific intent:

package/dist/system/index.js

@@ -22,7 +22,7 @@ import {
   resolveSlotAnimation,
   useFeedback,
   useIconContext
-} from "../chunk-AUDOMZR3.js";
+} from "../chunk-GYK2CAX4.js";
 import "../chunk-X2K2FX3W.js";
 export {
   HIGHLIGHT_OPACITY,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xaui/native",
-  "version": "0.9.1-alpha.5",
+  "version": "0.9.1-alpha.7",
   "description": "Composition-first React Native UI components with native animations powered by Reanimated",
   "keywords": [
     "react-native",

package/dist/{chunk-AUDOMZR3.js → chunk-GYK2CAX4.js}

@@ -718,6 +718,7 @@ function stringify(node) {
 }
 
 export {
+  mergeRefs,
   IconContext,
   useIconContext,
   Icon,
@@ -735,7 +736,6 @@ export {
   RIPPLE_COVERAGE,
   resolveAnimation,
   resolveSlotAnimation,
-  mergeRefs,
   mergeProps,
   Slot,
   PressableFeedback3 as PressableFeedback,