@photoroom/ui 0.1.1 → 0.1.2

package/index277.mjs

@@ -1,97 +0,0 @@
-import { jsx as t, jsxs as a, Fragment as g } from "react/jsx-runtime";
-import { clsx as l } from "./index296.mjs";
-const N = ({
-  title: r,
-  variant: i = "default",
-  content: h,
-  cta: m,
-  bgImageDesktop: x,
-  bgImageMobile: o,
-  className: p,
-  ...u
-}) => {
-  const n = i !== "default", d = i.includes("wide"), c = i.includes("full"), e = d || c, s = i.includes("dark"), f = n && !c;
-  return /* @__PURE__ */ t(
-    "div",
-    {
-      ...u,
-      className: l(
-        {
-          "py-e500": !e,
-          "px-6 md:px-16": !n,
-          "sm:px-6 md:px-8": n && !e,
-          "2xl:px-10": d
-        },
-        p
-      ),
-      children: /* @__PURE__ */ a(
-        "div",
-        {
-          role: "none",
-          className: l(
-            "relative mx-auto overflow-hidden",
-            "flex flex-col items-center justify-center",
-            {
-              "max-w-[1200px] sm:rounded-area-500": !e,
-              "max-w-[1800px] 2xl:rounded-area-500": d,
-              "px-4 py-10 sm:px-10": n,
-              "min-h-[400px]": n && !e,
-              "min-h-[440px] sm:min-h-[480px] lg:min-h-[640px]": e,
-              "[background:linear-gradient(180deg,#010518_0%,#041031_15.16%,#12346B_40.38%,#265B9E_57.21%,#81B7E6_83.17%,#E7F7FF_100%)]": c
-            }
-          ),
-          children: [
-            f && /* @__PURE__ */ a(g, { children: [
-              !!o && /* @__PURE__ */ t("div", { className: "absolute inset-0 block md:hidden", children: o }),
-              !!x && /* @__PURE__ */ t("div", { className: "absolute inset-0 hidden md:block", children: x })
-            ] }),
-            /* @__PURE__ */ a(
-              "div",
-              {
-                className: l(
-                  "relative z-10 mx-auto w-full @container",
-                  "flex flex-col items-center",
-                  "text-center",
-                  {
-                    "max-w-[800px]": e,
-                    "max-w-[640px]": !e
-                  }
-                ),
-                children: [
-                  !!r && /* @__PURE__ */ t(
-                    "h3",
-                    {
-                      className: l(
-                        "heading-light-800 mb-4 text-balance sm:heading-light-900 lg:heading-light-1000",
-                        {
-                          "text-content-white-primary": s,
-                          "text-content-primary": !s
-                        }
-                      ),
-                      children: r
-                    }
-                  ),
-                  /* @__PURE__ */ t(
-                    "div",
-                    {
-                      className: l("@[512px]:max-w-[80%]", "body-600 text-pretty sm:body-700", {
-                        "text-content-white-secondary": s,
-                        "text-content-secondary": !s
-                      }),
-                      children: h
-                    }
-                  ),
-                  !!m && /* @__PURE__ */ t("div", { className: "mt-8 flex flex-wrap items-center justify-center gap-3 sm:mt-10 lg:mt-12", children: m })
-                ]
-              }
-            )
-          ]
-        }
-      )
-    }
-  );
-};
-export {
-  N as TakeActionBlockV2
-};
-//# sourceMappingURL=index277.mjs.map

package/index278.mjs

@@ -1,100 +0,0 @@
-import { jsxs as n, jsx as c } from "react/jsx-runtime";
-import { ArrowLeftIcon as m, ArrowRightIcon as f } from "@photoroom/icons/lib/monochromes";
-import { clsx as r } from "./index296.mjs";
-import { useState as x, useEffect as h } from "react";
-import { Button as d } from "./index10.mjs";
-const y = ({ titleBlock: i, testimonials: l }) => {
-  const [s, a] = x(0), p = () => {
-    a((e) => e === 0 ? (l || []).length - 1 : e - 1);
-  }, t = () => {
-    a((e) => e === (l || []).length - 1 ? 0 : e + 1);
-  };
-  return h(() => {
-    l && s > l.length - 1 && a(0);
-  }, [s, l]), /* @__PURE__ */ n("div", { className: r("px-4 sm:px-6 md:px-8 xl:px-10", "py-e500", "flex flex-col gap-i500"), children: [
-    i,
-    /* @__PURE__ */ n("div", { className: "flex flex-col items-center justify-center gap-8", children: [
-      /* @__PURE__ */ c("div", { className: "grid w-full max-w-[728px]", children: l == null ? void 0 : l.map((e, o) => /* @__PURE__ */ n(
-        "div",
-        {
-          className: r(
-            "col-[1] row-[1]",
-            "rounded-area-500 bg-surface-alternate",
-            "flex flex-col justify-between",
-            s === o ? "visible" : "pointer-events-none invisible"
-          ),
-          children: [
-            /* @__PURE__ */ c("div", { className: r("body-600 sm:body-800", "px-5 pt-5", "pb-2 sm:px-12 sm:pt-10"), children: e.content }),
-            /* @__PURE__ */ n("div", { className: r("flex gap-4 sm:gap-6", "px-4 pb-8 pt-6", "sm:px-12 sm:pb-10"), children: [
-              !!e.avatar && /* @__PURE__ */ n("div", { className: r("relative w-[84px] sm:w-[168px]"), children: [
-                /* @__PURE__ */ c(
-                  "div",
-                  {
-                    className: r(
-                      "relative",
-                      "h-16 w-16",
-                      "sm:h-32 sm:w-32",
-                      "overflow-hidden rounded-full"
-                    ),
-                    children: e.avatar
-                  }
-                ),
-                !!e.logo && /* @__PURE__ */ c(
-                  "div",
-                  {
-                    className: r(
-                      "absolute bottom-0 right-0",
-                      "h-8 w-8",
-                      "sm:h-16 sm:w-16",
-                      "overflow-hidden rounded-200"
-                    ),
-                    children: e.logo
-                  }
-                )
-              ] }),
-              /* @__PURE__ */ n("div", { className: "flex flex-col self-center", children: [
-                /* @__PURE__ */ c("span", { className: "body-semi-strong-500 sm:body-semi-strong-700", children: e.name }),
-                /* @__PURE__ */ c("span", { className: "body-400 text-content-secondary sm:body-500", children: e.occupation })
-              ] })
-            ] })
-          ]
-        },
-        o
-      )) }),
-      l && l.length > 1 && /* @__PURE__ */ n("div", { className: "flex gap-4", children: [
-        /* @__PURE__ */ c(d, { variant: "secondary", density: "regular", onClick: p, icon: m }),
-        /* @__PURE__ */ c("div", { className: "flex items-center", children: l.map((e, o) => /* @__PURE__ */ c(
-          "button",
-          {
-            className: "group h-full px-1 outline-none",
-            onClick: () => a(o),
-            children: /* @__PURE__ */ c("span", { className: "block rounded-full transition-all group-focus-visible:ring group-focus-visible:ring-misc-focus-indicator", children: /* @__PURE__ */ c(
-              "span",
-              {
-                className: r(
-                  "block",
-                  "h-1.5 w-1.5 rounded-full bg-content-secondary transition-all",
-                  o !== s && "opacity-30"
-                )
-              }
-            ) })
-          },
-          o
-        )) }),
-        /* @__PURE__ */ c(
-          d,
-          {
-            variant: "secondary",
-            density: "regular",
-            onClick: t,
-            icon: f
-          }
-        )
-      ] })
-    ] })
-  ] });
-};
-export {
-  y as TestimonialsBlock
-};
-//# sourceMappingURL=index278.mjs.map

package/index279.mjs

@@ -1,15 +0,0 @@
-import { jsxs as o, jsx as s } from "react/jsx-runtime";
-import { clsx as m } from "./index296.mjs";
-const i = ({
-  titleBlock: e,
-  cards: x,
-  className: l,
-  ...c
-}) => /* @__PURE__ */ o("section", { ...c, className: m("px-4 py-e500 sm:px-8", l), children: [
-  !!e && /* @__PURE__ */ s("div", { className: "pb-i500", children: e }),
-  /* @__PURE__ */ s("div", { className: "mx-auto flex max-w-[1200px] flex-col gap-6 lg:flex-row lg:justify-center", children: x })
-] });
-export {
-  i as TextContentBlock
-};
-//# sourceMappingURL=index279.mjs.map

package/index28.mjs

@@ -1,50 +0,0 @@
-import { jsxs as o, jsx as e } from "react/jsx-runtime";
-import { cn as t } from "./index7.mjs";
-import { ProBadge as u } from "./index167.mjs";
-const g = ({
-  title: l,
-  imageSrc: r,
-  imageAlt: s,
-  onClick: i,
-  className: a,
-  variant: n = "default",
-  isPro: c = !1,
-  ...d
-}) => /* @__PURE__ */ o(
-  "button",
-  {
-    className: t(
-      "flex h-full w-full flex-col",
-      "cursor-pointer overflow-hidden rounded-400 outline-none",
-      "transition-all duration-150 ease-out",
-      "focus-visible:ring-[3px] focus-visible:ring-misc-focus-indicator",
-      {
-        "bg-background-subdued hover:bg-background-subdued-hover focus-visible:bg-background-subdued-hover active:bg-background-subdued-down": n === "default"
-      },
-      a
-    ),
-    onClick: i,
-    ...d,
-    children: [
-      /* @__PURE__ */ o("div", { className: "relative flex h-full w-full flex-1 overflow-hidden", children: [
-        /* @__PURE__ */ e(
-          "img",
-          {
-            src: r,
-            alt: s || l,
-            className: "h-full w-full object-cover",
-            draggable: !1,
-            loading: "lazy",
-            decoding: "async"
-          }
-        ),
-        c && /* @__PURE__ */ e(u, { size: "small", className: "absolute right-2 top-2 z-10 shrink-0" })
-      ] }),
-      /* @__PURE__ */ e("div", { className: "z-10 flex h-[70px] flex-shrink-0 items-center px-4 pt-3", children: /* @__PURE__ */ e("span", { className: "component-semi-strong-500 text-left text-content-primary", children: l }) })
-    ]
-  }
-);
-export {
-  g as QuickActionCard
-};
-//# sourceMappingURL=index28.mjs.map

package/index280.mjs

@@ -1,21 +0,0 @@
-import { jsxs as n, jsx as o } from "react/jsx-runtime";
-import { clsx as r } from "./index296.mjs";
-import { scopedLinkStyle as m } from "./index411.mjs";
-const x = ({ content: s, footer: t, className: e, ...d }) => /* @__PURE__ */ n(
-  "div",
-  {
-    ...d,
-    className: r(
-      "mx-auto w-full max-w-[512px] rounded-area-500 bg-background-subdued px-6 py-5 text-content-secondary [&_strong]:body-semi-strong-700 sm:px-8 sm:py-6 [&_strong]:text-content-primary",
-      e
-    ),
-    children: [
-      /* @__PURE__ */ o("div", { className: "body-600 sm:body-700", children: s }),
-      !!t && /* @__PURE__ */ o("div", { className: r("body-500 mt-6", m), children: t })
-    ]
-  }
-);
-export {
-  x as TextContentCard
-};
-//# sourceMappingURL=index280.mjs.map

package/index281.mjs

@@ -1,42 +0,0 @@
-import { jsxs as e, jsx as r } from "react/jsx-runtime";
-import { clsx as t } from "./index296.mjs";
-import { forwardRef as d } from "react";
-const m = d(
-  ({ as: o = "a", icon: i, title: s, description: l, image: a, ...n }, c) => n.href ? /* @__PURE__ */ e(
-    o,
-    {
-      ref: c,
-      className: "group inline-flex w-full flex-col gap-3 outline-none",
-      ...n,
-      children: [
-        /* @__PURE__ */ e(
-          "div",
-          {
-            className: t(
-              "relative flex",
-              "aspect-[16/9] overflow-hidden rounded-500",
-              "group-focus-visible:ring-accent-alpha-5 group-focus-visible:misc-border-size-focus-ring",
-              "transition-all"
-            ),
-            children: [
-              a,
-              /* @__PURE__ */ r("div", { className: "pointer-events-none absolute inset-0 rounded-500 ring-1 ring-inset ring-misc-border" })
-            ]
-          }
-        ),
-        /* @__PURE__ */ e("div", { className: "flex flex-col gap-1", children: [
-          /* @__PURE__ */ e("div", { className: "flex items-center", children: [
-            i,
-            /* @__PURE__ */ r("span", { className: "component-semi-strong-600 text-to-leading-compact-600", children: s })
-          ] }),
-          l && /* @__PURE__ */ r("p", { className: "body-500 text-content-secondary", children: l })
-        ] })
-      ]
-    }
-  ) : null
-);
-m.displayName = "ToolCard";
-export {
-  m as ToolCard
-};
-//# sourceMappingURL=index281.mjs.map

package/index282.mjs

@@ -1,47 +0,0 @@
-import { jsxs as i, jsx as l } from "react/jsx-runtime";
-import { clsx as o } from "./index296.mjs";
-import { useMemo as d, cloneElement as m } from "react";
-const h = ({
-  title: s,
-  children: n,
-  cta: e,
-  image: t,
-  ...a
-}) => {
-  const r = d(() => e ? m(e, {
-    ...e.props,
-    variant: "secondary",
-    size: "medium",
-    density: "regular"
-  }) : null, [e]);
-  return /* @__PURE__ */ i(
-    "div",
-    {
-      ...a,
-      className: "relative flex flex-col lg:min-h-[300px] lg:overflow-hidden lg:rounded-500 lg:bg-background-subdued lg:p-10",
-      children: [
-        !!t && /* @__PURE__ */ l(
-          "div",
-          {
-            className: o(
-              "pointer-events-none",
-              "absolute inset-y-0 right-0",
-              "hidden max-w-[576px] lg:flex",
-              "[mask-image:linear-gradient(to_right,transparent,black_25%)]"
-            ),
-            children: t
-          }
-        ),
-        /* @__PURE__ */ i("div", { className: "relative z-[2] flex items-center justify-between gap-4 lg:max-w-[480px] lg:flex-col lg:items-start lg:gap-6", children: [
-          /* @__PURE__ */ l("h3", { className: "heading-light-700 text-content-primary sm:heading-light-800", children: s }),
-          !!n && /* @__PURE__ */ l("div", { className: "body-600 hidden text-content-secondary lg:block", children: n }),
-          !!r && /* @__PURE__ */ l("div", { className: "hidden sm:flex sm:pt-2", children: r })
-        ] })
-      ]
-    }
-  );
-};
-export {
-  h as ToolCategoryBannerBlock
-};
-//# sourceMappingURL=index282.mjs.map

package/index283.mjs

@@ -1,29 +0,0 @@
-import { jsxs as n, jsx as o } from "react/jsx-runtime";
-import { clsx as l } from "./index296.mjs";
-import { forwardRef as d } from "react";
-const c = d(({ as: s = "a", title: i, image: e, ...r }, a) => r.href ? /* @__PURE__ */ n(
-  s,
-  {
-    ref: a,
-    className: l(
-      "inline-flex items-center gap-2.5 rounded-500 bg-background-subdued p-3",
-      "hover:bg-background-subdued-hover",
-      "active:bg-background-subdued-down",
-      "focus-visible:bg-background-subdued-hover",
-      "outline-none transition-all focus-visible:ring-accent-alpha-5 focus-visible:misc-border-size-focus-ring"
-    ),
-    ...r,
-    children: [
-      !!e && /* @__PURE__ */ n("div", { className: "relative flex shrink-0", children: [
-        e,
-        /* @__PURE__ */ o("div", { className: "pointer-events-none absolute inset-0 rounded-200 ring-1 ring-inset ring-misc-border" })
-      ] }),
-      /* @__PURE__ */ o("span", { className: "component-semi-strong-600 truncate", children: i })
-    ]
-  }
-) : null);
-c.displayName = "ToolSmallCard";
-export {
-  c as ToolSmallCard
-};
-//# sourceMappingURL=index283.mjs.map

package/index284.mjs

@@ -1,44 +0,0 @@
-import { jsxs as e, jsx as r } from "react/jsx-runtime";
-import { clsx as n } from "./index296.mjs";
-import { Fragment as d } from "react";
-import { Tabs as m } from "./index160.mjs";
-const h = ({
-  titleBlock: c,
-  selectedIndex: l,
-  useCases: o,
-  ...p
-}) => /* @__PURE__ */ e(
-  "div",
-  {
-    className: n(
-      "bg-gradient-to-b from-white to-neutral-1",
-      "flex flex-col items-center",
-      "px-4 sm:px-6 md:px-8 xl:px-10",
-      "py-e500",
-      "gap-i400"
-    ),
-    ...p,
-    children: [
-      c,
-      o && /* @__PURE__ */ r(m, { overflow: "wrap", children: o.map(({ cta: t }, i) => /* @__PURE__ */ r(d, { children: t }, i)) }),
-      o && /* @__PURE__ */ r("div", { className: "grid w-full max-w-[880px]", children: o.map((t, i) => /* @__PURE__ */ e(
-        "div",
-        {
-          className: n(
-            "col-[1] row-[1] transition-opacity duration-500",
-            l === i ? "opacity-100" : "pointer-events-none opacity-0"
-          ),
-          children: [
-            /* @__PURE__ */ r("div", { children: t.content }),
-            t.description && /* @__PURE__ */ r("div", { className: "body-600 pt-8 text-center text-content-secondary", children: t.description })
-          ]
-        },
-        i
-      )) })
-    ]
-  }
-);
-export {
-  h as UseCasesBlock
-};
-//# sourceMappingURL=index284.mjs.map

package/index285.mjs

@@ -1,54 +0,0 @@
-import { jsxs as g, jsx as s } from "react/jsx-runtime";
-import { ArrowRightIcon as i } from "@photoroom/icons/lib/monochromes";
-import { clsx as r } from "./index296.mjs";
-const o = ({
-  before: l,
-  after: a,
-  ...e
-}) => /* @__PURE__ */ g(
-  "div",
-  {
-    className: r("relative flex h-full w-full", "gap-8 sm:gap-18 md:gap-20 lg:gap-28"),
-    ...e,
-    children: [
-      /* @__PURE__ */ s(
-        "div",
-        {
-          className: r(
-            "grid aspect-square flex-1",
-            "gap-2 sm:gap-4 md:gap-4 lg:gap-6",
-            l && l.length > 1 ? "grid-cols-2 grid-rows-2" : "grid-cols-1 grid-rows-1"
-            // Needed for Safari
-          ),
-          children: l
-        }
-      ),
-      /* @__PURE__ */ s(
-        "div",
-        {
-          className: r(
-            "grid aspect-square flex-1",
-            "gap-2 sm:gap-4 md:gap-4 lg:gap-6",
-            a && a.length > 1 ? "grid-cols-2 grid-rows-2" : "grid-cols-1 grid-rows-1"
-            // Needed for Safari
-          ),
-          children: a
-        }
-      ),
-      /* @__PURE__ */ s(
-        "div",
-        {
-          className: r(
-            "flex h-12 w-12 items-center justify-center rounded-full bg-black",
-            "absolute right-1/2 top-1/2 -translate-y-1/2 translate-x-1/2"
-          ),
-          children: /* @__PURE__ */ s(i, { width: 32, height: 32, className: "text-white" })
-        }
-      )
-    ]
-  }
-);
-export {
-  o as UseCaseItemContentTransform
-};
-//# sourceMappingURL=index285.mjs.map

package/index286.mjs

@@ -1,21 +0,0 @@
-import { jsx as o } from "react/jsx-runtime";
-import { clsx as f } from "./index296.mjs";
-const l = ({
-  image: e,
-  withBorder: r,
-  ...t
-}) => e ? /* @__PURE__ */ o(
-  "div",
-  {
-    className: f(
-      "relative overflow-hidden rounded-500",
-      r && "after:pointer-events-none after:absolute after:left-0 after:top-0 after:h-full after:w-full after:rounded-500 after:border after:border-misc-border after:content-['']"
-    ),
-    ...t,
-    children: e
-  }
-) : null;
-export {
-  l as UseCaseItemContentTransformItem
-};
-//# sourceMappingURL=index286.mjs.map

package/index287.mjs

@@ -1,28 +0,0 @@
-import { jsx as r } from "react/jsx-runtime";
-import { clsx as f } from "./index296.mjs";
-import { useState as m, useEffect as n } from "react";
-import s from "./index409.mjs";
-const p = ({ videoId: e, className: i }) => {
-  const [o, t] = m("");
-  return n(() => {
-    typeof window < "u" && t(window.location.origin);
-  }, []), o ? /* @__PURE__ */ r(
-    s,
-    {
-      videoId: e,
-      id: e,
-      className: f(
-        "yt-embed relative aspect-video w-full overflow-hidden",
-        "[&_iframe]:absolute [&_iframe]:inset-0 [&_iframe]:size-full",
-        i
-      ),
-      opts: {
-        origin: o
-      }
-    }
-  ) : null;
-};
-export {
-  p as YoutubeEmbed
-};
-//# sourceMappingURL=index287.mjs.map

package/index288.mjs

@@ -1,55 +0,0 @@
-import { useRef as s, useState as u, useCallback as f, useLayoutEffect as v, useEffect as T } from "react";
-import { noop as B } from "./index7.mjs";
-import C from "./index299.mjs";
-const b = 80, g = 300;
-function U(h = {}) {
-  const {
-    scrollThresholdPercentage: a = b,
-    debounceMs: d = g,
-    onScrollThresholdReached: L = B
-  } = h, R = s(
-    C(L, d, { leading: !0, trailing: !1 })
-  ).current, o = s(!1), [E, m] = u(!1), [S, w] = u(!1), r = s(null), p = f(() => {
-    const e = r.current;
-    if (!e)
-      return;
-    const t = e.clientWidth / 2;
-    e.scrollTo({
-      left: e.scrollLeft - t,
-      behavior: "smooth"
-    });
-  }, []), O = f(() => {
-    const e = r.current;
-    if (!e)
-      return;
-    const t = e.clientWidth / 2;
-    e.scrollTo({
-      left: e.scrollLeft + t,
-      behavior: "smooth"
-    });
-  }, []);
-  return (typeof window < "u" ? v : T)(() => {
-    const e = r.current;
-    function t() {
-      if (!e)
-        return;
-      const { scrollLeft: n, scrollWidth: c, offsetWidth: l } = e;
-      m(n > 0), w(Math.ceil(n + l) < c);
-      const i = (c - l) * (a / 100);
-      n >= i && !o.current ? (R(), o.current = !0) : n < i && o.current && (o.current = !1);
-    }
-    return t(), e == null || e.addEventListener("scroll", t), window.addEventListener("resize", t), () => {
-      e == null || e.removeEventListener("scroll", t), window.removeEventListener("resize", t);
-    };
-  }, []), {
-    showLeftButton: E,
-    showRightButton: S,
-    handleClickLeftButton: p,
-    handleClickRightButton: O,
-    scrollerRef: r
-  };
-}
-export {
-  U as useCarousel
-};
-//# sourceMappingURL=index288.mjs.map

package/index289.mjs

@@ -1,58 +0,0 @@
-import { jsx as d } from "react/jsx-runtime";
-import { createContext as j, useContext as w, useCallback as u } from "react";
-import { useControlledState as y } from "./index290.mjs";
-const i = j({
-  // oxlint-disable-next-line typescript/no-empty-function
-  setGroupValue: () => {
-  },
-  checkboxProps: (n = {}) => n
-}), f = () => w(i), p = ({
-  value: n,
-  defaultValue: c = [],
-  onValueChange: m,
-  limit: r,
-  children: G,
-  ...C
-}) => {
-  const [b, s] = y({
-    value: n,
-    defaultValue: c,
-    onValueChange: m
-  }), h = u(
-    (e, t) => {
-      s((o = []) => {
-        const k = o.includes(e), x = typeof t > "u" ? !k : t;
-        return x === k ? o : x ? [...o, e].slice(-Math.abs(r ?? 0)) : o.filter((l) => l !== e);
-      });
-    },
-    [r, s]
-  ), g = u(
-    (e) => {
-      const t = e == null ? void 0 : e.value;
-      return {
-        ...C,
-        ...e,
-        defaultChecked: c == null ? void 0 : c.includes(t),
-        onCheckedChange: (o) => h(t, !!o)
-      };
-    },
-    [C, c, h]
-  );
-  return /* @__PURE__ */ d(
-    i.Provider,
-    {
-      value: {
-        groupValue: b,
-        setGroupValue: s,
-        checkboxProps: g
-      },
-      children: G
-    }
-  );
-};
-export {
-  p as CheckGroup,
-  i as CheckGroupContext,
-  f as useCheckGroup
-};
-//# sourceMappingURL=index289.mjs.map