react-native-system-ui 0.0.1-beta0 → 0.0.2

package/dist/cjs/pull-refresh/PullRefresh.js

@@ -0,0 +1,359 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+function _react() {
+  const data = _interopRequireWildcard(require("react"));
+  _react = function () {
+    return data;
+  };
+  return data;
+}
+function _reactNative() {
+  const data = require("react-native");
+  _reactNative = function () {
+    return data;
+  };
+  return data;
+}
+var _platform = require("../../platform");
+var _number = require("../../utils/number");
+var _validate = require("../../utils/validate");
+var _useLocale = require("../config-provider/useLocale");
+var _tokens = require("./tokens");
+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 DEFAULT_SUCCESS_DURATION = 500;
+const PullRefresh = /*#__PURE__*/_react().default.forwardRef((props, ref) => {
+  const {
+    children,
+    onRefresh,
+    onRefreshEnd,
+    refreshing,
+    defaultRefreshing,
+    tokensOverride,
+    pullingText,
+    loosingText,
+    loadingText,
+    successText = '刷新成功',
+    successDuration,
+    animationDuration,
+    headHeight,
+    pullDistance,
+    disabled = false,
+    style,
+    ...scrollProps
+  } = props;
+  const isWeb = _reactNative().Platform.OS === 'web';
+  const locale = (0, _useLocale.useLocale)();
+  const tokens = (0, _tokens.usePullRefreshTokens)(tokensOverride);
+  const {
+    colors,
+    sizing
+  } = tokens;
+  const translateY = (0, _react().useRef)(new (_reactNative().Animated.Value)(0)).current;
+  const headHeightNumber = (0, _react().useMemo)(() => Math.max(0, (0, _number.parseNumberLike)(headHeight, sizing.headHeight) ?? sizing.headHeight), [headHeight, sizing.headHeight]);
+  const pullDistanceNumber = (0, _react().useMemo)(() => Math.max(0, (0, _number.parseNumberLike)(pullDistance, headHeightNumber) ?? headHeightNumber), [headHeightNumber, pullDistance]);
+  const successDurationMs = (0, _react().useMemo)(() => Math.max(0, (0, _number.parseNumberLike)(successDuration, DEFAULT_SUCCESS_DURATION) ?? DEFAULT_SUCCESS_DURATION), [successDuration]);
+  const animationDurationMs = (0, _react().useMemo)(() => Math.max(0, (0, _number.parseNumberLike)(animationDuration, 300) ?? 300), [animationDuration]);
+  const isControlled = !(0, _validate.isUndefined)(refreshing);
+  const [innerRefreshing, setInnerRefreshing] = (0, _react().useState)(!!defaultRefreshing);
+  const mergedRefreshing = isControlled ? !!refreshing : innerRefreshing;
+  const scrollTopRef = (0, _react().useRef)(0);
+  const draggingRef = (0, _react().useRef)(false);
+  const webDragRafRef = (0, _react().useRef)(null);
+  const webDragPendingRef = (0, _react().useRef)(null);
+  const [distance, setDistance] = (0, _react().useState)(0);
+  const [showSuccess, setShowSuccess] = (0, _react().useState)(false);
+  const timerRef = (0, _react().useRef)(null);
+  const refreshEndTimerRef = (0, _react().useRef)(null);
+  const mergedRefreshingRef = (0, _react().useRef)(mergedRefreshing);
+  const refreshTriggeredRef = (0, _react().useRef)(false);
+  const refreshSucceededRef = (0, _react().useRef)(false);
+  const setDistanceValue = (0, _react().useCallback)((nextDistance, animate = false) => {
+    const normalized = Math.max(0, Math.round(nextDistance));
+    if (isWeb) {
+      translateY.stopAnimation();
+      if (animate && animationDurationMs > 0) {
+        _reactNative().Animated.timing(translateY, {
+          toValue: normalized,
+          duration: animationDurationMs,
+          useNativeDriver: false
+        }).start();
+      } else {
+        translateY.setValue(normalized);
+      }
+    }
+    setDistance(prev => Math.abs(prev - normalized) < 1 ? prev : normalized);
+  }, [animationDurationMs, isWeb, translateY]);
+  const flushWebDrag = (0, _react().useCallback)(() => {
+    const pending = webDragPendingRef.current;
+    if (pending == null) return;
+    webDragPendingRef.current = null;
+    setDistanceValue(pending);
+  }, [setDistanceValue]);
+  const cancelWebDrag = (0, _react().useCallback)(() => {
+    if (webDragRafRef.current != null && typeof cancelAnimationFrame === 'function') {
+      cancelAnimationFrame(webDragRafRef.current);
+    }
+    webDragRafRef.current = null;
+    webDragPendingRef.current = null;
+  }, []);
+  const scheduleWebDrag = (0, _react().useCallback)(nextDistance => {
+    if (!isWeb || typeof requestAnimationFrame !== 'function') {
+      setDistanceValue(nextDistance);
+      return;
+    }
+    webDragPendingRef.current = nextDistance;
+    if (webDragRafRef.current != null) return;
+    webDragRafRef.current = requestAnimationFrame(() => {
+      webDragRafRef.current = null;
+      flushWebDrag();
+    });
+  }, [flushWebDrag, isWeb, setDistanceValue]);
+  (0, _react().useEffect)(() => {
+    return () => {
+      if (timerRef.current) {
+        clearTimeout(timerRef.current);
+      }
+      if (refreshEndTimerRef.current) {
+        clearTimeout(refreshEndTimerRef.current);
+      }
+      cancelWebDrag();
+    };
+  }, [cancelWebDrag]);
+  const setRefreshing = (0, _react().useCallback)(value => {
+    if (!isControlled) setInnerRefreshing(value);
+  }, [isControlled]);
+  (0, _react().useEffect)(() => {
+    mergedRefreshingRef.current = mergedRefreshing;
+  }, [mergedRefreshing]);
+  const resolveStatusText = (0, _react().useCallback)((text, fallback) => {
+    const resolved = (0, _validate.isUndefined)(text) ? fallback : text;
+    return (0, _validate.isFunction)(resolved) ? resolved({
+      distance
+    }) : resolved;
+  }, [distance]);
+  const triggerSuccess = (0, _react().useCallback)(() => {
+    if (successText === null || successText === undefined || successText === false) return;
+    if (successDurationMs <= 0) return;
+    setShowSuccess(true);
+    if (timerRef.current) {
+      clearTimeout(timerRef.current);
+    }
+    timerRef.current = setTimeout(() => {
+      setShowSuccess(false);
+    }, successDurationMs);
+  }, [successDurationMs, successText]);
+  const handleRefresh = (0, _react().useCallback)(async () => {
+    if (disabled || mergedRefreshing) return;
+    if (!(0, _validate.isFunction)(onRefresh)) return;
+    setShowSuccess(false);
+    refreshTriggeredRef.current = true;
+    refreshSucceededRef.current = false;
+    setRefreshing(true);
+    try {
+      await onRefresh();
+      refreshSucceededRef.current = true;
+    } finally {
+      setRefreshing(false);
+      if ((0, _validate.isFunction)(onRefreshEnd)) {
+        if (refreshEndTimerRef.current) {
+          clearTimeout(refreshEndTimerRef.current);
+        }
+        refreshEndTimerRef.current = setTimeout(onRefreshEnd, 0);
+      }
+      if (refreshTriggeredRef.current && refreshSucceededRef.current && !mergedRefreshingRef.current) {
+        triggerSuccess();
+        refreshTriggeredRef.current = false;
+        refreshSucceededRef.current = false;
+      }
+    }
+  }, [disabled, mergedRefreshing, onRefresh, onRefreshEnd, setRefreshing, triggerSuccess]);
+  (0, _react().useEffect)(() => {
+    if (!isWeb) return;
+    if (draggingRef.current) return;
+    if (disabled) {
+      setDistanceValue(0, true);
+      return;
+    }
+    if (mergedRefreshing || showSuccess) {
+      setDistanceValue(headHeightNumber, true);
+      return;
+    }
+    setDistanceValue(0, true);
+  }, [disabled, headHeightNumber, isWeb, mergedRefreshing, setDistanceValue, showSuccess]);
+  (0, _react().useEffect)(() => {
+    if (isWeb) return;
+    if (!mergedRefreshing && !showSuccess) return;
+    setDistanceValue(0);
+  }, [isWeb, mergedRefreshing, setDistanceValue, showSuccess]);
+  (0, _react().useEffect)(() => {
+    if (!refreshTriggeredRef.current) return;
+    if (mergedRefreshing) return;
+    if (!refreshSucceededRef.current) {
+      refreshTriggeredRef.current = false;
+      refreshSucceededRef.current = false;
+      return;
+    }
+    if (showSuccess) {
+      refreshTriggeredRef.current = false;
+      refreshSucceededRef.current = false;
+      return;
+    }
+    triggerSuccess();
+    refreshTriggeredRef.current = false;
+    refreshSucceededRef.current = false;
+  }, [mergedRefreshing, showSuccess, triggerSuccess]);
+  const status = (0, _react().useMemo)(() => mergedRefreshing ? 'loading' : showSuccess ? 'success' : disabled || distance === 0 ? 'normal' : distance < pullDistanceNumber ? 'pulling' : 'loosing', [disabled, distance, mergedRefreshing, pullDistanceNumber, showSuccess]);
+  const opacity = (0, _react().useRef)(new (_reactNative().Animated.Value)(status === 'normal' ? 0 : 1)).current;
+  (0, _react().useEffect)(() => {
+    const toValue = status === 'normal' ? 0 : 1;
+    opacity.stopAnimation();
+    if (animationDurationMs <= 0) {
+      opacity.setValue(toValue);
+      return;
+    }
+    _reactNative().Animated.timing(opacity, {
+      toValue,
+      duration: animationDurationMs,
+      useNativeDriver: _platform.nativeDriverEnabled
+    }).start();
+  }, [animationDurationMs, opacity, status]);
+  const statusNode = (0, _react().useMemo)(() => {
+    switch (status) {
+      case 'pulling':
+        return resolveStatusText(pullingText, locale.vanPullRefresh.pulling);
+      case 'loosing':
+        return resolveStatusText(loosingText, locale.vanPullRefresh.loosing);
+      case 'loading':
+        return resolveStatusText(loadingText, locale.vanPullRefresh.loading);
+      case 'success':
+        return resolveStatusText(successText, '刷新成功');
+      default:
+        return null;
+    }
+  }, [loadingText, locale.vanPullRefresh.loading, locale.vanPullRefresh.loosing, locale.vanPullRefresh.pulling, loosingText, pullingText, resolveStatusText, status, successText]);
+  const shouldReserveHead = (status === 'loading' || status === 'success') && distance === 0;
+  const flattenedContainerStyle = (0, _react().useMemo)(() => _reactNative().StyleSheet.flatten(scrollProps.contentContainerStyle), [scrollProps.contentContainerStyle]);
+  const basePaddingTop = (0, _validate.isNumber)(flattenedContainerStyle?.paddingTop) ? flattenedContainerStyle.paddingTop : 0;
+  const contentContainerStyle = (0, _react().useMemo)(() => shouldReserveHead ? [scrollProps.contentContainerStyle, {
+    paddingTop: basePaddingTop + headHeightNumber
+  }] : scrollProps.contentContainerStyle, [basePaddingTop, headHeightNumber, scrollProps.contentContainerStyle, shouldReserveHead]);
+  const onScrollProp = scrollProps.onScroll;
+  const handleScroll = (0, _react().useCallback)(event => {
+    onScrollProp?.(event);
+    const offset = event.nativeEvent.contentOffset?.y ?? 0;
+    if (isWeb) {
+      scrollTopRef.current = Math.max(0, offset);
+      return;
+    }
+    if (disabled) return;
+    if (!(0, _validate.isFunction)(onRefresh) || mergedRefreshing || showSuccess) {
+      setDistanceValue(0);
+      return;
+    }
+    setDistanceValue(offset < 0 ? -offset : 0);
+  }, [disabled, isWeb, mergedRefreshing, onRefresh, onScrollProp, setDistanceValue, showSuccess]);
+  const panResponder = (0, _react().useMemo)(() => {
+    if (!isWeb || !(0, _validate.isFunction)(onRefresh)) return null;
+    const easeDistance = raw => {
+      const pullDistance = pullDistanceNumber;
+      let eased = raw;
+      if (eased > pullDistance) {
+        eased = eased < pullDistance * 2 ? pullDistance + (eased - pullDistance) / 2 : pullDistance * 1.5 + (eased - pullDistance * 2) / 4;
+      }
+      return Math.round(eased);
+    };
+    return _reactNative().PanResponder.create({
+      onMoveShouldSetPanResponder: (_event, gestureState) => {
+        if (disabled) return false;
+        if (mergedRefreshingRef.current) return false;
+        if (showSuccess) return false;
+        if (scrollTopRef.current > 0) return false;
+        const {
+          dx,
+          dy
+        } = gestureState;
+        if (dy <= 0) return false;
+        if (Math.abs(dy) <= Math.abs(dx)) return false;
+        return true;
+      },
+      onPanResponderGrant: () => {
+        draggingRef.current = true;
+      },
+      onPanResponderMove: (event, gestureState) => {
+        if (disabled) return;
+        if (mergedRefreshingRef.current) return;
+        if (showSuccess) return;
+        if (scrollTopRef.current > 0) return;
+        const raw = Math.max(0, gestureState.dy ?? 0);
+        scheduleWebDrag(easeDistance(raw));
+        event.preventDefault?.();
+      },
+      onPanResponderRelease: async (_event, gestureState) => {
+        draggingRef.current = false;
+        cancelWebDrag();
+        if (disabled) return;
+        if (mergedRefreshingRef.current) return;
+        if (showSuccess) return;
+        const nextDistance = easeDistance(Math.max(0, gestureState.dy));
+        const shouldRefresh = nextDistance >= pullDistanceNumber;
+        if (shouldRefresh) {
+          setDistanceValue(headHeightNumber, true);
+          await handleRefresh();
+          return;
+        }
+        setDistanceValue(0, true);
+      },
+      onPanResponderTerminate: () => {
+        draggingRef.current = false;
+        cancelWebDrag();
+        setDistanceValue(0, true);
+      }
+    });
+  }, [disabled, handleRefresh, headHeightNumber, isWeb, pullDistanceNumber, cancelWebDrag, scheduleWebDrag, setDistanceValue, showSuccess]);
+  return /*#__PURE__*/_react().default.createElement(_reactNative().ScrollView, _extends({}, scrollProps, {
+    ref: ref,
+    style: style,
+    contentContainerStyle: contentContainerStyle,
+    refreshControl: /*#__PURE__*/_react().default.createElement(_reactNative().RefreshControl, {
+      refreshing: !!mergedRefreshing,
+      onRefresh: handleRefresh,
+      enabled: !disabled && (0, _validate.isFunction)(onRefresh)
+    }),
+    onScroll: handleScroll,
+    scrollEventThrottle: 16
+  }), /*#__PURE__*/_react().default.createElement(_reactNative().Animated.View, _extends({}, panResponder ? panResponder.panHandlers : {}, {
+    style: isWeb ? {
+      transform: [{
+        translateY
+      }]
+    } : undefined
+  }), /*#__PURE__*/_react().default.createElement(_reactNative().View, {
+    pointerEvents: "none",
+    style: [styles.head, {
+      height: headHeightNumber,
+      marginTop: -headHeightNumber
+    }]
+  }, /*#__PURE__*/_react().default.createElement(_reactNative().Animated.View, {
+    style: {
+      opacity
+    }
+  }, (0, _validate.isText)(statusNode) ? /*#__PURE__*/_react().default.createElement(_reactNative().Text, {
+    style: {
+      color: status === 'success' ? colors.success : colors.text
+    }
+  }, statusNode) : statusNode)), children));
+});
+PullRefresh.displayName = 'PullRefresh';
+const styles = _reactNative().StyleSheet.create({
+  head: {
+    alignItems: 'center',
+    justifyContent: 'flex-end',
+    paddingBottom: 8
+  }
+});
+var _default = exports.default = PullRefresh;

package/dist/cjs/pull-refresh/index.js

@@ -0,0 +1,16 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+Object.defineProperty(exports, "usePullRefreshTokens", {
+  enumerable: true,
+  get: function () {
+    return _tokens.usePullRefreshTokens;
+  }
+});
+var _PullRefresh = _interopRequireDefault(require("./PullRefresh"));
+var _tokens = require("./tokens");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+var _default = exports.default = _PullRefresh.default;

package/dist/cjs/pull-refresh/tokens.js

@@ -0,0 +1,22 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.usePullRefreshTokens = void 0;
+var _designSystem = require("../../design-system");
+const createTokens = foundations => {
+  const {
+    palette
+  } = foundations;
+  return {
+    colors: {
+      text: palette.default[600],
+      success: palette.success?.[500] ?? '#4caf50'
+    },
+    sizing: {
+      headHeight: 50
+    }
+  };
+};
+const usePullRefreshTokens = exports.usePullRefreshTokens = (0, _designSystem.createComponentTokensHook)('pullRefresh', createTokens);

package/dist/cjs/radio/Radio.js

@@ -0,0 +1,215 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Radio = void 0;
+function _react() {
+  const data = _interopRequireWildcard(require("react"));
+  _react = function () {
+    return data;
+  };
+  return data;
+}
+function _reactNative() {
+  const data = require("react-native");
+  _reactNative = function () {
+    return data;
+  };
+  return data;
+}
+function _radio() {
+  const data = require("@react-native-aria/radio");
+  _radio = function () {
+    return data;
+  };
+  return data;
+}
+function _toggle() {
+  const data = require("@react-stately/toggle");
+  _toggle = function () {
+    return data;
+  };
+  return data;
+}
+var _RadioContext = require("./RadioContext");
+var _tokens = require("./tokens");
+var _utils = require("../../utils");
+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 Radio = exports.Radio = /*#__PURE__*/_react().default.memo(props => {
+  const {
+    children,
+    name,
+    value,
+    checked,
+    defaultChecked,
+    iconSize,
+    checkedColor,
+    iconRender,
+    shape: shapeProp,
+    labelPosition,
+    labelDisabled,
+    disabled,
+    style,
+    labelStyle,
+    tokensOverride,
+    onClick,
+    onChange,
+    accessibilityLabel,
+    ['aria-label']: ariaLabel,
+    ...rest
+  } = props;
+  const tokens = (0, _tokens.useRadioTokens)(tokensOverride);
+  const group = (0, _react().useContext)(_RadioContext.RadioGroupContext);
+  const optionValue = value ?? name;
+  const serializedValue = optionValue == null ? undefined : String(optionValue);
+  const isGroup = !!group && serializedValue !== undefined;
+  const resolvedIconSize = (0, _utils.parseNumber)(iconSize ?? group?.iconSize, tokens.defaults.iconSize);
+  const resolvedCheckedColor = checkedColor ?? group?.checkedColor ?? tokens.colors.checkedBackground;
+  const resolvedLabelPosition = labelPosition ?? tokens.defaults.labelPosition;
+  const resolvedLabelDisabled = labelDisabled ?? group?.labelDisabled ?? tokens.defaults.labelDisabled;
+  const resolvedDisabled = Boolean(disabled || group?.state.isDisabled);
+  const shape = shapeProp ?? tokens.defaults.shape;
+  const standaloneKey = serializedValue ?? 'standalone';
+  const inputRef = (0, _react().useRef)(null);
+  const resolvedAccessibilityLabel = accessibilityLabel ?? ariaLabel ?? ((0, _utils.isText)(children) ? String(children) : undefined) ?? serializedValue ?? 'radio';
+  const {
+    isSelected: standaloneSelected,
+    setSelected: setStandaloneSelected
+  } = (0, _toggle().useToggleState)({
+    isSelected: checked,
+    defaultSelected: defaultChecked,
+    onChange: next => onChange?.(next)
+  });
+  const pseudoState = {
+    selectedValue: standaloneSelected ? standaloneKey : null,
+    setSelectedValue: next => {
+      setStandaloneSelected(next === standaloneKey);
+    }
+  };
+  (0, _react().useEffect)(() => {
+    if (isGroup && group && serializedValue !== undefined) {
+      group.registerValue(serializedValue, optionValue ?? serializedValue);
+      return () => group.unregisterValue(serializedValue);
+    }
+    return undefined;
+  }, [group, isGroup, optionValue, serializedValue]);
+  const state = isGroup && group ? group.state : pseudoState;
+  const radioValue = isGroup ? serializedValue : standaloneKey;
+  const {
+    onBlur,
+    onFocus,
+    ...compatibleRest
+  } = rest;
+  const {
+    inputProps
+  } = (0, _radio().useRadio)({
+    value: radioValue,
+    isDisabled: resolvedDisabled,
+    'aria-label': resolvedAccessibilityLabel,
+    accessibilityLabel: resolvedAccessibilityLabel,
+    ...compatibleRest
+  }, state, inputRef);
+  const isChecked = isGroup && group && serializedValue !== undefined ? group.state.selectedValue === serializedValue : checked !== undefined ? checked : standaloneSelected;
+  const inputOnPress = inputProps?.onPress;
+  const handlePress = (0, _react().useCallback)(e => {
+    onClick?.(e);
+    if (resolvedDisabled) return;
+    if (isGroup && group && serializedValue !== undefined) {
+      if (!isChecked) group.state.setSelectedValue(serializedValue);
+      return;
+    }
+    if (checked !== undefined) {
+      onChange?.(!checked);
+      return;
+    }
+    if (onChange) {
+      setStandaloneSelected(!standaloneSelected);
+      return;
+    }
+    inputOnPress?.(e);
+  }, [checked, group, inputOnPress, isChecked, isGroup, onChange, onClick, resolvedDisabled, serializedValue, setStandaloneSelected, standaloneSelected]);
+  const mergedInputProps = inputProps ? {
+    ...inputProps,
+    onPress: handlePress
+  } : {};
+  const borderColor = resolvedDisabled ? tokens.colors.disabledBorder : isChecked ? resolvedCheckedColor : tokens.colors.border;
+  const backgroundColor = resolvedDisabled ? tokens.colors.disabledBackground : tokens.colors.background;
+  const spacingStyle = resolvedLabelPosition === 'left' ? {
+    marginRight: tokens.spacing.gap
+  } : {
+    marginLeft: tokens.spacing.gap
+  };
+  const labelColor = resolvedDisabled ? tokens.colors.labelDisabled : tokens.colors.label;
+  const borderRadius = shape === 'square' ? tokens.radii.square : tokens.radii.round;
+  const labelNode = children === null || children === undefined || children === false ? null : /*#__PURE__*/_react().default.createElement(_reactNative().View, {
+    style: [tokens.layout.labelWrapper, spacingStyle],
+    pointerEvents: "none",
+    accessible: false
+  }, (0, _utils.isText)(children) ? /*#__PURE__*/_react().default.createElement(_reactNative().Text, {
+    accessible: false,
+    style: [tokens.layout.label, {
+      color: labelColor,
+      fontSize: tokens.typography.fontSize,
+      lineHeight: tokens.typography.fontSize * tokens.typography.lineHeightMultiplier,
+      fontFamily: tokens.typography.fontFamily,
+      fontWeight: tokens.typography.fontWeight
+    }, labelStyle]
+  }, children) : children);
+  const interactive = !resolvedDisabled && !resolvedLabelDisabled;
+  const defaultIcon = /*#__PURE__*/_react().default.createElement(_reactNative().View, {
+    style: [tokens.layout.icon, {
+      width: resolvedIconSize,
+      height: resolvedIconSize,
+      borderRadius,
+      borderWidth: tokens.borders.width,
+      borderColor,
+      backgroundColor
+    }]
+  }, isChecked ? /*#__PURE__*/_react().default.createElement(_reactNative().View, {
+    style: {
+      width: resolvedIconSize * tokens.sizing.dotScale,
+      height: resolvedIconSize * tokens.sizing.dotScale,
+      borderRadius,
+      backgroundColor: resolvedCheckedColor
+    }
+  }) : null);
+  const iconVisual = iconRender ? iconRender({
+    checked: Boolean(isChecked),
+    disabled: Boolean(resolvedDisabled)
+  }) ?? null : defaultIcon;
+  const iconNode = interactive ? /*#__PURE__*/_react().default.createElement(_reactNative().View, {
+    style: tokens.layout.iconWrapper
+  }, iconVisual) : /*#__PURE__*/_react().default.createElement(_reactNative().Pressable, _extends({}, mergedInputProps, {
+    ref: inputRef,
+    testID: serializedValue !== undefined ? `radio-icon-${serializedValue}` : undefined,
+    disabled: resolvedDisabled,
+    accessibilityRole: "radio",
+    accessibilityState: {
+      selected: isChecked,
+      disabled: resolvedDisabled
+    },
+    style: tokens.layout.iconWrapper
+  }), iconVisual);
+  const left = resolvedLabelPosition === 'left';
+  const first = left ? labelNode : iconNode;
+  const second = left ? iconNode : labelNode;
+  if (interactive) {
+    return /*#__PURE__*/_react().default.createElement(_reactNative().Pressable, _extends({}, mergedInputProps, {
+      ref: inputRef,
+      testID: serializedValue !== undefined ? `radio-icon-${serializedValue}` : undefined,
+      disabled: resolvedDisabled,
+      accessibilityRole: "radio",
+      accessibilityState: {
+        selected: isChecked,
+        disabled: resolvedDisabled
+      },
+      style: [tokens.layout.container, style]
+    }), first, second);
+  }
+  return /*#__PURE__*/_react().default.createElement(_reactNative().View, {
+    style: [tokens.layout.container, style]
+  }, first, second);
+});
+Radio.displayName = 'Radio';

package/dist/cjs/radio/RadioContext.js

@@ -0,0 +1,15 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.RadioGroupContext = void 0;
+function _react() {
+  const data = _interopRequireDefault(require("react"));
+  _react = function () {
+    return data;
+  };
+  return data;
+}
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const RadioGroupContext = exports.RadioGroupContext = /*#__PURE__*/_react().default.createContext(null);