@m3e/web 2.3.2 → 2.4.0

package/dist/src/tree/TreeItemElement.d.ts

@@ -0,0 +1,131 @@
+import { CSSResultGroup, LitElement, PropertyValues } from "lit";
+import { M3eFocusRingElement, M3eRippleElement, M3eStateLayerElement } from "@m3e/web/core";
+declare const M3eTreeItemElement_base: import("../core/shared/mixins/Constructor").Constructor<import("@m3e/web/core").SelectedMixin> & import("../core/shared/mixins/Constructor").Constructor<import("@m3e/web/core").DisabledMixin> & import("../core/shared/mixins/Constructor").Constructor<import("@m3e/web/core").AttachInternalsMixin> & import("../core/shared/mixins/Constructor").Constructor & typeof LitElement;
+/**
+ * An expandable item in a tree.
+ *
+ * @description
+ * The `m3e-tree-item` component represents a single item within an `m3e-tree`.
+ * It supports nested child items, expand/collapse behavior, selection,
+ * disabled state, and interaction styling. Items may contain a child group
+ * that hosts additional `m3e-tree-item` elements.
+ *
+ * @tag m3e-tree-item
+ *
+ * @slot - Renders the nested child items.
+ * @slot label - Renders the label of the item.
+ * @slot icon - Renders the icon of the item.
+ * @slot selected-icon - Renders the icon of the item when selected.
+ * @slot toggle-icon - Renders the toggle icon.
+ * @slot open-toggle-icon - Renders the toggle icon when selected.
+ *
+ * @attr disabled - Whether the element is disabled.
+ * @attr indeterminate - Whether the element's checked state is indeterminate.
+ * @attr open - Whether the item is expanded.
+ * @attr selected - Whether the item is selected.
+ *
+ * @fires opening - Emitted when the item begins to open.
+ * @fires opened - Emitted when the item has opened.
+ * @fires closing - Emitted when the item begins to close.
+ * @fires closed - Emitted when the item has closed.
+ * @fires click - Emitted when the element is clicked.
+ *
+ * @cssprop --m3e-tree-item-font-size - Font size for the item label.
+ * @cssprop --m3e-tree-item-font-weight - Font weight for the item label.
+ * @cssprop --m3e-tree-item-line-height - Line height for the item label.
+ * @cssprop --m3e-tree-item-tracking - Letter spacing for the item label.
+ * @cssprop --m3e-tree-item-padding - Inline padding for the item.
+ * @cssprop --m3e-tree-item-height - Height of the item.
+ * @cssprop --m3e-tree-item-shape - Border radius of the item and focus ring.
+ * @cssprop --m3e-tree-item-icon-size - Size of the icon.
+ * @cssprop --m3e-tree-item-inset - Indentation for nested items.
+ * @cssprop --m3e-tree-item-label-color - Text color for the item label.
+ * @cssprop --m3e-tree-item-selected-label-color - Text color for selected item label.
+ * @cssprop --m3e-tree-item-selected-container-color - Background color for selected item.
+ * @cssprop --m3e-tree-item-selected-container-focus-color - Focus color for selected item container.
+ * @cssprop --m3e-tree-item-selected-container-hover-color - Hover color for selected item container.
+ * @cssprop --m3e-tree-item-selected-ripple-color - Ripple color for selected item.
+ * @cssprop --m3e-tree-item-unselected-container-focus-color - Focus color for unselected item container.
+ * @cssprop --m3e-tree-item-unselected-container-hover-color - Hover color for unselected item container.
+ * @cssprop --m3e-tree-item-unselected-ripple-color - Ripple color for unselected item.
+ * @cssprop --m3e-tree-item-disabled-color - Text color for disabled item.
+ * @cssprop --m3e-tree-item-disabled-color-opacity - Opacity for disabled item text color.
+ */
+export declare class M3eTreeItemElement extends M3eTreeItemElement_base {
+    #private;
+    /** The styles of the element. */
+    static styles: CSSResultGroup;
+    /** @internal */ readonly stateLayer?: M3eStateLayerElement;
+    /** @internal */ readonly focusRing?: M3eFocusRingElement;
+    /** @internal */ readonly ripple?: M3eRippleElement;
+    /** @private */ private readonly _base?;
+    /** @private */ private _hasChildItems;
+    /** @private */ private _multi;
+    /**
+     * Whether the item is expanded.
+     * @default false
+     */
+    open: boolean;
+    /**
+     * A value indicating whether the element's selected / checked state is indeterminate.
+     * @default false
+     */
+    indeterminate: boolean;
+    /** A reference to the nested `HTMLAnchorElement`. */
+    get link(): HTMLAnchorElement | null;
+    /** A reference to the element used to present the label of the item. */
+    get label(): HTMLElement | null;
+    /** Whether the item is visible. */
+    get visible(): boolean;
+    /** The full path of the item, starting with the top-most ancestor, including this item. */
+    get path(): ReadonlyArray<M3eTreeItemElement>;
+    /** Whether the item has child items. */
+    get hasChildItems(): boolean;
+    /** The parenting item. */
+    get parentItem(): M3eTreeItemElement | null;
+    /** The items that immediately descend from this item. */
+    get childItems(): readonly M3eTreeItemElement[];
+    /** The one-based level of the item. */
+    get level(): number;
+    /**
+     * Expands this item, and optionally, all descendants.
+     * @param {boolean} [descendants=false] Whether to expand all descendants.
+     */
+    expand(descendants?: boolean): void;
+    /**
+     * Collapses this item, and optionally, all descendants.
+     * @param {boolean} [descendants=false] Whether to collapse all descendants.
+     */
+    collapse(descendants?: boolean): void;
+    /** Toggles the expanded state of the item. */
+    toggle(): void;
+    /** @inheritdoc */
+    connectedCallback(): void;
+    /** @inheritdoc */
+    disconnectedCallback(): void;
+    /** @inheritdoc */
+    protected update(changedProperties: PropertyValues): void;
+    /** @inheritdoc */
+    protected firstUpdated(_changedProperties: PropertyValues<this>): void;
+    /** @inheritdoc */
+    protected render(): unknown;
+}
+interface M3eTreeItemElementEventMap extends HTMLElementEventMap {
+    opening: Event;
+    opened: Event;
+    closing: Event;
+    closed: Event;
+}
+export interface M3eTreeItemElement {
+    addEventListener<K extends keyof M3eTreeItemElementEventMap>(type: K, listener: (this: M3eTreeItemElement, ev: M3eTreeItemElementEventMap[K]) => void, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof M3eTreeItemElementEventMap>(type: K, listener: (this: M3eTreeItemElement, ev: M3eTreeItemElementEventMap[K]) => void, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "m3e-tree-item": M3eTreeItemElement;
+    }
+}
+export {};
+//# sourceMappingURL=TreeItemElement.d.ts.map

package/dist/src/tree/TreeItemElement.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TreeItemElement.d.ts","sourceRoot":"","sources":["../../../src/tree/TreeItemElement.ts"],"names":[],"mappings":"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"}

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

@@ -0,0 +1,3 @@
+export * from "./TreeElement";
+export * from "./TreeItemElement";
+//# sourceMappingURL=index.d.ts.map

package/dist/src/tree/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/tree/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,mBAAmB,CAAC"}