@sme.up/ketchup 5.2.0-SNAPSHOT → 5.2.1-SNAPSHOT

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.
Files changed (131) hide show
  1. package/dist/cjs/{cell-utils-5b16c180.js → cell-utils-d96b2993.js} +2 -2
  2. package/dist/cjs/{f-button-3b9f32af.js → f-button-2b9b99b1.js} +2 -2
  3. package/dist/cjs/{f-cell-c6ad973a.js → f-cell-8351cb84.js} +8 -96
  4. package/dist/cjs/{f-chip-bed86c4a.js → f-chip-df59e1b0.js} +3 -3
  5. package/dist/cjs/{f-image-08a3d340.js → f-image-12bab3b5.js} +2 -2
  6. package/dist/cjs/f-text-field-e7c35b5b.js +94 -0
  7. package/dist/cjs/f-text-field-mdc-a67f5dfe.js +2852 -0
  8. package/dist/cjs/{index-8d7bb3be.js → index-eb556444.js} +2 -0
  9. package/dist/cjs/ketchup.cjs.js +3 -3
  10. package/dist/cjs/kup-accordion.cjs.entry.js +4 -4
  11. package/dist/cjs/kup-autocomplete_27.cjs.entry.js +365 -3041
  12. package/dist/cjs/kup-calendar.cjs.entry.js +7 -7
  13. package/dist/cjs/kup-cell.cjs.entry.js +8 -7
  14. package/dist/cjs/kup-dash-list.cjs.entry.js +4 -4
  15. package/dist/cjs/kup-dash_2.cjs.entry.js +3 -3
  16. package/dist/cjs/kup-drawer.cjs.entry.js +3 -3
  17. package/dist/cjs/kup-echart.cjs.entry.js +4 -4
  18. package/dist/cjs/kup-field.cjs.entry.js +2 -2
  19. package/dist/cjs/kup-iframe.cjs.entry.js +3 -3
  20. package/dist/cjs/kup-lazy.cjs.entry.js +3 -3
  21. package/dist/cjs/kup-magic-box.cjs.entry.js +4 -4
  22. package/dist/cjs/{kup-manager-4227f0a2.js → kup-manager-5c03da64.js} +373 -160
  23. package/dist/cjs/kup-nav-bar.cjs.entry.js +3 -3
  24. package/dist/cjs/kup-numeric-picker.cjs.entry.js +423 -0
  25. package/dist/cjs/kup-photo-frame.cjs.entry.js +3 -3
  26. package/dist/cjs/kup-probe.cjs.entry.js +2 -2
  27. package/dist/cjs/kup-qlik.cjs.entry.js +2 -2
  28. package/dist/cjs/kup-snackbar.cjs.entry.js +5 -5
  29. package/dist/cjs/loader.cjs.js +3 -3
  30. package/dist/cjs/{utils-b9df398c.js → utils-e99921c1.js} +1 -1
  31. package/dist/collection/assets/index.js +8 -0
  32. package/dist/collection/assets/kuptooltip.js +608 -0
  33. package/dist/collection/collection-manifest.json +2 -1
  34. package/dist/collection/components/kup-card/built-in/kup-card-built-in.js +10 -0
  35. package/dist/collection/components/kup-card/built-in/kup-card-numeric.js +153 -0
  36. package/dist/collection/components/kup-card/kup-card.css +35 -0
  37. package/dist/collection/components/kup-card/kup-card.js +1 -0
  38. package/dist/collection/components/kup-data-table/kup-data-table.js +34 -5
  39. package/dist/collection/components/kup-date-picker/kup-date-picker.js +1 -1
  40. package/dist/collection/components/kup-numeric-picker/kup-numeric-picker-declarations.js +16 -0
  41. package/dist/collection/components/kup-numeric-picker/kup-numeric-picker.css +50 -0
  42. package/dist/collection/components/kup-numeric-picker/kup-numeric-picker.js +895 -0
  43. package/dist/collection/managers/kup-debug/kup-debug.js +1 -0
  44. package/dist/collection/managers/kup-manager/kup-manager.js +12 -1
  45. package/dist/collection/managers/kup-math/kup-math.js +11 -1
  46. package/dist/collection/managers/kup-theme/kup-theme-declarations.js +1 -0
  47. package/dist/collection/managers/kup-tooltip/kup-tooltip-declarations.js +1 -0
  48. package/dist/collection/managers/kup-tooltip/kup-tooltip.js +191 -0
  49. package/dist/collection/types/GenericTypes.js +1 -0
  50. package/dist/collection/utils/kup-column-menu/kup-column-menu.js +1 -1
  51. package/dist/esm/{cell-utils-69f75e2e.js → cell-utils-f4bdbbc8.js} +2 -2
  52. package/dist/esm/{f-button-7e7607d8.js → f-button-54a49fd8.js} +2 -2
  53. package/dist/esm/{f-cell-e4d83c27.js → f-cell-d5dac50b.js} +8 -95
  54. package/dist/esm/{f-chip-51dfefaf.js → f-chip-a3035b4b.js} +3 -3
  55. package/dist/esm/{f-image-de331954.js → f-image-d32465e3.js} +2 -2
  56. package/dist/esm/f-text-field-c25cc63f.js +92 -0
  57. package/dist/esm/f-text-field-mdc-9fbbefc3.js +2850 -0
  58. package/dist/esm/{index-aeec9835.js → index-baeab1ac.js} +2 -1
  59. package/dist/esm/ketchup.js +3 -3
  60. package/dist/esm/kup-accordion.entry.js +4 -4
  61. package/dist/esm/kup-autocomplete_27.entry.js +349 -3025
  62. package/dist/esm/kup-calendar.entry.js +7 -7
  63. package/dist/esm/kup-cell.entry.js +8 -7
  64. package/dist/esm/kup-dash-list.entry.js +4 -4
  65. package/dist/esm/kup-dash_2.entry.js +3 -3
  66. package/dist/esm/kup-drawer.entry.js +3 -3
  67. package/dist/esm/kup-echart.entry.js +4 -4
  68. package/dist/esm/kup-field.entry.js +2 -2
  69. package/dist/esm/kup-iframe.entry.js +3 -3
  70. package/dist/esm/kup-lazy.entry.js +3 -3
  71. package/dist/esm/kup-magic-box.entry.js +4 -4
  72. package/dist/esm/{kup-manager-0ab94726.js → kup-manager-9316a184.js} +373 -160
  73. package/dist/esm/kup-nav-bar.entry.js +3 -3
  74. package/dist/esm/kup-numeric-picker.entry.js +419 -0
  75. package/dist/esm/kup-photo-frame.entry.js +3 -3
  76. package/dist/esm/kup-probe.entry.js +2 -2
  77. package/dist/esm/kup-qlik.entry.js +2 -2
  78. package/dist/esm/kup-snackbar.entry.js +5 -5
  79. package/dist/esm/loader.js +3 -3
  80. package/dist/esm/{utils-35c7a90d.js → utils-f24319a0.js} +1 -1
  81. package/dist/ketchup/ketchup.esm.js +1 -1
  82. package/dist/ketchup/{p-3813281b.entry.js → p-09d708c4.entry.js} +1 -1
  83. package/dist/ketchup/{p-4081f5f7.entry.js → p-11e72a8c.entry.js} +1 -1
  84. package/dist/ketchup/p-12773ca8.js +9 -0
  85. package/dist/ketchup/{p-0751aaf6.entry.js → p-203d6295.entry.js} +1 -1
  86. package/dist/ketchup/{p-33073f4a.js → p-34748c91.js} +1 -1
  87. package/dist/ketchup/{p-8be1337b.js → p-34b74425.js} +1 -1
  88. package/dist/ketchup/{p-10c8d755.js → p-40f97429.js} +1 -1
  89. package/dist/ketchup/{p-3aab1f0d.entry.js → p-4173422f.entry.js} +1 -1
  90. package/dist/ketchup/{p-8f735633.entry.js → p-41741c28.entry.js} +1 -1
  91. package/dist/ketchup/{p-b5e1dbfa.entry.js → p-44192f30.entry.js} +1 -1
  92. package/dist/ketchup/{p-c314b1e6.js → p-44f8da2a.js} +1 -1
  93. package/dist/ketchup/p-4f56932b.js +1 -0
  94. package/dist/ketchup/p-669bde31.js +1 -0
  95. package/dist/ketchup/p-67842f1e.entry.js +1 -0
  96. package/dist/ketchup/{p-5d190cf5.js → p-7a74ad17.js} +1 -1
  97. package/dist/ketchup/{p-96101f09.entry.js → p-7ba8fa4a.entry.js} +1 -1
  98. package/dist/ketchup/p-7de0d7e1.js +1 -0
  99. package/dist/ketchup/{p-f9c41e20.entry.js → p-8418e8fa.entry.js} +1 -1
  100. package/dist/ketchup/p-96bf19aa.entry.js +1 -0
  101. package/dist/ketchup/{p-9bcda66f.entry.js → p-9a61d8dc.entry.js} +1 -1
  102. package/dist/ketchup/p-b0ddcce9.entry.js +9 -0
  103. package/dist/ketchup/{p-24df4f29.entry.js → p-b6c21223.entry.js} +1 -1
  104. package/dist/ketchup/{p-68fc1428.entry.js → p-bb8844bf.entry.js} +1 -1
  105. package/dist/ketchup/{p-67c64257.entry.js → p-c58a2a81.entry.js} +1 -1
  106. package/dist/ketchup/{p-3445be1e.entry.js → p-ca3d585b.entry.js} +1 -1
  107. package/dist/ketchup/{p-fea316ab.entry.js → p-e6709c26.entry.js} +1 -1
  108. package/dist/ketchup/{p-d7af8156.entry.js → p-e8e3c9da.entry.js} +1 -1
  109. package/dist/ketchup/p-ecb7069b.js +135 -0
  110. package/dist/types/components/kup-card/built-in/kup-card-built-in.d.ts +7 -0
  111. package/dist/types/components/kup-card/built-in/kup-card-numeric.d.ts +2 -0
  112. package/dist/types/components/kup-card/kup-card-declarations.d.ts +26 -1
  113. package/dist/types/components/kup-data-table/kup-data-table-declarations.d.ts +2 -0
  114. package/dist/types/components/kup-data-table/kup-data-table.d.ts +4 -0
  115. package/dist/types/components/kup-numeric-picker/kup-numeric-picker-declarations.d.ts +19 -0
  116. package/dist/types/components/kup-numeric-picker/kup-numeric-picker.d.ts +121 -0
  117. package/dist/types/components.d.ts +144 -1
  118. package/dist/types/managers/kup-manager/kup-manager-declarations.d.ts +10 -0
  119. package/dist/types/managers/kup-manager/kup-manager.d.ts +2 -0
  120. package/dist/types/managers/kup-math/kup-math-declarations.d.ts +6 -0
  121. package/dist/types/managers/kup-math/kup-math.d.ts +2 -1
  122. package/dist/types/managers/kup-tooltip/kup-tooltip-declarations.d.ts +8 -0
  123. package/dist/types/managers/kup-tooltip/kup-tooltip.d.ts +40 -0
  124. package/dist/types/types/GenericTypes.d.ts +1 -0
  125. package/package.json +3 -3
  126. package/CHANGELOG.md +0 -5
  127. package/dist/ketchup/p-2d4f19f4.js +0 -1
  128. package/dist/ketchup/p-47b57d97.js +0 -1
  129. package/dist/ketchup/p-5186885c.entry.js +0 -1
  130. package/dist/ketchup/p-78223dc0.entry.js +0 -143
  131. package/dist/ketchup/p-ee33cbe9.js +0 -9
@@ -2,2864 +2,20 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- const index = require('./index-8d7bb3be.js');
6
- const kupManager = require('./kup-manager-4227f0a2.js');
7
- const fCell = require('./f-cell-c6ad973a.js');
8
- const tslib_es6 = require('./tslib.es6-0ee02c67.js');
9
- const component = require('./component-d1496215.js');
10
- const utils = require('./utils-b9df398c.js');
11
- const GenericVariables = require('./GenericVariables-a9ed17ee.js');
12
- const fImage = require('./f-image-08a3d340.js');
13
- const cellUtils = require('./cell-utils-5b16c180.js');
14
- const fChip = require('./f-chip-bed86c4a.js');
15
- const fButton = require('./f-button-3b9f32af.js');
16
- const fButtonDeclarations = require('./f-button-declarations-b611587f.js');
17
-
18
- /**
19
- * @license
20
- * Copyright 2016 Google Inc.
21
- *
22
- * Permission is hereby granted, free of charge, to any person obtaining a copy
23
- * of this software and associated documentation files (the "Software"), to deal
24
- * in the Software without restriction, including without limitation the rights
25
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
26
- * copies of the Software, and to permit persons to whom the Software is
27
- * furnished to do so, subject to the following conditions:
28
- *
29
- * The above copyright notice and this permission notice shall be included in
30
- * all copies or substantial portions of the Software.
31
- *
32
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
33
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
34
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
35
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
36
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
37
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
38
- * THE SOFTWARE.
39
- */
40
- var MDCFoundation = /** @class */ (function () {
41
- function MDCFoundation(adapter) {
42
- if (adapter === void 0) { adapter = {}; }
43
- this.adapter = adapter;
44
- }
45
- Object.defineProperty(MDCFoundation, "cssClasses", {
46
- get: function () {
47
- // Classes extending MDCFoundation should implement this method to return an object which exports every
48
- // CSS class the foundation class needs as a property. e.g. {ACTIVE: 'mdc-component--active'}
49
- return {};
50
- },
51
- enumerable: false,
52
- configurable: true
53
- });
54
- Object.defineProperty(MDCFoundation, "strings", {
55
- get: function () {
56
- // Classes extending MDCFoundation should implement this method to return an object which exports all
57
- // semantic strings as constants. e.g. {ARIA_ROLE: 'tablist'}
58
- return {};
59
- },
60
- enumerable: false,
61
- configurable: true
62
- });
63
- Object.defineProperty(MDCFoundation, "numbers", {
64
- get: function () {
65
- // Classes extending MDCFoundation should implement this method to return an object which exports all
66
- // of its semantic numbers as constants. e.g. {ANIMATION_DELAY_MS: 350}
67
- return {};
68
- },
69
- enumerable: false,
70
- configurable: true
71
- });
72
- Object.defineProperty(MDCFoundation, "defaultAdapter", {
73
- get: function () {
74
- // Classes extending MDCFoundation may choose to implement this getter in order to provide a convenient
75
- // way of viewing the necessary methods of an adapter. In the future, this could also be used for adapter
76
- // validation.
77
- return {};
78
- },
79
- enumerable: false,
80
- configurable: true
81
- });
82
- MDCFoundation.prototype.init = function () {
83
- // Subclasses should override this method to perform initialization routines (registering events, etc.)
84
- };
85
- MDCFoundation.prototype.destroy = function () {
86
- // Subclasses should override this method to perform de-initialization routines (de-registering events, etc.)
87
- };
88
- return MDCFoundation;
89
- }());
90
-
91
- /**
92
- * @license
93
- * Copyright 2016 Google Inc.
94
- *
95
- * Permission is hereby granted, free of charge, to any person obtaining a copy
96
- * of this software and associated documentation files (the "Software"), to deal
97
- * in the Software without restriction, including without limitation the rights
98
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
99
- * copies of the Software, and to permit persons to whom the Software is
100
- * furnished to do so, subject to the following conditions:
101
- *
102
- * The above copyright notice and this permission notice shall be included in
103
- * all copies or substantial portions of the Software.
104
- *
105
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
106
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
107
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
108
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
109
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
110
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
111
- * THE SOFTWARE.
112
- */
113
- var MDCComponent = /** @class */ (function () {
114
- function MDCComponent(root, foundation) {
115
- var args = [];
116
- for (var _i = 2; _i < arguments.length; _i++) {
117
- args[_i - 2] = arguments[_i];
118
- }
119
- this.root = root;
120
- this.initialize.apply(this, tslib_es6.__spreadArray([], tslib_es6.__read(args)));
121
- // Note that we initialize foundation here and not within the constructor's
122
- // default param so that this.root is defined and can be used within the
123
- // foundation class.
124
- this.foundation =
125
- foundation === undefined ? this.getDefaultFoundation() : foundation;
126
- this.foundation.init();
127
- this.initialSyncWithDOM();
128
- }
129
- MDCComponent.attachTo = function (root) {
130
- // Subclasses which extend MDCBase should provide an attachTo() method that takes a root element and
131
- // returns an instantiated component with its root set to that element. Also note that in the cases of
132
- // subclasses, an explicit foundation class will not have to be passed in; it will simply be initialized
133
- // from getDefaultFoundation().
134
- return new MDCComponent(root, new MDCFoundation({}));
135
- };
136
- /* istanbul ignore next: method param only exists for typing purposes; it does not need to be unit tested */
137
- MDCComponent.prototype.initialize = function () {
138
- var _args = [];
139
- for (var _i = 0; _i < arguments.length; _i++) {
140
- _args[_i] = arguments[_i];
141
- }
142
- // Subclasses can override this to do any additional setup work that would be considered part of a
143
- // "constructor". Essentially, it is a hook into the parent constructor before the foundation is
144
- // initialized. Any additional arguments besides root and foundation will be passed in here.
145
- };
146
- MDCComponent.prototype.getDefaultFoundation = function () {
147
- // Subclasses must override this method to return a properly configured foundation class for the
148
- // component.
149
- throw new Error('Subclasses must override getDefaultFoundation to return a properly configured ' +
150
- 'foundation class');
151
- };
152
- MDCComponent.prototype.initialSyncWithDOM = function () {
153
- // Subclasses should override this method if they need to perform work to synchronize with a host DOM
154
- // object. An example of this would be a form control wrapper that needs to synchronize its internal state
155
- // to some property or attribute of the host DOM. Please note: this is *not* the place to perform DOM
156
- // reads/writes that would cause layout / paint, as this is called synchronously from within the constructor.
157
- };
158
- MDCComponent.prototype.destroy = function () {
159
- // Subclasses may implement this method to release any resources / deregister any listeners they have
160
- // attached. An example of this might be deregistering a resize event from the window object.
161
- this.foundation.destroy();
162
- };
163
- MDCComponent.prototype.listen = function (evtType, handler, options) {
164
- this.root.addEventListener(evtType, handler, options);
165
- };
166
- MDCComponent.prototype.unlisten = function (evtType, handler, options) {
167
- this.root.removeEventListener(evtType, handler, options);
168
- };
169
- /**
170
- * Fires a cross-browser-compatible custom event from the component root of the given type, with the given data.
171
- */
172
- MDCComponent.prototype.emit = function (evtType, evtData, shouldBubble) {
173
- if (shouldBubble === void 0) { shouldBubble = false; }
174
- var evt;
175
- if (typeof CustomEvent === 'function') {
176
- evt = new CustomEvent(evtType, {
177
- bubbles: shouldBubble,
178
- detail: evtData,
179
- });
180
- }
181
- else {
182
- evt = document.createEvent('CustomEvent');
183
- evt.initCustomEvent(evtType, shouldBubble, false, evtData);
184
- }
185
- this.root.dispatchEvent(evt);
186
- };
187
- return MDCComponent;
188
- }());
189
-
190
- /**
191
- * @license
192
- * Copyright 2019 Google Inc.
193
- *
194
- * Permission is hereby granted, free of charge, to any person obtaining a copy
195
- * of this software and associated documentation files (the "Software"), to deal
196
- * in the Software without restriction, including without limitation the rights
197
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
198
- * copies of the Software, and to permit persons to whom the Software is
199
- * furnished to do so, subject to the following conditions:
200
- *
201
- * The above copyright notice and this permission notice shall be included in
202
- * all copies or substantial portions of the Software.
203
- *
204
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
205
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
206
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
207
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
208
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
209
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
210
- * THE SOFTWARE.
211
- */
212
- /**
213
- * Determine whether the current browser supports passive event listeners, and
214
- * if so, use them.
215
- */
216
- function applyPassive(globalObj) {
217
- if (globalObj === void 0) { globalObj = window; }
218
- return supportsPassiveOption(globalObj) ?
219
- { passive: true } :
220
- false;
221
- }
222
- function supportsPassiveOption(globalObj) {
223
- if (globalObj === void 0) { globalObj = window; }
224
- // See
225
- // https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener
226
- var passiveSupported = false;
227
- try {
228
- var options = {
229
- // This function will be called when the browser
230
- // attempts to access the passive property.
231
- get passive() {
232
- passiveSupported = true;
233
- return false;
234
- }
235
- };
236
- var handler = function () { };
237
- globalObj.document.addEventListener('test', handler, options);
238
- globalObj.document.removeEventListener('test', handler, options);
239
- }
240
- catch (err) {
241
- passiveSupported = false;
242
- }
243
- return passiveSupported;
244
- }
245
-
246
- /**
247
- * @license
248
- * Copyright 2018 Google Inc.
249
- *
250
- * Permission is hereby granted, free of charge, to any person obtaining a copy
251
- * of this software and associated documentation files (the "Software"), to deal
252
- * in the Software without restriction, including without limitation the rights
253
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
254
- * copies of the Software, and to permit persons to whom the Software is
255
- * furnished to do so, subject to the following conditions:
256
- *
257
- * The above copyright notice and this permission notice shall be included in
258
- * all copies or substantial portions of the Software.
259
- *
260
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
261
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
262
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
263
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
264
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
265
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
266
- * THE SOFTWARE.
267
- */
268
- function matches(element, selector) {
269
- var nativeMatches = element.matches
270
- || element.webkitMatchesSelector
271
- || element.msMatchesSelector;
272
- return nativeMatches.call(element, selector);
273
- }
274
- /**
275
- * Used to compute the estimated scroll width of elements. When an element is
276
- * hidden due to display: none; being applied to a parent element, the width is
277
- * returned as 0. However, the element will have a true width once no longer
278
- * inside a display: none context. This method computes an estimated width when
279
- * the element is hidden or returns the true width when the element is visble.
280
- * @param {Element} element the element whose width to estimate
281
- */
282
- function estimateScrollWidth(element) {
283
- // Check the offsetParent. If the element inherits display: none from any
284
- // parent, the offsetParent property will be null (see
285
- // https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/offsetParent).
286
- // This check ensures we only clone the node when necessary.
287
- var htmlEl = element;
288
- if (htmlEl.offsetParent !== null) {
289
- return htmlEl.scrollWidth;
290
- }
291
- var clone = htmlEl.cloneNode(true);
292
- clone.style.setProperty('position', 'absolute');
293
- clone.style.setProperty('transform', 'translate(-9999px, -9999px)');
294
- document.documentElement.appendChild(clone);
295
- var scrollWidth = clone.scrollWidth;
296
- document.documentElement.removeChild(clone);
297
- return scrollWidth;
298
- }
299
-
300
- /**
301
- * @license
302
- * Copyright 2016 Google Inc.
303
- *
304
- * Permission is hereby granted, free of charge, to any person obtaining a copy
305
- * of this software and associated documentation files (the "Software"), to deal
306
- * in the Software without restriction, including without limitation the rights
307
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
308
- * copies of the Software, and to permit persons to whom the Software is
309
- * furnished to do so, subject to the following conditions:
310
- *
311
- * The above copyright notice and this permission notice shall be included in
312
- * all copies or substantial portions of the Software.
313
- *
314
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
315
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
316
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
317
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
318
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
319
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
320
- * THE SOFTWARE.
321
- */
322
- var cssClasses$7 = {
323
- LABEL_FLOAT_ABOVE: 'mdc-floating-label--float-above',
324
- LABEL_REQUIRED: 'mdc-floating-label--required',
325
- LABEL_SHAKE: 'mdc-floating-label--shake',
326
- ROOT: 'mdc-floating-label',
327
- };
328
-
329
- /**
330
- * @license
331
- * Copyright 2016 Google Inc.
332
- *
333
- * Permission is hereby granted, free of charge, to any person obtaining a copy
334
- * of this software and associated documentation files (the "Software"), to deal
335
- * in the Software without restriction, including without limitation the rights
336
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
337
- * copies of the Software, and to permit persons to whom the Software is
338
- * furnished to do so, subject to the following conditions:
339
- *
340
- * The above copyright notice and this permission notice shall be included in
341
- * all copies or substantial portions of the Software.
342
- *
343
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
344
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
345
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
346
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
347
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
348
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
349
- * THE SOFTWARE.
350
- */
351
- var MDCFloatingLabelFoundation = /** @class */ (function (_super) {
352
- tslib_es6.__extends(MDCFloatingLabelFoundation, _super);
353
- function MDCFloatingLabelFoundation(adapter) {
354
- var _this = _super.call(this, tslib_es6.__assign(tslib_es6.__assign({}, MDCFloatingLabelFoundation.defaultAdapter), adapter)) || this;
355
- _this.shakeAnimationEndHandler = function () {
356
- _this.handleShakeAnimationEnd();
357
- };
358
- return _this;
359
- }
360
- Object.defineProperty(MDCFloatingLabelFoundation, "cssClasses", {
361
- get: function () {
362
- return cssClasses$7;
363
- },
364
- enumerable: false,
365
- configurable: true
366
- });
367
- Object.defineProperty(MDCFloatingLabelFoundation, "defaultAdapter", {
368
- /**
369
- * See {@link MDCFloatingLabelAdapter} for typing information on parameters and return types.
370
- */
371
- get: function () {
372
- // tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
373
- return {
374
- addClass: function () { return undefined; },
375
- removeClass: function () { return undefined; },
376
- getWidth: function () { return 0; },
377
- registerInteractionHandler: function () { return undefined; },
378
- deregisterInteractionHandler: function () { return undefined; },
379
- };
380
- // tslint:enable:object-literal-sort-keys
381
- },
382
- enumerable: false,
383
- configurable: true
384
- });
385
- MDCFloatingLabelFoundation.prototype.init = function () {
386
- this.adapter.registerInteractionHandler('animationend', this.shakeAnimationEndHandler);
387
- };
388
- MDCFloatingLabelFoundation.prototype.destroy = function () {
389
- this.adapter.deregisterInteractionHandler('animationend', this.shakeAnimationEndHandler);
390
- };
391
- /**
392
- * Returns the width of the label element.
393
- */
394
- MDCFloatingLabelFoundation.prototype.getWidth = function () {
395
- return this.adapter.getWidth();
396
- };
397
- /**
398
- * Styles the label to produce a shake animation to indicate an error.
399
- * @param shouldShake If true, adds the shake CSS class; otherwise, removes shake class.
400
- */
401
- MDCFloatingLabelFoundation.prototype.shake = function (shouldShake) {
402
- var LABEL_SHAKE = MDCFloatingLabelFoundation.cssClasses.LABEL_SHAKE;
403
- if (shouldShake) {
404
- this.adapter.addClass(LABEL_SHAKE);
405
- }
406
- else {
407
- this.adapter.removeClass(LABEL_SHAKE);
408
- }
409
- };
410
- /**
411
- * Styles the label to float or dock.
412
- * @param shouldFloat If true, adds the float CSS class; otherwise, removes float and shake classes to dock the label.
413
- */
414
- MDCFloatingLabelFoundation.prototype.float = function (shouldFloat) {
415
- var _a = MDCFloatingLabelFoundation.cssClasses, LABEL_FLOAT_ABOVE = _a.LABEL_FLOAT_ABOVE, LABEL_SHAKE = _a.LABEL_SHAKE;
416
- if (shouldFloat) {
417
- this.adapter.addClass(LABEL_FLOAT_ABOVE);
418
- }
419
- else {
420
- this.adapter.removeClass(LABEL_FLOAT_ABOVE);
421
- this.adapter.removeClass(LABEL_SHAKE);
422
- }
423
- };
424
- /**
425
- * Styles the label as required.
426
- * @param isRequired If true, adds an asterisk to the label, indicating that it is required.
427
- */
428
- MDCFloatingLabelFoundation.prototype.setRequired = function (isRequired) {
429
- var LABEL_REQUIRED = MDCFloatingLabelFoundation.cssClasses.LABEL_REQUIRED;
430
- if (isRequired) {
431
- this.adapter.addClass(LABEL_REQUIRED);
432
- }
433
- else {
434
- this.adapter.removeClass(LABEL_REQUIRED);
435
- }
436
- };
437
- MDCFloatingLabelFoundation.prototype.handleShakeAnimationEnd = function () {
438
- var LABEL_SHAKE = MDCFloatingLabelFoundation.cssClasses.LABEL_SHAKE;
439
- this.adapter.removeClass(LABEL_SHAKE);
440
- };
441
- return MDCFloatingLabelFoundation;
442
- }(MDCFoundation));
443
-
444
- /**
445
- * @license
446
- * Copyright 2016 Google Inc.
447
- *
448
- * Permission is hereby granted, free of charge, to any person obtaining a copy
449
- * of this software and associated documentation files (the "Software"), to deal
450
- * in the Software without restriction, including without limitation the rights
451
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
452
- * copies of the Software, and to permit persons to whom the Software is
453
- * furnished to do so, subject to the following conditions:
454
- *
455
- * The above copyright notice and this permission notice shall be included in
456
- * all copies or substantial portions of the Software.
457
- *
458
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
459
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
460
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
461
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
462
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
463
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
464
- * THE SOFTWARE.
465
- */
466
- var MDCFloatingLabel = /** @class */ (function (_super) {
467
- tslib_es6.__extends(MDCFloatingLabel, _super);
468
- function MDCFloatingLabel() {
469
- return _super !== null && _super.apply(this, arguments) || this;
470
- }
471
- MDCFloatingLabel.attachTo = function (root) {
472
- return new MDCFloatingLabel(root);
473
- };
474
- /**
475
- * Styles the label to produce the label shake for errors.
476
- * @param shouldShake If true, shakes the label by adding a CSS class; otherwise, stops shaking by removing the class.
477
- */
478
- MDCFloatingLabel.prototype.shake = function (shouldShake) {
479
- this.foundation.shake(shouldShake);
480
- };
481
- /**
482
- * Styles the label to float/dock.
483
- * @param shouldFloat If true, floats the label by adding a CSS class; otherwise, docks it by removing the class.
484
- */
485
- MDCFloatingLabel.prototype.float = function (shouldFloat) {
486
- this.foundation.float(shouldFloat);
487
- };
488
- /**
489
- * Styles the label as required.
490
- * @param isRequired If true, adds an asterisk to the label, indicating that it is required.
491
- */
492
- MDCFloatingLabel.prototype.setRequired = function (isRequired) {
493
- this.foundation.setRequired(isRequired);
494
- };
495
- MDCFloatingLabel.prototype.getWidth = function () {
496
- return this.foundation.getWidth();
497
- };
498
- MDCFloatingLabel.prototype.getDefaultFoundation = function () {
499
- var _this = this;
500
- // DO NOT INLINE this variable. For backward compatibility, foundations take a Partial<MDCFooAdapter>.
501
- // To ensure we don't accidentally omit any methods, we need a separate, strongly typed adapter variable.
502
- // tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
503
- var adapter = {
504
- addClass: function (className) { return _this.root.classList.add(className); },
505
- removeClass: function (className) { return _this.root.classList.remove(className); },
506
- getWidth: function () { return estimateScrollWidth(_this.root); },
507
- registerInteractionHandler: function (evtType, handler) {
508
- return _this.listen(evtType, handler);
509
- },
510
- deregisterInteractionHandler: function (evtType, handler) {
511
- return _this.unlisten(evtType, handler);
512
- },
513
- };
514
- // tslint:enable:object-literal-sort-keys
515
- return new MDCFloatingLabelFoundation(adapter);
516
- };
517
- return MDCFloatingLabel;
518
- }(MDCComponent));
519
-
520
- /**
521
- * @license
522
- * Copyright 2018 Google Inc.
523
- *
524
- * Permission is hereby granted, free of charge, to any person obtaining a copy
525
- * of this software and associated documentation files (the "Software"), to deal
526
- * in the Software without restriction, including without limitation the rights
527
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
528
- * copies of the Software, and to permit persons to whom the Software is
529
- * furnished to do so, subject to the following conditions:
530
- *
531
- * The above copyright notice and this permission notice shall be included in
532
- * all copies or substantial portions of the Software.
533
- *
534
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
535
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
536
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
537
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
538
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
539
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
540
- * THE SOFTWARE.
541
- */
542
- var cssClasses$6 = {
543
- LINE_RIPPLE_ACTIVE: 'mdc-line-ripple--active',
544
- LINE_RIPPLE_DEACTIVATING: 'mdc-line-ripple--deactivating',
545
- };
546
-
547
- /**
548
- * @license
549
- * Copyright 2018 Google Inc.
550
- *
551
- * Permission is hereby granted, free of charge, to any person obtaining a copy
552
- * of this software and associated documentation files (the "Software"), to deal
553
- * in the Software without restriction, including without limitation the rights
554
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
555
- * copies of the Software, and to permit persons to whom the Software is
556
- * furnished to do so, subject to the following conditions:
557
- *
558
- * The above copyright notice and this permission notice shall be included in
559
- * all copies or substantial portions of the Software.
560
- *
561
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
562
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
563
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
564
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
565
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
566
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
567
- * THE SOFTWARE.
568
- */
569
- var MDCLineRippleFoundation = /** @class */ (function (_super) {
570
- tslib_es6.__extends(MDCLineRippleFoundation, _super);
571
- function MDCLineRippleFoundation(adapter) {
572
- var _this = _super.call(this, tslib_es6.__assign(tslib_es6.__assign({}, MDCLineRippleFoundation.defaultAdapter), adapter)) || this;
573
- _this.transitionEndHandler = function (evt) {
574
- _this.handleTransitionEnd(evt);
575
- };
576
- return _this;
577
- }
578
- Object.defineProperty(MDCLineRippleFoundation, "cssClasses", {
579
- get: function () {
580
- return cssClasses$6;
581
- },
582
- enumerable: false,
583
- configurable: true
584
- });
585
- Object.defineProperty(MDCLineRippleFoundation, "defaultAdapter", {
586
- /**
587
- * See {@link MDCLineRippleAdapter} for typing information on parameters and return types.
588
- */
589
- get: function () {
590
- // tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
591
- return {
592
- addClass: function () { return undefined; },
593
- removeClass: function () { return undefined; },
594
- hasClass: function () { return false; },
595
- setStyle: function () { return undefined; },
596
- registerEventHandler: function () { return undefined; },
597
- deregisterEventHandler: function () { return undefined; },
598
- };
599
- // tslint:enable:object-literal-sort-keys
600
- },
601
- enumerable: false,
602
- configurable: true
603
- });
604
- MDCLineRippleFoundation.prototype.init = function () {
605
- this.adapter.registerEventHandler('transitionend', this.transitionEndHandler);
606
- };
607
- MDCLineRippleFoundation.prototype.destroy = function () {
608
- this.adapter.deregisterEventHandler('transitionend', this.transitionEndHandler);
609
- };
610
- MDCLineRippleFoundation.prototype.activate = function () {
611
- this.adapter.removeClass(cssClasses$6.LINE_RIPPLE_DEACTIVATING);
612
- this.adapter.addClass(cssClasses$6.LINE_RIPPLE_ACTIVE);
613
- };
614
- MDCLineRippleFoundation.prototype.setRippleCenter = function (xCoordinate) {
615
- this.adapter.setStyle('transform-origin', xCoordinate + "px center");
616
- };
617
- MDCLineRippleFoundation.prototype.deactivate = function () {
618
- this.adapter.addClass(cssClasses$6.LINE_RIPPLE_DEACTIVATING);
619
- };
620
- MDCLineRippleFoundation.prototype.handleTransitionEnd = function (evt) {
621
- // Wait for the line ripple to be either transparent or opaque
622
- // before emitting the animation end event
623
- var isDeactivating = this.adapter.hasClass(cssClasses$6.LINE_RIPPLE_DEACTIVATING);
624
- if (evt.propertyName === 'opacity') {
625
- if (isDeactivating) {
626
- this.adapter.removeClass(cssClasses$6.LINE_RIPPLE_ACTIVE);
627
- this.adapter.removeClass(cssClasses$6.LINE_RIPPLE_DEACTIVATING);
628
- }
629
- }
630
- };
631
- return MDCLineRippleFoundation;
632
- }(MDCFoundation));
633
-
634
- /**
635
- * @license
636
- * Copyright 2018 Google Inc.
637
- *
638
- * Permission is hereby granted, free of charge, to any person obtaining a copy
639
- * of this software and associated documentation files (the "Software"), to deal
640
- * in the Software without restriction, including without limitation the rights
641
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
642
- * copies of the Software, and to permit persons to whom the Software is
643
- * furnished to do so, subject to the following conditions:
644
- *
645
- * The above copyright notice and this permission notice shall be included in
646
- * all copies or substantial portions of the Software.
647
- *
648
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
649
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
650
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
651
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
652
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
653
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
654
- * THE SOFTWARE.
655
- */
656
- var MDCLineRipple = /** @class */ (function (_super) {
657
- tslib_es6.__extends(MDCLineRipple, _super);
658
- function MDCLineRipple() {
659
- return _super !== null && _super.apply(this, arguments) || this;
660
- }
661
- MDCLineRipple.attachTo = function (root) {
662
- return new MDCLineRipple(root);
663
- };
664
- /**
665
- * Activates the line ripple
666
- */
667
- MDCLineRipple.prototype.activate = function () {
668
- this.foundation.activate();
669
- };
670
- /**
671
- * Deactivates the line ripple
672
- */
673
- MDCLineRipple.prototype.deactivate = function () {
674
- this.foundation.deactivate();
675
- };
676
- /**
677
- * Sets the transform origin given a user's click location.
678
- * The `rippleCenter` is the x-coordinate of the middle of the ripple.
679
- */
680
- MDCLineRipple.prototype.setRippleCenter = function (xCoordinate) {
681
- this.foundation.setRippleCenter(xCoordinate);
682
- };
683
- MDCLineRipple.prototype.getDefaultFoundation = function () {
684
- var _this = this;
685
- // DO NOT INLINE this variable. For backward compatibility, foundations take a Partial<MDCFooAdapter>.
686
- // To ensure we don't accidentally omit any methods, we need a separate, strongly typed adapter variable.
687
- // tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
688
- var adapter = {
689
- addClass: function (className) { return _this.root.classList.add(className); },
690
- removeClass: function (className) { return _this.root.classList.remove(className); },
691
- hasClass: function (className) { return _this.root.classList.contains(className); },
692
- setStyle: function (propertyName, value) { return _this.root.style.setProperty(propertyName, value); },
693
- registerEventHandler: function (evtType, handler) { return _this.listen(evtType, handler); },
694
- deregisterEventHandler: function (evtType, handler) { return _this.unlisten(evtType, handler); },
695
- };
696
- // tslint:enable:object-literal-sort-keys
697
- return new MDCLineRippleFoundation(adapter);
698
- };
699
- return MDCLineRipple;
700
- }(MDCComponent));
701
-
702
- /**
703
- * @license
704
- * Copyright 2018 Google Inc.
705
- *
706
- * Permission is hereby granted, free of charge, to any person obtaining a copy
707
- * of this software and associated documentation files (the "Software"), to deal
708
- * in the Software without restriction, including without limitation the rights
709
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
710
- * copies of the Software, and to permit persons to whom the Software is
711
- * furnished to do so, subject to the following conditions:
712
- *
713
- * The above copyright notice and this permission notice shall be included in
714
- * all copies or substantial portions of the Software.
715
- *
716
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
717
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
718
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
719
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
720
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
721
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
722
- * THE SOFTWARE.
723
- */
724
- var strings$5 = {
725
- NOTCH_ELEMENT_SELECTOR: '.mdc-notched-outline__notch',
726
- };
727
- var numbers$1 = {
728
- // This should stay in sync with $mdc-notched-outline-padding * 2.
729
- NOTCH_ELEMENT_PADDING: 8,
730
- };
731
- var cssClasses$5 = {
732
- NO_LABEL: 'mdc-notched-outline--no-label',
733
- OUTLINE_NOTCHED: 'mdc-notched-outline--notched',
734
- OUTLINE_UPGRADED: 'mdc-notched-outline--upgraded',
735
- };
736
-
737
- /**
738
- * @license
739
- * Copyright 2017 Google Inc.
740
- *
741
- * Permission is hereby granted, free of charge, to any person obtaining a copy
742
- * of this software and associated documentation files (the "Software"), to deal
743
- * in the Software without restriction, including without limitation the rights
744
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
745
- * copies of the Software, and to permit persons to whom the Software is
746
- * furnished to do so, subject to the following conditions:
747
- *
748
- * The above copyright notice and this permission notice shall be included in
749
- * all copies or substantial portions of the Software.
750
- *
751
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
752
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
753
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
754
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
755
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
756
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
757
- * THE SOFTWARE.
758
- */
759
- var MDCNotchedOutlineFoundation = /** @class */ (function (_super) {
760
- tslib_es6.__extends(MDCNotchedOutlineFoundation, _super);
761
- function MDCNotchedOutlineFoundation(adapter) {
762
- return _super.call(this, tslib_es6.__assign(tslib_es6.__assign({}, MDCNotchedOutlineFoundation.defaultAdapter), adapter)) || this;
763
- }
764
- Object.defineProperty(MDCNotchedOutlineFoundation, "strings", {
765
- get: function () {
766
- return strings$5;
767
- },
768
- enumerable: false,
769
- configurable: true
770
- });
771
- Object.defineProperty(MDCNotchedOutlineFoundation, "cssClasses", {
772
- get: function () {
773
- return cssClasses$5;
774
- },
775
- enumerable: false,
776
- configurable: true
777
- });
778
- Object.defineProperty(MDCNotchedOutlineFoundation, "numbers", {
779
- get: function () {
780
- return numbers$1;
781
- },
782
- enumerable: false,
783
- configurable: true
784
- });
785
- Object.defineProperty(MDCNotchedOutlineFoundation, "defaultAdapter", {
786
- /**
787
- * See {@link MDCNotchedOutlineAdapter} for typing information on parameters and return types.
788
- */
789
- get: function () {
790
- // tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
791
- return {
792
- addClass: function () { return undefined; },
793
- removeClass: function () { return undefined; },
794
- setNotchWidthProperty: function () { return undefined; },
795
- removeNotchWidthProperty: function () { return undefined; },
796
- };
797
- // tslint:enable:object-literal-sort-keys
798
- },
799
- enumerable: false,
800
- configurable: true
801
- });
802
- /**
803
- * Adds the outline notched selector and updates the notch width calculated based off of notchWidth.
804
- */
805
- MDCNotchedOutlineFoundation.prototype.notch = function (notchWidth) {
806
- var OUTLINE_NOTCHED = MDCNotchedOutlineFoundation.cssClasses.OUTLINE_NOTCHED;
807
- if (notchWidth > 0) {
808
- notchWidth += numbers$1.NOTCH_ELEMENT_PADDING; // Add padding from left/right.
809
- }
810
- this.adapter.setNotchWidthProperty(notchWidth);
811
- this.adapter.addClass(OUTLINE_NOTCHED);
812
- };
813
- /**
814
- * Removes notched outline selector to close the notch in the outline.
815
- */
816
- MDCNotchedOutlineFoundation.prototype.closeNotch = function () {
817
- var OUTLINE_NOTCHED = MDCNotchedOutlineFoundation.cssClasses.OUTLINE_NOTCHED;
818
- this.adapter.removeClass(OUTLINE_NOTCHED);
819
- this.adapter.removeNotchWidthProperty();
820
- };
821
- return MDCNotchedOutlineFoundation;
822
- }(MDCFoundation));
823
-
824
- /**
825
- * @license
826
- * Copyright 2017 Google Inc.
827
- *
828
- * Permission is hereby granted, free of charge, to any person obtaining a copy
829
- * of this software and associated documentation files (the "Software"), to deal
830
- * in the Software without restriction, including without limitation the rights
831
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
832
- * copies of the Software, and to permit persons to whom the Software is
833
- * furnished to do so, subject to the following conditions:
834
- *
835
- * The above copyright notice and this permission notice shall be included in
836
- * all copies or substantial portions of the Software.
837
- *
838
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
839
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
840
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
841
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
842
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
843
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
844
- * THE SOFTWARE.
845
- */
846
- var MDCNotchedOutline = /** @class */ (function (_super) {
847
- tslib_es6.__extends(MDCNotchedOutline, _super);
848
- function MDCNotchedOutline() {
849
- return _super !== null && _super.apply(this, arguments) || this;
850
- }
851
- MDCNotchedOutline.attachTo = function (root) {
852
- return new MDCNotchedOutline(root);
853
- };
854
- MDCNotchedOutline.prototype.initialSyncWithDOM = function () {
855
- this.notchElement =
856
- this.root.querySelector(strings$5.NOTCH_ELEMENT_SELECTOR);
857
- var label = this.root.querySelector('.' + MDCFloatingLabelFoundation.cssClasses.ROOT);
858
- if (label) {
859
- label.style.transitionDuration = '0s';
860
- this.root.classList.add(cssClasses$5.OUTLINE_UPGRADED);
861
- requestAnimationFrame(function () {
862
- label.style.transitionDuration = '';
863
- });
864
- }
865
- else {
866
- this.root.classList.add(cssClasses$5.NO_LABEL);
867
- }
868
- };
869
- /**
870
- * Updates classes and styles to open the notch to the specified width.
871
- * @param notchWidth The notch width in the outline.
872
- */
873
- MDCNotchedOutline.prototype.notch = function (notchWidth) {
874
- this.foundation.notch(notchWidth);
875
- };
876
- /**
877
- * Updates classes and styles to close the notch.
878
- */
879
- MDCNotchedOutline.prototype.closeNotch = function () {
880
- this.foundation.closeNotch();
881
- };
882
- MDCNotchedOutline.prototype.getDefaultFoundation = function () {
883
- var _this = this;
884
- // DO NOT INLINE this variable. For backward compatibility, foundations take a Partial<MDCFooAdapter>.
885
- // To ensure we don't accidentally omit any methods, we need a separate, strongly typed adapter variable.
886
- // tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
887
- var adapter = {
888
- addClass: function (className) { return _this.root.classList.add(className); },
889
- removeClass: function (className) { return _this.root.classList.remove(className); },
890
- setNotchWidthProperty: function (width) {
891
- _this.notchElement.style.setProperty('width', width + 'px');
892
- },
893
- removeNotchWidthProperty: function () {
894
- _this.notchElement.style.removeProperty('width');
895
- },
896
- };
897
- // tslint:enable:object-literal-sort-keys
898
- return new MDCNotchedOutlineFoundation(adapter);
899
- };
900
- return MDCNotchedOutline;
901
- }(MDCComponent));
902
-
903
- /**
904
- * @license
905
- * Copyright 2019 Google Inc.
906
- *
907
- * Permission is hereby granted, free of charge, to any person obtaining a copy
908
- * of this software and associated documentation files (the "Software"), to deal
909
- * in the Software without restriction, including without limitation the rights
910
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
911
- * copies of the Software, and to permit persons to whom the Software is
912
- * furnished to do so, subject to the following conditions:
913
- *
914
- * The above copyright notice and this permission notice shall be included in
915
- * all copies or substantial portions of the Software.
916
- *
917
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
918
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
919
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
920
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
921
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
922
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
923
- * THE SOFTWARE.
924
- */
925
- var cssClasses$4 = {
926
- ROOT: 'mdc-text-field-character-counter',
927
- };
928
- var strings$4 = {
929
- ROOT_SELECTOR: "." + cssClasses$4.ROOT,
930
- };
931
-
932
- /**
933
- * @license
934
- * Copyright 2019 Google Inc.
935
- *
936
- * Permission is hereby granted, free of charge, to any person obtaining a copy
937
- * of this software and associated documentation files (the "Software"), to deal
938
- * in the Software without restriction, including without limitation the rights
939
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
940
- * copies of the Software, and to permit persons to whom the Software is
941
- * furnished to do so, subject to the following conditions:
942
- *
943
- * The above copyright notice and this permission notice shall be included in
944
- * all copies or substantial portions of the Software.
945
- *
946
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
947
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
948
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
949
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
950
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
951
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
952
- * THE SOFTWARE.
953
- */
954
- var MDCTextFieldCharacterCounterFoundation = /** @class */ (function (_super) {
955
- tslib_es6.__extends(MDCTextFieldCharacterCounterFoundation, _super);
956
- function MDCTextFieldCharacterCounterFoundation(adapter) {
957
- return _super.call(this, tslib_es6.__assign(tslib_es6.__assign({}, MDCTextFieldCharacterCounterFoundation.defaultAdapter), adapter)) || this;
958
- }
959
- Object.defineProperty(MDCTextFieldCharacterCounterFoundation, "cssClasses", {
960
- get: function () {
961
- return cssClasses$4;
962
- },
963
- enumerable: false,
964
- configurable: true
965
- });
966
- Object.defineProperty(MDCTextFieldCharacterCounterFoundation, "strings", {
967
- get: function () {
968
- return strings$4;
969
- },
970
- enumerable: false,
971
- configurable: true
972
- });
973
- Object.defineProperty(MDCTextFieldCharacterCounterFoundation, "defaultAdapter", {
974
- /**
975
- * See {@link MDCTextFieldCharacterCounterAdapter} for typing information on parameters and return types.
976
- */
977
- get: function () {
978
- return {
979
- setContent: function () { return undefined; },
980
- };
981
- },
982
- enumerable: false,
983
- configurable: true
984
- });
985
- MDCTextFieldCharacterCounterFoundation.prototype.setCounterValue = function (currentLength, maxLength) {
986
- currentLength = Math.min(currentLength, maxLength);
987
- this.adapter.setContent(currentLength + " / " + maxLength);
988
- };
989
- return MDCTextFieldCharacterCounterFoundation;
990
- }(MDCFoundation));
991
-
992
- /**
993
- * @license
994
- * Copyright 2019 Google Inc.
995
- *
996
- * Permission is hereby granted, free of charge, to any person obtaining a copy
997
- * of this software and associated documentation files (the "Software"), to deal
998
- * in the Software without restriction, including without limitation the rights
999
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
1000
- * copies of the Software, and to permit persons to whom the Software is
1001
- * furnished to do so, subject to the following conditions:
1002
- *
1003
- * The above copyright notice and this permission notice shall be included in
1004
- * all copies or substantial portions of the Software.
1005
- *
1006
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
1007
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
1008
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
1009
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
1010
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
1011
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
1012
- * THE SOFTWARE.
1013
- */
1014
- var MDCTextFieldCharacterCounter = /** @class */ (function (_super) {
1015
- tslib_es6.__extends(MDCTextFieldCharacterCounter, _super);
1016
- function MDCTextFieldCharacterCounter() {
1017
- return _super !== null && _super.apply(this, arguments) || this;
1018
- }
1019
- MDCTextFieldCharacterCounter.attachTo = function (root) {
1020
- return new MDCTextFieldCharacterCounter(root);
1021
- };
1022
- Object.defineProperty(MDCTextFieldCharacterCounter.prototype, "foundationForTextField", {
1023
- // Provided for access by MDCTextField component
1024
- get: function () {
1025
- return this.foundation;
1026
- },
1027
- enumerable: false,
1028
- configurable: true
1029
- });
1030
- MDCTextFieldCharacterCounter.prototype.getDefaultFoundation = function () {
1031
- var _this = this;
1032
- // DO NOT INLINE this variable. For backward compatibility, foundations take a Partial<MDCFooAdapter>.
1033
- // To ensure we don't accidentally omit any methods, we need a separate, strongly typed adapter variable.
1034
- var adapter = {
1035
- setContent: function (content) {
1036
- _this.root.textContent = content;
1037
- },
1038
- };
1039
- return new MDCTextFieldCharacterCounterFoundation(adapter);
1040
- };
1041
- return MDCTextFieldCharacterCounter;
1042
- }(MDCComponent));
1043
-
1044
- /**
1045
- * @license
1046
- * Copyright 2016 Google Inc.
1047
- *
1048
- * Permission is hereby granted, free of charge, to any person obtaining a copy
1049
- * of this software and associated documentation files (the "Software"), to deal
1050
- * in the Software without restriction, including without limitation the rights
1051
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
1052
- * copies of the Software, and to permit persons to whom the Software is
1053
- * furnished to do so, subject to the following conditions:
1054
- *
1055
- * The above copyright notice and this permission notice shall be included in
1056
- * all copies or substantial portions of the Software.
1057
- *
1058
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
1059
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
1060
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
1061
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
1062
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
1063
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
1064
- * THE SOFTWARE.
1065
- */
1066
- var strings$3 = {
1067
- ARIA_CONTROLS: 'aria-controls',
1068
- ARIA_DESCRIBEDBY: 'aria-describedby',
1069
- INPUT_SELECTOR: '.mdc-text-field__input',
1070
- LABEL_SELECTOR: '.mdc-floating-label',
1071
- LEADING_ICON_SELECTOR: '.mdc-text-field__icon--leading',
1072
- LINE_RIPPLE_SELECTOR: '.mdc-line-ripple',
1073
- OUTLINE_SELECTOR: '.mdc-notched-outline',
1074
- PREFIX_SELECTOR: '.mdc-text-field__affix--prefix',
1075
- SUFFIX_SELECTOR: '.mdc-text-field__affix--suffix',
1076
- TRAILING_ICON_SELECTOR: '.mdc-text-field__icon--trailing'
1077
- };
1078
- var cssClasses$3 = {
1079
- DISABLED: 'mdc-text-field--disabled',
1080
- FOCUSED: 'mdc-text-field--focused',
1081
- HELPER_LINE: 'mdc-text-field-helper-line',
1082
- INVALID: 'mdc-text-field--invalid',
1083
- LABEL_FLOATING: 'mdc-text-field--label-floating',
1084
- NO_LABEL: 'mdc-text-field--no-label',
1085
- OUTLINED: 'mdc-text-field--outlined',
1086
- ROOT: 'mdc-text-field',
1087
- TEXTAREA: 'mdc-text-field--textarea',
1088
- WITH_LEADING_ICON: 'mdc-text-field--with-leading-icon',
1089
- WITH_TRAILING_ICON: 'mdc-text-field--with-trailing-icon',
1090
- WITH_INTERNAL_COUNTER: 'mdc-text-field--with-internal-counter',
1091
- };
1092
- var numbers = {
1093
- LABEL_SCALE: 0.75,
1094
- };
1095
- /**
1096
- * Whitelist based off of
1097
- * https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/HTML5/Constraint_validation
1098
- * under the "Validation-related attributes" section.
1099
- */
1100
- var VALIDATION_ATTR_WHITELIST = [
1101
- 'pattern',
1102
- 'min',
1103
- 'max',
1104
- 'required',
1105
- 'step',
1106
- 'minlength',
1107
- 'maxlength',
1108
- ];
1109
- /**
1110
- * Label should always float for these types as they show some UI even if value
1111
- * is empty.
1112
- */
1113
- var ALWAYS_FLOAT_TYPES = [
1114
- 'color',
1115
- 'date',
1116
- 'datetime-local',
1117
- 'month',
1118
- 'range',
1119
- 'time',
1120
- 'week',
1121
- ];
1122
-
1123
- /**
1124
- * @license
1125
- * Copyright 2016 Google Inc.
1126
- *
1127
- * Permission is hereby granted, free of charge, to any person obtaining a copy
1128
- * of this software and associated documentation files (the "Software"), to deal
1129
- * in the Software without restriction, including without limitation the rights
1130
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
1131
- * copies of the Software, and to permit persons to whom the Software is
1132
- * furnished to do so, subject to the following conditions:
1133
- *
1134
- * The above copyright notice and this permission notice shall be included in
1135
- * all copies or substantial portions of the Software.
1136
- *
1137
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
1138
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
1139
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
1140
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
1141
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
1142
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
1143
- * THE SOFTWARE.
1144
- */
1145
- var POINTERDOWN_EVENTS = ['mousedown', 'touchstart'];
1146
- var INTERACTION_EVENTS$1 = ['click', 'keydown'];
1147
- var MDCTextFieldFoundation = /** @class */ (function (_super) {
1148
- tslib_es6.__extends(MDCTextFieldFoundation, _super);
1149
- /**
1150
- * @param adapter
1151
- * @param foundationMap Map from subcomponent names to their subfoundations.
1152
- */
1153
- function MDCTextFieldFoundation(adapter, foundationMap) {
1154
- if (foundationMap === void 0) { foundationMap = {}; }
1155
- var _this = _super.call(this, tslib_es6.__assign(tslib_es6.__assign({}, MDCTextFieldFoundation.defaultAdapter), adapter)) || this;
1156
- _this.isFocused = false;
1157
- _this.receivedUserInput = false;
1158
- _this.valid = true;
1159
- _this.useNativeValidation = true;
1160
- _this.validateOnValueChange = true;
1161
- _this.helperText = foundationMap.helperText;
1162
- _this.characterCounter = foundationMap.characterCounter;
1163
- _this.leadingIcon = foundationMap.leadingIcon;
1164
- _this.trailingIcon = foundationMap.trailingIcon;
1165
- _this.inputFocusHandler = function () {
1166
- _this.activateFocus();
1167
- };
1168
- _this.inputBlurHandler = function () {
1169
- _this.deactivateFocus();
1170
- };
1171
- _this.inputInputHandler = function () {
1172
- _this.handleInput();
1173
- };
1174
- _this.setPointerXOffset = function (evt) {
1175
- _this.setTransformOrigin(evt);
1176
- };
1177
- _this.textFieldInteractionHandler = function () {
1178
- _this.handleTextFieldInteraction();
1179
- };
1180
- _this.validationAttributeChangeHandler = function (attributesList) {
1181
- _this.handleValidationAttributeChange(attributesList);
1182
- };
1183
- return _this;
1184
- }
1185
- Object.defineProperty(MDCTextFieldFoundation, "cssClasses", {
1186
- get: function () {
1187
- return cssClasses$3;
1188
- },
1189
- enumerable: false,
1190
- configurable: true
1191
- });
1192
- Object.defineProperty(MDCTextFieldFoundation, "strings", {
1193
- get: function () {
1194
- return strings$3;
1195
- },
1196
- enumerable: false,
1197
- configurable: true
1198
- });
1199
- Object.defineProperty(MDCTextFieldFoundation, "numbers", {
1200
- get: function () {
1201
- return numbers;
1202
- },
1203
- enumerable: false,
1204
- configurable: true
1205
- });
1206
- Object.defineProperty(MDCTextFieldFoundation.prototype, "shouldAlwaysFloat", {
1207
- get: function () {
1208
- var type = this.getNativeInput().type;
1209
- return ALWAYS_FLOAT_TYPES.indexOf(type) >= 0;
1210
- },
1211
- enumerable: false,
1212
- configurable: true
1213
- });
1214
- Object.defineProperty(MDCTextFieldFoundation.prototype, "shouldFloat", {
1215
- get: function () {
1216
- return this.shouldAlwaysFloat || this.isFocused || !!this.getValue() ||
1217
- this.isBadInput();
1218
- },
1219
- enumerable: false,
1220
- configurable: true
1221
- });
1222
- Object.defineProperty(MDCTextFieldFoundation.prototype, "shouldShake", {
1223
- get: function () {
1224
- return !this.isFocused && !this.isValid() && !!this.getValue();
1225
- },
1226
- enumerable: false,
1227
- configurable: true
1228
- });
1229
- Object.defineProperty(MDCTextFieldFoundation, "defaultAdapter", {
1230
- /**
1231
- * See {@link MDCTextFieldAdapter} for typing information on parameters and
1232
- * return types.
1233
- */
1234
- get: function () {
1235
- // tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
1236
- return {
1237
- addClass: function () { return undefined; },
1238
- removeClass: function () { return undefined; },
1239
- hasClass: function () { return true; },
1240
- setInputAttr: function () { return undefined; },
1241
- removeInputAttr: function () { return undefined; },
1242
- registerTextFieldInteractionHandler: function () { return undefined; },
1243
- deregisterTextFieldInteractionHandler: function () { return undefined; },
1244
- registerInputInteractionHandler: function () { return undefined; },
1245
- deregisterInputInteractionHandler: function () { return undefined; },
1246
- registerValidationAttributeChangeHandler: function () {
1247
- return new MutationObserver(function () { return undefined; });
1248
- },
1249
- deregisterValidationAttributeChangeHandler: function () { return undefined; },
1250
- getNativeInput: function () { return null; },
1251
- isFocused: function () { return false; },
1252
- activateLineRipple: function () { return undefined; },
1253
- deactivateLineRipple: function () { return undefined; },
1254
- setLineRippleTransformOrigin: function () { return undefined; },
1255
- shakeLabel: function () { return undefined; },
1256
- floatLabel: function () { return undefined; },
1257
- setLabelRequired: function () { return undefined; },
1258
- hasLabel: function () { return false; },
1259
- getLabelWidth: function () { return 0; },
1260
- hasOutline: function () { return false; },
1261
- notchOutline: function () { return undefined; },
1262
- closeOutline: function () { return undefined; },
1263
- };
1264
- // tslint:enable:object-literal-sort-keys
1265
- },
1266
- enumerable: false,
1267
- configurable: true
1268
- });
1269
- MDCTextFieldFoundation.prototype.init = function () {
1270
- var e_1, _a, e_2, _b;
1271
- if (this.adapter.hasLabel() && this.getNativeInput().required) {
1272
- this.adapter.setLabelRequired(true);
1273
- }
1274
- if (this.adapter.isFocused()) {
1275
- this.inputFocusHandler();
1276
- }
1277
- else if (this.adapter.hasLabel() && this.shouldFloat) {
1278
- this.notchOutline(true);
1279
- this.adapter.floatLabel(true);
1280
- this.styleFloating(true);
1281
- }
1282
- this.adapter.registerInputInteractionHandler('focus', this.inputFocusHandler);
1283
- this.adapter.registerInputInteractionHandler('blur', this.inputBlurHandler);
1284
- this.adapter.registerInputInteractionHandler('input', this.inputInputHandler);
1285
- try {
1286
- for (var POINTERDOWN_EVENTS_1 = tslib_es6.__values(POINTERDOWN_EVENTS), POINTERDOWN_EVENTS_1_1 = POINTERDOWN_EVENTS_1.next(); !POINTERDOWN_EVENTS_1_1.done; POINTERDOWN_EVENTS_1_1 = POINTERDOWN_EVENTS_1.next()) {
1287
- var evtType = POINTERDOWN_EVENTS_1_1.value;
1288
- this.adapter.registerInputInteractionHandler(evtType, this.setPointerXOffset);
1289
- }
1290
- }
1291
- catch (e_1_1) { e_1 = { error: e_1_1 }; }
1292
- finally {
1293
- try {
1294
- if (POINTERDOWN_EVENTS_1_1 && !POINTERDOWN_EVENTS_1_1.done && (_a = POINTERDOWN_EVENTS_1.return)) _a.call(POINTERDOWN_EVENTS_1);
1295
- }
1296
- finally { if (e_1) throw e_1.error; }
1297
- }
1298
- try {
1299
- for (var INTERACTION_EVENTS_1 = tslib_es6.__values(INTERACTION_EVENTS$1), INTERACTION_EVENTS_1_1 = INTERACTION_EVENTS_1.next(); !INTERACTION_EVENTS_1_1.done; INTERACTION_EVENTS_1_1 = INTERACTION_EVENTS_1.next()) {
1300
- var evtType = INTERACTION_EVENTS_1_1.value;
1301
- this.adapter.registerTextFieldInteractionHandler(evtType, this.textFieldInteractionHandler);
1302
- }
1303
- }
1304
- catch (e_2_1) { e_2 = { error: e_2_1 }; }
1305
- finally {
1306
- try {
1307
- if (INTERACTION_EVENTS_1_1 && !INTERACTION_EVENTS_1_1.done && (_b = INTERACTION_EVENTS_1.return)) _b.call(INTERACTION_EVENTS_1);
1308
- }
1309
- finally { if (e_2) throw e_2.error; }
1310
- }
1311
- this.validationObserver =
1312
- this.adapter.registerValidationAttributeChangeHandler(this.validationAttributeChangeHandler);
1313
- this.setcharacterCounter(this.getValue().length);
1314
- };
1315
- MDCTextFieldFoundation.prototype.destroy = function () {
1316
- var e_3, _a, e_4, _b;
1317
- this.adapter.deregisterInputInteractionHandler('focus', this.inputFocusHandler);
1318
- this.adapter.deregisterInputInteractionHandler('blur', this.inputBlurHandler);
1319
- this.adapter.deregisterInputInteractionHandler('input', this.inputInputHandler);
1320
- try {
1321
- for (var POINTERDOWN_EVENTS_2 = tslib_es6.__values(POINTERDOWN_EVENTS), POINTERDOWN_EVENTS_2_1 = POINTERDOWN_EVENTS_2.next(); !POINTERDOWN_EVENTS_2_1.done; POINTERDOWN_EVENTS_2_1 = POINTERDOWN_EVENTS_2.next()) {
1322
- var evtType = POINTERDOWN_EVENTS_2_1.value;
1323
- this.adapter.deregisterInputInteractionHandler(evtType, this.setPointerXOffset);
1324
- }
1325
- }
1326
- catch (e_3_1) { e_3 = { error: e_3_1 }; }
1327
- finally {
1328
- try {
1329
- if (POINTERDOWN_EVENTS_2_1 && !POINTERDOWN_EVENTS_2_1.done && (_a = POINTERDOWN_EVENTS_2.return)) _a.call(POINTERDOWN_EVENTS_2);
1330
- }
1331
- finally { if (e_3) throw e_3.error; }
1332
- }
1333
- try {
1334
- for (var INTERACTION_EVENTS_2 = tslib_es6.__values(INTERACTION_EVENTS$1), INTERACTION_EVENTS_2_1 = INTERACTION_EVENTS_2.next(); !INTERACTION_EVENTS_2_1.done; INTERACTION_EVENTS_2_1 = INTERACTION_EVENTS_2.next()) {
1335
- var evtType = INTERACTION_EVENTS_2_1.value;
1336
- this.adapter.deregisterTextFieldInteractionHandler(evtType, this.textFieldInteractionHandler);
1337
- }
1338
- }
1339
- catch (e_4_1) { e_4 = { error: e_4_1 }; }
1340
- finally {
1341
- try {
1342
- if (INTERACTION_EVENTS_2_1 && !INTERACTION_EVENTS_2_1.done && (_b = INTERACTION_EVENTS_2.return)) _b.call(INTERACTION_EVENTS_2);
1343
- }
1344
- finally { if (e_4) throw e_4.error; }
1345
- }
1346
- this.adapter.deregisterValidationAttributeChangeHandler(this.validationObserver);
1347
- };
1348
- /**
1349
- * Handles user interactions with the Text Field.
1350
- */
1351
- MDCTextFieldFoundation.prototype.handleTextFieldInteraction = function () {
1352
- var nativeInput = this.adapter.getNativeInput();
1353
- if (nativeInput && nativeInput.disabled) {
1354
- return;
1355
- }
1356
- this.receivedUserInput = true;
1357
- };
1358
- /**
1359
- * Handles validation attribute changes
1360
- */
1361
- MDCTextFieldFoundation.prototype.handleValidationAttributeChange = function (attributesList) {
1362
- var _this = this;
1363
- attributesList.some(function (attributeName) {
1364
- if (VALIDATION_ATTR_WHITELIST.indexOf(attributeName) > -1) {
1365
- _this.styleValidity(true);
1366
- _this.adapter.setLabelRequired(_this.getNativeInput().required);
1367
- return true;
1368
- }
1369
- return false;
1370
- });
1371
- if (attributesList.indexOf('maxlength') > -1) {
1372
- this.setcharacterCounter(this.getValue().length);
1373
- }
1374
- };
1375
- /**
1376
- * Opens/closes the notched outline.
1377
- */
1378
- MDCTextFieldFoundation.prototype.notchOutline = function (openNotch) {
1379
- if (!this.adapter.hasOutline() || !this.adapter.hasLabel()) {
1380
- return;
1381
- }
1382
- if (openNotch) {
1383
- var labelWidth = this.adapter.getLabelWidth() * numbers.LABEL_SCALE;
1384
- this.adapter.notchOutline(labelWidth);
1385
- }
1386
- else {
1387
- this.adapter.closeOutline();
1388
- }
1389
- };
1390
- /**
1391
- * Activates the text field focus state.
1392
- */
1393
- MDCTextFieldFoundation.prototype.activateFocus = function () {
1394
- this.isFocused = true;
1395
- this.styleFocused(this.isFocused);
1396
- this.adapter.activateLineRipple();
1397
- if (this.adapter.hasLabel()) {
1398
- this.notchOutline(this.shouldFloat);
1399
- this.adapter.floatLabel(this.shouldFloat);
1400
- this.styleFloating(this.shouldFloat);
1401
- this.adapter.shakeLabel(this.shouldShake);
1402
- }
1403
- if (this.helperText &&
1404
- (this.helperText.isPersistent() || !this.helperText.isValidation() ||
1405
- !this.valid)) {
1406
- this.helperText.showToScreenReader();
1407
- }
1408
- };
1409
- /**
1410
- * Sets the line ripple's transform origin, so that the line ripple activate
1411
- * animation will animate out from the user's click location.
1412
- */
1413
- MDCTextFieldFoundation.prototype.setTransformOrigin = function (evt) {
1414
- if (this.isDisabled() || this.adapter.hasOutline()) {
1415
- return;
1416
- }
1417
- var touches = evt.touches;
1418
- var targetEvent = touches ? touches[0] : evt;
1419
- var targetClientRect = targetEvent.target.getBoundingClientRect();
1420
- var normalizedX = targetEvent.clientX - targetClientRect.left;
1421
- this.adapter.setLineRippleTransformOrigin(normalizedX);
1422
- };
1423
- /**
1424
- * Handles input change of text input and text area.
1425
- */
1426
- MDCTextFieldFoundation.prototype.handleInput = function () {
1427
- this.autoCompleteFocus();
1428
- this.setcharacterCounter(this.getValue().length);
1429
- };
1430
- /**
1431
- * Activates the Text Field's focus state in cases when the input value
1432
- * changes without user input (e.g. programmatically).
1433
- */
1434
- MDCTextFieldFoundation.prototype.autoCompleteFocus = function () {
1435
- if (!this.receivedUserInput) {
1436
- this.activateFocus();
1437
- }
1438
- };
1439
- /**
1440
- * Deactivates the Text Field's focus state.
1441
- */
1442
- MDCTextFieldFoundation.prototype.deactivateFocus = function () {
1443
- this.isFocused = false;
1444
- this.adapter.deactivateLineRipple();
1445
- var isValid = this.isValid();
1446
- this.styleValidity(isValid);
1447
- this.styleFocused(this.isFocused);
1448
- if (this.adapter.hasLabel()) {
1449
- this.notchOutline(this.shouldFloat);
1450
- this.adapter.floatLabel(this.shouldFloat);
1451
- this.styleFloating(this.shouldFloat);
1452
- this.adapter.shakeLabel(this.shouldShake);
1453
- }
1454
- if (!this.shouldFloat) {
1455
- this.receivedUserInput = false;
1456
- }
1457
- };
1458
- MDCTextFieldFoundation.prototype.getValue = function () {
1459
- return this.getNativeInput().value;
1460
- };
1461
- /**
1462
- * @param value The value to set on the input Element.
1463
- */
1464
- MDCTextFieldFoundation.prototype.setValue = function (value) {
1465
- // Prevent Safari from moving the caret to the end of the input when the
1466
- // value has not changed.
1467
- if (this.getValue() !== value) {
1468
- this.getNativeInput().value = value;
1469
- }
1470
- this.setcharacterCounter(value.length);
1471
- if (this.validateOnValueChange) {
1472
- var isValid = this.isValid();
1473
- this.styleValidity(isValid);
1474
- }
1475
- if (this.adapter.hasLabel()) {
1476
- this.notchOutline(this.shouldFloat);
1477
- this.adapter.floatLabel(this.shouldFloat);
1478
- this.styleFloating(this.shouldFloat);
1479
- if (this.validateOnValueChange) {
1480
- this.adapter.shakeLabel(this.shouldShake);
1481
- }
1482
- }
1483
- };
1484
- /**
1485
- * @return The custom validity state, if set; otherwise, the result of a
1486
- * native validity check.
1487
- */
1488
- MDCTextFieldFoundation.prototype.isValid = function () {
1489
- return this.useNativeValidation ? this.isNativeInputValid() : this.valid;
1490
- };
1491
- /**
1492
- * @param isValid Sets the custom validity state of the Text Field.
1493
- */
1494
- MDCTextFieldFoundation.prototype.setValid = function (isValid) {
1495
- this.valid = isValid;
1496
- this.styleValidity(isValid);
1497
- var shouldShake = !isValid && !this.isFocused && !!this.getValue();
1498
- if (this.adapter.hasLabel()) {
1499
- this.adapter.shakeLabel(shouldShake);
1500
- }
1501
- };
1502
- /**
1503
- * @param shouldValidate Whether or not validity should be updated on
1504
- * value change.
1505
- */
1506
- MDCTextFieldFoundation.prototype.setValidateOnValueChange = function (shouldValidate) {
1507
- this.validateOnValueChange = shouldValidate;
1508
- };
1509
- /**
1510
- * @return Whether or not validity should be updated on value change. `true`
1511
- * by default.
1512
- */
1513
- MDCTextFieldFoundation.prototype.getValidateOnValueChange = function () {
1514
- return this.validateOnValueChange;
1515
- };
1516
- /**
1517
- * Enables or disables the use of native validation. Use this for custom
1518
- * validation.
1519
- * @param useNativeValidation Set this to false to ignore native input
1520
- * validation.
1521
- */
1522
- MDCTextFieldFoundation.prototype.setUseNativeValidation = function (useNativeValidation) {
1523
- this.useNativeValidation = useNativeValidation;
1524
- };
1525
- MDCTextFieldFoundation.prototype.isDisabled = function () {
1526
- return this.getNativeInput().disabled;
1527
- };
1528
- /**
1529
- * @param disabled Sets the text-field disabled or enabled.
1530
- */
1531
- MDCTextFieldFoundation.prototype.setDisabled = function (disabled) {
1532
- this.getNativeInput().disabled = disabled;
1533
- this.styleDisabled(disabled);
1534
- };
1535
- /**
1536
- * @param content Sets the content of the helper text.
1537
- */
1538
- MDCTextFieldFoundation.prototype.setHelperTextContent = function (content) {
1539
- if (this.helperText) {
1540
- this.helperText.setContent(content);
1541
- }
1542
- };
1543
- /**
1544
- * Sets the aria label of the leading icon.
1545
- */
1546
- MDCTextFieldFoundation.prototype.setLeadingIconAriaLabel = function (label) {
1547
- if (this.leadingIcon) {
1548
- this.leadingIcon.setAriaLabel(label);
1549
- }
1550
- };
1551
- /**
1552
- * Sets the text content of the leading icon.
1553
- */
1554
- MDCTextFieldFoundation.prototype.setLeadingIconContent = function (content) {
1555
- if (this.leadingIcon) {
1556
- this.leadingIcon.setContent(content);
1557
- }
1558
- };
1559
- /**
1560
- * Sets the aria label of the trailing icon.
1561
- */
1562
- MDCTextFieldFoundation.prototype.setTrailingIconAriaLabel = function (label) {
1563
- if (this.trailingIcon) {
1564
- this.trailingIcon.setAriaLabel(label);
1565
- }
1566
- };
1567
- /**
1568
- * Sets the text content of the trailing icon.
1569
- */
1570
- MDCTextFieldFoundation.prototype.setTrailingIconContent = function (content) {
1571
- if (this.trailingIcon) {
1572
- this.trailingIcon.setContent(content);
1573
- }
1574
- };
1575
- /**
1576
- * Sets character counter values that shows characters used and the total
1577
- * character limit.
1578
- */
1579
- MDCTextFieldFoundation.prototype.setcharacterCounter = function (currentLength) {
1580
- if (!this.characterCounter) {
1581
- return;
1582
- }
1583
- var maxLength = this.getNativeInput().maxLength;
1584
- if (maxLength === -1) {
1585
- throw new Error('MDCTextFieldFoundation: Expected maxlength html property on text input or textarea.');
1586
- }
1587
- this.characterCounter.setCounterValue(currentLength, maxLength);
1588
- };
1589
- /**
1590
- * @return True if the Text Field input fails in converting the user-supplied
1591
- * value.
1592
- */
1593
- MDCTextFieldFoundation.prototype.isBadInput = function () {
1594
- // The badInput property is not supported in IE 11 💩.
1595
- return this.getNativeInput().validity.badInput || false;
1596
- };
1597
- /**
1598
- * @return The result of native validity checking (ValidityState.valid).
1599
- */
1600
- MDCTextFieldFoundation.prototype.isNativeInputValid = function () {
1601
- return this.getNativeInput().validity.valid;
1602
- };
1603
- /**
1604
- * Styles the component based on the validity state.
1605
- */
1606
- MDCTextFieldFoundation.prototype.styleValidity = function (isValid) {
1607
- var INVALID = MDCTextFieldFoundation.cssClasses.INVALID;
1608
- if (isValid) {
1609
- this.adapter.removeClass(INVALID);
1610
- }
1611
- else {
1612
- this.adapter.addClass(INVALID);
1613
- }
1614
- if (this.helperText) {
1615
- this.helperText.setValidity(isValid);
1616
- // We dynamically set or unset aria-describedby for validation helper text
1617
- // only, based on whether the field is valid
1618
- var helperTextValidation = this.helperText.isValidation();
1619
- if (!helperTextValidation) {
1620
- return;
1621
- }
1622
- var helperTextVisible = this.helperText.isVisible();
1623
- var helperTextId = this.helperText.getId();
1624
- if (helperTextVisible && helperTextId) {
1625
- this.adapter.setInputAttr(strings$3.ARIA_DESCRIBEDBY, helperTextId);
1626
- }
1627
- else {
1628
- this.adapter.removeInputAttr(strings$3.ARIA_DESCRIBEDBY);
1629
- }
1630
- }
1631
- };
1632
- /**
1633
- * Styles the component based on the focused state.
1634
- */
1635
- MDCTextFieldFoundation.prototype.styleFocused = function (isFocused) {
1636
- var FOCUSED = MDCTextFieldFoundation.cssClasses.FOCUSED;
1637
- if (isFocused) {
1638
- this.adapter.addClass(FOCUSED);
1639
- }
1640
- else {
1641
- this.adapter.removeClass(FOCUSED);
1642
- }
1643
- };
1644
- /**
1645
- * Styles the component based on the disabled state.
1646
- */
1647
- MDCTextFieldFoundation.prototype.styleDisabled = function (isDisabled) {
1648
- var _a = MDCTextFieldFoundation.cssClasses, DISABLED = _a.DISABLED, INVALID = _a.INVALID;
1649
- if (isDisabled) {
1650
- this.adapter.addClass(DISABLED);
1651
- this.adapter.removeClass(INVALID);
1652
- }
1653
- else {
1654
- this.adapter.removeClass(DISABLED);
1655
- }
1656
- if (this.leadingIcon) {
1657
- this.leadingIcon.setDisabled(isDisabled);
1658
- }
1659
- if (this.trailingIcon) {
1660
- this.trailingIcon.setDisabled(isDisabled);
1661
- }
1662
- };
1663
- /**
1664
- * Styles the component based on the label floating state.
1665
- */
1666
- MDCTextFieldFoundation.prototype.styleFloating = function (isFloating) {
1667
- var LABEL_FLOATING = MDCTextFieldFoundation.cssClasses.LABEL_FLOATING;
1668
- if (isFloating) {
1669
- this.adapter.addClass(LABEL_FLOATING);
1670
- }
1671
- else {
1672
- this.adapter.removeClass(LABEL_FLOATING);
1673
- }
1674
- };
1675
- /**
1676
- * @return The native text input element from the host environment, or an
1677
- * object with the same shape for unit tests.
1678
- */
1679
- MDCTextFieldFoundation.prototype.getNativeInput = function () {
1680
- // this.adapter may be undefined in foundation unit tests. This happens when
1681
- // testdouble is creating a mock object and invokes the
1682
- // shouldShake/shouldFloat getters (which in turn call getValue(), which
1683
- // calls this method) before init() has been called from the MDCTextField
1684
- // constructor. To work around that issue, we return a dummy object.
1685
- var nativeInput = this.adapter ? this.adapter.getNativeInput() : null;
1686
- return nativeInput || {
1687
- disabled: false,
1688
- maxLength: -1,
1689
- required: false,
1690
- type: 'input',
1691
- validity: {
1692
- badInput: false,
1693
- valid: true,
1694
- },
1695
- value: '',
1696
- };
1697
- };
1698
- return MDCTextFieldFoundation;
1699
- }(MDCFoundation));
1700
-
1701
- /**
1702
- * @license
1703
- * Copyright 2016 Google Inc.
1704
- *
1705
- * Permission is hereby granted, free of charge, to any person obtaining a copy
1706
- * of this software and associated documentation files (the "Software"), to deal
1707
- * in the Software without restriction, including without limitation the rights
1708
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
1709
- * copies of the Software, and to permit persons to whom the Software is
1710
- * furnished to do so, subject to the following conditions:
1711
- *
1712
- * The above copyright notice and this permission notice shall be included in
1713
- * all copies or substantial portions of the Software.
1714
- *
1715
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
1716
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
1717
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
1718
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
1719
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
1720
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
1721
- * THE SOFTWARE.
1722
- */
1723
- var cssClasses$2 = {
1724
- HELPER_TEXT_PERSISTENT: 'mdc-text-field-helper-text--persistent',
1725
- HELPER_TEXT_VALIDATION_MSG: 'mdc-text-field-helper-text--validation-msg',
1726
- ROOT: 'mdc-text-field-helper-text',
1727
- };
1728
- var strings$2 = {
1729
- ARIA_HIDDEN: 'aria-hidden',
1730
- ROLE: 'role',
1731
- ROOT_SELECTOR: "." + cssClasses$2.ROOT,
1732
- };
1733
-
1734
- /**
1735
- * @license
1736
- * Copyright 2017 Google Inc.
1737
- *
1738
- * Permission is hereby granted, free of charge, to any person obtaining a copy
1739
- * of this software and associated documentation files (the "Software"), to deal
1740
- * in the Software without restriction, including without limitation the rights
1741
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
1742
- * copies of the Software, and to permit persons to whom the Software is
1743
- * furnished to do so, subject to the following conditions:
1744
- *
1745
- * The above copyright notice and this permission notice shall be included in
1746
- * all copies or substantial portions of the Software.
1747
- *
1748
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
1749
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
1750
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
1751
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
1752
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
1753
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
1754
- * THE SOFTWARE.
1755
- */
1756
- var MDCTextFieldHelperTextFoundation = /** @class */ (function (_super) {
1757
- tslib_es6.__extends(MDCTextFieldHelperTextFoundation, _super);
1758
- function MDCTextFieldHelperTextFoundation(adapter) {
1759
- return _super.call(this, tslib_es6.__assign(tslib_es6.__assign({}, MDCTextFieldHelperTextFoundation.defaultAdapter), adapter)) || this;
1760
- }
1761
- Object.defineProperty(MDCTextFieldHelperTextFoundation, "cssClasses", {
1762
- get: function () {
1763
- return cssClasses$2;
1764
- },
1765
- enumerable: false,
1766
- configurable: true
1767
- });
1768
- Object.defineProperty(MDCTextFieldHelperTextFoundation, "strings", {
1769
- get: function () {
1770
- return strings$2;
1771
- },
1772
- enumerable: false,
1773
- configurable: true
1774
- });
1775
- Object.defineProperty(MDCTextFieldHelperTextFoundation, "defaultAdapter", {
1776
- /**
1777
- * See {@link MDCTextFieldHelperTextAdapter} for typing information on parameters and return types.
1778
- */
1779
- get: function () {
1780
- // tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
1781
- return {
1782
- addClass: function () { return undefined; },
1783
- removeClass: function () { return undefined; },
1784
- hasClass: function () { return false; },
1785
- getAttr: function () { return null; },
1786
- setAttr: function () { return undefined; },
1787
- removeAttr: function () { return undefined; },
1788
- setContent: function () { return undefined; },
1789
- };
1790
- // tslint:enable:object-literal-sort-keys
1791
- },
1792
- enumerable: false,
1793
- configurable: true
1794
- });
1795
- MDCTextFieldHelperTextFoundation.prototype.getId = function () {
1796
- return this.adapter.getAttr('id');
1797
- };
1798
- MDCTextFieldHelperTextFoundation.prototype.isVisible = function () {
1799
- return this.adapter.getAttr(strings$2.ARIA_HIDDEN) !== 'true';
1800
- };
1801
- /**
1802
- * Sets the content of the helper text field.
1803
- */
1804
- MDCTextFieldHelperTextFoundation.prototype.setContent = function (content) {
1805
- this.adapter.setContent(content);
1806
- };
1807
- MDCTextFieldHelperTextFoundation.prototype.isPersistent = function () {
1808
- return this.adapter.hasClass(cssClasses$2.HELPER_TEXT_PERSISTENT);
1809
- };
1810
- /**
1811
- * @param isPersistent Sets the persistency of the helper text.
1812
- */
1813
- MDCTextFieldHelperTextFoundation.prototype.setPersistent = function (isPersistent) {
1814
- if (isPersistent) {
1815
- this.adapter.addClass(cssClasses$2.HELPER_TEXT_PERSISTENT);
1816
- }
1817
- else {
1818
- this.adapter.removeClass(cssClasses$2.HELPER_TEXT_PERSISTENT);
1819
- }
1820
- };
1821
- /**
1822
- * @return whether the helper text acts as an error validation message.
1823
- */
1824
- MDCTextFieldHelperTextFoundation.prototype.isValidation = function () {
1825
- return this.adapter.hasClass(cssClasses$2.HELPER_TEXT_VALIDATION_MSG);
1826
- };
1827
- /**
1828
- * @param isValidation True to make the helper text act as an error validation message.
1829
- */
1830
- MDCTextFieldHelperTextFoundation.prototype.setValidation = function (isValidation) {
1831
- if (isValidation) {
1832
- this.adapter.addClass(cssClasses$2.HELPER_TEXT_VALIDATION_MSG);
1833
- }
1834
- else {
1835
- this.adapter.removeClass(cssClasses$2.HELPER_TEXT_VALIDATION_MSG);
1836
- }
1837
- };
1838
- /**
1839
- * Makes the helper text visible to the screen reader.
1840
- */
1841
- MDCTextFieldHelperTextFoundation.prototype.showToScreenReader = function () {
1842
- this.adapter.removeAttr(strings$2.ARIA_HIDDEN);
1843
- };
1844
- /**
1845
- * Sets the validity of the helper text based on the input validity.
1846
- */
1847
- MDCTextFieldHelperTextFoundation.prototype.setValidity = function (inputIsValid) {
1848
- var helperTextIsPersistent = this.adapter.hasClass(cssClasses$2.HELPER_TEXT_PERSISTENT);
1849
- var helperTextIsValidationMsg = this.adapter.hasClass(cssClasses$2.HELPER_TEXT_VALIDATION_MSG);
1850
- var validationMsgNeedsDisplay = helperTextIsValidationMsg && !inputIsValid;
1851
- if (validationMsgNeedsDisplay) {
1852
- this.showToScreenReader();
1853
- // If role is already alert, refresh it to trigger another announcement
1854
- // from screenreader.
1855
- if (this.adapter.getAttr(strings$2.ROLE) === 'alert') {
1856
- this.refreshAlertRole();
1857
- }
1858
- else {
1859
- this.adapter.setAttr(strings$2.ROLE, 'alert');
1860
- }
1861
- }
1862
- else {
1863
- this.adapter.removeAttr(strings$2.ROLE);
1864
- }
1865
- if (!helperTextIsPersistent && !validationMsgNeedsDisplay) {
1866
- this.hide();
1867
- }
1868
- };
1869
- /**
1870
- * Hides the help text from screen readers.
1871
- */
1872
- MDCTextFieldHelperTextFoundation.prototype.hide = function () {
1873
- this.adapter.setAttr(strings$2.ARIA_HIDDEN, 'true');
1874
- };
1875
- MDCTextFieldHelperTextFoundation.prototype.refreshAlertRole = function () {
1876
- var _this = this;
1877
- this.adapter.removeAttr(strings$2.ROLE);
1878
- requestAnimationFrame(function () {
1879
- _this.adapter.setAttr(strings$2.ROLE, 'alert');
1880
- });
1881
- };
1882
- return MDCTextFieldHelperTextFoundation;
1883
- }(MDCFoundation));
1884
-
1885
- /**
1886
- * @license
1887
- * Copyright 2017 Google Inc.
1888
- *
1889
- * Permission is hereby granted, free of charge, to any person obtaining a copy
1890
- * of this software and associated documentation files (the "Software"), to deal
1891
- * in the Software without restriction, including without limitation the rights
1892
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
1893
- * copies of the Software, and to permit persons to whom the Software is
1894
- * furnished to do so, subject to the following conditions:
1895
- *
1896
- * The above copyright notice and this permission notice shall be included in
1897
- * all copies or substantial portions of the Software.
1898
- *
1899
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
1900
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
1901
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
1902
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
1903
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
1904
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
1905
- * THE SOFTWARE.
1906
- */
1907
- var MDCTextFieldHelperText = /** @class */ (function (_super) {
1908
- tslib_es6.__extends(MDCTextFieldHelperText, _super);
1909
- function MDCTextFieldHelperText() {
1910
- return _super !== null && _super.apply(this, arguments) || this;
1911
- }
1912
- MDCTextFieldHelperText.attachTo = function (root) {
1913
- return new MDCTextFieldHelperText(root);
1914
- };
1915
- Object.defineProperty(MDCTextFieldHelperText.prototype, "foundationForTextField", {
1916
- // Provided for access by MDCTextField component
1917
- get: function () {
1918
- return this.foundation;
1919
- },
1920
- enumerable: false,
1921
- configurable: true
1922
- });
1923
- MDCTextFieldHelperText.prototype.getDefaultFoundation = function () {
1924
- var _this = this;
1925
- // DO NOT INLINE this variable. For backward compatibility, foundations take a Partial<MDCFooAdapter>.
1926
- // To ensure we don't accidentally omit any methods, we need a separate, strongly typed adapter variable.
1927
- // tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
1928
- var adapter = {
1929
- addClass: function (className) { return _this.root.classList.add(className); },
1930
- removeClass: function (className) { return _this.root.classList.remove(className); },
1931
- hasClass: function (className) { return _this.root.classList.contains(className); },
1932
- getAttr: function (attr) { return _this.root.getAttribute(attr); },
1933
- setAttr: function (attr, value) { return _this.root.setAttribute(attr, value); },
1934
- removeAttr: function (attr) { return _this.root.removeAttribute(attr); },
1935
- setContent: function (content) {
1936
- _this.root.textContent = content;
1937
- },
1938
- };
1939
- // tslint:enable:object-literal-sort-keys
1940
- return new MDCTextFieldHelperTextFoundation(adapter);
1941
- };
1942
- return MDCTextFieldHelperText;
1943
- }(MDCComponent));
1944
-
1945
- /**
1946
- * @license
1947
- * Copyright 2016 Google Inc.
1948
- *
1949
- * Permission is hereby granted, free of charge, to any person obtaining a copy
1950
- * of this software and associated documentation files (the "Software"), to deal
1951
- * in the Software without restriction, including without limitation the rights
1952
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
1953
- * copies of the Software, and to permit persons to whom the Software is
1954
- * furnished to do so, subject to the following conditions:
1955
- *
1956
- * The above copyright notice and this permission notice shall be included in
1957
- * all copies or substantial portions of the Software.
1958
- *
1959
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
1960
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
1961
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
1962
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
1963
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
1964
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
1965
- * THE SOFTWARE.
1966
- */
1967
- var strings$1 = {
1968
- ICON_EVENT: 'MDCTextField:icon',
1969
- ICON_ROLE: 'button',
1970
- };
1971
- var cssClasses$1 = {
1972
- ROOT: 'mdc-text-field__icon',
1973
- };
1974
-
1975
- /**
1976
- * @license
1977
- * Copyright 2017 Google Inc.
1978
- *
1979
- * Permission is hereby granted, free of charge, to any person obtaining a copy
1980
- * of this software and associated documentation files (the "Software"), to deal
1981
- * in the Software without restriction, including without limitation the rights
1982
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
1983
- * copies of the Software, and to permit persons to whom the Software is
1984
- * furnished to do so, subject to the following conditions:
1985
- *
1986
- * The above copyright notice and this permission notice shall be included in
1987
- * all copies or substantial portions of the Software.
1988
- *
1989
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
1990
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
1991
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
1992
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
1993
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
1994
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
1995
- * THE SOFTWARE.
1996
- */
1997
- var INTERACTION_EVENTS = ['click', 'keydown'];
1998
- var MDCTextFieldIconFoundation = /** @class */ (function (_super) {
1999
- tslib_es6.__extends(MDCTextFieldIconFoundation, _super);
2000
- function MDCTextFieldIconFoundation(adapter) {
2001
- var _this = _super.call(this, tslib_es6.__assign(tslib_es6.__assign({}, MDCTextFieldIconFoundation.defaultAdapter), adapter)) || this;
2002
- _this.savedTabIndex = null;
2003
- _this.interactionHandler = function (evt) {
2004
- _this.handleInteraction(evt);
2005
- };
2006
- return _this;
2007
- }
2008
- Object.defineProperty(MDCTextFieldIconFoundation, "strings", {
2009
- get: function () {
2010
- return strings$1;
2011
- },
2012
- enumerable: false,
2013
- configurable: true
2014
- });
2015
- Object.defineProperty(MDCTextFieldIconFoundation, "cssClasses", {
2016
- get: function () {
2017
- return cssClasses$1;
2018
- },
2019
- enumerable: false,
2020
- configurable: true
2021
- });
2022
- Object.defineProperty(MDCTextFieldIconFoundation, "defaultAdapter", {
2023
- /**
2024
- * See {@link MDCTextFieldIconAdapter} for typing information on parameters and return types.
2025
- */
2026
- get: function () {
2027
- // tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
2028
- return {
2029
- getAttr: function () { return null; },
2030
- setAttr: function () { return undefined; },
2031
- removeAttr: function () { return undefined; },
2032
- setContent: function () { return undefined; },
2033
- registerInteractionHandler: function () { return undefined; },
2034
- deregisterInteractionHandler: function () { return undefined; },
2035
- notifyIconAction: function () { return undefined; },
2036
- };
2037
- // tslint:enable:object-literal-sort-keys
2038
- },
2039
- enumerable: false,
2040
- configurable: true
2041
- });
2042
- MDCTextFieldIconFoundation.prototype.init = function () {
2043
- var e_1, _a;
2044
- this.savedTabIndex = this.adapter.getAttr('tabindex');
2045
- try {
2046
- for (var INTERACTION_EVENTS_1 = tslib_es6.__values(INTERACTION_EVENTS), INTERACTION_EVENTS_1_1 = INTERACTION_EVENTS_1.next(); !INTERACTION_EVENTS_1_1.done; INTERACTION_EVENTS_1_1 = INTERACTION_EVENTS_1.next()) {
2047
- var evtType = INTERACTION_EVENTS_1_1.value;
2048
- this.adapter.registerInteractionHandler(evtType, this.interactionHandler);
2049
- }
2050
- }
2051
- catch (e_1_1) { e_1 = { error: e_1_1 }; }
2052
- finally {
2053
- try {
2054
- if (INTERACTION_EVENTS_1_1 && !INTERACTION_EVENTS_1_1.done && (_a = INTERACTION_EVENTS_1.return)) _a.call(INTERACTION_EVENTS_1);
2055
- }
2056
- finally { if (e_1) throw e_1.error; }
2057
- }
2058
- };
2059
- MDCTextFieldIconFoundation.prototype.destroy = function () {
2060
- var e_2, _a;
2061
- try {
2062
- for (var INTERACTION_EVENTS_2 = tslib_es6.__values(INTERACTION_EVENTS), INTERACTION_EVENTS_2_1 = INTERACTION_EVENTS_2.next(); !INTERACTION_EVENTS_2_1.done; INTERACTION_EVENTS_2_1 = INTERACTION_EVENTS_2.next()) {
2063
- var evtType = INTERACTION_EVENTS_2_1.value;
2064
- this.adapter.deregisterInteractionHandler(evtType, this.interactionHandler);
2065
- }
2066
- }
2067
- catch (e_2_1) { e_2 = { error: e_2_1 }; }
2068
- finally {
2069
- try {
2070
- if (INTERACTION_EVENTS_2_1 && !INTERACTION_EVENTS_2_1.done && (_a = INTERACTION_EVENTS_2.return)) _a.call(INTERACTION_EVENTS_2);
2071
- }
2072
- finally { if (e_2) throw e_2.error; }
2073
- }
2074
- };
2075
- MDCTextFieldIconFoundation.prototype.setDisabled = function (disabled) {
2076
- if (!this.savedTabIndex) {
2077
- return;
2078
- }
2079
- if (disabled) {
2080
- this.adapter.setAttr('tabindex', '-1');
2081
- this.adapter.removeAttr('role');
2082
- }
2083
- else {
2084
- this.adapter.setAttr('tabindex', this.savedTabIndex);
2085
- this.adapter.setAttr('role', strings$1.ICON_ROLE);
2086
- }
2087
- };
2088
- MDCTextFieldIconFoundation.prototype.setAriaLabel = function (label) {
2089
- this.adapter.setAttr('aria-label', label);
2090
- };
2091
- MDCTextFieldIconFoundation.prototype.setContent = function (content) {
2092
- this.adapter.setContent(content);
2093
- };
2094
- MDCTextFieldIconFoundation.prototype.handleInteraction = function (evt) {
2095
- var isEnterKey = evt.key === 'Enter' || evt.keyCode === 13;
2096
- if (evt.type === 'click' || isEnterKey) {
2097
- evt.preventDefault(); // stop click from causing host label to focus
2098
- // input
2099
- this.adapter.notifyIconAction();
2100
- }
2101
- };
2102
- return MDCTextFieldIconFoundation;
2103
- }(MDCFoundation));
2104
-
2105
- /**
2106
- * @license
2107
- * Copyright 2017 Google Inc.
2108
- *
2109
- * Permission is hereby granted, free of charge, to any person obtaining a copy
2110
- * of this software and associated documentation files (the "Software"), to deal
2111
- * in the Software without restriction, including without limitation the rights
2112
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
2113
- * copies of the Software, and to permit persons to whom the Software is
2114
- * furnished to do so, subject to the following conditions:
2115
- *
2116
- * The above copyright notice and this permission notice shall be included in
2117
- * all copies or substantial portions of the Software.
2118
- *
2119
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
2120
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
2121
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
2122
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
2123
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
2124
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
2125
- * THE SOFTWARE.
2126
- */
2127
- var MDCTextFieldIcon = /** @class */ (function (_super) {
2128
- tslib_es6.__extends(MDCTextFieldIcon, _super);
2129
- function MDCTextFieldIcon() {
2130
- return _super !== null && _super.apply(this, arguments) || this;
2131
- }
2132
- MDCTextFieldIcon.attachTo = function (root) {
2133
- return new MDCTextFieldIcon(root);
2134
- };
2135
- Object.defineProperty(MDCTextFieldIcon.prototype, "foundationForTextField", {
2136
- // Provided for access by MDCTextField component
2137
- get: function () {
2138
- return this.foundation;
2139
- },
2140
- enumerable: false,
2141
- configurable: true
2142
- });
2143
- MDCTextFieldIcon.prototype.getDefaultFoundation = function () {
2144
- var _this = this;
2145
- // DO NOT INLINE this variable. For backward compatibility, foundations take a Partial<MDCFooAdapter>.
2146
- // To ensure we don't accidentally omit any methods, we need a separate, strongly typed adapter variable.
2147
- // tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
2148
- var adapter = {
2149
- getAttr: function (attr) { return _this.root.getAttribute(attr); },
2150
- setAttr: function (attr, value) { return _this.root.setAttribute(attr, value); },
2151
- removeAttr: function (attr) { return _this.root.removeAttribute(attr); },
2152
- setContent: function (content) {
2153
- _this.root.textContent = content;
2154
- },
2155
- registerInteractionHandler: function (evtType, handler) { return _this.listen(evtType, handler); },
2156
- deregisterInteractionHandler: function (evtType, handler) { return _this.unlisten(evtType, handler); },
2157
- notifyIconAction: function () { return _this.emit(MDCTextFieldIconFoundation.strings.ICON_EVENT, {} /* evtData */, true /* shouldBubble */); },
2158
- };
2159
- // tslint:enable:object-literal-sort-keys
2160
- return new MDCTextFieldIconFoundation(adapter);
2161
- };
2162
- return MDCTextFieldIcon;
2163
- }(MDCComponent));
2164
-
2165
- /**
2166
- * @license
2167
- * Copyright 2016 Google Inc.
2168
- *
2169
- * Permission is hereby granted, free of charge, to any person obtaining a copy
2170
- * of this software and associated documentation files (the "Software"), to deal
2171
- * in the Software without restriction, including without limitation the rights
2172
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
2173
- * copies of the Software, and to permit persons to whom the Software is
2174
- * furnished to do so, subject to the following conditions:
2175
- *
2176
- * The above copyright notice and this permission notice shall be included in
2177
- * all copies or substantial portions of the Software.
2178
- *
2179
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
2180
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
2181
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
2182
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
2183
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
2184
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
2185
- * THE SOFTWARE.
2186
- */
2187
- var MDCTextField = /** @class */ (function (_super) {
2188
- tslib_es6.__extends(MDCTextField, _super);
2189
- function MDCTextField() {
2190
- return _super !== null && _super.apply(this, arguments) || this;
2191
- }
2192
- MDCTextField.attachTo = function (root) {
2193
- return new MDCTextField(root);
2194
- };
2195
- MDCTextField.prototype.initialize = function (rippleFactory, lineRippleFactory, helperTextFactory, characterCounterFactory, iconFactory, labelFactory, outlineFactory) {
2196
- if (rippleFactory === void 0) { rippleFactory = function (el, foundation) { return new component.MDCRipple(el, foundation); }; }
2197
- if (lineRippleFactory === void 0) { lineRippleFactory = function (el) { return new MDCLineRipple(el); }; }
2198
- if (helperTextFactory === void 0) { helperTextFactory = function (el) {
2199
- return new MDCTextFieldHelperText(el);
2200
- }; }
2201
- if (characterCounterFactory === void 0) { characterCounterFactory = function (el) {
2202
- return new MDCTextFieldCharacterCounter(el);
2203
- }; }
2204
- if (iconFactory === void 0) { iconFactory = function (el) { return new MDCTextFieldIcon(el); }; }
2205
- if (labelFactory === void 0) { labelFactory = function (el) { return new MDCFloatingLabel(el); }; }
2206
- if (outlineFactory === void 0) { outlineFactory = function (el) { return new MDCNotchedOutline(el); }; }
2207
- this.input =
2208
- this.root.querySelector(strings$3.INPUT_SELECTOR);
2209
- var labelElement = this.root.querySelector(strings$3.LABEL_SELECTOR);
2210
- this.label = labelElement ? labelFactory(labelElement) : null;
2211
- var lineRippleElement = this.root.querySelector(strings$3.LINE_RIPPLE_SELECTOR);
2212
- this.lineRipple =
2213
- lineRippleElement ? lineRippleFactory(lineRippleElement) : null;
2214
- var outlineElement = this.root.querySelector(strings$3.OUTLINE_SELECTOR);
2215
- this.outline = outlineElement ? outlineFactory(outlineElement) : null;
2216
- // Helper text
2217
- var helperTextStrings = MDCTextFieldHelperTextFoundation.strings;
2218
- var nextElementSibling = this.root.nextElementSibling;
2219
- var hasHelperLine = (nextElementSibling && nextElementSibling.classList.contains(cssClasses$3.HELPER_LINE));
2220
- var helperTextEl = hasHelperLine && nextElementSibling && nextElementSibling.querySelector(helperTextStrings.ROOT_SELECTOR);
2221
- this.helperText = helperTextEl ? helperTextFactory(helperTextEl) : null;
2222
- // Character counter
2223
- var characterCounterStrings = MDCTextFieldCharacterCounterFoundation.strings;
2224
- var characterCounterEl = this.root.querySelector(characterCounterStrings.ROOT_SELECTOR);
2225
- // If character counter is not found in root element search in sibling element.
2226
- if (!characterCounterEl && hasHelperLine && nextElementSibling) {
2227
- characterCounterEl = nextElementSibling.querySelector(characterCounterStrings.ROOT_SELECTOR);
2228
- }
2229
- this.characterCounter =
2230
- characterCounterEl ? characterCounterFactory(characterCounterEl) : null;
2231
- // Leading icon
2232
- var leadingIconEl = this.root.querySelector(strings$3.LEADING_ICON_SELECTOR);
2233
- this.leadingIcon = leadingIconEl ? iconFactory(leadingIconEl) : null;
2234
- // Trailing icon
2235
- var trailingIconEl = this.root.querySelector(strings$3.TRAILING_ICON_SELECTOR);
2236
- this.trailingIcon = trailingIconEl ? iconFactory(trailingIconEl) : null;
2237
- // Prefix and Suffix
2238
- this.prefix = this.root.querySelector(strings$3.PREFIX_SELECTOR);
2239
- this.suffix = this.root.querySelector(strings$3.SUFFIX_SELECTOR);
2240
- this.ripple = this.createRipple(rippleFactory);
2241
- };
2242
- MDCTextField.prototype.destroy = function () {
2243
- if (this.ripple) {
2244
- this.ripple.destroy();
2245
- }
2246
- if (this.lineRipple) {
2247
- this.lineRipple.destroy();
2248
- }
2249
- if (this.helperText) {
2250
- this.helperText.destroy();
2251
- }
2252
- if (this.characterCounter) {
2253
- this.characterCounter.destroy();
2254
- }
2255
- if (this.leadingIcon) {
2256
- this.leadingIcon.destroy();
2257
- }
2258
- if (this.trailingIcon) {
2259
- this.trailingIcon.destroy();
2260
- }
2261
- if (this.label) {
2262
- this.label.destroy();
2263
- }
2264
- if (this.outline) {
2265
- this.outline.destroy();
2266
- }
2267
- _super.prototype.destroy.call(this);
2268
- };
2269
- /**
2270
- * Initializes the Text Field's internal state based on the environment's
2271
- * state.
2272
- */
2273
- MDCTextField.prototype.initialSyncWithDOM = function () {
2274
- this.disabled = this.input.disabled;
2275
- };
2276
- Object.defineProperty(MDCTextField.prototype, "value", {
2277
- get: function () {
2278
- return this.foundation.getValue();
2279
- },
2280
- /**
2281
- * @param value The value to set on the input.
2282
- */
2283
- set: function (value) {
2284
- this.foundation.setValue(value);
2285
- },
2286
- enumerable: false,
2287
- configurable: true
2288
- });
2289
- Object.defineProperty(MDCTextField.prototype, "disabled", {
2290
- get: function () {
2291
- return this.foundation.isDisabled();
2292
- },
2293
- /**
2294
- * @param disabled Sets the Text Field disabled or enabled.
2295
- */
2296
- set: function (disabled) {
2297
- this.foundation.setDisabled(disabled);
2298
- },
2299
- enumerable: false,
2300
- configurable: true
2301
- });
2302
- Object.defineProperty(MDCTextField.prototype, "valid", {
2303
- get: function () {
2304
- return this.foundation.isValid();
2305
- },
2306
- /**
2307
- * @param valid Sets the Text Field valid or invalid.
2308
- */
2309
- set: function (valid) {
2310
- this.foundation.setValid(valid);
2311
- },
2312
- enumerable: false,
2313
- configurable: true
2314
- });
2315
- Object.defineProperty(MDCTextField.prototype, "required", {
2316
- get: function () {
2317
- return this.input.required;
2318
- },
2319
- /**
2320
- * @param required Sets the Text Field to required.
2321
- */
2322
- set: function (required) {
2323
- this.input.required = required;
2324
- },
2325
- enumerable: false,
2326
- configurable: true
2327
- });
2328
- Object.defineProperty(MDCTextField.prototype, "pattern", {
2329
- get: function () {
2330
- return this.input.pattern;
2331
- },
2332
- /**
2333
- * @param pattern Sets the input element's validation pattern.
2334
- */
2335
- set: function (pattern) {
2336
- this.input.pattern = pattern;
2337
- },
2338
- enumerable: false,
2339
- configurable: true
2340
- });
2341
- Object.defineProperty(MDCTextField.prototype, "minLength", {
2342
- get: function () {
2343
- return this.input.minLength;
2344
- },
2345
- /**
2346
- * @param minLength Sets the input element's minLength.
2347
- */
2348
- set: function (minLength) {
2349
- this.input.minLength = minLength;
2350
- },
2351
- enumerable: false,
2352
- configurable: true
2353
- });
2354
- Object.defineProperty(MDCTextField.prototype, "maxLength", {
2355
- get: function () {
2356
- return this.input.maxLength;
2357
- },
2358
- /**
2359
- * @param maxLength Sets the input element's maxLength.
2360
- */
2361
- set: function (maxLength) {
2362
- // Chrome throws exception if maxLength is set to a value less than zero
2363
- if (maxLength < 0) {
2364
- this.input.removeAttribute('maxLength');
2365
- }
2366
- else {
2367
- this.input.maxLength = maxLength;
2368
- }
2369
- },
2370
- enumerable: false,
2371
- configurable: true
2372
- });
2373
- Object.defineProperty(MDCTextField.prototype, "min", {
2374
- get: function () {
2375
- return this.input.min;
2376
- },
2377
- /**
2378
- * @param min Sets the input element's min.
2379
- */
2380
- set: function (min) {
2381
- this.input.min = min;
2382
- },
2383
- enumerable: false,
2384
- configurable: true
2385
- });
2386
- Object.defineProperty(MDCTextField.prototype, "max", {
2387
- get: function () {
2388
- return this.input.max;
2389
- },
2390
- /**
2391
- * @param max Sets the input element's max.
2392
- */
2393
- set: function (max) {
2394
- this.input.max = max;
2395
- },
2396
- enumerable: false,
2397
- configurable: true
2398
- });
2399
- Object.defineProperty(MDCTextField.prototype, "step", {
2400
- get: function () {
2401
- return this.input.step;
2402
- },
2403
- /**
2404
- * @param step Sets the input element's step.
2405
- */
2406
- set: function (step) {
2407
- this.input.step = step;
2408
- },
2409
- enumerable: false,
2410
- configurable: true
2411
- });
2412
- Object.defineProperty(MDCTextField.prototype, "helperTextContent", {
2413
- /**
2414
- * Sets the helper text element content.
2415
- */
2416
- set: function (content) {
2417
- this.foundation.setHelperTextContent(content);
2418
- },
2419
- enumerable: false,
2420
- configurable: true
2421
- });
2422
- Object.defineProperty(MDCTextField.prototype, "leadingIconAriaLabel", {
2423
- /**
2424
- * Sets the aria label of the leading icon.
2425
- */
2426
- set: function (label) {
2427
- this.foundation.setLeadingIconAriaLabel(label);
2428
- },
2429
- enumerable: false,
2430
- configurable: true
2431
- });
2432
- Object.defineProperty(MDCTextField.prototype, "leadingIconContent", {
2433
- /**
2434
- * Sets the text content of the leading icon.
2435
- */
2436
- set: function (content) {
2437
- this.foundation.setLeadingIconContent(content);
2438
- },
2439
- enumerable: false,
2440
- configurable: true
2441
- });
2442
- Object.defineProperty(MDCTextField.prototype, "trailingIconAriaLabel", {
2443
- /**
2444
- * Sets the aria label of the trailing icon.
2445
- */
2446
- set: function (label) {
2447
- this.foundation.setTrailingIconAriaLabel(label);
2448
- },
2449
- enumerable: false,
2450
- configurable: true
2451
- });
2452
- Object.defineProperty(MDCTextField.prototype, "trailingIconContent", {
2453
- /**
2454
- * Sets the text content of the trailing icon.
2455
- */
2456
- set: function (content) {
2457
- this.foundation.setTrailingIconContent(content);
2458
- },
2459
- enumerable: false,
2460
- configurable: true
2461
- });
2462
- Object.defineProperty(MDCTextField.prototype, "useNativeValidation", {
2463
- /**
2464
- * Enables or disables the use of native validation. Use this for custom validation.
2465
- * @param useNativeValidation Set this to false to ignore native input validation.
2466
- */
2467
- set: function (useNativeValidation) {
2468
- this.foundation.setUseNativeValidation(useNativeValidation);
2469
- },
2470
- enumerable: false,
2471
- configurable: true
2472
- });
2473
- Object.defineProperty(MDCTextField.prototype, "prefixText", {
2474
- /**
2475
- * Gets the text content of the prefix, or null if it does not exist.
2476
- */
2477
- get: function () {
2478
- return this.prefix ? this.prefix.textContent : null;
2479
- },
2480
- /**
2481
- * Sets the text content of the prefix, if it exists.
2482
- */
2483
- set: function (prefixText) {
2484
- if (this.prefix) {
2485
- this.prefix.textContent = prefixText;
2486
- }
2487
- },
2488
- enumerable: false,
2489
- configurable: true
2490
- });
2491
- Object.defineProperty(MDCTextField.prototype, "suffixText", {
2492
- /**
2493
- * Gets the text content of the suffix, or null if it does not exist.
2494
- */
2495
- get: function () {
2496
- return this.suffix ? this.suffix.textContent : null;
2497
- },
2498
- /**
2499
- * Sets the text content of the suffix, if it exists.
2500
- */
2501
- set: function (suffixText) {
2502
- if (this.suffix) {
2503
- this.suffix.textContent = suffixText;
2504
- }
2505
- },
2506
- enumerable: false,
2507
- configurable: true
2508
- });
2509
- /**
2510
- * Focuses the input element.
2511
- */
2512
- MDCTextField.prototype.focus = function () {
2513
- this.input.focus();
2514
- };
2515
- /**
2516
- * Recomputes the outline SVG path for the outline element.
2517
- */
2518
- MDCTextField.prototype.layout = function () {
2519
- var openNotch = this.foundation.shouldFloat;
2520
- this.foundation.notchOutline(openNotch);
2521
- };
2522
- MDCTextField.prototype.getDefaultFoundation = function () {
2523
- // DO NOT INLINE this variable. For backward compatibility, foundations take a Partial<MDCFooAdapter>.
2524
- // To ensure we don't accidentally omit any methods, we need a separate, strongly typed adapter variable.
2525
- // tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
2526
- var adapter = tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign({}, this.getRootAdapterMethods()), this.getInputAdapterMethods()), this.getLabelAdapterMethods()), this.getLineRippleAdapterMethods()), this.getOutlineAdapterMethods());
2527
- // tslint:enable:object-literal-sort-keys
2528
- return new MDCTextFieldFoundation(adapter, this.getFoundationMap());
2529
- };
2530
- MDCTextField.prototype.getRootAdapterMethods = function () {
2531
- var _this = this;
2532
- // tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
2533
- return {
2534
- addClass: function (className) { return _this.root.classList.add(className); },
2535
- removeClass: function (className) { return _this.root.classList.remove(className); },
2536
- hasClass: function (className) { return _this.root.classList.contains(className); },
2537
- registerTextFieldInteractionHandler: function (evtType, handler) {
2538
- _this.listen(evtType, handler);
2539
- },
2540
- deregisterTextFieldInteractionHandler: function (evtType, handler) {
2541
- _this.unlisten(evtType, handler);
2542
- },
2543
- registerValidationAttributeChangeHandler: function (handler) {
2544
- var getAttributesList = function (mutationsList) {
2545
- return mutationsList
2546
- .map(function (mutation) { return mutation.attributeName; })
2547
- .filter(function (attributeName) { return attributeName; });
2548
- };
2549
- var observer = new MutationObserver(function (mutationsList) { return handler(getAttributesList(mutationsList)); });
2550
- var config = { attributes: true };
2551
- observer.observe(_this.input, config);
2552
- return observer;
2553
- },
2554
- deregisterValidationAttributeChangeHandler: function (observer) {
2555
- observer.disconnect();
2556
- },
2557
- };
2558
- // tslint:enable:object-literal-sort-keys
2559
- };
2560
- MDCTextField.prototype.getInputAdapterMethods = function () {
2561
- var _this = this;
2562
- // tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
2563
- return {
2564
- getNativeInput: function () { return _this.input; },
2565
- setInputAttr: function (attr, value) {
2566
- _this.input.setAttribute(attr, value);
2567
- },
2568
- removeInputAttr: function (attr) {
2569
- _this.input.removeAttribute(attr);
2570
- },
2571
- isFocused: function () { return document.activeElement === _this.input; },
2572
- registerInputInteractionHandler: function (evtType, handler) {
2573
- _this.input.addEventListener(evtType, handler, applyPassive());
2574
- },
2575
- deregisterInputInteractionHandler: function (evtType, handler) {
2576
- _this.input.removeEventListener(evtType, handler, applyPassive());
2577
- },
2578
- };
2579
- // tslint:enable:object-literal-sort-keys
2580
- };
2581
- MDCTextField.prototype.getLabelAdapterMethods = function () {
2582
- var _this = this;
2583
- return {
2584
- floatLabel: function (shouldFloat) {
2585
- _this.label && _this.label.float(shouldFloat);
2586
- },
2587
- getLabelWidth: function () { return _this.label ? _this.label.getWidth() : 0; },
2588
- hasLabel: function () { return Boolean(_this.label); },
2589
- shakeLabel: function (shouldShake) {
2590
- _this.label && _this.label.shake(shouldShake);
2591
- },
2592
- setLabelRequired: function (isRequired) {
2593
- _this.label && _this.label.setRequired(isRequired);
2594
- },
2595
- };
2596
- };
2597
- MDCTextField.prototype.getLineRippleAdapterMethods = function () {
2598
- var _this = this;
2599
- return {
2600
- activateLineRipple: function () {
2601
- if (_this.lineRipple) {
2602
- _this.lineRipple.activate();
2603
- }
2604
- },
2605
- deactivateLineRipple: function () {
2606
- if (_this.lineRipple) {
2607
- _this.lineRipple.deactivate();
2608
- }
2609
- },
2610
- setLineRippleTransformOrigin: function (normalizedX) {
2611
- if (_this.lineRipple) {
2612
- _this.lineRipple.setRippleCenter(normalizedX);
2613
- }
2614
- },
2615
- };
2616
- };
2617
- MDCTextField.prototype.getOutlineAdapterMethods = function () {
2618
- var _this = this;
2619
- return {
2620
- closeOutline: function () {
2621
- _this.outline && _this.outline.closeNotch();
2622
- },
2623
- hasOutline: function () { return Boolean(_this.outline); },
2624
- notchOutline: function (labelWidth) {
2625
- _this.outline && _this.outline.notch(labelWidth);
2626
- },
2627
- };
2628
- };
2629
- /**
2630
- * @return A map of all subcomponents to subfoundations.
2631
- */
2632
- MDCTextField.prototype.getFoundationMap = function () {
2633
- return {
2634
- characterCounter: this.characterCounter ?
2635
- this.characterCounter.foundationForTextField :
2636
- undefined,
2637
- helperText: this.helperText ? this.helperText.foundationForTextField :
2638
- undefined,
2639
- leadingIcon: this.leadingIcon ? this.leadingIcon.foundationForTextField :
2640
- undefined,
2641
- trailingIcon: this.trailingIcon ?
2642
- this.trailingIcon.foundationForTextField :
2643
- undefined,
2644
- };
2645
- };
2646
- MDCTextField.prototype.createRipple = function (rippleFactory) {
2647
- var _this = this;
2648
- var isTextArea = this.root.classList.contains(cssClasses$3.TEXTAREA);
2649
- var isOutlined = this.root.classList.contains(cssClasses$3.OUTLINED);
2650
- if (isTextArea || isOutlined) {
2651
- return null;
2652
- }
2653
- // DO NOT INLINE this variable. For backward compatibility, foundations take a Partial<MDCFooAdapter>.
2654
- // To ensure we don't accidentally omit any methods, we need a separate, strongly typed adapter variable.
2655
- // tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
2656
- var adapter = tslib_es6.__assign(tslib_es6.__assign({}, component.MDCRipple.createAdapter(this)), { isSurfaceActive: function () { return matches(_this.input, ':active'); }, registerInteractionHandler: function (evtType, handler) {
2657
- _this.input.addEventListener(evtType, handler, applyPassive());
2658
- }, deregisterInteractionHandler: function (evtType, handler) {
2659
- _this.input.removeEventListener(evtType, handler, applyPassive());
2660
- } });
2661
- // tslint:enable:object-literal-sort-keys
2662
- return rippleFactory(this.root, new component.MDCRippleFoundation(adapter));
2663
- };
2664
- return MDCTextField;
2665
- }(MDCComponent));
2666
-
2667
- /**
2668
- * @license
2669
- * Copyright 2017 Google Inc.
2670
- *
2671
- * Permission is hereby granted, free of charge, to any person obtaining a copy
2672
- * of this software and associated documentation files (the "Software"), to deal
2673
- * in the Software without restriction, including without limitation the rights
2674
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
2675
- * copies of the Software, and to permit persons to whom the Software is
2676
- * furnished to do so, subject to the following conditions:
2677
- *
2678
- * The above copyright notice and this permission notice shall be included in
2679
- * all copies or substantial portions of the Software.
2680
- *
2681
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
2682
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
2683
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
2684
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
2685
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
2686
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
2687
- * THE SOFTWARE.
2688
- */
2689
- var cssClasses = {
2690
- ROOT: 'mdc-form-field',
2691
- };
2692
- var strings = {
2693
- LABEL_SELECTOR: '.mdc-form-field > label',
2694
- };
2695
-
2696
- /**
2697
- * @license
2698
- * Copyright 2017 Google Inc.
2699
- *
2700
- * Permission is hereby granted, free of charge, to any person obtaining a copy
2701
- * of this software and associated documentation files (the "Software"), to deal
2702
- * in the Software without restriction, including without limitation the rights
2703
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
2704
- * copies of the Software, and to permit persons to whom the Software is
2705
- * furnished to do so, subject to the following conditions:
2706
- *
2707
- * The above copyright notice and this permission notice shall be included in
2708
- * all copies or substantial portions of the Software.
2709
- *
2710
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
2711
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
2712
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
2713
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
2714
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
2715
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
2716
- * THE SOFTWARE.
2717
- */
2718
- var MDCFormFieldFoundation = /** @class */ (function (_super) {
2719
- tslib_es6.__extends(MDCFormFieldFoundation, _super);
2720
- function MDCFormFieldFoundation(adapter) {
2721
- var _this = _super.call(this, tslib_es6.__assign(tslib_es6.__assign({}, MDCFormFieldFoundation.defaultAdapter), adapter)) || this;
2722
- _this.click = function () {
2723
- _this.handleClick();
2724
- };
2725
- return _this;
2726
- }
2727
- Object.defineProperty(MDCFormFieldFoundation, "cssClasses", {
2728
- get: function () {
2729
- return cssClasses;
2730
- },
2731
- enumerable: false,
2732
- configurable: true
2733
- });
2734
- Object.defineProperty(MDCFormFieldFoundation, "strings", {
2735
- get: function () {
2736
- return strings;
2737
- },
2738
- enumerable: false,
2739
- configurable: true
2740
- });
2741
- Object.defineProperty(MDCFormFieldFoundation, "defaultAdapter", {
2742
- get: function () {
2743
- return {
2744
- activateInputRipple: function () { return undefined; },
2745
- deactivateInputRipple: function () { return undefined; },
2746
- deregisterInteractionHandler: function () { return undefined; },
2747
- registerInteractionHandler: function () { return undefined; },
2748
- };
2749
- },
2750
- enumerable: false,
2751
- configurable: true
2752
- });
2753
- MDCFormFieldFoundation.prototype.init = function () {
2754
- this.adapter.registerInteractionHandler('click', this.click);
2755
- };
2756
- MDCFormFieldFoundation.prototype.destroy = function () {
2757
- this.adapter.deregisterInteractionHandler('click', this.click);
2758
- };
2759
- MDCFormFieldFoundation.prototype.handleClick = function () {
2760
- var _this = this;
2761
- this.adapter.activateInputRipple();
2762
- requestAnimationFrame(function () {
2763
- _this.adapter.deactivateInputRipple();
2764
- });
2765
- };
2766
- return MDCFormFieldFoundation;
2767
- }(MDCFoundation));
2768
-
2769
- /**
2770
- * @license
2771
- * Copyright 2017 Google Inc.
2772
- *
2773
- * Permission is hereby granted, free of charge, to any person obtaining a copy
2774
- * of this software and associated documentation files (the "Software"), to deal
2775
- * in the Software without restriction, including without limitation the rights
2776
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
2777
- * copies of the Software, and to permit persons to whom the Software is
2778
- * furnished to do so, subject to the following conditions:
2779
- *
2780
- * The above copyright notice and this permission notice shall be included in
2781
- * all copies or substantial portions of the Software.
2782
- *
2783
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
2784
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
2785
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
2786
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
2787
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
2788
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
2789
- * THE SOFTWARE.
2790
- */
2791
- var MDCFormField = /** @class */ (function (_super) {
2792
- tslib_es6.__extends(MDCFormField, _super);
2793
- function MDCFormField() {
2794
- return _super !== null && _super.apply(this, arguments) || this;
2795
- }
2796
- MDCFormField.attachTo = function (root) {
2797
- return new MDCFormField(root);
2798
- };
2799
- MDCFormField.prototype.labelEl = function () {
2800
- var LABEL_SELECTOR = MDCFormFieldFoundation.strings.LABEL_SELECTOR;
2801
- return this.root.querySelector(LABEL_SELECTOR);
2802
- };
2803
- MDCFormField.prototype.getDefaultFoundation = function () {
2804
- var _this = this;
2805
- // DO NOT INLINE this variable. For backward compatibility, foundations take a Partial<MDCFooAdapter>.
2806
- // To ensure we don't accidentally omit any methods, we need a separate, strongly typed adapter variable.
2807
- var adapter = {
2808
- activateInputRipple: function () {
2809
- if (_this.input && _this.input.ripple) {
2810
- _this.input.ripple.activate();
2811
- }
2812
- },
2813
- deactivateInputRipple: function () {
2814
- if (_this.input && _this.input.ripple) {
2815
- _this.input.ripple.deactivate();
2816
- }
2817
- },
2818
- deregisterInteractionHandler: function (evtType, handler) {
2819
- var labelEl = _this.labelEl();
2820
- if (labelEl) {
2821
- labelEl.removeEventListener(evtType, handler);
2822
- }
2823
- },
2824
- registerInteractionHandler: function (evtType, handler) {
2825
- var labelEl = _this.labelEl();
2826
- if (labelEl) {
2827
- labelEl.addEventListener(evtType, handler);
2828
- }
2829
- },
2830
- };
2831
- return new MDCFormFieldFoundation(adapter);
2832
- };
2833
- return MDCFormField;
2834
- }(MDCComponent));
2835
-
2836
- /**
2837
- * Instantiates Material Design text field component.
2838
- * @param el - Must be the f-component wrapper (.f-text-field)
2839
- * @see https://material-components.github.io/material-components-web-catalog/#/component/text-field
2840
- */
2841
- function FTextFieldMDC(el) {
2842
- const component = new MDCTextField(el.querySelector('.mdc-text-field'));
2843
- const form = el.querySelector('.mdc-form-field');
2844
- const helper = el.querySelector('.mdc-text-field-helper-text');
2845
- const counter = el.querySelector('.mdc-text-field-character-counter');
2846
- const icon = el.querySelector('.mdc-text-field-icon');
2847
- if (form) {
2848
- const formField = MDCFormField.attachTo(form);
2849
- if (formField) {
2850
- formField.input = component;
2851
- }
2852
- }
2853
- if (helper) {
2854
- new MDCTextFieldHelperText(helper);
2855
- }
2856
- if (counter) {
2857
- new MDCTextFieldCharacterCounter(counter);
2858
- }
2859
- if (icon) {
2860
- new MDCTextFieldIcon(icon);
2861
- }
2862
- }
5
+ const index = require('./index-eb556444.js');
6
+ const kupManager = require('./kup-manager-5c03da64.js');
7
+ const fTextField = require('./f-text-field-e7c35b5b.js');
8
+ const fTextFieldMdc = require('./f-text-field-mdc-a67f5dfe.js');
9
+ const utils = require('./utils-e99921c1.js');
10
+ const GenericVariables = require('./GenericVariables-a9ed17ee.js');
11
+ const fImage = require('./f-image-12bab3b5.js');
12
+ const cellUtils = require('./cell-utils-d96b2993.js');
13
+ const fChip = require('./f-chip-df59e1b0.js');
14
+ const fCell = require('./f-cell-8351cb84.js');
15
+ const fButton = require('./f-button-2b9b99b1.js');
16
+ const fButtonDeclarations = require('./f-button-declarations-b611587f.js');
17
+ const component = require('./component-d1496215.js');
18
+ require('./tslib.es6-0ee02c67.js');
2863
19
 
2864
20
  /**
2865
21
  * Props of the kup-autocomplete component.
@@ -3395,7 +551,7 @@ const KupAutocomplete = class {
3395
551
  if (f) {
3396
552
  this.textfieldWrapper = f;
3397
553
  this.textfieldEl = f.querySelector('input');
3398
- FTextFieldMDC(f);
554
+ fTextFieldMdc.FTextFieldMDC(f);
3399
555
  }
3400
556
  }
3401
557
  this.kupManager.debug.logRender(this, true);
@@ -3403,7 +559,7 @@ const KupAutocomplete = class {
3403
559
  render() {
3404
560
  const fullHeight = this.rootElement.classList.contains('kup-full-height');
3405
561
  const fullWidth = this.rootElement.classList.contains('kup-full-width');
3406
- return (index.h(index.Host, { class: `${fullHeight ? 'kup-full-height' : ''} ${fullWidth ? 'kup-full-width' : ''}`, style: this.elStyle }, index.h("style", null, this.kupManager.theme.setKupStyle(this.rootElement)), index.h("div", { id: GenericVariables.componentWrapperId, style: this.elStyle }, index.h(fCell.FTextField, Object.assign({}, this.data['kup-text-field'], { disabled: this.disabled, fullHeight: fullHeight, fullWidth: fullWidth, icon: this.showDropDownIcon
562
+ return (index.h(index.Host, { class: `${fullHeight ? 'kup-full-height' : ''} ${fullWidth ? 'kup-full-width' : ''}`, style: this.elStyle }, index.h("style", null, this.kupManager.theme.setKupStyle(this.rootElement)), index.h("div", { id: GenericVariables.componentWrapperId, style: this.elStyle }, index.h(fTextField.FTextField, Object.assign({}, this.data['kup-text-field'], { disabled: this.disabled, fullHeight: fullHeight, fullWidth: fullWidth, icon: this.showDropDownIcon
3407
563
  ? kupManager.KupThemeIconValues.DROPDOWN
3408
564
  : null, trailingIcon: true, value: this.displayedValue, onBlur: () => this.onKupBlur(), onClick: () => this.onKupClick(), onChange: (e) => this.onKupChange(e.target.value), onFocus: () => this.onKupFocus(), onInput: () => {
3409
565
  window.clearTimeout(this.inputTimeout);
@@ -3598,7 +754,7 @@ var KupGlobalFilterMode;
3598
754
  KupGlobalFilterMode["HIGHLIGHT"] = "highlight";
3599
755
  })(KupGlobalFilterMode || (KupGlobalFilterMode = {}));
3600
756
 
3601
- const dom$8 = document.documentElement;
757
+ const dom$9 = document.documentElement;
3602
758
  /**
3603
759
  * Filtering algorithms.
3604
760
  * @module Filters
@@ -3614,16 +770,16 @@ class Filters {
3614
770
  return comp.rootElement.tagName === kupManager.KupTagNames.TREE;
3615
771
  }
3616
772
  isObjFiltrableByInterval(obj) {
3617
- if (dom$8.ketchup.objects.isDate(obj)) {
773
+ if (dom$9.ketchup.objects.isDate(obj)) {
3618
774
  return true;
3619
775
  }
3620
- if (dom$8.ketchup.objects.isTime(obj)) {
776
+ if (dom$9.ketchup.objects.isTime(obj)) {
3621
777
  return true;
3622
778
  }
3623
- if (dom$8.ketchup.objects.isTimestamp(obj)) {
779
+ if (dom$9.ketchup.objects.isTimestamp(obj)) {
3624
780
  return true;
3625
781
  }
3626
- if (dom$8.ketchup.objects.isNumber(obj)) {
782
+ if (dom$9.ketchup.objects.isNumber(obj)) {
3627
783
  return true;
3628
784
  }
3629
785
  return false;
@@ -3633,17 +789,17 @@ class Filters {
3633
789
  if (newValue == null || newValue == '' || smeupObj == null) {
3634
790
  return newValue;
3635
791
  }
3636
- if (dom$8.ketchup.objects.isDate(smeupObj)) {
3637
- if (dom$8.ketchup.dates.isValid(value, kupManager.KupDatesFormats.ISO_DATE)) {
792
+ if (dom$9.ketchup.objects.isDate(smeupObj)) {
793
+ if (dom$9.ketchup.dates.isValid(value, kupManager.KupDatesFormats.ISO_DATE)) {
3638
794
  return newValue;
3639
795
  }
3640
- if (dom$8.ketchup.dates.isValid(value)) {
3641
- return dom$8.ketchup.dates.format(dom$8.ketchup.dates.normalize(value, kupManager.KupDatesNormalize.DATE), kupManager.KupDatesFormats.ISO_DATE);
796
+ if (dom$9.ketchup.dates.isValid(value)) {
797
+ return dom$9.ketchup.dates.format(dom$9.ketchup.dates.normalize(value, kupManager.KupDatesNormalize.DATE), kupManager.KupDatesFormats.ISO_DATE);
3642
798
  }
3643
799
  }
3644
- else if (dom$8.ketchup.objects.isTime(smeupObj)) {
3645
- let manageSeconds = dom$8.ketchup.objects.isTimeWithSeconds(smeupObj);
3646
- if (dom$8.ketchup.dates.isValid(value, manageSeconds
800
+ else if (dom$9.ketchup.objects.isTime(smeupObj)) {
801
+ let manageSeconds = dom$9.ketchup.objects.isTimeWithSeconds(smeupObj);
802
+ if (dom$9.ketchup.dates.isValid(value, manageSeconds
3647
803
  ? kupManager.KupDatesFormats.ISO_TIME
3648
804
  : kupManager.KupDatesFormats.ISO_TIME_WITHOUT_SECONDS)) {
3649
805
  return newValue;
@@ -3654,15 +810,15 @@ class Filters {
3654
810
  : kupManager.KupDatesFormats.ISO_TIME_WITHOUT_SECONDS, manageSeconds);
3655
811
  }
3656
812
  }
3657
- else if (dom$8.ketchup.objects.isTimestamp(smeupObj)) {
3658
- if (dom$8.ketchup.dates.isValid(value, kupManager.KupDatesFormats.ISO_DATE_TIME)) {
813
+ else if (dom$9.ketchup.objects.isTimestamp(smeupObj)) {
814
+ if (dom$9.ketchup.dates.isValid(value, kupManager.KupDatesFormats.ISO_DATE_TIME)) {
3659
815
  return newValue;
3660
816
  }
3661
817
  if (utils.isValidFormattedStringTime(value, true)) {
3662
818
  return utils.formattedStringToDefaultUnformattedStringTimestamp(value);
3663
819
  }
3664
820
  }
3665
- else if (dom$8.ketchup.objects.isNumber(smeupObj)) {
821
+ else if (dom$9.ketchup.objects.isNumber(smeupObj)) {
3666
822
  if (utils.isValidFormattedStringNumber(value, smeupObj ? smeupObj.p : '')) {
3667
823
  return utils.formattedStringToUnformattedStringNumber(value, smeupObj ? smeupObj.p : '');
3668
824
  }
@@ -3785,7 +941,7 @@ class Filters {
3785
941
  to = interval[FilterInterval.TO];
3786
942
  }
3787
943
  let checkByRegularExpression = true;
3788
- if (dom$8.ketchup.objects.isNumber(obj)) {
944
+ if (dom$9.ketchup.objects.isNumber(obj)) {
3789
945
  value = utils.unformattedStringNumberToNumber(value, obj ? obj.p : '');
3790
946
  let valueNumber = utils.stringToNumber(value);
3791
947
  if (from != '') {
@@ -3813,30 +969,30 @@ class Filters {
3813
969
  }
3814
970
  }
3815
971
  }
3816
- if (dom$8.ketchup.objects.isDate(obj) ||
3817
- dom$8.ketchup.objects.isTime(obj) ||
3818
- dom$8.ketchup.objects.isTimestamp(obj)) {
972
+ if (dom$9.ketchup.objects.isDate(obj) ||
973
+ dom$9.ketchup.objects.isTime(obj) ||
974
+ dom$9.ketchup.objects.isTimestamp(obj)) {
3819
975
  let valueDate = null;
3820
976
  let defaultFormat = kupManager.KupDatesFormats.ISO_DATE;
3821
- if (dom$8.ketchup.objects.isDate(obj)) {
977
+ if (dom$9.ketchup.objects.isDate(obj)) {
3822
978
  defaultFormat = kupManager.KupDatesFormats.ISO_DATE;
3823
979
  }
3824
- else if (dom$8.ketchup.objects.isTime(obj)) {
3825
- defaultFormat = dom$8.ketchup.objects.isTimeWithSeconds(obj)
980
+ else if (dom$9.ketchup.objects.isTime(obj)) {
981
+ defaultFormat = dom$9.ketchup.objects.isTimeWithSeconds(obj)
3826
982
  ? kupManager.KupDatesFormats.ISO_TIME
3827
983
  : kupManager.KupDatesFormats.ISO_TIME_WITHOUT_SECONDS;
3828
984
  }
3829
- else if (dom$8.ketchup.objects.isTimestamp(obj)) {
985
+ else if (dom$9.ketchup.objects.isTimestamp(obj)) {
3830
986
  defaultFormat = kupManager.KupDatesFormats.ISO_DATE_TIME;
3831
987
  }
3832
- if (dom$8.ketchup.dates.isValid(value, defaultFormat, true)) {
3833
- valueDate = dom$8.ketchup.dates.toDate(value, defaultFormat);
988
+ if (dom$9.ketchup.dates.isValid(value, defaultFormat, true)) {
989
+ valueDate = dom$9.ketchup.dates.toDate(value, defaultFormat);
3834
990
  }
3835
991
  if (from != '') {
3836
992
  if (valueDate != null &&
3837
- dom$8.ketchup.dates.isValid(from, defaultFormat, true)) {
993
+ dom$9.ketchup.dates.isValid(from, defaultFormat, true)) {
3838
994
  checkByRegularExpression = false;
3839
- let fromDate = dom$8.ketchup.dates.toDate(from, defaultFormat);
995
+ let fromDate = dom$9.ketchup.dates.toDate(from, defaultFormat);
3840
996
  if (valueDate < fromDate) {
3841
997
  return false;
3842
998
  }
@@ -3847,9 +1003,9 @@ class Filters {
3847
1003
  }
3848
1004
  if (to != '') {
3849
1005
  if (valueDate != null &&
3850
- dom$8.ketchup.dates.isValid(to, defaultFormat, true)) {
1006
+ dom$9.ketchup.dates.isValid(to, defaultFormat, true)) {
3851
1007
  checkByRegularExpression = false;
3852
- let toDate = dom$8.ketchup.dates.toDate(to, defaultFormat);
1008
+ let toDate = dom$9.ketchup.dates.toDate(to, defaultFormat);
3853
1009
  if (valueDate > toDate) {
3854
1010
  return false;
3855
1011
  }
@@ -3858,9 +1014,9 @@ class Filters {
3858
1014
  filterValue = to;
3859
1015
  }
3860
1016
  }
3861
- if (!dom$8.ketchup.dates.isValid(filterValue, defaultFormat) &&
3862
- !dom$8.ketchup.dates.isValid(filterValue)) {
3863
- value = dom$8.ketchup.dates.format(value);
1017
+ if (!dom$9.ketchup.dates.isValid(filterValue, defaultFormat) &&
1018
+ !dom$9.ketchup.dates.isValid(filterValue)) {
1019
+ value = dom$9.ketchup.dates.format(value);
3864
1020
  }
3865
1021
  }
3866
1022
  if (checkByRegularExpression) {
@@ -4292,9 +1448,9 @@ var KupTreeExpansionMode;
4292
1448
  KupTreeExpansionMode["NODE"] = "node";
4293
1449
  })(KupTreeExpansionMode || (KupTreeExpansionMode = {}));
4294
1450
 
4295
- const dom$7 = document.documentElement;
4296
- const kupObjects = dom$7.ketchup
4297
- ? dom$7.ketchup.objects
1451
+ const dom$8 = document.documentElement;
1452
+ const kupObjects = dom$8.ketchup
1453
+ ? dom$8.ketchup.objects
4298
1454
  : new kupManager.KupObjects();
4299
1455
  /**
4300
1456
  * Filtering algorithms related to data-table rows.
@@ -4543,7 +1699,7 @@ class FiltersRows extends Filters {
4543
1699
  }
4544
1700
  }
4545
1701
 
4546
- const dom$6 = document.documentElement;
1702
+ const dom$7 = document.documentElement;
4547
1703
  function sortRows(rows = [], sort = []) {
4548
1704
  if (!rows || rows.length === 0) {
4549
1705
  return [];
@@ -4774,10 +1930,10 @@ function updateGroupTotal(groupRow, totals, addedRow, distinctObj) {
4774
1930
  return;
4775
1931
  }
4776
1932
  keys.forEach((key) => {
4777
- const currentTotalValue = dom$6.ketchup.math.numberify(groupRow.group.totals[key] || 0);
1933
+ const currentTotalValue = dom$7.ketchup.math.numberify(groupRow.group.totals[key] || 0);
4778
1934
  const cell = addedRow.cells[key];
4779
1935
  if (cell) {
4780
- let _isNumber = dom$6.ketchup.objects.isNumber(cell.obj);
1936
+ let _isNumber = dom$7.ketchup.objects.isNumber(cell.obj);
4781
1937
  const totalMode = totals[key];
4782
1938
  switch (totalMode) {
4783
1939
  case kupManager.TotalMode.COUNT:
@@ -4793,7 +1949,7 @@ function updateGroupTotal(groupRow, totals, addedRow, distinctObj) {
4793
1949
  case kupManager.TotalMode.DISTINCT:
4794
1950
  let cellValue;
4795
1951
  if (_isNumber) {
4796
- cellValue = dom$6.ketchup.math.numberify(utils.stringToNumber(cell.value));
1952
+ cellValue = dom$7.ketchup.math.numberify(utils.stringToNumber(cell.value));
4797
1953
  }
4798
1954
  else {
4799
1955
  cellValue = cell.value;
@@ -4845,13 +2001,13 @@ function updateGroupTotal(groupRow, totals, addedRow, distinctObj) {
4845
2001
  case kupManager.TotalMode.SUM:
4846
2002
  case kupManager.TotalMode.AVERAGE:
4847
2003
  if (_isNumber) {
4848
- const cellValue = dom$6.ketchup.math.numberify(utils.stringToNumber(cell.value));
2004
+ const cellValue = dom$7.ketchup.math.numberify(utils.stringToNumber(cell.value));
4849
2005
  groupRow.group.totals[key] =
4850
2006
  cellValue + currentTotalValue;
4851
2007
  // updating parents
4852
2008
  let parent = groupRow.group.parent;
4853
2009
  while (parent != null) {
4854
- const currentParentSum = dom$6.ketchup.math.numberify(parent.group.totals[key] || 0);
2010
+ const currentParentSum = dom$7.ketchup.math.numberify(parent.group.totals[key] || 0);
4855
2011
  parent.group.totals[key] =
4856
2012
  cellValue + currentParentSum;
4857
2013
  parent = parent.group.parent;
@@ -4862,7 +2018,7 @@ function updateGroupTotal(groupRow, totals, addedRow, distinctObj) {
4862
2018
  case kupManager.TotalMode.MIN:
4863
2019
  if (_isNumber) {
4864
2020
  const currentTotalValue = groupRow.group.totals[key];
4865
- const cellValue = dom$6.ketchup.math.numberify(utils.stringToNumber(cell.value));
2021
+ const cellValue = dom$7.ketchup.math.numberify(utils.stringToNumber(cell.value));
4866
2022
  if (currentTotalValue) {
4867
2023
  groupRow.group.totals[key] = Math.min(currentTotalValue, cellValue);
4868
2024
  }
@@ -4884,19 +2040,19 @@ function updateGroupTotal(groupRow, totals, addedRow, distinctObj) {
4884
2040
  parent = parent.group.parent;
4885
2041
  }
4886
2042
  }
4887
- else if (dom$6.ketchup.objects.isDate(cell.obj)) {
2043
+ else if (dom$7.ketchup.objects.isDate(cell.obj)) {
4888
2044
  const momentValue = cell.obj
4889
- ? dom$6.ketchup.objects.parseDate(cell.obj)
4890
- : dom$6.ketchup.dates.toDayjs(cell.value);
4891
- if (dom$6.ketchup.dates.isValid(momentValue)) {
4892
- const cellValue = dom$6.ketchup.dates.toDate(momentValue);
2045
+ ? dom$7.ketchup.objects.parseDate(cell.obj)
2046
+ : dom$7.ketchup.dates.toDayjs(cell.value);
2047
+ if (dom$7.ketchup.dates.isValid(momentValue)) {
2048
+ const cellValue = dom$7.ketchup.dates.toDate(momentValue);
4893
2049
  const currentTotalValue = groupRow.group.totals[key];
4894
2050
  if (currentTotalValue) {
4895
2051
  let moments = [];
4896
2052
  moments.push(cellValue);
4897
- moments.push(dom$6.ketchup.dates.format(currentTotalValue));
2053
+ moments.push(dom$7.ketchup.dates.format(currentTotalValue));
4898
2054
  groupRow.group.totals[key] =
4899
- dom$6.ketchup.dates.format(dom$6.ketchup.dates.min(moments));
2055
+ dom$7.ketchup.dates.format(dom$7.ketchup.dates.min(moments));
4900
2056
  }
4901
2057
  else {
4902
2058
  groupRow.group.totals[key] = cellValue;
@@ -4908,9 +2064,9 @@ function updateGroupTotal(groupRow, totals, addedRow, distinctObj) {
4908
2064
  if (currentParentMin) {
4909
2065
  let moments = [];
4910
2066
  moments.push(cellValue);
4911
- moments.push(dom$6.ketchup.dates.format(currentParentMin));
2067
+ moments.push(dom$7.ketchup.dates.format(currentParentMin));
4912
2068
  parent.group.totals[key] =
4913
- dom$6.ketchup.dates.format(dom$6.ketchup.dates.min(moments));
2069
+ dom$7.ketchup.dates.format(dom$7.ketchup.dates.min(moments));
4914
2070
  }
4915
2071
  else {
4916
2072
  // first round
@@ -4925,7 +2081,7 @@ function updateGroupTotal(groupRow, totals, addedRow, distinctObj) {
4925
2081
  case kupManager.TotalMode.MAX:
4926
2082
  if (_isNumber) {
4927
2083
  const currentTotalValue = groupRow.group.totals[key];
4928
- const cellValue = dom$6.ketchup.math.numberify(utils.stringToNumber(cell.value));
2084
+ const cellValue = dom$7.ketchup.math.numberify(utils.stringToNumber(cell.value));
4929
2085
  if (currentTotalValue) {
4930
2086
  groupRow.group.totals[key] = Math.max(currentTotalValue, cellValue);
4931
2087
  }
@@ -4947,19 +2103,19 @@ function updateGroupTotal(groupRow, totals, addedRow, distinctObj) {
4947
2103
  parent = parent.group.parent;
4948
2104
  }
4949
2105
  }
4950
- else if (dom$6.ketchup.objects.isDate(cell.obj)) {
2106
+ else if (dom$7.ketchup.objects.isDate(cell.obj)) {
4951
2107
  const momentValue = cell.obj
4952
- ? dom$6.ketchup.objects.parseDate(cell.obj)
4953
- : dom$6.ketchup.dates.toDayjs(cell.value);
4954
- if (dom$6.ketchup.dates.isValid(momentValue)) {
4955
- const cellValue = dom$6.ketchup.dates.toDate(momentValue);
2108
+ ? dom$7.ketchup.objects.parseDate(cell.obj)
2109
+ : dom$7.ketchup.dates.toDayjs(cell.value);
2110
+ if (dom$7.ketchup.dates.isValid(momentValue)) {
2111
+ const cellValue = dom$7.ketchup.dates.toDate(momentValue);
4956
2112
  const currentTotalValue = groupRow.group.totals[key];
4957
2113
  if (currentTotalValue) {
4958
2114
  let moments = [];
4959
2115
  moments.push(cellValue);
4960
- moments.push(dom$6.ketchup.dates.format(currentTotalValue));
2116
+ moments.push(dom$7.ketchup.dates.format(currentTotalValue));
4961
2117
  groupRow.group.totals[key] =
4962
- dom$6.ketchup.dates.format(dom$6.ketchup.dates.max(moments));
2118
+ dom$7.ketchup.dates.format(dom$7.ketchup.dates.max(moments));
4963
2119
  }
4964
2120
  else {
4965
2121
  groupRow.group.totals[key] = cellValue;
@@ -4971,9 +2127,9 @@ function updateGroupTotal(groupRow, totals, addedRow, distinctObj) {
4971
2127
  if (currentParentMin) {
4972
2128
  let moments = [];
4973
2129
  moments.push(cellValue);
4974
- moments.push(dom$6.ketchup.dates.format(currentParentMin));
2130
+ moments.push(dom$7.ketchup.dates.format(currentParentMin));
4975
2131
  parent.group.totals[key] =
4976
- dom$6.ketchup.dates.format(dom$6.ketchup.dates.max(moments));
2132
+ dom$7.ketchup.dates.format(dom$7.ketchup.dates.max(moments));
4977
2133
  }
4978
2134
  else {
4979
2135
  // first round
@@ -5067,12 +2223,12 @@ function adjustGroupAverageOrFormula(row, type, toAdjustKeys, totals) {
5067
2223
  toAdjustKeys.forEach((key) => {
5068
2224
  if (type == kupManager.TotalMode.AVERAGE) {
5069
2225
  row.group.totals[key] =
5070
- dom$6.ketchup.math.numberify(row.group.totals[key]) /
2226
+ dom$7.ketchup.math.numberify(row.group.totals[key]) /
5071
2227
  numberOfLeaf;
5072
2228
  }
5073
2229
  if (type == kupManager.TotalMode.MATH) {
5074
2230
  let formula = totals[key].substring(kupManager.TotalMode.MATH.length);
5075
- row.group.totals[key] = dom$6.ketchup.math.formulas.custom(formula, row.group.totals);
2231
+ row.group.totals[key] = dom$7.ketchup.math.formulas.custom(formula, row.group.totals);
5076
2232
  }
5077
2233
  });
5078
2234
  return numberOfLeaf;
@@ -5102,8 +2258,8 @@ function normalizeRows(columns, rows) {
5102
2258
  }
5103
2259
  }
5104
2260
  function calcTotals(rows = [], totals = {}) {
5105
- if (dom$6.ketchup.objects.isEmptyJsObject(rows) ||
5106
- dom$6.ketchup.objects.isEmptyJsObject(totals)) {
2261
+ if (dom$7.ketchup.objects.isEmptyJsObject(rows) ||
2262
+ dom$7.ketchup.objects.isEmptyJsObject(totals)) {
5107
2263
  return {};
5108
2264
  }
5109
2265
  const keys = Object.keys(totals);
@@ -5124,8 +2280,8 @@ function calcTotals(rows = [], totals = {}) {
5124
2280
  if (cell) {
5125
2281
  if (totals[key] === kupManager.TotalMode.DISTINCT) {
5126
2282
  let cellValue;
5127
- if (dom$6.ketchup.objects.isNumber(cell.obj)) {
5128
- cellValue = dom$6.ketchup.math.numberify(utils.stringToNumber(cell.value));
2283
+ if (dom$7.ketchup.objects.isNumber(cell.obj)) {
2284
+ cellValue = dom$7.ketchup.math.numberify(utils.stringToNumber(cell.value));
5129
2285
  }
5130
2286
  else {
5131
2287
  cellValue = cell.value;
@@ -5141,8 +2297,8 @@ function calcTotals(rows = [], totals = {}) {
5141
2297
  distinctList.push(cellValue);
5142
2298
  }
5143
2299
  }
5144
- else if (dom$6.ketchup.objects.isNumber(cell.obj)) {
5145
- const cellValue = dom$6.ketchup.math.numberify(utils.stringToNumber(cell.value));
2300
+ else if (dom$7.ketchup.objects.isNumber(cell.obj)) {
2301
+ const cellValue = dom$7.ketchup.math.numberify(utils.stringToNumber(cell.value));
5146
2302
  let currentFooterValue = footerRow[key];
5147
2303
  switch (true) {
5148
2304
  // TODO DRY the MIN and MAX functions
@@ -5167,25 +2323,25 @@ function calcTotals(rows = [], totals = {}) {
5167
2323
  currentFooterValue = footerRow[key] || 0;
5168
2324
  footerRow[key] =
5169
2325
  cellValue +
5170
- dom$6.ketchup.math.numberify(currentFooterValue);
2326
+ dom$7.ketchup.math.numberify(currentFooterValue);
5171
2327
  }
5172
2328
  // TODO DRY the MIN and MAX functions
5173
2329
  }
5174
- else if (dom$6.ketchup.objects.isDate(cell.obj)) {
2330
+ else if (dom$7.ketchup.objects.isDate(cell.obj)) {
5175
2331
  const momentValue = cell.obj
5176
- ? dom$6.ketchup.objects.parseDate(cell.obj)
5177
- : dom$6.ketchup.dates.toDayjs(cell.value);
5178
- if (dom$6.ketchup.dates.isValid(momentValue)) {
5179
- const cellValue = dom$6.ketchup.dates.toDate(momentValue);
2332
+ ? dom$7.ketchup.objects.parseDate(cell.obj)
2333
+ : dom$7.ketchup.dates.toDayjs(cell.value);
2334
+ if (dom$7.ketchup.dates.isValid(momentValue)) {
2335
+ const cellValue = dom$7.ketchup.dates.toDate(momentValue);
5180
2336
  const currentFooterValue = footerRow[key];
5181
2337
  switch (true) {
5182
2338
  case totals[key] === kupManager.TotalMode.MIN:
5183
2339
  if (currentFooterValue) {
5184
2340
  let moments = [];
5185
2341
  moments.push(cellValue);
5186
- moments.push(dom$6.ketchup.dates.format(currentFooterValue));
2342
+ moments.push(dom$7.ketchup.dates.format(currentFooterValue));
5187
2343
  footerRow[key] =
5188
- dom$6.ketchup.dates.format(dom$6.ketchup.dates.min(moments));
2344
+ dom$7.ketchup.dates.format(dom$7.ketchup.dates.min(moments));
5189
2345
  }
5190
2346
  else {
5191
2347
  footerRow[key] = cellValue;
@@ -5195,9 +2351,9 @@ function calcTotals(rows = [], totals = {}) {
5195
2351
  if (currentFooterValue) {
5196
2352
  let moments = [];
5197
2353
  moments.push(cellValue);
5198
- moments.push(dom$6.ketchup.dates.format(currentFooterValue));
2354
+ moments.push(dom$7.ketchup.dates.format(currentFooterValue));
5199
2355
  footerRow[key] =
5200
- dom$6.ketchup.dates.format(dom$6.ketchup.dates.max(moments));
2356
+ dom$7.ketchup.dates.format(dom$7.ketchup.dates.max(moments));
5201
2357
  }
5202
2358
  else {
5203
2359
  footerRow[key] = cellValue;
@@ -5228,7 +2384,7 @@ function calcTotals(rows = [], totals = {}) {
5228
2384
  footerRow[key] = rows.length;
5229
2385
  break;
5230
2386
  case totals[key].indexOf(kupManager.TotalMode.MATH) == 0:
5231
- footerRow[key] = dom$6.ketchup.math.formulas.custom(totals[key].substring(kupManager.TotalMode.MATH.length), footerRow);
2387
+ footerRow[key] = dom$7.ketchup.math.formulas.custom(totals[key].substring(kupManager.TotalMode.MATH.length), footerRow);
5232
2388
  break;
5233
2389
  }
5234
2390
  if (footerRow[key]) {
@@ -5392,7 +2548,7 @@ var FPaginatorMode;
5392
2548
  FPaginatorMode["FULL"] = "full";
5393
2549
  })(FPaginatorMode || (FPaginatorMode = {}));
5394
2550
 
5395
- const dom$5 = document.documentElement;
2551
+ const dom$6 = document.documentElement;
5396
2552
  /*-------------------------------------------------*/
5397
2553
  /* C o m p o n e n t */
5398
2554
  /*-------------------------------------------------*/
@@ -5405,8 +2561,8 @@ const FPaginator = (props) => {
5405
2561
  data: pageItems,
5406
2562
  },
5407
2563
  'kup-text-field': {
5408
- label: dom$5.ketchup.language.translate(kupManager.KupLanguagePage.PAGE),
5409
- helper: dom$5.ketchup.language.translate(kupManager.KupLanguagePage.TOTAL) +
2564
+ label: dom$6.ketchup.language.translate(kupManager.KupLanguagePage.PAGE),
2565
+ helper: dom$6.ketchup.language.translate(kupManager.KupLanguagePage.TOTAL) +
5410
2566
  `: ${maxNumberOfPage}`,
5411
2567
  helperWhenFocused: true,
5412
2568
  inputType: 'number',
@@ -5419,10 +2575,10 @@ const FPaginator = (props) => {
5419
2575
  data: rowsPerPageItems,
5420
2576
  },
5421
2577
  'kup-text-field': {
5422
- label: dom$5.ketchup.language.translate(kupManager.KupLanguageRow.ROWS) +
2578
+ label: dom$6.ketchup.language.translate(kupManager.KupLanguageRow.ROWS) +
5423
2579
  ' / ' +
5424
- dom$5.ketchup.language.translate(kupManager.KupLanguagePage.PAGE),
5425
- helper: dom$5.ketchup.language.translate(kupManager.KupLanguageRow.TOTAL) +
2580
+ dom$6.ketchup.language.translate(kupManager.KupLanguagePage.PAGE),
2581
+ helper: dom$6.ketchup.language.translate(kupManager.KupLanguageRow.TOTAL) +
5426
2582
  `: ${props.max}`,
5427
2583
  helperWhenFocused: true,
5428
2584
  inputType: 'number',
@@ -5435,7 +2591,7 @@ const FPaginator = (props) => {
5435
2591
  index.h("kup-combobox", { class: "page-selector", data: dataPageSelector, initialValue: props.currentPage.toString(), "onkup-combobox-change": props.onPageChange }),
5436
2592
  props.mode !== FPaginatorMode.SIMPLE ? (index.h(fButton.FButton, { icon: "chevron_right", disabled: isNextPageDisabled(props), onClick: props.onNextPage, wrapperClass: "next-page" })) : null,
5437
2593
  index.h("kup-combobox", { class: "rows-selector", data: dataRowsSelector, initialValue: props.perPage.toString(), "onkup-combobox-change": props.onRowsChange }),
5438
- props.onLoadMore ? (index.h(fButton.FButton, { icon: "plus", onClick: props.onLoadMore, label: dom$5.ketchup.language.translate(kupManager.KupLanguageGeneric.LOAD_MORE), styling: fButtonDeclarations.FButtonStyling.FLAT, wrapperClass: "load-more-button" })) : null));
2594
+ props.onLoadMore ? (index.h(fButton.FButton, { icon: "plus", onClick: props.onLoadMore, label: dom$6.ketchup.language.translate(kupManager.KupLanguageGeneric.LOAD_MORE), styling: fButtonDeclarations.FButtonStyling.FLAT, wrapperClass: "load-more-button" })) : null));
5439
2595
  };
5440
2596
  function getPageItems(props, maxNumberOfPage) {
5441
2597
  const pageItems = [];
@@ -7323,7 +4479,7 @@ var SourceEvent;
7323
4479
  SourceEvent["YEAR"] = "year";
7324
4480
  })(SourceEvent || (SourceEvent = {}));
7325
4481
 
7326
- const dom$4 = document.documentElement;
4482
+ const dom$5 = document.documentElement;
7327
4483
  function prepareCalendar(component) {
7328
4484
  const el = component.rootElement;
7329
4485
  if (!el.kupData)
@@ -7335,9 +4491,9 @@ function prepareCalendar(component) {
7335
4491
  const obj = opts.initialValue;
7336
4492
  if (opts.initialValue) {
7337
4493
  if (obj && obj.k)
7338
- setValue$1(component, new Date(obj.k));
4494
+ setValue$2(component, new Date(obj.k));
7339
4495
  else
7340
- setValue$1(component, new Date(opts.initialValue));
4496
+ setValue$2(component, new Date(opts.initialValue));
7341
4497
  }
7342
4498
  if (opts.firstDayIndex)
7343
4499
  el.kupData.firstDayIndex = opts.firstDayIndex;
@@ -7345,7 +4501,7 @@ function prepareCalendar(component) {
7345
4501
  }
7346
4502
  }
7347
4503
  if (!el.kupData.value)
7348
- setValue$1(component, new Date());
4504
+ setValue$2(component, new Date());
7349
4505
  const months = utils.getMonthsAsStringByLocale();
7350
4506
  const curYear = getYear(component);
7351
4507
  const curMonth = getMonth(component);
@@ -7397,7 +4553,7 @@ function prepareCalendar(component) {
7397
4553
  nextButtonComp)),
7398
4554
  index.h("div", { class: "section-2" }, createCalendar(component))));
7399
4555
  }
7400
- function setValue$1(component, value) {
4556
+ function setValue$2(component, value) {
7401
4557
  const el = component.rootElement;
7402
4558
  el.kupData.value = value;
7403
4559
  el.kupData.day = el.kupData.value.getDate();
@@ -7407,7 +4563,7 @@ function setValue$1(component, value) {
7407
4563
  function getValue$1(component) {
7408
4564
  const el = component.rootElement;
7409
4565
  if (el.kupData.value == null)
7410
- setValue$1(component, new Date());
4566
+ setValue$2(component, new Date());
7411
4567
  return el.kupData.value;
7412
4568
  }
7413
4569
  function getDay(component) {
@@ -7651,7 +4807,7 @@ function getDayAsStringByLocale(date) {
7651
4807
  weekday: 'narrow',
7652
4808
  /** weekday: 'narrow' 'short' 'long' */
7653
4809
  };
7654
- const dateTimeFormat = new Intl.DateTimeFormat(dom$4.ketchup.dates.getLocale(), options);
4810
+ const dateTimeFormat = new Intl.DateTimeFormat(dom$5.ketchup.dates.getLocale(), options);
7655
4811
  return dateTimeFormat.format(date);
7656
4812
  }
7657
4813
  function fillString(stringIn, stringForFill, finalLen, addBefore) {
@@ -7743,7 +4899,7 @@ function refresh(component) {
7743
4899
  }
7744
4900
  function onCalendarMonthYearItemClick(component, value) {
7745
4901
  let d;
7746
- if (dom$4.ketchup.dates.isValid(value, kupManager.KupDatesFormats.ISO_DATE)) {
4902
+ if (dom$5.ketchup.dates.isValid(value, kupManager.KupDatesFormats.ISO_DATE)) {
7747
4903
  d = new Date(value);
7748
4904
  }
7749
4905
  else {
@@ -7765,18 +4921,18 @@ function onCalendarMonthYearItemClick(component, value) {
7765
4921
  }
7766
4922
  function onCalendarItemClick(component, value) {
7767
4923
  let d;
7768
- if (dom$4.ketchup.dates.isValid(value, kupManager.KupDatesFormats.ISO_DATE)) {
4924
+ if (dom$5.ketchup.dates.isValid(value, kupManager.KupDatesFormats.ISO_DATE)) {
7769
4925
  d = new Date(value);
7770
4926
  }
7771
4927
  else {
7772
4928
  d = new Date();
7773
4929
  }
7774
- setValue$1(component, d);
4930
+ setValue$2(component, d);
7775
4931
  component.onKupClick(component.rootElement.id, value);
7776
4932
  refresh(component);
7777
4933
  }
7778
4934
 
7779
- const dom$3 = document.documentElement;
4935
+ const dom$4 = document.documentElement;
7780
4936
  function prepareClock(component) {
7781
4937
  const el = component.rootElement;
7782
4938
  el.kupData = {};
@@ -7815,7 +4971,7 @@ function getValue(component) {
7815
4971
  return el.kupData.value;
7816
4972
  return '';
7817
4973
  }
7818
- function setValue(component, value) {
4974
+ function setValue$1(component, value) {
7819
4975
  const el = component.rootElement;
7820
4976
  el.kupData.value = value;
7821
4977
  }
@@ -7869,7 +5025,7 @@ function setClockValueSelected(component, newValue) {
7869
5025
  if (newValue == null) {
7870
5026
  return;
7871
5027
  }
7872
- setValue(component, newValue);
5028
+ setValue$1(component, newValue);
7873
5029
  }
7874
5030
  function isRelatedTargetInThisComponent(e, component) {
7875
5031
  if (!e.relatedTarget) {
@@ -7891,7 +5047,7 @@ function onKupBlur(component) {
7891
5047
  function createClock(component) {
7892
5048
  let selectedTime;
7893
5049
  if (getValue(component)) {
7894
- selectedTime = dom$3.ketchup.dates.toDate(getValue(component), isManageSeconds(component)
5050
+ selectedTime = dom$4.ketchup.dates.toDate(getValue(component), isManageSeconds(component)
7895
5051
  ? kupManager.KupDatesFormats.ISO_TIME
7896
5052
  : kupManager.KupDatesFormats.ISO_TIME_WITHOUT_SECONDS);
7897
5053
  }
@@ -8093,7 +5249,7 @@ function setClockTime(e, component) {
8093
5249
  e.target.classList.add('selected');
8094
5250
  }
8095
5251
 
8096
- const dom$2 = document.documentElement;
5252
+ const dom$3 = document.documentElement;
8097
5253
  const premadeFormulas = [
8098
5254
  kupManager.KupLanguageTotals.AVERAGE,
8099
5255
  kupManager.KupLanguageTotals.DIFFERENCE,
@@ -8108,7 +5264,7 @@ function prepareColumnDropMenu(component) {
8108
5264
  const column = options.data.columns[index];
8109
5265
  if (column.visible !== false &&
8110
5266
  column.obj &&
8111
- dom$2.ketchup.objects.isNumber(column.obj)) {
5267
+ dom$3.ketchup.objects.isNumber(column.obj)) {
8112
5268
  chipData.push({
8113
5269
  obj: column.obj,
8114
5270
  value: column.name,
@@ -8124,7 +5280,7 @@ function prepareColumnDropMenu(component) {
8124
5280
  if (options.enableFormula) {
8125
5281
  combobox = prepareCombobox(options, numericalColumnsExist);
8126
5282
  if (numericalColumnsExist) {
8127
- button = (index.h("kup-button", { "onKup-button-click": () => applyFormula(component), label: dom$2.ketchup.language.translate(kupManager.KupLanguageTotals.CALCULATE), styling: fButtonDeclarations.FButtonStyling.OUTLINED }));
5283
+ button = (index.h("kup-button", { "onKup-button-click": () => applyFormula(component), label: dom$3.ketchup.language.translate(kupManager.KupLanguageTotals.CALCULATE), styling: fButtonDeclarations.FButtonStyling.OUTLINED }));
8128
5284
  chipSet = (index.h("div", { class: "sub-chip" },
8129
5285
  index.h("kup-chip", { data: chipData, "onKup-chip-click": (e) => typeColumn(e, component) })));
8130
5286
  }
@@ -8137,35 +5293,35 @@ function prepareList(options) {
8137
5293
  listData.push({
8138
5294
  icon: 'library_add',
8139
5295
  id: kupManager.KupLanguageGeneric.MERGE,
8140
- value: dom$2.ketchup.language.translate(kupManager.KupLanguageGeneric.MERGE),
5296
+ value: dom$3.ketchup.language.translate(kupManager.KupLanguageGeneric.MERGE),
8141
5297
  });
8142
5298
  }
8143
5299
  if (options.enableMove) {
8144
5300
  listData.push({
8145
5301
  icon: 'swap_horiz',
8146
5302
  id: kupManager.KupLanguageGeneric.MOVE,
8147
- value: dom$2.ketchup.language.translate(kupManager.KupLanguageGeneric.MOVE),
5303
+ value: dom$3.ketchup.language.translate(kupManager.KupLanguageGeneric.MOVE),
8148
5304
  });
8149
5305
  }
8150
5306
  return listData.length > 0 ? (index.h("kup-list", { data: listData, showIcons: true, "onkup-list-click": (e) => listClick(e, options) })) : null;
8151
5307
  }
8152
5308
  function prepareCombobox(options, numericalColumnsExist) {
8153
5309
  const comboListData = [];
8154
- const numeric = dom$2.ketchup.objects.isNumber(options.receivingColumn.obj) &&
8155
- dom$2.ketchup.objects.isNumber(options.starterColumn.obj);
5310
+ const numeric = dom$3.ketchup.objects.isNumber(options.receivingColumn.obj) &&
5311
+ dom$3.ketchup.objects.isNumber(options.starterColumn.obj);
8156
5312
  if (numeric) {
8157
5313
  comboListData.push({
8158
5314
  id: kupManager.KupLanguageTotals.AVERAGE,
8159
- value: dom$2.ketchup.language.translate(kupManager.KupLanguageTotals.AVERAGE),
5315
+ value: dom$3.ketchup.language.translate(kupManager.KupLanguageTotals.AVERAGE),
8160
5316
  }, {
8161
5317
  id: kupManager.KupLanguageTotals.DIFFERENCE,
8162
- value: dom$2.ketchup.language.translate(kupManager.KupLanguageTotals.DIFFERENCE),
5318
+ value: dom$3.ketchup.language.translate(kupManager.KupLanguageTotals.DIFFERENCE),
8163
5319
  }, {
8164
5320
  id: kupManager.KupLanguageTotals.PRODUCT,
8165
- value: dom$2.ketchup.language.translate(kupManager.KupLanguageTotals.PRODUCT),
5321
+ value: dom$3.ketchup.language.translate(kupManager.KupLanguageTotals.PRODUCT),
8166
5322
  }, {
8167
5323
  id: kupManager.KupLanguageTotals.SUM,
8168
- value: dom$2.ketchup.language.translate(kupManager.KupLanguageTotals.SUM),
5324
+ value: dom$3.ketchup.language.translate(kupManager.KupLanguageTotals.SUM),
8169
5325
  }, {
8170
5326
  id: `([${options.starterColumn.name}]/[${options.receivingColumn.name}])*100`,
8171
5327
  value: `[${options.starterColumn.name}] / [${options.receivingColumn.name}] * 100`,
@@ -8177,7 +5333,7 @@ function prepareCombobox(options, numericalColumnsExist) {
8177
5333
  else {
8178
5334
  comboListData.push({
8179
5335
  id: kupManager.KupLanguageColumn.NO_FORMULA,
8180
- value: dom$2.ketchup.language.translate(kupManager.KupLanguageColumn.NO_FORMULA),
5336
+ value: dom$3.ketchup.language.translate(kupManager.KupLanguageColumn.NO_FORMULA),
8181
5337
  });
8182
5338
  }
8183
5339
  const comboData = {
@@ -8187,11 +5343,11 @@ function prepareCombobox(options, numericalColumnsExist) {
8187
5343
  },
8188
5344
  'kup-text-field': {
8189
5345
  helper: !numericalColumnsExist
8190
- ? dom$2.ketchup.language.translate(kupManager.KupLanguageColumn.NON_NUMERICAL_IN_TABLE)
5346
+ ? dom$3.ketchup.language.translate(kupManager.KupLanguageColumn.NON_NUMERICAL_IN_TABLE)
8191
5347
  : numeric
8192
5348
  ? `i.e.: [${options.receivingColumn.name}] - [${options.starterColumn.name}] + 1`
8193
- : dom$2.ketchup.language.translate(kupManager.KupLanguageColumn.NON_NUMERICAL),
8194
- label: dom$2.ketchup.language.translate(kupManager.KupLanguageTotals.FORMULA),
5349
+ : dom$3.ketchup.language.translate(kupManager.KupLanguageColumn.NON_NUMERICAL),
5350
+ label: dom$3.ketchup.language.translate(kupManager.KupLanguageTotals.FORMULA),
8195
5351
  outlined: true,
8196
5352
  },
8197
5353
  };
@@ -8230,7 +5386,7 @@ async function applyFormula(component) {
8230
5386
  if (combobox) {
8231
5387
  const value = (await combobox.getValue());
8232
5388
  if (premadeFormulas.includes(value)) {
8233
- dom$2.ketchup.data.column.new(options.data, kupManager.KupDataNewColumnTypes.MATH, {
5389
+ dom$3.ketchup.data.column.new(options.data, kupManager.KupDataNewColumnTypes.MATH, {
8234
5390
  columns: [
8235
5391
  options.receivingColumn.name,
8236
5392
  options.starterColumn.name,
@@ -8242,7 +5398,7 @@ async function applyFormula(component) {
8242
5398
  }
8243
5399
  }
8244
5400
  else {
8245
- const result = dom$2.ketchup.data.column.new(options.data, kupManager.KupDataNewColumnTypes.MATH, {
5401
+ const result = dom$3.ketchup.data.column.new(options.data, kupManager.KupDataNewColumnTypes.MATH, {
8246
5402
  operation: value,
8247
5403
  });
8248
5404
  if (typeof result === 'string' || result instanceof String) {
@@ -8257,6 +5413,157 @@ async function applyFormula(component) {
8257
5413
  }
8258
5414
  }
8259
5415
 
5416
+ const dom$2 = document.documentElement;
5417
+ function prepareNumeric(component) {
5418
+ const el = component.rootElement;
5419
+ if (!el.kupData)
5420
+ el.kupData = {
5421
+ value: null,
5422
+ localeValue: '',
5423
+ };
5424
+ let decimals = false;
5425
+ let negative = false;
5426
+ const options = getOptions(component);
5427
+ if (options.resetStatus) {
5428
+ el.kupData = {
5429
+ value: null,
5430
+ localeValue: '',
5431
+ };
5432
+ const obj = options.initialValue;
5433
+ if (options.initialValue) {
5434
+ if (obj && obj.k)
5435
+ el.kupData.value = obj.k;
5436
+ else
5437
+ el.kupData.value = options.initialValue.toString();
5438
+ el.kupData.localeValue = dom$2.ketchup.math.numbers.toLocaleString(el.kupData.value);
5439
+ }
5440
+ options.resetStatus = false;
5441
+ }
5442
+ if (options.negative)
5443
+ negative = true;
5444
+ if (options.decimals)
5445
+ decimals = true;
5446
+ const clearButtonProp = {
5447
+ icon: 'cancel',
5448
+ onClick: () => clearValue(component),
5449
+ };
5450
+ const saveButtonProp = {
5451
+ icon: 'save',
5452
+ onClick: () => saveValue(component),
5453
+ };
5454
+ const decChar = getDecimalChar();
5455
+ return (index.h("table", null,
5456
+ index.h("tr", null,
5457
+ index.h("td", { colSpan: 3 },
5458
+ index.h("div", { class: "value" }, el.kupData.localeValue))),
5459
+ index.h("tr", null,
5460
+ index.h("td", null,
5461
+ index.h("div", { class: "number", onClick: () => setValue(component, '1') }, "1")),
5462
+ index.h("td", null,
5463
+ index.h("div", { class: "number", onClick: () => setValue(component, '2') }, "2")),
5464
+ index.h("td", null,
5465
+ index.h("div", { class: "number", onClick: () => setValue(component, '3') }, "3"))),
5466
+ index.h("tr", null,
5467
+ index.h("td", null,
5468
+ index.h("div", { class: "number", onClick: () => setValue(component, '4') }, "4")),
5469
+ index.h("td", null,
5470
+ index.h("div", { class: "number", onClick: () => setValue(component, '5') }, "5")),
5471
+ index.h("td", null,
5472
+ index.h("div", { class: "number", onClick: () => setValue(component, '6') }, "6"))),
5473
+ index.h("tr", null,
5474
+ index.h("td", null,
5475
+ index.h("div", { class: "number", onClick: () => setValue(component, '7') }, "7")),
5476
+ index.h("td", null,
5477
+ index.h("div", { class: "number", onClick: () => setValue(component, '8') }, "8")),
5478
+ index.h("td", null,
5479
+ index.h("div", { class: "number", onClick: () => setValue(component, '9') }, "9"))),
5480
+ index.h("tr", null,
5481
+ index.h("td", null, negative
5482
+ ? [
5483
+ index.h("div", { class: "number", onClick: () => setSign(component) }, "-"),
5484
+ ]
5485
+ : []),
5486
+ index.h("td", null,
5487
+ index.h("div", { class: "number", onClick: () => setValue(component, '0') }, "0")),
5488
+ index.h("td", null, decimals
5489
+ ? [
5490
+ index.h("div", { class: "number", onClick: () => setValue(component, '.') }, decChar),
5491
+ ]
5492
+ : [])),
5493
+ index.h("tr", null,
5494
+ index.h("td", null),
5495
+ index.h("td", null,
5496
+ index.h(fButton.FButton, Object.assign({}, clearButtonProp))),
5497
+ index.h("td", null,
5498
+ index.h(fButton.FButton, Object.assign({}, saveButtonProp))))));
5499
+ }
5500
+ function getOptions(component) {
5501
+ if (component.data.options)
5502
+ return component.data.options;
5503
+ else
5504
+ return { resetStatus: false };
5505
+ }
5506
+ function setSign(component) {
5507
+ const el = component.rootElement;
5508
+ let strVal = el.kupData.value ? el.kupData.value : '0';
5509
+ if (strVal.startsWith('-'))
5510
+ return;
5511
+ strVal = '-' + strVal;
5512
+ el.kupData.value = strVal;
5513
+ el.kupData.localeValue = dom$2.ketchup.math.numbers.toLocaleString(strVal);
5514
+ component.refresh();
5515
+ }
5516
+ function setValue(component, value) {
5517
+ const options = getOptions(component);
5518
+ const el = component.rootElement;
5519
+ const decChar = '.';
5520
+ let strVal = el.kupData.value ? el.kupData.value.toString() : '0';
5521
+ // if the first value is 0 and the character you want to insert is not a comma, I clear the field.
5522
+ if (strVal == '0' && value != decChar) {
5523
+ strVal = '';
5524
+ }
5525
+ // if I have already entered a decimal sign I stop.
5526
+ if (value == decChar && strVal.includes(decChar))
5527
+ return;
5528
+ // if the text field contains the maximum number entered, excluding the comma, I stop.
5529
+ if (options.maxLength &&
5530
+ strVal.replace(decChar, '').length == options.maxLength)
5531
+ return;
5532
+ // if a maximum number of integers is required, and I don't have the comma, I check to be right with the values.
5533
+ if (options.maxIntegers &&
5534
+ value != decChar &&
5535
+ !strVal.includes(decChar) &&
5536
+ strVal.length == options.maxIntegers)
5537
+ return;
5538
+ // if a maximum number of decimals has been requested, check where we are.
5539
+ if (options.maxDecimals &&
5540
+ strVal.includes(decChar) &&
5541
+ strVal.substring(strVal.indexOf(decChar) + 1).length ==
5542
+ options.maxDecimals)
5543
+ return;
5544
+ // if the maximum number of decimals in JS has been reached, I stop.
5545
+ if (strVal.includes(decChar) &&
5546
+ strVal.substring(strVal.indexOf(decChar) + 1).length == 14)
5547
+ return;
5548
+ strVal += value;
5549
+ el.kupData.value = strVal;
5550
+ el.kupData.localeValue = dom$2.ketchup.math.numbers.toLocaleString(strVal);
5551
+ component.refresh();
5552
+ }
5553
+ function clearValue(component) {
5554
+ const el = component.rootElement;
5555
+ el.kupData.value = null;
5556
+ el.kupData.localeValue = '';
5557
+ component.refresh();
5558
+ }
5559
+ function getDecimalChar() {
5560
+ return (0.1).toLocaleString(dom$2.ketchup.math.locale).substring(1, 2);
5561
+ }
5562
+ function saveValue(component) {
5563
+ const el = component.rootElement;
5564
+ component.onKupClick(component.rootElement.id, el.kupData.value ? Number(el.kupData.value).toString() : '');
5565
+ }
5566
+
8260
5567
  /**
8261
5568
  * 1st built-in layout, calendar view.
8262
5569
  * @param {KupCard} component - Card component.
@@ -8289,14 +5596,24 @@ function create3$3(component) {
8289
5596
  */
8290
5597
  function create4$3(component) {
8291
5598
  return (index.h("div", { class: `built-in-layout-${component.layoutNumber} ${kupManager.KupCardCSSClasses.BUILT_IN_CARD}` }));
5599
+ }
5600
+ /**
5601
+ * 5th built-in layout, numeric picker.
5602
+ * This layout is rendered after the render cycle completes.
5603
+ * @param {KupCard} component - Card component.
5604
+ * @returns {VNode} 4th built-in layout virtual node.
5605
+ */
5606
+ function create5$3(component) {
5607
+ return (index.h("div", { class: `built-in-layout-${component.layoutNumber} ${kupManager.KupCardCSSClasses.BUILT_IN_CARD}` }, prepareNumeric(component)));
8292
5608
  }
8293
5609
 
8294
5610
  const builtInLayouts = /*#__PURE__*/Object.freeze({
8295
- __proto__: null,
8296
- create1: create1$5,
8297
- create2: create2$5,
8298
- create3: create3$3,
8299
- create4: create4$3
5611
+ __proto__: null,
5612
+ create1: create1$5,
5613
+ create2: create2$5,
5614
+ create3: create3$3,
5615
+ create4: create4$3,
5616
+ create5: create5$3
8300
5617
  });
8301
5618
 
8302
5619
  /**
@@ -8596,9 +5913,9 @@ function create2$4(component) {
8596
5913
  }
8597
5914
 
8598
5915
  const collapsibleLayouts = /*#__PURE__*/Object.freeze({
8599
- __proto__: null,
8600
- create1: create1$4,
8601
- create2: create2$4
5916
+ __proto__: null,
5917
+ create1: create1$4,
5918
+ create2: create2$4
8602
5919
  });
8603
5920
 
8604
5921
  const dom$1 = document.documentElement;
@@ -8830,13 +6147,13 @@ function getVisibleColumn(data) {
8830
6147
  }
8831
6148
 
8832
6149
  const dialogLayouts = /*#__PURE__*/Object.freeze({
8833
- __proto__: null,
8834
- create1: create1$3,
8835
- create2: create2$3,
8836
- create3: create3$2,
8837
- create4: create4$2,
8838
- create5: create5$2,
8839
- create6: create6$2
6150
+ __proto__: null,
6151
+ create1: create1$3,
6152
+ create2: create2$3,
6153
+ create3: create3$2,
6154
+ create4: create4$2,
6155
+ create5: create5$2,
6156
+ create6: create6$2
8840
6157
  });
8841
6158
 
8842
6159
  /**
@@ -8861,9 +6178,9 @@ function create2$2(component) {
8861
6178
  }
8862
6179
 
8863
6180
  const freeLayouts = /*#__PURE__*/Object.freeze({
8864
- __proto__: null,
8865
- create1: create1$2,
8866
- create2: create2$2
6181
+ __proto__: null,
6182
+ create1: create1$2,
6183
+ create2: create2$2
8867
6184
  });
8868
6185
 
8869
6186
  /**
@@ -9128,15 +6445,15 @@ function create8$1(component) {
9128
6445
  }
9129
6446
 
9130
6447
  const scalableLayouts = /*#__PURE__*/Object.freeze({
9131
- __proto__: null,
9132
- create1: create1$1,
9133
- create2: create2$1,
9134
- create3: create3$1,
9135
- create4: create4$1,
9136
- create5: create5$1,
9137
- create6: create6$1,
9138
- create7: create7$1,
9139
- create8: create8$1
6448
+ __proto__: null,
6449
+ create1: create1$1,
6450
+ create2: create2$1,
6451
+ create3: create3$1,
6452
+ create4: create4$1,
6453
+ create5: create5$1,
6454
+ create6: create6$1,
6455
+ create7: create7$1,
6456
+ create8: create8$1
9140
6457
  });
9141
6458
 
9142
6459
  /**
@@ -9898,22 +7215,22 @@ function create15(component) {
9898
7215
  }
9899
7216
 
9900
7217
  const standardLayouts = /*#__PURE__*/Object.freeze({
9901
- __proto__: null,
9902
- create1: create1,
9903
- create2: create2,
9904
- create3: create3,
9905
- create4: create4,
9906
- create5: create5,
9907
- create6: create6,
9908
- create7: create7,
9909
- create8: create8,
9910
- create9: create9,
9911
- create10: create10,
9912
- create11: create11,
9913
- create12: create12,
9914
- create13: create13,
9915
- create14: create14,
9916
- create15: create15
7218
+ __proto__: null,
7219
+ create1: create1,
7220
+ create2: create2,
7221
+ create3: create3,
7222
+ create4: create4,
7223
+ create5: create5,
7224
+ create6: create6,
7225
+ create7: create7,
7226
+ create8: create8,
7227
+ create9: create9,
7228
+ create10: create10,
7229
+ create11: create11,
7230
+ create12: create12,
7231
+ create13: create13,
7232
+ create14: create14,
7233
+ create15: create15
9917
7234
  });
9918
7235
 
9919
7236
  /*!
@@ -10916,7 +8233,7 @@ var Picker = function () {
10916
8233
  Picker.StyleElement = style;
10917
8234
  }
10918
8235
 
10919
- 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}.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{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{outline:none;display:block;font-size:var(--kup-font-size);background:var(--kup-background-color);color:var(--kup-text-color);box-shadow:var(--kup-box-shadow);border-radius:3px}.standard-layout-15 .section-1{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{font-size:1.25em;padding:0 0.25em 0.25em;text-align:left}.standard-layout-15 .section-1 .title .label{cursor:pointer;padding-right:0.25em}.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{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%;padding:1.25em}.standard-layout-15 .section-2 .detail-row{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}.standard-layout-15 .section-2 .detail-row__value{color:var(--kup-text-color);font-size:120%;max-width:320px}.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;display:inline-flex}: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}";
8236
+ 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{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{outline:none;display:block;font-size:var(--kup-font-size);background:var(--kup-background-color);color:var(--kup-text-color);box-shadow:var(--kup-box-shadow);border-radius:3px}.standard-layout-15 .section-1{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{font-size:1.25em;padding:0 0.25em 0.25em;text-align:left}.standard-layout-15 .section-1 .title .label{cursor:pointer;padding-right:0.25em}.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{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%;padding:1.25em}.standard-layout-15 .section-2 .detail-row{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}.standard-layout-15 .section-2 .detail-row__value{color:var(--kup-text-color);font-size:120%;max-width:320px}.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;display:inline-flex}: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}";
10920
8237
 
10921
8238
  const KupCard = class {
10922
8239
  constructor(hostRef) {
@@ -11257,6 +8574,7 @@ const KupCard = class {
11257
8574
  root.addEventListener('kup-timepicker-textfieldsubmit', this.cardEvent);
11258
8575
  root.addEventListener('kup-tree-dynamicmassexpansion', this.cardEvent);
11259
8576
  root.addEventListener('kup-tree-buttonclick', this.cardEvent);
8577
+ root.addEventListener('kup-tree-didunload', this.cardEvent);
11260
8578
  root.addEventListener('kup-tree-nodecollapse', this.cardEvent);
11261
8579
  root.addEventListener('kup-tree-nodedblclick', this.cardEvent);
11262
8580
  root.addEventListener('kup-tree-nodeexpand', this.cardEvent);
@@ -12637,7 +9955,7 @@ const KupColorPicker = class {
12637
9955
  else {
12638
9956
  value = this.value;
12639
9957
  }
12640
- return (index.h(fCell.FTextField, Object.assign({}, textfieldProps, { disabled: this.disabled, fullHeight: this.rootElement.classList.contains('kup-full-height')
9958
+ return (index.h(fTextField.FTextField, Object.assign({}, textfieldProps, { disabled: this.disabled, fullHeight: this.rootElement.classList.contains('kup-full-height')
12641
9959
  ? true
12642
9960
  : false, fullWidth: this.rootElement.classList.contains('kup-full-width')
12643
9961
  ? true
@@ -12686,7 +10004,7 @@ const KupColorPicker = class {
12686
10004
  if (root) {
12687
10005
  this.textfieldEl = root.querySelector('.f-text-field');
12688
10006
  if (this.textfieldEl) {
12689
- FTextFieldMDC(this.textfieldEl);
10007
+ fTextFieldMdc.FTextFieldMDC(this.textfieldEl);
12690
10008
  }
12691
10009
  }
12692
10010
  this.kupManager.debug.logRender(this, true);
@@ -13024,7 +10342,7 @@ const KupCombobox = class {
13024
10342
  if (f) {
13025
10343
  __classPrivateFieldSet$1(this, _KupCombobox_textfieldWrapper, f, "f");
13026
10344
  __classPrivateFieldSet$1(this, _KupCombobox_textfieldEl, f.querySelector('input'), "f");
13027
- FTextFieldMDC(f);
10345
+ fTextFieldMdc.FTextFieldMDC(f);
13028
10346
  }
13029
10347
  }
13030
10348
  __classPrivateFieldGet$1(this, _KupCombobox_kupManager, "f").debug.logRender(this, true);
@@ -13032,7 +10350,7 @@ const KupCombobox = class {
13032
10350
  render() {
13033
10351
  const fullHeight = this.rootElement.classList.contains('kup-full-height');
13034
10352
  const fullWidth = this.rootElement.classList.contains('kup-full-width');
13035
- return (index.h(index.Host, { class: `${fullHeight ? 'kup-full-height' : ''} ${fullWidth ? 'kup-full-width' : ''}`, style: __classPrivateFieldGet$1(this, _KupCombobox_elStyle, "f") }, index.h("style", null, __classPrivateFieldGet$1(this, _KupCombobox_kupManager, "f").theme.setKupStyle(this.rootElement)), index.h("div", { id: GenericVariables.componentWrapperId, style: __classPrivateFieldGet$1(this, _KupCombobox_elStyle, "f") }, index.h(fCell.FTextField, Object.assign({}, this.data['kup-text-field'], { disabled: this.disabled, fullHeight: fullHeight, fullWidth: fullWidth, icon: this.showDropDownIcon
10353
+ return (index.h(index.Host, { class: `${fullHeight ? 'kup-full-height' : ''} ${fullWidth ? 'kup-full-width' : ''}`, style: __classPrivateFieldGet$1(this, _KupCombobox_elStyle, "f") }, index.h("style", null, __classPrivateFieldGet$1(this, _KupCombobox_kupManager, "f").theme.setKupStyle(this.rootElement)), index.h("div", { id: GenericVariables.componentWrapperId, style: __classPrivateFieldGet$1(this, _KupCombobox_elStyle, "f") }, index.h(fTextField.FTextField, Object.assign({}, this.data['kup-text-field'], { disabled: this.disabled, fullHeight: fullHeight, fullWidth: fullWidth, icon: this.showDropDownIcon
13036
10354
  ? kupManager.KupThemeIconValues.DROPDOWN
13037
10355
  : null, readOnly: this.isSelect, trailingIcon: true, value: this.displayedValue, onBlur: () => this.onKupBlur(), onClick: () => this.onKupClick(), onChange: (e) => this.onKupChange(e.target.value), onFocus: () => this.onKupFocus(), onInput: () => this.onKupInput(), onIconClick: () => this.onKupIconClick() }), __classPrivateFieldGet$1(this, _KupCombobox_instances, "m", _KupCombobox_prepList).call(this)))));
13038
10356
  }
@@ -13469,7 +10787,7 @@ class KupColumnMenu {
13469
10787
  let props = [];
13470
10788
  if (comp.showFilters) {
13471
10789
  if (this.filtersColumnMenuInstance.isColumnFiltrableByInterval(column)) {
13472
- props.concat(this.prepIntervalTextfield(comp, column));
10790
+ props = props.concat(this.prepIntervalTextfield(comp, column));
13473
10791
  }
13474
10792
  else if (dom.ketchup.objects.isStringObject(column.obj)) {
13475
10793
  let filterInitialValue = this.filtersColumnMenuInstance.getTextFilterValue(comp.filters, column.name);
@@ -14488,6 +11806,12 @@ const KupDataTable = class {
14488
11806
  async getProps(descriptions) {
14489
11807
  return utils.getProps(this, kupManager.KupDataTableProps, descriptions);
14490
11808
  }
11809
+ /**
11810
+ * This method will get the selected rows of the component.
11811
+ */
11812
+ async getSelectedRows() {
11813
+ return this.selectedRows;
11814
+ }
14491
11815
  /**
14492
11816
  * Hides the given column.
14493
11817
  * @param {KupDataColumn} column - Column to hide.
@@ -14783,7 +12107,6 @@ const KupDataTable = class {
14783
12107
  this.groups = [];
14784
12108
  // update data
14785
12109
  this.data = Object.assign({}, totalsMatrixData);
14786
- // console.log(this.data);
14787
12110
  // calc totals
14788
12111
  // distinct becomes count
14789
12112
  // count becomes sum
@@ -15281,7 +12604,7 @@ const KupDataTable = class {
15281
12604
  if (root) {
15282
12605
  const fs = root.querySelectorAll('.f-text-field');
15283
12606
  for (let index = 0; index < fs.length; index++) {
15284
- FTextFieldMDC(fs[index]);
12607
+ fTextFieldMdc.FTextFieldMDC(fs[index]);
15285
12608
  }
15286
12609
  }
15287
12610
  if (this.showCustomization) {
@@ -15517,7 +12840,7 @@ const KupDataTable = class {
15517
12840
  this.detailCard.style.transform = 'translate(' + x + 'px,' + y + 'px)';
15518
12841
  this.rootElement.shadowRoot.append(this.detailCard);
15519
12842
  }
15520
- getEventDetails(path) {
12843
+ getEventDetails(path, e) {
15521
12844
  let isHeader, isBody, isFooter, td, textfield, th, tr, filterRemove;
15522
12845
  if (path) {
15523
12846
  for (let i = path.length - 1; i >= 0; i--) {
@@ -15601,6 +12924,7 @@ const KupDataTable = class {
15601
12924
  column: column ? column : null,
15602
12925
  filterRemove: filterRemove ? filterRemove : null,
15603
12926
  isGroupRow: isGroupRow,
12927
+ originalEvent: e,
15604
12928
  row: row ? row : null,
15605
12929
  td: td ? td : null,
15606
12930
  textfield: textfield ? textfield : null,
@@ -15609,7 +12933,7 @@ const KupDataTable = class {
15609
12933
  };
15610
12934
  }
15611
12935
  clickHandler(e) {
15612
- const details = this.getEventDetails(this.getEventPath(e));
12936
+ const details = this.getEventDetails(this.getEventPath(e), e);
15613
12937
  if (details.area === 'header') {
15614
12938
  if (details.th && details.column) {
15615
12939
  if (details.filterRemove) {
@@ -15648,7 +12972,7 @@ const KupDataTable = class {
15648
12972
  return details;
15649
12973
  }
15650
12974
  contextMenuHandler(e) {
15651
- const details = this.getEventDetails(this.getEventPath(e));
12975
+ const details = this.getEventDetails(this.getEventPath(e), e);
15652
12976
  if (details.area === 'header') {
15653
12977
  if (details.th && details.column) {
15654
12978
  this.openColumnMenu(details.column.name);
@@ -15678,7 +13002,7 @@ const KupDataTable = class {
15678
13002
  return details;
15679
13003
  }
15680
13004
  dblClickHandler(e) {
15681
- const details = this.getEventDetails(this.getEventPath(e));
13005
+ const details = this.getEventDetails(this.getEventPath(e), e);
15682
13006
  if (details.area === 'body') {
15683
13007
  if (this.selection == kupManager.SelectionMode.MULTIPLE) {
15684
13008
  this.resetSelectedRows();
@@ -17269,7 +14593,7 @@ const KupDataTable = class {
17269
14593
  if (this.tableHeight !== undefined || this.tableWidth !== undefined) {
17270
14594
  belowClass += ' custom-size';
17271
14595
  }
17272
- const compCreated = (index.h(index.Host, null, index.h("style", null, this.kupManager.theme.setKupStyle(this.rootElement)), index.h("div", { id: GenericVariables.componentWrapperId }, index.h("div", { class: "above-wrapper" }, this.globalFilter ? (index.h("div", { id: "global-filter" }, index.h(fCell.FTextField, { fullWidth: true, icon: kupManager.KupThemeIconValues.SEARCH, label: this.kupManager.language.translate(kupManager.KupLanguageSearch.SEARCH), value: this.globalFilterValue, onInput: (event) => {
14596
+ const compCreated = (index.h(index.Host, null, index.h("style", null, this.kupManager.theme.setKupStyle(this.rootElement)), index.h("div", { id: GenericVariables.componentWrapperId }, index.h("div", { class: "above-wrapper" }, this.globalFilter ? (index.h("div", { id: "global-filter" }, index.h(fTextField.FTextField, { fullWidth: true, icon: kupManager.KupThemeIconValues.SEARCH, label: this.kupManager.language.translate(kupManager.KupLanguageSearch.SEARCH), value: this.globalFilterValue, onInput: (event) => {
17273
14597
  const t = event.target;
17274
14598
  window.clearTimeout(this.globalFilterTimeout);
17275
14599
  this.globalFilterTimeout =
@@ -17652,7 +14976,7 @@ const KupDatePicker = class {
17652
14976
  if (textfieldData.icon) {
17653
14977
  textfieldData.trailingIcon = true;
17654
14978
  }
17655
- return (index.h(fCell.FTextField, Object.assign({}, textfieldData, { disabled: this.disabled, fullHeight: fullHeight, fullWidth: fullWidth, id: this.rootElement.id + '_text-field', value: initialValue, onBlur: () => this.onKupBlur(), onChange: (e) => this.onKupChange(e), onClearIconClick: () => this.onKupClearIconClick(), onClick: () => this.onKupClick(), onFocus: () => this.onKupFocus(), onIconClick: () => this.onKupIconClick(), onKeyDown: (e) => this.onkupTextFieldSubmit(e), onInput: (e) => this.onKupInput(e) }), this.prepDatePicker()));
14979
+ return (index.h(fTextField.FTextField, Object.assign({}, textfieldData, { disabled: this.disabled, fullHeight: fullHeight, fullWidth: fullWidth, id: this.rootElement.id + '_text-field', value: initialValue, onBlur: () => this.onKupBlur(), onChange: (e) => this.onKupChange(e), onClearIconClick: () => this.onKupClearIconClick(), onClick: () => this.onKupClick(), onFocus: () => this.onKupFocus(), onIconClick: () => this.onKupIconClick(), onKeyDown: (e) => this.onkupTextFieldSubmit(e), onInput: (e) => this.onKupInput(e) }), this.prepDatePicker()));
17656
14980
  }
17657
14981
  getInitEndYear(curYear) {
17658
14982
  let initYear = curYear - (curYear % 10);
@@ -17681,7 +15005,7 @@ const KupDatePicker = class {
17681
15005
  resetStatus: true,
17682
15006
  },
17683
15007
  };
17684
- return (index.h("kup-card", { ref: (el) => (this.pickerContainerEl = el), data: data, layoutFamily: kupManager.KupCardFamily.BUILT_IN, sizeX: "300px", sizeY: "300px", isMenu: true, "onkup-card-click": (ev) => {
15008
+ return (index.h("kup-card", { ref: (el) => (this.pickerContainerEl = el), data: data, layoutFamily: kupManager.KupCardFamily.BUILT_IN, sizeX: "300px", sizeY: "auto", isMenu: true, "onkup-card-click": (ev) => {
17685
15009
  if (ev.detail.value != null && ev.detail.value != '')
17686
15010
  this.onKupDatePickerItemClick(ev.detail.value);
17687
15011
  } }));
@@ -17720,7 +15044,7 @@ const KupDatePicker = class {
17720
15044
  const f = root.querySelector('.f-text-field');
17721
15045
  if (f) {
17722
15046
  this.textfieldEl = f.querySelector('input');
17723
- FTextFieldMDC(f);
15047
+ fTextFieldMdc.FTextFieldMDC(f);
17724
15048
  }
17725
15049
  }
17726
15050
  this.kupManager.debug.logRender(this, true);
@@ -21467,7 +18791,7 @@ const KupTextField = class {
21467
18791
  if (inputEl) {
21468
18792
  this.inputEl = inputEl;
21469
18793
  }
21470
- FTextFieldMDC(f);
18794
+ fTextFieldMdc.FTextFieldMDC(f);
21471
18795
  }
21472
18796
  }
21473
18797
  this.kupManager.debug.logRender(this, true);
@@ -21524,7 +18848,7 @@ const KupTextField = class {
21524
18848
  onIconClick: (e) => this.onKupIconClick(e),
21525
18849
  onClearIconClick: () => this.onKupClearIconClick(),
21526
18850
  };
21527
- return (index.h(index.Host, null, index.h("style", null, this.kupManager.theme.setKupStyle(this.rootElement)), index.h("div", { id: GenericVariables.componentWrapperId }, index.h(fCell.FTextField, Object.assign({}, props)))));
18851
+ return (index.h(index.Host, null, index.h("style", null, this.kupManager.theme.setKupStyle(this.rootElement)), index.h("div", { id: GenericVariables.componentWrapperId }, index.h(fTextField.FTextField, Object.assign({}, props)))));
21528
18852
  }
21529
18853
  disconnectedCallback() {
21530
18854
  this.kupManager.theme.unregister(this);
@@ -21880,7 +19204,7 @@ const KupTimePicker = class {
21880
19204
  if (textfieldData.icon) {
21881
19205
  textfieldData.trailingIcon = true;
21882
19206
  }
21883
- let comp = (index.h(fCell.FTextField, Object.assign({}, textfieldData, { disabled: this.disabled, fullHeight: fullHeight, fullWidth: fullWidth, id: this.rootElement.id + '_text-field', value: initialValue, onChange: (e) => this.onKupChange(e), onClick: () => this.onKupClick(), onFocus: () => this.onKupFocus(), onInput: (e) => this.onKupInput(e), onIconClick: () => this.onKupIconClick(), onKeyDown: (e) => this.onKupTextFieldSubmit(e), onClearIconClick: () => this.onKupClearIconClick() }), this.prepTimePicker()));
19207
+ let comp = (index.h(fTextField.FTextField, Object.assign({}, textfieldData, { disabled: this.disabled, fullHeight: fullHeight, fullWidth: fullWidth, id: this.rootElement.id + '_text-field', value: initialValue, onChange: (e) => this.onKupChange(e), onClick: () => this.onKupClick(), onFocus: () => this.onKupFocus(), onInput: (e) => this.onKupInput(e), onIconClick: () => this.onKupIconClick(), onKeyDown: (e) => this.onKupTextFieldSubmit(e), onClearIconClick: () => this.onKupClearIconClick() }), this.prepTimePicker()));
21884
19208
  return comp;
21885
19209
  }
21886
19210
  isRelatedTargetInThisComponent(e) {
@@ -21991,7 +19315,7 @@ const KupTimePicker = class {
21991
19315
  if (f) {
21992
19316
  this.textFieldContainerEl = f;
21993
19317
  this.textfieldEl = f.querySelector('input');
21994
- FTextFieldMDC(f);
19318
+ fTextFieldMdc.FTextFieldMDC(f);
21995
19319
  }
21996
19320
  }
21997
19321
  this.kupManager.debug.logRender(this, true);