@ornikar/kitt-universal 32.5.1-canary.69cd09143dd992620decf0a9f846b68e573511e3.0 → 32.5.1-canary.fa4369620bc01acac1d789322911d6bc321a3a45.0

package/dist/index-node-22.17.cjs.web.css

@@ -45,28 +45,10 @@
   transition: transform var(--content-duration) var(--content-easing);
 }
 
-.Picker-module_picker-enter__Dzs-s {
-  transform: translateY(8px);
-  opacity: 0;
-}
-
-.Picker-module_picker-enter-active__0hxR5 {
-  transform: translateY(0);
-  opacity: 1;
-  transition: all var(--overlay-duration) var(--overlay-timing-function);
-}
-
-.Picker-module_picker-exit__Z1BjM {
-  transform: translateY(0);
-  opacity: 1;
-}
-
-.Picker-module_picker-exit-active__x2C8Q {
-  transform: translateY(8px);
-  opacity: 0;
-  transition: all var(--overlay-duration) var(--overlay-timing-function);
-}
-
+.kitt-u_enter_ereraf{-webkit-transform:translateY(8px);-ms-transform:translateY(8px);transform:translateY(8px);opacity:0;}
+.kitt-u_enterActive_e1jmsjrm{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0);opacity:1;-webkit-transition:all 300ms ease-in-out;transition:all 300ms ease-in-out;}
+.kitt-u_exit_e1mwnccz{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0);opacity:1;}
+.kitt-u_exitActive_e1004d1h{-webkit-transform:translateY(8px);-ms-transform:translateY(8px);transform:translateY(8px);opacity:0;-webkit-transition:all 300ms ease-in-out;transition:all 300ms ease-in-out;}
 /* overrides :global(a) in Link styles.module.css */
 .TypographyLinkWebWrapper-module_displayUnderline__KxwMp > * {
   text-decoration: underline;

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

@@ -680,6 +680,10 @@ const button = {
     default: 40,
     medium: 48
   },
+  minHeight: {
+    default: 40,
+    medium: 48
+  },
   maxHeight: 48,
   icon: {
     medium: {
@@ -2134,8 +2138,8 @@ const typography = {
           allowedFontWeights: ['semibold']
         },
         'heading-l': {
-          fontSize: 40,
-          lineHeight: 48,
+          fontSize: 38,
+          lineHeight: 44,
           allowedFontWeights: ['semibold']
         },
         'heading-m': {
@@ -2144,14 +2148,19 @@ const typography = {
           allowedFontWeights: ['semibold']
         },
         'heading-s': {
-          fontSize: 18,
-          lineHeight: 20,
-          allowedFontWeights: ['regular', 'bold']
+          fontSize: 24,
+          lineHeight: 28,
+          allowedFontWeights: ['semibold']
         },
         'heading-xs': {
+          fontSize: 20,
+          lineHeight: 24,
+          allowedFontWeights: ['semibold']
+        },
+        'heading-xxs': {
           fontSize: 16,
-          lineHeight: 18,
-          allowedFontWeights: ['regular', 'bold']
+          lineHeight: 20,
+          allowedFontWeights: ['semibold']
         }
       }
     },
@@ -2218,17 +2227,17 @@ const typography = {
       configs: {
         'label-large': {
           fontSize: 16,
-          lineHeight: 24,
+          lineHeight: 20,
           allowedFontWeights: ['semibold']
         },
         'label-medium': {
           fontSize: 14,
-          lineHeight: 20,
+          lineHeight: 18,
           allowedFontWeights: ['semibold']
         },
         'label-small': {
           fontSize: 12,
-          lineHeight: 16,
+          lineHeight: 14,
           allowedFontWeights: ['semibold']
         }
       }
@@ -2289,10 +2298,6 @@ const typography = {
 
 const picker = {
   maxWidthFixed: 320,
-  animation: {
-    duration: 300,
-    timingFunction: 'ease-in-out'
-  },
   ios: {
     default: {
       fontFamily: typography.types.bodies.fontFamily.native.regular,
@@ -3150,7 +3155,9 @@ function AnimatedContainer$2({
     },
     width: width,
     height: height,
+    minHeight: size === 'default' ? 'kitt.button.minHeight.default' : 'kitt.button.minHeight.medium',
     alignSelf: "baseline",
+    justifyContent: "center",
     borderRadius: "kitt.button.borderRadius",
     backgroundColor: currentBackgroundColor,
     children: children
@@ -3846,6 +3853,7 @@ 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,
@@ -7775,23 +7783,23 @@ function FullscreenModalFooter({
   });
 }
 
-const styles$2 = {"overlay-enter":"FullscreenModalAnimation-module_overlay-enter__L1J1X","overlay-enter-active":"FullscreenModalAnimation-module_overlay-enter-active__gDEVb","overlay-exit":"FullscreenModalAnimation-module_overlay-exit__Qx1WE","overlay-exit-active":"FullscreenModalAnimation-module_overlay-exit-active__lFR3x","content-enter":"FullscreenModalAnimation-module_content-enter__JmCWa","content-enter-active":"FullscreenModalAnimation-module_content-enter-active__iaNRs","content-exit":"FullscreenModalAnimation-module_content-exit__hB0wY","content-exit-active":"FullscreenModalAnimation-module_content-exit-active__BPVPo"};
+const styles$1 = {"overlay-enter":"FullscreenModalAnimation-module_overlay-enter__L1J1X","overlay-enter-active":"FullscreenModalAnimation-module_overlay-enter-active__gDEVb","overlay-exit":"FullscreenModalAnimation-module_overlay-exit__Qx1WE","overlay-exit-active":"FullscreenModalAnimation-module_overlay-exit-active__lFR3x","content-enter":"FullscreenModalAnimation-module_content-enter__JmCWa","content-enter-active":"FullscreenModalAnimation-module_content-enter-active__iaNRs","content-exit":"FullscreenModalAnimation-module_content-exit__hB0wY","content-exit-active":"FullscreenModalAnimation-module_content-exit-active__BPVPo"};
 
 const overlayClassNames = {
-  appear: styles$2['overlay-enter'],
-  appearActive: styles$2['overlay-enter-active'],
-  enter: styles$2['overlay-enter'],
-  enterActive: styles$2['overlay-enter-active'],
-  exit: styles$2['overlay-exit'],
-  exitActive: styles$2['overlay-exit-active']
+  appear: styles$1['overlay-enter'],
+  appearActive: styles$1['overlay-enter-active'],
+  enter: styles$1['overlay-enter'],
+  enterActive: styles$1['overlay-enter-active'],
+  exit: styles$1['overlay-exit'],
+  exitActive: styles$1['overlay-exit-active']
 };
 const slideInClassNames = {
-  appear: styles$2['content-enter'],
-  appearActive: styles$2['content-enter-active'],
-  enter: styles$2['content-enter'],
-  enterActive: styles$2['content-enter-active'],
-  exit: styles$2['content-exit'],
-  exitActive: styles$2['content-exit-active']
+  appear: styles$1['content-enter'],
+  appearActive: styles$1['content-enter-active'],
+  enter: styles$1['content-enter'],
+  enterActive: styles$1['content-enter-active'],
+  exit: styles$1['content-exit'],
+  exitActive: styles$1['content-exit-active']
 };
 function FullscreenModalAnimation({
   children,
@@ -9962,6 +9970,10 @@ 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,
@@ -10583,6 +10595,7 @@ 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`,
@@ -10606,6 +10619,7 @@ 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`,
@@ -11560,8 +11574,6 @@ function PageLoader() {
   });
 }
 
-const styles$1 = {"picker-enter":"Picker-module_picker-enter__Dzs-s","picker-enter-active":"Picker-module_picker-enter-active__0hxR5","picker-exit":"Picker-module_picker-exit__Z1BjM","picker-exit-active":"Picker-module_picker-exit-active__x2C8Q"};
-
 function getBackgroundColor({
   isSelected,
   isHighlighted,
@@ -11646,12 +11658,10 @@ function webUseSelectReducer(state, actionAndChanges, options) {
   }
 }
 
-const pickerClassNames = {
-  enter: styles$1['picker-enter'],
-  enterActive: styles$1['picker-enter-active'],
-  exit: styles$1['picker-exit'],
-  exitActive: styles$1['picker-exit-active']
-};
+const enter = "kitt-u_enter_ereraf";
+const enterActive = "kitt-u_enterActive_e1jmsjrm";
+const exit = "kitt-u_exit_e1mwnccz";
+const exitActive = "kitt-u_exitActive_e1004d1h";
 function Picker({
   children,
   renderTrigger,
@@ -11737,14 +11747,6 @@ function Picker({
     menuRef(currentRef);
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
-  const theme = useTheme();
-  const {
-    animation
-  } = theme.kitt.picker;
-  const cssVariables = {
-    '--overlay-duration': `${animation.duration}ms`,
-    '--overlay-timing-function': animation.timingFunction
-  };
   return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
     children: [/*#__PURE__*/jsxRuntime.jsx(View, {
       width: "fit-content",
@@ -11789,53 +11791,53 @@ function Picker({
             transitionTimingFunction: 'ease-in-out'
           }
         },
-        children: /*#__PURE__*/jsxRuntime.jsx("div", {
-          style: cssVariables,
-          children: /*#__PURE__*/jsxRuntime.jsx(reactTransitionGroup.CSSTransition, {
-            unmountOnExit: true,
-            nodeRef: nodeRef,
-            timeout: 300,
-            in: isOpen,
-            classNames: pickerClassNames,
-            children: /*#__PURE__*/jsxRuntime.jsx(View, {
-              ref: nodeRef,
-              paddingY: "kitt.2",
-              children: childrenArray.map((child, index) => {
-                const currentValue = items[index];
-                if (currentValue === undefined) {
-                  throw new Error(`Picker: No value found for item at index ${index}`);
+        children: /*#__PURE__*/jsxRuntime.jsx(reactTransitionGroup.CSSTransition, {
+          unmountOnExit: true,
+          nodeRef: nodeRef,
+          timeout: 300,
+          in: isOpen,
+          classNames: {
+            enter,
+            enterActive,
+            exit,
+            exitActive
+          },
+          children: /*#__PURE__*/jsxRuntime.jsx(View, {
+            ref: nodeRef,
+            paddingY: "kitt.2",
+            children: childrenArray.map((child, index) => {
+              const currentValue = items[index];
+              if (currentValue === undefined) throw new Error(`Picker: No value found for item at index ${index}`);
+              const {
+                onClick,
+                'aria-selected': ariaSelected,
+                ...itemProps
+              } = getItemProps({
+                item: currentValue,
+                index,
+                disabled
+              });
+              return /*#__PURE__*/jsxRuntime.jsx(Pressable, {
+                ...itemProps,
+                accessibilityState: {
+                  selected: ariaSelected
+                },
+                onPress: onClick,
+                children: ({
+                  isHovered,
+                  isFocused,
+                  isPressed
+                }) => {
+                  return /*#__PURE__*/jsxRuntime.jsx(PickerItem, {
+                    isSelected: checkSelectedItem(selectedItem || undefined, currentValue),
+                    isHighlighted: highlightedIndex === index,
+                    isHovered: isHovered,
+                    isFocused: isFocused,
+                    isPressed: isPressed,
+                    children: child
+                  });
                 }
-                const {
-                  onClick,
-                  'aria-selected': ariaSelected,
-                  ...itemProps
-                } = getItemProps({
-                  item: currentValue,
-                  index,
-                  disabled
-                });
-                return /*#__PURE__*/jsxRuntime.jsx(Pressable, {
-                  ...itemProps,
-                  accessibilityState: {
-                    selected: ariaSelected
-                  },
-                  onPress: onClick,
-                  children: ({
-                    isHovered,
-                    isFocused,
-                    isPressed
-                  }) => {
-                    return /*#__PURE__*/jsxRuntime.jsx(PickerItem, {
-                      isSelected: checkSelectedItem(selectedItem || undefined, currentValue),
-                      isHighlighted: highlightedIndex === index,
-                      isHovered: isHovered,
-                      isFocused: isFocused,
-                      isPressed: isPressed,
-                      children: child
-                    });
-                  }
-                }, itemProps.id);
-              })
+              }, itemProps.id);
             })
           })
         })
@@ -12445,7 +12447,7 @@ function StoryTitleLevel4({
   return /*#__PURE__*/jsxRuntime.jsx(View, {
     marginBottom: 10,
     children: /*#__PURE__*/jsxRuntime.jsx(Typography.Header4, {
-      base: "heading-s",
+      base: "body-l",
       color: useStoryBlockColor(color),
       numberOfLines: numberOfLines,
       children: children
@@ -12994,7 +12996,7 @@ function ToastContent({
     flexGrow: 1,
     flexShrink: 1,
     children: [title ? /*#__PURE__*/jsxRuntime.jsx(Typography.Text, {
-      base: "heading-xs",
+      base: "body-m",
       color: "white",
       children: title
     }) : null, description ? /*#__PURE__*/jsxRuntime.jsx(Typography.Text, {
@@ -13010,7 +13012,7 @@ function ToastContent({
       borderColor: "white",
       onPress: onPress,
       children: /*#__PURE__*/jsxRuntime.jsx(Typography.Text, {
-        base: "heading-xs",
+        base: "body-m",
         color: "white",
         children: actionLabel
       })