@descope/web-components-ui 1.0.293 → 1.0.295
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/cjs/index.cjs.js +1145 -921
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/index.esm.js +1140 -913
- package/dist/index.esm.js.map +1 -1
- package/dist/umd/1735.js +73 -0
- package/dist/umd/1735.js.LICENSE.txt +17 -0
- package/dist/umd/2106.js +1 -1
- package/dist/umd/4577.js +1 -0
- package/dist/umd/7911.js +1 -1
- package/dist/umd/descope-new-password-descope-new-password-internal-index-js.js +1 -1
- package/dist/umd/descope-new-password-index-js.js +1 -1
- package/dist/umd/descope-policy-validation-index-js.js +1 -1
- package/dist/umd/descope-user-attribute-index-js.js +1 -1
- package/dist/umd/descope-user-auth-method-index-js.js +1 -0
- package/dist/umd/index.js +1 -1
- package/package.json +21 -2
- package/src/components/descope-new-password/NewPasswordClass.js +1 -1
- package/src/components/descope-user-attribute/UserAttributeClass.js +13 -0
- package/src/components/descope-user-auth-method/UserAuthMethodClass.js +201 -0
- package/src/components/descope-user-auth-method/green-v.svg +3 -0
- package/src/components/descope-user-auth-method/index.js +9 -0
- package/src/index.cjs.js +1 -0
- package/src/index.js +1 -0
- package/src/theme/components/index.js +2 -0
- package/src/theme/components/userAuthMethod.js +19 -0
package/dist/cjs/index.cjs.js
CHANGED
|
@@ -630,7 +630,7 @@ const globals = {
|
|
|
630
630
|
fonts,
|
|
631
631
|
direction,
|
|
632
632
|
};
|
|
633
|
-
const vars$
|
|
633
|
+
const vars$E = getThemeVars(globals);
|
|
634
634
|
|
|
635
635
|
const createCssVar = (varName, fallback) => `var(${varName}${fallback ? `, ${fallback}` : ''})`;
|
|
636
636
|
|
|
@@ -2576,7 +2576,7 @@ const clickableMixin = (superclass) =>
|
|
|
2576
2576
|
}
|
|
2577
2577
|
};
|
|
2578
2578
|
|
|
2579
|
-
const componentName$
|
|
2579
|
+
const componentName$N = getComponentName('button');
|
|
2580
2580
|
|
|
2581
2581
|
const resetStyles = `
|
|
2582
2582
|
:host {
|
|
@@ -2614,7 +2614,7 @@ const iconStyles = `
|
|
|
2614
2614
|
|
|
2615
2615
|
const editorOverrides = `vaadin-button::part(label) { pointer-events: none; }`;
|
|
2616
2616
|
|
|
2617
|
-
const { host: host$
|
|
2617
|
+
const { host: host$n, label: label$a } = {
|
|
2618
2618
|
host: { selector: () => ':host' },
|
|
2619
2619
|
label: { selector: '::part(label)' },
|
|
2620
2620
|
};
|
|
@@ -2626,7 +2626,7 @@ const ButtonClass = compose(
|
|
|
2626
2626
|
mappings: {
|
|
2627
2627
|
hostWidth: { property: 'width' },
|
|
2628
2628
|
hostHeight: { property: 'height' },
|
|
2629
|
-
hostDirection: { ...host$
|
|
2629
|
+
hostDirection: { ...host$n, property: 'direction' },
|
|
2630
2630
|
fontSize: {},
|
|
2631
2631
|
fontFamily: {},
|
|
2632
2632
|
|
|
@@ -2678,7 +2678,7 @@ const ButtonClass = compose(
|
|
|
2678
2678
|
}
|
|
2679
2679
|
`,
|
|
2680
2680
|
excludeAttrsSync: ['tabindex'],
|
|
2681
|
-
componentName: componentName$
|
|
2681
|
+
componentName: componentName$N,
|
|
2682
2682
|
})
|
|
2683
2683
|
);
|
|
2684
2684
|
|
|
@@ -2715,31 +2715,31 @@ loadingIndicatorStyles = `
|
|
|
2715
2715
|
}
|
|
2716
2716
|
`;
|
|
2717
2717
|
|
|
2718
|
-
const globalRefs$
|
|
2718
|
+
const globalRefs$n = getThemeRefs(globals);
|
|
2719
2719
|
const compVars$5 = ButtonClass.cssVarList;
|
|
2720
2720
|
|
|
2721
2721
|
const mode = {
|
|
2722
|
-
primary: globalRefs$
|
|
2723
|
-
secondary: globalRefs$
|
|
2724
|
-
success: globalRefs$
|
|
2725
|
-
error: globalRefs$
|
|
2726
|
-
surface: globalRefs$
|
|
2722
|
+
primary: globalRefs$n.colors.primary,
|
|
2723
|
+
secondary: globalRefs$n.colors.secondary,
|
|
2724
|
+
success: globalRefs$n.colors.success,
|
|
2725
|
+
error: globalRefs$n.colors.error,
|
|
2726
|
+
surface: globalRefs$n.colors.surface,
|
|
2727
2727
|
};
|
|
2728
2728
|
|
|
2729
|
-
const [helperTheme$3, helperRefs$3, helperVars$3] = createHelperVars({ mode }, componentName$
|
|
2729
|
+
const [helperTheme$3, helperRefs$3, helperVars$3] = createHelperVars({ mode }, componentName$N);
|
|
2730
2730
|
|
|
2731
2731
|
const button = {
|
|
2732
2732
|
...helperTheme$3,
|
|
2733
2733
|
|
|
2734
|
-
[compVars$5.fontFamily]: globalRefs$
|
|
2734
|
+
[compVars$5.fontFamily]: globalRefs$n.fonts.font1.family,
|
|
2735
2735
|
|
|
2736
2736
|
[compVars$5.cursor]: 'pointer',
|
|
2737
2737
|
[compVars$5.hostHeight]: '3em',
|
|
2738
2738
|
[compVars$5.hostWidth]: 'auto',
|
|
2739
|
-
[compVars$5.hostDirection]: globalRefs$
|
|
2739
|
+
[compVars$5.hostDirection]: globalRefs$n.direction,
|
|
2740
2740
|
|
|
2741
|
-
[compVars$5.borderRadius]: globalRefs$
|
|
2742
|
-
[compVars$5.borderWidth]: globalRefs$
|
|
2741
|
+
[compVars$5.borderRadius]: globalRefs$n.radius.sm,
|
|
2742
|
+
[compVars$5.borderWidth]: globalRefs$n.border.xs,
|
|
2743
2743
|
[compVars$5.borderStyle]: 'solid',
|
|
2744
2744
|
[compVars$5.borderColor]: 'transparent',
|
|
2745
2745
|
|
|
@@ -2782,10 +2782,10 @@ const button = {
|
|
|
2782
2782
|
},
|
|
2783
2783
|
|
|
2784
2784
|
_disabled: {
|
|
2785
|
-
[helperVars$3.main]: globalRefs$
|
|
2786
|
-
[helperVars$3.dark]: globalRefs$
|
|
2787
|
-
[helperVars$3.light]: globalRefs$
|
|
2788
|
-
[helperVars$3.contrast]: globalRefs$
|
|
2785
|
+
[helperVars$3.main]: globalRefs$n.colors.surface.light,
|
|
2786
|
+
[helperVars$3.dark]: globalRefs$n.colors.surface.dark,
|
|
2787
|
+
[helperVars$3.light]: globalRefs$n.colors.surface.light,
|
|
2788
|
+
[helperVars$3.contrast]: globalRefs$n.colors.surface.main,
|
|
2789
2789
|
},
|
|
2790
2790
|
|
|
2791
2791
|
variant: {
|
|
@@ -2833,7 +2833,7 @@ const button = {
|
|
|
2833
2833
|
},
|
|
2834
2834
|
};
|
|
2835
2835
|
|
|
2836
|
-
const vars$
|
|
2836
|
+
const vars$D = {
|
|
2837
2837
|
...compVars$5,
|
|
2838
2838
|
...helperVars$3,
|
|
2839
2839
|
};
|
|
@@ -2841,11 +2841,11 @@ const vars$C = {
|
|
|
2841
2841
|
var button$1 = /*#__PURE__*/Object.freeze({
|
|
2842
2842
|
__proto__: null,
|
|
2843
2843
|
default: button,
|
|
2844
|
-
vars: vars$
|
|
2844
|
+
vars: vars$D
|
|
2845
2845
|
});
|
|
2846
2846
|
|
|
2847
2847
|
const {
|
|
2848
|
-
host: host$
|
|
2848
|
+
host: host$m,
|
|
2849
2849
|
label: label$9,
|
|
2850
2850
|
placeholder: placeholder$3,
|
|
2851
2851
|
requiredIndicator: requiredIndicator$b,
|
|
@@ -2870,12 +2870,12 @@ const {
|
|
|
2870
2870
|
|
|
2871
2871
|
var textFieldMappings = {
|
|
2872
2872
|
// we apply font-size also on the host so we can set its width with em
|
|
2873
|
-
fontSize: [{}, host$
|
|
2873
|
+
fontSize: [{}, host$m],
|
|
2874
2874
|
fontFamily: [label$9, inputField$6, helperText$a, errorMessage$c],
|
|
2875
2875
|
|
|
2876
|
-
hostWidth: { ...host$
|
|
2877
|
-
hostMinWidth: { ...host$
|
|
2878
|
-
hostDirection: { ...host$
|
|
2876
|
+
hostWidth: { ...host$m, property: 'width' },
|
|
2877
|
+
hostMinWidth: { ...host$m, property: 'min-width' },
|
|
2878
|
+
hostDirection: { ...host$m, property: 'direction' },
|
|
2879
2879
|
|
|
2880
2880
|
inputBackgroundColor: { ...inputField$6, property: 'background-color' },
|
|
2881
2881
|
|
|
@@ -3049,7 +3049,7 @@ const resetInputLabelPosition = (name) => `
|
|
|
3049
3049
|
}
|
|
3050
3050
|
`;
|
|
3051
3051
|
|
|
3052
|
-
const componentName$
|
|
3052
|
+
const componentName$M = getComponentName('text-field');
|
|
3053
3053
|
|
|
3054
3054
|
const observedAttrs = ['type'];
|
|
3055
3055
|
|
|
@@ -3099,29 +3099,29 @@ const TextFieldClass = compose(
|
|
|
3099
3099
|
${resetInputOverrides('vaadin-text-field', TextFieldClass.cssVarList)}
|
|
3100
3100
|
`,
|
|
3101
3101
|
excludeAttrsSync: ['tabindex'],
|
|
3102
|
-
componentName: componentName$
|
|
3102
|
+
componentName: componentName$M,
|
|
3103
3103
|
})
|
|
3104
3104
|
);
|
|
3105
3105
|
|
|
3106
|
-
const componentName$
|
|
3107
|
-
const globalRefs$
|
|
3106
|
+
const componentName$L = getComponentName('input-wrapper');
|
|
3107
|
+
const globalRefs$m = getThemeRefs(globals);
|
|
3108
3108
|
|
|
3109
|
-
const [theme$1, refs, vars$
|
|
3109
|
+
const [theme$1, refs, vars$C] = createHelperVars(
|
|
3110
3110
|
{
|
|
3111
|
-
labelTextColor: globalRefs$
|
|
3111
|
+
labelTextColor: globalRefs$m.colors.surface.dark,
|
|
3112
3112
|
labelFontSize: '14px', // not taken from globals as it is fixed in all inputs
|
|
3113
|
-
valueTextColor: globalRefs$
|
|
3114
|
-
placeholderTextColor: globalRefs$
|
|
3113
|
+
valueTextColor: globalRefs$m.colors.surface.contrast,
|
|
3114
|
+
placeholderTextColor: globalRefs$m.colors.surface.dark,
|
|
3115
3115
|
requiredIndicator: "'*'",
|
|
3116
|
-
helperTextColor: globalRefs$
|
|
3117
|
-
errorMessageTextColor: globalRefs$
|
|
3118
|
-
successMessageTextColor: globalRefs$
|
|
3116
|
+
helperTextColor: globalRefs$m.colors.surface.dark,
|
|
3117
|
+
errorMessageTextColor: globalRefs$m.colors.error.main,
|
|
3118
|
+
successMessageTextColor: globalRefs$m.colors.success.main,
|
|
3119
3119
|
|
|
3120
|
-
borderWidth: globalRefs$
|
|
3121
|
-
borderRadius: globalRefs$
|
|
3120
|
+
borderWidth: globalRefs$m.border.xs,
|
|
3121
|
+
borderRadius: globalRefs$m.radius.xs,
|
|
3122
3122
|
borderColor: 'transparent',
|
|
3123
3123
|
|
|
3124
|
-
outlineWidth: globalRefs$
|
|
3124
|
+
outlineWidth: globalRefs$m.border.sm,
|
|
3125
3125
|
outlineStyle: 'solid',
|
|
3126
3126
|
outlineColor: 'transparent',
|
|
3127
3127
|
outlineOffset: '0px', // we need to keep the px unit even for 0 value, as this var is used for calc in different component classes
|
|
@@ -3132,11 +3132,11 @@ const [theme$1, refs, vars$B] = createHelperVars(
|
|
|
3132
3132
|
horizontalPadding: '0.5em',
|
|
3133
3133
|
verticalPadding: '0.5em',
|
|
3134
3134
|
|
|
3135
|
-
backgroundColor: globalRefs$
|
|
3135
|
+
backgroundColor: globalRefs$m.colors.surface.main,
|
|
3136
3136
|
|
|
3137
|
-
fontFamily: globalRefs$
|
|
3137
|
+
fontFamily: globalRefs$m.fonts.font1.family,
|
|
3138
3138
|
|
|
3139
|
-
direction: globalRefs$
|
|
3139
|
+
direction: globalRefs$m.direction,
|
|
3140
3140
|
|
|
3141
3141
|
overlayOpacity: '0.3',
|
|
3142
3142
|
|
|
@@ -3152,77 +3152,77 @@ const [theme$1, refs, vars$B] = createHelperVars(
|
|
|
3152
3152
|
},
|
|
3153
3153
|
|
|
3154
3154
|
_focused: {
|
|
3155
|
-
outlineColor: globalRefs$
|
|
3155
|
+
outlineColor: globalRefs$m.colors.surface.light,
|
|
3156
3156
|
_invalid: {
|
|
3157
|
-
outlineColor: globalRefs$
|
|
3157
|
+
outlineColor: globalRefs$m.colors.error.main,
|
|
3158
3158
|
},
|
|
3159
3159
|
},
|
|
3160
3160
|
|
|
3161
3161
|
_bordered: {
|
|
3162
|
-
outlineWidth: globalRefs$
|
|
3163
|
-
borderColor: globalRefs$
|
|
3162
|
+
outlineWidth: globalRefs$m.border.xs,
|
|
3163
|
+
borderColor: globalRefs$m.colors.surface.light,
|
|
3164
3164
|
borderStyle: 'solid',
|
|
3165
3165
|
_invalid: {
|
|
3166
|
-
borderColor: globalRefs$
|
|
3166
|
+
borderColor: globalRefs$m.colors.error.main,
|
|
3167
3167
|
},
|
|
3168
3168
|
},
|
|
3169
3169
|
|
|
3170
3170
|
_disabled: {
|
|
3171
|
-
labelTextColor: globalRefs$
|
|
3172
|
-
borderColor: globalRefs$
|
|
3173
|
-
valueTextColor: globalRefs$
|
|
3174
|
-
placeholderTextColor: globalRefs$
|
|
3175
|
-
helperTextColor: globalRefs$
|
|
3176
|
-
backgroundColor: globalRefs$
|
|
3171
|
+
labelTextColor: globalRefs$m.colors.surface.light,
|
|
3172
|
+
borderColor: globalRefs$m.colors.surface.light,
|
|
3173
|
+
valueTextColor: globalRefs$m.colors.surface.light,
|
|
3174
|
+
placeholderTextColor: globalRefs$m.colors.surface.light,
|
|
3175
|
+
helperTextColor: globalRefs$m.colors.surface.light,
|
|
3176
|
+
backgroundColor: globalRefs$m.colors.surface.main,
|
|
3177
3177
|
},
|
|
3178
3178
|
},
|
|
3179
|
-
componentName$
|
|
3179
|
+
componentName$L
|
|
3180
3180
|
);
|
|
3181
3181
|
|
|
3182
3182
|
var inputWrapper = /*#__PURE__*/Object.freeze({
|
|
3183
3183
|
__proto__: null,
|
|
3184
3184
|
default: theme$1,
|
|
3185
3185
|
refs: refs,
|
|
3186
|
-
vars: vars$
|
|
3186
|
+
vars: vars$C
|
|
3187
3187
|
});
|
|
3188
3188
|
|
|
3189
|
-
const vars$
|
|
3190
|
-
|
|
3191
|
-
const textField = {
|
|
3192
|
-
[vars$
|
|
3193
|
-
[vars$
|
|
3194
|
-
[vars$
|
|
3195
|
-
[vars$
|
|
3196
|
-
[vars$
|
|
3197
|
-
[vars$
|
|
3198
|
-
[vars$
|
|
3199
|
-
[vars$
|
|
3200
|
-
[vars$
|
|
3201
|
-
[vars$
|
|
3202
|
-
[vars$
|
|
3203
|
-
[vars$
|
|
3204
|
-
[vars$
|
|
3205
|
-
[vars$
|
|
3206
|
-
[vars$
|
|
3207
|
-
[vars$
|
|
3208
|
-
[vars$
|
|
3209
|
-
[vars$
|
|
3210
|
-
[vars$
|
|
3211
|
-
[vars$
|
|
3212
|
-
[vars$
|
|
3213
|
-
[vars$
|
|
3189
|
+
const vars$B = TextFieldClass.cssVarList;
|
|
3190
|
+
|
|
3191
|
+
const textField$1 = {
|
|
3192
|
+
[vars$B.hostWidth]: refs.width,
|
|
3193
|
+
[vars$B.hostMinWidth]: refs.minWidth,
|
|
3194
|
+
[vars$B.hostDirection]: refs.direction,
|
|
3195
|
+
[vars$B.fontSize]: refs.fontSize,
|
|
3196
|
+
[vars$B.fontFamily]: refs.fontFamily,
|
|
3197
|
+
[vars$B.labelTextColor]: refs.labelTextColor,
|
|
3198
|
+
[vars$B.labelRequiredIndicator]: refs.requiredIndicator,
|
|
3199
|
+
[vars$B.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
3200
|
+
[vars$B.inputValueTextColor]: refs.valueTextColor,
|
|
3201
|
+
[vars$B.inputPlaceholderColor]: refs.placeholderTextColor,
|
|
3202
|
+
[vars$B.inputBorderWidth]: refs.borderWidth,
|
|
3203
|
+
[vars$B.inputBorderStyle]: refs.borderStyle,
|
|
3204
|
+
[vars$B.inputBorderColor]: refs.borderColor,
|
|
3205
|
+
[vars$B.inputBorderRadius]: refs.borderRadius,
|
|
3206
|
+
[vars$B.inputOutlineWidth]: refs.outlineWidth,
|
|
3207
|
+
[vars$B.inputOutlineStyle]: refs.outlineStyle,
|
|
3208
|
+
[vars$B.inputOutlineColor]: refs.outlineColor,
|
|
3209
|
+
[vars$B.inputOutlineOffset]: refs.outlineOffset,
|
|
3210
|
+
[vars$B.inputBackgroundColor]: refs.backgroundColor,
|
|
3211
|
+
[vars$B.inputHeight]: refs.inputHeight,
|
|
3212
|
+
[vars$B.inputHorizontalPadding]: refs.horizontalPadding,
|
|
3213
|
+
[vars$B.helperTextColor]: refs.helperTextColor,
|
|
3214
3214
|
textAlign: {
|
|
3215
|
-
right: { [vars$
|
|
3216
|
-
left: { [vars$
|
|
3217
|
-
center: { [vars$
|
|
3215
|
+
right: { [vars$B.inputTextAlign]: 'right' },
|
|
3216
|
+
left: { [vars$B.inputTextAlign]: 'left' },
|
|
3217
|
+
center: { [vars$B.inputTextAlign]: 'center' },
|
|
3218
3218
|
},
|
|
3219
3219
|
};
|
|
3220
3220
|
|
|
3221
|
-
var textField$
|
|
3221
|
+
var textField$2 = /*#__PURE__*/Object.freeze({
|
|
3222
3222
|
__proto__: null,
|
|
3223
|
-
default: textField,
|
|
3224
|
-
textField: textField,
|
|
3225
|
-
vars: vars$
|
|
3223
|
+
default: textField$1,
|
|
3224
|
+
textField: textField$1,
|
|
3225
|
+
vars: vars$B
|
|
3226
3226
|
});
|
|
3227
3227
|
|
|
3228
3228
|
const passwordDraggableMixin = (superclass) =>
|
|
@@ -3259,10 +3259,10 @@ const passwordDraggableMixin = (superclass) =>
|
|
|
3259
3259
|
}
|
|
3260
3260
|
};
|
|
3261
3261
|
|
|
3262
|
-
const componentName$
|
|
3262
|
+
const componentName$K = getComponentName('password');
|
|
3263
3263
|
|
|
3264
3264
|
const {
|
|
3265
|
-
host: host$
|
|
3265
|
+
host: host$l,
|
|
3266
3266
|
inputField: inputField$5,
|
|
3267
3267
|
inputElement: inputElement$2,
|
|
3268
3268
|
inputElementPlaceholder,
|
|
@@ -3288,10 +3288,10 @@ const {
|
|
|
3288
3288
|
const PasswordClass = compose(
|
|
3289
3289
|
createStyleMixin({
|
|
3290
3290
|
mappings: {
|
|
3291
|
-
hostWidth: { ...host$
|
|
3292
|
-
hostMinWidth: { ...host$
|
|
3293
|
-
hostDirection: { ...host$
|
|
3294
|
-
fontSize: [{}, host$
|
|
3291
|
+
hostWidth: { ...host$l, property: 'width' },
|
|
3292
|
+
hostMinWidth: { ...host$l, property: 'min-width' },
|
|
3293
|
+
hostDirection: { ...host$l, property: 'direction' },
|
|
3294
|
+
fontSize: [{}, host$l],
|
|
3295
3295
|
fontFamily: [label$8, inputField$5, errorMessage$b, helperText$9],
|
|
3296
3296
|
inputHeight: { ...inputField$5, property: 'height' },
|
|
3297
3297
|
inputHorizontalPadding: [
|
|
@@ -3388,46 +3388,46 @@ const PasswordClass = compose(
|
|
|
3388
3388
|
}
|
|
3389
3389
|
`,
|
|
3390
3390
|
excludeAttrsSync: ['tabindex'],
|
|
3391
|
-
componentName: componentName$
|
|
3391
|
+
componentName: componentName$K,
|
|
3392
3392
|
})
|
|
3393
3393
|
);
|
|
3394
3394
|
|
|
3395
|
-
const globalRefs$
|
|
3396
|
-
const vars$
|
|
3395
|
+
const globalRefs$l = getThemeRefs(globals);
|
|
3396
|
+
const vars$A = PasswordClass.cssVarList;
|
|
3397
3397
|
|
|
3398
3398
|
const password = {
|
|
3399
|
-
[vars$
|
|
3400
|
-
[vars$
|
|
3401
|
-
[vars$
|
|
3402
|
-
[vars$
|
|
3403
|
-
[vars$
|
|
3404
|
-
[vars$
|
|
3405
|
-
[vars$
|
|
3406
|
-
[vars$
|
|
3407
|
-
[vars$
|
|
3408
|
-
[vars$
|
|
3409
|
-
[vars$
|
|
3410
|
-
[vars$
|
|
3411
|
-
[vars$
|
|
3412
|
-
[vars$
|
|
3413
|
-
[vars$
|
|
3414
|
-
[vars$
|
|
3415
|
-
[vars$
|
|
3416
|
-
[vars$
|
|
3417
|
-
[vars$
|
|
3418
|
-
[vars$
|
|
3419
|
-
[vars$
|
|
3420
|
-
[vars$
|
|
3421
|
-
[vars$
|
|
3399
|
+
[vars$A.hostWidth]: refs.width,
|
|
3400
|
+
[vars$A.hostDirection]: refs.direction,
|
|
3401
|
+
[vars$A.fontSize]: refs.fontSize,
|
|
3402
|
+
[vars$A.fontFamily]: refs.fontFamily,
|
|
3403
|
+
[vars$A.labelTextColor]: refs.labelTextColor,
|
|
3404
|
+
[vars$A.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
3405
|
+
[vars$A.inputHorizontalPadding]: refs.horizontalPadding,
|
|
3406
|
+
[vars$A.inputHeight]: refs.inputHeight,
|
|
3407
|
+
[vars$A.inputBackgroundColor]: refs.backgroundColor,
|
|
3408
|
+
[vars$A.labelRequiredIndicator]: refs.requiredIndicator,
|
|
3409
|
+
[vars$A.inputValueTextColor]: refs.valueTextColor,
|
|
3410
|
+
[vars$A.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
|
3411
|
+
[vars$A.inputBorderWidth]: refs.borderWidth,
|
|
3412
|
+
[vars$A.inputBorderStyle]: refs.borderStyle,
|
|
3413
|
+
[vars$A.inputBorderColor]: refs.borderColor,
|
|
3414
|
+
[vars$A.inputBorderRadius]: refs.borderRadius,
|
|
3415
|
+
[vars$A.inputOutlineWidth]: refs.outlineWidth,
|
|
3416
|
+
[vars$A.inputOutlineStyle]: refs.outlineStyle,
|
|
3417
|
+
[vars$A.inputOutlineColor]: refs.outlineColor,
|
|
3418
|
+
[vars$A.inputOutlineOffset]: refs.outlineOffset,
|
|
3419
|
+
[vars$A.revealButtonOffset]: globalRefs$l.spacing.md,
|
|
3420
|
+
[vars$A.revealButtonSize]: refs.toggleButtonSize,
|
|
3421
|
+
[vars$A.revealButtonColor]: refs.placeholderTextColor,
|
|
3422
3422
|
};
|
|
3423
3423
|
|
|
3424
3424
|
var password$1 = /*#__PURE__*/Object.freeze({
|
|
3425
3425
|
__proto__: null,
|
|
3426
3426
|
default: password,
|
|
3427
|
-
vars: vars$
|
|
3427
|
+
vars: vars$A
|
|
3428
3428
|
});
|
|
3429
3429
|
|
|
3430
|
-
const componentName$
|
|
3430
|
+
const componentName$J = getComponentName('number-field');
|
|
3431
3431
|
|
|
3432
3432
|
const NumberFieldClass = compose(
|
|
3433
3433
|
createStyleMixin({
|
|
@@ -3453,43 +3453,43 @@ const NumberFieldClass = compose(
|
|
|
3453
3453
|
${resetInputOverrides('vaadin-number-field', NumberFieldClass.cssVarList)}
|
|
3454
3454
|
`,
|
|
3455
3455
|
excludeAttrsSync: ['tabindex'],
|
|
3456
|
-
componentName: componentName$
|
|
3456
|
+
componentName: componentName$J,
|
|
3457
3457
|
})
|
|
3458
3458
|
);
|
|
3459
3459
|
|
|
3460
|
-
const vars$
|
|
3460
|
+
const vars$z = NumberFieldClass.cssVarList;
|
|
3461
3461
|
|
|
3462
3462
|
const numberField = {
|
|
3463
|
-
[vars$
|
|
3464
|
-
[vars$
|
|
3465
|
-
[vars$
|
|
3466
|
-
[vars$
|
|
3467
|
-
[vars$
|
|
3468
|
-
[vars$
|
|
3469
|
-
[vars$
|
|
3470
|
-
[vars$
|
|
3471
|
-
[vars$
|
|
3472
|
-
[vars$
|
|
3473
|
-
[vars$
|
|
3474
|
-
[vars$
|
|
3475
|
-
[vars$
|
|
3476
|
-
[vars$
|
|
3477
|
-
[vars$
|
|
3478
|
-
[vars$
|
|
3479
|
-
[vars$
|
|
3480
|
-
[vars$
|
|
3481
|
-
[vars$
|
|
3482
|
-
[vars$
|
|
3483
|
-
[vars$
|
|
3463
|
+
[vars$z.hostWidth]: refs.width,
|
|
3464
|
+
[vars$z.hostMinWidth]: refs.minWidth,
|
|
3465
|
+
[vars$z.hostDirection]: refs.direction,
|
|
3466
|
+
[vars$z.fontSize]: refs.fontSize,
|
|
3467
|
+
[vars$z.fontFamily]: refs.fontFamily,
|
|
3468
|
+
[vars$z.labelTextColor]: refs.labelTextColor,
|
|
3469
|
+
[vars$z.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
3470
|
+
[vars$z.inputValueTextColor]: refs.valueTextColor,
|
|
3471
|
+
[vars$z.inputPlaceholderColor]: refs.placeholderTextColor,
|
|
3472
|
+
[vars$z.inputBorderWidth]: refs.borderWidth,
|
|
3473
|
+
[vars$z.inputBorderStyle]: refs.borderStyle,
|
|
3474
|
+
[vars$z.inputBorderColor]: refs.borderColor,
|
|
3475
|
+
[vars$z.inputBorderRadius]: refs.borderRadius,
|
|
3476
|
+
[vars$z.inputOutlineWidth]: refs.outlineWidth,
|
|
3477
|
+
[vars$z.inputOutlineStyle]: refs.outlineStyle,
|
|
3478
|
+
[vars$z.inputOutlineColor]: refs.outlineColor,
|
|
3479
|
+
[vars$z.inputOutlineOffset]: refs.outlineOffset,
|
|
3480
|
+
[vars$z.inputBackgroundColor]: refs.backgroundColor,
|
|
3481
|
+
[vars$z.labelRequiredIndicator]: refs.requiredIndicator,
|
|
3482
|
+
[vars$z.inputHorizontalPadding]: refs.horizontalPadding,
|
|
3483
|
+
[vars$z.inputHeight]: refs.inputHeight,
|
|
3484
3484
|
};
|
|
3485
3485
|
|
|
3486
3486
|
var numberField$1 = /*#__PURE__*/Object.freeze({
|
|
3487
3487
|
__proto__: null,
|
|
3488
3488
|
default: numberField,
|
|
3489
|
-
vars: vars$
|
|
3489
|
+
vars: vars$z
|
|
3490
3490
|
});
|
|
3491
3491
|
|
|
3492
|
-
const componentName$
|
|
3492
|
+
const componentName$I = getComponentName('email-field');
|
|
3493
3493
|
|
|
3494
3494
|
const customMixin$7 = (superclass) =>
|
|
3495
3495
|
class EmailFieldMixinClass extends superclass {
|
|
@@ -3524,46 +3524,46 @@ const EmailFieldClass = compose(
|
|
|
3524
3524
|
${resetInputOverrides('vaadin-email-field', EmailFieldClass.cssVarList)}
|
|
3525
3525
|
`,
|
|
3526
3526
|
excludeAttrsSync: ['tabindex'],
|
|
3527
|
-
componentName: componentName$
|
|
3527
|
+
componentName: componentName$I,
|
|
3528
3528
|
})
|
|
3529
3529
|
);
|
|
3530
3530
|
|
|
3531
|
-
const vars$
|
|
3531
|
+
const vars$y = EmailFieldClass.cssVarList;
|
|
3532
3532
|
|
|
3533
3533
|
const emailField = {
|
|
3534
|
-
[vars$
|
|
3535
|
-
[vars$
|
|
3536
|
-
[vars$
|
|
3537
|
-
[vars$
|
|
3538
|
-
[vars$
|
|
3539
|
-
[vars$
|
|
3540
|
-
[vars$
|
|
3541
|
-
[vars$
|
|
3542
|
-
[vars$
|
|
3543
|
-
[vars$
|
|
3544
|
-
[vars$
|
|
3545
|
-
[vars$
|
|
3546
|
-
[vars$
|
|
3547
|
-
[vars$
|
|
3548
|
-
[vars$
|
|
3549
|
-
[vars$
|
|
3550
|
-
[vars$
|
|
3551
|
-
[vars$
|
|
3552
|
-
[vars$
|
|
3553
|
-
[vars$
|
|
3554
|
-
[vars$
|
|
3534
|
+
[vars$y.hostWidth]: refs.width,
|
|
3535
|
+
[vars$y.hostMinWidth]: refs.minWidth,
|
|
3536
|
+
[vars$y.hostDirection]: refs.direction,
|
|
3537
|
+
[vars$y.fontSize]: refs.fontSize,
|
|
3538
|
+
[vars$y.fontFamily]: refs.fontFamily,
|
|
3539
|
+
[vars$y.labelTextColor]: refs.labelTextColor,
|
|
3540
|
+
[vars$y.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
3541
|
+
[vars$y.inputValueTextColor]: refs.valueTextColor,
|
|
3542
|
+
[vars$y.labelRequiredIndicator]: refs.requiredIndicator,
|
|
3543
|
+
[vars$y.inputPlaceholderColor]: refs.placeholderTextColor,
|
|
3544
|
+
[vars$y.inputBorderWidth]: refs.borderWidth,
|
|
3545
|
+
[vars$y.inputBorderStyle]: refs.borderStyle,
|
|
3546
|
+
[vars$y.inputBorderColor]: refs.borderColor,
|
|
3547
|
+
[vars$y.inputBorderRadius]: refs.borderRadius,
|
|
3548
|
+
[vars$y.inputOutlineWidth]: refs.outlineWidth,
|
|
3549
|
+
[vars$y.inputOutlineStyle]: refs.outlineStyle,
|
|
3550
|
+
[vars$y.inputOutlineColor]: refs.outlineColor,
|
|
3551
|
+
[vars$y.inputOutlineOffset]: refs.outlineOffset,
|
|
3552
|
+
[vars$y.inputBackgroundColor]: refs.backgroundColor,
|
|
3553
|
+
[vars$y.inputHorizontalPadding]: refs.horizontalPadding,
|
|
3554
|
+
[vars$y.inputHeight]: refs.inputHeight,
|
|
3555
3555
|
};
|
|
3556
3556
|
|
|
3557
3557
|
var emailField$1 = /*#__PURE__*/Object.freeze({
|
|
3558
3558
|
__proto__: null,
|
|
3559
3559
|
default: emailField,
|
|
3560
|
-
vars: vars$
|
|
3560
|
+
vars: vars$y
|
|
3561
3561
|
});
|
|
3562
3562
|
|
|
3563
|
-
const componentName$
|
|
3563
|
+
const componentName$H = getComponentName('text-area');
|
|
3564
3564
|
|
|
3565
3565
|
const {
|
|
3566
|
-
host: host$
|
|
3566
|
+
host: host$k,
|
|
3567
3567
|
label: label$7,
|
|
3568
3568
|
placeholder: placeholder$2,
|
|
3569
3569
|
inputField: inputField$4,
|
|
@@ -3585,10 +3585,10 @@ const {
|
|
|
3585
3585
|
const TextAreaClass = compose(
|
|
3586
3586
|
createStyleMixin({
|
|
3587
3587
|
mappings: {
|
|
3588
|
-
hostWidth: { ...host$
|
|
3589
|
-
hostMinWidth: { ...host$
|
|
3590
|
-
hostDirection: { ...host$
|
|
3591
|
-
fontSize: [host$
|
|
3588
|
+
hostWidth: { ...host$k, property: 'width' },
|
|
3589
|
+
hostMinWidth: { ...host$k, property: 'min-width' },
|
|
3590
|
+
hostDirection: { ...host$k, property: 'direction' },
|
|
3591
|
+
fontSize: [host$k, textArea$2],
|
|
3592
3592
|
fontFamily: [label$7, inputField$4, helperText$8, errorMessage$a],
|
|
3593
3593
|
labelTextColor: [
|
|
3594
3594
|
{ ...label$7, property: 'color' },
|
|
@@ -3636,49 +3636,49 @@ const TextAreaClass = compose(
|
|
|
3636
3636
|
${resetInputCursor('vaadin-text-area')}
|
|
3637
3637
|
`,
|
|
3638
3638
|
excludeAttrsSync: ['tabindex'],
|
|
3639
|
-
componentName: componentName$
|
|
3639
|
+
componentName: componentName$H,
|
|
3640
3640
|
})
|
|
3641
3641
|
);
|
|
3642
3642
|
|
|
3643
|
-
const vars$
|
|
3643
|
+
const vars$x = TextAreaClass.cssVarList;
|
|
3644
3644
|
|
|
3645
3645
|
const textArea = {
|
|
3646
|
-
[vars$
|
|
3647
|
-
[vars$
|
|
3648
|
-
[vars$
|
|
3649
|
-
[vars$
|
|
3650
|
-
[vars$
|
|
3651
|
-
[vars$
|
|
3652
|
-
[vars$
|
|
3653
|
-
[vars$
|
|
3654
|
-
[vars$
|
|
3655
|
-
[vars$
|
|
3656
|
-
[vars$
|
|
3657
|
-
[vars$
|
|
3658
|
-
[vars$
|
|
3659
|
-
[vars$
|
|
3660
|
-
[vars$
|
|
3661
|
-
[vars$
|
|
3662
|
-
[vars$
|
|
3663
|
-
[vars$
|
|
3664
|
-
[vars$
|
|
3665
|
-
[vars$
|
|
3666
|
-
[vars$
|
|
3646
|
+
[vars$x.hostWidth]: refs.width,
|
|
3647
|
+
[vars$x.hostMinWidth]: refs.minWidth,
|
|
3648
|
+
[vars$x.hostDirection]: refs.direction,
|
|
3649
|
+
[vars$x.fontSize]: refs.fontSize,
|
|
3650
|
+
[vars$x.fontFamily]: refs.fontFamily,
|
|
3651
|
+
[vars$x.labelTextColor]: refs.labelTextColor,
|
|
3652
|
+
[vars$x.labelRequiredIndicator]: refs.requiredIndicator,
|
|
3653
|
+
[vars$x.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
3654
|
+
[vars$x.inputBackgroundColor]: refs.backgroundColor,
|
|
3655
|
+
[vars$x.inputValueTextColor]: refs.valueTextColor,
|
|
3656
|
+
[vars$x.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
|
3657
|
+
[vars$x.inputBorderRadius]: refs.borderRadius,
|
|
3658
|
+
[vars$x.inputBorderWidth]: refs.borderWidth,
|
|
3659
|
+
[vars$x.inputBorderStyle]: refs.borderStyle,
|
|
3660
|
+
[vars$x.inputBorderColor]: refs.borderColor,
|
|
3661
|
+
[vars$x.inputOutlineWidth]: refs.outlineWidth,
|
|
3662
|
+
[vars$x.inputOutlineStyle]: refs.outlineStyle,
|
|
3663
|
+
[vars$x.inputOutlineColor]: refs.outlineColor,
|
|
3664
|
+
[vars$x.inputOutlineOffset]: refs.outlineOffset,
|
|
3665
|
+
[vars$x.inputResizeType]: 'vertical',
|
|
3666
|
+
[vars$x.inputMinHeight]: '5em',
|
|
3667
3667
|
textAlign: {
|
|
3668
|
-
right: { [vars$
|
|
3669
|
-
left: { [vars$
|
|
3670
|
-
center: { [vars$
|
|
3668
|
+
right: { [vars$x.inputTextAlign]: 'right' },
|
|
3669
|
+
left: { [vars$x.inputTextAlign]: 'left' },
|
|
3670
|
+
center: { [vars$x.inputTextAlign]: 'center' },
|
|
3671
3671
|
},
|
|
3672
3672
|
|
|
3673
3673
|
_readonly: {
|
|
3674
|
-
[vars$
|
|
3674
|
+
[vars$x.inputResizeType]: 'none',
|
|
3675
3675
|
},
|
|
3676
3676
|
};
|
|
3677
3677
|
|
|
3678
3678
|
var textArea$1 = /*#__PURE__*/Object.freeze({
|
|
3679
3679
|
__proto__: null,
|
|
3680
3680
|
default: textArea,
|
|
3681
|
-
vars: vars$
|
|
3681
|
+
vars: vars$x
|
|
3682
3682
|
});
|
|
3683
3683
|
|
|
3684
3684
|
const createBaseInputClass = (...args) =>
|
|
@@ -3689,9 +3689,9 @@ const createBaseInputClass = (...args) =>
|
|
|
3689
3689
|
inputEventsDispatchingMixin
|
|
3690
3690
|
)(createBaseClass(...args));
|
|
3691
3691
|
|
|
3692
|
-
const componentName$
|
|
3692
|
+
const componentName$G = getComponentName('boolean-field-internal');
|
|
3693
3693
|
|
|
3694
|
-
createBaseInputClass({ componentName: componentName$
|
|
3694
|
+
createBaseInputClass({ componentName: componentName$G, baseSelector: 'div' });
|
|
3695
3695
|
|
|
3696
3696
|
const booleanFieldMixin = (superclass) =>
|
|
3697
3697
|
class BooleanFieldMixinClass extends superclass {
|
|
@@ -3700,14 +3700,14 @@ const booleanFieldMixin = (superclass) =>
|
|
|
3700
3700
|
|
|
3701
3701
|
const template = document.createElement('template');
|
|
3702
3702
|
template.innerHTML = `
|
|
3703
|
-
<${componentName$
|
|
3703
|
+
<${componentName$G}
|
|
3704
3704
|
tabindex="-1"
|
|
3705
3705
|
slot="input"
|
|
3706
|
-
></${componentName$
|
|
3706
|
+
></${componentName$G}>
|
|
3707
3707
|
`;
|
|
3708
3708
|
|
|
3709
3709
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
|
3710
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
|
3710
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$G);
|
|
3711
3711
|
this.checkbox = this.inputElement.querySelector('vaadin-checkbox');
|
|
3712
3712
|
|
|
3713
3713
|
forwardAttrs(this, this.inputElement, {
|
|
@@ -3777,10 +3777,10 @@ descope-boolean-field-internal {
|
|
|
3777
3777
|
}
|
|
3778
3778
|
`;
|
|
3779
3779
|
|
|
3780
|
-
const componentName$
|
|
3780
|
+
const componentName$F = getComponentName('checkbox');
|
|
3781
3781
|
|
|
3782
3782
|
const {
|
|
3783
|
-
host: host$
|
|
3783
|
+
host: host$j,
|
|
3784
3784
|
component: component$1,
|
|
3785
3785
|
checkboxElement,
|
|
3786
3786
|
checkboxSurface,
|
|
@@ -3802,10 +3802,10 @@ const {
|
|
|
3802
3802
|
const CheckboxClass = compose(
|
|
3803
3803
|
createStyleMixin({
|
|
3804
3804
|
mappings: {
|
|
3805
|
-
hostWidth: { ...host$
|
|
3806
|
-
hostDirection: { ...host$
|
|
3805
|
+
hostWidth: { ...host$j, property: 'width' },
|
|
3806
|
+
hostDirection: { ...host$j, property: 'direction' },
|
|
3807
3807
|
|
|
3808
|
-
fontSize: [host$
|
|
3808
|
+
fontSize: [host$j, checkboxElement, checkboxLabel$1],
|
|
3809
3809
|
fontFamily: [checkboxLabel$1, helperText$7, errorMessage$9],
|
|
3810
3810
|
|
|
3811
3811
|
labelTextColor: { ...checkboxLabel$1, property: 'color' },
|
|
@@ -3883,54 +3883,54 @@ const CheckboxClass = compose(
|
|
|
3883
3883
|
}
|
|
3884
3884
|
`,
|
|
3885
3885
|
excludeAttrsSync: ['label', 'tabindex'],
|
|
3886
|
-
componentName: componentName$
|
|
3886
|
+
componentName: componentName$F,
|
|
3887
3887
|
})
|
|
3888
3888
|
);
|
|
3889
3889
|
|
|
3890
|
-
const vars$
|
|
3890
|
+
const vars$w = CheckboxClass.cssVarList;
|
|
3891
3891
|
const checkboxSize = '1.35em';
|
|
3892
3892
|
|
|
3893
3893
|
const checkbox = {
|
|
3894
|
-
[vars$
|
|
3895
|
-
[vars$
|
|
3896
|
-
[vars$
|
|
3897
|
-
[vars$
|
|
3898
|
-
[vars$
|
|
3899
|
-
[vars$
|
|
3900
|
-
[vars$
|
|
3901
|
-
[vars$
|
|
3902
|
-
[vars$
|
|
3903
|
-
[vars$
|
|
3904
|
-
[vars$
|
|
3905
|
-
[vars$
|
|
3906
|
-
[vars$
|
|
3907
|
-
[vars$
|
|
3908
|
-
[vars$
|
|
3909
|
-
[vars$
|
|
3910
|
-
[vars$
|
|
3911
|
-
[vars$
|
|
3912
|
-
[vars$
|
|
3913
|
-
[vars$
|
|
3894
|
+
[vars$w.hostWidth]: refs.width,
|
|
3895
|
+
[vars$w.hostDirection]: refs.direction,
|
|
3896
|
+
[vars$w.fontSize]: refs.fontSize,
|
|
3897
|
+
[vars$w.fontFamily]: refs.fontFamily,
|
|
3898
|
+
[vars$w.labelTextColor]: refs.labelTextColor,
|
|
3899
|
+
[vars$w.labelRequiredIndicator]: refs.requiredIndicator,
|
|
3900
|
+
[vars$w.labelFontWeight]: '400',
|
|
3901
|
+
[vars$w.labelLineHeight]: checkboxSize,
|
|
3902
|
+
[vars$w.labelSpacing]: '1em',
|
|
3903
|
+
[vars$w.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
3904
|
+
[vars$w.inputOutlineWidth]: refs.outlineWidth,
|
|
3905
|
+
[vars$w.inputOutlineOffset]: refs.outlineOffset,
|
|
3906
|
+
[vars$w.inputOutlineColor]: refs.outlineColor,
|
|
3907
|
+
[vars$w.inputOutlineStyle]: refs.outlineStyle,
|
|
3908
|
+
[vars$w.inputBorderRadius]: refs.borderRadius,
|
|
3909
|
+
[vars$w.inputBorderColor]: refs.borderColor,
|
|
3910
|
+
[vars$w.inputBorderWidth]: refs.borderWidth,
|
|
3911
|
+
[vars$w.inputBorderStyle]: refs.borderStyle,
|
|
3912
|
+
[vars$w.inputBackgroundColor]: refs.backgroundColor,
|
|
3913
|
+
[vars$w.inputSize]: checkboxSize,
|
|
3914
3914
|
|
|
3915
3915
|
_checked: {
|
|
3916
|
-
[vars$
|
|
3916
|
+
[vars$w.inputValueTextColor]: refs.valueTextColor,
|
|
3917
3917
|
},
|
|
3918
3918
|
|
|
3919
3919
|
_disabled: {
|
|
3920
|
-
[vars$
|
|
3920
|
+
[vars$w.labelTextColor]: refs.labelTextColor,
|
|
3921
3921
|
},
|
|
3922
3922
|
};
|
|
3923
3923
|
|
|
3924
3924
|
var checkbox$1 = /*#__PURE__*/Object.freeze({
|
|
3925
3925
|
__proto__: null,
|
|
3926
3926
|
default: checkbox,
|
|
3927
|
-
vars: vars$
|
|
3927
|
+
vars: vars$w
|
|
3928
3928
|
});
|
|
3929
3929
|
|
|
3930
|
-
const componentName$
|
|
3930
|
+
const componentName$E = getComponentName('switch-toggle');
|
|
3931
3931
|
|
|
3932
3932
|
const {
|
|
3933
|
-
host: host$
|
|
3933
|
+
host: host$i,
|
|
3934
3934
|
component,
|
|
3935
3935
|
checkboxElement: track,
|
|
3936
3936
|
checkboxSurface: knob,
|
|
@@ -3952,8 +3952,8 @@ const {
|
|
|
3952
3952
|
const SwitchToggleClass = compose(
|
|
3953
3953
|
createStyleMixin({
|
|
3954
3954
|
mappings: {
|
|
3955
|
-
hostWidth: { ...host$
|
|
3956
|
-
hostDirection: { ...host$
|
|
3955
|
+
hostWidth: { ...host$i, property: 'width' },
|
|
3956
|
+
hostDirection: { ...host$i, property: 'direction' },
|
|
3957
3957
|
|
|
3958
3958
|
fontSize: [component, checkboxLabel, checkboxLabel],
|
|
3959
3959
|
fontFamily: [checkboxLabel, helperText$6, errorMessage$8],
|
|
@@ -4059,82 +4059,82 @@ const SwitchToggleClass = compose(
|
|
|
4059
4059
|
}
|
|
4060
4060
|
`,
|
|
4061
4061
|
excludeAttrsSync: ['label', 'tabindex'],
|
|
4062
|
-
componentName: componentName$
|
|
4062
|
+
componentName: componentName$E,
|
|
4063
4063
|
})
|
|
4064
4064
|
);
|
|
4065
4065
|
|
|
4066
4066
|
const knobMargin = '2px';
|
|
4067
4067
|
const checkboxHeight = '1.25em';
|
|
4068
4068
|
|
|
4069
|
-
const globalRefs$
|
|
4070
|
-
const vars$
|
|
4069
|
+
const globalRefs$k = getThemeRefs(globals);
|
|
4070
|
+
const vars$v = SwitchToggleClass.cssVarList;
|
|
4071
4071
|
|
|
4072
4072
|
const switchToggle = {
|
|
4073
|
-
[vars$
|
|
4074
|
-
[vars$
|
|
4075
|
-
[vars$
|
|
4076
|
-
[vars$
|
|
4077
|
-
|
|
4078
|
-
[vars$
|
|
4079
|
-
[vars$
|
|
4080
|
-
[vars$
|
|
4081
|
-
[vars$
|
|
4082
|
-
|
|
4083
|
-
[vars$
|
|
4084
|
-
[vars$
|
|
4085
|
-
[vars$
|
|
4086
|
-
[vars$
|
|
4087
|
-
[vars$
|
|
4088
|
-
[vars$
|
|
4089
|
-
[vars$
|
|
4090
|
-
|
|
4091
|
-
[vars$
|
|
4092
|
-
[vars$
|
|
4093
|
-
[vars$
|
|
4094
|
-
[vars$
|
|
4095
|
-
[vars$
|
|
4096
|
-
[vars$
|
|
4097
|
-
|
|
4098
|
-
[vars$
|
|
4099
|
-
[vars$
|
|
4100
|
-
[vars$
|
|
4101
|
-
[vars$
|
|
4102
|
-
[vars$
|
|
4103
|
-
[vars$
|
|
4073
|
+
[vars$v.hostWidth]: refs.width,
|
|
4074
|
+
[vars$v.hostDirection]: refs.direction,
|
|
4075
|
+
[vars$v.fontSize]: refs.fontSize,
|
|
4076
|
+
[vars$v.fontFamily]: refs.fontFamily,
|
|
4077
|
+
|
|
4078
|
+
[vars$v.inputOutlineWidth]: refs.outlineWidth,
|
|
4079
|
+
[vars$v.inputOutlineOffset]: refs.outlineOffset,
|
|
4080
|
+
[vars$v.inputOutlineColor]: refs.outlineColor,
|
|
4081
|
+
[vars$v.inputOutlineStyle]: refs.outlineStyle,
|
|
4082
|
+
|
|
4083
|
+
[vars$v.trackBorderStyle]: refs.borderStyle,
|
|
4084
|
+
[vars$v.trackBorderWidth]: refs.borderWidth, // var `trackBorderWidth` used outside the theme for `left` margin calculation
|
|
4085
|
+
[vars$v.trackBorderColor]: refs.borderColor,
|
|
4086
|
+
[vars$v.trackBackgroundColor]: refs.backgroundColor,
|
|
4087
|
+
[vars$v.trackBorderRadius]: globalRefs$k.radius.md,
|
|
4088
|
+
[vars$v.trackWidth]: '2.5em', // var `trackWidth` used outside the theme for `left` margin calculation
|
|
4089
|
+
[vars$v.trackHeight]: checkboxHeight,
|
|
4090
|
+
|
|
4091
|
+
[vars$v.knobSize]: `calc(1em - ${knobMargin})`,
|
|
4092
|
+
[vars$v.knobRadius]: '50%',
|
|
4093
|
+
[vars$v.knobTopOffset]: '1px',
|
|
4094
|
+
[vars$v.knobLeftOffset]: knobMargin,
|
|
4095
|
+
[vars$v.knobColor]: refs.labelTextColor,
|
|
4096
|
+
[vars$v.knobTransitionDuration]: '0.3s',
|
|
4097
|
+
|
|
4098
|
+
[vars$v.labelTextColor]: refs.labelTextColor,
|
|
4099
|
+
[vars$v.labelFontWeight]: '400',
|
|
4100
|
+
[vars$v.labelLineHeight]: '1.35em',
|
|
4101
|
+
[vars$v.labelSpacing]: '1em',
|
|
4102
|
+
[vars$v.labelRequiredIndicator]: refs.requiredIndicator,
|
|
4103
|
+
[vars$v.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
4104
4104
|
|
|
4105
4105
|
_checked: {
|
|
4106
|
-
[vars$
|
|
4107
|
-
[vars$
|
|
4108
|
-
[vars$
|
|
4109
|
-
[vars$
|
|
4106
|
+
[vars$v.trackBorderColor]: refs.borderColor,
|
|
4107
|
+
[vars$v.knobLeftOffset]: `calc(100% - var(${vars$v.knobSize}) - ${knobMargin})`,
|
|
4108
|
+
[vars$v.knobColor]: refs.valueTextColor,
|
|
4109
|
+
[vars$v.knobTextColor]: refs.valueTextColor,
|
|
4110
4110
|
},
|
|
4111
4111
|
|
|
4112
4112
|
_disabled: {
|
|
4113
|
-
[vars$
|
|
4114
|
-
[vars$
|
|
4115
|
-
[vars$
|
|
4116
|
-
[vars$
|
|
4113
|
+
[vars$v.knobColor]: globalRefs$k.colors.surface.light,
|
|
4114
|
+
[vars$v.trackBorderColor]: globalRefs$k.colors.surface.light,
|
|
4115
|
+
[vars$v.trackBackgroundColor]: globalRefs$k.colors.surface.main,
|
|
4116
|
+
[vars$v.labelTextColor]: refs.labelTextColor,
|
|
4117
4117
|
_checked: {
|
|
4118
|
-
[vars$
|
|
4119
|
-
[vars$
|
|
4118
|
+
[vars$v.knobColor]: globalRefs$k.colors.surface.light,
|
|
4119
|
+
[vars$v.trackBackgroundColor]: globalRefs$k.colors.surface.main,
|
|
4120
4120
|
},
|
|
4121
4121
|
},
|
|
4122
4122
|
|
|
4123
4123
|
_invalid: {
|
|
4124
|
-
[vars$
|
|
4125
|
-
[vars$
|
|
4124
|
+
[vars$v.trackBorderColor]: globalRefs$k.colors.error.main,
|
|
4125
|
+
[vars$v.knobColor]: globalRefs$k.colors.error.main,
|
|
4126
4126
|
},
|
|
4127
4127
|
};
|
|
4128
4128
|
|
|
4129
4129
|
var switchToggle$1 = /*#__PURE__*/Object.freeze({
|
|
4130
4130
|
__proto__: null,
|
|
4131
4131
|
default: switchToggle,
|
|
4132
|
-
vars: vars$
|
|
4132
|
+
vars: vars$v
|
|
4133
4133
|
});
|
|
4134
4134
|
|
|
4135
|
-
const componentName$
|
|
4135
|
+
const componentName$D = getComponentName('container');
|
|
4136
4136
|
|
|
4137
|
-
class RawContainer extends createBaseClass({ componentName: componentName$
|
|
4137
|
+
class RawContainer extends createBaseClass({ componentName: componentName$D, baseSelector: 'slot' }) {
|
|
4138
4138
|
constructor() {
|
|
4139
4139
|
super();
|
|
4140
4140
|
|
|
@@ -4187,7 +4187,7 @@ const ContainerClass = compose(
|
|
|
4187
4187
|
componentNameValidationMixin
|
|
4188
4188
|
)(RawContainer);
|
|
4189
4189
|
|
|
4190
|
-
const globalRefs$
|
|
4190
|
+
const globalRefs$j = getThemeRefs(globals);
|
|
4191
4191
|
|
|
4192
4192
|
const compVars$4 = ContainerClass.cssVarList;
|
|
4193
4193
|
|
|
@@ -4209,7 +4209,7 @@ const [helperTheme$2, helperRefs$2, helperVars$2] = createHelperVars(
|
|
|
4209
4209
|
horizontalAlignment,
|
|
4210
4210
|
shadowColor: '#00000020', // if we want to support transparency vars, we should use different color format
|
|
4211
4211
|
},
|
|
4212
|
-
componentName$
|
|
4212
|
+
componentName$D
|
|
4213
4213
|
);
|
|
4214
4214
|
|
|
4215
4215
|
const { shadowColor: shadowColor$1 } = helperRefs$2;
|
|
@@ -4219,10 +4219,10 @@ const container = {
|
|
|
4219
4219
|
|
|
4220
4220
|
[compVars$4.hostWidth]: '100%',
|
|
4221
4221
|
[compVars$4.boxShadow]: 'none',
|
|
4222
|
-
[compVars$4.backgroundColor]: globalRefs$
|
|
4223
|
-
[compVars$4.color]: globalRefs$
|
|
4222
|
+
[compVars$4.backgroundColor]: globalRefs$j.colors.surface.main,
|
|
4223
|
+
[compVars$4.color]: globalRefs$j.colors.surface.contrast,
|
|
4224
4224
|
[compVars$4.borderRadius]: '0px',
|
|
4225
|
-
[compVars$4.hostDirection]: globalRefs$
|
|
4225
|
+
[compVars$4.hostDirection]: globalRefs$j.direction,
|
|
4226
4226
|
|
|
4227
4227
|
verticalPadding: {
|
|
4228
4228
|
sm: { [compVars$4.verticalPadding]: '5px' },
|
|
@@ -4268,34 +4268,34 @@ const container = {
|
|
|
4268
4268
|
|
|
4269
4269
|
shadow: {
|
|
4270
4270
|
sm: {
|
|
4271
|
-
[compVars$4.boxShadow]: `${globalRefs$
|
|
4271
|
+
[compVars$4.boxShadow]: `${globalRefs$j.shadow.wide.sm} ${shadowColor$1}, ${globalRefs$j.shadow.narrow.sm} ${shadowColor$1}`,
|
|
4272
4272
|
},
|
|
4273
4273
|
md: {
|
|
4274
|
-
[compVars$4.boxShadow]: `${globalRefs$
|
|
4274
|
+
[compVars$4.boxShadow]: `${globalRefs$j.shadow.wide.md} ${shadowColor$1}, ${globalRefs$j.shadow.narrow.md} ${shadowColor$1}`,
|
|
4275
4275
|
},
|
|
4276
4276
|
lg: {
|
|
4277
|
-
[compVars$4.boxShadow]: `${globalRefs$
|
|
4277
|
+
[compVars$4.boxShadow]: `${globalRefs$j.shadow.wide.lg} ${shadowColor$1}, ${globalRefs$j.shadow.narrow.lg} ${shadowColor$1}`,
|
|
4278
4278
|
},
|
|
4279
4279
|
xl: {
|
|
4280
|
-
[compVars$4.boxShadow]: `${globalRefs$
|
|
4280
|
+
[compVars$4.boxShadow]: `${globalRefs$j.shadow.wide.xl} ${shadowColor$1}, ${globalRefs$j.shadow.narrow.xl} ${shadowColor$1}`,
|
|
4281
4281
|
},
|
|
4282
4282
|
'2xl': {
|
|
4283
4283
|
[helperVars$2.shadowColor]: '#00000050', // mimic daisyUI shadow settings
|
|
4284
|
-
[compVars$4.boxShadow]: `${globalRefs$
|
|
4284
|
+
[compVars$4.boxShadow]: `${globalRefs$j.shadow.wide['2xl']} ${shadowColor$1}`,
|
|
4285
4285
|
},
|
|
4286
4286
|
},
|
|
4287
4287
|
|
|
4288
4288
|
borderRadius: {
|
|
4289
|
-
sm: { [compVars$4.borderRadius]: globalRefs$
|
|
4290
|
-
md: { [compVars$4.borderRadius]: globalRefs$
|
|
4291
|
-
lg: { [compVars$4.borderRadius]: globalRefs$
|
|
4292
|
-
xl: { [compVars$4.borderRadius]: globalRefs$
|
|
4293
|
-
'2xl': { [compVars$4.borderRadius]: globalRefs$
|
|
4294
|
-
'3xl': { [compVars$4.borderRadius]: globalRefs$
|
|
4289
|
+
sm: { [compVars$4.borderRadius]: globalRefs$j.radius.sm },
|
|
4290
|
+
md: { [compVars$4.borderRadius]: globalRefs$j.radius.md },
|
|
4291
|
+
lg: { [compVars$4.borderRadius]: globalRefs$j.radius.lg },
|
|
4292
|
+
xl: { [compVars$4.borderRadius]: globalRefs$j.radius.xl },
|
|
4293
|
+
'2xl': { [compVars$4.borderRadius]: globalRefs$j.radius['2xl'] },
|
|
4294
|
+
'3xl': { [compVars$4.borderRadius]: globalRefs$j.radius['3xl'] },
|
|
4295
4295
|
},
|
|
4296
4296
|
};
|
|
4297
4297
|
|
|
4298
|
-
const vars$
|
|
4298
|
+
const vars$u = {
|
|
4299
4299
|
...compVars$4,
|
|
4300
4300
|
...helperVars$2,
|
|
4301
4301
|
};
|
|
@@ -4303,7 +4303,7 @@ const vars$t = {
|
|
|
4303
4303
|
var container$1 = /*#__PURE__*/Object.freeze({
|
|
4304
4304
|
__proto__: null,
|
|
4305
4305
|
default: container,
|
|
4306
|
-
vars: vars$
|
|
4306
|
+
vars: vars$u
|
|
4307
4307
|
});
|
|
4308
4308
|
|
|
4309
4309
|
const createCssVarImageClass = ({ componentName, varName, fallbackVarName }) => {
|
|
@@ -4356,71 +4356,71 @@ const createCssVarImageClass = ({ componentName, varName, fallbackVarName }) =>
|
|
|
4356
4356
|
return CssVarImageClass;
|
|
4357
4357
|
};
|
|
4358
4358
|
|
|
4359
|
-
const componentName$
|
|
4359
|
+
const componentName$C = getComponentName('logo');
|
|
4360
4360
|
|
|
4361
4361
|
const LogoClass = createCssVarImageClass({
|
|
4362
|
-
componentName: componentName$
|
|
4362
|
+
componentName: componentName$C,
|
|
4363
4363
|
varName: 'url',
|
|
4364
4364
|
fallbackVarName: 'fallbackUrl',
|
|
4365
4365
|
});
|
|
4366
4366
|
|
|
4367
|
-
const vars$
|
|
4367
|
+
const vars$t = LogoClass.cssVarList;
|
|
4368
4368
|
|
|
4369
4369
|
const logo$2 = {
|
|
4370
|
-
[vars$
|
|
4370
|
+
[vars$t.fallbackUrl]: 'url(https://imgs.descope.com/components/no-logo-placeholder.svg)',
|
|
4371
4371
|
};
|
|
4372
4372
|
|
|
4373
4373
|
var logo$3 = /*#__PURE__*/Object.freeze({
|
|
4374
4374
|
__proto__: null,
|
|
4375
4375
|
default: logo$2,
|
|
4376
|
-
vars: vars$
|
|
4376
|
+
vars: vars$t
|
|
4377
4377
|
});
|
|
4378
4378
|
|
|
4379
|
-
const componentName$
|
|
4379
|
+
const componentName$B = getComponentName('totp-image');
|
|
4380
4380
|
|
|
4381
4381
|
const TotpImageClass = createCssVarImageClass({
|
|
4382
|
-
componentName: componentName$
|
|
4382
|
+
componentName: componentName$B,
|
|
4383
4383
|
varName: 'url',
|
|
4384
4384
|
fallbackVarName: 'fallbackUrl',
|
|
4385
4385
|
});
|
|
4386
4386
|
|
|
4387
|
-
const vars$
|
|
4387
|
+
const vars$s = TotpImageClass.cssVarList;
|
|
4388
4388
|
|
|
4389
4389
|
const logo$1 = {
|
|
4390
|
-
[vars$
|
|
4390
|
+
[vars$s.fallbackUrl]: 'url(https://imgs.descope.com/components/totp-placeholder.svg)',
|
|
4391
4391
|
};
|
|
4392
4392
|
|
|
4393
4393
|
var totpImage = /*#__PURE__*/Object.freeze({
|
|
4394
4394
|
__proto__: null,
|
|
4395
4395
|
default: logo$1,
|
|
4396
|
-
vars: vars$
|
|
4396
|
+
vars: vars$s
|
|
4397
4397
|
});
|
|
4398
4398
|
|
|
4399
|
-
const componentName$
|
|
4399
|
+
const componentName$A = getComponentName('notp-image');
|
|
4400
4400
|
|
|
4401
4401
|
const NotpImageClass = createCssVarImageClass({
|
|
4402
|
-
componentName: componentName$
|
|
4402
|
+
componentName: componentName$A,
|
|
4403
4403
|
varName: 'url',
|
|
4404
4404
|
fallbackVarName: 'fallbackUrl',
|
|
4405
4405
|
});
|
|
4406
4406
|
|
|
4407
|
-
const vars$
|
|
4407
|
+
const vars$r = NotpImageClass.cssVarList;
|
|
4408
4408
|
|
|
4409
4409
|
const logo = {
|
|
4410
|
-
[vars$
|
|
4410
|
+
[vars$r.fallbackUrl]: 'url(https://imgs.descope.com/components/notp-placeholder.svg)',
|
|
4411
4411
|
};
|
|
4412
4412
|
|
|
4413
4413
|
var notpImage = /*#__PURE__*/Object.freeze({
|
|
4414
4414
|
__proto__: null,
|
|
4415
4415
|
default: logo,
|
|
4416
|
-
vars: vars$
|
|
4416
|
+
vars: vars$r
|
|
4417
4417
|
});
|
|
4418
4418
|
|
|
4419
4419
|
// eslint-disable-next-line max-classes-per-file
|
|
4420
4420
|
|
|
4421
|
-
const componentName$
|
|
4421
|
+
const componentName$z = getComponentName('text');
|
|
4422
4422
|
|
|
4423
|
-
class RawText extends createBaseClass({ componentName: componentName$
|
|
4423
|
+
class RawText extends createBaseClass({ componentName: componentName$z, baseSelector: ':host > slot' }) {
|
|
4424
4424
|
constructor() {
|
|
4425
4425
|
super();
|
|
4426
4426
|
|
|
@@ -4480,99 +4480,99 @@ const TextClass = compose(
|
|
|
4480
4480
|
customTextMixin
|
|
4481
4481
|
)(RawText);
|
|
4482
4482
|
|
|
4483
|
-
const globalRefs$
|
|
4484
|
-
const vars$
|
|
4483
|
+
const globalRefs$i = getThemeRefs(globals);
|
|
4484
|
+
const vars$q = TextClass.cssVarList;
|
|
4485
4485
|
|
|
4486
4486
|
const text$2 = {
|
|
4487
|
-
[vars$
|
|
4488
|
-
[vars$
|
|
4489
|
-
[vars$
|
|
4490
|
-
[vars$
|
|
4487
|
+
[vars$q.hostDirection]: globalRefs$i.direction,
|
|
4488
|
+
[vars$q.textLineHeight]: '1.35em',
|
|
4489
|
+
[vars$q.textAlign]: 'left',
|
|
4490
|
+
[vars$q.textColor]: globalRefs$i.colors.surface.dark,
|
|
4491
4491
|
variant: {
|
|
4492
4492
|
h1: {
|
|
4493
|
-
[vars$
|
|
4494
|
-
[vars$
|
|
4495
|
-
[vars$
|
|
4493
|
+
[vars$q.fontSize]: globalRefs$i.typography.h1.size,
|
|
4494
|
+
[vars$q.fontWeight]: globalRefs$i.typography.h1.weight,
|
|
4495
|
+
[vars$q.fontFamily]: globalRefs$i.typography.h1.font,
|
|
4496
4496
|
},
|
|
4497
4497
|
h2: {
|
|
4498
|
-
[vars$
|
|
4499
|
-
[vars$
|
|
4500
|
-
[vars$
|
|
4498
|
+
[vars$q.fontSize]: globalRefs$i.typography.h2.size,
|
|
4499
|
+
[vars$q.fontWeight]: globalRefs$i.typography.h2.weight,
|
|
4500
|
+
[vars$q.fontFamily]: globalRefs$i.typography.h2.font,
|
|
4501
4501
|
},
|
|
4502
4502
|
h3: {
|
|
4503
|
-
[vars$
|
|
4504
|
-
[vars$
|
|
4505
|
-
[vars$
|
|
4503
|
+
[vars$q.fontSize]: globalRefs$i.typography.h3.size,
|
|
4504
|
+
[vars$q.fontWeight]: globalRefs$i.typography.h3.weight,
|
|
4505
|
+
[vars$q.fontFamily]: globalRefs$i.typography.h3.font,
|
|
4506
4506
|
},
|
|
4507
4507
|
subtitle1: {
|
|
4508
|
-
[vars$
|
|
4509
|
-
[vars$
|
|
4510
|
-
[vars$
|
|
4508
|
+
[vars$q.fontSize]: globalRefs$i.typography.subtitle1.size,
|
|
4509
|
+
[vars$q.fontWeight]: globalRefs$i.typography.subtitle1.weight,
|
|
4510
|
+
[vars$q.fontFamily]: globalRefs$i.typography.subtitle1.font,
|
|
4511
4511
|
},
|
|
4512
4512
|
subtitle2: {
|
|
4513
|
-
[vars$
|
|
4514
|
-
[vars$
|
|
4515
|
-
[vars$
|
|
4513
|
+
[vars$q.fontSize]: globalRefs$i.typography.subtitle2.size,
|
|
4514
|
+
[vars$q.fontWeight]: globalRefs$i.typography.subtitle2.weight,
|
|
4515
|
+
[vars$q.fontFamily]: globalRefs$i.typography.subtitle2.font,
|
|
4516
4516
|
},
|
|
4517
4517
|
body1: {
|
|
4518
|
-
[vars$
|
|
4519
|
-
[vars$
|
|
4520
|
-
[vars$
|
|
4518
|
+
[vars$q.fontSize]: globalRefs$i.typography.body1.size,
|
|
4519
|
+
[vars$q.fontWeight]: globalRefs$i.typography.body1.weight,
|
|
4520
|
+
[vars$q.fontFamily]: globalRefs$i.typography.body1.font,
|
|
4521
4521
|
},
|
|
4522
4522
|
body2: {
|
|
4523
|
-
[vars$
|
|
4524
|
-
[vars$
|
|
4525
|
-
[vars$
|
|
4523
|
+
[vars$q.fontSize]: globalRefs$i.typography.body2.size,
|
|
4524
|
+
[vars$q.fontWeight]: globalRefs$i.typography.body2.weight,
|
|
4525
|
+
[vars$q.fontFamily]: globalRefs$i.typography.body2.font,
|
|
4526
4526
|
},
|
|
4527
4527
|
},
|
|
4528
4528
|
|
|
4529
4529
|
mode: {
|
|
4530
4530
|
primary: {
|
|
4531
|
-
[vars$
|
|
4531
|
+
[vars$q.textColor]: globalRefs$i.colors.surface.contrast,
|
|
4532
4532
|
},
|
|
4533
4533
|
secondary: {
|
|
4534
|
-
[vars$
|
|
4534
|
+
[vars$q.textColor]: globalRefs$i.colors.surface.dark,
|
|
4535
4535
|
},
|
|
4536
4536
|
error: {
|
|
4537
|
-
[vars$
|
|
4537
|
+
[vars$q.textColor]: globalRefs$i.colors.error.main,
|
|
4538
4538
|
},
|
|
4539
4539
|
success: {
|
|
4540
|
-
[vars$
|
|
4540
|
+
[vars$q.textColor]: globalRefs$i.colors.success.main,
|
|
4541
4541
|
},
|
|
4542
4542
|
},
|
|
4543
4543
|
|
|
4544
4544
|
textAlign: {
|
|
4545
|
-
right: { [vars$
|
|
4546
|
-
left: { [vars$
|
|
4547
|
-
center: { [vars$
|
|
4545
|
+
right: { [vars$q.textAlign]: 'right' },
|
|
4546
|
+
left: { [vars$q.textAlign]: 'left' },
|
|
4547
|
+
center: { [vars$q.textAlign]: 'center' },
|
|
4548
4548
|
},
|
|
4549
4549
|
|
|
4550
4550
|
_fullWidth: {
|
|
4551
|
-
[vars$
|
|
4551
|
+
[vars$q.hostWidth]: '100%',
|
|
4552
4552
|
},
|
|
4553
4553
|
|
|
4554
4554
|
_italic: {
|
|
4555
|
-
[vars$
|
|
4555
|
+
[vars$q.fontStyle]: 'italic',
|
|
4556
4556
|
},
|
|
4557
4557
|
|
|
4558
4558
|
_uppercase: {
|
|
4559
|
-
[vars$
|
|
4559
|
+
[vars$q.textTransform]: 'uppercase',
|
|
4560
4560
|
},
|
|
4561
4561
|
|
|
4562
4562
|
_lowercase: {
|
|
4563
|
-
[vars$
|
|
4563
|
+
[vars$q.textTransform]: 'lowercase',
|
|
4564
4564
|
},
|
|
4565
4565
|
};
|
|
4566
4566
|
|
|
4567
4567
|
var text$3 = /*#__PURE__*/Object.freeze({
|
|
4568
4568
|
__proto__: null,
|
|
4569
4569
|
default: text$2,
|
|
4570
|
-
vars: vars$
|
|
4570
|
+
vars: vars$q
|
|
4571
4571
|
});
|
|
4572
4572
|
|
|
4573
|
-
const componentName$
|
|
4573
|
+
const componentName$y = getComponentName('link');
|
|
4574
4574
|
|
|
4575
|
-
class RawLink extends createBaseClass({ componentName: componentName$
|
|
4575
|
+
class RawLink extends createBaseClass({ componentName: componentName$y, baseSelector: ':host a' }) {
|
|
4576
4576
|
constructor() {
|
|
4577
4577
|
super();
|
|
4578
4578
|
|
|
@@ -4618,12 +4618,12 @@ const selectors$2 = {
|
|
|
4618
4618
|
text: { selector: () => TextClass.componentName },
|
|
4619
4619
|
};
|
|
4620
4620
|
|
|
4621
|
-
const { anchor, text: text$1, host: host$
|
|
4621
|
+
const { anchor, text: text$1, host: host$h, wrapper: wrapper$1 } = selectors$2;
|
|
4622
4622
|
|
|
4623
4623
|
const LinkClass = compose(
|
|
4624
4624
|
createStyleMixin({
|
|
4625
4625
|
mappings: {
|
|
4626
|
-
hostWidth: { ...host$
|
|
4626
|
+
hostWidth: { ...host$h, property: 'width' },
|
|
4627
4627
|
hostDirection: { ...text$1, property: 'direction' },
|
|
4628
4628
|
textAlign: wrapper$1,
|
|
4629
4629
|
textColor: [
|
|
@@ -4637,37 +4637,37 @@ const LinkClass = compose(
|
|
|
4637
4637
|
componentNameValidationMixin
|
|
4638
4638
|
)(RawLink);
|
|
4639
4639
|
|
|
4640
|
-
const globalRefs$
|
|
4641
|
-
const vars$
|
|
4640
|
+
const globalRefs$h = getThemeRefs(globals);
|
|
4641
|
+
const vars$p = LinkClass.cssVarList;
|
|
4642
4642
|
|
|
4643
4643
|
const link = {
|
|
4644
|
-
[vars$
|
|
4645
|
-
[vars$
|
|
4644
|
+
[vars$p.hostDirection]: globalRefs$h.direction,
|
|
4645
|
+
[vars$p.cursor]: 'pointer',
|
|
4646
4646
|
|
|
4647
|
-
[vars$
|
|
4647
|
+
[vars$p.textColor]: globalRefs$h.colors.primary.main,
|
|
4648
4648
|
|
|
4649
4649
|
textAlign: {
|
|
4650
|
-
right: { [vars$
|
|
4651
|
-
left: { [vars$
|
|
4652
|
-
center: { [vars$
|
|
4650
|
+
right: { [vars$p.textAlign]: 'right' },
|
|
4651
|
+
left: { [vars$p.textAlign]: 'left' },
|
|
4652
|
+
center: { [vars$p.textAlign]: 'center' },
|
|
4653
4653
|
},
|
|
4654
4654
|
|
|
4655
4655
|
_fullWidth: {
|
|
4656
|
-
[vars$
|
|
4656
|
+
[vars$p.hostWidth]: '100%',
|
|
4657
4657
|
},
|
|
4658
4658
|
|
|
4659
4659
|
mode: {
|
|
4660
4660
|
primary: {
|
|
4661
|
-
[vars$
|
|
4661
|
+
[vars$p.textColor]: globalRefs$h.colors.primary.main,
|
|
4662
4662
|
},
|
|
4663
4663
|
secondary: {
|
|
4664
|
-
[vars$
|
|
4664
|
+
[vars$p.textColor]: globalRefs$h.colors.secondary.main,
|
|
4665
4665
|
},
|
|
4666
4666
|
error: {
|
|
4667
|
-
[vars$
|
|
4667
|
+
[vars$p.textColor]: globalRefs$h.colors.error.main,
|
|
4668
4668
|
},
|
|
4669
4669
|
success: {
|
|
4670
|
-
[vars$
|
|
4670
|
+
[vars$p.textColor]: globalRefs$h.colors.success.main,
|
|
4671
4671
|
},
|
|
4672
4672
|
},
|
|
4673
4673
|
};
|
|
@@ -4675,11 +4675,11 @@ const link = {
|
|
|
4675
4675
|
var link$1 = /*#__PURE__*/Object.freeze({
|
|
4676
4676
|
__proto__: null,
|
|
4677
4677
|
default: link,
|
|
4678
|
-
vars: vars$
|
|
4678
|
+
vars: vars$p
|
|
4679
4679
|
});
|
|
4680
4680
|
|
|
4681
|
-
const componentName$
|
|
4682
|
-
class RawDivider extends createBaseClass({ componentName: componentName$
|
|
4681
|
+
const componentName$x = getComponentName('divider');
|
|
4682
|
+
class RawDivider extends createBaseClass({ componentName: componentName$x, baseSelector: ':host > div' }) {
|
|
4683
4683
|
constructor() {
|
|
4684
4684
|
super();
|
|
4685
4685
|
|
|
@@ -4725,7 +4725,7 @@ class RawDivider extends createBaseClass({ componentName: componentName$w, baseS
|
|
|
4725
4725
|
}
|
|
4726
4726
|
|
|
4727
4727
|
const textVars$3 = TextClass.cssVarList;
|
|
4728
|
-
const { host: host$
|
|
4728
|
+
const { host: host$g, before, after: after$1, text } = {
|
|
4729
4729
|
host: { selector: () => ':host' },
|
|
4730
4730
|
before: { selector: '::before' },
|
|
4731
4731
|
after: { selector: '::after' },
|
|
@@ -4735,8 +4735,8 @@ const { host: host$f, before, after: after$1, text } = {
|
|
|
4735
4735
|
const DividerClass = compose(
|
|
4736
4736
|
createStyleMixin({
|
|
4737
4737
|
mappings: {
|
|
4738
|
-
hostWidth: { ...host$
|
|
4739
|
-
hostPadding: { ...host$
|
|
4738
|
+
hostWidth: { ...host$g, property: 'width' },
|
|
4739
|
+
hostPadding: { ...host$g, property: 'padding' },
|
|
4740
4740
|
hostDirection: { ...text, property: 'direction' },
|
|
4741
4741
|
|
|
4742
4742
|
minHeight: {},
|
|
@@ -4778,7 +4778,7 @@ const DividerClass = compose(
|
|
|
4778
4778
|
componentNameValidationMixin
|
|
4779
4779
|
)(RawDivider);
|
|
4780
4780
|
|
|
4781
|
-
const globalRefs$
|
|
4781
|
+
const globalRefs$g = getThemeRefs(globals);
|
|
4782
4782
|
const compVars$3 = DividerClass.cssVarList;
|
|
4783
4783
|
|
|
4784
4784
|
const [helperTheme$1, helperRefs$1, helperVars$1] = createHelperVars(
|
|
@@ -4786,18 +4786,18 @@ const [helperTheme$1, helperRefs$1, helperVars$1] = createHelperVars(
|
|
|
4786
4786
|
thickness: '2px',
|
|
4787
4787
|
spacing: '10px',
|
|
4788
4788
|
},
|
|
4789
|
-
componentName$
|
|
4789
|
+
componentName$x
|
|
4790
4790
|
);
|
|
4791
4791
|
|
|
4792
4792
|
const divider = {
|
|
4793
4793
|
...helperTheme$1,
|
|
4794
4794
|
|
|
4795
|
-
[compVars$3.hostDirection]: globalRefs$
|
|
4795
|
+
[compVars$3.hostDirection]: globalRefs$g.direction,
|
|
4796
4796
|
[compVars$3.alignItems]: 'center',
|
|
4797
4797
|
[compVars$3.flexDirection]: 'row',
|
|
4798
4798
|
[compVars$3.alignSelf]: 'stretch',
|
|
4799
4799
|
[compVars$3.hostWidth]: '100%',
|
|
4800
|
-
[compVars$3.stripeColor]: globalRefs$
|
|
4800
|
+
[compVars$3.stripeColor]: globalRefs$g.colors.surface.light,
|
|
4801
4801
|
[compVars$3.stripeColorOpacity]: '0.5',
|
|
4802
4802
|
[compVars$3.stripeHorizontalThickness]: helperRefs$1.thickness,
|
|
4803
4803
|
[compVars$3.labelTextWidth]: 'fit-content',
|
|
@@ -4817,7 +4817,7 @@ const divider = {
|
|
|
4817
4817
|
},
|
|
4818
4818
|
};
|
|
4819
4819
|
|
|
4820
|
-
const vars$
|
|
4820
|
+
const vars$o = {
|
|
4821
4821
|
...compVars$3,
|
|
4822
4822
|
...helperVars$1,
|
|
4823
4823
|
};
|
|
@@ -4825,18 +4825,18 @@ const vars$n = {
|
|
|
4825
4825
|
var divider$1 = /*#__PURE__*/Object.freeze({
|
|
4826
4826
|
__proto__: null,
|
|
4827
4827
|
default: divider,
|
|
4828
|
-
vars: vars$
|
|
4828
|
+
vars: vars$o
|
|
4829
4829
|
});
|
|
4830
4830
|
|
|
4831
4831
|
/* eslint-disable no-param-reassign */
|
|
4832
4832
|
|
|
4833
|
-
const componentName$
|
|
4833
|
+
const componentName$w = getComponentName('passcode-internal');
|
|
4834
4834
|
|
|
4835
|
-
createBaseInputClass({ componentName: componentName$
|
|
4835
|
+
createBaseInputClass({ componentName: componentName$w, baseSelector: 'div' });
|
|
4836
4836
|
|
|
4837
|
-
const componentName$
|
|
4837
|
+
const componentName$v = getComponentName('loader-radial');
|
|
4838
4838
|
|
|
4839
|
-
class RawLoaderRadial extends createBaseClass({ componentName: componentName$
|
|
4839
|
+
class RawLoaderRadial extends createBaseClass({ componentName: componentName$v, baseSelector: ':host > div' }) {
|
|
4840
4840
|
constructor() {
|
|
4841
4841
|
super();
|
|
4842
4842
|
|
|
@@ -4880,7 +4880,7 @@ const LoaderRadialClass = compose(
|
|
|
4880
4880
|
componentNameValidationMixin
|
|
4881
4881
|
)(RawLoaderRadial);
|
|
4882
4882
|
|
|
4883
|
-
const componentName$
|
|
4883
|
+
const componentName$u = getComponentName('passcode');
|
|
4884
4884
|
|
|
4885
4885
|
const observedAttributes$3 = ['digits'];
|
|
4886
4886
|
|
|
@@ -4899,17 +4899,17 @@ const customMixin$6 = (superclass) =>
|
|
|
4899
4899
|
const template = document.createElement('template');
|
|
4900
4900
|
|
|
4901
4901
|
template.innerHTML = `
|
|
4902
|
-
<${componentName$
|
|
4902
|
+
<${componentName$w}
|
|
4903
4903
|
bordered="true"
|
|
4904
4904
|
name="code"
|
|
4905
4905
|
tabindex="-1"
|
|
4906
4906
|
slot="input"
|
|
4907
|
-
><slot></slot></${componentName$
|
|
4907
|
+
><slot></slot></${componentName$w}>
|
|
4908
4908
|
`;
|
|
4909
4909
|
|
|
4910
4910
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
|
4911
4911
|
|
|
4912
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
|
4912
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$w);
|
|
4913
4913
|
|
|
4914
4914
|
forwardAttrs(this, this.inputElement, { includeAttrs: ['digits', 'size', 'loading'] });
|
|
4915
4915
|
}
|
|
@@ -4924,7 +4924,7 @@ const customMixin$6 = (superclass) =>
|
|
|
4924
4924
|
};
|
|
4925
4925
|
|
|
4926
4926
|
const {
|
|
4927
|
-
host: host$
|
|
4927
|
+
host: host$f,
|
|
4928
4928
|
digitField,
|
|
4929
4929
|
label: label$6,
|
|
4930
4930
|
requiredIndicator: requiredIndicator$6,
|
|
@@ -4947,10 +4947,10 @@ const loaderVars = LoaderRadialClass.cssVarList;
|
|
|
4947
4947
|
const PasscodeClass = compose(
|
|
4948
4948
|
createStyleMixin({
|
|
4949
4949
|
mappings: {
|
|
4950
|
-
fontSize: [{ ...digitField, property: textVars$2.fontSize }, host$
|
|
4950
|
+
fontSize: [{ ...digitField, property: textVars$2.fontSize }, host$f],
|
|
4951
4951
|
hostWidth: { property: 'width' },
|
|
4952
|
-
hostDirection: { ...host$
|
|
4953
|
-
fontFamily: [host$
|
|
4952
|
+
hostDirection: { ...host$f, property: 'direction' },
|
|
4953
|
+
fontFamily: [host$f, { ...label$6 }],
|
|
4954
4954
|
labelTextColor: [
|
|
4955
4955
|
{ ...label$6, property: 'color' },
|
|
4956
4956
|
{ ...requiredIndicator$6, property: 'color' },
|
|
@@ -5056,56 +5056,56 @@ const PasscodeClass = compose(
|
|
|
5056
5056
|
${resetInputCursor('vaadin-text-field')}
|
|
5057
5057
|
`,
|
|
5058
5058
|
excludeAttrsSync: ['tabindex'],
|
|
5059
|
-
componentName: componentName$
|
|
5059
|
+
componentName: componentName$u,
|
|
5060
5060
|
})
|
|
5061
5061
|
);
|
|
5062
5062
|
|
|
5063
|
-
const vars$
|
|
5063
|
+
const vars$n = PasscodeClass.cssVarList;
|
|
5064
5064
|
|
|
5065
5065
|
const passcode = {
|
|
5066
|
-
[vars$
|
|
5067
|
-
[vars$
|
|
5068
|
-
[vars$
|
|
5069
|
-
[vars$
|
|
5070
|
-
[vars$
|
|
5071
|
-
[vars$
|
|
5072
|
-
[vars$
|
|
5073
|
-
[vars$
|
|
5074
|
-
[vars$
|
|
5075
|
-
[vars$
|
|
5076
|
-
[vars$
|
|
5077
|
-
[vars$
|
|
5078
|
-
[vars$
|
|
5079
|
-
[vars$
|
|
5080
|
-
[vars$
|
|
5066
|
+
[vars$n.hostDirection]: refs.direction,
|
|
5067
|
+
[vars$n.fontFamily]: refs.fontFamily,
|
|
5068
|
+
[vars$n.fontSize]: refs.fontSize,
|
|
5069
|
+
[vars$n.labelTextColor]: refs.labelTextColor,
|
|
5070
|
+
[vars$n.labelRequiredIndicator]: refs.requiredIndicator,
|
|
5071
|
+
[vars$n.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
5072
|
+
[vars$n.digitValueTextColor]: refs.valueTextColor,
|
|
5073
|
+
[vars$n.digitPadding]: '0',
|
|
5074
|
+
[vars$n.digitTextAlign]: 'center',
|
|
5075
|
+
[vars$n.digitSpacing]: '4px',
|
|
5076
|
+
[vars$n.hostWidth]: refs.width,
|
|
5077
|
+
[vars$n.digitOutlineColor]: 'transparent',
|
|
5078
|
+
[vars$n.digitOutlineWidth]: refs.outlineWidth,
|
|
5079
|
+
[vars$n.focusedDigitFieldOutlineColor]: refs.outlineColor,
|
|
5080
|
+
[vars$n.digitSize]: refs.inputHeight,
|
|
5081
5081
|
|
|
5082
5082
|
size: {
|
|
5083
|
-
xs: { [vars$
|
|
5084
|
-
sm: { [vars$
|
|
5085
|
-
md: { [vars$
|
|
5086
|
-
lg: { [vars$
|
|
5083
|
+
xs: { [vars$n.spinnerSize]: '15px' },
|
|
5084
|
+
sm: { [vars$n.spinnerSize]: '20px' },
|
|
5085
|
+
md: { [vars$n.spinnerSize]: '20px' },
|
|
5086
|
+
lg: { [vars$n.spinnerSize]: '20px' },
|
|
5087
5087
|
},
|
|
5088
5088
|
|
|
5089
5089
|
_hideCursor: {
|
|
5090
|
-
[vars$
|
|
5090
|
+
[vars$n.digitCaretTextColor]: 'transparent',
|
|
5091
5091
|
},
|
|
5092
5092
|
|
|
5093
5093
|
_loading: {
|
|
5094
|
-
[vars$
|
|
5094
|
+
[vars$n.overlayOpacity]: refs.overlayOpacity,
|
|
5095
5095
|
},
|
|
5096
5096
|
};
|
|
5097
5097
|
|
|
5098
5098
|
var passcode$1 = /*#__PURE__*/Object.freeze({
|
|
5099
5099
|
__proto__: null,
|
|
5100
5100
|
default: passcode,
|
|
5101
|
-
vars: vars$
|
|
5101
|
+
vars: vars$n
|
|
5102
5102
|
});
|
|
5103
5103
|
|
|
5104
|
-
const componentName$
|
|
5104
|
+
const componentName$t = getComponentName('loader-linear');
|
|
5105
5105
|
|
|
5106
|
-
class RawLoaderLinear extends createBaseClass({ componentName: componentName$
|
|
5106
|
+
class RawLoaderLinear extends createBaseClass({ componentName: componentName$t, baseSelector: ':host > div' }) {
|
|
5107
5107
|
static get componentName() {
|
|
5108
|
-
return componentName$
|
|
5108
|
+
return componentName$t;
|
|
5109
5109
|
}
|
|
5110
5110
|
|
|
5111
5111
|
constructor() {
|
|
@@ -5141,18 +5141,18 @@ const selectors$1 = {
|
|
|
5141
5141
|
host: { selector: () => ':host' },
|
|
5142
5142
|
};
|
|
5143
5143
|
|
|
5144
|
-
const { after, host: host$
|
|
5144
|
+
const { after, host: host$e } = selectors$1;
|
|
5145
5145
|
|
|
5146
5146
|
const LoaderLinearClass = compose(
|
|
5147
5147
|
createStyleMixin({
|
|
5148
5148
|
mappings: {
|
|
5149
5149
|
hostDisplay: {},
|
|
5150
|
-
hostWidth: { ...host$
|
|
5150
|
+
hostWidth: { ...host$e, property: 'width' },
|
|
5151
5151
|
barHeight: [{ property: 'height' }, { ...after, property: 'height' }],
|
|
5152
5152
|
barBorderRadius: [{ property: 'border-radius' }, { ...after, property: 'border-radius' }],
|
|
5153
5153
|
verticalPadding: [
|
|
5154
|
-
{ ...host$
|
|
5155
|
-
{ ...host$
|
|
5154
|
+
{ ...host$e, property: 'padding-top' },
|
|
5155
|
+
{ ...host$e, property: 'padding-bottom' },
|
|
5156
5156
|
],
|
|
5157
5157
|
barBackgroundColor: { property: 'background-color' },
|
|
5158
5158
|
barColor: { ...after, property: 'background-color' },
|
|
@@ -5166,67 +5166,67 @@ const LoaderLinearClass = compose(
|
|
|
5166
5166
|
componentNameValidationMixin
|
|
5167
5167
|
)(RawLoaderLinear);
|
|
5168
5168
|
|
|
5169
|
-
const globalRefs$
|
|
5170
|
-
const vars$
|
|
5169
|
+
const globalRefs$f = getThemeRefs(globals);
|
|
5170
|
+
const vars$m = LoaderLinearClass.cssVarList;
|
|
5171
5171
|
|
|
5172
5172
|
const loaderLinear = {
|
|
5173
|
-
[vars$
|
|
5174
|
-
[vars$
|
|
5173
|
+
[vars$m.hostDisplay]: 'inline-block',
|
|
5174
|
+
[vars$m.hostWidth]: '100%',
|
|
5175
5175
|
|
|
5176
|
-
[vars$
|
|
5177
|
-
[vars$
|
|
5176
|
+
[vars$m.barColor]: globalRefs$f.colors.surface.contrast,
|
|
5177
|
+
[vars$m.barWidth]: '20%',
|
|
5178
5178
|
|
|
5179
|
-
[vars$
|
|
5180
|
-
[vars$
|
|
5179
|
+
[vars$m.barBackgroundColor]: globalRefs$f.colors.surface.light,
|
|
5180
|
+
[vars$m.barBorderRadius]: '4px',
|
|
5181
5181
|
|
|
5182
|
-
[vars$
|
|
5183
|
-
[vars$
|
|
5184
|
-
[vars$
|
|
5185
|
-
[vars$
|
|
5182
|
+
[vars$m.animationDuration]: '2s',
|
|
5183
|
+
[vars$m.animationTimingFunction]: 'linear',
|
|
5184
|
+
[vars$m.animationIterationCount]: 'infinite',
|
|
5185
|
+
[vars$m.verticalPadding]: '0.25em',
|
|
5186
5186
|
|
|
5187
5187
|
size: {
|
|
5188
|
-
xs: { [vars$
|
|
5189
|
-
sm: { [vars$
|
|
5190
|
-
md: { [vars$
|
|
5191
|
-
lg: { [vars$
|
|
5188
|
+
xs: { [vars$m.barHeight]: '2px' },
|
|
5189
|
+
sm: { [vars$m.barHeight]: '4px' },
|
|
5190
|
+
md: { [vars$m.barHeight]: '6px' },
|
|
5191
|
+
lg: { [vars$m.barHeight]: '8px' },
|
|
5192
5192
|
},
|
|
5193
5193
|
|
|
5194
5194
|
mode: {
|
|
5195
5195
|
primary: {
|
|
5196
|
-
[vars$
|
|
5196
|
+
[vars$m.barColor]: globalRefs$f.colors.primary.main,
|
|
5197
5197
|
},
|
|
5198
5198
|
secondary: {
|
|
5199
|
-
[vars$
|
|
5199
|
+
[vars$m.barColor]: globalRefs$f.colors.secondary.main,
|
|
5200
5200
|
},
|
|
5201
5201
|
},
|
|
5202
5202
|
|
|
5203
5203
|
_hidden: {
|
|
5204
|
-
[vars$
|
|
5204
|
+
[vars$m.hostDisplay]: 'none',
|
|
5205
5205
|
},
|
|
5206
5206
|
};
|
|
5207
5207
|
|
|
5208
5208
|
var loaderLinear$1 = /*#__PURE__*/Object.freeze({
|
|
5209
5209
|
__proto__: null,
|
|
5210
5210
|
default: loaderLinear,
|
|
5211
|
-
vars: vars$
|
|
5211
|
+
vars: vars$m
|
|
5212
5212
|
});
|
|
5213
5213
|
|
|
5214
|
-
const globalRefs$
|
|
5214
|
+
const globalRefs$e = getThemeRefs(globals);
|
|
5215
5215
|
const compVars$2 = LoaderRadialClass.cssVarList;
|
|
5216
5216
|
|
|
5217
5217
|
const [helperTheme, helperRefs, helperVars] = createHelperVars(
|
|
5218
5218
|
{
|
|
5219
|
-
spinnerColor: globalRefs$
|
|
5219
|
+
spinnerColor: globalRefs$e.colors.surface.contrast,
|
|
5220
5220
|
mode: {
|
|
5221
5221
|
primary: {
|
|
5222
|
-
spinnerColor: globalRefs$
|
|
5222
|
+
spinnerColor: globalRefs$e.colors.primary.main,
|
|
5223
5223
|
},
|
|
5224
5224
|
secondary: {
|
|
5225
|
-
spinnerColor: globalRefs$
|
|
5225
|
+
spinnerColor: globalRefs$e.colors.secondary.main,
|
|
5226
5226
|
},
|
|
5227
5227
|
},
|
|
5228
5228
|
},
|
|
5229
|
-
componentName$
|
|
5229
|
+
componentName$v
|
|
5230
5230
|
);
|
|
5231
5231
|
|
|
5232
5232
|
const loaderRadial = {
|
|
@@ -5255,7 +5255,7 @@ const loaderRadial = {
|
|
|
5255
5255
|
[compVars$2.hostDisplay]: 'none',
|
|
5256
5256
|
},
|
|
5257
5257
|
};
|
|
5258
|
-
const vars$
|
|
5258
|
+
const vars$l = {
|
|
5259
5259
|
...compVars$2,
|
|
5260
5260
|
...helperVars,
|
|
5261
5261
|
};
|
|
@@ -5263,10 +5263,10 @@ const vars$k = {
|
|
|
5263
5263
|
var loaderRadial$1 = /*#__PURE__*/Object.freeze({
|
|
5264
5264
|
__proto__: null,
|
|
5265
5265
|
default: loaderRadial,
|
|
5266
|
-
vars: vars$
|
|
5266
|
+
vars: vars$l
|
|
5267
5267
|
});
|
|
5268
5268
|
|
|
5269
|
-
const componentName$
|
|
5269
|
+
const componentName$s = getComponentName('combo-box');
|
|
5270
5270
|
|
|
5271
5271
|
const ComboBoxMixin = (superclass) =>
|
|
5272
5272
|
class ComboBoxMixinClass extends superclass {
|
|
@@ -5492,7 +5492,7 @@ const ComboBoxMixin = (superclass) =>
|
|
|
5492
5492
|
};
|
|
5493
5493
|
|
|
5494
5494
|
const {
|
|
5495
|
-
host: host$
|
|
5495
|
+
host: host$d,
|
|
5496
5496
|
inputField: inputField$3,
|
|
5497
5497
|
inputElement: inputElement$1,
|
|
5498
5498
|
placeholder: placeholder$1,
|
|
@@ -5518,10 +5518,10 @@ const {
|
|
|
5518
5518
|
const ComboBoxClass = compose(
|
|
5519
5519
|
createStyleMixin({
|
|
5520
5520
|
mappings: {
|
|
5521
|
-
hostWidth: { ...host$
|
|
5522
|
-
hostDirection: { ...host$
|
|
5521
|
+
hostWidth: { ...host$d, property: 'width' },
|
|
5522
|
+
hostDirection: { ...host$d, property: 'direction' },
|
|
5523
5523
|
// we apply font-size also on the host so we can set its width with em
|
|
5524
|
-
fontSize: [{}, host$
|
|
5524
|
+
fontSize: [{}, host$d],
|
|
5525
5525
|
fontFamily: [label$5, placeholder$1, inputField$3, helperText$5, errorMessage$6],
|
|
5526
5526
|
labelTextColor: [
|
|
5527
5527
|
{ ...label$5, property: 'color' },
|
|
@@ -5649,71 +5649,71 @@ const ComboBoxClass = compose(
|
|
|
5649
5649
|
// and reset items to an empty array, and opening the list box with no items
|
|
5650
5650
|
// to display.
|
|
5651
5651
|
excludeAttrsSync: ['tabindex', 'size', 'data'],
|
|
5652
|
-
componentName: componentName$
|
|
5652
|
+
componentName: componentName$s,
|
|
5653
5653
|
includeForwardProps: ['items', 'renderer', 'selectedItem'],
|
|
5654
5654
|
})
|
|
5655
5655
|
);
|
|
5656
5656
|
|
|
5657
|
-
const globalRefs$
|
|
5658
|
-
const vars$
|
|
5657
|
+
const globalRefs$d = getThemeRefs(globals);
|
|
5658
|
+
const vars$k = ComboBoxClass.cssVarList;
|
|
5659
5659
|
|
|
5660
5660
|
const comboBox = {
|
|
5661
|
-
[vars$
|
|
5662
|
-
[vars$
|
|
5663
|
-
[vars$
|
|
5664
|
-
[vars$
|
|
5665
|
-
[vars$
|
|
5666
|
-
[vars$
|
|
5667
|
-
[vars$
|
|
5668
|
-
[vars$
|
|
5669
|
-
[vars$
|
|
5670
|
-
[vars$
|
|
5671
|
-
[vars$
|
|
5672
|
-
[vars$
|
|
5673
|
-
[vars$
|
|
5674
|
-
[vars$
|
|
5675
|
-
[vars$
|
|
5676
|
-
[vars$
|
|
5677
|
-
[vars$
|
|
5678
|
-
[vars$
|
|
5679
|
-
[vars$
|
|
5680
|
-
[vars$
|
|
5681
|
-
[vars$
|
|
5682
|
-
[vars$
|
|
5683
|
-
[vars$
|
|
5684
|
-
[vars$
|
|
5685
|
-
[vars$
|
|
5686
|
-
[vars$
|
|
5661
|
+
[vars$k.hostWidth]: refs.width,
|
|
5662
|
+
[vars$k.hostDirection]: refs.direction,
|
|
5663
|
+
[vars$k.fontSize]: refs.fontSize,
|
|
5664
|
+
[vars$k.fontFamily]: refs.fontFamily,
|
|
5665
|
+
[vars$k.labelTextColor]: refs.labelTextColor,
|
|
5666
|
+
[vars$k.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
5667
|
+
[vars$k.inputBorderColor]: refs.borderColor,
|
|
5668
|
+
[vars$k.inputBorderWidth]: refs.borderWidth,
|
|
5669
|
+
[vars$k.inputBorderStyle]: refs.borderStyle,
|
|
5670
|
+
[vars$k.inputBorderRadius]: refs.borderRadius,
|
|
5671
|
+
[vars$k.inputOutlineColor]: refs.outlineColor,
|
|
5672
|
+
[vars$k.inputOutlineOffset]: refs.outlineOffset,
|
|
5673
|
+
[vars$k.inputOutlineWidth]: refs.outlineWidth,
|
|
5674
|
+
[vars$k.inputOutlineStyle]: refs.outlineStyle,
|
|
5675
|
+
[vars$k.labelRequiredIndicator]: refs.requiredIndicator,
|
|
5676
|
+
[vars$k.inputValueTextColor]: refs.valueTextColor,
|
|
5677
|
+
[vars$k.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
|
5678
|
+
[vars$k.inputBackgroundColor]: refs.backgroundColor,
|
|
5679
|
+
[vars$k.inputHorizontalPadding]: refs.horizontalPadding,
|
|
5680
|
+
[vars$k.inputHeight]: refs.inputHeight,
|
|
5681
|
+
[vars$k.inputDropdownButtonColor]: globalRefs$d.colors.surface.dark,
|
|
5682
|
+
[vars$k.inputDropdownButtonCursor]: 'pointer',
|
|
5683
|
+
[vars$k.inputDropdownButtonSize]: refs.toggleButtonSize,
|
|
5684
|
+
[vars$k.inputDropdownButtonOffset]: globalRefs$d.spacing.xs,
|
|
5685
|
+
[vars$k.overlayItemPaddingInlineStart]: globalRefs$d.spacing.xs,
|
|
5686
|
+
[vars$k.overlayItemPaddingInlineEnd]: globalRefs$d.spacing.lg,
|
|
5687
5687
|
|
|
5688
5688
|
_readonly: {
|
|
5689
|
-
[vars$
|
|
5689
|
+
[vars$k.inputDropdownButtonCursor]: 'default',
|
|
5690
5690
|
},
|
|
5691
5691
|
|
|
5692
5692
|
// Overlay theme exposed via the component:
|
|
5693
|
-
[vars$
|
|
5694
|
-
[vars$
|
|
5695
|
-
[vars$
|
|
5696
|
-
[vars$
|
|
5697
|
-
[vars$
|
|
5698
|
-
[vars$
|
|
5693
|
+
[vars$k.overlayFontSize]: refs.fontSize,
|
|
5694
|
+
[vars$k.overlayFontFamily]: refs.fontFamily,
|
|
5695
|
+
[vars$k.overlayCursor]: 'pointer',
|
|
5696
|
+
[vars$k.overlayItemBoxShadow]: 'none',
|
|
5697
|
+
[vars$k.overlayBackground]: refs.backgroundColor,
|
|
5698
|
+
[vars$k.overlayTextColor]: refs.valueTextColor,
|
|
5699
5699
|
|
|
5700
5700
|
// Overlay direct theme:
|
|
5701
|
-
[vars$
|
|
5702
|
-
[vars$
|
|
5701
|
+
[vars$k.overlay.minHeight]: '400px',
|
|
5702
|
+
[vars$k.overlay.margin]: '0',
|
|
5703
5703
|
};
|
|
5704
5704
|
|
|
5705
5705
|
var comboBox$1 = /*#__PURE__*/Object.freeze({
|
|
5706
5706
|
__proto__: null,
|
|
5707
5707
|
comboBox: comboBox,
|
|
5708
5708
|
default: comboBox,
|
|
5709
|
-
vars: vars$
|
|
5709
|
+
vars: vars$k
|
|
5710
5710
|
});
|
|
5711
5711
|
|
|
5712
5712
|
const observedAttributes$2 = ['src', 'alt'];
|
|
5713
5713
|
|
|
5714
|
-
const componentName$
|
|
5714
|
+
const componentName$r = getComponentName('image');
|
|
5715
5715
|
|
|
5716
|
-
const BaseClass$1 = createBaseClass({ componentName: componentName$
|
|
5716
|
+
const BaseClass$1 = createBaseClass({ componentName: componentName$r, baseSelector: ':host > img' });
|
|
5717
5717
|
class RawImage extends BaseClass$1 {
|
|
5718
5718
|
static get observedAttributes() {
|
|
5719
5719
|
return observedAttributes$2.concat(BaseClass$1.observedAttributes || []);
|
|
@@ -5753,14 +5753,14 @@ const ImageClass = compose(
|
|
|
5753
5753
|
draggableMixin
|
|
5754
5754
|
)(RawImage);
|
|
5755
5755
|
|
|
5756
|
-
const vars$
|
|
5756
|
+
const vars$j = ImageClass.cssVarList;
|
|
5757
5757
|
|
|
5758
5758
|
const image = {};
|
|
5759
5759
|
|
|
5760
5760
|
var image$1 = /*#__PURE__*/Object.freeze({
|
|
5761
5761
|
__proto__: null,
|
|
5762
5762
|
default: image,
|
|
5763
|
-
vars: vars$
|
|
5763
|
+
vars: vars$j
|
|
5764
5764
|
});
|
|
5765
5765
|
|
|
5766
5766
|
var CountryCodes = [
|
|
@@ -6979,14 +6979,14 @@ var CountryCodes = [
|
|
|
6979
6979
|
].sort((a, b) => (a.name < b.name ? -1 : 1)),
|
|
6980
6980
|
];
|
|
6981
6981
|
|
|
6982
|
-
const componentName$
|
|
6982
|
+
const componentName$q = getComponentName('phone-field-internal');
|
|
6983
6983
|
|
|
6984
|
-
createBaseInputClass({ componentName: componentName$
|
|
6984
|
+
createBaseInputClass({ componentName: componentName$q, baseSelector: 'div' });
|
|
6985
6985
|
|
|
6986
6986
|
const textVars$1 = TextFieldClass.cssVarList;
|
|
6987
6987
|
const comboVars = ComboBoxClass.cssVarList;
|
|
6988
6988
|
|
|
6989
|
-
const componentName$
|
|
6989
|
+
const componentName$p = getComponentName('phone-field');
|
|
6990
6990
|
|
|
6991
6991
|
const customMixin$5 = (superclass) =>
|
|
6992
6992
|
class PhoneFieldMixinClass extends superclass {
|
|
@@ -7000,15 +7000,15 @@ const customMixin$5 = (superclass) =>
|
|
|
7000
7000
|
const template = document.createElement('template');
|
|
7001
7001
|
|
|
7002
7002
|
template.innerHTML = `
|
|
7003
|
-
<${componentName$
|
|
7003
|
+
<${componentName$q}
|
|
7004
7004
|
tabindex="-1"
|
|
7005
7005
|
slot="input"
|
|
7006
|
-
></${componentName$
|
|
7006
|
+
></${componentName$q}>
|
|
7007
7007
|
`;
|
|
7008
7008
|
|
|
7009
7009
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
|
7010
7010
|
|
|
7011
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
|
7011
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$q);
|
|
7012
7012
|
|
|
7013
7013
|
forwardAttrs(this.shadowRoot.host, this.inputElement, {
|
|
7014
7014
|
includeAttrs: [
|
|
@@ -7028,7 +7028,7 @@ const customMixin$5 = (superclass) =>
|
|
|
7028
7028
|
};
|
|
7029
7029
|
|
|
7030
7030
|
const {
|
|
7031
|
-
host: host$
|
|
7031
|
+
host: host$c,
|
|
7032
7032
|
label: label$4,
|
|
7033
7033
|
requiredIndicator: requiredIndicator$4,
|
|
7034
7034
|
inputField: inputField$2,
|
|
@@ -7053,7 +7053,7 @@ const PhoneFieldClass = compose(
|
|
|
7053
7053
|
createStyleMixin({
|
|
7054
7054
|
mappings: {
|
|
7055
7055
|
fontSize: [
|
|
7056
|
-
host$
|
|
7056
|
+
host$c,
|
|
7057
7057
|
inputField$2,
|
|
7058
7058
|
{
|
|
7059
7059
|
selector: TextFieldClass.componentName,
|
|
@@ -7074,11 +7074,11 @@ const PhoneFieldClass = compose(
|
|
|
7074
7074
|
},
|
|
7075
7075
|
],
|
|
7076
7076
|
hostWidth: [
|
|
7077
|
-
{ ...host$
|
|
7077
|
+
{ ...host$c, property: 'width' },
|
|
7078
7078
|
{ ...phoneInput$1, property: 'width' },
|
|
7079
7079
|
{ ...countryCodeInput, property: '--vaadin-combo-box-overlay-width' },
|
|
7080
7080
|
],
|
|
7081
|
-
hostDirection: { ...host$
|
|
7081
|
+
hostDirection: { ...host$c, property: 'direction' },
|
|
7082
7082
|
|
|
7083
7083
|
inputBorderStyle: [
|
|
7084
7084
|
{ ...inputField$2, property: 'border-style' },
|
|
@@ -7204,33 +7204,33 @@ const PhoneFieldClass = compose(
|
|
|
7204
7204
|
${resetInputLabelPosition('vaadin-text-field')}
|
|
7205
7205
|
`,
|
|
7206
7206
|
excludeAttrsSync: ['tabindex'],
|
|
7207
|
-
componentName: componentName$
|
|
7207
|
+
componentName: componentName$p,
|
|
7208
7208
|
})
|
|
7209
7209
|
);
|
|
7210
7210
|
|
|
7211
|
-
const vars$
|
|
7211
|
+
const vars$i = PhoneFieldClass.cssVarList;
|
|
7212
7212
|
|
|
7213
7213
|
const phoneField = {
|
|
7214
|
-
[vars$
|
|
7215
|
-
[vars$
|
|
7216
|
-
[vars$
|
|
7217
|
-
[vars$
|
|
7218
|
-
[vars$
|
|
7219
|
-
[vars$
|
|
7220
|
-
[vars$
|
|
7221
|
-
[vars$
|
|
7222
|
-
[vars$
|
|
7223
|
-
[vars$
|
|
7224
|
-
[vars$
|
|
7225
|
-
[vars$
|
|
7226
|
-
[vars$
|
|
7227
|
-
[vars$
|
|
7228
|
-
[vars$
|
|
7229
|
-
[vars$
|
|
7230
|
-
[vars$
|
|
7231
|
-
[vars$
|
|
7232
|
-
[vars$
|
|
7233
|
-
[vars$
|
|
7214
|
+
[vars$i.hostWidth]: refs.width,
|
|
7215
|
+
[vars$i.hostDirection]: refs.direction,
|
|
7216
|
+
[vars$i.fontSize]: refs.fontSize,
|
|
7217
|
+
[vars$i.fontFamily]: refs.fontFamily,
|
|
7218
|
+
[vars$i.labelTextColor]: refs.labelTextColor,
|
|
7219
|
+
[vars$i.labelRequiredIndicator]: refs.requiredIndicator,
|
|
7220
|
+
[vars$i.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
7221
|
+
[vars$i.inputValueTextColor]: refs.valueTextColor,
|
|
7222
|
+
[vars$i.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
|
7223
|
+
[vars$i.inputBorderStyle]: refs.borderStyle,
|
|
7224
|
+
[vars$i.inputBorderWidth]: refs.borderWidth,
|
|
7225
|
+
[vars$i.inputBorderColor]: refs.borderColor,
|
|
7226
|
+
[vars$i.inputBorderRadius]: refs.borderRadius,
|
|
7227
|
+
[vars$i.inputOutlineStyle]: refs.outlineStyle,
|
|
7228
|
+
[vars$i.inputOutlineWidth]: refs.outlineWidth,
|
|
7229
|
+
[vars$i.inputOutlineColor]: refs.outlineColor,
|
|
7230
|
+
[vars$i.inputOutlineOffset]: refs.outlineOffset,
|
|
7231
|
+
[vars$i.phoneInputWidth]: refs.minWidth,
|
|
7232
|
+
[vars$i.countryCodeInputWidth]: '5em',
|
|
7233
|
+
[vars$i.countryCodeDropdownWidth]: '20em',
|
|
7234
7234
|
|
|
7235
7235
|
// '@overlay': {
|
|
7236
7236
|
// overlayItemBackgroundColor: 'red'
|
|
@@ -7240,16 +7240,16 @@ const phoneField = {
|
|
|
7240
7240
|
var phoneField$1 = /*#__PURE__*/Object.freeze({
|
|
7241
7241
|
__proto__: null,
|
|
7242
7242
|
default: phoneField,
|
|
7243
|
-
vars: vars$
|
|
7243
|
+
vars: vars$i
|
|
7244
7244
|
});
|
|
7245
7245
|
|
|
7246
|
-
const componentName$
|
|
7246
|
+
const componentName$o = getComponentName('phone-field-internal-input-box');
|
|
7247
7247
|
|
|
7248
|
-
createBaseInputClass({ componentName: componentName$
|
|
7248
|
+
createBaseInputClass({ componentName: componentName$o, baseSelector: 'div' });
|
|
7249
7249
|
|
|
7250
7250
|
const textVars = TextFieldClass.cssVarList;
|
|
7251
7251
|
|
|
7252
|
-
const componentName$
|
|
7252
|
+
const componentName$n = getComponentName('phone-input-box-field');
|
|
7253
7253
|
|
|
7254
7254
|
const customMixin$4 = (superclass) =>
|
|
7255
7255
|
class PhoneInputBoxFieldMixinClass extends superclass {
|
|
@@ -7263,15 +7263,15 @@ const customMixin$4 = (superclass) =>
|
|
|
7263
7263
|
const template = document.createElement('template');
|
|
7264
7264
|
|
|
7265
7265
|
template.innerHTML = `
|
|
7266
|
-
<${componentName$
|
|
7266
|
+
<${componentName$o}
|
|
7267
7267
|
tabindex="-1"
|
|
7268
7268
|
slot="input"
|
|
7269
|
-
></${componentName$
|
|
7269
|
+
></${componentName$o}>
|
|
7270
7270
|
`;
|
|
7271
7271
|
|
|
7272
7272
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
|
7273
7273
|
|
|
7274
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
|
7274
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$o);
|
|
7275
7275
|
|
|
7276
7276
|
forwardAttrs(this.shadowRoot.host, this.inputElement, {
|
|
7277
7277
|
includeAttrs: [
|
|
@@ -7288,7 +7288,7 @@ const customMixin$4 = (superclass) =>
|
|
|
7288
7288
|
}
|
|
7289
7289
|
};
|
|
7290
7290
|
|
|
7291
|
-
const { host: host$
|
|
7291
|
+
const { host: host$b, label: label$3, requiredIndicator: requiredIndicator$3, inputField: inputField$1, phoneInput, errorMessage: errorMessage$4, helperText: helperText$3 } = {
|
|
7292
7292
|
host: { selector: () => ':host' },
|
|
7293
7293
|
label: { selector: '::part(label)' },
|
|
7294
7294
|
requiredIndicator: { selector: '[required]::part(required-indicator)::after' },
|
|
@@ -7302,7 +7302,7 @@ const PhoneFieldInputBoxClass = compose(
|
|
|
7302
7302
|
createStyleMixin({
|
|
7303
7303
|
mappings: {
|
|
7304
7304
|
fontSize: [
|
|
7305
|
-
host$
|
|
7305
|
+
host$b,
|
|
7306
7306
|
inputField$1,
|
|
7307
7307
|
{
|
|
7308
7308
|
selector: TextFieldClass.componentName,
|
|
@@ -7310,9 +7310,9 @@ const PhoneFieldInputBoxClass = compose(
|
|
|
7310
7310
|
},
|
|
7311
7311
|
],
|
|
7312
7312
|
fontFamily: [label$3, errorMessage$4, helperText$3],
|
|
7313
|
-
hostWidth: { ...host$
|
|
7314
|
-
hostMinWidth: { ...host$
|
|
7315
|
-
hostDirection: { ...host$
|
|
7313
|
+
hostWidth: { ...host$b, property: 'width' },
|
|
7314
|
+
hostMinWidth: { ...host$b, property: 'min-width' },
|
|
7315
|
+
hostDirection: { ...host$b, property: 'direction' },
|
|
7316
7316
|
|
|
7317
7317
|
inputBorderStyle: { ...inputField$1, property: 'border-style' },
|
|
7318
7318
|
inputBorderWidth: { ...inputField$1, property: 'border-width' },
|
|
@@ -7404,56 +7404,56 @@ const PhoneFieldInputBoxClass = compose(
|
|
|
7404
7404
|
${resetInputLabelPosition('vaadin-text-field')}
|
|
7405
7405
|
`,
|
|
7406
7406
|
excludeAttrsSync: ['tabindex'],
|
|
7407
|
-
componentName: componentName$
|
|
7407
|
+
componentName: componentName$n,
|
|
7408
7408
|
})
|
|
7409
7409
|
);
|
|
7410
7410
|
|
|
7411
|
-
const vars$
|
|
7411
|
+
const vars$h = PhoneFieldInputBoxClass.cssVarList;
|
|
7412
7412
|
|
|
7413
7413
|
const phoneInputBoxField = {
|
|
7414
|
-
[vars$
|
|
7415
|
-
[vars$
|
|
7416
|
-
[vars$
|
|
7417
|
-
[vars$
|
|
7418
|
-
[vars$
|
|
7419
|
-
[vars$
|
|
7420
|
-
[vars$
|
|
7421
|
-
[vars$
|
|
7422
|
-
[vars$
|
|
7423
|
-
[vars$
|
|
7424
|
-
[vars$
|
|
7425
|
-
[vars$
|
|
7426
|
-
[vars$
|
|
7427
|
-
[vars$
|
|
7428
|
-
[vars$
|
|
7429
|
-
[vars$
|
|
7430
|
-
[vars$
|
|
7431
|
-
[vars$
|
|
7414
|
+
[vars$h.hostWidth]: '16em',
|
|
7415
|
+
[vars$h.hostMinWidth]: refs.minWidth,
|
|
7416
|
+
[vars$h.hostDirection]: refs.direction,
|
|
7417
|
+
[vars$h.fontSize]: refs.fontSize,
|
|
7418
|
+
[vars$h.fontFamily]: refs.fontFamily,
|
|
7419
|
+
[vars$h.labelTextColor]: refs.labelTextColor,
|
|
7420
|
+
[vars$h.labelRequiredIndicator]: refs.requiredIndicator,
|
|
7421
|
+
[vars$h.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
7422
|
+
[vars$h.inputValueTextColor]: refs.valueTextColor,
|
|
7423
|
+
[vars$h.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
|
7424
|
+
[vars$h.inputBorderStyle]: refs.borderStyle,
|
|
7425
|
+
[vars$h.inputBorderWidth]: refs.borderWidth,
|
|
7426
|
+
[vars$h.inputBorderColor]: refs.borderColor,
|
|
7427
|
+
[vars$h.inputBorderRadius]: refs.borderRadius,
|
|
7428
|
+
[vars$h.inputOutlineStyle]: refs.outlineStyle,
|
|
7429
|
+
[vars$h.inputOutlineWidth]: refs.outlineWidth,
|
|
7430
|
+
[vars$h.inputOutlineColor]: refs.outlineColor,
|
|
7431
|
+
[vars$h.inputOutlineOffset]: refs.outlineOffset,
|
|
7432
7432
|
_fullWidth: {
|
|
7433
|
-
[vars$
|
|
7433
|
+
[vars$h.hostWidth]: refs.width,
|
|
7434
7434
|
},
|
|
7435
7435
|
};
|
|
7436
7436
|
|
|
7437
7437
|
var phoneInputBoxField$1 = /*#__PURE__*/Object.freeze({
|
|
7438
7438
|
__proto__: null,
|
|
7439
7439
|
default: phoneInputBoxField,
|
|
7440
|
-
vars: vars$
|
|
7440
|
+
vars: vars$h
|
|
7441
7441
|
});
|
|
7442
7442
|
|
|
7443
|
-
const componentName$
|
|
7443
|
+
const componentName$m = getComponentName('new-password-internal');
|
|
7444
7444
|
|
|
7445
7445
|
const interpolateString = (template, values) =>
|
|
7446
7446
|
template.replace(/{{(\w+)+}}/g, (match, key) => values?.[key] || match);
|
|
7447
7447
|
|
|
7448
7448
|
// eslint-disable-next-line max-classes-per-file
|
|
7449
7449
|
|
|
7450
|
-
const componentName$
|
|
7450
|
+
const componentName$l = getComponentName('policy-validation');
|
|
7451
7451
|
|
|
7452
7452
|
const overrideAttrs = ['data-password-policy-value-minlength'];
|
|
7453
7453
|
const dataAttrs = ['data', 'active-policies', 'overrides', ...overrideAttrs];
|
|
7454
7454
|
const policyAttrs = ['label', 'value', ...dataAttrs];
|
|
7455
7455
|
|
|
7456
|
-
class RawPolicyValidation extends createBaseClass({ componentName: componentName$
|
|
7456
|
+
class RawPolicyValidation extends createBaseClass({ componentName: componentName$l, baseSelector: ':host > div' }) {
|
|
7457
7457
|
#availablePolicies;
|
|
7458
7458
|
|
|
7459
7459
|
#activePolicies = [];
|
|
@@ -7626,7 +7626,7 @@ class RawPolicyValidation extends createBaseClass({ componentName: componentName
|
|
|
7626
7626
|
}
|
|
7627
7627
|
}
|
|
7628
7628
|
|
|
7629
|
-
const { host: host$
|
|
7629
|
+
const { host: host$a, item, symbolDefault, symbolSuccess, symbolError } = {
|
|
7630
7630
|
host: { selector: () => ':host > div' },
|
|
7631
7631
|
item: { selector: () => '.item' },
|
|
7632
7632
|
symbolDefault: { selector: () => '.item[data-valid="none"]::before' },
|
|
@@ -7642,13 +7642,13 @@ const PolicyValidationClass = compose(
|
|
|
7642
7642
|
fontSize: {},
|
|
7643
7643
|
fontFamily: {},
|
|
7644
7644
|
padding: {},
|
|
7645
|
-
borderWidth: { ...host$
|
|
7646
|
-
borderStyle: { ...host$
|
|
7647
|
-
borderColor: { ...host$
|
|
7648
|
-
borderRadius: { ...host$
|
|
7649
|
-
backgroundColor: { ...host$
|
|
7645
|
+
borderWidth: { ...host$a, property: 'border-width' },
|
|
7646
|
+
borderStyle: { ...host$a, property: 'border-style' },
|
|
7647
|
+
borderColor: { ...host$a, property: 'border-color' },
|
|
7648
|
+
borderRadius: { ...host$a, property: 'border-radius' },
|
|
7649
|
+
backgroundColor: { ...host$a, property: 'background-color' },
|
|
7650
7650
|
textColor: { property: 'color' },
|
|
7651
|
-
labelMargin: { ...host$
|
|
7651
|
+
labelMargin: { ...host$a, property: 'gap' },
|
|
7652
7652
|
itemsSpacing: { ...item, property: 'line-height' },
|
|
7653
7653
|
itemSymbolSuccessColor: { ...symbolSuccess, property: 'color' },
|
|
7654
7654
|
itemSymbolErrorColor: { ...symbolError, property: 'color' },
|
|
@@ -7661,9 +7661,7 @@ const PolicyValidationClass = compose(
|
|
|
7661
7661
|
componentNameValidationMixin
|
|
7662
7662
|
)(RawPolicyValidation);
|
|
7663
7663
|
|
|
7664
|
-
|
|
7665
|
-
|
|
7666
|
-
const componentName$j = getComponentName('new-password');
|
|
7664
|
+
const componentName$k = getComponentName('new-password');
|
|
7667
7665
|
|
|
7668
7666
|
const policyPreviewVars = PolicyValidationClass.cssVarList;
|
|
7669
7667
|
|
|
@@ -7675,16 +7673,16 @@ const customMixin$3 = (superclass) =>
|
|
|
7675
7673
|
const template = document.createElement('template');
|
|
7676
7674
|
|
|
7677
7675
|
template.innerHTML = `
|
|
7678
|
-
<${componentName$
|
|
7676
|
+
<${componentName$m}
|
|
7679
7677
|
name="new-password"
|
|
7680
7678
|
tabindex="-1"
|
|
7681
7679
|
slot="input"
|
|
7682
|
-
></${componentName$
|
|
7680
|
+
></${componentName$m}>
|
|
7683
7681
|
`;
|
|
7684
7682
|
|
|
7685
7683
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
|
7686
7684
|
|
|
7687
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
|
7685
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$m);
|
|
7688
7686
|
|
|
7689
7687
|
forwardAttrs(this, this.inputElement, {
|
|
7690
7688
|
includeAttrs: [
|
|
@@ -7711,7 +7709,7 @@ const customMixin$3 = (superclass) =>
|
|
|
7711
7709
|
};
|
|
7712
7710
|
|
|
7713
7711
|
const {
|
|
7714
|
-
host: host$
|
|
7712
|
+
host: host$9,
|
|
7715
7713
|
label: label$2,
|
|
7716
7714
|
internalInputsWrapper,
|
|
7717
7715
|
errorMessage: errorMessage$3,
|
|
@@ -7732,7 +7730,7 @@ const NewPasswordClass = compose(
|
|
|
7732
7730
|
createStyleMixin({
|
|
7733
7731
|
mappings: {
|
|
7734
7732
|
fontSize: [
|
|
7735
|
-
host$
|
|
7733
|
+
host$9,
|
|
7736
7734
|
{},
|
|
7737
7735
|
{
|
|
7738
7736
|
selector: PasswordClass.componentName,
|
|
@@ -7741,13 +7739,13 @@ const NewPasswordClass = compose(
|
|
|
7741
7739
|
],
|
|
7742
7740
|
fontFamily: [label$2, errorMessage$3, helperText$2],
|
|
7743
7741
|
errorMessageTextColor: { ...errorMessage$3, property: 'color' },
|
|
7744
|
-
hostWidth: { ...host$
|
|
7745
|
-
hostMinWidth: { ...host$
|
|
7742
|
+
hostWidth: { ...host$9, property: 'width' },
|
|
7743
|
+
hostMinWidth: { ...host$9, property: 'min-width' },
|
|
7746
7744
|
hostDirection: [
|
|
7747
|
-
{ ...host$
|
|
7745
|
+
{ ...host$9, property: 'direction' },
|
|
7748
7746
|
{ ...passwordInput, property: PasswordClass.cssVarList.hostDirection },
|
|
7749
7747
|
],
|
|
7750
|
-
inputsRequiredIndicator: { ...host$
|
|
7748
|
+
inputsRequiredIndicator: { ...host$9, property: 'content' },
|
|
7751
7749
|
spaceBetweenInputs: { ...internalInputsWrapper, property: 'gap' },
|
|
7752
7750
|
policyPreviewBackgroundColor: {
|
|
7753
7751
|
...policyPreview,
|
|
@@ -7816,36 +7814,36 @@ const NewPasswordClass = compose(
|
|
|
7816
7814
|
}
|
|
7817
7815
|
`,
|
|
7818
7816
|
excludeAttrsSync: ['tabindex'],
|
|
7819
|
-
componentName: componentName$
|
|
7817
|
+
componentName: componentName$k,
|
|
7820
7818
|
})
|
|
7821
7819
|
);
|
|
7822
7820
|
|
|
7823
|
-
const globalRefs$
|
|
7824
|
-
const vars$
|
|
7821
|
+
const globalRefs$c = getThemeRefs(globals);
|
|
7822
|
+
const vars$g = NewPasswordClass.cssVarList;
|
|
7825
7823
|
|
|
7826
7824
|
const newPassword = {
|
|
7827
|
-
[vars$
|
|
7828
|
-
[vars$
|
|
7829
|
-
[vars$
|
|
7830
|
-
[vars$
|
|
7831
|
-
[vars$
|
|
7832
|
-
[vars$
|
|
7833
|
-
[vars$
|
|
7834
|
-
[vars$
|
|
7835
|
-
[vars$
|
|
7825
|
+
[vars$g.hostWidth]: refs.width,
|
|
7826
|
+
[vars$g.hostMinWidth]: refs.minWidth,
|
|
7827
|
+
[vars$g.hostDirection]: refs.direction,
|
|
7828
|
+
[vars$g.fontSize]: refs.fontSize,
|
|
7829
|
+
[vars$g.fontFamily]: refs.fontFamily,
|
|
7830
|
+
[vars$g.spaceBetweenInputs]: '1em',
|
|
7831
|
+
[vars$g.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
7832
|
+
[vars$g.policyPreviewBackgroundColor]: 'none',
|
|
7833
|
+
[vars$g.policyPreviewPadding]: globalRefs$c.spacing.lg,
|
|
7836
7834
|
|
|
7837
7835
|
_required: {
|
|
7838
7836
|
// NewPassword doesn't pass `required` attribute to its Password components.
|
|
7839
7837
|
// That's why we fake the required indicator on each input.
|
|
7840
7838
|
// We do that by injecting `::after` element, and populating it with requiredIndicator content.
|
|
7841
|
-
[vars$
|
|
7839
|
+
[vars$g.inputsRequiredIndicator]: refs.requiredIndicator, // used to populate required content for NewPassword input fields outside the theme
|
|
7842
7840
|
},
|
|
7843
7841
|
};
|
|
7844
7842
|
|
|
7845
7843
|
var newPassword$1 = /*#__PURE__*/Object.freeze({
|
|
7846
7844
|
__proto__: null,
|
|
7847
7845
|
default: newPassword,
|
|
7848
|
-
vars: vars$
|
|
7846
|
+
vars: vars$g
|
|
7849
7847
|
});
|
|
7850
7848
|
|
|
7851
7849
|
const getFileBase64 = (fileObj) => {
|
|
@@ -7860,7 +7858,7 @@ const getFilename = (fileObj) => {
|
|
|
7860
7858
|
return fileObj.name.replace(/^.*\\/, '');
|
|
7861
7859
|
};
|
|
7862
7860
|
|
|
7863
|
-
const componentName$
|
|
7861
|
+
const componentName$j = getComponentName('upload-file');
|
|
7864
7862
|
|
|
7865
7863
|
const observedAttributes$1 = [
|
|
7866
7864
|
'title',
|
|
@@ -7875,7 +7873,7 @@ const observedAttributes$1 = [
|
|
|
7875
7873
|
'icon',
|
|
7876
7874
|
];
|
|
7877
7875
|
|
|
7878
|
-
const BaseInputClass = createBaseInputClass({ componentName: componentName$
|
|
7876
|
+
const BaseInputClass = createBaseInputClass({ componentName: componentName$j, baseSelector: ':host > div' });
|
|
7879
7877
|
|
|
7880
7878
|
class RawUploadFile extends BaseInputClass {
|
|
7881
7879
|
static get observedAttributes() {
|
|
@@ -8047,7 +8045,7 @@ class RawUploadFile extends BaseInputClass {
|
|
|
8047
8045
|
}
|
|
8048
8046
|
|
|
8049
8047
|
const buttonVars = ButtonClass.cssVarList;
|
|
8050
|
-
const { host: host$
|
|
8048
|
+
const { host: host$8, wrapper, icon, title, description, requiredIndicator: requiredIndicator$2 } = {
|
|
8051
8049
|
host: { selector: () => ':host' },
|
|
8052
8050
|
wrapper: { selector: () => ':host > div' },
|
|
8053
8051
|
icon: { selector: () => '::slotted(*)' },
|
|
@@ -8066,11 +8064,11 @@ const UploadFileClass = compose(
|
|
|
8066
8064
|
borderWidth: {},
|
|
8067
8065
|
borderStyle: {},
|
|
8068
8066
|
borderRadius: {},
|
|
8069
|
-
hostHeight: { ...host$
|
|
8070
|
-
hostWidth: { ...host$
|
|
8067
|
+
hostHeight: { ...host$8, property: 'height' },
|
|
8068
|
+
hostWidth: { ...host$8, property: 'width' },
|
|
8071
8069
|
hostPadding: { property: 'padding' },
|
|
8072
8070
|
hostDirection: [
|
|
8073
|
-
{ ...host$
|
|
8071
|
+
{ ...host$8, property: 'direction' },
|
|
8074
8072
|
{ selector: () => ButtonClass.componentName, property: buttonVars.hostDirection },
|
|
8075
8073
|
],
|
|
8076
8074
|
gap: { ...wrapper },
|
|
@@ -8090,77 +8088,77 @@ const UploadFileClass = compose(
|
|
|
8090
8088
|
componentNameValidationMixin
|
|
8091
8089
|
)(RawUploadFile);
|
|
8092
8090
|
|
|
8093
|
-
const vars$
|
|
8091
|
+
const vars$f = UploadFileClass.cssVarList;
|
|
8094
8092
|
|
|
8095
8093
|
const uploadFile = {
|
|
8096
|
-
[vars$
|
|
8097
|
-
[vars$
|
|
8098
|
-
[vars$
|
|
8094
|
+
[vars$f.hostDirection]: refs.direction,
|
|
8095
|
+
[vars$f.labelTextColor]: refs.labelTextColor,
|
|
8096
|
+
[vars$f.fontFamily]: refs.fontFamily,
|
|
8099
8097
|
|
|
8100
|
-
[vars$
|
|
8098
|
+
[vars$f.iconSize]: '2em',
|
|
8101
8099
|
|
|
8102
|
-
[vars$
|
|
8103
|
-
[vars$
|
|
8100
|
+
[vars$f.hostPadding]: '0.75em',
|
|
8101
|
+
[vars$f.gap]: '0.5em',
|
|
8104
8102
|
|
|
8105
|
-
[vars$
|
|
8106
|
-
[vars$
|
|
8107
|
-
[vars$
|
|
8103
|
+
[vars$f.fontSize]: '16px',
|
|
8104
|
+
[vars$f.titleFontWeight]: '500',
|
|
8105
|
+
[vars$f.lineHeight]: '1em',
|
|
8108
8106
|
|
|
8109
|
-
[vars$
|
|
8110
|
-
[vars$
|
|
8111
|
-
[vars$
|
|
8112
|
-
[vars$
|
|
8107
|
+
[vars$f.borderWidth]: refs.borderWidth,
|
|
8108
|
+
[vars$f.borderColor]: refs.borderColor,
|
|
8109
|
+
[vars$f.borderRadius]: refs.borderRadius,
|
|
8110
|
+
[vars$f.borderStyle]: 'dashed',
|
|
8113
8111
|
|
|
8114
8112
|
_required: {
|
|
8115
|
-
[vars$
|
|
8113
|
+
[vars$f.requiredIndicator]: refs.requiredIndicator,
|
|
8116
8114
|
},
|
|
8117
8115
|
|
|
8118
8116
|
size: {
|
|
8119
8117
|
xs: {
|
|
8120
|
-
[vars$
|
|
8121
|
-
[vars$
|
|
8122
|
-
[vars$
|
|
8123
|
-
[vars$
|
|
8124
|
-
[vars$
|
|
8118
|
+
[vars$f.hostHeight]: '196px',
|
|
8119
|
+
[vars$f.hostWidth]: '200px',
|
|
8120
|
+
[vars$f.titleFontSize]: '0.875em',
|
|
8121
|
+
[vars$f.descriptionFontSize]: '0.875em',
|
|
8122
|
+
[vars$f.lineHeight]: '1.25em',
|
|
8125
8123
|
},
|
|
8126
8124
|
sm: {
|
|
8127
|
-
[vars$
|
|
8128
|
-
[vars$
|
|
8129
|
-
[vars$
|
|
8130
|
-
[vars$
|
|
8131
|
-
[vars$
|
|
8125
|
+
[vars$f.hostHeight]: '216px',
|
|
8126
|
+
[vars$f.hostWidth]: '230px',
|
|
8127
|
+
[vars$f.titleFontSize]: '1em',
|
|
8128
|
+
[vars$f.descriptionFontSize]: '0.875em',
|
|
8129
|
+
[vars$f.lineHeight]: '1.25em',
|
|
8132
8130
|
},
|
|
8133
8131
|
md: {
|
|
8134
|
-
[vars$
|
|
8135
|
-
[vars$
|
|
8136
|
-
[vars$
|
|
8137
|
-
[vars$
|
|
8138
|
-
[vars$
|
|
8132
|
+
[vars$f.hostHeight]: '256px',
|
|
8133
|
+
[vars$f.hostWidth]: '312px',
|
|
8134
|
+
[vars$f.titleFontSize]: '1.125em',
|
|
8135
|
+
[vars$f.descriptionFontSize]: '1em',
|
|
8136
|
+
[vars$f.lineHeight]: '1.5em',
|
|
8139
8137
|
},
|
|
8140
8138
|
lg: {
|
|
8141
|
-
[vars$
|
|
8142
|
-
[vars$
|
|
8143
|
-
[vars$
|
|
8144
|
-
[vars$
|
|
8145
|
-
[vars$
|
|
8139
|
+
[vars$f.hostHeight]: '280px',
|
|
8140
|
+
[vars$f.hostWidth]: '336px',
|
|
8141
|
+
[vars$f.titleFontSize]: '1.125em',
|
|
8142
|
+
[vars$f.descriptionFontSize]: '1.125em',
|
|
8143
|
+
[vars$f.lineHeight]: '1.75em',
|
|
8146
8144
|
},
|
|
8147
8145
|
},
|
|
8148
8146
|
|
|
8149
8147
|
_fullWidth: {
|
|
8150
|
-
[vars$
|
|
8148
|
+
[vars$f.hostWidth]: refs.width,
|
|
8151
8149
|
},
|
|
8152
8150
|
};
|
|
8153
8151
|
|
|
8154
8152
|
var uploadFile$1 = /*#__PURE__*/Object.freeze({
|
|
8155
8153
|
__proto__: null,
|
|
8156
8154
|
default: uploadFile,
|
|
8157
|
-
vars: vars$
|
|
8155
|
+
vars: vars$f
|
|
8158
8156
|
});
|
|
8159
8157
|
|
|
8160
|
-
const componentName$
|
|
8158
|
+
const componentName$i = getComponentName('button-selection-group-item');
|
|
8161
8159
|
|
|
8162
8160
|
class RawSelectItem extends createBaseClass({
|
|
8163
|
-
componentName: componentName$
|
|
8161
|
+
componentName: componentName$i,
|
|
8164
8162
|
baseSelector: ':host > descope-button',
|
|
8165
8163
|
}) {
|
|
8166
8164
|
get size() {
|
|
@@ -8267,39 +8265,39 @@ const ButtonSelectionGroupItemClass = compose(
|
|
|
8267
8265
|
componentNameValidationMixin
|
|
8268
8266
|
)(RawSelectItem);
|
|
8269
8267
|
|
|
8270
|
-
const globalRefs$
|
|
8268
|
+
const globalRefs$b = getThemeRefs(globals);
|
|
8271
8269
|
|
|
8272
|
-
const vars$
|
|
8270
|
+
const vars$e = ButtonSelectionGroupItemClass.cssVarList;
|
|
8273
8271
|
|
|
8274
8272
|
const buttonSelectionGroupItem = {
|
|
8275
|
-
[vars$
|
|
8276
|
-
[vars$
|
|
8277
|
-
[vars$
|
|
8278
|
-
[vars$
|
|
8279
|
-
[vars$
|
|
8280
|
-
[vars$
|
|
8281
|
-
[vars$
|
|
8282
|
-
[vars$
|
|
8273
|
+
[vars$e.hostDirection]: 'inherit',
|
|
8274
|
+
[vars$e.backgroundColor]: globalRefs$b.colors.surface.main,
|
|
8275
|
+
[vars$e.labelTextColor]: globalRefs$b.colors.surface.contrast,
|
|
8276
|
+
[vars$e.borderColor]: globalRefs$b.colors.surface.light,
|
|
8277
|
+
[vars$e.borderStyle]: 'solid',
|
|
8278
|
+
[vars$e.borderRadius]: globalRefs$b.radius.sm,
|
|
8279
|
+
[vars$e.outlineColor]: 'transparent',
|
|
8280
|
+
[vars$e.borderWidth]: globalRefs$b.border.xs,
|
|
8283
8281
|
|
|
8284
8282
|
_hover: {
|
|
8285
|
-
[vars$
|
|
8283
|
+
[vars$e.backgroundColor]: globalRefs$b.colors.surface.highlight,
|
|
8286
8284
|
},
|
|
8287
8285
|
|
|
8288
8286
|
_focused: {
|
|
8289
|
-
[vars$
|
|
8287
|
+
[vars$e.outlineColor]: globalRefs$b.colors.surface.light,
|
|
8290
8288
|
},
|
|
8291
8289
|
|
|
8292
8290
|
_selected: {
|
|
8293
|
-
[vars$
|
|
8294
|
-
[vars$
|
|
8295
|
-
[vars$
|
|
8291
|
+
[vars$e.borderColor]: globalRefs$b.colors.surface.contrast,
|
|
8292
|
+
[vars$e.backgroundColor]: globalRefs$b.colors.surface.contrast,
|
|
8293
|
+
[vars$e.labelTextColor]: globalRefs$b.colors.surface.main,
|
|
8296
8294
|
},
|
|
8297
8295
|
};
|
|
8298
8296
|
|
|
8299
8297
|
var buttonSelectionGroupItem$1 = /*#__PURE__*/Object.freeze({
|
|
8300
8298
|
__proto__: null,
|
|
8301
8299
|
default: buttonSelectionGroupItem,
|
|
8302
|
-
vars: vars$
|
|
8300
|
+
vars: vars$e
|
|
8303
8301
|
});
|
|
8304
8302
|
|
|
8305
8303
|
const createBaseButtonSelectionGroupInternalClass = (componentName) => {
|
|
@@ -8398,10 +8396,10 @@ const createBaseButtonSelectionGroupInternalClass = (componentName) => {
|
|
|
8398
8396
|
return BaseButtonSelectionGroupInternalClass;
|
|
8399
8397
|
};
|
|
8400
8398
|
|
|
8401
|
-
const componentName$
|
|
8399
|
+
const componentName$h = getComponentName('button-selection-group-internal');
|
|
8402
8400
|
|
|
8403
8401
|
class ButtonSelectionGroupInternalClass extends createBaseButtonSelectionGroupInternalClass(
|
|
8404
|
-
componentName$
|
|
8402
|
+
componentName$h
|
|
8405
8403
|
) {
|
|
8406
8404
|
getSelectedNode() {
|
|
8407
8405
|
return this.items.find((item) => item.hasAttribute('selected'));
|
|
@@ -8557,7 +8555,7 @@ const buttonSelectionGroupBaseMixin = (superclass) =>
|
|
|
8557
8555
|
}
|
|
8558
8556
|
};
|
|
8559
8557
|
|
|
8560
|
-
const { host: host$
|
|
8558
|
+
const { host: host$7, label: label$1, requiredIndicator: requiredIndicator$1, internalWrapper, errorMessage: errorMessage$2 } = {
|
|
8561
8559
|
host: { selector: () => ':host' },
|
|
8562
8560
|
label: { selector: '::part(label)' },
|
|
8563
8561
|
requiredIndicator: { selector: '[required]::part(required-indicator)::after' },
|
|
@@ -8566,9 +8564,9 @@ const { host: host$6, label: label$1, requiredIndicator: requiredIndicator$1, in
|
|
|
8566
8564
|
};
|
|
8567
8565
|
|
|
8568
8566
|
const buttonSelectionGroupMappings = {
|
|
8569
|
-
hostWidth: { ...host$
|
|
8570
|
-
hostDirection: { ...host$
|
|
8571
|
-
fontFamily: host$
|
|
8567
|
+
hostWidth: { ...host$7, property: 'width' },
|
|
8568
|
+
hostDirection: { ...host$7, property: 'direction' },
|
|
8569
|
+
fontFamily: host$7,
|
|
8572
8570
|
labelTextColor: [
|
|
8573
8571
|
{ ...label$1, property: 'color' },
|
|
8574
8572
|
{ ...requiredIndicator$1, property: 'color' },
|
|
@@ -8633,7 +8631,7 @@ const buttonSelectionGroupStyles = `
|
|
|
8633
8631
|
${resetInputCursor('vaadin-text-field')}
|
|
8634
8632
|
`;
|
|
8635
8633
|
|
|
8636
|
-
const componentName$
|
|
8634
|
+
const componentName$g = getComponentName('button-selection-group');
|
|
8637
8635
|
|
|
8638
8636
|
const buttonSelectionGroupMixin = (superclass) =>
|
|
8639
8637
|
class ButtonMultiSelectionGroupMixinClass extends superclass {
|
|
@@ -8642,19 +8640,19 @@ const buttonSelectionGroupMixin = (superclass) =>
|
|
|
8642
8640
|
const template = document.createElement('template');
|
|
8643
8641
|
|
|
8644
8642
|
template.innerHTML = `
|
|
8645
|
-
<${componentName$
|
|
8643
|
+
<${componentName$h}
|
|
8646
8644
|
name="button-selection-group"
|
|
8647
8645
|
slot="input"
|
|
8648
8646
|
tabindex="-1"
|
|
8649
8647
|
part="internal-component"
|
|
8650
8648
|
>
|
|
8651
8649
|
<slot></slot>
|
|
8652
|
-
</${componentName$
|
|
8650
|
+
</${componentName$h}>
|
|
8653
8651
|
`;
|
|
8654
8652
|
|
|
8655
8653
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
|
8656
8654
|
|
|
8657
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
|
8655
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$h);
|
|
8658
8656
|
|
|
8659
8657
|
forwardAttrs(this, this.inputElement, {
|
|
8660
8658
|
includeAttrs: ['size', 'default-value', 'allow-deselect'],
|
|
@@ -8679,11 +8677,11 @@ const ButtonSelectionGroupClass = compose(
|
|
|
8679
8677
|
wrappedEleName: 'vaadin-text-field',
|
|
8680
8678
|
style: () => buttonSelectionGroupStyles,
|
|
8681
8679
|
excludeAttrsSync: ['tabindex'],
|
|
8682
|
-
componentName: componentName$
|
|
8680
|
+
componentName: componentName$g,
|
|
8683
8681
|
})
|
|
8684
8682
|
);
|
|
8685
8683
|
|
|
8686
|
-
const globalRefs$
|
|
8684
|
+
const globalRefs$a = getThemeRefs(globals);
|
|
8687
8685
|
|
|
8688
8686
|
const createBaseButtonSelectionGroupMappings = (vars) => ({
|
|
8689
8687
|
[vars.hostDirection]: refs.direction,
|
|
@@ -8691,26 +8689,26 @@ const createBaseButtonSelectionGroupMappings = (vars) => ({
|
|
|
8691
8689
|
[vars.labelTextColor]: refs.labelTextColor,
|
|
8692
8690
|
[vars.labelRequiredIndicator]: refs.requiredIndicator,
|
|
8693
8691
|
[vars.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
8694
|
-
[vars.itemsSpacing]: globalRefs$
|
|
8692
|
+
[vars.itemsSpacing]: globalRefs$a.spacing.sm,
|
|
8695
8693
|
[vars.hostWidth]: refs.width,
|
|
8696
8694
|
});
|
|
8697
8695
|
|
|
8698
|
-
const vars$
|
|
8696
|
+
const vars$d = ButtonSelectionGroupClass.cssVarList;
|
|
8699
8697
|
|
|
8700
8698
|
const buttonSelectionGroup = {
|
|
8701
|
-
...createBaseButtonSelectionGroupMappings(vars$
|
|
8699
|
+
...createBaseButtonSelectionGroupMappings(vars$d),
|
|
8702
8700
|
};
|
|
8703
8701
|
|
|
8704
8702
|
var buttonSelectionGroup$1 = /*#__PURE__*/Object.freeze({
|
|
8705
8703
|
__proto__: null,
|
|
8706
8704
|
default: buttonSelectionGroup,
|
|
8707
|
-
vars: vars$
|
|
8705
|
+
vars: vars$d
|
|
8708
8706
|
});
|
|
8709
8707
|
|
|
8710
|
-
const componentName$
|
|
8708
|
+
const componentName$f = getComponentName('button-multi-selection-group-internal');
|
|
8711
8709
|
|
|
8712
8710
|
class ButtonMultiSelectionGroupInternalClass extends createBaseButtonSelectionGroupInternalClass(
|
|
8713
|
-
componentName$
|
|
8711
|
+
componentName$f
|
|
8714
8712
|
) {
|
|
8715
8713
|
#getSelectedNodes() {
|
|
8716
8714
|
return this.items.filter((item) => item.hasAttribute('selected'));
|
|
@@ -8813,7 +8811,7 @@ class ButtonMultiSelectionGroupInternalClass extends createBaseButtonSelectionGr
|
|
|
8813
8811
|
}
|
|
8814
8812
|
}
|
|
8815
8813
|
|
|
8816
|
-
const componentName$
|
|
8814
|
+
const componentName$e = getComponentName('button-multi-selection-group');
|
|
8817
8815
|
|
|
8818
8816
|
const buttonMultiSelectionGroupMixin = (superclass) =>
|
|
8819
8817
|
class ButtonMultiSelectionGroupMixinClass extends superclass {
|
|
@@ -8822,19 +8820,19 @@ const buttonMultiSelectionGroupMixin = (superclass) =>
|
|
|
8822
8820
|
const template = document.createElement('template');
|
|
8823
8821
|
|
|
8824
8822
|
template.innerHTML = `
|
|
8825
|
-
<${componentName$
|
|
8823
|
+
<${componentName$f}
|
|
8826
8824
|
name="button-selection-group"
|
|
8827
8825
|
slot="input"
|
|
8828
8826
|
tabindex="-1"
|
|
8829
8827
|
part="internal-component"
|
|
8830
8828
|
>
|
|
8831
8829
|
<slot></slot>
|
|
8832
|
-
</${componentName$
|
|
8830
|
+
</${componentName$f}>
|
|
8833
8831
|
`;
|
|
8834
8832
|
|
|
8835
8833
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
|
8836
8834
|
|
|
8837
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
|
8835
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$f);
|
|
8838
8836
|
|
|
8839
8837
|
forwardAttrs(this, this.inputElement, {
|
|
8840
8838
|
includeAttrs: ['size', 'default-values', 'min-items-selection', 'max-items-selection'],
|
|
@@ -8859,23 +8857,23 @@ const ButtonMultiSelectionGroupClass = compose(
|
|
|
8859
8857
|
wrappedEleName: 'vaadin-text-field',
|
|
8860
8858
|
style: () => buttonSelectionGroupStyles,
|
|
8861
8859
|
excludeAttrsSync: ['tabindex'],
|
|
8862
|
-
componentName: componentName$
|
|
8860
|
+
componentName: componentName$e,
|
|
8863
8861
|
})
|
|
8864
8862
|
);
|
|
8865
8863
|
|
|
8866
|
-
const vars$
|
|
8864
|
+
const vars$c = ButtonMultiSelectionGroupClass.cssVarList;
|
|
8867
8865
|
|
|
8868
8866
|
const buttonMultiSelectionGroup = {
|
|
8869
|
-
...createBaseButtonSelectionGroupMappings(vars$
|
|
8867
|
+
...createBaseButtonSelectionGroupMappings(vars$c),
|
|
8870
8868
|
};
|
|
8871
8869
|
|
|
8872
8870
|
var buttonMultiSelectionGroup$1 = /*#__PURE__*/Object.freeze({
|
|
8873
8871
|
__proto__: null,
|
|
8874
8872
|
default: buttonMultiSelectionGroup,
|
|
8875
|
-
vars: vars$
|
|
8873
|
+
vars: vars$c
|
|
8876
8874
|
});
|
|
8877
8875
|
|
|
8878
|
-
const componentName$
|
|
8876
|
+
const componentName$d = getComponentName('modal');
|
|
8879
8877
|
|
|
8880
8878
|
const customMixin$2 = (superclass) =>
|
|
8881
8879
|
class ModalMixinClass extends superclass {
|
|
@@ -8974,28 +8972,28 @@ const ModalClass = compose(
|
|
|
8974
8972
|
wrappedEleName: 'vaadin-dialog',
|
|
8975
8973
|
style: () => ``,
|
|
8976
8974
|
excludeAttrsSync: ['tabindex', 'opened'],
|
|
8977
|
-
componentName: componentName$
|
|
8975
|
+
componentName: componentName$d,
|
|
8978
8976
|
})
|
|
8979
8977
|
);
|
|
8980
8978
|
|
|
8981
|
-
const globalRefs$
|
|
8979
|
+
const globalRefs$9 = getThemeRefs(globals);
|
|
8982
8980
|
|
|
8983
8981
|
const compVars$1 = ModalClass.cssVarList;
|
|
8984
8982
|
|
|
8985
8983
|
const modal = {
|
|
8986
|
-
[compVars$1.overlayBackgroundColor]: globalRefs$
|
|
8987
|
-
[compVars$1.overlayShadow]: globalRefs$
|
|
8984
|
+
[compVars$1.overlayBackgroundColor]: globalRefs$9.colors.surface.main,
|
|
8985
|
+
[compVars$1.overlayShadow]: globalRefs$9.shadow.wide['2xl'],
|
|
8988
8986
|
[compVars$1.overlayWidth]: '540px',
|
|
8989
8987
|
};
|
|
8990
8988
|
|
|
8991
|
-
const vars$
|
|
8989
|
+
const vars$b = {
|
|
8992
8990
|
...compVars$1,
|
|
8993
8991
|
};
|
|
8994
8992
|
|
|
8995
8993
|
var modal$1 = /*#__PURE__*/Object.freeze({
|
|
8996
8994
|
__proto__: null,
|
|
8997
8995
|
default: modal,
|
|
8998
|
-
vars: vars$
|
|
8996
|
+
vars: vars$b
|
|
8999
8997
|
});
|
|
9000
8998
|
|
|
9001
8999
|
const isValidDataType = (data) => {
|
|
@@ -9008,7 +9006,7 @@ const isValidDataType = (data) => {
|
|
|
9008
9006
|
return isValid;
|
|
9009
9007
|
};
|
|
9010
9008
|
|
|
9011
|
-
const componentName$
|
|
9009
|
+
const componentName$c = getComponentName('grid');
|
|
9012
9010
|
|
|
9013
9011
|
const GridMixin = (superclass) =>
|
|
9014
9012
|
class GridMixinClass extends superclass {
|
|
@@ -9168,7 +9166,7 @@ const GridMixin = (superclass) =>
|
|
|
9168
9166
|
};
|
|
9169
9167
|
|
|
9170
9168
|
const {
|
|
9171
|
-
host: host$
|
|
9169
|
+
host: host$6,
|
|
9172
9170
|
headerRow,
|
|
9173
9171
|
headerRowCell,
|
|
9174
9172
|
contentRow,
|
|
@@ -9203,15 +9201,15 @@ const GridClass = compose(
|
|
|
9203
9201
|
fontWeight: { ...contentRow },
|
|
9204
9202
|
valueTextColor: { ...contentRow, property: 'color' },
|
|
9205
9203
|
backgroundColor: [
|
|
9206
|
-
{ ...host$
|
|
9204
|
+
{ ...host$6, property: 'background-color' },
|
|
9207
9205
|
{ ...contentRow, property: 'background-color' },
|
|
9208
9206
|
],
|
|
9209
9207
|
sortIndicatorsColor: { ...sortIndicators, property: 'color' },
|
|
9210
9208
|
activeSortIndicator: { ...activeSortIndicator, property: 'color' },
|
|
9211
|
-
borderColor: { ...host$
|
|
9212
|
-
borderWidth: { ...host$
|
|
9213
|
-
borderStyle: { ...host$
|
|
9214
|
-
borderRadius: { ...host$
|
|
9209
|
+
borderColor: { ...host$6, property: 'border-color' },
|
|
9210
|
+
borderWidth: { ...host$6, property: 'border-width' },
|
|
9211
|
+
borderStyle: { ...host$6, property: 'border-style' },
|
|
9212
|
+
borderRadius: { ...host$6, property: 'border-radius' },
|
|
9215
9213
|
selectedBackgroundColor: { ...selectedRow, property: 'background-color' },
|
|
9216
9214
|
headerRowTextColor: { ...headerRowCell, property: 'color' },
|
|
9217
9215
|
separatorColor: [
|
|
@@ -9244,40 +9242,40 @@ const GridClass = compose(
|
|
|
9244
9242
|
}
|
|
9245
9243
|
`,
|
|
9246
9244
|
excludeAttrsSync: ['columns', 'tabindex'],
|
|
9247
|
-
componentName: componentName$
|
|
9245
|
+
componentName: componentName$c,
|
|
9248
9246
|
})
|
|
9249
9247
|
);
|
|
9250
9248
|
|
|
9251
|
-
const globalRefs$
|
|
9252
|
-
const vars$
|
|
9249
|
+
const globalRefs$8 = getThemeRefs(globals);
|
|
9250
|
+
const vars$a = GridClass.cssVarList;
|
|
9253
9251
|
|
|
9254
9252
|
const grid = {
|
|
9255
|
-
[vars$
|
|
9256
|
-
[vars$
|
|
9257
|
-
[vars$
|
|
9258
|
-
[vars$
|
|
9259
|
-
[vars$
|
|
9253
|
+
[vars$a.hostWidth]: '100%',
|
|
9254
|
+
[vars$a.hostHeight]: '100%',
|
|
9255
|
+
[vars$a.hostMinHeight]: '400px',
|
|
9256
|
+
[vars$a.fontWeight]: '400',
|
|
9257
|
+
[vars$a.backgroundColor]: globalRefs$8.colors.surface.main,
|
|
9260
9258
|
|
|
9261
|
-
[vars$
|
|
9262
|
-
[vars$
|
|
9259
|
+
[vars$a.fontSize]: refs.fontSize,
|
|
9260
|
+
[vars$a.fontFamily]: refs.fontFamily,
|
|
9263
9261
|
|
|
9264
|
-
[vars$
|
|
9265
|
-
[vars$
|
|
9266
|
-
[vars$
|
|
9262
|
+
[vars$a.sortIndicatorsColor]: globalRefs$8.colors.surface.light,
|
|
9263
|
+
[vars$a.activeSortIndicator]: globalRefs$8.colors.surface.dark,
|
|
9264
|
+
[vars$a.resizeHandleColor]: globalRefs$8.colors.surface.light,
|
|
9267
9265
|
|
|
9268
|
-
[vars$
|
|
9269
|
-
[vars$
|
|
9270
|
-
[vars$
|
|
9271
|
-
[vars$
|
|
9266
|
+
[vars$a.borderWidth]: refs.borderWidth,
|
|
9267
|
+
[vars$a.borderStyle]: refs.borderStyle,
|
|
9268
|
+
[vars$a.borderRadius]: refs.borderRadius,
|
|
9269
|
+
[vars$a.borderColor]: 'transparent',
|
|
9272
9270
|
|
|
9273
|
-
[vars$
|
|
9274
|
-
[vars$
|
|
9271
|
+
[vars$a.headerRowTextColor]: globalRefs$8.colors.surface.dark,
|
|
9272
|
+
[vars$a.separatorColor]: globalRefs$8.colors.surface.light,
|
|
9275
9273
|
|
|
9276
|
-
[vars$
|
|
9277
|
-
[vars$
|
|
9274
|
+
[vars$a.valueTextColor]: globalRefs$8.colors.surface.contrast,
|
|
9275
|
+
[vars$a.selectedBackgroundColor]: globalRefs$8.colors.surface.highlight,
|
|
9278
9276
|
|
|
9279
9277
|
_bordered: {
|
|
9280
|
-
[vars$
|
|
9278
|
+
[vars$a.borderColor]: refs.borderColor,
|
|
9281
9279
|
},
|
|
9282
9280
|
};
|
|
9283
9281
|
|
|
@@ -9285,10 +9283,10 @@ var grid$1 = /*#__PURE__*/Object.freeze({
|
|
|
9285
9283
|
__proto__: null,
|
|
9286
9284
|
default: grid,
|
|
9287
9285
|
grid: grid,
|
|
9288
|
-
vars: vars$
|
|
9286
|
+
vars: vars$a
|
|
9289
9287
|
});
|
|
9290
9288
|
|
|
9291
|
-
const componentName$
|
|
9289
|
+
const componentName$b = getComponentName('notification-card');
|
|
9292
9290
|
|
|
9293
9291
|
const notificationCardMixin = (superclass) =>
|
|
9294
9292
|
class NotificationCardMixinClass extends superclass {
|
|
@@ -9396,54 +9394,54 @@ const NotificationCardClass = compose(
|
|
|
9396
9394
|
}
|
|
9397
9395
|
`,
|
|
9398
9396
|
excludeAttrsSync: ['tabindex'],
|
|
9399
|
-
componentName: componentName$
|
|
9397
|
+
componentName: componentName$b,
|
|
9400
9398
|
})
|
|
9401
9399
|
);
|
|
9402
9400
|
|
|
9403
|
-
const globalRefs$
|
|
9404
|
-
const vars$
|
|
9401
|
+
const globalRefs$7 = getThemeRefs(globals);
|
|
9402
|
+
const vars$9 = NotificationCardClass.cssVarList;
|
|
9405
9403
|
|
|
9406
9404
|
const shadowColor = '#00000020';
|
|
9407
9405
|
|
|
9408
9406
|
const notification = {
|
|
9409
|
-
[vars$
|
|
9410
|
-
[vars$
|
|
9411
|
-
[vars$
|
|
9412
|
-
[vars$
|
|
9413
|
-
[vars$
|
|
9414
|
-
[vars$
|
|
9415
|
-
[vars$
|
|
9416
|
-
[vars$
|
|
9417
|
-
[vars$
|
|
9407
|
+
[vars$9.hostMinWidth]: '415px',
|
|
9408
|
+
[vars$9.fontFamily]: globalRefs$7.fonts.font1.family,
|
|
9409
|
+
[vars$9.fontSize]: globalRefs$7.typography.body1.size,
|
|
9410
|
+
[vars$9.backgroundColor]: globalRefs$7.colors.surface.main,
|
|
9411
|
+
[vars$9.textColor]: globalRefs$7.colors.surface.contrast,
|
|
9412
|
+
[vars$9.boxShadow]: `${globalRefs$7.shadow.wide.xl} ${shadowColor}, ${globalRefs$7.shadow.narrow.xl} ${shadowColor}`,
|
|
9413
|
+
[vars$9.verticalPadding]: '0.625em',
|
|
9414
|
+
[vars$9.horizontalPadding]: '1.5em',
|
|
9415
|
+
[vars$9.borderRadius]: globalRefs$7.radius.xs,
|
|
9418
9416
|
|
|
9419
9417
|
_bordered: {
|
|
9420
|
-
[vars$
|
|
9421
|
-
[vars$
|
|
9422
|
-
[vars$
|
|
9418
|
+
[vars$9.borderWidth]: globalRefs$7.border.sm,
|
|
9419
|
+
[vars$9.borderStyle]: 'solid',
|
|
9420
|
+
[vars$9.borderColor]: 'transparent',
|
|
9423
9421
|
},
|
|
9424
9422
|
|
|
9425
9423
|
size: {
|
|
9426
|
-
xs: { [vars$
|
|
9427
|
-
sm: { [vars$
|
|
9428
|
-
md: { [vars$
|
|
9429
|
-
lg: { [vars$
|
|
9424
|
+
xs: { [vars$9.fontSize]: '12px' },
|
|
9425
|
+
sm: { [vars$9.fontSize]: '14px' },
|
|
9426
|
+
md: { [vars$9.fontSize]: '16px' },
|
|
9427
|
+
lg: { [vars$9.fontSize]: '18px' },
|
|
9430
9428
|
},
|
|
9431
9429
|
|
|
9432
9430
|
mode: {
|
|
9433
9431
|
primary: {
|
|
9434
|
-
[vars$
|
|
9435
|
-
[vars$
|
|
9436
|
-
[vars$
|
|
9432
|
+
[vars$9.backgroundColor]: globalRefs$7.colors.primary.main,
|
|
9433
|
+
[vars$9.textColor]: globalRefs$7.colors.primary.contrast,
|
|
9434
|
+
[vars$9.borderColor]: globalRefs$7.colors.primary.light,
|
|
9437
9435
|
},
|
|
9438
9436
|
success: {
|
|
9439
|
-
[vars$
|
|
9440
|
-
[vars$
|
|
9441
|
-
[vars$
|
|
9437
|
+
[vars$9.backgroundColor]: globalRefs$7.colors.success.main,
|
|
9438
|
+
[vars$9.textColor]: globalRefs$7.colors.success.contrast,
|
|
9439
|
+
[vars$9.borderColor]: globalRefs$7.colors.success.light,
|
|
9442
9440
|
},
|
|
9443
9441
|
error: {
|
|
9444
|
-
[vars$
|
|
9445
|
-
[vars$
|
|
9446
|
-
[vars$
|
|
9442
|
+
[vars$9.backgroundColor]: globalRefs$7.colors.error.main,
|
|
9443
|
+
[vars$9.textColor]: globalRefs$7.colors.error.contrast,
|
|
9444
|
+
[vars$9.borderColor]: globalRefs$7.colors.error.light,
|
|
9447
9445
|
},
|
|
9448
9446
|
},
|
|
9449
9447
|
};
|
|
@@ -9451,10 +9449,10 @@ const notification = {
|
|
|
9451
9449
|
var notificationCard = /*#__PURE__*/Object.freeze({
|
|
9452
9450
|
__proto__: null,
|
|
9453
9451
|
default: notification,
|
|
9454
|
-
vars: vars$
|
|
9452
|
+
vars: vars$9
|
|
9455
9453
|
});
|
|
9456
9454
|
|
|
9457
|
-
const componentName$
|
|
9455
|
+
const componentName$a = getComponentName('multi-select-combo-box');
|
|
9458
9456
|
|
|
9459
9457
|
const multiSelectComboBoxMixin = (superclass) =>
|
|
9460
9458
|
class MultiSelectComboBoxMixinClass extends superclass {
|
|
@@ -9842,7 +9840,7 @@ const multiSelectComboBoxMixin = (superclass) =>
|
|
|
9842
9840
|
};
|
|
9843
9841
|
|
|
9844
9842
|
const {
|
|
9845
|
-
host: host$
|
|
9843
|
+
host: host$5,
|
|
9846
9844
|
inputField,
|
|
9847
9845
|
inputElement,
|
|
9848
9846
|
placeholder,
|
|
@@ -9880,10 +9878,10 @@ const {
|
|
|
9880
9878
|
const MultiSelectComboBoxClass = compose(
|
|
9881
9879
|
createStyleMixin({
|
|
9882
9880
|
mappings: {
|
|
9883
|
-
hostWidth: { ...host$
|
|
9884
|
-
hostDirection: { ...host$
|
|
9881
|
+
hostWidth: { ...host$5, property: 'width' },
|
|
9882
|
+
hostDirection: { ...host$5, property: 'direction' },
|
|
9885
9883
|
// we apply font-size also on the host so we can set its width with em
|
|
9886
|
-
fontSize: [{}, host$
|
|
9884
|
+
fontSize: [{}, host$5],
|
|
9887
9885
|
chipFontSize: { ...chipLabel, property: 'font-size' },
|
|
9888
9886
|
fontFamily: [label, placeholder, inputField, helperText$1, errorMessage$1, chipLabel],
|
|
9889
9887
|
labelTextColor: [
|
|
@@ -10058,73 +10056,73 @@ const MultiSelectComboBoxClass = compose(
|
|
|
10058
10056
|
// Note: we exclude `placeholder` because the vaadin component observes it and
|
|
10059
10057
|
// tries to override it, causing us to lose the user set placeholder.
|
|
10060
10058
|
excludeAttrsSync: ['tabindex', 'size', 'data', 'placeholder'],
|
|
10061
|
-
componentName: componentName$
|
|
10059
|
+
componentName: componentName$a,
|
|
10062
10060
|
includeForwardProps: ['items', 'renderer', 'selectedItems'],
|
|
10063
10061
|
})
|
|
10064
10062
|
);
|
|
10065
10063
|
|
|
10066
|
-
const globalRefs$
|
|
10067
|
-
const vars$
|
|
10064
|
+
const globalRefs$6 = getThemeRefs(globals);
|
|
10065
|
+
const vars$8 = MultiSelectComboBoxClass.cssVarList;
|
|
10068
10066
|
|
|
10069
10067
|
const multiSelectComboBox = {
|
|
10070
|
-
[vars$
|
|
10071
|
-
[vars$
|
|
10072
|
-
[vars$
|
|
10073
|
-
[vars$
|
|
10074
|
-
[vars$
|
|
10075
|
-
[vars$
|
|
10076
|
-
[vars$
|
|
10077
|
-
[vars$
|
|
10078
|
-
[vars$
|
|
10079
|
-
[vars$
|
|
10080
|
-
[vars$
|
|
10081
|
-
[vars$
|
|
10082
|
-
[vars$
|
|
10083
|
-
[vars$
|
|
10084
|
-
[vars$
|
|
10085
|
-
[vars$
|
|
10086
|
-
[vars$
|
|
10087
|
-
[vars$
|
|
10088
|
-
[vars$
|
|
10089
|
-
[vars$
|
|
10090
|
-
[vars$
|
|
10091
|
-
[vars$
|
|
10092
|
-
[vars$
|
|
10093
|
-
[vars$
|
|
10094
|
-
[vars$
|
|
10095
|
-
[vars$
|
|
10096
|
-
[vars$
|
|
10097
|
-
[vars$
|
|
10098
|
-
[vars$
|
|
10099
|
-
[vars$
|
|
10068
|
+
[vars$8.hostWidth]: refs.width,
|
|
10069
|
+
[vars$8.hostDirection]: refs.direction,
|
|
10070
|
+
[vars$8.fontSize]: refs.fontSize,
|
|
10071
|
+
[vars$8.fontFamily]: refs.fontFamily,
|
|
10072
|
+
[vars$8.labelTextColor]: refs.labelTextColor,
|
|
10073
|
+
[vars$8.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
10074
|
+
[vars$8.inputBorderColor]: refs.borderColor,
|
|
10075
|
+
[vars$8.inputBorderWidth]: refs.borderWidth,
|
|
10076
|
+
[vars$8.inputBorderStyle]: refs.borderStyle,
|
|
10077
|
+
[vars$8.inputBorderRadius]: refs.borderRadius,
|
|
10078
|
+
[vars$8.inputOutlineColor]: refs.outlineColor,
|
|
10079
|
+
[vars$8.inputOutlineOffset]: refs.outlineOffset,
|
|
10080
|
+
[vars$8.inputOutlineWidth]: refs.outlineWidth,
|
|
10081
|
+
[vars$8.inputOutlineStyle]: refs.outlineStyle,
|
|
10082
|
+
[vars$8.labelRequiredIndicator]: refs.requiredIndicator,
|
|
10083
|
+
[vars$8.inputValueTextColor]: refs.valueTextColor,
|
|
10084
|
+
[vars$8.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
|
10085
|
+
[vars$8.inputBackgroundColor]: refs.backgroundColor,
|
|
10086
|
+
[vars$8.inputHorizontalPadding]: refs.horizontalPadding,
|
|
10087
|
+
[vars$8.inputVerticalPadding]: refs.verticalPadding,
|
|
10088
|
+
[vars$8.inputHeight]: refs.inputHeight,
|
|
10089
|
+
[vars$8.inputDropdownButtonColor]: globalRefs$6.colors.surface.dark,
|
|
10090
|
+
[vars$8.inputDropdownButtonCursor]: 'pointer',
|
|
10091
|
+
[vars$8.inputDropdownButtonSize]: refs.toggleButtonSize,
|
|
10092
|
+
[vars$8.inputDropdownButtonOffset]: globalRefs$6.spacing.xs,
|
|
10093
|
+
[vars$8.overlayItemPaddingInlineStart]: globalRefs$6.spacing.xs,
|
|
10094
|
+
[vars$8.overlayItemPaddingInlineEnd]: globalRefs$6.spacing.lg,
|
|
10095
|
+
[vars$8.chipFontSize]: refs.chipFontSize,
|
|
10096
|
+
[vars$8.chipTextColor]: globalRefs$6.colors.surface.contrast,
|
|
10097
|
+
[vars$8.chipBackgroundColor]: globalRefs$6.colors.surface.light,
|
|
10100
10098
|
|
|
10101
10099
|
_readonly: {
|
|
10102
|
-
[vars$
|
|
10100
|
+
[vars$8.inputDropdownButtonCursor]: 'default',
|
|
10103
10101
|
},
|
|
10104
10102
|
|
|
10105
10103
|
// Overlay theme exposed via the component:
|
|
10106
|
-
[vars$
|
|
10107
|
-
[vars$
|
|
10108
|
-
[vars$
|
|
10109
|
-
[vars$
|
|
10110
|
-
[vars$
|
|
10111
|
-
[vars$
|
|
10104
|
+
[vars$8.overlayFontSize]: refs.fontSize,
|
|
10105
|
+
[vars$8.overlayFontFamily]: refs.fontFamily,
|
|
10106
|
+
[vars$8.overlayCursor]: 'pointer',
|
|
10107
|
+
[vars$8.overlayItemBoxShadow]: 'none',
|
|
10108
|
+
[vars$8.overlayBackground]: refs.backgroundColor,
|
|
10109
|
+
[vars$8.overlayTextColor]: refs.valueTextColor,
|
|
10112
10110
|
|
|
10113
10111
|
// Overlay direct theme:
|
|
10114
|
-
[vars$
|
|
10115
|
-
[vars$
|
|
10112
|
+
[vars$8.overlay.minHeight]: '400px',
|
|
10113
|
+
[vars$8.overlay.margin]: '0',
|
|
10116
10114
|
};
|
|
10117
10115
|
|
|
10118
10116
|
var multiSelectComboBox$1 = /*#__PURE__*/Object.freeze({
|
|
10119
10117
|
__proto__: null,
|
|
10120
10118
|
default: multiSelectComboBox,
|
|
10121
10119
|
multiSelectComboBox: multiSelectComboBox,
|
|
10122
|
-
vars: vars$
|
|
10120
|
+
vars: vars$8
|
|
10123
10121
|
});
|
|
10124
10122
|
|
|
10125
|
-
const componentName$
|
|
10123
|
+
const componentName$9 = getComponentName('badge');
|
|
10126
10124
|
|
|
10127
|
-
class RawBadge extends createBaseClass({ componentName: componentName$
|
|
10125
|
+
class RawBadge extends createBaseClass({ componentName: componentName$9, baseSelector: ':host > div' }) {
|
|
10128
10126
|
constructor() {
|
|
10129
10127
|
super();
|
|
10130
10128
|
|
|
@@ -10175,79 +10173,79 @@ const BadgeClass = compose(
|
|
|
10175
10173
|
componentNameValidationMixin
|
|
10176
10174
|
)(RawBadge);
|
|
10177
10175
|
|
|
10178
|
-
const globalRefs$
|
|
10179
|
-
const vars$
|
|
10176
|
+
const globalRefs$5 = getThemeRefs(globals);
|
|
10177
|
+
const vars$7 = BadgeClass.cssVarList;
|
|
10180
10178
|
|
|
10181
|
-
const badge$
|
|
10182
|
-
[vars$
|
|
10183
|
-
[vars$
|
|
10179
|
+
const badge$2 = {
|
|
10180
|
+
[vars$7.hostWidth]: 'fit-content',
|
|
10181
|
+
[vars$7.hostDirection]: globalRefs$5.direction,
|
|
10184
10182
|
|
|
10185
|
-
[vars$
|
|
10183
|
+
[vars$7.textAlign]: 'center',
|
|
10186
10184
|
|
|
10187
|
-
[vars$
|
|
10188
|
-
[vars$
|
|
10185
|
+
[vars$7.fontFamily]: globalRefs$5.fonts.font1.family,
|
|
10186
|
+
[vars$7.fontWeight]: '400',
|
|
10189
10187
|
|
|
10190
|
-
[vars$
|
|
10191
|
-
[vars$
|
|
10188
|
+
[vars$7.verticalPadding]: '0.25em',
|
|
10189
|
+
[vars$7.horizontalPadding]: '0.5em',
|
|
10192
10190
|
|
|
10193
|
-
[vars$
|
|
10194
|
-
[vars$
|
|
10195
|
-
[vars$
|
|
10196
|
-
[vars$
|
|
10191
|
+
[vars$7.borderWidth]: globalRefs$5.border.xs,
|
|
10192
|
+
[vars$7.borderRadius]: globalRefs$5.radius.xs,
|
|
10193
|
+
[vars$7.borderColor]: 'transparent',
|
|
10194
|
+
[vars$7.borderStyle]: 'solid',
|
|
10197
10195
|
|
|
10198
10196
|
_fullWidth: {
|
|
10199
|
-
[vars$
|
|
10197
|
+
[vars$7.hostWidth]: '100%',
|
|
10200
10198
|
},
|
|
10201
10199
|
|
|
10202
10200
|
size: {
|
|
10203
|
-
xs: { [vars$
|
|
10204
|
-
sm: { [vars$
|
|
10205
|
-
md: { [vars$
|
|
10206
|
-
lg: { [vars$
|
|
10201
|
+
xs: { [vars$7.fontSize]: '12px' },
|
|
10202
|
+
sm: { [vars$7.fontSize]: '14px' },
|
|
10203
|
+
md: { [vars$7.fontSize]: '16px' },
|
|
10204
|
+
lg: { [vars$7.fontSize]: '18px' },
|
|
10207
10205
|
},
|
|
10208
10206
|
|
|
10209
10207
|
mode: {
|
|
10210
10208
|
default: {
|
|
10211
|
-
[vars$
|
|
10209
|
+
[vars$7.textColor]: globalRefs$5.colors.surface.dark,
|
|
10212
10210
|
_bordered: {
|
|
10213
|
-
[vars$
|
|
10211
|
+
[vars$7.borderColor]: globalRefs$5.colors.surface.light,
|
|
10214
10212
|
},
|
|
10215
10213
|
},
|
|
10216
10214
|
primary: {
|
|
10217
|
-
[vars$
|
|
10215
|
+
[vars$7.textColor]: globalRefs$5.colors.primary.main,
|
|
10218
10216
|
_bordered: {
|
|
10219
|
-
[vars$
|
|
10217
|
+
[vars$7.borderColor]: globalRefs$5.colors.primary.light,
|
|
10220
10218
|
},
|
|
10221
10219
|
},
|
|
10222
10220
|
secondary: {
|
|
10223
|
-
[vars$
|
|
10221
|
+
[vars$7.textColor]: globalRefs$5.colors.secondary.main,
|
|
10224
10222
|
_bordered: {
|
|
10225
|
-
[vars$
|
|
10223
|
+
[vars$7.borderColor]: globalRefs$5.colors.secondary.light,
|
|
10226
10224
|
},
|
|
10227
10225
|
},
|
|
10228
10226
|
error: {
|
|
10229
|
-
[vars$
|
|
10227
|
+
[vars$7.textColor]: globalRefs$5.colors.error.main,
|
|
10230
10228
|
_bordered: {
|
|
10231
|
-
[vars$
|
|
10229
|
+
[vars$7.borderColor]: globalRefs$5.colors.error.light,
|
|
10232
10230
|
},
|
|
10233
10231
|
},
|
|
10234
10232
|
success: {
|
|
10235
|
-
[vars$
|
|
10233
|
+
[vars$7.textColor]: globalRefs$5.colors.success.main,
|
|
10236
10234
|
_bordered: {
|
|
10237
|
-
[vars$
|
|
10235
|
+
[vars$7.borderColor]: globalRefs$5.colors.success.light,
|
|
10238
10236
|
},
|
|
10239
10237
|
},
|
|
10240
10238
|
},
|
|
10241
10239
|
};
|
|
10242
10240
|
|
|
10243
|
-
var badge$
|
|
10241
|
+
var badge$3 = /*#__PURE__*/Object.freeze({
|
|
10244
10242
|
__proto__: null,
|
|
10245
|
-
default: badge$
|
|
10246
|
-
vars: vars$
|
|
10243
|
+
default: badge$2,
|
|
10244
|
+
vars: vars$7
|
|
10247
10245
|
});
|
|
10248
10246
|
|
|
10249
|
-
const componentName$
|
|
10250
|
-
class RawAvatar extends createBaseClass({ componentName: componentName$
|
|
10247
|
+
const componentName$8 = getComponentName('avatar');
|
|
10248
|
+
class RawAvatar extends createBaseClass({ componentName: componentName$8, baseSelector: ':host > .wrapper' }) {
|
|
10251
10249
|
constructor() {
|
|
10252
10250
|
super();
|
|
10253
10251
|
|
|
@@ -10322,7 +10320,7 @@ class RawAvatar extends createBaseClass({ componentName: componentName$7, baseSe
|
|
|
10322
10320
|
}
|
|
10323
10321
|
}
|
|
10324
10322
|
|
|
10325
|
-
const { host: host$
|
|
10323
|
+
const { host: host$4, editableBadge, avatar: avatar$2 } = {
|
|
10326
10324
|
host: { selector: () => ':host' },
|
|
10327
10325
|
editableBadge: { selector: '> .editableBadge' },
|
|
10328
10326
|
avatar: { selector: 'vaadin-avatar' },
|
|
@@ -10331,10 +10329,10 @@ const { host: host$3, editableBadge, avatar: avatar$2 } = {
|
|
|
10331
10329
|
const AvatarClass = compose(
|
|
10332
10330
|
createStyleMixin({
|
|
10333
10331
|
mappings: {
|
|
10334
|
-
hostWidth: { ...host$
|
|
10335
|
-
hostHeight: { ...host$
|
|
10336
|
-
cursor: [avatar$2, host$
|
|
10337
|
-
hostDirection: { ...host$
|
|
10332
|
+
hostWidth: { ...host$4, property: 'width' },
|
|
10333
|
+
hostHeight: { ...host$4, property: 'height' },
|
|
10334
|
+
cursor: [avatar$2, host$4],
|
|
10335
|
+
hostDirection: { ...host$4, property: 'direction' },
|
|
10338
10336
|
avatarTextColor: { ...avatar$2, property: 'color' },
|
|
10339
10337
|
avatarBackgroundColor: { ...avatar$2, property: 'background-color' },
|
|
10340
10338
|
editableIconColor: { ...editableBadge, property: 'color' },
|
|
@@ -10346,16 +10344,16 @@ const AvatarClass = compose(
|
|
|
10346
10344
|
componentNameValidationMixin
|
|
10347
10345
|
)(RawAvatar);
|
|
10348
10346
|
|
|
10349
|
-
const globalRefs$
|
|
10347
|
+
const globalRefs$4 = getThemeRefs(globals);
|
|
10350
10348
|
const compVars = AvatarClass.cssVarList;
|
|
10351
10349
|
|
|
10352
10350
|
const avatar = {
|
|
10353
|
-
[compVars.hostDirection]: globalRefs$
|
|
10354
|
-
[compVars.editableIconColor]: globalRefs$
|
|
10355
|
-
[compVars.editableBorderColor]: globalRefs$
|
|
10356
|
-
[compVars.editableBackgroundColor]: globalRefs$
|
|
10357
|
-
[compVars.avatarTextColor]: globalRefs$
|
|
10358
|
-
[compVars.avatarBackgroundColor]: globalRefs$
|
|
10351
|
+
[compVars.hostDirection]: globalRefs$4.direction,
|
|
10352
|
+
[compVars.editableIconColor]: globalRefs$4.colors.surface.dark,
|
|
10353
|
+
[compVars.editableBorderColor]: globalRefs$4.colors.surface.dark,
|
|
10354
|
+
[compVars.editableBackgroundColor]: globalRefs$4.colors.surface.main,
|
|
10355
|
+
[compVars.avatarTextColor]: globalRefs$4.colors.surface.main,
|
|
10356
|
+
[compVars.avatarBackgroundColor]: globalRefs$4.colors.surface.dark,
|
|
10359
10357
|
|
|
10360
10358
|
_editable: {
|
|
10361
10359
|
[compVars.cursor]: 'pointer',
|
|
@@ -10381,21 +10379,21 @@ const avatar = {
|
|
|
10381
10379
|
},
|
|
10382
10380
|
};
|
|
10383
10381
|
|
|
10384
|
-
const vars$
|
|
10382
|
+
const vars$6 = {
|
|
10385
10383
|
...compVars,
|
|
10386
10384
|
};
|
|
10387
10385
|
|
|
10388
10386
|
var avatar$1 = /*#__PURE__*/Object.freeze({
|
|
10389
10387
|
__proto__: null,
|
|
10390
10388
|
default: avatar,
|
|
10391
|
-
vars: vars$
|
|
10389
|
+
vars: vars$6
|
|
10392
10390
|
});
|
|
10393
10391
|
|
|
10394
|
-
const componentName$
|
|
10392
|
+
const componentName$7 = getComponentName('mappings-field-internal');
|
|
10395
10393
|
|
|
10396
|
-
createBaseInputClass({ componentName: componentName$
|
|
10394
|
+
createBaseInputClass({ componentName: componentName$7, baseSelector: 'div' });
|
|
10397
10395
|
|
|
10398
|
-
const componentName$
|
|
10396
|
+
const componentName$6 = getComponentName('mappings-field');
|
|
10399
10397
|
|
|
10400
10398
|
const customMixin$1 = (superclass) =>
|
|
10401
10399
|
class MappingsFieldMixinClass extends superclass {
|
|
@@ -10424,14 +10422,14 @@ const customMixin$1 = (superclass) =>
|
|
|
10424
10422
|
const template = document.createElement('template');
|
|
10425
10423
|
|
|
10426
10424
|
template.innerHTML = `
|
|
10427
|
-
<${componentName$
|
|
10425
|
+
<${componentName$7}
|
|
10428
10426
|
tabindex="-1"
|
|
10429
|
-
></${componentName$
|
|
10427
|
+
></${componentName$7}>
|
|
10430
10428
|
`;
|
|
10431
10429
|
|
|
10432
10430
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
|
10433
10431
|
|
|
10434
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
|
10432
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$7);
|
|
10435
10433
|
|
|
10436
10434
|
forwardAttrs(this, this.inputElement, {
|
|
10437
10435
|
includeAttrs: [
|
|
@@ -10458,7 +10456,7 @@ const customMixin$1 = (superclass) =>
|
|
|
10458
10456
|
};
|
|
10459
10457
|
|
|
10460
10458
|
const {
|
|
10461
|
-
host: host$
|
|
10459
|
+
host: host$3,
|
|
10462
10460
|
helperText,
|
|
10463
10461
|
errorMessage,
|
|
10464
10462
|
mappingItem,
|
|
@@ -10486,10 +10484,10 @@ const {
|
|
|
10486
10484
|
const MappingsFieldClass = compose(
|
|
10487
10485
|
createStyleMixin({
|
|
10488
10486
|
mappings: {
|
|
10489
|
-
hostWidth: { ...host$
|
|
10490
|
-
hostDirection: { ...host$
|
|
10487
|
+
hostWidth: { ...host$3, property: 'width' },
|
|
10488
|
+
hostDirection: { ...host$3, property: 'direction' },
|
|
10491
10489
|
// we apply font-size also on the host so we can set its width with em
|
|
10492
|
-
fontSize: [{}, host$
|
|
10490
|
+
fontSize: [{}, host$3, { ...separator, property: 'margin-top' }],
|
|
10493
10491
|
fontFamily: [helperText, errorMessage, labels],
|
|
10494
10492
|
separatorFontSize: { ...separator, property: 'font-size' },
|
|
10495
10493
|
labelsFontSize: { ...labelsText, property: 'font-size' },
|
|
@@ -10560,51 +10558,47 @@ const MappingsFieldClass = compose(
|
|
|
10560
10558
|
'options',
|
|
10561
10559
|
'error-message',
|
|
10562
10560
|
],
|
|
10563
|
-
componentName: componentName$
|
|
10561
|
+
componentName: componentName$6,
|
|
10564
10562
|
})
|
|
10565
10563
|
);
|
|
10566
10564
|
|
|
10567
|
-
const globalRefs$
|
|
10565
|
+
const globalRefs$3 = getThemeRefs(globals);
|
|
10568
10566
|
|
|
10569
|
-
const vars$
|
|
10567
|
+
const vars$5 = MappingsFieldClass.cssVarList;
|
|
10570
10568
|
|
|
10571
10569
|
const mappingsField = {
|
|
10572
|
-
[vars$
|
|
10573
|
-
[vars$
|
|
10574
|
-
[vars$
|
|
10575
|
-
[vars$
|
|
10576
|
-
[vars$
|
|
10577
|
-
[vars$
|
|
10578
|
-
[vars$
|
|
10579
|
-
[vars$
|
|
10580
|
-
[vars$
|
|
10581
|
-
[vars$
|
|
10570
|
+
[vars$5.hostWidth]: refs.width,
|
|
10571
|
+
[vars$5.hostDirection]: refs.direction,
|
|
10572
|
+
[vars$5.fontSize]: refs.fontSize,
|
|
10573
|
+
[vars$5.fontFamily]: refs.fontFamily,
|
|
10574
|
+
[vars$5.separatorFontSize]: '14px',
|
|
10575
|
+
[vars$5.labelsFontSize]: '14px',
|
|
10576
|
+
[vars$5.labelsLineHeight]: '1',
|
|
10577
|
+
[vars$5.labelsMarginBottom]: '6px',
|
|
10578
|
+
[vars$5.labelTextColor]: refs.labelTextColor,
|
|
10579
|
+
[vars$5.itemMarginBottom]: '1em',
|
|
10582
10580
|
// To be positioned correctly, the min width has to match the text field min width
|
|
10583
|
-
[vars$
|
|
10581
|
+
[vars$5.valueLabelMinWidth]: refs.minWidth,
|
|
10584
10582
|
// To be positioned correctly, the min width has to match the combo box field min width
|
|
10585
|
-
[vars$
|
|
10586
|
-
[vars$
|
|
10587
|
-
[vars$
|
|
10583
|
+
[vars$5.attrLabelMinWidth]: `calc(12em + 2 * ${globalRefs$3.border.xs})`,
|
|
10584
|
+
[vars$5.separatorWidth]: '70px',
|
|
10585
|
+
[vars$5.removeButtonWidth]: '60px',
|
|
10588
10586
|
};
|
|
10589
10587
|
|
|
10590
10588
|
var mappingsField$1 = /*#__PURE__*/Object.freeze({
|
|
10591
10589
|
__proto__: null,
|
|
10592
10590
|
default: mappingsField,
|
|
10593
10591
|
mappingsField: mappingsField,
|
|
10594
|
-
vars: vars$
|
|
10592
|
+
vars: vars$5
|
|
10595
10593
|
});
|
|
10596
10594
|
|
|
10597
|
-
|
|
10598
|
-
return (new DOMParser().parseFromString("<svg width=\"14\" height=\"18\" viewBox=\"0 0 14 18\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<path d=\"M1 16C1 17.1 1.9 18 3 18H11C12.1 18 13 17.1 13 16V4H1V16ZM3 6H11V16H3V6ZM10.5 1L9.5 0H4.5L3.5 1H0V3H14V1H10.5Z\" fill=\"currentcolor\"/>\n</svg>\n", 'image/svg+xml')).firstChild;
|
|
10599
|
-
}
|
|
10595
|
+
var deleteIcon = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iMTgiIHZpZXdCb3g9IjAgMCAxNCAxOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEgMTZDMSAxNy4xIDEuOSAxOCAzIDE4SDExQzEyLjEgMTggMTMgMTcuMSAxMyAxNlY0SDFWMTZaTTMgNkgxMVYxNkgzVjZaTTEwLjUgMUw5LjUgMEg0LjVMMy41IDFIMFYzSDE0VjFIMTAuNVoiIGZpbGw9ImN1cnJlbnRjb2xvciIvPgo8L3N2Zz4K";
|
|
10600
10596
|
|
|
10601
|
-
|
|
10602
|
-
return (new DOMParser().parseFromString("<svg width=\"15\" height=\"15\" viewBox=\"0 0 15 15\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<path d=\"M10.0002 0.992149C10.0002 1.01615 10.0002 1.01615 10.0002 1.01615L8.22419 3.00815H2.99219C2.46419 3.00815 2.00819 3.44015 2.00819 3.99215V12.0082C2.00819 12.5362 2.44019 12.9922 2.99219 12.9922H5.53619C5.84819 13.0402 6.16019 13.0402 6.47219 12.9922H11.0082C11.5362 12.9922 11.9922 12.5602 11.9922 12.0082V7.78416L13.9362 5.62415L14.0082 5.67215V11.9842C14.0082 13.6642 12.6642 15.0082 11.0082 15.0082H3.01619C1.33619 15.0082 -0.0078125 13.6642 -0.0078125 11.9842V3.99215C-0.0078125 2.33615 1.33619 0.992149 3.01619 0.992149H10.0002ZM11.2722 2.62415L12.6162 4.11215L7.72019 9.68016C7.50419 9.92016 6.83219 10.2322 5.68019 10.6162C5.65619 10.6402 5.60819 10.6402 5.56019 10.6162C5.46419 10.5922 5.39219 10.4722 5.44019 10.3762C5.75219 9.24816 6.04019 8.55216 6.25619 8.31216L11.2722 2.62415ZM11.9202 1.85615L13.2882 0.320149C13.6482 -0.0878516 14.2722 -0.111852 14.6802 0.272149C15.0882 0.632149 15.1122 1.28015 14.7522 1.68815L13.2642 3.36815L11.9202 1.85615Z\" fill=\"currentcolor\"/>\n</svg>\n", 'image/svg+xml')).firstChild;
|
|
10603
|
-
}
|
|
10597
|
+
var editIcon = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTUiIGhlaWdodD0iMTUiIHZpZXdCb3g9IjAgMCAxNSAxNSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEwLjAwMDIgMC45OTIxNDlDMTAuMDAwMiAxLjAxNjE1IDEwLjAwMDIgMS4wMTYxNSAxMC4wMDAyIDEuMDE2MTVMOC4yMjQxOSAzLjAwODE1SDIuOTkyMTlDMi40NjQxOSAzLjAwODE1IDIuMDA4MTkgMy40NDAxNSAyLjAwODE5IDMuOTkyMTVWMTIuMDA4MkMyLjAwODE5IDEyLjUzNjIgMi40NDAxOSAxMi45OTIyIDIuOTkyMTkgMTIuOTkyMkg1LjUzNjE5QzUuODQ4MTkgMTMuMDQwMiA2LjE2MDE5IDEzLjA0MDIgNi40NzIxOSAxMi45OTIySDExLjAwODJDMTEuNTM2MiAxMi45OTIyIDExLjk5MjIgMTIuNTYwMiAxMS45OTIyIDEyLjAwODJWNy43ODQxNkwxMy45MzYyIDUuNjI0MTVMMTQuMDA4MiA1LjY3MjE1VjExLjk4NDJDMTQuMDA4MiAxMy42NjQyIDEyLjY2NDIgMTUuMDA4MiAxMS4wMDgyIDE1LjAwODJIMy4wMTYxOUMxLjMzNjE5IDE1LjAwODIgLTAuMDA3ODEyNSAxMy42NjQyIC0wLjAwNzgxMjUgMTEuOTg0MlYzLjk5MjE1Qy0wLjAwNzgxMjUgMi4zMzYxNSAxLjMzNjE5IDAuOTkyMTQ5IDMuMDE2MTkgMC45OTIxNDlIMTAuMDAwMlpNMTEuMjcyMiAyLjYyNDE1TDEyLjYxNjIgNC4xMTIxNUw3LjcyMDE5IDkuNjgwMTZDNy41MDQxOSA5LjkyMDE2IDYuODMyMTkgMTAuMjMyMiA1LjY4MDE5IDEwLjYxNjJDNS42NTYxOSAxMC42NDAyIDUuNjA4MTkgMTAuNjQwMiA1LjU2MDE5IDEwLjYxNjJDNS40NjQxOSAxMC41OTIyIDUuMzkyMTkgMTAuNDcyMiA1LjQ0MDE5IDEwLjM3NjJDNS43NTIxOSA5LjI0ODE2IDYuMDQwMTkgOC41NTIxNiA2LjI1NjE5IDguMzEyMTZMMTEuMjcyMiAyLjYyNDE1Wk0xMS45MjAyIDEuODU2MTVMMTMuMjg4MiAwLjMyMDE0OUMxMy42NDgyIC0wLjA4Nzg1MTYgMTQuMjcyMiAtMC4xMTE4NTIgMTQuNjgwMiAwLjI3MjE0OUMxNS4wODgyIDAuNjMyMTQ5IDE1LjExMjIgMS4yODAxNSAxNC43NTIyIDEuNjg4MTVMMTMuMjY0MiAzLjM2ODE1TDExLjkyMDIgMS44NTYxNVoiIGZpbGw9ImN1cnJlbnRjb2xvciIvPgo8L3N2Zz4K";
|
|
10604
10598
|
|
|
10605
|
-
const componentName$
|
|
10599
|
+
const componentName$5 = getComponentName('user-attribute');
|
|
10606
10600
|
class RawUserAttribute extends createBaseClass({
|
|
10607
|
-
componentName: componentName$
|
|
10601
|
+
componentName: componentName$5,
|
|
10608
10602
|
baseSelector: ':host > .root',
|
|
10609
10603
|
}) {
|
|
10610
10604
|
constructor() {
|
|
@@ -10655,6 +10649,10 @@ class RawUserAttribute extends createBaseClass({
|
|
|
10655
10649
|
margin-inline-end: 10px;
|
|
10656
10650
|
}
|
|
10657
10651
|
|
|
10652
|
+
.hidden {
|
|
10653
|
+
visibility: hidden;
|
|
10654
|
+
}
|
|
10655
|
+
|
|
10658
10656
|
descope-text[data-id="label-text"].required:after {
|
|
10659
10657
|
content: '*';
|
|
10660
10658
|
color: var(${TextClass.cssVarList.textColor});
|
|
@@ -10748,6 +10746,7 @@ class RawUserAttribute extends createBaseClass({
|
|
|
10748
10746
|
this.onIsRequiredChange();
|
|
10749
10747
|
this.onBadgeLabelChange();
|
|
10750
10748
|
this.onBadgeTooltipTextChange();
|
|
10749
|
+
this.handleDeleteButtonVisibility();
|
|
10751
10750
|
|
|
10752
10751
|
this.deleteButton.addEventListener('click', () =>
|
|
10753
10752
|
this.dispatchEvent(new CustomEvent('delete-clicked', { bubbles: true, composed: true }))
|
|
@@ -10769,6 +10768,10 @@ class RawUserAttribute extends createBaseClass({
|
|
|
10769
10768
|
].concat(super.observedAttributes);
|
|
10770
10769
|
}
|
|
10771
10770
|
|
|
10771
|
+
handleDeleteButtonVisibility() {
|
|
10772
|
+
this.deleteButton.classList.toggle('hidden', this.isRequired || !this.value);
|
|
10773
|
+
}
|
|
10774
|
+
|
|
10772
10775
|
attributeChangedCallback(name, oldValue, newValue) {
|
|
10773
10776
|
super.attributeChangedCallback?.(name, oldValue, newValue);
|
|
10774
10777
|
|
|
@@ -10787,10 +10790,14 @@ class RawUserAttribute extends createBaseClass({
|
|
|
10787
10790
|
} else if (name === 'badge-tooltip-text') {
|
|
10788
10791
|
this.onBadgeTooltipTextChange();
|
|
10789
10792
|
}
|
|
10793
|
+
|
|
10794
|
+
if (name === 'value' || name === 'required') {
|
|
10795
|
+
this.handleDeleteButtonVisibility();
|
|
10796
|
+
}
|
|
10790
10797
|
}
|
|
10791
10798
|
}
|
|
10792
10799
|
|
|
10793
|
-
const { host: host$
|
|
10800
|
+
const { host: host$2, textFields, buttons: buttons$1, badge: badge$1, labelText, valueText, textWrapper: textWrapper$1 } = {
|
|
10794
10801
|
host: { selector: () => ':host' },
|
|
10795
10802
|
textFields: { selector: 'descope-text' },
|
|
10796
10803
|
valueText: { selector: 'descope-text[data-id="value-text"]' },
|
|
@@ -10801,44 +10808,259 @@ const { host: host$1, textFields, buttons, badge, labelText, valueText, textWrap
|
|
|
10801
10808
|
};
|
|
10802
10809
|
|
|
10803
10810
|
const UserAttributeClass = compose(
|
|
10811
|
+
createStyleMixin({
|
|
10812
|
+
mappings: {
|
|
10813
|
+
hostWidth: { ...host$2, property: 'width' },
|
|
10814
|
+
hostMinWidth: { ...host$2, property: 'min-width' },
|
|
10815
|
+
hostDirection: [
|
|
10816
|
+
{ ...host$2, property: 'direction' },
|
|
10817
|
+
{ ...textFields, property: TextClass.cssVarList.hostDirection },
|
|
10818
|
+
{ ...buttons$1, property: ButtonClass.cssVarList.hostDirection },
|
|
10819
|
+
{ ...badge$1, property: BadgeClass.cssVarList.hostDirection },
|
|
10820
|
+
],
|
|
10821
|
+
labelTextWidth: { ...labelText, property: 'width' },
|
|
10822
|
+
valueTextWidth: { ...valueText, property: 'width' },
|
|
10823
|
+
badgeMaxWidth: { ...badge$1, property: 'max-width' },
|
|
10824
|
+
itemsGap: [{ property: 'gap' }, { ...textWrapper$1, property: 'gap' }],
|
|
10825
|
+
},
|
|
10826
|
+
}),
|
|
10827
|
+
draggableMixin,
|
|
10828
|
+
componentNameValidationMixin
|
|
10829
|
+
)(RawUserAttribute);
|
|
10830
|
+
|
|
10831
|
+
const globalRefs$2 = getThemeRefs(globals);
|
|
10832
|
+
const vars$4 = UserAttributeClass.cssVarList;
|
|
10833
|
+
|
|
10834
|
+
const userAttribute = {
|
|
10835
|
+
[vars$4.hostDirection]: globalRefs$2.direction,
|
|
10836
|
+
[vars$4.labelTextWidth]: '150px',
|
|
10837
|
+
[vars$4.valueTextWidth]: '200px',
|
|
10838
|
+
[vars$4.badgeMaxWidth]: '85px',
|
|
10839
|
+
[vars$4.itemsGap]: '16px',
|
|
10840
|
+
[vars$4.hostMinWidth]: '530px',
|
|
10841
|
+
_fullWidth: {
|
|
10842
|
+
[vars$4.hostWidth]: '100%',
|
|
10843
|
+
},
|
|
10844
|
+
};
|
|
10845
|
+
|
|
10846
|
+
var userAttribute$1 = /*#__PURE__*/Object.freeze({
|
|
10847
|
+
__proto__: null,
|
|
10848
|
+
default: userAttribute,
|
|
10849
|
+
vars: vars$4
|
|
10850
|
+
});
|
|
10851
|
+
|
|
10852
|
+
var greenVIcon = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTggMEMzLjYgMCAwIDMuNiAwIDhDMCAxMi40IDMuNiAxNiA4IDE2QzEyLjQgMTYgMTYgMTIuNCAxNiA4QzE2IDMuNiAxMi40IDAgOCAwWk03LjEgMTEuN0wyLjkgNy42TDQuMyA2LjJMNyA4LjlMMTIgNEwxMy40IDUuNEw3LjEgMTEuN1oiIGZpbGw9IiM0Q0FGNTAiLz4KPC9zdmc+Cg==";
|
|
10853
|
+
|
|
10854
|
+
const componentName$4 = getComponentName('user-auth-method');
|
|
10855
|
+
class RawUserAuthMethod extends createBaseClass({
|
|
10856
|
+
componentName: componentName$4,
|
|
10857
|
+
baseSelector: ':host > .root',
|
|
10858
|
+
}) {
|
|
10859
|
+
constructor() {
|
|
10860
|
+
super();
|
|
10861
|
+
|
|
10862
|
+
this.attachShadow({ mode: 'open' }).innerHTML = `
|
|
10863
|
+
<style>
|
|
10864
|
+
:host {
|
|
10865
|
+
display: inline-flex;
|
|
10866
|
+
}
|
|
10867
|
+
|
|
10868
|
+
vaadin-icon {
|
|
10869
|
+
color: currentcolor;
|
|
10870
|
+
}
|
|
10871
|
+
|
|
10872
|
+
.root {
|
|
10873
|
+
display: flex;
|
|
10874
|
+
width: 100%;
|
|
10875
|
+
height: 100%;
|
|
10876
|
+
align-items: center;
|
|
10877
|
+
}
|
|
10878
|
+
|
|
10879
|
+
.btn-wrapper {
|
|
10880
|
+
display: flex;
|
|
10881
|
+
justify-content: space-between;
|
|
10882
|
+
align-items: center;
|
|
10883
|
+
flex-grow: 0;
|
|
10884
|
+
}
|
|
10885
|
+
|
|
10886
|
+
.text-wrapper {
|
|
10887
|
+
display: flex;
|
|
10888
|
+
align-items: center;
|
|
10889
|
+
flex-grow: 1;
|
|
10890
|
+
}
|
|
10891
|
+
|
|
10892
|
+
descope-text::part(text-wrapper) {
|
|
10893
|
+
text-overflow: ellipsis;
|
|
10894
|
+
overflow: hidden;
|
|
10895
|
+
white-space: nowrap;
|
|
10896
|
+
width: initial;
|
|
10897
|
+
}
|
|
10898
|
+
|
|
10899
|
+
descope-text {
|
|
10900
|
+
display: inline-flex;
|
|
10901
|
+
}
|
|
10902
|
+
|
|
10903
|
+
.fulfilled-indicator {
|
|
10904
|
+
width: 1em;
|
|
10905
|
+
height: 1em;
|
|
10906
|
+
display: flex;
|
|
10907
|
+
align-items: center;
|
|
10908
|
+
padding-inline-end: 1em;
|
|
10909
|
+
}
|
|
10910
|
+
|
|
10911
|
+
.hidden {
|
|
10912
|
+
display: none;
|
|
10913
|
+
}
|
|
10914
|
+
|
|
10915
|
+
.hidden-btn {
|
|
10916
|
+
width: 0;
|
|
10917
|
+
}
|
|
10918
|
+
|
|
10919
|
+
slot[name="method-icon"]{
|
|
10920
|
+
display: inline-flex;
|
|
10921
|
+
align-items: center;
|
|
10922
|
+
}
|
|
10923
|
+
</style>
|
|
10924
|
+
|
|
10925
|
+
|
|
10926
|
+
<div class="root">
|
|
10927
|
+
<div class="text-wrapper">
|
|
10928
|
+
<slot name="method-icon"></slot>
|
|
10929
|
+
<descope-text st-text-align="auto" data-id="label-text" variant="body1" mode="primary"></descope-text>
|
|
10930
|
+
</div>
|
|
10931
|
+
|
|
10932
|
+
<div class="btn-wrapper">
|
|
10933
|
+
<descope-button size="sm" variant="link" mode="primary">
|
|
10934
|
+
<slot name="button-icon"></slot>
|
|
10935
|
+
</descope-button>
|
|
10936
|
+
<div class="fulfilled-indicator">
|
|
10937
|
+
<vaadin-icon src=${greenVIcon}></vaadin-icon>
|
|
10938
|
+
</div>
|
|
10939
|
+
<descope-button class="hidden-btn"size="sm" variant="link" mode="primary"></descope-button>
|
|
10940
|
+
</div>
|
|
10941
|
+
</div>
|
|
10942
|
+
`;
|
|
10943
|
+
|
|
10944
|
+
this.button = this.shadowRoot.querySelector('descope-button');
|
|
10945
|
+
this.fulfilledIndicator = this.shadowRoot.querySelector('.fulfilled-indicator');
|
|
10946
|
+
this.labelText = this.shadowRoot.querySelector('descope-text[data-id="label-text"]');
|
|
10947
|
+
}
|
|
10948
|
+
|
|
10949
|
+
onLabelChange() {
|
|
10950
|
+
this.labelText.innerText = this.label;
|
|
10951
|
+
this.labelText.setAttribute('title', this.label);
|
|
10952
|
+
}
|
|
10953
|
+
|
|
10954
|
+
onButtonLabelChange() {
|
|
10955
|
+
let textSpanEle = this.button.querySelector('span');
|
|
10956
|
+
|
|
10957
|
+
if (this.buttonLabel) {
|
|
10958
|
+
if (!textSpanEle) {
|
|
10959
|
+
textSpanEle = document.createElement('span');
|
|
10960
|
+
this.button.appendChild(textSpanEle);
|
|
10961
|
+
}
|
|
10962
|
+
textSpanEle.innerText = this.buttonLabel;
|
|
10963
|
+
} else if (textSpanEle) {
|
|
10964
|
+
this.button.removeChild(textSpanEle);
|
|
10965
|
+
}
|
|
10966
|
+
}
|
|
10967
|
+
|
|
10968
|
+
onFulfilledChange() {
|
|
10969
|
+
this.button.classList.toggle('hidden', this.isFulfilled);
|
|
10970
|
+
this.fulfilledIndicator.classList.toggle('hidden', !this.isFulfilled);
|
|
10971
|
+
}
|
|
10972
|
+
|
|
10973
|
+
get label() {
|
|
10974
|
+
return this.getAttribute('label') || '';
|
|
10975
|
+
}
|
|
10976
|
+
|
|
10977
|
+
get buttonLabel() {
|
|
10978
|
+
return this.getAttribute('button-label') || '';
|
|
10979
|
+
}
|
|
10980
|
+
|
|
10981
|
+
get isFulfilled() {
|
|
10982
|
+
return this.getAttribute('fulfilled') === 'true';
|
|
10983
|
+
}
|
|
10984
|
+
|
|
10985
|
+
init() {
|
|
10986
|
+
this.onLabelChange();
|
|
10987
|
+
this.onButtonLabelChange();
|
|
10988
|
+
this.onFulfilledChange();
|
|
10989
|
+
|
|
10990
|
+
this.button.addEventListener('click', () =>
|
|
10991
|
+
this.dispatchEvent(new CustomEvent('button-clicked', { bubbles: true, composed: true }))
|
|
10992
|
+
);
|
|
10993
|
+
}
|
|
10994
|
+
|
|
10995
|
+
static get observedAttributes() {
|
|
10996
|
+
return ['label', 'fulfilled'].concat(super.observedAttributes);
|
|
10997
|
+
}
|
|
10998
|
+
|
|
10999
|
+
attributeChangedCallback(name, oldValue, newValue) {
|
|
11000
|
+
super.attributeChangedCallback?.(name, oldValue, newValue);
|
|
11001
|
+
if (oldValue === newValue) {
|
|
11002
|
+
return;
|
|
11003
|
+
}
|
|
11004
|
+
|
|
11005
|
+
if (name === 'label') {
|
|
11006
|
+
this.onLabelChange();
|
|
11007
|
+
} else if (name === 'fulfilled') {
|
|
11008
|
+
this.onFulfilledChange();
|
|
11009
|
+
} else if (name === 'button-label') {
|
|
11010
|
+
this.onButtonLabelChange();
|
|
11011
|
+
}
|
|
11012
|
+
}
|
|
11013
|
+
}
|
|
11014
|
+
|
|
11015
|
+
const { host: host$1, textField, buttons, badge, textWrapper, methodIconSlot } = {
|
|
11016
|
+
host: { selector: () => ':host' },
|
|
11017
|
+
textField: { selector: 'descope-text' },
|
|
11018
|
+
buttons: { selector: 'descope-button' },
|
|
11019
|
+
badge: { selector: 'descope-badge' },
|
|
11020
|
+
textWrapper: { selector: ' .text-wrapper' },
|
|
11021
|
+
methodIconSlot: { selector: 'slot[name="method-icon"]' },
|
|
11022
|
+
};
|
|
11023
|
+
|
|
11024
|
+
const UserAuthMethodClass = compose(
|
|
10804
11025
|
createStyleMixin({
|
|
10805
11026
|
mappings: {
|
|
10806
11027
|
hostWidth: { ...host$1, property: 'width' },
|
|
10807
11028
|
hostMinWidth: { ...host$1, property: 'min-width' },
|
|
10808
11029
|
hostDirection: [
|
|
10809
11030
|
{ ...host$1, property: 'direction' },
|
|
10810
|
-
{ ...
|
|
11031
|
+
{ ...textField, property: TextClass.cssVarList.hostDirection },
|
|
10811
11032
|
{ ...buttons, property: ButtonClass.cssVarList.hostDirection },
|
|
10812
11033
|
{ ...badge, property: BadgeClass.cssVarList.hostDirection },
|
|
10813
11034
|
],
|
|
10814
|
-
labelTextWidth: { ...
|
|
10815
|
-
valueTextWidth: { ...valueText, property: 'width' },
|
|
10816
|
-
badgeMaxWidth: { ...badge, property: 'max-width' },
|
|
11035
|
+
labelTextWidth: { ...textField, property: 'width' },
|
|
10817
11036
|
itemsGap: [{ property: 'gap' }, { ...textWrapper, property: 'gap' }],
|
|
11037
|
+
iconSize: [
|
|
11038
|
+
{ ...methodIconSlot, property: 'width' },
|
|
11039
|
+
{ ...methodIconSlot, property: 'height' },
|
|
11040
|
+
],
|
|
10818
11041
|
},
|
|
10819
11042
|
}),
|
|
10820
11043
|
draggableMixin,
|
|
10821
11044
|
componentNameValidationMixin
|
|
10822
|
-
)(
|
|
11045
|
+
)(RawUserAuthMethod);
|
|
10823
11046
|
|
|
10824
11047
|
const globalRefs$1 = getThemeRefs(globals);
|
|
10825
|
-
const vars$3 =
|
|
11048
|
+
const vars$3 = UserAuthMethodClass.cssVarList;
|
|
10826
11049
|
|
|
10827
|
-
const
|
|
11050
|
+
const userAuthMethod = {
|
|
10828
11051
|
[vars$3.hostDirection]: globalRefs$1.direction,
|
|
10829
|
-
[vars$3.labelTextWidth]: '
|
|
10830
|
-
[vars$3.valueTextWidth]: '200px',
|
|
10831
|
-
[vars$3.badgeMaxWidth]: '85px',
|
|
11052
|
+
[vars$3.labelTextWidth]: '200px',
|
|
10832
11053
|
[vars$3.itemsGap]: '16px',
|
|
10833
11054
|
[vars$3.hostMinWidth]: '530px',
|
|
11055
|
+
[vars$3.iconSize]: '24px',
|
|
10834
11056
|
_fullWidth: {
|
|
10835
11057
|
[vars$3.hostWidth]: '100%',
|
|
10836
11058
|
},
|
|
10837
11059
|
};
|
|
10838
11060
|
|
|
10839
|
-
var
|
|
11061
|
+
var userAuthMethod$1 = /*#__PURE__*/Object.freeze({
|
|
10840
11062
|
__proto__: null,
|
|
10841
|
-
default:
|
|
11063
|
+
default: userAuthMethod,
|
|
10842
11064
|
vars: vars$3
|
|
10843
11065
|
});
|
|
10844
11066
|
|
|
@@ -10989,7 +11211,7 @@ var policyValidation$1 = /*#__PURE__*/Object.freeze({
|
|
|
10989
11211
|
|
|
10990
11212
|
const components = {
|
|
10991
11213
|
button: button$1,
|
|
10992
|
-
textField: textField$
|
|
11214
|
+
textField: textField$2,
|
|
10993
11215
|
password: password$1,
|
|
10994
11216
|
numberField: numberField$1,
|
|
10995
11217
|
emailField: emailField$1,
|
|
@@ -11020,10 +11242,11 @@ const components = {
|
|
|
11020
11242
|
grid: grid$1,
|
|
11021
11243
|
notificationCard,
|
|
11022
11244
|
multiSelectComboBox: multiSelectComboBox$1,
|
|
11023
|
-
badge: badge$
|
|
11245
|
+
badge: badge$3,
|
|
11024
11246
|
avatar: avatar$1,
|
|
11025
11247
|
mappingsField: mappingsField$1,
|
|
11026
11248
|
userAttribute: userAttribute$1,
|
|
11249
|
+
userAuthMethod: userAuthMethod$1,
|
|
11027
11250
|
samlGroupMappings: samlGroupMappings$1,
|
|
11028
11251
|
policyValidation: policyValidation$1,
|
|
11029
11252
|
};
|
|
@@ -11038,7 +11261,7 @@ const vars = Object.keys(components).reduce(
|
|
|
11038
11261
|
);
|
|
11039
11262
|
|
|
11040
11263
|
const defaultTheme = { globals, components: theme };
|
|
11041
|
-
const themeVars = { globals: vars$
|
|
11264
|
+
const themeVars = { globals: vars$E, components: vars };
|
|
11042
11265
|
|
|
11043
11266
|
const colors = {
|
|
11044
11267
|
surface: {
|
|
@@ -11377,6 +11600,7 @@ exports.TextFieldClass = TextFieldClass;
|
|
|
11377
11600
|
exports.TotpImageClass = TotpImageClass;
|
|
11378
11601
|
exports.UploadFileClass = UploadFileClass;
|
|
11379
11602
|
exports.UserAttributeClass = UserAttributeClass;
|
|
11603
|
+
exports.UserAuthMethodClass = UserAuthMethodClass;
|
|
11380
11604
|
exports.componentsThemeManager = componentsThemeManager;
|
|
11381
11605
|
exports.createComponentsTheme = createComponentsTheme;
|
|
11382
11606
|
exports.createHelperVars = createHelperVars;
|