@evotecit/canopyx 0.3.13 → 0.3.16
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/CanopyX.Html/Assets/canopyx-calendar-edit.js +36 -18
- package/CanopyX.Html/Assets/canopyx-calendar-ics.js +7 -5
- package/CanopyX.Html/Assets/canopyx-calendar.css +124 -116
- package/CanopyX.Html/Assets/canopyx-calendar.js +74 -54
- package/CanopyX.Html/Assets/canopyx-cell-range.css +8 -8
- package/CanopyX.Html/Assets/canopyx-cell-range.js +1 -1
- package/CanopyX.Html/Assets/canopyx-changes.css +113 -113
- package/CanopyX.Html/Assets/canopyx-changes.js +7 -10
- package/CanopyX.Html/Assets/canopyx-column-groups.css +5 -5
- package/CanopyX.Html/Assets/canopyx-column-groups.js +1 -1
- package/CanopyX.Html/Assets/canopyx-data.js +2 -2
- package/CanopyX.Html/Assets/canopyx-detail-rows.css +9 -9
- package/CanopyX.Html/Assets/canopyx-detail-rows.js +2 -2
- package/CanopyX.Html/Assets/canopyx-editing.css +18 -18
- package/CanopyX.Html/Assets/canopyx-editing.js +1 -1
- package/CanopyX.Html/Assets/canopyx-enhance.js +2 -2
- package/CanopyX.Html/Assets/canopyx-facets.css +33 -33
- package/CanopyX.Html/Assets/canopyx-facets.js +5 -6
- package/CanopyX.Html/Assets/canopyx-filter-editor.css +57 -57
- package/CanopyX.Html/Assets/canopyx-filter-editor.js +7 -5
- package/CanopyX.Html/Assets/canopyx-flow-checks.css +13 -11
- package/CanopyX.Html/Assets/canopyx-flow-checks.js +5 -4
- package/CanopyX.Html/Assets/canopyx-flow-command.css +7 -7
- package/CanopyX.Html/Assets/canopyx-flow-command.js +1 -1
- package/CanopyX.Html/Assets/canopyx-flow-dialog.css +9 -7
- package/CanopyX.Html/Assets/canopyx-flow-dialog.js +1 -1
- package/CanopyX.Html/Assets/canopyx-flow-drafts.css +7 -7
- package/CanopyX.Html/Assets/canopyx-flow-drafts.js +1 -1
- package/CanopyX.Html/Assets/canopyx-flow-entry.css +17 -76
- package/CanopyX.Html/Assets/canopyx-flow-entry.js +11 -5
- package/CanopyX.Html/Assets/canopyx-flow-facts.js +2 -0
- package/CanopyX.Html/Assets/canopyx-flow-host.css +4 -4
- package/CanopyX.Html/Assets/canopyx-flow-host.js +1 -1
- package/CanopyX.Html/Assets/canopyx-flow-module.mjs +11 -5
- package/CanopyX.Html/Assets/canopyx-flow-pick.css +4 -4
- package/CanopyX.Html/Assets/canopyx-flow-pick.js +1 -1
- package/CanopyX.Html/Assets/canopyx-flow-preview.css +6 -6
- package/CanopyX.Html/Assets/canopyx-flow-preview.js +1 -1
- package/CanopyX.Html/Assets/canopyx-flow-records.css +3 -3
- package/CanopyX.Html/Assets/canopyx-flow-records.js +1 -1
- package/CanopyX.Html/Assets/canopyx-flow-tasks.css +17 -17
- package/CanopyX.Html/Assets/canopyx-flow-tasks.js +1 -1
- package/CanopyX.Html/Assets/canopyx-flow.css +79 -79
- package/CanopyX.Html/Assets/canopyx-flow.js +8 -7
- package/CanopyX.Html/Assets/canopyx-format-editor.css +23 -23
- package/CanopyX.Html/Assets/canopyx-format-editor.js +2 -3
- package/CanopyX.Html/Assets/canopyx-formatting.css +17 -17
- package/CanopyX.Html/Assets/canopyx-formatting.js +5 -5
- package/CanopyX.Html/Assets/canopyx-forms.css +5 -5
- package/CanopyX.Html/Assets/canopyx-forms.js +1 -1
- package/CanopyX.Html/Assets/canopyx-grid-module.mjs +97 -54
- package/CanopyX.Html/Assets/canopyx-grid-options.css +10 -0
- package/CanopyX.Html/Assets/canopyx-grid-options.js +47 -0
- package/CanopyX.Html/Assets/canopyx-grid.css +199 -261
- package/CanopyX.Html/Assets/canopyx-grid.js +97 -54
- package/CanopyX.Html/Assets/canopyx-grouping.css +17 -17
- package/CanopyX.Html/Assets/canopyx-grouping.js +12 -9
- package/CanopyX.Html/Assets/canopyx-highlight.css +14 -14
- package/CanopyX.Html/Assets/canopyx-highlight.js +2 -2
- package/CanopyX.Html/Assets/canopyx-interactive.css +94 -155
- package/CanopyX.Html/Assets/canopyx-interactive.js +33 -14
- package/CanopyX.Html/Assets/canopyx-labels-de.js +5 -0
- package/CanopyX.Html/Assets/canopyx-labels-es.js +5 -0
- package/CanopyX.Html/Assets/canopyx-labels-fr.js +5 -0
- package/CanopyX.Html/Assets/canopyx-labels-it.js +5 -0
- package/CanopyX.Html/Assets/canopyx-labels-pl.js +5 -0
- package/CanopyX.Html/Assets/canopyx-layouts.css +17 -17
- package/CanopyX.Html/Assets/canopyx-layouts.js +2 -10
- package/CanopyX.Html/Assets/canopyx-link.css +7 -7
- package/CanopyX.Html/Assets/canopyx-link.js +1 -1
- package/CanopyX.Html/Assets/canopyx-live.css +9 -9
- package/CanopyX.Html/Assets/canopyx-live.js +20 -15
- package/CanopyX.Html/Assets/canopyx-matrix.css +74 -74
- package/CanopyX.Html/Assets/canopyx-matrix.js +3 -4
- package/CanopyX.Html/Assets/canopyx-module.mjs +33 -14
- package/CanopyX.Html/Assets/canopyx-pager.css +2 -2
- package/CanopyX.Html/Assets/canopyx-pager.js +1 -1
- package/CanopyX.Html/Assets/canopyx-presenters.js +2 -2
- package/CanopyX.Html/Assets/canopyx-record-panel.css +57 -49
- package/CanopyX.Html/Assets/canopyx-record-panel.js +13 -8
- package/CanopyX.Html/Assets/canopyx-reporting-module.mjs +101 -57
- package/CanopyX.Html/Assets/canopyx-reporting.css +214 -276
- package/CanopyX.Html/Assets/canopyx-reporting.js +101 -57
- package/CanopyX.Html/Assets/canopyx-timeline.css +28 -28
- package/CanopyX.Html/Assets/canopyx-timeline.js +11 -10
- package/CanopyX.Html/Assets/canopyx-tree-tools.css +47 -47
- package/CanopyX.Html/Assets/canopyx-tree-tools.js +3 -3
- package/CanopyX.Html/Assets/canopyx.css +81 -142
- package/CanopyX.Html/Assets/canopyx.js +33 -14
- package/JavaScript/calendar.d.ts +15 -0
- package/JavaScript/flow.d.ts +6 -0
- package/JavaScript/grid.d.ts +29 -4
- package/JavaScript/live.d.ts +2 -0
- package/JavaScript/locales/de.mjs +5 -0
- package/JavaScript/locales/es.mjs +5 -0
- package/JavaScript/locales/fr.mjs +5 -0
- package/JavaScript/locales/it.mjs +5 -0
- package/JavaScript/locales/pl.mjs +5 -0
- package/JavaScript/plugins.d.ts +4 -0
- package/JavaScript/protocol.d.ts +1 -1
- package/JavaScript/records.d.ts +18 -4
- package/README.md +6 -2
- package/package.json +5 -1
|
@@ -1,34 +1,34 @@
|
|
|
1
1
|
/* Resource timeline: the resource tree at the start,the time header and lanes after it,sharing rows. */
|
|
2
2
|
.cx-tl{--cx-tl-side-w:var(--cx-tl-side,280px);display:grid;grid-template-columns:var(--cx-tl-side-w) minmax(0,1fr);height:100%;min-height:0;}
|
|
3
3
|
.cx-tl.cx-tl-solo{grid-template-columns:minmax(0,1fr);}
|
|
4
|
-
.cx-tl-side{display:flex;flex-direction:column;min-width:0;min-height:0;border-inline-end:var(--cx-size-1px) solid var(--
|
|
5
|
-
.cx-tl-side > .cx-tl-tree.cx-host{flex:1 1 auto;height:auto;min-height:0;border:0;border-radius:0
|
|
4
|
+
.cx-tl-side{display:flex;flex-direction:column;min-width:0;min-height:0;border-inline-end:var(--cx-size-1px) solid var(--hfx-color-border,light-dark(#e2e4e7,#272a30));}
|
|
5
|
+
.cx-tl-side > .cx-tl-tree.cx-host{flex:1 1 auto;height:auto;min-height:0;border:0;border-radius:0;}
|
|
6
6
|
.cx-tl-tree.cx-host > .cx-grid{overflow-y:hidden;overflow-x:scroll;border:0;border-radius:0;}
|
|
7
7
|
.cx-tl-tree .cx-head{display:flex;flex-direction:column;justify-content:flex-end;box-sizing:border-box;height:var(--cx-tl-head-h,57px);}
|
|
8
|
-
.cx-tl-tree .cx-tl-agg{justify-content:flex-end;font-variant-numeric:tabular-nums;color:var(--
|
|
8
|
+
.cx-tl-tree .cx-tl-agg{justify-content:flex-end;font-variant-numeric:tabular-nums;color:var(--hfx-color-text-secondary,light-dark(#4d525b,#b0b4bc));}
|
|
9
9
|
.cx-tl-main{position:relative;min-width:0;min-height:0;overflow:scroll;overscroll-behavior:contain;}
|
|
10
|
-
.cx-tl-head{position:sticky;top:0;z-index:7;height:var(--cx-tl-head-h,57px);background:var(--
|
|
10
|
+
.cx-tl-head{position:sticky;top:0;z-index:7;height:var(--cx-tl-head-h,57px);background:var(--hfx-color-surface-sunken,light-dark(#f7f8f9,#111317));border-bottom:var(--cx-size-1px) solid var(--hfx-color-border,light-dark(#e2e4e7,#272a30));}
|
|
11
11
|
.cx-tl-hrow{position:relative;height:var(--cx-size-28px);}
|
|
12
|
-
.cx-tl-upper{border-bottom:var(--cx-size-1px) solid var(--
|
|
13
|
-
.cx-tl-hcell{position:absolute;top:0;height:100%;display:flex;align-items:center;padding:0 var(--cx-size-6px);border-inline-start:var(--cx-size-1px) solid var(--
|
|
14
|
-
.cx-tl-hcell.cx-tl-hupper{overflow:visible;font-size:var(--cx-size-13px);font-weight:600;color:var(--
|
|
12
|
+
.cx-tl-upper{border-bottom:var(--cx-size-1px) solid var(--hfx-color-border,light-dark(#e2e4e7,#272a30));}
|
|
13
|
+
.cx-tl-hcell{position:absolute;top:0;height:100%;display:flex;align-items:center;padding:0 var(--cx-size-6px);border-inline-start:var(--cx-size-1px) solid var(--hfx-color-border,light-dark(#e2e4e7,#272a30));font-size:var(--cx-size-12px);color:var(--hfx-color-text-secondary,light-dark(#4d525b,#b0b4bc));white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-variant-numeric:tabular-nums;}
|
|
14
|
+
.cx-tl-hcell.cx-tl-hupper{overflow:visible;font-size:var(--cx-size-13px);font-weight:600;color:var(--hfx-color-text,light-dark(#16181c,#f2f3f5));}
|
|
15
15
|
.cx-tl-hupper > .cx-tl-hlabel{position:sticky;inset-inline-start:var(--cx-size-6px);max-width:100%;overflow:hidden;text-overflow:ellipsis;}
|
|
16
16
|
.cx-tl-hcell > .cx-tl-hlabel{min-width:0;overflow:hidden;text-overflow:ellipsis;}
|
|
17
|
-
.cx-tl-hcell.cx-tl-weekend{background:color-mix(in srgb,var(--
|
|
18
|
-
.cx-tl-range-labels{position:relative;height:var(--cx-size-20px);border-top:var(--cx-size-1px) solid var(--
|
|
17
|
+
.cx-tl-hcell.cx-tl-weekend{background:color-mix(in srgb,var(--hfx-color-text,light-dark(#16181c,#f2f3f5)) 5%,transparent);}
|
|
18
|
+
.cx-tl-range-labels{position:relative;height:var(--cx-size-20px);border-top:var(--cx-size-1px) solid var(--hfx-color-border,light-dark(#e2e4e7,#272a30));}
|
|
19
19
|
.cx-tl-head:not(.cx-tl-has-ranges) > .cx-tl-range-labels{display:none;}
|
|
20
|
-
.cx-tl-range-label{position:absolute;top:var(--cx-size-2px);height:var(--cx-size-16px);padding:0 var(--cx-size-6px);border-radius:var(--
|
|
20
|
+
.cx-tl-range-label{position:absolute;top:var(--cx-size-2px);height:var(--cx-size-16px);padding:0 var(--cx-size-6px);border-radius:var(--hfx-radius-sm,4px);background:color-mix(in srgb,var(--hfx-color-status-info-fg,light-dark(#2b5fc0,#74a2f7)) 14%,var(--hfx-color-surface,light-dark(#ffffff,#16181c)));font-size:var(--cx-size-11d5px);line-height:var(--cx-size-16px);color:var(--hfx-color-text-secondary,light-dark(#4d525b,#b0b4bc));white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
|
|
21
21
|
.cx-tl-canvas{position:relative;}
|
|
22
22
|
.cx-tl-layer{position:absolute;inset-inline-start:0;top:0;width:100%;pointer-events:none;}
|
|
23
|
-
.cx-tl-weekend-col{position:absolute;top:0;bottom:0;background:color-mix(in srgb,var(--
|
|
23
|
+
.cx-tl-weekend-col{position:absolute;top:0;bottom:0;background:color-mix(in srgb,var(--hfx-color-text,light-dark(#16181c,#f2f3f5)) 3.5%,transparent);}
|
|
24
24
|
.cx-tl-range{position:absolute;top:0;bottom:0;background:color-mix(in srgb,var(--cx-bg-tone) 9%,transparent);box-shadow:inset var(--cx-size-2px) 0 0 color-mix(in srgb,var(--cx-bg-tone) 50%,transparent);}
|
|
25
25
|
:where(.cx-cal-rtl) .cx-tl-range{box-shadow:inset calc(-1 * var(--cx-size-2px)) 0 0 color-mix(in srgb,var(--cx-bg-tone) 50%,transparent);}
|
|
26
|
-
.cx-tl-now{position:absolute;top:0;bottom:0;width:var(--cx-size-2px);margin-inline-start:calc(-1 * var(--cx-size-1px));background:var(--
|
|
27
|
-
.cx-tl-lane{position:absolute;inset-inline-start:0;inset-inline-end:0;border-bottom:var(--cx-size-1px) solid color-mix(in srgb,var(--
|
|
28
|
-
.cx-tl-lane.cx-tl-group{background:color-mix(in srgb,var(--
|
|
26
|
+
.cx-tl-now{position:absolute;top:0;bottom:0;width:var(--cx-size-2px);margin-inline-start:calc(-1 * var(--cx-size-1px));background:var(--hfx-color-status-bad-fg,light-dark(#b8292a,#f47171));z-index:1;}
|
|
27
|
+
.cx-tl-lane{position:absolute;inset-inline-start:0;inset-inline-end:0;border-bottom:var(--cx-size-1px) solid color-mix(in srgb,var(--hfx-color-border,light-dark(#e2e4e7,#272a30)) 70%,transparent);}
|
|
28
|
+
.cx-tl-lane.cx-tl-group{background:color-mix(in srgb,var(--hfx-color-text,light-dark(#16181c,#f2f3f5)) 2.5%,transparent);}
|
|
29
29
|
.cx-tl-cell{position:absolute;top:0;bottom:0;pointer-events:none;outline:none;}
|
|
30
|
-
.cx-tl-cell:focus-visible{outline:var(--
|
|
31
|
-
.cx-tl-cell[aria-selected="true"]{background:var(--
|
|
30
|
+
.cx-tl-cell:focus-visible{outline:var(--hfx-focus-width,2px) solid var(--hfx-color-focus-ring,light-dark(#02726a,#37c9b8));outline-offset:calc(-1 * var(--cx-size-2px));z-index:5;}
|
|
31
|
+
.cx-tl-cell[aria-selected="true"]{background:var(--hfx-color-accent-subtle,light-dark(#e7f1f1,#1b3435));}
|
|
32
32
|
.cx-tl-lane .cx-cal-ev-lane{position:absolute;z-index:2;pointer-events:auto;padding:0 var(--cx-size-6px);font-size:var(--cx-size-12px);line-height:1.2;}
|
|
33
33
|
.cx-tl-lane .cx-cal-ev-lane > .cx-cal-ev-sub{display:none;}
|
|
34
34
|
.cx-tl-lane .cx-cal-ev-lane.cx-tl-thin{font-size:var(--cx-size-11px);padding:0 var(--cx-size-4px);}
|
|
@@ -42,16 +42,16 @@
|
|
|
42
42
|
.cx-tl-lane .cx-cal-ev-lane.cx-tl-point.cx-tl-bare{width:var(--cx-size-14px)!important;padding-inline-start:0;}
|
|
43
43
|
.cx-tl-lane .cx-cal-ev-lane.cx-tl-point.cx-tl-bare > .cx-cal-ev-title{display:none;}
|
|
44
44
|
.cx-tl-shade{position:absolute;top:0;bottom:0;pointer-events:none;overflow:hidden;overflow:clip;}
|
|
45
|
-
.cx-tl-shade > span{position:sticky;inset-inline-start:0;display:block;width:max-content;max-width:100%;box-sizing:border-box;padding:var(--cx-size-2px) var(--cx-size-6px);font-size:var(--cx-size-11px);color:var(--
|
|
46
|
-
.cx-tl-shade.cx-tl-off{background:color-mix(in srgb,var(--
|
|
47
|
-
:is(.cx-tl-shade,.cx-tl-range).cx-tl-unavailable{background:repeating-linear-gradient(135deg,color-mix(in srgb,var(--
|
|
45
|
+
.cx-tl-shade > span{position:sticky;inset-inline-start:0;display:block;width:max-content;max-width:100%;box-sizing:border-box;padding:var(--cx-size-2px) var(--cx-size-6px);font-size:var(--cx-size-11px);color:var(--hfx-color-text-secondary,light-dark(#4d525b,#b0b4bc));white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
|
|
46
|
+
.cx-tl-shade.cx-tl-off{background:color-mix(in srgb,var(--hfx-color-text,light-dark(#16181c,#f2f3f5)) 4.5%,transparent);}
|
|
47
|
+
:is(.cx-tl-shade,.cx-tl-range).cx-tl-unavailable{background:repeating-linear-gradient(135deg,color-mix(in srgb,var(--hfx-color-text,light-dark(#16181c,#f2f3f5)) 9%,transparent) 0 var(--cx-size-6px),transparent var(--cx-size-6px) var(--cx-size-12px));box-shadow:none;}
|
|
48
48
|
.cx-tl-shade.cx-tl-bg{background:color-mix(in srgb,var(--cx-bg-tone) 12%,transparent);box-shadow:inset var(--cx-size-2px) 0 0 color-mix(in srgb,var(--cx-bg-tone) 55%,transparent);}
|
|
49
49
|
:where(.cx-cal-rtl) .cx-tl-shade.cx-tl-bg{box-shadow:inset calc(-1 * var(--cx-size-2px)) 0 0 color-mix(in srgb,var(--cx-bg-tone) 55%,transparent);}
|
|
50
|
-
.cx-tl-heat{position:absolute;z-index:2;background:var(--
|
|
51
|
-
.cx-tl-heat::before{content:"";position:absolute;inset:0 var(--cx-size-1px);z-index:-1;border-radius:inherit;background:var(--cx-bg-tone,var(--
|
|
50
|
+
.cx-tl-heat{position:absolute;z-index:2;background:var(--hfx-color-surface,light-dark(#ffffff,#16181c));top:var(--cx-size-5px);bottom:var(--cx-size-5px);display:grid;place-items:center;border-radius:var(--hfx-radius-sm,4px);font-size:var(--cx-size-11d5px);font-weight:600;color:var(--hfx-color-text,light-dark(#16181c,#f2f3f5));font-variant-numeric:tabular-nums;overflow:hidden;isolation:isolate;}
|
|
51
|
+
.cx-tl-heat::before{content:"";position:absolute;inset:0 var(--cx-size-1px);z-index:-1;border-radius:inherit;background:var(--cx-bg-tone,var(--hfx-color-accent,light-dark(#11776f,#37c9b8)));opacity:calc(.12 + var(--cx-heat,0) * .38);}
|
|
52
52
|
.cx-tl-heat[data-cx-tone]::before{opacity:calc(.28 + var(--cx-heat,0) * .42);}
|
|
53
53
|
.cx-tl-lane > .cx-tl-ghost{top:var(--cx-size-3px);bottom:var(--cx-size-3px);padding:0;overflow:visible;}
|
|
54
|
-
.cx-tl-ghost > .cx-tl-ghost-label{position:absolute;inset-inline-start:calc(100% + var(--cx-size-6px));top:50%;transform:translateY(-50%);padding:var(--cx-size-2px) var(--cx-size-6px);border:var(--cx-size-1px) solid currentColor;border-radius:var(--
|
|
54
|
+
.cx-tl-ghost > .cx-tl-ghost-label{position:absolute;inset-inline-start:calc(100% + var(--cx-size-6px));top:50%;transform:translateY(-50%);padding:var(--cx-size-2px) var(--cx-size-6px);border:var(--cx-size-1px) solid currentColor;border-radius:var(--hfx-radius-sm,4px);background:var(--hfx-color-surface,light-dark(#ffffff,#16181c));white-space:nowrap;box-shadow:var(--hfx-elevation-1,0 1px 2px rgba(22,24,28,.06));}
|
|
55
55
|
.cx-tl-print{display:none;}
|
|
56
56
|
.cx-cal-phone .cx-tl{--cx-tl-side-w:176px;}
|
|
57
57
|
.cx-cal-phone .cx-tl-tree .cx-hidden-fields{display:none;}
|
|
@@ -67,14 +67,14 @@
|
|
|
67
67
|
.cx-tl > :is(.cx-tl-side,.cx-tl-main){display:none!important;}
|
|
68
68
|
.cx-tl{display:block;height:auto;}
|
|
69
69
|
.cx-tl-print{display:block;font-size:10px;}
|
|
70
|
-
.cx-tl-print-row{display:grid;grid-template-columns:24% 1fr;align-items:stretch;min-height:18px;border-bottom:var(--cx-size-1px) solid var(--
|
|
70
|
+
.cx-tl-print-row{display:grid;grid-template-columns:24% 1fr;align-items:stretch;min-height:18px;border-bottom:var(--cx-size-1px) solid var(--hfx-color-border,light-dark(#e2e4e7,#272a30));break-inside:avoid;}
|
|
71
71
|
.cx-tl-print-head{font-weight:700;border-bottom-width:var(--cx-size-2px);}
|
|
72
|
-
.cx-tl-print-group{background:color-mix(in srgb,var(--
|
|
72
|
+
.cx-tl-print-group{background:color-mix(in srgb,var(--hfx-color-text,light-dark(#16181c,#f2f3f5)) 4%,transparent);font-weight:600;}
|
|
73
73
|
.cx-tl-print-name{padding:var(--cx-size-2px) var(--cx-size-4px);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
|
|
74
74
|
.cx-tl-print-lane{position:relative;min-height:18px;}
|
|
75
|
-
.cx-tl-print-unit,.cx-tl-print-heat{position:absolute;top:0;bottom:0;padding:0 var(--cx-size-2px);border-inline-start:var(--cx-size-1px) solid var(--
|
|
76
|
-
.cx-tl-print-bar.cx-tl-print-tiny{background:var(--cx-ev,var(--
|
|
77
|
-
.cx-tl-print-bar{position:absolute;top:var(--cx-size-2px);bottom:var(--cx-size-2px);padding:0 var(--cx-size-2px);border-radius:var(--cx-size-2px);background:color-mix(in srgb,var(--cx-ev,var(--
|
|
78
|
-
:where(.cx-cal-rtl) .cx-tl-print-bar{box-shadow:inset calc(-1 * var(--cx-size-2px)) 0 0 var(--cx-ev,var(--
|
|
75
|
+
.cx-tl-print-unit,.cx-tl-print-heat{position:absolute;top:0;bottom:0;padding:0 var(--cx-size-2px);border-inline-start:var(--cx-size-1px) solid var(--hfx-color-border,light-dark(#e2e4e7,#272a30));overflow:hidden;white-space:nowrap;}
|
|
76
|
+
.cx-tl-print-bar.cx-tl-print-tiny{background:var(--cx-ev,var(--hfx-color-accent,light-dark(#11776f,#37c9b8)));box-shadow:none;}
|
|
77
|
+
.cx-tl-print-bar{position:absolute;top:var(--cx-size-2px);bottom:var(--cx-size-2px);padding:0 var(--cx-size-2px);border-radius:var(--cx-size-2px);background:color-mix(in srgb,var(--cx-ev,var(--hfx-color-accent,light-dark(#11776f,#37c9b8))) 22%,var(--hfx-color-surface,light-dark(#ffffff,#16181c)));box-shadow:inset var(--cx-size-2px) 0 0 var(--cx-ev,var(--hfx-color-accent,light-dark(#11776f,#37c9b8)));overflow:hidden;white-space:nowrap;-webkit-print-color-adjust:exact;print-color-adjust:exact;}
|
|
78
|
+
:where(.cx-cal-rtl) .cx-tl-print-bar{box-shadow:inset calc(-1 * var(--cx-size-2px)) 0 0 var(--cx-ev,var(--hfx-color-accent,light-dark(#11776f,#37c9b8)));}
|
|
79
79
|
}
|
|
80
80
|
@media (forced-colors:active){.cx-tl-ghost > .cx-tl-ghost-label{background:Canvas;color:CanvasText;border-color:CanvasText;}}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
(function(global){"use strict";const installed=new WeakSet();const part={version:"
|
|
1
|
+
(function(global){"use strict";const installed=new WeakSet();const part={version:"22c9e15c108aeaa1",requires:["calendar"],install(context){if(installed.has(context.DataGrid.prototype))return;const{toneVariable,DataGrid,TreeGrid,h,setText,fill,numberFormat}=context;const{CAL_DAY,CAL_HOUR,CAL_MINUTE,calAddMonths,calCount,calDayNumber,calDayParts,calDow,calMonthStart,calWeekStart}=DataGrid.prototype.calKit;const TL_ZOOMS={hour:{width:56,unit:"hour"},day:{width:44,unit:"day"},week:{width:92,unit:"week"},month:{width:112,unit:"month"},quarter:{width:150,unit:"quarter"}};function tlSpan(zoom,date,firstDay){if(zoom==="hour")return{firstDay:date,lastDay:date};if(zoom==="day"){const month=calMonthStart(date);return{firstDay:month,lastDay:calAddMonths(month,1)- 1}}
|
|
2
2
|
if(zoom==="week"){const parts=calDayParts(date),quarter=calDayNumber(parts.y,Math.floor((parts.m-1)/ 3) * 3 + 1, 1);
|
|
3
3
|
return{firstDay:calWeekStart(quarter,firstDay),lastDay:calWeekStart(calAddMonths(quarter,3)- 1,firstDay)+ 6}}
|
|
4
4
|
const parts=calDayParts(date);if(zoom==="month")return{firstDay:calDayNumber(parts.y,1,1),lastDay:calDayNumber(parts.y+1,1,1)- 1};return{firstDay:calDayNumber(parts.y,1,1),lastDay:calDayNumber(parts.y+3,1,1)- 1}}
|
|
@@ -22,16 +22,17 @@ const dow=calDow(unit.first),off=view.cal.working?!view.cal.working.days.has(dow
|
|
|
22
22
|
return{upper,lower}}
|
|
23
23
|
Object.assign(DataGrid.prototype,{startTimeline(){if(this.tl)return;const resources=this.cal.resources;this.tl={names:new Map(),parent:new Map(),children:new Map(),order:[],learned:new Set(),stats:null,heat:new Map()};this.tlSolo=!resources;if(this.tlSolo){this.tlInline=true;return}
|
|
24
24
|
const inline=!resources.view.source||resources.view.source.kind==="inline";if(inline)this.tlLearnNodes(resources.view.roots||[],null);this.tlInline=inline},tlLearnNodes(nodes,parent){const stack=nodes.map(node=>[node,parent]).reverse();while(stack.length){const[node,owner]=stack.pop();if(!node||typeof node.id!=="string"||this.tl.learned.has(node.id))continue;this.tl.learned.add(node.id);this.tl.names.set(node.id,node.label??node.id);this.tl.parent.set(node.id,owner);this.tl.order.push(node.id);if(owner!==null){if(!this.tl.children.has(owner))this.tl.children.set(owner,[]);this.tl.children.get(owner).push(node.id)}
|
|
25
|
-
if(Array.isArray(node.children))for(let i=node.children.length-1;i>=0;i--)stack.push([node.children[i],node.id])}},calResourceName(id){return this.tl?.names.get(id)??id},calResourceColumns(){if(!this.tl||!this.tlInline)return null;const leaves=this.tl.order.filter(id=>!this.tl.children.has(id));if(!leaves.length
|
|
25
|
+
if(Array.isArray(node.children))for(let i=node.children.length-1;i>=0;i--)stack.push([node.children[i],node.id])}},calResourceName(id){return this.tl?.names.get(id)??id},calResourceColumns(){if(!this.tl||!this.tlInline)return null;const leaves=this.tl.order.filter(id=>!this.tl.children.has(id));if(!leaves.length)return null;return leaves.map(id=>({id,label:this.calResourceName(id),group:this.tl.parent.get(id)==null?null:this.calResourceName(this.tl.parent.get(id))}))},calHoursFor(resource,dow){const list=this.cal.availability;if(!list.length)return undefined;let own=resource==null?[]:list.filter(item=>item.resource===resource);for(let parent=this.tl?.parent.get(resource);!own.length&&parent!=null;parent=this.tl.parent.get(parent))own=list.filter(item=>item.resource===parent);const entries=own.length?own:list.filter(item=>item.resource==null);return entries.length?entries.filter(item=>item.days.has(dow)):undefined},calResourceStep(resource,sign){if(this.tlSolo)return resource;const rows=this.tlTree?this.tlTree.rows.filter(row=>!row.status&&!this.tl.children.has(row.key)).map(row=>row.key):this.tl.order.filter(id=>!this.tl.children.has(id));const at=rows.indexOf(resource);return rows[Math.max(0,Math.min(rows.length-1,(at<0?0:at)+ sign))]??resource},calResourceWindow(){if(this.cal.resourceIds||this.calView!=="timeline"||this.tlSolo||this.view.source.kind==="inline"&&!this.opts.source)return null;this.tlEnsure();if(!this.tlTree?.rows?.length)return null;const range=this.tlMain.clientHeight?this.tlVisibleRows(40):{first:0,last:Math.min(this.tlTree.rows.length-1,80)},ids=new Set();for(let i=range.first;i<=range.last&&ids.size<1000;i++){const row=this.tlTree.rows[i];if(!row||row.status)continue;const stack=[row.key];while(stack.length&&ids.size<1000){const id=stack.pop();if(ids.has(id))continue;ids.add(id);const children=this.tl.children.get(id)||[];for(let at=children.length-1;at>=0;at--)stack.push(children[at])}}
|
|
26
26
|
const window=[...ids];return window.length?window:null},tlCheckWindow(){if(this.view.source.kind==="inline"&&!this.opts.source)return;clearTimeout(this.tlWindowTimer);this.tlWindowTimer=setTimeout(()=>{if(this.destroyed||this.calView!=="timeline")return;const wanted=this.calResourceWindow(),loaded=JSON.parse(this.calWindowKey||"null"),known=new Set(loaded||[]);if(wanted&&(!loaded||wanted.some(id=>!known.has(id))))this.calReload({keep:true})},250)},calResourcesReady(){if(this.calView!=="timeline"||this.view.source.kind==="inline"&&!this.opts.source)return null;this.tlEnsure();return this.tlTree.ready?.catch(()=>{})},calTimelineRange(date){return this.cal.span?tlCustomSpan(this.cal.span,date,this.cal.firstDay):tlSpan(this.calZoom,date,this.cal.firstDay)},calTimelineStep(date,direction){return this.cal.span?tlCustomStep(this.cal.span,date,direction):tlStep(this.calZoom,date,direction)},calTimelineTitle(){const range=this.calRange,fmt=this.calFmt;if(this.cal.span)return range.firstDay===range.lastDay?fmt.longDay(range.firstDay):fmt.dayRange(range.firstDay,range.lastDay);if(this.calZoom==="hour")return fmt.longDay(range.firstDay);if(this.calZoom==="day")return fmt.monthTitle(range.firstDay);if(this.calZoom==="week")return fmt.monthRange(range.firstDay,range.lastDay);return range.lastDay-range.firstDay>400?fmt.year(range.firstDay)+ " – "+fmt.year(range.lastDay):fmt.year(range.firstDay)},calTimelineHasNow(){const now=Date.now();return this.tlAxis?now>=this.tlAxis.from&&now<this.tlAxis.to:false},tlEnsure(){if(this.tlRoot)return;const resources=this.cal.resources,root=this.tlRoot=h("div","cx-tl" +(this.tlSolo?" cx-tl-solo":"")),side=h("div","cx-tl-side"),host=this.tlTreeHost=h("div","cx-tl-tree");const main=this.tlMain=h("div","cx-tl-main"),head=this.tlHead=h("div","cx-tl-head"),canvas=this.tlCanvas=h("div","cx-tl-canvas");head.setAttribute("aria-hidden","true");const upper=this.tlUpper=h("div","cx-tl-hrow cx-tl-upper"),lower=this.tlLower=h("div","cx-tl-hrow cx-tl-lower");head.append(upper,lower);canvas.setAttribute("role","grid");canvas.setAttribute("aria-labelledby",this.calTitle.id);canvas.setAttribute("aria-readonly",String(!this.cal.editable));if(this.tlSolo){root.append(main);main.append(head,canvas);const signal=this.lifetime.signal;this.tlTree={rows:[],tops:[0],rowH:this.rowH||34,version:0,destroyed:false,ready:Promise.resolve(),grid:side,scheduleRender:()=>this.tlScheduleLanes(),setState:()=>Promise.resolve(),destroy(){this.destroyed=true}};main.addEventListener("scroll",()=>this.tlScheduleLanes(),{passive:true,signal});return}
|
|
27
|
-
root.style.setProperty("--cx-tl-side",resources.width+"px");main.append(head,canvas);side.appendChild(host);root.append(side,main);
|
|
27
|
+
root.style.setProperty("--cx-tl-side",resources.width+"px");main.append(head,canvas);side.appendChild(host);root.append(side,main);const aggregates=resources.aggregates,renderers={};for(const[column,kind]of Object.entries(aggregates))renderers[column]=(node,element)=>{setText(element,this.tlAggregateText(node.id,kind));element.classList.add("cx-tl-agg");return true};const view={...resources.view,rowHeight:resources.view.rowHeight||this.rowH,labels:{...this.view.labels,...resources.view.labels}};const tree=this.tlTree=new TreeGrid(host,{view,toolbar:false,renderers,labels:this.opts.labels});tree.emit=(name,detail)=>{if(!tree.destroyed)host.dispatchEvent(new CustomEvent("canopyx:"+name,{detail}))};const render=tree.render.bind(tree);tree.render=()=>{const result=render();if(!this.tlRows||this.tlRows!==tree.rows.length+":"+tree.version){this.tlLearnLoaded()}this.tlPaintLanes();this.tlCheckWindow();return result};const signal=this.lifetime.signal;let syncing=false;main.addEventListener("scroll",()=>{if(!syncing&&tree.grid.scrollTop!==main.scrollTop){syncing=true;tree.grid.scrollTop=main.scrollTop;syncing=false}
|
|
28
28
|
this.tlScheduleLanes();this.tlCheckWindow()},{passive:true,signal});tree.grid.addEventListener("scroll",()=>{if(!syncing&&Math.abs(tree.grid.scrollTop-main.scrollTop)>1){syncing=true;main.scrollTop=tree.grid.scrollTop;syncing=false}},{passive:true,signal});host.addEventListener("wheel",event=>{if(!event.deltaY||event.ctrlKey)return;event.preventDefault();main.scrollTop +=event.deltaY*(event.deltaMode===1?tree.rowH:event.deltaMode===2?main.clientHeight:1)},{passive:false,signal});host.addEventListener("canopyx:toggle",event=>{const node=event.detail.node;if(event.detail.expanded)this.calCollapsed.delete(node.id);else this.calCollapsed.add(node.id);this.stateChanged()},{signal});host.addEventListener("canopyx:select",event=>{const node=event.detail.node;if(!node){this.clearCalendarSelection();return}
|
|
29
|
-
const zone=this.calZone,range=this.calRange,ids=new Set([node.id,...this.tlDescendants(node.id)]);this.calSelection={first:range.firstDay,last:range.lastDay,from:zone.start(range.firstDay),to:zone.start(range.lastDay+1),resource:node.id};const events=this.calEvents.filter(item=>!item.background&&ids.has(
|
|
29
|
+
const zone=this.calZone,range=this.calRange,ids=new Set([node.id,...this.tlDescendants(node.id)]);this.calSelection={first:range.firstDay,last:range.lastDay,from:zone.start(range.firstDay),to:zone.start(range.lastDay+1),resource:node.id};const events=this.calEvents.filter(item=>!item.background&&this.calEventResources(item).some(id=>ids.has(id)));this.calAnnounce(fill(this.calLabels.calendarSelected,{range:this.calResourceName(node.id)}));this.calEmitLink("select",events,this.calResourceName(node.id),this.calSelection)},{signal});signal.addEventListener("abort",()=>{clearTimeout(this.tlWindowTimer);tree.destroy()},{once:true});tree.ready.then(()=>{if(!this.destroyed){this.calApplyCollapsed();this.tlPaintLanes()}},error=>this.emit("error",{error}))},tlLearnLoaded(){const tree=this.tlTree;this.tlRows=tree.rows.length+":"+tree.version;for(const row of tree.rows)if(!row.status&&row.key!=null&&!this.tl.learned.has(row.key)){this.tl.learned.add(row.key);this.tl.names.set(row.key,row.h.label??row.key);this.tl.order.push(row.key);const parent=row.parent?.key??null;this.tl.parent.set(row.key,parent);if(parent!==null){if(!this.tl.children.has(parent))this.tl.children.set(parent,[]);this.tl.children.get(parent).push(row.key)}
|
|
30
30
|
if(row.h.hasChildren&&!this.tl.children.has(row.key))this.tl.children.set(row.key,[])}},tlDescendants(id){const out=[],stack=[...(this.tl.children.get(id)||[])];while(stack.length&&out.length<100000){const next=stack.pop();out.push(next);stack.push(...(this.tl.children.get(next)||[]))}
|
|
31
31
|
return out},calApplyCollapsed(){const tree=this.tlTree;if(!tree||this.destroyed)return;const expanded=[];if(this.tlInline){const walk=(id,path)=>{if(!this.tl.children.has(id)||this.calCollapsed.has(id))return;expanded.push(path);for(const child of this.tl.children.get(id))walk(child,path.concat(child))};for(const id of this.tl.order)if(this.tl.parent.get(id)===null)walk(id,[id]);tree.setState({expanded}).catch?.(()=>{})}},calPaintTimeline(){this.tlEnsure();const span=this.calRange,axis=this.tlAxis=tlAxis(this.calZoom,span,this.calZone,this.cal.firstDay);this.tlIndex=this.tlIndexEvents();this.tl.heat.clear();if(this.tlRoot.parentNode!==this.calBody)this.calBody.replaceChildren(this.tlRoot);this.tlCanvas.style.width=axis.total+"px";this.tlHead.style.width=axis.total+"px";const header=tlHeader(this,axis),paint=(row,cells,cls)=>{row.replaceChildren(...cells.map(cell=>{const element=h("div",cls +(cell.weekend?" cx-tl-weekend":"")),text=h("span","cx-tl-hlabel");element.style.insetInlineStart=cell.x+"px";element.style.width=cell.width+"px";setText(text,cell.text);element.appendChild(text);element.title=cell.label;return element}))};paint(this.tlUpper,header.upper,"cx-tl-hcell cx-tl-hupper");paint(this.tlLower,header.lower,"cx-tl-hcell");this.tlHeader=header;this.calGrid=this.tlCanvas;if(this.tlScrolledFor!==this.calZoom+":"+span.firstDay){this.tlScrolledFor=this.calZoom+":"+span.firstDay;const now=Date.now(),target=now>=axis.from&&now<axis.to?axis.x(now)- this.tlMain.clientWidth / 3 : 0;
|
|
32
32
|
this.tlScrollTo(Math.max(0,target))}
|
|
33
|
-
this.tlTree.version++;this.tlTree.scheduleRender();this.tlPaintLanes()},tlScrollX(){return Math.abs(this.tlMain.scrollLeft)},tlScrollTo(x){this.tlMain.scrollLeft=this.calRtl?-x:x},calTimelineScroll(){return this.tlMain?{timeline:true,top:this.tlMain.scrollTop,left:this.tlScrollX(),view:"timeline",date:this.calDate,zoom:this.calZoom}:null},calRestoreTimelineScroll(state){if(state.zoom!==this.calZoom||state.date!==this.calDate)return false;this.tlMain.scrollTop=state.top;this.tlScrollTo(state.left);return true}});
|
|
34
|
-
|
|
33
|
+
this.tlTree.version++;this.tlTree.scheduleRender();this.tlPaintLanes()},tlScrollX(){return Math.abs(this.tlMain.scrollLeft)},tlScrollTo(x){this.tlMain.scrollLeft=this.calRtl?-x:x},calTimelineScroll(){return this.tlMain?{timeline:true,top:this.tlMain.scrollTop,left:this.tlScrollX(),view:"timeline",date:this.calDate,zoom:this.calZoom}:null},calRestoreTimelineScroll(state){if(state.zoom!==this.calZoom||state.date!==this.calDate)return false;this.tlMain.scrollTop=state.top;this.tlScrollTo(state.left);return true}});Object.assign(DataGrid.prototype,{calWindowTimeColumns(columns){this.calTimeWindow=null;if(this.calPhone||this.calPrinting||columns.length<=24)return columns;const size=Math.max(2,Math.min(24,Math.floor((this.calBody.clientWidth-this.calKit.CAL_GUTTER)/ 150)));
|
|
34
|
+
const first=Math.max(0,Math.min(columns.length-size,this.calTimeFirst||0));this.calTimeFirst=first;this.calTimeWindow={first,size,total:columns.length,columns};return columns.slice(first,first+size).map((column,index)=>({...column,index:first+index}))},calTimeReveal(index,minutes){const window=this.calTimeWindow;if(!window||index<0||index>=window.total)return false;const column=window.columns[index];this.calTimeFirst=index<window.first?index:index>=window.first+window.size?index-window.size+1:window.first;this.calFocus={day:column.day,minutes,resource:column.resource,event:null};this.calPaint({keep:true});this.calRestoreFocus(true);return true}});const TL_MARGIN=480,TL_STACK=4,TL_MIN_BAR=8,TL_SOLID_BAR=16;Object.assign(DataGrid.prototype,{tlIndexEvents(){const byResource=new Map(),backgrounds=new Map();for(const event of this.calEvents){const span=this.calDisplaySpan(event);event.tlStart=span.start;event.tlEnd=span.end}
|
|
35
|
+
if(this.tlSolo)return this.tlIndexSolo(backgrounds);for(const event of this.calEvents){const target=event.background?backgrounds:byResource,resources=this.calEventResources(event);for(const key of resources.length?resources:[""]){if(!target.has(key))target.set(key,[]);target.get(key).push({...event,resource:key||null})}}
|
|
35
36
|
for(const list of byResource.values()){list.sort((a,b)=>a.tlStart-b.tlStart||b.tlEnd-a.tlEnd);const ends=[];for(const event of list){let lane=ends.findIndex(end=>end<=event.tlStart);if(lane<0){lane=ends.length;ends.push(0)}
|
|
36
37
|
ends[lane]=Math.max(event.tlEnd,event.tlStart+1);event.tlLane=lane}
|
|
37
38
|
list.lanes=Math.max(1,ends.length)}
|
|
@@ -52,13 +53,13 @@ const firstVisible=cells.length?Number(cells[0].dataset.cxUnit):0;const nextInRo
|
|
|
52
53
|
for(const event of events){if(event.tlEnd<axis.from||event.tlStart>=axis.to)continue;const x1=axis.x(event.tlStart),x2=event.tlEnd>event.tlStart?axis.x(event.tlEnd):x1;if(x2<left||x1>right)continue;const span=x2-x1,point=event.marker||span<1;const element=this.calEventElement(event,"lane"),slot=Math.min(event.tlLane,stack-1),room=nextInRow.get(event)===undefined?Infinity:axis.x(nextInRow.get(event))- x1-1,width=point?0:Math.max(Math.min(span,2),Math.min(Math.max(TL_MIN_BAR,span),room));const unit=Math.max(firstVisible,axis.unitOf(event.tlStart)),cell=cells.find(item=>Number(item.dataset.cxUnit)===unit)||cells[0];const offset=cell?Number.parseFloat(cell.style.insetInlineStart):0;element.style.insetInlineStart=(x1-offset)+ "px";element.style.width=width+"px";element.style.top=(3+slot*(inner / stack)) + "px"; element.style.height = bar + "px";
|
|
53
54
|
if(bar<16)element.classList.add("cx-tl-thin");if(point)element.classList.add("cx-tl-point");else if(span<TL_SOLID_BAR){element.classList.add("cx-tl-tiny");element.title=this.calEventName(event)}
|
|
54
55
|
if(point&&(axis.zoom!=="hour"||!event.marker)){element.classList.add("cx-tl-bare");element.title=this.calEventName(event)}
|
|
55
|
-
if(width<40)element.classList.add("cx-tl-narrow");if(event.tlStart<axis.from)element.classList.add("cx-cal-cont-start");if(event.tlEnd>axis.to)element.classList.add("cx-cal-cont-end");(cell||lane).appendChild(element)}},tlUnitLabel(unit){const lower=this.tlHeader?.lower.find(cell=>cell.unit===unit);return lower?lower.label:this.calFmt.longDay(unit.first)},tlPaintShade(lane,id,left,right){const axis=this.tlAxis,add=(start,end,cls,label,tone)=>{const x1=axis.x(start),x2=axis.x(end);if(x2<=x1||x2<left||x1>right)return;const block=h("div","cx-tl-shade "+cls);block.setAttribute("aria-hidden","true");block.style.insetInlineStart=x1+"px";block.style.width=(x2-x1)+ "px";if(tone)block.style.setProperty("--cx-bg-tone",
|
|
56
|
+
if(width<40)element.classList.add("cx-tl-narrow");if(event.tlStart<axis.from)element.classList.add("cx-cal-cont-start");if(event.tlEnd>axis.to)element.classList.add("cx-cal-cont-end");(cell||lane).appendChild(element)}},tlUnitLabel(unit){const lower=this.tlHeader?.lower.find(cell=>cell.unit===unit);return lower?lower.label:this.calFmt.longDay(unit.first)},tlPaintShade(lane,id,left,right){const axis=this.tlAxis,add=(start,end,cls,label,tone)=>{const x1=axis.x(start),x2=axis.x(end);if(x2<=x1||x2<left||x1>right)return;const block=h("div","cx-tl-shade "+cls);block.setAttribute("aria-hidden","true");block.style.insetInlineStart=x1+"px";block.style.width=(x2-x1)+ "px";if(tone)block.style.setProperty("--cx-bg-tone",toneVariable(tone,false,"var(--hfx-color-status-info-fg,light-dark(#2b5fc0,#74a2f7))"));if(label&&x2-x1>60){const text=h("span");setText(text,label);block.appendChild(text)}
|
|
56
57
|
lane.appendChild(block)};if(axis.zoom==="hour")for(let day=axis.units[0].first;day<=axis.units[axis.units.length-1].last;day++){const hours=this.calHoursFor(id,calDow(day))??(this.cal.working?(this.cal.working.days.has(calDow(day))?[this.cal.working]:[]):null);if(hours){let at=0;for(const span of hours.slice().sort((a,b)=>a.start-b.start)){add(this.calZone.instant(day,at),this.calZone.instant(day,span.start),"cx-tl-off");at=Math.max(at,span.end)}add(this.calZone.instant(day,at),this.calZone.instant(day,1440),"cx-tl-off")}}
|
|
57
58
|
for(const range of this.calRanges)if(range.resource===id)add(range.start,range.end,range.kind==="unavailable"?"cx-tl-unavailable":"cx-tl-bg",range.label,range.kind==="unavailable"?null:range.tone);for(const event of this.tlIndex.backgrounds.get(id)||[])add(event.tlStart,event.tlEnd,"cx-tl-bg",event.title,event.tone||"info")},tlPaintCanvas(left,right,total){const axis=this.tlAxis,layer=this.tlLayer||=h("div","cx-tl-layer");layer.setAttribute("aria-hidden","true");layer.style.height=total+"px";const blocks=[];for(const cell of this.tlHeader.lower)if(cell.weekend&&cell.x+cell.width>=left&&cell.x<=right){const block=h("div","cx-tl-weekend-col");block.style.insetInlineStart=cell.x+"px";block.style.width=cell.width+"px";blocks.push(block)}
|
|
58
|
-
const global=[...this.calRanges.filter(range=>range.resource==null),...(this.tlIndex.backgrounds.get("")||[]).map(event=>({start:event.tlStart,end:event.tlEnd,label:event.title,tone:event.tone||"info",kind:"background"}))];for(const range of global){const x1=axis.x(range.start),x2=axis.x(range.end);if(x2<=x1||x2<left||x1>right)continue;const block=h("div","cx-tl-range" +(range.kind==="unavailable"?" cx-tl-unavailable":""));block.style.insetInlineStart=x1+"px";block.style.width=(x2-x1)+ "px";if(range.kind!=="unavailable")block.style.setProperty("--cx-bg-tone",
|
|
59
|
+
const global=[...this.calRanges.filter(range=>range.resource==null),...(this.tlIndex.backgrounds.get("")||[]).map(event=>({start:event.tlStart,end:event.tlEnd,label:event.title,tone:event.tone||"info",kind:"background"}))];for(const range of global){const x1=axis.x(range.start),x2=axis.x(range.end);if(x2<=x1||x2<left||x1>right)continue;const block=h("div","cx-tl-range" +(range.kind==="unavailable"?" cx-tl-unavailable":""));block.style.insetInlineStart=x1+"px";block.style.width=(x2-x1)+ "px";if(range.kind!=="unavailable")block.style.setProperty("--cx-bg-tone",toneVariable(range.tone,false,"var(--hfx-color-status-info-fg,light-dark(#2b5fc0,#74a2f7))"));block.title=range.label;blocks.push(block)}
|
|
59
60
|
const now=Date.now();if(this.cal.now&&now>=axis.from&&now<axis.to){const line=h("div","cx-tl-now");line.style.insetInlineStart=axis.x(now)+ "px";line.title=this.calLabels.calendarNow+" "+this.calFmt.time(now);blocks.push(line)}
|
|
60
61
|
layer.replaceChildren(...blocks);if(layer.parentNode!==this.tlCanvas)this.tlCanvas.prepend(layer);const labels=this.tlRangeLabels||=h("div","cx-tl-range-labels"),named=global.filter(range=>axis.x(range.end)- axis.x(range.start)>50);labels.replaceChildren(...named.map(range=>{const label=h("span","cx-tl-range-label");label.style.insetInlineStart=axis.x(range.start)+ "px";label.style.width=(axis.x(range.end)- axis.x(range.start))+ "px";setText(label,range.label);label.title=range.label;return label}));if(labels.parentNode!==this.tlHead)this.tlHead.appendChild(labels);if(this.tlHead.classList.contains("cx-tl-has-ranges")!==named.length>0){this.tlHead.classList.toggle("cx-tl-has-ranges",named.length>0);this.tlRoot.style.setProperty("--cx-tl-head-h",named.length?"78px":"57px");this.tlTree.scheduleRender()}},calTickTimeline(){if(this.calView==="timeline")this.tlPaintCanvas(this.tlScrollX()- TL_MARGIN,this.tlScrollX()+ this.tlMain.clientWidth+TL_MARGIN,this.tlTree.tops[this.tlTree.rows.length]||0)},tlPaintHeat(lane,id,left,right){const axis=this.tlAxis,heat=this.tlHeat(id),thresholds=this.cal.capacity?.thresholds||[],most=Math.max(1,...heat);heat.forEach((value,index)=>{const unit=axis.units[index];if(!value||unit.x+axis.width<left||unit.x>right)return;const block=h("div","cx-tl-heat"),tone=thresholds.reduce((found,item)=>value>=item.at?item.tone:found,null);block.style.insetInlineStart=unit.x+"px";block.style.width=axis.width+"px";block.style.setProperty("--cx-heat",String(Math.min(1,value / most)));
|
|
61
|
-
if(tone){block.dataset.cxTone=tone;block.style.setProperty("--cx-bg-tone","var(--
|
|
62
|
+
if(tone){block.dataset.cxTone=tone;block.style.setProperty("--cx-bg-tone",toneVariable(tone,false,"var(--hfx-color-accent,light-dark(#11776f,#37c9b8))"))}
|
|
62
63
|
block.setAttribute("aria-hidden","true");block.title=fill(this.calLabels.calendarCapacityAt,{count:numberFormat(this.lang).format(value)});if(axis.width>=28)setText(block,numberFormat(this.lang).format(value));lane.appendChild(block)});lane.setAttribute("aria-label",lane.getAttribute("aria-label")+ ", "+this.calLabels.calendarCapacity+" "+fill(this.calLabels.calendarCapacityAt,{count:numberFormat(this.lang).format(Math.max(0,...heat))}))},tlHeat(id){if(this.tl.heat.has(id))return this.tl.heat.get(id);const axis=this.tlAxis,units=axis.units,points=[],out=new Array(units.length).fill(0);for(const leaf of[id,...this.tlDescendants(id)])for(const event of this.tlIndex.byResource.get(leaf)||[]){if(event.tlEnd<=axis.from||event.tlStart>=axis.to)continue;points.push([Math.max(event.tlStart,axis.from),1],[Math.max(event.tlEnd,event.tlStart+1),-1])}
|
|
63
64
|
points.sort((a,b)=>a[0]- b[0]||a[1]- b[1]);let level=0,unit=0;for(let i=0;i<points.length;i++){level +=points[i][1];const from=points[i][0],to=i+1<points.length?points[i+1][0]:from;if(to<=from||level<=0)continue;while(unit<units.length-1&&units[unit].end<=from)unit++;for(let at=unit;at<units.length&&units[at].start<to;at++)out[at]=Math.max(out[at],level)}
|
|
64
65
|
this.tl.heat.set(id,out);return out},tlStats(id){const cache=this.tl.stats||=new Map();if(cache.has(id))return cache.get(id);const axis=this.tlAxis,stats={count:0,busy:0,overlaps:0};let end=-Infinity,lastEnd=-Infinity,lastIndex=-1;const overlapped=new Set(),list=(this.tlIndex.byResource.get(id)||[]).filter(event=>event.tlEnd>axis.from&&event.tlStart<axis.to);list.forEach((event,index)=>{const from=Math.max(event.tlStart,axis.from),to=Math.min(event.tlEnd,axis.to);if(to>end){stats.busy +=to-Math.max(from,end);end=to}
|
|
@@ -83,6 +84,6 @@ view.setAttribute("aria-hidden","true");const head=h("div","cx-tl-print-row cx-t
|
|
|
83
84
|
setText(mark,cell.text);scale.appendChild(mark)}
|
|
84
85
|
head.append(corner,scale);view.appendChild(head);for(const row of tree.rows.filter(item=>!item.status).slice(0,TL_PRINT_ROWS)){const line=h("div","cx-tl-print-row"),name=h("div","cx-tl-print-name"),lane=h("div","cx-tl-print-lane"),group=this.tl.children.has(row.key);name.style.paddingInlineStart=(4 +(row.level-1)*12)+ "px";setText(name,this.tlSolo?"":this.calResourceName(row.key));if(group){line.classList.add("cx-tl-print-group");this.tlHeat(row.key).forEach((value,index)=>{if(!value)return;const unit=axis.units[index],mark=h("span","cx-tl-print-heat");mark.style.insetInlineStart=(unit.x / axis.total * 100) + "%"; mark.style.width = (axis.width / axis.total * 100) + "%"; setText(mark, String(value)); lane.appendChild(mark); });
|
|
85
86
|
}else for(const event of this.tlIndex.byResource.get(row.key)||[]){if(event.tlEnd<=axis.from||event.tlStart>=axis.to)continue;const bar=h("span","cx-tl-print-bar");const from=Math.max(event.tlStart,axis.from),to=Math.min(event.tlEnd,axis.to),pixels=(axis.x(to)- axis.x(from))/ axis.total * TL_PRINT_LANE;
|
|
86
|
-
bar.style.insetInlineStart=share(from);bar.style.width="max(6px, calc("+share(to)+ " - "+share(from)+ "))";if(event.tone)bar.style.setProperty("--cx-ev",
|
|
87
|
+
bar.style.insetInlineStart=share(from);bar.style.width="max(6px, calc("+share(to)+ " - "+share(from)+ "))";if(event.tone)bar.style.setProperty("--cx-ev",toneVariable(event.tone,false,"var(--hfx-color-accent,light-dark(#11776f,#37c9b8))"));if(pixels<16)bar.classList.add("cx-tl-print-tiny");if(pixels>=event.title.length*TL_PRINT_CHAR+8)setText(bar,event.title);bar.title=this.calEventName(event);lane.appendChild(bar)}
|
|
87
88
|
line.append(name,lane);view.appendChild(line)}
|
|
88
89
|
this.tlRoot.appendChild(view)}});installed.add(context.DataGrid.prototype)}};(global.CanopyXParts||=[]).push(["timeline",part])})(typeof window!=="undefined"?window:globalThis);
|
|
@@ -1,80 +1,80 @@
|
|
|
1
1
|
/* Graphite chrome shared by flat grids and trees: the card,toolbar,search,buttons,menus,header and cells. */
|
|
2
|
-
.cx-tree-tools{border:var(--cx-size-1px) solid var(--
|
|
2
|
+
.cx-tree-tools{border:var(--cx-size-1px) solid var(--hfx-color-border,light-dark(#e2e4e7,#272a30));border-radius:var(--hfx-radius-container,var(--hfx-radius-lg,10px));overflow:hidden;font:var(--hfx-control-font-size,calc(var(--hfx-type-body-size,0.875rem) - var(--cx-compact,0) * .0625rem))/1.4 var(--hfx-font-sans,"Segoe UI Variable Text","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif);}
|
|
3
3
|
.cx-page > .cx-tree-tools,.cx-page > .cx-main > .cx-tree-tools{padding:0;}
|
|
4
4
|
body .cx-host.cx-tree-tools{padding:0;}
|
|
5
5
|
.cx-tree-tools [hidden]{display:none!important;}
|
|
6
6
|
.cx-tree-tools .cx-grid{border:0;border-radius:0;overflow-anchor:none;}
|
|
7
|
-
.cx-tree-tools .cx-toolbar{flex:none;gap:var(--cx-size-8px);padding:var(--cx-size-10px) var(--cx-size-12px);border-bottom:var(--cx-size-1px) solid var(--
|
|
8
|
-
.cx-tree-tools .cx-search{flex:1 1 var(--cx-size-240px);max-width:var(--cx-size-360px);height:var(--
|
|
7
|
+
.cx-tree-tools .cx-toolbar{flex:none;gap:var(--cx-size-8px);padding:var(--cx-size-10px) var(--cx-size-12px);border-bottom:var(--cx-size-1px) solid var(--hfx-color-border,light-dark(#e2e4e7,#272a30));}
|
|
8
|
+
.cx-tree-tools .cx-search{flex:1 1 var(--cx-size-240px);max-width:var(--cx-size-360px);height:var(--hfx-control-height-md,calc(36px - var(--cx-compact,0) * 8px));display:flex;align-items:center;gap:var(--cx-size-8px);padding:0 var(--cx-size-10px);border:var(--cx-size-1px) solid var(--hfx-color-border-control,light-dark(#8a8f98,#6e737c));border-radius:var(--hfx-radius-control,var(--hfx-radius-md,6px));color:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));background:var(--hfx-color-surface,light-dark(#ffffff,#16181c));min-width:0;}
|
|
9
9
|
.cx-tree-tools .cx-search::before,.cx-tree-tools .cx-search::after{display:none;}
|
|
10
10
|
.cx-tree-tools .cx-search-input{flex:1;min-width:0;width:100%;max-width:none;min-height:0;height:100%;border:0;padding:0;border-radius:0;background:transparent;}
|
|
11
|
-
.cx-tree-tools .cx-search:focus-within{outline:var(--
|
|
11
|
+
.cx-tree-tools .cx-search:focus-within{outline:var(--hfx-focus-width,2px) solid var(--hfx-color-focus-ring,light-dark(#02726a,#37c9b8));outline-offset:var(--hfx-focus-offset,2px);}
|
|
12
12
|
.cx-tree-tools .cx-search .cx-search-input:focus-visible{outline:0;}
|
|
13
|
-
.cx-tree-tools .cx-search kbd{font:var(--cx-size-11px) var(--
|
|
14
|
-
.cx-tree-tools .cx-button,.cx-tree-tools .cx-btn{height:var(--
|
|
13
|
+
.cx-tree-tools .cx-search kbd{font:var(--cx-size-11px) var(--hfx-font-mono,"Cascadia Mono","Cascadia Code",Consolas,"SFMono-Regular",Menlo,monospace);border:var(--cx-size-1px) solid var(--hfx-color-border,light-dark(#e2e4e7,#272a30));border-radius:var(--hfx-radius-control,var(--hfx-radius-md,6px));padding:0 var(--cx-size-5px);}
|
|
14
|
+
.cx-tree-tools .cx-button,.cx-tree-tools .cx-btn{height:var(--hfx-control-height-md,calc(36px - var(--cx-compact,0) * 8px));min-height:var(--hfx-control-height-md,calc(36px - var(--cx-compact,0) * 8px));display:inline-flex;align-items:center;justify-content:center;gap:var(--cx-size-6px);padding:0 var(--cx-size-11px);border:var(--cx-size-1px) solid var(--hfx-color-border-strong,light-dark(#cdd0d5,#363a42));border-radius:var(--hfx-radius-control,var(--hfx-radius-md,6px));background:var(--hfx-color-surface,light-dark(#ffffff,#16181c));color:var(--hfx-color-text,light-dark(#16181c,#f2f3f5));font:var(--hfx-weight-medium,500) var(--hfx-control-font-size,calc(var(--hfx-type-body-size,0.875rem) - var(--cx-compact,0) * .0625rem)) var(--hfx-font-sans,"Segoe UI Variable Text","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif);cursor:pointer;white-space:nowrap;}
|
|
15
15
|
.cx-tree-tools .cx-columns > summary::after{display:none;}
|
|
16
|
-
.cx-tree-tools .cx-button:hover,.cx-tree-tools .cx-btn:hover{background:var(--
|
|
17
|
-
.cx-tree-tools .ghost{border-color:transparent;color:var(--
|
|
18
|
-
.cx-tree-tools .icon{width:var(--
|
|
19
|
-
.cx-tree-tools .active{border-color:var(--
|
|
20
|
-
.cx-tree-tools .badge{min-width:var(--cx-size-18px);height:var(--cx-size-18px);padding:0 var(--cx-size-5px);border-radius:var(--
|
|
16
|
+
.cx-tree-tools .cx-button:hover,.cx-tree-tools .cx-btn:hover{background:var(--hfx-color-hover,light-dark(#f5f5f5,#232529));}
|
|
17
|
+
.cx-tree-tools .ghost{border-color:transparent;color:var(--hfx-color-text-secondary,light-dark(#4d525b,#b0b4bc));}
|
|
18
|
+
.cx-tree-tools .icon{width:var(--hfx-control-height-md,calc(36px - var(--cx-compact,0) * 8px));padding:0;}
|
|
19
|
+
.cx-tree-tools .active{border-color:var(--hfx-color-accent,light-dark(#11776f,#37c9b8));color:var(--hfx-color-accent-text,light-dark(#02726a,#37c9b8));background:var(--hfx-color-accent-subtle,light-dark(#e7f1f1,#1b3435));}
|
|
20
|
+
.cx-tree-tools .badge{min-width:var(--cx-size-18px);height:var(--cx-size-18px);padding:0 var(--cx-size-5px);border-radius:var(--hfx-radius-badge,var(--hfx-radius-sm,4px));background:var(--hfx-color-accent,light-dark(#11776f,#37c9b8));color:var(--hfx-color-accent-contrast,light-dark(#ffffff,#0c0d10));font-size:var(--cx-size-11d5px);font-weight:700;display:inline-grid;place-items:center;}
|
|
21
21
|
.cx-tree-tools .cx-button:disabled{opacity:.4;cursor:default;}
|
|
22
22
|
.cx-spacer{flex:1;}
|
|
23
|
-
.cx-sep{width:var(--cx-size-1px);height:var(--cx-size-20px);background:var(--
|
|
24
|
-
.cx-tree-tools .cx-hrow{height:var(--cx-
|
|
25
|
-
.cx-tree-tools .cx-hcell{padding:0 var(--
|
|
26
|
-
.cx-tree-tools .cx-hcell::after{content:"";position:absolute;right:0;top:var(--cx-size-9px);bottom:var(--cx-size-9px);width:var(--cx-size-1px);background:var(--
|
|
23
|
+
.cx-sep{width:var(--cx-size-1px);height:var(--cx-size-20px);background:var(--hfx-color-border,light-dark(#e2e4e7,#272a30));}
|
|
24
|
+
.cx-tree-tools .cx-hrow{height:var(--hfx-table-header-height,calc(40px - var(--cx-compact,0) * 8px));}
|
|
25
|
+
.cx-tree-tools .cx-hcell{padding:0 var(--hfx-cell-padding-x,calc(12px - var(--cx-compact,0) * 4px));border-right:0;overflow:visible;gap:var(--cx-size-4px);}
|
|
26
|
+
.cx-tree-tools .cx-hcell::after{content:"";position:absolute;right:0;top:var(--cx-size-9px);bottom:var(--cx-size-9px);width:var(--cx-size-1px);background:var(--hfx-color-border,light-dark(#e2e4e7,#272a30));}
|
|
27
27
|
.cx-tree-tools .cx-hcell:last-child::after{display:none;}
|
|
28
28
|
.cx-tree-tools .cx-hcell:last-child .cx-resize{right:0;}
|
|
29
29
|
.cx-tree-tools .cx-hcell .cx-sort{min-width:var(--cx-size-24px);overflow:hidden;}
|
|
30
30
|
.cx-tree-tools .cx-htext{overflow:hidden;text-overflow:ellipsis;}
|
|
31
|
-
.cx-tree-tools .cx-cell{padding:0 var(--
|
|
31
|
+
.cx-tree-tools .cx-cell{padding:0 var(--hfx-cell-padding-x,calc(12px - var(--cx-compact,0) * 4px));font-variant-numeric:tabular-nums;}
|
|
32
32
|
.cx-tree-tools .cx-row > .cx-cell:first-child:not([data-cx-pin]){position:relative;}
|
|
33
|
-
.cx-tree-tools .cx-row[aria-selected="true"] > .cx-cell:first-child::before{content:"";position:absolute;inset:0 auto 0 0;width:var(--cx-size-2px);background:var(--
|
|
34
|
-
.cx-tree-tools .cx-grid-panel{position:fixed;height:auto;color:inherit;width:var(--cx-size-280px);max-width:calc(var(--cx-size-100vw) - var(--cx-size-32px));display:flex;flex-wrap:wrap;gap:var(--cx-size-8px);padding:var(--cx-size-10px) var(--cx-size-12px);border:var(--cx-size-1px) solid var(--
|
|
33
|
+
.cx-tree-tools .cx-row[aria-selected="true"] > .cx-cell:first-child::before{content:"";position:absolute;inset:0 auto 0 0;width:var(--cx-size-2px);background:var(--hfx-color-accent,light-dark(#11776f,#37c9b8));pointer-events:none;z-index:4;}
|
|
34
|
+
.cx-tree-tools .cx-grid-panel{position:fixed;height:auto;color:inherit;width:var(--cx-size-280px);max-width:calc(var(--cx-size-100vw) - var(--cx-size-32px));display:flex;flex-wrap:wrap;gap:var(--cx-size-8px);padding:var(--cx-size-10px) var(--cx-size-12px);border:var(--cx-size-1px) solid var(--hfx-color-border,light-dark(#e2e4e7,#272a30));border-radius:var(--hfx-radius-overlay,var(--hfx-radius-lg,10px));box-shadow:var(--hfx-elevation-2,0 1px 2px rgba(22,24,28,.05),0 6px 18px -10px rgba(22,24,28,.18));}
|
|
35
35
|
.cx-tree-tools .cx-grid-columns > .cx-grid-panel{display:block;width:var(--cx-size-320px);padding:var(--cx-size-8px);max-height:var(--cx-size-420px);overflow:auto;}
|
|
36
36
|
.cx-tree-tools .cx-grid-field{display:flex;flex-direction:column;gap:var(--cx-size-4px);align-items:stretch;min-width:0;}
|
|
37
|
-
.cx-tree-tools .cx-grid-field :is(input:not([type="checkbox"]),select,textarea),.cx-tree-tools .cx-grid-panel > :is(select,input){min-width:0;width:100%;height:var(--
|
|
38
|
-
.cx-grid-control-error{color:var(--
|
|
37
|
+
.cx-tree-tools .cx-grid-field :is(input:not([type="checkbox"]),select,textarea),.cx-tree-tools .cx-grid-panel > :is(select,input){min-width:0;width:100%;height:var(--hfx-control-height-md,calc(36px - var(--cx-compact,0) * 8px));padding:0 var(--cx-size-10px);border:var(--cx-size-1px) solid var(--hfx-color-border-control,light-dark(#8a8f98,#6e737c));border-radius:var(--hfx-radius-control,var(--hfx-radius-md,6px));background:var(--hfx-color-surface,light-dark(#ffffff,#16181c));color:var(--hfx-color-text,light-dark(#16181c,#f2f3f5));font:inherit;}
|
|
38
|
+
.cx-grid-control-error{color:var(--hfx-color-status-bad-fg,light-dark(#b8292a,#f47171));margin:0;width:100%;overflow-wrap:anywhere;}
|
|
39
39
|
.cx-grid-delivery-status{margin:0;font-size:var(--cx-size-d875em);overflow-wrap:anywhere;}
|
|
40
40
|
.cx-grid-delivery-status:empty{display:none;}
|
|
41
|
-
.cx-grid-export progress{width:100%;max-width:100%;accent-color:var(--
|
|
41
|
+
.cx-grid-export progress{width:100%;max-width:100%;accent-color:var(--hfx-color-accent,light-dark(#11776f,#37c9b8));}
|
|
42
42
|
.cx-tree-tools .cx-grid-views .cx-grid-field{width:100%;}
|
|
43
|
-
.cx-tree-tools :is(button,summary,select,input,textarea):focus-visible{outline:var(--
|
|
43
|
+
.cx-tree-tools :is(button,summary,select,input,textarea):focus-visible{outline:var(--hfx-focus-width,2px) solid var(--hfx-color-focus-ring,light-dark(#02726a,#37c9b8));outline-offset:var(--hfx-focus-offset,2px);}
|
|
44
44
|
.cx-tree-tools .cx-grid-overflow .cx-grid-panel{right:0;left:auto;width:var(--cx-size-244px);}
|
|
45
|
-
.cx-tree-tools .cx-grid-overflow .cx-grid-panel > .cx-button{width:100%;justify-content:start;border:0;border-radius:var(--
|
|
45
|
+
.cx-tree-tools .cx-grid-overflow .cx-grid-panel > .cx-button{width:100%;justify-content:start;border:0;border-radius:var(--hfx-radius-control,var(--hfx-radius-md,6px));}
|
|
46
46
|
.cx-tree-tools.cx-phone .cx-toolbar{gap:var(--cx-size-6px);}
|
|
47
47
|
.cx-tree-tools.cx-phone .cx-search{max-width:none;flex-basis:100%;height:var(--cx-size-44px);}
|
|
48
48
|
.cx-tree-tools.cx-phone .cx-spacer,.cx-tree-tools.cx-phone .cx-sep{display:none;}
|
|
49
49
|
.cx-tree-tools.cx-phone .cx-grid-columns > summary{width:var(--cx-size-44px);font-size:0;padding:0;}
|
|
50
50
|
.cx-tree-tools.cx-phone .cx-grid-columns > summary .cx-ico{width:var(--cx-size-16px);height:var(--cx-size-16px);}
|
|
51
51
|
.cx-tree-tools.cx-phone .cx-toolbar :is(.cx-btn,.cx-button){min-height:var(--cx-size-44px);}
|
|
52
|
-
.cx-tree-tools.cx-phone .cx-grid-panel{position:fixed!important;inset:auto 0 0!important;width:100%!important;max-width:100%!important;max-height:var(--cx-size-85vh)!important;overflow:auto;border-radius:var(--
|
|
53
|
-
.cx-tree-tools.cx-phone .cx-grid-panel::before{content:"";display:block;width:var(--cx-size-32px);height:var(--cx-size-4px);border-radius:var(--
|
|
52
|
+
.cx-tree-tools.cx-phone .cx-grid-panel{position:fixed!important;inset:auto 0 0!important;width:100%!important;max-width:100%!important;max-height:var(--cx-size-85vh)!important;overflow:auto;border-radius:var(--hfx-radius-overlay,var(--hfx-radius-lg,10px));z-index:30;}
|
|
53
|
+
.cx-tree-tools.cx-phone .cx-grid-panel::before{content:"";display:block;width:var(--cx-size-32px);height:var(--cx-size-4px);border-radius:var(--hfx-radius-pill,999px);background:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));margin:0 auto var(--cx-size-8px);flex-basis:var(--cx-size-32px);}
|
|
54
54
|
.cx-tree-tools.cx-phone .cx-grid-panel:has(> [open])::before{display:none;}
|
|
55
55
|
.cx-tree-tools.cx-phone .cx-hrow{height:var(--cx-size-44px);}
|
|
56
56
|
.cx-tree-tools.cx-phone .cx-hidden-fields::after{content:"";position:absolute;inset:calc(-1 * var(--cx-size-10px)) calc(-1 * var(--cx-size-8px));}
|
|
57
|
-
.cx-grid-column-choice:hover{background:var(--
|
|
57
|
+
.cx-grid-column-choice:hover{background:var(--hfx-color-hover,light-dark(#f5f5f5,#232529));}
|
|
58
58
|
.cx-grid-column-handle{min-width:var(--cx-size-24px);}
|
|
59
59
|
.cx-grid-column-find{margin-bottom:var(--cx-size-4px);}
|
|
60
|
-
.cx-grid-column-choice{display:flex;align-items:center;border-radius:var(--
|
|
60
|
+
.cx-grid-column-choice{display:flex;align-items:center;border-radius:var(--hfx-radius-sm,4px);}
|
|
61
61
|
.cx-grid-column-choice label{flex:1;min-width:0;white-space:nowrap;}
|
|
62
62
|
.cx-grid-column-name{flex:1;overflow:hidden;text-overflow:ellipsis;}
|
|
63
|
-
:is(.cx-grid-column-note,.cx-grid-column-handle){flex:none;padding:0 var(--cx-size-6px);color:var(--
|
|
63
|
+
:is(.cx-grid-column-note,.cx-grid-column-handle){flex:none;padding:0 var(--cx-size-6px);color:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));font-size:var(--cx-size-12px);white-space:nowrap;}
|
|
64
64
|
.cx-grid-column-handle{height:var(--cx-size-28px);border:0;background:none;cursor:grab;touch-action:none;}
|
|
65
|
-
.cx-grid-column-choice.cx-drop-before{box-shadow:inset 0 var(--cx-size-2px) var(--
|
|
66
|
-
.cx-grid-column-choice.cx-drop-after{box-shadow:inset 0 var(--cx-size-neg-2px) var(--
|
|
67
|
-
.cx-grid-column-actions{display:flex;justify-content:space-between;margin-top:var(--cx-size-4px);padding-top:var(--cx-size-4px);border-top:var(--cx-size-1px) solid var(--
|
|
68
|
-
.cx-grid-column-actions .cx-button{border:0;color:var(--
|
|
69
|
-
.cx-drawer{width:100%;max-width:var(--cx-size-440px);background:var(--
|
|
70
|
-
.cx-drawer-h{display:flex;align-items:flex-start;gap:var(--cx-size-12px);padding:var(--cx-size-14px) var(--cx-size-16px);border-bottom:var(--cx-size-1px) solid var(--
|
|
65
|
+
.cx-grid-column-choice.cx-drop-before{box-shadow:inset 0 var(--cx-size-2px) var(--hfx-color-accent,light-dark(#11776f,#37c9b8));}
|
|
66
|
+
.cx-grid-column-choice.cx-drop-after{box-shadow:inset 0 var(--cx-size-neg-2px) var(--hfx-color-accent,light-dark(#11776f,#37c9b8));}
|
|
67
|
+
.cx-grid-column-actions{display:flex;justify-content:space-between;margin-top:var(--cx-size-4px);padding-top:var(--cx-size-4px);border-top:var(--cx-size-1px) solid var(--hfx-color-border,light-dark(#e2e4e7,#272a30));}
|
|
68
|
+
.cx-grid-column-actions .cx-button{border:0;color:var(--hfx-color-accent-text,light-dark(#02726a,#37c9b8));background:none;}
|
|
69
|
+
.cx-drawer{width:100%;max-width:var(--cx-size-440px);background:var(--hfx-color-surface,light-dark(#ffffff,#16181c));border:var(--cx-size-1px) solid var(--hfx-color-border,light-dark(#e2e4e7,#272a30));border-radius:var(--hfx-radius-overlay,var(--hfx-radius-lg,10px));box-shadow:var(--hfx-elevation-2,0 1px 2px rgba(22,24,28,.05),0 6px 18px -10px rgba(22,24,28,.18));font:var(--cx-size-14px)/1.45 var(--hfx-font-sans,"Segoe UI Variable Text","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif);color:var(--hfx-color-text,light-dark(#16181c,#f2f3f5));overflow:hidden;}
|
|
70
|
+
.cx-drawer-h{display:flex;align-items:flex-start;gap:var(--cx-size-12px);padding:var(--cx-size-14px) var(--cx-size-16px);border-bottom:var(--cx-size-1px) solid var(--hfx-color-border,light-dark(#e2e4e7,#272a30));}
|
|
71
71
|
.cx-drawer-h h4{margin:0;font-size:var(--cx-size-17px);width:fit-content;}
|
|
72
|
-
.cx-drawer-h p{color:var(--
|
|
72
|
+
.cx-drawer-h p{color:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));font-size:var(--cx-size-13px);}
|
|
73
73
|
.cx-drawer-h .cx-btn{margin-left:auto;}
|
|
74
74
|
.cx-dl{display:grid;grid-template-columns:var(--cx-size-140px) 1fr;gap:var(--cx-size-8px) var(--cx-size-16px);padding:var(--cx-size-14px) var(--cx-size-16px);margin:0;}
|
|
75
|
-
.cx-dl dt{color:var(--
|
|
75
|
+
.cx-dl dt{color:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));font-size:var(--cx-size-13px);padding-top:var(--cx-size-1px);}
|
|
76
76
|
.cx-dl dd{margin:0;}
|
|
77
|
-
.cx-drawer-s{padding:var(--cx-size-4px) var(--cx-size-16px) 0;font-size:var(--cx-size-11d5px);letter-spacing:var(--cx-size-d06em);text-transform:uppercase;color:var(--
|
|
77
|
+
.cx-drawer-s{padding:var(--cx-size-4px) var(--cx-size-16px) 0;font-size:var(--cx-size-11d5px);letter-spacing:var(--cx-size-d06em);text-transform:uppercase;color:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));font-weight:700;}
|
|
78
78
|
body .cx-host.cx-drawer{position:fixed;left:auto;right:var(--cx-size-12px);top:var(--cx-size-12px);bottom:var(--cx-size-12px);margin:0;width:calc(100% - var(--cx-size-24px));max-width:var(--cx-size-440px);height:calc(100% - var(--cx-size-24px));padding:0;display:flex;flex-direction:column;z-index:1000;}
|
|
79
79
|
.cx-drawer-body{overflow:auto;flex:1;}
|
|
80
80
|
.cx-drawer .cx-drawer-h > div{flex:1;min-width:0;}
|
|
@@ -83,22 +83,22 @@ body .cx-host.cx-drawer{position:fixed;left:auto;right:var(--cx-size-12px);top:v
|
|
|
83
83
|
.cx-drawer dd{overflow-wrap:anywhere;min-width:0;}
|
|
84
84
|
.cx-drawer .cx-button{flex:none;}
|
|
85
85
|
.cx-drawer :is(.p-strip,.p-spark,.p-line){max-width:100%;}
|
|
86
|
-
body .cx-host.cx-drawer.cx-phone{inset:0;width:100%;max-width:none;height:100%;max-height:none;border-radius:0;}
|
|
86
|
+
body .cx-host.cx-drawer.cx-phone{inset:0;width:100%;max-width:none;height:100%;max-height:none;border-radius:var(--hfx-radius-none,0);}
|
|
87
87
|
.cx-drawer.cx-phone .cx-dl{grid-template-columns:1fr;gap:var(--cx-size-2px) 0;}
|
|
88
88
|
.cx-drawer.cx-phone dd{margin-bottom:var(--cx-size-8px);}
|
|
89
89
|
.cx-drawer.cx-phone .cx-button{min-height:var(--cx-size-44px);min-width:var(--cx-size-44px);}
|
|
90
|
-
.cx-drawer::backdrop{background:
|
|
91
|
-
.cx-grid-overlay{color:var(--
|
|
90
|
+
.cx-drawer::backdrop{background:var(--hfx-color-overlay,light-dark(rgba(22,24,28,0.42),rgba(0,0,0,0.66)));}
|
|
91
|
+
.cx-grid-overlay{color:var(--hfx-color-text,light-dark(#16181c,#f2f3f5));font:var(--hfx-control-font-size,calc(var(--hfx-type-body-size,0.875rem) - var(--cx-compact,0) * .0625rem))/1.45 var(--hfx-font-sans,"Segoe UI Variable Text","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif);}
|
|
92
92
|
body .cx-host.cx-grid-overlay{height:auto;min-height:0;padding:0;}
|
|
93
93
|
.cx-grid-overlay [hidden]{display:none!important;}
|
|
94
94
|
.cx-tree-tools.cx-pin-tree .cx-row > .cx-cell.cx-tree:first-child{position:sticky;}
|
|
95
95
|
.cx-tree-tools .cx-row > [data-cx-pin]{position:sticky;z-index:1;background:inherit;}
|
|
96
|
-
.cx-tree-tools .cx-hcell[data-cx-pin]{position:sticky;z-index:2;background:var(--
|
|
96
|
+
.cx-tree-tools .cx-hcell[data-cx-pin]{position:sticky;z-index:2;background:var(--hfx-table-header-background,var(--hfx-color-surface-sunken,light-dark(#f7f8f9,#111317)));}
|
|
97
97
|
.cx-tree-tools .cx-results{position:fixed;}
|
|
98
|
-
.cx-tree-tools .cx-hcell[aria-sort="ascending"] .cx-sort::after{content:"↑";font-size:var(--cx-size-14px);color:var(--
|
|
99
|
-
.cx-tree-tools .cx-hcell[aria-sort="descending"] .cx-sort::after{content:"↓";font-size:var(--cx-size-14px);color:var(--
|
|
100
|
-
.cx-tree-tools .cx-switch{font-size:var(--cx-size-14px);color:var(--
|
|
101
|
-
.cx-tree-tools .cx-hidden-fields{color:var(--
|
|
102
|
-
.cx-tree-tools.cx-drawer :focus-visible{outline:var(--
|
|
98
|
+
.cx-tree-tools .cx-hcell[aria-sort="ascending"] .cx-sort::after{content:"↑";font-size:var(--cx-size-14px);color:var(--hfx-color-accent,light-dark(#11776f,#37c9b8));}
|
|
99
|
+
.cx-tree-tools .cx-hcell[aria-sort="descending"] .cx-sort::after{content:"↓";font-size:var(--cx-size-14px);color:var(--hfx-color-accent,light-dark(#11776f,#37c9b8));}
|
|
100
|
+
.cx-tree-tools .cx-switch{font-size:var(--cx-size-14px);color:var(--hfx-color-text-secondary,light-dark(#4d525b,#b0b4bc));white-space:nowrap;}
|
|
101
|
+
.cx-tree-tools .cx-hidden-fields{color:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));font:var(--cx-size-12d5px) var(--hfx-font-sans,"Segoe UI Variable Text","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif);border:0;background:transparent;padding:0;flex:none;height:auto;min-height:var(--cx-size-24px);min-width:var(--cx-size-24px);margin-left:var(--cx-size-4px);position:relative;}
|
|
102
|
+
.cx-tree-tools.cx-drawer :focus-visible{outline:var(--hfx-focus-width,2px) solid var(--hfx-color-focus-ring,light-dark(#02726a,#37c9b8));outline-offset:var(--hfx-focus-offset,2px);}
|
|
103
103
|
.cx-tree-tools.cx-drawer [data-cx-pointer-focus]:focus-visible{outline:none;}
|
|
104
|
-
.cx-tree-tools.cx-drawer .p-sub{margin-inline-start:var(--cx-size-6px);color:var(--
|
|
104
|
+
.cx-tree-tools.cx-drawer .p-sub{margin-inline-start:var(--cx-size-6px);color:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));font-size:var(--cx-size-12d5px);}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
(function(global){"use strict";const installed=new WeakSet();const part={version:"
|
|
1
|
+
(function(global){"use strict";const installed=new WeakSet();const part={version:"ee95c5cc39223ef4",install(context){if(installed.has(context.TreeGrid.prototype))return;const{TreeGrid,h,setText,fill,numberFormat,watchFlyout,columnWidth,prepareWidth,cellText,cellValue,isCellObject,foldText,formatting,sortKey,compareKeys,EXPORT_FORMATS,exportFormat,exportTimeout,exportFormatsOf,INDENT,MAX_PROTOCOL_INTEGER,hostControl,detailCell,HostCellContext,disposeHostSlot,loadPart,definePart,pluginItems,applyTone,toneOf,badgeElement,RECORD_IMPL,svgIcon,gridExportField,columnNumericTone,columnValueTone,overlayTheme}=context;const EXPORT_IMPL={formatsOf:exportFormatsOf};const GRID_ICONS={search:'<circle cx="11" cy="11" r="7"/><path d="m20 20-3.5-3.5"/>',filter:'<path d="M4 5h16l-6 7.5V19l-4-2v-4.5z"/>',columns:'<rect x="3.5" y="4.5" width="17" height="15" rx="2"/><path d="M9.5 4.5v15M14.5 4.5v15"/>',views:'<path d="M6 4h12v16l-6-4-6 4z"/>',export:'<path d="M12 4v11M7.5 10.5 12 15l4.5-4.5M5 19h14"/>',more:'<circle cx="5" cy="12" r="1.2"/><circle cx="12" cy="12" r="1.2"/><circle cx="19" cy="12" r="1.2"/>',close:'<path d="M6 6l12 12M18 6 6 18"/>',check:'<path d="m5 12.5 4.5 4.5L19 7.5"/>',chart:'<path d="M4 19h16M7 16V10M12 16V6M17 16v-4"/>',copy:'<rect x="8" y="8" width="11" height="11" rx="2"/><path d="M16 8V6a2 2 0 0 0-2-2H6a2 2 0 0 0-2 2v8a2 2 0 0 0 2 2h2"/>',up:'<path d="M12 19V5M6 11l6-6 6 6"/>',down:'<path d="M12 5v14M6 13l6 6 6-6"/>',retry:'<path d="M4 12a8 8 0 1 0 2.4-5.7M4 4v4.5h4.5"/>',previous:'<path d="m14 7-5 5 5 5"/>',next:'<path d="m10 7 5 5-5 5"/>',first:'<path d="m13 7-5 5 5 5M17 7l-5 5 5 5"/>',last:'<path d="m11 7 5 5-5 5M7 7l5 5-5 5"/>'};function gridIcon(name,shapes){return svgIcon(shapes||GRID_ICONS[name]||GRID_ICONS.more)}
|
|
2
2
|
function gridDecorateButton(button,icon,ghost){button.classList.add("cx-btn");if(ghost)button.classList.add("ghost");if(icon)button.prepend(gridIcon(icon));return button}
|
|
3
3
|
function gridFilterCount(query){const count=group=>group?group.filters.length+group.groups.reduce((sum,child)=>sum+count(child),0):0;return(query?.filters?.length||0)+ count(query?.filterGroup)}
|
|
4
4
|
function gridPriority(value){return["essential","normal","optional"].includes(value)||Number.isInteger(value)&&value>=0&&value<=MAX_PROTOCOL_INTEGER}
|
|
@@ -60,7 +60,7 @@ column.autoSize!==undefined&&!["content","header","none"].includes(column.autoSi
|
|
|
60
60
|
column.pinned!==undefined&&(index?!["left","right",null].includes(column.pinned):column.pinned!==null&&column.pinned!=="left"))throw new Error("CanopyX: invalid tree column layout.")}},startFit(){const identity=this.columns[0];for(const column of this.columns){const declared=this.view.columns.find(item=>item.id===column.id);column.autoWidth=!!(declared.autoWidth||declared.width===undefined);gridFitColumn(column,identity);column.declared=columnWidth(column,declared.width??160);if(this.restoredPin&&column.width!==column.declared)column.sized=true;column.pin=column===identity?"left":this.restoredPin&&column.pin||declared.pinned||"none"}
|
|
61
61
|
this.groupPins();if(identity.pinned!==null&&!this.restoredPin)this.host.classList.add("cx-pin-tree");this.fitReady=true;this.fitRows=null;this.observeFit();this.buildHeader()},observeFit(){let width=0;const observer=new ResizeObserver(()=>requestAnimationFrame(()=>{if(this.destroyed||!this.grid.clientWidth||this.grid.clientWidth===width)return;width=this.grid.clientWidth;this.syncPhone();this.applyWidths();this.heightTotal=undefined;this.scheduleRender()}));observer.observe(this.grid);this.lifetime.signal.addEventListener("abort",()=>observer.disconnect(),{once:true})},visibleColumns(){return TREE_FIT.visibleColumns.call(this).filter(column=>!column.fitHidden)},buildHeader(){if(this.fitReady)this.fitLayout();TREE_FIT.buildHeader.call(this);if(this.fitReady)this.headCells.forEach((cell,index)=>cell.querySelector(".cx-resize").addEventListener("keydown",event=>{if(["ArrowLeft","ArrowRight","Home"].includes(event.key))this.fitManual(this.cols[index])},true))},applyWidths(widths){if(widths||!this.fitReady||!this.cols)return TREE_FIT.applyWidths.call(this,widths);const width=this.grid.clientWidth;this.fitLayout();const visible=this.visibleColumns();if(visible.length!==this.cols.length||visible.some((column,index)=>column!==this.cols[index])){this.buildHeader();this.syncColumnControls();this.version++;this.scheduleRender();return}
|
|
62
62
|
TREE_FIT.applyWidths.call(this,this.fitWidths(this.cols,width))},startResize(event,column){if(!this.destroyed&&!event.button&&this.fitReady)this.fitManual(column);return TREE_FIT.startResize.call(this,event,column)},setColumnWidth(id,width){const column=this.columns.find(item=>item.id===id);if(column&&Number.isFinite(width))column.sized=true;return TREE_FIT.setColumnWidth.call(this,id,width)},fitLayout(){const width=this.grid.clientWidth;if(!width)return;const key=this.layout+":"+this.local+":" +(this.host.clientWidth<=640);if(this.fitRows!==this.rows||this.fitKey!==key){this.fitRows=this.rows;this.fitKey=key;this.measureTreeColumns()}
|
|
63
|
-
const shown=TREE_FIT.visibleColumns.call(this),phone=this.host.clientWidth<=640,identity=this.columns[0];identity.reserve=0;this.fitHide(shown,width,phone);const reserve=()=>{this.fitContext.font="700 12.5px"+this.fitFamily;identity.reserve=Math.max(24,Math.ceil(this.fitContext.measureText("+"+this.hiddenFieldCount()).width))+ 8};if(phone&&this.fitContext&&this.hiddenFieldCount()){reserve();this.fitHide(shown,width,phone);reserve()}},measureTreeColumns(){const context=this.fitContext||=document.createElement("canvas").getContext("2d");if(!context)return;const style=getComputedStyle(this.grid),family=this.fitFamily=" "+style.fontFamily,head=this.headCells?.[0]&&getComputedStyle(this.headCells[0]);const font=style.fontWeight+" "+style.fontSize+family,headFont=(head?head.fontWeight+" "+head.fontSize:"700 13px")+ family;const badgeFont="400 "+parseFloat(style.fontSize)*0.8+"px"+family,pad=parseFloat(
|
|
63
|
+
const shown=TREE_FIT.visibleColumns.call(this),phone=this.host.clientWidth<=640,identity=this.columns[0];identity.reserve=0;this.fitHide(shown,width,phone);const reserve=()=>{this.fitContext.font="700 12.5px"+this.fitFamily;identity.reserve=Math.max(24,Math.ceil(this.fitContext.measureText("+"+this.hiddenFieldCount()).width))+ 8};if(phone&&this.fitContext&&this.hiddenFieldCount()){reserve();this.fitHide(shown,width,phone);reserve()}},measureTreeColumns(){const context=this.fitContext||=document.createElement("canvas").getContext("2d");if(!context)return;const style=getComputedStyle(this.grid),family=this.fitFamily=" "+style.fontFamily,head=this.headCells?.[0]&&getComputedStyle(this.headCells[0]);const font=style.fontWeight+" "+style.fontSize+family,headFont=(head?head.fontWeight+" "+head.fontSize:"700 13px")+ family;const badgeFont="400 "+parseFloat(style.fontSize)*0.8+"px"+family,pad=parseFloat(head?.paddingRight)||12;const numericVariant=gridNumericVariant(this.grid);const text=(value,using=font,numeric=true)=>{context.font=using;return gridMeasureText(context,value,numeric?numericVariant:"normal")};const badges=list=>(list||[]).reduce((sum,badge)=>sum+text(badge.text,badgeFont)+ 20,0);this.fitCh=Math.ceil(text("00000000000"));const rows=[];for(const w of this.rows){if(rows.length===TREE_FIT_ROWS)break;if(!w.status&&!w.h.detail)rows.push(w)}
|
|
64
64
|
const check=this.checkMode?28:0;this.columns.forEach((column,index)=>{const headNeed=Math.ceil(text(column.title,headFont,false)+ 2*pad +(column.sortable?22:8));let values=0,indent=0;if(column.autoSize!=="none"&&column.autoSize!=="header")for(const w of rows){const cell=this.cellOf(w.h,column,index),object=isCellObject(cell);let need=text(cellText(cell,column,this.fmt))+ badges(index===0?w.h.badges:null)+ badges(object?cell.badges:null);const lead=index?0:(w.level-1)*INDENT+22+check +(w.h.icon&&this.iconTemplates.has(w.h.icon)?22:0);if(lead>indent)indent=lead;if(need+lead>values)values=need+lead}
|
|
65
65
|
const cap=index===0?column.maxW:columnWidth(column,420);column.headNeed=Math.min(headNeed,cap);column.indentNeed=indent+2*pad;column.need=Math.max(column.minW,column.autoSize==="none"?column.pref||column.width:Math.min(cap,Math.max(headNeed,Math.ceil(values+2*pad+2))))})},render(){const measured=TREE_FIT.render.call(this);if(this.fitReady&&this.fitRows!==this.rows&&!this.fitPending){this.fitPending=true;requestAnimationFrame(()=>{this.fitPending=false;if(!this.destroyed&&this.fitRows!==this.rows)this.applyWidths()})}
|
|
66
66
|
this.watchHeight();return measured},getState(){const state=TREE_FIT.getState.call(this);state.columns.forEach((saved,index)=>{const column=this.columns[index];if(column.sized)saved.sized=true;if(index)saved.pin=column.pin});return state},readState(state){const result=TREE_FIT.readState.call(this,state);if(result&&result.columns)result.columns.forEach((column,index)=>{if(state.columns[index].sized===true)column.sized=true;if(["none","left","right"].includes(state.columns[index].pin))column.pin=state.columns[index].pin});return result},applyStatePresentation(state){if(state.version&&state.columns){const order=state.columns.map(column=>column.id),rank=column=>{const at=order.indexOf(column.id);return at<0?order.length:at};this.columns=[this.columns[0],...this.columns.slice(1).sort((a,b)=>rank(a)- rank(b))];for(const saved of state.columns){const column=this.columns.find(item=>item.id===saved.id);if(column){column.sized=!!saved.sized||column.declared!==undefined&&saved.width!==column.declared;if(column!==this.columns[0])column.pin=saved.pin??column.pin}}
|
|
@@ -88,7 +88,7 @@ td.appendChild(content.cloneNode(true))}finally{disposeHostSlot(slot)}})});retur
|
|
|
88
88
|
if(!button){button=slot.hiddenFields=gridButton("",()=>this.openDetails(button.dataset.cxRecord).catch(error=>this.emit("error",{error})));button.classList.add("cx-hidden-fields");button.tabIndex=-1;button.addEventListener("click",event=>event.stopPropagation())}
|
|
89
89
|
if(button.parentNode!==slot.cell)slot.cell.appendChild(button);button.dataset.cxRecord=w.h.id;button.setAttribute("aria-label",this.labels.gridDetails);setText(button,"+"+count)},async openDetails(id,options){const node=this.keyMap.get(id)?.h;if(node&&this.recordNeeded(node))await this.requirePart("record-panel");return this.showDetails(id,options)},showDetails(id,options={}){const rows=this.rows.filter(w=>!w.status&&!w.h.detail),returnFocus=options.returnFocus||document.activeElement,labels=this.labels,owner=this.dataLifetime;let index=rows.findIndex(w=>w.key===id);const loose=index<0?options.node||this.keyMap.get(id)?.h:null;if(index<0&&!loose||this.destroyed)throw new Error("CanopyX: open the details of a loaded node.");if(typeof this.opts.onDetails==="function"){const node=JSON.parse(JSON.stringify(loose||rows[index].h)),controller=new AbortController();owner.signal.addEventListener("abort",()=>controller.abort(),{once:true});return Promise.resolve(this.opts.onDetails({node,signal:controller.signal,returnFocus}))}
|
|
90
90
|
if(TREE_DETAILS.active){TREE_DETAILS.active._replaced=true;TREE_DETAILS.active.close();TREE_DETAILS.active.remove()}
|
|
91
|
-
const dialog=TREE_DETAILS.active=this.recordDrawer=h("dialog","cx-host cx-tree-tools cx-drawer"),head=h("div","cx-drawer-h"),title=h("h4"),body=h("div","cx-drawer-body");dialog._returnFocus=returnFocus;
|
|
91
|
+
const dialog=TREE_DETAILS.active=this.recordDrawer=h("dialog","cx-host cx-tree-tools cx-drawer"),head=h("div","cx-drawer-h"),title=h("h4"),body=h("div","cx-drawer-body");dialog._returnFocus=returnFocus;overlayTheme(this.host,dialog);title.id=this.id+"-record-title";title.tabIndex=-1;title.setAttribute("aria-level","2");dialog.setAttribute("aria-labelledby",title.id);const button=(icon,label,run)=>{const item=gridDecorateButton(gridButton("",run),icon,true);item.classList.add("icon");item.setAttribute("aria-label",labels[label]);return item};const step=position=>{paint(position);focusDrawerTitle(title)};const previous=button("up","gridPreviousRecord",()=>step(index-1)),next=button("down","gridNextRecord",()=>step(index+1));head.append(h("div"),previous,next,button("close","gridCloseRecord",()=>dialog.close()));head.firstChild.appendChild(title);dialog.append(head,body);let shown=loose,paints=null;const paint=position=>{if(!loose&&(position<0||position>=rows.length))return;if(!loose){index=position;shown=rows[index].h}
|
|
92
92
|
const node=shown;paints?.abort();paints=new AbortController();setText(title,node.label);dialog._cxRecord=node;dialog.setAttribute("data-cx-record",node.id);dialog.setAttribute("data-cx-view",this.view.id);previous.disabled=!!loose||!index;next.disabled=!!loose||index===rows.length-1;this.paintDrawerBody(node,body,dialog,{index:loose?null:index,signal:paints.signal});dialog.dispatchEvent(new CustomEvent("cx-drawer-paint",{detail:{id:node.id,index:loose?null:index}}))};dialog._cxPaint=node=>{shown=node;paint(index)};dialog.addEventListener("keydown",event=>{if(event.defaultPrevented)return;if(event.key==="Escape"){event.preventDefault();dialog.close()}
|
|
93
93
|
else if((event.key==="ArrowUp"||event.key==="ArrowDown")&&!event.target.matches("input,textarea,select,[role=tab]")&&!event.target.closest(".cx-data-grid,.cx-record-nested")){event.preventDefault();step(index +(event.key==="ArrowUp"?-1:1))}});const close=()=>dialog.close();owner.signal.addEventListener("abort",close,{once:true});dialog.addEventListener("close",()=>{owner.signal.removeEventListener("abort",close);paints?.abort();dialog.remove();if(TREE_DETAILS.active===dialog)TREE_DETAILS.active=null;if(this.recordDrawer!==dialog||this.destroyed)return;this.recordDrawer=null;if(TREE_DETAILS.active||dialog._replaced)return;const key=shown.id,row=this.rows.find(w=>w.key===key);if(returnFocus?.isConnected&&(!returnFocus.dataset.cxRecord||returnFocus.dataset.cxRecord===id))returnFocus.focus({preventScroll:true});else if(row)this.setFocus(row,true);else this.grid.focus({preventScroll:true})},{once:true});RECORD_IMPL.decorate?.(this,dialog,{head,identity:head.firstChild,title,body,options});document.body.appendChild(dialog);const phone=this.host.clientWidth<=640;dialog.classList.toggle("cx-phone",phone);if(phone)dialog.showModal();else dialog.show();paint(index);focusDrawerTitle(title);return dialog},paintDrawerBody(node,body,dialog,context){if(RECORD_IMPL.paint&&this.recordNeeded(node))return RECORD_IMPL.paint(this,node,body,dialog,context);const sections=new Map();body.replaceChildren();this.columns.forEach((column,position)=>{if(!position||column.drawer===false)return;const name=column.section||this.labels.gridDetailsSection;if(!sections.has(name)){const heading=h("div","cx-drawer-s"),list=h("dl","cx-dl");setText(heading,name);sections.set(name,list);body.append(heading,list)}
|
|
94
94
|
const term=h("dt"),value=h("dd");setText(term,column.title);term.setAttribute("data-cx-field",column.id);value.setAttribute("data-cx-field",column.id);this.paintDrawerValue(column,node,value,position,context);sections.get(name).append(term,value)})},paintDrawerValue(column,node,value,position,context){const cell=this.cellOf(node,column,position),object=isCellObject(cell);if(typeof column.render==="function"){try{if(column.render(node,value,{column:column.id,level:1,expanded:false,index:position,signal:context.signal,onDispose:cleanup=>{if(context.signal.aborted)cleanup();else context.signal.addEventListener("abort",cleanup,{once:true})}})===true)return}
|