@xaui/native 0.9.1-alpha.29 → 0.9.1-alpha.30

package/dist/system/index.d.cts

@@ -5,11 +5,11 @@ import { ReactNode, Provider, Ref, RefCallback } from 'react';
 import { S as SlotAnimation, F as FeedbackContext, a as AnimationProp, b as ResolvedAnimation, P as PressableFeedbackProps } from '../pressable-feedback.type-BA2C9sSz.cjs';
 export { A as AnimationConfig, R as RadiusStyle, c as RippleWave } from '../pressable-feedback.type-BA2C9sSz.cjs';
 import { R as RadiusKey, X as XAUITheme } from '../theme.type-C2gNHpEx.cjs';
-import { j as StyleFn, f as SlotStyle } from '../create-recipe-CWvI5ot3.cjs';
-export { A as Axes, C as CompoundVariant, R as Recipe, b as RecipeConfig, a as ResolveArgs, d as ResolvedSelection, e as ResolvedStyles, S as Selection, g as SlotStyles, h as StateName, i as States, T as TintArgs, V as VariantColors, k as VariantRole, l as VariantTokens, c as createRecipe } from '../create-recipe-CWvI5ot3.cjs';
+import { a as StyleFn, h as SlotStyle } from '../create-recipe-dC7wMfnj.cjs';
+export { A as Axes, C as CompoundVariant, R as Recipe, d as RecipeConfig, b as ResolveArgs, e as ResolvedSelection, f as ResolvedStyles, g as Selection, S as SlotStyles, i as StateName, j as States, T as TintArgs, V as VariantColors, k as VariantRole, l as VariantTokens, c as createRecipe } from '../create-recipe-dC7wMfnj.cjs';
 export { C as CloseButtonProps } from '../close-button.type-CHsgZ3wO.cjs';
-import { b as IconProps, a as IconContextValue } from '../icon.type-CF4KiMKl.cjs';
-export { I as IconComponentProps } from '../icon.type-CF4KiMKl.cjs';
+import { a as IconProps, I as IconContextValue } from '../icon.type-d_i9ma-i.cjs';
+export { b as IconComponentProps } from '../icon.type-d_i9ma-i.cjs';
 import { V as ViewStyleProps } from '../style-props.type-CfnoGEP7.cjs';
 export { D as DirectionalStyleKey, I as ImageStyleProps, S as StyleProps, T as TextStyleProps } from '../style-props.type-CfnoGEP7.cjs';
 import 'react-native-reanimated';

package/dist/system/index.d.ts

@@ -5,11 +5,11 @@ import { ReactNode, Provider, Ref, RefCallback } from 'react';
 import { S as SlotAnimation, F as FeedbackContext, a as AnimationProp, b as ResolvedAnimation, P as PressableFeedbackProps } from '../pressable-feedback.type-Bs4dQlGj.js';
 export { A as AnimationConfig, R as RadiusStyle, c as RippleWave } from '../pressable-feedback.type-Bs4dQlGj.js';
 import { R as RadiusKey, X as XAUITheme } from '../theme.type-C2gNHpEx.js';
-import { j as StyleFn, f as SlotStyle } from '../create-recipe-DUo8doTt.js';
-export { A as Axes, C as CompoundVariant, R as Recipe, b as RecipeConfig, a as ResolveArgs, d as ResolvedSelection, e as ResolvedStyles, S as Selection, g as SlotStyles, h as StateName, i as States, T as TintArgs, V as VariantColors, k as VariantRole, l as VariantTokens, c as createRecipe } from '../create-recipe-DUo8doTt.js';
+import { a as StyleFn, h as SlotStyle } from '../create-recipe-BdVd2ffi.js';
+export { A as Axes, C as CompoundVariant, R as Recipe, d as RecipeConfig, b as ResolveArgs, e as ResolvedSelection, f as ResolvedStyles, g as Selection, S as SlotStyles, i as StateName, j as States, T as TintArgs, V as VariantColors, k as VariantRole, l as VariantTokens, c as createRecipe } from '../create-recipe-BdVd2ffi.js';
 export { C as CloseButtonProps } from '../close-button.type-BUYuoSt2.js';
-import { b as IconProps, a as IconContextValue } from '../icon.type-Dq4_qePa.js';
-export { I as IconComponentProps } from '../icon.type-Dq4_qePa.js';
+import { a as IconProps, I as IconContextValue } from '../icon.type-Kml72iSz.js';
+export { b as IconComponentProps } from '../icon.type-Kml72iSz.js';
 import { V as ViewStyleProps } from '../style-props.type-CfnoGEP7.js';
 export { D as DirectionalStyleKey, I as ImageStyleProps, S as StyleProps, T as TextStyleProps } from '../style-props.type-CfnoGEP7.js';
 import 'react-native-reanimated';

package/dist/system/index.js

@@ -2,14 +2,14 @@ import {
   Portal,
   PortalContext,
   PortalHost
-} from "../chunk-Y4BPKSD3.js";
+} from "../chunk-7SEZGVTY.js";
 import {
   SelectionFill
 } from "../chunk-BA2DBSAN.js";
 import {
   CloseButton,
   closeButtonBase
-} from "../chunk-A4RGJBP2.js";
+} from "../chunk-V4WDMM6Z.js";
 import {
   FEEDBACK_OVERLAY,
   HIGHLIGHT_DURATION,
@@ -31,26 +31,29 @@ import {
   resolveSlotAnimation,
   rippleRadiusFor,
   useFeedback
-} from "../chunk-4HELPMAK.js";
-import "../chunk-EGLLDKN6.js";
+} from "../chunk-BFMTUMTU.js";
+import "../chunk-423RQBOX.js";
 import {
   Icon,
   IconContext,
   useIconContext
-} from "../chunk-ICR42HHG.js";
+} from "../chunk-3FV4COTM.js";
+import "../chunk-EGLLDKN6.js";
 import {
   createRecipe,
   radiusAxis
 } from "../chunk-4GTAZM2C.js";
+import "../chunk-A3EGFI6T.js";
 import {
   Slot,
   childrenToString,
   createSlotContext,
-  mergeProps,
+  mergeProps
+} from "../chunk-E2CWBQTV.js";
+import {
   mergeRefs,
   useStyleProps
-} from "../chunk-PMO62QK4.js";
-import "../chunk-A3EGFI6T.js";
+} from "../chunk-URSKA2VR.js";
 import "../chunk-GGW42MY4.js";
 export {
   CloseButton,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xaui/native",
-  "version": "0.9.1-alpha.29",
+  "version": "0.9.1-alpha.30",
   "description": "Composition-first React Native UI components with native animations powered by Reanimated",
   "keywords": [
     "react-native",
@@ -117,6 +117,16 @@
         "default": "./dist/components/radio/index.cjs"
       }
     },
+    "./spinner": {
+      "import": {
+        "types": "./dist/components/spinner/index.d.ts",
+        "default": "./dist/components/spinner/index.js"
+      },
+      "require": {
+        "types": "./dist/components/spinner/index.d.cts",
+        "default": "./dist/components/spinner/index.cjs"
+      }
+    },
     "./switch": {
       "import": {
         "types": "./dist/components/switch/index.d.ts",

package/dist/chunk-E25JH7W2.cjs

@@ -1,456 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-function _interopRequireDefault(obj) {
-  return obj && obj.__esModule ? obj : {
-    default: obj
-  };
-}
-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 _chunkIG4Q3WQOcjs = require('./chunk-IG4Q3WQO.cjs');
-var _chunkEJQCQPETcjs = require('./chunk-EJQCQPET.cjs');
-var _chunkB4W2XNBPcjs = require('./chunk-B4W2XNBP.cjs');
-var _chunkFNEUOBCVcjs = require('./chunk-FNEUOBCV.cjs');
-var _chunkHUZ4AUM2cjs = require('./chunk-HUZ4AUM2.cjs');
-var _chunk57SJ4LJFcjs = require('./chunk-57SJ4LJF.cjs');
-
-// src/components/button/button.context.ts
-var [ButtonProvider, useButton] = _chunkHUZ4AUM2cjs.createSlotContext.call(void 0, "Button");
-
-// src/components/button/button-icon.tsx
-var _jsxruntime = require('react/jsx-runtime');
-function ButtonIcon({
-  size,
-  color,
-  ...rest
-}) {
-  const {
-    icon
-  } = useButton();
-  return /* @__PURE__ */_jsxruntime.jsx.call(void 0, _chunkB4W2XNBPcjs.Icon, {
-    size: _nullishCoalesce(size, () => icon.size),
-    color: _nullishCoalesce(color, () => icon.color),
-    ...rest
-  });
-}
-ButtonIcon.displayName = "XAUI.Button.Icon";
-
-// src/components/button/button-label.tsx
-var _react = require('react');
-var _reactnative = require('react-native');
-var ButtonLabel = _react.forwardRef.call(void 0, function ButtonLabel2({
-  children,
-  style,
-  numberOfLines = 1,
-  ...props
-}, ref) {
-  const {
-    labelStyle
-  } = useButton();
-  const [styleProps, rest] = _chunkHUZ4AUM2cjs.useStyleProps.call(void 0, props);
-  return /* @__PURE__ */_jsxruntime.jsx.call(void 0, _reactnative.Text, {
-    ref,
-    numberOfLines,
-    style: [labelStyle, styleProps, style],
-    ...rest,
-    children
-  });
-});
-ButtonLabel.displayName = "XAUI.Button.Label";
-
-// src/components/button/button-spinner.tsx
-
-var _reactnativereanimated = require('react-native-reanimated');
-var _reactnativereanimated2 = _interopRequireDefault(_reactnativereanimated);
-var ROTATION_DURATION = 800;
-function ButtonSpinner({
-  style,
-  animation = true,
-  ...props
-}) {
-  const {
-    spinnerStyle
-  } = useButton();
-  const [styleProps] = _chunkHUZ4AUM2cjs.useStyleProps.call(void 0, props);
-  const ringStyle = [spinnerStyle, styleProps, style];
-  if (!animation) return /* @__PURE__ */_jsxruntime.jsx.call(void 0, _reactnative.View, {
-    style: ringStyle
-  });
-  return /* @__PURE__ */_jsxruntime.jsx.call(void 0, SpinningRing, {
-    style: ringStyle
-  });
-}
-ButtonSpinner.displayName = "XAUI.Button.Spinner";
-const _worklet_13197846893142_init_data = {
-  code: "function chunkE25JH7W2Cjs1(){const{angle}=this.__closure;return{transform:[{rotate:angle.value+\"deg\"}]};}",
-  location: "/home/runner/work/xaui/xaui/packages/native/dist/chunk-E25JH7W2.cjs",
-  sourceMap: "{\"version\":3,\"names\":[\"chunkE25JH7W2Cjs1\",\"angle\",\"__closure\",\"transform\",\"rotate\",\"value\"],\"sources\":[\"/home/runner/work/xaui/xaui/packages/native/dist/chunk-E25JH7W2.cjs\"],\"mappings\":\"AAqF6E,SAAAA,iBAAMA,CAAA,QAAAC,KAAA,OAAAC,SAAA,CAE/E,MAAO,CAAEC,SAAS,CAAE,CAAC,CAAEC,MAAM,CAAKH,KAAK,CAACI,KAAK,MAAM,CAAC,CAAE,CAAC,CACzD\",\"ignoreList\":[]}"
-};
-function SpinningRing({
-  style
-}) {
-  const angle = _reactnativereanimated.useSharedValue.call(void 0, 0);
-  _react.useEffect.call(void 0, () => {
-    angle.value = _reactnativereanimated.withRepeat.call(void 0, _reactnativereanimated.withTiming.call(void 0, 360, {
-      duration: ROTATION_DURATION,
-      easing: _reactnativereanimated.Easing.linear
-    }), -1, false);
-    return () => _reactnativereanimated.cancelAnimation.call(void 0, angle);
-  }, [angle]);
-  const animatedStyle = _reactnativereanimated.useAnimatedStyle.call(void 0, function chunkE25JH7W2Cjs1Factory({
-    _worklet_13197846893142_init_data,
-    angle
-  }) {
-    const _e = [new global.Error(), -2, -27];
-    const chunkE25JH7W2Cjs1 = function () {
-      return {
-        transform: [{
-          rotate: `${angle.value}deg`
-        }]
-      };
-    };
-    chunkE25JH7W2Cjs1.__closure = {
-      angle
-    };
-    chunkE25JH7W2Cjs1.__workletHash = 13197846893142;
-    chunkE25JH7W2Cjs1.__pluginVersion = "0.7.4";
-    chunkE25JH7W2Cjs1.__initData = _worklet_13197846893142_init_data;
-    chunkE25JH7W2Cjs1.__stackDetails = _e;
-    return chunkE25JH7W2Cjs1;
-  }({
-    _worklet_13197846893142_init_data,
-    angle
-  }), [angle]);
-  return /* @__PURE__ */_jsxruntime.jsx.call(void 0, _reactnativereanimated2.default.View, {
-    style: [style, animatedStyle]
-  });
-}
-
-// src/components/button/button.tsx
-
-// src/components/button/button.recipe.ts
-var SLOTS = ["root", "label", "icon", "spinner"];
-var VARIANT_TOKENS = {
-  primary: {
-    bg: "accent",
-    bgPressed: "accentPressed",
-    fg: "accentForeground"
-  },
-  // The accent's soft slice, not a second neutral: `secondary` is to `primary` what
-  // `danger-soft` is to `danger`, and it reads as the same family at lower emphasis.
-  secondary: {
-    bg: "accentSoft",
-    bgPressed: "accentSoftPressed",
-    fg: "accentSoftForeground"
-  },
-  default: {
-    bg: "default",
-    bgPressed: "defaultPressed",
-    fg: "defaultForeground"
-  },
-  tertiary: {
-    border: "border",
-    bgPressed: "defaultSoftPressed",
-    fg: "foreground"
-  },
-  ghost: {
-    bgPressed: "defaultSoftPressed",
-    fg: "foreground"
-  },
-  danger: {
-    bg: "danger",
-    bgPressed: "dangerPressed",
-    fg: "dangerForeground"
-  },
-  "danger-soft": {
-    bg: "dangerSoft",
-    bgPressed: "dangerSoftPressed",
-    fg: "dangerSoftForeground"
-  }
-};
-function ring(theme, size) {
-  return {
-    width: size,
-    height: size,
-    borderRadius: size / 2,
-    borderWidth: theme.borderWidth.default * 2,
-    borderTopColor: "transparent"
-  };
-}
-function sizeAxis(step) {
-  const {
-    size,
-    padding,
-    gap,
-    glyph,
-    radius
-  } = step;
-  return theme => ({
-    root: {
-      height: theme.controlHeights[size],
-      paddingHorizontal: theme.spacing(padding),
-      gap: theme.spacing(gap),
-      borderRadius: theme.radius[radius]
-    },
-    label: {
-      fontSize: theme.fontSizes[size],
-      lineHeight: theme.lineHeights[size]
-    },
-    icon: {
-      fontSize: theme.fontSizes[glyph]
-    },
-    spinner: ring(theme, theme.fontSizes[glyph])
-  });
-}
-var buttonRecipe = _chunkFNEUOBCVcjs.createRecipe.call(void 0, {
-  slots: SLOTS,
-  base: theme => ({
-    root: {
-      flexDirection: "row",
-      alignItems: "center",
-      justifyContent: "center",
-      borderWidth: 0,
-      // iOS's squircle. Free on Android, and it is what makes a large radius read as a
-      // shape rather than as two arcs meeting a straight edge.
-      borderCurve: "continuous"
-    },
-    label: {
-      fontFamily: theme.fontFamilies.body,
-      fontWeight: theme.fontWeights.medium
-    }
-  }),
-  variantTokens: VARIANT_TOKENS,
-  /**
-   * Where the variant's colours land, for every variant at once. The border width follows
-   * the *presence* of the border role rather than a per-variant flag — `tertiary` is the
-   * only variant that names one, and that fact is already in the table above.
-   */
-  paint: (theme, colors) => ({
-    root: {
-      backgroundColor: colors.bg,
-      borderColor: colors.border,
-      borderWidth: colors.border ? theme.borderWidth.default : 0
-    },
-    label: {
-      color: colors.fg
-    },
-    icon: {
-      color: colors.fg
-    },
-    spinner: {
-      borderColor: colors.fg
-    }
-  }),
-  /**
-   * Declaration order is application order: `radius` overrides the radius `size` set, and
-   * `isIconOnly` overrides its padding. Both are axes rather than a static sheet merged
-   * at the call site, so they stay inside the cache key and a press still allocates
-   * nothing.
-   */
-  variants: {
-    size: {
-      xs: sizeAxis({
-        size: "xs",
-        padding: 3,
-        gap: 1,
-        glyph: "sm",
-        radius: "3xl"
-      }),
-      sm: sizeAxis({
-        size: "sm",
-        padding: 3.5,
-        gap: 1.5,
-        glyph: "md",
-        radius: "3xl"
-      }),
-      md: sizeAxis({
-        size: "md",
-        padding: 4,
-        gap: 2,
-        glyph: "lg",
-        radius: "3xl"
-      }),
-      lg: sizeAxis({
-        size: "lg",
-        padding: 5,
-        gap: 2.5,
-        glyph: "xl",
-        radius: "4xl"
-      })
-    },
-    radius: _chunkFNEUOBCVcjs.radiusAxis.call(void 0, "root"),
-    // A square on a fixed height. No width is computed, and none needs to be.
-    isIconOnly: {
-      true: () => ({
-        root: {
-          paddingHorizontal: 0,
-          aspectRatio: 1
-        }
-      })
-    }
-  },
-  /**
-   * The pressed colour lives here rather than in a `PressableFeedback.Highlight`, because
-   * a control picks one treatment or the other — both, and a pressed button darkens
-   * twice. This one is the variant's own `…Pressed` token, so the press reads as the
-   * button's colour going down rather than as a neutral film over it, and a tinted button
-   * presses through the same OKLab formula as a token one.
-   */
-  states: {
-    pressed: (_theme, colors) => ({
-      root: {
-        backgroundColor: colors.bgPressed
-      }
-    }),
-    disabled: theme => ({
-      root: {
-        opacity: theme.opacity.disabled
-      }
-    })
-  },
-  defaultVariants: {
-    variant: "primary",
-    size: "md"
-  }
-});
-
-// src/components/button/button.utils.ts
-
-function containsElementOfType(children, type) {
-  return _react.Children.toArray(children).some(child => _react.isValidElement.call(void 0, child) && child.type === type);
-}
-
-// src/components/button/button.tsx
-
-var ButtonRoot = _react.forwardRef.call(void 0, function Button({
-  children,
-  variant,
-  size,
-  radius,
-  color,
-  isDisabled = false,
-  isLoading = false,
-  isIconOnly = false,
-  asChild = false,
-  accessibilityRole = "button",
-  accessibilityState,
-  style,
-  onPressIn,
-  onPressOut,
-  ...props
-}, ref) {
-  const theme = _chunk57SJ4LJFcjs.useXAUITheme.call(void 0);
-  const [styleProps, rest] = _chunkHUZ4AUM2cjs.useStyleProps.call(void 0, props);
-  const [isPressed, press] = _chunkIG4Q3WQOcjs.usePressState.call(void 0, {
-    onPressIn,
-    onPressOut
-  });
-  const selection = {
-    variant,
-    size,
-    radius,
-    isIconOnly: isIconOnly ? "true" : void 0
-  };
-  const states = {
-    pressed: isPressed,
-    disabled: isDisabled || isLoading
-  };
-  const styles = buttonRecipe.resolve({
-    theme,
-    selection,
-    states
-  });
-  const tint = color ? buttonRecipe.tint({
-    theme,
-    color,
-    selection,
-    states
-  }) : void 0;
-  const context = _react.useMemo.call(void 0, () => {
-    const icon = _reactnative.StyleSheet.flatten([styles.icon, _optionalChain([tint, 'optionalAccess', _ => _.icon])]);
-    return {
-      labelStyle: tint ? [styles.label, tint.label] : styles.label,
-      spinnerStyle: tint ? [styles.spinner, tint.spinner] : styles.spinner,
-      icon: {
-        size: icon.fontSize,
-        // `ColorValue` also covers the platform's opaque colours, which `Icon` cannot
-        // hand to a third-party component expecting a string.
-        color: typeof icon.color === "string" ? icon.color : void 0
-      },
-      isDisabled,
-      isLoading
-    };
-  }, [styles, tint, isDisabled, isLoading]);
-  const rootStyle = [styles.root, _optionalChain([tint, 'optionalAccess', _2 => _2.root]), styleProps, typeof style === "function" ? style({
-    pressed: isPressed
-  }) : style];
-  const text = _chunkHUZ4AUM2cjs.childrenToString.call(void 0, children);
-  const showSpinner = isLoading && !containsElementOfType(children, ButtonSpinner);
-  if (isIconOnly && !rest.accessibilityLabel && !rest["aria-label"]) {
-    _chunkEJQCQPETcjs.warnDev.call(void 0, "Button: an icon-only button needs an `accessibilityLabel` \u2014 there is no text for a screen reader to read, so it announces as an unlabelled button.");
-  }
-  return /* @__PURE__ */_jsxruntime.jsx.call(void 0, ButtonProvider, {
-    value: context,
-    children: /* @__PURE__ */_jsxruntime.jsx.call(void 0, _chunkIG4Q3WQOcjs.PressableFeedback, {
-      ref,
-      isPressed,
-      isDisabled: isDisabled || isLoading,
-      asChild,
-      accessibilityRole,
-      accessibilityState: {
-        disabled: isDisabled,
-        busy: isLoading,
-        ...accessibilityState
-      },
-      ...rest,
-      style: rootStyle,
-      onPressIn: press.onPressIn,
-      onPressOut: press.onPressOut,
-      children: asChild ? children : /* @__PURE__ */_jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, {
-        children: [showSpinner ? /* @__PURE__ */_jsxruntime.jsx.call(void 0, ButtonSpinner, {}) : null, text !== null ? /* @__PURE__ */_jsxruntime.jsx.call(void 0, ButtonLabel, {
-          children: text
-        }) : children]
-      })
-    })
-  });
-});
-ButtonRoot.displayName = "XAUI.Button.Root";
-
-// src/components/button/index.ts
-var Button2 = Object.assign(ButtonRoot, {
-  Label: ButtonLabel,
-  Icon: ButtonIcon,
-  Spinner: ButtonSpinner
-});
-exports.useButton = useButton;
-exports.buttonRecipe = buttonRecipe;
-exports.Button = Button2;