@krollins/blueprint 0.2.2 → 0.3.0

package/dist/shared/table-D2qrSuqf.js

@@ -0,0 +1,575 @@
+import { t as e } from "./decorate-BJVyhdRd.js";
+import { t } from "./icon-SU3ebQcn.js";
+import { t as n } from "./boolean-converter-saxBDLhA.js";
+import { t as r } from "./memoize-CpXRWhgJ.js";
+import { chevronDownSvg as i } from "../icons/chevron-down.js";
+import { chevronUpSvg as a } from "../icons/chevron-up.js";
+import { LitElement as o, css as s, html as c, nothing as l } from "lit";
+import { customElement as u, property as d, state as f } from "lit/decorators.js";
+import { ifDefined as p } from "lit/directives/if-defined.js";
+import { classMap as m } from "lit/directives/class-map.js";
+import { repeat as h } from "lit/directives/repeat.js";
+//#region source/components/table/table.style.ts
+var g = s`
+  /* Base styles */
+  :host {
+    display: block;
+  }
+
+  .table-wrapper {
+    overflow-x: auto;
+    border-radius: var(--bp-border-radius);
+  }
+
+  .table {
+    width: 100%;
+    border-collapse: collapse;
+    font-family: var(--bp-font-family);
+    font-size: var(--bp-font-size-sm);
+    color: var(--bp-color-text);
+    background: var(--bp-color-surface);
+  }
+
+  /* Header styles */
+  .header-row {
+    background: var(--bp-color-surface-subdued);
+    border-bottom: var(--bp-border-width) solid var(--bp-color-border);
+  }
+
+  .header-cell {
+    font-weight: var(--bp-font-weight-semibold);
+    text-align: left;
+    color: var(--bp-color-text);
+  }
+
+  .header-cell--sortable {
+    cursor: pointer;
+    user-select: none;
+    transition: background-color var(--bp-transition-fast);
+    position: relative;
+  }
+
+  .header-cell--sortable::after {
+    content: '';
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    height: 2px;
+    background: transparent;
+    transition: background var(--bp-transition-fast);
+  }
+
+  .header-cell--sortable:hover::after {
+    background: var(--bp-color-primary);
+    opacity: 0.3;
+  }
+
+  .header-cell--sortable:hover {
+    background: var(--bp-color-surface);
+  }
+
+  .header-cell--sortable:active {
+    background: var(--bp-color-surface-subdued);
+    transform: translateY(1px);
+  }
+
+  .header-cell__content {
+    display: flex;
+    align-items: center;
+    gap: var(--bp-spacing-1);
+  }
+
+  .header-cell__label {
+    flex: 1;
+  }
+
+  /* Sort icon */
+  .sort-icon {
+    display: flex;
+    align-items: center;
+    color: var(--bp-color-text-muted);
+    transition: color var(--bp-transition-fast);
+  }
+
+  .sort-icon--active {
+    color: var(--bp-color-primary);
+  }
+
+  /* Cell styles */
+  .cell {
+    padding: var(--bp-spacing-3) var(--bp-spacing-4);
+    border-bottom: var(--bp-border-width) solid var(--bp-color-border);
+    vertical-align: middle;
+  }
+
+  .cell--checkbox {
+    width: var(--bp-spacing-10);
+    text-align: center;
+    padding-left: var(--bp-spacing-3);
+    padding-right: 0;
+  }
+
+  .cell--checkbox input[type='checkbox'] {
+    width: var(--bp-spacing-6);
+    height: var(--bp-spacing-6);
+    cursor: pointer;
+  }
+
+  /* Row styles */
+  .row {
+    transition: background-color var(--bp-transition-fast);
+    content-visibility: auto;
+    contain-intrinsic-size: auto 48px;
+  }
+
+  .row--hoverable:hover {
+    background: var(--bp-color-surface-subdued);
+  }
+
+  .row--selected {
+    background: oklch(from var(--bp-color-primary) l c h / 0.15);
+  }
+
+  .row--selected:hover {
+    background: oklch(from var(--bp-color-primary) l c h / 0.2);
+  }
+
+  /* Remove border from last row */
+  tbody tr:last-child .cell {
+    border-bottom: none;
+  }
+
+  /* Variants */
+  .table--striped tbody tr:nth-child(even) {
+    background: var(--bp-color-surface-subdued);
+  }
+
+  .table--striped tbody tr:nth-child(even):hover {
+    background: var(--bp-color-surface);
+  }
+
+  .table--striped .row--selected {
+    background: oklch(from var(--bp-color-primary) l c h / 0.15) !important;
+  }
+
+  .table--striped .row--selected:hover {
+    background: oklch(from var(--bp-color-primary) l c h / 0.2) !important;
+  }
+
+  .table--bordered {
+    border: var(--bp-border-width) solid var(--bp-color-border);
+  }
+
+  .table--bordered .cell {
+    border: var(--bp-border-width) solid var(--bp-color-border);
+  }
+
+  /* Sizes */
+  .table--sm .cell {
+    padding: var(--bp-spacing-1) var(--bp-spacing-3);
+    font-size: var(--bp-font-size-xs);
+  }
+
+  .table--sm .row {
+    contain-intrinsic-size: auto 36px;
+  }
+
+  .table--md .cell {
+    padding: var(--bp-spacing-3) var(--bp-spacing-4);
+    font-size: var(--bp-font-size-sm);
+  }
+
+  .table--md .row {
+    contain-intrinsic-size: auto 48px;
+  }
+
+  .table--lg .cell {
+    padding: var(--bp-spacing-4) var(--bp-spacing-5);
+    font-size: var(--bp-font-size-base);
+  }
+
+  .table--lg .row {
+    contain-intrinsic-size: auto 56px;
+  }
+
+  /* Sticky header */
+  .table--sticky-header thead {
+    position: sticky;
+    top: 0;
+    z-index: 1;
+  }
+
+  .table--sticky-header .header-row {
+    box-shadow: var(--bp-shadow-sm);
+  }
+
+  /* Selectable - add pointer cursor */
+  .table--selectable .row {
+    cursor: pointer;
+  }
+
+  /* Loading state */
+  .table--loading {
+    opacity: var(--bp-opacity-disabled);
+    pointer-events: none;
+  }
+
+  /* Empty state */
+  .empty-state {
+    text-align: center;
+    padding: var(--bp-spacing-10);
+    color: var(--bp-color-text-muted);
+    background: var(--bp-color-surface-subdued);
+  }
+
+  .state-content {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    gap: var(--bp-spacing-3);
+    padding: var(--bp-spacing-5);
+  }
+
+  .sort-icon--inactive {
+    opacity: 0.4;
+  }
+
+  /* Focus styles for keyboard navigation */
+  .header-cell--sortable:focus-visible {
+    outline: var(--bp-focus-width) var(--bp-focus-style) var(--bp-color-focus);
+    outline-offset: var(--bp-focus-offset);
+  }
+
+  .row:focus-visible {
+    outline: var(--bp-focus-width) var(--bp-focus-style) var(--bp-color-focus);
+    outline-offset: calc(-1 * var(--bp-focus-offset));
+  }
+
+  .cell--checkbox input[type='checkbox']:focus-visible {
+    outline: var(--bp-focus-width) var(--bp-focus-style) var(--bp-color-focus);
+    outline-offset: var(--bp-focus-offset);
+  }
+
+  /* Reduced motion */
+  @media (prefers-reduced-motion: reduce) {
+    .row,
+    .header-cell--sortable,
+    .sort-icon {
+      transition: none;
+    }
+
+    .header-cell--sortable:active {
+      transform: none;
+    }
+
+    .header-cell--sortable::after {
+      transition: none;
+    }
+  }
+`, _, v = class extends o {
+	static {
+		_ = this;
+	}
+	static {
+		this.dependencies = [t];
+	}
+	static {
+		this.VISUAL_ONLY_PROPS = /* @__PURE__ */ new Set(["hoverable", "stickyHeader"]);
+	}
+	static {
+		this.styles = [g];
+	}
+	constructor() {
+		super(), this.allSelected = !1, this.computeSortedRows = r((e, t) => {
+			if (!t || t.direction === "none") return e;
+			let { column: n, direction: r } = t;
+			return [...e].sort((e, t) => {
+				let i = e[n], a = t[n];
+				if (i === a) return 0;
+				if (i == null) return 1;
+				if (a == null) return -1;
+				let o;
+				return o = typeof i == "string" && typeof a == "string" ? i.localeCompare(a) : typeof i == "number" && typeof a == "number" ? i - a : String(i).localeCompare(String(a)), r === "desc" ? -o : o;
+			});
+		}), this.columns = [], this.rows = [], this.variant = "default", this.size = "md", this.selectable = !1, this.multiSelect = !1, this.selectedRows = [], this.sortState = null, this.stickyHeader = !1, this.hoverable = !0, this.loading = !1;
+	}
+	shouldUpdate(e) {
+		for (let t of e.keys()) if (!_.VISUAL_ONLY_PROPS.has(t)) return !0;
+		return !0;
+	}
+	updated(e) {
+		(e.has("selectedRows") || e.has("rows")) && (this.allSelected = this.rows.length > 0 && this.selectedRows.length === this.rows.length);
+	}
+	get sortedRows() {
+		return this.computeSortedRows(this.rows, this.sortState);
+	}
+	handleHeaderClick(e, t) {
+		if (!e.sortable) return;
+		let n = "asc";
+		this.sortState?.column === e.key && (this.sortState.direction === "asc" ? n = "desc" : this.sortState.direction === "desc" && (n = "none")), this.sortState = {
+			column: e.key,
+			direction: n
+		}, this.dispatchEvent(new CustomEvent("bp-sort", {
+			detail: {
+				column: e.key,
+				direction: n
+			},
+			bubbles: !0,
+			composed: !0
+		})), this.updateComplete.then(() => {
+			t.target?.focus();
+		});
+	}
+	handleRowClick(e, t) {
+		this.dispatchEvent(new CustomEvent("bp-row-click", {
+			detail: {
+				row: e,
+				originalEvent: t
+			},
+			bubbles: !0,
+			composed: !0
+		})), this.selectable && this.toggleRowSelection(e);
+	}
+	handleRowKeyDown(e, t) {
+		this.selectable && (t.key === "Enter" || t.key === " ") && (t.preventDefault(), this.toggleRowSelection(e));
+	}
+	toggleRowSelection(e) {
+		let t = e.id, n = this.selectedRows.includes(t), r;
+		r = this.multiSelect ? n ? this.selectedRows.filter((e) => e !== t) : [...this.selectedRows, t] : n ? [] : [t], this.selectedRows = r, this.dispatchEvent(new CustomEvent("bp-select", {
+			detail: {
+				selectedRows: r,
+				row: e,
+				selected: !n
+			},
+			bubbles: !0,
+			composed: !0
+		}));
+	}
+	handleSelectAll() {
+		this.selectedRows = this.allSelected ? [] : this.rows.map((e) => e.id), this.dispatchEvent(new CustomEvent("bp-select", {
+			detail: {
+				selectedRows: this.selectedRows,
+				selectAll: !this.allSelected
+			},
+			bubbles: !0,
+			composed: !0
+		}));
+	}
+	handleCheckboxClick(e, t) {
+		e.target instanceof HTMLInputElement && e.stopPropagation(), t ? this.toggleRowSelection(t) : this.handleSelectAll();
+	}
+	selectAll() {
+		this.selectedRows = this.rows.map((e) => e.id), this.dispatchEvent(new CustomEvent("bp-select", {
+			detail: {
+				selectedRows: this.selectedRows,
+				selectAll: !0
+			},
+			bubbles: !0,
+			composed: !0
+		}));
+	}
+	deselectAll() {
+		this.selectedRows = [], this.dispatchEvent(new CustomEvent("bp-select", {
+			detail: {
+				selectedRows: [],
+				selectAll: !1
+			},
+			bubbles: !0,
+			composed: !0
+		}));
+	}
+	clearSort() {
+		this.sortState = null;
+	}
+	renderSortIcon(e) {
+		if (!e.sortable) return l;
+		let t = this.sortState?.column === e.key, n = t ? this.sortState?.direction : "none", r = n === "asc" ? a : n === "desc" ? i : a;
+		return c`
+      <span class=${m({
+			"sort-icon": !0,
+			"sort-icon--active": t && n !== "none",
+			"sort-icon--inactive": n === "none"
+		})} part="sort-icon" aria-hidden="true">
+        <bp-icon .svg=${r} size="sm"></bp-icon>
+      </span>
+    `;
+	}
+	renderHeader() {
+		return c`
+      <thead part="thead">
+        <tr class="header-row" part="header-row">
+          ${this.selectable && this.multiSelect ? c`
+                  <th class="cell cell--checkbox" part="header-cell">
+                    <input
+                      type="checkbox"
+                      part="checkbox"
+                      .checked=${this.allSelected}
+                      .indeterminate=${this.selectedRows.length > 0 && !this.allSelected}
+                      @click=${(e) => this.handleCheckboxClick(e)}
+                      aria-label="Select all rows"
+                    />
+                  </th>
+                ` : this.selectable ? c`<th class="cell cell--checkbox" part="header-cell"></th>` : l}
+          ${h(this.columns, (e) => e.key, (e) => c`
+              <th
+                class="cell header-cell ${e.sortable ? "header-cell--sortable" : ""}"
+                part="header-cell"
+                style=${e.width ? `width: ${e.width}` : ""}
+                @click=${(t) => this.handleHeaderClick(e, t)}
+                tabindex=${e.sortable ? 0 : -1}
+                @keydown=${(t) => {
+			e.sortable && (t.key === "Enter" || t.key === " ") && (t.preventDefault(), this.handleHeaderClick(e, t));
+		}}
+                aria-sort=${this.sortState?.column === e.key ? this.sortState.direction === "asc" ? "ascending" : this.sortState.direction === "desc" ? "descending" : "none" : "none"}
+              >
+                <span
+                  class="header-cell__content"
+                  style="justify-content: ${e.align === "center" ? "center" : e.align === "right" ? "flex-end" : "flex-start"}"
+                >
+                  <span class="header-cell__label">${e.label}</span>
+                  ${this.renderSortIcon(e)}
+                </span>
+              </th>
+            `)}
+        </tr>
+      </thead>
+    `;
+	}
+	renderBody() {
+		let e = this.sortedRows;
+		return this.loading ? c`
+        <tbody part="tbody">
+          <tr>
+            <td
+              colspan=${this.columns.length + +!!this.selectable}
+              class="empty-state"
+              part="empty-state"
+            >
+              <slot name="loading">
+                <div class="state-content">Loading...</div>
+              </slot>
+            </td>
+          </tr>
+        </tbody>
+      ` : e.length === 0 ? c`
+        <tbody part="tbody">
+          <tr>
+            <td
+              colspan=${this.columns.length + +!!this.selectable}
+              class="empty-state"
+              part="empty-state"
+            >
+              <slot name="empty">
+                <div class="state-content">No data available</div>
+              </slot>
+            </td>
+          </tr>
+        </tbody>
+      ` : c`
+      <tbody part="tbody">
+        ${h(e, (e) => e.id, (e) => {
+			let t = this.selectedRows.includes(e.id), n = {
+				row: !0,
+				"row--selected": t,
+				"row--hoverable": this.hoverable
+			};
+			return c`
+              <tr
+                class=${m(n)}
+                part="row"
+                @click=${(t) => this.handleRowClick(e, t)}
+                @keydown=${(t) => this.handleRowKeyDown(e, t)}
+                tabindex=${this.selectable ? 0 : -1}
+                aria-selected=${p(this.selectable ? t ? "true" : "false" : void 0)}
+              >
+                ${this.selectable ? c`
+                        <td class="cell cell--checkbox" part="cell">
+                          <input
+                            type="checkbox"
+                            part="checkbox"
+                            .checked=${t}
+                            @click=${(t) => this.handleCheckboxClick(t, e)}
+                            aria-label="Select row"
+                          />
+                        </td>
+                      ` : l}
+                ${h(this.columns, (e) => e.key, (t) => {
+				let n = e[t.key], r = t.render ? t.render(n, e) : n;
+				return c`
+                      <td
+                        class="cell"
+                        part="cell"
+                        style="text-align: ${t.align || "left"}"
+                      >
+                        ${r}
+                      </td>
+                    `;
+			})}
+              </tr>
+            `;
+		})}
+      </tbody>
+    `;
+	}
+	render() {
+		let e = {
+			table: !0,
+			[`table--${this.variant}`]: !0,
+			[`table--${this.size}`]: !0,
+			"table--sticky-header": this.stickyHeader,
+			"table--selectable": this.selectable,
+			"table--loading": this.loading
+		};
+		return c`
+      <div class="table-wrapper">
+        <table
+          class=${m(e)}
+          part="table"
+          role="grid"
+          aria-busy=${this.loading}
+        >
+          ${this.renderHeader()} ${this.renderBody()}
+        </table>
+      </div>
+    `;
+	}
+};
+e([d({ type: Array })], v.prototype, "columns", void 0), e([d({ type: Array })], v.prototype, "rows", void 0), e([d({
+	type: String,
+	reflect: !0,
+	converter: { fromAttribute: (e) => e && [
+		"default",
+		"striped",
+		"bordered"
+	].includes(e) ? e : "default" }
+})], v.prototype, "variant", void 0), e([d({
+	type: String,
+	reflect: !0,
+	converter: { fromAttribute: (e) => e && [
+		"sm",
+		"md",
+		"lg"
+	].includes(e) ? e : "md" }
+})], v.prototype, "size", void 0), e([d({
+	type: Boolean,
+	reflect: !0
+})], v.prototype, "selectable", void 0), e([d({
+	type: Boolean,
+	reflect: !0
+})], v.prototype, "multiSelect", void 0), e([d({ type: Array })], v.prototype, "selectedRows", void 0), e([d({ type: Object })], v.prototype, "sortState", void 0), e([d({
+	type: Boolean,
+	reflect: !0,
+	attribute: "sticky-header"
+})], v.prototype, "stickyHeader", void 0), e([d({
+	converter: n,
+	reflect: !0
+})], v.prototype, "hoverable", void 0), e([d({
+	type: Boolean,
+	reflect: !0
+})], v.prototype, "loading", void 0), e([f()], v.prototype, "allSelected", void 0), v = _ = e([u("bp-table")], v);
+//#endregion
+export { v as t };
+
+//# sourceMappingURL=table-D2qrSuqf.js.map

package/dist/shared/table-D2qrSuqf.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"table-D2qrSuqf.js","names":["_decorate","__decorate","booleanConverter","memoizeOne","tableStyles","_BpTable","BpTable","LitElement","BpIcon","sortState","rows","aVal","a","column","bVal","b","comparison","direction","key","changedProperties","event","row","rowId","isSelected","newSelection","id","nothing","isActive","iconSvg","chevronUpSvg","chevronDownSvg","classMap","repeat","e","sortedRows","rowClasses","ifDefined","value","content","tableClasses","property","state","customElement"],"sources":["../../source/components/table/table.style.ts","../../source/components/table/table.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const tableStyles = css`\n  /* Base styles */\n  :host {\n    display: block;\n  }\n\n  .table-wrapper {\n    overflow-x: auto;\n    border-radius: var(--bp-border-radius);\n  }\n\n  .table {\n    width: 100%;\n    border-collapse: collapse;\n    font-family: var(--bp-font-family);\n    font-size: var(--bp-font-size-sm);\n    color: var(--bp-color-text);\n    background: var(--bp-color-surface);\n  }\n\n  /* Header styles */\n  .header-row {\n    background: var(--bp-color-surface-subdued);\n    border-bottom: var(--bp-border-width) solid var(--bp-color-border);\n  }\n\n  .header-cell {\n    font-weight: var(--bp-font-weight-semibold);\n    text-align: left;\n    color: var(--bp-color-text);\n  }\n\n  .header-cell--sortable {\n    cursor: pointer;\n    user-select: none;\n    transition: background-color var(--bp-transition-fast);\n    position: relative;\n  }\n\n  .header-cell--sortable::after {\n    content: '';\n    position: absolute;\n    bottom: 0;\n    left: 0;\n    right: 0;\n    height: 2px;\n    background: transparent;\n    transition: background var(--bp-transition-fast);\n  }\n\n  .header-cell--sortable:hover::after {\n    background: var(--bp-color-primary);\n    opacity: 0.3;\n  }\n\n  .header-cell--sortable:hover {\n    background: var(--bp-color-surface);\n  }\n\n  .header-cell--sortable:active {\n    background: var(--bp-color-surface-subdued);\n    transform: translateY(1px);\n  }\n\n  .header-cell__content {\n    display: flex;\n    align-items: center;\n    gap: var(--bp-spacing-1);\n  }\n\n  .header-cell__label {\n    flex: 1;\n  }\n\n  /* Sort icon */\n  .sort-icon {\n    display: flex;\n    align-items: center;\n    color: var(--bp-color-text-muted);\n    transition: color var(--bp-transition-fast);\n  }\n\n  .sort-icon--active {\n    color: var(--bp-color-primary);\n  }\n\n  /* Cell styles */\n  .cell {\n    padding: var(--bp-spacing-3) var(--bp-spacing-4);\n    border-bottom: var(--bp-border-width) solid var(--bp-color-border);\n    vertical-align: middle;\n  }\n\n  .cell--checkbox {\n    width: var(--bp-spacing-10);\n    text-align: center;\n    padding-left: var(--bp-spacing-3);\n    padding-right: 0;\n  }\n\n  .cell--checkbox input[type='checkbox'] {\n    width: var(--bp-spacing-6);\n    height: var(--bp-spacing-6);\n    cursor: pointer;\n  }\n\n  /* Row styles */\n  .row {\n    transition: background-color var(--bp-transition-fast);\n    content-visibility: auto;\n    contain-intrinsic-size: auto 48px;\n  }\n\n  .row--hoverable:hover {\n    background: var(--bp-color-surface-subdued);\n  }\n\n  .row--selected {\n    background: oklch(from var(--bp-color-primary) l c h / 0.15);\n  }\n\n  .row--selected:hover {\n    background: oklch(from var(--bp-color-primary) l c h / 0.2);\n  }\n\n  /* Remove border from last row */\n  tbody tr:last-child .cell {\n    border-bottom: none;\n  }\n\n  /* Variants */\n  .table--striped tbody tr:nth-child(even) {\n    background: var(--bp-color-surface-subdued);\n  }\n\n  .table--striped tbody tr:nth-child(even):hover {\n    background: var(--bp-color-surface);\n  }\n\n  .table--striped .row--selected {\n    background: oklch(from var(--bp-color-primary) l c h / 0.15) !important;\n  }\n\n  .table--striped .row--selected:hover {\n    background: oklch(from var(--bp-color-primary) l c h / 0.2) !important;\n  }\n\n  .table--bordered {\n    border: var(--bp-border-width) solid var(--bp-color-border);\n  }\n\n  .table--bordered .cell {\n    border: var(--bp-border-width) solid var(--bp-color-border);\n  }\n\n  /* Sizes */\n  .table--sm .cell {\n    padding: var(--bp-spacing-1) var(--bp-spacing-3);\n    font-size: var(--bp-font-size-xs);\n  }\n\n  .table--sm .row {\n    contain-intrinsic-size: auto 36px;\n  }\n\n  .table--md .cell {\n    padding: var(--bp-spacing-3) var(--bp-spacing-4);\n    font-size: var(--bp-font-size-sm);\n  }\n\n  .table--md .row {\n    contain-intrinsic-size: auto 48px;\n  }\n\n  .table--lg .cell {\n    padding: var(--bp-spacing-4) var(--bp-spacing-5);\n    font-size: var(--bp-font-size-base);\n  }\n\n  .table--lg .row {\n    contain-intrinsic-size: auto 56px;\n  }\n\n  /* Sticky header */\n  .table--sticky-header thead {\n    position: sticky;\n    top: 0;\n    z-index: 1;\n  }\n\n  .table--sticky-header .header-row {\n    box-shadow: var(--bp-shadow-sm);\n  }\n\n  /* Selectable - add pointer cursor */\n  .table--selectable .row {\n    cursor: pointer;\n  }\n\n  /* Loading state */\n  .table--loading {\n    opacity: var(--bp-opacity-disabled);\n    pointer-events: none;\n  }\n\n  /* Empty state */\n  .empty-state {\n    text-align: center;\n    padding: var(--bp-spacing-10);\n    color: var(--bp-color-text-muted);\n    background: var(--bp-color-surface-subdued);\n  }\n\n  .state-content {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    gap: var(--bp-spacing-3);\n    padding: var(--bp-spacing-5);\n  }\n\n  .sort-icon--inactive {\n    opacity: 0.4;\n  }\n\n  /* Focus styles for keyboard navigation */\n  .header-cell--sortable:focus-visible {\n    outline: var(--bp-focus-width) var(--bp-focus-style) var(--bp-color-focus);\n    outline-offset: var(--bp-focus-offset);\n  }\n\n  .row:focus-visible {\n    outline: var(--bp-focus-width) var(--bp-focus-style) var(--bp-color-focus);\n    outline-offset: calc(-1 * var(--bp-focus-offset));\n  }\n\n  .cell--checkbox input[type='checkbox']:focus-visible {\n    outline: var(--bp-focus-width) var(--bp-focus-style) var(--bp-color-focus);\n    outline-offset: var(--bp-focus-offset);\n  }\n\n  /* Reduced motion */\n  @media (prefers-reduced-motion: reduce) {\n    .row,\n    .header-cell--sortable,\n    .sort-icon {\n      transition: none;\n    }\n\n    .header-cell--sortable:active {\n      transform: none;\n    }\n\n    .header-cell--sortable::after {\n      transition: none;\n    }\n  }\n`;\n","import { LitElement, html, nothing, TemplateResult, PropertyValues } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { repeat } from 'lit/directives/repeat.js';\nimport { tableStyles } from './table.style.js';\nimport { memoizeOne } from '../../utilities/memoize.js';\nimport { booleanConverter } from '../../utilities/boolean-converter.js';\nimport { chevronUpSvg } from '../icon/icons/entries/chevron-up.js';\nimport { chevronDownSvg } from '../icon/icons/entries/chevron-down.js';\nimport { BpIcon } from '../icon/icon.js';\n\nexport type TableVariant = 'default' | 'striped' | 'bordered';\nexport type TableSize = 'sm' | 'md' | 'lg';\nexport type TableSortDirection = 'asc' | 'desc' | 'none';\n\n/**\n * Column definition for the table\n */\nexport interface TableColumn {\n  /** Unique key for the column (matches data property) */\n  key: string;\n  /** Header label for the column */\n  label: string;\n  /** Whether this column is sortable */\n  sortable?: boolean;\n  /** Text alignment */\n  align?: 'left' | 'center' | 'right';\n  /** Fixed width for the column */\n  width?: string;\n  /** Custom render function for cell content */\n  render?: (value: unknown, row: TableRow) => TemplateResult | string;\n}\n\n/**\n * Row data for the table\n */\nexport interface TableRow {\n  /** Unique identifier for the row */\n  id: string | number;\n  /** Row data keyed by column key */\n  [key: string]: unknown;\n}\n\n/**\n * Sort state for the table\n */\nexport interface TableSortState {\n  /** Column key being sorted */\n  column: string;\n  /** Sort direction */\n  direction: TableSortDirection;\n}\n\n/**\n * A data table component for displaying tabular data with sorting and selection.\n *\n * @element bp-table\n *\n * @property {TableColumn[]} columns - Array of column definitions\n * @property {TableRow[]} rows - Array of row data objects\n * @property {TableVariant} variant - Visual style variant\n * @property {TableSize} size - Size of the table cells\n * @property {boolean} selectable - Whether rows can be selected\n * @property {boolean} multiSelect - Whether multiple rows can be selected\n * @property {(string|number)[]} selectedRows - Array of selected row IDs\n * @property {TableSortState} sortState - Current sort state\n * @property {boolean} stickyHeader - Whether the header sticks on scroll\n * @property {boolean} hoverable - Whether rows highlight on hover\n * @property {boolean} loading - Whether the table is in loading state\n *\n * @fires bp-sort - Fired when a sortable column header is clicked\n * @fires bp-select - Fired when row selection changes\n * @fires bp-row-click - Fired when a row is clicked\n *\n * @slot empty - Content to show when table has no data\n * @slot loading - Content to show when table is loading\n *\n * @csspart table - The table element\n * @csspart thead - The table header section\n * @csspart tbody - The table body section\n * @csspart header-row - A header row\n * @csspart header-cell - A header cell\n * @csspart row - A data row\n * @csspart cell - A data cell\n * @csspart checkbox - Selection checkbox\n * @csspart sort-icon - Sort direction icon\n * @csspart empty-state - Empty state container\n */\n@customElement('bp-table')\nexport class BpTable extends LitElement {\n  /**\n   * Child components that self-register as custom elements on import.\n   * Value imports prevent bundler tree-shaking of the registration side effect.\n   */\n  static dependencies = [BpIcon];\n\n  /** Array of column definitions */\n  @property({ type: Array }) declare columns: TableColumn[];\n\n  /** Array of row data objects */\n  @property({ type: Array }) declare rows: TableRow[];\n\n  /** Visual style variant */\n  @property({\n    type: String,\n    reflect: true,\n    converter: {\n      fromAttribute: (value: string | null) => {\n        const valid: TableVariant[] = ['default', 'striped', 'bordered'];\n        return value && valid.includes(value as TableVariant)\n          ? (value as TableVariant)\n          : 'default';\n      },\n    },\n  })\n  declare variant: TableVariant;\n\n  /** Size of the table cells */\n  @property({\n    type: String,\n    reflect: true,\n    converter: {\n      fromAttribute: (value: string | null) => {\n        const valid: TableSize[] = ['sm', 'md', 'lg'];\n        return value && valid.includes(value as TableSize)\n          ? (value as TableSize)\n          : 'md';\n      },\n    },\n  })\n  declare size: TableSize;\n\n  /** Whether rows can be selected */\n  @property({ type: Boolean, reflect: true }) declare selectable: boolean;\n\n  /** Whether multiple rows can be selected */\n  @property({ type: Boolean, reflect: true }) declare multiSelect: boolean;\n\n  /** Array of selected row IDs */\n  @property({ type: Array }) declare selectedRows: (string | number)[];\n\n  /** Current sort state */\n  @property({ type: Object }) declare sortState: TableSortState | null;\n\n  /** Whether the header sticks on scroll */\n  @property({ type: Boolean, reflect: true, attribute: 'sticky-header' })\n  declare stickyHeader: boolean;\n\n  /** Whether rows highlight on hover */\n  @property({ converter: booleanConverter, reflect: true })\n  declare hoverable: boolean;\n\n  /** Whether the table is in loading state */\n  @property({ type: Boolean, reflect: true }) declare loading: boolean;\n\n  @state() private allSelected = false;\n\n  /**\n   * Properties that only affect visual styling, not rendered structure.\n   * Changes to only these properties can skip a full re-render.\n   */\n  private static readonly VISUAL_ONLY_PROPS = new Set([\n    'hoverable',\n    'stickyHeader',\n  ]);\n\n  static styles = [tableStyles];\n\n  constructor() {\n    super();\n    this.columns = [];\n    this.rows = [];\n    this.variant = 'default';\n    this.size = 'md';\n    this.selectable = false;\n    this.multiSelect = false;\n    this.selectedRows = [];\n    this.sortState = null;\n    this.stickyHeader = false;\n    this.hoverable = true;\n    this.loading = false;\n  }\n\n  protected shouldUpdate(changedProperties: PropertyValues): boolean {\n    // If all changed properties are visual-only, skip the update.\n    // Be conservative: return true if any non-visual property changed.\n    for (const key of changedProperties.keys()) {\n      if (!BpTable.VISUAL_ONLY_PROPS.has(key as string)) {\n        return true;\n      }\n    }\n    // All changes are visual-only — still need to update for CSS class changes\n    return true;\n  }\n\n  updated(changedProperties: Map<string, unknown>): void {\n    if (\n      changedProperties.has('selectedRows') ||\n      changedProperties.has('rows')\n    ) {\n      this.allSelected =\n        this.rows.length > 0 && this.selectedRows.length === this.rows.length;\n    }\n  }\n\n  /**\n   * Memoized sorted rows computation.\n   * Only recomputes when rows or sortState references change.\n   */\n  private computeSortedRows = memoizeOne(\n    (rows: TableRow[], sortState: TableSortState | null): TableRow[] => {\n      if (!sortState || sortState.direction === 'none') {\n        return rows;\n      }\n\n      const { column, direction } = sortState;\n      return [...rows].sort((a, b) => {\n        const aVal = a[column];\n        const bVal = b[column];\n\n        if (aVal === bVal) return 0;\n        if (aVal === null || aVal === undefined) return 1;\n        if (bVal === null || bVal === undefined) return -1;\n\n        let comparison: number;\n        if (typeof aVal === 'string' && typeof bVal === 'string') {\n          comparison = aVal.localeCompare(bVal);\n        } else if (typeof aVal === 'number' && typeof bVal === 'number') {\n          comparison = aVal - bVal;\n        } else {\n          comparison = String(aVal).localeCompare(String(bVal));\n        }\n\n        return direction === 'desc' ? -comparison : comparison;\n      });\n    }\n  );\n\n  /**\n   * Get sorted rows based on current sort state (memoized).\n   */\n  private get sortedRows(): TableRow[] {\n    return this.computeSortedRows(this.rows, this.sortState);\n  }\n\n  /**\n   * Handles click on sortable column header.\n   * Cycles through sort directions: asc → desc → none.\n   * Manages focus on header after sort completes.\n   */\n  private handleHeaderClick(column: TableColumn, event: Event) {\n    if (!column.sortable) return;\n\n    let direction: TableSortDirection = 'asc';\n    if (this.sortState?.column === column.key) {\n      if (this.sortState.direction === 'asc') {\n        direction = 'desc';\n      } else if (this.sortState.direction === 'desc') {\n        direction = 'none';\n      }\n    }\n\n    this.sortState = { column: column.key, direction };\n    this.dispatchEvent(\n      new CustomEvent('bp-sort', {\n        detail: { column: column.key, direction },\n        bubbles: true,\n        composed: true,\n      })\n    );\n\n    // Focus management: focus header after sort completes\n    this.updateComplete.then(() => {\n      (event.target as HTMLElement)?.focus();\n    });\n  }\n\n  /**\n   * Handles click events on table rows.\n   * Dispatches bp-row-click event and toggles selection if selectable.\n   */\n  private handleRowClick(row: TableRow, event: Event) {\n    this.dispatchEvent(\n      new CustomEvent('bp-row-click', {\n        detail: { row, originalEvent: event },\n        bubbles: true,\n        composed: true,\n      })\n    );\n\n    if (this.selectable) {\n      this.toggleRowSelection(row);\n    }\n  }\n\n  /**\n   * Handles keyboard events on table rows.\n   * Triggers selection on Enter or Space key press when selectable.\n   */\n  private handleRowKeyDown(row: TableRow, event: KeyboardEvent) {\n    if (!this.selectable) return;\n\n    if (event.key === 'Enter' || event.key === ' ') {\n      event.preventDefault();\n      this.toggleRowSelection(row);\n    }\n  }\n\n  /**\n   * Toggles selection state for a row.\n   * Respects multiSelect setting for single vs multiple selection.\n   */\n  private toggleRowSelection(row: TableRow) {\n    const rowId = row.id;\n    const isSelected = this.selectedRows.includes(rowId);\n\n    let newSelection: (string | number)[];\n    if (this.multiSelect) {\n      newSelection = isSelected\n        ? this.selectedRows.filter((id) => id !== rowId)\n        : [...this.selectedRows, rowId];\n    } else {\n      newSelection = isSelected ? [] : [rowId];\n    }\n\n    this.selectedRows = newSelection;\n    this.dispatchEvent(\n      new CustomEvent('bp-select', {\n        detail: { selectedRows: newSelection, row, selected: !isSelected },\n        bubbles: true,\n        composed: true,\n      })\n    );\n  }\n\n  /**\n   * Handles select all checkbox toggle.\n   * Selects or deselects all rows based on current state.\n   */\n  private handleSelectAll() {\n    if (this.allSelected) {\n      this.selectedRows = [];\n    } else {\n      this.selectedRows = this.rows.map((row) => row.id);\n    }\n    this.dispatchEvent(\n      new CustomEvent('bp-select', {\n        detail: {\n          selectedRows: this.selectedRows,\n          selectAll: !this.allSelected,\n        },\n        bubbles: true,\n        composed: true,\n      })\n    );\n  }\n\n  /**\n   * Handles checkbox click events.\n   * Stops propagation only on the checkbox itself to prevent row click.\n   */\n  private handleCheckboxClick(event: Event, row?: TableRow) {\n    // Only stop propagation on the checkbox to prevent triggering row click\n    if (event.target instanceof HTMLInputElement) {\n      event.stopPropagation();\n    }\n    if (row) {\n      this.toggleRowSelection(row);\n    } else {\n      this.handleSelectAll();\n    }\n  }\n\n  /** Select all rows */\n  selectAll() {\n    this.selectedRows = this.rows.map((row) => row.id);\n    this.dispatchEvent(\n      new CustomEvent('bp-select', {\n        detail: { selectedRows: this.selectedRows, selectAll: true },\n        bubbles: true,\n        composed: true,\n      })\n    );\n  }\n\n  /** Deselect all rows */\n  deselectAll() {\n    this.selectedRows = [];\n    this.dispatchEvent(\n      new CustomEvent('bp-select', {\n        detail: { selectedRows: [], selectAll: false },\n        bubbles: true,\n        composed: true,\n      })\n    );\n  }\n\n  /** Clear sort state */\n  clearSort() {\n    this.sortState = null;\n  }\n\n  /**\n   * Renders the sort icon for sortable columns.\n   * Shows chevron-up for ascending, chevron-down for descending, unsorted icon otherwise.\n   */\n  private renderSortIcon(column: TableColumn) {\n    if (!column.sortable) return nothing;\n\n    const isActive = this.sortState?.column === column.key;\n    const direction = isActive ? this.sortState?.direction : 'none';\n\n    const iconSvg =\n      direction === 'asc'\n        ? chevronUpSvg\n        : direction === 'desc'\n          ? chevronDownSvg\n          : chevronUpSvg;\n\n    const iconClasses = {\n      'sort-icon': true,\n      'sort-icon--active': isActive && direction !== 'none',\n      'sort-icon--inactive': direction === 'none',\n    };\n\n    return html`\n      <span class=${classMap(iconClasses)} part=\"sort-icon\" aria-hidden=\"true\">\n        <bp-icon .svg=${iconSvg} size=\"sm\"></bp-icon>\n      </span>\n    `;\n  }\n\n  /**\n   * Renders the table header with column labels and sort icons.\n   */\n  private renderHeader() {\n    return html`\n      <thead part=\"thead\">\n        <tr class=\"header-row\" part=\"header-row\">\n          ${\n            this.selectable && this.multiSelect\n              ? html`\n                  <th class=\"cell cell--checkbox\" part=\"header-cell\">\n                    <input\n                      type=\"checkbox\"\n                      part=\"checkbox\"\n                      .checked=${this.allSelected}\n                      .indeterminate=${\n                        this.selectedRows.length > 0 && !this.allSelected\n                      }\n                      @click=${(e: Event) => this.handleCheckboxClick(e)}\n                      aria-label=\"Select all rows\"\n                    />\n                  </th>\n                `\n              : this.selectable\n                ? html`<th class=\"cell cell--checkbox\" part=\"header-cell\"></th>`\n                : nothing\n          }\n          ${repeat(\n            this.columns,\n            (column) => column.key,\n            (column) => html`\n              <th\n                class=\"cell header-cell ${\n                  column.sortable ? 'header-cell--sortable' : ''\n                }\"\n                part=\"header-cell\"\n                style=${column.width ? `width: ${column.width}` : ''}\n                @click=${(e: Event) => this.handleHeaderClick(column, e)}\n                tabindex=${column.sortable ? 0 : -1}\n                @keydown=${(e: KeyboardEvent) => {\n                  if (column.sortable && (e.key === 'Enter' || e.key === ' ')) {\n                    e.preventDefault();\n                    this.handleHeaderClick(column, e);\n                  }\n                }}\n                aria-sort=${\n                  this.sortState?.column === column.key\n                    ? this.sortState.direction === 'asc'\n                      ? 'ascending'\n                      : this.sortState.direction === 'desc'\n                        ? 'descending'\n                        : 'none'\n                    : 'none'\n                }\n              >\n                <span\n                  class=\"header-cell__content\"\n                  style=\"justify-content: ${\n                    column.align === 'center'\n                      ? 'center'\n                      : column.align === 'right'\n                        ? 'flex-end'\n                        : 'flex-start'\n                  }\"\n                >\n                  <span class=\"header-cell__label\">${column.label}</span>\n                  ${this.renderSortIcon(column)}\n                </span>\n              </th>\n            `\n          )}\n        </tr>\n      </thead>\n    `;\n  }\n\n  /**\n   * Renders the table body with rows and cells.\n   * Handles loading and empty states.\n   */\n  private renderBody() {\n    const sortedRows = this.sortedRows;\n\n    if (this.loading) {\n      return html`\n        <tbody part=\"tbody\">\n          <tr>\n            <td\n              colspan=${this.columns.length + (this.selectable ? 1 : 0)}\n              class=\"empty-state\"\n              part=\"empty-state\"\n            >\n              <slot name=\"loading\">\n                <div class=\"state-content\">Loading...</div>\n              </slot>\n            </td>\n          </tr>\n        </tbody>\n      `;\n    }\n\n    if (sortedRows.length === 0) {\n      return html`\n        <tbody part=\"tbody\">\n          <tr>\n            <td\n              colspan=${this.columns.length + (this.selectable ? 1 : 0)}\n              class=\"empty-state\"\n              part=\"empty-state\"\n            >\n              <slot name=\"empty\">\n                <div class=\"state-content\">No data available</div>\n              </slot>\n            </td>\n          </tr>\n        </tbody>\n      `;\n    }\n\n    return html`\n      <tbody part=\"tbody\">\n        ${repeat(\n          sortedRows,\n          (row) => row.id,\n          (row) => {\n            const isSelected = this.selectedRows.includes(row.id);\n            const rowClasses = {\n              row: true,\n              'row--selected': isSelected,\n              'row--hoverable': this.hoverable,\n            };\n\n            return html`\n              <tr\n                class=${classMap(rowClasses)}\n                part=\"row\"\n                @click=${(e: Event) => this.handleRowClick(row, e)}\n                @keydown=${(e: KeyboardEvent) => this.handleRowKeyDown(row, e)}\n                tabindex=${this.selectable ? 0 : -1}\n                aria-selected=${ifDefined(\n                  this.selectable ? (isSelected ? 'true' : 'false') : undefined\n                )}\n              >\n                ${\n                  this.selectable\n                    ? html`\n                        <td class=\"cell cell--checkbox\" part=\"cell\">\n                          <input\n                            type=\"checkbox\"\n                            part=\"checkbox\"\n                            .checked=${isSelected}\n                            @click=${(e: Event) =>\n                              this.handleCheckboxClick(e, row)}\n                            aria-label=\"Select row\"\n                          />\n                        </td>\n                      `\n                    : nothing\n                }\n                ${repeat(\n                  this.columns,\n                  (column) => column.key,\n                  (column) => {\n                    const value = row[column.key];\n                    const content = column.render\n                      ? column.render(value, row)\n                      : value;\n\n                    return html`\n                      <td\n                        class=\"cell\"\n                        part=\"cell\"\n                        style=\"text-align: ${column.align || 'left'}\"\n                      >\n                        ${content}\n                      </td>\n                    `;\n                  }\n                )}\n              </tr>\n            `;\n          }\n        )}\n      </tbody>\n    `;\n  }\n\n  render() {\n    const tableClasses = {\n      table: true,\n      [`table--${this.variant}`]: true,\n      [`table--${this.size}`]: true,\n      'table--sticky-header': this.stickyHeader,\n      'table--selectable': this.selectable,\n      'table--loading': this.loading,\n    };\n\n    return html`\n      <div class=\"table-wrapper\">\n        <table\n          class=${classMap(tableClasses)}\n          part=\"table\"\n          role=\"grid\"\n          aria-busy=${this.loading}\n        >\n          ${this.renderHeader()} ${this.renderBody()}\n        </table>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'bp-table': BpTable;\n  }\n}\n"],"mappings":"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"}