@descope/web-components-ui 1.0.319 → 1.0.320
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/cjs/index.cjs.js +1334 -1010
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/index.esm.js +1390 -1064
- 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-passcode-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-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?.();
|
@@ -3596,7 +3596,7 @@ const PasswordClass = compose(
|
|
3596
3596
|
composedProxyInputMixin({ proxyProps: ['value', 'selectionStart'] }),
|
3597
3597
|
componentNameValidationMixin,
|
3598
3598
|
passwordDraggableMixin,
|
3599
|
-
customMixin$
|
3599
|
+
customMixin$9
|
3600
3600
|
)(
|
3601
3601
|
createProxy({
|
3602
3602
|
slots: ['', 'suffix'],
|
@@ -3653,46 +3653,46 @@ const PasswordClass = compose(
|
|
3653
3653
|
}
|
3654
3654
|
`,
|
3655
3655
|
excludeAttrsSync: ['tabindex'],
|
3656
|
-
componentName: componentName$
|
3656
|
+
componentName: componentName$O,
|
3657
3657
|
})
|
3658
3658
|
);
|
3659
3659
|
|
3660
|
-
const globalRefs$
|
3661
|
-
const vars$
|
3660
|
+
const globalRefs$p = getThemeRefs(globals);
|
3661
|
+
const vars$F = PasswordClass.cssVarList;
|
3662
3662
|
|
3663
3663
|
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$
|
3664
|
+
[vars$F.hostWidth]: refs.width,
|
3665
|
+
[vars$F.hostDirection]: refs.direction,
|
3666
|
+
[vars$F.fontSize]: refs.fontSize,
|
3667
|
+
[vars$F.fontFamily]: refs.fontFamily,
|
3668
|
+
[vars$F.labelTextColor]: refs.labelTextColor,
|
3669
|
+
[vars$F.errorMessageTextColor]: refs.errorMessageTextColor,
|
3670
|
+
[vars$F.inputHorizontalPadding]: refs.horizontalPadding,
|
3671
|
+
[vars$F.inputHeight]: refs.inputHeight,
|
3672
|
+
[vars$F.inputBackgroundColor]: refs.backgroundColor,
|
3673
|
+
[vars$F.labelRequiredIndicator]: refs.requiredIndicator,
|
3674
|
+
[vars$F.inputValueTextColor]: refs.valueTextColor,
|
3675
|
+
[vars$F.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
3676
|
+
[vars$F.inputBorderWidth]: refs.borderWidth,
|
3677
|
+
[vars$F.inputBorderStyle]: refs.borderStyle,
|
3678
|
+
[vars$F.inputBorderColor]: refs.borderColor,
|
3679
|
+
[vars$F.inputBorderRadius]: refs.borderRadius,
|
3680
|
+
[vars$F.inputOutlineWidth]: refs.outlineWidth,
|
3681
|
+
[vars$F.inputOutlineStyle]: refs.outlineStyle,
|
3682
|
+
[vars$F.inputOutlineColor]: refs.outlineColor,
|
3683
|
+
[vars$F.inputOutlineOffset]: refs.outlineOffset,
|
3684
|
+
[vars$F.revealButtonOffset]: globalRefs$p.spacing.md,
|
3685
|
+
[vars$F.revealButtonSize]: refs.toggleButtonSize,
|
3686
|
+
[vars$F.revealButtonColor]: refs.placeholderTextColor,
|
3687
3687
|
};
|
3688
3688
|
|
3689
3689
|
var password$1 = /*#__PURE__*/Object.freeze({
|
3690
3690
|
__proto__: null,
|
3691
3691
|
default: password,
|
3692
|
-
vars: vars$
|
3692
|
+
vars: vars$F
|
3693
3693
|
});
|
3694
3694
|
|
3695
|
-
const componentName$
|
3695
|
+
const componentName$N = getComponentName('number-field');
|
3696
3696
|
|
3697
3697
|
const NumberFieldClass = compose(
|
3698
3698
|
createStyleMixin({
|
@@ -3718,45 +3718,45 @@ const NumberFieldClass = compose(
|
|
3718
3718
|
${resetInputOverrides('vaadin-number-field', NumberFieldClass.cssVarList)}
|
3719
3719
|
`,
|
3720
3720
|
excludeAttrsSync: ['tabindex'],
|
3721
|
-
componentName: componentName$
|
3721
|
+
componentName: componentName$N,
|
3722
3722
|
})
|
3723
3723
|
);
|
3724
3724
|
|
3725
|
-
const vars$
|
3725
|
+
const vars$E = NumberFieldClass.cssVarList;
|
3726
3726
|
|
3727
3727
|
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$
|
3728
|
+
[vars$E.hostWidth]: refs.width,
|
3729
|
+
[vars$E.hostMinWidth]: refs.minWidth,
|
3730
|
+
[vars$E.hostDirection]: refs.direction,
|
3731
|
+
[vars$E.fontSize]: refs.fontSize,
|
3732
|
+
[vars$E.fontFamily]: refs.fontFamily,
|
3733
|
+
[vars$E.labelTextColor]: refs.labelTextColor,
|
3734
|
+
[vars$E.errorMessageTextColor]: refs.errorMessageTextColor,
|
3735
|
+
[vars$E.inputValueTextColor]: refs.valueTextColor,
|
3736
|
+
[vars$E.inputPlaceholderColor]: refs.placeholderTextColor,
|
3737
|
+
[vars$E.inputBorderWidth]: refs.borderWidth,
|
3738
|
+
[vars$E.inputBorderStyle]: refs.borderStyle,
|
3739
|
+
[vars$E.inputBorderColor]: refs.borderColor,
|
3740
|
+
[vars$E.inputBorderRadius]: refs.borderRadius,
|
3741
|
+
[vars$E.inputOutlineWidth]: refs.outlineWidth,
|
3742
|
+
[vars$E.inputOutlineStyle]: refs.outlineStyle,
|
3743
|
+
[vars$E.inputOutlineColor]: refs.outlineColor,
|
3744
|
+
[vars$E.inputOutlineOffset]: refs.outlineOffset,
|
3745
|
+
[vars$E.inputBackgroundColor]: refs.backgroundColor,
|
3746
|
+
[vars$E.labelRequiredIndicator]: refs.requiredIndicator,
|
3747
|
+
[vars$E.inputHorizontalPadding]: refs.horizontalPadding,
|
3748
|
+
[vars$E.inputHeight]: refs.inputHeight,
|
3749
3749
|
};
|
3750
3750
|
|
3751
3751
|
var numberField$1 = /*#__PURE__*/Object.freeze({
|
3752
3752
|
__proto__: null,
|
3753
3753
|
default: numberField,
|
3754
|
-
vars: vars$
|
3754
|
+
vars: vars$E
|
3755
3755
|
});
|
3756
3756
|
|
3757
|
-
const componentName$
|
3757
|
+
const componentName$M = getComponentName('email-field');
|
3758
3758
|
|
3759
|
-
const customMixin$
|
3759
|
+
const customMixin$8 = (superclass) =>
|
3760
3760
|
class EmailFieldMixinClass extends superclass {
|
3761
3761
|
init() {
|
3762
3762
|
super.init?.();
|
@@ -3770,7 +3770,7 @@ const EmailFieldClass = compose(
|
|
3770
3770
|
draggableMixin,
|
3771
3771
|
composedProxyInputMixin({ proxyProps: ['value', 'selectionStart'] }),
|
3772
3772
|
componentNameValidationMixin,
|
3773
|
-
customMixin$
|
3773
|
+
customMixin$8
|
3774
3774
|
)(
|
3775
3775
|
createProxy({
|
3776
3776
|
slots: ['', 'suffix'],
|
@@ -3789,43 +3789,43 @@ const EmailFieldClass = compose(
|
|
3789
3789
|
${resetInputOverrides('vaadin-email-field', EmailFieldClass.cssVarList)}
|
3790
3790
|
`,
|
3791
3791
|
excludeAttrsSync: ['tabindex'],
|
3792
|
-
componentName: componentName$
|
3792
|
+
componentName: componentName$M,
|
3793
3793
|
})
|
3794
3794
|
);
|
3795
3795
|
|
3796
|
-
const vars$
|
3796
|
+
const vars$D = EmailFieldClass.cssVarList;
|
3797
3797
|
|
3798
3798
|
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$
|
3799
|
+
[vars$D.hostWidth]: refs.width,
|
3800
|
+
[vars$D.hostMinWidth]: refs.minWidth,
|
3801
|
+
[vars$D.hostDirection]: refs.direction,
|
3802
|
+
[vars$D.fontSize]: refs.fontSize,
|
3803
|
+
[vars$D.fontFamily]: refs.fontFamily,
|
3804
|
+
[vars$D.labelTextColor]: refs.labelTextColor,
|
3805
|
+
[vars$D.errorMessageTextColor]: refs.errorMessageTextColor,
|
3806
|
+
[vars$D.inputValueTextColor]: refs.valueTextColor,
|
3807
|
+
[vars$D.labelRequiredIndicator]: refs.requiredIndicator,
|
3808
|
+
[vars$D.inputPlaceholderColor]: refs.placeholderTextColor,
|
3809
|
+
[vars$D.inputBorderWidth]: refs.borderWidth,
|
3810
|
+
[vars$D.inputBorderStyle]: refs.borderStyle,
|
3811
|
+
[vars$D.inputBorderColor]: refs.borderColor,
|
3812
|
+
[vars$D.inputBorderRadius]: refs.borderRadius,
|
3813
|
+
[vars$D.inputOutlineWidth]: refs.outlineWidth,
|
3814
|
+
[vars$D.inputOutlineStyle]: refs.outlineStyle,
|
3815
|
+
[vars$D.inputOutlineColor]: refs.outlineColor,
|
3816
|
+
[vars$D.inputOutlineOffset]: refs.outlineOffset,
|
3817
|
+
[vars$D.inputBackgroundColor]: refs.backgroundColor,
|
3818
|
+
[vars$D.inputHorizontalPadding]: refs.horizontalPadding,
|
3819
|
+
[vars$D.inputHeight]: refs.inputHeight,
|
3820
3820
|
};
|
3821
3821
|
|
3822
3822
|
var emailField$1 = /*#__PURE__*/Object.freeze({
|
3823
3823
|
__proto__: null,
|
3824
3824
|
default: emailField,
|
3825
|
-
vars: vars$
|
3825
|
+
vars: vars$D
|
3826
3826
|
});
|
3827
3827
|
|
3828
|
-
const componentName$
|
3828
|
+
const componentName$L = getComponentName('text-area');
|
3829
3829
|
|
3830
3830
|
const {
|
3831
3831
|
host: host$k,
|
@@ -3901,49 +3901,49 @@ const TextAreaClass = compose(
|
|
3901
3901
|
${resetInputCursor('vaadin-text-area')}
|
3902
3902
|
`,
|
3903
3903
|
excludeAttrsSync: ['tabindex'],
|
3904
|
-
componentName: componentName$
|
3904
|
+
componentName: componentName$L,
|
3905
3905
|
})
|
3906
3906
|
);
|
3907
3907
|
|
3908
|
-
const vars$
|
3908
|
+
const vars$C = TextAreaClass.cssVarList;
|
3909
3909
|
|
3910
3910
|
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$
|
3911
|
+
[vars$C.hostWidth]: refs.width,
|
3912
|
+
[vars$C.hostMinWidth]: refs.minWidth,
|
3913
|
+
[vars$C.hostDirection]: refs.direction,
|
3914
|
+
[vars$C.fontSize]: refs.fontSize,
|
3915
|
+
[vars$C.fontFamily]: refs.fontFamily,
|
3916
|
+
[vars$C.labelTextColor]: refs.labelTextColor,
|
3917
|
+
[vars$C.labelRequiredIndicator]: refs.requiredIndicator,
|
3918
|
+
[vars$C.errorMessageTextColor]: refs.errorMessageTextColor,
|
3919
|
+
[vars$C.inputBackgroundColor]: refs.backgroundColor,
|
3920
|
+
[vars$C.inputValueTextColor]: refs.valueTextColor,
|
3921
|
+
[vars$C.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
3922
|
+
[vars$C.inputBorderRadius]: refs.borderRadius,
|
3923
|
+
[vars$C.inputBorderWidth]: refs.borderWidth,
|
3924
|
+
[vars$C.inputBorderStyle]: refs.borderStyle,
|
3925
|
+
[vars$C.inputBorderColor]: refs.borderColor,
|
3926
|
+
[vars$C.inputOutlineWidth]: refs.outlineWidth,
|
3927
|
+
[vars$C.inputOutlineStyle]: refs.outlineStyle,
|
3928
|
+
[vars$C.inputOutlineColor]: refs.outlineColor,
|
3929
|
+
[vars$C.inputOutlineOffset]: refs.outlineOffset,
|
3930
|
+
[vars$C.inputResizeType]: 'vertical',
|
3931
|
+
[vars$C.inputMinHeight]: '5em',
|
3932
3932
|
textAlign: {
|
3933
|
-
right: { [vars$
|
3934
|
-
left: { [vars$
|
3935
|
-
center: { [vars$
|
3933
|
+
right: { [vars$C.inputTextAlign]: 'right' },
|
3934
|
+
left: { [vars$C.inputTextAlign]: 'left' },
|
3935
|
+
center: { [vars$C.inputTextAlign]: 'center' },
|
3936
3936
|
},
|
3937
3937
|
|
3938
3938
|
_readonly: {
|
3939
|
-
[vars$
|
3939
|
+
[vars$C.inputResizeType]: 'none',
|
3940
3940
|
},
|
3941
3941
|
};
|
3942
3942
|
|
3943
3943
|
var textArea$1 = /*#__PURE__*/Object.freeze({
|
3944
3944
|
__proto__: null,
|
3945
3945
|
default: textArea,
|
3946
|
-
vars: vars$
|
3946
|
+
vars: vars$C
|
3947
3947
|
});
|
3948
3948
|
|
3949
3949
|
const createBaseInputClass = (...args) =>
|
@@ -3954,9 +3954,9 @@ const createBaseInputClass = (...args) =>
|
|
3954
3954
|
inputEventsDispatchingMixin
|
3955
3955
|
)(createBaseClass(...args));
|
3956
3956
|
|
3957
|
-
const componentName$
|
3957
|
+
const componentName$K = getComponentName('boolean-field-internal');
|
3958
3958
|
|
3959
|
-
createBaseInputClass({ componentName: componentName$
|
3959
|
+
createBaseInputClass({ componentName: componentName$K, baseSelector: 'div' });
|
3960
3960
|
|
3961
3961
|
const booleanFieldMixin = (superclass) =>
|
3962
3962
|
class BooleanFieldMixinClass extends superclass {
|
@@ -3965,14 +3965,14 @@ const booleanFieldMixin = (superclass) =>
|
|
3965
3965
|
|
3966
3966
|
const template = document.createElement('template');
|
3967
3967
|
template.innerHTML = `
|
3968
|
-
<${componentName$
|
3968
|
+
<${componentName$K}
|
3969
3969
|
tabindex="-1"
|
3970
3970
|
slot="input"
|
3971
|
-
></${componentName$
|
3971
|
+
></${componentName$K}>
|
3972
3972
|
`;
|
3973
3973
|
|
3974
3974
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
3975
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
3975
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$K);
|
3976
3976
|
this.checkbox = this.inputElement.querySelector('vaadin-checkbox');
|
3977
3977
|
|
3978
3978
|
forwardAttrs(this, this.inputElement, {
|
@@ -4042,7 +4042,7 @@ descope-boolean-field-internal {
|
|
4042
4042
|
}
|
4043
4043
|
`;
|
4044
4044
|
|
4045
|
-
const componentName$
|
4045
|
+
const componentName$J = getComponentName('checkbox');
|
4046
4046
|
|
4047
4047
|
const {
|
4048
4048
|
host: host$j,
|
@@ -4148,51 +4148,51 @@ const CheckboxClass = compose(
|
|
4148
4148
|
}
|
4149
4149
|
`,
|
4150
4150
|
excludeAttrsSync: ['label', 'tabindex'],
|
4151
|
-
componentName: componentName$
|
4151
|
+
componentName: componentName$J,
|
4152
4152
|
})
|
4153
4153
|
);
|
4154
4154
|
|
4155
|
-
const vars$
|
4155
|
+
const vars$B = CheckboxClass.cssVarList;
|
4156
4156
|
const checkboxSize = '1.35em';
|
4157
4157
|
|
4158
4158
|
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$
|
4159
|
+
[vars$B.hostWidth]: refs.width,
|
4160
|
+
[vars$B.hostDirection]: refs.direction,
|
4161
|
+
[vars$B.fontSize]: refs.fontSize,
|
4162
|
+
[vars$B.fontFamily]: refs.fontFamily,
|
4163
|
+
[vars$B.labelTextColor]: refs.labelTextColor,
|
4164
|
+
[vars$B.labelRequiredIndicator]: refs.requiredIndicator,
|
4165
|
+
[vars$B.labelFontWeight]: '400',
|
4166
|
+
[vars$B.labelLineHeight]: checkboxSize,
|
4167
|
+
[vars$B.labelSpacing]: '1em',
|
4168
|
+
[vars$B.errorMessageTextColor]: refs.errorMessageTextColor,
|
4169
|
+
[vars$B.inputOutlineWidth]: refs.outlineWidth,
|
4170
|
+
[vars$B.inputOutlineOffset]: refs.outlineOffset,
|
4171
|
+
[vars$B.inputOutlineColor]: refs.outlineColor,
|
4172
|
+
[vars$B.inputOutlineStyle]: refs.outlineStyle,
|
4173
|
+
[vars$B.inputBorderRadius]: refs.borderRadius,
|
4174
|
+
[vars$B.inputBorderColor]: refs.borderColor,
|
4175
|
+
[vars$B.inputBorderWidth]: refs.borderWidth,
|
4176
|
+
[vars$B.inputBorderStyle]: refs.borderStyle,
|
4177
|
+
[vars$B.inputBackgroundColor]: refs.backgroundColor,
|
4178
|
+
[vars$B.inputSize]: checkboxSize,
|
4179
4179
|
|
4180
4180
|
_checked: {
|
4181
|
-
[vars$
|
4181
|
+
[vars$B.inputValueTextColor]: refs.valueTextColor,
|
4182
4182
|
},
|
4183
4183
|
|
4184
4184
|
_disabled: {
|
4185
|
-
[vars$
|
4185
|
+
[vars$B.labelTextColor]: refs.labelTextColor,
|
4186
4186
|
},
|
4187
4187
|
};
|
4188
4188
|
|
4189
4189
|
var checkbox$1 = /*#__PURE__*/Object.freeze({
|
4190
4190
|
__proto__: null,
|
4191
4191
|
default: checkbox,
|
4192
|
-
vars: vars$
|
4192
|
+
vars: vars$B
|
4193
4193
|
});
|
4194
4194
|
|
4195
|
-
const componentName$
|
4195
|
+
const componentName$I = getComponentName('switch-toggle');
|
4196
4196
|
|
4197
4197
|
const {
|
4198
4198
|
host: host$i,
|
@@ -4324,82 +4324,82 @@ const SwitchToggleClass = compose(
|
|
4324
4324
|
}
|
4325
4325
|
`,
|
4326
4326
|
excludeAttrsSync: ['label', 'tabindex'],
|
4327
|
-
componentName: componentName$
|
4327
|
+
componentName: componentName$I,
|
4328
4328
|
})
|
4329
4329
|
);
|
4330
4330
|
|
4331
4331
|
const knobMargin = '2px';
|
4332
4332
|
const checkboxHeight = '1.25em';
|
4333
4333
|
|
4334
|
-
const globalRefs$
|
4335
|
-
const vars$
|
4334
|
+
const globalRefs$o = getThemeRefs(globals);
|
4335
|
+
const vars$A = SwitchToggleClass.cssVarList;
|
4336
4336
|
|
4337
4337
|
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$
|
4338
|
+
[vars$A.hostWidth]: refs.width,
|
4339
|
+
[vars$A.hostDirection]: refs.direction,
|
4340
|
+
[vars$A.fontSize]: refs.fontSize,
|
4341
|
+
[vars$A.fontFamily]: refs.fontFamily,
|
4342
|
+
|
4343
|
+
[vars$A.inputOutlineWidth]: refs.outlineWidth,
|
4344
|
+
[vars$A.inputOutlineOffset]: refs.outlineOffset,
|
4345
|
+
[vars$A.inputOutlineColor]: refs.outlineColor,
|
4346
|
+
[vars$A.inputOutlineStyle]: refs.outlineStyle,
|
4347
|
+
|
4348
|
+
[vars$A.trackBorderStyle]: refs.borderStyle,
|
4349
|
+
[vars$A.trackBorderWidth]: refs.borderWidth, // var `trackBorderWidth` used outside the theme for `left` margin calculation
|
4350
|
+
[vars$A.trackBorderColor]: refs.borderColor,
|
4351
|
+
[vars$A.trackBackgroundColor]: refs.backgroundColor,
|
4352
|
+
[vars$A.trackBorderRadius]: globalRefs$o.radius.md,
|
4353
|
+
[vars$A.trackWidth]: '2.5em', // var `trackWidth` used outside the theme for `left` margin calculation
|
4354
|
+
[vars$A.trackHeight]: checkboxHeight,
|
4355
|
+
|
4356
|
+
[vars$A.knobSize]: `calc(1em - ${knobMargin})`,
|
4357
|
+
[vars$A.knobRadius]: '50%',
|
4358
|
+
[vars$A.knobTopOffset]: '1px',
|
4359
|
+
[vars$A.knobLeftOffset]: knobMargin,
|
4360
|
+
[vars$A.knobColor]: refs.labelTextColor,
|
4361
|
+
[vars$A.knobTransitionDuration]: '0.3s',
|
4362
|
+
|
4363
|
+
[vars$A.labelTextColor]: refs.labelTextColor,
|
4364
|
+
[vars$A.labelFontWeight]: '400',
|
4365
|
+
[vars$A.labelLineHeight]: '1.35em',
|
4366
|
+
[vars$A.labelSpacing]: '1em',
|
4367
|
+
[vars$A.labelRequiredIndicator]: refs.requiredIndicator,
|
4368
|
+
[vars$A.errorMessageTextColor]: refs.errorMessageTextColor,
|
4369
4369
|
|
4370
4370
|
_checked: {
|
4371
|
-
[vars$
|
4372
|
-
[vars$
|
4373
|
-
[vars$
|
4374
|
-
[vars$
|
4371
|
+
[vars$A.trackBorderColor]: refs.borderColor,
|
4372
|
+
[vars$A.knobLeftOffset]: `calc(100% - var(${vars$A.knobSize}) - ${knobMargin})`,
|
4373
|
+
[vars$A.knobColor]: refs.valueTextColor,
|
4374
|
+
[vars$A.knobTextColor]: refs.valueTextColor,
|
4375
4375
|
},
|
4376
4376
|
|
4377
4377
|
_disabled: {
|
4378
|
-
[vars$
|
4379
|
-
[vars$
|
4380
|
-
[vars$
|
4381
|
-
[vars$
|
4378
|
+
[vars$A.knobColor]: globalRefs$o.colors.surface.light,
|
4379
|
+
[vars$A.trackBorderColor]: globalRefs$o.colors.surface.light,
|
4380
|
+
[vars$A.trackBackgroundColor]: globalRefs$o.colors.surface.main,
|
4381
|
+
[vars$A.labelTextColor]: refs.labelTextColor,
|
4382
4382
|
_checked: {
|
4383
|
-
[vars$
|
4384
|
-
[vars$
|
4383
|
+
[vars$A.knobColor]: globalRefs$o.colors.surface.light,
|
4384
|
+
[vars$A.trackBackgroundColor]: globalRefs$o.colors.surface.main,
|
4385
4385
|
},
|
4386
4386
|
},
|
4387
4387
|
|
4388
4388
|
_invalid: {
|
4389
|
-
[vars$
|
4390
|
-
[vars$
|
4389
|
+
[vars$A.trackBorderColor]: globalRefs$o.colors.error.main,
|
4390
|
+
[vars$A.knobColor]: globalRefs$o.colors.error.main,
|
4391
4391
|
},
|
4392
4392
|
};
|
4393
4393
|
|
4394
4394
|
var switchToggle$1 = /*#__PURE__*/Object.freeze({
|
4395
4395
|
__proto__: null,
|
4396
4396
|
default: switchToggle,
|
4397
|
-
vars: vars$
|
4397
|
+
vars: vars$A
|
4398
4398
|
});
|
4399
4399
|
|
4400
|
-
const componentName$
|
4400
|
+
const componentName$H = getComponentName('container');
|
4401
4401
|
|
4402
|
-
class RawContainer extends createBaseClass({ componentName: componentName$
|
4402
|
+
class RawContainer extends createBaseClass({ componentName: componentName$H, baseSelector: 'slot' }) {
|
4403
4403
|
constructor() {
|
4404
4404
|
super();
|
4405
4405
|
|
@@ -4452,7 +4452,7 @@ const ContainerClass = compose(
|
|
4452
4452
|
componentNameValidationMixin
|
4453
4453
|
)(RawContainer);
|
4454
4454
|
|
4455
|
-
const globalRefs$
|
4455
|
+
const globalRefs$n = getThemeRefs(globals);
|
4456
4456
|
|
4457
4457
|
const compVars$4 = ContainerClass.cssVarList;
|
4458
4458
|
|
@@ -4474,7 +4474,7 @@ const [helperTheme$2, helperRefs$2, helperVars$2] = createHelperVars(
|
|
4474
4474
|
horizontalAlignment,
|
4475
4475
|
shadowColor: '#00000020', // if we want to support transparency vars, we should use different color format
|
4476
4476
|
},
|
4477
|
-
componentName$
|
4477
|
+
componentName$H
|
4478
4478
|
);
|
4479
4479
|
|
4480
4480
|
const { shadowColor: shadowColor$1 } = helperRefs$2;
|
@@ -4484,10 +4484,10 @@ const container = {
|
|
4484
4484
|
|
4485
4485
|
[compVars$4.hostWidth]: '100%',
|
4486
4486
|
[compVars$4.boxShadow]: 'none',
|
4487
|
-
[compVars$4.backgroundColor]: globalRefs$
|
4488
|
-
[compVars$4.color]: globalRefs$
|
4487
|
+
[compVars$4.backgroundColor]: globalRefs$n.colors.surface.main,
|
4488
|
+
[compVars$4.color]: globalRefs$n.colors.surface.contrast,
|
4489
4489
|
[compVars$4.borderRadius]: '0px',
|
4490
|
-
[compVars$4.hostDirection]: globalRefs$
|
4490
|
+
[compVars$4.hostDirection]: globalRefs$n.direction,
|
4491
4491
|
|
4492
4492
|
verticalPadding: {
|
4493
4493
|
sm: { [compVars$4.verticalPadding]: '5px' },
|
@@ -4533,34 +4533,34 @@ const container = {
|
|
4533
4533
|
|
4534
4534
|
shadow: {
|
4535
4535
|
sm: {
|
4536
|
-
[compVars$4.boxShadow]: `${globalRefs$
|
4536
|
+
[compVars$4.boxShadow]: `${globalRefs$n.shadow.wide.sm} ${shadowColor$1}, ${globalRefs$n.shadow.narrow.sm} ${shadowColor$1}`,
|
4537
4537
|
},
|
4538
4538
|
md: {
|
4539
|
-
[compVars$4.boxShadow]: `${globalRefs$
|
4539
|
+
[compVars$4.boxShadow]: `${globalRefs$n.shadow.wide.md} ${shadowColor$1}, ${globalRefs$n.shadow.narrow.md} ${shadowColor$1}`,
|
4540
4540
|
},
|
4541
4541
|
lg: {
|
4542
|
-
[compVars$4.boxShadow]: `${globalRefs$
|
4542
|
+
[compVars$4.boxShadow]: `${globalRefs$n.shadow.wide.lg} ${shadowColor$1}, ${globalRefs$n.shadow.narrow.lg} ${shadowColor$1}`,
|
4543
4543
|
},
|
4544
4544
|
xl: {
|
4545
|
-
[compVars$4.boxShadow]: `${globalRefs$
|
4545
|
+
[compVars$4.boxShadow]: `${globalRefs$n.shadow.wide.xl} ${shadowColor$1}, ${globalRefs$n.shadow.narrow.xl} ${shadowColor$1}`,
|
4546
4546
|
},
|
4547
4547
|
'2xl': {
|
4548
4548
|
[helperVars$2.shadowColor]: '#00000050', // mimic daisyUI shadow settings
|
4549
|
-
[compVars$4.boxShadow]: `${globalRefs$
|
4549
|
+
[compVars$4.boxShadow]: `${globalRefs$n.shadow.wide['2xl']} ${shadowColor$1}`,
|
4550
4550
|
},
|
4551
4551
|
},
|
4552
4552
|
|
4553
4553
|
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$
|
4554
|
+
sm: { [compVars$4.borderRadius]: globalRefs$n.radius.sm },
|
4555
|
+
md: { [compVars$4.borderRadius]: globalRefs$n.radius.md },
|
4556
|
+
lg: { [compVars$4.borderRadius]: globalRefs$n.radius.lg },
|
4557
|
+
xl: { [compVars$4.borderRadius]: globalRefs$n.radius.xl },
|
4558
|
+
'2xl': { [compVars$4.borderRadius]: globalRefs$n.radius['2xl'] },
|
4559
|
+
'3xl': { [compVars$4.borderRadius]: globalRefs$n.radius['3xl'] },
|
4560
4560
|
},
|
4561
4561
|
};
|
4562
4562
|
|
4563
|
-
const vars$
|
4563
|
+
const vars$z = {
|
4564
4564
|
...compVars$4,
|
4565
4565
|
...helperVars$2,
|
4566
4566
|
};
|
@@ -4568,7 +4568,7 @@ const vars$x = {
|
|
4568
4568
|
var container$1 = /*#__PURE__*/Object.freeze({
|
4569
4569
|
__proto__: null,
|
4570
4570
|
default: container,
|
4571
|
-
vars: vars$
|
4571
|
+
vars: vars$z
|
4572
4572
|
});
|
4573
4573
|
|
4574
4574
|
const createCssVarImageClass = ({ componentName, varName, fallbackVarName }) => {
|
@@ -4621,69 +4621,69 @@ const createCssVarImageClass = ({ componentName, varName, fallbackVarName }) =>
|
|
4621
4621
|
return CssVarImageClass;
|
4622
4622
|
};
|
4623
4623
|
|
4624
|
-
const componentName$
|
4624
|
+
const componentName$G = getComponentName('logo');
|
4625
4625
|
|
4626
4626
|
const LogoClass = createCssVarImageClass({
|
4627
|
-
componentName: componentName$
|
4627
|
+
componentName: componentName$G,
|
4628
4628
|
varName: 'url',
|
4629
4629
|
fallbackVarName: 'fallbackUrl',
|
4630
4630
|
});
|
4631
4631
|
|
4632
|
-
const vars$
|
4632
|
+
const vars$y = LogoClass.cssVarList;
|
4633
4633
|
|
4634
4634
|
const logo$2 = {
|
4635
|
-
[vars$
|
4635
|
+
[vars$y.fallbackUrl]: 'url(https://imgs.descope.com/components/no-logo-placeholder.svg)',
|
4636
4636
|
};
|
4637
4637
|
|
4638
4638
|
var logo$3 = /*#__PURE__*/Object.freeze({
|
4639
4639
|
__proto__: null,
|
4640
4640
|
default: logo$2,
|
4641
|
-
vars: vars$
|
4641
|
+
vars: vars$y
|
4642
4642
|
});
|
4643
4643
|
|
4644
|
-
const componentName$
|
4644
|
+
const componentName$F = getComponentName('totp-image');
|
4645
4645
|
|
4646
4646
|
const TotpImageClass = createCssVarImageClass({
|
4647
|
-
componentName: componentName$
|
4647
|
+
componentName: componentName$F,
|
4648
4648
|
varName: 'url',
|
4649
4649
|
fallbackVarName: 'fallbackUrl',
|
4650
4650
|
});
|
4651
4651
|
|
4652
|
-
const vars$
|
4652
|
+
const vars$x = TotpImageClass.cssVarList;
|
4653
4653
|
|
4654
4654
|
const logo$1 = {
|
4655
|
-
[vars$
|
4655
|
+
[vars$x.fallbackUrl]: 'url(https://imgs.descope.com/components/totp-placeholder.svg)',
|
4656
4656
|
};
|
4657
4657
|
|
4658
4658
|
var totpImage = /*#__PURE__*/Object.freeze({
|
4659
4659
|
__proto__: null,
|
4660
4660
|
default: logo$1,
|
4661
|
-
vars: vars$
|
4661
|
+
vars: vars$x
|
4662
4662
|
});
|
4663
4663
|
|
4664
|
-
const componentName$
|
4664
|
+
const componentName$E = getComponentName('notp-image');
|
4665
4665
|
|
4666
4666
|
const NotpImageClass = createCssVarImageClass({
|
4667
|
-
componentName: componentName$
|
4667
|
+
componentName: componentName$E,
|
4668
4668
|
varName: 'url',
|
4669
4669
|
fallbackVarName: 'fallbackUrl',
|
4670
4670
|
});
|
4671
4671
|
|
4672
|
-
const vars$
|
4672
|
+
const vars$w = NotpImageClass.cssVarList;
|
4673
4673
|
|
4674
4674
|
const logo = {
|
4675
|
-
[vars$
|
4675
|
+
[vars$w.fallbackUrl]: 'url(https://imgs.descope.com/components/notp-placeholder.svg)',
|
4676
4676
|
};
|
4677
4677
|
|
4678
4678
|
var notpImage = /*#__PURE__*/Object.freeze({
|
4679
4679
|
__proto__: null,
|
4680
4680
|
default: logo,
|
4681
|
-
vars: vars$
|
4681
|
+
vars: vars$w
|
4682
4682
|
});
|
4683
4683
|
|
4684
|
-
const componentName$
|
4684
|
+
const componentName$D = getComponentName('text');
|
4685
4685
|
|
4686
|
-
class RawText extends createBaseClass({ componentName: componentName$
|
4686
|
+
class RawText extends createBaseClass({ componentName: componentName$D, baseSelector: ':host > slot' }) {
|
4687
4687
|
constructor() {
|
4688
4688
|
super();
|
4689
4689
|
|
@@ -4740,94 +4740,94 @@ const TextClass = compose(
|
|
4740
4740
|
componentNameValidationMixin
|
4741
4741
|
)(RawText);
|
4742
4742
|
|
4743
|
-
const globalRefs$
|
4744
|
-
const vars$
|
4743
|
+
const globalRefs$m = getThemeRefs(globals);
|
4744
|
+
const vars$v = TextClass.cssVarList;
|
4745
4745
|
|
4746
4746
|
const text$2 = {
|
4747
|
-
[vars$
|
4748
|
-
[vars$
|
4749
|
-
[vars$
|
4750
|
-
[vars$
|
4747
|
+
[vars$v.hostDirection]: globalRefs$m.direction,
|
4748
|
+
[vars$v.textLineHeight]: '1.35em',
|
4749
|
+
[vars$v.textAlign]: 'left',
|
4750
|
+
[vars$v.textColor]: globalRefs$m.colors.surface.dark,
|
4751
4751
|
variant: {
|
4752
4752
|
h1: {
|
4753
|
-
[vars$
|
4754
|
-
[vars$
|
4755
|
-
[vars$
|
4753
|
+
[vars$v.fontSize]: globalRefs$m.typography.h1.size,
|
4754
|
+
[vars$v.fontWeight]: globalRefs$m.typography.h1.weight,
|
4755
|
+
[vars$v.fontFamily]: globalRefs$m.typography.h1.font,
|
4756
4756
|
},
|
4757
4757
|
h2: {
|
4758
|
-
[vars$
|
4759
|
-
[vars$
|
4760
|
-
[vars$
|
4758
|
+
[vars$v.fontSize]: globalRefs$m.typography.h2.size,
|
4759
|
+
[vars$v.fontWeight]: globalRefs$m.typography.h2.weight,
|
4760
|
+
[vars$v.fontFamily]: globalRefs$m.typography.h2.font,
|
4761
4761
|
},
|
4762
4762
|
h3: {
|
4763
|
-
[vars$
|
4764
|
-
[vars$
|
4765
|
-
[vars$
|
4763
|
+
[vars$v.fontSize]: globalRefs$m.typography.h3.size,
|
4764
|
+
[vars$v.fontWeight]: globalRefs$m.typography.h3.weight,
|
4765
|
+
[vars$v.fontFamily]: globalRefs$m.typography.h3.font,
|
4766
4766
|
},
|
4767
4767
|
subtitle1: {
|
4768
|
-
[vars$
|
4769
|
-
[vars$
|
4770
|
-
[vars$
|
4768
|
+
[vars$v.fontSize]: globalRefs$m.typography.subtitle1.size,
|
4769
|
+
[vars$v.fontWeight]: globalRefs$m.typography.subtitle1.weight,
|
4770
|
+
[vars$v.fontFamily]: globalRefs$m.typography.subtitle1.font,
|
4771
4771
|
},
|
4772
4772
|
subtitle2: {
|
4773
|
-
[vars$
|
4774
|
-
[vars$
|
4775
|
-
[vars$
|
4773
|
+
[vars$v.fontSize]: globalRefs$m.typography.subtitle2.size,
|
4774
|
+
[vars$v.fontWeight]: globalRefs$m.typography.subtitle2.weight,
|
4775
|
+
[vars$v.fontFamily]: globalRefs$m.typography.subtitle2.font,
|
4776
4776
|
},
|
4777
4777
|
body1: {
|
4778
|
-
[vars$
|
4779
|
-
[vars$
|
4780
|
-
[vars$
|
4778
|
+
[vars$v.fontSize]: globalRefs$m.typography.body1.size,
|
4779
|
+
[vars$v.fontWeight]: globalRefs$m.typography.body1.weight,
|
4780
|
+
[vars$v.fontFamily]: globalRefs$m.typography.body1.font,
|
4781
4781
|
},
|
4782
4782
|
body2: {
|
4783
|
-
[vars$
|
4784
|
-
[vars$
|
4785
|
-
[vars$
|
4783
|
+
[vars$v.fontSize]: globalRefs$m.typography.body2.size,
|
4784
|
+
[vars$v.fontWeight]: globalRefs$m.typography.body2.weight,
|
4785
|
+
[vars$v.fontFamily]: globalRefs$m.typography.body2.font,
|
4786
4786
|
},
|
4787
4787
|
},
|
4788
4788
|
|
4789
4789
|
mode: {
|
4790
4790
|
primary: {
|
4791
|
-
[vars$
|
4791
|
+
[vars$v.textColor]: globalRefs$m.colors.surface.contrast,
|
4792
4792
|
},
|
4793
4793
|
secondary: {
|
4794
|
-
[vars$
|
4794
|
+
[vars$v.textColor]: globalRefs$m.colors.surface.dark,
|
4795
4795
|
},
|
4796
4796
|
error: {
|
4797
|
-
[vars$
|
4797
|
+
[vars$v.textColor]: globalRefs$m.colors.error.main,
|
4798
4798
|
},
|
4799
4799
|
success: {
|
4800
|
-
[vars$
|
4800
|
+
[vars$v.textColor]: globalRefs$m.colors.success.main,
|
4801
4801
|
},
|
4802
4802
|
},
|
4803
4803
|
|
4804
4804
|
textAlign: {
|
4805
|
-
right: { [vars$
|
4806
|
-
left: { [vars$
|
4807
|
-
center: { [vars$
|
4805
|
+
right: { [vars$v.textAlign]: 'right' },
|
4806
|
+
left: { [vars$v.textAlign]: 'left' },
|
4807
|
+
center: { [vars$v.textAlign]: 'center' },
|
4808
4808
|
},
|
4809
4809
|
|
4810
4810
|
_fullWidth: {
|
4811
|
-
[vars$
|
4811
|
+
[vars$v.hostWidth]: '100%',
|
4812
4812
|
},
|
4813
4813
|
|
4814
4814
|
_italic: {
|
4815
|
-
[vars$
|
4815
|
+
[vars$v.fontStyle]: 'italic',
|
4816
4816
|
},
|
4817
4817
|
|
4818
4818
|
_uppercase: {
|
4819
|
-
[vars$
|
4819
|
+
[vars$v.textTransform]: 'uppercase',
|
4820
4820
|
},
|
4821
4821
|
|
4822
4822
|
_lowercase: {
|
4823
|
-
[vars$
|
4823
|
+
[vars$v.textTransform]: 'lowercase',
|
4824
4824
|
},
|
4825
4825
|
};
|
4826
4826
|
|
4827
4827
|
var text$3 = /*#__PURE__*/Object.freeze({
|
4828
4828
|
__proto__: null,
|
4829
4829
|
default: text$2,
|
4830
|
-
vars: vars$
|
4830
|
+
vars: vars$v
|
4831
4831
|
});
|
4832
4832
|
|
4833
4833
|
const textRuleSet = {
|
@@ -4844,9 +4844,9 @@ const textRuleSet = {
|
|
4844
4844
|
},
|
4845
4845
|
};
|
4846
4846
|
|
4847
|
-
const componentName$
|
4847
|
+
const componentName$C = getComponentName('enriched-text');
|
4848
4848
|
|
4849
|
-
let EnrichedText$2 = class EnrichedText extends createBaseClass({ componentName: componentName$
|
4849
|
+
let EnrichedText$2 = class EnrichedText extends createBaseClass({ componentName: componentName$C, baseSelector: ':host > div' }) {
|
4850
4850
|
#origLinkRenderer;
|
4851
4851
|
|
4852
4852
|
constructor() {
|
@@ -5007,9 +5007,9 @@ const EnrichedTextClass = compose(
|
|
5007
5007
|
componentNameValidationMixin
|
5008
5008
|
)(EnrichedText$2);
|
5009
5009
|
|
5010
|
-
const componentName$
|
5010
|
+
const componentName$B = getComponentName('link');
|
5011
5011
|
|
5012
|
-
class RawLink extends createBaseClass({ componentName: componentName$
|
5012
|
+
class RawLink extends createBaseClass({ componentName: componentName$B, baseSelector: ':host a' }) {
|
5013
5013
|
constructor() {
|
5014
5014
|
super();
|
5015
5015
|
|
@@ -5075,120 +5075,120 @@ const LinkClass = compose(
|
|
5075
5075
|
componentNameValidationMixin
|
5076
5076
|
)(RawLink);
|
5077
5077
|
|
5078
|
-
const globalRefs$
|
5079
|
-
const vars$
|
5078
|
+
const globalRefs$l = getThemeRefs(globals);
|
5079
|
+
const vars$u = EnrichedTextClass.cssVarList;
|
5080
5080
|
|
5081
5081
|
const EnrichedText = {
|
5082
|
-
[vars$
|
5082
|
+
[vars$u.hostDirection]: globalRefs$l.direction,
|
5083
5083
|
|
5084
|
-
[vars$
|
5085
|
-
[vars$
|
5086
|
-
[vars$
|
5084
|
+
[vars$u.fontSize]: globalRefs$l.typography.body1.size,
|
5085
|
+
[vars$u.fontWeight]: globalRefs$l.typography.body1.weight,
|
5086
|
+
[vars$u.fontFamily]: globalRefs$l.typography.body1.font,
|
5087
5087
|
|
5088
|
-
[vars$
|
5089
|
-
[vars$
|
5090
|
-
[vars$
|
5088
|
+
[vars$u.textLineHeight]: '1.35em',
|
5089
|
+
[vars$u.textAlign]: 'left',
|
5090
|
+
[vars$u.textColor]: globalRefs$l.colors.surface.dark,
|
5091
5091
|
|
5092
|
-
[vars$
|
5092
|
+
[vars$u.linkColor]: `var(${LinkClass.cssVarList.textColor})`,
|
5093
5093
|
|
5094
5094
|
mode: {
|
5095
5095
|
primary: {
|
5096
|
-
[vars$
|
5096
|
+
[vars$u.textColor]: globalRefs$l.colors.surface.contrast,
|
5097
5097
|
},
|
5098
5098
|
secondary: {
|
5099
|
-
[vars$
|
5099
|
+
[vars$u.textColor]: globalRefs$l.colors.surface.dark,
|
5100
5100
|
},
|
5101
5101
|
error: {
|
5102
|
-
[vars$
|
5102
|
+
[vars$u.textColor]: globalRefs$l.colors.error.main,
|
5103
5103
|
},
|
5104
5104
|
success: {
|
5105
|
-
[vars$
|
5105
|
+
[vars$u.textColor]: globalRefs$l.colors.success.main,
|
5106
5106
|
},
|
5107
5107
|
},
|
5108
5108
|
|
5109
5109
|
variant: {
|
5110
5110
|
h1: {
|
5111
|
-
[vars$
|
5112
|
-
[vars$
|
5113
|
-
[vars$
|
5111
|
+
[vars$u.fontSize]: globalRefs$l.typography.h1.size,
|
5112
|
+
[vars$u.fontWeight]: globalRefs$l.typography.h1.weight,
|
5113
|
+
[vars$u.fontFamily]: globalRefs$l.typography.h1.font,
|
5114
5114
|
},
|
5115
5115
|
h2: {
|
5116
|
-
[vars$
|
5117
|
-
[vars$
|
5118
|
-
[vars$
|
5116
|
+
[vars$u.fontSize]: globalRefs$l.typography.h2.size,
|
5117
|
+
[vars$u.fontWeight]: globalRefs$l.typography.h2.weight,
|
5118
|
+
[vars$u.fontFamily]: globalRefs$l.typography.h2.font,
|
5119
5119
|
},
|
5120
5120
|
h3: {
|
5121
|
-
[vars$
|
5122
|
-
[vars$
|
5123
|
-
[vars$
|
5121
|
+
[vars$u.fontSize]: globalRefs$l.typography.h3.size,
|
5122
|
+
[vars$u.fontWeight]: globalRefs$l.typography.h3.weight,
|
5123
|
+
[vars$u.fontFamily]: globalRefs$l.typography.h3.font,
|
5124
5124
|
},
|
5125
5125
|
subtitle1: {
|
5126
|
-
[vars$
|
5127
|
-
[vars$
|
5128
|
-
[vars$
|
5126
|
+
[vars$u.fontSize]: globalRefs$l.typography.subtitle1.size,
|
5127
|
+
[vars$u.fontWeight]: globalRefs$l.typography.subtitle1.weight,
|
5128
|
+
[vars$u.fontFamily]: globalRefs$l.typography.subtitle1.font,
|
5129
5129
|
},
|
5130
5130
|
subtitle2: {
|
5131
|
-
[vars$
|
5132
|
-
[vars$
|
5133
|
-
[vars$
|
5131
|
+
[vars$u.fontSize]: globalRefs$l.typography.subtitle2.size,
|
5132
|
+
[vars$u.fontWeight]: globalRefs$l.typography.subtitle2.weight,
|
5133
|
+
[vars$u.fontFamily]: globalRefs$l.typography.subtitle2.font,
|
5134
5134
|
},
|
5135
5135
|
body1: {
|
5136
|
-
[vars$
|
5137
|
-
[vars$
|
5138
|
-
[vars$
|
5136
|
+
[vars$u.fontSize]: globalRefs$l.typography.body1.size,
|
5137
|
+
[vars$u.fontWeight]: globalRefs$l.typography.body1.weight,
|
5138
|
+
[vars$u.fontFamily]: globalRefs$l.typography.body1.font,
|
5139
5139
|
},
|
5140
5140
|
body2: {
|
5141
|
-
[vars$
|
5142
|
-
[vars$
|
5143
|
-
[vars$
|
5141
|
+
[vars$u.fontSize]: globalRefs$l.typography.body2.size,
|
5142
|
+
[vars$u.fontWeight]: globalRefs$l.typography.body2.weight,
|
5143
|
+
[vars$u.fontFamily]: globalRefs$l.typography.body2.font,
|
5144
5144
|
},
|
5145
5145
|
},
|
5146
5146
|
|
5147
5147
|
textAlign: {
|
5148
|
-
right: { [vars$
|
5149
|
-
left: { [vars$
|
5150
|
-
center: { [vars$
|
5148
|
+
right: { [vars$u.textAlign]: 'right' },
|
5149
|
+
left: { [vars$u.textAlign]: 'left' },
|
5150
|
+
center: { [vars$u.textAlign]: 'center' },
|
5151
5151
|
},
|
5152
5152
|
|
5153
5153
|
_fullWidth: {
|
5154
|
-
[vars$
|
5154
|
+
[vars$u.hostWidth]: '100%',
|
5155
5155
|
},
|
5156
5156
|
};
|
5157
5157
|
|
5158
5158
|
var EnrichedText$1 = /*#__PURE__*/Object.freeze({
|
5159
5159
|
__proto__: null,
|
5160
5160
|
default: EnrichedText,
|
5161
|
-
vars: vars$
|
5161
|
+
vars: vars$u
|
5162
5162
|
});
|
5163
5163
|
|
5164
|
-
const globalRefs$
|
5165
|
-
const vars$
|
5164
|
+
const globalRefs$k = getThemeRefs(globals);
|
5165
|
+
const vars$t = LinkClass.cssVarList;
|
5166
5166
|
|
5167
5167
|
const link$1 = {
|
5168
|
-
[vars$
|
5169
|
-
[vars$
|
5168
|
+
[vars$t.hostDirection]: globalRefs$k.direction,
|
5169
|
+
[vars$t.cursor]: 'pointer',
|
5170
5170
|
|
5171
|
-
[vars$
|
5171
|
+
[vars$t.textColor]: globalRefs$k.colors.primary.main,
|
5172
5172
|
|
5173
5173
|
textAlign: {
|
5174
|
-
right: { [vars$
|
5175
|
-
left: { [vars$
|
5176
|
-
center: { [vars$
|
5174
|
+
right: { [vars$t.textAlign]: 'right' },
|
5175
|
+
left: { [vars$t.textAlign]: 'left' },
|
5176
|
+
center: { [vars$t.textAlign]: 'center' },
|
5177
5177
|
},
|
5178
5178
|
|
5179
5179
|
_fullWidth: {
|
5180
|
-
[vars$
|
5180
|
+
[vars$t.hostWidth]: '100%',
|
5181
5181
|
},
|
5182
5182
|
|
5183
5183
|
mode: {
|
5184
5184
|
secondary: {
|
5185
|
-
[vars$
|
5185
|
+
[vars$t.textColor]: globalRefs$k.colors.secondary.main,
|
5186
5186
|
},
|
5187
5187
|
error: {
|
5188
|
-
[vars$
|
5188
|
+
[vars$t.textColor]: globalRefs$k.colors.error.main,
|
5189
5189
|
},
|
5190
5190
|
success: {
|
5191
|
-
[vars$
|
5191
|
+
[vars$t.textColor]: globalRefs$k.colors.success.main,
|
5192
5192
|
},
|
5193
5193
|
},
|
5194
5194
|
};
|
@@ -5196,11 +5196,11 @@ const link$1 = {
|
|
5196
5196
|
var link$2 = /*#__PURE__*/Object.freeze({
|
5197
5197
|
__proto__: null,
|
5198
5198
|
default: link$1,
|
5199
|
-
vars: vars$
|
5199
|
+
vars: vars$t
|
5200
5200
|
});
|
5201
5201
|
|
5202
|
-
const componentName$
|
5203
|
-
class RawDivider extends createBaseClass({ componentName: componentName$
|
5202
|
+
const componentName$A = getComponentName('divider');
|
5203
|
+
class RawDivider extends createBaseClass({ componentName: componentName$A, baseSelector: ':host > div' }) {
|
5204
5204
|
constructor() {
|
5205
5205
|
super();
|
5206
5206
|
|
@@ -5299,7 +5299,7 @@ const DividerClass = compose(
|
|
5299
5299
|
componentNameValidationMixin
|
5300
5300
|
)(RawDivider);
|
5301
5301
|
|
5302
|
-
const globalRefs$
|
5302
|
+
const globalRefs$j = getThemeRefs(globals);
|
5303
5303
|
const compVars$3 = DividerClass.cssVarList;
|
5304
5304
|
|
5305
5305
|
const [helperTheme$1, helperRefs$1, helperVars$1] = createHelperVars(
|
@@ -5307,18 +5307,18 @@ const [helperTheme$1, helperRefs$1, helperVars$1] = createHelperVars(
|
|
5307
5307
|
thickness: '2px',
|
5308
5308
|
spacing: '10px',
|
5309
5309
|
},
|
5310
|
-
componentName$
|
5310
|
+
componentName$A
|
5311
5311
|
);
|
5312
5312
|
|
5313
5313
|
const divider = {
|
5314
5314
|
...helperTheme$1,
|
5315
5315
|
|
5316
|
-
[compVars$3.hostDirection]: globalRefs$
|
5316
|
+
[compVars$3.hostDirection]: globalRefs$j.direction,
|
5317
5317
|
[compVars$3.alignItems]: 'center',
|
5318
5318
|
[compVars$3.flexDirection]: 'row',
|
5319
5319
|
[compVars$3.alignSelf]: 'stretch',
|
5320
5320
|
[compVars$3.hostWidth]: '100%',
|
5321
|
-
[compVars$3.stripeColor]: globalRefs$
|
5321
|
+
[compVars$3.stripeColor]: globalRefs$j.colors.surface.light,
|
5322
5322
|
[compVars$3.stripeColorOpacity]: '0.5',
|
5323
5323
|
[compVars$3.stripeHorizontalThickness]: helperRefs$1.thickness,
|
5324
5324
|
[compVars$3.labelTextWidth]: 'fit-content',
|
@@ -5338,7 +5338,7 @@ const divider = {
|
|
5338
5338
|
},
|
5339
5339
|
};
|
5340
5340
|
|
5341
|
-
const vars$
|
5341
|
+
const vars$s = {
|
5342
5342
|
...compVars$3,
|
5343
5343
|
...helperVars$1,
|
5344
5344
|
};
|
@@ -5346,18 +5346,18 @@ const vars$q = {
|
|
5346
5346
|
var divider$1 = /*#__PURE__*/Object.freeze({
|
5347
5347
|
__proto__: null,
|
5348
5348
|
default: divider,
|
5349
|
-
vars: vars$
|
5349
|
+
vars: vars$s
|
5350
5350
|
});
|
5351
5351
|
|
5352
5352
|
/* eslint-disable no-param-reassign */
|
5353
5353
|
|
5354
|
-
const componentName$
|
5354
|
+
const componentName$z = getComponentName('passcode-internal');
|
5355
5355
|
|
5356
|
-
createBaseInputClass({ componentName: componentName$
|
5356
|
+
createBaseInputClass({ componentName: componentName$z, baseSelector: 'div' });
|
5357
5357
|
|
5358
|
-
const componentName$
|
5358
|
+
const componentName$y = getComponentName('loader-radial');
|
5359
5359
|
|
5360
|
-
class RawLoaderRadial extends createBaseClass({ componentName: componentName$
|
5360
|
+
class RawLoaderRadial extends createBaseClass({ componentName: componentName$y, baseSelector: ':host > div' }) {
|
5361
5361
|
constructor() {
|
5362
5362
|
super();
|
5363
5363
|
|
@@ -5401,11 +5401,11 @@ const LoaderRadialClass = compose(
|
|
5401
5401
|
componentNameValidationMixin
|
5402
5402
|
)(RawLoaderRadial);
|
5403
5403
|
|
5404
|
-
const componentName$
|
5404
|
+
const componentName$x = getComponentName('passcode');
|
5405
5405
|
|
5406
5406
|
const observedAttributes$3 = ['digits'];
|
5407
5407
|
|
5408
|
-
const customMixin$
|
5408
|
+
const customMixin$7 = (superclass) =>
|
5409
5409
|
class PasscodeMixinClass extends superclass {
|
5410
5410
|
static get observedAttributes() {
|
5411
5411
|
return observedAttributes$3.concat(superclass.observedAttributes || []);
|
@@ -5420,17 +5420,17 @@ const customMixin$6 = (superclass) =>
|
|
5420
5420
|
const template = document.createElement('template');
|
5421
5421
|
|
5422
5422
|
template.innerHTML = `
|
5423
|
-
<${componentName$
|
5423
|
+
<${componentName$z}
|
5424
5424
|
bordered="true"
|
5425
5425
|
name="code"
|
5426
5426
|
tabindex="-1"
|
5427
5427
|
slot="input"
|
5428
|
-
><slot></slot></${componentName$
|
5428
|
+
><slot></slot></${componentName$z}>
|
5429
5429
|
`;
|
5430
5430
|
|
5431
5431
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
5432
5432
|
|
5433
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
5433
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$z);
|
5434
5434
|
|
5435
5435
|
forwardAttrs(this, this.inputElement, { includeAttrs: ['digits', 'size', 'loading'] });
|
5436
5436
|
}
|
@@ -5501,7 +5501,7 @@ const PasscodeClass = compose(
|
|
5501
5501
|
draggableMixin,
|
5502
5502
|
composedProxyInputMixin({ proxyProps: ['value', 'selectionStart'] }),
|
5503
5503
|
componentNameValidationMixin,
|
5504
|
-
customMixin$
|
5504
|
+
customMixin$7
|
5505
5505
|
)(
|
5506
5506
|
createProxy({
|
5507
5507
|
slots: [],
|
@@ -5577,56 +5577,56 @@ const PasscodeClass = compose(
|
|
5577
5577
|
${resetInputCursor('vaadin-text-field')}
|
5578
5578
|
`,
|
5579
5579
|
excludeAttrsSync: ['tabindex'],
|
5580
|
-
componentName: componentName$
|
5580
|
+
componentName: componentName$x,
|
5581
5581
|
})
|
5582
5582
|
);
|
5583
5583
|
|
5584
|
-
const vars$
|
5584
|
+
const vars$r = PasscodeClass.cssVarList;
|
5585
5585
|
|
5586
5586
|
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$
|
5587
|
+
[vars$r.hostDirection]: refs.direction,
|
5588
|
+
[vars$r.fontFamily]: refs.fontFamily,
|
5589
|
+
[vars$r.fontSize]: refs.fontSize,
|
5590
|
+
[vars$r.labelTextColor]: refs.labelTextColor,
|
5591
|
+
[vars$r.labelRequiredIndicator]: refs.requiredIndicator,
|
5592
|
+
[vars$r.errorMessageTextColor]: refs.errorMessageTextColor,
|
5593
|
+
[vars$r.digitValueTextColor]: refs.valueTextColor,
|
5594
|
+
[vars$r.digitPadding]: '0',
|
5595
|
+
[vars$r.digitTextAlign]: 'center',
|
5596
|
+
[vars$r.digitSpacing]: '4px',
|
5597
|
+
[vars$r.hostWidth]: refs.width,
|
5598
|
+
[vars$r.digitOutlineColor]: 'transparent',
|
5599
|
+
[vars$r.digitOutlineWidth]: refs.outlineWidth,
|
5600
|
+
[vars$r.focusedDigitFieldOutlineColor]: refs.outlineColor,
|
5601
|
+
[vars$r.digitSize]: refs.inputHeight,
|
5602
5602
|
|
5603
5603
|
size: {
|
5604
|
-
xs: { [vars$
|
5605
|
-
sm: { [vars$
|
5606
|
-
md: { [vars$
|
5607
|
-
lg: { [vars$
|
5604
|
+
xs: { [vars$r.spinnerSize]: '15px' },
|
5605
|
+
sm: { [vars$r.spinnerSize]: '20px' },
|
5606
|
+
md: { [vars$r.spinnerSize]: '20px' },
|
5607
|
+
lg: { [vars$r.spinnerSize]: '20px' },
|
5608
5608
|
},
|
5609
5609
|
|
5610
5610
|
_hideCursor: {
|
5611
|
-
[vars$
|
5611
|
+
[vars$r.digitCaretTextColor]: 'transparent',
|
5612
5612
|
},
|
5613
5613
|
|
5614
5614
|
_loading: {
|
5615
|
-
[vars$
|
5615
|
+
[vars$r.overlayOpacity]: refs.overlayOpacity,
|
5616
5616
|
},
|
5617
5617
|
};
|
5618
5618
|
|
5619
5619
|
var passcode$1 = /*#__PURE__*/Object.freeze({
|
5620
5620
|
__proto__: null,
|
5621
5621
|
default: passcode,
|
5622
|
-
vars: vars$
|
5622
|
+
vars: vars$r
|
5623
5623
|
});
|
5624
5624
|
|
5625
|
-
const componentName$
|
5625
|
+
const componentName$w = getComponentName('loader-linear');
|
5626
5626
|
|
5627
|
-
class RawLoaderLinear extends createBaseClass({ componentName: componentName$
|
5627
|
+
class RawLoaderLinear extends createBaseClass({ componentName: componentName$w, baseSelector: ':host > div' }) {
|
5628
5628
|
static get componentName() {
|
5629
|
-
return componentName$
|
5629
|
+
return componentName$w;
|
5630
5630
|
}
|
5631
5631
|
|
5632
5632
|
constructor() {
|
@@ -5687,67 +5687,67 @@ const LoaderLinearClass = compose(
|
|
5687
5687
|
componentNameValidationMixin
|
5688
5688
|
)(RawLoaderLinear);
|
5689
5689
|
|
5690
|
-
const globalRefs$
|
5691
|
-
const vars$
|
5690
|
+
const globalRefs$i = getThemeRefs(globals);
|
5691
|
+
const vars$q = LoaderLinearClass.cssVarList;
|
5692
5692
|
|
5693
5693
|
const loaderLinear = {
|
5694
|
-
[vars$
|
5695
|
-
[vars$
|
5694
|
+
[vars$q.hostDisplay]: 'inline-block',
|
5695
|
+
[vars$q.hostWidth]: '100%',
|
5696
5696
|
|
5697
|
-
[vars$
|
5698
|
-
[vars$
|
5697
|
+
[vars$q.barColor]: globalRefs$i.colors.surface.contrast,
|
5698
|
+
[vars$q.barWidth]: '20%',
|
5699
5699
|
|
5700
|
-
[vars$
|
5701
|
-
[vars$
|
5700
|
+
[vars$q.barBackgroundColor]: globalRefs$i.colors.surface.light,
|
5701
|
+
[vars$q.barBorderRadius]: '4px',
|
5702
5702
|
|
5703
|
-
[vars$
|
5704
|
-
[vars$
|
5705
|
-
[vars$
|
5706
|
-
[vars$
|
5703
|
+
[vars$q.animationDuration]: '2s',
|
5704
|
+
[vars$q.animationTimingFunction]: 'linear',
|
5705
|
+
[vars$q.animationIterationCount]: 'infinite',
|
5706
|
+
[vars$q.verticalPadding]: '0.25em',
|
5707
5707
|
|
5708
5708
|
size: {
|
5709
|
-
xs: { [vars$
|
5710
|
-
sm: { [vars$
|
5711
|
-
md: { [vars$
|
5712
|
-
lg: { [vars$
|
5709
|
+
xs: { [vars$q.barHeight]: '2px' },
|
5710
|
+
sm: { [vars$q.barHeight]: '4px' },
|
5711
|
+
md: { [vars$q.barHeight]: '6px' },
|
5712
|
+
lg: { [vars$q.barHeight]: '8px' },
|
5713
5713
|
},
|
5714
5714
|
|
5715
5715
|
mode: {
|
5716
5716
|
primary: {
|
5717
|
-
[vars$
|
5717
|
+
[vars$q.barColor]: globalRefs$i.colors.primary.main,
|
5718
5718
|
},
|
5719
5719
|
secondary: {
|
5720
|
-
[vars$
|
5720
|
+
[vars$q.barColor]: globalRefs$i.colors.secondary.main,
|
5721
5721
|
},
|
5722
5722
|
},
|
5723
5723
|
|
5724
5724
|
_hidden: {
|
5725
|
-
[vars$
|
5725
|
+
[vars$q.hostDisplay]: 'none',
|
5726
5726
|
},
|
5727
5727
|
};
|
5728
5728
|
|
5729
5729
|
var loaderLinear$1 = /*#__PURE__*/Object.freeze({
|
5730
5730
|
__proto__: null,
|
5731
5731
|
default: loaderLinear,
|
5732
|
-
vars: vars$
|
5732
|
+
vars: vars$q
|
5733
5733
|
});
|
5734
5734
|
|
5735
|
-
const globalRefs$
|
5735
|
+
const globalRefs$h = getThemeRefs(globals);
|
5736
5736
|
const compVars$2 = LoaderRadialClass.cssVarList;
|
5737
5737
|
|
5738
5738
|
const [helperTheme, helperRefs, helperVars] = createHelperVars(
|
5739
5739
|
{
|
5740
|
-
spinnerColor: globalRefs$
|
5740
|
+
spinnerColor: globalRefs$h.colors.surface.contrast,
|
5741
5741
|
mode: {
|
5742
5742
|
primary: {
|
5743
|
-
spinnerColor: globalRefs$
|
5743
|
+
spinnerColor: globalRefs$h.colors.primary.main,
|
5744
5744
|
},
|
5745
5745
|
secondary: {
|
5746
|
-
spinnerColor: globalRefs$
|
5746
|
+
spinnerColor: globalRefs$h.colors.secondary.main,
|
5747
5747
|
},
|
5748
5748
|
},
|
5749
5749
|
},
|
5750
|
-
componentName$
|
5750
|
+
componentName$y
|
5751
5751
|
);
|
5752
5752
|
|
5753
5753
|
const loaderRadial = {
|
@@ -5776,7 +5776,7 @@ const loaderRadial = {
|
|
5776
5776
|
[compVars$2.hostDisplay]: 'none',
|
5777
5777
|
},
|
5778
5778
|
};
|
5779
|
-
const vars$
|
5779
|
+
const vars$p = {
|
5780
5780
|
...compVars$2,
|
5781
5781
|
...helperVars,
|
5782
5782
|
};
|
@@ -5784,10 +5784,10 @@ const vars$n = {
|
|
5784
5784
|
var loaderRadial$1 = /*#__PURE__*/Object.freeze({
|
5785
5785
|
__proto__: null,
|
5786
5786
|
default: loaderRadial,
|
5787
|
-
vars: vars$
|
5787
|
+
vars: vars$p
|
5788
5788
|
});
|
5789
5789
|
|
5790
|
-
const componentName$
|
5790
|
+
const componentName$v = getComponentName('combo-box');
|
5791
5791
|
|
5792
5792
|
const ComboBoxMixin = (superclass) =>
|
5793
5793
|
class ComboBoxMixinClass extends superclass {
|
@@ -6170,71 +6170,71 @@ const ComboBoxClass = compose(
|
|
6170
6170
|
// and reset items to an empty array, and opening the list box with no items
|
6171
6171
|
// to display.
|
6172
6172
|
excludeAttrsSync: ['tabindex', 'size', 'data'],
|
6173
|
-
componentName: componentName$
|
6173
|
+
componentName: componentName$v,
|
6174
6174
|
includeForwardProps: ['items', 'renderer', 'selectedItem'],
|
6175
6175
|
})
|
6176
6176
|
);
|
6177
6177
|
|
6178
|
-
const globalRefs$
|
6179
|
-
const vars$
|
6178
|
+
const globalRefs$g = getThemeRefs(globals);
|
6179
|
+
const vars$o = ComboBoxClass.cssVarList;
|
6180
6180
|
|
6181
6181
|
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$
|
6182
|
+
[vars$o.hostWidth]: refs.width,
|
6183
|
+
[vars$o.hostDirection]: refs.direction,
|
6184
|
+
[vars$o.fontSize]: refs.fontSize,
|
6185
|
+
[vars$o.fontFamily]: refs.fontFamily,
|
6186
|
+
[vars$o.labelTextColor]: refs.labelTextColor,
|
6187
|
+
[vars$o.errorMessageTextColor]: refs.errorMessageTextColor,
|
6188
|
+
[vars$o.inputBorderColor]: refs.borderColor,
|
6189
|
+
[vars$o.inputBorderWidth]: refs.borderWidth,
|
6190
|
+
[vars$o.inputBorderStyle]: refs.borderStyle,
|
6191
|
+
[vars$o.inputBorderRadius]: refs.borderRadius,
|
6192
|
+
[vars$o.inputOutlineColor]: refs.outlineColor,
|
6193
|
+
[vars$o.inputOutlineOffset]: refs.outlineOffset,
|
6194
|
+
[vars$o.inputOutlineWidth]: refs.outlineWidth,
|
6195
|
+
[vars$o.inputOutlineStyle]: refs.outlineStyle,
|
6196
|
+
[vars$o.labelRequiredIndicator]: refs.requiredIndicator,
|
6197
|
+
[vars$o.inputValueTextColor]: refs.valueTextColor,
|
6198
|
+
[vars$o.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
6199
|
+
[vars$o.inputBackgroundColor]: refs.backgroundColor,
|
6200
|
+
[vars$o.inputHorizontalPadding]: refs.horizontalPadding,
|
6201
|
+
[vars$o.inputHeight]: refs.inputHeight,
|
6202
|
+
[vars$o.inputDropdownButtonColor]: globalRefs$g.colors.surface.dark,
|
6203
|
+
[vars$o.inputDropdownButtonCursor]: 'pointer',
|
6204
|
+
[vars$o.inputDropdownButtonSize]: refs.toggleButtonSize,
|
6205
|
+
[vars$o.inputDropdownButtonOffset]: globalRefs$g.spacing.xs,
|
6206
|
+
[vars$o.overlayItemPaddingInlineStart]: globalRefs$g.spacing.xs,
|
6207
|
+
[vars$o.overlayItemPaddingInlineEnd]: globalRefs$g.spacing.lg,
|
6208
6208
|
|
6209
6209
|
_readonly: {
|
6210
|
-
[vars$
|
6210
|
+
[vars$o.inputDropdownButtonCursor]: 'default',
|
6211
6211
|
},
|
6212
6212
|
|
6213
6213
|
// Overlay theme exposed via the component:
|
6214
|
-
[vars$
|
6215
|
-
[vars$
|
6216
|
-
[vars$
|
6217
|
-
[vars$
|
6218
|
-
[vars$
|
6219
|
-
[vars$
|
6214
|
+
[vars$o.overlayFontSize]: refs.fontSize,
|
6215
|
+
[vars$o.overlayFontFamily]: refs.fontFamily,
|
6216
|
+
[vars$o.overlayCursor]: 'pointer',
|
6217
|
+
[vars$o.overlayItemBoxShadow]: 'none',
|
6218
|
+
[vars$o.overlayBackground]: refs.backgroundColor,
|
6219
|
+
[vars$o.overlayTextColor]: refs.valueTextColor,
|
6220
6220
|
|
6221
6221
|
// Overlay direct theme:
|
6222
|
-
[vars$
|
6223
|
-
[vars$
|
6222
|
+
[vars$o.overlay.minHeight]: '400px',
|
6223
|
+
[vars$o.overlay.margin]: '0',
|
6224
6224
|
};
|
6225
6225
|
|
6226
6226
|
var comboBox$1 = /*#__PURE__*/Object.freeze({
|
6227
6227
|
__proto__: null,
|
6228
6228
|
comboBox: comboBox,
|
6229
6229
|
default: comboBox,
|
6230
|
-
vars: vars$
|
6230
|
+
vars: vars$o
|
6231
6231
|
});
|
6232
6232
|
|
6233
6233
|
const observedAttributes$2 = ['src', 'alt'];
|
6234
6234
|
|
6235
|
-
const componentName$
|
6235
|
+
const componentName$u = getComponentName('image');
|
6236
6236
|
|
6237
|
-
const BaseClass$1 = createBaseClass({ componentName: componentName$
|
6237
|
+
const BaseClass$1 = createBaseClass({ componentName: componentName$u, baseSelector: ':host > img' });
|
6238
6238
|
class RawImage extends BaseClass$1 {
|
6239
6239
|
static get observedAttributes() {
|
6240
6240
|
return observedAttributes$2.concat(BaseClass$1.observedAttributes || []);
|
@@ -6274,14 +6274,14 @@ const ImageClass = compose(
|
|
6274
6274
|
draggableMixin
|
6275
6275
|
)(RawImage);
|
6276
6276
|
|
6277
|
-
const vars$
|
6277
|
+
const vars$n = ImageClass.cssVarList;
|
6278
6278
|
|
6279
6279
|
const image = {};
|
6280
6280
|
|
6281
6281
|
var image$1 = /*#__PURE__*/Object.freeze({
|
6282
6282
|
__proto__: null,
|
6283
6283
|
default: image,
|
6284
|
-
vars: vars$
|
6284
|
+
vars: vars$n
|
6285
6285
|
});
|
6286
6286
|
|
6287
6287
|
var CountryCodes = [
|
@@ -7500,16 +7500,16 @@ var CountryCodes = [
|
|
7500
7500
|
].sort((a, b) => (a.name < b.name ? -1 : 1)),
|
7501
7501
|
];
|
7502
7502
|
|
7503
|
-
const componentName$
|
7503
|
+
const componentName$t = getComponentName('phone-field-internal');
|
7504
7504
|
|
7505
|
-
createBaseInputClass({ componentName: componentName$
|
7505
|
+
createBaseInputClass({ componentName: componentName$t, baseSelector: 'div' });
|
7506
7506
|
|
7507
7507
|
const textVars$1 = TextFieldClass.cssVarList;
|
7508
7508
|
const comboVars = ComboBoxClass.cssVarList;
|
7509
7509
|
|
7510
|
-
const componentName$
|
7510
|
+
const componentName$s = getComponentName('phone-field');
|
7511
7511
|
|
7512
|
-
const customMixin$
|
7512
|
+
const customMixin$6 = (superclass) =>
|
7513
7513
|
class PhoneFieldMixinClass extends superclass {
|
7514
7514
|
static get CountryCodes() {
|
7515
7515
|
return CountryCodes;
|
@@ -7521,15 +7521,15 @@ const customMixin$5 = (superclass) =>
|
|
7521
7521
|
const template = document.createElement('template');
|
7522
7522
|
|
7523
7523
|
template.innerHTML = `
|
7524
|
-
<${componentName$
|
7524
|
+
<${componentName$t}
|
7525
7525
|
tabindex="-1"
|
7526
7526
|
slot="input"
|
7527
|
-
></${componentName$
|
7527
|
+
></${componentName$t}>
|
7528
7528
|
`;
|
7529
7529
|
|
7530
7530
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
7531
7531
|
|
7532
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
7532
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$t);
|
7533
7533
|
|
7534
7534
|
forwardAttrs(this.shadowRoot.host, this.inputElement, {
|
7535
7535
|
includeAttrs: [
|
@@ -7649,7 +7649,7 @@ const PhoneFieldClass = compose(
|
|
7649
7649
|
}),
|
7650
7650
|
draggableMixin,
|
7651
7651
|
composedProxyInputMixin({ proxyProps: ['value', 'selectionStart'] }),
|
7652
|
-
customMixin$
|
7652
|
+
customMixin$6
|
7653
7653
|
)(
|
7654
7654
|
createProxy({
|
7655
7655
|
slots: [],
|
@@ -7725,33 +7725,33 @@ const PhoneFieldClass = compose(
|
|
7725
7725
|
${resetInputLabelPosition('vaadin-text-field')}
|
7726
7726
|
`,
|
7727
7727
|
excludeAttrsSync: ['tabindex'],
|
7728
|
-
componentName: componentName$
|
7728
|
+
componentName: componentName$s,
|
7729
7729
|
})
|
7730
7730
|
);
|
7731
7731
|
|
7732
|
-
const vars$
|
7732
|
+
const vars$m = PhoneFieldClass.cssVarList;
|
7733
7733
|
|
7734
7734
|
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$
|
7735
|
+
[vars$m.hostWidth]: refs.width,
|
7736
|
+
[vars$m.hostDirection]: refs.direction,
|
7737
|
+
[vars$m.fontSize]: refs.fontSize,
|
7738
|
+
[vars$m.fontFamily]: refs.fontFamily,
|
7739
|
+
[vars$m.labelTextColor]: refs.labelTextColor,
|
7740
|
+
[vars$m.labelRequiredIndicator]: refs.requiredIndicator,
|
7741
|
+
[vars$m.errorMessageTextColor]: refs.errorMessageTextColor,
|
7742
|
+
[vars$m.inputValueTextColor]: refs.valueTextColor,
|
7743
|
+
[vars$m.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
7744
|
+
[vars$m.inputBorderStyle]: refs.borderStyle,
|
7745
|
+
[vars$m.inputBorderWidth]: refs.borderWidth,
|
7746
|
+
[vars$m.inputBorderColor]: refs.borderColor,
|
7747
|
+
[vars$m.inputBorderRadius]: refs.borderRadius,
|
7748
|
+
[vars$m.inputOutlineStyle]: refs.outlineStyle,
|
7749
|
+
[vars$m.inputOutlineWidth]: refs.outlineWidth,
|
7750
|
+
[vars$m.inputOutlineColor]: refs.outlineColor,
|
7751
|
+
[vars$m.inputOutlineOffset]: refs.outlineOffset,
|
7752
|
+
[vars$m.phoneInputWidth]: refs.minWidth,
|
7753
|
+
[vars$m.countryCodeInputWidth]: '5em',
|
7754
|
+
[vars$m.countryCodeDropdownWidth]: '20em',
|
7755
7755
|
|
7756
7756
|
// '@overlay': {
|
7757
7757
|
// overlayItemBackgroundColor: 'red'
|
@@ -7761,18 +7761,18 @@ const phoneField = {
|
|
7761
7761
|
var phoneField$1 = /*#__PURE__*/Object.freeze({
|
7762
7762
|
__proto__: null,
|
7763
7763
|
default: phoneField,
|
7764
|
-
vars: vars$
|
7764
|
+
vars: vars$m
|
7765
7765
|
});
|
7766
7766
|
|
7767
|
-
const componentName$
|
7767
|
+
const componentName$r = getComponentName('phone-field-internal-input-box');
|
7768
7768
|
|
7769
|
-
createBaseInputClass({ componentName: componentName$
|
7769
|
+
createBaseInputClass({ componentName: componentName$r, baseSelector: 'div' });
|
7770
7770
|
|
7771
7771
|
const textVars = TextFieldClass.cssVarList;
|
7772
7772
|
|
7773
|
-
const componentName$
|
7773
|
+
const componentName$q = getComponentName('phone-input-box-field');
|
7774
7774
|
|
7775
|
-
const customMixin$
|
7775
|
+
const customMixin$5 = (superclass) =>
|
7776
7776
|
class PhoneInputBoxFieldMixinClass extends superclass {
|
7777
7777
|
static get CountryCodes() {
|
7778
7778
|
return CountryCodes;
|
@@ -7784,15 +7784,15 @@ const customMixin$4 = (superclass) =>
|
|
7784
7784
|
const template = document.createElement('template');
|
7785
7785
|
|
7786
7786
|
template.innerHTML = `
|
7787
|
-
<${componentName$
|
7787
|
+
<${componentName$r}
|
7788
7788
|
tabindex="-1"
|
7789
7789
|
slot="input"
|
7790
|
-
></${componentName$
|
7790
|
+
></${componentName$r}>
|
7791
7791
|
`;
|
7792
7792
|
|
7793
7793
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
7794
7794
|
|
7795
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
7795
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$r);
|
7796
7796
|
|
7797
7797
|
forwardAttrs(this.shadowRoot.host, this.inputElement, {
|
7798
7798
|
includeAttrs: [
|
@@ -7859,7 +7859,7 @@ const PhoneFieldInputBoxClass = compose(
|
|
7859
7859
|
}),
|
7860
7860
|
draggableMixin,
|
7861
7861
|
composedProxyInputMixin({ proxyProps: ['value', 'selectionStart'] }),
|
7862
|
-
customMixin$
|
7862
|
+
customMixin$5
|
7863
7863
|
)(
|
7864
7864
|
createProxy({
|
7865
7865
|
slots: [],
|
@@ -7925,56 +7925,56 @@ const PhoneFieldInputBoxClass = compose(
|
|
7925
7925
|
${resetInputLabelPosition('vaadin-text-field')}
|
7926
7926
|
`,
|
7927
7927
|
excludeAttrsSync: ['tabindex'],
|
7928
|
-
componentName: componentName$
|
7928
|
+
componentName: componentName$q,
|
7929
7929
|
})
|
7930
7930
|
);
|
7931
7931
|
|
7932
|
-
const vars$
|
7932
|
+
const vars$l = PhoneFieldInputBoxClass.cssVarList;
|
7933
7933
|
|
7934
7934
|
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$
|
7935
|
+
[vars$l.hostWidth]: '16em',
|
7936
|
+
[vars$l.hostMinWidth]: refs.minWidth,
|
7937
|
+
[vars$l.hostDirection]: refs.direction,
|
7938
|
+
[vars$l.fontSize]: refs.fontSize,
|
7939
|
+
[vars$l.fontFamily]: refs.fontFamily,
|
7940
|
+
[vars$l.labelTextColor]: refs.labelTextColor,
|
7941
|
+
[vars$l.labelRequiredIndicator]: refs.requiredIndicator,
|
7942
|
+
[vars$l.errorMessageTextColor]: refs.errorMessageTextColor,
|
7943
|
+
[vars$l.inputValueTextColor]: refs.valueTextColor,
|
7944
|
+
[vars$l.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
7945
|
+
[vars$l.inputBorderStyle]: refs.borderStyle,
|
7946
|
+
[vars$l.inputBorderWidth]: refs.borderWidth,
|
7947
|
+
[vars$l.inputBorderColor]: refs.borderColor,
|
7948
|
+
[vars$l.inputBorderRadius]: refs.borderRadius,
|
7949
|
+
[vars$l.inputOutlineStyle]: refs.outlineStyle,
|
7950
|
+
[vars$l.inputOutlineWidth]: refs.outlineWidth,
|
7951
|
+
[vars$l.inputOutlineColor]: refs.outlineColor,
|
7952
|
+
[vars$l.inputOutlineOffset]: refs.outlineOffset,
|
7953
7953
|
_fullWidth: {
|
7954
|
-
[vars$
|
7954
|
+
[vars$l.hostWidth]: refs.width,
|
7955
7955
|
},
|
7956
7956
|
};
|
7957
7957
|
|
7958
7958
|
var phoneInputBoxField$1 = /*#__PURE__*/Object.freeze({
|
7959
7959
|
__proto__: null,
|
7960
7960
|
default: phoneInputBoxField,
|
7961
|
-
vars: vars$
|
7961
|
+
vars: vars$l
|
7962
7962
|
});
|
7963
7963
|
|
7964
|
-
const componentName$
|
7964
|
+
const componentName$p = getComponentName('new-password-internal');
|
7965
7965
|
|
7966
7966
|
const interpolateString = (template, values) =>
|
7967
7967
|
template.replace(/{{(\w+)+}}/g, (match, key) => values?.[key] || match);
|
7968
7968
|
|
7969
7969
|
// eslint-disable-next-line max-classes-per-file
|
7970
7970
|
|
7971
|
-
const componentName$
|
7971
|
+
const componentName$o = getComponentName('policy-validation');
|
7972
7972
|
|
7973
7973
|
const overrideAttrs = ['data-password-policy-value-minlength'];
|
7974
7974
|
const dataAttrs = ['data', 'active-policies', 'overrides', ...overrideAttrs];
|
7975
7975
|
const policyAttrs = ['label', 'value', ...dataAttrs];
|
7976
7976
|
|
7977
|
-
class RawPolicyValidation extends createBaseClass({ componentName: componentName$
|
7977
|
+
class RawPolicyValidation extends createBaseClass({ componentName: componentName$o, baseSelector: ':host > div' }) {
|
7978
7978
|
#availablePolicies;
|
7979
7979
|
|
7980
7980
|
#activePolicies = [];
|
@@ -8182,11 +8182,11 @@ const PolicyValidationClass = compose(
|
|
8182
8182
|
componentNameValidationMixin
|
8183
8183
|
)(RawPolicyValidation);
|
8184
8184
|
|
8185
|
-
const componentName$
|
8185
|
+
const componentName$n = getComponentName('new-password');
|
8186
8186
|
|
8187
8187
|
const policyPreviewVars = PolicyValidationClass.cssVarList;
|
8188
8188
|
|
8189
|
-
const customMixin$
|
8189
|
+
const customMixin$4 = (superclass) =>
|
8190
8190
|
class NewPasswordMixinClass extends superclass {
|
8191
8191
|
init() {
|
8192
8192
|
super.init?.();
|
@@ -8194,19 +8194,19 @@ const customMixin$3 = (superclass) =>
|
|
8194
8194
|
const template = document.createElement('template');
|
8195
8195
|
|
8196
8196
|
template.innerHTML = `
|
8197
|
-
<${componentName$
|
8197
|
+
<${componentName$p}
|
8198
8198
|
name="new-password"
|
8199
8199
|
tabindex="-1"
|
8200
8200
|
slot="input"
|
8201
8201
|
>
|
8202
|
-
</${componentName$
|
8202
|
+
</${componentName$p}>
|
8203
8203
|
`;
|
8204
8204
|
|
8205
8205
|
this.setAttribute('external-input', 'true');
|
8206
8206
|
|
8207
8207
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
8208
8208
|
|
8209
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
8209
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$p);
|
8210
8210
|
|
8211
8211
|
// get descope input components
|
8212
8212
|
this.passwordInput = this.inputElement.querySelector('[data-id="password"]');
|
@@ -8302,7 +8302,7 @@ const NewPasswordClass = compose(
|
|
8302
8302
|
}),
|
8303
8303
|
draggableMixin,
|
8304
8304
|
composedProxyInputMixin({ proxyProps: ['value', 'selectionStart'] }),
|
8305
|
-
customMixin$
|
8305
|
+
customMixin$4
|
8306
8306
|
)(
|
8307
8307
|
createProxy({
|
8308
8308
|
slots: [],
|
@@ -8361,36 +8361,36 @@ const NewPasswordClass = compose(
|
|
8361
8361
|
}
|
8362
8362
|
`,
|
8363
8363
|
excludeAttrsSync: ['tabindex'],
|
8364
|
-
componentName: componentName$
|
8364
|
+
componentName: componentName$n,
|
8365
8365
|
})
|
8366
8366
|
);
|
8367
8367
|
|
8368
|
-
const globalRefs$
|
8369
|
-
const vars$
|
8368
|
+
const globalRefs$f = getThemeRefs(globals);
|
8369
|
+
const vars$k = NewPasswordClass.cssVarList;
|
8370
8370
|
|
8371
8371
|
const newPassword = {
|
8372
|
-
[vars$
|
8373
|
-
[vars$
|
8374
|
-
[vars$
|
8375
|
-
[vars$
|
8376
|
-
[vars$
|
8377
|
-
[vars$
|
8378
|
-
[vars$
|
8379
|
-
[vars$
|
8380
|
-
[vars$
|
8372
|
+
[vars$k.hostWidth]: refs.width,
|
8373
|
+
[vars$k.hostMinWidth]: refs.minWidth,
|
8374
|
+
[vars$k.hostDirection]: refs.direction,
|
8375
|
+
[vars$k.fontSize]: refs.fontSize,
|
8376
|
+
[vars$k.fontFamily]: refs.fontFamily,
|
8377
|
+
[vars$k.spaceBetweenInputs]: '1em',
|
8378
|
+
[vars$k.errorMessageTextColor]: refs.errorMessageTextColor,
|
8379
|
+
[vars$k.policyPreviewBackgroundColor]: 'none',
|
8380
|
+
[vars$k.policyPreviewPadding]: globalRefs$f.spacing.lg,
|
8381
8381
|
|
8382
8382
|
_required: {
|
8383
8383
|
// NewPassword doesn't pass `required` attribute to its Password components.
|
8384
8384
|
// That's why we fake the required indicator on each input.
|
8385
8385
|
// We do that by injecting `::after` element, and populating it with requiredIndicator content.
|
8386
|
-
[vars$
|
8386
|
+
[vars$k.inputsRequiredIndicator]: refs.requiredIndicator, // used to populate required content for NewPassword input fields outside the theme
|
8387
8387
|
},
|
8388
8388
|
};
|
8389
8389
|
|
8390
8390
|
var newPassword$1 = /*#__PURE__*/Object.freeze({
|
8391
8391
|
__proto__: null,
|
8392
8392
|
default: newPassword,
|
8393
|
-
vars: vars$
|
8393
|
+
vars: vars$k
|
8394
8394
|
});
|
8395
8395
|
|
8396
8396
|
const getFileBase64 = (fileObj) => {
|
@@ -8405,7 +8405,7 @@ const getFilename = (fileObj) => {
|
|
8405
8405
|
return fileObj.name.replace(/^.*\\/, '');
|
8406
8406
|
};
|
8407
8407
|
|
8408
|
-
const componentName$
|
8408
|
+
const componentName$m = getComponentName('upload-file');
|
8409
8409
|
|
8410
8410
|
const observedAttributes$1 = [
|
8411
8411
|
'title',
|
@@ -8420,7 +8420,7 @@ const observedAttributes$1 = [
|
|
8420
8420
|
'icon',
|
8421
8421
|
];
|
8422
8422
|
|
8423
|
-
const BaseInputClass = createBaseInputClass({ componentName: componentName$
|
8423
|
+
const BaseInputClass = createBaseInputClass({ componentName: componentName$m, baseSelector: ':host > div' });
|
8424
8424
|
|
8425
8425
|
class RawUploadFile extends BaseInputClass {
|
8426
8426
|
static get observedAttributes() {
|
@@ -8635,77 +8635,77 @@ const UploadFileClass = compose(
|
|
8635
8635
|
componentNameValidationMixin
|
8636
8636
|
)(RawUploadFile);
|
8637
8637
|
|
8638
|
-
const vars$
|
8638
|
+
const vars$j = UploadFileClass.cssVarList;
|
8639
8639
|
|
8640
8640
|
const uploadFile = {
|
8641
|
-
[vars$
|
8642
|
-
[vars$
|
8643
|
-
[vars$
|
8641
|
+
[vars$j.hostDirection]: refs.direction,
|
8642
|
+
[vars$j.labelTextColor]: refs.labelTextColor,
|
8643
|
+
[vars$j.fontFamily]: refs.fontFamily,
|
8644
8644
|
|
8645
|
-
[vars$
|
8645
|
+
[vars$j.iconSize]: '2em',
|
8646
8646
|
|
8647
|
-
[vars$
|
8648
|
-
[vars$
|
8647
|
+
[vars$j.hostPadding]: '0.75em',
|
8648
|
+
[vars$j.gap]: '0.5em',
|
8649
8649
|
|
8650
|
-
[vars$
|
8651
|
-
[vars$
|
8652
|
-
[vars$
|
8650
|
+
[vars$j.fontSize]: '16px',
|
8651
|
+
[vars$j.titleFontWeight]: '500',
|
8652
|
+
[vars$j.lineHeight]: '1em',
|
8653
8653
|
|
8654
|
-
[vars$
|
8655
|
-
[vars$
|
8656
|
-
[vars$
|
8657
|
-
[vars$
|
8654
|
+
[vars$j.borderWidth]: refs.borderWidth,
|
8655
|
+
[vars$j.borderColor]: refs.borderColor,
|
8656
|
+
[vars$j.borderRadius]: refs.borderRadius,
|
8657
|
+
[vars$j.borderStyle]: 'dashed',
|
8658
8658
|
|
8659
8659
|
_required: {
|
8660
|
-
[vars$
|
8660
|
+
[vars$j.requiredIndicator]: refs.requiredIndicator,
|
8661
8661
|
},
|
8662
8662
|
|
8663
8663
|
size: {
|
8664
8664
|
xs: {
|
8665
|
-
[vars$
|
8666
|
-
[vars$
|
8667
|
-
[vars$
|
8668
|
-
[vars$
|
8669
|
-
[vars$
|
8665
|
+
[vars$j.hostHeight]: '196px',
|
8666
|
+
[vars$j.hostWidth]: '200px',
|
8667
|
+
[vars$j.titleFontSize]: '0.875em',
|
8668
|
+
[vars$j.descriptionFontSize]: '0.875em',
|
8669
|
+
[vars$j.lineHeight]: '1.25em',
|
8670
8670
|
},
|
8671
8671
|
sm: {
|
8672
|
-
[vars$
|
8673
|
-
[vars$
|
8674
|
-
[vars$
|
8675
|
-
[vars$
|
8676
|
-
[vars$
|
8672
|
+
[vars$j.hostHeight]: '216px',
|
8673
|
+
[vars$j.hostWidth]: '230px',
|
8674
|
+
[vars$j.titleFontSize]: '1em',
|
8675
|
+
[vars$j.descriptionFontSize]: '0.875em',
|
8676
|
+
[vars$j.lineHeight]: '1.25em',
|
8677
8677
|
},
|
8678
8678
|
md: {
|
8679
|
-
[vars$
|
8680
|
-
[vars$
|
8681
|
-
[vars$
|
8682
|
-
[vars$
|
8683
|
-
[vars$
|
8679
|
+
[vars$j.hostHeight]: '256px',
|
8680
|
+
[vars$j.hostWidth]: '312px',
|
8681
|
+
[vars$j.titleFontSize]: '1.125em',
|
8682
|
+
[vars$j.descriptionFontSize]: '1em',
|
8683
|
+
[vars$j.lineHeight]: '1.5em',
|
8684
8684
|
},
|
8685
8685
|
lg: {
|
8686
|
-
[vars$
|
8687
|
-
[vars$
|
8688
|
-
[vars$
|
8689
|
-
[vars$
|
8690
|
-
[vars$
|
8686
|
+
[vars$j.hostHeight]: '280px',
|
8687
|
+
[vars$j.hostWidth]: '336px',
|
8688
|
+
[vars$j.titleFontSize]: '1.125em',
|
8689
|
+
[vars$j.descriptionFontSize]: '1.125em',
|
8690
|
+
[vars$j.lineHeight]: '1.75em',
|
8691
8691
|
},
|
8692
8692
|
},
|
8693
8693
|
|
8694
8694
|
_fullWidth: {
|
8695
|
-
[vars$
|
8695
|
+
[vars$j.hostWidth]: refs.width,
|
8696
8696
|
},
|
8697
8697
|
};
|
8698
8698
|
|
8699
8699
|
var uploadFile$1 = /*#__PURE__*/Object.freeze({
|
8700
8700
|
__proto__: null,
|
8701
8701
|
default: uploadFile,
|
8702
|
-
vars: vars$
|
8702
|
+
vars: vars$j
|
8703
8703
|
});
|
8704
8704
|
|
8705
|
-
const componentName$
|
8705
|
+
const componentName$l = getComponentName('button-selection-group-item');
|
8706
8706
|
|
8707
8707
|
class RawSelectItem extends createBaseClass({
|
8708
|
-
componentName: componentName$
|
8708
|
+
componentName: componentName$l,
|
8709
8709
|
baseSelector: ':host > descope-button',
|
8710
8710
|
}) {
|
8711
8711
|
get size() {
|
@@ -8812,39 +8812,39 @@ const ButtonSelectionGroupItemClass = compose(
|
|
8812
8812
|
componentNameValidationMixin
|
8813
8813
|
)(RawSelectItem);
|
8814
8814
|
|
8815
|
-
const globalRefs$
|
8815
|
+
const globalRefs$e = getThemeRefs(globals);
|
8816
8816
|
|
8817
|
-
const vars$
|
8817
|
+
const vars$i = ButtonSelectionGroupItemClass.cssVarList;
|
8818
8818
|
|
8819
8819
|
const buttonSelectionGroupItem = {
|
8820
|
-
[vars$
|
8821
|
-
[vars$
|
8822
|
-
[vars$
|
8823
|
-
[vars$
|
8824
|
-
[vars$
|
8825
|
-
[vars$
|
8826
|
-
[vars$
|
8827
|
-
[vars$
|
8820
|
+
[vars$i.hostDirection]: 'inherit',
|
8821
|
+
[vars$i.backgroundColor]: globalRefs$e.colors.surface.main,
|
8822
|
+
[vars$i.labelTextColor]: globalRefs$e.colors.surface.contrast,
|
8823
|
+
[vars$i.borderColor]: globalRefs$e.colors.surface.light,
|
8824
|
+
[vars$i.borderStyle]: 'solid',
|
8825
|
+
[vars$i.borderRadius]: globalRefs$e.radius.sm,
|
8826
|
+
[vars$i.outlineColor]: 'transparent',
|
8827
|
+
[vars$i.borderWidth]: globalRefs$e.border.xs,
|
8828
8828
|
|
8829
8829
|
_hover: {
|
8830
|
-
[vars$
|
8830
|
+
[vars$i.backgroundColor]: globalRefs$e.colors.surface.highlight,
|
8831
8831
|
},
|
8832
8832
|
|
8833
8833
|
_focused: {
|
8834
|
-
[vars$
|
8834
|
+
[vars$i.outlineColor]: globalRefs$e.colors.surface.light,
|
8835
8835
|
},
|
8836
8836
|
|
8837
8837
|
_selected: {
|
8838
|
-
[vars$
|
8839
|
-
[vars$
|
8840
|
-
[vars$
|
8838
|
+
[vars$i.borderColor]: globalRefs$e.colors.surface.contrast,
|
8839
|
+
[vars$i.backgroundColor]: globalRefs$e.colors.surface.contrast,
|
8840
|
+
[vars$i.labelTextColor]: globalRefs$e.colors.surface.main,
|
8841
8841
|
},
|
8842
8842
|
};
|
8843
8843
|
|
8844
8844
|
var buttonSelectionGroupItem$1 = /*#__PURE__*/Object.freeze({
|
8845
8845
|
__proto__: null,
|
8846
8846
|
default: buttonSelectionGroupItem,
|
8847
|
-
vars: vars$
|
8847
|
+
vars: vars$i
|
8848
8848
|
});
|
8849
8849
|
|
8850
8850
|
const createBaseButtonSelectionGroupInternalClass = (componentName) => {
|
@@ -8943,10 +8943,10 @@ const createBaseButtonSelectionGroupInternalClass = (componentName) => {
|
|
8943
8943
|
return BaseButtonSelectionGroupInternalClass;
|
8944
8944
|
};
|
8945
8945
|
|
8946
|
-
const componentName$
|
8946
|
+
const componentName$k = getComponentName('button-selection-group-internal');
|
8947
8947
|
|
8948
8948
|
class ButtonSelectionGroupInternalClass extends createBaseButtonSelectionGroupInternalClass(
|
8949
|
-
componentName$
|
8949
|
+
componentName$k
|
8950
8950
|
) {
|
8951
8951
|
getSelectedNode() {
|
8952
8952
|
return this.items.find((item) => item.hasAttribute('selected'));
|
@@ -9178,7 +9178,7 @@ const buttonSelectionGroupStyles = `
|
|
9178
9178
|
${resetInputCursor('vaadin-text-field')}
|
9179
9179
|
`;
|
9180
9180
|
|
9181
|
-
const componentName$
|
9181
|
+
const componentName$j = getComponentName('button-selection-group');
|
9182
9182
|
|
9183
9183
|
const buttonSelectionGroupMixin = (superclass) =>
|
9184
9184
|
class ButtonMultiSelectionGroupMixinClass extends superclass {
|
@@ -9187,19 +9187,19 @@ const buttonSelectionGroupMixin = (superclass) =>
|
|
9187
9187
|
const template = document.createElement('template');
|
9188
9188
|
|
9189
9189
|
template.innerHTML = `
|
9190
|
-
<${componentName$
|
9190
|
+
<${componentName$k}
|
9191
9191
|
name="button-selection-group"
|
9192
9192
|
slot="input"
|
9193
9193
|
tabindex="-1"
|
9194
9194
|
part="internal-component"
|
9195
9195
|
>
|
9196
9196
|
<slot></slot>
|
9197
|
-
</${componentName$
|
9197
|
+
</${componentName$k}>
|
9198
9198
|
`;
|
9199
9199
|
|
9200
9200
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
9201
9201
|
|
9202
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
9202
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$k);
|
9203
9203
|
|
9204
9204
|
forwardAttrs(this, this.inputElement, {
|
9205
9205
|
includeAttrs: ['size', 'default-value', 'allow-deselect'],
|
@@ -9224,11 +9224,11 @@ const ButtonSelectionGroupClass = compose(
|
|
9224
9224
|
wrappedEleName: 'vaadin-text-field',
|
9225
9225
|
style: () => buttonSelectionGroupStyles,
|
9226
9226
|
excludeAttrsSync: ['tabindex'],
|
9227
|
-
componentName: componentName$
|
9227
|
+
componentName: componentName$j,
|
9228
9228
|
})
|
9229
9229
|
);
|
9230
9230
|
|
9231
|
-
const globalRefs$
|
9231
|
+
const globalRefs$d = getThemeRefs(globals);
|
9232
9232
|
|
9233
9233
|
const createBaseButtonSelectionGroupMappings = (vars) => ({
|
9234
9234
|
[vars.hostDirection]: refs.direction,
|
@@ -9236,26 +9236,26 @@ const createBaseButtonSelectionGroupMappings = (vars) => ({
|
|
9236
9236
|
[vars.labelTextColor]: refs.labelTextColor,
|
9237
9237
|
[vars.labelRequiredIndicator]: refs.requiredIndicator,
|
9238
9238
|
[vars.errorMessageTextColor]: refs.errorMessageTextColor,
|
9239
|
-
[vars.itemsSpacing]: globalRefs$
|
9239
|
+
[vars.itemsSpacing]: globalRefs$d.spacing.sm,
|
9240
9240
|
[vars.hostWidth]: refs.width,
|
9241
9241
|
});
|
9242
9242
|
|
9243
|
-
const vars$
|
9243
|
+
const vars$h = ButtonSelectionGroupClass.cssVarList;
|
9244
9244
|
|
9245
9245
|
const buttonSelectionGroup = {
|
9246
|
-
...createBaseButtonSelectionGroupMappings(vars$
|
9246
|
+
...createBaseButtonSelectionGroupMappings(vars$h),
|
9247
9247
|
};
|
9248
9248
|
|
9249
9249
|
var buttonSelectionGroup$1 = /*#__PURE__*/Object.freeze({
|
9250
9250
|
__proto__: null,
|
9251
9251
|
default: buttonSelectionGroup,
|
9252
|
-
vars: vars$
|
9252
|
+
vars: vars$h
|
9253
9253
|
});
|
9254
9254
|
|
9255
|
-
const componentName$
|
9255
|
+
const componentName$i = getComponentName('button-multi-selection-group-internal');
|
9256
9256
|
|
9257
9257
|
class ButtonMultiSelectionGroupInternalClass extends createBaseButtonSelectionGroupInternalClass(
|
9258
|
-
componentName$
|
9258
|
+
componentName$i
|
9259
9259
|
) {
|
9260
9260
|
#getSelectedNodes() {
|
9261
9261
|
return this.items.filter((item) => item.hasAttribute('selected'));
|
@@ -9358,7 +9358,7 @@ class ButtonMultiSelectionGroupInternalClass extends createBaseButtonSelectionGr
|
|
9358
9358
|
}
|
9359
9359
|
}
|
9360
9360
|
|
9361
|
-
const componentName$
|
9361
|
+
const componentName$h = getComponentName('button-multi-selection-group');
|
9362
9362
|
|
9363
9363
|
const buttonMultiSelectionGroupMixin = (superclass) =>
|
9364
9364
|
class ButtonMultiSelectionGroupMixinClass extends superclass {
|
@@ -9367,19 +9367,19 @@ const buttonMultiSelectionGroupMixin = (superclass) =>
|
|
9367
9367
|
const template = document.createElement('template');
|
9368
9368
|
|
9369
9369
|
template.innerHTML = `
|
9370
|
-
<${componentName$
|
9370
|
+
<${componentName$i}
|
9371
9371
|
name="button-selection-group"
|
9372
9372
|
slot="input"
|
9373
9373
|
tabindex="-1"
|
9374
9374
|
part="internal-component"
|
9375
9375
|
>
|
9376
9376
|
<slot></slot>
|
9377
|
-
</${componentName$
|
9377
|
+
</${componentName$i}>
|
9378
9378
|
`;
|
9379
9379
|
|
9380
9380
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
9381
9381
|
|
9382
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
9382
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$i);
|
9383
9383
|
|
9384
9384
|
forwardAttrs(this, this.inputElement, {
|
9385
9385
|
includeAttrs: ['size', 'default-values', 'min-items-selection', 'max-items-selection'],
|
@@ -9404,25 +9404,25 @@ const ButtonMultiSelectionGroupClass = compose(
|
|
9404
9404
|
wrappedEleName: 'vaadin-text-field',
|
9405
9405
|
style: () => buttonSelectionGroupStyles,
|
9406
9406
|
excludeAttrsSync: ['tabindex'],
|
9407
|
-
componentName: componentName$
|
9407
|
+
componentName: componentName$h,
|
9408
9408
|
})
|
9409
9409
|
);
|
9410
9410
|
|
9411
|
-
const vars$
|
9411
|
+
const vars$g = ButtonMultiSelectionGroupClass.cssVarList;
|
9412
9412
|
|
9413
9413
|
const buttonMultiSelectionGroup = {
|
9414
|
-
...createBaseButtonSelectionGroupMappings(vars$
|
9414
|
+
...createBaseButtonSelectionGroupMappings(vars$g),
|
9415
9415
|
};
|
9416
9416
|
|
9417
9417
|
var buttonMultiSelectionGroup$1 = /*#__PURE__*/Object.freeze({
|
9418
9418
|
__proto__: null,
|
9419
9419
|
default: buttonMultiSelectionGroup,
|
9420
|
-
vars: vars$
|
9420
|
+
vars: vars$g
|
9421
9421
|
});
|
9422
9422
|
|
9423
|
-
const componentName$
|
9423
|
+
const componentName$g = getComponentName('modal');
|
9424
9424
|
|
9425
|
-
const customMixin$
|
9425
|
+
const customMixin$3 = (superclass) =>
|
9426
9426
|
class ModalMixinClass extends superclass {
|
9427
9427
|
get opened() {
|
9428
9428
|
return this.getAttribute('opened') === 'true';
|
@@ -9512,35 +9512,35 @@ const ModalClass = compose(
|
|
9512
9512
|
}),
|
9513
9513
|
draggableMixin,
|
9514
9514
|
componentNameValidationMixin,
|
9515
|
-
customMixin$
|
9515
|
+
customMixin$3
|
9516
9516
|
)(
|
9517
9517
|
createProxy({
|
9518
9518
|
slots: [''],
|
9519
9519
|
wrappedEleName: 'vaadin-dialog',
|
9520
9520
|
style: () => ``,
|
9521
9521
|
excludeAttrsSync: ['tabindex', 'opened'],
|
9522
|
-
componentName: componentName$
|
9522
|
+
componentName: componentName$g,
|
9523
9523
|
})
|
9524
9524
|
);
|
9525
9525
|
|
9526
|
-
const globalRefs$
|
9526
|
+
const globalRefs$c = getThemeRefs(globals);
|
9527
9527
|
|
9528
9528
|
const compVars$1 = ModalClass.cssVarList;
|
9529
9529
|
|
9530
9530
|
const modal = {
|
9531
|
-
[compVars$1.overlayBackgroundColor]: globalRefs$
|
9532
|
-
[compVars$1.overlayShadow]: globalRefs$
|
9531
|
+
[compVars$1.overlayBackgroundColor]: globalRefs$c.colors.surface.main,
|
9532
|
+
[compVars$1.overlayShadow]: globalRefs$c.shadow.wide['2xl'],
|
9533
9533
|
[compVars$1.overlayWidth]: '540px',
|
9534
9534
|
};
|
9535
9535
|
|
9536
|
-
const vars$
|
9536
|
+
const vars$f = {
|
9537
9537
|
...compVars$1,
|
9538
9538
|
};
|
9539
9539
|
|
9540
9540
|
var modal$1 = /*#__PURE__*/Object.freeze({
|
9541
9541
|
__proto__: null,
|
9542
9542
|
default: modal,
|
9543
|
-
vars: vars$
|
9543
|
+
vars: vars$f
|
9544
9544
|
});
|
9545
9545
|
|
9546
9546
|
const isValidDataType = (data) => {
|
@@ -9553,7 +9553,7 @@ const isValidDataType = (data) => {
|
|
9553
9553
|
return isValid;
|
9554
9554
|
};
|
9555
9555
|
|
9556
|
-
const componentName$
|
9556
|
+
const componentName$f = getComponentName('grid');
|
9557
9557
|
|
9558
9558
|
const GridMixin = (superclass) =>
|
9559
9559
|
class GridMixinClass extends superclass {
|
@@ -9789,40 +9789,40 @@ const GridClass = compose(
|
|
9789
9789
|
}
|
9790
9790
|
`,
|
9791
9791
|
excludeAttrsSync: ['columns', 'tabindex'],
|
9792
|
-
componentName: componentName$
|
9792
|
+
componentName: componentName$f,
|
9793
9793
|
})
|
9794
9794
|
);
|
9795
9795
|
|
9796
|
-
const globalRefs$
|
9797
|
-
const vars$
|
9796
|
+
const globalRefs$b = getThemeRefs(globals);
|
9797
|
+
const vars$e = GridClass.cssVarList;
|
9798
9798
|
|
9799
9799
|
const grid = {
|
9800
|
-
[vars$
|
9801
|
-
[vars$
|
9802
|
-
[vars$
|
9803
|
-
[vars$
|
9804
|
-
[vars$
|
9800
|
+
[vars$e.hostWidth]: '100%',
|
9801
|
+
[vars$e.hostHeight]: '100%',
|
9802
|
+
[vars$e.hostMinHeight]: '400px',
|
9803
|
+
[vars$e.fontWeight]: '400',
|
9804
|
+
[vars$e.backgroundColor]: globalRefs$b.colors.surface.main,
|
9805
9805
|
|
9806
|
-
[vars$
|
9807
|
-
[vars$
|
9806
|
+
[vars$e.fontSize]: refs.fontSize,
|
9807
|
+
[vars$e.fontFamily]: refs.fontFamily,
|
9808
9808
|
|
9809
|
-
[vars$
|
9810
|
-
[vars$
|
9811
|
-
[vars$
|
9809
|
+
[vars$e.sortIndicatorsColor]: globalRefs$b.colors.surface.light,
|
9810
|
+
[vars$e.activeSortIndicator]: globalRefs$b.colors.surface.dark,
|
9811
|
+
[vars$e.resizeHandleColor]: globalRefs$b.colors.surface.light,
|
9812
9812
|
|
9813
|
-
[vars$
|
9814
|
-
[vars$
|
9815
|
-
[vars$
|
9816
|
-
[vars$
|
9813
|
+
[vars$e.borderWidth]: refs.borderWidth,
|
9814
|
+
[vars$e.borderStyle]: refs.borderStyle,
|
9815
|
+
[vars$e.borderRadius]: refs.borderRadius,
|
9816
|
+
[vars$e.borderColor]: 'transparent',
|
9817
9817
|
|
9818
|
-
[vars$
|
9819
|
-
[vars$
|
9818
|
+
[vars$e.headerRowTextColor]: globalRefs$b.colors.surface.dark,
|
9819
|
+
[vars$e.separatorColor]: globalRefs$b.colors.surface.light,
|
9820
9820
|
|
9821
|
-
[vars$
|
9822
|
-
[vars$
|
9821
|
+
[vars$e.valueTextColor]: globalRefs$b.colors.surface.contrast,
|
9822
|
+
[vars$e.selectedBackgroundColor]: globalRefs$b.colors.surface.highlight,
|
9823
9823
|
|
9824
9824
|
_bordered: {
|
9825
|
-
[vars$
|
9825
|
+
[vars$e.borderColor]: refs.borderColor,
|
9826
9826
|
},
|
9827
9827
|
};
|
9828
9828
|
|
@@ -9830,10 +9830,10 @@ var grid$1 = /*#__PURE__*/Object.freeze({
|
|
9830
9830
|
__proto__: null,
|
9831
9831
|
default: grid,
|
9832
9832
|
grid: grid,
|
9833
|
-
vars: vars$
|
9833
|
+
vars: vars$e
|
9834
9834
|
});
|
9835
9835
|
|
9836
|
-
const componentName$
|
9836
|
+
const componentName$e = getComponentName('notification-card');
|
9837
9837
|
|
9838
9838
|
const notificationCardMixin = (superclass) =>
|
9839
9839
|
class NotificationCardMixinClass extends superclass {
|
@@ -9941,54 +9941,54 @@ const NotificationCardClass = compose(
|
|
9941
9941
|
}
|
9942
9942
|
`,
|
9943
9943
|
excludeAttrsSync: ['tabindex'],
|
9944
|
-
componentName: componentName$
|
9944
|
+
componentName: componentName$e,
|
9945
9945
|
})
|
9946
9946
|
);
|
9947
9947
|
|
9948
|
-
const globalRefs$
|
9949
|
-
const vars$
|
9948
|
+
const globalRefs$a = getThemeRefs(globals);
|
9949
|
+
const vars$d = NotificationCardClass.cssVarList;
|
9950
9950
|
|
9951
9951
|
const shadowColor = '#00000020';
|
9952
9952
|
|
9953
9953
|
const notification = {
|
9954
|
-
[vars$
|
9955
|
-
[vars$
|
9956
|
-
[vars$
|
9957
|
-
[vars$
|
9958
|
-
[vars$
|
9959
|
-
[vars$
|
9960
|
-
[vars$
|
9961
|
-
[vars$
|
9962
|
-
[vars$
|
9954
|
+
[vars$d.hostMinWidth]: '415px',
|
9955
|
+
[vars$d.fontFamily]: globalRefs$a.fonts.font1.family,
|
9956
|
+
[vars$d.fontSize]: globalRefs$a.typography.body1.size,
|
9957
|
+
[vars$d.backgroundColor]: globalRefs$a.colors.surface.main,
|
9958
|
+
[vars$d.textColor]: globalRefs$a.colors.surface.contrast,
|
9959
|
+
[vars$d.boxShadow]: `${globalRefs$a.shadow.wide.xl} ${shadowColor}, ${globalRefs$a.shadow.narrow.xl} ${shadowColor}`,
|
9960
|
+
[vars$d.verticalPadding]: '0.625em',
|
9961
|
+
[vars$d.horizontalPadding]: '1.5em',
|
9962
|
+
[vars$d.borderRadius]: globalRefs$a.radius.xs,
|
9963
9963
|
|
9964
9964
|
_bordered: {
|
9965
|
-
[vars$
|
9966
|
-
[vars$
|
9967
|
-
[vars$
|
9965
|
+
[vars$d.borderWidth]: globalRefs$a.border.sm,
|
9966
|
+
[vars$d.borderStyle]: 'solid',
|
9967
|
+
[vars$d.borderColor]: 'transparent',
|
9968
9968
|
},
|
9969
9969
|
|
9970
9970
|
size: {
|
9971
|
-
xs: { [vars$
|
9972
|
-
sm: { [vars$
|
9973
|
-
md: { [vars$
|
9974
|
-
lg: { [vars$
|
9971
|
+
xs: { [vars$d.fontSize]: '12px' },
|
9972
|
+
sm: { [vars$d.fontSize]: '14px' },
|
9973
|
+
md: { [vars$d.fontSize]: '16px' },
|
9974
|
+
lg: { [vars$d.fontSize]: '18px' },
|
9975
9975
|
},
|
9976
9976
|
|
9977
9977
|
mode: {
|
9978
9978
|
primary: {
|
9979
|
-
[vars$
|
9980
|
-
[vars$
|
9981
|
-
[vars$
|
9979
|
+
[vars$d.backgroundColor]: globalRefs$a.colors.primary.main,
|
9980
|
+
[vars$d.textColor]: globalRefs$a.colors.primary.contrast,
|
9981
|
+
[vars$d.borderColor]: globalRefs$a.colors.primary.light,
|
9982
9982
|
},
|
9983
9983
|
success: {
|
9984
|
-
[vars$
|
9985
|
-
[vars$
|
9986
|
-
[vars$
|
9984
|
+
[vars$d.backgroundColor]: globalRefs$a.colors.success.main,
|
9985
|
+
[vars$d.textColor]: globalRefs$a.colors.success.contrast,
|
9986
|
+
[vars$d.borderColor]: globalRefs$a.colors.success.light,
|
9987
9987
|
},
|
9988
9988
|
error: {
|
9989
|
-
[vars$
|
9990
|
-
[vars$
|
9991
|
-
[vars$
|
9989
|
+
[vars$d.backgroundColor]: globalRefs$a.colors.error.main,
|
9990
|
+
[vars$d.textColor]: globalRefs$a.colors.error.contrast,
|
9991
|
+
[vars$d.borderColor]: globalRefs$a.colors.error.light,
|
9992
9992
|
},
|
9993
9993
|
},
|
9994
9994
|
};
|
@@ -9996,10 +9996,10 @@ const notification = {
|
|
9996
9996
|
var notificationCard = /*#__PURE__*/Object.freeze({
|
9997
9997
|
__proto__: null,
|
9998
9998
|
default: notification,
|
9999
|
-
vars: vars$
|
9999
|
+
vars: vars$d
|
10000
10000
|
});
|
10001
10001
|
|
10002
|
-
const componentName$
|
10002
|
+
const componentName$d = getComponentName('multi-select-combo-box');
|
10003
10003
|
|
10004
10004
|
const multiSelectComboBoxMixin = (superclass) =>
|
10005
10005
|
class MultiSelectComboBoxMixinClass extends superclass {
|
@@ -10603,73 +10603,73 @@ const MultiSelectComboBoxClass = compose(
|
|
10603
10603
|
// Note: we exclude `placeholder` because the vaadin component observes it and
|
10604
10604
|
// tries to override it, causing us to lose the user set placeholder.
|
10605
10605
|
excludeAttrsSync: ['tabindex', 'size', 'data', 'placeholder'],
|
10606
|
-
componentName: componentName$
|
10606
|
+
componentName: componentName$d,
|
10607
10607
|
includeForwardProps: ['items', 'renderer', 'selectedItems'],
|
10608
10608
|
})
|
10609
10609
|
);
|
10610
10610
|
|
10611
|
-
const globalRefs$
|
10612
|
-
const vars$
|
10611
|
+
const globalRefs$9 = getThemeRefs(globals);
|
10612
|
+
const vars$c = MultiSelectComboBoxClass.cssVarList;
|
10613
10613
|
|
10614
10614
|
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$
|
10615
|
+
[vars$c.hostWidth]: refs.width,
|
10616
|
+
[vars$c.hostDirection]: refs.direction,
|
10617
|
+
[vars$c.fontSize]: refs.fontSize,
|
10618
|
+
[vars$c.fontFamily]: refs.fontFamily,
|
10619
|
+
[vars$c.labelTextColor]: refs.labelTextColor,
|
10620
|
+
[vars$c.errorMessageTextColor]: refs.errorMessageTextColor,
|
10621
|
+
[vars$c.inputBorderColor]: refs.borderColor,
|
10622
|
+
[vars$c.inputBorderWidth]: refs.borderWidth,
|
10623
|
+
[vars$c.inputBorderStyle]: refs.borderStyle,
|
10624
|
+
[vars$c.inputBorderRadius]: refs.borderRadius,
|
10625
|
+
[vars$c.inputOutlineColor]: refs.outlineColor,
|
10626
|
+
[vars$c.inputOutlineOffset]: refs.outlineOffset,
|
10627
|
+
[vars$c.inputOutlineWidth]: refs.outlineWidth,
|
10628
|
+
[vars$c.inputOutlineStyle]: refs.outlineStyle,
|
10629
|
+
[vars$c.labelRequiredIndicator]: refs.requiredIndicator,
|
10630
|
+
[vars$c.inputValueTextColor]: refs.valueTextColor,
|
10631
|
+
[vars$c.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
10632
|
+
[vars$c.inputBackgroundColor]: refs.backgroundColor,
|
10633
|
+
[vars$c.inputHorizontalPadding]: refs.horizontalPadding,
|
10634
|
+
[vars$c.inputVerticalPadding]: refs.verticalPadding,
|
10635
|
+
[vars$c.inputHeight]: refs.inputHeight,
|
10636
|
+
[vars$c.inputDropdownButtonColor]: globalRefs$9.colors.surface.dark,
|
10637
|
+
[vars$c.inputDropdownButtonCursor]: 'pointer',
|
10638
|
+
[vars$c.inputDropdownButtonSize]: refs.toggleButtonSize,
|
10639
|
+
[vars$c.inputDropdownButtonOffset]: globalRefs$9.spacing.xs,
|
10640
|
+
[vars$c.overlayItemPaddingInlineStart]: globalRefs$9.spacing.xs,
|
10641
|
+
[vars$c.overlayItemPaddingInlineEnd]: globalRefs$9.spacing.lg,
|
10642
|
+
[vars$c.chipFontSize]: refs.chipFontSize,
|
10643
|
+
[vars$c.chipTextColor]: globalRefs$9.colors.surface.contrast,
|
10644
|
+
[vars$c.chipBackgroundColor]: globalRefs$9.colors.surface.light,
|
10645
10645
|
|
10646
10646
|
_readonly: {
|
10647
|
-
[vars$
|
10647
|
+
[vars$c.inputDropdownButtonCursor]: 'default',
|
10648
10648
|
},
|
10649
10649
|
|
10650
10650
|
// Overlay theme exposed via the component:
|
10651
|
-
[vars$
|
10652
|
-
[vars$
|
10653
|
-
[vars$
|
10654
|
-
[vars$
|
10655
|
-
[vars$
|
10656
|
-
[vars$
|
10651
|
+
[vars$c.overlayFontSize]: refs.fontSize,
|
10652
|
+
[vars$c.overlayFontFamily]: refs.fontFamily,
|
10653
|
+
[vars$c.overlayCursor]: 'pointer',
|
10654
|
+
[vars$c.overlayItemBoxShadow]: 'none',
|
10655
|
+
[vars$c.overlayBackground]: refs.backgroundColor,
|
10656
|
+
[vars$c.overlayTextColor]: refs.valueTextColor,
|
10657
10657
|
|
10658
10658
|
// Overlay direct theme:
|
10659
|
-
[vars$
|
10660
|
-
[vars$
|
10659
|
+
[vars$c.overlay.minHeight]: '400px',
|
10660
|
+
[vars$c.overlay.margin]: '0',
|
10661
10661
|
};
|
10662
10662
|
|
10663
10663
|
var multiSelectComboBox$1 = /*#__PURE__*/Object.freeze({
|
10664
10664
|
__proto__: null,
|
10665
10665
|
default: multiSelectComboBox,
|
10666
10666
|
multiSelectComboBox: multiSelectComboBox,
|
10667
|
-
vars: vars$
|
10667
|
+
vars: vars$c
|
10668
10668
|
});
|
10669
10669
|
|
10670
|
-
const componentName$
|
10670
|
+
const componentName$c = getComponentName('badge');
|
10671
10671
|
|
10672
|
-
class RawBadge extends createBaseClass({ componentName: componentName$
|
10672
|
+
class RawBadge extends createBaseClass({ componentName: componentName$c, baseSelector: ':host > div' }) {
|
10673
10673
|
constructor() {
|
10674
10674
|
super();
|
10675
10675
|
|
@@ -10720,66 +10720,66 @@ const BadgeClass = compose(
|
|
10720
10720
|
componentNameValidationMixin
|
10721
10721
|
)(RawBadge);
|
10722
10722
|
|
10723
|
-
const globalRefs$
|
10724
|
-
const vars$
|
10723
|
+
const globalRefs$8 = getThemeRefs(globals);
|
10724
|
+
const vars$b = BadgeClass.cssVarList;
|
10725
10725
|
|
10726
10726
|
const badge$2 = {
|
10727
|
-
[vars$
|
10728
|
-
[vars$
|
10727
|
+
[vars$b.hostWidth]: 'fit-content',
|
10728
|
+
[vars$b.hostDirection]: globalRefs$8.direction,
|
10729
10729
|
|
10730
|
-
[vars$
|
10730
|
+
[vars$b.textAlign]: 'center',
|
10731
10731
|
|
10732
|
-
[vars$
|
10733
|
-
[vars$
|
10732
|
+
[vars$b.fontFamily]: globalRefs$8.fonts.font1.family,
|
10733
|
+
[vars$b.fontWeight]: '400',
|
10734
10734
|
|
10735
|
-
[vars$
|
10736
|
-
[vars$
|
10735
|
+
[vars$b.verticalPadding]: '0.25em',
|
10736
|
+
[vars$b.horizontalPadding]: '0.5em',
|
10737
10737
|
|
10738
|
-
[vars$
|
10739
|
-
[vars$
|
10740
|
-
[vars$
|
10741
|
-
[vars$
|
10738
|
+
[vars$b.borderWidth]: globalRefs$8.border.xs,
|
10739
|
+
[vars$b.borderRadius]: globalRefs$8.radius.xs,
|
10740
|
+
[vars$b.borderColor]: 'transparent',
|
10741
|
+
[vars$b.borderStyle]: 'solid',
|
10742
10742
|
|
10743
10743
|
_fullWidth: {
|
10744
|
-
[vars$
|
10744
|
+
[vars$b.hostWidth]: '100%',
|
10745
10745
|
},
|
10746
10746
|
|
10747
10747
|
size: {
|
10748
|
-
xs: { [vars$
|
10749
|
-
sm: { [vars$
|
10750
|
-
md: { [vars$
|
10751
|
-
lg: { [vars$
|
10748
|
+
xs: { [vars$b.fontSize]: '12px' },
|
10749
|
+
sm: { [vars$b.fontSize]: '14px' },
|
10750
|
+
md: { [vars$b.fontSize]: '16px' },
|
10751
|
+
lg: { [vars$b.fontSize]: '18px' },
|
10752
10752
|
},
|
10753
10753
|
|
10754
10754
|
mode: {
|
10755
10755
|
default: {
|
10756
|
-
[vars$
|
10756
|
+
[vars$b.textColor]: globalRefs$8.colors.surface.dark,
|
10757
10757
|
_bordered: {
|
10758
|
-
[vars$
|
10758
|
+
[vars$b.borderColor]: globalRefs$8.colors.surface.light,
|
10759
10759
|
},
|
10760
10760
|
},
|
10761
10761
|
primary: {
|
10762
|
-
[vars$
|
10762
|
+
[vars$b.textColor]: globalRefs$8.colors.primary.main,
|
10763
10763
|
_bordered: {
|
10764
|
-
[vars$
|
10764
|
+
[vars$b.borderColor]: globalRefs$8.colors.primary.light,
|
10765
10765
|
},
|
10766
10766
|
},
|
10767
10767
|
secondary: {
|
10768
|
-
[vars$
|
10768
|
+
[vars$b.textColor]: globalRefs$8.colors.secondary.main,
|
10769
10769
|
_bordered: {
|
10770
|
-
[vars$
|
10770
|
+
[vars$b.borderColor]: globalRefs$8.colors.secondary.light,
|
10771
10771
|
},
|
10772
10772
|
},
|
10773
10773
|
error: {
|
10774
|
-
[vars$
|
10774
|
+
[vars$b.textColor]: globalRefs$8.colors.error.main,
|
10775
10775
|
_bordered: {
|
10776
|
-
[vars$
|
10776
|
+
[vars$b.borderColor]: globalRefs$8.colors.error.light,
|
10777
10777
|
},
|
10778
10778
|
},
|
10779
10779
|
success: {
|
10780
|
-
[vars$
|
10780
|
+
[vars$b.textColor]: globalRefs$8.colors.success.main,
|
10781
10781
|
_bordered: {
|
10782
|
-
[vars$
|
10782
|
+
[vars$b.borderColor]: globalRefs$8.colors.success.light,
|
10783
10783
|
},
|
10784
10784
|
},
|
10785
10785
|
},
|
@@ -10788,11 +10788,11 @@ const badge$2 = {
|
|
10788
10788
|
var badge$3 = /*#__PURE__*/Object.freeze({
|
10789
10789
|
__proto__: null,
|
10790
10790
|
default: badge$2,
|
10791
|
-
vars: vars$
|
10791
|
+
vars: vars$b
|
10792
10792
|
});
|
10793
10793
|
|
10794
|
-
const componentName$
|
10795
|
-
class RawAvatar extends createBaseClass({ componentName: componentName$
|
10794
|
+
const componentName$b = getComponentName('avatar');
|
10795
|
+
class RawAvatar extends createBaseClass({ componentName: componentName$b, baseSelector: ':host > .wrapper' }) {
|
10796
10796
|
constructor() {
|
10797
10797
|
super();
|
10798
10798
|
|
@@ -10893,16 +10893,16 @@ const AvatarClass = compose(
|
|
10893
10893
|
componentNameValidationMixin
|
10894
10894
|
)(RawAvatar);
|
10895
10895
|
|
10896
|
-
const globalRefs$
|
10896
|
+
const globalRefs$7 = getThemeRefs(globals);
|
10897
10897
|
const compVars = AvatarClass.cssVarList;
|
10898
10898
|
|
10899
10899
|
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$
|
10900
|
+
[compVars.hostDirection]: globalRefs$7.direction,
|
10901
|
+
[compVars.editableIconColor]: globalRefs$7.colors.surface.dark,
|
10902
|
+
[compVars.editableBorderColor]: globalRefs$7.colors.surface.dark,
|
10903
|
+
[compVars.editableBackgroundColor]: globalRefs$7.colors.surface.main,
|
10904
|
+
[compVars.avatarTextColor]: globalRefs$7.colors.surface.main,
|
10905
|
+
[compVars.avatarBackgroundColor]: globalRefs$7.colors.surface.dark,
|
10906
10906
|
|
10907
10907
|
_editable: {
|
10908
10908
|
[compVars.cursor]: 'pointer',
|
@@ -10928,23 +10928,23 @@ const avatar = {
|
|
10928
10928
|
},
|
10929
10929
|
};
|
10930
10930
|
|
10931
|
-
const vars$
|
10931
|
+
const vars$a = {
|
10932
10932
|
...compVars,
|
10933
10933
|
};
|
10934
10934
|
|
10935
10935
|
var avatar$1 = /*#__PURE__*/Object.freeze({
|
10936
10936
|
__proto__: null,
|
10937
10937
|
default: avatar,
|
10938
|
-
vars: vars$
|
10938
|
+
vars: vars$a
|
10939
10939
|
});
|
10940
10940
|
|
10941
|
-
const componentName$
|
10941
|
+
const componentName$a = getComponentName('mappings-field-internal');
|
10942
10942
|
|
10943
|
-
createBaseInputClass({ componentName: componentName$
|
10943
|
+
createBaseInputClass({ componentName: componentName$a, baseSelector: 'div' });
|
10944
10944
|
|
10945
|
-
const componentName$
|
10945
|
+
const componentName$9 = getComponentName('mappings-field');
|
10946
10946
|
|
10947
|
-
const customMixin$
|
10947
|
+
const customMixin$2 = (superclass) =>
|
10948
10948
|
class MappingsFieldMixinClass extends superclass {
|
10949
10949
|
get defaultValues() {
|
10950
10950
|
const defaultValuesAttr = this.getAttribute('default-values');
|
@@ -10971,14 +10971,14 @@ const customMixin$1 = (superclass) =>
|
|
10971
10971
|
const template = document.createElement('template');
|
10972
10972
|
|
10973
10973
|
template.innerHTML = `
|
10974
|
-
<${componentName$
|
10974
|
+
<${componentName$a}
|
10975
10975
|
tabindex="-1"
|
10976
|
-
></${componentName$
|
10976
|
+
></${componentName$a}>
|
10977
10977
|
`;
|
10978
10978
|
|
10979
10979
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
10980
10980
|
|
10981
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
10981
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$a);
|
10982
10982
|
|
10983
10983
|
forwardAttrs(this, this.inputElement, {
|
10984
10984
|
includeAttrs: [
|
@@ -11060,7 +11060,7 @@ const MappingsFieldClass = compose(
|
|
11060
11060
|
proxyParentValidation: true,
|
11061
11061
|
}),
|
11062
11062
|
componentNameValidationMixin,
|
11063
|
-
customMixin$
|
11063
|
+
customMixin$2
|
11064
11064
|
)(
|
11065
11065
|
createProxy({
|
11066
11066
|
slots: [],
|
@@ -11107,47 +11107,47 @@ const MappingsFieldClass = compose(
|
|
11107
11107
|
'options',
|
11108
11108
|
'error-message',
|
11109
11109
|
],
|
11110
|
-
componentName: componentName$
|
11110
|
+
componentName: componentName$9,
|
11111
11111
|
})
|
11112
11112
|
);
|
11113
11113
|
|
11114
|
-
const globalRefs$
|
11114
|
+
const globalRefs$6 = getThemeRefs(globals);
|
11115
11115
|
|
11116
|
-
const vars$
|
11116
|
+
const vars$9 = MappingsFieldClass.cssVarList;
|
11117
11117
|
|
11118
11118
|
const mappingsField = {
|
11119
|
-
[vars$
|
11120
|
-
[vars$
|
11121
|
-
[vars$
|
11122
|
-
[vars$
|
11123
|
-
[vars$
|
11124
|
-
[vars$
|
11125
|
-
[vars$
|
11126
|
-
[vars$
|
11127
|
-
[vars$
|
11128
|
-
[vars$
|
11119
|
+
[vars$9.hostWidth]: refs.width,
|
11120
|
+
[vars$9.hostDirection]: refs.direction,
|
11121
|
+
[vars$9.fontSize]: refs.fontSize,
|
11122
|
+
[vars$9.fontFamily]: refs.fontFamily,
|
11123
|
+
[vars$9.separatorFontSize]: '14px',
|
11124
|
+
[vars$9.labelsFontSize]: '14px',
|
11125
|
+
[vars$9.labelsLineHeight]: '1',
|
11126
|
+
[vars$9.labelsMarginBottom]: '6px',
|
11127
|
+
[vars$9.labelTextColor]: refs.labelTextColor,
|
11128
|
+
[vars$9.itemMarginBottom]: '1em',
|
11129
11129
|
// To be positioned correctly, the min width has to match the text field min width
|
11130
|
-
[vars$
|
11130
|
+
[vars$9.valueLabelMinWidth]: refs.minWidth,
|
11131
11131
|
// To be positioned correctly, the min width has to match the combo box field min width
|
11132
|
-
[vars$
|
11133
|
-
[vars$
|
11134
|
-
[vars$
|
11132
|
+
[vars$9.attrLabelMinWidth]: `calc(12em + 2 * ${globalRefs$6.border.xs})`,
|
11133
|
+
[vars$9.separatorWidth]: '70px',
|
11134
|
+
[vars$9.removeButtonWidth]: '60px',
|
11135
11135
|
};
|
11136
11136
|
|
11137
11137
|
var mappingsField$1 = /*#__PURE__*/Object.freeze({
|
11138
11138
|
__proto__: null,
|
11139
11139
|
default: mappingsField,
|
11140
11140
|
mappingsField: mappingsField,
|
11141
|
-
vars: vars$
|
11141
|
+
vars: vars$9
|
11142
11142
|
});
|
11143
11143
|
|
11144
11144
|
var deleteIcon = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iMTgiIHZpZXdCb3g9IjAgMCAxNCAxOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEgMTZDMSAxNy4xIDEuOSAxOCAzIDE4SDExQzEyLjEgMTggMTMgMTcuMSAxMyAxNlY0SDFWMTZaTTMgNkgxMVYxNkgzVjZaTTEwLjUgMUw5LjUgMEg0LjVMMy41IDFIMFYzSDE0VjFIMTAuNVoiIGZpbGw9ImN1cnJlbnRjb2xvciIvPgo8L3N2Zz4K";
|
11145
11145
|
|
11146
11146
|
var editIcon = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTUiIGhlaWdodD0iMTUiIHZpZXdCb3g9IjAgMCAxNSAxNSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEwLjAwMDIgMC45OTIxNDlDMTAuMDAwMiAxLjAxNjE1IDEwLjAwMDIgMS4wMTYxNSAxMC4wMDAyIDEuMDE2MTVMOC4yMjQxOSAzLjAwODE1SDIuOTkyMTlDMi40NjQxOSAzLjAwODE1IDIuMDA4MTkgMy40NDAxNSAyLjAwODE5IDMuOTkyMTVWMTIuMDA4MkMyLjAwODE5IDEyLjUzNjIgMi40NDAxOSAxMi45OTIyIDIuOTkyMTkgMTIuOTkyMkg1LjUzNjE5QzUuODQ4MTkgMTMuMDQwMiA2LjE2MDE5IDEzLjA0MDIgNi40NzIxOSAxMi45OTIySDExLjAwODJDMTEuNTM2MiAxMi45OTIyIDExLjk5MjIgMTIuNTYwMiAxMS45OTIyIDEyLjAwODJWNy43ODQxNkwxMy45MzYyIDUuNjI0MTVMMTQuMDA4MiA1LjY3MjE1VjExLjk4NDJDMTQuMDA4MiAxMy42NjQyIDEyLjY2NDIgMTUuMDA4MiAxMS4wMDgyIDE1LjAwODJIMy4wMTYxOUMxLjMzNjE5IDE1LjAwODIgLTAuMDA3ODEyNSAxMy42NjQyIC0wLjAwNzgxMjUgMTEuOTg0MlYzLjk5MjE1Qy0wLjAwNzgxMjUgMi4zMzYxNSAxLjMzNjE5IDAuOTkyMTQ5IDMuMDE2MTkgMC45OTIxNDlIMTAuMDAwMlpNMTEuMjcyMiAyLjYyNDE1TDEyLjYxNjIgNC4xMTIxNUw3LjcyMDE5IDkuNjgwMTZDNy41MDQxOSA5LjkyMDE2IDYuODMyMTkgMTAuMjMyMiA1LjY4MDE5IDEwLjYxNjJDNS42NTYxOSAxMC42NDAyIDUuNjA4MTkgMTAuNjQwMiA1LjU2MDE5IDEwLjYxNjJDNS40NjQxOSAxMC41OTIyIDUuMzkyMTkgMTAuNDcyMiA1LjQ0MDE5IDEwLjM3NjJDNS43NTIxOSA5LjI0ODE2IDYuMDQwMTkgOC41NTIxNiA2LjI1NjE5IDguMzEyMTZMMTEuMjcyMiAyLjYyNDE1Wk0xMS45MjAyIDEuODU2MTVMMTMuMjg4MiAwLjMyMDE0OUMxMy42NDgyIC0wLjA4Nzg1MTYgMTQuMjcyMiAtMC4xMTE4NTIgMTQuNjgwMiAwLjI3MjE0OUMxNS4wODgyIDAuNjMyMTQ5IDE1LjExMjIgMS4yODAxNSAxNC43NTIyIDEuNjg4MTVMMTMuMjY0MiAzLjM2ODE1TDExLjkyMDIgMS44NTYxNVoiIGZpbGw9ImN1cnJlbnRjb2xvciIvPgo8L3N2Zz4K";
|
11147
11147
|
|
11148
|
-
const componentName$
|
11148
|
+
const componentName$8 = getComponentName('user-attribute');
|
11149
11149
|
class RawUserAttribute extends createBaseClass({
|
11150
|
-
componentName: componentName$
|
11150
|
+
componentName: componentName$8,
|
11151
11151
|
baseSelector: ':host > .root',
|
11152
11152
|
}) {
|
11153
11153
|
constructor() {
|
@@ -11377,32 +11377,32 @@ const UserAttributeClass = compose(
|
|
11377
11377
|
componentNameValidationMixin
|
11378
11378
|
)(RawUserAttribute);
|
11379
11379
|
|
11380
|
-
const globalRefs$
|
11381
|
-
const vars$
|
11380
|
+
const globalRefs$5 = getThemeRefs(globals);
|
11381
|
+
const vars$8 = UserAttributeClass.cssVarList;
|
11382
11382
|
|
11383
11383
|
const userAttribute = {
|
11384
|
-
[vars$
|
11385
|
-
[vars$
|
11386
|
-
[vars$
|
11387
|
-
[vars$
|
11388
|
-
[vars$
|
11389
|
-
[vars$
|
11384
|
+
[vars$8.hostDirection]: globalRefs$5.direction,
|
11385
|
+
[vars$8.labelTextWidth]: '150px',
|
11386
|
+
[vars$8.valueTextWidth]: '200px',
|
11387
|
+
[vars$8.badgeMaxWidth]: '85px',
|
11388
|
+
[vars$8.itemsGap]: '16px',
|
11389
|
+
[vars$8.hostMinWidth]: '530px',
|
11390
11390
|
_fullWidth: {
|
11391
|
-
[vars$
|
11391
|
+
[vars$8.hostWidth]: '100%',
|
11392
11392
|
},
|
11393
11393
|
};
|
11394
11394
|
|
11395
11395
|
var userAttribute$1 = /*#__PURE__*/Object.freeze({
|
11396
11396
|
__proto__: null,
|
11397
11397
|
default: userAttribute,
|
11398
|
-
vars: vars$
|
11398
|
+
vars: vars$8
|
11399
11399
|
});
|
11400
11400
|
|
11401
11401
|
var greenVIcon = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTggMEMzLjYgMCAwIDMuNiAwIDhDMCAxMi40IDMuNiAxNiA4IDE2QzEyLjQgMTYgMTYgMTIuNCAxNiA4QzE2IDMuNiAxMi40IDAgOCAwWk03LjEgMTEuN0wyLjkgNy42TDQuMyA2LjJMNyA4LjlMMTIgNEwxMy40IDUuNEw3LjEgMTEuN1oiIGZpbGw9IiM0Q0FGNTAiLz4KPC9zdmc+Cg==";
|
11402
11402
|
|
11403
|
-
const componentName$
|
11403
|
+
const componentName$7 = getComponentName('user-auth-method');
|
11404
11404
|
class RawUserAuthMethod extends createBaseClass({
|
11405
|
-
componentName: componentName$
|
11405
|
+
componentName: componentName$7,
|
11406
11406
|
baseSelector: ':host > .root',
|
11407
11407
|
}) {
|
11408
11408
|
constructor() {
|
@@ -11594,33 +11594,33 @@ const UserAuthMethodClass = compose(
|
|
11594
11594
|
componentNameValidationMixin
|
11595
11595
|
)(RawUserAuthMethod);
|
11596
11596
|
|
11597
|
-
const globalRefs$
|
11598
|
-
const vars$
|
11597
|
+
const globalRefs$4 = getThemeRefs(globals);
|
11598
|
+
const vars$7 = UserAuthMethodClass.cssVarList;
|
11599
11599
|
|
11600
11600
|
const userAuthMethod = {
|
11601
|
-
[vars$
|
11602
|
-
[vars$
|
11603
|
-
[vars$
|
11604
|
-
[vars$
|
11605
|
-
[vars$
|
11601
|
+
[vars$7.hostDirection]: globalRefs$4.direction,
|
11602
|
+
[vars$7.labelTextWidth]: '200px',
|
11603
|
+
[vars$7.itemsGap]: '16px',
|
11604
|
+
[vars$7.hostMinWidth]: '530px',
|
11605
|
+
[vars$7.iconSize]: '24px',
|
11606
11606
|
_fullWidth: {
|
11607
|
-
[vars$
|
11607
|
+
[vars$7.hostWidth]: '100%',
|
11608
11608
|
},
|
11609
11609
|
};
|
11610
11610
|
|
11611
11611
|
var userAuthMethod$1 = /*#__PURE__*/Object.freeze({
|
11612
11612
|
__proto__: null,
|
11613
11613
|
default: userAuthMethod,
|
11614
|
-
vars: vars$
|
11614
|
+
vars: vars$7
|
11615
11615
|
});
|
11616
11616
|
|
11617
|
-
const componentName$
|
11617
|
+
const componentName$6 = getComponentName('saml-group-mappings-internal');
|
11618
11618
|
|
11619
|
-
createBaseInputClass({ componentName: componentName$
|
11619
|
+
createBaseInputClass({ componentName: componentName$6, baseSelector: '' });
|
11620
11620
|
|
11621
|
-
const componentName$
|
11621
|
+
const componentName$5 = getComponentName('saml-group-mappings');
|
11622
11622
|
|
11623
|
-
const customMixin = (superclass) =>
|
11623
|
+
const customMixin$1 = (superclass) =>
|
11624
11624
|
class SamlGroupMappingsMixinClass extends superclass {
|
11625
11625
|
init() {
|
11626
11626
|
super.init?.();
|
@@ -11628,14 +11628,14 @@ const customMixin = (superclass) =>
|
|
11628
11628
|
const template = document.createElement('template');
|
11629
11629
|
|
11630
11630
|
template.innerHTML = `
|
11631
|
-
<${componentName$
|
11631
|
+
<${componentName$6}
|
11632
11632
|
tabindex="-1"
|
11633
|
-
></${componentName$
|
11633
|
+
></${componentName$6}>
|
11634
11634
|
`;
|
11635
11635
|
|
11636
11636
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
11637
11637
|
|
11638
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
11638
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$6);
|
11639
11639
|
|
11640
11640
|
forwardAttrs(this, this.inputElement, {
|
11641
11641
|
includeAttrs: [
|
@@ -11677,7 +11677,7 @@ const SamlGroupMappingsClass = compose(
|
|
11677
11677
|
proxyParentValidation: true,
|
11678
11678
|
}),
|
11679
11679
|
componentNameValidationMixin,
|
11680
|
-
customMixin
|
11680
|
+
customMixin$1
|
11681
11681
|
)(
|
11682
11682
|
createProxy({
|
11683
11683
|
slots: [],
|
@@ -11712,61 +11712,61 @@ const SamlGroupMappingsClass = compose(
|
|
11712
11712
|
'options',
|
11713
11713
|
'error-message',
|
11714
11714
|
],
|
11715
|
-
componentName: componentName$
|
11715
|
+
componentName: componentName$5,
|
11716
11716
|
})
|
11717
11717
|
);
|
11718
11718
|
|
11719
|
-
const vars$
|
11719
|
+
const vars$6 = SamlGroupMappingsClass.cssVarList;
|
11720
11720
|
|
11721
11721
|
const samlGroupMappings = {
|
11722
|
-
[vars$
|
11723
|
-
[vars$
|
11724
|
-
[vars$
|
11722
|
+
[vars$6.hostWidth]: refs.width,
|
11723
|
+
[vars$6.hostDirection]: refs.direction,
|
11724
|
+
[vars$6.groupNameInputMarginBottom]: '1em',
|
11725
11725
|
};
|
11726
11726
|
|
11727
11727
|
var samlGroupMappings$1 = /*#__PURE__*/Object.freeze({
|
11728
11728
|
__proto__: null,
|
11729
11729
|
default: samlGroupMappings,
|
11730
11730
|
samlGroupMappings: samlGroupMappings,
|
11731
|
-
vars: vars$
|
11731
|
+
vars: vars$6
|
11732
11732
|
});
|
11733
11733
|
|
11734
|
-
const globalRefs$
|
11735
|
-
const vars$
|
11734
|
+
const globalRefs$3 = getThemeRefs(globals);
|
11735
|
+
const vars$5 = PolicyValidationClass.cssVarList;
|
11736
11736
|
|
11737
11737
|
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$
|
11738
|
+
[vars$5.fontFamily]: refs.fontFamily,
|
11739
|
+
[vars$5.fontSize]: refs.labelFontSize,
|
11740
|
+
[vars$5.textColor]: refs.labelTextColor,
|
11741
|
+
[vars$5.borderWidth]: refs.borderWidth,
|
11742
|
+
[vars$5.borderStyle]: refs.borderStyle,
|
11743
|
+
[vars$5.borderColor]: refs.borderColor,
|
11744
|
+
[vars$5.borderRadius]: globalRefs$3.radius.sm,
|
11745
|
+
[vars$5.backgroundColor]: 'none',
|
11746
|
+
[vars$5.padding]: '0px',
|
11747
|
+
[vars$5.labelMargin]: globalRefs$3.spacing.sm,
|
11748
|
+
[vars$5.itemsSpacing]: globalRefs$3.spacing.lg,
|
11749
|
+
[vars$5.itemSymbolDefault]: "'\\2022'", // "•"
|
11750
|
+
[vars$5.itemSymbolSuccess]: "'\\2713'", // "✓"
|
11751
|
+
[vars$5.itemSymbolError]: "'\\2A09'", // "⨉"
|
11752
|
+
[vars$5.itemSymbolSuccessColor]: globalRefs$3.colors.success.main,
|
11753
|
+
[vars$5.itemSymbolErrorColor]: globalRefs$3.colors.error.main,
|
11754
11754
|
};
|
11755
11755
|
|
11756
11756
|
var policyValidation$1 = /*#__PURE__*/Object.freeze({
|
11757
11757
|
__proto__: null,
|
11758
11758
|
default: policyValidation,
|
11759
|
-
vars: vars$
|
11759
|
+
vars: vars$5
|
11760
11760
|
});
|
11761
11761
|
|
11762
|
-
const vars$
|
11762
|
+
const vars$4 = IconClass.cssVarList;
|
11763
11763
|
|
11764
11764
|
const icon = {};
|
11765
11765
|
|
11766
11766
|
var icon$1 = /*#__PURE__*/Object.freeze({
|
11767
11767
|
__proto__: null,
|
11768
11768
|
default: icon,
|
11769
|
-
vars: vars$
|
11769
|
+
vars: vars$4
|
11770
11770
|
});
|
11771
11771
|
|
11772
11772
|
const decode = (input) => {
|
@@ -11779,9 +11779,9 @@ const tpl = (input, inline) => {
|
|
11779
11779
|
return inline ? input : `<pre>${input}</pre>`;
|
11780
11780
|
};
|
11781
11781
|
|
11782
|
-
const componentName$
|
11782
|
+
const componentName$4 = getComponentName('code-snippet');
|
11783
11783
|
|
11784
|
-
let CodeSnippet$1 = class CodeSnippet extends createBaseClass({ componentName: componentName$
|
11784
|
+
let CodeSnippet$1 = class CodeSnippet extends createBaseClass({ componentName: componentName$4, baseSelector: ':host > code' }) {
|
11785
11785
|
static get observedAttributes() {
|
11786
11786
|
return ['lang', 'inline'];
|
11787
11787
|
}
|
@@ -12011,9 +12011,9 @@ const CodeSnippetClass = compose(
|
|
12011
12011
|
componentNameValidationMixin
|
12012
12012
|
)(CodeSnippet$1);
|
12013
12013
|
|
12014
|
-
const globalRefs = getThemeRefs(globals);
|
12014
|
+
const globalRefs$2 = getThemeRefs(globals);
|
12015
12015
|
|
12016
|
-
const vars$
|
12016
|
+
const vars$3 = CodeSnippetClass.cssVarList;
|
12017
12017
|
|
12018
12018
|
const light = {
|
12019
12019
|
color1: '#fa0',
|
@@ -12048,50 +12048,50 @@ const dark = {
|
|
12048
12048
|
};
|
12049
12049
|
|
12050
12050
|
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$
|
12051
|
+
[vars$3.rootBgColor]: globalRefs$2.colors.surface.main,
|
12052
|
+
[vars$3.rootTextColor]: globalRefs$2.colors.surface.contrast,
|
12053
|
+
[vars$3.docTagTextColor]: light.color2,
|
12054
|
+
[vars$3.keywordTextColor]: light.color2,
|
12055
|
+
[vars$3.metaKeywordTextColor]: light.color2,
|
12056
|
+
[vars$3.templateTagTextColor]: light.color2,
|
12057
|
+
[vars$3.templateVariableTextColor]: light.color2,
|
12058
|
+
[vars$3.typeTextColor]: light.color2,
|
12059
|
+
[vars$3.variableLanguageTextColor]: light.color2,
|
12060
|
+
[vars$3.titleTextColor]: light.color3,
|
12061
|
+
[vars$3.titleClassTextColor]: light.color3,
|
12062
|
+
[vars$3.titleClassInheritedTextColor]: light.color3,
|
12063
|
+
[vars$3.titleFunctionTextColor]: light.color3,
|
12064
|
+
[vars$3.attrTextColor]: light.color4,
|
12065
|
+
[vars$3.attributeTextColor]: light.color4,
|
12066
|
+
[vars$3.literalTextColor]: light.color4,
|
12067
|
+
[vars$3.metaTextColor]: light.color4,
|
12068
|
+
[vars$3.numberTextColor]: light.color4,
|
12069
|
+
[vars$3.operatorTextColor]: light.color4,
|
12070
|
+
[vars$3.variableTextColor]: light.color4,
|
12071
|
+
[vars$3.selectorAttrTextColor]: light.color4,
|
12072
|
+
[vars$3.selectorClassTextColor]: light.color4,
|
12073
|
+
[vars$3.selectorIdTextColor]: light.color4,
|
12074
|
+
[vars$3.regexpTextColor]: light.color13,
|
12075
|
+
[vars$3.stringTextColor]: light.color13,
|
12076
|
+
[vars$3.metaStringTextColor]: light.color13,
|
12077
|
+
[vars$3.builtInTextColor]: light.color5,
|
12078
|
+
[vars$3.symbolTextColor]: light.color5,
|
12079
|
+
[vars$3.commentTextColor]: light.color6,
|
12080
|
+
[vars$3.codeTextColor]: light.color6,
|
12081
|
+
[vars$3.formulaTextColor]: light.color6,
|
12082
|
+
[vars$3.nameTextColor]: light.color7,
|
12083
|
+
[vars$3.quoteTextColor]: light.color7,
|
12084
|
+
[vars$3.selectorTagTextColor]: light.color7,
|
12085
|
+
[vars$3.selectorPseudoTextColor]: light.color7,
|
12086
|
+
[vars$3.substTextColor]: light.color8,
|
12087
|
+
[vars$3.sectionTextColor]: light.color4,
|
12088
|
+
[vars$3.bulletTextColor]: light.color9,
|
12089
|
+
[vars$3.emphasisTextColor]: light.color8,
|
12090
|
+
[vars$3.strongTextColor]: light.color8,
|
12091
|
+
[vars$3.additionTextColor]: light.color7,
|
12092
|
+
[vars$3.additionBgColor]: light.color10,
|
12093
|
+
[vars$3.deletionTextColor]: light.color2,
|
12094
|
+
[vars$3.deletionBgColor]: light.color10,
|
12095
12095
|
/* purposely ignored */
|
12096
12096
|
// [vars.charEscapeTextColor]: '',
|
12097
12097
|
// [vars.linkTextColor]: '',
|
@@ -12103,50 +12103,50 @@ const CodeSnippet = {
|
|
12103
12103
|
|
12104
12104
|
const codeSnippetDarkThemeOverrides = {
|
12105
12105
|
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$
|
12106
|
+
[vars$3.rootBgColor]: globalRefs$2.colors.surface.main,
|
12107
|
+
[vars$3.rootTextColor]: globalRefs$2.colors.surface.contrast,
|
12108
|
+
[vars$3.docTagTextColor]: dark.color2,
|
12109
|
+
[vars$3.keywordTextColor]: dark.color2,
|
12110
|
+
[vars$3.metaKeywordTextColor]: dark.color2,
|
12111
|
+
[vars$3.templateTagTextColor]: dark.color2,
|
12112
|
+
[vars$3.templateVariableTextColor]: dark.color2,
|
12113
|
+
[vars$3.typeTextColor]: dark.color2,
|
12114
|
+
[vars$3.variableLanguageTextColor]: dark.color2,
|
12115
|
+
[vars$3.titleTextColor]: dark.color3,
|
12116
|
+
[vars$3.titleClassTextColor]: dark.color3,
|
12117
|
+
[vars$3.titleClassInheritedTextColor]: dark.color3,
|
12118
|
+
[vars$3.titleFunctionTextColor]: dark.color3,
|
12119
|
+
[vars$3.attrTextColor]: dark.color4,
|
12120
|
+
[vars$3.attributeTextColor]: dark.color4,
|
12121
|
+
[vars$3.literalTextColor]: dark.color4,
|
12122
|
+
[vars$3.metaTextColor]: dark.color4,
|
12123
|
+
[vars$3.numberTextColor]: dark.color4,
|
12124
|
+
[vars$3.operatorTextColor]: dark.color4,
|
12125
|
+
[vars$3.variableTextColor]: dark.color4,
|
12126
|
+
[vars$3.selectorAttrTextColor]: dark.color4,
|
12127
|
+
[vars$3.selectorClassTextColor]: dark.color4,
|
12128
|
+
[vars$3.selectorIdTextColor]: dark.color4,
|
12129
|
+
[vars$3.regexpTextColor]: dark.color13,
|
12130
|
+
[vars$3.stringTextColor]: dark.color13,
|
12131
|
+
[vars$3.metaStringTextColor]: dark.color13,
|
12132
|
+
[vars$3.builtInTextColor]: dark.color5,
|
12133
|
+
[vars$3.symbolTextColor]: dark.color5,
|
12134
|
+
[vars$3.commentTextColor]: dark.color6,
|
12135
|
+
[vars$3.codeTextColor]: dark.color6,
|
12136
|
+
[vars$3.formulaTextColor]: dark.color6,
|
12137
|
+
[vars$3.nameTextColor]: dark.color7,
|
12138
|
+
[vars$3.quoteTextColor]: dark.color7,
|
12139
|
+
[vars$3.selectorTagTextColor]: dark.color7,
|
12140
|
+
[vars$3.selectorPseudoTextColor]: dark.color7,
|
12141
|
+
[vars$3.substTextColor]: dark.color8,
|
12142
|
+
[vars$3.sectionTextColor]: dark.color4,
|
12143
|
+
[vars$3.bulletTextColor]: dark.color9,
|
12144
|
+
[vars$3.emphasisTextColor]: dark.color8,
|
12145
|
+
[vars$3.strongTextColor]: dark.color8,
|
12146
|
+
[vars$3.additionTextColor]: dark.color7,
|
12147
|
+
[vars$3.additionBgColor]: dark.color10,
|
12148
|
+
[vars$3.deletionTextColor]: dark.color2,
|
12149
|
+
[vars$3.deletionBgColor]: dark.color10,
|
12150
12150
|
},
|
12151
12151
|
};
|
12152
12152
|
|
@@ -12154,6 +12154,326 @@ var codeSnippet = /*#__PURE__*/Object.freeze({
|
|
12154
12154
|
__proto__: null,
|
12155
12155
|
codeSnippetDarkThemeOverrides: codeSnippetDarkThemeOverrides,
|
12156
12156
|
default: CodeSnippet,
|
12157
|
+
vars: vars$3
|
12158
|
+
});
|
12159
|
+
|
12160
|
+
const componentName$3 = getComponentName('radio-button');
|
12161
|
+
|
12162
|
+
const customMixin = (superclass) =>
|
12163
|
+
class CustomMixin extends superclass {
|
12164
|
+
constructor() {
|
12165
|
+
super();
|
12166
|
+
|
12167
|
+
this.baseElement.checkValidity = () => {};
|
12168
|
+
}
|
12169
|
+
|
12170
|
+
init() {
|
12171
|
+
// we are forwarding vaadin checked-changed event
|
12172
|
+
this.baseElement.addEventListener('checked-changed', (e) => {
|
12173
|
+
this.dispatchEvent(
|
12174
|
+
new CustomEvent(
|
12175
|
+
'checked-changed',
|
12176
|
+
{ detail: e.detail },
|
12177
|
+
{ bubbles: true, composed: true }
|
12178
|
+
)
|
12179
|
+
);
|
12180
|
+
});
|
12181
|
+
|
12182
|
+
super.init?.();
|
12183
|
+
|
12184
|
+
observeChildren(this, this.renderLabel.bind(this));
|
12185
|
+
}
|
12186
|
+
|
12187
|
+
renderLabel() {
|
12188
|
+
this.baseElement.setAttribute('label', this.textContent);
|
12189
|
+
}
|
12190
|
+
|
12191
|
+
get value() {
|
12192
|
+
return this.getAttribute('value');
|
12193
|
+
}
|
12194
|
+
};
|
12195
|
+
|
12196
|
+
const RadioButtonClass = compose(
|
12197
|
+
createStyleMixin({
|
12198
|
+
mappings: {
|
12199
|
+
cursor: [{}, { selector: 'label' }],
|
12200
|
+
fontSize: [{ selector: 'label' }, {}],
|
12201
|
+
labelTextColor: { selector: 'label', property: 'color' },
|
12202
|
+
fontFamily: { selector: 'label' },
|
12203
|
+
radioSize: [
|
12204
|
+
{ selector: '::part(radio)', property: 'height' },
|
12205
|
+
{ selector: '::part(radio)', property: 'width' },
|
12206
|
+
],
|
12207
|
+
radioBackgroundColor: { selector: '::part(radio)', property: 'background-color' },
|
12208
|
+
radioMargin: { selector: '::part(radio)', property: 'margin' },
|
12209
|
+
radioCheckedSize: { selector: '::part(radio)::after', property: 'border-width' },
|
12210
|
+
radioCheckedColor: { selector: '::part(radio)::after', property: 'border-color' },
|
12211
|
+
},
|
12212
|
+
}),
|
12213
|
+
composedProxyInputMixin({ proxyProps: ['setSelectionRange'] }),
|
12214
|
+
componentNameValidationMixin,
|
12215
|
+
customMixin
|
12216
|
+
)(
|
12217
|
+
createProxy({
|
12218
|
+
slots: [''],
|
12219
|
+
wrappedEleName: 'vaadin-radio-button',
|
12220
|
+
excludeAttrsSync: ['tabindex', 'data'],
|
12221
|
+
includeForwardProps: ['checked', 'name', 'disabled'],
|
12222
|
+
componentName: componentName$3,
|
12223
|
+
})
|
12224
|
+
);
|
12225
|
+
|
12226
|
+
const componentName$2 = getComponentName('radio-group');
|
12227
|
+
|
12228
|
+
const RadioGroupMixin = (superclass) =>
|
12229
|
+
class RadioGroupMixinClass extends superclass {
|
12230
|
+
// eslint-disable-next-line class-methods-use-this
|
12231
|
+
#renderItem = ({ value, label }) =>
|
12232
|
+
`<descope-radio-button value="${value}">${label}</descope-radio-button>`;
|
12233
|
+
|
12234
|
+
#data;
|
12235
|
+
|
12236
|
+
constructor() {
|
12237
|
+
super();
|
12238
|
+
|
12239
|
+
// we are overriding vaadin children getter so it will run on our custom elements
|
12240
|
+
Object.defineProperty(this.baseElement, 'children', {
|
12241
|
+
get: () => this.querySelectorAll(componentName$3),
|
12242
|
+
});
|
12243
|
+
|
12244
|
+
// we are overriding vaadin __filterRadioButtons so it will run on our custom elements
|
12245
|
+
this.baseElement.__filterRadioButtons = (nodes) => {
|
12246
|
+
return nodes.filter((node) => node.localName === componentName$3);
|
12247
|
+
};
|
12248
|
+
|
12249
|
+
// vaadin radio group missing some input properties
|
12250
|
+
this.baseElement.setCustomValidity = () => {};
|
12251
|
+
}
|
12252
|
+
|
12253
|
+
get items() {
|
12254
|
+
return this.shadowRoot.querySelector('slot').assignedElements();
|
12255
|
+
}
|
12256
|
+
|
12257
|
+
get size() {
|
12258
|
+
return this.getAttribute('size');
|
12259
|
+
}
|
12260
|
+
|
12261
|
+
get data() {
|
12262
|
+
if (this.#data) return this.#data;
|
12263
|
+
|
12264
|
+
const dataAttr = this.getAttribute('data');
|
12265
|
+
|
12266
|
+
if (dataAttr) {
|
12267
|
+
try {
|
12268
|
+
const data = JSON.parse(dataAttr);
|
12269
|
+
if (this.isValidDataType(data)) {
|
12270
|
+
return data;
|
12271
|
+
}
|
12272
|
+
} catch (e) {
|
12273
|
+
// eslint-disable-next-line no-console
|
12274
|
+
console.error('could not parse data string from attribute "data" - ', e.message);
|
12275
|
+
}
|
12276
|
+
}
|
12277
|
+
|
12278
|
+
return [];
|
12279
|
+
}
|
12280
|
+
|
12281
|
+
set data(data) {
|
12282
|
+
if (this.isValidDataType(data)) {
|
12283
|
+
this.#data = data;
|
12284
|
+
this.renderItems();
|
12285
|
+
}
|
12286
|
+
}
|
12287
|
+
|
12288
|
+
get defaultValue() {
|
12289
|
+
return this.getAttribute('default-value');
|
12290
|
+
}
|
12291
|
+
|
12292
|
+
// eslint-disable-next-line class-methods-use-this
|
12293
|
+
isValidDataType(data) {
|
12294
|
+
const isValid = Array.isArray(data);
|
12295
|
+
if (!isValid) {
|
12296
|
+
// eslint-disable-next-line no-console
|
12297
|
+
console.error('data must be an array, received:', data);
|
12298
|
+
}
|
12299
|
+
|
12300
|
+
return isValid;
|
12301
|
+
}
|
12302
|
+
|
12303
|
+
getItemsTemplate() {
|
12304
|
+
return this.data?.reduce?.((acc, item) => acc + (this.#renderItem?.(item || {}) || ''), '');
|
12305
|
+
}
|
12306
|
+
|
12307
|
+
renderItems() {
|
12308
|
+
const template = this.getItemsTemplate();
|
12309
|
+
if (template) this.innerHTML = template;
|
12310
|
+
}
|
12311
|
+
|
12312
|
+
init() {
|
12313
|
+
super.init?.();
|
12314
|
+
|
12315
|
+
this.inputElement = this.baseElement;
|
12316
|
+
|
12317
|
+
this.renderItems();
|
12318
|
+
|
12319
|
+
observeAttributes(this, this.renderItems.bind(this), { includeAttrs: ['data'] });
|
12320
|
+
|
12321
|
+
Object.defineProperty(this.baseElement, 'validity', {
|
12322
|
+
get: () => {
|
12323
|
+
return { valueMissing: !this.baseElement.checkValidity() };
|
12324
|
+
},
|
12325
|
+
});
|
12326
|
+
|
12327
|
+
forwardAttrs(this, this.baseElement, {
|
12328
|
+
includeAttrs: ['layout'],
|
12329
|
+
mapAttrs: { layout: 'theme' },
|
12330
|
+
});
|
12331
|
+
|
12332
|
+
setTimeout(() => {
|
12333
|
+
if (this.defaultValue) {
|
12334
|
+
this.value = this.defaultValue;
|
12335
|
+
}
|
12336
|
+
});
|
12337
|
+
|
12338
|
+
// we want new items to get the size
|
12339
|
+
observeChildren(this, ({ addedNodes }) => {
|
12340
|
+
addedNodes.forEach((node) => {
|
12341
|
+
node.setAttribute('size', this.size);
|
12342
|
+
});
|
12343
|
+
});
|
12344
|
+
|
12345
|
+
observeAttributes(
|
12346
|
+
this,
|
12347
|
+
() => {
|
12348
|
+
this.items.forEach((item) => {
|
12349
|
+
item.setAttribute('size', this.size);
|
12350
|
+
});
|
12351
|
+
},
|
12352
|
+
{
|
12353
|
+
includeAttrs: ['size'],
|
12354
|
+
}
|
12355
|
+
);
|
12356
|
+
}
|
12357
|
+
};
|
12358
|
+
|
12359
|
+
const RadioGroupClass = compose(
|
12360
|
+
createStyleMixin({
|
12361
|
+
mappings: {
|
12362
|
+
...textFieldMappings,
|
12363
|
+
buttonsSpacing: { selector: '::part(group-field)', property: 'justify-content' },
|
12364
|
+
buttonsRowGap: { selector: '::part(group-field)', property: 'row-gap' },
|
12365
|
+
buttonsColumnGap: { selector: '::part(group-field)', property: 'column-gap' },
|
12366
|
+
itemsLabelColor: {
|
12367
|
+
selector: () => `::slotted(${RadioButtonClass.componentName})`,
|
12368
|
+
property: RadioButtonClass.cssVarList.labelTextColor,
|
12369
|
+
},
|
12370
|
+
},
|
12371
|
+
}),
|
12372
|
+
draggableMixin,
|
12373
|
+
composedProxyInputMixin({ proxyProps: ['setSelectionRange'] }),
|
12374
|
+
componentNameValidationMixin,
|
12375
|
+
RadioGroupMixin
|
12376
|
+
)(
|
12377
|
+
createProxy({
|
12378
|
+
slots: ['', 'prefix'],
|
12379
|
+
wrappedEleName: 'vaadin-radio-group',
|
12380
|
+
style: () => `
|
12381
|
+
:host {
|
12382
|
+
display: inline-block;
|
12383
|
+
max-width: 100%;
|
12384
|
+
box-sizing: border-box;
|
12385
|
+
}
|
12386
|
+
|
12387
|
+
vaadin-radio-group {
|
12388
|
+
padding: 0;
|
12389
|
+
width: 100%;
|
12390
|
+
}
|
12391
|
+
|
12392
|
+
${resetInputLabelPosition('vaadin-radio-group')}
|
12393
|
+
`,
|
12394
|
+
|
12395
|
+
excludeAttrsSync: ['tabindex', 'size', 'data', 'direction'],
|
12396
|
+
componentName: componentName$2,
|
12397
|
+
includeForwardProps: ['value'],
|
12398
|
+
})
|
12399
|
+
);
|
12400
|
+
|
12401
|
+
const vars$2 = RadioGroupClass.cssVarList;
|
12402
|
+
const globalRefs$1 = getThemeRefs(globals);
|
12403
|
+
|
12404
|
+
const radioGroup = {
|
12405
|
+
[vars$2.buttonsRowGap]: '9px',
|
12406
|
+
[vars$2.hostWidth]: refs.width,
|
12407
|
+
[vars$2.hostDirection]: refs.direction,
|
12408
|
+
[vars$2.fontSize]: refs.fontSize,
|
12409
|
+
[vars$2.fontFamily]: refs.fontFamily,
|
12410
|
+
[vars$2.labelTextColor]: refs.labelTextColor,
|
12411
|
+
[vars$2.labelRequiredIndicator]: refs.requiredIndicator,
|
12412
|
+
[vars$2.errorMessageTextColor]: refs.errorMessageTextColor,
|
12413
|
+
[vars$2.helperTextColor]: refs.helperTextColor,
|
12414
|
+
[vars$2.itemsLabelColor]: globalRefs$1.colors.surface.contrast,
|
12415
|
+
|
12416
|
+
textAlign: {
|
12417
|
+
right: { [vars$2.inputTextAlign]: 'right' },
|
12418
|
+
left: { [vars$2.inputTextAlign]: 'left' },
|
12419
|
+
center: { [vars$2.inputTextAlign]: 'center' },
|
12420
|
+
},
|
12421
|
+
|
12422
|
+
_fullWidth: {
|
12423
|
+
[vars$2.buttonsSpacing]: 'space-between',
|
12424
|
+
},
|
12425
|
+
|
12426
|
+
_disabled: {
|
12427
|
+
[vars$2.itemsLabelColor]: globalRefs$1.colors.surface.light,
|
12428
|
+
},
|
12429
|
+
};
|
12430
|
+
|
12431
|
+
var radioGroup$1 = /*#__PURE__*/Object.freeze({
|
12432
|
+
__proto__: null,
|
12433
|
+
default: radioGroup,
|
12434
|
+
radioGroup: radioGroup,
|
12435
|
+
vars: vars$2
|
12436
|
+
});
|
12437
|
+
|
12438
|
+
const vars$1 = RadioButtonClass.cssVarList;
|
12439
|
+
const globalRefs = getThemeRefs(globals);
|
12440
|
+
|
12441
|
+
const radioButton = {
|
12442
|
+
[vars$1.fontFamily]: refs.fontFamily,
|
12443
|
+
[vars$1.radioSize]: 'calc(1em + 6px)',
|
12444
|
+
[vars$1.radioMargin]: 'auto 4px',
|
12445
|
+
[vars$1.radioCheckedSize]: `calc(var(${vars$1.radioSize})/5)`,
|
12446
|
+
[vars$1.radioCheckedColor]: globalRefs.colors.surface.light,
|
12447
|
+
[vars$1.radioBackgroundColor]: globalRefs.colors.surface.light,
|
12448
|
+
|
12449
|
+
_checked: {
|
12450
|
+
[vars$1.radioBackgroundColor]: globalRefs.colors.surface.contrast,
|
12451
|
+
},
|
12452
|
+
|
12453
|
+
_hover: {
|
12454
|
+
cursor: 'pointer',
|
12455
|
+
},
|
12456
|
+
|
12457
|
+
size: {
|
12458
|
+
xs: {
|
12459
|
+
[vars$1.fontSize]: '12px',
|
12460
|
+
},
|
12461
|
+
sm: {
|
12462
|
+
[vars$1.fontSize]: '14px',
|
12463
|
+
},
|
12464
|
+
md: {
|
12465
|
+
[vars$1.fontSize]: '16px',
|
12466
|
+
},
|
12467
|
+
lg: {
|
12468
|
+
[vars$1.fontSize]: '18px',
|
12469
|
+
},
|
12470
|
+
},
|
12471
|
+
};
|
12472
|
+
|
12473
|
+
var radioButton$1 = /*#__PURE__*/Object.freeze({
|
12474
|
+
__proto__: null,
|
12475
|
+
default: radioButton,
|
12476
|
+
radioButton: radioButton,
|
12157
12477
|
vars: vars$1
|
12158
12478
|
});
|
12159
12479
|
|
@@ -12200,6 +12520,8 @@ const components = {
|
|
12200
12520
|
policyValidation: policyValidation$1,
|
12201
12521
|
icon: icon$1,
|
12202
12522
|
codeSnippet,
|
12523
|
+
radioGroup: radioGroup$1,
|
12524
|
+
radioButton: radioButton$1,
|
12203
12525
|
};
|
12204
12526
|
|
12205
12527
|
const theme = Object.keys(components).reduce(
|
@@ -12212,7 +12534,7 @@ const vars = Object.keys(components).reduce(
|
|
12212
12534
|
);
|
12213
12535
|
|
12214
12536
|
const defaultTheme = { globals, components: theme };
|
12215
|
-
const themeVars = { globals: vars$
|
12537
|
+
const themeVars = { globals: vars$J, components: vars };
|
12216
12538
|
|
12217
12539
|
const colors = {
|
12218
12540
|
surface: {
|
@@ -12565,6 +12887,8 @@ exports.PasswordClass = PasswordClass;
|
|
12565
12887
|
exports.PhoneFieldClass = PhoneFieldClass;
|
12566
12888
|
exports.PhoneFieldInputBoxClass = PhoneFieldInputBoxClass;
|
12567
12889
|
exports.PolicyValidationClass = PolicyValidationClass;
|
12890
|
+
exports.RadioButtonClass = RadioButtonClass;
|
12891
|
+
exports.RadioGroupClass = RadioGroupClass;
|
12568
12892
|
exports.RecaptchaClass = RecaptchaClass;
|
12569
12893
|
exports.SamlGroupMappingsClass = SamlGroupMappingsClass;
|
12570
12894
|
exports.SwitchToggleClass = SwitchToggleClass;
|