@syntrologie/runtime-sdk 2.4.0-canary.23 → 2.4.0-canary.25

package/dist/decisions/schema.js

@@ -20,12 +20,13 @@ import {
   ScoreStrategyZ,
   SessionMetricConditionZ,
   StateEqualsConditionZ,
+  TriggerWhenZ,
   ViewportConditionZ,
   decisionSchemas,
   validateActivationConfig,
   validateCondition,
   validateStrategy
-} from "../chunk-P5G4KT2U.js";
+} from "../chunk-BU4Z6PD7.js";
 export {
   ActivationConfigZ,
   AnchorVisibleConditionZ,
@@ -48,6 +49,7 @@ export {
   ScoreStrategyZ,
   SessionMetricConditionZ,
   StateEqualsConditionZ,
+  TriggerWhenZ,
   ViewportConditionZ,
   decisionSchemas,
   validateActivationConfig,

package/dist/decisions/types.d.ts

@@ -256,8 +256,8 @@ export interface RouteFilter {
 export interface ActivationConfig {
     /** Route-based filtering */
     routes?: RouteFilter;
-    /** Decision strategy for conditional rendering */
-    strategy?: DecisionStrategy<boolean>;
+    /** When true, tile is hidden if none of its props.actions[] have an active triggerWhen. Default: false. */
+    onlyIfPopulated?: boolean;
 }
 /**
  * Extended context for strategy evaluation.

package/dist/index.js

@@ -100,7 +100,7 @@ import {
   validateAction,
   validateActions,
   widgetRegistry
-} from "./chunk-FFIHKDHW.js";
+} from "./chunk-2WDY7YGN.js";
 import {
   AddClassZ,
   AnchorIdZ,
@@ -134,8 +134,8 @@ import {
   WaitZ,
   WidgetConfigZ,
   coreActionStepSchemas
-} from "./chunk-MCX3AKSH.js";
-import "./chunk-5SKKLUOS.js";
+} from "./chunk-YZ27S3HX.js";
+import "./chunk-7OZFA3CQ.js";
 import {
   ActivationConfigZ,
   AnchorVisibleConditionZ,
@@ -158,12 +158,13 @@ import {
   ScoreStrategyZ,
   SessionMetricConditionZ,
   StateEqualsConditionZ,
+  TriggerWhenZ,
   ViewportConditionZ,
   decisionSchemas,
   validateActivationConfig,
   validateCondition,
   validateStrategy
-} from "./chunk-P5G4KT2U.js";
+} from "./chunk-BU4Z6PD7.js";
 
 // src/index.ts
 import React4 from "react";
@@ -659,7 +660,7 @@ function getFeedbackPrompt(feedbackConfig) {
 }
 var baseStyles = {
   container: {
-    fontFamily: "system-ui, -apple-system, sans-serif",
+    fontFamily: "var(--sc-font-family, system-ui, -apple-system, sans-serif)",
     maxWidth: "800px",
     margin: "0 auto"
   },
@@ -672,7 +673,9 @@ var baseStyles = {
     borderRadius: "8px",
     fontSize: "14px",
     outline: "none",
-    transition: "border-color 0.15s ease"
+    transition: "border-color 0.15s ease",
+    backgroundColor: "var(--sc-content-search-background)",
+    color: "var(--sc-content-search-color)"
   },
   accordion: {
     display: "flex",
@@ -698,8 +701,9 @@ var baseStyles = {
     transition: "background-color 0.15s ease"
   },
   chevron: {
-    fontSize: "18px",
-    transition: "transform 0.2s ease"
+    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)",
@@ -766,9 +770,7 @@ var themeStyles = {
       color: "inherit"
     },
     searchInput: {
-      backgroundColor: slateGrey[12],
-      border: `1px solid ${slateGrey[11]}`,
-      color: slateGrey[1]
+      border: `1px solid ${slateGrey[11]}`
     },
     item: {
       backgroundColor: "var(--sc-content-background)",
@@ -807,9 +809,7 @@ var themeStyles = {
       color: "inherit"
     },
     searchInput: {
-      backgroundColor: slateGrey[3],
-      border: `1px solid ${slateGrey[5]}`,
-      color: slateGrey[12]
+      border: `1px solid ${slateGrey[5]}`
     },
     item: {
       backgroundColor: "var(--sc-content-background)",
@@ -843,7 +843,7 @@ var themeStyles = {
     }
   }
 };
-function FAQItem({ item, isExpanded, isHighlighted, onToggle, theme, feedbackConfig, feedbackValue, onFeedback }) {
+function FAQItem({ item, isExpanded, isHighlighted, isLast, onToggle, theme, feedbackConfig, feedbackValue, onFeedback }) {
   const [isHovered, setIsHovered] = useState2(false);
   const colors = themeStyles[theme];
   const { question, answer } = item.config;
@@ -854,7 +854,8 @@ function FAQItem({ item, isExpanded, isHighlighted, onToggle, theme, feedbackCon
     ...isHighlighted ? {
       boxShadow: "0 0 0 2px #6366f1, 0 0 12px rgba(99, 102, 241, 0.4)",
       transition: "box-shadow 0.3s ease"
-    } : {}
+    } : {},
+    ...!isLast ? { borderBottom: "var(--sc-content-item-divider, none)" } : {}
   };
   const questionStyle = {
     ...baseStyles.question,
@@ -863,7 +864,7 @@ function FAQItem({ item, isExpanded, isHighlighted, onToggle, theme, feedbackCon
   };
   const chevronStyle = {
     ...baseStyles.chevron,
-    transform: isExpanded ? "rotate(180deg)" : "rotate(0deg)"
+    transform: isExpanded ? "rotate(90deg)" : "rotate(0deg)"
   };
   const answerStyle = {
     ...baseStyles.answer,
@@ -875,7 +876,7 @@ function FAQItem({ item, isExpanded, isHighlighted, onToggle, theme, feedbackCon
     ...baseStyles.feedback,
     ...colors.feedbackPrompt
   };
-  return _jsxs2("div", { style: itemStyle, "data-faq-item-id": item.config.id, children: [_jsxs2("button", { type: "button", style: questionStyle, onClick: onToggle, onMouseEnter: () => setIsHovered(true), onMouseLeave: () => setIsHovered(false), "aria-expanded": isExpanded, children: [_jsx2("span", { children: question }), _jsx2("span", { style: chevronStyle, children: "\u25BC" })] }), _jsxs2("div", { style: answerStyle, "aria-hidden": !isExpanded, children: [renderAnswer(answer), isExpanded && feedbackConfig && _jsxs2("div", { style: feedbackStyle, children: [_jsx2("span", { children: getFeedbackPrompt(feedbackConfig) }), _jsx2("button", { type: "button", style: {
+  return _jsxs2("div", { style: itemStyle, "data-faq-item-id": item.config.id, children: [_jsxs2("button", { type: "button", style: questionStyle, onClick: onToggle, onMouseEnter: () => setIsHovered(true), onMouseLeave: () => setIsHovered(false), "aria-expanded": isExpanded, children: [_jsx2("span", { children: question }), _jsx2("span", { style: chevronStyle, children: "\u203A" })] }), _jsxs2("div", { style: answerStyle, "aria-hidden": !isExpanded, children: [renderAnswer(answer), isExpanded && feedbackConfig && _jsxs2("div", { style: feedbackStyle, children: [_jsx2("span", { children: getFeedbackPrompt(feedbackConfig) }), _jsx2("button", { type: "button", style: {
     ...baseStyles.feedbackButton,
     ...feedbackValue === "up" ? baseStyles.feedbackButtonSelected : {}
   }, "aria-label": "Thumbs up", onClick: () => onFeedback(item.config.id, question, "up"), children: "\u{1F44D}" }), _jsx2("button", { type: "button", style: {
@@ -1070,11 +1071,11 @@ function FAQWidget({ config, runtime: runtime7, instanceId }) {
     ...baseStyles.categoryHeader,
     ...themeStyles[resolvedTheme].categoryHeader
   };
-  const renderItems = (items) => items.map((q) => _jsx2(FAQItem, { item: q, isExpanded: expandedIds.has(q.config.id), isHighlighted: highlightId === q.config.id, onToggle: () => handleToggle(q.config.id), theme: resolvedTheme, feedbackConfig, feedbackValue: feedbackState.get(q.config.id), onFeedback: handleFeedback }, q.config.id));
+  const renderItems = (items) => items.map((q, index) => _jsx2(FAQItem, { item: q, isExpanded: expandedIds.has(q.config.id), isHighlighted: highlightId === q.config.id, isLast: index === items.length - 1, onToggle: () => handleToggle(q.config.id), theme: resolvedTheme, feedbackConfig, feedbackValue: feedbackState.get(q.config.id), onFeedback: handleFeedback }, q.config.id));
   if (visibleQuestions.length === 0) {
-    return _jsx2("div", { style: containerStyle, "data-adaptive-id": instanceId, "data-adaptive-type": "adaptive-faq", children: _jsx2("div", { style: emptyStateStyle, children: "No FAQ questions available." }) });
+    return _jsx2("div", { style: containerStyle, "data-adaptive-id": instanceId, "data-adaptive-type": "adaptive-faq", children: _jsx2("div", { style: emptyStateStyle, children: "You're all set for now! We'll surface answers here when they're relevant to what you're doing." }) });
   }
-  return _jsxs2("div", { style: containerStyle, "data-adaptive-id": instanceId, "data-adaptive-type": "adaptive-faq", children: [config.searchable && _jsx2("div", { style: baseStyles.searchWrapper, children: _jsx2("input", { type: "text", placeholder: "Search questions...", value: searchQuery, onChange: (e) => setSearchQuery(e.target.value), style: searchInputStyle }) }), _jsx2("div", { style: baseStyles.accordion, children: hasCategories ? Array.from(categoryGroups.entries()).map(([category, items]) => _jsxs2(React2.Fragment, { children: [category && _jsx2("div", { style: categoryHeaderStyle, "data-category-header": category, children: category }), renderItems(items)] }, category != null ? category : "__ungrouped")) : renderItems(filteredQuestions) }), config.searchable && filteredQuestions.length === 0 && searchQuery && _jsxs2("div", { style: { ...baseStyles.noResults, ...themeStyles[resolvedTheme].emptyState }, children: ['No questions found matching "', searchQuery, '"'] })] });
+  return _jsxs2("div", { style: containerStyle, "data-adaptive-id": instanceId, "data-adaptive-type": "adaptive-faq", children: [config.searchable && _jsxs2("div", { style: baseStyles.searchWrapper, children: [_jsx2("style", { children: `[data-adaptive-id="${instanceId}"] input::placeholder { color: var(--sc-content-search-color, inherit); opacity: 0.7; }` }), _jsx2("input", { type: "text", placeholder: "Search questions...", value: searchQuery, onChange: (e) => setSearchQuery(e.target.value), style: searchInputStyle })] }), _jsx2("div", { style: baseStyles.accordion, children: hasCategories ? Array.from(categoryGroups.entries()).map(([category, items]) => _jsxs2(React2.Fragment, { children: [category && _jsx2("div", { style: categoryHeaderStyle, "data-category-header": category, children: category }), renderItems(items)] }, category != null ? category : "__ungrouped")) : renderItems(filteredQuestions) }), config.searchable && filteredQuestions.length === 0 && searchQuery && _jsxs2("div", { style: { ...baseStyles.noResults, ...themeStyles[resolvedTheme].emptyState }, children: ['No questions found matching "', searchQuery, '"'] })] });
 }
 var FAQMountableWidget = {
   mount(container, config) {
@@ -1132,7 +1133,8 @@ var runtime4 = {
       metadata: {
         name: "FAQ Accordion",
         description: "Collapsible Q&A accordion with search, categories, and feedback",
-        icon: "\u2753"
+        icon: "\u2753",
+        subtitle: "Curated just for you."
       }
     }
   ],
@@ -1504,7 +1506,7 @@ function NavWidget({ config, runtime: runtime7, instanceId }) {
   };
   const renderItems = (items) => items.map((tip, index) => _jsx3(NavTipItem, { item: tip, isExpanded: expandedIds.has(tip.config.id), isLast: index === items.length - 1, onToggle: () => handleToggle(tip.config.id), onNavigate: handleNavigate, theme: resolvedTheme }, tip.config.id));
   if (visibleTips.length === 0) {
-    return _jsx3("div", { style: containerStyle, "data-adaptive-id": instanceId, "data-adaptive-type": "adaptive-nav", children: _jsx3("div", { style: emptyStateStyle, children: "No navigation tips available." }) });
+    return _jsx3("div", { style: containerStyle, "data-adaptive-id": instanceId, "data-adaptive-type": "adaptive-nav", children: _jsx3("div", { style: emptyStateStyle, children: "You're all set for now! We'll share helpful tips here when they're relevant to what you're doing." }) });
   }
   return _jsx3("div", { style: containerStyle, "data-adaptive-id": instanceId, "data-adaptive-type": "adaptive-nav", children: _jsx3("div", { style: baseStyles2.accordion, children: hasCategories ? Array.from(categoryGroups.entries()).map(([category, items]) => _jsxs3(React3.Fragment, { children: [category && _jsx3("div", { style: categoryHeaderStyle, "data-category-header": category, children: category }), renderItems(items)] }, category != null ? category : "__ungrouped")) : renderItems(visibleTips) }) });
 }
@@ -1831,18 +1833,7 @@ function migrateV1ToV2(config) {
   if (config.tiles && Array.isArray(config.tiles)) {
     migrated.tiles = config.tiles.map((tile) => {
       const migratedTile = { ...tile };
-      if (tile.experiment && !tile.activation) {
-        const exp = tile.experiment;
-        if (exp.featureKey) {
-          migratedTile.activation = {
-            strategy: {
-              type: "external",
-              provider: "growthbook",
-              featureKey: exp.featureKey,
-              fallback: false
-            }
-          };
-        }
+      if (tile.experiment) {
         delete migratedTile.experiment;
       }
       return migratedTile;
@@ -2150,6 +2141,7 @@ export {
   TooltipZ,
   TourStepForSchemaZ,
   TourZ,
+  TriggerWhenZ,
   ViewportConditionZ,
   ViewportContextZ,
   WaitZ,