@butternutbox/pawprint-native 0.25.0 → 1.0.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 +16 -0
- package/dist/index.cjs +26 -50
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +2 -7
- package/dist/index.d.ts +2 -7
- package/dist/index.js +16 -37
- package/dist/index.js.map +1 -1
- package/package.json +2 -1
- package/src/components/atoms/Button/Button.stories.tsx +90 -16
- package/src/components/atoms/Button/Button.tsx +14 -3
- package/src/components/atoms/Input/InputField.tsx +1 -1
- package/src/components/atoms/TextArea/TextAreaField.tsx +1 -1
- package/src/components/atoms/Typography/Typography.tsx +1 -1
- package/src/components/molecules/NativeSelectPicker/NativeSelectPicker.styled.ts +1 -1
- package/src/components/molecules/NumberField/NumberFieldInput.tsx +1 -1
- package/src/index.ts +1 -1
- package/tsup.config.ts +1 -2
- package/dist/ibm-plex-sans-condensed-400-normal.ttf +0 -0
- package/dist/ibm-plex-sans-condensed-500-normal.ttf +0 -0
- package/dist/ibm-plex-sans-condensed-600-normal.ttf +0 -0
- package/dist/ibm-plex-sans-condensed-700-normal.ttf +0 -0
- package/dist/ida-narrow-500-normal.ttf +0 -0
- package/dist/ida-narrow-700-normal.ttf +0 -0
- package/src/fonts/ibm-plex-sans-condensed-400-normal.ttf +0 -0
- package/src/fonts/ibm-plex-sans-condensed-500-normal.ttf +0 -0
- package/src/fonts/ibm-plex-sans-condensed-600-normal.ttf +0 -0
- package/src/fonts/ibm-plex-sans-condensed-700-normal.ttf +0 -0
- package/src/fonts/ida-narrow-500-normal.ttf +0 -0
- package/src/fonts/ida-narrow-700-normal.ttf +0 -0
- package/src/fonts/index.ts +0 -48
- package/src/types/fonts.d.ts +0 -4
package/dist/index.d.cts
CHANGED
|
@@ -3,7 +3,7 @@ import { TokensCorePrimitives, BrandThemeSemantics, BrandThemeComponents, BrandN
|
|
|
3
3
|
export { tokens } from '@butternutbox/pawprint-tokens';
|
|
4
4
|
import * as _emotion_native from '@emotion/native';
|
|
5
5
|
export { default as styled } from '@emotion/native';
|
|
6
|
-
|
|
6
|
+
export * from '@butternutbox/pawprint-fonts';
|
|
7
7
|
import React from 'react';
|
|
8
8
|
import * as _emotion_react from '@emotion/react';
|
|
9
9
|
import { Theme } from '@emotion/react';
|
|
@@ -30,11 +30,6 @@ declare module "@emotion/react" {
|
|
|
30
30
|
}
|
|
31
31
|
}
|
|
32
32
|
|
|
33
|
-
declare const BRAND_FONTS: Partial<Record<BrandName, Record<string, FontSource>>>;
|
|
34
|
-
declare const resolveFont: (fontFamily: string, fontWeight: string) => {
|
|
35
|
-
fontFamily: string;
|
|
36
|
-
};
|
|
37
|
-
|
|
38
33
|
interface PawprintProviderProps {
|
|
39
34
|
brand?: BrandName;
|
|
40
35
|
initialTheme?: ThemeName;
|
|
@@ -2511,4 +2506,4 @@ declare const useDrawerKeyboardAvoidance: (minPadding?: number) => {
|
|
|
2511
2506
|
contentContainerStyle: StyleProp<ViewStyle>;
|
|
2512
2507
|
};
|
|
2513
2508
|
|
|
2514
|
-
export { Accordion, type AccordionItemProps, type AccordionProps, type AccordionSize, Animated, type AnimatedProps, type AnimatedVariant, Avatar, type AvatarFallbackType, type AvatarProps, type AvatarSize,
|
|
2509
|
+
export { Accordion, type AccordionItemProps, type AccordionProps, type AccordionSize, Animated, type AnimatedProps, type AnimatedVariant, Avatar, type AvatarFallbackType, type AvatarProps, type AvatarSize, 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, PROGRESS_ANIMATION, 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, resolveLogo, scaleAnimation, slideInAnimation, slideOutAnimation, theme, useCopyField, useDrawerKeyboardAvoidance, usePasswordField, usePawprint, useSearchField, useSelectField };
|
package/dist/index.d.ts
CHANGED
|
@@ -3,7 +3,7 @@ import { TokensCorePrimitives, BrandThemeSemantics, BrandThemeComponents, BrandN
|
|
|
3
3
|
export { tokens } from '@butternutbox/pawprint-tokens';
|
|
4
4
|
import * as _emotion_native from '@emotion/native';
|
|
5
5
|
export { default as styled } from '@emotion/native';
|
|
6
|
-
|
|
6
|
+
export * from '@butternutbox/pawprint-fonts';
|
|
7
7
|
import React from 'react';
|
|
8
8
|
import * as _emotion_react from '@emotion/react';
|
|
9
9
|
import { Theme } from '@emotion/react';
|
|
@@ -30,11 +30,6 @@ declare module "@emotion/react" {
|
|
|
30
30
|
}
|
|
31
31
|
}
|
|
32
32
|
|
|
33
|
-
declare const BRAND_FONTS: Partial<Record<BrandName, Record<string, FontSource>>>;
|
|
34
|
-
declare const resolveFont: (fontFamily: string, fontWeight: string) => {
|
|
35
|
-
fontFamily: string;
|
|
36
|
-
};
|
|
37
|
-
|
|
38
33
|
interface PawprintProviderProps {
|
|
39
34
|
brand?: BrandName;
|
|
40
35
|
initialTheme?: ThemeName;
|
|
@@ -2511,4 +2506,4 @@ declare const useDrawerKeyboardAvoidance: (minPadding?: number) => {
|
|
|
2511
2506
|
contentContainerStyle: StyleProp<ViewStyle>;
|
|
2512
2507
|
};
|
|
2513
2508
|
|
|
2514
|
-
export { Accordion, type AccordionItemProps, type AccordionProps, type AccordionSize, Animated, type AnimatedProps, type AnimatedVariant, Avatar, type AvatarFallbackType, type AvatarProps, type AvatarSize,
|
|
2509
|
+
export { Accordion, type AccordionItemProps, type AccordionProps, type AccordionSize, Animated, type AnimatedProps, type AnimatedVariant, Avatar, type AvatarFallbackType, type AvatarProps, type AvatarSize, 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, PROGRESS_ANIMATION, 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, resolveLogo, scaleAnimation, slideInAnimation, slideOutAnimation, theme, useCopyField, useDrawerKeyboardAvoidance, usePasswordField, usePawprint, useSearchField, useSelectField };
|
package/dist/index.js
CHANGED
|
@@ -1,14 +1,10 @@
|
|
|
1
1
|
import { useTheme, ThemeProvider as ThemeProvider$1 } from '@emotion/react';
|
|
2
|
-
import {
|
|
2
|
+
import { Theme, Brand, DEFAULT_THEME_OPTIONS, THEME_OPTIONS_MAP, tokens } from '@butternutbox/pawprint-tokens';
|
|
3
3
|
export { tokens } from '@butternutbox/pawprint-tokens';
|
|
4
4
|
import styled51 from '@emotion/native';
|
|
5
5
|
export { default as styled } from '@emotion/native';
|
|
6
|
-
import
|
|
7
|
-
|
|
8
|
-
import ibmPlexSansCondensed400 from './ibm-plex-sans-condensed-400-normal.ttf';
|
|
9
|
-
import ibmPlexSansCondensed500 from './ibm-plex-sans-condensed-500-normal.ttf';
|
|
10
|
-
import ibmPlexSansCondensed600 from './ibm-plex-sans-condensed-600-normal.ttf';
|
|
11
|
-
import ibmPlexSansCondensed700 from './ibm-plex-sans-condensed-700-normal.ttf';
|
|
6
|
+
import { resolveFont } from '@butternutbox/pawprint-fonts';
|
|
7
|
+
export * from '@butternutbox/pawprint-fonts';
|
|
12
8
|
import React66, { createContext, forwardRef, useRef, useEffect, useState, useCallback, useMemo, useContext } from 'react';
|
|
13
9
|
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
14
10
|
import * as AvatarPrimitive from '@rn-primitives/avatar';
|
|
@@ -78,33 +74,6 @@ var __async = (__this, __arguments, generator) => {
|
|
|
78
74
|
step((generator = generator.apply(__this, __arguments)).next());
|
|
79
75
|
});
|
|
80
76
|
};
|
|
81
|
-
var BRAND_FONTS = {
|
|
82
|
-
[Brand.Butternutbox]: {
|
|
83
|
-
"IdaWebNarrow-Medium": idaNarrow500,
|
|
84
|
-
"IdaWebNarrow-Bold": idaNarrow700,
|
|
85
|
-
"IBMPlexSansCond-Regular": ibmPlexSansCondensed400,
|
|
86
|
-
"IBMPlexSansCond-Medium": ibmPlexSansCondensed500,
|
|
87
|
-
"IBMPlexSansCond-SemiBold": ibmPlexSansCondensed600,
|
|
88
|
-
"IBMPlexSansCond-Bold": ibmPlexSansCondensed700
|
|
89
|
-
}
|
|
90
|
-
};
|
|
91
|
-
var FONT_MAP = {
|
|
92
|
-
"IBM Plex Sans Condensed": {
|
|
93
|
-
"400": "IBMPlexSansCond-Regular",
|
|
94
|
-
"500": "IBMPlexSansCond-Medium",
|
|
95
|
-
"600": "IBMPlexSansCond-SemiBold",
|
|
96
|
-
"700": "IBMPlexSansCond-Bold"
|
|
97
|
-
},
|
|
98
|
-
"Ida Narrow": {
|
|
99
|
-
"500": "IdaWebNarrow-Medium",
|
|
100
|
-
"700": "IdaWebNarrow-Bold"
|
|
101
|
-
}
|
|
102
|
-
};
|
|
103
|
-
var resolveFont = (fontFamily, fontWeight) => {
|
|
104
|
-
var _a;
|
|
105
|
-
const resolved = (_a = FONT_MAP[fontFamily]) == null ? void 0 : _a[fontWeight];
|
|
106
|
-
return { fontFamily: resolved != null ? resolved : fontFamily };
|
|
107
|
-
};
|
|
108
77
|
var createPawprintTheme = (brand = Brand.Butternutbox, theme2 = Theme.Default) => {
|
|
109
78
|
const brandThemes = THEME_OPTIONS_MAP[brand];
|
|
110
79
|
const themeOptions = brandThemes && theme2 in brandThemes ? brandThemes[theme2] : DEFAULT_THEME_OPTIONS;
|
|
@@ -1262,6 +1231,16 @@ var Button = React66.forwardRef(
|
|
|
1262
1231
|
};
|
|
1263
1232
|
};
|
|
1264
1233
|
const variantStyles = getVariantStyles(pressed);
|
|
1234
|
+
const renderIcon = (icon) => {
|
|
1235
|
+
if (!React66.isValidElement(icon)) return icon;
|
|
1236
|
+
const iconElement = icon;
|
|
1237
|
+
if (!pressed) {
|
|
1238
|
+
return icon;
|
|
1239
|
+
}
|
|
1240
|
+
return React66.cloneElement(iconElement, {
|
|
1241
|
+
customColour: variantStyles.textColor
|
|
1242
|
+
});
|
|
1243
|
+
};
|
|
1265
1244
|
return /* @__PURE__ */ jsxs(
|
|
1266
1245
|
StyledButton,
|
|
1267
1246
|
__spreadProps(__spreadValues({
|
|
@@ -1285,7 +1264,7 @@ var Button = React66.forwardRef(
|
|
|
1285
1264
|
buttonFullWidth: fullWidth
|
|
1286
1265
|
}, rest), {
|
|
1287
1266
|
children: [
|
|
1288
|
-
startIcon && /* @__PURE__ */ jsx(IconWrapper, { children: startIcon }),
|
|
1267
|
+
startIcon && /* @__PURE__ */ jsx(IconWrapper, { children: renderIcon(startIcon) }),
|
|
1289
1268
|
/* @__PURE__ */ jsx(
|
|
1290
1269
|
Typography,
|
|
1291
1270
|
{
|
|
@@ -1301,7 +1280,7 @@ var Button = React66.forwardRef(
|
|
|
1301
1280
|
children
|
|
1302
1281
|
}
|
|
1303
1282
|
),
|
|
1304
|
-
endIcon && /* @__PURE__ */ jsx(IconWrapper, { children: endIcon }),
|
|
1283
|
+
endIcon && /* @__PURE__ */ jsx(IconWrapper, { children: renderIcon(endIcon) }),
|
|
1305
1284
|
loading && /* @__PURE__ */ jsx(StyledSpinnerWrapper, { children: /* @__PURE__ */ jsx(
|
|
1306
1285
|
Spinner,
|
|
1307
1286
|
{
|
|
@@ -12547,6 +12526,6 @@ var TabNavigation = Object.assign(TabNavigationRoot, {
|
|
|
12547
12526
|
Panel: TabNavigationPanel
|
|
12548
12527
|
});
|
|
12549
12528
|
|
|
12550
|
-
export { Accordion, Animated5 as Animated, Avatar,
|
|
12529
|
+
export { Accordion, Animated5 as Animated, Avatar, 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, PROGRESS_ANIMATION, 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, resolveLogo, scaleAnimation, slideInAnimation, slideOutAnimation, theme, useCopyField, useDrawerKeyboardAvoidance, usePasswordField, usePawprint, useSearchField, useSelectField };
|
|
12551
12530
|
//# sourceMappingURL=index.js.map
|
|
12552
12531
|
//# sourceMappingURL=index.js.map
|