@design.estate/dees-catalog 3.94.0 → 3.96.0

package/dist_ts_web/00_commitinfo_data.js

@@ -3,7 +3,7 @@
  */
 export const commitinfo = {
     name: '@design.estate/dees-catalog',
-    version: '3.94.0',
+    version: '3.96.0',
     description: 'A comprehensive library that provides dynamic web components for building sophisticated and modern web applications using JavaScript and TypeScript.'
 };
 //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiMDBfY29tbWl0aW5mb19kYXRhLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vdHNfd2ViLzAwX2NvbW1pdGluZm9fZGF0YS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7R0FFRztBQUNILE1BQU0sQ0FBQyxNQUFNLFVBQVUsR0FBRztJQUN4QixJQUFJLEVBQUUsNkJBQTZCO0lBQ25DLE9BQU8sRUFBRSxRQUFRO0lBQ2pCLFdBQVcsRUFBRSxzSkFBc0o7Q0FDcEssQ0FBQSJ9

package/dist_ts_web/elements/00group-layout/dees-mosaic/dees-mosaic.d.ts

@@ -0,0 +1,49 @@
+import { DeesElement, type TemplateResult } from '@design.estate/dees-element';
+import type { IMosaicLayout, IMosaicSurfaceMeta, TMosaicLayoutChangeReason } from './types.js';
+import { type IMosaicDropTarget } from './interaction.js';
+import '../../00group-utility/dees-icon/dees-icon.js';
+declare global {
+    interface HTMLElementTagNameMap {
+        'dees-mosaic': DeesMosaic;
+    }
+}
+/**
+ * Sway-like tiling workspace. Controlled component: the host owns `layout`
+ * and applies the complete next layouts emitted through
+ * `mosaic-layout-change`. Tile content projects through named slots
+ * (`slot="tile-<leafId>"`) so hosts keep light-DOM ownership — the load-
+ * bearing property for Electron webviews, which must never be reparented
+ * (slot reassignment is safe; verified by spike).
+ */
+export declare class DeesMosaic extends DeesElement {
+    static demo: () => TemplateResult<1>;
+    static demoGroups: string[];
+    accessor layout: IMosaicLayout;
+    accessor surfaces: Record<string, IMosaicSurfaceMeta>;
+    accessor focusedLeafId: string;
+    accessor minTileWidth: number;
+    accessor minTileHeight: number;
+    accessor tilebarHeight: number;
+    accessor resizeEnabled: boolean;
+    accessor dragEnabled: boolean;
+    /** transient drop-target highlight during a tile drag */
+    accessor dropTarget: IMosaicDropTarget | null;
+    private dragController;
+    /** cancels an in-flight divider drag when the host disconnects mid-gesture */
+    private activeDividerCancel;
+    disconnectedCallback(): Promise<void>;
+    static styles: import("@design.estate/dees-element").CSSResult[];
+    render(): TemplateResult;
+    private renderNode;
+    private renderDropPreview;
+    /** Content-area rect per leaf id, in viewport coordinates. */
+    getLeafRects(): Record<string, DOMRect>;
+    equalize(splitId?: string): void;
+    focusTile(leafId: string): void;
+    commitLayout(layout: IMosaicLayout, reason: TMosaicLayoutChangeReason): void;
+    private requestCloseTile;
+    private emitTileEvent;
+    private handleRootPointerDown;
+    private handleDividerPointerDown;
+    private handleDividerKeydown;
+}

package/dist_ts_web/elements/00group-layout/dees-mosaic/dees-mosaic.demo.d.ts

@@ -0,0 +1 @@
+export declare const demoFunc: () => import("@design.estate/dees-element").TemplateResult<1>;

package/dist_ts_web/elements/00group-layout/dees-mosaic/dees-mosaic.demo.js

@@ -0,0 +1,82 @@
+import { html } from '@design.estate/dees-element';
+import { createMosaicLeaf, mosaicInsert } from './tree.js';
+const buildDefaultLayout = () => {
+    let layout = mosaicInsert({ root: null }, null, 'right', createMosaicLeaf('editor', 'leaf-editor'));
+    layout = mosaicInsert(layout, 'leaf-editor', 'right', createMosaicLeaf('chat', 'leaf-chat'));
+    layout = mosaicInsert(layout, null, 'bottom', createMosaicLeaf('terminal', 'leaf-terminal'));
+    return layout;
+};
+const surfaceMeta = {
+    editor: { title: 'Editor', icon: 'lucide:Code' },
+    chat: { title: 'AI Chat', icon: 'lucide:BotMessageSquare' },
+    terminal: { title: 'Terminal', icon: 'lucide:SquareTerminal' },
+    browser: { title: 'Browser', icon: 'lucide:Globe' },
+};
+let tileCounter = 0;
+const addBrowserTile = (event) => {
+    const mosaic = event.target.closest('.mosaicDemo')?.querySelector('dees-mosaic');
+    if (!mosaic)
+        return;
+    tileCounter += 1;
+    const leaf = createMosaicLeaf('browser', `leaf-browser-${tileCounter}`);
+    mosaic.layout = mosaicInsert(mosaic.layout, 'leaf-chat', 'bottom', leaf);
+};
+export const demoFunc = () => html `
+  <style>
+    .mosaicDemo {
+      display: grid;
+      grid-template-rows: auto minmax(0, 1fr);
+      gap: 12px;
+      height: 640px;
+      max-width: 1000px;
+      margin: 40px auto;
+    }
+    .mosaicDemo .surfaceBody {
+      display: grid;
+      place-content: center;
+      gap: 6px;
+      height: 100%;
+      text-align: center;
+      color: var(--dees-color-text-secondary);
+      font-size: 12px;
+      background: var(--dees-color-bg-primary);
+    }
+    .mosaicDemo .surfaceBody strong {
+      color: var(--dees-color-text-primary);
+      font-size: 14px;
+    }
+    .mosaicDemo .emptyHint {
+      color: var(--dees-color-text-secondary);
+      font-size: 13px;
+    }
+  </style>
+  <div
+    class="mosaicDemo"
+    @mosaic-layout-change=${(event) => {
+    const mosaic = event.target;
+    mosaic.layout = event.detail.layout;
+    console.log('mosaic-layout-change', event.detail.reason, event.detail.layout);
+}}
+    @mosaic-tile-close=${(event) => console.log('mosaic-tile-close', event.detail)}
+    @mosaic-tile-focus=${(event) => {
+    event.target.focusedLeafId = event.detail.leafId;
+}}
+  >
+    <div>
+      <dees-button @clicked=${addBrowserTile}>Add browser tile below chat</dees-button>
+    </div>
+    <dees-mosaic
+      .layout=${buildDefaultLayout()}
+      .surfaces=${surfaceMeta}
+      focusedLeafId="leaf-editor"
+    >
+      <div slot="tile-leaf-editor" class="surfaceBody"><strong>Editor</strong><span>drag my tilebar; resize the shared edges</span></div>
+      <div slot="tile-leaf-chat" class="surfaceBody"><strong>AI Chat</strong><span>docked right</span></div>
+      <div slot="tile-leaf-terminal" class="surfaceBody"><strong>Terminal</strong><span>stacked from below</span></div>
+      <div slot="tile-leaf-browser-1" class="surfaceBody"><strong>Browser 1</strong></div>
+      <div slot="tile-leaf-browser-2" class="surfaceBody"><strong>Browser 2</strong></div>
+      <div slot="empty" class="emptyHint">Workspace is empty — add a tile.</div>
+    </dees-mosaic>
+  </div>
+`;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGVlcy1tb3NhaWMuZGVtby5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3RzX3dlYi9lbGVtZW50cy8wMGdyb3VwLWxheW91dC9kZWVzLW1vc2FpYy9kZWVzLW1vc2FpYy5kZW1vLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxJQUFJLEVBQUUsTUFBTSw2QkFBNkIsQ0FBQztBQUduRCxPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsWUFBWSxFQUFFLE1BQU0sV0FBVyxDQUFDO0FBRTNELE1BQU0sa0JBQWtCLEdBQUcsR0FBa0IsRUFBRTtJQUM3QyxJQUFJLE1BQU0sR0FBRyxZQUFZLENBQUMsRUFBRSxJQUFJLEVBQUUsSUFBSSxFQUFFLEVBQUUsSUFBSSxFQUFFLE9BQU8sRUFBRSxnQkFBZ0IsQ0FBQyxRQUFRLEVBQUUsYUFBYSxDQUFDLENBQUMsQ0FBQztJQUNwRyxNQUFNLEdBQUcsWUFBWSxDQUFDLE1BQU0sRUFBRSxhQUFhLEVBQUUsT0FBTyxFQUFFLGdCQUFnQixDQUFDLE1BQU0sRUFBRSxXQUFXLENBQUMsQ0FBQyxDQUFDO0lBQzdGLE1BQU0sR0FBRyxZQUFZLENBQUMsTUFBTSxFQUFFLElBQUksRUFBRSxRQUFRLEVBQUUsZ0JBQWdCLENBQUMsVUFBVSxFQUFFLGVBQWUsQ0FBQyxDQUFDLENBQUM7SUFDN0YsT0FBTyxNQUFNLENBQUM7QUFDaEIsQ0FBQyxDQUFDO0FBRUYsTUFBTSxXQUFXLEdBQUc7SUFDbEIsTUFBTSxFQUFFLEVBQUUsS0FBSyxFQUFFLFFBQVEsRUFBRSxJQUFJLEVBQUUsYUFBYSxFQUFFO0lBQ2hELElBQUksRUFBRSxFQUFFLEtBQUssRUFBRSxTQUFTLEVBQUUsSUFBSSxFQUFFLHlCQUF5QixFQUFFO0lBQzNELFFBQVEsRUFBRSxFQUFFLEtBQUssRUFBRSxVQUFVLEVBQUUsSUFBSSxFQUFFLHVCQUF1QixFQUFFO0lBQzlELE9BQU8sRUFBRSxFQUFFLEtBQUssRUFBRSxTQUFTLEVBQUUsSUFBSSxFQUFFLGNBQWMsRUFBRTtDQUNwRCxDQUFDO0FBRUYsSUFBSSxXQUFXLEdBQUcsQ0FBQyxDQUFDO0FBRXBCLE1BQU0sY0FBYyxHQUFHLENBQUMsS0FBaUIsRUFBRSxFQUFFO0lBQzNDLE1BQU0sTUFBTSxHQUFJLEtBQUssQ0FBQyxNQUFzQixDQUFDLE9BQU8sQ0FBQyxhQUFhLENBQUMsRUFBRSxhQUFhLENBQUMsYUFBYSxDQUFzQixDQUFDO0lBQ3ZILElBQUksQ0FBQyxNQUFNO1FBQUUsT0FBTztJQUNwQixXQUFXLElBQUksQ0FBQyxDQUFDO0lBQ2pCLE1BQU0sSUFBSSxHQUFHLGdCQUFnQixDQUFDLFNBQVMsRUFBRSxnQkFBZ0IsV0FBVyxFQUFFLENBQUMsQ0FBQztJQUN4RSxNQUFNLENBQUMsTUFBTSxHQUFHLFlBQVksQ0FBQyxNQUFNLENBQUMsTUFBTSxFQUFFLFdBQVcsRUFBRSxRQUFRLEVBQUUsSUFBSSxDQUFDLENBQUM7QUFDM0UsQ0FBQyxDQUFDO0FBRUYsTUFBTSxDQUFDLE1BQU0sUUFBUSxHQUFHLEdBQUcsRUFBRSxDQUFDLElBQUksQ0FBQTs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs0QkErQk4sQ0FBQyxLQUFrQixFQUFFLEVBQUU7SUFDN0MsTUFBTSxNQUFNLEdBQUksS0FBSyxDQUFDLE1BQXNCLENBQUM7SUFDNUMsTUFBcUIsQ0FBQyxNQUFNLEdBQUcsS0FBSyxDQUFDLE1BQU0sQ0FBQyxNQUFNLENBQUM7SUFDcEQsT0FBTyxDQUFDLEdBQUcsQ0FBQyxzQkFBc0IsRUFBRSxLQUFLLENBQUMsTUFBTSxDQUFDLE1BQU0sRUFBRSxLQUFLLENBQUMsTUFBTSxDQUFDLE1BQU0sQ0FBQyxDQUFDO0FBQ2hGLENBQUM7eUJBQ29CLENBQUMsS0FBa0IsRUFBRSxFQUFFLENBQUMsT0FBTyxDQUFDLEdBQUcsQ0FBQyxtQkFBbUIsRUFBRSxLQUFLLENBQUMsTUFBTSxDQUFDO3lCQUN0RSxDQUFDLEtBQWtCLEVBQUUsRUFBRTtJQUN4QyxLQUFLLENBQUMsTUFBcUMsQ0FBQyxhQUFhLEdBQUcsS0FBSyxDQUFDLE1BQU0sQ0FBQyxNQUFNLENBQUM7QUFDcEYsQ0FBQzs7OzhCQUd5QixjQUFjOzs7Z0JBRzVCLGtCQUFrQixFQUFFO2tCQUNsQixXQUFXOzs7Ozs7Ozs7OztDQVc1QixDQUFDIn0=