@mieweb/ui 0.10.0-dev.4 → 0.10.0-dev.41

package/dist/chunk-WFL4N5PC.js

@@ -0,0 +1,283 @@
+import { Dropdown, DropdownItem } from './chunk-EEOGIGIA.js';
+import { Avatar } from './chunk-TI3TQQ7F.js';
+import { Badge } from './chunk-522WJIVI.js';
+import { Button } from './chunk-WFBUBT54.js';
+import { buttonVariants } from './chunk-GVM6DTR5.js';
+import { cn } from './chunk-TQONQSJO.js';
+import * as React from 'react';
+import { cva } from 'class-variance-authority';
+import { MoreHorizontal, ArrowLeft } from 'lucide-react';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+
+var defaultRecordHeaderLabels = {
+  back: "Back",
+  moreActions: "More actions",
+  meta: "Details"
+};
+var recordHeaderVariants = cva(
+  "border-border bg-background flex flex-col gap-3 border-b px-4 py-4 sm:px-6",
+  {
+    variants: {
+      sticky: {
+        true: "sticky top-0 z-20",
+        false: ""
+      }
+    },
+    defaultVariants: { sticky: false }
+  }
+);
+var menuLinkClass = "text-foreground hover:bg-muted focus-visible:bg-muted flex w-full items-center gap-3 rounded-lg px-3 py-2 text-start text-sm font-medium focus:outline-none";
+var RecordHeader = React.forwardRef(
+  ({
+    title,
+    headingLevel: Heading = "h1",
+    subtitle,
+    avatar,
+    icon: Icon,
+    media,
+    badges,
+    meta,
+    actions = [],
+    maxVisibleActions = 2,
+    presence,
+    breadcrumbs,
+    onBack,
+    backHref,
+    sticky,
+    labels: labelsProp,
+    className,
+    children,
+    ...rest
+  }, ref) => {
+    const labels = { ...defaultRecordHeaderLabels, ...labelsProp };
+    const [menuOpen, setMenuOpen] = React.useState(false);
+    const hasOverflow = actions.length > maxVisibleActions;
+    const variantOf = (a, i) => a.variant ?? (i === 0 ? "primary" : "outline");
+    const leading = media ? /* @__PURE__ */ jsx("div", { "data-slot": "record-header-media", className: "shrink-0", children: media }) : avatar ? /* @__PURE__ */ jsx(
+      Avatar,
+      {
+        "data-slot": "record-header-media",
+        size: "lg",
+        src: avatar.src,
+        name: avatar.name,
+        alt: "",
+        className: "shrink-0"
+      }
+    ) : Icon ? /* @__PURE__ */ jsx(
+      "div",
+      {
+        "data-slot": "record-header-media",
+        className: "bg-muted text-muted-foreground flex h-12 w-12 shrink-0 items-center justify-center rounded-lg",
+        children: /* @__PURE__ */ jsx(Icon, { className: "h-6 w-6", "aria-hidden": "true" })
+      }
+    ) : null;
+    const backClass = cn(
+      buttonVariants({ variant: "ghost", size: "icon" }),
+      "shrink-0 rtl:[&_svg]:-scale-x-100"
+    );
+    const back = backHref ? /* @__PURE__ */ jsx(
+      "a",
+      {
+        href: backHref,
+        onClick: onBack,
+        "aria-label": labels.back,
+        className: backClass,
+        children: /* @__PURE__ */ jsx(ArrowLeft, { className: "h-5 w-5", "aria-hidden": "true" })
+      }
+    ) : onBack ? /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        onClick: onBack,
+        "aria-label": labels.back,
+        className: backClass,
+        children: /* @__PURE__ */ jsx(ArrowLeft, { className: "h-5 w-5", "aria-hidden": "true" })
+      }
+    ) : null;
+    const renderButton = (a, i) => {
+      const ActionIcon = a.icon;
+      const iconEl = ActionIcon ? /* @__PURE__ */ jsx(ActionIcon, { className: "h-4 w-4", "aria-hidden": "true" }) : void 0;
+      const hiddenOnMobile = "hidden sm:inline-flex";
+      if (a.href && !a.disabled) {
+        return /* @__PURE__ */ jsxs(
+          "a",
+          {
+            href: a.href,
+            onClick: a.onClick,
+            className: cn(
+              buttonVariants({ variant: variantOf(a, i), size: "sm" }),
+              "gap-2",
+              hiddenOnMobile
+            ),
+            children: [
+              iconEl,
+              a.label
+            ]
+          },
+          a.id
+        );
+      }
+      return /* @__PURE__ */ jsx(
+        Button,
+        {
+          size: "sm",
+          variant: variantOf(a, i),
+          leftIcon: iconEl,
+          onClick: a.onClick,
+          disabled: a.disabled,
+          className: hiddenOnMobile,
+          children: a.label
+        },
+        a.id
+      );
+    };
+    const renderMenuItem = (a, i) => {
+      const ActionIcon = a.icon;
+      const iconEl = ActionIcon ? /* @__PURE__ */ jsx(ActionIcon, { className: "h-4 w-4", "aria-hidden": "true" }) : void 0;
+      const mobileOnly = i < maxVisibleActions && "sm:hidden";
+      const select = (event) => {
+        setMenuOpen(false);
+        a.onClick?.(event);
+      };
+      if (a.href && !a.disabled) {
+        return /* @__PURE__ */ jsxs(
+          "a",
+          {
+            role: "menuitem",
+            "data-slot": "dropdown-item",
+            href: a.href,
+            onClick: select,
+            className: cn(menuLinkClass, mobileOnly),
+            children: [
+              iconEl && /* @__PURE__ */ jsx("span", { className: "h-4 w-4 shrink-0", children: iconEl }),
+              a.label
+            ]
+          },
+          a.id
+        );
+      }
+      return /* @__PURE__ */ jsx(
+        DropdownItem,
+        {
+          icon: iconEl,
+          variant: variantOf(a, i) === "danger" ? "danger" : "default",
+          disabled: a.disabled,
+          onClick: select,
+          className: cn(mobileOnly),
+          children: a.label
+        },
+        a.id
+      );
+    };
+    return /* @__PURE__ */ jsxs(
+      "header",
+      {
+        ref,
+        "data-slot": "record-header",
+        className: cn(recordHeaderVariants({ sticky }), className),
+        ...rest,
+        children: [
+          breadcrumbs && /* @__PURE__ */ jsx("div", { "data-slot": "record-header-breadcrumbs", children: breadcrumbs }),
+          /* @__PURE__ */ jsxs(
+            "div",
+            {
+              "data-slot": "record-header-row",
+              className: "flex flex-col gap-3 sm:flex-row sm:items-start sm:justify-between",
+              children: [
+                /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-1 items-start gap-3 sm:gap-4", children: [
+                  back,
+                  leading,
+                  /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
+                    /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [
+                      /* @__PURE__ */ jsx(
+                        Heading,
+                        {
+                          "data-slot": "record-header-title",
+                          className: "text-foreground min-w-0 text-xl font-semibold break-words",
+                          children: title
+                        }
+                      ),
+                      badges?.map((b) => /* @__PURE__ */ jsx(Badge, { size: "sm", variant: b.variant, children: b.label }, b.id))
+                    ] }),
+                    subtitle && /* @__PURE__ */ jsx(
+                      "p",
+                      {
+                        "data-slot": "record-header-subtitle",
+                        className: "text-muted-foreground mt-0.5 text-sm",
+                        children: subtitle
+                      }
+                    ),
+                    meta && meta.length > 0 && /* @__PURE__ */ jsx(
+                      "ul",
+                      {
+                        "data-slot": "record-header-meta",
+                        "aria-label": labels.meta,
+                        className: "text-muted-foreground mt-1.5 flex flex-wrap items-center gap-x-4 gap-y-1 text-sm",
+                        children: meta.map(({ id, label, icon: MetaIcon, href }) => {
+                          const content = /* @__PURE__ */ jsxs(Fragment, { children: [
+                            MetaIcon && /* @__PURE__ */ jsx(
+                              MetaIcon,
+                              {
+                                className: "h-4 w-4 shrink-0",
+                                "aria-hidden": "true"
+                              }
+                            ),
+                            label
+                          ] });
+                          return /* @__PURE__ */ jsx("li", { className: "inline-flex items-center gap-1.5", children: href ? /* @__PURE__ */ jsx(
+                            "a",
+                            {
+                              href,
+                              className: "hover:text-foreground focus-visible:ring-ring inline-flex items-center gap-1.5 rounded-sm underline-offset-2 hover:underline focus-visible:ring-2 focus-visible:outline-none",
+                              children: content
+                            }
+                          ) : content }, id);
+                        })
+                      }
+                    )
+                  ] })
+                ] }),
+                (presence || actions.length > 0) && /* @__PURE__ */ jsxs(
+                  "div",
+                  {
+                    "data-slot": "record-header-actions",
+                    className: "flex shrink-0 items-center gap-2 sm:justify-end",
+                    children: [
+                      presence,
+                      actions.slice(0, maxVisibleActions).map(renderButton),
+                      actions.length > 0 && /* @__PURE__ */ jsx(
+                        Dropdown,
+                        {
+                          open: menuOpen,
+                          onOpenChange: setMenuOpen,
+                          placement: "bottom-end",
+                          trigger: /* @__PURE__ */ jsx(
+                            Button,
+                            {
+                              variant: "outline",
+                              size: "sm",
+                              "aria-label": labels.moreActions,
+                              className: cn(!hasOverflow && "sm:hidden"),
+                              children: /* @__PURE__ */ jsx(MoreHorizontal, { className: "h-4 w-4", "aria-hidden": "true" })
+                            }
+                          ),
+                          children: actions.map(renderMenuItem)
+                        }
+                      )
+                    ]
+                  }
+                )
+              ]
+            }
+          ),
+          children
+        ]
+      }
+    );
+  }
+);
+RecordHeader.displayName = "RecordHeader";
+
+export { RecordHeader, defaultRecordHeaderLabels };
+//# sourceMappingURL=chunk-WFL4N5PC.js.map
+//# sourceMappingURL=chunk-WFL4N5PC.js.map

package/dist/chunk-WFL4N5PC.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/RecordHeader/RecordHeader.tsx"],"names":[],"mappings":"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","file":"chunk-WFL4N5PC.js","sourcesContent":["import * as React from 'react';\nimport { cva } from 'class-variance-authority';\nimport { ArrowLeft, MoreHorizontal, type LucideIcon } from 'lucide-react';\nimport { cn } from '../../utils/cn';\nimport { Avatar } from '../Avatar/Avatar';\nimport { Badge, type BadgeProps } from '../Badge/Badge';\nimport { Button, type ButtonProps } from '../Button/Button';\nimport { buttonVariants } from '../Button/button-variants';\nimport { Dropdown, DropdownItem } from '../Dropdown/Dropdown';\n\nexport interface RecordHeaderBadge {\n  id: string;\n  label: string;\n  variant?: BadgeProps['variant'];\n}\n\nexport interface RecordHeaderMetaItem {\n  id: string;\n  label: string;\n  icon?: LucideIcon;\n  href?: string;\n}\n\nexport interface RecordHeaderAction {\n  id: string;\n  label: string;\n  icon?: LucideIcon;\n  /** With `href`, call `event.preventDefault()` to route client-side. */\n  onClick?: (event: React.MouseEvent<HTMLElement>) => void;\n  href?: string;\n  /** Defaults to `primary` for the first action and `outline` for the rest. */\n  variant?: ButtonProps['variant'];\n  disabled?: boolean;\n}\n\nexport interface RecordHeaderLabels {\n  back: string;\n  moreActions: string;\n  meta: string;\n}\n\nexport const defaultRecordHeaderLabels: RecordHeaderLabels = {\n  back: 'Back',\n  moreActions: 'More actions',\n  meta: 'Details',\n};\n\nconst recordHeaderVariants = cva(\n  'border-border bg-background flex flex-col gap-3 border-b px-4 py-4 sm:px-6',\n  {\n    variants: {\n      sticky: {\n        true: 'sticky top-0 z-20',\n        false: '',\n      },\n    },\n    defaultVariants: { sticky: false },\n  }\n);\n\nexport interface RecordHeaderProps extends Omit<\n  React.HTMLAttributes<HTMLElement>,\n  'title'\n> {\n  title: React.ReactNode;\n  headingLevel?: 'h1' | 'h2' | 'h3';\n  subtitle?: React.ReactNode;\n  avatar?: { src?: string | null; name: string };\n  icon?: LucideIcon;\n  /** Replaces avatar/icon, e.g. a company logo. */\n  media?: React.ReactNode;\n  badges?: RecordHeaderBadge[];\n  meta?: RecordHeaderMetaItem[];\n  actions?: RecordHeaderAction[];\n  /** Actions shown as buttons from `sm` up; the rest go to the overflow menu. */\n  maxVisibleActions?: number;\n  presence?: React.ReactNode;\n  breadcrumbs?: React.ReactNode;\n  onBack?: (event: React.MouseEvent<HTMLElement>) => void;\n  backHref?: string;\n  sticky?: boolean;\n  labels?: Partial<RecordHeaderLabels>;\n}\n\nconst menuLinkClass =\n  'text-foreground hover:bg-muted focus-visible:bg-muted flex w-full items-center gap-3 rounded-lg px-3 py-2 text-start text-sm font-medium focus:outline-none';\n\nexport const RecordHeader = React.forwardRef<HTMLElement, RecordHeaderProps>(\n  (\n    {\n      title,\n      headingLevel: Heading = 'h1',\n      subtitle,\n      avatar,\n      icon: Icon,\n      media,\n      badges,\n      meta,\n      actions = [],\n      maxVisibleActions = 2,\n      presence,\n      breadcrumbs,\n      onBack,\n      backHref,\n      sticky,\n      labels: labelsProp,\n      className,\n      children,\n      ...rest\n    },\n    ref\n  ) => {\n    const labels = { ...defaultRecordHeaderLabels, ...labelsProp };\n    const [menuOpen, setMenuOpen] = React.useState(false);\n    const hasOverflow = actions.length > maxVisibleActions;\n    const variantOf = (a: RecordHeaderAction, i: number) =>\n      a.variant ?? (i === 0 ? 'primary' : 'outline');\n\n    const leading = media ? (\n      <div data-slot=\"record-header-media\" className=\"shrink-0\">\n        {media}\n      </div>\n    ) : avatar ? (\n      <Avatar\n        data-slot=\"record-header-media\"\n        size=\"lg\"\n        src={avatar.src}\n        name={avatar.name}\n        // The title already names the record; don't announce it twice.\n        alt=\"\"\n        className=\"shrink-0\"\n      />\n    ) : Icon ? (\n      <div\n        data-slot=\"record-header-media\"\n        className=\"bg-muted text-muted-foreground flex h-12 w-12 shrink-0 items-center justify-center rounded-lg\"\n      >\n        <Icon className=\"h-6 w-6\" aria-hidden=\"true\" />\n      </div>\n    ) : null;\n\n    const backClass = cn(\n      buttonVariants({ variant: 'ghost', size: 'icon' }),\n      'shrink-0 rtl:[&_svg]:-scale-x-100'\n    );\n    const back = backHref ? (\n      <a\n        href={backHref}\n        onClick={onBack}\n        aria-label={labels.back}\n        className={backClass}\n      >\n        <ArrowLeft className=\"h-5 w-5\" aria-hidden=\"true\" />\n      </a>\n    ) : onBack ? (\n      <button\n        type=\"button\"\n        onClick={onBack}\n        aria-label={labels.back}\n        className={backClass}\n      >\n        <ArrowLeft className=\"h-5 w-5\" aria-hidden=\"true\" />\n      </button>\n    ) : null;\n\n    const renderButton = (a: RecordHeaderAction, i: number) => {\n      const ActionIcon = a.icon;\n      const iconEl = ActionIcon ? (\n        <ActionIcon className=\"h-4 w-4\" aria-hidden=\"true\" />\n      ) : undefined;\n      const hiddenOnMobile = 'hidden sm:inline-flex';\n      if (a.href && !a.disabled) {\n        return (\n          <a\n            key={a.id}\n            href={a.href}\n            onClick={a.onClick}\n            className={cn(\n              buttonVariants({ variant: variantOf(a, i), size: 'sm' }),\n              'gap-2',\n              hiddenOnMobile\n            )}\n          >\n            {iconEl}\n            {a.label}\n          </a>\n        );\n      }\n      return (\n        <Button\n          key={a.id}\n          size=\"sm\"\n          variant={variantOf(a, i)}\n          leftIcon={iconEl}\n          onClick={a.onClick}\n          disabled={a.disabled}\n          className={hiddenOnMobile}\n        >\n          {a.label}\n        </Button>\n      );\n    };\n\n    const renderMenuItem = (a: RecordHeaderAction, i: number) => {\n      const ActionIcon = a.icon;\n      const iconEl = ActionIcon ? (\n        <ActionIcon className=\"h-4 w-4\" aria-hidden=\"true\" />\n      ) : undefined;\n      // Items that are also buttons only appear in the menu below `sm`.\n      const mobileOnly = i < maxVisibleActions && 'sm:hidden';\n      const select = (event: React.MouseEvent<HTMLElement>) => {\n        setMenuOpen(false);\n        a.onClick?.(event);\n      };\n      if (a.href && !a.disabled) {\n        return (\n          <a\n            key={a.id}\n            role=\"menuitem\"\n            data-slot=\"dropdown-item\"\n            href={a.href}\n            onClick={select}\n            className={cn(menuLinkClass, mobileOnly)}\n          >\n            {iconEl && <span className=\"h-4 w-4 shrink-0\">{iconEl}</span>}\n            {a.label}\n          </a>\n        );\n      }\n      return (\n        <DropdownItem\n          key={a.id}\n          icon={iconEl}\n          variant={variantOf(a, i) === 'danger' ? 'danger' : 'default'}\n          disabled={a.disabled}\n          onClick={select}\n          className={cn(mobileOnly)}\n        >\n          {a.label}\n        </DropdownItem>\n      );\n    };\n\n    return (\n      <header\n        ref={ref}\n        data-slot=\"record-header\"\n        className={cn(recordHeaderVariants({ sticky }), className)}\n        {...rest}\n      >\n        {breadcrumbs && (\n          <div data-slot=\"record-header-breadcrumbs\">{breadcrumbs}</div>\n        )}\n        <div\n          data-slot=\"record-header-row\"\n          className=\"flex flex-col gap-3 sm:flex-row sm:items-start sm:justify-between\"\n        >\n          <div className=\"flex min-w-0 flex-1 items-start gap-3 sm:gap-4\">\n            {back}\n            {leading}\n            <div className=\"min-w-0 flex-1\">\n              <div className=\"flex flex-wrap items-center gap-2\">\n                <Heading\n                  data-slot=\"record-header-title\"\n                  className=\"text-foreground min-w-0 text-xl font-semibold break-words\"\n                >\n                  {title}\n                </Heading>\n                {badges?.map((b) => (\n                  <Badge key={b.id} size=\"sm\" variant={b.variant}>\n                    {b.label}\n                  </Badge>\n                ))}\n              </div>\n              {subtitle && (\n                <p\n                  data-slot=\"record-header-subtitle\"\n                  className=\"text-muted-foreground mt-0.5 text-sm\"\n                >\n                  {subtitle}\n                </p>\n              )}\n              {meta && meta.length > 0 && (\n                <ul\n                  data-slot=\"record-header-meta\"\n                  aria-label={labels.meta}\n                  className=\"text-muted-foreground mt-1.5 flex flex-wrap items-center gap-x-4 gap-y-1 text-sm\"\n                >\n                  {meta.map(({ id, label, icon: MetaIcon, href }) => {\n                    const content = (\n                      <>\n                        {MetaIcon && (\n                          <MetaIcon\n                            className=\"h-4 w-4 shrink-0\"\n                            aria-hidden=\"true\"\n                          />\n                        )}\n                        {label}\n                      </>\n                    );\n                    return (\n                      <li key={id} className=\"inline-flex items-center gap-1.5\">\n                        {href ? (\n                          <a\n                            href={href}\n                            className=\"hover:text-foreground focus-visible:ring-ring inline-flex items-center gap-1.5 rounded-sm underline-offset-2 hover:underline focus-visible:ring-2 focus-visible:outline-none\"\n                          >\n                            {content}\n                          </a>\n                        ) : (\n                          content\n                        )}\n                      </li>\n                    );\n                  })}\n                </ul>\n              )}\n            </div>\n          </div>\n          {(presence || actions.length > 0) && (\n            <div\n              data-slot=\"record-header-actions\"\n              className=\"flex shrink-0 items-center gap-2 sm:justify-end\"\n            >\n              {presence}\n              {actions.slice(0, maxVisibleActions).map(renderButton)}\n              {actions.length > 0 && (\n                <Dropdown\n                  open={menuOpen}\n                  onOpenChange={setMenuOpen}\n                  placement=\"bottom-end\"\n                  trigger={\n                    <Button\n                      variant=\"outline\"\n                      size=\"sm\"\n                      aria-label={labels.moreActions}\n                      className={cn(!hasOverflow && 'sm:hidden')}\n                    >\n                      <MoreHorizontal className=\"h-4 w-4\" aria-hidden=\"true\" />\n                    </Button>\n                  }\n                >\n                  {actions.map(renderMenuItem)}\n                </Dropdown>\n              )}\n            </div>\n          )}\n        </div>\n        {children}\n      </header>\n    );\n  }\n);\n\nRecordHeader.displayName = 'RecordHeader';\n"]}

package/dist/chunk-WQHBMZSC.js

@@ -0,0 +1,295 @@
+import { cn } from './chunk-TQONQSJO.js';
+import * as React from 'react';
+import { cva } from 'class-variance-authority';
+import { ImagePlus, Loader2, Trash2 } from 'lucide-react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var defaultLogoUploaderLabels = {
+  upload: "Upload logo",
+  replace: "Replace logo",
+  remove: "Remove logo",
+  dropHint: "Drop an image or click to browse",
+  uploading: "Uploading\u2026",
+  removing: "Removing\u2026",
+  invalidType: "That file type is not supported.",
+  tooLarge: (maxBytes) => `Files must be ${formatBytes(maxBytes)} or smaller.`,
+  uploadFailed: "Upload failed. Try again.",
+  removeFailed: "Could not remove the logo. Try again.",
+  previewAlt: "Current logo"
+};
+function formatBytes(bytes) {
+  if (bytes < 1024) return `${bytes} B`;
+  const kb = bytes / 1024;
+  if (kb < 1024) return `${Math.round(kb)} KB`;
+  return `${Math.round(kb / 1024 * 10) / 10} MB`;
+}
+function safeImageSrc(url) {
+  const trimmed = url?.trim();
+  if (!trimmed) return null;
+  const scheme = /^([a-z][a-z\d+.-]*):/i.exec(trimmed)?.[1].toLowerCase();
+  if (!scheme || ["http", "https", "blob"].includes(scheme)) return trimmed;
+  return /^data:image\//i.test(trimmed) ? trimmed : null;
+}
+function matchesAccept(file, accept) {
+  return accept.split(",").map((token) => token.trim().toLowerCase()).some((token) => {
+    if (!token) return false;
+    if (token.startsWith(".")) return file.name.toLowerCase().endsWith(token);
+    if (token.endsWith("/*")) return file.type.startsWith(token.slice(0, -1));
+    return file.type === token;
+  });
+}
+function FilePreview({ file, alt }) {
+  const canvasRef = React.useRef(null);
+  React.useEffect(() => {
+    if (typeof globalThis.createImageBitmap !== "function") return;
+    let cancelled = false;
+    globalThis.createImageBitmap(file).then((bitmap) => {
+      const canvas = canvasRef.current;
+      if (!cancelled && canvas) {
+        canvas.width = bitmap.width;
+        canvas.height = bitmap.height;
+        canvas.getContext("2d")?.drawImage(bitmap, 0, 0);
+      }
+      bitmap.close();
+    }).catch(() => {
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [file]);
+  return /* @__PURE__ */ jsx(
+    "canvas",
+    {
+      ref: canvasRef,
+      role: "img",
+      "aria-label": alt,
+      className: "h-full w-full object-contain"
+    }
+  );
+}
+var targetVariants = cva(
+  [
+    "relative flex cursor-pointer items-center justify-center overflow-hidden border-2 border-dashed bg-muted/40 text-muted-foreground",
+    "transition-colors motion-reduce:transition-none hover:border-primary-500 hover:text-foreground",
+    "peer-focus-visible:ring-ring peer-focus-visible:ring-2 peer-focus-visible:ring-offset-2",
+    "peer-disabled:cursor-not-allowed peer-disabled:opacity-50"
+  ],
+  {
+    variants: {
+      shape: { square: "rounded-lg", circle: "rounded-full" },
+      size: { sm: "h-16 w-16", md: "h-24 w-24", lg: "h-32 w-32" },
+      dragging: {
+        true: "border-primary-500 bg-primary-500/10",
+        false: "border-border"
+      },
+      filled: { true: "border-solid bg-card", false: "" }
+    },
+    defaultVariants: {
+      shape: "square",
+      size: "md",
+      dragging: false,
+      filled: false
+    }
+  }
+);
+var LogoUploader = React.forwardRef(
+  function LogoUploader2({
+    value,
+    onUpload,
+    onRemove,
+    accept = "image/*",
+    maxSizeBytes,
+    disabled,
+    shape,
+    size,
+    labels: labelOverrides,
+    className,
+    ...props
+  }, ref) {
+    const labels = { ...defaultLogoUploaderLabels, ...labelOverrides };
+    const [busy, setBusy] = React.useState(
+      null
+    );
+    const [preview, setPreview] = React.useState(null);
+    const [localFile, setLocalFile] = React.useState(null);
+    const [error, setError] = React.useState(null);
+    const [dragging, setDragging] = React.useState(false);
+    const inputRef = React.useRef(null);
+    const generation = React.useRef(0);
+    const id = React.useId();
+    const inputId = `${id}-input`;
+    const errorId = `${id}-error`;
+    React.useEffect(() => {
+      generation.current += 1;
+      setPreview(null);
+      setLocalFile(null);
+    }, [value]);
+    const shown = localFile ? null : safeImageSrc(preview ?? value);
+    const filled = !!localFile || !!shown;
+    const inactive = disabled || busy !== null;
+    const refocusInput = React.useRef(false);
+    React.useEffect(() => {
+      if (busy === null && refocusInput.current) {
+        refocusInput.current = false;
+        inputRef.current?.focus();
+      }
+    }, [busy]);
+    const handleFile = async (file) => {
+      if (!file || inactive) return;
+      if (!matchesAccept(file, accept)) return setError(labels.invalidType);
+      if (maxSizeBytes !== void 0 && file.size > maxSizeBytes) {
+        return setError(labels.tooLarge(maxSizeBytes));
+      }
+      setError(null);
+      const request = ++generation.current;
+      setPreview(null);
+      setLocalFile(file);
+      setBusy("uploading");
+      try {
+        const url = await onUpload(file);
+        if (url && request === generation.current) {
+          setLocalFile(null);
+          setPreview(url);
+        }
+      } catch {
+        if (request === generation.current) {
+          setLocalFile(null);
+          setError(labels.uploadFailed);
+        }
+      } finally {
+        setBusy(null);
+      }
+    };
+    const handleRemove = async () => {
+      if (!onRemove || inactive) return;
+      setError(null);
+      setBusy("removing");
+      try {
+        await onRemove();
+        setPreview(null);
+        setLocalFile(null);
+      } catch {
+        setError(labels.removeFailed);
+      } finally {
+        refocusInput.current = true;
+        setBusy(null);
+      }
+    };
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        "data-slot": "logo-uploader",
+        "aria-busy": busy !== null || void 0,
+        className: cn("inline-flex flex-col items-start gap-2", className),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+            /* @__PURE__ */ jsx(
+              "input",
+              {
+                ref: inputRef,
+                id: inputId,
+                type: "file",
+                accept,
+                disabled: inactive,
+                "aria-label": filled ? labels.replace : labels.upload,
+                "aria-describedby": error ? errorId : void 0,
+                "aria-invalid": error ? true : void 0,
+                onChange: (e) => {
+                  void handleFile(e.target.files?.[0]);
+                  e.target.value = "";
+                },
+                className: "peer sr-only"
+              }
+            ),
+            /* @__PURE__ */ jsxs(
+              "label",
+              {
+                htmlFor: inputId,
+                "data-slot": "logo-uploader-target",
+                onDragOver: (e) => {
+                  e.preventDefault();
+                  if (!inactive) setDragging(true);
+                },
+                onDragLeave: () => setDragging(false),
+                onDrop: (e) => {
+                  e.preventDefault();
+                  setDragging(false);
+                  void handleFile(e.dataTransfer.files?.[0]);
+                },
+                className: targetVariants({
+                  shape,
+                  size,
+                  dragging,
+                  filled
+                }),
+                children: [
+                  localFile ? /* @__PURE__ */ jsx(FilePreview, { file: localFile, alt: labels.previewAlt }) : shown ? /* @__PURE__ */ jsx(
+                    "img",
+                    {
+                      src: shown,
+                      alt: labels.previewAlt,
+                      className: "h-full w-full object-contain"
+                    }
+                  ) : /* @__PURE__ */ jsxs("span", { className: "flex flex-col items-center gap-1 px-2 text-center text-xs", children: [
+                    /* @__PURE__ */ jsx(ImagePlus, { "aria-hidden": "true", className: "h-5 w-5" }),
+                    /* @__PURE__ */ jsx("span", { children: labels.dropHint })
+                  ] }),
+                  busy && /* @__PURE__ */ jsxs(
+                    "span",
+                    {
+                      role: "status",
+                      className: "bg-background/70 absolute inset-0 flex items-center justify-center",
+                      children: [
+                        /* @__PURE__ */ jsx(
+                          Loader2,
+                          {
+                            "aria-hidden": "true",
+                            className: "text-foreground h-5 w-5 animate-spin motion-reduce:animate-none"
+                          }
+                        ),
+                        /* @__PURE__ */ jsx("span", { className: "sr-only", children: busy === "uploading" ? labels.uploading : labels.removing })
+                      ]
+                    }
+                  )
+                ]
+              }
+            ),
+            filled && onRemove && /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                "aria-label": labels.remove,
+                title: labels.remove,
+                disabled: inactive,
+                onClick: () => void handleRemove(),
+                className: cn(
+                  "border-border bg-card text-muted-foreground absolute -end-2 -top-2 rounded-full border p-1 shadow-sm",
+                  "hover:text-destructive focus-visible:ring-ring focus-visible:ring-2 focus-visible:outline-none",
+                  "disabled:cursor-not-allowed disabled:opacity-50"
+                ),
+                children: /* @__PURE__ */ jsx(Trash2, { "aria-hidden": "true", className: "h-3.5 w-3.5" })
+              }
+            )
+          ] }),
+          error && /* @__PURE__ */ jsx(
+            "p",
+            {
+              id: errorId,
+              role: "alert",
+              "data-slot": "logo-uploader-error",
+              className: "text-destructive-700 dark:text-destructive-400 text-sm",
+              children: error
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+LogoUploader.displayName = "LogoUploader";
+
+export { LogoUploader, defaultLogoUploaderLabels };
+//# sourceMappingURL=chunk-WQHBMZSC.js.map
+//# sourceMappingURL=chunk-WQHBMZSC.js.map

package/dist/chunk-WQHBMZSC.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/LogoUploader/LogoUploader.tsx"],"names":["LogoUploader"],"mappings":"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","file":"chunk-WQHBMZSC.js","sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { ImagePlus, Loader2, Trash2 } from 'lucide-react';\nimport { cn } from '../../utils/cn';\n\nexport interface LogoUploaderLabels {\n  /** Accessible name of the file input. */\n  upload: string;\n  replace: string;\n  remove: string;\n  /** Text inside the empty drop target. */\n  dropHint: string;\n  uploading: string;\n  removing: string;\n  invalidType: string;\n  tooLarge: (maxBytes: number) => string;\n  uploadFailed: string;\n  removeFailed: string;\n  /** Alt text of the preview image. */\n  previewAlt: string;\n}\n\nexport const defaultLogoUploaderLabels: LogoUploaderLabels = {\n  upload: 'Upload logo',\n  replace: 'Replace logo',\n  remove: 'Remove logo',\n  dropHint: 'Drop an image or click to browse',\n  uploading: 'Uploading…',\n  removing: 'Removing…',\n  invalidType: 'That file type is not supported.',\n  tooLarge: (maxBytes) => `Files must be ${formatBytes(maxBytes)} or smaller.`,\n  uploadFailed: 'Upload failed. Try again.',\n  removeFailed: 'Could not remove the logo. Try again.',\n  previewAlt: 'Current logo',\n};\n\nfunction formatBytes(bytes: number): string {\n  if (bytes < 1024) return `${bytes} B`;\n  const kb = bytes / 1024;\n  if (kb < 1024) return `${Math.round(kb)} KB`;\n  return `${Math.round((kb / 1024) * 10) / 10} MB`;\n}\n\n/** Relative URLs, http(s), blob: and data:image/ only — nothing else reaches `<img src>`. */\nfunction safeImageSrc(url: string | null | undefined): string | null {\n  const trimmed = url?.trim();\n  if (!trimmed) return null;\n  const scheme = /^([a-z][a-z\\d+.-]*):/i.exec(trimmed)?.[1].toLowerCase();\n  if (!scheme || ['http', 'https', 'blob'].includes(scheme)) return trimmed;\n  return /^data:image\\//i.test(trimmed) ? trimmed : null;\n}\n\n/** True when `file` matches an `accept` attribute value. */\nfunction matchesAccept(file: File, accept: string): boolean {\n  return accept\n    .split(',')\n    .map((token) => token.trim().toLowerCase())\n    .some((token) => {\n      if (!token) return false;\n      if (token.startsWith('.')) return file.name.toLowerCase().endsWith(token);\n      if (token.endsWith('/*')) return file.type.startsWith(token.slice(0, -1));\n      return file.type === token;\n    });\n}\n\n/**\n * Local preview of a picked file. Drawn to a canvas so the file never becomes\n * an `<img src>` string (no object URL to sanitize or revoke).\n */\nfunction FilePreview({ file, alt }: { file: File; alt: string }) {\n  const canvasRef = React.useRef<HTMLCanvasElement>(null);\n  React.useEffect(() => {\n    // Without the API (older engines, jsdom) the target keeps its spinner,\n    // same as an undecodable image.\n    if (typeof globalThis.createImageBitmap !== 'function') return;\n    let cancelled = false;\n    globalThis\n      .createImageBitmap(file)\n      .then((bitmap) => {\n        const canvas = canvasRef.current;\n        if (!cancelled && canvas) {\n          canvas.width = bitmap.width;\n          canvas.height = bitmap.height;\n          canvas.getContext('2d')?.drawImage(bitmap, 0, 0);\n        }\n        bitmap.close();\n      })\n      .catch(() => {\n        // Undecodable image: the target keeps its border and spinner.\n      });\n    return () => {\n      cancelled = true;\n    };\n  }, [file]);\n  return (\n    <canvas\n      ref={canvasRef}\n      role=\"img\"\n      aria-label={alt}\n      className=\"h-full w-full object-contain\"\n    />\n  );\n}\n\nconst targetVariants = cva(\n  [\n    'relative flex cursor-pointer items-center justify-center overflow-hidden border-2 border-dashed bg-muted/40 text-muted-foreground',\n    'transition-colors motion-reduce:transition-none hover:border-primary-500 hover:text-foreground',\n    'peer-focus-visible:ring-ring peer-focus-visible:ring-2 peer-focus-visible:ring-offset-2',\n    'peer-disabled:cursor-not-allowed peer-disabled:opacity-50',\n  ],\n  {\n    variants: {\n      shape: { square: 'rounded-lg', circle: 'rounded-full' },\n      size: { sm: 'h-16 w-16', md: 'h-24 w-24', lg: 'h-32 w-32' },\n      dragging: {\n        true: 'border-primary-500 bg-primary-500/10',\n        false: 'border-border',\n      },\n      filled: { true: 'border-solid bg-card', false: '' },\n    },\n    defaultVariants: {\n      shape: 'square',\n      size: 'md',\n      dragging: false,\n      filled: false,\n    },\n  }\n);\n\nexport interface LogoUploaderProps\n  extends\n    Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'>,\n    Pick<VariantProps<typeof targetVariants>, 'shape' | 'size'> {\n  /** URL of the current logo. */\n  value?: string | null;\n  /** Upload the file. Resolve with the new URL to preview it until `value` updates. */\n  onUpload: (file: File) => Promise<string | void>;\n  /** Remove the logo. Omit to hide the remove button. */\n  onRemove?: () => void | Promise<void>;\n  /** `accept` attribute for the file input. */\n  accept?: string;\n  /** Reject files larger than this. */\n  maxSizeBytes?: number;\n  disabled?: boolean;\n  /** Translatable strings. */\n  labels?: Partial<LogoUploaderLabels>;\n}\n\n/**\n * Square or circular logo drop target with click-to-browse, preview and\n * remove.\n */\nexport const LogoUploader = React.forwardRef<HTMLDivElement, LogoUploaderProps>(\n  function LogoUploader(\n    {\n      value,\n      onUpload,\n      onRemove,\n      accept = 'image/*',\n      maxSizeBytes,\n      disabled,\n      shape,\n      size,\n      labels: labelOverrides,\n      className,\n      ...props\n    },\n    ref\n  ) {\n    const labels = { ...defaultLogoUploaderLabels, ...labelOverrides };\n    const [busy, setBusy] = React.useState<'uploading' | 'removing' | null>(\n      null\n    );\n    const [preview, setPreview] = React.useState<string | null>(null);\n    const [localFile, setLocalFile] = React.useState<File | null>(null);\n    const [error, setError] = React.useState<string | null>(null);\n    const [dragging, setDragging] = React.useState(false);\n    const inputRef = React.useRef<HTMLInputElement>(null);\n    // Bumped by each upload and each new `value`; stale uploads check it.\n    const generation = React.useRef(0);\n    const id = React.useId();\n    const inputId = `${id}-input`;\n    const errorId = `${id}-error`;\n\n    // A fresh `value` from the caller supersedes any local preview.\n    React.useEffect(() => {\n      generation.current += 1;\n      setPreview(null);\n      setLocalFile(null);\n    }, [value]);\n\n    const shown = localFile ? null : safeImageSrc(preview ?? value);\n    const filled = !!localFile || !!shown;\n    const inactive = disabled || busy !== null;\n\n    // The input is disabled while busy, so focus it once it re-enables.\n    const refocusInput = React.useRef(false);\n    React.useEffect(() => {\n      if (busy === null && refocusInput.current) {\n        refocusInput.current = false;\n        inputRef.current?.focus();\n      }\n    }, [busy]);\n\n    const handleFile = async (file: File | undefined) => {\n      if (!file || inactive) return;\n      if (!matchesAccept(file, accept)) return setError(labels.invalidType);\n      if (maxSizeBytes !== undefined && file.size > maxSizeBytes) {\n        return setError(labels.tooLarge(maxSizeBytes));\n      }\n      setError(null);\n      const request = ++generation.current;\n      setPreview(null);\n      setLocalFile(file);\n      setBusy('uploading');\n      try {\n        const url = await onUpload(file);\n        if (url && request === generation.current) {\n          setLocalFile(null);\n          setPreview(url);\n        }\n      } catch {\n        if (request === generation.current) {\n          setLocalFile(null);\n          setError(labels.uploadFailed);\n        }\n      } finally {\n        setBusy(null);\n      }\n    };\n\n    const handleRemove = async () => {\n      if (!onRemove || inactive) return;\n      setError(null);\n      setBusy('removing');\n      try {\n        await onRemove();\n        setPreview(null);\n        setLocalFile(null);\n      } catch {\n        setError(labels.removeFailed);\n      } finally {\n        refocusInput.current = true;\n        setBusy(null);\n      }\n    };\n\n    return (\n      <div\n        ref={ref}\n        data-slot=\"logo-uploader\"\n        aria-busy={busy !== null || undefined}\n        className={cn('inline-flex flex-col items-start gap-2', className)}\n        {...props}\n      >\n        <div className=\"relative\">\n          <input\n            ref={inputRef}\n            id={inputId}\n            type=\"file\"\n            accept={accept}\n            disabled={inactive}\n            aria-label={filled ? labels.replace : labels.upload}\n            aria-describedby={error ? errorId : undefined}\n            aria-invalid={error ? true : undefined}\n            onChange={(e) => {\n              void handleFile(e.target.files?.[0]);\n              e.target.value = '';\n            }}\n            className=\"peer sr-only\"\n          />\n          <label\n            htmlFor={inputId}\n            data-slot=\"logo-uploader-target\"\n            onDragOver={(e) => {\n              e.preventDefault();\n              if (!inactive) setDragging(true);\n            }}\n            onDragLeave={() => setDragging(false)}\n            onDrop={(e) => {\n              e.preventDefault();\n              setDragging(false);\n              void handleFile(e.dataTransfer.files?.[0]);\n            }}\n            className={targetVariants({\n              shape,\n              size,\n              dragging,\n              filled,\n            })}\n          >\n            {localFile ? (\n              <FilePreview file={localFile} alt={labels.previewAlt} />\n            ) : shown ? (\n              <img\n                src={shown}\n                alt={labels.previewAlt}\n                className=\"h-full w-full object-contain\"\n              />\n            ) : (\n              <span className=\"flex flex-col items-center gap-1 px-2 text-center text-xs\">\n                <ImagePlus aria-hidden=\"true\" className=\"h-5 w-5\" />\n                <span>{labels.dropHint}</span>\n              </span>\n            )}\n            {busy && (\n              <span\n                role=\"status\"\n                className=\"bg-background/70 absolute inset-0 flex items-center justify-center\"\n              >\n                <Loader2\n                  aria-hidden=\"true\"\n                  className=\"text-foreground h-5 w-5 animate-spin motion-reduce:animate-none\"\n                />\n                <span className=\"sr-only\">\n                  {busy === 'uploading' ? labels.uploading : labels.removing}\n                </span>\n              </span>\n            )}\n          </label>\n          {filled && onRemove && (\n            <button\n              type=\"button\"\n              aria-label={labels.remove}\n              title={labels.remove}\n              disabled={inactive}\n              onClick={() => void handleRemove()}\n              className={cn(\n                'border-border bg-card text-muted-foreground absolute -end-2 -top-2 rounded-full border p-1 shadow-sm',\n                'hover:text-destructive focus-visible:ring-ring focus-visible:ring-2 focus-visible:outline-none',\n                'disabled:cursor-not-allowed disabled:opacity-50'\n              )}\n            >\n              <Trash2 aria-hidden=\"true\" className=\"h-3.5 w-3.5\" />\n            </button>\n          )}\n        </div>\n        {error && (\n          <p\n            id={errorId}\n            role=\"alert\"\n            data-slot=\"logo-uploader-error\"\n            className=\"text-destructive-700 dark:text-destructive-400 text-sm\"\n          >\n            {error}\n          </p>\n        )}\n      </div>\n    );\n  }\n);\n\nLogoUploader.displayName = 'LogoUploader';\n"]}