@svgrid/grid-wc 3.0.0 → 3.0.1

package/README.md

@@ -1,110 +1,110 @@
-<p align="center">
-  <img src="https://svgrid.com/brand/svgrid-logo-icon-1200.png" alt="SvGrid" width="100" height="100" />
-</p>
-
-<h1 align="center">@svgrid/grid-wc</h1>
-
-<p align="center"><strong>SvGrid as a framework-agnostic web component.</strong></p>
-
-<p align="center">
-  <a href="https://www.npmjs.com/package/@svgrid/grid-wc"><img src="https://img.shields.io/npm/v/%40svgrid%2Fgrid-wc.svg?label=%40svgrid%2Fgrid-wc" alt="npm version" /></a>
-  <a href="https://www.npmjs.com/package/@svgrid/grid-wc"><img src="https://img.shields.io/npm/dm/%40svgrid%2Fgrid-wc.svg" alt="npm downloads" /></a>
-  <a href="./LICENSE"><img src="https://img.shields.io/badge/license-MIT-brightgreen.svg" alt="MIT License" /></a>
-</p>
-
-<p align="center">
-  <a href="https://svgrid.com">Website</a> ·
-  <a href="https://svgrid.com/docs/">Docs</a> ·
-  <a href="https://svgrid.com/demos/">Demos</a>
-</p>
-
----
-
-A single, self-contained `<sv-grid>`
-[custom element](https://developer.mozilla.org/en-US/docs/Web/API/Web_components)
-you can drop into **React, Vue, Angular, or plain HTML** - no build step, no Svelte
-required in the host app.
-
-Powered by [SvGrid](https://svgrid.com), the Svelte 5 data grid and data table:
-virtual scrolling, Excel-style filters, sorting, inline editing, grouping, and
-pagination.
-
-## CDN (zero build)
-
-```html
-<script type="module" src="https://unpkg.com/@svgrid/grid-wc"></script>
-
-<sv-grid id="grid" sortable filterable style="display:block;height:420px"></sv-grid>
-
-<script type="module">
-  const grid = document.getElementById('grid')
-  // Arrays/objects are set as PROPERTIES, not attributes:
-  grid.columns = [
-    { field: 'name', header: 'Name', editorType: 'text', width: 200 },
-    { field: 'salary', header: 'Salary', align: 'right',
-      format: { type: 'currency', currency: 'USD' } },
-  ]
-  grid.data = [
-    { name: 'Ada Lovelace', salary: 145000 },
-    { name: 'Alan Turing', salary: 160000 },
-  ]
-  grid.addEventListener('rowclick', (e) => console.log(e.detail))
-</script>
-```
-
-## npm
-
-```bash
-npm install @svgrid/grid-wc
-```
-
-```js
-import '@svgrid/grid-wc' // registers <sv-grid> globally
-```
-
-## Attributes & properties
-
-| Name | Kind | Default | Notes |
-| --- | --- | --- | --- |
-| `data` | property | `[]` | Array of row objects. Set via `el.data = [...]`. |
-| `columns` | property | `[]` | Array of column defs. Set via `el.columns = [...]`. |
-| `sortable` | attribute (boolean) | `true` | Enable column sorting. |
-| `filterable` | attribute (boolean) | `true` | Enable column filtering. |
-| `selectable` | attribute (boolean) | `false` | Row checkboxes + selection. |
-| `editable` | attribute (boolean) | `false` | Inline cell editing. |
-| `row-height` | attribute (number) | `36` | Row height in px. |
-
-### Events
-
-| Event | `detail` |
-| --- | --- |
-| `rowclick` | the clicked row object |
-| `selectionchange` | array of selected rows |
-
-## Frameworks
-
-- **React 19+**: `<sv-grid sortable .data={rows} .columns={cols} />` (older React: set via a `ref`).
-- **Vue 3**: `<sv-grid sortable :data.prop="rows" :columns.prop="cols" />`.
-- **Angular**: add `CUSTOM_ELEMENTS_SCHEMA`, then `<sv-grid [data]="rows" [columns]="cols" sortable>`.
-
-Full guide: [svgrid.com/docs/help/web-components](https://svgrid.com/docs/help/web-components/).
-
-## Styling
-
-Built with `shadow: 'none'` (light DOM) so your page CSS and the `--sg-*` theme
-tokens apply, and the grid's overlay popups stay styled:
-
-```css
-sv-grid {
-  --sg-bg: #fff;
-  --sg-header-bg: #f8fafc;
-  --sg-border: #e2e8f0;
-}
-```
-
-## Pro
-
-This element ships the free MIT `@svgrid/grid` core. For export, import,
-print, pivot, and AI, see [@svgrid/enterprise](https://svgrid.com/pricing/).
-
-SvGrid(TM) is a trademark of jQWidgets Ltd. This package is MIT-licensed.
+<p align="center">
+  <img src="https://svgrid.com/brand/svgrid-logo-icon-1200.png" alt="SvGrid" width="100" height="100" />
+</p>
+
+<h1 align="center">@svgrid/grid-wc</h1>
+
+<p align="center"><strong>SvGrid as a framework-agnostic web component.</strong></p>
+
+<p align="center">
+  <a href="https://www.npmjs.com/package/@svgrid/grid-wc"><img src="https://img.shields.io/npm/v/%40svgrid%2Fgrid-wc.svg?label=%40svgrid%2Fgrid-wc" alt="npm version" /></a>
+  <a href="https://www.npmjs.com/package/@svgrid/grid-wc"><img src="https://img.shields.io/npm/dm/%40svgrid%2Fgrid-wc.svg" alt="npm downloads" /></a>
+  <a href="./LICENSE"><img src="https://img.shields.io/badge/license-MIT-brightgreen.svg" alt="MIT License" /></a>
+</p>
+
+<p align="center">
+  <a href="https://svgrid.com">Website</a> ·
+  <a href="https://svgrid.com/docs/">Docs</a> ·
+  <a href="https://svgrid.com/demos/">Demos</a>
+</p>
+
+---
+
+A single, self-contained `<sv-grid>`
+[custom element](https://developer.mozilla.org/en-US/docs/Web/API/Web_components)
+you can drop into **React, Vue, Angular, or plain HTML** - no build step, no Svelte
+required in the host app.
+
+Powered by [SvGrid](https://svgrid.com), the Svelte 5 data grid and data table:
+virtual scrolling, Excel-style filters, sorting, inline editing, grouping, and
+pagination.
+
+## CDN (zero build)
+
+```html
+<script type="module" src="https://unpkg.com/@svgrid/grid-wc"></script>
+
+<sv-grid id="grid" sortable filterable style="display:block;height:420px"></sv-grid>
+
+<script type="module">
+  const grid = document.getElementById('grid')
+  // Arrays/objects are set as PROPERTIES, not attributes:
+  grid.columns = [
+    { field: 'name', header: 'Name', editorType: 'text', width: 200 },
+    { field: 'salary', header: 'Salary', align: 'right',
+      format: { type: 'currency', currency: 'USD' } },
+  ]
+  grid.data = [
+    { name: 'Ada Lovelace', salary: 145000 },
+    { name: 'Alan Turing', salary: 160000 },
+  ]
+  grid.addEventListener('rowclick', (e) => console.log(e.detail))
+</script>
+```
+
+## npm
+
+```bash
+npm install @svgrid/grid-wc
+```
+
+```js
+import '@svgrid/grid-wc' // registers <sv-grid> globally
+```
+
+## Attributes & properties
+
+| Name | Kind | Default | Notes |
+| --- | --- | --- | --- |
+| `data` | property | `[]` | Array of row objects. Set via `el.data = [...]`. |
+| `columns` | property | `[]` | Array of column defs. Set via `el.columns = [...]`. |
+| `sortable` | attribute (boolean) | `true` | Enable column sorting. |
+| `filterable` | attribute (boolean) | `true` | Enable column filtering. |
+| `selectable` | attribute (boolean) | `false` | Row checkboxes + selection. |
+| `editable` | attribute (boolean) | `false` | Inline cell editing. |
+| `row-height` | attribute (number) | `36` | Row height in px. |
+
+### Events
+
+| Event | `detail` |
+| --- | --- |
+| `rowclick` | the clicked row object |
+| `selectionchange` | array of selected rows |
+
+## Frameworks
+
+- **React 19+**: `<sv-grid sortable .data={rows} .columns={cols} />` (older React: set via a `ref`).
+- **Vue 3**: `<sv-grid sortable :data.prop="rows" :columns.prop="cols" />`.
+- **Angular**: add `CUSTOM_ELEMENTS_SCHEMA`, then `<sv-grid [data]="rows" [columns]="cols" sortable>`.
+
+Full guide: [svgrid.com/docs/help/web-components](https://svgrid.com/docs/help/web-components/).
+
+## Styling
+
+Built with `shadow: 'none'` (light DOM) so your page CSS and the `--sg-*` theme
+tokens apply, and the grid's overlay popups stay styled:
+
+```css
+sv-grid {
+  --sg-bg: #fff;
+  --sg-header-bg: #f8fafc;
+  --sg-border: #e2e8f0;
+}
+```
+
+## Pro
+
+This element ships the free MIT `@svgrid/grid` core. For export, import,
+print, pivot, and AI, see [@svgrid/enterprise](https://svgrid.com/pricing/).
+
+SvGrid(TM) is a trademark of jQWidgets Ltd. This package is MIT-licensed.

package/dist/{GridMenus-DpmS1pzo.js → GridMenus-YwTw9Upd.js}

@@ -2,7 +2,7 @@ import { $ as e, A as t, C as n, D as r, E as i, F as a, H as o, I as s, J as c,
 import { c as B, s as V, t as H } from "./svelte-virtualizer.svelte-DZ9UcyfT.js";
 import { S as ie, h as ae, u as oe, w as se } from "./SvGrid.helpers-BdVDtjUm.js";
 import { i as U, t as W } from "./editor-contract-peBDxir_.js";
-import { t as ce } from "./SvField-ChCI-O2O.js";
+import { t as ce } from "./SvField-CE345DyF.js";
 import { n as le } from "./dismissable-DvhBKm3q.js";
 //#region ../grid/dist/list-option.js
 function ue(e) {
@@ -294,14 +294,14 @@ function he(t) {
 }
 //#endregion
 //#region ../grid/dist/SvListBox.svelte
-var ge = D("<span aria-hidden=\"true\"></span>"), _e = D("<span class=\"sv-listbox__check svelte-wftsyc\" aria-hidden=\"true\"> </span>"), ve = D("<span class=\"sv-listbox__label svelte-wftsyc\"> </span>"), ye = D("<span class=\"sv-listbox__hint svelte-wftsyc\" aria-hidden=\"true\"> </span>"), be = D("<!> <!> <!>", 1), xe = D("<div><!></div>"), Se = D("<div class=\"sv-listbox__group svelte-wftsyc\" role=\"presentation\"> </div>"), Ce = D("<div class=\"sv-listbox__sb svelte-wftsyc\" aria-hidden=\"true\"><div></div></div>"), we = D("<div class=\"sv-listbox__vp svelte-wftsyc\"></div> <!>", 1), Te = D("<div class=\"sv-listbox__group svelte-wftsyc\" role=\"presentation\"> </div>"), Ee = D("<!> <!>", 1), X = D("<input type=\"hidden\"/>"), De = D("<div><!></div> <!>", 1);
+var ge = D("<span aria-hidden=\"true\"></span>"), _e = D("<span class=\"sv-listbox__check svelte-1qscmce\" aria-hidden=\"true\"> </span>"), ve = D("<span class=\"sv-listbox__label svelte-1qscmce\"> </span>"), ye = D("<span class=\"sv-listbox__hint svelte-1qscmce\" aria-hidden=\"true\"> </span>"), be = D("<!> <!> <!>", 1), xe = D("<div><!></div>"), Se = D("<div class=\"sv-listbox__group svelte-1qscmce\" role=\"presentation\"> </div>"), Ce = D("<div class=\"sv-listbox__sb svelte-1qscmce\" aria-hidden=\"true\"><div></div></div>"), we = D("<div class=\"sv-listbox__vp svelte-1qscmce\"></div> <!>", 1), Te = D("<div class=\"sv-listbox__group svelte-1qscmce\" role=\"presentation\"> </div>"), Ee = D("<!> <!>", 1), X = D("<input type=\"hidden\"/>"), De = D("<div><!></div> <!>", 1);
 function Oe(n, a) {
 	ne(a, !0);
 	let p = (e, n = E) => {
 		var o = be(), s = N(o), u = (e) => {
 			var t = ge();
 			let r;
-			m((e) => r = R(t, 1, "sv-listbox__box svelte-wftsyc", null, r, e), [() => ({ "is-on": q(n()) })]), O(e, t);
+			m((e) => r = R(t, 1, "sv-listbox__box svelte-1qscmce", null, r, e), [() => ({ "is-on": q(n()) })]), O(e, t);
 		}, f = (e) => {
 			var t = _e(), r = l(t, !0);
 			P(t), m((e) => d(r, e), [() => q(n()) ? "✓" : ""]), O(e, t);
@@ -344,7 +344,7 @@ function Oe(n, a) {
 				height: `${r() ?? fe(t())}px`,
 				transform: i() == null ? void 0 : `translateY(${i()}px)`
 			})
-		], void 0, void 0, "svelte-wftsyc");
+		], void 0, void 0, "svelte-1qscmce");
 		var o = l(a);
 		p(o, t), P(a), O(e, a);
 	}, v = A(a, "value", 3, null), w = A(a, "multiple", 3, !1), D = A(a, "checkbox", 3, !1), j = A(a, "block", 3, !1), ee = A(a, "disabled", 3, !1), te = A(a, "size", 3, "md"), re = A(a, "rows", 3, 7), B = A(a, "virtual", 3, !1), V = A(a, "rowHeight", 3, 32), ie = A(a, "groupHeaderHeight", 3, 28), ae = A(a, "invalid", 3, !1), oe = A(a, "required", 3, !1), se = U("sv-lb"), W = e(() => a.id ?? se), le = e(() => ue(a.options)), K = me({
@@ -429,7 +429,7 @@ function Oe(n, a) {
 					"--sv-rows": re(),
 					"--sv-row-h": `${f(J)}px`
 				}
-			}), [() => K.rootProps()], void 0, void 0, "svelte-wftsyc");
+			}), [() => K.rootProps()], void 0, void 0, "svelte-1qscmce");
 			var _ = l(p), v = (n) => {
 				var r = we(), a = N(r);
 				L(a, 21, () => f(Ne), (e) => e.key, (n, r) => {
@@ -455,7 +455,7 @@ function Oe(n, a) {
 					var t = Ce(), n = l(t);
 					let r, i;
 					P(t), m(() => {
-						r = R(n, 1, "sv-listbox__thumb svelte-wftsyc", null, r, { "is-dragging": Q.dragging }), i = I(n, "", i, {
+						r = R(n, 1, "sv-listbox__thumb svelte-1qscmce", null, r, { "is-dragging": Q.dragging }), i = I(n, "", i, {
 							height: `${Q.thumbH}px`,
 							transform: `translateY(${Q.thumbTop}px)`
 						});
@@ -524,7 +524,7 @@ a([
 ]);
 //#endregion
 //#region ../grid/dist/GridMenus.svelte
-var ke = D("<option> </option>"), Ae = D("<input class=\"sv-grid-menu-condition-value\" placeholder=\"To\"/>"), je = D("<input class=\"sv-grid-menu-condition-value\"/> <!>", 1), Me = D("<option> </option>"), Z = D("<input class=\"sv-grid-menu-condition-value\" placeholder=\"To\"/>"), Ne = D("<input class=\"sv-grid-menu-condition-value\"/> <!>", 1), Pe = D("<div class=\"sv-grid-menu-join\" role=\"radiogroup\" aria-label=\"Combine conditions\"><button type=\"button\">AND</button> <button type=\"button\">OR</button> <button type=\"button\" class=\"sv-grid-menu-join-x\" title=\"Remove second condition\" aria-label=\"Remove second condition\">×</button></div> <select class=\"sv-grid-menu-operator-select\" aria-label=\"Second filter condition\"></select> <!>", 1), Q = D("<button type=\"button\" class=\"sv-grid-menu-add-cond\">+ Add condition</button>"), Fe = D("<!>  <!>", 1), Ie = D("<span class=\"sv-grid-menu-head-note\">and the condition above</span>"), Le = D("<span class=\"sv-grid-menu-head-note\"> </span>"), Re = D("<div class=\"sv-grid-facet-empty\">No values</div>"), ze = D("<div class=\"sv-grid-facet-note\"> </div>"), Be = D("<div class=\"sv-grid-menu-filter\"><div class=\"sv-grid-menu-filter-head\"><span class=\"sv-grid-header-icon\"><!></span> Filter\n        condition</div> <select class=\"sv-grid-menu-operator-select\" aria-label=\"Filter condition\"></select> <!> <div class=\"sv-grid-menu-sep\"></div> <div class=\"sv-grid-menu-filter-head\">Values <!></div> <input class=\"sv-grid-menu-search\" placeholder=\"Search values...\"/> <label class=\"sv-grid-facet sv-grid-facet-all\"><input type=\"checkbox\"/> <span class=\"sv-grid-facet-label\"> </span></label> <!> <!> <div class=\"sv-grid-menu-actions\"><button type=\"button\" class=\"sv-grid-menu-btn\">Clear filter</button> <button type=\"button\" class=\"sv-grid-menu-btn sv-grid-menu-btn-primary\">Done</button></div></div>"), Ve = D("<div role=\"tooltip\"> </div>"), He = D("<div class=\"sv-grid-menu-backdrop\" role=\"presentation\"></div>"), Ue = D("<button type=\"button\" role=\"tab\">Filter</button>"), We = D("<div class=\"sv-grid-menu-tabs\" role=\"tablist\"><button type=\"button\" role=\"tab\">General</button> <!> <button type=\"button\" role=\"tab\">Columns</button></div>"), Ge = D("<div class=\"sv-grid-menu-filter-head\">Visible columns</div> <!>", 1), Ke = D("<button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Sort\n          ascending</button> <button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Sort\n          descending</button> <button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Remove sort</button>", 1), qe = D("<div class=\"sv-grid-menu-sep\"></div> <button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Pin to left</button> <button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Pin to right</button> <button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Unpin column</button>", 1), Je = D("<button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Autosize\n          this column</button>"), Ye = D("<div class=\"sv-grid-menu-sep\"></div> <button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Group\n          by this column</button> <button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Remove grouping</button>", 1), Xe = D("<button type=\"button\" role=\"menuitem\" aria-haspopup=\"menu\"><span class=\"sv-grid-header-icon\"><!></span> Choose columns <span class=\"sv-grid-header-icon sv-grid-menu-item-chevron\"><!></span></button>"), Ze = D("<!> <!> <div class=\"sv-grid-menu-sep\"></div> <!> <button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Autosize\n        all columns</button> <!> <div class=\"sv-grid-menu-sep\"></div> <!> <button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Reset columns</button>", 1), Qe = D("<div class=\"sv-grid-menu sv-grid-column-menu\" role=\"menu\"><!> <!></div>"), $e = D("<div class=\"sv-grid-menu sv-grid-filter-menu\" role=\"menu\" tabindex=\"-1\"><!></div>"), et = D("<div class=\"sv-grid-menu sv-grid-choose-columns-menu\" role=\"menu\"><div class=\"sv-grid-menu-filter-head\">Visible columns</div> <!></div>"), tt = D("<button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitemradio\"><span class=\"sv-grid-header-icon\"><!></span> </button>"), nt = D("<div class=\"sv-grid-menu sv-grid-operator-menu\" role=\"menu\"></div>"), rt = D("<div class=\"sv-grid-facet-empty\">No values</div>"), it = D("<div class=\"sv-grid-menu sv-grid-in-suggest\"><!></div>"), at = D("<div class=\"sv-grid-menu-sep\"></div>"), ot = D("<button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"> </button>"), st = D("<div class=\"sv-grid-menu-backdrop\" role=\"presentation\"></div> <div class=\"sv-grid-menu sv-grid-context-menu\" role=\"menu\"></div>", 1), ct = D("<div class=\"sv-grid-menu-backdrop\" role=\"presentation\"></div> <div class=\"sv-grid-menu sv-grid-comment-editor\" role=\"dialog\" aria-label=\"Edit comment\"><textarea class=\"sv-grid-comment-textarea\" rows=\"3\" placeholder=\"Add a comment…\"></textarea> <div class=\"sv-grid-comment-actions\"><button type=\"button\" class=\"sv-grid-comment-remove\">Remove</button> <span class=\"sv-grid-comment-spacer\"></span> <button type=\"button\" class=\"sv-grid-comment-cancel\">Cancel</button> <button type=\"button\" class=\"sv-grid-comment-save\">Save</button></div></div>", 1), lt = D("<!> <!>  <!> <!> <!> <!> <!> <!> <!>", 1);
+var ke = D("<option> </option>"), Ae = D("<input class=\"sv-grid-menu-condition-value\" placeholder=\"To\"/>"), je = D("<input class=\"sv-grid-menu-condition-value\"/> <!>", 1), Me = D("<option> </option>"), Z = D("<input class=\"sv-grid-menu-condition-value\" placeholder=\"To\"/>"), Ne = D("<input class=\"sv-grid-menu-condition-value\"/> <!>", 1), Pe = D("<div class=\"sv-grid-menu-join\" role=\"radiogroup\" aria-label=\"Combine conditions\"><button type=\"button\">AND</button> <button type=\"button\">OR</button> <button type=\"button\" class=\"sv-grid-menu-join-x\" title=\"Remove second condition\" aria-label=\"Remove second condition\"><!></button></div> <select class=\"sv-grid-menu-operator-select\" aria-label=\"Second filter condition\"></select> <!>", 1), Q = D("<button type=\"button\" class=\"sv-grid-menu-add-cond\">+ Add condition</button>"), Fe = D("<!>  <!>", 1), Ie = D("<span class=\"sv-grid-menu-head-note\">and the condition above</span>"), Le = D("<span class=\"sv-grid-menu-head-note\"> </span>"), Re = D("<div class=\"sv-grid-facet-empty\">No values</div>"), ze = D("<div class=\"sv-grid-facet-note\"> </div>"), Be = D("<div class=\"sv-grid-menu-filter\"><div class=\"sv-grid-menu-filter-head\"><span class=\"sv-grid-header-icon\"><!></span> Filter\n        condition</div> <select class=\"sv-grid-menu-operator-select\" aria-label=\"Filter condition\"></select> <!> <div class=\"sv-grid-menu-sep\"></div> <div class=\"sv-grid-menu-filter-head\">Values <!></div> <span class=\"sv-grid-menu-search-wrap\"><!> <input class=\"sv-grid-menu-search\" placeholder=\"Search values...\"/></span> <label class=\"sv-grid-facet sv-grid-facet-all\"><input type=\"checkbox\"/> <span class=\"sv-grid-facet-label\"> </span></label> <!> <!> <div class=\"sv-grid-menu-actions\"><button type=\"button\" class=\"sv-grid-menu-btn\">Clear filter</button> <button type=\"button\" class=\"sv-grid-menu-btn sv-grid-menu-btn-primary\">Done</button></div></div>"), Ve = D("<div role=\"tooltip\"> </div>"), He = D("<div class=\"sv-grid-menu-backdrop\" role=\"presentation\"></div>"), Ue = D("<button type=\"button\" role=\"tab\">Filter</button>"), We = D("<div class=\"sv-grid-menu-tabs\" role=\"tablist\"><button type=\"button\" role=\"tab\">General</button> <!> <button type=\"button\" role=\"tab\">Columns</button></div>"), Ge = D("<div class=\"sv-grid-menu-filter-head\">Visible columns</div> <!>", 1), Ke = D("<button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Sort\n          ascending</button> <button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Sort\n          descending</button> <button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Remove sort</button>", 1), qe = D("<div class=\"sv-grid-menu-sep\"></div> <button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Pin to left</button> <button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Pin to right</button> <button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Unpin column</button>", 1), Je = D("<button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Autosize\n          this column</button>"), Ye = D("<div class=\"sv-grid-menu-sep\"></div> <button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Group\n          by this column</button> <button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Remove grouping</button>", 1), Xe = D("<button type=\"button\" role=\"menuitem\" aria-haspopup=\"menu\"><span class=\"sv-grid-header-icon\"><!></span> Choose columns <span class=\"sv-grid-header-icon sv-grid-menu-item-chevron\"><!></span></button>"), Ze = D("<!> <!> <div class=\"sv-grid-menu-sep\"></div> <!> <button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Autosize\n        all columns</button> <!> <div class=\"sv-grid-menu-sep\"></div> <!> <button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"><span class=\"sv-grid-header-icon\"><!></span> Reset columns</button>", 1), Qe = D("<div class=\"sv-grid-menu sv-grid-column-menu\" role=\"menu\"><!> <!></div>"), $e = D("<div class=\"sv-grid-menu sv-grid-filter-menu\" role=\"menu\" tabindex=\"-1\"><!></div>"), et = D("<div class=\"sv-grid-menu sv-grid-choose-columns-menu\" role=\"menu\"><div class=\"sv-grid-menu-filter-head\">Visible columns</div> <!></div>"), tt = D("<button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitemradio\"><span class=\"sv-grid-header-icon\"><!></span> </button>"), nt = D("<div class=\"sv-grid-menu sv-grid-operator-menu\" role=\"menu\"></div>"), rt = D("<div class=\"sv-grid-facet-empty\">No values</div>"), it = D("<div class=\"sv-grid-menu sv-grid-in-suggest\"><!></div>"), at = D("<div class=\"sv-grid-menu-sep\"></div>"), ot = D("<button type=\"button\" class=\"sv-grid-menu-item\" role=\"menuitem\"> </button>"), st = D("<div class=\"sv-grid-menu-backdrop\" role=\"presentation\"></div> <div class=\"sv-grid-menu sv-grid-context-menu\" role=\"menu\"></div>", 1), ct = D("<div class=\"sv-grid-menu-backdrop\" role=\"presentation\"></div> <div class=\"sv-grid-menu sv-grid-comment-editor\" role=\"dialog\" aria-label=\"Edit comment\"><textarea class=\"sv-grid-comment-textarea\" rows=\"3\" placeholder=\"Add a comment…\"></textarea> <div class=\"sv-grid-comment-actions\"><button type=\"button\" class=\"sv-grid-comment-remove\">Remove</button> <span class=\"sv-grid-comment-spacer\"></span> <button type=\"button\" class=\"sv-grid-comment-cancel\">Cancel</button> <button type=\"button\" class=\"sv-grid-comment-save\">Save</button></div></div>", 1), lt = D("<!> <!>  <!> <!> <!> <!> <!> <!> <!>", 1);
 function $(a, y) {
 	ne(y, !0);
 	let b = (a, o = E) => {
@@ -542,9 +542,9 @@ function $(a, y) {
 		}), P(B);
 		var V;
 		w(B);
-		var H = c(B, 2), U = (r) => {
-			let a = e(() => f(M)[o()]);
-			var y = Fe(), S = N(y), E = (r) => {
+		var H = c(B, 2), U = (a) => {
+			let S = e(() => f(M)[o()]);
+			var E = Fe(), D = N(E), k = (r) => {
 				var a = t(), s = N(a), c = (r) => {
 					var a = t(), s = N(a), c = (r) => {
 						let i = e(() => f(St)), a = e(() => oe(f(M)[o()]?.value)), s = e(() => oe(f(M)[o()]?.valueTo));
@@ -594,7 +594,7 @@ function $(a, y) {
 				i(s, (e) => {
 					f(g) === "between" ? e(c) : f(xt) && e(l, 1);
 				}), O(r, a);
-			}, D = (t) => {
+			}, A = (t) => {
 				let n = e(() => f(g) === "in" || f(g) === "notIn");
 				var r = je(), a = N(r);
 				x(a);
@@ -617,54 +617,54 @@ function $(a, y) {
 					f(ye)(o(), t.value), f(n) && It(t, o());
 				}), O(t, r);
 			};
-			i(S, (e) => {
-				f(b) ? e(E) : e(D, -1);
+			i(D, (e) => {
+				f(b) ? e(k) : e(A, -1);
 			});
-			var k = c(S, 2), A = (t) => {
-				let n = e(() => f(a).operator2 ?? f(Se)(f(p)));
-				var r = Pe(), u = N(r), g = l(u);
-				let y;
-				var b = c(g, 2);
-				let S;
-				var E = c(b, 2);
-				P(u);
-				var D = c(u, 2);
-				L(D, 21, () => f(h), (e) => e.value, (e, t) => {
+			var j = c(D, 2), ee = (t) => {
+				let n = e(() => f(S).operator2 ?? f(Se)(f(p)));
+				var a = Pe(), u = N(a), g = l(u);
+				let b;
+				var E = c(g, 2);
+				let D;
+				var k = c(E, 2), A = l(k);
+				r(A, () => y.icon, () => "remove"), P(k), P(u);
+				var j = c(u, 2);
+				L(j, 21, () => f(h), (e) => e.value, (e, t) => {
 					var n = Me(), r = l(n, !0);
 					P(n);
 					var i = {};
 					m((e) => {
 						d(r, e), i !== (i = f(t).value) && (n.value = (n.__value = f(t).value) ?? "");
 					}, [() => f(Ce)(f(t), f(p))]), O(e, n);
-				}), P(D);
-				var k;
-				w(D);
-				var A = c(D, 2), j = (e) => {
+				}), P(j);
+				var M;
+				w(j);
+				var ee = c(j, 2), te = (e) => {
 					var t = Ne(), r = N(t);
 					x(r);
-					var l = c(r, 2), u = (e) => {
+					var a = c(r, 2), l = (e) => {
 						var t = Z();
 						x(t), m(() => {
-							C(t, "type", f(_)), T(t, f(a).valueTo2 ?? "");
+							C(t, "type", f(_)), T(t, f(S).valueTo2 ?? "");
 						}), s("input", t, (e) => X(o(), { valueTo2: e.currentTarget.value })), O(e, t);
 					};
-					i(l, (e) => {
-						f(n) === "between" && e(u);
+					i(a, (e) => {
+						f(n) === "between" && e(l);
 					}), m(() => {
-						C(r, "type", f(_)), T(r, f(a).value2 ?? ""), C(r, "placeholder", f(n) === "between" ? "From" : "Filter value...");
+						C(r, "type", f(_)), T(r, f(S).value2 ?? ""), C(r, "placeholder", f(n) === "between" ? "From" : "Filter value...");
 					}), s("input", r, (e) => X(o(), { value2: e.currentTarget.value })), O(e, t);
 				};
-				i(A, (e) => {
-					f(n) !== "isBlank" && e(j);
+				i(ee, (e) => {
+					f(n) !== "isBlank" && e(te);
 				}), m(() => {
-					y = R(g, 1, "", null, y, { "is-on": (f(a).join ?? "AND") === "AND" }), S = R(b, 1, "", null, S, { "is-on": f(a).join === "OR" }), k !== (k = f(n)) && (D.value = (D.__value = f(n)) ?? "", v(D, f(n)));
-				}), s("click", g, () => X(o(), { join: "AND" })), s("click", b, () => X(o(), { join: "OR" })), s("click", E, () => X(o(), {
+					b = R(g, 1, "", null, b, { "is-on": (f(S).join ?? "AND") === "AND" }), D = R(E, 1, "", null, D, { "is-on": f(S).join === "OR" }), M !== (M = f(n)) && (j.value = (j.__value = f(n)) ?? "", v(j, f(n)));
+				}), s("click", g, () => X(o(), { join: "AND" })), s("click", E, () => X(o(), { join: "OR" })), s("click", k, () => X(o(), {
 					operator2: void 0,
 					value2: void 0,
 					valueTo2: void 0,
 					join: void 0
-				})), s("change", D, (e) => X(o(), { operator2: e.currentTarget.value })), O(t, r);
-			}, j = (e) => {
+				})), s("change", j, (e) => X(o(), { operator2: e.currentTarget.value })), O(t, a);
+			}, te = (e) => {
 				var t = Q();
 				s("click", t, () => X(o(), {
 					operator2: f(Se)(f(p)),
@@ -672,9 +672,9 @@ function $(a, y) {
 					join: "AND"
 				})), O(e, t);
 			};
-			i(k, (e) => {
-				f(a)?.operator2 ? e(A) : e(j, -1);
-			}), O(r, y);
+			i(j, (e) => {
+				f(S)?.operator2 ? e(ee) : e(te, -1);
+			}), O(a, E);
 		};
 		i(H, (e) => {
 			f(g) !== "isBlank" && f(g) !== "isNotBlank" && e(U);
@@ -689,13 +689,15 @@ function $(a, y) {
 		i(ce, (e) => {
 			f(k) ? e(le) : f(A) < f(ne) && e(ue, 1);
 		}), P(W);
-		var G = c(W, 2);
-		x(G);
-		var de = c(G, 2), K = l(de);
-		x(K);
-		var q = c(K, 2), fe = l(q, !0);
-		P(q), P(de);
-		var Y = c(de, 2), pe = (t) => {
+		var G = c(W, 2), de = l(G);
+		r(de, () => y.icon, () => "search");
+		var K = c(de, 2);
+		x(K), P(G);
+		var q = c(G, 2), fe = l(q);
+		x(fe);
+		var Y = c(fe, 2), pe = l(Y, !0);
+		P(Y), P(q);
+		var me = c(q, 2), he = (t) => {
 			{
 				let n = e(() => f(Tt).length > Pt);
 				Oe(t, {
@@ -720,24 +722,24 @@ function $(a, y) {
 					onChange: (e) => f(Dt)(o(), e)
 				});
 			}
-		}, me = (e) => {
+		}, ge = (e) => {
 			var t = Re();
 			O(e, t);
 		};
-		i(Y, (e) => {
-			f(Tt).length ? e(pe) : e(me, -1);
+		i(me, (e) => {
+			f(Tt).length ? e(he) : e(ge, -1);
 		});
-		var he = c(Y, 2), ge = (e) => {
+		var _e = c(me, 2), we = (e) => {
 			var t = ze(), n = l(t);
 			P(t), m(() => d(n, `Showing ${f(yt).length ?? ""} of ${f(vt).length ?? ""}`)), O(e, t);
 		};
-		i(he, (e) => {
-			f(vt).length > f(yt).length && e(ge);
+		i(_e, (e) => {
+			f(vt).length > f(yt).length && e(we);
 		});
-		var _e = c(he, 2), we = l(_e), Te = c(we, 2);
-		P(_e), P(F), m((e, t) => {
-			V !== (V = f(g)) && (B.value = (B.__value = f(g)) ?? "", v(B, f(g))), ee(K, e), d(fe, f(S) ? "(Select all results)" : "(Select all)"), we.disabled = t;
-		}, [() => f(Mt)(o()), () => !f(De)(o())]), s("change", B, (e) => f(ve)(o(), e.currentTarget.value)), te(G, () => D().columnMenuSearch, (e) => D().columnMenuSearch = e), s("change", K, () => f(Nt)(o())), s("click", we, () => f(Bt)(o())), s("click", Te, function(...e) {
+		var Te = c(_e, 2), Ee = l(Te), Ve = c(Ee, 2);
+		P(Te), P(F), m((e, t) => {
+			V !== (V = f(g)) && (B.value = (B.__value = f(g)) ?? "", v(B, f(g))), ee(fe, e), d(pe, f(S) ? "(Select all results)" : "(Select all)"), Ee.disabled = t;
+		}, [() => f(Mt)(o()), () => !f(De)(o())]), s("change", B, (e) => f(ve)(o(), e.currentTarget.value)), te(K, () => D().columnMenuSearch, (e) => D().columnMenuSearch = e), s("change", fe, () => f(Nt)(o())), s("click", Ee, () => f(Bt)(o())), s("click", Ve, function(...e) {
 			f($)?.apply(this, e);
 		}), O(a, F);
 	}, D = A(y, "ctrl", 7), k = e(() => D().groupingControlsEnabled), M = e(() => D().filterMenuValues), F = e(() => D().tooltip), z = e(() => D().columnMenuFor), H = e(() => D().columnMenuPos), U = e(() => D().filterMenuFor), W = e(() => D().filterMenuPos), ce = e(() => D().operatorMenuFor), ue = e(() => D().operatorMenuPos), G = e(() => D().chooseColumnsPos), de = e(() => D().showColumnFiltersEffective), K = e(() => D().props.columnMenuTabs === !0), q = e(() => D().grid), J = e(() => D().allColumns), fe = e(() => D().isColumnPinned), Y = e(() => D().pinColumnLeft), pe = e(() => D().pinColumnRight), me = e(() => D().unpinColumn), he = e(() => D().sortDirectionByColumn), ge = e(() => D().groupingColumns), _e = e(() => D().columnVirtualizationEnabled), ve = e(() => D().updateFilterOperator), ye = e(() => D().updateFilterMenuValue), be = e(() => D().updateFilterMenuValueTo), xe = e(() => D().operatorsForColumn), Se = e(() => D().defaultOperatorFor), Ce = e(() => D().operatorLabelFor), we = e(() => D().filterRowValues), Te = e(() => D().inSuggestFor), Ee = e(() => D().inSuggestPos);
@@ -773,7 +775,7 @@ function $(a, y) {
 		let e = f(U) ?? f(z);
 		if (!e) return;
 		let t = f(J).find((t) => t.id === e);
-		se(t?.columnDef.editorType) && (f(xt) || import("./SvDateTimePicker-DVFiDxUq.js").then((e) => g(xt, e.default, !0)), f(St) || import("./SvDateRangeInput-u4ibte8S.js").then((e) => g(St, e.default, !0)));
+		se(t?.columnDef.editorType) && (f(xt) || import("./SvDateTimePicker-xAO-Pb4S.js").then((e) => g(xt, e.default, !0)), f(St) || import("./SvDateRangeInput-CrxeppBV.js").then((e) => g(St, e.default, !0)));
 	});
 	function Ct(e) {
 		requestAnimationFrame(() => {
@@ -896,11 +898,11 @@ function $(a, y) {
 			var p = c(u, 2), h = (t) => {
 				let i = e(() => f(fe)(f(n)));
 				var a = qe(), o = c(N(a), 2), u = l(o), d = l(u);
-				r(d, () => y.icon, () => "op-startsWith"), P(u), j(), P(o);
+				r(d, () => y.icon, () => "pin-left"), P(u), j(), P(o);
 				var p = c(o, 2), h = l(p), g = l(h);
-				r(g, () => y.icon, () => "op-greaterThan"), P(h), j(), P(p);
+				r(g, () => y.icon, () => "pin-right"), P(h), j(), P(p);
 				var _ = c(p, 2), v = l(_), b = l(v);
-				r(b, () => y.icon, () => "x"), P(v), j(), P(_), m(() => {
+				r(b, () => y.icon, () => "unpin"), P(v), j(), P(_), m(() => {
 					o.disabled = f(i) === "left", p.disabled = f(i) === "right", _.disabled = !f(i);
 				}), s("click", o, () => f(Y)(f(n))), s("click", p, () => f(pe)(f(n))), s("click", _, () => f(me)(f(n))), O(t, a);
 			};

package/dist/{SvDateRangeInput-u4ibte8S.js → SvDateRangeInput-CrxeppBV.js}

@@ -1,10 +1,10 @@
 import { $ as e, E as t, F as n, H as r, I as i, J as a, K as o, R as s, V as c, X as l, Y as u, Z as d, a as f, d as p, et as m, f as h, h as g, j as _, k as v, n as y, q as ee, rt as b, tt as x, u as te, v as ne, x as S, y as C } from "./client-DjwUji8D.js";
 import { a as w, i as T, t as re } from "./editor-contract-peBDxir_.js";
-import { i as E, o as D, r as ie, t as O } from "./date-format-CPHqTHN6.js";
+import { i as E, o as D, r as ie, t as O } from "./date-format-D_oQ5Yw0.js";
 import { n as ae, r as oe, t as se } from "./popover-WsGlvtQv.js";
-import { t as k } from "./SvField-ChCI-O2O.js";
+import { t as k } from "./SvField-CE345DyF.js";
 //#region ../grid/dist/SvDateRangeInput.svelte
-var ce = _("<button type=\"button\" class=\"sv-dri__clear svelte-1yf2bzw\">&times;</button>"), le = _("<div class=\"sv-dri__panel\" role=\"dialog\"><!></div>"), A = _("<input type=\"hidden\"/> <input type=\"hidden\"/>", 1), ue = _("<div><div><svg class=\"sv-dri__icon svelte-1yf2bzw\" viewBox=\"0 0 24 24\" width=\"15\" height=\"15\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><rect x=\"3\" y=\"4\" width=\"18\" height=\"18\" rx=\"2\"></rect><path d=\"M16 2v4M8 2v4M3 10h18\"></path></svg> <input/> <!></div> <!> <!></div>");
+var ce = _("<button type=\"button\" class=\"sv-dri__clear svelte-1rb3yee\">&times;</button>"), le = _("<div class=\"sv-dri__panel\" role=\"dialog\"><!></div>"), A = _("<input type=\"hidden\"/> <input type=\"hidden\"/>", 1), ue = _("<div><div><svg class=\"sv-dri__icon svelte-1rb3yee\" viewBox=\"0 0 24 24\" width=\"15\" height=\"15\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><rect x=\"3\" y=\"4\" width=\"18\" height=\"18\" rx=\"2\"></rect><path d=\"M16 2v4M8 2v4M3 10h18\"></path></svg> <input/> <!></div> <!> <!></div>");
 function j(n, _) {
 	x(_, !0);
 	let j = {
@@ -111,7 +111,7 @@ function j(n, _) {
 				error: _.error,
 				hint: _.hint,
 				ariaLabel: _.ariaLabel
-			})], void 0, void 0, "svelte-1yf2bzw", !0), f(y, (e) => l(X, e), () => s(X)), S(y, (e) => Ee?.(e));
+			})], void 0, void 0, "svelte-1rb3yee", !0), f(y, (e) => l(X, e), () => s(X)), S(y, (e) => Ee?.(e));
 			var x = a(y, 2), w = (e) => {
 				var t = ce();
 				c(() => h(t, "aria-label", s(V).clear)), i("click", t, (e) => {
@@ -180,10 +180,10 @@ function j(n, _) {
 			t(D, (e) => {
 				_.name && e(O);
 			}), b(r), c(() => {
-				u = C(r, 1, "sv-dri svelte-1yf2bzw", null, u, {
+				u = C(r, 1, "sv-dri svelte-1rb3yee", null, u, {
 					"is-block": ye(),
 					"sv-dri--disabled": L()
-				}), m = C(d, 1, `sv-dri__field sv-dri__field--${ve() ?? ""}`, "svelte-1yf2bzw", m, { "is-invalid": R() }), h(d, "dir", s(H)), d.dir = d.dir;
+				}), m = C(d, 1, `sv-dri__field sv-dri__field--${ve() ?? ""}`, "svelte-1rb3yee", m, { "is-invalid": R() }), h(d, "dir", s(H)), d.dir = d.dir;
 			}), i("click", d, () => {
 				s(U) && (s(X)?.focus(), J());
 			}), v(e, r);