@epicbagel/saas-kit 1.31.0 → 1.32.0

package/dist/primitives/poster.js

@@ -0,0 +1,396 @@
+"use client";
+
+// src/primitives/poster.tsx
+import {
+  forwardRef,
+  useEffect,
+  useId,
+  useRef,
+  useState
+} from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var PosterShell = forwardRef(function PosterShell2({ colours, font, colorScheme, className, style, ...props }, ref) {
+  const variables = {
+    ...colours?.paper ? { "--poster-paper": colours.paper } : {},
+    ...colours?.ink ? { "--poster-ink": colours.ink } : {},
+    ...colours?.primary ? { "--poster-primary": colours.primary } : {},
+    ...colours?.onPrimary ? { "--poster-on-primary": colours.onPrimary } : {},
+    ...colours?.mute ? { "--poster-mute": colours.mute } : {},
+    ...colours?.wash ? { "--poster-wash": colours.wash } : {},
+    ...font ? { "--poster-font": font } : {},
+    ...colorScheme ? { colorScheme } : {}
+  };
+  return /* @__PURE__ */ jsx("div", { ref, "data-slot": "poster-shell", className, style: { ...variables, ...style }, ...props });
+});
+var PosterMain = forwardRef(function PosterMain2(props, ref) {
+  return /* @__PURE__ */ jsx("main", { ref, "data-slot": "poster-main", ...props });
+});
+var PosterHeader = forwardRef(function PosterHeader2({ brand, nav, action, className, ...props }, ref) {
+  return /* @__PURE__ */ jsxs("header", { ref, "data-slot": "poster-header", className, ...props, children: [
+    brand,
+    nav,
+    action
+  ] });
+});
+function PosterNav({ label, menuLabel = "Menu", children }) {
+  const menu = useRef(null);
+  const panelId = useId();
+  useEffect(() => {
+    const details = menu.current;
+    if (!details) return;
+    const close = (focusSummary) => {
+      if (!details.open) return;
+      details.open = false;
+      if (focusSummary) details.querySelector("summary")?.focus();
+    };
+    const onKey = (event) => {
+      if (event.key === "Escape") close(details.contains(document.activeElement));
+    };
+    const onPointer = (event) => {
+      if (!details.contains(event.target)) close(false);
+    };
+    document.addEventListener("keydown", onKey);
+    document.addEventListener("pointerdown", onPointer);
+    return () => {
+      document.removeEventListener("keydown", onKey);
+      document.removeEventListener("pointerdown", onPointer);
+    };
+  }, []);
+  const onPick = (event) => {
+    if (event.target.closest("a") && menu.current) menu.current.open = false;
+  };
+  return /* @__PURE__ */ jsxs("nav", { "data-slot": "poster-nav", "aria-label": label, children: [
+    /* @__PURE__ */ jsx("ul", { "data-slot": "poster-nav-list", children }),
+    /* @__PURE__ */ jsxs("details", { ref: menu, "data-slot": "poster-nav-menu", children: [
+      /* @__PURE__ */ jsx("summary", { "data-slot": "poster-nav-toggle", "aria-controls": panelId, children: menuLabel }),
+      /* @__PURE__ */ jsx("ul", { id: panelId, "data-slot": "poster-nav-panel", onClick: onPick, children })
+    ] })
+  ] });
+}
+var PosterNavLink = forwardRef(function PosterNavLink2({ current = false, ...props }, ref) {
+  return /* @__PURE__ */ jsx("li", { "data-slot": "poster-nav-item", children: /* @__PURE__ */ jsx("a", { ref, "data-slot": "poster-nav-link", "aria-current": current ? "page" : void 0, ...props }) });
+});
+var PosterMark = forwardRef(function PosterMark2(props, ref) {
+  return /* @__PURE__ */ jsx("a", { ref, "data-slot": "poster-mark", ...props });
+});
+var PosterHeaderAction = forwardRef(function PosterHeaderAction2(props, ref) {
+  return /* @__PURE__ */ jsx("a", { ref, "data-slot": "poster-header-action", ...props });
+});
+var PosterHero = forwardRef(function PosterHero2({ title, description, eyebrow, variant = "home", actions, ...props }, ref) {
+  return /* @__PURE__ */ jsxs("section", { ref, "data-slot": "poster-hero", "data-variant": variant, ...props, children: [
+    eyebrow ? /* @__PURE__ */ jsx("p", { "data-slot": "poster-eyebrow", children: eyebrow }) : null,
+    /* @__PURE__ */ jsx("h1", { "data-slot": "poster-hero-title", children: title }),
+    description ? /* @__PURE__ */ jsx("p", { "data-slot": "poster-hero-description", children: description }) : null,
+    actions ? /* @__PURE__ */ jsx("div", { "data-slot": "poster-hero-actions", children: actions }) : null
+  ] });
+});
+var PosterAction = forwardRef(function PosterAction2({ variant = "solid", ...props }, ref) {
+  return /* @__PURE__ */ jsx("a", { ref, "data-slot": "poster-action", "data-variant": variant, ...props });
+});
+function PosterSwitch({ label, options, value, onValueChange, className }) {
+  return /* @__PURE__ */ jsx("div", { "data-slot": "poster-switch", role: "group", "aria-label": label, className, children: options.map((option) => /* @__PURE__ */ jsxs(
+    "button",
+    {
+      type: "button",
+      "data-slot": "poster-switch-option",
+      "aria-pressed": option.value === value,
+      onClick: () => onValueChange(option.value),
+      children: [
+        /* @__PURE__ */ jsx("span", { "data-slot": "poster-switch-title", children: option.title }),
+        option.hint ? /* @__PURE__ */ jsx("span", { "data-slot": "poster-switch-hint", children: option.hint }) : null
+      ]
+    },
+    option.value
+  )) });
+}
+var PosterBand = forwardRef(function PosterBand2({ tone = "paper", padding = "default", eyebrow, kicker, title, titleSize = "head", titleWrap = "balance", lead, description, after, children, ...props }, ref) {
+  return /* @__PURE__ */ jsxs("section", { ref, "data-slot": "poster-band", "data-tone": tone, "data-padding": padding, ...props, children: [
+    eyebrow ? /* @__PURE__ */ jsx("p", { "data-slot": "poster-eyebrow", children: eyebrow }) : null,
+    kicker ? /* @__PURE__ */ jsx("p", { "data-slot": "poster-kicker", children: kicker }) : null,
+    title ? /* @__PURE__ */ jsx("h2", { "data-slot": "poster-title", "data-size": titleSize, "data-wrap": titleWrap, children: title }) : null,
+    lead ? /* @__PURE__ */ jsx("p", { "data-slot": "poster-lead", children: lead }) : null,
+    description ? /* @__PURE__ */ jsx("p", { "data-slot": "poster-description", children: description }) : null,
+    after ? /* @__PURE__ */ jsx("p", { "data-slot": "poster-after", children: after }) : null,
+    children
+  ] });
+});
+var PosterSubhead = forwardRef(function PosterSubhead2(props, ref) {
+  return /* @__PURE__ */ jsx("h3", { ref, "data-slot": "poster-subhead", ...props });
+});
+var PosterStatement = forwardRef(function PosterStatement2(props, ref) {
+  return /* @__PURE__ */ jsx("p", { ref, "data-slot": "poster-statement", ...props });
+});
+var PosterCalculator = forwardRef(function PosterCalculator2(props, ref) {
+  return /* @__PURE__ */ jsx("div", { ref, "data-slot": "poster-calculator", ...props });
+});
+var PosterRanges = forwardRef(function PosterRanges2(props, ref) {
+  return /* @__PURE__ */ jsx("div", { ref, "data-slot": "poster-ranges", ...props });
+});
+function PosterRange({ label, value, min, max, step, onValueChange, valueText, id }) {
+  const generated = useId();
+  const inputId = id ?? generated;
+  return /* @__PURE__ */ jsxs("div", { "data-slot": "poster-range", children: [
+    /* @__PURE__ */ jsx("label", { "data-slot": "poster-range-label", htmlFor: inputId, children: label }),
+    /* @__PURE__ */ jsx("output", { "data-slot": "poster-range-value", htmlFor: inputId, children: valueText }),
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        "data-slot": "poster-range-input",
+        type: "range",
+        id: inputId,
+        min,
+        max,
+        step,
+        value,
+        "aria-valuetext": valueText,
+        onChange: (event) => onValueChange(Number(event.target.value))
+      }
+    )
+  ] });
+}
+var PosterFigures = forwardRef(function PosterFigures2({ items, ...props }, ref) {
+  return /* @__PURE__ */ jsx("div", { ref, "data-slot": "poster-figures", "data-columns": items.length === 1 ? 1 : 2, ...props, children: items.map((item, index) => /* @__PURE__ */ jsxs("div", { "data-slot": "poster-figure", children: [
+    /* @__PURE__ */ jsx("p", { "data-slot": "poster-figure-label", children: item.label }),
+    /* @__PURE__ */ jsx("p", { "data-slot": "poster-figure-value", children: item.value })
+  ] }, index)) });
+});
+var PosterSmallPrint = forwardRef(function PosterSmallPrint2(props, ref) {
+  return /* @__PURE__ */ jsx("p", { ref, "data-slot": "poster-small-print", ...props });
+});
+var PosterColumns = forwardRef(function PosterColumns2({ variant = "labelled", items, ...props }, ref) {
+  return /* @__PURE__ */ jsx("div", { ref, "data-slot": "poster-columns", "data-variant": variant, ...props, children: items.map((item, index) => /* @__PURE__ */ jsxs("div", { "data-slot": "poster-column", children: [
+    variant === "titled" ? /* @__PURE__ */ jsx("h3", { "data-slot": "poster-column-heading", children: item.heading }) : /* @__PURE__ */ jsx("p", { "data-slot": "poster-column-heading", children: item.heading }),
+    /* @__PURE__ */ jsx("p", { "data-slot": "poster-column-text", children: item.text }),
+    item.link ? /* @__PURE__ */ jsx("a", { "data-slot": "poster-column-link", href: item.link.href, children: item.link.label }) : null
+  ] }, index)) });
+});
+var PosterTicks = forwardRef(function PosterTicks2({ items, spacing = "default", ...props }, ref) {
+  return /* @__PURE__ */ jsx("ul", { ref, "data-slot": "poster-ticks", "data-spacing": spacing, ...props, children: items.map((item, index) => /* @__PURE__ */ jsx("li", { "data-slot": "poster-tick", children: item }, index)) });
+});
+var PosterDisclosure = forwardRef(function PosterDisclosure2({ summary, children, defaultOpen, ...props }, ref) {
+  return /* @__PURE__ */ jsxs("details", { ref, "data-slot": "poster-disclosure", open: defaultOpen, ...props, children: [
+    /* @__PURE__ */ jsx("summary", { "data-slot": "poster-disclosure-summary", children: summary }),
+    /* @__PURE__ */ jsx("div", { "data-slot": "poster-disclosure-body", children })
+  ] });
+});
+var PosterFacts = forwardRef(function PosterFacts2({ items, ...props }, ref) {
+  return /* @__PURE__ */ jsx("dl", { ref, "data-slot": "poster-facts", ...props, children: items.map((item, index) => /* @__PURE__ */ jsxs("div", { "data-slot": "poster-fact", children: [
+    /* @__PURE__ */ jsx("dt", { "data-slot": "poster-fact-term", children: item.term }),
+    /* @__PURE__ */ jsx("dd", { "data-slot": "poster-fact-detail", children: item.detail })
+  ] }, index)) });
+});
+var PosterNote = forwardRef(function PosterNote2(props, ref) {
+  return /* @__PURE__ */ jsx("p", { ref, "data-slot": "poster-note", ...props });
+});
+var PosterCallList = forwardRef(function PosterCallList2({ label, items, ...props }, ref) {
+  return /* @__PURE__ */ jsx("ul", { ref, "data-slot": "poster-calls", "aria-label": label, ...props, children: items.map((item, index) => /* @__PURE__ */ jsxs("li", { "data-slot": "poster-call", children: [
+    /* @__PURE__ */ jsx("span", { "data-slot": "poster-call-name", children: item.name }),
+    /* @__PURE__ */ jsx("span", { "data-slot": "poster-call-action", children: item.action })
+  ] }, index)) });
+});
+var PosterFlow = forwardRef(function PosterFlow2({ items, ...props }, ref) {
+  return /* @__PURE__ */ jsx("ol", { ref, "data-slot": "poster-flow", ...props, children: items.map((item, index) => /* @__PURE__ */ jsx("li", { "data-slot": "poster-flow-step", children: item }, index)) });
+});
+var PosterSteps = forwardRef(function PosterSteps2({ items, layout = "three", ...props }, ref) {
+  return /* @__PURE__ */ jsx("ol", { ref, "data-slot": "poster-steps", "data-layout": layout, ...props, children: items.map((item, index) => /* @__PURE__ */ jsx("li", { "data-slot": "poster-step", children: item }, index)) });
+});
+var PosterCost = forwardRef(function PosterCost2({ label, statement, action, ...props }, ref) {
+  return /* @__PURE__ */ jsxs("div", { ref, "data-slot": "poster-cost", ...props, children: [
+    /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx("p", { "data-slot": "poster-cost-label", children: label }),
+      /* @__PURE__ */ jsx("p", { "data-slot": "poster-cost-statement", children: statement })
+    ] }),
+    action ? /* @__PURE__ */ jsx("div", { "data-slot": "poster-cost-action", children: action }) : null
+  ] });
+});
+function PosterCopyText({ text, copyLabel = "Copy", copiedLabel = "Copied", selectedLabel = "Selected", placement = "inline" }) {
+  const textRef = useRef(null);
+  const [label, setLabel] = useState(copyLabel);
+  const select = () => {
+    const node = textRef.current;
+    const selection = typeof window === "undefined" ? null : window.getSelection();
+    if (!node || !selection) return;
+    const range = document.createRange();
+    range.selectNodeContents(node);
+    selection.removeAllRanges();
+    selection.addRange(range);
+    setLabel(selectedLabel);
+  };
+  const copy = () => {
+    const clipboard = typeof navigator === "undefined" ? void 0 : navigator.clipboard;
+    if (!clipboard?.writeText) return select();
+    clipboard.writeText(text).then(() => setLabel(copiedLabel), select);
+  };
+  return /* @__PURE__ */ jsxs("div", { "data-slot": "poster-copy", "data-placement": placement, children: [
+    /* @__PURE__ */ jsx("span", { ref: textRef, "data-slot": "poster-copy-text", children: text }),
+    /* @__PURE__ */ jsx("button", { type: "button", "data-slot": "poster-copy-button", onClick: copy, children: label })
+  ] });
+}
+var PosterPeople = forwardRef(function PosterPeople2({ items, ...props }, ref) {
+  return /* @__PURE__ */ jsx("ul", { ref, "data-slot": "poster-people", ...props, children: items.map((item, index) => /* @__PURE__ */ jsxs("li", { "data-slot": "poster-person", children: [
+    /* @__PURE__ */ jsx("span", { "data-slot": "poster-person-name", children: item.name }),
+    /* @__PURE__ */ jsx("span", { "data-slot": "poster-person-bio", children: item.bio })
+  ] }, index)) });
+});
+var PosterFootnote = forwardRef(function PosterFootnote2({ start, end, ...props }, ref) {
+  return /* @__PURE__ */ jsxs("div", { ref, "data-slot": "poster-footnote", ...props, children: [
+    /* @__PURE__ */ jsx("span", { children: start }),
+    end ? /* @__PURE__ */ jsx("span", { children: end }) : null
+  ] });
+});
+var PosterMoreLink = forwardRef(function PosterMoreLink2(props, ref) {
+  return /* @__PURE__ */ jsx("a", { ref, "data-slot": "poster-more-link", ...props });
+});
+var PosterNextLink = forwardRef(function PosterNextLink2({ label, children, ...props }, ref) {
+  return /* @__PURE__ */ jsxs("a", { ref, "data-slot": "poster-next-link", ...props, children: [
+    /* @__PURE__ */ jsx("span", { "data-slot": "poster-next-label", children: label }),
+    children
+  ] });
+});
+var PosterTextLink = forwardRef(function PosterTextLink2(props, ref) {
+  return /* @__PURE__ */ jsx("a", { ref, "data-slot": "poster-text-link", ...props });
+});
+function PosterBreak() {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    " ",
+    /* @__PURE__ */ jsx("span", { "data-slot": "poster-break" })
+  ] });
+}
+function PosterQuote({ children, by, size = "large", as = "blockquote" }) {
+  const Quote = as;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(Quote, { "data-slot": "poster-quote", "data-size": size, children }),
+    by ? /* @__PURE__ */ jsx("p", { "data-slot": "poster-quote-by", children: by }) : null
+  ] });
+}
+var PosterStats = forwardRef(function PosterStats2({ items, ...props }, ref) {
+  return /* @__PURE__ */ jsx("dl", { ref, "data-slot": "poster-stats", "data-columns": items.length <= 2 ? 2 : 4, ...props, children: items.map((item, index) => /* @__PURE__ */ jsxs("div", { "data-slot": "poster-stat", children: [
+    /* @__PURE__ */ jsx("dt", { "data-slot": "poster-stat-value", children: item.value }),
+    /* @__PURE__ */ jsx("dd", { "data-slot": "poster-stat-label", children: item.label })
+  ] }, index)) });
+});
+var PosterClaims = forwardRef(function PosterClaims2({ items, ...props }, ref) {
+  return /* @__PURE__ */ jsx("ul", { ref, "data-slot": "poster-claims", ...props, children: items.map((item, index) => /* @__PURE__ */ jsx("li", { "data-slot": "poster-claim", children: item }, index)) });
+});
+var PosterScreen = forwardRef(function PosterScreen2({ title, context, children, ...props }, ref) {
+  return /* @__PURE__ */ jsxs("div", { ref, "data-slot": "poster-screen", ...props, children: [
+    /* @__PURE__ */ jsxs("div", { "data-slot": "poster-screen-bar", children: [
+      /* @__PURE__ */ jsx("b", { children: title }),
+      context ? /* @__PURE__ */ jsx("span", { children: context }) : null
+    ] }),
+    children
+  ] });
+});
+function PosterScreenTabs({ items }) {
+  return /* @__PURE__ */ jsx("div", { "data-slot": "poster-screen-tabs", children: items.map((item, index) => index === 0 ? /* @__PURE__ */ jsx("b", { children: item }, index) : /* @__PURE__ */ jsx("span", { children: item }, index)) });
+}
+function PosterScreenSplit({ ratio = "5:7", children }) {
+  return /* @__PURE__ */ jsx("div", { "data-slot": "poster-screen-split", "data-ratio": ratio, children });
+}
+function PosterScreenPane({ children }) {
+  return /* @__PURE__ */ jsx("div", { "data-slot": "poster-screen-pane", children });
+}
+function PosterScreenMessage({ from, children, variant = "sent" }) {
+  return /* @__PURE__ */ jsxs("div", { "data-slot": "poster-screen-message", "data-variant": variant, children: [
+    /* @__PURE__ */ jsx("small", { children: from }),
+    children
+  ] });
+}
+function PosterScreenTrace({ items }) {
+  return /* @__PURE__ */ jsx("ul", { "data-slot": "poster-screen-trace", children: items.map((item, index) => /* @__PURE__ */ jsx("li", { children: item }, index)) });
+}
+function PosterScreenLead({ children }) {
+  return /* @__PURE__ */ jsx("p", { "data-slot": "poster-screen-lead", children });
+}
+function PosterGrade({ children, top = false }) {
+  return /* @__PURE__ */ jsx("span", { "data-slot": "poster-grade", "data-top": top || void 0, children });
+}
+function PosterScreenPerson({ initials, name, summary, test, grade, topGrade }) {
+  return /* @__PURE__ */ jsxs("div", { "data-slot": "poster-screen-person", children: [
+    /* @__PURE__ */ jsx("span", { "data-slot": "poster-initials", "aria-hidden": "true", children: initials }),
+    /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx("b", { children: name }),
+      /* @__PURE__ */ jsx("span", { children: summary }),
+      test ? /* @__PURE__ */ jsx("em", { children: test }) : null
+    ] }),
+    /* @__PURE__ */ jsx(PosterGrade, { top: topGrade, children: grade })
+  ] });
+}
+function PosterScreenQueue({ items }) {
+  return /* @__PURE__ */ jsx("div", { "data-slot": "poster-screen-queue", children: items.map((item, index) => /* @__PURE__ */ jsxs("div", { "data-slot": "poster-screen-queue-item", "data-selected": item.selected || void 0, children: [
+    /* @__PURE__ */ jsx("b", { children: item.name }),
+    /* @__PURE__ */ jsx("span", { children: item.role }),
+    /* @__PURE__ */ jsx(PosterGrade, { top: item.topGrade, children: item.grade })
+  ] }, index)) });
+}
+function PosterScreenDetail({ title, line, evidence = [], actions = [] }) {
+  return /* @__PURE__ */ jsxs("div", { "data-slot": "poster-screen-detail", children: [
+    /* @__PURE__ */ jsx("h3", { children: title }),
+    line ? /* @__PURE__ */ jsx("p", { "data-slot": "poster-screen-detail-line", children: line }) : null,
+    evidence.length ? /* @__PURE__ */ jsx("ul", { "data-slot": "poster-screen-evidence", children: evidence.map((item, index) => /* @__PURE__ */ jsx("li", { children: item }, index)) }) : null,
+    actions.length ? /* @__PURE__ */ jsx("div", { "data-slot": "poster-screen-decide", children: actions.map((action, index) => index === 0 ? /* @__PURE__ */ jsx("b", { children: action }, index) : /* @__PURE__ */ jsx("span", { children: action }, index)) }) : null
+  ] });
+}
+function PosterScreenRows({ items }) {
+  return /* @__PURE__ */ jsx("div", { "data-slot": "poster-screen-rows", children: items.map((item, index) => /* @__PURE__ */ jsxs("div", { "data-slot": "poster-screen-row", children: [
+    /* @__PURE__ */ jsx("b", { children: item.name }),
+    /* @__PURE__ */ jsx("span", { children: item.line }),
+    /* @__PURE__ */ jsx(PosterGrade, { top: item.topGrade, children: item.grade }),
+    /* @__PURE__ */ jsx("em", { "data-needs-you": item.needsYou || void 0, children: item.action })
+  ] }, index)) });
+}
+var PosterMockNote = forwardRef(function PosterMockNote2(props, ref) {
+  return /* @__PURE__ */ jsx("p", { ref, "data-slot": "poster-mock-note", ...props });
+});
+export {
+  PosterAction,
+  PosterBand,
+  PosterBreak,
+  PosterCalculator,
+  PosterCallList,
+  PosterClaims,
+  PosterColumns,
+  PosterCopyText,
+  PosterCost,
+  PosterDisclosure,
+  PosterFacts,
+  PosterFigures,
+  PosterFlow,
+  PosterFootnote,
+  PosterGrade,
+  PosterHeader,
+  PosterHeaderAction,
+  PosterHero,
+  PosterMain,
+  PosterMark,
+  PosterMockNote,
+  PosterMoreLink,
+  PosterNav,
+  PosterNavLink,
+  PosterNextLink,
+  PosterNote,
+  PosterPeople,
+  PosterQuote,
+  PosterRange,
+  PosterRanges,
+  PosterScreen,
+  PosterScreenDetail,
+  PosterScreenLead,
+  PosterScreenMessage,
+  PosterScreenPane,
+  PosterScreenPerson,
+  PosterScreenQueue,
+  PosterScreenRows,
+  PosterScreenSplit,
+  PosterScreenTabs,
+  PosterScreenTrace,
+  PosterShell,
+  PosterSmallPrint,
+  PosterStatement,
+  PosterStats,
+  PosterSteps,
+  PosterSubhead,
+  PosterSwitch,
+  PosterTextLink,
+  PosterTicks
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@epicbagel/saas-kit",
-  "version": "1.31.0",
+  "version": "1.32.0",
   "description": "Accessible React primitives, layout components and design tokens for SaaS apps, built on Radix UI and Tailwind CSS v4.",
   "license": "MIT",
   "keywords": [
@@ -880,6 +880,16 @@
         "default": "./dist/primitives/popover.cjs"
       }
     },
+    "./primitives/poster": {
+      "import": {
+        "types": "./dist/primitives/poster.d.ts",
+        "default": "./dist/primitives/poster.js"
+      },
+      "require": {
+        "types": "./dist/primitives/poster.d.cts",
+        "default": "./dist/primitives/poster.cjs"
+      }
+    },
     "./primitives/progress": {
       "import": {
         "types": "./dist/primitives/progress.d.ts",