@luxfi/ui 7.0.0 → 7.2.0

package/dist/collapsible.js

@@ -10,272 +10,137 @@ import { jsx, jsxs } from 'react/jsx-runtime';
 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`;
+var SHIM_PROPS = [
+  "w",
+  "h",
+  "minW",
+  "maxW",
+  "display",
+  "flexGrow",
+  "flexShrink",
+  "flexBasis",
+  "fontWeight",
+  "textStyle",
+  "borderRadius",
+  "alignSelf",
+  "alignItems",
+  "justifyContent",
+  "color",
+  "mt",
+  "mb",
+  "ml",
+  "mr",
+  "height",
+  "overflow",
+  "whiteSpace",
+  "textOverflow",
+  "textTransform",
+  "gap",
+  "gridTemplateColumns",
+  "minWidth",
+  "boxSize",
+  "py",
+  "px",
+  "p",
+  "hideBelow",
+  "fontSize",
+  "flexWrap",
+  "wordBreak",
+  "lineHeight",
+  "marginRight",
+  "position",
+  "background"
+];
+var S = 4;
+function dim(v) {
+  if (v == null) return void 0;
+  if (typeof v === "number") return `${v * S}px`;
+  if (typeof v === "string") return v;
+  if (typeof v === "object") {
+    const o = v;
+    return o.base ?? o.lg ?? o.xl ?? Object.values(o)[0];
+  }
+  return void 0;
 }
-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;
+function sp(v) {
+  if (v === void 0) return void 0;
+  return typeof v === "number" ? `${v * S}px` : v;
+}
+function shimToStyle(props) {
+  const s = {};
+  if (props.w !== void 0) s.width = dim(props.w);
+  if (props.h !== void 0) s.height = dim(props.h);
+  if (props.minW !== void 0) s.minWidth = dim(props.minW);
+  if (props.maxW !== void 0) s.maxWidth = dim(props.maxW);
+  if (props.display !== void 0) s.display = props.display;
+  if (props.flexGrow !== void 0) s.flexGrow = props.flexGrow;
+  if (props.flexShrink !== void 0) s.flexShrink = props.flexShrink;
+  if (props.flexBasis !== void 0) s.flexBasis = props.flexBasis;
+  if (props.fontWeight !== void 0) s.fontWeight = props.fontWeight;
+  if (props.borderRadius !== void 0) s.borderRadius = props.borderRadius;
+  if (props.alignSelf !== void 0) s.alignSelf = props.alignSelf;
+  if (props.alignItems !== void 0) s.alignItems = props.alignItems;
+  if (props.justifyContent !== void 0) s.justifyContent = props.justifyContent;
+  if (props.color !== void 0) s.color = props.color;
+  if (props.mt !== void 0) s.marginTop = sp(props.mt);
+  if (props.mb !== void 0) s.marginBottom = sp(props.mb);
+  if (props.ml !== void 0) s.marginLeft = sp(props.ml);
+  if (props.mr !== void 0) s.marginRight = sp(props.mr);
+  if (props.height !== void 0) s.height = props.height;
+  if (props.overflow !== void 0) s.overflow = props.overflow;
+  if (props.whiteSpace !== void 0) s.whiteSpace = props.whiteSpace;
+  if (props.textOverflow !== void 0) s.textOverflow = props.textOverflow;
+  if (props.textTransform !== void 0) s.textTransform = props.textTransform;
+  if (props.gap !== void 0) s.gap = sp(props.gap);
+  if (props.gridTemplateColumns !== void 0) s.gridTemplateColumns = props.gridTemplateColumns;
+  if (props.minWidth !== void 0) s.minWidth = props.minWidth;
+  if (props.boxSize !== void 0) {
+    const v = typeof props.boxSize === "number" ? `${props.boxSize * S}px` : props.boxSize;
+    s.width = v;
+    s.height = v;
   }
-  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;
-    }
+  if (props.py !== void 0) {
+    const v = sp(props.py);
+    s.paddingTop = v;
+    s.paddingBottom = v;
   }
-  return { style, rest };
+  if (props.px !== void 0) {
+    const v = sp(props.px);
+    s.paddingLeft = v;
+    s.paddingRight = v;
+  }
+  if (props.p !== void 0) s.padding = sp(props.p);
+  if (props.fontSize !== void 0) s.fontSize = props.fontSize;
+  if (props.flexWrap !== void 0) s.flexWrap = props.flexWrap;
+  if (props.wordBreak !== void 0) s.wordBreak = props.wordBreak;
+  if (props.lineHeight !== void 0) s.lineHeight = props.lineHeight;
+  if (props.marginRight !== void 0) s.marginRight = props.marginRight;
+  if (props.position !== void 0) s.position = props.position;
+  if (props.background !== void 0) s.background = props.background;
+  return s;
+}
+function stripShims(props) {
+  const out = { ...props };
+  for (const k of SHIM_PROPS) delete out[k];
+  return out;
 }
+var SKELETON_CLASSES = [
+  "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%]"
+].join(" ");
+var HIDE_BELOW_MAP = { lg: "lg:hidden", md: "md:hidden", sm: "sm:hidden" };
 var Skeleton = React3.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 { loading = false, asChild, className, children, style: styleProp, as: Component = "div", ...allRest } = props;
+    const shimStyle = shimToStyle(props);
     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;
+    const hideBelowClass = props.hideBelow ? HIDE_BELOW_MAP[props.hideBelow] : void 0;
+    const cls = hideBelowClass ? cn(className, hideBelowClass) : className;
+    const htmlRest = stripShims(allRest);
     if (!loading) {
-      if (asChild && React3.isValidElement(children)) {
-        return children;
-      }
-      return /* @__PURE__ */ jsx(Component, { ref, className: finalClassName, style: mergedStyle, ...htmlRest, children });
+      if (asChild && React3.isValidElement(children)) return children;
+      return /* @__PURE__ */ jsx(Component, { ref, className: cls, style: mergedStyle, ...htmlRest, children });
     }
     if (asChild && React3.isValidElement(children)) {
       return /* @__PURE__ */ jsx(
@@ -283,13 +148,7 @@ var Skeleton = React3.forwardRef(
         {
           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
-          ),
+          className: cn(SKELETON_CLASSES, "text-transparent [&_*]:invisible", cls),
           style: mergedStyle,
           ...htmlRest,
           children
@@ -301,13 +160,7 @@ var Skeleton = React3.forwardRef(
       {
         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
-        ),
+        className: cn(SKELETON_CLASSES, children ? "text-transparent [&_*]:invisible" : "min-h-5", cls),
         style: mergedStyle,
         ...htmlRest,
         children

package/dist/dialog.cjs

@@ -1,10 +1,11 @@
 "use client";
 'use strict';
 
-var RadixDialog = require('@radix-ui/react-dialog');
+var dialog = require('@hanzogui/dialog');
 var React2 = require('react');
 var clsx = require('clsx');
 var tailwindMerge = require('tailwind-merge');
+var core = require('@hanzogui/core');
 var jsxRuntime = require('react/jsx-runtime');
 
 function _interopNamespace(e) {
@@ -25,7 +26,6 @@ function _interopNamespace(e) {
   return Object.freeze(n);
 }
 
-var RadixDialog__namespace = /*#__PURE__*/_interopNamespace(RadixDialog);
 var React2__namespace = /*#__PURE__*/_interopNamespace(React2);
 
 // src/dialog.tsx
@@ -33,24 +33,47 @@ function cn(...inputs) {
   return tailwindMerge.twMerge(clsx.clsx(inputs));
 }
 var CLOSE_ICON_PATH = "M9.44 8.035a.791.791 0 0 0 1.12 0l3.802-3.803a.791.791 0 0 1 1.119 0l.287.287a.79.79 0 0 1 0 1.119L11.965 9.44a.79.79 0 0 0 0 1.118l3.803 3.803a.791.791 0 0 1 0 1.119l-.287.287a.791.791 0 0 1-1.119 0l-3.803-3.803a.79.79 0 0 0-1.118 0l-3.803 3.803a.79.79 0 0 1-1.119 0l-.287-.287a.791.791 0 0 1 0-1.119l3.803-3.803a.791.791 0 0 0 0-1.118L4.232 5.638a.791.791 0 0 1 0-1.119l.287-.287a.791.791 0 0 1 1.119 0L9.44 8.035Z";
+var CloseButtonFrame = core.styled(core.View, {
+  name: "LuxCloseButton",
+  render: /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", "aria-label": "Close" }),
+  role: "button",
+  cursor: "pointer",
+  display: "inline-flex",
+  alignItems: "center",
+  justifyContent: "center",
+  width: 20,
+  height: 20,
+  minWidth: 0,
+  flexShrink: 1,
+  padding: 0,
+  borderRadius: 4,
+  borderWidth: 0,
+  overflow: "hidden",
+  backgroundColor: "transparent",
+  hoverStyle: {
+    backgroundColor: "transparent"
+  },
+  variants: {
+    disabled: {
+      true: {
+        opacity: 0.4,
+        pointerEvents: "none"
+      }
+    }
+  }
+});
+var CLOSE_BUTTON_CLASSES = [
+  "text-[var(--closeButton-fg,currentColor)]",
+  "hover:text-[var(--hover-color,currentColor)]",
+  "disabled:opacity-40"
+].join(" ");
 var CloseButton = React2__namespace.forwardRef(function CloseButton2(props, ref) {
   const { variant: _variant, size: _size, className, children, ...rest } = props;
   return /* @__PURE__ */ jsxRuntime.jsx(
-    "button",
+    CloseButtonFrame,
     {
-      type: "button",
-      "aria-label": "Close",
       ref,
-      className: cn(
-        "inline-flex items-center justify-center",
-        "size-5 min-w-0 shrink-0 p-0",
-        "rounded-sm border-0 overflow-hidden",
-        "bg-transparent text-[var(--closeButton-fg,currentColor)]",
-        "hover:bg-transparent hover:text-[var(--hover-color,currentColor)]",
-        "disabled:opacity-40",
-        "cursor-pointer",
-        className
-      ),
+      className: [CLOSE_BUTTON_CLASSES, className].filter(Boolean).join(" "),
       ...rest,
       children: children ?? /* @__PURE__ */ jsxRuntime.jsx(
         "svg",
@@ -83,9 +106,9 @@ function BackToButton({ onClick }) {
     }
   );
 }
-var DialogContext = React2__namespace.createContext({ size: "md" });
-function useDialogContext() {
-  return React2__namespace.useContext(DialogContext);
+var DialogSizeContext = React2__namespace.createContext({ size: "md" });
+function useDialogSizeContext() {
+  return React2__namespace.useContext(DialogSizeContext);
 }
 var CONTENT_SIZE_MAP = {
   sm: "max-w-[400px]",
@@ -115,7 +138,7 @@ var DialogRoot = ({
   onOpenChange,
   size = "md",
   modal = true
-  // motionPreset is intentionally unused — kept for API compat
+  // motionPreset is intentionally unused -- kept for API compat
 }) => {
   const handleOpenChange = React2__namespace.useCallback(
     (nextOpen) => {
@@ -124,8 +147,8 @@ var DialogRoot = ({
     [onOpenChange]
   );
   const ctx = React2__namespace.useMemo(() => ({ size }), [size]);
-  return /* @__PURE__ */ jsxRuntime.jsx(DialogContext.Provider, { value: ctx, children: /* @__PURE__ */ jsxRuntime.jsx(
-    RadixDialog__namespace.Root,
+  return /* @__PURE__ */ jsxRuntime.jsx(DialogSizeContext.Provider, { value: ctx, children: /* @__PURE__ */ jsxRuntime.jsx(
+    dialog.Dialog,
     {
       open,
       defaultOpen,
@@ -138,8 +161,8 @@ var DialogRoot = ({
 var DialogContent = React2__namespace.forwardRef(function DialogContent2(props, ref) {
   const {
     children,
-    portalled = true,
-    portalRef,
+    portalled: _portalled = true,
+    portalRef: _portalRef,
     backdrop = true,
     className,
     paddingTop: _paddingTop,
@@ -150,21 +173,12 @@ var DialogContent = React2__namespace.forwardRef(function DialogContent2(props,
     ...styleProp,
     ..._paddingTop !== void 0 ? { paddingTop: typeof _paddingTop === "number" ? `${_paddingTop * 4}px` : _paddingTop } : {}
   };
-  const { size } = useDialogContext();
-  let portalProps;
-  if (!portalled) {
-    portalProps = { container: void 0 };
-  } else if (portalRef) {
-    portalProps = { container: portalRef.current };
-  } else {
-    portalProps = {};
-  }
-  const Wrapper = portalled ? RadixDialog__namespace.Portal : React2__namespace.Fragment;
-  const wrapperProps = portalled ? portalProps : {};
-  return /* @__PURE__ */ jsxRuntime.jsxs(Wrapper, { ...wrapperProps, children: [
+  const { size } = useDialogSizeContext();
+  return /* @__PURE__ */ jsxRuntime.jsxs(dialog.Dialog.Portal, { children: [
     backdrop && /* @__PURE__ */ jsxRuntime.jsx(
-      RadixDialog__namespace.Overlay,
+      dialog.Dialog.Overlay,
       {
+        unstyled: true,
         className: "fixed inset-0 z-[1400] bg-black/80"
       }
     ),
@@ -177,9 +191,10 @@ var DialogContent = React2__namespace.forwardRef(function DialogContent2(props,
           "overflow-hidden"
         ),
         children: /* @__PURE__ */ jsxRuntime.jsx(
-          RadixDialog__namespace.Content,
+          dialog.Dialog.Content,
           {
             ref,
+            unstyled: true,
             className: cn(
               // Base content styles
               "relative flex flex-col w-full p-6 outline-none text-base",
@@ -202,7 +217,7 @@ var DialogContent = React2__namespace.forwardRef(function DialogContent2(props,
 });
 var DialogCloseTrigger = React2__namespace.forwardRef(function DialogCloseTrigger2(props, ref) {
   const { className, ...rest } = props;
-  return /* @__PURE__ */ jsxRuntime.jsx(RadixDialog__namespace.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(CloseButton, { ref, className, ...rest, children: props.children }) });
+  return /* @__PURE__ */ jsxRuntime.jsx(dialog.Dialog.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(CloseButton, { ref, className, ...rest, children: props.children }) });
 });
 var DialogHeader = React2__namespace.forwardRef(function DialogHeader2(props, ref) {
   const { startElement: startElementProp, onBackToClick, className, children, ...rest } = props;
@@ -219,8 +234,9 @@ var DialogHeader = React2__namespace.forwardRef(function DialogHeader2(props, re
       children: [
         startElement,
         /* @__PURE__ */ jsxRuntime.jsx(
-          RadixDialog__namespace.Title,
+          dialog.Dialog.Title,
           {
+            unstyled: true,
             className: cn(
               "text-base lg:text-lg font-medium",
               "whitespace-nowrap overflow-hidden text-ellipsis"
@@ -260,11 +276,11 @@ var DialogFooter = React2__namespace.forwardRef(function DialogFooter2({ classNa
     }
   );
 });
-var DialogBackdrop = RadixDialog__namespace.Overlay;
-var DialogTitle = RadixDialog__namespace.Title;
-var DialogDescription = RadixDialog__namespace.Description;
-var DialogTrigger = RadixDialog__namespace.Trigger;
-var DialogActionTrigger = RadixDialog__namespace.Close;
+var DialogBackdrop = dialog.Dialog.Overlay;
+var DialogTitle = dialog.Dialog.Title;
+var DialogDescription = dialog.Dialog.Description;
+var DialogTrigger = dialog.Dialog.Trigger;
+var DialogActionTrigger = dialog.Dialog.Close;
 
 exports.DialogActionTrigger = DialogActionTrigger;
 exports.DialogBackdrop = DialogBackdrop;

package/dist/dialog.d.cts

@@ -1,4 +1,3 @@
-import * as RadixDialog from '@radix-ui/react-dialog';
 import * as React from 'react';
 
 type DialogSize = 'sm' | 'md' | 'full' | 'cover';
@@ -21,7 +20,7 @@ interface DialogRootProps {
         open: boolean;
     }) => void;
     size?: ResponsiveSize;
-    /** Accepted for API compat but not implemented — animations are CSS-only. */
+    /** Accepted for API compat but not implemented -- animations are CSS-only. */
     motionPreset?: string;
     modal?: boolean;
 }
@@ -50,17 +49,17 @@ declare const DialogBody: React.ForwardRefExoticComponent<DialogBodyProps & Reac
 interface DialogFooterProps extends React.HTMLAttributes<HTMLDivElement> {
 }
 declare const DialogFooter: React.ForwardRefExoticComponent<DialogFooterProps & React.RefAttributes<HTMLDivElement>>;
-declare const DialogBackdrop: React.ForwardRefExoticComponent<RadixDialog.DialogOverlayProps & React.RefAttributes<HTMLDivElement>>;
-declare const DialogTitle: React.ForwardRefExoticComponent<RadixDialog.DialogTitleProps & React.RefAttributes<HTMLHeadingElement>>;
-declare const DialogDescription: React.ForwardRefExoticComponent<RadixDialog.DialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>>;
-interface DialogTriggerProps extends React.ComponentPropsWithoutRef<typeof RadixDialog.Trigger> {
+declare const DialogBackdrop: any;
+declare const DialogTitle: any;
+declare const DialogDescription: any;
+interface DialogTriggerProps extends React.ComponentPropsWithoutRef<'button'> {
 }
-declare const DialogTrigger: React.ForwardRefExoticComponent<RadixDialog.DialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+declare const DialogTrigger: any;
 /**
  * `DialogActionTrigger` renders its child and closes the dialog on click.
  * This mirrors the Chakra `Dialog.ActionTrigger` behavior which wraps
  * children in a close action.
  */
-declare const DialogActionTrigger: React.ForwardRefExoticComponent<RadixDialog.DialogCloseProps & React.RefAttributes<HTMLButtonElement>>;
+declare const DialogActionTrigger: any;
 
 export { DialogActionTrigger, DialogBackdrop, DialogBody, type DialogBodyProps, DialogCloseTrigger, type DialogCloseTriggerProps, DialogContent, type DialogContentProps, DialogDescription, DialogFooter, type DialogFooterProps, DialogHeader, type DialogHeaderProps, DialogRoot, type DialogRootProps, DialogTitle, DialogTrigger, type DialogTriggerProps };