@xaui/native 0.2.8 → 0.9.1-alpha.0

package/dist/snackbar/index.cjs

@@ -1,436 +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/snackbar/snackbar.tsx
-
-
-
-
-
-
-
-var _react = require('react'); var _react2 = _interopRequireDefault(_react);
-var _reactnative = require('react-native');
-
-// src/components/snackbar/snackbar.style.ts
-
-var SNACKBAR_DEFAULT_DURATION = 4e3;
-var SNACKBAR_DEFAULT_HORIZONTAL_INSET = 16;
-var SNACKBAR_DEFAULT_VERTICAL_INSET = 16;
-var SNACKBAR_DEFAULT_SPACING = 8;
-var SNACKBAR_DEFAULT_MAX_WIDTH = 640;
-var styles = _reactnative.StyleSheet.create({
-  stackContainer: {
-    position: "absolute",
-    left: 0,
-    right: 0,
-    zIndex: 999
-  },
-  stackContent: {
-    width: "100%",
-    alignSelf: "center"
-  },
-  surface: {
-    width: "100%",
-    minHeight: 48,
-    borderRadius: 4,
-    flexDirection: "row",
-    alignItems: "center",
-    paddingLeft: 16,
-    shadowColor: "#000000",
-    shadowOffset: { width: 0, height: 1 },
-    shadowOpacity: 0.3,
-    shadowRadius: 3,
-    elevation: 4
-  },
-  surfaceWithoutActions: {
-    paddingRight: 16
-  },
-  messageWrapper: {
-    flex: 1,
-    minWidth: 0,
-    justifyContent: "center",
-    paddingRight: 8
-  },
-  messageWrapperMultiline: {
-    paddingVertical: 14
-  },
-  messageText: {
-    fontSize: 14,
-    lineHeight: 20,
-    letterSpacing: 0.25,
-    fontWeight: "400"
-  },
-  trailingActions: {
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 4
-  },
-  actionButton: {
-    paddingHorizontal: 12,
-    paddingVertical: 10,
-    borderRadius: 9999,
-    minHeight: 40,
-    justifyContent: "center",
-    alignItems: "center"
-  },
-  actionText: {
-    fontSize: 14,
-    lineHeight: 20,
-    letterSpacing: 0.1,
-    fontWeight: "500"
-  },
-  closeButton: {
-    width: 48,
-    height: 48,
-    borderRadius: 9999,
-    justifyContent: "center",
-    alignItems: "center"
-  }
-});
-
-// src/components/snackbar/snackbar.hook.ts
-
-var _core = require('@xaui/core');
-var M3_LIGHT_INVERSE_SURFACE = "#322F35";
-var M3_LIGHT_INVERSE_ON_SURFACE = "#F5EFF7";
-var M3_LIGHT_INVERSE_PRIMARY = "#D0BCFF";
-var M3_DARK_INVERSE_SURFACE = "#E6E1E5";
-var M3_DARK_INVERSE_ON_SURFACE = "#322F35";
-var M3_DARK_INVERSE_PRIMARY = "#6750A4";
-var useSnackbarColors = (themeColor = "default") => {
-  const theme = _chunk7UFBLUMVcjs.useXUITheme.call(void 0, );
-  const safeThemeColor = _core.getSafeThemeColor.call(void 0, themeColor);
-  return _react.useMemo.call(void 0, () => {
-    if (safeThemeColor === "default") {
-      const isDarkMode = theme.mode === "dark";
-      const containerColor = isDarkMode ? M3_DARK_INVERSE_SURFACE : M3_LIGHT_INVERSE_SURFACE;
-      const textColor = isDarkMode ? M3_DARK_INVERSE_ON_SURFACE : M3_LIGHT_INVERSE_ON_SURFACE;
-      const actionColor = isDarkMode ? M3_DARK_INVERSE_PRIMARY : M3_LIGHT_INVERSE_PRIMARY;
-      return {
-        containerColor,
-        textColor,
-        actionColor,
-        pressedOverlayColor: _core.withOpacity.call(void 0, textColor, 0.16)
-      };
-    }
-    const colorScheme = theme.colors[safeThemeColor];
-    return {
-      containerColor: colorScheme.main,
-      textColor: colorScheme.onMain,
-      actionColor: _core.withOpacity.call(void 0, colorScheme.onMain, 0.82),
-      pressedOverlayColor: _core.withOpacity.call(void 0, colorScheme.onMain, 0.16)
-    };
-  }, [safeThemeColor, theme]);
-};
-var useSnackbarStackPositionStyles = (position, insetHorizontal, insetVertical, maxWidth) => {
-  return _react.useMemo.call(void 0, 
-    () => ({
-      container: position === "top" ? {
-        top: insetVertical,
-        paddingHorizontal: insetHorizontal
-      } : {
-        bottom: insetVertical,
-        paddingHorizontal: insetHorizontal
-      },
-      content: {
-        maxWidth
-      }
-    }),
-    [position, insetHorizontal, insetVertical, maxWidth]
-  );
-};
-
-// src/components/snackbar/snackbar.tsx
-var _close = require('@xaui/icons/close');
-var ENTER_ANIMATION_DURATION = 220;
-var EXIT_ANIMATION_DURATION = 180;
-var ENTER_INITIAL_SCALE = 0.92;
-var SnackbarSurface = ({ item, duration, onDismiss }) => {
-  const {
-    id,
-    message,
-    actionLabel,
-    onActionPress,
-    closeOnActionPress = true,
-    showCloseAffordance = false,
-    themeColor = "default",
-    numberOfLines = 2,
-    customAppearance
-  } = item;
-  const { containerColor, textColor, actionColor, pressedOverlayColor } = useSnackbarColors(themeColor);
-  const opacity = _react.useRef.call(void 0, new _reactnative.Animated.Value(0)).current;
-  const scale = _react.useRef.call(void 0, new _reactnative.Animated.Value(ENTER_INITIAL_SCALE)).current;
-  const exitAnimationStartedRef = _react.useRef.call(void 0, false);
-  const dismissTimeoutRef = _react.useRef.call(void 0, null);
-  const clearDismissTimer = _react.useCallback.call(void 0, () => {
-    if (!dismissTimeoutRef.current) return;
-    clearTimeout(dismissTimeoutRef.current);
-    dismissTimeoutRef.current = null;
-  }, []);
-  const runExitAnimation = _react.useCallback.call(void 0, () => {
-    if (exitAnimationStartedRef.current) return;
-    exitAnimationStartedRef.current = true;
-    clearDismissTimer();
-    _reactnative.Animated.parallel([
-      _reactnative.Animated.timing(opacity, {
-        toValue: 0,
-        duration: EXIT_ANIMATION_DURATION,
-        easing: _reactnative.Easing.bezier(0.4, 0, 0.2, 1),
-        useNativeDriver: true
-      }),
-      _reactnative.Animated.timing(scale, {
-        toValue: ENTER_INITIAL_SCALE,
-        duration: EXIT_ANIMATION_DURATION,
-        easing: _reactnative.Easing.bezier(0.4, 0, 0.2, 1),
-        useNativeDriver: true
-      })
-    ]).start(({ finished }) => {
-      if (!finished) return;
-      _optionalChain([onDismiss, 'optionalCall', _ => _(id)]);
-    });
-  }, [clearDismissTimer, id, onDismiss, opacity, scale]);
-  _react.useEffect.call(void 0, () => {
-    opacity.setValue(0);
-    scale.setValue(ENTER_INITIAL_SCALE);
-    exitAnimationStartedRef.current = false;
-    _reactnative.Animated.parallel([
-      _reactnative.Animated.timing(opacity, {
-        toValue: 1,
-        duration: ENTER_ANIMATION_DURATION,
-        easing: _reactnative.Easing.bezier(0.2, 0, 0, 1),
-        useNativeDriver: true
-      }),
-      _reactnative.Animated.timing(scale, {
-        toValue: 1,
-        duration: ENTER_ANIMATION_DURATION,
-        easing: _reactnative.Easing.bezier(0.2, 0, 0, 1),
-        useNativeDriver: true
-      })
-    ]).start();
-  }, [opacity, scale]);
-  _react.useEffect.call(void 0, () => {
-    clearDismissTimer();
-    if (duration <= 0) return;
-    dismissTimeoutRef.current = globalThis.setTimeout(() => {
-      runExitAnimation();
-    }, duration);
-    return clearDismissTimer;
-  }, [clearDismissTimer, duration, runExitAnimation]);
-  _react.useEffect.call(void 0, () => {
-    return () => {
-      clearDismissTimer();
-      opacity.stopAnimation();
-      scale.stopAnimation();
-    };
-  }, [clearDismissTimer, opacity, scale]);
-  const handleDismiss = _react.useCallback.call(void 0, () => {
-    runExitAnimation();
-  }, [runExitAnimation]);
-  const handleActionPress = _react.useCallback.call(void 0, () => {
-    _optionalChain([onActionPress, 'optionalCall', _2 => _2()]);
-    if (closeOnActionPress) {
-      handleDismiss();
-    }
-  }, [onActionPress, closeOnActionPress, handleDismiss]);
-  const messageNode = _react.useMemo.call(void 0, () => {
-    if (typeof message === "string" || typeof message === "number") {
-      return /* @__PURE__ */ _react2.default.createElement(
-        _reactnative.Text,
-        {
-          style: [
-            styles.messageText,
-            { color: textColor },
-            _optionalChain([customAppearance, 'optionalAccess', _3 => _3.message])
-          ],
-          numberOfLines
-        },
-        message
-      );
-    }
-    return message;
-  }, [_optionalChain([customAppearance, 'optionalAccess', _4 => _4.message]), message, numberOfLines, textColor]);
-  const actionNode = _react.useMemo.call(void 0, () => {
-    if (actionLabel === null || actionLabel === void 0) return null;
-    if (typeof actionLabel === "string" || typeof actionLabel === "number") {
-      return /* @__PURE__ */ _react2.default.createElement(
-        _reactnative.Text,
-        {
-          style: [
-            styles.actionText,
-            { color: actionColor },
-            _optionalChain([customAppearance, 'optionalAccess', _5 => _5.action])
-          ]
-        },
-        actionLabel
-      );
-    }
-    if (_react.isValidElement.call(void 0, actionLabel)) {
-      return actionLabel;
-    }
-    return null;
-  }, [actionColor, actionLabel, _optionalChain([customAppearance, 'optionalAccess', _6 => _6.action])]);
-  const hasActions = Boolean(actionNode || showCloseAffordance);
-  const isMultiline = numberOfLines > 1;
-  return /* @__PURE__ */ _react2.default.createElement(
-    _reactnative.Animated.View,
-    {
-      accessibilityRole: "alert",
-      style: [
-        styles.surface,
-        { backgroundColor: containerColor },
-        !hasActions && styles.surfaceWithoutActions,
-        _optionalChain([customAppearance, 'optionalAccess', _7 => _7.container]),
-        {
-          opacity,
-          transform: [{ scale }]
-        }
-      ]
-    },
-    /* @__PURE__ */ _react2.default.createElement(
-      _reactnative.View,
-      {
-        style: [
-          styles.messageWrapper,
-          isMultiline && styles.messageWrapperMultiline
-        ]
-      },
-      messageNode
-    ),
-    hasActions && /* @__PURE__ */ _react2.default.createElement(_reactnative.View, { style: styles.trailingActions }, actionNode && /* @__PURE__ */ _react2.default.createElement(
-      _reactnative.Pressable,
-      {
-        accessibilityRole: "button",
-        onPress: handleActionPress,
-        style: ({ pressed }) => [
-          styles.actionButton,
-          pressed && { backgroundColor: pressedOverlayColor }
-        ]
-      },
-      actionNode
-    ), showCloseAffordance && /* @__PURE__ */ _react2.default.createElement(
-      _reactnative.Pressable,
-      {
-        accessibilityRole: "button",
-        accessibilityLabel: "Close snackbar",
-        onPress: handleDismiss,
-        style: ({ pressed }) => [
-          styles.closeButton,
-          pressed && { backgroundColor: pressedOverlayColor },
-          _optionalChain([customAppearance, 'optionalAccess', _8 => _8.closeButton])
-        ]
-      },
-      /* @__PURE__ */ _react2.default.createElement(_close.CloseIcon, { size: 20, color: textColor })
-    ))
-  );
-};
-var SnackbarStack = ({
-  items,
-  onDismiss,
-  position = "bottom",
-  spacing = SNACKBAR_DEFAULT_SPACING,
-  insetHorizontal = SNACKBAR_DEFAULT_HORIZONTAL_INSET,
-  insetVertical = SNACKBAR_DEFAULT_VERTICAL_INSET,
-  maxWidth = SNACKBAR_DEFAULT_MAX_WIDTH,
-  defaultDuration = SNACKBAR_DEFAULT_DURATION,
-  usePortal = true,
-  customAppearance
-}) => {
-  const stackPositionStyles = useSnackbarStackPositionStyles(
-    position,
-    insetHorizontal,
-    insetVertical,
-    maxWidth
-  );
-  if (!items.length) return null;
-  const itemsToRender = position === "top" ? [...items].reverse() : items;
-  const stackNode = /* @__PURE__ */ _react2.default.createElement(
-    _reactnative.View,
-    {
-      pointerEvents: "box-none",
-      style: [
-        styles.stackContainer,
-        stackPositionStyles.container,
-        _optionalChain([customAppearance, 'optionalAccess', _9 => _9.container])
-      ]
-    },
-    /* @__PURE__ */ _react2.default.createElement(
-      _reactnative.View,
-      {
-        pointerEvents: "box-none",
-        style: [
-          styles.stackContent,
-          stackPositionStyles.content,
-          { gap: spacing },
-          _optionalChain([customAppearance, 'optionalAccess', _10 => _10.content])
-        ]
-      },
-      itemsToRender.map((item) => /* @__PURE__ */ _react2.default.createElement(
-        SnackbarSurface,
-        {
-          key: item.id,
-          item,
-          duration: _nullishCoalesce(item.duration, () => ( defaultDuration)),
-          onDismiss
-        }
-      ))
-    )
-  );
-  return usePortal ? /* @__PURE__ */ _react2.default.createElement(_chunk7UFBLUMVcjs.Portal, null, stackNode) : stackNode;
-};
-var Snackbar = ({
-  isVisible,
-  duration = SNACKBAR_DEFAULT_DURATION,
-  onClose,
-  onVisibleChange,
-  position = "bottom",
-  insetHorizontal = SNACKBAR_DEFAULT_HORIZONTAL_INSET,
-  insetVertical = SNACKBAR_DEFAULT_VERTICAL_INSET,
-  maxWidth = SNACKBAR_DEFAULT_MAX_WIDTH,
-  usePortal = true,
-  ...itemProps
-}) => {
-  const [internalVisible, setInternalVisible] = _react.useState.call(void 0, _nullishCoalesce(isVisible, () => ( true)));
-  const isControlled = typeof isVisible === "boolean";
-  const visible = isControlled ? isVisible : internalVisible;
-  const idRef = _react.useRef.call(void 0, 
-    `snackbar-${Date.now()}-${Math.random().toString(16).slice(2)}`
-  );
-  const dismiss = _react.useCallback.call(void 0, () => {
-    if (!isControlled) {
-      setInternalVisible(false);
-    }
-    _optionalChain([onVisibleChange, 'optionalCall', _11 => _11(false)]);
-    _optionalChain([onClose, 'optionalCall', _12 => _12()]);
-  }, [isControlled, onClose, onVisibleChange]);
-  const items = _react.useMemo.call(void 0, 
-    () => visible ? [
-      {
-        id: idRef.current,
-        duration,
-        ...itemProps
-      }
-    ] : [],
-    [duration, itemProps, visible]
-  );
-  return /* @__PURE__ */ _react2.default.createElement(
-    SnackbarStack,
-    {
-      items,
-      onDismiss: dismiss,
-      position,
-      insetHorizontal,
-      insetVertical,
-      maxWidth,
-      defaultDuration: duration,
-      usePortal
-    }
-  );
-};
-
-
-
-exports.Snackbar = Snackbar; exports.SnackbarStack = SnackbarStack;

package/dist/snackbar/index.d.cts

@@ -1,174 +0,0 @@
-import React, { ReactNode } from 'react';
-import { ViewStyle, TextStyle } from 'react-native';
-import { ThemeColor } from '@xaui/core/types';
-
-type SnackbarPosition = 'top' | 'bottom';
-type SnackbarCustomAppearance = {
-    /**
-     * Custom style for the snackbar surface.
-     */
-    container?: ViewStyle;
-    /**
-     * Custom style for the message text.
-     */
-    message?: TextStyle;
-    /**
-     * Custom style for the action label text.
-     */
-    action?: TextStyle;
-    /**
-     * Custom style for the close affordance button.
-     */
-    closeButton?: ViewStyle;
-};
-type SnackbarBaseProps = {
-    /**
-     * Message content shown inside the snackbar.
-     */
-    message: ReactNode;
-    /**
-     * Action content displayed at the end of the snackbar.
-     */
-    actionLabel?: ReactNode;
-    /**
-     * Callback fired when the action is pressed.
-     */
-    onActionPress?: () => void;
-    /**
-     * If true, pressing the action also dismisses the snackbar.
-     * @default true
-     */
-    closeOnActionPress?: boolean;
-    /**
-     * If true, shows the close affordance icon button.
-     * @default false
-     */
-    showCloseAffordance?: boolean;
-    /**
-     * Theme color for the snackbar. The default uses Material 3 inverse surface styling.
-     * @default 'default'
-     */
-    themeColor?: ThemeColor;
-    /**
-     * Number of lines for the message text.
-     * @default 2
-     */
-    numberOfLines?: number;
-    /**
-     * Custom appearance styles for snackbar parts.
-     */
-    customAppearance?: SnackbarCustomAppearance;
-};
-type SnackbarProps = SnackbarBaseProps & {
-    /**
-     * Controls snackbar visibility. If omitted, snackbar is shown by default.
-     * @default true
-     */
-    isVisible?: boolean;
-    /**
-     * Duration in milliseconds before auto-dismiss. Set to 0 or a negative value to disable.
-     * @default 4000
-     */
-    duration?: number;
-    /**
-     * Callback fired when the snackbar is dismissed.
-     */
-    onClose?: () => void;
-    /**
-     * Callback fired when visibility changes.
-     */
-    onVisibleChange?: (isVisible: boolean) => void;
-    /**
-     * Position of the snackbar on screen.
-     * @default 'bottom'
-     */
-    position?: SnackbarPosition;
-    /**
-     * Horizontal inset from screen edges.
-     * @default 16
-     */
-    insetHorizontal?: number;
-    /**
-     * Vertical inset from screen edge according to position.
-     * @default 16
-     */
-    insetVertical?: number;
-    /**
-     * Maximum width of the snackbar surface.
-     * @default 640
-     */
-    maxWidth?: number;
-    /**
-     * Render snackbar in a portal overlay.
-     * @default true
-     */
-    usePortal?: boolean;
-};
-type SnackbarItem = SnackbarBaseProps & {
-    /**
-     * Unique identifier for the snackbar item in the stack.
-     */
-    id: string;
-    /**
-     * Item-specific auto-dismiss duration in milliseconds.
-     * Set to 0 or a negative value to disable.
-     */
-    duration?: number;
-};
-type SnackbarStackProps = {
-    /**
-     * Snackbar items to render in a vertical stack.
-     */
-    items: SnackbarItem[];
-    /**
-     * Called when an item requests dismissal.
-     */
-    onDismiss?: (id: string) => void;
-    /**
-     * Position of the stacked snackbars on screen.
-     * @default 'bottom'
-     */
-    position?: SnackbarPosition;
-    /**
-     * Space between stacked snackbars.
-     * @default 8
-     */
-    spacing?: number;
-    /**
-     * Horizontal inset from screen edges.
-     * @default 16
-     */
-    insetHorizontal?: number;
-    /**
-     * Vertical inset from screen edge according to position.
-     * @default 16
-     */
-    insetVertical?: number;
-    /**
-     * Maximum width of each snackbar surface.
-     * @default 640
-     */
-    maxWidth?: number;
-    /**
-     * Default auto-dismiss duration for items without `duration`.
-     * @default 4000
-     */
-    defaultDuration?: number;
-    /**
-     * Render stack in a portal overlay.
-     * @default true
-     */
-    usePortal?: boolean;
-    /**
-     * Custom styles for stack containers.
-     */
-    customAppearance?: {
-        container?: ViewStyle;
-        content?: ViewStyle;
-    };
-};
-
-declare const SnackbarStack: React.FC<SnackbarStackProps>;
-declare const Snackbar: React.FC<SnackbarProps>;
-
-export { Snackbar, type SnackbarItem, type SnackbarPosition, type SnackbarProps, SnackbarStack, type SnackbarStackProps };