@sme.up/ketchup 6.5.0 → 6.7.0
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/README.md +7 -1
- package/dist/cjs/{f-button-4e2a0bb6.js → f-button-bf76ab95.js} +2 -2
- package/dist/cjs/{f-cell-1fc8a8b6.js → f-cell-b7a1524a.js} +25 -23
- package/dist/cjs/{f-checkbox-cd977193.js → f-checkbox-1097ca5d.js} +1 -1
- package/dist/cjs/{f-chip-7867f17b.js → f-chip-a5e100b1.js} +3 -3
- package/dist/cjs/{f-image-6b7a6168.js → f-image-d80a2749.js} +2 -2
- package/dist/cjs/{f-paginator-utils-b7712403.js → f-paginator-utils-c70812fe.js} +3 -5
- package/dist/cjs/{f-text-field-153e827c.js → f-text-field-48b8bb16.js} +2 -2
- package/dist/cjs/{index-31125378.js → index-ffdb46f6.js} +423 -252
- package/dist/cjs/ketchup.cjs.js +3 -3
- package/dist/cjs/kup-accordion.cjs.entry.js +3 -3
- package/dist/cjs/kup-autocomplete_25.cjs.entry.js +433 -163
- package/dist/cjs/kup-box.cjs.entry.js +27 -16
- package/dist/cjs/kup-calendar.cjs.entry.js +5 -5
- package/dist/cjs/kup-cell.cjs.entry.js +7 -7
- package/dist/cjs/kup-dash-list.cjs.entry.js +2 -2
- package/dist/cjs/kup-dash_2.cjs.entry.js +2 -2
- package/dist/cjs/kup-dashboard.cjs.entry.js +6 -6
- package/dist/cjs/kup-drawer.cjs.entry.js +2 -2
- package/dist/cjs/kup-echart.cjs.entry.js +2 -2
- package/dist/cjs/kup-family-tree.cjs.entry.js +19 -7
- package/dist/cjs/kup-form.cjs.entry.js +8 -8
- package/dist/cjs/kup-iframe.cjs.entry.js +2 -2
- package/dist/cjs/kup-image-list.cjs.entry.js +9 -9
- package/dist/cjs/kup-lazy.cjs.entry.js +2 -2
- package/dist/cjs/kup-magic-box.cjs.entry.js +3 -3
- package/dist/cjs/{kup-manager-cfe2f36e.js → kup-manager-0e38bf48.js} +39 -26
- package/dist/cjs/kup-nav-bar.cjs.entry.js +2 -2
- package/dist/cjs/kup-numeric-picker.cjs.entry.js +3 -3
- package/dist/cjs/kup-photo-frame.cjs.entry.js +2 -2
- package/dist/cjs/kup-probe.cjs.entry.js +2 -2
- package/dist/cjs/kup-qlik.cjs.entry.js +2 -2
- package/dist/cjs/kup-snackbar.cjs.entry.js +4 -4
- package/dist/cjs/loader.cjs.js +3 -3
- package/dist/collection/assets/box.js +9 -6
- package/dist/collection/assets/card.js +12 -2
- package/dist/collection/collection-manifest.json +3 -3
- package/dist/collection/components/kup-accordion/kup-accordion.js +239 -234
- package/dist/collection/components/kup-autocomplete/kup-autocomplete.js +545 -530
- package/dist/collection/components/kup-badge/kup-badge.js +176 -170
- package/dist/collection/components/kup-box/kup-box.js +907 -913
- package/dist/collection/components/kup-button/kup-button.css +1 -0
- package/dist/collection/components/kup-button/kup-button.js +379 -370
- package/dist/collection/components/kup-button-list/kup-button-list.js +251 -240
- package/dist/collection/components/kup-calendar/kup-calendar.js +301 -300
- package/dist/collection/components/kup-card/box/kup-card-box.js +115 -0
- package/dist/collection/components/kup-card/built-in/kup-card-calendar.js +14 -28
- package/dist/collection/components/kup-card/built-in/kup-card-clock.js +6 -19
- package/dist/collection/components/kup-card/built-in/kup-card-column-drop-menu.js +1 -2
- package/dist/collection/components/kup-card/built-in/kup-card-numeric.js +9 -44
- package/dist/collection/components/kup-card/collapsible/kup-card-collapsible.js +2 -21
- package/dist/collection/components/kup-card/dialog/kup-card-dialog.js +6 -33
- package/dist/collection/components/kup-card/kup-card-declarations.js +2 -0
- package/dist/collection/components/kup-card/kup-card-helper.js +3 -8
- package/dist/collection/components/kup-card/kup-card.css +140 -20
- package/dist/collection/components/kup-card/kup-card.js +352 -340
- package/dist/collection/components/kup-card/scalable/kup-card-scalable.js +68 -81
- package/dist/collection/components/kup-card/standard/kup-card-standard.js +96 -304
- package/dist/collection/components/kup-cell/kup-cell.js +221 -216
- package/dist/collection/components/kup-chart/kup-chart.js +547 -537
- package/dist/collection/components/kup-checkbox/kup-checkbox.js +275 -266
- package/dist/collection/components/kup-chip/kup-chip.js +240 -231
- package/dist/collection/components/kup-color-picker/kup-color-picker.js +274 -264
- package/dist/collection/components/kup-combobox/kup-combobox.js +458 -440
- package/dist/collection/components/kup-dash/kup-dash.js +110 -158
- package/dist/collection/components/kup-dash-list/kup-dash-list.js +210 -213
- package/dist/collection/components/kup-dashboard/kup-dashboard.js +196 -203
- package/dist/collection/components/kup-data-table/kup-data-table.js +1932 -1838
- package/dist/collection/components/kup-date-picker/kup-date-picker.js +408 -394
- package/dist/collection/components/kup-drawer/kup-drawer.js +244 -236
- package/dist/collection/components/kup-dropdown-button/kup-dropdown-button.js +474 -464
- package/dist/collection/components/kup-echart/kup-echart.js +436 -423
- package/dist/collection/components/kup-family-tree/kup-family-tree-declarations.js +1 -0
- package/dist/collection/components/kup-family-tree/kup-family-tree.js +420 -398
- package/dist/collection/components/kup-form/kup-form.js +223 -225
- package/dist/collection/components/kup-gauge/kup-gauge.js +445 -445
- package/dist/collection/components/kup-grid/kup-grid.js +156 -153
- package/dist/collection/components/kup-iframe/kup-iframe.js +181 -173
- package/dist/collection/components/kup-image/canvas/kup-image-canvas.js +9 -3
- package/dist/collection/components/kup-image/kup-image.js +300 -295
- package/dist/collection/components/kup-image-list/kup-image-list.js +292 -285
- package/dist/collection/components/kup-lazy/kup-lazy.js +253 -253
- package/dist/collection/components/kup-list/kup-list.js +541 -504
- package/dist/collection/components/kup-magic-box/kup-magic-box.js +145 -145
- package/dist/collection/components/kup-nav-bar/kup-nav-bar.js +190 -184
- package/dist/collection/components/kup-numeric-picker/kup-numeric-picker.js +490 -478
- package/dist/collection/components/kup-photo-frame/kup-photo-frame.js +254 -242
- package/dist/collection/components/kup-probe/kup-probe.js +87 -83
- package/dist/collection/components/kup-progress-bar/kup-progress-bar.js +237 -241
- package/dist/collection/components/kup-qlik/kup-qlik.js +178 -170
- package/dist/collection/components/kup-radio/kup-radio.js +258 -255
- package/dist/collection/components/kup-rating/kup-rating.js +208 -197
- package/dist/collection/components/kup-snackbar/kup-snackbar.js +249 -246
- package/dist/collection/components/kup-spinner/kup-spinner.js +274 -269
- package/dist/collection/components/kup-switch/kup-switch.js +255 -246
- package/dist/collection/components/kup-tab-bar/kup-tab-bar.js +265 -224
- package/dist/collection/components/kup-text-field/kup-text-field.js +814 -805
- package/dist/collection/components/kup-time-picker/kup-time-picker.js +464 -450
- package/dist/collection/components/kup-tree/kup-tree-declarations.js +0 -2
- package/dist/collection/components/kup-tree/kup-tree-faker.js +3 -2
- package/dist/collection/components/kup-tree/kup-tree.js +1134 -1133
- package/dist/collection/f-components/f-button/f-button.js +11 -20
- package/dist/collection/f-components/f-cell/f-cell.js +23 -23
- package/dist/collection/f-components/f-checkbox/f-checkbox.js +1 -9
- package/dist/collection/f-components/f-chip/f-chip.js +18 -31
- package/dist/collection/f-components/f-image/f-image.js +1 -3
- package/dist/collection/f-components/f-paginator/f-paginator.js +1 -6
- package/dist/collection/f-components/f-switch/f-switch.js +1 -8
- package/dist/collection/f-components/f-text-field/f-text-field.js +18 -40
- package/dist/collection/managers/kup-debug/kup-debug.js +10 -5
- package/dist/collection/managers/kup-scroll-on-hover/kup-scroll-on-hover.js +25 -10
- package/dist/collection/managers/kup-theme/kup-theme-declarations.js +1 -0
- package/dist/collection/managers/kup-toolbar/kup-toolbar.js +10 -5
- package/dist/collection/managers/kup-tooltip/kup-tooltip.js +10 -5
- package/dist/collection/utils/kup-column-menu/kup-column-menu.js +0 -21
- package/dist/esm/{f-button-a24e43dd.js → f-button-e79f7594.js} +2 -2
- package/dist/esm/{f-cell-ebbb0c06.js → f-cell-9400374e.js} +25 -23
- package/dist/esm/{f-checkbox-e06cf07b.js → f-checkbox-b721178e.js} +1 -1
- package/dist/esm/{f-chip-e2c38ba8.js → f-chip-bf740287.js} +3 -3
- package/dist/esm/{f-image-7e02e88f.js → f-image-ab3dc8cb.js} +2 -2
- package/dist/esm/{f-paginator-utils-e6d2638f.js → f-paginator-utils-6909e43b.js} +3 -5
- package/dist/esm/{f-text-field-8438a278.js → f-text-field-4841dfea.js} +2 -2
- package/dist/esm/{index-e41330a5.js → index-a2197376.js} +423 -252
- package/dist/esm/ketchup.js +3 -3
- package/dist/esm/kup-accordion.entry.js +3 -3
- package/dist/esm/kup-autocomplete_25.entry.js +433 -163
- package/dist/esm/kup-box.entry.js +27 -16
- package/dist/esm/kup-calendar.entry.js +5 -5
- package/dist/esm/kup-cell.entry.js +7 -7
- package/dist/esm/kup-dash-list.entry.js +2 -2
- package/dist/esm/kup-dash_2.entry.js +2 -2
- package/dist/esm/kup-dashboard.entry.js +6 -6
- package/dist/esm/kup-drawer.entry.js +2 -2
- package/dist/esm/kup-echart.entry.js +2 -2
- package/dist/esm/kup-family-tree.entry.js +19 -7
- package/dist/esm/kup-form.entry.js +8 -8
- package/dist/esm/kup-iframe.entry.js +2 -2
- package/dist/esm/kup-image-list.entry.js +9 -9
- package/dist/esm/kup-lazy.entry.js +2 -2
- package/dist/esm/kup-magic-box.entry.js +3 -3
- package/dist/esm/{kup-manager-7c27e90e.js → kup-manager-c54e6df5.js} +22 -9
- package/dist/esm/kup-nav-bar.entry.js +2 -2
- package/dist/esm/kup-numeric-picker.entry.js +3 -3
- package/dist/esm/kup-photo-frame.entry.js +2 -2
- package/dist/esm/kup-probe.entry.js +2 -2
- package/dist/esm/kup-qlik.entry.js +2 -2
- package/dist/esm/kup-snackbar.entry.js +4 -4
- package/dist/esm/loader.js +3 -3
- package/dist/esm/polyfills/css-shim.js +1 -1
- package/dist/ketchup/ketchup.esm.js +1 -1
- package/dist/ketchup/{p-191096ff.entry.js → p-182b869e.entry.js} +1 -1
- package/dist/ketchup/p-1dfd2a51.js +30 -0
- package/dist/ketchup/{p-b502b91b.entry.js → p-1f5c7f21.entry.js} +1 -1
- package/dist/ketchup/p-22ec1ba0.entry.js +9 -0
- package/dist/ketchup/{p-5552f156.js → p-23cd5a68.js} +1 -1
- package/dist/ketchup/{p-26acb448.js → p-25bf0cb6.js} +1 -1
- package/dist/ketchup/{p-601a50db.entry.js → p-260ff835.entry.js} +1 -1
- package/dist/ketchup/{p-5a703573.entry.js → p-2e184b57.entry.js} +1 -1
- package/dist/ketchup/{p-45415b72.entry.js → p-30a63b85.entry.js} +1 -1
- package/dist/ketchup/{p-cc663bad.entry.js → p-313e376b.entry.js} +1 -1
- package/dist/ketchup/{p-e0ed3fd7.entry.js → p-41620707.entry.js} +1 -1
- package/dist/ketchup/{p-25875aa1.entry.js → p-4a0ccf18.entry.js} +1 -1
- package/dist/ketchup/{p-3decc8e4.js → p-4f0d3062.js} +1 -1
- package/dist/ketchup/p-4fdb684f.js +2 -0
- package/dist/ketchup/{p-52590a90.entry.js → p-53d3ae80.entry.js} +1 -1
- package/dist/ketchup/{p-92595296.js → p-5bea2971.js} +1 -1
- package/dist/ketchup/{p-a782ebd1.entry.js → p-60fa0ccf.entry.js} +1 -1
- package/dist/ketchup/p-6333388c.js +1 -0
- package/dist/ketchup/{p-2003a841.entry.js → p-6bd57787.entry.js} +1 -1
- package/dist/ketchup/p-758d03f4.entry.js +1 -0
- package/dist/ketchup/{p-2f009c42.entry.js → p-7e7b6127.entry.js} +1 -1
- package/dist/ketchup/p-8386e3db.entry.js +1 -0
- package/dist/ketchup/{p-23111c8d.entry.js → p-859163c2.entry.js} +1 -1
- package/dist/ketchup/{p-97f28bbd.entry.js → p-8e1fa7a8.entry.js} +6 -6
- package/dist/ketchup/{p-ca98059c.entry.js → p-90860d9e.entry.js} +1 -1
- package/dist/ketchup/{p-b131b257.entry.js → p-b7fdc7aa.entry.js} +1 -1
- package/dist/ketchup/{p-3138cabb.entry.js → p-bffaef6e.entry.js} +1 -1
- package/dist/ketchup/p-c35c5e05.js +1 -0
- package/dist/ketchup/{p-1468bf09.js → p-e1d0ea71.js} +1 -1
- package/dist/ketchup/p-f9d5e553.entry.js +1 -0
- package/dist/ketchup/{p-69dd11da.entry.js → p-fb4d772a.entry.js} +1 -1
- package/dist/loader/package.json +1 -0
- package/dist/types/components/kup-box/kup-box-declarations.d.ts +3 -0
- package/dist/types/components/kup-card/box/kup-card-box.d.ts +26 -0
- package/dist/types/components/kup-card/kup-card-declarations.d.ts +2 -0
- package/dist/types/components/kup-card/scalable/kup-card-scalable.d.ts +6 -0
- package/dist/types/components/kup-card/standard/kup-card-standard.d.ts +0 -6
- package/dist/types/components/kup-combobox/kup-combobox-declarations.d.ts +3 -1
- package/dist/types/components/kup-data-table/kup-data-table.d.ts +15 -1
- package/dist/types/components/kup-family-tree/kup-family-tree-declarations.d.ts +1 -0
- package/dist/types/components/kup-family-tree/kup-family-tree.d.ts +5 -0
- package/dist/types/components/kup-list/kup-list.d.ts +5 -0
- package/dist/types/components/kup-tab-bar/kup-tab-bar.d.ts +5 -0
- package/dist/types/components/kup-tree/kup-tree-declarations.d.ts +0 -4
- package/dist/types/components/kup-tree/kup-tree.d.ts +18 -12
- package/dist/types/components.d.ts +43 -16
- package/dist/types/managers/kup-scroll-on-hover/kup-scroll-on-hover-declarations.d.ts +1 -0
- package/dist/types/managers/kup-scroll-on-hover/kup-scroll-on-hover.d.ts +2 -1
- package/dist/types/stencil-public-runtime.d.ts +15 -4
- package/package.json +3 -2
- package/CHANGELOG.md +0 -5
- package/dist/ketchup/p-753c82d8.js +0 -1
- package/dist/ketchup/p-77600efd.entry.js +0 -9
- package/dist/ketchup/p-88722265.js +0 -1
- package/dist/ketchup/p-9027e5ac.js +0 -30
- package/dist/ketchup/p-aa564df8.entry.js +0 -1
- package/dist/ketchup/p-b0b3989b.js +0 -2
- package/dist/ketchup/p-b238f9ea.entry.js +0 -1
- package/dist/ketchup/p-b4f85d34.entry.js +0 -1
|
@@ -2,19 +2,19 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
const index = require('./index-
|
|
6
|
-
const kupManager = require('./kup-manager-
|
|
7
|
-
const fTextField = require('./f-text-field-
|
|
5
|
+
const index = require('./index-ffdb46f6.js');
|
|
6
|
+
const kupManager = require('./kup-manager-0e38bf48.js');
|
|
7
|
+
const fTextField = require('./f-text-field-48b8bb16.js');
|
|
8
8
|
const fTextFieldMdc = require('./f-text-field-mdc-85997738.js');
|
|
9
9
|
const GenericVariables = require('./GenericVariables-a9ed17ee.js');
|
|
10
|
-
const fImage = require('./f-image-
|
|
11
|
-
const fButton = require('./f-button-
|
|
10
|
+
const fImage = require('./f-image-d80a2749.js');
|
|
11
|
+
const fButton = require('./f-button-bf76ab95.js');
|
|
12
12
|
const fButtonDeclarations = require('./f-button-declarations-b611587f.js');
|
|
13
|
-
const
|
|
14
|
-
const
|
|
13
|
+
const fCell = require('./f-cell-b7a1524a.js');
|
|
14
|
+
const fChip = require('./f-chip-a5e100b1.js');
|
|
15
15
|
const component = require('./component-72a5b626.js');
|
|
16
|
-
const fCheckbox = require('./f-checkbox-
|
|
17
|
-
const fPaginatorUtils = require('./f-paginator-utils-
|
|
16
|
+
const fCheckbox = require('./f-checkbox-1097ca5d.js');
|
|
17
|
+
const fPaginatorUtils = require('./f-paginator-utils-c70812fe.js');
|
|
18
18
|
require('./tslib.es6-0ee02c67.js');
|
|
19
19
|
|
|
20
20
|
/**
|
|
@@ -515,9 +515,9 @@ const KupAutocomplete = class {
|
|
|
515
515
|
render() {
|
|
516
516
|
const fullHeight = this.rootElement.classList.contains('kup-full-height');
|
|
517
517
|
const fullWidth = this.rootElement.classList.contains('kup-full-width');
|
|
518
|
-
return (index.h(index.Host, { class: `${fullHeight ? 'kup-full-height' : ''} ${fullWidth ? 'kup-full-width' : ''}`, style: __classPrivateFieldGet$2(this, _KupAutocomplete_elStyle, "f") }, index.h("style", null, __classPrivateFieldGet$2(this, _KupAutocomplete_kupManager, "f").theme.setKupStyle(this.rootElement)), index.h("div", { id: GenericVariables.componentWrapperId, style: __classPrivateFieldGet$2(this, _KupAutocomplete_elStyle, "f") }, index.h(fTextField.FTextField, Object.assign({
|
|
518
|
+
return (index.h(index.Host, { class: `${fullHeight ? 'kup-full-height' : ''} ${fullWidth ? 'kup-full-width' : ''}`, style: __classPrivateFieldGet$2(this, _KupAutocomplete_elStyle, "f") }, index.h("style", null, __classPrivateFieldGet$2(this, _KupAutocomplete_kupManager, "f").theme.setKupStyle(this.rootElement)), index.h("div", { id: GenericVariables.componentWrapperId, style: __classPrivateFieldGet$2(this, _KupAutocomplete_elStyle, "f") }, index.h(fTextField.FTextField, Object.assign({ icon: this.showDropDownIcon
|
|
519
519
|
? kupManager.KupThemeIconValues.DROPDOWN
|
|
520
|
-
: null, trailingIcon: true, value: this.displayedValue, onBlur: () => this.onKupBlur(), onClick: () => this.onKupClick(), onChange: (e) => this.onKupChange(e.target.value), onFocus: () => this.onKupFocus(), onInput: () => {
|
|
520
|
+
: null, trailingIcon: true }, this.data['kup-text-field'], { disabled: this.disabled, fullHeight: fullHeight, fullWidth: fullWidth, value: this.displayedValue, onBlur: () => this.onKupBlur(), onClick: () => this.onKupClick(), onChange: (e) => this.onKupChange(e.target.value), onFocus: () => this.onKupFocus(), onInput: () => {
|
|
521
521
|
window.clearTimeout(__classPrivateFieldGet$2(this, _KupAutocomplete_inputTimeout, "f"));
|
|
522
522
|
__classPrivateFieldSet$2(this, _KupAutocomplete_inputTimeout, window.setTimeout(() => this.onKupInput(), this.inputDelay), "f");
|
|
523
523
|
}, onIconClick: () => this.onKupIconClick() }))), __classPrivateFieldGet$2(this, _KupAutocomplete_instances, "m", _KupAutocomplete_prepList).call(this)));
|
|
@@ -1265,6 +1265,144 @@ const KupButtonList = class {
|
|
|
1265
1265
|
};
|
|
1266
1266
|
KupButtonList.style = kupButtonListCss;
|
|
1267
1267
|
|
|
1268
|
+
const dom$7 = document.documentElement;
|
|
1269
|
+
/**
|
|
1270
|
+
* 1st box card layout, it can be used as a key-value grid list.
|
|
1271
|
+
* @param {KupCard} component - Card component.
|
|
1272
|
+
* @returns {VNode} 1st box layout virtual node.
|
|
1273
|
+
*/
|
|
1274
|
+
function create1$6(component) {
|
|
1275
|
+
const rows = [];
|
|
1276
|
+
for (let index$1 = 0; index$1 < component.data.cell.length; index$1++) {
|
|
1277
|
+
const cell = component.data.cell[index$1];
|
|
1278
|
+
const column = component.data.columns[index$1];
|
|
1279
|
+
const props = {
|
|
1280
|
+
cell: cell,
|
|
1281
|
+
column: column,
|
|
1282
|
+
component: component,
|
|
1283
|
+
density: kupManager.FCellPadding.NONE,
|
|
1284
|
+
renderKup: true,
|
|
1285
|
+
row: { cells: { [column.name]: cell } },
|
|
1286
|
+
};
|
|
1287
|
+
rows.push(index.h("tr", null,
|
|
1288
|
+
index.h("td", { class: "label" }, column.title),
|
|
1289
|
+
index.h("td", { class: "value" },
|
|
1290
|
+
index.h(fCell.FCell, Object.assign({}, props)))));
|
|
1291
|
+
}
|
|
1292
|
+
return (index.h("div", { class: `box-layout-${component.layoutNumber}` },
|
|
1293
|
+
index.h("table", null, rows)));
|
|
1294
|
+
}
|
|
1295
|
+
/**
|
|
1296
|
+
* 2nd box card layout, it can be used as a key-value grid list with text occupying the left/right edges of the box.
|
|
1297
|
+
* @param {KupCard} component - Card component.
|
|
1298
|
+
* @returns {VNode} 2nd box layout virtual node.
|
|
1299
|
+
*/
|
|
1300
|
+
function create2$6(component) {
|
|
1301
|
+
const rows = [];
|
|
1302
|
+
for (let index$1 = 0; index$1 < component.data.cell.length; index$1++) {
|
|
1303
|
+
const cell = component.data.cell[index$1];
|
|
1304
|
+
const column = component.data.columns[index$1];
|
|
1305
|
+
const props = {
|
|
1306
|
+
cell: cell,
|
|
1307
|
+
column: column,
|
|
1308
|
+
component: component,
|
|
1309
|
+
density: kupManager.FCellPadding.NONE,
|
|
1310
|
+
renderKup: true,
|
|
1311
|
+
row: { cells: { [column.name]: cell } },
|
|
1312
|
+
};
|
|
1313
|
+
rows.push(index.h("div", { class: "flex-container" },
|
|
1314
|
+
index.h("div", { class: "label" }, column.title),
|
|
1315
|
+
index.h("div", { class: "value" },
|
|
1316
|
+
index.h(fCell.FCell, Object.assign({}, props)))));
|
|
1317
|
+
}
|
|
1318
|
+
return (index.h("div", { class: `box-layout-${component.layoutNumber}` },
|
|
1319
|
+
index.h("div", { class: "container" }, rows)));
|
|
1320
|
+
}
|
|
1321
|
+
/**
|
|
1322
|
+
* 3rd box card layout, it can be used as a key-value row list.
|
|
1323
|
+
* @param {KupCard} component - Card component.
|
|
1324
|
+
* @returns {VNode} 3rd box layout virtual node.
|
|
1325
|
+
*/
|
|
1326
|
+
function create3$4(component) {
|
|
1327
|
+
const rows = [];
|
|
1328
|
+
for (let index$1 = 0; index$1 < component.data.cell.length; index$1++) {
|
|
1329
|
+
const cell = component.data.cell[index$1];
|
|
1330
|
+
const column = component.data.columns[index$1];
|
|
1331
|
+
const props = {
|
|
1332
|
+
cell: cell,
|
|
1333
|
+
column: column,
|
|
1334
|
+
component: component,
|
|
1335
|
+
density: kupManager.FCellPadding.NONE,
|
|
1336
|
+
renderKup: true,
|
|
1337
|
+
row: { cells: { [column.name]: cell } },
|
|
1338
|
+
};
|
|
1339
|
+
rows.push(index.h("div", { class: "flex-container" },
|
|
1340
|
+
index.h("div", { class: "label" }, column.title),
|
|
1341
|
+
index.h("div", { class: "value" },
|
|
1342
|
+
index.h(fCell.FCell, Object.assign({}, props)))));
|
|
1343
|
+
}
|
|
1344
|
+
return (index.h("div", { class: `box-layout-${component.layoutNumber}` },
|
|
1345
|
+
index.h("div", { class: "container" }, rows)));
|
|
1346
|
+
}
|
|
1347
|
+
/**
|
|
1348
|
+
* 4th box card layout, image and value.
|
|
1349
|
+
* @param {KupCard} component - Card component.
|
|
1350
|
+
* @returns {VNode} 4th box layout virtual node.
|
|
1351
|
+
*/
|
|
1352
|
+
function create4$4(component) {
|
|
1353
|
+
const cells = component.data.cell;
|
|
1354
|
+
const columns = component.data.columns;
|
|
1355
|
+
let image = null;
|
|
1356
|
+
let value = null;
|
|
1357
|
+
for (let index = 0; index < cells.length; index++) {
|
|
1358
|
+
const cell = cells[index];
|
|
1359
|
+
if ((!image &&
|
|
1360
|
+
(dom$7.ketchup.objects.isImage(cell.obj) ||
|
|
1361
|
+
dom$7.ketchup.objects.isIcon(cell.obj))) ||
|
|
1362
|
+
cell.shape === kupManager.FCellShapes.IMAGE) {
|
|
1363
|
+
image = index;
|
|
1364
|
+
if (!cell.data) {
|
|
1365
|
+
cell.data = { resource: cell.value };
|
|
1366
|
+
}
|
|
1367
|
+
}
|
|
1368
|
+
if (!value && !dom$7.ketchup.objects.isImage(cell.obj)) {
|
|
1369
|
+
value = index;
|
|
1370
|
+
}
|
|
1371
|
+
}
|
|
1372
|
+
const imageProps = {
|
|
1373
|
+
cell: cells[image],
|
|
1374
|
+
column: columns[image],
|
|
1375
|
+
component: component,
|
|
1376
|
+
density: kupManager.FCellPadding.NONE,
|
|
1377
|
+
renderKup: true,
|
|
1378
|
+
row: { cells: { [columns[image].name]: cells[image] } },
|
|
1379
|
+
wrapperClass: 'c-centered',
|
|
1380
|
+
};
|
|
1381
|
+
const valueProps = {
|
|
1382
|
+
cell: cells[value],
|
|
1383
|
+
column: columns[value],
|
|
1384
|
+
component: component,
|
|
1385
|
+
density: kupManager.FCellPadding.NONE,
|
|
1386
|
+
renderKup: true,
|
|
1387
|
+
row: { cells: { [columns[value].name]: cells[value] } },
|
|
1388
|
+
wrapperClass: 'c-centered',
|
|
1389
|
+
};
|
|
1390
|
+
return (index.h("div", { class: `box-layout-${component.layoutNumber}` },
|
|
1391
|
+
index.h("div", { class: "container" },
|
|
1392
|
+
index.h("div", { class: "image" },
|
|
1393
|
+
index.h(fCell.FCell, Object.assign({}, imageProps))),
|
|
1394
|
+
index.h("div", { class: "value" },
|
|
1395
|
+
index.h(fCell.FCell, Object.assign({}, valueProps))))));
|
|
1396
|
+
}
|
|
1397
|
+
|
|
1398
|
+
const boxLayouts = /*#__PURE__*/Object.freeze({
|
|
1399
|
+
__proto__: null,
|
|
1400
|
+
create1: create1$6,
|
|
1401
|
+
create2: create2$6,
|
|
1402
|
+
create3: create3$4,
|
|
1403
|
+
create4: create4$4
|
|
1404
|
+
});
|
|
1405
|
+
|
|
1268
1406
|
/**
|
|
1269
1407
|
* Props of the kup-date-picker component.
|
|
1270
1408
|
* Used to export every prop in an object.
|
|
@@ -3246,6 +3384,60 @@ function create8$1(component) {
|
|
|
3246
3384
|
index.h("div", null, textArray[textIndex] ? textArray[textIndex] : '')),
|
|
3247
3385
|
index.h("div", { class: "descr" },
|
|
3248
3386
|
index.h("div", null, textArray[++textIndex] ? textArray[textIndex] : '')))));
|
|
3387
|
+
}
|
|
3388
|
+
/**
|
|
3389
|
+
* 9th scalable card layout, tile view.
|
|
3390
|
+
* @param {KupCard} component - Card component.
|
|
3391
|
+
* @returns {VNode} 8th scalable layout virtual node.
|
|
3392
|
+
*/
|
|
3393
|
+
function create9$1(component) {
|
|
3394
|
+
// color line
|
|
3395
|
+
const lineBg = component.data.color && component.data.color.length > 0
|
|
3396
|
+
? component.data.color[0]
|
|
3397
|
+
: `var(${kupManager.KupThemeColorValues.PRIMARY})`;
|
|
3398
|
+
// color component
|
|
3399
|
+
const componentBg = component.data.color && component.data.color.length > 1
|
|
3400
|
+
? component.data.color[1]
|
|
3401
|
+
: `var(${kupManager.KupThemeColorValues.BACKGROUND})`;
|
|
3402
|
+
// color text
|
|
3403
|
+
const textFg = component.data.color && component.data.color.length > 2
|
|
3404
|
+
? component.data.color[2]
|
|
3405
|
+
: `var(${kupManager.KupThemeColorValues.TEXT})`;
|
|
3406
|
+
// Main text
|
|
3407
|
+
const mainText = component.data.text && component.data.text.length > 0
|
|
3408
|
+
? component.data.text[0]
|
|
3409
|
+
: null;
|
|
3410
|
+
// Sub text
|
|
3411
|
+
const subText = component.data.text && component.data.text.length > 1
|
|
3412
|
+
? component.data.text[1]
|
|
3413
|
+
: null;
|
|
3414
|
+
// Buttons area
|
|
3415
|
+
const buttons = component.data.button && component.data.button.length > 0
|
|
3416
|
+
? JSON.parse(JSON.stringify(component.data.button))
|
|
3417
|
+
: [];
|
|
3418
|
+
// Only 4 buttons supported
|
|
3419
|
+
if (buttons.length > 4) {
|
|
3420
|
+
buttons.splice(4, buttons.length - 4);
|
|
3421
|
+
}
|
|
3422
|
+
buttons.reverse();
|
|
3423
|
+
//Dynamic CSS variables
|
|
3424
|
+
const CSSVariables = {
|
|
3425
|
+
['--color-0']: lineBg,
|
|
3426
|
+
['--color-1']: componentBg,
|
|
3427
|
+
['--color-2']: textFg,
|
|
3428
|
+
};
|
|
3429
|
+
const CSSVariablesChild = {
|
|
3430
|
+
['--kup_card_multiplier']: '1',
|
|
3431
|
+
['box-shadow']: 'none',
|
|
3432
|
+
};
|
|
3433
|
+
return (index.h("div", { class: `scalable-layout-${component.layoutNumber}`, style: CSSVariables },
|
|
3434
|
+
index.h("div", { class: "section-1" }),
|
|
3435
|
+
index.h("div", { class: "section-2" },
|
|
3436
|
+
index.h("div", { class: "scalable-card", style: CSSVariablesChild },
|
|
3437
|
+
index.h("div", { class: "text scalable-element" },
|
|
3438
|
+
index.h("div", { class: "value" }, mainText),
|
|
3439
|
+
index.h("div", { class: "descr" }, subText))),
|
|
3440
|
+
buttons.length > 0 ? (index.h("div", { class: "buttons" }, buttons.map((b) => (index.h(fButton.FButton, { icon: b.icon, title: b.title, styling: b.styling, wrapperClass: b.class, onClick: () => component.onKupClick(component.rootElement.id, b.id) }))))) : undefined)));
|
|
3249
3441
|
}
|
|
3250
3442
|
|
|
3251
3443
|
const scalableLayouts = /*#__PURE__*/Object.freeze({
|
|
@@ -3257,7 +3449,8 @@ const scalableLayouts = /*#__PURE__*/Object.freeze({
|
|
|
3257
3449
|
create5: create5$1,
|
|
3258
3450
|
create6: create6$1,
|
|
3259
3451
|
create7: create7$1,
|
|
3260
|
-
create8: create8$1
|
|
3452
|
+
create8: create8$1,
|
|
3453
|
+
create9: create9$1
|
|
3261
3454
|
});
|
|
3262
3455
|
|
|
3263
3456
|
const dom$1 = document.documentElement;
|
|
@@ -3998,6 +4191,20 @@ function create15(component) {
|
|
|
3998
4191
|
genericButtons.push(button);
|
|
3999
4192
|
}
|
|
4000
4193
|
}
|
|
4194
|
+
const createDropdown = () => {
|
|
4195
|
+
const props = {
|
|
4196
|
+
data: { 'kup-list': { data: [], showIcons: true } },
|
|
4197
|
+
dropdownOnly: true,
|
|
4198
|
+
icon: 'more_vert',
|
|
4199
|
+
id: 'options',
|
|
4200
|
+
styling: fButtonDeclarations.FButtonStyling.ICON,
|
|
4201
|
+
};
|
|
4202
|
+
for (let index = 5; index < genericButtons.length; index++) {
|
|
4203
|
+
const button = genericButtons[index];
|
|
4204
|
+
props.data['kup-list'].data.push(Object.assign(Object.assign({}, button), { value: button.title }));
|
|
4205
|
+
}
|
|
4206
|
+
return (index.h("kup-dropdown-button", Object.assign({}, props, { title: dom$1.ketchup.language.translate(kupManager.KupLanguageGeneric.OPTIONS) })));
|
|
4207
|
+
};
|
|
4001
4208
|
return (index.h("div", { class: `standard-layout-${component.layoutNumber}` },
|
|
4002
4209
|
index.h("div", { class: "section-1" },
|
|
4003
4210
|
imageArray[0] ? (index.h(fImage.FImage, Object.assign({ id: "image1" }, imageArray[0], { sizeX: "84px", sizeY: "84px" }))) : (index.h("div", { class: "sub-spinner" },
|
|
@@ -4023,33 +4230,8 @@ function create15(component) {
|
|
|
4023
4230
|
index.h("div", { class: `${kupManager.KupCardCSSClasses.CARD_VIEW} ${kupManager.KupCardCSSClasses.VIEW_PREFIX}${viewIndex + 1}` }, treeArray[0] ? (index.h("kup-tree", Object.assign({ class: "kup-full-width" }, treeArray[0]))) : null)),
|
|
4024
4231
|
genericButtons.length > 0 ? (index.h("div", { class: "section-3" },
|
|
4025
4232
|
compList(genericButtons.slice(0, 5), 'button'),
|
|
4026
|
-
|
|
4027
|
-
}
|
|
4028
|
-
/**
|
|
4029
|
-
* 16th standard card layout, it can be used as a key-value grid list.
|
|
4030
|
-
* @param {KupCard} component - Card component.
|
|
4031
|
-
* @returns {VNode} 16th standard layout virtual node.
|
|
4032
|
-
*/
|
|
4033
|
-
function create16(component) {
|
|
4034
|
-
const rows = [];
|
|
4035
|
-
for (let index$1 = 0; index$1 < component.data.cell.length; index$1++) {
|
|
4036
|
-
const cell = component.data.cell[index$1];
|
|
4037
|
-
const column = component.data.columns[index$1];
|
|
4038
|
-
const props = {
|
|
4039
|
-
cell: cell,
|
|
4040
|
-
column: column,
|
|
4041
|
-
component: component,
|
|
4042
|
-
density: kupManager.FCellPadding.NONE,
|
|
4043
|
-
renderKup: true,
|
|
4044
|
-
row: { cells: { [column.name]: cell } },
|
|
4045
|
-
};
|
|
4046
|
-
rows.push(index.h("tr", null,
|
|
4047
|
-
index.h("td", { class: "label" }, column.title),
|
|
4048
|
-
index.h("td", { class: "value" },
|
|
4049
|
-
index.h(fCell.FCell, Object.assign({}, props)))));
|
|
4050
|
-
}
|
|
4051
|
-
return (index.h("div", { class: `standard-layout-${component.layoutNumber}` },
|
|
4052
|
-
index.h("table", null, rows)));
|
|
4233
|
+
genericButtons.length > 5 ? createDropdown() : null,
|
|
4234
|
+
treeArray[0] ? (index.h("kup-button", { title: dom$1.ketchup.language.translate(kupManager.KupLanguageGeneric.SHOW_ROW_OPTIONS), id: "view-selector", icon: "menu" })) : null)) : null));
|
|
4053
4235
|
}
|
|
4054
4236
|
|
|
4055
4237
|
const standardLayouts = /*#__PURE__*/Object.freeze({
|
|
@@ -4068,8 +4250,7 @@ const standardLayouts = /*#__PURE__*/Object.freeze({
|
|
|
4068
4250
|
create12: create12,
|
|
4069
4251
|
create13: create13,
|
|
4070
4252
|
create14: create14,
|
|
4071
|
-
create15: create15
|
|
4072
|
-
create16: create16
|
|
4253
|
+
create15: create15
|
|
4073
4254
|
});
|
|
4074
4255
|
|
|
4075
4256
|
/*!
|
|
@@ -5072,7 +5253,7 @@ var Picker = function () {
|
|
|
5072
5253
|
Picker.StyleElement = style;
|
|
5073
5254
|
}
|
|
5074
5255
|
|
|
5075
|
-
const kupCardCss = ".built-in-layout-1{background-color:var(--kup-background-color);border-radius:4px;box-sizing:border-box;box-shadow:0 2px 1px -1px rgba(128, 128, 128, 0.1), 0 1px 1px 0 rgba(128, 128, 128, 0.1), 0 1px 3px 0 rgba(128, 128, 128, 0.6);display:flex;flex-direction:column;height:100%;position:relative;width:100%;overflow:auto;padding:0.5em}.built-in-layout-1 .section-1{box-sizing:border-box;height:5em;overflow:auto;padding-bottom:1em;width:100%}.built-in-layout-1 .section-1 .sub-1{display:flex;flex-direction:row;justify-content:center}.built-in-layout-1 .section-2{height:calc(100% - 60px);overflow:auto;width:100%}.built-in-layout-1 .prev-page{margin-left:auto}.built-in-layout-1 .change-view-button{margin:auto;width:12em;text-align:center}.built-in-layout-1 #change-view-button button{text-transform:capitalize}.built-in-layout-1 .next-page{margin-right:auto}.built-in-layout-1 .calendar{border-collapse:collapse;width:100%}.built-in-layout-1 thead{border-bottom:1px solid var(--kup-border-color)}.built-in-layout-1 .item-text{color:rgba(var(--kup-text-color-rgb), 0.5)}.built-in-layout-1 .item{text-align:center}.built-in-layout-1 .item:not(.selected) .item-number:hover{background-color:var(--kup-hover-background-color)}.built-in-layout-1 .item.selected .item-number,.built-in-layout-1 .item.selected .item-number:hover{background-color:rgba(var(--kup-primary-color-rgb), 0.175)}.built-in-layout-1 .item-number{border-radius:50%;cursor:pointer;display:flex;justify-content:center;line-height:2.5em;margin:auto;width:2.5em;transition:background-color 0.25s;text-transform:capitalize}.built-in-layout-2{background-color:var(--kup-background-color);border-radius:4px;box-sizing:border-box;box-shadow:0 2px 1px -1px rgba(128, 128, 128, 0.1), 0 1px 1px 0 rgba(128, 128, 128, 0.1), 0 1px 3px 0 rgba(128, 128, 128, 0.6);display:flex;flex-direction:column;height:100%;position:relative;width:100%;overflow:auto}.built-in-layout-2 .clock{box-shadow:var(--kup-box-shadow);width:300px;height:450px;background-color:var(--kup-background-color);position:relative;font-family:var(--kup-font-family)}.built-in-layout-2 .top{background-color:var(--kup-primary-color);color:var(--kup-text-on-primary-color);height:100px;line-height:100px;font-size:50px;text-align:center}.built-in-layout-2 .top span{cursor:pointer;opacity:0.75;transition:0.25s ease-in-out}.built-in-layout-2 .top .visible{opacity:1}.built-in-layout-2 .circle{user-select:none;background-color:rgba(var(--kup-text-color-rgb), 0.1);width:250px;height:250px;border-radius:1000px;position:relative;top:25px;left:25px;box-sizing:border-box;display:none}.built-in-layout-2 .circle.visible{display:block}.built-in-layout-2 .mid{position:absolute;left:calc(50% - 0px);top:calc(50% - 0px);width:2px;height:2px;border-radius:10px;background-color:var(--kup-text-color)}.built-in-layout-2 .hour{position:absolute;height:40px;line-height:40px;width:40px;border-radius:40px;text-align:center}.built-in-layout-2 .hour.selected{z-index:2}.built-in-layout-2 .hour.selected::after{content:\"\";z-index:-1;background-color:rgba(var(--kup-primary-color-rgb), 0.5);height:1px;width:100%;position:absolute;transform:rotate(-90deg);transform-origin:100% 0%;top:50%;width:101px;right:50%}.built-in-layout-2 .hour2{z-index:2;position:absolute;height:30px;line-height:30px;width:30px;border-radius:40px;text-align:center;font-size:14px}.built-in-layout-2 .hour2.selected::after{content:\"\";background-color:rgba(var(--kup-primary-color-rgb), 0.5);height:1px;width:100%;position:absolute;transform:rotate(-90deg);transform-origin:100% 0%;top:50%;width:64px;right:50%;z-index:-1}.built-in-layout-2 .unit{position:absolute;height:20px;line-height:20px;width:20px;border-radius:40px;text-align:center;font-size:12px}.built-in-layout-2 .unit.selected::after{content:\"\";background-color:rgba(var(--kup-primary-color-rgb), 0.5);height:1px;width:100%;position:absolute;transform:rotate(-90deg);transform-origin:100% 0%;top:50%;width:101px;right:50%}.built-in-layout-2 .hour,.built-in-layout-2 .hour2,.built-in-layout-2 .unit{cursor:pointer;transition:background-color 0.25s}.built-in-layout-2 .hour:hover,.built-in-layout-2 .hour2:hover,.built-in-layout-2 .unit:hover{background-color:rgba(var(--kup-primary-color-rgb), 0.275)}.built-in-layout-2 .hour.selected,.built-in-layout-2 .hour2.selected,.built-in-layout-2 .unit.selected{background-color:var(--kup-primary-color);color:var(--kup-text-on-primary-color)}.built-in-layout-2 .actions{color:var(--kup-primary-color);font-weight:bold;font-size:20px;display:flex;justify-content:flex-end;position:absolute;width:100%;box-sizing:border-box;bottom:10px}.built-in-layout-2 .action{display:inline-block;width:100px;text-align:center;height:37.5px;line-height:37.5px;margin-right:10px;cursor:pointer;border-radius:2px}.built-in-layout-2 .clock .actions .action:hover{background-color:rgba(0, 0, 0, 0.1)}.built-in-layout-2 .clock .actions .action:visible{background-color:rgba(0, 0, 0, 0.3)}.built-in-layout-2 .hour:nth-child(12):after{transform:rotate(330deg)}.built-in-layout-2 .hour:nth-child(11):after{transform:rotate(300deg)}.built-in-layout-2 .hour:nth-child(10):after{transform:rotate(270deg)}.built-in-layout-2 .hour:nth-child(9):after{transform:rotate(240deg)}.built-in-layout-2 .hour:nth-child(8):after{transform:rotate(210deg)}.built-in-layout-2 .hour:nth-child(7):after{transform:rotate(180deg)}.built-in-layout-2 .hour:nth-child(6):after{transform:rotate(150deg)}.built-in-layout-2 .hour:nth-child(5):after{transform:rotate(120deg)}.built-in-layout-2 .hour:nth-child(4):after{transform:rotate(90deg)}.built-in-layout-2 .hour:nth-child(3):after{transform:rotate(60deg)}.built-in-layout-2 .hour:nth-child(2):after{transform:rotate(30deg)}.built-in-layout-2 .hour:nth-child(1):after{transform:rotate(0deg)}.built-in-layout-2 .hour2:nth-child(24):after{transform:rotate(690deg)}.built-in-layout-2 .hour2:nth-child(23):after{transform:rotate(660deg)}.built-in-layout-2 .hour2:nth-child(22):after{transform:rotate(630deg)}.built-in-layout-2 .hour2:nth-child(21):after{transform:rotate(600deg)}.built-in-layout-2 .hour2:nth-child(20):after{transform:rotate(570deg)}.built-in-layout-2 .hour2:nth-child(19):after{transform:rotate(540deg)}.built-in-layout-2 .hour2:nth-child(18):after{transform:rotate(510deg)}.built-in-layout-2 .hour2:nth-child(17):after{transform:rotate(480deg)}.built-in-layout-2 .hour2:nth-child(16):after{transform:rotate(450deg)}.built-in-layout-2 .hour2:nth-child(15):after{transform:rotate(420deg)}.built-in-layout-2 .hour2:nth-child(14):after{transform:rotate(390deg)}.built-in-layout-2 .hour2:nth-child(13):after{transform:rotate(360deg)}.built-in-layout-2 .unit:nth-child(60):after{transform:rotate(354deg)}.built-in-layout-2 .unit:nth-child(59):after{transform:rotate(348deg)}.built-in-layout-2 .unit:nth-child(58):after{transform:rotate(342deg)}.built-in-layout-2 .unit:nth-child(57):after{transform:rotate(336deg)}.built-in-layout-2 .unit:nth-child(56):after{transform:rotate(330deg)}.built-in-layout-2 .unit:nth-child(55):after{transform:rotate(324deg)}.built-in-layout-2 .unit:nth-child(54):after{transform:rotate(318deg)}.built-in-layout-2 .unit:nth-child(53):after{transform:rotate(312deg)}.built-in-layout-2 .unit:nth-child(52):after{transform:rotate(306deg)}.built-in-layout-2 .unit:nth-child(51):after{transform:rotate(300deg)}.built-in-layout-2 .unit:nth-child(50):after{transform:rotate(294deg)}.built-in-layout-2 .unit:nth-child(49):after{transform:rotate(288deg)}.built-in-layout-2 .unit:nth-child(48):after{transform:rotate(282deg)}.built-in-layout-2 .unit:nth-child(47):after{transform:rotate(276deg)}.built-in-layout-2 .unit:nth-child(46):after{transform:rotate(270deg)}.built-in-layout-2 .unit:nth-child(45):after{transform:rotate(264deg)}.built-in-layout-2 .unit:nth-child(44):after{transform:rotate(258deg)}.built-in-layout-2 .unit:nth-child(43):after{transform:rotate(252deg)}.built-in-layout-2 .unit:nth-child(42):after{transform:rotate(246deg)}.built-in-layout-2 .unit:nth-child(41):after{transform:rotate(240deg)}.built-in-layout-2 .unit:nth-child(40):after{transform:rotate(234deg)}.built-in-layout-2 .unit:nth-child(39):after{transform:rotate(228deg)}.built-in-layout-2 .unit:nth-child(38):after{transform:rotate(222deg)}.built-in-layout-2 .unit:nth-child(37):after{transform:rotate(216deg)}.built-in-layout-2 .unit:nth-child(36):after{transform:rotate(210deg)}.built-in-layout-2 .unit:nth-child(35):after{transform:rotate(204deg)}.built-in-layout-2 .unit:nth-child(34):after{transform:rotate(198deg)}.built-in-layout-2 .unit:nth-child(33):after{transform:rotate(192deg)}.built-in-layout-2 .unit:nth-child(32):after{transform:rotate(186deg)}.built-in-layout-2 .unit:nth-child(31):after{transform:rotate(180deg)}.built-in-layout-2 .unit:nth-child(30):after{transform:rotate(174deg)}.built-in-layout-2 .unit:nth-child(29):after{transform:rotate(168deg)}.built-in-layout-2 .unit:nth-child(28):after{transform:rotate(162deg)}.built-in-layout-2 .unit:nth-child(27):after{transform:rotate(156deg)}.built-in-layout-2 .unit:nth-child(26):after{transform:rotate(150deg)}.built-in-layout-2 .unit:nth-child(25):after{transform:rotate(144deg)}.built-in-layout-2 .unit:nth-child(24):after{transform:rotate(138deg)}.built-in-layout-2 .unit:nth-child(23):after{transform:rotate(132deg)}.built-in-layout-2 .unit:nth-child(22):after{transform:rotate(126deg)}.built-in-layout-2 .unit:nth-child(21):after{transform:rotate(120deg)}.built-in-layout-2 .unit:nth-child(20):after{transform:rotate(114deg)}.built-in-layout-2 .unit:nth-child(19):after{transform:rotate(108deg)}.built-in-layout-2 .unit:nth-child(18):after{transform:rotate(102deg)}.built-in-layout-2 .unit:nth-child(17):after{transform:rotate(96deg)}.built-in-layout-2 .unit:nth-child(16):after{transform:rotate(90deg)}.built-in-layout-2 .unit:nth-child(15):after{transform:rotate(84deg)}.built-in-layout-2 .unit:nth-child(14):after{transform:rotate(78deg)}.built-in-layout-2 .unit:nth-child(13):after{transform:rotate(72deg)}.built-in-layout-2 .unit:nth-child(12):after{transform:rotate(66deg)}.built-in-layout-2 .unit:nth-child(11):after{transform:rotate(60deg)}.built-in-layout-2 .unit:nth-child(10):after{transform:rotate(54deg)}.built-in-layout-2 .unit:nth-child(9):after{transform:rotate(48deg)}.built-in-layout-2 .unit:nth-child(8):after{transform:rotate(42deg)}.built-in-layout-2 .unit:nth-child(7):after{transform:rotate(36deg)}.built-in-layout-2 .unit:nth-child(6):after{transform:rotate(30deg)}.built-in-layout-2 .unit:nth-child(5):after{transform:rotate(24deg)}.built-in-layout-2 .unit:nth-child(4):after{transform:rotate(18deg)}.built-in-layout-2 .unit:nth-child(3):after{transform:rotate(12deg)}.built-in-layout-2 .unit:nth-child(2):after{transform:rotate(6deg)}.built-in-layout-2 .unit:nth-child(1):after{transform:rotate(0deg)}.built-in-layout-3{background:var(--kup-background-color);box-shadow:rgba(128, 128, 128, 0.1) 0px 2px 1px -1px, rgba(128, 128, 128, 0.1) 0px 1px 1px 0px, rgba(128, 128, 128, 0.6) 0px 1px 3px 0px;box-sizing:border-box;overflow:auto}.built-in-layout-3 kup-button,.built-in-layout-3 kup-combobox{margin:0 auto 0.75em auto}.built-in-layout-3 kup-combobox{width:95%}.built-in-layout-3 .sub-chip{border-top:1px solid var(--kup-border-color);max-height:33vh;overflow:auto;width:100%}.built-in-layout-4{background:var(--kup-background-color);box-shadow:rgba(128, 128, 128, 0.1) 0px 2px 1px -1px, rgba(128, 128, 128, 0.1) 0px 1px 1px 0px, rgba(128, 128, 128, 0.6) 0px 1px 3px 0px;box-sizing:border-box}.built-in-layout-4 .picker_arrow{position:absolute;z-index:-1}.built-in-layout-4 .picker_wrapper.popup{position:absolute;z-index:2;margin:1.5em}.built-in-layout-4 .picker_wrapper.popup,.built-in-layout-4 .picker_wrapper.popup .picker_arrow::before,.built-in-layout-4 .picker_wrapper.popup .picker_arrow::after{background:var(--kup-background-color);box-shadow:0 0 10px 1px rgba(0, 0, 0, 0.4)}.built-in-layout-4 .picker_wrapper.popup .picker_arrow{width:3em;height:3em;margin:0}.built-in-layout-4 .picker_wrapper.popup .picker_arrow::before,.built-in-layout-4 .picker_wrapper.popup .picker_arrow::after{content:\"\";display:block;position:absolute;top:0;left:0;z-index:-99}.built-in-layout-4 .picker_wrapper.popup .picker_arrow::before{width:100%;height:100%;transform:skew(45deg);transform-origin:0 100%}.built-in-layout-4 .picker_wrapper.popup .picker_arrow::after{width:150%;height:150%;box-shadow:none}.built-in-layout-4 .popup.popup_top{bottom:100%;left:0}.built-in-layout-4 .popup.popup_top .picker_arrow{bottom:0;left:0;transform:rotate(-90deg)}.built-in-layout-4 .popup.popup_bottom{top:100%;left:0}.built-in-layout-4 .popup.popup_bottom .picker_arrow{top:0;left:0;transform:rotate(90deg) scale(1, -1)}.built-in-layout-4 .popup.popup_left{top:0;right:100%}.built-in-layout-4 .popup.popup_left .picker_arrow{top:0;right:0;transform:scale(-1, 1)}.built-in-layout-4 .popup.popup_right{top:0;left:100%}.built-in-layout-4 .popup.popup_right .picker_arrow{top:0;left:0}.built-in-layout-4 .picker_wrapper.no_alpha .picker_alpha{display:none}.built-in-layout-4 .picker_wrapper.no_editor .picker_editor{position:absolute;z-index:-1;opacity:0}.built-in-layout-4 .picker_wrapper.no_cancel .picker_cancel{display:none}.built-in-layout-4 .layout_default.picker_wrapper{display:flex;flex-flow:row wrap;justify-content:space-between;align-items:stretch;font-size:10px;width:25em;padding:0.5em}.built-in-layout-4 .layout_default.picker_wrapper input,.built-in-layout-4 .layout_default.picker_wrapper button{font-size:1em}.built-in-layout-4 .layout_default.picker_wrapper>*{margin:0.5em}.built-in-layout-4 .layout_default.picker_wrapper::before{content:\"\";display:block;width:100%;height:0;order:1}.built-in-layout-4 .layout_default .picker_slider,.built-in-layout-4 .layout_default .picker_selector{padding:1em}.built-in-layout-4 .layout_default .picker_hue{width:100%}.built-in-layout-4 .layout_default .picker_sl{flex:1 1 auto}.built-in-layout-4 .layout_default .picker_sl::before{content:\"\";display:block;padding-bottom:100%}.built-in-layout-4 .layout_default .picker_editor{order:1;width:6.5em}.built-in-layout-4 .layout_default .picker_editor input{width:100%;height:100%}.built-in-layout-4 .layout_default .picker_sample{order:1;flex:1 1 auto}.built-in-layout-4 .layout_default .picker_done,.built-in-layout-4 .layout_default .picker_cancel{order:1}.built-in-layout-4 .picker_wrapper{box-sizing:border-box;background:var(--kup-background-color);box-shadow:0 0 0 1px var(--kup-border-color);cursor:default;font-family:sans-serif;color:#444;pointer-events:auto}.built-in-layout-4 .picker_wrapper:focus{outline:none}.built-in-layout-4 .picker_wrapper button,.built-in-layout-4 .picker_wrapper input{box-sizing:border-box;border:none;box-shadow:0 0 0 1px var(--kup-border-color);outline:none}.built-in-layout-4 .picker_wrapper button:focus,.built-in-layout-4 .picker_wrapper button:active,.built-in-layout-4 .picker_wrapper input:focus,.built-in-layout-4 .picker_wrapper input:active{box-shadow:0 0 2px 1px var(--kup-border-color)}.built-in-layout-4 .picker_wrapper button{padding:0.4em 0.6em;cursor:pointer;background-color:whitesmoke;background-image:linear-gradient(0deg, gainsboro, transparent)}.built-in-layout-4 .picker_wrapper button:active{background-image:linear-gradient(0deg, transparent, gainsboro)}.built-in-layout-4 .picker_selector{position:absolute;z-index:1;display:block;transform:translate(-50%, -50%);border:2px solid white;border-radius:100%;box-shadow:0 0 3px 1px #67b9ff;background:currentColor;cursor:pointer}.built-in-layout-4 .picker_slider .picker_selector{border-radius:2px}.built-in-layout-4 .picker_hue{position:relative;background-image:linear-gradient(90deg, red, yellow, lime, cyan, blue, magenta, red);box-shadow:0 0 0 1px var(--kup-border-color)}.built-in-layout-4 .picker_sl{position:relative;box-shadow:0 0 0 1px var(--kup-border-color);background-image:linear-gradient(180deg, white, rgba(255, 255, 255, 0) 50%), linear-gradient(0deg, black, rgba(0, 0, 0, 0) 50%), linear-gradient(90deg, #808080, rgba(128, 128, 128, 0))}.built-in-layout-4 .picker_alpha,.built-in-layout-4 .picker_sample{position:relative;background:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='2' height='2'%3E%3Cpath d='M1,0H0V1H2V2H1' fill='lightgrey'/%3E%3C/svg%3E\") left top/contain white;box-shadow:0 0 0 1px var(--kup-border-color)}.built-in-layout-4 .picker_alpha .picker_selector,.built-in-layout-4 .picker_sample .picker_selector{background:none}.built-in-layout-4 .picker_editor input{font-family:monospace;padding:0.2em 0.4em}.built-in-layout-4 .picker_sample::before{content:\"\";position:absolute;display:block;width:100%;height:100%;background:currentColor}.built-in-layout-4 .picker_done,.built-in-layout-4 .picker_arrow{display:none}.built-in-layout-4 .layout_default.picker_wrapper{bottom:unset;font-size:var(--kup-font-size);left:unset;padding:0.25em;right:unset;top:unset;width:100%}.built-in-layout-4 .layout_default .picker_editor input{background:none;color:var(--kup-text-color);font-family:var(--kup-font-family);font-size:var(--kup-font-size)}.built-in-layout-4 .picker_wrapper.popup{box-shadow:var(--kup-box-shadow);margin:0;outline:none}.built-in-layout-5{background:var(--kup-background-color);box-shadow:var(--kup-box-shadow);box-sizing:border-box;overflow:auto;padding:0.5em}.built-in-layout-5>table{width:100%}.built-in-layout-5>table>tr>td>div.value{text-align:right;color:var(--kup-primary-color);border-bottom:1px solid var(--kup-border-color);min-height:1.5em}.built-in-layout-5>table>tr>td>.f-button{display:flex;justify-content:center}.built-in-layout-5>table>tr>td>div.number{border-radius:50%;cursor:pointer;display:flex;justify-content:center;line-height:2.5em;margin:auto;width:2.5em;transition:background-color 0.25s;text-transform:capitalize}.built-in-layout-5>table>tr>td>div.number:hover{background-color:var(--kup-hover-background-color)}.collapsible-layout-1{color:var(--kup-text-color);box-shadow:0px 0px 7.5px 0px rgba(128, 128, 128, 0.5);display:flex;height:100%;overflow:hidden;width:100%;box-sizing:border-box;position:relative}.collapsible-layout-1 .section-1{background-color:var(--color-0);display:flex;flex:0 0 10%;max-width:10%}.collapsible-layout-1 .section-2{box-sizing:border-box;height:100%;display:flex;flex:0 0 90%;flex-direction:column;max-width:90%}.collapsible-layout-1 .section-2 .sub-1{min-height:1.5em;display:flex;padding:0.6rem 0.8em 0;font-weight:bold;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.collapsible-layout-1 .section-2 .sub-1 div{font-size:1em}.collapsible-layout-1 .section-2 .sub-1 .left{text-align:left;width:80%}.collapsible-layout-1 .section-2 .sub-1 .right{text-align:right;width:20%}.collapsible-layout-1 .section-2 .sub-2{text-align:left;padding:0.6em 0.8em;font-size:0.875em}.collapsible-layout-2{color:var(--kup-text-color);box-shadow:rgba(0, 0, 0, 0.2) 0px 2px 1px -1px, rgba(0, 0, 0, 0.14) 0px 1px 1px 0px, rgba(0, 0, 0, 0.12) 0px 1px 3px 0px;border-radius:4px;display:flex;height:100%;overflow:hidden;width:100%;box-sizing:border-box;position:relative}.collapsible-layout-2 .section-1{box-sizing:border-box;height:100%;display:flex;flex-direction:column;max-width:100%;width:100%}.collapsible-layout-2 .section-1 .sub-1{text-align:left;padding:0.6em 0.8em 0;font-size:1em;font-weight:bold;max-width:75%}.collapsible-layout-2 .section-1 .sub-2{text-align:left;padding:0.6em 0.8em;max-width:75%}.collapsible-layout-2 .section-1 .sub-2 div{font-size:0.875em}.collapsible-layout-2 .section-1 .sub-3{color:var(--color-0);text-align:center;position:absolute;top:1em;right:1em;max-width:25%;text-overflow:ellipsis;overflow:hidden;max-height:calc(24px + 2.25em);padding:0 1em}.collapsible-layout-2 .section-1 .sub-3 kup-image{margin:auto}.collapsible-layout-2 .section-1 .sub-3 div{font-size:1.25em}.collapsible-card .collapsible-trigger{display:none;position:absolute;bottom:0;left:0;height:50px;width:100%}.collapsible-card .collapsible-trigger kup-button{margin:auto;width:48px}.collapsible-card .collapsible-wrapper{overflow:auto}.collapsible-card.collapsible-active{padding-bottom:50px}.collapsible-card.collapsible-active .collapsible-trigger{display:block}.dialog-layout-1{background-color:var(--kup-background-color);box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);color:var(--kup-text-color);display:flex;flex-direction:column;height:100%;width:100%;overflow:auto}.dialog-layout-1 .section-1{display:grid;grid-gap:0.5em;grid-template-columns:repeat(2, auto);grid-template-rows:repeat(auto-fill, 1.25em);height:100%;padding:0.5em;overflow:auto;touch-action:none}.dialog-layout-1 .section-1 .text{min-width:max-content}.dialog-layout-1 .section-1 .text:not(.label){font-weight:bold}.dialog-layout-2{background-color:var(--kup-background-color);box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);display:flex;flex-direction:column;height:100%;width:100%}.dialog-layout-2 .section-1{text-align:center;touch-action:none;padding-bottom:1em}.dialog-layout-2 .section-1 .text{padding-top:0.75em}.dialog-layout-2 .section-1 .text:not(.label){font-weight:bold}.dialog-layout-2 .section-2{border-top:1px solid var(--kup-border-color);display:grid;grid-gap:0.5em;grid-template-columns:repeat(2, auto);grid-template-rows:repeat(auto-fill, 1.25em);height:100%;padding:0.5em;overflow:auto;touch-action:none}.dialog-layout-2 .section-2 .text{min-width:max-content}.dialog-layout-2 .section-2 .text:not(.label){font-weight:bold}.dialog-layout-3{background-color:var(--kup-background-color);border-radius:4px;box-sizing:border-box;box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);display:flex;overflow:visible;flex-direction:column;height:100%;position:relative;width:100%}.dialog-layout-3 kup-button{margin-left:0}.dialog-layout-3 .section-1{background-color:var(--kup-background-color);display:flex;justify-content:flex-start;align-items:center;box-sizing:border-box;box-shadow:0px 1px 3px 0px var(--kup-text-color);height:52px;width:100%;text-align:right;touch-action:none}.dialog-layout-3 .section-1 kup-button{margin-right:0.25em}.dialog-layout-3 .section-2{height:100%;width:100%;overflow:auto;max-height:50vh}.dialog-layout-3 ::slotted(.text){color:var(--kup-text-color);font-family:var(--kup-font-family-monospace);white-space:nowrap;border-bottom:1px solid var(--kup-border-color);line-height:1.75em}.dialog-layout-4{background-color:var(--kup-background-color);box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);display:flex;flex-direction:column;height:100%;width:100%}.dialog-layout-4 .section-1{display:flex;justify-content:space-evenly}.dialog-layout-4 .section-2{height:100%;overflow:auto;padding:0.25em;touch-action:none}.dialog-layout-5{background-color:var(--kup-background-color);box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);display:flex;flex-direction:column;height:100%;width:100%}.dialog-layout-5 .section-1{display:flex;justify-content:space-evenly}.dialog-layout-5 .section-2{height:100%;overflow:auto}.dialog-layout-6{background-color:var(--kup-background-color);box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);display:flex;flex-direction:column;height:100%;max-height:95vh;max-width:95vw;width:100%}.dialog-layout-6 .section-1{display:flex;height:100%;justify-content:space-evenly;overflow:auto}.dialog-layout-6 kup-data-table{width:100%}#drag-handle{-ms-touch-action:none;touch-action:none}#drag-handle:not(.header-bar){display:flex;height:100%}#drag-handle:not(.header-bar) .f-image{margin:auto}#drag-handle.header-bar{background-color:var(--kup-title-background-color);color:var(--kup-title-color);display:flex;flex-direction:row;height:2em;position:relative;width:100%}#drag-handle.header-bar .dialog-title{font-weight:bold;line-height:2em;padding-left:0.5em;padding-right:2em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#drag-handle.header-bar #dialog-close{cursor:pointer;margin-right:0;transition:opacity 0.25s;position:absolute;right:0;background:var(--kup-title-background-color)}#drag-handle.header-bar #dialog-close:hover{opacity:0.5}.free-layout-1{background:var(--kup-background-color);box-shadow:var(--kup-box-shadow);box-sizing:border-box;overflow:auto;padding:1em}.free-layout-2{background:var(--kup-background-color);box-shadow:var(--kup-box-shadow);box-sizing:border-box;overflow:auto}.scalable-layout-1 .descr{font-size:70%;width:100%}.scalable-layout-1 .value{font-size:220%}.scalable-layout-2 #image1 img{object-fit:contain}.scalable-layout-2 .scalable-element{display:grid;grid-template-columns:1fr 1fr 0.5fr 0.5fr}.scalable-layout-2 .icon{margin:auto;font-size:150%;margin-right:5%}.scalable-layout-2 .value-int{font-size:250%}.scalable-layout-2 .value-dec,.scalable-layout-2 .unit{font-size:130%;margin-top:auto;margin-bottom:10%}.scalable-layout-2 .value-dec{margin-left:2%}.scalable-layout-2 .unit{margin-left:4%}.scalable-layout-3 .descr{font-size:70%;width:100%}.scalable-layout-3 .value{font-size:220%}.scalable-layout-4 #image1 img{object-fit:contain}.scalable-layout-4 .scalable-element{display:grid;grid-template-columns:1fr 5fr}.scalable-layout-4 .icon{font-size:150%;margin:auto 5% auto auto}.scalable-layout-4 .value-and-unit{display:flex;color:var(--color-0)}.scalable-layout-4 .value-and-unit .value-int{font-size:250%}.scalable-layout-4 .value-and-unit .value-dec,.scalable-layout-4 .value-and-unit .unit{font-size:130%;margin-top:auto;margin-bottom:10%}.scalable-layout-4 .value-and-unit .value-dec{margin-left:2%}.scalable-layout-4 .value-and-unit .unit{margin-left:4%}.scalable-layout-4 .descr{margin-left:4%;text-align:left;font-size:80%;width:100%;min-width:max-content}.scalable-layout-5 #image1 img{object-fit:contain}.scalable-layout-5 .scalable-element{display:flex}.scalable-layout-5 .text-wrapper{margin-right:10px}.scalable-layout-5 .icon{font-size:150%;margin:auto;margin-bottom:0.35em}.scalable-layout-5 .value{font-size:200%}.scalable-layout-5 .descr{text-align:right;font-size:65%;width:100%;min-width:max-content;position:relative;bottom:-10%}.scalable-layout-6 #image1 img{object-fit:contain}.scalable-layout-6 .scalable-element{display:flex;justify-content:space-between}.scalable-layout-6 .text-wrapper{margin-left:1em}.scalable-layout-6 .icon{font-size:150%;margin:auto}.scalable-layout-6 .value{font-size:220%;text-align:right}.scalable-layout-6 .descr{font-size:80%;text-align:right;width:100%;min-width:max-content}.scalable-layout-7 #image1 img{object-fit:contain}.scalable-layout-7 .scalable-element{display:flex}.scalable-layout-7 .text-wrapper{margin-right:0.5em}.scalable-layout-7 .icon{font-size:150%;margin:auto;margin-top:0.35em}.scalable-layout-7 .value{font-size:200%}.scalable-layout-7 .descr{text-align:right;font-size:65%;width:100%;min-width:max-content;position:relative;bottom:10%}.scalable-layout-8 #image1 img{object-fit:contain}.scalable-layout-8 .scalable-element{align-items:center;display:grid;grid-template-columns:0.25fr 1.25fr 0.25fr}.scalable-layout-8 .icon{margin-right:4%;font-size:75%}.scalable-layout-8 .value{margin:0 10%;font-size:250%}.scalable-layout-8 .descr{font-size:60%;text-align:left}.scalable-card{align-items:center;box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);border-radius:4px;display:flex;font-size:calc(var(--kup-font-size) * var(--kup_card_multiplier));height:100%;justify-content:center;position:relative;text-align:center;word-break:normal;width:100%}.standard-layout-1{background-color:var(--kup-background-color);border-radius:4px;box-sizing:border-box;box-shadow:0 2px 1px -1px rgba(128, 128, 128, 0.1), 0 1px 1px 0 rgba(128, 128, 128, 0.1), 0 1px 3px 0 rgba(128, 128, 128, 0.6);display:flex;flex-direction:column;height:100%;position:relative;width:100%;overflow:auto}.standard-layout-1 kup-button{margin-right:0}.standard-layout-1 #image1 img{object-fit:cover}.standard-layout-1.has-actions{padding-bottom:52px}.standard-layout-1.has-actions .section-2 .sub-2.description{padding-bottom:0}.standard-layout-1 .section-1{height:60%;width:100%}.standard-layout-1 .section-2{height:40%;width:100%;overflow:auto}.standard-layout-1 .section-2 .sub-2.title{color:var(--kup-text-color);padding:0 1em;padding-top:1em;text-align:left}.standard-layout-1 .section-2 .sub-2.title div{font-size:1.25em;font-weight:500;letter-spacing:0.0125em}.standard-layout-1 .section-2 .sub-2.subtitle{opacity:0.6;padding:0 1em;padding-bottom:1em;text-align:left}.standard-layout-1 .section-2 .sub-2.subtitle div{font-size:0.875em;font-weight:500;letter-spacing:0.0071428571em;line-height:1.375em}.standard-layout-1 .section-2 .sub-2.description{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;opacity:0.6;padding:0 1em;padding-bottom:1em;text-align:left}.standard-layout-1 .section-2 .sub-2.description div{font-size:0.875em;font-weight:400;letter-spacing:0.0178571429em;line-height:1.25em}.standard-layout-1 .section-3{display:flex;justify-content:flex-end;align-items:center;box-sizing:border-box;position:absolute;left:0;bottom:0;padding:2px 1em;height:52px;width:100%;text-align:right}.standard-layout-1 .section-3 kup-button{margin-left:0.25em}.standard-layout-2{background-color:var(--kup-background-color);border-radius:4px;box-sizing:border-box;box-shadow:0 2px 1px -1px rgba(128, 128, 128, 0.1), 0 1px 1px 0 rgba(128, 128, 128, 0.1), 0 1px 3px 0 rgba(128, 128, 128, 0.6);display:flex;flex-direction:column;height:100%;position:relative;width:100%;overflow:auto}.standard-layout-2 kup-button{margin-right:0}.standard-layout-2 #image1 img{object-fit:cover}.standard-layout-2.has-actions{padding-bottom:52px}.standard-layout-2.has-actions .section-3 .sub-3.description{padding-bottom:0}.standard-layout-2 .section-1{width:100%}.standard-layout-2 .section-1 .sub-1.title{color:var(--kup-text-color);padding:0 1em;padding-top:1em;text-align:left}.standard-layout-2 .section-1 .sub-1.title div{font-size:1.25em;font-weight:500;letter-spacing:0.0125em}.standard-layout-2 .section-1 .sub-1.subtitle{opacity:0.6;padding:0 1em;padding-bottom:1em;text-align:left}.standard-layout-2 .section-1 .sub-1.subtitle div{font-size:0.875em;font-weight:500;letter-spacing:0.0071428571em;line-height:1.375em}.standard-layout-2 .section-2{height:75%;width:100%}.standard-layout-2 .section-3{width:100%;overflow:auto}.standard-layout-2 .section-3 .sub-3.description{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;opacity:0.6;padding:0 1em 8px;padding-top:1em;text-align:left}.standard-layout-2 .section-3 .sub-3.description div{font-size:0.875em;font-weight:400;letter-spacing:0.0178571429em;line-height:1.25em}.standard-layout-2 .section-4{display:flex;justify-content:flex-end;align-items:center;box-sizing:border-box;position:absolute;left:0;bottom:0;padding:2px 1em;height:52px;width:100%;text-align:right}.standard-layout-2 .section-4 kup-button{margin-left:0.25em}.standard-layout-3{background-color:var(--kup-background-color);border-radius:4px;box-sizing:border-box;box-shadow:0 2px 1px -1px rgba(128, 128, 128, 0.1), 0 1px 1px 0 rgba(128, 128, 128, 0.1), 0 1px 3px 0 rgba(128, 128, 128, 0.6);display:flex;flex-direction:column;height:100%;position:relative;width:100%;overflow:auto}.standard-layout-3 kup-button{margin-right:0}.standard-layout-3 #image1 img{object-fit:cover}.standard-layout-3.has-actions{padding-bottom:52px}.standard-layout-3.has-actions .section-2 .sub-2.description{padding-bottom:0}.standard-layout-3 .section-1{height:75%;width:100%}.standard-layout-3 .section-1 .media{position:relative;height:100%;width:100%}.standard-layout-3 .section-1 .text-on-media{position:absolute;bottom:0;left:0}.standard-layout-3 .section-1 .sub-1.title{color:white;padding:0 1em;padding-top:1em;text-align:left}.standard-layout-3 .section-1 .sub-1.title div{font-size:1.25em;font-weight:500;letter-spacing:0.0125em}.standard-layout-3 .section-1 .sub-1.subtitle{color:white;opacity:0.6;padding:0 1em;padding-bottom:1em;text-align:left}.standard-layout-3 .section-1 .sub-1.subtitle div{font-size:0.875em;font-weight:500;letter-spacing:0.0071428571em;line-height:1.375em}.standard-layout-3 .section-2{width:100%;overflow:auto}.standard-layout-3 .section-2 .sub-2.description{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;opacity:0.6;padding:0 1em 8px;padding-top:1em;text-align:left}.standard-layout-3 .section-2 .sub-2.description div{font-size:0.875em;font-weight:400;letter-spacing:0.0178571429em;line-height:1.25em}.standard-layout-3 .section-3{display:flex;justify-content:flex-end;align-items:center;box-sizing:border-box;position:absolute;left:0;bottom:0;padding:2px 1em;height:52px;width:100%;text-align:right}.standard-layout-3 .section-3 kup-button{margin-left:0.25em}.standard-layout-4{background-color:var(--kup-background-color);border-radius:4px;box-sizing:border-box;box-shadow:0 2px 1px -1px rgba(128, 128, 128, 0.1), 0 1px 1px 0 rgba(128, 128, 128, 0.1), 0 1px 3px 0 rgba(128, 128, 128, 0.6);display:flex;flex-direction:column;height:100%;position:relative;width:100%;overflow:auto}.standard-layout-4 kup-button{margin-right:0}.standard-layout-4 #image1 img{object-fit:cover}.standard-layout-4.has-actions{padding-bottom:52px}.standard-layout-4.has-actions .section-3 .sub-3.description{padding-bottom:0}.standard-layout-4 .section-1{display:flex;height:100%;width:100%}.standard-layout-4 .section-1 .sub-1.image{width:33%}.standard-layout-4 .section-1 .sub-1.text{width:77%}.standard-layout-4 .section-1 .sub-1.title{color:var(--kup-text-color);padding:0 1em;padding-top:1em;text-align:left}.standard-layout-4 .section-1 .sub-1.title div{font-size:1.25em;font-weight:500;letter-spacing:0.0125em}.standard-layout-4 .section-1 .sub-1.subtitle{opacity:0.6;padding:0 1em;padding-bottom:1em;text-align:left}.standard-layout-4 .section-1 .sub-1.subtitle div{font-size:0.875em;font-weight:500;letter-spacing:0.0071428571em;line-height:1.375em}.standard-layout-4 .section-2{display:flex;justify-content:flex-end;align-items:center;box-sizing:border-box;position:absolute;left:0;bottom:0;padding:2px 1em;height:52px;width:100%;text-align:right}.standard-layout-4 .section-2 kup-button{margin-left:0.25em}.standard-layout-5{background-color:var(--kup-background-color);color:var(--kup-text-color);box-shadow:0px 0px 7.5px 0px rgba(128, 128, 128, 0.5);height:100%;overflow:hidden;width:100%}.standard-layout-5 .section-1{background-color:var(--color-0);height:3%}.standard-layout-5 .section-2{display:flex;height:53%}.standard-layout-5 .section-3{display:flex;height:24%}.standard-layout-5 .section-4{display:flex;height:20%;background-color:var(--color-1)}.standard-layout-5 .sub-2{box-sizing:border-box;display:flex;flex-direction:column;flex-wrap:wrap;justify-content:center}.standard-layout-5 .sub-2.icon{min-height:20px;flex:0 0 10%;max-width:10%}.standard-layout-5 .sub-2.icon #image1{box-sizing:border-box;margin:auto;padding:0 20%}.standard-layout-5 .sub-2.icon #image1 img{object-fit:contain}.standard-layout-5 .sub-2.text{flex:0 0 70%;max-width:70%;margin:auto;height:100%;flex-wrap:nowrap;padding:1em;text-align:left}.standard-layout-5 .sub-2.image{box-sizing:border-box;flex:0 0 20%;padding:1.5vh 0;max-width:20%}.standard-layout-5 .sub-2.image #image2{box-sizing:border-box;margin:auto;padding:0 10%}.standard-layout-5 .sub-2.image #image2 img{object-fit:contain}.standard-layout-5 .sub-2 .desc-text{overflow:auto}.standard-layout-5 .sub-2 .alt-text{color:var(--kup-primary-color)}.standard-layout-5 .sub-3{box-sizing:border-box}.standard-layout-5 .sub-3.progress-bar{margin:auto;padding:0 5%;vertical-align:2px;width:80%}.standard-layout-5 .sub-3.button{margin:auto;text-align:center;width:20%}.standard-layout-5 .sub-3 kup-button{margin:auto}.standard-layout-5 .sub-4{box-sizing:border-box;margin:auto}.standard-layout-5 .sub-4.text{width:50%;font-size:0.875em}.standard-layout-5 .sub-4 div{padding:0 5%}.standard-layout-5 .sub-4 .alt-text{color:var(--color-0);font-size:1em}.standard-layout-5 .alt-text{font-weight:bold}@media screen and (max-width: 767px){.standard-layout-5 .sub-2.image{display:none}.standard-layout-5 .sub-2.icon{flex-basis:30%;max-width:30%}}.standard-layout-6{background-color:var(--kup-background-color);color:var(--kup-text-color);box-shadow:0px 0px 7.5px 0px rgba(128, 128, 128, 0.5);display:flex;height:100%;overflow:hidden;width:100%}.standard-layout-6 .section-1{background-color:var(--color-0);display:flex;flex:0 0 10%;max-width:10%}.standard-layout-6 .section-1 .alt-text{color:var(--kup_card_dynamic_color_0);height:100%;text-align:center;writing-mode:vertical-lr;margin:auto;font-size:1.25em}.standard-layout-6 .section-2{box-sizing:border-box;height:100%;display:flex;flex:0 0 90%;flex-direction:column;max-width:90%}.standard-layout-6 .section-2 .sub-2{margin:auto;text-align:center}.standard-layout-6 .section-2 .sub-2 kup-progress-bar{margin-bottom:1em}.standard-layout-6 kup-button{position:absolute;bottom:2%;right:2%}.standard-layout-7{background-color:var(--kup-background-color);color:var(--kup-text-color);box-shadow:0px 0px 7.5px 0px rgba(128, 128, 128, 0.5);display:flex;flex-direction:column;height:100%;overflow:hidden;width:100%}.standard-layout-7 #image1 img{margin:auto;object-fit:contain}.standard-layout-7 .section-1{background-color:var(--color-0);height:5%;width:100%}.standard-layout-7 .section-2{height:80%;width:100%;text-align:center;padding:25px 25%;box-sizing:border-box}.standard-layout-7 .section-2 .sub-2{margin:auto}.standard-layout-7 .section-2 .sub-2.image{box-sizing:border-box;height:65%}.standard-layout-7 .section-2 .sub-2.text{font-size:1.4em;letter-spacing:1.2px;padding-top:1em;height:35%}.standard-layout-7 .section-3{display:flex;height:15%;width:100%}.standard-layout-7 .section-3 .alt-text{margin:auto;opacity:0.75;width:50%}.standard-layout-7 .section-3 .alt-text:nth-child(1){margin-left:1em;text-align:left}.standard-layout-7 .section-3 .alt-text:nth-child(2){margin-right:1em;text-align:right}.standard-layout-8{background-color:var(--kup-background-color);color:var(--kup-text-color);box-shadow:0px 0px 7.5px 0px rgba(128, 128, 128, 0.5);display:flex;flex-direction:column;height:100%;overflow:hidden;width:100%;box-sizing:border-box;position:relative}.standard-layout-8 .background{background-color:var(--color-0);content:\"\";height:100%;width:100%;opacity:0.1;pointer-events:none;position:absolute;top:0;left:0;z-index:1}.standard-layout-8 .section-1{box-sizing:border-box;display:flex;flex-direction:column;max-width:100%;overflow:auto;height:auto}.standard-layout-8 .section-1 .sub-1{text-align:left;padding:0.6em 0.8em 0;font-size:1em;font-weight:bold;max-width:75%}.standard-layout-8 .section-1 .sub-2{text-align:left;padding:0.6em 0.8em;font-size:0.875em;max-width:75%}.standard-layout-8 .section-1 .sub-3{color:var(--color-0);font-weight:bold;text-align:center;font-size:1.2em;position:absolute;top:1em;right:1em;max-width:25%;text-overflow:ellipsis;max-height:calc(24px + 2.25em);padding:0 1em;overflow:hidden}.standard-layout-8 .section-1 .sub-3 kup-image{margin:auto}.standard-layout-8 .section-2{display:flex;height:auto;overflow:auto}.standard-layout-9{background-color:var(--kup-background-color);color:var(--kup-text-color);box-shadow:0px 0px 7.5px 0px rgba(128, 128, 128, 0.5);display:flex;flex-direction:row;height:100%;overflow:hidden;width:100%;box-sizing:border-box;position:relative}.standard-layout-9 #image1 img{object-fit:contain}.standard-layout-9 .section-1{margin-top:auto;margin-right:18px;margin-bottom:auto;white-space:nowrap}.standard-layout-9 .section-2{display:flex;height:100%;margin-top:auto;margin-bottom:auto;width:100%;overflow:hidden}.standard-layout-9 .sub-2{display:flex;flex-direction:row}.standard-layout-9 .text{text-align:left}.standard-layout-9 .text-wrapper{display:flex;flex-direction:column}.standard-layout-9 .icon{margin:auto;padding:0 1.25em}.standard-layout-9 .description{font-size:1.5em;letter-spacing:1px;padding-left:1.25em;padding-top:0.25em}.standard-layout-9 .title{font-size:2.75em;font-weight:bold}.standard-layout-9 .subtitle{font-size:1.5em;opacity:0.75}.standard-layout-10{background-color:var(--kup-background-color);color:var(--kup-text-color);box-shadow:0px 0px 7.5px 0px rgba(128, 128, 128, 0.5);display:flex;flex-direction:row;height:100%;overflow:hidden;width:100%;box-sizing:border-box;position:relative}.standard-layout-10 #image1 img{object-fit:contain}.standard-layout-10 .section-1{display:flex;height:100%;margin-top:auto;margin-bottom:auto;width:100%;overflow:hidden}.standard-layout-10 .section-2{margin-top:auto;margin-left:18px;margin-bottom:auto;white-space:nowrap}.standard-layout-10 .sub-2{display:flex;flex-direction:row-reverse}.standard-layout-10 .text{text-align:right}.standard-layout-10 .text-wrapper{display:flex;flex-direction:column}.standard-layout-10 .icon{margin:auto;padding:0 1.25em}.standard-layout-10 .description{font-size:1.5em;letter-spacing:1px;padding-right:1.25em;padding-top:0.25em}.standard-layout-10 .title{font-size:2.75em;font-weight:bold}.standard-layout-10 .subtitle{font-size:1.5em;opacity:0.75}.standard-layout-11{background-color:var(--kup-background-color);color:var(--kup-text-color);box-shadow:0px 0px 7.5px 0px rgba(128, 128, 128, 0.5);display:flex;flex-direction:row;height:100%;overflow:hidden;width:100%;box-sizing:border-box;position:relative}.standard-layout-11 #image1 img{object-fit:contain}.standard-layout-11 .section-1{display:flex;height:100%;margin-top:auto;margin-bottom:auto;min-width:6em;max-width:6em;overflow:hidden;transition:0.25s ease-in}.standard-layout-11 .section-2{display:flex;height:100%;margin-top:auto;margin-bottom:auto;width:100%;overflow:hidden}.standard-layout-11 .sub-1{background-color:var(--color-0);height:100%;text-align:center;writing-mode:vertical-lr;min-width:6em;display:flex;transition:width 0.25s ease-in}.standard-layout-11 .sub-1 div{font-size:1.25em}.standard-layout-11 .sub-2{display:flex;flex-direction:row}.standard-layout-11 .text:not(.description){text-align:left}.standard-layout-11 .text-wrapper{display:flex;flex-direction:column}.standard-layout-11 .icon{margin:auto;padding:0 1.25em}.standard-layout-11 .description{font-size:1.5em;letter-spacing:1px;margin:auto;color:var(--kup_card_dynamic_color_0)}.standard-layout-11 .title{font-size:2.75em;font-weight:bold;margin-top:auto}.standard-layout-11 .subtitle{font-size:1.5em;opacity:0.75;margin-bottom:auto}.standard-layout-12{background-color:var(--kup-background-color);box-shadow:0 2px 1px -1px rgba(128, 128, 128, 0.1), 0 1px 1px 0 rgba(128, 128, 128, 0.1), 0 1px 3px 0 rgba(128, 128, 128, 0.6);color:var(--kup-text-color);min-width:200px;min-width:-moz-max-content;min-width:-webkit-max-content;}.standard-layout-12 .section-1{display:inline-flex;border-bottom:1px solid var(--kup-border-color);width:100%}.standard-layout-12 .section-1 kup-button{margin:0}.standard-layout-12 .section-2{display:flex;flex-direction:column}.standard-layout-12 .section-2.has-content{border-bottom:1px solid var(--kup-border-color);padding:0.5em 0.5em}.standard-layout-12 .section-2 kup-date-picker:first-of-type,.standard-layout-12 .section-2 kup-time-picker:first-of-type{margin-bottom:0.5em}.standard-layout-12 .section-3{backface-visibility:hidden;display:flex;flex-direction:column;max-height:20vh;overflow:auto}.standard-layout-12 .section-3 kup-checkbox{margin-left:0;margin-right:auto}.standard-layout-13{background-color:var(--kup-background-color);border-radius:4px;box-sizing:border-box;box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);display:flex;flex-direction:column;height:100%;position:relative;width:100%}.standard-layout-13 kup-button{margin-left:0}.standard-layout-13 .section-1{background-color:var(--kup-background-color);display:flex;justify-content:flex-start;align-items:center;box-sizing:border-box;box-shadow:0px 1px 3px 0px var(--kup-text-color);height:52px;width:100%;text-align:right}.standard-layout-13 .section-1 kup-button{margin-right:0.25em}.standard-layout-13 .section-2{height:100%;width:100%;overflow:auto;max-height:50vh}.standard-layout-13 .text{color:var(--kup-text-color);font-family:var(--kup-font-family-monospace);white-space:nowrap;border-bottom:1px solid var(--kup-border-color);line-height:1.75em}.standard-layout-14{background-color:var(--kup-background-color);box-shadow:0 2px 1px -1px rgba(128, 128, 128, 0.1), 0 1px 1px 0 rgba(128, 128, 128, 0.1), 0 1px 3px 0 rgba(128, 128, 128, 0.6);color:var(--kup-text-color);min-width:200px;min-width:-moz-max-content;min-width:-webkit-max-content;}.standard-layout-14 .section-1{display:flex;padding:1em}.standard-layout-14 .section-1 .sub-1{width:100%}.standard-layout-14 .section-1 .sub-spinner{height:88px;width:88px;margin:0 10px}.standard-layout-14 .section-1 .f-image{margin:0 0.5em 0 0}.standard-layout-14 .section-1 .title{--kup-button-font-size:0.75em;font-size:1.25em;margin-top:-0.5em;padding:0 0.25em 0.25em}.standard-layout-14 .section-1 .title .label{cursor:pointer;padding-right:0.25em}.standard-layout-14 .section-1 .title .label:hover{text-decoration:underline}.standard-layout-14 .section-1 .info{display:flex;padding:0 0.25em 0.25em;width:100%}.standard-layout-14 .section-1 .info .label{color:rgba(var(--kup-text-color-rgb), 0.75);margin-right:0.75em;min-width:max-content;width:auto}.standard-layout-14 .section-1 .info .value{width:100%}.standard-layout-14 .sub-button{display:inline-flex;width:100%}.standard-layout-14 .sub-button kup-button{margin:0}.standard-layout-14 .sub-checkbox{backface-visibility:hidden;display:flex;flex-direction:column;max-height:20vh;overflow:auto}.standard-layout-14 .sub-checkbox kup-checkbox{margin-left:0;margin-right:auto}.standard-layout-14 .sub-formula{padding:0.5em}.standard-layout-14 .sub-chip{max-width:25vw;overflow:auto;box-shadow:0 3px 2px -2px var(--kup-border-color)}.standard-layout-14 .sub-field{display:flex;flex-direction:column}.standard-layout-14 .sub-field.has-content{border-bottom:1px solid var(--kup-border-color);padding:0.5em 0.5em}.standard-layout-14 .sub-field kup-date-picker:first-of-type,.standard-layout-14 .sub-field kup-time-picker:first-of-type{margin-bottom:0.5em}.standard-layout-14 .sub-spinner{height:100px}.standard-layout-14 .sub-autocomplete{padding-top:1em}.standard-layout-14 .sub-autocomplete kup-autocomplete{margin:auto;padding:0.5em 0;width:max-content}.standard-layout-14 .sub-switch{display:flex;justify-content:space-evenly;padding:2em}.standard-layout-14 .sub-tree{max-height:25vh;overflow:auto}.standard-layout-14 #apply{display:none;margin:auto}.standard-layout-14 #apply.visible{display:block}.standard-layout-14 #open-in-new,.standard-layout-14 #search,.standard-layout-14 #new{margin:0;display:inline-flex}.standard-layout-15{background:var(--kup-background-color);border-radius:3px;box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);color:var(--kup-text-color);display:block;font-size:var(--kup-font-size);outline:none}.standard-layout-15 .section-1{--kup-button-font-size:0.75em;box-sizing:border-box;display:flex;padding:1em}.standard-layout-15 .section-1 .sub-1{width:100%}.standard-layout-15 .section-1 .sub-spinner{height:88px;width:88px;margin:0 10px}.standard-layout-15 .section-1 .f-image{margin:0 0.5em 0 0}.standard-layout-15 .section-1 .title{align-items:center;display:flex;font-size:1.25em;font-weight:600;padding:0 0.25em 0.25em;text-align:left}.standard-layout-15 .section-1 .title .label{cursor:pointer;padding-right:0.25em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.standard-layout-15 .section-1 .title .label:hover{text-decoration:underline}.standard-layout-15 .section-1 .info{display:flex;padding:0 0.25em 0.25em;width:100%}.standard-layout-15 .section-1 .info .label{color:rgba(var(--kup-text-color-rgb), 0.75);margin-right:0.75em;min-width:max-content;width:auto}.standard-layout-15 .section-1 .info .value{font-weight:600;width:100%}.standard-layout-15 .section-2{border-top:1px solid var(--kup-border-color);box-sizing:border-box;height:180px;opacity:1;overflow:auto;transition:height 250ms ease-out, opacity 250ms ease-out}.standard-layout-15 .section-2 .info{box-sizing:border-box;height:100%;overflow:auto;padding:1.25em}.standard-layout-15 .section-2 .detail-row{align-items:center;display:flex;justify-content:space-between}.standard-layout-15 .section-2 .detail-row:not(:last-child){margin-bottom:6px}.standard-layout-15 .section-2 .detail-row__label{color:rgba(var(--kup-text-color-rgb), 0.5);margin-top:0.175em;max-width:320px;padding-right:1.25em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.standard-layout-15 .section-2 .detail-row__value{color:var(--kup-text-color);font-size:105%;font-weight:600;max-width:320px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.standard-layout-15 .section-2 kup-tree{text-align:left}.standard-layout-15 .section-3{border-top:1px solid var(--kup-border-color);display:flex;justify-content:flex-end;padding:6px;padding-top:2px;padding-bottom:2px}.standard-layout-15 .section-3 kup-button{margin:auto 0}.standard-layout-15 #open-in-new,.standard-layout-15 #search,.standard-layout-15 #new{margin:0 0 0.5em 0}.standard-layout-16{background-color:var(--kup-background-color);border-radius:4px;box-shadow:0 2px 1px -1px rgba(128, 128, 128, 0.1), 0 1px 1px 0 rgba(128, 128, 128, 0.1), 0 1px 3px 0 rgba(128, 128, 128, 0.6);color:var(--kup-text-color);font-size:var(--kup-font-size);padding:0.5em}.standard-layout-16>table{width:100%}.standard-layout-16 .label{padding:0.5em;vertical-align:top}.standard-layout-16 .value{padding:0.5em;font-weight:bold}:host{--kup_card_ripple_color:var(\n --kup-card-ripple-color,\n var(--kup-primary-color)\n );display:block;font-size:var(--kup-font-size);height:var(--kup_card_height);min-height:var(--kup_card_height);min-width:var(--kup_card_width);outline:none;position:relative;width:var(--kup_card_width)}:host([is-menu]){display:none;animation:fade-in 0.25s ease-out}:host([menu-visible]){box-shadow:var(--kup-box-shadow);display:block}#kup-component{height:100%;width:100%}.mdc-ripple-surface{cursor:pointer;flex-direction:column;display:flex;height:100%;position:relative}.mdc-ripple-surface:before,.mdc-ripple-surface:after{background-color:var(--kup_card_ripple_color)}.card-view{animation:fade-in 0.25s ease-out;display:none;height:100%;width:100%}.card-view.visible{display:block}";
|
|
5256
|
+
const kupCardCss = ".box-layout-1{background-color:var(--kup-background-color);color:var(--kup-text-color);font-size:var(--kup-font-size);padding:0.5em}.box-layout-1 table{width:100%}.box-layout-1 .label{overflow:hidden;padding:0.5em;text-overflow:ellipsis;width:50%}.box-layout-1 .value{padding:0.5em;font-weight:bold}.box-layout-2{background-color:var(--kup-background-color);color:var(--kup-text-color);font-size:var(--kup-font-size);padding:0.5em}.box-layout-2 .container{width:100%}.box-layout-2 .flex-container{display:flex;justify-content:space-between}.box-layout-2 .label{overflow:hidden;padding:0.5em;text-overflow:ellipsis;width:50%}.box-layout-2 .value{padding:0.5em;font-weight:bold}.box-layout-3{background-color:var(--kup-background-color);color:var(--kup-text-color);font-size:var(--kup-font-size);padding:0.5em}.box-layout-3 .container{display:flex;width:100%}.box-layout-3 .flex-container{align-items:center;display:flex}.box-layout-3 .label{overflow:hidden;padding:0.5em;text-overflow:ellipsis;white-space:nowrap;width:50%}.box-layout-3 .value{padding:0.5em;font-weight:bold}.box-layout-3 .f-cell .f-cell__text{white-space:nowrap}.box-layout-4{background-color:var(--kup-background-color);color:var(--kup-text-color);display:flex;font-size:var(--kup-font-size);height:100%;padding:0.5em}.box-layout-4 .container{margin:auto;width:100%}.box-layout-4 .image{border-radius:50%;height:64px;margin:auto;width:64px}.box-layout-4 .value{padding:0.5em;font-weight:bold}.box-layout-4 .f-cell.c-centered .f-cell__content img,.box-layout-4 .f-cell.c-centered .f-cell__content .f-image{margin:0}.built-in-layout-1{background-color:var(--kup-background-color);border-radius:4px;box-sizing:border-box;box-shadow:0 2px 1px -1px rgba(128, 128, 128, 0.1), 0 1px 1px 0 rgba(128, 128, 128, 0.1), 0 1px 3px 0 rgba(128, 128, 128, 0.6);display:flex;flex-direction:column;height:100%;position:relative;width:100%;overflow:auto;padding:0.5em}.built-in-layout-1 .section-1{box-sizing:border-box;height:5em;overflow:auto;padding-bottom:1em;width:100%}.built-in-layout-1 .section-1 .sub-1{display:flex;flex-direction:row;justify-content:center}.built-in-layout-1 .section-2{height:calc(100% - 60px);overflow:auto;width:100%}.built-in-layout-1 .prev-page{margin-left:auto}.built-in-layout-1 .change-view-button{margin:auto;width:12em;text-align:center}.built-in-layout-1 #change-view-button button{text-transform:capitalize}.built-in-layout-1 .next-page{margin-right:auto}.built-in-layout-1 .calendar{border-collapse:collapse;width:100%}.built-in-layout-1 thead{border-bottom:1px solid var(--kup-border-color)}.built-in-layout-1 .item-text{color:rgba(var(--kup-text-color-rgb), 0.5)}.built-in-layout-1 .item{text-align:center}.built-in-layout-1 .item:not(.selected) .item-number:hover{background-color:var(--kup-hover-background-color)}.built-in-layout-1 .item.selected .item-number,.built-in-layout-1 .item.selected .item-number:hover{background-color:rgba(var(--kup-primary-color-rgb), 0.175)}.built-in-layout-1 .item-number{border-radius:50%;cursor:pointer;display:flex;justify-content:center;line-height:2.5em;margin:auto;width:2.5em;transition:background-color 0.25s;text-transform:capitalize}.built-in-layout-2{background-color:var(--kup-background-color);border-radius:4px;box-sizing:border-box;box-shadow:0 2px 1px -1px rgba(128, 128, 128, 0.1), 0 1px 1px 0 rgba(128, 128, 128, 0.1), 0 1px 3px 0 rgba(128, 128, 128, 0.6);display:flex;flex-direction:column;height:100%;position:relative;width:100%;overflow:auto}.built-in-layout-2 .clock{box-shadow:var(--kup-box-shadow);width:300px;height:450px;background-color:var(--kup-background-color);position:relative;font-family:var(--kup-font-family)}.built-in-layout-2 .top{background-color:var(--kup-primary-color);color:var(--kup-text-on-primary-color);height:100px;line-height:100px;font-size:50px;text-align:center}.built-in-layout-2 .top span{cursor:pointer;opacity:0.75;transition:0.25s ease-in-out}.built-in-layout-2 .top .visible{opacity:1}.built-in-layout-2 .circle{user-select:none;background-color:rgba(var(--kup-text-color-rgb), 0.1);width:250px;height:250px;border-radius:1000px;position:relative;top:25px;left:25px;box-sizing:border-box;display:none}.built-in-layout-2 .circle.visible{display:block}.built-in-layout-2 .mid{position:absolute;left:calc(50% - 0px);top:calc(50% - 0px);width:2px;height:2px;border-radius:10px;background-color:var(--kup-text-color)}.built-in-layout-2 .hour{position:absolute;height:40px;line-height:40px;width:40px;border-radius:40px;text-align:center}.built-in-layout-2 .hour.selected{z-index:2}.built-in-layout-2 .hour.selected::after{content:\"\";z-index:-1;background-color:rgba(var(--kup-primary-color-rgb), 0.5);height:1px;width:100%;position:absolute;transform:rotate(-90deg);transform-origin:100% 0%;top:50%;width:101px;right:50%}.built-in-layout-2 .hour2{z-index:2;position:absolute;height:30px;line-height:30px;width:30px;border-radius:40px;text-align:center;font-size:14px}.built-in-layout-2 .hour2.selected::after{content:\"\";background-color:rgba(var(--kup-primary-color-rgb), 0.5);height:1px;width:100%;position:absolute;transform:rotate(-90deg);transform-origin:100% 0%;top:50%;width:64px;right:50%;z-index:-1}.built-in-layout-2 .unit{position:absolute;height:20px;line-height:20px;width:20px;border-radius:40px;text-align:center;font-size:12px}.built-in-layout-2 .unit.selected::after{content:\"\";background-color:rgba(var(--kup-primary-color-rgb), 0.5);height:1px;width:100%;position:absolute;transform:rotate(-90deg);transform-origin:100% 0%;top:50%;width:101px;right:50%}.built-in-layout-2 .hour,.built-in-layout-2 .hour2,.built-in-layout-2 .unit{cursor:pointer;transition:background-color 0.25s}.built-in-layout-2 .hour:hover,.built-in-layout-2 .hour2:hover,.built-in-layout-2 .unit:hover{background-color:rgba(var(--kup-primary-color-rgb), 0.275)}.built-in-layout-2 .hour.selected,.built-in-layout-2 .hour2.selected,.built-in-layout-2 .unit.selected{background-color:var(--kup-primary-color);color:var(--kup-text-on-primary-color)}.built-in-layout-2 .actions{color:var(--kup-primary-color);font-weight:bold;font-size:20px;display:flex;justify-content:flex-end;position:absolute;width:100%;box-sizing:border-box;bottom:10px}.built-in-layout-2 .action{display:inline-block;width:100px;text-align:center;height:37.5px;line-height:37.5px;margin-right:10px;cursor:pointer;border-radius:2px}.built-in-layout-2 .clock .actions .action:hover{background-color:rgba(0, 0, 0, 0.1)}.built-in-layout-2 .clock .actions .action:visible{background-color:rgba(0, 0, 0, 0.3)}.built-in-layout-2 .hour:nth-child(12):after{transform:rotate(330deg)}.built-in-layout-2 .hour:nth-child(11):after{transform:rotate(300deg)}.built-in-layout-2 .hour:nth-child(10):after{transform:rotate(270deg)}.built-in-layout-2 .hour:nth-child(9):after{transform:rotate(240deg)}.built-in-layout-2 .hour:nth-child(8):after{transform:rotate(210deg)}.built-in-layout-2 .hour:nth-child(7):after{transform:rotate(180deg)}.built-in-layout-2 .hour:nth-child(6):after{transform:rotate(150deg)}.built-in-layout-2 .hour:nth-child(5):after{transform:rotate(120deg)}.built-in-layout-2 .hour:nth-child(4):after{transform:rotate(90deg)}.built-in-layout-2 .hour:nth-child(3):after{transform:rotate(60deg)}.built-in-layout-2 .hour:nth-child(2):after{transform:rotate(30deg)}.built-in-layout-2 .hour:nth-child(1):after{transform:rotate(0deg)}.built-in-layout-2 .hour2:nth-child(24):after{transform:rotate(690deg)}.built-in-layout-2 .hour2:nth-child(23):after{transform:rotate(660deg)}.built-in-layout-2 .hour2:nth-child(22):after{transform:rotate(630deg)}.built-in-layout-2 .hour2:nth-child(21):after{transform:rotate(600deg)}.built-in-layout-2 .hour2:nth-child(20):after{transform:rotate(570deg)}.built-in-layout-2 .hour2:nth-child(19):after{transform:rotate(540deg)}.built-in-layout-2 .hour2:nth-child(18):after{transform:rotate(510deg)}.built-in-layout-2 .hour2:nth-child(17):after{transform:rotate(480deg)}.built-in-layout-2 .hour2:nth-child(16):after{transform:rotate(450deg)}.built-in-layout-2 .hour2:nth-child(15):after{transform:rotate(420deg)}.built-in-layout-2 .hour2:nth-child(14):after{transform:rotate(390deg)}.built-in-layout-2 .hour2:nth-child(13):after{transform:rotate(360deg)}.built-in-layout-2 .unit:nth-child(60):after{transform:rotate(354deg)}.built-in-layout-2 .unit:nth-child(59):after{transform:rotate(348deg)}.built-in-layout-2 .unit:nth-child(58):after{transform:rotate(342deg)}.built-in-layout-2 .unit:nth-child(57):after{transform:rotate(336deg)}.built-in-layout-2 .unit:nth-child(56):after{transform:rotate(330deg)}.built-in-layout-2 .unit:nth-child(55):after{transform:rotate(324deg)}.built-in-layout-2 .unit:nth-child(54):after{transform:rotate(318deg)}.built-in-layout-2 .unit:nth-child(53):after{transform:rotate(312deg)}.built-in-layout-2 .unit:nth-child(52):after{transform:rotate(306deg)}.built-in-layout-2 .unit:nth-child(51):after{transform:rotate(300deg)}.built-in-layout-2 .unit:nth-child(50):after{transform:rotate(294deg)}.built-in-layout-2 .unit:nth-child(49):after{transform:rotate(288deg)}.built-in-layout-2 .unit:nth-child(48):after{transform:rotate(282deg)}.built-in-layout-2 .unit:nth-child(47):after{transform:rotate(276deg)}.built-in-layout-2 .unit:nth-child(46):after{transform:rotate(270deg)}.built-in-layout-2 .unit:nth-child(45):after{transform:rotate(264deg)}.built-in-layout-2 .unit:nth-child(44):after{transform:rotate(258deg)}.built-in-layout-2 .unit:nth-child(43):after{transform:rotate(252deg)}.built-in-layout-2 .unit:nth-child(42):after{transform:rotate(246deg)}.built-in-layout-2 .unit:nth-child(41):after{transform:rotate(240deg)}.built-in-layout-2 .unit:nth-child(40):after{transform:rotate(234deg)}.built-in-layout-2 .unit:nth-child(39):after{transform:rotate(228deg)}.built-in-layout-2 .unit:nth-child(38):after{transform:rotate(222deg)}.built-in-layout-2 .unit:nth-child(37):after{transform:rotate(216deg)}.built-in-layout-2 .unit:nth-child(36):after{transform:rotate(210deg)}.built-in-layout-2 .unit:nth-child(35):after{transform:rotate(204deg)}.built-in-layout-2 .unit:nth-child(34):after{transform:rotate(198deg)}.built-in-layout-2 .unit:nth-child(33):after{transform:rotate(192deg)}.built-in-layout-2 .unit:nth-child(32):after{transform:rotate(186deg)}.built-in-layout-2 .unit:nth-child(31):after{transform:rotate(180deg)}.built-in-layout-2 .unit:nth-child(30):after{transform:rotate(174deg)}.built-in-layout-2 .unit:nth-child(29):after{transform:rotate(168deg)}.built-in-layout-2 .unit:nth-child(28):after{transform:rotate(162deg)}.built-in-layout-2 .unit:nth-child(27):after{transform:rotate(156deg)}.built-in-layout-2 .unit:nth-child(26):after{transform:rotate(150deg)}.built-in-layout-2 .unit:nth-child(25):after{transform:rotate(144deg)}.built-in-layout-2 .unit:nth-child(24):after{transform:rotate(138deg)}.built-in-layout-2 .unit:nth-child(23):after{transform:rotate(132deg)}.built-in-layout-2 .unit:nth-child(22):after{transform:rotate(126deg)}.built-in-layout-2 .unit:nth-child(21):after{transform:rotate(120deg)}.built-in-layout-2 .unit:nth-child(20):after{transform:rotate(114deg)}.built-in-layout-2 .unit:nth-child(19):after{transform:rotate(108deg)}.built-in-layout-2 .unit:nth-child(18):after{transform:rotate(102deg)}.built-in-layout-2 .unit:nth-child(17):after{transform:rotate(96deg)}.built-in-layout-2 .unit:nth-child(16):after{transform:rotate(90deg)}.built-in-layout-2 .unit:nth-child(15):after{transform:rotate(84deg)}.built-in-layout-2 .unit:nth-child(14):after{transform:rotate(78deg)}.built-in-layout-2 .unit:nth-child(13):after{transform:rotate(72deg)}.built-in-layout-2 .unit:nth-child(12):after{transform:rotate(66deg)}.built-in-layout-2 .unit:nth-child(11):after{transform:rotate(60deg)}.built-in-layout-2 .unit:nth-child(10):after{transform:rotate(54deg)}.built-in-layout-2 .unit:nth-child(9):after{transform:rotate(48deg)}.built-in-layout-2 .unit:nth-child(8):after{transform:rotate(42deg)}.built-in-layout-2 .unit:nth-child(7):after{transform:rotate(36deg)}.built-in-layout-2 .unit:nth-child(6):after{transform:rotate(30deg)}.built-in-layout-2 .unit:nth-child(5):after{transform:rotate(24deg)}.built-in-layout-2 .unit:nth-child(4):after{transform:rotate(18deg)}.built-in-layout-2 .unit:nth-child(3):after{transform:rotate(12deg)}.built-in-layout-2 .unit:nth-child(2):after{transform:rotate(6deg)}.built-in-layout-2 .unit:nth-child(1):after{transform:rotate(0deg)}.built-in-layout-3{background:var(--kup-background-color);box-shadow:rgba(128, 128, 128, 0.1) 0px 2px 1px -1px, rgba(128, 128, 128, 0.1) 0px 1px 1px 0px, rgba(128, 128, 128, 0.6) 0px 1px 3px 0px;box-sizing:border-box;overflow:auto}.built-in-layout-3 kup-button,.built-in-layout-3 kup-combobox{margin:0 auto 0.75em auto}.built-in-layout-3 kup-combobox{width:95%}.built-in-layout-3 .sub-chip{border-top:1px solid var(--kup-border-color);max-height:33vh;overflow:auto;width:100%}.built-in-layout-4{background:var(--kup-background-color);box-shadow:rgba(128, 128, 128, 0.1) 0px 2px 1px -1px, rgba(128, 128, 128, 0.1) 0px 1px 1px 0px, rgba(128, 128, 128, 0.6) 0px 1px 3px 0px;box-sizing:border-box}.built-in-layout-4 .picker_arrow{position:absolute;z-index:-1}.built-in-layout-4 .picker_wrapper.popup{position:absolute;z-index:2;margin:1.5em}.built-in-layout-4 .picker_wrapper.popup,.built-in-layout-4 .picker_wrapper.popup .picker_arrow::before,.built-in-layout-4 .picker_wrapper.popup .picker_arrow::after{background:var(--kup-background-color);box-shadow:0 0 10px 1px rgba(0, 0, 0, 0.4)}.built-in-layout-4 .picker_wrapper.popup .picker_arrow{width:3em;height:3em;margin:0}.built-in-layout-4 .picker_wrapper.popup .picker_arrow::before,.built-in-layout-4 .picker_wrapper.popup .picker_arrow::after{content:\"\";display:block;position:absolute;top:0;left:0;z-index:-99}.built-in-layout-4 .picker_wrapper.popup .picker_arrow::before{width:100%;height:100%;transform:skew(45deg);transform-origin:0 100%}.built-in-layout-4 .picker_wrapper.popup .picker_arrow::after{width:150%;height:150%;box-shadow:none}.built-in-layout-4 .popup.popup_top{bottom:100%;left:0}.built-in-layout-4 .popup.popup_top .picker_arrow{bottom:0;left:0;transform:rotate(-90deg)}.built-in-layout-4 .popup.popup_bottom{top:100%;left:0}.built-in-layout-4 .popup.popup_bottom .picker_arrow{top:0;left:0;transform:rotate(90deg) scale(1, -1)}.built-in-layout-4 .popup.popup_left{top:0;right:100%}.built-in-layout-4 .popup.popup_left .picker_arrow{top:0;right:0;transform:scale(-1, 1)}.built-in-layout-4 .popup.popup_right{top:0;left:100%}.built-in-layout-4 .popup.popup_right .picker_arrow{top:0;left:0}.built-in-layout-4 .picker_wrapper.no_alpha .picker_alpha{display:none}.built-in-layout-4 .picker_wrapper.no_editor .picker_editor{position:absolute;z-index:-1;opacity:0}.built-in-layout-4 .picker_wrapper.no_cancel .picker_cancel{display:none}.built-in-layout-4 .layout_default.picker_wrapper{display:flex;flex-flow:row wrap;justify-content:space-between;align-items:stretch;font-size:10px;width:25em;padding:0.5em}.built-in-layout-4 .layout_default.picker_wrapper input,.built-in-layout-4 .layout_default.picker_wrapper button{font-size:1em}.built-in-layout-4 .layout_default.picker_wrapper>*{margin:0.5em}.built-in-layout-4 .layout_default.picker_wrapper::before{content:\"\";display:block;width:100%;height:0;order:1}.built-in-layout-4 .layout_default .picker_slider,.built-in-layout-4 .layout_default .picker_selector{padding:1em}.built-in-layout-4 .layout_default .picker_hue{width:100%}.built-in-layout-4 .layout_default .picker_sl{flex:1 1 auto}.built-in-layout-4 .layout_default .picker_sl::before{content:\"\";display:block;padding-bottom:100%}.built-in-layout-4 .layout_default .picker_editor{order:1;width:6.5em}.built-in-layout-4 .layout_default .picker_editor input{width:100%;height:100%}.built-in-layout-4 .layout_default .picker_sample{order:1;flex:1 1 auto}.built-in-layout-4 .layout_default .picker_done,.built-in-layout-4 .layout_default .picker_cancel{order:1}.built-in-layout-4 .picker_wrapper{box-sizing:border-box;background:var(--kup-background-color);box-shadow:0 0 0 1px var(--kup-border-color);cursor:default;font-family:sans-serif;color:#444;pointer-events:auto}.built-in-layout-4 .picker_wrapper:focus{outline:none}.built-in-layout-4 .picker_wrapper button,.built-in-layout-4 .picker_wrapper input{box-sizing:border-box;border:none;box-shadow:0 0 0 1px var(--kup-border-color);outline:none}.built-in-layout-4 .picker_wrapper button:focus,.built-in-layout-4 .picker_wrapper button:active,.built-in-layout-4 .picker_wrapper input:focus,.built-in-layout-4 .picker_wrapper input:active{box-shadow:0 0 2px 1px var(--kup-border-color)}.built-in-layout-4 .picker_wrapper button{padding:0.4em 0.6em;cursor:pointer;background-color:whitesmoke;background-image:linear-gradient(0deg, gainsboro, transparent)}.built-in-layout-4 .picker_wrapper button:active{background-image:linear-gradient(0deg, transparent, gainsboro)}.built-in-layout-4 .picker_selector{position:absolute;z-index:1;display:block;transform:translate(-50%, -50%);border:2px solid white;border-radius:100%;box-shadow:0 0 3px 1px #67b9ff;background:currentColor;cursor:pointer}.built-in-layout-4 .picker_slider .picker_selector{border-radius:2px}.built-in-layout-4 .picker_hue{position:relative;background-image:linear-gradient(90deg, red, yellow, lime, cyan, blue, magenta, red);box-shadow:0 0 0 1px var(--kup-border-color)}.built-in-layout-4 .picker_sl{position:relative;box-shadow:0 0 0 1px var(--kup-border-color);background-image:linear-gradient(180deg, white, rgba(255, 255, 255, 0) 50%), linear-gradient(0deg, black, rgba(0, 0, 0, 0) 50%), linear-gradient(90deg, #808080, rgba(128, 128, 128, 0))}.built-in-layout-4 .picker_alpha,.built-in-layout-4 .picker_sample{position:relative;background:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='2' height='2'%3E%3Cpath d='M1,0H0V1H2V2H1' fill='lightgrey'/%3E%3C/svg%3E\") left top/contain white;box-shadow:0 0 0 1px var(--kup-border-color)}.built-in-layout-4 .picker_alpha .picker_selector,.built-in-layout-4 .picker_sample .picker_selector{background:none}.built-in-layout-4 .picker_editor input{font-family:monospace;padding:0.2em 0.4em}.built-in-layout-4 .picker_sample::before{content:\"\";position:absolute;display:block;width:100%;height:100%;background:currentColor}.built-in-layout-4 .picker_done,.built-in-layout-4 .picker_arrow{display:none}.built-in-layout-4 .layout_default.picker_wrapper{bottom:unset;font-size:var(--kup-font-size);left:unset;padding:0.25em;right:unset;top:unset;width:100%}.built-in-layout-4 .layout_default .picker_editor input{background:none;color:var(--kup-text-color);font-family:var(--kup-font-family);font-size:var(--kup-font-size)}.built-in-layout-4 .picker_wrapper.popup{box-shadow:var(--kup-box-shadow);margin:0;outline:none}.built-in-layout-5{background:var(--kup-background-color);box-shadow:var(--kup-box-shadow);box-sizing:border-box;overflow:auto;padding:0.5em}.built-in-layout-5>table{width:100%}.built-in-layout-5>table>tr>td>div.value{text-align:right;color:var(--kup-primary-color);border-bottom:1px solid var(--kup-border-color);min-height:1.5em}.built-in-layout-5>table>tr>td>.f-button{display:flex;justify-content:center}.built-in-layout-5>table>tr>td>div.number{border-radius:50%;cursor:pointer;display:flex;justify-content:center;line-height:2.5em;margin:auto;width:2.5em;transition:background-color 0.25s;text-transform:capitalize}.built-in-layout-5>table>tr>td>div.number:hover{background-color:var(--kup-hover-background-color)}.collapsible-layout-1{color:var(--kup-text-color);box-shadow:0px 0px 7.5px 0px rgba(128, 128, 128, 0.5);display:flex;height:100%;overflow:hidden;width:100%;box-sizing:border-box;position:relative}.collapsible-layout-1 .section-1{background-color:var(--color-0);display:flex;flex:0 0 10%;max-width:10%}.collapsible-layout-1 .section-2{box-sizing:border-box;height:100%;display:flex;flex:0 0 90%;flex-direction:column;max-width:90%}.collapsible-layout-1 .section-2 .sub-1{min-height:1.5em;display:flex;padding:0.6rem 0.8em 0;font-weight:bold;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.collapsible-layout-1 .section-2 .sub-1 div{font-size:1em}.collapsible-layout-1 .section-2 .sub-1 .left{text-align:left;width:80%}.collapsible-layout-1 .section-2 .sub-1 .right{text-align:right;width:20%}.collapsible-layout-1 .section-2 .sub-2{text-align:left;padding:0.6em 0.8em;font-size:0.875em}.collapsible-layout-2{color:var(--kup-text-color);box-shadow:rgba(0, 0, 0, 0.2) 0px 2px 1px -1px, rgba(0, 0, 0, 0.14) 0px 1px 1px 0px, rgba(0, 0, 0, 0.12) 0px 1px 3px 0px;border-radius:4px;display:flex;height:100%;overflow:hidden;width:100%;box-sizing:border-box;position:relative}.collapsible-layout-2 .section-1{box-sizing:border-box;height:100%;display:flex;flex-direction:column;max-width:100%;width:100%}.collapsible-layout-2 .section-1 .sub-1{text-align:left;padding:0.6em 0.8em 0;font-size:1em;font-weight:bold;max-width:75%}.collapsible-layout-2 .section-1 .sub-2{text-align:left;padding:0.6em 0.8em;max-width:75%}.collapsible-layout-2 .section-1 .sub-2 div{font-size:0.875em}.collapsible-layout-2 .section-1 .sub-3{color:var(--color-0);text-align:center;position:absolute;top:1em;right:1em;max-width:25%;text-overflow:ellipsis;overflow:hidden;max-height:calc(24px + 2.25em);padding:0 1em}.collapsible-layout-2 .section-1 .sub-3 kup-image{margin:auto}.collapsible-layout-2 .section-1 .sub-3 div{font-size:1.25em}.collapsible-card .collapsible-trigger{display:none;position:absolute;bottom:0;left:0;height:50px;width:100%}.collapsible-card .collapsible-trigger kup-button{margin:auto;width:48px}.collapsible-card .collapsible-wrapper{overflow:auto}.collapsible-card.collapsible-active{padding-bottom:50px}.collapsible-card.collapsible-active .collapsible-trigger{display:block}.dialog-layout-1{background-color:var(--kup-background-color);box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);color:var(--kup-text-color);display:flex;flex-direction:column;height:100%;width:100%;overflow:auto}.dialog-layout-1 .section-1{display:grid;grid-gap:0.5em;grid-template-columns:repeat(2, auto);grid-template-rows:repeat(auto-fill, 1.25em);height:100%;padding:0.5em;overflow:auto;touch-action:none}.dialog-layout-1 .section-1 .text{min-width:max-content}.dialog-layout-1 .section-1 .text:not(.label){font-weight:bold}.dialog-layout-2{background-color:var(--kup-background-color);box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);display:flex;flex-direction:column;height:100%;width:100%}.dialog-layout-2 .section-1{text-align:center;touch-action:none;padding-bottom:1em}.dialog-layout-2 .section-1 .text{padding-top:0.75em}.dialog-layout-2 .section-1 .text:not(.label){font-weight:bold}.dialog-layout-2 .section-2{border-top:1px solid var(--kup-border-color);display:grid;grid-gap:0.5em;grid-template-columns:repeat(2, auto);grid-template-rows:repeat(auto-fill, 1.25em);height:100%;padding:0.5em;overflow:auto;touch-action:none}.dialog-layout-2 .section-2 .text{min-width:max-content}.dialog-layout-2 .section-2 .text:not(.label){font-weight:bold}.dialog-layout-3{background-color:var(--kup-background-color);border-radius:4px;box-sizing:border-box;box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);display:flex;overflow:visible;flex-direction:column;height:100%;position:relative;width:100%}.dialog-layout-3 kup-button{margin-left:0}.dialog-layout-3 .section-1{background-color:var(--kup-background-color);display:flex;justify-content:flex-start;align-items:center;box-sizing:border-box;box-shadow:0px 1px 3px 0px var(--kup-text-color);height:52px;width:100%;text-align:right;touch-action:none}.dialog-layout-3 .section-1 kup-button{margin-right:0.25em}.dialog-layout-3 .section-2{height:100%;width:100%;overflow:auto;max-height:50vh}.dialog-layout-3 ::slotted(.text){color:var(--kup-text-color);font-family:var(--kup-font-family-monospace);white-space:nowrap;border-bottom:1px solid var(--kup-border-color);line-height:1.75em}.dialog-layout-4{background-color:var(--kup-background-color);box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);display:flex;flex-direction:column;height:100%;width:100%}.dialog-layout-4 .section-1{display:flex;justify-content:space-evenly}.dialog-layout-4 .section-2{height:100%;overflow:auto;padding:0.25em;touch-action:none}.dialog-layout-5{background-color:var(--kup-background-color);box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);display:flex;flex-direction:column;height:100%;width:100%}.dialog-layout-5 .section-1{display:flex;justify-content:space-evenly}.dialog-layout-5 .section-2{height:100%;overflow:auto}.dialog-layout-6{background-color:var(--kup-background-color);box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);display:flex;flex-direction:column;height:100%;max-height:95vh;max-width:95vw;width:100%}.dialog-layout-6 .section-1{display:flex;height:100%;justify-content:space-evenly;overflow:auto}.dialog-layout-6 kup-data-table{width:100%}#drag-handle{-ms-touch-action:none;touch-action:none}#drag-handle:not(.header-bar){display:flex;height:100%}#drag-handle:not(.header-bar) .f-image{margin:auto}#drag-handle.header-bar{background-color:var(--kup-title-background-color);color:var(--kup-title-color);display:flex;flex-direction:row;height:2em;position:relative;width:100%}#drag-handle.header-bar .dialog-title{font-weight:bold;line-height:2em;padding-left:0.5em;padding-right:2em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#drag-handle.header-bar #dialog-close{cursor:pointer;margin-right:0;transition:opacity 0.25s;position:absolute;right:0;background:var(--kup-title-background-color)}#drag-handle.header-bar #dialog-close:hover{opacity:0.5}.free-layout-1{background:var(--kup-background-color);box-shadow:var(--kup-box-shadow);box-sizing:border-box;overflow:auto;padding:1em}.free-layout-2{background:var(--kup-background-color);box-shadow:var(--kup-box-shadow);box-sizing:border-box;overflow:auto}.scalable-layout-1 .descr{font-size:70%;width:100%}.scalable-layout-1 .value{font-size:220%}.scalable-layout-2 #image1 img{object-fit:contain}.scalable-layout-2 .scalable-element{display:grid;grid-template-columns:1fr 1fr 0.5fr 0.5fr}.scalable-layout-2 .icon{margin:auto;font-size:150%;margin-right:5%}.scalable-layout-2 .value-int{font-size:250%}.scalable-layout-2 .value-dec,.scalable-layout-2 .unit{font-size:130%;margin-top:auto;margin-bottom:10%}.scalable-layout-2 .value-dec{margin-left:2%}.scalable-layout-2 .unit{margin-left:4%}.scalable-layout-3 .descr{font-size:70%;width:100%}.scalable-layout-3 .value{font-size:220%}.scalable-layout-4 #image1 img{object-fit:contain}.scalable-layout-4 .scalable-element{display:grid;grid-template-columns:1fr 5fr}.scalable-layout-4 .icon{font-size:150%;margin:auto 5% auto auto}.scalable-layout-4 .value-and-unit{display:flex;color:var(--color-0)}.scalable-layout-4 .value-and-unit .value-int{font-size:250%}.scalable-layout-4 .value-and-unit .value-dec,.scalable-layout-4 .value-and-unit .unit{font-size:130%;margin-top:auto;margin-bottom:10%}.scalable-layout-4 .value-and-unit .value-dec{margin-left:2%}.scalable-layout-4 .value-and-unit .unit{margin-left:4%}.scalable-layout-4 .descr{margin-left:4%;text-align:left;font-size:80%;width:100%;min-width:max-content}.scalable-layout-5 #image1 img{object-fit:contain}.scalable-layout-5 .scalable-element{display:flex}.scalable-layout-5 .text-wrapper{margin-right:10px}.scalable-layout-5 .icon{font-size:150%;margin:auto;margin-bottom:0.35em}.scalable-layout-5 .value{font-size:200%}.scalable-layout-5 .descr{text-align:right;font-size:65%;width:100%;min-width:max-content;position:relative;bottom:-10%}.scalable-layout-6 #image1 img{object-fit:contain}.scalable-layout-6 .scalable-element{display:flex;justify-content:space-between}.scalable-layout-6 .text-wrapper{margin-left:1em}.scalable-layout-6 .icon{font-size:150%;margin:auto}.scalable-layout-6 .value{font-size:220%;text-align:right}.scalable-layout-6 .descr{font-size:80%;text-align:right;width:100%;min-width:max-content}.scalable-layout-7 #image1 img{object-fit:contain}.scalable-layout-7 .scalable-element{display:flex}.scalable-layout-7 .text-wrapper{margin-right:0.5em}.scalable-layout-7 .icon{font-size:150%;margin:auto;margin-top:0.35em}.scalable-layout-7 .value{font-size:200%}.scalable-layout-7 .descr{text-align:right;font-size:65%;width:100%;min-width:max-content;position:relative;bottom:10%}.scalable-layout-8 #image1 img{object-fit:contain}.scalable-layout-8 .scalable-element{align-items:center;display:grid;grid-template-columns:0.25fr 1.25fr 0.25fr}.scalable-layout-8 .icon{margin-right:4%;font-size:75%}.scalable-layout-8 .value{margin:0 10%;font-size:250%}.scalable-layout-8 .descr{font-size:60%;text-align:left}.scalable-layout-9{background-color:var(--color-1);color:var(--color-2);height:100%;display:flex;justify-content:unset;overflow:auto;box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);border-radius:4px}.scalable-layout-9 .section-1{background-color:var(--color-0);width:20%;height:100%}.scalable-layout-9 .section-2{width:100%;height:100%;display:flex;flex-direction:column}.scalable-layout-9 .text{display:flex;justify-content:center;flex-direction:column}.scalable-layout-9 .descr{font-size:80%}.scalable-layout-9 .value{font-size:220%}.scalable-layout-9 .buttons{height:max-content;margin-bottom:2%}.scalable-layout-9 .f-button{float:right}.scalable-card{align-items:center;box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);border-radius:4px;display:flex;font-size:calc(var(--kup-font-size) * var(--kup_card_multiplier));height:100%;justify-content:center;position:relative;text-align:center;word-break:normal;width:100%}.standard-layout-1{background-color:var(--kup-background-color);border-radius:4px;box-sizing:border-box;box-shadow:0 2px 1px -1px rgba(128, 128, 128, 0.1), 0 1px 1px 0 rgba(128, 128, 128, 0.1), 0 1px 3px 0 rgba(128, 128, 128, 0.6);display:flex;flex-direction:column;height:100%;position:relative;width:100%;overflow:auto}.standard-layout-1 kup-button{margin-right:0}.standard-layout-1 #image1 img{object-fit:cover}.standard-layout-1.has-actions{padding-bottom:52px}.standard-layout-1.has-actions .section-2 .sub-2.description{padding-bottom:0}.standard-layout-1 .section-1{height:60%;width:100%}.standard-layout-1 .section-2{height:40%;width:100%;overflow:auto}.standard-layout-1 .section-2 .sub-2.title{color:var(--kup-text-color);padding:0 1em;padding-top:1em;text-align:left}.standard-layout-1 .section-2 .sub-2.title div{font-size:1.25em;font-weight:500;letter-spacing:0.0125em}.standard-layout-1 .section-2 .sub-2.subtitle{opacity:0.6;padding:0 1em;padding-bottom:1em;text-align:left}.standard-layout-1 .section-2 .sub-2.subtitle div{font-size:0.875em;font-weight:500;letter-spacing:0.0071428571em;line-height:1.375em}.standard-layout-1 .section-2 .sub-2.description{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;opacity:0.6;padding:0 1em;padding-bottom:1em;text-align:left}.standard-layout-1 .section-2 .sub-2.description div{font-size:0.875em;font-weight:400;letter-spacing:0.0178571429em;line-height:1.25em}.standard-layout-1 .section-3{display:flex;justify-content:flex-end;align-items:center;box-sizing:border-box;position:absolute;left:0;bottom:0;padding:2px 1em;height:52px;width:100%;text-align:right}.standard-layout-1 .section-3 kup-button{margin-left:0.25em}.standard-layout-2{background-color:var(--kup-background-color);border-radius:4px;box-sizing:border-box;box-shadow:0 2px 1px -1px rgba(128, 128, 128, 0.1), 0 1px 1px 0 rgba(128, 128, 128, 0.1), 0 1px 3px 0 rgba(128, 128, 128, 0.6);display:flex;flex-direction:column;height:100%;position:relative;width:100%;overflow:auto}.standard-layout-2 kup-button{margin-right:0}.standard-layout-2 #image1 img{object-fit:cover}.standard-layout-2.has-actions{padding-bottom:52px}.standard-layout-2.has-actions .section-3 .sub-3.description{padding-bottom:0}.standard-layout-2 .section-1{width:100%}.standard-layout-2 .section-1 .sub-1.title{color:var(--kup-text-color);padding:0 1em;padding-top:1em;text-align:left}.standard-layout-2 .section-1 .sub-1.title div{font-size:1.25em;font-weight:500;letter-spacing:0.0125em}.standard-layout-2 .section-1 .sub-1.subtitle{opacity:0.6;padding:0 1em;padding-bottom:1em;text-align:left}.standard-layout-2 .section-1 .sub-1.subtitle div{font-size:0.875em;font-weight:500;letter-spacing:0.0071428571em;line-height:1.375em}.standard-layout-2 .section-2{height:75%;width:100%}.standard-layout-2 .section-3{width:100%;overflow:auto}.standard-layout-2 .section-3 .sub-3.description{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;opacity:0.6;padding:0 1em 8px;padding-top:1em;text-align:left}.standard-layout-2 .section-3 .sub-3.description div{font-size:0.875em;font-weight:400;letter-spacing:0.0178571429em;line-height:1.25em}.standard-layout-2 .section-4{display:flex;justify-content:flex-end;align-items:center;box-sizing:border-box;position:absolute;left:0;bottom:0;padding:2px 1em;height:52px;width:100%;text-align:right}.standard-layout-2 .section-4 kup-button{margin-left:0.25em}.standard-layout-3{background-color:var(--kup-background-color);border-radius:4px;box-sizing:border-box;box-shadow:0 2px 1px -1px rgba(128, 128, 128, 0.1), 0 1px 1px 0 rgba(128, 128, 128, 0.1), 0 1px 3px 0 rgba(128, 128, 128, 0.6);display:flex;flex-direction:column;height:100%;position:relative;width:100%;overflow:auto}.standard-layout-3 kup-button{margin-right:0}.standard-layout-3 #image1 img{object-fit:cover}.standard-layout-3.has-actions{padding-bottom:52px}.standard-layout-3.has-actions .section-2 .sub-2.description{padding-bottom:0}.standard-layout-3 .section-1{height:75%;width:100%}.standard-layout-3 .section-1 .media{position:relative;height:100%;width:100%}.standard-layout-3 .section-1 .text-on-media{position:absolute;bottom:0;left:0}.standard-layout-3 .section-1 .sub-1.title{color:white;padding:0 1em;padding-top:1em;text-align:left}.standard-layout-3 .section-1 .sub-1.title div{font-size:1.25em;font-weight:500;letter-spacing:0.0125em}.standard-layout-3 .section-1 .sub-1.subtitle{color:white;opacity:0.6;padding:0 1em;padding-bottom:1em;text-align:left}.standard-layout-3 .section-1 .sub-1.subtitle div{font-size:0.875em;font-weight:500;letter-spacing:0.0071428571em;line-height:1.375em}.standard-layout-3 .section-2{width:100%;overflow:auto}.standard-layout-3 .section-2 .sub-2.description{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;opacity:0.6;padding:0 1em 8px;padding-top:1em;text-align:left}.standard-layout-3 .section-2 .sub-2.description div{font-size:0.875em;font-weight:400;letter-spacing:0.0178571429em;line-height:1.25em}.standard-layout-3 .section-3{display:flex;justify-content:flex-end;align-items:center;box-sizing:border-box;position:absolute;left:0;bottom:0;padding:2px 1em;height:52px;width:100%;text-align:right}.standard-layout-3 .section-3 kup-button{margin-left:0.25em}.standard-layout-4{background-color:var(--kup-background-color);border-radius:4px;box-sizing:border-box;box-shadow:0 2px 1px -1px rgba(128, 128, 128, 0.1), 0 1px 1px 0 rgba(128, 128, 128, 0.1), 0 1px 3px 0 rgba(128, 128, 128, 0.6);display:flex;flex-direction:column;height:100%;position:relative;width:100%;overflow:auto}.standard-layout-4 kup-button{margin-right:0}.standard-layout-4 #image1 img{object-fit:cover}.standard-layout-4.has-actions{padding-bottom:52px}.standard-layout-4.has-actions .section-3 .sub-3.description{padding-bottom:0}.standard-layout-4 .section-1{display:flex;height:100%;width:100%}.standard-layout-4 .section-1 .sub-1.image{width:33%}.standard-layout-4 .section-1 .sub-1.text{width:77%}.standard-layout-4 .section-1 .sub-1.title{color:var(--kup-text-color);padding:0 1em;padding-top:1em;text-align:left}.standard-layout-4 .section-1 .sub-1.title div{font-size:1.25em;font-weight:500;letter-spacing:0.0125em}.standard-layout-4 .section-1 .sub-1.subtitle{opacity:0.6;padding:0 1em;padding-bottom:1em;text-align:left}.standard-layout-4 .section-1 .sub-1.subtitle div{font-size:0.875em;font-weight:500;letter-spacing:0.0071428571em;line-height:1.375em}.standard-layout-4 .section-2{display:flex;justify-content:flex-end;align-items:center;box-sizing:border-box;position:absolute;left:0;bottom:0;padding:2px 1em;height:52px;width:100%;text-align:right}.standard-layout-4 .section-2 kup-button{margin-left:0.25em}.standard-layout-5{background-color:var(--kup-background-color);color:var(--kup-text-color);box-shadow:0px 0px 7.5px 0px rgba(128, 128, 128, 0.5);height:100%;overflow:hidden;width:100%}.standard-layout-5 .section-1{background-color:var(--color-0);height:3%}.standard-layout-5 .section-2{display:flex;height:53%}.standard-layout-5 .section-3{display:flex;height:24%}.standard-layout-5 .section-4{display:flex;height:20%;background-color:var(--color-1)}.standard-layout-5 .sub-2{box-sizing:border-box;display:flex;flex-direction:column;flex-wrap:wrap;justify-content:center}.standard-layout-5 .sub-2.icon{min-height:20px;flex:0 0 10%;max-width:10%}.standard-layout-5 .sub-2.icon #image1{box-sizing:border-box;margin:auto;padding:0 20%}.standard-layout-5 .sub-2.icon #image1 img{object-fit:contain}.standard-layout-5 .sub-2.text{flex:0 0 70%;max-width:70%;margin:auto;height:100%;flex-wrap:nowrap;padding:1em;text-align:left}.standard-layout-5 .sub-2.image{box-sizing:border-box;flex:0 0 20%;padding:1.5vh 0;max-width:20%}.standard-layout-5 .sub-2.image #image2{box-sizing:border-box;margin:auto;padding:0 10%}.standard-layout-5 .sub-2.image #image2 img{object-fit:contain}.standard-layout-5 .sub-2 .desc-text{overflow:auto}.standard-layout-5 .sub-2 .alt-text{color:var(--kup-primary-color)}.standard-layout-5 .sub-3{box-sizing:border-box}.standard-layout-5 .sub-3.progress-bar{margin:auto;padding:0 5%;vertical-align:2px;width:80%}.standard-layout-5 .sub-3.button{margin:auto;text-align:center;width:20%}.standard-layout-5 .sub-3 kup-button{margin:auto}.standard-layout-5 .sub-4{box-sizing:border-box;margin:auto}.standard-layout-5 .sub-4.text{width:50%;font-size:0.875em}.standard-layout-5 .sub-4 div{padding:0 5%}.standard-layout-5 .sub-4 .alt-text{color:var(--color-0);font-size:1em}.standard-layout-5 .alt-text{font-weight:bold}@media screen and (max-width: 767px){.standard-layout-5 .sub-2.image{display:none}.standard-layout-5 .sub-2.icon{flex-basis:30%;max-width:30%}}.standard-layout-6{background-color:var(--kup-background-color);color:var(--kup-text-color);box-shadow:0px 0px 7.5px 0px rgba(128, 128, 128, 0.5);display:flex;height:100%;overflow:hidden;width:100%}.standard-layout-6 .section-1{background-color:var(--color-0);display:flex;flex:0 0 10%;max-width:10%}.standard-layout-6 .section-1 .alt-text{color:var(--kup_card_dynamic_color_0);height:100%;text-align:center;writing-mode:vertical-lr;margin:auto;font-size:1.25em}.standard-layout-6 .section-2{box-sizing:border-box;height:100%;display:flex;flex:0 0 90%;flex-direction:column;max-width:90%}.standard-layout-6 .section-2 .sub-2{margin:auto;text-align:center}.standard-layout-6 .section-2 .sub-2 kup-progress-bar{margin-bottom:1em}.standard-layout-6 kup-button{position:absolute;bottom:2%;right:2%}.standard-layout-7{background-color:var(--kup-background-color);color:var(--kup-text-color);box-shadow:0px 0px 7.5px 0px rgba(128, 128, 128, 0.5);display:flex;flex-direction:column;height:100%;overflow:hidden;width:100%}.standard-layout-7 #image1 img{margin:auto;object-fit:contain}.standard-layout-7 .section-1{background-color:var(--color-0);height:5%;width:100%}.standard-layout-7 .section-2{height:80%;width:100%;text-align:center;padding:25px 25%;box-sizing:border-box}.standard-layout-7 .section-2 .sub-2{margin:auto}.standard-layout-7 .section-2 .sub-2.image{box-sizing:border-box;height:65%}.standard-layout-7 .section-2 .sub-2.text{font-size:1.4em;letter-spacing:1.2px;padding-top:1em;height:35%}.standard-layout-7 .section-3{display:flex;height:15%;width:100%}.standard-layout-7 .section-3 .alt-text{margin:auto;opacity:0.75;width:50%}.standard-layout-7 .section-3 .alt-text:nth-child(1){margin-left:1em;text-align:left}.standard-layout-7 .section-3 .alt-text:nth-child(2){margin-right:1em;text-align:right}.standard-layout-8{background-color:var(--kup-background-color);color:var(--kup-text-color);box-shadow:0px 0px 7.5px 0px rgba(128, 128, 128, 0.5);display:flex;flex-direction:column;height:100%;overflow:hidden;width:100%;box-sizing:border-box;position:relative}.standard-layout-8 .background{background-color:var(--color-0);content:\"\";height:100%;width:100%;opacity:0.1;pointer-events:none;position:absolute;top:0;left:0;z-index:1}.standard-layout-8 .section-1{box-sizing:border-box;display:flex;flex-direction:column;max-width:100%;overflow:auto;height:auto}.standard-layout-8 .section-1 .sub-1{text-align:left;padding:0.6em 0.8em 0;font-size:1em;font-weight:bold;max-width:75%}.standard-layout-8 .section-1 .sub-2{text-align:left;padding:0.6em 0.8em;font-size:0.875em;max-width:75%}.standard-layout-8 .section-1 .sub-3{color:var(--color-0);font-weight:bold;text-align:center;font-size:1.2em;position:absolute;top:1em;right:1em;max-width:25%;text-overflow:ellipsis;max-height:calc(24px + 2.25em);padding:0 1em;overflow:hidden}.standard-layout-8 .section-1 .sub-3 kup-image{margin:auto}.standard-layout-8 .section-2{display:flex;height:auto;overflow:auto}.standard-layout-9{background-color:var(--kup-background-color);color:var(--kup-text-color);box-shadow:0px 0px 7.5px 0px rgba(128, 128, 128, 0.5);display:flex;flex-direction:row;height:100%;overflow:hidden;width:100%;box-sizing:border-box;position:relative}.standard-layout-9 #image1 img{object-fit:contain}.standard-layout-9 .section-1{margin-top:auto;margin-right:18px;margin-bottom:auto;white-space:nowrap}.standard-layout-9 .section-2{display:flex;height:100%;margin-top:auto;margin-bottom:auto;width:100%;overflow:hidden}.standard-layout-9 .sub-2{display:flex;flex-direction:row}.standard-layout-9 .text{text-align:left}.standard-layout-9 .text-wrapper{display:flex;flex-direction:column}.standard-layout-9 .icon{margin:auto;padding:0 1.25em}.standard-layout-9 .description{font-size:1.5em;letter-spacing:1px;padding-left:1.25em;padding-top:0.25em}.standard-layout-9 .title{font-size:2.75em;font-weight:bold}.standard-layout-9 .subtitle{font-size:1.5em;opacity:0.75}.standard-layout-10{background-color:var(--kup-background-color);color:var(--kup-text-color);box-shadow:0px 0px 7.5px 0px rgba(128, 128, 128, 0.5);display:flex;flex-direction:row;height:100%;overflow:hidden;width:100%;box-sizing:border-box;position:relative}.standard-layout-10 #image1 img{object-fit:contain}.standard-layout-10 .section-1{display:flex;height:100%;margin-top:auto;margin-bottom:auto;width:100%;overflow:hidden}.standard-layout-10 .section-2{margin-top:auto;margin-left:18px;margin-bottom:auto;white-space:nowrap}.standard-layout-10 .sub-2{display:flex;flex-direction:row-reverse}.standard-layout-10 .text{text-align:right}.standard-layout-10 .text-wrapper{display:flex;flex-direction:column}.standard-layout-10 .icon{margin:auto;padding:0 1.25em}.standard-layout-10 .description{font-size:1.5em;letter-spacing:1px;padding-right:1.25em;padding-top:0.25em}.standard-layout-10 .title{font-size:2.75em;font-weight:bold}.standard-layout-10 .subtitle{font-size:1.5em;opacity:0.75}.standard-layout-11{background-color:var(--kup-background-color);color:var(--kup-text-color);box-shadow:0px 0px 7.5px 0px rgba(128, 128, 128, 0.5);display:flex;flex-direction:row;height:100%;overflow:hidden;width:100%;box-sizing:border-box;position:relative}.standard-layout-11 #image1 img{object-fit:contain}.standard-layout-11 .section-1{display:flex;height:100%;margin-top:auto;margin-bottom:auto;min-width:6em;max-width:6em;overflow:hidden;transition:0.25s ease-in}.standard-layout-11 .section-2{display:flex;height:100%;margin-top:auto;margin-bottom:auto;width:100%;overflow:hidden}.standard-layout-11 .sub-1{background-color:var(--color-0);height:100%;text-align:center;writing-mode:vertical-lr;min-width:6em;display:flex;transition:width 0.25s ease-in}.standard-layout-11 .sub-1 div{font-size:1.25em}.standard-layout-11 .sub-2{display:flex;flex-direction:row}.standard-layout-11 .text:not(.description){text-align:left}.standard-layout-11 .text-wrapper{display:flex;flex-direction:column}.standard-layout-11 .icon{margin:auto;padding:0 1.25em}.standard-layout-11 .description{font-size:1.5em;letter-spacing:1px;margin:auto;color:var(--kup_card_dynamic_color_0)}.standard-layout-11 .title{font-size:2.75em;font-weight:bold;margin-top:auto}.standard-layout-11 .subtitle{font-size:1.5em;opacity:0.75;margin-bottom:auto}.standard-layout-12{background-color:var(--kup-background-color);box-shadow:0 2px 1px -1px rgba(128, 128, 128, 0.1), 0 1px 1px 0 rgba(128, 128, 128, 0.1), 0 1px 3px 0 rgba(128, 128, 128, 0.6);color:var(--kup-text-color);min-width:200px;min-width:-moz-max-content;min-width:-webkit-max-content;}.standard-layout-12 .section-1{display:inline-flex;border-bottom:1px solid var(--kup-border-color);width:100%}.standard-layout-12 .section-1 kup-button{margin:0}.standard-layout-12 .section-2{display:flex;flex-direction:column}.standard-layout-12 .section-2.has-content{border-bottom:1px solid var(--kup-border-color);padding:0.5em 0.5em}.standard-layout-12 .section-2 kup-date-picker:first-of-type,.standard-layout-12 .section-2 kup-time-picker:first-of-type{margin-bottom:0.5em}.standard-layout-12 .section-3{backface-visibility:hidden;display:flex;flex-direction:column;max-height:20vh;overflow:auto}.standard-layout-12 .section-3 kup-checkbox{margin-left:0;margin-right:auto}.standard-layout-13{background-color:var(--kup-background-color);border-radius:4px;box-sizing:border-box;box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);display:flex;flex-direction:column;height:100%;position:relative;width:100%}.standard-layout-13 kup-button{margin-left:0}.standard-layout-13 .section-1{background-color:var(--kup-background-color);display:flex;justify-content:flex-start;align-items:center;box-sizing:border-box;box-shadow:0px 1px 3px 0px var(--kup-text-color);height:52px;width:100%;text-align:right}.standard-layout-13 .section-1 kup-button{margin-right:0.25em}.standard-layout-13 .section-2{height:100%;width:100%;overflow:auto;max-height:50vh}.standard-layout-13 .text{color:var(--kup-text-color);font-family:var(--kup-font-family-monospace);white-space:nowrap;border-bottom:1px solid var(--kup-border-color);line-height:1.75em}.standard-layout-14{background-color:var(--kup-background-color);box-shadow:0 2px 1px -1px rgba(128, 128, 128, 0.1), 0 1px 1px 0 rgba(128, 128, 128, 0.1), 0 1px 3px 0 rgba(128, 128, 128, 0.6);color:var(--kup-text-color);min-width:200px;min-width:-moz-max-content;min-width:-webkit-max-content;}.standard-layout-14 .section-1{display:flex;padding:1em}.standard-layout-14 .section-1 .sub-1{width:100%}.standard-layout-14 .section-1 .sub-spinner{height:88px;width:88px;margin:0 10px}.standard-layout-14 .section-1 .f-image{margin:0 0.5em 0 0}.standard-layout-14 .section-1 .title{--kup-button-font-size:0.75em;font-size:1.25em;margin-top:-0.5em;padding:0 0.25em 0.25em}.standard-layout-14 .section-1 .title .label{cursor:pointer;padding-right:0.25em}.standard-layout-14 .section-1 .title .label:hover{text-decoration:underline}.standard-layout-14 .section-1 .info{display:flex;padding:0 0.25em 0.25em;width:100%}.standard-layout-14 .section-1 .info .label{color:rgba(var(--kup-text-color-rgb), 0.75);margin-right:0.75em;min-width:max-content;width:auto}.standard-layout-14 .section-1 .info .value{width:100%}.standard-layout-14 .sub-button{display:inline-flex;width:100%}.standard-layout-14 .sub-button kup-button{margin:0}.standard-layout-14 .sub-checkbox{backface-visibility:hidden;display:flex;flex-direction:column;max-height:20vh;overflow:auto}.standard-layout-14 .sub-checkbox kup-checkbox{margin-left:0;margin-right:auto}.standard-layout-14 .sub-formula{padding:0.5em}.standard-layout-14 .sub-chip{max-width:25vw;overflow:auto;box-shadow:0 3px 2px -2px var(--kup-border-color)}.standard-layout-14 .sub-field{display:flex;flex-direction:column}.standard-layout-14 .sub-field.has-content{border-bottom:1px solid var(--kup-border-color);padding:0.5em 0.5em}.standard-layout-14 .sub-field kup-date-picker:first-of-type,.standard-layout-14 .sub-field kup-time-picker:first-of-type{margin-bottom:0.5em}.standard-layout-14 .sub-spinner{height:100px}.standard-layout-14 .sub-autocomplete{padding-top:1em}.standard-layout-14 .sub-autocomplete kup-autocomplete{margin:auto;padding:0.5em 0;width:max-content}.standard-layout-14 .sub-switch{display:flex;justify-content:space-evenly;padding:2em}.standard-layout-14 .sub-tree{max-height:25vh;overflow:auto}.standard-layout-14 #apply{display:none;margin:auto}.standard-layout-14 #apply.visible{display:block}.standard-layout-14 #open-in-new,.standard-layout-14 #search,.standard-layout-14 #new{margin:0;display:inline-flex}.standard-layout-15{background:var(--kup-background-color);border-radius:3px;box-shadow:0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);color:var(--kup-text-color);display:block;font-size:var(--kup-font-size);outline:none}.standard-layout-15 .section-1{--kup-button-font-size:0.75em;box-sizing:border-box;display:flex;padding:1em}.standard-layout-15 .section-1 .sub-1{width:100%}.standard-layout-15 .section-1 .sub-spinner{height:88px;width:88px;margin:0 10px}.standard-layout-15 .section-1 .f-image{margin:0 0.5em 0 0}.standard-layout-15 .section-1 .title{align-items:center;display:flex;font-size:1.25em;font-weight:600;padding:0 0.25em 0.25em;text-align:left}.standard-layout-15 .section-1 .title .label{cursor:pointer;padding-right:0.25em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.standard-layout-15 .section-1 .title .label:hover{text-decoration:underline}.standard-layout-15 .section-1 .info{display:flex;padding:0 0.25em 0.25em;width:100%}.standard-layout-15 .section-1 .info .label{color:rgba(var(--kup-text-color-rgb), 0.75);margin-right:0.75em;min-width:max-content;width:auto}.standard-layout-15 .section-1 .info .value{font-weight:600;width:100%}.standard-layout-15 .section-2{border-top:1px solid var(--kup-border-color);box-sizing:border-box;height:180px;opacity:1;overflow:auto;transition:height 250ms ease-out, opacity 250ms ease-out}.standard-layout-15 .section-2 .info{box-sizing:border-box;height:100%;overflow:auto;padding:1.25em}.standard-layout-15 .section-2 .detail-row{align-items:center;display:flex;justify-content:space-between}.standard-layout-15 .section-2 .detail-row:not(:last-child){margin-bottom:6px}.standard-layout-15 .section-2 .detail-row__label{color:rgba(var(--kup-text-color-rgb), 0.5);margin-top:0.175em;max-width:320px;padding-right:1.25em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.standard-layout-15 .section-2 .detail-row__value{color:var(--kup-text-color);font-size:105%;font-weight:600;max-width:320px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.standard-layout-15 .section-2 kup-tree{text-align:left}.standard-layout-15 .section-3{border-top:1px solid var(--kup-border-color);display:flex;justify-content:flex-end;padding:6px;padding-top:2px;padding-bottom:2px}.standard-layout-15 .section-3 kup-button{margin:auto 0}.standard-layout-15 #open-in-new,.standard-layout-15 #search,.standard-layout-15 #new{margin:0 0 0.5em 0}:host{--kup_card_ripple_color:var(\n --kup-card-ripple-color,\n var(--kup-primary-color)\n );display:block;font-size:var(--kup-font-size);height:var(--kup_card_height);min-height:var(--kup_card_height);min-width:var(--kup_card_width);outline:none;position:relative;width:var(--kup_card_width)}:host([is-menu]){display:none;animation:fade-in 0.25s ease-out}:host([menu-visible]){box-shadow:var(--kup-box-shadow);display:block}#kup-component{height:100%;width:100%}.mdc-ripple-surface{cursor:pointer;flex-direction:column;display:flex;height:100%;position:relative}.mdc-ripple-surface:before,.mdc-ripple-surface:after{background-color:var(--kup_card_ripple_color)}.card-view{animation:fade-in 0.25s ease-out;display:none;height:100%;width:100%}.card-view.visible{display:block}";
|
|
5076
5257
|
|
|
5077
5258
|
const KupCard = class {
|
|
5078
5259
|
constructor(hostRef) {
|
|
@@ -5260,6 +5441,9 @@ const KupCard = class {
|
|
|
5260
5441
|
const method = 'create' + this.layoutNumber;
|
|
5261
5442
|
try {
|
|
5262
5443
|
switch (family) {
|
|
5444
|
+
case kupManager.KupCardFamily.BOX: {
|
|
5445
|
+
return boxLayouts[method](this);
|
|
5446
|
+
}
|
|
5263
5447
|
case kupManager.KupCardFamily.BUILT_IN: {
|
|
5264
5448
|
return builtInLayouts[method](this);
|
|
5265
5449
|
}
|
|
@@ -7050,6 +7234,7 @@ const KupCombobox = class {
|
|
|
7050
7234
|
this.kupItemClick.emit({
|
|
7051
7235
|
comp: this,
|
|
7052
7236
|
id: this.rootElement.id,
|
|
7237
|
+
node: e.detail.selected,
|
|
7053
7238
|
value: this.value,
|
|
7054
7239
|
inputValue: __classPrivateFieldGet$1(this, _KupCombobox_textfieldEl, "f").value,
|
|
7055
7240
|
});
|
|
@@ -7404,27 +7589,6 @@ class KupColumnMenu {
|
|
|
7404
7589
|
: dom.ketchup.language.translate(kupManager.KupLanguageGrouping.ENABLE),
|
|
7405
7590
|
});
|
|
7406
7591
|
}
|
|
7407
|
-
props.push({
|
|
7408
|
-
className: 'printable',
|
|
7409
|
-
customStyle: ':host {--kup-font-size: 0.75em;}',
|
|
7410
|
-
icon: 'open-in-new',
|
|
7411
|
-
id: KupColumnMenuIds.BUTTON_OPEN_IN_NEW,
|
|
7412
|
-
title: dom.ketchup.language.translate(kupManager.KupLanguageGeneric.OPEN_IN_NEW_TAB),
|
|
7413
|
-
});
|
|
7414
|
-
props.push({
|
|
7415
|
-
className: 'printable',
|
|
7416
|
-
customStyle: ':host {--kup-font-size: 0.75em;}',
|
|
7417
|
-
icon: 'search',
|
|
7418
|
-
id: KupColumnMenuIds.BUTTON_SEARCH,
|
|
7419
|
-
title: dom.ketchup.language.translate(kupManager.KupLanguageGeneric.INFO),
|
|
7420
|
-
});
|
|
7421
|
-
props.push({
|
|
7422
|
-
className: 'printable',
|
|
7423
|
-
customStyle: ':host {--kup-font-size: 0.75em;}',
|
|
7424
|
-
icon: 'add',
|
|
7425
|
-
id: KupColumnMenuIds.BUTTON_NEW,
|
|
7426
|
-
title: dom.ketchup.language.translate(kupManager.KupLanguageGeneric.ADD_NEW),
|
|
7427
|
-
});
|
|
7428
7592
|
if (comp.removableColumns) {
|
|
7429
7593
|
props.push({
|
|
7430
7594
|
className: 'printable',
|
|
@@ -8362,7 +8526,7 @@ const KupDataTable = class {
|
|
|
8362
8526
|
'format-color-text',
|
|
8363
8527
|
'format-font-size-increase',
|
|
8364
8528
|
];
|
|
8365
|
-
this.DENSITY_DECODES = ['Dense', '
|
|
8529
|
+
this.DENSITY_DECODES = ['Dense', 'Medium', 'Wide'];
|
|
8366
8530
|
this.DENSITY_ICONS = [
|
|
8367
8531
|
'format-align-justify',
|
|
8368
8532
|
'reorder-horizontal',
|
|
@@ -8624,6 +8788,30 @@ const KupDataTable = class {
|
|
|
8624
8788
|
async collapseAll() {
|
|
8625
8789
|
this.expandGroups = false;
|
|
8626
8790
|
}
|
|
8791
|
+
/**
|
|
8792
|
+
* This method will delete rows by id from the data table dataset.
|
|
8793
|
+
* @param {string[]} ids - Array of row ids to delete.
|
|
8794
|
+
* @returns {Promise<Array<KupDataTableRow>>} Deleted rows.
|
|
8795
|
+
*/
|
|
8796
|
+
async deleteRows(ids = []) {
|
|
8797
|
+
const deletedRows = [];
|
|
8798
|
+
const newRows = [];
|
|
8799
|
+
for (let index = 0; index < this.data.rows.length; index++) {
|
|
8800
|
+
const row = this.data.rows[index];
|
|
8801
|
+
if (ids.includes(row.id)) {
|
|
8802
|
+
deletedRows.push(row);
|
|
8803
|
+
}
|
|
8804
|
+
else {
|
|
8805
|
+
newRows.push(row);
|
|
8806
|
+
}
|
|
8807
|
+
}
|
|
8808
|
+
if (deletedRows.length > 0) {
|
|
8809
|
+
this.data.rows = newRows;
|
|
8810
|
+
this.recalculateRowsAndUndoSelections();
|
|
8811
|
+
await this.refresh();
|
|
8812
|
+
}
|
|
8813
|
+
return deletedRows;
|
|
8814
|
+
}
|
|
8627
8815
|
/**
|
|
8628
8816
|
* Expands all groups.
|
|
8629
8817
|
*/
|
|
@@ -8731,6 +8919,49 @@ const KupDataTable = class {
|
|
|
8731
8919
|
this.resizeTimeout = window.setTimeout(() => this.refresh(), 300);
|
|
8732
8920
|
}
|
|
8733
8921
|
}
|
|
8922
|
+
/**
|
|
8923
|
+
* Sets the cell value in a table cell.
|
|
8924
|
+
* @param {string} columnName - Name of the column.
|
|
8925
|
+
* @param {string} rowId - Id of the row.
|
|
8926
|
+
* @param {string} value - Value to set.
|
|
8927
|
+
*/
|
|
8928
|
+
async setCellValue(columnName, rowId, value) {
|
|
8929
|
+
const column = kupManager.getColumnByName(this.data.columns, columnName);
|
|
8930
|
+
if (!column) {
|
|
8931
|
+
return;
|
|
8932
|
+
}
|
|
8933
|
+
const row = this.getRow(rowId);
|
|
8934
|
+
if (!row) {
|
|
8935
|
+
return;
|
|
8936
|
+
}
|
|
8937
|
+
const cell = row.cells[columnName];
|
|
8938
|
+
if (!cell) {
|
|
8939
|
+
return;
|
|
8940
|
+
}
|
|
8941
|
+
cell.value = value;
|
|
8942
|
+
cell.displayedValue = null;
|
|
8943
|
+
if (cell.data) {
|
|
8944
|
+
cell.data.key = new Date().getTime() + column.name;
|
|
8945
|
+
cell.data.initialValue = value;
|
|
8946
|
+
}
|
|
8947
|
+
/*
|
|
8948
|
+
const cells = this.rootElement.shadowRoot.querySelectorAll(
|
|
8949
|
+
'td[data-column="' + columnName + '"]'
|
|
8950
|
+
);
|
|
8951
|
+
for (let index = 0; cells && index < cells.length; index++) {
|
|
8952
|
+
const cell = cells[index];
|
|
8953
|
+
if (cell['data-row'] && cell['data-row'].id == rowId) {
|
|
8954
|
+
const kupInput = cell.querySelector('.hydrated');
|
|
8955
|
+
if (kupInput) {
|
|
8956
|
+
try {
|
|
8957
|
+
(kupInput as any).setValue(value);
|
|
8958
|
+
} catch (error) {}
|
|
8959
|
+
}
|
|
8960
|
+
break;
|
|
8961
|
+
}
|
|
8962
|
+
}*/
|
|
8963
|
+
this.refresh();
|
|
8964
|
+
}
|
|
8734
8965
|
/**
|
|
8735
8966
|
* Sets the focus on an editable table cell.
|
|
8736
8967
|
* @param {string} column - Name of the column.
|
|
@@ -8773,13 +9004,7 @@ const KupDataTable = class {
|
|
|
8773
9004
|
this.selectedRows = [];
|
|
8774
9005
|
for (let index = 0; index < rowsIdentifiers.length; index++) {
|
|
8775
9006
|
const id = rowsIdentifiers[index];
|
|
8776
|
-
|
|
8777
|
-
this.selectedRows.push(this.renderedRows[id]);
|
|
8778
|
-
}
|
|
8779
|
-
else {
|
|
8780
|
-
const row = this.renderedRows.find((row) => row.id === id);
|
|
8781
|
-
this.selectedRows.push(row);
|
|
8782
|
-
}
|
|
9007
|
+
this.selectedRows.push(this.getRow(id));
|
|
8783
9008
|
}
|
|
8784
9009
|
if (emitEvent !== false) {
|
|
8785
9010
|
this.kupRowSelected.emit({
|
|
@@ -8854,6 +9079,20 @@ const KupDataTable = class {
|
|
|
8854
9079
|
this.setTransposedData();
|
|
8855
9080
|
}
|
|
8856
9081
|
}
|
|
9082
|
+
getRow(id) {
|
|
9083
|
+
if (typeof id === 'number') {
|
|
9084
|
+
return this.data.rows[id];
|
|
9085
|
+
}
|
|
9086
|
+
else {
|
|
9087
|
+
return this.data.rows.find((row) => row.id === id);
|
|
9088
|
+
}
|
|
9089
|
+
}
|
|
9090
|
+
getTransposedData(column) {
|
|
9091
|
+
if (column) {
|
|
9092
|
+
this.filters = {};
|
|
9093
|
+
}
|
|
9094
|
+
return this.kupManager.data.transpose(this.data, column);
|
|
9095
|
+
}
|
|
8857
9096
|
setTransposedData() {
|
|
8858
9097
|
// transpose
|
|
8859
9098
|
this.originalData = Object.assign({}, this.data);
|
|
@@ -8989,12 +9228,6 @@ const KupDataTable = class {
|
|
|
8989
9228
|
delete column.icon;
|
|
8990
9229
|
}
|
|
8991
9230
|
}
|
|
8992
|
-
getTransposedData(column) {
|
|
8993
|
-
if (column) {
|
|
8994
|
-
this.filters = {};
|
|
8995
|
-
}
|
|
8996
|
-
return this.kupManager.data.transpose(this.data, column);
|
|
8997
|
-
}
|
|
8998
9231
|
updateStickyHeaderSize() {
|
|
8999
9232
|
const navBar = document.querySelectorAll('.header')[0];
|
|
9000
9233
|
if (navBar) {
|
|
@@ -11044,8 +11277,9 @@ const KupDataTable = class {
|
|
|
11044
11277
|
this.kupManager.removeClickCallback(this.clickCbCustomPanel);
|
|
11045
11278
|
}
|
|
11046
11279
|
renderPaginator(top) {
|
|
11047
|
-
return (index.h("div", { class: "paginator-wrapper" }, index.h("div", { class: "paginator-tabs" },
|
|
11048
|
-
|
|
11280
|
+
return (index.h("div", { class: "paginator-wrapper" }, index.h("div", { class: "paginator-tabs" }, this.showLoadMore ||
|
|
11281
|
+
(!this.lazyLoadRows &&
|
|
11282
|
+
this.rowsLength > this.rowsPerPage) ? (index.h(fPaginatorUtils.FPaginator, { id: top ? 'top-paginator' : 'bottom-paginator', currentPage: this.currentPage, max: this.rowsLength, perPage: this.currentRowsPerPage
|
|
11049
11283
|
? this.currentRowsPerPage
|
|
11050
11284
|
: this.rowsPerPage, onLoadMore: this.showLoadMore
|
|
11051
11285
|
? () => {
|
|
@@ -11158,12 +11392,14 @@ const KupDataTable = class {
|
|
|
11158
11392
|
value = kupManager.KupLanguageDensity.WIDE;
|
|
11159
11393
|
break;
|
|
11160
11394
|
}
|
|
11161
|
-
|
|
11162
|
-
|
|
11163
|
-
|
|
11164
|
-
|
|
11165
|
-
|
|
11166
|
-
|
|
11395
|
+
if (value) {
|
|
11396
|
+
listItems[i] = {
|
|
11397
|
+
icon: icons[i],
|
|
11398
|
+
id: codes[i],
|
|
11399
|
+
selected: selectedCode == codes[i],
|
|
11400
|
+
value: this.kupManager.language.translate(value),
|
|
11401
|
+
};
|
|
11402
|
+
}
|
|
11167
11403
|
}
|
|
11168
11404
|
return listItems;
|
|
11169
11405
|
}
|
|
@@ -11194,14 +11430,18 @@ const KupDataTable = class {
|
|
|
11194
11430
|
}
|
|
11195
11431
|
return (index.h("div", { class: "customize-element fontsize-panel" }, index.h("kup-combobox", { isSelect: true, data: data, initialValue: this.kupManager.language.translate(text), "onkup-combobox-itemclick": (e) => {
|
|
11196
11432
|
e.stopPropagation();
|
|
11197
|
-
this.fontsize = this.getFontSizeCodeFromDecode(e.detail.
|
|
11433
|
+
this.fontsize = this.getFontSizeCodeFromDecode(e.detail.node.id);
|
|
11198
11434
|
} })));
|
|
11199
11435
|
}
|
|
11200
11436
|
getDensityCodeFromDecode(decode) {
|
|
11201
|
-
return this.transcodeItem(decode, this.DENSITY_DECODES,
|
|
11437
|
+
return this.transcodeItem(decode, this.DENSITY_DECODES, [
|
|
11438
|
+
'dense',
|
|
11439
|
+
'medium',
|
|
11440
|
+
'wide',
|
|
11441
|
+
]);
|
|
11202
11442
|
}
|
|
11203
11443
|
renderDensityPanel() {
|
|
11204
|
-
const listItems = this.createListData(
|
|
11444
|
+
const listItems = this.createListData(['dense', 'medium', 'wide'], this.DENSITY_ICONS, this.density);
|
|
11205
11445
|
const listData = { data: listItems, showIcons: true };
|
|
11206
11446
|
const textfieldData = {
|
|
11207
11447
|
trailingIcon: true,
|
|
@@ -11224,7 +11464,7 @@ const KupDataTable = class {
|
|
|
11224
11464
|
}
|
|
11225
11465
|
return (index.h("div", { class: "customize-element density-panel" }, index.h("kup-combobox", { isSelect: true, initialValue: this.kupManager.language.translate(text), selectMode: ItemsDisplayMode.DESCRIPTION, data: data, "onkup-combobox-itemclick": (e) => {
|
|
11226
11466
|
e.stopPropagation();
|
|
11227
|
-
this.density = this.getDensityCodeFromDecode(e.detail.
|
|
11467
|
+
this.density = this.getDensityCodeFromDecode(e.detail.node.id);
|
|
11228
11468
|
} })));
|
|
11229
11469
|
}
|
|
11230
11470
|
getGridCodeFromDecode(decode) {
|
|
@@ -13390,17 +13630,23 @@ class imageCanvas {
|
|
|
13390
13630
|
return newStartX;
|
|
13391
13631
|
}
|
|
13392
13632
|
drawArc(x, radius, color) {
|
|
13393
|
-
|
|
13633
|
+
if (color) {
|
|
13634
|
+
this.ctx.fillStyle = color.toString();
|
|
13635
|
+
}
|
|
13394
13636
|
this.ctx.beginPath();
|
|
13395
13637
|
this.ctx.arc(x, radius, radius, 0, 2 * Math.PI, true);
|
|
13396
13638
|
this.ctx.fill();
|
|
13397
13639
|
}
|
|
13398
13640
|
drawRect(x, y, width, height, color) {
|
|
13399
|
-
|
|
13641
|
+
if (color) {
|
|
13642
|
+
this.ctx.fillStyle = color.toString();
|
|
13643
|
+
}
|
|
13400
13644
|
this.ctx.fillRect(x, y, width, height);
|
|
13401
13645
|
}
|
|
13402
13646
|
drawTri(x1, y1, x2, y2, color) {
|
|
13403
|
-
|
|
13647
|
+
if (color) {
|
|
13648
|
+
this.ctx.fillStyle = color.toString();
|
|
13649
|
+
}
|
|
13404
13650
|
this.ctx.beginPath();
|
|
13405
13651
|
this.ctx.moveTo(x1, y1);
|
|
13406
13652
|
this.ctx.lineTo(x2, y2);
|
|
@@ -13812,9 +14058,6 @@ const KupList = class {
|
|
|
13812
14058
|
}
|
|
13813
14059
|
}
|
|
13814
14060
|
/*-------------------------------------------------*/
|
|
13815
|
-
/* W a t c h e r s */
|
|
13816
|
-
/*-------------------------------------------------*/
|
|
13817
|
-
/*-------------------------------------------------*/
|
|
13818
14061
|
/* P u b l i c M e t h o d s */
|
|
13819
14062
|
/*-------------------------------------------------*/
|
|
13820
14063
|
/**
|
|
@@ -13871,6 +14114,19 @@ const KupList = class {
|
|
|
13871
14114
|
async getProps(descriptions) {
|
|
13872
14115
|
return kupManager.getProps(this, KupListProps, descriptions);
|
|
13873
14116
|
}
|
|
14117
|
+
/**
|
|
14118
|
+
* Returns the selected node.
|
|
14119
|
+
* @returns {Promise<KupListNode>} Selected node.
|
|
14120
|
+
*/
|
|
14121
|
+
async getSelectedNode() {
|
|
14122
|
+
const nodes = [];
|
|
14123
|
+
this.data.forEach((node) => {
|
|
14124
|
+
if (this.selected.includes(node.id)) {
|
|
14125
|
+
nodes.push(node);
|
|
14126
|
+
}
|
|
14127
|
+
});
|
|
14128
|
+
return nodes;
|
|
14129
|
+
}
|
|
13874
14130
|
/**
|
|
13875
14131
|
* This method is used to trigger a new render of the component.
|
|
13876
14132
|
*/
|
|
@@ -15132,7 +15388,7 @@ const KupTabBar = class {
|
|
|
15132
15388
|
this.data[i].active = false;
|
|
15133
15389
|
}
|
|
15134
15390
|
this.data[i].active = true;
|
|
15135
|
-
this.value =
|
|
15391
|
+
this.value = node.id;
|
|
15136
15392
|
this.kupClick.emit({
|
|
15137
15393
|
comp: this,
|
|
15138
15394
|
id: this.rootElement.id,
|
|
@@ -15173,6 +15429,20 @@ const KupTabBar = class {
|
|
|
15173
15429
|
async getProps(descriptions) {
|
|
15174
15430
|
return kupManager.getProps(this, KupTabBarProps, descriptions);
|
|
15175
15431
|
}
|
|
15432
|
+
/**
|
|
15433
|
+
* Returns the selected node.
|
|
15434
|
+
* @returns {Promise<KupTabBarNode>} Selected node.
|
|
15435
|
+
*/
|
|
15436
|
+
async getSelectedNode() {
|
|
15437
|
+
let res = null;
|
|
15438
|
+
this.data.forEach((node) => {
|
|
15439
|
+
console.log(this.value, node);
|
|
15440
|
+
if (node.id === this.value) {
|
|
15441
|
+
res = node;
|
|
15442
|
+
}
|
|
15443
|
+
});
|
|
15444
|
+
return res;
|
|
15445
|
+
}
|
|
15176
15446
|
/**
|
|
15177
15447
|
* This method is used to trigger a new render of the component.
|
|
15178
15448
|
*/
|
|
@@ -15202,16 +15472,17 @@ const KupTabBar = class {
|
|
|
15202
15472
|
}
|
|
15203
15473
|
if (activeTabs > 1) {
|
|
15204
15474
|
this.data[lastActiveOccurrence].active = true;
|
|
15205
|
-
this.value = this.data[lastActiveOccurrence].
|
|
15475
|
+
this.value = this.data[lastActiveOccurrence].id;
|
|
15206
15476
|
this.kupManager.debug.logMessage(this, 'Too many active tabs, forcing last one.', kupManager.KupDebugCategory.WARNING);
|
|
15207
15477
|
}
|
|
15208
15478
|
else if (activeTabs === 0) {
|
|
15209
15479
|
this.data[0].active = true;
|
|
15210
|
-
this.value = this.data[0].
|
|
15480
|
+
this.value = this.data[0].id;
|
|
15211
15481
|
this.kupManager.debug.logMessage(this, 'No active tabs detected, forcing first one.');
|
|
15212
15482
|
}
|
|
15213
15483
|
else {
|
|
15214
15484
|
this.data[lastActiveOccurrence].active = true;
|
|
15485
|
+
this.value = this.data[lastActiveOccurrence].id;
|
|
15215
15486
|
}
|
|
15216
15487
|
}
|
|
15217
15488
|
}
|
|
@@ -16290,8 +16561,12 @@ const KupTree = class {
|
|
|
16290
16561
|
*/
|
|
16291
16562
|
this.openedTotalMenu = null;
|
|
16292
16563
|
this.columnMenuAnchor = null;
|
|
16293
|
-
this.selectedNodeString = '';
|
|
16294
16564
|
this.stateSwitcher = false;
|
|
16565
|
+
/**
|
|
16566
|
+
* An array of integers containing the path to a selected child.\
|
|
16567
|
+
* Groups up the properties SelFirst, SelItem, SelName.
|
|
16568
|
+
*/
|
|
16569
|
+
this.selectedNode = [];
|
|
16295
16570
|
/*-------------------------------------------------*/
|
|
16296
16571
|
/* P r o p s */
|
|
16297
16572
|
/*-------------------------------------------------*/
|
|
@@ -16300,10 +16575,6 @@ const KupTree = class {
|
|
|
16300
16575
|
* @default false
|
|
16301
16576
|
*/
|
|
16302
16577
|
this.asAccordion = false;
|
|
16303
|
-
/**
|
|
16304
|
-
* Auto select programmatic selectic node
|
|
16305
|
-
*/
|
|
16306
|
-
this.autoSelectionNodeMode = true;
|
|
16307
16578
|
/**
|
|
16308
16579
|
* Custom style of the component.
|
|
16309
16580
|
* @default ""
|
|
@@ -16383,11 +16654,6 @@ const KupTree = class {
|
|
|
16383
16654
|
* Activates the scroll on hover function.
|
|
16384
16655
|
*/
|
|
16385
16656
|
this.scrollOnHover = false;
|
|
16386
|
-
/**
|
|
16387
|
-
* An array of integers containing the path to a selected child.\
|
|
16388
|
-
* Groups up the properties SelFirst, SelItem, SelName.
|
|
16389
|
-
*/
|
|
16390
|
-
this.selectedNode = [];
|
|
16391
16657
|
/**
|
|
16392
16658
|
* Shows the tree data as a table.
|
|
16393
16659
|
*/
|
|
@@ -16432,6 +16698,7 @@ const KupTree = class {
|
|
|
16432
16698
|
* Reference to the column menu card.
|
|
16433
16699
|
*/
|
|
16434
16700
|
this.columnMenuCard = null;
|
|
16701
|
+
this.selectedColumn = '';
|
|
16435
16702
|
this.clickTimeout = [];
|
|
16436
16703
|
this.sizedColumns = undefined;
|
|
16437
16704
|
this.filtersColumnMenuInstance = new fPaginatorUtils.FiltersColumnMenu();
|
|
@@ -16497,6 +16764,31 @@ const KupTree = class {
|
|
|
16497
16764
|
}
|
|
16498
16765
|
}
|
|
16499
16766
|
}
|
|
16767
|
+
/**
|
|
16768
|
+
* This method will get the selected nodes of the component.
|
|
16769
|
+
*/
|
|
16770
|
+
async getSelectedNode() {
|
|
16771
|
+
return this.selectedNode;
|
|
16772
|
+
}
|
|
16773
|
+
/**
|
|
16774
|
+
* This method will set the selected rows of the component.
|
|
16775
|
+
* @param {string|number[]} rowsIdentifiers - Array of ids (dataset) or indexes (rendered rows).
|
|
16776
|
+
* @param {boolean} emitEvent - The event will always be emitted unless emitEvent is set to false.
|
|
16777
|
+
*/
|
|
16778
|
+
async setSelectedNode(treeNodePath, emitEvent) {
|
|
16779
|
+
this.selectedNode = treeNodePath
|
|
16780
|
+
.split(',')
|
|
16781
|
+
.map((treeNodeIndex) => parseInt(treeNodeIndex));
|
|
16782
|
+
if (emitEvent !== false) {
|
|
16783
|
+
this.kupTreeNodeSelected.emit({
|
|
16784
|
+
comp: this,
|
|
16785
|
+
id: this.rootElement.id,
|
|
16786
|
+
treeNodePath: this.selectedNode,
|
|
16787
|
+
treeNode: this.getTreeNode(this.selectedNode),
|
|
16788
|
+
columnName: this.selectedColumn,
|
|
16789
|
+
});
|
|
16790
|
+
}
|
|
16791
|
+
}
|
|
16500
16792
|
/*-------------------------------------------------*/
|
|
16501
16793
|
/* W a t c h e r s */
|
|
16502
16794
|
/*-------------------------------------------------*/
|
|
@@ -16513,11 +16805,6 @@ const KupTree = class {
|
|
|
16513
16805
|
this.refreshStructureState();
|
|
16514
16806
|
}
|
|
16515
16807
|
}
|
|
16516
|
-
selectedNodeToStr(newData) {
|
|
16517
|
-
if (Array.isArray(newData)) {
|
|
16518
|
-
this.selectedNodeString = newData.toString();
|
|
16519
|
-
}
|
|
16520
|
-
}
|
|
16521
16808
|
/*-------------------------------------------------*/
|
|
16522
16809
|
/* P u b l i c M e t h o d s */
|
|
16523
16810
|
/*-------------------------------------------------*/
|
|
@@ -16789,7 +17076,7 @@ const KupTree = class {
|
|
|
16789
17076
|
this.launchNodeEvent(treeNodePath, tn);
|
|
16790
17077
|
}
|
|
16791
17078
|
else {
|
|
16792
|
-
this.hdlTreeNodeClick(null, tn, this.
|
|
17079
|
+
this.hdlTreeNodeClick(null, tn, this.selectedNodeToString(this.selectedNode));
|
|
16793
17080
|
}
|
|
16794
17081
|
}
|
|
16795
17082
|
}
|
|
@@ -16911,34 +17198,25 @@ const KupTree = class {
|
|
|
16911
17198
|
return path;
|
|
16912
17199
|
}
|
|
16913
17200
|
// When a TreeNode can be selected
|
|
16914
|
-
hdlTreeNodeClick(e, treeNodeData, treeNodePath
|
|
17201
|
+
hdlTreeNodeClick(e, treeNodeData, treeNodePath) {
|
|
16915
17202
|
if (this.expansionMode.toLowerCase() ===
|
|
16916
17203
|
fPaginatorUtils.KupTreeExpansionMode.DROPDOWN ||
|
|
16917
17204
|
(this.expansionMode.toLowerCase() === fPaginatorUtils.KupTreeExpansionMode.NODE &&
|
|
16918
17205
|
!treeNodeData.expandable)) {
|
|
16919
|
-
const td = e
|
|
16920
|
-
? this.getEventPath(e.target).find((el) => {
|
|
16921
|
-
if (el.tagName === 'TD')
|
|
16922
|
-
return el;
|
|
16923
|
-
})
|
|
16924
|
-
: null;
|
|
16925
17206
|
// If this TreeNode is not disabled, then it can be selected and an event is emitted
|
|
16926
17207
|
if (treeNodeData && !treeNodeData.disabled) {
|
|
16927
|
-
|
|
16928
|
-
|
|
16929
|
-
|
|
16930
|
-
.map((treeNodeIndex) => parseInt(treeNodeIndex));
|
|
17208
|
+
this.selectedNode = treeNodePath
|
|
17209
|
+
.split(',')
|
|
17210
|
+
.map((treeNodeIndex) => parseInt(treeNodeIndex));
|
|
16931
17211
|
this.kupTreeNodeSelected.emit({
|
|
16932
17212
|
comp: this,
|
|
16933
17213
|
id: this.rootElement.id,
|
|
16934
|
-
treeNodePath:
|
|
16935
|
-
.split(',')
|
|
16936
|
-
.map((treeNodeIndex) => parseInt(treeNodeIndex)),
|
|
17214
|
+
treeNodePath: this.selectedNode,
|
|
16937
17215
|
treeNode: treeNodeData,
|
|
16938
|
-
columnName:
|
|
16939
|
-
auto: auto,
|
|
17216
|
+
columnName: this.selectedColumn,
|
|
16940
17217
|
});
|
|
16941
17218
|
}
|
|
17219
|
+
this.selectedColumn = '';
|
|
16942
17220
|
}
|
|
16943
17221
|
// If KupTreeExpansionMode.NODE then click is a collapse/expand click
|
|
16944
17222
|
if (this.expansionMode.toLowerCase() === fPaginatorUtils.KupTreeExpansionMode.NODE) {
|
|
@@ -17033,9 +17311,9 @@ const KupTree = class {
|
|
|
17033
17311
|
hasTotals() {
|
|
17034
17312
|
return this.totals && Object.keys(this.totals).length > 0;
|
|
17035
17313
|
}
|
|
17036
|
-
handleChildren(
|
|
17037
|
-
for (let index = 0; index <
|
|
17038
|
-
let node =
|
|
17314
|
+
handleChildren(treeNode, expand) {
|
|
17315
|
+
for (let index = 0; index < treeNode.children.length; index++) {
|
|
17316
|
+
let node = treeNode.children[index];
|
|
17039
17317
|
if (!node.disabled) {
|
|
17040
17318
|
node.isExpanded = expand;
|
|
17041
17319
|
if (node.children) {
|
|
@@ -17053,7 +17331,7 @@ const KupTree = class {
|
|
|
17053
17331
|
if (nodePath && nodePath.length) {
|
|
17054
17332
|
strToRet = nodePath[0].toString();
|
|
17055
17333
|
for (let i = 1; i < nodePath.length; i++) {
|
|
17056
|
-
strToRet += `,${nodePath[
|
|
17334
|
+
strToRet += `,${nodePath[i]}`;
|
|
17057
17335
|
}
|
|
17058
17336
|
}
|
|
17059
17337
|
return strToRet;
|
|
@@ -17061,6 +17339,21 @@ const KupTree = class {
|
|
|
17061
17339
|
getFilterValueForTooltip(column) {
|
|
17062
17340
|
return this.filtersColumnMenuInstance.getFilterValueForTooltip(this.filters, column);
|
|
17063
17341
|
}
|
|
17342
|
+
getTreeNode(nodePath) {
|
|
17343
|
+
if (!nodePath || nodePath.length == 0) {
|
|
17344
|
+
return null;
|
|
17345
|
+
}
|
|
17346
|
+
let father = this.data;
|
|
17347
|
+
let node = null;
|
|
17348
|
+
for (let index = 0; index < nodePath.length; index++) {
|
|
17349
|
+
if (node) {
|
|
17350
|
+
father = node.children;
|
|
17351
|
+
}
|
|
17352
|
+
const nodeIndex = nodePath[index];
|
|
17353
|
+
node = father[nodeIndex];
|
|
17354
|
+
}
|
|
17355
|
+
return node;
|
|
17356
|
+
}
|
|
17064
17357
|
onRemoveFilter(column) {
|
|
17065
17358
|
const newFilters = Object.assign({}, this.filters);
|
|
17066
17359
|
this.filtersColumnMenuInstance.removeFilter(newFilters, column.name);
|
|
@@ -17110,6 +17403,7 @@ const KupTree = class {
|
|
|
17110
17403
|
this.data.forEach((rootNode) => {
|
|
17111
17404
|
this.expandCollapseAllNodes(rootNode, this.expanded && !this.useDynamicExpansion);
|
|
17112
17405
|
});
|
|
17406
|
+
this.selectedNode = [];
|
|
17113
17407
|
}
|
|
17114
17408
|
}
|
|
17115
17409
|
createIconElement(CSSClass, icon, iconColor) {
|
|
@@ -17273,20 +17567,13 @@ const KupTree = class {
|
|
|
17273
17567
|
}
|
|
17274
17568
|
// When can be expanded OR selected
|
|
17275
17569
|
if (!treeNodeData.disabled) {
|
|
17276
|
-
treeNodeOptions['onClick'] = (
|
|
17277
|
-
|
|
17278
|
-
// otherwise inside setTimeout will be exiting the Shadow DOM scope(causing loss of information, including target).
|
|
17279
|
-
const clone = {};
|
|
17280
|
-
for (const key in e) {
|
|
17281
|
-
clone[key] = e[key];
|
|
17282
|
-
}
|
|
17283
|
-
this.clickTimeout.push(setTimeout(() => this.hdlTreeNodeClick(clone, treeNodeData, treeNodePath, false), 300));
|
|
17570
|
+
treeNodeOptions['onClick'] = () => {
|
|
17571
|
+
this.clickTimeout.push(setTimeout((e) => this.hdlTreeNodeClick(e, treeNodeData, treeNodePath), 300));
|
|
17284
17572
|
};
|
|
17285
17573
|
}
|
|
17286
17574
|
// When a tree node is displayed as a table
|
|
17287
17575
|
let treeNodeCells = null;
|
|
17288
17576
|
let visibleCols = this.getVisibleColumns();
|
|
17289
|
-
!this.kupManager.objects.isEmptyKupObj(treeNodeData.obj);
|
|
17290
17577
|
if (this.showColumns && visibleCols && visibleCols.length) {
|
|
17291
17578
|
treeNodeCells = [];
|
|
17292
17579
|
// Renders all the cells
|
|
@@ -17355,7 +17642,8 @@ const KupTree = class {
|
|
|
17355
17642
|
'kup-tree__node--disabled': treeNodeData.disabled,
|
|
17356
17643
|
'kup-tree__node--first': treeNodeDepth ? false : true,
|
|
17357
17644
|
'kup-tree__node--selected': !treeNodeData.disabled &&
|
|
17358
|
-
treeNodePath ===
|
|
17645
|
+
treeNodePath ===
|
|
17646
|
+
this.selectedNodeToString(this.selectedNode),
|
|
17359
17647
|
}, "data-row": treeNodeData, "data-tree-path": treeNodePath }, treeNodeOptions), treeNodeCell, treeNodeCells));
|
|
17360
17648
|
}
|
|
17361
17649
|
closeTotalMenu() {
|
|
@@ -17588,25 +17876,8 @@ const KupTree = class {
|
|
|
17588
17876
|
this.kupManager.theme.register(this);
|
|
17589
17877
|
this.columnMenuInstance = new KupColumnMenu();
|
|
17590
17878
|
this.refreshStructureState();
|
|
17591
|
-
// Initializes the selectedNodeString
|
|
17592
|
-
if (Array.isArray(this.selectedNode)) {
|
|
17593
|
-
this.selectedNodeString = this.selectedNode.toString();
|
|
17594
|
-
}
|
|
17595
17879
|
}
|
|
17596
17880
|
componentDidLoad() {
|
|
17597
|
-
if (this.selectedNode &&
|
|
17598
|
-
this.selectedNode.length > 0 &&
|
|
17599
|
-
this.selectedNode[0] >= 0) {
|
|
17600
|
-
let path = this.selectedNode;
|
|
17601
|
-
let tn = this.data[path[0]];
|
|
17602
|
-
if (path.length > 1) {
|
|
17603
|
-
path = path.slice(1);
|
|
17604
|
-
this.launchNodeEvent(path, tn);
|
|
17605
|
-
}
|
|
17606
|
-
else {
|
|
17607
|
-
this.hdlTreeNodeClick(null, tn, this.selectedNodeString, true);
|
|
17608
|
-
}
|
|
17609
|
-
}
|
|
17610
17881
|
this.didLoadInteractables();
|
|
17611
17882
|
this.kupDidLoad.emit({ comp: this, id: this.rootElement.id });
|
|
17612
17883
|
this.kupManager.resize.observe(this.rootElement);
|
|
@@ -17711,8 +17982,7 @@ const KupTree = class {
|
|
|
17711
17982
|
get rootElement() { return index.getElement(this); }
|
|
17712
17983
|
static get watchers() { return {
|
|
17713
17984
|
"data": ["enrichDataWhenChanged"],
|
|
17714
|
-
"expanded": ["enrichStructureStateWhenChanged"]
|
|
17715
|
-
"selectedNode": ["selectedNodeToStr"]
|
|
17985
|
+
"expanded": ["enrichStructureStateWhenChanged"]
|
|
17716
17986
|
}; }
|
|
17717
17987
|
};
|
|
17718
17988
|
KupTree.style = kupTreeCss;
|