@ixfx/components 0.10.1 → 0.10.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bundle/index.d.ts +186 -20
- package/bundle/index.d.ts.map +1 -1
- package/bundle/index.js +1925 -127
- package/bundle/index.js.map +1 -1
- package/dist/ac-text.js +1 -1
- package/dist/ac-token.js +2 -2
- package/dist/{colour-picker-R73i0QTP.js → colour-picker-WDrPuqoO.js} +2 -2
- package/dist/{colour-picker-R73i0QTP.js.map → colour-picker-WDrPuqoO.js.map} +1 -1
- package/dist/colour-picker.js +1 -1
- package/dist/crumbs.js +2 -2
- package/dist/{data-grid-BT1d_nlu.d.ts → data-grid-f9W2uzaR.d.ts} +3 -2
- package/dist/data-grid-f9W2uzaR.d.ts.map +1 -0
- package/dist/data-grid.d.ts +1 -1
- package/dist/data-grid.js +27 -9
- package/dist/data-grid.js.map +1 -1
- package/dist/defaults-kVl1t2tT.js +59 -0
- package/dist/defaults-kVl1t2tT.js.map +1 -0
- package/dist/{detail-list-BCaIN7nx.d.ts → detail-list-C3tozzBT.d.ts} +3 -3
- package/dist/{detail-list-BCaIN7nx.d.ts.map → detail-list-C3tozzBT.d.ts.map} +1 -1
- package/dist/detail-list.d.ts +2 -2
- package/dist/detail-list.js +3 -3
- package/dist/{grid-list-CiwlNE4c.d.ts → grid-list-CM1XhTaW.d.ts} +15 -2
- package/dist/{grid-list-CiwlNE4c.d.ts.map → grid-list-CM1XhTaW.d.ts.map} +1 -1
- package/dist/{grid-list-DLfw5HI4.js → grid-list-WE92nfX5.js} +103 -7
- package/dist/grid-list-WE92nfX5.js.map +1 -0
- package/dist/grid-list.d.ts +1 -1
- package/dist/grid-list.js +1 -1
- package/dist/handle-DAXs7kbJ.js +656 -0
- package/dist/handle-DAXs7kbJ.js.map +1 -0
- package/dist/{icon-BCJJYEpm.js → icon-1gpwtPx8.js} +10 -1
- package/dist/icon-1gpwtPx8.js.map +1 -0
- package/dist/icon-DR_3rSyZ.d.ts.map +1 -1
- package/dist/icons.d.ts +1 -1
- package/dist/icons.js +2 -2
- package/dist/{incr-search-C05WjbZh.js → incr-search-D91M4Ozq.js} +5 -4
- package/dist/incr-search-D91M4Ozq.js.map +1 -0
- package/dist/incr-search.d.ts +1 -1
- package/dist/incr-search.js +1 -1
- package/dist/{index-DPFrRhKL.d.ts → index-BXafRK-_.d.ts} +2 -1
- package/dist/index-BXafRK-_.d.ts.map +1 -0
- package/dist/index-C59-JEPl.d.ts.map +1 -1
- package/dist/index-garxxqgV.d.ts +38 -0
- package/dist/index-garxxqgV.d.ts.map +1 -0
- package/dist/index.d.ts +158 -8
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1053 -18
- package/dist/index.js.map +1 -1
- package/dist/{menu-C8a-84S5.js → menu-B2Qv3Oiz.js} +6 -5
- package/dist/menu-B2Qv3Oiz.js.map +1 -0
- package/dist/{menu-item-DzizkMH-.js → menu-item-Woc8jJc1.js} +4 -4
- package/dist/menu-item-Woc8jJc1.js.map +1 -0
- package/dist/menu.js +2 -2
- package/dist/miller.d.ts +1 -1
- package/dist/miller.js +1 -1
- package/dist/narrowed-text.js +1 -1
- package/dist/{scroll-fade-CAs1EabA.js → scroll-fade-BrNUIYnm.js} +16 -3
- package/dist/scroll-fade-BrNUIYnm.js.map +1 -0
- package/dist/select-horiz.js +1 -1
- package/dist/{split-layout-3yBOEVZW.js → split-layout-BJEU1W0d.js} +2 -2
- package/dist/{split-layout-3yBOEVZW.js.map → split-layout-BJEU1W0d.js.map} +1 -1
- package/dist/split-layout.js +1 -1
- package/dist/tabs.js +1 -1
- package/dist/{timeline-CFlBFFGZ.js → timeline-BP1Ux2EV.js} +2 -2
- package/dist/{timeline-CFlBFFGZ.js.map → timeline-BP1Ux2EV.js.map} +1 -1
- package/dist/timeline.js +1 -1
- package/dist/titlebar.js +1 -1
- package/dist/{tree-BuzWn18_.js → tree-Bm2TzTfe.js} +233 -14
- package/dist/tree-Bm2TzTfe.js.map +1 -0
- package/dist/tree.d.ts +13 -1
- package/dist/tree.d.ts.map +1 -1
- package/dist/tree.js +1 -1
- package/dist/{vertical-list-BLvJ4-Zf.d.ts → vertical-list-DdaYcvHQ.d.ts} +2 -2
- package/dist/{vertical-list-BLvJ4-Zf.d.ts.map → vertical-list-DdaYcvHQ.d.ts.map} +1 -1
- package/dist/vertical-list.d.ts +1 -1
- package/dist/vertical-list.js +1 -1
- package/docs-user/README.md +1 -0
- package/docs-user/grid-list.md +15 -0
- package/docs-user/icons.md +24 -10
- package/docs-user/index.json +8 -3
- package/docs-user/llms.txt +2 -1
- package/docs-user/multicol-list.md +128 -0
- package/docs-user/tree.md +12 -0
- package/docs-user/vertical-list.md +65 -9
- package/llms.txt +2 -1
- package/package.json +1 -1
- package/dist/data-grid-BT1d_nlu.d.ts.map +0 -1
- package/dist/defaults-BJwDsMH4.js +0 -86
- package/dist/defaults-BJwDsMH4.js.map +0 -1
- package/dist/grid-list-DLfw5HI4.js.map +0 -1
- package/dist/handle-BPOxBOKf.js +0 -219
- package/dist/handle-BPOxBOKf.js.map +0 -1
- package/dist/icon-BCJJYEpm.js.map +0 -1
- package/dist/incr-search-C05WjbZh.js.map +0 -1
- package/dist/index-DPFrRhKL.d.ts.map +0 -1
- package/dist/index-DsjpDksO.d.ts +0 -47
- package/dist/index-DsjpDksO.d.ts.map +0 -1
- package/dist/menu-C8a-84S5.js.map +0 -1
- package/dist/menu-item-DzizkMH-.js.map +0 -1
- package/dist/scroll-fade-CAs1EabA.js.map +0 -1
- package/dist/tree-BuzWn18_.js.map +0 -1
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
import { s as registerIcon } from "./registry-BEtb8_wB.js";
|
|
2
|
+
//#region src/icons/defaults.ts
|
|
3
|
+
/** Chevron pointing down (Lucide `chevron-down`). Used for split-button dropdown toggle. */
|
|
4
|
+
const ICON_CHEVRON_DOWN = `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m6 9 6 6 6-6"/></svg>`;
|
|
5
|
+
/**
|
|
6
|
+
* Chevron pointing right (Lucide `chevron-right`). Used for tree-basic expand
|
|
7
|
+
* indicator as a CSS mask — shape only, color comes from background-color.
|
|
8
|
+
*/
|
|
9
|
+
const ICON_CARET_RIGHT = `<svg viewBox="0 0 24 24" fill="none" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg"><path d="m9 18 6-6-6-6"/></svg>`;
|
|
10
|
+
/** Checkmark (Lucide `check`). Useful for menu-check-item or confirmation states. */
|
|
11
|
+
const ICON_CHECK = `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M20 6 9 17l-5-5"/></svg>`;
|
|
12
|
+
/** Close / X icon (Lucide `x`). Useful for dialogs, notifications, dismissible elements. */
|
|
13
|
+
const ICON_CLOSE = `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg>`;
|
|
14
|
+
/** Plus / add icon (Lucide `plus`). Pairs with `close` for add/remove actions. */
|
|
15
|
+
const ICON_ADD = `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M5 12h14"/><path d="M12 5v14"/></svg>`;
|
|
16
|
+
/** Error icon (Lucide `circle-alert`). Useful for error notifications. */
|
|
17
|
+
const ICON_ERROR = `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="12" cy="12" r="10"/><line x1="12" x2="12" y1="8" y2="12"/><line x1="12" x2="12.01" y1="16" y2="16"/></svg>`;
|
|
18
|
+
/** Info icon (Lucide `info`). Useful for info notifications. */
|
|
19
|
+
const ICON_INFO = `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="12" cy="12" r="10"/><path d="M12 16v-4"/><path d="M12 8h.01"/></svg>`;
|
|
20
|
+
/** Warning icon (Lucide `triangle-alert`). Useful for warning notifications. */
|
|
21
|
+
const ICON_WARNING = `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m21.73 18-8-14a2 2 0 0 0-3.46 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3Z"/><path d="M12 9v4"/><path d="M12 17h.01"/></svg>`;
|
|
22
|
+
/** Chevron pointing right (Lucide `chevron-right`). Used for split-button switcher toggle. */
|
|
23
|
+
const ICON_CHEVRON_RIGHT = `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m9 18 6-6-6-6"/></svg>`;
|
|
24
|
+
/** Folder with up arrow (Lucide `folder-up`). Angled line style for navigating up one level. */
|
|
25
|
+
const ICON_FOLDER_UP = `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M2 9V5c0-1.1.9-2 2-2h3.93a2 2 0 0 1 1.66.9l.82 1.2a2 2 0 0 0 1.66.9H20a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2v-1"/><path d="M12 10v6"/><path d="m9 13 3-3 3 3"/></svg>`;
|
|
26
|
+
/** Folder (Lucide `folder`). Useful for file explorers and sidebars. */
|
|
27
|
+
const ICON_FOLDER = `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M20 20a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.9a2 2 0 0 1-1.69-.9L9.6 3.9A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2Z"/></svg>`;
|
|
28
|
+
/** Document / file page (Lucide `file`). Useful for file lists and document tabs. */
|
|
29
|
+
const ICON_FILE = `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z"/><path d="M14 2v4a2 2 0 0 0 2 2h4"/></svg>`;
|
|
30
|
+
/** Magnifying glass (Lucide `search`). Useful for search panels and inputs. */
|
|
31
|
+
const ICON_SEARCH = `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="11" cy="11" r="8"/><path d="m21 21-4.3-4.3"/></svg>`;
|
|
32
|
+
/** Chevron pointing up (Lucide `chevron-up`). Sort/collapse direction indicators. */
|
|
33
|
+
const ICON_CHEVRON_UP = `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m18 15-6-6-6 6"/></svg>`;
|
|
34
|
+
/** Chevron pointing left (Lucide `chevron-left`). Previous/back affordances. */
|
|
35
|
+
const ICON_CHEVRON_LEFT = `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m15 18-6-6 6-6"/></svg>`;
|
|
36
|
+
/** Vertical ellipsis (Lucide `ellipsis-vertical`). Default glyph for an unlabelled menu trigger. */
|
|
37
|
+
const ICON_ELLIPSIS_VERTICAL = `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="12" cy="12" r="1"/><circle cx="12" cy="5" r="1"/><circle cx="12" cy="19" r="1"/></svg>`;
|
|
38
|
+
function registerDefaults() {
|
|
39
|
+
registerIcon(`chevron-down`, ICON_CHEVRON_DOWN);
|
|
40
|
+
registerIcon(`chevron-right`, ICON_CHEVRON_RIGHT);
|
|
41
|
+
registerIcon(`caret-right`, ICON_CARET_RIGHT);
|
|
42
|
+
registerIcon(`check`, ICON_CHECK);
|
|
43
|
+
registerIcon(`close`, ICON_CLOSE);
|
|
44
|
+
registerIcon(`file`, ICON_FILE);
|
|
45
|
+
registerIcon(`folder`, ICON_FOLDER);
|
|
46
|
+
registerIcon(`search`, ICON_SEARCH);
|
|
47
|
+
registerIcon(`add`, ICON_ADD);
|
|
48
|
+
registerIcon(`error`, ICON_ERROR);
|
|
49
|
+
registerIcon(`folder-up`, ICON_FOLDER_UP);
|
|
50
|
+
registerIcon(`info`, ICON_INFO);
|
|
51
|
+
registerIcon(`warning`, ICON_WARNING);
|
|
52
|
+
registerIcon(`chevron-up`, ICON_CHEVRON_UP);
|
|
53
|
+
registerIcon(`chevron-left`, ICON_CHEVRON_LEFT);
|
|
54
|
+
registerIcon(`ellipsis-vertical`, ICON_ELLIPSIS_VERTICAL);
|
|
55
|
+
}
|
|
56
|
+
//#endregion
|
|
57
|
+
export { registerDefaults as a, ICON_CLOSE as i, ICON_CHECK as n, ICON_CHEVRON_DOWN as r, ICON_CARET_RIGHT as t };
|
|
58
|
+
|
|
59
|
+
//# sourceMappingURL=defaults-kVl1t2tT.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"defaults-kVl1t2tT.js","names":[],"sources":["../src/icons/defaults.ts"],"sourcesContent":["import { registerIcon } from './registry.js';\n\n// All shapes below are Lucide icons (https://lucide.dev/icons/) — stroke-based,\n// viewBox 0 0 24 24, stroke-width 2, round linecap/linejoin, fill=\"none\" so\n// color comes entirely from `currentColor`.\n\n/** Chevron pointing down (Lucide `chevron-down`). Used for split-button dropdown toggle. */\nexport const ICON_CHEVRON_DOWN = `<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><path d=\"m6 9 6 6 6-6\"/></svg>`;\n\n/**\n * Chevron pointing right (Lucide `chevron-right`). Used for tree-basic expand\n * indicator as a CSS mask — shape only, color comes from background-color.\n */\nexport const ICON_CARET_RIGHT = `<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"black\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"m9 18 6-6-6-6\"/></svg>`;\n\n/** Checkmark (Lucide `check`). Useful for menu-check-item or confirmation states. */\nexport const ICON_CHECK = `<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><path d=\"M20 6 9 17l-5-5\"/></svg>`;\n\n/** Close / X icon (Lucide `x`). Useful for dialogs, notifications, dismissible elements. */\nexport const ICON_CLOSE = `<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><path d=\"M18 6 6 18\"/><path d=\"m6 6 12 12\"/></svg>`;\n\n/** Plus / add icon (Lucide `plus`). Pairs with `close` for add/remove actions. */\nexport const ICON_ADD = `<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><path d=\"M5 12h14\"/><path d=\"M12 5v14\"/></svg>`;\n\n/** Error icon (Lucide `circle-alert`). Useful for error notifications. */\nexport const ICON_ERROR = `<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><circle cx=\"12\" cy=\"12\" r=\"10\"/><line x1=\"12\" x2=\"12\" y1=\"8\" y2=\"12\"/><line x1=\"12\" x2=\"12.01\" y1=\"16\" y2=\"16\"/></svg>`;\n\n/** Info icon (Lucide `info`). Useful for info notifications. */\nexport const ICON_INFO = `<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><circle cx=\"12\" cy=\"12\" r=\"10\"/><path d=\"M12 16v-4\"/><path d=\"M12 8h.01\"/></svg>`;\n\n/** Warning icon (Lucide `triangle-alert`). Useful for warning notifications. */\nexport const ICON_WARNING = `<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><path d=\"m21.73 18-8-14a2 2 0 0 0-3.46 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3Z\"/><path d=\"M12 9v4\"/><path d=\"M12 17h.01\"/></svg>`;\n\n/** Chevron pointing right (Lucide `chevron-right`). Used for split-button switcher toggle. */\nexport const ICON_CHEVRON_RIGHT = `<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><path d=\"m9 18 6-6-6-6\"/></svg>`;\n\n/** Folder with up arrow (Lucide `folder-up`). Angled line style for navigating up one level. */\nexport const ICON_FOLDER_UP = `<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><path d=\"M2 9V5c0-1.1.9-2 2-2h3.93a2 2 0 0 1 1.66.9l.82 1.2a2 2 0 0 0 1.66.9H20a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2v-1\"/><path d=\"M12 10v6\"/><path d=\"m9 13 3-3 3 3\"/></svg>`;\n\n/** Folder (Lucide `folder`). Useful for file explorers and sidebars. */\nexport const ICON_FOLDER = `<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><path d=\"M20 20a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.9a2 2 0 0 1-1.69-.9L9.6 3.9A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2Z\"/></svg>`;\n\n/** Document / file page (Lucide `file`). Useful for file lists and document tabs. */\nexport const ICON_FILE = `<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><path d=\"M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z\"/><path d=\"M14 2v4a2 2 0 0 0 2 2h4\"/></svg>`;\n\n/** Magnifying glass (Lucide `search`). Useful for search panels and inputs. */\nexport const ICON_SEARCH = `<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><circle cx=\"11\" cy=\"11\" r=\"8\"/><path d=\"m21 21-4.3-4.3\"/></svg>`;\n\n/** Chevron pointing up (Lucide `chevron-up`). Sort/collapse direction indicators. */\nexport const ICON_CHEVRON_UP = `<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><path d=\"m18 15-6-6-6 6\"/></svg>`;\n\n/** Chevron pointing left (Lucide `chevron-left`). Previous/back affordances. */\nexport const ICON_CHEVRON_LEFT = `<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><path d=\"m15 18-6-6 6-6\"/></svg>`;\n\n/** Vertical ellipsis (Lucide `ellipsis-vertical`). Default glyph for an unlabelled menu trigger. */\nexport const ICON_ELLIPSIS_VERTICAL = `<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><circle cx=\"12\" cy=\"12\" r=\"1\"/><circle cx=\"12\" cy=\"5\" r=\"1\"/><circle cx=\"12\" cy=\"19\" r=\"1\"/></svg>`;\n\nexport function registerDefaults(): void {\n registerIcon(`chevron-down`, ICON_CHEVRON_DOWN);\n registerIcon(`chevron-right`, ICON_CHEVRON_RIGHT);\n registerIcon(`caret-right`, ICON_CARET_RIGHT);\n registerIcon(`check`, ICON_CHECK);\n registerIcon(`close`, ICON_CLOSE);\n registerIcon(`file`, ICON_FILE);\n registerIcon(`folder`, ICON_FOLDER);\n registerIcon(`search`, ICON_SEARCH);\n registerIcon(`add`, ICON_ADD);\n registerIcon(`error`, ICON_ERROR);\n registerIcon(`folder-up`, ICON_FOLDER_UP);\n registerIcon(`info`, ICON_INFO);\n registerIcon(`warning`, ICON_WARNING);\n registerIcon(`chevron-up`, ICON_CHEVRON_UP);\n registerIcon(`chevron-left`, ICON_CHEVRON_LEFT);\n registerIcon(`ellipsis-vertical`, ICON_ELLIPSIS_VERTICAL);\n}\n"],"mappings":";;;AAOA,MAAa,oBAAoB;;;;;AAMjC,MAAa,mBAAmB;;AAGhC,MAAa,aAAa;;AAG1B,MAAa,aAAa;;AAG1B,MAAa,WAAW;;AAGxB,MAAa,aAAa;;AAG1B,MAAa,YAAY;;AAGzB,MAAa,eAAe;;AAG5B,MAAa,qBAAqB;;AAGlC,MAAa,iBAAiB;;AAG9B,MAAa,cAAc;;AAG3B,MAAa,YAAY;;AAGzB,MAAa,cAAc;;AAG3B,MAAa,kBAAkB;;AAG/B,MAAa,oBAAoB;;AAGjC,MAAa,yBAAyB;AAEtC,SAAgB,mBAAyB;CACvC,aAAa,gBAAgB,iBAAiB;CAC9C,aAAa,iBAAiB,kBAAkB;CAChD,aAAa,eAAe,gBAAgB;CAC5C,aAAa,SAAS,UAAU;CAChC,aAAa,SAAS,UAAU;CAChC,aAAa,QAAQ,SAAS;CAC9B,aAAa,UAAU,WAAW;CAClC,aAAa,UAAU,WAAW;CAClC,aAAa,OAAO,QAAQ;CAC5B,aAAa,SAAS,UAAU;CAChC,aAAa,aAAa,cAAc;CACxC,aAAa,QAAQ,SAAS;CAC9B,aAAa,WAAW,YAAY;CACpC,aAAa,cAAc,eAAe;CAC1C,aAAa,gBAAgB,iBAAiB;CAC9C,aAAa,qBAAqB,sBAAsB;AAC1D"}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import "./icon-DR_3rSyZ.js";
|
|
2
2
|
import { r as IDataProvider } from "./data-provider-BAn_-oR1.js";
|
|
3
3
|
import { F as ListDragPreviewSourceResolver, P as ListDragPreviewRenderer, R as ListNativeDragStartEvent } from "./tree-component-DGmKBbpy.js";
|
|
4
|
-
import { S as ListSearchController } from "./index-
|
|
4
|
+
import { S as ListSearchController } from "./index-BXafRK-_.js";
|
|
5
5
|
import { i as ListInteractionMode, l as ListSelectionMode, r as ListElementEventMap } from "./list-selection-types-B5ioL-dG.js";
|
|
6
|
-
import { n as CustomCheckboxOptions, t as AddItemOptions } from "./vertical-list-
|
|
6
|
+
import { n as CustomCheckboxOptions, t as AddItemOptions } from "./vertical-list-DdaYcvHQ.js";
|
|
7
7
|
import { LitElement, PropertyValues } from "lit";
|
|
8
8
|
import { CommandId, CommandRegistry } from "@clinth/ui-commands";
|
|
9
9
|
//#region src/detail-list/types.d.ts
|
|
@@ -200,4 +200,4 @@ interface DetailListElementEventMap extends ListElementEventMap {
|
|
|
200
200
|
}
|
|
201
201
|
//#endregion
|
|
202
202
|
export { DetailSortItem as a, DetailSortComparator as i, DetailListElementEventMap as n, DetailSortMode as o, DetailFormatter as r, DetailListElement as t };
|
|
203
|
-
//# sourceMappingURL=detail-list-
|
|
203
|
+
//# sourceMappingURL=detail-list-C3tozzBT.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"detail-list-
|
|
1
|
+
{"version":3,"file":"detail-list-C3tozzBT.d.ts","names":[],"sources":["../src/detail-list/types.ts","../src/detail-list/detail-list.ts"],"mappings":";;;;;;;;;;KACY;;KAGA;WACD,SAAS;WACT;WACA;;;KAIC,wBAAwB,GAAG,gBAAgB,GAAG;;KAG9C,mBAAmB,eAAe,2BAA2B;;;;;;;;;;;;;;;;;;;;cC8E5D,0BAA0B;;EAErC,eAAe;EAGf,iBAAiB;EAGjB,MAAM;EAGN;EAGA,gBAAgB;EAGhB;EAGA,UAAU;EAGV;EAGA,WAAW;EAGX;EAGA;EAGA,mBAAmB,IAAI;;;;;;EAQvB;;EAIA,oBAAoB,gCAAgC;;;;;;EAQpD;;;;;;EAQA;;;;;EAOA,qBAAqB,wBAAwB;EAG7C,mBAAmB,8BAA8B;UAGzC;mBAgBS;UAeT;UAmFA;;WAyEC,QAAM,qBAAA;;MAYX,YAAY;EAoBP;EA4DA;EAsBA;EASA,QAAQ,SAAS;;MA0CtB,gBAAgB;;MAKhB,iBAAiB,YAAY;;;;;;EASjC;EAIA,QAAQ,MAAM,kBAAkB,UAAU;;;;;EAuB1C,WAAW,MAAM,UAAU;;EAW3B,YAAY,OAAO,SAAS,WAAW;EAIvC;;;;;EAYA,SAAS,gBAAgB;;;;;EAgBzB,YAAY,MAAM;;;;;;;;;;EAalB;;;;;;EAsBA,SAAS,WAAW,WAAW,OAAO;EAItC,OAAO,MAAM;EAIb,WAAW,OAAO,SAAS;EAI3B,SAAS,MAAM;EAIf;EAIA;;MAQI,gBAAgB;;MAKhB;;EAMJ,WAAW,MAAM;;EAKjB,gBAAgB,MAAM;;EAKtB,mBAAmB,MAAM;;EAKzB,SAAS;EAgBP,eAAe,0CAA0C,UAAU;UAwa7D;;;;;;;;;EAkBF,kBAAkB;UAwBhB;UAMA;UAgCA;UAiBA;;;;;;;UA2DA;;UAoBA;UAcA;UAYA;UAQA;UAWA;UAMA;UAIA;UA4EA;UAWA;UAMA;UAKA;SAUQ,sBAAM;EAiJb,wBAAM;;QAsBT;YACI;IACR,oBAAoB;;YAGZ,4BAA4B;;UAGvB,kCAAkC;EACjD,0BAA0B,yBAAyB"}
|
package/dist/detail-list.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import { I as ListDragSource, L as ListNativeDragStartDetail, M as ListDragPreview, N as ListDragPreviewContext, P as ListDragPreviewRenderer, R as ListNativeDragStartEvent, j as ListDragEntry } from "./tree-component-DGmKBbpy.js";
|
|
2
|
-
import { n as CustomCheckboxOptions, t as AddItemOptions } from "./vertical-list-
|
|
3
|
-
import { a as DetailSortItem, i as DetailSortComparator, n as DetailListElementEventMap, o as DetailSortMode, r as DetailFormatter, t as DetailListElement } from "./detail-list-
|
|
2
|
+
import { n as CustomCheckboxOptions, t as AddItemOptions } from "./vertical-list-DdaYcvHQ.js";
|
|
3
|
+
import { a as DetailSortItem, i as DetailSortComparator, n as DetailListElementEventMap, o as DetailSortMode, r as DetailFormatter, t as DetailListElement } from "./detail-list-C3tozzBT.js";
|
|
4
4
|
export { type AddItemOptions, type CustomCheckboxOptions, type DetailFormatter, DetailListElement, DetailListElementEventMap, type DetailSortComparator, type DetailSortItem, type DetailSortMode, type ListDragEntry, type ListDragPreview, type ListDragPreviewContext, type ListDragPreviewRenderer, type ListDragSource, type ListNativeDragStartDetail, type ListNativeDragStartEvent };
|
package/dist/detail-list.js
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import { t as TickledController } from "./tickled-controller-Dh1Uh_vG.js";
|
|
2
2
|
import { t as themeFallbacks } from "./fallbacks-DQ_5OsmR.js";
|
|
3
3
|
import { n as safeCustomElement, t as __decorate } from "./decorate-VRK8rslU.js";
|
|
4
|
-
import "./icon-
|
|
4
|
+
import "./icon-1gpwtPx8.js";
|
|
5
5
|
import { t as DataController } from "./data-controller-DOlmqNKb.js";
|
|
6
|
-
import { c as createElementListSearchAdapter, i as ListSearchController, n as listSearchStyles, o as registerListSearchCommands, r as LIST_SEARCH_MODES, u as keyForElement } from "./incr-search-
|
|
6
|
+
import { c as createElementListSearchAdapter, i as ListSearchController, n as listSearchStyles, o as registerListSearchCommands, r as LIST_SEARCH_MODES, u as keyForElement } from "./incr-search-D91M4Ozq.js";
|
|
7
7
|
import { t as ListNativeDragController } from "./list-native-drag-controller-B9xO0XWn.js";
|
|
8
8
|
import { r as ListDragSelectController, t as ListSelectionController } from "./list-selection-controller-SA4piSBi.js";
|
|
9
9
|
import { n as animateListItemIn, r as animateListItemOut } from "./list-item-animation-BUoEKi5s.js";
|
|
10
|
-
import { t as scrollFadeStyles } from "./scroll-fade-
|
|
10
|
+
import { t as scrollFadeStyles } from "./scroll-fade-BrNUIYnm.js";
|
|
11
11
|
import { LitElement, css, html, nothing, render } from "lit";
|
|
12
12
|
import { property, query } from "lit/decorators.js";
|
|
13
13
|
import { createCommandRegistry } from "@clinth/ui-commands";
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { F as ListDragPreviewSourceResolver, P as ListDragPreviewRenderer, R as ListNativeDragStartEvent } from "./tree-component-DGmKBbpy.js";
|
|
2
|
-
import { S as ListSearchController } from "./index-
|
|
2
|
+
import { S as ListSearchController } from "./index-BXafRK-_.js";
|
|
3
3
|
import "./pan-text-CoYmt2qd.js";
|
|
4
4
|
import { i as ListInteractionMode, l as ListSelectionMode } from "./list-selection-types-B5ioL-dG.js";
|
|
5
5
|
import "./list-native-drag-controller-BAuWAtyQ.js";
|
|
@@ -378,6 +378,19 @@ declare class GridListElement<T = unknown> extends LitElement {
|
|
|
378
378
|
* navigation, selection, and `focusKey()` are unaffected.
|
|
379
379
|
*/
|
|
380
380
|
disableHoverTickle: boolean;
|
|
381
|
+
/**
|
|
382
|
+
* Ignore hover-target changes caused by scrolling. With virtualisation, a
|
|
383
|
+
* wheel / trackpad gesture replaces the cell beneath a stationary pointer,
|
|
384
|
+
* and the freshly rendered cell's `pointerenter` would move the cursor and
|
|
385
|
+
* emit `list-tickle` even though the pointer never moved. With this set,
|
|
386
|
+
* `pointerenter`-driven tickling is suppressed while a scroll gesture is
|
|
387
|
+
* active — the host also carries a `data-scroll-hover-suppress` attribute
|
|
388
|
+
* that gates the CSS `:hover` highlight, so the visual cursor holds still
|
|
389
|
+
* too. Hover resumes on the next real pointer movement, or after the pointer
|
|
390
|
+
* leaves and re-enters the list. Click selection, keyboard navigation, and
|
|
391
|
+
* `focusKey()` are unaffected.
|
|
392
|
+
*/
|
|
393
|
+
disableScrollHoverTickle: boolean;
|
|
381
394
|
itemSize: number;
|
|
382
395
|
gap: number;
|
|
383
396
|
/**
|
|
@@ -606,4 +619,4 @@ interface GridListElement {
|
|
|
606
619
|
}
|
|
607
620
|
//#endregion
|
|
608
621
|
export { DragSelectRect as A, TreeKeyboardNavControllerConfig as C, ListSelectionGesture as D, ListSelectionControllerConfig as E, ListDragSelectControllerConfig as M, ListSelectionModes as O, TreeKeyboardNavController as S, ListSelectionController as T, GridListTickleDetail as _, GridListCaptionBackdrop as a, GridListViewportChangeEvent as b, GridListDataAdapter as c, GridListItemClickDetail as d, GridListItemClickEvent as f, GridListSelectEvent as g, GridListSelectDetail as h, GridListCaptionAlign as i, ListDragSelectController as j, isMultiMode as k, GridListElementEventMap as l, GridListOrientation as m, GridListActivateDetail as n, GridListCaptionPosition as o, GridListItemEventDetail as p, GridListActivateEvent as r, GridListCaptionStyle as s, GridListElement as t, GridListFullElementEventMap as u, GridListTickleEvent as v, TreeKeyboardNavItemId as w, TreeKeyboardNavCallbacks as x, GridListViewportChangeDetail as y };
|
|
609
|
-
//# sourceMappingURL=grid-list-
|
|
622
|
+
//# sourceMappingURL=grid-list-CM1XhTaW.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"grid-list-
|
|
1
|
+
{"version":3,"file":"grid-list-CM1XhTaW.d.ts","names":[],"sources":["../src/interaction/list-drag-select-controller.ts","../src/interaction/list-selection-controller.ts","../src/interaction/tree-keyboard-controller.ts","../src/grid-list/types.ts","../src/grid-list/grid-list.ts"],"mappings":";;;;;;;;;;KAGY;WACD;WACA;WACA;WACA;;KAGC,+BAA+B;;EAEzC,kBAAkB;;EAElB;;EAEA;;EAEA;;EAEA,UAAU,MAAM,mBAAmB,SAAS;;;;;;EAM5C,wBAAwB,YAAY;;EAEpC,YAAY,SAAS,YAAY,IAAI,MAAM;;;;;;EAM3C,WAAW,UAAU,YAAY,IAAI;IAAQ;;;EAE7C,cAAc,YAAY;;;;;;EAM1B,eAAe,OAAO;;KAGnB,WAAW,yBAAyB;;;;;;;;;;;;;;cAsB5B,yBAAyB,cAAc;;EAuBtC,YAAA,MAAM,UAAU,QAAQ,+BAA+B;;MAO/D;;MAKA;EAIJ;EAOA;;EAUA;;;;;KCxHU;WACD;WACA;WACA;;KAGC;WACD,eAAe;WACf,iBAAiB;;;;;;;;KAShB,8BAA8B;;WAE/B,gCAAgC;;WAEhC,eAAe,MAAM;;WAErB,gBAAgB;;;;;;WAMhB,WAAW,UAAU,YAAY,IAAI,UAAU,YAAY;;;;;WAK3D,UAAU,MAAM;;;iBAIX,YAAY,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;cA4BrB,wBAAwB;;EAKvB,YAAA,QAAQ,8BAA8B;;MAK9C,YAAY,YAAY;;;;;;MASxB,gBAAgB;;MAehB,UAAU;;EAKd;;EAKA;;EAQA,QAAQ,MAAM;;EAUd,OAAO,MAAM;;EAoBb,QAAQ,MAAM;;EAoBd;;EAOA;;;;;EAcA,WAAW,OAAO,SAAS;;;;;;;;EAmB3B;;;;;;;;;EAYA,mBAAmB,OAAO,SAAS;;EAWnC,SAAS,MAAM;;;;;;;EA6Bf,WAAW,MAAM,kBAAkB,UAAU,gBAAgB;;;;;EAsB7D,QAAQ,MAAM,kBAAkB,UAAU,gBAAgB;;;;;EAqB1D,WAAW,MAAM,kBAAkB,UAAU,gBAAgB;;EAmB7D,YAAY,MAAM,GAAG,SAAS;;EAyC9B,YAAY,MAAM;;EAgBlB;;;;;;EASA,MAAM,KAAK,MAAM,MAAM;;;;;EAUvB;;;;;;EAUA,KAAK,OAAO,SAAS,IAAI,SAAS;;;;KCxZxB;KAEA;EACV,gBAAgB,cAAc,YAAY;EAC1C,WAAW,IAAI;EACf,aAAa,IAAI;EACjB,aAAa,IAAI;EACjB,YAAY,IAAI;EAChB;EACA,SAAS,IAAI;EACb,aAAa,IAAI;EACjB,eAAe,IAAI,0BAA0B;;KAGnC;EACV,WAAW;EACX;;cAGW,qCAAqC;;UACxC;UACA;UACA;UACA;EAEI,YAAA,MAAM,wBAAwB,SAAS,kBAAkB,wBAAwB,QAAQ;EAQrG;EAEA;EAEA,gBAAiB,OAAO;;;;;;;;KCnBd,oBAAoB;EAC9B,MAAM,MAAM,GAAG;EACf,SAAS,MAAM,GAAG;EAClB,SAAS,MAAM,GAAG;EAClB,YAAY,MAAM,GAAG;EACrB,kBAAkB,MAAM,GAAG;;;;;;;KAQjB,wBAAwB;WACzB;WACA;WACA,MAAM,IAAI;WACV,SAAS;;;;;;;;;;;;;KAcR;;KAGA;;KAGA;;;;;;;;KASA;;;;;;;;KASA;UAEK;WACN,UAAU,YAAY;WACtB,UAAU,YAAY;WACtB,cAAc;WACd,cAAc;;KAGb,sBAAsB,YAAY;;;;;;;UAQ7B;WACN;WACA;WACA;WACA,SAAS;;KAGR,wBAAwB,YAAY;UAE/B;WACN;WACA;WACA;WACA,SAAS;;KAGR,yBAAyB,YAAY;UAEhC;WACN;WACA;WACA;WACA,SAAS;;KAGR,sBAAsB,YAAY;UAE7B;EACf,eAAe;EACf,iBAAiB;EACjB,mBAAmB;EACnB,eAAe;;KAGL;WACD;WACA;;KAGC,8BAA8B,YAAY;UAgBrC,oCAAoC;EACnD,6BAA6B;EAC7B,0BAA0B;;;;cC0Cf,gBAAgB,qBAAqB;;SAChC,sBAAM;EAmVtB,eAAe;EAGf,iBAAiB;;;;;;EAQjB;;;;;;;;;;;;;EAeA;EAGA;EAGA;;;;;;;EASA,aAAa;;;;;;;;EAUb,cAAc;;EAId,cAAc;;EAId,iBAAiB;;EAIjB,iBAAiB;;;;;EAOjB;EAGA;;;;;;EAQA,mBAAmB,IAAI;;;;;EAOvB,uBAAuB,MAAM,GAAG;;;;;;;;;;;EAahC;;;;;;;;;;;;EAcA;;;;;;;EASA,qBAAqB,wBAAwB;;;;;;;;;;;;;;EAgB7C,mBAAmB,8BAA8B;EAGjD;;;;;;;;;;EAYA;;;;;EAOA,gBAAgB;;;;;EAOhB,aAAa,oBAAwB;UAEpB;UACA;UACA;UACA;WAsCR,WAAS;WAeT,SAAO;;;;;;EAuRhB,QAAS;;MAoDL,YAAY;EAqBP;EA+BA;YAiHU;YAqDA,WAAW,SAAS;YAqFpB,QAAQ,SAAS;;;;;;EA+GpC;;EAKA;MA0DI;;;;;;MASA;MAIA,iBAAiB,YAAY;;;;;;MAe7B,gBAAgB;EASpB,OAAO,MAAM;EAMb,WAAW,OAAO,SAAS;EAU3B,SAAS,MAAM;EAMf;EAIA;;;;;;EAWA,WAAW,MAAM;;EAKjB,gBAAgB,MAAM;;EAKtB,mBAAmB,MAAM;;;;;;EAoBzB,SAAS,gBAAgB;;;;;;EAUzB,YAAY,gBAAgB;;;;;;;EAW5B,WAAW,aAAa,MAAM;;;;;EAe9B,YAAY,MAAM;;;;;EAYlB;;EAUA,SAAS;;MASL;;EAKJ,QAAQ,cAAc;;EAKtB,eAAe,gBAAgB;;EAK/B,QAAQ,cAAc;EAItB,OAAO,MAAM;;;;;;EASb;;;;;EAQA;UAiEQ;UAsCA;YAkBW,UAAU,kBAAkB;UA6XvC;;QAgGF;YACI;IACR,kBAAkB;;;UAIL;EACf,iBAAiB,gBAAgB,6BAC/B,MAAM,GACN,WAAW,MAAM,iBAAiB,IAAI,4BAA4B,aAClE,oBAAoB;EAEtB,iBACE,cACA,UAAU,oCACV,oBAAoB"}
|
|
@@ -2,12 +2,12 @@ import { t as TickledController } from "./tickled-controller-Dh1Uh_vG.js";
|
|
|
2
2
|
import { n as tickledStyles, t as tickledItemStyles } from "./tickled-styles-BrAHEj1q.js";
|
|
3
3
|
import { t as themeFallbacks } from "./fallbacks-DQ_5OsmR.js";
|
|
4
4
|
import { n as safeCustomElement, t as __decorate } from "./decorate-VRK8rslU.js";
|
|
5
|
-
import { c as createElementListSearchAdapter, d as createDataListSearchAdapter, i as ListSearchController, n as listSearchStyles, o as registerListSearchCommands, r as LIST_SEARCH_MODES, u as keyForElement } from "./incr-search-
|
|
5
|
+
import { c as createElementListSearchAdapter, d as createDataListSearchAdapter, i as ListSearchController, n as listSearchStyles, o as registerListSearchCommands, r as LIST_SEARCH_MODES, u as keyForElement } from "./incr-search-D91M4Ozq.js";
|
|
6
6
|
import { t as ListNativeDragController } from "./list-native-drag-controller-B9xO0XWn.js";
|
|
7
7
|
import { r as ListDragSelectController, t as ListSelectionController } from "./list-selection-controller-SA4piSBi.js";
|
|
8
8
|
import { i as listItemFadeKeyframes } from "./list-item-animation-BUoEKi5s.js";
|
|
9
9
|
import "./interaction-BskmlA9t.js";
|
|
10
|
-
import { t as scrollFadeStyles } from "./scroll-fade-
|
|
10
|
+
import { t as scrollFadeStyles } from "./scroll-fade-BrNUIYnm.js";
|
|
11
11
|
import "./pan-text-CqtvjPyK.js";
|
|
12
12
|
import { LitElement, css, html } from "lit";
|
|
13
13
|
import { property, state } from "lit/decorators.js";
|
|
@@ -322,6 +322,7 @@ let GridListElement = class GridListElement extends LitElement {
|
|
|
322
322
|
this.selectionMode = `single`;
|
|
323
323
|
this.interactionMode = `standard`;
|
|
324
324
|
this.disableHoverTickle = false;
|
|
325
|
+
this.disableScrollHoverTickle = false;
|
|
325
326
|
this.itemSize = 160;
|
|
326
327
|
this.gap = 8;
|
|
327
328
|
this.orientation = `grid`;
|
|
@@ -378,6 +379,9 @@ let GridListElement = class GridListElement extends LitElement {
|
|
|
378
379
|
itemWrap: this.#itemWrap,
|
|
379
380
|
hoverDisabled: () => this.disableHoverTickle || this.#dragSelect.isDragging || this.#nativeDrag.isDragging
|
|
380
381
|
});
|
|
382
|
+
this.#scrollHoverSuppress = false;
|
|
383
|
+
this.#lastPointerX = NaN;
|
|
384
|
+
this.#lastPointerY = NaN;
|
|
381
385
|
this.#marqueePreview = /* @__PURE__ */ new Set();
|
|
382
386
|
this.#nativeDragging = false;
|
|
383
387
|
this.#dragOriginKey = void 0;
|
|
@@ -460,6 +464,7 @@ let GridListElement = class GridListElement extends LitElement {
|
|
|
460
464
|
this.#selectedSnapshot = /* @__PURE__ */ new Set();
|
|
461
465
|
this.#onScroll = (e) => {
|
|
462
466
|
const el = e.target;
|
|
467
|
+
this.#markScrollHoverSuppress();
|
|
463
468
|
this.#cancelScrollRaf();
|
|
464
469
|
this.#scrollRaf = requestAnimationFrame(() => {
|
|
465
470
|
this.#scrollRaf = 0;
|
|
@@ -469,6 +474,30 @@ let GridListElement = class GridListElement extends LitElement {
|
|
|
469
474
|
});
|
|
470
475
|
this.#scheduleSnap();
|
|
471
476
|
};
|
|
477
|
+
this.#onWheel = (e) => {
|
|
478
|
+
if (this.orientation !== `row`) return;
|
|
479
|
+
if (e.ctrlKey || e.metaKey) return;
|
|
480
|
+
if (e.deltaY === 0) return;
|
|
481
|
+
const vp = this.#viewportRef.value ?? e.currentTarget;
|
|
482
|
+
if (!vp) return;
|
|
483
|
+
if (vp.scrollWidth <= vp.clientWidth + 1) return;
|
|
484
|
+
this.#markScrollHoverSuppress();
|
|
485
|
+
vp.scrollLeft += e.deltaX + e.deltaY;
|
|
486
|
+
e.preventDefault();
|
|
487
|
+
};
|
|
488
|
+
this.#onHostPointerMove = (e) => {
|
|
489
|
+
const moved = !Number.isNaN(this.#lastPointerX) && (e.clientX !== this.#lastPointerX || e.clientY !== this.#lastPointerY);
|
|
490
|
+
this.#lastPointerX = e.clientX;
|
|
491
|
+
this.#lastPointerY = e.clientY;
|
|
492
|
+
if (!moved || !this.#scrollHoverSuppress) return;
|
|
493
|
+
this.#endScrollHoverSuppress();
|
|
494
|
+
if (this.disableHoverTickle) return;
|
|
495
|
+
const key = this.shadowRoot?.elementFromPoint?.(e.clientX, e.clientY)?.closest(`.cell`)?.getAttribute(`data-key`);
|
|
496
|
+
if (key) this.tickled.handlePointerEnter(key);
|
|
497
|
+
};
|
|
498
|
+
this.#onHostPointerLeave = () => {
|
|
499
|
+
this.#endScrollHoverSuppress();
|
|
500
|
+
};
|
|
472
501
|
this._onKeyDown = (e) => {
|
|
473
502
|
if ((e.ctrlKey || e.metaKey) && e.key === `f`) return;
|
|
474
503
|
if ((e.ctrlKey || e.metaKey) && e.key === `a`) {
|
|
@@ -714,7 +743,10 @@ let GridListElement = class GridListElement extends LitElement {
|
|
|
714
743
|
transition: background var(--transition), border-color var(--transition);
|
|
715
744
|
}
|
|
716
745
|
:host(:not([caption-style="separate"])) .cell.tickled,
|
|
717
|
-
|
|
746
|
+
/* [data-scroll-hover-suppress] is set while a scroll gesture moves
|
|
747
|
+
cells beneath a stationary pointer (see disable-scroll-hover-tickle):
|
|
748
|
+
the :hover highlight is gated so the visual cursor holds still too. */
|
|
749
|
+
:host(:not([caption-style="separate"]):not([disable-hover-tickle]):not([data-scroll-hover-suppress])) .cell:hover {
|
|
718
750
|
background: var(--item-bg-tickled);
|
|
719
751
|
border: var(--item-border-tickled);
|
|
720
752
|
}
|
|
@@ -790,7 +822,7 @@ let GridListElement = class GridListElement extends LitElement {
|
|
|
790
822
|
border: 1px solid transparent;
|
|
791
823
|
}
|
|
792
824
|
:host([caption-style="separate"]) .cell.tickled .thumb,
|
|
793
|
-
:host([caption-style="separate"]:not([disable-hover-tickle])) .cell:hover .thumb {
|
|
825
|
+
:host([caption-style="separate"]:not([disable-hover-tickle]):not([data-scroll-hover-suppress])) .cell:hover .thumb {
|
|
794
826
|
background: var(--grid-list-thumb-bg-tickled, var(--item-bg-tickled));
|
|
795
827
|
border: var(--item-border-tickled);
|
|
796
828
|
}
|
|
@@ -911,6 +943,16 @@ let GridListElement = class GridListElement extends LitElement {
|
|
|
911
943
|
*/
|
|
912
944
|
#sourceElement;
|
|
913
945
|
#source;
|
|
946
|
+
/**
|
|
947
|
+
* True while cell `pointerenter` tickling is suppressed by an active or
|
|
948
|
+
* just-finished scroll gesture (`disable-scroll-hover-tickle`). While set,
|
|
949
|
+
* the host carries `[data-scroll-hover-suppress]`, which gates the CSS
|
|
950
|
+
* `:hover` highlight so the visual cursor does not churn either.
|
|
951
|
+
*/
|
|
952
|
+
#scrollHoverSuppress;
|
|
953
|
+
/** Last pointer position seen over the host; real movement ends suppression. */
|
|
954
|
+
#lastPointerX;
|
|
955
|
+
#lastPointerY;
|
|
914
956
|
/** Live drag-select preview: covered keys + the surface-relative rect. */
|
|
915
957
|
#marqueePreview;
|
|
916
958
|
#marqueeRect;
|
|
@@ -1080,6 +1122,8 @@ let GridListElement = class GridListElement extends LitElement {
|
|
|
1080
1122
|
[`caption-backdrop`, this.captionBackdrop]
|
|
1081
1123
|
]) if (!this.hasAttribute(attr)) this.setAttribute(attr, value);
|
|
1082
1124
|
this.addEventListener(`keydown`, this._onKeyDown);
|
|
1125
|
+
this.addEventListener(`pointermove`, this.#onHostPointerMove, { passive: true });
|
|
1126
|
+
this.addEventListener(`pointerleave`, this.#onHostPointerLeave);
|
|
1083
1127
|
this.#mutationObserver ??= new MutationObserver((records) => this.#onChildrenChanged(records));
|
|
1084
1128
|
this.#mutationObserver.observe(this, {
|
|
1085
1129
|
childList: true,
|
|
@@ -1093,6 +1137,9 @@ let GridListElement = class GridListElement extends LitElement {
|
|
|
1093
1137
|
super.disconnectedCallback();
|
|
1094
1138
|
this.#stopActiveCaptionPan();
|
|
1095
1139
|
this.removeEventListener(`keydown`, this._onKeyDown);
|
|
1140
|
+
this.removeEventListener(`pointermove`, this.#onHostPointerMove);
|
|
1141
|
+
this.removeEventListener(`pointerleave`, this.#onHostPointerLeave);
|
|
1142
|
+
this.#endScrollHoverSuppress();
|
|
1096
1143
|
this.#resizeObserver?.disconnect();
|
|
1097
1144
|
this.#resizeObserver = void 0;
|
|
1098
1145
|
this.#mutationObserver?.disconnect();
|
|
@@ -1276,6 +1323,7 @@ let GridListElement = class GridListElement extends LitElement {
|
|
|
1276
1323
|
this.selection.clearAnchor();
|
|
1277
1324
|
this.#syncAriaMultiselectable();
|
|
1278
1325
|
}
|
|
1326
|
+
if (changed.has(`disableScrollHoverTickle`) && !this.disableScrollHoverTickle) this.#endScrollHoverSuppress();
|
|
1279
1327
|
if (changed.has(`itemsDraggable`)) this.#nativeDrag.refreshDraggable();
|
|
1280
1328
|
if (changed.has(`orientation`)) {
|
|
1281
1329
|
const vp = this.#viewportRef.value;
|
|
@@ -1651,6 +1699,7 @@ let GridListElement = class GridListElement extends LitElement {
|
|
|
1651
1699
|
${ref(this.#viewportRef)}
|
|
1652
1700
|
data-input-mode=${this.tickled.inputMode}
|
|
1653
1701
|
@scroll=${this.#onScroll}
|
|
1702
|
+
@wheel=${this.#onWheel}
|
|
1654
1703
|
>
|
|
1655
1704
|
<div class="spacer" style=${spacerStyle}>
|
|
1656
1705
|
${this.#source instanceof DataGridListSource ? this.#renderDataCells(win) : this.#renderElementCells(win)}
|
|
@@ -1694,7 +1743,7 @@ let GridListElement = class GridListElement extends LitElement {
|
|
|
1694
1743
|
?data-marquee=${marquee}
|
|
1695
1744
|
@click=${(e) => this.#onCellClick(e, key)}
|
|
1696
1745
|
@dblclick=${() => this.#onCellActivate(key)}
|
|
1697
|
-
@pointerenter=${() => this
|
|
1746
|
+
@pointerenter=${() => this.#handleCellPointerEnter(key)}
|
|
1698
1747
|
>
|
|
1699
1748
|
<div class="content" part="content">${this.#source.renderCellContent(index)}</div>
|
|
1700
1749
|
${showCaption ? this.#renderCaption(caption, captionCss, tickled) : ``}
|
|
@@ -1778,7 +1827,7 @@ let GridListElement = class GridListElement extends LitElement {
|
|
|
1778
1827
|
?data-marquee=${marquee}
|
|
1779
1828
|
@click=${(e) => this.#onCellClick(e, key)}
|
|
1780
1829
|
@dblclick=${() => this.#onCellActivate(key)}
|
|
1781
|
-
@pointerenter=${() => this
|
|
1830
|
+
@pointerenter=${() => this.#handleCellPointerEnter(key)}
|
|
1782
1831
|
>
|
|
1783
1832
|
<div class="thumb" part="thumb" style=${thumbStyle}>
|
|
1784
1833
|
${this.#source.renderCellContent(index)}
|
|
@@ -1788,6 +1837,48 @@ let GridListElement = class GridListElement extends LitElement {
|
|
|
1788
1837
|
`;
|
|
1789
1838
|
}
|
|
1790
1839
|
#onScroll;
|
|
1840
|
+
/**
|
|
1841
|
+
* Translate vertical wheel deltas into horizontal scroll when the list runs
|
|
1842
|
+
* in `row` orientation. Without this the default browser behaviour needs
|
|
1843
|
+
* Shift+wheel or a physical horizontal wheel — neither of which most users
|
|
1844
|
+
* reach for on a single-row strip.
|
|
1845
|
+
*
|
|
1846
|
+
* Only kicks in for a plain vertical wheel over a viewport that can actually
|
|
1847
|
+
* scroll horizontally; native horizontal deltas (trackpad, Shift+wheel) are
|
|
1848
|
+
* left to the browser when there is no vertical component.
|
|
1849
|
+
*/
|
|
1850
|
+
#onWheel;
|
|
1851
|
+
/**
|
|
1852
|
+
* Cell `pointerenter` funnel. While a scroll gesture moves cells beneath a
|
|
1853
|
+
* stationary pointer (`disable-scroll-hover-tickle`), the freshly
|
|
1854
|
+
* virtualised cell's enter event is ignored so the cursor holds still.
|
|
1855
|
+
*/
|
|
1856
|
+
#handleCellPointerEnter(key) {
|
|
1857
|
+
if (this.#scrollHoverSuppress) return;
|
|
1858
|
+
this.tickled.handlePointerEnter(key);
|
|
1859
|
+
}
|
|
1860
|
+
/** Open the scroll-hover suppression window (no-op unless opted in and not already open). */
|
|
1861
|
+
#markScrollHoverSuppress() {
|
|
1862
|
+
if (!this.disableScrollHoverTickle || this.#scrollHoverSuppress) return;
|
|
1863
|
+
this.#scrollHoverSuppress = true;
|
|
1864
|
+
this.toggleAttribute(`data-scroll-hover-suppress`, true);
|
|
1865
|
+
}
|
|
1866
|
+
#endScrollHoverSuppress() {
|
|
1867
|
+
if (!this.#scrollHoverSuppress) return;
|
|
1868
|
+
this.#scrollHoverSuppress = false;
|
|
1869
|
+
this.toggleAttribute(`data-scroll-hover-suppress`, false);
|
|
1870
|
+
}
|
|
1871
|
+
/**
|
|
1872
|
+
* A real pointer movement ends scroll-hover suppression. The first
|
|
1873
|
+
* `pointerenter` on a real move is swallowed by design (it can be
|
|
1874
|
+
* indistinguishable from a virtualisation enter), so the cell already under
|
|
1875
|
+
* the pointer is re-tickled here — otherwise the cursor would lag one cell
|
|
1876
|
+
* boundary behind the pointer. The very first tracked `pointermove` only
|
|
1877
|
+
* establishes the baseline; it cannot know the pointer moved.
|
|
1878
|
+
*/
|
|
1879
|
+
#onHostPointerMove;
|
|
1880
|
+
/** The pointer leaving the list ends suppression, so re-entry hovers normally. */
|
|
1881
|
+
#onHostPointerLeave;
|
|
1791
1882
|
#cancelScrollRaf() {
|
|
1792
1883
|
if (this.#scrollRaf !== 0) {
|
|
1793
1884
|
cancelAnimationFrame(this.#scrollRaf);
|
|
@@ -1871,6 +1962,11 @@ __decorate([property({
|
|
|
1871
1962
|
attribute: `disable-hover-tickle`,
|
|
1872
1963
|
reflect: true
|
|
1873
1964
|
})], GridListElement.prototype, "disableHoverTickle", void 0);
|
|
1965
|
+
__decorate([property({
|
|
1966
|
+
type: Boolean,
|
|
1967
|
+
attribute: `disable-scroll-hover-tickle`,
|
|
1968
|
+
reflect: true
|
|
1969
|
+
})], GridListElement.prototype, "disableScrollHoverTickle", void 0);
|
|
1874
1970
|
__decorate([property({
|
|
1875
1971
|
type: Number,
|
|
1876
1972
|
attribute: `item-size`
|
|
@@ -1942,4 +2038,4 @@ GridListElement = __decorate([safeCustomElement(`ixfx-grid-list`)], GridListElem
|
|
|
1942
2038
|
//#endregion
|
|
1943
2039
|
export { GridListElement as t };
|
|
1944
2040
|
|
|
1945
|
-
//# sourceMappingURL=grid-list-
|
|
2041
|
+
//# sourceMappingURL=grid-list-WE92nfX5.js.map
|