bromcom-ui-next 0.1.0

package/dist/types/components.d.ts

@@ -0,0 +1,1116 @@
+/* eslint-disable */
+/* tslint:disable */
+/**
+ * This is an autogenerated file created by the Stencil compiler.
+ * It contains typing information for all components that exist in this project.
+ */
+import { HTMLStencilElement, JSXBase } from "./stencil-public-runtime";
+import { AccordionChangeEventType } from "./components/accordion/types";
+import { AccordionGroupChangeEventType } from "./components/accordion-group/types";
+import { AlertKind, AlertSize, AlertStatus } from "./components/alert/types";
+import { AvatarShape, AvatarSize, AvatarStatus } from "./components/avatar/types";
+import { ButtonKind, ButtonSize, ButtonStatus, ButtonType, ButtonVariant, IconPosition } from "./components/button/types";
+import { ChipKind, ChipSize, ChipStatus } from "./components/chip/types";
+import { TextSize, TextVariant } from "./components/text/text.types";
+export { AccordionChangeEventType } from "./components/accordion/types";
+export { AccordionGroupChangeEventType } from "./components/accordion-group/types";
+export { AlertKind, AlertSize, AlertStatus } from "./components/alert/types";
+export { AvatarShape, AvatarSize, AvatarStatus } from "./components/avatar/types";
+export { ButtonKind, ButtonSize, ButtonStatus, ButtonType, ButtonVariant, IconPosition } from "./components/button/types";
+export { ChipKind, ChipSize, ChipStatus } from "./components/chip/types";
+export { TextSize, TextVariant } from "./components/text/text.types";
+export namespace Components {
+    /**
+     * @component BcmAccordion
+     * @description A collapsible accordion component that provides expandable/collapsible content sections with keyboard navigation
+     * and accessibility features. Offers customizable header, content, and footer areas through slots.
+     * @example Basic usage
+     * <bcm-accordion>
+     * <div slot="title">Accordion Title</div>
+     * <div>Content goes here</div>
+     * </bcm-accordion>
+     * @example With all slots and hint text
+     * <bcm-accordion hint-text="Additional information">
+     * <div slot="title">Title</div>
+     * <div slot="actions">
+     * <button>Action</button>
+     * </div>
+     * <div>Main content</div>
+     * <div slot="footer">Footer content</div>
+     * </bcm-accordion>
+     * @example Event handling
+     * // Listen to accordion state changes
+     * const accordion = document.querySelector('bcm-accordion');
+     * accordion.addEventListener('bcmAccordionChange', (event) => {
+     * const { expanded, source } = event.detail;
+     * console.log('Accordion expanded:', expanded);
+     * console.log('Changed accordion:', source);
+     * });
+     * // Programmatically control accordion
+     * await accordion.toggle(); // Toggle state
+     * await accordion.expand(); // Expand accordion
+     * await accordion.collapse(); // Collapse accordion
+     * @prop {boolean} expanded - Controls the expanded state of the accordion (default: false)
+     * @prop {boolean} group - Indicates if the accordion is part of an accordion group (default: false)
+     * @prop {string} hintText - Optional hint text to display in the footer when no footer content is provided
+     * @event {EventEmitter<AccordionChangeEventType>} bcmAccordionChange - Emitted when the accordion's expanded state changes
+     * @eventProperty {boolean} expanded - Current expanded state
+     * @eventProperty {HTMLBcmAccordionElement} source - Reference to the accordion element that changed
+     * @csspart container - The root container element
+     * @csspart header - The header section with title and actions
+     * @csspart content - The collapsible content section
+     * @csspart footer - The footer section with hint text or footer slot
+     * @csspart section - Container for header content sections
+     * @csspart icon - The expand/collapse chevron icon
+     * @css {string} --bcm-accordion-radius - Border radius of the accordion header (default: 4px)
+     * @css {string} --bcm-accordion-bg - Background color of the accordion header
+     * @css {string} --bcm-accordion-text - Text color of the accordion
+     * @css {string} --bcm-accordion-footer-bg - Background color of the footer section
+     * @methods toggle() - Toggles the accordion's expanded state
+     * expand() - Expands the accordion if collapsed
+     * collapse() - Collapses the accordion if expanded
+     */
+    interface BcmAccordion {
+        /**
+          * Collapses the accordion if it's currently expanded.
+          * @method 
+          * @returns Promise<void>
+         */
+        "collapse": () => Promise<void>;
+        /**
+          * Expands the accordion if it's not already expanded.
+          * @method 
+          * @returns Promise<void>
+         */
+        "expand": () => Promise<void>;
+        /**
+          * Controls whether the accordion is expanded or collapsed.
+          * @prop 
+          * @defaultValue false
+         */
+        "expanded": boolean;
+        /**
+          * Indicates if the accordion is part of a group. Used for group behavior coordination.
+          * @prop 
+          * @defaultValue false
+         */
+        "group": boolean;
+        /**
+          * Optional title text to display in the header.
+          * @prop 
+          * @defaultValue undefined
+         */
+        "headerTitle"?: string;
+        /**
+          * Optional text to display in the footer when no footer slot content is provided.
+          * @prop
+         */
+        "hintText"?: string;
+        /**
+          * Toggles the accordion's expanded state.
+          * @method 
+          * @returns Promise<void>
+         */
+        "toggle": () => Promise<void>;
+    }
+    /**
+     * @component BcmAccordionGroup
+     * @description A container component that manages a group of accordions. Provides single/multiple expansion 
+     * modes and methods for controlling all accordions simultaneously. Uses shadow DOM for style encapsulation.
+     * @example Basic usage - Single expansion mode
+     * <bcm-accordion-group>
+     * <bcm-accordion>
+     * <div slot="title">Section 1</div>
+     * <div>Content 1</div>
+     * </bcm-accordion>
+     * <bcm-accordion>
+     * <div slot="title">Section 2</div>
+     * <div>Content 2</div>
+     * </bcm-accordion>
+     * </bcm-accordion-group>
+     * @example Multiple expansion mode
+     * <bcm-accordion-group multi={true}>
+     * <bcm-accordion>...</bcm-accordion>
+     * <bcm-accordion>...</bcm-accordion>
+     * </bcm-accordion-group>
+     * @example Event handling
+     * // Listen to accordion group changes
+     * const accordionGroup = document.querySelector('bcm-accordion-group');
+     * accordionGroup.addEventListener('bcmAccordionGroupChange', (event) => {
+     * const { expanded, changed, expandedItems, expandedCount } = event.detail;
+     * console.log('Accordion expanded state:', expanded);
+     * console.log('Changed accordion:', changed);
+     * console.log('Currently expanded accordions:', expandedItems);
+     * console.log('Number of expanded accordions:', expandedCount);
+     * });
+     * // Using methods
+     * await accordionGroup.expandAll();   // Expands all accordions (only in multi mode)
+     * await accordionGroup.collapseAll(); // Collapses all accordions
+     * const expanded = await accordionGroup.getExpandedItems(); // Gets expanded accordions
+     * @prop {boolean} multi - Controls whether multiple accordions can be expanded simultaneously (default: false)
+     * @event {EventEmitter<AccordionGroupChangeEventType>} bcmAccordionGroupChange - Emitted when any accordion's state changes
+     * @eventProperty {boolean} expanded - Current expanded state of the changed accordion
+     * @eventProperty {HTMLElement} changed - The accordion element that triggered the change
+     * @eventProperty {HTMLElement[]} expandedItems - Array of currently expanded accordion elements
+     * @eventProperty {number} expandedCount - Number of currently expanded accordions
+     * @method expandAll() - Expands all accordions (only available in multi mode)
+     * @method collapseAll() - Collapses all accordions
+     * @method getExpandedItems() - Returns array of currently expanded accordions
+     * @csspart container - The accordion group container element
+     * @css {string} --bcm-accordion-border - Border color of the accordion group
+     * @css {string} --bcm-accordion-radius - Border radius of the accordion group
+     */
+    interface BcmAccordionGroup {
+        /**
+          * Collapses all accordions in the group
+         */
+        "collapseAll": () => Promise<void>;
+        /**
+          * Expands all accordions in the group Only available when multi=true
+         */
+        "expandAll": () => Promise<void>;
+        /**
+          * Returns an array of currently expanded accordion elements
+         */
+        "getExpandedItems": () => Promise<HTMLBcmAccordionElement[]>;
+        /**
+          * Controls whether multiple accordions can be expanded simultaneously
+         */
+        "multi": boolean;
+    }
+    /**
+     * Alert component that displays messages with different statuses and styles
+     * @class BcmAlert
+     */
+    interface BcmAlert {
+        /**
+          * Whether alert can be dismissed
+         */
+        "dismissible"?: boolean;
+        /**
+          * Alert style variant
+         */
+        "kind"?: AlertKind;
+        /**
+          * Whether to show status icon
+         */
+        "showStatusIcon"?: boolean;
+        /**
+          * Alert size variant
+         */
+        "size"?: AlertSize;
+        /**
+          * Alert status type
+         */
+        "status"?: AlertStatus;
+    }
+    interface BcmAvatar {
+        /**
+          * Alternative text for image
+         */
+        "alt": string;
+        /**
+          * Status indicator animation
+         */
+        "blink": boolean;
+        /**
+          * Custom background color
+         */
+        "color": string;
+        /**
+          * Fallback icon class
+         */
+        "icon": string;
+        /**
+          * Source URL for avatar image
+         */
+        "image": string;
+        /**
+          * Display name (used for initials)
+         */
+        "name": string;
+        /**
+          * Shape of the avatar (ellipse/square)
+         */
+        "shape": AvatarShape;
+        /**
+          * Size of the avatar
+         */
+        "size": AvatarSize;
+        /**
+          * Status indicator type
+         */
+        "status": AvatarStatus;
+    }
+    interface BcmButton {
+        /**
+          * Active state
+         */
+        "active": boolean;
+        /**
+          * ID of controlled element
+         */
+        "controls": string;
+        /**
+          * Disabled state
+         */
+        "disabled": boolean;
+        /**
+          * Expanded state for expandable content
+         */
+        "expanded"?: string;
+        /**
+          * Form association
+         */
+        "form": string;
+        /**
+          * Full width button
+         */
+        "fullWidth": boolean;
+        /**
+          * Icon class name
+         */
+        "icon"?: string;
+        /**
+          * Icon-only button mode
+         */
+        "iconOnly": boolean;
+        /**
+          * Icon placement (prefix/suffix)
+         */
+        "iconPosition": IconPosition;
+        /**
+          * Defines the main visual style of the button
+         */
+        "kind": ButtonKind;
+        /**
+          * Screen reader label
+         */
+        "label": string;
+        /**
+          * Loading state
+         */
+        "loading": boolean;
+        "name": string;
+        /**
+          * Controls the button size
+         */
+        "size": ButtonSize;
+        /**
+          * Defines the button's status/state color
+         */
+        "status": ButtonStatus;
+        /**
+          * Button text content
+         */
+        "text"?: string;
+        /**
+          * HTML button type
+         */
+        "type": ButtonType;
+        "value": string;
+        /**
+          * Predefined button variants
+         */
+        "variant"?: ButtonVariant;
+    }
+    /**
+     * @component BcmChip
+     * @description A versatile chip component that can be used to display compact pieces of information, filters, or actions.
+     * Supports different sizes, styles (filled, outlined, text), statuses, and can be dismissible.
+     * @example <bcm-chip size="medium" kind="filled" status="success">
+     *   Success Chip
+     * </bcm-chip>
+     * @example Dismissible chip
+     * <bcm-chip dismissible={true} onDismiss={() => handleDismiss()}>
+     * Dismissible Chip
+     * </bcm-chip>
+     * @prop {ChipSize} size - Defines the size of the chip: 'small' | 'medium' | 'large'
+     * @prop {ChipKind} kind - Defines the visual style: 'filled' | 'outlined' | 'text'
+     * @prop {ChipStatus} status - Defines the status color: 'info' | 'error' | 'warning' | 'success' | 'default'
+     * @prop {boolean} dismissible - Whether the chip can be dismissed
+     * @prop {boolean} disabled - Whether the chip is disabled
+     * @prop {string} color - Custom color override for the chip
+     * @event {EventEmitter<void>} dismiss - Emitted when the dismiss button is clicked
+     * @csspart chip - The root chip element
+     * @csspart dismiss-icon - The dismiss button icon
+     */
+    interface BcmChip {
+        /**
+          * Chip color variant
+         */
+        "color"?: string;
+        /**
+          * Whether chip is disabled
+         */
+        "disabled"?: boolean;
+        /**
+          * Whether chip can be dismissed
+         */
+        "dismissible"?: boolean;
+        /**
+          * Chip style variant
+         */
+        "kind"?: ChipKind;
+        /**
+          * Chip size variant
+         */
+        "size"?: ChipSize;
+        /**
+          * Chip status
+         */
+        "status"?: ChipStatus;
+    }
+    interface BcmText {
+        /**
+          * Text size
+         */
+        "size": TextSize;
+        /**
+          * Text content
+         */
+        "text": string;
+        /**
+          * Text variant
+         */
+        "variant": TextVariant;
+    }
+}
+export interface BcmAccordionCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLBcmAccordionElement;
+}
+export interface BcmAccordionGroupCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLBcmAccordionGroupElement;
+}
+export interface BcmAlertCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLBcmAlertElement;
+}
+export interface BcmButtonCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLBcmButtonElement;
+}
+export interface BcmChipCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLBcmChipElement;
+}
+declare global {
+    interface HTMLBcmAccordionElementEventMap {
+        "bcmAccordionChange": AccordionChangeEventType;
+    }
+    /**
+     * @component BcmAccordion
+     * @description A collapsible accordion component that provides expandable/collapsible content sections with keyboard navigation
+     * and accessibility features. Offers customizable header, content, and footer areas through slots.
+     * @example Basic usage
+     * <bcm-accordion>
+     * <div slot="title">Accordion Title</div>
+     * <div>Content goes here</div>
+     * </bcm-accordion>
+     * @example With all slots and hint text
+     * <bcm-accordion hint-text="Additional information">
+     * <div slot="title">Title</div>
+     * <div slot="actions">
+     * <button>Action</button>
+     * </div>
+     * <div>Main content</div>
+     * <div slot="footer">Footer content</div>
+     * </bcm-accordion>
+     * @example Event handling
+     * // Listen to accordion state changes
+     * const accordion = document.querySelector('bcm-accordion');
+     * accordion.addEventListener('bcmAccordionChange', (event) => {
+     * const { expanded, source } = event.detail;
+     * console.log('Accordion expanded:', expanded);
+     * console.log('Changed accordion:', source);
+     * });
+     * // Programmatically control accordion
+     * await accordion.toggle(); // Toggle state
+     * await accordion.expand(); // Expand accordion
+     * await accordion.collapse(); // Collapse accordion
+     * @prop {boolean} expanded - Controls the expanded state of the accordion (default: false)
+     * @prop {boolean} group - Indicates if the accordion is part of an accordion group (default: false)
+     * @prop {string} hintText - Optional hint text to display in the footer when no footer content is provided
+     * @event {EventEmitter<AccordionChangeEventType>} bcmAccordionChange - Emitted when the accordion's expanded state changes
+     * @eventProperty {boolean} expanded - Current expanded state
+     * @eventProperty {HTMLBcmAccordionElement} source - Reference to the accordion element that changed
+     * @csspart container - The root container element
+     * @csspart header - The header section with title and actions
+     * @csspart content - The collapsible content section
+     * @csspart footer - The footer section with hint text or footer slot
+     * @csspart section - Container for header content sections
+     * @csspart icon - The expand/collapse chevron icon
+     * @css {string} --bcm-accordion-radius - Border radius of the accordion header (default: 4px)
+     * @css {string} --bcm-accordion-bg - Background color of the accordion header
+     * @css {string} --bcm-accordion-text - Text color of the accordion
+     * @css {string} --bcm-accordion-footer-bg - Background color of the footer section
+     * @methods toggle() - Toggles the accordion's expanded state
+     * expand() - Expands the accordion if collapsed
+     * collapse() - Collapses the accordion if expanded
+     */
+    interface HTMLBcmAccordionElement extends Components.BcmAccordion, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLBcmAccordionElementEventMap>(type: K, listener: (this: HTMLBcmAccordionElement, ev: BcmAccordionCustomEvent<HTMLBcmAccordionElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLBcmAccordionElementEventMap>(type: K, listener: (this: HTMLBcmAccordionElement, ev: BcmAccordionCustomEvent<HTMLBcmAccordionElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLBcmAccordionElement: {
+        prototype: HTMLBcmAccordionElement;
+        new (): HTMLBcmAccordionElement;
+    };
+    interface HTMLBcmAccordionGroupElementEventMap {
+        "bcmAccordionGroupChange": AccordionGroupChangeEventType;
+    }
+    /**
+     * @component BcmAccordionGroup
+     * @description A container component that manages a group of accordions. Provides single/multiple expansion 
+     * modes and methods for controlling all accordions simultaneously. Uses shadow DOM for style encapsulation.
+     * @example Basic usage - Single expansion mode
+     * <bcm-accordion-group>
+     * <bcm-accordion>
+     * <div slot="title">Section 1</div>
+     * <div>Content 1</div>
+     * </bcm-accordion>
+     * <bcm-accordion>
+     * <div slot="title">Section 2</div>
+     * <div>Content 2</div>
+     * </bcm-accordion>
+     * </bcm-accordion-group>
+     * @example Multiple expansion mode
+     * <bcm-accordion-group multi={true}>
+     * <bcm-accordion>...</bcm-accordion>
+     * <bcm-accordion>...</bcm-accordion>
+     * </bcm-accordion-group>
+     * @example Event handling
+     * // Listen to accordion group changes
+     * const accordionGroup = document.querySelector('bcm-accordion-group');
+     * accordionGroup.addEventListener('bcmAccordionGroupChange', (event) => {
+     * const { expanded, changed, expandedItems, expandedCount } = event.detail;
+     * console.log('Accordion expanded state:', expanded);
+     * console.log('Changed accordion:', changed);
+     * console.log('Currently expanded accordions:', expandedItems);
+     * console.log('Number of expanded accordions:', expandedCount);
+     * });
+     * // Using methods
+     * await accordionGroup.expandAll();   // Expands all accordions (only in multi mode)
+     * await accordionGroup.collapseAll(); // Collapses all accordions
+     * const expanded = await accordionGroup.getExpandedItems(); // Gets expanded accordions
+     * @prop {boolean} multi - Controls whether multiple accordions can be expanded simultaneously (default: false)
+     * @event {EventEmitter<AccordionGroupChangeEventType>} bcmAccordionGroupChange - Emitted when any accordion's state changes
+     * @eventProperty {boolean} expanded - Current expanded state of the changed accordion
+     * @eventProperty {HTMLElement} changed - The accordion element that triggered the change
+     * @eventProperty {HTMLElement[]} expandedItems - Array of currently expanded accordion elements
+     * @eventProperty {number} expandedCount - Number of currently expanded accordions
+     * @method expandAll() - Expands all accordions (only available in multi mode)
+     * @method collapseAll() - Collapses all accordions
+     * @method getExpandedItems() - Returns array of currently expanded accordions
+     * @csspart container - The accordion group container element
+     * @css {string} --bcm-accordion-border - Border color of the accordion group
+     * @css {string} --bcm-accordion-radius - Border radius of the accordion group
+     */
+    interface HTMLBcmAccordionGroupElement extends Components.BcmAccordionGroup, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLBcmAccordionGroupElementEventMap>(type: K, listener: (this: HTMLBcmAccordionGroupElement, ev: BcmAccordionGroupCustomEvent<HTMLBcmAccordionGroupElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLBcmAccordionGroupElementEventMap>(type: K, listener: (this: HTMLBcmAccordionGroupElement, ev: BcmAccordionGroupCustomEvent<HTMLBcmAccordionGroupElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLBcmAccordionGroupElement: {
+        prototype: HTMLBcmAccordionGroupElement;
+        new (): HTMLBcmAccordionGroupElement;
+    };
+    interface HTMLBcmAlertElementEventMap {
+        "bcmDismiss": void;
+    }
+    /**
+     * Alert component that displays messages with different statuses and styles
+     * @class BcmAlert
+     */
+    interface HTMLBcmAlertElement extends Components.BcmAlert, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLBcmAlertElementEventMap>(type: K, listener: (this: HTMLBcmAlertElement, ev: BcmAlertCustomEvent<HTMLBcmAlertElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLBcmAlertElementEventMap>(type: K, listener: (this: HTMLBcmAlertElement, ev: BcmAlertCustomEvent<HTMLBcmAlertElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLBcmAlertElement: {
+        prototype: HTMLBcmAlertElement;
+        new (): HTMLBcmAlertElement;
+    };
+    interface HTMLBcmAvatarElement extends Components.BcmAvatar, HTMLStencilElement {
+    }
+    var HTMLBcmAvatarElement: {
+        prototype: HTMLBcmAvatarElement;
+        new (): HTMLBcmAvatarElement;
+    };
+    interface HTMLBcmButtonElementEventMap {
+        "bcmClick": MouseEvent;
+        "bcmFocus": FocusEvent;
+        "bcmBlur": FocusEvent;
+    }
+    interface HTMLBcmButtonElement extends Components.BcmButton, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLBcmButtonElementEventMap>(type: K, listener: (this: HTMLBcmButtonElement, ev: BcmButtonCustomEvent<HTMLBcmButtonElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLBcmButtonElementEventMap>(type: K, listener: (this: HTMLBcmButtonElement, ev: BcmButtonCustomEvent<HTMLBcmButtonElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLBcmButtonElement: {
+        prototype: HTMLBcmButtonElement;
+        new (): HTMLBcmButtonElement;
+    };
+    interface HTMLBcmChipElementEventMap {
+        "bcmDismiss": void;
+    }
+    /**
+     * @component BcmChip
+     * @description A versatile chip component that can be used to display compact pieces of information, filters, or actions.
+     * Supports different sizes, styles (filled, outlined, text), statuses, and can be dismissible.
+     * @example <bcm-chip size="medium" kind="filled" status="success">
+     *   Success Chip
+     * </bcm-chip>
+     * @example Dismissible chip
+     * <bcm-chip dismissible={true} onDismiss={() => handleDismiss()}>
+     * Dismissible Chip
+     * </bcm-chip>
+     * @prop {ChipSize} size - Defines the size of the chip: 'small' | 'medium' | 'large'
+     * @prop {ChipKind} kind - Defines the visual style: 'filled' | 'outlined' | 'text'
+     * @prop {ChipStatus} status - Defines the status color: 'info' | 'error' | 'warning' | 'success' | 'default'
+     * @prop {boolean} dismissible - Whether the chip can be dismissed
+     * @prop {boolean} disabled - Whether the chip is disabled
+     * @prop {string} color - Custom color override for the chip
+     * @event {EventEmitter<void>} dismiss - Emitted when the dismiss button is clicked
+     * @csspart chip - The root chip element
+     * @csspart dismiss-icon - The dismiss button icon
+     */
+    interface HTMLBcmChipElement extends Components.BcmChip, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLBcmChipElementEventMap>(type: K, listener: (this: HTMLBcmChipElement, ev: BcmChipCustomEvent<HTMLBcmChipElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLBcmChipElementEventMap>(type: K, listener: (this: HTMLBcmChipElement, ev: BcmChipCustomEvent<HTMLBcmChipElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLBcmChipElement: {
+        prototype: HTMLBcmChipElement;
+        new (): HTMLBcmChipElement;
+    };
+    interface HTMLBcmTextElement extends Components.BcmText, HTMLStencilElement {
+    }
+    var HTMLBcmTextElement: {
+        prototype: HTMLBcmTextElement;
+        new (): HTMLBcmTextElement;
+    };
+    interface HTMLElementTagNameMap {
+        "bcm-accordion": HTMLBcmAccordionElement;
+        "bcm-accordion-group": HTMLBcmAccordionGroupElement;
+        "bcm-alert": HTMLBcmAlertElement;
+        "bcm-avatar": HTMLBcmAvatarElement;
+        "bcm-button": HTMLBcmButtonElement;
+        "bcm-chip": HTMLBcmChipElement;
+        "bcm-text": HTMLBcmTextElement;
+    }
+}
+declare namespace LocalJSX {
+    /**
+     * @component BcmAccordion
+     * @description A collapsible accordion component that provides expandable/collapsible content sections with keyboard navigation
+     * and accessibility features. Offers customizable header, content, and footer areas through slots.
+     * @example Basic usage
+     * <bcm-accordion>
+     * <div slot="title">Accordion Title</div>
+     * <div>Content goes here</div>
+     * </bcm-accordion>
+     * @example With all slots and hint text
+     * <bcm-accordion hint-text="Additional information">
+     * <div slot="title">Title</div>
+     * <div slot="actions">
+     * <button>Action</button>
+     * </div>
+     * <div>Main content</div>
+     * <div slot="footer">Footer content</div>
+     * </bcm-accordion>
+     * @example Event handling
+     * // Listen to accordion state changes
+     * const accordion = document.querySelector('bcm-accordion');
+     * accordion.addEventListener('bcmAccordionChange', (event) => {
+     * const { expanded, source } = event.detail;
+     * console.log('Accordion expanded:', expanded);
+     * console.log('Changed accordion:', source);
+     * });
+     * // Programmatically control accordion
+     * await accordion.toggle(); // Toggle state
+     * await accordion.expand(); // Expand accordion
+     * await accordion.collapse(); // Collapse accordion
+     * @prop {boolean} expanded - Controls the expanded state of the accordion (default: false)
+     * @prop {boolean} group - Indicates if the accordion is part of an accordion group (default: false)
+     * @prop {string} hintText - Optional hint text to display in the footer when no footer content is provided
+     * @event {EventEmitter<AccordionChangeEventType>} bcmAccordionChange - Emitted when the accordion's expanded state changes
+     * @eventProperty {boolean} expanded - Current expanded state
+     * @eventProperty {HTMLBcmAccordionElement} source - Reference to the accordion element that changed
+     * @csspart container - The root container element
+     * @csspart header - The header section with title and actions
+     * @csspart content - The collapsible content section
+     * @csspart footer - The footer section with hint text or footer slot
+     * @csspart section - Container for header content sections
+     * @csspart icon - The expand/collapse chevron icon
+     * @css {string} --bcm-accordion-radius - Border radius of the accordion header (default: 4px)
+     * @css {string} --bcm-accordion-bg - Background color of the accordion header
+     * @css {string} --bcm-accordion-text - Text color of the accordion
+     * @css {string} --bcm-accordion-footer-bg - Background color of the footer section
+     * @methods toggle() - Toggles the accordion's expanded state
+     * expand() - Expands the accordion if collapsed
+     * collapse() - Collapses the accordion if expanded
+     */
+    interface BcmAccordion {
+        /**
+          * Controls whether the accordion is expanded or collapsed.
+          * @prop 
+          * @defaultValue false
+         */
+        "expanded"?: boolean;
+        /**
+          * Indicates if the accordion is part of a group. Used for group behavior coordination.
+          * @prop 
+          * @defaultValue false
+         */
+        "group"?: boolean;
+        /**
+          * Optional title text to display in the header.
+          * @prop 
+          * @defaultValue undefined
+         */
+        "headerTitle"?: string;
+        /**
+          * Optional text to display in the footer when no footer slot content is provided.
+          * @prop
+         */
+        "hintText"?: string;
+        /**
+          * Emitted when the accordion's expanded state changes.
+          * @event
+         */
+        "onBcmAccordionChange"?: (event: BcmAccordionCustomEvent<AccordionChangeEventType>) => void;
+    }
+    /**
+     * @component BcmAccordionGroup
+     * @description A container component that manages a group of accordions. Provides single/multiple expansion 
+     * modes and methods for controlling all accordions simultaneously. Uses shadow DOM for style encapsulation.
+     * @example Basic usage - Single expansion mode
+     * <bcm-accordion-group>
+     * <bcm-accordion>
+     * <div slot="title">Section 1</div>
+     * <div>Content 1</div>
+     * </bcm-accordion>
+     * <bcm-accordion>
+     * <div slot="title">Section 2</div>
+     * <div>Content 2</div>
+     * </bcm-accordion>
+     * </bcm-accordion-group>
+     * @example Multiple expansion mode
+     * <bcm-accordion-group multi={true}>
+     * <bcm-accordion>...</bcm-accordion>
+     * <bcm-accordion>...</bcm-accordion>
+     * </bcm-accordion-group>
+     * @example Event handling
+     * // Listen to accordion group changes
+     * const accordionGroup = document.querySelector('bcm-accordion-group');
+     * accordionGroup.addEventListener('bcmAccordionGroupChange', (event) => {
+     * const { expanded, changed, expandedItems, expandedCount } = event.detail;
+     * console.log('Accordion expanded state:', expanded);
+     * console.log('Changed accordion:', changed);
+     * console.log('Currently expanded accordions:', expandedItems);
+     * console.log('Number of expanded accordions:', expandedCount);
+     * });
+     * // Using methods
+     * await accordionGroup.expandAll();   // Expands all accordions (only in multi mode)
+     * await accordionGroup.collapseAll(); // Collapses all accordions
+     * const expanded = await accordionGroup.getExpandedItems(); // Gets expanded accordions
+     * @prop {boolean} multi - Controls whether multiple accordions can be expanded simultaneously (default: false)
+     * @event {EventEmitter<AccordionGroupChangeEventType>} bcmAccordionGroupChange - Emitted when any accordion's state changes
+     * @eventProperty {boolean} expanded - Current expanded state of the changed accordion
+     * @eventProperty {HTMLElement} changed - The accordion element that triggered the change
+     * @eventProperty {HTMLElement[]} expandedItems - Array of currently expanded accordion elements
+     * @eventProperty {number} expandedCount - Number of currently expanded accordions
+     * @method expandAll() - Expands all accordions (only available in multi mode)
+     * @method collapseAll() - Collapses all accordions
+     * @method getExpandedItems() - Returns array of currently expanded accordions
+     * @csspart container - The accordion group container element
+     * @css {string} --bcm-accordion-border - Border color of the accordion group
+     * @css {string} --bcm-accordion-radius - Border radius of the accordion group
+     */
+    interface BcmAccordionGroup {
+        /**
+          * Controls whether multiple accordions can be expanded simultaneously
+         */
+        "multi"?: boolean;
+        /**
+          * Event emitted when any accordion's expanded state changes
+         */
+        "onBcmAccordionGroupChange"?: (event: BcmAccordionGroupCustomEvent<AccordionGroupChangeEventType>) => void;
+    }
+    /**
+     * Alert component that displays messages with different statuses and styles
+     * @class BcmAlert
+     */
+    interface BcmAlert {
+        /**
+          * Whether alert can be dismissed
+         */
+        "dismissible"?: boolean;
+        /**
+          * Alert style variant
+         */
+        "kind"?: AlertKind;
+        "onBcmDismiss"?: (event: BcmAlertCustomEvent<void>) => void;
+        /**
+          * Whether to show status icon
+         */
+        "showStatusIcon"?: boolean;
+        /**
+          * Alert size variant
+         */
+        "size"?: AlertSize;
+        /**
+          * Alert status type
+         */
+        "status"?: AlertStatus;
+    }
+    interface BcmAvatar {
+        /**
+          * Alternative text for image
+         */
+        "alt"?: string;
+        /**
+          * Status indicator animation
+         */
+        "blink"?: boolean;
+        /**
+          * Custom background color
+         */
+        "color"?: string;
+        /**
+          * Fallback icon class
+         */
+        "icon"?: string;
+        /**
+          * Source URL for avatar image
+         */
+        "image"?: string;
+        /**
+          * Display name (used for initials)
+         */
+        "name"?: string;
+        /**
+          * Shape of the avatar (ellipse/square)
+         */
+        "shape"?: AvatarShape;
+        /**
+          * Size of the avatar
+         */
+        "size"?: AvatarSize;
+        /**
+          * Status indicator type
+         */
+        "status"?: AvatarStatus;
+    }
+    interface BcmButton {
+        /**
+          * Active state
+         */
+        "active"?: boolean;
+        /**
+          * ID of controlled element
+         */
+        "controls"?: string;
+        /**
+          * Disabled state
+         */
+        "disabled"?: boolean;
+        /**
+          * Expanded state for expandable content
+         */
+        "expanded"?: string;
+        /**
+          * Form association
+         */
+        "form"?: string;
+        /**
+          * Full width button
+         */
+        "fullWidth"?: boolean;
+        /**
+          * Icon class name
+         */
+        "icon"?: string;
+        /**
+          * Icon-only button mode
+         */
+        "iconOnly"?: boolean;
+        /**
+          * Icon placement (prefix/suffix)
+         */
+        "iconPosition"?: IconPosition;
+        /**
+          * Defines the main visual style of the button
+         */
+        "kind"?: ButtonKind;
+        /**
+          * Screen reader label
+         */
+        "label"?: string;
+        /**
+          * Loading state
+         */
+        "loading"?: boolean;
+        "name"?: string;
+        "onBcmBlur"?: (event: BcmButtonCustomEvent<FocusEvent>) => void;
+        "onBcmClick"?: (event: BcmButtonCustomEvent<MouseEvent>) => void;
+        "onBcmFocus"?: (event: BcmButtonCustomEvent<FocusEvent>) => void;
+        /**
+          * Controls the button size
+         */
+        "size"?: ButtonSize;
+        /**
+          * Defines the button's status/state color
+         */
+        "status"?: ButtonStatus;
+        /**
+          * Button text content
+         */
+        "text"?: string;
+        /**
+          * HTML button type
+         */
+        "type"?: ButtonType;
+        "value"?: string;
+        /**
+          * Predefined button variants
+         */
+        "variant"?: ButtonVariant;
+    }
+    /**
+     * @component BcmChip
+     * @description A versatile chip component that can be used to display compact pieces of information, filters, or actions.
+     * Supports different sizes, styles (filled, outlined, text), statuses, and can be dismissible.
+     * @example <bcm-chip size="medium" kind="filled" status="success">
+     *   Success Chip
+     * </bcm-chip>
+     * @example Dismissible chip
+     * <bcm-chip dismissible={true} onDismiss={() => handleDismiss()}>
+     * Dismissible Chip
+     * </bcm-chip>
+     * @prop {ChipSize} size - Defines the size of the chip: 'small' | 'medium' | 'large'
+     * @prop {ChipKind} kind - Defines the visual style: 'filled' | 'outlined' | 'text'
+     * @prop {ChipStatus} status - Defines the status color: 'info' | 'error' | 'warning' | 'success' | 'default'
+     * @prop {boolean} dismissible - Whether the chip can be dismissed
+     * @prop {boolean} disabled - Whether the chip is disabled
+     * @prop {string} color - Custom color override for the chip
+     * @event {EventEmitter<void>} dismiss - Emitted when the dismiss button is clicked
+     * @csspart chip - The root chip element
+     * @csspart dismiss-icon - The dismiss button icon
+     */
+    interface BcmChip {
+        /**
+          * Chip color variant
+         */
+        "color"?: string;
+        /**
+          * Whether chip is disabled
+         */
+        "disabled"?: boolean;
+        /**
+          * Whether chip can be dismissed
+         */
+        "dismissible"?: boolean;
+        /**
+          * Chip style variant
+         */
+        "kind"?: ChipKind;
+        "onBcmDismiss"?: (event: BcmChipCustomEvent<void>) => void;
+        /**
+          * Chip size variant
+         */
+        "size"?: ChipSize;
+        /**
+          * Chip status
+         */
+        "status"?: ChipStatus;
+    }
+    interface BcmText {
+        /**
+          * Text size
+         */
+        "size"?: TextSize;
+        /**
+          * Text content
+         */
+        "text"?: string;
+        /**
+          * Text variant
+         */
+        "variant"?: TextVariant;
+    }
+    interface IntrinsicElements {
+        "bcm-accordion": BcmAccordion;
+        "bcm-accordion-group": BcmAccordionGroup;
+        "bcm-alert": BcmAlert;
+        "bcm-avatar": BcmAvatar;
+        "bcm-button": BcmButton;
+        "bcm-chip": BcmChip;
+        "bcm-text": BcmText;
+    }
+}
+export { LocalJSX as JSX };
+declare module "@stencil/core" {
+    export namespace JSX {
+        interface IntrinsicElements {
+            /**
+             * @component BcmAccordion
+             * @description A collapsible accordion component that provides expandable/collapsible content sections with keyboard navigation
+             * and accessibility features. Offers customizable header, content, and footer areas through slots.
+             * @example Basic usage
+             * <bcm-accordion>
+             * <div slot="title">Accordion Title</div>
+             * <div>Content goes here</div>
+             * </bcm-accordion>
+             * @example With all slots and hint text
+             * <bcm-accordion hint-text="Additional information">
+             * <div slot="title">Title</div>
+             * <div slot="actions">
+             * <button>Action</button>
+             * </div>
+             * <div>Main content</div>
+             * <div slot="footer">Footer content</div>
+             * </bcm-accordion>
+             * @example Event handling
+             * // Listen to accordion state changes
+             * const accordion = document.querySelector('bcm-accordion');
+             * accordion.addEventListener('bcmAccordionChange', (event) => {
+             * const { expanded, source } = event.detail;
+             * console.log('Accordion expanded:', expanded);
+             * console.log('Changed accordion:', source);
+             * });
+             * // Programmatically control accordion
+             * await accordion.toggle(); // Toggle state
+             * await accordion.expand(); // Expand accordion
+             * await accordion.collapse(); // Collapse accordion
+             * @prop {boolean} expanded - Controls the expanded state of the accordion (default: false)
+             * @prop {boolean} group - Indicates if the accordion is part of an accordion group (default: false)
+             * @prop {string} hintText - Optional hint text to display in the footer when no footer content is provided
+             * @event {EventEmitter<AccordionChangeEventType>} bcmAccordionChange - Emitted when the accordion's expanded state changes
+             * @eventProperty {boolean} expanded - Current expanded state
+             * @eventProperty {HTMLBcmAccordionElement} source - Reference to the accordion element that changed
+             * @csspart container - The root container element
+             * @csspart header - The header section with title and actions
+             * @csspart content - The collapsible content section
+             * @csspart footer - The footer section with hint text or footer slot
+             * @csspart section - Container for header content sections
+             * @csspart icon - The expand/collapse chevron icon
+             * @css {string} --bcm-accordion-radius - Border radius of the accordion header (default: 4px)
+             * @css {string} --bcm-accordion-bg - Background color of the accordion header
+             * @css {string} --bcm-accordion-text - Text color of the accordion
+             * @css {string} --bcm-accordion-footer-bg - Background color of the footer section
+             * @methods toggle() - Toggles the accordion's expanded state
+             * expand() - Expands the accordion if collapsed
+             * collapse() - Collapses the accordion if expanded
+             */
+            "bcm-accordion": LocalJSX.BcmAccordion & JSXBase.HTMLAttributes<HTMLBcmAccordionElement>;
+            /**
+             * @component BcmAccordionGroup
+             * @description A container component that manages a group of accordions. Provides single/multiple expansion 
+             * modes and methods for controlling all accordions simultaneously. Uses shadow DOM for style encapsulation.
+             * @example Basic usage - Single expansion mode
+             * <bcm-accordion-group>
+             * <bcm-accordion>
+             * <div slot="title">Section 1</div>
+             * <div>Content 1</div>
+             * </bcm-accordion>
+             * <bcm-accordion>
+             * <div slot="title">Section 2</div>
+             * <div>Content 2</div>
+             * </bcm-accordion>
+             * </bcm-accordion-group>
+             * @example Multiple expansion mode
+             * <bcm-accordion-group multi={true}>
+             * <bcm-accordion>...</bcm-accordion>
+             * <bcm-accordion>...</bcm-accordion>
+             * </bcm-accordion-group>
+             * @example Event handling
+             * // Listen to accordion group changes
+             * const accordionGroup = document.querySelector('bcm-accordion-group');
+             * accordionGroup.addEventListener('bcmAccordionGroupChange', (event) => {
+             * const { expanded, changed, expandedItems, expandedCount } = event.detail;
+             * console.log('Accordion expanded state:', expanded);
+             * console.log('Changed accordion:', changed);
+             * console.log('Currently expanded accordions:', expandedItems);
+             * console.log('Number of expanded accordions:', expandedCount);
+             * });
+             * // Using methods
+             * await accordionGroup.expandAll();   // Expands all accordions (only in multi mode)
+             * await accordionGroup.collapseAll(); // Collapses all accordions
+             * const expanded = await accordionGroup.getExpandedItems(); // Gets expanded accordions
+             * @prop {boolean} multi - Controls whether multiple accordions can be expanded simultaneously (default: false)
+             * @event {EventEmitter<AccordionGroupChangeEventType>} bcmAccordionGroupChange - Emitted when any accordion's state changes
+             * @eventProperty {boolean} expanded - Current expanded state of the changed accordion
+             * @eventProperty {HTMLElement} changed - The accordion element that triggered the change
+             * @eventProperty {HTMLElement[]} expandedItems - Array of currently expanded accordion elements
+             * @eventProperty {number} expandedCount - Number of currently expanded accordions
+             * @method expandAll() - Expands all accordions (only available in multi mode)
+             * @method collapseAll() - Collapses all accordions
+             * @method getExpandedItems() - Returns array of currently expanded accordions
+             * @csspart container - The accordion group container element
+             * @css {string} --bcm-accordion-border - Border color of the accordion group
+             * @css {string} --bcm-accordion-radius - Border radius of the accordion group
+             */
+            "bcm-accordion-group": LocalJSX.BcmAccordionGroup & JSXBase.HTMLAttributes<HTMLBcmAccordionGroupElement>;
+            /**
+             * Alert component that displays messages with different statuses and styles
+             * @class BcmAlert
+             */
+            "bcm-alert": LocalJSX.BcmAlert & JSXBase.HTMLAttributes<HTMLBcmAlertElement>;
+            "bcm-avatar": LocalJSX.BcmAvatar & JSXBase.HTMLAttributes<HTMLBcmAvatarElement>;
+            "bcm-button": LocalJSX.BcmButton & JSXBase.HTMLAttributes<HTMLBcmButtonElement>;
+            /**
+             * @component BcmChip
+             * @description A versatile chip component that can be used to display compact pieces of information, filters, or actions.
+             * Supports different sizes, styles (filled, outlined, text), statuses, and can be dismissible.
+             * @example <bcm-chip size="medium" kind="filled" status="success">
+             *   Success Chip
+             * </bcm-chip>
+             * @example Dismissible chip
+             * <bcm-chip dismissible={true} onDismiss={() => handleDismiss()}>
+             * Dismissible Chip
+             * </bcm-chip>
+             * @prop {ChipSize} size - Defines the size of the chip: 'small' | 'medium' | 'large'
+             * @prop {ChipKind} kind - Defines the visual style: 'filled' | 'outlined' | 'text'
+             * @prop {ChipStatus} status - Defines the status color: 'info' | 'error' | 'warning' | 'success' | 'default'
+             * @prop {boolean} dismissible - Whether the chip can be dismissed
+             * @prop {boolean} disabled - Whether the chip is disabled
+             * @prop {string} color - Custom color override for the chip
+             * @event {EventEmitter<void>} dismiss - Emitted when the dismiss button is clicked
+             * @csspart chip - The root chip element
+             * @csspart dismiss-icon - The dismiss button icon
+             */
+            "bcm-chip": LocalJSX.BcmChip & JSXBase.HTMLAttributes<HTMLBcmChipElement>;
+            "bcm-text": LocalJSX.BcmText & JSXBase.HTMLAttributes<HTMLBcmTextElement>;
+        }
+    }
+}