@butternutbox/pawprint-native 0.19.2 → 0.21.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.turbo/turbo-build.log +8 -8
- package/CHANGELOG.md +14 -0
- package/dist/index.cjs +59 -11
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +29 -4
- package/dist/index.d.ts +29 -4
- package/dist/index.js +59 -12
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
- package/src/components/molecules/Drawer/DrawerBody.tsx +17 -2
- package/src/components/molecules/ProductDisplayCard/ProductDisplayCard.stories.tsx +31 -0
- package/src/components/molecules/ProductDisplayCard/ProductDisplayCard.test.tsx +54 -0
- package/src/components/molecules/ProductDisplayCard/ProductDisplayCard.tsx +34 -1
- package/src/hooks/index.ts +1 -0
- package/src/hooks/useDrawerKeyboardAvoidance.ts +29 -0
- package/src/index.ts +1 -0
package/dist/index.d.cts
CHANGED
|
@@ -8,7 +8,7 @@ import React from 'react';
|
|
|
8
8
|
import * as _emotion_react from '@emotion/react';
|
|
9
9
|
import { Theme } from '@emotion/react';
|
|
10
10
|
import * as react_native from 'react-native';
|
|
11
|
-
import { View, ViewProps, TextProps, Text, PressableProps, FlexStyle, TextInputProps, TextInput, ImageSourcePropType, ScrollViewProps } from 'react-native';
|
|
11
|
+
import { View, ViewProps, TextProps, Text, PressableProps, FlexStyle, TextInputProps, TextInput, ImageSourcePropType, ScrollViewProps, StyleProp, ViewStyle } from 'react-native';
|
|
12
12
|
import * as react_native_reanimated from 'react-native-reanimated';
|
|
13
13
|
import { FadeIn, FadeOut, FadeInUp, FadeOutUp, FadeInDown, FadeOutDown, ComplexAnimationBuilder, BaseAnimationBuilder, EntryExitAnimationFunction, FadeInRight, FadeOutRight, FadeInLeft, FadeOutLeft } from 'react-native-reanimated';
|
|
14
14
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
@@ -1008,7 +1008,9 @@ declare const Drawer: React.ForwardRefExoticComponent<DrawerRootOwnProps & Omit<
|
|
|
1008
1008
|
Close: React.ForwardRefExoticComponent<{
|
|
1009
1009
|
"aria-label"?: string;
|
|
1010
1010
|
} & Omit<ViewProps, "children"> & React.RefAttributes<View>>;
|
|
1011
|
-
Body: React.ForwardRefExoticComponent<react_native.ScrollViewProps &
|
|
1011
|
+
Body: React.ForwardRefExoticComponent<react_native.ScrollViewProps & {
|
|
1012
|
+
ignoreKeyboardAvoidance?: boolean;
|
|
1013
|
+
} & React.RefAttributes<react_native.ScrollView>>;
|
|
1012
1014
|
Footer: React.ForwardRefExoticComponent<ViewProps & React.RefAttributes<View>>;
|
|
1013
1015
|
};
|
|
1014
1016
|
|
|
@@ -1032,7 +1034,9 @@ type DrawerCloseProps = {
|
|
|
1032
1034
|
"aria-label"?: string;
|
|
1033
1035
|
} & Omit<ViewProps, "children">;
|
|
1034
1036
|
|
|
1035
|
-
type DrawerBodyProps = ScrollViewProps
|
|
1037
|
+
type DrawerBodyProps = ScrollViewProps & {
|
|
1038
|
+
ignoreKeyboardAvoidance?: boolean;
|
|
1039
|
+
};
|
|
1036
1040
|
|
|
1037
1041
|
type DrawerFooterProps = ViewProps;
|
|
1038
1042
|
|
|
@@ -2319,6 +2323,13 @@ type ProductDisplayCardProps = ViewProps & {
|
|
|
2319
2323
|
quantity?: number;
|
|
2320
2324
|
onQuantityChange?: (quantity: number) => void;
|
|
2321
2325
|
showQuantityPicker?: boolean;
|
|
2326
|
+
/**
|
|
2327
|
+
* Show a quantity badge overlaid on the top-right of the image (rendering the
|
|
2328
|
+
* current `quantity`) instead of the quantity picker. Defaults to `false`.
|
|
2329
|
+
* The badge and the quantity picker are mutually exclusive — only one shows
|
|
2330
|
+
* at a time; when `quantityBadge` is true the picker is never rendered.
|
|
2331
|
+
*/
|
|
2332
|
+
quantityBadge?: boolean;
|
|
2322
2333
|
disableQuantityButtons?: boolean;
|
|
2323
2334
|
hideQuantityButtons?: boolean;
|
|
2324
2335
|
incrementDisabled?: boolean;
|
|
@@ -2354,6 +2365,9 @@ type ProductDisplayCardProps = ViewProps & {
|
|
|
2354
2365
|
* @param quantity - *(optional)* Current quantity value
|
|
2355
2366
|
* @param onQuantityChange - *(optional)* Callback when quantity changes
|
|
2356
2367
|
* @param showQuantityPicker - *(optional)* Show/hide quantity picker
|
|
2368
|
+
* @param quantityBadge - *(optional)* Show a quantity badge over the image instead
|
|
2369
|
+
* of the picker (renders the current `quantity`). Mutually exclusive with the
|
|
2370
|
+
* quantity picker; defaults to `false`. Used on OOB recipe and Extras cards.
|
|
2357
2371
|
* @param image - *(optional)* Image URL string or React element
|
|
2358
2372
|
* @param banner - *(optional)* Banner content string or React element to show below card
|
|
2359
2373
|
* @param showBanner - *(optional)* Show/hide banner
|
|
@@ -2367,6 +2381,13 @@ declare const ProductDisplayCard: React.ForwardRefExoticComponent<ViewProps & {
|
|
|
2367
2381
|
quantity?: number;
|
|
2368
2382
|
onQuantityChange?: (quantity: number) => void;
|
|
2369
2383
|
showQuantityPicker?: boolean;
|
|
2384
|
+
/**
|
|
2385
|
+
* Show a quantity badge overlaid on the top-right of the image (rendering the
|
|
2386
|
+
* current `quantity`) instead of the quantity picker. Defaults to `false`.
|
|
2387
|
+
* The badge and the quantity picker are mutually exclusive — only one shows
|
|
2388
|
+
* at a time; when `quantityBadge` is true the picker is never rendered.
|
|
2389
|
+
*/
|
|
2390
|
+
quantityBadge?: boolean;
|
|
2370
2391
|
disableQuantityButtons?: boolean;
|
|
2371
2392
|
hideQuantityButtons?: boolean;
|
|
2372
2393
|
incrementDisabled?: boolean;
|
|
@@ -2455,4 +2476,8 @@ type TabNavigationComponent = React.ForwardRefExoticComponent<TabNavigationProps
|
|
|
2455
2476
|
};
|
|
2456
2477
|
declare const TabNavigation: TabNavigationComponent;
|
|
2457
2478
|
|
|
2458
|
-
|
|
2479
|
+
declare const useDrawerKeyboardAvoidance: (minPadding?: number) => {
|
|
2480
|
+
contentContainerStyle: StyleProp<ViewStyle>;
|
|
2481
|
+
};
|
|
2482
|
+
|
|
2483
|
+
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 };
|
package/dist/index.d.ts
CHANGED
|
@@ -8,7 +8,7 @@ import React from 'react';
|
|
|
8
8
|
import * as _emotion_react from '@emotion/react';
|
|
9
9
|
import { Theme } from '@emotion/react';
|
|
10
10
|
import * as react_native from 'react-native';
|
|
11
|
-
import { View, ViewProps, TextProps, Text, PressableProps, FlexStyle, TextInputProps, TextInput, ImageSourcePropType, ScrollViewProps } from 'react-native';
|
|
11
|
+
import { View, ViewProps, TextProps, Text, PressableProps, FlexStyle, TextInputProps, TextInput, ImageSourcePropType, ScrollViewProps, StyleProp, ViewStyle } from 'react-native';
|
|
12
12
|
import * as react_native_reanimated from 'react-native-reanimated';
|
|
13
13
|
import { FadeIn, FadeOut, FadeInUp, FadeOutUp, FadeInDown, FadeOutDown, ComplexAnimationBuilder, BaseAnimationBuilder, EntryExitAnimationFunction, FadeInRight, FadeOutRight, FadeInLeft, FadeOutLeft } from 'react-native-reanimated';
|
|
14
14
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
@@ -1008,7 +1008,9 @@ declare const Drawer: React.ForwardRefExoticComponent<DrawerRootOwnProps & Omit<
|
|
|
1008
1008
|
Close: React.ForwardRefExoticComponent<{
|
|
1009
1009
|
"aria-label"?: string;
|
|
1010
1010
|
} & Omit<ViewProps, "children"> & React.RefAttributes<View>>;
|
|
1011
|
-
Body: React.ForwardRefExoticComponent<react_native.ScrollViewProps &
|
|
1011
|
+
Body: React.ForwardRefExoticComponent<react_native.ScrollViewProps & {
|
|
1012
|
+
ignoreKeyboardAvoidance?: boolean;
|
|
1013
|
+
} & React.RefAttributes<react_native.ScrollView>>;
|
|
1012
1014
|
Footer: React.ForwardRefExoticComponent<ViewProps & React.RefAttributes<View>>;
|
|
1013
1015
|
};
|
|
1014
1016
|
|
|
@@ -1032,7 +1034,9 @@ type DrawerCloseProps = {
|
|
|
1032
1034
|
"aria-label"?: string;
|
|
1033
1035
|
} & Omit<ViewProps, "children">;
|
|
1034
1036
|
|
|
1035
|
-
type DrawerBodyProps = ScrollViewProps
|
|
1037
|
+
type DrawerBodyProps = ScrollViewProps & {
|
|
1038
|
+
ignoreKeyboardAvoidance?: boolean;
|
|
1039
|
+
};
|
|
1036
1040
|
|
|
1037
1041
|
type DrawerFooterProps = ViewProps;
|
|
1038
1042
|
|
|
@@ -2319,6 +2323,13 @@ type ProductDisplayCardProps = ViewProps & {
|
|
|
2319
2323
|
quantity?: number;
|
|
2320
2324
|
onQuantityChange?: (quantity: number) => void;
|
|
2321
2325
|
showQuantityPicker?: boolean;
|
|
2326
|
+
/**
|
|
2327
|
+
* Show a quantity badge overlaid on the top-right of the image (rendering the
|
|
2328
|
+
* current `quantity`) instead of the quantity picker. Defaults to `false`.
|
|
2329
|
+
* The badge and the quantity picker are mutually exclusive — only one shows
|
|
2330
|
+
* at a time; when `quantityBadge` is true the picker is never rendered.
|
|
2331
|
+
*/
|
|
2332
|
+
quantityBadge?: boolean;
|
|
2322
2333
|
disableQuantityButtons?: boolean;
|
|
2323
2334
|
hideQuantityButtons?: boolean;
|
|
2324
2335
|
incrementDisabled?: boolean;
|
|
@@ -2354,6 +2365,9 @@ type ProductDisplayCardProps = ViewProps & {
|
|
|
2354
2365
|
* @param quantity - *(optional)* Current quantity value
|
|
2355
2366
|
* @param onQuantityChange - *(optional)* Callback when quantity changes
|
|
2356
2367
|
* @param showQuantityPicker - *(optional)* Show/hide quantity picker
|
|
2368
|
+
* @param quantityBadge - *(optional)* Show a quantity badge over the image instead
|
|
2369
|
+
* of the picker (renders the current `quantity`). Mutually exclusive with the
|
|
2370
|
+
* quantity picker; defaults to `false`. Used on OOB recipe and Extras cards.
|
|
2357
2371
|
* @param image - *(optional)* Image URL string or React element
|
|
2358
2372
|
* @param banner - *(optional)* Banner content string or React element to show below card
|
|
2359
2373
|
* @param showBanner - *(optional)* Show/hide banner
|
|
@@ -2367,6 +2381,13 @@ declare const ProductDisplayCard: React.ForwardRefExoticComponent<ViewProps & {
|
|
|
2367
2381
|
quantity?: number;
|
|
2368
2382
|
onQuantityChange?: (quantity: number) => void;
|
|
2369
2383
|
showQuantityPicker?: boolean;
|
|
2384
|
+
/**
|
|
2385
|
+
* Show a quantity badge overlaid on the top-right of the image (rendering the
|
|
2386
|
+
* current `quantity`) instead of the quantity picker. Defaults to `false`.
|
|
2387
|
+
* The badge and the quantity picker are mutually exclusive — only one shows
|
|
2388
|
+
* at a time; when `quantityBadge` is true the picker is never rendered.
|
|
2389
|
+
*/
|
|
2390
|
+
quantityBadge?: boolean;
|
|
2370
2391
|
disableQuantityButtons?: boolean;
|
|
2371
2392
|
hideQuantityButtons?: boolean;
|
|
2372
2393
|
incrementDisabled?: boolean;
|
|
@@ -2455,4 +2476,8 @@ type TabNavigationComponent = React.ForwardRefExoticComponent<TabNavigationProps
|
|
|
2455
2476
|
};
|
|
2456
2477
|
declare const TabNavigation: TabNavigationComponent;
|
|
2457
2478
|
|
|
2458
|
-
|
|
2479
|
+
declare const useDrawerKeyboardAvoidance: (minPadding?: number) => {
|
|
2480
|
+
contentContainerStyle: StyleProp<ViewStyle>;
|
|
2481
|
+
};
|
|
2482
|
+
|
|
2483
|
+
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 };
|
package/dist/index.js
CHANGED
|
@@ -6260,6 +6260,26 @@ var DrawerDescription = React66.forwardRef(
|
|
|
6260
6260
|
}
|
|
6261
6261
|
);
|
|
6262
6262
|
DrawerDescription.displayName = "Drawer.Description";
|
|
6263
|
+
var useDrawerKeyboardAvoidance = (minPadding = 16) => {
|
|
6264
|
+
const [keyboardHeight, setKeyboardHeight] = useState(0);
|
|
6265
|
+
useEffect(() => {
|
|
6266
|
+
const showListener = Keyboard.addListener("keyboardDidShow", (e) => {
|
|
6267
|
+
setKeyboardHeight(e.endCoordinates.height);
|
|
6268
|
+
});
|
|
6269
|
+
const hideListener = Keyboard.addListener("keyboardDidHide", () => {
|
|
6270
|
+
setKeyboardHeight(0);
|
|
6271
|
+
});
|
|
6272
|
+
return () => {
|
|
6273
|
+
showListener.remove();
|
|
6274
|
+
hideListener.remove();
|
|
6275
|
+
};
|
|
6276
|
+
}, []);
|
|
6277
|
+
return {
|
|
6278
|
+
contentContainerStyle: {
|
|
6279
|
+
paddingBottom: Math.max(minPadding, keyboardHeight)
|
|
6280
|
+
}
|
|
6281
|
+
};
|
|
6282
|
+
};
|
|
6263
6283
|
var parseTokenValue27 = (value) => parseFloat(value);
|
|
6264
6284
|
var StyledScrollView = styled51(ScrollView)(
|
|
6265
6285
|
({
|
|
@@ -6281,7 +6301,15 @@ var StyledScrollView = styled51(ScrollView)(
|
|
|
6281
6301
|
);
|
|
6282
6302
|
var DrawerBody = React66.forwardRef(
|
|
6283
6303
|
(_a, ref) => {
|
|
6284
|
-
var _b = _a, {
|
|
6304
|
+
var _b = _a, {
|
|
6305
|
+
children,
|
|
6306
|
+
contentContainerStyle,
|
|
6307
|
+
ignoreKeyboardAvoidance = false
|
|
6308
|
+
} = _b, props = __objRest(_b, [
|
|
6309
|
+
"children",
|
|
6310
|
+
"contentContainerStyle",
|
|
6311
|
+
"ignoreKeyboardAvoidance"
|
|
6312
|
+
]);
|
|
6285
6313
|
const theme2 = useTheme();
|
|
6286
6314
|
const { spacing } = theme2.tokens.components.drawer;
|
|
6287
6315
|
const { buttons } = theme2.tokens.components;
|
|
@@ -6291,6 +6319,8 @@ var DrawerBody = React66.forwardRef(
|
|
|
6291
6319
|
const providedMaxHeight = useDrawerBodyMax();
|
|
6292
6320
|
const { height: windowHeight } = useWindowDimensions();
|
|
6293
6321
|
const insets = useSafeAreaInsets();
|
|
6322
|
+
const { contentContainerStyle: keyboardStyle } = useDrawerKeyboardAvoidance();
|
|
6323
|
+
const effectiveKeyboardStyle = ignoreKeyboardAvoidance ? {} : keyboardStyle;
|
|
6294
6324
|
const gap = parseTokenValue27(content.slot.gap);
|
|
6295
6325
|
const horizontalPadding = parseTokenValue27(content.slot.horizontalPadding);
|
|
6296
6326
|
const topPadding = parseTokenValue27(content.slot.verticalPadding);
|
|
@@ -6314,6 +6344,7 @@ var DrawerBody = React66.forwardRef(
|
|
|
6314
6344
|
paddingTop: topPadding,
|
|
6315
6345
|
paddingBottom: 0
|
|
6316
6346
|
},
|
|
6347
|
+
effectiveKeyboardStyle,
|
|
6317
6348
|
contentContainerStyle
|
|
6318
6349
|
]
|
|
6319
6350
|
}, props), {
|
|
@@ -11999,6 +12030,17 @@ var StyledImage3 = styled51(View)(({ theme: theme2, imageBackgroundColor, thumbn
|
|
|
11999
12030
|
minHeight: thumbnailWidth,
|
|
12000
12031
|
position: "relative"
|
|
12001
12032
|
}));
|
|
12033
|
+
var StyledBadgeOverlay = styled51(View)(({ theme: theme2 }) => {
|
|
12034
|
+
const offset = parseTokenValue9(
|
|
12035
|
+
theme2.tokens.semantics.dimensions.spacing["2xs"]
|
|
12036
|
+
);
|
|
12037
|
+
return {
|
|
12038
|
+
position: "absolute",
|
|
12039
|
+
top: offset,
|
|
12040
|
+
right: offset,
|
|
12041
|
+
zIndex: 2
|
|
12042
|
+
};
|
|
12043
|
+
});
|
|
12002
12044
|
var StyledContentArea = styled51(View)(({ theme: theme2 }) => {
|
|
12003
12045
|
const { spacing } = theme2.tokens.semantics.dimensions;
|
|
12004
12046
|
const paddingValue = parseTokenValue9(spacing.md);
|
|
@@ -12075,6 +12117,7 @@ var ProductDisplayCard = React66.forwardRef(
|
|
|
12075
12117
|
quantity = 1,
|
|
12076
12118
|
onQuantityChange,
|
|
12077
12119
|
showQuantityPicker = false,
|
|
12120
|
+
quantityBadge = false,
|
|
12078
12121
|
disableQuantityButtons = false,
|
|
12079
12122
|
hideQuantityButtons = false,
|
|
12080
12123
|
incrementDisabled = false,
|
|
@@ -12095,6 +12138,7 @@ var ProductDisplayCard = React66.forwardRef(
|
|
|
12095
12138
|
"quantity",
|
|
12096
12139
|
"onQuantityChange",
|
|
12097
12140
|
"showQuantityPicker",
|
|
12141
|
+
"quantityBadge",
|
|
12098
12142
|
"disableQuantityButtons",
|
|
12099
12143
|
"hideQuantityButtons",
|
|
12100
12144
|
"incrementDisabled",
|
|
@@ -12121,19 +12165,22 @@ var ProductDisplayCard = React66.forwardRef(
|
|
|
12121
12165
|
showBanner: showBanner && !!banner
|
|
12122
12166
|
}, rest), {
|
|
12123
12167
|
children: [
|
|
12124
|
-
image && /* @__PURE__ */ jsx(Pressable, { disabled: !onImagePress, onPress: onImagePress, children: /* @__PURE__ */
|
|
12168
|
+
image && /* @__PURE__ */ jsx(Pressable, { disabled: !onImagePress, onPress: onImagePress, children: /* @__PURE__ */ jsxs(
|
|
12125
12169
|
StyledImage3,
|
|
12126
12170
|
{
|
|
12127
12171
|
imageBackgroundColor,
|
|
12128
12172
|
thumbnailWidth,
|
|
12129
|
-
children:
|
|
12130
|
-
|
|
12131
|
-
|
|
12132
|
-
|
|
12133
|
-
|
|
12134
|
-
|
|
12135
|
-
|
|
12136
|
-
|
|
12173
|
+
children: [
|
|
12174
|
+
typeof image === "string" ? /* @__PURE__ */ jsx(
|
|
12175
|
+
Image,
|
|
12176
|
+
{
|
|
12177
|
+
source: { uri: image },
|
|
12178
|
+
resizeMode: "cover",
|
|
12179
|
+
style: { flex: 1, width: "100%" }
|
|
12180
|
+
}
|
|
12181
|
+
) : image,
|
|
12182
|
+
quantityBadge && /* @__PURE__ */ jsx(StyledBadgeOverlay, { pointerEvents: "none", children: /* @__PURE__ */ jsx(Badge, { variant: "primary", size: "large", children: String(quantity) }) })
|
|
12183
|
+
]
|
|
12137
12184
|
}
|
|
12138
12185
|
) }),
|
|
12139
12186
|
/* @__PURE__ */ jsxs(StyledContentArea, { children: [
|
|
@@ -12141,7 +12188,7 @@ var ProductDisplayCard = React66.forwardRef(
|
|
|
12141
12188
|
/* @__PURE__ */ jsx(Typography, { variant: "heading", size: "2xs", color: "primary", children: title }),
|
|
12142
12189
|
showSubtext && subtext && /* @__PURE__ */ jsx(Typography, { variant: "body", size: "sm", color: "secondary", children: subtext })
|
|
12143
12190
|
] }),
|
|
12144
|
-
showQuantityPicker && /* @__PURE__ */ jsx(View, { style: { marginLeft: "auto" }, children: /* @__PURE__ */ jsx(
|
|
12191
|
+
showQuantityPicker && !quantityBadge && /* @__PURE__ */ jsx(View, { style: { marginLeft: "auto" }, children: /* @__PURE__ */ jsx(
|
|
12145
12192
|
NumberField,
|
|
12146
12193
|
{
|
|
12147
12194
|
size: "sm",
|
|
@@ -12360,6 +12407,6 @@ var TabNavigation = Object.assign(TabNavigationRoot, {
|
|
|
12360
12407
|
Panel: TabNavigationPanel
|
|
12361
12408
|
});
|
|
12362
12409
|
|
|
12363
|
-
export { Accordion, Animated5 as Animated, Avatar, BRAND_FONTS, Badge, Button, ButtonDock, ButtonGroup, CarouselControls, Checkbox, CheckboxGroup, CopyField, CopyFieldInput, Countdown, DatePicker, Divider, Drawer, FilterTab, Hint, Icon, IconButton, Illustration, Input, InputDescription, InputError, InputField, InputLabel, InputText, Link, Logo, Menu2 as Menu, MenuItem, MessageCard, MessageCardBanner, MessageCardInsight, NativeSelectPicker, Notification, NumberField, NumberInput, NumberInputField, PasswordField, PasswordFieldInput, PasswordFieldRequirements, PawprintProvider, PictureSelector, ProductDisplayCard, ProductListingCardWithBadgeAndGrid as ProductListingCard, Progress, Radio, RadioGroup, RadioTile, SearchField, SearchFieldInput, SegmentedControl, SelectField, SelectFieldContent, SelectFieldItem, SelectFieldTrigger, SelectFieldValue, Slider, Spinner, StackedNotifications, Switch, TabNavigation, Tag, TextArea, TextAreaField, TextAreaLabel, ThemeProvider, Tooltip, Typography, createPawprintTheme, fadeAnimation, fadeDownAnimation, fadeUpAnimation, registerLogo, resolveFont, resolveLogo, scaleAnimation, slideInAnimation, slideOutAnimation, theme, useCopyField, usePasswordField, usePawprint, useSearchField, useSelectField };
|
|
12410
|
+
export { Accordion, Animated5 as Animated, Avatar, BRAND_FONTS, Badge, Button, ButtonDock, ButtonGroup, CarouselControls, Checkbox, CheckboxGroup, CopyField, CopyFieldInput, Countdown, DatePicker, Divider, Drawer, FilterTab, Hint, Icon, IconButton, Illustration, Input, InputDescription, InputError, InputField, InputLabel, InputText, Link, Logo, Menu2 as Menu, MenuItem, MessageCard, MessageCardBanner, MessageCardInsight, NativeSelectPicker, Notification, NumberField, NumberInput, NumberInputField, PasswordField, PasswordFieldInput, PasswordFieldRequirements, PawprintProvider, PictureSelector, ProductDisplayCard, ProductListingCardWithBadgeAndGrid as ProductListingCard, Progress, Radio, RadioGroup, RadioTile, SearchField, SearchFieldInput, SegmentedControl, SelectField, SelectFieldContent, SelectFieldItem, SelectFieldTrigger, SelectFieldValue, Slider, Spinner, StackedNotifications, Switch, TabNavigation, Tag, TextArea, TextAreaField, TextAreaLabel, ThemeProvider, Tooltip, Typography, createPawprintTheme, fadeAnimation, fadeDownAnimation, fadeUpAnimation, registerLogo, resolveFont, resolveLogo, scaleAnimation, slideInAnimation, slideOutAnimation, theme, useCopyField, useDrawerKeyboardAvoidance, usePasswordField, usePawprint, useSearchField, useSelectField };
|
|
12364
12411
|
//# sourceMappingURL=index.js.map
|
|
12365
12412
|
//# sourceMappingURL=index.js.map
|