@photoroom/ui 0.1.1

package/index383.mjs

@@ -0,0 +1,31 @@
+import { jsxs as r, jsx as o } from "react/jsx-runtime";
+import { clsx as c } from "./index296.mjs";
+import { forwardRef as a } from "react";
+const d = a(
+  ({ icon: e, children: s, className: t, ...n }, i) => /* @__PURE__ */ r(
+    "button",
+    {
+      ...n,
+      ref: i,
+      className: c(
+        "flex items-center gap-2 px-3 py-2",
+        "rounded-300",
+        "hover:bg-background-accent-subdued-hover focus-visible:bg-background-accent-subdued-hover active:bg-background-accent-subdued-down",
+        "focus-visible:outline-none focus-visible:ring-misc-focus-indicator focus-visible:misc-border-size-focus-ring",
+        "transition-colors interaction-transition-type-1",
+        "component-semi-strong-500 text-content-accent",
+        "cursor-pointer disabled:pointer-events-none disabled:opacity-30",
+        t
+      ),
+      children: [
+        !!e && /* @__PURE__ */ o("span", { className: "size-5 shrink-0", children: e }),
+        /* @__PURE__ */ o("span", { className: "grow text-left", children: s })
+      ]
+    }
+  )
+);
+d.displayName = "FolderListButton";
+export {
+  d as FolderListButton
+};
+//# sourceMappingURL=index383.mjs.map

package/index384.mjs

@@ -0,0 +1,32 @@
+import { jsxs as i, jsx as e } from "react/jsx-runtime";
+import { FolderIcon as n } from "@photoroom/icons/lib/monochromes";
+import { Item as s, Indicator as c } from "./index315.mjs";
+import { clsx as a } from "./index296.mjs";
+import { SelectionBadge as d } from "./index181.mjs";
+const g = ({ children: r, className: t, ...o }) => /* @__PURE__ */ i(
+  s,
+  {
+    ...o,
+    className: a(
+      "flex items-center gap-2 px-3 py-2",
+      "rounded-300",
+      "hover:bg-background-subdued-hover focus-visible:bg-background-subdued-hover active:bg-background-subdued-down",
+      "focus-visible:outline-none focus-visible:ring-misc-focus-indicator focus-visible:misc-border-size-focus-ring",
+      "transition-colors interaction-transition-type-1",
+      {
+        "pointer-events-none opacity-30": o.disabled,
+        "cursor-pointer": !o.disabled
+      },
+      t
+    ),
+    children: [
+      /* @__PURE__ */ e(n, { "aria-hidden": "true", className: "size-5 shrink-0 text-content-tertiary" }),
+      /* @__PURE__ */ e("span", { className: "component-semi-strong-500 grow text-left text-content-primary", children: r }),
+      /* @__PURE__ */ e(c, { asChild: !0, forceMount: !0, children: /* @__PURE__ */ e(d, { variant: "round" }) })
+    ]
+  }
+);
+export {
+  g as FolderListItem
+};
+//# sourceMappingURL=index384.mjs.map

package/index385.mjs

@@ -0,0 +1,8 @@
+import { jsx as e } from "react/jsx-runtime";
+import { CheckIcon as t } from "@photoroom/icons/lib/monochromes";
+import { clsx as s } from "./index296.mjs";
+const n = ({ className: r }) => /* @__PURE__ */ e("div", { className: s("flex items-center justify-center rounded-full size-300", r), children: /* @__PURE__ */ e(t, { className: "icon-size-400" }) });
+export {
+  n as StatusBadgeInternal
+};
+//# sourceMappingURL=index385.mjs.map

package/index386.mjs

@@ -0,0 +1,240 @@
+import s from "react";
+import { createContextScope as X } from "./index423.mjs";
+import { createCollection as Z } from "./index596.mjs";
+import { useComposedRefs as $ } from "./index422.mjs";
+import { composeEventHandlers as ee } from "./index421.mjs";
+import { useControllableState as M } from "./index433.mjs";
+import { Primitive as V } from "./index431.mjs";
+import { createCollapsibleScope as H, Root as oe, Content as re, Trigger as te } from "./index598.mjs";
+import { useId as ne } from "./index427.mjs";
+import { useDirection as ce } from "./index440.mjs";
+import { jsx as n } from "react/jsx-runtime";
+var d = "Accordion", ie = ["Home", "End", "ArrowDown", "ArrowUp", "ArrowLeft", "ArrowRight"], [E, ae, le] = Z(d), [b] = X(d, [
+  le,
+  H
+]), S = H(), K = s.forwardRef(
+  (o, c) => {
+    const { type: e, ...t } = o, i = t, r = t;
+    return /* @__PURE__ */ n(E.Provider, { scope: o.__scopeAccordion, children: e === "multiple" ? /* @__PURE__ */ n(fe, { ...r, ref: c }) : /* @__PURE__ */ n(pe, { ...i, ref: c }) });
+  }
+);
+K.displayName = d;
+var [L, se] = b(d), [z, de] = b(
+  d,
+  { collapsible: !1 }
+), pe = s.forwardRef(
+  (o, c) => {
+    const {
+      value: e,
+      defaultValue: t,
+      onValueChange: i = () => {
+      },
+      collapsible: r = !1,
+      ...l
+    } = o, [a, p] = M({
+      prop: e,
+      defaultProp: t ?? "",
+      onChange: i,
+      caller: d
+    });
+    return /* @__PURE__ */ n(
+      L,
+      {
+        scope: o.__scopeAccordion,
+        value: s.useMemo(() => a ? [a] : [], [a]),
+        onItemOpen: p,
+        onItemClose: s.useCallback(() => r && p(""), [r, p]),
+        children: /* @__PURE__ */ n(z, { scope: o.__scopeAccordion, collapsible: r, children: /* @__PURE__ */ n(G, { ...l, ref: c }) })
+      }
+    );
+  }
+), fe = s.forwardRef((o, c) => {
+  const {
+    value: e,
+    defaultValue: t,
+    onValueChange: i = () => {
+    },
+    ...r
+  } = o, [l, a] = M({
+    prop: e,
+    defaultProp: t ?? [],
+    onChange: i,
+    caller: d
+  }), p = s.useCallback(
+    (v) => a((u = []) => [...u, v]),
+    [a]
+  ), m = s.useCallback(
+    (v) => a((u = []) => u.filter((h) => h !== v)),
+    [a]
+  );
+  return /* @__PURE__ */ n(
+    L,
+    {
+      scope: o.__scopeAccordion,
+      value: l,
+      onItemOpen: p,
+      onItemClose: m,
+      children: /* @__PURE__ */ n(z, { scope: o.__scopeAccordion, collapsible: !0, children: /* @__PURE__ */ n(G, { ...r, ref: c }) })
+    }
+  );
+}), [ue, I] = b(d), G = s.forwardRef(
+  (o, c) => {
+    const { __scopeAccordion: e, disabled: t, dir: i, orientation: r = "vertical", ...l } = o, a = s.useRef(null), p = $(a, c), m = ae(e), u = ce(i) === "ltr", h = ee(o.onKeyDown, (C) => {
+      var O;
+      if (!ie.includes(C.key)) return;
+      const Q = C.target, x = m().filter((N) => {
+        var T;
+        return !((T = N.ref.current) != null && T.disabled);
+      }), A = x.findIndex((N) => N.ref.current === Q), D = x.length;
+      if (A === -1) return;
+      C.preventDefault();
+      let f = A;
+      const _ = 0, w = D - 1, R = () => {
+        f = A + 1, f > w && (f = _);
+      }, P = () => {
+        f = A - 1, f < _ && (f = w);
+      };
+      switch (C.key) {
+        case "Home":
+          f = _;
+          break;
+        case "End":
+          f = w;
+          break;
+        case "ArrowRight":
+          r === "horizontal" && (u ? R() : P());
+          break;
+        case "ArrowDown":
+          r === "vertical" && R();
+          break;
+        case "ArrowLeft":
+          r === "horizontal" && (u ? P() : R());
+          break;
+        case "ArrowUp":
+          r === "vertical" && P();
+          break;
+      }
+      const W = f % D;
+      (O = x[W].ref.current) == null || O.focus();
+    });
+    return /* @__PURE__ */ n(
+      ue,
+      {
+        scope: e,
+        disabled: t,
+        direction: i,
+        orientation: r,
+        children: /* @__PURE__ */ n(E.Slot, { scope: e, children: /* @__PURE__ */ n(
+          V.div,
+          {
+            ...l,
+            "data-orientation": r,
+            ref: p,
+            onKeyDown: t ? void 0 : h
+          }
+        ) })
+      }
+    );
+  }
+), g = "AccordionItem", [me, k] = b(g), U = s.forwardRef(
+  (o, c) => {
+    const { __scopeAccordion: e, value: t, ...i } = o, r = I(g, e), l = se(g, e), a = S(e), p = ne(), m = t && l.value.includes(t) || !1, v = r.disabled || o.disabled;
+    return /* @__PURE__ */ n(
+      me,
+      {
+        scope: e,
+        open: m,
+        disabled: v,
+        triggerId: p,
+        children: /* @__PURE__ */ n(
+          oe,
+          {
+            "data-orientation": r.orientation,
+            "data-state": J(m),
+            ...a,
+            ...i,
+            ref: c,
+            disabled: v,
+            open: m,
+            onOpenChange: (u) => {
+              u ? l.onItemOpen(t) : l.onItemClose(t);
+            }
+          }
+        )
+      }
+    );
+  }
+);
+U.displayName = g;
+var j = "AccordionHeader", Y = s.forwardRef(
+  (o, c) => {
+    const { __scopeAccordion: e, ...t } = o, i = I(d, e), r = k(j, e);
+    return /* @__PURE__ */ n(
+      V.h3,
+      {
+        "data-orientation": i.orientation,
+        "data-state": J(r.open),
+        "data-disabled": r.disabled ? "" : void 0,
+        ...t,
+        ref: c
+      }
+    );
+  }
+);
+Y.displayName = j;
+var y = "AccordionTrigger", q = s.forwardRef(
+  (o, c) => {
+    const { __scopeAccordion: e, ...t } = o, i = I(d, e), r = k(y, e), l = de(y, e), a = S(e);
+    return /* @__PURE__ */ n(E.ItemSlot, { scope: e, children: /* @__PURE__ */ n(
+      te,
+      {
+        "aria-disabled": r.open && !l.collapsible || void 0,
+        "data-orientation": i.orientation,
+        id: r.triggerId,
+        ...a,
+        ...t,
+        ref: c
+      }
+    ) });
+  }
+);
+q.displayName = y;
+var B = "AccordionContent", F = s.forwardRef(
+  (o, c) => {
+    const { __scopeAccordion: e, ...t } = o, i = I(d, e), r = k(B, e), l = S(e);
+    return /* @__PURE__ */ n(
+      re,
+      {
+        role: "region",
+        "aria-labelledby": r.triggerId,
+        "data-orientation": i.orientation,
+        ...l,
+        ...t,
+        ref: c,
+        style: {
+          "--radix-accordion-content-height": "var(--radix-collapsible-content-height)",
+          "--radix-accordion-content-width": "var(--radix-collapsible-content-width)",
+          ...o.style
+        }
+      }
+    );
+  }
+);
+F.displayName = B;
+function J(o) {
+  return o ? "open" : "closed";
+}
+var Pe = K, Ne = U, ye = Y, Ee = q, Se = F;
+export {
+  K as Accordion,
+  F as AccordionContent,
+  Y as AccordionHeader,
+  U as AccordionItem,
+  q as AccordionTrigger,
+  Se as Content,
+  ye as Header,
+  Ne as Item,
+  Pe as Root,
+  Ee as Trigger
+};
+//# sourceMappingURL=index386.mjs.map

package/index387.mjs

@@ -0,0 +1,27 @@
+import { jsx as e, jsxs as n } from "react/jsx-runtime";
+import { Header as s, Trigger as i } from "./index386.mjs";
+import { VariantsListItemTrailing as m } from "./index389.mjs";
+import { VariantsValueItem as u } from "./index390.mjs";
+const f = ({
+  label: r,
+  subtitle: o,
+  onClick: a,
+  onClickLeading: t,
+  ...d
+}) => /* @__PURE__ */ e(s, { onClick: a, children: /* @__PURE__ */ n(i, { className: "group flex w-full items-center overflow-hidden rounded-450 border-misc-border hover:bg-background-subdued-hover active:bg-background-subdued-down data-[state=open]:rounded-b-none data-[state=open]:border-b", children: [
+  /* @__PURE__ */ e(
+    u,
+    {
+      label: r,
+      subtitle: o,
+      onClickLeading: t,
+      className: "flex-1",
+      ...d
+    }
+  ),
+  /* @__PURE__ */ e(m, {})
+] }) });
+export {
+  f as VariantsHeaderItem
+};
+//# sourceMappingURL=index387.mjs.map

package/index388.mjs

@@ -0,0 +1,46 @@
+import { jsx as e, jsxs as i } from "react/jsx-runtime";
+import { DeleteIcon as d, PictureAddIcon as a } from "@photoroom/icons/lib/monochromes";
+import { clsx as c } from "./index296.mjs";
+import { forwardRef as s } from "react";
+const b = s(
+  ({ src: r, alt: n, ...o }, t) => r ? /* @__PURE__ */ e("div", { className: "p-2 pr-3", children: /* @__PURE__ */ i(
+    "button",
+    {
+      ref: t,
+      type: "button",
+      className: "group relative block h-10 w-10 flex-shrink-0 cursor-pointer transition-all",
+      ...o,
+      children: [
+        /* @__PURE__ */ e(
+          "img",
+          {
+            src: r,
+            alt: n,
+            className: c(
+              "block h-10 w-10 rounded-200 border-misc-border object-cover misc-border-size-default",
+              "border-misc-border hover:border-content-accent-hover active:border-content-accent-down"
+            )
+          }
+        ),
+        /* @__PURE__ */ e("div", { className: "absolute inset-0 flex items-center justify-center rounded-200 bg-background-subdued-hover opacity-0 transition-opacity active:bg-background-subdued-down group-hover:opacity-100", children: /* @__PURE__ */ e(d, { className: "text-surface-default icon-size-500" }) })
+      ]
+    }
+  ) }) : /* @__PURE__ */ e("div", { className: "p-2 pr-3", children: /* @__PURE__ */ e(
+    "button",
+    {
+      ref: t,
+      type: "button",
+      className: c(
+        "flex h-10 w-10 cursor-pointer items-center justify-center rounded-200 border border-dashed border-misc-border bg-background-subdued",
+        "border-misc-border hover:border-content-accent-hover active:border-content-accent-down"
+      ),
+      ...o,
+      children: /* @__PURE__ */ e(a, { className: "text-content-primary icon-size-500" })
+    }
+  ) })
+);
+b.displayName = "VariantsListItemLeading";
+export {
+  b as VariantsListItemLeading
+};
+//# sourceMappingURL=index388.mjs.map

package/index389.mjs

@@ -0,0 +1,8 @@
+import { jsx as t } from "react/jsx-runtime";
+import { ChevronDownShortIcon as o } from "@photoroom/icons/lib/monochromes";
+import { cn as n } from "./index7.mjs";
+const s = ({ className: r }) => /* @__PURE__ */ t("div", { className: n("px-2", r), children: /* @__PURE__ */ t(o, { className: "text-content-tertiary transition-transform duration-200 icon-size-500 group-data-[state=open]:rotate-180" }) });
+export {
+  s as VariantsListItemTrailing
+};
+//# sourceMappingURL=index389.mjs.map

package/index39.mjs

@@ -0,0 +1,74 @@
+import { jsxs as g, jsx as r } from "react/jsx-runtime";
+import { Root as O, Trigger as b, Portal as x, Content as P } from "./index326.mjs";
+import { Fragment as S } from "react";
+import { MenuContent as F } from "./index309.mjs";
+import { SubMenu as G } from "./index327.mjs";
+import { AnimatePresence as I } from "./index306.mjs";
+import { MenuItem as R } from "./index328.mjs";
+import { MenuCustomItem as j } from "./index329.mjs";
+import { MenuRadioGroup as k } from "./index330.mjs";
+import { MenuCheckboxGroup as A } from "./index331.mjs";
+import { MenuSeparator as D } from "./index332.mjs";
+import { useControlledState as T } from "./index290.mjs";
+const o = ({
+  side: n = "bottom",
+  align: m = "start",
+  avoidCollisions: p,
+  withPortal: t = !0,
+  sideOffset: u = 8,
+  collisionPadding: a = 8,
+  triggerElement: i,
+  children: s,
+  className: f,
+  modal: c = !1,
+  open: l,
+  defaultOpen: C,
+  onOpenChange: d
+}) => {
+  const [e, M] = T({
+    value: l,
+    defaultValue: C,
+    onValueChange: d
+  });
+  return /* @__PURE__ */ g(O, { open: e, onOpenChange: M, modal: c, children: [
+    /* @__PURE__ */ r(
+      b,
+      {
+        asChild: !0,
+        onFocusCapture: (h) => {
+          h.stopPropagation();
+        },
+        children: i
+      }
+    ),
+    /* @__PURE__ */ r(I, { children: e && /* @__PURE__ */ r(
+      t ? x : S,
+      {
+        ...t ? { forceMount: !0 } : {},
+        children: /* @__PURE__ */ r(
+          P,
+          {
+            forceMount: !0,
+            className: f,
+            side: n,
+            align: m,
+            avoidCollisions: p,
+            sideOffset: u,
+            collisionPadding: a,
+            children: /* @__PURE__ */ r(F, { children: s })
+          }
+        )
+      }
+    ) })
+  ] });
+};
+o.Item = R;
+o.Sub = G;
+o.CustomItem = j;
+o.RadioGroup = k;
+o.CheckboxGroup = A;
+o.Separator = D;
+export {
+  o as DropdownMenu
+};
+//# sourceMappingURL=index39.mjs.map

package/index390.mjs

@@ -0,0 +1,18 @@
+import { jsxs as o, jsx as t } from "react/jsx-runtime";
+import { cn as s } from "./index7.mjs";
+import { VariantsListItemContent as a } from "./index599.mjs";
+import { VariantsListItemLeading as c } from "./index388.mjs";
+const V = ({
+  label: r,
+  subtitle: e,
+  onClickLeading: i,
+  className: m,
+  ...n
+}) => /* @__PURE__ */ o("div", { className: s("flex items-center", m), children: [
+  /* @__PURE__ */ t(c, { onClick: i, ...n }),
+  /* @__PURE__ */ t(a, { label: r, subtitle: e })
+] });
+export {
+  V as VariantsValueItem
+};
+//# sourceMappingURL=index390.mjs.map

package/index391.mjs

@@ -0,0 +1,50 @@
+import { jsx as m } from "react/jsx-runtime";
+import { clsx as u } from "./index296.mjs";
+import f from "react-dom";
+import { useWindowDragEvents as d } from "./index295.mjs";
+import { AnimatePresence as l } from "./index306.mjs";
+import { motion as y } from "./index307.mjs";
+const j = ({
+  fullscreen: t = !0,
+  children: p,
+  showOverlay: e,
+  className: c,
+  onDragEnter: s,
+  onDragLeave: o,
+  onDragOver: i,
+  onDrop: n
+}) => {
+  d({
+    enabled: t,
+    onDragEnter: s
+  }), d({
+    enabled: t && e,
+    onDragOver: i,
+    onDrop: n,
+    onDragLeave: o
+  });
+  const r = /* @__PURE__ */ m(l, { children: e && /* @__PURE__ */ m(
+    y.div,
+    {
+      transition: { ease: "easeOut", duration: 0.2 },
+      initial: { opacity: 0 },
+      animate: { opacity: 1 },
+      exit: { opacity: 0 },
+      onDragLeave: o,
+      onDragOver: i,
+      onDrop: n,
+      className: u(
+        t ? "fixed" : "absolute",
+        "inset-0 [&>*]:pointer-events-none",
+        //  pointer-events-none is used so hovering the text won't trigger dragLeave
+        c
+      ),
+      children: p
+    }
+  ) }), a = typeof document < "u" ? document.querySelector("body") : null;
+  return t && a ? f.createPortal(r, a) : r;
+};
+export {
+  j as DropZoneOverlayWrapper
+};
+//# sourceMappingURL=index391.mjs.map

package/index392.mjs

@@ -0,0 +1,26 @@
+import { jsx as m } from "react/jsx-runtime";
+import { DropZoneOverlayWrapper as a } from "./index391.mjs";
+const s = ({
+  className: r,
+  showOverlay: e,
+  overlay: o,
+  onDrop: p,
+  onDragEnter: n,
+  onDragLeave: t,
+  onDragOver: l
+}) => /* @__PURE__ */ m(
+  a,
+  {
+    className: r,
+    showOverlay: e,
+    onDragEnter: n,
+    onDragOver: l,
+    onDragLeave: t,
+    onDrop: p,
+    children: o
+  }
+);
+export {
+  s as DropZoneFullscreenWrapper
+};
+//# sourceMappingURL=index392.mjs.map

package/index393.mjs

@@ -0,0 +1,37 @@
+import { ACCEPTED_FILE_TYPES as f } from "./index321.mjs";
+import "./index322.mjs";
+const u = (r) => r.isFile === !0, E = (r) => (
+  // oxlint-disable-next-line typescript/no-unnecessary-boolean-literal-compare
+  r.isDirectory === !0
+), d = async (r) => new Promise((c, s) => {
+  const i = [], a = r.createReader(), o = () => {
+    a.readEntries(async (n) => {
+      if (n.length === 0) {
+        c(i);
+        return;
+      }
+      try {
+        for (const e of n)
+          if (u(e)) {
+            const t = await new Promise((y, l) => {
+              e.file(y, l);
+            });
+            f.includes(t.type) && i.push(t);
+          } else if (E(e)) {
+            const t = await d(e);
+            i.push(...t);
+          }
+        o();
+      } catch (e) {
+        s(e);
+      }
+    }, s);
+  };
+  o();
+});
+export {
+  E as isFileSystemDirectoryEntry,
+  u as isFileSystemFileEntry,
+  d as readDirectoryFiles
+};
+//# sourceMappingURL=index393.mjs.map

package/index394.mjs

@@ -0,0 +1,64 @@
+import { jsx as n, jsxs as m, Fragment as g } from "react/jsx-runtime";
+import { CheckSmallIcon as f } from "@photoroom/icons/lib/monochromes";
+import { cn as u } from "./index7.mjs";
+import { sellScoreColorVariants as k, getScoreLevel as p } from "./index608.mjs";
+const y = (t) => {
+  const o = t / 2, r = t / 5, a = (t - r) / 2, c = 2 * Math.PI * a;
+  return { origin: o, strokeWidth: r, radius: a, circumference: c };
+}, S = ({ score: t, max: o = 1, size: r, className: a }) => {
+  const c = Math.min(Math.max(t / o, 0), 1), { origin: e, strokeWidth: s, radius: i, circumference: l } = y(r), h = l * c, d = p(t, o);
+  return c >= 1 ? /* @__PURE__ */ n(
+    f,
+    {
+      className: "rounded-full bg-background-positive text-content-white-primary",
+      style: { width: r, height: r }
+    }
+  ) : /* @__PURE__ */ m(g, { children: [
+    /* @__PURE__ */ n("meter", { value: t, max: o, className: "sr-only" }),
+    /* @__PURE__ */ n(
+      "svg",
+      {
+        "aria-hidden": "true",
+        viewBox: `0 0 ${r} ${r}`,
+        className: u("shrink-0", a),
+        style: { width: r, height: r },
+        children: /* @__PURE__ */ m("g", { transform: `rotate(-90 ${e} ${e})`, children: [
+          /* @__PURE__ */ n(
+            "circle",
+            {
+              cx: e,
+              cy: e,
+              r: i,
+              fill: "none",
+              stroke: "currentColor",
+              strokeWidth: s,
+              strokeLinecap: "round",
+              className: "text-neutral-alpha-2"
+            }
+          ),
+          t > 0 && /* @__PURE__ */ n(
+            "circle",
+            {
+              cx: e,
+              cy: e,
+              r: i,
+              fill: "none",
+              strokeWidth: s,
+              stroke: "currentColor",
+              strokeLinecap: "round",
+              strokeDasharray: `${h}, ${l - h}`,
+              className: u(
+                k({ level: d }),
+                "transition-[stroke-dasharray] duration-150 ease-out"
+              )
+            }
+          )
+        ] })
+      }
+    )
+  ] });
+};
+export {
+  S as SellScoreGauge
+};
+//# sourceMappingURL=index394.mjs.map