@syntrologie/adapt-faq 2.8.0-canary.39 → 2.8.0-canary.391
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/FAQWidgetLit.d.ts +253 -0
- package/dist/FAQWidgetLit.d.ts.map +1 -0
- package/dist/FAQWidgetLit.editable.d.ts +154 -0
- package/dist/FAQWidgetLit.editable.d.ts.map +1 -0
- package/dist/answerRendering.d.ts +4 -0
- package/dist/answerRendering.d.ts.map +1 -0
- package/dist/chunk-5WRI5ZAA.js +31 -0
- package/dist/chunk-5WRI5ZAA.js.map +7 -0
- package/dist/chunk-IGCYULL7.js +223 -0
- package/dist/chunk-IGCYULL7.js.map +7 -0
- package/dist/chunk-KRKRB4OL.js +598 -0
- package/dist/chunk-KRKRB4OL.js.map +7 -0
- package/dist/editor.d.ts +60 -33
- package/dist/editor.d.ts.map +1 -1
- package/dist/editor.js +5054 -313
- package/dist/editor.js.map +7 -0
- package/dist/faq-item-editor.d.ts +33 -0
- package/dist/faq-item-editor.d.ts.map +1 -0
- package/dist/faq-styles.d.ts +35 -1
- package/dist/faq-styles.d.ts.map +1 -1
- package/dist/faq-types.d.ts +4 -0
- package/dist/faq-types.d.ts.map +1 -1
- package/dist/runtime.d.ts +17 -5
- package/dist/runtime.d.ts.map +1 -1
- package/dist/runtime.js +1316 -64
- package/dist/runtime.js.map +7 -0
- package/dist/schema.d.ts +1232 -555
- package/dist/schema.d.ts.map +1 -1
- package/dist/schema.js +300 -207
- package/dist/schema.js.map +7 -0
- package/dist/types.d.ts +36 -0
- package/dist/types.d.ts.map +1 -1
- package/package.json +7 -12
- package/dist/FAQWidget.d.ts +0 -33
- package/dist/FAQWidget.d.ts.map +0 -1
- package/dist/FAQWidget.js +0 -388
- package/dist/cdn.d.ts +0 -70
- package/dist/cdn.d.ts.map +0 -1
- package/dist/cdn.js +0 -46
- package/dist/executors.js +0 -150
- package/dist/faq-styles.js +0 -204
- package/dist/faq-types.js +0 -7
- package/dist/state.js +0 -132
- package/dist/summarize.js +0 -62
- package/dist/types.js +0 -17
- package/node_modules/@syntrologie/sdk-contracts/dist/index.d.ts +0 -129
- package/node_modules/@syntrologie/sdk-contracts/dist/index.js +0 -15
- package/node_modules/@syntrologie/sdk-contracts/dist/schemas.d.ts +0 -2225
- package/node_modules/@syntrologie/sdk-contracts/dist/schemas.js +0 -162
- package/node_modules/@syntrologie/sdk-contracts/package.json +0 -33
|
@@ -0,0 +1,253 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Adaptive FAQ - FAQWidgetLit
|
|
3
|
+
*
|
|
4
|
+
* Lit web component equivalent of FAQWidget.tsx.
|
|
5
|
+
* Renders a collapsible Q&A accordion with search, category grouping,
|
|
6
|
+
* feedback, and markdown rendering — all as a custom element with no
|
|
7
|
+
* Shadow DOM (light DOM via createRenderRoot).
|
|
8
|
+
*
|
|
9
|
+
* Tag name: <syntro-faq-accordion>
|
|
10
|
+
*
|
|
11
|
+
* Decorator-free: uses `static override properties` (tsconfig has no
|
|
12
|
+
* experimentalDecorators).
|
|
13
|
+
*/
|
|
14
|
+
import { LitElement, nothing } from 'lit';
|
|
15
|
+
import type { FAQWidgetRuntime } from './faq-types';
|
|
16
|
+
import type { FAQConfig, FeedbackValue } from './types';
|
|
17
|
+
/**
|
|
18
|
+
* <syntro-faq-accordion> — light-DOM Lit web component.
|
|
19
|
+
*
|
|
20
|
+
* Set properties imperatively (no attribute serialisation for objects):
|
|
21
|
+
* el.faqConfig = { expandBehavior: 'single', ... };
|
|
22
|
+
* el.runtime = runtimeInstance;
|
|
23
|
+
* el.instanceId = 'my-faq';
|
|
24
|
+
*/
|
|
25
|
+
export declare class FAQAccordionElement extends LitElement {
|
|
26
|
+
static properties: {
|
|
27
|
+
faqConfig: {
|
|
28
|
+
attribute: boolean;
|
|
29
|
+
};
|
|
30
|
+
runtime: {
|
|
31
|
+
attribute: boolean;
|
|
32
|
+
};
|
|
33
|
+
instanceId: {
|
|
34
|
+
type: StringConstructor;
|
|
35
|
+
};
|
|
36
|
+
_openId: {
|
|
37
|
+
state: boolean;
|
|
38
|
+
};
|
|
39
|
+
_activeFace: {
|
|
40
|
+
state: boolean;
|
|
41
|
+
};
|
|
42
|
+
_highlightId: {
|
|
43
|
+
state: boolean;
|
|
44
|
+
};
|
|
45
|
+
_searchQuery: {
|
|
46
|
+
state: boolean;
|
|
47
|
+
};
|
|
48
|
+
_feedbackState: {
|
|
49
|
+
state: boolean;
|
|
50
|
+
};
|
|
51
|
+
_hoveredId: {
|
|
52
|
+
state: boolean;
|
|
53
|
+
};
|
|
54
|
+
};
|
|
55
|
+
faqConfig: FAQConfig;
|
|
56
|
+
runtime: FAQWidgetRuntime | null;
|
|
57
|
+
instanceId: string;
|
|
58
|
+
private _generatedUid;
|
|
59
|
+
_openId: string | null;
|
|
60
|
+
_activeFace: 'front' | 'back';
|
|
61
|
+
_highlightId: string | null;
|
|
62
|
+
_searchQuery: string;
|
|
63
|
+
_feedbackState: Map<string, FeedbackValue>;
|
|
64
|
+
_hoveredId: string | null;
|
|
65
|
+
private _backClearTimer;
|
|
66
|
+
private _pendingFocus;
|
|
67
|
+
private _focusReturnId;
|
|
68
|
+
private _unsubContext;
|
|
69
|
+
private _unsubAccumulator;
|
|
70
|
+
private _unsubCta;
|
|
71
|
+
private _unsubDeepLink;
|
|
72
|
+
private _unsubSessionMetrics;
|
|
73
|
+
private _highlightTimer;
|
|
74
|
+
private _unsubCompositional;
|
|
75
|
+
private _tileId;
|
|
76
|
+
/** Instance ids already appended via the compositional bus — dedups
|
|
77
|
+
* the subscribe-then-replay path (and re-subscribes on runtime change). */
|
|
78
|
+
private _llmAppendedIds;
|
|
79
|
+
createRenderRoot(): this;
|
|
80
|
+
connectedCallback(): void;
|
|
81
|
+
disconnectedCallback(): void;
|
|
82
|
+
updated(changedProps: Map<string, unknown>): void;
|
|
83
|
+
/**
|
|
84
|
+
* Move focus to the face that just became active after a flip (a11y). On
|
|
85
|
+
* flip-to-back, focus the ‹ Back button; on flip-to-front, focus the question
|
|
86
|
+
* row that originally opened the detail (so keyboard/AT users land back where
|
|
87
|
+
* they were). No-op when nothing is pending or the target isn't in the DOM
|
|
88
|
+
* yet (the flip-to-front row may not exist if the list changed).
|
|
89
|
+
*/
|
|
90
|
+
private _applyPendingFocus;
|
|
91
|
+
private _subscribeAll;
|
|
92
|
+
/**
|
|
93
|
+
* Subscribe to `element.compositional_*` events targeting this accordion's
|
|
94
|
+
* tile, and ask the element store to replay any items it already holds for
|
|
95
|
+
* us (covers the case where the accordion mounts AFTER the item did — the
|
|
96
|
+
* inline-slot hydration race that otherwise silently drops the question).
|
|
97
|
+
*/
|
|
98
|
+
private _subscribeCompositional;
|
|
99
|
+
/** Tile id for compositional filtering: the enclosing tile card's
|
|
100
|
+
* `data-tile-id` (set by SyntroTileCard), falling back to `instanceId`
|
|
101
|
+
* when the accordion is mounted outside a tile card. */
|
|
102
|
+
private _resolveTileId;
|
|
103
|
+
/** Append (or prepend) a faq:question the LLM mounted. The wire shape is a
|
|
104
|
+
* fully-formed `{kind, config}` envelope, so we store it verbatim. */
|
|
105
|
+
private _insertItem;
|
|
106
|
+
/** Replace an existing question's content (full replacement). */
|
|
107
|
+
private _patchItem;
|
|
108
|
+
/** Remove a question by instance id. */
|
|
109
|
+
private _removeItem;
|
|
110
|
+
/**
|
|
111
|
+
* Re-evaluate whether the open question is still visible, then re-render.
|
|
112
|
+
* Called from the subscription-driven re-render paths (context / accumulator /
|
|
113
|
+
* sessionMetric changes). Those subscriptions can flip an open question's
|
|
114
|
+
* `triggerWhen` to false WITHOUT a compositional patch/remove — so without
|
|
115
|
+
* this hook the stale-open reset (`_resetFaceIfOpenStale`, otherwise only
|
|
116
|
+
* invoked on patch/remove) would never fire on the triggerWhen path, and an
|
|
117
|
+
* open question gated out this way would snap straight to the back face on
|
|
118
|
+
* re-appearance. `_resetFaceIfOpenStale` mutates reactive state (which itself
|
|
119
|
+
* schedules an update), and we still `requestUpdate()` for the no-op case.
|
|
120
|
+
*/
|
|
121
|
+
private _reevaluateOpenAndUpdate;
|
|
122
|
+
/**
|
|
123
|
+
* If `_openId` no longer resolves against the visible/ordered list (gated out
|
|
124
|
+
* by triggerWhen, removed, or patched away), reset BOTH `_openId` and
|
|
125
|
+
* `_activeFace` to the front (and clear the pending a11y focus intent).
|
|
126
|
+
* Resolves against the SAME `ordered` list render() uses (visible + ordered,
|
|
127
|
+
* NOT search-filtered). Also cancels any pending back-clear timer. Invoked on
|
|
128
|
+
* compositional patch/remove AND on the subscription-driven re-render paths
|
|
129
|
+
* (via {@link _reevaluateOpenAndUpdate}) so the triggerWhen-gated-out case is
|
|
130
|
+
* genuinely covered. Keeping `_activeFace` on 'back' after the open id went
|
|
131
|
+
* stale is the bug this guards: render() would force the front face locally
|
|
132
|
+
* but leave state on 'back', so a later re-appearance snaps to the back face
|
|
133
|
+
* with no animation.
|
|
134
|
+
*/
|
|
135
|
+
private _resetFaceIfOpenStale;
|
|
136
|
+
private _unsubscribeAll;
|
|
137
|
+
/**
|
|
138
|
+
* Master→detail takeover: tapping a list row opens its single-Q&A detail
|
|
139
|
+
* view (the whole widget swaps), so a long answer fills — and never
|
|
140
|
+
* overflows — the bounded velvet tile. There is no simultaneous multi-expand;
|
|
141
|
+
* one question owns the tile at a time.
|
|
142
|
+
*/
|
|
143
|
+
private _handleOpen;
|
|
144
|
+
/**
|
|
145
|
+
* Put the widget into the DETAIL (back) face for `id` and flip to it. Shared
|
|
146
|
+
* by the tap handler and the event-driven entry points (faq:open CTA,
|
|
147
|
+
* notification.deep_link) so every "open this question" path flips the same
|
|
148
|
+
* way. Cancels any pending back-clear timer (a re-open before the flip-out
|
|
149
|
+
* finishes must keep the detail mounted). Remembers the originating question
|
|
150
|
+
* id so focus can return to that exact row on flip-to-front (a11y), and moves
|
|
151
|
+
* focus to the ‹ Back button once the back face renders.
|
|
152
|
+
*/
|
|
153
|
+
private _openToDetail;
|
|
154
|
+
/** Back affordance: FLIP from the detail (back) face to the list (front) face.
|
|
155
|
+
* We flip immediately but keep `_openId` (so the back face stays populated
|
|
156
|
+
* through the rotation, never blank mid-flip); the id clears once the
|
|
157
|
+
* transition completes. With reduced motion there's no transition, so it
|
|
158
|
+
* clears synchronously.
|
|
159
|
+
*
|
|
160
|
+
* Timer/token coupling: the tear-down delay is {@link _flipDurationMs} — the
|
|
161
|
+
* computed `--vc-transition-duration` token (clamped to be >= our fallback),
|
|
162
|
+
* NOT a hardcoded constant. A host that sets the token slower than the
|
|
163
|
+
* fallback would otherwise clear `_openId` (blanking the back face) before
|
|
164
|
+
* the rotation finished. Focus returns to the originating question row. */
|
|
165
|
+
private _handleBack;
|
|
166
|
+
private _handleFeedback;
|
|
167
|
+
/**
|
|
168
|
+
* Unified render list. Merges compositionally-appended rows
|
|
169
|
+
* (`faqConfig.actions`, the container-then-stream path) with atomically
|
|
170
|
+
* authored rows (`faqConfig.questions`, the struct_list path) normalized
|
|
171
|
+
* into the same `FAQQuestionAction` shape. The atomic path is how the LLM
|
|
172
|
+
* mounts a complete FAQ in one call — so it renders whole, never empty.
|
|
173
|
+
*/
|
|
174
|
+
private _allQuestions;
|
|
175
|
+
private _visibleQuestions;
|
|
176
|
+
private _orderedQuestions;
|
|
177
|
+
private _filteredQuestions;
|
|
178
|
+
private _categoryGroups;
|
|
179
|
+
/**
|
|
180
|
+
* The `data-adaptive-id` scope for this element's injected <style>. When
|
|
181
|
+
* `instanceId` is left at the shared default (`'faq-widget'`), two tiles would
|
|
182
|
+
* both scope to `[data-adaptive-id="faq-widget"]` and cross-style each other.
|
|
183
|
+
* In that case we fall back to a per-element generated uid so each default tile
|
|
184
|
+
* gets its own scope. A caller-provided instanceId is used verbatim.
|
|
185
|
+
*/
|
|
186
|
+
private get _scopeId();
|
|
187
|
+
/**
|
|
188
|
+
* The flip transition duration in ms, coupled to the CSS. Reads the computed
|
|
189
|
+
* `--vc-transition-duration` token off this element at runtime so the JS timer
|
|
190
|
+
* that tears down the back face (see {@link _handleBack}) is ALWAYS >= the CSS
|
|
191
|
+
* transition — a host that sets the token slower than our hardcoded default no
|
|
192
|
+
* longer blanks the back face before the flip visually finishes. Falls back to
|
|
193
|
+
* {@link FLIP_TRANSITION_MS} when the token is absent/unreadable (no live
|
|
194
|
+
* layout, jsdom). We add a small buffer and take the max of the token and the
|
|
195
|
+
* fallback so the timer never undershoots either.
|
|
196
|
+
*/
|
|
197
|
+
private _flipDurationMs;
|
|
198
|
+
/**
|
|
199
|
+
* Self-injected flip CSS. The FAQ tile is a light-DOM widget mounted across
|
|
200
|
+
* several canvases (velvet, default, onflow) and standalone — velvet ships a
|
|
201
|
+
* GENERIC, unscoped `[data-active-face]` flip rule (for the product card), but
|
|
202
|
+
* the other hosts don't. So the FAQ carries its own copy of the SAME 3D-flip
|
|
203
|
+
* technique, scoped to THIS instance (`[data-adaptive-id="…"]`) so it can't
|
|
204
|
+
* leak onto a sibling widget.
|
|
205
|
+
*
|
|
206
|
+
* Two deliberate departures from a naive copy of velvet's rule:
|
|
207
|
+
*
|
|
208
|
+
* 1. PERSPECTIVE goes on the PARENT viewport wrapper
|
|
209
|
+
* (`[data-faq-flip-viewport]`), NOT on the rotating `[data-faq-flip]`
|
|
210
|
+
* element. CSS `perspective` only gives depth to a DESCENDANT's transform —
|
|
211
|
+
* putting it on the element that itself rotates does nothing (a flat
|
|
212
|
+
* squash). We ALSO fold `perspective(...)` into the
|
|
213
|
+
* rotate transform itself as a belt-and-braces measure, so the flip has
|
|
214
|
+
* real 3D depth even inside velvet's bounded `overflow:hidden` deck card
|
|
215
|
+
* (which can otherwise flatten a parent `perspective`).
|
|
216
|
+
* 2. The active-face attribute is NAMESPACED (`data-faq-active-face`), so
|
|
217
|
+
* velvet's generic `[data-active-face]` rotate rule can't ALSO reach this
|
|
218
|
+
* container and double-apply its (perspective-less) transform.
|
|
219
|
+
*
|
|
220
|
+
* It mirrors the product card / velvet house style: rotateY, preserve-3d,
|
|
221
|
+
* backface-visibility, and the `--vc-transition-duration` / `--vc-transition-
|
|
222
|
+
* easing` tokens (with a ~240ms fallback) so the two tiles feel consistent.
|
|
223
|
+
* `prefers-reduced-motion` disables the rotation — the JS (see
|
|
224
|
+
* {@link _handleBack}) clears state synchronously in that case.
|
|
225
|
+
*/
|
|
226
|
+
private _renderFlipStyles;
|
|
227
|
+
private _renderAnswer;
|
|
228
|
+
private _renderFeedback;
|
|
229
|
+
/**
|
|
230
|
+
* LIST-view row. A tappable question with its chevron \u2014 but NO inline answer
|
|
231
|
+
* body. Tapping it takes over the tile with the question's detail view (see
|
|
232
|
+
* {@link _renderDetail}). Keeps the per-row look/markers/highlight from the
|
|
233
|
+
* old accordion minus the inline-expanded answer that overflowed the tile.
|
|
234
|
+
*/
|
|
235
|
+
private _renderItem;
|
|
236
|
+
private _renderItems;
|
|
237
|
+
/**
|
|
238
|
+
* DETAIL view \u2014 the master\u2192detail takeover. Renders ONLY the open question:
|
|
239
|
+
* a back affordance, the question prominently, and its full answer via the
|
|
240
|
+
* SAME {@link _renderAnswer}/`renderAnswerHtml` path (all answer formats still
|
|
241
|
+
* work). The answer area scrolls if extremely long, so a single answer fills
|
|
242
|
+
* the bounded velvet tile and never pushes content past the `overflow:hidden`
|
|
243
|
+
* clip.
|
|
244
|
+
*/
|
|
245
|
+
private _renderDetail;
|
|
246
|
+
render(): import("lit-html").TemplateResult<1> | typeof nothing;
|
|
247
|
+
/** The FRONT face — search box, the question list (optionally grouped by
|
|
248
|
+
* category), and the no-results message. Extracted so both faces can live in
|
|
249
|
+
* the DOM at once for the flip. */
|
|
250
|
+
private _renderListFace;
|
|
251
|
+
}
|
|
252
|
+
export default FAQAccordionElement;
|
|
253
|
+
//# sourceMappingURL=FAQWidgetLit.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FAQWidgetLit.d.ts","sourceRoot":"","sources":["../src/FAQWidgetLit.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,154 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Adaptive FAQ - FAQWidgetLit.editable
|
|
3
|
+
*
|
|
4
|
+
* Editable variant of the FAQ accordion for the canvas editor surface.
|
|
5
|
+
* Renders the same Q&A rows as <syntro-faq-accordion> but adds:
|
|
6
|
+
* - Pencil button per row (shows on hover, calls controller.editItem on click)
|
|
7
|
+
* - Click on question text expands/collapses to show the answer (normal FAQ behavior)
|
|
8
|
+
* - Drag handle per row when items.length >= 2
|
|
9
|
+
* - Drag-and-drop reorder via the sortable utility (injected via mount config)
|
|
10
|
+
* - Read-only fallback when controller is null
|
|
11
|
+
*
|
|
12
|
+
* Tag name: <syntro-faq-accordion-editable>
|
|
13
|
+
*
|
|
14
|
+
* Decorator-free: uses `static override properties` (matches codebase convention).
|
|
15
|
+
* Light DOM: inherits host-page CSS variables (same as <syntro-faq-accordion>).
|
|
16
|
+
*
|
|
17
|
+
* Cross-package import safety:
|
|
18
|
+
* The controller is typed as a structural `ControllerLike` interface defined
|
|
19
|
+
* locally — NOT imported from @syntrologie/editor-sdk. This prevents a
|
|
20
|
+
* dependency cycle (editor-sdk imports adapt-faq's editable; adapt-faq cannot
|
|
21
|
+
* import editor-sdk). The real EditModeController satisfies ControllerLike
|
|
22
|
+
* structurally.
|
|
23
|
+
*
|
|
24
|
+
* Similarly, `makeSortable` is passed in as a `SortableFn` option rather than
|
|
25
|
+
* imported directly. The editor-sdk bootstrap (setupEditModeBootstrap.ts) threads
|
|
26
|
+
* the real makeSortable through the FAQWidgetLitEditableMountable.mount() call.
|
|
27
|
+
* This is Alternative C from the architecture decision log, and matches the
|
|
28
|
+
* structural-interface pattern already used for the controller.
|
|
29
|
+
*/
|
|
30
|
+
import { LitElement } from 'lit';
|
|
31
|
+
import type { FAQConfig } from './types';
|
|
32
|
+
/**
|
|
33
|
+
* Structural interface — describes only the methods the editable widget needs.
|
|
34
|
+
* The real EditModeController satisfies this by structural subtyping.
|
|
35
|
+
*
|
|
36
|
+
* `tileId` (the host tile's id, threaded in via `instanceId` at mount) scopes
|
|
37
|
+
* controller calls to the active tile when a canvas has multiple FAQ tiles.
|
|
38
|
+
* It is optional so single-tile and v2 actions-shape canvases continue to work.
|
|
39
|
+
*/
|
|
40
|
+
export interface ControllerLike {
|
|
41
|
+
editItem(adaptive: string, itemId: string, tileId?: string): void;
|
|
42
|
+
editContainer(adaptive: string, tileId?: string): void;
|
|
43
|
+
isModalOpen(): boolean;
|
|
44
|
+
reorderItems(adaptive: string, newOrder: string[], tileId?: string): void;
|
|
45
|
+
}
|
|
46
|
+
/** Return value from makeSortable. */
|
|
47
|
+
export interface SortableHandle {
|
|
48
|
+
destroy(): void;
|
|
49
|
+
}
|
|
50
|
+
/** Options subset that FAQAccordionEditableElement passes into the sortable. */
|
|
51
|
+
export interface SortableOptions {
|
|
52
|
+
itemSelector: string;
|
|
53
|
+
handleSelector: string;
|
|
54
|
+
getItems: () => string[];
|
|
55
|
+
onReorder: (newOrder: string[]) => void;
|
|
56
|
+
liveRegion: HTMLElement;
|
|
57
|
+
}
|
|
58
|
+
/**
|
|
59
|
+
* Structural type matching `makeSortable` from editor-sdk's sortable.ts.
|
|
60
|
+
* Injected at mount time by FAQWidgetLitEditableMountable.
|
|
61
|
+
*/
|
|
62
|
+
export type SortableFn = (host: HTMLElement, opts: SortableOptions) => SortableHandle;
|
|
63
|
+
/**
|
|
64
|
+
* <syntro-faq-accordion-editable> — light-DOM Lit element.
|
|
65
|
+
*
|
|
66
|
+
* Set properties imperatively (no attribute serialisation for objects):
|
|
67
|
+
* el.faqConfig = { ... };
|
|
68
|
+
* el.controller = editModeControllerInstance; // null → read-only
|
|
69
|
+
*/
|
|
70
|
+
export declare class FAQAccordionEditableElement extends LitElement {
|
|
71
|
+
static properties: {
|
|
72
|
+
faqConfig: {
|
|
73
|
+
attribute: boolean;
|
|
74
|
+
};
|
|
75
|
+
controller: {
|
|
76
|
+
attribute: boolean;
|
|
77
|
+
};
|
|
78
|
+
tileId: {
|
|
79
|
+
attribute: boolean;
|
|
80
|
+
};
|
|
81
|
+
_hoveredId: {
|
|
82
|
+
state: boolean;
|
|
83
|
+
};
|
|
84
|
+
_expandedId: {
|
|
85
|
+
state: boolean;
|
|
86
|
+
};
|
|
87
|
+
_containerHovered: {
|
|
88
|
+
state: boolean;
|
|
89
|
+
};
|
|
90
|
+
};
|
|
91
|
+
faqConfig: FAQConfig;
|
|
92
|
+
/** Null when loaded without an editor context — renders read-only accordion. */
|
|
93
|
+
controller: ControllerLike | null;
|
|
94
|
+
/**
|
|
95
|
+
* Host tile id, threaded in via the mountable's `instanceId`. Scopes every
|
|
96
|
+
* controller call so the right tile is targeted when the canvas has more
|
|
97
|
+
* than one FAQ tile (per-route FAQs). Empty string when unknown.
|
|
98
|
+
*/
|
|
99
|
+
tileId: string;
|
|
100
|
+
/**
|
|
101
|
+
* The `makeSortable` factory to use. Injected by FAQWidgetLitEditableMountable
|
|
102
|
+
* from the editor-sdk bootstrap so there is no direct import from editor-sdk
|
|
103
|
+
* into this package (which would create a circular dependency).
|
|
104
|
+
*
|
|
105
|
+
* Null when running without the editor context (read-only mode).
|
|
106
|
+
*/
|
|
107
|
+
sortable: SortableFn | null;
|
|
108
|
+
/**
|
|
109
|
+
* Shared aria-live region from the modal host, threaded in via mount config.
|
|
110
|
+
* Falls back to a detached element when running outside the editor context.
|
|
111
|
+
*
|
|
112
|
+
* TODO(phase-2-a11y): wire shared live region from modal host for real a11y.
|
|
113
|
+
*/
|
|
114
|
+
liveRegion: HTMLElement | null;
|
|
115
|
+
_hoveredId: string | null;
|
|
116
|
+
_expandedId: string | null;
|
|
117
|
+
_containerHovered: boolean;
|
|
118
|
+
private _sortableHandle;
|
|
119
|
+
createRenderRoot(): this;
|
|
120
|
+
connectedCallback(): void;
|
|
121
|
+
/**
|
|
122
|
+
* Wire (or re-wire) the sortable whenever the properties it depends on change.
|
|
123
|
+
* `updated()` fires after every render, including the first, so we don't need
|
|
124
|
+
* a separate `firstUpdated()` call — using `updated()` alone avoids a double
|
|
125
|
+
* attach on mount (firstUpdated + updated both fire on first render).
|
|
126
|
+
*/
|
|
127
|
+
protected updated(changed: Map<string, unknown>): void;
|
|
128
|
+
disconnectedCallback(): void;
|
|
129
|
+
private _attachSortable;
|
|
130
|
+
private _handleEdit;
|
|
131
|
+
private _handlePencilClick;
|
|
132
|
+
private _handleContainerEdit;
|
|
133
|
+
private _toggleExpand;
|
|
134
|
+
private _renderRow;
|
|
135
|
+
render(): import("lit-html").TemplateResult<1>;
|
|
136
|
+
}
|
|
137
|
+
/**
|
|
138
|
+
* Mountable for <syntro-faq-accordion-editable>.
|
|
139
|
+
*
|
|
140
|
+
* Follows the same mount pattern as FAQWidgetLitMountable in runtime.ts.
|
|
141
|
+
* Accepts a `controller` in addition to `faqConfig` so the editor can
|
|
142
|
+
* wire up the EditModeController at mount time.
|
|
143
|
+
*/
|
|
144
|
+
export declare const FAQWidgetLitEditableMountable: {
|
|
145
|
+
mount(container: HTMLElement, config?: FAQConfig & {
|
|
146
|
+
instanceId?: string;
|
|
147
|
+
controller?: ControllerLike | null;
|
|
148
|
+
/** makeSortable factory injected by editor-sdk bootstrap. Null → drag disabled. */
|
|
149
|
+
sortable?: SortableFn | null;
|
|
150
|
+
/** Shared aria-live region from the modal host for sortable announcements. */
|
|
151
|
+
liveRegion?: HTMLElement | null;
|
|
152
|
+
}): () => void;
|
|
153
|
+
};
|
|
154
|
+
//# sourceMappingURL=FAQWidgetLit.editable.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FAQWidgetLit.editable.d.ts","sourceRoot":"","sources":["../src/FAQWidgetLit.editable.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AAEH,OAAO,EAAQ,UAAU,EAAW,MAAM,KAAK,CAAC;AAIhD,OAAO,KAAK,EAAE,SAAS,EAAqB,MAAM,SAAS,CAAC;AAM5D;;;;;;;GAOG;AACH,MAAM,WAAW,cAAc;IAC7B,QAAQ,CAAC,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAClE,aAAa,CAAC,QAAQ,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACvD,WAAW,IAAI,OAAO,CAAC;IACvB,YAAY,CAAC,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,EAAE,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CAC3E;AAMD,sCAAsC;AACtC,MAAM,WAAW,cAAc;IAC7B,OAAO,IAAI,IAAI,CAAC;CACjB;AAED,gFAAgF;AAChF,MAAM,WAAW,eAAe;IAC9B,YAAY,EAAE,MAAM,CAAC;IACrB,cAAc,EAAE,MAAM,CAAC;IACvB,QAAQ,EAAE,MAAM,MAAM,EAAE,CAAC;IACzB,SAAS,EAAE,CAAC,QAAQ,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACxC,UAAU,EAAE,WAAW,CAAC;CACzB;AAED;;;GAGG;AACH,MAAM,MAAM,UAAU,GAAG,CAAC,IAAI,EAAE,WAAW,EAAE,IAAI,EAAE,eAAe,KAAK,cAAc,CAAC;AAuJtF;;;;;;GAMG;AACH,qBAAa,2BAA4B,SAAQ,UAAU;IAKzD,OAAgB,UAAU;;;;;;;;;;;;;;;;;;;MASxB;IAMF,SAAS,EAAE,SAAS,CAKlB;IAEF,gFAAgF;IAChF,UAAU,EAAE,cAAc,GAAG,IAAI,CAAQ;IAEzC;;;;OAIG;IACH,MAAM,SAAM;IAEZ;;;;;;OAMG;IACH,QAAQ,EAAE,UAAU,GAAG,IAAI,CAAQ;IAEnC;;;;;OAKG;IACH,UAAU,EAAE,WAAW,GAAG,IAAI,CAAQ;IAEtC,UAAU,EAAE,MAAM,GAAG,IAAI,CAAQ;IACjC,WAAW,EAAE,MAAM,GAAG,IAAI,CAAQ;IAClC,iBAAiB,UAAS;IAM1B,OAAO,CAAC,eAAe,CAA+B;IAM7C,gBAAgB;IAIhB,iBAAiB,IAAI,IAAI;IASlC;;;;;OAKG;cACgB,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI;IAQtD,oBAAoB,IAAI,IAAI;IAMrC,OAAO,CAAC,eAAe;IAuBvB,OAAO,CAAC,WAAW;IAMnB,OAAO,CAAC,kBAAkB;IAK1B,OAAO,CAAC,oBAAoB;IAM5B,OAAO,CAAC,aAAa;IAQrB,OAAO,CAAC,UAAU;IA2DT,MAAM;CAuEhB;AAcD;;;;;;GAMG;AACH,eAAO,MAAM,6BAA6B;qBAE3B,WAAW,WACb,SAAS,GAAG;QACnB,UAAU,CAAC,EAAE,MAAM,CAAC;QACpB,UAAU,CAAC,EAAE,cAAc,GAAG,IAAI,CAAC;QACnC,mFAAmF;QACnF,QAAQ,CAAC,EAAE,UAAU,GAAG,IAAI,CAAC;QAC7B,8EAA8E;QAC9E,UAAU,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;KACjC;CAkCJ,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"answerRendering.d.ts","sourceRoot":"","sources":["../src/answerRendering.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAIzC,wBAAgB,aAAa,CAAC,MAAM,EAAE,SAAS,GAAG,MAAM,CAIvD;AAED,wBAAgB,gBAAgB,CAAC,MAAM,EAAE,SAAS,GAAG,MAAM,CAQ1D"}
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
var __create = Object.create;
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __commonJS = (cb, mod) => function __require() {
|
|
8
|
+
return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
|
|
9
|
+
};
|
|
10
|
+
var __copyProps = (to, from, except, desc) => {
|
|
11
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
12
|
+
for (let key of __getOwnPropNames(from))
|
|
13
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
14
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
15
|
+
}
|
|
16
|
+
return to;
|
|
17
|
+
};
|
|
18
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
19
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
20
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
21
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
22
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
23
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
24
|
+
mod
|
|
25
|
+
));
|
|
26
|
+
|
|
27
|
+
export {
|
|
28
|
+
__commonJS,
|
|
29
|
+
__toESM
|
|
30
|
+
};
|
|
31
|
+
//# sourceMappingURL=chunk-5WRI5ZAA.js.map
|