@alegendstale/holly-components 1.4.0 → 2.0.2

package/dist/components/bottom-sheet/bottom-sheet.styles.js

@@ -0,0 +1,115 @@
+import { css } from 'lit';
+export default css `
+	:host {
+		contain: content;
+		overscroll-behavior-block: none;
+		--height: fit-content;
+	}
+
+	:host([dragging]) dialog {
+		#content {
+			cursor: grabbing;
+			/* Important! Prevents mobile browsers from reclaiming PointerMove event on touch devices */
+			touch-action: none;
+			/* Prevent weird scrollbar movement on mobile when dragging */
+			overflow-y: hidden;
+		}
+	}
+
+	:host(:not([dragging])) dialog {
+		/* Only animate if not dragging */
+		transition-property: overlay opacity display;
+		transition-duration: 0.25s;
+		transition-behavior: allow-discrete;
+
+		&::backdrop {
+			transition-property: overlay opacity display;
+			transition-duration: 0.25s;
+			transition-behavior: allow-discrete;
+		}
+
+		#content {
+			/* Allow scroll */
+			touch-action: pan-y;
+		}
+	}
+
+	dialog {
+		display: none;
+		opacity: 0;
+		translate: 0 var(--height);
+
+		height: var(--height);
+		min-height: 0;
+		max-height: 100%;
+		min-width: 100%;
+		max-width: 100%;
+		flex-direction: column;
+		box-sizing: border-box;
+		padding: 0;
+		border: 0;
+		background-color: light-dark(#d9d9d9, #1c1c1c);
+		/* Important! Removes default browser styling, allowing bottom to work */
+		inset: unset;
+		bottom: 0;
+		left: 0;
+		overflow-y: hidden;
+
+		/* Important! Prevents mobile browsers from reclaiming PointerMove event on touch devices */
+		touch-action: none;
+		/* Prevent weird scrollbar movement on mobile when dragging */
+		overflow-y: hidden;
+
+		&[open] {
+			display: flex;
+			opacity: 1;
+			translate: 0 0;
+
+			&::backdrop {
+				opacity: 0.8;
+			}
+		}
+
+		&::backdrop {
+			background: black;
+			opacity: 0;
+		}
+	}
+
+	@starting-style {
+		dialog[open] {
+			opacity: 0;
+			translate: 0 var(--height);
+
+			&::backdrop {
+				opacity: 0;
+			}
+		}
+	}
+
+	#handle {
+		display: block;
+		position: sticky;
+		top: 0;
+		background: transparent;
+		border: 0;
+		cursor: grabbing;
+		min-height: 35px;
+		user-select: none;
+		touch-action: none;
+	}
+
+	div {
+		/* display: contents; */
+		overflow-y: auto;
+		scrollbar-width: none;
+		box-sizing: border-box;
+		min-height: 100%;
+		min-width: 100%;
+	}
+
+	::slotted(*) {
+		/* Prevent slotted items from taking pointer events */
+		/* pointer-events: none; */
+	}
+`;

package/dist/components/canvas/canvas-base.d.ts

@@ -5,13 +5,20 @@ type EventMap = {
     click: [hex: string];
     move: [e: client];
 };
+/**
+ * Utility component to help with creating canvases.
+ */
 export declare class CanvasBase extends LitElement {
     static styles: import("lit").CSSResult[];
-    canvas: HTMLCanvasElement;
+    /** The canvas element. */
+    protected canvas: HTMLCanvasElement;
+    /** The canvas context. */
     protected context: CanvasRenderingContext2D;
+    /** Public way to subscribe to events. */
     emitter: EventEmitter<EventMap>;
     disconnectedCallback(): void;
     render(): import("lit-html").TemplateResult<1>;
+    /** Retrieves the hex from the mouse position. */
     getCanvasHex(clientX: number, clientY: number): string;
 }
 export {};

package/dist/components/canvas/canvas-base.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"canvas-base.d.ts","sourceRoot":"","sources":["../../../src/components/canvas/canvas-base.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,6BAA6B,CAAC;AAE3D,OAAO,EAAE,UAAU,EAAa,MAAM,KAAK,CAAC;AAE5C,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAG9C,KAAK,QAAQ,GAAG;IACf,KAAK,EAAE,CAAC,GAAG,EAAE,MAAM,CAAC,CAAC;IACrB,IAAI,EAAE,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC;CAClB,CAAC;AAEF,qBACa,UAAW,SAAQ,UAAU;IACzC,MAAM,CAAC,MAAM,4BAMX;IAGF,MAAM,EAAG,iBAAiB,CAAC;IAE3B,SAAS,CAAC,OAAO,EAAG,wBAAwB,CAAC;IAEtC,OAAO,EAAE,YAAY,CAAC,QAAQ,CAAC,CAAgC;IAEtE,oBAAoB,IAAI,IAAI;IAK5B,MAAM;IAsBC,YAAY,CAAC,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM;CAWpD"}
+{"version":3,"file":"canvas-base.d.ts","sourceRoot":"","sources":["../../../src/components/canvas/canvas-base.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,6BAA6B,CAAC;AAE3D,OAAO,EAAE,UAAU,EAAa,MAAM,KAAK,CAAC;AAE5C,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAE9C,KAAK,QAAQ,GAAG;IACf,KAAK,EAAE,CAAC,GAAG,EAAE,MAAM,CAAC,CAAC;IACrB,IAAI,EAAE,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC;CAClB,CAAC;AAEF;;GAEG;AACH,qBACa,UAAW,SAAQ,UAAU;IACzC,MAAM,CAAC,MAAM,4BAMX;IAEF,0BAA0B;IAE1B,SAAS,CAAC,MAAM,EAAG,iBAAiB,CAAC;IAErC,0BAA0B;IAC1B,SAAS,CAAC,OAAO,EAAG,wBAAwB,CAAC;IAE7C,yCAAyC;IAClC,OAAO,EAAE,YAAY,CAAC,QAAQ,CAAC,CAAgC;IAEtE,oBAAoB,IAAI,IAAI;IAK5B,MAAM;IAqBN,iDAAiD;IAC1C,YAAY,CAAC,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM;CAWpD"}

package/dist/components/canvas/canvas-base.js

@@ -8,13 +8,23 @@ import colorsea from '../../utils/colorsea-wrapper.js';
 import { EventEmitter } from '../../utils/EventEmitter.js';
 import { ref } from 'lit/directives/ref.js';
 import { LitElement, html, css } from 'lit';
-import { query } from 'lit/decorators.js';
-import { condCustomElement } from '../../decorators/condCustomElement.js';
+import { customElement, query } from 'lit/decorators.js';
+/**
+ * Utility component to help with creating canvases.
+ */
 let CanvasBase = class CanvasBase extends LitElement {
     constructor() {
         super(...arguments);
+        /** Public way to subscribe to events. */
         this.emitter = new EventEmitter();
     }
+    static { this.styles = [
+        css `
+			:host {
+				display: block;
+			}
+		`
+    ]; }
     disconnectedCallback() {
         super.disconnectedCallback();
         this.emitter.clear();
@@ -39,7 +49,7 @@ let CanvasBase = class CanvasBase extends LitElement {
 			</canvas>
 		`;
     }
-    // Retrieves the hex from the mouse position
+    /** Retrieves the hex from the mouse position. */
     getCanvasHex(clientX, clientY) {
         const canvasBounds = this.canvas.getBoundingClientRect();
         let x = clientX - canvasBounds.left;
@@ -52,17 +62,10 @@ let CanvasBase = class CanvasBase extends LitElement {
         return hex;
     }
 };
-CanvasBase.styles = [
-    css `
-			:host {
-				display: block;
-			}
-		`
-];
 __decorate([
     query('canvas')
 ], CanvasBase.prototype, "canvas", void 0);
 CanvasBase = __decorate([
-    condCustomElement('canvas-base')
+    customElement('canvas-base')
 ], CanvasBase);
 export { CanvasBase };

package/dist/components/canvas/canvas-base.stories.d.ts

@@ -0,0 +1,7 @@
+import type { Meta, StoryObj } from '@storybook/web-components-vite';
+declare const meta: Meta;
+export default meta;
+export type Props = {};
+type Story = StoryObj<Props>;
+export declare const Example: Story;
+//# sourceMappingURL=canvas-base.stories.d.ts.map

package/dist/components/canvas/canvas-base.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"canvas-base.stories.d.ts","sourceRoot":"","sources":["../../../src/components/canvas/canvas-base.stories.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAY,IAAI,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAS/E,QAAA,MAAM,IAAI,EAAE,IAKX,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,MAAM,MAAM,KAAK,GAAG,EAAE,CAAC;AAEvB,KAAK,KAAK,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;AAU7B,eAAO,MAAM,OAAO,EAAE,KAGrB,CAAC"}

package/dist/components/canvas/canvas-base.stories.js

@@ -0,0 +1,24 @@
+import { html } from 'lit';
+const argTypes = {
+    canvas: { control: false },
+    context: { control: false },
+    emitter: { control: false }
+};
+const meta = {
+    title: 'Canvas/Base',
+    tags: ['autodocs'],
+    component: 'canvas-base',
+    argTypes,
+};
+export default meta;
+const template = {
+    render: ({}) => {
+        return html `
+			<canvas-base></canvas-base>
+		`;
+    },
+};
+export const Example = {
+    ...template,
+    args: {},
+};

package/dist/components/canvas/canvas-gradient.d.ts

@@ -1,16 +1,23 @@
 import { Direction } from '../color-palette/color-palette-utils.js';
 import { CanvasBase } from './canvas-base.js';
 import { PropertyValues } from 'lit';
+/**
+ * Utility component to make creating and retrieving gradient colors easier based on canvas coordinates.
+ *
+ * @dependency canvas-base
+ */
 export declare class CanvasGradient extends CanvasBase {
     static styles: import("lit").CSSResult[];
+    /** An array of the colors that will make the gradient. */
     colors: string[];
+    /** The height of the gradient canvas. */
     height: number;
+    /** The width of the gradient canvas. */
     width: number;
+    /** The direction the gradient will face. (Column or Row) */
     direction: Direction;
     protected updated(_changedProperties: PropertyValues): void;
-    /**
-     * Creates a new gradient canvas
-     */
+    /** Creates a new gradient canvas */
     createGradient(colors: string[], height: number, width: number, direction: Direction): void;
 }
 declare global {

package/dist/components/canvas/canvas-gradient.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"canvas-gradient.d.ts","sourceRoot":"","sources":["../../../src/components/canvas/canvas-gradient.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,yCAAyC,CAAC;AAEpE,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAIrC,qBACa,cAAe,SAAQ,UAAU;IAC7C,MAAM,CAAC,MAAM,4BAEX;IAGF,MAAM,EAAE,MAAM,EAAE,CAAM;IAGtB,MAAM,EAAE,MAAM,CAAK;IAGnB,KAAK,EAAE,MAAM,CAAK;IAGlB,SAAS,EAAE,SAAS,CAAoB;IAExC,SAAS,CAAC,OAAO,CAAC,kBAAkB,EAAE,cAAc,GAAG,IAAI;IAM3D;;OAEG;IACI,cAAc,CAAC,MAAM,EAAE,MAAM,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,SAAS;CAyB3F;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,iBAAiB,EAAE,cAAc,CAAC;KAClC;CACD"}
+{"version":3,"file":"canvas-gradient.d.ts","sourceRoot":"","sources":["../../../src/components/canvas/canvas-gradient.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,yCAAyC,CAAC;AAEpE,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAGrC;;;;GAIG;AACH,qBACa,cAAe,SAAQ,UAAU;IAC7C,MAAM,CAAC,MAAM,4BAA0B;IAEvC,0DAA0D;IAE1D,MAAM,EAAE,MAAM,EAAE,CAAM;IAEtB,yCAAyC;IAEzC,MAAM,EAAE,MAAM,CAAK;IAEnB,wCAAwC;IAExC,KAAK,EAAE,MAAM,CAAK;IAElB,4DAA4D;IAE5D,SAAS,EAAE,SAAS,CAAoB;IAExC,SAAS,CAAC,OAAO,CAAC,kBAAkB,EAAE,cAAc,GAAG,IAAI;IAM3D,oCAAoC;IAC7B,cAAc,CAAC,MAAM,EAAE,MAAM,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,SAAS;CAyB3F;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,iBAAiB,EAAE,cAAc,CAAC;KAClC;CACD"}

package/dist/components/canvas/canvas-gradient.js

@@ -5,25 +5,32 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
 import { Direction } from '../color-palette/color-palette-utils.js';
-import { property } from 'lit/decorators.js';
+import { customElement, property } from 'lit/decorators.js';
 import { CanvasBase } from './canvas-base.js';
 import { isColorValid } from '../../utils/basicUtils.js';
-import { condCustomElement } from '../../decorators/condCustomElement.js';
+/**
+ * Utility component to make creating and retrieving gradient colors easier based on canvas coordinates.
+ *
+ * @dependency canvas-base
+ */
 let CanvasGradient = class CanvasGradient extends CanvasBase {
     constructor() {
         super(...arguments);
+        /** An array of the colors that will make the gradient. */
         this.colors = [];
+        /** The height of the gradient canvas. */
         this.height = 0;
+        /** The width of the gradient canvas. */
         this.width = 0;
+        /** The direction the gradient will face. (Column or Row) */
         this.direction = Direction.Column;
     }
+    static { this.styles = [...CanvasBase.styles]; }
     updated(_changedProperties) {
         super.updated(_changedProperties);
         this.createGradient(this.colors, this.height, this.width, this.direction);
     }
-    /**
-     * Creates a new gradient canvas
-     */
+    /** Creates a new gradient canvas */
     createGradient(colors, height, width, direction) {
         if (!this.context)
             return;
@@ -46,9 +53,6 @@ let CanvasGradient = class CanvasGradient extends CanvasBase {
         this.canvas.style.setProperty('--palette-column-flex-basis', (height / colors.length / 2).toString() + 'px');
     }
 };
-CanvasGradient.styles = [
-    ...CanvasBase.styles
-];
 __decorate([
     property({ type: Array })
 ], CanvasGradient.prototype, "colors", void 0);
@@ -62,6 +66,6 @@ __decorate([
     property({ type: String })
 ], CanvasGradient.prototype, "direction", void 0);
 CanvasGradient = __decorate([
-    condCustomElement('canvas-gradient')
+    customElement('canvas-gradient')
 ], CanvasGradient);
 export { CanvasGradient };

package/dist/components/canvas/canvas-gradient.stories.d.ts

@@ -0,0 +1,14 @@
+import type { Meta, StoryObj } from '@storybook/web-components-vite';
+import { Direction } from '../color-palette/color-palette-utils.js';
+type DirectionType = `${Direction}`;
+declare const meta: Meta;
+export default meta;
+export type Props = {
+    colors: string[];
+    height: number;
+    width: number;
+    direction: DirectionType;
+};
+type Story = StoryObj<Props>;
+export declare const Example: Story;
+//# sourceMappingURL=canvas-gradient.stories.d.ts.map

package/dist/components/canvas/canvas-gradient.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"canvas-gradient.stories.d.ts","sourceRoot":"","sources":["../../../src/components/canvas/canvas-gradient.stories.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAY,IAAI,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAG/E,OAAO,EAAE,SAAS,EAAE,MAAM,yCAAyC,CAAC;AAGpE,KAAK,aAAa,GAAG,GAAG,SAAS,EAAE,CAAC;AAapC,QAAA,MAAM,IAAI,EAAE,IAKX,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,MAAM,MAAM,KAAK,GAAG;IACnB,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,aAAa,CAAA;CACxB,CAAC;AAEF,KAAK,KAAK,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;AAgB7B,eAAO,MAAM,OAAO,EAAE,KAWrB,CAAC"}

package/dist/components/canvas/canvas-gradient.stories.js

@@ -0,0 +1,46 @@
+import { html } from 'lit';
+import CanvasBaseStory from './canvas-base.stories.js';
+import { Direction } from '../color-palette/color-palette-utils.js';
+const direction = Object.values(Direction);
+const argTypes = {
+    ...CanvasBaseStory.argTypes,
+    colors: { control: 'object' },
+    height: { control: 'number' },
+    width: { control: 'number' },
+    direction: {
+        control: 'select',
+        options: direction,
+    }
+};
+const meta = {
+    title: 'Canvas/Gradient',
+    tags: ['autodocs'],
+    component: 'canvas-gradient',
+    argTypes,
+};
+export default meta;
+const template = {
+    render: ({ colors, height, width, direction }) => {
+        return html `
+			<canvas-gradient
+				.colors=${colors}
+				height=${height}
+				width=${width}
+				direction=${direction}
+			>
+			</canvas-gradient>
+		`;
+    },
+};
+export const Example = {
+    ...template,
+    args: {
+        colors: [
+            '#fff',
+            '#000'
+        ],
+        height: 250,
+        width: 500,
+        direction: 'row'
+    },
+};

package/dist/components/canvas/canvas-image.d.ts

@@ -1,49 +1,58 @@
 import { PropertyValues } from 'lit';
 import quantize from 'quantize';
 import { CanvasBase } from './canvas-base.js';
+declare const imageStatus: readonly ["idle", "loading", "success", "error"];
+type ImageStatus = typeof imageStatus[number];
+/**
+ * Utility component to make creating and retrieving image colors easier based on canvas coordinates.
+ *
+ * @dependency canvas-base
+ */
 export declare class CanvasImage extends CanvasBase {
     static styles: import("lit").CSSResult[];
-    image?: HTMLImageElement;
+    /** The image element. */
+    protected image?: HTMLImageElement;
+    /** The image URL. */
     imageURL: string;
+    /** Whether to apply smoothing to the image generated by the canvas. */
     smoothing: boolean;
-    private loading;
+    /** The canvas width. */
     width: number;
+    /** The canvas height. */
     height: number;
-    protected firstUpdated(_changedProperties: PropertyValues): void;
+    /** @readonly Used to style the canvas based on its current state. */
+    protected status: ImageStatus;
+    protected updated(_changedProperties: PropertyValues): void;
+    get updateComplete(): Promise<boolean>;
     render(): import("lit-html").TemplateResult<1>;
     /**
      * Updates & loads the canvas image.
      * Attempts to preserve aspect ratio based on width.
-     * @param width The canvas width
-     * @param height The canvas height
      */
-    updateImage(imageURL: string, width: number, height: number): void;
+    private _performDraw;
+    /** @internal Handle errors when the image fails to load. */
+    private _handleLoadError;
     /**
-     * Gets the most frequent colors in an image
+     * Gets the most frequent colors in an image.
      * @param numColors Number of colors to return
      * @param quality Artificially reduce number of pixels (higher = less accurate but faster)
      * @returns Most frequent colors
      */
     getPalette(numColors?: number, quality?: number): Promise<quantize.RgbPixel[] | null>;
     /**
-     * Creates an array of pixels from the image
+     * Creates an array of pixels from the image.
      * Inspired by colorthief
      * @param quality Artificially reduce number of pixels (higher = less accurate but faster)
-     * @returns
+     * @returns Array of pixels
      */
     createPixelArray(quality: number): Promise<quantize.RgbPixel[] | null>;
-    /**
-     * Gets the image data from the canvas
-     */
+    /** Gets the image data from the canvas. */
     getImageData(x?: number, y?: number): Promise<ImageData>;
-    /**
-     * Waits for loading variable to equal true
-     */
-    private waitForLoading;
 }
 declare global {
     interface HTMLElementTagNameMap {
         'canvas-image': CanvasImage;
     }
 }
+export {};
 //# sourceMappingURL=canvas-image.d.ts.map

package/dist/components/canvas/canvas-image.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"canvas-image.d.ts","sourceRoot":"","sources":["../../../src/components/canvas/canvas-image.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,cAAc,EAAE,MAAM,KAAK,CAAC;AAEhD,OAAO,QAAsB,MAAM,UAAU,CAAC;AAC9C,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAG9C,qBACa,WAAY,SAAQ,UAAU;IAC1C,MAAM,CAAC,MAAM,4BAgBX;IAGF,KAAK,CAAC,EAAE,gBAAgB,CAAC;IAGzB,QAAQ,EAAE,MAAM,CAAM;IAGtB,SAAS,EAAE,OAAO,CAAS;IAE3B,OAAO,CAAC,OAAO,CAAiB;IAChC,KAAK,EAAE,MAAM,CAAK;IAClB,MAAM,EAAE,MAAM,CAAK;IAEnB,SAAS,CAAC,YAAY,CAAC,kBAAkB,EAAE,cAAc,GAAG,IAAI;IAOhE,MAAM;IAYN;;;;;OAKG;IACI,WAAW,CAAC,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM;IA6BlE;;;;;OAKG;IACU,UAAU,CAAC,SAAS,SAAI,EAAE,OAAO,SAAK;IAqBnD;;;;;OAKG;IACU,gBAAgB,CAAC,OAAO,EAAE,MAAM;IAuB7C;;OAEG;IACU,YAAY,CAAC,CAAC,SAAI,EAAE,CAAC,SAAI;IAStC;;OAEG;IACH,OAAO,CAAC,cAAc,CAQnB;CACH;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,cAAc,EAAE,WAAW,CAAC;KAC5B;CACD"}
+{"version":3,"file":"canvas-image.d.ts","sourceRoot":"","sources":["../../../src/components/canvas/canvas-image.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,cAAc,EAAE,MAAM,KAAK,CAAC;AAE3C,OAAO,QAAsB,MAAM,UAAU,CAAC;AAC9C,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAG9C,QAAA,MAAM,WAAW,kDAAmD,CAAC;AACrE,KAAK,WAAW,GAAG,OAAO,WAAW,CAAC,MAAM,CAAC,CAAC;AAE9C;;;;GAIG;AACH,qBACa,WAAY,SAAQ,UAAU;IAC1C,MAAM,CAAC,MAAM,4BAAkC;IAE/C,yBAAyB;IAEzB,SAAS,CAAC,KAAK,CAAC,EAAE,gBAAgB,CAAC;IAEnC,qBAAqB;IAEd,QAAQ,EAAE,MAAM,CAAM;IAE7B,uEAAuE;IAEhE,SAAS,EAAE,OAAO,CAAS;IAElC,wBAAwB;IAEjB,KAAK,EAAE,MAAM,CAAK;IAEzB,yBAAyB;IAElB,MAAM,EAAE,MAAM,CAAK;IAE1B,qEAAqE;IAErE,SAAS,CAAC,MAAM,EAAE,WAAW,CAAU;IAEvC,SAAS,CAAC,OAAO,CAAC,kBAAkB,EAAE,cAAc,GAAG,IAAI;IAY3D,IAAI,cAAc,IAAI,OAAO,CAAC,OAAO,CAAC,CAkBrC;IAED,MAAM;IAaN;;;OAGG;IACH,OAAO,CAAC,YAAY;IA0BpB,4DAA4D;IAC5D,OAAO,CAAC,gBAAgB;IAMxB;;;;;OAKG;IACU,UAAU,CAAC,SAAS,SAAI,EAAE,OAAO,SAAK;IAqBnD;;;;;OAKG;IACU,gBAAgB,CAAC,OAAO,EAAE,MAAM;IAuB7C,2CAA2C;IAC9B,YAAY,CAAC,CAAC,SAAI,EAAE,CAAC,SAAI;CAQtC;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,cAAc,EAAE,WAAW,CAAC;KAC5B;CACD"}