@justanarthur/modo-ui 0.6.0-canary.8 → 0.6.0

package/dist/shared/components-gyt7my41.js

@@ -1,328 +0,0 @@
-"use client";
-import {
-  FIELD_ACTION_RADIUS2
-} from "./components-124epb7f.js";
-import {
-  useShape2
-} from "./components-71nbt03m.js";
-import {
-  useSize2
-} from "./components-h83az0bz.js";
-import {
-  cn2
-} from "./components-jcnjay5g.js";
-import {
-  useFieldState2
-} from "./components-hdzrqqpx.js";
-import {
-  useIcon2
-} from "./components-jqpefjsn.js";
-import {
-  useReduceMotion2
-} from "./components-de99ykt7.js";
-import {
-  spring2
-} from "./components-3ey0hzpb.js";
-import {
-  button_default
-} from "./components-9sttq78t.js";
-import {
-  Spinner2,
-  progress_default
-} from "./components-d3shbwqq.js";
-import {
-  formatFileSize2,
-  dragVerdict2,
-  sortFiles2
-} from "./components-f7h57m6t.js";
-
-// components/inputs/file-dropzone/index.tsx
-import { Field } from "@base-ui/react/field";
-import { motion as motion2 } from "motion/react";
-import {
-  forwardRef,
-  useRef,
-  useState
-} from "react";
-
-// components/inputs/file-dropzone/file-row.tsx
-import { AnimatePresence, motion } from "motion/react";
-import { jsx, jsxs } from "react/jsx-runtime";
-var THUMB = { default: "size-8", compact: "size-7" };
-var ROW_PAD = { default: "py-1.5", compact: "py-1" };
-var SPINNER = { default: "size-4", compact: "size-3.5" };
-function StatusGlyph({ status, size }) {
-  const Done = useIcon2("circle-check");
-  const Failed = useIcon2("circle-alert");
-  const reduced = useReduceMotion2();
-  const icon = useSize2(size).icon;
-  return /* @__PURE__ */ jsx("span", {
-    "aria-hidden": "true",
-    className: "inline-grid shrink-0 place-items-center",
-    children: /* @__PURE__ */ jsx(AnimatePresence, {
-      initial: false,
-      mode: "popLayout",
-      children: status !== "idle" && /* @__PURE__ */ jsxs(motion.span, {
-        className: cn2("col-start-1 row-start-1 flex", status === "done" && "text-status-success", status === "error" && "text-destructive", status === "uploading" && "text-muted-foreground"),
-        initial: { opacity: 0, scale: reduced ? 1 : 0.6 },
-        animate: { opacity: 1, scale: 1 },
-        exit: { opacity: 0, scale: reduced ? 1 : 0.8, transition: spring2.fast.exit },
-        transition: spring2.fast,
-        children: [
-          status === "done" && /* @__PURE__ */ jsx(Done, {
-            size: icon,
-            strokeWidth: 2
-          }),
-          status === "error" && /* @__PURE__ */ jsx(Failed, {
-            size: icon,
-            strokeWidth: 2
-          }),
-          status === "uploading" && /* @__PURE__ */ jsx(Spinner2, {
-            className: SPINNER[size]
-          })
-        ]
-      }, status)
-    })
-  });
-}
-function FileRow2({
-  file,
-  name: nameProp,
-  fileSize: fileSizeProp,
-  type: typeProp,
-  thumbnail,
-  icon,
-  status = "idle",
-  progress,
-  description,
-  error,
-  onRemove,
-  removeLabel = "Remove file",
-  uploadingLabel = "Uploading",
-  actions,
-  locale,
-  disabled = false,
-  size: sizeProp,
-  className
-}) {
-  const size = useSize2(sizeProp);
-  const shape = useShape2();
-  const compact = size.variant === "compact";
-  const FileIcon = useIcon2("file");
-  const ImageIcon = useIcon2("image");
-  const Remove = useIcon2("x");
-  const name = nameProp ?? file?.name ?? "";
-  const bytes = fileSizeProp ?? file?.size;
-  const type = typeProp ?? file?.type ?? "";
-  const Glyph = icon ?? (type.startsWith("image/") ? ImageIcon : FileIcon);
-  const shown = error ? "error" : status;
-  const sizeText = bytes != null ? formatFileSize2(bytes, locale) : undefined;
-  const meta = error ?? description ?? (status === "uploading" && progress != null ? `${sizeText ?? ""} · ${Math.round(progress)}%` : sizeText);
-  return /* @__PURE__ */ jsxs("div", {
-    "data-status": shown,
-    "data-disabled": disabled || undefined,
-    className: cn2("flex min-w-0 items-center transition-opacity duration-fast", size.gap, size.itemPx, ROW_PAD[size.variant], shape.item, disabled && "pointer-events-none opacity-50", className),
-    children: [
-      /* @__PURE__ */ jsx("span", {
-        className: cn2("flex shrink-0 items-center justify-center overflow-hidden bg-muted text-muted-foreground", THUMB[size.variant], FIELD_ACTION_RADIUS2[shape.variant]),
-        children: thumbnail ? /* @__PURE__ */ jsx("img", {
-          src: thumbnail,
-          alt: "",
-          className: "size-full object-cover"
-        }) : /* @__PURE__ */ jsx(Glyph, {
-          size: size.icon,
-          strokeWidth: 1.5
-        })
-      }),
-      /* @__PURE__ */ jsxs("div", {
-        className: "flex min-w-0 flex-1 flex-col",
-        children: [
-          /* @__PURE__ */ jsx("span", {
-            className: cn2("truncate text-foreground weight-normal", size.text),
-            title: name,
-            children: name
-          }),
-          meta != null && meta !== "" && /* @__PURE__ */ jsx("span", {
-            className: cn2("truncate", compact ? "text-caption-compact" : "text-caption", error ? "text-destructive weight-medium" : "text-muted-foreground weight-normal"),
-            children: meta
-          }),
-          shown === "uploading" && /* @__PURE__ */ jsx(progress_default, {
-            value: progress ?? null,
-            "aria-label": uploadingLabel,
-            className: "mt-1"
-          })
-        ]
-      }),
-      /* @__PURE__ */ jsx(StatusGlyph, {
-        status: shown,
-        size: size.variant
-      }),
-      actions,
-      onRemove && /* @__PURE__ */ jsx(button_default, {
-        variant: "ghost",
-        size: "icon-compact",
-        "aria-label": removeLabel,
-        disabled,
-        onClick: onRemove,
-        children: /* @__PURE__ */ jsx(Remove, {
-          strokeWidth: 1.5
-        })
-      })
-    ]
-  });
-}
-
-// components/inputs/file-dropzone/index.tsx
-import { jsx as jsx2, jsxs as jsxs2, Fragment } from "react/jsx-runtime";
-var PAD = { default: "px-6 py-8", compact: "px-4 py-5" };
-var FileDropzone2 = forwardRef(({
-  onFilesChange,
-  onFilesRejected,
-  accept,
-  multiple = false,
-  maxFiles,
-  maxSize,
-  label,
-  description,
-  activeLabel = "Drop to add",
-  partialLabel = "Some files will be skipped",
-  rejectLabel = "These files can't be added",
-  icon,
-  children,
-  id,
-  required,
-  invalid,
-  disabled,
-  readOnly,
-  size: sizeProp,
-  className,
-  style,
-  onDragEnter: dragEnter,
-  onDragOver: dragOver,
-  onDragLeave: dragLeave,
-  onDrop: dropped,
-  ...rest
-}, ref) => {
-  const field = useFieldState2();
-  const size = useSize2(sizeProp);
-  const shape = useShape2();
-  const reduced = useReduceMotion2();
-  const Upload = useIcon2("upload");
-  const Glyph = icon ?? Upload;
-  const compact = size.variant === "compact";
-  const isInvalid = invalid ?? field?.invalid ?? false;
-  const isDisabled = disabled ?? field?.disabled ?? false;
-  const isReadOnly = readOnly ?? field?.readOnly ?? false;
-  const closed = isDisabled || isReadOnly;
-  const [drag, setDrag] = useState("idle");
-  const depth = useRef(0);
-  const hand = (files) => {
-    if (!files.length)
-      return;
-    const { accepted, rejected } = sortFiles2(files, { accept, maxSize, maxFiles, multiple });
-    if (accepted.length)
-      onFilesChange?.(accepted);
-    if (rejected.length)
-      onFilesRejected?.(rejected);
-  };
-  const onDragEnter = (e) => {
-    dragEnter?.(e);
-    if (closed || !e.dataTransfer.types.includes("Files"))
-      return;
-    e.preventDefault();
-    depth.current++;
-    const types = [...e.dataTransfer.items].filter((item) => item.kind === "file").map((item) => item.type);
-    setDrag(dragVerdict2(types, accept, multiple ? maxFiles ?? Number.POSITIVE_INFINITY : 1));
-  };
-  const onDragOver = (e) => {
-    dragOver?.(e);
-    if (closed || drag === "idle")
-      return;
-    e.preventDefault();
-    e.dataTransfer.dropEffect = drag === "reject" ? "none" : "copy";
-  };
-  const onDragLeave = (e) => {
-    dragLeave?.(e);
-    if (drag === "idle")
-      return;
-    depth.current = Math.max(depth.current - 1, 0);
-    if (depth.current === 0)
-      setDrag("idle");
-  };
-  const onDrop = (e) => {
-    dropped?.(e);
-    if (closed)
-      return;
-    e.preventDefault();
-    depth.current = 0;
-    setDrag("idle");
-    hand([...e.dataTransfer.files]);
-  };
-  const onChange = (e) => {
-    hand([...e.target.files ?? []]);
-    e.target.value = "";
-  };
-  const line = drag === "accept" ? activeLabel : drag === "partial" ? partialLabel : drag === "reject" ? rejectLabel : label ?? (multiple ? "Drop files here or click to browse" : "Drop a file here or click to browse");
-  return /* @__PURE__ */ jsxs2("label", {
-    ...rest,
-    style,
-    onDragEnter,
-    onDragOver,
-    onDragLeave,
-    onDrop,
-    "data-dragging": drag === "idle" ? undefined : drag,
-    "data-invalid": isInvalid || undefined,
-    "data-disabled": isDisabled || undefined,
-    "data-readonly": isReadOnly || undefined,
-    className: cn2("group/zone relative flex cursor-pointer flex-col items-center justify-center text-center", "border border-dashed border-border transition-[background-color,border-color,opacity] duration-fast", "hover:bg-muted/50 has-[:focus-visible]:ring-1 has-[:focus-visible]:ring-focus-ring", "data-[dragging=accept]:border-solid data-[dragging=accept]:!border-border data-[dragging=accept]:!bg-muted", "data-[dragging=partial]:border-solid data-[dragging=partial]:!border-border data-[dragging=partial]:!bg-muted", "data-[invalid]:border-destructive/50 data-[invalid]:hover:bg-destructive-light/60", "data-[dragging=reject]:border-solid data-[dragging=reject]:border-destructive/50 data-[dragging=reject]:!bg-destructive-light/60", "data-[readonly]:cursor-default data-[readonly]:hover:bg-transparent", "data-[disabled]:pointer-events-none data-[disabled]:opacity-50", size.gap, PAD[size.variant], shape.container, className),
-    children: [
-      /* @__PURE__ */ jsx2(Field.Control, {
-        ref,
-        id,
-        disabled: closed,
-        "aria-required": (required ?? field?.required) || undefined,
-        "aria-invalid": isInvalid || undefined,
-        render: /* @__PURE__ */ jsx2("input", {
-          type: "file",
-          accept,
-          multiple,
-          onChange,
-          className: "sr-only"
-        })
-      }),
-      children ?? /* @__PURE__ */ jsxs2(Fragment, {
-        children: [
-          /* @__PURE__ */ jsx2(motion2.span, {
-            className: cn2("flex text-muted-foreground transition-[color] duration-fast group-hover/zone:text-foreground group-data-[dragging]/zone:text-foreground", drag === "reject" && "text-destructive group-data-[dragging]/zone:text-destructive"),
-            initial: false,
-            animate: { y: (drag === "accept" || drag === "partial") && !reduced ? -2 : 0 },
-            transition: spring2.fast,
-            children: /* @__PURE__ */ jsx2(Glyph, {
-              size: size.icon,
-              strokeWidth: 1.5,
-              className: "transition-[stroke-width] duration-fast group-hover/zone:stroke-[2] group-data-[dragging]/zone:stroke-[2]"
-            })
-          }),
-          /* @__PURE__ */ jsxs2("span", {
-            className: "flex flex-col",
-            children: [
-              /* @__PURE__ */ jsx2("span", {
-                className: cn2("weight-normal", size.text, drag === "reject" ? "text-destructive" : "text-foreground"),
-                children: line
-              }),
-              description != null && /* @__PURE__ */ jsx2("span", {
-                className: cn2("text-muted-foreground weight-normal", compact ? "text-caption-compact" : "text-caption"),
-                children: description
-              })
-            ]
-          })
-        ]
-      })
-    ]
-  });
-});
-FileDropzone2.displayName = "FileDropzone";
-Object.assign(FileDropzone2, { Row: FileRow2 });
-var file_dropzone_default = FileDropzone2;
-
-export { FileRow2, FileDropzone2, file_dropzone_default };

package/dist/shared/components-h6p86be3.js

@@ -1,19 +0,0 @@
-// lib/popup.ts
-var popupScrollAreaClass2 = "min-h-0 flex-1 max-h-[inherit]";
-var popupViewportClass2 = "!h-auto max-h-[inherit] [&>div[style]]:!block [&>div[style]]:!min-w-0 [--scroll-fade-size:32px]";
-var POPUP_NAV_KEYS2 = [
-  "ArrowDown",
-  "ArrowUp",
-  "ArrowLeft",
-  "ArrowRight",
-  "Home",
-  "End",
-  "PageUp",
-  "PageDown",
-  "Tab"
-];
-function isDisabledRow2(el) {
-  return el.getAttribute("aria-disabled") === "true" || el.hasAttribute("data-disabled");
-}
-
-export { popupScrollAreaClass2, popupViewportClass2, POPUP_NAV_KEYS2, isDisabledRow2 };

package/dist/shared/components-h83az0bz.js

@@ -1,33 +0,0 @@
-"use client";
-import {
-  sizeMap2,
-  typeScale2
-} from "./components-34txk9rj.js";
-
-// lib/size-context.tsx
-import { createContext, useContext } from "react";
-function useTypeScale2(override) {
-  const variant = useSizeVariant2(override);
-  return {
-    display: typeScale2.display[variant],
-    title: typeScale2.title[variant],
-    subtitle: typeScale2.subtitle[variant],
-    body: typeScale2.body[variant],
-    caption: typeScale2.caption[variant]
-  };
-}
-var SizeContext2 = createContext(null);
-function useSizeVariant2(override) {
-  const ctx = useContext(SizeContext2);
-  return override ?? ctx?.size ?? "default";
-}
-function useSize2(override) {
-  return sizeMap2[useSizeVariant2(override)];
-}
-function useSizeContext2() {
-  const ctx = useContext(SizeContext2);
-  if (!ctx)
-    throw new Error("useSizeContext must be used within a SizeProvider");
-  return ctx;
-}
-export { useTypeScale2, SizeContext2, useSizeVariant2, useSize2, useSizeContext2 };

package/dist/shared/components-hdzrqqpx.js

@@ -1,55 +0,0 @@
-"use client";
-import {
-  fieldVariants2,
-  FIELD_PX2
-} from "./components-124epb7f.js";
-import {
-  useShape2
-} from "./components-71nbt03m.js";
-import {
-  useSize2
-} from "./components-h83az0bz.js";
-import {
-  cn2
-} from "./components-jcnjay5g.js";
-
-// lib/field-classes.ts
-import { createContext, useContext } from "react";
-var FieldStateContext2 = createContext(null);
-function useFieldState2() {
-  return useContext(FieldStateContext2);
-}
-function useFieldBox2({ variant, invalid, disabled, active, readOnly, required, size }) {
-  const field = useContext(FieldStateContext2);
-  const shape = useShape2();
-  const sizeClasses = useSize2(size);
-  const isInvalid = invalid ?? field?.invalid ?? false;
-  const isDisabled = disabled ?? field?.disabled ?? false;
-  const isReadOnly = readOnly ?? field?.readOnly ?? false;
-  return {
-    size: sizeClasses,
-    invalid: isInvalid,
-    disabled: isDisabled,
-    readOnly: isReadOnly,
-    required: required ?? field?.required,
-    props: {
-      "data-active": (active ?? field?.active) || undefined,
-      "data-invalid": isInvalid || undefined,
-      "data-disabled": isDisabled || undefined,
-      "data-readonly": isReadOnly || undefined,
-      className: cn2(fieldVariants2({ variant }), shape.input, FIELD_PX2[sizeClasses.variant])
-    }
-  };
-}
-function focusControlOnPress2(control) {
-  return (e) => {
-    if (e.target === control.current)
-      return;
-    if (!e.currentTarget.contains(e.target))
-      return;
-    e.preventDefault();
-    control.current?.focus();
-  };
-}
-
-export { FieldStateContext2, useFieldState2, useFieldBox2, focusControlOnPress2 };

package/dist/shared/components-krtx3m5b.js

@@ -1,84 +0,0 @@
-"use client";
-// lib/row-order.tsx
-import {
-  createContext,
-  useCallback,
-  useContext,
-  useId,
-  useLayoutEffect,
-  useMemo,
-  useReducer,
-  useRef,
-  useState
-} from "react";
-var EMPTY = new Map;
-var RowOrderContext2 = createContext(null);
-var before = (a, b) => a.element.compareDocumentPosition(b.element) & Node.DOCUMENT_POSITION_FOLLOWING ? -1 : 1;
-function number(slots) {
-  let next = 0;
-  const loose = [];
-  for (const entry of slots) {
-    const { explicit } = entry[1];
-    if (explicit === undefined)
-      loose.push(entry);
-    else
-      next = Math.max(next, explicit + 1);
-  }
-  const order = new Map;
-  let first;
-  for (const [id, slot] of loose.sort(([, a], [, b]) => before(a, b))) {
-    if (!slot.gap)
-      first ??= next;
-    order.set(id, next++);
-  }
-  return { order, first };
-}
-function same({ order: a, first: firstA }, { order: b, first: firstB }) {
-  if (firstA !== firstB || a.size !== b.size)
-    return false;
-  for (const [id, index] of a)
-    if (b.get(id) !== index)
-      return false;
-  return true;
-}
-function useRowOrder2() {
-  const slots = useRef(new Map);
-  const loose = useRef(0);
-  const [numbering, setNumbering] = useState({ order: EMPTY });
-  const [, changed] = useReducer((n) => n + 1, 0);
-  const register = useCallback((id, slot) => {
-    const own = slot.explicit === undefined;
-    slots.current.set(id, slot);
-    if (own)
-      loose.current++;
-    if (own || loose.current > 0)
-      changed();
-    return () => {
-      slots.current.delete(id);
-      if (own)
-        loose.current--;
-      if (own || loose.current > 0)
-        changed();
-    };
-  }, []);
-  useLayoutEffect(() => {
-    if (loose.current === 0 && numbering.order.size === 0)
-      return;
-    const next = number(slots.current);
-    setNumbering((prev) => same(prev, next) ? prev : next);
-  });
-  return useMemo(() => ({ register, ...numbering }), [register, numbering]);
-}
-function useRowSlot2(ref, explicit, gap) {
-  const ctx = useContext(RowOrderContext2);
-  const id = useId();
-  const register = ctx?.register;
-  useLayoutEffect(() => {
-    const element = ref.current;
-    if (!register || !element)
-      return;
-    return register(id, { element, explicit, gap });
-  }, [register, id, explicit, gap, ref]);
-  return { index: explicit ?? ctx?.order.get(id), firstRow: ctx?.first };
-}
-export { RowOrderContext2, useRowOrder2, useRowSlot2 };

package/dist/shared/components-kswxnm3h.js

@@ -1,24 +0,0 @@
-// components/navigation/sidebar/variants.ts
-import { cva } from "class-variance-authority";
-var sidebarMenuButtonVariants2 = cva("peer/menu-button relative z-10 flex w-full cursor-pointer select-none items-center gap-2 pl-2 text-left outline-none disabled:opacity-50 disabled:pointer-events-none transition-[padding] duration-fast pr-[var(--row-gutter)] group-hover/menu-item:pr-[var(--row-gutter-hover)] group-focus-within/menu-item:pr-[var(--row-gutter-hover)] group-hover/menu-sub-item:pr-[var(--row-gutter-hover)] group-focus-within/menu-sub-item:pr-[var(--row-gutter-hover)] group-has-[[data-sidebar=menu-action]:is([data-state=open],[data-popup-open],[aria-expanded=true])]/menu-item:pr-[var(--row-gutter-hover)] group-has-[[data-sidebar=menu-action]:is([data-state=open],[data-popup-open],[aria-expanded=true])]/menu-sub-item:pr-[var(--row-gutter-hover)]", {
-  variants: {
-    variant: {
-      default: "",
-      outline: "border border-border bg-background"
-    }
-  },
-  defaultVariants: { variant: "default" }
-});
-var SIDEBAR_COOKIE_NAME2 = "sidebar_state";
-var SIDEBAR_COOKIE_MAX_AGE2 = 60 * 60 * 24 * 7;
-var SIDEBAR_WIDTH2 = "16rem";
-var SIDEBAR_WIDTH_MOBILE2 = "18rem";
-var SIDEBAR_KEYBOARD_SHORTCUT2 = "[";
-var SIDEBAR_KEYBOARD_SHORTCUT_RIGHT2 = "]";
-var SIDEBAR_MIN_WIDTH2 = 160;
-var SIDEBAR_MAX_WIDTH2 = 360;
-var SIDEBAR_COLLAPSE_SLOP2 = 56;
-var SIDEBAR_HOVER_STRIP2 = 12;
-var SIDEBAR_HOVER_TRIGGER_GAP2 = 24;
-
-export { sidebarMenuButtonVariants2, SIDEBAR_COOKIE_NAME2, SIDEBAR_COOKIE_MAX_AGE2, SIDEBAR_WIDTH2, SIDEBAR_WIDTH_MOBILE2, SIDEBAR_KEYBOARD_SHORTCUT2, SIDEBAR_KEYBOARD_SHORTCUT_RIGHT2, SIDEBAR_MIN_WIDTH2, SIDEBAR_MAX_WIDTH2, SIDEBAR_COLLAPSE_SLOP2, SIDEBAR_HOVER_STRIP2, SIDEBAR_HOVER_TRIGGER_GAP2 };