react-native-system-ui 0.0.1 → 0.0.3

package/dist/cjs/components/water-mark/WaterMark.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 function _react() {
-  const data = _interopRequireDefault(require("react"));
+  const data = _interopRequireWildcard(require("react"));
   _react = function () {
     return data;
   };
@@ -18,9 +18,9 @@ function _reactNative() {
   };
   return data;
 }
-var _validate = require("../../utils/validate");
+var _utils = require("../../utils");
 var _tokens = require("./tokens");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 const WaterMark = props => {
   const {
@@ -44,18 +44,18 @@ const WaterMark = props => {
     ...rest
   } = props;
   const tokens = (0, _tokens.useWaterMarkTokens)(tokensOverride);
-  const resolveFiniteNumber = (value, fallback) => (0, _validate.isFiniteNumber)(value) ? value : fallback;
+  const resolveFiniteNumber = (value, fallback) => (0, _utils.isFiniteNumber)(value) ? value : fallback;
   const resolveNonNegativeNumber = (value, fallback) => Math.max(0, resolveFiniteNumber(value, fallback));
   const resolvePositiveNumber = (value, fallback) => Math.max(1, resolveFiniteNumber(value, fallback));
   const content = contentProp ?? tokens.defaults.content;
   const zIndex = resolveFiniteNumber(zIndexProp, tokens.defaults.zIndex);
   const fullPage = fullPageProp ?? tokens.defaults.fullPage;
   const window = (0, _reactNative().useWindowDimensions)();
-  const [layoutSize, setLayoutSize] = _react().default.useState({
+  const [layoutSize, setLayoutSize] = (0, _react().useState)({
     width: 0,
     height: 0
   });
-  const lastLayoutRef = _react().default.useRef({
+  const lastLayoutRef = (0, _react().useRef)({
     width: 0,
     height: 0
   });
@@ -64,7 +64,7 @@ const WaterMark = props => {
   const resolvedGapY = resolveNonNegativeNumber(gapY, tokens.defaults.gapY);
   const resolvedRotate = resolveFiniteNumber(rotate, tokens.defaults.rotate);
   const resolvedOpacity = Math.max(0, Math.min(1, resolveFiniteNumber(opacity, tokens.defaults.opacity)));
-  const fontSizeFromFont = (0, _validate.isFiniteNumber)(font?.size) ? font?.size : (0, _validate.isString)(font?.size) ? Number.parseFloat(font?.size) : undefined;
+  const fontSizeFromFont = (0, _utils.isFiniteNumber)(font?.size) ? font?.size : (0, _utils.isString)(font?.size) ? Number.parseFloat(font?.size) : undefined;
   const resolvedFontSize = resolveFiniteNumber((Number.isFinite(fontSizeFromFont ?? Number.NaN) ? fontSizeFromFont : undefined) ?? fontSize, tokens.defaults.fontSize);
   const normalizedFontSize = Math.max(0, resolvedFontSize);
   const resolvedColor = font?.color ?? color ?? tokens.colors.mark;
@@ -80,7 +80,7 @@ const WaterMark = props => {
       width,
       height
     } = event.nativeEvent.layout;
-    if (!(0, _validate.isFiniteNumber)(width) || !(0, _validate.isFiniteNumber)(height)) return;
+    if (!(0, _utils.isFiniteNumber)(width) || !(0, _utils.isFiniteNumber)(height)) return;
     const nextWidth = Math.max(0, width);
     const nextHeight = Math.max(0, height);
     if (lastLayoutRef.current.width === nextWidth && lastLayoutRef.current.height === nextHeight) return;
@@ -97,48 +97,48 @@ const WaterMark = props => {
       height: nextHeight
     });
   };
-  _react().default.useEffect(() => {
+  (0, _react().useEffect)(() => {
     if (!fullPage) return;
-    if (!(0, _validate.isFiniteNumber)(window.width) || !(0, _validate.isFiniteNumber)(window.height)) return;
+    if (!(0, _utils.isFiniteNumber)(window.width) || !(0, _utils.isFiniteNumber)(window.height)) return;
     if (window.width <= 0 || window.height <= 0) return;
     onLayoutCalculated?.({
       width: window.width,
       height: window.height
     });
   }, [fullPage, onLayoutCalculated, window.width, window.height]);
-  const zIndexStyle = _react().default.useMemo(() => ({
+  const zIndexStyle = (0, _react().useMemo)(() => ({
     zIndex
   }), [zIndex]);
-  const cellStyle = _react().default.useMemo(() => ({
+  const cellStyle = (0, _react().useMemo)(() => ({
     width: cellWidth,
     height: cellHeight
   }), [cellWidth, cellHeight]);
-  const oddRowStyle = _react().default.useMemo(() => ({
+  const oddRowStyle = (0, _react().useMemo)(() => ({
     paddingLeft: cellWidth / 2
   }), [cellWidth]);
-  const markStyle = _react().default.useMemo(() => ({
+  const markStyle = (0, _react().useMemo)(() => ({
     width: markWidth,
     height: markHeight,
     transform: [{
       rotate: `${resolvedRotate}deg`
     }]
   }), [markHeight, markWidth, resolvedRotate]);
-  const imageStyle = _react().default.useMemo(() => ({
+  const imageStyle = (0, _react().useMemo)(() => ({
     width: markWidth,
     height: markHeight,
     opacity: resolvedOpacity
   }), [markHeight, markWidth, resolvedOpacity]);
-  const textBaseStyle = _react().default.useMemo(() => ({
+  const textBaseStyle = (0, _react().useMemo)(() => ({
     fontSize: normalizedFontSize,
     color: resolvedColor,
     opacity: resolvedOpacity,
     fontFamily: font?.family,
     fontWeight: font?.weight
   }), [font?.family, font?.weight, normalizedFontSize, resolvedColor, resolvedOpacity]);
-  const rowIndexes = _react().default.useMemo(() => Array.from({
+  const rowIndexes = (0, _react().useMemo)(() => Array.from({
     length: rows
   }, (_, i) => i), [rows]);
-  const colIndexes = _react().default.useMemo(() => Array.from({
+  const colIndexes = (0, _react().useMemo)(() => Array.from({
     length: cols
   }, (_, i) => i), [cols]);
   return /*#__PURE__*/_react().default.createElement(_reactNative().View, _extends({

package/dist/cjs/design-system/ThemeProvider.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.ThemeProvider = void 0;
 function _react() {
-  const data = _interopRequireDefault(require("react"));
+  const data = _interopRequireWildcard(require("react"));
   _react = function () {
     return data;
   };
@@ -14,7 +14,7 @@ function _react() {
 var _ThemeContext = require("./ThemeContext");
 var _tokens = require("./tokens");
 var _validate = require("../utils/validate");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 const isThemeTokens = value => {
   return Boolean((0, _validate.isObject)(value) && 'palette' in value && 'spacing' in value);
 };
@@ -22,7 +22,7 @@ const ThemeProvider = ({
   value,
   children
 }) => {
-  const resolved = _react().default.useMemo(() => {
+  const resolved = (0, _react().useMemo)(() => {
     const foundations = isThemeTokens(value) ? value : (0, _tokens.createTokens)(value?.foundations);
     const components = !isThemeTokens(value) ? value?.components : undefined;
     return {

package/dist/cjs/design-system/createComponentTokensHook.js

@@ -4,16 +4,15 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.createComponentTokensHook = void 0;
-function React() {
-  const data = _interopRequireWildcard(require("react"));
-  React = function () {
+function _react() {
+  const data = require("react");
+  _react = function () {
     return data;
   };
   return data;
 }
 var _deepMerge = require("../utils/deepMerge");
 var _useTheme = require("./useTheme");
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 const createComponentTokensHook = (key, createBaseTokens) => {
   return overrides => {
     const {
@@ -21,7 +20,7 @@ const createComponentTokensHook = (key, createBaseTokens) => {
       components
     } = (0, _useTheme.useTheme)();
     const componentOverrides = components?.[key];
-    return React().useMemo(() => {
+    return (0, _react().useMemo)(() => {
       const base = createBaseTokens(foundations);
       const merged = componentOverrides && overrides ? (0, _deepMerge.deepMerge)(componentOverrides, overrides) : componentOverrides ?? overrides;
       return merged ? (0, _deepMerge.deepMerge)(base, merged) : base;

package/dist/cjs/design-system/tokens.js

@@ -90,6 +90,7 @@ const defaultFoundations = exports.defaultFoundations = {
     none: 0,
     xxs: 2,
     xs: 4,
+    ssm: 6,
     sm: 8,
     md: 12,
     lg: 16,

package/dist/cjs/design-system/useTheme.js

@@ -5,13 +5,12 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.useTheme = void 0;
 function _react() {
-  const data = _interopRequireDefault(require("react"));
+  const data = require("react");
   _react = function () {
     return data;
   };
   return data;
 }
 var _ThemeContext = require("./ThemeContext");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const useTheme = () => _react().default.useContext(_ThemeContext.ThemeContext);
+const useTheme = () => (0, _react().useContext)(_ThemeContext.ThemeContext);
 exports.useTheme = useTheme;

package/dist/cjs/hooks/aria/useAriaListBox.js

@@ -4,9 +4,9 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useAriaListBox = void 0;
-function React() {
-  const data = _interopRequireWildcard(require("react"));
-  React = function () {
+function _react() {
+  const data = require("react");
+  _react = function () {
     return data;
   };
   return data;
@@ -25,18 +25,33 @@ function _list() {
   };
   return data;
 }
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 const useAriaListBox = props => {
-  const ref = React().useRef(null);
-  const state = (0, _list().useListState)(props);
+  const ref = (0, _react().useRef)(null);
+  const {
+    label,
+    ...rest
+  } = props;
+  const resolvedProps = (0, _react().useMemo)(() => {
+    if (label == null) return rest;
+    const ariaLabel = typeof label === 'string' ? label : undefined;
+    return {
+      ...rest,
+      ...(ariaLabel ? {
+        'aria-label': ariaLabel
+      } : null)
+    };
+  }, [label, rest]);
+  const state = (0, _list().useListState)(resolvedProps);
   const {
     listBoxProps,
     labelProps
-  } = (0, _listbox().useListBox)(props, state, ref);
+  } = (0, _listbox().useListBox)(resolvedProps, state, ref);
+  const resolvedListBoxProps = (0, _react().useMemo)(() => listBoxProps, [listBoxProps]);
+  const resolvedLabelProps = (0, _react().useMemo)(() => labelProps, [labelProps]);
   return {
     state,
-    listBoxProps,
-    labelProps,
+    listBoxProps: resolvedListBoxProps,
+    labelProps: resolvedLabelProps,
     ref
   };
 };

package/dist/cjs/hooks/aria/useAriaOverlay.js

@@ -4,9 +4,9 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useAriaOverlay = void 0;
-function React() {
-  const data = _interopRequireWildcard(require("react"));
-  React = function () {
+function _react() {
+  const data = require("react");
+  _react = function () {
     return data;
   };
   return data;
@@ -18,7 +18,13 @@ function _overlays() {
   };
   return data;
 }
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+function _utils() {
+  const data = require("@react-native-aria/utils");
+  _utils = function () {
+    return data;
+  };
+  return data;
+}
 const useAriaOverlay = ({
   isOpen,
   onClose,
@@ -26,7 +32,7 @@ const useAriaOverlay = ({
   shouldCloseOnInteractOutside,
   overlayProps: overlayPropOverrides
 }) => {
-  const overlayRef = React().useRef(null);
+  const overlayRef = (0, _react().useRef)(null);
   const {
     overlayProps
   } = (0, _overlays().useOverlay)({
@@ -35,12 +41,10 @@ const useAriaOverlay = ({
     isDismissable,
     shouldCloseOnInteractOutside
   }, overlayRef);
+  const resolvedOverlayProps = (0, _react().useMemo)(() => (0, _utils().mergeProps)(overlayProps ?? {}, overlayPropOverrides ?? {}), [overlayPropOverrides, overlayProps]);
   return {
     overlayRef,
-    overlayProps: {
-      ...(overlayProps ?? {}),
-      ...(overlayPropOverrides ?? {})
-    }
+    overlayProps: resolvedOverlayProps
   };
 };
 exports.useAriaOverlay = useAriaOverlay;

package/dist/cjs/hooks/aria/useAriaPress.js

@@ -4,6 +4,20 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useAriaPress = void 0;
+function _react() {
+  const data = require("react");
+  _react = function () {
+    return data;
+  };
+  return data;
+}
+function _reactNative() {
+  const data = require("react-native");
+  _reactNative = function () {
+    return data;
+  };
+  return data;
+}
 function _focus() {
   const data = require("@react-native-aria/focus");
   _focus = function () {
@@ -25,10 +39,16 @@ function _utils() {
   };
   return data;
 }
+const mergePropsCompat = (...args) => {
+  if (typeof _utils().mergeProps === 'function') {
+    return (0, _utils().mergeProps)(...args);
+  }
+  return Object.assign({}, ...args);
+};
 const useAriaPress = ({
   disabled = false,
-  allowHover = true,
-  allowFocus = true,
+  allowHover = _reactNative().Platform.OS === 'web',
+  allowFocus = _reactNative().Platform.OS === 'web',
   extraProps,
   ...pressEvents
 } = {}) => {
@@ -45,37 +65,43 @@ const useAriaPress = ({
   } = (0, _interactions().useHover)({
     isDisabled: disabled || !allowHover
   });
+  const useFocusCompat = _focus().useFocus;
   const {
     isFocused,
     focusProps
-  } = (0, _focus().useFocus)({
+  } = useFocusCompat({
     isDisabled: disabled
   });
+  const useFocusRingCompat = _focus().useFocusRing;
   const {
     focusProps: focusRingProps,
     isFocusVisible
-  } = (0, _focus().useFocusRing)({
+  } = useFocusRingCompat({
     isDisabled: disabled
   });
-  let interactionProps = pressProps;
-  if (allowHover) {
-    interactionProps = (0, _utils().mergeProps)(interactionProps, hoverProps);
-  }
-  if (allowFocus && !disabled) {
-    interactionProps = (0, _utils().mergeProps)(interactionProps, focusProps, focusRingProps);
-  }
-  if (extraProps) {
-    interactionProps = (0, _utils().mergeProps)(interactionProps, extraProps);
-  }
+  const interactionProps = (0, _react().useMemo)(() => {
+    let merged = pressProps;
+    if (allowHover) {
+      merged = mergePropsCompat(merged, hoverProps);
+    }
+    if (allowFocus && !disabled) {
+      merged = mergePropsCompat(merged, focusProps, focusRingProps);
+    }
+    if (extraProps) {
+      merged = mergePropsCompat(merged, extraProps);
+    }
+    return merged;
+  }, [allowFocus, allowHover, disabled, extraProps, focusProps, focusRingProps, hoverProps, pressProps]);
+  const states = (0, _react().useMemo)(() => ({
+    hovered: !!isHovered,
+    pressed: !!isPressed,
+    focused: !!isFocused,
+    focusVisible: !!isFocusVisible,
+    disabled: !!disabled
+  }), [disabled, isFocusVisible, isFocused, isHovered, isPressed]);
   return {
     interactionProps,
-    states: {
-      hovered: !!isHovered,
-      pressed: !!isPressed,
-      focused: !!isFocused,
-      focusVisible: !!isFocusVisible,
-      disabled: !!disabled
-    }
+    states
   };
 };
 exports.useAriaPress = useAriaPress;

package/dist/cjs/hooks/aria/useAriaToggle.js

@@ -4,9 +4,9 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useAriaToggle = void 0;
-function React() {
-  const data = _interopRequireWildcard(require("react"));
-  React = function () {
+function _react() {
+  const data = require("react");
+  _react = function () {
     return data;
   };
   return data;
@@ -25,16 +25,16 @@ function _toggle2() {
   };
   return data;
 }
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 const useAriaToggle = props => {
-  const inputRef = props.inputRef ?? React().useRef(null);
+  const inputRef = props.inputRef ?? (0, _react().useRef)(null);
   const state = (0, _toggle2().useToggleState)(props);
   const {
     inputProps
   } = (0, _toggle().useToggle)(props, state, inputRef);
+  const resolvedInputProps = (0, _react().useMemo)(() => inputProps, [inputProps]);
   return {
     state,
-    inputProps,
+    inputProps: resolvedInputProps,
     inputRef
   };
 };

package/dist/cjs/hooks/gesture/useGestureScroll.js

@@ -4,9 +4,9 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useGestureScroll = exports.default = void 0;
-function React() {
-  const data = _interopRequireWildcard(require("react"));
-  React = function () {
+function _react() {
+  const data = require("react");
+  _react = function () {
     return data;
   };
   return data;
@@ -18,7 +18,6 @@ function _reactNative() {
   };
   return data;
 }
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 const DEFAULT_THROTTLE = 16;
 const VELOCITY_NORMALIZER = 1000; // convert delta/ms to px per second
 
@@ -32,21 +31,21 @@ const useGestureScroll = (options = {}) => {
     onMomentumScrollBegin,
     onMomentumScrollEnd
   } = options;
-  const scrollValue = React().useRef(new (_reactNative().Animated.Value)(0)).current;
-  const lastOffsetRef = React().useRef(0);
-  const lastTimestampRef = React().useRef(null);
-  const velocityRef = React().useRef(0);
-  const directionRef = React().useRef(null);
-  const [direction, setDirection] = React().useState(null);
-  const [isDragging, setIsDragging] = React().useState(false);
-  const [isMomentum, setIsMomentum] = React().useState(false);
-  const updateDirection = React().useCallback(next => {
+  const scrollValue = (0, _react().useRef)(new (_reactNative().Animated.Value)(0)).current;
+  const lastOffsetRef = (0, _react().useRef)(0);
+  const lastTimestampRef = (0, _react().useRef)(null);
+  const velocityRef = (0, _react().useRef)(0);
+  const directionRef = (0, _react().useRef)(null);
+  const [direction, setDirection] = (0, _react().useState)(null);
+  const [isDragging, setIsDragging] = (0, _react().useState)(false);
+  const [isMomentum, setIsMomentum] = (0, _react().useState)(false);
+  const updateDirection = (0, _react().useCallback)(next => {
     if (directionRef.current !== next) {
       directionRef.current = next;
       setDirection(next);
     }
   }, []);
-  const handleScroll = React().useCallback(event => {
+  const handleScroll = (0, _react().useCallback)(event => {
     onScroll?.(event);
     const contentOffset = event.nativeEvent.contentOffset;
     const current = axis === 'x' ? contentOffset.x ?? 0 : contentOffset.y ?? 0;
@@ -64,7 +63,7 @@ const useGestureScroll = (options = {}) => {
     lastTimestampRef.current = timestamp;
     lastOffsetRef.current = current;
   }, [axis, onScroll, updateDirection]);
-  const animatedScrollHandler = React().useMemo(() => {
+  const animatedScrollHandler = (0, _react().useMemo)(() => {
     const mapping = axis === 'x' ? [{
       nativeEvent: {
         contentOffset: {
@@ -83,23 +82,23 @@ const useGestureScroll = (options = {}) => {
       listener: handleScroll
     });
   }, [axis, handleScroll, scrollValue]);
-  const handleScrollBeginDrag = React().useCallback(event => {
+  const handleScrollBeginDrag = (0, _react().useCallback)(event => {
     setIsDragging(true);
     onScrollBeginDrag?.(event);
   }, [onScrollBeginDrag]);
-  const handleScrollEndDrag = React().useCallback(event => {
+  const handleScrollEndDrag = (0, _react().useCallback)(event => {
     setIsDragging(false);
     onScrollEndDrag?.(event);
   }, [onScrollEndDrag]);
-  const handleMomentumBegin = React().useCallback(event => {
+  const handleMomentumBegin = (0, _react().useCallback)(event => {
     setIsMomentum(true);
     onMomentumScrollBegin?.(event);
   }, [onMomentumScrollBegin]);
-  const handleMomentumEnd = React().useCallback(event => {
+  const handleMomentumEnd = (0, _react().useCallback)(event => {
     setIsMomentum(false);
     onMomentumScrollEnd?.(event);
   }, [onMomentumScrollEnd]);
-  const resetOffset = React().useCallback((value = 0) => {
+  const resetOffset = (0, _react().useCallback)((value = 0) => {
     scrollValue.stopAnimation();
     scrollValue.setValue(value);
     lastOffsetRef.current = value;
@@ -107,9 +106,9 @@ const useGestureScroll = (options = {}) => {
     velocityRef.current = 0;
     updateDirection(null);
   }, [scrollValue, updateDirection]);
-  const getVelocity = React().useCallback(() => velocityRef.current, []);
-  const getCurrentOffset = React().useCallback(() => lastOffsetRef.current, []);
-  const scrollProps = React().useMemo(() => ({
+  const getVelocity = (0, _react().useCallback)(() => velocityRef.current, []);
+  const getCurrentOffset = (0, _react().useCallback)(() => lastOffsetRef.current, []);
+  const scrollProps = (0, _react().useMemo)(() => ({
     onScroll: animatedScrollHandler,
     scrollEventThrottle,
     onScrollBeginDrag: handleScrollBeginDrag,

package/dist/cjs/hooks/index.js

@@ -31,6 +31,18 @@ Object.keys(_usePresenceAnimation).forEach(function (key) {
     }
   });
 });
+var _useSafeAreaPadding = require("./useSafeAreaPadding");
+Object.keys(_useSafeAreaPadding).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _useSafeAreaPadding[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _useSafeAreaPadding[key];
+    }
+  });
+});
 var _aria = require("./aria");
 Object.keys(_aria).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;

package/dist/cjs/hooks/useControllableValue.js

@@ -5,14 +5,13 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 function _react() {
-  const data = _interopRequireDefault(require("react"));
+  const data = require("react");
   _react = function () {
     return data;
   };
   return data;
 }
 var _validate = require("../utils/validate");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const hasProp = (obj, prop) => Object.prototype.hasOwnProperty.call(obj, prop);
 function useControllableValue(props = {}, options = {}) {
   const {
@@ -21,28 +20,30 @@ function useControllableValue(props = {}, options = {}) {
     valuePropName = 'value',
     trigger = 'onChange'
   } = options;
+  const propsRecord = props;
   const isControlled = hasProp(props, valuePropName);
-  const value = props[valuePropName];
-  const [internalValue, setInternalValue] = _react().default.useState(() => {
+  const value = propsRecord[valuePropName];
+  const [internalValue, setInternalValue] = (0, _react().useState)(() => {
     if (isControlled) {
       return value;
     }
     if (hasProp(props, defaultValuePropName)) {
-      return props[defaultValuePropName];
+      return propsRecord[defaultValuePropName];
     }
     return defaultValue;
   });
   const mergedValue = isControlled ? value : internalValue;
-  const handlerRef = _react().default.useRef(props[trigger]);
-  _react().default.useEffect(() => {
-    handlerRef.current = props[trigger];
+  const handlerRef = (0, _react().useRef)(propsRecord[trigger]);
+  (0, _react().useEffect)(() => {
+    handlerRef.current = propsRecord[trigger];
   }, [props, trigger]);
-  const triggerChange = _react().default.useCallback((nextValue, ...args) => {
+  const triggerChange = (0, _react().useCallback)((nextValue, ...args) => {
     if (!isControlled) {
       setInternalValue(nextValue);
     }
     const handler = handlerRef.current;
     if ((0, _validate.isFunction)(handler)) {
+      ;
       handler(nextValue, ...args);
     }
   }, [isControlled]);