@flamingo-stack/openframe-frontend-core 0.0.239 → 0.0.240

package/src/utils/content-ref-groups.ts

@@ -0,0 +1,89 @@
+/**
+ * Content Ref Group Configuration
+ *
+ * Single source of truth for grouping content_refs by type. Used by both:
+ *  - components/related-content (detail page rail — lives in this lib)
+ *  - the hub's lib/utils/investor-email-utils.ts (email builder, via the
+ *    hub's re-export shim at lib/config/content-ref-groups.ts)
+ *
+ * Lives in utils/ (server-safe tsup block) so hub server-side code can
+ * import it.
+ *
+ * Each entry carries the metadata RelatedContentSection needs to render the
+ * group WITHOUT re-implementing per-type logic locally:
+ *   - `label`: section heading.
+ *   - `order`: source-stable ordering (lowest first).
+ *   - `layout`: 'list' (one-per-row, full-width cards) or 'grid' (responsive
+ *     column grid).
+ *   - `gridSize`: card-size variant passed to the per-type card dispatch.
+ *     `'lg'` matches the canonical large-card variant openframe + flamingo
+ *     apps already use; `'default'` is the legacy denser variant. New types
+ *     should pick `'lg'` whenever the card has a large variant.
+ *
+ * Adding a new content type = one entry here. RelatedContentSection picks up
+ * the new group automatically (no hardcoded set to update). NOTE: the hub's
+ * related-content SUGGESTION candidate list is DERIVED from these keys (minus
+ * an explicit exclusion knob) — a new entry here becomes a suggestion
+ * candidate iff it also resolves through the hub's TYPE_TO_ENTITY → RAG
+ * config chain (unresolvable entries are dropped loudly at module load).
+ */
+
+export type ContentRefLayout = 'list' | 'grid'
+
+/** Subset of `EntityCardSize` (entity-card dispatch) appropriate for
+ *  grid/list rendering in RelatedContentSection. Duplicated as a literal
+ *  union here to avoid a config→component import cycle. Kept in lockstep
+ *  with `EntityCardSize`; widen here when a new size is added there. */
+export type ContentRefGridSize = 'lg' | 'default' | 'sm'
+
+export interface ContentRefGroupConfig {
+  label: string
+  order: number
+  layout: ContentRefLayout
+  gridSize: ContentRefGridSize
+}
+
+export const CONTENT_REF_GROUPS: Record<string, ContentRefGroupConfig> = {
+  investor_update:     { label: 'Investor Updates',    order: 1, layout: 'grid', gridSize: 'default' },
+  product_release:     { label: 'Product Releases',    order: 2, layout: 'list', gridSize: 'lg' },
+  podcast:             { label: 'Podcasts',            order: 3, layout: 'list', gridSize: 'default' },
+  webinar:             { label: 'Webinars',            order: 4, layout: 'list', gridSize: 'default' },
+  case_study:          { label: 'Case Studies',        order: 5, layout: 'grid', gridSize: 'default' },
+  event:               { label: 'Events',              order: 6, layout: 'list', gridSize: 'default' },
+  blog_post_existing:  { label: 'Blog Posts',          order: 7, layout: 'grid', gridSize: 'default' },
+  customer_interview:  { label: 'Customer Interviews', order: 8, layout: 'grid', gridSize: 'default' },
+  onboarding_guide:    { label: 'Onboarding Guides',   order: 9, layout: 'grid', gridSize: 'default' },
+}
+
+/** Human-readable label for a content_ref `type`. Returns null when the type
+ *  isn't registered — caller decides the fallback. Use `getContentRefLabelOrTitleCase`
+ *  to get a consistent title-cased fallback across all surfaces. */
+export function getContentRefLabel(type: string): string | null {
+  return CONTENT_REF_GROUPS[type]?.label ?? null
+}
+
+/** Resolved label with a single shared fallback shape — title-cased version
+ *  of the raw type string for any unregistered type. Both RelatedContentSection
+ *  AND the investor-email builder consume this so cross-surface label rendering
+ *  for unregistered types is identical (no drift between "podcast guest" and
+ *  "Podcast Guest"). */
+export function getContentRefLabelOrTitleCase(type: string): string {
+  return (
+    CONTENT_REF_GROUPS[type]?.label ??
+    type.replace(/_/g, ' ').replace(/\b\w/g, (ch) => ch.toUpperCase())
+  )
+}
+
+/** Sort a set of present content_ref types into the canonical group order
+ *  (registered types first in CONTENT_REF_GROUPS `order`, then unregistered
+ *  types appended in insertion order). Used by RelatedContentSection AND the
+ *  investor-email builder so cross-surface ordering stays identical. */
+export function orderContentRefTypes(present: Iterable<string>): string[] {
+  const presentSet = new Set(present)
+  const registeredInOrder = Object.entries(CONTENT_REF_GROUPS)
+    .sort(([, a], [, b]) => a.order - b.order)
+    .map(([type]) => type)
+    .filter((type) => presentSet.has(type))
+  const unregistered = [...presentSet].filter((type) => !CONTENT_REF_GROUPS[type])
+  return [...registeredInOrder, ...unregistered]
+}

package/src/utils/extract-items.ts

@@ -0,0 +1,48 @@
+/**
+ * List-API response normalizers — HOISTED from
+ * `components/chat/hooks/use-chat-card-item.ts` (private copies) so the
+ * related-content rail can import them WITHOUT touching the chat hooks
+ * chunk (which reaches `@tanstack/react-query`). Pure + server-safe.
+ *
+ * The hub's `lib/utils/entity-list-api.ts` re-exports these — one
+ * implementation of response-shape normalization across both repos.
+ */
+
+/** Extract the items array from each endpoint's response shape (some
+ *  return `{ items }`, others `{ posts }`, etc.). Single normalization
+ *  point — callers always read `Item[]`. */
+export function extractItems(data: unknown): unknown[] {
+  if (!data || typeof data !== 'object') return []
+  const obj = data as Record<string, unknown>
+  if (Array.isArray(obj.items)) return obj.items
+  if (Array.isArray(obj.posts)) return obj.posts
+  if (Array.isArray(obj.campaigns)) return obj.campaigns
+  if (Array.isArray(obj.completed) || Array.isArray(obj.inProgress)) {
+    // Delivery endpoint splits into completed/inProgress arrays — flatten.
+    const completed = Array.isArray(obj.completed) ? obj.completed : []
+    const inProgress = Array.isArray(obj.inProgress) ? obj.inProgress : []
+    return [...completed, ...inProgress]
+  }
+  if (Array.isArray(obj.data)) return obj.data
+  if (Array.isArray(data)) return data
+  return []
+}
+
+/** Extract a stable id from a fetched item — different shapes use
+ *  `id` vs `external_id`. Used by the chat loader to match the fetched
+ *  array element back to the marker's id. */
+export function extractItemId(type: string, item: unknown): string | null {
+  if (!item || typeof item !== 'object') return null
+  const obj = item as Record<string, unknown>
+  if (type === 'roadmap_item' || type === 'delivery_item' || type === 'internal_task') {
+    const ext = obj.external_id
+    if (typeof ext === 'string') return ext
+  }
+  // RoadmapItem-shaped responses use `id` to carry the external_id; the
+  // mapper renames external_id→id at the API boundary. Treat both id and
+  // external_id as primary-key candidates for these clickup-backed types.
+  const id = obj.id
+  if (typeof id === 'string') return id
+  if (typeof id === 'number') return String(id)
+  return null
+}

package/src/utils/index.ts

@@ -237,6 +237,21 @@ export {
 // Pure + server-safe (the hub imports it server-side from this barrel).
 export { buildListUrl } from './list-url'
 
+// Content-ref group registry (labels/order/layout per rail type) + list-API
+// response normalizers + the shared suggestion-fetch URL composer — all
+// pure + server-safe; the hub re-exports these from its config/util shims.
+export {
+  CONTENT_REF_GROUPS,
+  getContentRefLabel,
+  getContentRefLabelOrTitleCase,
+  orderContentRefTypes,
+  type ContentRefGroupConfig,
+  type ContentRefLayout,
+  type ContentRefGridSize,
+} from './content-ref-groups'
+export { extractItems, extractItemId } from './extract-items'
+export { buildSuggestionUrl, type SuggestionUrlOptions } from './suggestion-url'
+
 // Embedder-configurable content-URL composer for the existing
 // `runtime.composeContentUrl` seam — relative href for host-served types,
 // hub origin for the rest. Pure + server-safe.

package/src/utils/suggestion-url.ts

@@ -0,0 +1,39 @@
+/**
+ * Shared fetch-URL composer for the two suggestion sections (FaqSection +
+ * RelatedContentSection) — ONE owner of the entityType/entityId/count query
+ * shape so the sections can never drift. Pure + server-safe.
+ *
+ * Byte-parity contract with the original `buildFaqsUrl`: when only
+ * entityType/entityId are set, the param order is `entityType`, `entityId`;
+ * with nothing set, the bare `path` is returned (no `?`).
+ */
+export interface SuggestionUrlOptions {
+  /** Fetch-URL prefix for third-party embeds / reverse proxies
+   *  ('' = same-origin relative). */
+  apiBaseUrl?: string
+  /** Both required together for entity scope; partial → bare path. */
+  entityType?: string
+  entityId?: number | string
+  /** Maps to the server's `count` param. Undefined → param not sent
+   *  (server default applies). */
+  count?: number
+  /** Extra query params appended after the shared trio (e.g. the
+   *  related-content `excludeTypes` deny-list). Empty/undefined values
+   *  are skipped. */
+  extraParams?: Record<string, string | undefined>
+}
+
+export function buildSuggestionUrl(path: string, opts: SuggestionUrlOptions = {}): string {
+  const qs = new URLSearchParams()
+  const { entityType, entityId } = opts
+  if (entityType && entityId !== undefined && entityId !== null && entityId !== '') {
+    qs.set('entityType', entityType)
+    qs.set('entityId', String(entityId))
+  }
+  if (opts.count !== undefined) qs.set('count', String(opts.count))
+  for (const [key, value] of Object.entries(opts.extraParams ?? {})) {
+    if (value !== undefined && value !== '') qs.set(key, value)
+  }
+  const query = qs.toString()
+  return `${opts.apiBaseUrl ?? ''}${path}${query ? `?${query}` : ''}`
+}

package/dist/chunk-36G2QXYZ.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["/home/runner/work/openframe-oss-lib/openframe-oss-lib/openframe-frontend-core/dist/chunk-36G2QXYZ.cjs","../src/components/faq-accordion.tsx","../src/components/faq/faq-json-ld.ts","../src/components/faq/faq-section.tsx"],"names":["jsx"],"mappings":"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","file":"/home/runner/work/openframe-oss-lib/openframe-oss-lib/openframe-frontend-core/dist/chunk-36G2QXYZ.cjs","sourcesContent":[null,"\"use client\"\n\nimport React, { useRef, useState, useEffect, useCallback } from 'react'\nimport { ChevronButton } from './ui/chevron-button'\nimport { cn } from \"../utils/cn\"\n\nexport interface FaqItem {\n  id: number | string\n  question: string\n  answer: string\n}\n\ninterface FaqAccordionProps {\n  items: FaqItem[]\n  defaultOpenIds?: (number | string)[]\n}\n\n// Utility to measure scrollHeight outside render cycle\nconst useMeasuredHeight = (isOpen: boolean) => {\n  const ref = useRef<HTMLDivElement | null>(null)\n  const [maxHeight, setMaxHeight] = useState<string>('0px')\n\n  const measure = useCallback(() => {\n    if (ref.current) {\n      const height = ref.current.scrollHeight\n      setMaxHeight(`${height}px`)\n    }\n  }, [])\n\n  // Update height only when section is open\n  useEffect(() => {\n    if (isOpen) {\n      measure()\n    } else {\n      setMaxHeight('0px')\n    }\n  }, [isOpen, measure])\n\n  return { ref, maxHeight }\n}\n\nexport function FaqAccordion({ items, defaultOpenIds = [] }: FaqAccordionProps) {\n  const [openSet, setOpenSet] = useState<Set<string | number>>(new Set(defaultOpenIds))\n\n  const toggle = (id: string | number) => {\n    setOpenSet(prev => {\n      const next = new Set(prev)\n      if (next.has(id)) next.delete(id)\n      else next.add(id)\n      return next\n    })\n  }\n\n  return (\n    <div className=\"rounded-3xl border border-ods-border divide-y divide-ods-border bg-ods-card overflow-hidden\">\n      {items.map(item => {\n        const isOpen = openSet.has(item.id)\n        const { ref, maxHeight } = useMeasuredHeight(isOpen)\n\n        return (\n          <div\n            key={item.id}\n            className={cn('group transition-colors hover:bg-[#1E1E1E]', isOpen ? 'bg-ods-bg' : 'bg-transparent')}\n          >\n            {/* Header */}\n            <div\n              role=\"button\"\n              tabIndex={0}\n              onClick={() => toggle(item.id)}\n              onKeyDown={(e) => {\n                if (e.key === 'Enter' || e.key === ' ') {\n                  e.preventDefault();\n                  toggle(item.id);\n                }\n              }}\n              aria-expanded={isOpen}\n              className=\"flex w-full items-center justify-between px-6 md:px-8 py-6 text-left focus:outline-none transition-colors cursor-pointer\"\n            >\n              <h3>\n                {item.question}\n              </h3>\n              <div className=\"flex-shrink-0\" aria-label={isOpen ? 'Collapse question' : 'Expand question'}>\n                <ChevronButton\n                  size=\"md\"\n                  isExpanded={isOpen}\n                  backgroundColor=\"transparent\"\n                  borderColor=\"#3A3A3A\"\n                />\n              </div>\n            </div>\n            {/* Content wrapper with max-height animation */}\n            <div\n              style={{ maxHeight, transition: 'max-height 0.35s ease-in-out, opacity 0.35s ease-in-out', opacity: isOpen ? 1 : 0 }}\n              className=\"overflow-hidden group-hover:bg-[#1E1E1E]/30\"\n            >\n              <div ref={ref} className=\"px-6 md:px-8 pb-6 text-ods-text-primary text-h4\">\n                {item.answer}\n              </div>\n            </div>\n          </div>\n        )\n      })}\n    </div>\n  )\n} ","/**\n * Pure FAQ JSON-LD builder. No React, no client-only deps — safe to import from\n * Server Components via the `./components/faq` subpath export. (Do NOT import\n * through the root `./components` barrel — that barrel is `\"use client\"` and\n * dragging it into a Server Component would force the client graph into the\n * server.)\n *\n * The hub used to harcode `name`/`description` here for OpenMSP; in the lib we\n * accept overrides so every embedder can supply its own platform branding.\n */\nimport type { Faq } from '../../types/faq'\n\nexport interface FaqSchemaOptions {\n  name?: string\n  description?: string\n  url?: string\n}\n\nconst DEFAULT_NAME = 'Frequently Asked Questions'\nconst DEFAULT_DESCRIPTION =\n  'Answers to common questions.'\n\nexport function baseFaqSchema(opts: FaqSchemaOptions = {}) {\n  return {\n    '@context': 'https://schema.org',\n    '@type': 'FAQPage',\n    name: opts.name ?? DEFAULT_NAME,\n    description: opts.description ?? DEFAULT_DESCRIPTION,\n    ...(opts.url ? { url: opts.url } : {}),\n  } as const\n}\n\nexport function buildFaqJsonLdFromFaqs(faqs: Faq[], opts: FaqSchemaOptions = {}) {\n  return {\n    ...baseFaqSchema(opts),\n    mainEntity: faqs.map((faq) => ({\n      '@type': 'Question',\n      name: faq.question,\n      acceptedAnswer: {\n        '@type': 'Answer',\n        text: faq.answer,\n      },\n    })),\n  } as const\n}\n","\"use client\"\n\nimport React from 'react'\nimport type { Faq } from '../../types/faq'\nimport { FaqAccordion, type FaqItem } from '../faq-accordion'\nimport { useSelfFetch } from '../../hooks/use-self-fetch'\nimport { buildFaqJsonLdFromFaqs, type FaqSchemaOptions } from './faq-json-ld'\n\nexport interface FaqSectionProps {\n  /**\n   * SSR hydrate. When provided, the hook skips the first client fetch (per\n   * useSelfFetch contract). The consuming server page resolves FAQs then drills\n   * them into this prop — the lib never re-fetches what the host already gated on.\n   */\n  initialFaqs?: Faq[]\n  /** Both required together for entity-attached FAQs; partial → bare /api/faqs. */\n  entityType?: string\n  entityId?: number | string\n  /**\n   * Page heading. Pass null to render in embedded mode (no <h1>, error branch\n   * suppresses any banner). React node so platforms can drill their local\n   * <PageHeading> component without the lib referencing platform state.\n   */\n  heading?: React.ReactNode | null\n  /** Inject FAQPage schema.org JSON-LD as a <script>. Off by default so embeds\n   *  don't emit duplicate schema. */\n  emitJsonLd?: boolean\n  /** Overrides for the JSON-LD's name/description/url. */\n  jsonLd?: FaqSchemaOptions\n  className?: string\n}\n\nconst DEFAULT_HEADING_TEXT = 'Frequently Asked Questions'\n\nfunction buildFaqsUrl(entityType?: string, entityId?: number | string): string {\n  if (!entityType || entityId === undefined || entityId === null || entityId === '') {\n    return '/api/faqs'\n  }\n  const qs = new URLSearchParams({ entityType, entityId: String(entityId) })\n  return `/api/faqs?${qs.toString()}`\n}\n\nfunction groupBySection(faqs: Faq[]): Array<{ section: string | null; items: FaqItem[] }> {\n  const map = new Map<string, FaqItem[]>()\n  for (const faq of faqs) {\n    const key = faq.section || ''\n    let arr = map.get(key)\n    if (!arr) {\n      arr = []\n      map.set(key, arr)\n    }\n    arr.push({ id: faq.id, question: faq.question, answer: faq.answer })\n  }\n  return Array.from(map.entries()).map(([section, items]) => ({\n    section: section || null,\n    items,\n  }))\n}\n\nfunction FaqSkeleton() {\n  return (\n    <div className=\"space-y-8 animate-pulse\">\n      <div className=\"h-[48px] md:h-[56px] w-2/3 rounded bg-ods-border\" />\n      <div className=\"rounded-3xl border border-ods-border overflow-hidden bg-ods-card divide-y divide-ods-border w-full\">\n        {Array.from({ length: 8 }).map((_, idx) => (\n          <div key={idx} className=\"flex items-center justify-between px-6 md:px-8 py-6\">\n            <div className=\"h-6 w-5/6 rounded bg-ods-border\" />\n            <div className=\"h-10 w-10 rounded-md bg-ods-border\" />\n          </div>\n        ))}\n      </div>\n    </div>\n  )\n}\n\ninterface FaqsResponse {\n  faqs: Faq[]\n}\n\n/**\n * Generic, embeddable FAQ display surface.\n *\n * - Standalone /faqs page: pass `initialFaqs` from the server + `heading` +\n *   `emitJsonLd` with `jsonLd` overrides for SEO.\n * - Per-entity embed: pass `entityType` + `entityId` (no `initialFaqs`); the\n *   hook self-fetches and the public /api/faqs endpoint picks override-vs-fallback.\n *\n * CONTRACT: the consuming app MUST implement `GET /api/faqs`. Without it,\n * useSelfFetch reports `error:true` (logged once); in embedded mode (heading\n * === null) this component renders nothing so the host page isn't disfigured.\n */\nexport function FaqSection({\n  initialFaqs,\n  entityType,\n  entityId,\n  heading,\n  emitJsonLd = false,\n  jsonLd,\n  className,\n}: FaqSectionProps) {\n  const url = buildFaqsUrl(entityType, entityId)\n  const initialData = initialFaqs ? { faqs: initialFaqs } : undefined\n  const { data, isLoading, error } = useSelfFetch<FaqsResponse>(url, { initialData })\n\n  const faqs = data?.faqs ?? []\n  const showHeading = heading !== null\n  const headingNode =\n    heading === undefined\n      ? <h1 className=\"text-h1 tracking-[-0.04em] text-ods-text-primary\">{DEFAULT_HEADING_TEXT}</h1>\n      : heading\n\n  const groups = groupBySection(faqs)\n\n  // Embedded mode (no heading): degrade silently on error.\n  if (error && !showHeading) {\n    return null\n  }\n\n  if (isLoading && faqs.length === 0) {\n    return (\n      <main className={className ?? 'bg-ods-bg'}>\n        <div className=\"max-w-[1920px] px-6 md:px-20 py-6 md:py-10 mx-auto\">\n          <FaqSkeleton />\n        </div>\n      </main>\n    )\n  }\n\n  if (error && faqs.length === 0) {\n    return (\n      <main className={className ?? 'bg-ods-bg flex items-center justify-center py-20'}>\n        <p className=\"text-ods-text-primary font-medium\">Failed to load FAQs. Please try again later.</p>\n      </main>\n    )\n  }\n\n  const schema = emitJsonLd ? buildFaqJsonLdFromFaqs(faqs, jsonLd) : null\n\n  return (\n    <>\n      <main className={className ?? 'bg-ods-bg'}>\n        <div className=\"max-w-[1920px] px-6 md:px-20 py-6 md:py-10 mx-auto space-y-10\">\n          {showHeading && headingNode}\n          {groups.map(({ section, items }) => (\n            <div key={section || 'default'} className=\"space-y-4\">\n              {section && (\n                <h2 className=\"text-h2 tracking-[-0.04em] text-ods-text-primary mb-3 md:mb-4\">\n                  {section}\n                </h2>\n              )}\n              <FaqAccordion items={items} />\n            </div>\n          ))}\n        </div>\n      </main>\n      {schema && (\n        <script\n          type=\"application/ld+json\"\n          // eslint-disable-next-line react/no-danger\n          dangerouslySetInnerHTML={{ __html: JSON.stringify(schema) }}\n        />\n      )}\n    </>\n  )\n}\n"]}