@syntrologie/adapt-faq 2.8.0-canary.7 → 2.8.0-canary.71

package/dist/FAQWidget.d.ts

@@ -7,54 +7,9 @@
  * Demonstrates the compositional action pattern where child actions
  * (faq:question) serve as configuration data for the parent widget.
  */
-import type { DecisionStrategy, FAQConfig } from './types';
-export interface FAQWidgetRuntime {
-    evaluateSync: <T>(strategy: DecisionStrategy<T>) => {
-        value: T;
-        isFallback: boolean;
-    };
-    context: {
-        subscribe: (callback: () => void) => () => void;
-    };
-    events: {
-        publish: (name: string, props?: Record<string, unknown>) => void;
-        subscribe?: (filterOrCallback: {
-            names?: string[];
-            patterns?: string[];
-            sources?: string[];
-        } | ((event: {
-            name: string;
-            props?: Record<string, unknown>;
-            ts: number;
-        }) => void), maybeCallback?: (event: {
-            name: string;
-            props?: Record<string, unknown>;
-            ts: number;
-        }) => void) => () => void;
-        getRecent?: (filter?: {
-            names?: string[];
-            patterns?: string[];
-        }, limit?: number) => Array<{
-            name: string;
-            props?: Record<string, unknown>;
-            ts: number;
-        }>;
-    };
-    state?: {
-        get: (key: string) => unknown;
-        set: (key: string, value: unknown) => void;
-    };
-    /** Event accumulator for reactive triggerWhen re-evaluation */
-    accumulator?: {
-        subscribe: (callback: () => void) => () => void;
-        register: (key: string, predicate: (event: any) => boolean) => void;
-    };
-}
-interface FAQWidgetProps {
-    config: FAQConfig;
-    runtime: FAQWidgetRuntime;
-    instanceId: string;
-}
+import type { FAQWidgetProps, FAQWidgetRuntime } from './faq-types';
+import type { FAQConfig } from './types';
+export type { FAQWidgetRuntime } from './faq-types';
 /**
  * FAQWidget - Renders a collapsible Q&A accordion with per-item activation.
  *
@@ -72,7 +27,7 @@ export declare const FAQMountableWidget: {
     mount(container: HTMLElement, config?: FAQConfig & {
         runtime?: FAQWidgetRuntime;
         instanceId?: string;
-    }): () => void;
+    }): (() => void) | undefined;
 };
 export default FAQWidget;
 //# sourceMappingURL=FAQWidget.d.ts.map

package/dist/FAQWidget.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FAQWidget.d.ts","sourceRoot":"","sources":["../src/FAQWidget.tsx"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAMH,OAAO,KAAK,EACV,gBAAgB,EAEhB,SAAS,EAIV,MAAM,SAAS,CAAC;AA2CjB,MAAM,WAAW,gBAAgB;IAC/B,YAAY,EAAE,CAAC,CAAC,EAAE,QAAQ,EAAE,gBAAgB,CAAC,CAAC,CAAC,KAAK;QAAE,KAAK,EAAE,CAAC,CAAC;QAAC,UAAU,EAAE,OAAO,CAAA;KAAE,CAAC;IACtF,OAAO,EAAE;QAAE,SAAS,EAAE,CAAC,QAAQ,EAAE,MAAM,IAAI,KAAK,MAAM,IAAI,CAAA;KAAE,CAAC;IAC7D,MAAM,EAAE;QACN,OAAO,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAAK,IAAI,CAAC;QACjE,SAAS,CAAC,EAAE,CACV,gBAAgB,EACZ;YAAE,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;YAAC,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAC;YAAC,OAAO,CAAC,EAAE,MAAM,EAAE,CAAA;SAAE,GAC7D,CAAC,CAAC,KAAK,EAAE;YAAE,IAAI,EAAE,MAAM,CAAC;YAAC,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;YAAC,EAAE,EAAE,MAAM,CAAA;SAAE,KAAK,IAAI,CAAC,EACpF,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE;YAAE,IAAI,EAAE,MAAM,CAAC;YAAC,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;YAAC,EAAE,EAAE,MAAM,CAAA;SAAE,KAAK,IAAI,KAC3F,MAAM,IAAI,CAAC;QAChB,SAAS,CAAC,EAAE,CACV,MAAM,CAAC,EAAE;YAAE,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;YAAC,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAA;SAAE,EAClD,KAAK,CAAC,EAAE,MAAM,KACX,KAAK,CAAC;YAAE,IAAI,EAAE,MAAM,CAAC;YAAC,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;YAAC,EAAE,EAAE,MAAM,CAAA;SAAE,CAAC,CAAC;KAC3E,CAAC;IACF,KAAK,CAAC,EAAE;QAAE,GAAG,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,OAAO,CAAC;QAAC,GAAG,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,KAAK,IAAI,CAAA;KAAE,CAAC;IACtF,+DAA+D;IAC/D,WAAW,CAAC,EAAE;QACZ,SAAS,EAAE,CAAC,QAAQ,EAAE,MAAM,IAAI,KAAK,MAAM,IAAI,CAAC;QAChD,QAAQ,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,SAAS,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,OAAO,KAAK,IAAI,CAAC;KACrE,CAAC;CACH;AAED,UAAU,cAAc;IACtB,MAAM,EAAE,SAAS,CAAC;IAClB,OAAO,EAAE,gBAAgB,CAAC;IAC1B,UAAU,EAAE,MAAM,CAAC;CACpB;AAyTD;;;;;;;;GAQG;AACH,wBAAgB,SAAS,CAAC,EAAE,MAAM,EAAE,OAAO,EAAE,UAAU,EAAE,EAAE,cAAc,2CA8VxE;AAMD;;GAEG;AACH,eAAO,MAAM,kBAAkB;qBAEhB,WAAW,WACb,SAAS,GAAG;QAAE,OAAO,CAAC,EAAE,gBAAgB,CAAC;QAAC,UAAU,CAAC,EAAE,MAAM,CAAA;KAAE;CAiD3E,CAAC;AAEF,eAAe,SAAS,CAAC"}
+{"version":3,"file":"FAQWidget.d.ts","sourceRoot":"","sources":["../src/FAQWidget.tsx"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAUH,OAAO,KAAK,EAAE,cAAc,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AACpE,OAAO,KAAK,EAEV,SAAS,EAIV,MAAM,SAAS,CAAC;AAEjB,YAAY,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AA2KpD;;;;;;;;GAQG;AACH,wBAAgB,SAAS,CAAC,EAAE,MAAM,EAAE,OAAO,EAAE,UAAU,EAAE,EAAE,cAAc,2CA8VxE;AAMD;;GAEG;AACH,eAAO,MAAM,kBAAkB;qBAEhB,WAAW,WACb,SAAS,GAAG;QAAE,OAAO,CAAC,EAAE,gBAAgB,CAAC;QAAC,UAAU,CAAC,EAAE,MAAM,CAAA;KAAE;CA4B3E,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/dist/FAQWidget.js

@@ -8,9 +8,12 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  * Demonstrates the compositional action pattern where child actions
  * (faq:question) serve as configuration data for the parent widget.
  */
-import { purple, slateGrey } from '@syntro/design-system/tokens';
+import { purple } from '@syntro/design-system/tokens';
+import { Marked } from 'marked';
 import React, { useCallback, useEffect, useMemo, useReducer, useState } from 'react';
 import { createRoot } from 'react-dom/client';
+const marked = new Marked({ async: false, gfm: true, breaks: true });
+import { baseStyles, themeStyles } from './faq-styles';
 // ============================================================================
 // Helpers
 // ============================================================================
@@ -25,14 +28,20 @@ function getAnswerText(answer) {
 /** Render an FAQAnswer based on its type */
 function renderAnswer(answer) {
     if (typeof answer === 'string') {
-        return _jsx("p", { style: { margin: 0 }, children: answer });
+        const html = marked.parse(answer);
+        return (
+        // biome-ignore lint/security/noDangerouslySetInnerHtml: content is CMS/config content, not user-controlled input
+        _jsx("div", { style: { margin: 0 }, "data-faq-markdown": "", dangerouslySetInnerHTML: { __html: html } }));
     }
     if (answer.type === 'rich') {
         // biome-ignore lint/security/noDangerouslySetInnerHtml: content is pre-sanitized by backend — FAQAnswer.html is CMS/config content, not user-controlled input
         return _jsx("div", { style: { margin: 0 }, dangerouslySetInnerHTML: { __html: answer.html } });
     }
-    // markdown — render content as text (full markdown rendering is a future enhancement)
-    return _jsx("p", { style: { margin: 0 }, children: answer.content });
+    // markdown — parse to HTML and render
+    const html = marked.parse(answer.content);
+    return (
+    // biome-ignore lint/security/noDangerouslySetInnerHtml: markdown content is CMS/config content, not user-controlled input
+    _jsx("div", { style: { margin: 0 }, "data-faq-markdown": "", dangerouslySetInnerHTML: { __html: html } }));
 }
 /** Resolve feedback config into a normalized FeedbackConfig or null */
 function resolveFeedbackConfig(feedback) {
@@ -47,194 +56,6 @@ function resolveFeedbackConfig(feedback) {
 function getFeedbackPrompt(feedbackConfig) {
     return feedbackConfig.prompt || 'Was this helpful?';
 }
-// ============================================================================
-// Styles
-// ============================================================================
-const baseStyles = {
-    container: {
-        fontFamily: 'var(--sc-font-family, system-ui, -apple-system, sans-serif)',
-        maxWidth: '800px',
-        margin: '0 auto',
-    },
-    searchWrapper: {
-        marginBottom: '8px',
-    },
-    searchInput: {
-        width: '100%',
-        padding: '12px 16px',
-        borderRadius: '8px',
-        fontSize: '14px',
-        outline: 'none',
-        transition: 'border-color 0.15s ease',
-        backgroundColor: 'var(--sc-content-search-background)',
-        color: 'var(--sc-content-search-color)',
-    },
-    accordion: {
-        display: 'flex',
-        flexDirection: 'column',
-        gap: 'var(--sc-content-item-gap, 6px)',
-    },
-    item: {
-        borderRadius: 'var(--sc-content-border-radius, 8px)',
-        overflow: 'hidden',
-        transition: 'box-shadow 0.15s ease',
-    },
-    question: {
-        width: '100%',
-        padding: 'var(--sc-content-item-padding, 12px 16px)',
-        display: 'flex',
-        alignItems: 'center',
-        justifyContent: 'space-between',
-        border: 'none',
-        cursor: 'pointer',
-        fontSize: 'var(--sc-content-item-font-size, 15px)',
-        fontWeight: 500,
-        textAlign: 'left',
-        transition: 'background-color 0.15s ease',
-    },
-    chevron: {
-        fontSize: '20px',
-        transition: 'transform 0.2s ease',
-        color: 'var(--sc-content-chevron-color, currentColor)',
-    },
-    answer: {
-        padding: 'var(--sc-content-body-padding, 0 16px 12px 16px)',
-        fontSize: 'var(--sc-content-body-font-size, 14px)',
-        lineHeight: 1.6,
-        overflow: 'hidden',
-        transition: 'max-height 0.2s ease, padding 0.2s ease',
-    },
-    category: {
-        display: 'inline-block',
-        fontSize: '11px',
-        fontWeight: 600,
-        textTransform: 'uppercase',
-        letterSpacing: '0.05em',
-        padding: '4px 8px',
-        borderRadius: '4px',
-        marginBottom: '8px',
-    },
-    categoryHeader: {
-        fontSize: 'var(--sc-content-category-font-size, 12px)',
-        fontWeight: 700,
-        textTransform: 'uppercase',
-        letterSpacing: '0.05em',
-        padding: 'var(--sc-content-category-padding, 8px 4px 4px 4px)',
-        marginTop: 'var(--sc-content-category-gap, 4px)',
-    },
-    feedback: {
-        display: 'flex',
-        alignItems: 'center',
-        gap: '8px',
-        marginTop: '12px',
-        paddingTop: '10px',
-        borderTop: '1px solid rgba(0, 0, 0, 0.08)',
-        fontSize: '13px',
-    },
-    feedbackButton: {
-        background: 'none',
-        border: '1px solid transparent',
-        cursor: 'pointer',
-        fontSize: '16px',
-        padding: '4px 8px',
-        borderRadius: '4px',
-        transition: 'background-color 0.15s ease, border-color 0.15s ease',
-    },
-    feedbackButtonSelected: {
-        borderColor: 'rgba(0, 0, 0, 0.2)',
-        backgroundColor: 'rgba(0, 0, 0, 0.04)',
-    },
-    emptyState: {
-        textAlign: 'center',
-        padding: '48px 24px',
-        fontSize: '14px',
-    },
-    noResults: {
-        textAlign: 'center',
-        padding: '32px 16px',
-        fontSize: '14px',
-    },
-};
-const themeStyles = {
-    light: {
-        container: {
-            backgroundColor: 'transparent',
-            color: 'inherit',
-        },
-        searchInput: {
-            border: `1px solid ${slateGrey[11]}`,
-        },
-        item: {
-            backgroundColor: 'var(--sc-content-background)',
-            border: 'var(--sc-content-border)',
-        },
-        itemExpanded: {
-            boxShadow: '0 4px 12px rgba(0, 0, 0, 0.08)',
-        },
-        question: {
-            backgroundColor: 'transparent',
-            color: 'var(--sc-content-text-color)',
-        },
-        questionHover: {
-            backgroundColor: 'var(--sc-content-background-hover)',
-        },
-        answer: {
-            color: 'var(--sc-content-text-secondary-color)',
-        },
-        category: {
-            backgroundColor: purple[8],
-            color: purple[2],
-        },
-        categoryHeader: {
-            color: slateGrey[7],
-        },
-        emptyState: {
-            color: slateGrey[8],
-        },
-        feedbackPrompt: {
-            color: slateGrey[7],
-        },
-    },
-    dark: {
-        container: {
-            backgroundColor: 'transparent',
-            color: 'inherit',
-        },
-        searchInput: {
-            border: `1px solid ${slateGrey[5]}`,
-        },
-        item: {
-            backgroundColor: 'var(--sc-content-background)',
-            border: 'var(--sc-content-border)',
-        },
-        itemExpanded: {
-            boxShadow: '0 4px 12px rgba(0, 0, 0, 0.15)',
-        },
-        question: {
-            backgroundColor: 'transparent',
-            color: 'var(--sc-content-text-color)',
-        },
-        questionHover: {
-            backgroundColor: 'var(--sc-content-background-hover)',
-        },
-        answer: {
-            color: 'var(--sc-content-text-secondary-color)',
-        },
-        category: {
-            backgroundColor: purple[0],
-            color: purple[6],
-        },
-        categoryHeader: {
-            color: slateGrey[8],
-        },
-        emptyState: {
-            color: slateGrey[7],
-        },
-        feedbackPrompt: {
-            color: slateGrey[8],
-        },
-    },
-};
 function FAQItem({ item, isExpanded, isHighlighted, isLast, onToggle, theme, feedbackConfig, feedbackValue, onFeedback, }) {
     const [isHovered, setIsHovered] = useState(false);
     const colors = themeStyles[theme];
@@ -245,7 +66,8 @@ function FAQItem({ item, isExpanded, isHighlighted, isLast, onToggle, theme, fee
         ...(isExpanded ? colors.itemExpanded : {}),
         ...(isHighlighted
             ? {
-                boxShadow: '0 0 0 2px #6366f1, 0 0 12px rgba(99, 102, 241, 0.4)',
+                // purple[4] = #6a59ce — design system primary purple
+                boxShadow: `0 0 0 2px ${purple[4]}, 0 0 12px rgba(106, 89, 206, 0.4)`,
                 transition: 'box-shadow 0.3s ease',
             }
             : {}),
@@ -402,7 +224,7 @@ export function FAQWidget({ config, runtime, instanceId }) {
     }, [runtime, instanceId]);
     // Filter visible questions based on per-item triggerWhen
     // biome-ignore lint/correctness/useExhaustiveDependencies: renderTick is intentionally included to force re-evaluation when the runtime's mutable context changes (subscribed above via forceUpdate)
-    const visibleQuestions = useMemo(() => config.actions.filter((q) => {
+    const visibleQuestions = useMemo(() => (config.actions ?? []).filter((q) => {
         // No triggerWhen = always visible
         if (!q.triggerWhen)
             return true;
@@ -548,23 +370,6 @@ export const FAQMountableWidget = {
                 root.unmount();
             };
         }
-        // HTML fallback when React is not available
-        const questions = faqConfig.actions || [];
-        container.innerHTML = `
-      <div style="font-family: system-ui; max-width: 800px;">
-        ${questions
-            .map((q) => `
-          <div style="margin-bottom: 8px; padding: 16px; background: ${slateGrey[12]}; border-radius: 8px;">
-            <strong>${q.config.question}</strong>
-            <p style="margin-top: 8px; color: ${slateGrey[6]};">${getAnswerText(q.config.answer)}</p>
-          </div>
-        `)
-            .join('')}
-      </div>
-    `;
-        return () => {
-            container.innerHTML = '';
-        };
     },
 };
 export default FAQWidget;

package/dist/cdn.d.ts

@@ -29,9 +29,9 @@ export declare const manifest: {
             id: string;
             component: {
                 mount(container: HTMLElement, config?: import("./types").FAQConfig & {
-                    runtime?: import("./FAQWidget").FAQWidgetRuntime;
+                    runtime?: import("./faq-types").FAQWidgetRuntime;
                     instanceId?: string;
-                }): () => void;
+                }): (() => void) | undefined;
             };
             metadata: {
                 name: string;

package/dist/cdn.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"cdn.d.ts","sourceRoot":"","sources":["../src/cdn.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,SAA0B,MAAM,UAAU,CAAC;AAGlD;;;GAGG;AACH,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;2BAoCyjtB,CAAC;8BAA8B,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;+BAtBnltB,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;;;;;CAQjD,CAAC;AAaF,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"cdn.d.ts","sourceRoot":"","sources":["../src/cdn.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,SAA0B,MAAM,UAAU,CAAC;AAGlD;;;GAGG;AACH,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;2BAoCg4iB,CAAC;8BAA8B,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;+BAtB15iB,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;;;;;CAQjD,CAAC;AAaF,eAAe,QAAQ,CAAC"}

package/dist/faq-styles.d.ts

@@ -0,0 +1,198 @@
+/**
+ * Adaptive FAQ - Styles
+ *
+ * BaseStyles object (font, layout, colors, animations) and theme integration
+ * for the FAQWidget component.
+ */
+export declare const baseStyles: {
+    readonly container: {
+        readonly fontFamily: "var(--sc-font-family, system-ui, -apple-system, sans-serif)";
+        readonly maxWidth: "800px";
+        readonly margin: "0 auto";
+    };
+    readonly searchWrapper: {
+        readonly marginBottom: "8px";
+    };
+    readonly searchInput: {
+        readonly width: "100%";
+        readonly padding: "12px 16px";
+        readonly borderRadius: "8px";
+        readonly fontSize: "14px";
+        readonly outline: "none";
+        readonly transition: "border-color 0.15s ease";
+        readonly backgroundColor: "var(--sc-content-search-background)";
+        readonly color: "var(--sc-content-search-color)";
+    };
+    readonly accordion: {
+        readonly display: "flex";
+        readonly flexDirection: "column";
+        readonly gap: "var(--sc-content-item-gap, 6px)";
+    };
+    readonly item: {
+        readonly borderRadius: "var(--sc-content-border-radius, 8px)";
+        readonly overflow: "hidden";
+        readonly transition: "box-shadow 0.15s ease";
+    };
+    readonly question: {
+        readonly width: "100%";
+        readonly padding: "var(--sc-content-item-padding, 12px 16px)";
+        readonly display: "flex";
+        readonly alignItems: "center";
+        readonly justifyContent: "space-between";
+        readonly border: "none";
+        readonly cursor: "pointer";
+        readonly fontSize: "var(--sc-content-item-font-size, 15px)";
+        readonly fontWeight: 500;
+        readonly textAlign: "left";
+        readonly transition: "background-color 0.15s ease";
+    };
+    readonly chevron: {
+        readonly fontSize: "20px";
+        readonly transition: "transform 0.2s ease";
+        readonly color: "var(--sc-content-chevron-color, currentColor)";
+    };
+    readonly answer: {
+        readonly padding: "var(--sc-content-body-padding, 0 16px 12px 16px)";
+        readonly fontSize: "var(--sc-content-body-font-size, 14px)";
+        readonly lineHeight: 1.6;
+        readonly overflow: "hidden";
+        readonly transition: "max-height 0.2s ease, padding 0.2s ease";
+    };
+    readonly category: {
+        readonly display: "inline-block";
+        readonly fontSize: "11px";
+        readonly fontWeight: 600;
+        readonly textTransform: "uppercase";
+        readonly letterSpacing: "0.05em";
+        readonly padding: "4px 8px";
+        readonly borderRadius: "4px";
+        readonly marginBottom: "8px";
+    };
+    readonly categoryHeader: {
+        readonly fontSize: "var(--sc-content-category-font-size, 12px)";
+        readonly fontWeight: 700;
+        readonly textTransform: "uppercase";
+        readonly letterSpacing: "0.05em";
+        readonly padding: "var(--sc-content-category-padding, 8px 4px 4px 4px)";
+        readonly marginTop: "var(--sc-content-category-gap, 4px)";
+    };
+    readonly feedback: {
+        readonly display: "flex";
+        readonly alignItems: "center";
+        readonly gap: "8px";
+        readonly marginTop: "12px";
+        readonly paddingTop: "10px";
+        readonly borderTop: "1px solid rgba(0, 0, 0, 0.08)";
+        readonly fontSize: "13px";
+    };
+    readonly feedbackButton: {
+        readonly background: "none";
+        readonly border: "1px solid transparent";
+        readonly cursor: "pointer";
+        readonly fontSize: "16px";
+        readonly padding: "4px 8px";
+        readonly borderRadius: "4px";
+        readonly transition: "background-color 0.15s ease, border-color 0.15s ease";
+    };
+    readonly feedbackButtonSelected: {
+        readonly borderColor: "rgba(0, 0, 0, 0.2)";
+        readonly backgroundColor: "rgba(0, 0, 0, 0.04)";
+    };
+    readonly emptyState: {
+        readonly textAlign: "center";
+        readonly padding: "48px 24px";
+        readonly fontSize: "14px";
+    };
+    readonly noResults: {
+        readonly textAlign: "center";
+        readonly padding: "32px 16px";
+        readonly fontSize: "14px";
+    };
+};
+export declare const themeStyles: {
+    light: {
+        container: {
+            backgroundColor: string;
+            color: string;
+        };
+        searchInput: {
+            border: string;
+        };
+        item: {
+            backgroundColor: string;
+            borderTop: string;
+            borderRight: string;
+            borderBottom: string;
+            borderLeft: string;
+        };
+        itemExpanded: {
+            boxShadow: string;
+        };
+        question: {
+            backgroundColor: string;
+            color: string;
+        };
+        questionHover: {
+            backgroundColor: string;
+        };
+        answer: {
+            color: string;
+        };
+        category: {
+            backgroundColor: "#e1def5";
+            color: "#40357c";
+        };
+        categoryHeader: {
+            color: "#677384";
+        };
+        emptyState: {
+            color: "#87919f";
+        };
+        feedbackPrompt: {
+            color: "#677384";
+        };
+    };
+    dark: {
+        container: {
+            backgroundColor: string;
+            color: string;
+        };
+        searchInput: {
+            border: string;
+        };
+        item: {
+            backgroundColor: string;
+            borderTop: string;
+            borderRight: string;
+            borderBottom: string;
+            borderLeft: string;
+        };
+        itemExpanded: {
+            boxShadow: string;
+        };
+        question: {
+            backgroundColor: string;
+            color: string;
+        };
+        questionHover: {
+            backgroundColor: string;
+        };
+        answer: {
+            color: string;
+        };
+        category: {
+            backgroundColor: "#151229";
+            color: "#a69be2";
+        };
+        categoryHeader: {
+            color: "#87919f";
+        };
+        emptyState: {
+            color: "#677384";
+        };
+        feedbackPrompt: {
+            color: "#87919f";
+        };
+    };
+};
+//# sourceMappingURL=faq-styles.d.ts.map

package/dist/faq-styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"faq-styles.d.ts","sourceRoot":"","sources":["../src/faq-styles.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAQH,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAwGb,CAAC;AAMX,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAqFvB,CAAC"}