@bbq-chat/widgets-angular 1.0.4 → 1.0.5

package/dist/types/index.d.ts

@@ -1,6 +1,6 @@
 import * as i0 from '@angular/core';
-import { Type, TemplateRef, InjectionToken, OnInit, AfterViewInit, OnDestroy, OnChanges, Injector, EnvironmentInjector, EventEmitter, ElementRef, ComponentRef, EmbeddedViewRef, SimpleChanges } from '@angular/core';
-import { ChatWidget, IWidgetActionHandler, WidgetEventManager, SsrWidgetRenderer } from '@bbq-chat/widgets';
+import { Type, TemplateRef, InjectionToken, OnInit, AfterViewInit, OnDestroy, OnChanges, Injector, EnvironmentInjector, EventEmitter, ElementRef, ComponentRef, EmbeddedViewRef, SimpleChanges, QueryList, ViewContainerRef } from '@angular/core';
+import { ChatWidget, IWidgetRenderer, IWidgetActionHandler, WidgetEventManager, SsrWidgetRenderer, ButtonWidget, CardWidget, InputWidget, TextAreaWidget, DropdownWidget, SliderWidget, ToggleWidget, FileUploadWidget, ThemeSwitcherWidget, DatePickerWidget, MultiSelectWidget, ProgressBarWidget, FormWidget, ImageWidget, ImageCollectionWidget } from '@bbq-chat/widgets';
 export { ButtonWidget, CardWidget, ChatWidget, DatePickerWidget, DropdownWidget, FileUploadWidget, FormWidget, ImageCollectionWidget, ImageWidget, InputWidget, MultiSelectWidget, ProgressBarWidget, SliderWidget, SsrWidgetRenderer, TextAreaWidget, ThemeSwitcherWidget, ToggleWidget, WidgetEventManager, customWidgetRegistry } from '@bbq-chat/widgets';
 
 /**
@@ -175,6 +175,65 @@ declare class WidgetRegistryService {
     static ɵprov: i0.ɵɵInjectableDeclaration<WidgetRegistryService>;
 }
 
+/**
+ * Options for configuring the Angular widget renderer
+ */
+interface AngularRendererOptions {
+    /**
+     * Per-widget-type component overrides. Key is widget.type.
+     */
+    components?: Partial<Record<string, Type<CustomWidgetComponent>>>;
+}
+/**
+ * Angular widget renderer
+ * Returns Angular component types for dynamic rendering
+ * Provides feature parity with SsrWidgetRenderer but uses Angular components
+ */
+declare class AngularWidgetRenderer implements IWidgetRenderer {
+    readonly framework = "Angular";
+    private overrides;
+    private componentRegistry;
+    constructor(options?: AngularRendererOptions);
+    /**
+     * Register all built-in widget components
+     * Must be called after components are imported to avoid circular dependencies
+     */
+    registerBuiltInComponents(components: Record<string, Type<CustomWidgetComponent>>): void;
+    /**
+     * Register or override a widget component
+     * Use this to replace built-in components or add custom ones
+     *
+     * @example
+     * ```typescript
+     * renderer.registerComponent('button', MyCustomButtonComponent);
+     * ```
+     */
+    registerComponent(type: string, component: Type<CustomWidgetComponent>): void;
+    /**
+     * Register multiple widget components at once
+     *
+     * @example
+     * ```typescript
+     * renderer.registerComponents({
+     *   button: MyButtonComponent,
+     *   card: MyCardComponent
+     * });
+     * ```
+     */
+    registerComponents(components: Record<string, Type<CustomWidgetComponent>>): void;
+    /**
+     * Get the Angular component type for a given widget
+     * Returns the component class that should be dynamically instantiated
+     */
+    getComponentType(widget: ChatWidget): Type<CustomWidgetComponent> | null;
+    /**
+     * Legacy method for IWidgetRenderer interface compatibility
+     * Not used in Angular rendering but required by interface
+     * @deprecated Use getComponentType() instead for Angular rendering
+     */
+    renderWidget(widget: ChatWidget): string;
+}
+
 /**
  * Injection token for WidgetEventManager factory
  *
@@ -204,6 +263,19 @@ declare const WIDGET_EVENT_MANAGER_FACTORY: InjectionToken<WidgetEventManagerFac
  * ```
  */
 declare const SSR_WIDGET_RENDERER: InjectionToken<SsrWidgetRenderer>;
+/**
+ * Injection token for AngularWidgetRenderer
+ *
+ * Use this token to inject an AngularWidgetRenderer instance in your components.
+ * This is the recommended renderer for Angular applications as it provides
+ * native Angular component rendering instead of HTML string rendering.
+ *
+ * @example
+ * ```typescript
+ * constructor(@Inject(ANGULAR_WIDGET_RENDERER) private renderer: AngularWidgetRenderer) {}
+ * ```
+ */
+declare const ANGULAR_WIDGET_RENDERER: InjectionToken<AngularWidgetRenderer>;
 /**
  * Factory function for creating WidgetEventManager instances
  *
@@ -223,6 +295,15 @@ declare function widgetEventManagerFactoryProvider(): WidgetEventManagerFactory;
  * @returns A new SsrWidgetRenderer instance
  */
 declare function ssrWidgetRendererFactory(): SsrWidgetRenderer;
+/**
+ * Factory function for creating AngularWidgetRenderer instances
+ *
+ * This factory creates an AngularWidgetRenderer with all built-in widget components
+ * pre-registered. This is the recommended renderer for Angular applications.
+ *
+ * @returns A new AngularWidgetRenderer instance with built-in components registered
+ */
+declare function angularWidgetRendererFactory(): AngularWidgetRenderer;
 
 /**
  * Angular component for rendering chat widgets
@@ -245,6 +326,7 @@ declare function ssrWidgetRendererFactory(): SsrWidgetRenderer;
  */
 declare class WidgetRendererComponent implements OnInit, AfterViewInit, OnDestroy, OnChanges {
     protected renderer: SsrWidgetRenderer;
+    protected angularRenderer: AngularWidgetRenderer | null;
     protected eventManagerFactory: WidgetEventManagerFactory;
     protected widgetRegistry: WidgetRegistryService;
     protected injector: Injector;
@@ -271,7 +353,7 @@ declare class WidgetRendererComponent implements OnInit, AfterViewInit, OnDestro
     protected isViewInitialized: boolean;
     protected dynamicComponents: Array<ComponentRef<any>>;
     protected dynamicViews: Array<EmbeddedViewRef<WidgetTemplateContext>>;
-    constructor(renderer: SsrWidgetRenderer, eventManagerFactory: WidgetEventManagerFactory, widgetRegistry: WidgetRegistryService, injector: Injector, environmentInjector: EnvironmentInjector);
+    constructor(renderer: SsrWidgetRenderer, angularRenderer: AngularWidgetRenderer | null, eventManagerFactory: WidgetEventManagerFactory, widgetRegistry: WidgetRegistryService, injector: Injector, environmentInjector: EnvironmentInjector);
     ngOnInit(): void;
     ngOnChanges(changes: SimpleChanges): void;
     ngAfterViewInit(): void;
@@ -313,10 +395,211 @@ declare class WidgetRendererComponent implements OnInit, AfterViewInit, OnDestro
      * Cleanup all resources including event listeners.
      */
     private cleanup;
-    static ɵfac: i0.ɵɵFactoryDeclaration<WidgetRendererComponent, never>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<WidgetRendererComponent, [null, { optional: true; }, null, null, null, null]>;
     static ɵcmp: i0.ɵɵComponentDeclaration<WidgetRendererComponent, "bbq-widget-renderer", never, { "widgets": { "alias": "widgets"; "required": false; }; }, { "widgetAction": "widgetAction"; }, never, never, true, never>;
 }
 
+declare class ButtonWidgetComponent implements CustomWidgetComponent {
+    widget: any;
+    widgetAction?: (actionName: string, payload: unknown) => void;
+    get buttonWidget(): ButtonWidget;
+    onClick(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ButtonWidgetComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ButtonWidgetComponent, "bbq-button-widget", never, { "widget": { "alias": "widget"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class CardWidgetComponent implements CustomWidgetComponent {
+    widget: any;
+    widgetAction?: (actionName: string, payload: unknown) => void;
+    get cardWidget(): CardWidget;
+    onClick(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CardWidgetComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CardWidgetComponent, "bbq-card-widget", never, { "widget": { "alias": "widget"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class InputWidgetComponent implements CustomWidgetComponent, OnInit {
+    widget: any;
+    widgetAction?: (actionName: string, payload: unknown) => void;
+    value: string;
+    inputId: string;
+    get inputWidget(): InputWidget;
+    get showLabel(): boolean;
+    get inputClasses(): string[];
+    private get isFormAppearance();
+    ngOnInit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<InputWidgetComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<InputWidgetComponent, "bbq-input-widget", never, { "widget": { "alias": "widget"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class TextAreaWidgetComponent implements CustomWidgetComponent, OnInit {
+    widget: any;
+    widgetAction?: (actionName: string, payload: unknown) => void;
+    value: string;
+    textareaId: string;
+    get textareaWidget(): TextAreaWidget;
+    get showLabel(): boolean;
+    get textareaClasses(): string[];
+    private get isFormAppearance();
+    ngOnInit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TextAreaWidgetComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TextAreaWidgetComponent, "bbq-textarea-widget", never, { "widget": { "alias": "widget"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class DropdownWidgetComponent implements CustomWidgetComponent, OnInit {
+    widget: any;
+    widgetAction?: (actionName: string, payload: unknown) => void;
+    value: string;
+    selectId: string;
+    get dropdownWidget(): DropdownWidget;
+    get showLabel(): boolean;
+    get selectClasses(): string[];
+    private get isFormAppearance();
+    ngOnInit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<DropdownWidgetComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DropdownWidgetComponent, "bbq-dropdown-widget", never, { "widget": { "alias": "widget"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class SliderWidgetComponent implements CustomWidgetComponent, OnInit {
+    widget: any;
+    widgetAction?: (actionName: string, payload: unknown) => void;
+    value: number;
+    sliderId: string;
+    get sliderWidget(): SliderWidget;
+    get showLabel(): boolean;
+    get sliderClasses(): string[];
+    private get isFormAppearance();
+    ngOnInit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SliderWidgetComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SliderWidgetComponent, "bbq-slider-widget", never, { "widget": { "alias": "widget"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class ToggleWidgetComponent implements CustomWidgetComponent, OnInit {
+    widget: any;
+    widgetAction?: (actionName: string, payload: unknown) => void;
+    checked: boolean;
+    checkboxId: string;
+    get toggleWidget(): ToggleWidget;
+    get showLabel(): boolean;
+    get checkboxClasses(): string[];
+    private get isFormAppearance();
+    ngOnInit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ToggleWidgetComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ToggleWidgetComponent, "bbq-toggle-widget", never, { "widget": { "alias": "widget"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class FileUploadWidgetComponent implements CustomWidgetComponent, OnInit {
+    widget: any;
+    widgetAction?: (actionName: string, payload: unknown) => void;
+    inputId: string;
+    get fileUploadWidget(): FileUploadWidget;
+    get showLabel(): boolean;
+    get inputClasses(): string[];
+    private get isFormAppearance();
+    ngOnInit(): void;
+    onFileChange(event: Event): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<FileUploadWidgetComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<FileUploadWidgetComponent, "bbq-fileupload-widget", never, { "widget": { "alias": "widget"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class ThemeSwitcherWidgetComponent implements CustomWidgetComponent, OnInit {
+    widget: any;
+    widgetAction?: (actionName: string, payload: unknown) => void;
+    value: string;
+    selectId: string;
+    get themeSwitcherWidget(): ThemeSwitcherWidget;
+    ngOnInit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ThemeSwitcherWidgetComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ThemeSwitcherWidgetComponent, "bbq-themeswitcher-widget", never, { "widget": { "alias": "widget"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class DatePickerWidgetComponent implements CustomWidgetComponent, OnInit {
+    widget: any;
+    widgetAction?: (actionName: string, payload: unknown) => void;
+    value: string;
+    inputId: string;
+    get datePickerWidget(): DatePickerWidget;
+    get showLabel(): boolean;
+    get inputClasses(): string[];
+    private get isFormAppearance();
+    ngOnInit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<DatePickerWidgetComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DatePickerWidgetComponent, "bbq-datepicker-widget", never, { "widget": { "alias": "widget"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class MultiSelectWidgetComponent implements CustomWidgetComponent, OnInit {
+    widget: any;
+    widgetAction?: (actionName: string, payload: unknown) => void;
+    values: string[];
+    selectId: string;
+    get multiSelectWidget(): MultiSelectWidget;
+    get showLabel(): boolean;
+    get selectClasses(): string[];
+    private get isFormAppearance();
+    ngOnInit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MultiSelectWidgetComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MultiSelectWidgetComponent, "bbq-multiselect-widget", never, { "widget": { "alias": "widget"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class ProgressBarWidgetComponent implements CustomWidgetComponent, OnInit {
+    widget: any;
+    widgetAction?: (actionName: string, payload: unknown) => void;
+    progressId: string;
+    percentage: number;
+    get progressBarWidget(): ProgressBarWidget;
+    ngOnInit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ProgressBarWidgetComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ProgressBarWidgetComponent, "bbq-progressbar-widget", never, { "widget": { "alias": "widget"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class FormWidgetComponent implements CustomWidgetComponent, OnInit, AfterViewInit, OnDestroy {
+    private injector;
+    private environmentInjector;
+    widget: any;
+    widgetAction?: (actionName: string, payload: unknown) => void;
+    fieldContainers: QueryList<ViewContainerRef>;
+    formId: string;
+    formData: Record<string, any>;
+    showValidationMessage: boolean;
+    private componentRefs;
+    private fieldComponentRegistry;
+    get formWidget(): FormWidget;
+    constructor(injector: Injector, environmentInjector: EnvironmentInjector);
+    ngOnInit(): void;
+    ngAfterViewInit(): void;
+    ngOnDestroy(): void;
+    private renderFieldWidgets;
+    private renderInputFallback;
+    getFieldId(fieldName: string): string;
+    getFieldProp(field: any, prop: string): any;
+    onActionClick(actionType: string): void;
+    private validateForm;
+    private gatherFormData;
+    static ɵfac: i0.ɵɵFactoryDeclaration<FormWidgetComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<FormWidgetComponent, "bbq-form-widget", never, { "widget": { "alias": "widget"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class ImageWidgetComponent implements CustomWidgetComponent {
+    widget: any;
+    widgetAction?: (actionName: string, payload: unknown) => void;
+    get imageWidget(): ImageWidget;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ImageWidgetComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ImageWidgetComponent, "bbq-image-widget", never, { "widget": { "alias": "widget"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+declare class ImageCollectionWidgetComponent implements CustomWidgetComponent {
+    widget: any;
+    widgetAction?: (actionName: string, payload: unknown) => void;
+    get imageCollectionWidget(): ImageCollectionWidget;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ImageCollectionWidgetComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ImageCollectionWidgetComponent, "bbq-imagecollection-widget", never, { "widget": { "alias": "widget"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+/**
+ * Registry of all built-in widget components
+ * Maps widget type to Angular component class
+ */
+declare const BUILT_IN_WIDGET_COMPONENTS: Record<string, Type<CustomWidgetComponent>>;
+
 /**
  * @bbq-chat/widgets-angular
  *
@@ -329,7 +612,7 @@ declare class WidgetRendererComponent implements OnInit, AfterViewInit, OnDestro
  * @packageDocumentation
  */
 
-declare const VERSION = "1.0.3";
+declare const VERSION = "1.0.4";
 
-export { SSR_WIDGET_RENDERER, VERSION, WIDGET_EVENT_MANAGER_FACTORY, WidgetRegistryService, WidgetRendererComponent, isComponentRenderer, isHtmlRenderer, isTemplateRenderer, ssrWidgetRendererFactory, widgetEventManagerFactoryProvider };
-export type { CustomWidgetComponent, CustomWidgetHtmlRenderer, CustomWidgetRenderer, CustomWidgetRendererConfig, WidgetEventManagerFactory, WidgetTemplateContext };
+export { ANGULAR_WIDGET_RENDERER, AngularWidgetRenderer, BUILT_IN_WIDGET_COMPONENTS, ButtonWidgetComponent, CardWidgetComponent, DatePickerWidgetComponent, DropdownWidgetComponent, FileUploadWidgetComponent, FormWidgetComponent, ImageCollectionWidgetComponent, ImageWidgetComponent, InputWidgetComponent, MultiSelectWidgetComponent, ProgressBarWidgetComponent, SSR_WIDGET_RENDERER, SliderWidgetComponent, TextAreaWidgetComponent, ThemeSwitcherWidgetComponent, ToggleWidgetComponent, VERSION, WIDGET_EVENT_MANAGER_FACTORY, WidgetRegistryService, WidgetRendererComponent, angularWidgetRendererFactory, isComponentRenderer, isHtmlRenderer, isTemplateRenderer, ssrWidgetRendererFactory, widgetEventManagerFactoryProvider };
+export type { AngularRendererOptions, CustomWidgetComponent, CustomWidgetHtmlRenderer, CustomWidgetRenderer, CustomWidgetRendererConfig, WidgetEventManagerFactory, WidgetTemplateContext };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bbq-chat/widgets-angular",
-  "version": "1.0.4",
+  "version": "1.0.5",
   "description": "Angular components and services for BbQ ChatWidgets",
   "license": "MIT",
   "author": "BbQ ChatWidgets Contributors",