@cdx-ui/components 0.3.2 → 0.3.4

package/lib/module/components/Insight/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["cva","DISABLED_CURSOR","FRAME_WIDTH","SURFACE_RADIUS","SUMMARY_BODY","PRESS_REGION_STATE","join","insightFrameVariants","variants","layout","summary","detail","color","info","warning","danger","aiGenerated","true","false","compoundVariants","className","defaultVariants","insightSurfaceVariants","split","insightPressRegionVariants","insightIconVariants","insightSummaryTextVariants","hasClose","insightTagVariants","insightTagIconVariants","insightCloseVariants","insightHeaderVariants","insightTitleVariants","insightDescriptionVariants","insightContentVariants","insightFooterVariants"],"sourceRoot":"../../../../src","sources":["components/Insight/styles.ts"],"mappings":"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","ignoreList":[]}

package/lib/module/components/InsightStack/index.js

@@ -0,0 +1,89 @@
+"use strict";
+
+import { cloneElement, forwardRef, isValidElement } from 'react';
+import { View } from 'react-native';
+import { Slot, dataAttributes, mergeDataAttributes } from '@cdx-ui/primitives';
+import { cn } from '@cdx-ui/utils';
+import { insightStackFrontVariants, insightStackLayerVariants, insightStackRootVariants } from './styles';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+const layerCountFor = count => count >= 3 ? 2 : count >= 2 ? 1 : 0;
+function InsightStackLayer({
+  depth,
+  layers
+}) {
+  return /*#__PURE__*/_jsx(View, {
+    "aria-hidden": true,
+    accessibilityElementsHidden: true,
+    importantForAccessibility: "no-hide-descendants",
+    className: insightStackLayerVariants({
+      depth,
+      layers
+    }),
+    ...dataAttributes({
+      slot: 'insight-stack-layer'
+    })
+  });
+}
+function InsightStackBody({
+  layers,
+  children
+}) {
+  return /*#__PURE__*/_jsxs(_Fragment, {
+    children: [layers === 2 ? /*#__PURE__*/_jsx(InsightStackLayer, {
+      depth: 2,
+      layers: 2
+    }) : null, layers === 0 ? null : /*#__PURE__*/_jsx(InsightStackLayer, {
+      depth: 1,
+      layers: layers
+    }), /*#__PURE__*/_jsx(View, {
+      className: insightStackFrontVariants(),
+      children: children
+    })]
+  });
+}
+
+/**
+ * Draws up to two decorative cards behind a summary Insight to show that more insights exist.
+ * The root adds no role, so the front Insight stays the only interactive element.
+ */
+export const InsightStack = /*#__PURE__*/forwardRef(({
+  count,
+  asChild = false,
+  className,
+  style,
+  children,
+  ...props
+}, ref) => {
+  const layers = layerCountFor(count);
+  const rootProps = {
+    className: cn(insightStackRootVariants({
+      layers
+    }), className),
+    style,
+    ...props,
+    ...mergeDataAttributes(props, dataAttributes({
+      slot: 'insight-stack'
+    }))
+  };
+  if (asChild && /*#__PURE__*/isValidElement(children)) {
+    const child = children;
+    return /*#__PURE__*/_jsx(Slot, {
+      ref: ref,
+      ...rootProps,
+      children: /*#__PURE__*/cloneElement(child, undefined, /*#__PURE__*/_jsx(InsightStackBody, {
+        layers: layers,
+        children: child.props.children
+      }))
+    });
+  }
+  return /*#__PURE__*/_jsx(View, {
+    ref: ref,
+    ...rootProps,
+    children: /*#__PURE__*/_jsx(InsightStackBody, {
+      layers: layers,
+      children: children
+    })
+  });
+});
+InsightStack.displayName = 'InsightStack';
+//# sourceMappingURL=index.js.map

package/lib/module/components/InsightStack/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["cloneElement","forwardRef","isValidElement","View","Slot","dataAttributes","mergeDataAttributes","cn","insightStackFrontVariants","insightStackLayerVariants","insightStackRootVariants","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","layerCountFor","count","InsightStackLayer","depth","layers","accessibilityElementsHidden","importantForAccessibility","className","slot","InsightStackBody","children","InsightStack","asChild","style","props","ref","rootProps","child","undefined","displayName"],"sourceRoot":"../../../../src","sources":["components/InsightStack/index.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/components/InsightStack/styles.js

@@ -0,0 +1,58 @@
+"use strict";
+
+import { cva } from '@cdx-ui/utils';
+
+// ── Root ────────────────────────────────────────────────────
+
+// The bottom padding is the room the layers peek into: 6px per layer, matching Figma.
+export const insightStackRootVariants = cva(['relative'], {
+  variants: {
+    layers: {
+      0: '',
+      1: 'pb-1.5',
+      2: 'pb-3'
+    }
+  },
+  defaultVariants: {
+    layers: 0
+  }
+});
+
+// ── Front ───────────────────────────────────────────────────
+
+// Keeps the front Insight painted above the layers on Android.
+export const insightStackFrontVariants = cva(['relative z-10']);
+
+// ── Layer ───────────────────────────────────────────────────
+
+// Each layer is anchored to the root's bottom, so it peeks 6px per depth below the front card
+// whatever that card's height. Both start at `top-5`, below where any front card begins: a detail
+// Insight's frame sits 11px down (its tag reserve), and the layer's 6px glow needs room above
+// that, so the layer tops stay hidden behind the opaque front card (at least 60px tall). The insets
+// are symmetric, so RTL needs no mirroring.
+export const insightStackLayerVariants = cva(['absolute', 'bg-surface-primary', 'border-2 border-stroke-secondary', 'rounded-[var(--border-radius-default)]', 'shadow-[0_0_6px_var(--color-surface-neutral-subtle)]'], {
+  variants: {
+    depth: {
+      1: 'inset-x-1 top-5',
+      2: 'inset-x-2 top-5 bottom-0'
+    },
+    layers: {
+      1: '',
+      2: ''
+    }
+  },
+  compoundVariants: [{
+    depth: 1,
+    layers: 1,
+    className: 'bottom-0'
+  }, {
+    depth: 1,
+    layers: 2,
+    className: 'bottom-1.5'
+  }],
+  defaultVariants: {
+    depth: 1,
+    layers: 1
+  }
+});
+//# sourceMappingURL=styles.js.map

package/lib/module/components/InsightStack/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["cva","insightStackRootVariants","variants","layers","defaultVariants","insightStackFrontVariants","insightStackLayerVariants","depth","compoundVariants","className"],"sourceRoot":"../../../../src","sources":["components/InsightStack/styles.ts"],"mappings":";;AAAA,SAASA,GAAG,QAA2B,eAAe;;AAEtD;;AAEA;AACA,OAAO,MAAMC,wBAAwB,GAAGD,GAAG,CAAC,CAAC,UAAU,CAAC,EAAE;EACxDE,QAAQ,EAAE;IACRC,MAAM,EAAE;MACN,CAAC,EAAE,EAAE;MACL,CAAC,EAAE,QAAQ;MACX,CAAC,EAAE;IACL;EACF,CAAC;EACDC,eAAe,EAAE;IACfD,MAAM,EAAE;EACV;AACF,CAAC,CAAC;;AAEF;;AAEA;AACA,OAAO,MAAME,yBAAyB,GAAGL,GAAG,CAAC,CAAC,eAAe,CAAC,CAAC;;AAE/D;;AAEA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMM,yBAAyB,GAAGN,GAAG,CAC1C,CACE,UAAU,EACV,oBAAoB,EACpB,kCAAkC,EAClC,wCAAwC,EACxC,sDAAsD,CACvD,EACD;EACEE,QAAQ,EAAE;IACRK,KAAK,EAAE;MACL,CAAC,EAAE,iBAAiB;MACpB,CAAC,EAAE;IACL,CAAC;IACDJ,MAAM,EAAE;MACN,CAAC,EAAE,EAAE;MACL,CAAC,EAAE;IACL;EACF,CAAC;EACDK,gBAAgB,EAAE,CAChB;IAAED,KAAK,EAAE,CAAC;IAAEJ,MAAM,EAAE,CAAC;IAAEM,SAAS,EAAE;EAAW,CAAC,EAC9C;IAAEF,KAAK,EAAE,CAAC;IAAEJ,MAAM,EAAE,CAAC;IAAEM,SAAS,EAAE;EAAa,CAAC,CACjD;EACDL,eAAe,EAAE;IACfG,KAAK,EAAE,CAAC;IACRJ,MAAM,EAAE;EACV;AACF,CACF,CAAC","ignoreList":[]}

package/lib/module/components/OtpInput/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["forwardRef","useMemo","View","OtpCellIndexProvider","OtpInputField","OtpInputProvider","dataAttributes","mergeDataAttributes","useInputContext","useOtpInput","ParentContext","cn","useParentContext","useStyleContext","Input","inputFieldVariants","otpCellVariants","otpFieldVariants","otpRootVariants","jsx","_jsx","SCOPE","useOtpInputStyleContext","OtpStyledCell","className","children","variant","variantProp","size","sizeProp","props","ref","context","displayName","OtpStyledField","setIsFocused","onFocus","e","onBlur","OtpInputRoot","fullWidth","style","cellCount","value","onChangeText","onComplete","isDisabled","isInvalid","isReadOnly","smsOtpAutofill","filterInput","allowedCharacters","characterPattern","getCellProps","cellTestIdPrefix","accessibilityLabel","rest","otpContext","rootClassName","parent","ctx","fieldClassName","resolvedDisabled","resolvedInvalid","resolvedReadOnly","cells","i","push","cellIndex","Provider","slot","OtpInput","Object","assign","Cell","Field"],"sourceRoot":"../../../../src","sources":["components/OtpInput/index.tsx"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["forwardRef","useMemo","View","OtpCellIndexProvider","OtpInputField","OtpInputProvider","dataAttributes","mergeDataAttributes","useInputContext","useOtpInput","ParentContext","cn","useParentContext","useStyleContext","Input","inputFieldVariants","otpCellVariants","otpFieldVariants","otpRootVariants","jsx","_jsx","SCOPE","useOtpInputStyleContext","OtpStyledCell","className","children","variant","variantProp","size","sizeProp","props","ref","context","displayName","OtpStyledField","setIsFocused","onFocus","e","onBlur","OtpInputRoot","fullWidth","style","cellCount","value","onChangeText","onComplete","isDisabled","isInvalid","isReadOnly","smsOtpAutofill","filterInput","allowedCharacters","characterPattern","getCellProps","cellTestIdPrefix","accessibilityLabel","rest","otpContext","rootClassName","parent","ctx","fieldClassName","resolvedDisabled","resolvedInvalid","resolvedReadOnly","cells","i","push","cellIndex","Provider","slot","OtpInput","Object","assign","Cell","Field"],"sourceRoot":"../../../../src","sources":["components/OtpInput/index.tsx"],"mappings":";;AACA,SAASA,UAAU,EAAEC,OAAO,QAAQ,OAAO;AAC3C,SAASC,IAAI,QAAwC,cAAc;AACnE,SACEC,oBAAoB,EACpBC,aAAa,EACbC,gBAAgB,EAChBC,cAAc,EACdC,mBAAmB,EACnBC,eAAe,EACfC,WAAW,QAGN,oBAAoB;AAC3B,SAASC,aAAa,EAAEC,EAAE,EAAEC,gBAAgB,EAAEC,eAAe,QAAQ,eAAe;AACpF,SAASC,KAAK,QAAyB,UAAU;AACjD,SAAiCC,kBAAkB,QAAQ,iBAAiB;AAC5E,SACEC,eAAe,EACfC,gBAAgB,EAChBC,eAAe,QAEV,UAAU;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAElB,MAAMC,KAAK,GAAG,WAAW;AAEzB,MAAMC,uBAAuB,GAAGA,CAAA,KAAMT,eAAe,CAACQ,KAAK,CAA+B;AAW1F,MAAME,aAAa,gBAAGvB,UAAU,CAC9B,CACE;EAAEwB,SAAS;EAAEC,QAAQ;EAAEC,OAAO,EAAEC,WAAW;EAAEC,IAAI,EAAEC,QAAQ;EAAE,GAAGC;AAAM,CAAC,EACvEC,GAAuB,KACpB;EACH,MAAMC,OAAO,GAAGV,uBAAuB,CAAC,CAAC;EACzC,MAAMI,OAAO,GAAGC,WAAW,IAAIK,OAAO,CAACN,OAAO,IAAI,SAAS;EAC3D,MAAME,IAAI,GAAGC,QAAQ,IAAIG,OAAO,CAACJ,IAAI,IAAI,SAAS;EAClD,oBACER,IAAA,CAACN,KAAK;IACJiB,GAAG,EAAEA,GAAI;IACTL,OAAO,EAAEA,OAAQ;IACjBE,IAAI,EAAEA,IAAK;IACXJ,SAAS,EAAEb,EAAE,CAACK,eAAe,CAAC;MAAEY;IAAK,CAAC,CAAC,EAAEJ,SAAS,CAAE;IAAA,GAChDM,KAAK;IAAAL,QAAA,EAERA;EAAQ,CACJ,CAAC;AAEZ,CACF,CAAC;AAEDF,aAAa,CAACU,WAAW,GAAG,eAAe;AAI3C;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,cAAc,gBAAGlC,UAAU,CAAsC,CAAC8B,KAAK,EAAEC,GAAG,KAAK;EACrF,MAAM;IAAEI;EAAa,CAAC,GAAG3B,eAAe,CAAC,CAAC;EAC1C,oBACEY,IAAA,CAAChB,aAAa;IACZ2B,GAAG,EAAEA,GAAI;IAAA,GACLD,KAAK;IACTM,OAAO,EAAGC,CAAC,IAAK;MACdF,YAAY,GAAG,IAAI,CAAC;MACpBL,KAAK,CAACM,OAAO,GAAGC,CAAC,CAAC;IACpB,CAAE;IACFC,MAAM,EAAGD,CAAC,IAAK;MACbF,YAAY,GAAG,KAAK,CAAC;MACrBL,KAAK,CAACQ,MAAM,GAAGD,CAAC,CAAC;IACnB;EAAE,CACH,CAAC;AAEN,CAAC,CAAC;AAEFH,cAAc,CAACD,WAAW,GAAG,gBAAgB;AAQ7C,MAAMM,YAAY,gBAAGvC,UAAU,CAC7B,CACE;EACE0B,OAAO,GAAG,SAAS;EACnBE,IAAI;EACJY,SAAS;EACThB,SAAS;EACTiB,KAAK;EACLC,SAAS;EACTC,KAAK;EACLC,YAAY;EACZC,UAAU;EACVC,UAAU;EACVC,SAAS;EACTC,UAAU;EACVC,cAAc;EACdC,WAAW;EACXC,iBAAiB;EACjBC,gBAAgB;EAChBC,YAAY;EACZC,gBAAgB;EAChBC,kBAAkB;EAClB,GAAGC;AACL,CAAC,EACDzB,GAAG,KACA;EACH,MAAM0B,UAAU,GAAGhD,WAAW,CAAC;IAC7BiC,SAAS;IACTC,KAAK;IACLC,YAAY;IACZC,UAAU;IACVC,UAAU;IACVC,SAAS;IACTC,UAAU;IACVC,cAAc;IACdC,WAAW;IACXC,iBAAiB;IACjBC,gBAAgB;IAChBC,YAAY;IACZC,gBAAgB;IAChBC;EACF,CAAC,CAAC;EAEF,MAAMG,aAAa,GAAG/C,EAAE,CAACO,eAAe,CAAC;IAAEU,IAAI;IAAEY;EAAU,CAAC,CAAC,EAAEhB,SAAS,CAAC;EAEzE,MAAMmC,MAAM,GAAG/C,gBAAgB,CAAC,CAAC;EACjC,MAAMgD,GAAG,GAAG3D,OAAO,CAAC,OAAO;IAAE,GAAG0D,MAAM;IAAE,CAACtC,KAAK,GAAG;MAAEK,OAAO;MAAEE;IAAK;EAAE,CAAC,CAAC,EAAE,CAAC+B,MAAM,EAAEjC,OAAO,EAAEE,IAAI,CAAC,CAAC;EAE/F,MAAMiC,cAAc,GAAGlD,EAAE,CAACI,kBAAkB,CAAC;IAAEa;EAAK,CAAC,CAAC,EAAEX,gBAAgB,CAAC;IAAEW;EAAK,CAAC,CAAC,CAAC;EAEnF,MAAM;IACJkB,UAAU,EAAEgB,gBAAgB;IAC5Bf,SAAS,EAAEgB,eAAe;IAC1Bf,UAAU,EAAEgB;EACd,CAAC,GAAGP,UAAU;EAEd,MAAMQ,KAA2B,GAAG,EAAE;EACtC,KAAK,IAAIC,CAAC,GAAG,CAAC,EAAEA,CAAC,GAAGxB,SAAS,EAAEwB,CAAC,EAAE,EAAE;IAClCD,KAAK,CAACE,IAAI,cACR/C,IAAA,CAACjB,oBAAoB;MAASwC,KAAK,EAAE;QAAEyB,SAAS,EAAEF;MAAE,CAAE;MAAAzC,QAAA,eACpDL,IAAA,CAACG,aAAa;QACZuB,UAAU,EAAEgB,gBAAiB;QAC7Bf,SAAS,EAAEgB,eAAgB;QAC3Bf,UAAU,EAAEgB,gBAAiB;QAAAvC,QAAA,eAE7BL,IAAA,CAACc,cAAc;UAACV,SAAS,EAAEqC;QAAe,CAAE;MAAC,CAChC;IAAC,GAPSK,CAQL,CACxB,CAAC;EACH;EAEA,oBACE9C,IAAA,CAACV,aAAa,CAAC2D,QAAQ;IAAC1B,KAAK,EAAEiB,GAAI;IAAAnC,QAAA,eACjCL,IAAA,CAACf,gBAAgB;MAACsC,KAAK,EAAEc,UAAW;MAAAhC,QAAA,eAClCL,IAAA,CAAClB,IAAI;QACH6B,GAAG,EAAEA,GAAI;QACTP,SAAS,EAAEkC,aAAc;QACzBjB,KAAK,EAAEA,KAAM;QAAA,GACTe,IAAI;QAAA,GACJjD,mBAAmB,CAACiD,IAAI,EAAElD,cAAc,CAAC;UAAEgE,IAAI,EAAE;QAAY,CAAC,CAAC,CAAC;QAAA7C,QAAA,EAEnEwC;MAAK,CACF;IAAC,CACS;EAAC,CACG,CAAC;AAE7B,CACF,CAAC;AAED1B,YAAY,CAACN,WAAW,GAAG,UAAU;AAOrC,OAAO,MAAMsC,QAAQ,GAAGC,MAAM,CAACC,MAAM,CAAClC,YAAY,EAAE;EAClDmC,IAAI,EAAEnD,aAAa;EACnBoD,KAAK,EAAEzC;AACT,CAAC,CAA8B","ignoreList":[]}

package/lib/module/components/Select/index.js

@@ -1,23 +1,37 @@
 "use strict";
 
-import { cloneElement, forwardRef, isValidElement, useMemo } from 'react';
-import { Text } from 'react-native';
-import { KeyboardArrowDown, KeyboardArrowUp } from '@cdx-ui/icons';
-import { SelectContent as SelectContentPrimitive, SelectItem as SelectItemPrimitive, SelectRoot as SelectRootPrimitive, SelectTrigger as SelectTriggerPrimitive, Slot, dataAttributes, mergeDataAttributes, useSelectContext, useSelectItemContext } from '@cdx-ui/primitives';
-import { cn, ParentContext, useParentContext, useStyleContext } from '@cdx-ui/utils';
+import { Children, cloneElement, createContext, forwardRef, isValidElement, useContext, useMemo } from 'react';
+import { Platform, Text, View } from 'react-native';
+import { SafeAreaInsetsContext } from 'react-native-safe-area-context';
+import { Check, KeyboardArrowDown, KeyboardArrowUp, Search } from '@cdx-ui/icons';
+import { SelectContent as SelectContentPrimitive, SelectEmpty as SelectEmptyPrimitive, SelectItem as SelectItemPrimitive, SelectListbox as SelectListboxPrimitive, SelectRoot as SelectRootPrimitive, SelectProvider, SelectSearch as SelectSearchPrimitive, SelectSheetContent as SelectSheetContentPrimitive, SelectTrigger as SelectTriggerPrimitive, Slot, dataAttributes, mergeDataAttributes, useSelectContext, useSelectItemContext } from '@cdx-ui/primitives';
+import { cn, FormControlContext, ParentContext, useParentContext, useStyleContext } from '@cdx-ui/utils';
+import { BottomSheet } from '../BottomSheet';
+import { checkboxIconVariants, checkboxIndicatorVariants } from '../Checkbox/styles';
 import { Icon } from '../Icon';
+import { Input } from '../Input';
 import { Menu } from '../Menu';
-import { menuItemVariants } from '../Menu/styles';
+import { menuItemControlVariants, menuItemVariants } from '../Menu/styles';
+import { PickerBottomSheetSurface, PickerSheetTextInput } from '../picker/surfaces';
 import { positionToDataIcon } from '../../utils/positionToDataIcon';
-import { selectIconVariants, selectTriggerVariants, selectValueVariants } from './styles';
+import { selectBottomSheetListboxVariants, selectBottomSheetVariants, selectEmptyTextVariants, selectEmptyVariants, selectIconVariants, selectItemVariants, selectSearchListboxVariants, selectSearchVariants, selectTriggerVariants, selectValueVariants } from './styles';
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 const SCOPE = 'SELECT';
 const useSelectStyleContext = () => useStyleContext(SCOPE);
+const IS_WEB = Platform.OS === 'web';
+
+/** `true` inside the native `Select.BottomSheet`, where `Select.Search` uses the sheet's input. */
+const SelectSheetContext = /*#__PURE__*/createContext(false);
 
 // =============================================================================
 // STYLED ROOT
 // =============================================================================
 
+/**
+ * `type` narrows `value` / `defaultValue` / `onValueChange` to `string` (single, the default)
+ * or `string[]` (multiple).
+ */
+
 const SelectRoot = /*#__PURE__*/forwardRef(({
   variant = 'outline',
   size = 'default',
@@ -97,6 +111,11 @@ SelectTrigger.displayName = 'Select.Trigger';
 // STYLED VALUE (styled-only)
 // =============================================================================
 
+/**
+ * `Intl.ListFormat` is not available on Hermes, so labels are joined with a fixed separator
+ * to keep the summary identical on iOS, Android, and web.
+ */
+const SELECTED_TEXT_SEPARATOR = ', ';
 const SelectValue = /*#__PURE__*/forwardRef(({
   asChild,
   className,
@@ -109,13 +128,21 @@ const SelectValue = /*#__PURE__*/forwardRef(({
     size
   } = useSelectStyleContext();
   const {
-    value,
+    type,
     items,
+    selectedValues,
     invalid
   } = useSelectContext();
-  const hasValue = value !== undefined && value !== '';
-  const showPlaceholder = !hasValue;
-  const displayText = hasValue ? items.find(item => item.value === value)?.label : placeholder;
+  const selectedItems = useMemo(() => items.filter(item => selectedValues.includes(item.value)), [items, selectedValues]);
+  const isPlaceholder = !selectedValues.some(selected => selected !== '');
+  const selectedText = selectedItems.map(item => item.label).join(SELECTED_TEXT_SEPARATOR);
+  const renderState = {
+    isPlaceholder,
+    selectedItems,
+    selectedText
+  };
+  const customDisplay = typeof children === 'function' ? children(renderState) : children;
+  const displayText = isPlaceholder ? placeholder : selectedText;
   const computedClassName = cn(selectValueVariants({
     size
   }), className);
@@ -124,13 +151,14 @@ const SelectValue = /*#__PURE__*/forwardRef(({
     ref: ref,
     className: computedClassName,
     style: style,
+    numberOfLines: type === 'multiple' ? 1 : undefined,
     ...props,
     ...mergeDataAttributes(props, dataAttributes({
       slot: 'select-value',
-      placeholder: showPlaceholder,
+      placeholder: isPlaceholder,
       invalid
     })),
-    children: children ?? displayText
+    children: customDisplay ?? displayText
   });
 });
 SelectValue.displayName = 'Select.Value';
@@ -181,10 +209,125 @@ const SelectIcon = ({
 };
 SelectIcon.displayName = 'Select.Icon';
 
+// =============================================================================
+// STYLED SEARCH — composes Input inside the popup
+// =============================================================================
+
+/**
+ * The search input sits inside the select's `Field` in the React tree but is not the field's
+ * control, so it must not pick up the field's id, label, validation, or label-press focus.
+ */
+const ISOLATED_FIELD = {};
+const SelectSearch = /*#__PURE__*/forwardRef(({
+  asChild,
+  className,
+  style,
+  variant = 'subtle',
+  children,
+  ...props
+}, ref) => {
+  const {
+    size
+  } = useSelectStyleContext();
+  const inSheet = useContext(SelectSheetContext);
+  const slotData = dataAttributes({
+    slot: 'select-search'
+  });
+  if (asChild) {
+    return /*#__PURE__*/_jsx(FormControlContext.Provider, {
+      value: ISOLATED_FIELD,
+      children: /*#__PURE__*/_jsx(SelectSearchPrimitive, {
+        ref: ref,
+        asChild: true,
+        className: className,
+        style: style,
+        ...props,
+        ...mergeDataAttributes(props, slotData),
+        children: children
+      })
+    });
+  }
+  return /*#__PURE__*/_jsx(FormControlContext.Provider, {
+    value: ISOLATED_FIELD,
+    children: /*#__PURE__*/_jsx(View, {
+      className: cn(selectSearchVariants(), className),
+      style: style,
+      ...slotData,
+      children: /*#__PURE__*/_jsxs(Input, {
+        variant: variant,
+        size: size ?? 'default',
+        children: [/*#__PURE__*/_jsx(Input.Icon, {
+          as: Search
+        }), /*#__PURE__*/_jsx(SelectSearchPrimitive, {
+          ref: ref,
+          asChild: true,
+          ...props,
+          children: inSheet ? /*#__PURE__*/_jsx(Input.Field, {
+            asChild: true,
+            children: /*#__PURE__*/_jsx(PickerSheetTextInput, {})
+          }) : /*#__PURE__*/_jsx(Input.Field, {})
+        })]
+      })
+    })
+  });
+});
+SelectSearch.displayName = 'Select.Search';
+
+// =============================================================================
+// STYLED EMPTY — shown when no option matches the search
+// =============================================================================
+
+const SelectEmpty = /*#__PURE__*/forwardRef(({
+  asChild,
+  className,
+  style,
+  children,
+  ...props
+}, ref) => {
+  const {
+    size
+  } = useSelectStyleContext();
+  return /*#__PURE__*/_jsx(SelectEmptyPrimitive, {
+    ref: ref,
+    asChild: asChild,
+    className: cn(selectEmptyVariants(), className),
+    style: style,
+    ...props,
+    ...mergeDataAttributes(props, dataAttributes({
+      slot: 'select-empty'
+    })),
+    children: !asChild && typeof children === 'string' ? /*#__PURE__*/_jsx(Text, {
+      className: selectEmptyTextVariants({
+        size
+      }),
+      children: children
+    }) : children
+  });
+});
+SelectEmpty.displayName = 'Select.Empty';
+
 // =============================================================================
 // STYLED CONTENT — composes Menu surface (listbox semantics stay on primitive)
 // =============================================================================
 
+const isSlot = (child, slot) => /*#__PURE__*/isValidElement(child) && child.type === slot;
+
+/**
+ * Sorts direct children into regions: `Select.Search` above a scrollable listbox of the
+ * remaining children, and `Select.Empty` below it. `Select.Search` and `Select.Empty` must be
+ * direct children: a `memo()`, HOC, or custom wrapper is not recognized and renders among the
+ * options. A second `Select.Search` or `Select.Empty` is dropped.
+ */
+function partitionPopupChildren(children) {
+  const childArray = Children.toArray(children);
+  return {
+    search: childArray.find(child => isSlot(child, SelectSearch)),
+    empty: childArray.find(child => isSlot(child, SelectEmpty)),
+    options: childArray.filter(child => !isSlot(child, SelectSearch) && !isSlot(child, SelectEmpty))
+  };
+}
+
+/** Without `asChild`, direct children are sorted into regions (see `partitionPopupChildren`). */
 const SelectContent = /*#__PURE__*/forwardRef(({
   asChild,
   className,
@@ -192,6 +335,9 @@ const SelectContent = /*#__PURE__*/forwardRef(({
   children,
   ...props
 }, ref) => {
+  const slotData = mergeDataAttributes(props, dataAttributes({
+    slot: 'select-content'
+  }));
   if (asChild) {
     return /*#__PURE__*/_jsx(SelectContentPrimitive, {
       ref: ref,
@@ -199,30 +345,182 @@ const SelectContent = /*#__PURE__*/forwardRef(({
       className: className,
       style: style,
       ...props,
-      ...mergeDataAttributes(props, dataAttributes({
-        slot: 'select-content'
-      })),
+      ...slotData,
       children: children
     });
   }
+  const {
+    search,
+    empty,
+    options
+  } = partitionPopupChildren(children);
   return /*#__PURE__*/_jsx(SelectContentPrimitive, {
     ref: ref,
     asChild: true,
     style: style,
     ...props,
-    ...mergeDataAttributes(props, dataAttributes({
-      slot: 'select-content'
-    })),
-    children: /*#__PURE__*/_jsx(Menu.Content, {
+    ...slotData,
+    children: search ? /*#__PURE__*/_jsxs(Menu.Content, {
+      asSurface: true,
+      className: className,
+      children: [search, /*#__PURE__*/_jsx(SelectListboxPrimitive, {
+        asChild: true,
+        children: /*#__PURE__*/_jsx(Menu.Content, {
+          asSurface: true,
+          scrollable: true,
+          className: selectSearchListboxVariants(),
+          children: options
+        })
+      }), empty]
+    }) : /*#__PURE__*/_jsxs(Menu.Content, {
       asSurface: true,
       scrollable: true,
       className: className,
-      children: children
+      children: [options, empty]
     })
   });
 });
 SelectContent.displayName = 'Select.Content';
 
+// =============================================================================
+// STYLED BOTTOM SHEET — native surface in place of Select.Content
+// =============================================================================
+
+const SAFE_AREA_FALLBACK = {
+  bottom: 0
+};
+const SelectNativeBottomSheet = /*#__PURE__*/forwardRef(({
+  asChild,
+  className,
+  children,
+  dismissAccessibilityLabel: _dismissAccessibilityLabel,
+  ...props
+}, ref) => {
+  const ctx = useSelectContext();
+  const insets = useContext(SafeAreaInsetsContext) ?? SAFE_AREA_FALLBACK;
+  const slotData = mergeDataAttributes(props, dataAttributes({
+    slot: 'select-bottom-sheet'
+  }));
+  const {
+    search,
+    empty,
+    options
+  } = partitionPopupChildren(children);
+
+  // The sheet renders in the BottomSheet.Provider portal, outside this tree, so the select
+  // context is provided again inside it.
+  return /*#__PURE__*/_jsx(PickerBottomSheetSurface, {
+    open: ctx.open && !ctx.native,
+    setOpen: ctx.setOpen,
+    fill: true
+    // gorhom makes the sheet one accessibility element by default, which hides the rows
+    // from VoiceOver.
+    ,
+    accessible: false,
+    keyboardBehavior: "extend",
+    keyboardBlurBehavior: "restore",
+    children: /*#__PURE__*/_jsx(SelectProvider, {
+      value: ctx,
+      children: /*#__PURE__*/_jsx(SelectSheetContext.Provider, {
+        value: true,
+        children: asChild ? /*#__PURE__*/_jsx(SelectSheetContentPrimitive, {
+          ref: ref,
+          asChild: true,
+          ...props,
+          ...slotData,
+          children: children
+        }) : /*#__PURE__*/_jsxs(SelectSheetContentPrimitive, {
+          ref: ref,
+          className: cn(selectBottomSheetVariants(), className),
+          ...props,
+          ...slotData,
+          children: [search, /*#__PURE__*/_jsxs(BottomSheet.ScrollView, {
+            keyboardShouldPersistTaps: "handled",
+            keyboardDismissMode: "on-drag",
+            automaticallyAdjustKeyboardInsets: true,
+            contentContainerStyle: {
+              paddingBottom: insets.bottom
+            },
+            children: [/*#__PURE__*/_jsx(SelectListboxPrimitive, {
+              className: selectBottomSheetListboxVariants(),
+              children: options
+            }), empty]
+          })]
+        })
+      })
+    })
+  });
+});
+
+/**
+ * Presents the options in a bottom sheet on iOS and Android, in place of `Select.Content`. The
+ * sheet keeps `Select.Search` and the results above the soft keyboard, and closes on swipe
+ * down, backdrop press, Android back, and the VoiceOver escape gesture without changing the
+ * value. On web it renders the `Select.Content` dropdown. Requires `BottomSheet.Provider`.
+ */
+const SelectBottomSheet = /*#__PURE__*/forwardRef((props, ref) => IS_WEB ? /*#__PURE__*/_jsx(SelectContent, {
+  ref: ref,
+  ...props
+}) : /*#__PURE__*/_jsx(SelectNativeBottomSheet, {
+  ref: ref,
+  ...props
+}));
+SelectBottomSheet.displayName = 'Select.BottomSheet';
+
+// =============================================================================
+// STYLED ITEM CONTROL — Menu checkbox chrome driven by item selection
+// =============================================================================
+
+const SelectItemControl = ({
+  asChild,
+  className,
+  style,
+  children,
+  ...props
+}) => {
+  const {
+    checked
+  } = useSelectItemContext();
+  const fieldState = checked ? 'checked' : 'idle';
+  const hiddenProps = {
+    className: cn(menuItemControlVariants(), 'pointer-events-none', className),
+    style,
+    accessible: false,
+    accessibilityElementsHidden: true,
+    importantForAccessibility: 'no-hide-descendants',
+    'aria-hidden': true,
+    ...props,
+    ...mergeDataAttributes(props, dataAttributes({
+      slot: 'select-item-control',
+      checked
+    }))
+  };
+  if (asChild) {
+    return /*#__PURE__*/_jsx(Slot, {
+      ...hiddenProps,
+      children: children
+    });
+  }
+  return /*#__PURE__*/_jsx(View, {
+    ...hiddenProps,
+    children: /*#__PURE__*/_jsx(View, {
+      className: checkboxIndicatorVariants(),
+      ...dataAttributes({
+        checked,
+        fieldState
+      }),
+      children: checked ? /*#__PURE__*/_jsx(Icon, {
+        as: Check,
+        className: checkboxIconVariants(),
+        accessibilityElementsHidden: true,
+        "aria-hidden": true
+      }) : null
+    })
+  });
+};
+SelectItemControl.displayName = 'Select.ItemControl';
+const hasItemControl = children => Children.toArray(children).some(child => /*#__PURE__*/isValidElement(child) && child.type === SelectItemControl);
+
 // =============================================================================
 // STYLED ITEM — composes Menu item visuals (option semantics stay on primitive)
 // =============================================================================
@@ -240,11 +538,11 @@ const SelectItem = /*#__PURE__*/forwardRef(({
     size
   } = useSelectStyleContext();
   const {
-    value: selectedValue
+    isSelected
   } = useSelectContext();
-  const checked = selectedValue === itemValue;
-  const computedClassName = cn(menuItemVariants(), size === 'small' ? 'px-2.5 py-1.5' : undefined, className);
-  const selectedIndicator = indicator === undefined ? /*#__PURE__*/_jsx(Menu.ItemIndicator, {
+  const checked = isSelected(itemValue);
+  const computedClassName = cn(menuItemVariants(), selectItemVariants(), size === 'small' ? 'px-2.5 py-1.5' : undefined, className);
+  const selectedIndicator = indicator === undefined ? hasItemControl(children) ? null : /*#__PURE__*/_jsx(Menu.ItemIndicator, {
     isChecked: checked
   }) : checked ? indicator : null;
   const itemChildren = asChild ? /*#__PURE__*/isValidElement(children) ? (/*#__PURE__*/cloneElement(children, undefined, children.props.children, selectedIndicator)) : children : /*#__PURE__*/_jsxs(_Fragment, {
@@ -307,7 +605,11 @@ export const Select = Object.assign(SelectRoot, {
   Value: SelectValue,
   Icon: SelectIcon,
   Content: SelectContent,
+  BottomSheet: SelectBottomSheet,
+  Search: SelectSearch,
+  Empty: SelectEmpty,
   Item: SelectItem,
-  ItemLabel: SelectItemLabel
+  ItemLabel: SelectItemLabel,
+  ItemControl: SelectItemControl
 });
 //# sourceMappingURL=index.js.map