@wildo-ai/saas-frontend-lib 1.0.1

package/dist/esm/components/views/execution-view/ExecutionView.js

@@ -0,0 +1,122 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import React, { useEffect, useMemo, useState } from 'react';
+import { resolveExecutionViewDefinition, } from '../../../core/config/execution-view.schemas.js';
+import { ScopeUtilsService } from '../../../core/scope/scope.utils.frontend.service.js';
+import { useAppScopeSafe } from '../../../core/scope/useAppScope.js';
+import { ViewNotFound } from '../../../components/views/ViewNotFound.js';
+import { useResourceRegistry } from '../../../core/resources/useResourceRegistry.js';
+import { useNavigationController } from '../../../core/navigation/useNavigationController.js';
+import { NavigationZone } from '../../../core/navigation/navigation.schemas.js';
+import { ExecutionRuntimeProvider, } from '../../../core/execution/ExecutionRuntimeContext.js';
+import { resolveExecutionAnchor } from '../../../core/execution/execution-anchor.utils.js';
+function createRuntimeInstanceId() {
+    if (typeof crypto !== 'undefined' && typeof crypto.randomUUID === 'function') {
+        return `execution-${crypto.randomUUID()}`;
+    }
+    return `execution-${Date.now()}-${Math.random().toString(36).slice(2, 10)}`;
+}
+/**
+ * Framework-owned execution host.
+ *
+ * This component intentionally mirrors the scope-resolution model already used by
+ * `FullCustomView`, but adds a minimal execution runtime provider so later slices
+ * can grow execution-specific hooks without changing the routed host seam.
+ */
+export const ExecutionView = ({ viewRef, viewDefinition: viewDefinitionProp, contextResourceIdentifiers: contextResourceIdentifiersProp, navigationZone = NavigationZone.PRIMARY, }) => {
+    const appScope = useAppScopeSafe();
+    const { doOperation, registry } = useResourceRegistry();
+    const { navigate } = useNavigationController();
+    const [localPane, setLocalPane] = useState(null);
+    const viewDefinition = viewDefinitionProp ?? resolveExecutionViewDefinition({
+        viewRef,
+        registry,
+    });
+    const runtimeInstanceId = useMemo(() => createRuntimeInstanceId(), [viewDefinition?.ref]);
+    useEffect(() => {
+        if (process.env.NODE_ENV === 'production'
+            || viewDefinition
+            || !viewRef
+            || !contextResourceIdentifiersProp
+            || Object.keys(contextResourceIdentifiersProp).length === 0) {
+            return;
+        }
+        console.warn('[ExecutionView] Cannot validate explicit view context bindings because the view definition could not be resolved', {
+            surfaceName: 'ExecutionView',
+            surfaceRef: viewRef,
+            explicitContextResourceIdentifiers: contextResourceIdentifiersProp,
+        });
+    }, [contextResourceIdentifiersProp, viewDefinition, viewRef]);
+    const contextResourceIdentifiers = useMemo(() => {
+        const primaryScopeInitiatorIds = ScopeUtilsService.buildInitiatorIds({
+            userId: appScope?.currentUserId,
+            organizationId: appScope?.currentOrganizationId,
+            applicationId: appScope?.currentApplicationId,
+            anonymousUserId: appScope?.currentAnonymousUserId,
+        });
+        const primaryScopeContext = viewDefinition?.primaryScope
+            ? ScopeUtilsService.primaryScopeToContextIdentifiers(primaryScopeInitiatorIds, viewDefinition.primaryScope)
+            : {};
+        const liveAppScopeContext = appScope?.buildContextResourceIdentifiers() ?? {};
+        const customScopeContext = ScopeUtilsService.filterCustomScopeContextResourceIdentifiers(liveAppScopeContext);
+        if (!viewDefinition) {
+            return ScopeUtilsService.mergeContextResourceIdentifiers(primaryScopeContext, customScopeContext, contextResourceIdentifiersProp);
+        }
+        return ScopeUtilsService.resolveViewContextResourceIdentifiers({
+            surfaceName: 'ExecutionView',
+            surfaceRef: viewDefinition.ref,
+            primaryScope: viewDefinition.primaryScope,
+            parentResourcesRequirements: viewDefinition.parentResourcesRequirements,
+            additionalResourceRequirements: viewDefinition.additionalResourceRequirements,
+            primaryScopeContext,
+            customScopeContext,
+            explicitContextResourceIdentifiers: contextResourceIdentifiersProp,
+        });
+    }, [
+        contextResourceIdentifiersProp,
+        viewDefinition?.primaryScope,
+        viewDefinition?.ref,
+        viewDefinition?.parentResourcesRequirements,
+        viewDefinition?.additionalResourceRequirements,
+        appScope?.currentUserId,
+        appScope?.currentOrganizationId,
+        appScope?.currentApplicationId,
+        appScope?.currentAnonymousUserId,
+        appScope,
+    ]);
+    const anchor = useMemo(() => {
+        if (!viewDefinition) {
+            return null;
+        }
+        return resolveExecutionAnchor(viewDefinition, contextResourceIdentifiersProp);
+    }, [viewDefinition, contextResourceIdentifiersProp]);
+    const runtimeState = useMemo(() => ({
+        localPane,
+    }), [localPane]);
+    const navigation = useMemo(() => ({
+        delegateToParent: (options) => {
+            navigate({
+                content: options.content,
+                urlPath: options.urlPath,
+                contextResourceIdentifiers: options.contextResourceIdentifiers,
+                relationshipTransition: options.relationshipTransition,
+                initiator: {
+                    sourceZone: navigationZone,
+                    ...(options.initiator ?? {}),
+                },
+            });
+        },
+        openLocalPane: (paneId, payload) => {
+            setLocalPane({ paneId, payload });
+        },
+        closeLocalPane: () => {
+            setLocalPane(null);
+        },
+    }), [navigate, navigationZone]);
+    if (!viewDefinition) {
+        return _jsx(ViewNotFound, { viewType: "Execution view", viewRef: viewRef });
+    }
+    const ExecutionComponent = viewDefinition.viewComponent;
+    return (_jsx(ExecutionRuntimeProvider, { viewDefinition: viewDefinition, contextResourceIdentifiers: contextResourceIdentifiers, runtimeInstanceId: runtimeInstanceId, navigationZone: navigationZone, doOperation: doOperation, navigation: navigation, anchor: anchor, runtimeState: runtimeState, children: _jsx(React.Suspense, { fallback: _jsx("div", { className: "h-8 animate-pulse motion-reduce:animate-none bg-muted rounded", "aria-hidden": "true" }), children: _jsx(ExecutionComponent, { viewRef: viewDefinition.ref, viewDefinition: viewDefinition, contextResourceIdentifiers: contextResourceIdentifiers }) }) }));
+};
+export default ExecutionView;
+//# sourceMappingURL=ExecutionView.js.map

package/dist/esm/components/views/execution-view/ExecutionView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ExecutionView.js","sourceRoot":"","sources":["../../../../../src/components/views/execution-view/ExecutionView.tsx"],"names":[],"mappings":"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"}

package/dist/esm/components/views/flows-actors-view/FlowsActorsView.d.ts

@@ -0,0 +1,35 @@
+import React from 'react';
+import type { FlowsActorsViewDefinition } from '../../../core/config/flows-actors-view.schemas.js';
+/**
+ * FlowsActorsView Props
+ */
+export interface FlowsActorsViewProps {
+    /** View reference — resolved from UIContext internally. Mutually exclusive with `viewDefinition`. */
+    viewRef?: string;
+    /** Pre-resolved view definition. When provided, viewRef is ignored. */
+    viewDefinition?: FlowsActorsViewDefinition;
+    /**
+     * Context resource identifiers for scope.
+     * When provided (e.g. from NavigationContentAreas), these are treated as
+     * explicit navigation-time overrides and merged last over the live AppScope
+     * context resolved by this view.
+     * When omitted (e.g. URL-based routing), scope is self-resolved from the
+     * canonical AppScope primary snapshot using the view definition's primaryScope.
+     */
+    contextResourceIdentifiers?: Record<string, string>;
+}
+/**
+ * FlowsActorsView Layout Component (Placeholder)
+ *
+ * This component renders a view that exposes one or more FlowActorSystems
+ * for human-in-the-loop interactions and workflow orchestration.
+ *
+ * TODO: Implement:
+ * - Integration with FlowsActorsContext
+ * - Conversation interface using LOW_LEVEL_AI_* components
+ * - Approval request handling
+ * - WebSocket-based real-time updates
+ */
+export declare const FlowsActorsView: React.FC<FlowsActorsViewProps>;
+export default FlowsActorsView;
+//# sourceMappingURL=FlowsActorsView.d.ts.map

package/dist/esm/components/views/flows-actors-view/FlowsActorsView.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FlowsActorsView.d.ts","sourceRoot":"","sources":["../../../../../src/components/views/flows-actors-view/FlowsActorsView.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA6B,MAAM,OAAO,CAAC;AAClD,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,2DAA2D,CAAC;AAM3G;;GAEG;AACH,MAAM,WAAW,oBAAoB;IACnC,qGAAqG;IACrG,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,uEAAuE;IACvE,cAAc,CAAC,EAAE,yBAAyB,CAAC;IAE3C;;;;;;;OAOG;IACH,0BAA0B,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;CACrD;AAED;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAoH1D,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/dist/esm/components/views/flows-actors-view/FlowsActorsView.js

@@ -0,0 +1,96 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useMemo } from 'react';
+import { useUI } from '../../../core/ui/useUI.js';
+import { ScopeUtilsService } from '../../../core/scope/scope.utils.frontend.service.js';
+import { useAppScopeSafe } from '../../../core/scope/useAppScope.js';
+import { ViewNotFound } from '../../../components/views/ViewNotFound.js';
+/**
+ * FlowsActorsView Layout Component (Placeholder)
+ *
+ * This component renders a view that exposes one or more FlowActorSystems
+ * for human-in-the-loop interactions and workflow orchestration.
+ *
+ * TODO: Implement:
+ * - Integration with FlowsActorsContext
+ * - Conversation interface using LOW_LEVEL_AI_* components
+ * - Approval request handling
+ * - WebSocket-based real-time updates
+ */
+export const FlowsActorsView = ({ viewRef, viewDefinition: viewDefinitionProp, contextResourceIdentifiers: contextResourceIdentifiersProp, }) => {
+    const { flowsActorsViews } = useUI();
+    const appScope = useAppScopeSafe();
+    // Resolve definition: use provided prop, or resolve from viewRef via UIContext
+    const viewDefinition = viewDefinitionProp ?? (viewRef ? flowsActorsViews?.find(v => v.ref === viewRef) : undefined);
+    useEffect(() => {
+        if (process.env.NODE_ENV === 'production'
+            || viewDefinition
+            || !viewRef
+            || !contextResourceIdentifiersProp
+            || Object.keys(contextResourceIdentifiersProp).length === 0) {
+            return;
+        }
+        console.warn('[FlowsActorsView] Cannot validate explicit view context bindings because the view definition could not be resolved', {
+            surfaceName: 'FlowsActorsView',
+            surfaceRef: viewRef,
+            explicitContextResourceIdentifiers: contextResourceIdentifiersProp,
+        });
+    }, [contextResourceIdentifiersProp, viewDefinition, viewRef]);
+    // Resolve scope identifiers from the canonical AppScope-owned primary snapshot.
+    const contextResourceIdentifiers = useMemo(() => {
+        const primaryScopeInitiatorIds = ScopeUtilsService.buildInitiatorIds({
+            userId: appScope?.currentUserId,
+            organizationId: appScope?.currentOrganizationId,
+            applicationId: appScope?.currentApplicationId,
+            anonymousUserId: appScope?.currentAnonymousUserId,
+        });
+        const primaryScopeContext = viewDefinition?.primaryScope
+            ? ScopeUtilsService.primaryScopeToContextIdentifiers(primaryScopeInitiatorIds, viewDefinition.primaryScope)
+            : {};
+        const liveAppScopeContext = appScope?.buildContextResourceIdentifiers() ?? {};
+        const customScopeContext = ScopeUtilsService.filterCustomScopeContextResourceIdentifiers(liveAppScopeContext);
+        if (!viewDefinition) {
+            return ScopeUtilsService.mergeContextResourceIdentifiers(primaryScopeContext, customScopeContext, contextResourceIdentifiersProp);
+        }
+        return ScopeUtilsService.resolveViewContextResourceIdentifiers({
+            surfaceName: 'FlowsActorsView',
+            surfaceRef: viewDefinition.ref,
+            primaryScope: viewDefinition.primaryScope,
+            parentResourcesRequirements: viewDefinition.parentResourcesRequirements,
+            additionalResourceRequirements: viewDefinition.additionalResourceRequirements,
+            primaryScopeContext,
+            customScopeContext,
+            explicitContextResourceIdentifiers: contextResourceIdentifiersProp,
+        });
+    }, [
+        contextResourceIdentifiersProp,
+        viewDefinition?.primaryScope,
+        viewDefinition?.ref,
+        viewDefinition?.parentResourcesRequirements,
+        viewDefinition?.additionalResourceRequirements,
+        appScope?.currentUserId,
+        appScope?.currentOrganizationId,
+        appScope?.currentApplicationId,
+        appScope?.currentAnonymousUserId,
+        appScope,
+    ]);
+    if (!viewDefinition) {
+        return _jsx(ViewNotFound, { viewType: "Flows actors view", viewRef: viewRef });
+    }
+    return (_jsxs("div", { className: "flows-actors-view-placeholder", style: {
+            display: 'flex',
+            flexDirection: 'column',
+            alignItems: 'center',
+            justifyContent: 'center',
+            minHeight: '300px',
+            padding: '24px',
+            backgroundColor: 'var(--color-background-secondary, #f5f5f5)',
+            borderRadius: '8px',
+            border: '2px dashed var(--color-border, #ccc)',
+        }, children: [_jsx("h2", { style: { margin: '0 0 8px 0', color: 'var(--color-text-primary, #333)' }, children: "Flows Actors View" }), _jsxs("p", { style: { margin: '0 0 16px 0', color: 'var(--color-text-secondary, #666)' }, children: ["Placeholder for: ", _jsx("code", { children: viewDefinition.ref })] }), _jsxs("div", { style: {
+                    fontSize: '14px',
+                    color: 'var(--color-text-tertiary, #999)',
+                    textAlign: 'center',
+                }, children: [_jsxs("p", { children: ["Systems: ", _jsx("code", { children: viewDefinition.systemRefs.join(', ') })] }), _jsxs("p", { children: ["Layout Preset: ", _jsx("code", { children: viewDefinition.layoutPreset })] }), contextResourceIdentifiers && Object.keys(contextResourceIdentifiers).length > 0 && (_jsxs("p", { children: ["Context: ", JSON.stringify(contextResourceIdentifiers)] }))] })] }));
+};
+export default FlowsActorsView;
+//# sourceMappingURL=FlowsActorsView.js.map

package/dist/esm/components/views/flows-actors-view/FlowsActorsView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FlowsActorsView.js","sourceRoot":"","sources":["../../../../../src/components/views/flows-actors-view/FlowsActorsView.tsx"],"names":[],"mappings":"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"}

package/dist/esm/components/views/full-custom-view/FullCustomView.d.ts

@@ -0,0 +1,32 @@
+import React from 'react';
+import type { FullCustomViewDefinition } from '../../../core/config/full-custom-view.schemas.js';
+/**
+ * FullCustomView Props
+ */
+export interface FullCustomViewProps {
+    /** View reference — resolved from UIContext internally. Mutually exclusive with `viewDefinition`. */
+    viewRef?: string;
+    /** Pre-resolved view definition. When provided, viewRef is ignored. */
+    viewDefinition?: FullCustomViewDefinition;
+    /**
+     * Context resource identifiers for scope.
+     * When provided (e.g. from NavigationContentAreas), these are treated as
+     * explicit navigation-time overrides and merged last over the live AppScope
+     * context resolved by this view.
+     * When omitted (e.g. URL-based routing), scope is self-resolved from the
+     * canonical AppScope primary snapshot using the view definition's primaryScope.
+     */
+    contextResourceIdentifiers?: Record<string, string>;
+}
+/**
+ * FullCustomView Layout Component
+ *
+ * This component renders a fully custom view where all interaction
+ * is managed by the component referenced in componentRef.
+ *
+ * The component handles its own data fetching - the engine only
+ * provides the resolved view definition and context identifiers.
+ */
+export declare const FullCustomView: React.FC<FullCustomViewProps>;
+export default FullCustomView;
+//# sourceMappingURL=FullCustomView.d.ts.map

package/dist/esm/components/views/full-custom-view/FullCustomView.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FullCustomView.d.ts","sourceRoot":"","sources":["../../../../../src/components/views/full-custom-view/FullCustomView.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA6B,MAAM,OAAO,CAAC;AAElD,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,0DAA0D,CAAC;AAQzG;;GAEG;AACH,MAAM,WAAW,mBAAmB;IAClC,qGAAqG;IACrG,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,uEAAuE;IACvE,cAAc,CAAC,EAAE,wBAAwB,CAAC;IAE1C;;;;;;;OAOG;IACH,0BAA0B,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;CACrD;AAED;;;;;;;;GAQG;AACH,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAwGxD,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/dist/esm/components/views/full-custom-view/FullCustomView.js

@@ -0,0 +1,86 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import React, { useEffect, useMemo } from 'react';
+import { CorePresetNames } from '@wildo-ai/presets-components-models';
+import { useUI } from '../../../core/ui/useUI.js';
+import { ScopeUtilsService } from '../../../core/scope/scope.utils.frontend.service.js';
+import { useAppScopeSafe } from '../../../core/scope/useAppScope.js';
+import { ViewNotFound } from '../../../components/views/ViewNotFound.js';
+import { ComponentRegistryService } from '../../../core/components-registry/component-registry.frontend.service.js';
+import { ComponentNotInjected } from '../../../core/components-registry/ComponentNotInjected.js';
+/**
+ * FullCustomView Layout Component
+ *
+ * This component renders a fully custom view where all interaction
+ * is managed by the component referenced in componentRef.
+ *
+ * The component handles its own data fetching - the engine only
+ * provides the resolved view definition and context identifiers.
+ */
+export const FullCustomView = ({ viewRef, viewDefinition: viewDefinitionProp, contextResourceIdentifiers: contextResourceIdentifiersProp, }) => {
+    const { fullCustomViews } = useUI();
+    const appScope = useAppScopeSafe();
+    // Resolve definition: use provided prop, or resolve from viewRef via UIContext
+    const viewDefinition = viewDefinitionProp ?? (viewRef ? fullCustomViews?.find(v => v.ref === viewRef) : undefined);
+    useEffect(() => {
+        if (process.env.NODE_ENV === 'production'
+            || viewDefinition
+            || !viewRef
+            || !contextResourceIdentifiersProp
+            || Object.keys(contextResourceIdentifiersProp).length === 0) {
+            return;
+        }
+        console.warn('[FullCustomView] Cannot validate explicit view context bindings because the view definition could not be resolved', {
+            surfaceName: 'FullCustomView',
+            surfaceRef: viewRef,
+            explicitContextResourceIdentifiers: contextResourceIdentifiersProp,
+        });
+    }, [contextResourceIdentifiersProp, viewDefinition, viewRef]);
+    // Resolve scope identifiers from the canonical AppScope-owned primary snapshot.
+    const contextResourceIdentifiers = useMemo(() => {
+        const primaryScopeInitiatorIds = ScopeUtilsService.buildInitiatorIds({
+            userId: appScope?.currentUserId,
+            organizationId: appScope?.currentOrganizationId,
+            applicationId: appScope?.currentApplicationId,
+            anonymousUserId: appScope?.currentAnonymousUserId,
+        });
+        const primaryScopeContext = viewDefinition?.primaryScope
+            ? ScopeUtilsService.primaryScopeToContextIdentifiers(primaryScopeInitiatorIds, viewDefinition.primaryScope)
+            : {};
+        const liveAppScopeContext = appScope?.buildContextResourceIdentifiers() ?? {};
+        const customScopeContext = ScopeUtilsService.filterCustomScopeContextResourceIdentifiers(liveAppScopeContext);
+        if (!viewDefinition) {
+            return ScopeUtilsService.mergeContextResourceIdentifiers(primaryScopeContext, customScopeContext, contextResourceIdentifiersProp);
+        }
+        return ScopeUtilsService.resolveViewContextResourceIdentifiers({
+            surfaceName: 'FullCustomView',
+            surfaceRef: viewDefinition.ref,
+            primaryScope: viewDefinition.primaryScope,
+            parentResourcesRequirements: viewDefinition.parentResourcesRequirements,
+            additionalResourceRequirements: viewDefinition.additionalResourceRequirements,
+            primaryScopeContext,
+            customScopeContext,
+            explicitContextResourceIdentifiers: contextResourceIdentifiersProp,
+        });
+    }, [
+        contextResourceIdentifiersProp,
+        viewDefinition?.primaryScope,
+        viewDefinition?.ref,
+        viewDefinition?.parentResourcesRequirements,
+        viewDefinition?.additionalResourceRequirements,
+        appScope?.currentUserId,
+        appScope?.currentOrganizationId,
+        appScope?.currentApplicationId,
+        appScope?.currentAnonymousUserId,
+        appScope,
+    ]);
+    if (!viewDefinition) {
+        return _jsx(ViewNotFound, { viewType: "Full custom view", viewRef: viewRef });
+    }
+    const CustomViewComponent = ComponentRegistryService.resolve(viewDefinition.componentRef, CorePresetNames.DEFAULT);
+    if (!CustomViewComponent) {
+        return (_jsx(ComponentNotInjected, { componentType: viewDefinition.componentRef, componentName: viewDefinition.componentRef }));
+    }
+    return (_jsx(React.Suspense, { fallback: _jsx("div", { className: "h-8 animate-pulse motion-reduce:animate-none bg-muted rounded", "aria-hidden": "true" }), children: _jsx(CustomViewComponent, { viewRef: viewDefinition.ref, viewDefinition: viewDefinition, contextResourceIdentifiers: contextResourceIdentifiers }) }));
+};
+export default FullCustomView;
+//# sourceMappingURL=FullCustomView.js.map

package/dist/esm/components/views/full-custom-view/FullCustomView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FullCustomView.js","sourceRoot":"","sources":["../../../../../src/components/views/full-custom-view/FullCustomView.tsx"],"names":[],"mappings":"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"}

package/dist/esm/components/views/onboarding-view/OnboardingView.d.ts

@@ -0,0 +1,30 @@
+/**
+ * OnboardingView — Wizard-style onboarding view.
+ *
+ * Renders a sequence of guidance elements (checklist, tour, survey, etc.)
+ * with step progression, progress bar, and navigation controls.
+ * Integrates with GuidanceContext only when a matching `guidanceFlowRef` is
+ * provided and falls back to local transient state when the view is rendered
+ * directly from a static onboarding document.
+ */
+import React from 'react';
+import { OnboardingStatus, type OnboardingViewOptions } from '@wildo-ai/saas-models';
+import type { OnboardingViewDefinition } from '../../../core/config/onboarding-view.frontend.schemas.js';
+export interface OnboardingViewProps {
+    /** Onboarding document with elements */
+    document: OnboardingViewDefinition;
+    /** Additional options to override document options */
+    options?: Partial<OnboardingViewOptions>;
+    /** Custom class name */
+    className?: string;
+    /** Callback when element status changes */
+    onStatusChange?: (elementRef: string, status: OnboardingStatus) => void;
+    /** Callback when action is triggered */
+    onAction?: (elementRef: string, actionRef?: string) => void;
+    /** View reference for i18n/view identity when rendered from a larger document */
+    viewRef?: string;
+    /** Explicit guidance flow ref when this onboarding view should persist through GuidanceContext */
+    guidanceFlowRef?: string;
+}
+export declare const OnboardingView: React.FC<OnboardingViewProps>;
+//# sourceMappingURL=OnboardingView.d.ts.map

package/dist/esm/components/views/onboarding-view/OnboardingView.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OnboardingView.d.ts","sourceRoot":"","sources":["../../../../../src/components/views/onboarding-view/OnboardingView.tsx"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,KAA2D,MAAM,OAAO,CAAC;AAChF,OAAO,EAEL,gBAAgB,EAEhB,KAAK,qBAAqB,EAE3B,MAAM,uBAAuB,CAAC;AAC/B,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,kEAAkE,CAAC;AAoCjH,MAAM,WAAW,mBAAmB;IAClC,wCAAwC;IACxC,QAAQ,EAAE,wBAAwB,CAAC;IACnC,sDAAsD;IACtD,OAAO,CAAC,EAAE,OAAO,CAAC,qBAAqB,CAAC,CAAC;IACzC,wBAAwB;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,2CAA2C;IAC3C,cAAc,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,MAAM,EAAE,gBAAgB,KAAK,IAAI,CAAC;IACxE,wCAAwC;IACxC,QAAQ,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,SAAS,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5D,iFAAiF;IACjF,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,kGAAkG;IAClG,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B;AAID,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CA6SxD,CAAC"}

package/dist/esm/components/views/onboarding-view/OnboardingView.js

@@ -0,0 +1,180 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * OnboardingView — Wizard-style onboarding view.
+ *
+ * Renders a sequence of guidance elements (checklist, tour, survey, etc.)
+ * with step progression, progress bar, and navigation controls.
+ * Integrates with GuidanceContext only when a matching `guidanceFlowRef` is
+ * provided and falls back to local transient state when the view is rendered
+ * directly from a static onboarding document.
+ */
+import { useState, useMemo, useCallback, useEffect, useId } from 'react';
+import { OnboardingElementType, OnboardingStatus, } from '@wildo-ai/saas-models';
+import { FrontendComponentType } from '@wildo-ai/presets-components-models';
+import { useGuidance } from '../../../core/guidance/useGuidance.js';
+import { useI18n } from '../../../core/i18n/useI18n.js';
+// Element renderers
+import { GuidanceChecklist } from '../../../core/guidance/renderers/GuidanceChecklist.js';
+import { GuidanceChecklistItem } from '../../../core/guidance/renderers/GuidanceChecklistItem.js';
+import { GuidanceTour } from '../../../core/guidance/renderers/GuidanceTour.js';
+import { GuidanceTooltip } from '../../../core/guidance/renderers/GuidanceTooltip.js';
+import { GuidanceModal } from '../../../core/guidance/renderers/GuidanceModal.js';
+import { GuidanceBanner } from '../../../core/guidance/renderers/GuidanceBanner.js';
+import { GuidanceAnnouncement } from '../../../core/guidance/renderers/GuidanceAnnouncement.js';
+import { GuidanceBadge } from '../../../core/guidance/renderers/GuidanceBadge.js';
+import { GuidanceCard } from '../../../core/guidance/renderers/GuidanceCard.js';
+import { GuidanceSurvey } from '../../../core/guidance/renderers/GuidanceSurvey.js';
+// ─── Element Type → Component Map ────────────────────────────
+const ELEMENT_RENDERER_MAP = {
+    [OnboardingElementType.CHECKLIST]: GuidanceChecklist,
+    [OnboardingElementType.CHECKLIST_ITEM]: GuidanceChecklistItem,
+    [OnboardingElementType.TOUR]: GuidanceTour,
+    [OnboardingElementType.TOOLTIP]: GuidanceTooltip,
+    [OnboardingElementType.MODAL]: GuidanceModal,
+    [OnboardingElementType.BANNER]: GuidanceBanner,
+    [OnboardingElementType.ANNOUNCEMENT]: GuidanceAnnouncement,
+    [OnboardingElementType.BADGE]: GuidanceBadge,
+    [OnboardingElementType.CARD]: GuidanceCard,
+    [OnboardingElementType.SURVEY]: GuidanceSurvey,
+};
+// ─── Component ───────────────────────────────────────────────
+export const OnboardingView = ({ document: doc, options: optionsOverride = {}, className = '', onStatusChange, onAction, viewRef: viewRefProp, guidanceFlowRef: guidanceFlowRefProp, }) => {
+    const { flowStates, completeElement, completeFlow, dismissFlow, skipFlow } = useGuidance();
+    const localFlowId = useId();
+    const guidanceFlowRef = guidanceFlowRefProp;
+    const flowRef = guidanceFlowRef ?? `onboarding-local-${localFlowId}`;
+    const translationRef = viewRefProp || guidanceFlowRef || 'onboarding';
+    const guidanceKeys = useMemo(() => [`guidance.${translationRef}`], [translationRef]);
+    const { makeTrGuidanceElement, tComponent } = useI18n({
+        component: FrontendComponentType.GUIDANCE_ONBOARDING_VIEW,
+        keys: guidanceKeys,
+    });
+    const mergedOptions = useMemo(() => ({ ...doc.options, ...optionsOverride }), [doc.options, optionsOverride]);
+    // Sort elements by order
+    const sortedElements = useMemo(() => [...doc.elements].sort((a, b) => a.order - b.order), [doc.elements]);
+    // Step tracking for wizard mode
+    const [currentStepIndex, setCurrentStepIndex] = useState(0);
+    const [localFlowState, setLocalFlowState] = useState({
+        status: OnboardingStatus.IN_PROGRESS,
+        elements: {},
+        triggerCount: 1,
+    });
+    const totalSteps = sortedElements.length;
+    useEffect(() => {
+        setCurrentStepIndex(0);
+        setLocalFlowState({
+            status: OnboardingStatus.IN_PROGRESS,
+            elements: {},
+            triggerCount: 1,
+        });
+    }, [flowRef]);
+    // Derive flow state from GuidanceContext
+    const flowState = guidanceFlowRef ? (flowStates[guidanceFlowRef] ?? localFlowState) : localFlowState;
+    const getElementState = useCallback((elementRef) => flowState?.elements?.[elementRef], [flowState]);
+    // Count completed elements
+    const completedCount = useMemo(() => {
+        if (!flowState?.elements)
+            return 0;
+        return Object.values(flowState.elements).filter(s => s.status === OnboardingStatus.COMPLETED).length;
+    }, [flowState]);
+    // ─── Handlers ────────────────────────────────────────────
+    const setLocalElementStatus = useCallback((elementRef, status, data) => {
+        const completedAt = status === OnboardingStatus.COMPLETED ? new Date() : undefined;
+        setLocalFlowState(prev => ({
+            ...prev,
+            elements: {
+                ...prev.elements,
+                [elementRef]: {
+                    ...prev.elements[elementRef],
+                    status,
+                    completedAt,
+                    surveyAnswers: data?.surveyAnswers ?? prev.elements[elementRef]?.surveyAnswers,
+                    lastStepIndex: data?.lastStepIndex ?? prev.elements[elementRef]?.lastStepIndex,
+                },
+            },
+        }));
+    }, []);
+    const setLocalFlowStatus = useCallback((status) => {
+        const now = new Date();
+        setLocalFlowState(prev => ({
+            ...prev,
+            status,
+            completedAt: status === OnboardingStatus.COMPLETED ? now : prev.completedAt,
+            dismissedAt: status === OnboardingStatus.DISMISSED ? now : prev.dismissedAt,
+        }));
+    }, []);
+    const handleComplete = useCallback((elementRef, data) => {
+        setLocalElementStatus(elementRef, OnboardingStatus.COMPLETED, data);
+        if (guidanceFlowRef) {
+            completeElement(guidanceFlowRef, elementRef, data);
+        }
+        onStatusChange?.(elementRef, OnboardingStatus.COMPLETED);
+        // Auto-advance to next step if not on last
+        if (currentStepIndex < totalSteps - 1) {
+            setCurrentStepIndex(prev => prev + 1);
+        }
+        else {
+            setLocalFlowStatus(OnboardingStatus.COMPLETED);
+            if (guidanceFlowRef) {
+                completeFlow(guidanceFlowRef);
+            }
+        }
+    }, [completeElement, completeFlow, currentStepIndex, guidanceFlowRef, onStatusChange, setLocalElementStatus, setLocalFlowStatus, totalSteps]);
+    const handleDismiss = useCallback((elementRef) => {
+        setLocalElementStatus(elementRef, OnboardingStatus.DISMISSED);
+        onStatusChange?.(elementRef, OnboardingStatus.DISMISSED);
+        if (mergedOptions.allowDismiss) {
+            setLocalFlowStatus(OnboardingStatus.DISMISSED);
+            if (guidanceFlowRef) {
+                dismissFlow(guidanceFlowRef);
+            }
+        }
+    }, [dismissFlow, guidanceFlowRef, mergedOptions.allowDismiss, onStatusChange, setLocalElementStatus, setLocalFlowStatus]);
+    const handleAction = useCallback((actionRef) => {
+        const currentElement = sortedElements[currentStepIndex];
+        onAction?.(currentElement?.ref ?? '', actionRef);
+    }, [onAction, sortedElements, currentStepIndex]);
+    const handleNext = useCallback(() => {
+        if (currentStepIndex < totalSteps - 1) {
+            setCurrentStepIndex(prev => prev + 1);
+            return;
+        }
+        const currentElement = sortedElements[currentStepIndex];
+        if (!currentElement) {
+            setLocalFlowStatus(OnboardingStatus.COMPLETED);
+            if (guidanceFlowRef) {
+                completeFlow(guidanceFlowRef);
+            }
+            return;
+        }
+        handleComplete(currentElement.ref);
+    }, [currentStepIndex, totalSteps, sortedElements, handleComplete, completeFlow, guidanceFlowRef, setLocalFlowStatus]);
+    const handleBack = useCallback(() => {
+        if (currentStepIndex > 0) {
+            setCurrentStepIndex(prev => prev - 1);
+        }
+    }, [currentStepIndex]);
+    const handleSkip = useCallback(() => {
+        setLocalFlowStatus(OnboardingStatus.SKIPPED);
+        if (guidanceFlowRef) {
+            skipFlow(guidanceFlowRef);
+        }
+    }, [guidanceFlowRef, setLocalFlowStatus, skipFlow]);
+    // ─── Render ──────────────────────────────────────────────
+    if (sortedElements.length === 0) {
+        return (_jsx("div", { className: `p-container-xl text-center text-muted-foreground ${className}`, children: tComponent(FrontendComponentType.GUIDANCE_ONBOARDING_VIEW, 'empty') }));
+    }
+    const currentElement = sortedElements[currentStepIndex];
+    if (!currentElement)
+        return null;
+    const Renderer = ELEMENT_RENDERER_MAP[currentElement.type];
+    const elementState = getElementState(currentElement.ref);
+    const scopedT = makeTrGuidanceElement(translationRef, currentElement.ref);
+    return (_jsxs("div", { className: `flex flex-col gap-element ${className}`, children: [mergedOptions.showProgress && totalSteps > 1 && (_jsxs("div", { className: "flex flex-col gap-item-xs", children: [_jsxs("div", { className: "flex justify-between items-center text-[0.8125rem] text-muted-foreground font-medium", children: [_jsx("span", { children: tComponent(FrontendComponentType.GUIDANCE_ONBOARDING_VIEW, 'stepOf', {
+                                    current: currentStepIndex + 1,
+                                    total: totalSteps,
+                                }) }), _jsxs("span", { className: "text-xs", children: [completedCount, "/", totalSteps] })] }), _jsx("div", { className: "w-full h-1 bg-muted rounded-sm overflow-hidden", role: "progressbar", "aria-valuenow": currentStepIndex + 1, "aria-valuemin": 1, "aria-valuemax": totalSteps, children: _jsx("div", { className: "h-full bg-primary rounded-sm motion-safe:transition-[width] motion-safe:duration-[var(--motion-duration-normal)] motion-safe:ease-out", style: { width: `${totalSteps > 0 ? ((currentStepIndex + 1) / totalSteps) * 100 : 0}%` } }) })] })), Renderer && (_jsx(Renderer, { element: currentElement, flowRef: flowRef, state: elementState, onComplete: handleComplete, onDismiss: handleDismiss, onAction: handleAction, t: scopedT })), totalSteps > 1 && (_jsxs("div", { className: "flex justify-between items-center pt-item", children: [_jsx("div", { children: currentStepIndex > 0 && (_jsx("button", { type: "button", onClick: handleBack, className: "px-card py-item text-[0.8125rem] font-medium text-muted-foreground bg-transparent border border-border rounded-md cursor-pointer motion-safe:transition-colors hover:bg-muted focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:rounded pointer-coarse:min-h-11", children: tComponent(FrontendComponentType.GUIDANCE_ONBOARDING_VIEW, 'back') })) }), _jsxs("div", { className: "flex gap-item items-center", children: [mergedOptions.allowSkip && (_jsx("button", { type: "button", onClick: handleSkip, className: "px-card-sm py-item text-[0.8125rem] font-medium text-muted-foreground/70 bg-transparent border-none cursor-pointer motion-safe:transition-colors hover:text-muted-foreground focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:rounded pointer-coarse:min-h-11", children: tComponent(FrontendComponentType.GUIDANCE_ONBOARDING_VIEW, 'skip') })), _jsx("button", { type: "button", onClick: handleNext, className: "px-card py-item text-[0.8125rem] font-medium text-primary-foreground bg-primary border-none rounded-md cursor-pointer motion-safe:transition-colors hover:bg-primary/90 focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:rounded pointer-coarse:min-h-11", children: currentStepIndex === totalSteps - 1
+                                    ? tComponent(FrontendComponentType.GUIDANCE_ONBOARDING_VIEW, 'complete')
+                                    : tComponent(FrontendComponentType.GUIDANCE_ONBOARDING_VIEW, 'next') })] })] })), totalSteps === 1 && (_jsxs("div", { className: "flex justify-end gap-item items-center", children: [mergedOptions.allowDismiss && (_jsx("button", { type: "button", onClick: () => handleDismiss(currentElement.ref), className: "px-card-sm py-item text-[0.8125rem] font-medium text-muted-foreground/70 bg-transparent border-none cursor-pointer motion-safe:transition-colors hover:text-muted-foreground focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:rounded pointer-coarse:min-h-11", children: tComponent(FrontendComponentType.GUIDANCE_ONBOARDING_VIEW, 'dismiss') })), _jsx("button", { type: "button", onClick: handleNext, className: "px-card py-item text-[0.8125rem] font-medium text-primary-foreground bg-primary border-none rounded-md cursor-pointer motion-safe:transition-colors hover:bg-primary/90 focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:rounded pointer-coarse:min-h-11", children: tComponent(FrontendComponentType.GUIDANCE_ONBOARDING_VIEW, 'complete') })] }))] }));
+};
+//# sourceMappingURL=OnboardingView.js.map