@xaui/native 0.2.7 → 0.9.1-alpha.0

package/dist/skeleton/index.cjs

@@ -1,89 +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(); } }require('../chunk-56RPWZD2.cjs');
-
-
-var _chunk7UFBLUMVcjs = require('../chunk-7UFBLUMV.cjs');
-
-// src/components/skeleton/skeleton.tsx
-var _react = require('react'); var _react2 = _interopRequireDefault(_react);
-var _reactnative = require('react-native');
-
-// src/components/skeleton/skeleton.style.ts
-
-var styles = _reactnative.StyleSheet.create({
-  skeleton: {
-    width: "100%",
-    height: 16,
-    borderRadius: 8,
-    overflow: "hidden"
-  }
-});
-
-// src/components/skeleton/skeleton.tsx
-var Skeleton = ({
-  children,
-  isLoaded,
-  disableAnimation = false,
-  skeletonColor,
-  width,
-  height,
-  radius = "md",
-  style
-}) => {
-  const theme = _chunk7UFBLUMVcjs.useXUITheme.call(void 0, );
-  const opacity = _react.useRef.call(void 0, new _reactnative.Animated.Value(0.6)).current;
-  const resolvedColor = _react.useMemo.call(void 0, 
-    () => _nullishCoalesce(skeletonColor, () => ( theme.colors.default.container)),
-    [skeletonColor, theme.colors.default.container]
-  );
-  const resolvedRadius = _react.useMemo.call(void 0, 
-    () => theme.borderRadius[radius],
-    [radius, theme.borderRadius]
-  );
-  _react.useEffect.call(void 0, () => {
-    if (isLoaded || disableAnimation) {
-      opacity.setValue(1);
-      return;
-    }
-    const loop = _reactnative.Animated.loop(
-      _reactnative.Animated.sequence([
-        _reactnative.Animated.timing(opacity, {
-          toValue: 0.35,
-          duration: 700,
-          useNativeDriver: true
-        }),
-        _reactnative.Animated.timing(opacity, {
-          toValue: 0.9,
-          duration: 700,
-          useNativeDriver: true
-        })
-      ])
-    );
-    loop.start();
-    return () => {
-      loop.stop();
-    };
-  }, [disableAnimation, isLoaded, opacity]);
-  if (isLoaded) {
-    return /* @__PURE__ */ _react2.default.createElement(_react2.default.Fragment, null, children);
-  }
-  return /* @__PURE__ */ _react2.default.createElement(
-    _reactnative.Animated.View,
-    {
-      style: [
-        styles.skeleton,
-        {
-          backgroundColor: resolvedColor,
-          width,
-          height,
-          borderRadius: resolvedRadius,
-          opacity
-        },
-        style
-      ]
-    }
-  );
-};
-Skeleton.displayName = "Skeleton";
-
-
-exports.Skeleton = Skeleton;

package/dist/skeleton/index.d.cts

@@ -1,45 +0,0 @@
-import React, { ReactNode } from 'react';
-import { ColorValue, DimensionValue, StyleProp, ViewStyle } from 'react-native';
-import { Radius } from '@xaui/core/types';
-
-type SkeletonProps = {
-    /**
-     * The content to display when loading completes.
-     */
-    children: ReactNode;
-    /**
-     * Whether the content is loaded.
-     * @default false
-     */
-    isLoaded: boolean;
-    /**
-     * Whether to disable the animation.
-     * @default false
-     */
-    disableAnimation?: boolean;
-    /**
-     * Custom background color for the skeleton.
-     */
-    skeletonColor?: ColorValue;
-    /**
-     * Width of the skeleton.
-     */
-    width?: DimensionValue;
-    /**
-     * Height of the skeleton.
-     */
-    height?: DimensionValue;
-    /**
-     * Border radius of the skeleton.
-     * @default 'md'
-     */
-    radius?: Radius;
-    /**
-     * Custom style for the skeleton container.
-     */
-    style?: StyleProp<ViewStyle>;
-};
-
-declare const Skeleton: React.FC<SkeletonProps>;
-
-export { Skeleton, type SkeletonProps };

package/dist/skeleton/index.d.ts

@@ -1,45 +0,0 @@
-import React, { ReactNode } from 'react';
-import { ColorValue, DimensionValue, StyleProp, ViewStyle } from 'react-native';
-import { Radius } from '@xaui/core/types';
-
-type SkeletonProps = {
-    /**
-     * The content to display when loading completes.
-     */
-    children: ReactNode;
-    /**
-     * Whether the content is loaded.
-     * @default false
-     */
-    isLoaded: boolean;
-    /**
-     * Whether to disable the animation.
-     * @default false
-     */
-    disableAnimation?: boolean;
-    /**
-     * Custom background color for the skeleton.
-     */
-    skeletonColor?: ColorValue;
-    /**
-     * Width of the skeleton.
-     */
-    width?: DimensionValue;
-    /**
-     * Height of the skeleton.
-     */
-    height?: DimensionValue;
-    /**
-     * Border radius of the skeleton.
-     * @default 'md'
-     */
-    radius?: Radius;
-    /**
-     * Custom style for the skeleton container.
-     */
-    style?: StyleProp<ViewStyle>;
-};
-
-declare const Skeleton: React.FC<SkeletonProps>;
-
-export { Skeleton, type SkeletonProps };

package/dist/skeleton/index.js

@@ -1,89 +0,0 @@
-import "../chunk-SHBDANQN.js";
-import {
-  useXUITheme
-} from "../chunk-RBSA4NH4.js";
-
-// src/components/skeleton/skeleton.tsx
-import React, { useEffect, useMemo, useRef } from "react";
-import { Animated } from "react-native";
-
-// src/components/skeleton/skeleton.style.ts
-import { StyleSheet } from "react-native";
-var styles = StyleSheet.create({
-  skeleton: {
-    width: "100%",
-    height: 16,
-    borderRadius: 8,
-    overflow: "hidden"
-  }
-});
-
-// src/components/skeleton/skeleton.tsx
-var Skeleton = ({
-  children,
-  isLoaded,
-  disableAnimation = false,
-  skeletonColor,
-  width,
-  height,
-  radius = "md",
-  style
-}) => {
-  const theme = useXUITheme();
-  const opacity = useRef(new Animated.Value(0.6)).current;
-  const resolvedColor = useMemo(
-    () => skeletonColor ?? theme.colors.default.container,
-    [skeletonColor, theme.colors.default.container]
-  );
-  const resolvedRadius = useMemo(
-    () => theme.borderRadius[radius],
-    [radius, theme.borderRadius]
-  );
-  useEffect(() => {
-    if (isLoaded || disableAnimation) {
-      opacity.setValue(1);
-      return;
-    }
-    const loop = Animated.loop(
-      Animated.sequence([
-        Animated.timing(opacity, {
-          toValue: 0.35,
-          duration: 700,
-          useNativeDriver: true
-        }),
-        Animated.timing(opacity, {
-          toValue: 0.9,
-          duration: 700,
-          useNativeDriver: true
-        })
-      ])
-    );
-    loop.start();
-    return () => {
-      loop.stop();
-    };
-  }, [disableAnimation, isLoaded, opacity]);
-  if (isLoaded) {
-    return /* @__PURE__ */ React.createElement(React.Fragment, null, children);
-  }
-  return /* @__PURE__ */ React.createElement(
-    Animated.View,
-    {
-      style: [
-        styles.skeleton,
-        {
-          backgroundColor: resolvedColor,
-          width,
-          height,
-          borderRadius: resolvedRadius,
-          opacity
-        },
-        style
-      ]
-    }
-  );
-};
-Skeleton.displayName = "Skeleton";
-export {
-  Skeleton
-};