@descope/web-components-ui 1.0.246 → 1.0.248
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/cjs/index.cjs.js +877 -658
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/index.d.ts +2 -1
- package/dist/index.esm.js +994 -769
- package/dist/index.esm.js.map +1 -1
- package/dist/umd/1000.js +1 -1
- package/dist/umd/9214.js +1 -0
- package/dist/umd/9434.js +1 -0
- package/dist/umd/button-selection-group-fields-descope-button-multi-selection-group-index-js.js +1 -0
- package/dist/umd/button-selection-group-fields-descope-button-multi-selection-group-internal-index-js.js +1 -0
- package/dist/umd/button-selection-group-fields-descope-button-selection-group-index-js.js +1 -0
- package/dist/umd/button-selection-group-fields-descope-button-selection-group-internal-index-js.js +1 -0
- package/dist/umd/button-selection-group-fields-descope-button-selection-group-item-index-js.js +1 -0
- package/dist/umd/index.js +1 -1
- package/package.json +1 -1
- package/src/components/{descope-button-selection-group/ButtonSelectionGroupClass.js → button-selection-group-fields/baseButtonSelectionGroup.js} +19 -70
- package/src/components/button-selection-group-fields/createBaseButtonSelectionGroupInternalClass.js +101 -0
- package/src/components/button-selection-group-fields/descope-button-multi-selection-group/ButtonMultiSelectionGroupClass.js +67 -0
- package/src/components/button-selection-group-fields/descope-button-multi-selection-group/index.js +7 -0
- package/src/components/button-selection-group-fields/descope-button-multi-selection-group-internal/ButtonMultiSelectionGroupInternalClass.js +106 -0
- package/src/components/button-selection-group-fields/descope-button-multi-selection-group-internal/index.js +8 -0
- package/src/components/button-selection-group-fields/descope-button-selection-group/ButtonSelectionGroupClass.js +67 -0
- package/src/components/{descope-button-selection-group → button-selection-group-fields/descope-button-selection-group}/index.js +2 -2
- package/src/components/button-selection-group-fields/descope-button-selection-group-internal/ButtonSelectionGroupInternalClass.js +77 -0
- package/src/index.cjs.js +3 -2
- package/src/index.d.ts +2 -1
- package/src/index.js +3 -1
- package/src/mixins/inputValidationMixin.js +2 -2
- package/src/theme/components/buttonSelectionGroup/baseButtonSelectionGroup.js +15 -0
- package/src/theme/components/buttonSelectionGroup/buttonMultiSelectionGroup.js +11 -0
- package/src/theme/components/buttonSelectionGroup/buttonSelectionGroup.js +3 -12
- package/src/theme/components/buttonSelectionGroup/buttonSelectionGroupItem.js +1 -1
- package/src/theme/components/index.js +2 -0
- package/dist/umd/descope-button-selection-group-descope-button-selection-group-internal-index-js.js +0 -1
- package/dist/umd/descope-button-selection-group-descope-button-selection-group-item-index-js.js +0 -1
- package/dist/umd/descope-button-selection-group-index-js.js +0 -1
- package/src/components/descope-button-selection-group/descope-button-selection-group-internal/ButtonSelectionGroupInternalClass.js +0 -145
- /package/src/components/{descope-button-selection-group → button-selection-group-fields}/descope-button-selection-group-internal/index.js +0 -0
- /package/src/components/{descope-button-selection-group → button-selection-group-fields}/descope-button-selection-group-item/ButtonSelectionGroupItemClass.js +0 -0
- /package/src/components/{descope-button-selection-group → button-selection-group-fields}/descope-button-selection-group-item/index.js +0 -0
package/dist/index.esm.js
CHANGED
@@ -11,6 +11,7 @@ import '@vaadin/grid';
|
|
11
11
|
import { GridSortColumn } from '@vaadin/grid/vaadin-grid-sort-column';
|
12
12
|
import { GridSelectionColumn } from '@vaadin/grid/vaadin-grid-selection-column';
|
13
13
|
import '@vaadin/multi-select-combo-box';
|
14
|
+
import '@vaadin/dialog';
|
14
15
|
import merge from 'lodash.merge';
|
15
16
|
import set from 'lodash.set';
|
16
17
|
import Color from 'color';
|
@@ -761,11 +762,11 @@ const inputValidationMixin = (superclass) =>
|
|
761
762
|
}
|
762
763
|
|
763
764
|
get defaultErrorMsgRangeUnderflow() {
|
764
|
-
return `At least ${this.
|
765
|
+
return `At least ${this.getAttribute('min-items-selection')} items are required.`;
|
765
766
|
}
|
766
767
|
|
767
768
|
get defaultErrorMsgRangeOverflow() {
|
768
|
-
return `At most ${this.
|
769
|
+
return `At most ${this.getAttribute('max-items-selection')} items are allowed.`;
|
769
770
|
}
|
770
771
|
|
771
772
|
getErrorMessage(flags) {
|
@@ -1258,7 +1259,7 @@ const clickableMixin = (superclass) =>
|
|
1258
1259
|
}
|
1259
1260
|
};
|
1260
1261
|
|
1261
|
-
const componentName$
|
1262
|
+
const componentName$G = getComponentName('button');
|
1262
1263
|
|
1263
1264
|
const resetStyles = `
|
1264
1265
|
:host {
|
@@ -1359,7 +1360,7 @@ const ButtonClass = compose(
|
|
1359
1360
|
}
|
1360
1361
|
`,
|
1361
1362
|
excludeAttrsSync: ['tabindex'],
|
1362
|
-
componentName: componentName$
|
1363
|
+
componentName: componentName$G,
|
1363
1364
|
})
|
1364
1365
|
);
|
1365
1366
|
|
@@ -1396,7 +1397,7 @@ loadingIndicatorStyles = `
|
|
1396
1397
|
}
|
1397
1398
|
`;
|
1398
1399
|
|
1399
|
-
customElements.define(componentName$
|
1400
|
+
customElements.define(componentName$G, ButtonClass);
|
1400
1401
|
|
1401
1402
|
const createBaseInputClass = (...args) =>
|
1402
1403
|
compose(
|
@@ -1406,11 +1407,11 @@ const createBaseInputClass = (...args) =>
|
|
1406
1407
|
inputEventsDispatchingMixin
|
1407
1408
|
)(createBaseClass(...args));
|
1408
1409
|
|
1409
|
-
const componentName$
|
1410
|
+
const componentName$F = getComponentName('boolean-field-internal');
|
1410
1411
|
|
1411
1412
|
const forwardAttributes$1 = ['disabled', 'label', 'invalid', 'readonly'];
|
1412
1413
|
|
1413
|
-
const BaseInputClass$5 = createBaseInputClass({ componentName: componentName$
|
1414
|
+
const BaseInputClass$5 = createBaseInputClass({ componentName: componentName$F, baseSelector: 'div' });
|
1414
1415
|
|
1415
1416
|
class BooleanInputInternal extends BaseInputClass$5 {
|
1416
1417
|
static get observedAttributes() {
|
@@ -1486,14 +1487,14 @@ const booleanFieldMixin = (superclass) =>
|
|
1486
1487
|
|
1487
1488
|
const template = document.createElement('template');
|
1488
1489
|
template.innerHTML = `
|
1489
|
-
<${componentName$
|
1490
|
+
<${componentName$F}
|
1490
1491
|
tabindex="-1"
|
1491
1492
|
slot="input"
|
1492
|
-
></${componentName$
|
1493
|
+
></${componentName$F}>
|
1493
1494
|
`;
|
1494
1495
|
|
1495
1496
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
1496
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
1497
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$F);
|
1497
1498
|
this.checkbox = this.inputElement.querySelector('vaadin-checkbox');
|
1498
1499
|
|
1499
1500
|
forwardAttrs(this, this.inputElement, {
|
@@ -1692,7 +1693,7 @@ descope-boolean-field-internal {
|
|
1692
1693
|
}
|
1693
1694
|
`;
|
1694
1695
|
|
1695
|
-
const componentName$
|
1696
|
+
const componentName$E = getComponentName('checkbox');
|
1696
1697
|
|
1697
1698
|
const {
|
1698
1699
|
host: host$g,
|
@@ -1798,15 +1799,15 @@ const CheckboxClass = compose(
|
|
1798
1799
|
}
|
1799
1800
|
`,
|
1800
1801
|
excludeAttrsSync: ['label', 'tabindex'],
|
1801
|
-
componentName: componentName$
|
1802
|
+
componentName: componentName$E,
|
1802
1803
|
})
|
1803
1804
|
);
|
1804
1805
|
|
1805
|
-
customElements.define(componentName$
|
1806
|
+
customElements.define(componentName$F, BooleanInputInternal);
|
1806
1807
|
|
1807
|
-
customElements.define(componentName$
|
1808
|
+
customElements.define(componentName$E, CheckboxClass);
|
1808
1809
|
|
1809
|
-
const componentName$
|
1810
|
+
const componentName$D = getComponentName('switch-toggle');
|
1810
1811
|
|
1811
1812
|
const {
|
1812
1813
|
host: host$f,
|
@@ -1938,17 +1939,17 @@ const SwitchToggleClass = compose(
|
|
1938
1939
|
}
|
1939
1940
|
`,
|
1940
1941
|
excludeAttrsSync: ['label', 'tabindex'],
|
1941
|
-
componentName: componentName$
|
1942
|
+
componentName: componentName$D,
|
1942
1943
|
})
|
1943
1944
|
);
|
1944
1945
|
|
1945
|
-
customElements.define(componentName$
|
1946
|
+
customElements.define(componentName$D, SwitchToggleClass);
|
1946
1947
|
|
1947
|
-
const componentName$
|
1948
|
+
const componentName$C = getComponentName('loader-linear');
|
1948
1949
|
|
1949
|
-
class RawLoaderLinear extends createBaseClass({ componentName: componentName$
|
1950
|
+
class RawLoaderLinear extends createBaseClass({ componentName: componentName$C, baseSelector: ':host > div' }) {
|
1950
1951
|
static get componentName() {
|
1951
|
-
return componentName$
|
1952
|
+
return componentName$C;
|
1952
1953
|
}
|
1953
1954
|
|
1954
1955
|
constructor() {
|
@@ -2009,11 +2010,11 @@ const LoaderLinearClass = compose(
|
|
2009
2010
|
componentNameValidationMixin
|
2010
2011
|
)(RawLoaderLinear);
|
2011
2012
|
|
2012
|
-
customElements.define(componentName$
|
2013
|
+
customElements.define(componentName$C, LoaderLinearClass);
|
2013
2014
|
|
2014
|
-
const componentName$
|
2015
|
+
const componentName$B = getComponentName('loader-radial');
|
2015
2016
|
|
2016
|
-
class RawLoaderRadial extends createBaseClass({ componentName: componentName$
|
2017
|
+
class RawLoaderRadial extends createBaseClass({ componentName: componentName$B, baseSelector: ':host > div' }) {
|
2017
2018
|
constructor() {
|
2018
2019
|
super();
|
2019
2020
|
|
@@ -2057,11 +2058,11 @@ const LoaderRadialClass = compose(
|
|
2057
2058
|
componentNameValidationMixin
|
2058
2059
|
)(RawLoaderRadial);
|
2059
2060
|
|
2060
|
-
customElements.define(componentName$
|
2061
|
+
customElements.define(componentName$B, LoaderRadialClass);
|
2061
2062
|
|
2062
|
-
const componentName$
|
2063
|
+
const componentName$A = getComponentName('container');
|
2063
2064
|
|
2064
|
-
class RawContainer extends createBaseClass({ componentName: componentName$
|
2065
|
+
class RawContainer extends createBaseClass({ componentName: componentName$A, baseSelector: 'slot' }) {
|
2065
2066
|
constructor() {
|
2066
2067
|
super();
|
2067
2068
|
|
@@ -2113,13 +2114,13 @@ const ContainerClass = compose(
|
|
2113
2114
|
componentNameValidationMixin
|
2114
2115
|
)(RawContainer);
|
2115
2116
|
|
2116
|
-
customElements.define(componentName$
|
2117
|
+
customElements.define(componentName$A, ContainerClass);
|
2117
2118
|
|
2118
2119
|
// eslint-disable-next-line max-classes-per-file
|
2119
2120
|
|
2120
|
-
const componentName$
|
2121
|
+
const componentName$z = getComponentName('text');
|
2121
2122
|
|
2122
|
-
class RawText extends createBaseClass({ componentName: componentName$
|
2123
|
+
class RawText extends createBaseClass({ componentName: componentName$z, baseSelector: ':host > slot' }) {
|
2123
2124
|
constructor() {
|
2124
2125
|
super();
|
2125
2126
|
|
@@ -2179,8 +2180,8 @@ const TextClass = compose(
|
|
2179
2180
|
customTextMixin
|
2180
2181
|
)(RawText);
|
2181
2182
|
|
2182
|
-
const componentName$
|
2183
|
-
class RawDivider extends createBaseClass({ componentName: componentName$
|
2183
|
+
const componentName$y = getComponentName('divider');
|
2184
|
+
class RawDivider extends createBaseClass({ componentName: componentName$y, baseSelector: ':host > div' }) {
|
2184
2185
|
constructor() {
|
2185
2186
|
super();
|
2186
2187
|
|
@@ -2279,9 +2280,9 @@ const DividerClass = compose(
|
|
2279
2280
|
componentNameValidationMixin
|
2280
2281
|
)(RawDivider);
|
2281
2282
|
|
2282
|
-
customElements.define(componentName$
|
2283
|
+
customElements.define(componentName$z, TextClass);
|
2283
2284
|
|
2284
|
-
customElements.define(componentName$
|
2285
|
+
customElements.define(componentName$y, DividerClass);
|
2285
2286
|
|
2286
2287
|
const { host: host$c, label: label$9, placeholder: placeholder$3, requiredIndicator: requiredIndicator$9, inputField: inputField$6, input, helperText: helperText$7, errorMessage: errorMessage$9 } =
|
2287
2288
|
{
|
@@ -2338,9 +2339,9 @@ var textFieldMappings = {
|
|
2338
2339
|
inputPlaceholderColor: { ...placeholder$3, property: 'color' },
|
2339
2340
|
};
|
2340
2341
|
|
2341
|
-
const componentName$
|
2342
|
+
const componentName$x = getComponentName('email-field');
|
2342
2343
|
|
2343
|
-
const customMixin$
|
2344
|
+
const customMixin$6 = (superclass) =>
|
2344
2345
|
class EmailFieldMixinClass extends superclass {
|
2345
2346
|
init() {
|
2346
2347
|
super.init?.();
|
@@ -2354,7 +2355,7 @@ const EmailFieldClass = compose(
|
|
2354
2355
|
draggableMixin,
|
2355
2356
|
composedProxyInputMixin({ proxyProps: ['value', 'selectionStart'] }),
|
2356
2357
|
componentNameValidationMixin,
|
2357
|
-
customMixin$
|
2358
|
+
customMixin$6
|
2358
2359
|
)(
|
2359
2360
|
createProxy({
|
2360
2361
|
slots: ['', 'suffix'],
|
@@ -2373,15 +2374,15 @@ const EmailFieldClass = compose(
|
|
2373
2374
|
${resetInputOverrides('vaadin-email-field', EmailFieldClass.cssVarList)}
|
2374
2375
|
`,
|
2375
2376
|
excludeAttrsSync: ['tabindex'],
|
2376
|
-
componentName: componentName$
|
2377
|
+
componentName: componentName$x,
|
2377
2378
|
})
|
2378
2379
|
);
|
2379
2380
|
|
2380
|
-
customElements.define(componentName$
|
2381
|
+
customElements.define(componentName$x, EmailFieldClass);
|
2381
2382
|
|
2382
|
-
const componentName$
|
2383
|
+
const componentName$w = getComponentName('link');
|
2383
2384
|
|
2384
|
-
class RawLink extends createBaseClass({ componentName: componentName$
|
2385
|
+
class RawLink extends createBaseClass({ componentName: componentName$w, baseSelector: ':host a' }) {
|
2385
2386
|
constructor() {
|
2386
2387
|
super();
|
2387
2388
|
|
@@ -2446,7 +2447,7 @@ const LinkClass = compose(
|
|
2446
2447
|
componentNameValidationMixin
|
2447
2448
|
)(RawLink);
|
2448
2449
|
|
2449
|
-
customElements.define(componentName$
|
2450
|
+
customElements.define(componentName$w, LinkClass);
|
2450
2451
|
|
2451
2452
|
const createCssVarImageClass = ({ componentName, varName, fallbackVarName }) => {
|
2452
2453
|
let style;
|
@@ -2498,27 +2499,27 @@ const createCssVarImageClass = ({ componentName, varName, fallbackVarName }) =>
|
|
2498
2499
|
return CssVarImageClass;
|
2499
2500
|
};
|
2500
2501
|
|
2501
|
-
const componentName$
|
2502
|
+
const componentName$v = getComponentName('logo');
|
2502
2503
|
|
2503
2504
|
const LogoClass = createCssVarImageClass({
|
2504
|
-
componentName: componentName$
|
2505
|
+
componentName: componentName$v,
|
2505
2506
|
varName: 'url',
|
2506
2507
|
fallbackVarName: 'fallbackUrl',
|
2507
2508
|
});
|
2508
2509
|
|
2509
|
-
customElements.define(componentName$
|
2510
|
+
customElements.define(componentName$v, LogoClass);
|
2510
2511
|
|
2511
|
-
const componentName$
|
2512
|
+
const componentName$u = getComponentName('totp-image');
|
2512
2513
|
|
2513
2514
|
const TotpImageClass = createCssVarImageClass({
|
2514
|
-
componentName: componentName$
|
2515
|
+
componentName: componentName$u,
|
2515
2516
|
varName: 'url',
|
2516
2517
|
fallbackVarName: 'fallbackUrl',
|
2517
2518
|
});
|
2518
2519
|
|
2519
|
-
customElements.define(componentName$
|
2520
|
+
customElements.define(componentName$u, TotpImageClass);
|
2520
2521
|
|
2521
|
-
const componentName$
|
2522
|
+
const componentName$t = getComponentName('number-field');
|
2522
2523
|
|
2523
2524
|
const NumberFieldClass = compose(
|
2524
2525
|
createStyleMixin({
|
@@ -2544,11 +2545,11 @@ const NumberFieldClass = compose(
|
|
2544
2545
|
${resetInputOverrides('vaadin-number-field', NumberFieldClass.cssVarList)}
|
2545
2546
|
`,
|
2546
2547
|
excludeAttrsSync: ['tabindex'],
|
2547
|
-
componentName: componentName$
|
2548
|
+
componentName: componentName$t,
|
2548
2549
|
})
|
2549
2550
|
);
|
2550
2551
|
|
2551
|
-
customElements.define(componentName$
|
2552
|
+
customElements.define(componentName$t, NumberFieldClass);
|
2552
2553
|
|
2553
2554
|
const focusElement = (ele) => {
|
2554
2555
|
ele?.focus();
|
@@ -2566,13 +2567,13 @@ const getSanitizedCharacters = (str) => {
|
|
2566
2567
|
|
2567
2568
|
/* eslint-disable no-param-reassign */
|
2568
2569
|
|
2569
|
-
const componentName$
|
2570
|
+
const componentName$s = getComponentName('passcode-internal');
|
2570
2571
|
|
2571
2572
|
const observedAttributes$5 = ['digits', 'loading'];
|
2572
2573
|
|
2573
2574
|
const forwardAttributes = ['disabled', 'bordered', 'size', 'invalid', 'readonly'];
|
2574
2575
|
|
2575
|
-
const BaseInputClass$4 = createBaseInputClass({ componentName: componentName$
|
2576
|
+
const BaseInputClass$4 = createBaseInputClass({ componentName: componentName$s, baseSelector: 'div' });
|
2576
2577
|
|
2577
2578
|
class PasscodeInternal extends BaseInputClass$4 {
|
2578
2579
|
static get observedAttributes() {
|
@@ -2798,11 +2799,11 @@ class PasscodeInternal extends BaseInputClass$4 {
|
|
2798
2799
|
}
|
2799
2800
|
}
|
2800
2801
|
|
2801
|
-
const componentName$
|
2802
|
+
const componentName$r = getComponentName('text-field');
|
2802
2803
|
|
2803
2804
|
const observedAttrs = ['type'];
|
2804
2805
|
|
2805
|
-
const customMixin$
|
2806
|
+
const customMixin$5 = (superclass) =>
|
2806
2807
|
class TextFieldClass extends superclass {
|
2807
2808
|
static get observedAttributes() {
|
2808
2809
|
return observedAttrs.concat(superclass.observedAttributes || []);
|
@@ -2829,7 +2830,7 @@ const TextFieldClass = compose(
|
|
2829
2830
|
draggableMixin,
|
2830
2831
|
composedProxyInputMixin({ proxyProps: ['value', 'selectionStart'] }),
|
2831
2832
|
componentNameValidationMixin,
|
2832
|
-
customMixin$
|
2833
|
+
customMixin$5
|
2833
2834
|
)(
|
2834
2835
|
createProxy({
|
2835
2836
|
slots: ['prefix', 'suffix'],
|
@@ -2848,15 +2849,15 @@ const TextFieldClass = compose(
|
|
2848
2849
|
${resetInputOverrides('vaadin-text-field', TextFieldClass.cssVarList)}
|
2849
2850
|
`,
|
2850
2851
|
excludeAttrsSync: ['tabindex'],
|
2851
|
-
componentName: componentName$
|
2852
|
+
componentName: componentName$r,
|
2852
2853
|
})
|
2853
2854
|
);
|
2854
2855
|
|
2855
|
-
const componentName$
|
2856
|
+
const componentName$q = getComponentName('passcode');
|
2856
2857
|
|
2857
2858
|
const observedAttributes$4 = ['digits'];
|
2858
2859
|
|
2859
|
-
const customMixin$
|
2860
|
+
const customMixin$4 = (superclass) =>
|
2860
2861
|
class PasscodeMixinClass extends superclass {
|
2861
2862
|
static get observedAttributes() {
|
2862
2863
|
return observedAttributes$4.concat(superclass.observedAttributes || []);
|
@@ -2871,17 +2872,17 @@ const customMixin$5 = (superclass) =>
|
|
2871
2872
|
const template = document.createElement('template');
|
2872
2873
|
|
2873
2874
|
template.innerHTML = `
|
2874
|
-
<${componentName$
|
2875
|
+
<${componentName$s}
|
2875
2876
|
bordered="true"
|
2876
2877
|
name="code"
|
2877
2878
|
tabindex="-1"
|
2878
2879
|
slot="input"
|
2879
|
-
><slot></slot></${componentName$
|
2880
|
+
><slot></slot></${componentName$s}>
|
2880
2881
|
`;
|
2881
2882
|
|
2882
2883
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
2883
2884
|
|
2884
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
2885
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$s);
|
2885
2886
|
|
2886
2887
|
forwardAttrs(this, this.inputElement, { includeAttrs: ['digits', 'size', 'loading'] });
|
2887
2888
|
}
|
@@ -2952,7 +2953,7 @@ const PasscodeClass = compose(
|
|
2952
2953
|
draggableMixin,
|
2953
2954
|
composedProxyInputMixin({ proxyProps: ['value', 'selectionStart'] }),
|
2954
2955
|
componentNameValidationMixin,
|
2955
|
-
customMixin$
|
2956
|
+
customMixin$4
|
2956
2957
|
)(
|
2957
2958
|
createProxy({
|
2958
2959
|
slots: [],
|
@@ -3028,15 +3029,15 @@ const PasscodeClass = compose(
|
|
3028
3029
|
${resetInputCursor('vaadin-text-field')}
|
3029
3030
|
`,
|
3030
3031
|
excludeAttrsSync: ['tabindex'],
|
3031
|
-
componentName: componentName$
|
3032
|
+
componentName: componentName$q,
|
3032
3033
|
})
|
3033
3034
|
);
|
3034
3035
|
|
3035
|
-
customElements.define(componentName$
|
3036
|
+
customElements.define(componentName$r, TextFieldClass);
|
3036
3037
|
|
3037
|
-
customElements.define(componentName$
|
3038
|
+
customElements.define(componentName$s, PasscodeInternal);
|
3038
3039
|
|
3039
|
-
customElements.define(componentName$
|
3040
|
+
customElements.define(componentName$q, PasscodeClass);
|
3040
3041
|
|
3041
3042
|
const passwordDraggableMixin = (superclass) =>
|
3042
3043
|
class PasswordDraggableMixinClass extends superclass {
|
@@ -3072,7 +3073,7 @@ const passwordDraggableMixin = (superclass) =>
|
|
3072
3073
|
}
|
3073
3074
|
};
|
3074
3075
|
|
3075
|
-
const componentName$
|
3076
|
+
const componentName$p = getComponentName('password');
|
3076
3077
|
|
3077
3078
|
const {
|
3078
3079
|
host: host$9,
|
@@ -3203,13 +3204,13 @@ const PasswordClass = compose(
|
|
3203
3204
|
}
|
3204
3205
|
`,
|
3205
3206
|
excludeAttrsSync: ['tabindex'],
|
3206
|
-
componentName: componentName$
|
3207
|
+
componentName: componentName$p,
|
3207
3208
|
})
|
3208
3209
|
);
|
3209
3210
|
|
3210
|
-
customElements.define(componentName$
|
3211
|
+
customElements.define(componentName$p, PasswordClass);
|
3211
3212
|
|
3212
|
-
const componentName$
|
3213
|
+
const componentName$o = getComponentName('text-area');
|
3213
3214
|
|
3214
3215
|
const {
|
3215
3216
|
host: host$8,
|
@@ -3284,17 +3285,17 @@ const TextAreaClass = compose(
|
|
3284
3285
|
${resetInputCursor('vaadin-text-area')}
|
3285
3286
|
`,
|
3286
3287
|
excludeAttrsSync: ['tabindex'],
|
3287
|
-
componentName: componentName$
|
3288
|
+
componentName: componentName$o,
|
3288
3289
|
})
|
3289
3290
|
);
|
3290
3291
|
|
3291
|
-
customElements.define(componentName$
|
3292
|
+
customElements.define(componentName$o, TextAreaClass);
|
3292
3293
|
|
3293
3294
|
const observedAttributes$3 = ['src', 'alt'];
|
3294
3295
|
|
3295
|
-
const componentName$
|
3296
|
+
const componentName$n = getComponentName('image');
|
3296
3297
|
|
3297
|
-
const BaseClass$1 = createBaseClass({ componentName: componentName$
|
3298
|
+
const BaseClass$1 = createBaseClass({ componentName: componentName$n, baseSelector: ':host > img' });
|
3298
3299
|
class RawImage extends BaseClass$1 {
|
3299
3300
|
static get observedAttributes() {
|
3300
3301
|
return observedAttributes$3.concat(BaseClass$1.observedAttributes || []);
|
@@ -3334,9 +3335,9 @@ const ImageClass = compose(
|
|
3334
3335
|
draggableMixin
|
3335
3336
|
)(RawImage);
|
3336
3337
|
|
3337
|
-
customElements.define(componentName$
|
3338
|
+
customElements.define(componentName$n, ImageClass);
|
3338
3339
|
|
3339
|
-
const componentName$
|
3340
|
+
const componentName$m = getComponentName('combo-box');
|
3340
3341
|
|
3341
3342
|
const ComboBoxMixin = (superclass) =>
|
3342
3343
|
class ComboBoxMixinClass extends superclass {
|
@@ -3700,12 +3701,12 @@ const ComboBoxClass = compose(
|
|
3700
3701
|
// and reset items to an empty array, and opening the list box with no items
|
3701
3702
|
// to display.
|
3702
3703
|
excludeAttrsSync: ['tabindex', 'size', 'data'],
|
3703
|
-
componentName: componentName$
|
3704
|
+
componentName: componentName$m,
|
3704
3705
|
includeForwardProps: ['items', 'renderer', 'selectedItem'],
|
3705
3706
|
})
|
3706
3707
|
);
|
3707
3708
|
|
3708
|
-
customElements.define(componentName$
|
3709
|
+
customElements.define(componentName$m, ComboBoxClass);
|
3709
3710
|
|
3710
3711
|
var CountryCodes = [
|
3711
3712
|
{
|
@@ -4945,7 +4946,7 @@ const comboBoxItem = ({ code, dialCode, name: country }) => `
|
|
4945
4946
|
</div>
|
4946
4947
|
`;
|
4947
4948
|
|
4948
|
-
const componentName$
|
4949
|
+
const componentName$l = getComponentName('phone-field-internal');
|
4949
4950
|
|
4950
4951
|
const commonAttrs$1 = ['disabled', 'size', 'bordered', 'invalid', 'readonly'];
|
4951
4952
|
const countryAttrs = ['country-input-placeholder', 'default-code', 'restrict-countries'];
|
@@ -4957,7 +4958,7 @@ const mapAttrs$1 = {
|
|
4957
4958
|
|
4958
4959
|
const inputRelatedAttrs$1 = [].concat(commonAttrs$1, countryAttrs, phoneAttrs);
|
4959
4960
|
|
4960
|
-
const BaseInputClass$3 = createBaseInputClass({ componentName: componentName$
|
4961
|
+
const BaseInputClass$3 = createBaseInputClass({ componentName: componentName$l, baseSelector: 'div' });
|
4961
4962
|
|
4962
4963
|
let PhoneFieldInternal$1 = class PhoneFieldInternal extends BaseInputClass$3 {
|
4963
4964
|
static get observedAttributes() {
|
@@ -5129,14 +5130,14 @@ let PhoneFieldInternal$1 = class PhoneFieldInternal extends BaseInputClass$3 {
|
|
5129
5130
|
}
|
5130
5131
|
};
|
5131
5132
|
|
5132
|
-
customElements.define(componentName$
|
5133
|
+
customElements.define(componentName$l, PhoneFieldInternal$1);
|
5133
5134
|
|
5134
5135
|
const textVars$1 = TextFieldClass.cssVarList;
|
5135
5136
|
const comboVars = ComboBoxClass.cssVarList;
|
5136
5137
|
|
5137
|
-
const componentName$
|
5138
|
+
const componentName$k = getComponentName('phone-field');
|
5138
5139
|
|
5139
|
-
const customMixin$
|
5140
|
+
const customMixin$3 = (superclass) =>
|
5140
5141
|
class PhoneFieldMixinClass extends superclass {
|
5141
5142
|
static get CountryCodes() {
|
5142
5143
|
return CountryCodes;
|
@@ -5148,15 +5149,15 @@ const customMixin$4 = (superclass) =>
|
|
5148
5149
|
const template = document.createElement('template');
|
5149
5150
|
|
5150
5151
|
template.innerHTML = `
|
5151
|
-
<${componentName$
|
5152
|
+
<${componentName$l}
|
5152
5153
|
tabindex="-1"
|
5153
5154
|
slot="input"
|
5154
|
-
></${componentName$
|
5155
|
+
></${componentName$l}>
|
5155
5156
|
`;
|
5156
5157
|
|
5157
5158
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
5158
5159
|
|
5159
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
5160
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$l);
|
5160
5161
|
|
5161
5162
|
forwardAttrs(this.shadowRoot.host, this.inputElement, {
|
5162
5163
|
includeAttrs: [
|
@@ -5276,7 +5277,7 @@ const PhoneFieldClass = compose(
|
|
5276
5277
|
}),
|
5277
5278
|
draggableMixin,
|
5278
5279
|
composedProxyInputMixin({ proxyProps: ['value', 'selectionStart'] }),
|
5279
|
-
customMixin$
|
5280
|
+
customMixin$3
|
5280
5281
|
)(
|
5281
5282
|
createProxy({
|
5282
5283
|
slots: [],
|
@@ -5352,17 +5353,17 @@ const PhoneFieldClass = compose(
|
|
5352
5353
|
${resetInputLabelPosition('vaadin-text-field')}
|
5353
5354
|
`,
|
5354
5355
|
excludeAttrsSync: ['tabindex'],
|
5355
|
-
componentName: componentName$
|
5356
|
+
componentName: componentName$k,
|
5356
5357
|
})
|
5357
5358
|
);
|
5358
5359
|
|
5359
|
-
customElements.define(componentName$
|
5360
|
+
customElements.define(componentName$k, PhoneFieldClass);
|
5360
5361
|
|
5361
5362
|
const getCountryByCodeId = (countryCode) => {
|
5362
5363
|
return CountryCodes.find((c) => c.code === countryCode)?.dialCode;
|
5363
5364
|
};
|
5364
5365
|
|
5365
|
-
const componentName$
|
5366
|
+
const componentName$j = getComponentName('phone-field-internal-input-box');
|
5366
5367
|
|
5367
5368
|
const observedAttributes$2 = [
|
5368
5369
|
'disabled',
|
@@ -5376,7 +5377,7 @@ const mapAttrs = {
|
|
5376
5377
|
'phone-input-placeholder': 'placeholder',
|
5377
5378
|
};
|
5378
5379
|
|
5379
|
-
const BaseInputClass$2 = createBaseInputClass({ componentName: componentName$
|
5380
|
+
const BaseInputClass$2 = createBaseInputClass({ componentName: componentName$j, baseSelector: 'div' });
|
5380
5381
|
|
5381
5382
|
class PhoneFieldInternal extends BaseInputClass$2 {
|
5382
5383
|
static get observedAttributes() {
|
@@ -5515,13 +5516,13 @@ class PhoneFieldInternal extends BaseInputClass$2 {
|
|
5515
5516
|
}
|
5516
5517
|
}
|
5517
5518
|
|
5518
|
-
customElements.define(componentName$
|
5519
|
+
customElements.define(componentName$j, PhoneFieldInternal);
|
5519
5520
|
|
5520
5521
|
const textVars = TextFieldClass.cssVarList;
|
5521
5522
|
|
5522
|
-
const componentName$
|
5523
|
+
const componentName$i = getComponentName('phone-input-box-field');
|
5523
5524
|
|
5524
|
-
const customMixin$
|
5525
|
+
const customMixin$2 = (superclass) =>
|
5525
5526
|
class PhoneInputBoxFieldMixinClass extends superclass {
|
5526
5527
|
static get CountryCodes() {
|
5527
5528
|
return CountryCodes;
|
@@ -5533,15 +5534,15 @@ const customMixin$3 = (superclass) =>
|
|
5533
5534
|
const template = document.createElement('template');
|
5534
5535
|
|
5535
5536
|
template.innerHTML = `
|
5536
|
-
<${componentName$
|
5537
|
+
<${componentName$j}
|
5537
5538
|
tabindex="-1"
|
5538
5539
|
slot="input"
|
5539
|
-
></${componentName$
|
5540
|
+
></${componentName$j}>
|
5540
5541
|
`;
|
5541
5542
|
|
5542
5543
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
5543
5544
|
|
5544
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
5545
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$j);
|
5545
5546
|
|
5546
5547
|
forwardAttrs(this.shadowRoot.host, this.inputElement, {
|
5547
5548
|
includeAttrs: [
|
@@ -5608,7 +5609,7 @@ const PhoneFieldInputBoxClass = compose(
|
|
5608
5609
|
}),
|
5609
5610
|
draggableMixin,
|
5610
5611
|
composedProxyInputMixin({ proxyProps: ['value', 'selectionStart'] }),
|
5611
|
-
customMixin$
|
5612
|
+
customMixin$2
|
5612
5613
|
)(
|
5613
5614
|
createProxy({
|
5614
5615
|
slots: [],
|
@@ -5674,17 +5675,17 @@ const PhoneFieldInputBoxClass = compose(
|
|
5674
5675
|
${resetInputLabelPosition('vaadin-text-field')}
|
5675
5676
|
`,
|
5676
5677
|
excludeAttrsSync: ['tabindex'],
|
5677
|
-
componentName: componentName$
|
5678
|
+
componentName: componentName$i,
|
5678
5679
|
})
|
5679
5680
|
);
|
5680
5681
|
|
5681
|
-
customElements.define(componentName$
|
5682
|
+
customElements.define(componentName$i, PhoneFieldInputBoxClass);
|
5682
5683
|
|
5683
|
-
const componentName$
|
5684
|
+
const componentName$h = getComponentName('new-password-internal');
|
5684
5685
|
|
5685
|
-
const componentName$
|
5686
|
+
const componentName$g = getComponentName('new-password');
|
5686
5687
|
|
5687
|
-
const customMixin$
|
5688
|
+
const customMixin$1 = (superclass) =>
|
5688
5689
|
class NewPasswordMixinClass extends superclass {
|
5689
5690
|
init() {
|
5690
5691
|
super.init?.();
|
@@ -5692,16 +5693,16 @@ const customMixin$2 = (superclass) =>
|
|
5692
5693
|
const template = document.createElement('template');
|
5693
5694
|
|
5694
5695
|
template.innerHTML = `
|
5695
|
-
<${componentName$
|
5696
|
+
<${componentName$h}
|
5696
5697
|
name="new-password"
|
5697
5698
|
tabindex="-1"
|
5698
5699
|
slot="input"
|
5699
|
-
></${componentName$
|
5700
|
+
></${componentName$h}>
|
5700
5701
|
`;
|
5701
5702
|
|
5702
5703
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
5703
5704
|
|
5704
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
5705
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$h);
|
5705
5706
|
|
5706
5707
|
forwardAttrs(this, this.inputElement, {
|
5707
5708
|
includeAttrs: [
|
@@ -5756,7 +5757,7 @@ const NewPasswordClass = compose(
|
|
5756
5757
|
}),
|
5757
5758
|
draggableMixin,
|
5758
5759
|
composedProxyInputMixin({ proxyProps: ['value', 'selectionStart'] }),
|
5759
|
-
customMixin$
|
5760
|
+
customMixin$1
|
5760
5761
|
)(
|
5761
5762
|
createProxy({
|
5762
5763
|
slots: [],
|
@@ -5808,7 +5809,7 @@ const NewPasswordClass = compose(
|
|
5808
5809
|
}
|
5809
5810
|
`,
|
5810
5811
|
excludeAttrsSync: ['tabindex'],
|
5811
|
-
componentName: componentName$
|
5812
|
+
componentName: componentName$g,
|
5812
5813
|
})
|
5813
5814
|
);
|
5814
5815
|
|
@@ -5833,7 +5834,7 @@ const commonAttrs = [
|
|
5833
5834
|
|
5834
5835
|
const inputRelatedAttrs = [].concat(commonAttrs, passwordInputAttrs, confirmInputAttrs);
|
5835
5836
|
|
5836
|
-
const BaseInputClass$1 = createBaseInputClass({ componentName: componentName$
|
5837
|
+
const BaseInputClass$1 = createBaseInputClass({ componentName: componentName$h, baseSelector: 'div' });
|
5837
5838
|
|
5838
5839
|
class NewPasswordInternal extends BaseInputClass$1 {
|
5839
5840
|
static get observedAttributes() {
|
@@ -5998,16 +5999,16 @@ class NewPasswordInternal extends BaseInputClass$1 {
|
|
5998
5999
|
}
|
5999
6000
|
}
|
6000
6001
|
|
6001
|
-
customElements.define(componentName$
|
6002
|
+
customElements.define(componentName$h, NewPasswordInternal);
|
6002
6003
|
|
6003
|
-
customElements.define(componentName$
|
6004
|
+
customElements.define(componentName$g, NewPasswordClass);
|
6004
6005
|
|
6005
|
-
const componentName$
|
6006
|
+
const componentName$f = getComponentName('recaptcha');
|
6006
6007
|
|
6007
6008
|
const observedAttributes$1 = ['enabled', 'site-key', 'action', 'enterprise'];
|
6008
6009
|
|
6009
6010
|
const BaseClass = createBaseClass({
|
6010
|
-
componentName: componentName$
|
6011
|
+
componentName: componentName$f,
|
6011
6012
|
baseSelector: ':host > div',
|
6012
6013
|
});
|
6013
6014
|
class RawRecaptcha extends BaseClass {
|
@@ -6159,7 +6160,7 @@ class RawRecaptcha extends BaseClass {
|
|
6159
6160
|
|
6160
6161
|
const RecaptchaClass = compose(draggableMixin)(RawRecaptcha);
|
6161
6162
|
|
6162
|
-
customElements.define(componentName$
|
6163
|
+
customElements.define(componentName$f, RecaptchaClass);
|
6163
6164
|
|
6164
6165
|
const getFileBase64 = (fileObj) => {
|
6165
6166
|
return new Promise((resolve) => {
|
@@ -6173,7 +6174,7 @@ const getFilename = (fileObj) => {
|
|
6173
6174
|
return fileObj.name.replace(/^.*\\/, '');
|
6174
6175
|
};
|
6175
6176
|
|
6176
|
-
const componentName$
|
6177
|
+
const componentName$e = getComponentName('upload-file');
|
6177
6178
|
|
6178
6179
|
const observedAttributes = [
|
6179
6180
|
'title',
|
@@ -6188,7 +6189,7 @@ const observedAttributes = [
|
|
6188
6189
|
'icon',
|
6189
6190
|
];
|
6190
6191
|
|
6191
|
-
const BaseInputClass = createBaseInputClass({ componentName: componentName$
|
6192
|
+
const BaseInputClass = createBaseInputClass({ componentName: componentName$e, baseSelector: ':host > div' });
|
6192
6193
|
|
6193
6194
|
class RawUploadFile extends BaseInputClass {
|
6194
6195
|
static get observedAttributes() {
|
@@ -6403,48 +6404,113 @@ const UploadFileClass = compose(
|
|
6403
6404
|
componentNameValidationMixin
|
6404
6405
|
)(RawUploadFile);
|
6405
6406
|
|
6406
|
-
customElements.define(componentName$
|
6407
|
+
customElements.define(componentName$e, UploadFileClass);
|
6407
6408
|
|
6408
|
-
const
|
6409
|
+
const createBaseButtonSelectionGroupInternalClass = (componentName) => {
|
6410
|
+
class BaseButtonSelectionGroupInternalClass extends createBaseInputClass({
|
6411
|
+
componentName,
|
6412
|
+
baseSelector: 'slot',
|
6413
|
+
}) {
|
6414
|
+
constructor() {
|
6415
|
+
super();
|
6409
6416
|
|
6410
|
-
|
6411
|
-
|
6412
|
-
|
6413
|
-
|
6414
|
-
|
6415
|
-
|
6417
|
+
this.innerHTML = `
|
6418
|
+
<style>
|
6419
|
+
slot {
|
6420
|
+
box-sizing: border-box;
|
6421
|
+
width: 100%;
|
6422
|
+
display: flex;
|
6423
|
+
flex-wrap: wrap;
|
6424
|
+
}
|
6425
|
+
</style>
|
6426
|
+
<slot part="wrapper"></slot>
|
6427
|
+
`;
|
6428
|
+
}
|
6416
6429
|
|
6417
|
-
|
6418
|
-
|
6419
|
-
|
6420
|
-
|
6421
|
-
|
6422
|
-
|
6423
|
-
|
6430
|
+
dispatchChange = createDispatchEvent.bind(this, 'change');
|
6431
|
+
|
6432
|
+
get items() {
|
6433
|
+
return this.querySelector('slot').assignedElements();
|
6434
|
+
}
|
6435
|
+
|
6436
|
+
get isReadonly() {
|
6437
|
+
return this.getAttribute('readonly') === 'true';
|
6424
6438
|
}
|
6425
|
-
</style>
|
6426
|
-
<slot part="wrapper"></slot>
|
6427
|
-
`;
|
6428
|
-
}
|
6429
6439
|
|
6430
|
-
|
6440
|
+
get size() {
|
6441
|
+
return this.getAttribute('size') || 'md';
|
6442
|
+
}
|
6431
6443
|
|
6432
|
-
|
6433
|
-
|
6434
|
-
|
6444
|
+
// eslint-disable-next-line getter-return, class-methods-use-this
|
6445
|
+
get value() {
|
6446
|
+
// eslint-disable-next-line no-console
|
6447
|
+
console.warn('get value', 'is not implemented');
|
6448
|
+
}
|
6449
|
+
|
6450
|
+
// eslint-disable-next-line class-methods-use-this
|
6451
|
+
set value(value) {
|
6452
|
+
// eslint-disable-next-line no-console
|
6453
|
+
console.warn('set value', 'is not implemented');
|
6454
|
+
}
|
6455
|
+
|
6456
|
+
onSizeChange() {
|
6457
|
+
this.items.forEach((item) => {
|
6458
|
+
item.setAttribute('size', this.size);
|
6459
|
+
});
|
6460
|
+
}
|
6461
|
+
|
6462
|
+
onReadOnlyChange() {
|
6463
|
+
this.querySelector('slot').toggleAttribute('inert', this.isReadonly);
|
6464
|
+
}
|
6465
|
+
|
6466
|
+
// eslint-disable-next-line class-methods-use-this
|
6467
|
+
getValidity() {
|
6468
|
+
// eslint-disable-next-line no-console
|
6469
|
+
console.warn('getValidity', 'is not implemented');
|
6470
|
+
}
|
6471
|
+
|
6472
|
+
onObservedAttributeChange(attrs) {
|
6473
|
+
attrs.forEach((attr) => {
|
6474
|
+
switch (attr) {
|
6475
|
+
case 'size':
|
6476
|
+
this.onSizeChange();
|
6477
|
+
break;
|
6478
|
+
case 'readonly':
|
6479
|
+
this.onReadOnlyChange();
|
6480
|
+
break;
|
6481
|
+
}
|
6482
|
+
});
|
6483
|
+
}
|
6484
|
+
|
6485
|
+
init() {
|
6486
|
+
// we are adding listeners before calling to super because it's stopping the events
|
6487
|
+
this.addEventListener('focus', (e) => {
|
6488
|
+
// we want to ignore focus events we are dispatching
|
6489
|
+
if (e.isTrusted) {
|
6490
|
+
this.items[0]?.focus();
|
6491
|
+
}
|
6492
|
+
});
|
6493
|
+
|
6494
|
+
super.init?.();
|
6435
6495
|
|
6436
|
-
|
6437
|
-
|
6496
|
+
observeAttributes(this, this.onObservedAttributeChange.bind(this), {
|
6497
|
+
includeAttrs: ['size', 'readonly'],
|
6498
|
+
});
|
6499
|
+
}
|
6438
6500
|
}
|
6439
6501
|
|
6502
|
+
return BaseButtonSelectionGroupInternalClass;
|
6503
|
+
};
|
6504
|
+
|
6505
|
+
const componentName$d = getComponentName('button-selection-group-internal');
|
6506
|
+
|
6507
|
+
class ButtonSelectionGroupInternalClass extends createBaseButtonSelectionGroupInternalClass(
|
6508
|
+
componentName$d
|
6509
|
+
) {
|
6440
6510
|
getSelectedNode() {
|
6441
6511
|
return this.items.find((item) => item.hasAttribute('selected'));
|
6442
6512
|
}
|
6443
6513
|
|
6444
|
-
get size() {
|
6445
|
-
return this.getAttribute('size') || 'md';
|
6446
|
-
}
|
6447
|
-
|
6448
6514
|
get allowDeselect() {
|
6449
6515
|
return this.getAttribute('allow-deselect') === 'true';
|
6450
6516
|
}
|
@@ -6460,7 +6526,7 @@ class ButtonSelectionGroupInternalClass extends createBaseInputClass({
|
|
6460
6526
|
} else {
|
6461
6527
|
this.setSelected(e.target);
|
6462
6528
|
}
|
6463
|
-
this
|
6529
|
+
this.dispatchChange();
|
6464
6530
|
}
|
6465
6531
|
}
|
6466
6532
|
|
@@ -6471,15 +6537,6 @@ class ButtonSelectionGroupInternalClass extends createBaseInputClass({
|
|
6471
6537
|
}
|
6472
6538
|
}
|
6473
6539
|
|
6474
|
-
get value() {
|
6475
|
-
return this.getSelectedNode()?.value || '';
|
6476
|
-
}
|
6477
|
-
|
6478
|
-
set value(value) {
|
6479
|
-
const node = this.items.find((child) => child.value === value);
|
6480
|
-
this.setSelected(node);
|
6481
|
-
}
|
6482
|
-
|
6483
6540
|
get defaultValue() {
|
6484
6541
|
return this.getAttribute('default-value');
|
6485
6542
|
}
|
@@ -6494,14 +6551,13 @@ class ButtonSelectionGroupInternalClass extends createBaseInputClass({
|
|
6494
6551
|
});
|
6495
6552
|
}
|
6496
6553
|
|
6497
|
-
|
6498
|
-
this.
|
6499
|
-
item.setAttribute('size', this.size);
|
6500
|
-
});
|
6554
|
+
get value() {
|
6555
|
+
return this.getSelectedNode()?.value || '';
|
6501
6556
|
}
|
6502
6557
|
|
6503
|
-
|
6504
|
-
this.
|
6558
|
+
set value(value) {
|
6559
|
+
const node = this.items.find((child) => child.value === value);
|
6560
|
+
this.setSelected(node);
|
6505
6561
|
}
|
6506
6562
|
|
6507
6563
|
getValidity() {
|
@@ -6512,42 +6568,16 @@ class ButtonSelectionGroupInternalClass extends createBaseInputClass({
|
|
6512
6568
|
return {};
|
6513
6569
|
}
|
6514
6570
|
|
6515
|
-
onObservedAttributeChange(attrs) {
|
6516
|
-
attrs.forEach((attr) => {
|
6517
|
-
switch (attr) {
|
6518
|
-
case 'size':
|
6519
|
-
this.onSizeChange();
|
6520
|
-
break;
|
6521
|
-
case 'readonly':
|
6522
|
-
this.onReadOnlyChange();
|
6523
|
-
break;
|
6524
|
-
}
|
6525
|
-
});
|
6526
|
-
}
|
6527
|
-
|
6528
6571
|
init() {
|
6529
|
-
|
6530
|
-
this.addEventListener('focus', (e) => {
|
6531
|
-
// we want to ignore focus events we are dispatching
|
6532
|
-
if (e.isTrusted) {
|
6533
|
-
this.items[0]?.focus();
|
6534
|
-
}
|
6535
|
-
});
|
6572
|
+
super.init();
|
6536
6573
|
|
6537
|
-
super.init?.();
|
6538
6574
|
this.setDefaultValue();
|
6539
6575
|
|
6540
|
-
observeAttributes(this, this.onObservedAttributeChange.bind(this), {
|
6541
|
-
includeAttrs: ['size', 'readonly'],
|
6542
|
-
});
|
6543
|
-
|
6544
6576
|
this.querySelector('slot').addEventListener('click', this.onClick.bind(this));
|
6545
6577
|
}
|
6546
6578
|
}
|
6547
6579
|
|
6548
|
-
const
|
6549
|
-
|
6550
|
-
const customMixin$1 = (superclass) =>
|
6580
|
+
const buttonSelectionGroupBaseMixin = (superclass) =>
|
6551
6581
|
class ButtonSelectionGroupMixinClass extends superclass {
|
6552
6582
|
// eslint-disable-next-line class-methods-use-this
|
6553
6583
|
#renderItem = ({ value, label }) =>
|
@@ -6617,25 +6647,6 @@ const customMixin$1 = (superclass) =>
|
|
6617
6647
|
|
6618
6648
|
init() {
|
6619
6649
|
super.init?.();
|
6620
|
-
const template = document.createElement('template');
|
6621
|
-
|
6622
|
-
template.innerHTML = `
|
6623
|
-
<${componentName$b}
|
6624
|
-
name="button-selection-group"
|
6625
|
-
slot="input"
|
6626
|
-
tabindex="-1"
|
6627
|
-
>
|
6628
|
-
<slot></slot>
|
6629
|
-
</${componentName$b}>
|
6630
|
-
`;
|
6631
|
-
|
6632
|
-
this.baseElement.appendChild(template.content.cloneNode(true));
|
6633
|
-
|
6634
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$b);
|
6635
|
-
|
6636
|
-
forwardAttrs(this, this.inputElement, {
|
6637
|
-
includeAttrs: ['size', 'default-value', 'allow-deselect'],
|
6638
|
-
});
|
6639
6650
|
|
6640
6651
|
this.renderItems();
|
6641
6652
|
|
@@ -6654,34 +6665,24 @@ const { host: host$2, label: label$1, requiredIndicator: requiredIndicator$1, in
|
|
6654
6665
|
host: { selector: () => ':host' },
|
6655
6666
|
label: { selector: '::part(label)' },
|
6656
6667
|
requiredIndicator: { selector: '[required]::part(required-indicator)::after' },
|
6657
|
-
internalWrapper: { selector: '
|
6668
|
+
internalWrapper: { selector: () => ':host [part="internal-component"] slot' },
|
6658
6669
|
errorMessage: { selector: '::part(error-message)' },
|
6659
6670
|
};
|
6660
6671
|
|
6661
|
-
const
|
6662
|
-
|
6663
|
-
|
6664
|
-
|
6665
|
-
|
6666
|
-
|
6667
|
-
|
6668
|
-
|
6669
|
-
|
6670
|
-
|
6671
|
-
|
6672
|
-
|
6673
|
-
|
6674
|
-
|
6675
|
-
}),
|
6676
|
-
draggableMixin,
|
6677
|
-
composedProxyInputMixin({ proxyProps: ['value', 'selectionStart'] }),
|
6678
|
-
componentNameValidationMixin,
|
6679
|
-
customMixin$1
|
6680
|
-
)(
|
6681
|
-
createProxy({
|
6682
|
-
slots: [],
|
6683
|
-
wrappedEleName: 'vaadin-text-field',
|
6684
|
-
style: () => `
|
6672
|
+
const buttonSelectionGroupMappings = {
|
6673
|
+
hostWidth: { ...host$2, property: 'width' },
|
6674
|
+
hostDirection: { ...host$2, property: 'direction' },
|
6675
|
+
fontFamily: host$2,
|
6676
|
+
labelTextColor: [
|
6677
|
+
{ ...label$1, property: 'color' },
|
6678
|
+
{ ...requiredIndicator$1, property: 'color' },
|
6679
|
+
],
|
6680
|
+
labelRequiredIndicator: { ...requiredIndicator$1, property: 'content' },
|
6681
|
+
errorMessageTextColor: { ...errorMessage$1, property: 'color' },
|
6682
|
+
itemsSpacing: { ...internalWrapper, property: 'gap' },
|
6683
|
+
};
|
6684
|
+
|
6685
|
+
const buttonSelectionGroupStyles = `
|
6685
6686
|
:host {
|
6686
6687
|
display: inline-flex;
|
6687
6688
|
max-width: 100%;
|
@@ -6694,7 +6695,7 @@ const ButtonSelectionGroupClass = compose(
|
|
6694
6695
|
background-color: transparent;
|
6695
6696
|
}
|
6696
6697
|
|
6697
|
-
|
6698
|
+
[part="internal-component"] {
|
6698
6699
|
-webkit-mask-image: none;
|
6699
6700
|
padding: 0;
|
6700
6701
|
width: 100%;
|
@@ -6734,18 +6735,64 @@ const ButtonSelectionGroupClass = compose(
|
|
6734
6735
|
|
6735
6736
|
${resetInputLabelPosition('vaadin-text-field')}
|
6736
6737
|
${resetInputCursor('vaadin-text-field')}
|
6737
|
-
|
6738
|
+
`;
|
6739
|
+
|
6740
|
+
const componentName$c = getComponentName('button-selection-group');
|
6741
|
+
|
6742
|
+
const buttonSelectionGroupMixin = (superclass) =>
|
6743
|
+
class ButtonMultiSelectionGroupMixinClass extends superclass {
|
6744
|
+
init() {
|
6745
|
+
super.init?.();
|
6746
|
+
const template = document.createElement('template');
|
6747
|
+
|
6748
|
+
template.innerHTML = `
|
6749
|
+
<${componentName$d}
|
6750
|
+
name="button-selection-group"
|
6751
|
+
slot="input"
|
6752
|
+
tabindex="-1"
|
6753
|
+
part="internal-component"
|
6754
|
+
>
|
6755
|
+
<slot></slot>
|
6756
|
+
</${componentName$d}>
|
6757
|
+
`;
|
6758
|
+
|
6759
|
+
this.baseElement.appendChild(template.content.cloneNode(true));
|
6760
|
+
|
6761
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$d);
|
6762
|
+
|
6763
|
+
forwardAttrs(this, this.inputElement, {
|
6764
|
+
includeAttrs: ['size', 'default-value', 'allow-deselect'],
|
6765
|
+
});
|
6766
|
+
}
|
6767
|
+
};
|
6768
|
+
|
6769
|
+
const ButtonSelectionGroupClass = compose(
|
6770
|
+
createStyleMixin({
|
6771
|
+
mappings: {
|
6772
|
+
...buttonSelectionGroupMappings,
|
6773
|
+
},
|
6774
|
+
}),
|
6775
|
+
draggableMixin,
|
6776
|
+
composedProxyInputMixin({ proxyProps: ['value', 'selectionStart'] }),
|
6777
|
+
componentNameValidationMixin,
|
6778
|
+
buttonSelectionGroupBaseMixin,
|
6779
|
+
buttonSelectionGroupMixin
|
6780
|
+
)(
|
6781
|
+
createProxy({
|
6782
|
+
slots: [],
|
6783
|
+
wrappedEleName: 'vaadin-text-field',
|
6784
|
+
style: () => buttonSelectionGroupStyles,
|
6738
6785
|
excludeAttrsSync: ['tabindex'],
|
6739
|
-
componentName: componentName$
|
6786
|
+
componentName: componentName$c,
|
6740
6787
|
})
|
6741
6788
|
);
|
6742
6789
|
|
6743
|
-
customElements.define(componentName$
|
6790
|
+
customElements.define(componentName$d, ButtonSelectionGroupInternalClass);
|
6744
6791
|
|
6745
|
-
const componentName$
|
6792
|
+
const componentName$b = getComponentName('button-selection-group-item');
|
6746
6793
|
|
6747
6794
|
class RawSelectItem extends createBaseClass({
|
6748
|
-
componentName: componentName$
|
6795
|
+
componentName: componentName$b,
|
6749
6796
|
baseSelector: ':host > descope-button',
|
6750
6797
|
}) {
|
6751
6798
|
get size() {
|
@@ -6843,48 +6890,206 @@ const ButtonSelectionGroupItemClass = compose(
|
|
6843
6890
|
componentNameValidationMixin
|
6844
6891
|
)(RawSelectItem);
|
6845
6892
|
|
6846
|
-
customElements.define(componentName$
|
6893
|
+
customElements.define(componentName$b, ButtonSelectionGroupItemClass);
|
6847
6894
|
|
6848
|
-
customElements.define(componentName$
|
6895
|
+
customElements.define(componentName$c, ButtonSelectionGroupClass);
|
6849
6896
|
|
6850
|
-
|
6851
|
-
get sortable() {
|
6852
|
-
return this.getAttribute('sortable') === 'true';
|
6853
|
-
}
|
6897
|
+
const componentName$a = getComponentName('button-multi-selection-group-internal');
|
6854
6898
|
|
6855
|
-
|
6856
|
-
|
6857
|
-
|
6899
|
+
class ButtonMultiSelectionGroupInternalClass extends createBaseButtonSelectionGroupInternalClass(
|
6900
|
+
componentName$a
|
6901
|
+
) {
|
6902
|
+
#getSelectedNodes() {
|
6903
|
+
return this.items.filter((item) => item.hasAttribute('selected'));
|
6904
|
+
}
|
6858
6905
|
|
6859
|
-
|
6906
|
+
onClick(e) {
|
6907
|
+
if (e.target !== e.currentTarget) {
|
6908
|
+
if (this.#getSelectedNodes().includes(e.target)) {
|
6909
|
+
e.target.removeAttribute('selected');
|
6910
|
+
} else {
|
6911
|
+
e.target.setAttribute('selected', 'true');
|
6912
|
+
}
|
6913
|
+
this.dispatchChange();
|
6860
6914
|
}
|
6861
|
-
|
6862
|
-
// eslint-disable-next-line no-param-reassign
|
6863
|
-
root.innerHTML = this.__getHeader(this.header, this.path);
|
6864
6915
|
}
|
6865
|
-
}
|
6866
6916
|
|
6867
|
-
|
6917
|
+
get value() {
|
6918
|
+
return this.#getSelectedNodes().map((node) => node.value);
|
6919
|
+
}
|
6868
6920
|
|
6869
|
-
|
6921
|
+
set value(values) {
|
6922
|
+
this.items.forEach((item) => {
|
6923
|
+
if (values.includes(item.value)) {
|
6924
|
+
item.setAttribute('selected', 'true');
|
6925
|
+
}
|
6926
|
+
});
|
6927
|
+
}
|
6870
6928
|
|
6871
|
-
|
6929
|
+
get minItemsSelection() {
|
6930
|
+
return parseInt(this.getAttribute('min-items-selection'), 10) || 0;
|
6931
|
+
}
|
6872
6932
|
|
6873
|
-
|
6874
|
-
|
6875
|
-
|
6933
|
+
get maxItemsSelection() {
|
6934
|
+
return parseInt(this.getAttribute('max-items-selection'), 10) || 0;
|
6935
|
+
}
|
6876
6936
|
|
6877
|
-
|
6878
|
-
|
6879
|
-
|
6880
|
-
|
6881
|
-
|
6882
|
-
|
6883
|
-
|
6937
|
+
// eslint-disable-next-line class-methods-use-this
|
6938
|
+
#isValidDataType(data) {
|
6939
|
+
const isValid = Array.isArray(data);
|
6940
|
+
if (!isValid) {
|
6941
|
+
// eslint-disable-next-line no-console
|
6942
|
+
console.error('default-values must be an array, received:', data);
|
6943
|
+
}
|
6884
6944
|
|
6885
|
-
|
6886
|
-
|
6887
|
-
|
6945
|
+
return isValid;
|
6946
|
+
}
|
6947
|
+
|
6948
|
+
get defaultValues() {
|
6949
|
+
const defaultValuesAttr = this.getAttribute('default-values');
|
6950
|
+
if (defaultValuesAttr) {
|
6951
|
+
try {
|
6952
|
+
const defaultValues = JSON.parse(defaultValuesAttr);
|
6953
|
+
if (this.#isValidDataType(defaultValues)) {
|
6954
|
+
return defaultValues;
|
6955
|
+
}
|
6956
|
+
} catch (e) {
|
6957
|
+
// eslint-disable-next-line no-console
|
6958
|
+
console.error('could not parse data string from attribute "default-values" -', e.message);
|
6959
|
+
}
|
6960
|
+
}
|
6961
|
+
return [];
|
6962
|
+
}
|
6963
|
+
|
6964
|
+
setDefaultValues() {
|
6965
|
+
// we want to defer this action until all attributes are synced
|
6966
|
+
setTimeout(() => {
|
6967
|
+
if (this.defaultValues) {
|
6968
|
+
this.value = this.defaultValues;
|
6969
|
+
this.setCustomValidity();
|
6970
|
+
}
|
6971
|
+
});
|
6972
|
+
}
|
6973
|
+
|
6974
|
+
getValidity() {
|
6975
|
+
if (this.isRequired && !this.value.length) {
|
6976
|
+
return { valueMissing: true };
|
6977
|
+
}
|
6978
|
+
// If the field is not required, no minimum selection can be set
|
6979
|
+
if (this.isRequired && this.minItemsSelection && this.value.length < this.minItemsSelection) {
|
6980
|
+
return {
|
6981
|
+
rangeUnderflow: true,
|
6982
|
+
};
|
6983
|
+
}
|
6984
|
+
if (this.maxItemsSelection && this.value.length > this.maxItemsSelection) {
|
6985
|
+
return {
|
6986
|
+
rangeOverflow: true,
|
6987
|
+
};
|
6988
|
+
}
|
6989
|
+
return {};
|
6990
|
+
}
|
6991
|
+
|
6992
|
+
init() {
|
6993
|
+
super.init();
|
6994
|
+
|
6995
|
+
this.setDefaultValues();
|
6996
|
+
|
6997
|
+
this.querySelector('slot').addEventListener('click', this.onClick.bind(this));
|
6998
|
+
}
|
6999
|
+
}
|
7000
|
+
|
7001
|
+
const componentName$9 = getComponentName('button-multi-selection-group');
|
7002
|
+
|
7003
|
+
const buttonMultiSelectionGroupMixin = (superclass) =>
|
7004
|
+
class ButtonMultiSelectionGroupMixinClass extends superclass {
|
7005
|
+
init() {
|
7006
|
+
super.init?.();
|
7007
|
+
const template = document.createElement('template');
|
7008
|
+
|
7009
|
+
template.innerHTML = `
|
7010
|
+
<${componentName$a}
|
7011
|
+
name="button-selection-group"
|
7012
|
+
slot="input"
|
7013
|
+
tabindex="-1"
|
7014
|
+
part="internal-component"
|
7015
|
+
>
|
7016
|
+
<slot></slot>
|
7017
|
+
</${componentName$a}>
|
7018
|
+
`;
|
7019
|
+
|
7020
|
+
this.baseElement.appendChild(template.content.cloneNode(true));
|
7021
|
+
|
7022
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$a);
|
7023
|
+
|
7024
|
+
forwardAttrs(this, this.inputElement, {
|
7025
|
+
includeAttrs: ['size', 'default-values', 'min-items-selection', 'max-items-selection'],
|
7026
|
+
});
|
7027
|
+
}
|
7028
|
+
};
|
7029
|
+
|
7030
|
+
const ButtonMultiSelectionGroupClass = compose(
|
7031
|
+
createStyleMixin({
|
7032
|
+
mappings: {
|
7033
|
+
...buttonSelectionGroupMappings,
|
7034
|
+
},
|
7035
|
+
}),
|
7036
|
+
draggableMixin,
|
7037
|
+
composedProxyInputMixin({ proxyProps: ['value', 'selectionStart'] }),
|
7038
|
+
componentNameValidationMixin,
|
7039
|
+
buttonSelectionGroupBaseMixin,
|
7040
|
+
buttonMultiSelectionGroupMixin
|
7041
|
+
)(
|
7042
|
+
createProxy({
|
7043
|
+
slots: [],
|
7044
|
+
wrappedEleName: 'vaadin-text-field',
|
7045
|
+
style: () => buttonSelectionGroupStyles,
|
7046
|
+
excludeAttrsSync: ['tabindex'],
|
7047
|
+
componentName: componentName$9,
|
7048
|
+
})
|
7049
|
+
);
|
7050
|
+
|
7051
|
+
customElements.define(componentName$a, ButtonMultiSelectionGroupInternalClass);
|
7052
|
+
|
7053
|
+
customElements.define(componentName$9, ButtonMultiSelectionGroupClass);
|
7054
|
+
|
7055
|
+
class GridTextColumnClass extends GridSortColumn {
|
7056
|
+
get sortable() {
|
7057
|
+
return this.getAttribute('sortable') === 'true';
|
7058
|
+
}
|
7059
|
+
|
7060
|
+
_defaultHeaderRenderer(root, _column) {
|
7061
|
+
if (this.sortable) {
|
7062
|
+
super._defaultHeaderRenderer(root, _column);
|
7063
|
+
|
7064
|
+
return;
|
7065
|
+
}
|
7066
|
+
|
7067
|
+
// eslint-disable-next-line no-param-reassign
|
7068
|
+
root.innerHTML = this.__getHeader(this.header, this.path);
|
7069
|
+
}
|
7070
|
+
}
|
7071
|
+
|
7072
|
+
const componentName$8 = getComponentName('grid-text-column');
|
7073
|
+
|
7074
|
+
customElements.define(componentName$8, GridTextColumnClass);
|
7075
|
+
|
7076
|
+
/* eslint-disable no-param-reassign */
|
7077
|
+
|
7078
|
+
class GridCustomColumnClass extends GridTextColumnClass {
|
7079
|
+
_defaultRenderer(cell, _col, model) {
|
7080
|
+
const content = model.item[this.path];
|
7081
|
+
|
7082
|
+
// we get a list of elements that can be used to render the content
|
7083
|
+
// each element can have a "pattern" attribute which contains regex expression
|
7084
|
+
// we are going over the elements, and when finding an element which is pattern matches the data,
|
7085
|
+
// we are cloning this element, and injecting the data as its child
|
7086
|
+
const contentEle = Array.from(this.children).find((child) => {
|
7087
|
+
const pattern = child.getAttribute('data-pattern');
|
7088
|
+
if (!pattern) return true;
|
7089
|
+
|
7090
|
+
const regEx = new RegExp(pattern);
|
7091
|
+
return regEx.test(content);
|
7092
|
+
});
|
6888
7093
|
|
6889
7094
|
if (!contentEle) {
|
6890
7095
|
cell.innerHTML = model.item[this.path];
|
@@ -7761,6 +7966,111 @@ const BadgeClass = compose(
|
|
7761
7966
|
|
7762
7967
|
customElements.define(componentName$3, BadgeClass);
|
7763
7968
|
|
7969
|
+
const componentName$2 = getComponentName('modal');
|
7970
|
+
|
7971
|
+
const customMixin = (superclass) =>
|
7972
|
+
class ModalMixinClass extends superclass {
|
7973
|
+
get opened() {
|
7974
|
+
return this.getAttribute('opened') === 'true';
|
7975
|
+
}
|
7976
|
+
|
7977
|
+
handleOpened() {
|
7978
|
+
forwardAttrs(this, this.baseElement, { includeAttrs: ['opened'] });
|
7979
|
+
if (this.opened) {
|
7980
|
+
this.style.display = '';
|
7981
|
+
} else {
|
7982
|
+
this.style.display = 'none';
|
7983
|
+
}
|
7984
|
+
}
|
7985
|
+
|
7986
|
+
init() {
|
7987
|
+
super.init?.();
|
7988
|
+
this.style.display = 'none';
|
7989
|
+
|
7990
|
+
// vaadin-dialog might not be loaded in time
|
7991
|
+
// in order to make sure it's loaded before this block is running
|
7992
|
+
// we are wrapping it with setTimeout
|
7993
|
+
setTimeout(() => {
|
7994
|
+
// we want to sync descope-modal content through vaadin-dialog into the overlay
|
7995
|
+
// so we are adding a slot to the overlay, which allows us to forward the content from
|
7996
|
+
// vaadin-dialog to vaadin-dialog-overlay
|
7997
|
+
this.baseElement.shadowRoot
|
7998
|
+
.querySelector('vaadin-dialog-overlay')
|
7999
|
+
.appendChild(document.createElement('slot'));
|
8000
|
+
|
8001
|
+
this.#overrideOverlaySettings();
|
8002
|
+
|
8003
|
+
// we need to always open the modal in `opened=false`
|
8004
|
+
// to prevent it from rendering outside the dialog
|
8005
|
+
// first, we have to run `overrideOverlaySettings` to setup
|
8006
|
+
// the component.
|
8007
|
+
this.handleOpened();
|
8008
|
+
});
|
8009
|
+
}
|
8010
|
+
|
8011
|
+
// the default vaadin behavior is to attach the overlay to the body when opened
|
8012
|
+
// we do not want that because it's difficult to style the overlay in this way
|
8013
|
+
// so we override it to open inside the shadow DOM
|
8014
|
+
#overrideOverlaySettings() {
|
8015
|
+
const overlay = this.baseElement.shadowRoot.querySelector('vaadin-dialog-overlay');
|
8016
|
+
|
8017
|
+
overlay._attachOverlay = () => {
|
8018
|
+
overlay.bringToFront();
|
8019
|
+
this.baseElement.setAttribute('style', 'display:flex!important;');
|
8020
|
+
};
|
8021
|
+
overlay._detachOverlay = () => {
|
8022
|
+
this.baseElement.style.display = 'none';
|
8023
|
+
};
|
8024
|
+
overlay._enterModalState = () => {};
|
8025
|
+
|
8026
|
+
overlay.close = () => false;
|
8027
|
+
}
|
8028
|
+
};
|
8029
|
+
|
8030
|
+
const ModalClass = compose(
|
8031
|
+
createStyleMixin({
|
8032
|
+
mappings: {
|
8033
|
+
overlayBackgroundColor: { property: () => ModalClass.cssVarList.overlay.backgroundColor },
|
8034
|
+
overlayShadow: { property: () => ModalClass.cssVarList.overlay.shadow },
|
8035
|
+
overlayWidth: { property: () => ModalClass.cssVarList.overlay.width },
|
8036
|
+
},
|
8037
|
+
}),
|
8038
|
+
portalMixin({
|
8039
|
+
name: 'overlay',
|
8040
|
+
selector: '',
|
8041
|
+
mappings: {
|
8042
|
+
hostDisplay: {
|
8043
|
+
selector: () => ':host(.descope-modal)',
|
8044
|
+
property: 'display',
|
8045
|
+
important: true,
|
8046
|
+
},
|
8047
|
+
backgroundColor: [
|
8048
|
+
{ selector: () => '::part(content)', property: 'background-color' },
|
8049
|
+
{ selector: () => '::part(overlay)', property: 'background-color' },
|
8050
|
+
],
|
8051
|
+
width: { selector: () => '::part(overlay)', property: 'width' },
|
8052
|
+
shadow: { selector: () => '::part(overlay)', property: 'box-shadow' },
|
8053
|
+
},
|
8054
|
+
forward: {
|
8055
|
+
include: false,
|
8056
|
+
attributes: ['opened'],
|
8057
|
+
},
|
8058
|
+
}),
|
8059
|
+
draggableMixin,
|
8060
|
+
componentNameValidationMixin,
|
8061
|
+
customMixin
|
8062
|
+
)(
|
8063
|
+
createProxy({
|
8064
|
+
slots: [''],
|
8065
|
+
wrappedEleName: 'vaadin-dialog',
|
8066
|
+
style: () => ``,
|
8067
|
+
excludeAttrsSync: ['tabindex', 'opened'],
|
8068
|
+
componentName: componentName$2,
|
8069
|
+
})
|
8070
|
+
);
|
8071
|
+
|
8072
|
+
customElements.define(componentName$2, ModalClass);
|
8073
|
+
|
7764
8074
|
const getVarName = (path) => getCssVarName(DESCOPE_PREFIX, ...path);
|
7765
8075
|
|
7766
8076
|
const transformTheme = (theme, path, getTransformation) => {
|
@@ -8090,7 +8400,7 @@ const globals = {
|
|
8090
8400
|
fonts,
|
8091
8401
|
direction,
|
8092
8402
|
};
|
8093
|
-
const vars$
|
8403
|
+
const vars$x = getThemeVars(globals);
|
8094
8404
|
|
8095
8405
|
const globalRefs$i = getThemeRefs(globals);
|
8096
8406
|
const compVars$4 = ButtonClass.cssVarList;
|
@@ -8103,7 +8413,7 @@ const mode = {
|
|
8103
8413
|
surface: globalRefs$i.colors.surface,
|
8104
8414
|
};
|
8105
8415
|
|
8106
|
-
const [helperTheme$3, helperRefs$3, helperVars$3] = createHelperVars({ mode }, componentName$
|
8416
|
+
const [helperTheme$3, helperRefs$3, helperVars$3] = createHelperVars({ mode }, componentName$G);
|
8107
8417
|
|
8108
8418
|
const button = {
|
8109
8419
|
...helperTheme$3,
|
@@ -8201,7 +8511,7 @@ const button = {
|
|
8201
8511
|
},
|
8202
8512
|
};
|
8203
8513
|
|
8204
|
-
const vars$
|
8514
|
+
const vars$w = {
|
8205
8515
|
...compVars$4,
|
8206
8516
|
...helperVars$3,
|
8207
8517
|
};
|
@@ -8209,13 +8519,13 @@ const vars$v = {
|
|
8209
8519
|
var button$1 = /*#__PURE__*/Object.freeze({
|
8210
8520
|
__proto__: null,
|
8211
8521
|
default: button,
|
8212
|
-
vars: vars$
|
8522
|
+
vars: vars$w
|
8213
8523
|
});
|
8214
8524
|
|
8215
|
-
const componentName$
|
8525
|
+
const componentName$1 = getComponentName('input-wrapper');
|
8216
8526
|
const globalRefs$h = getThemeRefs(globals);
|
8217
8527
|
|
8218
|
-
const [theme$1, refs, vars$
|
8528
|
+
const [theme$1, refs, vars$v] = createHelperVars(
|
8219
8529
|
{
|
8220
8530
|
labelTextColor: globalRefs$h.colors.surface.contrast,
|
8221
8531
|
valueTextColor: globalRefs$h.colors.surface.contrast,
|
@@ -8281,29 +8591,65 @@ const [theme$1, refs, vars$u] = createHelperVars(
|
|
8281
8591
|
backgroundColor: globalRefs$h.colors.surface.main,
|
8282
8592
|
},
|
8283
8593
|
},
|
8284
|
-
componentName$
|
8594
|
+
componentName$1
|
8285
8595
|
);
|
8286
8596
|
|
8287
8597
|
var inputWrapper = /*#__PURE__*/Object.freeze({
|
8288
8598
|
__proto__: null,
|
8289
8599
|
default: theme$1,
|
8290
8600
|
refs: refs,
|
8291
|
-
vars: vars$
|
8601
|
+
vars: vars$v
|
8292
8602
|
});
|
8293
8603
|
|
8294
|
-
const vars$
|
8604
|
+
const vars$u = TextFieldClass.cssVarList;
|
8295
8605
|
|
8296
8606
|
const textField = {
|
8607
|
+
[vars$u.hostWidth]: refs.width,
|
8608
|
+
[vars$u.hostMinWidth]: refs.minWidth,
|
8609
|
+
[vars$u.hostDirection]: refs.direction,
|
8610
|
+
[vars$u.fontSize]: refs.fontSize,
|
8611
|
+
[vars$u.fontFamily]: refs.fontFamily,
|
8612
|
+
[vars$u.labelTextColor]: refs.labelTextColor,
|
8613
|
+
[vars$u.labelRequiredIndicator]: refs.requiredIndicator,
|
8614
|
+
[vars$u.errorMessageTextColor]: refs.errorMessageTextColor,
|
8615
|
+
[vars$u.inputValueTextColor]: refs.valueTextColor,
|
8616
|
+
[vars$u.inputPlaceholderColor]: refs.placeholderTextColor,
|
8617
|
+
[vars$u.inputBorderWidth]: refs.borderWidth,
|
8618
|
+
[vars$u.inputBorderStyle]: refs.borderStyle,
|
8619
|
+
[vars$u.inputBorderColor]: refs.borderColor,
|
8620
|
+
[vars$u.inputBorderRadius]: refs.borderRadius,
|
8621
|
+
[vars$u.inputOutlineWidth]: refs.outlineWidth,
|
8622
|
+
[vars$u.inputOutlineStyle]: refs.outlineStyle,
|
8623
|
+
[vars$u.inputOutlineColor]: refs.outlineColor,
|
8624
|
+
[vars$u.inputOutlineOffset]: refs.outlineOffset,
|
8625
|
+
[vars$u.inputBackgroundColor]: refs.backgroundColor,
|
8626
|
+
[vars$u.inputHeight]: refs.inputHeight,
|
8627
|
+
[vars$u.inputHorizontalPadding]: refs.horizontalPadding,
|
8628
|
+
};
|
8629
|
+
|
8630
|
+
var textField$1 = /*#__PURE__*/Object.freeze({
|
8631
|
+
__proto__: null,
|
8632
|
+
default: textField,
|
8633
|
+
textField: textField,
|
8634
|
+
vars: vars$u
|
8635
|
+
});
|
8636
|
+
|
8637
|
+
const globalRefs$g = getThemeRefs(globals);
|
8638
|
+
const vars$t = PasswordClass.cssVarList;
|
8639
|
+
|
8640
|
+
const password = {
|
8297
8641
|
[vars$t.hostWidth]: refs.width,
|
8298
|
-
[vars$t.hostMinWidth]: refs.minWidth,
|
8299
8642
|
[vars$t.hostDirection]: refs.direction,
|
8300
8643
|
[vars$t.fontSize]: refs.fontSize,
|
8301
8644
|
[vars$t.fontFamily]: refs.fontFamily,
|
8302
8645
|
[vars$t.labelTextColor]: refs.labelTextColor,
|
8303
|
-
[vars$t.labelRequiredIndicator]: refs.requiredIndicator,
|
8304
8646
|
[vars$t.errorMessageTextColor]: refs.errorMessageTextColor,
|
8647
|
+
[vars$t.inputHorizontalPadding]: refs.horizontalPadding,
|
8648
|
+
[vars$t.inputHeight]: refs.inputHeight,
|
8649
|
+
[vars$t.inputBackgroundColor]: refs.backgroundColor,
|
8650
|
+
[vars$t.labelRequiredIndicator]: refs.requiredIndicator,
|
8305
8651
|
[vars$t.inputValueTextColor]: refs.valueTextColor,
|
8306
|
-
[vars$t.
|
8652
|
+
[vars$t.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
8307
8653
|
[vars$t.inputBorderWidth]: refs.borderWidth,
|
8308
8654
|
[vars$t.inputBorderStyle]: refs.borderStyle,
|
8309
8655
|
[vars$t.inputBorderColor]: refs.borderColor,
|
@@ -8312,34 +8658,28 @@ const textField = {
|
|
8312
8658
|
[vars$t.inputOutlineStyle]: refs.outlineStyle,
|
8313
8659
|
[vars$t.inputOutlineColor]: refs.outlineColor,
|
8314
8660
|
[vars$t.inputOutlineOffset]: refs.outlineOffset,
|
8315
|
-
[vars$t.
|
8316
|
-
[vars$t.
|
8317
|
-
[vars$t.inputHorizontalPadding]: refs.horizontalPadding,
|
8661
|
+
[vars$t.revealButtonOffset]: globalRefs$g.spacing.md,
|
8662
|
+
[vars$t.revealButtonSize]: refs.toggleButtonSize,
|
8318
8663
|
};
|
8319
8664
|
|
8320
|
-
var
|
8665
|
+
var password$1 = /*#__PURE__*/Object.freeze({
|
8321
8666
|
__proto__: null,
|
8322
|
-
default:
|
8323
|
-
textField: textField,
|
8667
|
+
default: password,
|
8324
8668
|
vars: vars$t
|
8325
8669
|
});
|
8326
8670
|
|
8327
|
-
const
|
8328
|
-
const vars$s = PasswordClass.cssVarList;
|
8671
|
+
const vars$s = NumberFieldClass.cssVarList;
|
8329
8672
|
|
8330
|
-
const
|
8673
|
+
const numberField = {
|
8331
8674
|
[vars$s.hostWidth]: refs.width,
|
8675
|
+
[vars$s.hostMinWidth]: refs.minWidth,
|
8332
8676
|
[vars$s.hostDirection]: refs.direction,
|
8333
8677
|
[vars$s.fontSize]: refs.fontSize,
|
8334
8678
|
[vars$s.fontFamily]: refs.fontFamily,
|
8335
8679
|
[vars$s.labelTextColor]: refs.labelTextColor,
|
8336
8680
|
[vars$s.errorMessageTextColor]: refs.errorMessageTextColor,
|
8337
|
-
[vars$s.inputHorizontalPadding]: refs.horizontalPadding,
|
8338
|
-
[vars$s.inputHeight]: refs.inputHeight,
|
8339
|
-
[vars$s.inputBackgroundColor]: refs.backgroundColor,
|
8340
|
-
[vars$s.labelRequiredIndicator]: refs.requiredIndicator,
|
8341
8681
|
[vars$s.inputValueTextColor]: refs.valueTextColor,
|
8342
|
-
[vars$s.
|
8682
|
+
[vars$s.inputPlaceholderColor]: refs.placeholderTextColor,
|
8343
8683
|
[vars$s.inputBorderWidth]: refs.borderWidth,
|
8344
8684
|
[vars$s.inputBorderStyle]: refs.borderStyle,
|
8345
8685
|
[vars$s.inputBorderColor]: refs.borderColor,
|
@@ -8348,19 +8688,21 @@ const password = {
|
|
8348
8688
|
[vars$s.inputOutlineStyle]: refs.outlineStyle,
|
8349
8689
|
[vars$s.inputOutlineColor]: refs.outlineColor,
|
8350
8690
|
[vars$s.inputOutlineOffset]: refs.outlineOffset,
|
8351
|
-
[vars$s.
|
8352
|
-
[vars$s.
|
8691
|
+
[vars$s.inputBackgroundColor]: refs.backgroundColor,
|
8692
|
+
[vars$s.labelRequiredIndicator]: refs.requiredIndicator,
|
8693
|
+
[vars$s.inputHorizontalPadding]: refs.horizontalPadding,
|
8694
|
+
[vars$s.inputHeight]: refs.inputHeight,
|
8353
8695
|
};
|
8354
8696
|
|
8355
|
-
var
|
8697
|
+
var numberField$1 = /*#__PURE__*/Object.freeze({
|
8356
8698
|
__proto__: null,
|
8357
|
-
default:
|
8699
|
+
default: numberField,
|
8358
8700
|
vars: vars$s
|
8359
8701
|
});
|
8360
8702
|
|
8361
|
-
const vars$r =
|
8703
|
+
const vars$r = EmailFieldClass.cssVarList;
|
8362
8704
|
|
8363
|
-
const
|
8705
|
+
const emailField = {
|
8364
8706
|
[vars$r.hostWidth]: refs.width,
|
8365
8707
|
[vars$r.hostMinWidth]: refs.minWidth,
|
8366
8708
|
[vars$r.hostDirection]: refs.direction,
|
@@ -8369,6 +8711,7 @@ const numberField = {
|
|
8369
8711
|
[vars$r.labelTextColor]: refs.labelTextColor,
|
8370
8712
|
[vars$r.errorMessageTextColor]: refs.errorMessageTextColor,
|
8371
8713
|
[vars$r.inputValueTextColor]: refs.valueTextColor,
|
8714
|
+
[vars$r.labelRequiredIndicator]: refs.requiredIndicator,
|
8372
8715
|
[vars$r.inputPlaceholderColor]: refs.placeholderTextColor,
|
8373
8716
|
[vars$r.inputBorderWidth]: refs.borderWidth,
|
8374
8717
|
[vars$r.inputBorderStyle]: refs.borderStyle,
|
@@ -8379,198 +8722,165 @@ const numberField = {
|
|
8379
8722
|
[vars$r.inputOutlineColor]: refs.outlineColor,
|
8380
8723
|
[vars$r.inputOutlineOffset]: refs.outlineOffset,
|
8381
8724
|
[vars$r.inputBackgroundColor]: refs.backgroundColor,
|
8382
|
-
[vars$r.labelRequiredIndicator]: refs.requiredIndicator,
|
8383
8725
|
[vars$r.inputHorizontalPadding]: refs.horizontalPadding,
|
8384
8726
|
[vars$r.inputHeight]: refs.inputHeight,
|
8385
8727
|
};
|
8386
8728
|
|
8387
|
-
var
|
8729
|
+
var emailField$1 = /*#__PURE__*/Object.freeze({
|
8388
8730
|
__proto__: null,
|
8389
|
-
default:
|
8731
|
+
default: emailField,
|
8390
8732
|
vars: vars$r
|
8391
8733
|
});
|
8392
8734
|
|
8393
|
-
const
|
8735
|
+
const globalRefs$f = getThemeRefs(globals);
|
8736
|
+
const vars$q = TextAreaClass.cssVarList;
|
8394
8737
|
|
8395
|
-
const
|
8738
|
+
const textArea = {
|
8396
8739
|
[vars$q.hostWidth]: refs.width,
|
8397
8740
|
[vars$q.hostMinWidth]: refs.minWidth,
|
8398
8741
|
[vars$q.hostDirection]: refs.direction,
|
8399
8742
|
[vars$q.fontSize]: refs.fontSize,
|
8400
8743
|
[vars$q.fontFamily]: refs.fontFamily,
|
8401
8744
|
[vars$q.labelTextColor]: refs.labelTextColor,
|
8745
|
+
[vars$q.labelRequiredIndicator]: refs.requiredIndicator,
|
8402
8746
|
[vars$q.errorMessageTextColor]: refs.errorMessageTextColor,
|
8747
|
+
[vars$q.inputBackgroundColor]: refs.backgroundColor,
|
8403
8748
|
[vars$q.inputValueTextColor]: refs.valueTextColor,
|
8404
|
-
[vars$q.
|
8405
|
-
[vars$q.
|
8749
|
+
[vars$q.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
8750
|
+
[vars$q.inputBorderRadius]: refs.borderRadius,
|
8406
8751
|
[vars$q.inputBorderWidth]: refs.borderWidth,
|
8407
8752
|
[vars$q.inputBorderStyle]: refs.borderStyle,
|
8408
8753
|
[vars$q.inputBorderColor]: refs.borderColor,
|
8409
|
-
[vars$q.inputBorderRadius]: refs.borderRadius,
|
8410
8754
|
[vars$q.inputOutlineWidth]: refs.outlineWidth,
|
8411
8755
|
[vars$q.inputOutlineStyle]: refs.outlineStyle,
|
8412
8756
|
[vars$q.inputOutlineColor]: refs.outlineColor,
|
8413
8757
|
[vars$q.inputOutlineOffset]: refs.outlineOffset,
|
8414
|
-
[vars$q.
|
8415
|
-
[vars$q.
|
8416
|
-
|
8758
|
+
[vars$q.inputResizeType]: 'vertical',
|
8759
|
+
[vars$q.inputMinHeight]: '5em',
|
8760
|
+
|
8761
|
+
_disabled: {
|
8762
|
+
[vars$q.inputBackgroundColor]: globalRefs$f.colors.surface.light,
|
8763
|
+
},
|
8764
|
+
|
8765
|
+
_readonly: {
|
8766
|
+
[vars$q.inputResizeType]: 'none',
|
8767
|
+
},
|
8417
8768
|
};
|
8418
8769
|
|
8419
|
-
var
|
8770
|
+
var textArea$1 = /*#__PURE__*/Object.freeze({
|
8420
8771
|
__proto__: null,
|
8421
|
-
default:
|
8772
|
+
default: textArea,
|
8422
8773
|
vars: vars$q
|
8423
8774
|
});
|
8424
8775
|
|
8425
|
-
const
|
8426
|
-
const
|
8776
|
+
const vars$p = CheckboxClass.cssVarList;
|
8777
|
+
const checkboxSize = '1.35em';
|
8427
8778
|
|
8428
|
-
const
|
8779
|
+
const checkbox = {
|
8429
8780
|
[vars$p.hostWidth]: refs.width,
|
8430
|
-
[vars$p.hostMinWidth]: refs.minWidth,
|
8431
8781
|
[vars$p.hostDirection]: refs.direction,
|
8432
8782
|
[vars$p.fontSize]: refs.fontSize,
|
8433
8783
|
[vars$p.fontFamily]: refs.fontFamily,
|
8434
8784
|
[vars$p.labelTextColor]: refs.labelTextColor,
|
8435
8785
|
[vars$p.labelRequiredIndicator]: refs.requiredIndicator,
|
8786
|
+
[vars$p.labelFontWeight]: '400',
|
8787
|
+
[vars$p.labelLineHeight]: checkboxSize,
|
8788
|
+
[vars$p.labelSpacing]: '1em',
|
8436
8789
|
[vars$p.errorMessageTextColor]: refs.errorMessageTextColor,
|
8437
|
-
[vars$p.
|
8438
|
-
[vars$p.
|
8439
|
-
[vars$p.
|
8790
|
+
[vars$p.inputOutlineWidth]: refs.outlineWidth,
|
8791
|
+
[vars$p.inputOutlineOffset]: refs.outlineOffset,
|
8792
|
+
[vars$p.inputOutlineColor]: refs.outlineColor,
|
8793
|
+
[vars$p.inputOutlineStyle]: refs.outlineStyle,
|
8440
8794
|
[vars$p.inputBorderRadius]: refs.borderRadius,
|
8795
|
+
[vars$p.inputBorderColor]: refs.borderColor,
|
8441
8796
|
[vars$p.inputBorderWidth]: refs.borderWidth,
|
8442
8797
|
[vars$p.inputBorderStyle]: refs.borderStyle,
|
8443
|
-
[vars$p.
|
8444
|
-
[vars$p.
|
8445
|
-
[vars$p.inputOutlineStyle]: refs.outlineStyle,
|
8446
|
-
[vars$p.inputOutlineColor]: refs.outlineColor,
|
8447
|
-
[vars$p.inputOutlineOffset]: refs.outlineOffset,
|
8448
|
-
[vars$p.inputResizeType]: 'vertical',
|
8449
|
-
[vars$p.inputMinHeight]: '5em',
|
8798
|
+
[vars$p.inputBackgroundColor]: refs.backgroundColor,
|
8799
|
+
[vars$p.inputSize]: checkboxSize,
|
8450
8800
|
|
8451
|
-
|
8452
|
-
[vars$p.
|
8801
|
+
_checked: {
|
8802
|
+
[vars$p.inputValueTextColor]: refs.valueTextColor,
|
8453
8803
|
},
|
8454
8804
|
|
8455
|
-
|
8456
|
-
[vars$p.
|
8805
|
+
_disabled: {
|
8806
|
+
[vars$p.labelTextColor]: refs.labelTextColor,
|
8457
8807
|
},
|
8458
8808
|
};
|
8459
8809
|
|
8460
|
-
var
|
8810
|
+
var checkbox$1 = /*#__PURE__*/Object.freeze({
|
8461
8811
|
__proto__: null,
|
8462
|
-
default:
|
8812
|
+
default: checkbox,
|
8463
8813
|
vars: vars$p
|
8464
8814
|
});
|
8465
8815
|
|
8466
|
-
const
|
8467
|
-
const
|
8816
|
+
const knobMargin = '2px';
|
8817
|
+
const checkboxHeight = '1.25em';
|
8468
8818
|
|
8469
|
-
const
|
8819
|
+
const globalRefs$e = getThemeRefs(globals);
|
8820
|
+
const vars$o = SwitchToggleClass.cssVarList;
|
8821
|
+
|
8822
|
+
const switchToggle = {
|
8470
8823
|
[vars$o.hostWidth]: refs.width,
|
8471
8824
|
[vars$o.hostDirection]: refs.direction,
|
8472
8825
|
[vars$o.fontSize]: refs.fontSize,
|
8473
8826
|
[vars$o.fontFamily]: refs.fontFamily,
|
8474
|
-
|
8475
|
-
[vars$o.labelRequiredIndicator]: refs.requiredIndicator,
|
8476
|
-
[vars$o.labelFontWeight]: '400',
|
8477
|
-
[vars$o.labelLineHeight]: checkboxSize,
|
8478
|
-
[vars$o.labelSpacing]: '1em',
|
8479
|
-
[vars$o.errorMessageTextColor]: refs.errorMessageTextColor,
|
8827
|
+
|
8480
8828
|
[vars$o.inputOutlineWidth]: refs.outlineWidth,
|
8481
8829
|
[vars$o.inputOutlineOffset]: refs.outlineOffset,
|
8482
8830
|
[vars$o.inputOutlineColor]: refs.outlineColor,
|
8483
8831
|
[vars$o.inputOutlineStyle]: refs.outlineStyle,
|
8484
|
-
[vars$o.inputBorderRadius]: refs.borderRadius,
|
8485
|
-
[vars$o.inputBorderColor]: refs.borderColor,
|
8486
|
-
[vars$o.inputBorderWidth]: refs.borderWidth,
|
8487
|
-
[vars$o.inputBorderStyle]: refs.borderStyle,
|
8488
|
-
[vars$o.inputBackgroundColor]: refs.backgroundColor,
|
8489
|
-
[vars$o.inputSize]: checkboxSize,
|
8490
8832
|
|
8491
|
-
|
8492
|
-
|
8493
|
-
|
8494
|
-
|
8495
|
-
|
8496
|
-
|
8497
|
-
|
8498
|
-
|
8833
|
+
[vars$o.trackBorderStyle]: refs.borderStyle,
|
8834
|
+
[vars$o.trackBorderWidth]: refs.borderWidth, // var `trackBorderWidth` used outside the theme for `left` margin calculation
|
8835
|
+
[vars$o.trackBorderColor]: refs.borderColor,
|
8836
|
+
[vars$o.trackBackgroundColor]: 'none',
|
8837
|
+
[vars$o.trackBorderRadius]: globalRefs$e.radius.md,
|
8838
|
+
[vars$o.trackWidth]: '2.5em', // var `trackWidth` used outside the theme for `left` margin calculation
|
8839
|
+
[vars$o.trackHeight]: checkboxHeight,
|
8840
|
+
|
8841
|
+
[vars$o.knobSize]: `calc(1em - ${knobMargin})`,
|
8842
|
+
[vars$o.knobRadius]: '50%',
|
8843
|
+
[vars$o.knobTopOffset]: '1px',
|
8844
|
+
[vars$o.knobLeftOffset]: knobMargin,
|
8845
|
+
[vars$o.knobColor]: refs.valueTextColor,
|
8846
|
+
[vars$o.knobTransitionDuration]: '0.3s',
|
8499
8847
|
|
8500
|
-
|
8501
|
-
|
8502
|
-
|
8503
|
-
vars:
|
8504
|
-
|
8505
|
-
|
8506
|
-
const knobMargin = '2px';
|
8507
|
-
const checkboxHeight = '1.25em';
|
8508
|
-
|
8509
|
-
const globalRefs$e = getThemeRefs(globals);
|
8510
|
-
const vars$n = SwitchToggleClass.cssVarList;
|
8511
|
-
|
8512
|
-
const switchToggle = {
|
8513
|
-
[vars$n.hostWidth]: refs.width,
|
8514
|
-
[vars$n.hostDirection]: refs.direction,
|
8515
|
-
[vars$n.fontSize]: refs.fontSize,
|
8516
|
-
[vars$n.fontFamily]: refs.fontFamily,
|
8517
|
-
|
8518
|
-
[vars$n.inputOutlineWidth]: refs.outlineWidth,
|
8519
|
-
[vars$n.inputOutlineOffset]: refs.outlineOffset,
|
8520
|
-
[vars$n.inputOutlineColor]: refs.outlineColor,
|
8521
|
-
[vars$n.inputOutlineStyle]: refs.outlineStyle,
|
8522
|
-
|
8523
|
-
[vars$n.trackBorderStyle]: refs.borderStyle,
|
8524
|
-
[vars$n.trackBorderWidth]: refs.borderWidth, // var `trackBorderWidth` used outside the theme for `left` margin calculation
|
8525
|
-
[vars$n.trackBorderColor]: refs.borderColor,
|
8526
|
-
[vars$n.trackBackgroundColor]: 'none',
|
8527
|
-
[vars$n.trackBorderRadius]: globalRefs$e.radius.md,
|
8528
|
-
[vars$n.trackWidth]: '2.5em', // var `trackWidth` used outside the theme for `left` margin calculation
|
8529
|
-
[vars$n.trackHeight]: checkboxHeight,
|
8530
|
-
|
8531
|
-
[vars$n.knobSize]: `calc(1em - ${knobMargin})`,
|
8532
|
-
[vars$n.knobRadius]: '50%',
|
8533
|
-
[vars$n.knobTopOffset]: '1px',
|
8534
|
-
[vars$n.knobLeftOffset]: knobMargin,
|
8535
|
-
[vars$n.knobColor]: refs.valueTextColor,
|
8536
|
-
[vars$n.knobTransitionDuration]: '0.3s',
|
8537
|
-
|
8538
|
-
[vars$n.labelTextColor]: refs.labelTextColor,
|
8539
|
-
[vars$n.labelFontWeight]: '400',
|
8540
|
-
[vars$n.labelLineHeight]: '1.35em',
|
8541
|
-
[vars$n.labelSpacing]: '1em',
|
8542
|
-
[vars$n.labelRequiredIndicator]: refs.requiredIndicator,
|
8543
|
-
[vars$n.errorMessageTextColor]: refs.errorMessageTextColor,
|
8848
|
+
[vars$o.labelTextColor]: refs.labelTextColor,
|
8849
|
+
[vars$o.labelFontWeight]: '400',
|
8850
|
+
[vars$o.labelLineHeight]: '1.35em',
|
8851
|
+
[vars$o.labelSpacing]: '1em',
|
8852
|
+
[vars$o.labelRequiredIndicator]: refs.requiredIndicator,
|
8853
|
+
[vars$o.errorMessageTextColor]: refs.errorMessageTextColor,
|
8544
8854
|
|
8545
8855
|
_checked: {
|
8546
|
-
[vars$
|
8547
|
-
[vars$
|
8548
|
-
[vars$
|
8549
|
-
[vars$
|
8550
|
-
[vars$
|
8856
|
+
[vars$o.trackBorderColor]: refs.borderColor,
|
8857
|
+
[vars$o.trackBackgroundColor]: refs.backgroundColor,
|
8858
|
+
[vars$o.knobLeftOffset]: `calc(100% - var(${vars$o.knobSize}) - ${knobMargin})`,
|
8859
|
+
[vars$o.knobColor]: refs.valueTextColor,
|
8860
|
+
[vars$o.knobTextColor]: refs.valueTextColor,
|
8551
8861
|
},
|
8552
8862
|
|
8553
8863
|
_disabled: {
|
8554
|
-
[vars$
|
8555
|
-
[vars$
|
8556
|
-
[vars$
|
8557
|
-
[vars$
|
8864
|
+
[vars$o.knobColor]: globalRefs$e.colors.surface.light,
|
8865
|
+
[vars$o.trackBorderColor]: globalRefs$e.colors.surface.main,
|
8866
|
+
[vars$o.trackBackgroundColor]: globalRefs$e.colors.surface.main,
|
8867
|
+
[vars$o.labelTextColor]: refs.labelTextColor,
|
8558
8868
|
_checked: {
|
8559
|
-
[vars$
|
8560
|
-
[vars$
|
8869
|
+
[vars$o.knobColor]: globalRefs$e.colors.surface.light,
|
8870
|
+
[vars$o.trackBackgroundColor]: globalRefs$e.colors.surface.main,
|
8561
8871
|
},
|
8562
8872
|
},
|
8563
8873
|
|
8564
8874
|
_invalid: {
|
8565
|
-
[vars$
|
8566
|
-
[vars$
|
8875
|
+
[vars$o.trackBorderColor]: globalRefs$e.colors.error.main,
|
8876
|
+
[vars$o.knobColor]: globalRefs$e.colors.error.main,
|
8567
8877
|
},
|
8568
8878
|
};
|
8569
8879
|
|
8570
8880
|
var switchToggle$1 = /*#__PURE__*/Object.freeze({
|
8571
8881
|
__proto__: null,
|
8572
8882
|
default: switchToggle,
|
8573
|
-
vars: vars$
|
8883
|
+
vars: vars$o
|
8574
8884
|
});
|
8575
8885
|
|
8576
8886
|
const globalRefs$d = getThemeRefs(globals);
|
@@ -8595,7 +8905,7 @@ const [helperTheme$2, helperRefs$2, helperVars$2] = createHelperVars(
|
|
8595
8905
|
horizontalAlignment,
|
8596
8906
|
shadowColor: '#00000020', // if we want to support transparency vars, we should use different color format
|
8597
8907
|
},
|
8598
|
-
componentName$
|
8908
|
+
componentName$A
|
8599
8909
|
);
|
8600
8910
|
|
8601
8911
|
const { shadowColor: shadowColor$1 } = helperRefs$2;
|
@@ -8680,7 +8990,7 @@ const container = {
|
|
8680
8990
|
},
|
8681
8991
|
};
|
8682
8992
|
|
8683
|
-
const vars$
|
8993
|
+
const vars$n = {
|
8684
8994
|
...compVars$3,
|
8685
8995
|
...helperVars$2,
|
8686
8996
|
};
|
@@ -8688,154 +8998,154 @@ const vars$m = {
|
|
8688
8998
|
var container$1 = /*#__PURE__*/Object.freeze({
|
8689
8999
|
__proto__: null,
|
8690
9000
|
default: container,
|
8691
|
-
vars: vars$
|
9001
|
+
vars: vars$n
|
8692
9002
|
});
|
8693
9003
|
|
8694
|
-
const vars$
|
9004
|
+
const vars$m = LogoClass.cssVarList;
|
8695
9005
|
|
8696
9006
|
const logo$1 = {
|
8697
|
-
[vars$
|
9007
|
+
[vars$m.fallbackUrl]: 'url(https://imgs.descope.com/components/no-logo-placeholder.svg)',
|
8698
9008
|
};
|
8699
9009
|
|
8700
9010
|
var logo$2 = /*#__PURE__*/Object.freeze({
|
8701
9011
|
__proto__: null,
|
8702
9012
|
default: logo$1,
|
8703
|
-
vars: vars$
|
9013
|
+
vars: vars$m
|
8704
9014
|
});
|
8705
9015
|
|
8706
|
-
const vars$
|
9016
|
+
const vars$l = TotpImageClass.cssVarList;
|
8707
9017
|
|
8708
9018
|
const logo = {
|
8709
|
-
[vars$
|
9019
|
+
[vars$l.fallbackUrl]: 'url(https://imgs.descope.com/components/totp-placeholder.svg)',
|
8710
9020
|
};
|
8711
9021
|
|
8712
9022
|
var totpImage = /*#__PURE__*/Object.freeze({
|
8713
9023
|
__proto__: null,
|
8714
9024
|
default: logo,
|
8715
|
-
vars: vars$
|
9025
|
+
vars: vars$l
|
8716
9026
|
});
|
8717
9027
|
|
8718
9028
|
const globalRefs$c = getThemeRefs(globals);
|
8719
|
-
const vars$
|
9029
|
+
const vars$k = TextClass.cssVarList;
|
8720
9030
|
|
8721
9031
|
const text = {
|
8722
|
-
[vars$
|
8723
|
-
[vars$
|
8724
|
-
[vars$
|
8725
|
-
[vars$
|
9032
|
+
[vars$k.hostDirection]: globalRefs$c.direction,
|
9033
|
+
[vars$k.textLineHeight]: '1.35em',
|
9034
|
+
[vars$k.textAlign]: 'left',
|
9035
|
+
[vars$k.textColor]: globalRefs$c.colors.surface.dark,
|
8726
9036
|
variant: {
|
8727
9037
|
h1: {
|
8728
|
-
[vars$
|
8729
|
-
[vars$
|
8730
|
-
[vars$
|
9038
|
+
[vars$k.fontSize]: globalRefs$c.typography.h1.size,
|
9039
|
+
[vars$k.fontWeight]: globalRefs$c.typography.h1.weight,
|
9040
|
+
[vars$k.fontFamily]: globalRefs$c.typography.h1.font,
|
8731
9041
|
},
|
8732
9042
|
h2: {
|
8733
|
-
[vars$
|
8734
|
-
[vars$
|
8735
|
-
[vars$
|
9043
|
+
[vars$k.fontSize]: globalRefs$c.typography.h2.size,
|
9044
|
+
[vars$k.fontWeight]: globalRefs$c.typography.h2.weight,
|
9045
|
+
[vars$k.fontFamily]: globalRefs$c.typography.h2.font,
|
8736
9046
|
},
|
8737
9047
|
h3: {
|
8738
|
-
[vars$
|
8739
|
-
[vars$
|
8740
|
-
[vars$
|
9048
|
+
[vars$k.fontSize]: globalRefs$c.typography.h3.size,
|
9049
|
+
[vars$k.fontWeight]: globalRefs$c.typography.h3.weight,
|
9050
|
+
[vars$k.fontFamily]: globalRefs$c.typography.h3.font,
|
8741
9051
|
},
|
8742
9052
|
subtitle1: {
|
8743
|
-
[vars$
|
8744
|
-
[vars$
|
8745
|
-
[vars$
|
9053
|
+
[vars$k.fontSize]: globalRefs$c.typography.subtitle1.size,
|
9054
|
+
[vars$k.fontWeight]: globalRefs$c.typography.subtitle1.weight,
|
9055
|
+
[vars$k.fontFamily]: globalRefs$c.typography.subtitle1.font,
|
8746
9056
|
},
|
8747
9057
|
subtitle2: {
|
8748
|
-
[vars$
|
8749
|
-
[vars$
|
8750
|
-
[vars$
|
9058
|
+
[vars$k.fontSize]: globalRefs$c.typography.subtitle2.size,
|
9059
|
+
[vars$k.fontWeight]: globalRefs$c.typography.subtitle2.weight,
|
9060
|
+
[vars$k.fontFamily]: globalRefs$c.typography.subtitle2.font,
|
8751
9061
|
},
|
8752
9062
|
body1: {
|
8753
|
-
[vars$
|
8754
|
-
[vars$
|
8755
|
-
[vars$
|
9063
|
+
[vars$k.fontSize]: globalRefs$c.typography.body1.size,
|
9064
|
+
[vars$k.fontWeight]: globalRefs$c.typography.body1.weight,
|
9065
|
+
[vars$k.fontFamily]: globalRefs$c.typography.body1.font,
|
8756
9066
|
},
|
8757
9067
|
body2: {
|
8758
|
-
[vars$
|
8759
|
-
[vars$
|
8760
|
-
[vars$
|
9068
|
+
[vars$k.fontSize]: globalRefs$c.typography.body2.size,
|
9069
|
+
[vars$k.fontWeight]: globalRefs$c.typography.body2.weight,
|
9070
|
+
[vars$k.fontFamily]: globalRefs$c.typography.body2.font,
|
8761
9071
|
},
|
8762
9072
|
},
|
8763
9073
|
|
8764
9074
|
mode: {
|
8765
9075
|
primary: {
|
8766
|
-
[vars$
|
9076
|
+
[vars$k.textColor]: globalRefs$c.colors.primary.main,
|
8767
9077
|
},
|
8768
9078
|
secondary: {
|
8769
|
-
[vars$
|
9079
|
+
[vars$k.textColor]: globalRefs$c.colors.secondary.main,
|
8770
9080
|
},
|
8771
9081
|
error: {
|
8772
|
-
[vars$
|
9082
|
+
[vars$k.textColor]: globalRefs$c.colors.error.main,
|
8773
9083
|
},
|
8774
9084
|
success: {
|
8775
|
-
[vars$
|
9085
|
+
[vars$k.textColor]: globalRefs$c.colors.success.main,
|
8776
9086
|
},
|
8777
9087
|
},
|
8778
9088
|
|
8779
9089
|
textAlign: {
|
8780
|
-
right: { [vars$
|
8781
|
-
left: { [vars$
|
8782
|
-
center: { [vars$
|
9090
|
+
right: { [vars$k.textAlign]: 'right' },
|
9091
|
+
left: { [vars$k.textAlign]: 'left' },
|
9092
|
+
center: { [vars$k.textAlign]: 'center' },
|
8783
9093
|
},
|
8784
9094
|
|
8785
9095
|
_fullWidth: {
|
8786
|
-
[vars$
|
9096
|
+
[vars$k.hostWidth]: '100%',
|
8787
9097
|
},
|
8788
9098
|
|
8789
9099
|
_italic: {
|
8790
|
-
[vars$
|
9100
|
+
[vars$k.fontStyle]: 'italic',
|
8791
9101
|
},
|
8792
9102
|
|
8793
9103
|
_uppercase: {
|
8794
|
-
[vars$
|
9104
|
+
[vars$k.textTransform]: 'uppercase',
|
8795
9105
|
},
|
8796
9106
|
|
8797
9107
|
_lowercase: {
|
8798
|
-
[vars$
|
9108
|
+
[vars$k.textTransform]: 'lowercase',
|
8799
9109
|
},
|
8800
9110
|
};
|
8801
9111
|
|
8802
9112
|
var text$1 = /*#__PURE__*/Object.freeze({
|
8803
9113
|
__proto__: null,
|
8804
9114
|
default: text,
|
8805
|
-
vars: vars$
|
9115
|
+
vars: vars$k
|
8806
9116
|
});
|
8807
9117
|
|
8808
9118
|
const globalRefs$b = getThemeRefs(globals);
|
8809
|
-
const vars$
|
9119
|
+
const vars$j = LinkClass.cssVarList;
|
8810
9120
|
|
8811
9121
|
const link = {
|
8812
|
-
[vars$
|
8813
|
-
[vars$
|
9122
|
+
[vars$j.hostDirection]: globalRefs$b.direction,
|
9123
|
+
[vars$j.cursor]: 'pointer',
|
8814
9124
|
|
8815
|
-
[vars$
|
9125
|
+
[vars$j.textColor]: globalRefs$b.colors.primary.main,
|
8816
9126
|
|
8817
9127
|
textAlign: {
|
8818
|
-
right: { [vars$
|
8819
|
-
left: { [vars$
|
8820
|
-
center: { [vars$
|
9128
|
+
right: { [vars$j.textAlign]: 'right' },
|
9129
|
+
left: { [vars$j.textAlign]: 'left' },
|
9130
|
+
center: { [vars$j.textAlign]: 'center' },
|
8821
9131
|
},
|
8822
9132
|
|
8823
9133
|
_fullWidth: {
|
8824
|
-
[vars$
|
9134
|
+
[vars$j.hostWidth]: '100%',
|
8825
9135
|
},
|
8826
9136
|
|
8827
9137
|
mode: {
|
8828
9138
|
primary: {
|
8829
|
-
[vars$
|
9139
|
+
[vars$j.textColor]: globalRefs$b.colors.primary.main,
|
8830
9140
|
},
|
8831
9141
|
secondary: {
|
8832
|
-
[vars$
|
9142
|
+
[vars$j.textColor]: globalRefs$b.colors.secondary.main,
|
8833
9143
|
},
|
8834
9144
|
error: {
|
8835
|
-
[vars$
|
9145
|
+
[vars$j.textColor]: globalRefs$b.colors.error.main,
|
8836
9146
|
},
|
8837
9147
|
success: {
|
8838
|
-
[vars$
|
9148
|
+
[vars$j.textColor]: globalRefs$b.colors.success.main,
|
8839
9149
|
},
|
8840
9150
|
},
|
8841
9151
|
};
|
@@ -8843,7 +9153,7 @@ const link = {
|
|
8843
9153
|
var link$1 = /*#__PURE__*/Object.freeze({
|
8844
9154
|
__proto__: null,
|
8845
9155
|
default: link,
|
8846
|
-
vars: vars$
|
9156
|
+
vars: vars$j
|
8847
9157
|
});
|
8848
9158
|
|
8849
9159
|
const globalRefs$a = getThemeRefs(globals);
|
@@ -8854,7 +9164,7 @@ const [helperTheme$1, helperRefs$1, helperVars$1] = createHelperVars(
|
|
8854
9164
|
thickness: '2px',
|
8855
9165
|
spacing: '10px',
|
8856
9166
|
},
|
8857
|
-
componentName$
|
9167
|
+
componentName$y
|
8858
9168
|
);
|
8859
9169
|
|
8860
9170
|
const divider = {
|
@@ -8885,7 +9195,7 @@ const divider = {
|
|
8885
9195
|
},
|
8886
9196
|
};
|
8887
9197
|
|
8888
|
-
const vars$
|
9198
|
+
const vars$i = {
|
8889
9199
|
...compVars$2,
|
8890
9200
|
...helperVars$1,
|
8891
9201
|
};
|
@@ -8893,93 +9203,93 @@ const vars$h = {
|
|
8893
9203
|
var divider$1 = /*#__PURE__*/Object.freeze({
|
8894
9204
|
__proto__: null,
|
8895
9205
|
default: divider,
|
8896
|
-
vars: vars$
|
9206
|
+
vars: vars$i
|
8897
9207
|
});
|
8898
9208
|
|
8899
|
-
const vars$
|
9209
|
+
const vars$h = PasscodeClass.cssVarList;
|
8900
9210
|
|
8901
9211
|
const passcode = {
|
8902
|
-
[vars$
|
8903
|
-
[vars$
|
8904
|
-
[vars$
|
8905
|
-
[vars$
|
8906
|
-
[vars$
|
8907
|
-
[vars$
|
8908
|
-
[vars$
|
8909
|
-
[vars$
|
8910
|
-
[vars$
|
8911
|
-
[vars$
|
8912
|
-
[vars$
|
8913
|
-
[vars$
|
8914
|
-
[vars$
|
8915
|
-
[vars$
|
8916
|
-
[vars$
|
9212
|
+
[vars$h.hostDirection]: refs.direction,
|
9213
|
+
[vars$h.fontFamily]: refs.fontFamily,
|
9214
|
+
[vars$h.fontSize]: refs.fontSize,
|
9215
|
+
[vars$h.labelTextColor]: refs.labelTextColor,
|
9216
|
+
[vars$h.labelRequiredIndicator]: refs.requiredIndicator,
|
9217
|
+
[vars$h.errorMessageTextColor]: refs.errorMessageTextColor,
|
9218
|
+
[vars$h.digitValueTextColor]: refs.valueTextColor,
|
9219
|
+
[vars$h.digitPadding]: '0',
|
9220
|
+
[vars$h.digitTextAlign]: 'center',
|
9221
|
+
[vars$h.digitSpacing]: '4px',
|
9222
|
+
[vars$h.hostWidth]: refs.width,
|
9223
|
+
[vars$h.digitOutlineColor]: 'transparent',
|
9224
|
+
[vars$h.digitOutlineWidth]: refs.outlineWidth,
|
9225
|
+
[vars$h.focusedDigitFieldOutlineColor]: refs.outlineColor,
|
9226
|
+
[vars$h.digitSize]: refs.inputHeight,
|
8917
9227
|
|
8918
9228
|
size: {
|
8919
|
-
xs: { [vars$
|
8920
|
-
sm: { [vars$
|
8921
|
-
md: { [vars$
|
8922
|
-
lg: { [vars$
|
9229
|
+
xs: { [vars$h.spinnerSize]: '15px' },
|
9230
|
+
sm: { [vars$h.spinnerSize]: '20px' },
|
9231
|
+
md: { [vars$h.spinnerSize]: '20px' },
|
9232
|
+
lg: { [vars$h.spinnerSize]: '20px' },
|
8923
9233
|
},
|
8924
9234
|
|
8925
9235
|
_hideCursor: {
|
8926
|
-
[vars$
|
9236
|
+
[vars$h.digitCaretTextColor]: 'transparent',
|
8927
9237
|
},
|
8928
9238
|
|
8929
9239
|
_loading: {
|
8930
|
-
[vars$
|
9240
|
+
[vars$h.overlayOpacity]: refs.overlayOpacity,
|
8931
9241
|
},
|
8932
9242
|
};
|
8933
9243
|
|
8934
9244
|
var passcode$1 = /*#__PURE__*/Object.freeze({
|
8935
9245
|
__proto__: null,
|
8936
9246
|
default: passcode,
|
8937
|
-
vars: vars$
|
9247
|
+
vars: vars$h
|
8938
9248
|
});
|
8939
9249
|
|
8940
9250
|
const globalRefs$9 = getThemeRefs(globals);
|
8941
|
-
const vars$
|
9251
|
+
const vars$g = LoaderLinearClass.cssVarList;
|
8942
9252
|
|
8943
9253
|
const loaderLinear = {
|
8944
|
-
[vars$
|
8945
|
-
[vars$
|
9254
|
+
[vars$g.hostDisplay]: 'inline-block',
|
9255
|
+
[vars$g.hostWidth]: '100%',
|
8946
9256
|
|
8947
|
-
[vars$
|
8948
|
-
[vars$
|
9257
|
+
[vars$g.barColor]: globalRefs$9.colors.surface.contrast,
|
9258
|
+
[vars$g.barWidth]: '20%',
|
8949
9259
|
|
8950
|
-
[vars$
|
8951
|
-
[vars$
|
9260
|
+
[vars$g.barBackgroundColor]: globalRefs$9.colors.surface.main,
|
9261
|
+
[vars$g.barBorderRadius]: '4px',
|
8952
9262
|
|
8953
|
-
[vars$
|
8954
|
-
[vars$
|
8955
|
-
[vars$
|
8956
|
-
[vars$
|
9263
|
+
[vars$g.animationDuration]: '2s',
|
9264
|
+
[vars$g.animationTimingFunction]: 'linear',
|
9265
|
+
[vars$g.animationIterationCount]: 'infinite',
|
9266
|
+
[vars$g.verticalPadding]: '0.25em',
|
8957
9267
|
|
8958
9268
|
size: {
|
8959
|
-
xs: { [vars$
|
8960
|
-
sm: { [vars$
|
8961
|
-
md: { [vars$
|
8962
|
-
lg: { [vars$
|
9269
|
+
xs: { [vars$g.barHeight]: '2px' },
|
9270
|
+
sm: { [vars$g.barHeight]: '4px' },
|
9271
|
+
md: { [vars$g.barHeight]: '6px' },
|
9272
|
+
lg: { [vars$g.barHeight]: '8px' },
|
8963
9273
|
},
|
8964
9274
|
|
8965
9275
|
mode: {
|
8966
9276
|
primary: {
|
8967
|
-
[vars$
|
9277
|
+
[vars$g.barColor]: globalRefs$9.colors.primary.main,
|
8968
9278
|
},
|
8969
9279
|
secondary: {
|
8970
|
-
[vars$
|
9280
|
+
[vars$g.barColor]: globalRefs$9.colors.secondary.main,
|
8971
9281
|
},
|
8972
9282
|
},
|
8973
9283
|
|
8974
9284
|
_hidden: {
|
8975
|
-
[vars$
|
9285
|
+
[vars$g.hostDisplay]: 'none',
|
8976
9286
|
},
|
8977
9287
|
};
|
8978
9288
|
|
8979
9289
|
var loaderLinear$1 = /*#__PURE__*/Object.freeze({
|
8980
9290
|
__proto__: null,
|
8981
9291
|
default: loaderLinear,
|
8982
|
-
vars: vars$
|
9292
|
+
vars: vars$g
|
8983
9293
|
});
|
8984
9294
|
|
8985
9295
|
const globalRefs$8 = getThemeRefs(globals);
|
@@ -8997,7 +9307,7 @@ const [helperTheme, helperRefs, helperVars] = createHelperVars(
|
|
8997
9307
|
},
|
8998
9308
|
},
|
8999
9309
|
},
|
9000
|
-
componentName$
|
9310
|
+
componentName$B
|
9001
9311
|
);
|
9002
9312
|
|
9003
9313
|
const loaderRadial = {
|
@@ -9026,7 +9336,7 @@ const loaderRadial = {
|
|
9026
9336
|
[compVars$1.hostDisplay]: 'none',
|
9027
9337
|
},
|
9028
9338
|
};
|
9029
|
-
const vars$
|
9339
|
+
const vars$f = {
|
9030
9340
|
...compVars$1,
|
9031
9341
|
...helperVars,
|
9032
9342
|
};
|
@@ -9034,76 +9344,112 @@ const vars$e = {
|
|
9034
9344
|
var loaderRadial$1 = /*#__PURE__*/Object.freeze({
|
9035
9345
|
__proto__: null,
|
9036
9346
|
default: loaderRadial,
|
9037
|
-
vars: vars$
|
9347
|
+
vars: vars$f
|
9038
9348
|
});
|
9039
9349
|
|
9040
9350
|
const globalRefs$7 = getThemeRefs(globals);
|
9041
|
-
const vars$
|
9351
|
+
const vars$e = ComboBoxClass.cssVarList;
|
9042
9352
|
|
9043
9353
|
const comboBox = {
|
9044
|
-
[vars$
|
9045
|
-
[vars$
|
9046
|
-
[vars$
|
9047
|
-
[vars$
|
9048
|
-
[vars$
|
9049
|
-
[vars$
|
9050
|
-
[vars$
|
9051
|
-
[vars$
|
9052
|
-
[vars$
|
9053
|
-
[vars$
|
9054
|
-
[vars$
|
9055
|
-
[vars$
|
9056
|
-
[vars$
|
9057
|
-
[vars$
|
9058
|
-
[vars$
|
9059
|
-
[vars$
|
9060
|
-
[vars$
|
9061
|
-
[vars$
|
9062
|
-
[vars$
|
9063
|
-
[vars$
|
9064
|
-
[vars$
|
9065
|
-
[vars$
|
9066
|
-
[vars$
|
9067
|
-
[vars$
|
9068
|
-
[vars$
|
9069
|
-
[vars$
|
9354
|
+
[vars$e.hostWidth]: refs.width,
|
9355
|
+
[vars$e.hostDirection]: refs.direction,
|
9356
|
+
[vars$e.fontSize]: refs.fontSize,
|
9357
|
+
[vars$e.fontFamily]: refs.fontFamily,
|
9358
|
+
[vars$e.labelTextColor]: refs.labelTextColor,
|
9359
|
+
[vars$e.errorMessageTextColor]: refs.errorMessageTextColor,
|
9360
|
+
[vars$e.inputBorderColor]: refs.borderColor,
|
9361
|
+
[vars$e.inputBorderWidth]: refs.borderWidth,
|
9362
|
+
[vars$e.inputBorderStyle]: refs.borderStyle,
|
9363
|
+
[vars$e.inputBorderRadius]: refs.borderRadius,
|
9364
|
+
[vars$e.inputOutlineColor]: refs.outlineColor,
|
9365
|
+
[vars$e.inputOutlineOffset]: refs.outlineOffset,
|
9366
|
+
[vars$e.inputOutlineWidth]: refs.outlineWidth,
|
9367
|
+
[vars$e.inputOutlineStyle]: refs.outlineStyle,
|
9368
|
+
[vars$e.labelRequiredIndicator]: refs.requiredIndicator,
|
9369
|
+
[vars$e.inputValueTextColor]: refs.valueTextColor,
|
9370
|
+
[vars$e.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
9371
|
+
[vars$e.inputBackgroundColor]: refs.backgroundColor,
|
9372
|
+
[vars$e.inputHorizontalPadding]: refs.horizontalPadding,
|
9373
|
+
[vars$e.inputHeight]: refs.inputHeight,
|
9374
|
+
[vars$e.inputDropdownButtonColor]: globalRefs$7.colors.surface.contrast,
|
9375
|
+
[vars$e.inputDropdownButtonCursor]: 'pointer',
|
9376
|
+
[vars$e.inputDropdownButtonSize]: refs.toggleButtonSize,
|
9377
|
+
[vars$e.inputDropdownButtonOffset]: globalRefs$7.spacing.xs,
|
9378
|
+
[vars$e.overlayItemPaddingInlineStart]: globalRefs$7.spacing.xs,
|
9379
|
+
[vars$e.overlayItemPaddingInlineEnd]: globalRefs$7.spacing.lg,
|
9070
9380
|
|
9071
9381
|
_readonly: {
|
9072
|
-
[vars$
|
9382
|
+
[vars$e.inputDropdownButtonCursor]: 'default',
|
9073
9383
|
},
|
9074
9384
|
|
9075
9385
|
// Overlay theme exposed via the component:
|
9076
|
-
[vars$
|
9077
|
-
[vars$
|
9078
|
-
[vars$
|
9079
|
-
[vars$
|
9386
|
+
[vars$e.overlayFontSize]: refs.fontSize,
|
9387
|
+
[vars$e.overlayFontFamily]: refs.fontFamily,
|
9388
|
+
[vars$e.overlayCursor]: 'pointer',
|
9389
|
+
[vars$e.overlayItemBoxShadow]: 'none',
|
9080
9390
|
|
9081
9391
|
// Overlay direct theme:
|
9082
|
-
[vars$
|
9083
|
-
[vars$
|
9392
|
+
[vars$e.overlay.minHeight]: '400px',
|
9393
|
+
[vars$e.overlay.margin]: '0',
|
9084
9394
|
};
|
9085
9395
|
|
9086
9396
|
var comboBox$1 = /*#__PURE__*/Object.freeze({
|
9087
9397
|
__proto__: null,
|
9088
9398
|
comboBox: comboBox,
|
9089
9399
|
default: comboBox,
|
9090
|
-
vars: vars$
|
9400
|
+
vars: vars$e
|
9091
9401
|
});
|
9092
9402
|
|
9093
|
-
const vars$
|
9403
|
+
const vars$d = ImageClass.cssVarList;
|
9094
9404
|
|
9095
9405
|
const image = {};
|
9096
9406
|
|
9097
9407
|
var image$1 = /*#__PURE__*/Object.freeze({
|
9098
9408
|
__proto__: null,
|
9099
9409
|
default: image,
|
9100
|
-
vars: vars$
|
9410
|
+
vars: vars$d
|
9101
9411
|
});
|
9102
9412
|
|
9103
|
-
const vars$
|
9413
|
+
const vars$c = PhoneFieldClass.cssVarList;
|
9104
9414
|
|
9105
9415
|
const phoneField = {
|
9106
|
-
[vars$
|
9416
|
+
[vars$c.hostWidth]: refs.width,
|
9417
|
+
[vars$c.hostDirection]: refs.direction,
|
9418
|
+
[vars$c.fontSize]: refs.fontSize,
|
9419
|
+
[vars$c.fontFamily]: refs.fontFamily,
|
9420
|
+
[vars$c.labelTextColor]: refs.labelTextColor,
|
9421
|
+
[vars$c.labelRequiredIndicator]: refs.requiredIndicator,
|
9422
|
+
[vars$c.errorMessageTextColor]: refs.errorMessageTextColor,
|
9423
|
+
[vars$c.inputValueTextColor]: refs.valueTextColor,
|
9424
|
+
[vars$c.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
9425
|
+
[vars$c.inputBorderStyle]: refs.borderStyle,
|
9426
|
+
[vars$c.inputBorderWidth]: refs.borderWidth,
|
9427
|
+
[vars$c.inputBorderColor]: refs.borderColor,
|
9428
|
+
[vars$c.inputBorderRadius]: refs.borderRadius,
|
9429
|
+
[vars$c.inputOutlineStyle]: refs.outlineStyle,
|
9430
|
+
[vars$c.inputOutlineWidth]: refs.outlineWidth,
|
9431
|
+
[vars$c.inputOutlineColor]: refs.outlineColor,
|
9432
|
+
[vars$c.inputOutlineOffset]: refs.outlineOffset,
|
9433
|
+
[vars$c.phoneInputWidth]: refs.minWidth,
|
9434
|
+
[vars$c.countryCodeInputWidth]: '5em',
|
9435
|
+
[vars$c.countryCodeDropdownWidth]: '20em',
|
9436
|
+
|
9437
|
+
// '@overlay': {
|
9438
|
+
// overlayItemBackgroundColor: 'red'
|
9439
|
+
// }
|
9440
|
+
};
|
9441
|
+
|
9442
|
+
var phoneField$1 = /*#__PURE__*/Object.freeze({
|
9443
|
+
__proto__: null,
|
9444
|
+
default: phoneField,
|
9445
|
+
vars: vars$c
|
9446
|
+
});
|
9447
|
+
|
9448
|
+
const vars$b = PhoneFieldInputBoxClass.cssVarList;
|
9449
|
+
|
9450
|
+
const phoneInputBoxField = {
|
9451
|
+
[vars$b.hostWidth]: '16em',
|
9452
|
+
[vars$b.hostMinWidth]: refs.minWidth,
|
9107
9453
|
[vars$b.hostDirection]: refs.direction,
|
9108
9454
|
[vars$b.fontSize]: refs.fontSize,
|
9109
9455
|
[vars$b.fontFamily]: refs.fontFamily,
|
@@ -9120,295 +9466,173 @@ const phoneField = {
|
|
9120
9466
|
[vars$b.inputOutlineWidth]: refs.outlineWidth,
|
9121
9467
|
[vars$b.inputOutlineColor]: refs.outlineColor,
|
9122
9468
|
[vars$b.inputOutlineOffset]: refs.outlineOffset,
|
9123
|
-
|
9124
|
-
|
9125
|
-
|
9126
|
-
|
9127
|
-
// '@overlay': {
|
9128
|
-
// overlayItemBackgroundColor: 'red'
|
9129
|
-
// }
|
9469
|
+
_fullWidth: {
|
9470
|
+
[vars$b.hostWidth]: refs.width,
|
9471
|
+
},
|
9130
9472
|
};
|
9131
9473
|
|
9132
|
-
var
|
9474
|
+
var phoneInputBoxField$1 = /*#__PURE__*/Object.freeze({
|
9133
9475
|
__proto__: null,
|
9134
|
-
default:
|
9476
|
+
default: phoneInputBoxField,
|
9135
9477
|
vars: vars$b
|
9136
9478
|
});
|
9137
9479
|
|
9138
|
-
const vars$a =
|
9480
|
+
const vars$a = NewPasswordClass.cssVarList;
|
9139
9481
|
|
9140
|
-
const
|
9141
|
-
[vars$a.hostWidth]:
|
9482
|
+
const newPassword = {
|
9483
|
+
[vars$a.hostWidth]: refs.width,
|
9142
9484
|
[vars$a.hostMinWidth]: refs.minWidth,
|
9143
9485
|
[vars$a.hostDirection]: refs.direction,
|
9144
9486
|
[vars$a.fontSize]: refs.fontSize,
|
9145
9487
|
[vars$a.fontFamily]: refs.fontFamily,
|
9146
|
-
[vars$a.
|
9147
|
-
[vars$a.labelRequiredIndicator]: refs.requiredIndicator,
|
9488
|
+
[vars$a.spaceBetweenInputs]: '1em',
|
9148
9489
|
[vars$a.errorMessageTextColor]: refs.errorMessageTextColor,
|
9149
|
-
[vars$a.inputValueTextColor]: refs.valueTextColor,
|
9150
|
-
[vars$a.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
9151
|
-
[vars$a.inputBorderStyle]: refs.borderStyle,
|
9152
|
-
[vars$a.inputBorderWidth]: refs.borderWidth,
|
9153
|
-
[vars$a.inputBorderColor]: refs.borderColor,
|
9154
|
-
[vars$a.inputBorderRadius]: refs.borderRadius,
|
9155
|
-
[vars$a.inputOutlineStyle]: refs.outlineStyle,
|
9156
|
-
[vars$a.inputOutlineWidth]: refs.outlineWidth,
|
9157
|
-
[vars$a.inputOutlineColor]: refs.outlineColor,
|
9158
|
-
[vars$a.inputOutlineOffset]: refs.outlineOffset,
|
9159
|
-
_fullWidth: {
|
9160
|
-
[vars$a.hostWidth]: refs.width,
|
9161
|
-
},
|
9162
|
-
};
|
9163
|
-
|
9164
|
-
var phoneInputBoxField$1 = /*#__PURE__*/Object.freeze({
|
9165
|
-
__proto__: null,
|
9166
|
-
default: phoneInputBoxField,
|
9167
|
-
vars: vars$a
|
9168
|
-
});
|
9169
|
-
|
9170
|
-
const vars$9 = NewPasswordClass.cssVarList;
|
9171
|
-
|
9172
|
-
const newPassword = {
|
9173
|
-
[vars$9.hostWidth]: refs.width,
|
9174
|
-
[vars$9.hostMinWidth]: refs.minWidth,
|
9175
|
-
[vars$9.hostDirection]: refs.direction,
|
9176
|
-
[vars$9.fontSize]: refs.fontSize,
|
9177
|
-
[vars$9.fontFamily]: refs.fontFamily,
|
9178
|
-
[vars$9.spaceBetweenInputs]: '1em',
|
9179
|
-
[vars$9.errorMessageTextColor]: refs.errorMessageTextColor,
|
9180
9490
|
|
9181
9491
|
_required: {
|
9182
9492
|
// NewPassword doesn't pass `required` attribute to its Password components.
|
9183
9493
|
// That's why we fake the required indicator on each input.
|
9184
9494
|
// We do that by injecting `::after` element, and populating it with requiredIndicator content.
|
9185
|
-
[vars$
|
9495
|
+
[vars$a.inputsRequiredIndicator]: refs.requiredIndicator, // used to populate required content for NewPassword input fields outside the theme
|
9186
9496
|
},
|
9187
9497
|
};
|
9188
9498
|
|
9189
9499
|
var newPassword$1 = /*#__PURE__*/Object.freeze({
|
9190
9500
|
__proto__: null,
|
9191
9501
|
default: newPassword,
|
9192
|
-
vars: vars$
|
9502
|
+
vars: vars$a
|
9193
9503
|
});
|
9194
9504
|
|
9195
|
-
const vars$
|
9505
|
+
const vars$9 = UploadFileClass.cssVarList;
|
9196
9506
|
|
9197
9507
|
const uploadFile = {
|
9198
|
-
[vars$
|
9199
|
-
[vars$
|
9200
|
-
[vars$
|
9508
|
+
[vars$9.hostDirection]: refs.direction,
|
9509
|
+
[vars$9.labelTextColor]: refs.labelTextColor,
|
9510
|
+
[vars$9.fontFamily]: refs.fontFamily,
|
9201
9511
|
|
9202
|
-
[vars$
|
9512
|
+
[vars$9.iconSize]: '2em',
|
9203
9513
|
|
9204
|
-
[vars$
|
9205
|
-
[vars$
|
9514
|
+
[vars$9.hostPadding]: '0.75em',
|
9515
|
+
[vars$9.gap]: '0.5em',
|
9206
9516
|
|
9207
|
-
[vars$
|
9208
|
-
[vars$
|
9209
|
-
[vars$
|
9517
|
+
[vars$9.fontSize]: '16px',
|
9518
|
+
[vars$9.titleFontWeight]: '500',
|
9519
|
+
[vars$9.lineHeight]: '1em',
|
9210
9520
|
|
9211
|
-
[vars$
|
9212
|
-
[vars$
|
9213
|
-
[vars$
|
9214
|
-
[vars$
|
9521
|
+
[vars$9.borderWidth]: refs.borderWidth,
|
9522
|
+
[vars$9.borderColor]: refs.borderColor,
|
9523
|
+
[vars$9.borderRadius]: refs.borderRadius,
|
9524
|
+
[vars$9.borderStyle]: 'dashed',
|
9215
9525
|
|
9216
9526
|
_required: {
|
9217
|
-
[vars$
|
9527
|
+
[vars$9.requiredIndicator]: refs.requiredIndicator,
|
9218
9528
|
},
|
9219
9529
|
|
9220
9530
|
size: {
|
9221
9531
|
xs: {
|
9222
|
-
[vars$
|
9223
|
-
[vars$
|
9224
|
-
[vars$
|
9225
|
-
[vars$
|
9226
|
-
[vars$
|
9532
|
+
[vars$9.hostHeight]: '196px',
|
9533
|
+
[vars$9.hostWidth]: '200px',
|
9534
|
+
[vars$9.titleFontSize]: '0.875em',
|
9535
|
+
[vars$9.descriptionFontSize]: '0.875em',
|
9536
|
+
[vars$9.lineHeight]: '1.25em',
|
9227
9537
|
},
|
9228
9538
|
sm: {
|
9229
|
-
[vars$
|
9230
|
-
[vars$
|
9231
|
-
[vars$
|
9232
|
-
[vars$
|
9233
|
-
[vars$
|
9539
|
+
[vars$9.hostHeight]: '216px',
|
9540
|
+
[vars$9.hostWidth]: '230px',
|
9541
|
+
[vars$9.titleFontSize]: '1em',
|
9542
|
+
[vars$9.descriptionFontSize]: '0.875em',
|
9543
|
+
[vars$9.lineHeight]: '1.25em',
|
9234
9544
|
},
|
9235
9545
|
md: {
|
9236
|
-
[vars$
|
9237
|
-
[vars$
|
9238
|
-
[vars$
|
9239
|
-
[vars$
|
9240
|
-
[vars$
|
9546
|
+
[vars$9.hostHeight]: '256px',
|
9547
|
+
[vars$9.hostWidth]: '312px',
|
9548
|
+
[vars$9.titleFontSize]: '1.125em',
|
9549
|
+
[vars$9.descriptionFontSize]: '1em',
|
9550
|
+
[vars$9.lineHeight]: '1.5em',
|
9241
9551
|
},
|
9242
9552
|
lg: {
|
9243
|
-
[vars$
|
9244
|
-
[vars$
|
9245
|
-
[vars$
|
9246
|
-
[vars$
|
9247
|
-
[vars$
|
9553
|
+
[vars$9.hostHeight]: '280px',
|
9554
|
+
[vars$9.hostWidth]: '336px',
|
9555
|
+
[vars$9.titleFontSize]: '1.125em',
|
9556
|
+
[vars$9.descriptionFontSize]: '1.125em',
|
9557
|
+
[vars$9.lineHeight]: '1.75em',
|
9248
9558
|
},
|
9249
9559
|
},
|
9250
9560
|
|
9251
9561
|
_fullWidth: {
|
9252
|
-
[vars$
|
9562
|
+
[vars$9.hostWidth]: refs.width,
|
9253
9563
|
},
|
9254
9564
|
};
|
9255
9565
|
|
9256
9566
|
var uploadFile$1 = /*#__PURE__*/Object.freeze({
|
9257
9567
|
__proto__: null,
|
9258
9568
|
default: uploadFile,
|
9259
|
-
vars: vars$
|
9569
|
+
vars: vars$9
|
9260
9570
|
});
|
9261
9571
|
|
9262
9572
|
const globalRefs$6 = getThemeRefs(globals);
|
9263
9573
|
|
9264
|
-
const vars$
|
9574
|
+
const vars$8 = ButtonSelectionGroupItemClass.cssVarList;
|
9265
9575
|
|
9266
9576
|
const buttonSelectionGroupItem = {
|
9267
|
-
[vars$
|
9268
|
-
[vars$
|
9269
|
-
[vars$
|
9270
|
-
[vars$
|
9271
|
-
[vars$
|
9272
|
-
[vars$
|
9577
|
+
[vars$8.hostDirection]: 'inherit',
|
9578
|
+
[vars$8.backgroundColor]: globalRefs$6.colors.surface.light,
|
9579
|
+
[vars$8.labelTextColor]: globalRefs$6.colors.surface.contrast,
|
9580
|
+
[vars$8.borderColor]: globalRefs$6.colors.surface.main,
|
9581
|
+
[vars$8.borderStyle]: 'solid',
|
9582
|
+
[vars$8.borderRadius]: globalRefs$6.radius.sm,
|
9273
9583
|
|
9274
9584
|
_hover: {
|
9275
|
-
[vars$
|
9585
|
+
[vars$8.backgroundColor]: '#f4f5f5', // can we take it from the palette?
|
9276
9586
|
},
|
9277
9587
|
|
9278
9588
|
_selected: {
|
9279
|
-
[vars$
|
9280
|
-
[vars$
|
9281
|
-
[vars$
|
9589
|
+
[vars$8.borderColor]: globalRefs$6.colors.surface.contrast,
|
9590
|
+
[vars$8.backgroundColor]: globalRefs$6.colors.surface.contrast,
|
9591
|
+
[vars$8.labelTextColor]: globalRefs$6.colors.surface.light,
|
9282
9592
|
},
|
9283
9593
|
};
|
9284
9594
|
|
9285
9595
|
var buttonSelectionGroupItem$1 = /*#__PURE__*/Object.freeze({
|
9286
9596
|
__proto__: null,
|
9287
9597
|
default: buttonSelectionGroupItem,
|
9288
|
-
vars: vars$
|
9598
|
+
vars: vars$8
|
9289
9599
|
});
|
9290
9600
|
|
9291
9601
|
const globalRefs$5 = getThemeRefs(globals);
|
9292
|
-
|
9602
|
+
|
9603
|
+
const createBaseButtonSelectionGroupMappings = (vars) => ({
|
9604
|
+
[vars.hostDirection]: refs.direction,
|
9605
|
+
[vars.fontFamily]: refs.fontFamily,
|
9606
|
+
[vars.labelTextColor]: refs.labelTextColor,
|
9607
|
+
[vars.labelRequiredIndicator]: refs.requiredIndicator,
|
9608
|
+
[vars.errorMessageTextColor]: refs.errorMessageTextColor,
|
9609
|
+
[vars.itemsSpacing]: globalRefs$5.spacing.sm,
|
9610
|
+
[vars.hostWidth]: refs.width,
|
9611
|
+
});
|
9612
|
+
|
9613
|
+
const vars$7 = ButtonSelectionGroupClass.cssVarList;
|
9293
9614
|
|
9294
9615
|
const buttonSelectionGroup = {
|
9295
|
-
|
9296
|
-
[vars$6.fontFamily]: refs.fontFamily,
|
9297
|
-
[vars$6.labelTextColor]: refs.labelTextColor,
|
9298
|
-
[vars$6.labelRequiredIndicator]: refs.requiredIndicator,
|
9299
|
-
[vars$6.errorMessageTextColor]: refs.errorMessageTextColor,
|
9300
|
-
[vars$6.itemsSpacing]: globalRefs$5.spacing.sm,
|
9301
|
-
[vars$6.hostWidth]: refs.width,
|
9616
|
+
...createBaseButtonSelectionGroupMappings(vars$7),
|
9302
9617
|
};
|
9303
9618
|
|
9304
9619
|
var buttonSelectionGroup$1 = /*#__PURE__*/Object.freeze({
|
9305
9620
|
__proto__: null,
|
9306
9621
|
default: buttonSelectionGroup,
|
9307
|
-
vars: vars$
|
9622
|
+
vars: vars$7
|
9308
9623
|
});
|
9309
9624
|
|
9310
|
-
const
|
9625
|
+
const vars$6 = ButtonMultiSelectionGroupClass.cssVarList;
|
9311
9626
|
|
9312
|
-
const
|
9313
|
-
|
9314
|
-
|
9315
|
-
return this.getAttribute('opened') === 'true';
|
9316
|
-
}
|
9317
|
-
|
9318
|
-
handleOpened() {
|
9319
|
-
forwardAttrs(this, this.baseElement, { includeAttrs: ['opened'] });
|
9320
|
-
if (this.opened) {
|
9321
|
-
this.style.display = '';
|
9322
|
-
} else {
|
9323
|
-
this.style.display = 'none';
|
9324
|
-
}
|
9325
|
-
}
|
9326
|
-
|
9327
|
-
init() {
|
9328
|
-
super.init?.();
|
9329
|
-
this.style.display = 'none';
|
9330
|
-
|
9331
|
-
// vaadin-dialog might not be loaded in time
|
9332
|
-
// in order to make sure it's loaded before this block is running
|
9333
|
-
// we are wrapping it with setTimeout
|
9334
|
-
setTimeout(() => {
|
9335
|
-
// we want to sync descope-modal content through vaadin-dialog into the overlay
|
9336
|
-
// so we are adding a slot to the overlay, which allows us to forward the content from
|
9337
|
-
// vaadin-dialog to vaadin-dialog-overlay
|
9338
|
-
this.baseElement.shadowRoot
|
9339
|
-
.querySelector('vaadin-dialog-overlay')
|
9340
|
-
.appendChild(document.createElement('slot'));
|
9341
|
-
|
9342
|
-
this.#overrideOverlaySettings();
|
9343
|
-
|
9344
|
-
// we need to always open the modal in `opened=false`
|
9345
|
-
// to prevent it from rendering outside the dialog
|
9346
|
-
// first, we have to run `overrideOverlaySettings` to setup
|
9347
|
-
// the component.
|
9348
|
-
this.handleOpened();
|
9349
|
-
});
|
9350
|
-
}
|
9351
|
-
|
9352
|
-
// the default vaadin behavior is to attach the overlay to the body when opened
|
9353
|
-
// we do not want that because it's difficult to style the overlay in this way
|
9354
|
-
// so we override it to open inside the shadow DOM
|
9355
|
-
#overrideOverlaySettings() {
|
9356
|
-
const overlay = this.baseElement.shadowRoot.querySelector('vaadin-dialog-overlay');
|
9357
|
-
|
9358
|
-
overlay._attachOverlay = () => {
|
9359
|
-
overlay.bringToFront();
|
9360
|
-
this.baseElement.setAttribute('style', 'display:flex!important;');
|
9361
|
-
};
|
9362
|
-
overlay._detachOverlay = () => {
|
9363
|
-
this.baseElement.style.display = 'none';
|
9364
|
-
};
|
9365
|
-
overlay._enterModalState = () => {};
|
9366
|
-
|
9367
|
-
overlay.close = () => false;
|
9368
|
-
}
|
9369
|
-
};
|
9627
|
+
const buttonMultiSelectionGroup = {
|
9628
|
+
...createBaseButtonSelectionGroupMappings(vars$6),
|
9629
|
+
};
|
9370
9630
|
|
9371
|
-
|
9372
|
-
|
9373
|
-
|
9374
|
-
|
9375
|
-
|
9376
|
-
overlayWidth: { property: () => ModalClass.cssVarList.overlay.width },
|
9377
|
-
},
|
9378
|
-
}),
|
9379
|
-
portalMixin({
|
9380
|
-
name: 'overlay',
|
9381
|
-
selector: '',
|
9382
|
-
mappings: {
|
9383
|
-
hostDisplay: {
|
9384
|
-
selector: () => ':host(.descope-modal)',
|
9385
|
-
property: 'display',
|
9386
|
-
important: true,
|
9387
|
-
},
|
9388
|
-
backgroundColor: [
|
9389
|
-
{ selector: () => '::part(content)', property: 'background-color' },
|
9390
|
-
{ selector: () => '::part(overlay)', property: 'background-color' },
|
9391
|
-
],
|
9392
|
-
width: { selector: () => '::part(overlay)', property: 'width' },
|
9393
|
-
shadow: { selector: () => '::part(overlay)', property: 'box-shadow' },
|
9394
|
-
},
|
9395
|
-
forward: {
|
9396
|
-
include: false,
|
9397
|
-
attributes: ['opened'],
|
9398
|
-
},
|
9399
|
-
}),
|
9400
|
-
draggableMixin,
|
9401
|
-
componentNameValidationMixin,
|
9402
|
-
customMixin
|
9403
|
-
)(
|
9404
|
-
createProxy({
|
9405
|
-
slots: [''],
|
9406
|
-
wrappedEleName: 'vaadin-dialog',
|
9407
|
-
style: () => ``,
|
9408
|
-
excludeAttrsSync: ['tabindex', 'opened'],
|
9409
|
-
componentName: componentName$1,
|
9410
|
-
})
|
9411
|
-
);
|
9631
|
+
var buttonMultiSelectionGroup$1 = /*#__PURE__*/Object.freeze({
|
9632
|
+
__proto__: null,
|
9633
|
+
default: buttonMultiSelectionGroup,
|
9634
|
+
vars: vars$6
|
9635
|
+
});
|
9412
9636
|
|
9413
9637
|
const globalRefs$4 = getThemeRefs(globals);
|
9414
9638
|
|
@@ -9790,6 +10014,7 @@ const components = {
|
|
9790
10014
|
uploadFile: uploadFile$1,
|
9791
10015
|
buttonSelectionGroupItem: buttonSelectionGroupItem$1,
|
9792
10016
|
buttonSelectionGroup: buttonSelectionGroup$1,
|
10017
|
+
buttonMultiSelectionGroup: buttonMultiSelectionGroup$1,
|
9793
10018
|
modal: modal$1,
|
9794
10019
|
grid: grid$1,
|
9795
10020
|
notificationCard,
|
@@ -9807,7 +10032,7 @@ const vars = Object.keys(components).reduce(
|
|
9807
10032
|
);
|
9808
10033
|
|
9809
10034
|
const defaultTheme = { globals, components: theme };
|
9810
|
-
const themeVars = { globals: vars$
|
10035
|
+
const themeVars = { globals: vars$x, components: vars };
|
9811
10036
|
|
9812
|
-
export { BadgeClass, ButtonClass, ButtonSelectionGroupClass, CheckboxClass, ContainerClass, DividerClass, EmailFieldClass, GridClass, ImageClass, LinkClass, LoaderLinearClass, LoaderRadialClass, LogoClass, MultiSelectComboBoxClass, NewPasswordClass, NumberFieldClass, PasscodeClass, PasswordClass, PhoneFieldClass, PhoneFieldInputBoxClass, RecaptchaClass, SwitchToggleClass, TextAreaClass, TextClass, TextFieldClass, TotpImageClass, UploadFileClass, componentsThemeManager, createComponentsTheme, defaultTheme, genColor, globalsThemeToStyle, themeToStyle, themeVars };
|
10037
|
+
export { BadgeClass, ButtonClass, ButtonMultiSelectionGroupClass, ButtonSelectionGroupClass, CheckboxClass, ContainerClass, DividerClass, EmailFieldClass, GridClass, ImageClass, LinkClass, LoaderLinearClass, LoaderRadialClass, LogoClass, ModalClass, MultiSelectComboBoxClass, NewPasswordClass, NumberFieldClass, PasscodeClass, PasswordClass, PhoneFieldClass, PhoneFieldInputBoxClass, RecaptchaClass, SwitchToggleClass, TextAreaClass, TextClass, TextFieldClass, TotpImageClass, UploadFileClass, componentsThemeManager, createComponentsTheme, defaultTheme, genColor, globalsThemeToStyle, themeToStyle, themeVars };
|
9813
10038
|
//# sourceMappingURL=index.esm.js.map
|