@drawnagency/primitives 0.1.113 → 0.1.115

package/dist/chunk-RIITGTV3.js

@@ -0,0 +1,275 @@
+import {
+  getMediaProvider
+} from "./chunk-HHNPSKPT.js";
+import {
+  cn
+} from "./chunk-7EOSDFS3.js";
+
+// src/components/shared/PagesContext.tsx
+import { createContext, useContext } from "react";
+var PagesContext = createContext({ pages: [], getPageHeadings: () => [] });
+function usePages() {
+  return useContext(PagesContext);
+}
+
+// src/components/shared/FormLabel.tsx
+import { jsx } from "react/jsx-runtime";
+function FormLabel({ htmlFor, children, className }) {
+  return /* @__PURE__ */ jsx(
+    "label",
+    {
+      htmlFor,
+      className: cn("mb-1.5 block text-sm font-medium text-base-contrast", className),
+      children
+    }
+  );
+}
+
+// src/components/shared/Input.tsx
+import { forwardRef, useId } from "react";
+import { jsx as jsx2, jsxs } from "react/jsx-runtime";
+var Input = forwardRef(function Input2({ label, value, onChange, type = "text", className, disabled, error, hint, hideLabel, inputClassName, ...rest }, ref) {
+  const id = useId();
+  const errorId = `${id}-error`;
+  const hintId = `${id}-hint`;
+  return /* @__PURE__ */ jsxs("div", { className, children: [
+    /* @__PURE__ */ jsx2(FormLabel, { htmlFor: id, className: hideLabel ? "sr-only" : void 0, children: label }),
+    /* @__PURE__ */ jsx2(
+      "input",
+      {
+        ref,
+        id,
+        type,
+        value,
+        onChange: (e) => onChange(e.target.value),
+        disabled,
+        "aria-invalid": error ? true : void 0,
+        "aria-describedby": error ? errorId : hint ? hintId : void 0,
+        className: cn(
+          "w-full rounded border bg-base px-3 py-2 text-sm text-base-contrast focus:outline-none focus:ring-1",
+          error ? "border-danger focus:border-danger focus:ring-danger" : "border-base-200 focus:border-base-contrast focus:ring-base-contrast",
+          disabled && "cursor-not-allowed opacity-50",
+          inputClassName
+        ),
+        ...rest
+      }
+    ),
+    error ? /* @__PURE__ */ jsx2("p", { id: errorId, className: "mt-1 text-xs text-danger", children: error }) : hint ? /* @__PURE__ */ jsx2("p", { id: hintId, className: "mt-1 text-xs text-base-contrast-light", children: hint }) : null
+  ] });
+});
+
+// src/components/shared/Select.tsx
+import { useId as useId2 } from "react";
+import { ChevronDown } from "lucide-react";
+import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
+function Select({
+  label,
+  value,
+  onChange,
+  options,
+  disabled,
+  className,
+  selectClassName,
+  ...rest
+}) {
+  const id = useId2();
+  return /* @__PURE__ */ jsxs2("div", { className, children: [
+    label && /* @__PURE__ */ jsx3(FormLabel, { htmlFor: id, children: label }),
+    /* @__PURE__ */ jsxs2("div", { className: "relative", children: [
+      /* @__PURE__ */ jsx3(
+        "select",
+        {
+          id,
+          value,
+          onChange: (e) => onChange(e.target.value),
+          disabled,
+          ...rest,
+          className: cn(
+            "w-full appearance-none rounded border border-base-200 bg-base py-2 pr-8 pl-3 text-sm text-base-contrast",
+            "focus:border-base-contrast focus:outline-none focus:ring-1 focus:ring-base-contrast",
+            disabled && "cursor-not-allowed opacity-50",
+            selectClassName
+          ),
+          children: options.map((opt) => /* @__PURE__ */ jsx3("option", { value: opt.value, children: opt.label }, opt.value))
+        }
+      ),
+      /* @__PURE__ */ jsx3(
+        ChevronDown,
+        {
+          size: 14,
+          className: "pointer-events-none absolute right-2.5 top-1/2 -translate-y-1/2 text-base-contrast-light"
+        }
+      )
+    ] })
+  ] });
+}
+
+// src/components/shared/LinkField.tsx
+import { Fragment, jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
+var TARGET_OPTIONS = [
+  { label: "Same tab (_self)", value: "_self" },
+  { label: "New tab (_blank)", value: "_blank" }
+];
+function LinkField({ label, value, onChange }) {
+  const { pages, getPageHeadings } = usePages();
+  const isInternal = value.kind === "internal";
+  function setMode(kind) {
+    if (kind === value.kind) return;
+    onChange(kind === "external" ? { kind: "external", href: "", target: value.target } : { kind: "internal", pageId: "", anchorSectionId: null, target: "_self" });
+  }
+  const pageId = isInternal ? value.pageId : "";
+  const headings = pageId ? getPageHeadings(pageId) : [];
+  return /* @__PURE__ */ jsxs3("div", { className: "flex flex-col gap-3", children: [
+    /* @__PURE__ */ jsx4(FormLabel, { children: label }),
+    /* @__PURE__ */ jsx4("div", { className: "flex gap-2", role: "tablist", children: ["internal", "external"].map((kind) => /* @__PURE__ */ jsx4(
+      "button",
+      {
+        type: "button",
+        role: "tab",
+        "aria-selected": value.kind === kind,
+        onClick: () => setMode(kind),
+        className: cn(
+          "cursor-pointer rounded border px-3 py-1 text-sm capitalize",
+          value.kind === kind ? "border-primary bg-primary text-primary-contrast" : "border-base-200 text-base-contrast"
+        ),
+        children: kind === "external" ? "External URL" : "Internal page"
+      },
+      kind
+    )) }),
+    value.kind === "external" ? /* @__PURE__ */ jsx4(
+      Input,
+      {
+        label: "URL",
+        value: value.href,
+        placeholder: "https://...",
+        onChange: (href) => onChange({ kind: "external", href, target: value.target })
+      }
+    ) : /* @__PURE__ */ jsxs3(Fragment, { children: [
+      /* @__PURE__ */ jsx4(
+        Select,
+        {
+          label: "Page",
+          value: value.pageId,
+          options: [{ label: "Select a page\u2026", value: "" }, ...pages.map((p) => ({ label: p.title, value: p.id }))],
+          onChange: (pid) => onChange({ kind: "internal", pageId: pid, anchorSectionId: null, target: value.target })
+        }
+      ),
+      /* @__PURE__ */ jsx4(
+        Select,
+        {
+          label: "Section",
+          value: value.anchorSectionId ?? "",
+          disabled: !pageId,
+          options: [{ label: "None (top of page)", value: "" }, ...headings.map((h) => ({ label: h.label, value: h.id }))],
+          onChange: (anchor) => onChange({ kind: "internal", pageId, anchorSectionId: anchor || null, target: value.target })
+        }
+      )
+    ] }),
+    value.kind === "external" && /* @__PURE__ */ jsx4(
+      Select,
+      {
+        label: "Opens in",
+        value: value.target,
+        options: TARGET_OPTIONS,
+        onChange: (t) => onChange({ ...value, target: t })
+      }
+    )
+  ] });
+}
+
+// src/components/shell/MediaLibraryContext.tsx
+import { createContext as createContext2, useContext as useContext2 } from "react";
+var MediaLibraryContext = createContext2(null);
+function useMediaLibrary() {
+  return useContext2(MediaLibraryContext);
+}
+
+// src/hooks/useResolvedMedia.ts
+import { useMemo } from "react";
+function useResolvedMedia(imageId) {
+  const ctx = useMediaLibrary();
+  return useMemo(() => {
+    if (!imageId || !ctx) {
+      return { src: void 0, srcset: void 0, poster: void 0, alt: "", kind: "image" };
+    }
+    const { manifest, pendingItems, pendingLocalUrls, siteConfig } = ctx;
+    const sizes = siteConfig?.media?.sizes ?? [640, 1080, 1920];
+    const manifestItem = manifest.images[imageId];
+    const pendingItem = pendingItems.find((i) => i.id === imageId);
+    const item = manifestItem ?? pendingItem;
+    const alt = item?.alt ?? "";
+    const kind = item?.kind ?? "image";
+    const width = item?.width;
+    const height = item?.height;
+    const localUrl = pendingLocalUrls[imageId];
+    if (localUrl) {
+      return { src: localUrl, srcset: void 0, poster: void 0, alt, kind, width, height };
+    }
+    if (manifestItem) {
+      const provider = getMediaProvider();
+      const resolved = provider.resolve(manifestItem, sizes);
+      if (resolved && resolved.tag === "img") {
+        return {
+          src: resolved.src,
+          srcset: "srcSet" in resolved ? resolved.srcSet : void 0,
+          poster: void 0,
+          alt,
+          kind,
+          width: resolved.width,
+          height: resolved.height
+        };
+      }
+      if (resolved && resolved.tag === "video") {
+        return { src: resolved.src, srcset: void 0, poster: resolved.poster, alt, kind, width: resolved.width, height: resolved.height };
+      }
+    }
+    return { src: void 0, srcset: void 0, poster: void 0, alt, kind, width, height };
+  }, [imageId, ctx]);
+}
+
+// src/components/shared/icons.tsx
+import { GripVertical } from "lucide-react";
+import { GripVertical as GripVertical2, Plus, Trash2, X, Settings } from "lucide-react";
+import { jsx as jsx5 } from "react/jsx-runtime";
+function DragHandle({ size = 16 }) {
+  return /* @__PURE__ */ jsx5(GripVertical, { size });
+}
+
+// src/components/editor/DropEdgeIndicator.tsx
+import { jsx as jsx6 } from "react/jsx-runtime";
+function DropEdgeIndicator({
+  edge,
+  inset = false,
+  style
+}) {
+  if (!edge) return null;
+  const horizontal = edge === "top" || edge === "bottom";
+  return /* @__PURE__ */ jsx6(
+    "div",
+    {
+      "data-drop-edge": edge,
+      className: cn(
+        "absolute z-10 bg-primary",
+        horizontal ? cn("right-0 h-0.5", inset ? "left-6" : "left-0") : "top-0 bottom-0 w-0.5",
+        edge === "top" && "top-0 -translate-y-1/2",
+        edge === "bottom" && "bottom-0 translate-y-1/2",
+        edge === "left" && "left-0 -translate-x-1",
+        edge === "right" && "right-0 translate-x-1"
+      ),
+      style
+    }
+  );
+}
+
+export {
+  PagesContext,
+  usePages,
+  useMediaLibrary,
+  useResolvedMedia,
+  DragHandle,
+  DropEdgeIndicator,
+  FormLabel,
+  Input,
+  Select,
+  LinkField
+};

package/dist/{chunk-HBULBDGP.js → chunk-S37DZPHW.js}

@@ -1,6 +1,6 @@
 import {
   HexColorSchema
-} from "./chunk-GGXZZ77Z.js";
+} from "./chunk-AASEGXNT.js";
 
 // src/schemas/audience.ts
 import { z } from "zod";

package/dist/chunk-S7QRHUWO.js

@@ -0,0 +1,8 @@
+// src/lib/slug.ts
+function slugifyPageSlug(input) {
+  return input.toLowerCase().replace(/[^a-z0-9]+/g, "-").replace(/^-+|-+$/g, "");
+}
+
+export {
+  slugifyPageSlug
+};