@butternutbox/pawprint-native 0.22.0 → 0.23.1

package/dist/index.d.cts

@@ -1609,6 +1609,17 @@ declare const StyledRoot: _emotion_native.StyledComponent<ViewProps & {
 }, {}, {
     ref?: React.Ref<View> | undefined;
 }>;
+/**
+ * A single item returned by an async `onSearchQuery` resolver. Mirrors the
+ * props of `SelectField.Item` so results render identically to static items.
+ */
+type SelectFieldSearchResult = {
+    value: string;
+    label: string;
+    leadingIcon?: React.ReactNode;
+    hintText?: string;
+    disabled?: boolean;
+};
 type SelectFieldOwnProps<Value = Option | string> = {
     label?: string;
     description?: string;
@@ -1625,6 +1636,9 @@ type SelectFieldOwnProps<Value = Option | string> = {
     searchable?: boolean;
     searchPlaceholder?: string;
     noResultsText?: string;
+    onSearchQuery?: (query: string) => Promise<SelectFieldSearchResult[]>;
+    debounceMs?: number;
+    errorText?: string;
 };
 type SelectFieldProps<Value = Option> = SelectFieldOwnProps<Value> & Omit<ViewProps, keyof SelectFieldOwnProps<Value>>;
 type SelectFieldComponent = React.ForwardRefExoticComponent<SelectFieldProps<Option | string> & React.RefAttributes<View>> & {
@@ -2480,4 +2494,4 @@ declare const useDrawerKeyboardAvoidance: (minPadding?: number) => {
     contentContainerStyle: StyleProp<ViewStyle>;
 };
 
-export { Accordion, type AccordionItemProps, type AccordionProps, type AccordionSize, Animated, type AnimatedProps, type AnimatedVariant, Avatar, type AvatarFallbackType, type AvatarProps, type AvatarSize, BRAND_FONTS, Badge$1 as Badge, type BadgeProps, Button, type ButtonColour, ButtonDock, type ButtonDockProps, type ButtonDockVariant, ButtonGroup, type ButtonGroupLayout, type ButtonGroupProps, type ButtonProps, type ButtonSize, type ButtonVariant, CarouselControls, type CarouselControlsProps, Checkbox, CheckboxGroup, type CheckboxGroupProps, type CheckboxProps, type CheckboxVariant, CopyField, CopyFieldInput, type CopyFieldProps, Countdown, type CountdownLabels, type CountdownProps, type CountdownUnitLabel, type DateItemState, DatePicker, type DatePickerProps, Divider, type DividerColour, type DividerProps, type DividerSize, Drawer, type DrawerBodyProps, type DrawerCloseProps, type DrawerContentProps, type DrawerDescriptionProps, type DrawerFooterProps, type DrawerGrabberProps, type DrawerHeaderProps, type DrawerHeaderVariant, type DrawerOverlayProps, type DrawerOverlayProviderProps, type DrawerPortalProps, type DrawerProps, type DrawerTitleProps, type DrawerTriggerProps, FilterTab, type FilterTabItemProps, type FilterTabProps, Hint, type HintProps, Icon, IconButton, type IconButtonColour, type IconButtonProps, type IconButtonSize, type IconButtonVariant, type IconCategory, type IconColour, type IconProps, type IconSize, Illustration, type IllustrationProps, type IllustrationSize, Input, InputDescription, type InputDescriptionProps, InputError, type InputErrorProps, InputField, type InputFieldProps, InputLabel, type InputLabelProps, type InputProps, InputText, Link, type LinkProps, type LinkSize, type LinkWeight, Logo, type LogoBrand, type LogoProps, type LogoSvgComponent, type LogoVariant, Menu, type MenuAlign, MenuItem, type MenuItemProps, type MenuItemVariant, type MenuProps, MessageCard, MessageCardBanner, type MessageCardBannerMedia, type MessageCardBannerProps, MessageCardInsight, type MessageCardInsightProps, NativeSelectPicker, type NativeSelectPickerItem, type NativeSelectPickerProps, Notification, type NotificationProps, NumberField, type NumberFieldProps, NumberInput, NumberInputField, type NumberInputFieldProps, type NumberInputProps, PasswordField, PasswordFieldInput, type PasswordFieldProps, PasswordFieldRequirements, type PasswordFieldRequirementsProps, type PasswordRequirement, type PasswordValidationRule, type PawprintIcon, type PawprintIllustration$2 as PawprintIllustration, PawprintProvider, type PawprintProviderProps, PictureSelector, type PictureSelectorItem, type PictureSelectorProps, ProductDisplayCard, type ProductDisplayCardProps, ProductListingCardWithBadgeAndGrid as ProductListingCard, type ProductListingCardProps, Progress, type ProgressProps, Radio, RadioGroup, type RadioGroupProps, type RadioOwnProps, type RadioProps, RadioTile, SearchField, SearchFieldInput, type SearchFieldProps, SegmentedControl, type SegmentedControlItemProps, type SegmentedControlProps, SelectField, SelectFieldContent, SelectFieldItem, type SelectFieldItemProps, type SelectFieldProps, SelectFieldTrigger, type SelectFieldTriggerProps, SelectFieldValue, type SelectValidationRule, Slider, type SliderProps, Spinner, type SpinnerProps, type SpinnerSize, type SpinnerVariant, type StackedNotificationItem, type StackedNotificationType, StackedNotifications, type StackedNotificationsProps, Switch, type SwitchProps, TabNavigation, type TabNavigationListProps, type TabNavigationPanelProps, type TabNavigationProps, type TabNavigationTabProps, Tag, type TagProps, TextArea, TextAreaField, type TextAreaFieldProps, TextAreaLabel, type TextAreaLabelProps, type TextAreaProps, ThemeProvider, Tooltip, type TooltipProps, Typography, type TypographyProps, createPawprintTheme, fadeAnimation, fadeDownAnimation, fadeUpAnimation, registerLogo, resolveFont, resolveLogo, scaleAnimation, slideInAnimation, slideOutAnimation, theme, useCopyField, useDrawerKeyboardAvoidance, usePasswordField, usePawprint, useSearchField, useSelectField };
+export { Accordion, type AccordionItemProps, type AccordionProps, type AccordionSize, Animated, type AnimatedProps, type AnimatedVariant, Avatar, type AvatarFallbackType, type AvatarProps, type AvatarSize, BRAND_FONTS, Badge$1 as Badge, type BadgeProps, Button, type ButtonColour, ButtonDock, type ButtonDockProps, type ButtonDockVariant, ButtonGroup, type ButtonGroupLayout, type ButtonGroupProps, type ButtonProps, type ButtonSize, type ButtonVariant, CarouselControls, type CarouselControlsProps, Checkbox, CheckboxGroup, type CheckboxGroupProps, type CheckboxProps, type CheckboxVariant, CopyField, CopyFieldInput, type CopyFieldProps, Countdown, type CountdownLabels, type CountdownProps, type CountdownUnitLabel, type DateItemState, DatePicker, type DatePickerProps, Divider, type DividerColour, type DividerProps, type DividerSize, Drawer, type DrawerBodyProps, type DrawerCloseProps, type DrawerContentProps, type DrawerDescriptionProps, type DrawerFooterProps, type DrawerGrabberProps, type DrawerHeaderProps, type DrawerHeaderVariant, type DrawerOverlayProps, type DrawerOverlayProviderProps, type DrawerPortalProps, type DrawerProps, type DrawerTitleProps, type DrawerTriggerProps, FilterTab, type FilterTabItemProps, type FilterTabProps, Hint, type HintProps, Icon, IconButton, type IconButtonColour, type IconButtonProps, type IconButtonSize, type IconButtonVariant, type IconCategory, type IconColour, type IconProps, type IconSize, Illustration, type IllustrationProps, type IllustrationSize, Input, InputDescription, type InputDescriptionProps, InputError, type InputErrorProps, InputField, type InputFieldProps, InputLabel, type InputLabelProps, type InputProps, InputText, Link, type LinkProps, type LinkSize, type LinkWeight, Logo, type LogoBrand, type LogoProps, type LogoSvgComponent, type LogoVariant, Menu, type MenuAlign, MenuItem, type MenuItemProps, type MenuItemVariant, type MenuProps, MessageCard, MessageCardBanner, type MessageCardBannerMedia, type MessageCardBannerProps, MessageCardInsight, type MessageCardInsightProps, NativeSelectPicker, type NativeSelectPickerItem, type NativeSelectPickerProps, Notification, type NotificationProps, NumberField, type NumberFieldProps, NumberInput, NumberInputField, type NumberInputFieldProps, type NumberInputProps, PasswordField, PasswordFieldInput, type PasswordFieldProps, PasswordFieldRequirements, type PasswordFieldRequirementsProps, type PasswordRequirement, type PasswordValidationRule, type PawprintIcon, type PawprintIllustration$2 as PawprintIllustration, PawprintProvider, type PawprintProviderProps, PictureSelector, type PictureSelectorItem, type PictureSelectorProps, ProductDisplayCard, type ProductDisplayCardProps, ProductListingCardWithBadgeAndGrid as ProductListingCard, type ProductListingCardProps, Progress, type ProgressProps, Radio, RadioGroup, type RadioGroupProps, type RadioOwnProps, type RadioProps, RadioTile, SearchField, SearchFieldInput, type SearchFieldProps, SegmentedControl, type SegmentedControlItemProps, type SegmentedControlProps, SelectField, SelectFieldContent, SelectFieldItem, type SelectFieldItemProps, type SelectFieldProps, type SelectFieldSearchResult, SelectFieldTrigger, type SelectFieldTriggerProps, SelectFieldValue, type SelectValidationRule, Slider, type SliderProps, Spinner, type SpinnerProps, type SpinnerSize, type SpinnerVariant, type StackedNotificationItem, type StackedNotificationType, StackedNotifications, type StackedNotificationsProps, Switch, type SwitchProps, TabNavigation, type TabNavigationListProps, type TabNavigationPanelProps, type TabNavigationProps, type TabNavigationTabProps, Tag, type TagProps, TextArea, TextAreaField, type TextAreaFieldProps, TextAreaLabel, type TextAreaLabelProps, type TextAreaProps, ThemeProvider, Tooltip, type TooltipProps, Typography, type TypographyProps, createPawprintTheme, fadeAnimation, fadeDownAnimation, fadeUpAnimation, registerLogo, resolveFont, resolveLogo, scaleAnimation, slideInAnimation, slideOutAnimation, theme, useCopyField, useDrawerKeyboardAvoidance, usePasswordField, usePawprint, useSearchField, useSelectField };

package/dist/index.d.ts

@@ -1609,6 +1609,17 @@ declare const StyledRoot: _emotion_native.StyledComponent<ViewProps & {
 }, {}, {
     ref?: React.Ref<View> | undefined;
 }>;
+/**
+ * A single item returned by an async `onSearchQuery` resolver. Mirrors the
+ * props of `SelectField.Item` so results render identically to static items.
+ */
+type SelectFieldSearchResult = {
+    value: string;
+    label: string;
+    leadingIcon?: React.ReactNode;
+    hintText?: string;
+    disabled?: boolean;
+};
 type SelectFieldOwnProps<Value = Option | string> = {
     label?: string;
     description?: string;
@@ -1625,6 +1636,9 @@ type SelectFieldOwnProps<Value = Option | string> = {
     searchable?: boolean;
     searchPlaceholder?: string;
     noResultsText?: string;
+    onSearchQuery?: (query: string) => Promise<SelectFieldSearchResult[]>;
+    debounceMs?: number;
+    errorText?: string;
 };
 type SelectFieldProps<Value = Option> = SelectFieldOwnProps<Value> & Omit<ViewProps, keyof SelectFieldOwnProps<Value>>;
 type SelectFieldComponent = React.ForwardRefExoticComponent<SelectFieldProps<Option | string> & React.RefAttributes<View>> & {
@@ -2480,4 +2494,4 @@ declare const useDrawerKeyboardAvoidance: (minPadding?: number) => {
     contentContainerStyle: StyleProp<ViewStyle>;
 };
 
-export { Accordion, type AccordionItemProps, type AccordionProps, type AccordionSize, Animated, type AnimatedProps, type AnimatedVariant, Avatar, type AvatarFallbackType, type AvatarProps, type AvatarSize, BRAND_FONTS, Badge$1 as Badge, type BadgeProps, Button, type ButtonColour, ButtonDock, type ButtonDockProps, type ButtonDockVariant, ButtonGroup, type ButtonGroupLayout, type ButtonGroupProps, type ButtonProps, type ButtonSize, type ButtonVariant, CarouselControls, type CarouselControlsProps, Checkbox, CheckboxGroup, type CheckboxGroupProps, type CheckboxProps, type CheckboxVariant, CopyField, CopyFieldInput, type CopyFieldProps, Countdown, type CountdownLabels, type CountdownProps, type CountdownUnitLabel, type DateItemState, DatePicker, type DatePickerProps, Divider, type DividerColour, type DividerProps, type DividerSize, Drawer, type DrawerBodyProps, type DrawerCloseProps, type DrawerContentProps, type DrawerDescriptionProps, type DrawerFooterProps, type DrawerGrabberProps, type DrawerHeaderProps, type DrawerHeaderVariant, type DrawerOverlayProps, type DrawerOverlayProviderProps, type DrawerPortalProps, type DrawerProps, type DrawerTitleProps, type DrawerTriggerProps, FilterTab, type FilterTabItemProps, type FilterTabProps, Hint, type HintProps, Icon, IconButton, type IconButtonColour, type IconButtonProps, type IconButtonSize, type IconButtonVariant, type IconCategory, type IconColour, type IconProps, type IconSize, Illustration, type IllustrationProps, type IllustrationSize, Input, InputDescription, type InputDescriptionProps, InputError, type InputErrorProps, InputField, type InputFieldProps, InputLabel, type InputLabelProps, type InputProps, InputText, Link, type LinkProps, type LinkSize, type LinkWeight, Logo, type LogoBrand, type LogoProps, type LogoSvgComponent, type LogoVariant, Menu, type MenuAlign, MenuItem, type MenuItemProps, type MenuItemVariant, type MenuProps, MessageCard, MessageCardBanner, type MessageCardBannerMedia, type MessageCardBannerProps, MessageCardInsight, type MessageCardInsightProps, NativeSelectPicker, type NativeSelectPickerItem, type NativeSelectPickerProps, Notification, type NotificationProps, NumberField, type NumberFieldProps, NumberInput, NumberInputField, type NumberInputFieldProps, type NumberInputProps, PasswordField, PasswordFieldInput, type PasswordFieldProps, PasswordFieldRequirements, type PasswordFieldRequirementsProps, type PasswordRequirement, type PasswordValidationRule, type PawprintIcon, type PawprintIllustration$2 as PawprintIllustration, PawprintProvider, type PawprintProviderProps, PictureSelector, type PictureSelectorItem, type PictureSelectorProps, ProductDisplayCard, type ProductDisplayCardProps, ProductListingCardWithBadgeAndGrid as ProductListingCard, type ProductListingCardProps, Progress, type ProgressProps, Radio, RadioGroup, type RadioGroupProps, type RadioOwnProps, type RadioProps, RadioTile, SearchField, SearchFieldInput, type SearchFieldProps, SegmentedControl, type SegmentedControlItemProps, type SegmentedControlProps, SelectField, SelectFieldContent, SelectFieldItem, type SelectFieldItemProps, type SelectFieldProps, SelectFieldTrigger, type SelectFieldTriggerProps, SelectFieldValue, type SelectValidationRule, Slider, type SliderProps, Spinner, type SpinnerProps, type SpinnerSize, type SpinnerVariant, type StackedNotificationItem, type StackedNotificationType, StackedNotifications, type StackedNotificationsProps, Switch, type SwitchProps, TabNavigation, type TabNavigationListProps, type TabNavigationPanelProps, type TabNavigationProps, type TabNavigationTabProps, Tag, type TagProps, TextArea, TextAreaField, type TextAreaFieldProps, TextAreaLabel, type TextAreaLabelProps, type TextAreaProps, ThemeProvider, Tooltip, type TooltipProps, Typography, type TypographyProps, createPawprintTheme, fadeAnimation, fadeDownAnimation, fadeUpAnimation, registerLogo, resolveFont, resolveLogo, scaleAnimation, slideInAnimation, slideOutAnimation, theme, useCopyField, useDrawerKeyboardAvoidance, usePasswordField, usePawprint, useSearchField, useSelectField };
+export { Accordion, type AccordionItemProps, type AccordionProps, type AccordionSize, Animated, type AnimatedProps, type AnimatedVariant, Avatar, type AvatarFallbackType, type AvatarProps, type AvatarSize, BRAND_FONTS, Badge$1 as Badge, type BadgeProps, Button, type ButtonColour, ButtonDock, type ButtonDockProps, type ButtonDockVariant, ButtonGroup, type ButtonGroupLayout, type ButtonGroupProps, type ButtonProps, type ButtonSize, type ButtonVariant, CarouselControls, type CarouselControlsProps, Checkbox, CheckboxGroup, type CheckboxGroupProps, type CheckboxProps, type CheckboxVariant, CopyField, CopyFieldInput, type CopyFieldProps, Countdown, type CountdownLabels, type CountdownProps, type CountdownUnitLabel, type DateItemState, DatePicker, type DatePickerProps, Divider, type DividerColour, type DividerProps, type DividerSize, Drawer, type DrawerBodyProps, type DrawerCloseProps, type DrawerContentProps, type DrawerDescriptionProps, type DrawerFooterProps, type DrawerGrabberProps, type DrawerHeaderProps, type DrawerHeaderVariant, type DrawerOverlayProps, type DrawerOverlayProviderProps, type DrawerPortalProps, type DrawerProps, type DrawerTitleProps, type DrawerTriggerProps, FilterTab, type FilterTabItemProps, type FilterTabProps, Hint, type HintProps, Icon, IconButton, type IconButtonColour, type IconButtonProps, type IconButtonSize, type IconButtonVariant, type IconCategory, type IconColour, type IconProps, type IconSize, Illustration, type IllustrationProps, type IllustrationSize, Input, InputDescription, type InputDescriptionProps, InputError, type InputErrorProps, InputField, type InputFieldProps, InputLabel, type InputLabelProps, type InputProps, InputText, Link, type LinkProps, type LinkSize, type LinkWeight, Logo, type LogoBrand, type LogoProps, type LogoSvgComponent, type LogoVariant, Menu, type MenuAlign, MenuItem, type MenuItemProps, type MenuItemVariant, type MenuProps, MessageCard, MessageCardBanner, type MessageCardBannerMedia, type MessageCardBannerProps, MessageCardInsight, type MessageCardInsightProps, NativeSelectPicker, type NativeSelectPickerItem, type NativeSelectPickerProps, Notification, type NotificationProps, NumberField, type NumberFieldProps, NumberInput, NumberInputField, type NumberInputFieldProps, type NumberInputProps, PasswordField, PasswordFieldInput, type PasswordFieldProps, PasswordFieldRequirements, type PasswordFieldRequirementsProps, type PasswordRequirement, type PasswordValidationRule, type PawprintIcon, type PawprintIllustration$2 as PawprintIllustration, PawprintProvider, type PawprintProviderProps, PictureSelector, type PictureSelectorItem, type PictureSelectorProps, ProductDisplayCard, type ProductDisplayCardProps, ProductListingCardWithBadgeAndGrid as ProductListingCard, type ProductListingCardProps, Progress, type ProgressProps, Radio, RadioGroup, type RadioGroupProps, type RadioOwnProps, type RadioProps, RadioTile, SearchField, SearchFieldInput, type SearchFieldProps, SegmentedControl, type SegmentedControlItemProps, type SegmentedControlProps, SelectField, SelectFieldContent, SelectFieldItem, type SelectFieldItemProps, type SelectFieldProps, type SelectFieldSearchResult, SelectFieldTrigger, type SelectFieldTriggerProps, SelectFieldValue, type SelectValidationRule, Slider, type SliderProps, Spinner, type SpinnerProps, type SpinnerSize, type SpinnerVariant, type StackedNotificationItem, type StackedNotificationType, StackedNotifications, type StackedNotificationsProps, Switch, type SwitchProps, TabNavigation, type TabNavigationListProps, type TabNavigationPanelProps, type TabNavigationProps, type TabNavigationTabProps, Tag, type TagProps, TextArea, TextAreaField, type TextAreaFieldProps, TextAreaLabel, type TextAreaLabelProps, type TextAreaProps, ThemeProvider, Tooltip, type TooltipProps, Typography, type TypographyProps, createPawprintTheme, fadeAnimation, fadeDownAnimation, fadeUpAnimation, registerLogo, resolveFont, resolveLogo, scaleAnimation, slideInAnimation, slideOutAnimation, theme, useCopyField, useDrawerKeyboardAvoidance, usePasswordField, usePawprint, useSearchField, useSelectField };

package/dist/index.js

@@ -1163,7 +1163,7 @@ var IconWrapper = styled51(View)({
 });
 var StyledButton = styled51(Pressable)(
   ({
-    buttonHeight,
+    buttonMinHeight,
     buttonMinWidth,
     buttonPaddingHorizontal,
     buttonPaddingVertical,
@@ -1179,7 +1179,7 @@ var StyledButton = styled51(Pressable)(
     alignItems: "center",
     justifyContent: "center",
     position: "relative",
-    height: buttonHeight,
+    minHeight: buttonMinHeight,
     minWidth: buttonMinWidth,
     paddingHorizontal: buttonPaddingHorizontal,
     paddingVertical: buttonPaddingVertical,
@@ -1189,10 +1189,9 @@ var StyledButton = styled51(Pressable)(
     opacity: buttonOpacity
   }, buttonBorderWidth ? { borderWidth: buttonBorderWidth, borderColor: buttonBorderColor } : {}), buttonFullWidth ? { width: "100%" } : {})
 );
-var StyledTextWrapper = styled51(View)(({ textOpacity }) => ({
-  opacity: textOpacity,
-  flexShrink: 0
-}));
+var StyledTextWrapper = styled51(View)(({ textOpacity, fullWidth }) => __spreadValues({
+  opacity: textOpacity
+}, fullWidth ? { flex: 1 } : {}));
 var StyledSpinnerWrapper = styled51(View)({
   position: "absolute",
   alignItems: "center",
@@ -1267,7 +1266,7 @@ var Button = React66.forwardRef(
         accessibilityState: { disabled: isDisabled, busy: loading },
         onPressIn: () => setPressed(true),
         onPressOut: () => setPressed(false),
-        buttonHeight: parseTokenValue7(sizeTokens.height),
+        buttonMinHeight: parseTokenValue7(sizeTokens.minHeight),
         buttonMinWidth: parseTokenValue7(sizeTokens.minWidth),
         buttonPaddingHorizontal: parseTokenValue7(
           spacingTokens.horizontalPadding
@@ -1283,7 +1282,7 @@ var Button = React66.forwardRef(
       }, rest), {
         children: [
           startIcon && /* @__PURE__ */ jsx(IconWrapper, { children: startIcon }),
-          /* @__PURE__ */ jsx(StyledTextWrapper, { textOpacity: loading ? 0 : 1, children: /* @__PURE__ */ jsx(
+          /* @__PURE__ */ jsx(StyledTextWrapper, { textOpacity: loading ? 0 : 1, fullWidth, children: /* @__PURE__ */ jsx(
             Typography,
             {
               token: {
@@ -1294,6 +1293,7 @@ var Button = React66.forwardRef(
                 letterSpacing: typography.letterSpacing
               },
               color: variantStyles.textColor,
+              align: "center",
               children
             }
           ) }),
@@ -1429,7 +1429,7 @@ var IconButton = React66.forwardRef(
     const isDisabled = disabled || loading;
     const buttons = theme2.tokens.components.buttons;
     const sizeTokens = buttons.size[size];
-    const dimension = parseTokenValue10(sizeTokens.height);
+    const dimension = parseTokenValue10(sizeTokens.minHeight);
     const iconSizing = theme2.tokens.components.icons.sizing.icons.core;
     const iconDimension = parseTokenValue10(iconSizing[sizeToIconSizeToken[size]]);
     const [pressed, setPressed] = React66.useState(false);
@@ -4861,6 +4861,7 @@ Switch.displayName = "Switch";
 var parseTokenValue18 = (value) => parseFloat(value);
 var StyledTag = styled51(View)(({ theme: theme2, tagVariant, tagSize }) => {
   const { sizing, spacing, colour, badge } = theme2.tokens.components.tags;
+  const { spacing: semanticSpacing } = theme2.tokens.semantics.dimensions;
   const backgroundColorMap = {
     primary: colour.primary.background,
     secondary: colour.primary.secondary,
@@ -4870,13 +4871,21 @@ var StyledTag = styled51(View)(({ theme: theme2, tagVariant, tagSize }) => {
     warning: colour.primary.warning,
     error: colour.primary.error
   };
+  const verticalPaddingMap = {
+    small: semanticSpacing["2xs"],
+    medium: semanticSpacing["3xs"],
+    large: semanticSpacing["2xs"]
+  };
   return {
     flexDirection: "row",
     alignItems: "center",
     justifyContent: "center",
-    height: parseTokenValue18(sizing[tagSize].height),
+    minHeight: parseTokenValue18(sizing[tagSize].minHeight),
     minWidth: parseTokenValue18(sizing[tagSize].minWidth),
-    paddingHorizontal: parseTokenValue18(spacing.horizontalPadding),
+    paddingLeft: parseTokenValue18(spacing.horizontalPadding) * 2,
+    paddingRight: parseTokenValue18(spacing.horizontalPadding) * 2,
+    paddingTop: parseTokenValue18(verticalPaddingMap[tagSize]),
+    paddingBottom: parseTokenValue18(verticalPaddingMap[tagSize]),
     gap: parseTokenValue18(spacing[tagSize].gap),
     borderRadius: parseTokenValue18(badge.borderRadius.default),
     backgroundColor: backgroundColorMap[tagVariant]
@@ -6325,7 +6334,7 @@ var DrawerBody = React66.forwardRef(
     const horizontalPadding = parseTokenValue27(content.slot.horizontalPadding);
     const topPadding = parseTokenValue27(content.slot.verticalPadding);
     const bodyMaxHeight = providedMaxHeight != null ? providedMaxHeight : windowHeight - 300;
-    const paddingRight = headerContext === null ? parseTokenValue27(spacing.close.right.md) + parseTokenValue27(buttons.size.sm.height) : horizontalPadding;
+    const paddingRight = headerContext === null ? parseTokenValue27(spacing.close.right.md) + parseTokenValue27(buttons.size.sm.minHeight) : horizontalPadding;
     const bodyPaddingBottom = !footerContext ? Math.max(
       parseTokenValue27(theme2.tokens.semantics.dimensions.spacing["2xl"]),
       insets.bottom
@@ -6695,7 +6704,7 @@ var StyledRootPressable = styled51(Pressable)(
     alignItems: rootFlexAlign,
     gap: rootGap,
     opacity: rootOpacity
-  }, rootPaddingVertical !== void 0 ? { paddingVertical: rootPaddingVertical } : {}), rootPaddingHorizontal !== void 0 ? { paddingHorizontal: rootPaddingHorizontal } : {}), rootMaxWidth !== void 0 ? rootFitContent ? { maxWidth: rootMaxWidth, alignSelf: "flex-start" } : { maxWidth: rootMaxWidth, width: "100%" } : { width: "100%" }), rootBgColor ? { backgroundColor: rootBgColor } : {}), rootBorderWidth !== void 0 ? { borderWidth: rootBorderWidth, borderColor: rootBorderColor } : {}), rootBorderRadius !== void 0 ? { borderRadius: rootBorderRadius } : {})
+  }, rootPaddingVertical !== void 0 ? { paddingVertical: rootPaddingVertical } : {}), rootPaddingHorizontal !== void 0 ? { paddingHorizontal: rootPaddingHorizontal } : {}), rootMaxWidth !== void 0 ? rootFitContent ? { maxWidth: rootMaxWidth, alignSelf: "flex-start" } : { maxWidth: rootMaxWidth, width: "100%" } : {}), rootBgColor ? { backgroundColor: rootBgColor } : {}), rootBorderWidth !== void 0 ? { borderWidth: rootBorderWidth, borderColor: rootBorderColor } : {}), rootBorderRadius !== void 0 ? { borderRadius: rootBorderRadius } : {})
 );
 var StyledControl = styled51(View)(
   ({
@@ -6716,12 +6725,12 @@ var StyledControl = styled51(View)(
     justifyContent: "center"
   })
 );
-var StyledContent2 = styled51(View)(({ contentGap }) => ({
+var StyledContent2 = styled51(View)(({ contentGap, contentFlex, contentFitContent }) => __spreadValues({
   flexDirection: "column",
   gap: contentGap,
-  flex: 1,
+  flex: contentFlex,
   minWidth: 0
-}));
+}, contentFitContent ? { maxWidth: "85%" } : {}));
 var StyledIllustration = styled51(View)(({ illustrationSize }) => ({
   flexShrink: 0,
   width: illustrationSize,
@@ -6808,6 +6817,8 @@ var Checkbox = React66.forwardRef(
             StyledContent2,
             {
               contentGap: parseTokenValue31(checkbox.spacing.content.gap),
+              contentFlex: isTile && fitContent ? 0 : 1,
+              contentFitContent: isTile && fitContent,
               children: [
                 label && /* @__PURE__ */ jsx(
                   Typography,
@@ -8972,7 +8983,7 @@ var SelectFieldItem = React66.forwardRef(
 );
 SelectFieldItem.displayName = "SelectField.Item";
 var parseTokenValue48 = (value) => parseFloat(value);
-var StyledNoResults = styled51(View)(({ theme: theme2 }) => {
+var StyledStatusRow = styled51(View)(({ theme: theme2 }) => {
   const { dropdown } = theme2.tokens.components.dropdownList;
   return {
     paddingVertical: parseTokenValue48(dropdown.listItem.spacing.verticalPadding),
@@ -9005,7 +9016,10 @@ var SelectFieldRoot = React66.forwardRef(
       disabled,
       searchable = false,
       searchPlaceholder,
-      noResultsText = "No results found"
+      noResultsText = "No results found",
+      onSearchQuery,
+      debounceMs = 300,
+      errorText = "Something went wrong"
     } = _b, rest = __objRest(_b, [
       "label",
       "placeholder",
@@ -9021,7 +9035,10 @@ var SelectFieldRoot = React66.forwardRef(
       "disabled",
       "searchable",
       "searchPlaceholder",
-      "noResultsText"
+      "noResultsText",
+      "onSearchQuery",
+      "debounceMs",
+      "errorText"
     ]);
     const [isOpen, setIsOpen] = React66.useState(false);
     const [showContent, setShowContent] = React66.useState(false);
@@ -9031,6 +9048,44 @@ var SelectFieldRoot = React66.forwardRef(
     const [searchQuery, setSearchQuery] = React66.useState("");
     const [clearKey, setClearKey] = React66.useState(0);
     const searchInputRef = React66.useRef(null);
+    const isQueryMode = searchable && typeof onSearchQuery === "function";
+    const [searchResults, setSearchResults] = React66.useState([]);
+    const [isSearching, setIsSearching] = React66.useState(false);
+    const [searchFailed, setSearchFailed] = React66.useState(false);
+    const searchRequestIdRef = React66.useRef(0);
+    const onSearchQueryRef = React66.useRef(onSearchQuery);
+    React66.useEffect(() => {
+      onSearchQueryRef.current = onSearchQuery;
+    });
+    React66.useEffect(() => {
+      if (!isQueryMode) return;
+      if (searchQuery.length === 0) {
+        searchRequestIdRef.current += 1;
+        setSearchResults([]);
+        setIsSearching(false);
+        setSearchFailed(false);
+        return;
+      }
+      const requestId = searchRequestIdRef.current + 1;
+      searchRequestIdRef.current = requestId;
+      setIsSearching(true);
+      setSearchFailed(false);
+      const debounceTimer = setTimeout(() => {
+        const runQuery = onSearchQueryRef.current;
+        if (!runQuery) return;
+        Promise.resolve(runQuery(searchQuery)).then((items) => {
+          if (searchRequestIdRef.current !== requestId) return;
+          setSearchResults(items);
+          setIsSearching(false);
+        }).catch(() => {
+          if (searchRequestIdRef.current !== requestId) return;
+          setSearchResults([]);
+          setSearchFailed(true);
+          setIsSearching(false);
+        });
+      }, debounceMs);
+      return () => clearTimeout(debounceTimer);
+    }, [searchQuery, isQueryMode, debounceMs]);
     React66.useEffect(() => {
       if (!isOpen) {
         setShowContent(false);
@@ -9063,7 +9118,7 @@ var SelectFieldRoot = React66.forwardRef(
         clearTimeout(hardwareKeyboardTimer);
         keyboardSub.remove();
       };
-    }, [isOpen, searchable]);
+    }, [isOpen, searchable, isSearching, searchQuery]);
     const isCompound = React66.Children.toArray(children).some(
       (child) => React66.isValidElement(child) && child.type === SelectFieldContent
     );
@@ -9081,7 +9136,7 @@ var SelectFieldRoot = React66.forwardRef(
     };
     const currentValue = value !== void 0 ? value : internalValue;
     const allItems = React66.Children.toArray(children);
-    const filteredItems = searchable ? allItems.filter((child) => {
+    const localFilteredItems = searchable && !isQueryMode ? allItems.filter((child) => {
       var _a2;
       if (!searchQuery) return true;
       if (React66.isValidElement(child) && child.type === SelectFieldItem) {
@@ -9092,7 +9147,21 @@ var SelectFieldRoot = React66.forwardRef(
       }
       return true;
     }) : allItems;
-    const hasNoResults = searchable && searchQuery.length > 0 && filteredItems.length === 0;
+    const isQueryActive = isQueryMode && searchQuery.length > 0;
+    const queryResultItems = searchResults.map((result) => /* @__PURE__ */ jsx(
+      SelectFieldItem,
+      {
+        value: result.value,
+        leadingIcon: result.leadingIcon,
+        hintText: result.hintText,
+        disabled: result.disabled,
+        children: result.label
+      },
+      String(result.value)
+    ));
+    const itemsToRender = isQueryActive ? queryResultItems : localFilteredItems;
+    const hasNoResults = isQueryMode ? isQueryActive && !isSearching && !searchFailed && searchResults.length === 0 : searchable && searchQuery.length > 0 && localFilteredItems.length === 0;
+    const hasContentToShow = isSearching || searchFailed || hasNoResults || itemsToRender.length > 0;
     const searchActionIcon = (() => {
       if (!searchable) return void 0;
       const showClear = isOpen && searchQuery.length > 0 || !isOpen && Boolean(currentValue);
@@ -9151,8 +9220,8 @@ var SelectFieldRoot = React66.forwardRef(
             description && /* @__PURE__ */ jsx(InputDescription, { state, children: description }),
             error && state === "error" && /* @__PURE__ */ jsx(InputError, { children: error })
           ] })),
-          showContent && /* @__PURE__ */ jsxs(SelectFieldContent, { children: [
-            filteredItems.map((child) => {
+          showContent && hasContentToShow && /* @__PURE__ */ jsx(SelectFieldContent, { children: isSearching ? /* @__PURE__ */ jsx(StyledStatusRow, { children: /* @__PURE__ */ jsx(Spinner, { size: "sm" }) }) : searchFailed ? /* @__PURE__ */ jsx(StyledStatusRow, { children: /* @__PURE__ */ jsx(Typography, { size: "sm", children: errorText }) }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+            itemsToRender.map((child) => {
               if (React66.isValidElement(child) && child.type === SelectFieldItem) {
                 const selectedValue = currentValue && typeof currentValue === "object" && "value" in currentValue ? currentValue.value : currentValue;
                 const childProps = child.props;
@@ -9165,8 +9234,8 @@ var SelectFieldRoot = React66.forwardRef(
               }
               return child;
             }),
-            hasNoResults && /* @__PURE__ */ jsx(StyledNoResults, { children: /* @__PURE__ */ jsx(Typography, { size: "sm", children: noResultsText }) })
-          ] })
+            hasNoResults && /* @__PURE__ */ jsx(StyledStatusRow, { children: /* @__PURE__ */ jsx(Typography, { size: "sm", children: noResultsText }) })
+          ] }) })
         ]
       },
       clearKey
@@ -9531,7 +9600,7 @@ var Slider = React66.forwardRef(
     const isControlled = controlledValue !== void 0;
     const [internalValue, setInternalValue] = React66.useState(defaultValue);
     const currentValue = isControlled ? controlledValue : internalValue;
-    const thumbSize = parseTokenValue49(buttons.size.md.height);
+    const thumbSize = parseTokenValue49(buttons.size.md.minHeight);
     const trackHeight = parseTokenValue49(slider.sizing.track.height);
     const isWeb = Platform.OS === "web";
     const [trackLayoutWidth, setTrackLayoutWidth] = useState(0);