@xaui/native 0.2.8 → 0.9.1-alpha.0

package/dist/card/index.cjs

@@ -1,338 +0,0 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } 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/card/card.tsx
-var _react = require('react'); var _react2 = _interopRequireDefault(_react);
-var _reactnative = require('react-native');
-
-// src/components/card/card.style.ts
-
-var styles = _reactnative.StyleSheet.create({
-  card: {
-    overflow: "hidden",
-    borderWidth: 1
-  },
-  fullWidth: {
-    flexShrink: 1,
-    flexBasis: "auto",
-    width: "100%"
-  },
-  disabled: {
-    opacity: 0.55
-  },
-  header: {
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 12,
-    paddingHorizontal: 16,
-    paddingTop: 14,
-    paddingBottom: 10
-  },
-  body: {
-    paddingHorizontal: 16,
-    paddingVertical: 12
-  },
-  footer: {
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 12,
-    paddingHorizontal: 16,
-    paddingTop: 10,
-    paddingBottom: 14
-  },
-  title: {
-    fontSize: 16,
-    fontWeight: "600",
-    includeFontPadding: false
-  },
-  description: {
-    fontSize: 14,
-    lineHeight: 20,
-    includeFontPadding: false
-  }
-});
-
-// src/components/card/card.hook.ts
-
-var _core = require('@xaui/core');
-var useCardContainerStyles = (themeColor, isBlurred) => {
-  const theme = _chunk7UFBLUMVcjs.useXUITheme.call(void 0, );
-  return _react.useMemo.call(void 0, () => {
-    const safeThemeColor = _core.getSafeThemeColor.call(void 0, themeColor);
-    const colorScheme = theme.colors[safeThemeColor];
-    const isDefaultThemeColor = safeThemeColor === "default";
-    const defaultBackgroundColor = theme.mode === "dark" ? theme.colors.default.container : "#FFFFFF";
-    return {
-      backgroundColor: isBlurred ? theme.mode === "dark" ? "rgba(24, 24, 27, 0.82)" : "rgba(255, 255, 255, 0.82)" : isDefaultThemeColor ? defaultBackgroundColor : colorScheme.container,
-      borderColor: _core.withOpacity.call(void 0, colorScheme.main, 0.05)
-    };
-  }, [isBlurred, theme, themeColor]);
-};
-var useCardElevationStyles = (elevation = 0) => {
-  const theme = _chunk7UFBLUMVcjs.useXUITheme.call(void 0, );
-  return _react.useMemo.call(void 0, () => {
-    const shadowStyles = elevation === 0 ? {} : elevation === 1 ? theme.shadows.sm : elevation === 2 ? theme.shadows.md : elevation === 3 ? theme.shadows.lg : theme.shadows.xl;
-    return {
-      ...shadowStyles,
-      ...elevation > 0 ? { elevation } : {}
-    };
-  }, [elevation, theme]);
-};
-var useCardTextStyles = (themeColor) => {
-  const theme = _chunk7UFBLUMVcjs.useXUITheme.call(void 0, );
-  return _react.useMemo.call(void 0, () => {
-    const safeThemeColor = _core.getSafeThemeColor.call(void 0, themeColor);
-    const colorScheme = theme.colors[safeThemeColor];
-    return {
-      titleColor: colorScheme.main,
-      descriptionColor: theme.mode === "dark" ? _core.withOpacity.call(void 0, theme.colors.foreground, 0.8) : _core.withOpacity.call(void 0, theme.colors.foreground, 0.72)
-    };
-  }, [theme, themeColor]);
-};
-var useCardFooterStyles = (themeColor, isFooterBlurred) => {
-  const theme = _chunk7UFBLUMVcjs.useXUITheme.call(void 0, );
-  return _react.useMemo.call(void 0, () => {
-    const safeThemeColor = _core.getSafeThemeColor.call(void 0, themeColor);
-    const colorScheme = theme.colors[safeThemeColor];
-    if (!isFooterBlurred) {
-      return {};
-    }
-    return {
-      backgroundColor: theme.mode === "dark" ? "rgba(24, 24, 27, 0.68)" : "rgba(255, 255, 255, 0.72)",
-      borderTopWidth: theme.borderWidth.sm,
-      borderTopColor: theme.mode === "dark" ? _core.withOpacity.call(void 0, colorScheme.main, 0.4) : _core.withOpacity.call(void 0, colorScheme.main, 0.18)
-    };
-  }, [isFooterBlurred, theme, themeColor]);
-};
-
-// src/components/card/card.tsx
-var CardContext = _react2.default.createContext({
-  themeColor: "default",
-  isFooterBlurred: false
-});
-var Card = ({
-  children,
-  themeColor = "default",
-  radius = "lg",
-  padding = 16,
-  elevation = 0,
-  fullWidth = false,
-  isHoverable = false,
-  isPressable = false,
-  isBlurred = false,
-  isFooterBlurred = false,
-  isDisabled = false,
-  disableAnimation = false,
-  disableRipple: _disableRipple = false,
-  allowTextSelectionOnPress: _allowTextSelectionOnPress = false,
-  customAppearance,
-  onPress,
-  onLongPress,
-  onPressIn,
-  onPressOut
-}) => {
-  const animatedScale = _react2.default.useRef(new _reactnative.Animated.Value(1)).current;
-  const animatedOpacity = _react2.default.useRef(new _reactnative.Animated.Value(1)).current;
-  const radiusStyles = _chunk7UFBLUMVcjs.useBorderRadiusStyles.call(void 0, radius);
-  const containerStyles = useCardContainerStyles(themeColor, isBlurred);
-  const elevationStyles = useCardElevationStyles(elevation);
-  const contextValue = _react2.default.useMemo(
-    () => ({
-      themeColor,
-      isFooterBlurred,
-      customAppearance
-    }),
-    [customAppearance, isFooterBlurred, themeColor]
-  );
-  const animateTo = _react2.default.useCallback(
-    (scale, opacity, duration) => {
-      if (disableAnimation) {
-        animatedScale.setValue(scale);
-        animatedOpacity.setValue(opacity);
-        return;
-      }
-      _reactnative.Animated.parallel([
-        _reactnative.Animated.timing(animatedScale, {
-          toValue: scale,
-          duration,
-          useNativeDriver: true
-        }),
-        _reactnative.Animated.timing(animatedOpacity, {
-          toValue: opacity,
-          duration,
-          useNativeDriver: true
-        })
-      ]).start();
-    },
-    [animatedOpacity, animatedScale, disableAnimation]
-  );
-  const handlePressIn = _react2.default.useCallback(
-    (event) => {
-      if (!isDisabled && isPressable) {
-        animateTo(0.985, 0.95, 110);
-      }
-      _optionalChain([onPressIn, 'optionalCall', _ => _(event)]);
-    },
-    [animateTo, isDisabled, isPressable, onPressIn]
-  );
-  const handlePressOut = _react2.default.useCallback(
-    (event) => {
-      if (!isDisabled && isPressable) {
-        animateTo(1, 1, 140);
-      }
-      _optionalChain([onPressOut, 'optionalCall', _2 => _2(event)]);
-    },
-    [animateTo, isDisabled, isPressable, onPressOut]
-  );
-  const handleHoverIn = _react2.default.useCallback(() => {
-    if (!isDisabled && isHoverable && !isPressable) {
-      animateTo(1.01, 1, 130);
-    }
-  }, [animateTo, isDisabled, isHoverable, isPressable]);
-  const handleHoverOut = _react2.default.useCallback(() => {
-    if (!isDisabled && isHoverable && !isPressable) {
-      animateTo(1, 1, 130);
-    }
-  }, [animateTo, isDisabled, isHoverable, isPressable]);
-  const cardContent = /* @__PURE__ */ _react2.default.createElement(
-    _reactnative.Animated.View,
-    {
-      style: [
-        styles.card,
-        radiusStyles,
-        containerStyles,
-        elevationStyles,
-        fullWidth && styles.fullWidth,
-        isDisabled && styles.disabled,
-        {
-          padding,
-          transform: [{ scale: animatedScale }],
-          opacity: animatedOpacity
-        },
-        _optionalChain([customAppearance, 'optionalAccess', _3 => _3.container])
-      ]
-    },
-    /* @__PURE__ */ _react2.default.createElement(CardContext.Provider, { value: contextValue }, children)
-  );
-  if (!isPressable) {
-    return cardContent;
-  }
-  return /* @__PURE__ */ _react2.default.createElement(
-    _reactnative.Pressable,
-    {
-      onPress: isDisabled ? void 0 : onPress,
-      onLongPress: isDisabled ? void 0 : onLongPress,
-      onPressIn: handlePressIn,
-      onPressOut: handlePressOut,
-      onHoverIn: isHoverable ? handleHoverIn : void 0,
-      onHoverOut: isHoverable ? handleHoverOut : void 0,
-      disabled: isDisabled
-    },
-    cardContent
-  );
-};
-var CardHeader = ({
-  children,
-  customAppearance
-}) => {
-  const cardContext = _react2.default.useContext(CardContext);
-  return /* @__PURE__ */ _react2.default.createElement(
-    _reactnative.View,
-    {
-      style: [
-        styles.header,
-        _optionalChain([cardContext, 'access', _4 => _4.customAppearance, 'optionalAccess', _5 => _5.header]),
-        _optionalChain([customAppearance, 'optionalAccess', _6 => _6.container])
-      ]
-    },
-    children
-  );
-};
-var CardBody = ({
-  children,
-  customAppearance
-}) => {
-  const cardContext = _react2.default.useContext(CardContext);
-  return /* @__PURE__ */ _react2.default.createElement(
-    _reactnative.View,
-    {
-      style: [
-        styles.body,
-        _optionalChain([cardContext, 'access', _7 => _7.customAppearance, 'optionalAccess', _8 => _8.body]),
-        _optionalChain([customAppearance, 'optionalAccess', _9 => _9.container])
-      ]
-    },
-    children
-  );
-};
-var CardFooter = ({
-  children,
-  customAppearance
-}) => {
-  const cardContext = _react2.default.useContext(CardContext);
-  const footerStyles = useCardFooterStyles(
-    cardContext.themeColor,
-    cardContext.isFooterBlurred
-  );
-  return /* @__PURE__ */ _react2.default.createElement(
-    _reactnative.View,
-    {
-      style: [
-        styles.footer,
-        footerStyles,
-        _optionalChain([cardContext, 'access', _10 => _10.customAppearance, 'optionalAccess', _11 => _11.footer]),
-        _optionalChain([customAppearance, 'optionalAccess', _12 => _12.container])
-      ]
-    },
-    children
-  );
-};
-var CardTitle = ({
-  children,
-  customAppearance
-}) => {
-  const cardContext = _react2.default.useContext(CardContext);
-  const { titleColor } = useCardTextStyles(cardContext.themeColor);
-  return /* @__PURE__ */ _react2.default.createElement(
-    _reactnative.Text,
-    {
-      style: [
-        styles.title,
-        { color: titleColor },
-        _optionalChain([cardContext, 'access', _13 => _13.customAppearance, 'optionalAccess', _14 => _14.title]),
-        _optionalChain([customAppearance, 'optionalAccess', _15 => _15.text])
-      ]
-    },
-    children
-  );
-};
-var CardDescription = ({
-  children,
-  customAppearance
-}) => {
-  const cardContext = _react2.default.useContext(CardContext);
-  const { descriptionColor } = useCardTextStyles(cardContext.themeColor);
-  return /* @__PURE__ */ _react2.default.createElement(
-    _reactnative.Text,
-    {
-      style: [
-        styles.description,
-        { color: descriptionColor },
-        _optionalChain([cardContext, 'access', _16 => _16.customAppearance, 'optionalAccess', _17 => _17.description]),
-        _optionalChain([customAppearance, 'optionalAccess', _18 => _18.text])
-      ]
-    },
-    children
-  );
-};
-
-
-
-
-
-
-
-exports.Card = Card; exports.CardBody = CardBody; exports.CardDescription = CardDescription; exports.CardFooter = CardFooter; exports.CardHeader = CardHeader; exports.CardTitle = CardTitle;

package/dist/card/index.d.cts

@@ -1,191 +0,0 @@
-import React, { ReactNode } from 'react';
-import { ViewStyle, TextStyle, GestureResponderEvent } from 'react-native';
-import { ThemeColor, Radius } from '@xaui/core/types';
-import { E as ElevationLevel } from '../button.type-j1ZdkkSl.cjs';
-
-type CardCustomAppearance = {
-    /**
-     * Custom styles for the card container
-     */
-    container?: ViewStyle;
-    /**
-     * Custom styles for the card header section
-     */
-    header?: ViewStyle;
-    /**
-     * Custom styles for the card body section
-     */
-    body?: ViewStyle;
-    /**
-     * Custom styles for the card footer section
-     */
-    footer?: ViewStyle;
-    /**
-     * Custom styles for title text
-     */
-    title?: TextStyle;
-    /**
-     * Custom styles for description text
-     */
-    description?: TextStyle;
-};
-type CardProps = {
-    /**
-     * Content to render inside the card.
-     */
-    children: ReactNode;
-    /**
-     * The theme color of the card.
-     * @default 'default'
-     */
-    themeColor?: ThemeColor;
-    /**
-     * Card corner radius.
-     * @default 'lg'
-     */
-    radius?: Radius;
-    /**
-     * Card padding (applies to all sides).
-     * @default 16
-     */
-    padding?: number;
-    /**
-     * Android elevation level from 0 to 4.
-     * @default 0
-     */
-    elevation?: ElevationLevel;
-    /**
-     * Whether the card should take full width of its container.
-     * @default false
-     */
-    fullWidth?: boolean;
-    /**
-     * Whether hover interactions are enabled.
-     * @default false
-     */
-    isHoverable?: boolean;
-    /**
-     * Whether press interactions are enabled.
-     * @default false
-     */
-    isPressable?: boolean;
-    /**
-     * Whether the whole card should be blurred.
-     * @default false
-     */
-    isBlurred?: boolean;
-    /**
-     * Whether the footer section should be blurred.
-     * @default false
-     */
-    isFooterBlurred?: boolean;
-    /**
-     * Whether the card is disabled.
-     * @default false
-     */
-    isDisabled?: boolean;
-    /**
-     * Disable all card animations.
-     * @default false
-     */
-    disableAnimation?: boolean;
-    /**
-     * Disable press ripple animation.
-     * @default false
-     */
-    disableRipple?: boolean;
-    /**
-     * Allow text selection while pressing a pressable card.
-     * @default false
-     */
-    allowTextSelectionOnPress?: boolean;
-    /**
-     * Custom appearance styles for card parts.
-     */
-    customAppearance?: CardCustomAppearance;
-    /**
-     * Callback fired when card is pressed.
-     */
-    onPress?: (event: GestureResponderEvent) => void;
-    /**
-     * Callback fired when card is long pressed.
-     */
-    onLongPress?: (event: GestureResponderEvent) => void;
-    /**
-     * Callback fired when card press starts.
-     */
-    onPressIn?: (event: GestureResponderEvent) => void;
-    /**
-     * Callback fired when card press ends.
-     */
-    onPressOut?: (event: GestureResponderEvent) => void;
-};
-type CardHeaderProps = {
-    /**
-     * Header content.
-     */
-    children: ReactNode;
-    /**
-     * Custom styles for the header container.
-     */
-    customAppearance?: {
-        container?: ViewStyle;
-    };
-};
-type CardBodyProps = {
-    /**
-     * Body content.
-     */
-    children: ReactNode;
-    /**
-     * Custom styles for the body container.
-     */
-    customAppearance?: {
-        container?: ViewStyle;
-    };
-};
-type CardFooterProps = {
-    /**
-     * Footer content.
-     */
-    children: ReactNode;
-    /**
-     * Custom styles for the footer container.
-     */
-    customAppearance?: {
-        container?: ViewStyle;
-    };
-};
-type CardTitleProps = {
-    /**
-     * Title content.
-     */
-    children: ReactNode;
-    /**
-     * Custom styles for the title text.
-     */
-    customAppearance?: {
-        text?: TextStyle;
-    };
-};
-type CardDescriptionProps = {
-    /**
-     * Description content.
-     */
-    children: ReactNode;
-    /**
-     * Custom styles for the description text.
-     */
-    customAppearance?: {
-        text?: TextStyle;
-    };
-};
-
-declare const Card: React.FC<CardProps>;
-declare const CardHeader: React.FC<CardHeaderProps>;
-declare const CardBody: React.FC<CardBodyProps>;
-declare const CardFooter: React.FC<CardFooterProps>;
-declare const CardTitle: React.FC<CardTitleProps>;
-declare const CardDescription: React.FC<CardDescriptionProps>;
-
-export { Card, CardBody, type CardBodyProps, type CardCustomAppearance, CardDescription, type CardDescriptionProps, CardFooter, type CardFooterProps, CardHeader, type CardHeaderProps, type CardProps, CardTitle, type CardTitleProps };

package/dist/card/index.d.ts

@@ -1,191 +0,0 @@
-import React, { ReactNode } from 'react';
-import { ViewStyle, TextStyle, GestureResponderEvent } from 'react-native';
-import { ThemeColor, Radius } from '@xaui/core/types';
-import { E as ElevationLevel } from '../button.type-j1ZdkkSl.js';
-
-type CardCustomAppearance = {
-    /**
-     * Custom styles for the card container
-     */
-    container?: ViewStyle;
-    /**
-     * Custom styles for the card header section
-     */
-    header?: ViewStyle;
-    /**
-     * Custom styles for the card body section
-     */
-    body?: ViewStyle;
-    /**
-     * Custom styles for the card footer section
-     */
-    footer?: ViewStyle;
-    /**
-     * Custom styles for title text
-     */
-    title?: TextStyle;
-    /**
-     * Custom styles for description text
-     */
-    description?: TextStyle;
-};
-type CardProps = {
-    /**
-     * Content to render inside the card.
-     */
-    children: ReactNode;
-    /**
-     * The theme color of the card.
-     * @default 'default'
-     */
-    themeColor?: ThemeColor;
-    /**
-     * Card corner radius.
-     * @default 'lg'
-     */
-    radius?: Radius;
-    /**
-     * Card padding (applies to all sides).
-     * @default 16
-     */
-    padding?: number;
-    /**
-     * Android elevation level from 0 to 4.
-     * @default 0
-     */
-    elevation?: ElevationLevel;
-    /**
-     * Whether the card should take full width of its container.
-     * @default false
-     */
-    fullWidth?: boolean;
-    /**
-     * Whether hover interactions are enabled.
-     * @default false
-     */
-    isHoverable?: boolean;
-    /**
-     * Whether press interactions are enabled.
-     * @default false
-     */
-    isPressable?: boolean;
-    /**
-     * Whether the whole card should be blurred.
-     * @default false
-     */
-    isBlurred?: boolean;
-    /**
-     * Whether the footer section should be blurred.
-     * @default false
-     */
-    isFooterBlurred?: boolean;
-    /**
-     * Whether the card is disabled.
-     * @default false
-     */
-    isDisabled?: boolean;
-    /**
-     * Disable all card animations.
-     * @default false
-     */
-    disableAnimation?: boolean;
-    /**
-     * Disable press ripple animation.
-     * @default false
-     */
-    disableRipple?: boolean;
-    /**
-     * Allow text selection while pressing a pressable card.
-     * @default false
-     */
-    allowTextSelectionOnPress?: boolean;
-    /**
-     * Custom appearance styles for card parts.
-     */
-    customAppearance?: CardCustomAppearance;
-    /**
-     * Callback fired when card is pressed.
-     */
-    onPress?: (event: GestureResponderEvent) => void;
-    /**
-     * Callback fired when card is long pressed.
-     */
-    onLongPress?: (event: GestureResponderEvent) => void;
-    /**
-     * Callback fired when card press starts.
-     */
-    onPressIn?: (event: GestureResponderEvent) => void;
-    /**
-     * Callback fired when card press ends.
-     */
-    onPressOut?: (event: GestureResponderEvent) => void;
-};
-type CardHeaderProps = {
-    /**
-     * Header content.
-     */
-    children: ReactNode;
-    /**
-     * Custom styles for the header container.
-     */
-    customAppearance?: {
-        container?: ViewStyle;
-    };
-};
-type CardBodyProps = {
-    /**
-     * Body content.
-     */
-    children: ReactNode;
-    /**
-     * Custom styles for the body container.
-     */
-    customAppearance?: {
-        container?: ViewStyle;
-    };
-};
-type CardFooterProps = {
-    /**
-     * Footer content.
-     */
-    children: ReactNode;
-    /**
-     * Custom styles for the footer container.
-     */
-    customAppearance?: {
-        container?: ViewStyle;
-    };
-};
-type CardTitleProps = {
-    /**
-     * Title content.
-     */
-    children: ReactNode;
-    /**
-     * Custom styles for the title text.
-     */
-    customAppearance?: {
-        text?: TextStyle;
-    };
-};
-type CardDescriptionProps = {
-    /**
-     * Description content.
-     */
-    children: ReactNode;
-    /**
-     * Custom styles for the description text.
-     */
-    customAppearance?: {
-        text?: TextStyle;
-    };
-};
-
-declare const Card: React.FC<CardProps>;
-declare const CardHeader: React.FC<CardHeaderProps>;
-declare const CardBody: React.FC<CardBodyProps>;
-declare const CardFooter: React.FC<CardFooterProps>;
-declare const CardTitle: React.FC<CardTitleProps>;
-declare const CardDescription: React.FC<CardDescriptionProps>;
-
-export { Card, CardBody, type CardBodyProps, type CardCustomAppearance, CardDescription, type CardDescriptionProps, CardFooter, type CardFooterProps, CardHeader, type CardHeaderProps, type CardProps, CardTitle, type CardTitleProps };