@ornikar/kitt-universal 32.3.1-canary.ddff29bdf3ffa500cf7658e5206d5069b23f4b45.0 → 32.4.0

package/dist/index-node-22.17.cjs.js

@@ -697,10 +697,6 @@ const button = {
     default: 40,
     medium: 48
   },
-  minHeight: {
-    default: 40,
-    medium: 48
-  },
   maxHeight: 48,
   icon: {
     medium: {
@@ -2154,8 +2150,8 @@ const typography = {
           allowedFontWeights: ['semibold']
         },
         'heading-l': {
-          fontSize: 38,
-          lineHeight: 44,
+          fontSize: 40,
+          lineHeight: 48,
           allowedFontWeights: ['semibold']
         },
         'heading-m': {
@@ -2164,19 +2160,14 @@ const typography = {
           allowedFontWeights: ['semibold']
         },
         'heading-s': {
-          fontSize: 24,
-          lineHeight: 28,
-          allowedFontWeights: ['semibold']
+          fontSize: 18,
+          lineHeight: 20,
+          allowedFontWeights: ['regular', 'bold']
         },
         'heading-xs': {
-          fontSize: 20,
-          lineHeight: 24,
-          allowedFontWeights: ['semibold']
-        },
-        'heading-xxs': {
           fontSize: 16,
-          lineHeight: 20,
-          allowedFontWeights: ['semibold']
+          lineHeight: 18,
+          allowedFontWeights: ['regular', 'bold']
         }
       }
     },
@@ -2243,17 +2234,17 @@ const typography = {
       configs: {
         'label-large': {
           fontSize: 16,
-          lineHeight: 20,
+          lineHeight: 24,
           allowedFontWeights: ['semibold']
         },
         'label-medium': {
           fontSize: 14,
-          lineHeight: 18,
+          lineHeight: 20,
           allowedFontWeights: ['semibold']
         },
         'label-small': {
           fontSize: 12,
-          lineHeight: 14,
+          lineHeight: 16,
           allowedFontWeights: ['semibold']
         }
       }
@@ -3159,8 +3150,7 @@ function AnimatedContainer$2({
     borderRadius: 'kitt.button.borderRadius',
     backgroundColor: currentBackgroundColor,
     width,
-    height,
-    minHeight: size === 'default' ? 'kitt.button.minHeight.default' : 'kitt.button.minHeight.medium'
+    height
   });
   return /*#__PURE__*/jsxRuntime.jsx(Animated__default.View, {
     style: disabled ? [styles] : [styles, animatedStyles],
@@ -3878,7 +3868,6 @@ const Button = /*#__PURE__*/React.forwardRef(({
     alignSelf: createResponsiveStyleFromProp(stretch, undefined, 'flex-start'),
     minWidth: "kitt.button.minWidth",
     maxWidth: createResponsiveStyleFromProp(stretch, '100%', 'kitt.button.maxWidth'),
-    minHeight: size === 'default' ? 'kitt.button.minHeight.default' : 'kitt.button.minHeight.medium',
     maxHeight: "kitt.button.maxHeight",
     width: createResponsiveStyleFromProp(stretch, '100%', 'auto'),
     onPress: onPress,
@@ -4845,6 +4834,7 @@ function AnimatedChoiceItemView({
   isDisabled,
   isSelected,
   hasError,
+  shouldExpand = false,
   animatedStyles
 }) {
   const sx = nativeBase.useSx();
@@ -4863,7 +4853,9 @@ function AnimatedChoiceItemView({
       isHovered,
       isPressed
     }),
-    padding: size === 'small' ? 'kitt.2' : 'kitt.4'
+    padding: size === 'small' ? 'kitt.2' : 'kitt.4',
+    flexGrow: shouldExpand ? 1 : undefined,
+    flexShrink: shouldExpand ? 1 : undefined
   });
   return /*#__PURE__*/jsxRuntime.jsx(Animated__default.View, {
     style: [style, animatedStyles],
@@ -4927,6 +4919,7 @@ function ChoiceItem({
   value,
   selected,
   disabled,
+  shouldExpand = false,
   children,
   isPressedInternal,
   isHoveredInternal,
@@ -4966,6 +4959,8 @@ function ChoiceItem({
       checked: selected
     },
     style: style,
+    flexGrow: shouldExpand ? 1 : undefined,
+    flexShrink: shouldExpand ? 1 : undefined,
     onBlur: onBlur,
     onFocus: onFocus,
     onPress: e => {
@@ -4985,6 +4980,8 @@ function ChoiceItem({
       });
       return /*#__PURE__*/jsxRuntime.jsxs(VStack, {
         space: "kitt.2",
+        flexGrow: shouldExpand ? 1 : undefined,
+        flexShrink: shouldExpand ? 1 : undefined,
         children: [/*#__PURE__*/jsxRuntime.jsxs(AnimatedChoiceItemView, {
           animatedStyles: backgroundStyles,
           isHovered: isHovered || isHoveredInternal,
@@ -4992,10 +4989,13 @@ function ChoiceItem({
           isSelected: selected,
           isPressed: isPressed || isPressedInternal,
           hasError: hasError,
+          shouldExpand: shouldExpand,
           size: size,
           children: [/*#__PURE__*/jsxRuntime.jsxs(Stack, {
             alignItems: "center",
             space: "kitt.2",
+            flexGrow: shouldExpand ? 1 : undefined,
+            flexShrink: shouldExpand ? 1 : undefined,
             children: [icon ? /*#__PURE__*/jsxRuntime.jsx(TypographyIcon, {
               color: textColor,
               icon: icon
@@ -5024,36 +5024,49 @@ function ChoiceItem({
 function ChoiceItemContainer({
   children,
   direction,
+  shouldExpand,
   isLast
 }) {
   const currentItemMarginValue = isLast ? undefined : 'kitt.3';
-  const flexProps = direction === 'row' ? {
+  const directionFlexProps = direction === 'row' ? {
     flexGrow: 1,
     flexShrink: 1,
     flexBasis: 0
   } : {};
+  const shouldExpandFlexProps = shouldExpand ? {
+    flexGrow: 1,
+    flexShrink: 1
+  } : {};
   return /*#__PURE__*/jsxRuntime.jsx(View, {
     marginRight: direction === 'row' ? currentItemMarginValue : undefined,
     marginBottom: direction === 'column' ? currentItemMarginValue : undefined,
-    ...flexProps,
+    ...directionFlexProps,
+    ...shouldExpandFlexProps,
     children: children
   });
 }
 
 function ChoicesContainer({
   direction,
+  shouldExpand,
   contentContainerStyle,
   ...props
 }) {
+  const shouldExpandFlexProps = shouldExpand ? {
+    flexGrow: 1,
+    flexShrink: 1
+  } : {};
   if (direction === 'row') {
-    return /*#__PURE__*/jsxRuntime.jsx(reactNative.ScrollView, {
+    return /*#__PURE__*/jsxRuntime.jsx(ScrollView, {
       horizontal: true,
-      contentContainerStyle: contentContainerStyle,
-      ...props
+      contentContainerStyle: shouldExpand ? shouldExpandFlexProps : contentContainerStyle,
+      ...props,
+      ...shouldExpandFlexProps
     });
   }
-  return /*#__PURE__*/jsxRuntime.jsx(reactNative.View, {
-    ...props
+  return /*#__PURE__*/jsxRuntime.jsx(View, {
+    ...props,
+    ...shouldExpandFlexProps
   });
 }
 
@@ -5065,6 +5078,7 @@ function Choices({
   type,
   direction = 'column',
   disabled,
+  shouldExpand = false,
   children,
   value,
   onPress,
@@ -5081,6 +5095,7 @@ function Choices({
   const sharedProps = {
     type,
     disabled,
+    shouldExpand,
     onPress: !isForm ? onPress : undefined,
     onChange: isForm ? newValue => {
       setCurrentValue(newValue);
@@ -5092,6 +5107,7 @@ function Choices({
   };
   return /*#__PURE__*/jsxRuntime.jsx(ChoicesContainer, {
     direction: direction,
+    shouldExpand: shouldExpand,
     testID: testID,
     id: id,
     style: style,
@@ -5103,6 +5119,7 @@ function Choices({
       });
       return /*#__PURE__*/jsxRuntime.jsx(ChoiceItemContainer, {
         direction: direction,
+        shouldExpand: shouldExpand,
         isLast: index === childrenArray.length - 1,
         children: element
       }, child.key);
@@ -10634,10 +10651,6 @@ function createKittNativeBaseCustomTheme(theme, appTheme) {
         button: {
           minWidth: theme.button.minWidth,
           maxWidth: theme.button.maxWidth,
-          minHeight: {
-            default: theme.button.minHeight.default,
-            medium: theme.button.minHeight.medium
-          },
           maxHeight: theme.button.maxHeight,
           height: {
             default: theme.button.height.default,
@@ -11259,7 +11272,6 @@ function createKittNativeBaseCustomTheme(theme, appTheme) {
       'heading-m': `${theme.typography.types.headings.configs['heading-m'].fontSize}px`,
       'heading-s': `${theme.typography.types.headings.configs['heading-s'].fontSize}px`,
       'heading-xs': `${theme.typography.types.headings.configs['heading-xs'].fontSize}px`,
-      'heading-xxs': `${theme.typography.types.headings.configs['heading-xxs'].fontSize}px`,
       'body-xl': `${theme.typography.types.bodies.configs['body-xl'].fontSize}px`,
       'body-l': `${theme.typography.types.bodies.configs['body-l'].fontSize}px`,
       'body-m': `${theme.typography.types.bodies.configs['body-m'].fontSize}px`,
@@ -11283,7 +11295,6 @@ function createKittNativeBaseCustomTheme(theme, appTheme) {
       'heading-m': `${theme.typography.types.headings.configs['heading-m'].lineHeight}px`,
       'heading-s': `${theme.typography.types.headings.configs['heading-s'].lineHeight}px`,
       'heading-xs': `${theme.typography.types.headings.configs['heading-xs'].lineHeight}px`,
-      'heading-xxs': `${theme.typography.types.headings.configs['heading-xxs'].lineHeight}px`,
       'body-xl': `${theme.typography.types.bodies.configs['body-xl'].lineHeight}px`,
       'body-l': `${theme.typography.types.bodies.configs['body-l'].lineHeight}px`,
       'body-m': `${theme.typography.types.bodies.configs['body-m'].lineHeight}px`,
@@ -13055,7 +13066,7 @@ function StoryTitleLevel4({
   return /*#__PURE__*/jsxRuntime.jsx(View, {
     marginBottom: 10,
     children: /*#__PURE__*/jsxRuntime.jsx(Typography.Header4, {
-      base: "body-l",
+      base: "heading-s",
       color: useStoryBlockColor(color),
       numberOfLines: numberOfLines,
       children: children
@@ -13663,7 +13674,7 @@ function ToastContent({
     flexGrow: 1,
     flexShrink: 1,
     children: [title ? /*#__PURE__*/jsxRuntime.jsx(Typography.Text, {
-      base: "body-m",
+      base: "heading-xs",
       color: "white",
       children: title
     }) : null, description ? /*#__PURE__*/jsxRuntime.jsx(Typography.Text, {
@@ -13679,7 +13690,7 @@ function ToastContent({
       borderColor: "white",
       onPress: onPress,
       children: /*#__PURE__*/jsxRuntime.jsx(Typography.Text, {
-        base: "body-m",
+        base: "heading-xs",
         color: "white",
         children: actionLabel
       })