@descope/web-components-ui 1.0.319 → 1.0.321
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/index.cjs.js +1390 -1010
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/index.esm.js +1433 -1051
- package/dist/index.esm.js.map +1 -1
- package/dist/umd/1438.js +1 -1
- package/dist/umd/2362.js +1 -1
- package/dist/umd/3830.js +1 -1
- package/dist/umd/4028.js +1 -1
- package/dist/umd/5135.js +1 -1
- package/dist/umd/5806.js +1 -1
- package/dist/umd/602.js +170 -0
- package/dist/umd/{1621.js.LICENSE.txt → 602.js.LICENSE.txt} +0 -6
- package/dist/umd/6770.js +1 -1
- package/dist/umd/7056.js +2 -2
- package/dist/umd/7284.js +303 -0
- package/dist/umd/7284.js.LICENSE.txt +11 -0
- package/dist/umd/8137.js +452 -0
- package/dist/umd/8137.js.LICENSE.txt +17 -0
- package/dist/umd/8191.js +4 -4
- package/dist/umd/9092.js +2 -2
- package/dist/umd/DescopeDev.js +1 -1
- package/dist/umd/boolean-fields-descope-checkbox-index-js.js +1 -1
- package/dist/umd/boolean-fields-descope-switch-toggle-index-js.js +1 -1
- package/dist/umd/descope-email-field-index-js.js +1 -1
- package/dist/umd/descope-grid-descope-grid-selection-column-index-js.js +1 -1
- package/dist/umd/descope-new-password-descope-new-password-internal-index-js.js +1 -1
- package/dist/umd/descope-new-password-index-js.js +1 -1
- package/dist/umd/descope-passcode-index-js.js +1 -1
- package/dist/umd/descope-password-index-js.js +1 -1
- package/dist/umd/descope-radio-group-index-js.js +1 -0
- package/dist/umd/descope-text-field-index-js.js +1 -1
- package/dist/umd/index.js +1 -1
- package/dist/umd/phone-fields-descope-phone-input-box-field-descope-phone-input-box-internal-index-js.js +1 -1
- package/package.json +2 -1
- package/src/components/descope-password/PasswordClass.js +56 -0
- package/src/components/descope-radio-group/RadioButtonClass.js +74 -0
- package/src/components/descope-radio-group/RadioGroupClass.js +192 -0
- package/src/components/descope-radio-group/index.js +8 -0
- package/src/index.cjs.js +2 -0
- package/src/index.js +1 -0
- package/src/theme/components/index.js +4 -0
- package/src/theme/components/radioGroup/radioButton.js +42 -0
- package/src/theme/components/radioGroup/radioGroup.js +37 -0
- package/dist/umd/1621.js +0 -620
package/dist/cjs/index.cjs.js
CHANGED
@@ -632,7 +632,7 @@ const globals = {
|
|
632
632
|
fonts,
|
633
633
|
direction,
|
634
634
|
};
|
635
|
-
const vars$
|
635
|
+
const vars$J = getThemeVars(globals);
|
636
636
|
|
637
637
|
const createCssVar = (varName, fallback) => `var(${varName}${fallback ? `, ${fallback}` : ''})`;
|
638
638
|
|
@@ -2578,9 +2578,9 @@ const inputEventsDispatchingMixin = (superclass) =>
|
|
2578
2578
|
|
2579
2579
|
/* eslint-disable no-use-before-define */
|
2580
2580
|
|
2581
|
-
const componentName$
|
2581
|
+
const componentName$S = getComponentName('icon');
|
2582
2582
|
|
2583
|
-
class RawIcon extends createBaseClass({ componentName: componentName$
|
2583
|
+
class RawIcon extends createBaseClass({ componentName: componentName$S, baseSelector: 'slot' }) {
|
2584
2584
|
constructor() {
|
2585
2585
|
super();
|
2586
2586
|
|
@@ -2649,7 +2649,7 @@ const clickableMixin = (superclass) =>
|
|
2649
2649
|
}
|
2650
2650
|
};
|
2651
2651
|
|
2652
|
-
const componentName$
|
2652
|
+
const componentName$R = getComponentName('button');
|
2653
2653
|
|
2654
2654
|
const resetStyles = `
|
2655
2655
|
:host {
|
@@ -2755,7 +2755,7 @@ const ButtonClass = compose(
|
|
2755
2755
|
}
|
2756
2756
|
`,
|
2757
2757
|
excludeAttrsSync: ['tabindex'],
|
2758
|
-
componentName: componentName$
|
2758
|
+
componentName: componentName$R,
|
2759
2759
|
})
|
2760
2760
|
);
|
2761
2761
|
|
@@ -2792,31 +2792,31 @@ loadingIndicatorStyles = `
|
|
2792
2792
|
}
|
2793
2793
|
`;
|
2794
2794
|
|
2795
|
-
const globalRefs$
|
2795
|
+
const globalRefs$r = getThemeRefs(globals);
|
2796
2796
|
const compVars$5 = ButtonClass.cssVarList;
|
2797
2797
|
|
2798
2798
|
const mode = {
|
2799
|
-
primary: globalRefs$
|
2800
|
-
secondary: globalRefs$
|
2801
|
-
success: globalRefs$
|
2802
|
-
error: globalRefs$
|
2803
|
-
surface: globalRefs$
|
2799
|
+
primary: globalRefs$r.colors.primary,
|
2800
|
+
secondary: globalRefs$r.colors.secondary,
|
2801
|
+
success: globalRefs$r.colors.success,
|
2802
|
+
error: globalRefs$r.colors.error,
|
2803
|
+
surface: globalRefs$r.colors.surface,
|
2804
2804
|
};
|
2805
2805
|
|
2806
|
-
const [helperTheme$3, helperRefs$3, helperVars$3] = createHelperVars({ mode }, componentName$
|
2806
|
+
const [helperTheme$3, helperRefs$3, helperVars$3] = createHelperVars({ mode }, componentName$R);
|
2807
2807
|
|
2808
2808
|
const button = {
|
2809
2809
|
...helperTheme$3,
|
2810
2810
|
|
2811
|
-
[compVars$5.fontFamily]: globalRefs$
|
2811
|
+
[compVars$5.fontFamily]: globalRefs$r.fonts.font1.family,
|
2812
2812
|
|
2813
2813
|
[compVars$5.cursor]: 'pointer',
|
2814
2814
|
[compVars$5.hostHeight]: '3em',
|
2815
2815
|
[compVars$5.hostWidth]: 'auto',
|
2816
|
-
[compVars$5.hostDirection]: globalRefs$
|
2816
|
+
[compVars$5.hostDirection]: globalRefs$r.direction,
|
2817
2817
|
|
2818
|
-
[compVars$5.borderRadius]: globalRefs$
|
2819
|
-
[compVars$5.borderWidth]: globalRefs$
|
2818
|
+
[compVars$5.borderRadius]: globalRefs$r.radius.sm,
|
2819
|
+
[compVars$5.borderWidth]: globalRefs$r.border.xs,
|
2820
2820
|
[compVars$5.borderStyle]: 'solid',
|
2821
2821
|
[compVars$5.borderColor]: 'transparent',
|
2822
2822
|
|
@@ -2859,11 +2859,11 @@ const button = {
|
|
2859
2859
|
},
|
2860
2860
|
|
2861
2861
|
_disabled: {
|
2862
|
-
[helperVars$3.main]: globalRefs$
|
2863
|
-
[helperVars$3.dark]: globalRefs$
|
2864
|
-
[helperVars$3.light]: globalRefs$
|
2865
|
-
[helperVars$3.contrast]: globalRefs$
|
2866
|
-
[compVars$5.iconColor]: globalRefs$
|
2862
|
+
[helperVars$3.main]: globalRefs$r.colors.surface.light,
|
2863
|
+
[helperVars$3.dark]: globalRefs$r.colors.surface.dark,
|
2864
|
+
[helperVars$3.light]: globalRefs$r.colors.surface.light,
|
2865
|
+
[helperVars$3.contrast]: globalRefs$r.colors.surface.main,
|
2866
|
+
[compVars$5.iconColor]: globalRefs$r.colors.surface.main,
|
2867
2867
|
},
|
2868
2868
|
|
2869
2869
|
variant: {
|
@@ -2911,7 +2911,7 @@ const button = {
|
|
2911
2911
|
},
|
2912
2912
|
};
|
2913
2913
|
|
2914
|
-
const vars$
|
2914
|
+
const vars$I = {
|
2915
2915
|
...compVars$5,
|
2916
2916
|
...helperVars$3,
|
2917
2917
|
};
|
@@ -2919,7 +2919,7 @@ const vars$G = {
|
|
2919
2919
|
var button$1 = /*#__PURE__*/Object.freeze({
|
2920
2920
|
__proto__: null,
|
2921
2921
|
default: button,
|
2922
|
-
vars: vars$
|
2922
|
+
vars: vars$I
|
2923
2923
|
});
|
2924
2924
|
|
2925
2925
|
const {
|
@@ -3146,11 +3146,11 @@ const resetInputLabelPosition = (name) => `
|
|
3146
3146
|
}
|
3147
3147
|
`;
|
3148
3148
|
|
3149
|
-
const componentName$
|
3149
|
+
const componentName$Q = getComponentName('text-field');
|
3150
3150
|
|
3151
3151
|
const observedAttrs = ['type'];
|
3152
3152
|
|
3153
|
-
const customMixin$
|
3153
|
+
const customMixin$a = (superclass) =>
|
3154
3154
|
class TextFieldClass extends superclass {
|
3155
3155
|
static get observedAttributes() {
|
3156
3156
|
return observedAttrs.concat(superclass.observedAttributes || []);
|
@@ -3202,7 +3202,7 @@ const TextFieldClass = compose(
|
|
3202
3202
|
draggableMixin,
|
3203
3203
|
composedProxyInputMixin({ proxyProps: ['value', 'selectionStart'] }),
|
3204
3204
|
componentNameValidationMixin,
|
3205
|
-
customMixin$
|
3205
|
+
customMixin$a
|
3206
3206
|
)(
|
3207
3207
|
createProxy({
|
3208
3208
|
slots: ['prefix', 'suffix'],
|
@@ -3224,29 +3224,29 @@ const TextFieldClass = compose(
|
|
3224
3224
|
${resetInputOverrides('vaadin-text-field', TextFieldClass.cssVarList)}
|
3225
3225
|
`,
|
3226
3226
|
excludeAttrsSync: ['tabindex'],
|
3227
|
-
componentName: componentName$
|
3227
|
+
componentName: componentName$Q,
|
3228
3228
|
})
|
3229
3229
|
);
|
3230
3230
|
|
3231
|
-
const componentName$
|
3232
|
-
const globalRefs$
|
3231
|
+
const componentName$P = getComponentName('input-wrapper');
|
3232
|
+
const globalRefs$q = getThemeRefs(globals);
|
3233
3233
|
|
3234
|
-
const [theme$1, refs, vars$
|
3234
|
+
const [theme$1, refs, vars$H] = createHelperVars(
|
3235
3235
|
{
|
3236
|
-
labelTextColor: globalRefs$
|
3236
|
+
labelTextColor: globalRefs$q.colors.surface.dark,
|
3237
3237
|
labelFontSize: '14px', // not taken from globals as it is fixed in all inputs
|
3238
|
-
valueTextColor: globalRefs$
|
3239
|
-
placeholderTextColor: globalRefs$
|
3238
|
+
valueTextColor: globalRefs$q.colors.surface.contrast,
|
3239
|
+
placeholderTextColor: globalRefs$q.colors.surface.dark,
|
3240
3240
|
requiredIndicator: "'*'",
|
3241
|
-
helperTextColor: globalRefs$
|
3242
|
-
errorMessageTextColor: globalRefs$
|
3243
|
-
successMessageTextColor: globalRefs$
|
3241
|
+
helperTextColor: globalRefs$q.colors.surface.dark,
|
3242
|
+
errorMessageTextColor: globalRefs$q.colors.error.main,
|
3243
|
+
successMessageTextColor: globalRefs$q.colors.success.main,
|
3244
3244
|
|
3245
|
-
borderWidth: globalRefs$
|
3246
|
-
borderRadius: globalRefs$
|
3245
|
+
borderWidth: globalRefs$q.border.xs,
|
3246
|
+
borderRadius: globalRefs$q.radius.xs,
|
3247
3247
|
borderColor: 'transparent',
|
3248
3248
|
|
3249
|
-
outlineWidth: globalRefs$
|
3249
|
+
outlineWidth: globalRefs$q.border.sm,
|
3250
3250
|
outlineStyle: 'solid',
|
3251
3251
|
outlineColor: 'transparent',
|
3252
3252
|
outlineOffset: '0px', // we need to keep the px unit even for 0 value, as this var is used for calc in different component classes
|
@@ -3257,11 +3257,11 @@ const [theme$1, refs, vars$F] = createHelperVars(
|
|
3257
3257
|
horizontalPadding: '0.5em',
|
3258
3258
|
verticalPadding: '0.5em',
|
3259
3259
|
|
3260
|
-
backgroundColor: globalRefs$
|
3260
|
+
backgroundColor: globalRefs$q.colors.surface.main,
|
3261
3261
|
|
3262
|
-
fontFamily: globalRefs$
|
3262
|
+
fontFamily: globalRefs$q.fonts.font1.family,
|
3263
3263
|
|
3264
|
-
direction: globalRefs$
|
3264
|
+
direction: globalRefs$q.direction,
|
3265
3265
|
|
3266
3266
|
overlayOpacity: '0.3',
|
3267
3267
|
|
@@ -3277,69 +3277,69 @@ const [theme$1, refs, vars$F] = createHelperVars(
|
|
3277
3277
|
},
|
3278
3278
|
|
3279
3279
|
_focused: {
|
3280
|
-
outlineColor: globalRefs$
|
3280
|
+
outlineColor: globalRefs$q.colors.surface.light,
|
3281
3281
|
_invalid: {
|
3282
|
-
outlineColor: globalRefs$
|
3282
|
+
outlineColor: globalRefs$q.colors.error.main,
|
3283
3283
|
},
|
3284
3284
|
},
|
3285
3285
|
|
3286
3286
|
_bordered: {
|
3287
|
-
outlineWidth: globalRefs$
|
3288
|
-
borderColor: globalRefs$
|
3287
|
+
outlineWidth: globalRefs$q.border.xs,
|
3288
|
+
borderColor: globalRefs$q.colors.surface.light,
|
3289
3289
|
borderStyle: 'solid',
|
3290
3290
|
_invalid: {
|
3291
|
-
borderColor: globalRefs$
|
3291
|
+
borderColor: globalRefs$q.colors.error.main,
|
3292
3292
|
},
|
3293
3293
|
},
|
3294
3294
|
|
3295
3295
|
_disabled: {
|
3296
|
-
labelTextColor: globalRefs$
|
3297
|
-
borderColor: globalRefs$
|
3298
|
-
valueTextColor: globalRefs$
|
3299
|
-
placeholderTextColor: globalRefs$
|
3300
|
-
helperTextColor: globalRefs$
|
3301
|
-
backgroundColor: globalRefs$
|
3296
|
+
labelTextColor: globalRefs$q.colors.surface.light,
|
3297
|
+
borderColor: globalRefs$q.colors.surface.light,
|
3298
|
+
valueTextColor: globalRefs$q.colors.surface.light,
|
3299
|
+
placeholderTextColor: globalRefs$q.colors.surface.light,
|
3300
|
+
helperTextColor: globalRefs$q.colors.surface.light,
|
3301
|
+
backgroundColor: globalRefs$q.colors.surface.main,
|
3302
3302
|
},
|
3303
3303
|
},
|
3304
|
-
componentName$
|
3304
|
+
componentName$P
|
3305
3305
|
);
|
3306
3306
|
|
3307
3307
|
var inputWrapper = /*#__PURE__*/Object.freeze({
|
3308
3308
|
__proto__: null,
|
3309
3309
|
default: theme$1,
|
3310
3310
|
refs: refs,
|
3311
|
-
vars: vars$
|
3311
|
+
vars: vars$H
|
3312
3312
|
});
|
3313
3313
|
|
3314
|
-
const vars$
|
3314
|
+
const vars$G = TextFieldClass.cssVarList;
|
3315
3315
|
|
3316
3316
|
const textField$1 = {
|
3317
|
-
[vars$
|
3318
|
-
[vars$
|
3319
|
-
[vars$
|
3320
|
-
[vars$
|
3321
|
-
[vars$
|
3322
|
-
[vars$
|
3323
|
-
[vars$
|
3324
|
-
[vars$
|
3325
|
-
[vars$
|
3326
|
-
[vars$
|
3327
|
-
[vars$
|
3328
|
-
[vars$
|
3329
|
-
[vars$
|
3330
|
-
[vars$
|
3331
|
-
[vars$
|
3332
|
-
[vars$
|
3333
|
-
[vars$
|
3334
|
-
[vars$
|
3335
|
-
[vars$
|
3336
|
-
[vars$
|
3337
|
-
[vars$
|
3338
|
-
[vars$
|
3317
|
+
[vars$G.hostWidth]: refs.width,
|
3318
|
+
[vars$G.hostMinWidth]: refs.minWidth,
|
3319
|
+
[vars$G.hostDirection]: refs.direction,
|
3320
|
+
[vars$G.fontSize]: refs.fontSize,
|
3321
|
+
[vars$G.fontFamily]: refs.fontFamily,
|
3322
|
+
[vars$G.labelTextColor]: refs.labelTextColor,
|
3323
|
+
[vars$G.labelRequiredIndicator]: refs.requiredIndicator,
|
3324
|
+
[vars$G.errorMessageTextColor]: refs.errorMessageTextColor,
|
3325
|
+
[vars$G.inputValueTextColor]: refs.valueTextColor,
|
3326
|
+
[vars$G.inputPlaceholderColor]: refs.placeholderTextColor,
|
3327
|
+
[vars$G.inputBorderWidth]: refs.borderWidth,
|
3328
|
+
[vars$G.inputBorderStyle]: refs.borderStyle,
|
3329
|
+
[vars$G.inputBorderColor]: refs.borderColor,
|
3330
|
+
[vars$G.inputBorderRadius]: refs.borderRadius,
|
3331
|
+
[vars$G.inputOutlineWidth]: refs.outlineWidth,
|
3332
|
+
[vars$G.inputOutlineStyle]: refs.outlineStyle,
|
3333
|
+
[vars$G.inputOutlineColor]: refs.outlineColor,
|
3334
|
+
[vars$G.inputOutlineOffset]: refs.outlineOffset,
|
3335
|
+
[vars$G.inputBackgroundColor]: refs.backgroundColor,
|
3336
|
+
[vars$G.inputHeight]: refs.inputHeight,
|
3337
|
+
[vars$G.inputHorizontalPadding]: refs.horizontalPadding,
|
3338
|
+
[vars$G.helperTextColor]: refs.helperTextColor,
|
3339
3339
|
textAlign: {
|
3340
|
-
right: { [vars$
|
3341
|
-
left: { [vars$
|
3342
|
-
center: { [vars$
|
3340
|
+
right: { [vars$G.inputTextAlign]: 'right' },
|
3341
|
+
left: { [vars$G.inputTextAlign]: 'left' },
|
3342
|
+
center: { [vars$G.inputTextAlign]: 'center' },
|
3343
3343
|
},
|
3344
3344
|
};
|
3345
3345
|
|
@@ -3347,7 +3347,7 @@ var textField$2 = /*#__PURE__*/Object.freeze({
|
|
3347
3347
|
__proto__: null,
|
3348
3348
|
default: textField$1,
|
3349
3349
|
textField: textField$1,
|
3350
|
-
vars: vars$
|
3350
|
+
vars: vars$G
|
3351
3351
|
});
|
3352
3352
|
|
3353
3353
|
const passwordDraggableMixin = (superclass) =>
|
@@ -3452,9 +3452,9 @@ const applyExternalInputStyles = (sourceInputEle, targetInputEle) => {
|
|
3452
3452
|
`;
|
3453
3453
|
};
|
3454
3454
|
|
3455
|
-
const componentName$
|
3455
|
+
const componentName$O = getComponentName('password');
|
3456
3456
|
|
3457
|
-
const customMixin$
|
3457
|
+
const customMixin$9 = (superclass) =>
|
3458
3458
|
class PasswordFieldMixinClass extends superclass {
|
3459
3459
|
init() {
|
3460
3460
|
super.init?.();
|
@@ -3475,6 +3475,8 @@ const customMixin$8 = (superclass) =>
|
|
3475
3475
|
// create external input
|
3476
3476
|
const externalInput = createExternalInputEle('external-input', this.getAutocompleteType());
|
3477
3477
|
|
3478
|
+
this.handlePasswordVisibility(externalInput);
|
3479
|
+
|
3478
3480
|
// apply original input's styles to external input
|
3479
3481
|
setTimeout(() => {
|
3480
3482
|
applyExternalInputStyles(origInput, externalInput);
|
@@ -3485,6 +3487,7 @@ const customMixin$8 = (superclass) =>
|
|
3485
3487
|
|
3486
3488
|
// sync input stateful attributes: `type` (for visibility state change) and `readonly`
|
3487
3489
|
syncAttrs(origInput, externalInput, { includeAttrs: ['type', 'readonly'] });
|
3490
|
+
syncAttrs(this, externalInput, { includeAttrs: ['focused'] });
|
3488
3491
|
|
3489
3492
|
origInput.addEventListener('focus', (e) => {
|
3490
3493
|
e.preventDefault();
|
@@ -3502,6 +3505,59 @@ const customMixin$8 = (superclass) =>
|
|
3502
3505
|
this.appendChild(externalInput);
|
3503
3506
|
}
|
3504
3507
|
|
3508
|
+
// override vaadin's password visibility toggle.
|
3509
|
+
// we need this override in order to to resolve the external input `focus` race condition,
|
3510
|
+
// which is caused due to the focus sync between the two inputs.
|
3511
|
+
handlePasswordVisibility(externalInput) {
|
3512
|
+
// disable vaadin's `__boundRevealButtonMouseDown` mouse-down event lisetener
|
3513
|
+
const origBoundRevealButtonMouseDown = this.baseElement.__boundRevealButtonMouseDown;
|
3514
|
+
this.baseElement
|
3515
|
+
.querySelector('vaadin-password-field-button')
|
3516
|
+
.removeEventListener('mousedown', origBoundRevealButtonMouseDown);
|
3517
|
+
|
3518
|
+
// disable vaadin's `_passwordVisibleChanged` observer
|
3519
|
+
this.baseElement._passwordVisibleChanged = () => {};
|
3520
|
+
|
3521
|
+
// override vaadin's `_togglePasswordVisibility`
|
3522
|
+
this.baseElement._togglePasswordVisibility = () => {
|
3523
|
+
const currVisibility = externalInput.getAttribute('type');
|
3524
|
+
if (currVisibility === 'password') {
|
3525
|
+
this.showPasswordVisibility(externalInput);
|
3526
|
+
} else {
|
3527
|
+
this.hidePasswordVisibility(externalInput);
|
3528
|
+
}
|
3529
|
+
};
|
3530
|
+
|
3531
|
+
// on component blur, if password is revealed - hide it
|
3532
|
+
// this behaves differently from vaadin's focus handling, and checks if the blur takes the component out of focus
|
3533
|
+
// (which menas the click was made outside the component) or if the blur was called due to clicking the Reveal Button
|
3534
|
+
// and then focusing in the input again
|
3535
|
+
this.addEventListener('blur', () => {
|
3536
|
+
setTimeout(() => {
|
3537
|
+
const isHiddenAndFocused =
|
3538
|
+
externalInput.getAttribute('type') !== 'password' &&
|
3539
|
+
externalInput.getAttribute('focused') !== 'true';
|
3540
|
+
if (isHiddenAndFocused) {
|
3541
|
+
this.hidePasswordVisibility(externalInput);
|
3542
|
+
}
|
3543
|
+
});
|
3544
|
+
});
|
3545
|
+
}
|
3546
|
+
|
3547
|
+
hidePasswordVisibility(input) {
|
3548
|
+
// handle input element's type
|
3549
|
+
input.setAttribute('type', 'password');
|
3550
|
+
// handle vaadin's `password-visible` attribute
|
3551
|
+
this.setAttribute('password-visible', 'false');
|
3552
|
+
}
|
3553
|
+
|
3554
|
+
showPasswordVisibility(input) {
|
3555
|
+
// handle input element's type
|
3556
|
+
input.setAttribute('type', 'text');
|
3557
|
+
// handle vaadin's `password-visible` attribute
|
3558
|
+
this.setAttribute('password-visible', 'true');
|
3559
|
+
}
|
3560
|
+
|
3505
3561
|
getAutocompleteType() {
|
3506
3562
|
return this.getAttribute('autocomplete') || 'current-password';
|
3507
3563
|
}
|
@@ -3596,7 +3652,7 @@ const PasswordClass = compose(
|
|
3596
3652
|
composedProxyInputMixin({ proxyProps: ['value', 'selectionStart'] }),
|
3597
3653
|
componentNameValidationMixin,
|
3598
3654
|
passwordDraggableMixin,
|
3599
|
-
customMixin$
|
3655
|
+
customMixin$9
|
3600
3656
|
)(
|
3601
3657
|
createProxy({
|
3602
3658
|
slots: ['', 'suffix'],
|
@@ -3653,46 +3709,46 @@ const PasswordClass = compose(
|
|
3653
3709
|
}
|
3654
3710
|
`,
|
3655
3711
|
excludeAttrsSync: ['tabindex'],
|
3656
|
-
componentName: componentName$
|
3712
|
+
componentName: componentName$O,
|
3657
3713
|
})
|
3658
3714
|
);
|
3659
3715
|
|
3660
|
-
const globalRefs$
|
3661
|
-
const vars$
|
3716
|
+
const globalRefs$p = getThemeRefs(globals);
|
3717
|
+
const vars$F = PasswordClass.cssVarList;
|
3662
3718
|
|
3663
3719
|
const password = {
|
3664
|
-
[vars$
|
3665
|
-
[vars$
|
3666
|
-
[vars$
|
3667
|
-
[vars$
|
3668
|
-
[vars$
|
3669
|
-
[vars$
|
3670
|
-
[vars$
|
3671
|
-
[vars$
|
3672
|
-
[vars$
|
3673
|
-
[vars$
|
3674
|
-
[vars$
|
3675
|
-
[vars$
|
3676
|
-
[vars$
|
3677
|
-
[vars$
|
3678
|
-
[vars$
|
3679
|
-
[vars$
|
3680
|
-
[vars$
|
3681
|
-
[vars$
|
3682
|
-
[vars$
|
3683
|
-
[vars$
|
3684
|
-
[vars$
|
3685
|
-
[vars$
|
3686
|
-
[vars$
|
3720
|
+
[vars$F.hostWidth]: refs.width,
|
3721
|
+
[vars$F.hostDirection]: refs.direction,
|
3722
|
+
[vars$F.fontSize]: refs.fontSize,
|
3723
|
+
[vars$F.fontFamily]: refs.fontFamily,
|
3724
|
+
[vars$F.labelTextColor]: refs.labelTextColor,
|
3725
|
+
[vars$F.errorMessageTextColor]: refs.errorMessageTextColor,
|
3726
|
+
[vars$F.inputHorizontalPadding]: refs.horizontalPadding,
|
3727
|
+
[vars$F.inputHeight]: refs.inputHeight,
|
3728
|
+
[vars$F.inputBackgroundColor]: refs.backgroundColor,
|
3729
|
+
[vars$F.labelRequiredIndicator]: refs.requiredIndicator,
|
3730
|
+
[vars$F.inputValueTextColor]: refs.valueTextColor,
|
3731
|
+
[vars$F.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
3732
|
+
[vars$F.inputBorderWidth]: refs.borderWidth,
|
3733
|
+
[vars$F.inputBorderStyle]: refs.borderStyle,
|
3734
|
+
[vars$F.inputBorderColor]: refs.borderColor,
|
3735
|
+
[vars$F.inputBorderRadius]: refs.borderRadius,
|
3736
|
+
[vars$F.inputOutlineWidth]: refs.outlineWidth,
|
3737
|
+
[vars$F.inputOutlineStyle]: refs.outlineStyle,
|
3738
|
+
[vars$F.inputOutlineColor]: refs.outlineColor,
|
3739
|
+
[vars$F.inputOutlineOffset]: refs.outlineOffset,
|
3740
|
+
[vars$F.revealButtonOffset]: globalRefs$p.spacing.md,
|
3741
|
+
[vars$F.revealButtonSize]: refs.toggleButtonSize,
|
3742
|
+
[vars$F.revealButtonColor]: refs.placeholderTextColor,
|
3687
3743
|
};
|
3688
3744
|
|
3689
3745
|
var password$1 = /*#__PURE__*/Object.freeze({
|
3690
3746
|
__proto__: null,
|
3691
3747
|
default: password,
|
3692
|
-
vars: vars$
|
3748
|
+
vars: vars$F
|
3693
3749
|
});
|
3694
3750
|
|
3695
|
-
const componentName$
|
3751
|
+
const componentName$N = getComponentName('number-field');
|
3696
3752
|
|
3697
3753
|
const NumberFieldClass = compose(
|
3698
3754
|
createStyleMixin({
|
@@ -3718,45 +3774,45 @@ const NumberFieldClass = compose(
|
|
3718
3774
|
${resetInputOverrides('vaadin-number-field', NumberFieldClass.cssVarList)}
|
3719
3775
|
`,
|
3720
3776
|
excludeAttrsSync: ['tabindex'],
|
3721
|
-
componentName: componentName$
|
3777
|
+
componentName: componentName$N,
|
3722
3778
|
})
|
3723
3779
|
);
|
3724
3780
|
|
3725
|
-
const vars$
|
3781
|
+
const vars$E = NumberFieldClass.cssVarList;
|
3726
3782
|
|
3727
3783
|
const numberField = {
|
3728
|
-
[vars$
|
3729
|
-
[vars$
|
3730
|
-
[vars$
|
3731
|
-
[vars$
|
3732
|
-
[vars$
|
3733
|
-
[vars$
|
3734
|
-
[vars$
|
3735
|
-
[vars$
|
3736
|
-
[vars$
|
3737
|
-
[vars$
|
3738
|
-
[vars$
|
3739
|
-
[vars$
|
3740
|
-
[vars$
|
3741
|
-
[vars$
|
3742
|
-
[vars$
|
3743
|
-
[vars$
|
3744
|
-
[vars$
|
3745
|
-
[vars$
|
3746
|
-
[vars$
|
3747
|
-
[vars$
|
3748
|
-
[vars$
|
3784
|
+
[vars$E.hostWidth]: refs.width,
|
3785
|
+
[vars$E.hostMinWidth]: refs.minWidth,
|
3786
|
+
[vars$E.hostDirection]: refs.direction,
|
3787
|
+
[vars$E.fontSize]: refs.fontSize,
|
3788
|
+
[vars$E.fontFamily]: refs.fontFamily,
|
3789
|
+
[vars$E.labelTextColor]: refs.labelTextColor,
|
3790
|
+
[vars$E.errorMessageTextColor]: refs.errorMessageTextColor,
|
3791
|
+
[vars$E.inputValueTextColor]: refs.valueTextColor,
|
3792
|
+
[vars$E.inputPlaceholderColor]: refs.placeholderTextColor,
|
3793
|
+
[vars$E.inputBorderWidth]: refs.borderWidth,
|
3794
|
+
[vars$E.inputBorderStyle]: refs.borderStyle,
|
3795
|
+
[vars$E.inputBorderColor]: refs.borderColor,
|
3796
|
+
[vars$E.inputBorderRadius]: refs.borderRadius,
|
3797
|
+
[vars$E.inputOutlineWidth]: refs.outlineWidth,
|
3798
|
+
[vars$E.inputOutlineStyle]: refs.outlineStyle,
|
3799
|
+
[vars$E.inputOutlineColor]: refs.outlineColor,
|
3800
|
+
[vars$E.inputOutlineOffset]: refs.outlineOffset,
|
3801
|
+
[vars$E.inputBackgroundColor]: refs.backgroundColor,
|
3802
|
+
[vars$E.labelRequiredIndicator]: refs.requiredIndicator,
|
3803
|
+
[vars$E.inputHorizontalPadding]: refs.horizontalPadding,
|
3804
|
+
[vars$E.inputHeight]: refs.inputHeight,
|
3749
3805
|
};
|
3750
3806
|
|
3751
3807
|
var numberField$1 = /*#__PURE__*/Object.freeze({
|
3752
3808
|
__proto__: null,
|
3753
3809
|
default: numberField,
|
3754
|
-
vars: vars$
|
3810
|
+
vars: vars$E
|
3755
3811
|
});
|
3756
3812
|
|
3757
|
-
const componentName$
|
3813
|
+
const componentName$M = getComponentName('email-field');
|
3758
3814
|
|
3759
|
-
const customMixin$
|
3815
|
+
const customMixin$8 = (superclass) =>
|
3760
3816
|
class EmailFieldMixinClass extends superclass {
|
3761
3817
|
init() {
|
3762
3818
|
super.init?.();
|
@@ -3770,7 +3826,7 @@ const EmailFieldClass = compose(
|
|
3770
3826
|
draggableMixin,
|
3771
3827
|
composedProxyInputMixin({ proxyProps: ['value', 'selectionStart'] }),
|
3772
3828
|
componentNameValidationMixin,
|
3773
|
-
customMixin$
|
3829
|
+
customMixin$8
|
3774
3830
|
)(
|
3775
3831
|
createProxy({
|
3776
3832
|
slots: ['', 'suffix'],
|
@@ -3789,43 +3845,43 @@ const EmailFieldClass = compose(
|
|
3789
3845
|
${resetInputOverrides('vaadin-email-field', EmailFieldClass.cssVarList)}
|
3790
3846
|
`,
|
3791
3847
|
excludeAttrsSync: ['tabindex'],
|
3792
|
-
componentName: componentName$
|
3848
|
+
componentName: componentName$M,
|
3793
3849
|
})
|
3794
3850
|
);
|
3795
3851
|
|
3796
|
-
const vars$
|
3852
|
+
const vars$D = EmailFieldClass.cssVarList;
|
3797
3853
|
|
3798
3854
|
const emailField = {
|
3799
|
-
[vars$
|
3800
|
-
[vars$
|
3801
|
-
[vars$
|
3802
|
-
[vars$
|
3803
|
-
[vars$
|
3804
|
-
[vars$
|
3805
|
-
[vars$
|
3806
|
-
[vars$
|
3807
|
-
[vars$
|
3808
|
-
[vars$
|
3809
|
-
[vars$
|
3810
|
-
[vars$
|
3811
|
-
[vars$
|
3812
|
-
[vars$
|
3813
|
-
[vars$
|
3814
|
-
[vars$
|
3815
|
-
[vars$
|
3816
|
-
[vars$
|
3817
|
-
[vars$
|
3818
|
-
[vars$
|
3819
|
-
[vars$
|
3855
|
+
[vars$D.hostWidth]: refs.width,
|
3856
|
+
[vars$D.hostMinWidth]: refs.minWidth,
|
3857
|
+
[vars$D.hostDirection]: refs.direction,
|
3858
|
+
[vars$D.fontSize]: refs.fontSize,
|
3859
|
+
[vars$D.fontFamily]: refs.fontFamily,
|
3860
|
+
[vars$D.labelTextColor]: refs.labelTextColor,
|
3861
|
+
[vars$D.errorMessageTextColor]: refs.errorMessageTextColor,
|
3862
|
+
[vars$D.inputValueTextColor]: refs.valueTextColor,
|
3863
|
+
[vars$D.labelRequiredIndicator]: refs.requiredIndicator,
|
3864
|
+
[vars$D.inputPlaceholderColor]: refs.placeholderTextColor,
|
3865
|
+
[vars$D.inputBorderWidth]: refs.borderWidth,
|
3866
|
+
[vars$D.inputBorderStyle]: refs.borderStyle,
|
3867
|
+
[vars$D.inputBorderColor]: refs.borderColor,
|
3868
|
+
[vars$D.inputBorderRadius]: refs.borderRadius,
|
3869
|
+
[vars$D.inputOutlineWidth]: refs.outlineWidth,
|
3870
|
+
[vars$D.inputOutlineStyle]: refs.outlineStyle,
|
3871
|
+
[vars$D.inputOutlineColor]: refs.outlineColor,
|
3872
|
+
[vars$D.inputOutlineOffset]: refs.outlineOffset,
|
3873
|
+
[vars$D.inputBackgroundColor]: refs.backgroundColor,
|
3874
|
+
[vars$D.inputHorizontalPadding]: refs.horizontalPadding,
|
3875
|
+
[vars$D.inputHeight]: refs.inputHeight,
|
3820
3876
|
};
|
3821
3877
|
|
3822
3878
|
var emailField$1 = /*#__PURE__*/Object.freeze({
|
3823
3879
|
__proto__: null,
|
3824
3880
|
default: emailField,
|
3825
|
-
vars: vars$
|
3881
|
+
vars: vars$D
|
3826
3882
|
});
|
3827
3883
|
|
3828
|
-
const componentName$
|
3884
|
+
const componentName$L = getComponentName('text-area');
|
3829
3885
|
|
3830
3886
|
const {
|
3831
3887
|
host: host$k,
|
@@ -3901,49 +3957,49 @@ const TextAreaClass = compose(
|
|
3901
3957
|
${resetInputCursor('vaadin-text-area')}
|
3902
3958
|
`,
|
3903
3959
|
excludeAttrsSync: ['tabindex'],
|
3904
|
-
componentName: componentName$
|
3960
|
+
componentName: componentName$L,
|
3905
3961
|
})
|
3906
3962
|
);
|
3907
3963
|
|
3908
|
-
const vars$
|
3964
|
+
const vars$C = TextAreaClass.cssVarList;
|
3909
3965
|
|
3910
3966
|
const textArea = {
|
3911
|
-
[vars$
|
3912
|
-
[vars$
|
3913
|
-
[vars$
|
3914
|
-
[vars$
|
3915
|
-
[vars$
|
3916
|
-
[vars$
|
3917
|
-
[vars$
|
3918
|
-
[vars$
|
3919
|
-
[vars$
|
3920
|
-
[vars$
|
3921
|
-
[vars$
|
3922
|
-
[vars$
|
3923
|
-
[vars$
|
3924
|
-
[vars$
|
3925
|
-
[vars$
|
3926
|
-
[vars$
|
3927
|
-
[vars$
|
3928
|
-
[vars$
|
3929
|
-
[vars$
|
3930
|
-
[vars$
|
3931
|
-
[vars$
|
3967
|
+
[vars$C.hostWidth]: refs.width,
|
3968
|
+
[vars$C.hostMinWidth]: refs.minWidth,
|
3969
|
+
[vars$C.hostDirection]: refs.direction,
|
3970
|
+
[vars$C.fontSize]: refs.fontSize,
|
3971
|
+
[vars$C.fontFamily]: refs.fontFamily,
|
3972
|
+
[vars$C.labelTextColor]: refs.labelTextColor,
|
3973
|
+
[vars$C.labelRequiredIndicator]: refs.requiredIndicator,
|
3974
|
+
[vars$C.errorMessageTextColor]: refs.errorMessageTextColor,
|
3975
|
+
[vars$C.inputBackgroundColor]: refs.backgroundColor,
|
3976
|
+
[vars$C.inputValueTextColor]: refs.valueTextColor,
|
3977
|
+
[vars$C.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
3978
|
+
[vars$C.inputBorderRadius]: refs.borderRadius,
|
3979
|
+
[vars$C.inputBorderWidth]: refs.borderWidth,
|
3980
|
+
[vars$C.inputBorderStyle]: refs.borderStyle,
|
3981
|
+
[vars$C.inputBorderColor]: refs.borderColor,
|
3982
|
+
[vars$C.inputOutlineWidth]: refs.outlineWidth,
|
3983
|
+
[vars$C.inputOutlineStyle]: refs.outlineStyle,
|
3984
|
+
[vars$C.inputOutlineColor]: refs.outlineColor,
|
3985
|
+
[vars$C.inputOutlineOffset]: refs.outlineOffset,
|
3986
|
+
[vars$C.inputResizeType]: 'vertical',
|
3987
|
+
[vars$C.inputMinHeight]: '5em',
|
3932
3988
|
textAlign: {
|
3933
|
-
right: { [vars$
|
3934
|
-
left: { [vars$
|
3935
|
-
center: { [vars$
|
3989
|
+
right: { [vars$C.inputTextAlign]: 'right' },
|
3990
|
+
left: { [vars$C.inputTextAlign]: 'left' },
|
3991
|
+
center: { [vars$C.inputTextAlign]: 'center' },
|
3936
3992
|
},
|
3937
3993
|
|
3938
3994
|
_readonly: {
|
3939
|
-
[vars$
|
3995
|
+
[vars$C.inputResizeType]: 'none',
|
3940
3996
|
},
|
3941
3997
|
};
|
3942
3998
|
|
3943
3999
|
var textArea$1 = /*#__PURE__*/Object.freeze({
|
3944
4000
|
__proto__: null,
|
3945
4001
|
default: textArea,
|
3946
|
-
vars: vars$
|
4002
|
+
vars: vars$C
|
3947
4003
|
});
|
3948
4004
|
|
3949
4005
|
const createBaseInputClass = (...args) =>
|
@@ -3954,9 +4010,9 @@ const createBaseInputClass = (...args) =>
|
|
3954
4010
|
inputEventsDispatchingMixin
|
3955
4011
|
)(createBaseClass(...args));
|
3956
4012
|
|
3957
|
-
const componentName$
|
4013
|
+
const componentName$K = getComponentName('boolean-field-internal');
|
3958
4014
|
|
3959
|
-
createBaseInputClass({ componentName: componentName$
|
4015
|
+
createBaseInputClass({ componentName: componentName$K, baseSelector: 'div' });
|
3960
4016
|
|
3961
4017
|
const booleanFieldMixin = (superclass) =>
|
3962
4018
|
class BooleanFieldMixinClass extends superclass {
|
@@ -3965,14 +4021,14 @@ const booleanFieldMixin = (superclass) =>
|
|
3965
4021
|
|
3966
4022
|
const template = document.createElement('template');
|
3967
4023
|
template.innerHTML = `
|
3968
|
-
<${componentName$
|
4024
|
+
<${componentName$K}
|
3969
4025
|
tabindex="-1"
|
3970
4026
|
slot="input"
|
3971
|
-
></${componentName$
|
4027
|
+
></${componentName$K}>
|
3972
4028
|
`;
|
3973
4029
|
|
3974
4030
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
3975
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
4031
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$K);
|
3976
4032
|
this.checkbox = this.inputElement.querySelector('vaadin-checkbox');
|
3977
4033
|
|
3978
4034
|
forwardAttrs(this, this.inputElement, {
|
@@ -4042,7 +4098,7 @@ descope-boolean-field-internal {
|
|
4042
4098
|
}
|
4043
4099
|
`;
|
4044
4100
|
|
4045
|
-
const componentName$
|
4101
|
+
const componentName$J = getComponentName('checkbox');
|
4046
4102
|
|
4047
4103
|
const {
|
4048
4104
|
host: host$j,
|
@@ -4148,51 +4204,51 @@ const CheckboxClass = compose(
|
|
4148
4204
|
}
|
4149
4205
|
`,
|
4150
4206
|
excludeAttrsSync: ['label', 'tabindex'],
|
4151
|
-
componentName: componentName$
|
4207
|
+
componentName: componentName$J,
|
4152
4208
|
})
|
4153
4209
|
);
|
4154
4210
|
|
4155
|
-
const vars$
|
4211
|
+
const vars$B = CheckboxClass.cssVarList;
|
4156
4212
|
const checkboxSize = '1.35em';
|
4157
4213
|
|
4158
4214
|
const checkbox = {
|
4159
|
-
[vars$
|
4160
|
-
[vars$
|
4161
|
-
[vars$
|
4162
|
-
[vars$
|
4163
|
-
[vars$
|
4164
|
-
[vars$
|
4165
|
-
[vars$
|
4166
|
-
[vars$
|
4167
|
-
[vars$
|
4168
|
-
[vars$
|
4169
|
-
[vars$
|
4170
|
-
[vars$
|
4171
|
-
[vars$
|
4172
|
-
[vars$
|
4173
|
-
[vars$
|
4174
|
-
[vars$
|
4175
|
-
[vars$
|
4176
|
-
[vars$
|
4177
|
-
[vars$
|
4178
|
-
[vars$
|
4215
|
+
[vars$B.hostWidth]: refs.width,
|
4216
|
+
[vars$B.hostDirection]: refs.direction,
|
4217
|
+
[vars$B.fontSize]: refs.fontSize,
|
4218
|
+
[vars$B.fontFamily]: refs.fontFamily,
|
4219
|
+
[vars$B.labelTextColor]: refs.labelTextColor,
|
4220
|
+
[vars$B.labelRequiredIndicator]: refs.requiredIndicator,
|
4221
|
+
[vars$B.labelFontWeight]: '400',
|
4222
|
+
[vars$B.labelLineHeight]: checkboxSize,
|
4223
|
+
[vars$B.labelSpacing]: '1em',
|
4224
|
+
[vars$B.errorMessageTextColor]: refs.errorMessageTextColor,
|
4225
|
+
[vars$B.inputOutlineWidth]: refs.outlineWidth,
|
4226
|
+
[vars$B.inputOutlineOffset]: refs.outlineOffset,
|
4227
|
+
[vars$B.inputOutlineColor]: refs.outlineColor,
|
4228
|
+
[vars$B.inputOutlineStyle]: refs.outlineStyle,
|
4229
|
+
[vars$B.inputBorderRadius]: refs.borderRadius,
|
4230
|
+
[vars$B.inputBorderColor]: refs.borderColor,
|
4231
|
+
[vars$B.inputBorderWidth]: refs.borderWidth,
|
4232
|
+
[vars$B.inputBorderStyle]: refs.borderStyle,
|
4233
|
+
[vars$B.inputBackgroundColor]: refs.backgroundColor,
|
4234
|
+
[vars$B.inputSize]: checkboxSize,
|
4179
4235
|
|
4180
4236
|
_checked: {
|
4181
|
-
[vars$
|
4237
|
+
[vars$B.inputValueTextColor]: refs.valueTextColor,
|
4182
4238
|
},
|
4183
4239
|
|
4184
4240
|
_disabled: {
|
4185
|
-
[vars$
|
4241
|
+
[vars$B.labelTextColor]: refs.labelTextColor,
|
4186
4242
|
},
|
4187
4243
|
};
|
4188
4244
|
|
4189
4245
|
var checkbox$1 = /*#__PURE__*/Object.freeze({
|
4190
4246
|
__proto__: null,
|
4191
4247
|
default: checkbox,
|
4192
|
-
vars: vars$
|
4248
|
+
vars: vars$B
|
4193
4249
|
});
|
4194
4250
|
|
4195
|
-
const componentName$
|
4251
|
+
const componentName$I = getComponentName('switch-toggle');
|
4196
4252
|
|
4197
4253
|
const {
|
4198
4254
|
host: host$i,
|
@@ -4324,82 +4380,82 @@ const SwitchToggleClass = compose(
|
|
4324
4380
|
}
|
4325
4381
|
`,
|
4326
4382
|
excludeAttrsSync: ['label', 'tabindex'],
|
4327
|
-
componentName: componentName$
|
4383
|
+
componentName: componentName$I,
|
4328
4384
|
})
|
4329
4385
|
);
|
4330
4386
|
|
4331
4387
|
const knobMargin = '2px';
|
4332
4388
|
const checkboxHeight = '1.25em';
|
4333
4389
|
|
4334
|
-
const globalRefs$
|
4335
|
-
const vars$
|
4390
|
+
const globalRefs$o = getThemeRefs(globals);
|
4391
|
+
const vars$A = SwitchToggleClass.cssVarList;
|
4336
4392
|
|
4337
4393
|
const switchToggle = {
|
4338
|
-
[vars$
|
4339
|
-
[vars$
|
4340
|
-
[vars$
|
4341
|
-
[vars$
|
4342
|
-
|
4343
|
-
[vars$
|
4344
|
-
[vars$
|
4345
|
-
[vars$
|
4346
|
-
[vars$
|
4347
|
-
|
4348
|
-
[vars$
|
4349
|
-
[vars$
|
4350
|
-
[vars$
|
4351
|
-
[vars$
|
4352
|
-
[vars$
|
4353
|
-
[vars$
|
4354
|
-
[vars$
|
4355
|
-
|
4356
|
-
[vars$
|
4357
|
-
[vars$
|
4358
|
-
[vars$
|
4359
|
-
[vars$
|
4360
|
-
[vars$
|
4361
|
-
[vars$
|
4362
|
-
|
4363
|
-
[vars$
|
4364
|
-
[vars$
|
4365
|
-
[vars$
|
4366
|
-
[vars$
|
4367
|
-
[vars$
|
4368
|
-
[vars$
|
4394
|
+
[vars$A.hostWidth]: refs.width,
|
4395
|
+
[vars$A.hostDirection]: refs.direction,
|
4396
|
+
[vars$A.fontSize]: refs.fontSize,
|
4397
|
+
[vars$A.fontFamily]: refs.fontFamily,
|
4398
|
+
|
4399
|
+
[vars$A.inputOutlineWidth]: refs.outlineWidth,
|
4400
|
+
[vars$A.inputOutlineOffset]: refs.outlineOffset,
|
4401
|
+
[vars$A.inputOutlineColor]: refs.outlineColor,
|
4402
|
+
[vars$A.inputOutlineStyle]: refs.outlineStyle,
|
4403
|
+
|
4404
|
+
[vars$A.trackBorderStyle]: refs.borderStyle,
|
4405
|
+
[vars$A.trackBorderWidth]: refs.borderWidth, // var `trackBorderWidth` used outside the theme for `left` margin calculation
|
4406
|
+
[vars$A.trackBorderColor]: refs.borderColor,
|
4407
|
+
[vars$A.trackBackgroundColor]: refs.backgroundColor,
|
4408
|
+
[vars$A.trackBorderRadius]: globalRefs$o.radius.md,
|
4409
|
+
[vars$A.trackWidth]: '2.5em', // var `trackWidth` used outside the theme for `left` margin calculation
|
4410
|
+
[vars$A.trackHeight]: checkboxHeight,
|
4411
|
+
|
4412
|
+
[vars$A.knobSize]: `calc(1em - ${knobMargin})`,
|
4413
|
+
[vars$A.knobRadius]: '50%',
|
4414
|
+
[vars$A.knobTopOffset]: '1px',
|
4415
|
+
[vars$A.knobLeftOffset]: knobMargin,
|
4416
|
+
[vars$A.knobColor]: refs.labelTextColor,
|
4417
|
+
[vars$A.knobTransitionDuration]: '0.3s',
|
4418
|
+
|
4419
|
+
[vars$A.labelTextColor]: refs.labelTextColor,
|
4420
|
+
[vars$A.labelFontWeight]: '400',
|
4421
|
+
[vars$A.labelLineHeight]: '1.35em',
|
4422
|
+
[vars$A.labelSpacing]: '1em',
|
4423
|
+
[vars$A.labelRequiredIndicator]: refs.requiredIndicator,
|
4424
|
+
[vars$A.errorMessageTextColor]: refs.errorMessageTextColor,
|
4369
4425
|
|
4370
4426
|
_checked: {
|
4371
|
-
[vars$
|
4372
|
-
[vars$
|
4373
|
-
[vars$
|
4374
|
-
[vars$
|
4427
|
+
[vars$A.trackBorderColor]: refs.borderColor,
|
4428
|
+
[vars$A.knobLeftOffset]: `calc(100% - var(${vars$A.knobSize}) - ${knobMargin})`,
|
4429
|
+
[vars$A.knobColor]: refs.valueTextColor,
|
4430
|
+
[vars$A.knobTextColor]: refs.valueTextColor,
|
4375
4431
|
},
|
4376
4432
|
|
4377
4433
|
_disabled: {
|
4378
|
-
[vars$
|
4379
|
-
[vars$
|
4380
|
-
[vars$
|
4381
|
-
[vars$
|
4434
|
+
[vars$A.knobColor]: globalRefs$o.colors.surface.light,
|
4435
|
+
[vars$A.trackBorderColor]: globalRefs$o.colors.surface.light,
|
4436
|
+
[vars$A.trackBackgroundColor]: globalRefs$o.colors.surface.main,
|
4437
|
+
[vars$A.labelTextColor]: refs.labelTextColor,
|
4382
4438
|
_checked: {
|
4383
|
-
[vars$
|
4384
|
-
[vars$
|
4439
|
+
[vars$A.knobColor]: globalRefs$o.colors.surface.light,
|
4440
|
+
[vars$A.trackBackgroundColor]: globalRefs$o.colors.surface.main,
|
4385
4441
|
},
|
4386
4442
|
},
|
4387
4443
|
|
4388
4444
|
_invalid: {
|
4389
|
-
[vars$
|
4390
|
-
[vars$
|
4445
|
+
[vars$A.trackBorderColor]: globalRefs$o.colors.error.main,
|
4446
|
+
[vars$A.knobColor]: globalRefs$o.colors.error.main,
|
4391
4447
|
},
|
4392
4448
|
};
|
4393
4449
|
|
4394
4450
|
var switchToggle$1 = /*#__PURE__*/Object.freeze({
|
4395
4451
|
__proto__: null,
|
4396
4452
|
default: switchToggle,
|
4397
|
-
vars: vars$
|
4453
|
+
vars: vars$A
|
4398
4454
|
});
|
4399
4455
|
|
4400
|
-
const componentName$
|
4456
|
+
const componentName$H = getComponentName('container');
|
4401
4457
|
|
4402
|
-
class RawContainer extends createBaseClass({ componentName: componentName$
|
4458
|
+
class RawContainer extends createBaseClass({ componentName: componentName$H, baseSelector: 'slot' }) {
|
4403
4459
|
constructor() {
|
4404
4460
|
super();
|
4405
4461
|
|
@@ -4452,7 +4508,7 @@ const ContainerClass = compose(
|
|
4452
4508
|
componentNameValidationMixin
|
4453
4509
|
)(RawContainer);
|
4454
4510
|
|
4455
|
-
const globalRefs$
|
4511
|
+
const globalRefs$n = getThemeRefs(globals);
|
4456
4512
|
|
4457
4513
|
const compVars$4 = ContainerClass.cssVarList;
|
4458
4514
|
|
@@ -4474,7 +4530,7 @@ const [helperTheme$2, helperRefs$2, helperVars$2] = createHelperVars(
|
|
4474
4530
|
horizontalAlignment,
|
4475
4531
|
shadowColor: '#00000020', // if we want to support transparency vars, we should use different color format
|
4476
4532
|
},
|
4477
|
-
componentName$
|
4533
|
+
componentName$H
|
4478
4534
|
);
|
4479
4535
|
|
4480
4536
|
const { shadowColor: shadowColor$1 } = helperRefs$2;
|
@@ -4484,10 +4540,10 @@ const container = {
|
|
4484
4540
|
|
4485
4541
|
[compVars$4.hostWidth]: '100%',
|
4486
4542
|
[compVars$4.boxShadow]: 'none',
|
4487
|
-
[compVars$4.backgroundColor]: globalRefs$
|
4488
|
-
[compVars$4.color]: globalRefs$
|
4543
|
+
[compVars$4.backgroundColor]: globalRefs$n.colors.surface.main,
|
4544
|
+
[compVars$4.color]: globalRefs$n.colors.surface.contrast,
|
4489
4545
|
[compVars$4.borderRadius]: '0px',
|
4490
|
-
[compVars$4.hostDirection]: globalRefs$
|
4546
|
+
[compVars$4.hostDirection]: globalRefs$n.direction,
|
4491
4547
|
|
4492
4548
|
verticalPadding: {
|
4493
4549
|
sm: { [compVars$4.verticalPadding]: '5px' },
|
@@ -4533,34 +4589,34 @@ const container = {
|
|
4533
4589
|
|
4534
4590
|
shadow: {
|
4535
4591
|
sm: {
|
4536
|
-
[compVars$4.boxShadow]: `${globalRefs$
|
4592
|
+
[compVars$4.boxShadow]: `${globalRefs$n.shadow.wide.sm} ${shadowColor$1}, ${globalRefs$n.shadow.narrow.sm} ${shadowColor$1}`,
|
4537
4593
|
},
|
4538
4594
|
md: {
|
4539
|
-
[compVars$4.boxShadow]: `${globalRefs$
|
4595
|
+
[compVars$4.boxShadow]: `${globalRefs$n.shadow.wide.md} ${shadowColor$1}, ${globalRefs$n.shadow.narrow.md} ${shadowColor$1}`,
|
4540
4596
|
},
|
4541
4597
|
lg: {
|
4542
|
-
[compVars$4.boxShadow]: `${globalRefs$
|
4598
|
+
[compVars$4.boxShadow]: `${globalRefs$n.shadow.wide.lg} ${shadowColor$1}, ${globalRefs$n.shadow.narrow.lg} ${shadowColor$1}`,
|
4543
4599
|
},
|
4544
4600
|
xl: {
|
4545
|
-
[compVars$4.boxShadow]: `${globalRefs$
|
4601
|
+
[compVars$4.boxShadow]: `${globalRefs$n.shadow.wide.xl} ${shadowColor$1}, ${globalRefs$n.shadow.narrow.xl} ${shadowColor$1}`,
|
4546
4602
|
},
|
4547
4603
|
'2xl': {
|
4548
4604
|
[helperVars$2.shadowColor]: '#00000050', // mimic daisyUI shadow settings
|
4549
|
-
[compVars$4.boxShadow]: `${globalRefs$
|
4605
|
+
[compVars$4.boxShadow]: `${globalRefs$n.shadow.wide['2xl']} ${shadowColor$1}`,
|
4550
4606
|
},
|
4551
4607
|
},
|
4552
4608
|
|
4553
4609
|
borderRadius: {
|
4554
|
-
sm: { [compVars$4.borderRadius]: globalRefs$
|
4555
|
-
md: { [compVars$4.borderRadius]: globalRefs$
|
4556
|
-
lg: { [compVars$4.borderRadius]: globalRefs$
|
4557
|
-
xl: { [compVars$4.borderRadius]: globalRefs$
|
4558
|
-
'2xl': { [compVars$4.borderRadius]: globalRefs$
|
4559
|
-
'3xl': { [compVars$4.borderRadius]: globalRefs$
|
4610
|
+
sm: { [compVars$4.borderRadius]: globalRefs$n.radius.sm },
|
4611
|
+
md: { [compVars$4.borderRadius]: globalRefs$n.radius.md },
|
4612
|
+
lg: { [compVars$4.borderRadius]: globalRefs$n.radius.lg },
|
4613
|
+
xl: { [compVars$4.borderRadius]: globalRefs$n.radius.xl },
|
4614
|
+
'2xl': { [compVars$4.borderRadius]: globalRefs$n.radius['2xl'] },
|
4615
|
+
'3xl': { [compVars$4.borderRadius]: globalRefs$n.radius['3xl'] },
|
4560
4616
|
},
|
4561
4617
|
};
|
4562
4618
|
|
4563
|
-
const vars$
|
4619
|
+
const vars$z = {
|
4564
4620
|
...compVars$4,
|
4565
4621
|
...helperVars$2,
|
4566
4622
|
};
|
@@ -4568,7 +4624,7 @@ const vars$x = {
|
|
4568
4624
|
var container$1 = /*#__PURE__*/Object.freeze({
|
4569
4625
|
__proto__: null,
|
4570
4626
|
default: container,
|
4571
|
-
vars: vars$
|
4627
|
+
vars: vars$z
|
4572
4628
|
});
|
4573
4629
|
|
4574
4630
|
const createCssVarImageClass = ({ componentName, varName, fallbackVarName }) => {
|
@@ -4621,69 +4677,69 @@ const createCssVarImageClass = ({ componentName, varName, fallbackVarName }) =>
|
|
4621
4677
|
return CssVarImageClass;
|
4622
4678
|
};
|
4623
4679
|
|
4624
|
-
const componentName$
|
4680
|
+
const componentName$G = getComponentName('logo');
|
4625
4681
|
|
4626
4682
|
const LogoClass = createCssVarImageClass({
|
4627
|
-
componentName: componentName$
|
4683
|
+
componentName: componentName$G,
|
4628
4684
|
varName: 'url',
|
4629
4685
|
fallbackVarName: 'fallbackUrl',
|
4630
4686
|
});
|
4631
4687
|
|
4632
|
-
const vars$
|
4688
|
+
const vars$y = LogoClass.cssVarList;
|
4633
4689
|
|
4634
4690
|
const logo$2 = {
|
4635
|
-
[vars$
|
4691
|
+
[vars$y.fallbackUrl]: 'url(https://imgs.descope.com/components/no-logo-placeholder.svg)',
|
4636
4692
|
};
|
4637
4693
|
|
4638
4694
|
var logo$3 = /*#__PURE__*/Object.freeze({
|
4639
4695
|
__proto__: null,
|
4640
4696
|
default: logo$2,
|
4641
|
-
vars: vars$
|
4697
|
+
vars: vars$y
|
4642
4698
|
});
|
4643
4699
|
|
4644
|
-
const componentName$
|
4700
|
+
const componentName$F = getComponentName('totp-image');
|
4645
4701
|
|
4646
4702
|
const TotpImageClass = createCssVarImageClass({
|
4647
|
-
componentName: componentName$
|
4703
|
+
componentName: componentName$F,
|
4648
4704
|
varName: 'url',
|
4649
4705
|
fallbackVarName: 'fallbackUrl',
|
4650
4706
|
});
|
4651
4707
|
|
4652
|
-
const vars$
|
4708
|
+
const vars$x = TotpImageClass.cssVarList;
|
4653
4709
|
|
4654
4710
|
const logo$1 = {
|
4655
|
-
[vars$
|
4711
|
+
[vars$x.fallbackUrl]: 'url(https://imgs.descope.com/components/totp-placeholder.svg)',
|
4656
4712
|
};
|
4657
4713
|
|
4658
4714
|
var totpImage = /*#__PURE__*/Object.freeze({
|
4659
4715
|
__proto__: null,
|
4660
4716
|
default: logo$1,
|
4661
|
-
vars: vars$
|
4717
|
+
vars: vars$x
|
4662
4718
|
});
|
4663
4719
|
|
4664
|
-
const componentName$
|
4720
|
+
const componentName$E = getComponentName('notp-image');
|
4665
4721
|
|
4666
4722
|
const NotpImageClass = createCssVarImageClass({
|
4667
|
-
componentName: componentName$
|
4723
|
+
componentName: componentName$E,
|
4668
4724
|
varName: 'url',
|
4669
4725
|
fallbackVarName: 'fallbackUrl',
|
4670
4726
|
});
|
4671
4727
|
|
4672
|
-
const vars$
|
4728
|
+
const vars$w = NotpImageClass.cssVarList;
|
4673
4729
|
|
4674
4730
|
const logo = {
|
4675
|
-
[vars$
|
4731
|
+
[vars$w.fallbackUrl]: 'url(https://imgs.descope.com/components/notp-placeholder.svg)',
|
4676
4732
|
};
|
4677
4733
|
|
4678
4734
|
var notpImage = /*#__PURE__*/Object.freeze({
|
4679
4735
|
__proto__: null,
|
4680
4736
|
default: logo,
|
4681
|
-
vars: vars$
|
4737
|
+
vars: vars$w
|
4682
4738
|
});
|
4683
4739
|
|
4684
|
-
const componentName$
|
4740
|
+
const componentName$D = getComponentName('text');
|
4685
4741
|
|
4686
|
-
class RawText extends createBaseClass({ componentName: componentName$
|
4742
|
+
class RawText extends createBaseClass({ componentName: componentName$D, baseSelector: ':host > slot' }) {
|
4687
4743
|
constructor() {
|
4688
4744
|
super();
|
4689
4745
|
|
@@ -4740,94 +4796,94 @@ const TextClass = compose(
|
|
4740
4796
|
componentNameValidationMixin
|
4741
4797
|
)(RawText);
|
4742
4798
|
|
4743
|
-
const globalRefs$
|
4744
|
-
const vars$
|
4799
|
+
const globalRefs$m = getThemeRefs(globals);
|
4800
|
+
const vars$v = TextClass.cssVarList;
|
4745
4801
|
|
4746
4802
|
const text$2 = {
|
4747
|
-
[vars$
|
4748
|
-
[vars$
|
4749
|
-
[vars$
|
4750
|
-
[vars$
|
4803
|
+
[vars$v.hostDirection]: globalRefs$m.direction,
|
4804
|
+
[vars$v.textLineHeight]: '1.35em',
|
4805
|
+
[vars$v.textAlign]: 'left',
|
4806
|
+
[vars$v.textColor]: globalRefs$m.colors.surface.dark,
|
4751
4807
|
variant: {
|
4752
4808
|
h1: {
|
4753
|
-
[vars$
|
4754
|
-
[vars$
|
4755
|
-
[vars$
|
4809
|
+
[vars$v.fontSize]: globalRefs$m.typography.h1.size,
|
4810
|
+
[vars$v.fontWeight]: globalRefs$m.typography.h1.weight,
|
4811
|
+
[vars$v.fontFamily]: globalRefs$m.typography.h1.font,
|
4756
4812
|
},
|
4757
4813
|
h2: {
|
4758
|
-
[vars$
|
4759
|
-
[vars$
|
4760
|
-
[vars$
|
4814
|
+
[vars$v.fontSize]: globalRefs$m.typography.h2.size,
|
4815
|
+
[vars$v.fontWeight]: globalRefs$m.typography.h2.weight,
|
4816
|
+
[vars$v.fontFamily]: globalRefs$m.typography.h2.font,
|
4761
4817
|
},
|
4762
4818
|
h3: {
|
4763
|
-
[vars$
|
4764
|
-
[vars$
|
4765
|
-
[vars$
|
4819
|
+
[vars$v.fontSize]: globalRefs$m.typography.h3.size,
|
4820
|
+
[vars$v.fontWeight]: globalRefs$m.typography.h3.weight,
|
4821
|
+
[vars$v.fontFamily]: globalRefs$m.typography.h3.font,
|
4766
4822
|
},
|
4767
4823
|
subtitle1: {
|
4768
|
-
[vars$
|
4769
|
-
[vars$
|
4770
|
-
[vars$
|
4824
|
+
[vars$v.fontSize]: globalRefs$m.typography.subtitle1.size,
|
4825
|
+
[vars$v.fontWeight]: globalRefs$m.typography.subtitle1.weight,
|
4826
|
+
[vars$v.fontFamily]: globalRefs$m.typography.subtitle1.font,
|
4771
4827
|
},
|
4772
4828
|
subtitle2: {
|
4773
|
-
[vars$
|
4774
|
-
[vars$
|
4775
|
-
[vars$
|
4829
|
+
[vars$v.fontSize]: globalRefs$m.typography.subtitle2.size,
|
4830
|
+
[vars$v.fontWeight]: globalRefs$m.typography.subtitle2.weight,
|
4831
|
+
[vars$v.fontFamily]: globalRefs$m.typography.subtitle2.font,
|
4776
4832
|
},
|
4777
4833
|
body1: {
|
4778
|
-
[vars$
|
4779
|
-
[vars$
|
4780
|
-
[vars$
|
4834
|
+
[vars$v.fontSize]: globalRefs$m.typography.body1.size,
|
4835
|
+
[vars$v.fontWeight]: globalRefs$m.typography.body1.weight,
|
4836
|
+
[vars$v.fontFamily]: globalRefs$m.typography.body1.font,
|
4781
4837
|
},
|
4782
4838
|
body2: {
|
4783
|
-
[vars$
|
4784
|
-
[vars$
|
4785
|
-
[vars$
|
4839
|
+
[vars$v.fontSize]: globalRefs$m.typography.body2.size,
|
4840
|
+
[vars$v.fontWeight]: globalRefs$m.typography.body2.weight,
|
4841
|
+
[vars$v.fontFamily]: globalRefs$m.typography.body2.font,
|
4786
4842
|
},
|
4787
4843
|
},
|
4788
4844
|
|
4789
4845
|
mode: {
|
4790
4846
|
primary: {
|
4791
|
-
[vars$
|
4847
|
+
[vars$v.textColor]: globalRefs$m.colors.surface.contrast,
|
4792
4848
|
},
|
4793
4849
|
secondary: {
|
4794
|
-
[vars$
|
4850
|
+
[vars$v.textColor]: globalRefs$m.colors.surface.dark,
|
4795
4851
|
},
|
4796
4852
|
error: {
|
4797
|
-
[vars$
|
4853
|
+
[vars$v.textColor]: globalRefs$m.colors.error.main,
|
4798
4854
|
},
|
4799
4855
|
success: {
|
4800
|
-
[vars$
|
4856
|
+
[vars$v.textColor]: globalRefs$m.colors.success.main,
|
4801
4857
|
},
|
4802
4858
|
},
|
4803
4859
|
|
4804
4860
|
textAlign: {
|
4805
|
-
right: { [vars$
|
4806
|
-
left: { [vars$
|
4807
|
-
center: { [vars$
|
4861
|
+
right: { [vars$v.textAlign]: 'right' },
|
4862
|
+
left: { [vars$v.textAlign]: 'left' },
|
4863
|
+
center: { [vars$v.textAlign]: 'center' },
|
4808
4864
|
},
|
4809
4865
|
|
4810
4866
|
_fullWidth: {
|
4811
|
-
[vars$
|
4867
|
+
[vars$v.hostWidth]: '100%',
|
4812
4868
|
},
|
4813
4869
|
|
4814
4870
|
_italic: {
|
4815
|
-
[vars$
|
4871
|
+
[vars$v.fontStyle]: 'italic',
|
4816
4872
|
},
|
4817
4873
|
|
4818
4874
|
_uppercase: {
|
4819
|
-
[vars$
|
4875
|
+
[vars$v.textTransform]: 'uppercase',
|
4820
4876
|
},
|
4821
4877
|
|
4822
4878
|
_lowercase: {
|
4823
|
-
[vars$
|
4879
|
+
[vars$v.textTransform]: 'lowercase',
|
4824
4880
|
},
|
4825
4881
|
};
|
4826
4882
|
|
4827
4883
|
var text$3 = /*#__PURE__*/Object.freeze({
|
4828
4884
|
__proto__: null,
|
4829
4885
|
default: text$2,
|
4830
|
-
vars: vars$
|
4886
|
+
vars: vars$v
|
4831
4887
|
});
|
4832
4888
|
|
4833
4889
|
const textRuleSet = {
|
@@ -4844,9 +4900,9 @@ const textRuleSet = {
|
|
4844
4900
|
},
|
4845
4901
|
};
|
4846
4902
|
|
4847
|
-
const componentName$
|
4903
|
+
const componentName$C = getComponentName('enriched-text');
|
4848
4904
|
|
4849
|
-
let EnrichedText$2 = class EnrichedText extends createBaseClass({ componentName: componentName$
|
4905
|
+
let EnrichedText$2 = class EnrichedText extends createBaseClass({ componentName: componentName$C, baseSelector: ':host > div' }) {
|
4850
4906
|
#origLinkRenderer;
|
4851
4907
|
|
4852
4908
|
constructor() {
|
@@ -5007,9 +5063,9 @@ const EnrichedTextClass = compose(
|
|
5007
5063
|
componentNameValidationMixin
|
5008
5064
|
)(EnrichedText$2);
|
5009
5065
|
|
5010
|
-
const componentName$
|
5066
|
+
const componentName$B = getComponentName('link');
|
5011
5067
|
|
5012
|
-
class RawLink extends createBaseClass({ componentName: componentName$
|
5068
|
+
class RawLink extends createBaseClass({ componentName: componentName$B, baseSelector: ':host a' }) {
|
5013
5069
|
constructor() {
|
5014
5070
|
super();
|
5015
5071
|
|
@@ -5075,120 +5131,120 @@ const LinkClass = compose(
|
|
5075
5131
|
componentNameValidationMixin
|
5076
5132
|
)(RawLink);
|
5077
5133
|
|
5078
|
-
const globalRefs$
|
5079
|
-
const vars$
|
5134
|
+
const globalRefs$l = getThemeRefs(globals);
|
5135
|
+
const vars$u = EnrichedTextClass.cssVarList;
|
5080
5136
|
|
5081
5137
|
const EnrichedText = {
|
5082
|
-
[vars$
|
5138
|
+
[vars$u.hostDirection]: globalRefs$l.direction,
|
5083
5139
|
|
5084
|
-
[vars$
|
5085
|
-
[vars$
|
5086
|
-
[vars$
|
5140
|
+
[vars$u.fontSize]: globalRefs$l.typography.body1.size,
|
5141
|
+
[vars$u.fontWeight]: globalRefs$l.typography.body1.weight,
|
5142
|
+
[vars$u.fontFamily]: globalRefs$l.typography.body1.font,
|
5087
5143
|
|
5088
|
-
[vars$
|
5089
|
-
[vars$
|
5090
|
-
[vars$
|
5144
|
+
[vars$u.textLineHeight]: '1.35em',
|
5145
|
+
[vars$u.textAlign]: 'left',
|
5146
|
+
[vars$u.textColor]: globalRefs$l.colors.surface.dark,
|
5091
5147
|
|
5092
|
-
[vars$
|
5148
|
+
[vars$u.linkColor]: `var(${LinkClass.cssVarList.textColor})`,
|
5093
5149
|
|
5094
5150
|
mode: {
|
5095
5151
|
primary: {
|
5096
|
-
[vars$
|
5152
|
+
[vars$u.textColor]: globalRefs$l.colors.surface.contrast,
|
5097
5153
|
},
|
5098
5154
|
secondary: {
|
5099
|
-
[vars$
|
5155
|
+
[vars$u.textColor]: globalRefs$l.colors.surface.dark,
|
5100
5156
|
},
|
5101
5157
|
error: {
|
5102
|
-
[vars$
|
5158
|
+
[vars$u.textColor]: globalRefs$l.colors.error.main,
|
5103
5159
|
},
|
5104
5160
|
success: {
|
5105
|
-
[vars$
|
5161
|
+
[vars$u.textColor]: globalRefs$l.colors.success.main,
|
5106
5162
|
},
|
5107
5163
|
},
|
5108
5164
|
|
5109
5165
|
variant: {
|
5110
5166
|
h1: {
|
5111
|
-
[vars$
|
5112
|
-
[vars$
|
5113
|
-
[vars$
|
5167
|
+
[vars$u.fontSize]: globalRefs$l.typography.h1.size,
|
5168
|
+
[vars$u.fontWeight]: globalRefs$l.typography.h1.weight,
|
5169
|
+
[vars$u.fontFamily]: globalRefs$l.typography.h1.font,
|
5114
5170
|
},
|
5115
5171
|
h2: {
|
5116
|
-
[vars$
|
5117
|
-
[vars$
|
5118
|
-
[vars$
|
5172
|
+
[vars$u.fontSize]: globalRefs$l.typography.h2.size,
|
5173
|
+
[vars$u.fontWeight]: globalRefs$l.typography.h2.weight,
|
5174
|
+
[vars$u.fontFamily]: globalRefs$l.typography.h2.font,
|
5119
5175
|
},
|
5120
5176
|
h3: {
|
5121
|
-
[vars$
|
5122
|
-
[vars$
|
5123
|
-
[vars$
|
5177
|
+
[vars$u.fontSize]: globalRefs$l.typography.h3.size,
|
5178
|
+
[vars$u.fontWeight]: globalRefs$l.typography.h3.weight,
|
5179
|
+
[vars$u.fontFamily]: globalRefs$l.typography.h3.font,
|
5124
5180
|
},
|
5125
5181
|
subtitle1: {
|
5126
|
-
[vars$
|
5127
|
-
[vars$
|
5128
|
-
[vars$
|
5182
|
+
[vars$u.fontSize]: globalRefs$l.typography.subtitle1.size,
|
5183
|
+
[vars$u.fontWeight]: globalRefs$l.typography.subtitle1.weight,
|
5184
|
+
[vars$u.fontFamily]: globalRefs$l.typography.subtitle1.font,
|
5129
5185
|
},
|
5130
5186
|
subtitle2: {
|
5131
|
-
[vars$
|
5132
|
-
[vars$
|
5133
|
-
[vars$
|
5187
|
+
[vars$u.fontSize]: globalRefs$l.typography.subtitle2.size,
|
5188
|
+
[vars$u.fontWeight]: globalRefs$l.typography.subtitle2.weight,
|
5189
|
+
[vars$u.fontFamily]: globalRefs$l.typography.subtitle2.font,
|
5134
5190
|
},
|
5135
5191
|
body1: {
|
5136
|
-
[vars$
|
5137
|
-
[vars$
|
5138
|
-
[vars$
|
5192
|
+
[vars$u.fontSize]: globalRefs$l.typography.body1.size,
|
5193
|
+
[vars$u.fontWeight]: globalRefs$l.typography.body1.weight,
|
5194
|
+
[vars$u.fontFamily]: globalRefs$l.typography.body1.font,
|
5139
5195
|
},
|
5140
5196
|
body2: {
|
5141
|
-
[vars$
|
5142
|
-
[vars$
|
5143
|
-
[vars$
|
5197
|
+
[vars$u.fontSize]: globalRefs$l.typography.body2.size,
|
5198
|
+
[vars$u.fontWeight]: globalRefs$l.typography.body2.weight,
|
5199
|
+
[vars$u.fontFamily]: globalRefs$l.typography.body2.font,
|
5144
5200
|
},
|
5145
5201
|
},
|
5146
5202
|
|
5147
5203
|
textAlign: {
|
5148
|
-
right: { [vars$
|
5149
|
-
left: { [vars$
|
5150
|
-
center: { [vars$
|
5204
|
+
right: { [vars$u.textAlign]: 'right' },
|
5205
|
+
left: { [vars$u.textAlign]: 'left' },
|
5206
|
+
center: { [vars$u.textAlign]: 'center' },
|
5151
5207
|
},
|
5152
5208
|
|
5153
5209
|
_fullWidth: {
|
5154
|
-
[vars$
|
5210
|
+
[vars$u.hostWidth]: '100%',
|
5155
5211
|
},
|
5156
5212
|
};
|
5157
5213
|
|
5158
5214
|
var EnrichedText$1 = /*#__PURE__*/Object.freeze({
|
5159
5215
|
__proto__: null,
|
5160
5216
|
default: EnrichedText,
|
5161
|
-
vars: vars$
|
5217
|
+
vars: vars$u
|
5162
5218
|
});
|
5163
5219
|
|
5164
|
-
const globalRefs$
|
5165
|
-
const vars$
|
5220
|
+
const globalRefs$k = getThemeRefs(globals);
|
5221
|
+
const vars$t = LinkClass.cssVarList;
|
5166
5222
|
|
5167
5223
|
const link$1 = {
|
5168
|
-
[vars$
|
5169
|
-
[vars$
|
5224
|
+
[vars$t.hostDirection]: globalRefs$k.direction,
|
5225
|
+
[vars$t.cursor]: 'pointer',
|
5170
5226
|
|
5171
|
-
[vars$
|
5227
|
+
[vars$t.textColor]: globalRefs$k.colors.primary.main,
|
5172
5228
|
|
5173
5229
|
textAlign: {
|
5174
|
-
right: { [vars$
|
5175
|
-
left: { [vars$
|
5176
|
-
center: { [vars$
|
5230
|
+
right: { [vars$t.textAlign]: 'right' },
|
5231
|
+
left: { [vars$t.textAlign]: 'left' },
|
5232
|
+
center: { [vars$t.textAlign]: 'center' },
|
5177
5233
|
},
|
5178
5234
|
|
5179
5235
|
_fullWidth: {
|
5180
|
-
[vars$
|
5236
|
+
[vars$t.hostWidth]: '100%',
|
5181
5237
|
},
|
5182
5238
|
|
5183
5239
|
mode: {
|
5184
5240
|
secondary: {
|
5185
|
-
[vars$
|
5241
|
+
[vars$t.textColor]: globalRefs$k.colors.secondary.main,
|
5186
5242
|
},
|
5187
5243
|
error: {
|
5188
|
-
[vars$
|
5244
|
+
[vars$t.textColor]: globalRefs$k.colors.error.main,
|
5189
5245
|
},
|
5190
5246
|
success: {
|
5191
|
-
[vars$
|
5247
|
+
[vars$t.textColor]: globalRefs$k.colors.success.main,
|
5192
5248
|
},
|
5193
5249
|
},
|
5194
5250
|
};
|
@@ -5196,11 +5252,11 @@ const link$1 = {
|
|
5196
5252
|
var link$2 = /*#__PURE__*/Object.freeze({
|
5197
5253
|
__proto__: null,
|
5198
5254
|
default: link$1,
|
5199
|
-
vars: vars$
|
5255
|
+
vars: vars$t
|
5200
5256
|
});
|
5201
5257
|
|
5202
|
-
const componentName$
|
5203
|
-
class RawDivider extends createBaseClass({ componentName: componentName$
|
5258
|
+
const componentName$A = getComponentName('divider');
|
5259
|
+
class RawDivider extends createBaseClass({ componentName: componentName$A, baseSelector: ':host > div' }) {
|
5204
5260
|
constructor() {
|
5205
5261
|
super();
|
5206
5262
|
|
@@ -5299,7 +5355,7 @@ const DividerClass = compose(
|
|
5299
5355
|
componentNameValidationMixin
|
5300
5356
|
)(RawDivider);
|
5301
5357
|
|
5302
|
-
const globalRefs$
|
5358
|
+
const globalRefs$j = getThemeRefs(globals);
|
5303
5359
|
const compVars$3 = DividerClass.cssVarList;
|
5304
5360
|
|
5305
5361
|
const [helperTheme$1, helperRefs$1, helperVars$1] = createHelperVars(
|
@@ -5307,18 +5363,18 @@ const [helperTheme$1, helperRefs$1, helperVars$1] = createHelperVars(
|
|
5307
5363
|
thickness: '2px',
|
5308
5364
|
spacing: '10px',
|
5309
5365
|
},
|
5310
|
-
componentName$
|
5366
|
+
componentName$A
|
5311
5367
|
);
|
5312
5368
|
|
5313
5369
|
const divider = {
|
5314
5370
|
...helperTheme$1,
|
5315
5371
|
|
5316
|
-
[compVars$3.hostDirection]: globalRefs$
|
5372
|
+
[compVars$3.hostDirection]: globalRefs$j.direction,
|
5317
5373
|
[compVars$3.alignItems]: 'center',
|
5318
5374
|
[compVars$3.flexDirection]: 'row',
|
5319
5375
|
[compVars$3.alignSelf]: 'stretch',
|
5320
5376
|
[compVars$3.hostWidth]: '100%',
|
5321
|
-
[compVars$3.stripeColor]: globalRefs$
|
5377
|
+
[compVars$3.stripeColor]: globalRefs$j.colors.surface.light,
|
5322
5378
|
[compVars$3.stripeColorOpacity]: '0.5',
|
5323
5379
|
[compVars$3.stripeHorizontalThickness]: helperRefs$1.thickness,
|
5324
5380
|
[compVars$3.labelTextWidth]: 'fit-content',
|
@@ -5338,7 +5394,7 @@ const divider = {
|
|
5338
5394
|
},
|
5339
5395
|
};
|
5340
5396
|
|
5341
|
-
const vars$
|
5397
|
+
const vars$s = {
|
5342
5398
|
...compVars$3,
|
5343
5399
|
...helperVars$1,
|
5344
5400
|
};
|
@@ -5346,18 +5402,18 @@ const vars$q = {
|
|
5346
5402
|
var divider$1 = /*#__PURE__*/Object.freeze({
|
5347
5403
|
__proto__: null,
|
5348
5404
|
default: divider,
|
5349
|
-
vars: vars$
|
5405
|
+
vars: vars$s
|
5350
5406
|
});
|
5351
5407
|
|
5352
5408
|
/* eslint-disable no-param-reassign */
|
5353
5409
|
|
5354
|
-
const componentName$
|
5410
|
+
const componentName$z = getComponentName('passcode-internal');
|
5355
5411
|
|
5356
|
-
createBaseInputClass({ componentName: componentName$
|
5412
|
+
createBaseInputClass({ componentName: componentName$z, baseSelector: 'div' });
|
5357
5413
|
|
5358
|
-
const componentName$
|
5414
|
+
const componentName$y = getComponentName('loader-radial');
|
5359
5415
|
|
5360
|
-
class RawLoaderRadial extends createBaseClass({ componentName: componentName$
|
5416
|
+
class RawLoaderRadial extends createBaseClass({ componentName: componentName$y, baseSelector: ':host > div' }) {
|
5361
5417
|
constructor() {
|
5362
5418
|
super();
|
5363
5419
|
|
@@ -5401,11 +5457,11 @@ const LoaderRadialClass = compose(
|
|
5401
5457
|
componentNameValidationMixin
|
5402
5458
|
)(RawLoaderRadial);
|
5403
5459
|
|
5404
|
-
const componentName$
|
5460
|
+
const componentName$x = getComponentName('passcode');
|
5405
5461
|
|
5406
5462
|
const observedAttributes$3 = ['digits'];
|
5407
5463
|
|
5408
|
-
const customMixin$
|
5464
|
+
const customMixin$7 = (superclass) =>
|
5409
5465
|
class PasscodeMixinClass extends superclass {
|
5410
5466
|
static get observedAttributes() {
|
5411
5467
|
return observedAttributes$3.concat(superclass.observedAttributes || []);
|
@@ -5420,17 +5476,17 @@ const customMixin$6 = (superclass) =>
|
|
5420
5476
|
const template = document.createElement('template');
|
5421
5477
|
|
5422
5478
|
template.innerHTML = `
|
5423
|
-
<${componentName$
|
5479
|
+
<${componentName$z}
|
5424
5480
|
bordered="true"
|
5425
5481
|
name="code"
|
5426
5482
|
tabindex="-1"
|
5427
5483
|
slot="input"
|
5428
|
-
><slot></slot></${componentName$
|
5484
|
+
><slot></slot></${componentName$z}>
|
5429
5485
|
`;
|
5430
5486
|
|
5431
5487
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
5432
5488
|
|
5433
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
5489
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$z);
|
5434
5490
|
|
5435
5491
|
forwardAttrs(this, this.inputElement, { includeAttrs: ['digits', 'size', 'loading'] });
|
5436
5492
|
}
|
@@ -5501,7 +5557,7 @@ const PasscodeClass = compose(
|
|
5501
5557
|
draggableMixin,
|
5502
5558
|
composedProxyInputMixin({ proxyProps: ['value', 'selectionStart'] }),
|
5503
5559
|
componentNameValidationMixin,
|
5504
|
-
customMixin$
|
5560
|
+
customMixin$7
|
5505
5561
|
)(
|
5506
5562
|
createProxy({
|
5507
5563
|
slots: [],
|
@@ -5577,56 +5633,56 @@ const PasscodeClass = compose(
|
|
5577
5633
|
${resetInputCursor('vaadin-text-field')}
|
5578
5634
|
`,
|
5579
5635
|
excludeAttrsSync: ['tabindex'],
|
5580
|
-
componentName: componentName$
|
5636
|
+
componentName: componentName$x,
|
5581
5637
|
})
|
5582
5638
|
);
|
5583
5639
|
|
5584
|
-
const vars$
|
5640
|
+
const vars$r = PasscodeClass.cssVarList;
|
5585
5641
|
|
5586
5642
|
const passcode = {
|
5587
|
-
[vars$
|
5588
|
-
[vars$
|
5589
|
-
[vars$
|
5590
|
-
[vars$
|
5591
|
-
[vars$
|
5592
|
-
[vars$
|
5593
|
-
[vars$
|
5594
|
-
[vars$
|
5595
|
-
[vars$
|
5596
|
-
[vars$
|
5597
|
-
[vars$
|
5598
|
-
[vars$
|
5599
|
-
[vars$
|
5600
|
-
[vars$
|
5601
|
-
[vars$
|
5643
|
+
[vars$r.hostDirection]: refs.direction,
|
5644
|
+
[vars$r.fontFamily]: refs.fontFamily,
|
5645
|
+
[vars$r.fontSize]: refs.fontSize,
|
5646
|
+
[vars$r.labelTextColor]: refs.labelTextColor,
|
5647
|
+
[vars$r.labelRequiredIndicator]: refs.requiredIndicator,
|
5648
|
+
[vars$r.errorMessageTextColor]: refs.errorMessageTextColor,
|
5649
|
+
[vars$r.digitValueTextColor]: refs.valueTextColor,
|
5650
|
+
[vars$r.digitPadding]: '0',
|
5651
|
+
[vars$r.digitTextAlign]: 'center',
|
5652
|
+
[vars$r.digitSpacing]: '4px',
|
5653
|
+
[vars$r.hostWidth]: refs.width,
|
5654
|
+
[vars$r.digitOutlineColor]: 'transparent',
|
5655
|
+
[vars$r.digitOutlineWidth]: refs.outlineWidth,
|
5656
|
+
[vars$r.focusedDigitFieldOutlineColor]: refs.outlineColor,
|
5657
|
+
[vars$r.digitSize]: refs.inputHeight,
|
5602
5658
|
|
5603
5659
|
size: {
|
5604
|
-
xs: { [vars$
|
5605
|
-
sm: { [vars$
|
5606
|
-
md: { [vars$
|
5607
|
-
lg: { [vars$
|
5660
|
+
xs: { [vars$r.spinnerSize]: '15px' },
|
5661
|
+
sm: { [vars$r.spinnerSize]: '20px' },
|
5662
|
+
md: { [vars$r.spinnerSize]: '20px' },
|
5663
|
+
lg: { [vars$r.spinnerSize]: '20px' },
|
5608
5664
|
},
|
5609
5665
|
|
5610
5666
|
_hideCursor: {
|
5611
|
-
[vars$
|
5667
|
+
[vars$r.digitCaretTextColor]: 'transparent',
|
5612
5668
|
},
|
5613
5669
|
|
5614
5670
|
_loading: {
|
5615
|
-
[vars$
|
5671
|
+
[vars$r.overlayOpacity]: refs.overlayOpacity,
|
5616
5672
|
},
|
5617
5673
|
};
|
5618
5674
|
|
5619
5675
|
var passcode$1 = /*#__PURE__*/Object.freeze({
|
5620
5676
|
__proto__: null,
|
5621
5677
|
default: passcode,
|
5622
|
-
vars: vars$
|
5678
|
+
vars: vars$r
|
5623
5679
|
});
|
5624
5680
|
|
5625
|
-
const componentName$
|
5681
|
+
const componentName$w = getComponentName('loader-linear');
|
5626
5682
|
|
5627
|
-
class RawLoaderLinear extends createBaseClass({ componentName: componentName$
|
5683
|
+
class RawLoaderLinear extends createBaseClass({ componentName: componentName$w, baseSelector: ':host > div' }) {
|
5628
5684
|
static get componentName() {
|
5629
|
-
return componentName$
|
5685
|
+
return componentName$w;
|
5630
5686
|
}
|
5631
5687
|
|
5632
5688
|
constructor() {
|
@@ -5687,67 +5743,67 @@ const LoaderLinearClass = compose(
|
|
5687
5743
|
componentNameValidationMixin
|
5688
5744
|
)(RawLoaderLinear);
|
5689
5745
|
|
5690
|
-
const globalRefs$
|
5691
|
-
const vars$
|
5746
|
+
const globalRefs$i = getThemeRefs(globals);
|
5747
|
+
const vars$q = LoaderLinearClass.cssVarList;
|
5692
5748
|
|
5693
5749
|
const loaderLinear = {
|
5694
|
-
[vars$
|
5695
|
-
[vars$
|
5750
|
+
[vars$q.hostDisplay]: 'inline-block',
|
5751
|
+
[vars$q.hostWidth]: '100%',
|
5696
5752
|
|
5697
|
-
[vars$
|
5698
|
-
[vars$
|
5753
|
+
[vars$q.barColor]: globalRefs$i.colors.surface.contrast,
|
5754
|
+
[vars$q.barWidth]: '20%',
|
5699
5755
|
|
5700
|
-
[vars$
|
5701
|
-
[vars$
|
5756
|
+
[vars$q.barBackgroundColor]: globalRefs$i.colors.surface.light,
|
5757
|
+
[vars$q.barBorderRadius]: '4px',
|
5702
5758
|
|
5703
|
-
[vars$
|
5704
|
-
[vars$
|
5705
|
-
[vars$
|
5706
|
-
[vars$
|
5759
|
+
[vars$q.animationDuration]: '2s',
|
5760
|
+
[vars$q.animationTimingFunction]: 'linear',
|
5761
|
+
[vars$q.animationIterationCount]: 'infinite',
|
5762
|
+
[vars$q.verticalPadding]: '0.25em',
|
5707
5763
|
|
5708
5764
|
size: {
|
5709
|
-
xs: { [vars$
|
5710
|
-
sm: { [vars$
|
5711
|
-
md: { [vars$
|
5712
|
-
lg: { [vars$
|
5765
|
+
xs: { [vars$q.barHeight]: '2px' },
|
5766
|
+
sm: { [vars$q.barHeight]: '4px' },
|
5767
|
+
md: { [vars$q.barHeight]: '6px' },
|
5768
|
+
lg: { [vars$q.barHeight]: '8px' },
|
5713
5769
|
},
|
5714
5770
|
|
5715
5771
|
mode: {
|
5716
5772
|
primary: {
|
5717
|
-
[vars$
|
5773
|
+
[vars$q.barColor]: globalRefs$i.colors.primary.main,
|
5718
5774
|
},
|
5719
5775
|
secondary: {
|
5720
|
-
[vars$
|
5776
|
+
[vars$q.barColor]: globalRefs$i.colors.secondary.main,
|
5721
5777
|
},
|
5722
5778
|
},
|
5723
5779
|
|
5724
5780
|
_hidden: {
|
5725
|
-
[vars$
|
5781
|
+
[vars$q.hostDisplay]: 'none',
|
5726
5782
|
},
|
5727
5783
|
};
|
5728
5784
|
|
5729
5785
|
var loaderLinear$1 = /*#__PURE__*/Object.freeze({
|
5730
5786
|
__proto__: null,
|
5731
5787
|
default: loaderLinear,
|
5732
|
-
vars: vars$
|
5788
|
+
vars: vars$q
|
5733
5789
|
});
|
5734
5790
|
|
5735
|
-
const globalRefs$
|
5791
|
+
const globalRefs$h = getThemeRefs(globals);
|
5736
5792
|
const compVars$2 = LoaderRadialClass.cssVarList;
|
5737
5793
|
|
5738
5794
|
const [helperTheme, helperRefs, helperVars] = createHelperVars(
|
5739
5795
|
{
|
5740
|
-
spinnerColor: globalRefs$
|
5796
|
+
spinnerColor: globalRefs$h.colors.surface.contrast,
|
5741
5797
|
mode: {
|
5742
5798
|
primary: {
|
5743
|
-
spinnerColor: globalRefs$
|
5799
|
+
spinnerColor: globalRefs$h.colors.primary.main,
|
5744
5800
|
},
|
5745
5801
|
secondary: {
|
5746
|
-
spinnerColor: globalRefs$
|
5802
|
+
spinnerColor: globalRefs$h.colors.secondary.main,
|
5747
5803
|
},
|
5748
5804
|
},
|
5749
5805
|
},
|
5750
|
-
componentName$
|
5806
|
+
componentName$y
|
5751
5807
|
);
|
5752
5808
|
|
5753
5809
|
const loaderRadial = {
|
@@ -5776,7 +5832,7 @@ const loaderRadial = {
|
|
5776
5832
|
[compVars$2.hostDisplay]: 'none',
|
5777
5833
|
},
|
5778
5834
|
};
|
5779
|
-
const vars$
|
5835
|
+
const vars$p = {
|
5780
5836
|
...compVars$2,
|
5781
5837
|
...helperVars,
|
5782
5838
|
};
|
@@ -5784,10 +5840,10 @@ const vars$n = {
|
|
5784
5840
|
var loaderRadial$1 = /*#__PURE__*/Object.freeze({
|
5785
5841
|
__proto__: null,
|
5786
5842
|
default: loaderRadial,
|
5787
|
-
vars: vars$
|
5843
|
+
vars: vars$p
|
5788
5844
|
});
|
5789
5845
|
|
5790
|
-
const componentName$
|
5846
|
+
const componentName$v = getComponentName('combo-box');
|
5791
5847
|
|
5792
5848
|
const ComboBoxMixin = (superclass) =>
|
5793
5849
|
class ComboBoxMixinClass extends superclass {
|
@@ -6170,71 +6226,71 @@ const ComboBoxClass = compose(
|
|
6170
6226
|
// and reset items to an empty array, and opening the list box with no items
|
6171
6227
|
// to display.
|
6172
6228
|
excludeAttrsSync: ['tabindex', 'size', 'data'],
|
6173
|
-
componentName: componentName$
|
6229
|
+
componentName: componentName$v,
|
6174
6230
|
includeForwardProps: ['items', 'renderer', 'selectedItem'],
|
6175
6231
|
})
|
6176
6232
|
);
|
6177
6233
|
|
6178
|
-
const globalRefs$
|
6179
|
-
const vars$
|
6234
|
+
const globalRefs$g = getThemeRefs(globals);
|
6235
|
+
const vars$o = ComboBoxClass.cssVarList;
|
6180
6236
|
|
6181
6237
|
const comboBox = {
|
6182
|
-
[vars$
|
6183
|
-
[vars$
|
6184
|
-
[vars$
|
6185
|
-
[vars$
|
6186
|
-
[vars$
|
6187
|
-
[vars$
|
6188
|
-
[vars$
|
6189
|
-
[vars$
|
6190
|
-
[vars$
|
6191
|
-
[vars$
|
6192
|
-
[vars$
|
6193
|
-
[vars$
|
6194
|
-
[vars$
|
6195
|
-
[vars$
|
6196
|
-
[vars$
|
6197
|
-
[vars$
|
6198
|
-
[vars$
|
6199
|
-
[vars$
|
6200
|
-
[vars$
|
6201
|
-
[vars$
|
6202
|
-
[vars$
|
6203
|
-
[vars$
|
6204
|
-
[vars$
|
6205
|
-
[vars$
|
6206
|
-
[vars$
|
6207
|
-
[vars$
|
6238
|
+
[vars$o.hostWidth]: refs.width,
|
6239
|
+
[vars$o.hostDirection]: refs.direction,
|
6240
|
+
[vars$o.fontSize]: refs.fontSize,
|
6241
|
+
[vars$o.fontFamily]: refs.fontFamily,
|
6242
|
+
[vars$o.labelTextColor]: refs.labelTextColor,
|
6243
|
+
[vars$o.errorMessageTextColor]: refs.errorMessageTextColor,
|
6244
|
+
[vars$o.inputBorderColor]: refs.borderColor,
|
6245
|
+
[vars$o.inputBorderWidth]: refs.borderWidth,
|
6246
|
+
[vars$o.inputBorderStyle]: refs.borderStyle,
|
6247
|
+
[vars$o.inputBorderRadius]: refs.borderRadius,
|
6248
|
+
[vars$o.inputOutlineColor]: refs.outlineColor,
|
6249
|
+
[vars$o.inputOutlineOffset]: refs.outlineOffset,
|
6250
|
+
[vars$o.inputOutlineWidth]: refs.outlineWidth,
|
6251
|
+
[vars$o.inputOutlineStyle]: refs.outlineStyle,
|
6252
|
+
[vars$o.labelRequiredIndicator]: refs.requiredIndicator,
|
6253
|
+
[vars$o.inputValueTextColor]: refs.valueTextColor,
|
6254
|
+
[vars$o.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
6255
|
+
[vars$o.inputBackgroundColor]: refs.backgroundColor,
|
6256
|
+
[vars$o.inputHorizontalPadding]: refs.horizontalPadding,
|
6257
|
+
[vars$o.inputHeight]: refs.inputHeight,
|
6258
|
+
[vars$o.inputDropdownButtonColor]: globalRefs$g.colors.surface.dark,
|
6259
|
+
[vars$o.inputDropdownButtonCursor]: 'pointer',
|
6260
|
+
[vars$o.inputDropdownButtonSize]: refs.toggleButtonSize,
|
6261
|
+
[vars$o.inputDropdownButtonOffset]: globalRefs$g.spacing.xs,
|
6262
|
+
[vars$o.overlayItemPaddingInlineStart]: globalRefs$g.spacing.xs,
|
6263
|
+
[vars$o.overlayItemPaddingInlineEnd]: globalRefs$g.spacing.lg,
|
6208
6264
|
|
6209
6265
|
_readonly: {
|
6210
|
-
[vars$
|
6266
|
+
[vars$o.inputDropdownButtonCursor]: 'default',
|
6211
6267
|
},
|
6212
6268
|
|
6213
6269
|
// Overlay theme exposed via the component:
|
6214
|
-
[vars$
|
6215
|
-
[vars$
|
6216
|
-
[vars$
|
6217
|
-
[vars$
|
6218
|
-
[vars$
|
6219
|
-
[vars$
|
6270
|
+
[vars$o.overlayFontSize]: refs.fontSize,
|
6271
|
+
[vars$o.overlayFontFamily]: refs.fontFamily,
|
6272
|
+
[vars$o.overlayCursor]: 'pointer',
|
6273
|
+
[vars$o.overlayItemBoxShadow]: 'none',
|
6274
|
+
[vars$o.overlayBackground]: refs.backgroundColor,
|
6275
|
+
[vars$o.overlayTextColor]: refs.valueTextColor,
|
6220
6276
|
|
6221
6277
|
// Overlay direct theme:
|
6222
|
-
[vars$
|
6223
|
-
[vars$
|
6278
|
+
[vars$o.overlay.minHeight]: '400px',
|
6279
|
+
[vars$o.overlay.margin]: '0',
|
6224
6280
|
};
|
6225
6281
|
|
6226
6282
|
var comboBox$1 = /*#__PURE__*/Object.freeze({
|
6227
6283
|
__proto__: null,
|
6228
6284
|
comboBox: comboBox,
|
6229
6285
|
default: comboBox,
|
6230
|
-
vars: vars$
|
6286
|
+
vars: vars$o
|
6231
6287
|
});
|
6232
6288
|
|
6233
6289
|
const observedAttributes$2 = ['src', 'alt'];
|
6234
6290
|
|
6235
|
-
const componentName$
|
6291
|
+
const componentName$u = getComponentName('image');
|
6236
6292
|
|
6237
|
-
const BaseClass$1 = createBaseClass({ componentName: componentName$
|
6293
|
+
const BaseClass$1 = createBaseClass({ componentName: componentName$u, baseSelector: ':host > img' });
|
6238
6294
|
class RawImage extends BaseClass$1 {
|
6239
6295
|
static get observedAttributes() {
|
6240
6296
|
return observedAttributes$2.concat(BaseClass$1.observedAttributes || []);
|
@@ -6274,14 +6330,14 @@ const ImageClass = compose(
|
|
6274
6330
|
draggableMixin
|
6275
6331
|
)(RawImage);
|
6276
6332
|
|
6277
|
-
const vars$
|
6333
|
+
const vars$n = ImageClass.cssVarList;
|
6278
6334
|
|
6279
6335
|
const image = {};
|
6280
6336
|
|
6281
6337
|
var image$1 = /*#__PURE__*/Object.freeze({
|
6282
6338
|
__proto__: null,
|
6283
6339
|
default: image,
|
6284
|
-
vars: vars$
|
6340
|
+
vars: vars$n
|
6285
6341
|
});
|
6286
6342
|
|
6287
6343
|
var CountryCodes = [
|
@@ -7500,16 +7556,16 @@ var CountryCodes = [
|
|
7500
7556
|
].sort((a, b) => (a.name < b.name ? -1 : 1)),
|
7501
7557
|
];
|
7502
7558
|
|
7503
|
-
const componentName$
|
7559
|
+
const componentName$t = getComponentName('phone-field-internal');
|
7504
7560
|
|
7505
|
-
createBaseInputClass({ componentName: componentName$
|
7561
|
+
createBaseInputClass({ componentName: componentName$t, baseSelector: 'div' });
|
7506
7562
|
|
7507
7563
|
const textVars$1 = TextFieldClass.cssVarList;
|
7508
7564
|
const comboVars = ComboBoxClass.cssVarList;
|
7509
7565
|
|
7510
|
-
const componentName$
|
7566
|
+
const componentName$s = getComponentName('phone-field');
|
7511
7567
|
|
7512
|
-
const customMixin$
|
7568
|
+
const customMixin$6 = (superclass) =>
|
7513
7569
|
class PhoneFieldMixinClass extends superclass {
|
7514
7570
|
static get CountryCodes() {
|
7515
7571
|
return CountryCodes;
|
@@ -7521,15 +7577,15 @@ const customMixin$5 = (superclass) =>
|
|
7521
7577
|
const template = document.createElement('template');
|
7522
7578
|
|
7523
7579
|
template.innerHTML = `
|
7524
|
-
<${componentName$
|
7580
|
+
<${componentName$t}
|
7525
7581
|
tabindex="-1"
|
7526
7582
|
slot="input"
|
7527
|
-
></${componentName$
|
7583
|
+
></${componentName$t}>
|
7528
7584
|
`;
|
7529
7585
|
|
7530
7586
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
7531
7587
|
|
7532
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
7588
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$t);
|
7533
7589
|
|
7534
7590
|
forwardAttrs(this.shadowRoot.host, this.inputElement, {
|
7535
7591
|
includeAttrs: [
|
@@ -7649,7 +7705,7 @@ const PhoneFieldClass = compose(
|
|
7649
7705
|
}),
|
7650
7706
|
draggableMixin,
|
7651
7707
|
composedProxyInputMixin({ proxyProps: ['value', 'selectionStart'] }),
|
7652
|
-
customMixin$
|
7708
|
+
customMixin$6
|
7653
7709
|
)(
|
7654
7710
|
createProxy({
|
7655
7711
|
slots: [],
|
@@ -7725,33 +7781,33 @@ const PhoneFieldClass = compose(
|
|
7725
7781
|
${resetInputLabelPosition('vaadin-text-field')}
|
7726
7782
|
`,
|
7727
7783
|
excludeAttrsSync: ['tabindex'],
|
7728
|
-
componentName: componentName$
|
7784
|
+
componentName: componentName$s,
|
7729
7785
|
})
|
7730
7786
|
);
|
7731
7787
|
|
7732
|
-
const vars$
|
7788
|
+
const vars$m = PhoneFieldClass.cssVarList;
|
7733
7789
|
|
7734
7790
|
const phoneField = {
|
7735
|
-
[vars$
|
7736
|
-
[vars$
|
7737
|
-
[vars$
|
7738
|
-
[vars$
|
7739
|
-
[vars$
|
7740
|
-
[vars$
|
7741
|
-
[vars$
|
7742
|
-
[vars$
|
7743
|
-
[vars$
|
7744
|
-
[vars$
|
7745
|
-
[vars$
|
7746
|
-
[vars$
|
7747
|
-
[vars$
|
7748
|
-
[vars$
|
7749
|
-
[vars$
|
7750
|
-
[vars$
|
7751
|
-
[vars$
|
7752
|
-
[vars$
|
7753
|
-
[vars$
|
7754
|
-
[vars$
|
7791
|
+
[vars$m.hostWidth]: refs.width,
|
7792
|
+
[vars$m.hostDirection]: refs.direction,
|
7793
|
+
[vars$m.fontSize]: refs.fontSize,
|
7794
|
+
[vars$m.fontFamily]: refs.fontFamily,
|
7795
|
+
[vars$m.labelTextColor]: refs.labelTextColor,
|
7796
|
+
[vars$m.labelRequiredIndicator]: refs.requiredIndicator,
|
7797
|
+
[vars$m.errorMessageTextColor]: refs.errorMessageTextColor,
|
7798
|
+
[vars$m.inputValueTextColor]: refs.valueTextColor,
|
7799
|
+
[vars$m.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
7800
|
+
[vars$m.inputBorderStyle]: refs.borderStyle,
|
7801
|
+
[vars$m.inputBorderWidth]: refs.borderWidth,
|
7802
|
+
[vars$m.inputBorderColor]: refs.borderColor,
|
7803
|
+
[vars$m.inputBorderRadius]: refs.borderRadius,
|
7804
|
+
[vars$m.inputOutlineStyle]: refs.outlineStyle,
|
7805
|
+
[vars$m.inputOutlineWidth]: refs.outlineWidth,
|
7806
|
+
[vars$m.inputOutlineColor]: refs.outlineColor,
|
7807
|
+
[vars$m.inputOutlineOffset]: refs.outlineOffset,
|
7808
|
+
[vars$m.phoneInputWidth]: refs.minWidth,
|
7809
|
+
[vars$m.countryCodeInputWidth]: '5em',
|
7810
|
+
[vars$m.countryCodeDropdownWidth]: '20em',
|
7755
7811
|
|
7756
7812
|
// '@overlay': {
|
7757
7813
|
// overlayItemBackgroundColor: 'red'
|
@@ -7761,18 +7817,18 @@ const phoneField = {
|
|
7761
7817
|
var phoneField$1 = /*#__PURE__*/Object.freeze({
|
7762
7818
|
__proto__: null,
|
7763
7819
|
default: phoneField,
|
7764
|
-
vars: vars$
|
7820
|
+
vars: vars$m
|
7765
7821
|
});
|
7766
7822
|
|
7767
|
-
const componentName$
|
7823
|
+
const componentName$r = getComponentName('phone-field-internal-input-box');
|
7768
7824
|
|
7769
|
-
createBaseInputClass({ componentName: componentName$
|
7825
|
+
createBaseInputClass({ componentName: componentName$r, baseSelector: 'div' });
|
7770
7826
|
|
7771
7827
|
const textVars = TextFieldClass.cssVarList;
|
7772
7828
|
|
7773
|
-
const componentName$
|
7829
|
+
const componentName$q = getComponentName('phone-input-box-field');
|
7774
7830
|
|
7775
|
-
const customMixin$
|
7831
|
+
const customMixin$5 = (superclass) =>
|
7776
7832
|
class PhoneInputBoxFieldMixinClass extends superclass {
|
7777
7833
|
static get CountryCodes() {
|
7778
7834
|
return CountryCodes;
|
@@ -7784,15 +7840,15 @@ const customMixin$4 = (superclass) =>
|
|
7784
7840
|
const template = document.createElement('template');
|
7785
7841
|
|
7786
7842
|
template.innerHTML = `
|
7787
|
-
<${componentName$
|
7843
|
+
<${componentName$r}
|
7788
7844
|
tabindex="-1"
|
7789
7845
|
slot="input"
|
7790
|
-
></${componentName$
|
7846
|
+
></${componentName$r}>
|
7791
7847
|
`;
|
7792
7848
|
|
7793
7849
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
7794
7850
|
|
7795
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
7851
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$r);
|
7796
7852
|
|
7797
7853
|
forwardAttrs(this.shadowRoot.host, this.inputElement, {
|
7798
7854
|
includeAttrs: [
|
@@ -7859,7 +7915,7 @@ const PhoneFieldInputBoxClass = compose(
|
|
7859
7915
|
}),
|
7860
7916
|
draggableMixin,
|
7861
7917
|
composedProxyInputMixin({ proxyProps: ['value', 'selectionStart'] }),
|
7862
|
-
customMixin$
|
7918
|
+
customMixin$5
|
7863
7919
|
)(
|
7864
7920
|
createProxy({
|
7865
7921
|
slots: [],
|
@@ -7925,56 +7981,56 @@ const PhoneFieldInputBoxClass = compose(
|
|
7925
7981
|
${resetInputLabelPosition('vaadin-text-field')}
|
7926
7982
|
`,
|
7927
7983
|
excludeAttrsSync: ['tabindex'],
|
7928
|
-
componentName: componentName$
|
7984
|
+
componentName: componentName$q,
|
7929
7985
|
})
|
7930
7986
|
);
|
7931
7987
|
|
7932
|
-
const vars$
|
7988
|
+
const vars$l = PhoneFieldInputBoxClass.cssVarList;
|
7933
7989
|
|
7934
7990
|
const phoneInputBoxField = {
|
7935
|
-
[vars$
|
7936
|
-
[vars$
|
7937
|
-
[vars$
|
7938
|
-
[vars$
|
7939
|
-
[vars$
|
7940
|
-
[vars$
|
7941
|
-
[vars$
|
7942
|
-
[vars$
|
7943
|
-
[vars$
|
7944
|
-
[vars$
|
7945
|
-
[vars$
|
7946
|
-
[vars$
|
7947
|
-
[vars$
|
7948
|
-
[vars$
|
7949
|
-
[vars$
|
7950
|
-
[vars$
|
7951
|
-
[vars$
|
7952
|
-
[vars$
|
7991
|
+
[vars$l.hostWidth]: '16em',
|
7992
|
+
[vars$l.hostMinWidth]: refs.minWidth,
|
7993
|
+
[vars$l.hostDirection]: refs.direction,
|
7994
|
+
[vars$l.fontSize]: refs.fontSize,
|
7995
|
+
[vars$l.fontFamily]: refs.fontFamily,
|
7996
|
+
[vars$l.labelTextColor]: refs.labelTextColor,
|
7997
|
+
[vars$l.labelRequiredIndicator]: refs.requiredIndicator,
|
7998
|
+
[vars$l.errorMessageTextColor]: refs.errorMessageTextColor,
|
7999
|
+
[vars$l.inputValueTextColor]: refs.valueTextColor,
|
8000
|
+
[vars$l.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
8001
|
+
[vars$l.inputBorderStyle]: refs.borderStyle,
|
8002
|
+
[vars$l.inputBorderWidth]: refs.borderWidth,
|
8003
|
+
[vars$l.inputBorderColor]: refs.borderColor,
|
8004
|
+
[vars$l.inputBorderRadius]: refs.borderRadius,
|
8005
|
+
[vars$l.inputOutlineStyle]: refs.outlineStyle,
|
8006
|
+
[vars$l.inputOutlineWidth]: refs.outlineWidth,
|
8007
|
+
[vars$l.inputOutlineColor]: refs.outlineColor,
|
8008
|
+
[vars$l.inputOutlineOffset]: refs.outlineOffset,
|
7953
8009
|
_fullWidth: {
|
7954
|
-
[vars$
|
8010
|
+
[vars$l.hostWidth]: refs.width,
|
7955
8011
|
},
|
7956
8012
|
};
|
7957
8013
|
|
7958
8014
|
var phoneInputBoxField$1 = /*#__PURE__*/Object.freeze({
|
7959
8015
|
__proto__: null,
|
7960
8016
|
default: phoneInputBoxField,
|
7961
|
-
vars: vars$
|
8017
|
+
vars: vars$l
|
7962
8018
|
});
|
7963
8019
|
|
7964
|
-
const componentName$
|
8020
|
+
const componentName$p = getComponentName('new-password-internal');
|
7965
8021
|
|
7966
8022
|
const interpolateString = (template, values) =>
|
7967
8023
|
template.replace(/{{(\w+)+}}/g, (match, key) => values?.[key] || match);
|
7968
8024
|
|
7969
8025
|
// eslint-disable-next-line max-classes-per-file
|
7970
8026
|
|
7971
|
-
const componentName$
|
8027
|
+
const componentName$o = getComponentName('policy-validation');
|
7972
8028
|
|
7973
8029
|
const overrideAttrs = ['data-password-policy-value-minlength'];
|
7974
8030
|
const dataAttrs = ['data', 'active-policies', 'overrides', ...overrideAttrs];
|
7975
8031
|
const policyAttrs = ['label', 'value', ...dataAttrs];
|
7976
8032
|
|
7977
|
-
class RawPolicyValidation extends createBaseClass({ componentName: componentName$
|
8033
|
+
class RawPolicyValidation extends createBaseClass({ componentName: componentName$o, baseSelector: ':host > div' }) {
|
7978
8034
|
#availablePolicies;
|
7979
8035
|
|
7980
8036
|
#activePolicies = [];
|
@@ -8182,11 +8238,11 @@ const PolicyValidationClass = compose(
|
|
8182
8238
|
componentNameValidationMixin
|
8183
8239
|
)(RawPolicyValidation);
|
8184
8240
|
|
8185
|
-
const componentName$
|
8241
|
+
const componentName$n = getComponentName('new-password');
|
8186
8242
|
|
8187
8243
|
const policyPreviewVars = PolicyValidationClass.cssVarList;
|
8188
8244
|
|
8189
|
-
const customMixin$
|
8245
|
+
const customMixin$4 = (superclass) =>
|
8190
8246
|
class NewPasswordMixinClass extends superclass {
|
8191
8247
|
init() {
|
8192
8248
|
super.init?.();
|
@@ -8194,19 +8250,19 @@ const customMixin$3 = (superclass) =>
|
|
8194
8250
|
const template = document.createElement('template');
|
8195
8251
|
|
8196
8252
|
template.innerHTML = `
|
8197
|
-
<${componentName$
|
8253
|
+
<${componentName$p}
|
8198
8254
|
name="new-password"
|
8199
8255
|
tabindex="-1"
|
8200
8256
|
slot="input"
|
8201
8257
|
>
|
8202
|
-
</${componentName$
|
8258
|
+
</${componentName$p}>
|
8203
8259
|
`;
|
8204
8260
|
|
8205
8261
|
this.setAttribute('external-input', 'true');
|
8206
8262
|
|
8207
8263
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
8208
8264
|
|
8209
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
8265
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$p);
|
8210
8266
|
|
8211
8267
|
// get descope input components
|
8212
8268
|
this.passwordInput = this.inputElement.querySelector('[data-id="password"]');
|
@@ -8302,7 +8358,7 @@ const NewPasswordClass = compose(
|
|
8302
8358
|
}),
|
8303
8359
|
draggableMixin,
|
8304
8360
|
composedProxyInputMixin({ proxyProps: ['value', 'selectionStart'] }),
|
8305
|
-
customMixin$
|
8361
|
+
customMixin$4
|
8306
8362
|
)(
|
8307
8363
|
createProxy({
|
8308
8364
|
slots: [],
|
@@ -8361,36 +8417,36 @@ const NewPasswordClass = compose(
|
|
8361
8417
|
}
|
8362
8418
|
`,
|
8363
8419
|
excludeAttrsSync: ['tabindex'],
|
8364
|
-
componentName: componentName$
|
8420
|
+
componentName: componentName$n,
|
8365
8421
|
})
|
8366
8422
|
);
|
8367
8423
|
|
8368
|
-
const globalRefs$
|
8369
|
-
const vars$
|
8424
|
+
const globalRefs$f = getThemeRefs(globals);
|
8425
|
+
const vars$k = NewPasswordClass.cssVarList;
|
8370
8426
|
|
8371
8427
|
const newPassword = {
|
8372
|
-
[vars$
|
8373
|
-
[vars$
|
8374
|
-
[vars$
|
8375
|
-
[vars$
|
8376
|
-
[vars$
|
8377
|
-
[vars$
|
8378
|
-
[vars$
|
8379
|
-
[vars$
|
8380
|
-
[vars$
|
8428
|
+
[vars$k.hostWidth]: refs.width,
|
8429
|
+
[vars$k.hostMinWidth]: refs.minWidth,
|
8430
|
+
[vars$k.hostDirection]: refs.direction,
|
8431
|
+
[vars$k.fontSize]: refs.fontSize,
|
8432
|
+
[vars$k.fontFamily]: refs.fontFamily,
|
8433
|
+
[vars$k.spaceBetweenInputs]: '1em',
|
8434
|
+
[vars$k.errorMessageTextColor]: refs.errorMessageTextColor,
|
8435
|
+
[vars$k.policyPreviewBackgroundColor]: 'none',
|
8436
|
+
[vars$k.policyPreviewPadding]: globalRefs$f.spacing.lg,
|
8381
8437
|
|
8382
8438
|
_required: {
|
8383
8439
|
// NewPassword doesn't pass `required` attribute to its Password components.
|
8384
8440
|
// That's why we fake the required indicator on each input.
|
8385
8441
|
// We do that by injecting `::after` element, and populating it with requiredIndicator content.
|
8386
|
-
[vars$
|
8442
|
+
[vars$k.inputsRequiredIndicator]: refs.requiredIndicator, // used to populate required content for NewPassword input fields outside the theme
|
8387
8443
|
},
|
8388
8444
|
};
|
8389
8445
|
|
8390
8446
|
var newPassword$1 = /*#__PURE__*/Object.freeze({
|
8391
8447
|
__proto__: null,
|
8392
8448
|
default: newPassword,
|
8393
|
-
vars: vars$
|
8449
|
+
vars: vars$k
|
8394
8450
|
});
|
8395
8451
|
|
8396
8452
|
const getFileBase64 = (fileObj) => {
|
@@ -8405,7 +8461,7 @@ const getFilename = (fileObj) => {
|
|
8405
8461
|
return fileObj.name.replace(/^.*\\/, '');
|
8406
8462
|
};
|
8407
8463
|
|
8408
|
-
const componentName$
|
8464
|
+
const componentName$m = getComponentName('upload-file');
|
8409
8465
|
|
8410
8466
|
const observedAttributes$1 = [
|
8411
8467
|
'title',
|
@@ -8420,7 +8476,7 @@ const observedAttributes$1 = [
|
|
8420
8476
|
'icon',
|
8421
8477
|
];
|
8422
8478
|
|
8423
|
-
const BaseInputClass = createBaseInputClass({ componentName: componentName$
|
8479
|
+
const BaseInputClass = createBaseInputClass({ componentName: componentName$m, baseSelector: ':host > div' });
|
8424
8480
|
|
8425
8481
|
class RawUploadFile extends BaseInputClass {
|
8426
8482
|
static get observedAttributes() {
|
@@ -8635,77 +8691,77 @@ const UploadFileClass = compose(
|
|
8635
8691
|
componentNameValidationMixin
|
8636
8692
|
)(RawUploadFile);
|
8637
8693
|
|
8638
|
-
const vars$
|
8694
|
+
const vars$j = UploadFileClass.cssVarList;
|
8639
8695
|
|
8640
8696
|
const uploadFile = {
|
8641
|
-
[vars$
|
8642
|
-
[vars$
|
8643
|
-
[vars$
|
8697
|
+
[vars$j.hostDirection]: refs.direction,
|
8698
|
+
[vars$j.labelTextColor]: refs.labelTextColor,
|
8699
|
+
[vars$j.fontFamily]: refs.fontFamily,
|
8644
8700
|
|
8645
|
-
[vars$
|
8701
|
+
[vars$j.iconSize]: '2em',
|
8646
8702
|
|
8647
|
-
[vars$
|
8648
|
-
[vars$
|
8703
|
+
[vars$j.hostPadding]: '0.75em',
|
8704
|
+
[vars$j.gap]: '0.5em',
|
8649
8705
|
|
8650
|
-
[vars$
|
8651
|
-
[vars$
|
8652
|
-
[vars$
|
8706
|
+
[vars$j.fontSize]: '16px',
|
8707
|
+
[vars$j.titleFontWeight]: '500',
|
8708
|
+
[vars$j.lineHeight]: '1em',
|
8653
8709
|
|
8654
|
-
[vars$
|
8655
|
-
[vars$
|
8656
|
-
[vars$
|
8657
|
-
[vars$
|
8710
|
+
[vars$j.borderWidth]: refs.borderWidth,
|
8711
|
+
[vars$j.borderColor]: refs.borderColor,
|
8712
|
+
[vars$j.borderRadius]: refs.borderRadius,
|
8713
|
+
[vars$j.borderStyle]: 'dashed',
|
8658
8714
|
|
8659
8715
|
_required: {
|
8660
|
-
[vars$
|
8716
|
+
[vars$j.requiredIndicator]: refs.requiredIndicator,
|
8661
8717
|
},
|
8662
8718
|
|
8663
8719
|
size: {
|
8664
8720
|
xs: {
|
8665
|
-
[vars$
|
8666
|
-
[vars$
|
8667
|
-
[vars$
|
8668
|
-
[vars$
|
8669
|
-
[vars$
|
8721
|
+
[vars$j.hostHeight]: '196px',
|
8722
|
+
[vars$j.hostWidth]: '200px',
|
8723
|
+
[vars$j.titleFontSize]: '0.875em',
|
8724
|
+
[vars$j.descriptionFontSize]: '0.875em',
|
8725
|
+
[vars$j.lineHeight]: '1.25em',
|
8670
8726
|
},
|
8671
8727
|
sm: {
|
8672
|
-
[vars$
|
8673
|
-
[vars$
|
8674
|
-
[vars$
|
8675
|
-
[vars$
|
8676
|
-
[vars$
|
8728
|
+
[vars$j.hostHeight]: '216px',
|
8729
|
+
[vars$j.hostWidth]: '230px',
|
8730
|
+
[vars$j.titleFontSize]: '1em',
|
8731
|
+
[vars$j.descriptionFontSize]: '0.875em',
|
8732
|
+
[vars$j.lineHeight]: '1.25em',
|
8677
8733
|
},
|
8678
8734
|
md: {
|
8679
|
-
[vars$
|
8680
|
-
[vars$
|
8681
|
-
[vars$
|
8682
|
-
[vars$
|
8683
|
-
[vars$
|
8735
|
+
[vars$j.hostHeight]: '256px',
|
8736
|
+
[vars$j.hostWidth]: '312px',
|
8737
|
+
[vars$j.titleFontSize]: '1.125em',
|
8738
|
+
[vars$j.descriptionFontSize]: '1em',
|
8739
|
+
[vars$j.lineHeight]: '1.5em',
|
8684
8740
|
},
|
8685
8741
|
lg: {
|
8686
|
-
[vars$
|
8687
|
-
[vars$
|
8688
|
-
[vars$
|
8689
|
-
[vars$
|
8690
|
-
[vars$
|
8742
|
+
[vars$j.hostHeight]: '280px',
|
8743
|
+
[vars$j.hostWidth]: '336px',
|
8744
|
+
[vars$j.titleFontSize]: '1.125em',
|
8745
|
+
[vars$j.descriptionFontSize]: '1.125em',
|
8746
|
+
[vars$j.lineHeight]: '1.75em',
|
8691
8747
|
},
|
8692
8748
|
},
|
8693
8749
|
|
8694
8750
|
_fullWidth: {
|
8695
|
-
[vars$
|
8751
|
+
[vars$j.hostWidth]: refs.width,
|
8696
8752
|
},
|
8697
8753
|
};
|
8698
8754
|
|
8699
8755
|
var uploadFile$1 = /*#__PURE__*/Object.freeze({
|
8700
8756
|
__proto__: null,
|
8701
8757
|
default: uploadFile,
|
8702
|
-
vars: vars$
|
8758
|
+
vars: vars$j
|
8703
8759
|
});
|
8704
8760
|
|
8705
|
-
const componentName$
|
8761
|
+
const componentName$l = getComponentName('button-selection-group-item');
|
8706
8762
|
|
8707
8763
|
class RawSelectItem extends createBaseClass({
|
8708
|
-
componentName: componentName$
|
8764
|
+
componentName: componentName$l,
|
8709
8765
|
baseSelector: ':host > descope-button',
|
8710
8766
|
}) {
|
8711
8767
|
get size() {
|
@@ -8812,39 +8868,39 @@ const ButtonSelectionGroupItemClass = compose(
|
|
8812
8868
|
componentNameValidationMixin
|
8813
8869
|
)(RawSelectItem);
|
8814
8870
|
|
8815
|
-
const globalRefs$
|
8871
|
+
const globalRefs$e = getThemeRefs(globals);
|
8816
8872
|
|
8817
|
-
const vars$
|
8873
|
+
const vars$i = ButtonSelectionGroupItemClass.cssVarList;
|
8818
8874
|
|
8819
8875
|
const buttonSelectionGroupItem = {
|
8820
|
-
[vars$
|
8821
|
-
[vars$
|
8822
|
-
[vars$
|
8823
|
-
[vars$
|
8824
|
-
[vars$
|
8825
|
-
[vars$
|
8826
|
-
[vars$
|
8827
|
-
[vars$
|
8876
|
+
[vars$i.hostDirection]: 'inherit',
|
8877
|
+
[vars$i.backgroundColor]: globalRefs$e.colors.surface.main,
|
8878
|
+
[vars$i.labelTextColor]: globalRefs$e.colors.surface.contrast,
|
8879
|
+
[vars$i.borderColor]: globalRefs$e.colors.surface.light,
|
8880
|
+
[vars$i.borderStyle]: 'solid',
|
8881
|
+
[vars$i.borderRadius]: globalRefs$e.radius.sm,
|
8882
|
+
[vars$i.outlineColor]: 'transparent',
|
8883
|
+
[vars$i.borderWidth]: globalRefs$e.border.xs,
|
8828
8884
|
|
8829
8885
|
_hover: {
|
8830
|
-
[vars$
|
8886
|
+
[vars$i.backgroundColor]: globalRefs$e.colors.surface.highlight,
|
8831
8887
|
},
|
8832
8888
|
|
8833
8889
|
_focused: {
|
8834
|
-
[vars$
|
8890
|
+
[vars$i.outlineColor]: globalRefs$e.colors.surface.light,
|
8835
8891
|
},
|
8836
8892
|
|
8837
8893
|
_selected: {
|
8838
|
-
[vars$
|
8839
|
-
[vars$
|
8840
|
-
[vars$
|
8894
|
+
[vars$i.borderColor]: globalRefs$e.colors.surface.contrast,
|
8895
|
+
[vars$i.backgroundColor]: globalRefs$e.colors.surface.contrast,
|
8896
|
+
[vars$i.labelTextColor]: globalRefs$e.colors.surface.main,
|
8841
8897
|
},
|
8842
8898
|
};
|
8843
8899
|
|
8844
8900
|
var buttonSelectionGroupItem$1 = /*#__PURE__*/Object.freeze({
|
8845
8901
|
__proto__: null,
|
8846
8902
|
default: buttonSelectionGroupItem,
|
8847
|
-
vars: vars$
|
8903
|
+
vars: vars$i
|
8848
8904
|
});
|
8849
8905
|
|
8850
8906
|
const createBaseButtonSelectionGroupInternalClass = (componentName) => {
|
@@ -8943,10 +8999,10 @@ const createBaseButtonSelectionGroupInternalClass = (componentName) => {
|
|
8943
8999
|
return BaseButtonSelectionGroupInternalClass;
|
8944
9000
|
};
|
8945
9001
|
|
8946
|
-
const componentName$
|
9002
|
+
const componentName$k = getComponentName('button-selection-group-internal');
|
8947
9003
|
|
8948
9004
|
class ButtonSelectionGroupInternalClass extends createBaseButtonSelectionGroupInternalClass(
|
8949
|
-
componentName$
|
9005
|
+
componentName$k
|
8950
9006
|
) {
|
8951
9007
|
getSelectedNode() {
|
8952
9008
|
return this.items.find((item) => item.hasAttribute('selected'));
|
@@ -9178,7 +9234,7 @@ const buttonSelectionGroupStyles = `
|
|
9178
9234
|
${resetInputCursor('vaadin-text-field')}
|
9179
9235
|
`;
|
9180
9236
|
|
9181
|
-
const componentName$
|
9237
|
+
const componentName$j = getComponentName('button-selection-group');
|
9182
9238
|
|
9183
9239
|
const buttonSelectionGroupMixin = (superclass) =>
|
9184
9240
|
class ButtonMultiSelectionGroupMixinClass extends superclass {
|
@@ -9187,19 +9243,19 @@ const buttonSelectionGroupMixin = (superclass) =>
|
|
9187
9243
|
const template = document.createElement('template');
|
9188
9244
|
|
9189
9245
|
template.innerHTML = `
|
9190
|
-
<${componentName$
|
9246
|
+
<${componentName$k}
|
9191
9247
|
name="button-selection-group"
|
9192
9248
|
slot="input"
|
9193
9249
|
tabindex="-1"
|
9194
9250
|
part="internal-component"
|
9195
9251
|
>
|
9196
9252
|
<slot></slot>
|
9197
|
-
</${componentName$
|
9253
|
+
</${componentName$k}>
|
9198
9254
|
`;
|
9199
9255
|
|
9200
9256
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
9201
9257
|
|
9202
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
9258
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$k);
|
9203
9259
|
|
9204
9260
|
forwardAttrs(this, this.inputElement, {
|
9205
9261
|
includeAttrs: ['size', 'default-value', 'allow-deselect'],
|
@@ -9224,11 +9280,11 @@ const ButtonSelectionGroupClass = compose(
|
|
9224
9280
|
wrappedEleName: 'vaadin-text-field',
|
9225
9281
|
style: () => buttonSelectionGroupStyles,
|
9226
9282
|
excludeAttrsSync: ['tabindex'],
|
9227
|
-
componentName: componentName$
|
9283
|
+
componentName: componentName$j,
|
9228
9284
|
})
|
9229
9285
|
);
|
9230
9286
|
|
9231
|
-
const globalRefs$
|
9287
|
+
const globalRefs$d = getThemeRefs(globals);
|
9232
9288
|
|
9233
9289
|
const createBaseButtonSelectionGroupMappings = (vars) => ({
|
9234
9290
|
[vars.hostDirection]: refs.direction,
|
@@ -9236,26 +9292,26 @@ const createBaseButtonSelectionGroupMappings = (vars) => ({
|
|
9236
9292
|
[vars.labelTextColor]: refs.labelTextColor,
|
9237
9293
|
[vars.labelRequiredIndicator]: refs.requiredIndicator,
|
9238
9294
|
[vars.errorMessageTextColor]: refs.errorMessageTextColor,
|
9239
|
-
[vars.itemsSpacing]: globalRefs$
|
9295
|
+
[vars.itemsSpacing]: globalRefs$d.spacing.sm,
|
9240
9296
|
[vars.hostWidth]: refs.width,
|
9241
9297
|
});
|
9242
9298
|
|
9243
|
-
const vars$
|
9299
|
+
const vars$h = ButtonSelectionGroupClass.cssVarList;
|
9244
9300
|
|
9245
9301
|
const buttonSelectionGroup = {
|
9246
|
-
...createBaseButtonSelectionGroupMappings(vars$
|
9302
|
+
...createBaseButtonSelectionGroupMappings(vars$h),
|
9247
9303
|
};
|
9248
9304
|
|
9249
9305
|
var buttonSelectionGroup$1 = /*#__PURE__*/Object.freeze({
|
9250
9306
|
__proto__: null,
|
9251
9307
|
default: buttonSelectionGroup,
|
9252
|
-
vars: vars$
|
9308
|
+
vars: vars$h
|
9253
9309
|
});
|
9254
9310
|
|
9255
|
-
const componentName$
|
9311
|
+
const componentName$i = getComponentName('button-multi-selection-group-internal');
|
9256
9312
|
|
9257
9313
|
class ButtonMultiSelectionGroupInternalClass extends createBaseButtonSelectionGroupInternalClass(
|
9258
|
-
componentName$
|
9314
|
+
componentName$i
|
9259
9315
|
) {
|
9260
9316
|
#getSelectedNodes() {
|
9261
9317
|
return this.items.filter((item) => item.hasAttribute('selected'));
|
@@ -9358,7 +9414,7 @@ class ButtonMultiSelectionGroupInternalClass extends createBaseButtonSelectionGr
|
|
9358
9414
|
}
|
9359
9415
|
}
|
9360
9416
|
|
9361
|
-
const componentName$
|
9417
|
+
const componentName$h = getComponentName('button-multi-selection-group');
|
9362
9418
|
|
9363
9419
|
const buttonMultiSelectionGroupMixin = (superclass) =>
|
9364
9420
|
class ButtonMultiSelectionGroupMixinClass extends superclass {
|
@@ -9367,19 +9423,19 @@ const buttonMultiSelectionGroupMixin = (superclass) =>
|
|
9367
9423
|
const template = document.createElement('template');
|
9368
9424
|
|
9369
9425
|
template.innerHTML = `
|
9370
|
-
<${componentName$
|
9426
|
+
<${componentName$i}
|
9371
9427
|
name="button-selection-group"
|
9372
9428
|
slot="input"
|
9373
9429
|
tabindex="-1"
|
9374
9430
|
part="internal-component"
|
9375
9431
|
>
|
9376
9432
|
<slot></slot>
|
9377
|
-
</${componentName$
|
9433
|
+
</${componentName$i}>
|
9378
9434
|
`;
|
9379
9435
|
|
9380
9436
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
9381
9437
|
|
9382
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
9438
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$i);
|
9383
9439
|
|
9384
9440
|
forwardAttrs(this, this.inputElement, {
|
9385
9441
|
includeAttrs: ['size', 'default-values', 'min-items-selection', 'max-items-selection'],
|
@@ -9404,25 +9460,25 @@ const ButtonMultiSelectionGroupClass = compose(
|
|
9404
9460
|
wrappedEleName: 'vaadin-text-field',
|
9405
9461
|
style: () => buttonSelectionGroupStyles,
|
9406
9462
|
excludeAttrsSync: ['tabindex'],
|
9407
|
-
componentName: componentName$
|
9463
|
+
componentName: componentName$h,
|
9408
9464
|
})
|
9409
9465
|
);
|
9410
9466
|
|
9411
|
-
const vars$
|
9467
|
+
const vars$g = ButtonMultiSelectionGroupClass.cssVarList;
|
9412
9468
|
|
9413
9469
|
const buttonMultiSelectionGroup = {
|
9414
|
-
...createBaseButtonSelectionGroupMappings(vars$
|
9470
|
+
...createBaseButtonSelectionGroupMappings(vars$g),
|
9415
9471
|
};
|
9416
9472
|
|
9417
9473
|
var buttonMultiSelectionGroup$1 = /*#__PURE__*/Object.freeze({
|
9418
9474
|
__proto__: null,
|
9419
9475
|
default: buttonMultiSelectionGroup,
|
9420
|
-
vars: vars$
|
9476
|
+
vars: vars$g
|
9421
9477
|
});
|
9422
9478
|
|
9423
|
-
const componentName$
|
9479
|
+
const componentName$g = getComponentName('modal');
|
9424
9480
|
|
9425
|
-
const customMixin$
|
9481
|
+
const customMixin$3 = (superclass) =>
|
9426
9482
|
class ModalMixinClass extends superclass {
|
9427
9483
|
get opened() {
|
9428
9484
|
return this.getAttribute('opened') === 'true';
|
@@ -9512,35 +9568,35 @@ const ModalClass = compose(
|
|
9512
9568
|
}),
|
9513
9569
|
draggableMixin,
|
9514
9570
|
componentNameValidationMixin,
|
9515
|
-
customMixin$
|
9571
|
+
customMixin$3
|
9516
9572
|
)(
|
9517
9573
|
createProxy({
|
9518
9574
|
slots: [''],
|
9519
9575
|
wrappedEleName: 'vaadin-dialog',
|
9520
9576
|
style: () => ``,
|
9521
9577
|
excludeAttrsSync: ['tabindex', 'opened'],
|
9522
|
-
componentName: componentName$
|
9578
|
+
componentName: componentName$g,
|
9523
9579
|
})
|
9524
9580
|
);
|
9525
9581
|
|
9526
|
-
const globalRefs$
|
9582
|
+
const globalRefs$c = getThemeRefs(globals);
|
9527
9583
|
|
9528
9584
|
const compVars$1 = ModalClass.cssVarList;
|
9529
9585
|
|
9530
9586
|
const modal = {
|
9531
|
-
[compVars$1.overlayBackgroundColor]: globalRefs$
|
9532
|
-
[compVars$1.overlayShadow]: globalRefs$
|
9587
|
+
[compVars$1.overlayBackgroundColor]: globalRefs$c.colors.surface.main,
|
9588
|
+
[compVars$1.overlayShadow]: globalRefs$c.shadow.wide['2xl'],
|
9533
9589
|
[compVars$1.overlayWidth]: '540px',
|
9534
9590
|
};
|
9535
9591
|
|
9536
|
-
const vars$
|
9592
|
+
const vars$f = {
|
9537
9593
|
...compVars$1,
|
9538
9594
|
};
|
9539
9595
|
|
9540
9596
|
var modal$1 = /*#__PURE__*/Object.freeze({
|
9541
9597
|
__proto__: null,
|
9542
9598
|
default: modal,
|
9543
|
-
vars: vars$
|
9599
|
+
vars: vars$f
|
9544
9600
|
});
|
9545
9601
|
|
9546
9602
|
const isValidDataType = (data) => {
|
@@ -9553,7 +9609,7 @@ const isValidDataType = (data) => {
|
|
9553
9609
|
return isValid;
|
9554
9610
|
};
|
9555
9611
|
|
9556
|
-
const componentName$
|
9612
|
+
const componentName$f = getComponentName('grid');
|
9557
9613
|
|
9558
9614
|
const GridMixin = (superclass) =>
|
9559
9615
|
class GridMixinClass extends superclass {
|
@@ -9789,40 +9845,40 @@ const GridClass = compose(
|
|
9789
9845
|
}
|
9790
9846
|
`,
|
9791
9847
|
excludeAttrsSync: ['columns', 'tabindex'],
|
9792
|
-
componentName: componentName$
|
9848
|
+
componentName: componentName$f,
|
9793
9849
|
})
|
9794
9850
|
);
|
9795
9851
|
|
9796
|
-
const globalRefs$
|
9797
|
-
const vars$
|
9852
|
+
const globalRefs$b = getThemeRefs(globals);
|
9853
|
+
const vars$e = GridClass.cssVarList;
|
9798
9854
|
|
9799
9855
|
const grid = {
|
9800
|
-
[vars$
|
9801
|
-
[vars$
|
9802
|
-
[vars$
|
9803
|
-
[vars$
|
9804
|
-
[vars$
|
9856
|
+
[vars$e.hostWidth]: '100%',
|
9857
|
+
[vars$e.hostHeight]: '100%',
|
9858
|
+
[vars$e.hostMinHeight]: '400px',
|
9859
|
+
[vars$e.fontWeight]: '400',
|
9860
|
+
[vars$e.backgroundColor]: globalRefs$b.colors.surface.main,
|
9805
9861
|
|
9806
|
-
[vars$
|
9807
|
-
[vars$
|
9862
|
+
[vars$e.fontSize]: refs.fontSize,
|
9863
|
+
[vars$e.fontFamily]: refs.fontFamily,
|
9808
9864
|
|
9809
|
-
[vars$
|
9810
|
-
[vars$
|
9811
|
-
[vars$
|
9865
|
+
[vars$e.sortIndicatorsColor]: globalRefs$b.colors.surface.light,
|
9866
|
+
[vars$e.activeSortIndicator]: globalRefs$b.colors.surface.dark,
|
9867
|
+
[vars$e.resizeHandleColor]: globalRefs$b.colors.surface.light,
|
9812
9868
|
|
9813
|
-
[vars$
|
9814
|
-
[vars$
|
9815
|
-
[vars$
|
9816
|
-
[vars$
|
9869
|
+
[vars$e.borderWidth]: refs.borderWidth,
|
9870
|
+
[vars$e.borderStyle]: refs.borderStyle,
|
9871
|
+
[vars$e.borderRadius]: refs.borderRadius,
|
9872
|
+
[vars$e.borderColor]: 'transparent',
|
9817
9873
|
|
9818
|
-
[vars$
|
9819
|
-
[vars$
|
9874
|
+
[vars$e.headerRowTextColor]: globalRefs$b.colors.surface.dark,
|
9875
|
+
[vars$e.separatorColor]: globalRefs$b.colors.surface.light,
|
9820
9876
|
|
9821
|
-
[vars$
|
9822
|
-
[vars$
|
9877
|
+
[vars$e.valueTextColor]: globalRefs$b.colors.surface.contrast,
|
9878
|
+
[vars$e.selectedBackgroundColor]: globalRefs$b.colors.surface.highlight,
|
9823
9879
|
|
9824
9880
|
_bordered: {
|
9825
|
-
[vars$
|
9881
|
+
[vars$e.borderColor]: refs.borderColor,
|
9826
9882
|
},
|
9827
9883
|
};
|
9828
9884
|
|
@@ -9830,10 +9886,10 @@ var grid$1 = /*#__PURE__*/Object.freeze({
|
|
9830
9886
|
__proto__: null,
|
9831
9887
|
default: grid,
|
9832
9888
|
grid: grid,
|
9833
|
-
vars: vars$
|
9889
|
+
vars: vars$e
|
9834
9890
|
});
|
9835
9891
|
|
9836
|
-
const componentName$
|
9892
|
+
const componentName$e = getComponentName('notification-card');
|
9837
9893
|
|
9838
9894
|
const notificationCardMixin = (superclass) =>
|
9839
9895
|
class NotificationCardMixinClass extends superclass {
|
@@ -9941,54 +9997,54 @@ const NotificationCardClass = compose(
|
|
9941
9997
|
}
|
9942
9998
|
`,
|
9943
9999
|
excludeAttrsSync: ['tabindex'],
|
9944
|
-
componentName: componentName$
|
10000
|
+
componentName: componentName$e,
|
9945
10001
|
})
|
9946
10002
|
);
|
9947
10003
|
|
9948
|
-
const globalRefs$
|
9949
|
-
const vars$
|
10004
|
+
const globalRefs$a = getThemeRefs(globals);
|
10005
|
+
const vars$d = NotificationCardClass.cssVarList;
|
9950
10006
|
|
9951
10007
|
const shadowColor = '#00000020';
|
9952
10008
|
|
9953
10009
|
const notification = {
|
9954
|
-
[vars$
|
9955
|
-
[vars$
|
9956
|
-
[vars$
|
9957
|
-
[vars$
|
9958
|
-
[vars$
|
9959
|
-
[vars$
|
9960
|
-
[vars$
|
9961
|
-
[vars$
|
9962
|
-
[vars$
|
10010
|
+
[vars$d.hostMinWidth]: '415px',
|
10011
|
+
[vars$d.fontFamily]: globalRefs$a.fonts.font1.family,
|
10012
|
+
[vars$d.fontSize]: globalRefs$a.typography.body1.size,
|
10013
|
+
[vars$d.backgroundColor]: globalRefs$a.colors.surface.main,
|
10014
|
+
[vars$d.textColor]: globalRefs$a.colors.surface.contrast,
|
10015
|
+
[vars$d.boxShadow]: `${globalRefs$a.shadow.wide.xl} ${shadowColor}, ${globalRefs$a.shadow.narrow.xl} ${shadowColor}`,
|
10016
|
+
[vars$d.verticalPadding]: '0.625em',
|
10017
|
+
[vars$d.horizontalPadding]: '1.5em',
|
10018
|
+
[vars$d.borderRadius]: globalRefs$a.radius.xs,
|
9963
10019
|
|
9964
10020
|
_bordered: {
|
9965
|
-
[vars$
|
9966
|
-
[vars$
|
9967
|
-
[vars$
|
10021
|
+
[vars$d.borderWidth]: globalRefs$a.border.sm,
|
10022
|
+
[vars$d.borderStyle]: 'solid',
|
10023
|
+
[vars$d.borderColor]: 'transparent',
|
9968
10024
|
},
|
9969
10025
|
|
9970
10026
|
size: {
|
9971
|
-
xs: { [vars$
|
9972
|
-
sm: { [vars$
|
9973
|
-
md: { [vars$
|
9974
|
-
lg: { [vars$
|
10027
|
+
xs: { [vars$d.fontSize]: '12px' },
|
10028
|
+
sm: { [vars$d.fontSize]: '14px' },
|
10029
|
+
md: { [vars$d.fontSize]: '16px' },
|
10030
|
+
lg: { [vars$d.fontSize]: '18px' },
|
9975
10031
|
},
|
9976
10032
|
|
9977
10033
|
mode: {
|
9978
10034
|
primary: {
|
9979
|
-
[vars$
|
9980
|
-
[vars$
|
9981
|
-
[vars$
|
10035
|
+
[vars$d.backgroundColor]: globalRefs$a.colors.primary.main,
|
10036
|
+
[vars$d.textColor]: globalRefs$a.colors.primary.contrast,
|
10037
|
+
[vars$d.borderColor]: globalRefs$a.colors.primary.light,
|
9982
10038
|
},
|
9983
10039
|
success: {
|
9984
|
-
[vars$
|
9985
|
-
[vars$
|
9986
|
-
[vars$
|
10040
|
+
[vars$d.backgroundColor]: globalRefs$a.colors.success.main,
|
10041
|
+
[vars$d.textColor]: globalRefs$a.colors.success.contrast,
|
10042
|
+
[vars$d.borderColor]: globalRefs$a.colors.success.light,
|
9987
10043
|
},
|
9988
10044
|
error: {
|
9989
|
-
[vars$
|
9990
|
-
[vars$
|
9991
|
-
[vars$
|
10045
|
+
[vars$d.backgroundColor]: globalRefs$a.colors.error.main,
|
10046
|
+
[vars$d.textColor]: globalRefs$a.colors.error.contrast,
|
10047
|
+
[vars$d.borderColor]: globalRefs$a.colors.error.light,
|
9992
10048
|
},
|
9993
10049
|
},
|
9994
10050
|
};
|
@@ -9996,10 +10052,10 @@ const notification = {
|
|
9996
10052
|
var notificationCard = /*#__PURE__*/Object.freeze({
|
9997
10053
|
__proto__: null,
|
9998
10054
|
default: notification,
|
9999
|
-
vars: vars$
|
10055
|
+
vars: vars$d
|
10000
10056
|
});
|
10001
10057
|
|
10002
|
-
const componentName$
|
10058
|
+
const componentName$d = getComponentName('multi-select-combo-box');
|
10003
10059
|
|
10004
10060
|
const multiSelectComboBoxMixin = (superclass) =>
|
10005
10061
|
class MultiSelectComboBoxMixinClass extends superclass {
|
@@ -10603,73 +10659,73 @@ const MultiSelectComboBoxClass = compose(
|
|
10603
10659
|
// Note: we exclude `placeholder` because the vaadin component observes it and
|
10604
10660
|
// tries to override it, causing us to lose the user set placeholder.
|
10605
10661
|
excludeAttrsSync: ['tabindex', 'size', 'data', 'placeholder'],
|
10606
|
-
componentName: componentName$
|
10662
|
+
componentName: componentName$d,
|
10607
10663
|
includeForwardProps: ['items', 'renderer', 'selectedItems'],
|
10608
10664
|
})
|
10609
10665
|
);
|
10610
10666
|
|
10611
|
-
const globalRefs$
|
10612
|
-
const vars$
|
10667
|
+
const globalRefs$9 = getThemeRefs(globals);
|
10668
|
+
const vars$c = MultiSelectComboBoxClass.cssVarList;
|
10613
10669
|
|
10614
10670
|
const multiSelectComboBox = {
|
10615
|
-
[vars$
|
10616
|
-
[vars$
|
10617
|
-
[vars$
|
10618
|
-
[vars$
|
10619
|
-
[vars$
|
10620
|
-
[vars$
|
10621
|
-
[vars$
|
10622
|
-
[vars$
|
10623
|
-
[vars$
|
10624
|
-
[vars$
|
10625
|
-
[vars$
|
10626
|
-
[vars$
|
10627
|
-
[vars$
|
10628
|
-
[vars$
|
10629
|
-
[vars$
|
10630
|
-
[vars$
|
10631
|
-
[vars$
|
10632
|
-
[vars$
|
10633
|
-
[vars$
|
10634
|
-
[vars$
|
10635
|
-
[vars$
|
10636
|
-
[vars$
|
10637
|
-
[vars$
|
10638
|
-
[vars$
|
10639
|
-
[vars$
|
10640
|
-
[vars$
|
10641
|
-
[vars$
|
10642
|
-
[vars$
|
10643
|
-
[vars$
|
10644
|
-
[vars$
|
10671
|
+
[vars$c.hostWidth]: refs.width,
|
10672
|
+
[vars$c.hostDirection]: refs.direction,
|
10673
|
+
[vars$c.fontSize]: refs.fontSize,
|
10674
|
+
[vars$c.fontFamily]: refs.fontFamily,
|
10675
|
+
[vars$c.labelTextColor]: refs.labelTextColor,
|
10676
|
+
[vars$c.errorMessageTextColor]: refs.errorMessageTextColor,
|
10677
|
+
[vars$c.inputBorderColor]: refs.borderColor,
|
10678
|
+
[vars$c.inputBorderWidth]: refs.borderWidth,
|
10679
|
+
[vars$c.inputBorderStyle]: refs.borderStyle,
|
10680
|
+
[vars$c.inputBorderRadius]: refs.borderRadius,
|
10681
|
+
[vars$c.inputOutlineColor]: refs.outlineColor,
|
10682
|
+
[vars$c.inputOutlineOffset]: refs.outlineOffset,
|
10683
|
+
[vars$c.inputOutlineWidth]: refs.outlineWidth,
|
10684
|
+
[vars$c.inputOutlineStyle]: refs.outlineStyle,
|
10685
|
+
[vars$c.labelRequiredIndicator]: refs.requiredIndicator,
|
10686
|
+
[vars$c.inputValueTextColor]: refs.valueTextColor,
|
10687
|
+
[vars$c.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
10688
|
+
[vars$c.inputBackgroundColor]: refs.backgroundColor,
|
10689
|
+
[vars$c.inputHorizontalPadding]: refs.horizontalPadding,
|
10690
|
+
[vars$c.inputVerticalPadding]: refs.verticalPadding,
|
10691
|
+
[vars$c.inputHeight]: refs.inputHeight,
|
10692
|
+
[vars$c.inputDropdownButtonColor]: globalRefs$9.colors.surface.dark,
|
10693
|
+
[vars$c.inputDropdownButtonCursor]: 'pointer',
|
10694
|
+
[vars$c.inputDropdownButtonSize]: refs.toggleButtonSize,
|
10695
|
+
[vars$c.inputDropdownButtonOffset]: globalRefs$9.spacing.xs,
|
10696
|
+
[vars$c.overlayItemPaddingInlineStart]: globalRefs$9.spacing.xs,
|
10697
|
+
[vars$c.overlayItemPaddingInlineEnd]: globalRefs$9.spacing.lg,
|
10698
|
+
[vars$c.chipFontSize]: refs.chipFontSize,
|
10699
|
+
[vars$c.chipTextColor]: globalRefs$9.colors.surface.contrast,
|
10700
|
+
[vars$c.chipBackgroundColor]: globalRefs$9.colors.surface.light,
|
10645
10701
|
|
10646
10702
|
_readonly: {
|
10647
|
-
[vars$
|
10703
|
+
[vars$c.inputDropdownButtonCursor]: 'default',
|
10648
10704
|
},
|
10649
10705
|
|
10650
10706
|
// Overlay theme exposed via the component:
|
10651
|
-
[vars$
|
10652
|
-
[vars$
|
10653
|
-
[vars$
|
10654
|
-
[vars$
|
10655
|
-
[vars$
|
10656
|
-
[vars$
|
10707
|
+
[vars$c.overlayFontSize]: refs.fontSize,
|
10708
|
+
[vars$c.overlayFontFamily]: refs.fontFamily,
|
10709
|
+
[vars$c.overlayCursor]: 'pointer',
|
10710
|
+
[vars$c.overlayItemBoxShadow]: 'none',
|
10711
|
+
[vars$c.overlayBackground]: refs.backgroundColor,
|
10712
|
+
[vars$c.overlayTextColor]: refs.valueTextColor,
|
10657
10713
|
|
10658
10714
|
// Overlay direct theme:
|
10659
|
-
[vars$
|
10660
|
-
[vars$
|
10715
|
+
[vars$c.overlay.minHeight]: '400px',
|
10716
|
+
[vars$c.overlay.margin]: '0',
|
10661
10717
|
};
|
10662
10718
|
|
10663
10719
|
var multiSelectComboBox$1 = /*#__PURE__*/Object.freeze({
|
10664
10720
|
__proto__: null,
|
10665
10721
|
default: multiSelectComboBox,
|
10666
10722
|
multiSelectComboBox: multiSelectComboBox,
|
10667
|
-
vars: vars$
|
10723
|
+
vars: vars$c
|
10668
10724
|
});
|
10669
10725
|
|
10670
|
-
const componentName$
|
10726
|
+
const componentName$c = getComponentName('badge');
|
10671
10727
|
|
10672
|
-
class RawBadge extends createBaseClass({ componentName: componentName$
|
10728
|
+
class RawBadge extends createBaseClass({ componentName: componentName$c, baseSelector: ':host > div' }) {
|
10673
10729
|
constructor() {
|
10674
10730
|
super();
|
10675
10731
|
|
@@ -10720,66 +10776,66 @@ const BadgeClass = compose(
|
|
10720
10776
|
componentNameValidationMixin
|
10721
10777
|
)(RawBadge);
|
10722
10778
|
|
10723
|
-
const globalRefs$
|
10724
|
-
const vars$
|
10779
|
+
const globalRefs$8 = getThemeRefs(globals);
|
10780
|
+
const vars$b = BadgeClass.cssVarList;
|
10725
10781
|
|
10726
10782
|
const badge$2 = {
|
10727
|
-
[vars$
|
10728
|
-
[vars$
|
10783
|
+
[vars$b.hostWidth]: 'fit-content',
|
10784
|
+
[vars$b.hostDirection]: globalRefs$8.direction,
|
10729
10785
|
|
10730
|
-
[vars$
|
10786
|
+
[vars$b.textAlign]: 'center',
|
10731
10787
|
|
10732
|
-
[vars$
|
10733
|
-
[vars$
|
10788
|
+
[vars$b.fontFamily]: globalRefs$8.fonts.font1.family,
|
10789
|
+
[vars$b.fontWeight]: '400',
|
10734
10790
|
|
10735
|
-
[vars$
|
10736
|
-
[vars$
|
10791
|
+
[vars$b.verticalPadding]: '0.25em',
|
10792
|
+
[vars$b.horizontalPadding]: '0.5em',
|
10737
10793
|
|
10738
|
-
[vars$
|
10739
|
-
[vars$
|
10740
|
-
[vars$
|
10741
|
-
[vars$
|
10794
|
+
[vars$b.borderWidth]: globalRefs$8.border.xs,
|
10795
|
+
[vars$b.borderRadius]: globalRefs$8.radius.xs,
|
10796
|
+
[vars$b.borderColor]: 'transparent',
|
10797
|
+
[vars$b.borderStyle]: 'solid',
|
10742
10798
|
|
10743
10799
|
_fullWidth: {
|
10744
|
-
[vars$
|
10800
|
+
[vars$b.hostWidth]: '100%',
|
10745
10801
|
},
|
10746
10802
|
|
10747
10803
|
size: {
|
10748
|
-
xs: { [vars$
|
10749
|
-
sm: { [vars$
|
10750
|
-
md: { [vars$
|
10751
|
-
lg: { [vars$
|
10804
|
+
xs: { [vars$b.fontSize]: '12px' },
|
10805
|
+
sm: { [vars$b.fontSize]: '14px' },
|
10806
|
+
md: { [vars$b.fontSize]: '16px' },
|
10807
|
+
lg: { [vars$b.fontSize]: '18px' },
|
10752
10808
|
},
|
10753
10809
|
|
10754
10810
|
mode: {
|
10755
10811
|
default: {
|
10756
|
-
[vars$
|
10812
|
+
[vars$b.textColor]: globalRefs$8.colors.surface.dark,
|
10757
10813
|
_bordered: {
|
10758
|
-
[vars$
|
10814
|
+
[vars$b.borderColor]: globalRefs$8.colors.surface.light,
|
10759
10815
|
},
|
10760
10816
|
},
|
10761
10817
|
primary: {
|
10762
|
-
[vars$
|
10818
|
+
[vars$b.textColor]: globalRefs$8.colors.primary.main,
|
10763
10819
|
_bordered: {
|
10764
|
-
[vars$
|
10820
|
+
[vars$b.borderColor]: globalRefs$8.colors.primary.light,
|
10765
10821
|
},
|
10766
10822
|
},
|
10767
10823
|
secondary: {
|
10768
|
-
[vars$
|
10824
|
+
[vars$b.textColor]: globalRefs$8.colors.secondary.main,
|
10769
10825
|
_bordered: {
|
10770
|
-
[vars$
|
10826
|
+
[vars$b.borderColor]: globalRefs$8.colors.secondary.light,
|
10771
10827
|
},
|
10772
10828
|
},
|
10773
10829
|
error: {
|
10774
|
-
[vars$
|
10830
|
+
[vars$b.textColor]: globalRefs$8.colors.error.main,
|
10775
10831
|
_bordered: {
|
10776
|
-
[vars$
|
10832
|
+
[vars$b.borderColor]: globalRefs$8.colors.error.light,
|
10777
10833
|
},
|
10778
10834
|
},
|
10779
10835
|
success: {
|
10780
|
-
[vars$
|
10836
|
+
[vars$b.textColor]: globalRefs$8.colors.success.main,
|
10781
10837
|
_bordered: {
|
10782
|
-
[vars$
|
10838
|
+
[vars$b.borderColor]: globalRefs$8.colors.success.light,
|
10783
10839
|
},
|
10784
10840
|
},
|
10785
10841
|
},
|
@@ -10788,11 +10844,11 @@ const badge$2 = {
|
|
10788
10844
|
var badge$3 = /*#__PURE__*/Object.freeze({
|
10789
10845
|
__proto__: null,
|
10790
10846
|
default: badge$2,
|
10791
|
-
vars: vars$
|
10847
|
+
vars: vars$b
|
10792
10848
|
});
|
10793
10849
|
|
10794
|
-
const componentName$
|
10795
|
-
class RawAvatar extends createBaseClass({ componentName: componentName$
|
10850
|
+
const componentName$b = getComponentName('avatar');
|
10851
|
+
class RawAvatar extends createBaseClass({ componentName: componentName$b, baseSelector: ':host > .wrapper' }) {
|
10796
10852
|
constructor() {
|
10797
10853
|
super();
|
10798
10854
|
|
@@ -10893,16 +10949,16 @@ const AvatarClass = compose(
|
|
10893
10949
|
componentNameValidationMixin
|
10894
10950
|
)(RawAvatar);
|
10895
10951
|
|
10896
|
-
const globalRefs$
|
10952
|
+
const globalRefs$7 = getThemeRefs(globals);
|
10897
10953
|
const compVars = AvatarClass.cssVarList;
|
10898
10954
|
|
10899
10955
|
const avatar = {
|
10900
|
-
[compVars.hostDirection]: globalRefs$
|
10901
|
-
[compVars.editableIconColor]: globalRefs$
|
10902
|
-
[compVars.editableBorderColor]: globalRefs$
|
10903
|
-
[compVars.editableBackgroundColor]: globalRefs$
|
10904
|
-
[compVars.avatarTextColor]: globalRefs$
|
10905
|
-
[compVars.avatarBackgroundColor]: globalRefs$
|
10956
|
+
[compVars.hostDirection]: globalRefs$7.direction,
|
10957
|
+
[compVars.editableIconColor]: globalRefs$7.colors.surface.dark,
|
10958
|
+
[compVars.editableBorderColor]: globalRefs$7.colors.surface.dark,
|
10959
|
+
[compVars.editableBackgroundColor]: globalRefs$7.colors.surface.main,
|
10960
|
+
[compVars.avatarTextColor]: globalRefs$7.colors.surface.main,
|
10961
|
+
[compVars.avatarBackgroundColor]: globalRefs$7.colors.surface.dark,
|
10906
10962
|
|
10907
10963
|
_editable: {
|
10908
10964
|
[compVars.cursor]: 'pointer',
|
@@ -10928,23 +10984,23 @@ const avatar = {
|
|
10928
10984
|
},
|
10929
10985
|
};
|
10930
10986
|
|
10931
|
-
const vars$
|
10987
|
+
const vars$a = {
|
10932
10988
|
...compVars,
|
10933
10989
|
};
|
10934
10990
|
|
10935
10991
|
var avatar$1 = /*#__PURE__*/Object.freeze({
|
10936
10992
|
__proto__: null,
|
10937
10993
|
default: avatar,
|
10938
|
-
vars: vars$
|
10994
|
+
vars: vars$a
|
10939
10995
|
});
|
10940
10996
|
|
10941
|
-
const componentName$
|
10997
|
+
const componentName$a = getComponentName('mappings-field-internal');
|
10942
10998
|
|
10943
|
-
createBaseInputClass({ componentName: componentName$
|
10999
|
+
createBaseInputClass({ componentName: componentName$a, baseSelector: 'div' });
|
10944
11000
|
|
10945
|
-
const componentName$
|
11001
|
+
const componentName$9 = getComponentName('mappings-field');
|
10946
11002
|
|
10947
|
-
const customMixin$
|
11003
|
+
const customMixin$2 = (superclass) =>
|
10948
11004
|
class MappingsFieldMixinClass extends superclass {
|
10949
11005
|
get defaultValues() {
|
10950
11006
|
const defaultValuesAttr = this.getAttribute('default-values');
|
@@ -10971,14 +11027,14 @@ const customMixin$1 = (superclass) =>
|
|
10971
11027
|
const template = document.createElement('template');
|
10972
11028
|
|
10973
11029
|
template.innerHTML = `
|
10974
|
-
<${componentName$
|
11030
|
+
<${componentName$a}
|
10975
11031
|
tabindex="-1"
|
10976
|
-
></${componentName$
|
11032
|
+
></${componentName$a}>
|
10977
11033
|
`;
|
10978
11034
|
|
10979
11035
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
10980
11036
|
|
10981
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
11037
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$a);
|
10982
11038
|
|
10983
11039
|
forwardAttrs(this, this.inputElement, {
|
10984
11040
|
includeAttrs: [
|
@@ -11060,7 +11116,7 @@ const MappingsFieldClass = compose(
|
|
11060
11116
|
proxyParentValidation: true,
|
11061
11117
|
}),
|
11062
11118
|
componentNameValidationMixin,
|
11063
|
-
customMixin$
|
11119
|
+
customMixin$2
|
11064
11120
|
)(
|
11065
11121
|
createProxy({
|
11066
11122
|
slots: [],
|
@@ -11107,47 +11163,47 @@ const MappingsFieldClass = compose(
|
|
11107
11163
|
'options',
|
11108
11164
|
'error-message',
|
11109
11165
|
],
|
11110
|
-
componentName: componentName$
|
11166
|
+
componentName: componentName$9,
|
11111
11167
|
})
|
11112
11168
|
);
|
11113
11169
|
|
11114
|
-
const globalRefs$
|
11170
|
+
const globalRefs$6 = getThemeRefs(globals);
|
11115
11171
|
|
11116
|
-
const vars$
|
11172
|
+
const vars$9 = MappingsFieldClass.cssVarList;
|
11117
11173
|
|
11118
11174
|
const mappingsField = {
|
11119
|
-
[vars$
|
11120
|
-
[vars$
|
11121
|
-
[vars$
|
11122
|
-
[vars$
|
11123
|
-
[vars$
|
11124
|
-
[vars$
|
11125
|
-
[vars$
|
11126
|
-
[vars$
|
11127
|
-
[vars$
|
11128
|
-
[vars$
|
11175
|
+
[vars$9.hostWidth]: refs.width,
|
11176
|
+
[vars$9.hostDirection]: refs.direction,
|
11177
|
+
[vars$9.fontSize]: refs.fontSize,
|
11178
|
+
[vars$9.fontFamily]: refs.fontFamily,
|
11179
|
+
[vars$9.separatorFontSize]: '14px',
|
11180
|
+
[vars$9.labelsFontSize]: '14px',
|
11181
|
+
[vars$9.labelsLineHeight]: '1',
|
11182
|
+
[vars$9.labelsMarginBottom]: '6px',
|
11183
|
+
[vars$9.labelTextColor]: refs.labelTextColor,
|
11184
|
+
[vars$9.itemMarginBottom]: '1em',
|
11129
11185
|
// To be positioned correctly, the min width has to match the text field min width
|
11130
|
-
[vars$
|
11186
|
+
[vars$9.valueLabelMinWidth]: refs.minWidth,
|
11131
11187
|
// To be positioned correctly, the min width has to match the combo box field min width
|
11132
|
-
[vars$
|
11133
|
-
[vars$
|
11134
|
-
[vars$
|
11188
|
+
[vars$9.attrLabelMinWidth]: `calc(12em + 2 * ${globalRefs$6.border.xs})`,
|
11189
|
+
[vars$9.separatorWidth]: '70px',
|
11190
|
+
[vars$9.removeButtonWidth]: '60px',
|
11135
11191
|
};
|
11136
11192
|
|
11137
11193
|
var mappingsField$1 = /*#__PURE__*/Object.freeze({
|
11138
11194
|
__proto__: null,
|
11139
11195
|
default: mappingsField,
|
11140
11196
|
mappingsField: mappingsField,
|
11141
|
-
vars: vars$
|
11197
|
+
vars: vars$9
|
11142
11198
|
});
|
11143
11199
|
|
11144
11200
|
var deleteIcon = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iMTgiIHZpZXdCb3g9IjAgMCAxNCAxOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEgMTZDMSAxNy4xIDEuOSAxOCAzIDE4SDExQzEyLjEgMTggMTMgMTcuMSAxMyAxNlY0SDFWMTZaTTMgNkgxMVYxNkgzVjZaTTEwLjUgMUw5LjUgMEg0LjVMMy41IDFIMFYzSDE0VjFIMTAuNVoiIGZpbGw9ImN1cnJlbnRjb2xvciIvPgo8L3N2Zz4K";
|
11145
11201
|
|
11146
11202
|
var editIcon = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTUiIGhlaWdodD0iMTUiIHZpZXdCb3g9IjAgMCAxNSAxNSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEwLjAwMDIgMC45OTIxNDlDMTAuMDAwMiAxLjAxNjE1IDEwLjAwMDIgMS4wMTYxNSAxMC4wMDAyIDEuMDE2MTVMOC4yMjQxOSAzLjAwODE1SDIuOTkyMTlDMi40NjQxOSAzLjAwODE1IDIuMDA4MTkgMy40NDAxNSAyLjAwODE5IDMuOTkyMTVWMTIuMDA4MkMyLjAwODE5IDEyLjUzNjIgMi40NDAxOSAxMi45OTIyIDIuOTkyMTkgMTIuOTkyMkg1LjUzNjE5QzUuODQ4MTkgMTMuMDQwMiA2LjE2MDE5IDEzLjA0MDIgNi40NzIxOSAxMi45OTIySDExLjAwODJDMTEuNTM2MiAxMi45OTIyIDExLjk5MjIgMTIuNTYwMiAxMS45OTIyIDEyLjAwODJWNy43ODQxNkwxMy45MzYyIDUuNjI0MTVMMTQuMDA4MiA1LjY3MjE1VjExLjk4NDJDMTQuMDA4MiAxMy42NjQyIDEyLjY2NDIgMTUuMDA4MiAxMS4wMDgyIDE1LjAwODJIMy4wMTYxOUMxLjMzNjE5IDE1LjAwODIgLTAuMDA3ODEyNSAxMy42NjQyIC0wLjAwNzgxMjUgMTEuOTg0MlYzLjk5MjE1Qy0wLjAwNzgxMjUgMi4zMzYxNSAxLjMzNjE5IDAuOTkyMTQ5IDMuMDE2MTkgMC45OTIxNDlIMTAuMDAwMlpNMTEuMjcyMiAyLjYyNDE1TDEyLjYxNjIgNC4xMTIxNUw3LjcyMDE5IDkuNjgwMTZDNy41MDQxOSA5LjkyMDE2IDYuODMyMTkgMTAuMjMyMiA1LjY4MDE5IDEwLjYxNjJDNS42NTYxOSAxMC42NDAyIDUuNjA4MTkgMTAuNjQwMiA1LjU2MDE5IDEwLjYxNjJDNS40NjQxOSAxMC41OTIyIDUuMzkyMTkgMTAuNDcyMiA1LjQ0MDE5IDEwLjM3NjJDNS43NTIxOSA5LjI0ODE2IDYuMDQwMTkgOC41NTIxNiA2LjI1NjE5IDguMzEyMTZMMTEuMjcyMiAyLjYyNDE1Wk0xMS45MjAyIDEuODU2MTVMMTMuMjg4MiAwLjMyMDE0OUMxMy42NDgyIC0wLjA4Nzg1MTYgMTQuMjcyMiAtMC4xMTE4NTIgMTQuNjgwMiAwLjI3MjE0OUMxNS4wODgyIDAuNjMyMTQ5IDE1LjExMjIgMS4yODAxNSAxNC43NTIyIDEuNjg4MTVMMTMuMjY0MiAzLjM2ODE1TDExLjkyMDIgMS44NTYxNVoiIGZpbGw9ImN1cnJlbnRjb2xvciIvPgo8L3N2Zz4K";
|
11147
11203
|
|
11148
|
-
const componentName$
|
11204
|
+
const componentName$8 = getComponentName('user-attribute');
|
11149
11205
|
class RawUserAttribute extends createBaseClass({
|
11150
|
-
componentName: componentName$
|
11206
|
+
componentName: componentName$8,
|
11151
11207
|
baseSelector: ':host > .root',
|
11152
11208
|
}) {
|
11153
11209
|
constructor() {
|
@@ -11377,32 +11433,32 @@ const UserAttributeClass = compose(
|
|
11377
11433
|
componentNameValidationMixin
|
11378
11434
|
)(RawUserAttribute);
|
11379
11435
|
|
11380
|
-
const globalRefs$
|
11381
|
-
const vars$
|
11436
|
+
const globalRefs$5 = getThemeRefs(globals);
|
11437
|
+
const vars$8 = UserAttributeClass.cssVarList;
|
11382
11438
|
|
11383
11439
|
const userAttribute = {
|
11384
|
-
[vars$
|
11385
|
-
[vars$
|
11386
|
-
[vars$
|
11387
|
-
[vars$
|
11388
|
-
[vars$
|
11389
|
-
[vars$
|
11440
|
+
[vars$8.hostDirection]: globalRefs$5.direction,
|
11441
|
+
[vars$8.labelTextWidth]: '150px',
|
11442
|
+
[vars$8.valueTextWidth]: '200px',
|
11443
|
+
[vars$8.badgeMaxWidth]: '85px',
|
11444
|
+
[vars$8.itemsGap]: '16px',
|
11445
|
+
[vars$8.hostMinWidth]: '530px',
|
11390
11446
|
_fullWidth: {
|
11391
|
-
[vars$
|
11447
|
+
[vars$8.hostWidth]: '100%',
|
11392
11448
|
},
|
11393
11449
|
};
|
11394
11450
|
|
11395
11451
|
var userAttribute$1 = /*#__PURE__*/Object.freeze({
|
11396
11452
|
__proto__: null,
|
11397
11453
|
default: userAttribute,
|
11398
|
-
vars: vars$
|
11454
|
+
vars: vars$8
|
11399
11455
|
});
|
11400
11456
|
|
11401
11457
|
var greenVIcon = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTggMEMzLjYgMCAwIDMuNiAwIDhDMCAxMi40IDMuNiAxNiA4IDE2QzEyLjQgMTYgMTYgMTIuNCAxNiA4QzE2IDMuNiAxMi40IDAgOCAwWk03LjEgMTEuN0wyLjkgNy42TDQuMyA2LjJMNyA4LjlMMTIgNEwxMy40IDUuNEw3LjEgMTEuN1oiIGZpbGw9IiM0Q0FGNTAiLz4KPC9zdmc+Cg==";
|
11402
11458
|
|
11403
|
-
const componentName$
|
11459
|
+
const componentName$7 = getComponentName('user-auth-method');
|
11404
11460
|
class RawUserAuthMethod extends createBaseClass({
|
11405
|
-
componentName: componentName$
|
11461
|
+
componentName: componentName$7,
|
11406
11462
|
baseSelector: ':host > .root',
|
11407
11463
|
}) {
|
11408
11464
|
constructor() {
|
@@ -11594,33 +11650,33 @@ const UserAuthMethodClass = compose(
|
|
11594
11650
|
componentNameValidationMixin
|
11595
11651
|
)(RawUserAuthMethod);
|
11596
11652
|
|
11597
|
-
const globalRefs$
|
11598
|
-
const vars$
|
11653
|
+
const globalRefs$4 = getThemeRefs(globals);
|
11654
|
+
const vars$7 = UserAuthMethodClass.cssVarList;
|
11599
11655
|
|
11600
11656
|
const userAuthMethod = {
|
11601
|
-
[vars$
|
11602
|
-
[vars$
|
11603
|
-
[vars$
|
11604
|
-
[vars$
|
11605
|
-
[vars$
|
11657
|
+
[vars$7.hostDirection]: globalRefs$4.direction,
|
11658
|
+
[vars$7.labelTextWidth]: '200px',
|
11659
|
+
[vars$7.itemsGap]: '16px',
|
11660
|
+
[vars$7.hostMinWidth]: '530px',
|
11661
|
+
[vars$7.iconSize]: '24px',
|
11606
11662
|
_fullWidth: {
|
11607
|
-
[vars$
|
11663
|
+
[vars$7.hostWidth]: '100%',
|
11608
11664
|
},
|
11609
11665
|
};
|
11610
11666
|
|
11611
11667
|
var userAuthMethod$1 = /*#__PURE__*/Object.freeze({
|
11612
11668
|
__proto__: null,
|
11613
11669
|
default: userAuthMethod,
|
11614
|
-
vars: vars$
|
11670
|
+
vars: vars$7
|
11615
11671
|
});
|
11616
11672
|
|
11617
|
-
const componentName$
|
11673
|
+
const componentName$6 = getComponentName('saml-group-mappings-internal');
|
11618
11674
|
|
11619
|
-
createBaseInputClass({ componentName: componentName$
|
11675
|
+
createBaseInputClass({ componentName: componentName$6, baseSelector: '' });
|
11620
11676
|
|
11621
|
-
const componentName$
|
11677
|
+
const componentName$5 = getComponentName('saml-group-mappings');
|
11622
11678
|
|
11623
|
-
const customMixin = (superclass) =>
|
11679
|
+
const customMixin$1 = (superclass) =>
|
11624
11680
|
class SamlGroupMappingsMixinClass extends superclass {
|
11625
11681
|
init() {
|
11626
11682
|
super.init?.();
|
@@ -11628,14 +11684,14 @@ const customMixin = (superclass) =>
|
|
11628
11684
|
const template = document.createElement('template');
|
11629
11685
|
|
11630
11686
|
template.innerHTML = `
|
11631
|
-
<${componentName$
|
11687
|
+
<${componentName$6}
|
11632
11688
|
tabindex="-1"
|
11633
|
-
></${componentName$
|
11689
|
+
></${componentName$6}>
|
11634
11690
|
`;
|
11635
11691
|
|
11636
11692
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
11637
11693
|
|
11638
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
11694
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$6);
|
11639
11695
|
|
11640
11696
|
forwardAttrs(this, this.inputElement, {
|
11641
11697
|
includeAttrs: [
|
@@ -11677,7 +11733,7 @@ const SamlGroupMappingsClass = compose(
|
|
11677
11733
|
proxyParentValidation: true,
|
11678
11734
|
}),
|
11679
11735
|
componentNameValidationMixin,
|
11680
|
-
customMixin
|
11736
|
+
customMixin$1
|
11681
11737
|
)(
|
11682
11738
|
createProxy({
|
11683
11739
|
slots: [],
|
@@ -11712,61 +11768,61 @@ const SamlGroupMappingsClass = compose(
|
|
11712
11768
|
'options',
|
11713
11769
|
'error-message',
|
11714
11770
|
],
|
11715
|
-
componentName: componentName$
|
11771
|
+
componentName: componentName$5,
|
11716
11772
|
})
|
11717
11773
|
);
|
11718
11774
|
|
11719
|
-
const vars$
|
11775
|
+
const vars$6 = SamlGroupMappingsClass.cssVarList;
|
11720
11776
|
|
11721
11777
|
const samlGroupMappings = {
|
11722
|
-
[vars$
|
11723
|
-
[vars$
|
11724
|
-
[vars$
|
11778
|
+
[vars$6.hostWidth]: refs.width,
|
11779
|
+
[vars$6.hostDirection]: refs.direction,
|
11780
|
+
[vars$6.groupNameInputMarginBottom]: '1em',
|
11725
11781
|
};
|
11726
11782
|
|
11727
11783
|
var samlGroupMappings$1 = /*#__PURE__*/Object.freeze({
|
11728
11784
|
__proto__: null,
|
11729
11785
|
default: samlGroupMappings,
|
11730
11786
|
samlGroupMappings: samlGroupMappings,
|
11731
|
-
vars: vars$
|
11787
|
+
vars: vars$6
|
11732
11788
|
});
|
11733
11789
|
|
11734
|
-
const globalRefs$
|
11735
|
-
const vars$
|
11790
|
+
const globalRefs$3 = getThemeRefs(globals);
|
11791
|
+
const vars$5 = PolicyValidationClass.cssVarList;
|
11736
11792
|
|
11737
11793
|
const policyValidation = {
|
11738
|
-
[vars$
|
11739
|
-
[vars$
|
11740
|
-
[vars$
|
11741
|
-
[vars$
|
11742
|
-
[vars$
|
11743
|
-
[vars$
|
11744
|
-
[vars$
|
11745
|
-
[vars$
|
11746
|
-
[vars$
|
11747
|
-
[vars$
|
11748
|
-
[vars$
|
11749
|
-
[vars$
|
11750
|
-
[vars$
|
11751
|
-
[vars$
|
11752
|
-
[vars$
|
11753
|
-
[vars$
|
11794
|
+
[vars$5.fontFamily]: refs.fontFamily,
|
11795
|
+
[vars$5.fontSize]: refs.labelFontSize,
|
11796
|
+
[vars$5.textColor]: refs.labelTextColor,
|
11797
|
+
[vars$5.borderWidth]: refs.borderWidth,
|
11798
|
+
[vars$5.borderStyle]: refs.borderStyle,
|
11799
|
+
[vars$5.borderColor]: refs.borderColor,
|
11800
|
+
[vars$5.borderRadius]: globalRefs$3.radius.sm,
|
11801
|
+
[vars$5.backgroundColor]: 'none',
|
11802
|
+
[vars$5.padding]: '0px',
|
11803
|
+
[vars$5.labelMargin]: globalRefs$3.spacing.sm,
|
11804
|
+
[vars$5.itemsSpacing]: globalRefs$3.spacing.lg,
|
11805
|
+
[vars$5.itemSymbolDefault]: "'\\2022'", // "•"
|
11806
|
+
[vars$5.itemSymbolSuccess]: "'\\2713'", // "✓"
|
11807
|
+
[vars$5.itemSymbolError]: "'\\2A09'", // "⨉"
|
11808
|
+
[vars$5.itemSymbolSuccessColor]: globalRefs$3.colors.success.main,
|
11809
|
+
[vars$5.itemSymbolErrorColor]: globalRefs$3.colors.error.main,
|
11754
11810
|
};
|
11755
11811
|
|
11756
11812
|
var policyValidation$1 = /*#__PURE__*/Object.freeze({
|
11757
11813
|
__proto__: null,
|
11758
11814
|
default: policyValidation,
|
11759
|
-
vars: vars$
|
11815
|
+
vars: vars$5
|
11760
11816
|
});
|
11761
11817
|
|
11762
|
-
const vars$
|
11818
|
+
const vars$4 = IconClass.cssVarList;
|
11763
11819
|
|
11764
11820
|
const icon = {};
|
11765
11821
|
|
11766
11822
|
var icon$1 = /*#__PURE__*/Object.freeze({
|
11767
11823
|
__proto__: null,
|
11768
11824
|
default: icon,
|
11769
|
-
vars: vars$
|
11825
|
+
vars: vars$4
|
11770
11826
|
});
|
11771
11827
|
|
11772
11828
|
const decode = (input) => {
|
@@ -11779,9 +11835,9 @@ const tpl = (input, inline) => {
|
|
11779
11835
|
return inline ? input : `<pre>${input}</pre>`;
|
11780
11836
|
};
|
11781
11837
|
|
11782
|
-
const componentName$
|
11838
|
+
const componentName$4 = getComponentName('code-snippet');
|
11783
11839
|
|
11784
|
-
let CodeSnippet$1 = class CodeSnippet extends createBaseClass({ componentName: componentName$
|
11840
|
+
let CodeSnippet$1 = class CodeSnippet extends createBaseClass({ componentName: componentName$4, baseSelector: ':host > code' }) {
|
11785
11841
|
static get observedAttributes() {
|
11786
11842
|
return ['lang', 'inline'];
|
11787
11843
|
}
|
@@ -12011,9 +12067,9 @@ const CodeSnippetClass = compose(
|
|
12011
12067
|
componentNameValidationMixin
|
12012
12068
|
)(CodeSnippet$1);
|
12013
12069
|
|
12014
|
-
const globalRefs = getThemeRefs(globals);
|
12070
|
+
const globalRefs$2 = getThemeRefs(globals);
|
12015
12071
|
|
12016
|
-
const vars$
|
12072
|
+
const vars$3 = CodeSnippetClass.cssVarList;
|
12017
12073
|
|
12018
12074
|
const light = {
|
12019
12075
|
color1: '#fa0',
|
@@ -12048,50 +12104,50 @@ const dark = {
|
|
12048
12104
|
};
|
12049
12105
|
|
12050
12106
|
const CodeSnippet = {
|
12051
|
-
[vars$
|
12052
|
-
[vars$
|
12053
|
-
[vars$
|
12054
|
-
[vars$
|
12055
|
-
[vars$
|
12056
|
-
[vars$
|
12057
|
-
[vars$
|
12058
|
-
[vars$
|
12059
|
-
[vars$
|
12060
|
-
[vars$
|
12061
|
-
[vars$
|
12062
|
-
[vars$
|
12063
|
-
[vars$
|
12064
|
-
[vars$
|
12065
|
-
[vars$
|
12066
|
-
[vars$
|
12067
|
-
[vars$
|
12068
|
-
[vars$
|
12069
|
-
[vars$
|
12070
|
-
[vars$
|
12071
|
-
[vars$
|
12072
|
-
[vars$
|
12073
|
-
[vars$
|
12074
|
-
[vars$
|
12075
|
-
[vars$
|
12076
|
-
[vars$
|
12077
|
-
[vars$
|
12078
|
-
[vars$
|
12079
|
-
[vars$
|
12080
|
-
[vars$
|
12081
|
-
[vars$
|
12082
|
-
[vars$
|
12083
|
-
[vars$
|
12084
|
-
[vars$
|
12085
|
-
[vars$
|
12086
|
-
[vars$
|
12087
|
-
[vars$
|
12088
|
-
[vars$
|
12089
|
-
[vars$
|
12090
|
-
[vars$
|
12091
|
-
[vars$
|
12092
|
-
[vars$
|
12093
|
-
[vars$
|
12094
|
-
[vars$
|
12107
|
+
[vars$3.rootBgColor]: globalRefs$2.colors.surface.main,
|
12108
|
+
[vars$3.rootTextColor]: globalRefs$2.colors.surface.contrast,
|
12109
|
+
[vars$3.docTagTextColor]: light.color2,
|
12110
|
+
[vars$3.keywordTextColor]: light.color2,
|
12111
|
+
[vars$3.metaKeywordTextColor]: light.color2,
|
12112
|
+
[vars$3.templateTagTextColor]: light.color2,
|
12113
|
+
[vars$3.templateVariableTextColor]: light.color2,
|
12114
|
+
[vars$3.typeTextColor]: light.color2,
|
12115
|
+
[vars$3.variableLanguageTextColor]: light.color2,
|
12116
|
+
[vars$3.titleTextColor]: light.color3,
|
12117
|
+
[vars$3.titleClassTextColor]: light.color3,
|
12118
|
+
[vars$3.titleClassInheritedTextColor]: light.color3,
|
12119
|
+
[vars$3.titleFunctionTextColor]: light.color3,
|
12120
|
+
[vars$3.attrTextColor]: light.color4,
|
12121
|
+
[vars$3.attributeTextColor]: light.color4,
|
12122
|
+
[vars$3.literalTextColor]: light.color4,
|
12123
|
+
[vars$3.metaTextColor]: light.color4,
|
12124
|
+
[vars$3.numberTextColor]: light.color4,
|
12125
|
+
[vars$3.operatorTextColor]: light.color4,
|
12126
|
+
[vars$3.variableTextColor]: light.color4,
|
12127
|
+
[vars$3.selectorAttrTextColor]: light.color4,
|
12128
|
+
[vars$3.selectorClassTextColor]: light.color4,
|
12129
|
+
[vars$3.selectorIdTextColor]: light.color4,
|
12130
|
+
[vars$3.regexpTextColor]: light.color13,
|
12131
|
+
[vars$3.stringTextColor]: light.color13,
|
12132
|
+
[vars$3.metaStringTextColor]: light.color13,
|
12133
|
+
[vars$3.builtInTextColor]: light.color5,
|
12134
|
+
[vars$3.symbolTextColor]: light.color5,
|
12135
|
+
[vars$3.commentTextColor]: light.color6,
|
12136
|
+
[vars$3.codeTextColor]: light.color6,
|
12137
|
+
[vars$3.formulaTextColor]: light.color6,
|
12138
|
+
[vars$3.nameTextColor]: light.color7,
|
12139
|
+
[vars$3.quoteTextColor]: light.color7,
|
12140
|
+
[vars$3.selectorTagTextColor]: light.color7,
|
12141
|
+
[vars$3.selectorPseudoTextColor]: light.color7,
|
12142
|
+
[vars$3.substTextColor]: light.color8,
|
12143
|
+
[vars$3.sectionTextColor]: light.color4,
|
12144
|
+
[vars$3.bulletTextColor]: light.color9,
|
12145
|
+
[vars$3.emphasisTextColor]: light.color8,
|
12146
|
+
[vars$3.strongTextColor]: light.color8,
|
12147
|
+
[vars$3.additionTextColor]: light.color7,
|
12148
|
+
[vars$3.additionBgColor]: light.color10,
|
12149
|
+
[vars$3.deletionTextColor]: light.color2,
|
12150
|
+
[vars$3.deletionBgColor]: light.color10,
|
12095
12151
|
/* purposely ignored */
|
12096
12152
|
// [vars.charEscapeTextColor]: '',
|
12097
12153
|
// [vars.linkTextColor]: '',
|
@@ -12103,50 +12159,50 @@ const CodeSnippet = {
|
|
12103
12159
|
|
12104
12160
|
const codeSnippetDarkThemeOverrides = {
|
12105
12161
|
codeSnippet: {
|
12106
|
-
[vars$
|
12107
|
-
[vars$
|
12108
|
-
[vars$
|
12109
|
-
[vars$
|
12110
|
-
[vars$
|
12111
|
-
[vars$
|
12112
|
-
[vars$
|
12113
|
-
[vars$
|
12114
|
-
[vars$
|
12115
|
-
[vars$
|
12116
|
-
[vars$
|
12117
|
-
[vars$
|
12118
|
-
[vars$
|
12119
|
-
[vars$
|
12120
|
-
[vars$
|
12121
|
-
[vars$
|
12122
|
-
[vars$
|
12123
|
-
[vars$
|
12124
|
-
[vars$
|
12125
|
-
[vars$
|
12126
|
-
[vars$
|
12127
|
-
[vars$
|
12128
|
-
[vars$
|
12129
|
-
[vars$
|
12130
|
-
[vars$
|
12131
|
-
[vars$
|
12132
|
-
[vars$
|
12133
|
-
[vars$
|
12134
|
-
[vars$
|
12135
|
-
[vars$
|
12136
|
-
[vars$
|
12137
|
-
[vars$
|
12138
|
-
[vars$
|
12139
|
-
[vars$
|
12140
|
-
[vars$
|
12141
|
-
[vars$
|
12142
|
-
[vars$
|
12143
|
-
[vars$
|
12144
|
-
[vars$
|
12145
|
-
[vars$
|
12146
|
-
[vars$
|
12147
|
-
[vars$
|
12148
|
-
[vars$
|
12149
|
-
[vars$
|
12162
|
+
[vars$3.rootBgColor]: globalRefs$2.colors.surface.main,
|
12163
|
+
[vars$3.rootTextColor]: globalRefs$2.colors.surface.contrast,
|
12164
|
+
[vars$3.docTagTextColor]: dark.color2,
|
12165
|
+
[vars$3.keywordTextColor]: dark.color2,
|
12166
|
+
[vars$3.metaKeywordTextColor]: dark.color2,
|
12167
|
+
[vars$3.templateTagTextColor]: dark.color2,
|
12168
|
+
[vars$3.templateVariableTextColor]: dark.color2,
|
12169
|
+
[vars$3.typeTextColor]: dark.color2,
|
12170
|
+
[vars$3.variableLanguageTextColor]: dark.color2,
|
12171
|
+
[vars$3.titleTextColor]: dark.color3,
|
12172
|
+
[vars$3.titleClassTextColor]: dark.color3,
|
12173
|
+
[vars$3.titleClassInheritedTextColor]: dark.color3,
|
12174
|
+
[vars$3.titleFunctionTextColor]: dark.color3,
|
12175
|
+
[vars$3.attrTextColor]: dark.color4,
|
12176
|
+
[vars$3.attributeTextColor]: dark.color4,
|
12177
|
+
[vars$3.literalTextColor]: dark.color4,
|
12178
|
+
[vars$3.metaTextColor]: dark.color4,
|
12179
|
+
[vars$3.numberTextColor]: dark.color4,
|
12180
|
+
[vars$3.operatorTextColor]: dark.color4,
|
12181
|
+
[vars$3.variableTextColor]: dark.color4,
|
12182
|
+
[vars$3.selectorAttrTextColor]: dark.color4,
|
12183
|
+
[vars$3.selectorClassTextColor]: dark.color4,
|
12184
|
+
[vars$3.selectorIdTextColor]: dark.color4,
|
12185
|
+
[vars$3.regexpTextColor]: dark.color13,
|
12186
|
+
[vars$3.stringTextColor]: dark.color13,
|
12187
|
+
[vars$3.metaStringTextColor]: dark.color13,
|
12188
|
+
[vars$3.builtInTextColor]: dark.color5,
|
12189
|
+
[vars$3.symbolTextColor]: dark.color5,
|
12190
|
+
[vars$3.commentTextColor]: dark.color6,
|
12191
|
+
[vars$3.codeTextColor]: dark.color6,
|
12192
|
+
[vars$3.formulaTextColor]: dark.color6,
|
12193
|
+
[vars$3.nameTextColor]: dark.color7,
|
12194
|
+
[vars$3.quoteTextColor]: dark.color7,
|
12195
|
+
[vars$3.selectorTagTextColor]: dark.color7,
|
12196
|
+
[vars$3.selectorPseudoTextColor]: dark.color7,
|
12197
|
+
[vars$3.substTextColor]: dark.color8,
|
12198
|
+
[vars$3.sectionTextColor]: dark.color4,
|
12199
|
+
[vars$3.bulletTextColor]: dark.color9,
|
12200
|
+
[vars$3.emphasisTextColor]: dark.color8,
|
12201
|
+
[vars$3.strongTextColor]: dark.color8,
|
12202
|
+
[vars$3.additionTextColor]: dark.color7,
|
12203
|
+
[vars$3.additionBgColor]: dark.color10,
|
12204
|
+
[vars$3.deletionTextColor]: dark.color2,
|
12205
|
+
[vars$3.deletionBgColor]: dark.color10,
|
12150
12206
|
},
|
12151
12207
|
};
|
12152
12208
|
|
@@ -12154,6 +12210,326 @@ var codeSnippet = /*#__PURE__*/Object.freeze({
|
|
12154
12210
|
__proto__: null,
|
12155
12211
|
codeSnippetDarkThemeOverrides: codeSnippetDarkThemeOverrides,
|
12156
12212
|
default: CodeSnippet,
|
12213
|
+
vars: vars$3
|
12214
|
+
});
|
12215
|
+
|
12216
|
+
const componentName$3 = getComponentName('radio-button');
|
12217
|
+
|
12218
|
+
const customMixin = (superclass) =>
|
12219
|
+
class CustomMixin extends superclass {
|
12220
|
+
constructor() {
|
12221
|
+
super();
|
12222
|
+
|
12223
|
+
this.baseElement.checkValidity = () => {};
|
12224
|
+
}
|
12225
|
+
|
12226
|
+
init() {
|
12227
|
+
// we are forwarding vaadin checked-changed event
|
12228
|
+
this.baseElement.addEventListener('checked-changed', (e) => {
|
12229
|
+
this.dispatchEvent(
|
12230
|
+
new CustomEvent(
|
12231
|
+
'checked-changed',
|
12232
|
+
{ detail: e.detail },
|
12233
|
+
{ bubbles: true, composed: true }
|
12234
|
+
)
|
12235
|
+
);
|
12236
|
+
});
|
12237
|
+
|
12238
|
+
super.init?.();
|
12239
|
+
|
12240
|
+
observeChildren(this, this.renderLabel.bind(this));
|
12241
|
+
}
|
12242
|
+
|
12243
|
+
renderLabel() {
|
12244
|
+
this.baseElement.setAttribute('label', this.textContent);
|
12245
|
+
}
|
12246
|
+
|
12247
|
+
get value() {
|
12248
|
+
return this.getAttribute('value');
|
12249
|
+
}
|
12250
|
+
};
|
12251
|
+
|
12252
|
+
const RadioButtonClass = compose(
|
12253
|
+
createStyleMixin({
|
12254
|
+
mappings: {
|
12255
|
+
cursor: [{}, { selector: 'label' }],
|
12256
|
+
fontSize: [{ selector: 'label' }, {}],
|
12257
|
+
labelTextColor: { selector: 'label', property: 'color' },
|
12258
|
+
fontFamily: { selector: 'label' },
|
12259
|
+
radioSize: [
|
12260
|
+
{ selector: '::part(radio)', property: 'height' },
|
12261
|
+
{ selector: '::part(radio)', property: 'width' },
|
12262
|
+
],
|
12263
|
+
radioBackgroundColor: { selector: '::part(radio)', property: 'background-color' },
|
12264
|
+
radioMargin: { selector: '::part(radio)', property: 'margin' },
|
12265
|
+
radioCheckedSize: { selector: '::part(radio)::after', property: 'border-width' },
|
12266
|
+
radioCheckedColor: { selector: '::part(radio)::after', property: 'border-color' },
|
12267
|
+
},
|
12268
|
+
}),
|
12269
|
+
composedProxyInputMixin({ proxyProps: ['setSelectionRange'] }),
|
12270
|
+
componentNameValidationMixin,
|
12271
|
+
customMixin
|
12272
|
+
)(
|
12273
|
+
createProxy({
|
12274
|
+
slots: [''],
|
12275
|
+
wrappedEleName: 'vaadin-radio-button',
|
12276
|
+
excludeAttrsSync: ['tabindex', 'data'],
|
12277
|
+
includeForwardProps: ['checked', 'name', 'disabled'],
|
12278
|
+
componentName: componentName$3,
|
12279
|
+
})
|
12280
|
+
);
|
12281
|
+
|
12282
|
+
const componentName$2 = getComponentName('radio-group');
|
12283
|
+
|
12284
|
+
const RadioGroupMixin = (superclass) =>
|
12285
|
+
class RadioGroupMixinClass extends superclass {
|
12286
|
+
// eslint-disable-next-line class-methods-use-this
|
12287
|
+
#renderItem = ({ value, label }) =>
|
12288
|
+
`<descope-radio-button value="${value}">${label}</descope-radio-button>`;
|
12289
|
+
|
12290
|
+
#data;
|
12291
|
+
|
12292
|
+
constructor() {
|
12293
|
+
super();
|
12294
|
+
|
12295
|
+
// we are overriding vaadin children getter so it will run on our custom elements
|
12296
|
+
Object.defineProperty(this.baseElement, 'children', {
|
12297
|
+
get: () => this.querySelectorAll(componentName$3),
|
12298
|
+
});
|
12299
|
+
|
12300
|
+
// we are overriding vaadin __filterRadioButtons so it will run on our custom elements
|
12301
|
+
this.baseElement.__filterRadioButtons = (nodes) => {
|
12302
|
+
return nodes.filter((node) => node.localName === componentName$3);
|
12303
|
+
};
|
12304
|
+
|
12305
|
+
// vaadin radio group missing some input properties
|
12306
|
+
this.baseElement.setCustomValidity = () => {};
|
12307
|
+
}
|
12308
|
+
|
12309
|
+
get items() {
|
12310
|
+
return this.shadowRoot.querySelector('slot').assignedElements();
|
12311
|
+
}
|
12312
|
+
|
12313
|
+
get size() {
|
12314
|
+
return this.getAttribute('size');
|
12315
|
+
}
|
12316
|
+
|
12317
|
+
get data() {
|
12318
|
+
if (this.#data) return this.#data;
|
12319
|
+
|
12320
|
+
const dataAttr = this.getAttribute('data');
|
12321
|
+
|
12322
|
+
if (dataAttr) {
|
12323
|
+
try {
|
12324
|
+
const data = JSON.parse(dataAttr);
|
12325
|
+
if (this.isValidDataType(data)) {
|
12326
|
+
return data;
|
12327
|
+
}
|
12328
|
+
} catch (e) {
|
12329
|
+
// eslint-disable-next-line no-console
|
12330
|
+
console.error('could not parse data string from attribute "data" - ', e.message);
|
12331
|
+
}
|
12332
|
+
}
|
12333
|
+
|
12334
|
+
return [];
|
12335
|
+
}
|
12336
|
+
|
12337
|
+
set data(data) {
|
12338
|
+
if (this.isValidDataType(data)) {
|
12339
|
+
this.#data = data;
|
12340
|
+
this.renderItems();
|
12341
|
+
}
|
12342
|
+
}
|
12343
|
+
|
12344
|
+
get defaultValue() {
|
12345
|
+
return this.getAttribute('default-value');
|
12346
|
+
}
|
12347
|
+
|
12348
|
+
// eslint-disable-next-line class-methods-use-this
|
12349
|
+
isValidDataType(data) {
|
12350
|
+
const isValid = Array.isArray(data);
|
12351
|
+
if (!isValid) {
|
12352
|
+
// eslint-disable-next-line no-console
|
12353
|
+
console.error('data must be an array, received:', data);
|
12354
|
+
}
|
12355
|
+
|
12356
|
+
return isValid;
|
12357
|
+
}
|
12358
|
+
|
12359
|
+
getItemsTemplate() {
|
12360
|
+
return this.data?.reduce?.((acc, item) => acc + (this.#renderItem?.(item || {}) || ''), '');
|
12361
|
+
}
|
12362
|
+
|
12363
|
+
renderItems() {
|
12364
|
+
const template = this.getItemsTemplate();
|
12365
|
+
if (template) this.innerHTML = template;
|
12366
|
+
}
|
12367
|
+
|
12368
|
+
init() {
|
12369
|
+
super.init?.();
|
12370
|
+
|
12371
|
+
this.inputElement = this.baseElement;
|
12372
|
+
|
12373
|
+
this.renderItems();
|
12374
|
+
|
12375
|
+
observeAttributes(this, this.renderItems.bind(this), { includeAttrs: ['data'] });
|
12376
|
+
|
12377
|
+
Object.defineProperty(this.baseElement, 'validity', {
|
12378
|
+
get: () => {
|
12379
|
+
return { valueMissing: !this.baseElement.checkValidity() };
|
12380
|
+
},
|
12381
|
+
});
|
12382
|
+
|
12383
|
+
forwardAttrs(this, this.baseElement, {
|
12384
|
+
includeAttrs: ['layout'],
|
12385
|
+
mapAttrs: { layout: 'theme' },
|
12386
|
+
});
|
12387
|
+
|
12388
|
+
setTimeout(() => {
|
12389
|
+
if (this.defaultValue) {
|
12390
|
+
this.value = this.defaultValue;
|
12391
|
+
}
|
12392
|
+
});
|
12393
|
+
|
12394
|
+
// we want new items to get the size
|
12395
|
+
observeChildren(this, ({ addedNodes }) => {
|
12396
|
+
addedNodes.forEach((node) => {
|
12397
|
+
node.setAttribute('size', this.size);
|
12398
|
+
});
|
12399
|
+
});
|
12400
|
+
|
12401
|
+
observeAttributes(
|
12402
|
+
this,
|
12403
|
+
() => {
|
12404
|
+
this.items.forEach((item) => {
|
12405
|
+
item.setAttribute('size', this.size);
|
12406
|
+
});
|
12407
|
+
},
|
12408
|
+
{
|
12409
|
+
includeAttrs: ['size'],
|
12410
|
+
}
|
12411
|
+
);
|
12412
|
+
}
|
12413
|
+
};
|
12414
|
+
|
12415
|
+
const RadioGroupClass = compose(
|
12416
|
+
createStyleMixin({
|
12417
|
+
mappings: {
|
12418
|
+
...textFieldMappings,
|
12419
|
+
buttonsSpacing: { selector: '::part(group-field)', property: 'justify-content' },
|
12420
|
+
buttonsRowGap: { selector: '::part(group-field)', property: 'row-gap' },
|
12421
|
+
buttonsColumnGap: { selector: '::part(group-field)', property: 'column-gap' },
|
12422
|
+
itemsLabelColor: {
|
12423
|
+
selector: () => `::slotted(${RadioButtonClass.componentName})`,
|
12424
|
+
property: RadioButtonClass.cssVarList.labelTextColor,
|
12425
|
+
},
|
12426
|
+
},
|
12427
|
+
}),
|
12428
|
+
draggableMixin,
|
12429
|
+
composedProxyInputMixin({ proxyProps: ['setSelectionRange'] }),
|
12430
|
+
componentNameValidationMixin,
|
12431
|
+
RadioGroupMixin
|
12432
|
+
)(
|
12433
|
+
createProxy({
|
12434
|
+
slots: ['', 'prefix'],
|
12435
|
+
wrappedEleName: 'vaadin-radio-group',
|
12436
|
+
style: () => `
|
12437
|
+
:host {
|
12438
|
+
display: inline-block;
|
12439
|
+
max-width: 100%;
|
12440
|
+
box-sizing: border-box;
|
12441
|
+
}
|
12442
|
+
|
12443
|
+
vaadin-radio-group {
|
12444
|
+
padding: 0;
|
12445
|
+
width: 100%;
|
12446
|
+
}
|
12447
|
+
|
12448
|
+
${resetInputLabelPosition('vaadin-radio-group')}
|
12449
|
+
`,
|
12450
|
+
|
12451
|
+
excludeAttrsSync: ['tabindex', 'size', 'data', 'direction'],
|
12452
|
+
componentName: componentName$2,
|
12453
|
+
includeForwardProps: ['value'],
|
12454
|
+
})
|
12455
|
+
);
|
12456
|
+
|
12457
|
+
const vars$2 = RadioGroupClass.cssVarList;
|
12458
|
+
const globalRefs$1 = getThemeRefs(globals);
|
12459
|
+
|
12460
|
+
const radioGroup = {
|
12461
|
+
[vars$2.buttonsRowGap]: '9px',
|
12462
|
+
[vars$2.hostWidth]: refs.width,
|
12463
|
+
[vars$2.hostDirection]: refs.direction,
|
12464
|
+
[vars$2.fontSize]: refs.fontSize,
|
12465
|
+
[vars$2.fontFamily]: refs.fontFamily,
|
12466
|
+
[vars$2.labelTextColor]: refs.labelTextColor,
|
12467
|
+
[vars$2.labelRequiredIndicator]: refs.requiredIndicator,
|
12468
|
+
[vars$2.errorMessageTextColor]: refs.errorMessageTextColor,
|
12469
|
+
[vars$2.helperTextColor]: refs.helperTextColor,
|
12470
|
+
[vars$2.itemsLabelColor]: globalRefs$1.colors.surface.contrast,
|
12471
|
+
|
12472
|
+
textAlign: {
|
12473
|
+
right: { [vars$2.inputTextAlign]: 'right' },
|
12474
|
+
left: { [vars$2.inputTextAlign]: 'left' },
|
12475
|
+
center: { [vars$2.inputTextAlign]: 'center' },
|
12476
|
+
},
|
12477
|
+
|
12478
|
+
_fullWidth: {
|
12479
|
+
[vars$2.buttonsSpacing]: 'space-between',
|
12480
|
+
},
|
12481
|
+
|
12482
|
+
_disabled: {
|
12483
|
+
[vars$2.itemsLabelColor]: globalRefs$1.colors.surface.light,
|
12484
|
+
},
|
12485
|
+
};
|
12486
|
+
|
12487
|
+
var radioGroup$1 = /*#__PURE__*/Object.freeze({
|
12488
|
+
__proto__: null,
|
12489
|
+
default: radioGroup,
|
12490
|
+
radioGroup: radioGroup,
|
12491
|
+
vars: vars$2
|
12492
|
+
});
|
12493
|
+
|
12494
|
+
const vars$1 = RadioButtonClass.cssVarList;
|
12495
|
+
const globalRefs = getThemeRefs(globals);
|
12496
|
+
|
12497
|
+
const radioButton = {
|
12498
|
+
[vars$1.fontFamily]: refs.fontFamily,
|
12499
|
+
[vars$1.radioSize]: 'calc(1em + 6px)',
|
12500
|
+
[vars$1.radioMargin]: 'auto 4px',
|
12501
|
+
[vars$1.radioCheckedSize]: `calc(var(${vars$1.radioSize})/5)`,
|
12502
|
+
[vars$1.radioCheckedColor]: globalRefs.colors.surface.light,
|
12503
|
+
[vars$1.radioBackgroundColor]: globalRefs.colors.surface.light,
|
12504
|
+
|
12505
|
+
_checked: {
|
12506
|
+
[vars$1.radioBackgroundColor]: globalRefs.colors.surface.contrast,
|
12507
|
+
},
|
12508
|
+
|
12509
|
+
_hover: {
|
12510
|
+
cursor: 'pointer',
|
12511
|
+
},
|
12512
|
+
|
12513
|
+
size: {
|
12514
|
+
xs: {
|
12515
|
+
[vars$1.fontSize]: '12px',
|
12516
|
+
},
|
12517
|
+
sm: {
|
12518
|
+
[vars$1.fontSize]: '14px',
|
12519
|
+
},
|
12520
|
+
md: {
|
12521
|
+
[vars$1.fontSize]: '16px',
|
12522
|
+
},
|
12523
|
+
lg: {
|
12524
|
+
[vars$1.fontSize]: '18px',
|
12525
|
+
},
|
12526
|
+
},
|
12527
|
+
};
|
12528
|
+
|
12529
|
+
var radioButton$1 = /*#__PURE__*/Object.freeze({
|
12530
|
+
__proto__: null,
|
12531
|
+
default: radioButton,
|
12532
|
+
radioButton: radioButton,
|
12157
12533
|
vars: vars$1
|
12158
12534
|
});
|
12159
12535
|
|
@@ -12200,6 +12576,8 @@ const components = {
|
|
12200
12576
|
policyValidation: policyValidation$1,
|
12201
12577
|
icon: icon$1,
|
12202
12578
|
codeSnippet,
|
12579
|
+
radioGroup: radioGroup$1,
|
12580
|
+
radioButton: radioButton$1,
|
12203
12581
|
};
|
12204
12582
|
|
12205
12583
|
const theme = Object.keys(components).reduce(
|
@@ -12212,7 +12590,7 @@ const vars = Object.keys(components).reduce(
|
|
12212
12590
|
);
|
12213
12591
|
|
12214
12592
|
const defaultTheme = { globals, components: theme };
|
12215
|
-
const themeVars = { globals: vars$
|
12593
|
+
const themeVars = { globals: vars$J, components: vars };
|
12216
12594
|
|
12217
12595
|
const colors = {
|
12218
12596
|
surface: {
|
@@ -12565,6 +12943,8 @@ exports.PasswordClass = PasswordClass;
|
|
12565
12943
|
exports.PhoneFieldClass = PhoneFieldClass;
|
12566
12944
|
exports.PhoneFieldInputBoxClass = PhoneFieldInputBoxClass;
|
12567
12945
|
exports.PolicyValidationClass = PolicyValidationClass;
|
12946
|
+
exports.RadioButtonClass = RadioButtonClass;
|
12947
|
+
exports.RadioGroupClass = RadioGroupClass;
|
12568
12948
|
exports.RecaptchaClass = RecaptchaClass;
|
12569
12949
|
exports.SamlGroupMappingsClass = SamlGroupMappingsClass;
|
12570
12950
|
exports.SwitchToggleClass = SwitchToggleClass;
|