flowbite-angular 1.2.0 → 20.0.1

package/fesm2022/flowbite-angular-accordion.mjs

@@ -1,565 +1,426 @@
-import { mergeTheme, CHEVRON_DOWN_SVG_ICON, createTheme } from 'flowbite-angular/utils';
+import { createTheme, mergeDeep, colorToTheme } from 'flowbite-angular';
 import * as i0 from '@angular/core';
-import { InjectionToken, inject, Injectable, makeEnvironmentProviders, model, Component, ViewEncapsulation, ChangeDetectionStrategy, contentChild, untracked, contentChildren } from '@angular/core';
+import { InjectionToken, inject, input, booleanAttribute, computed, Directive } from '@angular/core';
+import { createStateToken, createStateProvider, createStateInjector, createState } from 'ng-primitives/state';
+import * as i1 from 'ng-primitives/accordion';
+import { provideAccordionState, NgpAccordion, injectAccordionItemState, provideAccordionItemState, NgpAccordionItem, NgpAccordionTrigger, NgpAccordionContent } from 'ng-primitives/accordion';
 import { twMerge } from 'tailwind-merge';
-import { BaseComponent, booleanToFlowbiteBoolean } from 'flowbite-angular';
-import { trigger, state, style, transition, animate } from '@angular/animations';
-import { IconRegistry, IconComponent } from 'flowbite-angular/icon';
-import { NgTemplateOutlet } from '@angular/common';
-import { DomSanitizer } from '@angular/platform-browser';
+import * as i1$1 from 'ng-primitives/button';
+import { NgpButton } from 'ng-primitives/button';
+import * as i2 from 'ng-primitives/interactions';
+import { NgpFocus } from 'ng-primitives/interactions';
 
+const flowbiteAccordionTheme = createTheme({
+    host: {
+        base: 'shadow-sm',
+        transition: '',
+    },
+});
+
+const defaultFlowbiteAccordionConfig = {
+    baseTheme: flowbiteAccordionTheme,
+    color: 'default',
+    flush: false,
+    customTheme: {},
+};
+const FlowbiteAccordionConfigToken = new InjectionToken('FlowbiteAccordionConfig');
 /**
- * `InjectionToken` used to import `AccordionContentTheme` value
- *
- * @example
- * ```
- * var theme = inject(FLOWBITE_ACCORDION_CONTENT_THEME_TOKEN)
- * ```
+ * Provide the default Accordion configuration
+ * @param config The Accordion configuration
+ * @returns The provider
  */
-const FLOWBITE_ACCORDION_CONTENT_THEME_TOKEN = new InjectionToken('FLOWBITE_ACCORDION_CONTENT_THEME_TOKEN');
-class AccordionContentThemeService {
-    constructor() {
-        this.baseTheme = inject(FLOWBITE_ACCORDION_CONTENT_THEME_TOKEN);
-    }
-    getClasses(properties) {
-        const theme = mergeTheme(this.baseTheme, properties.customStyle);
-        const output = {
-            rootClass: twMerge(theme.root.base, theme.root.color[properties.color], theme.root.isFlush[properties.isFlush]),
-        };
-        return output;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: AccordionContentThemeService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: AccordionContentThemeService, providedIn: 'root' }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: AccordionContentThemeService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root',
-                }]
-        }] });
-
-const FLOWBITE_ACCORDION_CONTENT_CUSTOM_STYLE_DEFAULT_VALUE = new InjectionToken('FLOWBITE_ACCORDION_CONTENT_CUSTOM_STYLE_DEFAULT_VALUE');
-const accordionContentDefaultValueProvider = makeEnvironmentProviders([
+const provideFlowbiteAccordionConfig = (config) => [
     {
-        provide: FLOWBITE_ACCORDION_CONTENT_CUSTOM_STYLE_DEFAULT_VALUE,
-        useValue: {},
+        provide: FlowbiteAccordionConfigToken,
+        useValue: { ...defaultFlowbiteAccordionConfig, ...config },
     },
-]);
+];
 /**
- * @see https://flowbite.com/docs/components/accordion/
+ * Inject the Accordion configuration
+ * @see {@link defaultFlowbiteAccordionConfig}
+ * @returns The configuration
  */
-class AccordionContentComponent extends BaseComponent {
+const injectFlowbiteAccordionConfig = () => inject(FlowbiteAccordionConfigToken, { optional: true }) ?? defaultFlowbiteAccordionConfig;
+
+const FlowbiteAccordionStateToken = createStateToken('Flowbite Accordion');
+const provideFlowbiteAccordionState = createStateProvider(FlowbiteAccordionStateToken);
+const injectFlowbiteAccordionState = createStateInjector(FlowbiteAccordionStateToken);
+const flowbiteAccordionState = createState(FlowbiteAccordionStateToken);
+
+class Accordion {
     constructor() {
-        super(...arguments);
+        this.config = injectFlowbiteAccordionConfig();
         /**
-         * Service injected used to generate class
+         * @see {@link injectFlowbiteAccordionConfig}
          */
-        this.themeService = inject(AccordionContentThemeService);
+        this.color = input(this.config.color);
         /**
-         * The parent `AccordionPanelComponent`
+         * @see {@link injectFlowbiteAccordionConfig}
          */
-        this.accordionPanelComponent = inject(AccordionPanelComponent);
-        //#region properties
+        this.flush = input(this.config.flush, { transform: booleanAttribute });
         /**
-         * Set the accordion content color
-         *
-         @default `AccordionPanelComponent`'s color
+         * @see {@link injectFlowbiteAccordionConfig}
          */
-        this.color = model(this.accordionPanelComponent.color());
+        this.customTheme = input(this.config.customTheme);
+        this.theme = computed(() => {
+            const mergedTheme = mergeDeep(this.config.baseTheme, this.state.customTheme());
+            return {
+                host: {
+                    root: twMerge(mergedTheme.host.base, mergedTheme.host.transition),
+                },
+            };
+        });
         /**
-         * Set the custom style for this accordion content
+         * @internal
          */
-        this.customStyle = model(inject(FLOWBITE_ACCORDION_CONTENT_CUSTOM_STYLE_DEFAULT_VALUE));
+        this.state = flowbiteAccordionState(this);
     }
-    //#endregion
-    //#region BaseComponent implementation
-    fetchClass() {
-        return this.themeService.getClasses({
-            color: this.accordionPanelComponent.accordionComponent.color(),
-            isFlush: booleanToFlowbiteBoolean(this.accordionPanelComponent.accordionComponent.isFlush()),
-            customStyle: this.customStyle(),
-        });
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: AccordionContentComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.0.4", type: AccordionContentComponent, isStandalone: true, selector: "flowbite-accordion-content", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, customStyle: { classPropertyName: "customStyle", publicName: "customStyle", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { color: "colorChange", customStyle: "customStyleChange" }, host: { properties: { "@isOpenAnimation": "accordionPanelComponent.isOpen()" } }, usesInheritance: true, ngImport: i0, template: `<ng-content />`, isInline: true, animations: [
-            trigger('isOpenAnimation', [
-                state('true', style({ height: '*' })),
-                state('false', style({ height: '0px' })),
-                transition('true <=> false', animate('300ms')),
-            ]),
-        ], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: Accordion, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.0.6", type: Accordion, isStandalone: true, selector: "\n    div[flowbiteAccordion]\n  ", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, flush: { classPropertyName: "flush", publicName: "flush", isSignal: true, isRequired: false, transformFunction: null }, customTheme: { classPropertyName: "customTheme", publicName: "customTheme", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "theme().host.root" } }, providers: [provideFlowbiteAccordionState(), provideAccordionState()], exportAs: ["flowbiteAccordion"], hostDirectives: [{ directive: i1.NgpAccordion, inputs: ["ngpAccordionType", "type", "ngpAccordionDisabled", "disabled", "ngpAccordionCollapsible", "collapsible"] }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: AccordionContentComponent, decorators: [{
-            type: Component,
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: Accordion, decorators: [{
+            type: Directive,
             args: [{
                     standalone: true,
-                    selector: 'flowbite-accordion-content',
-                    template: `<ng-content />`,
-                    host: {
-                        '[@isOpenAnimation]': 'accordionPanelComponent.isOpen()',
-                    },
-                    animations: [
-                        trigger('isOpenAnimation', [
-                            state('true', style({ height: '*' })),
-                            state('false', style({ height: '0px' })),
-                            transition('true <=> false', animate('300ms')),
-                        ]),
+                    selector: `
+    div[flowbiteAccordion]
+  `,
+                    exportAs: 'flowbiteAccordion',
+                    hostDirectives: [
+                        {
+                            directive: NgpAccordion,
+                            inputs: [
+                                'ngpAccordionType:type',
+                                'ngpAccordionDisabled:disabled',
+                                'ngpAccordionCollapsible:collapsible',
+                            ],
+                        },
                     ],
-                    encapsulation: ViewEncapsulation.None,
-                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    providers: [provideFlowbiteAccordionState(), provideAccordionState()],
+                    host: { '[class]': `theme().host.root` },
                 }]
         }] });
 
-/**
- * `InjectionToken` used to import `AccordionPanelTheme` value
- *
- * @example
- * ```
- * var theme = inject(FLOWBITE_ACCORDION_PANEL_THEME_TOKEN)
- * ```
- */
-const FLOWBITE_ACCORDION_PANEL_THEME_TOKEN = new InjectionToken('FLOWBITE_ACCORDION_PANEL_THEME_TOKEN');
-class AccordionPanelThemeService {
-    constructor() {
-        this.baseTheme = inject(FLOWBITE_ACCORDION_PANEL_THEME_TOKEN);
-    }
-    getClasses(properties) {
-        const theme = mergeTheme(this.baseTheme, properties.customStyle);
-        const output = {
-            rootClass: twMerge(theme.root.base),
-        };
-        return output;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: AccordionPanelThemeService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: AccordionPanelThemeService, providedIn: 'root' }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: AccordionPanelThemeService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root',
-                }]
-        }] });
+const flowbiteAccordionItemTheme = createTheme({
+    host: {
+        base: 'group/item',
+        transition: '',
+    },
+});
 
+const defaultFlowbiteAccordionItemConfig = {
+    baseTheme: flowbiteAccordionItemTheme,
+    customTheme: {},
+};
+const FlowbiteAccordionItemConfigToken = new InjectionToken('FlowbiteAccordionItemConfig');
 /**
- * `InjectionToken` used to import `AccordionTitleTheme` value
- *
- * @example
- * ```
- * var theme = inject(FLOWBITE_ACCORDION_TITLE_THEME_TOKEN)
- * ```
+ * Provide the default Accordion Item configuration
+ * @param config The Accordion Item configuration
+ * @returns The provider
  */
-const FLOWBITE_ACCORDION_TITLE_THEME_TOKEN = new InjectionToken('FLOWBITE_ACCORDION_TITLE_THEME_TOKEN');
-class AccordionTitleThemeService {
-    constructor() {
-        this.baseTheme = inject(FLOWBITE_ACCORDION_TITLE_THEME_TOKEN);
-    }
-    getClasses(properties) {
-        const theme = mergeTheme(this.baseTheme, properties.customStyle);
-        const output = {
-            rootClass: twMerge(theme.root.base, theme.root.color[properties.color], theme.root.isFlush[properties.isFlush], theme.root.isOpen[properties.isOpen]),
-            textClass: twMerge(theme.text.base),
-        };
-        return output;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: AccordionTitleThemeService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: AccordionTitleThemeService, providedIn: 'root' }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: AccordionTitleThemeService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root',
-                }]
-        }] });
-
-const FLOWBITE_ACCORDION_TITLE_ICON_DEFAULT_VALUE = new InjectionToken('FLOWBITE_ACCORDION_TITLE_ICON_DEFAULT_VALUE');
-const FLOWBITE_ACCORDION_TITLE_CUSTOM_STYLE_DEFAULT_VALUE = new InjectionToken('FLOWBITE_ACCORDION_TITLE_CUSTOM_STYLE_DEFAULT_VALUE');
-const accordionTitleDefaultValueProvider = makeEnvironmentProviders([
-    {
-        provide: FLOWBITE_ACCORDION_TITLE_ICON_DEFAULT_VALUE,
-        useValue: undefined,
-    },
+const provideFlowbiteAccordionItemConfig = (config) => [
     {
-        provide: FLOWBITE_ACCORDION_TITLE_CUSTOM_STYLE_DEFAULT_VALUE,
-        useValue: {},
+        provide: FlowbiteAccordionItemConfigToken,
+        useValue: { ...defaultFlowbiteAccordionItemConfig, ...config },
     },
-]);
+];
 /**
- * @see https://flowbite.com/docs/components/accordion/
+ * Inject the Accordion Item configuration
+ * @see {@link defaultFlowbiteAccordionItemConfig}
+ * @returns The configuration
  */
-class AccordionTitleComponent extends BaseComponent {
+const injectFlowbiteAccordionItemConfig = () => inject(FlowbiteAccordionItemConfigToken, { optional: true }) ??
+    defaultFlowbiteAccordionItemConfig;
+
+const FlowbiteAccordionItemStateToken = createStateToken('Flowbite Accordion Item');
+const provideFlowbiteAccordionItemState = createStateProvider(FlowbiteAccordionItemStateToken);
+const injectFlowbiteAccordionItemState = createStateInjector(FlowbiteAccordionItemStateToken);
+const flowbiteAccordionItemState = createState(FlowbiteAccordionItemStateToken);
+
+class AccordionItem {
     constructor() {
-        super(...arguments);
-        /**
-         * Service injected used to generate class
-         */
-        this.themeService = inject(AccordionTitleThemeService);
-        /**
-         * The parent `AccordionPanelComponent`
-         */
-        this.accordionPanelComponent = inject(AccordionPanelComponent);
-        /**
-         * `IconRegistry` service
-         */
-        this.iconRegistry = inject(IconRegistry);
-        /**
-         * `DomSanitizer` service
-         */
-        this.domSanitizer = inject(DomSanitizer);
-        //#region properties
+        this.config = injectFlowbiteAccordionItemConfig();
+        this.accordionState = injectFlowbiteAccordionState();
+        this.ngpAccordionItemState = injectAccordionItemState();
         /**
-         * Set the accordion title color
-         *
-         * @default `AccordionPanelComponents`'s color
+         * @see {@link injectFlowbiteAccordionItemConfig}
          */
-        this.color = model(this.accordionPanelComponent.color());
-        /**
-         * Set the accordion title icon
-         *
-         * @default undefined
-         */
-        this.icon = model(inject(FLOWBITE_ACCORDION_TITLE_ICON_DEFAULT_VALUE));
+        this.customTheme = input(this.config.customTheme);
+        this.theme = computed(() => {
+            const mergedTheme = mergeDeep(this.config.baseTheme, this.state.customTheme());
+            return {
+                host: {
+                    root: twMerge(mergedTheme.host.base, mergedTheme.host.transition),
+                },
+            };
+        });
         /**
-         * Set the custom style for this accordion title
+         * @internal
          */
-        this.customStyle = model(inject(FLOWBITE_ACCORDION_TITLE_CUSTOM_STYLE_DEFAULT_VALUE));
-    }
-    //#endregion
-    //#region BaseComponent implementation
-    fetchClass() {
-        return this.themeService.getClasses({
-            color: this.accordionPanelComponent.accordionComponent.color(),
-            isFlush: booleanToFlowbiteBoolean(this.accordionPanelComponent.accordionComponent.isFlush()),
-            isOpen: booleanToFlowbiteBoolean(this.accordionPanelComponent.isOpen()),
-            customStyle: this.customStyle(),
-        });
+        this.state = flowbiteAccordionItemState(this);
     }
-    init() {
-        this.iconRegistry.addRawSvgIconInNamepsace('flowbite-angular', 'chevron-down', this.domSanitizer.bypassSecurityTrustHtml(CHEVRON_DOWN_SVG_ICON));
-    }
-    //#endregion
-    /**
-     * Toggle the parent `AccordionPanelComponent`'s isOpen
-     */
-    onClick() {
-        this.accordionPanelComponent.toggleVisibility();
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: AccordionTitleComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.4", type: AccordionTitleComponent, isStandalone: true, selector: "flowbite-accordion-title", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, customStyle: { classPropertyName: "customStyle", publicName: "customStyle", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { color: "colorChange", icon: "iconChange", customStyle: "customStyleChange" }, host: { listeners: { "click": "onClick()" } }, usesInheritance: true, ngImport: i0, template: `
-    <h2 [class]="contentClasses().textClass">
-      <ng-content />
-    </h2>
-    @if (icon()) {
-      <ng-container [ngTemplateOutlet]="icon()!" />
-    } @else {
-      <flowbite-icon
-        svgIcon="flowbite-angular:chevron-down"
-        class="h-6 w-6 shrink-0 duration-300"
-        [class.rotate-180]="accordionPanelComponent.isOpen()" />
-    }
-  `, isInline: true, dependencies: [{ kind: "component", type: IconComponent, selector: "flowbite-icon", inputs: ["svgIcon"], outputs: ["svgIconChange"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: AccordionItem, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.0.6", type: AccordionItem, isStandalone: true, selector: "\n    div[flowbiteAccordionItem]\n  ", inputs: { customTheme: { classPropertyName: "customTheme", publicName: "customTheme", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "theme().host.root" } }, providers: [provideFlowbiteAccordionItemState(), provideAccordionItemState()], exportAs: ["flowbiteAccordionItem"], hostDirectives: [{ directive: i1.NgpAccordionItem, inputs: ["ngpAccordionItemValue", "value", "ngpAccordionItemDisabled", "disabled"] }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: AccordionTitleComponent, decorators: [{
-            type: Component,
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: AccordionItem, decorators: [{
+            type: Directive,
             args: [{
-                    imports: [IconComponent, NgTemplateOutlet],
-                    selector: 'flowbite-accordion-title',
-                    template: `
-    <h2 [class]="contentClasses().textClass">
-      <ng-content />
-    </h2>
-    @if (icon()) {
-      <ng-container [ngTemplateOutlet]="icon()!" />
-    } @else {
-      <flowbite-icon
-        svgIcon="flowbite-angular:chevron-down"
-        class="h-6 w-6 shrink-0 duration-300"
-        [class.rotate-180]="accordionPanelComponent.isOpen()" />
-    }
+                    standalone: true,
+                    selector: `
+    div[flowbiteAccordionItem]
   `,
-                    host: {
-                        '(click)': 'onClick()',
-                    },
-                    encapsulation: ViewEncapsulation.None,
-                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    exportAs: 'flowbiteAccordionItem',
+                    hostDirectives: [
+                        {
+                            directive: NgpAccordionItem,
+                            inputs: ['ngpAccordionItemValue:value', 'ngpAccordionItemDisabled:disabled'],
+                        },
+                    ],
+                    providers: [provideFlowbiteAccordionItemState(), provideAccordionItemState()],
+                    host: { '[class]': `theme().host.root` },
                 }]
         }] });
 
-const FLOWBITE_ACCORDION_PANEL_IS_OPEN_DEFAULT_VALUE = new InjectionToken('FLOWBITE_ACCORDION_IS_OPEN_DEFAULT_VALUE');
-const FLOWBITE_ACCORDION_PANEL_CUSTOM_STYLE_DEFAULT_VALUE = new InjectionToken('FLOWBITE_ACCORDION_PANEL_CUSTOM_STYLE_DEFAULT_VALUE');
-const accordionPanelDefaultValueProvider = makeEnvironmentProviders([
-    {
-        provide: FLOWBITE_ACCORDION_PANEL_IS_OPEN_DEFAULT_VALUE,
-        useValue: false,
+const flowbiteAccordionTitleTheme = createTheme({
+    host: {
+        base: 'flex w-full cursor-pointer flex-row items-center justify-between p-5 text-base font-medium group-first/item:rounded-t-lg',
+        transition: '',
+        color: {
+            default: {
+                light: 'border-gray-200 bg-gray-100 text-gray-900 data-hover:bg-gray-200',
+                dark: 'dark:border-gray-700 dark:bg-gray-800 dark:text-white dark:data-hover:bg-gray-700',
+            },
+            info: {
+                light: 'border-blue-200 bg-blue-100 text-blue-900 data-hover:bg-blue-200',
+                dark: 'dark:border-blue-700 dark:bg-blue-800 dark:text-white dark:data-hover:bg-blue-700',
+            },
+            failure: {
+                light: 'border-red-200 bg-red-100 text-red-900 data-hover:bg-red-200',
+                dark: 'dark:border-red-700 dark:bg-red-800 dark:text-white dark:data-hover:bg-red-700',
+            },
+            success: {
+                light: 'border-green-200 bg-green-100 text-green-900 data-hover:bg-green-200',
+                dark: 'dark:border-green-700 dark:bg-green-800 dark:text-white dark:data-hover:bg-green-700',
+            },
+            warning: {
+                light: 'border-yellow-200 bg-yellow-100 text-yellow-900 data-hover:bg-yellow-200',
+                dark: 'dark:border-yellow-700 dark:bg-yellow-800 dark:text-white dark:data-hover:bg-yellow-700',
+            },
+            primary: {
+                light: 'border-primary-200 bg-primary-100 text-primary-900 data-hover:bg-primary-200',
+                dark: 'dark:border-primary-700 dark:bg-primary-800 dark:data-hover:bg-primary-700 dark:text-white',
+            },
+        },
+        flush: {
+            on: 'border-b bg-transparent data-hover:bg-transparent dark:bg-transparent dark:data-hover:bg-transparent',
+            off: 'border',
+        },
     },
+});
+
+const defaultFlowbiteAccordionTitleConfig = {
+    baseTheme: flowbiteAccordionTitleTheme,
+    customTheme: {},
+};
+const FlowbiteAccordionTitleConfigToken = new InjectionToken('FlowbiteAccordionTitleConfigToken');
+/**
+ * Provide the default AccordionTitle configuration
+ * @param config The AccordionTitle configuration
+ * @returns The provider
+ */
+const provideFlowbiteAccordionTitleConfig = (config) => [
     {
-        provide: FLOWBITE_ACCORDION_PANEL_CUSTOM_STYLE_DEFAULT_VALUE,
-        useValue: {},
+        provide: FlowbiteAccordionTitleConfigToken,
+        useValue: { ...defaultFlowbiteAccordionTitleConfig, ...config },
     },
-]);
+];
 /**
- * @see https://flowbite.com/docs/components/accordion/
+ * Inject the AccordionTitle configuration
+ * @see {@link defaultFlowbiteAccordionTitleConfig}
+ * @returns The configuration
  */
-class AccordionPanelComponent extends BaseComponent {
+const injectFlowbiteAccordionTitleConfig = () => inject(FlowbiteAccordionTitleConfigToken, { optional: true }) ??
+    defaultFlowbiteAccordionTitleConfig;
+
+const FlowbiteAccordionTitleStateToken = createStateToken('Flowbite AccordionTitle');
+const provideFlowbiteAccordionTitleState = createStateProvider(FlowbiteAccordionTitleStateToken);
+const injectFlowbiteAccordionTitleState = createStateInjector(FlowbiteAccordionTitleStateToken);
+const flowbiteAccordionTitleState = createState(FlowbiteAccordionTitleStateToken);
+
+class AccordionTitle {
     constructor() {
-        super(...arguments);
-        /**
-         * Service injected used to generate class
-         */
-        this.themeService = inject(AccordionPanelThemeService);
-        /**
-         * The parent `AccordionComponent`
-         */
-        this.accordionComponent = inject(AccordionComponent);
-        /**
-         * The child `AccordionTitleComponent`
-         */
-        this.accordionTitleChild = contentChild.required(AccordionTitleComponent);
+        this.config = injectFlowbiteAccordionTitleConfig();
+        this.accordionState = injectFlowbiteAccordionState();
         /**
-         * The child `AccordionContentComponent`
+         * @see {@link injectFlowbiteAccordionTitleConfig}
          */
-        this.accordionContentChild = contentChild.required(AccordionContentComponent);
-        //#region properties
-        /**
-         * Set the accordion panel color
-         *
-         * @default `AccordionComponent`'s color
-         */
-        this.color = model(this.accordionComponent.color());
-        /**
-         * Set if the accordion panel is open or not
-         *
-         * @default false
-         */
-        this.isOpen = model(inject(FLOWBITE_ACCORDION_PANEL_IS_OPEN_DEFAULT_VALUE));
+        this.customTheme = input(this.config.customTheme);
+        this.theme = computed(() => {
+            const mergedTheme = mergeDeep(this.config.baseTheme, this.state.customTheme());
+            return {
+                host: {
+                    root: twMerge(mergedTheme.host.base, mergedTheme.host.transition, colorToTheme(mergedTheme.host.color, this.accordionState().color()), mergedTheme.host.flush[this.accordionState().flush() ? 'on' : 'off']),
+                },
+            };
+        });
         /**
-         * Set the custom style for this accordion panel
+         * @internal
          */
-        this.customStyle = model(inject(FLOWBITE_ACCORDION_PANEL_CUSTOM_STYLE_DEFAULT_VALUE));
+        this.state = flowbiteAccordionTitleState(this);
     }
-    //#endregion
-    //#region BaseComponent implementation
-    fetchClass() {
-        return this.themeService.getClasses({
-            customStyle: this.customStyle(),
-        });
-    }
-    //#endregion
-    /**
-     * Toggle isOpen for itself and close every other `AccordionPanelComponent` if the parent `AccordionComponent`'s isAlwaysOpen is false
-     *
-     * @param isOpen Instead of toggle, it can set the value provided
-     */
-    toggleVisibility(isOpen) {
-        if (isOpen === undefined) {
-            isOpen = untracked(() => !this.isOpen());
-        }
-        if (isOpen && untracked(() => !this.accordionComponent.isAlwaysOpen())) {
-            this.accordionComponent.closeAll();
-        }
-        this.isOpen.set(isOpen);
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: AccordionPanelComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "19.0.4", type: AccordionPanelComponent, isStandalone: true, selector: "flowbite-accordion-panel", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, isOpen: { classPropertyName: "isOpen", publicName: "isOpen", isSignal: true, isRequired: false, transformFunction: null }, customStyle: { classPropertyName: "customStyle", publicName: "customStyle", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { color: "colorChange", isOpen: "isOpenChange", customStyle: "customStyleChange" }, queries: [{ propertyName: "accordionTitleChild", first: true, predicate: AccordionTitleComponent, descendants: true, isSignal: true }, { propertyName: "accordionContentChild", first: true, predicate: AccordionContentComponent, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: `<ng-content />`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: AccordionTitle, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.0.6", type: AccordionTitle, isStandalone: true, selector: "\n    [flowbiteAccordionTitle]\n  ", inputs: { customTheme: { classPropertyName: "customTheme", publicName: "customTheme", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "theme().host.root" } }, providers: [provideFlowbiteAccordionTitleState()], exportAs: ["flowbiteAccordionTitle"], hostDirectives: [{ directive: i1$1.NgpButton, inputs: ["disabled", "disabled"] }, { directive: i2.NgpFocus }, { directive: i1.NgpAccordionTrigger, inputs: ["id", "id"] }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: AccordionPanelComponent, decorators: [{
-            type: Component,
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: AccordionTitle, decorators: [{
+            type: Directive,
             args: [{
                     standalone: true,
-                    selector: 'flowbite-accordion-panel',
-                    template: `<ng-content />`,
-                    encapsulation: ViewEncapsulation.None,
-                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    selector: `
+    [flowbiteAccordionTitle]
+  `,
+                    exportAs: 'flowbiteAccordionTitle',
+                    hostDirectives: [
+                        {
+                            directive: NgpButton,
+                            inputs: ['disabled:disabled'],
+                            outputs: [],
+                        },
+                        {
+                            directive: NgpFocus,
+                            inputs: [],
+                            outputs: [],
+                        },
+                        {
+                            directive: NgpAccordionTrigger,
+                            inputs: ['id'],
+                            outputs: [],
+                        },
+                    ],
+                    providers: [provideFlowbiteAccordionTitleState()],
+                    host: { '[class]': `theme().host.root` },
                 }]
         }] });
 
+const flowbiteAccordionContentTheme = createTheme({
+    host: {
+        base: 'overflow-hidden',
+        transition: '',
+        color: {
+            default: {
+                light: 'border-gray-200 bg-white',
+                dark: 'dark:border-gray-700 dark:bg-gray-900',
+            },
+            info: {
+                light: 'border-blue-200 bg-white',
+                dark: 'dark:border-blue-700 dark:bg-gray-900',
+            },
+            failure: {
+                light: 'border-red-200 bg-white',
+                dark: 'dark:border-red-700 dark:bg-gray-900',
+            },
+            success: {
+                light: 'border-green-200 bg-white',
+                dark: 'dark:border-green-700 dark:bg-gray-900',
+            },
+            warning: {
+                light: 'border-yellow-200 bg-white',
+                dark: 'dark:border-yellow-700 dark:bg-gray-900',
+            },
+            primary: {
+                light: 'border-primary-200 bg-white',
+                dark: 'dark:border-primary-700 dark:bg-gray-900',
+            },
+        },
+        open: {
+            on: 'h-fit',
+            off: 'h-0',
+        },
+        flush: {
+            on: 'bg-transparent dark:bg-transparent',
+            off: 'border-x group-last/item:border-b',
+        },
+    },
+});
+
+const defaultFlowbiteAccordionContentConfig = {
+    baseTheme: flowbiteAccordionContentTheme,
+    customTheme: {},
+};
+const FlowbiteAccordionContentConfigToken = new InjectionToken('FlowbiteAccordionContentConfigToken');
 /**
- * `InjectionToken` used to import `AccordionTheme` value
- *
- * @example
- * ```
- * var theme = inject(FLOWBITE_ACCORDION_THEME_TOKEN)
- * ```
+ * Provide the default AccordionContent configuration
+ * @param config The AccordionContent configuration
+ * @returns The provider
  */
-const FLOWBITE_ACCORDION_THEME_TOKEN = new InjectionToken('FLOWBITE_ACCORDION_THEME_TOKEN');
-class AccordionThemeService {
-    constructor() {
-        this.baseTheme = inject(FLOWBITE_ACCORDION_THEME_TOKEN);
-    }
-    getClasses(properties) {
-        const theme = mergeTheme(this.baseTheme, properties.customStyle);
-        const output = {
-            rootClass: twMerge(theme.root.base),
-        };
-        return output;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: AccordionThemeService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: AccordionThemeService, providedIn: 'root' }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: AccordionThemeService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root',
-                }]
-        }] });
-
-const FLOWBITE_ACCORDION_IS_ALWAYS_OPEN_DEFAULT_VALUE = new InjectionToken('FLOWBITE_ACCORDION_IS_ALWAYS_OPEN');
-const FLOWBITE_ACCORDION_COLOR_DEFAULT_VALUE = new InjectionToken('FLOWBITE_ACCORDION_COLOR_DEFAULT_VALUE');
-const FLOWBITE_ACCORDION_IS_FLUSH_DEFAULT_VALUE = new InjectionToken('FLOWBITE_ACCORDION_IS_FLUSH_DEFAULT_VALUE');
-const FLOWBITE_ACCORDION_CUSTOM_STYLE_DEFAULT_VALUE = new InjectionToken('FLOWBITE_ACCORDION_CUSTOM_STYLE_DEFAULT_VALUE');
-const accordionDefaultValueProvider = makeEnvironmentProviders([
-    {
-        provide: FLOWBITE_ACCORDION_IS_ALWAYS_OPEN_DEFAULT_VALUE,
-        useValue: false,
-    },
-    {
-        provide: FLOWBITE_ACCORDION_COLOR_DEFAULT_VALUE,
-        useValue: 'primary',
-    },
-    {
-        provide: FLOWBITE_ACCORDION_IS_FLUSH_DEFAULT_VALUE,
-        useValue: false,
-    },
+const provideFlowbiteAccordionContentConfig = (config) => [
     {
-        provide: FLOWBITE_ACCORDION_CUSTOM_STYLE_DEFAULT_VALUE,
-        useValue: {},
+        provide: FlowbiteAccordionContentConfigToken,
+        useValue: { ...defaultFlowbiteAccordionContentConfig, ...config },
     },
-]);
+];
 /**
- * @see https://flowbite.com/docs/components/accordion/
+ * Inject the AccordionContent configuration
+ * @see {@link defaultFlowbiteAccordionContentConfig}
+ * @returns The configuration
  */
-class AccordionComponent extends BaseComponent {
+const injectFlowbiteAccordionContentConfig = () => inject(FlowbiteAccordionContentConfigToken, { optional: true }) ??
+    defaultFlowbiteAccordionContentConfig;
+
+const FlowbiteAccordionContentStateToken = createStateToken('Flowbite AccordionContent');
+const provideFlowbiteAccordionContentState = createStateProvider(FlowbiteAccordionContentStateToken);
+const injectFlowbiteAccordionContentState = createStateInjector(FlowbiteAccordionContentStateToken);
+const flowbiteAccordionContentState = createState(FlowbiteAccordionContentStateToken);
+
+class AccordionContent {
     constructor() {
-        super(...arguments);
-        /**
-         * Service injected used to generated class
-         */
-        this.themeService = inject(AccordionThemeService);
-        /**
-         * List of `AccordionPanelComponent`
-         */
-        this.accordionPanelChildren = contentChildren(AccordionPanelComponent);
-        //#region properties
+        this.config = injectFlowbiteAccordionContentConfig();
+        this.accordionState = injectFlowbiteAccordionState();
+        this.ngpAccordionItemState = injectAccordionItemState();
         /**
-         * Does the opened `AccordionPanelComponent` stay open if another one is opening
-         *
-         * @default false
+         * @see {@link injectFlowbiteAccordionContentConfig}
          */
-        this.isAlwaysOpen = model(inject(FLOWBITE_ACCORDION_IS_ALWAYS_OPEN_DEFAULT_VALUE));
-        /**
-         * Set the accordion color and every child default color
-         *
-         * @default primary
-         */
-        this.color = model(inject(FLOWBITE_ACCORDION_COLOR_DEFAULT_VALUE));
-        /**
-         * Set the accordion as flush or not
-         *
-         * @default false
-         */
-        this.isFlush = model(inject(FLOWBITE_ACCORDION_IS_FLUSH_DEFAULT_VALUE));
+        this.customTheme = input(this.config.customTheme);
+        this.theme = computed(() => {
+            const mergedTheme = mergeDeep(this.config.baseTheme, this.state.customTheme());
+            return {
+                host: {
+                    root: twMerge(mergedTheme.host.base, mergedTheme.host.transition, colorToTheme(mergedTheme.host.color, this.accordionState().color()), mergedTheme.host.flush[this.accordionState().flush() ? 'on' : 'off'], mergedTheme.host.open[this.ngpAccordionItemState().open() ? 'on' : 'off']),
+                },
+            };
+        });
         /**
-         * Set the custom style for this accordion
+         * @internal
          */
-        this.customStyle = model(inject(FLOWBITE_ACCORDION_CUSTOM_STYLE_DEFAULT_VALUE));
+        this.state = flowbiteAccordionContentState(this);
     }
-    //#endregion
-    //#region BaseComponent implementation
-    fetchClass() {
-        return this.themeService.getClasses({
-            customStyle: this.customStyle(),
-        });
-    }
-    //#endregion
-    /**
-     * Close every `AccordionPanelComponent`
-     */
-    closeAll() {
-        this.accordionPanelChildren().forEach((child) => child.toggleVisibility(false));
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: AccordionComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "19.0.4", type: AccordionComponent, isStandalone: true, selector: "flowbite-accordion", inputs: { isAlwaysOpen: { classPropertyName: "isAlwaysOpen", publicName: "isAlwaysOpen", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, isFlush: { classPropertyName: "isFlush", publicName: "isFlush", isSignal: true, isRequired: false, transformFunction: null }, customStyle: { classPropertyName: "customStyle", publicName: "customStyle", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isAlwaysOpen: "isAlwaysOpenChange", color: "colorChange", isFlush: "isFlushChange", customStyle: "customStyleChange" }, queries: [{ propertyName: "accordionPanelChildren", predicate: AccordionPanelComponent, isSignal: true }], usesInheritance: true, ngImport: i0, template: `<ng-content />`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: AccordionContent, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.0.6", type: AccordionContent, isStandalone: true, selector: "\n    div[flowbiteAccordionContent]\n  ", inputs: { customTheme: { classPropertyName: "customTheme", publicName: "customTheme", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "theme().host.root" } }, providers: [provideFlowbiteAccordionContentState()], exportAs: ["flowbiteAccordionContent"], hostDirectives: [{ directive: i1.NgpAccordionContent, inputs: ["id", "id"] }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: AccordionComponent, decorators: [{
-            type: Component,
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: AccordionContent, decorators: [{
+            type: Directive,
             args: [{
                     standalone: true,
-                    selector: 'flowbite-accordion',
-                    template: `<ng-content />`,
-                    encapsulation: ViewEncapsulation.None,
-                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    selector: `
+    div[flowbiteAccordionContent]
+  `,
+                    exportAs: 'flowbiteAccordionContent',
+                    hostDirectives: [
+                        {
+                            directive: NgpAccordionContent,
+                            inputs: ['id'],
+                            outputs: [],
+                        },
+                    ],
+                    providers: [provideFlowbiteAccordionContentState()],
+                    host: { '[class]': `theme().host.root` },
                 }]
         }] });
 
-/**
- * Default theme for `AccordionComponent`
- */
-const accordionTheme = createTheme({
-    root: {
-        base: '',
-    },
-});
-
-/**
- * Default theme for `AccordionContentComponent`
- */
-const accordionContentTheme = createTheme({
-    root: {
-        base: 'flex flex-col overflow-hidden',
-        color: {
-            primary: 'border-primary-200 dark:border-primary-700',
-            light: 'border-gray-200 dark:border-gray-700',
-            blue: 'border-blue-200 dark:border-blue-700',
-            red: 'border-red-200 dark:border-red-700',
-            green: 'border-green-200 dark:border-green-700',
-            yellow: 'border-yellow-200 dark:border-yellow-700',
-        },
-        isFlush: {
-            enabled: '',
-            disabled: 'border-x border-t group-last:border-b',
-        },
-    },
-});
-
-/**
- * Default theme for `AccordionPanelComponent`
- */
-const accordionPanelTheme = createTheme({
-    root: {
-        base: 'group',
-    },
-});
-
-/**
- * Default theme for `AccordionTitleComponent`
- */
-const accordionTitleTheme = createTheme({
-    root: {
-        base: 'cursor-pointer flex items-center p-5 justify-between group-first:rounded-t-lg',
-        color: {
-            primary: 'text-primary-900 dark:text-primary-50 border-primary-200 dark:border-primary-700 bg-primary-100 hover:bg-primary-100 dark:bg-primary-800 dark:hover:bg-primary-800',
-            light: 'text-gray-900 dark:text-gray-50 border-gray-200 dark:border-gray-700 bg-gray-100 hover:bg-gray-100 dark:bg-gray-800 dark:hover:bg-gray-800',
-            blue: 'text-blue-900 dark:text-blue-50 border-blue-200 dark:border-blue-700 bg-blue-100 hover:bg-blue-100 dark:bg-blue-800 dark:hover:bg-blue-800',
-            red: 'text-red-900 dark:text-red-50 border-red-200 dark:border-red-700 bg-red-100 hover:bg-red-100 dark:bg-red-800 dark:hover:bg-red-800',
-            green: 'text-green-900 dark:text-green-50 border-green-200 dark:border-green-700 bg-green-100 hover:bg-green-100 dark:bg-green-800 dark:hover:bg-green-800',
-            yellow: 'text-yellow-900 dark:text-yellow-50 border-yellow-200 dark:border-yellow-700 bg-yellow-100 hover:bg-yellow-100 dark:bg-yellow-800 dark:hover:bg-yellow-800',
-        },
-        isFlush: {
-            enabled: 'border-b bg-transparent hover:bg-transparent',
-            disabled: 'border border-b-0',
-        },
-        isOpen: {
-            enabled: '',
-            disabled: 'bg-transparent dark:bg-transparent',
-        },
-    },
-    text: {
-        base: 'font-semibold text-base',
-    },
-});
+/* Accordion */
 
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { AccordionComponent, AccordionContentComponent, AccordionContentThemeService, AccordionPanelComponent, AccordionPanelThemeService, AccordionThemeService, AccordionTitleComponent, AccordionTitleThemeService, FLOWBITE_ACCORDION_COLOR_DEFAULT_VALUE, FLOWBITE_ACCORDION_CONTENT_CUSTOM_STYLE_DEFAULT_VALUE, FLOWBITE_ACCORDION_CONTENT_THEME_TOKEN, FLOWBITE_ACCORDION_CUSTOM_STYLE_DEFAULT_VALUE, FLOWBITE_ACCORDION_IS_ALWAYS_OPEN_DEFAULT_VALUE, FLOWBITE_ACCORDION_IS_FLUSH_DEFAULT_VALUE, FLOWBITE_ACCORDION_PANEL_CUSTOM_STYLE_DEFAULT_VALUE, FLOWBITE_ACCORDION_PANEL_IS_OPEN_DEFAULT_VALUE, FLOWBITE_ACCORDION_PANEL_THEME_TOKEN, FLOWBITE_ACCORDION_THEME_TOKEN, FLOWBITE_ACCORDION_TITLE_CUSTOM_STYLE_DEFAULT_VALUE, FLOWBITE_ACCORDION_TITLE_THEME_TOKEN, accordionContentDefaultValueProvider, accordionContentTheme, accordionDefaultValueProvider, accordionPanelDefaultValueProvider, accordionPanelTheme, accordionTheme, accordionTitleDefaultValueProvider, accordionTitleTheme };
+export { Accordion, AccordionContent, AccordionItem, AccordionTitle, FlowbiteAccordionConfigToken, FlowbiteAccordionContentConfigToken, FlowbiteAccordionContentStateToken, FlowbiteAccordionItemConfigToken, FlowbiteAccordionItemStateToken, FlowbiteAccordionStateToken, FlowbiteAccordionTitleConfigToken, FlowbiteAccordionTitleStateToken, defaultFlowbiteAccordionConfig, defaultFlowbiteAccordionContentConfig, defaultFlowbiteAccordionItemConfig, defaultFlowbiteAccordionTitleConfig, flowbiteAccordionContentState, flowbiteAccordionContentTheme, flowbiteAccordionItemState, flowbiteAccordionItemTheme, flowbiteAccordionState, flowbiteAccordionTheme, flowbiteAccordionTitleState, flowbiteAccordionTitleTheme, injectFlowbiteAccordionConfig, injectFlowbiteAccordionContentConfig, injectFlowbiteAccordionContentState, injectFlowbiteAccordionItemConfig, injectFlowbiteAccordionItemState, injectFlowbiteAccordionState, injectFlowbiteAccordionTitleConfig, injectFlowbiteAccordionTitleState, provideFlowbiteAccordionConfig, provideFlowbiteAccordionContentConfig, provideFlowbiteAccordionContentState, provideFlowbiteAccordionItemConfig, provideFlowbiteAccordionItemState, provideFlowbiteAccordionState, provideFlowbiteAccordionTitleConfig, provideFlowbiteAccordionTitleState };
 //# sourceMappingURL=flowbite-angular-accordion.mjs.map