@ornikar/kitt-universal 29.4.1 → 29.4.2-canary.5279d6411761af875ca17c9a8eefbb621d15180d.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 (34) hide show
  1. package/CHANGELOG.md +14 -0
  2. package/dist/definitions/BaseMessage/BaseMessage.d.ts +1 -1
  3. package/dist/definitions/BaseMessage/BaseMessage.d.ts.map +1 -1
  4. package/dist/definitions/CardModal/CardModalAnimation/CardModalAnimation.web.d.ts +1 -1
  5. package/dist/definitions/CardModal/CardModalAnimation/CardModalAnimation.web.d.ts.map +1 -1
  6. package/dist/definitions/CardModal/CardModalAnimation/CardModalRotationContainer.d.ts +2 -2
  7. package/dist/definitions/CardModal/CardModalAnimation/CardModalRotationContainer.d.ts.map +1 -1
  8. package/dist/definitions/DialogModal/DialogModalAnimation/DialogModalAnimation.web.d.ts +1 -1
  9. package/dist/definitions/DialogModal/DialogModalAnimation/DialogModalAnimation.web.d.ts.map +1 -1
  10. package/dist/definitions/FullscreenModal/FullscreenModalAnimation.web.d.ts +1 -1
  11. package/dist/definitions/FullscreenModal/FullscreenModalAnimation.web.d.ts.map +1 -1
  12. package/dist/definitions/Notification/Notification.d.ts +2 -2
  13. package/dist/definitions/Notification/Notification.d.ts.map +1 -1
  14. package/dist/definitions/Overlay/Overlay.d.ts +2 -2
  15. package/dist/definitions/Overlay/Overlay.d.ts.map +1 -1
  16. package/dist/definitions/Picker/Picker.web.d.ts.map +1 -1
  17. package/dist/index-metro.es.android.js +23 -18
  18. package/dist/index-metro.es.android.js.map +1 -1
  19. package/dist/index-metro.es.ios.js +23 -18
  20. package/dist/index-metro.es.ios.js.map +1 -1
  21. package/dist/index-node-22.17.cjs.js +16 -12
  22. package/dist/index-node-22.17.cjs.js.map +1 -1
  23. package/dist/index-node-22.17.cjs.web.js +48 -13
  24. package/dist/index-node-22.17.cjs.web.js.map +1 -1
  25. package/dist/index-node-22.17.es.mjs +16 -12
  26. package/dist/index-node-22.17.es.mjs.map +1 -1
  27. package/dist/index-node-22.17.es.web.mjs +48 -13
  28. package/dist/index-node-22.17.es.web.mjs.map +1 -1
  29. package/dist/index.es.js +15 -10
  30. package/dist/index.es.js.map +1 -1
  31. package/dist/index.es.web.js +47 -11
  32. package/dist/index.es.web.js.map +1 -1
  33. package/dist/tsbuildinfo +1 -1
  34. package/package.json +1 -1
@@ -4113,10 +4113,11 @@ function ModalBehaviour({
4113
4113
  }
4114
4114
  ModalBehaviour.CloseButton = CloseButton$1;
4115
4115
 
4116
- function Overlay({
4116
+ const Overlay = /*#__PURE__*/forwardRef(({
4117
4117
  onPress
4118
- }) {
4118
+ }, ref) => {
4119
4119
  return /*#__PURE__*/jsx(Pressable, {
4120
+ ref: ref,
4120
4121
  accessibilityRole: "none",
4121
4122
  position: "absolute",
4122
4123
  top: "0",
@@ -4126,9 +4127,9 @@ function Overlay({
4126
4127
  backgroundColor: "kitt.overlay.dark",
4127
4128
  onPress: onPress
4128
4129
  });
4129
- }
4130
+ });
4130
4131
 
4131
- function CardModalRotationContainer(props) {
4132
+ const CardModalRotationContainer = /*#__PURE__*/forwardRef((props, ref) => {
4132
4133
  return /*#__PURE__*/jsx(View, {
4133
4134
  paddingX: "kitt.cardModal.overlayPadding.horizontal",
4134
4135
  paddingY: "kitt.cardModal.overlayPadding.vertical",
@@ -4138,9 +4139,10 @@ function CardModalRotationContainer(props) {
4138
4139
  _web: {
4139
4140
  maxHeight: '100svh'
4140
4141
  },
4141
- ...props
4142
+ ...props,
4143
+ ref: ref
4142
4144
  });
4143
- }
4145
+ });
4144
4146
 
4145
4147
  const contentAnimationEnter$1 = "kitt-u_contentAnimationEnter_c11xxy4r";
4146
4148
  const contentAnimatioEnterActive$1 = "kitt-u_contentAnimatioEnterActive_cl52117";
@@ -4179,6 +4181,10 @@ function CardModalAnimation({
4179
4181
  onClose,
4180
4182
  ...props
4181
4183
  }) {
4184
+ // React 19 has removed the ReactDOM.findDOMNode method. We need to use refs to access DOM nodes in CSSTransition.
4185
+ // See https://github.com/reactjs/react-transition-group/issues/918
4186
+ const overlayRef = useRef(null);
4187
+ const contentRef = useRef(null);
4182
4188
  const theme = useTheme();
4183
4189
  const {
4184
4190
  animation
@@ -4194,13 +4200,16 @@ function CardModalAnimation({
4194
4200
  justifyContent: "center",
4195
4201
  children: [/*#__PURE__*/jsx(CSSTransition, {
4196
4202
  ...sharedProps,
4203
+ nodeRef: overlayRef,
4197
4204
  timeout: isAnimationEnabled ? animation.overlay.duration : 0,
4198
4205
  classNames: opacityClassNames$2,
4199
4206
  children: /*#__PURE__*/jsx(Overlay, {
4207
+ ref: overlayRef,
4200
4208
  onPress: onClose
4201
4209
  })
4202
4210
  }), /*#__PURE__*/jsx(CSSTransition, {
4203
4211
  ...sharedProps,
4212
+ nodeRef: contentRef,
4204
4213
  timeout: isAnimationEnabled ? animation.content.duration : 0,
4205
4214
  classNames: contentAnimationClassNames$1,
4206
4215
  onEnter: onEnter,
@@ -4208,6 +4217,7 @@ function CardModalAnimation({
4208
4217
  onExit: onExit,
4209
4218
  onExited: onExited,
4210
4219
  children: /*#__PURE__*/jsx(CardModalRotationContainer, {
4220
+ ref: contentRef,
4211
4221
  alignItems: "center",
4212
4222
  margin: "auto",
4213
4223
  children: children
@@ -4777,6 +4787,10 @@ function DialogModalAnimation({
4777
4787
  onClose,
4778
4788
  ...props
4779
4789
  }) {
4790
+ // React 19 has removed the ReactDOM.findDOMNode method. We need to use refs to access DOM nodes in CSSTransition.
4791
+ // See https://github.com/reactjs/react-transition-group/issues/918
4792
+ const overlayRef = useRef(null);
4793
+ const contentRef = useRef(null);
4780
4794
  const theme = useTheme();
4781
4795
  const {
4782
4796
  animation
@@ -4792,13 +4806,16 @@ function DialogModalAnimation({
4792
4806
  justifyContent: "center",
4793
4807
  children: [/*#__PURE__*/jsx(CSSTransition, {
4794
4808
  ...sharedProps,
4809
+ nodeRef: overlayRef,
4795
4810
  timeout: isAnimationEnabled ? animation.overlay.duration : 0,
4796
4811
  classNames: opacityClassNames$1,
4797
4812
  children: /*#__PURE__*/jsx(Overlay, {
4813
+ ref: overlayRef,
4798
4814
  onPress: onClose
4799
4815
  })
4800
4816
  }), /*#__PURE__*/jsx(CSSTransition, {
4801
4817
  ...sharedProps,
4818
+ nodeRef: contentRef,
4802
4819
  timeout: isAnimationEnabled ? animation.content.duration : 0,
4803
4820
  classNames: contentAnimationClassNames,
4804
4821
  onEnter: onEnter,
@@ -4806,6 +4823,7 @@ function DialogModalAnimation({
4806
4823
  onExit: onExit,
4807
4824
  onExited: onExited,
4808
4825
  children: /*#__PURE__*/jsx(View, {
4826
+ ref: contentRef,
4809
4827
  alignItems: "center",
4810
4828
  paddingX: "kitt.dialogModal.overlayPadding.horizontal",
4811
4829
  paddingY: "kitt.dialogModal.overlayPadding.vertical",
@@ -7404,6 +7422,10 @@ function FullscreenModalAnimation({
7404
7422
  onClose,
7405
7423
  ...props
7406
7424
  }) {
7425
+ // React 19 has removed the ReactDOM.findDOMNode method. We need to use refs to access DOM nodes in CSSTransition.
7426
+ // See https://github.com/reactjs/react-transition-group/issues/918
7427
+ const overlayRef = useRef(null);
7428
+ const contentRef = useRef(null);
7407
7429
  const theme = useTheme();
7408
7430
  const {
7409
7431
  animation
@@ -7417,20 +7439,26 @@ function FullscreenModalAnimation({
7417
7439
  ...props,
7418
7440
  children: [/*#__PURE__*/jsx(CSSTransition, {
7419
7441
  ...sharedProps,
7442
+ nodeRef: overlayRef,
7420
7443
  timeout: isAnimationEnabled ? animation.overlay.duration : 0,
7421
7444
  classNames: opacityClassNames,
7422
7445
  children: /*#__PURE__*/jsx(Overlay, {
7446
+ ref: overlayRef,
7423
7447
  onPress: onClose
7424
7448
  })
7425
7449
  }), /*#__PURE__*/jsx(CSSTransition, {
7426
7450
  ...sharedProps,
7451
+ nodeRef: contentRef,
7427
7452
  timeout: isAnimationEnabled ? animation.content.duration : 0,
7428
7453
  classNames: slideInClassNames,
7429
7454
  onEnter: onEnter,
7430
7455
  onEntered: onEntered,
7431
7456
  onExit: onExit,
7432
7457
  onExited: onExited,
7433
- children: children
7458
+ children: /*#__PURE__*/jsx(View, {
7459
+ ref: contentRef,
7460
+ children: children
7461
+ })
7434
7462
  })]
7435
7463
  });
7436
7464
  }
@@ -8181,16 +8209,17 @@ const getIconButtonColor = messageType => {
8181
8209
  }
8182
8210
  };
8183
8211
 
8184
- function BaseMessage({
8212
+ const BaseMessage = /*#__PURE__*/forwardRef(({
8185
8213
  type = 'info',
8186
8214
  children,
8187
8215
  hasNoRadius,
8188
8216
  centeredText,
8189
8217
  insets,
8190
8218
  onDismiss
8191
- }) {
8219
+ }, ref) => {
8192
8220
  const color = getColorByType(type);
8193
8221
  return /*#__PURE__*/jsxs(HStack, {
8222
+ ref: ref,
8194
8223
  alignItems: "flex-start",
8195
8224
  justifyContent: "space-between",
8196
8225
  minHeight: "kitt.feedbackMessage.minHeight",
@@ -8232,7 +8261,7 @@ function BaseMessage({
8232
8261
  })
8233
8262
  }) : null]
8234
8263
  });
8235
- }
8264
+ });
8236
8265
 
8237
8266
  function Message({
8238
8267
  type = 'info',
@@ -10981,14 +11010,15 @@ NavigationBottomSheet.Header = NavigationBottomSheetHeader;
10981
11010
  NavigationBottomSheet.Body = NavigationBottomSheetBody;
10982
11011
  NavigationBottomSheet.Footer = NavigationBottomSheetFooter;
10983
11012
 
10984
- function Notification({
11013
+ const Notification = /*#__PURE__*/forwardRef(({
10985
11014
  type,
10986
11015
  children,
10987
11016
  centeredText,
10988
11017
  insets,
10989
11018
  onDismiss
10990
- }) {
11019
+ }, ref) => {
10991
11020
  return /*#__PURE__*/jsx(BaseMessage, {
11021
+ ref: ref,
10992
11022
  hasNoRadius: true,
10993
11023
  type: type,
10994
11024
  centeredText: centeredText,
@@ -10996,7 +11026,7 @@ function Notification({
10996
11026
  onDismiss: onDismiss,
10997
11027
  children: children
10998
11028
  });
10999
- }
11029
+ });
11000
11030
 
11001
11031
  const AnimatedCircle = Animated$1.createAnimatedComponent(Circle$1);
11002
11032
  function AnimatedLoaderCircle({
@@ -11257,6 +11287,9 @@ function Picker({
11257
11287
  onChange,
11258
11288
  onClose
11259
11289
  }) {
11290
+ // React 19 has removed the ReactDOM.findDOMNode method. We need to use refs to access DOM nodes in CSSTransition.
11291
+ // See https://github.com/reactjs/react-transition-group/issues/918
11292
+ const nodeRef = useRef(null);
11260
11293
  if ((process.env.NODE_ENV !== "production") && sourceValue !== undefined && !syncStateWithSourceValue) {
11261
11294
  throw new Error('Picker: sourceValue prop should only be used with syncStateWithSourceValue prop');
11262
11295
  }
@@ -11368,6 +11401,7 @@ function Picker({
11368
11401
  },
11369
11402
  children: /*#__PURE__*/jsx(CSSTransition, {
11370
11403
  unmountOnExit: true,
11404
+ nodeRef: nodeRef,
11371
11405
  timeout: 300,
11372
11406
  in: isOpen,
11373
11407
  classNames: {
@@ -11377,6 +11411,7 @@ function Picker({
11377
11411
  exitActive
11378
11412
  },
11379
11413
  children: /*#__PURE__*/jsx(View, {
11414
+ ref: nodeRef,
11380
11415
  paddingY: "kitt.2",
11381
11416
  children: childrenArray.map((child, index) => {
11382
11417
  const currentValue = items[index];