@moni-labs/moni-ui 0.2.0

package/dist/components/moni-fab-menu.js

@@ -0,0 +1,247 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { html, css } from 'lit';
+import { customElement, property, query } from 'lit/decorators.js';
+import { MoniElement, sharedStyles } from './_base/index.js';
+import './moni-fab.js';
+import './moni-icon.js';
+/**
+ * Visual-only FAB menu. Combines a main `<moni-fab>` trigger with a `<menu>`
+ * of secondary FABs (slotted via default slot).
+ *
+ * The component wires the trigger's `click` to toggle the `open` attribute.
+ * Consumers can also set/unset the attribute externally for programmatic
+ * control. The menu scales and fades via CSS transitions.
+ *
+ * **Focus management** (M3 spec § FAB menu):
+ *  - When `open` becomes true, focus moves to the first focusable item in
+ *    the menu (or stays on the trigger if the menu is empty).
+ *  - When `open` becomes false, focus returns to the trigger.
+ *  - `Tab` cycles within the menu while open; `Escape` closes the menu.
+ *  - Click outside the menu closes it.
+ *
+ * Attributes:
+ *  - open:      present → menu is shown
+ *  - icon:      Material Symbols name for the trigger
+ *  - size:      small | medium (default) | large
+ *  - color:     primary (default) | secondary | tertiary | surface
+ *  - shape:     rounded (default) | circle
+ *  - direction: up (default) | down | left | right
+ *  - position:  same as moni-fab
+ */
+let MoniFabMenu = class MoniFabMenu extends MoniElement {
+    constructor() {
+        super(...arguments);
+        this.open = false;
+        this.icon = 'add';
+        this.size = 'medium';
+        this.color = 'primary';
+        this.shape = 'rounded';
+        this.direction = 'up';
+        this.position = 'bottom-trailing';
+        this._previouslyFocused = null;
+        this._onDocClick = (e) => this._handleDocClick(e);
+        this._onDocKeydown = (e) => this._handleDocKeydown(e);
+        this._onTriggerClick = () => {
+            this.open = !this.open;
+        };
+    }
+    async firstUpdated() {
+        // Wait for all children to finish rendering before wiring listeners
+        await this.updateComplete;
+        if (this._trigger) {
+            this._trigger.addEventListener('click', this._onTriggerClick);
+        }
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        this._trigger?.removeEventListener('click', this._onTriggerClick);
+        document.removeEventListener('click', this._onDocClick, true);
+        document.removeEventListener('keydown', this._onDocKeydown, true);
+    }
+    updated(changed) {
+        super.updated(changed);
+        if (changed.has('open')) {
+            this._syncOpenState();
+        }
+    }
+    _syncOpenState() {
+        if (this.open) {
+            // Save current focus so we can restore it on close.
+            this._previouslyFocused = this.getRootNode()
+                .activeElement;
+            // Move focus to the first focusable item in the menu, or the
+            // trigger as a fallback (per WAI-ARIA menu pattern).
+            const first = this._firstFocusableMenuItem();
+            if (first) {
+                first.focus();
+            }
+            else {
+                this._trigger?.focus();
+            }
+            // Install document listeners for click-outside and Escape.
+            document.addEventListener('click', this._onDocClick, true);
+            document.addEventListener('keydown', this._onDocKeydown, true);
+        }
+        else {
+            // Restore focus to the trigger (or the previously focused element).
+            const restore = this._previouslyFocused ?? this._trigger;
+            restore?.focus();
+            this._previouslyFocused = null;
+            document.removeEventListener('click', this._onDocClick, true);
+            document.removeEventListener('keydown', this._onDocKeydown, true);
+        }
+    }
+    _handleDocClick(e) {
+        if (!this.open)
+            return;
+        const path = e.composedPath();
+        if (!path.includes(this)) {
+            this.open = false;
+        }
+    }
+    _handleDocKeydown(e) {
+        if (!this.open)
+            return;
+        if (e.key === 'Escape') {
+            e.preventDefault();
+            this.open = false;
+        }
+    }
+    _firstFocusableMenuItem() {
+        if (!this._menu)
+            return null;
+        const items = this._menu.querySelectorAll('a[href], button:not([disabled]), [tabindex]:not([tabindex="-1"])');
+        return items[0] ?? null;
+    }
+    static { this.styles = [
+        sharedStyles,
+        css `
+			:host {
+				display: inline-flex;
+				font-family: var(--font);
+				position: relative;
+			}
+
+			:host([position]) {
+				position: fixed;
+				z-index: 13;
+			}
+			:host([position='bottom-trailing']) {
+				inset: auto 1rem 1rem auto;
+			}
+			:host([position='bottom-leading']) {
+				inset: auto auto 1rem 1rem;
+			}
+			:host([position='top-trailing']) {
+				inset: 1rem 1rem auto auto;
+			}
+			:host([position='top-leading']) {
+				inset: 1rem auto auto 1rem;
+			}
+
+			.wrap {
+				display: inline-flex;
+				position: relative;
+				align-items: center;
+				justify-content: center;
+			}
+
+			.fab-menu {
+				opacity: 0;
+				visibility: hidden;
+				position: absolute;
+				display: flex;
+				gap: 0.5rem;
+				padding: 0.5rem;
+				margin: 0;
+				list-style: none;
+				z-index: 14;
+				transition:
+					opacity var(--speed2),
+					transform var(--speed2);
+				transform: scale(0.9);
+			}
+
+			:host([open]) .fab-menu {
+				opacity: 1;
+				visibility: visible;
+				transform: scale(1);
+			}
+
+			/* Directional placement relative to the trigger */
+			:host([direction='up']) .fab-menu {
+				inset: auto auto calc(100% + 0.5rem) 0;
+				flex-direction: column-reverse;
+			}
+			:host([direction='down']) .fab-menu {
+				inset: calc(100% + 0.5rem) auto auto 0;
+			}
+			:host([direction='left']) .fab-menu {
+				inset: 0 auto 0 calc(100% + 0.5rem);
+				flex-direction: row-reverse;
+			}
+			:host([direction='right']) .fab-menu {
+				inset: 0 calc(100% + 0.5rem) 0 auto;
+				flex-direction: row;
+			}
+
+			.fab-menu > li,
+			.fab-menu > ::slotted(*) {
+				list-style: none;
+				display: block;
+			}
+		`
+    ]; }
+    render() {
+        return html `<div class="wrap">
+			<!-- div role=menu allows any slotted content (not just <li>) -->
+			<div class="fab-menu" role="menu" part="menu">
+				<slot></slot>
+			</div>
+			<moni-fab
+				part="trigger"
+				icon=${this.icon}
+				size=${this.size}
+				color=${this.color}
+				shape=${this.shape}
+			></moni-fab>
+		</div>`;
+    }
+};
+__decorate([
+    property({ type: Boolean, reflect: true })
+], MoniFabMenu.prototype, "open", void 0);
+__decorate([
+    property({ reflect: true })
+], MoniFabMenu.prototype, "icon", void 0);
+__decorate([
+    property({ reflect: true })
+], MoniFabMenu.prototype, "size", void 0);
+__decorate([
+    property({ reflect: true })
+], MoniFabMenu.prototype, "color", void 0);
+__decorate([
+    property({ reflect: true })
+], MoniFabMenu.prototype, "shape", void 0);
+__decorate([
+    property({ reflect: true })
+], MoniFabMenu.prototype, "direction", void 0);
+__decorate([
+    property({ reflect: true })
+], MoniFabMenu.prototype, "position", void 0);
+__decorate([
+    query('moni-fab')
+], MoniFabMenu.prototype, "_trigger", void 0);
+__decorate([
+    query('.fab-menu')
+], MoniFabMenu.prototype, "_menu", void 0);
+MoniFabMenu = __decorate([
+    customElement('moni-fab-menu')
+], MoniFabMenu);
+export { MoniFabMenu };
+export default MoniFabMenu;

package/dist/components/moni-fab.d.ts

@@ -0,0 +1,48 @@
+import { MoniElement } from './_base/index.js';
+import './moni-icon.js';
+/**
+ * Visual-only Floating Action Button.
+ *
+ * Material 3 Expressive update (May 2025):
+ *  - `size="small"` is **no longer recommended** by M3. Use `medium` (40dp/56dp
+ *    on M3 spec) or `large`. Deprecated in v0.3.1; will be removed in v1.0.
+ *  - `shape="circle"` is **not part of M3**; M3 FABs are `rounded` with a 16dp
+ *    corner radius (or `full` when on hover/focus). The M3 spec does not
+ *    define a perfect-circle FAB. Deprecated in v0.3.1; will be removed in v1.0.
+ *  - `color="surface"` is **no longer recommended** by M3. Use `primary`,
+ *    `secondary`, or `tertiary` (and their container variants).
+ *
+ * Attributes:
+ *  - size:      medium (default) | large  (small: deprecated)
+ *  - color:     primary (default) | secondary | tertiary  (surface: deprecated)
+ *  - shape:     rounded (default)  (circle: deprecated)
+ *  - extended:  present → wider with label always visible
+ *  - expanded:  present → force expanded
+ *  - disabled:  present
+ *  - icon:      Material Symbols name
+ *  - label:     text when extended
+ *  - position:  bottom-trailing (default) | bottom-leading
+ *               | top-trailing | top-leading
+ */
+export declare class MoniFab extends MoniElement {
+    private static _deprecationWarned;
+    size: 'small' | 'medium' | 'large';
+    color: 'primary' | 'secondary' | 'tertiary' | 'surface';
+    shape: 'rounded' | 'circle';
+    extended: boolean;
+    expanded: boolean;
+    disabled: boolean;
+    icon: string;
+    label: string;
+    position: 'bottom-trailing' | 'bottom-leading' | 'top-trailing' | 'top-leading';
+    connectedCallback(): void;
+    static styles: import("lit").CSSResult[];
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'moni-fab': MoniFab;
+    }
+}
+export default MoniFab;
+//# sourceMappingURL=moni-fab.d.ts.map

package/dist/components/moni-fab.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"moni-fab.d.ts","sourceRoot":"","sources":["../../src/components/moni-fab.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAgB,MAAM,kBAAkB,CAAC;AAC7D,OAAO,gBAAgB,CAAC;AAExB;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,qBACa,OAAQ,SAAQ,WAAW;IACvC,OAAO,CAAC,MAAM,CAAC,kBAAkB,CAAS;IAG1C,IAAI,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAY;IAE9C,KAAK,EAAE,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,SAAS,CAAa;IAEpE,KAAK,EAAE,SAAS,GAAG,QAAQ,CAAa;IACI,QAAQ,UAAS;IACjB,QAAQ,UAAS;IACjB,QAAQ,UAAS;IAChC,IAAI,SAAS;IACb,KAAK,SAAM;IAExC,QAAQ,EACL,iBAAiB,GACjB,gBAAgB,GAChB,cAAc,GACd,aAAa,CAAqB;IAE5B,iBAAiB,IAAI,IAAI;IAkBlC,OAAgB,MAAM,4BA6JpB;IAEO,MAAM;CAyBf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,UAAU,EAAE,OAAO,CAAC;KACpB;CACD;AAED,eAAe,OAAO,CAAC"}

package/dist/components/moni-fab.js

@@ -0,0 +1,284 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var MoniFab_1;
+import { html, css, nothing } from 'lit';
+import { customElement, property } from 'lit/decorators.js';
+import { MoniElement, sharedStyles } from './_base/index.js';
+import './moni-icon.js';
+/**
+ * Visual-only Floating Action Button.
+ *
+ * Material 3 Expressive update (May 2025):
+ *  - `size="small"` is **no longer recommended** by M3. Use `medium` (40dp/56dp
+ *    on M3 spec) or `large`. Deprecated in v0.3.1; will be removed in v1.0.
+ *  - `shape="circle"` is **not part of M3**; M3 FABs are `rounded` with a 16dp
+ *    corner radius (or `full` when on hover/focus). The M3 spec does not
+ *    define a perfect-circle FAB. Deprecated in v0.3.1; will be removed in v1.0.
+ *  - `color="surface"` is **no longer recommended** by M3. Use `primary`,
+ *    `secondary`, or `tertiary` (and their container variants).
+ *
+ * Attributes:
+ *  - size:      medium (default) | large  (small: deprecated)
+ *  - color:     primary (default) | secondary | tertiary  (surface: deprecated)
+ *  - shape:     rounded (default)  (circle: deprecated)
+ *  - extended:  present → wider with label always visible
+ *  - expanded:  present → force expanded
+ *  - disabled:  present
+ *  - icon:      Material Symbols name
+ *  - label:     text when extended
+ *  - position:  bottom-trailing (default) | bottom-leading
+ *               | top-trailing | top-leading
+ */
+let MoniFab = class MoniFab extends MoniElement {
+    constructor() {
+        super(...arguments);
+        this.size = 'medium';
+        this.color = 'primary';
+        this.shape = 'rounded';
+        this.extended = false;
+        this.expanded = false;
+        this.disabled = false;
+        this.icon = 'add';
+        this.label = '';
+        this.position = 'bottom-trailing';
+    }
+    static { MoniFab_1 = this; }
+    static { this._deprecationWarned = false; }
+    connectedCallback() {
+        super.connectedCallback();
+        if (MoniFab_1._deprecationWarned)
+            return;
+        const hasDeprecated = this.size === 'small'
+            || this.shape === 'circle'
+            || this.color === 'surface';
+        if (hasDeprecated) {
+            MoniFab_1._deprecationWarned = true;
+            const reasons = [];
+            if (this.size === 'small')
+                reasons.push('size="small"');
+            if (this.shape === 'circle')
+                reasons.push('shape="circle"');
+            if (this.color === 'surface')
+                reasons.push('color="surface"');
+            console.warn(`[moni-ui] <moni-fab> uses ${reasons.join(', ')}, deprecated since v0.3.1 per Material Design 3 Expressive (May 2025). See m3-docs/components/floating-action-button/overview.md § M3 Expressive update.`);
+        }
+    }
+    static { this.styles = [
+        sharedStyles,
+        css `
+			:host {
+				display: inline-block;
+				font-family: var(--font);
+				position: relative;
+			}
+
+			:host([position]) {
+				position: fixed;
+				z-index: 13;
+			}
+			:host([position='bottom-trailing']) {
+				inset: auto 1rem 1rem auto;
+			}
+			:host([position='bottom-leading']) {
+				inset: auto auto 1rem 1rem;
+			}
+			:host([position='top-trailing']) {
+				inset: 1rem 1rem auto auto;
+			}
+			:host([position='top-leading']) {
+				inset: 1rem auto auto 1rem;
+			}
+
+			.button {
+				display: inline-flex;
+				align-items: center;
+				justify-content: center;
+				block-size: 3.5rem;
+				font-size: 1rem;
+				font-weight: 500;
+				color: var(--on-primary);
+				/* Default: no padding so icon is centered; padding added when label exists */
+				padding: 0 1.5rem;
+				background-color: var(--primary);
+				border: 0.0625rem solid transparent;
+				border-radius: 1rem;
+				gap: 0.5rem;
+				line-height: normal;
+				font-family: inherit;
+				cursor: pointer;
+				box-shadow: var(--elevate2);
+				transition:
+					transform 250ms cubic-bezier(0.34, 1.56, 0.64, 1),
+					border-radius 250ms cubic-bezier(0.34, 1.56, 0.64, 1),
+					padding 250ms cubic-bezier(0.34, 1.56, 0.64, 1),
+					background-color 200ms ease,
+					box-shadow 250ms ease;
+				user-select: none;
+				text-decoration: none;
+			}
+
+			.button:hover:not(:disabled) {
+				transform: translateY(-0.125rem) scale(1.02);
+				box-shadow: var(--elevate3);
+			}
+
+			.button:active:not(:disabled) {
+				transform: translateY(0.0625rem) scale(0.97);
+				box-shadow: var(--elevate1);
+			}
+
+			/* When no label: icon-only, remove horizontal padding so icon centers */
+			.button:not(:has(> .label:not(:empty))) {
+				padding-inline: 0;
+			}
+
+			.button.small {
+				block-size: 2.5rem;
+				font-size: 0.875rem;
+				padding: 0 1rem;
+			}
+			.button.large {
+				block-size: 4rem;
+				padding: 0 2rem;
+			}
+
+			.button.circle {
+				padding: 0;
+				inline-size: 3.5rem;
+				aspect-ratio: 1;
+				border-radius: 50%;
+			}
+			.button.circle.small {
+				inline-size: 2.5rem;
+			}
+			.button.circle.large {
+				inline-size: 4rem;
+			}
+
+			.button.rounded {
+				border-radius: 1rem;
+			}
+			.button.rounded:is(:hover, :focus-visible) {
+				border-radius: 2rem;
+			}
+
+			.button.secondary {
+				background-color: var(--secondary-container);
+				color: var(--on-secondary-container);
+			}
+			.button.tertiary {
+				background-color: var(--tertiary-container);
+				color: var(--on-tertiary-container);
+			}
+			.button.surface {
+				background-color: var(--surface);
+				color: var(--primary);
+			}
+
+			.button:disabled {
+				opacity: 0.5;
+				cursor: not-allowed;
+				pointer-events: none;
+			}
+			.button:focus-visible {
+				outline: 0.125rem solid var(--primary);
+				outline-offset: 0.125rem;
+				transform: translateY(-0.125rem) scale(1.02);
+				box-shadow: var(--elevate3);
+			}
+
+			.icon,
+			::slotted([slot='icon']) {
+				display: inline-flex;
+				align-items: center;
+				justify-content: center;
+				flex: none;
+				color: inherit;
+			}
+
+			/* Label is always rendered but empty string hides via overflow.
+			   When label prop is set, it appears. */
+			.label {
+				white-space: nowrap;
+				max-inline-size: 16rem;
+				overflow: hidden;
+				transition: max-inline-size var(--speed3);
+				font-size: 1rem;
+				font-weight: 500;
+			}
+			.label:empty {
+				display: none;
+			}
+
+			/* Circle shape: hide label completely */
+			:host([shape='circle']) .label,
+			:host([shape='circle']) slot {
+				display: none !important;
+			}
+			/* Circle: remove padding, make it a perfect circle */
+			:host([shape='circle']) .button {
+				padding: 0 !important;
+			}
+		`
+    ]; }
+    render() {
+        const classes = [
+            'button',
+            this.size,
+            this.shape,
+            this.color === 'primary' ? '' : this.color
+        ]
+            .filter(Boolean)
+            .join(' ');
+        return html `<button
+			class=${classes}
+			part="fab"
+			type="button"
+			?disabled=${this.disabled}
+		>
+			${this.icon
+            ? html `<span part="icon" class="icon"
+						><moni-icon name="${this.icon}"></moni-icon
+					></span>`
+            : nothing}
+			<span class="label" part="label">${this.label}</span>
+			<slot></slot>
+		</button>`;
+    }
+};
+__decorate([
+    property({ reflect: true })
+], MoniFab.prototype, "size", void 0);
+__decorate([
+    property({ reflect: true })
+], MoniFab.prototype, "color", void 0);
+__decorate([
+    property({ reflect: true })
+], MoniFab.prototype, "shape", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], MoniFab.prototype, "extended", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], MoniFab.prototype, "expanded", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], MoniFab.prototype, "disabled", void 0);
+__decorate([
+    property({ reflect: true })
+], MoniFab.prototype, "icon", void 0);
+__decorate([
+    property({ reflect: true })
+], MoniFab.prototype, "label", void 0);
+__decorate([
+    property({ reflect: true })
+], MoniFab.prototype, "position", void 0);
+MoniFab = MoniFab_1 = __decorate([
+    customElement('moni-fab')
+], MoniFab);
+export { MoniFab };
+export default MoniFab;

package/dist/components/moni-file-field.d.ts

@@ -0,0 +1,47 @@
+import { MoniElement } from './_base/index.js';
+import './moni-icon.js';
+/**
+ * Visual-only file field. Renders a hidden `<input type="file">` over a
+ * read-only text input that shows the chosen file names.
+ *
+ * The DOM order is `input[type=text], label, input[type=file], output` so
+ * that the floating label CSS selector `input + label` lifts correctly even
+ * though the visible field is the read-only text input.
+ *
+ * Attributes:
+ *  - name, label, value, variant, size, shape, disabled, helper, error,
+ *    error-text, placeholder — see moni-text-field.
+ *  - accept:  forwarded to input.accept
+ *  - multiple: present → input.multiple
+ *  - button-label: text on the picker button (visual only, default: "Choose file")
+ *  - icon:           leading Material Symbols name
+ *  - trailing-icon:  trailing Material Symbols name
+ */
+export declare class MoniFileField extends MoniElement {
+    name: string;
+    label: string;
+    variant: 'filled' | 'outlined';
+    size: 'small' | 'medium' | 'large' | 'extra';
+    shape: 'round' | 'square' | 'no-round';
+    accept: string;
+    multiple: boolean;
+    buttonLabel: string;
+    disabled: boolean;
+    helper: string;
+    errorText: string;
+    error: boolean;
+    value: string;
+    icon: string;
+    trailingIcon: string;
+    private _fileInput;
+    updated(changed: Map<string, unknown>): void;
+    static styles: import("lit").CSSResult[];
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'moni-file-field': MoniFileField;
+    }
+}
+export default MoniFileField;
+//# sourceMappingURL=moni-file-field.d.ts.map

package/dist/components/moni-file-field.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"moni-file-field.d.ts","sourceRoot":"","sources":["../../src/components/moni-file-field.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,WAAW,EAA6B,MAAM,kBAAkB,CAAC;AAC1E,OAAO,gBAAgB,CAAC;AAExB;;;;;;;;;;;;;;;;GAgBG;AACH,qBACa,aAAc,SAAQ,WAAW;IAChB,IAAI,SAAM;IACV,KAAK,SAAM;IACX,OAAO,EAAE,QAAQ,GAAG,UAAU,CAAc;IAEzE,IAAI,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,OAAO,CAAY;IAExD,KAAK,EAAE,OAAO,GAAG,QAAQ,GAAG,UAAU,CAAc;IACvB,MAAM,SAAM;IACG,QAAQ,UAAS;IAE7D,WAAW,SAAiB;IACgB,QAAQ,UAAS;IAChC,MAAM,SAAM;IACa,SAAS,SAAM;IACzB,KAAK,UAAS;IAC7B,KAAK,SAAM;IACX,IAAI,SAAM;IACkB,YAAY,SACtD;IAEc,OAAO,CAAC,UAAU,CAAoB;IAE1D,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC;IAO9C,OAAgB,MAAM,4BAepB;IAEO,MAAM;CAoEf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,iBAAiB,EAAE,aAAa,CAAC;KACjC;CACD;AAED,eAAe,aAAa,CAAC"}