@luxfi/ui 5.6.0 → 6.0.0

package/dist/skeleton.js

@@ -1,346 +0,0 @@
-"use client";
-import * as React from 'react';
-import { clsx } from 'clsx';
-import { twMerge } from 'tailwind-merge';
-import { jsx } from 'react/jsx-runtime';
-
-// src/skeleton.tsx
-function cn(...inputs) {
-  return twMerge(clsx(inputs));
-}
-var SPACING_SCALE = 4;
-function toStylePx(value) {
-  if (value === void 0) return void 0;
-  if (typeof value === "string") return value;
-  return `${value * SPACING_SCALE}px`;
-}
-function extractSkeletonStyleProps(props) {
-  const style = {};
-  const rest = {};
-  function resolveDimension(value) {
-    if (value === void 0 || value === null) return void 0;
-    if (typeof value === "number") return `${value * SPACING_SCALE}px`;
-    if (typeof value === "string") return value;
-    if (typeof value === "object") {
-      const obj = value;
-      return obj.base ?? obj.lg ?? obj.xl ?? Object.values(obj)[0];
-    }
-    return void 0;
-  }
-  for (const [key, value] of Object.entries(props)) {
-    if (value === void 0) continue;
-    switch (key) {
-      case "w": {
-        const v = resolveDimension(value);
-        if (v) style.width = v;
-        break;
-      }
-      case "h": {
-        const v = resolveDimension(value);
-        if (v) style.height = v;
-        break;
-      }
-      case "minW": {
-        const v = resolveDimension(value);
-        if (v) style.minWidth = v;
-        break;
-      }
-      case "maxW": {
-        const v = resolveDimension(value);
-        if (v) style.maxWidth = v;
-        break;
-      }
-      case "height":
-        style.height = value;
-        break;
-      case "display":
-        style.display = value;
-        break;
-      case "flexGrow":
-        style.flexGrow = value;
-        break;
-      case "flexShrink":
-        style.flexShrink = value;
-        break;
-      case "flexBasis":
-        style.flexBasis = value;
-        break;
-      case "fontWeight":
-        style.fontWeight = value;
-        break;
-      case "borderRadius":
-        style.borderRadius = value;
-        break;
-      case "alignSelf":
-        style.alignSelf = value;
-        break;
-      case "alignItems":
-        style.alignItems = value;
-        break;
-      case "justifyContent":
-        style.justifyContent = value;
-        break;
-      case "color":
-        style.color = value;
-        break;
-      case "mt":
-        style.marginTop = toStylePx(value);
-        break;
-      case "mb":
-        style.marginBottom = toStylePx(value);
-        break;
-      case "ml":
-        style.marginLeft = toStylePx(value);
-        break;
-      case "mr":
-        style.marginRight = toStylePx(value);
-        break;
-      case "overflow":
-        style.overflow = value;
-        break;
-      case "whiteSpace":
-        style.whiteSpace = value;
-        break;
-      case "textOverflow":
-        style.textOverflow = value;
-        break;
-      case "textTransform":
-        style.textTransform = value;
-        break;
-      case "gap":
-        style.gap = typeof value === "number" ? `${value * SPACING_SCALE}px` : value;
-        break;
-      case "gridTemplateColumns":
-        style.gridTemplateColumns = value;
-        break;
-      case "minWidth":
-        style.minWidth = value;
-        break;
-      case "boxSize": {
-        const s = typeof value === "number" ? `${value * SPACING_SCALE}px` : value;
-        style.width = s;
-        style.height = s;
-        break;
-      }
-      case "py": {
-        const v = toStylePx(value);
-        style.paddingTop = v;
-        style.paddingBottom = v;
-        break;
-      }
-      case "px": {
-        const v = toStylePx(value);
-        style.paddingLeft = v;
-        style.paddingRight = v;
-        break;
-      }
-      case "p": {
-        const v = toStylePx(value);
-        style.padding = v;
-        break;
-      }
-      case "hideBelow":
-        break;
-      // handled via className
-      case "textStyle":
-        break;
-      // drop textStyle, not directly applicable
-      case "fontSize":
-        style.fontSize = value;
-        break;
-      case "flexWrap":
-        style.flexWrap = value;
-        break;
-      case "wordBreak":
-        style.wordBreak = value;
-        break;
-      case "lineHeight":
-        style.lineHeight = value;
-        break;
-      case "marginRight":
-        style.marginRight = value;
-        break;
-      case "position":
-        style.position = value;
-        break;
-      case "background":
-        style.background = value;
-        break;
-      default:
-        rest[key] = value;
-        break;
-    }
-  }
-  return { style, rest };
-}
-var Skeleton = React.forwardRef(
-  function Skeleton2(props, ref) {
-    const {
-      loading = false,
-      asChild,
-      className,
-      children,
-      style: styleProp,
-      // Destructure style-prop shims so they don't leak into DOM
-      w: _w,
-      h: _h,
-      minW: _minW,
-      maxW: _maxW,
-      display: _display,
-      flexGrow: _flexGrow,
-      flexShrink: _flexShrink,
-      flexBasis: _flexBasis,
-      fontWeight: _fontWeight,
-      textStyle: _textStyle,
-      borderRadius: _borderRadius,
-      alignSelf: _alignSelf,
-      alignItems: _alignItems,
-      justifyContent: _justifyContent,
-      color: _color,
-      mt: _mt,
-      mb: _mb,
-      ml: _ml,
-      mr: _mr,
-      height: _height,
-      overflow: _overflow,
-      whiteSpace: _whiteSpace,
-      textOverflow: _textOverflow,
-      textTransform: _textTransform,
-      gap: _gap,
-      gridTemplateColumns: _gridTemplateColumns,
-      minWidth: _minWidth,
-      boxSize: _boxSize,
-      py: _py,
-      px: _px,
-      p: _p,
-      hideBelow: _hideBelow,
-      fontSize: _fontSize,
-      flexWrap: _flexWrap,
-      wordBreak: _wordBreak,
-      lineHeight: _lineHeight,
-      marginRight: _marginRight,
-      position: _position,
-      background: _background,
-      as: Component = "div",
-      ...htmlRest
-    } = props;
-    const { style: shimStyle } = extractSkeletonStyleProps({
-      w: _w,
-      h: _h,
-      minW: _minW,
-      maxW: _maxW,
-      display: _display,
-      flexGrow: _flexGrow,
-      flexShrink: _flexShrink,
-      flexBasis: _flexBasis,
-      fontWeight: _fontWeight,
-      textStyle: _textStyle,
-      borderRadius: _borderRadius,
-      alignSelf: _alignSelf,
-      alignItems: _alignItems,
-      justifyContent: _justifyContent,
-      color: _color,
-      mt: _mt,
-      mb: _mb,
-      ml: _ml,
-      mr: _mr,
-      height: _height,
-      overflow: _overflow,
-      whiteSpace: _whiteSpace,
-      textOverflow: _textOverflow,
-      textTransform: _textTransform,
-      gap: _gap,
-      gridTemplateColumns: _gridTemplateColumns,
-      minWidth: _minWidth,
-      boxSize: _boxSize,
-      py: _py,
-      px: _px,
-      p: _p,
-      hideBelow: _hideBelow,
-      fontSize: _fontSize,
-      flexWrap: _flexWrap,
-      wordBreak: _wordBreak,
-      lineHeight: _lineHeight,
-      marginRight: _marginRight,
-      position: _position,
-      background: _background
-    });
-    const mergedStyle = Object.keys(shimStyle).length > 0 || styleProp ? { ...shimStyle, ...styleProp } : void 0;
-    const HIDE_BELOW_MAP = { lg: "lg:hidden", md: "md:hidden", sm: "sm:hidden" };
-    const hideBelowClass = _hideBelow ? HIDE_BELOW_MAP[_hideBelow] : void 0;
-    const finalClassName = hideBelowClass ? cn(className, hideBelowClass) : className;
-    if (!loading) {
-      if (asChild && React.isValidElement(children)) {
-        return children;
-      }
-      return /* @__PURE__ */ jsx(Component, { ref, className: finalClassName, style: mergedStyle, ...htmlRest, children });
-    }
-    if (asChild && React.isValidElement(children)) {
-      return /* @__PURE__ */ jsx(
-        Component,
-        {
-          ref,
-          "data-loading": true,
-          className: cn(
-            "animate-skeleton-shimmer rounded-sm",
-            "bg-[linear-gradient(90deg,var(--color-skeleton-start)_0%,var(--color-skeleton-end)_50%,var(--color-skeleton-start)_100%)]",
-            "bg-[length:200%_100%]",
-            "text-transparent [&_*]:invisible",
-            finalClassName
-          ),
-          style: mergedStyle,
-          ...htmlRest,
-          children
-        }
-      );
-    }
-    return /* @__PURE__ */ jsx(
-      Component,
-      {
-        ref,
-        "data-loading": true,
-        className: cn(
-          "animate-skeleton-shimmer rounded-sm",
-          "bg-[linear-gradient(90deg,var(--color-skeleton-start)_0%,var(--color-skeleton-end)_50%,var(--color-skeleton-start)_100%)]",
-          "bg-[length:200%_100%]",
-          children ? "text-transparent [&_*]:invisible" : "min-h-5",
-          finalClassName
-        ),
-        style: mergedStyle,
-        ...htmlRest,
-        children
-      }
-    );
-  }
-);
-var SkeletonCircle = React.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,
-        className: cn("rounded-full shrink-0", className),
-        style: { width: dimension, height: dimension, ...rest.style },
-        ...rest
-      }
-    );
-  }
-);
-var SkeletonText = React.forwardRef(
-  function SkeletonText2(props, ref) {
-    const { noOfLines = 3, loading = true, className, ...rest } = props;
-    return /* @__PURE__ */ jsx("div", { ref, className: cn("flex w-full flex-col gap-2", className), ...rest, children: Array.from({ length: noOfLines }).map((_, index) => /* @__PURE__ */ jsx(
-      Skeleton,
-      {
-        loading,
-        className: cn("h-4", index === noOfLines - 1 && "max-w-[80%]")
-      },
-      index
-    )) });
-  }
-);
-
-export { Skeleton, SkeletonCircle, SkeletonText };

package/dist/slider.cjs

@@ -1,138 +0,0 @@
-"use client";
-'use strict';
-
-var RadixSlider = require('@radix-ui/react-slider');
-var React = require('react');
-var clsx = require('clsx');
-var tailwindMerge = require('tailwind-merge');
-var jsxRuntime = require('react/jsx-runtime');
-
-function _interopNamespace(e) {
-  if (e && e.__esModule) return e;
-  var n = Object.create(null);
-  if (e) {
-    Object.keys(e).forEach(function (k) {
-      if (k !== 'default') {
-        var d = Object.getOwnPropertyDescriptor(e, k);
-        Object.defineProperty(n, k, d.get ? d : {
-          enumerable: true,
-          get: function () { return e[k]; }
-        });
-      }
-    });
-  }
-  n.default = e;
-  return Object.freeze(n);
-}
-
-var RadixSlider__namespace = /*#__PURE__*/_interopNamespace(RadixSlider);
-var React__namespace = /*#__PURE__*/_interopNamespace(React);
-
-// src/slider.tsx
-function cn(...inputs) {
-  return tailwindMerge.twMerge(clsx.clsx(inputs));
-}
-var THUMB_SIZE = 20;
-var TRACK_HEIGHT = 6;
-var Slider = React__namespace.forwardRef(
-  function Slider2(props, ref) {
-    const {
-      marks: marksProp,
-      label,
-      showValue,
-      value,
-      defaultValue,
-      min = 0,
-      max = 100,
-      step,
-      disabled,
-      orientation,
-      name,
-      onValueChange,
-      onValueCommit,
-      className
-    } = props;
-    const resolvedValue = defaultValue ?? value;
-    const marks = marksProp?.map((mark) => {
-      if (typeof mark === "number") return { value: mark, label: void 0 };
-      return mark;
-    });
-    const hasMarkLabel = Boolean(marks?.some((mark) => mark.label));
-    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex flex-col gap-1", className), children: [
-      label && !showValue && /* @__PURE__ */ jsxRuntime.jsx("label", { className: "text-sm font-medium text-text-secondary", children: label }),
-      label && showValue && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
-        /* @__PURE__ */ jsxRuntime.jsx("label", { className: "text-sm font-medium text-text-secondary", children: label }),
-        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm text-text-secondary", children: (value ?? defaultValue ?? [])?.join(", ") })
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsxs(
-        RadixSlider__namespace.Root,
-        {
-          ref,
-          className: cn(
-            "relative flex w-full touch-none select-none items-center",
-            hasMarkLabel && "mb-6"
-          ),
-          value,
-          defaultValue,
-          min,
-          max,
-          step,
-          disabled,
-          orientation,
-          name,
-          onValueChange,
-          onValueCommit,
-          children: [
-            /* @__PURE__ */ jsxRuntime.jsx(
-              RadixSlider__namespace.Track,
-              {
-                className: cn(
-                  "relative grow rounded-full bg-border-divider",
-                  `h-[${TRACK_HEIGHT}px]`
-                ),
-                children: /* @__PURE__ */ jsxRuntime.jsx(RadixSlider__namespace.Range, { className: "absolute h-full rounded-full bg-link-primary" })
-              }
-            ),
-            resolvedValue?.map((_, index) => /* @__PURE__ */ jsxRuntime.jsx(
-              RadixSlider__namespace.Thumb,
-              {
-                className: cn(
-                  `block h-[${THUMB_SIZE}px] w-[${THUMB_SIZE}px]`,
-                  "rounded-full border-2 border-link-primary bg-white",
-                  "shadow-sm transition-colors",
-                  "hover:border-link-primary-hover",
-                  "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-link-primary focus-visible:ring-offset-2",
-                  "disabled:pointer-events-none disabled:opacity-50"
-                )
-              },
-              index
-            ))
-          ]
-        }
-      ),
-      /* @__PURE__ */ jsxRuntime.jsx(SliderMarks, { marks, min, max })
-    ] });
-  }
-);
-function SliderMarks(props) {
-  const { marks, min, max } = props;
-  if (!marks?.length) return null;
-  const range = max - min;
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative w-full h-4", children: marks.map((mark, index) => {
-    const percent = (mark.value - min) / range * 100;
-    return /* @__PURE__ */ jsxRuntime.jsxs(
-      "div",
-      {
-        className: "absolute flex flex-col items-center -translate-x-1/2",
-        style: { left: `${percent}%` },
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-1.5 w-0.5 bg-border-divider" }),
-          mark.label != null && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "mt-0.5 text-xs text-text-secondary whitespace-nowrap", children: mark.label })
-        ]
-      },
-      index
-    );
-  }) });
-}
-
-exports.Slider = Slider;

package/dist/slider.js

@@ -1,115 +0,0 @@
-"use client";
-import * as RadixSlider from '@radix-ui/react-slider';
-import * as React from 'react';
-import { clsx } from 'clsx';
-import { twMerge } from 'tailwind-merge';
-import { jsxs, jsx } from 'react/jsx-runtime';
-
-// src/slider.tsx
-function cn(...inputs) {
-  return twMerge(clsx(inputs));
-}
-var THUMB_SIZE = 20;
-var TRACK_HEIGHT = 6;
-var Slider = React.forwardRef(
-  function Slider2(props, ref) {
-    const {
-      marks: marksProp,
-      label,
-      showValue,
-      value,
-      defaultValue,
-      min = 0,
-      max = 100,
-      step,
-      disabled,
-      orientation,
-      name,
-      onValueChange,
-      onValueCommit,
-      className
-    } = props;
-    const resolvedValue = defaultValue ?? value;
-    const marks = marksProp?.map((mark) => {
-      if (typeof mark === "number") return { value: mark, label: void 0 };
-      return mark;
-    });
-    const hasMarkLabel = Boolean(marks?.some((mark) => mark.label));
-    return /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col gap-1", className), children: [
-      label && !showValue && /* @__PURE__ */ jsx("label", { className: "text-sm font-medium text-text-secondary", children: label }),
-      label && showValue && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
-        /* @__PURE__ */ jsx("label", { className: "text-sm font-medium text-text-secondary", children: label }),
-        /* @__PURE__ */ jsx("span", { className: "text-sm text-text-secondary", children: (value ?? defaultValue ?? [])?.join(", ") })
-      ] }),
-      /* @__PURE__ */ jsxs(
-        RadixSlider.Root,
-        {
-          ref,
-          className: cn(
-            "relative flex w-full touch-none select-none items-center",
-            hasMarkLabel && "mb-6"
-          ),
-          value,
-          defaultValue,
-          min,
-          max,
-          step,
-          disabled,
-          orientation,
-          name,
-          onValueChange,
-          onValueCommit,
-          children: [
-            /* @__PURE__ */ jsx(
-              RadixSlider.Track,
-              {
-                className: cn(
-                  "relative grow rounded-full bg-border-divider",
-                  `h-[${TRACK_HEIGHT}px]`
-                ),
-                children: /* @__PURE__ */ jsx(RadixSlider.Range, { className: "absolute h-full rounded-full bg-link-primary" })
-              }
-            ),
-            resolvedValue?.map((_, index) => /* @__PURE__ */ jsx(
-              RadixSlider.Thumb,
-              {
-                className: cn(
-                  `block h-[${THUMB_SIZE}px] w-[${THUMB_SIZE}px]`,
-                  "rounded-full border-2 border-link-primary bg-white",
-                  "shadow-sm transition-colors",
-                  "hover:border-link-primary-hover",
-                  "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-link-primary focus-visible:ring-offset-2",
-                  "disabled:pointer-events-none disabled:opacity-50"
-                )
-              },
-              index
-            ))
-          ]
-        }
-      ),
-      /* @__PURE__ */ jsx(SliderMarks, { marks, min, max })
-    ] });
-  }
-);
-function SliderMarks(props) {
-  const { marks, min, max } = props;
-  if (!marks?.length) return null;
-  const range = max - min;
-  return /* @__PURE__ */ jsx("div", { className: "relative w-full h-4", children: marks.map((mark, index) => {
-    const percent = (mark.value - min) / range * 100;
-    return /* @__PURE__ */ jsxs(
-      "div",
-      {
-        className: "absolute flex flex-col items-center -translate-x-1/2",
-        style: { left: `${percent}%` },
-        children: [
-          /* @__PURE__ */ jsx("div", { className: "h-1.5 w-0.5 bg-border-divider" }),
-          mark.label != null && /* @__PURE__ */ jsx("span", { className: "mt-0.5 text-xs text-text-secondary whitespace-nowrap", children: mark.label })
-        ]
-      },
-      index
-    );
-  }) });
-}
-
-export { Slider };