@px-ui/core 1.23.0 → 1.24.0

package/dist/components/combobox.js

@@ -0,0 +1,368 @@
+import { j as e } from "../_virtual/jsx-runtime.js";
+import * as u from "react";
+import { cn as s } from "../utils/classnames.js";
+import S from "../hooks/use-infinite-scroll.js";
+import { Spinner as L } from "./spinner.js";
+import { DROPDOWN_POPUP_CN as T, DROPDOWN_POSITIONER_CN as k, DROPDOWN_ITEM_CN as y } from "../tw-styles/dropdown.js";
+import E from "../icons/clear-icon.js";
+import j from "../icons/chevron-down-icon.js";
+import _ from "../icons/search-icon.js";
+import D from "../icons/check-icon.js";
+import V from "../icons/close-icon.js";
+import { Root as M, Input as A, Addon as W, Button as w } from "./input-group.js";
+import { cva as I } from "../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js";
+import { useAsyncOptions as P } from "../hooks/use-async-options.js";
+import { ComboboxList as B } from "../node_modules/.pnpm/@base-ui-components_react@1.0.0-beta.4_@types_react@19.2.0_react-dom@19.2.0_react@19.2.0/node_modules/@base-ui-components/react/esm/combobox/list/ComboboxList.js";
+import { ComboboxRoot as F } from "../node_modules/.pnpm/@base-ui-components_react@1.0.0-beta.4_@types_react@19.2.0_react-dom@19.2.0_react@19.2.0/node_modules/@base-ui-components/react/esm/combobox/root/ComboboxRoot.js";
+import { ComboboxPortal as G } from "../node_modules/.pnpm/@base-ui-components_react@1.0.0-beta.4_@types_react@19.2.0_react-dom@19.2.0_react@19.2.0/node_modules/@base-ui-components/react/esm/combobox/portal/ComboboxPortal.js";
+import { ComboboxPositioner as H } from "../node_modules/.pnpm/@base-ui-components_react@1.0.0-beta.4_@types_react@19.2.0_react-dom@19.2.0_react@19.2.0/node_modules/@base-ui-components/react/esm/combobox/positioner/ComboboxPositioner.js";
+import { ComboboxPopup as U } from "../node_modules/.pnpm/@base-ui-components_react@1.0.0-beta.4_@types_react@19.2.0_react-dom@19.2.0_react@19.2.0/node_modules/@base-ui-components/react/esm/combobox/popup/ComboboxPopup.js";
+import { ComboboxEmpty as X } from "../node_modules/.pnpm/@base-ui-components_react@1.0.0-beta.4_@types_react@19.2.0_react-dom@19.2.0_react@19.2.0/node_modules/@base-ui-components/react/esm/combobox/empty/ComboboxEmpty.js";
+import { ComboboxStatus as h } from "../node_modules/.pnpm/@base-ui-components_react@1.0.0-beta.4_@types_react@19.2.0_react-dom@19.2.0_react@19.2.0/node_modules/@base-ui-components/react/esm/combobox/status/ComboboxStatus.js";
+import { ComboboxItem as O } from "../node_modules/.pnpm/@base-ui-components_react@1.0.0-beta.4_@types_react@19.2.0_react-dom@19.2.0_react@19.2.0/node_modules/@base-ui-components/react/esm/combobox/item/ComboboxItem.js";
+import { ComboboxInput as g } from "../node_modules/.pnpm/@base-ui-components_react@1.0.0-beta.4_@types_react@19.2.0_react-dom@19.2.0_react@19.2.0/node_modules/@base-ui-components/react/esm/combobox/input/ComboboxInput.js";
+import { ComboboxClear as $ } from "../node_modules/.pnpm/@base-ui-components_react@1.0.0-beta.4_@types_react@19.2.0_react-dom@19.2.0_react@19.2.0/node_modules/@base-ui-components/react/esm/combobox/clear/ComboboxClear.js";
+import { ComboboxTrigger as N } from "../node_modules/.pnpm/@base-ui-components_react@1.0.0-beta.4_@types_react@19.2.0_react-dom@19.2.0_react@19.2.0/node_modules/@base-ui-components/react/esm/combobox/trigger/ComboboxTrigger.js";
+import { ComboboxValue as R } from "../node_modules/.pnpm/@base-ui-components_react@1.0.0-beta.4_@types_react@19.2.0_react-dom@19.2.0_react@19.2.0/node_modules/@base-ui-components/react/esm/combobox/value/ComboboxValue.js";
+import { ComboboxChips as q } from "../node_modules/.pnpm/@base-ui-components_react@1.0.0-beta.4_@types_react@19.2.0_react-dom@19.2.0_react@19.2.0/node_modules/@base-ui-components/react/esm/combobox/chips/ComboboxChips.js";
+import { ComboboxChip as J } from "../node_modules/.pnpm/@base-ui-components_react@1.0.0-beta.4_@types_react@19.2.0_react-dom@19.2.0_react@19.2.0/node_modules/@base-ui-components/react/esm/combobox/chip/ComboboxChip.js";
+import { ComboboxChipRemove as K } from "../node_modules/.pnpm/@base-ui-components_react@1.0.0-beta.4_@types_react@19.2.0_react-dom@19.2.0_react@19.2.0/node_modules/@base-ui-components/react/esm/combobox/chip-remove/ComboboxChipRemove.js";
+import { ComboboxItemIndicator as Q } from "../node_modules/.pnpm/@base-ui-components_react@1.0.0-beta.4_@types_react@19.2.0_react-dom@19.2.0_react@19.2.0/node_modules/@base-ui-components/react/esm/combobox/item-indicator/ComboboxItemIndicator.js";
+const b = "px-4 py-2 text-ppx-sm min-h-11 flex items-center justify-center text-ppx-muted-foreground", Te = B, z = u.createContext(
+  {}
+);
+function ke({
+  children: n,
+  ...t
+}) {
+  const r = u.useRef(null), [i, l] = u.useState(!1), [a, o] = u.useState(""), m = {
+    ...{
+      open: i,
+      onOpenChange: l,
+      inputValue: a,
+      onInputValueChange: o
+    },
+    ...t
+  }, d = {
+    ...t.loadOptions ? P(t.loadOptions, {
+      isOpen: m.open,
+      inputValue: m.inputValue
+    }) : {},
+    ...m
+  }, f = {
+    ...d,
+    chipsContainerRef: r
+  };
+  return /* @__PURE__ */ e.jsx(z.Provider, { value: f, children: /* @__PURE__ */ e.jsx(F, { autoHighlight: !0, ...d, children: n }) });
+}
+function Ee({
+  empty: n = "No options",
+  portalProps: t,
+  positionerProps: r,
+  popupProps: i,
+  children: l
+}) {
+  const {
+    chipsContainerRef: a,
+    isLoading: o,
+    isError: c,
+    isLoadingMore: m,
+    hasMore: p,
+    onLoadMore: d
+  } = x(), [f] = S({
+    isLoadingMore: !!m,
+    hasMore: !!p,
+    onLoadMore: () => d == null ? void 0 : d(),
+    disabled: c
+  });
+  return /* @__PURE__ */ e.jsx(G, { ...t, children: /* @__PURE__ */ e.jsx(
+    H,
+    {
+      sideOffset: (v) => v.anchor.width < 280 && v.anchor.width > 200 ? 10 : 6,
+      align: "start",
+      ...r,
+      className: s(k, r == null ? void 0 : r.className),
+      anchor: (r == null ? void 0 : r.anchor) ?? a,
+      children: /* @__PURE__ */ e.jsxs(
+        U,
+        {
+          className: s(
+            T,
+            "scroll-pt-2 scroll-pb-2 overscroll-contain",
+            i == null ? void 0 : i.className
+          ),
+          ...i,
+          children: [
+            l,
+            !o && !c && /* @__PURE__ */ e.jsx(
+              X,
+              {
+                className: s(b, "empty:hidden"),
+                children: n
+              }
+            ),
+            o && /* @__PURE__ */ e.jsx(h, { className: b, children: "Loading..." }),
+            c && /* @__PURE__ */ e.jsx(h, { className: b, children: "Error loading options" }),
+            p && /* @__PURE__ */ e.jsx(
+              h,
+              {
+                ref: f,
+                className: "h-10 flex items-center justify-center",
+                "aria-label": "Loading more options",
+                children: /* @__PURE__ */ e.jsx(L, { className: "stroke-ppx-neutral-10", size: "medium" })
+              }
+            )
+          ]
+        }
+      )
+    }
+  ) });
+}
+function _e({
+  className: n,
+  ...t
+}) {
+  return /* @__PURE__ */ e.jsx(O, { className: s(y, n), ...t, children: t.children });
+}
+function De({
+  className: n,
+  ...t
+}) {
+  return /* @__PURE__ */ e.jsx(
+    O,
+    {
+      ...t,
+      render: (r, i) => /* @__PURE__ */ e.jsxs("div", { ...r, className: s(y, n), children: [
+        /* @__PURE__ */ e.jsx(Y, { selected: i.selected }),
+        t.children
+      ] })
+    }
+  );
+}
+function Y(n) {
+  return /* @__PURE__ */ e.jsx(
+    "div",
+    {
+      className: s(
+        "peer rounded-sm size-4 flex shrink-0 items-center justify-center border border-ppx-neutral-10 bg-ppx-background transition-colors duration-150 outline-none",
+        n.selected && "text-white border-ppx-primary-5 bg-ppx-primary-5"
+      ),
+      children: /* @__PURE__ */ e.jsx(Q, { children: /* @__PURE__ */ e.jsx(D, {}) })
+    }
+  );
+}
+function C(n) {
+  return /* @__PURE__ */ e.jsx("div", { className: s("flex items-center justify-center", n.className), children: /* @__PURE__ */ e.jsxs("div", { className: "space-x-1 flex", children: [
+    /* @__PURE__ */ e.jsx("div", { className: "w-1 h-1 animate-bounce rounded-full bg-ppx-foreground opacity-40 [animation-delay:-0.3s] [animation-name:bounce-color]" }),
+    /* @__PURE__ */ e.jsx("div", { className: "w-1 h-1 animate-bounce rounded-full bg-ppx-foreground opacity-70 [animation-delay:-0.15s] [animation-name:bounce-color]" }),
+    /* @__PURE__ */ e.jsx("div", { className: "w-1 h-1 animate-bounce rounded-full bg-ppx-foreground opacity-100 [animation-name:bounce-color]" })
+  ] }) });
+}
+function Ve(n) {
+  const { invalid: t, disabled: r } = x();
+  return /* @__PURE__ */ e.jsxs(M, { ...n, disabled: r, children: [
+    /* @__PURE__ */ e.jsx(
+      g,
+      {
+        render: (i) => /* @__PURE__ */ e.jsx(
+          A,
+          {
+            ...i,
+            invalid: t,
+            placeholder: n.placeholder
+          }
+        )
+      }
+    ),
+    n.addons,
+    /* @__PURE__ */ e.jsx(Z, {})
+  ] });
+}
+function Z() {
+  const { isLoading: n } = x();
+  return /* @__PURE__ */ e.jsxs(W, { align: "inline-end", className: "gap-0.5", children: [
+    n && /* @__PURE__ */ e.jsx(C, { className: "mr-2" }),
+    !n && /* @__PURE__ */ e.jsx(
+      $,
+      {
+        "aria-label": "Clear selection",
+        render: (t) => /* @__PURE__ */ e.jsx(w, { size: "icon-xs", ...t, children: /* @__PURE__ */ e.jsx(E, { className: "size-4" }) })
+      }
+    ),
+    /* @__PURE__ */ e.jsx(
+      N,
+      {
+        render: (t) => /* @__PURE__ */ e.jsx(
+          w,
+          {
+            size: "icon-xs",
+            "aria-label": "Open popup",
+            ...t,
+            children: /* @__PURE__ */ e.jsx(j, {})
+          }
+        )
+      }
+    )
+  ] });
+}
+const ee = I(
+  "gap-2 text-ppx-sm bg-ppx-neutral-1 inline-flex items-center justify-between border border-ppx-neutral-5 aria-invalid:border-ppx-red-4 text-ppx-foreground outline-transparent p-input focus-visible:outline-2 focus-visible:-outline-offset-1 focus-visible:outline-ppx-primary-2 focus-visible:aria-invalid:outline-transparent data-disabled:cursor-not-allowed data-disabled:border-ppx-neutral-3 data-disabled:bg-ppx-neutral-3 data-disabled:text-ppx-neutral-11",
+  {
+    variants: {
+      size: {
+        default: "rounded-input h-input",
+        sm: "rounded-input-s h-input-s"
+      },
+      widthVariant: {
+        enforced: "min-w-input w-[var(--min-width-input)]",
+        fit: "min-w-0 w-fit",
+        full: "min-w-0 w-full"
+      }
+    },
+    defaultVariants: {
+      size: "default",
+      widthVariant: "enforced"
+    }
+  }
+);
+function Me({
+  size: n,
+  widthVariant: t,
+  ...r
+}) {
+  const { isLoading: i, invalid: l } = x();
+  return /* @__PURE__ */ e.jsxs(
+    N,
+    {
+      "aria-label": "Open popup",
+      className: s(ee({ size: n, widthVariant: t }), r.className),
+      "aria-invalid": l ?? void 0,
+      children: [
+        /* @__PURE__ */ e.jsx(R, { children: (a) => {
+          if (a == null && r.placeholder)
+            return /* @__PURE__ */ e.jsx("span", { className: "truncate text-ppx-foreground", children: r.placeholder });
+          if (r.children) {
+            const o = typeof r.children == "function" ? r.children(a) : r.children;
+            return typeof o == "string" ? /* @__PURE__ */ e.jsx("span", { className: "truncate", children: o }) : o;
+          }
+          return typeof a == "string" ? /* @__PURE__ */ e.jsx("span", { className: "truncate", children: a }) : a && typeof a == "object" && "label" in a ? /* @__PURE__ */ e.jsx("span", { className: "truncate", children: a.label }) : null;
+        } }),
+        /* @__PURE__ */ e.jsxs("div", { className: "gap-2 flex items-center", children: [
+          i && /* @__PURE__ */ e.jsx(C, {}),
+          /* @__PURE__ */ e.jsx(j, {})
+        ] })
+      ]
+    }
+  );
+}
+const ne = I(
+  "p-input text-ppx-sm bg-ppx-neutral-1 inline-flex items-center justify-between border border-ppx-neutral-5 focus-within:outline-2 focus-within:-outline-offset-1 focus-within:outline-ppx-primary-2 aria-invalid:border-ppx-red-4 focus-within:aria-invalid:outline-transparent has-data-disabled:border-ppx-neutral-3 has-data-disabled:bg-ppx-neutral-3 has-data-disabled:text-ppx-neutral-11 has-data-disabled:cursor-not-allowed",
+  {
+    variants: {
+      size: {
+        default: "rounded-input min-h-input",
+        sm: "rounded-input-s min-h-input-s"
+      },
+      widthVariant: {
+        enforced: "min-w-input w-[var(--min-width-input)]",
+        full: "min-w-0 w-full"
+      }
+    },
+    defaultVariants: {
+      size: "default",
+      widthVariant: "enforced"
+    }
+  }
+);
+function Ae({
+  size: n,
+  widthVariant: t,
+  ...r
+}) {
+  const { chipsContainerRef: i, isLoading: l, invalid: a } = x();
+  return /* @__PURE__ */ e.jsxs(
+    q,
+    {
+      className: s(
+        ne({ size: n, widthVariant: t }),
+        r.className
+      ),
+      "aria-invalid": a ?? void 0,
+      ref: i,
+      children: [
+        /* @__PURE__ */ e.jsx("div", { className: "gap-1 flex flex-1 flex-wrap items-center", children: /* @__PURE__ */ e.jsx(R, { children: (o) => /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+          o.map((c) => typeof r.children == "function" ? r.children(c) : r.children),
+          /* @__PURE__ */ e.jsx(
+            g,
+            {
+              placeholder: o.length > 0 ? "" : r.placeholder,
+              className: "min-w-12 flex-1 border-0 text-ppx-sm text-ppx-foreground outline-none"
+            }
+          )
+        ] }) }) }),
+        /* @__PURE__ */ e.jsxs("div", { className: "gap-2 flex h-stretch-available items-center text-ppx-muted-foreground", children: [
+          l && /* @__PURE__ */ e.jsx(C, {}),
+          /* @__PURE__ */ e.jsx(N, { className: "h-full", children: /* @__PURE__ */ e.jsx(j, {}) })
+        ] })
+      ]
+    }
+  );
+}
+function We(n) {
+  return /* @__PURE__ */ e.jsxs(
+    J,
+    {
+      ...n,
+      className: s(
+        "gap-1 pl-2 pr-1 text-sm flex cursor-default items-center rounded-full bg-ppx-neutral-3 py-[0.2rem] text-ppx-foreground outline-none",
+        n.className
+      ),
+      children: [
+        n.children,
+        /* @__PURE__ */ e.jsx(
+          K,
+          {
+            className: "size-5 flex shrink-0 items-center justify-center rounded-full border border-transparent text-inherit hover:border-ppx-neutral-4 hover:bg-ppx-neutral-5 hover:text-ppx-background active:bg-ppx-neutral-6",
+            "aria-label": "Remove",
+            children: /* @__PURE__ */ e.jsx(V, { className: "size-3" })
+          }
+        )
+      ]
+    }
+  );
+}
+function Pe({
+  placeholder: n = "Search options",
+  ...t
+}) {
+  return /* @__PURE__ */ e.jsxs("div", { className: "top-0 gap-2 sticky z-10 flex items-center justify-between border-b-[0.75px] border-ppx-neutral-7 bg-ppx-background p-input", children: [
+    /* @__PURE__ */ e.jsx(
+      g,
+      {
+        placeholder: n,
+        className: "text-sm flex-1 placeholder:text-ppx-neutral-7 focus:outline-none",
+        "data-popup-search": !0,
+        ...t
+      }
+    ),
+    /* @__PURE__ */ e.jsx(_, { className: "size-3.5 text-ppx-neutral-10" })
+  ] });
+}
+function x() {
+  return u.useContext(z);
+}
+export {
+  We as Chip,
+  Ae as ChipsTrigger,
+  Ee as Content,
+  _e as Item,
+  Te as List,
+  C as LoadingIndicator,
+  De as MultiItem,
+  ke as Root,
+  Pe as Search,
+  Ve as SearchableTrigger,
+  Z as SearchableTriggerDropdownAddon,
+  Me as Trigger,
+  ee as triggerVariants
+};

package/dist/components/dialog.js

@@ -0,0 +1,152 @@
+import { j as o } from "../_virtual/jsx-runtime.js";
+import { cn as a } from "../utils/classnames.js";
+import { DialogRoot as l } from "../node_modules/.pnpm/@base-ui-components_react@1.0.0-beta.4_@types_react@19.2.0_react-dom@19.2.0_react@19.2.0/node_modules/@base-ui-components/react/esm/dialog/root/DialogRoot.js";
+import { DialogPortal as n } from "../node_modules/.pnpm/@base-ui-components_react@1.0.0-beta.4_@types_react@19.2.0_react-dom@19.2.0_react@19.2.0/node_modules/@base-ui-components/react/esm/dialog/portal/DialogPortal.js";
+import { DialogBackdrop as i } from "../node_modules/.pnpm/@base-ui-components_react@1.0.0-beta.4_@types_react@19.2.0_react-dom@19.2.0_react@19.2.0/node_modules/@base-ui-components/react/esm/dialog/backdrop/DialogBackdrop.js";
+import { DialogClose as s } from "../node_modules/.pnpm/@base-ui-components_react@1.0.0-beta.4_@types_react@19.2.0_react-dom@19.2.0_react@19.2.0/node_modules/@base-ui-components/react/esm/dialog/close/DialogClose.js";
+import { DialogTrigger as d } from "../node_modules/.pnpm/@base-ui-components_react@1.0.0-beta.4_@types_react@19.2.0_react-dom@19.2.0_react@19.2.0/node_modules/@base-ui-components/react/esm/dialog/trigger/DialogTrigger.js";
+import { DialogPopup as g } from "../node_modules/.pnpm/@base-ui-components_react@1.0.0-beta.4_@types_react@19.2.0_react-dom@19.2.0_react@19.2.0/node_modules/@base-ui-components/react/esm/dialog/popup/DialogPopup.js";
+import { DialogTitle as c } from "../node_modules/.pnpm/@base-ui-components_react@1.0.0-beta.4_@types_react@19.2.0_react-dom@19.2.0_react@19.2.0/node_modules/@base-ui-components/react/esm/dialog/title/DialogTitle.js";
+import { DialogDescription as m } from "../node_modules/.pnpm/@base-ui-components_react@1.0.0-beta.4_@types_react@19.2.0_react-dom@19.2.0_react@19.2.0/node_modules/@base-ui-components/react/esm/dialog/description/DialogDescription.js";
+function k({ ...t }) {
+  return /* @__PURE__ */ o.jsx(l, { "data-slot": "dialog", ...t });
+}
+function f({ ...t }) {
+  return /* @__PURE__ */ o.jsx(n, { "data-slot": "dialog-portal", ...t });
+}
+function C({
+  ...t
+}) {
+  return /* @__PURE__ */ o.jsx(d, { "data-slot": "dialog-trigger", ...t });
+}
+function T({ ...t }) {
+  return /* @__PURE__ */ o.jsx(s, { "data-slot": "dialog-close", ...t });
+}
+function u({
+  className: t,
+  ...e
+}) {
+  return /* @__PURE__ */ o.jsx(
+    i,
+    {
+      "data-slot": "dialog-overlay",
+      className: a(
+        "fixed inset-0 bg-black/50 transition-all duration-200 [&[data-ending-style]]:opacity-0 [&[data-starting-style]]:opacity-0",
+        t
+      ),
+      ...e
+    }
+  );
+}
+function z({
+  className: t,
+  children: e,
+  ...r
+}) {
+  return /* @__PURE__ */ o.jsxs(f, { "data-slot": "dialog-portal", children: [
+    /* @__PURE__ */ o.jsx(u, {}),
+    /* @__PURE__ */ o.jsxs(
+      g,
+      {
+        "data-slot": "dialog-content",
+        className: a(
+          "bg-popover text-popover-foreground fixed z-50 grid w-full sm:max-w-[calc(100%-2rem)]",
+          "gap-4 rounded-lg border p-6 shadow-lg duration-200 outline-none sm:max-w-lg sm:scale-[calc(1-0.1*var(--nested-dialogs))]",
+          "fixed bottom-0 w-full sm:top-[50%] sm:bottom-auto sm:left-[50%] sm:translate-x-[-50%] sm:translate-y-[-50%]",
+          "duration-200",
+          "data-[starting-style]:translate-y-full data-[starting-style]:opacity-0",
+          "data-[ending-style]:translate-y-full data-[ending-style]:opacity-0",
+          "data-[starting-style]:sm:translate-y-[-50%] data-[starting-style]:sm:scale-95",
+          "data-[ending-style]:sm:translate-y-[-50%] data-[ending-style]:sm:scale-95",
+          t
+        ),
+        ...r,
+        children: [
+          e,
+          /* @__PURE__ */ o.jsxs(s, { className: "ring-offset-popover focus:ring-ring text-muted-foreground absolute top-4 right-4 rounded-xs opacity-50 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", children: [
+            /* @__PURE__ */ o.jsxs(
+              "svg",
+              {
+                xmlns: "http://www.w3.org/2000/svg",
+                width: "24",
+                height: "24",
+                viewBox: "0 0 24 24",
+                fill: "none",
+                stroke: "currentColor",
+                "stroke-width": "2",
+                "stroke-linecap": "round",
+                "stroke-linejoin": "round",
+                children: [
+                  /* @__PURE__ */ o.jsx("path", { d: "M18 6 6 18" }),
+                  /* @__PURE__ */ o.jsx("path", { d: "m6 6 12 12" })
+                ]
+              }
+            ),
+            /* @__PURE__ */ o.jsx("span", { className: "sr-only", children: "Close" })
+          ] })
+        ]
+      }
+    )
+  ] });
+}
+function P({ className: t, ...e }) {
+  return /* @__PURE__ */ o.jsx(
+    "div",
+    {
+      "data-slot": "dialog-header",
+      className: a("flex flex-col gap-2 text-center sm:text-left", t),
+      ...e
+    }
+  );
+}
+function R({ className: t, ...e }) {
+  return /* @__PURE__ */ o.jsx(
+    "div",
+    {
+      "data-slot": "dialog-footer",
+      className: a(
+        "flex flex-col-reverse gap-2 sm:flex-row sm:justify-end",
+        t
+      ),
+      ...e
+    }
+  );
+}
+function _({
+  className: t,
+  ...e
+}) {
+  return /* @__PURE__ */ o.jsx(
+    c,
+    {
+      "data-slot": "dialog-title",
+      className: a("text-lg leading-none font-semibold", t),
+      ...e
+    }
+  );
+}
+function B({
+  className: t,
+  ...e
+}) {
+  return /* @__PURE__ */ o.jsx(
+    m,
+    {
+      "data-slot": "dialog-description",
+      className: a("text-muted-foreground text-sm", t),
+      ...e
+    }
+  );
+}
+export {
+  T as Close,
+  z as Content,
+  B as Description,
+  R as Footer,
+  P as Header,
+  u as Overlay,
+  f as Portal,
+  k as Root,
+  _ as Title,
+  C as Trigger
+};

package/dist/components/input-group.js

@@ -0,0 +1,148 @@
+import { j as o } from "../_virtual/jsx-runtime.js";
+import { cva as s } from "../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js";
+import { cn as r } from "../utils/classnames.js";
+import { Button as p } from "./button.js";
+const l = s(
+  "group/input-group relative flex items-center border border-ppx-neutral-5 bg-ppx-neutral-1 outline-transparent has-[[data-slot=input-group-control]:focus-visible]:outline-2 has-[[data-slot=input-group-control]:focus-visible]:-outline-offset-1 has-[[data-slot=input-group-control]:focus-visible]:bg-ppx-background has-[[data-slot=input-group-control]:focus-visible]:outline-ppx-primary-2 has-[[data-slot][aria-invalid=true]]:outline-ppx-red-4 has-[[data-slot][aria-invalid=true]]:outline has-[[data-slot][aria-invalid=true]]:-outline-offset-1 has-[[data-slot][aria-invalid=true]]:bg-ppx-red-1 has-[[data-slot=input-group-control]:disabled]:*:cursor-not-allowed has-[[data-slot=input-group-control]:disabled]:border-ppx-neutral-3 has-[[data-slot=input-group-control]:disabled]:bg-ppx-neutral-3 has-[[data-slot=input-group-control]:disabled]:text-ppx-neutral-11 has-[>[data-align=inline-start]]:[&>input]:pl-input has-[>[data-align=inline-end]]:[&>input]:pr-input",
+  {
+    variants: {
+      size: {
+        default: "h-input rounded-input",
+        sm: "h-input-s rounded-input-s"
+      },
+      widthVariant: {
+        enforced: "min-w-input w-[var(--min-width-input)]",
+        fit: "min-w-0 w-fit",
+        full: "min-w-0 w-full"
+      }
+    },
+    defaultVariants: {
+      size: "default",
+      widthVariant: "enforced"
+    }
+  }
+);
+function h({
+  className: n,
+  size: t,
+  disabled: a,
+  widthVariant: e,
+  ...i
+}) {
+  return /* @__PURE__ */ o.jsx(
+    "div",
+    {
+      "data-slot": "input-group",
+      role: "group",
+      className: r(l({ size: t, widthVariant: e }), n),
+      "data-disabled": a,
+      ...i
+    }
+  );
+}
+const d = s(
+  "text-ppx-muted-foreground flex h-auto cursor-text items-center justify-center gap-2 py-1.5 text-sm font-medium select-none [&>svg:not([class*='size-'])]:size-4 group-data-[disabled=true]/input-group:opacity-50",
+  {
+    variants: {
+      align: {
+        "inline-start": "order-first pl-input",
+        "inline-end": "order-last pr-input"
+      }
+    },
+    defaultVariants: {
+      align: "inline-start"
+    }
+  }
+);
+function v({
+  className: n,
+  align: t = "inline-start",
+  ...a
+}) {
+  return /* @__PURE__ */ o.jsx(
+    "div",
+    {
+      role: "group",
+      "data-slot": "input-group-addon",
+      "data-align": t,
+      className: r(d({ align: t }), n),
+      onClick: (e) => {
+        var i, u;
+        e.target.closest("button") || (u = (i = e.currentTarget.parentElement) == null ? void 0 : i.querySelector("input")) == null || u.focus();
+      },
+      ...a
+    }
+  );
+}
+const c = s(
+  "text-ppx-sm shadow-none flex gap-2 items-center",
+  {
+    variants: {
+      size: {
+        xs: "h-6 gap-1 px-2 rounded-input [&>svg:not([class*='size-'])]:size-3.5 has-[>svg]:px-2",
+        sm: "h-8 px-2.5 gap-1.5 rounded-input has-[>svg]:px-2.5",
+        "icon-xs": "size-6 rounded-input p-0 has-[>svg]:p-0",
+        "icon-sm": "size-8 p-0 has-[>svg]:p-0"
+      }
+    },
+    defaultVariants: {
+      size: "xs"
+    }
+  }
+);
+function b({
+  className: n,
+  type: t = "button",
+  variant: a = "ghost",
+  size: e = "xs",
+  ...i
+}) {
+  return /* @__PURE__ */ o.jsx(
+    p,
+    {
+      type: t,
+      "data-size": e,
+      variant: a,
+      className: r(c({ size: e }), n),
+      ...i
+    }
+  );
+}
+function w({ className: n, ...t }) {
+  return /* @__PURE__ */ o.jsx(
+    "span",
+    {
+      className: r(
+        "gap-2 text-sm [&_svg:not([class*='size-'])]:size-4 flex items-center text-ppx-muted-foreground [&_svg]:pointer-events-none",
+        n
+      ),
+      ...t
+    }
+  );
+}
+function z({
+  className: n,
+  invalid: t,
+  ...a
+}) {
+  return /* @__PURE__ */ o.jsx(
+    "input",
+    {
+      "data-slot": "input-group-control",
+      "aria-invalid": t,
+      className: r(
+        "font-medium min-w-0 flex-1 rounded-none border-0 bg-transparent p-input text-ppx-sm text-ppx-foreground placeholder:font-sans-light placeholder:text-ppx-sm placeholder:text-ppx-neutral-12 focus:outline-none disabled:placeholder:text-ppx-neutral-11",
+        a.type === "number" && "no-arrow-spin",
+        n
+      ),
+      ...a
+    }
+  );
+}
+export {
+  v as Addon,
+  b as Button,
+  z as Input,
+  h as Root,
+  w as Text
+};