@luxfi/ui 6.1.2 → 7.0.0

package/dist/popover.cjs

@@ -0,0 +1,327 @@
+"use client";
+'use strict';
+
+var RadixPopover = require('@radix-ui/react-popover');
+var React2 = 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 RadixPopover__namespace = /*#__PURE__*/_interopNamespace(RadixPopover);
+var React2__namespace = /*#__PURE__*/_interopNamespace(React2);
+
+// src/popover.tsx
+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 CloseButton = React2__namespace.forwardRef(function CloseButton2(props, ref) {
+  const { variant: _variant, size: _size, className, children, ...rest } = props;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "button",
+    {
+      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
+      ),
+      ...rest,
+      children: children ?? /* @__PURE__ */ jsxRuntime.jsx(
+        "svg",
+        {
+          className: "size-5",
+          viewBox: "0 0 20 20",
+          fill: "none",
+          "aria-hidden": "true",
+          children: /* @__PURE__ */ jsxRuntime.jsx(
+            "path",
+            {
+              d: CLOSE_ICON_PATH,
+              fill: "currentColor"
+            }
+          )
+        }
+      )
+    }
+  );
+});
+function parsePlacement(placement) {
+  if (!placement) {
+    return { side: "bottom", align: "start" };
+  }
+  const parts = placement.split("-");
+  const side = parts[0] ?? "bottom";
+  const alignPart = parts[1];
+  let align = "center";
+  if (alignPart === "start") {
+    align = "start";
+  } else if (alignPart === "end") {
+    align = "end";
+  }
+  return { side, align };
+}
+var PositioningContext = React2__namespace.createContext({
+  side: "bottom",
+  align: "start",
+  sideOffset: 4,
+  alignOffset: 0,
+  collisionPadding: 4,
+  autoFocus: false,
+  closeOnInteractOutside: true
+});
+var PopoverRoot = (props) => {
+  const {
+    children,
+    open,
+    defaultOpen,
+    onOpenChange,
+    positioning,
+    autoFocus = false,
+    closeOnInteractOutside = true,
+    modal = false,
+    // lazyMount and unmountOnExit are handled via forceMount on Portal/Content
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    lazyMount: _lazyMount,
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    unmountOnExit: _unmountOnExit
+  } = props;
+  const mergedPositioning = {
+    placement: "bottom-start",
+    overflowPadding: 4,
+    ...positioning,
+    offset: {
+      mainAxis: 4,
+      ...positioning?.offset
+    }
+  };
+  const { side, align } = parsePlacement(mergedPositioning.placement);
+  const positioningValue = React2__namespace.useMemo(() => ({
+    side,
+    align,
+    sideOffset: mergedPositioning.offset?.mainAxis ?? 4,
+    alignOffset: mergedPositioning.offset?.crossAxis ?? 0,
+    collisionPadding: mergedPositioning.overflowPadding ?? 4,
+    autoFocus,
+    closeOnInteractOutside
+  }), [
+    side,
+    align,
+    mergedPositioning.offset?.mainAxis,
+    mergedPositioning.offset?.crossAxis,
+    mergedPositioning.overflowPadding,
+    autoFocus,
+    closeOnInteractOutside
+  ]);
+  const handleOpenChange = React2__namespace.useCallback((isOpen) => {
+    onOpenChange?.({ open: isOpen });
+  }, [onOpenChange]);
+  return /* @__PURE__ */ jsxRuntime.jsx(PositioningContext.Provider, { value: positioningValue, children: /* @__PURE__ */ jsxRuntime.jsx(
+    RadixPopover__namespace.Root,
+    {
+      open,
+      defaultOpen,
+      onOpenChange: handleOpenChange,
+      modal,
+      children
+    }
+  ) });
+};
+var PopoverTrigger = React2__namespace.forwardRef(function PopoverTrigger2(props, ref) {
+  const { asChild = true, ...rest } = props;
+  return /* @__PURE__ */ jsxRuntime.jsx(RadixPopover__namespace.Trigger, { asChild, ref, ...rest });
+});
+var PopoverContent = React2__namespace.forwardRef(function PopoverContent2(props, ref) {
+  const { portalled = true, portalRef, className, w, minW, maxW, paddingTop, style: styleProp, ...rest } = props;
+  const resolvedW = typeof w === "object" ? w.base ?? w.lg : w;
+  const contentStyle = {
+    ...styleProp,
+    ...resolvedW ? { width: resolvedW } : {},
+    ...minW ? { minWidth: minW } : {},
+    ...maxW ? { maxWidth: maxW } : {},
+    ...paddingTop !== void 0 ? { paddingTop: typeof paddingTop === "number" ? `${paddingTop * 4}px` : paddingTop } : {}
+  };
+  const positioning = React2__namespace.useContext(PositioningContext);
+  const preventFocus = React2__namespace.useCallback((e) => e.preventDefault(), []);
+  const preventInteract = React2__namespace.useCallback((e) => e.preventDefault(), []);
+  const content = /* @__PURE__ */ jsxRuntime.jsx(
+    RadixPopover__namespace.Content,
+    {
+      ref,
+      side: positioning.side,
+      align: positioning.align,
+      sideOffset: positioning.sideOffset,
+      alignOffset: positioning.alignOffset,
+      collisionPadding: positioning.collisionPadding,
+      onOpenAutoFocus: positioning.autoFocus ? void 0 : preventFocus,
+      onInteractOutside: positioning.closeOnInteractOutside ? void 0 : preventInteract,
+      className: cn(
+        "z-50 rounded-lg border border-[var(--color-popover-border,var(--color-border-divider))]",
+        "bg-[var(--color-popover-bg,var(--color-dialog-bg))]",
+        "shadow-[var(--shadow-popover,var(--shadow-lg))]",
+        "outline-none",
+        "data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
+        "data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95",
+        "data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2",
+        "data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+        className
+      ),
+      style: Object.keys(contentStyle).length > 0 ? contentStyle : void 0,
+      ...rest
+    }
+  );
+  if (!portalled) {
+    return content;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(RadixPopover__namespace.Portal, { container: portalRef?.current ?? void 0, children: content });
+});
+var PopoverArrow = React2__namespace.forwardRef(function PopoverArrow2(props, ref) {
+  const { className, ...rest } = props;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    RadixPopover__namespace.Arrow,
+    {
+      ref,
+      className: cn("fill-[var(--color-popover-bg,var(--color-dialog-bg))]", className),
+      ...rest
+    }
+  );
+});
+var PopoverCloseTrigger = React2__namespace.forwardRef(function PopoverCloseTrigger2(props, ref) {
+  const { className, ...rest } = props;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    RadixPopover__namespace.Close,
+    {
+      className: cn("absolute top-1 right-1", className),
+      ...rest,
+      asChild: true,
+      ref,
+      children: /* @__PURE__ */ jsxRuntime.jsx(CloseButton, {})
+    }
+  );
+});
+var PopoverCloseTriggerWrapper = React2__namespace.forwardRef(function PopoverCloseTriggerWrapper2(props, ref) {
+  const { disabled, children, ...rest } = props;
+  if (disabled) {
+    return children;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(RadixPopover__namespace.Close, { ref, ...rest, asChild: true, children });
+});
+var PopoverBody = React2__namespace.forwardRef(function PopoverBody2(props, ref) {
+  const {
+    className,
+    style: styleProp,
+    display: _display,
+    flexDir: _flexDir,
+    rowGap: _rowGap,
+    px: _px,
+    py: _py,
+    textStyle: _textStyle,
+    alignItems: _alignItems,
+    ...rest
+  } = props;
+  const bodyStyle = {
+    ...styleProp,
+    ..._display ? { display: _display } : {},
+    ..._flexDir ? { flexDirection: _flexDir } : {},
+    ..._rowGap !== void 0 ? { rowGap: typeof _rowGap === "number" ? `${_rowGap * 4}px` : _rowGap } : {},
+    ..._px !== void 0 ? {
+      paddingLeft: typeof _px === "number" ? `${_px * 4}px` : _px,
+      paddingRight: typeof _px === "number" ? `${_px * 4}px` : _px
+    } : {},
+    ..._py !== void 0 ? {
+      paddingTop: typeof _py === "number" ? `${_py * 4}px` : _py,
+      paddingBottom: typeof _py === "number" ? `${_py * 4}px` : _py
+    } : {},
+    ..._alignItems ? { alignItems: _alignItems } : {}
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ref,
+      className: cn("p-4", className),
+      style: Object.keys(bodyStyle).length > 0 ? bodyStyle : void 0,
+      ...rest
+    }
+  );
+});
+var PopoverHeader = React2__namespace.forwardRef(function PopoverHeader2(props, ref) {
+  const { className, ...rest } = props;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ref,
+      className: cn("px-4 pt-4 pb-0 font-semibold", className),
+      ...rest
+    }
+  );
+});
+var PopoverFooter = React2__namespace.forwardRef(function PopoverFooter2(props, ref) {
+  const { className, ...rest } = props;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ref,
+      className: cn("px-4 pb-4 pt-0", className),
+      ...rest
+    }
+  );
+});
+var PopoverTitle = React2__namespace.forwardRef(function PopoverTitle2(props, ref) {
+  const { className, ...rest } = props;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "h3",
+    {
+      ref,
+      className: cn("text-base font-semibold", className),
+      ...rest
+    }
+  );
+});
+var PopoverDescription = React2__namespace.forwardRef(function PopoverDescription2(props, ref) {
+  const { className, ...rest } = props;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "p",
+    {
+      ref,
+      className: cn("text-sm", className),
+      ...rest
+    }
+  );
+});
+
+exports.PopoverArrow = PopoverArrow;
+exports.PopoverBody = PopoverBody;
+exports.PopoverCloseTrigger = PopoverCloseTrigger;
+exports.PopoverCloseTriggerWrapper = PopoverCloseTriggerWrapper;
+exports.PopoverContent = PopoverContent;
+exports.PopoverDescription = PopoverDescription;
+exports.PopoverFooter = PopoverFooter;
+exports.PopoverHeader = PopoverHeader;
+exports.PopoverRoot = PopoverRoot;
+exports.PopoverTitle = PopoverTitle;
+exports.PopoverTrigger = PopoverTrigger;

package/dist/popover.d.cts

@@ -0,0 +1,73 @@
+import * as React from 'react';
+
+interface Positioning {
+    readonly placement?: string;
+    readonly offset?: {
+        readonly mainAxis?: number;
+        readonly crossAxis?: number;
+    };
+    readonly overflowPadding?: number;
+}
+interface PopoverRootProps {
+    readonly children?: React.ReactNode;
+    readonly open?: boolean;
+    readonly defaultOpen?: boolean;
+    /** Chakra-style callback: receives `{ open: boolean }` */
+    readonly onOpenChange?: (details: {
+        open: boolean;
+    }) => void;
+    readonly positioning?: Positioning;
+    readonly lazyMount?: boolean;
+    readonly unmountOnExit?: boolean;
+    readonly autoFocus?: boolean;
+    readonly closeOnInteractOutside?: boolean;
+    readonly modal?: boolean;
+}
+declare const PopoverRoot: (props: PopoverRootProps) => React.ReactElement;
+interface PopoverTriggerProps extends React.ComponentPropsWithoutRef<'button'> {
+    readonly asChild?: boolean;
+}
+declare const PopoverTrigger: React.ForwardRefExoticComponent<PopoverTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+interface PopoverContentProps extends React.ComponentPropsWithoutRef<'div'> {
+    readonly portalled?: boolean;
+    readonly portalRef?: React.RefObject<HTMLElement>;
+    readonly w?: string | Record<string, string>;
+    readonly minW?: string;
+    readonly maxW?: string;
+    readonly paddingTop?: number | string;
+}
+declare const PopoverContent: React.ForwardRefExoticComponent<PopoverContentProps & React.RefAttributes<HTMLDivElement>>;
+interface PopoverArrowProps extends React.ComponentPropsWithoutRef<'svg'> {
+}
+declare const PopoverArrow: React.ForwardRefExoticComponent<PopoverArrowProps & React.RefAttributes<SVGSVGElement>>;
+interface PopoverCloseTriggerProps extends React.ComponentPropsWithoutRef<'button'> {
+}
+declare const PopoverCloseTrigger: React.ForwardRefExoticComponent<PopoverCloseTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+interface PopoverCloseTriggerWrapperProps extends React.ComponentPropsWithoutRef<'button'> {
+    readonly disabled?: boolean;
+}
+declare const PopoverCloseTriggerWrapper: React.ForwardRefExoticComponent<PopoverCloseTriggerWrapperProps & React.RefAttributes<HTMLButtonElement>>;
+interface PopoverBodyProps extends React.ComponentPropsWithoutRef<'div'> {
+    readonly display?: string;
+    readonly flexDir?: string;
+    readonly rowGap?: number | string;
+    readonly px?: number | string;
+    readonly py?: number | string;
+    readonly textStyle?: string;
+    readonly alignItems?: string;
+}
+declare const PopoverBody: React.ForwardRefExoticComponent<PopoverBodyProps & React.RefAttributes<HTMLDivElement>>;
+interface PopoverHeaderProps extends React.ComponentPropsWithoutRef<'div'> {
+}
+declare const PopoverHeader: React.ForwardRefExoticComponent<PopoverHeaderProps & React.RefAttributes<HTMLDivElement>>;
+interface PopoverFooterProps extends React.ComponentPropsWithoutRef<'div'> {
+}
+declare const PopoverFooter: React.ForwardRefExoticComponent<PopoverFooterProps & React.RefAttributes<HTMLDivElement>>;
+interface PopoverTitleProps extends React.ComponentPropsWithoutRef<'h3'> {
+}
+declare const PopoverTitle: React.ForwardRefExoticComponent<PopoverTitleProps & React.RefAttributes<HTMLHeadingElement>>;
+interface PopoverDescriptionProps extends React.ComponentPropsWithoutRef<'p'> {
+}
+declare const PopoverDescription: React.ForwardRefExoticComponent<PopoverDescriptionProps & React.RefAttributes<HTMLParagraphElement>>;
+
+export { PopoverArrow, type PopoverArrowProps, PopoverBody, type PopoverBodyProps, PopoverCloseTrigger, type PopoverCloseTriggerProps, PopoverCloseTriggerWrapper, type PopoverCloseTriggerWrapperProps, PopoverContent, type PopoverContentProps, PopoverDescription, type PopoverDescriptionProps, PopoverFooter, type PopoverFooterProps, PopoverHeader, type PopoverHeaderProps, PopoverRoot, type PopoverRootProps, PopoverTitle, type PopoverTitleProps, PopoverTrigger, type PopoverTriggerProps };

package/dist/popover.d.ts

@@ -0,0 +1,73 @@
+import * as React from 'react';
+
+interface Positioning {
+    readonly placement?: string;
+    readonly offset?: {
+        readonly mainAxis?: number;
+        readonly crossAxis?: number;
+    };
+    readonly overflowPadding?: number;
+}
+interface PopoverRootProps {
+    readonly children?: React.ReactNode;
+    readonly open?: boolean;
+    readonly defaultOpen?: boolean;
+    /** Chakra-style callback: receives `{ open: boolean }` */
+    readonly onOpenChange?: (details: {
+        open: boolean;
+    }) => void;
+    readonly positioning?: Positioning;
+    readonly lazyMount?: boolean;
+    readonly unmountOnExit?: boolean;
+    readonly autoFocus?: boolean;
+    readonly closeOnInteractOutside?: boolean;
+    readonly modal?: boolean;
+}
+declare const PopoverRoot: (props: PopoverRootProps) => React.ReactElement;
+interface PopoverTriggerProps extends React.ComponentPropsWithoutRef<'button'> {
+    readonly asChild?: boolean;
+}
+declare const PopoverTrigger: React.ForwardRefExoticComponent<PopoverTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+interface PopoverContentProps extends React.ComponentPropsWithoutRef<'div'> {
+    readonly portalled?: boolean;
+    readonly portalRef?: React.RefObject<HTMLElement>;
+    readonly w?: string | Record<string, string>;
+    readonly minW?: string;
+    readonly maxW?: string;
+    readonly paddingTop?: number | string;
+}
+declare const PopoverContent: React.ForwardRefExoticComponent<PopoverContentProps & React.RefAttributes<HTMLDivElement>>;
+interface PopoverArrowProps extends React.ComponentPropsWithoutRef<'svg'> {
+}
+declare const PopoverArrow: React.ForwardRefExoticComponent<PopoverArrowProps & React.RefAttributes<SVGSVGElement>>;
+interface PopoverCloseTriggerProps extends React.ComponentPropsWithoutRef<'button'> {
+}
+declare const PopoverCloseTrigger: React.ForwardRefExoticComponent<PopoverCloseTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+interface PopoverCloseTriggerWrapperProps extends React.ComponentPropsWithoutRef<'button'> {
+    readonly disabled?: boolean;
+}
+declare const PopoverCloseTriggerWrapper: React.ForwardRefExoticComponent<PopoverCloseTriggerWrapperProps & React.RefAttributes<HTMLButtonElement>>;
+interface PopoverBodyProps extends React.ComponentPropsWithoutRef<'div'> {
+    readonly display?: string;
+    readonly flexDir?: string;
+    readonly rowGap?: number | string;
+    readonly px?: number | string;
+    readonly py?: number | string;
+    readonly textStyle?: string;
+    readonly alignItems?: string;
+}
+declare const PopoverBody: React.ForwardRefExoticComponent<PopoverBodyProps & React.RefAttributes<HTMLDivElement>>;
+interface PopoverHeaderProps extends React.ComponentPropsWithoutRef<'div'> {
+}
+declare const PopoverHeader: React.ForwardRefExoticComponent<PopoverHeaderProps & React.RefAttributes<HTMLDivElement>>;
+interface PopoverFooterProps extends React.ComponentPropsWithoutRef<'div'> {
+}
+declare const PopoverFooter: React.ForwardRefExoticComponent<PopoverFooterProps & React.RefAttributes<HTMLDivElement>>;
+interface PopoverTitleProps extends React.ComponentPropsWithoutRef<'h3'> {
+}
+declare const PopoverTitle: React.ForwardRefExoticComponent<PopoverTitleProps & React.RefAttributes<HTMLHeadingElement>>;
+interface PopoverDescriptionProps extends React.ComponentPropsWithoutRef<'p'> {
+}
+declare const PopoverDescription: React.ForwardRefExoticComponent<PopoverDescriptionProps & React.RefAttributes<HTMLParagraphElement>>;
+
+export { PopoverArrow, type PopoverArrowProps, PopoverBody, type PopoverBodyProps, PopoverCloseTrigger, type PopoverCloseTriggerProps, PopoverCloseTriggerWrapper, type PopoverCloseTriggerWrapperProps, PopoverContent, type PopoverContentProps, PopoverDescription, type PopoverDescriptionProps, PopoverFooter, type PopoverFooterProps, PopoverHeader, type PopoverHeaderProps, PopoverRoot, type PopoverRootProps, PopoverTitle, type PopoverTitleProps, PopoverTrigger, type PopoverTriggerProps };