@xaui/native 0.2.8 → 0.9.1-alpha.1

package/dist/switch/index.cjs

@@ -1,358 +0,0 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }require('../chunk-56RPWZD2.cjs');
-
-
-var _chunk7UFBLUMVcjs = require('../chunk-7UFBLUMV.cjs');
-
-// src/components/switch/switch.tsx
-var _react = require('react'); var _react2 = _interopRequireDefault(_react);
-var _reactnative = require('react-native');
-
-// src/components/switch/switch.hook.ts
-
-var _core = require('@xaui/core');
-var useSwitchColorScheme = (themeColor) => {
-  const theme = _chunk7UFBLUMVcjs.useXUITheme.call(void 0, );
-  const safeThemeColor = _core.getSafeThemeColor.call(void 0, themeColor);
-  return theme.colors[safeThemeColor];
-};
-var useSwitchSizeStyles = (variant, size) => {
-  const theme = _chunk7UFBLUMVcjs.useXUITheme.call(void 0, );
-  const sizeStyles = _react.useMemo.call(void 0, () => {
-    if (variant === "overlap") {
-      const sizes2 = {
-        sm: {
-          trackWidth: 40,
-          trackHeight: 16,
-          thumbSize: 22,
-          fontSize: theme.fontSizes.sm,
-          padding: 0
-        },
-        md: {
-          trackWidth: 48,
-          trackHeight: 18,
-          thumbSize: 26,
-          fontSize: theme.fontSizes.md,
-          padding: 0
-        },
-        lg: {
-          trackWidth: 56,
-          trackHeight: 20,
-          thumbSize: 30,
-          fontSize: theme.fontSizes.lg,
-          padding: 0
-        }
-      };
-      return sizes2[size];
-    }
-    const sizes = {
-      sm: {
-        trackWidth: 40,
-        trackHeight: 24,
-        thumbSize: 18,
-        fontSize: theme.fontSizes.sm,
-        padding: 3
-      },
-      md: {
-        trackWidth: 48,
-        trackHeight: 28,
-        thumbSize: 22,
-        fontSize: theme.fontSizes.md,
-        padding: 3
-      },
-      lg: {
-        trackWidth: 56,
-        trackHeight: 32,
-        thumbSize: 26,
-        fontSize: theme.fontSizes.lg,
-        padding: 3
-      }
-    };
-    return sizes[size];
-  }, [size, theme, variant]);
-  return sizeStyles;
-};
-var useSwitchRadiusStyles = (radius) => {
-  const theme = _chunk7UFBLUMVcjs.useXUITheme.call(void 0, );
-  const radiusStyles = _react.useMemo.call(void 0, () => {
-    const radii = {
-      none: theme.borderRadius.none,
-      sm: theme.borderRadius.sm,
-      md: theme.borderRadius.md,
-      lg: theme.borderRadius.lg,
-      full: theme.borderRadius.full
-    };
-    return { borderRadius: radii[radius] };
-  }, [radius, theme]);
-  const thumbRadius = _react.useMemo.call(void 0, () => {
-    const radii = {
-      none: theme.borderRadius.none,
-      sm: theme.borderRadius.sm,
-      md: theme.borderRadius.md,
-      lg: theme.borderRadius.lg,
-      full: theme.borderRadius.full
-    };
-    return radii[radius];
-  }, [radius, theme]);
-  return { radiusStyles, thumbRadius };
-};
-var useSwitchTrackStyles = ({
-  colorScheme,
-  isSelected,
-  variant,
-  sizeStyles,
-  radiusStyles
-}) => {
-  const theme = _chunk7UFBLUMVcjs.useXUITheme.call(void 0, );
-  const trackStyles = _react.useMemo.call(void 0, () => {
-    const backgroundColor = isSelected ? variant === "overlap" ? colorScheme.container : colorScheme.main : theme.colors.default.container;
-    return {
-      width: sizeStyles.trackWidth,
-      height: sizeStyles.trackHeight,
-      backgroundColor,
-      paddingHorizontal: sizeStyles.padding,
-      ...radiusStyles
-    };
-  }, [colorScheme, isSelected, radiusStyles, sizeStyles, theme, variant]);
-  return trackStyles;
-};
-var useSwitchThumbStyles = ({
-  colorScheme,
-  isSelected,
-  variant,
-  sizeStyles,
-  thumbRadius
-}) => {
-  const theme = _chunk7UFBLUMVcjs.useXUITheme.call(void 0, );
-  const thumbStyles = _react.useMemo.call(void 0, () => {
-    const baseStyle = {
-      width: sizeStyles.thumbSize,
-      height: sizeStyles.thumbSize,
-      borderRadius: thumbRadius,
-      backgroundColor: variant === "overlap" && isSelected ? colorScheme.main : theme.colors.background
-    };
-    if (variant !== "overlap") return baseStyle;
-    return {
-      ...baseStyle,
-      ...theme.shadows.sm
-    };
-  }, [colorScheme, isSelected, sizeStyles, theme, thumbRadius, variant]);
-  return thumbStyles;
-};
-var useSwitchContainerStyles = (labelAlignment) => {
-  const containerStyles = _react.useMemo.call(void 0, () => {
-    const isJustified = labelAlignment === "justify-left" || labelAlignment === "justify-right";
-    return {
-      flexDirection: labelAlignment === "left" || labelAlignment === "justify-left" ? "row-reverse" : "row",
-      justifyContent: isJustified ? "space-between" : "flex-start"
-    };
-  }, [labelAlignment]);
-  return containerStyles;
-};
-
-// src/components/switch/switch.animation.ts
-
-var runThumbPositionAnimation = (thumbPosition, isSelected) => {
-  _reactnative.Animated.spring(thumbPosition, {
-    toValue: isSelected ? 1 : 0,
-    useNativeDriver: true,
-    damping: 15,
-    stiffness: 150
-  }).start();
-};
-var runSwitchPressInAnimation = (animatedScale, animatedThumbScale, isOverlap) => {
-  _reactnative.Animated.parallel([
-    _reactnative.Animated.spring(animatedScale, {
-      toValue: 0.95,
-      useNativeDriver: true
-    }),
-    _reactnative.Animated.spring(animatedThumbScale, {
-      toValue: isOverlap ? 1.1 : 1.2,
-      useNativeDriver: true
-    })
-  ]).start();
-};
-var runSwitchPressOutAnimation = (animatedScale, animatedThumbScale) => {
-  _reactnative.Animated.parallel([
-    _reactnative.Animated.spring(animatedScale, {
-      toValue: 1,
-      useNativeDriver: true
-    }),
-    _reactnative.Animated.spring(animatedThumbScale, {
-      toValue: 1,
-      useNativeDriver: true
-    })
-  ]).start();
-};
-
-// src/components/switch/switch.style.ts
-
-var styles = _reactnative.StyleSheet.create({
-  container: {
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 8
-  },
-  fullWidth: {
-    width: "100%"
-  },
-  track: {
-    justifyContent: "center",
-    position: "relative"
-  },
-  thumbContainer: {
-    position: "relative",
-    width: "100%",
-    height: "100%",
-    alignItems: "center",
-    justifyContent: "center"
-  },
-  thumb: {
-    position: "absolute",
-    left: 0
-  },
-  label: {
-    fontWeight: "400"
-  },
-  disabled: {
-    opacity: 0.5
-  },
-  disabledText: {
-    opacity: 0.7
-  }
-});
-
-// src/components/switch/switch.tsx
-var Switch = ({
-  label,
-  labelAlignment = "right",
-  themeColor = "primary",
-  variant = "inside",
-  size = "md",
-  radius = "full",
-  fullWidth = false,
-  isSelected: isSelectedProp,
-  isDisabled = false,
-  labelStyle,
-  style,
-  onValueChange
-}) => {
-  const theme = _chunk7UFBLUMVcjs.useXUITheme.call(void 0, );
-  const isControlled = typeof isSelectedProp === "boolean";
-  const [internalSelected, setInternalSelected] = _react.useState.call(void 0, _nullishCoalesce(isSelectedProp, () => ( false)));
-  const isSelected = isControlled ? isSelectedProp : internalSelected;
-  const scale = _react.useRef.call(void 0, new _reactnative.Animated.Value(1)).current;
-  const thumbPosition = _react.useRef.call(void 0, new _reactnative.Animated.Value(isSelected ? 1 : 0)).current;
-  const thumbScale = _react.useRef.call(void 0, new _reactnative.Animated.Value(1)).current;
-  const colorScheme = useSwitchColorScheme(themeColor);
-  const sizeStyles = useSwitchSizeStyles(variant, size);
-  const { radiusStyles, thumbRadius } = useSwitchRadiusStyles(radius);
-  const trackStyles = useSwitchTrackStyles({
-    colorScheme,
-    isSelected,
-    variant,
-    sizeStyles,
-    radiusStyles
-  });
-  const thumbStyles = useSwitchThumbStyles({
-    colorScheme,
-    isSelected,
-    variant,
-    sizeStyles,
-    thumbRadius
-  });
-  const containerStyles = useSwitchContainerStyles(labelAlignment);
-  const maxTranslateX = _react.useMemo.call(void 0, () => {
-    if (variant === "overlap") {
-      return sizeStyles.trackWidth - sizeStyles.thumbSize;
-    }
-    return sizeStyles.trackWidth - sizeStyles.thumbSize - sizeStyles.padding * 2;
-  }, [sizeStyles, variant]);
-  const translateX = _react.useMemo.call(void 0, 
-    () => thumbPosition.interpolate({
-      inputRange: [0, 1],
-      outputRange: [0, maxTranslateX]
-    }),
-    [maxTranslateX, thumbPosition]
-  );
-  _react.useEffect.call(void 0, () => {
-    runThumbPositionAnimation(thumbPosition, isSelected);
-  }, [isSelected, thumbPosition]);
-  const handlePress = () => {
-    if (isDisabled) return;
-    const nextValue = !isSelected;
-    _optionalChain([onValueChange, 'optionalCall', _ => _(nextValue)]);
-    if (!isControlled) {
-      setInternalSelected(nextValue);
-    }
-  };
-  const handlePressIn = () => {
-    if (isDisabled) return;
-    runSwitchPressInAnimation(scale, thumbScale, variant === "overlap");
-  };
-  const handlePressOut = () => {
-    if (isDisabled) return;
-    runSwitchPressOutAnimation(scale, thumbScale);
-  };
-  return /* @__PURE__ */ _react2.default.createElement(
-    _reactnative.Pressable,
-    {
-      onPress: handlePress,
-      onPressIn: handlePressIn,
-      onPressOut: handlePressOut,
-      disabled: isDisabled,
-      accessible: true,
-      accessibilityRole: "switch",
-      accessibilityLabel: label,
-      accessibilityState: {
-        disabled: isDisabled,
-        checked: isSelected
-      },
-      style: [
-        styles.container,
-        containerStyles,
-        fullWidth && styles.fullWidth,
-        isDisabled && styles.disabled,
-        style
-      ]
-    },
-    /* @__PURE__ */ _react2.default.createElement(
-      _reactnative.Animated.View,
-      {
-        style: [
-          styles.track,
-          trackStyles,
-          {
-            transform: [{ scale }]
-          }
-        ]
-      },
-      /* @__PURE__ */ _react2.default.createElement(_reactnative.View, { style: styles.thumbContainer }, /* @__PURE__ */ _react2.default.createElement(
-        _reactnative.Animated.View,
-        {
-          style: [
-            styles.thumb,
-            thumbStyles,
-            {
-              transform: [{ translateX }, { scale: thumbScale }]
-            }
-          ]
-        }
-      ))
-    ),
-    label && /* @__PURE__ */ _react2.default.createElement(
-      _reactnative.Text,
-      {
-        style: [
-          styles.label,
-          { fontSize: sizeStyles.fontSize, color: theme.colors.foreground },
-          isDisabled && styles.disabledText,
-          labelStyle
-        ]
-      },
-      label
-    )
-  );
-};
-
-
-exports.Switch = Switch;

package/dist/switch/index.d.cts

@@ -1,28 +0,0 @@
-import React from 'react';
-import { TextStyle, ViewStyle } from 'react-native';
-import { ThemeColor } from '@xaui/core/types';
-
-type SwitchVariant = 'inside' | 'overlap';
-type SwitchSize = 'sm' | 'md' | 'lg';
-type SwitchRadius = 'none' | 'sm' | 'md' | 'lg' | 'full';
-type SwitchLabelAlignment = 'left' | 'right' | 'justify-left' | 'justify-right';
-type SwitchEvents = {
-    onValueChange?: (isSelected: boolean) => void;
-};
-type SwitchProps = {
-    label?: string;
-    labelAlignment?: SwitchLabelAlignment;
-    themeColor?: ThemeColor;
-    variant?: SwitchVariant;
-    size?: SwitchSize;
-    radius?: SwitchRadius;
-    fullWidth?: boolean;
-    isSelected?: boolean;
-    isDisabled?: boolean;
-    labelStyle?: TextStyle;
-    style?: ViewStyle;
-} & SwitchEvents;
-
-declare const Switch: React.FC<SwitchProps>;
-
-export { Switch, type SwitchLabelAlignment, type SwitchProps, type SwitchRadius, type SwitchSize, type SwitchVariant };

package/dist/switch/index.d.ts

@@ -1,28 +0,0 @@
-import React from 'react';
-import { TextStyle, ViewStyle } from 'react-native';
-import { ThemeColor } from '@xaui/core/types';
-
-type SwitchVariant = 'inside' | 'overlap';
-type SwitchSize = 'sm' | 'md' | 'lg';
-type SwitchRadius = 'none' | 'sm' | 'md' | 'lg' | 'full';
-type SwitchLabelAlignment = 'left' | 'right' | 'justify-left' | 'justify-right';
-type SwitchEvents = {
-    onValueChange?: (isSelected: boolean) => void;
-};
-type SwitchProps = {
-    label?: string;
-    labelAlignment?: SwitchLabelAlignment;
-    themeColor?: ThemeColor;
-    variant?: SwitchVariant;
-    size?: SwitchSize;
-    radius?: SwitchRadius;
-    fullWidth?: boolean;
-    isSelected?: boolean;
-    isDisabled?: boolean;
-    labelStyle?: TextStyle;
-    style?: ViewStyle;
-} & SwitchEvents;
-
-declare const Switch: React.FC<SwitchProps>;
-
-export { Switch, type SwitchLabelAlignment, type SwitchProps, type SwitchRadius, type SwitchSize, type SwitchVariant };