@breadstone/mosaik-elements-foundation 0.0.205 → 0.0.209

package/Controls/Components/Overlays/Sheet/SheetService.d.ts

@@ -0,0 +1,134 @@
+import type { IPortalElementProps } from '../../Primitives/Portal/IPortalElementProps';
+import type { PortalProjectionElement } from '../../Primitives/Portal/PortalProjectionElement';
+import { SheetElement } from './SheetElement';
+import type { ISheetElementProps } from './ISheetElementProps';
+import type { ISheetServiceConfig } from './ISheetServiceConfig';
+/**
+ * Function type for resolving sheet results.
+ *
+ * @public
+ */
+export type SheetResolveFunction = (result: unknown) => void;
+/**
+ * Represents the `ISheetRef` interface.
+ *
+ * @public
+ */
+export interface ISheetRef {
+    sheetId: string;
+    sheetElement: SheetElement;
+    portalProjectionElement: PortalProjectionElement;
+    wrapperElement: HTMLElement;
+    options?: ISheetOptions;
+    resolve?: SheetResolveFunction;
+}
+/**
+ * Sheet options interface.
+ *
+ * @public
+ */
+export interface ISheetOptions extends Partial<ISheetElementProps>, Partial<IPortalElementProps> {
+    navigateToClose?: boolean;
+}
+/**
+ * Service for managing the display and behavior of sheet elements.
+ * Provides methods to open and close sheets within a portal structure.
+ *
+ * Uses a singleton pattern with static configuration.
+ *
+ * @example
+ * ```typescript
+ * // Configure once at app startup
+ * SheetService.configure({
+ *     closeOnNavigation: true,
+ *     behaviors: []
+ * });
+ *
+ * // Use throughout the app
+ * const result = await SheetService.instance.open('mySheet', MySheetWrapper);
+ * ```
+ *
+ * @public
+ */
+export declare class SheetService {
+    private static _instance;
+    private static _config;
+    private static _isConfigured;
+    private readonly _sheetMap;
+    private readonly _behaviors;
+    private _portalElement?;
+    /**
+     * Constructs a new instance of the `SheetService` class.
+     * Use `SheetService.configure()` and `SheetService.instance` instead of direct instantiation.
+     *
+     * @private
+     */
+    private constructor();
+    /**
+     * Gets the singleton instance of `SheetService`.
+     * If not configured, uses default configuration.
+     *
+     * @public
+     * @static
+     */
+    static get instance(): SheetService;
+    /**
+     * Configures the `SheetService` globally.
+     * Must be called before accessing `instance` if custom configuration is needed.
+     * Can only be called once; subsequent calls will throw an error.
+     *
+     * @public
+     * @static
+     * @param config - The configuration for the sheet service.
+     * @throws Error if already configured.
+     *
+     * @example
+     * ```typescript
+     * SheetService.configure({
+     *     closeOnNavigation: true,
+     *     behaviors: [myCustomBehavior]
+     * });
+     * ```
+     */
+    static configure(config: Partial<ISheetServiceConfig>): void;
+    /**
+     * Opens a custom wrapper component containing a sheet within a portal.
+     *
+     * @public
+     * @template T - Type of the wrapper component extending HTMLElement.
+     * @template TData - Type of data provided to the wrapper component.
+     * @template TResult - Expected return type of the resolved sheet result.
+     * @param sheetId - Unique identifier for the sheet instance.
+     * @param wrapperClass - Class of the wrapper component containing the sheet.
+     * @param options - Properties for portal and sheet.
+     * @param data - Optional data passed to the wrapper component.
+     * @returns A promise resolving with the sheet result.
+     */
+    open<T extends HTMLElement, TData, TResult>(sheetId: string, wrapperClass: new (args?: TData) => T, options?: ISheetOptions, data?: TData): Promise<TResult>;
+    /**
+     * Closes the sheet in the wrapper component and optionally removes the wrapper from the DOM.
+     *
+     * @public
+     * @template TResult - Type of result returned when the sheet is closed.
+     * @param sheetId - Unique identifier for the sheet instance.
+     * @param result - Optional result returned when closing the sheet.
+     * @returns A promise resolving once the sheet is fully closed.
+     */
+    close<TResult>(sheetId: string, result?: TResult): Promise<void>;
+    /**
+     * Disposes of the service and cleans up resources.
+     *
+     * @public
+     */
+    dispose(): void;
+    /**
+     * Extends the sheet component by placing it within a portal structure.
+     *
+     * @private
+     * @param element - The element to place within the portal.
+     * @param props - Properties to set on the portal.
+     * @returns The created PortalProjectionElement containing the sheet.
+     */
+    private extendToPortal;
+}
+//# sourceMappingURL=SheetService.d.ts.map

package/Controls/Components/Overlays/Sheet/SheetService.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SheetService.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Overlays/Sheet/SheetService.ts"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,6CAA6C,CAAC;AAEvF,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,iDAAiD,CAAC;AAC/F,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC/D,OAAO,KAAK,EAAE,mBAAmB,EAAkB,MAAM,uBAAuB,CAAC;AAKjF;;;;GAIG;AACH,MAAM,MAAM,oBAAoB,GAAG,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;AAE7D;;;;GAIG;AACH,MAAM,WAAW,SAAS;IACtB,OAAO,EAAE,MAAM,CAAC;IAChB,YAAY,EAAE,YAAY,CAAC;IAC3B,uBAAuB,EAAE,uBAAuB,CAAC;IACjD,cAAc,EAAE,WAAW,CAAC;IAC5B,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,OAAO,CAAC,EAAE,oBAAoB,CAAC;CAClC;AAcD;;;;GAIG;AACH,MAAM,WAAW,aAAc,SAAQ,OAAO,CAAC,kBAAkB,CAAC,EAAE,OAAO,CAAC,mBAAmB,CAAC;IAC5F,eAAe,CAAC,EAAE,OAAO,CAAC;CAC7B;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,qBAAa,YAAY;IAIrB,OAAO,CAAC,MAAM,CAAC,SAAS,CAA6B;IACrD,OAAO,CAAC,MAAM,CAAC,OAAO,CAAqD;IAC3E,OAAO,CAAC,MAAM,CAAC,aAAa,CAAkB;IAC9C,OAAO,CAAC,QAAQ,CAAC,SAAS,CAAyB;IACnD,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAgC;IAC3D,OAAO,CAAC,cAAc,CAAC,CAAgB;IAMvC;;;;;OAKG;IACH,OAAO;IAqBP;;;;;;OAMG;IACH,WAAkB,QAAQ,IAAI,YAAY,CAIzC;IAMD;;;;;;;;;;;;;;;;;OAiBG;WACW,SAAS,CAAC,MAAM,EAAE,OAAO,CAAC,mBAAmB,CAAC,GAAG,IAAI;IAYnE;;;;;;;;;;;;OAYG;IACU,IAAI,CAAC,CAAC,SAAS,WAAW,EAAE,KAAK,EAAE,OAAO,EACnD,OAAO,EAAE,MAAM,EACf,YAAY,EAAE,KAAK,IAAI,CAAC,EAAE,KAAK,KAAK,CAAC,EACrC,OAAO,CAAC,EAAE,aAAa,EACvB,IAAI,CAAC,EAAE,KAAK,GACb,OAAO,CAAC,OAAO,CAAC;IA0DnB;;;;;;;;OAQG;IACU,KAAK,CAAC,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE,OAAO,GAAG,OAAO,CAAC,IAAI,CAAC;IA8B7E;;;;OAIG;IACI,OAAO,IAAI,IAAI;IAoBtB;;;;;;;OAOG;IACH,OAAO,CAAC,cAAc;CAmBzB"}

package/Controls/Components/Overlays/Sheet/SheetService.js

@@ -0,0 +1,250 @@
+// #region Imports
+import { RendererServiceLocator } from '../../../../Dom/Renderer';
+import { on, waitForEvent } from '@breadstone/mosaik-elements';
+import { EID } from '../../../../Utilities/EId';
+import { PortalElement } from '../../Primitives/Portal/PortalElement';
+import { SheetElement } from './SheetElement';
+import { SHEET_SERVICE_DEFAULT_CONFIG } from './ISheetServiceConfig';
+/**
+ * Represents the `SHEET_DEFAULT_OPTIONS` constant.
+ *
+ * @private
+ */
+const SHEET_DEFAULT_OPTIONS = {
+    content: '',
+    header: '',
+    height: 'auto',
+    icon: ''
+};
+/**
+ * Service for managing the display and behavior of sheet elements.
+ * Provides methods to open and close sheets within a portal structure.
+ *
+ * Uses a singleton pattern with static configuration.
+ *
+ * @example
+ * ```typescript
+ * // Configure once at app startup
+ * SheetService.configure({
+ *     closeOnNavigation: true,
+ *     behaviors: []
+ * });
+ *
+ * // Use throughout the app
+ * const result = await SheetService.instance.open('mySheet', MySheetWrapper);
+ * ```
+ *
+ * @public
+ */
+export class SheetService {
+    // #region Fields
+    static _instance = null;
+    static _config = SHEET_SERVICE_DEFAULT_CONFIG;
+    static _isConfigured = false;
+    _sheetMap;
+    _behaviors;
+    _portalElement;
+    // #endregion
+    // #region Ctor
+    /**
+     * Constructs a new instance of the `SheetService` class.
+     * Use `SheetService.configure()` and `SheetService.instance` instead of direct instantiation.
+     *
+     * @private
+     */
+    constructor(config) {
+        this._sheetMap = new Map();
+        this._behaviors = config.behaviors ?? [];
+        if (config.closeOnNavigation !== false) {
+            on(window, 'popstate', () => {
+                if (this._sheetMap.size > 0) {
+                    for (const [key, value] of this._sheetMap) {
+                        if (value.options?.navigateToClose) {
+                            void this.close(key);
+                        }
+                    }
+                }
+            });
+        }
+    }
+    // #endregion
+    // #region Properties
+    /**
+     * Gets the singleton instance of `SheetService`.
+     * If not configured, uses default configuration.
+     *
+     * @public
+     * @static
+     */
+    static get instance() {
+        SheetService._instance ??= new SheetService(SheetService._config);
+        return SheetService._instance;
+    }
+    // #endregion
+    // #region Methods
+    /**
+     * Configures the `SheetService` globally.
+     * Must be called before accessing `instance` if custom configuration is needed.
+     * Can only be called once; subsequent calls will throw an error.
+     *
+     * @public
+     * @static
+     * @param config - The configuration for the sheet service.
+     * @throws Error if already configured.
+     *
+     * @example
+     * ```typescript
+     * SheetService.configure({
+     *     closeOnNavigation: true,
+     *     behaviors: [myCustomBehavior]
+     * });
+     * ```
+     */
+    static configure(config) {
+        if (SheetService._isConfigured) {
+            throw new Error('SheetService has already been configured. Configuration can only be set once.');
+        }
+        SheetService._config = {
+            ...SHEET_SERVICE_DEFAULT_CONFIG,
+            ...config
+        };
+        SheetService._isConfigured = true;
+    }
+    /**
+     * Opens a custom wrapper component containing a sheet within a portal.
+     *
+     * @public
+     * @template T - Type of the wrapper component extending HTMLElement.
+     * @template TData - Type of data provided to the wrapper component.
+     * @template TResult - Expected return type of the resolved sheet result.
+     * @param sheetId - Unique identifier for the sheet instance.
+     * @param wrapperClass - Class of the wrapper component containing the sheet.
+     * @param options - Properties for portal and sheet.
+     * @param data - Optional data passed to the wrapper component.
+     * @returns A promise resolving with the sheet result.
+     */
+    async open(sheetId, wrapperClass, options, data) {
+        // Allow behaviors to configure options
+        const mergedOptions = { ...options };
+        for (const behavior of this._behaviors) {
+            behavior.configure(mergedOptions);
+        }
+        let ref = this._sheetMap.get(sheetId);
+        if (!ref) {
+            const wrapperElement = new wrapperClass(data);
+            RendererServiceLocator.current.setProperty(wrapperElement, 'id', sheetId);
+            const portalProjection = await this.extendToPortal(wrapperElement, mergedOptions);
+            const sheetElement = wrapperElement.shadowRoot?.querySelector(SheetElement.is);
+            if (!sheetElement) {
+                throw new Error(`Sheet element not found within wrapper for ID "${sheetId}".`);
+            }
+            ref = {
+                sheetId,
+                sheetElement,
+                portalProjectionElement: portalProjection,
+                wrapperElement,
+                options: mergedOptions
+            };
+            this._sheetMap.set(sheetId, ref);
+        }
+        Object.assign(ref.sheetElement, {
+            ...SHEET_DEFAULT_OPTIONS,
+            ...mergedOptions
+        });
+        // Notify behaviors about attachment
+        for (const behavior of this._behaviors) {
+            behavior.attach(ref);
+        }
+        return new Promise((resolve) => {
+            ref.resolve = resolve;
+            void ref.sheetElement.open();
+            void waitForEvent(ref.sheetElement, 'closed').then(() => {
+                // Notify behaviors about detachment
+                for (const behavior of this._behaviors) {
+                    behavior.detach(ref);
+                }
+                this._sheetMap.delete(sheetId);
+                void ref.portalProjectionElement.close();
+                ref.portalProjectionElement.remove();
+            });
+        });
+    }
+    /**
+     * Closes the sheet in the wrapper component and optionally removes the wrapper from the DOM.
+     *
+     * @public
+     * @template TResult - Type of result returned when the sheet is closed.
+     * @param sheetId - Unique identifier for the sheet instance.
+     * @param result - Optional result returned when closing the sheet.
+     * @returns A promise resolving once the sheet is fully closed.
+     */
+    async close(sheetId, result) {
+        return new Promise((resolve) => {
+            const ref = this._sheetMap.get(sheetId);
+            if (ref) {
+                this._sheetMap.delete(sheetId);
+                void waitForEvent(ref.sheetElement, 'closed').then(() => {
+                    // Notify behaviors about detachment
+                    for (const behavior of this._behaviors) {
+                        behavior.detach(ref);
+                    }
+                    void ref.portalProjectionElement.close();
+                    ref.portalProjectionElement.remove();
+                    if (ref.resolve) {
+                        ref.resolve(result);
+                    }
+                    resolve();
+                });
+                void ref.sheetElement.close();
+            }
+            else {
+                console.error(`Wrapper with ID "${sheetId}" not found.`);
+                resolve();
+            }
+        });
+    }
+    /**
+     * Disposes of the service and cleans up resources.
+     *
+     * @public
+     */
+    dispose() {
+        // Dispose all behaviors
+        for (const behavior of this._behaviors) {
+            behavior.dispose();
+        }
+        // Close all open sheets
+        for (const [id] of this._sheetMap) {
+            void this.close(id);
+        }
+        this._sheetMap.clear();
+        // Clean up portal
+        if (this._portalElement) {
+            this._portalElement.remove();
+            this._portalElement = undefined;
+        }
+    }
+    /**
+     * Extends the sheet component by placing it within a portal structure.
+     *
+     * @private
+     * @param element - The element to place within the portal.
+     * @param props - Properties to set on the portal.
+     * @returns The created PortalProjectionElement containing the sheet.
+     */
+    extendToPortal(element, props) {
+        return new Promise((resolve) => {
+            if (!this._portalElement) {
+                this._portalElement = RendererServiceLocator.current.createElement(PortalElement.is);
+                RendererServiceLocator.current.setAttribute(this._portalElement, 'id', EID.next(PortalElement.is));
+                Object.assign(this._portalElement, props);
+                RendererServiceLocator.current.appendChild(document.body, this._portalElement);
+            }
+            this._portalElement.addEventListener('portalAttached', (e) => {
+                resolve(e.detail.projection);
+            }, { once: true });
+            RendererServiceLocator.current.appendChild(this._portalElement, element);
+        });
+    }
+}
+//# sourceMappingURL=SheetService.js.map

package/Controls/Components/Overlays/Sheet/SheetService.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SheetService.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/Overlays/Sheet/SheetService.ts"],"names":[],"mappings":"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"}

package/Controls/Components/Overlays/Sheet/Themes/SheetElement.Cosmopolitan.d.ts

@@ -0,0 +1,6 @@
+import { type CSSResult } from '../../../../../Dom/Css';
+/**
+ * @public
+ */
+export declare function sheetElementCosmopolitanStyle(): CSSResult;
+//# sourceMappingURL=SheetElement.Cosmopolitan.d.ts.map

package/Controls/Components/Overlays/Sheet/Themes/SheetElement.Cosmopolitan.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SheetElement.Cosmopolitan.d.ts","sourceRoot":"","sources":["../../../../../../src/Controls/Components/Overlays/Sheet/Themes/SheetElement.Cosmopolitan.ts"],"names":[],"mappings":"AASA,OAAO,EAAO,KAAK,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAI7D;;GAEG;AACH,wBAAgB,6BAA6B,IAAI,SAAS,CAsKzD"}

package/Controls/Components/Overlays/Sheet/Themes/SheetElement.Cosmopolitan.js

@@ -0,0 +1,180 @@
+// ------------------------------------------------------------------------------
+// <auto-generated>
+//     This code was generated by a tool.
+//     Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
+// </auto-generated>
+// ------------------------------------------------------------------------------
+// #region Imports
+import { css } from '../../../../../Dom/Css';
+// #endregion
+/**
+ * @public
+ */
+export function sheetElementCosmopolitanStyle() {
+    return css `
+:host {
+  --sheet-background-color: unset;
+  --sheet-border-color: unset;
+  --sheet-border-width: unset;
+  --sheet-font-family: unset;
+  --sheet-font-letter-spacing: unset;
+  --sheet-font-line-height: unset;
+  --sheet-font-size: unset;
+  --sheet-font-text-decoration: unset;
+  --sheet-font-text-transform: unset;
+  --sheet-font-weight: unset;
+  --sheet-foreground-color: unset;
+  --sheet-gap: unset;
+  --sheet-padding-bottom: unset;
+  --sheet-padding-left: unset;
+  --sheet-padding-right: unset;
+  --sheet-padding-top: unset;
+  --sheet-transition-duration: unset;
+  --sheet-transition-mode: unset;
+  --sheet-transition-property: unset;
+  --sheet-translate: unset;
+  --sheet-translate-y: unset;
+}
+
+@media screen and (prefers-reduced-motion: reduce) {
+  :host {
+    transition-duration: .01ms;
+  }
+}
+
+:host {
+  box-sizing: border-box;
+  display: block;
+  position: relative;
+}
+
+:host *, :host :before, :host :after {
+  box-sizing: border-box;
+  background-repeat: no-repeat;
+}
+
+:host :before, :host :after {
+  text-decoration: inherit;
+  vertical-align: inherit;
+}
+
+:host([hidden]) {
+  display: none !important;
+}
+
+:host [part="root"] {
+  font-family: var(--sheet-font-family);
+  font-size: var(--sheet-font-size);
+  line-height: var(--sheet-font-line-height);
+  font-weight: var(--sheet-font-weight);
+  letter-spacing: var(--sheet-font-letter-spacing);
+  -webkit-text-decoration: var(--sheet-font-text-decoration);
+  text-decoration: var(--sheet-font-text-decoration);
+  text-transform: var(--sheet-font-text-transform);
+  background-color: var(--sheet-background-color);
+  border-color: var(--sheet-border-color);
+  color: var(--sheet-foreground-color);
+  opacity: 0;
+  visibility: hidden;
+  z-index: 2147483001;
+  filter: drop-shadow(0 5px 15px #0000004d);
+  border-radius: 15px 15px 0 0;
+  grid-template-columns: 1fr;
+  width: 100%;
+  max-width: 414px;
+  min-height: 90px;
+  margin: 0 auto;
+  padding-bottom: 35px;
+  font-size: 15px;
+  transition: top .5s ease-in-out, opacity .8s ease-in-out, max-height .35s ease-in-out;
+  display: grid;
+  position: fixed;
+  inset: 0 0 auto;
+  overflow: hidden;
+  transform: translateY(100vh);
+}
+
+:host [part="root"] [part="heading"] {
+  position: relative;
+}
+
+:host [part="root"] [part="heading"] [part="thumb"] {
+  box-sizing: border-box;
+  cursor: grab;
+  width: 100%;
+  height: 30px;
+  padding-top: 8px;
+}
+
+:host [part="root"] [part="heading"] [part="thumb"]:active {
+  cursor: grabbing;
+}
+
+:host [part="root"] [part="heading"] [part="thumb"]:before {
+  background: var(--sheet-border-color);
+  content: "";
+  border-radius: 3px;
+  width: 40px;
+  height: 5px;
+  margin: 0 auto;
+  display: block;
+}
+
+:host [part="root"] [part="heading"] [part="header"] {
+  grid-gap: 16px;
+  padding-left: var(--sheet-padding-left);
+  padding-right: var(--sheet-padding-right);
+  padding-bottom: var(--sheet-padding-bottom);
+  grid-template-columns: max-content 1fr max-content;
+  padding-top: 0;
+  display: grid;
+}
+
+:host [part="root"] [part="heading"] [part="header"] [part="headerText"] {
+  font-size: 18px;
+  font-weight: 500;
+  line-height: 24px;
+}
+
+:host [part="root"] [part="heading"]:after {
+  content: "";
+  height: calc(var(--sheet-border-width) / 2);
+  background-color: var(--sheet-border-color);
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  right: 0;
+}
+
+:host [part="root"] [part="content"] {
+  padding-left: var(--sheet-padding-left);
+  padding-right: var(--sheet-padding-right);
+  padding-bottom: var(--sheet-padding-bottom);
+  padding-top: var(--sheet-padding-top);
+  overflow: auto;
+}
+
+:host [part="root"] [part="content"] [part="contentText"] {
+  text-overflow: ellipsis;
+  text-align: left;
+  -webkit-box-orient: vertical;
+  grid-column: 1 / 3;
+  max-height: 150px;
+  margin: 0 0 15px;
+  padding: 15px 20px 0;
+  font-weight: 400;
+  line-height: 20px;
+  display: -webkit-box;
+  overflow: hidden auto;
+}
+
+:host([is-open]) [part="root"] {
+  opacity: 1;
+  visibility: visible;
+  top: 12px;
+  transform: translateY(calc(100vh - 74px));
+}
+
+    `;
+}
+//# sourceMappingURL=SheetElement.Cosmopolitan.js.map

package/Controls/Components/Overlays/Sheet/Themes/SheetElement.Cosmopolitan.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SheetElement.Cosmopolitan.js","sourceRoot":"","sources":["../../../../../../src/Controls/Components/Overlays/Sheet/Themes/SheetElement.Cosmopolitan.ts"],"names":[],"mappings":"AAAA,iFAAiF;AACjF,mBAAmB;AACnB,yCAAyC;AACzC,qGAAqG;AACrG,oBAAoB;AACpB,iFAAiF;AAEjF,kBAAkB;AAElB,OAAO,EAAE,GAAG,EAAkB,MAAM,wBAAwB,CAAC;AAE7D,aAAa;AAEb;;GAEG;AACH,MAAM,UAAU,6BAA6B;IACzC,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAoKT,CAAC;AACN,CAAC"}

package/Controls/Components/Overlays/Sheet/Themes/SheetElement.Joy.d.ts

@@ -0,0 +1,6 @@
+import { type CSSResult } from '../../../../../Dom/Css';
+/**
+ * @public
+ */
+export declare function sheetElementJoyStyle(): CSSResult;
+//# sourceMappingURL=SheetElement.Joy.d.ts.map

package/Controls/Components/Overlays/Sheet/Themes/SheetElement.Joy.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SheetElement.Joy.d.ts","sourceRoot":"","sources":["../../../../../../src/Controls/Components/Overlays/Sheet/Themes/SheetElement.Joy.ts"],"names":[],"mappings":"AASA,OAAO,EAAO,KAAK,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAI7D;;GAEG;AACH,wBAAgB,oBAAoB,IAAI,SAAS,CAqKhD"}