@nexus-cross/design-system 1.0.4-beta.1 → 1.0.4

package/dist/chunks/{chunk-TR5JBBEA.mjs → chunk-MRRKW5QN.mjs}

@@ -1,43 +1,34 @@
-import { cn } from './chunk-XALPBGSC.mjs';
+import { cn } from './chunk-MCKOWMLS.mjs';
 import * as React from 'react';
 import { cva } from 'class-variance-authority';
 import { jsxs, jsx } from 'react/jsx-runtime';
 
-var checkBoxVariants = cva(
-  "nx:inline-flex nx:items-center nx:gap-2 nx:select-none",
-  {
-    variants: {
-      size: {
-        sm: "nx:text-xs",
-        md: "nx:text-sm"
-      },
-      shape: {
-        square: "",
-        round: ""
-      }
+var checkBoxVariants = cva("nexus-checkbox", {
+  variants: {
+    size: {
+      sm: "nexus-checkbox--sm",
+      md: "nexus-checkbox--md"
     },
-    defaultVariants: { size: "md", shape: "square" }
-  }
-);
-var boxVariants = cva(
-  [
-    "nx:inline-flex nx:shrink-0 nx:items-center nx:justify-center nx:border nx:transition-colors nx:duration-150",
-    "nx:peer-disabled:opacity-50 nx:peer-disabled:cursor-not-allowed"
-  ],
-  {
-    variants: {
-      size: {
-        sm: "nx:size-4",
-        md: "nx:size-5"
-      },
-      shape: {
-        square: "nx:rounded",
-        round: "nx:rounded-full"
-      }
+    shape: {
+      square: "",
+      round: ""
+    }
+  },
+  defaultVariants: { size: "md", shape: "square" }
+});
+var boxVariants = cva("nexus-checkbox__box", {
+  variants: {
+    size: {
+      sm: "nexus-checkbox__box--sm",
+      md: "nexus-checkbox__box--md"
     },
-    defaultVariants: { size: "md", shape: "square" }
-  }
-);
+    shape: {
+      square: "nexus-checkbox__box--square",
+      round: "nexus-checkbox__box--round"
+    }
+  },
+  defaultVariants: { size: "md", shape: "square" }
+});
 var CheckIcon = ({ className }) => /* @__PURE__ */ jsx("svg", { className, viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx("path", { d: "M3.5 8.5L6.5 11.5L12.5 5" }) });
 var IndeterminateIcon = ({ className }) => /* @__PURE__ */ jsx("svg", { className, viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", children: /* @__PURE__ */ jsx("path", { d: "M4 8h8" }) });
 var CheckBox = React.forwardRef(
@@ -71,12 +62,13 @@ var CheckBox = React.forwardRef(
     );
     const isChecked = checked || indeterminate;
     const content = label ?? children;
+    const iconClass = size === "sm" ? "nexus-checkbox__icon--sm" : "nexus-checkbox__icon--md";
     return /* @__PURE__ */ jsxs(
       "label",
       {
         className: cn(
           checkBoxVariants({ size, shape }),
-          disabled ? "nx:cursor-not-allowed nx:opacity-50" : "nx:cursor-pointer",
+          disabled ? "nexus-checkbox--disabled" : "nexus-checkbox--pointer",
           className
         ),
         children: [
@@ -85,7 +77,7 @@ var CheckBox = React.forwardRef(
             {
               ref: innerRef,
               type: "checkbox",
-              className: "nx:peer nx:sr-only",
+              className: "nexus-sr-only",
               checked,
               disabled,
               readOnly,
@@ -100,12 +92,12 @@ var CheckBox = React.forwardRef(
               "aria-hidden": "true",
               className: cn(
                 boxVariants({ size, shape }),
-                isChecked ? "nx:border-accent-primary nx:bg-accent-primary nx:text-white" : "nx:border-border-default nx:bg-surface-default"
+                isChecked ? "nexus-checkbox__box--checked" : "nexus-checkbox__box--unchecked"
               ),
-              children: indeterminate ? /* @__PURE__ */ jsx(IndeterminateIcon, { className: size === "sm" ? "nx:size-3" : "nx:size-3.5" }) : checked ? /* @__PURE__ */ jsx(CheckIcon, { className: size === "sm" ? "nx:size-3" : "nx:size-3.5" }) : null
+              children: indeterminate ? /* @__PURE__ */ jsx(IndeterminateIcon, { className: iconClass }) : checked ? /* @__PURE__ */ jsx(CheckIcon, { className: iconClass }) : null
             }
           ),
-          content && /* @__PURE__ */ jsx("span", { className: "nx:text-text-primary", children: content })
+          content && /* @__PURE__ */ jsx("span", { className: "nexus-checkbox__label", children: content })
         ]
       }
     );

package/dist/chunks/{chunk-76K6KXCT.js → chunk-NFIPQZ4O.js}

@@ -92,7 +92,7 @@ var Counter = React__namespace.forwardRef(
         if (rafId) cancelAnimationFrame(rafId);
       };
     }, [started, startValue, endValue, duration, delay, separator, digits, onEnd]);
-    return /* @__PURE__ */ jsxRuntime.jsx("span", { ref: innerRef, className, ...props, children: display });
+    return /* @__PURE__ */ jsxRuntime.jsx("span", { ref: innerRef, className, role: "status", "aria-live": "polite", "aria-atomic": true, ...props, children: display });
   }
 );
 Counter.displayName = "Counter";

package/dist/chunks/chunk-NZHK76R3.js

@@ -0,0 +1,109 @@
+'use strict';
+
+var chunkCZC76ZD5_js = require('./chunk-CZC76ZD5.js');
+var React = require('react');
+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 React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+var ImageIcon = ({ className }) => /* @__PURE__ */ jsxRuntime.jsxs("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
+  /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "3", y: "3", width: "18", height: "18", rx: "2" }),
+  /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "8.5", cy: "8.5", r: "1.5" }),
+  /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M21 15l-5-5L5 21" })
+] });
+var NxImage = React__namespace.forwardRef(
+  ({
+    className,
+    src,
+    alt,
+    fallback,
+    fallbackSrc,
+    aspectRatio,
+    objectFit = "cover",
+    lazy = true,
+    wrapperClassName,
+    style,
+    onError,
+    onLoad,
+    ...props
+  }, ref) => {
+    const [status, setStatus] = React__namespace.useState(
+      "loading"
+    );
+    React__namespace.useEffect(() => {
+      setStatus("loading");
+    }, [src]);
+    const handleLoad = React__namespace.useCallback(
+      (e) => {
+        setStatus("loaded");
+        onLoad?.(e);
+      },
+      [onLoad]
+    );
+    const handleError = React__namespace.useCallback(
+      (e) => {
+        if (fallbackSrc && e.currentTarget.src !== fallbackSrc) {
+          e.currentTarget.src = fallbackSrc;
+          return;
+        }
+        setStatus("error");
+        onError?.(e);
+      },
+      [fallbackSrc, onError]
+    );
+    const wrapperStyle = {
+      ...style,
+      ...aspectRatio ? { aspectRatio } : {}
+    };
+    const showFallback = status === "error" || !src;
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: chunkCZC76ZD5_js.cn("nexus-image", wrapperClassName),
+        style: wrapperStyle,
+        children: showFallback ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "nexus-image__fallback", children: fallback ?? /* @__PURE__ */ jsxRuntime.jsx(ImageIcon, { className: "nexus-image__fallback-icon" }) }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+          status === "loading" && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "nexus-image__skeleton" }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "img",
+            {
+              ref,
+              src,
+              alt: alt ?? "",
+              loading: lazy ? "lazy" : "eager",
+              className: chunkCZC76ZD5_js.cn(
+                "nexus-image__img",
+                `nexus-image__img--${objectFit}`,
+                status === "loaded" && "nexus-image__img--loaded",
+                className
+              ),
+              onLoad: handleLoad,
+              onError: handleError,
+              ...props
+            }
+          )
+        ] })
+      }
+    );
+  }
+);
+NxImage.displayName = "NxImage";
+
+exports.NxImage = NxImage;

package/dist/chunks/{chunk-I7YJB2F5.js → chunk-OMN5YQCE.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var chunkQJNQCLMV_js = require('./chunk-QJNQCLMV.js');
+var chunkCZC76ZD5_js = require('./chunk-CZC76ZD5.js');
 var React = require('react');
 var reactVirtual = require('@tanstack/react-virtual');
 var jsxRuntime = require('react/jsx-runtime');
@@ -60,7 +60,7 @@ function VirtualListInner({
     el.addEventListener("scroll", handleScroll, { passive: true });
     return () => el.removeEventListener("scroll", handleScroll);
   }, [endReachedThreshold]);
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { ref: parentRef, className: chunkQJNQCLMV_js.cn("nx:overflow-auto", className), style, children: /* @__PURE__ */ jsxRuntime.jsx("div", { style: { height: virtualizer.getTotalSize(), width: "100%", position: "relative" }, children: virtualizer.getVirtualItems().map((virtualItem) => /* @__PURE__ */ jsxRuntime.jsx(
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { ref: parentRef, className: chunkCZC76ZD5_js.cn("nexus-virtual-scroll", className), style, children: /* @__PURE__ */ jsxRuntime.jsx("div", { style: { height: virtualizer.getTotalSize(), width: "100%", position: "relative" }, children: virtualizer.getVirtualItems().map((virtualItem) => /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
       style: {
@@ -114,7 +114,7 @@ function VirtualGridInner({
     el.addEventListener("scroll", handleScroll, { passive: true });
     return () => el.removeEventListener("scroll", handleScroll);
   }, [endReachedThreshold]);
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { ref: parentRef, className: chunkQJNQCLMV_js.cn("nx:overflow-auto", className), style, children: /* @__PURE__ */ jsxRuntime.jsx("div", { style: { height: virtualizer.getTotalSize(), width: "100%", position: "relative" }, children: virtualizer.getVirtualItems().map((virtualRow) => {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { ref: parentRef, className: chunkCZC76ZD5_js.cn("nexus-virtual-scroll", className), style, children: /* @__PURE__ */ jsxRuntime.jsx("div", { style: { height: virtualizer.getTotalSize(), width: "100%", position: "relative" }, children: virtualizer.getVirtualItems().map((virtualRow) => {
     const rowStart = virtualRow.index * columns;
     const rowItems = items.slice(rowStart, rowStart + columns);
     return /* @__PURE__ */ jsxRuntime.jsx(

package/dist/chunks/{chunk-B7UU3FSS.mjs → chunk-P2T72N62.mjs}

@@ -1,4 +1,4 @@
-import { cn } from './chunk-XALPBGSC.mjs';
+import { cn } from './chunk-MCKOWMLS.mjs';
 import * as React from 'react';
 import { jsx } from 'react/jsx-runtime';
 
@@ -19,16 +19,13 @@ var Skeleton = React.forwardRef(
       role: "status",
       "aria-label": "Loading",
       className: cn(
-        "nx:relative nx:overflow-hidden",
-        circle ? "nx:rounded-full" : "nx:rounded-md",
-        "nx:bg-gradient-to-r nx:from-surface-hover nx:via-surface-default nx:to-surface-hover",
-        "nx:bg-[length:300%_100%]",
-        "nx:animate-skeleton",
+        "nexus-skeleton",
+        circle ? "nexus-skeleton--circle" : "nexus-skeleton--rect",
         className
       ),
       style: { width, height, ...style },
       ...props,
-      children: children && /* @__PURE__ */ jsx("span", { className: "nx:opacity-0", children })
+      children: children && /* @__PURE__ */ jsx("span", { className: "nexus-skeleton__children", children })
     }
   )
 );

package/dist/chunks/chunk-P3DZKXG4.js

@@ -0,0 +1,116 @@
+'use strict';
+
+var chunkCZC76ZD5_js = require('./chunk-CZC76ZD5.js');
+var React = require('react');
+var reactSlot = require('@radix-ui/react-slot');
+var classVarianceAuthority = require('class-variance-authority');
+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 React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+var buttonVariants = classVarianceAuthority.cva("nexus-btn", {
+  variants: {
+    semantic: {
+      primary: "nexus-btn--primary",
+      secondary: "nexus-btn--secondary",
+      normal: "nexus-btn--normal",
+      danger: "nexus-btn--danger"
+    },
+    variant: {
+      contained: "nexus-btn--contained",
+      outlined: "nexus-btn--outlined",
+      subtle: "nexus-btn--subtle",
+      ghost: "nexus-btn--ghost"
+    },
+    size: {
+      xl: "nexus-btn--xl",
+      lg: "nexus-btn--lg",
+      md: "nexus-btn--md",
+      sm: "nexus-btn--sm"
+    },
+    radius: {
+      default: "",
+      circle: "nexus-btn--circle"
+    }
+  },
+  defaultVariants: {
+    semantic: "primary",
+    variant: "contained",
+    size: "md",
+    radius: "default"
+  }
+});
+var Button = React__namespace.forwardRef(
+  ({
+    className,
+    semantic,
+    variant,
+    size,
+    radius,
+    asChild = false,
+    detectDoubleClick = false,
+    disabled,
+    children,
+    onClick,
+    style,
+    ...props
+  }, ref) => {
+    const clickTimeoutRef = React__namespace.useRef(
+      null
+    );
+    const handleClick = React__namespace.useCallback(
+      (e) => {
+        if (detectDoubleClick && clickTimeoutRef.current) return;
+        onClick?.(e);
+        if (detectDoubleClick) {
+          clickTimeoutRef.current = setTimeout(() => {
+            clickTimeoutRef.current = null;
+          }, 500);
+        }
+      },
+      [detectDoubleClick, onClick]
+    );
+    const Comp = asChild ? reactSlot.Slot : "button";
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      Comp,
+      {
+        ref,
+        type: asChild ? void 0 : "button",
+        role: asChild ? "button" : void 0,
+        className: chunkCZC76ZD5_js.cn(
+          buttonVariants({ semantic, variant, size, radius }),
+          className
+        ),
+        disabled: asChild ? void 0 : disabled,
+        "aria-disabled": disabled || void 0,
+        tabIndex: disabled ? -1 : void 0,
+        onClick: disabled ? void 0 : handleClick,
+        style,
+        ...props,
+        children
+      }
+    );
+  }
+);
+Button.displayName = "Button";
+
+exports.Button = Button;
+exports.buttonVariants = buttonVariants;

package/dist/chunks/chunk-P73MEU7N.mjs

@@ -0,0 +1,150 @@
+import { cn } from './chunk-MCKOWMLS.mjs';
+import * as React from 'react';
+import * as ToggleGroupPrimitive from '@radix-ui/react-toggle-group';
+import { cva } from 'class-variance-authority';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var toggleGroupVariants = cva("nexus-toggle-group", {
+  variants: {
+    variant: {
+      default: "nexus-toggle-group--default",
+      outline: "nexus-toggle-group--outline"
+    },
+    size: {
+      sm: "nexus-toggle-group--sm",
+      md: "nexus-toggle-group--md",
+      lg: "nexus-toggle-group--lg"
+    }
+  },
+  defaultVariants: {
+    variant: "default",
+    size: "md"
+  }
+});
+var ToggleGroup = React.forwardRef(
+  ({ className, variant, size, items, disabled, ...props }, ref) => {
+    const rootRef = React.useRef(null);
+    const [animated, setAnimated] = React.useState(false);
+    const [pos, setPos] = React.useState(null);
+    const combinedRef = React.useCallback(
+      (node) => {
+        rootRef.current = node;
+        if (typeof ref === "function") ref(node);
+        else if (ref) ref.current = node;
+      },
+      [ref]
+    );
+    const currentValue = props.type === "multiple" ? props.value ?? props.defaultValue : props.value ?? props.defaultValue;
+    const [trackedValue, setTrackedValue] = React.useState(currentValue);
+    React.useEffect(() => {
+      if (currentValue !== void 0) setTrackedValue(currentValue);
+    }, [currentValue]);
+    const isDefault = variant !== "outline";
+    React.useLayoutEffect(() => {
+      const root = rootRef.current;
+      if (!root || !isDefault) return;
+      const activeVal = Array.isArray(trackedValue) ? trackedValue[0] : trackedValue;
+      if (!activeVal) {
+        setPos(null);
+        return;
+      }
+      const idx = items.findIndex((item) => item.value === activeVal);
+      if (idx === -1) {
+        setPos(null);
+        return;
+      }
+      const itemEls = root.querySelectorAll(
+        ".nexus-toggle-group__item"
+      );
+      const el = itemEls[idx];
+      if (!el) return;
+      const rootRect = root.getBoundingClientRect();
+      const elRect = el.getBoundingClientRect();
+      setPos({
+        width: elRect.width,
+        height: elRect.height,
+        x: elRect.left - rootRect.left,
+        y: elRect.top - rootRect.top
+      });
+    }, [trackedValue, items, isDefault]);
+    React.useEffect(() => {
+      const frame = requestAnimationFrame(() => {
+        requestAnimationFrame(() => setAnimated(true));
+      });
+      return () => cancelAnimationFrame(frame);
+    }, []);
+    const handleSingleChange = React.useCallback(
+      (val) => {
+        setTrackedValue(val);
+        if (props.type !== "multiple") {
+          props.onValueChange?.(val);
+        }
+      },
+      [props.type, props.onValueChange]
+    );
+    const handleMultipleChange = React.useCallback(
+      (val) => {
+        setTrackedValue(val);
+        if (props.type === "multiple") {
+          props.onValueChange?.(val);
+        }
+      },
+      [props.type, props.onValueChange]
+    );
+    const rootProps = props.type === "multiple" ? {
+      type: "multiple",
+      value: props.value,
+      defaultValue: props.defaultValue,
+      onValueChange: handleMultipleChange
+    } : {
+      type: "single",
+      value: props.value,
+      defaultValue: props.defaultValue,
+      onValueChange: handleSingleChange
+    };
+    const indicatorStyle = pos ? {
+      width: pos.width,
+      height: pos.height,
+      transform: `translate(${pos.x}px, ${pos.y}px)`,
+      opacity: 1
+    } : { opacity: 0 };
+    return /* @__PURE__ */ jsxs(
+      ToggleGroupPrimitive.Root,
+      {
+        ref: combinedRef,
+        className: cn(toggleGroupVariants({ variant, size }), className),
+        disabled,
+        ...rootProps,
+        children: [
+          isDefault && /* @__PURE__ */ jsx(
+            "span",
+            {
+              className: cn(
+                "nexus-toggle-group__indicator",
+                animated && "nexus-toggle-group__indicator--animated"
+              ),
+              style: indicatorStyle,
+              "aria-hidden": true
+            }
+          ),
+          items.map((item) => /* @__PURE__ */ jsxs(
+            ToggleGroupPrimitive.Item,
+            {
+              value: item.value,
+              disabled: item.disabled,
+              className: "nexus-toggle-group__item",
+              children: [
+                item.icon && /* @__PURE__ */ jsx("span", { className: "nexus-toggle-group__icon", children: item.icon }),
+                item.label && /* @__PURE__ */ jsx("span", { children: item.label })
+              ]
+            },
+            item.value
+          ))
+        ]
+      }
+    );
+  }
+);
+ToggleGroup.displayName = "ToggleGroup";
+
+export { ToggleGroup, toggleGroupVariants };

package/dist/chunks/chunk-PDJTSQOC.js

@@ -0,0 +1,59 @@
+'use strict';
+
+var chunkCZC76ZD5_js = require('./chunk-CZC76ZD5.js');
+var React = require('react');
+var classVarianceAuthority = require('class-variance-authority');
+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 React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+var emptyStateVariants = classVarianceAuthority.cva("nexus-empty-state", {
+  variants: {
+    size: {
+      sm: "nexus-empty-state--sm",
+      md: "nexus-empty-state--md",
+      lg: "nexus-empty-state--lg"
+    }
+  },
+  defaultVariants: { size: "md" }
+});
+var DefaultIcon = ({ className }) => /* @__PURE__ */ jsxRuntime.jsx("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M20 13V6a2 2 0 00-2-2H6a2 2 0 00-2 2v7m16 0v5a2 2 0 01-2 2H6a2 2 0 01-2-2v-5m16 0h-2.586a1 1 0 00-.707.293l-2.414 2.414a1 1 0 01-.707.293h-3.172a1 1 0 01-.707-.293l-2.414-2.414A1 1 0 006.586 13H4", strokeLinecap: "round", strokeLinejoin: "round" }) });
+var EmptyState = React__namespace.forwardRef(
+  ({ className, size, icon, title, description, action, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      ref,
+      className: chunkCZC76ZD5_js.cn(emptyStateVariants({ size }), className),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "nexus-empty-state__icon", children: icon ?? /* @__PURE__ */ jsxRuntime.jsx(DefaultIcon, { className: "nexus-empty-state__default-icon" }) }),
+        title && /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "nexus-empty-state__title", children: title }),
+        description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "nexus-empty-state__description", children: description }),
+        children,
+        action && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "nexus-empty-state__action", children: action })
+      ]
+    }
+  )
+);
+EmptyState.displayName = "EmptyState";
+
+exports.EmptyState = EmptyState;
+exports.emptyStateVariants = emptyStateVariants;

package/dist/chunks/{chunk-RXVYL4AU.js → chunk-PEIEVKD5.js}

@@ -1,8 +1,8 @@
 'use strict';
 
-var chunkG4XJG7XI_js = require('./chunk-G4XJG7XI.js');
-var chunkU76LT5GE_js = require('./chunk-U76LT5GE.js');
-var chunkQJNQCLMV_js = require('./chunk-QJNQCLMV.js');
+var chunkEVOOTSY5_js = require('./chunk-EVOOTSY5.js');
+var chunkIOSIQLZL_js = require('./chunk-IOSIQLZL.js');
+var chunkCZC76ZD5_js = require('./chunk-CZC76ZD5.js');
 var React = require('react');
 var jsxRuntime = require('react/jsx-runtime');
 
@@ -41,13 +41,10 @@ function DataList({
     if (!list || loading) {
       if (skeletonElement) {
         return Array.from({ length: skeletonCount }).map(
-          (_, index) => React__namespace.cloneElement(skeletonElement, {
-            ...skeletonElement.props,
-            key: index
-          })
+          (_, index) => React__namespace.cloneElement(skeletonElement, { key: index })
         );
       }
-      return loadingElement ?? /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunkQJNQCLMV_js.cn("nx:flex nx:items-center nx:justify-center nx:py-8"), children: /* @__PURE__ */ jsxRuntime.jsx(chunkU76LT5GE_js.Spinner, { size: 32 }) });
+      return loadingElement ?? /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunkCZC76ZD5_js.cn("nexus-datalist-center"), children: /* @__PURE__ */ jsxRuntime.jsx(chunkIOSIQLZL_js.Spinner, { size: 32 }) });
     }
     if (list.length === 0) {
       if (React__namespace.isValidElement(noDataMessage)) {
@@ -56,10 +53,7 @@ function DataList({
       return /* @__PURE__ */ jsxRuntime.jsx(
         "p",
         {
-          className: chunkQJNQCLMV_js.cn(
-            "nx:flex nx:items-center nx:justify-center nx:py-8",
-            "nx:text-sm nx:text-text-tertiary"
-          ),
+          className: chunkCZC76ZD5_js.cn("nexus-datalist-empty"),
           children: noDataMessage ?? "\uB370\uC774\uD130\uAC00 \uC5C6\uC2B5\uB2C8\uB2E4"
         }
       );
@@ -76,7 +70,7 @@ function DataList({
     noDataMessage,
     children
   ]);
-  return /* @__PURE__ */ jsxRuntime.jsx(chunkG4XJG7XI_js.ErrorBoundary, { fallback: errorFallback, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className, children: content }) });
+  return /* @__PURE__ */ jsxRuntime.jsx(chunkEVOOTSY5_js.ErrorBoundary, { fallback: errorFallback, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className, children: content }) });
 }
 DataList.displayName = "DataList";