@blueprintui/cli 0.0.6 → 0.0.9

package/src/.rollup.cache/@blueprintui/grid/Users/coryrylan/Repos/blueprintui/grid/dist/lib/column/grid-column-size.controller.js

@@ -0,0 +1,56 @@
+import { isNumericString, listenForAttributeListChange, onFirstInteraction } from '@blueprintui/components/internals';
+export class GridColumnSizeController {
+    host;
+    #observers = [];
+    get #hostGrid() {
+        return this.host.parentElement;
+    }
+    get #hostRange() {
+        return this.host.shadowRoot?.querySelector('bp-split-handle input');
+    }
+    constructor(host) {
+        this.host = host;
+        this.host.addController(this);
+    }
+    async hostConnected() {
+        this.#setActionWidth();
+        this.#hostGrid.shadowRoot?.addEventListener('slotchange', () => this.#setActionWidth());
+        this.#observers.push(listenForAttributeListChange(this.host, ['type'], () => this.#setActionWidth()));
+        await this.host.updateComplete;
+        await onFirstInteraction(this.#hostGrid);
+        if (this.#hostRange) {
+            this.#hostRange.max = `${parseInt(getComputedStyle(this.#hostGrid).width)}`;
+            this.#hostRange.value = `${parseInt(getComputedStyle(this.host).width)}`;
+            this.#hostRange.addEventListener('input', (e) => this.#updateResizedColumnWidth(e.target.valueAsNumber));
+            this.#hostRange.addEventListener('change', (e) => this.#updateResizedColumnWidth(e.target.valueAsNumber));
+        }
+    }
+    async hostUpdated() {
+        await this.host.updateComplete;
+        this.#updateSetColumnWidth();
+    }
+    hostDisconnected() {
+        this.#observers.forEach(o => o.disconnect());
+    }
+    #setActionWidth() {
+        if (this.host.type === 'action' || this.host.getAttribute('type') === 'action') {
+            this.host.width = '36px';
+            const index = Array.from(this.#hostGrid.columns).indexOf(this.host);
+            this.#hostGrid.rows.forEach(r => r.cells[index].setAttribute('type', 'action'));
+        }
+    }
+    #updateSetColumnWidth() {
+        if (this.host.width && this.host.ariaColIndex !== null) {
+            this.#hostGrid.style.setProperty(`--ch${this.host.ariaColIndex}`, isNumericString(this.host.width) ? `${this.host.width}px` : this.host.width);
+            if (this.#hostRange) {
+                this.#hostRange.min = `${parseInt(this.host.width)}` ?? '';
+                this.#hostRange.value = this.host.width;
+            }
+        }
+    }
+    #updateResizedColumnWidth(width) {
+        this.host.dispatchEvent(new CustomEvent('resizeChange', { detail: width, bubbles: true }));
+        const updatedWidth = Math.max(isNumericString(this.host.width) || this.host.width?.includes('px') ? parseInt(this.host.width) : 36, width);
+        this.#hostGrid.style.setProperty(`--ch${this.host.ariaColIndex}`, `${updatedWidth}px`);
+    }
+}

package/src/.rollup.cache/@blueprintui/grid/Users/coryrylan/Repos/blueprintui/grid/dist/lib/column/grid-column.element.d.ts

@@ -0,0 +1,65 @@
+import { LitElement } from 'lit';
+/**
+ * Grid Column
+ *
+ * ```typescript
+ * import '@blueprintui/grid/include/base.js';
+ * ```
+ *
+ * @element bp-grid-column
+ * @event resize - notifies when column has been resized
+ * @cssprop --min-height
+ * @cssprop --min-width
+ * @cssprop --justify-content
+ * @cssprop --padding-block
+ * @cssprop --padding-inline-start
+ * @cssprop --padding-inline-end
+ */
+export declare class BpGridColumn extends LitElement {
+    #private;
+    i18n: {
+        sort: string;
+        expand: string;
+        close: string;
+        resize: string;
+        filter: string;
+        loading: string;
+        show: string;
+        hide: string;
+        previous: string;
+        next: string;
+        first: string;
+        last: string;
+        today: string;
+        browse: string;
+        removeFile: string;
+        files: string;
+        resizeColumn: string;
+        closeDetails: string;
+        noData: string;
+        action: string;
+        dropTarget: string;
+        firstPage: string;
+        previousPage: string;
+        nextPage: string;
+        lastPage: string;
+        pageSize: string;
+    };
+    width: string;
+    resizable: boolean;
+    type: '' | 'action';
+    position: '' | 'sticky' | 'fixed';
+    static styles: CSSStyleSheet[];
+    /**
+     * Role group prevents double label read when navigating cells with SRs
+     * https://github.com/nvaccess/nvda/pull/12763
+     * https://github.com/nvaccess/nvda/issues/12392
+     * https://github.com/nvaccess/nvda/issues/11181
+     * https://github.com/nvaccess/nvda/issues/10096
+     * https://github.com/nvaccess/nvda/issues/9017
+     * https://github.com/nvaccess/nvda/issues/6826
+     */
+    render(): import("lit-html").TemplateResult<1>;
+    constructor();
+    connectedCallback(): void;
+}

package/src/.rollup.cache/@blueprintui/grid/Users/coryrylan/Repos/blueprintui/grid/dist/lib/column/grid-column.element.js

@@ -0,0 +1,79 @@
+import { __decorate } from "tslib";
+import { LitElement, html } from 'lit';
+import { baseStyles, I18nService, i18n } from '@blueprintui/components/internals';
+import { GridColumnSizeController } from './grid-column-size.controller.js';
+import { GridColumnPositionController } from './grid-column-position.controller.js';
+import styles from './grid-column.element.css' assert { type: 'css' };
+/**
+ * Grid Column
+ *
+ * ```typescript
+ * import '@blueprintui/grid/include/base.js';
+ * ```
+ *
+ * @element bp-grid-column
+ * @event resize - notifies when column has been resized
+ * @cssprop --min-height
+ * @cssprop --min-width
+ * @cssprop --justify-content
+ * @cssprop --padding-block
+ * @cssprop --padding-inline-start
+ * @cssprop --padding-inline-end
+ */
+let BpGridColumn = class BpGridColumn extends LitElement {
+    static properties = {
+        i18n: { type: Object },
+        width: { type: String },
+        resizable: { type: Boolean },
+        type: { type: String, reflect: true },
+        position: { type: String, reflect: true }
+    };
+    get #grid() {
+        return this.parentElement;
+    }
+    static styles = [baseStyles, styles];
+    #internals = this.attachInternals();
+    /**
+     * Role group prevents double label read when navigating cells with SRs
+     * https://github.com/nvaccess/nvda/pull/12763
+     * https://github.com/nvaccess/nvda/issues/12392
+     * https://github.com/nvaccess/nvda/issues/11181
+     * https://github.com/nvaccess/nvda/issues/10096
+     * https://github.com/nvaccess/nvda/issues/9017
+     * https://github.com/nvaccess/nvda/issues/6826
+     */
+    render() {
+        return html `
+      <div role="group" class="private-host" focusable>
+        <slot></slot>
+        ${this.resizable ? html `
+          <bp-split-handle @bpTouchStart=${() => (this.#grid.scrollLock = true)} @bpTouchEnd=${() => (this.#grid.scrollLock = false)}>
+            <input type="range" step="10" .ariaLabel=${this.i18n.resize} @change=${(e) => this.#resize(e.target.valueAsNumber)} />
+          </bp-split-handle><div class="line"></div>`
+            : html `<bp-split-handle readonly></bp-split-handle>`}
+      </div>
+    `;
+    }
+    constructor() {
+        super();
+        new GridColumnSizeController(this);
+        new GridColumnPositionController(this);
+        this.#internals.role = 'columnheader';
+        this.#internals.ariaSort = 'none';
+        this.i18n = I18nService.keys.actions;
+        this.resizable = false;
+        this.type = '';
+        this.position = '';
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        this.slot = 'columns';
+    }
+    #resize(detail) {
+        this.dispatchEvent(new CustomEvent('resize', { detail }));
+    }
+};
+BpGridColumn = __decorate([
+    i18n({ key: 'actions' })
+], BpGridColumn);
+export { BpGridColumn };

package/src/.rollup.cache/@blueprintui/grid/Users/coryrylan/Repos/blueprintui/grid/dist/lib/detail/grid-detail.element.d.ts

@@ -0,0 +1 @@
+export declare const test = 1;

package/src/.rollup.cache/@blueprintui/grid/Users/coryrylan/Repos/blueprintui/grid/dist/lib/detail/grid-detail.element.js

@@ -0,0 +1,153 @@
+// import { html, LitElement, PropertyValues } from 'lit';
+// import { property } from 'lit/decorators/property.js';
+// import {
+//   baseStyles,
+//   ClosableController,
+//   i18n,
+//   I18nService,
+//   ResponsiveController,
+//   listenForAttributeChange,
+//   propUpdated,
+//   renderAfter,
+//   ariaModal,
+//   firstFocus,
+//   focusTrap,
+//   ariaPopup,
+//   layer,
+//   closable,
+//   triggerable,
+// } from '@blueprintui/components/internals';
+// import { BpGrid } from '../grid/grid.element.js';
+// import styles from './grid-detail.element.css' assert { type: 'css' };
+// /**
+//  * Grid Detail
+//  *
+//  * ```typescript
+//  * import '@blueprintui/grid/include/base.js';
+//  * ```
+//  *
+//  * @element bp-grid-detail
+//  * @event closeChange
+//  * @csspart close
+//  * @cssprop --width
+//  * @cssprop --inset-inline-start
+//  * @cssprop --inset-inline-end
+//  * @cssprop --backdrop-background
+//  */
+// @layer<BpGridDetail>()
+// @closable<BpGridDetail>()
+// @ariaModal<BpGridDetail>()
+// @ariaPopup<BpGridDetail>()
+// @focusTrap<BpGridDetail>()
+// @firstFocus<BpGridDetail>()
+// @triggerable<BpGridDetail>()
+// export class BpGridDetail extends LitElement {
+//   @i18n() i18n = I18nService.keys.grid;
+//   @property({ type: String }) anchor: HTMLElement | string;
+//   @property({ type: String, reflect: true }) position = 'right';
+//   @property({ type: String, reflect: true }) protected overlay: '' | 'full' = '';
+//   private get grid() {
+//     return this.parentElement as BpGrid;
+//   }
+//   protected closableController: ClosableController<this>;
+//   protected responsiveController = new ResponsiveController(this, { element: this.parentElement as HTMLElement });
+//   private observer: MutationObserver;
+//   get trigger(): HTMLElement {
+//     return typeof this.anchor === 'string'
+//       ? ((this.getRootNode() as HTMLElement).querySelector<HTMLElement>(`#${this.anchor}`) as HTMLElement)
+//       : this.anchor;
+//   }
+//   static styles = [baseStyles, styles];
+//   private get closeButton() {
+//     // safari https://bugs.webkit.org/show_bug.cgi?id=174667
+//     return html` <bp-button-icon
+//       @click=${() => this.closableController.close()}
+//       shape="&times;"
+//       aria-label=${this.i18n.closeDetails}
+//       part="close"
+//     ></bp-button-icon>`;
+//   }
+//   private get triggerRow() {
+//     return this.trigger?.closest('bp-grid-row');
+//   }
+//   render() {
+//     return html`<div class="private-host" role="presentation">
+//         <div sr-only>${this.i18n.rowDetailStart}</div>
+//         <slot></slot>
+//         <div sr-only>${this.i18n.rowDetailEnd}</div>
+//       </div>
+//       <div class="caret" role="presentation"></div>`;
+//   }
+//   async connectedCallback() {
+//     super.connectedCallback();
+//     renderAfter(this.closeButton, this);
+//     this.slot = 'detail';
+//     await this.firstUpdated;
+//     if (!this.hidden) {
+//       this.alignPanel();
+//     }
+//     this.addEventListener('bpResizeChange', (e: any) => (this.overlay = e.detail.width > 500 ? '' : 'full'));
+//     this.observer = listenForAttributeChange(this, 'hidden', () => this.alignPanel());
+//   }
+//   async updated(props: PropertyValues) {
+//     super.updated(props);
+//     await this.updateComplete;
+//     if (propUpdated(this, props, 'anchor') && !this.hidden) {
+//       this.setAnchorPointer(props.get('anchor') as HTMLElement);
+//     }
+//   }
+//   disconnectedCallback() {
+//     super.disconnectedCallback();
+//     this.observer.disconnect();
+//     this.triggerRow?.removeAttribute('_detail-row');
+//   }
+//   private async alignPanel() {
+//     this.grid.scrollLock = !this.hidden;
+//     await this.updateComplete;
+//     this.setDetailWidthAlignment();
+//     this.toggleAnchorHover();
+//   }
+//   private toggleAnchorHover() {
+//     if (this.hidden) {
+//       this.triggerRow?.removeAttribute('_detail-row');
+//     } else {
+//       this.triggerRow?.setAttribute('_detail-row', '');
+//     }
+//   }
+//   private setAnchorPointer(previousAnchor?: HTMLElement) {
+//     if (previousAnchor?.closest) {
+//       previousAnchor?.closest('bp-grid-row')?.removeAttribute('_detail-row');
+//     }
+//     this.toggleAnchorHover();
+//     const top = this.trigger?.getBoundingClientRect()?.top - (this?.getBoundingClientRect().top as number) - 8;
+//     this.style.setProperty('--caret-top', `${top}px`);
+//   }
+//   private setDetailWidthAlignment() {
+//     if (this.position === 'bottom') {
+//       this.alignToBottom();
+//     }
+//     const rowheader = Array.from(this.triggerRow?.cells ?? []).find(c => c.role === 'rowheader') as HTMLElement;
+//     if (rowheader) {
+//       this.alignToSide(rowheader);
+//     }
+//   }
+//   private alignToBottom() {
+//     const gridRect = this.grid?.getBoundingClientRect();
+//     const rowRect = this.triggerRow?.getBoundingClientRect();
+//     this.style.setProperty('--width', '100%');
+//     if (this.position === 'bottom' && rowRect) {
+//       this.style.top = `${rowRect?.bottom - gridRect.top - 1}px`;
+//     }
+//   }
+//   private alignToSide(rowheader: HTMLElement) {
+//     const gridRect = this.grid?.getBoundingClientRect();
+//     const cellRect = rowheader.getBoundingClientRect();
+//     this.style.setProperty('--width', 'auto');
+//     if (this.position === 'left' || this.grid?.getAttribute('dir') === 'rtl') {
+//       this.style.right = `${gridRect.right - cellRect.left}px`;
+//     } else {
+//       this.style.left = `${cellRect.right - gridRect.left}px`;
+//     }
+//   }
+// }
+export const test = 1;

package/src/.rollup.cache/@blueprintui/grid/Users/coryrylan/Repos/blueprintui/grid/dist/lib/footer/grid-footer.element.d.ts

@@ -0,0 +1,18 @@
+import { LitElement } from 'lit';
+/**
+ * Grid Footer
+ *
+ * ```typescript
+ * import '@blueprintui/grid/include/base.js';
+ * ```
+ *
+ * @element bp-grid-footer
+ * @cssprop --min-height
+ */
+export declare class BpGridFooter extends LitElement {
+    #private;
+    static styles: CSSStyleSheet[];
+    readonly gridCell: HTMLElement;
+    render(): import("lit-html").TemplateResult<1>;
+    connectedCallback(): void;
+}

package/src/.rollup.cache/@blueprintui/grid/Users/coryrylan/Repos/blueprintui/grid/dist/lib/footer/grid-footer.element.js

@@ -0,0 +1,32 @@
+import { LitElement, html } from 'lit';
+import { baseStyles } from '@blueprintui/components/internals';
+import styles from './grid-footer.element.css' assert { type: 'css' };
+/**
+ * Grid Footer
+ *
+ * ```typescript
+ * import '@blueprintui/grid/include/base.js';
+ * ```
+ *
+ * @element bp-grid-footer
+ * @cssprop --min-height
+ */
+export class BpGridFooter extends LitElement {
+    static styles = [baseStyles, styles];
+    get gridCell() {
+        return this.__gridCell ??= this.renderRoot?.querySelector("[role=\"gridcell\"]") ?? null;
+    }
+    #internals = this.attachInternals();
+    render() {
+        return html `
+      <div role="gridcell" class="private-host">
+        <slot></slot>
+      </div>
+    `;
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        this.slot = 'footer';
+        this.#internals.role = 'row';
+    }
+}

package/src/.rollup.cache/@blueprintui/grid/Users/coryrylan/Repos/blueprintui/grid/dist/lib/grid/grid-layout.controller.d.ts

@@ -0,0 +1,21 @@
+import { ReactiveControllerHost } from 'lit';
+export declare type Column = HTMLElement & {
+    width: string;
+    type: string;
+};
+declare type Grid = HTMLElement & {
+    ref: {
+        columns: NodeListOf<Column> | Column[];
+    };
+    columnLayout: 'fixed' | 'flex';
+    height?: string;
+};
+export declare class GridLayoutController {
+    #private;
+    private host;
+    constructor(host: ReactiveControllerHost & Grid);
+    hostConnected(): Promise<void>;
+    hostUpdated(): void;
+    hostDisconnected(): void;
+}
+export {};

package/src/.rollup.cache/@blueprintui/grid/Users/coryrylan/Repos/blueprintui/grid/dist/lib/grid/grid-layout.controller.js

@@ -0,0 +1,87 @@
+import { isNumericString, listenForAttributeListChange, 
+// notProductionEnvironment,
+onChildListMutation, } from '@blueprintui/components/internals';
+export class GridLayoutController {
+    host;
+    #observers = [];
+    #_columns;
+    get #columns() {
+        return Array.from(this.#_columns ?? []);
+    }
+    get #visibleColumns() {
+        return this.#columns.filter(c => !c.hidden);
+    }
+    get #lastVisibleColumn() {
+        return this.#visibleColumns[this.host.getAttribute('dir') === 'rtl' ? 0 : this.#visibleColumns.length - 1];
+    }
+    constructor(host) {
+        this.host = host;
+        this.host.addController(this);
+    }
+    async hostConnected() {
+        await this.host.updateComplete;
+        this.#updateLayout();
+        this.host.addEventListener('resizeChange', () => this.#initializeColumnWidths(), { once: true, capture: true });
+        this.#observers.push(onChildListMutation(this.host, async (mutation) => {
+            await this.host.updateComplete;
+            if (mutation && this.#columnAddedOrRemoved(mutation)) {
+                this.#updateLayout();
+            }
+        }));
+        this.#observers.push(listenForAttributeListChange(this.host, ['hidden'], () => this.#updateLayout()));
+    }
+    hostUpdated() {
+        if (this.host.height) {
+            this.host.style.setProperty('--body-height', isNumericString(this.host.height) ? `${this.host.height}px` : this.host.height);
+        }
+    }
+    hostDisconnected() {
+        this.#observers.forEach(o => o.disconnect());
+    }
+    #columnAddedOrRemoved(mutation) {
+        return [...Array.from(mutation.removedNodes), ...Array.from(mutation.addedNodes)].find((i) => i.tagName === 'BP-GRID-COLUMN');
+    }
+    #initializeColumnWidths() {
+        if (this.host.columnLayout === 'fixed') {
+            this.#visibleColumns
+                .filter(c => c.width)
+                .forEach(c => this.host.style.setProperty(`--ch${c.ariaColIndex}`, isNumericString(c.width) ? `${c.width}px` : c.width));
+            this.#visibleColumns
+                .filter(c => !c.width && parseInt(c.ariaColIndex) !== this.#columns.length)
+                .forEach(c => this.host.style.setProperty(`--ch${c.ariaColIndex}`, `${parseInt(getComputedStyle(c).width)}px`));
+            this.host.style.setProperty(`--ch${this.#lastVisibleColumn.ariaColIndex}`, `minmax(${this.#getLastColumnWidth() ?? `${parseInt(getComputedStyle(this.#lastVisibleColumn).width)}px`}, 100%)`);
+        }
+    }
+    #getLastColumnWidth() {
+        if (isNumericString(this.#lastVisibleColumn.width)) {
+            return `${this.#lastVisibleColumn.width}px`;
+        }
+        else {
+            return this.#lastVisibleColumn.width ? this.#lastVisibleColumn.width : null;
+        }
+    }
+    #updateLayout() {
+        this.#_columns = this.host.ref.columns; // create copy per update to prevent multiple DOM queries from @query getters
+        // this.#validateColumnLayout();
+        this.#createColumnGrids();
+        this.#setColumnDividers();
+    }
+    #createColumnGrids() {
+        const colWidths = this.#columns
+            .filter(c => !c.hidden)
+            .reduce((p, c, i) => {
+            const width = isNumericString(c.width) ? `${c.width}px` : c.width;
+            return `${p} ${`var(--ch${i + 1}, ${width ? width : '1fr'})`}`;
+        }, '');
+        this.host.style.setProperty('--ch-grid', colWidths);
+    }
+    #setColumnDividers() {
+        this.#visibleColumns.forEach((c, i) => {
+            c.removeAttribute('draggable-hidden');
+            if (c.type === 'action' && this.#visibleColumns[i + 1]?.type === 'action') {
+                c.setAttribute('draggable-hidden', '');
+            }
+        });
+        this.#lastVisibleColumn?.setAttribute('draggable-hidden', '');
+    }
+}

package/src/.rollup.cache/@blueprintui/grid/Users/coryrylan/Repos/blueprintui/grid/dist/lib/grid/grid.element.d.ts

@@ -0,0 +1,78 @@
+import { LitElement } from 'lit';
+import { BpGridRow } from '../row/grid-row.element.js';
+import { BpGridCell } from '../cell/grid-cell.element.js';
+import { BpGridColumn } from '../column/grid-column.element.js';
+import { GridLayoutController } from './grid-layout.controller.js';
+/**
+ * Grid
+ *
+ * ```typescript
+ * import '@blueprintui/components/grid/register.js';
+ * ```
+ *
+ * @element bp-grid
+ * @event rangeSelectionChange
+ * @cssprop --background
+ * @cssprop --body-height
+ * @cssprop --scrollbar-background
+ * @cssprop --scrollbar-thumb-background
+ * @cssprop --column-height
+ * @cssprop --row-height
+ * @cssprop --scroll-padding-top
+ * @cssprop --row-content-visibility
+ * @cssprop --column-text-align
+ * @cssprop --cell-text-algin
+ */
+export declare class BpGrid extends LitElement {
+    #private;
+    i18n: {
+        sort: string;
+        expand: string;
+        close: string;
+        resize: string;
+        filter: string;
+        loading: string;
+        show: string;
+        hide: string;
+        previous: string;
+        next: string;
+        first: string;
+        last: string;
+        today: string;
+        browse: string;
+        removeFile: string;
+        files: string;
+        resizeColumn: string;
+        closeDetails: string;
+        noData: string;
+        action: string;
+        dropTarget: string;
+        firstPage: string;
+        previousPage: string;
+        nextPage: string;
+        lastPage: string;
+        pageSize: string;
+    };
+    height: string;
+    columnLayout: 'fixed' | 'flex';
+    border: 'row' | 'cell' | 'column' | 'none' | 'stripe';
+    selectable: 'multi' | 'single' | null;
+    rangeSelection: boolean;
+    scrollLock: boolean;
+    elevation: 'raised' | 'flat';
+    protected _id: string;
+    protected gridLayoutController: GridLayoutController;
+    static styles: CSSStyleSheet[];
+    get ref(): {
+        grid: HTMLElement;
+        columns: BpGridColumn[];
+        columnRow: HTMLElement;
+        rows: BpGridRow[];
+        cells: BpGridCell[];
+    };
+    readonly keyNavGrid: HTMLElement;
+    _internals: ElementInternals;
+    render(): import("lit-html").TemplateResult<1>;
+    constructor();
+    connectedCallback(): Promise<void>;
+}