@xaui/native 0.9.1-alpha.9 → 0.9.1-alpha.91

package/dist/chunk-FOOXBVOQ.js

@@ -0,0 +1,755 @@
+import { collectItemLabels, readItemLabel, useLabelRegistry } from "./chunk-4WCBZFAK.js";
+import { useAnchoredPosition } from "./chunk-Z6FRP4EV.js";
+import { selectRecipe } from "./chunk-E4FWGZH2.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 { 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 { 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";
+
+// src/components/autocomplete/autocomplete.context.ts
+var [AutocompleteProvider, useAutocomplete] = createSlotContext("Autocomplete");
+var [AutocompleteItemProvider, useAutocompleteItem] = createSlotContext("Autocomplete.Item");
+
+// src/components/autocomplete/autocomplete.recipe.ts
+var SLOTS = ["search", "empty"];
+var VARIANT_TOKENS = {
+  // The search box is a field **inside** a panel rather than one on a page, so it takes
+  // the recessed neutral rather than `fieldBackground` — on a white panel the latter is
+  // the panel's own colour and the box would vanish into it. It is the same reasoning the
+  // `Checkbox`'s `secondary` gives for the same swap.
+  default: {
+    bg: "default",
+    fg: "fieldForeground"
+  }
+};
+var SIZES = {
+  sm: {
+    value: "md"
+  },
+  md: {
+    value: "md"
+  },
+  lg: {
+    value: "lg"
+  }
+};
+var BOX = {
+  height: 10,
+  paddingHorizontal: 3,
+  radius: "field",
+  marginBottom: 2
+};
+function sizeAxis(step) {
+  return theme => ({
+    search: {
+      fontSize: theme.fontSizes[step.value],
+      lineHeight: theme.lineHeights[step.value]
+    }
+  });
+}
+var autocompleteRecipe = createRecipe({
+  slots: SLOTS,
+  base: theme => ({
+    search: {
+      height: theme.spacing(BOX.height),
+      paddingHorizontal: theme.spacing(BOX.paddingHorizontal),
+      marginBottom: theme.spacing(BOX.marginBottom),
+      borderRadius: theme.radius[BOX.radius],
+      borderCurve: "continuous",
+      fontFamily: theme.fontFamilies.body
+    },
+    empty: {
+      fontFamily: theme.fontFamilies.body,
+      fontSize: theme.fontSizes.sm,
+      lineHeight: theme.lineHeights.sm,
+      color: theme.colors.muted,
+      textAlign: "center",
+      paddingVertical: theme.spacing(4)
+    }
+  }),
+  variantTokens: VARIANT_TOKENS,
+  paint: (_theme, colors) => ({
+    search: {
+      backgroundColor: colors.bg,
+      color: colors.fg
+    }
+  }),
+  variants: {
+    size: {
+      sm: sizeAxis(SIZES.sm),
+      md: sizeAxis(SIZES.md),
+      lg: sizeAxis(SIZES.lg)
+    }
+  },
+  defaultVariants: {
+    variant: "default",
+    size: "md"
+  }
+});
+
+// src/components/autocomplete/autocomplete.tsx
+import { jsx } from "react/jsx-runtime";
+function Autocomplete({
+  children,
+  variant,
+  size,
+  radius,
+  color,
+  value: controlledValue,
+  defaultValue,
+  onValueChange,
+  isOpen: controlledOpen,
+  defaultOpen = false,
+  onOpenChange,
+  query: controlledQuery,
+  defaultQuery = "",
+  onQueryChange,
+  isDisabled = false,
+  isInvalid = false
+}) {
+  const theme = useXAUITheme();
+  const {
+    labelFor,
+    registerLabel
+  } = useLabelRegistry();
+  const [anchor, setAnchor] = useState(null);
+  const [value, setValue] = useControllableState({
+    value: controlledValue,
+    defaultValue,
+    onChange: onValueChange
+  });
+  const [isOpen, setOpen] = useControllableState({
+    value: controlledOpen,
+    defaultValue: defaultOpen,
+    onChange: onOpenChange
+  });
+  const [query, setQueryState] = useControllableState({
+    value: controlledQuery,
+    defaultValue: defaultQuery,
+    onChange: onQueryChange
+  });
+  const selection = {
+    variant,
+    size,
+    radius,
+    isOpen: isOpen ? "true" : void 0,
+    isInvalid: isInvalid ? "true" : void 0
+  };
+  const styles = selectRecipe.resolve({
+    theme,
+    selection,
+    states: {
+      disabled: isDisabled
+    }
+  });
+  const pressed = selectRecipe.resolve({
+    theme,
+    selection,
+    states: {
+      pressed: true
+    }
+  });
+  const tint = color ? selectRecipe.tint({
+    theme,
+    color,
+    selection
+  }) : void 0;
+  const own = autocompleteRecipe.resolve({
+    theme,
+    selection: {
+      size
+    }
+  });
+  const ownTint = color ? autocompleteRecipe.tint({
+    theme,
+    color,
+    selection: {
+      size
+    }
+  }) : void 0;
+  const open = useCallback(() => setOpen(true), [setOpen]);
+  const close = useCallback(() => {
+    setOpen(false);
+    setQueryState("");
+  }, [setOpen, setQueryState]);
+  const toggle = useCallback(() => isOpen ? close() : open(), [close, isOpen, open]);
+  const select = useCallback((next, label) => {
+    if (label !== void 0) registerLabel(next, label);
+    setValue(next);
+    close();
+  }, [close, registerLabel, setValue]);
+  const context = useMemo(() => {
+    const indicator = StyleSheet.flatten([styles.indicator, tint?.indicator]);
+    const tintedPlaceholder = tint ? StyleSheet.flatten([tint.value]).color : void 0;
+    return {
+      triggerStyle: tint ? [styles.trigger, tint.trigger] : styles.trigger,
+      triggerPressedStyle: pressed.trigger,
+      valueStyle: tint ? [styles.value, tint.value] : styles.value,
+      placeholderStyle: tint ? [styles.placeholder, {
+        color: tintedPlaceholder
+      }] : styles.placeholder,
+      indicatorStyle: styles.indicator,
+      overlayStyle: styles.overlay,
+      contentStyle: styles.content,
+      searchStyle: ownTint ? [own.search, ownTint.search] : own.search,
+      emptyStyle: own.empty,
+      itemStyle: styles.item,
+      itemPressedStyle: pressed.item,
+      itemLabelStyle: styles.itemLabel,
+      glyph: {
+        size: indicator.fontSize,
+        color: typeof indicator.color === "string" ? indicator.color : void 0
+      },
+      placeholderColor: StyleSheet.flatten([styles.placeholder]).color,
+      value,
+      query,
+      setQuery: setQueryState,
+      isOpen,
+      isDisabled,
+      isInvalid,
+      open,
+      close,
+      toggle,
+      select,
+      anchor,
+      setAnchor,
+      labelFor,
+      registerLabel
+    };
+  }, [styles, pressed, tint, own, ownTint, value, query, setQueryState, isOpen, isDisabled, isInvalid, open, close, toggle, select, anchor, labelFor, registerLabel]);
+  return /* @__PURE__ */jsx(AutocompleteProvider, {
+    value: context,
+    children
+  });
+}
+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 { ScrollView } from "react-native";
+import Animated from "react-native-reanimated";
+
+// src/utils/filter-items.ts
+import { Children, isValidElement } from "react";
+function fold(text) {
+  return text.normalize("NFD").replace(/[̀-ͯ]/g, "").toLowerCase();
+}
+function matchesQuery(label, query) {
+  const needle = fold(query.trim());
+  return needle === "" || fold(label).includes(needle);
+}
+function filterItems(children, query, isItem2) {
+  const kept = [];
+  let matched = 0;
+  Children.forEach(children, child => {
+    if (!isValidElement(child) || !isItem2(child.type)) {
+      kept.push(child);
+      return;
+    }
+    const label = readItemLabel(child.props);
+    if (label !== void 0 && !matchesQuery(label, query)) return;
+    matched += 1;
+    kept.push(child);
+  });
+  return {
+    children: kept,
+    matched
+  };
+}
+
+// src/components/autocomplete/autocomplete-empty.tsx
+import { forwardRef } from "react";
+import { Text } from "react-native";
+import { jsx as jsx2 } from "react/jsx-runtime";
+var AutocompleteEmpty = forwardRef(function AutocompleteEmpty2({
+  children,
+  style,
+  ...props
+}, ref) {
+  const {
+    emptyStyle
+  } = useAutocomplete();
+  const [styleProps, rest] = useStyleProps(props);
+  return /* @__PURE__ */jsx2(Text, {
+    ref,
+    ...rest,
+    style: [emptyStyle, styleProps, style],
+    children
+  });
+});
+AutocompleteEmpty.displayName = "XAUI.Autocomplete.Empty";
+
+// src/components/autocomplete/autocomplete-item.tsx
+import { forwardRef as forwardRef3, useCallback as useCallback2, useMemo as useMemo2 } from "react";
+
+// src/components/autocomplete/autocomplete-item-label.tsx
+import { forwardRef as forwardRef2 } from "react";
+import { Text as Text2 } from "react-native";
+import { jsx as jsx3 } from "react/jsx-runtime";
+var AutocompleteItemLabel = forwardRef2(function AutocompleteItemLabel2({
+  children,
+  style,
+  ...props
+}, ref) {
+  const {
+    itemLabelStyle
+  } = useAutocomplete();
+  const [styleProps, rest] = useStyleProps(props);
+  return /* @__PURE__ */jsx3(Text2, {
+    ref,
+    ...rest,
+    style: [itemLabelStyle, styleProps, style],
+    children
+  });
+});
+AutocompleteItemLabel.displayName = "XAUI.Autocomplete.ItemLabel";
+
+// src/components/autocomplete/autocomplete-item.tsx
+import { jsx as jsx4 } from "react/jsx-runtime";
+var AutocompleteItem = forwardRef3(function AutocompleteItem2({
+  value,
+  label,
+  children,
+  isDisabled = false,
+  asChild = false,
+  accessibilityRole = "menuitem",
+  accessibilityState,
+  style,
+  onPress,
+  onPressIn,
+  onPressOut,
+  ...props
+}, ref) {
+  const {
+    itemStyle,
+    itemPressedStyle,
+    value: selected,
+    isDisabled: isRootDisabled,
+    select
+  } = useAutocomplete();
+  const [styleProps, rest] = useStyleProps(props);
+  const [isPressed, press] = usePressState({
+    onPressIn,
+    onPressOut
+  });
+  const isSelected = selected === value;
+  const disabled = isRootDisabled || isDisabled;
+  const handlePress = useCallback2(event => {
+    onPress?.(event);
+    select(value, label ?? childrenToString(children) ?? void 0);
+  }, [children, label, onPress, select, value]);
+  const context = useMemo2(() => ({
+    isSelected,
+    isPressed,
+    isDisabled: disabled
+  }), [isSelected, isPressed, disabled]);
+  const text = childrenToString(children);
+  return /* @__PURE__ */jsx4(AutocompleteItemProvider, {
+    value: context,
+    children: /* @__PURE__ */jsx4(PressableFeedback, {
+      ref,
+      isPressed,
+      isDisabled: disabled,
+      asChild,
+      accessibilityRole,
+      accessibilityState: {
+        disabled,
+        selected: isSelected,
+        ...accessibilityState
+      },
+      ...rest,
+      style: [itemStyle, isPressed && itemPressedStyle, styleProps, typeof style === "function" ? style({
+        pressed: isPressed
+      }) : style],
+      onPress: handlePress,
+      onPressIn: press.onPressIn,
+      onPressOut: press.onPressOut,
+      children: text !== null ? /* @__PURE__ */jsx4(AutocompleteItemLabel, {
+        children: text
+      }) : children
+    })
+  });
+});
+AutocompleteItem.displayName = "XAUI.Autocomplete.Item";
+
+// src/components/autocomplete/autocomplete-search.tsx
+import { forwardRef as forwardRef4 } from "react";
+import { TextInput } from "react-native";
+import { jsx as jsx5 } from "react/jsx-runtime";
+var AutocompleteSearch = forwardRef4(function AutocompleteSearch2({
+  autoFocus = true,
+  style,
+  ...props
+}, ref) {
+  const {
+    searchStyle,
+    placeholderColor,
+    query,
+    setQuery,
+    isDisabled
+  } = useAutocomplete();
+  const [styleProps, rest] = useStyleProps(props);
+  return /* @__PURE__ */jsx5(TextInput, {
+    ref,
+    value: query,
+    onChangeText: setQuery,
+    autoFocus,
+    editable: !isDisabled,
+    autoCorrect: false,
+    autoCapitalize: "none",
+    placeholderTextColor: placeholderColor,
+    accessibilityRole: "search",
+    ...rest,
+    style: [searchStyle, styleProps, style]
+  });
+});
+AutocompleteSearch.displayName = "XAUI.Autocomplete.Search";
+
+// src/components/autocomplete/autocomplete-content.tsx
+import { jsx as jsx6, jsxs } from "react/jsx-runtime";
+var DEFAULT_OFFSET = 8;
+var DEFAULT_INSETS = {
+  top: 12,
+  bottom: 12,
+  start: 12,
+  end: 12
+};
+var isItem = type => type === AutocompleteItem;
+var isSearch = type => type === AutocompleteSearch;
+var isEmpty = type => type === AutocompleteEmpty;
+var AutocompleteContent = forwardRef5(function AutocompleteContent2({
+  children,
+  placement = "bottom",
+  align = "center",
+  width = "trigger",
+  offset = DEFAULT_OFFSET,
+  alignOffset = 0,
+  avoidCollisions = true,
+  insets,
+  style,
+  onLayout,
+  ...props
+}, ref) {
+  const context = useAutocomplete();
+  const {
+    contentStyle,
+    isOpen,
+    anchor,
+    query,
+    registerLabel
+  } = context;
+  const [styleProps, rest] = useStyleProps(props);
+  const {
+    position,
+    onContentLayout,
+    measuringStyle
+  } = useAnchoredPosition({
+    anchor,
+    isOpen,
+    placement,
+    align,
+    width,
+    offset,
+    alignOffset,
+    avoidCollisions,
+    insets: {
+      ...DEFAULT_INSETS,
+      ...insets
+    },
+    onLayout
+  });
+  useEffect(() => {
+    for (const [value, label] of collectItemLabels(children, isItem)) {
+      registerLabel(value, label);
+    }
+  }, [children, registerLabel]);
+  const {
+    search,
+    empty,
+    rest: listed
+  } = useMemo3(() => partition(children), [children]);
+  const {
+    children: results,
+    matched
+  } = useMemo3(() => filterItems(listed, query, isItem), [listed, query]);
+  if (!isOpen || anchor === null) return null;
+  return /* @__PURE__ */jsx6(Portal, {
+    children: /* @__PURE__ */jsx6(AutocompleteProvider, {
+      value: context,
+      children: /* @__PURE__ */jsxs(Animated.View, {
+        ref,
+        entering: position ? anchoredEntering(position.placement) : void 0,
+        exiting: position ? anchoredExiting(position.placement) : void 0,
+        onLayout: onContentLayout,
+        ...rest,
+        style: [contentStyle, position === null ? measuringStyle : {
+          top: position.top,
+          start: position.start,
+          width: position.width,
+          maxHeight: position.maxHeight
+        }, styleProps, style],
+        children: [search, /* @__PURE__ */jsx6(ScrollView, {
+          bounces: false,
+          keyboardShouldPersistTaps: "handled",
+          showsVerticalScrollIndicator: false,
+          children: matched === 0 && empty !== null ? empty : results
+        })]
+      }, position?.placement ?? "measuring")
+    })
+  });
+});
+AutocompleteContent.displayName = "XAUI.Autocomplete.Content";
+function partition(children) {
+  let search = null;
+  let empty = null;
+  const rest = [];
+  Children2.forEach(children, child => {
+    if (isValidElement2(child) && isSearch(child.type)) {
+      search = child;
+      return;
+    }
+    if (isValidElement2(child) && isEmpty(child.type)) {
+      empty = child;
+      return;
+    }
+    rest.push(child);
+  });
+  return {
+    search,
+    empty,
+    rest
+  };
+}
+
+// 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\":[]}"
+};
+function AutocompleteIndicator(props) {
+  const {
+    as = ChevronDownIcon
+  } = props;
+  const {
+    indicatorStyle,
+    isOpen
+  } = useAutocomplete();
+  const progress = useSharedValue(isOpen ? 1 : 0);
+  useEffect2(() => {
+    progress.set(withSpring(isOpen ? 1 : 0, INDICATOR_SPRING));
+  }, [isOpen, progress]);
+  const rotation = useAnimatedStyle(function chunkFOOXBVOQJs1Factory({
+    _worklet_1971635372740_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 = {
+      interpolate,
+      progress,
+      INDICATOR_ROTATION
+    };
+    chunkFOOXBVOQJs1.__workletHash = 1971635372740;
+    chunkFOOXBVOQJs1.__pluginVersion = "0.7.4";
+    chunkFOOXBVOQJs1.__initData = _worklet_1971635372740_init_data;
+    chunkFOOXBVOQJs1.__stackDetails = _e;
+    return chunkFOOXBVOQJs1;
+  }({
+    _worklet_1971635372740_init_data,
+    interpolate,
+    progress,
+    INDICATOR_ROTATION
+  }));
+  return /* @__PURE__ */jsx7(Animated2.View, {
+    style: [indicatorStyle, rotation],
+    children: /* @__PURE__ */jsx7(Icon, {
+      as
+    })
+  });
+}
+AutocompleteIndicator.displayName = "XAUI.Autocomplete.Indicator";
+
+// src/components/autocomplete/autocomplete-overlay.tsx
+import { forwardRef as forwardRef6 } from "react";
+import { Pressable } from "react-native";
+import Animated3 from "react-native-reanimated";
+import { jsx as jsx8 } from "react/jsx-runtime";
+var AnimatedPressable = Animated3.createAnimatedComponent(Pressable);
+var AutocompleteOverlay = forwardRef6(function AutocompleteOverlay2({
+  children,
+  style,
+  ...props
+}, ref) {
+  const context = useAutocomplete();
+  const {
+    overlayStyle,
+    isOpen,
+    close
+  } = context;
+  const [styleProps, rest] = useStyleProps(props);
+  if (!isOpen) return null;
+  return /* @__PURE__ */jsx8(Portal, {
+    children: /* @__PURE__ */jsx8(AutocompleteProvider, {
+      value: context,
+      children: /* @__PURE__ */jsx8(AnimatedPressable, {
+        ref,
+        entering: overlayEntering,
+        exiting: overlayExiting,
+        accessibilityRole: "none",
+        importantForAccessibility: "no",
+        onPress: close,
+        ...rest,
+        style: [overlayStyle, styleProps, style],
+        children
+      })
+    })
+  });
+});
+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({
+  children,
+  asChild = false,
+  accessibilityRole = "combobox",
+  accessibilityState,
+  style,
+  onLayout,
+  onPressIn,
+  onPressOut,
+  onPress,
+  ...props
+}, ref) {
+  const {
+    triggerStyle,
+    triggerPressedStyle,
+    glyph,
+    isOpen,
+    isDisabled,
+    isInvalid,
+    toggle,
+    setAnchor
+  } = useAutocomplete();
+  const [styleProps, rest] = useStyleProps(props);
+  const [isPressed, press] = usePressState({
+    onPressIn,
+    onPressOut
+  });
+  const node = useRef(null);
+  const refs = useMergedRef(node, ref);
+  const measure = useCallback3(() => {
+    node.current?.measureInWindow((x, y, width, height) => {
+      setAnchor({
+        x,
+        y,
+        width,
+        height
+      });
+    });
+  }, [setAnchor]);
+  const handleLayout = useCallback3(event => {
+    onLayout?.(event);
+    measure();
+  }, [measure, onLayout]);
+  useEffect3(() => {
+    if (isOpen) measure();
+  }, [isOpen, measure]);
+  const handlePress = useCallback3(event => {
+    onPress?.(event);
+    measure();
+    toggle();
+  }, [measure, onPress, toggle]);
+  return /* @__PURE__ */jsx9(IconContext.Provider, {
+    value: glyph,
+    children: /* @__PURE__ */jsx9(PressableFeedback, {
+      ref: refs,
+      isPressed,
+      isDisabled,
+      asChild,
+      accessibilityRole,
+      accessibilityState: {
+        disabled: isDisabled,
+        expanded: isOpen,
+        ...accessibilityState
+      },
+      "aria-invalid": isInvalid || void 0,
+      ...rest,
+      onLayout: handleLayout,
+      style: [triggerStyle, isPressed && triggerPressedStyle, styleProps, typeof style === "function" ? style({
+        pressed: isPressed
+      }) : style],
+      onPress: handlePress,
+      onPressIn: press.onPressIn,
+      onPressOut: press.onPressOut,
+      children
+    })
+  });
+});
+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({
+  children,
+  placeholder,
+  style,
+  ...props
+}, ref) {
+  const {
+    valueStyle,
+    placeholderStyle,
+    value,
+    labelFor
+  } = useAutocomplete();
+  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, {
+    ref,
+    numberOfLines: 1,
+    ...rest,
+    style: [isEmpty2 ? placeholderStyle : valueStyle, styleProps, style],
+    children: isEmpty2 ? placeholder : label
+  });
+});
+AutocompleteValue.displayName = "XAUI.Autocomplete.Value";
+
+// src/components/autocomplete/index.ts
+var Autocomplete2 = Object.assign(Autocomplete, {
+  Trigger: AutocompleteTrigger,
+  Value: AutocompleteValue,
+  Indicator: AutocompleteIndicator,
+  Overlay: AutocompleteOverlay,
+  Content: AutocompleteContent,
+  Search: AutocompleteSearch,
+  Item: AutocompleteItem,
+  ItemLabel: AutocompleteItemLabel,
+  Empty: AutocompleteEmpty
+});
+export { useAutocomplete, useAutocompleteItem, autocompleteRecipe, Autocomplete, AutocompleteEmpty, AutocompleteItemLabel, AutocompleteItem, AutocompleteSearch, AutocompleteContent, AutocompleteIndicator, AutocompleteOverlay, AutocompleteTrigger, AutocompleteValue, Autocomplete2 };