@flamingo-stack/openframe-frontend-core 0.0.237 → 0.0.238
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{chunk-LPJPTBRI.cjs → chunk-27VVOBDB.cjs} +4 -4
- package/dist/{chunk-LPJPTBRI.cjs.map → chunk-27VVOBDB.cjs.map} +1 -1
- package/dist/{chunk-LIRVOF26.cjs → chunk-5VU66BD2.cjs} +204 -239
- package/dist/chunk-5VU66BD2.cjs.map +1 -0
- package/dist/{chunk-GXSTRY72.js → chunk-7LLS3TWN.js} +6 -66
- package/dist/chunk-7LLS3TWN.js.map +1 -0
- package/dist/chunk-DOM4KWZ7.cjs +207 -0
- package/dist/chunk-DOM4KWZ7.cjs.map +1 -0
- package/dist/{chunk-RZSXPIEF.cjs → chunk-ELMYRGWG.cjs} +9 -9
- package/dist/{chunk-RZSXPIEF.cjs.map → chunk-ELMYRGWG.cjs.map} +1 -1
- package/dist/chunk-FSS2MIEA.cjs +44 -0
- package/dist/chunk-FSS2MIEA.cjs.map +1 -0
- package/dist/{chunk-THUANWCX.js → chunk-G6YZ7O27.js} +3 -3
- package/dist/{chunk-NZRHLJE2.cjs → chunk-IJOJWBME.cjs} +28 -28
- package/dist/{chunk-NZRHLJE2.cjs.map → chunk-IJOJWBME.cjs.map} +1 -1
- package/dist/chunk-L4LAAA5Q.js +65 -0
- package/dist/chunk-L4LAAA5Q.js.map +1 -0
- package/dist/chunk-LJGBFD52.js +44 -0
- package/dist/chunk-LJGBFD52.js.map +1 -0
- package/dist/chunk-M3I6ZPOM.js +207 -0
- package/dist/chunk-M3I6ZPOM.js.map +1 -0
- package/dist/{chunk-366P5YXP.cjs → chunk-MTROCWO4.cjs} +7 -7
- package/dist/{chunk-366P5YXP.cjs.map → chunk-MTROCWO4.cjs.map} +1 -1
- package/dist/{chunk-QP6NU6OL.js → chunk-PN64LWNT.js} +2 -2
- package/dist/{chunk-THCYW34H.cjs → chunk-SZ3BBI6H.cjs} +15 -75
- package/dist/chunk-SZ3BBI6H.cjs.map +1 -0
- package/dist/chunk-T7AJBKZP.cjs +65 -0
- package/dist/chunk-T7AJBKZP.cjs.map +1 -0
- package/dist/{chunk-Q3GY66ST.js → chunk-UECRKCKH.js} +4 -4
- package/dist/{chunk-L3UM4VMU.js → chunk-Y6463TD6.js} +2 -2
- package/dist/{chunk-H3TM4YY7.js → chunk-Y7DCQUNL.js} +2016 -2051
- package/dist/{chunk-H3TM4YY7.js.map → chunk-Y7DCQUNL.js.map} +1 -1
- package/dist/components/chat/index.cjs +6 -5
- package/dist/components/chat/index.cjs.map +1 -1
- package/dist/components/chat/index.js +5 -4
- package/dist/components/contact/index.cjs +7 -6
- package/dist/components/contact/index.cjs.map +1 -1
- package/dist/components/contact/index.js +6 -5
- package/dist/components/faq/faq-json-ld.d.ts +39 -0
- package/dist/components/faq/faq-json-ld.d.ts.map +1 -0
- package/dist/components/faq/faq-section.d.ts +40 -0
- package/dist/components/faq/faq-section.d.ts.map +1 -0
- package/dist/components/faq/index.cjs +16 -0
- package/dist/components/faq/index.cjs.map +1 -0
- package/dist/components/faq/index.d.ts +3 -0
- package/dist/components/faq/index.d.ts.map +1 -0
- package/dist/components/faq/index.js +16 -0
- package/dist/components/faq/index.js.map +1 -0
- package/dist/components/features/index.cjs +6 -5
- package/dist/components/features/index.cjs.map +1 -1
- package/dist/components/features/index.js +5 -4
- package/dist/components/index.cjs +97 -167
- package/dist/components/index.cjs.map +1 -1
- package/dist/components/index.d.ts +1 -0
- package/dist/components/index.d.ts.map +1 -1
- package/dist/components/index.js +1066 -1136
- package/dist/components/index.js.map +1 -1
- package/dist/components/navigation/index.cjs +6 -5
- package/dist/components/navigation/index.cjs.map +1 -1
- package/dist/components/navigation/index.js +5 -4
- package/dist/components/onboarding-guides/index.cjs +34 -31
- package/dist/components/onboarding-guides/index.cjs.map +1 -1
- package/dist/components/onboarding-guides/index.js +12 -9
- package/dist/components/onboarding-guides/index.js.map +1 -1
- package/dist/components/tickets/index.cjs +70 -69
- package/dist/components/tickets/index.cjs.map +1 -1
- package/dist/components/tickets/index.js +8 -7
- package/dist/components/tickets/index.js.map +1 -1
- package/dist/components/ui/index.cjs +8 -6
- package/dist/components/ui/index.cjs.map +1 -1
- package/dist/components/ui/index.js +7 -5
- package/dist/hooks/index.cjs +3 -3
- package/dist/hooks/index.js +2 -2
- package/dist/index.cjs +8 -6
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +7 -5
- package/package.json +7 -1
- package/src/components/faq/faq-json-ld.ts +45 -0
- package/src/components/faq/faq-section.tsx +165 -0
- package/src/components/faq/index.ts +2 -0
- package/src/components/faq-accordion.tsx +1 -1
- package/src/components/index.ts +4 -0
- package/dist/chunk-GXSTRY72.js.map +0 -1
- package/dist/chunk-LIRVOF26.cjs.map +0 -1
- package/dist/chunk-THCYW34H.cjs.map +0 -1
- /package/dist/{chunk-THUANWCX.js.map → chunk-G6YZ7O27.js.map} +0 -0
- /package/dist/{chunk-QP6NU6OL.js.map → chunk-PN64LWNT.js.map} +0 -0
- /package/dist/{chunk-Q3GY66ST.js.map → chunk-UECRKCKH.js.map} +0 -0
- /package/dist/{chunk-L3UM4VMU.js.map → chunk-Y6463TD6.js.map} +0 -0
|
@@ -0,0 +1,207 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import {
|
|
3
|
+
useSelfFetch
|
|
4
|
+
} from "./chunk-L4LAAA5Q.js";
|
|
5
|
+
import {
|
|
6
|
+
ChevronButton
|
|
7
|
+
} from "./chunk-LJGBFD52.js";
|
|
8
|
+
import {
|
|
9
|
+
cn,
|
|
10
|
+
init_cn
|
|
11
|
+
} from "./chunk-XTCBRQN2.js";
|
|
12
|
+
|
|
13
|
+
// src/components/faq-accordion.tsx
|
|
14
|
+
import { useRef, useState, useEffect, useCallback } from "react";
|
|
15
|
+
init_cn();
|
|
16
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
17
|
+
var useMeasuredHeight = (isOpen) => {
|
|
18
|
+
const ref = useRef(null);
|
|
19
|
+
const [maxHeight, setMaxHeight] = useState("0px");
|
|
20
|
+
const measure = useCallback(() => {
|
|
21
|
+
if (ref.current) {
|
|
22
|
+
const height = ref.current.scrollHeight;
|
|
23
|
+
setMaxHeight(`${height}px`);
|
|
24
|
+
}
|
|
25
|
+
}, []);
|
|
26
|
+
useEffect(() => {
|
|
27
|
+
if (isOpen) {
|
|
28
|
+
measure();
|
|
29
|
+
} else {
|
|
30
|
+
setMaxHeight("0px");
|
|
31
|
+
}
|
|
32
|
+
}, [isOpen, measure]);
|
|
33
|
+
return { ref, maxHeight };
|
|
34
|
+
};
|
|
35
|
+
function FaqAccordion({ items, defaultOpenIds = [] }) {
|
|
36
|
+
const [openSet, setOpenSet] = useState(new Set(defaultOpenIds));
|
|
37
|
+
const toggle = (id) => {
|
|
38
|
+
setOpenSet((prev) => {
|
|
39
|
+
const next = new Set(prev);
|
|
40
|
+
if (next.has(id)) next.delete(id);
|
|
41
|
+
else next.add(id);
|
|
42
|
+
return next;
|
|
43
|
+
});
|
|
44
|
+
};
|
|
45
|
+
return /* @__PURE__ */ jsx("div", { className: "rounded-3xl border border-ods-border divide-y divide-ods-border bg-ods-card overflow-hidden", children: items.map((item) => {
|
|
46
|
+
const isOpen = openSet.has(item.id);
|
|
47
|
+
const { ref, maxHeight } = useMeasuredHeight(isOpen);
|
|
48
|
+
return /* @__PURE__ */ jsxs(
|
|
49
|
+
"div",
|
|
50
|
+
{
|
|
51
|
+
className: cn("group transition-colors hover:bg-[#1E1E1E]", isOpen ? "bg-ods-bg" : "bg-transparent"),
|
|
52
|
+
children: [
|
|
53
|
+
/* @__PURE__ */ jsxs(
|
|
54
|
+
"div",
|
|
55
|
+
{
|
|
56
|
+
role: "button",
|
|
57
|
+
tabIndex: 0,
|
|
58
|
+
onClick: () => toggle(item.id),
|
|
59
|
+
onKeyDown: (e) => {
|
|
60
|
+
if (e.key === "Enter" || e.key === " ") {
|
|
61
|
+
e.preventDefault();
|
|
62
|
+
toggle(item.id);
|
|
63
|
+
}
|
|
64
|
+
},
|
|
65
|
+
"aria-expanded": isOpen,
|
|
66
|
+
className: "flex w-full items-center justify-between px-6 md:px-8 py-6 text-left focus:outline-none transition-colors cursor-pointer",
|
|
67
|
+
children: [
|
|
68
|
+
/* @__PURE__ */ jsx("h3", { children: item.question }),
|
|
69
|
+
/* @__PURE__ */ jsx("div", { className: "flex-shrink-0", "aria-label": isOpen ? "Collapse question" : "Expand question", children: /* @__PURE__ */ jsx(
|
|
70
|
+
ChevronButton,
|
|
71
|
+
{
|
|
72
|
+
size: "md",
|
|
73
|
+
isExpanded: isOpen,
|
|
74
|
+
backgroundColor: "transparent",
|
|
75
|
+
borderColor: "#3A3A3A"
|
|
76
|
+
}
|
|
77
|
+
) })
|
|
78
|
+
]
|
|
79
|
+
}
|
|
80
|
+
),
|
|
81
|
+
/* @__PURE__ */ jsx(
|
|
82
|
+
"div",
|
|
83
|
+
{
|
|
84
|
+
style: { maxHeight, transition: "max-height 0.35s ease-in-out, opacity 0.35s ease-in-out", opacity: isOpen ? 1 : 0 },
|
|
85
|
+
className: "overflow-hidden group-hover:bg-[#1E1E1E]/30",
|
|
86
|
+
children: /* @__PURE__ */ jsx("div", { ref, className: "px-6 md:px-8 pb-6 text-ods-text-primary text-h4", children: item.answer })
|
|
87
|
+
}
|
|
88
|
+
)
|
|
89
|
+
]
|
|
90
|
+
},
|
|
91
|
+
item.id
|
|
92
|
+
);
|
|
93
|
+
}) });
|
|
94
|
+
}
|
|
95
|
+
|
|
96
|
+
// src/components/faq/faq-json-ld.ts
|
|
97
|
+
var DEFAULT_NAME = "Frequently Asked Questions";
|
|
98
|
+
var DEFAULT_DESCRIPTION = "Answers to common questions.";
|
|
99
|
+
function baseFaqSchema(opts = {}) {
|
|
100
|
+
return {
|
|
101
|
+
"@context": "https://schema.org",
|
|
102
|
+
"@type": "FAQPage",
|
|
103
|
+
name: opts.name ?? DEFAULT_NAME,
|
|
104
|
+
description: opts.description ?? DEFAULT_DESCRIPTION,
|
|
105
|
+
...opts.url ? { url: opts.url } : {}
|
|
106
|
+
};
|
|
107
|
+
}
|
|
108
|
+
function buildFaqJsonLdFromFaqs(faqs, opts = {}) {
|
|
109
|
+
return {
|
|
110
|
+
...baseFaqSchema(opts),
|
|
111
|
+
mainEntity: faqs.map((faq) => ({
|
|
112
|
+
"@type": "Question",
|
|
113
|
+
name: faq.question,
|
|
114
|
+
acceptedAnswer: {
|
|
115
|
+
"@type": "Answer",
|
|
116
|
+
text: faq.answer
|
|
117
|
+
}
|
|
118
|
+
}))
|
|
119
|
+
};
|
|
120
|
+
}
|
|
121
|
+
|
|
122
|
+
// src/components/faq/faq-section.tsx
|
|
123
|
+
import { Fragment, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
124
|
+
var DEFAULT_HEADING_TEXT = "Frequently Asked Questions";
|
|
125
|
+
function buildFaqsUrl(entityType, entityId) {
|
|
126
|
+
if (!entityType || entityId === void 0 || entityId === null || entityId === "") {
|
|
127
|
+
return "/api/faqs";
|
|
128
|
+
}
|
|
129
|
+
const qs = new URLSearchParams({ entityType, entityId: String(entityId) });
|
|
130
|
+
return `/api/faqs?${qs.toString()}`;
|
|
131
|
+
}
|
|
132
|
+
function groupBySection(faqs) {
|
|
133
|
+
const map = /* @__PURE__ */ new Map();
|
|
134
|
+
for (const faq of faqs) {
|
|
135
|
+
const key = faq.section || "";
|
|
136
|
+
let arr = map.get(key);
|
|
137
|
+
if (!arr) {
|
|
138
|
+
arr = [];
|
|
139
|
+
map.set(key, arr);
|
|
140
|
+
}
|
|
141
|
+
arr.push({ id: faq.id, question: faq.question, answer: faq.answer });
|
|
142
|
+
}
|
|
143
|
+
return Array.from(map.entries()).map(([section, items]) => ({
|
|
144
|
+
section: section || null,
|
|
145
|
+
items
|
|
146
|
+
}));
|
|
147
|
+
}
|
|
148
|
+
function FaqSkeleton() {
|
|
149
|
+
return /* @__PURE__ */ jsxs2("div", { className: "space-y-8 animate-pulse", children: [
|
|
150
|
+
/* @__PURE__ */ jsx2("div", { className: "h-[48px] md:h-[56px] w-2/3 rounded bg-ods-border" }),
|
|
151
|
+
/* @__PURE__ */ jsx2("div", { className: "rounded-3xl border border-ods-border overflow-hidden bg-ods-card divide-y divide-ods-border w-full", children: Array.from({ length: 8 }).map((_, idx) => /* @__PURE__ */ jsxs2("div", { className: "flex items-center justify-between px-6 md:px-8 py-6", children: [
|
|
152
|
+
/* @__PURE__ */ jsx2("div", { className: "h-6 w-5/6 rounded bg-ods-border" }),
|
|
153
|
+
/* @__PURE__ */ jsx2("div", { className: "h-10 w-10 rounded-md bg-ods-border" })
|
|
154
|
+
] }, idx)) })
|
|
155
|
+
] });
|
|
156
|
+
}
|
|
157
|
+
function FaqSection({
|
|
158
|
+
initialFaqs,
|
|
159
|
+
entityType,
|
|
160
|
+
entityId,
|
|
161
|
+
heading,
|
|
162
|
+
emitJsonLd = false,
|
|
163
|
+
jsonLd,
|
|
164
|
+
className
|
|
165
|
+
}) {
|
|
166
|
+
const url = buildFaqsUrl(entityType, entityId);
|
|
167
|
+
const initialData = initialFaqs ? { faqs: initialFaqs } : void 0;
|
|
168
|
+
const { data, isLoading, error } = useSelfFetch(url, { initialData });
|
|
169
|
+
const faqs = data?.faqs ?? [];
|
|
170
|
+
const showHeading = heading !== null;
|
|
171
|
+
const headingNode = heading === void 0 ? /* @__PURE__ */ jsx2("h1", { className: "text-h1 tracking-[-0.04em] text-ods-text-primary", children: DEFAULT_HEADING_TEXT }) : heading;
|
|
172
|
+
const groups = groupBySection(faqs);
|
|
173
|
+
if (error && !showHeading) {
|
|
174
|
+
return null;
|
|
175
|
+
}
|
|
176
|
+
if (isLoading && faqs.length === 0) {
|
|
177
|
+
return /* @__PURE__ */ jsx2("main", { className: className ?? "bg-ods-bg", children: /* @__PURE__ */ jsx2("div", { className: "max-w-[1920px] px-6 md:px-20 py-6 md:py-10 mx-auto", children: /* @__PURE__ */ jsx2(FaqSkeleton, {}) }) });
|
|
178
|
+
}
|
|
179
|
+
if (error && faqs.length === 0) {
|
|
180
|
+
return /* @__PURE__ */ jsx2("main", { className: className ?? "bg-ods-bg flex items-center justify-center py-20", children: /* @__PURE__ */ jsx2("p", { className: "text-ods-text-primary font-medium", children: "Failed to load FAQs. Please try again later." }) });
|
|
181
|
+
}
|
|
182
|
+
const schema = emitJsonLd ? buildFaqJsonLdFromFaqs(faqs, jsonLd) : null;
|
|
183
|
+
return /* @__PURE__ */ jsxs2(Fragment, { children: [
|
|
184
|
+
/* @__PURE__ */ jsx2("main", { className: className ?? "bg-ods-bg", children: /* @__PURE__ */ jsxs2("div", { className: "max-w-[1920px] px-6 md:px-20 py-6 md:py-10 mx-auto space-y-10", children: [
|
|
185
|
+
showHeading && headingNode,
|
|
186
|
+
groups.map(({ section, items }) => /* @__PURE__ */ jsxs2("div", { className: "space-y-4", children: [
|
|
187
|
+
section && /* @__PURE__ */ jsx2("h2", { className: "text-h2 tracking-[-0.04em] text-ods-text-primary mb-3 md:mb-4", children: section }),
|
|
188
|
+
/* @__PURE__ */ jsx2(FaqAccordion, { items })
|
|
189
|
+
] }, section || "default"))
|
|
190
|
+
] }) }),
|
|
191
|
+
schema && /* @__PURE__ */ jsx2(
|
|
192
|
+
"script",
|
|
193
|
+
{
|
|
194
|
+
type: "application/ld+json",
|
|
195
|
+
dangerouslySetInnerHTML: { __html: JSON.stringify(schema) }
|
|
196
|
+
}
|
|
197
|
+
)
|
|
198
|
+
] });
|
|
199
|
+
}
|
|
200
|
+
|
|
201
|
+
export {
|
|
202
|
+
FaqAccordion,
|
|
203
|
+
baseFaqSchema,
|
|
204
|
+
buildFaqJsonLdFromFaqs,
|
|
205
|
+
FaqSection
|
|
206
|
+
};
|
|
207
|
+
//# sourceMappingURL=chunk-M3I6ZPOM.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/faq-accordion.tsx","../src/components/faq/faq-json-ld.ts","../src/components/faq/faq-section.tsx"],"sourcesContent":["\"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"],"mappings":"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","names":["jsx","jsxs"]}
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
|
|
6
6
|
|
|
7
7
|
|
|
8
|
-
var
|
|
8
|
+
var _chunk5VU66BD2cjs = require('./chunk-5VU66BD2.cjs');
|
|
9
9
|
|
|
10
10
|
|
|
11
11
|
|
|
@@ -17,7 +17,7 @@ var _chunkG7UE6RKVcjs = require('./chunk-G7UE6RKV.cjs');
|
|
|
17
17
|
var _react = require('react');
|
|
18
18
|
var _jsxruntime = require('react/jsx-runtime');
|
|
19
19
|
function DevSectionView({ sectionKey, hero, preControls, children }) {
|
|
20
|
-
const section =
|
|
20
|
+
const section = _chunk5VU66BD2cjs.OPENFRAME_DEV_SECTIONS[sectionKey];
|
|
21
21
|
const router = _chunkG7UE6RKVcjs.useRouter.call(void 0, );
|
|
22
22
|
const pathname = _chunkG7UE6RKVcjs.usePathname.call(void 0, );
|
|
23
23
|
const searchParams = _chunkG7UE6RKVcjs.useSearchParams.call(void 0, );
|
|
@@ -57,7 +57,7 @@ function DevSectionView({ sectionKey, hero, preControls, children }) {
|
|
|
57
57
|
preControls,
|
|
58
58
|
(search || filter) && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "space-y-4", children: [
|
|
59
59
|
search && /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
60
|
-
|
|
60
|
+
_chunk5VU66BD2cjs.SearchInput,
|
|
61
61
|
{
|
|
62
62
|
showDropdown: false,
|
|
63
63
|
placeholder: search.placeholder,
|
|
@@ -67,7 +67,7 @@ function DevSectionView({ sectionKey, hero, preControls, children }) {
|
|
|
67
67
|
}
|
|
68
68
|
),
|
|
69
69
|
filter && /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
70
|
-
|
|
70
|
+
_chunk5VU66BD2cjs.StatusFilterComponent,
|
|
71
71
|
{
|
|
72
72
|
selectedStatus: currentFilterValue,
|
|
73
73
|
onStatusChange: handleFilterChange,
|
|
@@ -92,13 +92,13 @@ function DevSectionPage({
|
|
|
92
92
|
subtitle
|
|
93
93
|
}) {
|
|
94
94
|
const router = _chunkG7UE6RKVcjs.useRouter.call(void 0, );
|
|
95
|
-
const section =
|
|
95
|
+
const section = _chunk5VU66BD2cjs.OPENFRAME_DEV_SECTIONS[sectionKey];
|
|
96
96
|
const Icon = section.icon;
|
|
97
97
|
const backCfg = backButton === false ? void 0 : {
|
|
98
98
|
label: _nullishCoalesce((backButton ? backButton.label : void 0), () => ( "Back to home")),
|
|
99
99
|
onClick: () => router.push(_nullishCoalesce((backButton ? backButton.href : void 0), () => ( "/")))
|
|
100
100
|
};
|
|
101
|
-
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
101
|
+
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk5VU66BD2cjs.PageShell, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk5VU66BD2cjs.PageLayout, { backButton: backCfg, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
102
102
|
DevSectionView,
|
|
103
103
|
{
|
|
104
104
|
sectionKey,
|
|
@@ -159,4 +159,4 @@ function DevCardRowSkeletonList({ rows = 5 }) {
|
|
|
159
159
|
|
|
160
160
|
|
|
161
161
|
exports.DevSectionView = DevSectionView; exports.DevSectionPage = DevSectionPage; exports.DevCardRowContent = DevCardRowContent; exports.DevCardRowSkeleton = DevCardRowSkeleton; exports.DevCardRowSkeletonList = DevCardRowSkeletonList;
|
|
162
|
-
//# sourceMappingURL=chunk-
|
|
162
|
+
//# sourceMappingURL=chunk-MTROCWO4.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["/home/runner/work/openframe-oss-lib/openframe-oss-lib/openframe-frontend-core/dist/chunk-366P5YXP.cjs","../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"],"names":["jsx","jsxs"],"mappings":"AAAA,yLAAY;AACZ;AACE;AACA;AACA;AACA;AACA;AACF,wDAA6B;AAC7B;AACE;AACA;AACA;AACA;AACF,wDAA6B;AAC7B;AACA;ACEA,8BAAoC;AAiF1B,+CAAA;AA3CH,SAAS,cAAA,CAAe,EAAE,UAAA,EAAY,IAAA,EAAM,WAAA,EAAa,SAAS,CAAA,EAAwB;AAC/F,EAAA,MAAM,QAAA,EAAU,wCAAA,CAAuB,UAAU,CAAA;AACjD,EAAA,MAAM,OAAA,EAAS,yCAAA,CAAU;AACzB,EAAA,MAAM,SAAA,EAAW,2CAAA,CAAY;AAC7B,EAAA,MAAM,aAAA,EAAe,+CAAA,CAAgB;AAErC,EAAA,MAAM,OAAA,EAAS,OAAA,CAAQ,MAAA;AACvB,EAAA,MAAM,OAAA,EAAS,OAAA,CAAQ,MAAA;AAEvB,EAAA,MAAM,cAAA,EAAgB,OAAA,EAAS,YAAA,CAAa,GAAA,CAAI,MAAA,CAAO,QAAQ,EAAA,GAAK,GAAA,EAAK,EAAA;AACzE,EAAA,MAAM,mBAAA,EAAqB,OAAA,EACvB,YAAA,CAAa,GAAA,CAAI,MAAA,CAAO,QAAQ,EAAA,GAAK,MAAA,CAAO,aAAA,EAC5C,EAAA;AAMJ,EAAA,MAAM,CAAC,WAAA,EAAa,cAAc,EAAA,EAAI,6BAAA,CAAS,EAAA,GAAM,aAAa,CAAA;AAClE,EAAA,8BAAA,CAAU,EAAA,GAAM;AACd,IAAA,cAAA,CAAe,aAAa,CAAA;AAAA,EAC9B,CAAA,EAAG,CAAC,aAAa,CAAC,CAAA;AAElB,EAAA,MAAM,mBAAA,EAAqB,CAAC,KAAA,EAAA,GAAkB;AAC5C,IAAA,GAAA,CAAI,CAAC,MAAA,EAAQ,MAAA;AACb,IAAA,MAAM,OAAA,EAAS,IAAI,eAAA,CAAgB,YAAA,CAAa,QAAA,CAAS,CAAC,CAAA;AAC1D,IAAA,GAAA,CAAI,KAAA,CAAM,IAAA,CAAK,CAAA,EAAG,MAAA,CAAO,GAAA,CAAI,MAAA,CAAO,QAAA,EAAU,KAAA,CAAM,IAAA,CAAK,CAAC,CAAA;AAAA,IAAA,KACrD,MAAA,CAAO,MAAA,CAAO,MAAA,CAAO,QAAQ,CAAA;AAClC,IAAA,MAAA,CAAO,OAAA,CAAQ,CAAA,EAAA;AACjB,EAAA;AAEM,EAAA;AACS,IAAA;AACE,IAAA;AACD,IAAA;AACE,IAAA;AACD,IAAA;AACjB,EAAA;AAGE,EAAA;AAEI,IAAA;AACE,sBAAA;AACQ,QAAA;AACA,yBAAA;AACR,MAAA;AACA,sBAAA;AAKF,IAAA;AAEkB,MAAA;AACd,sBAAA;AAEJ,IAAA;AAGD,IAAA;AAEW,IAAA;AAGN,MAAA;AAAC,QAAA;AAAA,QAAA;AACC,UAAA;AACA,UAAA;AACO,UAAA;AACG,UAAA;AACA,UAAA;AAAA,QAAA;AACZ,MAAA;AAGA,MAAA;AAAC,QAAA;AAAA,QAAA;AACC,UAAA;AACA,UAAA;AACA,UAAA;AAAiC,QAAA;AACnC,MAAA;AAEJ,IAAA;AAGD,IAAA;AACH,EAAA;AAEJ;AD7DoB;AACA;AE9DpB;AA+DkBA;AAvDZ;AAyBU;AACd,EAAA;AACA,EAAA;AACA,EAAA;AACA,EAAA;AACA,EAAA;AACA,EAAA;AACsB;AACP,EAAA;AACC,EAAA;AACH,EAAA;AAOX,EAAA;AAGc,IAAA;AACO,IAAA;AACjB,EAAA;AAGJ,EAAA;AAEK,IAAA;AAAA,IAAA;AACC,MAAA;AACM,MAAA;AACE,QAAA;AACN,QAAA;AACA,QAAA;AACF,MAAA;AACA,MAAA;AAEC,MAAA;AAAA,IAAA;AAGP,EAAA;AAEJ;AFqBoB;AACA;AG9DVA;AAXM;AACd,EAAA;AACA,EAAA;AACA,EAAA;AACA,EAAA;AACA,EAAA;AACyB;AAEvB,EAAA;AACEC,oBAAAA;AACE,sBAAA;AAKA,sBAAA;AAKA,sBAAA;AAKF,IAAA;AACAD,oBAAAA;AAGF,EAAA;AAEJ;AAOgB;AAEZ,EAAA;AAEIC,oBAAAA;AACE,sBAAA;AAGA,sBAAA;AAGA,sBAAA;AAEI,wBAAA;AACA,wBAAA;AACA,wBAAA;AAEJ,MAAA;AACF,IAAA;AACAA,oBAAAA;AACE,sBAAA;AACA,sBAAA;AACF,IAAA;AAEJ,EAAA;AAEJ;AAOgB;AAEZ,EAAA;AAMJ;AHgCoB;AACA;AACA;AACA;AACA;AACA;AACA;AACA","file":"/home/runner/work/openframe-oss-lib/openframe-oss-lib/openframe-frontend-core/dist/chunk-366P5YXP.cjs","sourcesContent":[null,"'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 /** Hero title. Falls back to `OPENFRAME_DEV_SECTIONS[sectionKey].hero.title`\n * when omitted, so embedders can override the (OpenFrame-specific) default\n * copy without forking the registry. */\n title?: string;\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 {hero.title ?? 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 entirely. Default\n * `{ label: 'Back to home', href: '/' }` — embedders whose \"home\" isn't `/`\n * should override `href`, or pass `false` if the embed has no home page. */\n backButton?: { label?: string; href?: string } | false;\n /** Override the hero title. Defaults to the (OpenFrame-specific) copy in\n * `OPENFRAME_DEV_SECTIONS[sectionKey].hero.title`. Set this to brand the\n * section for a non-OpenFrame embed. */\n title?: string;\n /** Override the hero subtitle/description. Defaults to\n * `OPENFRAME_DEV_SECTIONS[sectionKey].hero.description`. */\n subtitle?: string;\n}\n\nexport function DevSectionPage({\n sectionKey,\n children,\n preControls,\n backButton,\n title,\n subtitle,\n}: 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 title,\n description: subtitle ?? 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 * NOTE: the ticket conversation row is NOT here — it renders the shared\n * `<ChatMessageRow>` (`components/chat/chat-message-row.tsx`), the SAME\n * component the OpenMSP Slack-community feed uses, so the two surfaces stay\n * pixel-identical by construction.\n */\n\nimport type { ReactNode } from 'react';\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 * 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"]}
|
|
1
|
+
{"version":3,"sources":["/home/runner/work/openframe-oss-lib/openframe-oss-lib/openframe-frontend-core/dist/chunk-MTROCWO4.cjs","../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"],"names":["jsx","jsxs"],"mappings":"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","file":"/home/runner/work/openframe-oss-lib/openframe-oss-lib/openframe-frontend-core/dist/chunk-MTROCWO4.cjs","sourcesContent":[null,"'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 /** Hero title. Falls back to `OPENFRAME_DEV_SECTIONS[sectionKey].hero.title`\n * when omitted, so embedders can override the (OpenFrame-specific) default\n * copy without forking the registry. */\n title?: string;\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 {hero.title ?? 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 entirely. Default\n * `{ label: 'Back to home', href: '/' }` — embedders whose \"home\" isn't `/`\n * should override `href`, or pass `false` if the embed has no home page. */\n backButton?: { label?: string; href?: string } | false;\n /** Override the hero title. Defaults to the (OpenFrame-specific) copy in\n * `OPENFRAME_DEV_SECTIONS[sectionKey].hero.title`. Set this to brand the\n * section for a non-OpenFrame embed. */\n title?: string;\n /** Override the hero subtitle/description. Defaults to\n * `OPENFRAME_DEV_SECTIONS[sectionKey].hero.description`. */\n subtitle?: string;\n}\n\nexport function DevSectionPage({\n sectionKey,\n children,\n preControls,\n backButton,\n title,\n subtitle,\n}: 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 title,\n description: subtitle ?? 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 * NOTE: the ticket conversation row is NOT here — it renders the shared\n * `<ChatMessageRow>` (`components/chat/chat-message-row.tsx`), the SAME\n * component the OpenMSP Slack-community feed uses, so the two surfaces stay\n * pixel-identical by construction.\n */\n\nimport type { ReactNode } from 'react';\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 * 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"]}
|
|
@@ -6,7 +6,7 @@ import {
|
|
|
6
6
|
TASK_TYPE_TEXT_COLORS,
|
|
7
7
|
getStatusColorScheme,
|
|
8
8
|
init_pagination
|
|
9
|
-
} from "./chunk-
|
|
9
|
+
} from "./chunk-Y7DCQUNL.js";
|
|
10
10
|
import {
|
|
11
11
|
Button,
|
|
12
12
|
init_button2 as init_button
|
|
@@ -299,4 +299,4 @@ export {
|
|
|
299
299
|
init_unified_pagination,
|
|
300
300
|
DeliveryRow
|
|
301
301
|
};
|
|
302
|
-
//# sourceMappingURL=chunk-
|
|
302
|
+
//# sourceMappingURL=chunk-PN64LWNT.js.map
|
|
@@ -7,16 +7,16 @@
|
|
|
7
7
|
|
|
8
8
|
|
|
9
9
|
|
|
10
|
-
var
|
|
10
|
+
var _chunk5VU66BD2cjs = require('./chunk-5VU66BD2.cjs');
|
|
11
11
|
|
|
12
12
|
|
|
13
|
-
var
|
|
13
|
+
var _chunkMEAR2WHScjs = require('./chunk-MEAR2WHS.cjs');
|
|
14
14
|
|
|
15
15
|
|
|
16
|
-
var
|
|
16
|
+
var _chunk27VVOBDBcjs = require('./chunk-27VVOBDB.cjs');
|
|
17
17
|
|
|
18
18
|
|
|
19
|
-
var
|
|
19
|
+
var _chunkG7UE6RKVcjs = require('./chunk-G7UE6RKV.cjs');
|
|
20
20
|
|
|
21
21
|
// src/components/shared/doc-search/format-relative-path.ts
|
|
22
22
|
function formatRelativePath(fullPath) {
|
|
@@ -34,7 +34,7 @@ function DocSearchResultRow({
|
|
|
34
34
|
}) {
|
|
35
35
|
const docType = _optionalChain([result, 'access', _2 => _2.metadata, 'optionalAccess', _3 => _3.documentType]) || void 0;
|
|
36
36
|
const sourceRepo = _optionalChain([result, 'access', _4 => _4.metadata, 'optionalAccess', _5 => _5.sourceRepo]) || void 0;
|
|
37
|
-
const { Icon: SourceIcon, label: iconLabel } =
|
|
37
|
+
const { Icon: SourceIcon, label: iconLabel } = _chunk5VU66BD2cjs.resolveSourceIcon.call(void 0, {
|
|
38
38
|
sourceRepo,
|
|
39
39
|
documentType: docType
|
|
40
40
|
});
|
|
@@ -77,7 +77,7 @@ function DocSearchBar({
|
|
|
77
77
|
renderResult
|
|
78
78
|
}) {
|
|
79
79
|
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
80
|
-
|
|
80
|
+
_chunk5VU66BD2cjs.SearchInput,
|
|
81
81
|
{
|
|
82
82
|
placeholder,
|
|
83
83
|
value: query,
|
|
@@ -186,7 +186,7 @@ function resolveSearchResultAction(result, source, runtimeMode) {
|
|
|
186
186
|
const externalUrl = meta.externalUrl;
|
|
187
187
|
if (externalUrl) {
|
|
188
188
|
const targetPlatform = meta.targetPlatform;
|
|
189
|
-
const isNewTab =
|
|
189
|
+
const isNewTab = _chunk5VU66BD2cjs.decideNewTab.call(void 0, {
|
|
190
190
|
href: externalUrl,
|
|
191
191
|
targetPlatform,
|
|
192
192
|
surface: "useUnifiedNav",
|
|
@@ -230,7 +230,7 @@ function useDocSearch(config) {
|
|
|
230
230
|
const [query, setQuery] = _react.useState.call(void 0, "");
|
|
231
231
|
const [results, setResults] = _react.useState.call(void 0, []);
|
|
232
232
|
const [isFetching, setIsFetching] = _react.useState.call(void 0, false);
|
|
233
|
-
const debouncedQuery =
|
|
233
|
+
const debouncedQuery = _chunk27VVOBDBcjs.useDebounce.call(void 0, query, 300);
|
|
234
234
|
_react.useEffect.call(void 0, () => {
|
|
235
235
|
if (!debouncedQuery || debouncedQuery.trim().length < 2) {
|
|
236
236
|
setResults([]);
|
|
@@ -287,7 +287,7 @@ function useDocSearch(config) {
|
|
|
287
287
|
if (_optionalChain([runtime, 'optionalAccess', _13 => _13.navigation, 'access', _14 => _14.mode]) === "embed") {
|
|
288
288
|
setKeepOpen(true);
|
|
289
289
|
const targetPlatform = _nullishCoalesce(_optionalChain([result, 'access', _15 => _15.metadata, 'optionalAccess', _16 => _16.targetPlatform]), () => ( null));
|
|
290
|
-
|
|
290
|
+
_chunk5VU66BD2cjs.resolveExternalNavigation.call(void 0, {
|
|
291
291
|
href: action.href,
|
|
292
292
|
targetPlatform,
|
|
293
293
|
runtime
|
|
@@ -296,18 +296,18 @@ function useDocSearch(config) {
|
|
|
296
296
|
}
|
|
297
297
|
if (wantsNewTab) {
|
|
298
298
|
setKeepOpen(true);
|
|
299
|
-
window.open(action.href, "_blank",
|
|
299
|
+
window.open(action.href, "_blank", _chunk5VU66BD2cjs.NEW_TAB_FEATURES);
|
|
300
300
|
return;
|
|
301
301
|
}
|
|
302
302
|
setKeepOpen(false);
|
|
303
303
|
const path = baseRoute && action.href.startsWith(`${baseRoute}/`) ? action.href.slice(baseRoute.length + 1) : null;
|
|
304
304
|
if (path && _optionalChain([onInPageSwap, 'optionalCall', _17 => _17(path)])) return;
|
|
305
|
-
router.push(
|
|
305
|
+
router.push(_chunk5VU66BD2cjs.stripSameOriginToPath.call(void 0, action.href));
|
|
306
306
|
return;
|
|
307
307
|
}
|
|
308
308
|
case "navigate-new-tab":
|
|
309
309
|
setKeepOpen(true);
|
|
310
|
-
window.open(action.href, "_blank",
|
|
310
|
+
window.open(action.href, "_blank", _chunk5VU66BD2cjs.NEW_TAB_FEATURES);
|
|
311
311
|
return;
|
|
312
312
|
case "ask-ai":
|
|
313
313
|
setKeepOpen(false);
|
|
@@ -345,7 +345,7 @@ function DetailPageSkeleton({
|
|
|
345
345
|
showImageGallery = true
|
|
346
346
|
} = {}) {
|
|
347
347
|
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
348
|
-
|
|
348
|
+
_chunk5VU66BD2cjs.PageContainer,
|
|
349
349
|
{
|
|
350
350
|
as: "article",
|
|
351
351
|
backgroundClassName: "bg-ods-bg",
|
|
@@ -377,66 +377,6 @@ function DetailPageSkeleton({
|
|
|
377
377
|
);
|
|
378
378
|
}
|
|
379
379
|
|
|
380
|
-
// src/hooks/use-self-fetch.ts
|
|
381
|
-
|
|
382
|
-
function useSelfFetch(url, options) {
|
|
383
|
-
const initialData = _optionalChain([options, 'optionalAccess', _18 => _18.initialData]);
|
|
384
|
-
const [data, setData] = _react.useState.call(void 0, _nullishCoalesce(initialData, () => ( null)));
|
|
385
|
-
const [isLoading, setIsLoading] = _react.useState.call(void 0, initialData === void 0 && url !== null);
|
|
386
|
-
const [error, setError] = _react.useState.call(void 0, false);
|
|
387
|
-
const [reloadKey, setReloadKey] = _react.useState.call(void 0, 0);
|
|
388
|
-
const dataUrlRef = _react.useRef.call(void 0, initialData !== void 0 ? url : null);
|
|
389
|
-
_react.useEffect.call(void 0, () => {
|
|
390
|
-
if (initialData !== void 0) setData(initialData);
|
|
391
|
-
}, [initialData]);
|
|
392
|
-
_react.useEffect.call(void 0, () => {
|
|
393
|
-
if (url === null) {
|
|
394
|
-
setIsLoading(false);
|
|
395
|
-
return;
|
|
396
|
-
}
|
|
397
|
-
if (dataUrlRef.current === url) return;
|
|
398
|
-
const ctrl = new AbortController();
|
|
399
|
-
let cancelled = false;
|
|
400
|
-
async function load() {
|
|
401
|
-
try {
|
|
402
|
-
setIsLoading(true);
|
|
403
|
-
setError(false);
|
|
404
|
-
const res = await fetch(url, { signal: ctrl.signal });
|
|
405
|
-
if (!res.ok) throw new Error(`Request failed (${res.status})`);
|
|
406
|
-
const json = await res.json();
|
|
407
|
-
if (!cancelled) {
|
|
408
|
-
setData(json);
|
|
409
|
-
dataUrlRef.current = url;
|
|
410
|
-
}
|
|
411
|
-
} catch (err) {
|
|
412
|
-
if (cancelled || _optionalChain([err, 'optionalAccess', _19 => _19.name]) === "AbortError") return;
|
|
413
|
-
setError(true);
|
|
414
|
-
console.error("useSelfFetch:", url, err);
|
|
415
|
-
} finally {
|
|
416
|
-
if (!cancelled) setIsLoading(false);
|
|
417
|
-
}
|
|
418
|
-
}
|
|
419
|
-
load();
|
|
420
|
-
return () => {
|
|
421
|
-
cancelled = true;
|
|
422
|
-
ctrl.abort();
|
|
423
|
-
};
|
|
424
|
-
}, [url, reloadKey]);
|
|
425
|
-
return {
|
|
426
|
-
data,
|
|
427
|
-
setData,
|
|
428
|
-
isLoading,
|
|
429
|
-
error,
|
|
430
|
-
// Force a re-fetch of the current url: clear the held-url ref so the skip above
|
|
431
|
-
// doesn't short-circuit, then bump the effect key.
|
|
432
|
-
reload: () => {
|
|
433
|
-
dataUrlRef.current = null;
|
|
434
|
-
setReloadKey((k) => k + 1);
|
|
435
|
-
}
|
|
436
|
-
};
|
|
437
|
-
}
|
|
438
|
-
|
|
439
|
-
|
|
440
380
|
|
|
441
381
|
|
|
442
382
|
|
|
@@ -445,5 +385,5 @@ function useSelfFetch(url, options) {
|
|
|
445
385
|
|
|
446
386
|
|
|
447
387
|
|
|
448
|
-
exports.formatRelativePath = formatRelativePath; exports.DocSearchResultRow = DocSearchResultRow; exports.DocSearchBar = DocSearchBar; exports.mapDocSearchResults = mapDocSearchResults; exports.resolveSearchResultAction = resolveSearchResultAction; exports.useDocSearch = useDocSearch; exports.
|
|
449
|
-
//# sourceMappingURL=chunk-
|
|
388
|
+
exports.formatRelativePath = formatRelativePath; exports.DocSearchResultRow = DocSearchResultRow; exports.DocSearchBar = DocSearchBar; exports.mapDocSearchResults = mapDocSearchResults; exports.resolveSearchResultAction = resolveSearchResultAction; exports.useDocSearch = useDocSearch; exports.DetailPageSkeleton = DetailPageSkeleton;
|
|
389
|
+
//# sourceMappingURL=chunk-SZ3BBI6H.cjs.map
|