@ornikar/kitt-universal 32.5.1 → 32.5.3-canary.00f8f98ae6299285821fb6a87eab9440995c7566.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.
@@ -4229,6 +4229,29 @@ function useStaticBottomSheet(Content) {
4229
4229
  };
4230
4230
  }
4231
4231
 
4232
+ function isDocumentBodyAvailable(body) {
4233
+ return !!body;
4234
+ }
4235
+
4236
+ /**
4237
+ * Returns document.body if it exists, or null otherwise.
4238
+ * This is useful when document.body might not be available, such as when document.write() is called
4239
+ * which destroys the DOM and causes React portals to fail with "Target container is not a DOM element" error.
4240
+ */
4241
+ function getDocumentBodyIfExists() {
4242
+ // document.body can be null when document.write() is called
4243
+ const body = typeof document !== 'undefined' ? document.body : null;
4244
+ return isDocumentBodyAvailable(body) ? body : null;
4245
+ }
4246
+
4247
+ function Portal({
4248
+ children
4249
+ }) {
4250
+ const container = getDocumentBodyIfExists();
4251
+ if (!container) return null;
4252
+ return /*#__PURE__*/createPortal(children, container);
4253
+ }
4254
+
4232
4255
  function useBlockBodyScroll(shouldBlockScroll, isInitialRender) {
4233
4256
  useEffect(() => {
4234
4257
  if (shouldBlockScroll) {
@@ -4251,7 +4274,9 @@ function ModalBehaviourPortal({
4251
4274
  const isInitialRenderRef = useRef(true);
4252
4275
  useBlockBodyScroll(!!visible, isInitialRenderRef.current);
4253
4276
  isInitialRenderRef.current = false;
4254
- return children ? /*#__PURE__*/createPortal(children, document.body) : null;
4277
+ return children ? /*#__PURE__*/jsx(Portal, {
4278
+ children: children
4279
+ }) : null;
4255
4280
  }
4256
4281
 
4257
4282
  const OnCloseContext = /*#__PURE__*/createContext(() => {});
@@ -6305,10 +6330,11 @@ const DatePicker = /*#__PURE__*/forwardRef(({
6305
6330
  });
6306
6331
 
6307
6332
  function DocumentPicker({
6308
- onDocumentUpload,
6309
6333
  children,
6310
6334
  disabled,
6311
- documentPickerOptions
6335
+ documentPickerOptions,
6336
+ onDocumentUpload,
6337
+ onGetDocumentAsyncError
6312
6338
  }) {
6313
6339
  const childElement = Children.only(children);
6314
6340
  return /*#__PURE__*/cloneElement(childElement, {
@@ -6317,12 +6343,22 @@ function DocumentPicker({
6317
6343
  onPress: async () => {
6318
6344
  if (disabled) return;
6319
6345
  childElement.props.onPress?.();
6320
- const result = await getDocumentAsync({
6321
- ...documentPickerOptions,
6322
- multiple: false
6323
- });
6324
- if (!result.canceled && result.assets[0]?.file) {
6325
- onDocumentUpload(result.assets[0].file);
6346
+ let result;
6347
+ try {
6348
+ result = await getDocumentAsync({
6349
+ ...documentPickerOptions,
6350
+ multiple: false
6351
+ });
6352
+ } catch (error) {
6353
+ onGetDocumentAsyncError?.();
6354
+ result = {
6355
+ canceled: true,
6356
+ assets: null
6357
+ };
6358
+ }
6359
+ const file = result.assets?.at(0)?.file;
6360
+ if (!result.canceled && file) {
6361
+ onDocumentUpload(file);
6326
6362
  }
6327
6363
  },
6328
6364
  disabled
@@ -11736,87 +11772,89 @@ function Picker({
11736
11772
  disabled,
11737
11773
  ...restToggleProps
11738
11774
  })
11739
- }), /*#__PURE__*/createPortal(/*#__PURE__*/jsx(View, {
11740
- ref: refMemo,
11741
- testID: testID,
11742
- ...menuProps,
11743
- position: strategy,
11744
- top: 0,
11745
- left: 0,
11746
- width: isItemsWidthFixed ? '100%' : itemsWidth,
11747
- maxWidth: isItemsWidthFixed ? 'kitt.picker.maxWidthFixed' : undefined,
11748
- zIndex: 1,
11749
- _web: {
11750
- style: {
11751
- transform: `translate3d(${tooltipX}px, ${tooltipY}px, 0)`,
11752
- visibility: isOpen ? 'visible' : 'hidden',
11753
- transitionDuration: '300ms',
11754
- transitionProperty: 'opacity, padding',
11755
- transitionTimingFunction: 'ease-in-out'
11756
- }
11757
- },
11775
+ }), /*#__PURE__*/jsx(Portal, {
11758
11776
  children: /*#__PURE__*/jsx(View, {
11759
- opacity: isOpen ? 1 : 0,
11760
- backgroundColor: "kitt.picker.web.optionsContainer.backgroundColor",
11761
- borderRadius: "kitt.picker.web.optionsContainer.borderRadius",
11762
- shadow: "kitt.picker.web.optionsContainer.shadow",
11777
+ ref: refMemo,
11778
+ testID: testID,
11779
+ ...menuProps,
11780
+ position: strategy,
11781
+ top: 0,
11782
+ left: 0,
11783
+ width: isItemsWidthFixed ? '100%' : itemsWidth,
11784
+ maxWidth: isItemsWidthFixed ? 'kitt.picker.maxWidthFixed' : undefined,
11785
+ zIndex: 1,
11763
11786
  _web: {
11764
11787
  style: {
11765
- transform: `translateY(${isOpen ? 0 : 8})`,
11788
+ transform: `translate3d(${tooltipX}px, ${tooltipY}px, 0)`,
11766
11789
  visibility: isOpen ? 'visible' : 'hidden',
11767
11790
  transitionDuration: '300ms',
11791
+ transitionProperty: 'opacity, padding',
11768
11792
  transitionTimingFunction: 'ease-in-out'
11769
11793
  }
11770
11794
  },
11771
- children: /*#__PURE__*/jsx(CSSTransition, {
11772
- unmountOnExit: true,
11773
- nodeRef: nodeRef,
11774
- timeout: 300,
11775
- in: isOpen,
11776
- classNames: pickerClassNames,
11777
- children: /*#__PURE__*/jsx(View, {
11778
- ref: nodeRef,
11779
- paddingY: "kitt.2",
11780
- children: childrenArray.map((child, index) => {
11781
- const currentValue = items[index];
11782
- if (currentValue === undefined) {
11783
- throw new Error(`Picker: No value found for item at index ${index}`);
11784
- }
11785
- const {
11786
- onClick,
11787
- 'aria-selected': ariaSelected,
11788
- ...itemProps
11789
- } = getItemProps({
11790
- item: currentValue,
11791
- index,
11792
- disabled
11793
- });
11794
- return /*#__PURE__*/jsx(Pressable, {
11795
- ...itemProps,
11796
- accessibilityState: {
11797
- selected: ariaSelected
11798
- },
11799
- onPress: onClick,
11800
- children: ({
11801
- isHovered,
11802
- isFocused,
11803
- isPressed
11804
- }) => {
11805
- return /*#__PURE__*/jsx(PickerItem, {
11806
- isSelected: checkSelectedItem(selectedItem || undefined, currentValue),
11807
- isHighlighted: highlightedIndex === index,
11808
- isHovered: isHovered,
11809
- isFocused: isFocused,
11810
- isPressed: isPressed,
11811
- children: child
11812
- });
11795
+ children: /*#__PURE__*/jsx(View, {
11796
+ opacity: isOpen ? 1 : 0,
11797
+ backgroundColor: "kitt.picker.web.optionsContainer.backgroundColor",
11798
+ borderRadius: "kitt.picker.web.optionsContainer.borderRadius",
11799
+ shadow: "kitt.picker.web.optionsContainer.shadow",
11800
+ _web: {
11801
+ style: {
11802
+ transform: `translateY(${isOpen ? 0 : 8})`,
11803
+ visibility: isOpen ? 'visible' : 'hidden',
11804
+ transitionDuration: '300ms',
11805
+ transitionTimingFunction: 'ease-in-out'
11806
+ }
11807
+ },
11808
+ children: /*#__PURE__*/jsx(CSSTransition, {
11809
+ unmountOnExit: true,
11810
+ nodeRef: nodeRef,
11811
+ timeout: 300,
11812
+ in: isOpen,
11813
+ classNames: pickerClassNames,
11814
+ children: /*#__PURE__*/jsx(View, {
11815
+ ref: nodeRef,
11816
+ paddingY: "kitt.2",
11817
+ children: childrenArray.map((child, index) => {
11818
+ const currentValue = items[index];
11819
+ if (currentValue === undefined) {
11820
+ throw new Error(`Picker: No value found for item at index ${index}`);
11813
11821
  }
11814
- }, itemProps.id);
11822
+ const {
11823
+ onClick,
11824
+ 'aria-selected': ariaSelected,
11825
+ ...itemProps
11826
+ } = getItemProps({
11827
+ item: currentValue,
11828
+ index,
11829
+ disabled
11830
+ });
11831
+ return /*#__PURE__*/jsx(Pressable, {
11832
+ ...itemProps,
11833
+ accessibilityState: {
11834
+ selected: ariaSelected
11835
+ },
11836
+ onPress: onClick,
11837
+ children: ({
11838
+ isHovered,
11839
+ isFocused,
11840
+ isPressed
11841
+ }) => {
11842
+ return /*#__PURE__*/jsx(PickerItem, {
11843
+ isSelected: checkSelectedItem(selectedItem || undefined, currentValue),
11844
+ isHighlighted: highlightedIndex === index,
11845
+ isHovered: isHovered,
11846
+ isFocused: isFocused,
11847
+ isPressed: isPressed,
11848
+ children: child
11849
+ });
11850
+ }
11851
+ }, itemProps.id);
11852
+ })
11815
11853
  })
11816
11854
  })
11817
11855
  })
11818
11856
  })
11819
- }), document.body)]
11857
+ })]
11820
11858
  });
11821
11859
  }
11822
11860
  Picker.Option = PickerOption;
@@ -13280,67 +13318,69 @@ function Tooltip({
13280
13318
  onFocus: handleToggleTooltip,
13281
13319
  onBlur: handleToggleTooltip,
13282
13320
  width: '100%'
13283
- }), /*#__PURE__*/createPortal(/*#__PURE__*/jsx(View, {
13284
- ref: refs.setFloating,
13285
- "aria-hidden": !isVisible,
13286
- paddingX: {
13287
- base: 'kitt.4',
13288
- small: 0
13289
- },
13290
- width: {
13291
- base: '100%',
13292
- small: 'max-content'
13293
- },
13294
- maxWidth: {
13295
- base: '100%',
13296
- small: 'kitt.tooltip.maxWidth'
13297
- },
13298
- opacity: isVisible ? 'kitt.tooltip.opacity' : 0,
13299
- paddingTop: placement === 'bottom' ? currentFloatingPadding : undefined,
13300
- paddingBottom: placement === 'top' ? currentFloatingPadding : undefined,
13301
- style: {
13302
- pointerEvents: isVisible ? 'auto' : 'none'
13303
- },
13304
- position: strategy,
13305
- zIndex: zIndex,
13306
- top: 0,
13307
- left: 0,
13308
- _web: {
13321
+ }), /*#__PURE__*/jsx(Portal, {
13322
+ children: /*#__PURE__*/jsx(View, {
13323
+ ref: refs.setFloating,
13324
+ "aria-hidden": !isVisible,
13325
+ paddingX: {
13326
+ base: 'kitt.4',
13327
+ small: 0
13328
+ },
13329
+ width: {
13330
+ base: '100%',
13331
+ small: 'max-content'
13332
+ },
13333
+ maxWidth: {
13334
+ base: '100%',
13335
+ small: 'kitt.tooltip.maxWidth'
13336
+ },
13337
+ opacity: isVisible ? 'kitt.tooltip.opacity' : 0,
13338
+ paddingTop: placement === 'bottom' ? currentFloatingPadding : undefined,
13339
+ paddingBottom: placement === 'top' ? currentFloatingPadding : undefined,
13309
13340
  style: {
13310
- transform: `translate3d(${isBase && !fullWidth ? `0, ${tooltipY}px, 0` : `${tooltipX}px, ${tooltipY}px, 0`})`,
13311
- visibility: isVisible ? 'visible' : 'hidden',
13312
- transitionDuration,
13313
- transitionProperty: theme.kitt.tooltip.transition[themePart].property,
13314
- transitionTimingFunction
13315
- }
13316
- },
13317
- onTouchStart: handleToggleTooltip,
13318
- onTouchEnd: handleToggleTooltip,
13319
- onMouseEnter: handleToggleTooltip,
13320
- onMouseLeave: handleToggleTooltip,
13321
- children: /*#__PURE__*/jsxs(View, {
13341
+ pointerEvents: isVisible ? 'auto' : 'none'
13342
+ },
13343
+ position: strategy,
13344
+ zIndex: zIndex,
13345
+ top: 0,
13346
+ left: 0,
13322
13347
  _web: {
13323
13348
  style: {
13324
- transform: `scale(${isVisible ? 1 : 0.8})`,
13325
- transitionDuration: isVisible ? '0' : transitionDuration,
13326
- transitionProperty: 'all',
13327
- transitionTimingFunction,
13328
- transformOrigin
13349
+ transform: `translate3d(${isBase && !fullWidth ? `0, ${tooltipY}px, 0` : `${tooltipX}px, ${tooltipY}px, 0`})`,
13350
+ visibility: isVisible ? 'visible' : 'hidden',
13351
+ transitionDuration,
13352
+ transitionProperty: theme.kitt.tooltip.transition[themePart].property,
13353
+ transitionTimingFunction
13329
13354
  }
13330
13355
  },
13331
- children: [shouldRenderArrow && placement === 'bottom' ? /*#__PURE__*/jsx(Arrow, {
13332
- ref: arrowRef,
13333
- position: "bottom",
13334
- ...sharedArrowProps
13335
- }) : null, /*#__PURE__*/jsx(TooltipContent, {
13336
- children: content
13337
- }), shouldRenderArrow && placement === 'top' ? /*#__PURE__*/jsx(Arrow, {
13338
- ref: arrowRef,
13339
- position: "top",
13340
- ...sharedArrowProps
13341
- }) : null]
13356
+ onTouchStart: handleToggleTooltip,
13357
+ onTouchEnd: handleToggleTooltip,
13358
+ onMouseEnter: handleToggleTooltip,
13359
+ onMouseLeave: handleToggleTooltip,
13360
+ children: /*#__PURE__*/jsxs(View, {
13361
+ _web: {
13362
+ style: {
13363
+ transform: `scale(${isVisible ? 1 : 0.8})`,
13364
+ transitionDuration: isVisible ? '0' : transitionDuration,
13365
+ transitionProperty: 'all',
13366
+ transitionTimingFunction,
13367
+ transformOrigin
13368
+ }
13369
+ },
13370
+ children: [shouldRenderArrow && placement === 'bottom' ? /*#__PURE__*/jsx(Arrow, {
13371
+ ref: arrowRef,
13372
+ position: "bottom",
13373
+ ...sharedArrowProps
13374
+ }) : null, /*#__PURE__*/jsx(TooltipContent, {
13375
+ children: content
13376
+ }), shouldRenderArrow && placement === 'top' ? /*#__PURE__*/jsx(Arrow, {
13377
+ ref: arrowRef,
13378
+ position: "top",
13379
+ ...sharedArrowProps
13380
+ }) : null]
13381
+ })
13342
13382
  })
13343
- }), document.body)]
13383
+ })]
13344
13384
  });
13345
13385
  }
13346
13386
  Tooltip.Arrow = Arrow;