@api-client/ui 0.0.14 → 0.0.17

package/build/src/md/chip/internals/Chip.styles.js

@@ -0,0 +1,171 @@
+import { css } from 'lit';
+export default css `
+  :host {
+    display: inline-block;
+    vertical-align: middle;
+    outline: none;
+    -webkit-tap-highlight-color: transparent;
+    height: 32px;
+
+    font-family: var(--md-sys-typescale-label-large-font);
+    font-size: var(--md-sys-typescale-label-large-size);
+    letter-spacing: var(--md-sys-typescale-label-large-tracking);
+    line-height: var(--md-sys-typescale-label-large-height);
+
+    border-radius: var(--md-sys-shape-corner-small);
+    color: var(--md-sys-color-on-surface);
+    fill: var(--md-sys-color-primary);
+
+    user-select: none;
+
+    --md-ripple-hover-state-layer-color: var(--md-sys-color-on-surface);
+    --md-ripple-focus-state-layer-color: var(--md-sys-color-on-surface);
+    --md-ripple-pressed-state-layer-color: var(--md-sys-color-primary);
+  }
+
+  :host([disabled]) {
+    pointer-events: none;
+  }
+
+  :host([disabled]) .container {
+    border-color: var(--md-sys-color-on-surface);
+    opacity: 0.12;
+  }
+
+  :host([disabled][elevated]) .container {
+    background-color: var(--md-sys-color-on-surface);
+    opacity: 0.12;
+    box-shadow: none;
+  }
+
+  :host([disabled]) .content {
+    color: var(--md-sys-color-on-surface);
+    opacity: 0.68;
+  }
+
+  .surface {
+    position: relative;
+    height: inherit;
+    border-radius: inherit;
+  }
+
+  .ripple {
+    z-index: 0;
+    border-radius: inherit;
+  }
+
+  .container {
+    position: absolute;
+    inset: 0;
+
+    box-sizing: border-box;
+    border-radius: inherit;
+    border: 1px var(--md-sys-color-outline) solid;
+    z-index: 0;
+  }
+
+  .content {
+    height: inherit;
+    display: flex;
+    align-items: center;
+    justify-content: start;
+    box-sizing: border-box;
+    padding: 0 16px;
+    border-radius: inherit;
+    border: 1px transparent solid;
+    position: relative;
+    z-index: 1;
+  }
+
+  :host([elevated]) .container {
+    background-color: var(--md-sys-color-surface);
+    box-shadow: var(--md-sys-elevation-1);
+    border-width: 0;
+  }
+
+  .withIcon .content,
+  :host([type='filter'][checked]) .content {
+    padding-left: 8px;
+  }
+
+  .withAvatar .content {
+    padding-left: 4px;
+  }
+
+  :host([closable]) .content,
+  :host([type='filter'][list]) .content {
+    padding-right: 8px;
+  }
+
+  .withIcon slot[name='icon']::slotted(*),
+  .withAvatar slot[name='avatar']::slotted(*) {
+    margin-right: 8px;
+  }
+
+  slot[name='icon']::slotted(*) {
+    width: 16px;
+    height: 16px;
+  }
+
+  slot[name='avatar']::slotted(*) {
+    width: 24px;
+    height: 24px;
+    border-radius: var(--md-sys-shape-corner-medium);
+  }
+
+  .leading-icon {
+    height: 18px;
+    width: 0px;
+    overflow: hidden;
+    transition: width 230ms var(--md-sys-animation-easing-standard);
+  }
+
+  .check-mark.checked {
+    width: 18px;
+    margin-right: 8px;
+  }
+
+  .trailing-icon {
+    margin-left: 8px;
+    width: 18px;
+    height: 18px;
+    fill: var(--md-sys-color-on-surface-variant);
+  }
+
+  :host([elevated]:hover) .container,
+  :host([elevated]:focus) .container {
+    box-shadow: var(--md-sys-elevation-2);
+  }
+
+  :host([elevated][dragged]) .container {
+    box-shadow: var(--md-sys-elevation-4);
+  }
+
+  :host([checked]) .container {
+    background-color: var(--md-sys-color-secondary-container);
+    border-width: 0;
+  }
+
+  :host([type='filter']),
+  :host([type='filter']) .leading-icon {
+    color: var(--md-sys-color-on-surface-variant);
+    fill: var(--md-sys-color-on-surface-variant);
+  }
+
+  :host([type='filter'][checked]),
+  :host([type='filter'][checked]) .leading-icon {
+    color: var(--md-sys-color-on-secondary-container);
+  }
+
+  :host([type='input']) .container {
+    background-color: var(--md-sys-color-surface);
+    color: var(--md-sys-color-on-surface-variant);
+  }
+
+  :host([type='input']) .leading-icon,
+  :host([type='input']) .trailing-icon {
+    color: var(--md-sys-color-on-surface-variant);
+    fill: var(--md-sys-color-on-surface-variant);
+  }
+`;
+//# sourceMappingURL=Chip.styles.js.map

package/build/src/md/chip/internals/Chip.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Chip.styles.js","sourceRoot":"","sources":["../../../../../src/md/chip/internals/Chip.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,eAAe,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAwKjB,CAAA","sourcesContent":["import { css } from 'lit'\n\nexport default css`\n  :host {\n    display: inline-block;\n    vertical-align: middle;\n    outline: none;\n    -webkit-tap-highlight-color: transparent;\n    height: 32px;\n\n    font-family: var(--md-sys-typescale-label-large-font);\n    font-size: var(--md-sys-typescale-label-large-size);\n    letter-spacing: var(--md-sys-typescale-label-large-tracking);\n    line-height: var(--md-sys-typescale-label-large-height);\n\n    border-radius: var(--md-sys-shape-corner-small);\n    color: var(--md-sys-color-on-surface);\n    fill: var(--md-sys-color-primary);\n\n    user-select: none;\n\n    --md-ripple-hover-state-layer-color: var(--md-sys-color-on-surface);\n    --md-ripple-focus-state-layer-color: var(--md-sys-color-on-surface);\n    --md-ripple-pressed-state-layer-color: var(--md-sys-color-primary);\n  }\n\n  :host([disabled]) {\n    pointer-events: none;\n  }\n\n  :host([disabled]) .container {\n    border-color: var(--md-sys-color-on-surface);\n    opacity: 0.12;\n  }\n\n  :host([disabled][elevated]) .container {\n    background-color: var(--md-sys-color-on-surface);\n    opacity: 0.12;\n    box-shadow: none;\n  }\n\n  :host([disabled]) .content {\n    color: var(--md-sys-color-on-surface);\n    opacity: 0.68;\n  }\n\n  .surface {\n    position: relative;\n    height: inherit;\n    border-radius: inherit;\n  }\n\n  .ripple {\n    z-index: 0;\n    border-radius: inherit;\n  }\n\n  .container {\n    position: absolute;\n    inset: 0;\n\n    box-sizing: border-box;\n    border-radius: inherit;\n    border: 1px var(--md-sys-color-outline) solid;\n    z-index: 0;\n  }\n\n  .content {\n    height: inherit;\n    display: flex;\n    align-items: center;\n    justify-content: start;\n    box-sizing: border-box;\n    padding: 0 16px;\n    border-radius: inherit;\n    border: 1px transparent solid;\n    position: relative;\n    z-index: 1;\n  }\n\n  :host([elevated]) .container {\n    background-color: var(--md-sys-color-surface);\n    box-shadow: var(--md-sys-elevation-1);\n    border-width: 0;\n  }\n\n  .withIcon .content,\n  :host([type='filter'][checked]) .content {\n    padding-left: 8px;\n  }\n\n  .withAvatar .content {\n    padding-left: 4px;\n  }\n\n  :host([closable]) .content,\n  :host([type='filter'][list]) .content {\n    padding-right: 8px;\n  }\n\n  .withIcon slot[name='icon']::slotted(*),\n  .withAvatar slot[name='avatar']::slotted(*) {\n    margin-right: 8px;\n  }\n\n  slot[name='icon']::slotted(*) {\n    width: 16px;\n    height: 16px;\n  }\n\n  slot[name='avatar']::slotted(*) {\n    width: 24px;\n    height: 24px;\n    border-radius: var(--md-sys-shape-corner-medium);\n  }\n\n  .leading-icon {\n    height: 18px;\n    width: 0px;\n    overflow: hidden;\n    transition: width 230ms var(--md-sys-animation-easing-standard);\n  }\n\n  .check-mark.checked {\n    width: 18px;\n    margin-right: 8px;\n  }\n\n  .trailing-icon {\n    margin-left: 8px;\n    width: 18px;\n    height: 18px;\n    fill: var(--md-sys-color-on-surface-variant);\n  }\n\n  :host([elevated]:hover) .container,\n  :host([elevated]:focus) .container {\n    box-shadow: var(--md-sys-elevation-2);\n  }\n\n  :host([elevated][dragged]) .container {\n    box-shadow: var(--md-sys-elevation-4);\n  }\n\n  :host([checked]) .container {\n    background-color: var(--md-sys-color-secondary-container);\n    border-width: 0;\n  }\n\n  :host([type='filter']),\n  :host([type='filter']) .leading-icon {\n    color: var(--md-sys-color-on-surface-variant);\n    fill: var(--md-sys-color-on-surface-variant);\n  }\n\n  :host([type='filter'][checked]),\n  :host([type='filter'][checked]) .leading-icon {\n    color: var(--md-sys-color-on-secondary-container);\n  }\n\n  :host([type='input']) .container {\n    background-color: var(--md-sys-color-surface);\n    color: var(--md-sys-color-on-surface-variant);\n  }\n\n  :host([type='input']) .leading-icon,\n  :host([type='input']) .trailing-icon {\n    color: var(--md-sys-color-on-surface-variant);\n    fill: var(--md-sys-color-on-surface-variant);\n  }\n`\n"]}

package/build/src/md/chip/ui-chip.d.ts

@@ -0,0 +1,11 @@
+import type { CSSResultOrNative } from 'lit';
+import Element from './internals/Chip.js';
+export declare class UiChipElement extends Element {
+    static styles: CSSResultOrNative[];
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'ui-chip': UiChipElement;
+    }
+}
+//# sourceMappingURL=ui-chip.d.ts.map

package/build/src/md/chip/ui-chip.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ui-chip.d.ts","sourceRoot":"","sources":["../../../../src/md/chip/ui-chip.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,KAAK,CAAA;AAE5C,OAAO,OAAO,MAAM,qBAAqB,CAAA;AAGzC,qBACa,aAAc,SAAQ,OAAO;IACxC,OAAgB,MAAM,EAAE,iBAAiB,EAAE,CAAW;CACvD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,SAAS,EAAE,aAAa,CAAA;KACzB;CACF"}

package/build/src/md/chip/ui-chip.js

@@ -0,0 +1,27 @@
+import { __esDecorate, __runInitializers } from "tslib";
+import { customElement } from 'lit/decorators.js';
+import Element from './internals/Chip.js';
+import styles from './internals/Chip.styles.js';
+let UiChipElement = (() => {
+    let _classDecorators = [customElement('ui-chip')];
+    let _classDescriptor;
+    let _classExtraInitializers = [];
+    let _classThis;
+    let _classSuper = Element;
+    var UiChipElement = class extends _classSuper {
+        static { _classThis = this; }
+        static {
+            const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
+            __esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
+            UiChipElement = _classThis = _classDescriptor.value;
+            if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
+        }
+        static styles = [styles];
+        static {
+            __runInitializers(_classThis, _classExtraInitializers);
+        }
+    };
+    return UiChipElement = _classThis;
+})();
+export { UiChipElement };
+//# sourceMappingURL=ui-chip.js.map

package/build/src/md/chip/ui-chip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ui-chip.js","sourceRoot":"","sources":["../../../../src/md/chip/ui-chip.ts"],"names":[],"mappings":";AACA,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAA;AACjD,OAAO,OAAO,MAAM,qBAAqB,CAAA;AACzC,OAAO,MAAM,MAAM,4BAA4B,CAAA;IAGlC,aAAa;4BADzB,aAAa,CAAC,SAAS,CAAC;;;;sBACU,OAAO;6BAAf,SAAQ,WAAO;;;;YAA1C,6KAEC;;;;QADC,MAAM,CAAU,MAAM,GAAwB,CAAC,MAAM,CAAC,CAAA;;YAD3C,uDAAa;;;;;SAAb,aAAa","sourcesContent":["import type { CSSResultOrNative } from 'lit'\nimport { customElement } from 'lit/decorators.js'\nimport Element from './internals/Chip.js'\nimport styles from './internals/Chip.styles.js'\n\n@customElement('ui-chip')\nexport class UiChipElement extends Element {\n  static override styles: CSSResultOrNative[] = [styles]\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'ui-chip': UiChipElement\n  }\n}\n"]}

package/build/src/md/collapse/internals/Collapse.d.ts

@@ -0,0 +1,76 @@
+import { PropertyValues, TemplateResult } from 'lit';
+import { UiElement } from '../../UiElement.js';
+/**
+ * @fires transitioning - When the element is transitioning.
+ * @slot - Main slot for the content
+ */
+export default class UiCollapse extends UiElement {
+    /**
+     * Whether the chip is disabled. The user can't interact with the chip when `true`.
+     * @attribute
+     */
+    accessor disabled: boolean;
+    /**
+     * Set noAnimation to true to disable animations.
+     * @attr
+     */
+    accessor noAnimation: boolean | undefined;
+    /**
+     * Renders the collapse horizontally when true and vertically otherwise
+     * @attribute
+     */
+    accessor horizontal: boolean;
+    /**
+     * Set opened to true to show the collapse element and to false to hide it.
+     * @attribute
+     */
+    accessor open: boolean;
+    get dimension(): 'width' | 'height';
+    /**
+     * `maxWidth` or `maxHeight`.
+     * @private
+     */
+    get dimensionMax(): 'maxWidth' | 'maxHeight';
+    /**
+     * `max-width` or `max-height`.
+     * @private
+     */
+    get dimensionMaxCss(): 'max-width' | 'max-height';
+    get isAttached(): boolean;
+    protected transitioningInternal: boolean;
+    /**
+     * @return When true, the element is transitioning its open state. When false,
+     * the element has finished opening/closing.
+     */
+    get transitioning(): boolean;
+    /**
+     * Stores the desired size of the collapse body.
+     */
+    protected desiredSize: string;
+    constructor();
+    connectedCallback(): void;
+    protected willUpdate(cp: PropertyValues<this>): void;
+    /**
+     * Toggle the opened state.
+     */
+    toggle(): void;
+    /**
+     * Updates the size of the element.
+     * @param size The new value for `maxWidth`/`maxHeight` as css property value, usually `auto` or `0px`.
+     * @param animated if `true` updates the size with an animation, otherwise without.
+     */
+    protected updateSize(size: string, animated?: boolean): void;
+    protected updateTransition(enabled?: boolean): void;
+    /**
+     * Calculates the size of the element when opened.
+     */
+    protected calcSize(): string;
+    protected transitionEnd(): void;
+    protected notifyResize(): void;
+    protected notifyTransitioning(): void;
+    protected handleTransitionEnd(e: Event): void;
+    protected handleOpenChange(): void;
+    protected handleHorizontalChange(): void;
+    render(): TemplateResult;
+}
+//# sourceMappingURL=Collapse.d.ts.map

package/build/src/md/collapse/internals/Collapse.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Collapse.d.ts","sourceRoot":"","sources":["../../../../../src/md/collapse/internals/Collapse.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAA;AAE1D,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAA;AAG9C;;;GAGG;AACH,MAAM,CAAC,OAAO,OAAO,UAAW,SAAQ,SAAS;IAC/C;;;OAGG;IACyC,QAAQ,CAAC,QAAQ,UAAQ;IAErE;;;OAGG;IACyC,QAAQ,CAAC,WAAW,EAAE,OAAO,GAAG,SAAS,CAAA;IAErF;;;OAGG;IAC0B,QAAQ,CAAC,UAAU,UAAQ;IAExD;;;OAGG;IACyC,QAAQ,CAAC,IAAI,UAAQ;IAEjE,IAAI,SAAS,IAAI,OAAO,GAAG,QAAQ,CAElC;IAED;;;OAGG;IACH,IAAI,YAAY,IAAI,UAAU,GAAG,WAAW,CAE3C;IAED;;;OAGG;IACH,IAAI,eAAe,IAAI,WAAW,GAAG,YAAY,CAEhD;IAED,IAAI,UAAU,IAAI,OAAO,CAExB;IAED,SAAS,CAAC,qBAAqB,UAAQ;IAEvC;;;OAGG;IACH,IAAI,aAAa,IAAI,OAAO,CAE3B;IAED;;OAEG;IACH,SAAS,CAAC,WAAW,SAAK;;IAOjB,iBAAiB,IAAI,IAAI;cAUf,UAAU,CAAC,EAAE,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAa7D;;OAEG;IACH,MAAM,IAAI,IAAI;IAKd;;;;OAIG;IACH,SAAS,CAAC,UAAU,CAAC,IAAI,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,OAAO,GAAG,IAAI;IAwC5D,SAAS,CAAC,gBAAgB,CAAC,OAAO,CAAC,EAAE,OAAO,GAAG,IAAI;IAInD;;OAEG;IACH,SAAS,CAAC,QAAQ,IAAI,MAAM;IAK5B,SAAS,CAAC,aAAa,IAAI,IAAI;IAU/B,SAAS,CAAC,YAAY,IAAI,IAAI;IAI9B,SAAS,CAAC,mBAAmB,IAAI,IAAI;IAIrC,SAAS,CAAC,mBAAmB,CAAC,CAAC,EAAE,KAAK,GAAG,IAAI;IAO7C,SAAS,CAAC,gBAAgB,IAAI,IAAI;IAelC,SAAS,CAAC,sBAAsB,IAAI,IAAI;IAO/B,MAAM,IAAI,cAAc;CAGlC"}

package/build/src/md/collapse/internals/Collapse.js

@@ -0,0 +1,235 @@
+import { __esDecorate, __runInitializers } from "tslib";
+import { html } from 'lit';
+import { property } from 'lit/decorators.js';
+import { UiElement } from '../../UiElement.js';
+import { setDisabled } from '../../../lib/disabled.js';
+let UiCollapse = (() => {
+    let _classSuper = UiElement;
+    let _disabled_decorators;
+    let _disabled_initializers = [];
+    let _disabled_extraInitializers = [];
+    let _noAnimation_decorators;
+    let _noAnimation_initializers = [];
+    let _noAnimation_extraInitializers = [];
+    let _horizontal_decorators;
+    let _horizontal_initializers = [];
+    let _horizontal_extraInitializers = [];
+    let _open_decorators;
+    let _open_initializers = [];
+    let _open_extraInitializers = [];
+    return class UiCollapse extends _classSuper {
+        static {
+            const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
+            _disabled_decorators = [property({ type: Boolean, reflect: true })];
+            _noAnimation_decorators = [property({ type: Boolean, reflect: true })];
+            _horizontal_decorators = [property({ type: Boolean })];
+            _open_decorators = [property({ type: Boolean, reflect: true })];
+            __esDecorate(this, null, _disabled_decorators, { kind: "accessor", name: "disabled", static: false, private: false, access: { has: obj => "disabled" in obj, get: obj => obj.disabled, set: (obj, value) => { obj.disabled = value; } }, metadata: _metadata }, _disabled_initializers, _disabled_extraInitializers);
+            __esDecorate(this, null, _noAnimation_decorators, { kind: "accessor", name: "noAnimation", static: false, private: false, access: { has: obj => "noAnimation" in obj, get: obj => obj.noAnimation, set: (obj, value) => { obj.noAnimation = value; } }, metadata: _metadata }, _noAnimation_initializers, _noAnimation_extraInitializers);
+            __esDecorate(this, null, _horizontal_decorators, { kind: "accessor", name: "horizontal", static: false, private: false, access: { has: obj => "horizontal" in obj, get: obj => obj.horizontal, set: (obj, value) => { obj.horizontal = value; } }, metadata: _metadata }, _horizontal_initializers, _horizontal_extraInitializers);
+            __esDecorate(this, null, _open_decorators, { kind: "accessor", name: "open", static: false, private: false, access: { has: obj => "open" in obj, get: obj => obj.open, set: (obj, value) => { obj.open = value; } }, metadata: _metadata }, _open_initializers, _open_extraInitializers);
+            if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
+        }
+        #disabled_accessor_storage = __runInitializers(this, _disabled_initializers, false
+        /**
+         * Set noAnimation to true to disable animations.
+         * @attr
+         */
+        );
+        /**
+         * Whether the chip is disabled. The user can't interact with the chip when `true`.
+         * @attribute
+         */
+        get disabled() { return this.#disabled_accessor_storage; }
+        set disabled(value) { this.#disabled_accessor_storage = value; }
+        #noAnimation_accessor_storage = (__runInitializers(this, _disabled_extraInitializers), __runInitializers(this, _noAnimation_initializers, void 0));
+        /**
+         * Set noAnimation to true to disable animations.
+         * @attr
+         */
+        get noAnimation() { return this.#noAnimation_accessor_storage; }
+        set noAnimation(value) { this.#noAnimation_accessor_storage = value; }
+        #horizontal_accessor_storage = (__runInitializers(this, _noAnimation_extraInitializers), __runInitializers(this, _horizontal_initializers, false
+        /**
+         * Set opened to true to show the collapse element and to false to hide it.
+         * @attribute
+         */
+        ));
+        /**
+         * Renders the collapse horizontally when true and vertically otherwise
+         * @attribute
+         */
+        get horizontal() { return this.#horizontal_accessor_storage; }
+        set horizontal(value) { this.#horizontal_accessor_storage = value; }
+        #open_accessor_storage = (__runInitializers(this, _horizontal_extraInitializers), __runInitializers(this, _open_initializers, false));
+        /**
+         * Set opened to true to show the collapse element and to false to hide it.
+         * @attribute
+         */
+        get open() { return this.#open_accessor_storage; }
+        set open(value) { this.#open_accessor_storage = value; }
+        get dimension() {
+            return this.horizontal ? 'width' : 'height';
+        }
+        /**
+         * `maxWidth` or `maxHeight`.
+         * @private
+         */
+        get dimensionMax() {
+            return this.horizontal ? 'maxWidth' : 'maxHeight';
+        }
+        /**
+         * `max-width` or `max-height`.
+         * @private
+         */
+        get dimensionMaxCss() {
+            return this.horizontal ? 'max-width' : 'max-height';
+        }
+        get isAttached() {
+            return !!this.parentNode;
+        }
+        transitioningInternal = (__runInitializers(this, _open_extraInitializers), false);
+        /**
+         * @return When true, the element is transitioning its open state. When false,
+         * the element has finished opening/closing.
+         */
+        get transitioning() {
+            return this.transitioningInternal;
+        }
+        /**
+         * Stores the desired size of the collapse body.
+         */
+        desiredSize = '';
+        constructor() {
+            super();
+            this.addEventListener('transitionend', this.handleTransitionEnd.bind(this));
+        }
+        connectedCallback() {
+            super.connectedCallback();
+            if (!this.hasAttribute('role')) {
+                this.setAttribute('role', 'group');
+            }
+            if (!this.hasAttribute('aria-hidden')) {
+                this.setAttribute('aria-hidden', 'true');
+            }
+        }
+        willUpdate(cp) {
+            if (cp.has('open')) {
+                this.handleOpenChange();
+            }
+            if (cp.has('horizontal')) {
+                this.handleHorizontalChange();
+            }
+            if (cp.has('disabled')) {
+                setDisabled(this, cp.get('disabled'));
+            }
+            super.willUpdate(cp);
+        }
+        /**
+         * Toggle the opened state.
+         */
+        toggle() {
+            this.open = !this.open;
+            this.dispatchEvent(new Event('open'));
+        }
+        /**
+         * Updates the size of the element.
+         * @param size The new value for `maxWidth`/`maxHeight` as css property value, usually `auto` or `0px`.
+         * @param animated if `true` updates the size with an animation, otherwise without.
+         */
+        updateSize(size, animated) {
+            // Consider 'auto' as '', to take full size.
+            let sizeValue = size === 'auto' ? '' : size;
+            let willAnimate = animated && !this.noAnimation && this.isAttached;
+            this.desiredSize = sizeValue;
+            this.updateTransition(false);
+            // If we can animate, must do some prep work.
+            if (willAnimate) {
+                // Animation will start at the current size.
+                const startSize = this.calcSize();
+                // For `auto` we must calculate what is the final size for the animation.
+                // After the transition is done, _transitionEnd will set the size back to
+                // `auto`.
+                if (sizeValue === '') {
+                    this.style[this.dimensionMax] = '';
+                    sizeValue = this.calcSize();
+                }
+                // Go to startSize without animation.
+                this.style[this.dimensionMax] = startSize;
+                // Force layout to ensure transition will go. Set scrollTop to itself
+                // so that compilers won't remove it.
+                // eslint-disable-next-line no-self-assign
+                this.scrollTop = this.scrollTop;
+                // Enable animation.
+                this.updateTransition(true);
+                // If final size is the same as startSize it will not animate.
+                willAnimate = sizeValue !== startSize;
+            }
+            // Set the final size.
+            this.style[this.dimensionMax] = sizeValue;
+            // If it won't animate, call transitionEnd to set correct styles.
+            if (!willAnimate) {
+                this.transitionEnd();
+            }
+        }
+        updateTransition(enabled) {
+            this.style.transitionDuration = enabled && !this.noAnimation ? '' : '0s';
+        }
+        /**
+         * Calculates the size of the element when opened.
+         */
+        calcSize() {
+            const value = this.getBoundingClientRect()[this.dimension];
+            return `${value}px`;
+        }
+        transitionEnd() {
+            this.style[this.dimensionMax] = this.desiredSize;
+            this.toggleAttribute('collapse-closed', !this.open);
+            this.toggleAttribute('collapse-opened', this.open);
+            this.updateTransition(false);
+            this.notifyResize();
+            this.transitioningInternal = false;
+            this.notifyTransitioning();
+        }
+        notifyResize() {
+            this.dispatchEvent(new Event('resize', { bubbles: true, composed: true, cancelable: true }));
+        }
+        notifyTransitioning() {
+            this.dispatchEvent(new Event('transitioning', { bubbles: true, composed: true, cancelable: true }));
+        }
+        handleTransitionEnd(e) {
+            const target = e.composedPath().find((node) => node === this);
+            if (target) {
+                this.transitionEnd();
+            }
+        }
+        handleOpenChange() {
+            const { open } = this;
+            this.setAttribute('aria-hidden', String(!open));
+            this.transitioningInternal = true;
+            this.notifyTransitioning();
+            this.toggleAttribute('collapse-closed', false);
+            this.toggleAttribute('collapse-opened', false);
+            this.updateSize(open ? 'auto' : '0px', true);
+            // Focus the current collapse.
+            if (open) {
+                this.focus();
+            }
+        }
+        handleHorizontalChange() {
+            this.style.transitionProperty = this.dimensionMaxCss;
+            const otherDimension = this.dimensionMax === 'maxWidth' ? 'maxHeight' : 'maxWidth';
+            this.style[otherDimension] = '';
+            this.updateSize(this.open ? 'auto' : '0px', false);
+        }
+        render() {
+            return html `<slot></slot>`;
+        }
+    };
+})();
+/**
+ * @fires transitioning - When the element is transitioning.
+ * @slot - Main slot for the content
+ */
+export default UiCollapse;
+//# sourceMappingURL=Collapse.js.map

package/build/src/md/collapse/internals/Collapse.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Collapse.js","sourceRoot":"","sources":["../../../../../src/md/collapse/internals/Collapse.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, PropertyValues, TemplateResult } from 'lit'\nimport { property } from 'lit/decorators.js'\nimport { UiElement } from '../../UiElement.js'\nimport { setDisabled } from '../../../lib/disabled.js'\n\n/**\n * @fires transitioning - When the element is transitioning.\n * @slot - Main slot for the content\n */\nexport default class UiCollapse extends UiElement {\n  /**\n   * Whether the chip is disabled. The user can't interact with the chip when `true`.\n   * @attribute\n   */\n  @property({ type: Boolean, reflect: true }) accessor disabled = false\n\n  /**\n   * Set noAnimation to true to disable animations.\n   * @attr\n   */\n  @property({ type: Boolean, reflect: true }) accessor noAnimation: boolean | undefined\n\n  /**\n   * Renders the collapse horizontally when true and vertically otherwise\n   * @attribute\n   */\n  @property({ type: Boolean }) accessor horizontal = false\n\n  /**\n   * Set opened to true to show the collapse element and to false to hide it.\n   * @attribute\n   */\n  @property({ type: Boolean, reflect: true }) accessor open = false\n\n  get dimension(): 'width' | 'height' {\n    return this.horizontal ? 'width' : 'height'\n  }\n\n  /**\n   * `maxWidth` or `maxHeight`.\n   * @private\n   */\n  get dimensionMax(): 'maxWidth' | 'maxHeight' {\n    return this.horizontal ? 'maxWidth' : 'maxHeight'\n  }\n\n  /**\n   * `max-width` or `max-height`.\n   * @private\n   */\n  get dimensionMaxCss(): 'max-width' | 'max-height' {\n    return this.horizontal ? 'max-width' : 'max-height'\n  }\n\n  get isAttached(): boolean {\n    return !!this.parentNode\n  }\n\n  protected transitioningInternal = false\n\n  /**\n   * @return When true, the element is transitioning its open state. When false,\n   * the element has finished opening/closing.\n   */\n  get transitioning(): boolean {\n    return this.transitioningInternal\n  }\n\n  /**\n   * Stores the desired size of the collapse body.\n   */\n  protected desiredSize = ''\n\n  constructor() {\n    super()\n    this.addEventListener('transitionend', this.handleTransitionEnd.bind(this))\n  }\n\n  override connectedCallback(): void {\n    super.connectedCallback()\n    if (!this.hasAttribute('role')) {\n      this.setAttribute('role', 'group')\n    }\n    if (!this.hasAttribute('aria-hidden')) {\n      this.setAttribute('aria-hidden', 'true')\n    }\n  }\n\n  protected override willUpdate(cp: PropertyValues<this>): void {\n    if (cp.has('open')) {\n      this.handleOpenChange()\n    }\n    if (cp.has('horizontal')) {\n      this.handleHorizontalChange()\n    }\n    if (cp.has('disabled')) {\n      setDisabled(this, cp.get('disabled'))\n    }\n    super.willUpdate(cp)\n  }\n\n  /**\n   * Toggle the opened state.\n   */\n  toggle(): void {\n    this.open = !this.open\n    this.dispatchEvent(new Event('open'))\n  }\n\n  /**\n   * Updates the size of the element.\n   * @param size The new value for `maxWidth`/`maxHeight` as css property value, usually `auto` or `0px`.\n   * @param animated if `true` updates the size with an animation, otherwise without.\n   */\n  protected updateSize(size: string, animated?: boolean): void {\n    // Consider 'auto' as '', to take full size.\n    let sizeValue = size === 'auto' ? '' : size\n\n    let willAnimate = animated && !this.noAnimation && this.isAttached\n    this.desiredSize = sizeValue\n\n    this.updateTransition(false)\n    // If we can animate, must do some prep work.\n    if (willAnimate) {\n      // Animation will start at the current size.\n      const startSize = this.calcSize()\n      // For `auto` we must calculate what is the final size for the animation.\n      // After the transition is done, _transitionEnd will set the size back to\n      // `auto`.\n      if (sizeValue === '') {\n        this.style[this.dimensionMax] = ''\n        sizeValue = this.calcSize()\n      }\n      // Go to startSize without animation.\n\n      this.style[this.dimensionMax] = startSize\n      // Force layout to ensure transition will go. Set scrollTop to itself\n      // so that compilers won't remove it.\n      // eslint-disable-next-line no-self-assign\n      this.scrollTop = this.scrollTop\n      // Enable animation.\n      this.updateTransition(true)\n      // If final size is the same as startSize it will not animate.\n      willAnimate = sizeValue !== startSize\n    }\n    // Set the final size.\n\n    this.style[this.dimensionMax] = sizeValue\n    // If it won't animate, call transitionEnd to set correct styles.\n    if (!willAnimate) {\n      this.transitionEnd()\n    }\n  }\n\n  protected updateTransition(enabled?: boolean): void {\n    this.style.transitionDuration = enabled && !this.noAnimation ? '' : '0s'\n  }\n\n  /**\n   * Calculates the size of the element when opened.\n   */\n  protected calcSize(): string {\n    const value = this.getBoundingClientRect()[this.dimension]\n    return `${value}px`\n  }\n\n  protected transitionEnd(): void {\n    this.style[this.dimensionMax] = this.desiredSize\n    this.toggleAttribute('collapse-closed', !this.open)\n    this.toggleAttribute('collapse-opened', this.open)\n    this.updateTransition(false)\n    this.notifyResize()\n    this.transitioningInternal = false\n    this.notifyTransitioning()\n  }\n\n  protected notifyResize(): void {\n    this.dispatchEvent(new Event('resize', { bubbles: true, composed: true, cancelable: true }))\n  }\n\n  protected notifyTransitioning(): void {\n    this.dispatchEvent(new Event('transitioning', { bubbles: true, composed: true, cancelable: true }))\n  }\n\n  protected handleTransitionEnd(e: Event): void {\n    const target = e.composedPath().find((node) => node === this)\n    if (target) {\n      this.transitionEnd()\n    }\n  }\n\n  protected handleOpenChange(): void {\n    const { open } = this\n    this.setAttribute('aria-hidden', String(!open))\n    this.transitioningInternal = true\n    this.notifyTransitioning()\n    this.toggleAttribute('collapse-closed', false)\n    this.toggleAttribute('collapse-opened', false)\n    this.updateSize(open ? 'auto' : '0px', true)\n\n    // Focus the current collapse.\n    if (open) {\n      this.focus()\n    }\n  }\n\n  protected handleHorizontalChange(): void {\n    this.style.transitionProperty = this.dimensionMaxCss\n    const otherDimension = this.dimensionMax === 'maxWidth' ? 'maxHeight' : 'maxWidth'\n    this.style[otherDimension] = ''\n    this.updateSize(this.open ? 'auto' : '0px', false)\n  }\n\n  override render(): TemplateResult {\n    return html`<slot></slot>`\n  }\n}\n"]}

package/build/src/md/collapse/internals/Collapse.styles.d.ts

@@ -0,0 +1,3 @@
+declare const _default: import("lit").CSSResult;
+export default _default;
+//# sourceMappingURL=Collapse.styles.d.ts.map

package/build/src/md/collapse/internals/Collapse.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Collapse.styles.d.ts","sourceRoot":"","sources":["../../../../../src/md/collapse/internals/Collapse.styles.ts"],"names":[],"mappings":";AAEA,wBAeC"}

package/build/src/md/collapse/internals/Collapse.styles.js

@@ -0,0 +1,18 @@
+import { css } from 'lit';
+export default css `
+  :host {
+    display: block;
+    transition-duration: var(--ui-collapse-transition-duration, 300ms);
+    transition-timing-function: cubic-bezier(0.2, 0, 0, 1);
+    overflow: visible;
+  }
+
+  :host([collapse-closed]) {
+    display: none;
+  }
+
+  :host(:not([collapse-opened])) {
+    overflow: hidden;
+  }
+`;
+//# sourceMappingURL=Collapse.styles.js.map

package/build/src/md/collapse/internals/Collapse.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Collapse.styles.js","sourceRoot":"","sources":["../../../../../src/md/collapse/internals/Collapse.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,eAAe,GAAG,CAAA;;;;;;;;;;;;;;;CAejB,CAAA","sourcesContent":["import { css } from 'lit'\n\nexport default css`\n  :host {\n    display: block;\n    transition-duration: var(--ui-collapse-transition-duration, 300ms);\n    transition-timing-function: cubic-bezier(0.2, 0, 0, 1);\n    overflow: visible;\n  }\n\n  :host([collapse-closed]) {\n    display: none;\n  }\n\n  :host(:not([collapse-opened])) {\n    overflow: hidden;\n  }\n`\n"]}

package/build/src/md/collapse/ui-collapse.d.ts

@@ -0,0 +1,11 @@
+import type { CSSResultOrNative } from 'lit';
+import Element from './internals/Collapse.js';
+export declare class UiCollapseElement extends Element {
+    static styles: CSSResultOrNative[];
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'ui-collapse': Element;
+    }
+}
+//# sourceMappingURL=ui-collapse.d.ts.map

package/build/src/md/collapse/ui-collapse.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ui-collapse.d.ts","sourceRoot":"","sources":["../../../../src/md/collapse/ui-collapse.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,KAAK,CAAA;AAE5C,OAAO,OAAO,MAAM,yBAAyB,CAAA;AAG7C,qBACa,iBAAkB,SAAQ,OAAO;IAC5C,OAAgB,MAAM,EAAE,iBAAiB,EAAE,CAAW;CACvD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,aAAa,EAAE,OAAO,CAAA;KACvB;CACF"}

package/build/src/md/collapse/ui-collapse.js

@@ -0,0 +1,27 @@
+import { __esDecorate, __runInitializers } from "tslib";
+import { customElement } from 'lit/decorators.js';
+import Element from './internals/Collapse.js';
+import styles from './internals/Collapse.styles.js';
+let UiCollapseElement = (() => {
+    let _classDecorators = [customElement('ui-collapse')];
+    let _classDescriptor;
+    let _classExtraInitializers = [];
+    let _classThis;
+    let _classSuper = Element;
+    var UiCollapseElement = class extends _classSuper {
+        static { _classThis = this; }
+        static {
+            const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
+            __esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
+            UiCollapseElement = _classThis = _classDescriptor.value;
+            if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
+        }
+        static styles = [styles];
+        static {
+            __runInitializers(_classThis, _classExtraInitializers);
+        }
+    };
+    return UiCollapseElement = _classThis;
+})();
+export { UiCollapseElement };
+//# sourceMappingURL=ui-collapse.js.map

package/build/src/md/collapse/ui-collapse.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ui-collapse.js","sourceRoot":"","sources":["../../../../src/md/collapse/ui-collapse.ts"],"names":[],"mappings":";AACA,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAA;AACjD,OAAO,OAAO,MAAM,yBAAyB,CAAA;AAC7C,OAAO,MAAM,MAAM,gCAAgC,CAAA;IAGtC,iBAAiB;4BAD7B,aAAa,CAAC,aAAa,CAAC;;;;sBACU,OAAO;iCAAf,SAAQ,WAAO;;;;YAA9C,6KAEC;;;;QADC,MAAM,CAAU,MAAM,GAAwB,CAAC,MAAM,CAAC,CAAA;;YAD3C,uDAAiB;;;;;SAAjB,iBAAiB","sourcesContent":["import type { CSSResultOrNative } from 'lit'\nimport { customElement } from 'lit/decorators.js'\nimport Element from './internals/Collapse.js'\nimport styles from './internals/Collapse.styles.js'\n\n@customElement('ui-collapse')\nexport class UiCollapseElement extends Element {\n  static override styles: CSSResultOrNative[] = [styles]\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'ui-collapse': Element\n  }\n}\n"]}