aeico-components 0.1.4 → 0.1.6

package/dist/types/menu/menu-item.d.ts

@@ -0,0 +1,63 @@
+import AeicoComponent from '../aeico-component';
+import type { InferProps } from 'aeico';
+import type { MenuIconPlacement } from './defines';
+/**
+ * Menu item — used as a direct child of `<ae-menu>` or nested inside another
+ * `<ae-menu-item>` to create a two-level submenu.
+ *
+ * - **Leaf item**: omit `label`; slot contains the item text.
+ * - **Parent item**: set `label` to the trigger text; slot children are
+ *   `<ae-menu-item>` elements that appear in the submenu panel/section.
+ *
+ * **Slots (parent items only)**
+ * - `expand`  — icon shown when the submenu is closed (default: CSS triangle).
+ * - `collapse` — icon shown when the submenu is open (default: rotated CSS triangle).
+ *
+ * @example
+ * ```html
+ * <ae-menu-item label="Settings" icon-placement="start">
+ *   <ae-icon name="chevron-right" slot="expand"></ae-icon>
+ *   <ae-icon name="chevron-down" slot="collapse"></ae-icon>
+ *   <ae-menu-item key="profile">Profile</ae-menu-item>
+ * </ae-menu-item>
+ * ```
+ */
+declare class MenuItem extends AeicoComponent {
+    static tagName: string;
+    protected static styles: string[];
+    accessor key: string | undefined;
+    accessor label: string | undefined;
+    accessor disabled: boolean;
+    accessor href: string | undefined;
+    accessor selected: boolean;
+    accessor open: boolean;
+    accessor iconPlacement: MenuIconPlacement;
+    private _outsideClickHandler;
+    private _closeTimer;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    private get _parentMenu();
+    private get _mode();
+    private get _orientation();
+    private get _trigger();
+    private get _isParent();
+    /** Compute flyout panel placement based on depth and parent orientation. */
+    private get _panelPlacement();
+    private _isHoverTrigger;
+    private _handleMouseEnter;
+    private _handleMouseLeave;
+    private _handleParentClick;
+    private _handleLeafClick;
+    private _handleChildSelect;
+    private _handleKeydown;
+    private _buildKeyPath;
+    protected render(): import("aeico-view").RenderResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'ae-menu-item': MenuItem;
+    }
+}
+export default MenuItem;
+export type MenuItemProps = InferProps<typeof MenuItem>;
+export type { MenuIconPlacement };

package/dist/types/menu/menu.d.ts

@@ -0,0 +1,34 @@
+import AeicoComponent from '../aeico-component';
+import type { InferProps } from 'aeico';
+import type { MenuMode, MenuOrientation, MenuTrigger } from './defines';
+import './menu-item';
+/**
+ * Menu navigation component. Renders a horizontal or vertical menu with
+ * optional two-level flyout or inline (accordion) submenus.
+ *
+ * Two modes:
+ * - `flyout` (default) — submenus open as floating panels (like a nav bar or
+ *   context menu).
+ * - `inline` — submenus expand in-place (accordion-style sidebar).
+ *
+ * Emits:
+ * - `select` — `{ detail: { key, label, keyPath } }` when a leaf item is clicked.
+ */
+declare class Menu extends AeicoComponent {
+    static tagName: string;
+    protected static styles: string[];
+    accessor mode: MenuMode;
+    accessor orientation: MenuOrientation;
+    accessor trigger: MenuTrigger;
+    accessor selectedKey: string | undefined;
+    connectedCallback(): void;
+    private _handleItemSelect;
+    protected render(): import("aeico-view").RenderResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'ae-menu': Menu;
+    }
+}
+export default Menu;
+export type MenuProps = InferProps<typeof Menu>;

package/dist/types/number-input/index.d.ts

@@ -0,0 +1,2 @@
+export { default, default as NumberInput } from './number-input';
+export type { NumberInputProps } from './number-input';

package/dist/types/number-input/number-input.d.ts

@@ -0,0 +1,35 @@
+import AeicoField from '../aeico-field';
+import type { InferProps, Props } from 'aeico';
+declare class NumberInput extends AeicoField<number> {
+    protected fieldElement: HTMLInputElement | null;
+    static tagName: string;
+    static props: Props;
+    placeholder?: string;
+    min?: number;
+    max?: number;
+    step?: number;
+    controls?: boolean;
+    protected static styles: string[];
+    render(): import("aeico-view").RenderResult;
+    protected readonly boundOnIncrement: () => void;
+    protected readonly boundOnDecrement: () => void;
+    /**
+     * Get current value as number
+     */
+    protected getValue(): number;
+    /**
+     * Write value to the input element (DOM only)
+     */
+    protected writeValue(value: number): void;
+    /**
+     * Get event payload for change events
+     */
+    protected getEventPayload(value: number, oldValue: number, action: import('../aeico-field').FieldAction): Record<string, unknown>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'ae-number-input': NumberInput;
+    }
+}
+export default NumberInput;
+export type NumberInputProps = InferProps<typeof NumberInput>;

package/dist/types/pagination/defines.d.ts

@@ -0,0 +1,2 @@
+export type PaginationSize = 'xs' | 'sm' | 'md' | 'lg';
+export type PaginationVariant = 'borderless' | 'link';

package/dist/types/pagination/index.d.ts

@@ -0,0 +1,3 @@
+export { default, default as Pagination } from './pagination';
+export type { PaginationProps } from './pagination';
+export type { PaginationSize, PaginationVariant } from './defines';

package/dist/types/pagination/pagination.d.ts

@@ -0,0 +1,77 @@
+import type { InferProps } from 'aeico';
+import AeicoComponent from '../aeico-component';
+import type { PaginationSize, PaginationVariant } from './defines';
+import '../icon/icon';
+/**
+ * Pagination component for navigating between pages of content.
+ *
+ * @prop {number} page - Current page number (1-indexed). Default: 1.
+ * @prop {number} pageSize - Number of items per page. Default: 10.
+ * @prop {number} total - Total number of items. Used to compute pageCount when pageCount is not set.
+ * @prop {number} pageCount - Total number of pages. Overrides total/pageSize calculation when set.
+ * @prop {number} siblingCount - Number of page buttons to show on each side of the current page. Default: 1.
+ * @prop {'xs'|'sm'|'md'|'lg'} size - Size variant.
+ * @prop {boolean} disabled - Disables all interactive controls.
+ * @prop {boolean} simple - Simple mode: shows only prev/next buttons and a page number input.
+ * @prop {boolean} showFirstLast - Show dedicated first-page and last-page jump buttons.
+ * @prop {'borderless'|'link'} variant - Visual variant. `borderless` removes borders; `link` renders page numbers as plain text links with no borders or backgrounds.
+ *
+ * @event {CustomEvent<{page: number}>} change - Fired when the page changes.
+ *
+ * @slot prev - Custom content for the previous-page button (default: chevron-left icon).
+ * @slot next - Custom content for the next-page button (default: chevron-right icon).
+ * @slot first - Custom content for the first-page button (default: chevrons-left icon). Requires showFirstLast.
+ * @slot last - Custom content for the last-page button (default: chevrons-right icon). Requires showFirstLast.
+ *
+ * @csspart root - The outer <nav> element.
+ * @csspart prev - The previous-page button.
+ * @csspart next - The next-page button.
+ * @csspart first - The first-page button (visible when showFirstLast).
+ * @csspart last - The last-page button (visible when showFirstLast).
+ * @csspart item - A page number button.
+ * @csspart ellipsis - An ellipsis span between page groups.
+ * @csspart page-input - The page number input in simple mode.
+ * @csspart page-total - The "/ N" label in simple mode.
+ *
+ * @example
+ * ```html
+ * <ae-pagination total="100" page-size="10" page="1"></ae-pagination>
+ * ```
+ */
+declare class Pagination extends AeicoComponent {
+    static tagName: string;
+    protected static styles: string[];
+    accessor page: number;
+    accessor pageSize: number;
+    accessor total: number;
+    accessor pageCount: number | undefined;
+    accessor siblingCount: number;
+    accessor size: PaginationSize | undefined;
+    accessor disabled: boolean;
+    accessor simple: boolean;
+    accessor showFirstLast: boolean;
+    accessor variant: PaginationVariant | undefined;
+    private _simpleInput;
+    private get _computedPageCount();
+    private get _currentPage();
+    private _getPageItems;
+    private _goToPage;
+    private _handleItemClick;
+    private _handlePrevClick;
+    private _handleNextClick;
+    private _handleFirstClick;
+    private _handleLastClick;
+    private _handleSimpleInputChange;
+    protected onUpdated(): void;
+    private _renderNavBtn;
+    private _renderSimpleMode;
+    private _renderPageItems;
+    protected render(): import("aeico-view").RenderResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'ae-pagination': Pagination;
+    }
+}
+export default Pagination;
+export type PaginationProps = InferProps<typeof Pagination>;

package/dist/types/progress-bar/defines.d.ts

@@ -0,0 +1 @@
+export type ProgressBarColor = 'default' | 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'info';

package/dist/types/progress-bar/index.d.ts

@@ -0,0 +1,3 @@
+export { default, default as ProgressBar } from './progress-bar';
+export type { ProgressBarProps } from './progress-bar';
+export type { ProgressBarColor } from './defines';

package/dist/types/progress-bar/progress-bar.d.ts

@@ -0,0 +1,37 @@
+import type { InferProps } from 'aeico';
+import AeicoComponent from '../aeico-component';
+import type { ProgressBarColor } from './defines';
+/**
+ * Progress bars show how far along an ongoing operation is as a horizontal fill.
+ * Use them for file uploads, multi-step flows, or any task with measurable progress.
+ *
+ * @prop {number} value - Completion percentage, automatically clamped to 0–100.
+ * @prop {string} label - Accessible label applied as `aria-label` on the track.
+ * @prop {'default'|'primary'|'secondary'|'success'|'danger'|'warning'|'info'} color
+ *   - Preset color variant driven by the shared color system.
+ * @prop {boolean} animated - When set, overlays a shimmer sweep animation on the bar.
+ *
+ * @csspart base - The outermost wrapper `<div>`.
+ * @csspart track - The background track `<div>`.
+ * @csspart bar - The filled progress `<span>`.
+ *
+ * @cssproperty [--progress-height=8px] - Height of both the track and the bar.
+ * @cssproperty [--progress-bar-color=var(--color-solid)] - Fill color of the bar.
+ *   When set, takes precedence over the `color` prop entirely.
+ */
+declare class ProgressBar extends AeicoComponent {
+    static tagName: string;
+    protected static styles: string[];
+    accessor value: number;
+    accessor label: string;
+    accessor color: ProgressBarColor;
+    accessor animated: boolean;
+    protected render(): import("aeico-view").RenderResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'ae-progress-bar': ProgressBar;
+    }
+}
+export default ProgressBar;
+export type ProgressBarProps = InferProps<typeof ProgressBar>;

package/dist/types/radio-group/radio-group.d.ts

@@ -25,7 +25,7 @@ declare class RadioGroup extends AeicoField {
     private _boundOnRadioClick;
     private _boundOnButtonClick;
     protected getValue(): string;
-    protected writeValue(_value: any): void;
+    protected writeValue(_value: string): void;
     protected onReset(): void;
     protected onClear(): void;
     render(): import("aeico-view").RenderResult;

package/dist/types/select/select.d.ts

@@ -14,7 +14,7 @@ import '../tag/tag';
  *
  */
 declare class Select extends AeicoField<SelectOptionValue | SelectMultiValue> {
-    protected fieldElement: null;
+    protected fieldElement: HTMLInputElement | null;
     private _isOpen;
     private _triggerEl;
     private _dropdownEl;
@@ -32,10 +32,10 @@ declare class Select extends AeicoField<SelectOptionValue | SelectMultiValue> {
     defaultValue: SelectOptionValue | SelectMultiValue | undefined;
     protected static styles: string[];
     protected writeValue(_value: SelectOptionValue | SelectMultiValue): void;
-    protected getValue(): any;
+    protected getValue(): SelectOptionValue | SelectMultiValue;
     private _getMultiValues;
     protected onDisabledChanged(_newValue: boolean): void;
-    protected onUpdated(_changedProps: Map<string, unknown>): void;
+    protected onUpdated(changedProps: Map<string, unknown>): void;
     private _findLabel;
     private _onSlotChange;
     private _toggleDropdown;

package/dist/types/spinner/defines.d.ts

@@ -0,0 +1,3 @@
+export type SpinnerVariant = 'border' | 'dots';
+export type SpinnerSize = 'xs' | 'sm' | 'md' | 'lg';
+export type SpinnerColor = 'default' | 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'info' | 'light' | 'dark';

package/dist/types/spinner/index.d.ts

@@ -0,0 +1,3 @@
+export { default, default as Spinner } from './spinner';
+export type { SpinnerProps } from './spinner';
+export type { SpinnerColor, SpinnerSize, SpinnerVariant } from './defines';

package/dist/types/spinner/spinner.d.ts

@@ -0,0 +1,35 @@
+import AeicoComponent from '../aeico-component';
+import type { InferProps } from 'aeico';
+import type { SpinnerColor, SpinnerSize, SpinnerVariant } from './defines';
+/**
+ * Spinner — animated loading indicator.
+ *
+ * Supports two visual variants: a rotating ring (`border`, default) and
+ * three bouncing dots (`dots`). Size and colour are driven by the shared
+ * design-token system.
+ *
+ * @example
+ * ```html
+ * <ae-spinner></ae-spinner>
+ * <ae-spinner variant="dots" color="primary" size="lg"></ae-spinner>
+ * <ae-spinner color="success" speed="0.5s" label="Saving…"></ae-spinner>
+ * ```
+ */
+declare class Spinner extends AeicoComponent {
+    static tagName: string;
+    accessor variant: SpinnerVariant;
+    accessor size: SpinnerSize;
+    accessor color: SpinnerColor;
+    accessor label: string;
+    accessor speed: string | undefined;
+    protected static styles: string[];
+    connectedCallback(): void;
+    protected render(): import("aeico-view").RenderResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'ae-spinner': Spinner;
+    }
+}
+export default Spinner;
+export type SpinnerProps = InferProps<typeof Spinner>;

package/dist/types/switch/defines.d.ts

@@ -0,0 +1 @@
+export type SwitchIconPlacement = 'knob' | 'track';

package/dist/types/switch/switch.d.ts

@@ -1,22 +1,26 @@
-import AeicoField from '../aeico-field';
-import type { InferProps, Props } from 'aeico';
-declare class Switch extends AeicoField {
+import AeicoField, { type FieldAction } from '../aeico-field';
+import type { InferProps } from 'aeico';
+import type { SwitchIconPlacement } from './defines';
+import '../icon/icon';
+declare class Switch extends AeicoField<boolean> {
     protected fieldElement: HTMLInputElement | null;
     static tagName: string;
-    static props: Props;
-    checked?: boolean;
-    defaultChecked?: boolean;
+    accessor checked: boolean | undefined;
+    accessor defaultChecked: boolean | undefined;
+    accessor icon: string | undefined;
+    accessor iconChecked: string | undefined;
+    accessor iconPlacement: SwitchIconPlacement | undefined;
     protected static styles: string[];
     protected getValue(): boolean;
     protected writeValue(checked: boolean): void;
-    protected getEventPayload(checked: boolean, oldChecked: boolean, action: any): {
+    protected getEventPayload(checked: boolean, oldChecked: boolean, action: FieldAction): {
         checked: boolean;
         oldChecked: boolean;
-        action: any;
+        action: FieldAction;
     };
     protected setValue(checked: boolean, options?: {
         silent?: boolean;
-        action?: any;
+        action?: FieldAction;
     }): void;
     reset(checked?: boolean, options?: {
         silent?: boolean;

package/dist/types/text-input/text-input.d.ts

@@ -8,10 +8,6 @@ declare class TextInput extends AeicoField {
     type?: string;
     protected static styles: string[];
     render(): import("aeico-view").RenderResult;
-    /**
-     * Update clear button visibility based on input value
-     */
-    private updateClearButtonVisibility;
     /**
      * Write value to the input element (DOM only)
      */

package/dist/types/textarea/index.d.ts

@@ -0,0 +1 @@
+export { default, type TextareaProps, type TextareaResize } from './textarea';

package/dist/types/textarea/textarea.d.ts

@@ -0,0 +1,26 @@
+import AeicoField from '../aeico-field';
+import type { InferProps } from 'aeico';
+export type TextareaResize = 'none' | 'vertical' | 'horizontal' | 'both';
+declare class Textarea extends AeicoField {
+    protected fieldElement: HTMLTextAreaElement | null;
+    static tagName: string;
+    accessor placeholder: string | undefined;
+    accessor rows: number | undefined;
+    accessor maxlength: number | undefined;
+    accessor minlength: number | undefined;
+    accessor resize: TextareaResize | undefined;
+    accessor autoResize: boolean;
+    protected static styles: string[];
+    private readonly _boundOnInput;
+    render(): import("aeico-view").RenderResult;
+    private _syncAutoResize;
+    private _updateClearButtonVisibility;
+    protected writeValue(value: string): void;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'ae-textarea': Textarea;
+    }
+}
+export default Textarea;
+export type TextareaProps = InferProps<typeof Textarea>;

package/dist/types/tooltip/defines.d.ts

@@ -0,0 +1,2 @@
+export type TooltipPlacement = 'top' | 'top-start' | 'top-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'right';
+export type TooltipTrigger = 'hover' | 'click';

package/dist/types/tooltip/index.d.ts

@@ -0,0 +1,4 @@
+export { default } from './tooltip';
+export { default as Tooltip } from './tooltip';
+export type { TooltipProps } from './tooltip';
+export type { TooltipPlacement, TooltipTrigger } from './defines';

package/dist/types/tooltip/tooltip.d.ts

@@ -0,0 +1,48 @@
+import type { InferProps } from 'aeico';
+import AeicoComponent from '../aeico-component';
+import type { TooltipPlacement, TooltipTrigger } from './defines';
+/**
+ * Tooltip Component
+ *
+ * A floating label that appears on hover or focus around its trigger content.
+ * Wrap any element in `<ae-tooltip>` and provide content via the `content`
+ * attribute (plain text) or the `tooltip` named slot (rich HTML).
+ *
+ * @example
+ * ```html
+ * <ae-tooltip content="Save file">
+ *   <ae-button>Save</ae-button>
+ * </ae-tooltip>
+ *
+ * <ae-tooltip placement="bottom-start">
+ *   <span slot="tooltip"><strong>Bold</strong> tip</span>
+ *   <ae-icon-button name="info"></ae-icon-button>
+ * </ae-tooltip>
+ * ```
+ */
+declare class Tooltip extends AeicoComponent {
+    protected static styles: string[];
+    accessor content: string | undefined;
+    accessor placement: TooltipPlacement;
+    accessor disabled: boolean;
+    accessor trigger: TooltipTrigger;
+    accessor open: boolean;
+    private _outsideClickHandler;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    private _handleMouseEnter;
+    private _handleMouseLeave;
+    private _handleFocusin;
+    private _handleFocusout;
+    private _handleClick;
+    private _updatePosition;
+    protected onUpdated(changedProps: Map<string, unknown>): void;
+    protected render(): import("aeico-view").RenderResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'ae-tooltip': Tooltip;
+    }
+}
+export type TooltipProps = InferProps<typeof Tooltip>;
+export default Tooltip;

package/dist/types/tree/defines.d.ts

@@ -0,0 +1,23 @@
+/** Minimal interface used by tree-item to read config from its parent ae-tree. */
+export interface ParentTreeLike extends Element {
+    checkable?: boolean;
+    multiple?: boolean;
+    showLine?: boolean;
+    defaultExpandAll?: boolean;
+    icon?: string;
+}
+export interface TreeSelectDetail {
+    key: string;
+    selected: boolean;
+    selectedKeys: string[];
+}
+export interface TreeExpandDetail {
+    key: string;
+    expanded: boolean;
+    expandedKeys: string[];
+}
+export interface TreeCheckDetail {
+    key: string;
+    checked: boolean;
+    checkedKeys: string[];
+}

package/dist/types/tree/index.d.ts

@@ -0,0 +1,5 @@
+export { default as Tree } from './tree';
+export { default as TreeItem } from './tree-item';
+export type { TreeProps } from './tree';
+export type { TreeItemProps } from './tree-item';
+export type { TreeSelectDetail, TreeExpandDetail, TreeCheckDetail } from './defines';

package/dist/types/tree/tree-item.d.ts

@@ -0,0 +1,54 @@
+import AeicoComponent from '../aeico-component';
+import type { InferProps } from 'aeico';
+import '../icon';
+/**
+ * Tree item — used as a direct child of `<ae-tree>` or nested inside another
+ * `<ae-tree-item>` to create a multi-level tree.
+ *
+ * - **Parent item**: nest `<ae-tree-item>` children inside; an expand toggle is shown.
+ * - **Leaf item**: no `<ae-tree-item>` children; no expand toggle is shown.
+ *
+ * @prop {string}  key          - Unique identifier for this item.
+ * @prop {string}  icon         - Icon name (uses `<ae-icon>`). Optional.
+ * @prop {boolean} disabled     - Disables interaction.
+ * @prop {boolean} expanded     - Whether children are visible.
+ * @prop {boolean} selected     - Whether this item is visually selected.
+ * @prop {boolean} checked      - Checkbox state (checkable mode).
+ * @prop {boolean} indeterminate - Checkbox partial state (checkable mode, JS-only).
+ *
+ * @slot default - Child `<ae-tree-item>` elements.
+ * @slot label   - Custom label content (falls back to the `label` attribute text).
+ */
+declare class TreeItem extends AeicoComponent {
+    static tagName: string;
+    protected static styles: string[];
+    accessor key: string | undefined;
+    accessor icon: string | undefined;
+    /** Stable auto-generated key used when `key` prop is not set. */
+    private readonly _autoKey;
+    private get _effectiveKey();
+    accessor disabled: boolean;
+    accessor expanded: boolean;
+    accessor selected: boolean;
+    accessor checked: boolean;
+    accessor indeterminate: boolean;
+    private _checkboxEl;
+    connectedCallback(): void;
+    protected onMounted(): void;
+    private get _parentTree();
+    private get _isCheckable();
+    private get _hasChildren();
+    private _handleExpandClick;
+    private _handleLabelClick;
+    private _handleCheckChange;
+    private _handleKeydown;
+    protected onUpdated(): void;
+    protected render(): import("aeico-view").RenderResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'ae-tree-item': TreeItem;
+    }
+}
+export default TreeItem;
+export type TreeItemProps = InferProps<typeof TreeItem>;

package/dist/types/tree/tree.d.ts

@@ -0,0 +1,64 @@
+import AeicoComponent from '../aeico-component';
+import type { InferProps } from 'aeico';
+import './tree-item';
+/**
+ * Tree component. Renders a hierarchical tree of `<ae-tree-item>` elements.
+ *
+ * @prop {boolean} checkable       - Enable checkbox selection mode with parent-child sync.
+ * @prop {boolean} multiple        - Allow multi-select (click to toggle). Ignored when checkable.
+ * @prop {boolean} showLine        - Show dashed connecting lines between items.
+ * @prop {boolean} defaultExpandAll - Expand all items on initial connect.
+ * @prop {string}  selectedKey     - Currently selected key (single-select convenience prop).
+ *
+ * @property {string[]} selectedKeys - Currently selected keys (multi-select).
+ * @property {string[]} checkedKeys  - Currently checked keys (checkable mode).
+ * @property {string[]} expandedKeys - Currently expanded keys.
+ *
+ * @event {CustomEvent<TreeSelectDetail>} select - Fires when an item is selected/deselected.
+ * @event {CustomEvent<TreeExpandDetail>} expand - Fires when an item is expanded/collapsed.
+ * @event {CustomEvent<TreeCheckDetail>}  check  - Fires when an item checkbox changes.
+ *
+ * @example
+ * ```html
+ * <ae-tree>
+ *   <ae-tree-item key="1" label="Parent">
+ *     <ae-tree-item key="1-1" label="Child A"></ae-tree-item>
+ *     <ae-tree-item key="1-2" label="Child B"></ae-tree-item>
+ *   </ae-tree-item>
+ * </ae-tree>
+ * ```
+ */
+declare class Tree extends AeicoComponent {
+    static tagName: string;
+    protected static styles: string[];
+    accessor checkable: boolean;
+    accessor multiple: boolean;
+    accessor showLine: boolean;
+    accessor defaultExpandAll: boolean;
+    accessor selectedKey: string | undefined;
+    /** Icon name used for the expand/collapse toggle on all items (overridable per item). */
+    accessor icon: string | undefined;
+    /** Currently selected keys (multi-select). Set programmatically. */
+    selectedKeys: string[];
+    /** Currently checked keys (checkable mode). Set programmatically. */
+    checkedKeys: string[];
+    /** Currently expanded keys. Set programmatically. */
+    expandedKeys: string[];
+    connectedCallback(): void;
+    private _getAllItems;
+    private _getDirectChildren;
+    private _computeCheckedKeys;
+    private _handleItemToggleExpand;
+    private _handleItemSelect;
+    private _handleItemCheck;
+    private _setCheckedRecursive;
+    private _syncAncestors;
+    protected render(): import("aeico-view").RenderResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'ae-tree': Tree;
+    }
+}
+export default Tree;
+export type TreeProps = InferProps<typeof Tree>;