@devfellowship/components 1.2.3 → 1.3.0

package/dist/index.js

@@ -4751,10 +4751,389 @@ function AppNavbar({
   );
 }
 
-// src/components/organisms/PublishDrawer.tsx
+// src/components/organisms/Gantt.tsx
 import * as React44 from "react";
-import { Loader2, Youtube, Image as ImageIcon, CheckCircle2, AlertCircle } from "lucide-react";
 import { jsx as jsx63, jsxs as jsxs31 } from "react/jsx-runtime";
+function clampPct(value) {
+  if (value == null || Number.isNaN(value)) return 0;
+  return Math.max(0, Math.min(100, Math.round(value)));
+}
+function stageProgress(stage) {
+  if (stage.progress != null) return clampPct(stage.progress);
+  const ms = stage.milestones ?? [];
+  if (ms.length === 0) return 0;
+  const done = ms.filter((m) => m.done).length;
+  return clampPct(done / ms.length * 100);
+}
+function resolveWeekCount(stages, weeks) {
+  if (Array.isArray(weeks)) return Math.max(1, weeks.length);
+  if (typeof weeks === "number" && weeks > 0) return Math.round(weeks);
+  let max = 1;
+  for (const s of stages) {
+    max = Math.max(max, s.weekStart + Math.max(1, s.weekSpan) - 1);
+    for (const m of s.milestones ?? []) {
+      const ws = m.weekStart ?? s.weekStart;
+      max = Math.max(max, ws + Math.max(1, m.weekSpan ?? 1) - 1);
+    }
+  }
+  return Math.max(1, max);
+}
+function resolveWeekLabels(count2, weeks) {
+  if (Array.isArray(weeks)) return weeks;
+  return Array.from({ length: count2 }, (_, i) => `W${i + 1}`);
+}
+function barGridColumn(weekStart, weekSpan, weekCount) {
+  const start = Math.max(1, Math.min(weekStart, weekCount));
+  const rawEnd = start + Math.max(1, weekSpan) - 1;
+  const end = Math.max(start, Math.min(rawEnd, weekCount));
+  return { start, span: end - start + 1 };
+}
+var DEFAULT_DOT = "var(--s-brand-solid, #E07A4A)";
+function Gantt({
+  stages,
+  weeks,
+  dependencies = [],
+  rowsHeader = "Stage / Task",
+  stagesOnly = false,
+  header,
+  labelWidth = 240,
+  weekMinWidth = 64,
+  className,
+  style,
+  ...rest
+}) {
+  const weekCount = resolveWeekCount(stages, weeks);
+  const weekLabels = resolveWeekLabels(weekCount, weeks);
+  const [collapsed, setCollapsed] = React44.useState(
+    () => Object.fromEntries(stages.filter((s) => s.collapsed).map((s) => [s.id, true]))
+  );
+  const toggle = (id) => setCollapsed((c) => ({ ...c, [id]: !c[id] }));
+  const gridRef = React44.useRef(null);
+  const barRefs = React44.useRef({});
+  const [edges, setEdges] = React44.useState([]);
+  const recomputeEdges = React44.useCallback(() => {
+    const root = gridRef.current;
+    if (!root || dependencies.length === 0) {
+      setEdges([]);
+      return;
+    }
+    const rootBox = root.getBoundingClientRect();
+    const next = [];
+    for (const dep of dependencies) {
+      const a = barRefs.current[dep.from];
+      const b = barRefs.current[dep.to];
+      if (!a || !b) continue;
+      const ab = a.getBoundingClientRect();
+      const bb = b.getBoundingClientRect();
+      next.push({
+        id: `${dep.from}->${dep.to}`,
+        x1: ab.right - rootBox.left,
+        y1: ab.top - rootBox.top + ab.height / 2,
+        x2: bb.left - rootBox.left,
+        y2: bb.top - rootBox.top + bb.height / 2
+      });
+    }
+    setEdges(next);
+  }, [dependencies]);
+  React44.useLayoutEffect(() => {
+    recomputeEdges();
+  }, [recomputeEdges, collapsed, weekCount, stages]);
+  React44.useEffect(() => {
+    if (dependencies.length === 0) return;
+    const handler = () => recomputeEdges();
+    window.addEventListener("resize", handler);
+    return () => window.removeEventListener("resize", handler);
+  }, [dependencies.length, recomputeEdges]);
+  const trackTemplate = `${labelWidth}px repeat(${weekCount}, minmax(${weekMinWidth}px, 1fr))`;
+  return /* @__PURE__ */ jsxs31(
+    "div",
+    {
+      className: cn(
+        "dfl-gantt rounded-[var(--c-card-radius,10px)] border border-[var(--s-border-subtle,#2A2622)] bg-[var(--s-surface-panel,#141210)] text-[var(--s-ink-primary,#F6F1E7)] overflow-hidden",
+        className
+      ),
+      style,
+      ...rest,
+      children: [
+        header && /* @__PURE__ */ jsx63("div", { className: "border-b border-[var(--s-border-subtle,#2A2622)] px-5 py-4", children: header }),
+        /* @__PURE__ */ jsx63("div", { className: "overflow-x-auto", children: /* @__PURE__ */ jsxs31("div", { ref: gridRef, className: "relative min-w-max", children: [
+          edges.length > 0 && /* @__PURE__ */ jsxs31(
+            "svg",
+            {
+              className: "pointer-events-none absolute inset-0 h-full w-full",
+              "aria-hidden": "true",
+              children: [
+                /* @__PURE__ */ jsx63("defs", { children: /* @__PURE__ */ jsx63(
+                  "marker",
+                  {
+                    id: "dfl-gantt-arrow",
+                    markerWidth: "7",
+                    markerHeight: "7",
+                    refX: "5",
+                    refY: "3",
+                    orient: "auto",
+                    children: /* @__PURE__ */ jsx63(
+                      "path",
+                      {
+                        d: "M0,0 L6,3 L0,6 Z",
+                        fill: "var(--s-brand-solid, #E07A4A)"
+                      }
+                    )
+                  }
+                ) }),
+                edges.map((e) => {
+                  const stub = 14;
+                  const c1x = e.x1 + stub;
+                  const c2x = e.x2 - stub;
+                  return /* @__PURE__ */ jsx63(
+                    "path",
+                    {
+                      d: `M ${e.x1} ${e.y1} C ${c1x} ${e.y1}, ${c2x} ${e.y2}, ${e.x2} ${e.y2}`,
+                      fill: "none",
+                      stroke: "var(--s-brand-solid, #E07A4A)",
+                      strokeWidth: 1.5,
+                      strokeOpacity: 0.65,
+                      markerEnd: "url(#dfl-gantt-arrow)"
+                    },
+                    e.id
+                  );
+                })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxs31(
+            "div",
+            {
+              className: "grid items-center border-b border-[var(--s-border-subtle,#2A2622)] bg-[var(--s-surface-raised,#1A1714)]",
+              style: { gridTemplateColumns: trackTemplate },
+              children: [
+                /* @__PURE__ */ jsx63("div", { className: "px-4 py-2.5 font-[var(--s-font-mono,monospace)] text-[10.5px] font-medium uppercase tracking-[0.6px] text-[var(--s-ink-muted,#7D7568)]", children: rowsHeader }),
+                weekLabels.map((label, i) => /* @__PURE__ */ jsx63(
+                  "div",
+                  {
+                    className: "border-l border-[var(--s-border-subtle,#2A2622)] py-2.5 text-center font-[var(--s-font-mono,monospace)] text-[11px] tabular-nums text-[var(--s-ink-muted,#7D7568)]",
+                    children: label
+                  },
+                  i
+                ))
+              ]
+            }
+          ),
+          stages.map((stage) => {
+            const pct = stageProgress(stage);
+            const dot = stage.color || DEFAULT_DOT;
+            const isCollapsed = !!collapsed[stage.id];
+            const ms = stage.milestones ?? [];
+            const done = ms.filter((m) => m.done).length;
+            const sCol = barGridColumn(stage.weekStart, stage.weekSpan, weekCount);
+            return /* @__PURE__ */ jsxs31(React44.Fragment, { children: [
+              /* @__PURE__ */ jsxs31(
+                "div",
+                {
+                  className: "grid items-center border-b border-[var(--s-border-subtle,#2A2622)]",
+                  style: { gridTemplateColumns: trackTemplate },
+                  children: [
+                    /* @__PURE__ */ jsxs31(
+                      "button",
+                      {
+                        type: "button",
+                        onClick: () => toggle(stage.id),
+                        className: "flex items-center gap-2 px-4 py-3 text-left hover:bg-[var(--s-surface-raised,#1A1714)] transition-colors",
+                        "aria-expanded": !isCollapsed,
+                        children: [
+                          /* @__PURE__ */ jsx63(Chevron, { open: !isCollapsed }),
+                          /* @__PURE__ */ jsx63(
+                            "span",
+                            {
+                              className: "h-2.5 w-2.5 shrink-0 rounded-full",
+                              style: { background: dot }
+                            }
+                          ),
+                          /* @__PURE__ */ jsxs31("span", { className: "min-w-0", children: [
+                            /* @__PURE__ */ jsx63("span", { className: "block truncate text-[13px] font-semibold text-[var(--s-ink-primary,#F6F1E7)]", children: stage.title }),
+                            stage.subtitle && /* @__PURE__ */ jsx63("span", { className: "block truncate text-[11px] text-[var(--s-ink-muted,#7D7568)]", children: stage.subtitle })
+                          ] }),
+                          ms.length > 0 && /* @__PURE__ */ jsxs31("span", { className: "ml-auto shrink-0 rounded-[var(--c-badge-radius,4px)] bg-[var(--s-surface-elevated,#1F1C18)] px-1.5 py-0.5 font-[var(--s-font-mono,monospace)] text-[10px] tabular-nums text-[var(--s-ink-secondary,#C9C0B4)]", children: [
+                            done,
+                            "/",
+                            ms.length
+                          ] })
+                        ]
+                      }
+                    ),
+                    /* @__PURE__ */ jsx63(
+                      "div",
+                      {
+                        className: "relative h-9",
+                        style: {
+                          gridColumn: `${1 + sCol.start} / span ${sCol.span}`
+                        },
+                        children: /* @__PURE__ */ jsxs31(
+                          "div",
+                          {
+                            ref: (el) => {
+                              barRefs.current[stage.id] = el;
+                            },
+                            className: "absolute inset-y-2 inset-x-1 overflow-hidden rounded-[var(--p-radius-sm,4px)]",
+                            style: { background: tint(dot, 0.16) },
+                            title: `${stage.title} \xB7 ${pct}%`,
+                            children: [
+                              /* @__PURE__ */ jsx63(
+                                "div",
+                                {
+                                  className: "h-full rounded-[var(--p-radius-sm,4px)]",
+                                  style: { width: `${pct}%`, background: dot }
+                                }
+                              ),
+                              /* @__PURE__ */ jsxs31("span", { className: "absolute inset-0 flex items-center px-2 font-[var(--s-font-mono,monospace)] text-[10.5px] font-medium tabular-nums text-[var(--s-ink-primary,#F6F1E7)]", children: [
+                                pct,
+                                "%"
+                              ] })
+                            ]
+                          }
+                        )
+                      }
+                    )
+                  ]
+                }
+              ),
+              !stagesOnly && !isCollapsed && ms.map((m) => {
+                const mStart = m.weekStart ?? stage.weekStart;
+                const mCol = barGridColumn(
+                  mStart,
+                  m.weekSpan ?? 1,
+                  weekCount
+                );
+                return /* @__PURE__ */ jsxs31(
+                  "div",
+                  {
+                    className: "grid items-center border-b border-[var(--s-border-subtle,#2A2622)] bg-[var(--s-surface-page,#0A0908)]",
+                    style: { gridTemplateColumns: trackTemplate },
+                    children: [
+                      /* @__PURE__ */ jsxs31("div", { className: "flex items-center gap-2 py-2 pl-10 pr-4", children: [
+                        /* @__PURE__ */ jsx63(StatusDot, { done: m.done, color: dot }),
+                        /* @__PURE__ */ jsx63(
+                          "span",
+                          {
+                            className: cn(
+                              "min-w-0 flex-1 truncate text-[13px]",
+                              m.done ? "text-[var(--s-ink-muted,#7D7568)] line-through" : "text-[var(--s-ink-secondary,#C9C0B4)]"
+                            ),
+                            children: m.title
+                          }
+                        ),
+                        m.points != null && /* @__PURE__ */ jsx63("span", { className: "shrink-0 font-[var(--s-font-mono,monospace)] text-[10px] tabular-nums text-[var(--s-ink-muted,#7D7568)]", children: m.points })
+                      ] }),
+                      /* @__PURE__ */ jsx63(
+                        "div",
+                        {
+                          className: "relative h-6",
+                          style: {
+                            gridColumn: `${1 + mCol.start} / span ${mCol.span}`
+                          },
+                          children: /* @__PURE__ */ jsx63(
+                            "div",
+                            {
+                              className: cn(
+                                "absolute inset-y-1.5 inset-x-1 rounded-[var(--p-radius-sm,4px)]",
+                                m.done ? "" : "border"
+                              ),
+                              style: m.done ? { background: dot } : {
+                                background: tint(dot, 0.08),
+                                borderColor: tint(dot, 0.4)
+                              }
+                            }
+                          )
+                        }
+                      )
+                    ]
+                  },
+                  m.id
+                );
+              })
+            ] }, stage.id);
+          }),
+          stages.length === 0 && /* @__PURE__ */ jsx63("div", { className: "px-4 py-8 text-center text-[13px] text-[var(--s-ink-muted,#7D7568)]", children: "No stages yet." })
+        ] }) }),
+        /* @__PURE__ */ jsxs31("div", { className: "flex flex-wrap items-center gap-4 border-t border-[var(--s-border-subtle,#2A2622)] px-5 py-2.5 font-[var(--s-font-mono,monospace)] text-[10.5px] uppercase tracking-[0.6px] text-[var(--s-ink-muted,#7D7568)]", children: [
+          /* @__PURE__ */ jsx63(LegendItem, { swatch: /* @__PURE__ */ jsx63("span", { className: "h-2.5 w-3 rounded-[2px]", style: { background: "var(--s-brand-solid, #E07A4A)" } }), label: "Completed" }),
+          /* @__PURE__ */ jsx63(LegendItem, { swatch: /* @__PURE__ */ jsx63("span", { className: "h-2.5 w-3 rounded-[2px] border", style: { background: "rgba(224,122,74,0.08)", borderColor: "rgba(224,122,74,0.4)" } }), label: "Upcoming" }),
+          dependencies.length > 0 && /* @__PURE__ */ jsx63(LegendItem, { swatch: /* @__PURE__ */ jsx63("span", { className: "block h-0.5 w-4", style: { background: "var(--s-brand-solid, #E07A4A)", opacity: 0.7 } }), label: "Depends on" })
+        ] })
+      ]
+    }
+  );
+}
+function Chevron({ open }) {
+  return /* @__PURE__ */ jsx63(
+    "svg",
+    {
+      width: "14",
+      height: "14",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "1.5",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      className: "shrink-0 text-[var(--s-ink-muted,#7D7568)] transition-transform",
+      style: { transform: open ? "rotate(90deg)" : "none" },
+      "aria-hidden": "true",
+      children: /* @__PURE__ */ jsx63("path", { d: "M9 18l6-6-6-6" })
+    }
+  );
+}
+function StatusDot({ done, color }) {
+  if (done) {
+    return /* @__PURE__ */ jsxs31("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true", children: [
+      /* @__PURE__ */ jsx63("circle", { cx: "12", cy: "12", r: "9", fill: color }),
+      /* @__PURE__ */ jsx63(
+        "path",
+        {
+          d: "M8 12l3 3 5-6",
+          fill: "none",
+          stroke: "var(--s-ink-inverse, #0A0908)",
+          strokeWidth: "2",
+          strokeLinecap: "round",
+          strokeLinejoin: "round"
+        }
+      )
+    ] });
+  }
+  return /* @__PURE__ */ jsx63("svg", { width: "14", height: "14", viewBox: "0 0 24 24", "aria-hidden": "true", children: /* @__PURE__ */ jsx63(
+    "circle",
+    {
+      cx: "12",
+      cy: "12",
+      r: "8",
+      fill: "none",
+      stroke: "var(--s-border-strong, #3A3530)",
+      strokeWidth: "2"
+    }
+  ) });
+}
+function LegendItem({ swatch, label }) {
+  return /* @__PURE__ */ jsxs31("span", { className: "flex items-center gap-1.5", children: [
+    swatch,
+    label
+  ] });
+}
+function tint(color, alpha) {
+  const hex = /^#([0-9a-f]{6})$/i.exec(color.trim());
+  if (hex) {
+    const n = parseInt(hex[1], 16);
+    const r = n >> 16 & 255;
+    const g = n >> 8 & 255;
+    const b = n & 255;
+    return `rgba(${r}, ${g}, ${b}, ${alpha})`;
+  }
+  return `color-mix(in srgb, ${color} ${Math.round(alpha * 100)}%, transparent)`;
+}
+
+// src/components/organisms/PublishDrawer.tsx
+import * as React45 from "react";
+import { Loader2, Youtube, Image as ImageIcon, CheckCircle2, AlertCircle } from "lucide-react";
+import { jsx as jsx64, jsxs as jsxs32 } from "react/jsx-runtime";
 function parseTags(raw) {
   return raw.split(/[,\n]/).map((t) => t.trim()).filter((t) => t.length > 0);
 }
@@ -4790,16 +5169,16 @@ function PublishDrawer({
   onError,
   className
 }) {
-  const [title, setTitle] = React44.useState(suggestedTitle);
-  const [description, setDescription] = React44.useState(suggestedDescription);
-  const [tagsRaw, setTagsRaw] = React44.useState("");
-  const [thumbnailUrl, setThumbnailUrl] = React44.useState(suggestedThumbnailUrl);
-  const [accounts, setAccounts] = React44.useState([]);
-  const [accountId, setAccountId] = React44.useState(null);
-  const [status, setStatus] = React44.useState("idle");
-  const [errorMsg, setErrorMsg] = React44.useState(null);
-  const [result, setResult] = React44.useState(null);
-  React44.useEffect(() => {
+  const [title, setTitle] = React45.useState(suggestedTitle);
+  const [description, setDescription] = React45.useState(suggestedDescription);
+  const [tagsRaw, setTagsRaw] = React45.useState("");
+  const [thumbnailUrl, setThumbnailUrl] = React45.useState(suggestedThumbnailUrl);
+  const [accounts, setAccounts] = React45.useState([]);
+  const [accountId, setAccountId] = React45.useState(null);
+  const [status, setStatus] = React45.useState("idle");
+  const [errorMsg, setErrorMsg] = React45.useState(null);
+  const [result, setResult] = React45.useState(null);
+  React45.useEffect(() => {
     if (open) {
       setTitle(suggestedTitle);
       setDescription(suggestedDescription);
@@ -4809,7 +5188,7 @@ function PublishDrawer({
       setResult(null);
     }
   }, [open]);
-  React44.useEffect(() => {
+  React45.useEffect(() => {
     if (!open) return;
     let cancelled = false;
     (async () => {
@@ -4833,7 +5212,7 @@ function PublishDrawer({
       cancelled = true;
     };
   }, [open, supabase]);
-  const fail = React44.useCallback(
+  const fail = React45.useCallback(
     (msg) => {
       setStatus("error");
       setErrorMsg(msg);
@@ -4935,18 +5314,18 @@ function PublishDrawer({
     onPublished?.(publishResult);
   }
   const busy = status === "publishing" || status === "rendering-thumb" || status === "loading-accounts";
-  return /* @__PURE__ */ jsx63(Sheet, { open, onOpenChange, children: /* @__PURE__ */ jsxs31(SheetContent, { side: "right", className: cn("flex w-full flex-col gap-4 overflow-y-auto sm:max-w-md", className), children: [
-    /* @__PURE__ */ jsxs31(SheetHeader, { children: [
-      /* @__PURE__ */ jsxs31(SheetTitle, { className: "flex items-center gap-2", children: [
-        /* @__PURE__ */ jsx63(Youtube, { className: "h-5 w-5 text-red-600" }),
+  return /* @__PURE__ */ jsx64(Sheet, { open, onOpenChange, children: /* @__PURE__ */ jsxs32(SheetContent, { side: "right", className: cn("flex w-full flex-col gap-4 overflow-y-auto sm:max-w-md", className), children: [
+    /* @__PURE__ */ jsxs32(SheetHeader, { children: [
+      /* @__PURE__ */ jsxs32(SheetTitle, { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsx64(Youtube, { className: "h-5 w-5 text-red-600" }),
         "Publicar no YouTube"
       ] }),
-      /* @__PURE__ */ jsx63(SheetDescription, { children: "Publique o v\xEDdeo gravado cross-platform via Zernio. Preencha t\xEDtulo, descri\xE7\xE3o e palavras-chave manualmente." })
+      /* @__PURE__ */ jsx64(SheetDescription, { children: "Publique o v\xEDdeo gravado cross-platform via Zernio. Preencha t\xEDtulo, descri\xE7\xE3o e palavras-chave manualmente." })
     ] }),
-    status === "done" && result ? /* @__PURE__ */ jsxs31("div", { className: "flex flex-1 flex-col items-center justify-center gap-3 text-center", children: [
-      /* @__PURE__ */ jsx63(CheckCircle2, { className: "h-10 w-10 text-green-600" }),
-      /* @__PURE__ */ jsx63("p", { className: "font-medium", children: "V\xEDdeo publicado!" }),
-      result.post_url && /* @__PURE__ */ jsx63(
+    status === "done" && result ? /* @__PURE__ */ jsxs32("div", { className: "flex flex-1 flex-col items-center justify-center gap-3 text-center", children: [
+      /* @__PURE__ */ jsx64(CheckCircle2, { className: "h-10 w-10 text-green-600" }),
+      /* @__PURE__ */ jsx64("p", { className: "font-medium", children: "V\xEDdeo publicado!" }),
+      result.post_url && /* @__PURE__ */ jsx64(
         "a",
         {
           href: result.post_url,
@@ -4956,15 +5335,15 @@ function PublishDrawer({
           children: "Abrir no YouTube"
         }
       ),
-      /* @__PURE__ */ jsxs31("p", { className: "text-xs text-muted-foreground", children: [
+      /* @__PURE__ */ jsxs32("p", { className: "text-xs text-muted-foreground", children: [
         "Zernio post id: ",
         result.zernio_post_id
       ] }),
-      /* @__PURE__ */ jsx63(Button, { variant: "outline", onClick: () => onOpenChange(false), children: "Fechar" })
-    ] }) : /* @__PURE__ */ jsxs31("div", { className: "flex flex-1 flex-col gap-4", children: [
-      /* @__PURE__ */ jsxs31("div", { className: "grid gap-2", children: [
-        /* @__PURE__ */ jsx63(Label3, { htmlFor: "pd-title", children: "T\xEDtulo" }),
-        /* @__PURE__ */ jsx63(
+      /* @__PURE__ */ jsx64(Button, { variant: "outline", onClick: () => onOpenChange(false), children: "Fechar" })
+    ] }) : /* @__PURE__ */ jsxs32("div", { className: "flex flex-1 flex-col gap-4", children: [
+      /* @__PURE__ */ jsxs32("div", { className: "grid gap-2", children: [
+        /* @__PURE__ */ jsx64(Label3, { htmlFor: "pd-title", children: "T\xEDtulo" }),
+        /* @__PURE__ */ jsx64(
           Input,
           {
             id: "pd-title",
@@ -4975,9 +5354,9 @@ function PublishDrawer({
           }
         )
       ] }),
-      /* @__PURE__ */ jsxs31("div", { className: "grid gap-2", children: [
-        /* @__PURE__ */ jsx63(Label3, { htmlFor: "pd-desc", children: "Descri\xE7\xE3o" }),
-        /* @__PURE__ */ jsx63(
+      /* @__PURE__ */ jsxs32("div", { className: "grid gap-2", children: [
+        /* @__PURE__ */ jsx64(Label3, { htmlFor: "pd-desc", children: "Descri\xE7\xE3o" }),
+        /* @__PURE__ */ jsx64(
           Textarea,
           {
             id: "pd-desc",
@@ -4989,9 +5368,9 @@ function PublishDrawer({
           }
         )
       ] }),
-      /* @__PURE__ */ jsxs31("div", { className: "grid gap-2", children: [
-        /* @__PURE__ */ jsx63(Label3, { htmlFor: "pd-tags", children: "Palavras-chave / tags" }),
-        /* @__PURE__ */ jsx63(
+      /* @__PURE__ */ jsxs32("div", { className: "grid gap-2", children: [
+        /* @__PURE__ */ jsx64(Label3, { htmlFor: "pd-tags", children: "Palavras-chave / tags" }),
+        /* @__PURE__ */ jsx64(
           Input,
           {
             id: "pd-tags",
@@ -5001,11 +5380,11 @@ function PublishDrawer({
             disabled: busy
           }
         ),
-        /* @__PURE__ */ jsx63("p", { className: "text-xs text-muted-foreground", children: "Separadas por v\xEDrgula. A primeira vira a keyword." })
+        /* @__PURE__ */ jsx64("p", { className: "text-xs text-muted-foreground", children: "Separadas por v\xEDrgula. A primeira vira a keyword." })
       ] }),
-      /* @__PURE__ */ jsxs31("div", { className: "grid gap-2", children: [
-        /* @__PURE__ */ jsx63(Label3, { htmlFor: "pd-thumb", children: "Thumbnail" }),
-        /* @__PURE__ */ jsx63(
+      /* @__PURE__ */ jsxs32("div", { className: "grid gap-2", children: [
+        /* @__PURE__ */ jsx64(Label3, { htmlFor: "pd-thumb", children: "Thumbnail" }),
+        /* @__PURE__ */ jsx64(
           Input,
           {
             id: "pd-thumb",
@@ -5015,7 +5394,7 @@ function PublishDrawer({
             disabled: busy
           }
         ),
-        thumbnailTemplateId && /* @__PURE__ */ jsxs31(
+        thumbnailTemplateId && /* @__PURE__ */ jsxs32(
           Button,
           {
             type: "button",
@@ -5025,12 +5404,12 @@ function PublishDrawer({
             disabled: busy,
             className: "w-fit",
             children: [
-              status === "rendering-thumb" ? /* @__PURE__ */ jsx63(Loader2, { className: "mr-2 h-4 w-4 animate-spin" }) : /* @__PURE__ */ jsx63(ImageIcon, { className: "mr-2 h-4 w-4" }),
+              status === "rendering-thumb" ? /* @__PURE__ */ jsx64(Loader2, { className: "mr-2 h-4 w-4 animate-spin" }) : /* @__PURE__ */ jsx64(ImageIcon, { className: "mr-2 h-4 w-4" }),
               "Gerar via Thumbify"
             ]
           }
         ),
-        thumbnailUrl && /* @__PURE__ */ jsx63(
+        thumbnailUrl && /* @__PURE__ */ jsx64(
           "img",
           {
             src: thumbnailUrl,
@@ -5039,26 +5418,26 @@ function PublishDrawer({
           }
         )
       ] }),
-      /* @__PURE__ */ jsxs31("div", { className: "grid gap-2", children: [
-        /* @__PURE__ */ jsx63(Label3, { htmlFor: "pd-account", children: "Canal do YouTube" }),
-        /* @__PURE__ */ jsxs31(Select, { value: accountId ?? void 0, onValueChange: setAccountId, disabled: busy || accounts.length === 0, children: [
-          /* @__PURE__ */ jsx63(SelectTrigger, { id: "pd-account", children: /* @__PURE__ */ jsx63(
+      /* @__PURE__ */ jsxs32("div", { className: "grid gap-2", children: [
+        /* @__PURE__ */ jsx64(Label3, { htmlFor: "pd-account", children: "Canal do YouTube" }),
+        /* @__PURE__ */ jsxs32(Select, { value: accountId ?? void 0, onValueChange: setAccountId, disabled: busy || accounts.length === 0, children: [
+          /* @__PURE__ */ jsx64(SelectTrigger, { id: "pd-account", children: /* @__PURE__ */ jsx64(
             SelectValue,
             {
               placeholder: status === "loading-accounts" ? "Carregando canais\u2026" : accounts.length === 0 ? "Nenhum canal conectado" : "Selecione um canal"
             }
           ) }),
-          /* @__PURE__ */ jsx63(SelectContent, { children: accounts.map((a) => /* @__PURE__ */ jsx63(SelectItem, { value: a.account_id, children: a.account_name ?? a.account_id }, a.id)) })
+          /* @__PURE__ */ jsx64(SelectContent, { children: accounts.map((a) => /* @__PURE__ */ jsx64(SelectItem, { value: a.account_id, children: a.account_name ?? a.account_id }, a.id)) })
         ] })
       ] }),
-      errorMsg && /* @__PURE__ */ jsxs31("p", { className: "flex items-center gap-2 text-sm text-destructive", children: [
-        /* @__PURE__ */ jsx63(AlertCircle, { className: "h-4 w-4" }),
+      errorMsg && /* @__PURE__ */ jsxs32("p", { className: "flex items-center gap-2 text-sm text-destructive", children: [
+        /* @__PURE__ */ jsx64(AlertCircle, { className: "h-4 w-4" }),
         errorMsg
       ] }),
-      /* @__PURE__ */ jsxs31(SheetFooter, { className: "mt-auto", children: [
-        /* @__PURE__ */ jsx63(Button, { variant: "outline", onClick: () => onOpenChange(false), disabled: busy, children: "Cancelar" }),
-        /* @__PURE__ */ jsxs31(Button, { onClick: handlePublish, disabled: busy, children: [
-          status === "publishing" && /* @__PURE__ */ jsx63(Loader2, { className: "mr-2 h-4 w-4 animate-spin" }),
+      /* @__PURE__ */ jsxs32(SheetFooter, { className: "mt-auto", children: [
+        /* @__PURE__ */ jsx64(Button, { variant: "outline", onClick: () => onOpenChange(false), disabled: busy, children: "Cancelar" }),
+        /* @__PURE__ */ jsxs32(Button, { onClick: handlePublish, disabled: busy, children: [
+          status === "publishing" && /* @__PURE__ */ jsx64(Loader2, { className: "mr-2 h-4 w-4 animate-spin" }),
           "Publicar"
         ] })
       ] })
@@ -5074,9 +5453,9 @@ function useIframeAuth() {
 }
 
 // src/hooks/use-iframe-navigate.ts
-import { useCallback as useCallback7 } from "react";
+import { useCallback as useCallback8 } from "react";
 function useIframeNavigate() {
-  return useCallback7((path) => {
+  return useCallback8((path) => {
     if (!window.parent || window.parent === window) return;
     window.parent.postMessage(
       { type: "DFL_NAVIGATE", path },
@@ -5091,7 +5470,7 @@ import {
   useContext as useContext9,
   useMemo as useMemo5
 } from "react";
-import { jsx as jsx64 } from "react/jsx-runtime";
+import { jsx as jsx65 } from "react/jsx-runtime";
 var FeatureFlagContext = createContext8({
   flags: {},
   isEnabled: () => false
@@ -5107,7 +5486,7 @@ var FeatureFlagProvider = ({
     }),
     [flags]
   );
-  return /* @__PURE__ */ jsx64(FeatureFlagContext.Provider, { value, children });
+  return /* @__PURE__ */ jsx65(FeatureFlagContext.Provider, { value, children });
 };
 var useFeatureFlag = (flag) => {
   const { isEnabled } = useContext9(FeatureFlagContext);
@@ -5244,6 +5623,7 @@ export {
   FormItem,
   FormLabel,
   FormMessage,
+  Gantt,
   HoverCard,
   HoverCardContent,
   HoverCardTrigger,
@@ -5384,7 +5764,9 @@ export {
   UserAvatar,
   UserMenu,
   badgeVariants,
+  barGridColumn,
   buttonVariants,
+  clampPct,
   cn,
   filterPublishableAccounts,
   getInitials,
@@ -5396,6 +5778,9 @@ export {
   memberHueVar,
   navigationMenuTriggerStyle,
   parseTags,
+  resolveWeekCount,
+  resolveWeekLabels,
+  stageProgress,
   toast,
   toggleVariants,
   useAuth,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@devfellowship/components",
-  "version": "1.2.3",
+  "version": "1.3.0",
   "description": "DFL Design System — UI components, hooks, utils and providers",
   "type": "module",
   "sideEffects": [