@agnos-ui/angular-bootstrap 0.3.1 → 0.4.0-next.0

package/agnos-ui-angular.module.d.ts

@@ -11,6 +11,6 @@ import * as i9 from "./components/progressbar/progressbar.component";
 import * as i10 from "./components/toast/toast.component";
 export declare class AgnosUIAngularModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<AgnosUIAngularModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<AgnosUIAngularModule, never, [typeof i1.SlotDirective, typeof i2.SelectComponent, typeof i2.SelectBadgeLabelDirective, typeof i2.SelectItemDirective, typeof i1.UseDirective, typeof i1.UseMultiDirective, typeof i3.RatingComponent, typeof i3.RatingStarDirective, typeof i4.PaginationComponent, typeof i4.PaginationEllipsisDirective, typeof i4.PaginationFirstDirective, typeof i4.PaginationLastDirective, typeof i4.PaginationNextDirective, typeof i4.PaginationNumberDirective, typeof i4.PaginationPreviousDirective, typeof i4.PaginationPagesDirective, typeof i4.PaginationStructureDirective, typeof i5.ModalComponent, typeof i5.ModalStructureDirective, typeof i5.ModalHeaderDirective, typeof i5.ModalTitleDirective, typeof i5.ModalBodyDirective, typeof i5.ModalFooterDirective, typeof i6.AlertComponent, typeof i6.AlertStructureDirective, typeof i6.AlertBodyDirective, typeof i7.AccordionDirective, typeof i7.AccordionItemComponent, typeof i7.AccordionHeaderDirective, typeof i7.AccordionBodyDirective, typeof i7.AccordionItemStructureDirective, typeof i8.SliderComponent, typeof i8.SliderHandleDirective, typeof i8.SliderLabelDirective, typeof i8.SliderStructureDirective, typeof i9.ProgressbarComponent, typeof i9.ProgressbarStructureDirective, typeof i10.ToastComponent, typeof i10.ToastStructureDirective, typeof i10.ToastBodyDirective, typeof i10.ToastHeaderDirective], [typeof i1.SlotDirective, typeof i2.SelectComponent, typeof i2.SelectBadgeLabelDirective, typeof i2.SelectItemDirective, typeof i1.UseDirective, typeof i1.UseMultiDirective, typeof i3.RatingComponent, typeof i3.RatingStarDirective, typeof i4.PaginationComponent, typeof i4.PaginationEllipsisDirective, typeof i4.PaginationFirstDirective, typeof i4.PaginationLastDirective, typeof i4.PaginationNextDirective, typeof i4.PaginationNumberDirective, typeof i4.PaginationPreviousDirective, typeof i4.PaginationPagesDirective, typeof i4.PaginationStructureDirective, typeof i5.ModalComponent, typeof i5.ModalStructureDirective, typeof i5.ModalHeaderDirective, typeof i5.ModalTitleDirective, typeof i5.ModalBodyDirective, typeof i5.ModalFooterDirective, typeof i6.AlertComponent, typeof i6.AlertStructureDirective, typeof i6.AlertBodyDirective, typeof i7.AccordionDirective, typeof i7.AccordionItemComponent, typeof i7.AccordionHeaderDirective, typeof i7.AccordionBodyDirective, typeof i7.AccordionItemStructureDirective, typeof i8.SliderComponent, typeof i8.SliderHandleDirective, typeof i8.SliderLabelDirective, typeof i8.SliderStructureDirective, typeof i9.ProgressbarComponent, typeof i9.ProgressbarStructureDirective, typeof i10.ToastComponent, typeof i10.ToastStructureDirective, typeof i10.ToastBodyDirective, typeof i10.ToastHeaderDirective]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<AgnosUIAngularModule, never, [typeof i1.SlotDirective, typeof i2.SelectComponent, typeof i2.SelectBadgeLabelDirective, typeof i2.SelectItemLabelDirective, typeof i1.UseDirective, typeof i1.UseMultiDirective, typeof i3.RatingComponent, typeof i3.RatingStarDirective, typeof i4.PaginationComponent, typeof i4.PaginationEllipsisDirective, typeof i4.PaginationFirstDirective, typeof i4.PaginationLastDirective, typeof i4.PaginationNextDirective, typeof i4.PaginationNumberDirective, typeof i4.PaginationPreviousDirective, typeof i4.PaginationPagesDirective, typeof i4.PaginationStructureDirective, typeof i5.ModalComponent, typeof i5.ModalStructureDirective, typeof i5.ModalHeaderDirective, typeof i5.ModalTitleDirective, typeof i5.ModalBodyDirective, typeof i5.ModalFooterDirective, typeof i6.AlertComponent, typeof i6.AlertStructureDirective, typeof i6.AlertBodyDirective, typeof i7.AccordionDirective, typeof i7.AccordionItemComponent, typeof i7.AccordionHeaderDirective, typeof i7.AccordionBodyDirective, typeof i7.AccordionItemStructureDirective, typeof i8.SliderComponent, typeof i8.SliderHandleDirective, typeof i8.SliderLabelDirective, typeof i8.SliderStructureDirective, typeof i9.ProgressbarComponent, typeof i9.ProgressbarStructureDirective, typeof i10.ToastComponent, typeof i10.ToastStructureDirective, typeof i10.ToastBodyDirective, typeof i10.ToastHeaderDirective], [typeof i1.SlotDirective, typeof i2.SelectComponent, typeof i2.SelectBadgeLabelDirective, typeof i2.SelectItemLabelDirective, typeof i1.UseDirective, typeof i1.UseMultiDirective, typeof i3.RatingComponent, typeof i3.RatingStarDirective, typeof i4.PaginationComponent, typeof i4.PaginationEllipsisDirective, typeof i4.PaginationFirstDirective, typeof i4.PaginationLastDirective, typeof i4.PaginationNextDirective, typeof i4.PaginationNumberDirective, typeof i4.PaginationPreviousDirective, typeof i4.PaginationPagesDirective, typeof i4.PaginationStructureDirective, typeof i5.ModalComponent, typeof i5.ModalStructureDirective, typeof i5.ModalHeaderDirective, typeof i5.ModalTitleDirective, typeof i5.ModalBodyDirective, typeof i5.ModalFooterDirective, typeof i6.AlertComponent, typeof i6.AlertStructureDirective, typeof i6.AlertBodyDirective, typeof i7.AccordionDirective, typeof i7.AccordionItemComponent, typeof i7.AccordionHeaderDirective, typeof i7.AccordionBodyDirective, typeof i7.AccordionItemStructureDirective, typeof i8.SliderComponent, typeof i8.SliderHandleDirective, typeof i8.SliderLabelDirective, typeof i8.SliderStructureDirective, typeof i9.ProgressbarComponent, typeof i9.ProgressbarStructureDirective, typeof i10.ToastComponent, typeof i10.ToastStructureDirective, typeof i10.ToastBodyDirective, typeof i10.ToastHeaderDirective]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<AgnosUIAngularModule>;
 }

package/components/accordion/accordion.component.d.ts

@@ -2,7 +2,7 @@ import type { SlotContent, TransitionFn } from '@agnos-ui/angular-headless';
 import { BaseWidgetDirective, ComponentTemplate } from '@agnos-ui/angular-headless';
 import type { AfterContentChecked, AfterViewInit } from '@angular/core';
 import { EventEmitter, TemplateRef } from '@angular/core';
-import type { AccordionItemContext, AccordionItemWidget, AccordionWidget } from './accordion';
+import type { AccordionItemContext, AccordionItemProps, AccordionItemWidget, AccordionWidget } from './accordion';
 import * as i0 from "@angular/core";
 export declare class AccordionBodyDirective {
     templateRef: TemplateRef<any>;
@@ -29,86 +29,105 @@ export declare class AccordionItemDefaultSlotsComponent {
 }
 export declare const accordionItemDefaultSlotItemStructure: ComponentTemplate<unknown, "structure", AccordionItemDefaultSlotsComponent>;
 export declare class AccordionItemComponent extends BaseWidgetDirective<AccordionItemWidget> implements AfterContentChecked, AfterViewInit {
-    slotItemHeader: SlotContent<AccordionItemContext>;
-    slotItemHeaderFromContent: AccordionHeaderDirective | null;
-    slotItemBody: SlotContent<AccordionItemContext>;
-    slotItemBodyFromContent: AccordionBodyDirective | null;
-    slotItemStructure: SlotContent<AccordionItemContext>;
-    slotItemStructureFromContent: AccordionItemStructureDirective | null;
+    /**
+     * Content present in the accordion button inside the accordion header.
+     *
+     * It is a prop of the accordion-item.
+     */
+    header: SlotContent<AccordionItemContext>;
+    slotHeaderFromContent: AccordionHeaderDirective | undefined;
+    /**
+     * Content present in the accordion body.
+     *
+     * It is a prop of the accordion-item.
+     */
+    children: SlotContent<AccordionItemContext>;
+    slotBodyFromContent: AccordionBodyDirective | undefined;
+    /**
+     * Structure of the accordion-item. The default item structure is: accordion-item
+     * contains accordion header and accordion-item body container; the accordion header contains the accordion button
+     * (that contains `header`), while the accordion-item body container contains the accordion body (that contains `children`).
+     * The itemTransition is applied on this element.
+     *
+     * It is a prop of the accordion-item.
+     */
+    structure: SlotContent<AccordionItemContext>;
+    slotStructureFromContent: AccordionItemStructureDirective | undefined;
     /**
      * The id of the accordion-item. It can be used for controlling the accordion-item via the accordion api.
      */
-    itemId: string | undefined;
+    id: string | undefined;
     /**
      * The transition to use for the accordion-item body-container when the accordion-item is toggled.
      */
-    itemTransition: TransitionFn | undefined;
+    transition: TransitionFn | undefined;
     /**
-     * CSS classes to add on the accordion-item DOM element.
+     * CSS classes to be applied on the widget main container
      */
-    itemClass: string | undefined;
+    className: string | undefined;
     /**
      * If `true`, the accordion-item body container will be removed from the DOM when the accordion-item is collapsed. It will be just hidden otherwise.
      */
-    itemDestroyOnHide: boolean | undefined;
+    destroyOnHide: boolean | undefined;
     /**
      * If `true`, the accordion-item will be disabled.
      * It will not react to user's clicks, but still will be possible to toggle programmatically.
      */
-    itemDisabled: boolean | undefined;
+    disabled: boolean | undefined;
     /**
      * If `true`, the accordion-item will be visible (expanded). Otherwise, it will be hidden (collapsed).
      */
-    itemVisible: boolean | undefined;
+    visible: boolean | undefined;
     /**
      * If `true`, accordion-item will be animated.
      */
-    itemAnimated: boolean | undefined;
+    animated: boolean | undefined;
     /**
      * CSS classes to add on the accordion-item header DOM element.
      */
-    itemHeaderClass: string | undefined;
+    headerClassName: string | undefined;
     /**
      * CSS classes to add on the accordion-item collapse DOM element.
      */
-    itemButtonClass: string | undefined;
+    buttonClassName: string | undefined;
     /**
      * CSS classes to add on the accordion-item body container DOM element.
      * The accordion-item body container is the DOM element on what the itemTransition is applied.
      */
-    itemBodyContainerClass: string | undefined;
+    bodyContainerClassName: string | undefined;
     /**
      * CSS classes to add on the accordion-item body DOM element.
      */
-    itemBodyClass: string | undefined;
+    bodyClassName: string | undefined;
     /**
      * The html tag to use for the accordion-item-header.
      */
-    itemHeadingTag: string | undefined;
+    headingTag: string | undefined;
     /**
      * An event fired when an item is shown.
      */
-    itemShown: EventEmitter<void>;
+    shown: EventEmitter<void>;
     /**
      * An event fired when an item is hidden.
      */
-    itemHidden: EventEmitter<void>;
+    hidden: EventEmitter<void>;
     /**
      * An event fired when the `visible` value changes.
      *
      * Event payload is the new value of visible.
      */
-    itemVisibleChange: EventEmitter<boolean>;
+    visibleChange: EventEmitter<boolean>;
     readonly ad: AccordionDirective;
+    readonly defaultSlots: import("@amadeus-it-group/tansu").WritableSignal<Partial<AccordionItemProps>, Partial<AccordionItemProps>>;
     readonly _widget: import("@agnos-ui/angular-headless").AngularWidget<AccordionItemWidget>;
     ngAfterContentChecked(): void;
     ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<AccordionItemComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<AccordionItemComponent, "[auAccordionItem]", ["auAccordionItem"], { "slotItemHeader": { "alias": "auSlotItemHeader"; "required": false; }; "slotItemBody": { "alias": "auSlotItemBody"; "required": false; }; "slotItemStructure": { "alias": "auSlotItemStructure"; "required": false; }; "itemId": { "alias": "auItemId"; "required": false; }; "itemTransition": { "alias": "auItemTransition"; "required": false; }; "itemClass": { "alias": "auItemClass"; "required": false; }; "itemDestroyOnHide": { "alias": "auItemDestroyOnHide"; "required": false; }; "itemDisabled": { "alias": "auItemDisabled"; "required": false; }; "itemVisible": { "alias": "auItemVisible"; "required": false; }; "itemAnimated": { "alias": "auItemAnimated"; "required": false; }; "itemHeaderClass": { "alias": "auItemHeaderClass"; "required": false; }; "itemButtonClass": { "alias": "auItemButtonClass"; "required": false; }; "itemBodyContainerClass": { "alias": "auItemBodyContainerClass"; "required": false; }; "itemBodyClass": { "alias": "auItemBodyClass"; "required": false; }; "itemHeadingTag": { "alias": "auItemHeadingTag"; "required": false; }; }, { "itemShown": "auItemShown"; "itemHidden": "auItemHidden"; "itemVisibleChange": "auItemVisibleChange"; }, ["slotItemHeaderFromContent", "slotItemBodyFromContent", "slotItemStructureFromContent"], never, true, never>;
-    static ngAcceptInputType_itemDestroyOnHide: unknown;
-    static ngAcceptInputType_itemDisabled: unknown;
-    static ngAcceptInputType_itemVisible: unknown;
-    static ngAcceptInputType_itemAnimated: unknown;
+    static ɵcmp: i0.ɵɵComponentDeclaration<AccordionItemComponent, "[auAccordionItem]", ["auAccordionItem"], { "header": { "alias": "auHeader"; "required": false; }; "children": { "alias": "auChildren"; "required": false; }; "structure": { "alias": "auStructure"; "required": false; }; "id": { "alias": "auId"; "required": false; }; "transition": { "alias": "auTransition"; "required": false; }; "className": { "alias": "auClassName"; "required": false; }; "destroyOnHide": { "alias": "auDestroyOnHide"; "required": false; }; "disabled": { "alias": "auDisabled"; "required": false; }; "visible": { "alias": "auVisible"; "required": false; }; "animated": { "alias": "auAnimated"; "required": false; }; "headerClassName": { "alias": "auHeaderClassName"; "required": false; }; "buttonClassName": { "alias": "auButtonClassName"; "required": false; }; "bodyContainerClassName": { "alias": "auBodyContainerClassName"; "required": false; }; "bodyClassName": { "alias": "auBodyClassName"; "required": false; }; "headingTag": { "alias": "auHeadingTag"; "required": false; }; }, { "shown": "auShown"; "hidden": "auHidden"; "visibleChange": "auVisibleChange"; }, ["slotHeaderFromContent", "slotBodyFromContent", "slotStructureFromContent"], ["*"], true, never>;
+    static ngAcceptInputType_destroyOnHide: unknown;
+    static ngAcceptInputType_disabled: unknown;
+    static ngAcceptInputType_visible: unknown;
+    static ngAcceptInputType_animated: unknown;
 }
 export declare class AccordionDirective extends BaseWidgetDirective<AccordionWidget> {
     /**
@@ -124,116 +143,63 @@ export declare class AccordionDirective extends BaseWidgetDirective<AccordionWid
      *
      * Event payload is the id of the item.
      */
-    shown: EventEmitter<string>;
+    itemShown: EventEmitter<string>;
     /**
      * An event fired when an item is hidden.
      *
      * Event payload is the id of the item.
      */
-    hidden: EventEmitter<string>;
-    /**
-     * The id of the accordion-item. It can be used for controlling the accordion-item via the accordion api.
-     *
-     * It is a prop of the accordion-item.
-     */
-    itemId: string | undefined;
+    itemHidden: EventEmitter<string>;
     /**
      * If `true`, the accordion-item body container will be removed from the DOM when the accordion-item is collapsed. It will be just hidden otherwise.
-     *
-     * It is a prop of the accordion-item.
      */
     itemDestroyOnHide: boolean | undefined;
-    /**
-     * If `true`, the accordion-item will be disabled.
-     * It will not react to user's clicks, but still will be possible to toggle programmatically.
-     *
-     * It is a prop of the accordion-item.
-     */
-    itemDisabled: boolean | undefined;
-    /**
-     * If `true`, the accordion-item will be visible (expanded). Otherwise, it will be hidden (collapsed).
-     *
-     * It is a prop of the accordion-item.
-     */
-    itemVisible: boolean | undefined;
     /**
      * If `true`, accordion-item will be animated.
-     *
-     * It is a prop of the accordion-item.
      */
     itemAnimated: boolean | undefined;
     /**
      * The transition to use for the accordion-item body-container when the accordion-item is toggled.
-     *
-     * It is a prop of the accordion-item.
      */
     itemTransition: TransitionFn | undefined;
-    slotItemStructure: SlotContent<AccordionItemContext>;
-    slotItemBody: SlotContent<AccordionItemContext>;
-    slotItemHeader: SlotContent<AccordionItemContext>;
     /**
-     * CSS classes to add on the accordion-item DOM element.
+     * Structure of the accordion-item. The default item structure is: accordion-item
+     * contains accordion header and accordion-item body container; the accordion header contains the accordion button
+     * (that contains `header`), while the accordion-item body container contains the accordion body (that contains `children`).
+     * The itemTransition is applied on this element.
      *
      * It is a prop of the accordion-item.
      */
-    itemClass: string | undefined;
+    itemStructure: SlotContent<AccordionItemContext>;
+    /**
+     * CSS classes to add on the accordion-item DOM element.
+     */
+    itemClassName: string | undefined;
     /**
      * CSS classes to add on the accordion-item header DOM element.
-     *
-     * It is a prop of the accordion-item.
      */
-    itemHeaderClass: string | undefined;
+    itemHeaderClassName: string | undefined;
     /**
      * CSS classes to add on the accordion-item toggle button DOM element.
-     *
-     * It is a prop of the accordion-item.
      */
-    itemButtonClass: string | undefined;
+    itemButtonClassName: string | undefined;
     /**
      * CSS classes to add on the accordion-item body container DOM element.
      * The accordion-item body container is the DOM element on what the itemTransition is applied.
-     *
-     * It is a prop of the accordion-item.
      */
-    itemBodyContainerClass: string | undefined;
+    itemBodyContainerClassName: string | undefined;
     /**
      * CSS classes to add on the accordion-item body DOM element.
-     *
-     * It is a prop of the accordion-item.
      */
-    itemBodyClass: string | undefined;
+    itemBodyClassName: string | undefined;
     /**
      * The html tag to use for the accordion-item-header.
-     *
-     * It is a prop of the accordion-item.
      */
     itemHeadingTag: string | undefined;
-    /**
-     * An event fired when an item is shown.
-     *
-     * It is a prop of the accordion-item.
-     */
-    itemShown: EventEmitter<void>;
-    /**
-     * An event fired when an item is hidden.
-     *
-     * It is a prop of the accordion-item.
-     */
-    itemHidden: EventEmitter<void>;
-    /**
-     * An event fired when the `visible` value changes.
-     *
-     * Event payload is the new value of visible.
-     *
-     * It is a prop of the accordion-item.
-     */
-    itemVisibleChange: EventEmitter<boolean>;
     readonly _widget: import("@agnos-ui/angular-headless").AngularWidget<AccordionWidget>;
     static ɵfac: i0.ɵɵFactoryDeclaration<AccordionDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<AccordionDirective, "[auAccordion]", ["auAccordion"], { "closeOthers": { "alias": "auCloseOthers"; "required": false; }; "className": { "alias": "auClassName"; "required": false; }; "itemId": { "alias": "auItemId"; "required": false; }; "itemDestroyOnHide": { "alias": "auItemDestroyOnHide"; "required": false; }; "itemDisabled": { "alias": "auItemDisabled"; "required": false; }; "itemVisible": { "alias": "auItemVisible"; "required": false; }; "itemAnimated": { "alias": "auItemAnimated"; "required": false; }; "itemTransition": { "alias": "auItemTransition"; "required": false; }; "slotItemStructure": { "alias": "auSlotItemStructure"; "required": false; }; "slotItemBody": { "alias": "auSlotItemBody"; "required": false; }; "slotItemHeader": { "alias": "auSlotItemHeader"; "required": false; }; "itemClass": { "alias": "auItemClass"; "required": false; }; "itemHeaderClass": { "alias": "auItemHeaderClass"; "required": false; }; "itemButtonClass": { "alias": "auItemButtonClass"; "required": false; }; "itemBodyContainerClass": { "alias": "auItemBodyContainerClass"; "required": false; }; "itemBodyClass": { "alias": "auItemBodyClass"; "required": false; }; "itemHeadingTag": { "alias": "auItemHeadingTag"; "required": false; }; }, { "shown": "auShown"; "hidden": "auHidden"; "itemShown": "auItemShown"; "itemHidden": "auItemHidden"; "itemVisibleChange": "auItemVisibleChange"; }, never, never, true, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<AccordionDirective, "[auAccordion]", ["auAccordion"], { "closeOthers": { "alias": "auCloseOthers"; "required": false; }; "className": { "alias": "auClassName"; "required": false; }; "itemDestroyOnHide": { "alias": "auItemDestroyOnHide"; "required": false; }; "itemAnimated": { "alias": "auItemAnimated"; "required": false; }; "itemTransition": { "alias": "auItemTransition"; "required": false; }; "itemStructure": { "alias": "auItemStructure"; "required": false; }; "itemClassName": { "alias": "auItemClassName"; "required": false; }; "itemHeaderClassName": { "alias": "auItemHeaderClassName"; "required": false; }; "itemButtonClassName": { "alias": "auItemButtonClassName"; "required": false; }; "itemBodyContainerClassName": { "alias": "auItemBodyContainerClassName"; "required": false; }; "itemBodyClassName": { "alias": "auItemBodyClassName"; "required": false; }; "itemHeadingTag": { "alias": "auItemHeadingTag"; "required": false; }; }, { "itemShown": "auItemShown"; "itemHidden": "auItemHidden"; }, never, never, true, never>;
     static ngAcceptInputType_closeOthers: unknown;
     static ngAcceptInputType_itemDestroyOnHide: unknown;
-    static ngAcceptInputType_itemDisabled: unknown;
-    static ngAcceptInputType_itemVisible: unknown;
     static ngAcceptInputType_itemAnimated: unknown;
 }

package/components/accordion/accordion.d.ts

@@ -1,11 +1,6 @@
-import type { AdaptWidgetSlots, WidgetProps, WidgetState, AdaptSlotContentProps, WidgetFactory } from '@agnos-ui/angular-headless';
-export * from '@agnos-ui/core-bootstrap/components/accordion';
-export type AccordionWidget = AdaptWidgetSlots<import('@agnos-ui/core-bootstrap/components/accordion').AccordionWidget>;
-export type AccordionProps = WidgetProps<AccordionWidget>;
-export type AccordionState = WidgetState<AccordionWidget>;
-export type AccordionApi = AccordionWidget['api'];
-export type AccordionItemWidget = AdaptWidgetSlots<import('@agnos-ui/core-bootstrap/components/accordion').AccordionItemWidget>;
-export type AccordionItemProps = WidgetProps<AccordionItemWidget>;
-export type AccordionItemState = WidgetState<AccordionItemWidget>;
-export type AccordionItemContext = AdaptSlotContentProps<import('@agnos-ui/core-bootstrap/components/accordion').AccordionItemContext>;
+import type { WidgetFactory } from '@agnos-ui/angular-headless';
+import type { AccordionItemWidget, AccordionProps, AccordionWidget } from './accordion.gen';
+export type * from './accordion.gen';
 export declare const createAccordion: WidgetFactory<AccordionWidget>;
+export declare const getAccordionDefaultConfig: () => AccordionProps;
+export declare const createAccordionItem: WidgetFactory<AccordionItemWidget>;

package/components/accordion/accordion.gen.d.ts

@@ -0,0 +1,342 @@
+import type { WidgetSlotContext, SlotContent, TransitionFn, Widget, PropsConfig, Directive } from '@agnos-ui/angular-headless';
+export type AccordionItemContext = WidgetSlotContext<AccordionItemWidget>;
+export interface AccordionState {
+    /**
+     * Array containing all the accordion-items contained in the accordion.
+     */
+    itemWidgets: AccordionItemWidget[];
+    /**
+     * CSS classes to be applied on the widget main container
+     */
+    className: string;
+    /**
+     * Structure of the accordion-item. The default item structure is: accordion-item
+     * contains accordion header and accordion-item body container; the accordion header contains the accordion button
+     * (that contains `header`), while the accordion-item body container contains the accordion body (that contains `children`).
+     * The itemTransition is applied on this element.
+     *
+     * It is a prop of the accordion-item.
+     */
+    itemStructure: SlotContent<AccordionItemContext>;
+}
+export interface AccordionProps {
+    /**
+     * If `true`, only one accordion-item at the time can stay open.
+     */
+    closeOthers: boolean;
+    /**
+     * An event fired when an item is shown.
+     *
+     * Event payload is the id of the item.
+     */
+    onItemShown: (itemId: string) => void;
+    /**
+     * An event fired when an item is hidden.
+     *
+     * Event payload is the id of the item.
+     */
+    onItemHidden: (itemId: string) => void;
+    /**
+     * If `true`, the accordion-item body container will be removed from the DOM when the accordion-item is collapsed. It will be just hidden otherwise.
+     */
+    itemDestroyOnHide: boolean;
+    /**
+     * If `true`, accordion-item will be animated.
+     */
+    itemAnimated: boolean;
+    /**
+     * The transition to use for the accordion-item body-container when the accordion-item is toggled.
+     */
+    itemTransition: TransitionFn;
+    /**
+     * CSS classes to add on the accordion-item DOM element.
+     */
+    itemClassName: string;
+    /**
+     * CSS classes to add on the accordion-item header DOM element.
+     */
+    itemHeaderClassName: string;
+    /**
+     * CSS classes to add on the accordion-item toggle button DOM element.
+     */
+    itemButtonClassName: string;
+    /**
+     * CSS classes to add on the accordion-item body container DOM element.
+     * The accordion-item body container is the DOM element on what the itemTransition is applied.
+     */
+    itemBodyContainerClassName: string;
+    /**
+     * CSS classes to add on the accordion-item body DOM element.
+     */
+    itemBodyClassName: string;
+    /**
+     * The html tag to use for the accordion-item-header.
+     */
+    itemHeadingTag: string;
+    /**
+     * CSS classes to be applied on the widget main container
+     */
+    className: string;
+    /**
+     * Structure of the accordion-item. The default item structure is: accordion-item
+     * contains accordion header and accordion-item body container; the accordion header contains the accordion button
+     * (that contains `header`), while the accordion-item body container contains the accordion body (that contains `children`).
+     * The itemTransition is applied on this element.
+     *
+     * It is a prop of the accordion-item.
+     */
+    itemStructure: SlotContent<AccordionItemContext>;
+}
+export type AccordionWidget = Widget<AccordionProps, AccordionState, AccordionApi, object, AccordionDirectives>;
+export interface AccordionItemState {
+    /**
+     * If `true` the content of the accordion-item collapse should be in DOM. Its value depends on the
+     * value of the `visible` and `destroyOnHide`.
+     */
+    shouldBeInDOM: boolean;
+    /**
+     * If `true`, the accordion-item will be visible (expanded). Otherwise, it will be hidden (collapsed).
+     */
+    visible: boolean;
+    /**
+     * If `true`, the accordion-item will be disabled.
+     * It will not react to user's clicks, but still will be possible to toggle programmatically.
+     */
+    disabled: boolean;
+    /**
+     * The id of the accordion-item. It can be used for controlling the accordion-item via the accordion api.
+     */
+    id: string;
+    /**
+     * CSS classes to add on the accordion-item header DOM element.
+     */
+    headerClassName: string;
+    /**
+     * CSS classes to add on the accordion-item collapse DOM element.
+     */
+    buttonClassName: string;
+    /**
+     * CSS classes to add on the accordion-item body container DOM element.
+     * The accordion-item body container is the DOM element on what the itemTransition is applied.
+     */
+    bodyContainerClassName: string;
+    /**
+     * CSS classes to add on the accordion-item body DOM element.
+     */
+    bodyClassName: string;
+    /**
+     * The html tag to use for the accordion-item-header.
+     */
+    headingTag: string;
+    /**
+     * CSS classes to be applied on the widget main container
+     */
+    className: string;
+    /**
+     * Structure of the accordion-item. The default item structure is: accordion-item
+     * contains accordion header and accordion-item body container; the accordion header contains the accordion button
+     * (that contains `header`), while the accordion-item body container contains the accordion body (that contains `children`).
+     * The itemTransition is applied on this element.
+     *
+     * It is a prop of the accordion-item.
+     */
+    structure: SlotContent<AccordionItemContext>;
+    /**
+     * Content present in the accordion body.
+     *
+     * It is a prop of the accordion-item.
+     */
+    children: SlotContent<AccordionItemContext>;
+    /**
+     * Content present in the accordion button inside the accordion header.
+     *
+     * It is a prop of the accordion-item.
+     */
+    header: SlotContent<AccordionItemContext>;
+}
+export interface AccordionItemProps {
+    /**
+     * If `true`, accordion-item will be animated.
+     */
+    animated: boolean;
+    /**
+     * The transition to use for the accordion-item body-container when the accordion-item is toggled.
+     */
+    transition: TransitionFn;
+    /**
+     * If `true`, the accordion-item body container will be removed from the DOM when the accordion-item is collapsed. It will be just hidden otherwise.
+     */
+    destroyOnHide: boolean;
+    /**
+     * An event fired when an item is shown.
+     */
+    onShown: () => void;
+    /**
+     * An event fired when an item is hidden.
+     */
+    onHidden: () => void;
+    /**
+     * An event fired when the `visible` value changes.
+     *
+     * Event payload is the new value of visible.
+     */
+    onVisibleChange: (visible: boolean) => void;
+    /**
+     * If `true`, the accordion-item will be visible (expanded). Otherwise, it will be hidden (collapsed).
+     */
+    visible: boolean;
+    /**
+     * If `true`, the accordion-item will be disabled.
+     * It will not react to user's clicks, but still will be possible to toggle programmatically.
+     */
+    disabled: boolean;
+    /**
+     * The id of the accordion-item. It can be used for controlling the accordion-item via the accordion api.
+     */
+    id: string;
+    /**
+     * CSS classes to add on the accordion-item header DOM element.
+     */
+    headerClassName: string;
+    /**
+     * CSS classes to add on the accordion-item collapse DOM element.
+     */
+    buttonClassName: string;
+    /**
+     * CSS classes to add on the accordion-item body container DOM element.
+     * The accordion-item body container is the DOM element on what the itemTransition is applied.
+     */
+    bodyContainerClassName: string;
+    /**
+     * CSS classes to add on the accordion-item body DOM element.
+     */
+    bodyClassName: string;
+    /**
+     * The html tag to use for the accordion-item-header.
+     */
+    headingTag: string;
+    /**
+     * CSS classes to be applied on the widget main container
+     */
+    className: string;
+    /**
+     * Structure of the accordion-item. The default item structure is: accordion-item
+     * contains accordion header and accordion-item body container; the accordion header contains the accordion button
+     * (that contains `header`), while the accordion-item body container contains the accordion body (that contains `children`).
+     * The itemTransition is applied on this element.
+     *
+     * It is a prop of the accordion-item.
+     */
+    structure: SlotContent<AccordionItemContext>;
+    /**
+     * Content present in the accordion body.
+     *
+     * It is a prop of the accordion-item.
+     */
+    children: SlotContent<AccordionItemContext>;
+    /**
+     * Content present in the accordion button inside the accordion header.
+     *
+     * It is a prop of the accordion-item.
+     */
+    header: SlotContent<AccordionItemContext>;
+}
+export type AccordionItemWidget = Widget<AccordionItemProps, AccordionItemState, AccordionItemApi, AccordionItemActions, AccordionItemDirectives>;
+export interface AccordionApi {
+    /**
+     * Given the itemId, will expand the corresponding accordion-item.
+     *
+     * If the itemId is not valid, nothing will happen.
+     */
+    expand(itemId: string): void;
+    /**
+     * Given the itemId, will collapse the corresponding accordion-item.
+     *
+     * If the itemId is not valid, nothing will happen.
+     */
+    collapse(itemId: string): void;
+    /**
+     * Given the itemId, will toggle the corresponding accordion-item.
+     *
+     * If the itemId is not valid, nothing will happen.
+     */
+    toggle(itemId: string): void;
+    /**
+     * It will expand all the items in the accordion.
+     *
+     * If `closeOthers` is `true` it will expand only the last accordion-item.
+     */
+    expandAll(): void;
+    /**
+     * It will collapse all the accordion-items in the accordion.
+     */
+    collapseAll(): void;
+    /**
+     * Creates a new accordionItem.
+     */
+    registerItem(itemConfig?: PropsConfig<AccordionItemProps>): AccordionItemWidget;
+}
+export interface AccordionDirectives {
+    /**
+     * Directive to put on the accordion DOM element
+     */
+    accordionDirective: Directive;
+}
+export interface AccordionItemActions {
+    /**
+     * Action to be called when the user clicks on the accordion-item button. If the accordion-item is disabled nothing will happen.
+     */
+    click(): void;
+}
+export interface AccordionItemApi {
+    /**
+     * It will collapse the accordion-item.
+     */
+    collapse(): void;
+    /**
+     * It will expand the accordion-item.
+     */
+    expand(): void;
+    /**
+     * It will toggle the accordion-item.
+     */
+    toggle(): void;
+    /**
+     * Method to be called after the initialization to allow animations.
+     */
+    initDone(): void;
+}
+export interface AccordionItemDirectives {
+    /**
+     * Directive to use in special cases, if the accordion header does not use a button element to control the collapsing.
+     */
+    toggleDirective: Directive;
+    /**
+     * Directive to put on the button element that will control the collapsing of the accordion-item.
+     */
+    buttonDirective: Directive;
+    /**
+     * Directive to put on the accordion-item header that will contain the button element.
+     */
+    headerDirective: Directive;
+    /**
+     * Directive to put on the accordion-item body.
+     */
+    bodyDirective: Directive;
+    /**
+     * Directive to apply the itemTransition
+     */
+    transitionDirective: Directive;
+    /**
+     * Directive to apply aria attributes to the expanded body panel
+     */
+    bodyContainerAttrsDirective: Directive;
+    /**
+     * Directive to be put on the accordion-item body container. It will handle the animation.
+     */
+    bodyContainerDirective: Directive;
+    /**
+     * Directive to be put on the accordion-item. It will handle adding the accordion-item to the accordion.
+     */
+    itemDirective: Directive;
+}