@evotecit/canopyx 0.3.16 → 0.3.20
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-board.css +50 -0
- package/CanopyX.Html/Assets/canopyx-board.js +39 -0
- package/CanopyX.Html/Assets/canopyx-buckets.js +15 -0
- package/CanopyX.Html/Assets/canopyx-calculations.css +7 -0
- package/CanopyX.Html/Assets/canopyx-calculations.js +52 -0
- package/CanopyX.Html/Assets/canopyx-calendar-edit.js +3 -3
- package/CanopyX.Html/Assets/canopyx-calendar.css +74 -80
- package/CanopyX.Html/Assets/canopyx-calendar.js +26 -31
- package/CanopyX.Html/Assets/canopyx-cell-range.css +4 -4
- package/CanopyX.Html/Assets/canopyx-cell-range.js +16 -14
- package/CanopyX.Html/Assets/canopyx-changes.css +61 -79
- package/CanopyX.Html/Assets/canopyx-changes.js +18 -15
- package/CanopyX.Html/Assets/canopyx-column-groups.css +5 -1
- package/CanopyX.Html/Assets/canopyx-column-groups.js +15 -9
- package/CanopyX.Html/Assets/canopyx-compare.css +37 -0
- package/CanopyX.Html/Assets/canopyx-compare.js +12 -0
- package/CanopyX.Html/Assets/canopyx-data.js +3 -3
- package/CanopyX.Html/Assets/canopyx-detail-rows.css +4 -4
- package/CanopyX.Html/Assets/canopyx-detail-rows.js +1 -1
- package/CanopyX.Html/Assets/canopyx-editing.css +5 -5
- package/CanopyX.Html/Assets/canopyx-editing.js +2 -2
- package/CanopyX.Html/Assets/canopyx-enhance.js +5 -5
- package/CanopyX.Html/Assets/canopyx-export.js +54 -13
- package/CanopyX.Html/Assets/canopyx-facets.css +32 -22
- package/CanopyX.Html/Assets/canopyx-facets.js +19 -15
- package/CanopyX.Html/Assets/canopyx-filter-editor.css +75 -89
- package/CanopyX.Html/Assets/canopyx-filter-editor.js +20 -16
- package/CanopyX.Html/Assets/canopyx-flow-checks.css +3 -3
- package/CanopyX.Html/Assets/canopyx-flow-checks.js +1 -1
- package/CanopyX.Html/Assets/canopyx-flow-command.css +3 -3
- package/CanopyX.Html/Assets/canopyx-flow-command.js +1 -1
- package/CanopyX.Html/Assets/canopyx-flow-dialog.css +4 -4
- package/CanopyX.Html/Assets/canopyx-flow-dialog.js +1 -1
- package/CanopyX.Html/Assets/canopyx-flow-drafts.css +2 -2
- package/CanopyX.Html/Assets/canopyx-flow-drafts.js +1 -1
- package/CanopyX.Html/Assets/canopyx-flow-entry.css +142 -17
- package/CanopyX.Html/Assets/canopyx-flow-entry.js +5 -5
- package/CanopyX.Html/Assets/canopyx-flow-host.css +2 -2
- package/CanopyX.Html/Assets/canopyx-flow-host.js +1 -1
- package/CanopyX.Html/Assets/canopyx-flow-module.mjs +5 -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 +1 -1
- package/CanopyX.Html/Assets/canopyx-flow-preview.js +1 -1
- package/CanopyX.Html/Assets/canopyx-flow-records.css +2 -2
- package/CanopyX.Html/Assets/canopyx-flow-records.js +1 -1
- package/CanopyX.Html/Assets/canopyx-flow-tasks.css +4 -4
- package/CanopyX.Html/Assets/canopyx-flow-tasks.js +1 -1
- package/CanopyX.Html/Assets/canopyx-flow.css +41 -41
- package/CanopyX.Html/Assets/canopyx-flow.js +1 -1
- package/CanopyX.Html/Assets/canopyx-format-editor.css +9 -9
- package/CanopyX.Html/Assets/canopyx-format-editor.js +2 -2
- package/CanopyX.Html/Assets/canopyx-formatting.css +13 -13
- package/CanopyX.Html/Assets/canopyx-formatting.js +12 -11
- package/CanopyX.Html/Assets/canopyx-forms.css +3 -3
- package/CanopyX.Html/Assets/canopyx-forms.js +1 -1
- package/CanopyX.Html/Assets/canopyx-grid-module.mjs +220 -155
- package/CanopyX.Html/Assets/canopyx-grid-options.css +8 -8
- package/CanopyX.Html/Assets/canopyx-grid-options.js +9 -2
- package/CanopyX.Html/Assets/canopyx-grid.css +285 -150
- package/CanopyX.Html/Assets/canopyx-grid.js +220 -155
- package/CanopyX.Html/Assets/canopyx-grouping.css +23 -16
- package/CanopyX.Html/Assets/canopyx-grouping.js +24 -17
- package/CanopyX.Html/Assets/canopyx-highlight.css +10 -10
- package/CanopyX.Html/Assets/canopyx-highlight.js +1 -1
- package/CanopyX.Html/Assets/canopyx-interactive.css +215 -91
- package/CanopyX.Html/Assets/canopyx-interactive.js +47 -52
- package/CanopyX.Html/Assets/canopyx-labels-de.js +177 -9
- package/CanopyX.Html/Assets/canopyx-labels-es.js +177 -9
- package/CanopyX.Html/Assets/canopyx-labels-fr.js +176 -8
- package/CanopyX.Html/Assets/canopyx-labels-it.js +176 -8
- package/CanopyX.Html/Assets/canopyx-labels-pl.js +176 -8
- package/CanopyX.Html/Assets/canopyx-layouts.css +49 -21
- package/CanopyX.Html/Assets/canopyx-layouts.js +36 -14
- package/CanopyX.Html/Assets/canopyx-link.css +3 -3
- package/CanopyX.Html/Assets/canopyx-link.js +4 -4
- package/CanopyX.Html/Assets/canopyx-links.js +2 -2
- package/CanopyX.Html/Assets/canopyx-live.css +3 -5
- package/CanopyX.Html/Assets/canopyx-live.js +3 -3
- package/CanopyX.Html/Assets/canopyx-matrix.css +32 -39
- package/CanopyX.Html/Assets/canopyx-matrix.js +11 -11
- package/CanopyX.Html/Assets/canopyx-module.mjs +47 -52
- package/CanopyX.Html/Assets/canopyx-office-export.js +2936 -0
- package/CanopyX.Html/Assets/canopyx-pager.css +1 -1
- package/CanopyX.Html/Assets/canopyx-pager.js +1 -1
- package/CanopyX.Html/Assets/canopyx-path.css +45 -0
- package/CanopyX.Html/Assets/canopyx-path.js +28 -0
- package/CanopyX.Html/Assets/canopyx-pivot.css +75 -0
- package/CanopyX.Html/Assets/canopyx-pivot.js +72 -0
- package/CanopyX.Html/Assets/canopyx-plan.css +63 -0
- package/CanopyX.Html/Assets/canopyx-plan.js +71 -0
- package/CanopyX.Html/Assets/canopyx-presenters.js +2 -2
- package/CanopyX.Html/Assets/canopyx-record-panel.css +51 -45
- package/CanopyX.Html/Assets/canopyx-record-panel.js +30 -22
- package/CanopyX.Html/Assets/canopyx-reporting-module.mjs +262 -197
- package/CanopyX.Html/Assets/canopyx-reporting.css +300 -164
- package/CanopyX.Html/Assets/canopyx-reporting.js +262 -197
- package/CanopyX.Html/Assets/canopyx-stack.css +35 -0
- package/CanopyX.Html/Assets/canopyx-stack.js +24 -0
- package/CanopyX.Html/Assets/canopyx-time-slider.css +18 -0
- package/CanopyX.Html/Assets/canopyx-time-slider.js +27 -0
- package/CanopyX.Html/Assets/canopyx-timeline.css +19 -19
- package/CanopyX.Html/Assets/canopyx-timeline.js +6 -5
- package/CanopyX.Html/Assets/canopyx-tree-tools.css +47 -46
- package/CanopyX.Html/Assets/canopyx-tree-tools.js +15 -12
- package/CanopyX.Html/Assets/canopyx-ui-menu.css +41 -0
- package/CanopyX.Html/Assets/canopyx-ui-menu.js +64 -0
- package/CanopyX.Html/Assets/canopyx-ui-navigation.css +73 -0
- package/CanopyX.Html/Assets/canopyx-ui-navigation.js +39 -0
- package/CanopyX.Html/Assets/canopyx-ui-overlays.css +79 -0
- package/CanopyX.Html/Assets/canopyx-ui-overlays.js +45 -0
- package/CanopyX.Html/Assets/canopyx-ui-picker.css +12 -0
- package/CanopyX.Html/Assets/canopyx-ui-picker.js +6 -0
- package/CanopyX.Html/Assets/canopyx-ui-stepper.css +174 -0
- package/CanopyX.Html/Assets/canopyx-ui-stepper.js +48 -0
- package/CanopyX.Html/Assets/canopyx-ui-tabs.css +153 -0
- package/CanopyX.Html/Assets/canopyx-ui-tabs.js +47 -0
- package/CanopyX.Html/Assets/canopyx-values.css +5 -0
- package/CanopyX.Html/Assets/canopyx-values.js +13 -0
- package/CanopyX.Html/Assets/canopyx-view-intents.css +12 -0
- package/CanopyX.Html/Assets/canopyx-view-intents.js +56 -0
- package/CanopyX.Html/Assets/canopyx.css +212 -85
- package/CanopyX.Html/Assets/canopyx.js +38 -26
- package/JavaScript/board.d.ts +30 -0
- package/JavaScript/changes.d.ts +4 -1
- package/JavaScript/column-groups.d.ts +24 -4
- package/JavaScript/facets.d.ts +5 -3
- package/JavaScript/grid.d.ts +161 -17
- package/JavaScript/hosts.d.ts +16 -1
- package/JavaScript/index.d.ts +4 -2
- package/JavaScript/locales/de.mjs +177 -9
- package/JavaScript/locales/es.mjs +177 -9
- package/JavaScript/locales/fr.mjs +176 -8
- package/JavaScript/locales/it.mjs +176 -8
- package/JavaScript/locales/pl.mjs +176 -8
- package/JavaScript/matrix.d.ts +4 -1
- package/JavaScript/path.d.ts +33 -0
- package/JavaScript/pivot.d.ts +135 -0
- package/JavaScript/plan.d.ts +23 -0
- package/JavaScript/protocol.d.ts +18 -3
- package/JavaScript/records.d.ts +4 -0
- package/JavaScript/stack.d.ts +28 -0
- package/JavaScript/time-slider.d.ts +58 -0
- package/JavaScript/ui.d.ts +261 -0
- package/JavaScript/view-intents.d.ts +45 -0
- package/README.md +76 -187
- package/README.nuget.md +63 -87
- package/ThirdParty/OfficeIMO/LICENSE +21 -0
- package/ThirdParty/OfficeIMO/README.md +13 -0
- package/package.json +76 -3
|
@@ -1,32 +1,32 @@
|
|
|
1
1
|
/* Flow part: steps,fields,the review page and the result,in the grid's tokens,density and type (docs/flow.md#layouts). */
|
|
2
2
|
.cx-flow{--cx-flow-pad:var(--cx-size-20px);--cx-flow-gap:var(--cx-size-16px);--cx-flow-control:var(--cx-size-34px);
|
|
3
|
-
--cx-size-220px:220px;--cx-size-720px:720px;container-type:inline-size;position:relative;color:var(--hfx-color-text,light-dark(#16181c,#f2f3f5));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-control,var(--hfx-radius-md,6px));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);}
|
|
3
|
+
--cx-size-220px:220px;--cx-size-720px:720px;container-type:inline-size;position:relative;color:var(--hfx-color-text-primary,var(--hfx-color-text,light-dark(#16181c,#f2f3f5)));background:var(--hfx-color-surface-card,var(--hfx-color-surface,light-dark(#ffffff,#16181c)));border:var(--cx-size-1px) solid var(--hfx-color-surface-line,var(--hfx-color-border,light-dark(#e2e4e7,#272a30)));border-radius:var(--hfx-radius-control,var(--hfx-radius-md,6px));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);}
|
|
4
4
|
.cx-flow[data-cx-density="compact"]{--cx-flow-pad:var(--cx-size-14px);--cx-flow-gap:var(--cx-size-12px);--cx-flow-control:var(--cx-size-30px);}
|
|
5
5
|
.cx-flow[data-cx-density="comfortable"]{--cx-flow-pad:var(--cx-size-24px);--cx-flow-gap:var(--cx-size-20px);--cx-flow-control:var(--cx-size-38px);}
|
|
6
6
|
.cx-flow :where(h2,h3,h4,p,ul,ol,dl,dd){margin:0;}
|
|
7
7
|
.cx-flow [hidden]{display:none !important;}
|
|
8
|
-
.cx-flow-head{padding:var(--cx-size-14px) var(--cx-flow-pad);border-bottom:var(--cx-size-1px) solid var(--hfx-color-border,light-dark(#e2e4e7,#272a30));}
|
|
8
|
+
.cx-flow-head{padding:var(--cx-size-14px) var(--cx-flow-pad);border-bottom:var(--cx-size-1px) solid var(--hfx-color-surface-line,var(--hfx-color-border,light-dark(#e2e4e7,#272a30)));}
|
|
9
9
|
.cx-flow-title{font-size:var(--cx-size-17px);font-weight:600;line-height:1.3;}
|
|
10
|
-
.cx-flow-desc{margin-top:var(--cx-size-4px);font-size:var(--cx-size-13px);color:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));}
|
|
10
|
+
.cx-flow-desc{margin-top:var(--cx-size-4px);font-size:var(--cx-size-13px);color:var(--hfx-color-text-secondary,var(--hfx-color-text-muted,light-dark(#626770,#8f949d)));}
|
|
11
11
|
.cx-flow-marks{list-style:none;padding:0;}
|
|
12
|
-
.cx-flow-mark-btn{display:flex;align-items:center;gap:var(--cx-size-10px);width:100%;min-height:var(--cx-size-44px);padding:var(--cx-size-6px) var(--cx-size-8px);border:0;border-radius:var(--hfx-radius-control,var(--hfx-radius-md,6px));background:transparent;color:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));font:inherit;text-align:start;cursor:pointer;}
|
|
12
|
+
.cx-flow-mark-btn{display:flex;align-items:center;gap:var(--cx-size-10px);width:100%;min-height:var(--cx-size-44px);padding:var(--cx-size-6px) var(--cx-size-8px);border:0;border-radius:var(--hfx-radius-control,var(--hfx-radius-md,6px));background:transparent;color:var(--hfx-color-text-secondary,var(--hfx-color-text-muted,light-dark(#626770,#8f949d)));font:inherit;text-align:start;cursor:pointer;}
|
|
13
13
|
.cx-flow-mark-btn:hover{background:var(--hfx-color-hover,light-dark(#f5f5f5,#232529));}
|
|
14
14
|
.cx-flow-mark-btn[aria-disabled="true"]{cursor:default;}
|
|
15
15
|
.cx-flow-mark-btn[aria-disabled="true"]:hover{background:transparent;}
|
|
16
16
|
.cx-flow-mark-btn:focus-visible,.cx-flow :is(.cx-flow-btn,.cx-flow-link,.cx-flow-icon-btn):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);}
|
|
17
17
|
.cx-flow-num{flex:none;display:inline-flex;align-items:center;justify-content:center;width:var(--cx-size-24px);height:var(--cx-size-24px);border:var(--cx-size-1px) solid var(--hfx-color-border-strong,light-dark(#cdd0d5,#363a42));border-radius:50%;
|
|
18
|
-
background:var(--hfx-color-surface,light-dark(#ffffff,#16181c));font-size:var(--cx-size-12d5px);font-weight:600;font-variant-numeric:tabular-nums;color:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));}
|
|
18
|
+
background:var(--hfx-color-surface-card,var(--hfx-color-surface,light-dark(#ffffff,#16181c)));font-size:var(--cx-size-12d5px);font-weight:600;font-variant-numeric:tabular-nums;color:var(--hfx-color-text-secondary,var(--hfx-color-text-muted,light-dark(#626770,#8f949d)));}
|
|
19
19
|
.cx-flow-mark-text{display:flex;flex-direction:column;min-width:0;}
|
|
20
20
|
.cx-flow-mark-title{font-size:var(--cx-size-13d5px);line-height:1.3;overflow-wrap:anywhere;}
|
|
21
|
-
.cx-flow-mark-state{font-size:var(--cx-size-12px);color:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));}
|
|
21
|
+
.cx-flow-mark-state{font-size:var(--cx-size-12px);color:var(--hfx-color-text-secondary,var(--hfx-color-text-muted,light-dark(#626770,#8f949d)));}
|
|
22
22
|
.cx-flow-mark[data-cx-state="current"] .cx-flow-num{background:var(--hfx-color-accent,light-dark(#11776f,#37c9b8));border-color:var(--hfx-color-accent,light-dark(#11776f,#37c9b8));color:var(--hfx-color-accent-contrast,light-dark(#ffffff,#0c0d10));}
|
|
23
|
-
.cx-flow-mark[data-cx-state="current"] .cx-flow-mark-title{color:var(--hfx-color-text,light-dark(#16181c,#f2f3f5));font-weight:600;}
|
|
23
|
+
.cx-flow-mark[data-cx-state="current"] .cx-flow-mark-title{color:var(--hfx-color-text-primary,var(--hfx-color-text,light-dark(#16181c,#f2f3f5)));font-weight:600;}
|
|
24
24
|
.cx-flow-mark[data-cx-state="complete"] .cx-flow-mark-title{color:var(--hfx-color-text-secondary,light-dark(#4d525b,#b0b4bc));}
|
|
25
|
-
.cx-flow-mark[data-cx-state="complete"] .cx-flow-num{color:var(--hfx-color-status-good-fg,light-dark(#177345,#4cc78a));border-color:color-mix(in srgb,var(--hfx-color-status-good-fg,light-dark(#177345,#4cc78a)) 45%,var(--hfx-color-surface,light-dark(#ffffff,#16181c)));}
|
|
25
|
+
.cx-flow-mark[data-cx-state="complete"] .cx-flow-num{color:var(--hfx-color-status-good-fg,light-dark(#177345,#4cc78a));border-color:color-mix(in srgb,var(--hfx-color-status-good-fg,light-dark(#177345,#4cc78a)) 45%,var(--hfx-color-surface-card,var(--hfx-color-surface,light-dark(#ffffff,#16181c))));}
|
|
26
26
|
.cx-flow-mark[data-cx-state="error"] .cx-flow-num{color:var(--hfx-color-status-bad-fg,light-dark(#b8292a,#f47171));border-color:var(--hfx-color-status-bad-fg,light-dark(#b8292a,#f47171));background:var(--hfx-color-status-bad-bg,light-dark(#f9e4e4,#3c272a));}
|
|
27
27
|
.cx-flow-mark[data-cx-state="error"] :is(.cx-flow-mark-title,.cx-flow-mark-state){color:var(--hfx-color-status-bad-fg,light-dark(#b8292a,#f47171));}
|
|
28
28
|
.cx-flow-mark[data-cx-state="locked"]{opacity:.72;}
|
|
29
|
-
.cx-flow-horizontal > .cx-flow-rail{padding:var(--cx-size-8px) calc(var(--cx-flow-pad) - var(--cx-size-8px));border-bottom:var(--cx-size-1px) solid var(--hfx-color-border,light-dark(#e2e4e7,#272a30));background:var(--hfx-color-surface-sunken,light-dark(#f7f8f9,#111317));overflow-x:auto;scrollbar-width:thin;}
|
|
29
|
+
.cx-flow-horizontal > .cx-flow-rail{padding:var(--cx-size-8px) calc(var(--cx-flow-pad) - var(--cx-size-8px));border-bottom:var(--cx-size-1px) solid var(--hfx-color-surface-line,var(--hfx-color-border,light-dark(#e2e4e7,#272a30)));background:var(--hfx-color-surface-sunken,light-dark(#f7f8f9,#111317));overflow-x:auto;scrollbar-width:thin;}
|
|
30
30
|
.cx-flow-horizontal .cx-flow-marks{display:flex;align-items:center;gap:var(--cx-size-4px);min-width:max-content;}
|
|
31
31
|
.cx-flow-horizontal .cx-flow-mark{display:flex;align-items:center;gap:var(--cx-size-4px);}
|
|
32
32
|
.cx-flow-horizontal .cx-flow-mark + .cx-flow-mark::before{content:"";flex:none;width:var(--cx-size-24px);border-top:var(--cx-size-1px) solid var(--hfx-color-border-strong,light-dark(#cdd0d5,#363a42));}
|
|
@@ -35,13 +35,13 @@ background:var(--hfx-color-surface,light-dark(#ffffff,#16181c));font-size:var(--
|
|
|
35
35
|
.cx-flow-horizontal .cx-flow-mark-state:not(.cx-sr-only){display:none;}
|
|
36
36
|
.cx-flow-horizontal .cx-flow-mark[data-cx-state="error"] .cx-flow-mark-state{display:block;}
|
|
37
37
|
.cx-flow-vertical{display:grid;grid-template-columns:minmax(var(--cx-size-180px),var(--cx-size-240px)) minmax(0,1fr);}
|
|
38
|
-
.cx-flow-vertical > .cx-flow-rail{padding:var(--cx-size-12px) var(--cx-size-8px);border-inline-end:var(--cx-size-1px) solid var(--hfx-color-border,light-dark(#e2e4e7,#272a30));background:var(--hfx-color-surface-sunken,light-dark(#f7f8f9,#111317));border-end-start-radius:var(--cx-size-8px);}
|
|
38
|
+
.cx-flow-vertical > .cx-flow-rail{padding:var(--cx-size-12px) var(--cx-size-8px);border-inline-end:var(--cx-size-1px) solid var(--hfx-color-surface-line,var(--hfx-color-border,light-dark(#e2e4e7,#272a30)));background:var(--hfx-color-surface-sunken,light-dark(#f7f8f9,#111317));border-end-start-radius:var(--cx-size-8px);}
|
|
39
39
|
.cx-flow-vertical .cx-flow-marks{display:flex;flex-direction:column;gap:var(--cx-size-2px);}
|
|
40
40
|
.cx-flow-vertical .cx-flow-mark-btn{align-items:flex-start;}
|
|
41
|
-
.cx-flow-vertical .cx-flow-mark-btn[aria-current="step"]{background:var(--hfx-color-surface,light-dark(#ffffff,#16181c));box-shadow:inset 0 0 0 var(--cx-size-1px) var(--hfx-color-border,light-dark(#e2e4e7,#272a30));}
|
|
41
|
+
.cx-flow-vertical .cx-flow-mark-btn[aria-current="step"]{background:var(--hfx-color-surface-card,var(--hfx-color-surface,light-dark(#ffffff,#16181c)));box-shadow:inset 0 0 0 var(--cx-size-1px) var(--hfx-color-surface-line,var(--hfx-color-border,light-dark(#e2e4e7,#272a30)));}
|
|
42
42
|
.cx-flow-single > .cx-flow-rail{display:none;}
|
|
43
43
|
.cx-flow-single .cx-flow-actions{border-end-start-radius:var(--cx-size-8px);}
|
|
44
|
-
.cx-flow-stack .cx-flow-mark{border-bottom:var(--cx-size-1px) solid var(--hfx-color-border,light-dark(#e2e4e7,#272a30));}
|
|
44
|
+
.cx-flow-stack .cx-flow-mark{border-bottom:var(--cx-size-1px) solid var(--hfx-color-surface-line,var(--hfx-color-border,light-dark(#e2e4e7,#272a30)));}
|
|
45
45
|
.cx-flow-stack .cx-flow-mark:last-child{border-bottom:0;}
|
|
46
46
|
.cx-flow-stack .cx-flow-mark-btn{padding:var(--cx-size-8px) var(--cx-flow-pad);border-radius:0;}
|
|
47
47
|
.cx-flow-stack .cx-flow-mark[data-cx-state="current"] > .cx-flow-mark-btn{padding-bottom:var(--cx-size-2px);}
|
|
@@ -52,25 +52,25 @@ background:var(--hfx-color-surface,light-dark(#ffffff,#16181c));font-size:var(--
|
|
|
52
52
|
.cx-flow-stage{padding:var(--cx-size-20px) var(--cx-flow-pad) var(--cx-size-8px);}
|
|
53
53
|
.cx-flow-step{max-width:var(--cx-size-720px);}
|
|
54
54
|
.cx-flow-step-title{font-size:var(--cx-size-16px);font-weight:600;line-height:1.3;outline:none;}
|
|
55
|
-
.cx-flow-step-desc{margin-top:var(--cx-size-4px);color:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));font-size:var(--cx-size-13d5px);}
|
|
55
|
+
.cx-flow-step-desc{margin-top:var(--cx-size-4px);color:var(--hfx-color-text-secondary,var(--hfx-color-text-muted,light-dark(#626770,#8f949d)));font-size:var(--cx-size-13d5px);}
|
|
56
56
|
.cx-flow-step > :is(.cx-flow-block,.cx-flow-section,.cx-flow-summary,.cx-flow-banner,.cx-flow-answer-banner,.cx-flow-review-tools,.cx-flow-review-lists,.cx-flow-declaration,.cx-flow-panel-text,.cx-flow-answers,.cx-flow-links,.cx-flow-bar){margin-top:var(--cx-flow-gap);}
|
|
57
|
-
.cx-flow-section{padding-top:var(--cx-size-4px);border-top:var(--cx-size-1px) solid var(--hfx-color-border,light-dark(#e2e4e7,#272a30));}
|
|
58
|
-
.cx-flow-section-title{padding-top:var(--cx-size-10px);font-size:var(--cx-size-11d5px);font-weight:700;letter-spacing:var(--cx-size-d06em);text-transform:uppercase;color:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));}
|
|
59
|
-
.cx-flow-section-desc{margin-top:var(--cx-size-2px);font-size:var(--cx-size-13px);color:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));}
|
|
57
|
+
.cx-flow-section{padding-top:var(--cx-size-4px);border-top:var(--cx-size-1px) solid var(--hfx-color-surface-line,var(--hfx-color-border,light-dark(#e2e4e7,#272a30)));}
|
|
58
|
+
.cx-flow-section-title{padding-top:var(--cx-size-10px);font-size:var(--cx-size-11d5px);font-weight:700;letter-spacing:var(--cx-size-d06em);text-transform:uppercase;color:var(--hfx-color-text-secondary,var(--hfx-color-text-muted,light-dark(#626770,#8f949d)));}
|
|
59
|
+
.cx-flow-section-desc{margin-top:var(--cx-size-2px);font-size:var(--cx-size-13px);color:var(--hfx-color-text-secondary,var(--hfx-color-text-muted,light-dark(#626770,#8f949d)));}
|
|
60
60
|
.cx-flow-section > .cx-flow-grid{margin-top:var(--cx-size-12px);}
|
|
61
61
|
.cx-flow-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--cx-flow-gap) var(--cx-size-16px);}
|
|
62
62
|
.cx-flow-field{grid-column:1 / -1;min-width:0;}
|
|
63
63
|
.cx-flow-field.cx-flow-half{grid-column:auto;}
|
|
64
64
|
@container (max-width:520px){.cx-flow-field.cx-flow-half{grid-column:1 / -1;}}
|
|
65
|
-
.cx-flow-label{display:block;font-weight:600;font-size:var(--cx-size-13d5px);color:var(--hfx-color-text,light-dark(#16181c,#f2f3f5));}
|
|
66
|
-
.cx-flow-optional{font-weight:400;color:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));}
|
|
67
|
-
.cx-flow-help{margin-top:var(--cx-size-2px);font-size:var(--cx-size-13px);color:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));}
|
|
65
|
+
.cx-flow-label{display:block;font-weight:600;font-size:var(--cx-size-13d5px);color:var(--hfx-color-text-primary,var(--hfx-color-text,light-dark(#16181c,#f2f3f5)));}
|
|
66
|
+
.cx-flow-optional{font-weight:400;color:var(--hfx-color-text-secondary,var(--hfx-color-text-muted,light-dark(#626770,#8f949d)));}
|
|
67
|
+
.cx-flow-help{margin-top:var(--cx-size-2px);font-size:var(--cx-size-13px);color:var(--hfx-color-text-secondary,var(--hfx-color-text-muted,light-dark(#626770,#8f949d)));}
|
|
68
68
|
.cx-flow-control{margin-top:var(--cx-size-6px);}
|
|
69
69
|
.cx-flow-error{margin-top:var(--cx-size-4px);font-size:var(--cx-size-13px);color:var(--hfx-color-status-bad-fg,light-dark(#b8292a,#f47171));}
|
|
70
70
|
.cx-flow .cx-flow-input{box-sizing:border-box;width:100%;max-width:var(--cx-size-440px);min-height:var(--cx-flow-control);height:var(--cx-flow-control);margin:0;padding:0 var(--cx-size-10px);
|
|
71
|
-
font:inherit;color:var(--hfx-color-text,light-dark(#16181c,#f2f3f5));background:var(--hfx-color-surface,light-dark(#ffffff,#16181c));border:var(--cx-size-1px) solid var(--hfx-color-border-control,light-dark(#8a8f98,#6e737c));border-radius:var(--hfx-radius-sm,4px);color-scheme:inherit;}
|
|
71
|
+
font:inherit;color:var(--hfx-color-text-primary,var(--hfx-color-text,light-dark(#16181c,#f2f3f5)));background:var(--hfx-color-surface-card,var(--hfx-color-surface,light-dark(#ffffff,#16181c)));border:var(--cx-size-1px) solid var(--hfx-color-border-control,light-dark(#8a8f98,#6e737c));border-radius:var(--hfx-radius-sm,4px);color-scheme:inherit;}
|
|
72
72
|
.cx-flow-half .cx-flow-input{max-width:100%;}
|
|
73
|
-
.cx-flow .cx-flow-input::placeholder{color:color-mix(in srgb,var(--hfx-color-text,light-dark(#16181c,#f2f3f5)) 60%,var(--hfx-color-surface,light-dark(#ffffff,#16181c)));font-style:italic;opacity:1;}
|
|
73
|
+
.cx-flow .cx-flow-input::placeholder{color:color-mix(in srgb,var(--hfx-color-text-primary,var(--hfx-color-text,light-dark(#16181c,#f2f3f5))) 60%,var(--hfx-color-surface-card,var(--hfx-color-surface,light-dark(#ffffff,#16181c))));font-style:italic;opacity:1;}
|
|
74
74
|
.cx-flow .cx-flow-input:focus-visible{outline:none;border-color:var(--hfx-color-accent,light-dark(#11776f,#37c9b8));box-shadow:0 0 0 var(--cx-size-2px) var(--hfx-color-accent-subtle,light-dark(#e7f1f1,#1b3435));}
|
|
75
75
|
.cx-flow .cx-flow-input[aria-invalid="true"],.cx-flow :not(.cx-flow-list)[aria-invalid="true"] .cx-flow-input{border-color:var(--hfx-color-status-bad-fg,light-dark(#b8292a,#f47171));}
|
|
76
76
|
.cx-flow .cx-flow-input:read-only:not(select){background:var(--hfx-color-surface-sunken,light-dark(#f7f8f9,#111317));color:var(--hfx-color-text-secondary,light-dark(#4d525b,#b0b4bc));}
|
|
@@ -80,25 +80,25 @@ font:inherit;color:var(--hfx-color-text,light-dark(#16181c,#f2f3f5));background:
|
|
|
80
80
|
.cx-flow-toggle{display:flex;align-items:center;gap:var(--cx-size-10px);margin-top:0;}
|
|
81
81
|
.cx-flow-toggle .cx-flow-label{font-weight:500;}
|
|
82
82
|
.cx-flow .cx-flow-toggle input{appearance:none;flex:none;position:relative;width:var(--cx-size-36px);height:var(--cx-size-20px);min-height:0;margin:0;padding:0;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-sunken,light-dark(#f7f8f9,#111317));cursor:pointer;box-shadow:none;}
|
|
83
|
-
.cx-flow .cx-flow-toggle input::after{content:"";position:absolute;inset-block-start:var(--cx-size-2px);inset-inline-start:var(--cx-size-2px);width:var(--cx-size-14px);height:var(--cx-size-14px);border-radius:50%;background:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));}
|
|
83
|
+
.cx-flow .cx-flow-toggle input::after{content:"";position:absolute;inset-block-start:var(--cx-size-2px);inset-inline-start:var(--cx-size-2px);width:var(--cx-size-14px);height:var(--cx-size-14px);border-radius:50%;background:var(--hfx-color-text-secondary,var(--hfx-color-text-muted,light-dark(#626770,#8f949d)));}
|
|
84
84
|
.cx-flow .cx-flow-toggle input:checked{background:var(--hfx-color-accent,light-dark(#11776f,#37c9b8));border-color:var(--hfx-color-accent,light-dark(#11776f,#37c9b8));}
|
|
85
85
|
.cx-flow .cx-flow-toggle input:checked::after{inset-inline-start:calc(100% - var(--cx-size-16px));background:var(--hfx-color-accent-contrast,light-dark(#ffffff,#0c0d10));}
|
|
86
86
|
.cx-flow .cx-flow-toggle input: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);}
|
|
87
87
|
.cx-flow-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,var(--cx-size-220px)),1fr));gap:var(--cx-size-8px);}
|
|
88
|
-
.cx-flow-card{position:relative;display:flex;align-items:flex-start;gap:var(--cx-size-10px);padding:var(--cx-size-10px) var(--cx-size-12px);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));cursor:pointer;}
|
|
88
|
+
.cx-flow-card{position:relative;display:flex;align-items:flex-start;gap:var(--cx-size-10px);padding:var(--cx-size-10px) var(--cx-size-12px);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-card,var(--hfx-color-surface,light-dark(#ffffff,#16181c)));cursor:pointer;}
|
|
89
89
|
.cx-flow-card:hover{background:var(--hfx-color-hover,light-dark(#f5f5f5,#232529));}
|
|
90
|
-
.cx-flow-card:has(input:checked){border-color:var(--hfx-color-accent,light-dark(#11776f,#37c9b8));box-shadow:inset 0 0 0 var(--cx-size-1px) var(--hfx-color-accent,light-dark(#11776f,#37c9b8));background:color-mix(in srgb,var(--hfx-color-accent,light-dark(#11776f,#37c9b8)) 5%,var(--hfx-color-surface,light-dark(#ffffff,#16181c)));}
|
|
90
|
+
.cx-flow-card:has(input:checked){border-color:var(--hfx-color-accent,light-dark(#11776f,#37c9b8));box-shadow:inset 0 0 0 var(--cx-size-1px) var(--hfx-color-accent,light-dark(#11776f,#37c9b8));background:color-mix(in srgb,var(--hfx-color-accent,light-dark(#11776f,#37c9b8)) 5%,var(--hfx-color-surface-card,var(--hfx-color-surface,light-dark(#ffffff,#16181c))));}
|
|
91
91
|
.cx-flow-card:has(input: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);}
|
|
92
92
|
.cx-flow-card .cx-flow-choice-input{position:absolute;opacity:0;width:var(--cx-size-1px);height:var(--cx-size-1px);margin:0;}
|
|
93
93
|
.cx-flow-card-body{display:flex;flex-direction:column;gap:var(--cx-size-2px);flex:1;min-width:0;}
|
|
94
94
|
.cx-flow-card-title{font-weight:600;}
|
|
95
|
-
.cx-flow-card-desc{font-size:var(--cx-size-13px);color:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));}
|
|
95
|
+
.cx-flow-card-desc{font-size:var(--cx-size-13px);color:var(--hfx-color-text-secondary,var(--hfx-color-text-muted,light-dark(#626770,#8f949d)));}
|
|
96
96
|
.cx-flow-card-reason{font-size:var(--cx-size-13px);color:var(--hfx-color-text-secondary,light-dark(#4d525b,#b0b4bc));font-style:italic;}
|
|
97
97
|
.cx-flow-card-check{flex:none;width:var(--cx-size-18px);height:var(--cx-size-18px);margin-top:var(--cx-size-1px);border:var(--cx-size-1px) solid var(--hfx-color-border-control,light-dark(#8a8f98,#6e737c));border-radius:50%;}
|
|
98
|
-
.cx-flow-card:has(input:checked) .cx-flow-card-check{border-color:var(--hfx-color-accent,light-dark(#11776f,#37c9b8));background:var(--hfx-color-accent,light-dark(#11776f,#37c9b8));box-shadow:inset 0 0 0 var(--cx-size-4px) var(--hfx-color-surface,light-dark(#ffffff,#16181c));}
|
|
98
|
+
.cx-flow-card:has(input:checked) .cx-flow-card-check{border-color:var(--hfx-color-accent,light-dark(#11776f,#37c9b8));background:var(--hfx-color-accent,light-dark(#11776f,#37c9b8));box-shadow:inset 0 0 0 var(--cx-size-4px) var(--hfx-color-surface-card,var(--hfx-color-surface,light-dark(#ffffff,#16181c)));}
|
|
99
99
|
.cx-flow-card.cx-flow-disabled,.cx-flow-radio.cx-flow-disabled{cursor:default;opacity:.62;}
|
|
100
|
-
.cx-flow-card.cx-flow-disabled:hover{background:var(--hfx-color-surface,light-dark(#ffffff,#16181c));}
|
|
101
|
-
.cx-flow-badge{display:inline-block;padding:0 var(--cx-size-6px);border-radius:var(--hfx-radius-control,var(--hfx-radius-md,6px));background:var(--hfx-color-surface-sunken,light-dark(#f7f8f9,#111317));border:var(--cx-size-1px) solid var(--hfx-color-border,light-dark(#e2e4e7,#272a30));font-size:var(--cx-size-11d5px);font-weight:600;color:var(--hfx-color-text-secondary,light-dark(#4d525b,#b0b4bc));vertical-align:1px;}
|
|
100
|
+
.cx-flow-card.cx-flow-disabled:hover{background:var(--hfx-color-surface-card,var(--hfx-color-surface,light-dark(#ffffff,#16181c)));}
|
|
101
|
+
.cx-flow-badge{display:inline-block;padding:0 var(--cx-size-6px);border-radius:var(--hfx-radius-control,var(--hfx-radius-md,6px));background:var(--hfx-color-surface-sunken,light-dark(#f7f8f9,#111317));border:var(--cx-size-1px) solid var(--hfx-color-surface-line,var(--hfx-color-border,light-dark(#e2e4e7,#272a30)));font-size:var(--cx-size-11d5px);font-weight:600;color:var(--hfx-color-text-secondary,light-dark(#4d525b,#b0b4bc));vertical-align:1px;}
|
|
102
102
|
.cx-flow-radios,.cx-flow-multi-list{display:flex;flex-direction:column;gap:var(--cx-size-2px);}
|
|
103
103
|
:is(.cx-flow-radio,.cx-flow-check){display:flex;flex-wrap:wrap;align-items:center;gap:var(--cx-size-2px) var(--cx-size-8px);min-height:var(--cx-size-28px);cursor:pointer;}
|
|
104
104
|
:is(.cx-flow-radio,.cx-flow-check) input{flex:none;width:var(--cx-size-16px);height:var(--cx-size-16px);margin:0;accent-color:var(--hfx-color-accent,light-dark(#11776f,#37c9b8));}
|
|
@@ -106,14 +106,14 @@ font:inherit;color:var(--hfx-color-text,light-dark(#16181c,#f2f3f5));background:
|
|
|
106
106
|
.cx-flow-radio .cx-flow-card-title{font-weight:400;}
|
|
107
107
|
.cx-flow-check > .cx-flow-card-desc{flex-basis:100%;padding-inline-start:var(--cx-size-24px);}
|
|
108
108
|
@container (min-width:560px){.cx-flow-multi-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--cx-size-16px);}}
|
|
109
|
-
.cx-flow-multi-group{grid-column:1 / -1;margin-top:var(--cx-size-6px);font-size:var(--cx-size-11d5px);font-weight:700;letter-spacing:var(--cx-size-d06em);text-transform:uppercase;color:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));}
|
|
109
|
+
.cx-flow-multi-group{grid-column:1 / -1;margin-top:var(--cx-size-6px);font-size:var(--cx-size-11d5px);font-weight:700;letter-spacing:var(--cx-size-d06em);text-transform:uppercase;color:var(--hfx-color-text-secondary,var(--hfx-color-text-muted,light-dark(#626770,#8f949d)));}
|
|
110
110
|
.cx-flow-multi-tools{display:flex;flex-wrap:wrap;align-items:center;gap:var(--cx-size-4px) var(--cx-size-14px);margin-top:var(--cx-size-6px);font-size:var(--cx-size-13px);}
|
|
111
|
-
.cx-flow-count{color:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));font-size:var(--cx-size-13px);}
|
|
111
|
+
.cx-flow-count{color:var(--hfx-color-text-secondary,var(--hfx-color-text-muted,light-dark(#626770,#8f949d)));font-size:var(--cx-size-13px);}
|
|
112
112
|
.cx-flow-list-items{display:flex;flex-direction:column;gap:var(--cx-size-6px);list-style:none;padding:0;}
|
|
113
113
|
.cx-flow-list-item{display:flex;gap:var(--cx-size-6px);max-width:var(--cx-size-440px);}
|
|
114
114
|
.cx-flow-list-item .cx-flow-input{flex:1;}
|
|
115
|
-
.cx-flow-icon-btn{flex:none;width:var(--cx-flow-control);height:var(--cx-flow-control);border:var(--cx-size-1px) solid var(--hfx-color-border-strong,light-dark(#cdd0d5,#363a42));border-radius:var(--hfx-radius-sm,4px);background:var(--hfx-color-surface,light-dark(#ffffff,#16181c));color:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));font:inherit;font-size:var(--cx-size-17px);line-height:1;cursor:pointer;}
|
|
116
|
-
.cx-flow-icon-btn:hover{background:var(--hfx-color-hover,light-dark(#f5f5f5,#232529));color:var(--hfx-color-text,light-dark(#16181c,#f2f3f5));}
|
|
115
|
+
.cx-flow-icon-btn{flex:none;width:var(--cx-flow-control);height:var(--cx-flow-control);border:var(--cx-size-1px) solid var(--hfx-color-border-strong,light-dark(#cdd0d5,#363a42));border-radius:var(--hfx-radius-sm,4px);background:var(--hfx-color-surface-card,var(--hfx-color-surface,light-dark(#ffffff,#16181c)));color:var(--hfx-color-text-secondary,var(--hfx-color-text-muted,light-dark(#626770,#8f949d)));font:inherit;font-size:var(--cx-size-17px);line-height:1;cursor:pointer;}
|
|
116
|
+
.cx-flow-icon-btn:hover{background:var(--hfx-color-hover,light-dark(#f5f5f5,#232529));color:var(--hfx-color-text-primary,var(--hfx-color-text,light-dark(#16181c,#f2f3f5)));}
|
|
117
117
|
.cx-flow-list-add{margin-top:var(--cx-size-8px);}
|
|
118
118
|
.cx-flow-secret,.cx-flow-duration{display:flex;gap:var(--cx-size-6px);max-width:var(--cx-size-440px);}
|
|
119
119
|
.cx-flow-secret .cx-flow-input{flex:1;}
|
|
@@ -121,14 +121,14 @@ font:inherit;color:var(--hfx-color-text,light-dark(#16181c,#f2f3f5));background:
|
|
|
121
121
|
.cx-flow .cx-flow-duration .cx-flow-unit{width:auto;max-width:var(--cx-size-180px);}
|
|
122
122
|
.cx-flow-hint{color:var(--hfx-color-text-secondary,light-dark(#4d525b,#b0b4bc));}
|
|
123
123
|
.cx-flow-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--cx-size-6px);height:var(--cx-flow-control);min-height:var(--cx-flow-control);padding:0 var(--cx-size-14px);border:var(--cx-size-1px) solid var(--hfx-color-border-strong,light-dark(#cdd0d5,#363a42));
|
|
124
|
-
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:500 var(--cx-size-14px) var(--hfx-font-sans,"Segoe UI Variable Text","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif);white-space:nowrap;cursor:pointer;}
|
|
124
|
+
border-radius:var(--hfx-radius-control,var(--hfx-radius-md,6px));background:var(--hfx-color-surface-card,var(--hfx-color-surface,light-dark(#ffffff,#16181c)));color:var(--hfx-color-text-primary,var(--hfx-color-text,light-dark(#16181c,#f2f3f5)));font:500 var(--cx-size-14px) var(--hfx-font-sans,"Segoe UI Variable Text","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif);white-space:nowrap;cursor:pointer;}
|
|
125
125
|
.cx-flow-btn:hover{background:var(--hfx-color-hover,light-dark(#f5f5f5,#232529));}
|
|
126
126
|
.cx-flow-btn:disabled{opacity:.5;cursor:default;}
|
|
127
127
|
.cx-flow-btn.cx-primary{background:var(--hfx-color-accent,light-dark(#11776f,#37c9b8));border-color:var(--hfx-color-accent,light-dark(#11776f,#37c9b8));color:var(--hfx-color-accent-contrast,light-dark(#ffffff,#0c0d10));font-weight:600;}
|
|
128
|
-
.cx-flow-btn.cx-primary:hover:not(:disabled){background:color-mix(in srgb,var(--hfx-color-accent,light-dark(#11776f,#37c9b8)) 88%,var(--hfx-color-text,light-dark(#16181c,#f2f3f5)));}
|
|
128
|
+
.cx-flow-btn.cx-primary:hover:not(:disabled){background:color-mix(in srgb,var(--hfx-color-accent,light-dark(#11776f,#37c9b8)) 88%,var(--hfx-color-text-primary,var(--hfx-color-text,light-dark(#16181c,#f2f3f5))));}
|
|
129
129
|
.cx-flow-link{padding:0;border:0;background:none;color:var(--hfx-color-accent-text,light-dark(#02726a,#37c9b8));font:inherit;text-align:start;text-decoration:underline;text-underline-offset:var(--cx-size-2px);cursor:pointer;}
|
|
130
130
|
.cx-flow-link:hover{text-decoration-thickness:var(--cx-size-2px);}
|
|
131
|
-
.cx-flow-actions{position:sticky;bottom:0;z-index:1;display:flex;align-items:center;gap:var(--cx-size-8px);padding:var(--cx-size-12px) var(--cx-flow-pad);border-top:var(--cx-size-1px) solid var(--hfx-color-border,light-dark(#e2e4e7,#272a30));background:var(--hfx-color-surface,light-dark(#ffffff,#16181c));border-end-end-radius:var(--cx-size-8px);}
|
|
131
|
+
.cx-flow-actions{position:sticky;bottom:0;z-index:1;display:flex;align-items:center;gap:var(--cx-size-8px);padding:var(--cx-size-12px) var(--cx-flow-pad);border-top:var(--cx-size-1px) solid var(--hfx-color-surface-line,var(--hfx-color-border,light-dark(#e2e4e7,#272a30)));background:var(--hfx-color-surface-card,var(--hfx-color-surface,light-dark(#ffffff,#16181c)));border-end-end-radius:var(--cx-size-8px);}
|
|
132
132
|
.cx-flow-actions[hidden]{display:none;}
|
|
133
133
|
.cx-flow-spacer{flex:1;}
|
|
134
134
|
.cx-flow-stack .cx-flow-actions{position:static;border-radius:0;}
|
|
@@ -152,16 +152,16 @@ border-radius:var(--hfx-radius-control,var(--hfx-radius-md,6px));background:var(
|
|
|
152
152
|
.cx-flow-review-group + .cx-flow-review-group{margin-top:var(--cx-size-20px);}
|
|
153
153
|
.cx-flow-review-title{padding-bottom:var(--cx-size-6px);border-bottom:var(--cx-size-1px) solid var(--hfx-color-border-strong,light-dark(#cdd0d5,#363a42));font-size:var(--cx-size-14px);font-weight:600;}
|
|
154
154
|
.cx-flow-answers{display:flex;flex-direction:column;}
|
|
155
|
-
.cx-flow-answer{display:grid;grid-template-columns:minmax(var(--cx-size-140px),36%) minmax(0,1fr) auto;gap:var(--cx-size-4px) var(--cx-size-16px);padding:var(--cx-size-8px) 0;border-bottom:var(--cx-size-1px) solid var(--hfx-color-border,light-dark(#e2e4e7,#272a30));}
|
|
156
|
-
.cx-flow-answer dt{color:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));font-size:var(--cx-size-13d5px);}
|
|
155
|
+
.cx-flow-answer{display:grid;grid-template-columns:minmax(var(--cx-size-140px),36%) minmax(0,1fr) auto;gap:var(--cx-size-4px) var(--cx-size-16px);padding:var(--cx-size-8px) 0;border-bottom:var(--cx-size-1px) solid var(--hfx-color-surface-line,var(--hfx-color-border,light-dark(#e2e4e7,#272a30)));}
|
|
156
|
+
.cx-flow-answer dt{color:var(--hfx-color-text-secondary,var(--hfx-color-text-muted,light-dark(#626770,#8f949d)));font-size:var(--cx-size-13d5px);}
|
|
157
157
|
.cx-flow-answer-value{display:flex;flex-direction:column;gap:var(--cx-size-2px);min-width:0;overflow-wrap:anywhere;white-space:pre-line;}
|
|
158
|
-
.cx-flow-empty{color:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));}
|
|
159
|
-
.cx-flow-was{font-size:var(--cx-size-13px);color:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));}
|
|
158
|
+
.cx-flow-empty{color:var(--hfx-color-text-secondary,var(--hfx-color-text-muted,light-dark(#626770,#8f949d)));}
|
|
159
|
+
.cx-flow-was{font-size:var(--cx-size-13px);color:var(--hfx-color-text-secondary,var(--hfx-color-text-muted,light-dark(#626770,#8f949d)));}
|
|
160
160
|
.cx-flow-changed .cx-flow-now{font-weight:600;}
|
|
161
161
|
.cx-flow-answer-action{text-align:end;}
|
|
162
162
|
@container (max-width:520px){.cx-flow-answer{grid-template-columns:minmax(0,1fr) auto;}.cx-flow-answer dt{grid-column:1 / -1;}}
|
|
163
|
-
.cx-flow-declaration{padding:var(--cx-size-10px) 0 0;border-top:var(--cx-size-1px) solid var(--hfx-color-border,light-dark(#e2e4e7,#272a30));color:var(--hfx-color-text-secondary,light-dark(#4d525b,#b0b4bc));font-size:var(--cx-size-13d5px);}
|
|
164
|
-
.cx-flow-none{color:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));}
|
|
163
|
+
.cx-flow-declaration{padding:var(--cx-size-10px) 0 0;border-top:var(--cx-size-1px) solid var(--hfx-color-surface-line,var(--hfx-color-border,light-dark(#e2e4e7,#272a30)));color:var(--hfx-color-text-secondary,light-dark(#4d525b,#b0b4bc));font-size:var(--cx-size-13d5px);}
|
|
164
|
+
.cx-flow-none{color:var(--hfx-color-text-secondary,var(--hfx-color-text-muted,light-dark(#626770,#8f949d)));}
|
|
165
165
|
.cx-flow-panel .cx-flow-step-title{display:flex;align-items:center;gap:var(--cx-size-10px);}
|
|
166
166
|
.cx-flow-panel-mark{display:inline-flex;align-items:center;justify-content:center;width:var(--cx-size-28px);height:var(--cx-size-28px);border-radius:50%;background:var(--hfx-color-status-good-bg,light-dark(#e2f0e9,#1f362f));color:var(--hfx-color-status-good-fg,light-dark(#177345,#4cc78a));font-size:var(--cx-size-14px);}
|
|
167
167
|
.cx-flow-progress .cx-flow-panel-mark{background:var(--hfx-color-accent-subtle,light-dark(#e7f1f1,#1b3435));color:var(--hfx-color-accent-text,light-dark(#02726a,#37c9b8));}
|
|
@@ -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:"02a915fe174e4710",requires:["forms"],install(context){if(installed.has(context.FLOW_IMPL))return;const{FLOW_IMPL,FORMS_IMPL,h,setText,fill,plural,foldText,boundedPattern,numberFormat,gridFreeze}=context;const{editParseNumber,EDIT_EDITORS,formRuleSpec,formCheck,FORM_LABELS}=FORMS_IMPL;const FLOW_LABELS={flowSteps:"Steps",flowStepOf:"Step {current} of {count}",flowStepAnnounce:"Step {current} of {count}, {title}",flowNext:"Next",flowBack:"Back",flowSubmit:"Submit",flowSubmitting:"Submitting…",flowReviewTitle:"Check your answers",flowChange:"Change",flowChangeField:"Change {field}",flowNotProvided:"Not provided",flowOptional:"(optional)",flowStepOptional:"Optional",flowStepComplete:"Complete",flowStepCurrent:"Current step",flowStepErrors:"Errors: {count}",flowStepLocked:"Complete the earlier steps first",flowStepNotStarted:"Not started",flowErrorSummary:"Fix these before you continue",flowReady:"Ready to submit",flowNotReady:"Errors to fix: {count}",flowWarnings:"Warnings: {count}",flowChangesOnly:"Show changes only",flowNoChanges:"No answers have changed.",flowWas:"Was: {value}",flowChangedCount:"Changed answers: {count}",flowSecretSet:"Set",flowSecretKept:"Unchanged",flowSecretNotSet:"Not set",flowSecretHint:"A value is saved. Leave blank to keep it.",flowSecretShow:"Show",flowSecretHide:"Hide",flowSecretReveal:"Show {field}",flowOn:"On",flowOff:"Off",flowAdd:"Add",flowAddItem:"Add to {field}",flowRemoveItem:"Remove {item}",flowItemLabel:"{field}, item {index}",flowSelectAll:"Select all",flowSelectNone:"Clear",flowSelectedCount:"{count} of {total} selected",flowUnit:"Unit",flowUnitSeconds:"seconds",flowUnitMinutes:"minutes",flowUnitHours:"hours",flowUnitDays:"days",flowSeconds:"[one]{count} second[other]{count} seconds",flowMinutes:"[one]{count} minute[other]{count} minutes",flowHours:"[one]{count} hour[other]{count} hours",flowDays:"[one]{count} day[other]{count} days",flowDurationInvalid:"{field} must be a whole number.",flowItemsMin:"{field} needs at least {min}.",flowItemsMax:"{field} allows at most {max}.",flowItemEmail:"“{item}” is not an email address.",flowItemHost:"“{item}” is not a host name.",flowItemIp:"“{item}” is not an IP address.",flowItemCidr:"“{item}” is not a network range.",flowItemUrl:"“{item}” is not a web address.",flowItemPattern:"“{item}” does not have the expected format.",flowSaved:"Saved",flowAccepted:"In progress",flowProgress:"{done} of {total}",flowConflict:"These settings changed while you were editing them.",flowReload:"Reload current settings",flowNotSubmitted:"The answers were not submitted.",flowNoHost:"No host received the answers.",flowStartAgain:"Start another",flowCopy:"Copy",flowCopied:"Copied",flowSavedIt:"I have saved it",flowShownOnce:"Shown only once. Copy it now."};function flowLabels(...sources){const labels={...FORM_LABELS,...FLOW_LABELS};for(const source of sources){if(source==null)continue;if(!flowIs(source))flowFail("labels must be an object of strings");for(const[name,text]of Object.entries(source)){if(!Object.hasOwn(labels,name))continue;if(typeof text!=="string"||!/\S/.test(text)) flowFail("label '" + name + "' must be a string with visible text");
|
|
2
2
|
labels[name]=text}}
|
|
3
3
|
return Object.freeze(labels)}
|
|
4
4
|
const FLOW_NAME=/^[A-Za-z][A-Za-z0-9_-]{0,63}$/;
|
|
@@ -1,17 +1,17 @@
|
|
|
1
|
-
.cx-format-editor{width:calc(100% - var(--cx-size-32px));max-width:var(--cx-size-720px,720px);max-height:var(--cx-size-85vh);padding:0;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));background:var(--hfx-color-surface,light-dark(#ffffff,#16181c));box-shadow:var(--hfx-elevation-2,0 1px 2px rgba(22,24,28,.05),0 6px 18px -10px rgba(22,24,28,.18));flex-direction:column;overflow:hidden;}
|
|
1
|
+
.cx-format-editor{width:calc(100% - var(--cx-size-32px));max-width:var(--cx-size-720px,720px);max-height:var(--cx-size-85vh);padding:0;border:var(--cx-size-1px) solid var(--hfx-color-surface-line,var(--hfx-color-border,light-dark(#e2e4e7,#272a30)));border-radius:var(--hfx-radius-control,var(--hfx-radius-md,6px));background:var(--hfx-color-surface-card,var(--hfx-color-surface,light-dark(#ffffff,#16181c)));box-shadow:var(--hfx-elevation-2,0 1px 2px rgba(22,24,28,.05),0 6px 18px -10px rgba(22,24,28,.18));flex-direction:column;overflow:hidden;}
|
|
2
2
|
.cx-format-editor[open]{display:flex;}
|
|
3
3
|
body .cx-host.cx-grid-overlay.cx-format-editor{height:fit-content;}
|
|
4
4
|
.cx-format-editor::backdrop{background:var(--hfx-color-overlay,light-dark(rgba(22,24,28,0.42),rgba(0,0,0,0.66)));}
|
|
5
|
-
.cx-format-editor .cx-drawer-h{display:flex;align-items:center;gap:var(--cx-size-12px);padding:var(--cx-size-12px) var(--cx-size-16px);border-bottom:var(--cx-size-1px) solid var(--hfx-color-border,light-dark(#e2e4e7,#272a30));}
|
|
5
|
+
.cx-format-editor .cx-drawer-h{display:flex;align-items:center;gap:var(--cx-size-12px);padding:var(--cx-size-12px) var(--cx-size-16px);border-bottom:var(--cx-size-1px) solid var(--hfx-color-surface-line,var(--hfx-color-border,light-dark(#e2e4e7,#272a30)));}
|
|
6
6
|
.cx-format-editor .cx-drawer-h h4{margin:0;flex:1;font-size:var(--cx-size-17px);}
|
|
7
7
|
.cx-format-body{flex:0 1 auto;min-height:0;overflow:auto;padding:var(--cx-size-14px) var(--cx-size-16px);}
|
|
8
8
|
.cx-format-editor > .cx-grid-control-error{margin:0;padding:0 var(--cx-size-16px) var(--cx-size-8px);}
|
|
9
9
|
.cx-format-editor > .cx-pop-f{gap:var(--cx-size-12px);flex-wrap:wrap;}
|
|
10
10
|
.cx-format-editor .cx-pop-f > .cx-format-legend-switch{margin-right:auto;font-size:var(--cx-size-13px);}
|
|
11
11
|
.cx-format-editor .cx-pop-f > .cx-link{border:0;background:transparent;color:var(--hfx-color-accent,light-dark(#11776f,#37c9b8));font-weight:600;}
|
|
12
|
-
.cx-format-editor .cx-muted{color:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));}
|
|
12
|
+
.cx-format-editor .cx-muted{color:var(--hfx-color-text-secondary,var(--hfx-color-text-muted,light-dark(#626770,#8f949d)));}
|
|
13
13
|
.cx-format-rules{list-style:none;margin:0;padding:0;display:grid;gap:var(--cx-size-2px);}
|
|
14
|
-
.cx-format-item{display:grid;grid-template-columns:auto auto minmax(0,1fr) auto;align-items:center;gap:var(--cx-size-10px);padding:var(--cx-size-6px) var(--cx-size-4px);border-bottom:var(--cx-size-1px) solid var(--hfx-color-border,light-dark(#e2e4e7,#272a30));}
|
|
14
|
+
.cx-format-item{display:grid;grid-template-columns:auto auto minmax(0,1fr) auto;align-items:center;gap:var(--cx-size-10px);padding:var(--cx-size-6px) var(--cx-size-4px);border-bottom:var(--cx-size-1px) solid var(--hfx-color-surface-line,var(--hfx-color-border,light-dark(#e2e4e7,#272a30)));}
|
|
15
15
|
.cx-format-item input[type="checkbox"]{width:var(--cx-size-16px);height:var(--cx-size-16px);margin:0;accent-color:var(--hfx-color-accent,light-dark(#11776f,#37c9b8));}
|
|
16
16
|
.cx-format-item-text{display:grid;min-width:0;}
|
|
17
17
|
.cx-format-item-text > *{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
|
|
@@ -19,22 +19,22 @@ body .cx-host.cx-grid-overlay.cx-format-editor{height:fit-content;}
|
|
|
19
19
|
.cx-format-actions{display:flex;gap:var(--cx-size-4px);}
|
|
20
20
|
.cx-format-editor .cx-button.icon{width:var(--hfx-control-height-md,calc(36px - var(--cx-compact,0) * 8px));min-width:var(--hfx-control-height-md,calc(36px - var(--cx-compact,0) * 8px));padding:0;display:inline-grid;place-items:center;}
|
|
21
21
|
.cx-format-editor .cx-button:disabled{opacity:.45;cursor:default;}
|
|
22
|
-
.cx-format-editor .cx-format-swatch{position:relative;isolation:isolate;display:inline-grid;place-items:center;min-width:var(--cx-size-24px);height:var(--cx-size-20px);border-radius:var(--hfx-radius-sm,4px);border:var(--cx-size-1px) solid var(--hfx-color-border,light-dark(#e2e4e7,#272a30));font-size:var(--cx-size-12px);color:var(--cx-fmt,var(--hfx-color-text-secondary,light-dark(#4d525b,#b0b4bc)));}
|
|
23
|
-
.cx-format-editor .cx-format-swatch.cx-fmt-fill{background:color-mix(in srgb,var(--cx-fmt) 13%,var(--hfx-color-surface,light-dark(#ffffff,#16181c)));border-color:color-mix(in srgb,var(--cx-fmt) 35%,var(--hfx-color-surface,light-dark(#ffffff,#16181c)));}
|
|
22
|
+
.cx-format-editor .cx-format-swatch{position:relative;isolation:isolate;display:inline-grid;place-items:center;min-width:var(--cx-size-24px);height:var(--cx-size-20px);border-radius:var(--hfx-radius-sm,4px);border:var(--cx-size-1px) solid var(--hfx-color-surface-line,var(--hfx-color-border,light-dark(#e2e4e7,#272a30)));font-size:var(--cx-size-12px);color:var(--cx-fmt,var(--hfx-color-text-secondary,light-dark(#4d525b,#b0b4bc)));}
|
|
23
|
+
.cx-format-editor .cx-format-swatch.cx-fmt-fill{background:color-mix(in srgb,var(--cx-fmt) 13%,var(--hfx-color-surface-card,var(--hfx-color-surface,light-dark(#ffffff,#16181c))));border-color:color-mix(in srgb,var(--cx-fmt) 35%,var(--hfx-color-surface-card,var(--hfx-color-surface,light-dark(#ffffff,#16181c))));}
|
|
24
24
|
.cx-format-editor .cx-format-swatch.cx-fmt-gradient{width:var(--cx-size-36px);background:var(--cx-fmt-scale);opacity:.6;}
|
|
25
25
|
.cx-format-editor .cx-format-swatch.cx-fmt-barred{width:var(--cx-size-36px);padding:0 var(--cx-size-3px);}
|
|
26
26
|
.cx-format-editor .cx-format-swatch .cx-fmt-bar{width:100%;max-width:none;}
|
|
27
27
|
.cx-format-form.cx-fb{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--cx-size-12px) var(--cx-size-16px);max-width:none;}
|
|
28
28
|
.cx-format-editor .cx-format-field{display:grid;align-items:start;gap:var(--cx-size-4px);min-width:0;font-size:var(--cx-size-13px);color:var(--hfx-color-text-secondary,light-dark(#4d525b,#b0b4bc));}
|
|
29
|
-
.cx-format-field > .cx-input{color:var(--hfx-color-text,light-dark(#16181c,#f2f3f5));font-size:var(--cx-size-14px);}
|
|
29
|
+
.cx-format-field > .cx-input{color:var(--hfx-color-text-primary,var(--hfx-color-text,light-dark(#16181c,#f2f3f5)));font-size:var(--cx-size-14px);}
|
|
30
30
|
.cx-format-form > :is(.cx-format-kinds,.cx-format-columns,.cx-format-when,.cx-format-conditions,.cx-format-style){grid-column:1/-1;}
|
|
31
31
|
.cx-format-kind{justify-self:start;max-width:100%;flex-wrap:wrap;}
|
|
32
32
|
.cx-format-editor .cx-fb .cx-format-kind button{text-transform:none;}
|
|
33
33
|
.cx-format-editor h4:focus{outline:none;}
|
|
34
|
-
.cx-format-columns{display:flex;flex-wrap:wrap;gap:var(--cx-size-6px) var(--cx-size-16px);margin:0;padding:var(--cx-size-8px) var(--cx-size-10px);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));font-size:var(--cx-size-13px);}
|
|
34
|
+
.cx-format-columns{display:flex;flex-wrap:wrap;gap:var(--cx-size-6px) var(--cx-size-16px);margin:0;padding:var(--cx-size-8px) var(--cx-size-10px);border:var(--cx-size-1px) solid var(--hfx-color-surface-line,var(--hfx-color-border,light-dark(#e2e4e7,#272a30)));border-radius:var(--hfx-radius-control,var(--hfx-radius-md,6px));font-size:var(--cx-size-13px);}
|
|
35
35
|
.cx-format-columns legend{padding:0 var(--cx-size-4px);color:var(--hfx-color-text-secondary,light-dark(#4d525b,#b0b4bc));}
|
|
36
36
|
.cx-format-editor .cx-format-when{display:flex;align-items:center;gap:var(--cx-size-8px);font-weight:600;}
|
|
37
|
-
.cx-format-conditions{display:grid;gap:var(--cx-size-8px);padding:var(--cx-size-10px);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));}
|
|
37
|
+
.cx-format-conditions{display:grid;gap:var(--cx-size-8px);padding:var(--cx-size-10px);border:var(--cx-size-1px) solid var(--hfx-color-surface-line,var(--hfx-color-border,light-dark(#e2e4e7,#272a30)));border-radius:var(--hfx-radius-control,var(--hfx-radius-md,6px));}
|
|
38
38
|
.cx-format-style{display:grid;grid-template-columns:repeat(auto-fit,minmax(var(--cx-size-140px),1fr));gap:var(--cx-size-10px) var(--cx-size-12px);align-items:end;}
|
|
39
39
|
.cx-format-bands{grid-column:1/-1;display:grid;gap:var(--cx-size-8px);}
|
|
40
40
|
.cx-format-band{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1.4fr) var(--hfx-control-height-md,calc(36px - var(--cx-compact,0) * 8px));gap:var(--cx-size-8px);align-items:end;}
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
(function(global){"use strict";const installed=new WeakSet();const part={version:"
|
|
1
|
+
(function(global){"use strict";const installed=new WeakSet();const part={version:"97085e181fbc1cf7",requires:["filter-editor","formatting"],install(context){if(installed.has(context.DataGrid.prototype))return;const{DataGrid,h,setText,fill,gridButton,gridVariant,gridOption,gridDateInputMoment,gridInputLabel,gridIcon,gridDecorateButton,announceMenu,formatCompile,formatToneVar,formatError,FORMAT_ICONS,FORMAT_TONE_ICONS,FORMAT_OPERATORS,svgIcon,overlayTheme}=context;const FORMAT_EDITOR_LABELS={formatRule:"Rule {number}",formatAddRule:"Add rule",formatEditRule:"Edit {rule}",formatDeleteRule:"Delete {rule}",formatMoveUp:"Move {rule} up",formatMoveDown:"Move {rule} down",formatEnableRule:"Apply {rule}",formatNoRules:"No formatting rules.",formatName:"Name",formatDescription:"Screen reader description",formatOnlyRowsWhere:"Only rows where",formatEveryRow:"Every row",formatNone:"None",formatApplyTo:"Apply to",formatTargetCell:"Cell",formatTargetRow:"Whole row",formatTargetColumns:"Chosen columns",formatStyle:"Style",formatHighlight:"Highlight",formatDataBar:"Data bar",formatColorScale:"Colour scale",formatBands:"Threshold bands",formatTone:"Tone",formatEmphasis:"Emphasis",formatFill:"Fill",formatTextOnly:"Text colour",formatStrong:"Bold fill",formatIcon:"Icon",formatNoIcon:"No icon",formatAutomatic:"Automatic",formatBadge:"Badge",formatCue:"Text cue",formatLowest:"Lowest",formatMidpoint:"Midpoint",formatHighest:"Highest",formatAddBand:"+ Band",formatRemoveBand:"Remove band",formatSave:"Save rule",formatCancel:"Cancel",formatShowLegend:"Show legend",formatInvalid:"Complete the rule before saving.",formatMatchCase:"Match case",formatToneDanger:"Danger",formatToneWarning:"Warning",formatToneSuccess:"Success",formatToneInfo:"Info",formatToneNeutral:"Neutral",formatToneMuted:"Muted",formatNotContains:"does not contain",formatEndsWith:"ends with",formatNotIn:"is none of",formatBetween:"between",formatLike:"matches wildcard",formatMatches:"matches pattern",formatOlderThan:"older than (days)",formatWithinLast:"within the last (days)",formatNotLike:"does not match wildcard",formatNotMatches:"does not match pattern",formatBetweenExclusive:"between (exclusive)"};function formatIconButton(label,icon,run){const button=gridDecorateButton(gridButton("",run),icon==="edit"?"more":icon,true);if(icon==="edit")button.querySelector("svg").replaceWith(svgIcon('<path d="M4 20h4L19 9l-4-4L4 16zM13.5 6.5l4 4"/>'));button.classList.add("icon");button.setAttribute("aria-label",label);button.title=label;return button}
|
|
2
2
|
function formatPreview(style){const swatch=h("span","cx-format-swatch"),stops=style.scale?style.scale.stops.map(stop=>stop.tone):style.bands?style.bands.map(band=>band.tone):null;swatch.setAttribute("aria-hidden","true");if(stops){swatch.classList.add("cx-fmt-gradient");swatch.style.setProperty("--cx-fmt-scale","linear-gradient(90deg,"+stops.map(formatToneVar).join(",")+ ")")}
|
|
3
3
|
else if(style.bar){swatch.classList.add("cx-fmt-barred");const bar=h("span","cx-fmt-bar");bar.style.setProperty("--cx-fmt-w","70%");bar.style.setProperty("--cx-fmt",formatToneVar(style.bar.tone||"info"));swatch.appendChild(bar)}
|
|
4
4
|
else if(style.tone){swatch.classList.add("cx-fmt-fill");swatch.style.setProperty("--cx-fmt",formatToneVar(style.tone));const name=!style.icon||style.icon==="auto"?FORMAT_TONE_ICONS[style.tone]||"dot":style.icon;if(name!=="none")setText(swatch,FORMAT_ICONS[name]||name)}else if(style.badge)setText(swatch,style.badge.slice(0,2));return swatch}
|
|
5
5
|
Object.assign(DataGrid.prototype,{showFormatEditor(){this.formatEditor?.close();if(!this.formatLabels.formatAddRule){const own={};for(const name of Object.keys(FORMAT_EDITOR_LABELS))own[name]=Object.hasOwn(this.labels,name)?this.labels[name]:FORMAT_EDITOR_LABELS[name];this.formatLabels={...this.formatLabels,...own}}
|
|
6
6
|
const labels=this.formatLabels,returnFocus=document.activeElement,phone=this.host.clientWidth<=640;const dialog=h("dialog","cx-host cx-grid-overlay cx-format-editor"),head=h("div","cx-drawer-h"),title=h("h4"),body=h("div","cx-format-body"),status=h("p","cx-grid-control-error"),foot=h("div","cx-pop-f");overlayTheme(this.host,dialog);dialog.classList.toggle("cx-phone",phone);title.id=this.id+"-format-title";title.tabIndex=-1;setText(title,labels.formatRules);dialog.setAttribute("aria-labelledby",title.id);status.setAttribute("role","status");head.append(title,formatIconButton(labels.formatCancel,"close",()=>dialog.close()));dialog.append(head,body,status,foot);document.body.appendChild(dialog);this.formatEditor=dialog;const editor={dialog,body,foot,status,title,rules:JSON.parse(JSON.stringify(this.getFormatRules()))};editor.apply=()=>this.setFormatRules(editor.rules).then(()=>{setText(status,"");return true},error=>{setText(status,error.message);return false});editor.list=focus=>this.renderFormatList(editor,focus);dialog.addEventListener("keydown",event=>{if(event.key==="Escape"){event.preventDefault();event.stopPropagation();if(editor.back)editor.back();else dialog.close()}});dialog.addEventListener("close",()=>{dialog.remove();if(this.formatEditor===dialog)this.formatEditor=null;if(!this.destroyed)(returnFocus?.isConnected&&returnFocus.checkVisibility?.()?returnFocus:this.grid).focus({preventScroll:true})},{once:true});const owner=new AbortController();this.lifetime.signal.addEventListener("abort",()=>dialog.close(),{once:true,signal:owner.signal});dialog.addEventListener("close",()=>owner.abort(),{once:true});announceMenu(dialog);dialog.showModal();editor.list();title.focus({preventScroll:true});return dialog},renderFormatList(editor,focus){const labels=this.formatLabels,{body,foot,rules}=editor,name=(rule,index)=>rule.label||fill(labels.formatRule,{number:index+1});editor.back=null;setText(editor.title,labels.formatRules);body.replaceChildren();foot.replaceChildren();const list=h("ol","cx-format-rules");list.setAttribute("aria-label",labels.formatRules);const change=(mutate,next)=>{mutate();editor.apply().then(ok=>{if(!ok)editor.rules=JSON.parse(JSON.stringify(this.getFormatRules()));editor.list(next)})};rules.forEach((rule,index)=>{const item=h("li","cx-format-item"),toggle=h("input"),text=h("span","cx-format-item-text"),title=h("b"),summary=h("span","cx-muted"),actions=h("span","cx-format-actions");const label=name(rule,index);toggle.type="checkbox";toggle.checked=rule.enabled!==false;toggle.setAttribute("aria-label",fill(labels.formatEnableRule,{rule:label}));toggle.addEventListener("change",()=>change(()=>{if(toggle.checked)delete rule.enabled;else rule.enabled=false},"toggle:"+index));setText(title,label);setText(summary,this.formatSummary(rule));text.append(title,summary);const move=(by,key)=>()=>change(()=>rules.splice(index+by,0,rules.splice(index,1)[0]),key+":" +(index+by));const up=formatIconButton(fill(labels.formatMoveUp,{rule:label}),"up",move(-1,"up")),down=formatIconButton(fill(labels.formatMoveDown,{rule:label}),"down",move(1,"down"));up.disabled=index===0;down.disabled=index===rules.length-1;const edit=formatIconButton(fill(labels.formatEditRule,{rule:label}),"edit",()=>this.renderFormatRule(editor,index));edit.dataset.cxFocus="edit:"+index;const remove=formatIconButton(fill(labels.formatDeleteRule,{rule:label}),"close",()=>change(()=>rules.splice(index,1),"add"));toggle.dataset.cxFocus="toggle:"+index;up.dataset.cxFocus="up:"+index;down.dataset.cxFocus="down:"+index;actions.append(up,down,edit,remove);item.append(toggle,formatPreview(rule.style||{}),text,actions);list.appendChild(item)});if(rules.length)body.appendChild(list);else{const empty=h("p","cx-muted");setText(empty,labels.formatNoRules);body.appendChild(empty)}
|
|
7
|
-
const add=gridButton(labels.formatAddRule,()=>this.renderFormatRule(editor,-1));add.classList.add("cx-link");add.dataset.cxFocus="add";add.disabled=rules.length>=64;const legend=h("input"),legendLabel=gridInputLabel(labels.formatShowLegend,legend);legend.type="checkbox";legend.checked=!!this.formatLegendShown;legendLabel.classList.add("cx-format-legend-switch");legend.addEventListener("change",()=>this.setFormatLegend(legend.checked));const done=gridButton(this.labels.gridDone,()=>editor.dialog.close());foot.append(add,legendLabel,done);const target=focus&&editor.dialog.querySelector('[data-cx-focus="'+focus+'"]');if(target&&!target.disabled)target.focus({preventScroll:true});else if(focus)add.focus({preventScroll:true})},formatSummary(rule){const labels=this.formatLabels,title=id=>this.columns.find(column=>column.id===id)?.title||id,style=rule.style||{};const target=rule.target==="row"?labels.formatTargetRow:rule.target==="columns"?(rule.columns||[]).map(title).join(", "):labels.formatTargetCell+" · "+title(rule.column);const kind=style.bar?labels.formatDataBar:style.scale?labels.formatColorScale:style.bands?labels.formatBands:labels.formatHighlight;return[target,kind,rule.when?null:labels.formatEveryRow].filter(Boolean).join(" · ")}});const FORMAT_TONES=["danger","warning","success","info","neutral","muted"];function formatField(text,control,className){const label=control.tagName==="DIV"?h("div"):gridInputLabel(text,control);if(control.tagName==="DIV"){const heading=h("span");setText(heading,text);heading.setAttribute("aria-hidden","true");label.append(heading,control)}
|
|
7
|
+
const add=gridButton(labels.formatAddRule,()=>this.renderFormatRule(editor,-1));add.classList.add("cx-link");add.dataset.cxFocus="add";add.disabled=rules.length>=64;const legend=h("input"),legendLabel=gridInputLabel(labels.formatShowLegend,legend);legend.type="checkbox";legend.checked=!!this.formatLegendShown;legendLabel.classList.add("cx-format-legend-switch");legend.addEventListener("change",()=>this.setFormatLegend(legend.checked));const done=gridVariant(gridButton(this.labels.gridDone,()=>editor.dialog.close()),"primary");foot.append(add,legendLabel,done);const target=focus&&editor.dialog.querySelector('[data-cx-focus="'+focus+'"]');if(target&&!target.disabled)target.focus({preventScroll:true});else if(focus)add.focus({preventScroll:true})},formatSummary(rule){const labels=this.formatLabels,title=id=>this.columns.find(column=>column.id===id)?.title||id,style=rule.style||{};const target=rule.target==="row"?labels.formatTargetRow:rule.target==="columns"?(rule.columns||[]).map(title).join(", "):labels.formatTargetCell+" · "+title(rule.column);const kind=style.bar?labels.formatDataBar:style.scale?labels.formatColorScale:style.bands?labels.formatBands:labels.formatHighlight;return[target,kind,rule.when?null:labels.formatEveryRow].filter(Boolean).join(" · ")}});const FORMAT_TONES=["danger","warning","success","info","neutral","muted"];function formatField(text,control,className){const label=control.tagName==="DIV"?h("div"):gridInputLabel(text,control);if(control.tagName==="DIV"){const heading=h("span");setText(heading,text);heading.setAttribute("aria-hidden","true");label.append(heading,control)}
|
|
8
8
|
label.classList.add("cx-format-field");if(className)label.classList.add(className);if(control.tagName==="SELECT"||control.tagName==="INPUT"&&control.type!=="checkbox")control.classList.add("cx-input");return label}
|
|
9
9
|
function formatSelect(options,value){const select=h("select");for(const[key,text]of options)select.appendChild(gridOption(key,text));if(value!==undefined&&options.some(option=>option[0]===value))select.value=value;return select}
|
|
10
10
|
function formatNumberInput(value,placeholder){const input=h("input");input.type="number";input.step="any";if(placeholder)input.placeholder=placeholder;if(value!==undefined&&value!==null)input.value=String(value);return input}
|
|
@@ -1,30 +1,30 @@
|
|
|
1
|
-
.cx-data-grid .cx-row .cx-cell.cx-fmt-fill,.cx-data-grid .cx-row .cx-cell.cx-fmt-strong{background-color:color-mix(in srgb,var(--cx-fmt) 13%,var(--hfx-color-surface,light-dark(#ffffff,#16181c)));color:color-mix(in srgb,var(--cx-fmt) 82%,var(--hfx-color-text,light-dark(#16181c,#f2f3f5)));}
|
|
1
|
+
.cx-data-grid .cx-row .cx-cell.cx-fmt-fill,.cx-data-grid .cx-row .cx-cell.cx-fmt-strong{background-color:color-mix(in srgb,var(--cx-fmt) 13%,var(--hfx-color-surface-card,var(--hfx-color-surface,light-dark(#ffffff,#16181c))));color:color-mix(in srgb,var(--cx-fmt) 82%,var(--hfx-color-text-primary,var(--hfx-color-text,light-dark(#16181c,#f2f3f5))));}
|
|
2
2
|
.cx-data-grid .cx-row .cx-cell.cx-fmt-strong{font-weight:600;}
|
|
3
|
-
.cx-data-grid .cx-row .cx-cell.cx-fmt-text{color:color-mix(in srgb,var(--cx-fmt) 82%,var(--hfx-color-text,light-dark(#16181c,#f2f3f5)));}
|
|
4
|
-
.cx-data-grid .cx-row .cx-cell.cx-fmt-scale{background-color:color-mix(in srgb,var(--cx-fmt-scale) 18%,var(--hfx-color-surface,light-dark(#ffffff,#16181c)));}
|
|
5
|
-
.cx-data-grid .cx-row.cx-fmt-row,.cx-data-grid .cx-row.cx-fmt-row [data-cx-pin]{background:color-mix(in srgb,var(--cx-fmt) 8%,var(--hfx-color-surface,light-dark(#ffffff,#16181c)));}
|
|
6
|
-
.cx-data-grid .cx-row.cx-fmt-row:hover,.cx-data-grid .cx-row.cx-fmt-row:hover [data-cx-pin]{background:color-mix(in srgb,var(--cx-fmt) 12%,var(--hfx-color-surface,light-dark(#ffffff,#16181c)));}
|
|
3
|
+
.cx-data-grid .cx-row .cx-cell.cx-fmt-text{color:color-mix(in srgb,var(--cx-fmt) 82%,var(--hfx-color-text-primary,var(--hfx-color-text,light-dark(#16181c,#f2f3f5))));}
|
|
4
|
+
.cx-data-grid .cx-row .cx-cell.cx-fmt-scale{background-color:color-mix(in srgb,var(--cx-fmt-scale) 18%,var(--hfx-color-surface-card,var(--hfx-color-surface,light-dark(#ffffff,#16181c))));}
|
|
5
|
+
.cx-data-grid .cx-row.cx-fmt-row,.cx-data-grid .cx-row.cx-fmt-row [data-cx-pin]{background:color-mix(in srgb,var(--cx-fmt) 8%,var(--hfx-color-surface-card,var(--hfx-color-surface,light-dark(#ffffff,#16181c))));}
|
|
6
|
+
.cx-data-grid .cx-row.cx-fmt-row:hover,.cx-data-grid .cx-row.cx-fmt-row:hover [data-cx-pin]{background:color-mix(in srgb,var(--cx-fmt) 12%,var(--hfx-color-surface-card,var(--hfx-color-surface,light-dark(#ffffff,#16181c))));}
|
|
7
7
|
.cx-data-grid .cx-row.cx-fmt-row[aria-selected="true"],.cx-data-grid .cx-row.cx-fmt-row[aria-selected="true"] [data-cx-pin]{background:var(--hfx-color-accent-subtle,light-dark(#e7f1f1,#1b3435));}
|
|
8
8
|
.cx-data-grid .cx-row.cx-fmt-row > .cx-cell:first-child{box-shadow:inset var(--cx-size-3px) 0 0 var(--cx-fmt);}
|
|
9
|
-
.cx-fmt-bar{flex:1 1 var(--cx-size-24px);min-width:var(--cx-size-24px);max-width:var(--cx-size-180px);height:var(--cx-size-8px);border-radius:var(--hfx-radius-control,var(--hfx-radius-md,6px));overflow:hidden;background:color-mix(in srgb,var(--hfx-color-text,light-dark(#16181c,#f2f3f5)) 9%,transparent);pointer-events:none;}
|
|
10
|
-
.cx-fmt-bar::before{content:"";display:block;width:var(--cx-fmt-w);height:100%;border-radius:inherit;background:color-mix(in srgb,var(--cx-fmt) 78%,var(--hfx-color-surface,light-dark(#ffffff,#16181c)));}
|
|
9
|
+
.cx-fmt-bar{flex:1 1 var(--cx-size-24px);min-width:var(--cx-size-24px);max-width:var(--cx-size-180px);height:var(--cx-size-8px);border-radius:var(--hfx-radius-control,var(--hfx-radius-md,6px));overflow:hidden;background:color-mix(in srgb,var(--hfx-color-text-primary,var(--hfx-color-text,light-dark(#16181c,#f2f3f5))) 9%,transparent);pointer-events:none;}
|
|
10
|
+
.cx-fmt-bar::before{content:"";display:block;width:var(--cx-fmt-w);height:100%;border-radius:inherit;background:color-mix(in srgb,var(--cx-fmt) 78%,var(--hfx-color-surface-card,var(--hfx-color-surface,light-dark(#ffffff,#16181c))));}
|
|
11
11
|
.cx-fmt-novalue > .cx-text{position:absolute;width:var(--cx-size-1px);height:var(--cx-size-1px);overflow:hidden;clip:rect(0 0 0 0);}
|
|
12
12
|
.cx-fmt-icon{flex:none;color:var(--cx-fmt,currentColor);font-weight:700;line-height:1;}
|
|
13
13
|
.cx-fmt-badge{flex:none;}
|
|
14
14
|
.cx-fmt-cue{flex:none;color:var(--hfx-color-text-secondary,light-dark(#4d525b,#b0b4bc));font-size:var(--cx-size-12d5px);}
|
|
15
15
|
.cx-data-grid .cx-hidden-fields.cx-fmt-flag{color:var(--cx-fmt);font-weight:700;text-decoration:underline var(--cx-size-2px) var(--cx-fmt);text-underline-offset:var(--cx-size-3px);}
|
|
16
16
|
.cx-drawer dd:is(.cx-fmt-fill,.cx-fmt-strong,.cx-fmt-scale){display:flex;flex-wrap:wrap;align-items:center;gap:var(--cx-size-6px);margin:var(--cx-size-neg-2px) 0;padding:var(--cx-size-2px) var(--cx-size-6px);border-radius:var(--hfx-radius-sm,4px);}
|
|
17
|
-
.cx-drawer dd.cx-fmt-fill,.cx-drawer dd.cx-fmt-strong{background:color-mix(in srgb,var(--cx-fmt) 13%,var(--hfx-color-surface,light-dark(#ffffff,#16181c)));color:color-mix(in srgb,var(--cx-fmt) 82%,var(--hfx-color-text,light-dark(#16181c,#f2f3f5)));}
|
|
17
|
+
.cx-drawer dd.cx-fmt-fill,.cx-drawer dd.cx-fmt-strong{background:color-mix(in srgb,var(--cx-fmt) 13%,var(--hfx-color-surface-card,var(--hfx-color-surface,light-dark(#ffffff,#16181c))));color:color-mix(in srgb,var(--cx-fmt) 82%,var(--hfx-color-text-primary,var(--hfx-color-text,light-dark(#16181c,#f2f3f5))));}
|
|
18
18
|
.cx-drawer dd.cx-fmt-strong{font-weight:600;}
|
|
19
|
-
.cx-drawer dd.cx-fmt-text{color:color-mix(in srgb,var(--cx-fmt) 82%,var(--hfx-color-text,light-dark(#16181c,#f2f3f5)));}
|
|
20
|
-
.cx-drawer dd.cx-fmt-scale{background:color-mix(in srgb,var(--cx-fmt-scale) 18%,var(--hfx-color-surface,light-dark(#ffffff,#16181c)));}
|
|
19
|
+
.cx-drawer dd.cx-fmt-text{color:color-mix(in srgb,var(--cx-fmt) 82%,var(--hfx-color-text-primary,var(--hfx-color-text,light-dark(#16181c,#f2f3f5))));}
|
|
20
|
+
.cx-drawer dd.cx-fmt-scale{background:color-mix(in srgb,var(--cx-fmt-scale) 18%,var(--hfx-color-surface-card,var(--hfx-color-surface,light-dark(#ffffff,#16181c))));}
|
|
21
21
|
.cx-drawer dd:has(> .cx-fmt-icon,> .cx-fmt-cue,> .cx-fmt-badge,> .cx-fmt-bar){display:flex;flex-wrap:wrap;align-items:center;gap:var(--cx-size-6px);}
|
|
22
|
-
.cx-drawer .cx-drawer-h.cx-fmt-accent{box-shadow:inset var(--cx-size-3px) 0 0 var(--cx-fmt);background:color-mix(in srgb,var(--cx-fmt) 8%,var(--hfx-color-surface,light-dark(#ffffff,#16181c)));}
|
|
22
|
+
.cx-drawer .cx-drawer-h.cx-fmt-accent{box-shadow:inset var(--cx-size-3px) 0 0 var(--cx-fmt);background:color-mix(in srgb,var(--cx-fmt) 8%,var(--hfx-color-surface-card,var(--hfx-color-surface,light-dark(#ffffff,#16181c))));}
|
|
23
23
|
.cx-drawer .cx-drawer-h > .cx-fmt-icon{margin-top:var(--cx-size-4px);font-size:var(--cx-size-17px);}
|
|
24
24
|
.cx-format-legend{flex:none;display:flex;flex-wrap:wrap;align-items:center;gap:var(--cx-size-6px) var(--cx-size-16px);margin:0 0 var(--cx-size-8px);padding:0;list-style:none;font-size:var(--cx-size-12d5px);color:var(--hfx-color-text-secondary,light-dark(#4d525b,#b0b4bc));}
|
|
25
25
|
.cx-format-key{display:inline-flex;align-items:center;gap:var(--cx-size-6px);min-width:0;}
|
|
26
|
-
.cx-format-swatch{position:relative;isolation:isolate;display:inline-grid;place-items:center;flex:none;min-width:var(--cx-size-18px);height:var(--cx-size-18px);border-radius:var(--hfx-radius-sm,4px);border:var(--cx-size-1px) solid var(--hfx-color-border,light-dark(#e2e4e7,#272a30));font-size:var(--cx-size-11px);}
|
|
27
|
-
.cx-format-swatch.cx-fmt-fill,.cx-format-swatch.cx-fmt-strong,.cx-format-swatch.cx-fmt-text{background:color-mix(in srgb,var(--cx-fmt) 13%,var(--hfx-color-surface,light-dark(#ffffff,#16181c)));border-color:color-mix(in srgb,var(--cx-fmt) 35%,var(--hfx-color-surface,light-dark(#ffffff,#16181c)));}
|
|
26
|
+
.cx-format-swatch{position:relative;isolation:isolate;display:inline-grid;place-items:center;flex:none;min-width:var(--cx-size-18px);height:var(--cx-size-18px);border-radius:var(--hfx-radius-sm,4px);border:var(--cx-size-1px) solid var(--hfx-color-surface-line,var(--hfx-color-border,light-dark(#e2e4e7,#272a30)));font-size:var(--cx-size-11px);}
|
|
27
|
+
.cx-format-swatch.cx-fmt-fill,.cx-format-swatch.cx-fmt-strong,.cx-format-swatch.cx-fmt-text{background:color-mix(in srgb,var(--cx-fmt) 13%,var(--hfx-color-surface-card,var(--hfx-color-surface,light-dark(#ffffff,#16181c))));border-color:color-mix(in srgb,var(--cx-fmt) 35%,var(--hfx-color-surface-card,var(--hfx-color-surface,light-dark(#ffffff,#16181c))));}
|
|
28
28
|
.cx-format-swatch.cx-fmt-gradient{width:var(--cx-size-36px);background:var(--cx-fmt-scale);opacity:.55;}
|
|
29
29
|
.cx-format-swatch.cx-fmt-barred{width:var(--cx-size-36px);padding:0 var(--cx-size-3px);}
|
|
30
30
|
.cx-format-swatch .cx-fmt-bar{width:100%;max-width:none;}
|
|
@@ -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:"0feff4e3424599e9",install(context){if(installed.has(context.DataGrid.prototype))return;const{toneVariable,DataGrid,h,setText,setClass,fill,gridFreeze,gridDateInputMoment,cellValue,cellText,foldText,toneOf,numberFormat,gridButton,gridVariant,gridOption,gridInputLabel,gridIcon,gridDecorateButton,GRID_REPORTING,loadPart,definePart,announceMenu,boundedPattern,wildcardMatch,svgIcon,overlayTheme}=context;const FORMAT_OPERATORS={eq:1,ne:1,gt:1,ge:1,lt:1,le:1,contains:1,notContains:1,startsWith:1,endsWith:1,like:1,notLike:1,matches:1,notMatches:1,in:-1,notIn:-1,between:2,betweenExclusive:2,isNull:0,isNotNull:0,olderThan:1,withinLast:1};const FORMAT_TYPES=["text","number","boolean","date"],FORMAT_DAY=86400000;function formatError(message){throw new Error("CanopyX: "+message)}
|
|
2
2
|
function formatKeys(value,keys,what){if(!value||typeof value!=="object"||Array.isArray(value)||Object.keys(value).some(key=>!keys.includes(key)))formatError("invalid "+what+".")}
|
|
3
3
|
const formatCultures=new Map();function formatCulture(culture){let entry=formatCultures.get(culture);if(!entry){let tag;try{tag=Intl.getCanonicalLocales(culture)[0]}catch(_){formatError("unknown culture '"+culture+"'.")}
|
|
4
4
|
const parts=new Intl.NumberFormat(tag).formatToParts(12345.6),part=type=>(parts.find(item=>item.type===type)||{}).value;entry={tag,group:part("group")||",",decimal:part("decimal")||".",accent:new Intl.Collator(tag,{sensitivity:"accent"}),variant:new Intl.Collator(tag,{sensitivity:"variant"})};if(formatCultures.size<64)formatCultures.set(culture,entry)}
|
|
@@ -17,11 +17,11 @@ formatError("invalid formatting condition.");const patterned=op==="like"||op==="
|
|
|
17
17
|
formatError("formatting condition '"+op+"' has the wrong number of values.");if(values.some(value=>!(typeof value==="string"&&value.length<=4096||typeof value==="boolean"||Number.isFinite(value))))
|
|
18
18
|
formatError("condition values are text, finite numbers or booleans.");const culture=predicate.culture?formatCulture(predicate.culture):null,exact=!!predicate.caseSensitive;const type=op==="olderThan"||op==="withinLast"?"date":predicate.type||(column.kind==="number"?"number":column.kind==="datetime"?"date":null);if((op==="olderThan"||op==="withinLast")&&!(typeof values[0]==="number"&&values[0]>=0&&values[0]<=36500))
|
|
19
19
|
formatError("relative dates take a number of days from 0 to 36500.");const text=value=>typeof value==="string"?exact?value:culture?value.toLocaleLowerCase(culture.tag):foldText(value):value;const read=(cells,id)=>text(formatCoerce(cellValue(cells[id]),type,culture));const collator=culture&&(exact?culture.variant:culture.accent);const order=(a,b)=>typeof a==="string"&&typeof b==="string"&&collator?collator.compare(a,b):a<b?-1:a>b?1:0;let operands=[],pattern=null;if(patterned){const source=String(values[0]);if(source.length>256)formatError("patterns have at most 256 characters.");try{pattern=op==="like"||op==="notLike"?{test:value=>wildcardMatch(source,value,exact)}:boundedPattern(source,exact)}
|
|
20
|
-
catch(_){formatError("invalid pattern '"+source+"'.")}}else if(op==="olderThan"||op==="withinLast")operands=[values[0]*FORMAT_DAY];else operands=values.map(value=>{const typed=text(formatCoerce(value,type,culture));if(typed===null)formatError("value '"+value+"' does not convert to " +(type||"text")+ ".");return typed});if((op==="between"||op==="betweenExclusive")&&order(operands[0],operands[1])>0)formatError("a range starts with its lower value.");const id=column.id,otherId=other&&other.id,set=arity<0&&!collator?new Set(operands):null;const member=value=>set?set.has(value):operands.some(operand=>typeof operand===typeof value&&order(value,operand)===0);budget.relative||=op==="olderThan"||op==="withinLast";return row=>{const value=read(row.cells,id);if(op==="isNull")return value===null;if(op==="isNotNull"||value===null)return op==="isNotNull"&&value!==null;const operand=other?read(row.cells,otherId):operands[0];if(operand===null)return false;switch(op){case "eq":return order(value,operand)===0&&typeof value===typeof operand;case "ne":return!(order(value,operand)===0&&typeof value===typeof operand);case "gt":return order(value,operand)>0;case "ge":return order(value,operand)>=0;case "lt":return order(value,operand)<0;case "le":return order(value,operand)<=0;case "in":return member(value);case "notIn":return!member(value);case "between":return order(value,operand)>=0&&order(value,operands[1])<=0;case "betweenExclusive":return order(value,operand)>0&&order(value,operands[1])<0;case "contains":return String(value).includes(String(operand));case "notContains":return!String(value).includes(String(operand));case "startsWith":return String(value).startsWith(String(operand));case "endsWith":return String(value).endsWith(String(operand));case "like":case "matches":return pattern.test(String(value).slice(0,4096));case "notLike":case "notMatches":return!pattern.test(String(value).slice(0,4096));case "olderThan":return value<
|
|
20
|
+
catch(_){formatError("invalid pattern '"+source+"'.")}}else if(op==="olderThan"||op==="withinLast")operands=[values[0]*FORMAT_DAY];else operands=values.map(value=>{const typed=text(formatCoerce(value,type,culture));if(typed===null)formatError("value '"+value+"' does not convert to " +(type||"text")+ ".");return typed});if((op==="between"||op==="betweenExclusive")&&order(operands[0],operands[1])>0)formatError("a range starts with its lower value.");const id=column.id,otherId=other&&other.id,set=arity<0&&!collator?new Set(operands):null;const member=value=>set?set.has(value):operands.some(operand=>typeof operand===typeof value&&order(value,operand)===0);budget.relative||=op==="olderThan"||op==="withinLast";return row=>{const value=read(row.cells,id);if(op==="isNull")return value===null;if(op==="isNotNull"||value===null)return op==="isNotNull"&&value!==null;const operand=other?read(row.cells,otherId):operands[0];if(operand===null)return false;switch(op){case "eq":return order(value,operand)===0&&typeof value===typeof operand;case "ne":return!(order(value,operand)===0&&typeof value===typeof operand);case "gt":return order(value,operand)>0;case "ge":return order(value,operand)>=0;case "lt":return order(value,operand)<0;case "le":return order(value,operand)<=0;case "in":return member(value);case "notIn":return!member(value);case "between":return order(value,operand)>=0&&order(value,operands[1])<=0;case "betweenExclusive":return order(value,operand)>0&&order(value,operands[1])<0;case "contains":return String(value).includes(String(operand));case "notContains":return!String(value).includes(String(operand));case "startsWith":return String(value).startsWith(String(operand));case "endsWith":return String(value).endsWith(String(operand));case "like":case "matches":return pattern.test(String(value).slice(0,4096));case "notLike":case "notMatches":return!pattern.test(String(value).slice(0,4096));case "olderThan":return value<budget.now()- operand;case "withinLast":{const now=budget.now();return value>=now-operand&&value<=now}}
|
|
21
21
|
return false}}
|
|
22
22
|
function formatGroup(group,columns,budget,depth){if(depth>8||++budget.groups>64)formatError("formatting conditions exceed eight levels or 64 groups.");formatKeys(group,["operator","filters","groups"],"formatting condition group");const filters=group.filters??[],groups=group.groups??[];if(!["and","or","none"].includes(group.operator)||!Array.isArray(filters)||!Array.isArray(groups)||!filters.length&&!groups.length)
|
|
23
23
|
formatError("invalid or empty formatting condition group.");const tests=[...filters.map(filter=>formatPredicate(filter,columns,budget)),...groups.map(child=>formatGroup(child,columns,budget,depth+1))];const count=tests.length;if(group.operator==="and")return row=>{for(let i=0;i<count;i++)if(!tests[i](row))return false;return true};const any=row=>{for(let i=0;i<count;i++)if(tests[i](row))return true;return false};return group.operator==="or"?any:row=>!any(row)}
|
|
24
|
-
const FORMAT_ICONS={up:"↑",down:"↓",check:"✓",cross:"✕",warning:"⚠︎",info:"ⓘ",dot:"●",circle:"○",triangle:"▲",square:"■",diamond:"◆",flag:"⚑",star:"★",minus:"−",plus:"+",clock:"◷"};const FORMAT_TONE_ICONS={danger:"cross",warning:"warning",success:"check",info:"info"};const FORMAT_LABELS={formatRules:"Conditional formatting",formatLegend:"Formatting legend",formatUpTo:"Up to",formatAbove:"Above",formatHiddenFlagged:"{count} hidden fields formatted: {rules}"};function formatToneVar(tone){return tone==="neutral"?"var(--hfx-color-text-secondary,light-dark(#4d525b,#b0b4bc))":tone==="muted"?"var(--hfx-color-text-muted,light-dark(#626770,#8f949d))":toneVariable(tone,false,"var(--hfx-color-text-secondary,light-dark(#4d525b,#b0b4bc))")}
|
|
24
|
+
const FORMAT_ICONS={up:"↑",down:"↓",check:"✓",cross:"✕",warning:"⚠︎",info:"ⓘ",dot:"●",circle:"○",triangle:"▲",square:"■",diamond:"◆",flag:"⚑",star:"★",minus:"−",plus:"+",clock:"◷"};const FORMAT_TONE_ICONS={danger:"cross",warning:"warning",success:"check",info:"info"};const FORMAT_LABELS={formatRules:"Conditional formatting",formatLegend:"Formatting legend",formatUpTo:"Up to",formatAbove:"Above",formatHiddenFlagged:"{count} hidden fields formatted: {rules}"};function formatToneVar(tone){return tone==="neutral"?"var(--hfx-color-text-secondary,light-dark(#4d525b,#b0b4bc))":tone==="muted"?"var(--hfx-color-text-secondary,var(--hfx-color-text-muted,light-dark(#626770,#8f949d)))":toneVariable(tone,false,"var(--hfx-color-text-secondary,light-dark(#4d525b,#b0b4bc))")}
|
|
25
25
|
function formatTone(value){if(typeof value!=="string"||!toneOf(value).cls)formatError("'"+value+"' is not a tone name.");return value}
|
|
26
26
|
const formatText=(value,limit)=>value===undefined||typeof value==="string"&&value.trim()&&value.length<=limit&&!/[\u0000-\u001f\u007f]/.test(value) ? value : formatError("formatting text must have 1 to " + limit + " visible characters.");
|
|
27
27
|
const formatFinite=value=>value===undefined||Number.isFinite(value)&&Math.abs(value)<=Number.MAX_SAFE_INTEGER?value:formatError("formatting bounds are finite numbers.");function formatIcon(value){if(value===undefined||value==="auto"||value==="none"||Object.hasOwn(FORMAT_ICONS,value))return value;if(typeof value!=="string"||!value.trim()||[...value].length>4||/[\u0000-\u001f\u007f<>]/.test(value)) formatError("an icon is a known name or up to four characters.");
|
|
@@ -37,11 +37,11 @@ if(style.bands!==undefined){const bands=style.bands;if(!Array.isArray(bands)||!b
|
|
|
37
37
|
formatError("threshold bands rise, and only the last may be open.")})}
|
|
38
38
|
if(!["tone","icon","badge","cue","className","css",...visuals].some(name=>style[name]!==undefined&&style[name]!=="none"))
|
|
39
39
|
formatError("a formatting rule needs a style.")}
|
|
40
|
-
function formatCompile(rules,grid){if(!Array.isArray(rules)||rules.length>64)formatError("a grid has at most 64 formatting rules.");const columns=new Map(grid.columns.map(column=>[column.id,column])),ids=new Set();return rules.map((rule,index)=>{formatKeys(rule,["id","label","description","enabled","when","column","target","columns","details","style","stopIfTrue"],"formatting rule");if(typeof rule.id!=="string"||!/^[A-Za-z0-9][\w.:-]{0,63}$/.test(rule.id) || ids.has(rule.id)) formatError("formatting rules need unique identifiers.");
|
|
40
|
+
function formatCompile(rules,grid,now=Date.now){if(!Array.isArray(rules)||rules.length>64)formatError("a grid has at most 64 formatting rules.");const columns=new Map(grid.columns.map(column=>[column.id,column])),ids=new Set();return rules.map((rule,index)=>{formatKeys(rule,["id","label","description","enabled","when","column","target","columns","details","style","stopIfTrue"],"formatting rule");if(typeof rule.id!=="string"||!/^[A-Za-z0-9][\w.:-]{0,63}$/.test(rule.id) || ids.has(rule.id)) formatError("formatting rules need unique identifiers.");
|
|
41
41
|
ids.add(rule.id);formatText(rule.label,200);formatText(rule.description,1000);const target=rule.target??"cell";if(!["cell","row","columns"].includes(target)||["enabled","details","stopIfTrue"].some(name=>rule[name]!==undefined&&typeof rule[name]!=="boolean")||
|
|
42
42
|
rule.column!==undefined&&!columns.has(rule.column)||target==="cell"&&rule.column===undefined)
|
|
43
43
|
formatError("formatting rule '"+rule.id+"' needs a declared column for its target.");const targets=target==="columns"?rule.columns:target==="cell"?[rule.column]:[];if(target==="columns"?!Array.isArray(targets)||!targets.length||targets.length>64||new Set(targets).size!==targets.length||targets.some(id=>!columns.has(id)):rule.columns!==undefined)
|
|
44
|
-
formatError("formatting rule '"+rule.id+"' names its columns once each.");formatStyle(rule.style,{target,column:rule.column});const budget={predicates:0,groups:0},test=rule.when===undefined?null:formatGroup(rule.when,columns,budget,1);return{id:rule.id,index,label:rule.label,description:rule.description||rule.label||rule.id,enabled:rule.enabled!==false,test,target,column:rule.column,columns:targets,details:rule.details!==false,stop:!!rule.stopIfTrue,style:rule.style,relative:!!budget.relative}})}
|
|
44
|
+
formatError("formatting rule '"+rule.id+"' names its columns once each.");formatStyle(rule.style,{target,column:rule.column});const budget={predicates:0,groups:0,now},test=rule.when===undefined?null:formatGroup(rule.when,columns,budget,1);return{id:rule.id,index,label:rule.label,description:rule.description||rule.label||rule.id,enabled:rule.enabled!==false,test,target,column:rule.column,columns:targets,details:rule.details!==false,stop:!!rule.stopIfTrue,style:rule.style,relative:!!budget.relative}})}
|
|
45
45
|
function formatOptions(options){if(options===undefined)return{};formatKeys(options,["legend","editor"],"formatting options");if(["legend","editor"].some(name=>options[name]!==undefined&&typeof options[name]!=="boolean"))formatError("formatting options are booleans.");return{legend:!!options.legend,editor:!!options.editor}}
|
|
46
46
|
function formatStats(grid){const inline=grid.view.source.kind==="inline"&&(!grid.opts.source||grid.enhanceStore),key=inline?"inline:" +(grid.enhanceStore?.version??0)+ ":"+grid.view.rows.length:grid.queryEpoch+":" +(grid.snapshot?.revision||"")+ ":" +[...grid.pages.keys()].join(",");if(grid.formatStatsKey===key)return grid.formatStatsCache;const wanted=new Set(grid.formatCompiled.filter(rule=>rule.style.bar||rule.style.scale).map(rule=>rule.column)),stats=new Map();if(wanted.size){const rows=inline?grid.view.rows:[...grid.rowCache.values()].map(row=>row.h);for(const id of wanted){let min=Infinity,max=-Infinity;for(const row of rows){const value=formatCoerce(cellValue(row.cells[id]),"number");if(value!==null){if(value<min)min=value;if(value>max)max=value}}
|
|
47
47
|
stats.set(id,min<=max?{min,max}:null)}}
|
|
@@ -56,9 +56,10 @@ return out}
|
|
|
56
56
|
function formatMerge(into,rule,style){const target=into||{rules:[],descriptions:[]};for(const name of["tone","emphasis","icon","badge","cue","className","css","bar","scale","band"])
|
|
57
57
|
if(target[name]===undefined&&style[name]!==undefined)target[name]=style[name];target.rules.push(rule.id);if(rule.description&&!target.descriptions.includes(rule.description))target.descriptions.push(rule.description);if(style.band&&!target.descriptions.includes(style.band))target.descriptions.push(style.band);target.details=target.details||rule.details;return target}
|
|
58
58
|
function formatFinish(target){if(!target)return target;if(target.icon===undefined&&target.tone&&!target.badge&&!target.cue&&!target.bar&&!target.scale)target.icon="auto";const name=target.icon==="auto"?FORMAT_TONE_ICONS[target.tone]||"dot":target.icon;target.glyph=name&&name!=="none"?FORMAT_ICONS[name]||name:null;return target}
|
|
59
|
-
|
|
59
|
+
function formatEvaluate(rules,stats,data,details=false){let row=null,cells=null;for(const rule of rules){if(!rule.enabled||rule.test&&!rule.test(data))continue;const style=formatResolve(rule,data,stats);if(style&&(!details||rule.details)){if(rule.target==="row")row=formatMerge(row,rule,style);else for(const id of rule.columns)(cells||=new Map()).set(id,formatMerge(cells.get(id),rule,style))}
|
|
60
60
|
if(rule.stop)break}
|
|
61
|
-
if(cells)for(const target of cells.values())formatFinish(target);
|
|
61
|
+
if(cells)for(const target of cells.values())formatFinish(target);return row||cells?{row:formatFinish(row),cells:cells||new Map()}:null}
|
|
62
|
+
Object.assign(DataGrid.prototype,{formatResult(data,details=false){const rules=this.formatCompiled;if(!rules||!rules.length)return null;const cache=details?this.formatDetailCache||=new WeakMap():this.formatCache;const stats=formatStats(this),cached=cache.get(data);if(cached&&cached.version===this.formatVersion)return cached.result;const result=formatEvaluate(rules,stats,data,details);cache.set(data,{version:this.formatVersion,result});return result}});const FORMAT_RANK={danger:5,warning:4,info:3,success:2,neutral:1,muted:1};function formatUndo(fx){for(const node of fx.nodes)node.remove();for(const name of fx.props)fx.element.style.removeProperty(name);for(const name of fx.classes)fx.element.classList.remove(name)}
|
|
62
63
|
function formatClearSlot(slot){if(slot.fx){formatUndo(slot.fx);slot.fx=null}
|
|
63
64
|
for(const child of slot.childSlots||[])formatClearSlot(child)}
|
|
64
65
|
function formatClear(element){for(const slot of element._cells||[])if(slot)formatClearSlot(slot);if(element._fx){formatUndo(element._fx);element._fx=null}}
|
|
@@ -66,7 +67,7 @@ function formatEffects(element){return{element,nodes:[],props:[],classes:[]}}
|
|
|
66
67
|
function formatDecorate(element,target,fx,before,emphasis){const add=name=>{if(!element.classList.contains(name)){element.classList.add(name);fx.classes.push(name)}};const prop=(target,name,value)=>{target.style.setProperty(name,value);if(target===element)fx.props.push(name)};const node=(tag,className,text)=>{const item=h(tag,className);if(text)setText(item,text);fx.nodes.push(item);return item};if(target.tone&&emphasis){add("cx-fmt-" +(target.bar||target.scale?"text":target.emphasis||emphasis));prop(element,"--cx-fmt",formatToneVar(target.tone))}
|
|
67
68
|
if(target.scale){add("cx-fmt-scale");prop(element,"--cx-fmt-scale",target.scale)}
|
|
68
69
|
if(target.className)for(const name of target.className.split(/\s+/)) if (name) add(name);
|
|
69
|
-
if(target.css)for(const name of Object.keys(target.css))prop(element,name,target.css[name]);if(target.glyph){const icon=node("span","cx-fmt-icon",target.glyph);icon.setAttribute("aria-hidden","true");if(target.tone)prop(icon,"--cx-fmt",formatToneVar(target.tone));element.insertBefore(icon,before&&before.parentNode===
|
|
70
|
+
if(target.css)for(const name of Object.keys(target.css))prop(element,name,target.css[name]);if(target.glyph){const icon=node("span","cx-fmt-icon",target.glyph);icon.setAttribute("aria-hidden","true");if(target.tone)prop(icon,"--cx-fmt",formatToneVar(target.tone));const line=element.querySelector(":scope > .cx-phone-primary")||element;line.insertBefore(icon,before&&before.parentNode===line?before:line.firstChild)}
|
|
70
71
|
if(target.bar){add("cx-fmt-barred");if(!target.bar.show)add("cx-fmt-novalue");const bar=node("span","cx-fmt-bar");bar.setAttribute("aria-hidden","true");prop(bar,"--cx-fmt-w",(target.bar.width*100).toFixed(1)+ "%");prop(bar,"--cx-fmt",formatToneVar(target.bar.tone));element.insertBefore(bar,element.firstChild)}
|
|
71
72
|
if(target.badge){const badge=node("span","cx-badge cx-fmt-badge",target.badge),tone=toneOf(target.tone||"neutral");badge.className +=tone.cls;if(tone.host){prop(badge,"--cx-t",toneVariable(tone.host));prop(badge,"--cx-t-bg",toneVariable(tone.host,true))}
|
|
72
73
|
element.appendChild(badge)}
|
|
@@ -75,7 +76,7 @@ const formatCues=target=>({glyph:target.glyph,badge:target.badge,cue:target.cue,
|
|
|
75
76
|
if(own.css)for(const name of Object.keys(own.css)){element.style.setProperty(name,own.css[name]);fx.props.push(name)}}
|
|
76
77
|
if(first){first.fx=formatEffects(first.cell);first.highlighted=true;formatDecorate(first.cell,formatCues(result.row),first.fx,first.textSpan)}}
|
|
77
78
|
const columns=this.cols.concat(this.phoneLineColumns()),paintSlots=slots.concat(first?.childSlots||[]);for(let i=0;i<columns.length;i++){const target=result.cells.get(columns[i].id),slot=paintSlots[i];if(!target||!slot)continue;if(!slot.fx||slot.fx.element!==slot.cell)slot.fx=formatEffects(slot.cell);slot.highlighted=true;formatDecorate(slot.cell,target,slot.fx,slot.textSpan,"fill")}
|
|
78
|
-
if(first&&first.hiddenFields){const details=this.formatResult(row.h,true);if(details)this.formatHiddenFields(first,details)}};const formatFlag=target=>target&&target.details&&(target.tone||target.glyph||target.badge||target.cue);DataGrid.prototype.formatHiddenFields=function(slot,result){const button=slot.hiddenFields,hidden=this.
|
|
79
|
+
if(first&&first.hiddenFields){const details=this.formatResult(row.h,true);if(details)this.formatHiddenFields(first,details)}};const formatFlag=target=>target&&target.details&&(target.tone||target.glyph||target.badge||target.cue);DataGrid.prototype.formatHiddenFields=function(slot,result){const button=slot.hiddenFields,shown=this.phoneLineColumns(),hidden=this.hiddenViewColumns().filter(column=>!shown.includes(column)&&formatFlag(result.cells.get(column.id)));if(!hidden.length)return;let tone=null;for(const column of hidden){const next=result.cells.get(column.id).tone;if(next&&(FORMAT_RANK[next]||3)>(FORMAT_RANK[tone]||0))tone=next}
|
|
79
80
|
const fx=slot.fx||(slot.fx=formatEffects(slot.cell)),effects=formatEffects(button),label=button.getAttribute("aria-label");let decorated;fx.nodes.push({remove(){formatUndo(effects);if(button.getAttribute("aria-label")===decorated)button.setAttribute("aria-label",label)}});effects.classes.push("cx-fmt-flag");button.classList.add("cx-fmt-flag");button.style.setProperty("--cx-fmt",tone?formatToneVar(tone):"var(--hfx-color-text-secondary,light-dark(#4d525b,#b0b4bc))");effects.props.push("--cx-fmt");const rules=[...new Set(hidden.flatMap(column=>result.cells.get(column.id).descriptions))].join(", ");decorated=label+". "+fill(this.formatLabels.formatHiddenFlagged,{count:hidden.length,rules});button.setAttribute("aria-label",decorated)};const FORMAT_MEASURE=DataGrid.prototype.measureGridColumn;DataGrid.prototype.measureGridColumn=function(column){if(column.formatMinW!==undefined){column.minW=column.formatMinW;delete column.formatMinW}
|
|
80
81
|
const result=FORMAT_MEASURE.call(this,column);if(!this.formatCompiled||!this.formatCompiled.length||!this.fitContext||!this.fitFont)return result;const context=this.fitContext,[font,small,,pad]=this.fitFont,first=column===this.columns.find(item=>!item.hidden);const measure=(text,face)=>{context.font=face;return context.measureText(String(text).slice(0,512)).width};let need=0,floor=0,sampled=0;for(const row of this.rowCache.values()){if(sampled++===200)break;const formats=this.formatResult(row.h),own=formats&&formats.cells.get(column.id),cues=first&&formats&&formats.row;if(!own&&!cues)continue;let width=measure(cellText(row.h.cells[column.id],column,this.fmt)||"—",font),flag=false;for(const target of[own,cues])if(target){if(target.glyph){width +=20;flag=true}
|
|
81
82
|
if(target.badge){width +=measure(target.badge,small)+ 20;flag=true}
|
|
@@ -85,7 +86,7 @@ width=Math.ceil(width+2*pad+4);need=Math.max(need,width);if(flag)floor=Math.max(
|
|
|
85
86
|
if(floor){column.formatMinW=column.minW;column.minW=Math.max(column.minW||0,Math.min(floor,420))}
|
|
86
87
|
return need>result.width||floor>result.width?Object.freeze({...result,width:Math.max(result.width,Math.min(Math.max(need,floor),420))}):result};DataGrid.prototype.formatRefit=function(){this.fitKey=null;if(this.sized&&this.grid.clientWidth)this.applyWidths()};function formatDrawer(grid,dialog){let effects=[];const paint=()=>{effects.forEach(formatUndo);effects=[];const head=dialog.querySelector(".cx-drawer-h"),title=head&&head.querySelector("h4"),data=dialog._cxRecord;if(!dialog.isConnected||!title||!data||!grid.formatCompiled||!grid.formatCompiled.length)return;const result=grid.formatResult(data,true);if(!result)return;if(result.row){const fx=formatEffects(head);effects.push(fx);formatDecorate(head,{tone:result.row.tone,descriptions:result.row.descriptions,glyph:result.row.glyph},fx,title,"accent")}
|
|
87
88
|
for(const field of grid.drawerFields(dialog)){const target=field.column&&result.cells.get(field.column.id);if(!target||!target.details)continue;const fx=formatEffects(field.value);effects.push(fx);formatDecorate(field.value,target,fx,field.value.firstChild,"fill")}};dialog.addEventListener("cx-drawer-paint",paint);dialog.addEventListener("close",()=>{effects.forEach(formatUndo);effects=[]},{once:true})}
|
|
88
|
-
DataGrid.drawerHook(20,function(dialog){formatDrawer(this,dialog)});const FORMAT_EDITOR=definePart(DataGrid,"format-editor","formatting rule editor",()=>({DataGrid,h,setText,fill,gridButton,gridOption,gridDateInputMoment,gridInputLabel,gridIcon,gridDecorateButton,announceMenu,formatCompile,formatToneVar,formatError,FORMAT_ICONS,FORMAT_TONE_ICONS,FORMAT_OPERATORS,svgIcon,overlayTheme}));function formatPick(labels){const own={};for(const name of Object.keys(FORMAT_LABELS))own[name]=Object.hasOwn(labels,name)?labels[name]:FORMAT_LABELS[name];return own}
|
|
89
|
+
DataGrid.drawerHook(20,function(dialog){formatDrawer(this,dialog)});const FORMAT_EDITOR=definePart(DataGrid,"format-editor","formatting rule editor",()=>({DataGrid,h,setText,fill,gridButton,gridVariant,gridOption,gridDateInputMoment,gridInputLabel,gridIcon,gridDecorateButton,announceMenu,formatCompile,formatToneVar,formatError,FORMAT_ICONS,FORMAT_TONE_ICONS,FORMAT_OPERATORS,svgIcon,overlayTheme}));function formatPick(labels){const own={};for(const name of Object.keys(FORMAT_LABELS))own[name]=Object.hasOwn(labels,name)?labels[name]:FORMAT_LABELS[name];return own}
|
|
89
90
|
Object.assign(DataGrid.prototype,{validateFormatRules(rules){formatCompile(rules,this)},startFormatting(){if(this.formatStarted||this.destroyed)return;this.formatStarted=true;this.formatVersion=1;this.formatCache=new WeakMap();this.formatLabels=formatPick(this.labels);try{this.formatOptions=formatOptions(this.view.formatting);this.formatCompiled=formatCompile(this.view.formatRules||[],this)}
|
|
90
91
|
catch(error){this.formatOptions=this.formatOptions||{};this.formatCompiled=[];this.emit("error",{error})}
|
|
91
92
|
this.formatRules=gridFreeze(JSON.parse(JSON.stringify(this.formatCompiled.length?this.view.formatRules:[])));this.formatEdited=false;this.formatLegendShown=!!this.formatOptions.legend;if(this.formatOptions.editor&&this.overflow){const entry=gridButton(this.formatLabels.formatRules,()=>this.openFormatRules().catch(error=>this.emit("error",{error})));entry.classList.add("cx-grid-format-rules");entry.setAttribute("aria-haspopup","dialog");this.overflow.panel.insertBefore(entry,this.overflow.panel.querySelector(".cx-grid-details, .cx-grid-print"))}
|
|
@@ -98,5 +99,5 @@ this.formatLabels.formatAbove+" "+numberFormat(this.lang).format(rule.style.band
|
|
|
98
99
|
this.formatLabels.formatUpTo+" "+numberFormat(this.lang).format(band.upperBound))),{tone:band.tone,icon:band.icon??rule.style.icon}));else key(rule.label,rule.style,rule.description)}
|
|
99
100
|
if(!legend.isConnected)this.host.insertBefore(legend,this.notice)}});function formatExported(target){if(!target)return undefined;const out={rules:target.rules.slice()};for(const name of["tone","badge","cue","band"])if(target[name]!==undefined)out[name]=target[name];if(target.glyph)out.icon=target.glyph;if(target.bar)out.bar={fraction:Math.round(target.bar.width*1000)/ 1000, tone: target.bar.tone };
|
|
100
101
|
if(target.scale)out.color=target.scale;if(target.descriptions.length)out.description=target.descriptions.join(", ");return out}
|
|
101
|
-
GRID_REPORTING.formatRecord=(grid,row,record)=>{const result=
|
|
102
|
+
const FORMAT_EXPORTS=new WeakMap(),FORMAT_PREPARE_EXPORT=DataGrid.prototype.prepareExport;DataGrid.prototype.prepareExport=function(options){const capture=FORMAT_PREPARE_EXPORT.call(this,options),now=Date.now(),rules=this.getFormatRules();const compiled=formatCompile(rules,this,()=>now),stats=compiled.length&&this.formatCompiled?formatStats(this):new Map();FORMAT_EXPORTS.set(capture.request,{rules:compiled,stats:new Map([...stats].map(([id,range])=>[id,range&&{...range}]))});return capture};GRID_REPORTING.copyExportFormatting=(from,to)=>{if(FORMAT_EXPORTS.has(from))FORMAT_EXPORTS.set(to,FORMAT_EXPORTS.get(from))};GRID_REPORTING.formatRecord=(grid,row,record,request)=>{const capture=FORMAT_EXPORTS.get(request),result=capture&&formatEvaluate(capture.rules,capture.stats,row);if(!result)return record;const cells={};for(const[id,cell]of Object.entries(record.cells)){const format=formatExported(result.cells.get(id));cells[id]=format?{...cell,format}:cell}
|
|
102
103
|
return gridFreeze({...record,cells,...(result.row?{format:formatExported(result.row)}:{})})};installed.add(context.DataGrid.prototype)}};(global.CanopyXParts||=[]).push(["formatting",part])})(typeof window!=="undefined"?window:globalThis);
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
/* Forms part: what every form's editors share, here the lookup combobox's suggestion list (a popover above any clipping). */
|
|
2
|
-
.cx-editor-list{position:fixed;inset:auto;margin:0;box-sizing:border-box;background:var(--hfx-color-surface-raised,light-dark(#ffffff,#1e2126));color:var(--hfx-color-text,light-dark(#16181c,#f2f3f5));border:var(--cx-size-1px) solid var(--hfx-color-border-strong,light-dark(#cdd0d5,#363a42));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-13d5px)/1.4 var(--hfx-font-sans,"Segoe UI Variable Text","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif);}
|
|
2
|
+
.cx-editor-list{position:fixed;inset:auto;margin:0;box-sizing:border-box;background:var(--hfx-color-surface-raised,light-dark(#ffffff,#1e2126));color:var(--hfx-color-text-primary,var(--hfx-color-text,light-dark(#16181c,#f2f3f5)));border:var(--cx-size-1px) solid var(--hfx-color-border-strong,light-dark(#cdd0d5,#363a42));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-13d5px)/1.4 var(--hfx-font-sans,"Segoe UI Variable Text","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif);}
|
|
3
3
|
.cx-editor-list{max-height:var(--cx-size-240px);overflow:auto;padding:var(--cx-size-4px);}
|
|
4
4
|
.cx-editor-option,.cx-editor-note{padding:var(--cx-size-6px) var(--cx-size-8px);border-radius:var(--hfx-radius-sm,4px);white-space:nowrap;}
|
|
5
5
|
.cx-editor-option{cursor:pointer;}
|
|
6
6
|
.cx-editor-option[aria-selected="true"],.cx-editor-option:hover{background:var(--hfx-color-accent-subtle,light-dark(#e7f1f1,#1b3435));}
|
|
7
|
-
.cx-editor-note{color:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));}
|
|
8
|
-
.cx-editor::placeholder{color:color-mix(in srgb,var(--hfx-color-text,light-dark(#16181c,#f2f3f5)) 60%,var(--hfx-color-surface,light-dark(#ffffff,#16181c)));font-style:italic;opacity:1;}
|
|
7
|
+
.cx-editor-note{color:var(--hfx-color-text-secondary,var(--hfx-color-text-muted,light-dark(#626770,#8f949d)));}
|
|
8
|
+
.cx-editor::placeholder{color:color-mix(in srgb,var(--hfx-color-text-primary,var(--hfx-color-text,light-dark(#16181c,#f2f3f5))) 60%,var(--hfx-color-surface-card,var(--hfx-color-surface,light-dark(#ffffff,#16181c))));font-style:italic;opacity:1;}
|
|
@@ -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:"381a3edba481660b",install(context){if(installed.has(context.FORMS_IMPL))return;const{FORMS_IMPL,h,setText,fill,gridFreeze,gridMomentFromParts,boundedPattern,foldText}=context;const editPad=(number,width=2)=>String(number).padStart(width,"0");function editInput(context,type="text"){const input=h("input","cx-editor");input.type=type;input.autocomplete="off";if(typeof context.editor.placeholder==="string")input.placeholder=context.editor.placeholder;return input}
|
|
2
2
|
const EDIT_NUMBER_LOCALES=new Map();function editParseNumber(text,locale){let format=EDIT_NUMBER_LOCALES.get(locale);if(!format){let number;try{number=new Intl.NumberFormat(locale||undefined)}catch(error){number=new Intl.NumberFormat()}
|
|
3
3
|
const digits=new Map();for(let digit=0;digit<10;digit++)digits.set(number.formatToParts(digit).find(part=>part.type==="integer").value,String(digit));format={parts:number.formatToParts(-12345.6),digits};if(EDIT_NUMBER_LOCALES.size>=32)EDIT_NUMBER_LOCALES.delete(EDIT_NUMBER_LOCALES.keys().next().value);EDIT_NUMBER_LOCALES.set(locale,format)}
|
|
4
4
|
const parts=format.parts;const group=parts.find(part=>part.type==="group")?.value??",",decimal=parts.find(part=>part.type==="decimal")?.value??".";let source=Array.from(text.trim(),digit=>format.digits.get(digit)??digit).join("").replace(/[\u061c\u200e\u200f]/g, "").replace(/\u2212/g, "-");
|