@razorpay/blade 3.5.2 → 3.6.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/CHANGELOG.md +13 -0
- package/build/components/index.d.ts +33 -2
- package/build/components/index.native.d.ts +33 -2
- package/build/components/index.native.js +10 -8
- package/build/components/index.native.js.map +1 -1
- package/build/components/index.web.js +52 -25
- package/build/components/index.web.js.map +1 -1
- package/build/css/bankingThemeDarkDesktop.css +20 -12
- package/build/css/bankingThemeDarkMobile.css +20 -12
- package/build/css/bankingThemeLightDesktop.css +20 -12
- package/build/css/bankingThemeLightMobile.css +20 -12
- package/build/css/paymentThemeDarkDesktop.css +20 -12
- package/build/css/paymentThemeDarkMobile.css +20 -12
- package/build/css/paymentThemeLightDesktop.css +20 -12
- package/build/css/paymentThemeLightMobile.css +20 -12
- package/build/tokens/index.d.ts +4 -1
- package/build/tokens/index.native.d.ts +4 -1
- package/build/tokens/index.native.js +3 -3
- package/build/tokens/index.native.js.map +1 -1
- package/build/tokens/index.web.js +164 -50
- package/build/tokens/index.web.js.map +1 -1
- package/package.json +4 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,18 @@
|
|
|
1
1
|
# @razorpay/blade
|
|
2
2
|
|
|
3
|
+
## 3.6.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- 0f4df3a: feat(blade): added counter component
|
|
8
|
+
- c5b28bc: feat(tokens): add new tokens to neutral palette
|
|
9
|
+
|
|
10
|
+
## 3.5.3
|
|
11
|
+
|
|
12
|
+
### Patch Changes
|
|
13
|
+
|
|
14
|
+
- 92cfa80: fix(Alert): throw error if `secondaryAction` is defined without `primaryAction`
|
|
15
|
+
|
|
3
16
|
## 3.5.2
|
|
4
17
|
|
|
5
18
|
### Patch Changes
|
|
@@ -771,7 +771,7 @@ type Colors = {
|
|
|
771
771
|
brand: {
|
|
772
772
|
primary: Record<300 | 400 | 500 | 600 | 700 | 800, string>;
|
|
773
773
|
secondary: Record<500, string>;
|
|
774
|
-
gray: Record<200 | 300 | 400 | 500 | 600 | 700 | 'a50' | 'a100',
|
|
774
|
+
gray: Record<200 | 300 | 400 | 500 | 600 | 700 | 'a50' | 'a100', ColorContrast>;
|
|
775
775
|
};
|
|
776
776
|
feedback: {
|
|
777
777
|
background: Record<Feedback, ColorContrast>;
|
|
@@ -1069,6 +1069,37 @@ declare type ButtonWithIconProps = ButtonCommonProps & {
|
|
|
1069
1069
|
declare type ButtonProps = ButtonWithoutIconProps | ButtonWithIconProps;
|
|
1070
1070
|
declare const Button: ({ children, icon, iconPosition, isDisabled, isFullWidth, isLoading, onClick, size, type, variant, accessibilityLabel, }: ButtonProps) => React.ReactElement;
|
|
1071
1071
|
|
|
1072
|
+
declare type CounterProps = {
|
|
1073
|
+
/**
|
|
1074
|
+
* Sets the value for the counter.
|
|
1075
|
+
*/
|
|
1076
|
+
value: number;
|
|
1077
|
+
/**
|
|
1078
|
+
* Sets the max value for the counter.
|
|
1079
|
+
* If value exceedes `max` it will render `value+`
|
|
1080
|
+
*/
|
|
1081
|
+
max?: number;
|
|
1082
|
+
/**
|
|
1083
|
+
* Sets the intent of the counter.
|
|
1084
|
+
*
|
|
1085
|
+
* @default 'neutral'
|
|
1086
|
+
*/
|
|
1087
|
+
intent?: Feedback;
|
|
1088
|
+
/**
|
|
1089
|
+
* Sets the contrast of the counter.
|
|
1090
|
+
*
|
|
1091
|
+
* @default 'low'
|
|
1092
|
+
*/
|
|
1093
|
+
contrast?: 'high' | 'low';
|
|
1094
|
+
/**
|
|
1095
|
+
* Sets the size of the counter.
|
|
1096
|
+
*
|
|
1097
|
+
* @default 'medium'
|
|
1098
|
+
*/
|
|
1099
|
+
size?: 'small' | 'medium';
|
|
1100
|
+
};
|
|
1101
|
+
declare const Counter: ({ value, max, intent, contrast, size, }: CounterProps) => React.ReactElement;
|
|
1102
|
+
|
|
1072
1103
|
declare type OnChange = ({ isChecked, event, value, }: {
|
|
1073
1104
|
isChecked: boolean;
|
|
1074
1105
|
event?: React__default.ChangeEvent;
|
|
@@ -1984,4 +2015,4 @@ declare const VisuallyHidden: ({ children }: VisuallyHiddenProps) => JSX.Element
|
|
|
1984
2015
|
|
|
1985
2016
|
declare const screenReaderStyles: CSSObject;
|
|
1986
2017
|
|
|
1987
|
-
export { Alert, AlertTriangleIcon as AlertOctagonIcon, AlertProps, AlertTriangleIcon$1 as AlertTriangleIcon, ArrowDownIcon, ArrowLeftIcon, ArrowRightIcon, ArrowUpIcon, ArrowUpRightIcon, Badge, BadgeProps, BladeProvider, BladeProviderProps, Button, ButtonProps, CheckCircleIcon, CheckIcon, Checkbox, CheckboxGroup, CheckboxGroupProps, CheckboxProps, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, CloseIcon, Code, CodeProps, CreditCardIcon, DollarIcon, DownloadIcon, EditIcon, ExternalLinkIcon, EyeIcon, EyeOffIcon, Heading, HeadingProps, HelpCircleIcon, HistoryIcon, HomeIcon, IconComponent, IconProps, IconSize, InfoIcon, Link, LinkIcon, LinkProps, MinusIcon, OTPInput, OTPInputProps, PasswordInput, PasswordInputProps, PauseIcon, PlusIcon, Radio, RadioGroup, RadioGroupProps, RadioProps, RefreshLeftIcon, RotateCounterClockWiseIcon, RupeeIcon, SearchIcon, SkipNavContent, SkipNavLink, Spinner, SpinnerProps, Text, TextArea, TextAreaProps, TextInput, TextInputProps, TextProps, TextVariant, Theme, Title, TitleProps, TrashIcon, TrendingDownIcon, TrendingUpIcon, VisuallyHidden, VisuallyHiddenProps, announce, clearAnnouncer, destroyAnnouncer, getTextProps, screenReaderStyles, useTheme };
|
|
2018
|
+
export { Alert, AlertTriangleIcon as AlertOctagonIcon, AlertProps, AlertTriangleIcon$1 as AlertTriangleIcon, ArrowDownIcon, ArrowLeftIcon, ArrowRightIcon, ArrowUpIcon, ArrowUpRightIcon, Badge, BadgeProps, BladeProvider, BladeProviderProps, Button, ButtonProps, CheckCircleIcon, CheckIcon, Checkbox, CheckboxGroup, CheckboxGroupProps, CheckboxProps, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, CloseIcon, Code, CodeProps, Counter, CounterProps, CreditCardIcon, DollarIcon, DownloadIcon, EditIcon, ExternalLinkIcon, EyeIcon, EyeOffIcon, Heading, HeadingProps, HelpCircleIcon, HistoryIcon, HomeIcon, IconComponent, IconProps, IconSize, InfoIcon, Link, LinkIcon, LinkProps, MinusIcon, OTPInput, OTPInputProps, PasswordInput, PasswordInputProps, PauseIcon, PlusIcon, Radio, RadioGroup, RadioGroupProps, RadioProps, RefreshLeftIcon, RotateCounterClockWiseIcon, RupeeIcon, SearchIcon, SkipNavContent, SkipNavLink, Spinner, SpinnerProps, Text, TextArea, TextAreaProps, TextInput, TextInputProps, TextProps, TextVariant, Theme, Title, TitleProps, TrashIcon, TrendingDownIcon, TrendingUpIcon, VisuallyHidden, VisuallyHiddenProps, announce, clearAnnouncer, destroyAnnouncer, getTextProps, screenReaderStyles, useTheme };
|
|
@@ -771,7 +771,7 @@ type Colors = {
|
|
|
771
771
|
brand: {
|
|
772
772
|
primary: Record<300 | 400 | 500 | 600 | 700 | 800, string>;
|
|
773
773
|
secondary: Record<500, string>;
|
|
774
|
-
gray: Record<200 | 300 | 400 | 500 | 600 | 700 | 'a50' | 'a100',
|
|
774
|
+
gray: Record<200 | 300 | 400 | 500 | 600 | 700 | 'a50' | 'a100', ColorContrast>;
|
|
775
775
|
};
|
|
776
776
|
feedback: {
|
|
777
777
|
background: Record<Feedback, ColorContrast>;
|
|
@@ -1069,6 +1069,37 @@ declare type ButtonWithIconProps = ButtonCommonProps & {
|
|
|
1069
1069
|
declare type ButtonProps = ButtonWithoutIconProps | ButtonWithIconProps;
|
|
1070
1070
|
declare const Button: ({ children, icon, iconPosition, isDisabled, isFullWidth, isLoading, onClick, size, type, variant, accessibilityLabel, }: ButtonProps) => React.ReactElement;
|
|
1071
1071
|
|
|
1072
|
+
declare type CounterProps = {
|
|
1073
|
+
/**
|
|
1074
|
+
* Sets the value for the counter.
|
|
1075
|
+
*/
|
|
1076
|
+
value: number;
|
|
1077
|
+
/**
|
|
1078
|
+
* Sets the max value for the counter.
|
|
1079
|
+
* If value exceedes `max` it will render `value+`
|
|
1080
|
+
*/
|
|
1081
|
+
max?: number;
|
|
1082
|
+
/**
|
|
1083
|
+
* Sets the intent of the counter.
|
|
1084
|
+
*
|
|
1085
|
+
* @default 'neutral'
|
|
1086
|
+
*/
|
|
1087
|
+
intent?: Feedback;
|
|
1088
|
+
/**
|
|
1089
|
+
* Sets the contrast of the counter.
|
|
1090
|
+
*
|
|
1091
|
+
* @default 'low'
|
|
1092
|
+
*/
|
|
1093
|
+
contrast?: 'high' | 'low';
|
|
1094
|
+
/**
|
|
1095
|
+
* Sets the size of the counter.
|
|
1096
|
+
*
|
|
1097
|
+
* @default 'medium'
|
|
1098
|
+
*/
|
|
1099
|
+
size?: 'small' | 'medium';
|
|
1100
|
+
};
|
|
1101
|
+
declare const Counter: ({ value, max, intent, contrast, size, }: CounterProps) => React.ReactElement;
|
|
1102
|
+
|
|
1072
1103
|
declare type OnChange = ({ isChecked, event, value, }: {
|
|
1073
1104
|
isChecked: boolean;
|
|
1074
1105
|
event?: React__default.ChangeEvent;
|
|
@@ -1972,4 +2003,4 @@ declare const VisuallyHidden: ({ children }: VisuallyHiddenProps) => JSX.Element
|
|
|
1972
2003
|
|
|
1973
2004
|
declare const screenReaderStyles: CSSObject;
|
|
1974
2005
|
|
|
1975
|
-
export { Alert, AlertTriangleIcon as AlertOctagonIcon, AlertProps, AlertTriangleIcon$1 as AlertTriangleIcon, ArrowDownIcon, ArrowLeftIcon, ArrowRightIcon, ArrowUpIcon, ArrowUpRightIcon, Badge, BadgeProps, BladeProvider, BladeProviderProps, Button, ButtonProps, CheckCircleIcon, CheckIcon, Checkbox, CheckboxGroup, CheckboxGroupProps, CheckboxProps, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, CloseIcon, Code, CodeProps, CreditCardIcon, DollarIcon, DownloadIcon, EditIcon, ExternalLinkIcon, EyeIcon, EyeOffIcon, Heading, HeadingProps, HelpCircleIcon, HistoryIcon, HomeIcon, IconComponent, IconProps, IconSize, InfoIcon, Link, LinkIcon, LinkProps, MinusIcon, OTPInput, OTPInputProps, PasswordInput, PasswordInputProps, PauseIcon, PlusIcon, Radio, RadioGroup, RadioGroupProps, RadioProps, RefreshLeftIcon, RotateCounterClockWiseIcon, RupeeIcon, SearchIcon, SkipNavContent, SkipNavLink, Spinner, SpinnerProps, Text, TextArea, TextAreaProps, TextInput, TextInputProps, TextProps, TextVariant, Theme, Title, TitleProps, TrashIcon, TrendingDownIcon, TrendingUpIcon, VisuallyHidden, VisuallyHiddenProps, announce, clearAnnouncer, destroyAnnouncer, getTextProps, screenReaderStyles, useTheme };
|
|
2006
|
+
export { Alert, AlertTriangleIcon as AlertOctagonIcon, AlertProps, AlertTriangleIcon$1 as AlertTriangleIcon, ArrowDownIcon, ArrowLeftIcon, ArrowRightIcon, ArrowUpIcon, ArrowUpRightIcon, Badge, BadgeProps, BladeProvider, BladeProviderProps, Button, ButtonProps, CheckCircleIcon, CheckIcon, Checkbox, CheckboxGroup, CheckboxGroupProps, CheckboxProps, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, CloseIcon, Code, CodeProps, Counter, CounterProps, CreditCardIcon, DollarIcon, DownloadIcon, EditIcon, ExternalLinkIcon, EyeIcon, EyeOffIcon, Heading, HeadingProps, HelpCircleIcon, HistoryIcon, HomeIcon, IconComponent, IconProps, IconSize, InfoIcon, Link, LinkIcon, LinkProps, MinusIcon, OTPInput, OTPInputProps, PasswordInput, PasswordInputProps, PauseIcon, PlusIcon, Radio, RadioGroup, RadioGroupProps, RadioProps, RefreshLeftIcon, RotateCounterClockWiseIcon, RupeeIcon, SearchIcon, SkipNavContent, SkipNavLink, Spinner, SpinnerProps, Text, TextArea, TextAreaProps, TextInput, TextInputProps, TextProps, TextVariant, Theme, Title, TitleProps, TrashIcon, TrendingDownIcon, TrendingUpIcon, VisuallyHidden, VisuallyHiddenProps, announce, clearAnnouncer, destroyAnnouncer, getTextProps, screenReaderStyles, useTheme };
|
|
@@ -3325,7 +3325,7 @@ var getProps$2=function getProps(_ref){var variant=_ref.variant,size=_ref.size,t
|
|
|
3325
3325
|
|
|
3326
3326
|
var getTextProps=function getTextProps(_ref){var variant=_ref.variant,type=_ref.type,weight=_ref.weight,size=_ref.size,contrast=_ref.contrast;var isPlatformWeb=getPlatformType()==='browser'||getPlatformType()==='node';var colorContrast=contrast?contrast+"Contrast":'lowContrast';var props={color:"surface.text."+(type!=null?type:'normal')+"."+colorContrast,fontSize:100,fontWeight:weight!=null?weight:'regular',fontStyle:'normal',lineHeight:'l',fontFamily:'text',forwardedAs:isPlatformWeb?'p':undefined};if(variant==='body'){if(size==='small'){props.fontSize=75;props.lineHeight='s';}}else if(variant==='caption'){if(weight==='bold'){throw new Error("[Blade: Text]: weight cannot be 'bold' when variant is 'caption'");}if(size==='small'){throw new Error("[Blade: Text]: size cannot be 'small' when variant is 'caption'");}props.fontSize=50;props.lineHeight='s';props.fontStyle='italic';}return props;};var StyledText=styled(BaseText)(function(_ref2){var truncateAfterLines=_ref2.truncateAfterLines;if(truncateAfterLines){if(getPlatformType()==='react-native'){return {numberOfLines:truncateAfterLines};}return {overflow:'hidden',display:'-webkit-box','line-clamp':""+truncateAfterLines,'-webkit-line-clamp':""+truncateAfterLines,'-webkit-box-orient':'vertical'};}return {};});var Text=function Text(_ref3){var _ref3$variant=_ref3.variant,variant=_ref3$variant===void 0?'body':_ref3$variant,_ref3$weight=_ref3.weight,weight=_ref3$weight===void 0?'regular':_ref3$weight,_ref3$size=_ref3.size,size=_ref3$size===void 0?'medium':_ref3$size,_ref3$type=_ref3.type,type=_ref3$type===void 0?'normal':_ref3$type,_ref3$contrast=_ref3.contrast,contrast=_ref3$contrast===void 0?'low':_ref3$contrast,truncateAfterLines=_ref3.truncateAfterLines,children=_ref3.children;var props=_extends({truncateAfterLines:truncateAfterLines},getTextProps({variant:variant,type:type,weight:weight,size:size,contrast:contrast}));return jsx(StyledText,_extends({},props,{children:children}));};
|
|
3327
3327
|
|
|
3328
|
-
var platformType=getPlatformType();var isPlatformWeb=platformType==='browser'||platformType==='node';var getCodeFontSize=function getCodeFontSize(size){switch(size){case'medium':return 100;default:return 75;}};var CodeContainer=styled(Box)(function(props){var padding=makeSpace(props.theme.spacing[0])+" "+makeSpace(props.theme.spacing[2]);return {padding:padding,backgroundColor:props.theme.colors.brand.gray[400],borderRadius:props.theme.border.radius.medium,display:isPlatformWeb?'inline-block':undefined,lineHeight:makeTypographySize(props.theme.typography.lineHeights.s)};});var Code=function Code(_ref){var children=_ref.children,_ref$size=_ref.size,size=_ref$size===void 0?'small':_ref$size;return jsx(CodeContainer,{size:size,as:isPlatformWeb?'span':undefined,children:jsx(BaseText,{color:"surface.text.subtle.lowContrast",fontFamily:"code",fontSize:getCodeFontSize(size),as:isPlatformWeb?'code':undefined,children:children})});};
|
|
3328
|
+
var platformType=getPlatformType();var isPlatformWeb=platformType==='browser'||platformType==='node';var getCodeFontSize=function getCodeFontSize(size){switch(size){case'medium':return 100;default:return 75;}};var CodeContainer=styled(Box)(function(props){var padding=makeSpace(props.theme.spacing[0])+" "+makeSpace(props.theme.spacing[2]);return {padding:padding,backgroundColor:props.theme.colors.brand.gray[400].lowContrast,borderRadius:props.theme.border.radius.medium,display:isPlatformWeb?'inline-block':undefined,lineHeight:makeTypographySize(props.theme.typography.lineHeights.s)};});var Code=function Code(_ref){var children=_ref.children,_ref$size=_ref.size,size=_ref$size===void 0?'small':_ref$size;return jsx(CodeContainer,{size:size,as:isPlatformWeb?'span':undefined,children:jsx(BaseText,{color:"surface.text.subtle.lowContrast",fontFamily:"code",fontSize:getCodeFontSize(size),as:isPlatformWeb?'code':undefined,children:children})});};
|
|
3329
3329
|
|
|
3330
3330
|
var getBaseButtonStyles=function getBaseButtonStyles(_ref){var defaultBorderColor=_ref.defaultBorderColor,minHeight=_ref.minHeight,buttonPaddingTop=_ref.buttonPaddingTop,buttonPaddingBottom=_ref.buttonPaddingBottom,buttonPaddingLeft=_ref.buttonPaddingLeft,buttonPaddingRight=_ref.buttonPaddingRight,defaultBackgroundColor=_ref.defaultBackgroundColor,disabled=_ref.disabled,isFullWidth=_ref.isFullWidth,borderWidth=_ref.borderWidth,borderRadius=_ref.borderRadius;return {minHeight:minHeight,width:isFullWidth?'100%':'auto',cursor:disabled?'not-allowed':'pointer',backgroundColor:defaultBackgroundColor,borderColor:defaultBorderColor,borderWidth:borderWidth,borderRadius:borderRadius,borderStyle:'solid',paddingTop:buttonPaddingTop,paddingBottom:buttonPaddingBottom,paddingLeft:buttonPaddingLeft,paddingRight:buttonPaddingRight};};
|
|
3331
3331
|
|
|
@@ -3341,7 +3341,7 @@ var SpinnerIcon=function SpinnerIcon(_ref){var dimensions=_ref.dimensions,color=
|
|
|
3341
3341
|
|
|
3342
3342
|
var SpinningBox=function SpinningBox(_ref){var children=_ref.children;var _useTheme=useTheme(),theme=_useTheme.theme;var duration=castNativeType(makeMotionTime(get_1(theme.motion,motion.duration)));var easing=get_1(theme.motion,motion.easing);var rotation=useSharedValue(0);var animatedStyles=useAnimatedStyle(function(){var _f=function _f(){return {transform:[{rotateZ:rotation.value+"deg"}]};};_f._closure={rotation:rotation};_f.asString="function _f(){const{rotation}=jsThis._closure;{return{transform:[{rotateZ:rotation.value+\"deg\"}]};}}";_f.__workletHash=16442698185463;_f.__location="/home/runner/work/blade/blade/packages/blade/src/components/Spinner/BaseSpinner/SpinningBox.native.tsx (21:42)";_f.__optimalization=3;global.__reanimatedWorkletInit(_f);return _f;}(),[rotation.value]);React__default.useEffect(function(){rotation.value=withRepeat(withTiming(360,{duration:duration,easing:easing}),-1);return function(){cancelAnimation(rotation);};},[duration,easing,rotation]);return jsx(Box,{alignSelf:"center",children:jsx(Animated.View,{style:animatedStyles,children:children})});};
|
|
3343
3343
|
|
|
3344
|
-
var getColor=function getColor(_ref){var contrast=_ref.contrast,intent=_ref.intent,theme=_ref.theme;if(intent){return get_1(theme.colors,"feedback."+intent+".action.icon.primary.disabled."+contrast+"Contrast");}else if(contrast=='low'){return get_1(theme.colors,'brand.gray.700');}else {return get_1(theme.colors,'brand.gray.400');}};var BaseSpinner=function BaseSpinner(_ref2){var label=_ref2.label,_ref2$labelPosition=_ref2.labelPosition,labelPosition=_ref2$labelPosition===void 0?'right':_ref2$labelPosition,accessibilityLabel=_ref2.accessibilityLabel,_ref2$contrast=_ref2.contrast,contrast=_ref2$contrast===void 0?'low':_ref2$contrast,intent=_ref2.intent,_ref2$size=_ref2.size,size=_ref2$size===void 0?'medium':_ref2$size;var _useTheme=useTheme(),theme=_useTheme.theme;return jsx(Box,{display:"flex",children:jsxs(Box,_extends({display:"flex",alignItems:"center",flexDirection:labelPosition==='right'?'row':'column'},makeAccessible({label:accessibilityLabel,role:'progressbar'}),{children:[jsx(SpinningBox,{children:jsx(SpinnerIcon,{dimensions:makeSize(dimensions[size]),color:getColor({contrast:contrast,intent:intent,theme:theme})})}),label&&label.trim().length>0?jsx(Box,{marginLeft:labelPosition==='right'?'spacing.3':'spacing.0',marginTop:labelPosition==='bottom'?'spacing.3':'spacing.0',children:jsx(Text,{variant:"body",weight:"regular",type:"subdued",size:"small",contrast:contrast,children:label})}):null]}))});};
|
|
3344
|
+
var getColor=function getColor(_ref){var contrast=_ref.contrast,intent=_ref.intent,theme=_ref.theme;if(intent){return get_1(theme.colors,"feedback."+intent+".action.icon.primary.disabled."+contrast+"Contrast");}else if(contrast=='low'){return get_1(theme.colors,'brand.gray.700.lowContrast');}else {return get_1(theme.colors,'brand.gray.400.lowContrast');}};var BaseSpinner=function BaseSpinner(_ref2){var label=_ref2.label,_ref2$labelPosition=_ref2.labelPosition,labelPosition=_ref2$labelPosition===void 0?'right':_ref2$labelPosition,accessibilityLabel=_ref2.accessibilityLabel,_ref2$contrast=_ref2.contrast,contrast=_ref2$contrast===void 0?'low':_ref2$contrast,intent=_ref2.intent,_ref2$size=_ref2.size,size=_ref2$size===void 0?'medium':_ref2$size;var _useTheme=useTheme(),theme=_useTheme.theme;return jsx(Box,{display:"flex",children:jsxs(Box,_extends({display:"flex",alignItems:"center",flexDirection:labelPosition==='right'?'row':'column'},makeAccessible({label:accessibilityLabel,role:'progressbar'}),{children:[jsx(SpinningBox,{children:jsx(SpinnerIcon,{dimensions:makeSize(dimensions[size]),color:getColor({contrast:contrast,intent:intent,theme:theme})})}),label&&label.trim().length>0?jsx(Box,{marginLeft:labelPosition==='right'?'spacing.3':'spacing.0',marginTop:labelPosition==='bottom'?'spacing.3':'spacing.0',children:jsx(Text,{variant:"body",weight:"regular",type:"subdued",size:"small",contrast:contrast,children:label})}):null]}))});};
|
|
3345
3345
|
|
|
3346
3346
|
var getColorToken$1=function getColorToken(_ref){var property=_ref.property,variant=_ref.variant,state=_ref.state,contrast=_ref.contrast,intent=_ref.intent;if(intent&&contrast){return "feedback."+intent+".action."+property+".primary."+state+"."+contrast+"Contrast";}return "action."+property+"."+variant+"."+state;};var getProps$1=function getProps(_ref2){var buttonTypographyTokens=_ref2.buttonTypographyTokens,children=_ref2.children,isDisabled=_ref2.isDisabled,size=_ref2.size,theme=_ref2.theme,variant=_ref2.variant,intent=_ref2.intent,contrast=_ref2.contrast,hasIcon=_ref2.hasIcon;var isIconOnly=hasIcon&&(!children||(children==null?void 0:children.trim().length)===0);var props={iconSize:isIconOnly?buttonIconOnlySizeToIconSizeMap[size]:buttonSizeToIconSizeMap[size],spinnerSize:buttonSizeToSpinnerSizeMap[size],fontSize:buttonTypographyTokens.fonts.size[size],lineHeight:buttonTypographyTokens.lineHeights[size],minHeight:makeSize(minHeight$1[size]),iconPadding:hasIcon&&children!=null&&children.trim()?"spacing."+textPadding[size]:undefined,iconColor:getColorToken$1({property:'icon',variant:variant,contrast:contrast,intent:intent,state:'default'}),textColor:getColorToken$1({property:'text',variant:variant,contrast:contrast,intent:intent,state:'default'}),buttonPaddingTop:isIconOnly?makeSpace(theme.spacing[buttonIconOnlyPadding[size].top]):makeSpace(theme.spacing[buttonPadding[size].top]),buttonPaddingBottom:isIconOnly?makeSpace(theme.spacing[buttonIconOnlyPadding[size].bottom]):makeSpace(theme.spacing[buttonPadding[size].bottom]),buttonPaddingLeft:isIconOnly?makeSpace(theme.spacing[buttonIconOnlyPadding[size].left]):makeSpace(theme.spacing[buttonPadding[size].left]),buttonPaddingRight:isIconOnly?makeSpace(theme.spacing[buttonIconOnlyPadding[size].right]):makeSpace(theme.spacing[buttonPadding[size].right]),text:size==='xsmall'?children==null?void 0:children.trim().toUpperCase():children==null?void 0:children.trim(),defaultBackgroundColor:get_1(theme.colors,getColorToken$1({property:'background',variant:variant,contrast:contrast,intent:intent,state:'default'})),defaultBorderColor:get_1(theme.colors,getColorToken$1({property:'border',variant:variant,contrast:contrast,intent:intent,state:'default'})),hoverBackgroundColor:get_1(theme.colors,getColorToken$1({property:'background',variant:variant,contrast:contrast,intent:intent,state:'hover'})),hoverBorderColor:get_1(theme.colors,getColorToken$1({property:'border',variant:variant,contrast:contrast,intent:intent,state:'hover'})),activeBackgroundColor:get_1(theme.colors,getColorToken$1({property:'background',variant:variant,contrast:contrast,intent:intent,state:'active'})),activeBorderColor:get_1(theme.colors,getColorToken$1({property:'border',variant:variant,contrast:contrast,intent:intent,state:'active'})),focusBackgroundColor:get_1(theme.colors,getColorToken$1({property:'background',variant:variant,contrast:contrast,intent:intent,state:'focus'})),focusBorderColor:get_1(theme.colors,getColorToken$1({property:'border',variant:variant,contrast:contrast,intent:intent,state:'focus'})),focusRingColor:get_1(theme.colors,'brand.primary.400'),borderWidth:makeBorderSize(theme.border.width.thin),borderRadius:makeBorderSize(theme.border.radius.small),motionDuration:'duration.xquick',motionEasing:'easing.standard.effective'};if(isDisabled){var disabledBackgroundColor=get_1(theme.colors,getColorToken$1({property:'background',variant:variant,contrast:contrast,intent:intent,state:'disabled'}));var disabledBorderColor=get_1(theme.colors,getColorToken$1({property:'border',variant:variant,contrast:contrast,intent:intent,state:'disabled'}));props.iconColor=getColorToken$1({property:'icon',variant:variant,contrast:contrast,intent:intent,state:'disabled'});props.textColor=getColorToken$1({property:'text',variant:variant,contrast:contrast,intent:intent,state:'disabled'});props.defaultBackgroundColor=disabledBackgroundColor;props.defaultBorderColor=disabledBorderColor;props.hoverBackgroundColor=disabledBackgroundColor;props.hoverBorderColor=disabledBorderColor;props.activeBackgroundColor=disabledBackgroundColor;props.activeBorderColor=disabledBorderColor;props.focusBackgroundColor=disabledBackgroundColor;props.focusBorderColor=disabledBorderColor;}return props;};var ButtonContent=styled(Box)(function(_ref3){var isHidden=_ref3.isHidden;return {opacity:isHidden?0:1};});var BaseButton=function BaseButton(_ref4){var _ref4$variant=_ref4.variant,variant=_ref4$variant===void 0?'primary':_ref4$variant,intent=_ref4.intent,_ref4$contrast=_ref4.contrast,contrast=_ref4$contrast===void 0?'low':_ref4$contrast,_ref4$size=_ref4.size,size=_ref4$size===void 0?'medium':_ref4$size,Icon=_ref4.icon,_ref4$iconPosition=_ref4.iconPosition,iconPosition=_ref4$iconPosition===void 0?'left':_ref4$iconPosition,_ref4$isDisabled=_ref4.isDisabled,isDisabled=_ref4$isDisabled===void 0?false:_ref4$isDisabled,_ref4$isFullWidth=_ref4.isFullWidth,isFullWidth=_ref4$isFullWidth===void 0?false:_ref4$isFullWidth,_ref4$isLoading=_ref4.isLoading,isLoading=_ref4$isLoading===void 0?false:_ref4$isLoading,onClick=_ref4.onClick,_ref4$type=_ref4.type,type=_ref4$type===void 0?'button':_ref4$type,children=_ref4.children,accessibilityLabel=_ref4.accessibilityLabel;var disabled=isLoading||isDisabled;var _useTheme=useTheme(),theme=_useTheme.theme;if(!Icon&&!(children!=null&&children.trim())){throw new Error("[Blade: BaseButton]: At least one of icon or text is required to render a button.");}var prevLoading=usePrevious(isLoading);useEffect(function(){if(isLoading)announce('Started loading');if(!isLoading&&prevLoading)announce('Stopped loading');},[isLoading,prevLoading]);var _getProps=getProps$1({buttonTypographyTokens:typography,children:children,isDisabled:disabled,size:size,variant:variant,theme:theme,intent:intent,contrast:contrast,hasIcon:Boolean(Icon)}),activeBorderColor=_getProps.activeBorderColor,activeBackgroundColor=_getProps.activeBackgroundColor,defaultBorderColor=_getProps.defaultBorderColor,defaultBackgroundColor=_getProps.defaultBackgroundColor,minHeight=_getProps.minHeight,buttonPaddingTop=_getProps.buttonPaddingTop,buttonPaddingBottom=_getProps.buttonPaddingBottom,buttonPaddingLeft=_getProps.buttonPaddingLeft,buttonPaddingRight=_getProps.buttonPaddingRight,focusBorderColor=_getProps.focusBorderColor,focusBackgroundColor=_getProps.focusBackgroundColor,focusRingColor=_getProps.focusRingColor,fontSize=_getProps.fontSize,hoverBorderColor=_getProps.hoverBorderColor,hoverBackgroundColor=_getProps.hoverBackgroundColor,iconColor=_getProps.iconColor,iconSize=_getProps.iconSize,iconPadding=_getProps.iconPadding,spinnerSize=_getProps.spinnerSize,lineHeight=_getProps.lineHeight,text=_getProps.text,textColor=_getProps.textColor,borderWidth=_getProps.borderWidth,borderRadius=_getProps.borderRadius,motionDuration=_getProps.motionDuration,motionEasing=_getProps.motionEasing;return jsxs(StyledBaseButton,{accessibilityProps:_extends({},makeAccessible({role:'button',label:accessibilityLabel})),isLoading:isLoading,disabled:disabled,activeBorderColor:activeBorderColor,activeBackgroundColor:activeBackgroundColor,defaultBorderColor:defaultBorderColor,minHeight:minHeight,buttonPaddingTop:buttonPaddingTop,buttonPaddingBottom:buttonPaddingBottom,buttonPaddingLeft:buttonPaddingLeft,buttonPaddingRight:buttonPaddingRight,defaultBackgroundColor:defaultBackgroundColor,focusBorderColor:focusBorderColor,focusBackgroundColor:focusBackgroundColor,focusRingColor:focusRingColor,hoverBorderColor:hoverBorderColor,hoverBackgroundColor:hoverBackgroundColor,isFullWidth:isFullWidth,onClick:onClick,type:type,borderWidth:borderWidth,borderRadius:borderRadius,motionDuration:motionDuration,motionEasing:motionEasing,children:[isLoading?jsx(Box,{display:"flex",justifyContent:"center",alignItems:"center",position:"absolute",top:0,left:0,bottom:0,right:0,children:jsx(BaseSpinner,{accessibilityLabel:"Loading",size:spinnerSize,intent:intent,contrast:contrast})}):null,jsxs(ButtonContent,{display:"flex",flexDirection:"row",alignItems:"center",justifyContent:"center",flex:1,isHidden:isLoading,children:[Icon&&iconPosition=='left'?jsx(Box,{paddingRight:iconPadding,display:"flex",justifyContent:"center",alignItems:"center",children:jsx(Icon,{size:iconSize,color:iconColor})}):null,text?jsx(BaseText,{lineHeight:lineHeight,fontSize:fontSize,fontWeight:"bold",textAlign:"center",color:textColor,children:text}):null,Icon&&iconPosition=='right'?jsx(Box,{paddingLeft:iconPadding,display:"flex",justifyContent:"center",alignItems:"center",children:jsx(Icon,{size:iconSize,color:iconColor})}):null]})]});};
|
|
3347
3347
|
|
|
@@ -3353,7 +3353,7 @@ var useInteraction=function useInteraction(){var _useState=useState('default'),_
|
|
|
3353
3353
|
|
|
3354
3354
|
var _excluded$2=["currentInteraction","setCurrentInteraction"];var getColorToken=function getColorToken(_ref){var variant=_ref.variant,intent=_ref.intent,contrast=_ref.contrast,element=_ref.element,currentInteraction=_ref.currentInteraction,isDisabled=_ref.isDisabled,isVisited=_ref.isVisited;var state=currentInteraction;if(isDisabled&&variant=='button'){state='disabled';}if(isVisited&&variant=='anchor'&&!intent){state='visited';}if(intent&&state!=='visited'){return "feedback."+intent+".action."+element+".link."+state+"."+contrast+"Contrast";}return "action."+element+".link."+state;};var getProps=function getProps(_ref2){var theme=_ref2.theme,variant=_ref2.variant,currentInteraction=_ref2.currentInteraction,children=_ref2.children,isDisabled=_ref2.isDisabled,intent=_ref2.intent,contrast=_ref2.contrast,isVisited=_ref2.isVisited,target=_ref2.target,size=_ref2.size;var isButton=variant==='button';var props={as:isButton?'button':'a',textDecorationLine:!isButton&¤tInteraction!=='default'?'underline':'none',iconColor:getColorToken({variant:variant,intent:intent,contrast:contrast,element:'icon',currentInteraction:currentInteraction,isDisabled:isDisabled,isVisited:isVisited}),fontSize:size==='medium'?100:75,iconSize:size,iconPadding:children!=null&&children.trim()?'spacing.2':'spacing.0',textColor:getColorToken({variant:variant,intent:intent,contrast:contrast,element:'text',currentInteraction:currentInteraction,isDisabled:isDisabled,isVisited:isVisited}),focusRingColor:get_1(theme.colors,'brand.primary.400'),motionDuration:'duration.2xquick',motionEasing:'easing.standard.effective',cursor:isButton&&isDisabled?'not-allowed':'pointer',disabled:isButton&&isDisabled,role:isButton?'button':'link',defaultRel:target&&target==='_blank'?'noreferrer noopener':undefined,type:isButton?'button':undefined};return props;};var BaseLink=function BaseLink(_ref3){var children=_ref3.children,Icon=_ref3.icon,_ref3$iconPosition=_ref3.iconPosition,iconPosition=_ref3$iconPosition===void 0?'left':_ref3$iconPosition,_ref3$isDisabled=_ref3.isDisabled,isDisabled=_ref3$isDisabled===void 0?false:_ref3$isDisabled,onClick=_ref3.onClick,_ref3$variant=_ref3.variant,variant=_ref3$variant===void 0?'anchor':_ref3$variant,href=_ref3.href,target=_ref3.target,rel=_ref3.rel,intent=_ref3.intent,_ref3$contrast=_ref3.contrast,contrast=_ref3$contrast===void 0?'low':_ref3$contrast,accessibilityLabel=_ref3.accessibilityLabel,className=_ref3.className,style=_ref3.style,_ref3$size=_ref3.size,size=_ref3$size===void 0?'medium':_ref3$size;var _useState=useState(false),_useState2=_slicedToArray(_useState,2),isVisited=_useState2[0],setIsVisited=_useState2[1];var _useInteraction=useInteraction(),currentInteraction=_useInteraction.currentInteraction,setCurrentInteraction=_useInteraction.setCurrentInteraction,syntheticEvents=_objectWithoutProperties(_useInteraction,_excluded$2);var _useTheme=useTheme(),theme=_useTheme.theme;if(!Icon&&!(children!=null&&children.trim())){throw new Error("[Blade: BaseLink]: At least one of icon or text is required to render a link.");}var _getProps=getProps({theme:theme,variant:variant,currentInteraction:currentInteraction,children:children,isDisabled:isDisabled,intent:intent,contrast:contrast,isVisited:isVisited,target:target,size:size}),as=_getProps.as,textDecorationLine=_getProps.textDecorationLine,iconColor=_getProps.iconColor,iconPadding=_getProps.iconPadding,iconSize=_getProps.iconSize,fontSize=_getProps.fontSize,textColor=_getProps.textColor,focusRingColor=_getProps.focusRingColor,motionDuration=_getProps.motionDuration,motionEasing=_getProps.motionEasing,cursor=_getProps.cursor,disabled=_getProps.disabled,role=_getProps.role,defaultRel=_getProps.defaultRel,type=_getProps.type;var handleOnClick=function handleOnClick(event){if(!isVisited&&!intent&&variant==='anchor'){setIsVisited(true);}if(onClick){onClick(event);}};return jsx(StyledLink,_extends({},syntheticEvents,{accessibilityProps:_extends({},makeAccessible({role:role,label:accessibilityLabel,disabled:disabled})),variant:variant,as:as,href:href,target:target,rel:rel!=null?rel:defaultRel,onClick:handleOnClick,disabled:disabled,type:type,cursor:cursor,focusRingColor:focusRingColor,motionDuration:motionDuration,motionEasing:motionEasing,setCurrentInteraction:setCurrentInteraction,className:className,style:style,children:jsxs(Box,{display:"flex",flexDirection:"row",className:"content-container",alignItems:"center",children:[Icon&&iconPosition=='left'?jsx(Box,{paddingRight:iconPadding,display:"flex",alignItems:"center",children:jsx(Icon,{color:iconColor,size:iconSize})}):null,jsx(BaseText,{textDecorationLine:textDecorationLine,color:textColor,fontSize:fontSize,textAlign:"center",fontWeight:"bold",children:children}),Icon&&iconPosition=='right'?jsx(Box,{paddingLeft:iconPadding,display:"flex",alignItems:"center",children:jsx(Icon,{color:iconColor,size:iconSize})}):null]})}));};
|
|
3355
3355
|
|
|
3356
|
-
var isReactNative$3=getPlatformType()==='react-native';var SecondaryActionWrapper=isReactNative$3?Box:Fragment;var CloseButtonWrapper=isReactNative$3?Box:Fragment;var intentIconMap={positive:CheckCircleIcon,negative:AlertTriangleIcon,information:AlertTriangleIcon,notice:AlertTriangleIcon$1};var Alert=function Alert(_ref){var description=_ref.description,title=_ref.title,_ref$isDismissable=_ref.isDismissable,isDismissable=_ref$isDismissable===void 0?true:_ref$isDismissable,onDismiss=_ref.onDismiss,_ref$contrast=_ref.contrast,contrast=_ref$contrast===void 0?'low':_ref$contrast,_ref$isFullWidth=_ref.isFullWidth,isFullWidth=_ref$isFullWidth===void 0?false:_ref$isFullWidth,_ref$intent=_ref.intent,intent=_ref$intent===void 0?'information':_ref$intent,_ref$isBorderless=_ref.isBorderless,isBorderless=_ref$isBorderless===void 0?false:_ref$isBorderless,actions=_ref.actions;var _useState=useState(true),_useState2=_slicedToArray(_useState,2),isVisible=_useState2[0],setIsVisible=_useState2[1];var contrastType=contrast+"Contrast";var Icon=intentIconMap[intent];var icon=jsx(Icon,{color:"feedback.icon."+intent+"."+contrastType,size:"large"});var _title=title?jsx(Box,{marginBottom:"spacing.2",children:jsx(Heading,{size:"small",contrast:contrast,children:title})}):null;var _description=jsx(Text,{contrast:contrast,children:description});var primaryAction=actions!=null&&actions.primary?jsx(Box,{marginRight:"spacing.5",display:isReactNative$3?'flex':'inline-flex',children:jsx(BaseButton,{onClick:actions.primary.onClick,intent:intent,contrast:contrast,children:actions.primary.text})}):null;var secondaryActionParams=actions!=null&&actions.secondary?{onClick:actions.secondary.onClick}:null;if(actions!=null&&actions.secondary&&secondaryActionParams&&'href'in actions.secondary){secondaryActionParams.href=actions.secondary.href;secondaryActionParams.target=actions.secondary.target;secondaryActionParams.rel=actions.secondary.rel;}var secondaryAction=actions!=null&&actions.secondary?jsx(SecondaryActionWrapper,{children:jsx(BaseLink,_extends({contrast:contrast,intent:intent},secondaryActionParams,{children:actions.secondary.text}))}):null;var _actions=primaryAction||secondaryAction?jsxs(Box,{marginTop:"spacing.4",flexDirection:"row",alignItems:"center",children:[primaryAction,secondaryAction]}):null;var onClickDismiss=function onClickDismiss(){if(onDismiss){onDismiss();}setIsVisible(false);};var closeButton=isDismissable?jsx(CloseButtonWrapper,{children:jsx(IconButton,{accessibilityLabel:"Dismiss alert",onClick:onClickDismiss,contrast:contrast,size:"large",icon:CloseIcon})}):null;var a11yProps=makeAccessible(_extends({role:isReactNative$3||intent==='negative'||intent==='notice'?'alert':'status'},intent==='notice'&&{liveRegion:'polite'}));if(!isVisible){return null;}return jsxs(StyledAlert,_extends({intent:intent,contrastType:contrastType,isFullWidth:isFullWidth,isBorderless:isBorderless},a11yProps,{children:[icon,jsxs(Box,{flex:1,paddingLeft:"spacing.4",paddingRight:"spacing.2",children:[_title,_description,_actions]}),closeButton]}));};
|
|
3356
|
+
var isReactNative$3=getPlatformType()==='react-native';var SecondaryActionWrapper=isReactNative$3?Box:Fragment;var CloseButtonWrapper=isReactNative$3?Box:Fragment;var intentIconMap={positive:CheckCircleIcon,negative:AlertTriangleIcon,information:AlertTriangleIcon,notice:AlertTriangleIcon$1};var Alert=function Alert(_ref){var description=_ref.description,title=_ref.title,_ref$isDismissable=_ref.isDismissable,isDismissable=_ref$isDismissable===void 0?true:_ref$isDismissable,onDismiss=_ref.onDismiss,_ref$contrast=_ref.contrast,contrast=_ref$contrast===void 0?'low':_ref$contrast,_ref$isFullWidth=_ref.isFullWidth,isFullWidth=_ref$isFullWidth===void 0?false:_ref$isFullWidth,_ref$intent=_ref.intent,intent=_ref$intent===void 0?'information':_ref$intent,_ref$isBorderless=_ref.isBorderless,isBorderless=_ref$isBorderless===void 0?false:_ref$isBorderless,actions=_ref.actions;if(!(actions!=null&&actions.primary)&&actions!=null&&actions.secondary){throw new Error('[Blade: Alert]: SecondaryAction is allowed only when PrimaryAction is defined.');}var _useState=useState(true),_useState2=_slicedToArray(_useState,2),isVisible=_useState2[0],setIsVisible=_useState2[1];var contrastType=contrast+"Contrast";var Icon=intentIconMap[intent];var icon=jsx(Icon,{color:"feedback.icon."+intent+"."+contrastType,size:"large"});var _title=title?jsx(Box,{marginBottom:"spacing.2",children:jsx(Heading,{size:"small",contrast:contrast,children:title})}):null;var _description=jsx(Text,{contrast:contrast,children:description});var primaryAction=actions!=null&&actions.primary?jsx(Box,{marginRight:"spacing.5",display:isReactNative$3?'flex':'inline-flex',children:jsx(BaseButton,{onClick:actions.primary.onClick,intent:intent,contrast:contrast,children:actions.primary.text})}):null;var secondaryActionParams=actions!=null&&actions.secondary?{onClick:actions.secondary.onClick}:null;if(actions!=null&&actions.secondary&&secondaryActionParams&&'href'in actions.secondary){secondaryActionParams.href=actions.secondary.href;secondaryActionParams.target=actions.secondary.target;secondaryActionParams.rel=actions.secondary.rel;}var secondaryAction=actions!=null&&actions.secondary?jsx(SecondaryActionWrapper,{children:jsx(BaseLink,_extends({contrast:contrast,intent:intent},secondaryActionParams,{children:actions.secondary.text}))}):null;var _actions=primaryAction||secondaryAction?jsxs(Box,{marginTop:"spacing.4",flexDirection:"row",alignItems:"center",children:[primaryAction,secondaryAction]}):null;var onClickDismiss=function onClickDismiss(){if(onDismiss){onDismiss();}setIsVisible(false);};var closeButton=isDismissable?jsx(CloseButtonWrapper,{children:jsx(IconButton,{accessibilityLabel:"Dismiss alert",onClick:onClickDismiss,contrast:contrast,size:"large",icon:CloseIcon})}):null;var a11yProps=makeAccessible(_extends({role:isReactNative$3||intent==='negative'||intent==='notice'?'alert':'status'},intent==='notice'&&{liveRegion:'polite'}));if(!isVisible){return null;}return jsxs(StyledAlert,_extends({intent:intent,contrastType:contrastType,isFullWidth:isFullWidth,isBorderless:isBorderless},a11yProps,{children:[icon,jsxs(Box,{flex:1,paddingLeft:"spacing.4",paddingRight:"spacing.2",children:[_title,_description,_actions]}),closeButton]}));};
|
|
3357
3357
|
|
|
3358
3358
|
var minHeight={small:20,medium:24};var maxWidth={onMobile:100,onDesktop:120};
|
|
3359
3359
|
|
|
@@ -3365,6 +3365,8 @@ var isFeedbackVariant=function isFeedbackVariant(variant){var feedbackVariants=[
|
|
|
3365
3365
|
|
|
3366
3366
|
var Button=function Button(_ref){var children=_ref.children,icon=_ref.icon,_ref$iconPosition=_ref.iconPosition,iconPosition=_ref$iconPosition===void 0?'left':_ref$iconPosition,_ref$isDisabled=_ref.isDisabled,isDisabled=_ref$isDisabled===void 0?false:_ref$isDisabled,_ref$isFullWidth=_ref.isFullWidth,isFullWidth=_ref$isFullWidth===void 0?false:_ref$isFullWidth,_ref$isLoading=_ref.isLoading,isLoading=_ref$isLoading===void 0?false:_ref$isLoading,onClick=_ref.onClick,_ref$size=_ref.size,size=_ref$size===void 0?'medium':_ref$size,_ref$type=_ref.type,type=_ref$type===void 0?'button':_ref$type,_ref$variant=_ref.variant,variant=_ref$variant===void 0?'primary':_ref$variant,accessibilityLabel=_ref.accessibilityLabel;return jsx(BaseButton,_extends({},icon?{icon:icon,children:children}:{children:children},{accessibilityLabel:accessibilityLabel,iconPosition:iconPosition,isDisabled:isDisabled,isFullWidth:isFullWidth,onClick:onClick,size:size,type:type,variant:variant,isLoading:isLoading}));};
|
|
3367
3367
|
|
|
3368
|
+
var Counter=function Counter(_ref){var value=_ref.value,max=_ref.max,_ref$intent=_ref.intent,intent=_ref$intent===void 0?'neutral':_ref$intent,_ref$contrast=_ref.contrast,contrast=_ref$contrast===void 0?'low':_ref$contrast,_ref$size=_ref.size,size=_ref$size===void 0?'medium':_ref$size;var content=""+value;if(max&&value>max){content=max+"+";}return jsx(Badge,{size:size,variant:intent,contrast:contrast,children:content});};
|
|
3369
|
+
|
|
3368
3370
|
/**
|
|
3369
3371
|
* Checks if `value` is `undefined`.
|
|
3370
3372
|
*
|
|
@@ -3391,7 +3393,7 @@ var isUndefined_1 = isUndefined;
|
|
|
3391
3393
|
|
|
3392
3394
|
var CheckboxGroupContext=React__default.createContext({});var CheckboxGroupProvider=CheckboxGroupContext.Provider;var useCheckboxGroupContext=function useCheckboxGroupContext(){var context=React__default.useContext(CheckboxGroupContext);return context;};
|
|
3393
3395
|
|
|
3394
|
-
var checkboxSizes={group:{gap:{small:{mobile:'spacing.2',desktop:'spacing.0'},medium:{mobile:'spacing.3',desktop:'spacing.2'}}},icon:{small:{width:12,height:12},medium:{width:16,height:16}}};var checkboxIconColors={variants:{default:{border:{checked:'colors.brand.primary.500',unchecked:'colors.brand.gray.500'},background:{checked:'colors.brand.primary.500',unchecked:'transparent'}},disabled:{border:{checked:'transparent',unchecked:'colors.brand.gray.a100'},background:{checked:'colors.brand.gray.a100',unchecked:'transparent'}},negative:{border:{checked:'colors.feedback.border.negative.highContrast',unchecked:'colors.feedback.border.negative.highContrast'},background:{checked:'colors.feedback.background.negative.highContrast',unchecked:'colors.feedback.background.negative.lowContrast'}}}};
|
|
3396
|
+
var checkboxSizes={group:{gap:{small:{mobile:'spacing.2',desktop:'spacing.0'},medium:{mobile:'spacing.3',desktop:'spacing.2'}}},icon:{small:{width:12,height:12},medium:{width:16,height:16}}};var checkboxIconColors={variants:{default:{border:{checked:'colors.brand.primary.500',unchecked:'colors.brand.gray.500.lowContrast'},background:{checked:'colors.brand.primary.500',unchecked:'transparent'}},disabled:{border:{checked:'transparent',unchecked:'colors.brand.gray.a100.lowContrast'},background:{checked:'colors.brand.gray.a100.lowContrast',unchecked:'transparent'}},negative:{border:{checked:'colors.feedback.border.negative.highContrast',unchecked:'colors.feedback.border.negative.highContrast'},background:{checked:'colors.feedback.background.negative.highContrast',unchecked:'colors.feedback.background.negative.lowContrast'}}}};
|
|
3395
3397
|
|
|
3396
3398
|
var getCheckboxIconWrapperStyles=function getCheckboxIconWrapperStyles(_ref){var theme=_ref.theme,isChecked=_ref.isChecked,isDisabled=_ref.isDisabled,isNegative=_ref.isNegative,size=_ref.size;var variant='default';if(isDisabled)variant='disabled';if(isNegative)variant='negative';var checked=isChecked?'checked':'unchecked';var background=checkboxIconColors.variants[variant].background[checked];var border=checkboxIconColors.variants[variant].border[checked];var backgroundColor=background==='transparent'?background:get_1(theme,background);var borderColor=border==='transparent'?border:get_1(theme,border);return {display:'flex',alignItems:'center',justifyContent:'center',width:makeSpace(checkboxSizes.icon[size].width),height:makeSpace(checkboxSizes.icon[size].height),borderWidth:makeBorderSize(theme.border.width.thick),borderStyle:'solid',margin:makeSpace(theme.spacing[1]),borderRadius:makeSize(theme.border.radius.small),backgroundColor:backgroundColor,borderColor:borderColor};};
|
|
3397
3399
|
|
|
@@ -3399,7 +3401,7 @@ var CheckboxIconWrapper=styled.View(function(props){return getCheckboxIconWrappe
|
|
|
3399
3401
|
|
|
3400
3402
|
var StyledFade$1=styled(Animated.View)(function(_ref){var styles=_ref.styles;return _extends({},styles);});var Fade$1=function Fade(_ref2){var children=_ref2.children,show=_ref2.show,styles=_ref2.styles;var _useTheme=useTheme(),theme=_useTheme.theme;var fadeInEasing=theme.motion.easing.entrance.effective;var fadeOutEasing=theme.motion.easing.exit.effective;var fadeIn=new Keyframe({from:{transform:[{scale:0.6}],opacity:0,easing:fadeInEasing},to:{transform:[{scale:1}],opacity:1,easing:fadeInEasing}}).duration(theme.motion.duration.quick);var fadeOut=new Keyframe({from:{transform:[{scale:1}],opacity:1,easing:fadeOutEasing},to:{transform:[{scale:0.6}],opacity:0,easing:fadeOutEasing}}).duration(theme.motion.duration.quick);return show?jsx(StyledFade$1,{styles:styles,entering:fadeIn,exiting:fadeOut,children:children}):null;};
|
|
3401
3403
|
|
|
3402
|
-
var svgSize={small:{width:8,height:8},medium:{width:12,height:12}};var CheckedIcon$1=function CheckedIcon(_ref){var color=_ref.color,size=_ref.size;var width=makeSpace(svgSize[size].width);var height=makeSpace(svgSize[size].height);return jsx(Svg,{width:width,height:height,viewBox:"0 0 8 8",fill:"none",children:jsx(Path,{fillRule:"evenodd",clipRule:"evenodd",d:"M6.90237 1.76413C7.03254 1.89431 7.03254 2.10536 6.90237 2.23554L3.2357 5.90221C3.10553 6.03238 2.89447 6.03238 2.7643 5.90221L1.09763 4.23554C0.967456 4.10536 0.967456 3.89431 1.09763 3.76414C1.22781 3.63396 1.43886 3.63396 1.56904 3.76414L3 5.1951L6.43096 1.76413C6.56114 1.63396 6.77219 1.63396 6.90237 1.76413Z",fill:color,stroke:"white",strokeWidth:"0.5",strokeLinecap:"round",strokeLinejoin:"round"})});};var IndeterminateIcon=function IndeterminateIcon(_ref2){var color=_ref2.color,size=_ref2.size;var width=svgSize[size].width+"px";var height=svgSize[size].height+"px";return jsx(Svg,{width:width,height:height,viewBox:"0 0 8 8",fill:"none",children:jsx(Path,{fillRule:"evenodd",clipRule:"evenodd",d:"M1.3335 3.99984C1.3335 3.81574 1.48273 3.6665 1.66683 3.6665H6.3335C6.51759 3.6665 6.66683 3.81574 6.66683 3.99984C6.66683 4.18393 6.51759 4.33317 6.3335 4.33317H1.66683C1.48273 4.33317 1.3335 4.18393 1.3335 3.99984Z",fill:color,stroke:"white",strokeWidth:"0.5",strokeLinecap:"round",strokeLinejoin:"round"})});};var CheckboxIcon=function CheckboxIcon(_ref3){var isChecked=_ref3.isChecked,isIndeterminate=_ref3.isIndeterminate,isDisabled=_ref3.isDisabled,isNegative=_ref3.isNegative,size=_ref3.size;var _useTheme=useTheme(),theme=_useTheme.theme;var defaultIconColor=get_1(theme,'colors.brand.gray.200');var disabledIconColor=get_1(theme,'colors.brand.gray.500');var iconColor=isDisabled?disabledIconColor:defaultIconColor;return jsxs(CheckboxIconWrapper,{size:size,isIndeterminate:isIndeterminate,isDisabled:isDisabled,isNegative:isNegative,isChecked:!!(isChecked||isIndeterminate),children:[jsx(Fade$1,{show:isIndeterminate,styles:{position:'absolute',display:'flex'},children:jsx(IndeterminateIcon,{size:size,color:iconColor})}),jsx(Fade$1,{show:Boolean(isChecked)&&!isIndeterminate,styles:{position:'absolute',display:'flex'},children:isChecked?jsx(CheckedIcon$1,{size:size,color:iconColor}):null})]});};
|
|
3404
|
+
var svgSize={small:{width:8,height:8},medium:{width:12,height:12}};var CheckedIcon$1=function CheckedIcon(_ref){var color=_ref.color,size=_ref.size;var width=makeSpace(svgSize[size].width);var height=makeSpace(svgSize[size].height);return jsx(Svg,{width:width,height:height,viewBox:"0 0 8 8",fill:"none",children:jsx(Path,{fillRule:"evenodd",clipRule:"evenodd",d:"M6.90237 1.76413C7.03254 1.89431 7.03254 2.10536 6.90237 2.23554L3.2357 5.90221C3.10553 6.03238 2.89447 6.03238 2.7643 5.90221L1.09763 4.23554C0.967456 4.10536 0.967456 3.89431 1.09763 3.76414C1.22781 3.63396 1.43886 3.63396 1.56904 3.76414L3 5.1951L6.43096 1.76413C6.56114 1.63396 6.77219 1.63396 6.90237 1.76413Z",fill:color,stroke:"white",strokeWidth:"0.5",strokeLinecap:"round",strokeLinejoin:"round"})});};var IndeterminateIcon=function IndeterminateIcon(_ref2){var color=_ref2.color,size=_ref2.size;var width=svgSize[size].width+"px";var height=svgSize[size].height+"px";return jsx(Svg,{width:width,height:height,viewBox:"0 0 8 8",fill:"none",children:jsx(Path,{fillRule:"evenodd",clipRule:"evenodd",d:"M1.3335 3.99984C1.3335 3.81574 1.48273 3.6665 1.66683 3.6665H6.3335C6.51759 3.6665 6.66683 3.81574 6.66683 3.99984C6.66683 4.18393 6.51759 4.33317 6.3335 4.33317H1.66683C1.48273 4.33317 1.3335 4.18393 1.3335 3.99984Z",fill:color,stroke:"white",strokeWidth:"0.5",strokeLinecap:"round",strokeLinejoin:"round"})});};var CheckboxIcon=function CheckboxIcon(_ref3){var isChecked=_ref3.isChecked,isIndeterminate=_ref3.isIndeterminate,isDisabled=_ref3.isDisabled,isNegative=_ref3.isNegative,size=_ref3.size;var _useTheme=useTheme(),theme=_useTheme.theme;var defaultIconColor=get_1(theme,'colors.brand.gray.200.lowContrast');var disabledIconColor=get_1(theme,'colors.brand.gray.500.lowContrast');var iconColor=isDisabled?disabledIconColor:defaultIconColor;return jsxs(CheckboxIconWrapper,{size:size,isIndeterminate:isIndeterminate,isDisabled:isDisabled,isNegative:isNegative,isChecked:!!(isChecked||isIndeterminate),children:[jsx(Fade$1,{show:isIndeterminate,styles:{position:'absolute',display:'flex'},children:jsx(IndeterminateIcon,{size:size,color:iconColor})}),jsx(Fade$1,{show:Boolean(isChecked)&&!isIndeterminate,styles:{position:'absolute',display:'flex'},children:isChecked?jsx(CheckedIcon$1,{size:size,color:iconColor}):null})]});};
|
|
3403
3405
|
|
|
3404
3406
|
function useControllableState(props){var valueProp=props.value,defaultValue=props.defaultValue,onChange=props.onChange;var _React$useState=React.useState(defaultValue),_React$useState2=_slicedToArray(_React$useState,2),valueState=_React$useState2[0],setValue=_React$useState2[1];var _React$useRef=React.useRef(valueProp!==undefined),isControlled=_React$useRef.current;var value=isControlled&&typeof valueProp!=='undefined'?valueProp:valueState;var updateValue=React.useCallback(function(next){var nextValue=next(value);if(!isControlled)setValue(nextValue);onChange==null?void 0:onChange(nextValue);},[onChange,value]);return [value,updateValue];}
|
|
3405
3407
|
|
|
@@ -3441,7 +3443,7 @@ var getVisualContainerStyles=function getVisualContainerStyles(){return {display
|
|
|
3441
3443
|
|
|
3442
3444
|
var getTextStyles=function getTextStyles(_ref){var variant=_ref.variant,type=_ref.type,weight=_ref.weight,size=_ref.size,contrast=_ref.contrast,theme=_ref.theme;return getBaseTextStyles(_extends({},getTextProps({variant:variant,type:type,weight:weight,size:size,contrast:contrast}),{theme:theme}));};
|
|
3443
3445
|
|
|
3444
|
-
var getInputBackgroundAndBorderStyles=function getInputBackgroundAndBorderStyles(_ref){var theme=_ref.theme,isHovered=_ref.isHovered,isFocused=_ref.isFocused,isDisabled=_ref.isDisabled,validationState=_ref.validationState;var backgroundColor=theme.colors.brand.gray[200];var borderBottomColor=theme.colors.brand.gray[400];if(isHovered){backgroundColor=theme.colors.brand.gray[300];}if(isFocused){backgroundColor=theme.colors.brand.primary[300];}if(isDisabled){backgroundColor=theme.colors.brand.gray[200];borderBottomColor=theme.colors.brand.gray[300];}if(validationState==='error'){backgroundColor=theme.colors.feedback.background.negative.lowContrast;borderBottomColor=theme.colors.feedback.border.negative.highContrast;}else if(validationState==='success'){backgroundColor=theme.colors.feedback.background.positive.lowContrast;borderBottomColor=theme.colors.feedback.border.positive.highContrast;}return {backgroundColor:backgroundColor,borderBottomColor:borderBottomColor,borderTopLeftRadius:makeBorderSize(theme.border.radius.small),borderTopRightRadius:makeBorderSize(theme.border.radius.small),borderBottomWidth:makeBorderSize(theme.border.width.thin),borderBottomStyle:'solid'};};var getBaseInputStyles=function getBaseInputStyles(_ref2){var theme=_ref2.theme,isDisabled=_ref2.isDisabled,leadingIcon=_ref2.leadingIcon,prefix=_ref2.prefix,interactionElement=_ref2.interactionElement,suffix=_ref2.suffix,trailingIcon=_ref2.trailingIcon,textAlign=_ref2.textAlign;var _getInputVisualsToBeR=getInputVisualsToBeRendered({leadingIcon:leadingIcon,prefix:prefix,interactionElement:interactionElement,suffix:suffix,trailingIcon:trailingIcon}),hasLeadingIcon=_getInputVisualsToBeR.hasLeadingIcon,hasPrefix=_getInputVisualsToBeR.hasPrefix,hasInteractionElement=_getInputVisualsToBeR.hasInteractionElement,hasSuffix=_getInputVisualsToBeR.hasSuffix,hasTrailingIcon=_getInputVisualsToBeR.hasTrailingIcon;var isReactNative=getPlatformType()==='react-native';return _extends({},getTextStyles({size:'medium',variant:'body',type:isDisabled?'placeholder':'subtle',weight:'regular',contrast:'low',theme:theme}),{flex:1,backgroundColor:'transparent',paddingTop:makeSpace(theme.spacing[3]),paddingBottom:makeSpace(theme.spacing[3]),paddingLeft:hasLeadingIcon||hasPrefix?makeSpace(theme.spacing[3]):makeSpace(theme.spacing[4]),paddingRight:hasInteractionElement||hasSuffix||hasTrailingIcon?makeSpace(theme.spacing[3]):makeSpace(theme.spacing[4]),textAlign:textAlign,width:'100%'},isReactNative?{}:{resize:'none'});};
|
|
3446
|
+
var getInputBackgroundAndBorderStyles=function getInputBackgroundAndBorderStyles(_ref){var theme=_ref.theme,isHovered=_ref.isHovered,isFocused=_ref.isFocused,isDisabled=_ref.isDisabled,validationState=_ref.validationState;var backgroundColor=theme.colors.brand.gray[200].lowContrast;var borderBottomColor=theme.colors.brand.gray[400].lowContrast;if(isHovered){backgroundColor=theme.colors.brand.gray[300].lowContrast;}if(isFocused){backgroundColor=theme.colors.brand.primary[300];}if(isDisabled){backgroundColor=theme.colors.brand.gray[200].lowContrast;borderBottomColor=theme.colors.brand.gray[300].lowContrast;}if(validationState==='error'){backgroundColor=theme.colors.feedback.background.negative.lowContrast;borderBottomColor=theme.colors.feedback.border.negative.highContrast;}else if(validationState==='success'){backgroundColor=theme.colors.feedback.background.positive.lowContrast;borderBottomColor=theme.colors.feedback.border.positive.highContrast;}return {backgroundColor:backgroundColor,borderBottomColor:borderBottomColor,borderTopLeftRadius:makeBorderSize(theme.border.radius.small),borderTopRightRadius:makeBorderSize(theme.border.radius.small),borderBottomWidth:makeBorderSize(theme.border.width.thin),borderBottomStyle:'solid'};};var getBaseInputStyles=function getBaseInputStyles(_ref2){var theme=_ref2.theme,isDisabled=_ref2.isDisabled,leadingIcon=_ref2.leadingIcon,prefix=_ref2.prefix,interactionElement=_ref2.interactionElement,suffix=_ref2.suffix,trailingIcon=_ref2.trailingIcon,textAlign=_ref2.textAlign;var _getInputVisualsToBeR=getInputVisualsToBeRendered({leadingIcon:leadingIcon,prefix:prefix,interactionElement:interactionElement,suffix:suffix,trailingIcon:trailingIcon}),hasLeadingIcon=_getInputVisualsToBeR.hasLeadingIcon,hasPrefix=_getInputVisualsToBeR.hasPrefix,hasInteractionElement=_getInputVisualsToBeR.hasInteractionElement,hasSuffix=_getInputVisualsToBeR.hasSuffix,hasTrailingIcon=_getInputVisualsToBeR.hasTrailingIcon;var isReactNative=getPlatformType()==='react-native';return _extends({},getTextStyles({size:'medium',variant:'body',type:isDisabled?'placeholder':'subtle',weight:'regular',contrast:'low',theme:theme}),{flex:1,backgroundColor:'transparent',paddingTop:makeSpace(theme.spacing[3]),paddingBottom:makeSpace(theme.spacing[3]),paddingLeft:hasLeadingIcon||hasPrefix?makeSpace(theme.spacing[3]):makeSpace(theme.spacing[4]),paddingRight:hasInteractionElement||hasSuffix||hasTrailingIcon?makeSpace(theme.spacing[3]):makeSpace(theme.spacing[4]),textAlign:textAlign,width:'100%'},isReactNative?{}:{resize:'none'});};
|
|
3445
3447
|
|
|
3446
3448
|
var _excluded$1=["name","isRequired","isDisabled","maxCharacters","handleOnFocus","handleOnChange","handleOnBlur","handleOnInput","handleOnKeyDown","keyboardType","keyboardReturnKeyType","autoCompleteSuggestionType","accessibilityProps","currentInteraction","setCurrentInteraction","type","numberOfLines","isTextArea"];var autoCompleteSuggestionTypeAndroid={none:'off',name:'name',email:'email',username:'username',password:'password',newPassword:'password-new',oneTimeCode:'sms-otp',telephone:'tel',postalCode:'postal-code',countryName:'postal-address-country',creditCardNumber:'cc-number',creditCardCSC:'cc-csc',creditCardExpiry:'cc-exp',creditCardExpiryMonth:'cc-exp-month',creditCardExpiryYear:'cc-exp-year'};var autoCompleteSuggestionTypeIOS={none:'none',name:'name',email:'emailAddress',username:'username',password:'password',newPassword:'newPassword',oneTimeCode:'oneTimeCode',telephone:'telephoneNumber',postalCode:'postalCode',countryName:'countryName',creditCardNumber:'creditCardNumber',creditCardCSC:'none',creditCardExpiry:'none',creditCardExpiryMonth:'none',creditCardExpiryYear:'none'};var KeyboardTypeToNativeValuesMap={text:'default',search:'default',telephone:'phone-pad',email:'email-address',url:'url',decimal:'decimal-pad'};var StyledNativeBaseInput=styled.TextInput(function(props){var _props$numberOfLines;return _extends({},getBaseInputStyles({theme:props.theme,isFocused:props.isFocused,isDisabled:!props.editable,validationState:props.validationState,leadingIcon:props.leadingIcon,prefix:props.prefix,interactionElement:props.interactionElement,suffix:props.suffix,trailingIcon:props.trailingIcon}),{lineHeight:undefined,textAlignVertical:'top',height:props.isTextArea?props.theme.typography.lineHeights.xl*((_props$numberOfLines=props.numberOfLines)!=null?_props$numberOfLines:0)+"px":'36px'});});var StyledBaseInput=React__default.forwardRef(function(_ref,ref){var name=_ref.name;_ref.isRequired;var isDisabled=_ref.isDisabled,maxCharacters=_ref.maxCharacters,handleOnFocus=_ref.handleOnFocus,handleOnChange=_ref.handleOnChange,handleOnBlur=_ref.handleOnBlur,handleOnInput=_ref.handleOnInput,handleOnKeyDown=_ref.handleOnKeyDown,_ref$keyboardType=_ref.keyboardType,keyboardType=_ref$keyboardType===void 0?'text':_ref$keyboardType,keyboardReturnKeyType=_ref.keyboardReturnKeyType,autoCompleteSuggestionType=_ref.autoCompleteSuggestionType,accessibilityProps=_ref.accessibilityProps,currentInteraction=_ref.currentInteraction,setCurrentInteraction=_ref.setCurrentInteraction,type=_ref.type,numberOfLines=_ref.numberOfLines,isTextArea=_ref.isTextArea,props=_objectWithoutProperties(_ref,_excluded$1);return jsx(StyledNativeBaseInput,_extends({ref:ref,multiline:isTextArea,numberOfLines:numberOfLines,isFocused:currentInteraction==='active',editable:!isDisabled,maxLength:maxCharacters,onFocus:function onFocus(event){handleOnFocus==null?void 0:handleOnFocus({name:name,value:event==null?void 0:event.nativeEvent.text});setCurrentInteraction('active');},onBlur:function onBlur(){setCurrentInteraction('default');},onChangeText:function onChangeText(text){handleOnChange==null?void 0:handleOnChange({name:name,value:text});handleOnInput==null?void 0:handleOnInput({name:name,value:text});},onEndEditing:function onEndEditing(event){return handleOnBlur==null?void 0:handleOnBlur({name:name,value:event==null?void 0:event.nativeEvent.text});},onKeyPress:function onKeyPress(event){handleOnKeyDown==null?void 0:handleOnKeyDown({name:name,key:event==null?void 0:event.nativeEvent.key,event:event});},keyboardType:KeyboardTypeToNativeValuesMap[keyboardType],returnKeyType:keyboardReturnKeyType,autoCompleteType:autoCompleteSuggestionType?autoCompleteSuggestionTypeAndroid[autoCompleteSuggestionType]:undefined,secureTextEntry:type==='password',isTextArea:isTextArea,textContentType:autoCompleteSuggestionType?autoCompleteSuggestionTypeIOS[autoCompleteSuggestionType]:undefined},props,accessibilityProps));});StyledBaseInput.displayName='StyledBaseInput';
|
|
3447
3449
|
|
|
@@ -3465,7 +3467,7 @@ var Link=function Link(_ref){var children=_ref.children,icon=_ref.icon,_ref$icon
|
|
|
3465
3467
|
|
|
3466
3468
|
var useRadio=function useRadio(_ref){var isChecked=_ref.isChecked,defaultChecked=_ref.defaultChecked,isDisabled=_ref.isDisabled,isRequired=_ref.isRequired,hasError=_ref.hasError,onChange=_ref.onChange,name=_ref.name,value=_ref.value;var inputRef=React__default.useRef(null);var isReactNative=getPlatformType()==='react-native';if(isChecked&&defaultChecked){throw new Error("[Blade: Radio]: Do not provide both 'isChecked' and 'defaultChecked' to useRadio. Consider if you want this component to be controlled or uncontrolled.");}var _useControllableState=useControllableState({value:isChecked,defaultValue:defaultChecked!=null?defaultChecked:false}),_useControllableState2=_slicedToArray(_useControllableState,2),radioState=_useControllableState2[0],setRadioState=_useControllableState2[1];var handleOnChange=function handleOnChange(event){if(isDisabled){event.stopPropagation();event.preventDefault();return;}setRadioState(function(checked){if(checked===false){onChange==null?void 0:onChange({isChecked:true,event:event,value:value});return true;}return checked;});};var state={isChecked:radioState,setChecked:setRadioState};var idBase=useId('radio');var helpTextId=useId(idBase+"-helptext");var accessibilityProps=makeAccessible({role:'radio',required:Boolean(isRequired),hidden:!isReactNative,invalid:Boolean(hasError),disabled:Boolean(isDisabled),checked:radioState,describedBy:helpTextId});if(isReactNative){return {state:state,inputProps:_extends({onPress:handleOnChange,name:name,value:value},accessibilityProps)};}return {state:state,ids:{helpTextId:helpTextId},inputProps:_extends({ref:inputRef,onChange:handleOnChange,type:'radio',name:name,value:value,checked:radioState,disabled:isDisabled,required:isRequired},accessibilityProps)};};
|
|
3467
3469
|
|
|
3468
|
-
var radioSizes={group:{gap:{small:{mobile:'spacing.2',desktop:'spacing.0'},medium:{mobile:'spacing.3',desktop:'spacing.2'}}},icon:{small:{width:12,height:12,dotRadius:2},medium:{width:16,height:16,dotRadius:3}}};var radioIconColors={variants:{default:{dot:{checked:'colors.brand.gray.200',unchecked:'colors.brand.gray.200'},border:{checked:'colors.brand.primary.500',unchecked:'colors.brand.gray.500'},background:{checked:'colors.brand.primary.500',unchecked:'transparent'}},disabled:{dot:{checked:'colors.brand.gray.200',unchecked:'colors.brand.gray.200'},border:{checked:'transparent',unchecked:'colors.brand.gray.a100'},background:{checked:'colors.brand.gray.a100',unchecked:'transparent'}},negative:{dot:{checked:'colors.brand.gray.200',unchecked:'colors.brand.gray.200'},border:{checked:'colors.feedback.border.negative.highContrast',unchecked:'colors.feedback.border.negative.highContrast'},background:{checked:'colors.feedback.background.negative.highContrast',unchecked:'colors.feedback.background.negative.lowContrast'}}}};
|
|
3470
|
+
var radioSizes={group:{gap:{small:{mobile:'spacing.2',desktop:'spacing.0'},medium:{mobile:'spacing.3',desktop:'spacing.2'}}},icon:{small:{width:12,height:12,dotRadius:2},medium:{width:16,height:16,dotRadius:3}}};var radioIconColors={variants:{default:{dot:{checked:'colors.brand.gray.200.lowContrast',unchecked:'colors.brand.gray.200.lowContrast'},border:{checked:'colors.brand.primary.500',unchecked:'colors.brand.gray.500.lowContrast'},background:{checked:'colors.brand.primary.500',unchecked:'transparent'}},disabled:{dot:{checked:'colors.brand.gray.200.lowContrast',unchecked:'colors.brand.gray.200.lowContrast'},border:{checked:'transparent',unchecked:'colors.brand.gray.a100.lowContrast'},background:{checked:'colors.brand.gray.a100.lowContrast',unchecked:'transparent'}},negative:{dot:{checked:'colors.brand.gray.200.lowContrast',unchecked:'colors.brand.gray.200.lowContrast'},border:{checked:'colors.feedback.border.negative.highContrast',unchecked:'colors.feedback.border.negative.highContrast'},background:{checked:'colors.feedback.background.negative.highContrast',unchecked:'colors.feedback.background.negative.lowContrast'}}}};
|
|
3469
3471
|
|
|
3470
3472
|
var getRadioIconWrapperStyles=function getRadioIconWrapperStyles(_ref){var theme=_ref.theme,isChecked=_ref.isChecked,isDisabled=_ref.isDisabled,isNegative=_ref.isNegative,size=_ref.size;var isReactNative=getPlatformType()==='react-native';var variant='default';if(isDisabled)variant='disabled';if(isNegative)variant='negative';var checked=isChecked?'checked':'unchecked';var background=radioIconColors.variants[variant].background[checked];var border=radioIconColors.variants[variant].border[checked];var backgroundColor=background==='transparent'?background:get_1(theme,background);var borderColor=border==='transparent'?border:get_1(theme,border);return _extends({display:'flex',alignItems:'center',justifyContent:'center',width:makeSpace(radioSizes.icon[size].width),height:makeSpace(radioSizes.icon[size].height),borderWidth:makeBorderSize(theme.border.width.thick),borderStyle:'solid',margin:makeSpace(theme.spacing[1]),borderRadius:makeSize(theme.border.radius.max),backgroundColor:backgroundColor,borderColor:borderColor},!isReactNative&&{transitionDuration:castWebType(makeMotionTime(theme.motion.duration.xquick)),transitionTimingFunction:castWebType(theme.motion.easing.exit.attentive)});};
|
|
3471
3473
|
|
|
@@ -3489,5 +3491,5 @@ var Spinner=function Spinner(_ref){var _ref2;var label=_ref.label,labelPosition=
|
|
|
3489
3491
|
|
|
3490
3492
|
var SkipNavLink=function SkipNavLink(_props){throw new Error('[Blade: SkipNav]: SkipNavLink is not available on React Native');};var SkipNavContent=function SkipNavContent(_props){throw new Error('[Blade: SkipNav]: SkipNavContent is not available on React Native');};
|
|
3491
3493
|
|
|
3492
|
-
export { Alert, AlertTriangleIcon as AlertOctagonIcon, AlertTriangleIcon$1 as AlertTriangleIcon, ArrowDownIcon, ArrowLeftIcon, ArrowRightIcon, ArrowUpIcon, ArrowUpRightIcon, Badge, BladeProvider, Button, CheckCircleIcon, CheckIcon, Checkbox, CheckboxGroup, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, CloseIcon, Code, CreditCardIcon, DollarIcon, DownloadIcon, EditIcon, ExternalLinkIcon, EyeIcon, EyeOffIcon, Heading, HelpCircleIcon, HistoryIcon, HomeIcon, InfoIcon, Link, LinkIcon, MinusIcon, OTPInput, PasswordInput, PauseIcon, PlusIcon, Radio, RadioGroup, RefreshLeftIcon, RotateCounterClockWiseIcon, RupeeIcon, SearchIcon, SkipNavContent, SkipNavLink, Spinner, Text, TextArea, TextInput, Title, TrashIcon, TrendingDownIcon, TrendingUpIcon, VisuallyHidden, announce, clearAnnouncer, destroyAnnouncer, getTextProps, screenReaderStyles, useTheme };
|
|
3494
|
+
export { Alert, AlertTriangleIcon as AlertOctagonIcon, AlertTriangleIcon$1 as AlertTriangleIcon, ArrowDownIcon, ArrowLeftIcon, ArrowRightIcon, ArrowUpIcon, ArrowUpRightIcon, Badge, BladeProvider, Button, CheckCircleIcon, CheckIcon, Checkbox, CheckboxGroup, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, CloseIcon, Code, Counter, CreditCardIcon, DollarIcon, DownloadIcon, EditIcon, ExternalLinkIcon, EyeIcon, EyeOffIcon, Heading, HelpCircleIcon, HistoryIcon, HomeIcon, InfoIcon, Link, LinkIcon, MinusIcon, OTPInput, PasswordInput, PauseIcon, PlusIcon, Radio, RadioGroup, RefreshLeftIcon, RotateCounterClockWiseIcon, RupeeIcon, SearchIcon, SkipNavContent, SkipNavLink, Spinner, Text, TextArea, TextInput, Title, TrashIcon, TrendingDownIcon, TrendingUpIcon, VisuallyHidden, announce, clearAnnouncer, destroyAnnouncer, getTextProps, screenReaderStyles, useTheme };
|
|
3493
3495
|
//# sourceMappingURL=index.native.js.map
|