@descope/web-components-ui 1.0.389 → 1.0.391
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/cjs/index.cjs.js +1448 -1279
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/index.esm.js +1415 -1245
- package/dist/index.esm.js.map +1 -1
- package/dist/umd/4619.js +1 -1
- package/dist/umd/DescopeDev.js +1 -1
- package/dist/umd/button-selection-group-fields-descope-button-multi-selection-group-index-js.js +1 -1
- package/dist/umd/button-selection-group-fields-descope-button-selection-group-index-js.js +1 -1
- package/dist/umd/button-selection-group-fields-descope-button-selection-group-item-index-js.js +1 -1
- package/dist/umd/descope-button-index-js.js +1 -1
- package/dist/umd/descope-date-field-descope-calendar-index-js.js +1 -1
- package/dist/umd/descope-email-field-index-js.js +1 -1
- package/dist/umd/descope-grid-descope-grid-custom-column-index-js.js +1 -1
- package/dist/umd/descope-grid-descope-grid-item-details-column-index-js.js +3 -3
- package/dist/umd/descope-grid-descope-grid-text-column-index-js.js +1 -1
- package/dist/umd/descope-icon-index-js.js +1 -1
- package/dist/umd/descope-logo-index-js.js +1 -1
- package/dist/umd/descope-third-party-app-logo-index-js.js +1 -0
- package/dist/umd/descope-upload-file-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 -1
- package/dist/umd/index.js +1 -1
- package/dist/umd/mapping-fields-descope-mappings-field-index-js.js +1 -1
- package/package.json +1 -1
- package/src/components/descope-email-field/EmailFieldClass.js +1 -1
- package/src/components/descope-icon/helpers.js +2 -2
- package/src/components/descope-third-party-app-logo/ThirdPartyAppLogoClass.js +102 -0
- package/src/components/descope-third-party-app-logo/arrows.svg +4 -0
- package/src/components/descope-third-party-app-logo/index.js +7 -0
- package/src/helpers/index.js +8 -2
- package/src/index.cjs.js +1 -0
- package/src/index.js +1 -0
- package/src/mixins/createStyleMixin/helpers.js +32 -6
- package/src/mixins/createStyleMixin/index.js +1 -1
- package/src/theme/components/index.js +2 -0
- package/src/theme/components/thirdPartyAppLogo.js +36 -0
package/dist/cjs/index.cjs.js
CHANGED
|
@@ -21,6 +21,14 @@ const kebabCase = (str) =>
|
|
|
21
21
|
|
|
22
22
|
const kebabCaseJoin = (...args) => kebabCase(args.filter((arg) => !!arg).join('-'));
|
|
23
23
|
|
|
24
|
+
const upperFirst = (str) => str.charAt(0).toUpperCase() + str.slice(1);
|
|
25
|
+
|
|
26
|
+
const camelCaseJoin = (...args) =>
|
|
27
|
+
args
|
|
28
|
+
.filter(Boolean)
|
|
29
|
+
.map((arg, index) => (index === 0 ? arg : upperFirst(arg)))
|
|
30
|
+
.join('');
|
|
31
|
+
|
|
24
32
|
const compose =
|
|
25
33
|
(...fns) =>
|
|
26
34
|
(val) =>
|
|
@@ -643,7 +651,7 @@ const globals = {
|
|
|
643
651
|
fonts,
|
|
644
652
|
direction,
|
|
645
653
|
};
|
|
646
|
-
const vars$
|
|
654
|
+
const vars$Q = getThemeVars(globals);
|
|
647
655
|
|
|
648
656
|
const createCssVar = (varName, fallback) => `var(${varName}${fallback ? `, ${fallback}` : ''})`;
|
|
649
657
|
|
|
@@ -690,8 +698,17 @@ const normalizeConfig = (attr, config) => {
|
|
|
690
698
|
return [{ ...defaultMapping, ...config }];
|
|
691
699
|
};
|
|
692
700
|
|
|
701
|
+
const getFallbackVarName = (origVarName, suffix = 'fallback') => kebabCaseJoin(origVarName, suffix);
|
|
702
|
+
|
|
693
703
|
const createStyle = (componentName, baseSelector, mappings) => {
|
|
694
704
|
const style = new StyleBuilder();
|
|
705
|
+
const createFallbackVar = (fallback, origVarName) => {
|
|
706
|
+
if (!fallback) return '';
|
|
707
|
+
if (typeof fallback === 'string') return fallback;
|
|
708
|
+
|
|
709
|
+
const fallbackVarName = getFallbackVarName(origVarName, fallback?.suffix);
|
|
710
|
+
return createCssVar(fallbackVarName, createFallbackVar(fallback.fallback, fallbackVarName));
|
|
711
|
+
};
|
|
695
712
|
|
|
696
713
|
Object.keys(mappings).forEach((attr) => {
|
|
697
714
|
const attrConfig = normalizeConfig(attr, mappings[attr]);
|
|
@@ -700,10 +717,11 @@ const createStyle = (componentName, baseSelector, mappings) => {
|
|
|
700
717
|
|
|
701
718
|
attrConfig.forEach(
|
|
702
719
|
({ selector: relativeSelectorOrSelectorFn, property, important, fallback }) => {
|
|
720
|
+
const fallbackValue = createFallbackVar(fallback, cssVarName);
|
|
703
721
|
style.add(
|
|
704
722
|
createCssSelector(baseSelector, relativeSelectorOrSelectorFn),
|
|
705
723
|
isFunction(property) ? property() : property,
|
|
706
|
-
createCssVar(cssVarName,
|
|
724
|
+
createCssVar(cssVarName, fallbackValue) + (important ? '!important' : '')
|
|
707
725
|
);
|
|
708
726
|
}
|
|
709
727
|
);
|
|
@@ -712,11 +730,27 @@ const createStyle = (componentName, baseSelector, mappings) => {
|
|
|
712
730
|
return style.toString();
|
|
713
731
|
};
|
|
714
732
|
|
|
733
|
+
const getFallbackVarsNames = (attr, origVarName, { fallback }) => {
|
|
734
|
+
if (!fallback) return {};
|
|
735
|
+
|
|
736
|
+
const fallbackVarName = getFallbackVarName(origVarName, fallback.suffix);
|
|
737
|
+
const fallbackAttrName = camelCaseJoin(attr, fallback.suffix || 'fallback');
|
|
738
|
+
return {
|
|
739
|
+
[fallbackAttrName]: fallbackVarName,
|
|
740
|
+
...getFallbackVarsNames(fallbackAttrName, fallbackVarName, fallback),
|
|
741
|
+
};
|
|
742
|
+
};
|
|
743
|
+
|
|
715
744
|
const createCssVarsList = (componentName, mappings) =>
|
|
716
|
-
Object.keys(mappings).reduce(
|
|
717
|
-
|
|
718
|
-
|
|
719
|
-
|
|
745
|
+
Object.keys(mappings).reduce((acc, attr) => {
|
|
746
|
+
const varName = getCssVarName(componentName, attr);
|
|
747
|
+
|
|
748
|
+
return Object.assign(
|
|
749
|
+
acc,
|
|
750
|
+
{ [attr]: varName },
|
|
751
|
+
getFallbackVarsNames(attr, varName, mappings[attr])
|
|
752
|
+
);
|
|
753
|
+
}, {});
|
|
720
754
|
|
|
721
755
|
// on some cases we need a selector to be more specific than another
|
|
722
756
|
// for this we have this fn that generate a class selector multiple times
|
|
@@ -773,7 +807,7 @@ const createStyleMixin =
|
|
|
773
807
|
this.#baseSelector = baseSelector ?? this.baseSelector;
|
|
774
808
|
this.#getRootElement = getRootElement;
|
|
775
809
|
|
|
776
|
-
this.#styleAttributes = Object.keys(
|
|
810
|
+
this.#styleAttributes = Object.keys(CustomStyleMixinClass.cssVarList).map((key) =>
|
|
777
811
|
kebabCaseJoin(STYLE_OVERRIDE_ATTR_PREFIX, componentNameSuffix, key)
|
|
778
812
|
);
|
|
779
813
|
}
|
|
@@ -2924,8 +2958,8 @@ const createIcon = async (src) => {
|
|
|
2924
2958
|
ele = createImgEle(src);
|
|
2925
2959
|
}
|
|
2926
2960
|
|
|
2927
|
-
ele.style.setProperty('width', '100%');
|
|
2928
|
-
ele.style.setProperty('height', '100%');
|
|
2961
|
+
ele.style.setProperty('max-width', '100%');
|
|
2962
|
+
ele.style.setProperty('max-height', '100%');
|
|
2929
2963
|
|
|
2930
2964
|
return ele;
|
|
2931
2965
|
} catch {
|
|
@@ -2935,9 +2969,9 @@ const createIcon = async (src) => {
|
|
|
2935
2969
|
|
|
2936
2970
|
/* eslint-disable no-use-before-define */
|
|
2937
2971
|
|
|
2938
|
-
const componentName$
|
|
2972
|
+
const componentName$Z = getComponentName('icon');
|
|
2939
2973
|
|
|
2940
|
-
class RawIcon extends createBaseClass({ componentName: componentName$
|
|
2974
|
+
class RawIcon extends createBaseClass({ componentName: componentName$Z, baseSelector: 'slot' }) {
|
|
2941
2975
|
static get observedAttributes() {
|
|
2942
2976
|
return ['src'];
|
|
2943
2977
|
}
|
|
@@ -3022,7 +3056,7 @@ const clickableMixin = (superclass) =>
|
|
|
3022
3056
|
}
|
|
3023
3057
|
};
|
|
3024
3058
|
|
|
3025
|
-
const componentName$
|
|
3059
|
+
const componentName$Y = getComponentName('button');
|
|
3026
3060
|
|
|
3027
3061
|
const resetStyles = `
|
|
3028
3062
|
:host {
|
|
@@ -3138,7 +3172,7 @@ const ButtonClass = compose(
|
|
|
3138
3172
|
}
|
|
3139
3173
|
`,
|
|
3140
3174
|
excludeAttrsSync: ['tabindex'],
|
|
3141
|
-
componentName: componentName$
|
|
3175
|
+
componentName: componentName$Y,
|
|
3142
3176
|
})
|
|
3143
3177
|
);
|
|
3144
3178
|
|
|
@@ -3175,31 +3209,31 @@ loadingIndicatorStyles = `
|
|
|
3175
3209
|
}
|
|
3176
3210
|
`;
|
|
3177
3211
|
|
|
3178
|
-
const globalRefs$
|
|
3212
|
+
const globalRefs$y = getThemeRefs(globals);
|
|
3179
3213
|
const compVars$6 = ButtonClass.cssVarList;
|
|
3180
3214
|
|
|
3181
3215
|
const mode = {
|
|
3182
|
-
primary: globalRefs$
|
|
3183
|
-
secondary: globalRefs$
|
|
3184
|
-
success: globalRefs$
|
|
3185
|
-
error: globalRefs$
|
|
3186
|
-
surface: globalRefs$
|
|
3216
|
+
primary: globalRefs$y.colors.primary,
|
|
3217
|
+
secondary: globalRefs$y.colors.secondary,
|
|
3218
|
+
success: globalRefs$y.colors.success,
|
|
3219
|
+
error: globalRefs$y.colors.error,
|
|
3220
|
+
surface: globalRefs$y.colors.surface,
|
|
3187
3221
|
};
|
|
3188
3222
|
|
|
3189
|
-
const [helperTheme$4, helperRefs$4, helperVars$4] = createHelperVars({ mode }, componentName$
|
|
3223
|
+
const [helperTheme$4, helperRefs$4, helperVars$4] = createHelperVars({ mode }, componentName$Y);
|
|
3190
3224
|
|
|
3191
3225
|
const button = {
|
|
3192
3226
|
...helperTheme$4,
|
|
3193
3227
|
|
|
3194
|
-
[compVars$6.fontFamily]: globalRefs$
|
|
3228
|
+
[compVars$6.fontFamily]: globalRefs$y.fonts.font1.family,
|
|
3195
3229
|
|
|
3196
3230
|
[compVars$6.cursor]: 'pointer',
|
|
3197
3231
|
[compVars$6.hostHeight]: '3em',
|
|
3198
3232
|
[compVars$6.hostWidth]: 'auto',
|
|
3199
|
-
[compVars$6.hostDirection]: globalRefs$
|
|
3233
|
+
[compVars$6.hostDirection]: globalRefs$y.direction,
|
|
3200
3234
|
|
|
3201
|
-
[compVars$6.borderRadius]: globalRefs$
|
|
3202
|
-
[compVars$6.borderWidth]: globalRefs$
|
|
3235
|
+
[compVars$6.borderRadius]: globalRefs$y.radius.sm,
|
|
3236
|
+
[compVars$6.borderWidth]: globalRefs$y.border.xs,
|
|
3203
3237
|
[compVars$6.borderStyle]: 'solid',
|
|
3204
3238
|
[compVars$6.borderColor]: 'transparent',
|
|
3205
3239
|
|
|
@@ -3245,11 +3279,11 @@ const button = {
|
|
|
3245
3279
|
},
|
|
3246
3280
|
|
|
3247
3281
|
_disabled: {
|
|
3248
|
-
[helperVars$4.main]: globalRefs$
|
|
3249
|
-
[helperVars$4.dark]: globalRefs$
|
|
3250
|
-
[helperVars$4.light]: globalRefs$
|
|
3251
|
-
[helperVars$4.contrast]: globalRefs$
|
|
3252
|
-
[compVars$6.iconColor]: globalRefs$
|
|
3282
|
+
[helperVars$4.main]: globalRefs$y.colors.surface.light,
|
|
3283
|
+
[helperVars$4.dark]: globalRefs$y.colors.surface.dark,
|
|
3284
|
+
[helperVars$4.light]: globalRefs$y.colors.surface.light,
|
|
3285
|
+
[helperVars$4.contrast]: globalRefs$y.colors.surface.main,
|
|
3286
|
+
[compVars$6.iconColor]: globalRefs$y.colors.surface.main,
|
|
3253
3287
|
},
|
|
3254
3288
|
|
|
3255
3289
|
variant: {
|
|
@@ -3298,7 +3332,7 @@ const button = {
|
|
|
3298
3332
|
},
|
|
3299
3333
|
};
|
|
3300
3334
|
|
|
3301
|
-
const vars$
|
|
3335
|
+
const vars$P = {
|
|
3302
3336
|
...compVars$6,
|
|
3303
3337
|
...helperVars$4,
|
|
3304
3338
|
};
|
|
@@ -3306,7 +3340,7 @@ const vars$O = {
|
|
|
3306
3340
|
var button$1 = /*#__PURE__*/Object.freeze({
|
|
3307
3341
|
__proto__: null,
|
|
3308
3342
|
default: button,
|
|
3309
|
-
vars: vars$
|
|
3343
|
+
vars: vars$P
|
|
3310
3344
|
});
|
|
3311
3345
|
|
|
3312
3346
|
const {
|
|
@@ -3600,7 +3634,7 @@ const inputFloatingLabelStyle = () => {
|
|
|
3600
3634
|
`;
|
|
3601
3635
|
};
|
|
3602
3636
|
|
|
3603
|
-
const componentName$
|
|
3637
|
+
const componentName$X = getComponentName('text-field');
|
|
3604
3638
|
|
|
3605
3639
|
const observedAttrs$2 = ['type', 'label-type', 'copy-to-clipboard'];
|
|
3606
3640
|
|
|
@@ -3722,30 +3756,30 @@ const TextFieldClass = compose(
|
|
|
3722
3756
|
}
|
|
3723
3757
|
`,
|
|
3724
3758
|
excludeAttrsSync: ['tabindex'],
|
|
3725
|
-
componentName: componentName$
|
|
3759
|
+
componentName: componentName$X,
|
|
3726
3760
|
})
|
|
3727
3761
|
);
|
|
3728
3762
|
|
|
3729
|
-
const componentName$
|
|
3730
|
-
const globalRefs$
|
|
3763
|
+
const componentName$W = getComponentName('input-wrapper');
|
|
3764
|
+
const globalRefs$x = getThemeRefs(globals);
|
|
3731
3765
|
|
|
3732
|
-
const [theme$1, refs, vars$
|
|
3766
|
+
const [theme$1, refs, vars$O] = createHelperVars(
|
|
3733
3767
|
{
|
|
3734
|
-
labelTextColor: globalRefs$
|
|
3768
|
+
labelTextColor: globalRefs$x.colors.surface.dark,
|
|
3735
3769
|
labelFontSize: '14px', // not taken from globals as it is fixed in all inputs
|
|
3736
3770
|
labelFontWeight: '500', // not taken from globals as it is fixed in all inputs
|
|
3737
|
-
valueTextColor: globalRefs$
|
|
3738
|
-
placeholderTextColor: globalRefs$
|
|
3771
|
+
valueTextColor: globalRefs$x.colors.surface.contrast,
|
|
3772
|
+
placeholderTextColor: globalRefs$x.colors.surface.dark,
|
|
3739
3773
|
requiredIndicator: "'*'",
|
|
3740
|
-
helperTextColor: globalRefs$
|
|
3741
|
-
errorMessageTextColor: globalRefs$
|
|
3742
|
-
successMessageTextColor: globalRefs$
|
|
3774
|
+
helperTextColor: globalRefs$x.colors.surface.dark,
|
|
3775
|
+
errorMessageTextColor: globalRefs$x.colors.error.main,
|
|
3776
|
+
successMessageTextColor: globalRefs$x.colors.success.main,
|
|
3743
3777
|
|
|
3744
|
-
borderWidth: globalRefs$
|
|
3745
|
-
borderRadius: globalRefs$
|
|
3778
|
+
borderWidth: globalRefs$x.border.xs,
|
|
3779
|
+
borderRadius: globalRefs$x.radius.xs,
|
|
3746
3780
|
borderColor: 'transparent',
|
|
3747
3781
|
|
|
3748
|
-
outlineWidth: globalRefs$
|
|
3782
|
+
outlineWidth: globalRefs$x.border.sm,
|
|
3749
3783
|
outlineStyle: 'solid',
|
|
3750
3784
|
outlineColor: 'transparent',
|
|
3751
3785
|
outlineOffset: '0px', // we need to keep the px unit even for 0 value, as this var is used for calc in different component classes
|
|
@@ -3759,11 +3793,11 @@ const [theme$1, refs, vars$N] = createHelperVars(
|
|
|
3759
3793
|
|
|
3760
3794
|
textAlign: 'start',
|
|
3761
3795
|
|
|
3762
|
-
backgroundColor: globalRefs$
|
|
3796
|
+
backgroundColor: globalRefs$x.colors.surface.main,
|
|
3763
3797
|
|
|
3764
|
-
fontFamily: globalRefs$
|
|
3798
|
+
fontFamily: globalRefs$x.fonts.font1.family,
|
|
3765
3799
|
|
|
3766
|
-
direction: globalRefs$
|
|
3800
|
+
direction: globalRefs$x.direction,
|
|
3767
3801
|
|
|
3768
3802
|
overlayOpacity: '0.3',
|
|
3769
3803
|
|
|
@@ -3817,94 +3851,94 @@ const [theme$1, refs, vars$N] = createHelperVars(
|
|
|
3817
3851
|
},
|
|
3818
3852
|
|
|
3819
3853
|
_focused: {
|
|
3820
|
-
outlineColor: globalRefs$
|
|
3854
|
+
outlineColor: globalRefs$x.colors.surface.light,
|
|
3821
3855
|
_invalid: {
|
|
3822
|
-
outlineColor: globalRefs$
|
|
3856
|
+
outlineColor: globalRefs$x.colors.error.main,
|
|
3823
3857
|
},
|
|
3824
3858
|
},
|
|
3825
3859
|
|
|
3826
3860
|
_bordered: {
|
|
3827
|
-
outlineWidth: globalRefs$
|
|
3828
|
-
borderColor: globalRefs$
|
|
3861
|
+
outlineWidth: globalRefs$x.border.xs,
|
|
3862
|
+
borderColor: globalRefs$x.colors.surface.light,
|
|
3829
3863
|
borderStyle: 'solid',
|
|
3830
3864
|
_invalid: {
|
|
3831
|
-
borderColor: globalRefs$
|
|
3865
|
+
borderColor: globalRefs$x.colors.error.main,
|
|
3832
3866
|
},
|
|
3833
3867
|
},
|
|
3834
3868
|
|
|
3835
3869
|
_disabled: {
|
|
3836
|
-
labelTextColor: globalRefs$
|
|
3837
|
-
borderColor: globalRefs$
|
|
3838
|
-
valueTextColor: globalRefs$
|
|
3839
|
-
placeholderTextColor: globalRefs$
|
|
3840
|
-
helperTextColor: globalRefs$
|
|
3841
|
-
backgroundColor: globalRefs$
|
|
3870
|
+
labelTextColor: globalRefs$x.colors.surface.light,
|
|
3871
|
+
borderColor: globalRefs$x.colors.surface.light,
|
|
3872
|
+
valueTextColor: globalRefs$x.colors.surface.light,
|
|
3873
|
+
placeholderTextColor: globalRefs$x.colors.surface.light,
|
|
3874
|
+
helperTextColor: globalRefs$x.colors.surface.light,
|
|
3875
|
+
backgroundColor: globalRefs$x.colors.surface.main,
|
|
3842
3876
|
},
|
|
3843
3877
|
},
|
|
3844
|
-
componentName$
|
|
3878
|
+
componentName$W
|
|
3845
3879
|
);
|
|
3846
3880
|
|
|
3847
3881
|
var inputWrapper = /*#__PURE__*/Object.freeze({
|
|
3848
3882
|
__proto__: null,
|
|
3849
3883
|
default: theme$1,
|
|
3850
3884
|
refs: refs,
|
|
3851
|
-
vars: vars$
|
|
3885
|
+
vars: vars$O
|
|
3852
3886
|
});
|
|
3853
3887
|
|
|
3854
|
-
const globalRefs$
|
|
3855
|
-
const vars$
|
|
3888
|
+
const globalRefs$w = getThemeRefs(globals);
|
|
3889
|
+
const vars$N = TextFieldClass.cssVarList;
|
|
3856
3890
|
|
|
3857
3891
|
const textField$1 = {
|
|
3858
|
-
[vars$
|
|
3859
|
-
[vars$
|
|
3860
|
-
[vars$
|
|
3861
|
-
[vars$
|
|
3862
|
-
[vars$
|
|
3863
|
-
[vars$
|
|
3864
|
-
[vars$
|
|
3865
|
-
[vars$
|
|
3866
|
-
[vars$
|
|
3867
|
-
[vars$
|
|
3868
|
-
[vars$
|
|
3869
|
-
[vars$
|
|
3870
|
-
[vars$
|
|
3871
|
-
[vars$
|
|
3872
|
-
[vars$
|
|
3873
|
-
[vars$
|
|
3874
|
-
[vars$
|
|
3875
|
-
[vars$
|
|
3876
|
-
[vars$
|
|
3877
|
-
[vars$
|
|
3878
|
-
[vars$
|
|
3879
|
-
[vars$
|
|
3880
|
-
[vars$
|
|
3881
|
-
[vars$
|
|
3882
|
-
[vars$
|
|
3892
|
+
[vars$N.hostWidth]: refs.width,
|
|
3893
|
+
[vars$N.hostMinWidth]: refs.minWidth,
|
|
3894
|
+
[vars$N.hostDirection]: refs.direction,
|
|
3895
|
+
[vars$N.fontSize]: refs.fontSize,
|
|
3896
|
+
[vars$N.fontFamily]: refs.fontFamily,
|
|
3897
|
+
[vars$N.labelFontSize]: refs.labelFontSize,
|
|
3898
|
+
[vars$N.labelFontWeight]: refs.labelFontWeight,
|
|
3899
|
+
[vars$N.labelTextColor]: refs.labelTextColor,
|
|
3900
|
+
[vars$N.labelRequiredIndicator]: refs.requiredIndicator,
|
|
3901
|
+
[vars$N.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
3902
|
+
[vars$N.inputValueTextColor]: refs.valueTextColor,
|
|
3903
|
+
[vars$N.inputPlaceholderColor]: refs.placeholderTextColor,
|
|
3904
|
+
[vars$N.inputBorderWidth]: refs.borderWidth,
|
|
3905
|
+
[vars$N.inputBorderStyle]: refs.borderStyle,
|
|
3906
|
+
[vars$N.inputBorderColor]: refs.borderColor,
|
|
3907
|
+
[vars$N.inputBorderRadius]: refs.borderRadius,
|
|
3908
|
+
[vars$N.inputOutlineWidth]: refs.outlineWidth,
|
|
3909
|
+
[vars$N.inputOutlineStyle]: refs.outlineStyle,
|
|
3910
|
+
[vars$N.inputOutlineColor]: refs.outlineColor,
|
|
3911
|
+
[vars$N.inputOutlineOffset]: refs.outlineOffset,
|
|
3912
|
+
[vars$N.inputBackgroundColor]: refs.backgroundColor,
|
|
3913
|
+
[vars$N.inputHeight]: refs.inputHeight,
|
|
3914
|
+
[vars$N.inputHorizontalPadding]: refs.horizontalPadding,
|
|
3915
|
+
[vars$N.helperTextColor]: refs.helperTextColor,
|
|
3916
|
+
[vars$N.textAlign]: refs.textAlign,
|
|
3883
3917
|
textAlign: {
|
|
3884
|
-
right: { [vars$
|
|
3885
|
-
left: { [vars$
|
|
3886
|
-
center: { [vars$
|
|
3918
|
+
right: { [vars$N.inputTextAlign]: 'right' },
|
|
3919
|
+
left: { [vars$N.inputTextAlign]: 'left' },
|
|
3920
|
+
center: { [vars$N.inputTextAlign]: 'center' },
|
|
3887
3921
|
},
|
|
3888
|
-
[vars$
|
|
3889
|
-
[vars$
|
|
3890
|
-
[vars$
|
|
3891
|
-
[vars$
|
|
3892
|
-
[vars$
|
|
3893
|
-
[vars$
|
|
3894
|
-
[vars$
|
|
3895
|
-
[vars$
|
|
3896
|
-
[vars$
|
|
3897
|
-
[vars$
|
|
3898
|
-
[vars$
|
|
3899
|
-
[vars$
|
|
3900
|
-
[vars$
|
|
3922
|
+
[vars$N.labelPosition]: refs.labelPosition,
|
|
3923
|
+
[vars$N.labelTopPosition]: refs.labelTopPosition,
|
|
3924
|
+
[vars$N.labelHorizontalPosition]: refs.labelHorizontalPosition,
|
|
3925
|
+
[vars$N.inputTransformY]: refs.inputTransformY,
|
|
3926
|
+
[vars$N.inputTransition]: refs.inputTransition,
|
|
3927
|
+
[vars$N.marginInlineStart]: refs.marginInlineStart,
|
|
3928
|
+
[vars$N.placeholderOpacity]: refs.placeholderOpacity,
|
|
3929
|
+
[vars$N.inputVerticalAlignment]: refs.inputVerticalAlignment,
|
|
3930
|
+
[vars$N.valueInputHeight]: refs.valueInputHeight,
|
|
3931
|
+
[vars$N.valueInputMarginBottom]: refs.valueInputMarginBottom,
|
|
3932
|
+
[vars$N.inputIconOffset]: globalRefs$w.spacing.md,
|
|
3933
|
+
[vars$N.inputIconSize]: refs.inputIconSize,
|
|
3934
|
+
[vars$N.inputIconColor]: refs.placeholderTextColor,
|
|
3901
3935
|
};
|
|
3902
3936
|
|
|
3903
3937
|
var textField$2 = /*#__PURE__*/Object.freeze({
|
|
3904
3938
|
__proto__: null,
|
|
3905
3939
|
default: textField$1,
|
|
3906
3940
|
textField: textField$1,
|
|
3907
|
-
vars: vars$
|
|
3941
|
+
vars: vars$N
|
|
3908
3942
|
});
|
|
3909
3943
|
|
|
3910
3944
|
const passwordDraggableMixin = (superclass) =>
|
|
@@ -3946,7 +3980,7 @@ const passwordDraggableMixin = (superclass) =>
|
|
|
3946
3980
|
}
|
|
3947
3981
|
};
|
|
3948
3982
|
|
|
3949
|
-
const componentName$
|
|
3983
|
+
const componentName$V = getComponentName('password');
|
|
3950
3984
|
|
|
3951
3985
|
const customMixin$b = (superclass) =>
|
|
3952
3986
|
class PasswordFieldMixinClass extends superclass {
|
|
@@ -4221,58 +4255,58 @@ const PasswordClass = compose(
|
|
|
4221
4255
|
}
|
|
4222
4256
|
`,
|
|
4223
4257
|
excludeAttrsSync: ['tabindex'],
|
|
4224
|
-
componentName: componentName$
|
|
4258
|
+
componentName: componentName$V,
|
|
4225
4259
|
})
|
|
4226
4260
|
);
|
|
4227
4261
|
|
|
4228
|
-
const globalRefs$
|
|
4229
|
-
const vars$
|
|
4262
|
+
const globalRefs$v = getThemeRefs(globals);
|
|
4263
|
+
const vars$M = PasswordClass.cssVarList;
|
|
4230
4264
|
|
|
4231
4265
|
const password = {
|
|
4232
|
-
[vars$
|
|
4233
|
-
[vars$
|
|
4234
|
-
[vars$
|
|
4235
|
-
[vars$
|
|
4236
|
-
[vars$
|
|
4237
|
-
[vars$
|
|
4238
|
-
[vars$
|
|
4239
|
-
[vars$
|
|
4240
|
-
[vars$
|
|
4241
|
-
[vars$
|
|
4242
|
-
[vars$
|
|
4243
|
-
[vars$
|
|
4244
|
-
[vars$
|
|
4245
|
-
[vars$
|
|
4246
|
-
[vars$
|
|
4247
|
-
[vars$
|
|
4248
|
-
[vars$
|
|
4249
|
-
[vars$
|
|
4250
|
-
[vars$
|
|
4251
|
-
[vars$
|
|
4252
|
-
[vars$
|
|
4253
|
-
[vars$
|
|
4254
|
-
[vars$
|
|
4255
|
-
[vars$
|
|
4256
|
-
[vars$
|
|
4257
|
-
[vars$
|
|
4258
|
-
[vars$
|
|
4259
|
-
[vars$
|
|
4260
|
-
[vars$
|
|
4261
|
-
[vars$
|
|
4262
|
-
[vars$
|
|
4263
|
-
[vars$
|
|
4264
|
-
[vars$
|
|
4265
|
-
[vars$
|
|
4266
|
-
[vars$
|
|
4266
|
+
[vars$M.hostWidth]: refs.width,
|
|
4267
|
+
[vars$M.hostMinWidth]: refs.minWidth,
|
|
4268
|
+
[vars$M.hostDirection]: refs.direction,
|
|
4269
|
+
[vars$M.fontSize]: refs.fontSize,
|
|
4270
|
+
[vars$M.fontFamily]: refs.fontFamily,
|
|
4271
|
+
[vars$M.labelFontSize]: refs.labelFontSize,
|
|
4272
|
+
[vars$M.labelFontWeight]: refs.labelFontWeight,
|
|
4273
|
+
[vars$M.labelTextColor]: refs.labelTextColor,
|
|
4274
|
+
[vars$M.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
4275
|
+
[vars$M.inputHorizontalPadding]: refs.horizontalPadding,
|
|
4276
|
+
[vars$M.inputHeight]: refs.inputHeight,
|
|
4277
|
+
[vars$M.inputBackgroundColor]: refs.backgroundColor,
|
|
4278
|
+
[vars$M.labelRequiredIndicator]: refs.requiredIndicator,
|
|
4279
|
+
[vars$M.inputValueTextColor]: refs.valueTextColor,
|
|
4280
|
+
[vars$M.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
|
4281
|
+
[vars$M.inputBorderWidth]: refs.borderWidth,
|
|
4282
|
+
[vars$M.inputBorderStyle]: refs.borderStyle,
|
|
4283
|
+
[vars$M.inputBorderColor]: refs.borderColor,
|
|
4284
|
+
[vars$M.inputBorderRadius]: refs.borderRadius,
|
|
4285
|
+
[vars$M.inputOutlineWidth]: refs.outlineWidth,
|
|
4286
|
+
[vars$M.inputOutlineStyle]: refs.outlineStyle,
|
|
4287
|
+
[vars$M.inputOutlineColor]: refs.outlineColor,
|
|
4288
|
+
[vars$M.inputOutlineOffset]: refs.outlineOffset,
|
|
4289
|
+
[vars$M.revealButtonOffset]: globalRefs$v.spacing.md,
|
|
4290
|
+
[vars$M.revealButtonSize]: refs.toggleButtonSize,
|
|
4291
|
+
[vars$M.revealButtonColor]: refs.placeholderTextColor,
|
|
4292
|
+
[vars$M.labelPosition]: refs.labelPosition,
|
|
4293
|
+
[vars$M.labelTopPosition]: refs.labelTopPosition,
|
|
4294
|
+
[vars$M.labelHorizontalPosition]: refs.labelHorizontalPosition,
|
|
4295
|
+
[vars$M.inputTransformY]: refs.inputTransformY,
|
|
4296
|
+
[vars$M.inputTransition]: refs.inputTransition,
|
|
4297
|
+
[vars$M.marginInlineStart]: refs.marginInlineStart,
|
|
4298
|
+
[vars$M.placeholderOpacity]: refs.placeholderOpacity,
|
|
4299
|
+
[vars$M.inputVerticalAlignment]: refs.inputVerticalAlignment,
|
|
4300
|
+
[vars$M.valueInputHeight]: refs.valueInputHeight,
|
|
4267
4301
|
};
|
|
4268
4302
|
|
|
4269
4303
|
var password$1 = /*#__PURE__*/Object.freeze({
|
|
4270
4304
|
__proto__: null,
|
|
4271
4305
|
default: password,
|
|
4272
|
-
vars: vars$
|
|
4306
|
+
vars: vars$M
|
|
4273
4307
|
});
|
|
4274
4308
|
|
|
4275
|
-
const componentName$
|
|
4309
|
+
const componentName$U = getComponentName('number-field');
|
|
4276
4310
|
|
|
4277
4311
|
const NumberFieldClass = compose(
|
|
4278
4312
|
createStyleMixin({
|
|
@@ -4306,55 +4340,55 @@ const NumberFieldClass = compose(
|
|
|
4306
4340
|
}
|
|
4307
4341
|
`,
|
|
4308
4342
|
excludeAttrsSync: ['tabindex'],
|
|
4309
|
-
componentName: componentName$
|
|
4343
|
+
componentName: componentName$U,
|
|
4310
4344
|
})
|
|
4311
4345
|
);
|
|
4312
4346
|
|
|
4313
|
-
const vars$
|
|
4347
|
+
const vars$L = NumberFieldClass.cssVarList;
|
|
4314
4348
|
|
|
4315
4349
|
const numberField = {
|
|
4316
|
-
[vars$
|
|
4317
|
-
[vars$
|
|
4318
|
-
[vars$
|
|
4319
|
-
[vars$
|
|
4320
|
-
[vars$
|
|
4321
|
-
[vars$
|
|
4322
|
-
[vars$
|
|
4323
|
-
[vars$
|
|
4324
|
-
[vars$
|
|
4325
|
-
[vars$
|
|
4326
|
-
[vars$
|
|
4327
|
-
[vars$
|
|
4328
|
-
[vars$
|
|
4329
|
-
[vars$
|
|
4330
|
-
[vars$
|
|
4331
|
-
[vars$
|
|
4332
|
-
[vars$
|
|
4333
|
-
[vars$
|
|
4334
|
-
[vars$
|
|
4335
|
-
[vars$
|
|
4336
|
-
[vars$
|
|
4337
|
-
[vars$
|
|
4338
|
-
[vars$
|
|
4339
|
-
[vars$
|
|
4340
|
-
[vars$
|
|
4341
|
-
[vars$
|
|
4342
|
-
[vars$
|
|
4343
|
-
[vars$
|
|
4344
|
-
[vars$
|
|
4345
|
-
[vars$
|
|
4346
|
-
[vars$
|
|
4347
|
-
[vars$
|
|
4348
|
-
[vars$
|
|
4350
|
+
[vars$L.hostWidth]: refs.width,
|
|
4351
|
+
[vars$L.hostMinWidth]: refs.minWidth,
|
|
4352
|
+
[vars$L.hostDirection]: refs.direction,
|
|
4353
|
+
[vars$L.fontSize]: refs.fontSize,
|
|
4354
|
+
[vars$L.fontFamily]: refs.fontFamily,
|
|
4355
|
+
[vars$L.labelFontSize]: refs.labelFontSize,
|
|
4356
|
+
[vars$L.labelFontWeight]: refs.labelFontWeight,
|
|
4357
|
+
[vars$L.labelTextColor]: refs.labelTextColor,
|
|
4358
|
+
[vars$L.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
4359
|
+
[vars$L.inputValueTextColor]: refs.valueTextColor,
|
|
4360
|
+
[vars$L.inputPlaceholderColor]: refs.placeholderTextColor,
|
|
4361
|
+
[vars$L.inputBorderWidth]: refs.borderWidth,
|
|
4362
|
+
[vars$L.inputBorderStyle]: refs.borderStyle,
|
|
4363
|
+
[vars$L.inputBorderColor]: refs.borderColor,
|
|
4364
|
+
[vars$L.inputBorderRadius]: refs.borderRadius,
|
|
4365
|
+
[vars$L.inputOutlineWidth]: refs.outlineWidth,
|
|
4366
|
+
[vars$L.inputOutlineStyle]: refs.outlineStyle,
|
|
4367
|
+
[vars$L.inputOutlineColor]: refs.outlineColor,
|
|
4368
|
+
[vars$L.inputOutlineOffset]: refs.outlineOffset,
|
|
4369
|
+
[vars$L.inputBackgroundColor]: refs.backgroundColor,
|
|
4370
|
+
[vars$L.labelRequiredIndicator]: refs.requiredIndicator,
|
|
4371
|
+
[vars$L.inputHorizontalPadding]: refs.horizontalPadding,
|
|
4372
|
+
[vars$L.inputHeight]: refs.inputHeight,
|
|
4373
|
+
[vars$L.labelPosition]: refs.labelPosition,
|
|
4374
|
+
[vars$L.labelTopPosition]: refs.labelTopPosition,
|
|
4375
|
+
[vars$L.labelHorizontalPosition]: refs.labelHorizontalPosition,
|
|
4376
|
+
[vars$L.inputTransformY]: refs.inputTransformY,
|
|
4377
|
+
[vars$L.inputTransition]: refs.inputTransition,
|
|
4378
|
+
[vars$L.marginInlineStart]: refs.marginInlineStart,
|
|
4379
|
+
[vars$L.placeholderOpacity]: refs.placeholderOpacity,
|
|
4380
|
+
[vars$L.inputVerticalAlignment]: refs.inputVerticalAlignment,
|
|
4381
|
+
[vars$L.valueInputHeight]: refs.valueInputHeight,
|
|
4382
|
+
[vars$L.valueInputMarginBottom]: refs.valueInputMarginBottom,
|
|
4349
4383
|
};
|
|
4350
4384
|
|
|
4351
4385
|
var numberField$1 = /*#__PURE__*/Object.freeze({
|
|
4352
4386
|
__proto__: null,
|
|
4353
4387
|
default: numberField,
|
|
4354
|
-
vars: vars$
|
|
4388
|
+
vars: vars$L
|
|
4355
4389
|
});
|
|
4356
4390
|
|
|
4357
|
-
const componentName$
|
|
4391
|
+
const componentName$T = getComponentName('email-field');
|
|
4358
4392
|
|
|
4359
4393
|
const defaultPattern = "^[\\w\\.\\%\\+\\-']+@[\\w\\.\\-]+\\.[A-Za-z]{2,}$";
|
|
4360
4394
|
const defaultAutocomplete = 'username';
|
|
@@ -4381,7 +4415,7 @@ const EmailFieldClass = compose(
|
|
|
4381
4415
|
}),
|
|
4382
4416
|
draggableMixin,
|
|
4383
4417
|
externalInputMixin({
|
|
4384
|
-
inputType: '
|
|
4418
|
+
inputType: 'email',
|
|
4385
4419
|
autocompleteType: 'username',
|
|
4386
4420
|
includeAttrs: ['disabled', 'readonly', 'pattern'],
|
|
4387
4421
|
}),
|
|
@@ -4422,55 +4456,55 @@ const EmailFieldClass = compose(
|
|
|
4422
4456
|
}
|
|
4423
4457
|
`,
|
|
4424
4458
|
excludeAttrsSync: ['tabindex'],
|
|
4425
|
-
componentName: componentName$
|
|
4459
|
+
componentName: componentName$T,
|
|
4426
4460
|
})
|
|
4427
4461
|
);
|
|
4428
4462
|
|
|
4429
|
-
const vars$
|
|
4463
|
+
const vars$K = EmailFieldClass.cssVarList;
|
|
4430
4464
|
|
|
4431
4465
|
const emailField = {
|
|
4432
|
-
[vars$
|
|
4433
|
-
[vars$
|
|
4434
|
-
[vars$
|
|
4435
|
-
[vars$
|
|
4436
|
-
[vars$
|
|
4437
|
-
[vars$
|
|
4438
|
-
[vars$
|
|
4439
|
-
[vars$
|
|
4440
|
-
[vars$
|
|
4441
|
-
[vars$
|
|
4442
|
-
[vars$
|
|
4443
|
-
[vars$
|
|
4444
|
-
[vars$
|
|
4445
|
-
[vars$
|
|
4446
|
-
[vars$
|
|
4447
|
-
[vars$
|
|
4448
|
-
[vars$
|
|
4449
|
-
[vars$
|
|
4450
|
-
[vars$
|
|
4451
|
-
[vars$
|
|
4452
|
-
[vars$
|
|
4453
|
-
[vars$
|
|
4454
|
-
[vars$
|
|
4455
|
-
[vars$
|
|
4456
|
-
[vars$
|
|
4457
|
-
[vars$
|
|
4458
|
-
[vars$
|
|
4459
|
-
[vars$
|
|
4460
|
-
[vars$
|
|
4461
|
-
[vars$
|
|
4462
|
-
[vars$
|
|
4463
|
-
[vars$
|
|
4464
|
-
[vars$
|
|
4466
|
+
[vars$K.hostWidth]: refs.width,
|
|
4467
|
+
[vars$K.hostMinWidth]: refs.minWidth,
|
|
4468
|
+
[vars$K.hostDirection]: refs.direction,
|
|
4469
|
+
[vars$K.fontSize]: refs.fontSize,
|
|
4470
|
+
[vars$K.fontFamily]: refs.fontFamily,
|
|
4471
|
+
[vars$K.labelFontSize]: refs.labelFontSize,
|
|
4472
|
+
[vars$K.labelFontWeight]: refs.labelFontWeight,
|
|
4473
|
+
[vars$K.labelTextColor]: refs.labelTextColor,
|
|
4474
|
+
[vars$K.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
4475
|
+
[vars$K.inputValueTextColor]: refs.valueTextColor,
|
|
4476
|
+
[vars$K.labelRequiredIndicator]: refs.requiredIndicator,
|
|
4477
|
+
[vars$K.inputPlaceholderColor]: refs.placeholderTextColor,
|
|
4478
|
+
[vars$K.inputBorderWidth]: refs.borderWidth,
|
|
4479
|
+
[vars$K.inputBorderStyle]: refs.borderStyle,
|
|
4480
|
+
[vars$K.inputBorderColor]: refs.borderColor,
|
|
4481
|
+
[vars$K.inputBorderRadius]: refs.borderRadius,
|
|
4482
|
+
[vars$K.inputOutlineWidth]: refs.outlineWidth,
|
|
4483
|
+
[vars$K.inputOutlineStyle]: refs.outlineStyle,
|
|
4484
|
+
[vars$K.inputOutlineColor]: refs.outlineColor,
|
|
4485
|
+
[vars$K.inputOutlineOffset]: refs.outlineOffset,
|
|
4486
|
+
[vars$K.inputBackgroundColor]: refs.backgroundColor,
|
|
4487
|
+
[vars$K.inputHorizontalPadding]: refs.horizontalPadding,
|
|
4488
|
+
[vars$K.inputHeight]: refs.inputHeight,
|
|
4489
|
+
[vars$K.labelPosition]: refs.labelPosition,
|
|
4490
|
+
[vars$K.labelTopPosition]: refs.labelTopPosition,
|
|
4491
|
+
[vars$K.labelHorizontalPosition]: refs.labelHorizontalPosition,
|
|
4492
|
+
[vars$K.inputTransformY]: refs.inputTransformY,
|
|
4493
|
+
[vars$K.inputTransition]: refs.inputTransition,
|
|
4494
|
+
[vars$K.marginInlineStart]: refs.marginInlineStart,
|
|
4495
|
+
[vars$K.placeholderOpacity]: refs.placeholderOpacity,
|
|
4496
|
+
[vars$K.inputVerticalAlignment]: refs.inputVerticalAlignment,
|
|
4497
|
+
[vars$K.valueInputHeight]: refs.valueInputHeight,
|
|
4498
|
+
[vars$K.valueInputMarginBottom]: refs.valueInputMarginBottom,
|
|
4465
4499
|
};
|
|
4466
4500
|
|
|
4467
4501
|
var emailField$1 = /*#__PURE__*/Object.freeze({
|
|
4468
4502
|
__proto__: null,
|
|
4469
4503
|
default: emailField,
|
|
4470
|
-
vars: vars$
|
|
4504
|
+
vars: vars$K
|
|
4471
4505
|
});
|
|
4472
4506
|
|
|
4473
|
-
const componentName$
|
|
4507
|
+
const componentName$S = getComponentName('text-area');
|
|
4474
4508
|
|
|
4475
4509
|
const {
|
|
4476
4510
|
host: host$l,
|
|
@@ -4546,49 +4580,49 @@ const TextAreaClass = compose(
|
|
|
4546
4580
|
${resetInputCursor('vaadin-text-area')}
|
|
4547
4581
|
`,
|
|
4548
4582
|
excludeAttrsSync: ['tabindex'],
|
|
4549
|
-
componentName: componentName$
|
|
4583
|
+
componentName: componentName$S,
|
|
4550
4584
|
})
|
|
4551
4585
|
);
|
|
4552
4586
|
|
|
4553
|
-
const vars$
|
|
4587
|
+
const vars$J = TextAreaClass.cssVarList;
|
|
4554
4588
|
|
|
4555
4589
|
const textArea = {
|
|
4556
|
-
[vars$
|
|
4557
|
-
[vars$
|
|
4558
|
-
[vars$
|
|
4559
|
-
[vars$
|
|
4560
|
-
[vars$
|
|
4561
|
-
[vars$
|
|
4562
|
-
[vars$
|
|
4563
|
-
[vars$
|
|
4564
|
-
[vars$
|
|
4565
|
-
[vars$
|
|
4566
|
-
[vars$
|
|
4567
|
-
[vars$
|
|
4568
|
-
[vars$
|
|
4569
|
-
[vars$
|
|
4570
|
-
[vars$
|
|
4571
|
-
[vars$
|
|
4572
|
-
[vars$
|
|
4573
|
-
[vars$
|
|
4574
|
-
[vars$
|
|
4575
|
-
[vars$
|
|
4576
|
-
[vars$
|
|
4590
|
+
[vars$J.hostWidth]: refs.width,
|
|
4591
|
+
[vars$J.hostMinWidth]: refs.minWidth,
|
|
4592
|
+
[vars$J.hostDirection]: refs.direction,
|
|
4593
|
+
[vars$J.fontSize]: refs.fontSize,
|
|
4594
|
+
[vars$J.fontFamily]: refs.fontFamily,
|
|
4595
|
+
[vars$J.labelTextColor]: refs.labelTextColor,
|
|
4596
|
+
[vars$J.labelRequiredIndicator]: refs.requiredIndicator,
|
|
4597
|
+
[vars$J.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
4598
|
+
[vars$J.inputBackgroundColor]: refs.backgroundColor,
|
|
4599
|
+
[vars$J.inputValueTextColor]: refs.valueTextColor,
|
|
4600
|
+
[vars$J.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
|
4601
|
+
[vars$J.inputBorderRadius]: refs.borderRadius,
|
|
4602
|
+
[vars$J.inputBorderWidth]: refs.borderWidth,
|
|
4603
|
+
[vars$J.inputBorderStyle]: refs.borderStyle,
|
|
4604
|
+
[vars$J.inputBorderColor]: refs.borderColor,
|
|
4605
|
+
[vars$J.inputOutlineWidth]: refs.outlineWidth,
|
|
4606
|
+
[vars$J.inputOutlineStyle]: refs.outlineStyle,
|
|
4607
|
+
[vars$J.inputOutlineColor]: refs.outlineColor,
|
|
4608
|
+
[vars$J.inputOutlineOffset]: refs.outlineOffset,
|
|
4609
|
+
[vars$J.inputResizeType]: 'vertical',
|
|
4610
|
+
[vars$J.inputMinHeight]: '5em',
|
|
4577
4611
|
textAlign: {
|
|
4578
|
-
right: { [vars$
|
|
4579
|
-
left: { [vars$
|
|
4580
|
-
center: { [vars$
|
|
4612
|
+
right: { [vars$J.inputTextAlign]: 'right' },
|
|
4613
|
+
left: { [vars$J.inputTextAlign]: 'left' },
|
|
4614
|
+
center: { [vars$J.inputTextAlign]: 'center' },
|
|
4581
4615
|
},
|
|
4582
4616
|
|
|
4583
4617
|
_readonly: {
|
|
4584
|
-
[vars$
|
|
4618
|
+
[vars$J.inputResizeType]: 'none',
|
|
4585
4619
|
},
|
|
4586
4620
|
};
|
|
4587
4621
|
|
|
4588
4622
|
var textArea$1 = /*#__PURE__*/Object.freeze({
|
|
4589
4623
|
__proto__: null,
|
|
4590
4624
|
default: textArea,
|
|
4591
|
-
vars: vars$
|
|
4625
|
+
vars: vars$J
|
|
4592
4626
|
});
|
|
4593
4627
|
|
|
4594
4628
|
const createBaseInputClass = (...args) =>
|
|
@@ -4599,9 +4633,9 @@ const createBaseInputClass = (...args) =>
|
|
|
4599
4633
|
inputEventsDispatchingMixin
|
|
4600
4634
|
)(createBaseClass(...args));
|
|
4601
4635
|
|
|
4602
|
-
const componentName$
|
|
4636
|
+
const componentName$R = getComponentName('boolean-field-internal');
|
|
4603
4637
|
|
|
4604
|
-
createBaseInputClass({ componentName: componentName$
|
|
4638
|
+
createBaseInputClass({ componentName: componentName$R, baseSelector: 'div' });
|
|
4605
4639
|
|
|
4606
4640
|
const booleanFieldMixin = (superclass) =>
|
|
4607
4641
|
class BooleanFieldMixinClass extends superclass {
|
|
@@ -4610,14 +4644,14 @@ const booleanFieldMixin = (superclass) =>
|
|
|
4610
4644
|
|
|
4611
4645
|
const template = document.createElement('template');
|
|
4612
4646
|
template.innerHTML = `
|
|
4613
|
-
<${componentName$
|
|
4647
|
+
<${componentName$R}
|
|
4614
4648
|
tabindex="-1"
|
|
4615
4649
|
slot="input"
|
|
4616
|
-
></${componentName$
|
|
4650
|
+
></${componentName$R}>
|
|
4617
4651
|
`;
|
|
4618
4652
|
|
|
4619
4653
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
|
4620
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
|
4654
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$R);
|
|
4621
4655
|
this.checkbox = this.inputElement.querySelector('vaadin-checkbox');
|
|
4622
4656
|
|
|
4623
4657
|
forwardAttrs(this, this.inputElement, {
|
|
@@ -4686,7 +4720,7 @@ descope-boolean-field-internal {
|
|
|
4686
4720
|
}
|
|
4687
4721
|
`;
|
|
4688
4722
|
|
|
4689
|
-
const componentName$
|
|
4723
|
+
const componentName$Q = getComponentName('checkbox');
|
|
4690
4724
|
|
|
4691
4725
|
const {
|
|
4692
4726
|
host: host$k,
|
|
@@ -4798,44 +4832,44 @@ const CheckboxClass = compose(
|
|
|
4798
4832
|
}
|
|
4799
4833
|
`,
|
|
4800
4834
|
excludeAttrsSync: ['label', 'tabindex'],
|
|
4801
|
-
componentName: componentName$
|
|
4835
|
+
componentName: componentName$Q,
|
|
4802
4836
|
})
|
|
4803
4837
|
);
|
|
4804
4838
|
|
|
4805
|
-
const vars$
|
|
4839
|
+
const vars$I = CheckboxClass.cssVarList;
|
|
4806
4840
|
const checkboxSize = '1.35em';
|
|
4807
4841
|
|
|
4808
4842
|
const checkbox = {
|
|
4809
|
-
[vars$
|
|
4810
|
-
[vars$
|
|
4811
|
-
[vars$
|
|
4812
|
-
[vars$
|
|
4813
|
-
[vars$
|
|
4814
|
-
[vars$
|
|
4815
|
-
[vars$
|
|
4816
|
-
[vars$
|
|
4817
|
-
[vars$
|
|
4818
|
-
[vars$
|
|
4819
|
-
[vars$
|
|
4820
|
-
[vars$
|
|
4821
|
-
[vars$
|
|
4822
|
-
[vars$
|
|
4823
|
-
[vars$
|
|
4824
|
-
[vars$
|
|
4825
|
-
[vars$
|
|
4826
|
-
[vars$
|
|
4827
|
-
[vars$
|
|
4828
|
-
[vars$
|
|
4829
|
-
[vars$
|
|
4843
|
+
[vars$I.hostWidth]: refs.width,
|
|
4844
|
+
[vars$I.hostDirection]: refs.direction,
|
|
4845
|
+
[vars$I.fontSize]: refs.fontSize,
|
|
4846
|
+
[vars$I.fontFamily]: refs.fontFamily,
|
|
4847
|
+
[vars$I.labelTextColor]: refs.labelTextColor,
|
|
4848
|
+
[vars$I.labelRequiredIndicator]: refs.requiredIndicator,
|
|
4849
|
+
[vars$I.labelFontWeight]: '400',
|
|
4850
|
+
[vars$I.labelLineHeight]: checkboxSize,
|
|
4851
|
+
[vars$I.labelSpacing]: '1em',
|
|
4852
|
+
[vars$I.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
4853
|
+
[vars$I.inputOutlineWidth]: refs.outlineWidth,
|
|
4854
|
+
[vars$I.inputOutlineOffset]: refs.outlineOffset,
|
|
4855
|
+
[vars$I.inputOutlineColor]: refs.outlineColor,
|
|
4856
|
+
[vars$I.inputOutlineStyle]: refs.outlineStyle,
|
|
4857
|
+
[vars$I.inputBorderRadius]: refs.borderRadius,
|
|
4858
|
+
[vars$I.inputBorderColor]: refs.borderColor,
|
|
4859
|
+
[vars$I.inputBorderWidth]: refs.borderWidth,
|
|
4860
|
+
[vars$I.inputBorderStyle]: refs.borderStyle,
|
|
4861
|
+
[vars$I.inputBackgroundColor]: refs.backgroundColor,
|
|
4862
|
+
[vars$I.inputSize]: checkboxSize,
|
|
4863
|
+
[vars$I.inputValueTextColor]: refs.valueTextColor,
|
|
4830
4864
|
};
|
|
4831
4865
|
|
|
4832
4866
|
var checkbox$1 = /*#__PURE__*/Object.freeze({
|
|
4833
4867
|
__proto__: null,
|
|
4834
4868
|
default: checkbox,
|
|
4835
|
-
vars: vars$
|
|
4869
|
+
vars: vars$I
|
|
4836
4870
|
});
|
|
4837
4871
|
|
|
4838
|
-
const componentName$
|
|
4872
|
+
const componentName$P = getComponentName('switch-toggle');
|
|
4839
4873
|
|
|
4840
4874
|
const {
|
|
4841
4875
|
host: host$j,
|
|
@@ -4967,82 +5001,82 @@ const SwitchToggleClass = compose(
|
|
|
4967
5001
|
}
|
|
4968
5002
|
`,
|
|
4969
5003
|
excludeAttrsSync: ['label', 'tabindex'],
|
|
4970
|
-
componentName: componentName$
|
|
5004
|
+
componentName: componentName$P,
|
|
4971
5005
|
})
|
|
4972
5006
|
);
|
|
4973
5007
|
|
|
4974
5008
|
const knobMargin = '2px';
|
|
4975
5009
|
const checkboxHeight = '1.25em';
|
|
4976
5010
|
|
|
4977
|
-
const globalRefs$
|
|
4978
|
-
const vars$
|
|
5011
|
+
const globalRefs$u = getThemeRefs(globals);
|
|
5012
|
+
const vars$H = SwitchToggleClass.cssVarList;
|
|
4979
5013
|
|
|
4980
5014
|
const switchToggle = {
|
|
4981
|
-
[vars$
|
|
4982
|
-
[vars$
|
|
4983
|
-
[vars$
|
|
4984
|
-
[vars$
|
|
4985
|
-
|
|
4986
|
-
[vars$
|
|
4987
|
-
[vars$
|
|
4988
|
-
[vars$
|
|
4989
|
-
[vars$
|
|
4990
|
-
|
|
4991
|
-
[vars$
|
|
4992
|
-
[vars$
|
|
4993
|
-
[vars$
|
|
4994
|
-
[vars$
|
|
4995
|
-
[vars$
|
|
4996
|
-
[vars$
|
|
4997
|
-
[vars$
|
|
4998
|
-
|
|
4999
|
-
[vars$
|
|
5000
|
-
[vars$
|
|
5001
|
-
[vars$
|
|
5002
|
-
[vars$
|
|
5003
|
-
[vars$
|
|
5004
|
-
[vars$
|
|
5005
|
-
|
|
5006
|
-
[vars$
|
|
5007
|
-
[vars$
|
|
5008
|
-
[vars$
|
|
5009
|
-
[vars$
|
|
5010
|
-
[vars$
|
|
5011
|
-
[vars$
|
|
5015
|
+
[vars$H.hostWidth]: refs.width,
|
|
5016
|
+
[vars$H.hostDirection]: refs.direction,
|
|
5017
|
+
[vars$H.fontSize]: refs.fontSize,
|
|
5018
|
+
[vars$H.fontFamily]: refs.fontFamily,
|
|
5019
|
+
|
|
5020
|
+
[vars$H.inputOutlineWidth]: refs.outlineWidth,
|
|
5021
|
+
[vars$H.inputOutlineOffset]: refs.outlineOffset,
|
|
5022
|
+
[vars$H.inputOutlineColor]: refs.outlineColor,
|
|
5023
|
+
[vars$H.inputOutlineStyle]: refs.outlineStyle,
|
|
5024
|
+
|
|
5025
|
+
[vars$H.trackBorderStyle]: refs.borderStyle,
|
|
5026
|
+
[vars$H.trackBorderWidth]: refs.borderWidth, // var `trackBorderWidth` used outside the theme for `left` margin calculation
|
|
5027
|
+
[vars$H.trackBorderColor]: refs.borderColor,
|
|
5028
|
+
[vars$H.trackBackgroundColor]: refs.backgroundColor,
|
|
5029
|
+
[vars$H.trackBorderRadius]: globalRefs$u.radius.md,
|
|
5030
|
+
[vars$H.trackWidth]: '2.5em', // var `trackWidth` used outside the theme for `left` margin calculation
|
|
5031
|
+
[vars$H.trackHeight]: checkboxHeight,
|
|
5032
|
+
|
|
5033
|
+
[vars$H.knobSize]: `calc(1em - ${knobMargin})`,
|
|
5034
|
+
[vars$H.knobRadius]: '50%',
|
|
5035
|
+
[vars$H.knobTopOffset]: '1px',
|
|
5036
|
+
[vars$H.knobLeftOffset]: knobMargin,
|
|
5037
|
+
[vars$H.knobColor]: refs.labelTextColor,
|
|
5038
|
+
[vars$H.knobTransitionDuration]: '0.3s',
|
|
5039
|
+
|
|
5040
|
+
[vars$H.labelTextColor]: refs.labelTextColor,
|
|
5041
|
+
[vars$H.labelFontWeight]: '400',
|
|
5042
|
+
[vars$H.labelLineHeight]: '1.35em',
|
|
5043
|
+
[vars$H.labelSpacing]: '1em',
|
|
5044
|
+
[vars$H.labelRequiredIndicator]: refs.requiredIndicator,
|
|
5045
|
+
[vars$H.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
5012
5046
|
|
|
5013
5047
|
_checked: {
|
|
5014
|
-
[vars$
|
|
5015
|
-
[vars$
|
|
5016
|
-
[vars$
|
|
5017
|
-
[vars$
|
|
5048
|
+
[vars$H.trackBorderColor]: refs.borderColor,
|
|
5049
|
+
[vars$H.knobLeftOffset]: `calc(100% - var(${vars$H.knobSize}) - ${knobMargin})`,
|
|
5050
|
+
[vars$H.knobColor]: refs.valueTextColor,
|
|
5051
|
+
[vars$H.knobTextColor]: refs.valueTextColor,
|
|
5018
5052
|
},
|
|
5019
5053
|
|
|
5020
5054
|
_disabled: {
|
|
5021
|
-
[vars$
|
|
5022
|
-
[vars$
|
|
5023
|
-
[vars$
|
|
5024
|
-
[vars$
|
|
5055
|
+
[vars$H.knobColor]: globalRefs$u.colors.surface.light,
|
|
5056
|
+
[vars$H.trackBorderColor]: globalRefs$u.colors.surface.light,
|
|
5057
|
+
[vars$H.trackBackgroundColor]: globalRefs$u.colors.surface.main,
|
|
5058
|
+
[vars$H.labelTextColor]: refs.labelTextColor,
|
|
5025
5059
|
_checked: {
|
|
5026
|
-
[vars$
|
|
5027
|
-
[vars$
|
|
5060
|
+
[vars$H.knobColor]: globalRefs$u.colors.surface.light,
|
|
5061
|
+
[vars$H.trackBackgroundColor]: globalRefs$u.colors.surface.main,
|
|
5028
5062
|
},
|
|
5029
5063
|
},
|
|
5030
5064
|
|
|
5031
5065
|
_invalid: {
|
|
5032
|
-
[vars$
|
|
5033
|
-
[vars$
|
|
5066
|
+
[vars$H.trackBorderColor]: globalRefs$u.colors.error.main,
|
|
5067
|
+
[vars$H.knobColor]: globalRefs$u.colors.error.main,
|
|
5034
5068
|
},
|
|
5035
5069
|
};
|
|
5036
5070
|
|
|
5037
5071
|
var switchToggle$1 = /*#__PURE__*/Object.freeze({
|
|
5038
5072
|
__proto__: null,
|
|
5039
5073
|
default: switchToggle,
|
|
5040
|
-
vars: vars$
|
|
5074
|
+
vars: vars$H
|
|
5041
5075
|
});
|
|
5042
5076
|
|
|
5043
|
-
const componentName$
|
|
5077
|
+
const componentName$O = getComponentName('container');
|
|
5044
5078
|
|
|
5045
|
-
class RawContainer extends createBaseClass({ componentName: componentName$
|
|
5079
|
+
class RawContainer extends createBaseClass({ componentName: componentName$O, baseSelector: 'slot' }) {
|
|
5046
5080
|
constructor() {
|
|
5047
5081
|
super();
|
|
5048
5082
|
|
|
@@ -5095,7 +5129,7 @@ const ContainerClass = compose(
|
|
|
5095
5129
|
componentNameValidationMixin
|
|
5096
5130
|
)(RawContainer);
|
|
5097
5131
|
|
|
5098
|
-
const globalRefs$
|
|
5132
|
+
const globalRefs$t = getThemeRefs(globals);
|
|
5099
5133
|
|
|
5100
5134
|
const compVars$5 = ContainerClass.cssVarList;
|
|
5101
5135
|
|
|
@@ -5117,7 +5151,7 @@ const [helperTheme$3, helperRefs$3, helperVars$3] = createHelperVars(
|
|
|
5117
5151
|
horizontalAlignment,
|
|
5118
5152
|
shadowColor: '#00000020', // if we want to support transparency vars, we should use different color format
|
|
5119
5153
|
},
|
|
5120
|
-
componentName$
|
|
5154
|
+
componentName$O
|
|
5121
5155
|
);
|
|
5122
5156
|
|
|
5123
5157
|
const { shadowColor: shadowColor$3 } = helperRefs$3;
|
|
@@ -5128,10 +5162,10 @@ const container = {
|
|
|
5128
5162
|
[compVars$5.itemsGrow]: '0',
|
|
5129
5163
|
[compVars$5.hostWidth]: '100%',
|
|
5130
5164
|
[compVars$5.boxShadow]: 'none',
|
|
5131
|
-
[compVars$5.backgroundColor]: globalRefs$
|
|
5132
|
-
[compVars$5.color]: globalRefs$
|
|
5165
|
+
[compVars$5.backgroundColor]: globalRefs$t.colors.surface.main,
|
|
5166
|
+
[compVars$5.color]: globalRefs$t.colors.surface.contrast,
|
|
5133
5167
|
[compVars$5.borderRadius]: '0px',
|
|
5134
|
-
[compVars$5.hostDirection]: globalRefs$
|
|
5168
|
+
[compVars$5.hostDirection]: globalRefs$t.direction,
|
|
5135
5169
|
|
|
5136
5170
|
verticalPadding: {
|
|
5137
5171
|
sm: { [compVars$5.verticalPadding]: '5px' },
|
|
@@ -5177,34 +5211,34 @@ const container = {
|
|
|
5177
5211
|
|
|
5178
5212
|
shadow: {
|
|
5179
5213
|
sm: {
|
|
5180
|
-
[compVars$5.boxShadow]: `${globalRefs$
|
|
5214
|
+
[compVars$5.boxShadow]: `${globalRefs$t.shadow.wide.sm} ${shadowColor$3}, ${globalRefs$t.shadow.narrow.sm} ${shadowColor$3}`,
|
|
5181
5215
|
},
|
|
5182
5216
|
md: {
|
|
5183
|
-
[compVars$5.boxShadow]: `${globalRefs$
|
|
5217
|
+
[compVars$5.boxShadow]: `${globalRefs$t.shadow.wide.md} ${shadowColor$3}, ${globalRefs$t.shadow.narrow.md} ${shadowColor$3}`,
|
|
5184
5218
|
},
|
|
5185
5219
|
lg: {
|
|
5186
|
-
[compVars$5.boxShadow]: `${globalRefs$
|
|
5220
|
+
[compVars$5.boxShadow]: `${globalRefs$t.shadow.wide.lg} ${shadowColor$3}, ${globalRefs$t.shadow.narrow.lg} ${shadowColor$3}`,
|
|
5187
5221
|
},
|
|
5188
5222
|
xl: {
|
|
5189
|
-
[compVars$5.boxShadow]: `${globalRefs$
|
|
5223
|
+
[compVars$5.boxShadow]: `${globalRefs$t.shadow.wide.xl} ${shadowColor$3}, ${globalRefs$t.shadow.narrow.xl} ${shadowColor$3}`,
|
|
5190
5224
|
},
|
|
5191
5225
|
'2xl': {
|
|
5192
5226
|
[helperVars$3.shadowColor]: '#00000050', // mimic daisyUI shadow settings
|
|
5193
|
-
[compVars$5.boxShadow]: `${globalRefs$
|
|
5227
|
+
[compVars$5.boxShadow]: `${globalRefs$t.shadow.wide['2xl']} ${shadowColor$3}`,
|
|
5194
5228
|
},
|
|
5195
5229
|
},
|
|
5196
5230
|
|
|
5197
5231
|
borderRadius: {
|
|
5198
|
-
sm: { [compVars$5.borderRadius]: globalRefs$
|
|
5199
|
-
md: { [compVars$5.borderRadius]: globalRefs$
|
|
5200
|
-
lg: { [compVars$5.borderRadius]: globalRefs$
|
|
5201
|
-
xl: { [compVars$5.borderRadius]: globalRefs$
|
|
5202
|
-
'2xl': { [compVars$5.borderRadius]: globalRefs$
|
|
5203
|
-
'3xl': { [compVars$5.borderRadius]: globalRefs$
|
|
5232
|
+
sm: { [compVars$5.borderRadius]: globalRefs$t.radius.sm },
|
|
5233
|
+
md: { [compVars$5.borderRadius]: globalRefs$t.radius.md },
|
|
5234
|
+
lg: { [compVars$5.borderRadius]: globalRefs$t.radius.lg },
|
|
5235
|
+
xl: { [compVars$5.borderRadius]: globalRefs$t.radius.xl },
|
|
5236
|
+
'2xl': { [compVars$5.borderRadius]: globalRefs$t.radius['2xl'] },
|
|
5237
|
+
'3xl': { [compVars$5.borderRadius]: globalRefs$t.radius['3xl'] },
|
|
5204
5238
|
},
|
|
5205
5239
|
};
|
|
5206
5240
|
|
|
5207
|
-
const vars$
|
|
5241
|
+
const vars$G = {
|
|
5208
5242
|
...compVars$5,
|
|
5209
5243
|
...helperVars$3,
|
|
5210
5244
|
};
|
|
@@ -5212,7 +5246,7 @@ const vars$F = {
|
|
|
5212
5246
|
var container$1 = /*#__PURE__*/Object.freeze({
|
|
5213
5247
|
__proto__: null,
|
|
5214
5248
|
default: container,
|
|
5215
|
-
vars: vars$
|
|
5249
|
+
vars: vars$G
|
|
5216
5250
|
});
|
|
5217
5251
|
|
|
5218
5252
|
const createCssVarImageClass = ({ componentName, varName, fallbackVarName }) => {
|
|
@@ -5265,69 +5299,69 @@ const createCssVarImageClass = ({ componentName, varName, fallbackVarName }) =>
|
|
|
5265
5299
|
return CssVarImageClass;
|
|
5266
5300
|
};
|
|
5267
5301
|
|
|
5268
|
-
const componentName$
|
|
5302
|
+
const componentName$N = getComponentName('logo');
|
|
5269
5303
|
|
|
5270
5304
|
const LogoClass = createCssVarImageClass({
|
|
5271
|
-
componentName: componentName$
|
|
5305
|
+
componentName: componentName$N,
|
|
5272
5306
|
varName: 'url',
|
|
5273
5307
|
fallbackVarName: 'fallbackUrl',
|
|
5274
5308
|
});
|
|
5275
5309
|
|
|
5276
|
-
const vars$
|
|
5310
|
+
const vars$F = LogoClass.cssVarList;
|
|
5277
5311
|
|
|
5278
5312
|
const logo$2 = {
|
|
5279
|
-
[vars$
|
|
5313
|
+
[vars$F.fallbackUrl]: 'url(https://imgs.descope.com/components/no-logo-placeholder.svg)',
|
|
5280
5314
|
};
|
|
5281
5315
|
|
|
5282
5316
|
var logo$3 = /*#__PURE__*/Object.freeze({
|
|
5283
5317
|
__proto__: null,
|
|
5284
5318
|
default: logo$2,
|
|
5285
|
-
vars: vars$
|
|
5319
|
+
vars: vars$F
|
|
5286
5320
|
});
|
|
5287
5321
|
|
|
5288
|
-
const componentName$
|
|
5322
|
+
const componentName$M = getComponentName('totp-image');
|
|
5289
5323
|
|
|
5290
5324
|
const TotpImageClass = createCssVarImageClass({
|
|
5291
|
-
componentName: componentName$
|
|
5325
|
+
componentName: componentName$M,
|
|
5292
5326
|
varName: 'url',
|
|
5293
5327
|
fallbackVarName: 'fallbackUrl',
|
|
5294
5328
|
});
|
|
5295
5329
|
|
|
5296
|
-
const vars$
|
|
5330
|
+
const vars$E = TotpImageClass.cssVarList;
|
|
5297
5331
|
|
|
5298
5332
|
const logo$1 = {
|
|
5299
|
-
[vars$
|
|
5333
|
+
[vars$E.fallbackUrl]: 'url(https://imgs.descope.com/components/totp-placeholder.svg)',
|
|
5300
5334
|
};
|
|
5301
5335
|
|
|
5302
5336
|
var totpImage = /*#__PURE__*/Object.freeze({
|
|
5303
5337
|
__proto__: null,
|
|
5304
5338
|
default: logo$1,
|
|
5305
|
-
vars: vars$
|
|
5339
|
+
vars: vars$E
|
|
5306
5340
|
});
|
|
5307
5341
|
|
|
5308
|
-
const componentName$
|
|
5342
|
+
const componentName$L = getComponentName('notp-image');
|
|
5309
5343
|
|
|
5310
5344
|
const NotpImageClass = createCssVarImageClass({
|
|
5311
|
-
componentName: componentName$
|
|
5345
|
+
componentName: componentName$L,
|
|
5312
5346
|
varName: 'url',
|
|
5313
5347
|
fallbackVarName: 'fallbackUrl',
|
|
5314
5348
|
});
|
|
5315
5349
|
|
|
5316
|
-
const vars$
|
|
5350
|
+
const vars$D = NotpImageClass.cssVarList;
|
|
5317
5351
|
|
|
5318
5352
|
const logo = {
|
|
5319
|
-
[vars$
|
|
5353
|
+
[vars$D.fallbackUrl]: 'url(https://imgs.descope.com/components/notp-placeholder.svg)',
|
|
5320
5354
|
};
|
|
5321
5355
|
|
|
5322
5356
|
var notpImage = /*#__PURE__*/Object.freeze({
|
|
5323
5357
|
__proto__: null,
|
|
5324
5358
|
default: logo,
|
|
5325
|
-
vars: vars$
|
|
5359
|
+
vars: vars$D
|
|
5326
5360
|
});
|
|
5327
5361
|
|
|
5328
|
-
const componentName$
|
|
5362
|
+
const componentName$K = getComponentName('text');
|
|
5329
5363
|
|
|
5330
|
-
class RawText extends createBaseClass({ componentName: componentName$
|
|
5364
|
+
class RawText extends createBaseClass({ componentName: componentName$K, baseSelector: ':host > slot' }) {
|
|
5331
5365
|
constructor() {
|
|
5332
5366
|
super();
|
|
5333
5367
|
|
|
@@ -5384,95 +5418,95 @@ const TextClass = compose(
|
|
|
5384
5418
|
componentNameValidationMixin
|
|
5385
5419
|
)(RawText);
|
|
5386
5420
|
|
|
5387
|
-
const globalRefs$
|
|
5388
|
-
const vars$
|
|
5421
|
+
const globalRefs$s = getThemeRefs(globals);
|
|
5422
|
+
const vars$C = TextClass.cssVarList;
|
|
5389
5423
|
|
|
5390
5424
|
const text$2 = {
|
|
5391
|
-
[vars$
|
|
5392
|
-
[vars$
|
|
5393
|
-
[vars$
|
|
5394
|
-
[vars$
|
|
5425
|
+
[vars$C.hostDirection]: globalRefs$s.direction,
|
|
5426
|
+
[vars$C.textLineHeight]: '1.35em',
|
|
5427
|
+
[vars$C.textAlign]: 'left',
|
|
5428
|
+
[vars$C.textColor]: globalRefs$s.colors.surface.dark,
|
|
5395
5429
|
|
|
5396
5430
|
variant: {
|
|
5397
5431
|
h1: {
|
|
5398
|
-
[vars$
|
|
5399
|
-
[vars$
|
|
5400
|
-
[vars$
|
|
5432
|
+
[vars$C.fontSize]: globalRefs$s.typography.h1.size,
|
|
5433
|
+
[vars$C.fontWeight]: globalRefs$s.typography.h1.weight,
|
|
5434
|
+
[vars$C.fontFamily]: globalRefs$s.typography.h1.font,
|
|
5401
5435
|
},
|
|
5402
5436
|
h2: {
|
|
5403
|
-
[vars$
|
|
5404
|
-
[vars$
|
|
5405
|
-
[vars$
|
|
5437
|
+
[vars$C.fontSize]: globalRefs$s.typography.h2.size,
|
|
5438
|
+
[vars$C.fontWeight]: globalRefs$s.typography.h2.weight,
|
|
5439
|
+
[vars$C.fontFamily]: globalRefs$s.typography.h2.font,
|
|
5406
5440
|
},
|
|
5407
5441
|
h3: {
|
|
5408
|
-
[vars$
|
|
5409
|
-
[vars$
|
|
5410
|
-
[vars$
|
|
5442
|
+
[vars$C.fontSize]: globalRefs$s.typography.h3.size,
|
|
5443
|
+
[vars$C.fontWeight]: globalRefs$s.typography.h3.weight,
|
|
5444
|
+
[vars$C.fontFamily]: globalRefs$s.typography.h3.font,
|
|
5411
5445
|
},
|
|
5412
5446
|
subtitle1: {
|
|
5413
|
-
[vars$
|
|
5414
|
-
[vars$
|
|
5415
|
-
[vars$
|
|
5447
|
+
[vars$C.fontSize]: globalRefs$s.typography.subtitle1.size,
|
|
5448
|
+
[vars$C.fontWeight]: globalRefs$s.typography.subtitle1.weight,
|
|
5449
|
+
[vars$C.fontFamily]: globalRefs$s.typography.subtitle1.font,
|
|
5416
5450
|
},
|
|
5417
5451
|
subtitle2: {
|
|
5418
|
-
[vars$
|
|
5419
|
-
[vars$
|
|
5420
|
-
[vars$
|
|
5452
|
+
[vars$C.fontSize]: globalRefs$s.typography.subtitle2.size,
|
|
5453
|
+
[vars$C.fontWeight]: globalRefs$s.typography.subtitle2.weight,
|
|
5454
|
+
[vars$C.fontFamily]: globalRefs$s.typography.subtitle2.font,
|
|
5421
5455
|
},
|
|
5422
5456
|
body1: {
|
|
5423
|
-
[vars$
|
|
5424
|
-
[vars$
|
|
5425
|
-
[vars$
|
|
5457
|
+
[vars$C.fontSize]: globalRefs$s.typography.body1.size,
|
|
5458
|
+
[vars$C.fontWeight]: globalRefs$s.typography.body1.weight,
|
|
5459
|
+
[vars$C.fontFamily]: globalRefs$s.typography.body1.font,
|
|
5426
5460
|
},
|
|
5427
5461
|
body2: {
|
|
5428
|
-
[vars$
|
|
5429
|
-
[vars$
|
|
5430
|
-
[vars$
|
|
5462
|
+
[vars$C.fontSize]: globalRefs$s.typography.body2.size,
|
|
5463
|
+
[vars$C.fontWeight]: globalRefs$s.typography.body2.weight,
|
|
5464
|
+
[vars$C.fontFamily]: globalRefs$s.typography.body2.font,
|
|
5431
5465
|
},
|
|
5432
5466
|
},
|
|
5433
5467
|
|
|
5434
5468
|
mode: {
|
|
5435
5469
|
primary: {
|
|
5436
|
-
[vars$
|
|
5470
|
+
[vars$C.textColor]: globalRefs$s.colors.surface.contrast,
|
|
5437
5471
|
},
|
|
5438
5472
|
secondary: {
|
|
5439
|
-
[vars$
|
|
5473
|
+
[vars$C.textColor]: globalRefs$s.colors.surface.dark,
|
|
5440
5474
|
},
|
|
5441
5475
|
error: {
|
|
5442
|
-
[vars$
|
|
5476
|
+
[vars$C.textColor]: globalRefs$s.colors.error.main,
|
|
5443
5477
|
},
|
|
5444
5478
|
success: {
|
|
5445
|
-
[vars$
|
|
5479
|
+
[vars$C.textColor]: globalRefs$s.colors.success.main,
|
|
5446
5480
|
},
|
|
5447
5481
|
},
|
|
5448
5482
|
|
|
5449
5483
|
textAlign: {
|
|
5450
|
-
right: { [vars$
|
|
5451
|
-
left: { [vars$
|
|
5452
|
-
center: { [vars$
|
|
5484
|
+
right: { [vars$C.textAlign]: 'right' },
|
|
5485
|
+
left: { [vars$C.textAlign]: 'left' },
|
|
5486
|
+
center: { [vars$C.textAlign]: 'center' },
|
|
5453
5487
|
},
|
|
5454
5488
|
|
|
5455
5489
|
_fullWidth: {
|
|
5456
|
-
[vars$
|
|
5490
|
+
[vars$C.hostWidth]: '100%',
|
|
5457
5491
|
},
|
|
5458
5492
|
|
|
5459
5493
|
_italic: {
|
|
5460
|
-
[vars$
|
|
5494
|
+
[vars$C.fontStyle]: 'italic',
|
|
5461
5495
|
},
|
|
5462
5496
|
|
|
5463
5497
|
_uppercase: {
|
|
5464
|
-
[vars$
|
|
5498
|
+
[vars$C.textTransform]: 'uppercase',
|
|
5465
5499
|
},
|
|
5466
5500
|
|
|
5467
5501
|
_lowercase: {
|
|
5468
|
-
[vars$
|
|
5502
|
+
[vars$C.textTransform]: 'lowercase',
|
|
5469
5503
|
},
|
|
5470
5504
|
};
|
|
5471
5505
|
|
|
5472
5506
|
var text$3 = /*#__PURE__*/Object.freeze({
|
|
5473
5507
|
__proto__: null,
|
|
5474
5508
|
default: text$2,
|
|
5475
|
-
vars: vars$
|
|
5509
|
+
vars: vars$C
|
|
5476
5510
|
});
|
|
5477
5511
|
|
|
5478
5512
|
const disableRules = [
|
|
@@ -5499,9 +5533,9 @@ const decodeHTML = (html) => {
|
|
|
5499
5533
|
/* eslint-disable no-param-reassign */
|
|
5500
5534
|
|
|
5501
5535
|
|
|
5502
|
-
const componentName$
|
|
5536
|
+
const componentName$J = getComponentName('enriched-text');
|
|
5503
5537
|
|
|
5504
|
-
class EnrichedText extends createBaseClass({ componentName: componentName$
|
|
5538
|
+
class EnrichedText extends createBaseClass({ componentName: componentName$J, baseSelector: ':host > div' }) {
|
|
5505
5539
|
#origLinkRenderer;
|
|
5506
5540
|
|
|
5507
5541
|
#origEmRenderer;
|
|
@@ -5697,9 +5731,9 @@ const EnrichedTextClass = compose(
|
|
|
5697
5731
|
componentNameValidationMixin
|
|
5698
5732
|
)(EnrichedText);
|
|
5699
5733
|
|
|
5700
|
-
const componentName$
|
|
5734
|
+
const componentName$I = getComponentName('link');
|
|
5701
5735
|
|
|
5702
|
-
class RawLink extends createBaseClass({ componentName: componentName$
|
|
5736
|
+
class RawLink extends createBaseClass({ componentName: componentName$I, baseSelector: ':host a' }) {
|
|
5703
5737
|
constructor() {
|
|
5704
5738
|
super();
|
|
5705
5739
|
|
|
@@ -5763,38 +5797,38 @@ const LinkClass = compose(
|
|
|
5763
5797
|
componentNameValidationMixin
|
|
5764
5798
|
)(RawLink);
|
|
5765
5799
|
|
|
5766
|
-
const globalRefs$
|
|
5767
|
-
const vars$
|
|
5800
|
+
const globalRefs$r = getThemeRefs(globals);
|
|
5801
|
+
const vars$B = LinkClass.cssVarList;
|
|
5768
5802
|
|
|
5769
5803
|
const link$1 = {
|
|
5770
|
-
[vars$
|
|
5771
|
-
[vars$
|
|
5804
|
+
[vars$B.hostDirection]: globalRefs$r.direction,
|
|
5805
|
+
[vars$B.cursor]: 'pointer',
|
|
5772
5806
|
|
|
5773
|
-
[vars$
|
|
5807
|
+
[vars$B.textColor]: globalRefs$r.colors.primary.main,
|
|
5774
5808
|
|
|
5775
5809
|
textAlign: {
|
|
5776
|
-
right: { [vars$
|
|
5777
|
-
left: { [vars$
|
|
5778
|
-
center: { [vars$
|
|
5810
|
+
right: { [vars$B.textAlign]: 'right' },
|
|
5811
|
+
left: { [vars$B.textAlign]: 'left' },
|
|
5812
|
+
center: { [vars$B.textAlign]: 'center' },
|
|
5779
5813
|
},
|
|
5780
5814
|
|
|
5781
5815
|
_fullWidth: {
|
|
5782
|
-
[vars$
|
|
5816
|
+
[vars$B.hostWidth]: '100%',
|
|
5783
5817
|
},
|
|
5784
5818
|
|
|
5785
5819
|
_hover: {
|
|
5786
|
-
[vars$
|
|
5820
|
+
[vars$B.textDecoration]: 'underline',
|
|
5787
5821
|
},
|
|
5788
5822
|
|
|
5789
5823
|
mode: {
|
|
5790
5824
|
secondary: {
|
|
5791
|
-
[vars$
|
|
5825
|
+
[vars$B.textColor]: globalRefs$r.colors.secondary.main,
|
|
5792
5826
|
},
|
|
5793
5827
|
error: {
|
|
5794
|
-
[vars$
|
|
5828
|
+
[vars$B.textColor]: globalRefs$r.colors.error.main,
|
|
5795
5829
|
},
|
|
5796
5830
|
success: {
|
|
5797
|
-
[vars$
|
|
5831
|
+
[vars$B.textColor]: globalRefs$r.colors.success.main,
|
|
5798
5832
|
},
|
|
5799
5833
|
},
|
|
5800
5834
|
};
|
|
@@ -5802,37 +5836,37 @@ const link$1 = {
|
|
|
5802
5836
|
var link$2 = /*#__PURE__*/Object.freeze({
|
|
5803
5837
|
__proto__: null,
|
|
5804
5838
|
default: link$1,
|
|
5805
|
-
vars: vars$
|
|
5839
|
+
vars: vars$B
|
|
5806
5840
|
});
|
|
5807
5841
|
|
|
5808
|
-
const globalRefs$
|
|
5809
|
-
const vars$
|
|
5842
|
+
const globalRefs$q = getThemeRefs(globals);
|
|
5843
|
+
const vars$A = EnrichedTextClass.cssVarList;
|
|
5810
5844
|
|
|
5811
5845
|
const enrichedText = {
|
|
5812
|
-
[vars$
|
|
5813
|
-
[vars$
|
|
5846
|
+
[vars$A.hostDirection]: globalRefs$q.direction,
|
|
5847
|
+
[vars$A.hostWidth]: useVar(vars$C.hostWidth),
|
|
5814
5848
|
|
|
5815
|
-
[vars$
|
|
5816
|
-
[vars$
|
|
5817
|
-
[vars$
|
|
5849
|
+
[vars$A.textLineHeight]: useVar(vars$C.textLineHeight),
|
|
5850
|
+
[vars$A.textColor]: useVar(vars$C.textColor),
|
|
5851
|
+
[vars$A.textAlign]: useVar(vars$C.textAlign),
|
|
5818
5852
|
|
|
5819
|
-
[vars$
|
|
5820
|
-
[vars$
|
|
5821
|
-
[vars$
|
|
5853
|
+
[vars$A.fontSize]: useVar(vars$C.fontSize),
|
|
5854
|
+
[vars$A.fontWeight]: useVar(vars$C.fontWeight),
|
|
5855
|
+
[vars$A.fontFamily]: useVar(vars$C.fontFamily),
|
|
5822
5856
|
|
|
5823
|
-
[vars$
|
|
5824
|
-
[vars$
|
|
5825
|
-
[vars$
|
|
5857
|
+
[vars$A.linkColor]: useVar(vars$B.textColor),
|
|
5858
|
+
[vars$A.linkTextDecoration]: 'none',
|
|
5859
|
+
[vars$A.linkHoverTextDecoration]: 'underline',
|
|
5826
5860
|
|
|
5827
|
-
[vars$
|
|
5828
|
-
[vars$
|
|
5829
|
-
[vars$
|
|
5861
|
+
[vars$A.fontWeightBold]: '900',
|
|
5862
|
+
[vars$A.minWidth]: '0.25em',
|
|
5863
|
+
[vars$A.minHeight]: '1.35em',
|
|
5830
5864
|
|
|
5831
|
-
[vars$
|
|
5865
|
+
[vars$A.hostDisplay]: 'inline-block',
|
|
5832
5866
|
|
|
5833
5867
|
_empty: {
|
|
5834
5868
|
_hideWhenEmpty: {
|
|
5835
|
-
[vars$
|
|
5869
|
+
[vars$A.hostDisplay]: 'none',
|
|
5836
5870
|
},
|
|
5837
5871
|
},
|
|
5838
5872
|
};
|
|
@@ -5840,11 +5874,11 @@ const enrichedText = {
|
|
|
5840
5874
|
var enrichedText$1 = /*#__PURE__*/Object.freeze({
|
|
5841
5875
|
__proto__: null,
|
|
5842
5876
|
default: enrichedText,
|
|
5843
|
-
vars: vars$
|
|
5877
|
+
vars: vars$A
|
|
5844
5878
|
});
|
|
5845
5879
|
|
|
5846
|
-
const componentName$
|
|
5847
|
-
class RawDivider extends createBaseClass({ componentName: componentName$
|
|
5880
|
+
const componentName$H = getComponentName('divider');
|
|
5881
|
+
class RawDivider extends createBaseClass({ componentName: componentName$H, baseSelector: ':host > div' }) {
|
|
5848
5882
|
constructor() {
|
|
5849
5883
|
super();
|
|
5850
5884
|
|
|
@@ -5943,7 +5977,7 @@ const DividerClass = compose(
|
|
|
5943
5977
|
componentNameValidationMixin
|
|
5944
5978
|
)(RawDivider);
|
|
5945
5979
|
|
|
5946
|
-
const globalRefs$
|
|
5980
|
+
const globalRefs$p = getThemeRefs(globals);
|
|
5947
5981
|
const compVars$4 = DividerClass.cssVarList;
|
|
5948
5982
|
|
|
5949
5983
|
const [helperTheme$2, helperRefs$2, helperVars$2] = createHelperVars(
|
|
@@ -5951,18 +5985,18 @@ const [helperTheme$2, helperRefs$2, helperVars$2] = createHelperVars(
|
|
|
5951
5985
|
thickness: '2px',
|
|
5952
5986
|
spacing: '10px',
|
|
5953
5987
|
},
|
|
5954
|
-
componentName$
|
|
5988
|
+
componentName$H
|
|
5955
5989
|
);
|
|
5956
5990
|
|
|
5957
5991
|
const divider = {
|
|
5958
5992
|
...helperTheme$2,
|
|
5959
5993
|
|
|
5960
|
-
[compVars$4.hostDirection]: globalRefs$
|
|
5994
|
+
[compVars$4.hostDirection]: globalRefs$p.direction,
|
|
5961
5995
|
[compVars$4.alignItems]: 'center',
|
|
5962
5996
|
[compVars$4.flexDirection]: 'row',
|
|
5963
5997
|
[compVars$4.alignSelf]: 'stretch',
|
|
5964
5998
|
[compVars$4.hostWidth]: '100%',
|
|
5965
|
-
[compVars$4.stripeColor]: globalRefs$
|
|
5999
|
+
[compVars$4.stripeColor]: globalRefs$p.colors.surface.light,
|
|
5966
6000
|
[compVars$4.stripeColorOpacity]: '0.5',
|
|
5967
6001
|
[compVars$4.stripeHorizontalThickness]: helperRefs$2.thickness,
|
|
5968
6002
|
[compVars$4.labelTextWidth]: 'fit-content',
|
|
@@ -5982,7 +6016,7 @@ const divider = {
|
|
|
5982
6016
|
},
|
|
5983
6017
|
};
|
|
5984
6018
|
|
|
5985
|
-
const vars$
|
|
6019
|
+
const vars$z = {
|
|
5986
6020
|
...compVars$4,
|
|
5987
6021
|
...helperVars$2,
|
|
5988
6022
|
};
|
|
@@ -5990,18 +6024,18 @@ const vars$y = {
|
|
|
5990
6024
|
var divider$1 = /*#__PURE__*/Object.freeze({
|
|
5991
6025
|
__proto__: null,
|
|
5992
6026
|
default: divider,
|
|
5993
|
-
vars: vars$
|
|
6027
|
+
vars: vars$z
|
|
5994
6028
|
});
|
|
5995
6029
|
|
|
5996
6030
|
/* eslint-disable no-param-reassign */
|
|
5997
6031
|
|
|
5998
|
-
const componentName$
|
|
6032
|
+
const componentName$G = getComponentName('passcode-internal');
|
|
5999
6033
|
|
|
6000
|
-
createBaseInputClass({ componentName: componentName$
|
|
6034
|
+
createBaseInputClass({ componentName: componentName$G, baseSelector: 'div' });
|
|
6001
6035
|
|
|
6002
|
-
const componentName$
|
|
6036
|
+
const componentName$F = getComponentName('loader-radial');
|
|
6003
6037
|
|
|
6004
|
-
class RawLoaderRadial extends createBaseClass({ componentName: componentName$
|
|
6038
|
+
class RawLoaderRadial extends createBaseClass({ componentName: componentName$F, baseSelector: ':host > div' }) {
|
|
6005
6039
|
constructor() {
|
|
6006
6040
|
super();
|
|
6007
6041
|
|
|
@@ -6045,7 +6079,7 @@ const LoaderRadialClass = compose(
|
|
|
6045
6079
|
componentNameValidationMixin
|
|
6046
6080
|
)(RawLoaderRadial);
|
|
6047
6081
|
|
|
6048
|
-
const componentName$
|
|
6082
|
+
const componentName$E = getComponentName('passcode');
|
|
6049
6083
|
|
|
6050
6084
|
const observedAttributes$3 = ['digits'];
|
|
6051
6085
|
|
|
@@ -6064,17 +6098,17 @@ const customMixin$9 = (superclass) =>
|
|
|
6064
6098
|
const template = document.createElement('template');
|
|
6065
6099
|
|
|
6066
6100
|
template.innerHTML = `
|
|
6067
|
-
<${componentName$
|
|
6101
|
+
<${componentName$G}
|
|
6068
6102
|
bordered="true"
|
|
6069
6103
|
name="code"
|
|
6070
6104
|
tabindex="-1"
|
|
6071
6105
|
slot="input"
|
|
6072
|
-
><slot></slot></${componentName$
|
|
6106
|
+
><slot></slot></${componentName$G}>
|
|
6073
6107
|
`;
|
|
6074
6108
|
|
|
6075
6109
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
|
6076
6110
|
|
|
6077
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
|
6111
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$G);
|
|
6078
6112
|
|
|
6079
6113
|
forwardAttrs(this, this.inputElement, { includeAttrs: ['digits', 'size', 'loading'] });
|
|
6080
6114
|
}
|
|
@@ -6226,56 +6260,56 @@ const PasscodeClass = compose(
|
|
|
6226
6260
|
${resetInputCursor('vaadin-text-field')}
|
|
6227
6261
|
`,
|
|
6228
6262
|
excludeAttrsSync: ['tabindex'],
|
|
6229
|
-
componentName: componentName$
|
|
6263
|
+
componentName: componentName$E,
|
|
6230
6264
|
})
|
|
6231
6265
|
);
|
|
6232
6266
|
|
|
6233
|
-
const vars$
|
|
6267
|
+
const vars$y = PasscodeClass.cssVarList;
|
|
6234
6268
|
|
|
6235
6269
|
const passcode = {
|
|
6236
|
-
[vars$
|
|
6237
|
-
[vars$
|
|
6238
|
-
[vars$
|
|
6239
|
-
[vars$
|
|
6240
|
-
[vars$
|
|
6241
|
-
[vars$
|
|
6242
|
-
[vars$
|
|
6243
|
-
[vars$
|
|
6244
|
-
[vars$
|
|
6245
|
-
[vars$
|
|
6246
|
-
[vars$
|
|
6247
|
-
[vars$
|
|
6248
|
-
[vars$
|
|
6249
|
-
[vars$
|
|
6250
|
-
[vars$
|
|
6270
|
+
[vars$y.hostDirection]: refs.direction,
|
|
6271
|
+
[vars$y.fontFamily]: refs.fontFamily,
|
|
6272
|
+
[vars$y.fontSize]: refs.fontSize,
|
|
6273
|
+
[vars$y.labelTextColor]: refs.labelTextColor,
|
|
6274
|
+
[vars$y.labelRequiredIndicator]: refs.requiredIndicator,
|
|
6275
|
+
[vars$y.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
6276
|
+
[vars$y.digitValueTextColor]: refs.valueTextColor,
|
|
6277
|
+
[vars$y.digitPadding]: '0',
|
|
6278
|
+
[vars$y.digitTextAlign]: 'center',
|
|
6279
|
+
[vars$y.digitSpacing]: '4px',
|
|
6280
|
+
[vars$y.hostWidth]: refs.width,
|
|
6281
|
+
[vars$y.digitOutlineColor]: 'transparent',
|
|
6282
|
+
[vars$y.digitOutlineWidth]: refs.outlineWidth,
|
|
6283
|
+
[vars$y.focusedDigitFieldOutlineColor]: refs.outlineColor,
|
|
6284
|
+
[vars$y.digitSize]: refs.inputHeight,
|
|
6251
6285
|
|
|
6252
6286
|
size: {
|
|
6253
|
-
xs: { [vars$
|
|
6254
|
-
sm: { [vars$
|
|
6255
|
-
md: { [vars$
|
|
6256
|
-
lg: { [vars$
|
|
6287
|
+
xs: { [vars$y.spinnerSize]: '15px' },
|
|
6288
|
+
sm: { [vars$y.spinnerSize]: '20px' },
|
|
6289
|
+
md: { [vars$y.spinnerSize]: '20px' },
|
|
6290
|
+
lg: { [vars$y.spinnerSize]: '20px' },
|
|
6257
6291
|
},
|
|
6258
6292
|
|
|
6259
6293
|
_hideCursor: {
|
|
6260
|
-
[vars$
|
|
6294
|
+
[vars$y.digitCaretTextColor]: 'transparent',
|
|
6261
6295
|
},
|
|
6262
6296
|
|
|
6263
6297
|
_loading: {
|
|
6264
|
-
[vars$
|
|
6298
|
+
[vars$y.overlayOpacity]: refs.overlayOpacity,
|
|
6265
6299
|
},
|
|
6266
6300
|
};
|
|
6267
6301
|
|
|
6268
6302
|
var passcode$1 = /*#__PURE__*/Object.freeze({
|
|
6269
6303
|
__proto__: null,
|
|
6270
6304
|
default: passcode,
|
|
6271
|
-
vars: vars$
|
|
6305
|
+
vars: vars$y
|
|
6272
6306
|
});
|
|
6273
6307
|
|
|
6274
|
-
const componentName$
|
|
6308
|
+
const componentName$D = getComponentName('loader-linear');
|
|
6275
6309
|
|
|
6276
|
-
class RawLoaderLinear extends createBaseClass({ componentName: componentName$
|
|
6310
|
+
class RawLoaderLinear extends createBaseClass({ componentName: componentName$D, baseSelector: ':host > div' }) {
|
|
6277
6311
|
static get componentName() {
|
|
6278
|
-
return componentName$
|
|
6312
|
+
return componentName$D;
|
|
6279
6313
|
}
|
|
6280
6314
|
|
|
6281
6315
|
constructor() {
|
|
@@ -6336,67 +6370,67 @@ const LoaderLinearClass = compose(
|
|
|
6336
6370
|
componentNameValidationMixin
|
|
6337
6371
|
)(RawLoaderLinear);
|
|
6338
6372
|
|
|
6339
|
-
const globalRefs$
|
|
6340
|
-
const vars$
|
|
6373
|
+
const globalRefs$o = getThemeRefs(globals);
|
|
6374
|
+
const vars$x = LoaderLinearClass.cssVarList;
|
|
6341
6375
|
|
|
6342
6376
|
const loaderLinear = {
|
|
6343
|
-
[vars$
|
|
6344
|
-
[vars$
|
|
6377
|
+
[vars$x.hostDisplay]: 'inline-block',
|
|
6378
|
+
[vars$x.hostWidth]: '100%',
|
|
6345
6379
|
|
|
6346
|
-
[vars$
|
|
6347
|
-
[vars$
|
|
6380
|
+
[vars$x.barColor]: globalRefs$o.colors.surface.contrast,
|
|
6381
|
+
[vars$x.barWidth]: '20%',
|
|
6348
6382
|
|
|
6349
|
-
[vars$
|
|
6350
|
-
[vars$
|
|
6383
|
+
[vars$x.barBackgroundColor]: globalRefs$o.colors.surface.light,
|
|
6384
|
+
[vars$x.barBorderRadius]: '4px',
|
|
6351
6385
|
|
|
6352
|
-
[vars$
|
|
6353
|
-
[vars$
|
|
6354
|
-
[vars$
|
|
6355
|
-
[vars$
|
|
6386
|
+
[vars$x.animationDuration]: '2s',
|
|
6387
|
+
[vars$x.animationTimingFunction]: 'linear',
|
|
6388
|
+
[vars$x.animationIterationCount]: 'infinite',
|
|
6389
|
+
[vars$x.verticalPadding]: '0.25em',
|
|
6356
6390
|
|
|
6357
6391
|
size: {
|
|
6358
|
-
xs: { [vars$
|
|
6359
|
-
sm: { [vars$
|
|
6360
|
-
md: { [vars$
|
|
6361
|
-
lg: { [vars$
|
|
6392
|
+
xs: { [vars$x.barHeight]: '2px' },
|
|
6393
|
+
sm: { [vars$x.barHeight]: '4px' },
|
|
6394
|
+
md: { [vars$x.barHeight]: '6px' },
|
|
6395
|
+
lg: { [vars$x.barHeight]: '8px' },
|
|
6362
6396
|
},
|
|
6363
6397
|
|
|
6364
6398
|
mode: {
|
|
6365
6399
|
primary: {
|
|
6366
|
-
[vars$
|
|
6400
|
+
[vars$x.barColor]: globalRefs$o.colors.primary.main,
|
|
6367
6401
|
},
|
|
6368
6402
|
secondary: {
|
|
6369
|
-
[vars$
|
|
6403
|
+
[vars$x.barColor]: globalRefs$o.colors.secondary.main,
|
|
6370
6404
|
},
|
|
6371
6405
|
},
|
|
6372
6406
|
|
|
6373
6407
|
_hidden: {
|
|
6374
|
-
[vars$
|
|
6408
|
+
[vars$x.hostDisplay]: 'none',
|
|
6375
6409
|
},
|
|
6376
6410
|
};
|
|
6377
6411
|
|
|
6378
6412
|
var loaderLinear$1 = /*#__PURE__*/Object.freeze({
|
|
6379
6413
|
__proto__: null,
|
|
6380
6414
|
default: loaderLinear,
|
|
6381
|
-
vars: vars$
|
|
6415
|
+
vars: vars$x
|
|
6382
6416
|
});
|
|
6383
6417
|
|
|
6384
|
-
const globalRefs$
|
|
6418
|
+
const globalRefs$n = getThemeRefs(globals);
|
|
6385
6419
|
const compVars$3 = LoaderRadialClass.cssVarList;
|
|
6386
6420
|
|
|
6387
6421
|
const [helperTheme$1, helperRefs$1, helperVars$1] = createHelperVars(
|
|
6388
6422
|
{
|
|
6389
|
-
spinnerColor: globalRefs$
|
|
6423
|
+
spinnerColor: globalRefs$n.colors.surface.contrast,
|
|
6390
6424
|
mode: {
|
|
6391
6425
|
primary: {
|
|
6392
|
-
spinnerColor: globalRefs$
|
|
6426
|
+
spinnerColor: globalRefs$n.colors.primary.main,
|
|
6393
6427
|
},
|
|
6394
6428
|
secondary: {
|
|
6395
|
-
spinnerColor: globalRefs$
|
|
6429
|
+
spinnerColor: globalRefs$n.colors.secondary.main,
|
|
6396
6430
|
},
|
|
6397
6431
|
},
|
|
6398
6432
|
},
|
|
6399
|
-
componentName$
|
|
6433
|
+
componentName$F
|
|
6400
6434
|
);
|
|
6401
6435
|
|
|
6402
6436
|
const loaderRadial = {
|
|
@@ -6425,7 +6459,7 @@ const loaderRadial = {
|
|
|
6425
6459
|
[compVars$3.hostDisplay]: 'none',
|
|
6426
6460
|
},
|
|
6427
6461
|
};
|
|
6428
|
-
const vars$
|
|
6462
|
+
const vars$w = {
|
|
6429
6463
|
...compVars$3,
|
|
6430
6464
|
...helperVars$1,
|
|
6431
6465
|
};
|
|
@@ -6433,10 +6467,10 @@ const vars$v = {
|
|
|
6433
6467
|
var loaderRadial$1 = /*#__PURE__*/Object.freeze({
|
|
6434
6468
|
__proto__: null,
|
|
6435
6469
|
default: loaderRadial,
|
|
6436
|
-
vars: vars$
|
|
6470
|
+
vars: vars$w
|
|
6437
6471
|
});
|
|
6438
6472
|
|
|
6439
|
-
const componentName$
|
|
6473
|
+
const componentName$C = getComponentName('combo-box');
|
|
6440
6474
|
|
|
6441
6475
|
const ComboBoxMixin = (superclass) =>
|
|
6442
6476
|
class ComboBoxMixinClass extends superclass {
|
|
@@ -6881,83 +6915,83 @@ const ComboBoxClass = compose(
|
|
|
6881
6915
|
// and reset items to an empty array, and opening the list box with no items
|
|
6882
6916
|
// to display.
|
|
6883
6917
|
excludeAttrsSync: ['tabindex', 'size', 'data'],
|
|
6884
|
-
componentName: componentName$
|
|
6918
|
+
componentName: componentName$C,
|
|
6885
6919
|
includeForwardProps: ['items', 'renderer', 'selectedItem'],
|
|
6886
6920
|
})
|
|
6887
6921
|
);
|
|
6888
6922
|
|
|
6889
|
-
const globalRefs$
|
|
6890
|
-
const vars$
|
|
6923
|
+
const globalRefs$m = getThemeRefs(globals);
|
|
6924
|
+
const vars$v = ComboBoxClass.cssVarList;
|
|
6891
6925
|
|
|
6892
6926
|
const comboBox = {
|
|
6893
|
-
[vars$
|
|
6894
|
-
[vars$
|
|
6895
|
-
[vars$
|
|
6896
|
-
[vars$
|
|
6897
|
-
[vars$
|
|
6898
|
-
[vars$
|
|
6899
|
-
[vars$
|
|
6900
|
-
[vars$
|
|
6901
|
-
[vars$
|
|
6902
|
-
[vars$
|
|
6903
|
-
[vars$
|
|
6904
|
-
[vars$
|
|
6905
|
-
[vars$
|
|
6906
|
-
[vars$
|
|
6907
|
-
[vars$
|
|
6908
|
-
[vars$
|
|
6909
|
-
[vars$
|
|
6910
|
-
[vars$
|
|
6911
|
-
[vars$
|
|
6912
|
-
[vars$
|
|
6913
|
-
[vars$
|
|
6914
|
-
[vars$
|
|
6915
|
-
[vars$
|
|
6916
|
-
[vars$
|
|
6917
|
-
[vars$
|
|
6918
|
-
[vars$
|
|
6919
|
-
[vars$
|
|
6920
|
-
[vars$
|
|
6921
|
-
[vars$
|
|
6922
|
-
[vars$
|
|
6923
|
-
[vars$
|
|
6924
|
-
[vars$
|
|
6925
|
-
[vars$
|
|
6926
|
-
[vars$
|
|
6927
|
-
[vars$
|
|
6928
|
-
[vars$
|
|
6929
|
-
[vars$
|
|
6930
|
-
[vars$
|
|
6927
|
+
[vars$v.hostWidth]: refs.width,
|
|
6928
|
+
[vars$v.hostDirection]: refs.direction,
|
|
6929
|
+
[vars$v.fontSize]: refs.fontSize,
|
|
6930
|
+
[vars$v.fontFamily]: refs.fontFamily,
|
|
6931
|
+
[vars$v.labelFontSize]: refs.labelFontSize,
|
|
6932
|
+
[vars$v.labelFontWeight]: refs.labelFontWeight,
|
|
6933
|
+
[vars$v.labelTextColor]: refs.labelTextColor,
|
|
6934
|
+
[vars$v.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
6935
|
+
[vars$v.inputBorderColor]: refs.borderColor,
|
|
6936
|
+
[vars$v.inputBorderWidth]: refs.borderWidth,
|
|
6937
|
+
[vars$v.inputBorderStyle]: refs.borderStyle,
|
|
6938
|
+
[vars$v.inputBorderRadius]: refs.borderRadius,
|
|
6939
|
+
[vars$v.inputOutlineColor]: refs.outlineColor,
|
|
6940
|
+
[vars$v.inputOutlineOffset]: refs.outlineOffset,
|
|
6941
|
+
[vars$v.inputOutlineWidth]: refs.outlineWidth,
|
|
6942
|
+
[vars$v.inputOutlineStyle]: refs.outlineStyle,
|
|
6943
|
+
[vars$v.labelRequiredIndicator]: refs.requiredIndicator,
|
|
6944
|
+
[vars$v.inputValueTextColor]: refs.valueTextColor,
|
|
6945
|
+
[vars$v.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
|
6946
|
+
[vars$v.inputBackgroundColor]: refs.backgroundColor,
|
|
6947
|
+
[vars$v.inputHorizontalPadding]: refs.horizontalPadding,
|
|
6948
|
+
[vars$v.inputHeight]: refs.inputHeight,
|
|
6949
|
+
[vars$v.inputDropdownButtonColor]: globalRefs$m.colors.surface.dark,
|
|
6950
|
+
[vars$v.inputDropdownButtonCursor]: 'pointer',
|
|
6951
|
+
[vars$v.inputDropdownButtonSize]: refs.toggleButtonSize,
|
|
6952
|
+
[vars$v.inputDropdownButtonOffset]: globalRefs$m.spacing.xs,
|
|
6953
|
+
[vars$v.overlayItemPaddingInlineStart]: globalRefs$m.spacing.xs,
|
|
6954
|
+
[vars$v.overlayItemPaddingInlineEnd]: globalRefs$m.spacing.lg,
|
|
6955
|
+
[vars$v.labelPosition]: refs.labelPosition,
|
|
6956
|
+
[vars$v.labelTopPosition]: refs.labelTopPosition,
|
|
6957
|
+
[vars$v.labelHorizontalPosition]: refs.labelHorizontalPosition,
|
|
6958
|
+
[vars$v.inputTransformY]: refs.inputTransformY,
|
|
6959
|
+
[vars$v.inputTransition]: refs.inputTransition,
|
|
6960
|
+
[vars$v.marginInlineStart]: refs.marginInlineStart,
|
|
6961
|
+
[vars$v.placeholderOpacity]: refs.placeholderOpacity,
|
|
6962
|
+
[vars$v.inputVerticalAlignment]: refs.inputVerticalAlignment,
|
|
6963
|
+
[vars$v.valueInputHeight]: refs.valueInputHeight,
|
|
6964
|
+
[vars$v.valueInputMarginBottom]: refs.valueInputMarginBottom,
|
|
6931
6965
|
|
|
6932
6966
|
_readonly: {
|
|
6933
|
-
[vars$
|
|
6967
|
+
[vars$v.inputDropdownButtonCursor]: 'default',
|
|
6934
6968
|
},
|
|
6935
6969
|
|
|
6936
6970
|
// Overlay theme exposed via the component:
|
|
6937
|
-
[vars$
|
|
6938
|
-
[vars$
|
|
6939
|
-
[vars$
|
|
6940
|
-
[vars$
|
|
6941
|
-
[vars$
|
|
6942
|
-
[vars$
|
|
6971
|
+
[vars$v.overlayFontSize]: refs.fontSize,
|
|
6972
|
+
[vars$v.overlayFontFamily]: refs.fontFamily,
|
|
6973
|
+
[vars$v.overlayCursor]: 'pointer',
|
|
6974
|
+
[vars$v.overlayItemBoxShadow]: 'none',
|
|
6975
|
+
[vars$v.overlayBackground]: refs.backgroundColor,
|
|
6976
|
+
[vars$v.overlayTextColor]: refs.valueTextColor,
|
|
6943
6977
|
|
|
6944
6978
|
// Overlay direct theme:
|
|
6945
|
-
[vars$
|
|
6946
|
-
[vars$
|
|
6979
|
+
[vars$v.overlay.minHeight]: '400px',
|
|
6980
|
+
[vars$v.overlay.margin]: '0',
|
|
6947
6981
|
};
|
|
6948
6982
|
|
|
6949
6983
|
var comboBox$1 = /*#__PURE__*/Object.freeze({
|
|
6950
6984
|
__proto__: null,
|
|
6951
6985
|
comboBox: comboBox,
|
|
6952
6986
|
default: comboBox,
|
|
6953
|
-
vars: vars$
|
|
6987
|
+
vars: vars$v
|
|
6954
6988
|
});
|
|
6955
6989
|
|
|
6956
6990
|
const observedAttributes$2 = ['src', 'alt'];
|
|
6957
6991
|
|
|
6958
|
-
const componentName$
|
|
6992
|
+
const componentName$B = getComponentName('image');
|
|
6959
6993
|
|
|
6960
|
-
const BaseClass$1 = createBaseClass({ componentName: componentName$
|
|
6994
|
+
const BaseClass$1 = createBaseClass({ componentName: componentName$B, baseSelector: ':host > img' });
|
|
6961
6995
|
class RawImage extends BaseClass$1 {
|
|
6962
6996
|
static get observedAttributes() {
|
|
6963
6997
|
return observedAttributes$2.concat(BaseClass$1.observedAttributes || []);
|
|
@@ -6997,14 +7031,14 @@ const ImageClass = compose(
|
|
|
6997
7031
|
draggableMixin
|
|
6998
7032
|
)(RawImage);
|
|
6999
7033
|
|
|
7000
|
-
const vars$
|
|
7034
|
+
const vars$u = ImageClass.cssVarList;
|
|
7001
7035
|
|
|
7002
7036
|
const image = {};
|
|
7003
7037
|
|
|
7004
7038
|
var image$1 = /*#__PURE__*/Object.freeze({
|
|
7005
7039
|
__proto__: null,
|
|
7006
7040
|
default: image,
|
|
7007
|
-
vars: vars$
|
|
7041
|
+
vars: vars$u
|
|
7008
7042
|
});
|
|
7009
7043
|
|
|
7010
7044
|
var CountryCodes = [
|
|
@@ -8223,14 +8257,14 @@ var CountryCodes = [
|
|
|
8223
8257
|
].sort((a, b) => (a.name < b.name ? -1 : 1)),
|
|
8224
8258
|
];
|
|
8225
8259
|
|
|
8226
|
-
const componentName$
|
|
8260
|
+
const componentName$A = getComponentName('phone-field-internal');
|
|
8227
8261
|
|
|
8228
|
-
createBaseInputClass({ componentName: componentName$
|
|
8262
|
+
createBaseInputClass({ componentName: componentName$A, baseSelector: 'div' });
|
|
8229
8263
|
|
|
8230
8264
|
const textVars$2 = TextFieldClass.cssVarList;
|
|
8231
8265
|
const comboVars = ComboBoxClass.cssVarList;
|
|
8232
8266
|
|
|
8233
|
-
const componentName$
|
|
8267
|
+
const componentName$z = getComponentName('phone-field');
|
|
8234
8268
|
|
|
8235
8269
|
const customMixin$8 = (superclass) =>
|
|
8236
8270
|
class PhoneFieldMixinClass extends superclass {
|
|
@@ -8244,15 +8278,15 @@ const customMixin$8 = (superclass) =>
|
|
|
8244
8278
|
const template = document.createElement('template');
|
|
8245
8279
|
|
|
8246
8280
|
template.innerHTML = `
|
|
8247
|
-
<${componentName$
|
|
8281
|
+
<${componentName$A}
|
|
8248
8282
|
tabindex="-1"
|
|
8249
8283
|
slot="input"
|
|
8250
|
-
></${componentName$
|
|
8284
|
+
></${componentName$A}>
|
|
8251
8285
|
`;
|
|
8252
8286
|
|
|
8253
8287
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
|
8254
8288
|
|
|
8255
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
|
8289
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$A);
|
|
8256
8290
|
|
|
8257
8291
|
forwardAttrs(this.shadowRoot.host, this.inputElement, {
|
|
8258
8292
|
includeAttrs: [
|
|
@@ -8471,39 +8505,39 @@ const PhoneFieldClass = compose(
|
|
|
8471
8505
|
vaadin-text-field::part(input-field)::after {
|
|
8472
8506
|
border: none;
|
|
8473
8507
|
}
|
|
8474
|
-
${resetInputLabelPosition('vaadin-text-field')}
|
|
8475
|
-
`,
|
|
8476
|
-
excludeAttrsSync: ['tabindex'],
|
|
8477
|
-
componentName: componentName$
|
|
8478
|
-
})
|
|
8479
|
-
);
|
|
8480
|
-
|
|
8481
|
-
const vars$
|
|
8482
|
-
|
|
8483
|
-
const phoneField = {
|
|
8484
|
-
[vars$
|
|
8485
|
-
[vars$
|
|
8486
|
-
[vars$
|
|
8487
|
-
[vars$
|
|
8488
|
-
[vars$
|
|
8489
|
-
[vars$
|
|
8490
|
-
[vars$
|
|
8491
|
-
[vars$
|
|
8492
|
-
[vars$
|
|
8493
|
-
[vars$
|
|
8494
|
-
[vars$
|
|
8495
|
-
[vars$
|
|
8496
|
-
[vars$
|
|
8497
|
-
[vars$
|
|
8498
|
-
[vars$
|
|
8499
|
-
[vars$
|
|
8500
|
-
[vars$
|
|
8501
|
-
[vars$
|
|
8502
|
-
[vars$
|
|
8503
|
-
[vars$
|
|
8504
|
-
[vars$
|
|
8505
|
-
[vars$
|
|
8506
|
-
[vars$
|
|
8508
|
+
${resetInputLabelPosition('vaadin-text-field')}
|
|
8509
|
+
`,
|
|
8510
|
+
excludeAttrsSync: ['tabindex'],
|
|
8511
|
+
componentName: componentName$z,
|
|
8512
|
+
})
|
|
8513
|
+
);
|
|
8514
|
+
|
|
8515
|
+
const vars$t = PhoneFieldClass.cssVarList;
|
|
8516
|
+
|
|
8517
|
+
const phoneField = {
|
|
8518
|
+
[vars$t.hostWidth]: refs.width,
|
|
8519
|
+
[vars$t.hostDirection]: refs.direction,
|
|
8520
|
+
[vars$t.fontSize]: refs.fontSize,
|
|
8521
|
+
[vars$t.fontFamily]: refs.fontFamily,
|
|
8522
|
+
[vars$t.labelTextColor]: refs.labelTextColor,
|
|
8523
|
+
[vars$t.labelRequiredIndicator]: refs.requiredIndicator,
|
|
8524
|
+
[vars$t.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
8525
|
+
[vars$t.inputValueTextColor]: refs.valueTextColor,
|
|
8526
|
+
[vars$t.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
|
8527
|
+
[vars$t.inputBorderStyle]: refs.borderStyle,
|
|
8528
|
+
[vars$t.inputBorderWidth]: refs.borderWidth,
|
|
8529
|
+
[vars$t.inputBorderColor]: refs.borderColor,
|
|
8530
|
+
[vars$t.inputBorderRadius]: refs.borderRadius,
|
|
8531
|
+
[vars$t.inputOutlineStyle]: refs.outlineStyle,
|
|
8532
|
+
[vars$t.inputOutlineWidth]: refs.outlineWidth,
|
|
8533
|
+
[vars$t.inputOutlineColor]: refs.outlineColor,
|
|
8534
|
+
[vars$t.inputOutlineOffset]: refs.outlineOffset,
|
|
8535
|
+
[vars$t.phoneInputWidth]: refs.minWidth,
|
|
8536
|
+
[vars$t.countryCodeInputWidth]: '5em',
|
|
8537
|
+
[vars$t.countryCodeDropdownWidth]: '20em',
|
|
8538
|
+
[vars$t.marginInlineStart]: '-0.25em',
|
|
8539
|
+
[vars$t.valueInputHeight]: refs.valueInputHeight,
|
|
8540
|
+
[vars$t.valueInputMarginBottom]: refs.valueInputMarginBottom,
|
|
8507
8541
|
|
|
8508
8542
|
// '@overlay': {
|
|
8509
8543
|
// overlayItemBackgroundColor: 'red'
|
|
@@ -8513,16 +8547,16 @@ const phoneField = {
|
|
|
8513
8547
|
var phoneField$1 = /*#__PURE__*/Object.freeze({
|
|
8514
8548
|
__proto__: null,
|
|
8515
8549
|
default: phoneField,
|
|
8516
|
-
vars: vars$
|
|
8550
|
+
vars: vars$t
|
|
8517
8551
|
});
|
|
8518
8552
|
|
|
8519
|
-
const componentName$
|
|
8553
|
+
const componentName$y = getComponentName('phone-field-internal-input-box');
|
|
8520
8554
|
|
|
8521
|
-
createBaseInputClass({ componentName: componentName$
|
|
8555
|
+
createBaseInputClass({ componentName: componentName$y, baseSelector: 'div' });
|
|
8522
8556
|
|
|
8523
8557
|
const textVars$1 = TextFieldClass.cssVarList;
|
|
8524
8558
|
|
|
8525
|
-
const componentName$
|
|
8559
|
+
const componentName$x = getComponentName('phone-input-box-field');
|
|
8526
8560
|
|
|
8527
8561
|
const customMixin$7 = (superclass) =>
|
|
8528
8562
|
class PhoneInputBoxFieldMixinClass extends superclass {
|
|
@@ -8536,15 +8570,15 @@ const customMixin$7 = (superclass) =>
|
|
|
8536
8570
|
const template = document.createElement('template');
|
|
8537
8571
|
|
|
8538
8572
|
template.innerHTML = `
|
|
8539
|
-
<${componentName$
|
|
8573
|
+
<${componentName$y}
|
|
8540
8574
|
tabindex="-1"
|
|
8541
8575
|
slot="input"
|
|
8542
|
-
></${componentName$
|
|
8576
|
+
></${componentName$y}>
|
|
8543
8577
|
`;
|
|
8544
8578
|
|
|
8545
8579
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
|
8546
8580
|
|
|
8547
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
|
8581
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$y);
|
|
8548
8582
|
|
|
8549
8583
|
forwardAttrs(this.shadowRoot.host, this.inputElement, {
|
|
8550
8584
|
includeAttrs: [
|
|
@@ -8721,68 +8755,68 @@ const PhoneFieldInputBoxClass = compose(
|
|
|
8721
8755
|
${inputFloatingLabelStyle()}
|
|
8722
8756
|
`,
|
|
8723
8757
|
excludeAttrsSync: ['tabindex'],
|
|
8724
|
-
componentName: componentName$
|
|
8758
|
+
componentName: componentName$x,
|
|
8725
8759
|
})
|
|
8726
8760
|
);
|
|
8727
8761
|
|
|
8728
|
-
const vars$
|
|
8762
|
+
const vars$s = PhoneFieldInputBoxClass.cssVarList;
|
|
8729
8763
|
|
|
8730
8764
|
const phoneInputBoxField = {
|
|
8731
|
-
[vars$
|
|
8732
|
-
[vars$
|
|
8733
|
-
[vars$
|
|
8734
|
-
[vars$
|
|
8735
|
-
[vars$
|
|
8736
|
-
[vars$
|
|
8737
|
-
[vars$
|
|
8738
|
-
[vars$
|
|
8739
|
-
[vars$
|
|
8740
|
-
[vars$
|
|
8741
|
-
[vars$
|
|
8742
|
-
[vars$
|
|
8743
|
-
[vars$
|
|
8744
|
-
[vars$
|
|
8745
|
-
[vars$
|
|
8746
|
-
[vars$
|
|
8747
|
-
[vars$
|
|
8748
|
-
[vars$
|
|
8749
|
-
[vars$
|
|
8750
|
-
[vars$
|
|
8751
|
-
[vars$
|
|
8752
|
-
[vars$
|
|
8753
|
-
[vars$
|
|
8754
|
-
[vars$
|
|
8755
|
-
[vars$
|
|
8756
|
-
[vars$
|
|
8757
|
-
[vars$
|
|
8758
|
-
[vars$
|
|
8759
|
-
[vars$
|
|
8765
|
+
[vars$s.hostWidth]: '16em',
|
|
8766
|
+
[vars$s.hostMinWidth]: refs.minWidth,
|
|
8767
|
+
[vars$s.hostDirection]: refs.direction,
|
|
8768
|
+
[vars$s.fontSize]: refs.fontSize,
|
|
8769
|
+
[vars$s.fontFamily]: refs.fontFamily,
|
|
8770
|
+
[vars$s.labelFontSize]: refs.labelFontSize,
|
|
8771
|
+
[vars$s.labelFontWeight]: refs.labelFontWeight,
|
|
8772
|
+
[vars$s.labelTextColor]: refs.labelTextColor,
|
|
8773
|
+
[vars$s.labelRequiredIndicator]: refs.requiredIndicator,
|
|
8774
|
+
[vars$s.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
8775
|
+
[vars$s.inputValueTextColor]: refs.valueTextColor,
|
|
8776
|
+
[vars$s.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
|
8777
|
+
[vars$s.inputBorderStyle]: refs.borderStyle,
|
|
8778
|
+
[vars$s.inputBorderWidth]: refs.borderWidth,
|
|
8779
|
+
[vars$s.inputBorderColor]: refs.borderColor,
|
|
8780
|
+
[vars$s.inputBorderRadius]: refs.borderRadius,
|
|
8781
|
+
[vars$s.inputOutlineStyle]: refs.outlineStyle,
|
|
8782
|
+
[vars$s.inputOutlineWidth]: refs.outlineWidth,
|
|
8783
|
+
[vars$s.inputOutlineColor]: refs.outlineColor,
|
|
8784
|
+
[vars$s.inputOutlineOffset]: refs.outlineOffset,
|
|
8785
|
+
[vars$s.labelPosition]: refs.labelPosition,
|
|
8786
|
+
[vars$s.labelTopPosition]: refs.labelTopPosition,
|
|
8787
|
+
[vars$s.labelHorizontalPosition]: refs.labelHorizontalPosition,
|
|
8788
|
+
[vars$s.inputTransformY]: refs.inputTransformY,
|
|
8789
|
+
[vars$s.inputTransition]: refs.inputTransition,
|
|
8790
|
+
[vars$s.marginInlineStart]: refs.marginInlineStart,
|
|
8791
|
+
[vars$s.valueInputHeight]: refs.valueInputHeight,
|
|
8792
|
+
[vars$s.valueInputMarginBottom]: refs.valueInputMarginBottom,
|
|
8793
|
+
[vars$s.inputHorizontalPadding]: '0',
|
|
8760
8794
|
|
|
8761
8795
|
_fullWidth: {
|
|
8762
|
-
[vars$
|
|
8796
|
+
[vars$s.hostWidth]: refs.width,
|
|
8763
8797
|
},
|
|
8764
8798
|
};
|
|
8765
8799
|
|
|
8766
8800
|
var phoneInputBoxField$1 = /*#__PURE__*/Object.freeze({
|
|
8767
8801
|
__proto__: null,
|
|
8768
8802
|
default: phoneInputBoxField,
|
|
8769
|
-
vars: vars$
|
|
8803
|
+
vars: vars$s
|
|
8770
8804
|
});
|
|
8771
8805
|
|
|
8772
|
-
const componentName$
|
|
8806
|
+
const componentName$w = getComponentName('new-password-internal');
|
|
8773
8807
|
|
|
8774
8808
|
const interpolateString = (template, values) =>
|
|
8775
8809
|
template.replace(/{{(\w+)+}}/g, (match, key) => values?.[key] || match);
|
|
8776
8810
|
|
|
8777
8811
|
// eslint-disable-next-line max-classes-per-file
|
|
8778
8812
|
|
|
8779
|
-
const componentName$
|
|
8813
|
+
const componentName$v = getComponentName('policy-validation');
|
|
8780
8814
|
|
|
8781
8815
|
const overrideAttrs = ['data-password-policy-value-minlength'];
|
|
8782
8816
|
const dataAttrs = ['data', 'active-policies', 'overrides', ...overrideAttrs];
|
|
8783
8817
|
const policyAttrs = ['label', 'value', ...dataAttrs];
|
|
8784
8818
|
|
|
8785
|
-
class RawPolicyValidation extends createBaseClass({ componentName: componentName$
|
|
8819
|
+
class RawPolicyValidation extends createBaseClass({ componentName: componentName$v, baseSelector: ':host > div' }) {
|
|
8786
8820
|
#availablePolicies;
|
|
8787
8821
|
|
|
8788
8822
|
#activePolicies = [];
|
|
@@ -8990,7 +9024,7 @@ const PolicyValidationClass = compose(
|
|
|
8990
9024
|
componentNameValidationMixin
|
|
8991
9025
|
)(RawPolicyValidation);
|
|
8992
9026
|
|
|
8993
|
-
const componentName$
|
|
9027
|
+
const componentName$u = getComponentName('new-password');
|
|
8994
9028
|
|
|
8995
9029
|
const policyPreviewVars = PolicyValidationClass.cssVarList;
|
|
8996
9030
|
|
|
@@ -9004,18 +9038,18 @@ const customMixin$6 = (superclass) =>
|
|
|
9004
9038
|
const externalInputAttr = this.getAttribute('external-input');
|
|
9005
9039
|
|
|
9006
9040
|
template.innerHTML = `
|
|
9007
|
-
<${componentName$
|
|
9041
|
+
<${componentName$w}
|
|
9008
9042
|
name="new-password"
|
|
9009
9043
|
tabindex="-1"
|
|
9010
9044
|
slot="input"
|
|
9011
9045
|
external-input="${externalInputAttr}"
|
|
9012
9046
|
>
|
|
9013
|
-
</${componentName$
|
|
9047
|
+
</${componentName$w}>
|
|
9014
9048
|
`;
|
|
9015
9049
|
|
|
9016
9050
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
|
9017
9051
|
|
|
9018
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
|
9052
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$w);
|
|
9019
9053
|
|
|
9020
9054
|
if (this.getAttribute('external-input') === 'true') {
|
|
9021
9055
|
this.initExternalInput();
|
|
@@ -9191,40 +9225,40 @@ const NewPasswordClass = compose(
|
|
|
9191
9225
|
}
|
|
9192
9226
|
`,
|
|
9193
9227
|
excludeAttrsSync: ['tabindex'],
|
|
9194
|
-
componentName: componentName$
|
|
9228
|
+
componentName: componentName$u,
|
|
9195
9229
|
})
|
|
9196
9230
|
);
|
|
9197
9231
|
|
|
9198
|
-
const globalRefs$
|
|
9199
|
-
const vars$
|
|
9232
|
+
const globalRefs$l = getThemeRefs(globals);
|
|
9233
|
+
const vars$r = NewPasswordClass.cssVarList;
|
|
9200
9234
|
|
|
9201
9235
|
const newPassword = {
|
|
9202
|
-
[vars$
|
|
9203
|
-
[vars$
|
|
9204
|
-
[vars$
|
|
9205
|
-
[vars$
|
|
9206
|
-
[vars$
|
|
9207
|
-
[vars$
|
|
9208
|
-
[vars$
|
|
9209
|
-
[vars$
|
|
9210
|
-
[vars$
|
|
9211
|
-
[vars$
|
|
9212
|
-
[vars$
|
|
9213
|
-
[vars$
|
|
9214
|
-
[vars$
|
|
9236
|
+
[vars$r.hostWidth]: refs.width,
|
|
9237
|
+
[vars$r.hostMinWidth]: refs.minWidth,
|
|
9238
|
+
[vars$r.hostDirection]: refs.direction,
|
|
9239
|
+
[vars$r.fontSize]: refs.fontSize,
|
|
9240
|
+
[vars$r.fontFamily]: refs.fontFamily,
|
|
9241
|
+
[vars$r.labelFontSize]: refs.labelFontSize,
|
|
9242
|
+
[vars$r.labelFontWeight]: refs.labelFontWeight,
|
|
9243
|
+
[vars$r.labelTextColor]: refs.labelTextColor,
|
|
9244
|
+
[vars$r.spaceBetweenInputs]: '1em',
|
|
9245
|
+
[vars$r.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
9246
|
+
[vars$r.policyPreviewBackgroundColor]: 'none',
|
|
9247
|
+
[vars$r.policyPreviewPadding]: globalRefs$l.spacing.lg,
|
|
9248
|
+
[vars$r.valueInputHeight]: refs.valueInputHeight,
|
|
9215
9249
|
|
|
9216
9250
|
_required: {
|
|
9217
9251
|
// NewPassword doesn't pass `required` attribute to its Password components.
|
|
9218
9252
|
// That's why we fake the required indicator on each input.
|
|
9219
9253
|
// We do that by injecting `::after` element, and populating it with requiredIndicator content.
|
|
9220
|
-
[vars$
|
|
9254
|
+
[vars$r.inputsRequiredIndicator]: refs.requiredIndicator, // used to populate required content for NewPassword input fields outside the theme
|
|
9221
9255
|
},
|
|
9222
9256
|
};
|
|
9223
9257
|
|
|
9224
9258
|
var newPassword$1 = /*#__PURE__*/Object.freeze({
|
|
9225
9259
|
__proto__: null,
|
|
9226
9260
|
default: newPassword,
|
|
9227
|
-
vars: vars$
|
|
9261
|
+
vars: vars$r
|
|
9228
9262
|
});
|
|
9229
9263
|
|
|
9230
9264
|
const getFileBase64 = (fileObj) => {
|
|
@@ -9239,7 +9273,7 @@ const getFilename = (fileObj) => {
|
|
|
9239
9273
|
return fileObj.name.replace(/^.*\\/, '');
|
|
9240
9274
|
};
|
|
9241
9275
|
|
|
9242
|
-
const componentName$
|
|
9276
|
+
const componentName$t = getComponentName('upload-file');
|
|
9243
9277
|
|
|
9244
9278
|
const observedAttributes$1 = [
|
|
9245
9279
|
'title',
|
|
@@ -9254,7 +9288,7 @@ const observedAttributes$1 = [
|
|
|
9254
9288
|
'icon',
|
|
9255
9289
|
];
|
|
9256
9290
|
|
|
9257
|
-
const BaseInputClass$2 = createBaseInputClass({ componentName: componentName$
|
|
9291
|
+
const BaseInputClass$2 = createBaseInputClass({ componentName: componentName$t, baseSelector: ':host > div' });
|
|
9258
9292
|
|
|
9259
9293
|
class RawUploadFile extends BaseInputClass$2 {
|
|
9260
9294
|
static get observedAttributes() {
|
|
@@ -9469,77 +9503,77 @@ const UploadFileClass = compose(
|
|
|
9469
9503
|
componentNameValidationMixin
|
|
9470
9504
|
)(RawUploadFile);
|
|
9471
9505
|
|
|
9472
|
-
const vars$
|
|
9506
|
+
const vars$q = UploadFileClass.cssVarList;
|
|
9473
9507
|
|
|
9474
9508
|
const uploadFile = {
|
|
9475
|
-
[vars$
|
|
9476
|
-
[vars$
|
|
9477
|
-
[vars$
|
|
9509
|
+
[vars$q.hostDirection]: refs.direction,
|
|
9510
|
+
[vars$q.labelTextColor]: refs.labelTextColor,
|
|
9511
|
+
[vars$q.fontFamily]: refs.fontFamily,
|
|
9478
9512
|
|
|
9479
|
-
[vars$
|
|
9513
|
+
[vars$q.iconSize]: '2em',
|
|
9480
9514
|
|
|
9481
|
-
[vars$
|
|
9482
|
-
[vars$
|
|
9515
|
+
[vars$q.hostPadding]: '0.75em',
|
|
9516
|
+
[vars$q.gap]: '0.5em',
|
|
9483
9517
|
|
|
9484
|
-
[vars$
|
|
9485
|
-
[vars$
|
|
9486
|
-
[vars$
|
|
9518
|
+
[vars$q.fontSize]: '16px',
|
|
9519
|
+
[vars$q.titleFontWeight]: '500',
|
|
9520
|
+
[vars$q.lineHeight]: '1em',
|
|
9487
9521
|
|
|
9488
|
-
[vars$
|
|
9489
|
-
[vars$
|
|
9490
|
-
[vars$
|
|
9491
|
-
[vars$
|
|
9522
|
+
[vars$q.borderWidth]: refs.borderWidth,
|
|
9523
|
+
[vars$q.borderColor]: refs.borderColor,
|
|
9524
|
+
[vars$q.borderRadius]: refs.borderRadius,
|
|
9525
|
+
[vars$q.borderStyle]: 'dashed',
|
|
9492
9526
|
|
|
9493
9527
|
_required: {
|
|
9494
|
-
[vars$
|
|
9528
|
+
[vars$q.requiredIndicator]: refs.requiredIndicator,
|
|
9495
9529
|
},
|
|
9496
9530
|
|
|
9497
9531
|
size: {
|
|
9498
9532
|
xs: {
|
|
9499
|
-
[vars$
|
|
9500
|
-
[vars$
|
|
9501
|
-
[vars$
|
|
9502
|
-
[vars$
|
|
9503
|
-
[vars$
|
|
9533
|
+
[vars$q.hostHeight]: '196px',
|
|
9534
|
+
[vars$q.hostWidth]: '200px',
|
|
9535
|
+
[vars$q.titleFontSize]: '0.875em',
|
|
9536
|
+
[vars$q.descriptionFontSize]: '0.875em',
|
|
9537
|
+
[vars$q.lineHeight]: '1.25em',
|
|
9504
9538
|
},
|
|
9505
9539
|
sm: {
|
|
9506
|
-
[vars$
|
|
9507
|
-
[vars$
|
|
9508
|
-
[vars$
|
|
9509
|
-
[vars$
|
|
9510
|
-
[vars$
|
|
9540
|
+
[vars$q.hostHeight]: '216px',
|
|
9541
|
+
[vars$q.hostWidth]: '230px',
|
|
9542
|
+
[vars$q.titleFontSize]: '1em',
|
|
9543
|
+
[vars$q.descriptionFontSize]: '0.875em',
|
|
9544
|
+
[vars$q.lineHeight]: '1.25em',
|
|
9511
9545
|
},
|
|
9512
9546
|
md: {
|
|
9513
|
-
[vars$
|
|
9514
|
-
[vars$
|
|
9515
|
-
[vars$
|
|
9516
|
-
[vars$
|
|
9517
|
-
[vars$
|
|
9547
|
+
[vars$q.hostHeight]: '256px',
|
|
9548
|
+
[vars$q.hostWidth]: '312px',
|
|
9549
|
+
[vars$q.titleFontSize]: '1.125em',
|
|
9550
|
+
[vars$q.descriptionFontSize]: '1em',
|
|
9551
|
+
[vars$q.lineHeight]: '1.5em',
|
|
9518
9552
|
},
|
|
9519
9553
|
lg: {
|
|
9520
|
-
[vars$
|
|
9521
|
-
[vars$
|
|
9522
|
-
[vars$
|
|
9523
|
-
[vars$
|
|
9524
|
-
[vars$
|
|
9554
|
+
[vars$q.hostHeight]: '280px',
|
|
9555
|
+
[vars$q.hostWidth]: '336px',
|
|
9556
|
+
[vars$q.titleFontSize]: '1.125em',
|
|
9557
|
+
[vars$q.descriptionFontSize]: '1.125em',
|
|
9558
|
+
[vars$q.lineHeight]: '1.75em',
|
|
9525
9559
|
},
|
|
9526
9560
|
},
|
|
9527
9561
|
|
|
9528
9562
|
_fullWidth: {
|
|
9529
|
-
[vars$
|
|
9563
|
+
[vars$q.hostWidth]: refs.width,
|
|
9530
9564
|
},
|
|
9531
9565
|
};
|
|
9532
9566
|
|
|
9533
9567
|
var uploadFile$1 = /*#__PURE__*/Object.freeze({
|
|
9534
9568
|
__proto__: null,
|
|
9535
9569
|
default: uploadFile,
|
|
9536
|
-
vars: vars$
|
|
9570
|
+
vars: vars$q
|
|
9537
9571
|
});
|
|
9538
9572
|
|
|
9539
|
-
const componentName$
|
|
9573
|
+
const componentName$s = getComponentName('button-selection-group-item');
|
|
9540
9574
|
|
|
9541
9575
|
class RawSelectItem extends createBaseClass({
|
|
9542
|
-
componentName: componentName$
|
|
9576
|
+
componentName: componentName$s,
|
|
9543
9577
|
baseSelector: ':host > descope-button',
|
|
9544
9578
|
}) {
|
|
9545
9579
|
get size() {
|
|
@@ -9646,39 +9680,39 @@ const ButtonSelectionGroupItemClass = compose(
|
|
|
9646
9680
|
componentNameValidationMixin
|
|
9647
9681
|
)(RawSelectItem);
|
|
9648
9682
|
|
|
9649
|
-
const globalRefs$
|
|
9683
|
+
const globalRefs$k = getThemeRefs(globals);
|
|
9650
9684
|
|
|
9651
|
-
const vars$
|
|
9685
|
+
const vars$p = ButtonSelectionGroupItemClass.cssVarList;
|
|
9652
9686
|
|
|
9653
9687
|
const buttonSelectionGroupItem = {
|
|
9654
|
-
[vars$
|
|
9655
|
-
[vars$
|
|
9656
|
-
[vars$
|
|
9657
|
-
[vars$
|
|
9658
|
-
[vars$
|
|
9659
|
-
[vars$
|
|
9660
|
-
[vars$
|
|
9661
|
-
[vars$
|
|
9688
|
+
[vars$p.hostDirection]: 'inherit',
|
|
9689
|
+
[vars$p.backgroundColor]: globalRefs$k.colors.surface.main,
|
|
9690
|
+
[vars$p.labelTextColor]: globalRefs$k.colors.surface.contrast,
|
|
9691
|
+
[vars$p.borderColor]: globalRefs$k.colors.surface.light,
|
|
9692
|
+
[vars$p.borderStyle]: 'solid',
|
|
9693
|
+
[vars$p.borderRadius]: globalRefs$k.radius.sm,
|
|
9694
|
+
[vars$p.outlineColor]: 'transparent',
|
|
9695
|
+
[vars$p.borderWidth]: globalRefs$k.border.xs,
|
|
9662
9696
|
|
|
9663
9697
|
_hover: {
|
|
9664
|
-
[vars$
|
|
9698
|
+
[vars$p.backgroundColor]: globalRefs$k.colors.surface.highlight,
|
|
9665
9699
|
},
|
|
9666
9700
|
|
|
9667
9701
|
_focused: {
|
|
9668
|
-
[vars$
|
|
9702
|
+
[vars$p.outlineColor]: globalRefs$k.colors.surface.light,
|
|
9669
9703
|
},
|
|
9670
9704
|
|
|
9671
9705
|
_selected: {
|
|
9672
|
-
[vars$
|
|
9673
|
-
[vars$
|
|
9674
|
-
[vars$
|
|
9706
|
+
[vars$p.borderColor]: globalRefs$k.colors.surface.contrast,
|
|
9707
|
+
[vars$p.backgroundColor]: globalRefs$k.colors.surface.contrast,
|
|
9708
|
+
[vars$p.labelTextColor]: globalRefs$k.colors.surface.main,
|
|
9675
9709
|
},
|
|
9676
9710
|
};
|
|
9677
9711
|
|
|
9678
9712
|
var buttonSelectionGroupItem$1 = /*#__PURE__*/Object.freeze({
|
|
9679
9713
|
__proto__: null,
|
|
9680
9714
|
default: buttonSelectionGroupItem,
|
|
9681
|
-
vars: vars$
|
|
9715
|
+
vars: vars$p
|
|
9682
9716
|
});
|
|
9683
9717
|
|
|
9684
9718
|
const createBaseButtonSelectionGroupInternalClass = (componentName) => {
|
|
@@ -9777,10 +9811,10 @@ const createBaseButtonSelectionGroupInternalClass = (componentName) => {
|
|
|
9777
9811
|
return BaseButtonSelectionGroupInternalClass;
|
|
9778
9812
|
};
|
|
9779
9813
|
|
|
9780
|
-
const componentName$
|
|
9814
|
+
const componentName$r = getComponentName('button-selection-group-internal');
|
|
9781
9815
|
|
|
9782
9816
|
class ButtonSelectionGroupInternalClass extends createBaseButtonSelectionGroupInternalClass(
|
|
9783
|
-
componentName$
|
|
9817
|
+
componentName$r
|
|
9784
9818
|
) {
|
|
9785
9819
|
getSelectedNode() {
|
|
9786
9820
|
return this.items.find((item) => item.hasAttribute('selected'));
|
|
@@ -10012,7 +10046,7 @@ const buttonSelectionGroupStyles = `
|
|
|
10012
10046
|
${resetInputCursor('vaadin-text-field')}
|
|
10013
10047
|
`;
|
|
10014
10048
|
|
|
10015
|
-
const componentName$
|
|
10049
|
+
const componentName$q = getComponentName('button-selection-group');
|
|
10016
10050
|
|
|
10017
10051
|
const buttonSelectionGroupMixin = (superclass) =>
|
|
10018
10052
|
class ButtonMultiSelectionGroupMixinClass extends superclass {
|
|
@@ -10021,19 +10055,19 @@ const buttonSelectionGroupMixin = (superclass) =>
|
|
|
10021
10055
|
const template = document.createElement('template');
|
|
10022
10056
|
|
|
10023
10057
|
template.innerHTML = `
|
|
10024
|
-
<${componentName$
|
|
10058
|
+
<${componentName$r}
|
|
10025
10059
|
name="button-selection-group"
|
|
10026
10060
|
slot="input"
|
|
10027
10061
|
tabindex="-1"
|
|
10028
10062
|
part="internal-component"
|
|
10029
10063
|
>
|
|
10030
10064
|
<slot></slot>
|
|
10031
|
-
</${componentName$
|
|
10065
|
+
</${componentName$r}>
|
|
10032
10066
|
`;
|
|
10033
10067
|
|
|
10034
10068
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
|
10035
10069
|
|
|
10036
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
|
10070
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$r);
|
|
10037
10071
|
|
|
10038
10072
|
forwardAttrs(this, this.inputElement, {
|
|
10039
10073
|
includeAttrs: ['size', 'default-value', 'allow-deselect'],
|
|
@@ -10058,11 +10092,11 @@ const ButtonSelectionGroupClass = compose(
|
|
|
10058
10092
|
wrappedEleName: 'vaadin-text-field',
|
|
10059
10093
|
style: () => buttonSelectionGroupStyles,
|
|
10060
10094
|
excludeAttrsSync: ['tabindex'],
|
|
10061
|
-
componentName: componentName$
|
|
10095
|
+
componentName: componentName$q,
|
|
10062
10096
|
})
|
|
10063
10097
|
);
|
|
10064
10098
|
|
|
10065
|
-
const globalRefs$
|
|
10099
|
+
const globalRefs$j = getThemeRefs(globals);
|
|
10066
10100
|
|
|
10067
10101
|
const createBaseButtonSelectionGroupMappings = (vars) => ({
|
|
10068
10102
|
[vars.hostDirection]: refs.direction,
|
|
@@ -10070,26 +10104,26 @@ const createBaseButtonSelectionGroupMappings = (vars) => ({
|
|
|
10070
10104
|
[vars.labelTextColor]: refs.labelTextColor,
|
|
10071
10105
|
[vars.labelRequiredIndicator]: refs.requiredIndicator,
|
|
10072
10106
|
[vars.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
10073
|
-
[vars.itemsSpacing]: globalRefs$
|
|
10107
|
+
[vars.itemsSpacing]: globalRefs$j.spacing.sm,
|
|
10074
10108
|
[vars.hostWidth]: refs.width,
|
|
10075
10109
|
});
|
|
10076
10110
|
|
|
10077
|
-
const vars$
|
|
10111
|
+
const vars$o = ButtonSelectionGroupClass.cssVarList;
|
|
10078
10112
|
|
|
10079
10113
|
const buttonSelectionGroup = {
|
|
10080
|
-
...createBaseButtonSelectionGroupMappings(vars$
|
|
10114
|
+
...createBaseButtonSelectionGroupMappings(vars$o),
|
|
10081
10115
|
};
|
|
10082
10116
|
|
|
10083
10117
|
var buttonSelectionGroup$1 = /*#__PURE__*/Object.freeze({
|
|
10084
10118
|
__proto__: null,
|
|
10085
10119
|
default: buttonSelectionGroup,
|
|
10086
|
-
vars: vars$
|
|
10120
|
+
vars: vars$o
|
|
10087
10121
|
});
|
|
10088
10122
|
|
|
10089
|
-
const componentName$
|
|
10123
|
+
const componentName$p = getComponentName('button-multi-selection-group-internal');
|
|
10090
10124
|
|
|
10091
10125
|
class ButtonMultiSelectionGroupInternalClass extends createBaseButtonSelectionGroupInternalClass(
|
|
10092
|
-
componentName$
|
|
10126
|
+
componentName$p
|
|
10093
10127
|
) {
|
|
10094
10128
|
#getSelectedNodes() {
|
|
10095
10129
|
return this.items.filter((item) => item.hasAttribute('selected'));
|
|
@@ -10192,7 +10226,7 @@ class ButtonMultiSelectionGroupInternalClass extends createBaseButtonSelectionGr
|
|
|
10192
10226
|
}
|
|
10193
10227
|
}
|
|
10194
10228
|
|
|
10195
|
-
const componentName$
|
|
10229
|
+
const componentName$o = getComponentName('button-multi-selection-group');
|
|
10196
10230
|
|
|
10197
10231
|
const buttonMultiSelectionGroupMixin = (superclass) =>
|
|
10198
10232
|
class ButtonMultiSelectionGroupMixinClass extends superclass {
|
|
@@ -10201,19 +10235,19 @@ const buttonMultiSelectionGroupMixin = (superclass) =>
|
|
|
10201
10235
|
const template = document.createElement('template');
|
|
10202
10236
|
|
|
10203
10237
|
template.innerHTML = `
|
|
10204
|
-
<${componentName$
|
|
10238
|
+
<${componentName$p}
|
|
10205
10239
|
name="button-selection-group"
|
|
10206
10240
|
slot="input"
|
|
10207
10241
|
tabindex="-1"
|
|
10208
10242
|
part="internal-component"
|
|
10209
10243
|
>
|
|
10210
10244
|
<slot></slot>
|
|
10211
|
-
</${componentName$
|
|
10245
|
+
</${componentName$p}>
|
|
10212
10246
|
`;
|
|
10213
10247
|
|
|
10214
10248
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
|
10215
10249
|
|
|
10216
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
|
10250
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$p);
|
|
10217
10251
|
|
|
10218
10252
|
forwardAttrs(this, this.inputElement, {
|
|
10219
10253
|
includeAttrs: ['size', 'default-values', 'min-items-selection', 'max-items-selection'],
|
|
@@ -10238,23 +10272,23 @@ const ButtonMultiSelectionGroupClass = compose(
|
|
|
10238
10272
|
wrappedEleName: 'vaadin-text-field',
|
|
10239
10273
|
style: () => buttonSelectionGroupStyles,
|
|
10240
10274
|
excludeAttrsSync: ['tabindex'],
|
|
10241
|
-
componentName: componentName$
|
|
10275
|
+
componentName: componentName$o,
|
|
10242
10276
|
})
|
|
10243
10277
|
);
|
|
10244
10278
|
|
|
10245
|
-
const vars$
|
|
10279
|
+
const vars$n = ButtonMultiSelectionGroupClass.cssVarList;
|
|
10246
10280
|
|
|
10247
10281
|
const buttonMultiSelectionGroup = {
|
|
10248
|
-
...createBaseButtonSelectionGroupMappings(vars$
|
|
10282
|
+
...createBaseButtonSelectionGroupMappings(vars$n),
|
|
10249
10283
|
};
|
|
10250
10284
|
|
|
10251
10285
|
var buttonMultiSelectionGroup$1 = /*#__PURE__*/Object.freeze({
|
|
10252
10286
|
__proto__: null,
|
|
10253
10287
|
default: buttonMultiSelectionGroup,
|
|
10254
|
-
vars: vars$
|
|
10288
|
+
vars: vars$n
|
|
10255
10289
|
});
|
|
10256
10290
|
|
|
10257
|
-
const componentName$
|
|
10291
|
+
const componentName$n = getComponentName('modal');
|
|
10258
10292
|
|
|
10259
10293
|
const customMixin$5 = (superclass) =>
|
|
10260
10294
|
class ModalMixinClass extends superclass {
|
|
@@ -10353,28 +10387,28 @@ const ModalClass = compose(
|
|
|
10353
10387
|
wrappedEleName: 'vaadin-dialog',
|
|
10354
10388
|
style: () => ``,
|
|
10355
10389
|
excludeAttrsSync: ['tabindex', 'opened'],
|
|
10356
|
-
componentName: componentName$
|
|
10390
|
+
componentName: componentName$n,
|
|
10357
10391
|
})
|
|
10358
10392
|
);
|
|
10359
10393
|
|
|
10360
|
-
const globalRefs$
|
|
10394
|
+
const globalRefs$i = getThemeRefs(globals);
|
|
10361
10395
|
|
|
10362
10396
|
const compVars$2 = ModalClass.cssVarList;
|
|
10363
10397
|
|
|
10364
10398
|
const modal = {
|
|
10365
|
-
[compVars$2.overlayBackgroundColor]: globalRefs$
|
|
10366
|
-
[compVars$2.overlayShadow]: globalRefs$
|
|
10399
|
+
[compVars$2.overlayBackgroundColor]: globalRefs$i.colors.surface.main,
|
|
10400
|
+
[compVars$2.overlayShadow]: globalRefs$i.shadow.wide['2xl'],
|
|
10367
10401
|
[compVars$2.overlayWidth]: '540px',
|
|
10368
10402
|
};
|
|
10369
10403
|
|
|
10370
|
-
const vars$
|
|
10404
|
+
const vars$m = {
|
|
10371
10405
|
...compVars$2,
|
|
10372
10406
|
};
|
|
10373
10407
|
|
|
10374
10408
|
var modal$1 = /*#__PURE__*/Object.freeze({
|
|
10375
10409
|
__proto__: null,
|
|
10376
10410
|
default: modal,
|
|
10377
|
-
vars: vars$
|
|
10411
|
+
vars: vars$m
|
|
10378
10412
|
});
|
|
10379
10413
|
|
|
10380
10414
|
const isValidDataType = (data) => {
|
|
@@ -10450,7 +10484,7 @@ const defaultRowDetailsRenderer = (item, itemLabelsMapping) => {
|
|
|
10450
10484
|
`;
|
|
10451
10485
|
};
|
|
10452
10486
|
|
|
10453
|
-
const componentName$
|
|
10487
|
+
const componentName$m = getComponentName('grid');
|
|
10454
10488
|
|
|
10455
10489
|
const GridMixin = (superclass) =>
|
|
10456
10490
|
class GridMixinClass extends superclass {
|
|
@@ -10804,52 +10838,52 @@ const GridClass = compose(
|
|
|
10804
10838
|
/*!css*/
|
|
10805
10839
|
`,
|
|
10806
10840
|
excludeAttrsSync: ['columns', 'tabindex'],
|
|
10807
|
-
componentName: componentName$
|
|
10841
|
+
componentName: componentName$m,
|
|
10808
10842
|
})
|
|
10809
10843
|
);
|
|
10810
10844
|
|
|
10811
|
-
const globalRefs$
|
|
10812
|
-
const vars$
|
|
10845
|
+
const globalRefs$h = getThemeRefs(globals);
|
|
10846
|
+
const vars$l = GridClass.cssVarList;
|
|
10813
10847
|
|
|
10814
10848
|
const grid = {
|
|
10815
|
-
[vars$
|
|
10816
|
-
[vars$
|
|
10817
|
-
[vars$
|
|
10818
|
-
[vars$
|
|
10819
|
-
[vars$
|
|
10820
|
-
|
|
10821
|
-
[vars$
|
|
10822
|
-
[vars$
|
|
10823
|
-
|
|
10824
|
-
[vars$
|
|
10825
|
-
[vars$
|
|
10826
|
-
[vars$
|
|
10827
|
-
|
|
10828
|
-
[vars$
|
|
10829
|
-
[vars$
|
|
10830
|
-
[vars$
|
|
10831
|
-
[vars$
|
|
10832
|
-
|
|
10833
|
-
[vars$
|
|
10834
|
-
[vars$
|
|
10835
|
-
|
|
10836
|
-
[vars$
|
|
10837
|
-
[vars$
|
|
10838
|
-
[vars$
|
|
10839
|
-
|
|
10840
|
-
[vars$
|
|
10841
|
-
[vars$
|
|
10842
|
-
[vars$
|
|
10843
|
-
[vars$
|
|
10844
|
-
[vars$
|
|
10845
|
-
[vars$
|
|
10846
|
-
[vars$
|
|
10847
|
-
[vars$
|
|
10848
|
-
[vars$
|
|
10849
|
-
[vars$
|
|
10849
|
+
[vars$l.hostWidth]: '100%',
|
|
10850
|
+
[vars$l.hostHeight]: '100%',
|
|
10851
|
+
[vars$l.hostMinHeight]: '400px',
|
|
10852
|
+
[vars$l.fontWeight]: '400',
|
|
10853
|
+
[vars$l.backgroundColor]: globalRefs$h.colors.surface.main,
|
|
10854
|
+
|
|
10855
|
+
[vars$l.fontSize]: refs.fontSize,
|
|
10856
|
+
[vars$l.fontFamily]: refs.fontFamily,
|
|
10857
|
+
|
|
10858
|
+
[vars$l.sortIndicatorsColor]: globalRefs$h.colors.surface.light,
|
|
10859
|
+
[vars$l.activeSortIndicator]: globalRefs$h.colors.surface.dark,
|
|
10860
|
+
[vars$l.resizeHandleColor]: globalRefs$h.colors.surface.light,
|
|
10861
|
+
|
|
10862
|
+
[vars$l.borderWidth]: refs.borderWidth,
|
|
10863
|
+
[vars$l.borderStyle]: refs.borderStyle,
|
|
10864
|
+
[vars$l.borderRadius]: refs.borderRadius,
|
|
10865
|
+
[vars$l.borderColor]: 'transparent',
|
|
10866
|
+
|
|
10867
|
+
[vars$l.headerRowTextColor]: globalRefs$h.colors.surface.dark,
|
|
10868
|
+
[vars$l.separatorColor]: globalRefs$h.colors.surface.light,
|
|
10869
|
+
|
|
10870
|
+
[vars$l.valueTextColor]: globalRefs$h.colors.surface.contrast,
|
|
10871
|
+
[vars$l.selectedBackgroundColor]: globalRefs$h.colors.surface.highlight,
|
|
10872
|
+
[vars$l.hostDirection]: globalRefs$h.direction,
|
|
10873
|
+
|
|
10874
|
+
[vars$l.toggleDetailsPanelButtonSize]: '1em',
|
|
10875
|
+
[vars$l.toggleDetailsPanelButtonOpenedColor]: globalRefs$h.colors.surface.contrast,
|
|
10876
|
+
[vars$l.toggleDetailsPanelButtonClosedColor]: globalRefs$h.colors.surface.light,
|
|
10877
|
+
[vars$l.toggleDetailsPanelButtonCursor]: 'pointer',
|
|
10878
|
+
[vars$l.detailsPanelBackgroundColor]: globalRefs$h.colors.surface.highlight,
|
|
10879
|
+
[vars$l.detailsPanelBorderTopColor]: globalRefs$h.colors.surface.light,
|
|
10880
|
+
[vars$l.detailsPanelLabelsColor]: globalRefs$h.colors.surface.dark,
|
|
10881
|
+
[vars$l.detailsPanelLabelsFontSize]: '0.8em',
|
|
10882
|
+
[vars$l.detailsPanelItemsGap]: '2em',
|
|
10883
|
+
[vars$l.detailsPanelPadding]: '12px 0',
|
|
10850
10884
|
|
|
10851
10885
|
_bordered: {
|
|
10852
|
-
[vars$
|
|
10886
|
+
[vars$l.borderColor]: refs.borderColor,
|
|
10853
10887
|
},
|
|
10854
10888
|
};
|
|
10855
10889
|
|
|
@@ -10857,10 +10891,10 @@ var grid$1 = /*#__PURE__*/Object.freeze({
|
|
|
10857
10891
|
__proto__: null,
|
|
10858
10892
|
default: grid,
|
|
10859
10893
|
grid: grid,
|
|
10860
|
-
vars: vars$
|
|
10894
|
+
vars: vars$l
|
|
10861
10895
|
});
|
|
10862
10896
|
|
|
10863
|
-
const componentName$
|
|
10897
|
+
const componentName$l = getComponentName('notification-card');
|
|
10864
10898
|
|
|
10865
10899
|
const notificationCardMixin = (superclass) =>
|
|
10866
10900
|
class NotificationCardMixinClass extends superclass {
|
|
@@ -10968,54 +11002,54 @@ const NotificationCardClass = compose(
|
|
|
10968
11002
|
}
|
|
10969
11003
|
`,
|
|
10970
11004
|
excludeAttrsSync: ['tabindex'],
|
|
10971
|
-
componentName: componentName$
|
|
11005
|
+
componentName: componentName$l,
|
|
10972
11006
|
})
|
|
10973
11007
|
);
|
|
10974
11008
|
|
|
10975
|
-
const globalRefs$
|
|
10976
|
-
const vars$
|
|
11009
|
+
const globalRefs$g = getThemeRefs(globals);
|
|
11010
|
+
const vars$k = NotificationCardClass.cssVarList;
|
|
10977
11011
|
|
|
10978
11012
|
const shadowColor$2 = '#00000020';
|
|
10979
11013
|
|
|
10980
11014
|
const notification = {
|
|
10981
|
-
[vars$
|
|
10982
|
-
[vars$
|
|
10983
|
-
[vars$
|
|
10984
|
-
[vars$
|
|
10985
|
-
[vars$
|
|
10986
|
-
[vars$
|
|
10987
|
-
[vars$
|
|
10988
|
-
[vars$
|
|
10989
|
-
[vars$
|
|
11015
|
+
[vars$k.hostMinWidth]: '415px',
|
|
11016
|
+
[vars$k.fontFamily]: globalRefs$g.fonts.font1.family,
|
|
11017
|
+
[vars$k.fontSize]: globalRefs$g.typography.body1.size,
|
|
11018
|
+
[vars$k.backgroundColor]: globalRefs$g.colors.surface.main,
|
|
11019
|
+
[vars$k.textColor]: globalRefs$g.colors.surface.contrast,
|
|
11020
|
+
[vars$k.boxShadow]: `${globalRefs$g.shadow.wide.xl} ${shadowColor$2}, ${globalRefs$g.shadow.narrow.xl} ${shadowColor$2}`,
|
|
11021
|
+
[vars$k.verticalPadding]: '0.625em',
|
|
11022
|
+
[vars$k.horizontalPadding]: '1.5em',
|
|
11023
|
+
[vars$k.borderRadius]: globalRefs$g.radius.xs,
|
|
10990
11024
|
|
|
10991
11025
|
_bordered: {
|
|
10992
|
-
[vars$
|
|
10993
|
-
[vars$
|
|
10994
|
-
[vars$
|
|
11026
|
+
[vars$k.borderWidth]: globalRefs$g.border.sm,
|
|
11027
|
+
[vars$k.borderStyle]: 'solid',
|
|
11028
|
+
[vars$k.borderColor]: 'transparent',
|
|
10995
11029
|
},
|
|
10996
11030
|
|
|
10997
11031
|
size: {
|
|
10998
|
-
xs: { [vars$
|
|
10999
|
-
sm: { [vars$
|
|
11000
|
-
md: { [vars$
|
|
11001
|
-
lg: { [vars$
|
|
11032
|
+
xs: { [vars$k.fontSize]: '12px' },
|
|
11033
|
+
sm: { [vars$k.fontSize]: '14px' },
|
|
11034
|
+
md: { [vars$k.fontSize]: '16px' },
|
|
11035
|
+
lg: { [vars$k.fontSize]: '18px' },
|
|
11002
11036
|
},
|
|
11003
11037
|
|
|
11004
11038
|
mode: {
|
|
11005
11039
|
primary: {
|
|
11006
|
-
[vars$
|
|
11007
|
-
[vars$
|
|
11008
|
-
[vars$
|
|
11040
|
+
[vars$k.backgroundColor]: globalRefs$g.colors.primary.main,
|
|
11041
|
+
[vars$k.textColor]: globalRefs$g.colors.primary.contrast,
|
|
11042
|
+
[vars$k.borderColor]: globalRefs$g.colors.primary.light,
|
|
11009
11043
|
},
|
|
11010
11044
|
success: {
|
|
11011
|
-
[vars$
|
|
11012
|
-
[vars$
|
|
11013
|
-
[vars$
|
|
11045
|
+
[vars$k.backgroundColor]: globalRefs$g.colors.success.main,
|
|
11046
|
+
[vars$k.textColor]: globalRefs$g.colors.success.contrast,
|
|
11047
|
+
[vars$k.borderColor]: globalRefs$g.colors.success.light,
|
|
11014
11048
|
},
|
|
11015
11049
|
error: {
|
|
11016
|
-
[vars$
|
|
11017
|
-
[vars$
|
|
11018
|
-
[vars$
|
|
11050
|
+
[vars$k.backgroundColor]: globalRefs$g.colors.error.main,
|
|
11051
|
+
[vars$k.textColor]: globalRefs$g.colors.error.contrast,
|
|
11052
|
+
[vars$k.borderColor]: globalRefs$g.colors.error.light,
|
|
11019
11053
|
},
|
|
11020
11054
|
},
|
|
11021
11055
|
};
|
|
@@ -11023,10 +11057,10 @@ const notification = {
|
|
|
11023
11057
|
var notificationCard = /*#__PURE__*/Object.freeze({
|
|
11024
11058
|
__proto__: null,
|
|
11025
11059
|
default: notification,
|
|
11026
|
-
vars: vars$
|
|
11060
|
+
vars: vars$k
|
|
11027
11061
|
});
|
|
11028
11062
|
|
|
11029
|
-
const componentName$
|
|
11063
|
+
const componentName$k = getComponentName('multi-select-combo-box');
|
|
11030
11064
|
|
|
11031
11065
|
const multiSelectComboBoxMixin = (superclass) =>
|
|
11032
11066
|
class MultiSelectComboBoxMixinClass extends superclass {
|
|
@@ -11660,93 +11694,93 @@ const MultiSelectComboBoxClass = compose(
|
|
|
11660
11694
|
// Note: we exclude `placeholder` because the vaadin component observes it and
|
|
11661
11695
|
// tries to override it, causing us to lose the user set placeholder.
|
|
11662
11696
|
excludeAttrsSync: ['tabindex', 'size', 'data', 'placeholder'],
|
|
11663
|
-
componentName: componentName$
|
|
11697
|
+
componentName: componentName$k,
|
|
11664
11698
|
includeForwardProps: ['items', 'renderer', 'selectedItems'],
|
|
11665
11699
|
})
|
|
11666
11700
|
);
|
|
11667
11701
|
|
|
11668
|
-
const globalRefs$
|
|
11669
|
-
const vars$
|
|
11702
|
+
const globalRefs$f = getThemeRefs(globals);
|
|
11703
|
+
const vars$j = MultiSelectComboBoxClass.cssVarList;
|
|
11670
11704
|
|
|
11671
11705
|
const multiSelectComboBox = {
|
|
11672
|
-
[vars$
|
|
11673
|
-
[vars$
|
|
11674
|
-
[vars$
|
|
11675
|
-
[vars$
|
|
11676
|
-
[vars$
|
|
11677
|
-
[vars$
|
|
11678
|
-
[vars$
|
|
11679
|
-
[vars$
|
|
11680
|
-
[vars$
|
|
11681
|
-
[vars$
|
|
11682
|
-
[vars$
|
|
11683
|
-
[vars$
|
|
11684
|
-
[vars$
|
|
11685
|
-
[vars$
|
|
11686
|
-
[vars$
|
|
11687
|
-
[vars$
|
|
11688
|
-
[vars$
|
|
11689
|
-
[vars$
|
|
11690
|
-
[vars$
|
|
11691
|
-
[vars$
|
|
11692
|
-
[vars$
|
|
11693
|
-
[vars$
|
|
11694
|
-
[vars$
|
|
11695
|
-
[vars$
|
|
11696
|
-
[vars$
|
|
11697
|
-
[vars$
|
|
11698
|
-
[vars$
|
|
11699
|
-
[vars$
|
|
11700
|
-
[vars$
|
|
11701
|
-
[vars$
|
|
11702
|
-
[vars$
|
|
11703
|
-
[vars$
|
|
11704
|
-
[vars$
|
|
11705
|
-
[vars$
|
|
11706
|
-
[vars$
|
|
11707
|
-
[vars$
|
|
11708
|
-
[vars$
|
|
11709
|
-
[vars$
|
|
11710
|
-
[vars$
|
|
11711
|
-
[vars$
|
|
11712
|
-
[vars$
|
|
11706
|
+
[vars$j.hostWidth]: refs.width,
|
|
11707
|
+
[vars$j.hostDirection]: refs.direction,
|
|
11708
|
+
[vars$j.fontSize]: refs.fontSize,
|
|
11709
|
+
[vars$j.fontFamily]: refs.fontFamily,
|
|
11710
|
+
[vars$j.labelFontSize]: refs.labelFontSize,
|
|
11711
|
+
[vars$j.labelFontWeight]: refs.labelFontWeight,
|
|
11712
|
+
[vars$j.labelTextColor]: refs.labelTextColor,
|
|
11713
|
+
[vars$j.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
11714
|
+
[vars$j.inputBorderColor]: refs.borderColor,
|
|
11715
|
+
[vars$j.inputBorderWidth]: refs.borderWidth,
|
|
11716
|
+
[vars$j.inputBorderStyle]: refs.borderStyle,
|
|
11717
|
+
[vars$j.inputBorderRadius]: refs.borderRadius,
|
|
11718
|
+
[vars$j.inputOutlineColor]: refs.outlineColor,
|
|
11719
|
+
[vars$j.inputOutlineOffset]: refs.outlineOffset,
|
|
11720
|
+
[vars$j.inputOutlineWidth]: refs.outlineWidth,
|
|
11721
|
+
[vars$j.inputOutlineStyle]: refs.outlineStyle,
|
|
11722
|
+
[vars$j.labelRequiredIndicator]: refs.requiredIndicator,
|
|
11723
|
+
[vars$j.inputValueTextColor]: refs.valueTextColor,
|
|
11724
|
+
[vars$j.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
|
11725
|
+
[vars$j.inputBackgroundColor]: refs.backgroundColor,
|
|
11726
|
+
[vars$j.inputHorizontalPadding]: refs.horizontalPadding,
|
|
11727
|
+
[vars$j.inputVerticalPadding]: refs.verticalPadding,
|
|
11728
|
+
[vars$j.inputHeight]: refs.inputHeight,
|
|
11729
|
+
[vars$j.inputDropdownButtonColor]: globalRefs$f.colors.surface.dark,
|
|
11730
|
+
[vars$j.inputDropdownButtonCursor]: 'pointer',
|
|
11731
|
+
[vars$j.inputDropdownButtonSize]: refs.toggleButtonSize,
|
|
11732
|
+
[vars$j.inputDropdownButtonOffset]: globalRefs$f.spacing.xs,
|
|
11733
|
+
[vars$j.overlayItemPaddingInlineStart]: globalRefs$f.spacing.xs,
|
|
11734
|
+
[vars$j.overlayItemPaddingInlineEnd]: globalRefs$f.spacing.lg,
|
|
11735
|
+
[vars$j.chipFontSize]: refs.chipFontSize,
|
|
11736
|
+
[vars$j.chipTextColor]: globalRefs$f.colors.surface.contrast,
|
|
11737
|
+
[vars$j.chipBackgroundColor]: globalRefs$f.colors.surface.light,
|
|
11738
|
+
[vars$j.labelPosition]: refs.labelPosition,
|
|
11739
|
+
[vars$j.labelTopPosition]: refs.labelTopPosition,
|
|
11740
|
+
[vars$j.labelLeftPosition]: refs.labelLeftPosition,
|
|
11741
|
+
[vars$j.labelHorizontalPosition]: refs.labelHorizontalPosition,
|
|
11742
|
+
[vars$j.inputTransformY]: refs.inputTransformY,
|
|
11743
|
+
[vars$j.inputTransition]: refs.inputTransition,
|
|
11744
|
+
[vars$j.marginInlineStart]: refs.marginInlineStart,
|
|
11745
|
+
[vars$j.placeholderOpacity]: refs.placeholderOpacity,
|
|
11746
|
+
[vars$j.inputVerticalAlignment]: refs.inputVerticalAlignment,
|
|
11713
11747
|
|
|
11714
11748
|
labelType: {
|
|
11715
11749
|
floating: {
|
|
11716
|
-
[vars$
|
|
11750
|
+
[vars$j.inputHorizontalPadding]: '0.25em',
|
|
11717
11751
|
_hasValue: {
|
|
11718
|
-
[vars$
|
|
11752
|
+
[vars$j.inputHorizontalPadding]: '0.45em',
|
|
11719
11753
|
},
|
|
11720
11754
|
},
|
|
11721
11755
|
},
|
|
11722
11756
|
|
|
11723
11757
|
_readonly: {
|
|
11724
|
-
[vars$
|
|
11758
|
+
[vars$j.inputDropdownButtonCursor]: 'default',
|
|
11725
11759
|
},
|
|
11726
11760
|
|
|
11727
11761
|
// Overlay theme exposed via the component:
|
|
11728
|
-
[vars$
|
|
11729
|
-
[vars$
|
|
11730
|
-
[vars$
|
|
11731
|
-
[vars$
|
|
11732
|
-
[vars$
|
|
11733
|
-
[vars$
|
|
11762
|
+
[vars$j.overlayFontSize]: refs.fontSize,
|
|
11763
|
+
[vars$j.overlayFontFamily]: refs.fontFamily,
|
|
11764
|
+
[vars$j.overlayCursor]: 'pointer',
|
|
11765
|
+
[vars$j.overlayItemBoxShadow]: 'none',
|
|
11766
|
+
[vars$j.overlayBackground]: refs.backgroundColor,
|
|
11767
|
+
[vars$j.overlayTextColor]: refs.valueTextColor,
|
|
11734
11768
|
|
|
11735
11769
|
// Overlay direct theme:
|
|
11736
|
-
[vars$
|
|
11737
|
-
[vars$
|
|
11770
|
+
[vars$j.overlay.minHeight]: '400px',
|
|
11771
|
+
[vars$j.overlay.margin]: '0',
|
|
11738
11772
|
};
|
|
11739
11773
|
|
|
11740
11774
|
var multiSelectComboBox$1 = /*#__PURE__*/Object.freeze({
|
|
11741
11775
|
__proto__: null,
|
|
11742
11776
|
default: multiSelectComboBox,
|
|
11743
11777
|
multiSelectComboBox: multiSelectComboBox,
|
|
11744
|
-
vars: vars$
|
|
11778
|
+
vars: vars$j
|
|
11745
11779
|
});
|
|
11746
11780
|
|
|
11747
|
-
const componentName$
|
|
11781
|
+
const componentName$j = getComponentName('badge');
|
|
11748
11782
|
|
|
11749
|
-
class RawBadge extends createBaseClass({ componentName: componentName$
|
|
11783
|
+
class RawBadge extends createBaseClass({ componentName: componentName$j, baseSelector: ':host > div' }) {
|
|
11750
11784
|
constructor() {
|
|
11751
11785
|
super();
|
|
11752
11786
|
|
|
@@ -11797,66 +11831,66 @@ const BadgeClass = compose(
|
|
|
11797
11831
|
componentNameValidationMixin
|
|
11798
11832
|
)(RawBadge);
|
|
11799
11833
|
|
|
11800
|
-
const globalRefs$
|
|
11801
|
-
const vars$
|
|
11834
|
+
const globalRefs$e = getThemeRefs(globals);
|
|
11835
|
+
const vars$i = BadgeClass.cssVarList;
|
|
11802
11836
|
|
|
11803
11837
|
const badge$2 = {
|
|
11804
|
-
[vars$
|
|
11805
|
-
[vars$
|
|
11838
|
+
[vars$i.hostWidth]: 'fit-content',
|
|
11839
|
+
[vars$i.hostDirection]: globalRefs$e.direction,
|
|
11806
11840
|
|
|
11807
|
-
[vars$
|
|
11841
|
+
[vars$i.textAlign]: 'center',
|
|
11808
11842
|
|
|
11809
|
-
[vars$
|
|
11810
|
-
[vars$
|
|
11843
|
+
[vars$i.fontFamily]: globalRefs$e.fonts.font1.family,
|
|
11844
|
+
[vars$i.fontWeight]: '400',
|
|
11811
11845
|
|
|
11812
|
-
[vars$
|
|
11813
|
-
[vars$
|
|
11846
|
+
[vars$i.verticalPadding]: '0.25em',
|
|
11847
|
+
[vars$i.horizontalPadding]: '0.5em',
|
|
11814
11848
|
|
|
11815
|
-
[vars$
|
|
11816
|
-
[vars$
|
|
11817
|
-
[vars$
|
|
11818
|
-
[vars$
|
|
11849
|
+
[vars$i.borderWidth]: globalRefs$e.border.xs,
|
|
11850
|
+
[vars$i.borderRadius]: globalRefs$e.radius.xs,
|
|
11851
|
+
[vars$i.borderColor]: 'transparent',
|
|
11852
|
+
[vars$i.borderStyle]: 'solid',
|
|
11819
11853
|
|
|
11820
11854
|
_fullWidth: {
|
|
11821
|
-
[vars$
|
|
11855
|
+
[vars$i.hostWidth]: '100%',
|
|
11822
11856
|
},
|
|
11823
11857
|
|
|
11824
11858
|
size: {
|
|
11825
|
-
xs: { [vars$
|
|
11826
|
-
sm: { [vars$
|
|
11827
|
-
md: { [vars$
|
|
11828
|
-
lg: { [vars$
|
|
11859
|
+
xs: { [vars$i.fontSize]: '12px' },
|
|
11860
|
+
sm: { [vars$i.fontSize]: '14px' },
|
|
11861
|
+
md: { [vars$i.fontSize]: '16px' },
|
|
11862
|
+
lg: { [vars$i.fontSize]: '18px' },
|
|
11829
11863
|
},
|
|
11830
11864
|
|
|
11831
11865
|
mode: {
|
|
11832
11866
|
default: {
|
|
11833
|
-
[vars$
|
|
11867
|
+
[vars$i.textColor]: globalRefs$e.colors.surface.dark,
|
|
11834
11868
|
_bordered: {
|
|
11835
|
-
[vars$
|
|
11869
|
+
[vars$i.borderColor]: globalRefs$e.colors.surface.light,
|
|
11836
11870
|
},
|
|
11837
11871
|
},
|
|
11838
11872
|
primary: {
|
|
11839
|
-
[vars$
|
|
11873
|
+
[vars$i.textColor]: globalRefs$e.colors.primary.main,
|
|
11840
11874
|
_bordered: {
|
|
11841
|
-
[vars$
|
|
11875
|
+
[vars$i.borderColor]: globalRefs$e.colors.primary.light,
|
|
11842
11876
|
},
|
|
11843
11877
|
},
|
|
11844
11878
|
secondary: {
|
|
11845
|
-
[vars$
|
|
11879
|
+
[vars$i.textColor]: globalRefs$e.colors.secondary.main,
|
|
11846
11880
|
_bordered: {
|
|
11847
|
-
[vars$
|
|
11881
|
+
[vars$i.borderColor]: globalRefs$e.colors.secondary.light,
|
|
11848
11882
|
},
|
|
11849
11883
|
},
|
|
11850
11884
|
error: {
|
|
11851
|
-
[vars$
|
|
11885
|
+
[vars$i.textColor]: globalRefs$e.colors.error.main,
|
|
11852
11886
|
_bordered: {
|
|
11853
|
-
[vars$
|
|
11887
|
+
[vars$i.borderColor]: globalRefs$e.colors.error.light,
|
|
11854
11888
|
},
|
|
11855
11889
|
},
|
|
11856
11890
|
success: {
|
|
11857
|
-
[vars$
|
|
11891
|
+
[vars$i.textColor]: globalRefs$e.colors.success.main,
|
|
11858
11892
|
_bordered: {
|
|
11859
|
-
[vars$
|
|
11893
|
+
[vars$i.borderColor]: globalRefs$e.colors.success.light,
|
|
11860
11894
|
},
|
|
11861
11895
|
},
|
|
11862
11896
|
},
|
|
@@ -11865,11 +11899,11 @@ const badge$2 = {
|
|
|
11865
11899
|
var badge$3 = /*#__PURE__*/Object.freeze({
|
|
11866
11900
|
__proto__: null,
|
|
11867
11901
|
default: badge$2,
|
|
11868
|
-
vars: vars$
|
|
11902
|
+
vars: vars$i
|
|
11869
11903
|
});
|
|
11870
11904
|
|
|
11871
|
-
const componentName$
|
|
11872
|
-
class RawAvatar extends createBaseClass({ componentName: componentName$
|
|
11905
|
+
const componentName$i = getComponentName('avatar');
|
|
11906
|
+
class RawAvatar extends createBaseClass({ componentName: componentName$i, baseSelector: ':host > .wrapper' }) {
|
|
11873
11907
|
constructor() {
|
|
11874
11908
|
super();
|
|
11875
11909
|
|
|
@@ -11973,16 +12007,16 @@ const AvatarClass = compose(
|
|
|
11973
12007
|
componentNameValidationMixin
|
|
11974
12008
|
)(RawAvatar);
|
|
11975
12009
|
|
|
11976
|
-
const globalRefs$
|
|
12010
|
+
const globalRefs$d = getThemeRefs(globals);
|
|
11977
12011
|
const compVars$1 = AvatarClass.cssVarList;
|
|
11978
12012
|
|
|
11979
12013
|
const avatar = {
|
|
11980
|
-
[compVars$1.hostDirection]: globalRefs$
|
|
11981
|
-
[compVars$1.editableIconColor]: globalRefs$
|
|
11982
|
-
[compVars$1.editableBorderColor]: globalRefs$
|
|
11983
|
-
[compVars$1.editableBackgroundColor]: globalRefs$
|
|
11984
|
-
[compVars$1.avatarTextColor]: globalRefs$
|
|
11985
|
-
[compVars$1.avatarBackgroundColor]: globalRefs$
|
|
12014
|
+
[compVars$1.hostDirection]: globalRefs$d.direction,
|
|
12015
|
+
[compVars$1.editableIconColor]: globalRefs$d.colors.surface.dark,
|
|
12016
|
+
[compVars$1.editableBorderColor]: globalRefs$d.colors.surface.dark,
|
|
12017
|
+
[compVars$1.editableBackgroundColor]: globalRefs$d.colors.surface.main,
|
|
12018
|
+
[compVars$1.avatarTextColor]: globalRefs$d.colors.surface.main,
|
|
12019
|
+
[compVars$1.avatarBackgroundColor]: globalRefs$d.colors.surface.dark,
|
|
11986
12020
|
|
|
11987
12021
|
_editable: {
|
|
11988
12022
|
[compVars$1.cursor]: 'pointer',
|
|
@@ -12008,21 +12042,21 @@ const avatar = {
|
|
|
12008
12042
|
},
|
|
12009
12043
|
};
|
|
12010
12044
|
|
|
12011
|
-
const vars$
|
|
12045
|
+
const vars$h = {
|
|
12012
12046
|
...compVars$1,
|
|
12013
12047
|
};
|
|
12014
12048
|
|
|
12015
12049
|
var avatar$1 = /*#__PURE__*/Object.freeze({
|
|
12016
12050
|
__proto__: null,
|
|
12017
12051
|
default: avatar,
|
|
12018
|
-
vars: vars$
|
|
12052
|
+
vars: vars$h
|
|
12019
12053
|
});
|
|
12020
12054
|
|
|
12021
|
-
const componentName$
|
|
12055
|
+
const componentName$h = getComponentName('mappings-field-internal');
|
|
12022
12056
|
|
|
12023
|
-
createBaseInputClass({ componentName: componentName$
|
|
12057
|
+
createBaseInputClass({ componentName: componentName$h, baseSelector: 'div' });
|
|
12024
12058
|
|
|
12025
|
-
const componentName$
|
|
12059
|
+
const componentName$g = getComponentName('mappings-field');
|
|
12026
12060
|
|
|
12027
12061
|
const customMixin$4 = (superclass) =>
|
|
12028
12062
|
class MappingsFieldMixinClass extends superclass {
|
|
@@ -12051,14 +12085,14 @@ const customMixin$4 = (superclass) =>
|
|
|
12051
12085
|
const template = document.createElement('template');
|
|
12052
12086
|
|
|
12053
12087
|
template.innerHTML = `
|
|
12054
|
-
<${componentName$
|
|
12088
|
+
<${componentName$h}
|
|
12055
12089
|
tabindex="-1"
|
|
12056
|
-
></${componentName$
|
|
12090
|
+
></${componentName$h}>
|
|
12057
12091
|
`;
|
|
12058
12092
|
|
|
12059
12093
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
|
12060
12094
|
|
|
12061
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
|
12095
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$h);
|
|
12062
12096
|
|
|
12063
12097
|
forwardAttrs(this, this.inputElement, {
|
|
12064
12098
|
includeAttrs: [
|
|
@@ -12190,47 +12224,47 @@ const MappingsFieldClass = compose(
|
|
|
12190
12224
|
'options',
|
|
12191
12225
|
'error-message',
|
|
12192
12226
|
],
|
|
12193
|
-
componentName: componentName$
|
|
12227
|
+
componentName: componentName$g,
|
|
12194
12228
|
})
|
|
12195
12229
|
);
|
|
12196
12230
|
|
|
12197
|
-
const globalRefs$
|
|
12231
|
+
const globalRefs$c = getThemeRefs(globals);
|
|
12198
12232
|
|
|
12199
|
-
const vars$
|
|
12233
|
+
const vars$g = MappingsFieldClass.cssVarList;
|
|
12200
12234
|
|
|
12201
12235
|
const mappingsField = {
|
|
12202
|
-
[vars$
|
|
12203
|
-
[vars$
|
|
12204
|
-
[vars$
|
|
12205
|
-
[vars$
|
|
12206
|
-
[vars$
|
|
12207
|
-
[vars$
|
|
12208
|
-
[vars$
|
|
12209
|
-
[vars$
|
|
12210
|
-
[vars$
|
|
12211
|
-
[vars$
|
|
12236
|
+
[vars$g.hostWidth]: refs.width,
|
|
12237
|
+
[vars$g.hostDirection]: refs.direction,
|
|
12238
|
+
[vars$g.fontSize]: refs.fontSize,
|
|
12239
|
+
[vars$g.fontFamily]: refs.fontFamily,
|
|
12240
|
+
[vars$g.separatorFontSize]: '14px',
|
|
12241
|
+
[vars$g.labelsFontSize]: '14px',
|
|
12242
|
+
[vars$g.labelsLineHeight]: '1',
|
|
12243
|
+
[vars$g.labelsMarginBottom]: '6px',
|
|
12244
|
+
[vars$g.labelTextColor]: refs.labelTextColor,
|
|
12245
|
+
[vars$g.itemMarginBottom]: '1em',
|
|
12212
12246
|
// To be positioned correctly, the min width has to match the text field min width
|
|
12213
|
-
[vars$
|
|
12247
|
+
[vars$g.valueLabelMinWidth]: refs.minWidth,
|
|
12214
12248
|
// To be positioned correctly, the min width has to match the combo box field min width
|
|
12215
|
-
[vars$
|
|
12216
|
-
[vars$
|
|
12217
|
-
[vars$
|
|
12249
|
+
[vars$g.attrLabelMinWidth]: `calc(12em + 2 * ${globalRefs$c.border.xs})`,
|
|
12250
|
+
[vars$g.separatorWidth]: '70px',
|
|
12251
|
+
[vars$g.removeButtonWidth]: '60px',
|
|
12218
12252
|
};
|
|
12219
12253
|
|
|
12220
12254
|
var mappingsField$1 = /*#__PURE__*/Object.freeze({
|
|
12221
12255
|
__proto__: null,
|
|
12222
12256
|
default: mappingsField,
|
|
12223
12257
|
mappingsField: mappingsField,
|
|
12224
|
-
vars: vars$
|
|
12258
|
+
vars: vars$g
|
|
12225
12259
|
});
|
|
12226
12260
|
|
|
12227
12261
|
var deleteIcon = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iMTgiIHZpZXdCb3g9IjAgMCAxNCAxOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEgMTZDMSAxNy4xIDEuOSAxOCAzIDE4SDExQzEyLjEgMTggMTMgMTcuMSAxMyAxNlY0SDFWMTZaTTMgNkgxMVYxNkgzVjZaTTEwLjUgMUw5LjUgMEg0LjVMMy41IDFIMFYzSDE0VjFIMTAuNVoiIGZpbGw9ImN1cnJlbnRjb2xvciIvPgo8L3N2Zz4K";
|
|
12228
12262
|
|
|
12229
12263
|
var editIcon = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTUiIGhlaWdodD0iMTUiIHZpZXdCb3g9IjAgMCAxNSAxNSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEwLjAwMDIgMC45OTIxNDlDMTAuMDAwMiAxLjAxNjE1IDEwLjAwMDIgMS4wMTYxNSAxMC4wMDAyIDEuMDE2MTVMOC4yMjQxOSAzLjAwODE1SDIuOTkyMTlDMi40NjQxOSAzLjAwODE1IDIuMDA4MTkgMy40NDAxNSAyLjAwODE5IDMuOTkyMTVWMTIuMDA4MkMyLjAwODE5IDEyLjUzNjIgMi40NDAxOSAxMi45OTIyIDIuOTkyMTkgMTIuOTkyMkg1LjUzNjE5QzUuODQ4MTkgMTMuMDQwMiA2LjE2MDE5IDEzLjA0MDIgNi40NzIxOSAxMi45OTIySDExLjAwODJDMTEuNTM2MiAxMi45OTIyIDExLjk5MjIgMTIuNTYwMiAxMS45OTIyIDEyLjAwODJWNy43ODQxNkwxMy45MzYyIDUuNjI0MTVMMTQuMDA4MiA1LjY3MjE1VjExLjk4NDJDMTQuMDA4MiAxMy42NjQyIDEyLjY2NDIgMTUuMDA4MiAxMS4wMDgyIDE1LjAwODJIMy4wMTYxOUMxLjMzNjE5IDE1LjAwODIgLTAuMDA3ODEyNSAxMy42NjQyIC0wLjAwNzgxMjUgMTEuOTg0MlYzLjk5MjE1Qy0wLjAwNzgxMjUgMi4zMzYxNSAxLjMzNjE5IDAuOTkyMTQ5IDMuMDE2MTkgMC45OTIxNDlIMTAuMDAwMlpNMTEuMjcyMiAyLjYyNDE1TDEyLjYxNjIgNC4xMTIxNUw3LjcyMDE5IDkuNjgwMTZDNy41MDQxOSA5LjkyMDE2IDYuODMyMTkgMTAuMjMyMiA1LjY4MDE5IDEwLjYxNjJDNS42NTYxOSAxMC42NDAyIDUuNjA4MTkgMTAuNjQwMiA1LjU2MDE5IDEwLjYxNjJDNS40NjQxOSAxMC41OTIyIDUuMzkyMTkgMTAuNDcyMiA1LjQ0MDE5IDEwLjM3NjJDNS43NTIxOSA5LjI0ODE2IDYuMDQwMTkgOC41NTIxNiA2LjI1NjE5IDguMzEyMTZMMTEuMjcyMiAyLjYyNDE1Wk0xMS45MjAyIDEuODU2MTVMMTMuMjg4MiAwLjMyMDE0OUMxMy42NDgyIC0wLjA4Nzg1MTYgMTQuMjcyMiAtMC4xMTE4NTIgMTQuNjgwMiAwLjI3MjE0OUMxNS4wODgyIDAuNjMyMTQ5IDE1LjExMjIgMS4yODAxNSAxNC43NTIyIDEuNjg4MTVMMTMuMjY0MiAzLjM2ODE1TDExLjkyMDIgMS44NTYxNVoiIGZpbGw9ImN1cnJlbnRjb2xvciIvPgo8L3N2Zz4K";
|
|
12230
12264
|
|
|
12231
|
-
const componentName$
|
|
12265
|
+
const componentName$f = getComponentName('user-attribute');
|
|
12232
12266
|
class RawUserAttribute extends createBaseClass({
|
|
12233
|
-
componentName: componentName$
|
|
12267
|
+
componentName: componentName$f,
|
|
12234
12268
|
baseSelector: ':host > .root',
|
|
12235
12269
|
}) {
|
|
12236
12270
|
constructor() {
|
|
@@ -12464,32 +12498,32 @@ const UserAttributeClass = compose(
|
|
|
12464
12498
|
componentNameValidationMixin
|
|
12465
12499
|
)(RawUserAttribute);
|
|
12466
12500
|
|
|
12467
|
-
const globalRefs$
|
|
12468
|
-
const vars$
|
|
12501
|
+
const globalRefs$b = getThemeRefs(globals);
|
|
12502
|
+
const vars$f = UserAttributeClass.cssVarList;
|
|
12469
12503
|
|
|
12470
12504
|
const userAttribute = {
|
|
12471
|
-
[vars$
|
|
12472
|
-
[vars$
|
|
12473
|
-
[vars$
|
|
12474
|
-
[vars$
|
|
12475
|
-
[vars$
|
|
12476
|
-
[vars$
|
|
12505
|
+
[vars$f.hostDirection]: globalRefs$b.direction,
|
|
12506
|
+
[vars$f.labelTextWidth]: '150px',
|
|
12507
|
+
[vars$f.valueTextWidth]: '200px',
|
|
12508
|
+
[vars$f.badgeMaxWidth]: '85px',
|
|
12509
|
+
[vars$f.itemsGap]: '16px',
|
|
12510
|
+
[vars$f.hostMinWidth]: '530px',
|
|
12477
12511
|
_fullWidth: {
|
|
12478
|
-
[vars$
|
|
12512
|
+
[vars$f.hostWidth]: '100%',
|
|
12479
12513
|
},
|
|
12480
12514
|
};
|
|
12481
12515
|
|
|
12482
12516
|
var userAttribute$1 = /*#__PURE__*/Object.freeze({
|
|
12483
12517
|
__proto__: null,
|
|
12484
12518
|
default: userAttribute,
|
|
12485
|
-
vars: vars$
|
|
12519
|
+
vars: vars$f
|
|
12486
12520
|
});
|
|
12487
12521
|
|
|
12488
12522
|
var greenVIcon = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTggMEMzLjYgMCAwIDMuNiAwIDhDMCAxMi40IDMuNiAxNiA4IDE2QzEyLjQgMTYgMTYgMTIuNCAxNiA4QzE2IDMuNiAxMi40IDAgOCAwWk03LjEgMTEuN0wyLjkgNy42TDQuMyA2LjJMNyA4LjlMMTIgNEwxMy40IDUuNEw3LjEgMTEuN1oiIGZpbGw9IiM0Q0FGNTAiLz4KPC9zdmc+Cg==";
|
|
12489
12523
|
|
|
12490
|
-
const componentName$
|
|
12524
|
+
const componentName$e = getComponentName('user-auth-method');
|
|
12491
12525
|
class RawUserAuthMethod extends createBaseClass({
|
|
12492
|
-
componentName: componentName$
|
|
12526
|
+
componentName: componentName$e,
|
|
12493
12527
|
baseSelector: ':host > .root',
|
|
12494
12528
|
}) {
|
|
12495
12529
|
constructor() {
|
|
@@ -12681,31 +12715,31 @@ const UserAuthMethodClass = compose(
|
|
|
12681
12715
|
componentNameValidationMixin
|
|
12682
12716
|
)(RawUserAuthMethod);
|
|
12683
12717
|
|
|
12684
|
-
const globalRefs$
|
|
12685
|
-
const vars$
|
|
12718
|
+
const globalRefs$a = getThemeRefs(globals);
|
|
12719
|
+
const vars$e = UserAuthMethodClass.cssVarList;
|
|
12686
12720
|
|
|
12687
12721
|
const userAuthMethod = {
|
|
12688
|
-
[vars$
|
|
12689
|
-
[vars$
|
|
12690
|
-
[vars$
|
|
12691
|
-
[vars$
|
|
12692
|
-
[vars$
|
|
12722
|
+
[vars$e.hostDirection]: globalRefs$a.direction,
|
|
12723
|
+
[vars$e.labelTextWidth]: '200px',
|
|
12724
|
+
[vars$e.itemsGap]: '16px',
|
|
12725
|
+
[vars$e.hostMinWidth]: '530px',
|
|
12726
|
+
[vars$e.iconSize]: '24px',
|
|
12693
12727
|
_fullWidth: {
|
|
12694
|
-
[vars$
|
|
12728
|
+
[vars$e.hostWidth]: '100%',
|
|
12695
12729
|
},
|
|
12696
12730
|
};
|
|
12697
12731
|
|
|
12698
12732
|
var userAuthMethod$1 = /*#__PURE__*/Object.freeze({
|
|
12699
12733
|
__proto__: null,
|
|
12700
12734
|
default: userAuthMethod,
|
|
12701
|
-
vars: vars$
|
|
12735
|
+
vars: vars$e
|
|
12702
12736
|
});
|
|
12703
12737
|
|
|
12704
|
-
const componentName$
|
|
12738
|
+
const componentName$d = getComponentName('saml-group-mappings-internal');
|
|
12705
12739
|
|
|
12706
|
-
createBaseInputClass({ componentName: componentName$
|
|
12740
|
+
createBaseInputClass({ componentName: componentName$d, baseSelector: '' });
|
|
12707
12741
|
|
|
12708
|
-
const componentName$
|
|
12742
|
+
const componentName$c = getComponentName('saml-group-mappings');
|
|
12709
12743
|
|
|
12710
12744
|
const customMixin$3 = (superclass) =>
|
|
12711
12745
|
class SamlGroupMappingsMixinClass extends superclass {
|
|
@@ -12715,14 +12749,14 @@ const customMixin$3 = (superclass) =>
|
|
|
12715
12749
|
const template = document.createElement('template');
|
|
12716
12750
|
|
|
12717
12751
|
template.innerHTML = `
|
|
12718
|
-
<${componentName$
|
|
12752
|
+
<${componentName$d}
|
|
12719
12753
|
tabindex="-1"
|
|
12720
|
-
></${componentName$
|
|
12754
|
+
></${componentName$d}>
|
|
12721
12755
|
`;
|
|
12722
12756
|
|
|
12723
12757
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
|
12724
12758
|
|
|
12725
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
|
12759
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$d);
|
|
12726
12760
|
|
|
12727
12761
|
forwardAttrs(this, this.inputElement, {
|
|
12728
12762
|
includeAttrs: [
|
|
@@ -12799,61 +12833,61 @@ const SamlGroupMappingsClass = compose(
|
|
|
12799
12833
|
'options',
|
|
12800
12834
|
'error-message',
|
|
12801
12835
|
],
|
|
12802
|
-
componentName: componentName$
|
|
12836
|
+
componentName: componentName$c,
|
|
12803
12837
|
})
|
|
12804
12838
|
);
|
|
12805
12839
|
|
|
12806
|
-
const vars$
|
|
12840
|
+
const vars$d = SamlGroupMappingsClass.cssVarList;
|
|
12807
12841
|
|
|
12808
12842
|
const samlGroupMappings = {
|
|
12809
|
-
[vars$
|
|
12810
|
-
[vars$
|
|
12811
|
-
[vars$
|
|
12843
|
+
[vars$d.hostWidth]: refs.width,
|
|
12844
|
+
[vars$d.hostDirection]: refs.direction,
|
|
12845
|
+
[vars$d.groupNameInputMarginBottom]: '1em',
|
|
12812
12846
|
};
|
|
12813
12847
|
|
|
12814
12848
|
var samlGroupMappings$1 = /*#__PURE__*/Object.freeze({
|
|
12815
12849
|
__proto__: null,
|
|
12816
12850
|
default: samlGroupMappings,
|
|
12817
12851
|
samlGroupMappings: samlGroupMappings,
|
|
12818
|
-
vars: vars$
|
|
12852
|
+
vars: vars$d
|
|
12819
12853
|
});
|
|
12820
12854
|
|
|
12821
|
-
const globalRefs$
|
|
12822
|
-
const vars$
|
|
12855
|
+
const globalRefs$9 = getThemeRefs(globals);
|
|
12856
|
+
const vars$c = PolicyValidationClass.cssVarList;
|
|
12823
12857
|
|
|
12824
12858
|
const policyValidation = {
|
|
12825
|
-
[vars$
|
|
12826
|
-
[vars$
|
|
12827
|
-
[vars$
|
|
12828
|
-
[vars$
|
|
12829
|
-
[vars$
|
|
12830
|
-
[vars$
|
|
12831
|
-
[vars$
|
|
12832
|
-
[vars$
|
|
12833
|
-
[vars$
|
|
12834
|
-
[vars$
|
|
12835
|
-
[vars$
|
|
12836
|
-
[vars$
|
|
12837
|
-
[vars$
|
|
12838
|
-
[vars$
|
|
12839
|
-
[vars$
|
|
12840
|
-
[vars$
|
|
12859
|
+
[vars$c.fontFamily]: refs.fontFamily,
|
|
12860
|
+
[vars$c.fontSize]: refs.labelFontSize,
|
|
12861
|
+
[vars$c.textColor]: refs.labelTextColor,
|
|
12862
|
+
[vars$c.borderWidth]: refs.borderWidth,
|
|
12863
|
+
[vars$c.borderStyle]: refs.borderStyle,
|
|
12864
|
+
[vars$c.borderColor]: refs.borderColor,
|
|
12865
|
+
[vars$c.borderRadius]: globalRefs$9.radius.sm,
|
|
12866
|
+
[vars$c.backgroundColor]: 'none',
|
|
12867
|
+
[vars$c.padding]: '0px',
|
|
12868
|
+
[vars$c.labelMargin]: globalRefs$9.spacing.sm,
|
|
12869
|
+
[vars$c.itemsSpacing]: globalRefs$9.spacing.lg,
|
|
12870
|
+
[vars$c.itemSymbolDefault]: "'\\2022'", // "•"
|
|
12871
|
+
[vars$c.itemSymbolSuccess]: "'\\2713'", // "✓"
|
|
12872
|
+
[vars$c.itemSymbolError]: "'\\2A09'", // "⨉"
|
|
12873
|
+
[vars$c.itemSymbolSuccessColor]: globalRefs$9.colors.success.main,
|
|
12874
|
+
[vars$c.itemSymbolErrorColor]: globalRefs$9.colors.error.main,
|
|
12841
12875
|
};
|
|
12842
12876
|
|
|
12843
12877
|
var policyValidation$1 = /*#__PURE__*/Object.freeze({
|
|
12844
12878
|
__proto__: null,
|
|
12845
12879
|
default: policyValidation,
|
|
12846
|
-
vars: vars$
|
|
12880
|
+
vars: vars$c
|
|
12847
12881
|
});
|
|
12848
12882
|
|
|
12849
|
-
const vars$
|
|
12883
|
+
const vars$b = IconClass.cssVarList;
|
|
12850
12884
|
|
|
12851
12885
|
const icon = {};
|
|
12852
12886
|
|
|
12853
12887
|
var icon$1 = /*#__PURE__*/Object.freeze({
|
|
12854
12888
|
__proto__: null,
|
|
12855
12889
|
default: icon,
|
|
12856
|
-
vars: vars$
|
|
12890
|
+
vars: vars$b
|
|
12857
12891
|
});
|
|
12858
12892
|
|
|
12859
12893
|
const decode = (input) => {
|
|
@@ -12866,9 +12900,9 @@ const tpl = (input, inline) => {
|
|
|
12866
12900
|
return inline ? input : `<pre>${input}</pre>`;
|
|
12867
12901
|
};
|
|
12868
12902
|
|
|
12869
|
-
const componentName$
|
|
12903
|
+
const componentName$b = getComponentName('code-snippet');
|
|
12870
12904
|
|
|
12871
|
-
let CodeSnippet$1 = class CodeSnippet extends createBaseClass({ componentName: componentName$
|
|
12905
|
+
let CodeSnippet$1 = class CodeSnippet extends createBaseClass({ componentName: componentName$b, baseSelector: ':host > code' }) {
|
|
12872
12906
|
static get observedAttributes() {
|
|
12873
12907
|
return ['lang', 'inline'];
|
|
12874
12908
|
}
|
|
@@ -13098,9 +13132,9 @@ const CodeSnippetClass = compose(
|
|
|
13098
13132
|
componentNameValidationMixin
|
|
13099
13133
|
)(CodeSnippet$1);
|
|
13100
13134
|
|
|
13101
|
-
const globalRefs$
|
|
13135
|
+
const globalRefs$8 = getThemeRefs(globals);
|
|
13102
13136
|
|
|
13103
|
-
const vars$
|
|
13137
|
+
const vars$a = CodeSnippetClass.cssVarList;
|
|
13104
13138
|
|
|
13105
13139
|
const light = {
|
|
13106
13140
|
color1: '#fa0',
|
|
@@ -13135,50 +13169,50 @@ const dark = {
|
|
|
13135
13169
|
};
|
|
13136
13170
|
|
|
13137
13171
|
const CodeSnippet = {
|
|
13138
|
-
[vars$
|
|
13139
|
-
[vars$
|
|
13140
|
-
[vars$
|
|
13141
|
-
[vars$
|
|
13142
|
-
[vars$
|
|
13143
|
-
[vars$
|
|
13144
|
-
[vars$
|
|
13145
|
-
[vars$
|
|
13146
|
-
[vars$
|
|
13147
|
-
[vars$
|
|
13148
|
-
[vars$
|
|
13149
|
-
[vars$
|
|
13150
|
-
[vars$
|
|
13151
|
-
[vars$
|
|
13152
|
-
[vars$
|
|
13153
|
-
[vars$
|
|
13154
|
-
[vars$
|
|
13155
|
-
[vars$
|
|
13156
|
-
[vars$
|
|
13157
|
-
[vars$
|
|
13158
|
-
[vars$
|
|
13159
|
-
[vars$
|
|
13160
|
-
[vars$
|
|
13161
|
-
[vars$
|
|
13162
|
-
[vars$
|
|
13163
|
-
[vars$
|
|
13164
|
-
[vars$
|
|
13165
|
-
[vars$
|
|
13166
|
-
[vars$
|
|
13167
|
-
[vars$
|
|
13168
|
-
[vars$
|
|
13169
|
-
[vars$
|
|
13170
|
-
[vars$
|
|
13171
|
-
[vars$
|
|
13172
|
-
[vars$
|
|
13173
|
-
[vars$
|
|
13174
|
-
[vars$
|
|
13175
|
-
[vars$
|
|
13176
|
-
[vars$
|
|
13177
|
-
[vars$
|
|
13178
|
-
[vars$
|
|
13179
|
-
[vars$
|
|
13180
|
-
[vars$
|
|
13181
|
-
[vars$
|
|
13172
|
+
[vars$a.rootBgColor]: globalRefs$8.colors.surface.main,
|
|
13173
|
+
[vars$a.rootTextColor]: globalRefs$8.colors.surface.contrast,
|
|
13174
|
+
[vars$a.docTagTextColor]: light.color2,
|
|
13175
|
+
[vars$a.keywordTextColor]: light.color2,
|
|
13176
|
+
[vars$a.metaKeywordTextColor]: light.color2,
|
|
13177
|
+
[vars$a.templateTagTextColor]: light.color2,
|
|
13178
|
+
[vars$a.templateVariableTextColor]: light.color2,
|
|
13179
|
+
[vars$a.typeTextColor]: light.color2,
|
|
13180
|
+
[vars$a.variableLanguageTextColor]: light.color2,
|
|
13181
|
+
[vars$a.titleTextColor]: light.color3,
|
|
13182
|
+
[vars$a.titleClassTextColor]: light.color3,
|
|
13183
|
+
[vars$a.titleClassInheritedTextColor]: light.color3,
|
|
13184
|
+
[vars$a.titleFunctionTextColor]: light.color3,
|
|
13185
|
+
[vars$a.attrTextColor]: light.color4,
|
|
13186
|
+
[vars$a.attributeTextColor]: light.color4,
|
|
13187
|
+
[vars$a.literalTextColor]: light.color4,
|
|
13188
|
+
[vars$a.metaTextColor]: light.color4,
|
|
13189
|
+
[vars$a.numberTextColor]: light.color4,
|
|
13190
|
+
[vars$a.operatorTextColor]: light.color4,
|
|
13191
|
+
[vars$a.variableTextColor]: light.color4,
|
|
13192
|
+
[vars$a.selectorAttrTextColor]: light.color4,
|
|
13193
|
+
[vars$a.selectorClassTextColor]: light.color4,
|
|
13194
|
+
[vars$a.selectorIdTextColor]: light.color4,
|
|
13195
|
+
[vars$a.regexpTextColor]: light.color13,
|
|
13196
|
+
[vars$a.stringTextColor]: light.color13,
|
|
13197
|
+
[vars$a.metaStringTextColor]: light.color13,
|
|
13198
|
+
[vars$a.builtInTextColor]: light.color5,
|
|
13199
|
+
[vars$a.symbolTextColor]: light.color5,
|
|
13200
|
+
[vars$a.commentTextColor]: light.color6,
|
|
13201
|
+
[vars$a.codeTextColor]: light.color6,
|
|
13202
|
+
[vars$a.formulaTextColor]: light.color6,
|
|
13203
|
+
[vars$a.nameTextColor]: light.color7,
|
|
13204
|
+
[vars$a.quoteTextColor]: light.color7,
|
|
13205
|
+
[vars$a.selectorTagTextColor]: light.color7,
|
|
13206
|
+
[vars$a.selectorPseudoTextColor]: light.color7,
|
|
13207
|
+
[vars$a.substTextColor]: light.color8,
|
|
13208
|
+
[vars$a.sectionTextColor]: light.color4,
|
|
13209
|
+
[vars$a.bulletTextColor]: light.color9,
|
|
13210
|
+
[vars$a.emphasisTextColor]: light.color8,
|
|
13211
|
+
[vars$a.strongTextColor]: light.color8,
|
|
13212
|
+
[vars$a.additionTextColor]: light.color7,
|
|
13213
|
+
[vars$a.additionBgColor]: light.color10,
|
|
13214
|
+
[vars$a.deletionTextColor]: light.color2,
|
|
13215
|
+
[vars$a.deletionBgColor]: light.color10,
|
|
13182
13216
|
/* purposely ignored */
|
|
13183
13217
|
// [vars.charEscapeTextColor]: '',
|
|
13184
13218
|
// [vars.linkTextColor]: '',
|
|
@@ -13190,50 +13224,50 @@ const CodeSnippet = {
|
|
|
13190
13224
|
|
|
13191
13225
|
const codeSnippetDarkThemeOverrides = {
|
|
13192
13226
|
codeSnippet: {
|
|
13193
|
-
[vars$
|
|
13194
|
-
[vars$
|
|
13195
|
-
[vars$
|
|
13196
|
-
[vars$
|
|
13197
|
-
[vars$
|
|
13198
|
-
[vars$
|
|
13199
|
-
[vars$
|
|
13200
|
-
[vars$
|
|
13201
|
-
[vars$
|
|
13202
|
-
[vars$
|
|
13203
|
-
[vars$
|
|
13204
|
-
[vars$
|
|
13205
|
-
[vars$
|
|
13206
|
-
[vars$
|
|
13207
|
-
[vars$
|
|
13208
|
-
[vars$
|
|
13209
|
-
[vars$
|
|
13210
|
-
[vars$
|
|
13211
|
-
[vars$
|
|
13212
|
-
[vars$
|
|
13213
|
-
[vars$
|
|
13214
|
-
[vars$
|
|
13215
|
-
[vars$
|
|
13216
|
-
[vars$
|
|
13217
|
-
[vars$
|
|
13218
|
-
[vars$
|
|
13219
|
-
[vars$
|
|
13220
|
-
[vars$
|
|
13221
|
-
[vars$
|
|
13222
|
-
[vars$
|
|
13223
|
-
[vars$
|
|
13224
|
-
[vars$
|
|
13225
|
-
[vars$
|
|
13226
|
-
[vars$
|
|
13227
|
-
[vars$
|
|
13228
|
-
[vars$
|
|
13229
|
-
[vars$
|
|
13230
|
-
[vars$
|
|
13231
|
-
[vars$
|
|
13232
|
-
[vars$
|
|
13233
|
-
[vars$
|
|
13234
|
-
[vars$
|
|
13235
|
-
[vars$
|
|
13236
|
-
[vars$
|
|
13227
|
+
[vars$a.rootBgColor]: globalRefs$8.colors.surface.main,
|
|
13228
|
+
[vars$a.rootTextColor]: globalRefs$8.colors.surface.contrast,
|
|
13229
|
+
[vars$a.docTagTextColor]: dark.color2,
|
|
13230
|
+
[vars$a.keywordTextColor]: dark.color2,
|
|
13231
|
+
[vars$a.metaKeywordTextColor]: dark.color2,
|
|
13232
|
+
[vars$a.templateTagTextColor]: dark.color2,
|
|
13233
|
+
[vars$a.templateVariableTextColor]: dark.color2,
|
|
13234
|
+
[vars$a.typeTextColor]: dark.color2,
|
|
13235
|
+
[vars$a.variableLanguageTextColor]: dark.color2,
|
|
13236
|
+
[vars$a.titleTextColor]: dark.color3,
|
|
13237
|
+
[vars$a.titleClassTextColor]: dark.color3,
|
|
13238
|
+
[vars$a.titleClassInheritedTextColor]: dark.color3,
|
|
13239
|
+
[vars$a.titleFunctionTextColor]: dark.color3,
|
|
13240
|
+
[vars$a.attrTextColor]: dark.color4,
|
|
13241
|
+
[vars$a.attributeTextColor]: dark.color4,
|
|
13242
|
+
[vars$a.literalTextColor]: dark.color4,
|
|
13243
|
+
[vars$a.metaTextColor]: dark.color4,
|
|
13244
|
+
[vars$a.numberTextColor]: dark.color4,
|
|
13245
|
+
[vars$a.operatorTextColor]: dark.color4,
|
|
13246
|
+
[vars$a.variableTextColor]: dark.color4,
|
|
13247
|
+
[vars$a.selectorAttrTextColor]: dark.color4,
|
|
13248
|
+
[vars$a.selectorClassTextColor]: dark.color4,
|
|
13249
|
+
[vars$a.selectorIdTextColor]: dark.color4,
|
|
13250
|
+
[vars$a.regexpTextColor]: dark.color13,
|
|
13251
|
+
[vars$a.stringTextColor]: dark.color13,
|
|
13252
|
+
[vars$a.metaStringTextColor]: dark.color13,
|
|
13253
|
+
[vars$a.builtInTextColor]: dark.color5,
|
|
13254
|
+
[vars$a.symbolTextColor]: dark.color5,
|
|
13255
|
+
[vars$a.commentTextColor]: dark.color6,
|
|
13256
|
+
[vars$a.codeTextColor]: dark.color6,
|
|
13257
|
+
[vars$a.formulaTextColor]: dark.color6,
|
|
13258
|
+
[vars$a.nameTextColor]: dark.color7,
|
|
13259
|
+
[vars$a.quoteTextColor]: dark.color7,
|
|
13260
|
+
[vars$a.selectorTagTextColor]: dark.color7,
|
|
13261
|
+
[vars$a.selectorPseudoTextColor]: dark.color7,
|
|
13262
|
+
[vars$a.substTextColor]: dark.color8,
|
|
13263
|
+
[vars$a.sectionTextColor]: dark.color4,
|
|
13264
|
+
[vars$a.bulletTextColor]: dark.color9,
|
|
13265
|
+
[vars$a.emphasisTextColor]: dark.color8,
|
|
13266
|
+
[vars$a.strongTextColor]: dark.color8,
|
|
13267
|
+
[vars$a.additionTextColor]: dark.color7,
|
|
13268
|
+
[vars$a.additionBgColor]: dark.color10,
|
|
13269
|
+
[vars$a.deletionTextColor]: dark.color2,
|
|
13270
|
+
[vars$a.deletionBgColor]: dark.color10,
|
|
13237
13271
|
},
|
|
13238
13272
|
};
|
|
13239
13273
|
|
|
@@ -13241,10 +13275,10 @@ var codeSnippet = /*#__PURE__*/Object.freeze({
|
|
|
13241
13275
|
__proto__: null,
|
|
13242
13276
|
codeSnippetDarkThemeOverrides: codeSnippetDarkThemeOverrides,
|
|
13243
13277
|
default: CodeSnippet,
|
|
13244
|
-
vars: vars$
|
|
13278
|
+
vars: vars$a
|
|
13245
13279
|
});
|
|
13246
13280
|
|
|
13247
|
-
const componentName$
|
|
13281
|
+
const componentName$a = getComponentName('radio-button');
|
|
13248
13282
|
|
|
13249
13283
|
const customMixin$2 = (superclass) =>
|
|
13250
13284
|
class CustomMixin extends superclass {
|
|
@@ -13309,11 +13343,11 @@ const RadioButtonClass = compose(
|
|
|
13309
13343
|
wrappedEleName: 'vaadin-radio-button',
|
|
13310
13344
|
excludeAttrsSync: ['tabindex', 'data'],
|
|
13311
13345
|
includeForwardProps: ['checked', 'name', 'disabled'],
|
|
13312
|
-
componentName: componentName$
|
|
13346
|
+
componentName: componentName$a,
|
|
13313
13347
|
})
|
|
13314
13348
|
);
|
|
13315
13349
|
|
|
13316
|
-
const componentName$
|
|
13350
|
+
const componentName$9 = getComponentName('radio-group');
|
|
13317
13351
|
|
|
13318
13352
|
const RadioGroupMixin = (superclass) =>
|
|
13319
13353
|
class RadioGroupMixinClass extends superclass {
|
|
@@ -13328,12 +13362,12 @@ const RadioGroupMixin = (superclass) =>
|
|
|
13328
13362
|
|
|
13329
13363
|
// we are overriding vaadin children getter so it will run on our custom elements
|
|
13330
13364
|
Object.defineProperty(this.baseElement, 'children', {
|
|
13331
|
-
get: () => this.querySelectorAll(componentName$
|
|
13365
|
+
get: () => this.querySelectorAll(componentName$a),
|
|
13332
13366
|
});
|
|
13333
13367
|
|
|
13334
13368
|
// we are overriding vaadin __filterRadioButtons so it will run on our custom elements
|
|
13335
13369
|
this.baseElement.__filterRadioButtons = (nodes) => {
|
|
13336
|
-
return nodes.filter((node) => node.localName === componentName$
|
|
13370
|
+
return nodes.filter((node) => node.localName === componentName$a);
|
|
13337
13371
|
};
|
|
13338
13372
|
|
|
13339
13373
|
// vaadin radio group missing some input properties
|
|
@@ -13483,38 +13517,38 @@ const RadioGroupClass = compose(
|
|
|
13483
13517
|
`,
|
|
13484
13518
|
|
|
13485
13519
|
excludeAttrsSync: ['tabindex', 'size', 'data', 'direction'],
|
|
13486
|
-
componentName: componentName$
|
|
13520
|
+
componentName: componentName$9,
|
|
13487
13521
|
includeForwardProps: ['value'],
|
|
13488
13522
|
})
|
|
13489
13523
|
);
|
|
13490
13524
|
|
|
13491
|
-
const vars$
|
|
13492
|
-
const globalRefs$
|
|
13525
|
+
const vars$9 = RadioGroupClass.cssVarList;
|
|
13526
|
+
const globalRefs$7 = getThemeRefs(globals);
|
|
13493
13527
|
|
|
13494
13528
|
const radioGroup = {
|
|
13495
|
-
[vars$
|
|
13496
|
-
[vars$
|
|
13497
|
-
[vars$
|
|
13498
|
-
[vars$
|
|
13499
|
-
[vars$
|
|
13500
|
-
[vars$
|
|
13501
|
-
[vars$
|
|
13502
|
-
[vars$
|
|
13503
|
-
[vars$
|
|
13504
|
-
[vars$
|
|
13529
|
+
[vars$9.buttonsRowGap]: '9px',
|
|
13530
|
+
[vars$9.hostWidth]: refs.width,
|
|
13531
|
+
[vars$9.hostDirection]: refs.direction,
|
|
13532
|
+
[vars$9.fontSize]: refs.fontSize,
|
|
13533
|
+
[vars$9.fontFamily]: refs.fontFamily,
|
|
13534
|
+
[vars$9.labelTextColor]: refs.labelTextColor,
|
|
13535
|
+
[vars$9.labelRequiredIndicator]: refs.requiredIndicator,
|
|
13536
|
+
[vars$9.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
13537
|
+
[vars$9.helperTextColor]: refs.helperTextColor,
|
|
13538
|
+
[vars$9.itemsLabelColor]: globalRefs$7.colors.surface.contrast,
|
|
13505
13539
|
|
|
13506
13540
|
textAlign: {
|
|
13507
|
-
right: { [vars$
|
|
13508
|
-
left: { [vars$
|
|
13509
|
-
center: { [vars$
|
|
13541
|
+
right: { [vars$9.inputTextAlign]: 'right' },
|
|
13542
|
+
left: { [vars$9.inputTextAlign]: 'left' },
|
|
13543
|
+
center: { [vars$9.inputTextAlign]: 'center' },
|
|
13510
13544
|
},
|
|
13511
13545
|
|
|
13512
13546
|
_fullWidth: {
|
|
13513
|
-
[vars$
|
|
13547
|
+
[vars$9.buttonsSpacing]: 'space-between',
|
|
13514
13548
|
},
|
|
13515
13549
|
|
|
13516
13550
|
_disabled: {
|
|
13517
|
-
[vars$
|
|
13551
|
+
[vars$9.itemsLabelColor]: globalRefs$7.colors.surface.light,
|
|
13518
13552
|
},
|
|
13519
13553
|
};
|
|
13520
13554
|
|
|
@@ -13522,24 +13556,24 @@ var radioGroup$1 = /*#__PURE__*/Object.freeze({
|
|
|
13522
13556
|
__proto__: null,
|
|
13523
13557
|
default: radioGroup,
|
|
13524
13558
|
radioGroup: radioGroup,
|
|
13525
|
-
vars: vars$
|
|
13559
|
+
vars: vars$9
|
|
13526
13560
|
});
|
|
13527
13561
|
|
|
13528
|
-
const vars$
|
|
13529
|
-
const globalRefs$
|
|
13562
|
+
const vars$8 = RadioButtonClass.cssVarList;
|
|
13563
|
+
const globalRefs$6 = getThemeRefs(globals);
|
|
13530
13564
|
|
|
13531
13565
|
const radioButton = {
|
|
13532
|
-
[vars$
|
|
13533
|
-
[vars$
|
|
13534
|
-
[vars$
|
|
13535
|
-
[vars$
|
|
13536
|
-
[vars$
|
|
13537
|
-
[vars$
|
|
13538
|
-
[vars$
|
|
13539
|
-
[vars$
|
|
13566
|
+
[vars$8.fontFamily]: refs.fontFamily,
|
|
13567
|
+
[vars$8.radioSize]: 'calc(1em + 6px)',
|
|
13568
|
+
[vars$8.radioMargin]: 'auto 4px',
|
|
13569
|
+
[vars$8.radioCheckedSize]: `calc(var(${vars$8.radioSize})/5)`,
|
|
13570
|
+
[vars$8.radioCheckedColor]: globalRefs$6.colors.surface.light,
|
|
13571
|
+
[vars$8.radioBackgroundColor]: globalRefs$6.colors.surface.light,
|
|
13572
|
+
[vars$8.radioBorderColor]: 'none',
|
|
13573
|
+
[vars$8.radioBorderWidth]: 0,
|
|
13540
13574
|
|
|
13541
13575
|
_checked: {
|
|
13542
|
-
[vars$
|
|
13576
|
+
[vars$8.radioBackgroundColor]: globalRefs$6.colors.surface.contrast,
|
|
13543
13577
|
},
|
|
13544
13578
|
|
|
13545
13579
|
_hover: {
|
|
@@ -13548,16 +13582,16 @@ const radioButton = {
|
|
|
13548
13582
|
|
|
13549
13583
|
size: {
|
|
13550
13584
|
xs: {
|
|
13551
|
-
[vars$
|
|
13585
|
+
[vars$8.fontSize]: '12px',
|
|
13552
13586
|
},
|
|
13553
13587
|
sm: {
|
|
13554
|
-
[vars$
|
|
13588
|
+
[vars$8.fontSize]: '14px',
|
|
13555
13589
|
},
|
|
13556
13590
|
md: {
|
|
13557
|
-
[vars$
|
|
13591
|
+
[vars$8.fontSize]: '16px',
|
|
13558
13592
|
},
|
|
13559
13593
|
lg: {
|
|
13560
|
-
[vars$
|
|
13594
|
+
[vars$8.fontSize]: '18px',
|
|
13561
13595
|
},
|
|
13562
13596
|
},
|
|
13563
13597
|
};
|
|
@@ -13566,7 +13600,7 @@ var radioButton$1 = /*#__PURE__*/Object.freeze({
|
|
|
13566
13600
|
__proto__: null,
|
|
13567
13601
|
default: radioButton,
|
|
13568
13602
|
radioButton: radioButton,
|
|
13569
|
-
vars: vars$
|
|
13603
|
+
vars: vars$8
|
|
13570
13604
|
});
|
|
13571
13605
|
|
|
13572
13606
|
const SUPPORTED_FORMATS = ['MM/DD/YYYY', 'DD/MM/YYYY', 'YYYY/MM/DD'];
|
|
@@ -13884,7 +13918,7 @@ const nextMonth = (timestamp) => {
|
|
|
13884
13918
|
return date;
|
|
13885
13919
|
};
|
|
13886
13920
|
|
|
13887
|
-
const componentName$
|
|
13921
|
+
const componentName$8 = getComponentName('calendar');
|
|
13888
13922
|
|
|
13889
13923
|
const observedAttrs$1 = [
|
|
13890
13924
|
'initial-value',
|
|
@@ -13901,7 +13935,7 @@ const observedAttrs$1 = [
|
|
|
13901
13935
|
|
|
13902
13936
|
const calendarUiAttrs = ['calendar-label-submit', 'calendar-label-cancel'];
|
|
13903
13937
|
|
|
13904
|
-
const BaseInputClass$1 = createBaseInputClass({ componentName: componentName$
|
|
13938
|
+
const BaseInputClass$1 = createBaseInputClass({ componentName: componentName$8, baseSelector: 'div' });
|
|
13905
13939
|
|
|
13906
13940
|
class RawCalendar extends BaseInputClass$1 {
|
|
13907
13941
|
static get observedAttributes() {
|
|
@@ -14514,94 +14548,94 @@ const CalendarClass = compose(
|
|
|
14514
14548
|
componentNameValidationMixin
|
|
14515
14549
|
)(RawCalendar);
|
|
14516
14550
|
|
|
14517
|
-
const globalRefs$
|
|
14551
|
+
const globalRefs$5 = getThemeRefs(globals);
|
|
14518
14552
|
|
|
14519
|
-
const vars$
|
|
14553
|
+
const vars$7 = CalendarClass.cssVarList;
|
|
14520
14554
|
|
|
14521
14555
|
const calendar = {
|
|
14522
|
-
[vars$
|
|
14523
|
-
[vars$
|
|
14524
|
-
[vars$
|
|
14556
|
+
[vars$7.fontFamily]: refs.fontFamily,
|
|
14557
|
+
[vars$7.fontSize]: refs.fontSize,
|
|
14558
|
+
[vars$7.hostDirection]: refs.direction,
|
|
14525
14559
|
|
|
14526
|
-
[vars$
|
|
14560
|
+
[vars$7.calendarPadding]: '1em',
|
|
14527
14561
|
|
|
14528
|
-
[vars$
|
|
14529
|
-
[vars$
|
|
14530
|
-
[vars$
|
|
14531
|
-
[vars$
|
|
14562
|
+
[vars$7.topNavVerticalPadding]: '1em',
|
|
14563
|
+
[vars$7.topNavAlignment]: 'space-between',
|
|
14564
|
+
[vars$7.topNavGap]: '0',
|
|
14565
|
+
[vars$7.topNavSelectorsGap]: '0.5em',
|
|
14532
14566
|
|
|
14533
|
-
[vars$
|
|
14534
|
-
[vars$
|
|
14535
|
-
[vars$
|
|
14536
|
-
[vars$
|
|
14567
|
+
[vars$7.bottomNavVerticalPadding]: '0.75em',
|
|
14568
|
+
[vars$7.bottomNavHorizontalPadding]: '1.5em',
|
|
14569
|
+
[vars$7.bottomNavAlignment]: 'space-between',
|
|
14570
|
+
[vars$7.bottomNavGap]: '0.5em',
|
|
14537
14571
|
|
|
14538
|
-
[vars$
|
|
14539
|
-
[vars$
|
|
14540
|
-
[vars$
|
|
14541
|
-
[vars$
|
|
14572
|
+
[vars$7.navMarginBottom]: '0.75em',
|
|
14573
|
+
[vars$7.navBorderBottomWidth]: '1px',
|
|
14574
|
+
[vars$7.navBorderBottomColor]: globalRefs$5.colors.surface.highlight,
|
|
14575
|
+
[vars$7.navBorderBottomStyle]: 'solid',
|
|
14542
14576
|
|
|
14543
|
-
[vars$
|
|
14544
|
-
[vars$
|
|
14577
|
+
[vars$7.yearInputWidth]: '6em',
|
|
14578
|
+
[vars$7.monthInputWidth]: '8em',
|
|
14545
14579
|
|
|
14546
|
-
[vars$
|
|
14547
|
-
[vars$
|
|
14580
|
+
[vars$7.navButtonSize]: '24px',
|
|
14581
|
+
[vars$7.navButtonCursor]: 'pointer',
|
|
14548
14582
|
|
|
14549
|
-
[vars$
|
|
14550
|
-
[vars$
|
|
14583
|
+
[vars$7.weekdayFontSize]: '0.875em',
|
|
14584
|
+
[vars$7.weekdayFontWeight]: '500',
|
|
14551
14585
|
|
|
14552
14586
|
// day table cell
|
|
14553
|
-
[vars$
|
|
14587
|
+
[vars$7.dayHeight]: '3.125em',
|
|
14554
14588
|
|
|
14555
14589
|
// day value
|
|
14556
|
-
[vars$
|
|
14557
|
-
[vars$
|
|
14558
|
-
[vars$
|
|
14559
|
-
[vars$
|
|
14560
|
-
[vars$
|
|
14561
|
-
[vars$
|
|
14562
|
-
[vars$
|
|
14563
|
-
[vars$
|
|
14564
|
-
[vars$
|
|
14565
|
-
[vars$
|
|
14590
|
+
[vars$7.daySize]: '2.125em',
|
|
14591
|
+
[vars$7.dayFontSize]: '1em',
|
|
14592
|
+
[vars$7.dayRadius]: '50%',
|
|
14593
|
+
[vars$7.dayTextAlign]: 'center',
|
|
14594
|
+
[vars$7.dayPadding]: '0',
|
|
14595
|
+
[vars$7.dayTextColor]: globalRefs$5.colors.surface.contrast,
|
|
14596
|
+
[vars$7.dayFontWeight]: '500',
|
|
14597
|
+
[vars$7.dayBackgroundColor]: 'transparent',
|
|
14598
|
+
[vars$7.dayCursor]: 'pointer',
|
|
14599
|
+
[vars$7.dayBackgroundColorHover]: globalRefs$5.colors.primary.highlight,
|
|
14566
14600
|
|
|
14567
14601
|
// selected day
|
|
14568
|
-
[vars$
|
|
14569
|
-
[vars$
|
|
14602
|
+
[vars$7.daySelectedBackgroundColor]: globalRefs$5.colors.primary.main,
|
|
14603
|
+
[vars$7.daySelectedTextdColor]: globalRefs$5.colors.primary.contrast,
|
|
14570
14604
|
|
|
14571
14605
|
// disabled day (out of min/max range)
|
|
14572
|
-
[vars$
|
|
14606
|
+
[vars$7.dayDisabledTextdColor]: globalRefs$5.colors.surface.light,
|
|
14573
14607
|
|
|
14574
14608
|
// today
|
|
14575
|
-
[vars$
|
|
14576
|
-
[vars$
|
|
14577
|
-
[vars$
|
|
14609
|
+
[vars$7.currentDayBorderColor]: globalRefs$5.colors.surface.light,
|
|
14610
|
+
[vars$7.currentDayBorderWidth]: '1px',
|
|
14611
|
+
[vars$7.currentDayBorderStyle]: 'solid',
|
|
14578
14612
|
|
|
14579
14613
|
size: {
|
|
14580
|
-
xs: { [vars$
|
|
14581
|
-
sm: { [vars$
|
|
14582
|
-
md: { [vars$
|
|
14583
|
-
lg: { [vars$
|
|
14614
|
+
xs: { [vars$7.fontSize]: '12px' },
|
|
14615
|
+
sm: { [vars$7.fontSize]: '14px' },
|
|
14616
|
+
md: { [vars$7.fontSize]: '16px' },
|
|
14617
|
+
lg: { [vars$7.fontSize]: '18px' },
|
|
14584
14618
|
},
|
|
14585
14619
|
|
|
14586
|
-
[vars$
|
|
14620
|
+
[vars$7.navButtonRotation]: 'rotate(180deg)',
|
|
14587
14621
|
|
|
14588
14622
|
_disabled: {
|
|
14589
|
-
[vars$
|
|
14590
|
-
[vars$
|
|
14591
|
-
[vars$
|
|
14592
|
-
[vars$
|
|
14623
|
+
[vars$7.navButtonOpacity]: '0.5',
|
|
14624
|
+
[vars$7.dayBackgroundColorHover]: 'none',
|
|
14625
|
+
[vars$7.navButtonCursor]: 'default',
|
|
14626
|
+
[vars$7.dayCursor]: 'default',
|
|
14593
14627
|
},
|
|
14594
14628
|
|
|
14595
14629
|
_fullWidth: {
|
|
14596
|
-
[vars$
|
|
14597
|
-
[vars$
|
|
14630
|
+
[vars$7.hostWidth]: '100%',
|
|
14631
|
+
[vars$7.dayBlockAlign]: '0 auto',
|
|
14598
14632
|
},
|
|
14599
14633
|
};
|
|
14600
14634
|
|
|
14601
14635
|
var calendar$1 = /*#__PURE__*/Object.freeze({
|
|
14602
14636
|
__proto__: null,
|
|
14603
14637
|
default: calendar,
|
|
14604
|
-
vars: vars$
|
|
14638
|
+
vars: vars$7
|
|
14605
14639
|
});
|
|
14606
14640
|
|
|
14607
14641
|
const patterns = {
|
|
@@ -14735,12 +14769,12 @@ class DateCounter {
|
|
|
14735
14769
|
}
|
|
14736
14770
|
}
|
|
14737
14771
|
|
|
14738
|
-
const componentName$
|
|
14772
|
+
const componentName$7 = getComponentName('date-field');
|
|
14739
14773
|
|
|
14740
14774
|
// we set baseSelector to `vaadin-popover` as a temporary hack, so our portalMixin will
|
|
14741
14775
|
// be able to process this component's overlay. The whole process needs refactoring as soon as possible.
|
|
14742
14776
|
const BASE_SELECTOR = 'vaadin-popover';
|
|
14743
|
-
const BaseInputClass = createBaseInputClass({ componentName: componentName$
|
|
14777
|
+
const BaseInputClass = createBaseInputClass({ componentName: componentName$7, baseSelector: BASE_SELECTOR });
|
|
14744
14778
|
|
|
14745
14779
|
const dateFieldAttrs = ['format', 'opened', 'initial-value', 'readonly'];
|
|
14746
14780
|
const calendarAttrs = ['years-range', 'calendar-months', 'calendar-weekdays'];
|
|
@@ -15411,35 +15445,35 @@ const DateFieldClass = compose(
|
|
|
15411
15445
|
componentNameValidationMixin
|
|
15412
15446
|
)(RawDateFieldClass);
|
|
15413
15447
|
|
|
15414
|
-
const globalRefs$
|
|
15448
|
+
const globalRefs$4 = getThemeRefs(globals);
|
|
15415
15449
|
const shadowColor$1 = '#00000020';
|
|
15416
|
-
const { shadow } = globalRefs$
|
|
15450
|
+
const { shadow } = globalRefs$4;
|
|
15417
15451
|
|
|
15418
|
-
const vars$
|
|
15452
|
+
const vars$6 = DateFieldClass.cssVarList;
|
|
15419
15453
|
|
|
15420
15454
|
const dateField = {
|
|
15421
|
-
[vars$
|
|
15422
|
-
[vars$
|
|
15423
|
-
[vars$
|
|
15424
|
-
|
|
15425
|
-
[vars$
|
|
15426
|
-
[vars$
|
|
15427
|
-
[vars$
|
|
15428
|
-
[vars$
|
|
15429
|
-
[vars$
|
|
15430
|
-
[vars$
|
|
15431
|
-
[vars$
|
|
15432
|
-
[vars$
|
|
15433
|
-
[vars$
|
|
15434
|
-
|
|
15435
|
-
[vars$
|
|
15436
|
-
[vars$
|
|
15455
|
+
[vars$6.hostWidth]: refs.width,
|
|
15456
|
+
[vars$6.hostDirection]: refs.direction,
|
|
15457
|
+
[vars$6.iconMargin]: '0.375em',
|
|
15458
|
+
|
|
15459
|
+
[vars$6.overlay.marginTop]: `calc(${refs.outlineWidth} + 1px)`,
|
|
15460
|
+
[vars$6.overlay.backgroundColor]: refs.backgroundColor,
|
|
15461
|
+
[vars$6.overlay.backdropBackgroundColor]: 'transparent',
|
|
15462
|
+
[vars$6.overlay.backdropPointerEvents]: 'all',
|
|
15463
|
+
[vars$6.overlay.boxShadow]: `${shadow.wide.xl} ${shadowColor$1}, ${shadow.narrow.xl} ${shadowColor$1}`,
|
|
15464
|
+
[vars$6.overlay.outlineWidth]: '0',
|
|
15465
|
+
[vars$6.overlay.outlineColor]: 'transparent',
|
|
15466
|
+
[vars$6.overlay.outlineStyle]: 'none',
|
|
15467
|
+
[vars$6.overlay.padding]: '0',
|
|
15468
|
+
|
|
15469
|
+
[vars$6.rtlInputDirection]: 'ltr',
|
|
15470
|
+
[vars$6.rtlInputAlignment]: 'right',
|
|
15437
15471
|
};
|
|
15438
15472
|
|
|
15439
15473
|
var dateField$1 = /*#__PURE__*/Object.freeze({
|
|
15440
15474
|
__proto__: null,
|
|
15441
15475
|
default: dateField,
|
|
15442
|
-
vars: vars$
|
|
15476
|
+
vars: vars$6
|
|
15443
15477
|
});
|
|
15444
15478
|
|
|
15445
15479
|
const activeableMixin = (superclass) =>
|
|
@@ -15457,7 +15491,7 @@ const activeableMixin = (superclass) =>
|
|
|
15457
15491
|
}
|
|
15458
15492
|
};
|
|
15459
15493
|
|
|
15460
|
-
const componentName$
|
|
15494
|
+
const componentName$6 = getComponentName('list-item');
|
|
15461
15495
|
|
|
15462
15496
|
const customMixin$1 = (superclass) =>
|
|
15463
15497
|
class ListItemMixinClass extends superclass {
|
|
@@ -15506,11 +15540,11 @@ const ListItemClass = compose(
|
|
|
15506
15540
|
componentNameValidationMixin,
|
|
15507
15541
|
customMixin$1,
|
|
15508
15542
|
activeableMixin
|
|
15509
|
-
)(createBaseClass({ componentName: componentName$
|
|
15543
|
+
)(createBaseClass({ componentName: componentName$6, baseSelector: 'slot' }));
|
|
15510
15544
|
|
|
15511
|
-
const componentName$
|
|
15545
|
+
const componentName$5 = getComponentName('list');
|
|
15512
15546
|
|
|
15513
|
-
class RawList extends createBaseClass({ componentName: componentName$
|
|
15547
|
+
class RawList extends createBaseClass({ componentName: componentName$5, baseSelector: '.wrapper' }) {
|
|
15514
15548
|
static get observedAttributes() {
|
|
15515
15549
|
return ['variant', 'readonly'];
|
|
15516
15550
|
}
|
|
@@ -15657,13 +15691,13 @@ const ListClass = compose(
|
|
|
15657
15691
|
componentNameValidationMixin
|
|
15658
15692
|
)(RawList);
|
|
15659
15693
|
|
|
15660
|
-
const globalRefs$
|
|
15694
|
+
const globalRefs$3 = getThemeRefs(globals);
|
|
15661
15695
|
|
|
15662
15696
|
const compVars = ListClass.cssVarList;
|
|
15663
15697
|
|
|
15664
15698
|
const [helperTheme, helperRefs, helperVars] = createHelperVars(
|
|
15665
15699
|
{ shadowColor: '#00000020' },
|
|
15666
|
-
componentName$
|
|
15700
|
+
componentName$5
|
|
15667
15701
|
);
|
|
15668
15702
|
|
|
15669
15703
|
const { shadowColor } = helperRefs;
|
|
@@ -15672,24 +15706,24 @@ const list$1 = {
|
|
|
15672
15706
|
...helperTheme,
|
|
15673
15707
|
|
|
15674
15708
|
[compVars.hostWidth]: '100%',
|
|
15675
|
-
[compVars.backgroundColor]: globalRefs$
|
|
15676
|
-
[compVars.fontFamily]: globalRefs$
|
|
15677
|
-
[compVars.borderColor]: globalRefs$
|
|
15709
|
+
[compVars.backgroundColor]: globalRefs$3.colors.surface.main,
|
|
15710
|
+
[compVars.fontFamily]: globalRefs$3.fonts.font1.family,
|
|
15711
|
+
[compVars.borderColor]: globalRefs$3.colors.surface.light,
|
|
15678
15712
|
[compVars.borderStyle]: 'solid',
|
|
15679
|
-
[compVars.borderWidth]: globalRefs$
|
|
15680
|
-
[compVars.borderRadius]: globalRefs$
|
|
15681
|
-
[compVars.gap]: globalRefs$
|
|
15682
|
-
[compVars.verticalPadding]: globalRefs$
|
|
15683
|
-
[compVars.horizontalPadding]: globalRefs$
|
|
15684
|
-
[compVars.boxShadow]: `${globalRefs$
|
|
15713
|
+
[compVars.borderWidth]: globalRefs$3.border.xs,
|
|
15714
|
+
[compVars.borderRadius]: globalRefs$3.radius.sm,
|
|
15715
|
+
[compVars.gap]: globalRefs$3.spacing.md,
|
|
15716
|
+
[compVars.verticalPadding]: globalRefs$3.spacing.lg,
|
|
15717
|
+
[compVars.horizontalPadding]: globalRefs$3.spacing.lg,
|
|
15718
|
+
[compVars.boxShadow]: `${globalRefs$3.shadow.wide.sm} ${shadowColor}, ${globalRefs$3.shadow.narrow.sm} ${shadowColor}`,
|
|
15685
15719
|
[compVars.maxHeight]: '100%',
|
|
15686
|
-
[compVars.hostDirection]: globalRefs$
|
|
15720
|
+
[compVars.hostDirection]: globalRefs$3.direction,
|
|
15687
15721
|
[compVars.minItemsWidth]: '150px',
|
|
15688
15722
|
|
|
15689
15723
|
_empty: {
|
|
15690
15724
|
[compVars.minHeight]: '150px',
|
|
15691
|
-
[compVars.emptyStateTextColor]: globalRefs$
|
|
15692
|
-
[compVars.emptyStateTextFontFamily]: globalRefs$
|
|
15725
|
+
[compVars.emptyStateTextColor]: globalRefs$3.colors.surface.dark,
|
|
15726
|
+
[compVars.emptyStateTextFontFamily]: globalRefs$3.fonts.font1.family,
|
|
15693
15727
|
},
|
|
15694
15728
|
|
|
15695
15729
|
variant: {
|
|
@@ -15703,7 +15737,7 @@ const list$1 = {
|
|
|
15703
15737
|
},
|
|
15704
15738
|
};
|
|
15705
15739
|
|
|
15706
|
-
const vars$
|
|
15740
|
+
const vars$5 = {
|
|
15707
15741
|
...compVars,
|
|
15708
15742
|
...helperVars,
|
|
15709
15743
|
};
|
|
@@ -15711,49 +15745,49 @@ const vars$4 = {
|
|
|
15711
15745
|
var list$2 = /*#__PURE__*/Object.freeze({
|
|
15712
15746
|
__proto__: null,
|
|
15713
15747
|
default: list$1,
|
|
15714
|
-
vars: vars$
|
|
15748
|
+
vars: vars$5
|
|
15715
15749
|
});
|
|
15716
15750
|
|
|
15717
|
-
const globalRefs$
|
|
15751
|
+
const globalRefs$2 = getThemeRefs(globals);
|
|
15718
15752
|
|
|
15719
|
-
const vars$
|
|
15753
|
+
const vars$4 = ListItemClass.cssVarList;
|
|
15720
15754
|
|
|
15721
15755
|
const list = {
|
|
15722
|
-
[vars$
|
|
15723
|
-
[vars$
|
|
15724
|
-
[vars$
|
|
15725
|
-
[vars$
|
|
15726
|
-
[vars$
|
|
15727
|
-
[vars$
|
|
15728
|
-
[vars$
|
|
15729
|
-
[vars$
|
|
15730
|
-
[vars$
|
|
15731
|
-
[vars$
|
|
15732
|
-
[vars$
|
|
15756
|
+
[vars$4.backgroundColor]: globalRefs$2.colors.surface.main,
|
|
15757
|
+
[vars$4.padding]: globalRefs$2.spacing.lg,
|
|
15758
|
+
[vars$4.gap]: globalRefs$2.spacing.md,
|
|
15759
|
+
[vars$4.borderStyle]: 'solid',
|
|
15760
|
+
[vars$4.borderWidth]: globalRefs$2.border.xs,
|
|
15761
|
+
[vars$4.borderColor]: globalRefs$2.colors.surface.main,
|
|
15762
|
+
[vars$4.borderRadius]: globalRefs$2.radius.sm,
|
|
15763
|
+
[vars$4.cursor]: 'pointer',
|
|
15764
|
+
[vars$4.alignItems]: 'center',
|
|
15765
|
+
[vars$4.flexDirection]: 'row',
|
|
15766
|
+
[vars$4.transition]: 'border-color 0.2s, background-color 0.2s',
|
|
15733
15767
|
|
|
15734
15768
|
variant: {
|
|
15735
15769
|
tile: {
|
|
15736
|
-
[vars$
|
|
15737
|
-
[vars$
|
|
15738
|
-
[vars$
|
|
15770
|
+
[vars$4.alignItems]: 'flex-start',
|
|
15771
|
+
[vars$4.flexDirection]: 'column',
|
|
15772
|
+
[vars$4.borderColor]: globalRefs$2.colors.surface.light,
|
|
15739
15773
|
},
|
|
15740
15774
|
},
|
|
15741
15775
|
|
|
15742
15776
|
_hover: {
|
|
15743
|
-
[vars$
|
|
15777
|
+
[vars$4.backgroundColor]: globalRefs$2.colors.surface.highlight,
|
|
15744
15778
|
},
|
|
15745
15779
|
|
|
15746
15780
|
_active: {
|
|
15747
|
-
[vars$
|
|
15748
|
-
[vars$
|
|
15749
|
-
[vars$
|
|
15781
|
+
[vars$4.backgroundColor]: globalRefs$2.colors.surface.main,
|
|
15782
|
+
[vars$4.borderColor]: globalRefs$2.colors.primary.light,
|
|
15783
|
+
[vars$4.outline]: `1px solid ${globalRefs$2.colors.primary.light}`,
|
|
15750
15784
|
},
|
|
15751
15785
|
};
|
|
15752
15786
|
|
|
15753
15787
|
var listItem = /*#__PURE__*/Object.freeze({
|
|
15754
15788
|
__proto__: null,
|
|
15755
15789
|
default: list,
|
|
15756
|
-
vars: vars$
|
|
15790
|
+
vars: vars$4
|
|
15757
15791
|
});
|
|
15758
15792
|
|
|
15759
15793
|
const defaultValidateSchema = () => true;
|
|
@@ -15855,7 +15889,7 @@ const createDynamicDataMixin =
|
|
|
15855
15889
|
}
|
|
15856
15890
|
};
|
|
15857
15891
|
|
|
15858
|
-
const componentName$
|
|
15892
|
+
const componentName$4 = getComponentName('apps-list');
|
|
15859
15893
|
|
|
15860
15894
|
const limitAbbreviation = (str, limit = 2) =>
|
|
15861
15895
|
str
|
|
@@ -15917,7 +15951,7 @@ const AppsListClass = compose(
|
|
|
15917
15951
|
slots: ['empty-state'],
|
|
15918
15952
|
wrappedEleName: 'descope-list',
|
|
15919
15953
|
excludeAttrsSync: ['tabindex', 'class', 'empty'],
|
|
15920
|
-
componentName: componentName$
|
|
15954
|
+
componentName: componentName$4,
|
|
15921
15955
|
style: () => `
|
|
15922
15956
|
:host {
|
|
15923
15957
|
width: 100%;
|
|
@@ -15942,33 +15976,33 @@ const AppsListClass = compose(
|
|
|
15942
15976
|
})
|
|
15943
15977
|
);
|
|
15944
15978
|
|
|
15945
|
-
const vars$
|
|
15946
|
-
const globalRefs = getThemeRefs(globals);
|
|
15979
|
+
const vars$3 = AppsListClass.cssVarList;
|
|
15980
|
+
const globalRefs$1 = getThemeRefs(globals);
|
|
15947
15981
|
|
|
15948
15982
|
const defaultHeight = '400px';
|
|
15949
15983
|
|
|
15950
15984
|
const appsList = {
|
|
15951
|
-
[vars$
|
|
15952
|
-
[vars$
|
|
15953
|
-
[vars$
|
|
15954
|
-
[vars$
|
|
15985
|
+
[vars$3.itemsFontWeight]: 'normal',
|
|
15986
|
+
[vars$3.itemsTextAlign]: 'start',
|
|
15987
|
+
[vars$3.hostDirection]: globalRefs$1.direction,
|
|
15988
|
+
[vars$3.maxHeight]: defaultHeight,
|
|
15955
15989
|
|
|
15956
15990
|
_empty: {
|
|
15957
|
-
[vars$
|
|
15991
|
+
[vars$3.minHeight]: defaultHeight,
|
|
15958
15992
|
},
|
|
15959
15993
|
|
|
15960
15994
|
size: {
|
|
15961
15995
|
xs: {
|
|
15962
|
-
[vars$
|
|
15996
|
+
[vars$3.itemsFontSize]: '14px',
|
|
15963
15997
|
},
|
|
15964
15998
|
sm: {
|
|
15965
|
-
[vars$
|
|
15999
|
+
[vars$3.itemsFontSize]: '14px',
|
|
15966
16000
|
},
|
|
15967
16001
|
md: {
|
|
15968
|
-
[vars$
|
|
16002
|
+
[vars$3.itemsFontSize]: '16px',
|
|
15969
16003
|
},
|
|
15970
16004
|
lg: {
|
|
15971
|
-
[vars$
|
|
16005
|
+
[vars$3.itemsFontSize]: '20px',
|
|
15972
16006
|
},
|
|
15973
16007
|
},
|
|
15974
16008
|
};
|
|
@@ -15976,10 +16010,10 @@ const appsList = {
|
|
|
15976
16010
|
var appsList$1 = /*#__PURE__*/Object.freeze({
|
|
15977
16011
|
__proto__: null,
|
|
15978
16012
|
default: appsList,
|
|
15979
|
-
vars: vars$
|
|
16013
|
+
vars: vars$3
|
|
15980
16014
|
});
|
|
15981
16015
|
|
|
15982
|
-
const componentName$
|
|
16016
|
+
const componentName$3 = getComponentName('scopes-list');
|
|
15983
16017
|
const variants = ['checkbox', 'switch'];
|
|
15984
16018
|
|
|
15985
16019
|
const itemRenderer = ({ id, desc, required = false }, _, ref) => {
|
|
@@ -15998,7 +16032,7 @@ const itemRenderer = ({ id, desc, required = false }, _, ref) => {
|
|
|
15998
16032
|
`;
|
|
15999
16033
|
};
|
|
16000
16034
|
|
|
16001
|
-
class RawScopesList extends createBaseClass({ componentName: componentName$
|
|
16035
|
+
class RawScopesList extends createBaseClass({ componentName: componentName$3, baseSelector: 'div' }) {
|
|
16002
16036
|
constructor() {
|
|
16003
16037
|
super();
|
|
16004
16038
|
|
|
@@ -16083,20 +16117,153 @@ const ScopesListClass = compose(
|
|
|
16083
16117
|
componentNameValidationMixin
|
|
16084
16118
|
)(RawScopesList);
|
|
16085
16119
|
|
|
16086
|
-
const vars$
|
|
16120
|
+
const vars$2 = ScopesListClass.cssVarList;
|
|
16087
16121
|
|
|
16088
16122
|
const scopesList = {
|
|
16089
|
-
[vars$
|
|
16090
|
-
[vars$
|
|
16091
|
-
[vars$
|
|
16123
|
+
[vars$2.requiredInputBorderColor]: theme$1._disabled[vars$O.borderColor],
|
|
16124
|
+
[vars$2.requiredInputValueTextColor]: theme$1._disabled[vars$O.valueTextColor],
|
|
16125
|
+
[vars$2.hostWidth]: '280px',
|
|
16092
16126
|
_fullWidth: {
|
|
16093
|
-
[vars$
|
|
16127
|
+
[vars$2.hostWidth]: '100%',
|
|
16094
16128
|
},
|
|
16095
16129
|
};
|
|
16096
16130
|
|
|
16097
16131
|
var scopesList$1 = /*#__PURE__*/Object.freeze({
|
|
16098
16132
|
__proto__: null,
|
|
16099
16133
|
default: scopesList,
|
|
16134
|
+
vars: vars$2
|
|
16135
|
+
});
|
|
16136
|
+
|
|
16137
|
+
var arrowsImg = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjkiIGhlaWdodD0iMjgiIHZpZXdCb3g9IjAgMCAyOSAyOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTkuMTQ0OTIgMTUuNjQ1TDcuNDk5OTIgMTRMMi44MzMyNSAxOC42NjY3TDcuNDk5OTIgMjMuMzMzM0w5LjE0NDkyIDIxLjY4ODNMNy4zMDE1OSAxOS44MzMzSDI0Ljk5OTlWMTcuNUg3LjMwMTU5TDkuMTQ0OTIgMTUuNjQ1WiIgZmlsbD0iIzYzNkM3NCIvPgo8cGF0aCBkPSJNMTkuODU1IDEyLjM1NTNMMjEuNSAxNC4wMDAzTDI2LjE2NjcgOS4zMzM2NkwyMS41IDQuNjY2OTlMMTkuODU1IDYuMzExOTlMMjEuNjk4MyA4LjE2Njk5SDRWMTAuNTAwM0gyMS42OTgzTDE5Ljg1NSAxMi4zNTUzWiIgZmlsbD0iIzYzNkM3NCIvPgo8L3N2Zz4K";
|
|
16138
|
+
|
|
16139
|
+
const componentName$2 = getComponentName('third-party-app-logo');
|
|
16140
|
+
class RawThirdPartyAppLogoClass extends createBaseClass({
|
|
16141
|
+
componentName: componentName$2,
|
|
16142
|
+
baseSelector: '.wrapper',
|
|
16143
|
+
}) {
|
|
16144
|
+
constructor() {
|
|
16145
|
+
super();
|
|
16146
|
+
this.attachShadow({ mode: 'open' }).innerHTML = `
|
|
16147
|
+
<style>
|
|
16148
|
+
:host {
|
|
16149
|
+
display: inline-flex;
|
|
16150
|
+
}
|
|
16151
|
+
:host([draggable="true"]) > div {
|
|
16152
|
+
pointer-events: none
|
|
16153
|
+
}
|
|
16154
|
+
|
|
16155
|
+
.wrapper {
|
|
16156
|
+
display: flex;
|
|
16157
|
+
justify-content: center;
|
|
16158
|
+
align-items: center;
|
|
16159
|
+
}
|
|
16160
|
+
|
|
16161
|
+
.third-party-app-logo {
|
|
16162
|
+
flex-shrink: 0;
|
|
16163
|
+
display: inline-block;
|
|
16164
|
+
max-width: 100%;
|
|
16165
|
+
max-height: 100%;
|
|
16166
|
+
object-fit: contain;
|
|
16167
|
+
}
|
|
16168
|
+
|
|
16169
|
+
.company-logo-wrapper, .third-party-app-logo-wrapper {
|
|
16170
|
+
flex-shrink: 0;
|
|
16171
|
+
display: inline-flex;
|
|
16172
|
+
}
|
|
16173
|
+
|
|
16174
|
+
.company-logo-wrapper {
|
|
16175
|
+
justify-content: flex-end;
|
|
16176
|
+
}
|
|
16177
|
+
|
|
16178
|
+
.third-party-app-logo-wrapper {
|
|
16179
|
+
justify-content: flex-start;
|
|
16180
|
+
}
|
|
16181
|
+
|
|
16182
|
+
.arrows {
|
|
16183
|
+
flex-shrink: 0;
|
|
16184
|
+
display: flex;
|
|
16185
|
+
}
|
|
16186
|
+
|
|
16187
|
+
</style>
|
|
16188
|
+
<div class="wrapper">
|
|
16189
|
+
<div class="third-party-app-logo-wrapper">
|
|
16190
|
+
<div class="third-party-app-logo"></div>
|
|
16191
|
+
</div>
|
|
16192
|
+
<div class="arrows">
|
|
16193
|
+
<descope-icon src="${arrowsImg}"></descope-icon>
|
|
16194
|
+
</div>
|
|
16195
|
+
<div class="company-logo-wrapper">
|
|
16196
|
+
<descope-logo></descope-logo>
|
|
16197
|
+
</div>
|
|
16198
|
+
</div>
|
|
16199
|
+
`;
|
|
16200
|
+
}
|
|
16201
|
+
}
|
|
16202
|
+
|
|
16203
|
+
const companyLogoWrapper = '>.company-logo-wrapper';
|
|
16204
|
+
const thirdPartyAppLogoWrapper = '>.third-party-app-logo-wrapper';
|
|
16205
|
+
|
|
16206
|
+
const ThirdPartyAppLogoClass = compose(
|
|
16207
|
+
createStyleMixin({
|
|
16208
|
+
mappings: {
|
|
16209
|
+
logoMaxHeight: [
|
|
16210
|
+
{ selector: companyLogoWrapper, property: 'height' },
|
|
16211
|
+
{ selector: thirdPartyAppLogoWrapper, property: 'height' },
|
|
16212
|
+
],
|
|
16213
|
+
logoMaxWidth: [
|
|
16214
|
+
{ selector: companyLogoWrapper, property: 'max-width' },
|
|
16215
|
+
{ selector: thirdPartyAppLogoWrapper, property: 'max-width' },
|
|
16216
|
+
],
|
|
16217
|
+
thirdPartyAppLogo: {
|
|
16218
|
+
selector: () => '.third-party-app-logo',
|
|
16219
|
+
property: 'content',
|
|
16220
|
+
fallback: {},
|
|
16221
|
+
},
|
|
16222
|
+
companyLogoFallback: {
|
|
16223
|
+
selector: LogoClass.componentName,
|
|
16224
|
+
property: LogoClass.cssVarList.fallbackUrl,
|
|
16225
|
+
},
|
|
16226
|
+
gap: {},
|
|
16227
|
+
arrowsColor: { selector: IconClass.componentName, property: IconClass.cssVarList.fill },
|
|
16228
|
+
},
|
|
16229
|
+
}),
|
|
16230
|
+
draggableMixin,
|
|
16231
|
+
componentNameValidationMixin
|
|
16232
|
+
)(RawThirdPartyAppLogoClass);
|
|
16233
|
+
|
|
16234
|
+
const globalRefs = getThemeRefs(globals);
|
|
16235
|
+
const vars$1 = ThirdPartyAppLogoClass.cssVarList;
|
|
16236
|
+
|
|
16237
|
+
const thirdPartyAppLogo = {
|
|
16238
|
+
[vars$1.gap]: globalRefs.spacing.lg,
|
|
16239
|
+
[vars$1.arrowsColor]: globalRefs.colors.surface.dark,
|
|
16240
|
+
[vars$1.thirdPartyAppLogoFallback]:
|
|
16241
|
+
'url(https://imgs.descope.com/components/third-party-app-logo-placeholder.svg)',
|
|
16242
|
+
[vars$1.companyLogoFallback]:
|
|
16243
|
+
'url(https://imgs.descope.com/components/project-logo-placeholder.svg)',
|
|
16244
|
+
size: {
|
|
16245
|
+
xs: {
|
|
16246
|
+
[vars$1.logoMaxHeight]: '30px',
|
|
16247
|
+
[vars$1.logoMaxWidth]: '120px',
|
|
16248
|
+
},
|
|
16249
|
+
sm: {
|
|
16250
|
+
[vars$1.logoMaxHeight]: '40px',
|
|
16251
|
+
[vars$1.logoMaxWidth]: '160px',
|
|
16252
|
+
},
|
|
16253
|
+
md: {
|
|
16254
|
+
[vars$1.logoMaxHeight]: '48px',
|
|
16255
|
+
[vars$1.logoMaxWidth]: '200px',
|
|
16256
|
+
},
|
|
16257
|
+
lg: {
|
|
16258
|
+
[vars$1.logoMaxHeight]: '60px',
|
|
16259
|
+
[vars$1.logoMaxWidth]: '240px',
|
|
16260
|
+
},
|
|
16261
|
+
},
|
|
16262
|
+
};
|
|
16263
|
+
|
|
16264
|
+
var thirdPartyAppLogo$1 = /*#__PURE__*/Object.freeze({
|
|
16265
|
+
__proto__: null,
|
|
16266
|
+
default: thirdPartyAppLogo,
|
|
16100
16267
|
vars: vars$1
|
|
16101
16268
|
});
|
|
16102
16269
|
|
|
@@ -16151,6 +16318,7 @@ const components = {
|
|
|
16151
16318
|
listItem,
|
|
16152
16319
|
appsList: appsList$1,
|
|
16153
16320
|
scopesList: scopesList$1,
|
|
16321
|
+
thirdPartyAppLogo: thirdPartyAppLogo$1,
|
|
16154
16322
|
};
|
|
16155
16323
|
|
|
16156
16324
|
const theme = Object.keys(components).reduce(
|
|
@@ -16163,7 +16331,7 @@ const vars = Object.keys(components).reduce(
|
|
|
16163
16331
|
);
|
|
16164
16332
|
|
|
16165
16333
|
const defaultTheme = { globals, components: theme };
|
|
16166
|
-
const themeVars = { globals: vars$
|
|
16334
|
+
const themeVars = { globals: vars$Q, components: vars };
|
|
16167
16335
|
|
|
16168
16336
|
const colors = {
|
|
16169
16337
|
surface: {
|
|
@@ -16547,6 +16715,7 @@ exports.SwitchToggleClass = SwitchToggleClass;
|
|
|
16547
16715
|
exports.TextAreaClass = TextAreaClass;
|
|
16548
16716
|
exports.TextClass = TextClass;
|
|
16549
16717
|
exports.TextFieldClass = TextFieldClass;
|
|
16718
|
+
exports.ThirdPartyAppLogoClass = ThirdPartyAppLogoClass;
|
|
16550
16719
|
exports.TotpImageClass = TotpImageClass;
|
|
16551
16720
|
exports.UploadFileClass = UploadFileClass;
|
|
16552
16721
|
exports.UserAttributeClass = UserAttributeClass;
|