@flamingo-stack/openframe-frontend-core 0.0.215 → 0.0.216

package/dist/chunk-GVNQAGXB.js

@@ -0,0 +1,232 @@
+"use client";
+import {
+  OPENFRAME_DEV_SECTIONS,
+  PageLayout,
+  PageShell,
+  SearchInput,
+  SquareAvatar,
+  StatusFilterComponent,
+  TicketAttachmentsList,
+  formatRelativeTime
+} from "./chunk-CDLYRFDE.js";
+import {
+  init_next_navigation,
+  usePathname,
+  useRouter,
+  useSearchParams
+} from "./chunk-PLJLE4A4.js";
+
+// src/components/shared/dev-section/dev-section-view.tsx
+import { useState, useEffect } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+function DevSectionView({ sectionKey, hero, preControls, children }) {
+  const section = OPENFRAME_DEV_SECTIONS[sectionKey];
+  const router = useRouter();
+  const pathname = usePathname();
+  const searchParams = useSearchParams();
+  const search = section.search;
+  const filter = section.filter;
+  const currentSearch = search ? searchParams.get(search.paramKey) || "" : "";
+  const currentFilterValue = filter ? searchParams.get(filter.paramKey) || filter.defaultValue : "";
+  const [searchValue, setSearchValue] = useState(() => currentSearch);
+  useEffect(() => {
+    setSearchValue(currentSearch);
+  }, [currentSearch]);
+  const handleSearchSubmit = (value) => {
+    if (!search) return;
+    const params = new URLSearchParams(searchParams.toString());
+    if (value.trim()) params.set(search.paramKey, value.trim());
+    else params.delete(search.paramKey);
+    router.replace(`${pathname}?${params.toString()}`, { scroll: false });
+  };
+  const handleFilterChange = (value) => {
+    if (!filter) return;
+    const params = new URLSearchParams(searchParams.toString());
+    if (value === filter.defaultValue) params.delete(filter.paramKey);
+    else params.set(filter.paramKey, value);
+    router.replace(`${pathname}?${params.toString()}`, { scroll: false });
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "w-full flex flex-col gap-10", children: [
+    hero ? /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
+      /* @__PURE__ */ jsxs("h1", { className: "text-h1 tracking-[-1.12px] text-ods-text-primary flex items-center gap-3", children: [
+        hero.icon,
+        section.hero.title
+      ] }),
+      /* @__PURE__ */ jsx("p", { className: "font-['DM_Sans'] font-medium text-[18px] leading-[28px] text-ods-text-secondary max-w-3xl", children: hero.description })
+    ] }) : /* @__PURE__ */ jsx("div", { className: "flex items-center justify-between w-full", children: /* @__PURE__ */ jsxs("h2", { className: "font-['Azeret_Mono'] font-semibold text-[32px] md:text-[40px] lg:text-[48px] leading-[40px] md:leading-[48px] lg:leading-[56px] text-ods-text-primary tracking-[-0.64px] md:tracking-[-0.8px] lg:tracking-[-0.96px]", children: [
+      section.hero.title,
+      /* @__PURE__ */ jsx("span", { className: "text-ods-accent", children: ":" })
+    ] }) }),
+    preControls,
+    (search || filter) && /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
+      search && /* @__PURE__ */ jsx(
+        SearchInput,
+        {
+          showDropdown: false,
+          placeholder: search.placeholder,
+          value: searchValue,
+          onChange: setSearchValue,
+          onSubmit: handleSearchSubmit
+        }
+      ),
+      filter && /* @__PURE__ */ jsx(
+        StatusFilterComponent,
+        {
+          selectedStatus: currentFilterValue,
+          onStatusChange: handleFilterChange,
+          statusOptions: [...filter.options]
+        }
+      )
+    ] }),
+    children
+  ] });
+}
+
+// src/components/shared/dev-section/dev-section-page.tsx
+init_next_navigation();
+import { jsx as jsx2 } from "react/jsx-runtime";
+var SECTION_HERO_ICON_CLASS = "h-10 w-10 text-ods-accent";
+function DevSectionPage({ sectionKey, children, preControls, backButton }) {
+  const router = useRouter();
+  const section = OPENFRAME_DEV_SECTIONS[sectionKey];
+  const Icon = section.icon;
+  const backCfg = backButton === false ? void 0 : {
+    label: (backButton ? backButton.label : void 0) ?? "Back to home",
+    onClick: () => router.push((backButton ? backButton.href : void 0) ?? "/")
+  };
+  return /* @__PURE__ */ jsx2(PageShell, { children: /* @__PURE__ */ jsx2(PageLayout, { backButton: backCfg, children: /* @__PURE__ */ jsx2(
+    DevSectionView,
+    {
+      sectionKey,
+      hero: {
+        icon: /* @__PURE__ */ jsx2(Icon, { className: SECTION_HERO_ICON_CLASS }),
+        description: section.hero.description
+      },
+      preControls,
+      children
+    }
+  ) }) });
+}
+
+// src/components/shared/dev-section/dev-card-row.tsx
+import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
+function DevCardRowContent({
+  title,
+  subtitle,
+  description,
+  emptyDescription = "No description provided",
+  rightBadges
+}) {
+  return /* @__PURE__ */ jsxs2("div", { className: "flex flex-col md:flex-row items-start justify-between gap-[12px] md:gap-[16px] w-full", children: [
+    /* @__PURE__ */ jsxs2("div", { className: "flex-1 min-w-0 w-full md:w-auto flex flex-col gap-[12px] md:gap-[16px]", children: [
+      /* @__PURE__ */ jsx3("div", { className: "min-h-[24px] flex items-center", children: /* @__PURE__ */ jsx3("h3", { className: "text-h3 text-ods-text-primary tracking-[-0.36px] flex-1 line-clamp-2 md:truncate break-words", children: title }) }),
+      /* @__PURE__ */ jsx3("div", { className: "min-h-[20px] flex items-center", children: /* @__PURE__ */ jsx3("p", { className: "text-h5 text-ods-text-secondary uppercase tracking-[-0.28px] truncate", children: subtitle }) }),
+      /* @__PURE__ */ jsx3("div", { className: "min-h-[72px] flex items-center", children: /* @__PURE__ */ jsx3("p", { className: "text-h4 text-ods-text-secondary line-clamp-3 break-words", children: description || emptyDescription }) })
+    ] }),
+    /* @__PURE__ */ jsx3("div", { className: "flex-shrink-0 self-start flex flex-col gap-2", children: rightBadges })
+  ] });
+}
+function ConversationCardRow({
+  author,
+  role,
+  avatarSrc,
+  timestamp,
+  body,
+  attachments,
+  variant = "support"
+}) {
+  const hasBody = body.trim().length > 0;
+  const hasAttachments = !!attachments && attachments.length > 0;
+  if (!hasBody && !hasAttachments) return null;
+  const relativeTime = timestamp ? formatRelativeTime(timestamp) : null;
+  return /* @__PURE__ */ jsxs2(
+    "article",
+    {
+      className: "border-b border-ods-border last:border-b-0 p-[12px] md:p-[16px] flex gap-[12px] md:gap-[16px] w-full",
+      "aria-label": `${author}${relativeTime ? ` \xB7 ${relativeTime}` : ""}`,
+      children: [
+        /* @__PURE__ */ jsx3(
+          SquareAvatar,
+          {
+            src: avatarSrc,
+            alt: author,
+            fallback: author,
+            size: "sm",
+            variant: "round"
+          }
+        ),
+        /* @__PURE__ */ jsxs2("div", { className: "flex-1 min-w-0 flex flex-col gap-[8px] md:gap-[12px]", children: [
+          /* @__PURE__ */ jsxs2("div", { className: "flex items-baseline justify-between gap-[8px] flex-wrap", children: [
+            /* @__PURE__ */ jsxs2("div", { className: "flex items-baseline gap-[8px] min-w-0", children: [
+              /* @__PURE__ */ jsx3("h3", { className: "text-h4 text-ods-text-primary truncate", children: author }),
+              role && /* @__PURE__ */ jsx3("span", { className: "text-h6 text-ods-text-secondary uppercase tracking-[-0.28px] shrink-0", children: role })
+            ] }),
+            relativeTime && /* @__PURE__ */ jsx3(
+              "time",
+              {
+                className: "text-h6 text-ods-text-secondary uppercase tracking-[-0.28px] shrink-0",
+                dateTime: timestamp ?? void 0,
+                title: timestamp ?? void 0,
+                children: relativeTime
+              }
+            )
+          ] }),
+          hasBody && /* @__PURE__ */ jsx3("p", { className: "text-h4 text-ods-text-primary whitespace-pre-wrap break-words", children: body }),
+          hasAttachments && /* @__PURE__ */ jsx3(TicketAttachmentsList, { attachments })
+        ] })
+      ]
+    }
+  );
+}
+function ConversationCardRowSkeleton() {
+  return /* @__PURE__ */ jsxs2("div", { className: "border-b border-ods-border last:border-b-0 p-[12px] md:p-[16px] flex gap-[12px] md:gap-[16px] w-full", children: [
+    /* @__PURE__ */ jsx3("div", { className: "h-8 w-8 shrink-0 rounded-full bg-ods-border animate-pulse" }),
+    /* @__PURE__ */ jsxs2("div", { className: "flex-1 min-w-0 flex flex-col gap-[8px] md:gap-[12px]", children: [
+      /* @__PURE__ */ jsxs2("div", { className: "flex items-baseline justify-between gap-[8px]", children: [
+        /* @__PURE__ */ jsxs2("div", { className: "flex items-baseline gap-[8px] flex-1", children: [
+          /* @__PURE__ */ jsx3("div", { className: "h-[24px] w-32 bg-ods-border rounded animate-pulse" }),
+          /* @__PURE__ */ jsx3("div", { className: "h-[20px] w-16 bg-ods-border rounded animate-pulse" })
+        ] }),
+        /* @__PURE__ */ jsx3("div", { className: "h-[20px] w-20 bg-ods-border rounded animate-pulse shrink-0" })
+      ] }),
+      /* @__PURE__ */ jsxs2("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsx3("div", { className: "h-[20px] w-full bg-ods-border rounded animate-pulse" }),
+        /* @__PURE__ */ jsx3("div", { className: "h-[20px] w-3/4 bg-ods-border rounded animate-pulse" })
+      ] })
+    ] })
+  ] });
+}
+function ConversationCardRowSkeletonList({ rows = 2 }) {
+  return /* @__PURE__ */ jsx3("div", { className: "bg-ods-card border border-ods-border rounded-[6px] overflow-hidden w-full", children: Array.from({ length: rows }, (_, i) => /* @__PURE__ */ jsx3(ConversationCardRowSkeleton, {}, i)) });
+}
+function DevCardRowSkeleton() {
+  return /* @__PURE__ */ jsx3("div", { className: "border-b border-ods-border last:border-b-0 p-[12px] md:p-[16px]", children: /* @__PURE__ */ jsxs2("div", { className: "flex flex-col md:flex-row items-start justify-between gap-[12px] md:gap-[16px] w-full", children: [
+    /* @__PURE__ */ jsxs2("div", { className: "flex-1 min-w-0 w-full md:w-auto flex flex-col gap-[12px] md:gap-[16px]", children: [
+      /* @__PURE__ */ jsx3("div", { className: "min-h-[24px] flex items-center", children: /* @__PURE__ */ jsx3("div", { className: "h-[20px] bg-ods-border rounded animate-pulse w-full" }) }),
+      /* @__PURE__ */ jsx3("div", { className: "min-h-[20px] flex items-center", children: /* @__PURE__ */ jsx3("div", { className: "h-[20px] bg-ods-border rounded animate-pulse w-1/2" }) }),
+      /* @__PURE__ */ jsx3("div", { className: "min-h-[72px] flex items-center", children: /* @__PURE__ */ jsxs2("div", { className: "flex-1 space-y-1", children: [
+        /* @__PURE__ */ jsx3("div", { className: "h-[20px] bg-ods-border rounded animate-pulse w-full" }),
+        /* @__PURE__ */ jsx3("div", { className: "h-[20px] bg-ods-border rounded animate-pulse w-full" }),
+        /* @__PURE__ */ jsx3("div", { className: "h-[20px] bg-ods-border rounded animate-pulse w-2/3" })
+      ] }) })
+    ] }),
+    /* @__PURE__ */ jsxs2("div", { className: "flex-shrink-0 self-start flex flex-col gap-2", children: [
+      /* @__PURE__ */ jsx3("div", { className: "h-[32px] w-[100px] bg-ods-border rounded animate-pulse" }),
+      /* @__PURE__ */ jsx3("div", { className: "h-[32px] w-[120px] bg-ods-border rounded animate-pulse" })
+    ] })
+  ] }) });
+}
+function DevCardRowSkeletonList({ rows = 5 }) {
+  return /* @__PURE__ */ jsx3("div", { className: "bg-ods-card border border-ods-border rounded-[6px] overflow-hidden w-full", children: Array.from({ length: rows }, (_, i) => /* @__PURE__ */ jsx3(DevCardRowSkeleton, {}, i)) });
+}
+
+export {
+  DevSectionView,
+  DevSectionPage,
+  DevCardRowContent,
+  ConversationCardRow,
+  ConversationCardRowSkeletonList,
+  DevCardRowSkeleton,
+  DevCardRowSkeletonList
+};
+//# sourceMappingURL=chunk-GVNQAGXB.js.map

package/dist/chunk-GVNQAGXB.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/shared/dev-section/dev-section-view.tsx","../src/components/shared/dev-section/dev-section-page.tsx","../src/components/shared/dev-section/dev-card-row.tsx"],"sourcesContent":["'use client';\n\n/**\n * DevSectionView — the canonical chrome for ANY dev-center section\n * (Roadmap / Delivery / Releases). One component, used in BOTH:\n *\n *   - tabbed `/roadmap-and-releases` (compact title mode, no `hero`)\n *   - full-page `/roadmap`, `/bug-fixes-and-enhancements`, `/releases`\n *     (hero mode with icon + description + back link)\n *\n * Owns: title rendering, the inline search input, the filter pill row,\n * and the URL-param wiring that connects both. The list `children`\n * receive a clean URL contract — they read `?<paramKey>=...` via\n * `useSearchParams()` and refetch on change. No duplicated controls.\n */\n\nimport type { ReactNode } from 'react';\nimport { useState, useEffect } from 'react';\nimport { useRouter, useSearchParams, usePathname } from '../../../embed-shims';\nimport { SearchInput } from '../../ui';\nimport { StatusFilterComponent } from '../../features';\nimport {\n  OPENFRAME_DEV_SECTIONS,\n  type OpenframeDevSectionKey,\n} from '../../../utils/dev-sections/openframe-dev-sections';\n\nexport interface DevSectionViewProps {\n  /** Which section to render — drives title, search, and filter\n   *  config via the `OPENFRAME_DEV_SECTIONS` registry. */\n  sectionKey: OpenframeDevSectionKey;\n  /** When set, renders the rich page-level hero (icon + h1 + description).\n   *  Omit for the compact tab-context heading. */\n  hero?: {\n    /** Pre-rendered icon JSX. Server components render the icon themselves\n     *  and pass the element here — function references can't cross the\n     *  server→client boundary, but React elements can. */\n    icon: ReactNode;\n    description: string;\n  };\n  /** Optional slot rendered BETWEEN the hero and the search/filter\n   *  controls. Use this for an entry-action surface that should sit\n   *  above the list (e.g. the Help Center's \"Open a new ticket\" form).\n   *  The slot is wrapped in the same `gap-10` flex column so spacing\n   *  matches the surrounding chrome — callers should NOT add their\n   *  own top/bottom margin. Renders `null` (no DOM) when omitted. */\n  preControls?: ReactNode;\n  /** The page-specific list body. Reads URL params written by this\n   *  component (search input + filter pills). */\n  children: ReactNode;\n}\n\nexport function DevSectionView({ sectionKey, hero, preControls, children }: DevSectionViewProps) {\n  const section = OPENFRAME_DEV_SECTIONS[sectionKey];\n  const router = useRouter();\n  const pathname = usePathname();\n  const searchParams = useSearchParams();\n\n  const search = section.search;\n  const filter = section.filter;\n\n  const currentSearch = search ? searchParams.get(search.paramKey) || '' : '';\n  const currentFilterValue = filter\n    ? searchParams.get(filter.paramKey) || filter.defaultValue\n    : '';\n\n  // Controlled search-input state — input commits to the URL only on\n  // Enter (not on every keystroke), preserving the legacy behavior.\n  // Lazy init from URL avoids a brief flash of stale value on first\n  // paint after URL-driven re-render (e.g. tab switch).\n  const [searchValue, setSearchValue] = useState(() => currentSearch);\n  useEffect(() => {\n    setSearchValue(currentSearch);\n  }, [currentSearch]);\n\n  const handleSearchSubmit = (value: string) => {\n    if (!search) return;\n    const params = new URLSearchParams(searchParams.toString());\n    if (value.trim()) params.set(search.paramKey, value.trim());\n    else params.delete(search.paramKey);\n    router.replace(`${pathname}?${params.toString()}`, { scroll: false });\n  };\n\n  const handleFilterChange = (value: string) => {\n    if (!filter) return;\n    const params = new URLSearchParams(searchParams.toString());\n    if (value === filter.defaultValue) params.delete(filter.paramKey);\n    else params.set(filter.paramKey, value);\n    router.replace(`${pathname}?${params.toString()}`, { scroll: false });\n  };\n\n  return (\n    <div className=\"w-full flex flex-col gap-10\">\n      {hero ? (\n        <div className=\"space-y-4\">\n          <h1 className=\"text-h1 tracking-[-1.12px] text-ods-text-primary flex items-center gap-3\">\n            {hero.icon}\n            {section.hero.title}\n          </h1>\n          <p className=\"font-['DM_Sans'] font-medium text-[18px] leading-[28px] text-ods-text-secondary max-w-3xl\">\n            {hero.description}\n          </p>\n        </div>\n      ) : (\n        <div className=\"flex items-center justify-between w-full\">\n          <h2 className=\"font-['Azeret_Mono'] font-semibold text-[32px] md:text-[40px] lg:text-[48px] leading-[40px] md:leading-[48px] lg:leading-[56px] text-ods-text-primary tracking-[-0.64px] md:tracking-[-0.8px] lg:tracking-[-0.96px]\">\n            {section.hero.title}\n            <span className=\"text-ods-accent\">:</span>\n          </h2>\n        </div>\n      )}\n\n      {preControls}\n\n      {(search || filter) && (\n        <div className=\"space-y-4\">\n          {search && (\n            <SearchInput\n              showDropdown={false}\n              placeholder={search.placeholder}\n              value={searchValue}\n              onChange={setSearchValue}\n              onSubmit={handleSearchSubmit}\n            />\n          )}\n          {filter && (\n            <StatusFilterComponent\n              selectedStatus={currentFilterValue}\n              onStatusChange={handleFilterChange}\n              statusOptions={[...filter.options]}\n            />\n          )}\n        </div>\n      )}\n\n      {children}\n    </div>\n  );\n}\n","'use client';\n\n/**\n * DevSectionPage — full-page wrapper for a dev-center section\n * (`/roadmap`, `/bug-fixes-and-enhancements`, `/releases`).\n *\n * Mounts the lib's canonical `PageLayout` directly (no in-app wrapper)\n * so the back-button affordance stays in lockstep with whatever the\n * design system ships — any future lib change to BackButton / TitleBlock\n * propagates automatically.\n *\n * Composition: `PageShell` → `PageLayout` (back-to-home wired) →\n * `DevSectionView` (icon hero + search + filter pills) → list body.\n *\n * Adding a new section is one entry in `OPENFRAME_DEV_SECTIONS` plus a\n * single-line page file mounting this factory with the new key.\n */\n\nimport type { ReactNode } from 'react';\nimport { useRouter } from '../../../embed-shims/next-navigation';\nimport { PageShell, PageLayout } from '../../ui';\nimport { DevSectionView } from './dev-section-view';\nimport {\n  OPENFRAME_DEV_SECTIONS,\n  type OpenframeDevSectionKey,\n} from '../../../utils/dev-sections/openframe-dev-sections';\n\nconst SECTION_HERO_ICON_CLASS = 'h-10 w-10 text-ods-accent';\n\nexport interface DevSectionPageProps {\n  sectionKey: OpenframeDevSectionKey;\n  /** The page-specific list body (e.g. `<RoadmapList />`). */\n  children: ReactNode;\n  /** Optional slot rendered BETWEEN the hero and search/filter — see\n   *  `DevSectionView.preControls`. Used by surfaces that want an entry\n   *  action (e.g. Help Center's \"Open a new ticket\" form) above the\n   *  controls instead of below them. */\n  preControls?: ReactNode;\n  /** Back-button config — same shape as `LegalDocumentPage` /\n   *  `ReleaseDetailPage`. Pass `false` to hide. Default\n   *  `{ label: 'Back to home', href: '/' }`. */\n  backButton?: { label?: string; href?: string } | false;\n}\n\nexport function DevSectionPage({ sectionKey, children, preControls, backButton }: DevSectionPageProps) {\n  const router = useRouter();\n  const section = OPENFRAME_DEV_SECTIONS[sectionKey];\n  const Icon = section.icon;\n\n  // Back-button config — mirrors LegalDocumentPage / ReleaseDetailPage.\n  // Default: { label: 'Back to home', href: '/' }. Pass `false` to hide.\n  // After `backButton &&` narrowing, inner type is `{ label?, href? } |\n  // undefined`; don't re-compare to `false` (TS2367).\n  const backCfg =\n    backButton === false\n      ? undefined\n      : {\n          label: (backButton ? backButton.label : undefined) ?? 'Back to home',\n          onClick: () => router.push((backButton ? backButton.href : undefined) ?? '/'),\n        };\n\n  return (\n    <PageShell>\n      <PageLayout backButton={backCfg}>\n        <DevSectionView\n          sectionKey={sectionKey}\n          hero={{\n            icon: <Icon className={SECTION_HERO_ICON_CLASS} />,\n            description: section.hero.description,\n          }}\n          preControls={preControls}\n        >\n          {children}\n        </DevSectionView>\n      </PageLayout>\n    </PageShell>\n  );\n}\n","'use client';\n\n/**\n * Shared row chrome for any `DevSectionPage` list (delivery, tickets,\n * future sections). One source of truth for the layout that every\n * dev-section card row uses:\n *   left column  → title (h3) / subtitle (h5 uppercase) / description\n *                  (h4 line-clamp-3), each in a fixed min-height block\n *                  so rows align across the grid\n *   right column → caller-supplied stacked badges\n *\n * Surface stays small on purpose — `rightBadges` is a `ReactNode` so\n * the caller decides how many badges (delivery: 2, tickets: 1-2,\n * future: anything). No behavior baked in: the caller wraps the row\n * in a `<div>` (static, like delivery) or `<button>` (clickable, like\n * tickets) and renders the row content via this component.\n *\n * Pair with `DevCardRowSkeletonList` for the loading state — the\n * skeleton mirrors the same min-heights so the in-flight UI doesn't\n * shift the layout when real data lands.\n */\n\nimport type { ReactNode } from 'react';\nimport { SquareAvatar } from '../../ui/square-avatar';\nimport {\n  TicketAttachmentsList,\n  type TicketAttachment,\n} from '../../ui/ticket-attachments-list';\nimport { formatRelativeTime } from '../../../utils/date-utils';\n\nexport interface DevCardRowContentProps {\n  title: string;\n  /** Single-line uppercase metadata (e.g. \"UPDATED today, #4271, Code review\"). */\n  subtitle: string;\n  /** 3-line description block. Empty string renders the fallback. */\n  description: string;\n  /** Fallback copy when `description` is empty. Defaults to a generic\n   *  string; ticket / delivery surfaces override. */\n  emptyDescription?: string;\n  /** Right column — caller renders its own stacked badges. */\n  rightBadges: ReactNode;\n}\n\nexport function DevCardRowContent({\n  title,\n  subtitle,\n  description,\n  emptyDescription = 'No description provided',\n  rightBadges,\n}: DevCardRowContentProps) {\n  return (\n    <div className=\"flex flex-col md:flex-row items-start justify-between gap-[12px] md:gap-[16px] w-full\">\n      <div className=\"flex-1 min-w-0 w-full md:w-auto flex flex-col gap-[12px] md:gap-[16px]\">\n        <div className=\"min-h-[24px] flex items-center\">\n          <h3 className=\"text-h3 text-ods-text-primary tracking-[-0.36px] flex-1 line-clamp-2 md:truncate break-words\">\n            {title}\n          </h3>\n        </div>\n        <div className=\"min-h-[20px] flex items-center\">\n          <p className=\"text-h5 text-ods-text-secondary uppercase tracking-[-0.28px] truncate\">\n            {subtitle}\n          </p>\n        </div>\n        <div className=\"min-h-[72px] flex items-center\">\n          <p className=\"text-h4 text-ods-text-secondary line-clamp-3 break-words\">\n            {description || emptyDescription}\n          </p>\n        </div>\n      </div>\n      <div className=\"flex-shrink-0 self-start flex flex-col gap-2\">\n        {rightBadges}\n      </div>\n    </div>\n  );\n}\n\n// ────────────────────────────────────────────────────────────────────────────\n// ConversationCardRow — sibling row variant for thread-style conversation\n// surfaces (ticket detail drawer, future inbox replies, etc.). Shares the\n// outer chrome (`border-b last:border-b-0 p-[12px] md:p-[16px]`) with\n// `DevCardRowContent` so a list mixing both variants stays visually\n// coherent. Internal layout differs because the data shape is different:\n// instead of title/subtitle/description + right-stacked badges, a\n// conversation message has an author (avatar + name + role + timestamp)\n// and a free-form body that should NOT be line-clamped, plus optional\n// attachments rendered via the shared `<TicketAttachmentsList>` so\n// download UX is identical to any other attachments surface in the lib.\n//\n// 2026 conversation-UI best practices applied (UXPin / Salesforce UX /\n// Coveo support-ticket research):\n//   - Author identity visible on every turn (avatar + name + role chip)\n//   - Threaded single-side layout — best for async business support,\n//     not alternating bubbles\n//   - Relative timestamp right-aligned, absolute on hover (`title` attr)\n//   - Body uses `whitespace-pre-wrap break-words` so multi-line replies\n//     and long URLs render without clipping\n//   - WCAG 2.2 contrast + 44×44 touch targets enforced by the shared\n//     `<TicketAttachmentsList>` download button\n// ────────────────────────────────────────────────────────────────────────────\n\nexport interface ConversationCardRowProps {\n  /** Display name of the message author. \"You\" for the current customer,\n   *  \"Support team\" for any non-customer engagement. */\n  author: string;\n  /** Optional short role label rendered as an inline chip beside the\n   *  author name — e.g. \"You\", \"Original message\", \"Resolution\". Keeps\n   *  the header line scannable on long threads. */\n  role?: string;\n  /** Avatar image URL. Falls back to `author` initials when missing\n   *  (initials derived by `<SquareAvatar>` via `getFirstLastInitials`). */\n  avatarSrc?: string;\n  /** ISO timestamp. Renders via `formatRelativeTime` with the absolute\n   *  string in the `title` for hover-precision. `null`/`undefined`\n   *  hides the timestamp entirely (e.g. the original ticket body which\n   *  shares the ticket's `created_at`). */\n  timestamp?: string | null;\n  /** Free-form message body. Empty string + zero attachments renders\n   *  nothing (the row is skipped at the caller level). */\n  body: string;\n  /** Files attached to this message. Rendered through the lib's\n   *  `<TicketAttachmentsList>` so the chip styling, file-icon picker\n   *  and download button match every other attachments surface. */\n  attachments?: TicketAttachment[];\n  /** Author bucket — kept for semantic markup + future styling needs.\n   *  Does NOT drive avatar color anymore: the avatar always renders\n   *  with the canonical `<SquareAvatar>` defaults (ODS palette,\n   *  derived by the component itself). Adding bespoke bg-color\n   *  overrides per role drifted from the ODS theme and was reverted. */\n  variant?: 'current-user' | 'support';\n}\n\nexport function ConversationCardRow({\n  author,\n  role,\n  avatarSrc,\n  timestamp,\n  body,\n  attachments,\n  variant = 'support',\n}: ConversationCardRowProps) {\n  const hasBody = body.trim().length > 0;\n  const hasAttachments = !!attachments && attachments.length > 0;\n  if (!hasBody && !hasAttachments) return null;\n\n  const relativeTime = timestamp ? formatRelativeTime(timestamp) : null;\n\n  return (\n    <article\n      className=\"border-b border-ods-border last:border-b-0 p-[12px] md:p-[16px] flex gap-[12px] md:gap-[16px] w-full\"\n      aria-label={`${author}${relativeTime ? ` · ${relativeTime}` : ''}`}\n    >\n      {/* Avatar — canonical `<SquareAvatar>` with NO className override.\n          Color, border, and fallback styling all come from the ODS\n          theme defaults (`bg-ods-bg` + `border-ods-border` +\n          `text-ods-text-primary`). Per-role bespoke colors\n          (bg-ods-flamingo-pink for customer / bg-ods-flamingo-cyan\n          for support) were tried + reverted — they drifted from the\n          standard theme and broke parity with other surfaces that\n          use SquareAvatar without overrides (assignee-dropdown,\n          ticket-info-section). */}\n      <SquareAvatar\n        src={avatarSrc}\n        alt={author}\n        fallback={author}\n        size=\"sm\"\n        variant=\"round\"\n      />\n\n      <div className=\"flex-1 min-w-0 flex flex-col gap-[8px] md:gap-[12px]\">\n        {/* Header row — author + optional role chip on the left,\n            relative time on the right. The header collapses cleanly on\n            narrow viewports by wrapping. */}\n        <div className=\"flex items-baseline justify-between gap-[8px] flex-wrap\">\n          <div className=\"flex items-baseline gap-[8px] min-w-0\">\n            <h3 className=\"text-h4 text-ods-text-primary truncate\">{author}</h3>\n            {role && (\n              <span className=\"text-h6 text-ods-text-secondary uppercase tracking-[-0.28px] shrink-0\">\n                {role}\n              </span>\n            )}\n          </div>\n          {relativeTime && (\n            <time\n              className=\"text-h6 text-ods-text-secondary uppercase tracking-[-0.28px] shrink-0\"\n              dateTime={timestamp ?? undefined}\n              title={timestamp ?? undefined}\n            >\n              {relativeTime}\n            </time>\n          )}\n        </div>\n\n        {/* Body — full message, no line-clamp. `pre-wrap` preserves\n            authored line breaks; `break-words` handles long URLs. */}\n        {hasBody && (\n          <p className=\"text-h4 text-ods-text-primary whitespace-pre-wrap break-words\">\n            {body}\n          </p>\n        )}\n\n        {/* Attachments — delegated to the canonical lib component so\n            every file-attachment surface (chat, drawer, future inbox)\n            shares the same chip styling + download UX. */}\n        {hasAttachments && <TicketAttachmentsList attachments={attachments!} />}\n      </div>\n    </article>\n  );\n}\n\n/**\n * Skeleton variant matching `ConversationCardRow`'s layout. Used by\n * the ticket-detail-drawer's timeline panel while engagements load —\n * mirrors avatar + header + body so the loading→loaded swap doesn't\n * reshape the row vertically.\n */\nexport function ConversationCardRowSkeleton() {\n  return (\n    <div className=\"border-b border-ods-border last:border-b-0 p-[12px] md:p-[16px] flex gap-[12px] md:gap-[16px] w-full\">\n      {/* Avatar — matches SquareAvatar size=\"sm\" (32px) used by the\n          real row. Round to match `variant=\"round\"`. */}\n      <div className=\"h-8 w-8 shrink-0 rounded-full bg-ods-border animate-pulse\" />\n      <div className=\"flex-1 min-w-0 flex flex-col gap-[8px] md:gap-[12px]\">\n        {/* Header row — author + role chip + timestamp placeholders. */}\n        <div className=\"flex items-baseline justify-between gap-[8px]\">\n          <div className=\"flex items-baseline gap-[8px] flex-1\">\n            <div className=\"h-[24px] w-32 bg-ods-border rounded animate-pulse\" />\n            <div className=\"h-[20px] w-16 bg-ods-border rounded animate-pulse\" />\n          </div>\n          <div className=\"h-[20px] w-20 bg-ods-border rounded animate-pulse shrink-0\" />\n        </div>\n        {/* Body — two-line placeholder. */}\n        <div className=\"space-y-2\">\n          <div className=\"h-[20px] w-full bg-ods-border rounded animate-pulse\" />\n          <div className=\"h-[20px] w-3/4 bg-ods-border rounded animate-pulse\" />\n        </div>\n      </div>\n    </div>\n  );\n}\n\n/** Multi-row skeleton list — drop-in for the conversation timeline's\n *  loading state. Defaults to 2 rows so the placeholder fits in a\n *  reasonable vertical footprint without dominating the drawer. */\nexport function ConversationCardRowSkeletonList({ rows = 2 }: { rows?: number }) {\n  return (\n    <div className=\"bg-ods-card border border-ods-border rounded-[6px] overflow-hidden w-full\">\n      {Array.from({ length: rows }, (_, i) => (\n        <ConversationCardRowSkeleton key={i} />\n      ))}\n    </div>\n  );\n}\n\n/**\n * Skeleton rendering for a single row — the bars mirror the same\n * min-heights as `DevCardRowContent` so the loading→loaded swap\n * doesn't reflow.\n */\nexport function DevCardRowSkeleton() {\n  return (\n    <div className=\"border-b border-ods-border last:border-b-0 p-[12px] md:p-[16px]\">\n      <div className=\"flex flex-col md:flex-row items-start justify-between gap-[12px] md:gap-[16px] w-full\">\n        <div className=\"flex-1 min-w-0 w-full md:w-auto flex flex-col gap-[12px] md:gap-[16px]\">\n          <div className=\"min-h-[24px] flex items-center\">\n            <div className=\"h-[20px] bg-ods-border rounded animate-pulse w-full\" />\n          </div>\n          <div className=\"min-h-[20px] flex items-center\">\n            <div className=\"h-[20px] bg-ods-border rounded animate-pulse w-1/2\" />\n          </div>\n          <div className=\"min-h-[72px] flex items-center\">\n            <div className=\"flex-1 space-y-1\">\n              <div className=\"h-[20px] bg-ods-border rounded animate-pulse w-full\" />\n              <div className=\"h-[20px] bg-ods-border rounded animate-pulse w-full\" />\n              <div className=\"h-[20px] bg-ods-border rounded animate-pulse w-2/3\" />\n            </div>\n          </div>\n        </div>\n        <div className=\"flex-shrink-0 self-start flex flex-col gap-2\">\n          <div className=\"h-[32px] w-[100px] bg-ods-border rounded animate-pulse\" />\n          <div className=\"h-[32px] w-[120px] bg-ods-border rounded animate-pulse\" />\n        </div>\n      </div>\n    </div>\n  );\n}\n\n/**\n * The standard \"5 skeleton rows inside a bordered card\" loading state\n * used by every list shell. Both delivery (`delivery-table.tsx`) and\n * tickets (`tickets-list.tsx`) mount this directly.\n */\nexport function DevCardRowSkeletonList({ rows = 5 }: { rows?: number }) {\n  return (\n    <div className=\"bg-ods-card border border-ods-border rounded-[6px] overflow-hidden w-full\">\n      {Array.from({ length: rows }, (_, i) => (\n        <DevCardRowSkeleton key={i} />\n      ))}\n    </div>\n  );\n}\n"],"mappings":"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","names":["jsx","jsx","jsxs"]}

package/dist/{chunk-P5EE2VJX.cjs → chunk-HOHDXYPR.cjs}

@@ -21,4 +21,4 @@ function useRequiredChatRuntime() {
 
 
 exports.ChatRuntimeContext = ChatRuntimeContext; exports.useChatRuntime = useChatRuntime; exports.useRequiredChatRuntime = useRequiredChatRuntime;
-//# sourceMappingURL=chunk-P5EE2VJX.cjs.map
+//# sourceMappingURL=chunk-HOHDXYPR.cjs.map

package/dist/chunk-HOHDXYPR.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/home/runner/work/openframe-oss-lib/openframe-oss-lib/openframe-frontend-core/dist/chunk-HOHDXYPR.cjs","../src/contexts/chat-runtime-context.tsx"],"names":[],"mappings":"AAAA,qFAAY;AACZ;AACA;ACiCA,8BAA0D;AA0InD,IAAM,mBAAA,EAAqB,kCAAA,IAAsC,CAAA;AAQjE,SAAS,cAAA,CAAA,EAAqC;AACnD,EAAA,OAAO,+BAAA,kBAA6B,CAAA;AACtC;AAUO,SAAS,sBAAA,CAAA,EAAsC;AACpD,EAAA,MAAM,EAAA,EAAI,+BAAA,kBAA6B,CAAA;AACvC,EAAA,GAAA,CAAI,CAAC,CAAA,EAAG;AACN,IAAA,MAAM,IAAI,KAAA;AAAA,MACR;AAAA,IAMF,CAAA;AAAA,EACF;AACA,EAAA,OAAO,CAAA;AACT;AD7LA;AACA;AACE;AACA;AACA;AACF,kJAAC","file":"/home/runner/work/openframe-oss-lib/openframe-oss-lib/openframe-frontend-core/dist/chunk-HOHDXYPR.cjs","sourcesContent":[null,"'use client'\n\n/**\n * Chat runtime context — single seam for embedding the chat panel in a\n * different host (e.g. user1.openframe.ai reverse-proxying API calls\n * under /api/mingo-guide/* to hub.openframe.ai/api/*).\n *\n * Three concerns, one context:\n *   1. API endpoints: chatStreamUrl / approvalToolUrl / commandsUrl /\n *      buildListUrl + attachment endpoints + chat-identity. The chat\n *      reads them from runtime; hub vs embedded app supply different\n *      strings via different providers.\n *   2. Navigation mode + callbacks: 'host' or 'embed' mode. Host wires\n *      its own router/docNav via the optional `navigate` callback\n *      (plain function, NOT a hook); embed forces new-tab via\n *      `defaultContentOrigin` + lib's `resolveExternalNavigation`.\n *   3. Identity context: only `source` (required for localStorage\n *      namespacing). The display identity (greeting first-name etc.)\n *      comes from the server via `useChatIdentity()` — never injected\n *      client-side, so it always matches the server-resolved auth.\n *\n * Sibling of EndpointsRuntimeContext (announcement bar, contact form,\n * access codes). Each runtime stays an independent React context so\n * embedders can opt into either feature without forcing the other.\n *\n * IMPORTANT for embedders: memoize the value passed to\n * `<ChatRuntimeContext.Provider value={...}>` (e.g. via React.useMemo).\n * Every change to its reference identity invalidates downstream\n * `useMemo` consumers (the chat input's slash-commands binding,\n * useNavLink's embed-resolution memo, useDocChat's streamFn factory).\n * The hub's `<HubRuntimeProvider>` already memoizes correctly with\n * stable deps. Embedded apps that build the value inline on each render\n * will pay an avoidable re-render cost across the entire chat tree.\n */\n\nimport { createContext, useContext, type ReactNode } from 'react'\n\n/**\n * Runtime config consumed by the chat panel.\n */\nexport interface ChatRuntime {\n  endpoints: {\n    /** POST streaming chat. Hub: '/api/docs/chat'. */\n    chatStreamUrl: string\n    /** POST agent approve/reject. Hub: '/api/chat/agent/confirm-tool'. */\n    approvalToolUrl: string\n    /** GET slash-command catalog. Hub: '/api/docs/commands'. */\n    commandsUrl: string\n    /** Build entity-card list URL for a content type + ids. Hub delegates\n     *  to the rag-table-config registry; embedded app provides its own\n     *  per-type URL builder against the reverse proxy. Returns null when\n     *  the type has no list endpoint (caller skips rendering). */\n    buildListUrl: (type: string, ids: string[]) => string | null\n    /** Chat-attachment endpoints — added for the v2 attachment feature.\n     *\n     *  Three concerns:\n     *    - `attachmentUploadUrl` — POSTed by the chat-attachment hook\n     *      to mint a Supabase signed-upload-URL + HMAC view token.\n     *    - `attachmentViewUrlPrefix` — embedded in markdown URLs the\n     *      chat hosts in user message bubbles (`![]()` / `[Attached]`).\n     *      Stored in chat history; chosen at SEND time. In host mode the\n     *      relative `/api/storage/view/chat-attachments/` is sufficient\n     *      (same-origin); embedders supply an absolute hub URL so the\n     *      browser can fetch cross-origin.\n     *    - `identityUrl` — GET endpoint the `useChatIdentity` hook\n     *      hits to learn the `{authTier, source, attachmentsEnabled}`\n     *      capability bag for the current session. Used beyond chat\n     *      (tickets / contact form / any embedded surface that needs\n     *      to identify the proxied customer), so the name has no\n     *      \"chat\" prefix even though the consuming hook still does. */\n    attachmentUploadUrl: string\n    attachmentViewUrlPrefix: string\n    identityUrl: string\n    /** Optional URL prefix for the image proxy (`<prefix>?url=<external>`).\n     *  When unset, lib's `getProxiedImageUrl` returns the original URL\n     *  unchanged. Hub default: '/api/image-proxy'. Embedders that don't\n     *  host an image-proxy route leave this undefined → images load\n     *  directly cross-origin (CORS-permitting). */\n    imageProxyUrlPrefix?: string\n    /** Optional list of hostnames that should bypass the image proxy\n     *  (rendered direct). Hub uses ['openmsp.ai']; embedders typically\n     *  leave it unset. Matches the `skipDomains` parameter of\n     *  `getProxiedImageUrl`. */\n    imageProxySkipDomains?: string[]\n    /** Supabase storage origin (e.g. `https://xyz.supabase.co`) — used\n     *  by `useVideoWarmup` to scope the `<link rel=\"preload\" as=\"video\">`\n     *  hint to MP4s the deployment actually hosts. Hub wires it via\n     *  `getSupabaseStorageOrigin()`; embedders without a Supabase\n     *  storage origin leave it unset (preload is then skipped; Mux/\n     *  YouTube preconnect still fires). */\n    supabaseStorageOrigin?: string\n  }\n  navigation: {\n    /** ONE knob, two behaviors:\n     *  - 'host' = use the host page's existing click-routing untouched.\n     *    The chat panel calls `navigate?.()` for in-app routing.\n     *  - 'embed' = guest inside another app: short-circuit at the top\n     *    of click handlers to force new-tab + absolutize via\n     *    resolveExternalNavigation. */\n    mode: 'host' | 'embed'\n    /** Embed-only fallback origin for relative URLs whose target platform\n     *  can't be inferred. Used by resolveExternalNavigation when\n     *  `targetPlatform` is null — without this, a relative `/foo` href would\n     *  window.open against the embedder's origin, which is WRONG.\n     *  Set to your content host (e.g. 'https://hub.openframe.ai').\n     *  Required by the embedded app whenever mode='embed'. */\n    defaultContentOrigin?: string\n    /** Override for opening external URLs. MUST BE SYNCHRONOUS —\n     *  Safari/Firefox block popups opened outside a direct user gesture.\n     *  Default: window.open(href, '_blank', 'noopener,noreferrer'). */\n    openExternal?: (href: string) => void\n    /** Optional in-app navigation callback (host-mode only).\n     *  Returns `true` if the host handled the click in-app\n     *  (router.push + docNav.navigate); returns `false`, `undefined`,\n     *  or `void` → lib falls back to window.location.assign(href).\n     *  Hub wires this via HubRuntimeProvider's HubNavigationWiring;\n     *  embedders not in Next.js leave it undefined. */\n    navigate?: (input: { href: string; path?: string | null; targetPlatform?: string | null }) => boolean | void\n    /** Optional new-tab decision callback. Returns true → lib opens in\n     *  new tab; false → same tab via `navigate`. Hub wires the existing\n     *  `decideNewTab` logic from use-nav-link.tsx (re-imports the pure\n     *  helper from lib). Embedders may omit; lib defaults to:\n     *  same-origin/same-platform → same tab, else new tab. */\n    decideNewTab?: (args: { href: string; targetPlatform?: string | null }) => boolean\n  }\n  /** Optional OG placeholder URL builder. Returns a branded\n   *  `/api/og-placeholder?...` URL for the given title. Hub wires this\n   *  to its `buildOgPlaceholderUrl` (resolves CSS-var ODS colors to\n   *  hex via the static map). Embedders can wire any equivalent that\n   *  hits their own placeholder route — or omit, in which case entity\n   *  cards fall back to no placeholder.\n   *\n   *  Pure synchronous function — NOT a hook. Callers wrap with\n   *  `useMemo`/`useOgPlaceholder` for memoization. */\n  resolvePlaceholderUrl?: (\n    title: string,\n    options?: { site?: string; aspect?: 'wide' | 'square' },\n  ) => string\n  /** Optional content-URL composer. Returns the platform-aware href +\n   *  target-platform tuple for a content entity. Hub wires this to its\n   *  `buildContentURL(type, slug, extractPrimaryPlatform(platforms))`\n   *  pipeline so the lib catalog/detail views can derive cross-\n   *  platform hrefs without knowing the hub's platform topology\n   *  (openmsp.ai / openframe.app / flamingo.run / tmcg).\n   *\n   *  Embedders that don't host multi-platform content can wire this to\n   *  a simple `(type, slug) => ({ href: '/' + type + '/' + slug,\n   *  targetPlatform: null })` — or omit, in which case lib views fall\n   *  back to a same-origin relative path with `targetPlatform: null`.\n   *\n   *  `platforms` is the entity's flattened junction array (e.g.\n   *  `guide.onboarding_guide_platforms`) — the callback runs\n   *  `extractPrimaryPlatform` internally before dispatching to its\n   *  composer. */\n  composeContentUrl?: (\n    type: string,\n    slug: string,\n    platforms?: Array<{ name?: string }>,\n  ) => { href: string; targetPlatform: string | null }\n  /** Chat source identifier — REQUIRED. Used for localStorage\n   *  namespacing (`mingo-chat-<source>-v1`). Hub sets via\n   *  `currentPlatform()`; embedders set explicitly.\n   *  `useEmbeddedChat()` throws if source is empty/missing. */\n  source: string\n  // NOTE: No `user` field. The chat's display identity (greeting\n  // first-name, etc.) comes from the SERVER-resolved auth via\n  // `useChatIdentity()` — the same identity the server uses to\n  // authorize requests. Letting embedders pass a client-side `user`\n  // would let it desync from the actual auth tier, causing greetings\n  // like \"Hey Bob\" while the server treats the session as\n  // alice@example.com. Single source of truth: the server.\n}\n\nexport const ChatRuntimeContext = createContext<ChatRuntime | null>(null)\n\n/**\n * Returns the active runtime, or null when no provider is mounted.\n * NULL is a first-class value — it signals \"no chat runtime configured.\"\n * Optional consumers fall back to no-op behavior; strict consumers\n * use `useRequiredChatRuntime` (below).\n */\nexport function useChatRuntime(): ChatRuntime | null {\n  return useContext(ChatRuntimeContext)\n}\n\n/**\n * Strict variant used INSIDE the chat panel. Throws if no provider.\n * The hub guarantees one exists by mounting `<HubRuntimeProvider>` at\n * root; the embedded app mounts its own `<ChatRuntimeContext.Provider>`\n * at the tree root. In Jest / Storybook tests that render chat\n * internals directly, wrap with `<HubRuntimeProvider>` (hub defaults)\n * or supply `<ChatRuntimeContext.Provider value={mockedRuntime}>`.\n */\nexport function useRequiredChatRuntime(): ChatRuntime {\n  const v = useContext(ChatRuntimeContext)\n  if (!v) {\n    throw new Error(\n      '[chat-runtime] hook called outside a <ChatRuntimeContext.Provider>. ' +\n        'The hub mounts <HubRuntimeProvider> at root — this only fires when ' +\n        'chat internals are rendered above the provider tree. ' +\n        'Fix: ensure the rendering subtree descends from the runtime provider. ' +\n        'In tests/Storybook: wrap with <HubRuntimeProvider> or supply ' +\n        'a <ChatRuntimeContext.Provider value={mockedRuntime}>.',\n    )\n  }\n  return v\n}\n"]}

package/dist/chunk-IH76P5R6.cjs

@@ -0,0 +1,232 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } }"use client";
+
+
+
+
+
+
+
+
+
+var _chunkZGTDUPTWcjs = require('./chunk-ZGTDUPTW.cjs');
+
+
+
+
+
+var _chunkG7UE6RKVcjs = require('./chunk-G7UE6RKV.cjs');
+
+// src/components/shared/dev-section/dev-section-view.tsx
+var _react = require('react');
+var _jsxruntime = require('react/jsx-runtime');
+function DevSectionView({ sectionKey, hero, preControls, children }) {
+  const section = _chunkZGTDUPTWcjs.OPENFRAME_DEV_SECTIONS[sectionKey];
+  const router = _chunkG7UE6RKVcjs.useRouter.call(void 0, );
+  const pathname = _chunkG7UE6RKVcjs.usePathname.call(void 0, );
+  const searchParams = _chunkG7UE6RKVcjs.useSearchParams.call(void 0, );
+  const search = section.search;
+  const filter = section.filter;
+  const currentSearch = search ? searchParams.get(search.paramKey) || "" : "";
+  const currentFilterValue = filter ? searchParams.get(filter.paramKey) || filter.defaultValue : "";
+  const [searchValue, setSearchValue] = _react.useState.call(void 0, () => currentSearch);
+  _react.useEffect.call(void 0, () => {
+    setSearchValue(currentSearch);
+  }, [currentSearch]);
+  const handleSearchSubmit = (value) => {
+    if (!search) return;
+    const params = new URLSearchParams(searchParams.toString());
+    if (value.trim()) params.set(search.paramKey, value.trim());
+    else params.delete(search.paramKey);
+    router.replace(`${pathname}?${params.toString()}`, { scroll: false });
+  };
+  const handleFilterChange = (value) => {
+    if (!filter) return;
+    const params = new URLSearchParams(searchParams.toString());
+    if (value === filter.defaultValue) params.delete(filter.paramKey);
+    else params.set(filter.paramKey, value);
+    router.replace(`${pathname}?${params.toString()}`, { scroll: false });
+  };
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "w-full flex flex-col gap-10", children: [
+    hero ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "space-y-4", children: [
+      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "h1", { className: "text-h1 tracking-[-1.12px] text-ods-text-primary flex items-center gap-3", children: [
+        hero.icon,
+        section.hero.title
+      ] }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "font-['DM_Sans'] font-medium text-[18px] leading-[28px] text-ods-text-secondary max-w-3xl", children: hero.description })
+    ] }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex items-center justify-between w-full", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "h2", { className: "font-['Azeret_Mono'] font-semibold text-[32px] md:text-[40px] lg:text-[48px] leading-[40px] md:leading-[48px] lg:leading-[56px] text-ods-text-primary tracking-[-0.64px] md:tracking-[-0.8px] lg:tracking-[-0.96px]", children: [
+      section.hero.title,
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "text-ods-accent", children: ":" })
+    ] }) }),
+    preControls,
+    (search || filter) && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "space-y-4", children: [
+      search && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        _chunkZGTDUPTWcjs.SearchInput,
+        {
+          showDropdown: false,
+          placeholder: search.placeholder,
+          value: searchValue,
+          onChange: setSearchValue,
+          onSubmit: handleSearchSubmit
+        }
+      ),
+      filter && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        _chunkZGTDUPTWcjs.StatusFilterComponent,
+        {
+          selectedStatus: currentFilterValue,
+          onStatusChange: handleFilterChange,
+          statusOptions: [...filter.options]
+        }
+      )
+    ] }),
+    children
+  ] });
+}
+
+// src/components/shared/dev-section/dev-section-page.tsx
+_chunkG7UE6RKVcjs.init_next_navigation.call(void 0, );
+
+var SECTION_HERO_ICON_CLASS = "h-10 w-10 text-ods-accent";
+function DevSectionPage({ sectionKey, children, preControls, backButton }) {
+  const router = _chunkG7UE6RKVcjs.useRouter.call(void 0, );
+  const section = _chunkZGTDUPTWcjs.OPENFRAME_DEV_SECTIONS[sectionKey];
+  const Icon = section.icon;
+  const backCfg = backButton === false ? void 0 : {
+    label: _nullishCoalesce((backButton ? backButton.label : void 0), () => ( "Back to home")),
+    onClick: () => router.push(_nullishCoalesce((backButton ? backButton.href : void 0), () => ( "/")))
+  };
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkZGTDUPTWcjs.PageShell, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkZGTDUPTWcjs.PageLayout, { backButton: backCfg, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    DevSectionView,
+    {
+      sectionKey,
+      hero: {
+        icon: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Icon, { className: SECTION_HERO_ICON_CLASS }),
+        description: section.hero.description
+      },
+      preControls,
+      children
+    }
+  ) }) });
+}
+
+// src/components/shared/dev-section/dev-card-row.tsx
+
+function DevCardRowContent({
+  title,
+  subtitle,
+  description,
+  emptyDescription = "No description provided",
+  rightBadges
+}) {
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col md:flex-row items-start justify-between gap-[12px] md:gap-[16px] w-full", children: [
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex-1 min-w-0 w-full md:w-auto flex flex-col gap-[12px] md:gap-[16px]", children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "min-h-[24px] flex items-center", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "h3", { className: "text-h3 text-ods-text-primary tracking-[-0.36px] flex-1 line-clamp-2 md:truncate break-words", children: title }) }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "min-h-[20px] flex items-center", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "text-h5 text-ods-text-secondary uppercase tracking-[-0.28px] truncate", children: subtitle }) }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "min-h-[72px] flex items-center", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "text-h4 text-ods-text-secondary line-clamp-3 break-words", children: description || emptyDescription }) })
+    ] }),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex-shrink-0 self-start flex flex-col gap-2", children: rightBadges })
+  ] });
+}
+function ConversationCardRow({
+  author,
+  role,
+  avatarSrc,
+  timestamp,
+  body,
+  attachments,
+  variant = "support"
+}) {
+  const hasBody = body.trim().length > 0;
+  const hasAttachments = !!attachments && attachments.length > 0;
+  if (!hasBody && !hasAttachments) return null;
+  const relativeTime = timestamp ? _chunkZGTDUPTWcjs.formatRelativeTime.call(void 0, timestamp) : null;
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+    "article",
+    {
+      className: "border-b border-ods-border last:border-b-0 p-[12px] md:p-[16px] flex gap-[12px] md:gap-[16px] w-full",
+      "aria-label": `${author}${relativeTime ? ` \xB7 ${relativeTime}` : ""}`,
+      children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          _chunkZGTDUPTWcjs.SquareAvatar,
+          {
+            src: avatarSrc,
+            alt: author,
+            fallback: author,
+            size: "sm",
+            variant: "round"
+          }
+        ),
+        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex-1 min-w-0 flex flex-col gap-[8px] md:gap-[12px]", children: [
+          /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-baseline justify-between gap-[8px] flex-wrap", children: [
+            /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-baseline gap-[8px] min-w-0", children: [
+              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "h3", { className: "text-h4 text-ods-text-primary truncate", children: author }),
+              role && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "text-h6 text-ods-text-secondary uppercase tracking-[-0.28px] shrink-0", children: role })
+            ] }),
+            relativeTime && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+              "time",
+              {
+                className: "text-h6 text-ods-text-secondary uppercase tracking-[-0.28px] shrink-0",
+                dateTime: _nullishCoalesce(timestamp, () => ( void 0)),
+                title: _nullishCoalesce(timestamp, () => ( void 0)),
+                children: relativeTime
+              }
+            )
+          ] }),
+          hasBody && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "text-h4 text-ods-text-primary whitespace-pre-wrap break-words", children: body }),
+          hasAttachments && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkZGTDUPTWcjs.TicketAttachmentsList, { attachments })
+        ] })
+      ]
+    }
+  );
+}
+function ConversationCardRowSkeleton() {
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "border-b border-ods-border last:border-b-0 p-[12px] md:p-[16px] flex gap-[12px] md:gap-[16px] w-full", children: [
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-8 w-8 shrink-0 rounded-full bg-ods-border animate-pulse" }),
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex-1 min-w-0 flex flex-col gap-[8px] md:gap-[12px]", children: [
+      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-baseline justify-between gap-[8px]", children: [
+        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-baseline gap-[8px] flex-1", children: [
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[24px] w-32 bg-ods-border rounded animate-pulse" }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[20px] w-16 bg-ods-border rounded animate-pulse" })
+        ] }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[20px] w-20 bg-ods-border rounded animate-pulse shrink-0" })
+      ] }),
+      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "space-y-2", children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[20px] w-full bg-ods-border rounded animate-pulse" }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[20px] w-3/4 bg-ods-border rounded animate-pulse" })
+      ] })
+    ] })
+  ] });
+}
+function ConversationCardRowSkeletonList({ rows = 2 }) {
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "bg-ods-card border border-ods-border rounded-[6px] overflow-hidden w-full", children: Array.from({ length: rows }, (_, i) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ConversationCardRowSkeleton, {}, i)) });
+}
+function DevCardRowSkeleton() {
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "border-b border-ods-border last:border-b-0 p-[12px] md:p-[16px]", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col md:flex-row items-start justify-between gap-[12px] md:gap-[16px] w-full", children: [
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex-1 min-w-0 w-full md:w-auto flex flex-col gap-[12px] md:gap-[16px]", children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "min-h-[24px] flex items-center", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[20px] bg-ods-border rounded animate-pulse w-full" }) }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "min-h-[20px] flex items-center", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[20px] bg-ods-border rounded animate-pulse w-1/2" }) }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "min-h-[72px] flex items-center", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex-1 space-y-1", children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[20px] bg-ods-border rounded animate-pulse w-full" }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[20px] bg-ods-border rounded animate-pulse w-full" }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[20px] bg-ods-border rounded animate-pulse w-2/3" })
+      ] }) })
+    ] }),
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex-shrink-0 self-start flex flex-col gap-2", children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[32px] w-[100px] bg-ods-border rounded animate-pulse" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[32px] w-[120px] bg-ods-border rounded animate-pulse" })
+    ] })
+  ] }) });
+}
+function DevCardRowSkeletonList({ rows = 5 }) {
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "bg-ods-card border border-ods-border rounded-[6px] overflow-hidden w-full", children: Array.from({ length: rows }, (_, i) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DevCardRowSkeleton, {}, i)) });
+}
+
+
+
+
+
+
+
+
+
+exports.DevSectionView = DevSectionView; exports.DevSectionPage = DevSectionPage; exports.DevCardRowContent = DevCardRowContent; exports.ConversationCardRow = ConversationCardRow; exports.ConversationCardRowSkeletonList = ConversationCardRowSkeletonList; exports.DevCardRowSkeleton = DevCardRowSkeleton; exports.DevCardRowSkeletonList = DevCardRowSkeletonList;
+//# sourceMappingURL=chunk-IH76P5R6.cjs.map