@ornikar/kitt-universal 32.2.1-canary.b6a558c2a534e5d22cad1dfac7725ddeca489e44.0 → 32.3.1-canary.282229fbcb79b0e70662d8927eccac40f40e40d3.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.
Files changed (47) hide show
  1. package/CHANGELOG.md +13 -2
  2. package/dist/definitions/FullscreenModal/FullscreenModalAnimation.web.d.ts.map +1 -1
  3. package/dist/definitions/forms/InputText/InputText.d.ts.map +1 -1
  4. package/dist/definitions/forms/InputText/InputTextContainer.d.ts +2 -1
  5. package/dist/definitions/forms/InputText/InputTextContainer.d.ts.map +1 -1
  6. package/dist/definitions/themes/late-ocean/fullscreenModal.d.ts +0 -14
  7. package/dist/definitions/themes/late-ocean/fullscreenModal.d.ts.map +1 -1
  8. package/dist/definitions/themes/late-ocean/input.d.ts.map +1 -1
  9. package/dist/index-metro.es.android.js +94 -76
  10. package/dist/index-metro.es.android.js.map +1 -1
  11. package/dist/index-metro.es.ios.js +94 -76
  12. package/dist/index-metro.es.ios.js.map +1 -1
  13. package/dist/index-node-22.17.cjs.js +94 -76
  14. package/dist/index-node-22.17.cjs.js.map +1 -1
  15. package/dist/index-node-22.17.cjs.web.css +38 -9
  16. package/dist/index-node-22.17.cjs.web.js +161 -135
  17. package/dist/index-node-22.17.cjs.web.js.map +1 -1
  18. package/dist/index-node-22.17.es.mjs +94 -76
  19. package/dist/index-node-22.17.es.mjs.map +1 -1
  20. package/dist/index-node-22.17.es.web.css +38 -9
  21. package/dist/index-node-22.17.es.web.mjs +161 -135
  22. package/dist/index-node-22.17.es.web.mjs.map +1 -1
  23. package/dist/index.es.js +97 -78
  24. package/dist/index.es.js.map +1 -1
  25. package/dist/index.es.web.js +162 -135
  26. package/dist/index.es.web.js.map +1 -1
  27. package/dist/linaria-themes-metro.es.android.js +34 -39
  28. package/dist/linaria-themes-metro.es.android.js.map +1 -1
  29. package/dist/linaria-themes-metro.es.ios.js +34 -39
  30. package/dist/linaria-themes-metro.es.ios.js.map +1 -1
  31. package/dist/linaria-themes-node-22.17.cjs.js +34 -39
  32. package/dist/linaria-themes-node-22.17.cjs.js.map +1 -1
  33. package/dist/linaria-themes-node-22.17.cjs.web.js +34 -39
  34. package/dist/linaria-themes-node-22.17.cjs.web.js.map +1 -1
  35. package/dist/linaria-themes-node-22.17.es.mjs +34 -39
  36. package/dist/linaria-themes-node-22.17.es.mjs.map +1 -1
  37. package/dist/linaria-themes-node-22.17.es.web.mjs +34 -39
  38. package/dist/linaria-themes-node-22.17.es.web.mjs.map +1 -1
  39. package/dist/linaria-themes.es.js +34 -39
  40. package/dist/linaria-themes.es.js.map +1 -1
  41. package/dist/linaria-themes.es.web.js +34 -39
  42. package/dist/linaria-themes.es.web.js.map +1 -1
  43. package/dist/styles.css +38 -9
  44. package/dist/tsbuildinfo +1 -1
  45. package/package.json +1 -1
  46. package/dist/definitions/forms/InputText/InputTextContainer.web.d.ts +0 -4
  47. package/dist/definitions/forms/InputText/InputTextContainer.web.d.ts.map +0 -1
@@ -881,15 +881,15 @@ const card = {
881
881
  }
882
882
  };
883
883
 
884
- const webAnimationContentDuration$2 = 400;
885
- const webAnimationContentEasing$2 = {
884
+ const webAnimationContentDuration$1 = 400;
885
+ const webAnimationContentEasing$1 = {
886
886
  x1: 0.77,
887
887
  y1: 0,
888
888
  x2: 0.175,
889
889
  y2: 1
890
890
  };
891
- const webAnimationOverlayDuration$2 = 250;
892
- const webAnimationOverlayEasing$2 = {
891
+ const webAnimationOverlayDuration$1 = 250;
892
+ const webAnimationOverlayEasing$1 = {
893
893
  x1: 0.42,
894
894
  y1: 0,
895
895
  x2: 1,
@@ -924,12 +924,12 @@ const cardModal = {
924
924
  },
925
925
  animation: {
926
926
  overlay: {
927
- duration: webAnimationOverlayDuration$2,
928
- easing: webAnimationOverlayEasing$2
927
+ duration: webAnimationOverlayDuration$1,
928
+ easing: webAnimationOverlayEasing$1
929
929
  },
930
930
  content: {
931
- duration: webAnimationContentDuration$2,
932
- easing: webAnimationContentEasing$2
931
+ duration: webAnimationContentDuration$1,
932
+ easing: webAnimationContentEasing$1
933
933
  }
934
934
  }
935
935
  };
@@ -985,15 +985,15 @@ const choices = {
985
985
  }
986
986
  };
987
987
 
988
- const webAnimationContentDuration$1 = 400;
989
- const webAnimationContentEasing$1 = {
988
+ const webAnimationContentDuration = 400;
989
+ const webAnimationContentEasing = {
990
990
  x1: 0.77,
991
991
  y1: 0,
992
992
  x2: 0.175,
993
993
  y2: 1
994
994
  };
995
- const webAnimationOverlayDuration$1 = 250;
996
- const webAnimationOverlayEasing$1 = {
995
+ const webAnimationOverlayDuration = 250;
996
+ const webAnimationOverlayEasing = {
997
997
  x1: 0.42,
998
998
  y1: 0,
999
999
  x2: 1,
@@ -1015,12 +1015,12 @@ const dialogModal = {
1015
1015
  },
1016
1016
  animation: {
1017
1017
  overlay: {
1018
- duration: webAnimationOverlayDuration$1,
1019
- easing: webAnimationOverlayEasing$1
1018
+ duration: webAnimationOverlayDuration,
1019
+ easing: webAnimationOverlayEasing
1020
1020
  },
1021
1021
  content: {
1022
- duration: webAnimationContentDuration$1,
1023
- easing: webAnimationContentEasing$1
1022
+ duration: webAnimationContentDuration,
1023
+ easing: webAnimationContentEasing
1024
1024
  }
1025
1025
  }
1026
1026
  };
@@ -1078,10 +1078,10 @@ const autocomplete = {
1078
1078
  };
1079
1079
 
1080
1080
  const checkbox = {
1081
- borderWidth: 1,
1082
- borderRadius: 4,
1083
- height: 24,
1084
- width: 24,
1081
+ borderWidth: 2,
1082
+ borderRadius: 5,
1083
+ height: 20,
1084
+ width: 20,
1085
1085
  iconSize: 14,
1086
1086
  markColor: colors.uiBackgroundLight,
1087
1087
  textSpacing: 10,
@@ -1144,7 +1144,6 @@ const inputStatesStyle = {
1144
1144
  color: deepPurpleColorPalette.black
1145
1145
  },
1146
1146
  hover: {
1147
- backgroundColor: deepPurpleColorPalette['beige.1'],
1148
1147
  borderColor: deepPurpleColorPalette['beige.4'],
1149
1148
  color: deepPurpleColorPalette.black
1150
1149
  },
@@ -1929,20 +1928,6 @@ const forms = {
1929
1928
  timePicker
1930
1929
  };
1931
1930
 
1932
- const webAnimationContentDuration = 600;
1933
- const webAnimationContentEasing = {
1934
- x1: 0.77,
1935
- y1: 0,
1936
- x2: 0.175,
1937
- y2: 1
1938
- };
1939
- const webAnimationOverlayDuration = 250;
1940
- const webAnimationOverlayEasing = {
1941
- x1: 0.42,
1942
- y1: 0,
1943
- x2: 1,
1944
- y2: 1
1945
- };
1946
1931
  const fullscreenModal = {
1947
1932
  header: {
1948
1933
  height: 56
@@ -1956,12 +1941,22 @@ const fullscreenModal = {
1956
1941
  },
1957
1942
  animation: {
1958
1943
  overlay: {
1959
- duration: webAnimationOverlayDuration,
1960
- easing: webAnimationOverlayEasing
1944
+ duration: 250,
1945
+ easing: {
1946
+ x1: 0.42,
1947
+ y1: 0,
1948
+ x2: 1,
1949
+ y2: 1
1950
+ }
1961
1951
  },
1962
1952
  content: {
1963
- duration: webAnimationContentDuration,
1964
- easing: webAnimationContentEasing
1953
+ duration: 600,
1954
+ easing: {
1955
+ x1: 0.77,
1956
+ y1: 0,
1957
+ x2: 0.175,
1958
+ y2: 1
1959
+ }
1965
1960
  }
1966
1961
  }
1967
1962
  };
@@ -5554,11 +5549,29 @@ function InputPressable({
5554
5549
  }
5555
5550
 
5556
5551
  function InputTextContainer({
5557
- children
5552
+ children,
5553
+ isHovered
5558
5554
  }) {
5559
- return /*#__PURE__*/jsxRuntime.jsx(View, {
5560
- position: "relative",
5561
- children: children
5555
+ const theme = useTheme();
5556
+ const sx = nativeBase.useSx();
5557
+ const styles = sx({
5558
+ borderRadius: input.borderRadius
5559
+ });
5560
+ const animatedBackground = Animated.useAnimatedStyle(() => {
5561
+ const baseBackgroundColor = theme.kitt.palettes.deepPurple.white;
5562
+ const hoverBackgroundColor = theme.kitt.palettes.deepPurple['beige.1'];
5563
+ return {
5564
+ backgroundColor: Animated.withTiming(isHovered ? hoverBackgroundColor : baseBackgroundColor, {
5565
+ duration: 200
5566
+ })
5567
+ };
5568
+ }, [isHovered, theme]);
5569
+ return /*#__PURE__*/jsxRuntime.jsx(Animated__default.View, {
5570
+ style: [styles, animatedBackground],
5571
+ children: /*#__PURE__*/jsxRuntime.jsx(View, {
5572
+ position: "relative",
5573
+ children: children
5574
+ })
5562
5575
  });
5563
5576
  }
5564
5577
 
@@ -5583,39 +5596,44 @@ const InputText = /*#__PURE__*/React.forwardRef(({
5583
5596
  base: 'body-m'
5584
5597
  });
5585
5598
  const shouldHandleSingleLineOnIOS = reactNative.Platform.OS === 'ios' && !multiline;
5586
- return /*#__PURE__*/jsxRuntime.jsxs(InputTextContainer, {
5587
- children: [/*#__PURE__*/jsxRuntime.jsx(nativeBase.Input, {
5588
- ref: ref,
5589
- multiline: multiline,
5590
- id: id,
5591
- isDisabled: internalForceState ? internalForceState === 'disabled' : disabled,
5592
- isHovered: internalForceState ? internalForceState === 'hover' : undefined,
5593
- isFocused: internalForceState ? internalForceState === 'focus' : undefined,
5594
- inputMode: inputMode,
5595
- autoComplete: autoComplete,
5596
- autoCorrect: autoCorrect,
5597
- textContentType: textContentType,
5598
- fontSize: fontSizeForNativeBase,
5599
- lineHeight:
5600
- // On basic text input, we set the line-height to zero for iOS to fix vertical text alignment
5601
- // This is a iOS only fix since having 0 as a line-height value breaks text inputs on Android
5602
- shouldHandleSingleLineOnIOS ? 0 : fontSizeForNativeBase,
5603
- fontWeight: "bodies.regular",
5604
- fontFamily: "bodies.regular",
5605
- py: !multiline && reactNative.Platform.OS !== 'web' ? 0 : undefined,
5606
- variant: variant,
5607
- ...props,
5608
- height: multiline ? height : 'kitt.forms.input.minHeight',
5609
- onSubmitEditing: multiline ? () => null : onSubmitEditing
5610
- }), right ? /*#__PURE__*/jsxRuntime.jsx(View, {
5611
- position: "absolute",
5612
- right: 0,
5613
- top: 0,
5614
- bottom: 0,
5615
- justifyContent: "center",
5616
- padding: theme.kitt.forms.input.rightContainer.padding,
5617
- children: right
5618
- }) : null]
5599
+ return /*#__PURE__*/jsxRuntime.jsx(Pressable, {
5600
+ children: ({
5601
+ isHovered
5602
+ }) => /*#__PURE__*/jsxRuntime.jsxs(InputTextContainer, {
5603
+ isHovered: internalForceState ? internalForceState === 'hover' : isHovered,
5604
+ children: [/*#__PURE__*/jsxRuntime.jsx(nativeBase.Input, {
5605
+ ref: ref,
5606
+ multiline: multiline,
5607
+ id: id,
5608
+ isDisabled: internalForceState ? internalForceState === 'disabled' : disabled,
5609
+ isHovered: internalForceState ? internalForceState === 'hover' : undefined,
5610
+ isFocused: internalForceState ? internalForceState === 'focus' : undefined,
5611
+ inputMode: inputMode,
5612
+ autoComplete: autoComplete,
5613
+ autoCorrect: autoCorrect,
5614
+ textContentType: textContentType,
5615
+ fontSize: fontSizeForNativeBase,
5616
+ lineHeight:
5617
+ // On basic text input, we set the line-height to zero for iOS to fix vertical text alignment
5618
+ // This is a iOS only fix since having 0 as a line-height value breaks text inputs on Android
5619
+ shouldHandleSingleLineOnIOS ? 0 : fontSizeForNativeBase,
5620
+ fontWeight: "bodies.regular",
5621
+ fontFamily: "bodies.regular",
5622
+ py: !multiline && reactNative.Platform.OS !== 'web' ? 0 : undefined,
5623
+ variant: variant,
5624
+ ...props,
5625
+ height: multiline ? height : 'kitt.forms.input.minHeight',
5626
+ onSubmitEditing: multiline ? () => null : onSubmitEditing
5627
+ }), right ? /*#__PURE__*/jsxRuntime.jsx(View, {
5628
+ position: "absolute",
5629
+ right: 0,
5630
+ top: 0,
5631
+ bottom: 0,
5632
+ justifyContent: "center",
5633
+ padding: theme.kitt.forms.input.rightContainer.padding,
5634
+ children: right
5635
+ }) : null]
5636
+ })
5619
5637
  });
5620
5638
  });
5621
5639