kaleido-ui 0.2.2 → 0.2.5

package/dist/web/chunk-TY6SGZC7.js

@@ -0,0 +1,94 @@
+"use client";
+import {
+  Label
+} from "./chunk-H3GYLFHP.js";
+import {
+  GlyphButton
+} from "./chunk-JY3H7ZAI.js";
+import {
+  IconGlyph
+} from "./chunk-YQQ7GDLZ.js";
+import {
+  Close,
+  ContentPaste,
+  ProgressActivity
+} from "./chunk-XXH4TYKZ.js";
+
+// src/web/components/withdraw-destination-input.tsx
+import { useId, useLayoutEffect, useRef } from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+function WithdrawDestinationInput({
+  destination,
+  setDestination,
+  addressType,
+  detectedNetworkLabel,
+  isDecoding,
+  isResolvingLnurl,
+  handlePaste,
+  handleReset
+}) {
+  const inputId = useId();
+  const fieldRef = useRef(null);
+  useLayoutEffect(() => {
+    const field = fieldRef.current;
+    if (!field) return;
+    field.style.height = "auto";
+    field.style.height = `${field.scrollHeight}px`;
+  }, [destination]);
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
+    /* @__PURE__ */ jsx(Label, { htmlFor: inputId, className: "ml-1", children: "Destination" }),
+    /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+      /* @__PURE__ */ jsx(
+        "textarea",
+        {
+          ref: fieldRef,
+          id: inputId,
+          "data-testid": "withdraw-destination-input",
+          rows: 1,
+          spellCheck: false,
+          autoComplete: "off",
+          autoCapitalize: "off",
+          className: "block max-h-32 min-h-14 w-full resize-none break-all rounded-2xl bg-card/55 backdrop-blur-xl backdrop-saturate-150 bg-gradient-card px-5 py-4 pr-20 font-mono text-caption leading-relaxed text-foreground shadow-inner transition-all placeholder:text-foreground/20 focus:outline-none focus:ring-1 focus:ring-primary/50 focus:shadow-glow-primary-soft",
+          placeholder: "Address, Invoice, or RGB Invoice",
+          value: destination,
+          onChange: (event) => setDestination(event.target.value.replace(/\s*[\r\n]+\s*/g, "")),
+          onKeyDown: (event) => {
+            if (event.key === "Enter") event.preventDefault();
+          }
+        }
+      ),
+      /* @__PURE__ */ jsxs("div", { className: "absolute right-3 top-3 flex items-center gap-1", children: [
+        destination && /* @__PURE__ */ jsx(
+          GlyphButton,
+          {
+            icon: Close,
+            label: "Clear",
+            size: "sm",
+            onClick: () => {
+              setDestination("");
+              handleReset();
+            }
+          }
+        ),
+        /* @__PURE__ */ jsx(GlyphButton, { icon: ContentPaste, label: "Paste", variant: "surface", size: "sm", onClick: handlePaste })
+      ] })
+    ] }),
+    destination && /* @__PURE__ */ jsx("div", { className: "ml-1 flex items-center gap-2 text-caption", children: isDecoding || isResolvingLnurl ? /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-1 text-muted-foreground", children: [
+      /* @__PURE__ */ jsx(IconGlyph, { glyph: ProgressActivity, className: "animate-spin text-icon-sm" }),
+      isResolvingLnurl ? "Resolving..." : "Decoding..."
+    ] }) : addressType !== "unknown" && addressType !== "invalid" ? /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx("span", { className: "text-brand", children: "\u2713" }),
+      /* @__PURE__ */ jsxs("span", { "data-testid": "withdraw-detected-network", className: "text-muted-foreground", children: [
+        "Detected: ",
+        detectedNetworkLabel ?? addressType
+      ] })
+    ] }) : addressType === "invalid" ? /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx("span", { className: "text-danger-fg", children: "\u2717" }),
+      /* @__PURE__ */ jsx("span", { "data-testid": "withdraw-invalid-destination", className: "text-danger-fg", children: "Invalid address format" })
+    ] }) : null })
+  ] });
+}
+
+export {
+  WithdrawDestinationInput
+};

package/dist/web/chunk-U2UWLSDG.js

@@ -0,0 +1,86 @@
+"use client";
+import {
+  Input
+} from "./chunk-5GBURTY4.js";
+import {
+  Label
+} from "./chunk-H3GYLFHP.js";
+import {
+  GlyphButton
+} from "./chunk-JY3H7ZAI.js";
+import {
+  Button
+} from "./chunk-OWSKP527.js";
+import {
+  IconGlyph
+} from "./chunk-YQQ7GDLZ.js";
+import {
+  cn
+} from "./chunk-PMGIJMRO.js";
+import {
+  Refresh
+} from "./chunk-XXH4TYKZ.js";
+
+// src/web/components/date-range-filter.tsx
+import { useId } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+function DateRangeFilter({
+  value,
+  onChange,
+  onRefresh,
+  isRefreshing = false,
+  fromLabel = "From",
+  toLabel = "To",
+  clearLabel = "Clear",
+  refreshLabel = "Refresh",
+  showClear = true,
+  className
+}) {
+  const id = useId().replace(/:/g, "");
+  const empty = !value.from && !value.to;
+  return /* @__PURE__ */ jsxs("div", { "data-slot": "date-range-filter", className: cn("flex flex-wrap items-end gap-3", className), children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex min-w-36 flex-col gap-2", children: [
+      /* @__PURE__ */ jsx(Label, { htmlFor: `${id}-from`, children: fromLabel }),
+      /* @__PURE__ */ jsx(
+        Input,
+        {
+          id: `${id}-from`,
+          type: "date",
+          value: value.from,
+          max: value.to || void 0,
+          onChange: (event) => onChange({ ...value, from: event.target.value })
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "flex min-w-36 flex-col gap-2", children: [
+      /* @__PURE__ */ jsx(Label, { htmlFor: `${id}-to`, children: toLabel }),
+      /* @__PURE__ */ jsx(
+        Input,
+        {
+          id: `${id}-to`,
+          type: "date",
+          value: value.to,
+          min: value.from || void 0,
+          onChange: (event) => onChange({ ...value, to: event.target.value })
+        }
+      )
+    ] }),
+    showClear && /* @__PURE__ */ jsx(Button, { type: "button", variant: "ghost", disabled: empty, onClick: () => onChange({ from: "", to: "" }), children: clearLabel }),
+    onRefresh && /* @__PURE__ */ jsx(
+      GlyphButton,
+      {
+        label: refreshLabel,
+        variant: "surface",
+        size: "lg",
+        disabled: isRefreshing,
+        "aria-busy": isRefreshing || void 0,
+        onClick: onRefresh,
+        icon: /* @__PURE__ */ jsx(IconGlyph, { glyph: Refresh, "aria-hidden": "true", className: cn(isRefreshing && "animate-spin motion-reduce:animate-none") })
+      }
+    )
+  ] });
+}
+
+export {
+  DateRangeFilter
+};

package/dist/web/chunk-UHXOPILM.js

@@ -0,0 +1,101 @@
+"use client";
+import {
+  floatingSurface
+} from "./chunk-CRMLYZIX.js";
+import {
+  MENU_VISIBLE_ITEMS,
+  MenuNoResults,
+  MenuSearch,
+  countMenuItems,
+  filterMenuItems,
+  isElementOf
+} from "./chunk-CBE7BT3M.js";
+import {
+  ScrollArea
+} from "./chunk-DCUAE6PX.js";
+import {
+  eyebrow
+} from "./chunk-MTQOAMDW.js";
+import {
+  cn
+} from "./chunk-PMGIJMRO.js";
+
+// src/web/primitives/dropdown-menu.tsx
+import * as React from "react";
+import * as MenuPrimitive from "@radix-ui/react-dropdown-menu";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var DropdownMenu = MenuPrimitive.Root;
+var DropdownMenuTrigger = MenuPrimitive.Trigger;
+var DropdownMenuGroup = MenuPrimitive.Group;
+var DropdownMenuPortal = MenuPrimitive.Portal;
+var MENU_MAX_HEIGHT = "max-h-[152px]";
+var isMenuItem = (element) => isElementOf(DropdownMenuItem)(element);
+function MenuBody({ children }) {
+  const [query, setQuery] = React.useState("");
+  const searchable = countMenuItems(children, isMenuItem) > MENU_VISIBLE_ITEMS;
+  const searching = searchable && query.trim() !== "";
+  const shown = searching ? filterMenuItems(children, isMenuItem, query) : children;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    searchable && /* @__PURE__ */ jsx(MenuSearch, { value: query, onChange: setQuery }),
+    /* @__PURE__ */ jsxs(ScrollArea, { viewportClassName: searchable ? MENU_MAX_HEIGHT : void 0, children: [
+      shown,
+      searching && React.Children.count(shown) === 0 && /* @__PURE__ */ jsx(MenuNoResults, {})
+    ] })
+  ] });
+}
+var DropdownMenuContent = React.forwardRef(({ className, children, sideOffset = 6, align = "end", ...props }, ref) => /* @__PURE__ */ jsx(MenuPrimitive.Portal, { children: /* @__PURE__ */ jsx(
+  MenuPrimitive.Content,
+  {
+    ref,
+    "data-slot": "dropdown-menu-content",
+    sideOffset,
+    align,
+    className: cn(floatingSurface, "min-w-44 p-1.5", className),
+    ...props,
+    children: /* @__PURE__ */ jsx(MenuBody, { children })
+  }
+) }));
+DropdownMenuContent.displayName = MenuPrimitive.Content.displayName;
+var DropdownMenuItem = React.forwardRef(
+  ({ className, destructive = false, icon, children, ...props }, ref) => /* @__PURE__ */ jsxs(
+    MenuPrimitive.Item,
+    {
+      ref,
+      "data-slot": "dropdown-menu-item",
+      "data-destructive": destructive || void 0,
+      className: cn(
+        "flex cursor-default select-none items-center gap-2 rounded-xl px-3 py-2 text-caption font-medium outline-none transition-colors data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+        destructive ? "text-danger-fg data-[highlighted]:bg-danger/10" : "text-foreground data-[highlighted]:bg-secondary/15",
+        className
+      ),
+      ...props,
+      children: [
+        icon && /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "flex shrink-0 text-icon-md", children: icon }),
+        children
+      ]
+    }
+  )
+);
+DropdownMenuItem.displayName = MenuPrimitive.Item.displayName;
+var DropdownMenuLabel = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  MenuPrimitive.Label,
+  {
+    ref,
+    className: cn("px-3 pb-1 pt-2 text-muted-foreground", eyebrow, className),
+    ...props
+  }
+));
+DropdownMenuLabel.displayName = MenuPrimitive.Label.displayName;
+var DropdownMenuSeparator = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(MenuPrimitive.Separator, { ref, className: cn("-mx-1.5 my-1.5 h-px bg-secondary/15", className), ...props }));
+DropdownMenuSeparator.displayName = MenuPrimitive.Separator.displayName;
+
+export {
+  DropdownMenu,
+  DropdownMenuTrigger,
+  DropdownMenuGroup,
+  DropdownMenuPortal,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuLabel,
+  DropdownMenuSeparator
+};

package/dist/web/chunk-UXLWWQ4J.js

@@ -0,0 +1,20 @@
+"use client";
+import {
+  cn
+} from "./chunk-PMGIJMRO.js";
+
+// src/web/components/section-label.tsx
+import { jsx } from "react/jsx-runtime";
+function SectionLabel({ children, className }) {
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      className: cn("text-mini font-medium uppercase tracking-eyebrow-wide text-muted-foreground", className),
+      children
+    }
+  );
+}
+
+export {
+  SectionLabel
+};

package/dist/web/chunk-UZ4LWR4X.js

@@ -0,0 +1,26 @@
+"use client";
+import {
+  cn
+} from "./chunk-PMGIJMRO.js";
+
+// src/web/components/empty-state.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+function EmptyState({ title, description, action, icon, className, descriptionClassName }) {
+  return /* @__PURE__ */ jsxs("div", { "data-slot": "empty-state", className: cn("flex flex-col items-center justify-center py-16 text-center", className), children: [
+    icon && /* @__PURE__ */ jsx(
+      "div",
+      {
+        "aria-hidden": "true",
+        className: "mb-4 flex size-16 items-center justify-center rounded-full bg-secondary/15 text-secondary-content shadow-glow-violet-soft",
+        children: icon
+      }
+    ),
+    /* @__PURE__ */ jsx("h3", { className: "m-0 mb-1 text-body font-semibold text-foreground", children: title }),
+    description && /* @__PURE__ */ jsx("p", { className: cn("m-0 mb-4 max-w-[240px] text-caption text-muted-foreground", descriptionClassName), children: description }),
+    action
+  ] });
+}
+
+export {
+  EmptyState
+};