@walkeros/explorer 4.1.0-next-1778668930820 → 4.1.0

package/dist/index.d.cts

@@ -199,6 +199,10 @@ interface IntelliSenseContext {
     flows?: string[];
     /** Known environment variable names. If omitted, `$env.` offers only the prefix. */
     envNames?: string[];
+    /** Step type at the cursor. Scopes which `$`-refs the provider offers. */
+    nodeType?: 'source' | 'destination' | 'transformer' | 'store' | 'collector';
+    /** Path segments from the step root to the cursor (e.g. ['config','mapping']). */
+    subPath?: string[];
 }
 
 interface CodeProps {
@@ -645,11 +649,31 @@ interface CodeViewProps {
  */
 declare function CodeView({ code, language, tabs, activeTab: controlledActiveTab, onTabChange, defaultTab, label, header, showHeader, showTrafficLights, showCopy, footer, height, className, style, }: CodeViewProps): react_jsx_runtime.JSX.Element;
 
+/**
+ * Minimal "product add" example shown when a browser-source step provides no
+ * HTML of its own. Demonstrates an entity with a click:add action.
+ */
+declare const DEFAULT_FALLBACK_HTML = "<div data-elb=\"product\" data-elbaction=\"click:add\"><button data-elb-product=\"name:Example;price:9.99\">Add to cart</button></div>";
 interface PreviewProps {
-    html: string;
+    html?: string;
     css?: string;
+    js?: string;
     elb?: Elb.Fn;
     label?: string;
+    /**
+     * Opt-in editor tabs. When true, the header shows a `tabs` ButtonGroup to
+     * switch between the live Preview and editable HTML/CSS/JS (matching the
+     * playground BrowserBox). When false (default), only the static preview
+     * renders so existing plain `Preview` usage is unaffected.
+     */
+    editable?: boolean;
+    /** Tab selected first when `editable` is true. Defaults to `preview`. */
+    initialTab?: 'preview' | 'html' | 'css' | 'js';
+    onHtmlChange?: (value: string) => void;
+    onCssChange?: (value: string) => void;
+    onJsChange?: (value: string) => void;
+    lineNumbers?: boolean;
+    wordWrap?: boolean;
 }
 /**
  * Preview - HTML preview wrapped in a Box with highlight buttons
@@ -658,6 +682,11 @@ interface PreviewProps {
  * When elb is provided, initializes walkerOS browser source in iframe
  * that pushes events to the parent collector.
  *
+ * Load semantics mirror a real browser: `load` triggers (and pageview) fire
+ * once on the initial load and again only when the user clicks Reload. Editing
+ * the HTML/CSS re-renders the preview and keeps click capture working but does
+ * NOT re-fire load; toggling highlights only flips body classes.
+ *
  * @example
  * // Read-only preview
  * <Preview html={html} css={css} label="Preview" />
@@ -665,7 +694,7 @@ interface PreviewProps {
  * // Interactive preview with event capture (elb from parent collector)
  * <Preview html={html} css={css} elb={elb} label="Preview" />
  */
-declare function Preview({ html, css, elb, label, }: PreviewProps): react_jsx_runtime.JSX.Element;
+declare function Preview({ html, css, js, elb, label, editable, initialTab, onHtmlChange, onCssChange, onJsChange, lineNumbers, wordWrap, }: PreviewProps): react_jsx_runtime.JSX.Element;
 
 interface CodeDiffSummary {
     /** Count of hunks that exist only in modified (pure additions). */
@@ -847,14 +876,20 @@ interface ButtonGroupProps {
     }>;
     onButtonClick: (value: string) => void;
     className?: string;
+    /**
+     * Visual style. `segmented` is the bordered pill (default, used in footers
+     * and grids). `tabs` renders flat header tabs with a filled active state,
+     * matching the step-detail modal tab style for use in box headers.
+     */
+    variant?: 'segmented' | 'tabs';
 }
 /**
- * ButtonGroup - Segmented control for headers
+ * ButtonGroup - Segmented control or header tabs
  *
- * Displays multiple buttons in a grouped segmented control style.
- * Commonly used for tab switching (HTML/CSS/JS, etc.)
+ * Displays multiple buttons for switching between views (HTML/CSS/JS, etc.).
+ * `variant="tabs"` renders them as flat header tabs instead of a pill.
  */
-declare function ButtonGroup({ buttons, onButtonClick, className, }: ButtonGroupProps): react_jsx_runtime.JSX.Element;
+declare function ButtonGroup({ buttons, onButtonClick, className, variant, }: ButtonGroupProps): react_jsx_runtime.JSX.Element;
 
 interface ButtonLinkProps {
     variant?: 'default' | 'primary' | 'secondary';
@@ -1345,4 +1380,4 @@ declare function validateWalkerOSReferences(text: string, context: Partial<Intel
  */
 declare function extractFlowIntelliSenseContext(json: string): Partial<IntelliSenseContext>;
 
-export { ArchitectureFlow, type ArchitectureFlowProps, Box, type BoxProps, type BoxTab, BrowserBox, type BrowserBoxProps, Button, ButtonGroup, type ButtonGroupProps, ButtonLink, type ButtonLinkProps, type ButtonProps, Code, CodeBox, type CodeBoxProps, type CodeBoxTab, CodeDiff, CodeDiffBox, type CodeDiffBoxProps, type CodeDiffProps, type CodeDiffSummary, type CodeProps, CodeSnippet, type CodeSnippetProps, CodeStatic, type CodeStaticProps, CodeView, type CodeViewProps, type CodeViewTab, CollectorBox, type CollectorBoxProps, Dropdown, DropdownDivider, type DropdownDividerProps, DropdownItem, type DropdownItemProps, type DropdownProps, type ExplorerTheme, type FlowColumn, type FlowItem, FlowMap, type FlowMapProps, type FlowSection, type FlowStageConfig, Footer, type FooterProps, Grid, type GridProps, Header, type HeaderProps, type IntelliSenseContext, LiveCode, type LiveCodeProps, type LoadPackageTypesOptions, MDXCode, MDXProvider, type MonacoSchemaExtension, type PackageInfo, Preview, type PreviewProps, PromotionPlayground, type PromotionPlaygroundProps, PropertyTable, type PropertyTableProps, REFERENCE_PATTERNS, Spinner, type SpinnerProps, type UseDropdownReturn, applyWalkerOSDecorations, cn, createFbqDestination, createGtagDestination, createPlausibleDestination, disposeWalkerOSProviders, enrichFlowConfigSchema, enrichSchema, extractFlowIntelliSenseContext, findWalkerOSReferences, generateModelPath, getEnrichedContractSchema, getVariablesSchema, initializeMonacoTypes, isMonacoCancellation, lighthouseTheme, loadPackageTypes, loadTypeLibraryFromURL, palenightTheme, registerAllThemes, registerJsonSchema, registerLighthouseTheme, registerPalenightTheme, registerWalkerOSDecorationStyles, registerWalkerOSProviders, registerWalkerOSTypes, removeIntelliSenseContext, resolveTypesUrl, setIntelliSenseContext, setPackageTypesBaseUrl, unregisterJsonSchema, useDropdown, validateWalkerOSReferences };
+export { ArchitectureFlow, type ArchitectureFlowProps, Box, type BoxProps, type BoxTab, BrowserBox, type BrowserBoxProps, Button, ButtonGroup, type ButtonGroupProps, ButtonLink, type ButtonLinkProps, type ButtonProps, Code, CodeBox, type CodeBoxProps, type CodeBoxTab, CodeDiff, CodeDiffBox, type CodeDiffBoxProps, type CodeDiffProps, type CodeDiffSummary, type CodeProps, CodeSnippet, type CodeSnippetProps, CodeStatic, type CodeStaticProps, CodeView, type CodeViewProps, type CodeViewTab, CollectorBox, type CollectorBoxProps, DEFAULT_FALLBACK_HTML, Dropdown, DropdownDivider, type DropdownDividerProps, DropdownItem, type DropdownItemProps, type DropdownProps, type ExplorerTheme, type FlowColumn, type FlowItem, FlowMap, type FlowMapProps, type FlowSection, type FlowStageConfig, Footer, type FooterProps, Grid, type GridProps, Header, type HeaderProps, type IntelliSenseContext, LiveCode, type LiveCodeProps, type LoadPackageTypesOptions, MDXCode, MDXProvider, type MonacoSchemaExtension, type PackageInfo, Preview, type PreviewProps, PromotionPlayground, type PromotionPlaygroundProps, PropertyTable, type PropertyTableProps, REFERENCE_PATTERNS, Spinner, type SpinnerProps, type UseDropdownReturn, applyWalkerOSDecorations, cn, createFbqDestination, createGtagDestination, createPlausibleDestination, disposeWalkerOSProviders, enrichFlowConfigSchema, enrichSchema, extractFlowIntelliSenseContext, findWalkerOSReferences, generateModelPath, getEnrichedContractSchema, getVariablesSchema, initializeMonacoTypes, isMonacoCancellation, lighthouseTheme, loadPackageTypes, loadTypeLibraryFromURL, palenightTheme, registerAllThemes, registerJsonSchema, registerLighthouseTheme, registerPalenightTheme, registerWalkerOSDecorationStyles, registerWalkerOSProviders, registerWalkerOSTypes, removeIntelliSenseContext, resolveTypesUrl, setIntelliSenseContext, setPackageTypesBaseUrl, unregisterJsonSchema, useDropdown, validateWalkerOSReferences };

package/dist/index.d.ts

@@ -199,6 +199,10 @@ interface IntelliSenseContext {
     flows?: string[];
     /** Known environment variable names. If omitted, `$env.` offers only the prefix. */
     envNames?: string[];
+    /** Step type at the cursor. Scopes which `$`-refs the provider offers. */
+    nodeType?: 'source' | 'destination' | 'transformer' | 'store' | 'collector';
+    /** Path segments from the step root to the cursor (e.g. ['config','mapping']). */
+    subPath?: string[];
 }
 
 interface CodeProps {
@@ -645,11 +649,31 @@ interface CodeViewProps {
  */
 declare function CodeView({ code, language, tabs, activeTab: controlledActiveTab, onTabChange, defaultTab, label, header, showHeader, showTrafficLights, showCopy, footer, height, className, style, }: CodeViewProps): react_jsx_runtime.JSX.Element;
 
+/**
+ * Minimal "product add" example shown when a browser-source step provides no
+ * HTML of its own. Demonstrates an entity with a click:add action.
+ */
+declare const DEFAULT_FALLBACK_HTML = "<div data-elb=\"product\" data-elbaction=\"click:add\"><button data-elb-product=\"name:Example;price:9.99\">Add to cart</button></div>";
 interface PreviewProps {
-    html: string;
+    html?: string;
     css?: string;
+    js?: string;
     elb?: Elb.Fn;
     label?: string;
+    /**
+     * Opt-in editor tabs. When true, the header shows a `tabs` ButtonGroup to
+     * switch between the live Preview and editable HTML/CSS/JS (matching the
+     * playground BrowserBox). When false (default), only the static preview
+     * renders so existing plain `Preview` usage is unaffected.
+     */
+    editable?: boolean;
+    /** Tab selected first when `editable` is true. Defaults to `preview`. */
+    initialTab?: 'preview' | 'html' | 'css' | 'js';
+    onHtmlChange?: (value: string) => void;
+    onCssChange?: (value: string) => void;
+    onJsChange?: (value: string) => void;
+    lineNumbers?: boolean;
+    wordWrap?: boolean;
 }
 /**
  * Preview - HTML preview wrapped in a Box with highlight buttons
@@ -658,6 +682,11 @@ interface PreviewProps {
  * When elb is provided, initializes walkerOS browser source in iframe
  * that pushes events to the parent collector.
  *
+ * Load semantics mirror a real browser: `load` triggers (and pageview) fire
+ * once on the initial load and again only when the user clicks Reload. Editing
+ * the HTML/CSS re-renders the preview and keeps click capture working but does
+ * NOT re-fire load; toggling highlights only flips body classes.
+ *
  * @example
  * // Read-only preview
  * <Preview html={html} css={css} label="Preview" />
@@ -665,7 +694,7 @@ interface PreviewProps {
  * // Interactive preview with event capture (elb from parent collector)
  * <Preview html={html} css={css} elb={elb} label="Preview" />
  */
-declare function Preview({ html, css, elb, label, }: PreviewProps): react_jsx_runtime.JSX.Element;
+declare function Preview({ html, css, js, elb, label, editable, initialTab, onHtmlChange, onCssChange, onJsChange, lineNumbers, wordWrap, }: PreviewProps): react_jsx_runtime.JSX.Element;
 
 interface CodeDiffSummary {
     /** Count of hunks that exist only in modified (pure additions). */
@@ -847,14 +876,20 @@ interface ButtonGroupProps {
     }>;
     onButtonClick: (value: string) => void;
     className?: string;
+    /**
+     * Visual style. `segmented` is the bordered pill (default, used in footers
+     * and grids). `tabs` renders flat header tabs with a filled active state,
+     * matching the step-detail modal tab style for use in box headers.
+     */
+    variant?: 'segmented' | 'tabs';
 }
 /**
- * ButtonGroup - Segmented control for headers
+ * ButtonGroup - Segmented control or header tabs
  *
- * Displays multiple buttons in a grouped segmented control style.
- * Commonly used for tab switching (HTML/CSS/JS, etc.)
+ * Displays multiple buttons for switching between views (HTML/CSS/JS, etc.).
+ * `variant="tabs"` renders them as flat header tabs instead of a pill.
  */
-declare function ButtonGroup({ buttons, onButtonClick, className, }: ButtonGroupProps): react_jsx_runtime.JSX.Element;
+declare function ButtonGroup({ buttons, onButtonClick, className, variant, }: ButtonGroupProps): react_jsx_runtime.JSX.Element;
 
 interface ButtonLinkProps {
     variant?: 'default' | 'primary' | 'secondary';
@@ -1345,4 +1380,4 @@ declare function validateWalkerOSReferences(text: string, context: Partial<Intel
  */
 declare function extractFlowIntelliSenseContext(json: string): Partial<IntelliSenseContext>;
 
-export { ArchitectureFlow, type ArchitectureFlowProps, Box, type BoxProps, type BoxTab, BrowserBox, type BrowserBoxProps, Button, ButtonGroup, type ButtonGroupProps, ButtonLink, type ButtonLinkProps, type ButtonProps, Code, CodeBox, type CodeBoxProps, type CodeBoxTab, CodeDiff, CodeDiffBox, type CodeDiffBoxProps, type CodeDiffProps, type CodeDiffSummary, type CodeProps, CodeSnippet, type CodeSnippetProps, CodeStatic, type CodeStaticProps, CodeView, type CodeViewProps, type CodeViewTab, CollectorBox, type CollectorBoxProps, Dropdown, DropdownDivider, type DropdownDividerProps, DropdownItem, type DropdownItemProps, type DropdownProps, type ExplorerTheme, type FlowColumn, type FlowItem, FlowMap, type FlowMapProps, type FlowSection, type FlowStageConfig, Footer, type FooterProps, Grid, type GridProps, Header, type HeaderProps, type IntelliSenseContext, LiveCode, type LiveCodeProps, type LoadPackageTypesOptions, MDXCode, MDXProvider, type MonacoSchemaExtension, type PackageInfo, Preview, type PreviewProps, PromotionPlayground, type PromotionPlaygroundProps, PropertyTable, type PropertyTableProps, REFERENCE_PATTERNS, Spinner, type SpinnerProps, type UseDropdownReturn, applyWalkerOSDecorations, cn, createFbqDestination, createGtagDestination, createPlausibleDestination, disposeWalkerOSProviders, enrichFlowConfigSchema, enrichSchema, extractFlowIntelliSenseContext, findWalkerOSReferences, generateModelPath, getEnrichedContractSchema, getVariablesSchema, initializeMonacoTypes, isMonacoCancellation, lighthouseTheme, loadPackageTypes, loadTypeLibraryFromURL, palenightTheme, registerAllThemes, registerJsonSchema, registerLighthouseTheme, registerPalenightTheme, registerWalkerOSDecorationStyles, registerWalkerOSProviders, registerWalkerOSTypes, removeIntelliSenseContext, resolveTypesUrl, setIntelliSenseContext, setPackageTypesBaseUrl, unregisterJsonSchema, useDropdown, validateWalkerOSReferences };
+export { ArchitectureFlow, type ArchitectureFlowProps, Box, type BoxProps, type BoxTab, BrowserBox, type BrowserBoxProps, Button, ButtonGroup, type ButtonGroupProps, ButtonLink, type ButtonLinkProps, type ButtonProps, Code, CodeBox, type CodeBoxProps, type CodeBoxTab, CodeDiff, CodeDiffBox, type CodeDiffBoxProps, type CodeDiffProps, type CodeDiffSummary, type CodeProps, CodeSnippet, type CodeSnippetProps, CodeStatic, type CodeStaticProps, CodeView, type CodeViewProps, type CodeViewTab, CollectorBox, type CollectorBoxProps, DEFAULT_FALLBACK_HTML, Dropdown, DropdownDivider, type DropdownDividerProps, DropdownItem, type DropdownItemProps, type DropdownProps, type ExplorerTheme, type FlowColumn, type FlowItem, FlowMap, type FlowMapProps, type FlowSection, type FlowStageConfig, Footer, type FooterProps, Grid, type GridProps, Header, type HeaderProps, type IntelliSenseContext, LiveCode, type LiveCodeProps, type LoadPackageTypesOptions, MDXCode, MDXProvider, type MonacoSchemaExtension, type PackageInfo, Preview, type PreviewProps, PromotionPlayground, type PromotionPlaygroundProps, PropertyTable, type PropertyTableProps, REFERENCE_PATTERNS, Spinner, type SpinnerProps, type UseDropdownReturn, applyWalkerOSDecorations, cn, createFbqDestination, createGtagDestination, createPlausibleDestination, disposeWalkerOSProviders, enrichFlowConfigSchema, enrichSchema, extractFlowIntelliSenseContext, findWalkerOSReferences, generateModelPath, getEnrichedContractSchema, getVariablesSchema, initializeMonacoTypes, isMonacoCancellation, lighthouseTheme, loadPackageTypes, loadTypeLibraryFromURL, palenightTheme, registerAllThemes, registerJsonSchema, registerLighthouseTheme, registerPalenightTheme, registerWalkerOSDecorationStyles, registerWalkerOSProviders, registerWalkerOSTypes, removeIntelliSenseContext, resolveTypesUrl, setIntelliSenseContext, setPackageTypesBaseUrl, unregisterJsonSchema, useDropdown, validateWalkerOSReferences };