@xaui/native 0.9.1-alpha.93 → 0.9.1-beta.100

package/dist/{chunk-FOOXBVOQ.js → chunk-GVZJNIHN.js}

@@ -1,22 +1,23 @@
 import { collectItemLabels, readItemLabel, useLabelRegistry } from "./chunk-4WCBZFAK.js";
 import { useAnchoredPosition } from "./chunk-Z6FRP4EV.js";
-import { selectRecipe } from "./chunk-E4FWGZH2.js";
+import { textFieldRecipe } from "./chunk-NTVPLDJC.js";
+import { selectRecipe } from "./chunk-OUNTRW6E.js";
 import { Portal } from "./chunk-2PMXMKS5.js";
 import { INDICATOR_ROTATION, INDICATOR_SPRING, anchoredEntering, anchoredExiting, overlayEntering, overlayExiting } from "./chunk-64MXEVT3.js";
 import { useMergedRef } from "./chunk-NCTOTTVW.js";
 import { useControllableState } from "./chunk-F6W3JQ7K.js";
-import { PressableFeedback } from "./chunk-2AFA5HA2.js";
+import { PressableFeedback } from "./chunk-KQW25RCC.js";
 import { usePressState } from "./chunk-423RQBOX.js";
 import { ChevronDownIcon, Icon, IconContext } from "./chunk-JN6IRT2M.js";
 import { childrenToString } from "./chunk-WFZDAXDI.js";
 import { createRecipe } from "./chunk-DKVXTMIJ.js";
-import { createSlotContext } from "./chunk-TTZOIXKE.js";
+import { Slot, createSlotContext } from "./chunk-TTZOIXKE.js";
 import { useXAUITheme } from "./chunk-Z6JBWRPL.js";
 import { useStyleProps } from "./chunk-M63GFNKV.js";
 
 // src/components/autocomplete/autocomplete.tsx
-import { useCallback, useMemo, useState } from "react";
-import { StyleSheet } from "react-native";
+import { forwardRef, useCallback, useId, useMemo, useState } from "react";
+import { StyleSheet, View } from "react-native";
 
 // src/components/autocomplete/autocomplete.context.ts
 var [AutocompleteProvider, useAutocomplete] = createSlotContext("Autocomplete");
@@ -101,7 +102,7 @@ var autocompleteRecipe = createRecipe({
 
 // src/components/autocomplete/autocomplete.tsx
 import { jsx } from "react/jsx-runtime";
-function Autocomplete({
+var Autocomplete = forwardRef(function Autocomplete2({
   children,
   variant,
   size,
@@ -117,14 +118,21 @@ function Autocomplete({
   defaultQuery = "",
   onQueryChange,
   isDisabled = false,
-  isInvalid = false
-}) {
+  isInvalid = false,
+  asChild = false,
+  style,
+  ...props
+}, ref) {
   const theme = useXAUITheme();
+  const [styleProps, rest] = useStyleProps(props);
   const {
     labelFor,
     registerLabel
   } = useLabelRegistry();
   const [anchor, setAnchor] = useState(null);
+  const id = useId();
+  const labelId = `${id}-label`;
+  const descriptionId = `${id}-description`;
   const [value, setValue] = useControllableState({
     value: controlledValue,
     defaultValue,
@@ -149,10 +157,7 @@ function Autocomplete({
   };
   const styles = selectRecipe.resolve({
     theme,
-    selection,
-    states: {
-      disabled: isDisabled
-    }
+    selection
   });
   const pressed = selectRecipe.resolve({
     theme,
@@ -166,6 +171,16 @@ function Autocomplete({
     color,
     selection
   }) : void 0;
+  const labelled = textFieldRecipe.resolve({
+    theme,
+    selection: {
+      size,
+      isInvalid: isInvalid ? "true" : void 0
+    },
+    states: {
+      disabled: isDisabled
+    }
+  });
   const own = autocompleteRecipe.resolve({
     theme,
     selection: {
@@ -208,6 +223,9 @@ function Autocomplete({
       itemStyle: styles.item,
       itemPressedStyle: pressed.item,
       itemLabelStyle: styles.itemLabel,
+      labelStyle: labelled.label,
+      descriptionStyle: labelled.description,
+      errorStyle: labelled.error,
       glyph: {
         size: indicator.fontSize,
         color: typeof indicator.color === "string" ? indicator.color : void 0
@@ -226,18 +244,35 @@ function Autocomplete({
       anchor,
       setAnchor,
       labelFor,
-      registerLabel
+      registerLabel,
+      labelId,
+      descriptionId
     };
-  }, [styles, pressed, tint, own, ownTint, value, query, setQueryState, isOpen, isDisabled, isInvalid, open, close, toggle, select, anchor, labelFor, registerLabel]);
+  }, [styles, pressed, tint, own, ownTint, labelled, labelId, descriptionId, value, query, setQueryState, isOpen, isDisabled, isInvalid, open, close, toggle, select, anchor, labelFor, registerLabel]);
+  const columnStyle = [labelled.root, styleProps, style];
+  const column = asChild ?
+  // R12 — the caller's element is the column.
+  /* @__PURE__ */
+  jsx(Slot, {
+    ref,
+    ...rest,
+    style: columnStyle,
+    children
+  }) : /* @__PURE__ */jsx(View, {
+    ref,
+    ...rest,
+    style: columnStyle,
+    children
+  });
   return /* @__PURE__ */jsx(AutocompleteProvider, {
     value: context,
-    children
+    children: column
   });
-}
+});
 Autocomplete.displayName = "XAUI.Autocomplete.Root";
 
 // src/components/autocomplete/autocomplete-content.tsx
-import { Children as Children2, forwardRef as forwardRef5, isValidElement as isValidElement2, useEffect, useMemo as useMemo3 } from "react";
+import { Children as Children2, forwardRef as forwardRef6, isValidElement as isValidElement2, useEffect, useMemo as useMemo3 } from "react";
 import { ScrollView } from "react-native";
 import Animated from "react-native-reanimated";
 
@@ -270,10 +305,10 @@ function filterItems(children, query, isItem2) {
 }
 
 // src/components/autocomplete/autocomplete-empty.tsx
-import { forwardRef } from "react";
+import { forwardRef as forwardRef2 } from "react";
 import { Text } from "react-native";
 import { jsx as jsx2 } from "react/jsx-runtime";
-var AutocompleteEmpty = forwardRef(function AutocompleteEmpty2({
+var AutocompleteEmpty = forwardRef2(function AutocompleteEmpty2({
   children,
   style,
   ...props
@@ -292,13 +327,13 @@ var AutocompleteEmpty = forwardRef(function AutocompleteEmpty2({
 AutocompleteEmpty.displayName = "XAUI.Autocomplete.Empty";
 
 // src/components/autocomplete/autocomplete-item.tsx
-import { forwardRef as forwardRef3, useCallback as useCallback2, useMemo as useMemo2 } from "react";
+import { forwardRef as forwardRef4, useCallback as useCallback2, useMemo as useMemo2 } from "react";
 
 // src/components/autocomplete/autocomplete-item-label.tsx
-import { forwardRef as forwardRef2 } from "react";
+import { forwardRef as forwardRef3 } from "react";
 import { Text as Text2 } from "react-native";
 import { jsx as jsx3 } from "react/jsx-runtime";
-var AutocompleteItemLabel = forwardRef2(function AutocompleteItemLabel2({
+var AutocompleteItemLabel = forwardRef3(function AutocompleteItemLabel2({
   children,
   style,
   ...props
@@ -318,7 +353,7 @@ AutocompleteItemLabel.displayName = "XAUI.Autocomplete.ItemLabel";
 
 // src/components/autocomplete/autocomplete-item.tsx
 import { jsx as jsx4 } from "react/jsx-runtime";
-var AutocompleteItem = forwardRef3(function AutocompleteItem2({
+var AutocompleteItem = forwardRef4(function AutocompleteItem2({
   value,
   label,
   children,
@@ -385,10 +420,10 @@ var AutocompleteItem = forwardRef3(function AutocompleteItem2({
 AutocompleteItem.displayName = "XAUI.Autocomplete.Item";
 
 // src/components/autocomplete/autocomplete-search.tsx
-import { forwardRef as forwardRef4 } from "react";
+import { forwardRef as forwardRef5 } from "react";
 import { TextInput } from "react-native";
 import { jsx as jsx5 } from "react/jsx-runtime";
-var AutocompleteSearch = forwardRef4(function AutocompleteSearch2({
+var AutocompleteSearch = forwardRef5(function AutocompleteSearch2({
   autoFocus = true,
   style,
   ...props
@@ -429,7 +464,7 @@ var DEFAULT_INSETS = {
 var isItem = type => type === AutocompleteItem;
 var isSearch = type => type === AutocompleteSearch;
 var isEmpty = type => type === AutocompleteEmpty;
-var AutocompleteContent = forwardRef5(function AutocompleteContent2({
+var AutocompleteContent = forwardRef6(function AutocompleteContent2({
   children,
   placement = "bottom",
   align = "center",
@@ -533,14 +568,61 @@ function partition(children) {
   };
 }
 
+// src/components/autocomplete/autocomplete-description.tsx
+import { forwardRef as forwardRef7 } from "react";
+import { Text as Text3 } from "react-native";
+import { jsx as jsx7 } from "react/jsx-runtime";
+var AutocompleteDescription = forwardRef7(function AutocompleteDescription2({
+  children,
+  style,
+  nativeID,
+  ...props
+}, ref) {
+  const {
+    descriptionStyle,
+    descriptionId
+  } = useAutocomplete();
+  const [styleProps, rest] = useStyleProps(props);
+  return /* @__PURE__ */jsx7(Text3, {
+    ref,
+    nativeID: nativeID ?? descriptionId,
+    style: [descriptionStyle, styleProps, style],
+    ...rest,
+    children
+  });
+});
+AutocompleteDescription.displayName = "XAUI.Autocomplete.Description";
+
+// src/components/autocomplete/autocomplete-error.tsx
+import { forwardRef as forwardRef8 } from "react";
+import { Text as Text4 } from "react-native";
+import { jsx as jsx8 } from "react/jsx-runtime";
+var AutocompleteError = forwardRef8(function AutocompleteError2({
+  children,
+  style,
+  ...props
+}, ref) {
+  const {
+    errorStyle
+  } = useAutocomplete();
+  const [styleProps, rest] = useStyleProps(props);
+  return /* @__PURE__ */jsx8(Text4, {
+    ref,
+    style: [errorStyle, styleProps, style],
+    ...rest,
+    children
+  });
+});
+AutocompleteError.displayName = "XAUI.Autocomplete.Error";
+
 // src/components/autocomplete/autocomplete-indicator.tsx
 import { useEffect as useEffect2 } from "react";
 import Animated2, { interpolate, useAnimatedStyle, useSharedValue, withSpring } from "react-native-reanimated";
-import { jsx as jsx7 } from "react/jsx-runtime";
-const _worklet_1971635372740_init_data = {
-  code: "function chunkFOOXBVOQJs1(){const{interpolate,progress,INDICATOR_ROTATION}=this.__closure;return{transform:[{rotate:interpolate(progress.get(),[0,1],[INDICATOR_ROTATION[0],INDICATOR_ROTATION[1]])+\"deg\"}]};}",
-  location: "/home/runner/work/xaui/xaui/packages/native/dist/chunk-FOOXBVOQ.js",
-  sourceMap: "{\"version\":3,\"names\":[\"chunkFOOXBVOQJs1\",\"interpolate\",\"progress\",\"INDICATOR_ROTATION\",\"__closure\",\"transform\",\"rotate\",\"get\"],\"sources\":[\"/home/runner/work/xaui/xaui/packages/native/dist/chunk-FOOXBVOQ.js\"],\"mappings\":\"AA4hBoC,SAAAA,iBAAA,QAAAC,WAAA,CAAAC,QAAA,CAAAC,kBAAA,OAAAC,SAAA,OAAO,CACvCC,SAAS,CAAE,CACT,CACEC,MAAM,CAAKL,WAAW,CAACC,QAAQ,CAACK,GAAG,CAAC,CAAC,CAAE,CAAC,CAAC,CAAE,CAAC,CAAC,CAAE,CAACJ,kBAAkB,CAAC,CAAC,CAAC,CAAEA,kBAAkB,CAAC,CAAC,CAAC,CAAC,CAAC,MAChG,CAAC,CAEL,CAAC\",\"ignoreList\":[]}"
+import { jsx as jsx9 } from "react/jsx-runtime";
+const _worklet_618153933488_init_data = {
+  code: "function chunkGVZJNIHNJs1(){const{interpolate,progress,INDICATOR_ROTATION}=this.__closure;return{transform:[{rotate:interpolate(progress.get(),[0,1],[INDICATOR_ROTATION[0],INDICATOR_ROTATION[1]])+\"deg\"}]};}",
+  location: "/home/runner/work/xaui/xaui/packages/native/dist/chunk-GVZJNIHN.js",
+  sourceMap: "{\"version\":3,\"names\":[\"chunkGVZJNIHNJs1\",\"interpolate\",\"progress\",\"INDICATOR_ROTATION\",\"__closure\",\"transform\",\"rotate\",\"get\"],\"sources\":[\"/home/runner/work/xaui/xaui/packages/native/dist/chunk-GVZJNIHN.js\"],\"mappings\":\"AAwlBoC,SAAAA,gBAAMA,CAAA,QAAAC,WAAA,CAAAC,QAAA,CAAAC,kBAAA,OAAAC,SAAA,CAEtC,MAAO,CACLC,SAAS,CAAE,CACT,CACEC,MAAM,CAAKL,WAAW,CAACC,QAAQ,CAACK,GAAG,CAAC,CAAC,CAAE,CAAC,CAAC,CAAE,CAAC,CAAC,CAAE,CAACJ,kBAAkB,CAAC,CAAC,CAAC,CAAEA,kBAAkB,CAAC,CAAC,CAAC,CAAC,CAAC,MAChG,CAAC,CAEL,CAAC,CACH\",\"ignoreList\":[]}"
 };
 function AutocompleteIndicator(props) {
   const {
@@ -554,50 +636,77 @@ function AutocompleteIndicator(props) {
   useEffect2(() => {
     progress.set(withSpring(isOpen ? 1 : 0, INDICATOR_SPRING));
   }, [isOpen, progress]);
-  const rotation = useAnimatedStyle(function chunkFOOXBVOQJs1Factory({
-    _worklet_1971635372740_init_data,
+  const rotation = useAnimatedStyle(function chunkGVZJNIHNJs1Factory({
+    _worklet_618153933488_init_data,
     interpolate,
     progress,
     INDICATOR_ROTATION
   }) {
     const _e = [new global.Error(), -4, -27];
-    const chunkFOOXBVOQJs1 = () => ({
-      transform: [{
-        rotate: `${interpolate(progress.get(), [0, 1], [INDICATOR_ROTATION[0], INDICATOR_ROTATION[1]])}deg`
-      }]
-    });
-    chunkFOOXBVOQJs1.__closure = {
+    const chunkGVZJNIHNJs1 = function () {
+      return {
+        transform: [{
+          rotate: `${interpolate(progress.get(), [0, 1], [INDICATOR_ROTATION[0], INDICATOR_ROTATION[1]])}deg`
+        }]
+      };
+    };
+    chunkGVZJNIHNJs1.__closure = {
       interpolate,
       progress,
       INDICATOR_ROTATION
     };
-    chunkFOOXBVOQJs1.__workletHash = 1971635372740;
-    chunkFOOXBVOQJs1.__pluginVersion = "0.7.4";
-    chunkFOOXBVOQJs1.__initData = _worklet_1971635372740_init_data;
-    chunkFOOXBVOQJs1.__stackDetails = _e;
-    return chunkFOOXBVOQJs1;
+    chunkGVZJNIHNJs1.__workletHash = 618153933488;
+    chunkGVZJNIHNJs1.__pluginVersion = "0.7.4";
+    chunkGVZJNIHNJs1.__initData = _worklet_618153933488_init_data;
+    chunkGVZJNIHNJs1.__stackDetails = _e;
+    return chunkGVZJNIHNJs1;
   }({
-    _worklet_1971635372740_init_data,
+    _worklet_618153933488_init_data,
     interpolate,
     progress,
     INDICATOR_ROTATION
-  }));
-  return /* @__PURE__ */jsx7(Animated2.View, {
+  }), [progress]);
+  return /* @__PURE__ */jsx9(Animated2.View, {
     style: [indicatorStyle, rotation],
-    children: /* @__PURE__ */jsx7(Icon, {
+    children: /* @__PURE__ */jsx9(Icon, {
       as
     })
   });
 }
 AutocompleteIndicator.displayName = "XAUI.Autocomplete.Indicator";
 
+// src/components/autocomplete/autocomplete-label.tsx
+import { forwardRef as forwardRef9 } from "react";
+import { Text as Text5 } from "react-native";
+import { jsx as jsx10 } from "react/jsx-runtime";
+var AutocompleteLabel = forwardRef9(function AutocompleteLabel2({
+  children,
+  style,
+  nativeID,
+  ...props
+}, ref) {
+  const {
+    labelStyle,
+    labelId
+  } = useAutocomplete();
+  const [styleProps, rest] = useStyleProps(props);
+  return /* @__PURE__ */jsx10(Text5, {
+    ref,
+    nativeID: nativeID ?? labelId,
+    style: [labelStyle, styleProps, style],
+    ...rest,
+    children
+  });
+});
+AutocompleteLabel.displayName = "XAUI.Autocomplete.Label";
+
 // src/components/autocomplete/autocomplete-overlay.tsx
-import { forwardRef as forwardRef6 } from "react";
+import { forwardRef as forwardRef10 } from "react";
 import { Pressable } from "react-native";
 import Animated3 from "react-native-reanimated";
-import { jsx as jsx8 } from "react/jsx-runtime";
+import { jsx as jsx11 } from "react/jsx-runtime";
 var AnimatedPressable = Animated3.createAnimatedComponent(Pressable);
-var AutocompleteOverlay = forwardRef6(function AutocompleteOverlay2({
+var AutocompleteOverlay = forwardRef10(function AutocompleteOverlay2({
   children,
   style,
   ...props
@@ -610,10 +719,10 @@ var AutocompleteOverlay = forwardRef6(function AutocompleteOverlay2({
   } = context;
   const [styleProps, rest] = useStyleProps(props);
   if (!isOpen) return null;
-  return /* @__PURE__ */jsx8(Portal, {
-    children: /* @__PURE__ */jsx8(AutocompleteProvider, {
+  return /* @__PURE__ */jsx11(Portal, {
+    children: /* @__PURE__ */jsx11(AutocompleteProvider, {
       value: context,
-      children: /* @__PURE__ */jsx8(AnimatedPressable, {
+      children: /* @__PURE__ */jsx11(AnimatedPressable, {
         ref,
         entering: overlayEntering,
         exiting: overlayExiting,
@@ -630,9 +739,9 @@ var AutocompleteOverlay = forwardRef6(function AutocompleteOverlay2({
 AutocompleteOverlay.displayName = "XAUI.Autocomplete.Overlay";
 
 // src/components/autocomplete/autocomplete-trigger.tsx
-import { forwardRef as forwardRef7, useCallback as useCallback3, useEffect as useEffect3, useRef } from "react";
-import { jsx as jsx9 } from "react/jsx-runtime";
-var AutocompleteTrigger = forwardRef7(function AutocompleteTrigger2({
+import { forwardRef as forwardRef11, useCallback as useCallback3, useEffect as useEffect3, useRef } from "react";
+import { jsx as jsx12 } from "react/jsx-runtime";
+var AutocompleteTrigger = forwardRef11(function AutocompleteTrigger2({
   children,
   asChild = false,
   accessibilityRole = "combobox",
@@ -652,7 +761,9 @@ var AutocompleteTrigger = forwardRef7(function AutocompleteTrigger2({
     isDisabled,
     isInvalid,
     toggle,
-    setAnchor
+    setAnchor,
+    labelId,
+    descriptionId
   } = useAutocomplete();
   const [styleProps, rest] = useStyleProps(props);
   const [isPressed, press] = usePressState({
@@ -683,9 +794,9 @@ var AutocompleteTrigger = forwardRef7(function AutocompleteTrigger2({
     measure();
     toggle();
   }, [measure, onPress, toggle]);
-  return /* @__PURE__ */jsx9(IconContext.Provider, {
+  return /* @__PURE__ */jsx12(IconContext.Provider, {
     value: glyph,
-    children: /* @__PURE__ */jsx9(PressableFeedback, {
+    children: /* @__PURE__ */jsx12(PressableFeedback, {
       ref: refs,
       isPressed,
       isDisabled,
@@ -697,6 +808,8 @@ var AutocompleteTrigger = forwardRef7(function AutocompleteTrigger2({
         ...accessibilityState
       },
       "aria-invalid": isInvalid || void 0,
+      "aria-labelledby": labelId,
+      "aria-describedby": descriptionId,
       ...rest,
       onLayout: handleLayout,
       style: [triggerStyle, isPressed && triggerPressedStyle, styleProps, typeof style === "function" ? style({
@@ -712,10 +825,10 @@ var AutocompleteTrigger = forwardRef7(function AutocompleteTrigger2({
 AutocompleteTrigger.displayName = "XAUI.Autocomplete.Trigger";
 
 // src/components/autocomplete/autocomplete-value.tsx
-import { forwardRef as forwardRef8 } from "react";
-import { Text as Text3 } from "react-native";
-import { jsx as jsx10 } from "react/jsx-runtime";
-var AutocompleteValue = forwardRef8(function AutocompleteValue2({
+import { forwardRef as forwardRef12 } from "react";
+import { Text as Text6 } from "react-native";
+import { jsx as jsx13 } from "react/jsx-runtime";
+var AutocompleteValue = forwardRef12(function AutocompleteValue2({
   children,
   placeholder,
   style,
@@ -730,7 +843,7 @@ var AutocompleteValue = forwardRef8(function AutocompleteValue2({
   const [styleProps, rest] = useStyleProps(props);
   const label = children ?? (value === void 0 ? void 0 : labelFor(value));
   const isEmpty2 = label === void 0 || label === null;
-  return /* @__PURE__ */jsx10(Text3, {
+  return /* @__PURE__ */jsx13(Text6, {
     ref,
     numberOfLines: 1,
     ...rest,
@@ -741,7 +854,8 @@ var AutocompleteValue = forwardRef8(function AutocompleteValue2({
 AutocompleteValue.displayName = "XAUI.Autocomplete.Value";
 
 // src/components/autocomplete/index.ts
-var Autocomplete2 = Object.assign(Autocomplete, {
+var Autocomplete3 = Object.assign(Autocomplete, {
+  Label: AutocompleteLabel,
   Trigger: AutocompleteTrigger,
   Value: AutocompleteValue,
   Indicator: AutocompleteIndicator,
@@ -750,6 +864,8 @@ var Autocomplete2 = Object.assign(Autocomplete, {
   Search: AutocompleteSearch,
   Item: AutocompleteItem,
   ItemLabel: AutocompleteItemLabel,
-  Empty: AutocompleteEmpty
+  Empty: AutocompleteEmpty,
+  Description: AutocompleteDescription,
+  Error: AutocompleteError
 });
-export { useAutocomplete, useAutocompleteItem, autocompleteRecipe, Autocomplete, AutocompleteEmpty, AutocompleteItemLabel, AutocompleteItem, AutocompleteSearch, AutocompleteContent, AutocompleteIndicator, AutocompleteOverlay, AutocompleteTrigger, AutocompleteValue, Autocomplete2 };
+export { useAutocomplete, useAutocompleteItem, autocompleteRecipe, Autocomplete, AutocompleteEmpty, AutocompleteItemLabel, AutocompleteItem, AutocompleteSearch, AutocompleteContent, AutocompleteDescription, AutocompleteError, AutocompleteIndicator, AutocompleteLabel, AutocompleteOverlay, AutocompleteTrigger, AutocompleteValue, Autocomplete3 as Autocomplete2 };