@tamagui/linear-gradient 1.0.4

package/dist/cjs/types.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/types.tsx"],
+  "sourcesContent": ["import type {\n  ContextData,\n  FloatingContext,\n  ReferenceType,\n} from '@floating-ui/react-dom-interactions'\nimport type { SizeTokens } from '@tamagui/core'\nimport type { Scope } from '@tamagui/create-context'\nimport type { ThemeableStackProps, YStackProps } from '@tamagui/stacks'\nimport type {\n  DispatchWithoutAction,\n  HTMLProps,\n  MutableRefObject,\n  ReactNode,\n} from 'react'\n\nexport type Direction = 'ltr' | 'rtl'\n\nexport type ScopedProps<P> = P & { __scopeSelect?: Scope }\n\nexport type SelectImplProps = ScopedProps<SelectProps> & {\n  activeIndexRef: any\n  selectedIndexRef: any\n  listContentRef: any\n}\n\nexport interface SelectProps {\n  id?: string\n  children?: ReactNode\n  value?: string\n  defaultValue?: string\n  onValueChange?(value: string): void\n  open?: boolean\n  defaultOpen?: boolean\n  onOpenChange?(open: boolean): void\n  dir?: Direction\n  name?: string\n  autoComplete?: string\n  size?: SizeTokens\n}\n\nexport interface SelectContextValue {\n  dir?: Direction\n  scopeKey: string\n  sheetBreakpoint: any\n  size?: SizeTokens\n  value: any\n  selectedItem: ReactNode\n  setSelectedItem: (item: ReactNode) => void\n  selectedIndex: number\n  setSelectedIndex: (index: number) => void\n  activeIndex: number | null\n  setActiveIndex: (index: number | null) => void\n  setValueAtIndex: (index: number, value: string) => void\n  open: boolean\n  setOpen: (open: boolean) => void\n  onChange: (value: string) => void\n  valueNode: Element | null\n  onValueNodeChange(node: HTMLElement): void\n  valueNodeHasChildren: boolean\n  onValueNodeHasChildrenChange(hasChildren: boolean): void\n  forceUpdate: DispatchWithoutAction\n\n  // SheetImpl only:\n  isInSheet?: boolean\n\n  // InlineImpl only:\n  fallback: boolean\n  blockSelection: boolean\n  allowSelectRef?: MutableRefObject<boolean>\n  allowMouseUpRef?: MutableRefObject<boolean>\n  upArrowRef?: MutableRefObject<HTMLDivElement | null>\n  downArrowRef?: MutableRefObject<HTMLDivElement | null>\n  selectTimeoutRef?: MutableRefObject<any>\n  setScrollTop?: Function\n  setInnerOffset?: Function\n  dataRef?: MutableRefObject<ContextData>\n  controlledScrolling?: boolean\n  listRef?: MutableRefObject<Array<HTMLElement | null>>\n  floatingRef?: MutableRefObject<HTMLElement | null>\n  canScrollUp?: boolean\n  canScrollDown?: boolean\n  floatingContext?: FloatingContext<ReferenceType>\n  interactions?: {\n    getReferenceProps: (userProps?: HTMLProps<Element> | undefined) => any\n    getFloatingProps: (userProps?: HTMLProps<HTMLElement> | undefined) => any\n    getItemProps: (userProps?: HTMLProps<HTMLElement> | undefined) => any\n  }\n}\n\nexport type SelectViewportProps = ThemeableStackProps & {\n  size?: SizeTokens\n}\n\nexport type SelectContentProps = ScopedProps<{\n  children?: React.ReactNode\n  zIndex?: number\n}>\n\nexport interface SelectScrollButtonImplProps extends YStackProps {\n  dir: 'up' | 'down'\n  componentName: string\n}\n\nexport interface SelectScrollButtonProps\n  extends Omit<SelectScrollButtonImplProps, 'dir' | 'componentName'> {}\n"],
+  "mappings": ";;;;;;;;;;;;;;AAAA;AAAA;",
+  "names": []
+}

package/dist/cjs/useSelectBreakpointActive.js

@@ -0,0 +1,39 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var useSelectBreakpointActive_exports = {};
+__export(useSelectBreakpointActive_exports, {
+  useSelectBreakpointActive: () => useSelectBreakpointActive,
+  useShowSelectSheet: () => useShowSelectSheet
+});
+module.exports = __toCommonJS(useSelectBreakpointActive_exports);
+var import_core = require("@tamagui/core");
+const useSelectBreakpointActive = (sheetBreakpoint) => {
+  const media = (0, import_core.useMedia)();
+  return sheetBreakpoint ? media[sheetBreakpoint] : false;
+};
+const useShowSelectSheet = (context) => {
+  const breakpointActive = useSelectBreakpointActive(context.sheetBreakpoint);
+  return context.open === false ? false : breakpointActive;
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  useSelectBreakpointActive,
+  useShowSelectSheet
+});
+//# sourceMappingURL=useSelectBreakpointActive.js.map

package/dist/cjs/useSelectBreakpointActive.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/useSelectBreakpointActive.tsx"],
+  "sourcesContent": ["import { useMedia } from '@tamagui/core'\n\nimport { SelectContextValue } from './types'\n\nexport const useSelectBreakpointActive = (\n  sheetBreakpoint: SelectContextValue['sheetBreakpoint'],\n) => {\n  const media = useMedia()\n  return sheetBreakpoint ? media[sheetBreakpoint] : false\n}\n\nexport const useShowSelectSheet = (context: SelectContextValue) => {\n  const breakpointActive = useSelectBreakpointActive(context.sheetBreakpoint)\n  return context.open === false ? false : breakpointActive\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAAyB;AAIlB,MAAM,4BAA4B,CACvC,oBACG;AACH,QAAM,YAAQ,sBAAS;AACvB,SAAO,kBAAkB,MAAM,mBAAmB;AACpD;AAEO,MAAM,qBAAqB,CAAC,YAAgC;AACjE,QAAM,mBAAmB,0BAA0B,QAAQ,eAAe;AAC1E,SAAO,QAAQ,SAAS,QAAQ,QAAQ;AAC1C;",
+  "names": []
+}

package/dist/esm/BubbleSelect.js

@@ -0,0 +1,25 @@
+import { usePrevious } from "@radix-ui/react-use-previous";
+import { useComposedRefs } from "@tamagui/compose-refs";
+import * as React from "react";
+const BubbleSelect = React.forwardRef((props, forwardedRef) => {
+  const { value, ...selectProps } = props;
+  const ref = React.useRef(null);
+  const composedRefs = useComposedRefs(forwardedRef, ref);
+  const prevValue = usePrevious(value);
+  React.useEffect(() => {
+    const select = ref.current;
+    const selectProto = window.HTMLSelectElement.prototype;
+    const descriptor = Object.getOwnPropertyDescriptor(
+      selectProto,
+      "value"
+    );
+    const setValue = descriptor.set;
+    if (prevValue !== value && setValue) {
+      const event = new Event("change", { bubbles: true });
+      setValue.call(select, value);
+      select.dispatchEvent(event);
+    }
+  }, [prevValue, value]);
+  return null;
+});
+//# sourceMappingURL=BubbleSelect.js.map

package/dist/esm/BubbleSelect.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/BubbleSelect.tsx"],
+  "sourcesContent": ["import { usePrevious } from '@radix-ui/react-use-previous'\nimport { useComposedRefs } from '@tamagui/compose-refs'\nimport * as React from 'react'\n\n/* -----------------------------------------------------------------------------------------------*/\nconst BubbleSelect = React.forwardRef<\n  HTMLSelectElement,\n  React.ComponentPropsWithoutRef<'select'>\n>((props, forwardedRef) => {\n  const { value, ...selectProps } = props\n  const ref = React.useRef<HTMLSelectElement>(null)\n  const composedRefs = useComposedRefs(forwardedRef, ref)\n  const prevValue = usePrevious(value)\n\n  // Bubble value change to parents (e.g form change event)\n  React.useEffect(() => {\n    const select = ref.current!\n    const selectProto = window.HTMLSelectElement.prototype\n    const descriptor = Object.getOwnPropertyDescriptor(\n      selectProto,\n      'value',\n    ) as PropertyDescriptor\n    const setValue = descriptor.set\n    if (prevValue !== value && setValue) {\n      const event = new Event('change', { bubbles: true })\n      setValue.call(select, value)\n      select.dispatchEvent(event)\n    }\n  }, [prevValue, value])\n\n  /**\n   * We purposefully use a `select` here to support form autofill as much\n   * as possible.\n   *\n   * We purposefully do not add the `value` attribute here to allow the value\n   * to be set programatically and bubble to any parent form `onChange` event.\n   * Adding the `value` will cause React to consider the programatic\n   * dispatch a duplicate and it will get swallowed.\n   *\n   * We use `VisuallyHidden` rather than `display: \"none\"` because Safari autofill\n   * won't work otherwise.\n   */\n  // TODO\n  return null\n  // return (\n  //   <VisuallyHidden asChild>\n  //     <select {...selectProps} ref={composedRefs} defaultValue={value} />\n  //   </VisuallyHidden>\n  // )\n})\n"],
+  "mappings": "AAAA,SAAS,mBAAmB;AAC5B,SAAS,uBAAuB;AAChC,YAAY,WAAW;AAGvB,MAAM,eAAe,MAAM,WAGzB,CAAC,OAAO,iBAAiB;AACzB,QAAM,EAAE,UAAU,YAAY,IAAI;AAClC,QAAM,MAAM,MAAM,OAA0B,IAAI;AAChD,QAAM,eAAe,gBAAgB,cAAc,GAAG;AACtD,QAAM,YAAY,YAAY,KAAK;AAGnC,QAAM,UAAU,MAAM;AACpB,UAAM,SAAS,IAAI;AACnB,UAAM,cAAc,OAAO,kBAAkB;AAC7C,UAAM,aAAa,OAAO;AAAA,MACxB;AAAA,MACA;AAAA,IACF;AACA,UAAM,WAAW,WAAW;AAC5B,QAAI,cAAc,SAAS,UAAU;AACnC,YAAM,QAAQ,IAAI,MAAM,UAAU,EAAE,SAAS,KAAK,CAAC;AACnD,eAAS,KAAK,QAAQ,KAAK;AAC3B,aAAO,cAAc,KAAK;AAAA,IAC5B;AAAA,EACF,GAAG,CAAC,WAAW,KAAK,CAAC;AAerB,SAAO;AAMT,CAAC;",
+  "names": []
+}

package/dist/esm/LinearGradient.js

@@ -0,0 +1,51 @@
+import { jsx } from "react/jsx-runtime";
+import {
+  getVariable,
+  styled,
+  themeable,
+  useTheme
+} from "@tamagui/core";
+import { YStack } from "@tamagui/stacks";
+import * as React from "react";
+import { StyleSheet } from "react-native";
+import {
+  LinearGradient as ExpoLinearGradient
+} from "./linear-gradient";
+const LinearGradient = YStack.extractable(
+  themeable(
+    React.forwardRef((props, ref) => {
+      const { start, end, colors: colorsProp, locations, children, ...stackProps } = props;
+      const colors = useThemeColors(colorsProp || []);
+      return /* @__PURE__ */ jsx(LinearGradientFrame, {
+        ref,
+        ...stackProps,
+        children: /* @__PURE__ */ jsx(ExpoLinearGradient, {
+          start,
+          end,
+          colors,
+          locations,
+          style: StyleSheet.absoluteFill,
+          children
+        })
+      });
+    })
+  )
+);
+const LinearGradientFrame = styled(YStack, {
+  name: "LinearGradient",
+  overflow: "hidden",
+  position: "relative"
+});
+const useThemeColors = (colors) => {
+  const theme = useTheme();
+  return colors.map((color) => {
+    if (color[0] === "$") {
+      return getVariable(theme[color] || color);
+    }
+    return color;
+  });
+};
+export {
+  LinearGradient
+};
+//# sourceMappingURL=LinearGradient.js.map

package/dist/esm/LinearGradient.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/LinearGradient.tsx"],
+  "sourcesContent": ["import {\n  ColorTokens,\n  ThemeTokens,\n  getVariable,\n  styled,\n  themeable,\n  useTheme,\n} from '@tamagui/core'\nimport { YStack, YStackProps } from '@tamagui/stacks'\nimport * as React from 'react'\nimport { StyleSheet, View } from 'react-native'\n\nimport {\n  LinearGradient as ExpoLinearGradient,\n  LinearGradientProps as ExpoLinearGradientProps,\n} from './linear-gradient'\n\n//\nexport type LinearGradientProps = Omit<ExpoLinearGradientProps, 'colors'> &\n  Omit<YStackProps, 'children' | keyof ExpoLinearGradientProps> & {\n    colors?: (ColorTokens | ThemeTokens | (string & {}))[]\n  }\n\nexport const LinearGradient: React.ForwardRefExoticComponent<\n  LinearGradientProps & React.RefAttributes<HTMLElement | View>\n> = YStack.extractable(\n  themeable(\n    React.forwardRef((props: LinearGradientProps, ref) => {\n      const { start, end, colors: colorsProp, locations, children, ...stackProps } = props\n      const colors = useThemeColors(colorsProp || [])\n      return (\n        // @ts-ignore\n        <LinearGradientFrame ref={ref} {...stackProps}>\n          <ExpoLinearGradient\n            start={start}\n            end={end}\n            colors={colors}\n            locations={locations}\n            style={StyleSheet.absoluteFill}\n          >\n            {children}\n          </ExpoLinearGradient>\n        </LinearGradientFrame>\n      )\n    })\n  )\n) as any\n\nconst LinearGradientFrame = styled(YStack, {\n  name: 'LinearGradient',\n  overflow: 'hidden',\n  position: 'relative',\n})\n\n// resolve tamagui theme values\nconst useThemeColors = (colors: string[]) => {\n  const theme = useTheme()\n  return colors.map((color) => {\n    if (color[0] === '$') {\n      return getVariable(theme[color] || color)\n    }\n    return color\n  })\n}\n"],
+  "mappings": "AAiCU;AAjCV;AAAA,EAGE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,cAA2B;AACpC,YAAY,WAAW;AACvB,SAAS,kBAAwB;AAEjC;AAAA,EACE,kBAAkB;AAAA,OAEb;AAQA,MAAM,iBAET,OAAO;AAAA,EACT;AAAA,IACE,MAAM,WAAW,CAAC,OAA4B,QAAQ;AACpD,YAAM,EAAE,OAAO,KAAK,QAAQ,YAAY,WAAW,aAAa,WAAW,IAAI;AAC/E,YAAM,SAAS,eAAe,cAAc,CAAC,CAAC;AAC9C,aAEE,oBAAC;AAAA,QAAoB;AAAA,QAAW,GAAG;AAAA,QACjC,8BAAC;AAAA,UACC;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA,OAAO,WAAW;AAAA,UAEjB;AAAA,SACH;AAAA,OACF;AAAA,IAEJ,CAAC;AAAA,EACH;AACF;AAEA,MAAM,sBAAsB,OAAO,QAAQ;AAAA,EACzC,MAAM;AAAA,EACN,UAAU;AAAA,EACV,UAAU;AACZ,CAAC;AAGD,MAAM,iBAAiB,CAAC,WAAqB;AAC3C,QAAM,QAAQ,SAAS;AACvB,SAAO,OAAO,IAAI,CAAC,UAAU;AAC3B,QAAI,MAAM,OAAO,KAAK;AACpB,aAAO,YAAY,MAAM,UAAU,KAAK;AAAA,IAC1C;AACA,WAAO;AAAA,EACT,CAAC;AACH;",
+  "names": []
+}

package/dist/esm/Select.js

@@ -0,0 +1,452 @@
+import { Fragment, jsx } from "react/jsx-runtime";
+import { Adapt, useAdaptParent } from "@tamagui/adapt";
+import { useComposedRefs } from "@tamagui/compose-refs";
+import { isWeb } from "@tamagui/core";
+import {
+  styled,
+  useGet,
+  useIsomorphicLayoutEffect,
+  withStaticProperties
+} from "@tamagui/core";
+import { useId } from "@tamagui/core";
+import { ListItem } from "@tamagui/list-item";
+import { PortalHost } from "@tamagui/portal";
+import { Separator } from "@tamagui/separator";
+import { ControlledSheet, SheetController } from "@tamagui/sheet";
+import { XStack, YStack } from "@tamagui/stacks";
+import { Paragraph, SizableText } from "@tamagui/text";
+import { useControllableState } from "@tamagui/use-controllable-state";
+import * as React from "react";
+import { SELECT_NAME } from "./constants";
+import { SelectProvider, createSelectContext, useSelectContext } from "./context";
+import { SelectContent } from "./SelectContent";
+import { SelectInlineImpl } from "./SelectImpl";
+import { SelectScrollDownButton, SelectScrollUpButton } from "./SelectScrollButton";
+import { SelectViewport } from "./SelectViewport";
+import {
+  useSelectBreakpointActive,
+  useShowSelectSheet
+} from "./useSelectBreakpointActive";
+const TRIGGER_NAME = "SelectTrigger";
+const SelectTrigger = React.forwardRef(
+  (props, forwardedRef) => {
+    const {
+      __scopeSelect,
+      disabled = false,
+      "aria-labelledby": ariaLabelledby,
+      ...triggerProps
+    } = props;
+    const context = useSelectContext(TRIGGER_NAME, __scopeSelect);
+    const labelledBy = ariaLabelledby;
+    return /* @__PURE__ */ jsx(ListItem, {
+      componentName: TRIGGER_NAME,
+      backgrounded: true,
+      radiused: true,
+      hoverTheme: true,
+      pressTheme: true,
+      focusTheme: true,
+      focusable: true,
+      borderWidth: 1,
+      size: context.size,
+      "aria-expanded": context.open,
+      "aria-autocomplete": "none",
+      "aria-labelledby": labelledBy,
+      dir: context.dir,
+      disabled,
+      "data-disabled": disabled ? "" : void 0,
+      ...triggerProps,
+      ref: forwardedRef,
+      ...process.env.TAMAGUI_TARGET === "web" && context.interactions ? context.interactions.getReferenceProps() : {
+        onPress() {
+          context.setOpen(!context.open);
+        }
+      }
+    });
+  }
+);
+SelectTrigger.displayName = TRIGGER_NAME;
+const VALUE_NAME = "SelectValue";
+const SelectValueFrame = styled(Paragraph, {
+  name: VALUE_NAME,
+  selectable: false
+});
+const SelectValue = SelectValueFrame.extractable(
+  React.forwardRef(
+    ({
+      __scopeSelect,
+      children: childrenProp,
+      placeholder
+    }, forwardedRef) => {
+      const context = useSelectContext(VALUE_NAME, __scopeSelect);
+      const { onValueNodeHasChildrenChange } = context;
+      const composedRefs = useComposedRefs(forwardedRef, context.onValueNodeChange);
+      const children = childrenProp ?? context.selectedItem;
+      const hasChildren = !!children;
+      const selectValueChildren = context.value === void 0 && placeholder !== void 0 ? placeholder : children;
+      useIsomorphicLayoutEffect(() => {
+        onValueNodeHasChildrenChange(hasChildren);
+      }, [onValueNodeHasChildrenChange, hasChildren]);
+      return /* @__PURE__ */ jsx(SelectValueFrame, {
+        size: context.size,
+        ref: composedRefs,
+        pointerEvents: "none",
+        children: selectValueChildren
+      });
+    }
+  )
+);
+SelectValue.displayName = VALUE_NAME;
+const SelectIcon = styled(XStack, {
+  name: "SelectIcon",
+  "aria-hidden": true,
+  children: /* @__PURE__ */ jsx(Paragraph, {
+    children: "\u25BC"
+  })
+});
+const ITEM_NAME = "SelectItem";
+const [SelectItemContextProvider, useSelectItemContext] = createSelectContext(ITEM_NAME);
+const SelectItem = React.forwardRef(
+  (props, forwardedRef) => {
+    const {
+      __scopeSelect,
+      value,
+      disabled = false,
+      textValue: textValueProp,
+      index,
+      ...itemProps
+    } = props;
+    const context = useSelectContext(ITEM_NAME, __scopeSelect);
+    const isSelected = context.value === value;
+    const textId = useId();
+    const {
+      selectedIndex,
+      setSelectedIndex,
+      listRef,
+      open,
+      setOpen,
+      onChange,
+      setActiveIndex,
+      allowMouseUpRef,
+      allowSelectRef,
+      setValueAtIndex,
+      selectTimeoutRef,
+      dataRef
+    } = context;
+    const composedRefs = useComposedRefs(forwardedRef, (node) => {
+      if (!isWeb)
+        return;
+      if (node instanceof HTMLElement) {
+        if (listRef) {
+          listRef.current[index] = node;
+        }
+      }
+    });
+    React.useEffect(() => {
+      setValueAtIndex(index, value);
+    }, [index, setValueAtIndex, value]);
+    function handleSelect() {
+      setSelectedIndex(index);
+      onChange(value);
+      setOpen(false);
+    }
+    const selectItemProps = context.interactions ? context.interactions.getItemProps({
+      onTouchStart() {
+        allowSelectRef.current = true;
+        allowMouseUpRef.current = false;
+      },
+      onKeyDown(event) {
+        if (event.key === "Enter" || event.key === " " && !(dataRef == null ? void 0 : dataRef.current.typing)) {
+          event.preventDefault();
+          handleSelect();
+        } else {
+          allowSelectRef.current = true;
+        }
+      },
+      onClick() {
+        if (allowSelectRef.current) {
+          setSelectedIndex(index);
+          setOpen(false);
+        }
+      },
+      onMouseUp() {
+        if (!allowMouseUpRef.current) {
+          return;
+        }
+        if (allowSelectRef.current) {
+          handleSelect();
+        }
+        clearTimeout(selectTimeoutRef.current);
+        selectTimeoutRef.current = setTimeout(() => {
+          allowSelectRef.current = true;
+        });
+      }
+    }) : {
+      onPress: handleSelect
+    };
+    return /* @__PURE__ */ jsx(SelectItemContextProvider, {
+      scope: __scopeSelect,
+      value,
+      textId: textId || "",
+      isSelected,
+      children: /* @__PURE__ */ jsx(ListItem, {
+        backgrounded: true,
+        pressTheme: true,
+        cursor: "",
+        focusTheme: true,
+        outlineWidth: 0,
+        componentName: ITEM_NAME,
+        ref: composedRefs,
+        "aria-labelledby": textId,
+        "aria-selected": isSelected,
+        "data-state": isSelected ? "active" : "inactive",
+        "aria-disabled": disabled || void 0,
+        "data-disabled": disabled ? "" : void 0,
+        tabIndex: disabled ? void 0 : -1,
+        size: context.size,
+        ...itemProps,
+        ...selectItemProps
+      })
+    });
+  }
+);
+SelectItem.displayName = ITEM_NAME;
+const ITEM_TEXT_NAME = "SelectItemText";
+const SelectItemTextFrame = styled(SizableText, {
+  name: ITEM_TEXT_NAME,
+  selectable: false
+});
+const SelectItemText = React.forwardRef(
+  (props, forwardedRef) => {
+    const { __scopeSelect, className, ...itemTextProps } = props;
+    const context = useSelectContext(ITEM_TEXT_NAME, __scopeSelect);
+    const itemContext = useSelectItemContext(ITEM_TEXT_NAME, __scopeSelect);
+    const ref = React.useRef(null);
+    const composedRefs = useComposedRefs(forwardedRef, ref);
+    const isSelected = Boolean(itemContext.isSelected && context.valueNode);
+    const contents = React.useMemo(
+      () => /* @__PURE__ */ jsx(SelectItemTextFrame, {
+        className,
+        size: context.size,
+        id: itemContext.textId,
+        ...itemTextProps,
+        ref: composedRefs
+      }),
+      [props, context.size, className, itemContext.textId]
+    );
+    React.useEffect(() => {
+      if (isSelected) {
+        context.setSelectedItem(contents);
+      }
+    }, [isSelected, contents]);
+    return /* @__PURE__ */ jsx(Fragment, {
+      children: contents
+    });
+  }
+);
+SelectItemText.displayName = ITEM_TEXT_NAME;
+const ITEM_INDICATOR_NAME = "SelectItemIndicator";
+const SelectItemIndicatorFrame = styled(XStack, {
+  name: ITEM_TEXT_NAME
+});
+const SelectItemIndicator = React.forwardRef(
+  (props, forwardedRef) => {
+    const { __scopeSelect, ...itemIndicatorProps } = props;
+    const itemContext = useSelectItemContext(ITEM_INDICATOR_NAME, __scopeSelect);
+    return itemContext.isSelected ? /* @__PURE__ */ jsx(SelectItemIndicatorFrame, {
+      "aria-hidden": true,
+      ...itemIndicatorProps,
+      ref: forwardedRef
+    }) : null;
+  }
+);
+SelectItemIndicator.displayName = ITEM_INDICATOR_NAME;
+const GROUP_NAME = "SelectGroup";
+const [SelectGroupContextProvider, useSelectGroupContext] = createSelectContext(GROUP_NAME);
+const SelectGroupFrame = styled(YStack, {
+  name: GROUP_NAME,
+  width: "100%"
+});
+const SelectGroup = React.forwardRef(
+  (props, forwardedRef) => {
+    const { __scopeSelect, ...groupProps } = props;
+    const groupId = useId();
+    return /* @__PURE__ */ jsx(SelectGroupContextProvider, {
+      scope: __scopeSelect,
+      id: groupId || "",
+      children: /* @__PURE__ */ jsx(SelectGroupFrame, {
+        role: "group",
+        "aria-labelledby": groupId,
+        ...groupProps,
+        ref: forwardedRef
+      })
+    });
+  }
+);
+SelectGroup.displayName = GROUP_NAME;
+const LABEL_NAME = "SelectLabel";
+const SelectLabel = React.forwardRef(
+  (props, forwardedRef) => {
+    const { __scopeSelect, ...labelProps } = props;
+    const context = useSelectContext(LABEL_NAME, __scopeSelect);
+    const groupContext = useSelectGroupContext(LABEL_NAME, __scopeSelect);
+    return /* @__PURE__ */ jsx(ListItem, {
+      componentName: LABEL_NAME,
+      fontWeight: "800",
+      id: groupContext.id,
+      size: context.size,
+      ...labelProps,
+      ref: forwardedRef
+    });
+  }
+);
+SelectLabel.displayName = LABEL_NAME;
+const SelectSeparator = styled(Separator, {
+  name: "SelectSeparator"
+});
+const SelectSheetController = (props) => {
+  const context = useSelectContext("SelectSheetController", props.__scopeSelect);
+  const showSheet = useShowSelectSheet(context);
+  const breakpointActive = useSelectBreakpointActive(context.sheetBreakpoint);
+  const getShowSheet = useGet(showSheet);
+  return /* @__PURE__ */ jsx(SheetController, {
+    onOpenChange: (val) => {
+      if (getShowSheet()) {
+        props.onOpenChange(val);
+      }
+    },
+    open: context.open,
+    hidden: breakpointActive === false,
+    children: props.children
+  });
+};
+const SelectSheetImpl = (props) => {
+  return /* @__PURE__ */ jsx(Fragment, {
+    children: props.children
+  });
+};
+const Select = withStaticProperties(
+  (props) => {
+    const {
+      __scopeSelect,
+      children,
+      open: openProp,
+      defaultOpen,
+      onOpenChange,
+      value: valueProp,
+      defaultValue,
+      onValueChange,
+      size: sizeProp = "$4",
+      dir
+    } = props;
+    const id = useId();
+    const scopeKey = __scopeSelect ? Object.keys(__scopeSelect)[0] ?? id : id;
+    const { when, AdaptProvider } = useAdaptParent({
+      Contents: React.useCallback(
+        () => /* @__PURE__ */ jsx(PortalHost, {
+          name: `${scopeKey}SheetContents`
+        }),
+        [scopeKey]
+      )
+    });
+    const sheetBreakpoint = when;
+    const isSheet = useSelectBreakpointActive(sheetBreakpoint);
+    const SelectImpl = isSheet || !isWeb ? SelectSheetImpl : SelectInlineImpl;
+    const forceUpdate = React.useReducer(() => ({}), {})[1];
+    const [selectedItem, setSelectedItem] = React.useState(null);
+    const [open, setOpen] = useControllableState({
+      prop: openProp,
+      defaultProp: defaultOpen || false,
+      onChange: onOpenChange,
+      strategy: "most-recent-wins"
+    });
+    const [value, setValue] = useControllableState({
+      prop: valueProp,
+      defaultProp: defaultValue || "",
+      onChange: onValueChange,
+      strategy: "most-recent-wins",
+      transition: true
+    });
+    const [activeIndex, setActiveIndex] = React.useState(null);
+    const selectedIndexRef = React.useRef(null);
+    const activeIndexRef = React.useRef(null);
+    const listContentRef = React.useRef([]);
+    const [selectedIndex, setSelectedIndex] = React.useState(
+      Math.max(0, listContentRef.current.indexOf(value))
+    );
+    const [valueNode, setValueNode] = React.useState(null);
+    const [valueNodeHasChildren, setValueNodeHasChildren] = React.useState(false);
+    useIsomorphicLayoutEffect(() => {
+      selectedIndexRef.current = selectedIndex;
+      activeIndexRef.current = activeIndex;
+    });
+    return /* @__PURE__ */ jsx(AdaptProvider, {
+      children: /* @__PURE__ */ jsx(SelectProvider, {
+        dir,
+        blockSelection: false,
+        size: sizeProp,
+        fallback: false,
+        selectedItem,
+        setSelectedItem,
+        forceUpdate,
+        valueNode,
+        onValueNodeChange: setValueNode,
+        onValueNodeHasChildrenChange: setValueNodeHasChildren,
+        valueNodeHasChildren,
+        scopeKey,
+        sheetBreakpoint,
+        scope: __scopeSelect,
+        setValueAtIndex: (index, value2) => {
+          listContentRef.current[index] = value2;
+        },
+        activeIndex,
+        onChange: setValue,
+        selectedIndex,
+        setActiveIndex,
+        setOpen,
+        setSelectedIndex,
+        value,
+        open,
+        children: /* @__PURE__ */ jsx(SelectSheetController, {
+          onOpenChange: setOpen,
+          __scopeSelect,
+          children: /* @__PURE__ */ jsx(SelectImpl, {
+            activeIndexRef,
+            listContentRef,
+            selectedIndexRef,
+            ...props,
+            open,
+            value,
+            children
+          })
+        })
+      })
+    });
+  },
+  {
+    Adapt,
+    Content: SelectContent,
+    Group: SelectGroup,
+    Icon: SelectIcon,
+    Item: SelectItem,
+    ItemIndicator: SelectItemIndicator,
+    ItemText: SelectItemText,
+    Label: SelectLabel,
+    ScrollDownButton: SelectScrollDownButton,
+    ScrollUpButton: SelectScrollUpButton,
+    Trigger: SelectTrigger,
+    Value: SelectValue,
+    Viewport: SelectViewport,
+    Sheet: ControlledSheet
+  }
+);
+Select.displayName = SELECT_NAME;
+export {
+  Select,
+  SelectGroupFrame,
+  SelectIcon,
+  SelectItem,
+  SelectItemTextFrame,
+  SelectSeparator,
+  SelectTrigger
+};
+//# sourceMappingURL=Select.js.map