@luxfi/ui 8.2.6 → 8.2.8

package/dist/image.js

@@ -1,64 +1,9 @@
-"use client";
-import * as React2 from 'react';
-import React2__default from 'react';
-import { Box, sx, cn } from '@hanzo/ui';
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+'use client';
+import React from 'react';
+import { Box, cn } from '@hanzo/ui';
+import { Skeleton } from './skeleton.js';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 
-// src/image.tsx
-var SKELETON_CLASSES = "lux-skeleton rounded-sm";
-var Skeleton = React2.forwardRef(
-  function Skeleton2(props, ref) {
-    const { loading = true, asChild, className, children, style, ...rest } = props;
-    if (!loading) {
-      if (asChild && React2.isValidElement(children)) return children;
-      return /* @__PURE__ */ jsx(Box, { ref, className, style, ...rest, children });
-    }
-    return /* @__PURE__ */ jsx(
-      "div",
-      {
-        ref,
-        "data-loading": true,
-        ...sx(
-          SKELETON_CLASSES,
-          asChild || children ? "[&_*]:invisible" : "min-h-5",
-          className
-        ),
-        style,
-        ...rest,
-        children
-      }
-    );
-  }
-);
-React2.forwardRef(
-  function SkeletonCircle2(props, ref) {
-    const { size = 40, loading = true, className, ...rest } = props;
-    const dimension = typeof size === "number" ? `${size}px` : size;
-    return /* @__PURE__ */ jsx(
-      Skeleton,
-      {
-        ref,
-        loading,
-        ...sx("rounded-full shrink-0", className),
-        style: { width: dimension, height: dimension, ...rest.style },
-        ...rest
-      }
-    );
-  }
-);
-React2.forwardRef(
-  function SkeletonText2(props, ref) {
-    const { noOfLines = 3, loading = true, className, ...rest } = props;
-    return /* @__PURE__ */ jsx(Box, { ref, className: cn("flex w-full flex-col gap-2", className), ...rest, children: Array.from({ length: noOfLines }).map((_, index) => /* @__PURE__ */ jsx(
-      Skeleton,
-      {
-        loading,
-        ...sx(cn("h-4", index === noOfLines - 1 && "max-w-[80%]"))
-      },
-      index
-    )) });
-  }
-);
 var CHAKRA_SPACING_SCALE = {
   "0": "0px",
   "1": "0.25rem",
@@ -206,31 +151,31 @@ function extractStyleProps(props) {
   }
   return { styleProps, rest };
 }
-var Image = React2__default.forwardRef(
+var Image = React.forwardRef(
   function Image2(props, ref) {
     const { fallback, src, onLoad, onError, skeletonWidth, skeletonHeight, alt, className, style: styleProp, ...allRest } = props;
     const { styleProps, rest: extraProps } = extractStyleProps(allRest);
-    const [loading, setLoading] = React2__default.useState(true);
-    const [error, setError] = React2__default.useState(false);
-    const handleLoadError = React2__default.useCallback((event) => {
+    const [loading, setLoading] = React.useState(true);
+    const [error, setError] = React.useState(false);
+    const handleLoadError = React.useCallback((event) => {
       setError(true);
       setLoading(false);
       onError?.(event);
     }, [onError]);
-    const handleLoadSuccess = React2__default.useCallback((event) => {
+    const handleLoadSuccess = React.useCallback((event) => {
       setLoading(false);
       onLoad?.(event);
     }, [onLoad]);
     const passthroughProps = allRest;
     if (!src && fallback) {
-      if (React2__default.isValidElement(fallback)) {
-        return React2__default.cloneElement(fallback, passthroughProps);
+      if (React.isValidElement(fallback)) {
+        return React.cloneElement(fallback, passthroughProps);
       }
       return fallback;
     }
     if (error) {
-      if (React2__default.isValidElement(fallback)) {
-        return React2__default.cloneElement(fallback, passthroughProps);
+      if (React.isValidElement(fallback)) {
+        return React.cloneElement(fallback, passthroughProps);
       }
       return fallback;
     }