@descope/web-components-ui 1.0.401 → 1.0.403
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/index.cjs.js +1573 -1208
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/index.esm.js +1620 -1208
- package/dist/index.esm.js.map +1 -1
- package/dist/umd/1053.js +1 -1
- package/dist/umd/4619.js +1 -1
- package/dist/umd/6726.js +1 -1
- package/dist/umd/7212.js +1 -1
- package/dist/umd/DescopeDev.js +1 -1
- package/dist/umd/descope-hybrid-field-index-js.js +19 -0
- package/dist/umd/descope-hybrid-field-index-js.js.LICENSE.txt +5 -0
- package/dist/umd/descope-multi-select-combo-box-index-js.js +1 -1
- package/dist/umd/index.js +1 -1
- package/dist/umd/phone-fields-descope-phone-field-descope-phone-field-internal-index-js.js +1 -1
- package/dist/umd/phone-fields-descope-phone-field-index-js.js +1 -1
- package/dist/umd/phone-fields-descope-phone-input-box-field-descope-phone-input-box-internal-index-js.js +1 -1
- package/dist/umd/phone-fields-descope-phone-input-box-field-index-js.js +148 -1
- package/package.json +1 -1
- package/src/components/descope-hybrid-field/HybridFieldClass.js +289 -0
- package/src/components/descope-hybrid-field/helpers.js +5 -0
- package/src/components/descope-hybrid-field/index.js +9 -0
- package/src/components/descope-multi-select-combo-box/MultiSelectComboBoxClass.js +8 -0
- package/src/components/phone-fields/descope-phone-field/PhoneFieldClass.js +45 -5
- package/src/components/phone-fields/descope-phone-field/descope-phone-field-internal/PhoneFieldInternal.js +45 -11
- package/src/components/phone-fields/descope-phone-input-box-field/PhoneFieldInputBoxClass.js +21 -12
- package/src/components/phone-fields/descope-phone-input-box-field/descope-phone-input-box-internal/PhoneFieldInternalInputBox.js +17 -5
- package/src/index.cjs.js +1 -0
- package/src/index.js +1 -0
- package/src/mixins/inputEventsDispatchingMixin.js +5 -5
- package/src/theme/components/hybridField.js +15 -0
- package/src/theme/components/index.js +2 -0
- package/dist/umd/4831.js +0 -148
- /package/dist/umd/{4831.js.LICENSE.txt → phone-fields-descope-phone-input-box-field-index-js.js.LICENSE.txt} +0 -0
package/dist/cjs/index.cjs.js
CHANGED
|
@@ -658,7 +658,7 @@ const globals = {
|
|
|
658
658
|
fonts,
|
|
659
659
|
direction,
|
|
660
660
|
};
|
|
661
|
-
const vars$
|
|
661
|
+
const vars$T = getThemeVars(globals);
|
|
662
662
|
|
|
663
663
|
const createCssVar = (varName, fallback) => `var(${varName}${fallback ? `, ${fallback}` : ''})`;
|
|
664
664
|
|
|
@@ -2660,13 +2660,13 @@ const inputEventsDispatchingMixin = (superclass) =>
|
|
|
2660
2660
|
handleInputEventDispatching() {
|
|
2661
2661
|
let previousRootComponentValue = this.value;
|
|
2662
2662
|
|
|
2663
|
+
// we are comparing the previous value to the new one,
|
|
2664
|
+
// and if they have the same value, we are blocking the input event
|
|
2663
2665
|
this.addEventListener('input', (e) => {
|
|
2664
|
-
|
|
2665
|
-
|
|
2666
|
-
if (previousRootComponentValue === this.value) {
|
|
2667
|
-
e.stopImmediatePropagation();
|
|
2668
|
-
} else {
|
|
2666
|
+
e.stopImmediatePropagation();
|
|
2667
|
+
if (previousRootComponentValue !== this.value) {
|
|
2669
2668
|
previousRootComponentValue = this.value;
|
|
2669
|
+
createDispatchEvent.call(this, 'input', { bubbles: true });
|
|
2670
2670
|
}
|
|
2671
2671
|
});
|
|
2672
2672
|
}
|
|
@@ -2982,9 +2982,9 @@ const createIcon = async (src) => {
|
|
|
2982
2982
|
|
|
2983
2983
|
/* eslint-disable no-use-before-define */
|
|
2984
2984
|
|
|
2985
|
-
const componentName
|
|
2985
|
+
const componentName$10 = getComponentName('icon');
|
|
2986
2986
|
|
|
2987
|
-
class RawIcon extends createBaseClass({ componentName: componentName
|
|
2987
|
+
class RawIcon extends createBaseClass({ componentName: componentName$10, baseSelector: 'slot' }) {
|
|
2988
2988
|
static get observedAttributes() {
|
|
2989
2989
|
return ['src'];
|
|
2990
2990
|
}
|
|
@@ -3069,7 +3069,7 @@ const clickableMixin = (superclass) =>
|
|
|
3069
3069
|
}
|
|
3070
3070
|
};
|
|
3071
3071
|
|
|
3072
|
-
const componentName
|
|
3072
|
+
const componentName$$ = getComponentName('button');
|
|
3073
3073
|
|
|
3074
3074
|
const resetStyles = `
|
|
3075
3075
|
:host {
|
|
@@ -3185,7 +3185,7 @@ const ButtonClass = compose(
|
|
|
3185
3185
|
}
|
|
3186
3186
|
`,
|
|
3187
3187
|
excludeAttrsSync: ['tabindex'],
|
|
3188
|
-
componentName: componentName
|
|
3188
|
+
componentName: componentName$$,
|
|
3189
3189
|
})
|
|
3190
3190
|
);
|
|
3191
3191
|
|
|
@@ -3233,7 +3233,7 @@ const mode = {
|
|
|
3233
3233
|
surface: globalRefs$y.colors.surface,
|
|
3234
3234
|
};
|
|
3235
3235
|
|
|
3236
|
-
const [helperTheme$4, helperRefs$4, helperVars$4] = createHelperVars({ mode }, componentName
|
|
3236
|
+
const [helperTheme$4, helperRefs$4, helperVars$4] = createHelperVars({ mode }, componentName$$);
|
|
3237
3237
|
|
|
3238
3238
|
const button = {
|
|
3239
3239
|
...helperTheme$4,
|
|
@@ -3345,7 +3345,7 @@ const button = {
|
|
|
3345
3345
|
},
|
|
3346
3346
|
};
|
|
3347
3347
|
|
|
3348
|
-
const vars$
|
|
3348
|
+
const vars$S = {
|
|
3349
3349
|
...compVars$6,
|
|
3350
3350
|
...helperVars$4,
|
|
3351
3351
|
};
|
|
@@ -3353,7 +3353,7 @@ const vars$R = {
|
|
|
3353
3353
|
var button$1 = /*#__PURE__*/Object.freeze({
|
|
3354
3354
|
__proto__: null,
|
|
3355
3355
|
default: button,
|
|
3356
|
-
vars: vars$
|
|
3356
|
+
vars: vars$S
|
|
3357
3357
|
});
|
|
3358
3358
|
|
|
3359
3359
|
const {
|
|
@@ -3647,7 +3647,7 @@ const inputFloatingLabelStyle = () => {
|
|
|
3647
3647
|
`;
|
|
3648
3648
|
};
|
|
3649
3649
|
|
|
3650
|
-
const componentName$
|
|
3650
|
+
const componentName$_ = getComponentName('text-field');
|
|
3651
3651
|
|
|
3652
3652
|
const observedAttrs$2 = ['type', 'label-type', 'copy-to-clipboard'];
|
|
3653
3653
|
|
|
@@ -3769,14 +3769,14 @@ const TextFieldClass = compose(
|
|
|
3769
3769
|
}
|
|
3770
3770
|
`,
|
|
3771
3771
|
excludeAttrsSync: ['tabindex'],
|
|
3772
|
-
componentName: componentName$
|
|
3772
|
+
componentName: componentName$_,
|
|
3773
3773
|
})
|
|
3774
3774
|
);
|
|
3775
3775
|
|
|
3776
|
-
const componentName$
|
|
3776
|
+
const componentName$Z = getComponentName('input-wrapper');
|
|
3777
3777
|
const globalRefs$x = getThemeRefs(globals);
|
|
3778
3778
|
|
|
3779
|
-
const [theme$1, refs, vars$
|
|
3779
|
+
const [theme$1, refs, vars$R] = createHelperVars(
|
|
3780
3780
|
{
|
|
3781
3781
|
labelTextColor: globalRefs$x.colors.surface.dark,
|
|
3782
3782
|
labelFontSize: '14px', // not taken from globals as it is fixed in all inputs
|
|
@@ -3888,70 +3888,70 @@ const [theme$1, refs, vars$Q] = createHelperVars(
|
|
|
3888
3888
|
backgroundColor: globalRefs$x.colors.surface.main,
|
|
3889
3889
|
},
|
|
3890
3890
|
},
|
|
3891
|
-
componentName$
|
|
3891
|
+
componentName$Z
|
|
3892
3892
|
);
|
|
3893
3893
|
|
|
3894
3894
|
var inputWrapper = /*#__PURE__*/Object.freeze({
|
|
3895
3895
|
__proto__: null,
|
|
3896
3896
|
default: theme$1,
|
|
3897
3897
|
refs: refs,
|
|
3898
|
-
vars: vars$
|
|
3898
|
+
vars: vars$R
|
|
3899
3899
|
});
|
|
3900
3900
|
|
|
3901
3901
|
const globalRefs$w = getThemeRefs(globals);
|
|
3902
|
-
const vars$
|
|
3902
|
+
const vars$Q = TextFieldClass.cssVarList;
|
|
3903
3903
|
|
|
3904
3904
|
const textField$1 = {
|
|
3905
|
-
[vars$
|
|
3906
|
-
[vars$
|
|
3907
|
-
[vars$
|
|
3908
|
-
[vars$
|
|
3909
|
-
[vars$
|
|
3910
|
-
[vars$
|
|
3911
|
-
[vars$
|
|
3912
|
-
[vars$
|
|
3913
|
-
[vars$
|
|
3914
|
-
[vars$
|
|
3915
|
-
[vars$
|
|
3916
|
-
[vars$
|
|
3917
|
-
[vars$
|
|
3918
|
-
[vars$
|
|
3919
|
-
[vars$
|
|
3920
|
-
[vars$
|
|
3921
|
-
[vars$
|
|
3922
|
-
[vars$
|
|
3923
|
-
[vars$
|
|
3924
|
-
[vars$
|
|
3925
|
-
[vars$
|
|
3926
|
-
[vars$
|
|
3927
|
-
[vars$
|
|
3928
|
-
[vars$
|
|
3929
|
-
[vars$
|
|
3905
|
+
[vars$Q.hostWidth]: refs.width,
|
|
3906
|
+
[vars$Q.hostMinWidth]: refs.minWidth,
|
|
3907
|
+
[vars$Q.hostDirection]: refs.direction,
|
|
3908
|
+
[vars$Q.fontSize]: refs.fontSize,
|
|
3909
|
+
[vars$Q.fontFamily]: refs.fontFamily,
|
|
3910
|
+
[vars$Q.labelFontSize]: refs.labelFontSize,
|
|
3911
|
+
[vars$Q.labelFontWeight]: refs.labelFontWeight,
|
|
3912
|
+
[vars$Q.labelTextColor]: refs.labelTextColor,
|
|
3913
|
+
[vars$Q.labelRequiredIndicator]: refs.requiredIndicator,
|
|
3914
|
+
[vars$Q.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
3915
|
+
[vars$Q.inputValueTextColor]: refs.valueTextColor,
|
|
3916
|
+
[vars$Q.inputPlaceholderColor]: refs.placeholderTextColor,
|
|
3917
|
+
[vars$Q.inputBorderWidth]: refs.borderWidth,
|
|
3918
|
+
[vars$Q.inputBorderStyle]: refs.borderStyle,
|
|
3919
|
+
[vars$Q.inputBorderColor]: refs.borderColor,
|
|
3920
|
+
[vars$Q.inputBorderRadius]: refs.borderRadius,
|
|
3921
|
+
[vars$Q.inputOutlineWidth]: refs.outlineWidth,
|
|
3922
|
+
[vars$Q.inputOutlineStyle]: refs.outlineStyle,
|
|
3923
|
+
[vars$Q.inputOutlineColor]: refs.outlineColor,
|
|
3924
|
+
[vars$Q.inputOutlineOffset]: refs.outlineOffset,
|
|
3925
|
+
[vars$Q.inputBackgroundColor]: refs.backgroundColor,
|
|
3926
|
+
[vars$Q.inputHeight]: refs.inputHeight,
|
|
3927
|
+
[vars$Q.inputHorizontalPadding]: refs.horizontalPadding,
|
|
3928
|
+
[vars$Q.helperTextColor]: refs.helperTextColor,
|
|
3929
|
+
[vars$Q.textAlign]: refs.textAlign,
|
|
3930
3930
|
textAlign: {
|
|
3931
|
-
right: { [vars$
|
|
3932
|
-
left: { [vars$
|
|
3933
|
-
center: { [vars$
|
|
3931
|
+
right: { [vars$Q.inputTextAlign]: 'right' },
|
|
3932
|
+
left: { [vars$Q.inputTextAlign]: 'left' },
|
|
3933
|
+
center: { [vars$Q.inputTextAlign]: 'center' },
|
|
3934
3934
|
},
|
|
3935
|
-
[vars$
|
|
3936
|
-
[vars$
|
|
3937
|
-
[vars$
|
|
3938
|
-
[vars$
|
|
3939
|
-
[vars$
|
|
3940
|
-
[vars$
|
|
3941
|
-
[vars$
|
|
3942
|
-
[vars$
|
|
3943
|
-
[vars$
|
|
3944
|
-
[vars$
|
|
3945
|
-
[vars$
|
|
3946
|
-
[vars$
|
|
3947
|
-
[vars$
|
|
3935
|
+
[vars$Q.labelPosition]: refs.labelPosition,
|
|
3936
|
+
[vars$Q.labelTopPosition]: refs.labelTopPosition,
|
|
3937
|
+
[vars$Q.labelHorizontalPosition]: refs.labelHorizontalPosition,
|
|
3938
|
+
[vars$Q.inputTransformY]: refs.inputTransformY,
|
|
3939
|
+
[vars$Q.inputTransition]: refs.inputTransition,
|
|
3940
|
+
[vars$Q.marginInlineStart]: refs.marginInlineStart,
|
|
3941
|
+
[vars$Q.placeholderOpacity]: refs.placeholderOpacity,
|
|
3942
|
+
[vars$Q.inputVerticalAlignment]: refs.inputVerticalAlignment,
|
|
3943
|
+
[vars$Q.valueInputHeight]: refs.valueInputHeight,
|
|
3944
|
+
[vars$Q.valueInputMarginBottom]: refs.valueInputMarginBottom,
|
|
3945
|
+
[vars$Q.inputIconOffset]: globalRefs$w.spacing.md,
|
|
3946
|
+
[vars$Q.inputIconSize]: refs.inputIconSize,
|
|
3947
|
+
[vars$Q.inputIconColor]: refs.placeholderTextColor,
|
|
3948
3948
|
};
|
|
3949
3949
|
|
|
3950
3950
|
var textField$2 = /*#__PURE__*/Object.freeze({
|
|
3951
3951
|
__proto__: null,
|
|
3952
3952
|
default: textField$1,
|
|
3953
3953
|
textField: textField$1,
|
|
3954
|
-
vars: vars$
|
|
3954
|
+
vars: vars$Q
|
|
3955
3955
|
});
|
|
3956
3956
|
|
|
3957
3957
|
const passwordDraggableMixin = (superclass) =>
|
|
@@ -3993,7 +3993,7 @@ const passwordDraggableMixin = (superclass) =>
|
|
|
3993
3993
|
}
|
|
3994
3994
|
};
|
|
3995
3995
|
|
|
3996
|
-
const componentName$
|
|
3996
|
+
const componentName$Y = getComponentName('password');
|
|
3997
3997
|
|
|
3998
3998
|
const customMixin$b = (superclass) =>
|
|
3999
3999
|
class PasswordFieldMixinClass extends superclass {
|
|
@@ -4269,58 +4269,58 @@ const PasswordClass = compose(
|
|
|
4269
4269
|
}
|
|
4270
4270
|
`,
|
|
4271
4271
|
excludeAttrsSync: ['tabindex'],
|
|
4272
|
-
componentName: componentName$
|
|
4272
|
+
componentName: componentName$Y,
|
|
4273
4273
|
})
|
|
4274
4274
|
);
|
|
4275
4275
|
|
|
4276
4276
|
const globalRefs$v = getThemeRefs(globals);
|
|
4277
|
-
const vars$
|
|
4277
|
+
const vars$P = PasswordClass.cssVarList;
|
|
4278
4278
|
|
|
4279
4279
|
const password = {
|
|
4280
|
-
[vars$
|
|
4281
|
-
[vars$
|
|
4282
|
-
[vars$
|
|
4283
|
-
[vars$
|
|
4284
|
-
[vars$
|
|
4285
|
-
[vars$
|
|
4286
|
-
[vars$
|
|
4287
|
-
[vars$
|
|
4288
|
-
[vars$
|
|
4289
|
-
[vars$
|
|
4290
|
-
[vars$
|
|
4291
|
-
[vars$
|
|
4292
|
-
[vars$
|
|
4293
|
-
[vars$
|
|
4294
|
-
[vars$
|
|
4295
|
-
[vars$
|
|
4296
|
-
[vars$
|
|
4297
|
-
[vars$
|
|
4298
|
-
[vars$
|
|
4299
|
-
[vars$
|
|
4300
|
-
[vars$
|
|
4301
|
-
[vars$
|
|
4302
|
-
[vars$
|
|
4303
|
-
[vars$
|
|
4304
|
-
[vars$
|
|
4305
|
-
[vars$
|
|
4306
|
-
[vars$
|
|
4307
|
-
[vars$
|
|
4308
|
-
[vars$
|
|
4309
|
-
[vars$
|
|
4310
|
-
[vars$
|
|
4311
|
-
[vars$
|
|
4312
|
-
[vars$
|
|
4313
|
-
[vars$
|
|
4314
|
-
[vars$
|
|
4280
|
+
[vars$P.hostWidth]: refs.width,
|
|
4281
|
+
[vars$P.hostMinWidth]: refs.minWidth,
|
|
4282
|
+
[vars$P.hostDirection]: refs.direction,
|
|
4283
|
+
[vars$P.fontSize]: refs.fontSize,
|
|
4284
|
+
[vars$P.fontFamily]: refs.fontFamily,
|
|
4285
|
+
[vars$P.labelFontSize]: refs.labelFontSize,
|
|
4286
|
+
[vars$P.labelFontWeight]: refs.labelFontWeight,
|
|
4287
|
+
[vars$P.labelTextColor]: refs.labelTextColor,
|
|
4288
|
+
[vars$P.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
4289
|
+
[vars$P.inputHorizontalPadding]: refs.horizontalPadding,
|
|
4290
|
+
[vars$P.inputHeight]: refs.inputHeight,
|
|
4291
|
+
[vars$P.inputBackgroundColor]: refs.backgroundColor,
|
|
4292
|
+
[vars$P.labelRequiredIndicator]: refs.requiredIndicator,
|
|
4293
|
+
[vars$P.inputValueTextColor]: refs.valueTextColor,
|
|
4294
|
+
[vars$P.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
|
4295
|
+
[vars$P.inputBorderWidth]: refs.borderWidth,
|
|
4296
|
+
[vars$P.inputBorderStyle]: refs.borderStyle,
|
|
4297
|
+
[vars$P.inputBorderColor]: refs.borderColor,
|
|
4298
|
+
[vars$P.inputBorderRadius]: refs.borderRadius,
|
|
4299
|
+
[vars$P.inputOutlineWidth]: refs.outlineWidth,
|
|
4300
|
+
[vars$P.inputOutlineStyle]: refs.outlineStyle,
|
|
4301
|
+
[vars$P.inputOutlineColor]: refs.outlineColor,
|
|
4302
|
+
[vars$P.inputOutlineOffset]: refs.outlineOffset,
|
|
4303
|
+
[vars$P.revealButtonOffset]: globalRefs$v.spacing.md,
|
|
4304
|
+
[vars$P.revealButtonSize]: refs.toggleButtonSize,
|
|
4305
|
+
[vars$P.revealButtonColor]: refs.placeholderTextColor,
|
|
4306
|
+
[vars$P.labelPosition]: refs.labelPosition,
|
|
4307
|
+
[vars$P.labelTopPosition]: refs.labelTopPosition,
|
|
4308
|
+
[vars$P.labelHorizontalPosition]: refs.labelHorizontalPosition,
|
|
4309
|
+
[vars$P.inputTransformY]: refs.inputTransformY,
|
|
4310
|
+
[vars$P.inputTransition]: refs.inputTransition,
|
|
4311
|
+
[vars$P.marginInlineStart]: refs.marginInlineStart,
|
|
4312
|
+
[vars$P.placeholderOpacity]: refs.placeholderOpacity,
|
|
4313
|
+
[vars$P.inputVerticalAlignment]: refs.inputVerticalAlignment,
|
|
4314
|
+
[vars$P.valueInputHeight]: refs.valueInputHeight,
|
|
4315
4315
|
};
|
|
4316
4316
|
|
|
4317
4317
|
var password$1 = /*#__PURE__*/Object.freeze({
|
|
4318
4318
|
__proto__: null,
|
|
4319
4319
|
default: password,
|
|
4320
|
-
vars: vars$
|
|
4320
|
+
vars: vars$P
|
|
4321
4321
|
});
|
|
4322
4322
|
|
|
4323
|
-
const componentName$
|
|
4323
|
+
const componentName$X = getComponentName('number-field');
|
|
4324
4324
|
|
|
4325
4325
|
const NumberFieldClass = compose(
|
|
4326
4326
|
createStyleMixin({
|
|
@@ -4354,55 +4354,55 @@ const NumberFieldClass = compose(
|
|
|
4354
4354
|
}
|
|
4355
4355
|
`,
|
|
4356
4356
|
excludeAttrsSync: ['tabindex'],
|
|
4357
|
-
componentName: componentName$
|
|
4357
|
+
componentName: componentName$X,
|
|
4358
4358
|
})
|
|
4359
4359
|
);
|
|
4360
4360
|
|
|
4361
|
-
const vars$
|
|
4361
|
+
const vars$O = NumberFieldClass.cssVarList;
|
|
4362
4362
|
|
|
4363
4363
|
const numberField = {
|
|
4364
|
-
[vars$
|
|
4365
|
-
[vars$
|
|
4366
|
-
[vars$
|
|
4367
|
-
[vars$
|
|
4368
|
-
[vars$
|
|
4369
|
-
[vars$
|
|
4370
|
-
[vars$
|
|
4371
|
-
[vars$
|
|
4372
|
-
[vars$
|
|
4373
|
-
[vars$
|
|
4374
|
-
[vars$
|
|
4375
|
-
[vars$
|
|
4376
|
-
[vars$
|
|
4377
|
-
[vars$
|
|
4378
|
-
[vars$
|
|
4379
|
-
[vars$
|
|
4380
|
-
[vars$
|
|
4381
|
-
[vars$
|
|
4382
|
-
[vars$
|
|
4383
|
-
[vars$
|
|
4384
|
-
[vars$
|
|
4385
|
-
[vars$
|
|
4386
|
-
[vars$
|
|
4387
|
-
[vars$
|
|
4388
|
-
[vars$
|
|
4389
|
-
[vars$
|
|
4390
|
-
[vars$
|
|
4391
|
-
[vars$
|
|
4392
|
-
[vars$
|
|
4393
|
-
[vars$
|
|
4394
|
-
[vars$
|
|
4395
|
-
[vars$
|
|
4396
|
-
[vars$
|
|
4364
|
+
[vars$O.hostWidth]: refs.width,
|
|
4365
|
+
[vars$O.hostMinWidth]: refs.minWidth,
|
|
4366
|
+
[vars$O.hostDirection]: refs.direction,
|
|
4367
|
+
[vars$O.fontSize]: refs.fontSize,
|
|
4368
|
+
[vars$O.fontFamily]: refs.fontFamily,
|
|
4369
|
+
[vars$O.labelFontSize]: refs.labelFontSize,
|
|
4370
|
+
[vars$O.labelFontWeight]: refs.labelFontWeight,
|
|
4371
|
+
[vars$O.labelTextColor]: refs.labelTextColor,
|
|
4372
|
+
[vars$O.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
4373
|
+
[vars$O.inputValueTextColor]: refs.valueTextColor,
|
|
4374
|
+
[vars$O.inputPlaceholderColor]: refs.placeholderTextColor,
|
|
4375
|
+
[vars$O.inputBorderWidth]: refs.borderWidth,
|
|
4376
|
+
[vars$O.inputBorderStyle]: refs.borderStyle,
|
|
4377
|
+
[vars$O.inputBorderColor]: refs.borderColor,
|
|
4378
|
+
[vars$O.inputBorderRadius]: refs.borderRadius,
|
|
4379
|
+
[vars$O.inputOutlineWidth]: refs.outlineWidth,
|
|
4380
|
+
[vars$O.inputOutlineStyle]: refs.outlineStyle,
|
|
4381
|
+
[vars$O.inputOutlineColor]: refs.outlineColor,
|
|
4382
|
+
[vars$O.inputOutlineOffset]: refs.outlineOffset,
|
|
4383
|
+
[vars$O.inputBackgroundColor]: refs.backgroundColor,
|
|
4384
|
+
[vars$O.labelRequiredIndicator]: refs.requiredIndicator,
|
|
4385
|
+
[vars$O.inputHorizontalPadding]: refs.horizontalPadding,
|
|
4386
|
+
[vars$O.inputHeight]: refs.inputHeight,
|
|
4387
|
+
[vars$O.labelPosition]: refs.labelPosition,
|
|
4388
|
+
[vars$O.labelTopPosition]: refs.labelTopPosition,
|
|
4389
|
+
[vars$O.labelHorizontalPosition]: refs.labelHorizontalPosition,
|
|
4390
|
+
[vars$O.inputTransformY]: refs.inputTransformY,
|
|
4391
|
+
[vars$O.inputTransition]: refs.inputTransition,
|
|
4392
|
+
[vars$O.marginInlineStart]: refs.marginInlineStart,
|
|
4393
|
+
[vars$O.placeholderOpacity]: refs.placeholderOpacity,
|
|
4394
|
+
[vars$O.inputVerticalAlignment]: refs.inputVerticalAlignment,
|
|
4395
|
+
[vars$O.valueInputHeight]: refs.valueInputHeight,
|
|
4396
|
+
[vars$O.valueInputMarginBottom]: refs.valueInputMarginBottom,
|
|
4397
4397
|
};
|
|
4398
4398
|
|
|
4399
4399
|
var numberField$1 = /*#__PURE__*/Object.freeze({
|
|
4400
4400
|
__proto__: null,
|
|
4401
4401
|
default: numberField,
|
|
4402
|
-
vars: vars$
|
|
4402
|
+
vars: vars$O
|
|
4403
4403
|
});
|
|
4404
4404
|
|
|
4405
|
-
const componentName$
|
|
4405
|
+
const componentName$W = getComponentName('email-field');
|
|
4406
4406
|
|
|
4407
4407
|
const defaultPattern = "^[\\w\\.\\%\\+\\-']+@[\\w\\.\\-]+\\.[A-Za-z]{2,}$";
|
|
4408
4408
|
const defaultAutocomplete = 'username';
|
|
@@ -4471,55 +4471,55 @@ const EmailFieldClass = compose(
|
|
|
4471
4471
|
}
|
|
4472
4472
|
`,
|
|
4473
4473
|
excludeAttrsSync: ['tabindex'],
|
|
4474
|
-
componentName: componentName$
|
|
4474
|
+
componentName: componentName$W,
|
|
4475
4475
|
})
|
|
4476
4476
|
);
|
|
4477
4477
|
|
|
4478
|
-
const vars$
|
|
4478
|
+
const vars$N = EmailFieldClass.cssVarList;
|
|
4479
4479
|
|
|
4480
4480
|
const emailField = {
|
|
4481
|
-
[vars$
|
|
4482
|
-
[vars$
|
|
4483
|
-
[vars$
|
|
4484
|
-
[vars$
|
|
4485
|
-
[vars$
|
|
4486
|
-
[vars$
|
|
4487
|
-
[vars$
|
|
4488
|
-
[vars$
|
|
4489
|
-
[vars$
|
|
4490
|
-
[vars$
|
|
4491
|
-
[vars$
|
|
4492
|
-
[vars$
|
|
4493
|
-
[vars$
|
|
4494
|
-
[vars$
|
|
4495
|
-
[vars$
|
|
4496
|
-
[vars$
|
|
4497
|
-
[vars$
|
|
4498
|
-
[vars$
|
|
4499
|
-
[vars$
|
|
4500
|
-
[vars$
|
|
4501
|
-
[vars$
|
|
4502
|
-
[vars$
|
|
4503
|
-
[vars$
|
|
4504
|
-
[vars$
|
|
4505
|
-
[vars$
|
|
4506
|
-
[vars$
|
|
4507
|
-
[vars$
|
|
4508
|
-
[vars$
|
|
4509
|
-
[vars$
|
|
4510
|
-
[vars$
|
|
4511
|
-
[vars$
|
|
4512
|
-
[vars$
|
|
4513
|
-
[vars$
|
|
4481
|
+
[vars$N.hostWidth]: refs.width,
|
|
4482
|
+
[vars$N.hostMinWidth]: refs.minWidth,
|
|
4483
|
+
[vars$N.hostDirection]: refs.direction,
|
|
4484
|
+
[vars$N.fontSize]: refs.fontSize,
|
|
4485
|
+
[vars$N.fontFamily]: refs.fontFamily,
|
|
4486
|
+
[vars$N.labelFontSize]: refs.labelFontSize,
|
|
4487
|
+
[vars$N.labelFontWeight]: refs.labelFontWeight,
|
|
4488
|
+
[vars$N.labelTextColor]: refs.labelTextColor,
|
|
4489
|
+
[vars$N.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
4490
|
+
[vars$N.inputValueTextColor]: refs.valueTextColor,
|
|
4491
|
+
[vars$N.labelRequiredIndicator]: refs.requiredIndicator,
|
|
4492
|
+
[vars$N.inputPlaceholderColor]: refs.placeholderTextColor,
|
|
4493
|
+
[vars$N.inputBorderWidth]: refs.borderWidth,
|
|
4494
|
+
[vars$N.inputBorderStyle]: refs.borderStyle,
|
|
4495
|
+
[vars$N.inputBorderColor]: refs.borderColor,
|
|
4496
|
+
[vars$N.inputBorderRadius]: refs.borderRadius,
|
|
4497
|
+
[vars$N.inputOutlineWidth]: refs.outlineWidth,
|
|
4498
|
+
[vars$N.inputOutlineStyle]: refs.outlineStyle,
|
|
4499
|
+
[vars$N.inputOutlineColor]: refs.outlineColor,
|
|
4500
|
+
[vars$N.inputOutlineOffset]: refs.outlineOffset,
|
|
4501
|
+
[vars$N.inputBackgroundColor]: refs.backgroundColor,
|
|
4502
|
+
[vars$N.inputHorizontalPadding]: refs.horizontalPadding,
|
|
4503
|
+
[vars$N.inputHeight]: refs.inputHeight,
|
|
4504
|
+
[vars$N.labelPosition]: refs.labelPosition,
|
|
4505
|
+
[vars$N.labelTopPosition]: refs.labelTopPosition,
|
|
4506
|
+
[vars$N.labelHorizontalPosition]: refs.labelHorizontalPosition,
|
|
4507
|
+
[vars$N.inputTransformY]: refs.inputTransformY,
|
|
4508
|
+
[vars$N.inputTransition]: refs.inputTransition,
|
|
4509
|
+
[vars$N.marginInlineStart]: refs.marginInlineStart,
|
|
4510
|
+
[vars$N.placeholderOpacity]: refs.placeholderOpacity,
|
|
4511
|
+
[vars$N.inputVerticalAlignment]: refs.inputVerticalAlignment,
|
|
4512
|
+
[vars$N.valueInputHeight]: refs.valueInputHeight,
|
|
4513
|
+
[vars$N.valueInputMarginBottom]: refs.valueInputMarginBottom,
|
|
4514
4514
|
};
|
|
4515
4515
|
|
|
4516
4516
|
var emailField$1 = /*#__PURE__*/Object.freeze({
|
|
4517
4517
|
__proto__: null,
|
|
4518
4518
|
default: emailField,
|
|
4519
|
-
vars: vars$
|
|
4519
|
+
vars: vars$N
|
|
4520
4520
|
});
|
|
4521
4521
|
|
|
4522
|
-
const componentName$
|
|
4522
|
+
const componentName$V = getComponentName('text-area');
|
|
4523
4523
|
|
|
4524
4524
|
const {
|
|
4525
4525
|
host: host$l,
|
|
@@ -4595,49 +4595,49 @@ const TextAreaClass = compose(
|
|
|
4595
4595
|
${resetInputCursor('vaadin-text-area')}
|
|
4596
4596
|
`,
|
|
4597
4597
|
excludeAttrsSync: ['tabindex'],
|
|
4598
|
-
componentName: componentName$
|
|
4598
|
+
componentName: componentName$V,
|
|
4599
4599
|
})
|
|
4600
4600
|
);
|
|
4601
4601
|
|
|
4602
|
-
const vars$
|
|
4602
|
+
const vars$M = TextAreaClass.cssVarList;
|
|
4603
4603
|
|
|
4604
4604
|
const textArea = {
|
|
4605
|
-
[vars$
|
|
4606
|
-
[vars$
|
|
4607
|
-
[vars$
|
|
4608
|
-
[vars$
|
|
4609
|
-
[vars$
|
|
4610
|
-
[vars$
|
|
4611
|
-
[vars$
|
|
4612
|
-
[vars$
|
|
4613
|
-
[vars$
|
|
4614
|
-
[vars$
|
|
4615
|
-
[vars$
|
|
4616
|
-
[vars$
|
|
4617
|
-
[vars$
|
|
4618
|
-
[vars$
|
|
4619
|
-
[vars$
|
|
4620
|
-
[vars$
|
|
4621
|
-
[vars$
|
|
4622
|
-
[vars$
|
|
4623
|
-
[vars$
|
|
4624
|
-
[vars$
|
|
4625
|
-
[vars$
|
|
4605
|
+
[vars$M.hostWidth]: refs.width,
|
|
4606
|
+
[vars$M.hostMinWidth]: refs.minWidth,
|
|
4607
|
+
[vars$M.hostDirection]: refs.direction,
|
|
4608
|
+
[vars$M.fontSize]: refs.fontSize,
|
|
4609
|
+
[vars$M.fontFamily]: refs.fontFamily,
|
|
4610
|
+
[vars$M.labelTextColor]: refs.labelTextColor,
|
|
4611
|
+
[vars$M.labelRequiredIndicator]: refs.requiredIndicator,
|
|
4612
|
+
[vars$M.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
4613
|
+
[vars$M.inputBackgroundColor]: refs.backgroundColor,
|
|
4614
|
+
[vars$M.inputValueTextColor]: refs.valueTextColor,
|
|
4615
|
+
[vars$M.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
|
4616
|
+
[vars$M.inputBorderRadius]: refs.borderRadius,
|
|
4617
|
+
[vars$M.inputBorderWidth]: refs.borderWidth,
|
|
4618
|
+
[vars$M.inputBorderStyle]: refs.borderStyle,
|
|
4619
|
+
[vars$M.inputBorderColor]: refs.borderColor,
|
|
4620
|
+
[vars$M.inputOutlineWidth]: refs.outlineWidth,
|
|
4621
|
+
[vars$M.inputOutlineStyle]: refs.outlineStyle,
|
|
4622
|
+
[vars$M.inputOutlineColor]: refs.outlineColor,
|
|
4623
|
+
[vars$M.inputOutlineOffset]: refs.outlineOffset,
|
|
4624
|
+
[vars$M.inputResizeType]: 'vertical',
|
|
4625
|
+
[vars$M.inputMinHeight]: '5em',
|
|
4626
4626
|
textAlign: {
|
|
4627
|
-
right: { [vars$
|
|
4628
|
-
left: { [vars$
|
|
4629
|
-
center: { [vars$
|
|
4627
|
+
right: { [vars$M.inputTextAlign]: 'right' },
|
|
4628
|
+
left: { [vars$M.inputTextAlign]: 'left' },
|
|
4629
|
+
center: { [vars$M.inputTextAlign]: 'center' },
|
|
4630
4630
|
},
|
|
4631
4631
|
|
|
4632
4632
|
_readonly: {
|
|
4633
|
-
[vars$
|
|
4633
|
+
[vars$M.inputResizeType]: 'none',
|
|
4634
4634
|
},
|
|
4635
4635
|
};
|
|
4636
4636
|
|
|
4637
4637
|
var textArea$1 = /*#__PURE__*/Object.freeze({
|
|
4638
4638
|
__proto__: null,
|
|
4639
4639
|
default: textArea,
|
|
4640
|
-
vars: vars$
|
|
4640
|
+
vars: vars$M
|
|
4641
4641
|
});
|
|
4642
4642
|
|
|
4643
4643
|
const createBaseInputClass = (...args) =>
|
|
@@ -4648,9 +4648,9 @@ const createBaseInputClass = (...args) =>
|
|
|
4648
4648
|
inputEventsDispatchingMixin
|
|
4649
4649
|
)(createBaseClass(...args));
|
|
4650
4650
|
|
|
4651
|
-
const componentName$
|
|
4651
|
+
const componentName$U = getComponentName('boolean-field-internal');
|
|
4652
4652
|
|
|
4653
|
-
createBaseInputClass({ componentName: componentName$
|
|
4653
|
+
createBaseInputClass({ componentName: componentName$U, baseSelector: 'div' });
|
|
4654
4654
|
|
|
4655
4655
|
const booleanFieldMixin = (superclass) =>
|
|
4656
4656
|
class BooleanFieldMixinClass extends superclass {
|
|
@@ -4659,14 +4659,14 @@ const booleanFieldMixin = (superclass) =>
|
|
|
4659
4659
|
|
|
4660
4660
|
const template = document.createElement('template');
|
|
4661
4661
|
template.innerHTML = `
|
|
4662
|
-
<${componentName$
|
|
4662
|
+
<${componentName$U}
|
|
4663
4663
|
tabindex="-1"
|
|
4664
4664
|
slot="input"
|
|
4665
|
-
></${componentName$
|
|
4665
|
+
></${componentName$U}>
|
|
4666
4666
|
`;
|
|
4667
4667
|
|
|
4668
4668
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
|
4669
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
|
4669
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$U);
|
|
4670
4670
|
this.checkbox = this.inputElement.querySelector('vaadin-checkbox');
|
|
4671
4671
|
|
|
4672
4672
|
forwardAttrs(this, this.inputElement, {
|
|
@@ -4735,7 +4735,7 @@ descope-boolean-field-internal {
|
|
|
4735
4735
|
}
|
|
4736
4736
|
`;
|
|
4737
4737
|
|
|
4738
|
-
const componentName$
|
|
4738
|
+
const componentName$T = getComponentName('checkbox');
|
|
4739
4739
|
|
|
4740
4740
|
const {
|
|
4741
4741
|
host: host$k,
|
|
@@ -4847,44 +4847,44 @@ const CheckboxClass = compose(
|
|
|
4847
4847
|
}
|
|
4848
4848
|
`,
|
|
4849
4849
|
excludeAttrsSync: ['label', 'tabindex'],
|
|
4850
|
-
componentName: componentName$
|
|
4850
|
+
componentName: componentName$T,
|
|
4851
4851
|
})
|
|
4852
4852
|
);
|
|
4853
4853
|
|
|
4854
|
-
const vars$
|
|
4854
|
+
const vars$L = CheckboxClass.cssVarList;
|
|
4855
4855
|
const checkboxSize = '1.35em';
|
|
4856
4856
|
|
|
4857
4857
|
const checkbox = {
|
|
4858
|
-
[vars$
|
|
4859
|
-
[vars$
|
|
4860
|
-
[vars$
|
|
4861
|
-
[vars$
|
|
4862
|
-
[vars$
|
|
4863
|
-
[vars$
|
|
4864
|
-
[vars$
|
|
4865
|
-
[vars$
|
|
4866
|
-
[vars$
|
|
4867
|
-
[vars$
|
|
4868
|
-
[vars$
|
|
4869
|
-
[vars$
|
|
4870
|
-
[vars$
|
|
4871
|
-
[vars$
|
|
4872
|
-
[vars$
|
|
4873
|
-
[vars$
|
|
4874
|
-
[vars$
|
|
4875
|
-
[vars$
|
|
4876
|
-
[vars$
|
|
4877
|
-
[vars$
|
|
4878
|
-
[vars$
|
|
4858
|
+
[vars$L.hostWidth]: refs.width,
|
|
4859
|
+
[vars$L.hostDirection]: refs.direction,
|
|
4860
|
+
[vars$L.fontSize]: refs.fontSize,
|
|
4861
|
+
[vars$L.fontFamily]: refs.fontFamily,
|
|
4862
|
+
[vars$L.labelTextColor]: refs.labelTextColor,
|
|
4863
|
+
[vars$L.labelRequiredIndicator]: refs.requiredIndicator,
|
|
4864
|
+
[vars$L.labelFontWeight]: '400',
|
|
4865
|
+
[vars$L.labelLineHeight]: checkboxSize,
|
|
4866
|
+
[vars$L.labelSpacing]: '1em',
|
|
4867
|
+
[vars$L.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
4868
|
+
[vars$L.inputOutlineWidth]: refs.outlineWidth,
|
|
4869
|
+
[vars$L.inputOutlineOffset]: refs.outlineOffset,
|
|
4870
|
+
[vars$L.inputOutlineColor]: refs.outlineColor,
|
|
4871
|
+
[vars$L.inputOutlineStyle]: refs.outlineStyle,
|
|
4872
|
+
[vars$L.inputBorderRadius]: refs.borderRadius,
|
|
4873
|
+
[vars$L.inputBorderColor]: refs.borderColor,
|
|
4874
|
+
[vars$L.inputBorderWidth]: refs.borderWidth,
|
|
4875
|
+
[vars$L.inputBorderStyle]: refs.borderStyle,
|
|
4876
|
+
[vars$L.inputBackgroundColor]: refs.backgroundColor,
|
|
4877
|
+
[vars$L.inputSize]: checkboxSize,
|
|
4878
|
+
[vars$L.inputValueTextColor]: refs.valueTextColor,
|
|
4879
4879
|
};
|
|
4880
4880
|
|
|
4881
4881
|
var checkbox$1 = /*#__PURE__*/Object.freeze({
|
|
4882
4882
|
__proto__: null,
|
|
4883
4883
|
default: checkbox,
|
|
4884
|
-
vars: vars$
|
|
4884
|
+
vars: vars$L
|
|
4885
4885
|
});
|
|
4886
4886
|
|
|
4887
|
-
const componentName$
|
|
4887
|
+
const componentName$S = getComponentName('switch-toggle');
|
|
4888
4888
|
|
|
4889
4889
|
const {
|
|
4890
4890
|
host: host$j,
|
|
@@ -5016,7 +5016,7 @@ const SwitchToggleClass = compose(
|
|
|
5016
5016
|
}
|
|
5017
5017
|
`,
|
|
5018
5018
|
excludeAttrsSync: ['label', 'tabindex'],
|
|
5019
|
-
componentName: componentName$
|
|
5019
|
+
componentName: componentName$S,
|
|
5020
5020
|
})
|
|
5021
5021
|
);
|
|
5022
5022
|
|
|
@@ -5024,74 +5024,74 @@ const knobMargin = '2px';
|
|
|
5024
5024
|
const checkboxHeight = '1.25em';
|
|
5025
5025
|
|
|
5026
5026
|
const globalRefs$u = getThemeRefs(globals);
|
|
5027
|
-
const vars$
|
|
5027
|
+
const vars$K = SwitchToggleClass.cssVarList;
|
|
5028
5028
|
|
|
5029
5029
|
const switchToggle = {
|
|
5030
|
-
[vars$
|
|
5031
|
-
[vars$
|
|
5032
|
-
[vars$
|
|
5033
|
-
[vars$
|
|
5034
|
-
|
|
5035
|
-
[vars$
|
|
5036
|
-
[vars$
|
|
5037
|
-
[vars$
|
|
5038
|
-
[vars$
|
|
5039
|
-
|
|
5040
|
-
[vars$
|
|
5041
|
-
[vars$
|
|
5042
|
-
[vars$
|
|
5043
|
-
[vars$
|
|
5044
|
-
[vars$
|
|
5045
|
-
[vars$
|
|
5046
|
-
[vars$
|
|
5047
|
-
|
|
5048
|
-
[vars$
|
|
5049
|
-
[vars$
|
|
5050
|
-
[vars$
|
|
5051
|
-
[vars$
|
|
5052
|
-
[vars$
|
|
5053
|
-
[vars$
|
|
5054
|
-
|
|
5055
|
-
[vars$
|
|
5056
|
-
[vars$
|
|
5057
|
-
[vars$
|
|
5058
|
-
[vars$
|
|
5059
|
-
[vars$
|
|
5060
|
-
[vars$
|
|
5030
|
+
[vars$K.hostWidth]: refs.width,
|
|
5031
|
+
[vars$K.hostDirection]: refs.direction,
|
|
5032
|
+
[vars$K.fontSize]: refs.fontSize,
|
|
5033
|
+
[vars$K.fontFamily]: refs.fontFamily,
|
|
5034
|
+
|
|
5035
|
+
[vars$K.inputOutlineWidth]: refs.outlineWidth,
|
|
5036
|
+
[vars$K.inputOutlineOffset]: refs.outlineOffset,
|
|
5037
|
+
[vars$K.inputOutlineColor]: refs.outlineColor,
|
|
5038
|
+
[vars$K.inputOutlineStyle]: refs.outlineStyle,
|
|
5039
|
+
|
|
5040
|
+
[vars$K.trackBorderStyle]: refs.borderStyle,
|
|
5041
|
+
[vars$K.trackBorderWidth]: refs.borderWidth, // var `trackBorderWidth` used outside the theme for `left` margin calculation
|
|
5042
|
+
[vars$K.trackBorderColor]: refs.borderColor,
|
|
5043
|
+
[vars$K.trackBackgroundColor]: refs.backgroundColor,
|
|
5044
|
+
[vars$K.trackBorderRadius]: globalRefs$u.radius.md,
|
|
5045
|
+
[vars$K.trackWidth]: '2.5em', // var `trackWidth` used outside the theme for `left` margin calculation
|
|
5046
|
+
[vars$K.trackHeight]: checkboxHeight,
|
|
5047
|
+
|
|
5048
|
+
[vars$K.knobSize]: `calc(1em - ${knobMargin})`,
|
|
5049
|
+
[vars$K.knobRadius]: '50%',
|
|
5050
|
+
[vars$K.knobTopOffset]: '1px',
|
|
5051
|
+
[vars$K.knobLeftOffset]: knobMargin,
|
|
5052
|
+
[vars$K.knobColor]: refs.labelTextColor,
|
|
5053
|
+
[vars$K.knobTransitionDuration]: '0.3s',
|
|
5054
|
+
|
|
5055
|
+
[vars$K.labelTextColor]: refs.labelTextColor,
|
|
5056
|
+
[vars$K.labelFontWeight]: '400',
|
|
5057
|
+
[vars$K.labelLineHeight]: '1.35em',
|
|
5058
|
+
[vars$K.labelSpacing]: '1em',
|
|
5059
|
+
[vars$K.labelRequiredIndicator]: refs.requiredIndicator,
|
|
5060
|
+
[vars$K.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
5061
5061
|
|
|
5062
5062
|
_checked: {
|
|
5063
|
-
[vars$
|
|
5064
|
-
[vars$
|
|
5065
|
-
[vars$
|
|
5066
|
-
[vars$
|
|
5063
|
+
[vars$K.trackBorderColor]: refs.borderColor,
|
|
5064
|
+
[vars$K.knobLeftOffset]: `calc(100% - var(${vars$K.knobSize}) - ${knobMargin})`,
|
|
5065
|
+
[vars$K.knobColor]: refs.valueTextColor,
|
|
5066
|
+
[vars$K.knobTextColor]: refs.valueTextColor,
|
|
5067
5067
|
},
|
|
5068
5068
|
|
|
5069
5069
|
_disabled: {
|
|
5070
|
-
[vars$
|
|
5071
|
-
[vars$
|
|
5072
|
-
[vars$
|
|
5073
|
-
[vars$
|
|
5070
|
+
[vars$K.knobColor]: globalRefs$u.colors.surface.light,
|
|
5071
|
+
[vars$K.trackBorderColor]: globalRefs$u.colors.surface.light,
|
|
5072
|
+
[vars$K.trackBackgroundColor]: globalRefs$u.colors.surface.main,
|
|
5073
|
+
[vars$K.labelTextColor]: refs.labelTextColor,
|
|
5074
5074
|
_checked: {
|
|
5075
|
-
[vars$
|
|
5076
|
-
[vars$
|
|
5075
|
+
[vars$K.knobColor]: globalRefs$u.colors.surface.light,
|
|
5076
|
+
[vars$K.trackBackgroundColor]: globalRefs$u.colors.surface.main,
|
|
5077
5077
|
},
|
|
5078
5078
|
},
|
|
5079
5079
|
|
|
5080
5080
|
_invalid: {
|
|
5081
|
-
[vars$
|
|
5082
|
-
[vars$
|
|
5081
|
+
[vars$K.trackBorderColor]: globalRefs$u.colors.error.main,
|
|
5082
|
+
[vars$K.knobColor]: globalRefs$u.colors.error.main,
|
|
5083
5083
|
},
|
|
5084
5084
|
};
|
|
5085
5085
|
|
|
5086
5086
|
var switchToggle$1 = /*#__PURE__*/Object.freeze({
|
|
5087
5087
|
__proto__: null,
|
|
5088
5088
|
default: switchToggle,
|
|
5089
|
-
vars: vars$
|
|
5089
|
+
vars: vars$K
|
|
5090
5090
|
});
|
|
5091
5091
|
|
|
5092
|
-
const componentName$
|
|
5092
|
+
const componentName$R = getComponentName('container');
|
|
5093
5093
|
|
|
5094
|
-
class RawContainer extends createBaseClass({ componentName: componentName$
|
|
5094
|
+
class RawContainer extends createBaseClass({ componentName: componentName$R, baseSelector: 'slot' }) {
|
|
5095
5095
|
constructor() {
|
|
5096
5096
|
super();
|
|
5097
5097
|
|
|
@@ -5172,7 +5172,7 @@ const [helperTheme$3, helperRefs$3, helperVars$3] = createHelperVars(
|
|
|
5172
5172
|
horizontalAlignment,
|
|
5173
5173
|
shadowColor: '#00000020', // if we want to support transparency vars, we should use different color format
|
|
5174
5174
|
},
|
|
5175
|
-
componentName$
|
|
5175
|
+
componentName$R
|
|
5176
5176
|
);
|
|
5177
5177
|
|
|
5178
5178
|
const { shadowColor: shadowColor$3 } = helperRefs$3;
|
|
@@ -5267,7 +5267,7 @@ const container = {
|
|
|
5267
5267
|
},
|
|
5268
5268
|
};
|
|
5269
5269
|
|
|
5270
|
-
const vars$
|
|
5270
|
+
const vars$J = {
|
|
5271
5271
|
...compVars$5,
|
|
5272
5272
|
...helperVars$3,
|
|
5273
5273
|
};
|
|
@@ -5275,7 +5275,7 @@ const vars$I = {
|
|
|
5275
5275
|
var container$1 = /*#__PURE__*/Object.freeze({
|
|
5276
5276
|
__proto__: null,
|
|
5277
5277
|
default: container,
|
|
5278
|
-
vars: vars$
|
|
5278
|
+
vars: vars$J
|
|
5279
5279
|
});
|
|
5280
5280
|
|
|
5281
5281
|
const createCssVarImageClass = ({ componentName, varName, fallbackVarName }) => {
|
|
@@ -5328,69 +5328,69 @@ const createCssVarImageClass = ({ componentName, varName, fallbackVarName }) =>
|
|
|
5328
5328
|
return CssVarImageClass;
|
|
5329
5329
|
};
|
|
5330
5330
|
|
|
5331
|
-
const componentName$
|
|
5331
|
+
const componentName$Q = getComponentName('logo');
|
|
5332
5332
|
|
|
5333
5333
|
const LogoClass = createCssVarImageClass({
|
|
5334
|
-
componentName: componentName$
|
|
5334
|
+
componentName: componentName$Q,
|
|
5335
5335
|
varName: 'url',
|
|
5336
5336
|
fallbackVarName: 'fallbackUrl',
|
|
5337
5337
|
});
|
|
5338
5338
|
|
|
5339
|
-
const vars$
|
|
5339
|
+
const vars$I = LogoClass.cssVarList;
|
|
5340
5340
|
|
|
5341
5341
|
const logo$2 = {
|
|
5342
|
-
[vars$
|
|
5342
|
+
[vars$I.fallbackUrl]: 'url(https://imgs.descope.com/components/no-logo-placeholder.svg)',
|
|
5343
5343
|
};
|
|
5344
5344
|
|
|
5345
5345
|
var logo$3 = /*#__PURE__*/Object.freeze({
|
|
5346
5346
|
__proto__: null,
|
|
5347
5347
|
default: logo$2,
|
|
5348
|
-
vars: vars$
|
|
5348
|
+
vars: vars$I
|
|
5349
5349
|
});
|
|
5350
5350
|
|
|
5351
|
-
const componentName$
|
|
5351
|
+
const componentName$P = getComponentName('totp-image');
|
|
5352
5352
|
|
|
5353
5353
|
const TotpImageClass = createCssVarImageClass({
|
|
5354
|
-
componentName: componentName$
|
|
5354
|
+
componentName: componentName$P,
|
|
5355
5355
|
varName: 'url',
|
|
5356
5356
|
fallbackVarName: 'fallbackUrl',
|
|
5357
5357
|
});
|
|
5358
5358
|
|
|
5359
|
-
const vars$
|
|
5359
|
+
const vars$H = TotpImageClass.cssVarList;
|
|
5360
5360
|
|
|
5361
5361
|
const logo$1 = {
|
|
5362
|
-
[vars$
|
|
5362
|
+
[vars$H.fallbackUrl]: 'url(https://imgs.descope.com/components/totp-placeholder.svg)',
|
|
5363
5363
|
};
|
|
5364
5364
|
|
|
5365
5365
|
var totpImage = /*#__PURE__*/Object.freeze({
|
|
5366
5366
|
__proto__: null,
|
|
5367
5367
|
default: logo$1,
|
|
5368
|
-
vars: vars$
|
|
5368
|
+
vars: vars$H
|
|
5369
5369
|
});
|
|
5370
5370
|
|
|
5371
|
-
const componentName$
|
|
5371
|
+
const componentName$O = getComponentName('notp-image');
|
|
5372
5372
|
|
|
5373
5373
|
const NotpImageClass = createCssVarImageClass({
|
|
5374
|
-
componentName: componentName$
|
|
5374
|
+
componentName: componentName$O,
|
|
5375
5375
|
varName: 'url',
|
|
5376
5376
|
fallbackVarName: 'fallbackUrl',
|
|
5377
5377
|
});
|
|
5378
5378
|
|
|
5379
|
-
const vars$
|
|
5379
|
+
const vars$G = NotpImageClass.cssVarList;
|
|
5380
5380
|
|
|
5381
5381
|
const logo = {
|
|
5382
|
-
[vars$
|
|
5382
|
+
[vars$G.fallbackUrl]: 'url(https://imgs.descope.com/components/notp-placeholder.svg)',
|
|
5383
5383
|
};
|
|
5384
5384
|
|
|
5385
5385
|
var notpImage = /*#__PURE__*/Object.freeze({
|
|
5386
5386
|
__proto__: null,
|
|
5387
5387
|
default: logo,
|
|
5388
|
-
vars: vars$
|
|
5388
|
+
vars: vars$G
|
|
5389
5389
|
});
|
|
5390
5390
|
|
|
5391
|
-
const componentName$
|
|
5391
|
+
const componentName$N = getComponentName('text');
|
|
5392
5392
|
|
|
5393
|
-
class RawText extends createBaseClass({ componentName: componentName$
|
|
5393
|
+
class RawText extends createBaseClass({ componentName: componentName$N, baseSelector: ':host > slot' }) {
|
|
5394
5394
|
constructor() {
|
|
5395
5395
|
super();
|
|
5396
5396
|
|
|
@@ -5448,94 +5448,94 @@ const TextClass = compose(
|
|
|
5448
5448
|
)(RawText);
|
|
5449
5449
|
|
|
5450
5450
|
const globalRefs$s = getThemeRefs(globals);
|
|
5451
|
-
const vars$
|
|
5451
|
+
const vars$F = TextClass.cssVarList;
|
|
5452
5452
|
|
|
5453
5453
|
const text$2 = {
|
|
5454
|
-
[vars$
|
|
5455
|
-
[vars$
|
|
5456
|
-
[vars$
|
|
5457
|
-
[vars$
|
|
5454
|
+
[vars$F.hostDirection]: globalRefs$s.direction,
|
|
5455
|
+
[vars$F.textLineHeight]: '1.35em',
|
|
5456
|
+
[vars$F.textAlign]: 'left',
|
|
5457
|
+
[vars$F.textColor]: globalRefs$s.colors.surface.dark,
|
|
5458
5458
|
|
|
5459
5459
|
variant: {
|
|
5460
5460
|
h1: {
|
|
5461
|
-
[vars$
|
|
5462
|
-
[vars$
|
|
5463
|
-
[vars$
|
|
5461
|
+
[vars$F.fontSize]: globalRefs$s.typography.h1.size,
|
|
5462
|
+
[vars$F.fontWeight]: globalRefs$s.typography.h1.weight,
|
|
5463
|
+
[vars$F.fontFamily]: globalRefs$s.typography.h1.font,
|
|
5464
5464
|
},
|
|
5465
5465
|
h2: {
|
|
5466
|
-
[vars$
|
|
5467
|
-
[vars$
|
|
5468
|
-
[vars$
|
|
5466
|
+
[vars$F.fontSize]: globalRefs$s.typography.h2.size,
|
|
5467
|
+
[vars$F.fontWeight]: globalRefs$s.typography.h2.weight,
|
|
5468
|
+
[vars$F.fontFamily]: globalRefs$s.typography.h2.font,
|
|
5469
5469
|
},
|
|
5470
5470
|
h3: {
|
|
5471
|
-
[vars$
|
|
5472
|
-
[vars$
|
|
5473
|
-
[vars$
|
|
5471
|
+
[vars$F.fontSize]: globalRefs$s.typography.h3.size,
|
|
5472
|
+
[vars$F.fontWeight]: globalRefs$s.typography.h3.weight,
|
|
5473
|
+
[vars$F.fontFamily]: globalRefs$s.typography.h3.font,
|
|
5474
5474
|
},
|
|
5475
5475
|
subtitle1: {
|
|
5476
|
-
[vars$
|
|
5477
|
-
[vars$
|
|
5478
|
-
[vars$
|
|
5476
|
+
[vars$F.fontSize]: globalRefs$s.typography.subtitle1.size,
|
|
5477
|
+
[vars$F.fontWeight]: globalRefs$s.typography.subtitle1.weight,
|
|
5478
|
+
[vars$F.fontFamily]: globalRefs$s.typography.subtitle1.font,
|
|
5479
5479
|
},
|
|
5480
5480
|
subtitle2: {
|
|
5481
|
-
[vars$
|
|
5482
|
-
[vars$
|
|
5483
|
-
[vars$
|
|
5481
|
+
[vars$F.fontSize]: globalRefs$s.typography.subtitle2.size,
|
|
5482
|
+
[vars$F.fontWeight]: globalRefs$s.typography.subtitle2.weight,
|
|
5483
|
+
[vars$F.fontFamily]: globalRefs$s.typography.subtitle2.font,
|
|
5484
5484
|
},
|
|
5485
5485
|
body1: {
|
|
5486
|
-
[vars$
|
|
5487
|
-
[vars$
|
|
5488
|
-
[vars$
|
|
5486
|
+
[vars$F.fontSize]: globalRefs$s.typography.body1.size,
|
|
5487
|
+
[vars$F.fontWeight]: globalRefs$s.typography.body1.weight,
|
|
5488
|
+
[vars$F.fontFamily]: globalRefs$s.typography.body1.font,
|
|
5489
5489
|
},
|
|
5490
5490
|
body2: {
|
|
5491
|
-
[vars$
|
|
5492
|
-
[vars$
|
|
5493
|
-
[vars$
|
|
5491
|
+
[vars$F.fontSize]: globalRefs$s.typography.body2.size,
|
|
5492
|
+
[vars$F.fontWeight]: globalRefs$s.typography.body2.weight,
|
|
5493
|
+
[vars$F.fontFamily]: globalRefs$s.typography.body2.font,
|
|
5494
5494
|
},
|
|
5495
5495
|
},
|
|
5496
5496
|
|
|
5497
5497
|
mode: {
|
|
5498
5498
|
primary: {
|
|
5499
|
-
[vars$
|
|
5499
|
+
[vars$F.textColor]: globalRefs$s.colors.surface.contrast,
|
|
5500
5500
|
},
|
|
5501
5501
|
secondary: {
|
|
5502
|
-
[vars$
|
|
5502
|
+
[vars$F.textColor]: globalRefs$s.colors.surface.dark,
|
|
5503
5503
|
},
|
|
5504
5504
|
error: {
|
|
5505
|
-
[vars$
|
|
5505
|
+
[vars$F.textColor]: globalRefs$s.colors.error.main,
|
|
5506
5506
|
},
|
|
5507
5507
|
success: {
|
|
5508
|
-
[vars$
|
|
5508
|
+
[vars$F.textColor]: globalRefs$s.colors.success.main,
|
|
5509
5509
|
},
|
|
5510
5510
|
},
|
|
5511
5511
|
|
|
5512
5512
|
textAlign: {
|
|
5513
|
-
right: { [vars$
|
|
5514
|
-
left: { [vars$
|
|
5515
|
-
center: { [vars$
|
|
5513
|
+
right: { [vars$F.textAlign]: 'right' },
|
|
5514
|
+
left: { [vars$F.textAlign]: 'left' },
|
|
5515
|
+
center: { [vars$F.textAlign]: 'center' },
|
|
5516
5516
|
},
|
|
5517
5517
|
|
|
5518
5518
|
_fullWidth: {
|
|
5519
|
-
[vars$
|
|
5519
|
+
[vars$F.hostWidth]: '100%',
|
|
5520
5520
|
},
|
|
5521
5521
|
|
|
5522
5522
|
_italic: {
|
|
5523
|
-
[vars$
|
|
5523
|
+
[vars$F.fontStyle]: 'italic',
|
|
5524
5524
|
},
|
|
5525
5525
|
|
|
5526
5526
|
_uppercase: {
|
|
5527
|
-
[vars$
|
|
5527
|
+
[vars$F.textTransform]: 'uppercase',
|
|
5528
5528
|
},
|
|
5529
5529
|
|
|
5530
5530
|
_lowercase: {
|
|
5531
|
-
[vars$
|
|
5531
|
+
[vars$F.textTransform]: 'lowercase',
|
|
5532
5532
|
},
|
|
5533
5533
|
};
|
|
5534
5534
|
|
|
5535
5535
|
var text$3 = /*#__PURE__*/Object.freeze({
|
|
5536
5536
|
__proto__: null,
|
|
5537
5537
|
default: text$2,
|
|
5538
|
-
vars: vars$
|
|
5538
|
+
vars: vars$F
|
|
5539
5539
|
});
|
|
5540
5540
|
|
|
5541
5541
|
const disableRules = [
|
|
@@ -5562,9 +5562,9 @@ const decodeHTML = (html) => {
|
|
|
5562
5562
|
/* eslint-disable no-param-reassign */
|
|
5563
5563
|
|
|
5564
5564
|
|
|
5565
|
-
const componentName$
|
|
5565
|
+
const componentName$M = getComponentName('enriched-text');
|
|
5566
5566
|
|
|
5567
|
-
class EnrichedText extends createBaseClass({ componentName: componentName$
|
|
5567
|
+
class EnrichedText extends createBaseClass({ componentName: componentName$M, baseSelector: ':host > div' }) {
|
|
5568
5568
|
#origLinkRenderer;
|
|
5569
5569
|
|
|
5570
5570
|
#origEmRenderer;
|
|
@@ -5760,9 +5760,9 @@ const EnrichedTextClass = compose(
|
|
|
5760
5760
|
componentNameValidationMixin
|
|
5761
5761
|
)(EnrichedText);
|
|
5762
5762
|
|
|
5763
|
-
const componentName$
|
|
5763
|
+
const componentName$L = getComponentName('link');
|
|
5764
5764
|
|
|
5765
|
-
class RawLink extends createBaseClass({ componentName: componentName$
|
|
5765
|
+
class RawLink extends createBaseClass({ componentName: componentName$L, baseSelector: ':host a' }) {
|
|
5766
5766
|
constructor() {
|
|
5767
5767
|
super();
|
|
5768
5768
|
|
|
@@ -5827,37 +5827,37 @@ const LinkClass = compose(
|
|
|
5827
5827
|
)(RawLink);
|
|
5828
5828
|
|
|
5829
5829
|
const globalRefs$r = getThemeRefs(globals);
|
|
5830
|
-
const vars$
|
|
5830
|
+
const vars$E = LinkClass.cssVarList;
|
|
5831
5831
|
|
|
5832
5832
|
const link$1 = {
|
|
5833
|
-
[vars$
|
|
5834
|
-
[vars$
|
|
5833
|
+
[vars$E.hostDirection]: globalRefs$r.direction,
|
|
5834
|
+
[vars$E.cursor]: 'pointer',
|
|
5835
5835
|
|
|
5836
|
-
[vars$
|
|
5836
|
+
[vars$E.textColor]: globalRefs$r.colors.primary.main,
|
|
5837
5837
|
|
|
5838
5838
|
textAlign: {
|
|
5839
|
-
right: { [vars$
|
|
5840
|
-
left: { [vars$
|
|
5841
|
-
center: { [vars$
|
|
5839
|
+
right: { [vars$E.textAlign]: 'right' },
|
|
5840
|
+
left: { [vars$E.textAlign]: 'left' },
|
|
5841
|
+
center: { [vars$E.textAlign]: 'center' },
|
|
5842
5842
|
},
|
|
5843
5843
|
|
|
5844
5844
|
_fullWidth: {
|
|
5845
|
-
[vars$
|
|
5845
|
+
[vars$E.hostWidth]: '100%',
|
|
5846
5846
|
},
|
|
5847
5847
|
|
|
5848
5848
|
_hover: {
|
|
5849
|
-
[vars$
|
|
5849
|
+
[vars$E.textDecoration]: 'underline',
|
|
5850
5850
|
},
|
|
5851
5851
|
|
|
5852
5852
|
mode: {
|
|
5853
5853
|
secondary: {
|
|
5854
|
-
[vars$
|
|
5854
|
+
[vars$E.textColor]: globalRefs$r.colors.secondary.main,
|
|
5855
5855
|
},
|
|
5856
5856
|
error: {
|
|
5857
|
-
[vars$
|
|
5857
|
+
[vars$E.textColor]: globalRefs$r.colors.error.main,
|
|
5858
5858
|
},
|
|
5859
5859
|
success: {
|
|
5860
|
-
[vars$
|
|
5860
|
+
[vars$E.textColor]: globalRefs$r.colors.success.main,
|
|
5861
5861
|
},
|
|
5862
5862
|
},
|
|
5863
5863
|
};
|
|
@@ -5865,37 +5865,37 @@ const link$1 = {
|
|
|
5865
5865
|
var link$2 = /*#__PURE__*/Object.freeze({
|
|
5866
5866
|
__proto__: null,
|
|
5867
5867
|
default: link$1,
|
|
5868
|
-
vars: vars$
|
|
5868
|
+
vars: vars$E
|
|
5869
5869
|
});
|
|
5870
5870
|
|
|
5871
5871
|
const globalRefs$q = getThemeRefs(globals);
|
|
5872
|
-
const vars$
|
|
5872
|
+
const vars$D = EnrichedTextClass.cssVarList;
|
|
5873
5873
|
|
|
5874
5874
|
const enrichedText = {
|
|
5875
|
-
[vars$
|
|
5876
|
-
[vars$
|
|
5875
|
+
[vars$D.hostDirection]: globalRefs$q.direction,
|
|
5876
|
+
[vars$D.hostWidth]: useVar(vars$F.hostWidth),
|
|
5877
5877
|
|
|
5878
|
-
[vars$
|
|
5879
|
-
[vars$
|
|
5880
|
-
[vars$
|
|
5878
|
+
[vars$D.textLineHeight]: useVar(vars$F.textLineHeight),
|
|
5879
|
+
[vars$D.textColor]: useVar(vars$F.textColor),
|
|
5880
|
+
[vars$D.textAlign]: useVar(vars$F.textAlign),
|
|
5881
5881
|
|
|
5882
|
-
[vars$
|
|
5883
|
-
[vars$
|
|
5884
|
-
[vars$
|
|
5882
|
+
[vars$D.fontSize]: useVar(vars$F.fontSize),
|
|
5883
|
+
[vars$D.fontWeight]: useVar(vars$F.fontWeight),
|
|
5884
|
+
[vars$D.fontFamily]: useVar(vars$F.fontFamily),
|
|
5885
5885
|
|
|
5886
|
-
[vars$
|
|
5887
|
-
[vars$
|
|
5888
|
-
[vars$
|
|
5886
|
+
[vars$D.linkColor]: useVar(vars$E.textColor),
|
|
5887
|
+
[vars$D.linkTextDecoration]: 'none',
|
|
5888
|
+
[vars$D.linkHoverTextDecoration]: 'underline',
|
|
5889
5889
|
|
|
5890
|
-
[vars$
|
|
5891
|
-
[vars$
|
|
5892
|
-
[vars$
|
|
5890
|
+
[vars$D.fontWeightBold]: '900',
|
|
5891
|
+
[vars$D.minWidth]: '0.25em',
|
|
5892
|
+
[vars$D.minHeight]: '1.35em',
|
|
5893
5893
|
|
|
5894
|
-
[vars$
|
|
5894
|
+
[vars$D.hostDisplay]: 'inline-block',
|
|
5895
5895
|
|
|
5896
5896
|
_empty: {
|
|
5897
5897
|
_hideWhenEmpty: {
|
|
5898
|
-
[vars$
|
|
5898
|
+
[vars$D.hostDisplay]: 'none',
|
|
5899
5899
|
},
|
|
5900
5900
|
},
|
|
5901
5901
|
};
|
|
@@ -5903,11 +5903,11 @@ const enrichedText = {
|
|
|
5903
5903
|
var enrichedText$1 = /*#__PURE__*/Object.freeze({
|
|
5904
5904
|
__proto__: null,
|
|
5905
5905
|
default: enrichedText,
|
|
5906
|
-
vars: vars$
|
|
5906
|
+
vars: vars$D
|
|
5907
5907
|
});
|
|
5908
5908
|
|
|
5909
|
-
const componentName$
|
|
5910
|
-
class RawDivider extends createBaseClass({ componentName: componentName$
|
|
5909
|
+
const componentName$K = getComponentName('divider');
|
|
5910
|
+
class RawDivider extends createBaseClass({ componentName: componentName$K, baseSelector: ':host > div' }) {
|
|
5911
5911
|
constructor() {
|
|
5912
5912
|
super();
|
|
5913
5913
|
|
|
@@ -6014,7 +6014,7 @@ const [helperTheme$2, helperRefs$2, helperVars$2] = createHelperVars(
|
|
|
6014
6014
|
thickness: '2px',
|
|
6015
6015
|
spacing: '10px',
|
|
6016
6016
|
},
|
|
6017
|
-
componentName$
|
|
6017
|
+
componentName$K
|
|
6018
6018
|
);
|
|
6019
6019
|
|
|
6020
6020
|
const divider = {
|
|
@@ -6045,7 +6045,7 @@ const divider = {
|
|
|
6045
6045
|
},
|
|
6046
6046
|
};
|
|
6047
6047
|
|
|
6048
|
-
const vars$
|
|
6048
|
+
const vars$C = {
|
|
6049
6049
|
...compVars$4,
|
|
6050
6050
|
...helperVars$2,
|
|
6051
6051
|
};
|
|
@@ -6053,18 +6053,18 @@ const vars$B = {
|
|
|
6053
6053
|
var divider$1 = /*#__PURE__*/Object.freeze({
|
|
6054
6054
|
__proto__: null,
|
|
6055
6055
|
default: divider,
|
|
6056
|
-
vars: vars$
|
|
6056
|
+
vars: vars$C
|
|
6057
6057
|
});
|
|
6058
6058
|
|
|
6059
6059
|
/* eslint-disable no-param-reassign */
|
|
6060
6060
|
|
|
6061
|
-
const componentName$
|
|
6061
|
+
const componentName$J = getComponentName('passcode-internal');
|
|
6062
6062
|
|
|
6063
|
-
createBaseInputClass({ componentName: componentName$
|
|
6063
|
+
createBaseInputClass({ componentName: componentName$J, baseSelector: 'div' });
|
|
6064
6064
|
|
|
6065
|
-
const componentName$
|
|
6065
|
+
const componentName$I = getComponentName('loader-radial');
|
|
6066
6066
|
|
|
6067
|
-
class RawLoaderRadial extends createBaseClass({ componentName: componentName$
|
|
6067
|
+
class RawLoaderRadial extends createBaseClass({ componentName: componentName$I, baseSelector: ':host > div' }) {
|
|
6068
6068
|
constructor() {
|
|
6069
6069
|
super();
|
|
6070
6070
|
|
|
@@ -6108,7 +6108,7 @@ const LoaderRadialClass = compose(
|
|
|
6108
6108
|
componentNameValidationMixin
|
|
6109
6109
|
)(RawLoaderRadial);
|
|
6110
6110
|
|
|
6111
|
-
const componentName$
|
|
6111
|
+
const componentName$H = getComponentName('passcode');
|
|
6112
6112
|
|
|
6113
6113
|
const observedAttributes$3 = ['digits'];
|
|
6114
6114
|
|
|
@@ -6127,17 +6127,17 @@ const customMixin$9 = (superclass) =>
|
|
|
6127
6127
|
const template = document.createElement('template');
|
|
6128
6128
|
|
|
6129
6129
|
template.innerHTML = `
|
|
6130
|
-
<${componentName$
|
|
6130
|
+
<${componentName$J}
|
|
6131
6131
|
bordered="true"
|
|
6132
6132
|
name="code"
|
|
6133
6133
|
tabindex="-1"
|
|
6134
6134
|
slot="input"
|
|
6135
|
-
><slot></slot></${componentName$
|
|
6135
|
+
><slot></slot></${componentName$J}>
|
|
6136
6136
|
`;
|
|
6137
6137
|
|
|
6138
6138
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
|
6139
6139
|
|
|
6140
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
|
6140
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$J);
|
|
6141
6141
|
|
|
6142
6142
|
forwardAttrs(this, this.inputElement, { includeAttrs: ['digits', 'size', 'loading'] });
|
|
6143
6143
|
}
|
|
@@ -6289,56 +6289,56 @@ const PasscodeClass = compose(
|
|
|
6289
6289
|
${resetInputCursor('vaadin-text-field')}
|
|
6290
6290
|
`,
|
|
6291
6291
|
excludeAttrsSync: ['tabindex'],
|
|
6292
|
-
componentName: componentName$
|
|
6292
|
+
componentName: componentName$H,
|
|
6293
6293
|
})
|
|
6294
6294
|
);
|
|
6295
6295
|
|
|
6296
|
-
const vars$
|
|
6296
|
+
const vars$B = PasscodeClass.cssVarList;
|
|
6297
6297
|
|
|
6298
6298
|
const passcode = {
|
|
6299
|
-
[vars$
|
|
6300
|
-
[vars$
|
|
6301
|
-
[vars$
|
|
6302
|
-
[vars$
|
|
6303
|
-
[vars$
|
|
6304
|
-
[vars$
|
|
6305
|
-
[vars$
|
|
6306
|
-
[vars$
|
|
6307
|
-
[vars$
|
|
6308
|
-
[vars$
|
|
6309
|
-
[vars$
|
|
6310
|
-
[vars$
|
|
6311
|
-
[vars$
|
|
6312
|
-
[vars$
|
|
6313
|
-
[vars$
|
|
6299
|
+
[vars$B.hostDirection]: refs.direction,
|
|
6300
|
+
[vars$B.fontFamily]: refs.fontFamily,
|
|
6301
|
+
[vars$B.fontSize]: refs.fontSize,
|
|
6302
|
+
[vars$B.labelTextColor]: refs.labelTextColor,
|
|
6303
|
+
[vars$B.labelRequiredIndicator]: refs.requiredIndicator,
|
|
6304
|
+
[vars$B.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
6305
|
+
[vars$B.digitValueTextColor]: refs.valueTextColor,
|
|
6306
|
+
[vars$B.digitPadding]: '0',
|
|
6307
|
+
[vars$B.digitTextAlign]: 'center',
|
|
6308
|
+
[vars$B.digitSpacing]: '4px',
|
|
6309
|
+
[vars$B.hostWidth]: refs.width,
|
|
6310
|
+
[vars$B.digitOutlineColor]: 'transparent',
|
|
6311
|
+
[vars$B.digitOutlineWidth]: refs.outlineWidth,
|
|
6312
|
+
[vars$B.focusedDigitFieldOutlineColor]: refs.outlineColor,
|
|
6313
|
+
[vars$B.digitSize]: refs.inputHeight,
|
|
6314
6314
|
|
|
6315
6315
|
size: {
|
|
6316
|
-
xs: { [vars$
|
|
6317
|
-
sm: { [vars$
|
|
6318
|
-
md: { [vars$
|
|
6319
|
-
lg: { [vars$
|
|
6316
|
+
xs: { [vars$B.spinnerSize]: '15px' },
|
|
6317
|
+
sm: { [vars$B.spinnerSize]: '20px' },
|
|
6318
|
+
md: { [vars$B.spinnerSize]: '20px' },
|
|
6319
|
+
lg: { [vars$B.spinnerSize]: '20px' },
|
|
6320
6320
|
},
|
|
6321
6321
|
|
|
6322
6322
|
_hideCursor: {
|
|
6323
|
-
[vars$
|
|
6323
|
+
[vars$B.digitCaretTextColor]: 'transparent',
|
|
6324
6324
|
},
|
|
6325
6325
|
|
|
6326
6326
|
_loading: {
|
|
6327
|
-
[vars$
|
|
6327
|
+
[vars$B.overlayOpacity]: refs.overlayOpacity,
|
|
6328
6328
|
},
|
|
6329
6329
|
};
|
|
6330
6330
|
|
|
6331
6331
|
var passcode$1 = /*#__PURE__*/Object.freeze({
|
|
6332
6332
|
__proto__: null,
|
|
6333
6333
|
default: passcode,
|
|
6334
|
-
vars: vars$
|
|
6334
|
+
vars: vars$B
|
|
6335
6335
|
});
|
|
6336
6336
|
|
|
6337
|
-
const componentName$
|
|
6337
|
+
const componentName$G = getComponentName('loader-linear');
|
|
6338
6338
|
|
|
6339
|
-
class RawLoaderLinear extends createBaseClass({ componentName: componentName$
|
|
6339
|
+
class RawLoaderLinear extends createBaseClass({ componentName: componentName$G, baseSelector: ':host > div' }) {
|
|
6340
6340
|
static get componentName() {
|
|
6341
|
-
return componentName$
|
|
6341
|
+
return componentName$G;
|
|
6342
6342
|
}
|
|
6343
6343
|
|
|
6344
6344
|
constructor() {
|
|
@@ -6400,48 +6400,48 @@ const LoaderLinearClass = compose(
|
|
|
6400
6400
|
)(RawLoaderLinear);
|
|
6401
6401
|
|
|
6402
6402
|
const globalRefs$o = getThemeRefs(globals);
|
|
6403
|
-
const vars$
|
|
6403
|
+
const vars$A = LoaderLinearClass.cssVarList;
|
|
6404
6404
|
|
|
6405
6405
|
const loaderLinear = {
|
|
6406
|
-
[vars$
|
|
6407
|
-
[vars$
|
|
6406
|
+
[vars$A.hostDisplay]: 'inline-block',
|
|
6407
|
+
[vars$A.hostWidth]: '100%',
|
|
6408
6408
|
|
|
6409
|
-
[vars$
|
|
6410
|
-
[vars$
|
|
6409
|
+
[vars$A.barColor]: globalRefs$o.colors.surface.contrast,
|
|
6410
|
+
[vars$A.barWidth]: '20%',
|
|
6411
6411
|
|
|
6412
|
-
[vars$
|
|
6413
|
-
[vars$
|
|
6412
|
+
[vars$A.barBackgroundColor]: globalRefs$o.colors.surface.light,
|
|
6413
|
+
[vars$A.barBorderRadius]: '4px',
|
|
6414
6414
|
|
|
6415
|
-
[vars$
|
|
6416
|
-
[vars$
|
|
6417
|
-
[vars$
|
|
6418
|
-
[vars$
|
|
6415
|
+
[vars$A.animationDuration]: '2s',
|
|
6416
|
+
[vars$A.animationTimingFunction]: 'linear',
|
|
6417
|
+
[vars$A.animationIterationCount]: 'infinite',
|
|
6418
|
+
[vars$A.verticalPadding]: '0.25em',
|
|
6419
6419
|
|
|
6420
6420
|
size: {
|
|
6421
|
-
xs: { [vars$
|
|
6422
|
-
sm: { [vars$
|
|
6423
|
-
md: { [vars$
|
|
6424
|
-
lg: { [vars$
|
|
6421
|
+
xs: { [vars$A.barHeight]: '2px' },
|
|
6422
|
+
sm: { [vars$A.barHeight]: '4px' },
|
|
6423
|
+
md: { [vars$A.barHeight]: '6px' },
|
|
6424
|
+
lg: { [vars$A.barHeight]: '8px' },
|
|
6425
6425
|
},
|
|
6426
6426
|
|
|
6427
6427
|
mode: {
|
|
6428
6428
|
primary: {
|
|
6429
|
-
[vars$
|
|
6429
|
+
[vars$A.barColor]: globalRefs$o.colors.primary.main,
|
|
6430
6430
|
},
|
|
6431
6431
|
secondary: {
|
|
6432
|
-
[vars$
|
|
6432
|
+
[vars$A.barColor]: globalRefs$o.colors.secondary.main,
|
|
6433
6433
|
},
|
|
6434
6434
|
},
|
|
6435
6435
|
|
|
6436
6436
|
_hidden: {
|
|
6437
|
-
[vars$
|
|
6437
|
+
[vars$A.hostDisplay]: 'none',
|
|
6438
6438
|
},
|
|
6439
6439
|
};
|
|
6440
6440
|
|
|
6441
6441
|
var loaderLinear$1 = /*#__PURE__*/Object.freeze({
|
|
6442
6442
|
__proto__: null,
|
|
6443
6443
|
default: loaderLinear,
|
|
6444
|
-
vars: vars$
|
|
6444
|
+
vars: vars$A
|
|
6445
6445
|
});
|
|
6446
6446
|
|
|
6447
6447
|
const globalRefs$n = getThemeRefs(globals);
|
|
@@ -6459,7 +6459,7 @@ const [helperTheme$1, helperRefs$1, helperVars$1] = createHelperVars(
|
|
|
6459
6459
|
},
|
|
6460
6460
|
},
|
|
6461
6461
|
},
|
|
6462
|
-
componentName$
|
|
6462
|
+
componentName$I
|
|
6463
6463
|
);
|
|
6464
6464
|
|
|
6465
6465
|
const loaderRadial = {
|
|
@@ -6488,7 +6488,7 @@ const loaderRadial = {
|
|
|
6488
6488
|
[compVars$3.hostDisplay]: 'none',
|
|
6489
6489
|
},
|
|
6490
6490
|
};
|
|
6491
|
-
const vars$
|
|
6491
|
+
const vars$z = {
|
|
6492
6492
|
...compVars$3,
|
|
6493
6493
|
...helperVars$1,
|
|
6494
6494
|
};
|
|
@@ -6496,10 +6496,10 @@ const vars$y = {
|
|
|
6496
6496
|
var loaderRadial$1 = /*#__PURE__*/Object.freeze({
|
|
6497
6497
|
__proto__: null,
|
|
6498
6498
|
default: loaderRadial,
|
|
6499
|
-
vars: vars$
|
|
6499
|
+
vars: vars$z
|
|
6500
6500
|
});
|
|
6501
6501
|
|
|
6502
|
-
const componentName$
|
|
6502
|
+
const componentName$F = getComponentName('combo-box');
|
|
6503
6503
|
|
|
6504
6504
|
const ComboBoxMixin = (superclass) =>
|
|
6505
6505
|
class ComboBoxMixinClass extends superclass {
|
|
@@ -6944,86 +6944,86 @@ const ComboBoxClass = compose(
|
|
|
6944
6944
|
// and reset items to an empty array, and opening the list box with no items
|
|
6945
6945
|
// to display.
|
|
6946
6946
|
excludeAttrsSync: ['tabindex', 'size', 'data'],
|
|
6947
|
-
componentName: componentName$
|
|
6947
|
+
componentName: componentName$F,
|
|
6948
6948
|
includeForwardProps: ['items', 'renderer', 'selectedItem'],
|
|
6949
6949
|
})
|
|
6950
6950
|
);
|
|
6951
6951
|
|
|
6952
6952
|
const globalRefs$m = getThemeRefs(globals);
|
|
6953
|
-
const vars$
|
|
6953
|
+
const vars$y = ComboBoxClass.cssVarList;
|
|
6954
6954
|
|
|
6955
6955
|
const comboBox = {
|
|
6956
|
-
[vars$
|
|
6957
|
-
[vars$
|
|
6958
|
-
[vars$
|
|
6959
|
-
[vars$
|
|
6960
|
-
[vars$
|
|
6961
|
-
[vars$
|
|
6962
|
-
[vars$
|
|
6963
|
-
[vars$
|
|
6964
|
-
[vars$
|
|
6965
|
-
[vars$
|
|
6966
|
-
[vars$
|
|
6967
|
-
[vars$
|
|
6968
|
-
[vars$
|
|
6969
|
-
[vars$
|
|
6970
|
-
[vars$
|
|
6971
|
-
[vars$
|
|
6972
|
-
[vars$
|
|
6973
|
-
[vars$
|
|
6974
|
-
[vars$
|
|
6975
|
-
[vars$
|
|
6976
|
-
[vars$
|
|
6977
|
-
[vars$
|
|
6978
|
-
[vars$
|
|
6979
|
-
[vars$
|
|
6980
|
-
[vars$
|
|
6981
|
-
[vars$
|
|
6982
|
-
[vars$
|
|
6983
|
-
[vars$
|
|
6984
|
-
[vars$
|
|
6985
|
-
[vars$
|
|
6986
|
-
[vars$
|
|
6987
|
-
[vars$
|
|
6988
|
-
[vars$
|
|
6989
|
-
[vars$
|
|
6990
|
-
[vars$
|
|
6991
|
-
[vars$
|
|
6992
|
-
[vars$
|
|
6993
|
-
[vars$
|
|
6956
|
+
[vars$y.hostWidth]: refs.width,
|
|
6957
|
+
[vars$y.hostDirection]: refs.direction,
|
|
6958
|
+
[vars$y.fontSize]: refs.fontSize,
|
|
6959
|
+
[vars$y.fontFamily]: refs.fontFamily,
|
|
6960
|
+
[vars$y.labelFontSize]: refs.labelFontSize,
|
|
6961
|
+
[vars$y.labelFontWeight]: refs.labelFontWeight,
|
|
6962
|
+
[vars$y.labelTextColor]: refs.labelTextColor,
|
|
6963
|
+
[vars$y.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
6964
|
+
[vars$y.inputBorderColor]: refs.borderColor,
|
|
6965
|
+
[vars$y.inputBorderWidth]: refs.borderWidth,
|
|
6966
|
+
[vars$y.inputBorderStyle]: refs.borderStyle,
|
|
6967
|
+
[vars$y.inputBorderRadius]: refs.borderRadius,
|
|
6968
|
+
[vars$y.inputOutlineColor]: refs.outlineColor,
|
|
6969
|
+
[vars$y.inputOutlineOffset]: refs.outlineOffset,
|
|
6970
|
+
[vars$y.inputOutlineWidth]: refs.outlineWidth,
|
|
6971
|
+
[vars$y.inputOutlineStyle]: refs.outlineStyle,
|
|
6972
|
+
[vars$y.labelRequiredIndicator]: refs.requiredIndicator,
|
|
6973
|
+
[vars$y.inputValueTextColor]: refs.valueTextColor,
|
|
6974
|
+
[vars$y.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
|
6975
|
+
[vars$y.inputBackgroundColor]: refs.backgroundColor,
|
|
6976
|
+
[vars$y.inputHorizontalPadding]: refs.horizontalPadding,
|
|
6977
|
+
[vars$y.inputHeight]: refs.inputHeight,
|
|
6978
|
+
[vars$y.inputDropdownButtonColor]: globalRefs$m.colors.surface.dark,
|
|
6979
|
+
[vars$y.inputDropdownButtonCursor]: 'pointer',
|
|
6980
|
+
[vars$y.inputDropdownButtonSize]: refs.toggleButtonSize,
|
|
6981
|
+
[vars$y.inputDropdownButtonOffset]: globalRefs$m.spacing.xs,
|
|
6982
|
+
[vars$y.overlayItemPaddingInlineStart]: globalRefs$m.spacing.xs,
|
|
6983
|
+
[vars$y.overlayItemPaddingInlineEnd]: globalRefs$m.spacing.lg,
|
|
6984
|
+
[vars$y.labelPosition]: refs.labelPosition,
|
|
6985
|
+
[vars$y.labelTopPosition]: refs.labelTopPosition,
|
|
6986
|
+
[vars$y.labelHorizontalPosition]: refs.labelHorizontalPosition,
|
|
6987
|
+
[vars$y.inputTransformY]: refs.inputTransformY,
|
|
6988
|
+
[vars$y.inputTransition]: refs.inputTransition,
|
|
6989
|
+
[vars$y.marginInlineStart]: refs.marginInlineStart,
|
|
6990
|
+
[vars$y.placeholderOpacity]: refs.placeholderOpacity,
|
|
6991
|
+
[vars$y.inputVerticalAlignment]: refs.inputVerticalAlignment,
|
|
6992
|
+
[vars$y.valueInputHeight]: refs.valueInputHeight,
|
|
6993
|
+
[vars$y.valueInputMarginBottom]: refs.valueInputMarginBottom,
|
|
6994
6994
|
|
|
6995
6995
|
_readonly: {
|
|
6996
|
-
[vars$
|
|
6996
|
+
[vars$y.inputDropdownButtonCursor]: 'default',
|
|
6997
6997
|
},
|
|
6998
6998
|
|
|
6999
6999
|
// Overlay theme exposed via the component:
|
|
7000
|
-
[vars$
|
|
7001
|
-
[vars$
|
|
7002
|
-
[vars$
|
|
7003
|
-
[vars$
|
|
7004
|
-
[vars$
|
|
7005
|
-
[vars$
|
|
7000
|
+
[vars$y.overlayFontSize]: refs.fontSize,
|
|
7001
|
+
[vars$y.overlayFontFamily]: refs.fontFamily,
|
|
7002
|
+
[vars$y.overlayCursor]: 'pointer',
|
|
7003
|
+
[vars$y.overlayItemBoxShadow]: 'none',
|
|
7004
|
+
[vars$y.overlayBackground]: refs.backgroundColor,
|
|
7005
|
+
[vars$y.overlayTextColor]: refs.valueTextColor,
|
|
7006
7006
|
|
|
7007
7007
|
// Overlay direct theme:
|
|
7008
|
-
[vars$
|
|
7009
|
-
[vars$
|
|
7008
|
+
[vars$y.overlay.minHeight]: '400px',
|
|
7009
|
+
[vars$y.overlay.margin]: '0',
|
|
7010
7010
|
};
|
|
7011
7011
|
|
|
7012
7012
|
var comboBox$1 = /*#__PURE__*/Object.freeze({
|
|
7013
7013
|
__proto__: null,
|
|
7014
7014
|
comboBox: comboBox,
|
|
7015
7015
|
default: comboBox,
|
|
7016
|
-
vars: vars$
|
|
7016
|
+
vars: vars$y
|
|
7017
7017
|
});
|
|
7018
7018
|
|
|
7019
7019
|
const observedAttributes$2 = ['src', 'alt'];
|
|
7020
7020
|
|
|
7021
|
-
const componentName$
|
|
7021
|
+
const componentName$E = getComponentName('image');
|
|
7022
7022
|
|
|
7023
|
-
const BaseClass$
|
|
7024
|
-
class RawImage extends BaseClass$
|
|
7023
|
+
const BaseClass$2 = createBaseClass({ componentName: componentName$E, baseSelector: ':host > img' });
|
|
7024
|
+
class RawImage extends BaseClass$2 {
|
|
7025
7025
|
static get observedAttributes() {
|
|
7026
|
-
return observedAttributes$2.concat(BaseClass$
|
|
7026
|
+
return observedAttributes$2.concat(BaseClass$2.observedAttributes || []);
|
|
7027
7027
|
}
|
|
7028
7028
|
|
|
7029
7029
|
constructor() {
|
|
@@ -7060,14 +7060,14 @@ const ImageClass = compose(
|
|
|
7060
7060
|
draggableMixin
|
|
7061
7061
|
)(RawImage);
|
|
7062
7062
|
|
|
7063
|
-
const vars$
|
|
7063
|
+
const vars$x = ImageClass.cssVarList;
|
|
7064
7064
|
|
|
7065
7065
|
const image = {};
|
|
7066
7066
|
|
|
7067
7067
|
var image$1 = /*#__PURE__*/Object.freeze({
|
|
7068
7068
|
__proto__: null,
|
|
7069
7069
|
default: image,
|
|
7070
|
-
vars: vars$
|
|
7070
|
+
vars: vars$x
|
|
7071
7071
|
});
|
|
7072
7072
|
|
|
7073
7073
|
var CountryCodes = [
|
|
@@ -8286,14 +8286,14 @@ var CountryCodes = [
|
|
|
8286
8286
|
].sort((a, b) => (a.name < b.name ? -1 : 1)),
|
|
8287
8287
|
];
|
|
8288
8288
|
|
|
8289
|
-
const componentName$
|
|
8289
|
+
const componentName$D = getComponentName('phone-field-internal');
|
|
8290
8290
|
|
|
8291
|
-
createBaseInputClass({ componentName: componentName$
|
|
8291
|
+
createBaseInputClass({ componentName: componentName$D, baseSelector: 'div' });
|
|
8292
8292
|
|
|
8293
8293
|
const textVars$2 = TextFieldClass.cssVarList;
|
|
8294
8294
|
const comboVars = ComboBoxClass.cssVarList;
|
|
8295
8295
|
|
|
8296
|
-
const componentName$
|
|
8296
|
+
const componentName$C = getComponentName('phone-field');
|
|
8297
8297
|
|
|
8298
8298
|
const customMixin$8 = (superclass) =>
|
|
8299
8299
|
class PhoneFieldMixinClass extends superclass {
|
|
@@ -8307,15 +8307,15 @@ const customMixin$8 = (superclass) =>
|
|
|
8307
8307
|
const template = document.createElement('template');
|
|
8308
8308
|
|
|
8309
8309
|
template.innerHTML = `
|
|
8310
|
-
<${componentName$
|
|
8310
|
+
<${componentName$D}
|
|
8311
8311
|
tabindex="-1"
|
|
8312
8312
|
slot="input"
|
|
8313
|
-
></${componentName$
|
|
8313
|
+
></${componentName$D}>
|
|
8314
8314
|
`;
|
|
8315
8315
|
|
|
8316
8316
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
|
8317
8317
|
|
|
8318
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
|
8318
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$D);
|
|
8319
8319
|
|
|
8320
8320
|
forwardAttrs(this.shadowRoot.host, this.inputElement, {
|
|
8321
8321
|
includeAttrs: [
|
|
@@ -8333,9 +8333,28 @@ const customMixin$8 = (superclass) =>
|
|
|
8333
8333
|
'readonly',
|
|
8334
8334
|
'label',
|
|
8335
8335
|
'label-type',
|
|
8336
|
+
'allow-alphanumeric-input',
|
|
8336
8337
|
],
|
|
8337
8338
|
});
|
|
8338
8339
|
}
|
|
8340
|
+
|
|
8341
|
+
get countryCodeItems() {
|
|
8342
|
+
return this.inputElement?.countryCodeValue;
|
|
8343
|
+
}
|
|
8344
|
+
|
|
8345
|
+
get phoneNumberInputEle() {
|
|
8346
|
+
return this.inputElement?.phoneNumberInputEle;
|
|
8347
|
+
}
|
|
8348
|
+
|
|
8349
|
+
get countryCodeInputData() {
|
|
8350
|
+
return this.inputElement?.countryCodeInputData;
|
|
8351
|
+
}
|
|
8352
|
+
|
|
8353
|
+
get countryCodes() {
|
|
8354
|
+
return Array.from(this.inputElement.countryCodeInputData).map((ele) =>
|
|
8355
|
+
ele.getAttribute('data-country-code')
|
|
8356
|
+
);
|
|
8357
|
+
}
|
|
8339
8358
|
};
|
|
8340
8359
|
|
|
8341
8360
|
const {
|
|
@@ -8343,6 +8362,7 @@ const {
|
|
|
8343
8362
|
label: label$4,
|
|
8344
8363
|
requiredIndicator: requiredIndicator$4,
|
|
8345
8364
|
inputField: inputField$2,
|
|
8365
|
+
internalAfter,
|
|
8346
8366
|
countryCodeInput,
|
|
8347
8367
|
phoneInput: phoneInput$1,
|
|
8348
8368
|
separator: separator$1,
|
|
@@ -8353,6 +8373,7 @@ const {
|
|
|
8353
8373
|
label: { selector: '::part(label)' },
|
|
8354
8374
|
requiredIndicator: { selector: '[required]::part(required-indicator)::after' },
|
|
8355
8375
|
inputField: { selector: '::part(input-field)' },
|
|
8376
|
+
internalAfter: { selector: 'descope-phone-field-internal::after' },
|
|
8356
8377
|
phoneInput: { selector: () => 'descope-text-field' },
|
|
8357
8378
|
countryCodeInput: { selector: () => 'descope-combo-box' },
|
|
8358
8379
|
separator: { selector: 'descope-phone-field-internal .separator' },
|
|
@@ -8392,18 +8413,21 @@ const PhoneFieldClass = compose(
|
|
|
8392
8413
|
hostDirection: { ...host$d, property: 'direction' },
|
|
8393
8414
|
|
|
8394
8415
|
inputBorderStyle: [
|
|
8395
|
-
{ ...
|
|
8416
|
+
{ ...internalAfter, property: 'outline-style' },
|
|
8396
8417
|
{ ...separator$1, property: 'border-left-style' },
|
|
8397
8418
|
],
|
|
8398
8419
|
inputBorderWidth: [
|
|
8399
|
-
{ ...
|
|
8420
|
+
{ ...internalAfter, property: 'outline-width' },
|
|
8400
8421
|
{ ...separator$1, property: 'border-left-width' },
|
|
8401
8422
|
],
|
|
8402
8423
|
inputBorderColor: [
|
|
8403
|
-
{ ...
|
|
8424
|
+
{ ...internalAfter, property: 'outline-color' },
|
|
8404
8425
|
{ ...separator$1, property: 'border-left-color' },
|
|
8405
8426
|
],
|
|
8406
|
-
inputBorderRadius:
|
|
8427
|
+
inputBorderRadius: [
|
|
8428
|
+
{ ...inputField$2, property: 'border-radius' },
|
|
8429
|
+
{ ...internalAfter, property: 'border-radius' },
|
|
8430
|
+
],
|
|
8407
8431
|
|
|
8408
8432
|
countryCodeInputWidth: { ...countryCodeInput, property: comboVars.hostWidth },
|
|
8409
8433
|
countryCodeDropdownWidth: {
|
|
@@ -8485,6 +8509,10 @@ const PhoneFieldClass = compose(
|
|
|
8485
8509
|
vaadin-text-field::before {
|
|
8486
8510
|
height: 0;
|
|
8487
8511
|
}
|
|
8512
|
+
vaadin-text-field::part(label) {
|
|
8513
|
+
margin-left: 0;
|
|
8514
|
+
margin-right: 0;
|
|
8515
|
+
}
|
|
8488
8516
|
vaadin-text-field::part(input-field) {
|
|
8489
8517
|
padding: 0;
|
|
8490
8518
|
background: transparent;
|
|
@@ -8496,7 +8524,19 @@ const PhoneFieldClass = compose(
|
|
|
8496
8524
|
width: 100%;
|
|
8497
8525
|
height: 100%;
|
|
8498
8526
|
direction: ltr;
|
|
8527
|
+
position: relative;
|
|
8499
8528
|
}
|
|
8529
|
+
descope-phone-field-internal::after {
|
|
8530
|
+
content: '';
|
|
8531
|
+
position: absolute;
|
|
8532
|
+
width: 100%;
|
|
8533
|
+
height: 100%;
|
|
8534
|
+
top: 0;
|
|
8535
|
+
left: 0;
|
|
8536
|
+
box-sizing: border-box;
|
|
8537
|
+
outline-offset: calc(var(${PhoneFieldClass.cssVarList.inputBorderWidth}) * -1);
|
|
8538
|
+
pointer-events: none;
|
|
8539
|
+
}
|
|
8500
8540
|
descope-phone-field-internal > div {
|
|
8501
8541
|
width: 100%;
|
|
8502
8542
|
height: 100%;
|
|
@@ -8507,7 +8547,7 @@ const PhoneFieldClass = compose(
|
|
|
8507
8547
|
}
|
|
8508
8548
|
descope-combo-box {
|
|
8509
8549
|
flex-shrink: 0;
|
|
8510
|
-
|
|
8550
|
+
min-width: 5.75em;
|
|
8511
8551
|
${comboVars.inputOutlineWidth}: 0;
|
|
8512
8552
|
${comboVars.inputOutlineOffset}: 0;
|
|
8513
8553
|
${comboVars.inputBorderWidth}: 0;
|
|
@@ -8537,36 +8577,36 @@ const PhoneFieldClass = compose(
|
|
|
8537
8577
|
${resetInputLabelPosition('vaadin-text-field')}
|
|
8538
8578
|
`,
|
|
8539
8579
|
excludeAttrsSync: ['tabindex'],
|
|
8540
|
-
componentName: componentName$
|
|
8580
|
+
componentName: componentName$C,
|
|
8541
8581
|
})
|
|
8542
8582
|
);
|
|
8543
8583
|
|
|
8544
|
-
const vars$
|
|
8584
|
+
const vars$w = PhoneFieldClass.cssVarList;
|
|
8545
8585
|
|
|
8546
8586
|
const phoneField = {
|
|
8547
|
-
[vars$
|
|
8548
|
-
[vars$
|
|
8549
|
-
[vars$
|
|
8550
|
-
[vars$
|
|
8551
|
-
[vars$
|
|
8552
|
-
[vars$
|
|
8553
|
-
[vars$
|
|
8554
|
-
[vars$
|
|
8555
|
-
[vars$
|
|
8556
|
-
[vars$
|
|
8557
|
-
[vars$
|
|
8558
|
-
[vars$
|
|
8559
|
-
[vars$
|
|
8560
|
-
[vars$
|
|
8561
|
-
[vars$
|
|
8562
|
-
[vars$
|
|
8563
|
-
[vars$
|
|
8564
|
-
[vars$
|
|
8565
|
-
[vars$
|
|
8566
|
-
[vars$
|
|
8567
|
-
[vars$
|
|
8568
|
-
[vars$
|
|
8569
|
-
[vars$
|
|
8587
|
+
[vars$w.hostWidth]: refs.width,
|
|
8588
|
+
[vars$w.hostDirection]: refs.direction,
|
|
8589
|
+
[vars$w.fontSize]: refs.fontSize,
|
|
8590
|
+
[vars$w.fontFamily]: refs.fontFamily,
|
|
8591
|
+
[vars$w.labelTextColor]: refs.labelTextColor,
|
|
8592
|
+
[vars$w.labelRequiredIndicator]: refs.requiredIndicator,
|
|
8593
|
+
[vars$w.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
8594
|
+
[vars$w.inputValueTextColor]: refs.valueTextColor,
|
|
8595
|
+
[vars$w.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
|
8596
|
+
[vars$w.inputBorderStyle]: refs.borderStyle,
|
|
8597
|
+
[vars$w.inputBorderWidth]: refs.borderWidth,
|
|
8598
|
+
[vars$w.inputBorderColor]: refs.borderColor,
|
|
8599
|
+
[vars$w.inputBorderRadius]: refs.borderRadius,
|
|
8600
|
+
[vars$w.inputOutlineStyle]: refs.outlineStyle,
|
|
8601
|
+
[vars$w.inputOutlineWidth]: refs.outlineWidth,
|
|
8602
|
+
[vars$w.inputOutlineColor]: refs.outlineColor,
|
|
8603
|
+
[vars$w.inputOutlineOffset]: refs.outlineOffset,
|
|
8604
|
+
[vars$w.phoneInputWidth]: refs.minWidth,
|
|
8605
|
+
[vars$w.countryCodeInputWidth]: '5em',
|
|
8606
|
+
[vars$w.countryCodeDropdownWidth]: '20em',
|
|
8607
|
+
[vars$w.marginInlineStart]: '-0.25em',
|
|
8608
|
+
[vars$w.valueInputHeight]: refs.valueInputHeight,
|
|
8609
|
+
[vars$w.valueInputMarginBottom]: refs.valueInputMarginBottom,
|
|
8570
8610
|
|
|
8571
8611
|
// '@overlay': {
|
|
8572
8612
|
// overlayItemBackgroundColor: 'red'
|
|
@@ -8576,16 +8616,16 @@ const phoneField = {
|
|
|
8576
8616
|
var phoneField$1 = /*#__PURE__*/Object.freeze({
|
|
8577
8617
|
__proto__: null,
|
|
8578
8618
|
default: phoneField,
|
|
8579
|
-
vars: vars$
|
|
8619
|
+
vars: vars$w
|
|
8580
8620
|
});
|
|
8581
8621
|
|
|
8582
|
-
const componentName$
|
|
8622
|
+
const componentName$B = getComponentName('phone-field-internal-input-box');
|
|
8583
8623
|
|
|
8584
|
-
createBaseInputClass({ componentName: componentName$
|
|
8624
|
+
createBaseInputClass({ componentName: componentName$B, baseSelector: 'div' });
|
|
8585
8625
|
|
|
8586
8626
|
const textVars$1 = TextFieldClass.cssVarList;
|
|
8587
8627
|
|
|
8588
|
-
const componentName$
|
|
8628
|
+
const componentName$A = getComponentName('phone-input-box-field');
|
|
8589
8629
|
|
|
8590
8630
|
const customMixin$7 = (superclass) =>
|
|
8591
8631
|
class PhoneInputBoxFieldMixinClass extends superclass {
|
|
@@ -8599,15 +8639,15 @@ const customMixin$7 = (superclass) =>
|
|
|
8599
8639
|
const template = document.createElement('template');
|
|
8600
8640
|
|
|
8601
8641
|
template.innerHTML = `
|
|
8602
|
-
<${componentName$
|
|
8642
|
+
<${componentName$B}
|
|
8603
8643
|
tabindex="-1"
|
|
8604
8644
|
slot="input"
|
|
8605
|
-
></${componentName$
|
|
8645
|
+
></${componentName$B}>
|
|
8606
8646
|
`;
|
|
8607
8647
|
|
|
8608
8648
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
|
8609
8649
|
|
|
8610
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
|
8650
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$B);
|
|
8611
8651
|
|
|
8612
8652
|
forwardAttrs(this.shadowRoot.host, this.inputElement, {
|
|
8613
8653
|
includeAttrs: [
|
|
@@ -8621,9 +8661,14 @@ const customMixin$7 = (superclass) =>
|
|
|
8621
8661
|
'phone-input-placeholder',
|
|
8622
8662
|
'label',
|
|
8623
8663
|
'label-type',
|
|
8664
|
+
'allow-alphanumeric-input',
|
|
8624
8665
|
],
|
|
8625
8666
|
});
|
|
8626
8667
|
}
|
|
8668
|
+
|
|
8669
|
+
get phoneNumberInputEle() {
|
|
8670
|
+
return this.inputElement?.phoneNumberInputEle;
|
|
8671
|
+
}
|
|
8627
8672
|
};
|
|
8628
8673
|
|
|
8629
8674
|
const {
|
|
@@ -8632,6 +8677,7 @@ const {
|
|
|
8632
8677
|
inputElement: inputElement$1,
|
|
8633
8678
|
requiredIndicator: requiredIndicator$3,
|
|
8634
8679
|
inputField: inputField$1,
|
|
8680
|
+
inputFieldInternal,
|
|
8635
8681
|
phoneInput,
|
|
8636
8682
|
errorMessage: errorMessage$4,
|
|
8637
8683
|
helperText: helperText$3,
|
|
@@ -8641,7 +8687,10 @@ const {
|
|
|
8641
8687
|
placeholder: { selector: '> input:placeholder-shown' },
|
|
8642
8688
|
inputElement: { selector: 'input' },
|
|
8643
8689
|
requiredIndicator: { selector: '[required]::part(required-indicator)::after' },
|
|
8644
|
-
inputField: { selector: '::part(input-field)' },
|
|
8690
|
+
inputField: { selector: () => 'vaadin-text-field::part(input-field)' },
|
|
8691
|
+
inputFieldInternal: {
|
|
8692
|
+
selector: () => 'descope-phone-field-internal-input-box vaadin-text-field::part(input-field)',
|
|
8693
|
+
},
|
|
8645
8694
|
phoneInput: { selector: () => 'descope-text-field' },
|
|
8646
8695
|
helperText: { selector: '::part(helper-text)' },
|
|
8647
8696
|
errorMessage: { selector: '::part(error-message)' },
|
|
@@ -8663,10 +8712,13 @@ const PhoneFieldInputBoxClass = compose(
|
|
|
8663
8712
|
hostMinWidth: { ...host$c, property: 'min-width' },
|
|
8664
8713
|
hostDirection: { ...host$c, property: 'direction' },
|
|
8665
8714
|
|
|
8666
|
-
inputBorderStyle: { ...
|
|
8667
|
-
inputBorderWidth: { ...
|
|
8668
|
-
inputBorderColor: { ...
|
|
8669
|
-
inputBorderRadius:
|
|
8715
|
+
inputBorderStyle: { ...inputFieldInternal, property: 'border-style' },
|
|
8716
|
+
inputBorderWidth: { ...inputFieldInternal, property: 'border-width' },
|
|
8717
|
+
inputBorderColor: { ...inputFieldInternal, property: 'border-color' },
|
|
8718
|
+
inputBorderRadius: [
|
|
8719
|
+
{ ...inputField$1, property: 'border-radius' },
|
|
8720
|
+
{ ...inputFieldInternal, property: 'border-radius' },
|
|
8721
|
+
],
|
|
8670
8722
|
|
|
8671
8723
|
inputHorizontalPadding: [
|
|
8672
8724
|
{ ...phoneInput, property: 'padding-left' },
|
|
@@ -8727,7 +8779,6 @@ const PhoneFieldInputBoxClass = compose(
|
|
|
8727
8779
|
|
|
8728
8780
|
vaadin-text-field {
|
|
8729
8781
|
width: 100%;
|
|
8730
|
-
height: 100%;
|
|
8731
8782
|
box-sizing: border-box;
|
|
8732
8783
|
padding: 0;
|
|
8733
8784
|
}
|
|
@@ -8747,23 +8798,21 @@ const PhoneFieldInputBoxClass = compose(
|
|
|
8747
8798
|
-webkit-mask-image: none;
|
|
8748
8799
|
padding: 0;
|
|
8749
8800
|
width: 100%;
|
|
8750
|
-
height: 100%;
|
|
8751
8801
|
}
|
|
8752
8802
|
descope-phone-field-internal-input-box > div {
|
|
8753
8803
|
width: 100%;
|
|
8754
|
-
height: 100%;
|
|
8755
8804
|
}
|
|
8756
8805
|
descope-phone-field-internal-input-box .separator {
|
|
8757
8806
|
flex: 0;
|
|
8758
8807
|
border: none;
|
|
8759
8808
|
}
|
|
8809
|
+
descope-phone-field-internal-input-box descope-text-field {
|
|
8810
|
+
${textVars$1.inputOutlineWidth}: 0;
|
|
8811
|
+
${textVars$1.inputOutlineOffset}: 0;
|
|
8812
|
+
}
|
|
8760
8813
|
descope-text-field {
|
|
8761
8814
|
flex-grow: 1;
|
|
8762
8815
|
width: 100%;
|
|
8763
|
-
${textVars$1.inputOutlineWidth}: 0;
|
|
8764
|
-
${textVars$1.inputOutlineOffset}: 0;
|
|
8765
|
-
${textVars$1.inputBorderWidth}: 0;
|
|
8766
|
-
${textVars$1.inputBorderRadius}: 0;
|
|
8767
8816
|
direction: ltr;
|
|
8768
8817
|
}
|
|
8769
8818
|
vaadin-text-field[readonly] > input:placeholder-shown {
|
|
@@ -8784,68 +8833,68 @@ const PhoneFieldInputBoxClass = compose(
|
|
|
8784
8833
|
${inputFloatingLabelStyle()}
|
|
8785
8834
|
`,
|
|
8786
8835
|
excludeAttrsSync: ['tabindex'],
|
|
8787
|
-
componentName: componentName$
|
|
8836
|
+
componentName: componentName$A,
|
|
8788
8837
|
})
|
|
8789
8838
|
);
|
|
8790
8839
|
|
|
8791
|
-
const vars$
|
|
8840
|
+
const vars$v = PhoneFieldInputBoxClass.cssVarList;
|
|
8792
8841
|
|
|
8793
8842
|
const phoneInputBoxField = {
|
|
8794
|
-
[vars$
|
|
8795
|
-
[vars$
|
|
8796
|
-
[vars$
|
|
8797
|
-
[vars$
|
|
8798
|
-
[vars$
|
|
8799
|
-
[vars$
|
|
8800
|
-
[vars$
|
|
8801
|
-
[vars$
|
|
8802
|
-
[vars$
|
|
8803
|
-
[vars$
|
|
8804
|
-
[vars$
|
|
8805
|
-
[vars$
|
|
8806
|
-
[vars$
|
|
8807
|
-
[vars$
|
|
8808
|
-
[vars$
|
|
8809
|
-
[vars$
|
|
8810
|
-
[vars$
|
|
8811
|
-
[vars$
|
|
8812
|
-
[vars$
|
|
8813
|
-
[vars$
|
|
8814
|
-
[vars$
|
|
8815
|
-
[vars$
|
|
8816
|
-
[vars$
|
|
8817
|
-
[vars$
|
|
8818
|
-
[vars$
|
|
8819
|
-
[vars$
|
|
8820
|
-
[vars$
|
|
8821
|
-
[vars$
|
|
8822
|
-
[vars$
|
|
8843
|
+
[vars$v.hostWidth]: '16em',
|
|
8844
|
+
[vars$v.hostMinWidth]: refs.minWidth,
|
|
8845
|
+
[vars$v.hostDirection]: refs.direction,
|
|
8846
|
+
[vars$v.fontSize]: refs.fontSize,
|
|
8847
|
+
[vars$v.fontFamily]: refs.fontFamily,
|
|
8848
|
+
[vars$v.labelFontSize]: refs.labelFontSize,
|
|
8849
|
+
[vars$v.labelFontWeight]: refs.labelFontWeight,
|
|
8850
|
+
[vars$v.labelTextColor]: refs.labelTextColor,
|
|
8851
|
+
[vars$v.labelRequiredIndicator]: refs.requiredIndicator,
|
|
8852
|
+
[vars$v.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
8853
|
+
[vars$v.inputValueTextColor]: refs.valueTextColor,
|
|
8854
|
+
[vars$v.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
|
8855
|
+
[vars$v.inputBorderStyle]: refs.borderStyle,
|
|
8856
|
+
[vars$v.inputBorderWidth]: refs.borderWidth,
|
|
8857
|
+
[vars$v.inputBorderColor]: refs.borderColor,
|
|
8858
|
+
[vars$v.inputBorderRadius]: refs.borderRadius,
|
|
8859
|
+
[vars$v.inputOutlineStyle]: refs.outlineStyle,
|
|
8860
|
+
[vars$v.inputOutlineWidth]: refs.outlineWidth,
|
|
8861
|
+
[vars$v.inputOutlineColor]: refs.outlineColor,
|
|
8862
|
+
[vars$v.inputOutlineOffset]: refs.outlineOffset,
|
|
8863
|
+
[vars$v.labelPosition]: refs.labelPosition,
|
|
8864
|
+
[vars$v.labelTopPosition]: refs.labelTopPosition,
|
|
8865
|
+
[vars$v.labelHorizontalPosition]: refs.labelHorizontalPosition,
|
|
8866
|
+
[vars$v.inputTransformY]: refs.inputTransformY,
|
|
8867
|
+
[vars$v.inputTransition]: refs.inputTransition,
|
|
8868
|
+
[vars$v.marginInlineStart]: refs.marginInlineStart,
|
|
8869
|
+
[vars$v.valueInputHeight]: refs.valueInputHeight,
|
|
8870
|
+
[vars$v.valueInputMarginBottom]: refs.valueInputMarginBottom,
|
|
8871
|
+
[vars$v.inputHorizontalPadding]: '0',
|
|
8823
8872
|
|
|
8824
8873
|
_fullWidth: {
|
|
8825
|
-
[vars$
|
|
8874
|
+
[vars$v.hostWidth]: refs.width,
|
|
8826
8875
|
},
|
|
8827
8876
|
};
|
|
8828
8877
|
|
|
8829
8878
|
var phoneInputBoxField$1 = /*#__PURE__*/Object.freeze({
|
|
8830
8879
|
__proto__: null,
|
|
8831
8880
|
default: phoneInputBoxField,
|
|
8832
|
-
vars: vars$
|
|
8881
|
+
vars: vars$v
|
|
8833
8882
|
});
|
|
8834
8883
|
|
|
8835
|
-
const componentName$
|
|
8884
|
+
const componentName$z = getComponentName('new-password-internal');
|
|
8836
8885
|
|
|
8837
8886
|
const interpolateString = (template, values) =>
|
|
8838
8887
|
template.replace(/{{(\w+)+}}/g, (match, key) => values?.[key] || match);
|
|
8839
8888
|
|
|
8840
8889
|
// eslint-disable-next-line max-classes-per-file
|
|
8841
8890
|
|
|
8842
|
-
const componentName$
|
|
8891
|
+
const componentName$y = getComponentName('policy-validation');
|
|
8843
8892
|
|
|
8844
8893
|
const overrideAttrs = ['data-password-policy-value-minlength'];
|
|
8845
8894
|
const dataAttrs = ['data', 'active-policies', 'overrides', ...overrideAttrs];
|
|
8846
8895
|
const policyAttrs = ['label', 'value', ...dataAttrs];
|
|
8847
8896
|
|
|
8848
|
-
class RawPolicyValidation extends createBaseClass({ componentName: componentName$
|
|
8897
|
+
class RawPolicyValidation extends createBaseClass({ componentName: componentName$y, baseSelector: ':host > div' }) {
|
|
8849
8898
|
#availablePolicies;
|
|
8850
8899
|
|
|
8851
8900
|
#activePolicies = [];
|
|
@@ -9053,7 +9102,7 @@ const PolicyValidationClass = compose(
|
|
|
9053
9102
|
componentNameValidationMixin
|
|
9054
9103
|
)(RawPolicyValidation);
|
|
9055
9104
|
|
|
9056
|
-
const componentName$
|
|
9105
|
+
const componentName$x = getComponentName('new-password');
|
|
9057
9106
|
|
|
9058
9107
|
const policyPreviewVars = PolicyValidationClass.cssVarList;
|
|
9059
9108
|
|
|
@@ -9067,18 +9116,18 @@ const customMixin$6 = (superclass) =>
|
|
|
9067
9116
|
const externalInputAttr = this.getAttribute('external-input');
|
|
9068
9117
|
|
|
9069
9118
|
template.innerHTML = `
|
|
9070
|
-
<${componentName$
|
|
9119
|
+
<${componentName$z}
|
|
9071
9120
|
name="new-password"
|
|
9072
9121
|
tabindex="-1"
|
|
9073
9122
|
slot="input"
|
|
9074
9123
|
external-input="${externalInputAttr}"
|
|
9075
9124
|
>
|
|
9076
|
-
</${componentName$
|
|
9125
|
+
</${componentName$z}>
|
|
9077
9126
|
`;
|
|
9078
9127
|
|
|
9079
9128
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
|
9080
9129
|
|
|
9081
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
|
9130
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$z);
|
|
9082
9131
|
|
|
9083
9132
|
if (this.getAttribute('external-input') === 'true') {
|
|
9084
9133
|
this.initExternalInput();
|
|
@@ -9255,40 +9304,40 @@ const NewPasswordClass = compose(
|
|
|
9255
9304
|
}
|
|
9256
9305
|
`,
|
|
9257
9306
|
excludeAttrsSync: ['tabindex'],
|
|
9258
|
-
componentName: componentName$
|
|
9307
|
+
componentName: componentName$x,
|
|
9259
9308
|
})
|
|
9260
9309
|
);
|
|
9261
9310
|
|
|
9262
9311
|
const globalRefs$l = getThemeRefs(globals);
|
|
9263
|
-
const vars$
|
|
9312
|
+
const vars$u = NewPasswordClass.cssVarList;
|
|
9264
9313
|
|
|
9265
9314
|
const newPassword = {
|
|
9266
|
-
[vars$
|
|
9267
|
-
[vars$
|
|
9268
|
-
[vars$
|
|
9269
|
-
[vars$
|
|
9270
|
-
[vars$
|
|
9271
|
-
[vars$
|
|
9272
|
-
[vars$
|
|
9273
|
-
[vars$
|
|
9274
|
-
[vars$
|
|
9275
|
-
[vars$
|
|
9276
|
-
[vars$
|
|
9277
|
-
[vars$
|
|
9278
|
-
[vars$
|
|
9315
|
+
[vars$u.hostWidth]: refs.width,
|
|
9316
|
+
[vars$u.hostMinWidth]: refs.minWidth,
|
|
9317
|
+
[vars$u.hostDirection]: refs.direction,
|
|
9318
|
+
[vars$u.fontSize]: refs.fontSize,
|
|
9319
|
+
[vars$u.fontFamily]: refs.fontFamily,
|
|
9320
|
+
[vars$u.labelFontSize]: refs.labelFontSize,
|
|
9321
|
+
[vars$u.labelFontWeight]: refs.labelFontWeight,
|
|
9322
|
+
[vars$u.labelTextColor]: refs.labelTextColor,
|
|
9323
|
+
[vars$u.spaceBetweenInputs]: '1em',
|
|
9324
|
+
[vars$u.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
9325
|
+
[vars$u.policyPreviewBackgroundColor]: 'none',
|
|
9326
|
+
[vars$u.policyPreviewPadding]: globalRefs$l.spacing.lg,
|
|
9327
|
+
[vars$u.valueInputHeight]: refs.valueInputHeight,
|
|
9279
9328
|
|
|
9280
9329
|
_required: {
|
|
9281
9330
|
// NewPassword doesn't pass `required` attribute to its Password components.
|
|
9282
9331
|
// That's why we fake the required indicator on each input.
|
|
9283
9332
|
// We do that by injecting `::after` element, and populating it with requiredIndicator content.
|
|
9284
|
-
[vars$
|
|
9333
|
+
[vars$u.inputsRequiredIndicator]: refs.requiredIndicator, // used to populate required content for NewPassword input fields outside the theme
|
|
9285
9334
|
},
|
|
9286
9335
|
};
|
|
9287
9336
|
|
|
9288
9337
|
var newPassword$1 = /*#__PURE__*/Object.freeze({
|
|
9289
9338
|
__proto__: null,
|
|
9290
9339
|
default: newPassword,
|
|
9291
|
-
vars: vars$
|
|
9340
|
+
vars: vars$u
|
|
9292
9341
|
});
|
|
9293
9342
|
|
|
9294
9343
|
const getFileBase64 = (fileObj) => {
|
|
@@ -9303,7 +9352,7 @@ const getFilename = (fileObj) => {
|
|
|
9303
9352
|
return fileObj.name.replace(/^.*\\/, '');
|
|
9304
9353
|
};
|
|
9305
9354
|
|
|
9306
|
-
const componentName$
|
|
9355
|
+
const componentName$w = getComponentName('upload-file');
|
|
9307
9356
|
|
|
9308
9357
|
const observedAttributes$1 = [
|
|
9309
9358
|
'title',
|
|
@@ -9318,7 +9367,7 @@ const observedAttributes$1 = [
|
|
|
9318
9367
|
'icon',
|
|
9319
9368
|
];
|
|
9320
9369
|
|
|
9321
|
-
const BaseInputClass$2 = createBaseInputClass({ componentName: componentName$
|
|
9370
|
+
const BaseInputClass$2 = createBaseInputClass({ componentName: componentName$w, baseSelector: ':host > div' });
|
|
9322
9371
|
|
|
9323
9372
|
class RawUploadFile extends BaseInputClass$2 {
|
|
9324
9373
|
static get observedAttributes() {
|
|
@@ -9533,77 +9582,77 @@ const UploadFileClass = compose(
|
|
|
9533
9582
|
componentNameValidationMixin
|
|
9534
9583
|
)(RawUploadFile);
|
|
9535
9584
|
|
|
9536
|
-
const vars$
|
|
9585
|
+
const vars$t = UploadFileClass.cssVarList;
|
|
9537
9586
|
|
|
9538
9587
|
const uploadFile = {
|
|
9539
|
-
[vars$
|
|
9540
|
-
[vars$
|
|
9541
|
-
[vars$
|
|
9588
|
+
[vars$t.hostDirection]: refs.direction,
|
|
9589
|
+
[vars$t.labelTextColor]: refs.labelTextColor,
|
|
9590
|
+
[vars$t.fontFamily]: refs.fontFamily,
|
|
9542
9591
|
|
|
9543
|
-
[vars$
|
|
9592
|
+
[vars$t.iconSize]: '2em',
|
|
9544
9593
|
|
|
9545
|
-
[vars$
|
|
9546
|
-
[vars$
|
|
9594
|
+
[vars$t.hostPadding]: '0.75em',
|
|
9595
|
+
[vars$t.gap]: '0.5em',
|
|
9547
9596
|
|
|
9548
|
-
[vars$
|
|
9549
|
-
[vars$
|
|
9550
|
-
[vars$
|
|
9597
|
+
[vars$t.fontSize]: '16px',
|
|
9598
|
+
[vars$t.titleFontWeight]: '500',
|
|
9599
|
+
[vars$t.lineHeight]: '1em',
|
|
9551
9600
|
|
|
9552
|
-
[vars$
|
|
9553
|
-
[vars$
|
|
9554
|
-
[vars$
|
|
9555
|
-
[vars$
|
|
9601
|
+
[vars$t.borderWidth]: refs.borderWidth,
|
|
9602
|
+
[vars$t.borderColor]: refs.borderColor,
|
|
9603
|
+
[vars$t.borderRadius]: refs.borderRadius,
|
|
9604
|
+
[vars$t.borderStyle]: 'dashed',
|
|
9556
9605
|
|
|
9557
9606
|
_required: {
|
|
9558
|
-
[vars$
|
|
9607
|
+
[vars$t.requiredIndicator]: refs.requiredIndicator,
|
|
9559
9608
|
},
|
|
9560
9609
|
|
|
9561
9610
|
size: {
|
|
9562
9611
|
xs: {
|
|
9563
|
-
[vars$
|
|
9564
|
-
[vars$
|
|
9565
|
-
[vars$
|
|
9566
|
-
[vars$
|
|
9567
|
-
[vars$
|
|
9612
|
+
[vars$t.hostHeight]: '196px',
|
|
9613
|
+
[vars$t.hostWidth]: '200px',
|
|
9614
|
+
[vars$t.titleFontSize]: '0.875em',
|
|
9615
|
+
[vars$t.descriptionFontSize]: '0.875em',
|
|
9616
|
+
[vars$t.lineHeight]: '1.25em',
|
|
9568
9617
|
},
|
|
9569
9618
|
sm: {
|
|
9570
|
-
[vars$
|
|
9571
|
-
[vars$
|
|
9572
|
-
[vars$
|
|
9573
|
-
[vars$
|
|
9574
|
-
[vars$
|
|
9619
|
+
[vars$t.hostHeight]: '216px',
|
|
9620
|
+
[vars$t.hostWidth]: '230px',
|
|
9621
|
+
[vars$t.titleFontSize]: '1em',
|
|
9622
|
+
[vars$t.descriptionFontSize]: '0.875em',
|
|
9623
|
+
[vars$t.lineHeight]: '1.25em',
|
|
9575
9624
|
},
|
|
9576
9625
|
md: {
|
|
9577
|
-
[vars$
|
|
9578
|
-
[vars$
|
|
9579
|
-
[vars$
|
|
9580
|
-
[vars$
|
|
9581
|
-
[vars$
|
|
9626
|
+
[vars$t.hostHeight]: '256px',
|
|
9627
|
+
[vars$t.hostWidth]: '312px',
|
|
9628
|
+
[vars$t.titleFontSize]: '1.125em',
|
|
9629
|
+
[vars$t.descriptionFontSize]: '1em',
|
|
9630
|
+
[vars$t.lineHeight]: '1.5em',
|
|
9582
9631
|
},
|
|
9583
9632
|
lg: {
|
|
9584
|
-
[vars$
|
|
9585
|
-
[vars$
|
|
9586
|
-
[vars$
|
|
9587
|
-
[vars$
|
|
9588
|
-
[vars$
|
|
9633
|
+
[vars$t.hostHeight]: '280px',
|
|
9634
|
+
[vars$t.hostWidth]: '336px',
|
|
9635
|
+
[vars$t.titleFontSize]: '1.125em',
|
|
9636
|
+
[vars$t.descriptionFontSize]: '1.125em',
|
|
9637
|
+
[vars$t.lineHeight]: '1.75em',
|
|
9589
9638
|
},
|
|
9590
9639
|
},
|
|
9591
9640
|
|
|
9592
9641
|
_fullWidth: {
|
|
9593
|
-
[vars$
|
|
9642
|
+
[vars$t.hostWidth]: refs.width,
|
|
9594
9643
|
},
|
|
9595
9644
|
};
|
|
9596
9645
|
|
|
9597
9646
|
var uploadFile$1 = /*#__PURE__*/Object.freeze({
|
|
9598
9647
|
__proto__: null,
|
|
9599
9648
|
default: uploadFile,
|
|
9600
|
-
vars: vars$
|
|
9649
|
+
vars: vars$t
|
|
9601
9650
|
});
|
|
9602
9651
|
|
|
9603
|
-
const componentName$
|
|
9652
|
+
const componentName$v = getComponentName('button-selection-group-item');
|
|
9604
9653
|
|
|
9605
9654
|
class RawSelectItem extends createBaseClass({
|
|
9606
|
-
componentName: componentName$
|
|
9655
|
+
componentName: componentName$v,
|
|
9607
9656
|
baseSelector: ':host > descope-button',
|
|
9608
9657
|
}) {
|
|
9609
9658
|
get size() {
|
|
@@ -9712,37 +9761,37 @@ const ButtonSelectionGroupItemClass = compose(
|
|
|
9712
9761
|
|
|
9713
9762
|
const globalRefs$k = getThemeRefs(globals);
|
|
9714
9763
|
|
|
9715
|
-
const vars$
|
|
9764
|
+
const vars$s = ButtonSelectionGroupItemClass.cssVarList;
|
|
9716
9765
|
|
|
9717
9766
|
const buttonSelectionGroupItem = {
|
|
9718
|
-
[vars$
|
|
9719
|
-
[vars$
|
|
9720
|
-
[vars$
|
|
9721
|
-
[vars$
|
|
9722
|
-
[vars$
|
|
9723
|
-
[vars$
|
|
9724
|
-
[vars$
|
|
9725
|
-
[vars$
|
|
9767
|
+
[vars$s.hostDirection]: 'inherit',
|
|
9768
|
+
[vars$s.backgroundColor]: globalRefs$k.colors.surface.main,
|
|
9769
|
+
[vars$s.labelTextColor]: globalRefs$k.colors.surface.contrast,
|
|
9770
|
+
[vars$s.borderColor]: globalRefs$k.colors.surface.light,
|
|
9771
|
+
[vars$s.borderStyle]: 'solid',
|
|
9772
|
+
[vars$s.borderRadius]: globalRefs$k.radius.sm,
|
|
9773
|
+
[vars$s.outlineColor]: 'transparent',
|
|
9774
|
+
[vars$s.borderWidth]: globalRefs$k.border.xs,
|
|
9726
9775
|
|
|
9727
9776
|
_hover: {
|
|
9728
|
-
[vars$
|
|
9777
|
+
[vars$s.backgroundColor]: globalRefs$k.colors.surface.highlight,
|
|
9729
9778
|
},
|
|
9730
9779
|
|
|
9731
9780
|
_focused: {
|
|
9732
|
-
[vars$
|
|
9781
|
+
[vars$s.outlineColor]: globalRefs$k.colors.surface.light,
|
|
9733
9782
|
},
|
|
9734
9783
|
|
|
9735
9784
|
_selected: {
|
|
9736
|
-
[vars$
|
|
9737
|
-
[vars$
|
|
9738
|
-
[vars$
|
|
9785
|
+
[vars$s.borderColor]: globalRefs$k.colors.surface.contrast,
|
|
9786
|
+
[vars$s.backgroundColor]: globalRefs$k.colors.surface.contrast,
|
|
9787
|
+
[vars$s.labelTextColor]: globalRefs$k.colors.surface.main,
|
|
9739
9788
|
},
|
|
9740
9789
|
};
|
|
9741
9790
|
|
|
9742
9791
|
var buttonSelectionGroupItem$1 = /*#__PURE__*/Object.freeze({
|
|
9743
9792
|
__proto__: null,
|
|
9744
9793
|
default: buttonSelectionGroupItem,
|
|
9745
|
-
vars: vars$
|
|
9794
|
+
vars: vars$s
|
|
9746
9795
|
});
|
|
9747
9796
|
|
|
9748
9797
|
const createBaseButtonSelectionGroupInternalClass = (componentName) => {
|
|
@@ -9841,10 +9890,10 @@ const createBaseButtonSelectionGroupInternalClass = (componentName) => {
|
|
|
9841
9890
|
return BaseButtonSelectionGroupInternalClass;
|
|
9842
9891
|
};
|
|
9843
9892
|
|
|
9844
|
-
const componentName$
|
|
9893
|
+
const componentName$u = getComponentName('button-selection-group-internal');
|
|
9845
9894
|
|
|
9846
9895
|
class ButtonSelectionGroupInternalClass extends createBaseButtonSelectionGroupInternalClass(
|
|
9847
|
-
componentName$
|
|
9896
|
+
componentName$u
|
|
9848
9897
|
) {
|
|
9849
9898
|
getSelectedNode() {
|
|
9850
9899
|
return this.items.find((item) => item.hasAttribute('selected'));
|
|
@@ -10076,7 +10125,7 @@ const buttonSelectionGroupStyles = `
|
|
|
10076
10125
|
${resetInputCursor('vaadin-text-field')}
|
|
10077
10126
|
`;
|
|
10078
10127
|
|
|
10079
|
-
const componentName$
|
|
10128
|
+
const componentName$t = getComponentName('button-selection-group');
|
|
10080
10129
|
|
|
10081
10130
|
const buttonSelectionGroupMixin = (superclass) =>
|
|
10082
10131
|
class ButtonMultiSelectionGroupMixinClass extends superclass {
|
|
@@ -10085,19 +10134,19 @@ const buttonSelectionGroupMixin = (superclass) =>
|
|
|
10085
10134
|
const template = document.createElement('template');
|
|
10086
10135
|
|
|
10087
10136
|
template.innerHTML = `
|
|
10088
|
-
<${componentName$
|
|
10137
|
+
<${componentName$u}
|
|
10089
10138
|
name="button-selection-group"
|
|
10090
10139
|
slot="input"
|
|
10091
10140
|
tabindex="-1"
|
|
10092
10141
|
part="internal-component"
|
|
10093
10142
|
>
|
|
10094
10143
|
<slot></slot>
|
|
10095
|
-
</${componentName$
|
|
10144
|
+
</${componentName$u}>
|
|
10096
10145
|
`;
|
|
10097
10146
|
|
|
10098
10147
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
|
10099
10148
|
|
|
10100
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
|
10149
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$u);
|
|
10101
10150
|
|
|
10102
10151
|
forwardAttrs(this, this.inputElement, {
|
|
10103
10152
|
includeAttrs: ['size', 'default-value', 'allow-deselect'],
|
|
@@ -10122,7 +10171,7 @@ const ButtonSelectionGroupClass = compose(
|
|
|
10122
10171
|
wrappedEleName: 'vaadin-text-field',
|
|
10123
10172
|
style: () => buttonSelectionGroupStyles,
|
|
10124
10173
|
excludeAttrsSync: ['tabindex'],
|
|
10125
|
-
componentName: componentName$
|
|
10174
|
+
componentName: componentName$t,
|
|
10126
10175
|
})
|
|
10127
10176
|
);
|
|
10128
10177
|
|
|
@@ -10138,22 +10187,22 @@ const createBaseButtonSelectionGroupMappings = (vars) => ({
|
|
|
10138
10187
|
[vars.hostWidth]: refs.width,
|
|
10139
10188
|
});
|
|
10140
10189
|
|
|
10141
|
-
const vars$
|
|
10190
|
+
const vars$r = ButtonSelectionGroupClass.cssVarList;
|
|
10142
10191
|
|
|
10143
10192
|
const buttonSelectionGroup = {
|
|
10144
|
-
...createBaseButtonSelectionGroupMappings(vars$
|
|
10193
|
+
...createBaseButtonSelectionGroupMappings(vars$r),
|
|
10145
10194
|
};
|
|
10146
10195
|
|
|
10147
10196
|
var buttonSelectionGroup$1 = /*#__PURE__*/Object.freeze({
|
|
10148
10197
|
__proto__: null,
|
|
10149
10198
|
default: buttonSelectionGroup,
|
|
10150
|
-
vars: vars$
|
|
10199
|
+
vars: vars$r
|
|
10151
10200
|
});
|
|
10152
10201
|
|
|
10153
|
-
const componentName$
|
|
10202
|
+
const componentName$s = getComponentName('button-multi-selection-group-internal');
|
|
10154
10203
|
|
|
10155
10204
|
class ButtonMultiSelectionGroupInternalClass extends createBaseButtonSelectionGroupInternalClass(
|
|
10156
|
-
componentName$
|
|
10205
|
+
componentName$s
|
|
10157
10206
|
) {
|
|
10158
10207
|
#getSelectedNodes() {
|
|
10159
10208
|
return this.items.filter((item) => item.hasAttribute('selected'));
|
|
@@ -10256,7 +10305,7 @@ class ButtonMultiSelectionGroupInternalClass extends createBaseButtonSelectionGr
|
|
|
10256
10305
|
}
|
|
10257
10306
|
}
|
|
10258
10307
|
|
|
10259
|
-
const componentName$
|
|
10308
|
+
const componentName$r = getComponentName('button-multi-selection-group');
|
|
10260
10309
|
|
|
10261
10310
|
const buttonMultiSelectionGroupMixin = (superclass) =>
|
|
10262
10311
|
class ButtonMultiSelectionGroupMixinClass extends superclass {
|
|
@@ -10265,19 +10314,19 @@ const buttonMultiSelectionGroupMixin = (superclass) =>
|
|
|
10265
10314
|
const template = document.createElement('template');
|
|
10266
10315
|
|
|
10267
10316
|
template.innerHTML = `
|
|
10268
|
-
<${componentName$
|
|
10317
|
+
<${componentName$s}
|
|
10269
10318
|
name="button-selection-group"
|
|
10270
10319
|
slot="input"
|
|
10271
10320
|
tabindex="-1"
|
|
10272
10321
|
part="internal-component"
|
|
10273
10322
|
>
|
|
10274
10323
|
<slot></slot>
|
|
10275
|
-
</${componentName$
|
|
10324
|
+
</${componentName$s}>
|
|
10276
10325
|
`;
|
|
10277
10326
|
|
|
10278
10327
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
|
10279
10328
|
|
|
10280
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
|
10329
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$s);
|
|
10281
10330
|
|
|
10282
10331
|
forwardAttrs(this, this.inputElement, {
|
|
10283
10332
|
includeAttrs: ['size', 'default-values', 'min-items-selection', 'max-items-selection'],
|
|
@@ -10302,23 +10351,23 @@ const ButtonMultiSelectionGroupClass = compose(
|
|
|
10302
10351
|
wrappedEleName: 'vaadin-text-field',
|
|
10303
10352
|
style: () => buttonSelectionGroupStyles,
|
|
10304
10353
|
excludeAttrsSync: ['tabindex'],
|
|
10305
|
-
componentName: componentName$
|
|
10354
|
+
componentName: componentName$r,
|
|
10306
10355
|
})
|
|
10307
10356
|
);
|
|
10308
10357
|
|
|
10309
|
-
const vars$
|
|
10358
|
+
const vars$q = ButtonMultiSelectionGroupClass.cssVarList;
|
|
10310
10359
|
|
|
10311
10360
|
const buttonMultiSelectionGroup = {
|
|
10312
|
-
...createBaseButtonSelectionGroupMappings(vars$
|
|
10361
|
+
...createBaseButtonSelectionGroupMappings(vars$q),
|
|
10313
10362
|
};
|
|
10314
10363
|
|
|
10315
10364
|
var buttonMultiSelectionGroup$1 = /*#__PURE__*/Object.freeze({
|
|
10316
10365
|
__proto__: null,
|
|
10317
10366
|
default: buttonMultiSelectionGroup,
|
|
10318
|
-
vars: vars$
|
|
10367
|
+
vars: vars$q
|
|
10319
10368
|
});
|
|
10320
10369
|
|
|
10321
|
-
const componentName$
|
|
10370
|
+
const componentName$q = getComponentName('modal');
|
|
10322
10371
|
|
|
10323
10372
|
const customMixin$5 = (superclass) =>
|
|
10324
10373
|
class ModalMixinClass extends superclass {
|
|
@@ -10417,7 +10466,7 @@ const ModalClass = compose(
|
|
|
10417
10466
|
wrappedEleName: 'vaadin-dialog',
|
|
10418
10467
|
style: () => ``,
|
|
10419
10468
|
excludeAttrsSync: ['tabindex', 'opened'],
|
|
10420
|
-
componentName: componentName$
|
|
10469
|
+
componentName: componentName$q,
|
|
10421
10470
|
})
|
|
10422
10471
|
);
|
|
10423
10472
|
|
|
@@ -10431,14 +10480,14 @@ const modal = {
|
|
|
10431
10480
|
[compVars$2.overlayWidth]: '540px',
|
|
10432
10481
|
};
|
|
10433
10482
|
|
|
10434
|
-
const vars$
|
|
10483
|
+
const vars$p = {
|
|
10435
10484
|
...compVars$2,
|
|
10436
10485
|
};
|
|
10437
10486
|
|
|
10438
10487
|
var modal$1 = /*#__PURE__*/Object.freeze({
|
|
10439
10488
|
__proto__: null,
|
|
10440
10489
|
default: modal,
|
|
10441
|
-
vars: vars$
|
|
10490
|
+
vars: vars$p
|
|
10442
10491
|
});
|
|
10443
10492
|
|
|
10444
10493
|
const isValidDataType = (data) => {
|
|
@@ -10514,7 +10563,7 @@ const defaultRowDetailsRenderer = (item, itemLabelsMapping) => {
|
|
|
10514
10563
|
`;
|
|
10515
10564
|
};
|
|
10516
10565
|
|
|
10517
|
-
const componentName$
|
|
10566
|
+
const componentName$p = getComponentName('grid');
|
|
10518
10567
|
|
|
10519
10568
|
const GridMixin = (superclass) =>
|
|
10520
10569
|
class GridMixinClass extends superclass {
|
|
@@ -10868,52 +10917,52 @@ const GridClass = compose(
|
|
|
10868
10917
|
/*!css*/
|
|
10869
10918
|
`,
|
|
10870
10919
|
excludeAttrsSync: ['columns', 'tabindex'],
|
|
10871
|
-
componentName: componentName$
|
|
10920
|
+
componentName: componentName$p,
|
|
10872
10921
|
})
|
|
10873
10922
|
);
|
|
10874
10923
|
|
|
10875
10924
|
const globalRefs$h = getThemeRefs(globals);
|
|
10876
|
-
const vars$
|
|
10925
|
+
const vars$o = GridClass.cssVarList;
|
|
10877
10926
|
|
|
10878
10927
|
const grid = {
|
|
10879
|
-
[vars$
|
|
10880
|
-
[vars$
|
|
10881
|
-
[vars$
|
|
10882
|
-
[vars$
|
|
10883
|
-
[vars$
|
|
10884
|
-
|
|
10885
|
-
[vars$
|
|
10886
|
-
[vars$
|
|
10887
|
-
|
|
10888
|
-
[vars$
|
|
10889
|
-
[vars$
|
|
10890
|
-
[vars$
|
|
10891
|
-
|
|
10892
|
-
[vars$
|
|
10893
|
-
[vars$
|
|
10894
|
-
[vars$
|
|
10895
|
-
[vars$
|
|
10896
|
-
|
|
10897
|
-
[vars$
|
|
10898
|
-
[vars$
|
|
10899
|
-
|
|
10900
|
-
[vars$
|
|
10901
|
-
[vars$
|
|
10902
|
-
[vars$
|
|
10903
|
-
|
|
10904
|
-
[vars$
|
|
10905
|
-
[vars$
|
|
10906
|
-
[vars$
|
|
10907
|
-
[vars$
|
|
10908
|
-
[vars$
|
|
10909
|
-
[vars$
|
|
10910
|
-
[vars$
|
|
10911
|
-
[vars$
|
|
10912
|
-
[vars$
|
|
10913
|
-
[vars$
|
|
10928
|
+
[vars$o.hostWidth]: '100%',
|
|
10929
|
+
[vars$o.hostHeight]: '100%',
|
|
10930
|
+
[vars$o.hostMinHeight]: '400px',
|
|
10931
|
+
[vars$o.fontWeight]: '400',
|
|
10932
|
+
[vars$o.backgroundColor]: globalRefs$h.colors.surface.main,
|
|
10933
|
+
|
|
10934
|
+
[vars$o.fontSize]: refs.fontSize,
|
|
10935
|
+
[vars$o.fontFamily]: refs.fontFamily,
|
|
10936
|
+
|
|
10937
|
+
[vars$o.sortIndicatorsColor]: globalRefs$h.colors.surface.light,
|
|
10938
|
+
[vars$o.activeSortIndicator]: globalRefs$h.colors.surface.dark,
|
|
10939
|
+
[vars$o.resizeHandleColor]: globalRefs$h.colors.surface.light,
|
|
10940
|
+
|
|
10941
|
+
[vars$o.borderWidth]: refs.borderWidth,
|
|
10942
|
+
[vars$o.borderStyle]: refs.borderStyle,
|
|
10943
|
+
[vars$o.borderRadius]: refs.borderRadius,
|
|
10944
|
+
[vars$o.borderColor]: 'transparent',
|
|
10945
|
+
|
|
10946
|
+
[vars$o.headerRowTextColor]: globalRefs$h.colors.surface.dark,
|
|
10947
|
+
[vars$o.separatorColor]: globalRefs$h.colors.surface.light,
|
|
10948
|
+
|
|
10949
|
+
[vars$o.valueTextColor]: globalRefs$h.colors.surface.contrast,
|
|
10950
|
+
[vars$o.selectedBackgroundColor]: globalRefs$h.colors.surface.highlight,
|
|
10951
|
+
[vars$o.hostDirection]: globalRefs$h.direction,
|
|
10952
|
+
|
|
10953
|
+
[vars$o.toggleDetailsPanelButtonSize]: '1em',
|
|
10954
|
+
[vars$o.toggleDetailsPanelButtonOpenedColor]: globalRefs$h.colors.surface.contrast,
|
|
10955
|
+
[vars$o.toggleDetailsPanelButtonClosedColor]: globalRefs$h.colors.surface.light,
|
|
10956
|
+
[vars$o.toggleDetailsPanelButtonCursor]: 'pointer',
|
|
10957
|
+
[vars$o.detailsPanelBackgroundColor]: globalRefs$h.colors.surface.highlight,
|
|
10958
|
+
[vars$o.detailsPanelBorderTopColor]: globalRefs$h.colors.surface.light,
|
|
10959
|
+
[vars$o.detailsPanelLabelsColor]: globalRefs$h.colors.surface.dark,
|
|
10960
|
+
[vars$o.detailsPanelLabelsFontSize]: '0.8em',
|
|
10961
|
+
[vars$o.detailsPanelItemsGap]: '2em',
|
|
10962
|
+
[vars$o.detailsPanelPadding]: '12px 0',
|
|
10914
10963
|
|
|
10915
10964
|
_bordered: {
|
|
10916
|
-
[vars$
|
|
10965
|
+
[vars$o.borderColor]: refs.borderColor,
|
|
10917
10966
|
},
|
|
10918
10967
|
};
|
|
10919
10968
|
|
|
@@ -10921,10 +10970,10 @@ var grid$1 = /*#__PURE__*/Object.freeze({
|
|
|
10921
10970
|
__proto__: null,
|
|
10922
10971
|
default: grid,
|
|
10923
10972
|
grid: grid,
|
|
10924
|
-
vars: vars$
|
|
10973
|
+
vars: vars$o
|
|
10925
10974
|
});
|
|
10926
10975
|
|
|
10927
|
-
const componentName$
|
|
10976
|
+
const componentName$o = getComponentName('notification-card');
|
|
10928
10977
|
|
|
10929
10978
|
const notificationCardMixin = (superclass) =>
|
|
10930
10979
|
class NotificationCardMixinClass extends superclass {
|
|
@@ -11032,54 +11081,54 @@ const NotificationCardClass = compose(
|
|
|
11032
11081
|
}
|
|
11033
11082
|
`,
|
|
11034
11083
|
excludeAttrsSync: ['tabindex'],
|
|
11035
|
-
componentName: componentName$
|
|
11084
|
+
componentName: componentName$o,
|
|
11036
11085
|
})
|
|
11037
11086
|
);
|
|
11038
11087
|
|
|
11039
11088
|
const globalRefs$g = getThemeRefs(globals);
|
|
11040
|
-
const vars$
|
|
11089
|
+
const vars$n = NotificationCardClass.cssVarList;
|
|
11041
11090
|
|
|
11042
11091
|
const shadowColor$2 = '#00000020';
|
|
11043
11092
|
|
|
11044
11093
|
const notification = {
|
|
11045
|
-
[vars$
|
|
11046
|
-
[vars$
|
|
11047
|
-
[vars$
|
|
11048
|
-
[vars$
|
|
11049
|
-
[vars$
|
|
11050
|
-
[vars$
|
|
11051
|
-
[vars$
|
|
11052
|
-
[vars$
|
|
11053
|
-
[vars$
|
|
11094
|
+
[vars$n.hostMinWidth]: '415px',
|
|
11095
|
+
[vars$n.fontFamily]: globalRefs$g.fonts.font1.family,
|
|
11096
|
+
[vars$n.fontSize]: globalRefs$g.typography.body1.size,
|
|
11097
|
+
[vars$n.backgroundColor]: globalRefs$g.colors.surface.main,
|
|
11098
|
+
[vars$n.textColor]: globalRefs$g.colors.surface.contrast,
|
|
11099
|
+
[vars$n.boxShadow]: `${globalRefs$g.shadow.wide.xl} ${shadowColor$2}, ${globalRefs$g.shadow.narrow.xl} ${shadowColor$2}`,
|
|
11100
|
+
[vars$n.verticalPadding]: '0.625em',
|
|
11101
|
+
[vars$n.horizontalPadding]: '1.5em',
|
|
11102
|
+
[vars$n.borderRadius]: globalRefs$g.radius.xs,
|
|
11054
11103
|
|
|
11055
11104
|
_bordered: {
|
|
11056
|
-
[vars$
|
|
11057
|
-
[vars$
|
|
11058
|
-
[vars$
|
|
11105
|
+
[vars$n.borderWidth]: globalRefs$g.border.sm,
|
|
11106
|
+
[vars$n.borderStyle]: 'solid',
|
|
11107
|
+
[vars$n.borderColor]: 'transparent',
|
|
11059
11108
|
},
|
|
11060
11109
|
|
|
11061
11110
|
size: {
|
|
11062
|
-
xs: { [vars$
|
|
11063
|
-
sm: { [vars$
|
|
11064
|
-
md: { [vars$
|
|
11065
|
-
lg: { [vars$
|
|
11111
|
+
xs: { [vars$n.fontSize]: '12px' },
|
|
11112
|
+
sm: { [vars$n.fontSize]: '14px' },
|
|
11113
|
+
md: { [vars$n.fontSize]: '16px' },
|
|
11114
|
+
lg: { [vars$n.fontSize]: '18px' },
|
|
11066
11115
|
},
|
|
11067
11116
|
|
|
11068
11117
|
mode: {
|
|
11069
11118
|
primary: {
|
|
11070
|
-
[vars$
|
|
11071
|
-
[vars$
|
|
11072
|
-
[vars$
|
|
11119
|
+
[vars$n.backgroundColor]: globalRefs$g.colors.primary.main,
|
|
11120
|
+
[vars$n.textColor]: globalRefs$g.colors.primary.contrast,
|
|
11121
|
+
[vars$n.borderColor]: globalRefs$g.colors.primary.light,
|
|
11073
11122
|
},
|
|
11074
11123
|
success: {
|
|
11075
|
-
[vars$
|
|
11076
|
-
[vars$
|
|
11077
|
-
[vars$
|
|
11124
|
+
[vars$n.backgroundColor]: globalRefs$g.colors.success.main,
|
|
11125
|
+
[vars$n.textColor]: globalRefs$g.colors.success.contrast,
|
|
11126
|
+
[vars$n.borderColor]: globalRefs$g.colors.success.light,
|
|
11078
11127
|
},
|
|
11079
11128
|
error: {
|
|
11080
|
-
[vars$
|
|
11081
|
-
[vars$
|
|
11082
|
-
[vars$
|
|
11129
|
+
[vars$n.backgroundColor]: globalRefs$g.colors.error.main,
|
|
11130
|
+
[vars$n.textColor]: globalRefs$g.colors.error.contrast,
|
|
11131
|
+
[vars$n.borderColor]: globalRefs$g.colors.error.light,
|
|
11083
11132
|
},
|
|
11084
11133
|
},
|
|
11085
11134
|
};
|
|
@@ -11087,10 +11136,10 @@ const notification = {
|
|
|
11087
11136
|
var notificationCard = /*#__PURE__*/Object.freeze({
|
|
11088
11137
|
__proto__: null,
|
|
11089
11138
|
default: notification,
|
|
11090
|
-
vars: vars$
|
|
11139
|
+
vars: vars$n
|
|
11091
11140
|
});
|
|
11092
11141
|
|
|
11093
|
-
const componentName$
|
|
11142
|
+
const componentName$n = getComponentName('multi-select-combo-box');
|
|
11094
11143
|
|
|
11095
11144
|
const multiSelectComboBoxMixin = (superclass) =>
|
|
11096
11145
|
class MultiSelectComboBoxMixinClass extends superclass {
|
|
@@ -11330,6 +11379,14 @@ const multiSelectComboBoxMixin = (superclass) =>
|
|
|
11330
11379
|
setGetValidity() {
|
|
11331
11380
|
// eslint-disable-next-line func-names
|
|
11332
11381
|
this.getValidity = function () {
|
|
11382
|
+
if (this.pattern) {
|
|
11383
|
+
const patternRegex = new RegExp(this.pattern);
|
|
11384
|
+
if (this.value.some((val) => !patternRegex.test(val)))
|
|
11385
|
+
return {
|
|
11386
|
+
patternMismatch: true,
|
|
11387
|
+
};
|
|
11388
|
+
}
|
|
11389
|
+
|
|
11333
11390
|
if (this.isRequired && !this.value.length) {
|
|
11334
11391
|
return {
|
|
11335
11392
|
valueMissing: true,
|
|
@@ -11724,93 +11781,93 @@ const MultiSelectComboBoxClass = compose(
|
|
|
11724
11781
|
// Note: we exclude `placeholder` because the vaadin component observes it and
|
|
11725
11782
|
// tries to override it, causing us to lose the user set placeholder.
|
|
11726
11783
|
excludeAttrsSync: ['tabindex', 'size', 'data', 'placeholder'],
|
|
11727
|
-
componentName: componentName$
|
|
11784
|
+
componentName: componentName$n,
|
|
11728
11785
|
includeForwardProps: ['items', 'renderer', 'selectedItems'],
|
|
11729
11786
|
})
|
|
11730
11787
|
);
|
|
11731
11788
|
|
|
11732
11789
|
const globalRefs$f = getThemeRefs(globals);
|
|
11733
|
-
const vars$
|
|
11790
|
+
const vars$m = MultiSelectComboBoxClass.cssVarList;
|
|
11734
11791
|
|
|
11735
11792
|
const multiSelectComboBox = {
|
|
11736
|
-
[vars$
|
|
11737
|
-
[vars$
|
|
11738
|
-
[vars$
|
|
11739
|
-
[vars$
|
|
11740
|
-
[vars$
|
|
11741
|
-
[vars$
|
|
11742
|
-
[vars$
|
|
11743
|
-
[vars$
|
|
11744
|
-
[vars$
|
|
11745
|
-
[vars$
|
|
11746
|
-
[vars$
|
|
11747
|
-
[vars$
|
|
11748
|
-
[vars$
|
|
11749
|
-
[vars$
|
|
11750
|
-
[vars$
|
|
11751
|
-
[vars$
|
|
11752
|
-
[vars$
|
|
11753
|
-
[vars$
|
|
11754
|
-
[vars$
|
|
11755
|
-
[vars$
|
|
11756
|
-
[vars$
|
|
11757
|
-
[vars$
|
|
11758
|
-
[vars$
|
|
11759
|
-
[vars$
|
|
11760
|
-
[vars$
|
|
11761
|
-
[vars$
|
|
11762
|
-
[vars$
|
|
11763
|
-
[vars$
|
|
11764
|
-
[vars$
|
|
11765
|
-
[vars$
|
|
11766
|
-
[vars$
|
|
11767
|
-
[vars$
|
|
11768
|
-
[vars$
|
|
11769
|
-
[vars$
|
|
11770
|
-
[vars$
|
|
11771
|
-
[vars$
|
|
11772
|
-
[vars$
|
|
11773
|
-
[vars$
|
|
11774
|
-
[vars$
|
|
11775
|
-
[vars$
|
|
11776
|
-
[vars$
|
|
11793
|
+
[vars$m.hostWidth]: refs.width,
|
|
11794
|
+
[vars$m.hostDirection]: refs.direction,
|
|
11795
|
+
[vars$m.fontSize]: refs.fontSize,
|
|
11796
|
+
[vars$m.fontFamily]: refs.fontFamily,
|
|
11797
|
+
[vars$m.labelFontSize]: refs.labelFontSize,
|
|
11798
|
+
[vars$m.labelFontWeight]: refs.labelFontWeight,
|
|
11799
|
+
[vars$m.labelTextColor]: refs.labelTextColor,
|
|
11800
|
+
[vars$m.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
11801
|
+
[vars$m.inputBorderColor]: refs.borderColor,
|
|
11802
|
+
[vars$m.inputBorderWidth]: refs.borderWidth,
|
|
11803
|
+
[vars$m.inputBorderStyle]: refs.borderStyle,
|
|
11804
|
+
[vars$m.inputBorderRadius]: refs.borderRadius,
|
|
11805
|
+
[vars$m.inputOutlineColor]: refs.outlineColor,
|
|
11806
|
+
[vars$m.inputOutlineOffset]: refs.outlineOffset,
|
|
11807
|
+
[vars$m.inputOutlineWidth]: refs.outlineWidth,
|
|
11808
|
+
[vars$m.inputOutlineStyle]: refs.outlineStyle,
|
|
11809
|
+
[vars$m.labelRequiredIndicator]: refs.requiredIndicator,
|
|
11810
|
+
[vars$m.inputValueTextColor]: refs.valueTextColor,
|
|
11811
|
+
[vars$m.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
|
11812
|
+
[vars$m.inputBackgroundColor]: refs.backgroundColor,
|
|
11813
|
+
[vars$m.inputHorizontalPadding]: refs.horizontalPadding,
|
|
11814
|
+
[vars$m.inputVerticalPadding]: refs.verticalPadding,
|
|
11815
|
+
[vars$m.inputHeight]: refs.inputHeight,
|
|
11816
|
+
[vars$m.inputDropdownButtonColor]: globalRefs$f.colors.surface.dark,
|
|
11817
|
+
[vars$m.inputDropdownButtonCursor]: 'pointer',
|
|
11818
|
+
[vars$m.inputDropdownButtonSize]: refs.toggleButtonSize,
|
|
11819
|
+
[vars$m.inputDropdownButtonOffset]: globalRefs$f.spacing.xs,
|
|
11820
|
+
[vars$m.overlayItemPaddingInlineStart]: globalRefs$f.spacing.xs,
|
|
11821
|
+
[vars$m.overlayItemPaddingInlineEnd]: globalRefs$f.spacing.lg,
|
|
11822
|
+
[vars$m.chipFontSize]: refs.chipFontSize,
|
|
11823
|
+
[vars$m.chipTextColor]: globalRefs$f.colors.surface.contrast,
|
|
11824
|
+
[vars$m.chipBackgroundColor]: globalRefs$f.colors.surface.light,
|
|
11825
|
+
[vars$m.labelPosition]: refs.labelPosition,
|
|
11826
|
+
[vars$m.labelTopPosition]: refs.labelTopPosition,
|
|
11827
|
+
[vars$m.labelLeftPosition]: refs.labelLeftPosition,
|
|
11828
|
+
[vars$m.labelHorizontalPosition]: refs.labelHorizontalPosition,
|
|
11829
|
+
[vars$m.inputTransformY]: refs.inputTransformY,
|
|
11830
|
+
[vars$m.inputTransition]: refs.inputTransition,
|
|
11831
|
+
[vars$m.marginInlineStart]: refs.marginInlineStart,
|
|
11832
|
+
[vars$m.placeholderOpacity]: refs.placeholderOpacity,
|
|
11833
|
+
[vars$m.inputVerticalAlignment]: refs.inputVerticalAlignment,
|
|
11777
11834
|
|
|
11778
11835
|
labelType: {
|
|
11779
11836
|
floating: {
|
|
11780
|
-
[vars$
|
|
11837
|
+
[vars$m.inputHorizontalPadding]: '0.25em',
|
|
11781
11838
|
_hasValue: {
|
|
11782
|
-
[vars$
|
|
11839
|
+
[vars$m.inputHorizontalPadding]: '0.45em',
|
|
11783
11840
|
},
|
|
11784
11841
|
},
|
|
11785
11842
|
},
|
|
11786
11843
|
|
|
11787
11844
|
_readonly: {
|
|
11788
|
-
[vars$
|
|
11845
|
+
[vars$m.inputDropdownButtonCursor]: 'default',
|
|
11789
11846
|
},
|
|
11790
11847
|
|
|
11791
11848
|
// Overlay theme exposed via the component:
|
|
11792
|
-
[vars$
|
|
11793
|
-
[vars$
|
|
11794
|
-
[vars$
|
|
11795
|
-
[vars$
|
|
11796
|
-
[vars$
|
|
11797
|
-
[vars$
|
|
11849
|
+
[vars$m.overlayFontSize]: refs.fontSize,
|
|
11850
|
+
[vars$m.overlayFontFamily]: refs.fontFamily,
|
|
11851
|
+
[vars$m.overlayCursor]: 'pointer',
|
|
11852
|
+
[vars$m.overlayItemBoxShadow]: 'none',
|
|
11853
|
+
[vars$m.overlayBackground]: refs.backgroundColor,
|
|
11854
|
+
[vars$m.overlayTextColor]: refs.valueTextColor,
|
|
11798
11855
|
|
|
11799
11856
|
// Overlay direct theme:
|
|
11800
|
-
[vars$
|
|
11801
|
-
[vars$
|
|
11857
|
+
[vars$m.overlay.minHeight]: '400px',
|
|
11858
|
+
[vars$m.overlay.margin]: '0',
|
|
11802
11859
|
};
|
|
11803
11860
|
|
|
11804
11861
|
var multiSelectComboBox$1 = /*#__PURE__*/Object.freeze({
|
|
11805
11862
|
__proto__: null,
|
|
11806
11863
|
default: multiSelectComboBox,
|
|
11807
11864
|
multiSelectComboBox: multiSelectComboBox,
|
|
11808
|
-
vars: vars$
|
|
11865
|
+
vars: vars$m
|
|
11809
11866
|
});
|
|
11810
11867
|
|
|
11811
|
-
const componentName$
|
|
11868
|
+
const componentName$m = getComponentName('badge');
|
|
11812
11869
|
|
|
11813
|
-
class RawBadge extends createBaseClass({ componentName: componentName$
|
|
11870
|
+
class RawBadge extends createBaseClass({ componentName: componentName$m, baseSelector: ':host > div' }) {
|
|
11814
11871
|
constructor() {
|
|
11815
11872
|
super();
|
|
11816
11873
|
|
|
@@ -11862,65 +11919,65 @@ const BadgeClass = compose(
|
|
|
11862
11919
|
)(RawBadge);
|
|
11863
11920
|
|
|
11864
11921
|
const globalRefs$e = getThemeRefs(globals);
|
|
11865
|
-
const vars$
|
|
11922
|
+
const vars$l = BadgeClass.cssVarList;
|
|
11866
11923
|
|
|
11867
11924
|
const badge$2 = {
|
|
11868
|
-
[vars$
|
|
11869
|
-
[vars$
|
|
11925
|
+
[vars$l.hostWidth]: 'fit-content',
|
|
11926
|
+
[vars$l.hostDirection]: globalRefs$e.direction,
|
|
11870
11927
|
|
|
11871
|
-
[vars$
|
|
11928
|
+
[vars$l.textAlign]: 'center',
|
|
11872
11929
|
|
|
11873
|
-
[vars$
|
|
11874
|
-
[vars$
|
|
11930
|
+
[vars$l.fontFamily]: globalRefs$e.fonts.font1.family,
|
|
11931
|
+
[vars$l.fontWeight]: '400',
|
|
11875
11932
|
|
|
11876
|
-
[vars$
|
|
11877
|
-
[vars$
|
|
11933
|
+
[vars$l.verticalPadding]: '0.25em',
|
|
11934
|
+
[vars$l.horizontalPadding]: '0.5em',
|
|
11878
11935
|
|
|
11879
|
-
[vars$
|
|
11880
|
-
[vars$
|
|
11881
|
-
[vars$
|
|
11882
|
-
[vars$
|
|
11936
|
+
[vars$l.borderWidth]: globalRefs$e.border.xs,
|
|
11937
|
+
[vars$l.borderRadius]: globalRefs$e.radius.xs,
|
|
11938
|
+
[vars$l.borderColor]: 'transparent',
|
|
11939
|
+
[vars$l.borderStyle]: 'solid',
|
|
11883
11940
|
|
|
11884
11941
|
_fullWidth: {
|
|
11885
|
-
[vars$
|
|
11942
|
+
[vars$l.hostWidth]: '100%',
|
|
11886
11943
|
},
|
|
11887
11944
|
|
|
11888
11945
|
size: {
|
|
11889
|
-
xs: { [vars$
|
|
11890
|
-
sm: { [vars$
|
|
11891
|
-
md: { [vars$
|
|
11892
|
-
lg: { [vars$
|
|
11946
|
+
xs: { [vars$l.fontSize]: '12px' },
|
|
11947
|
+
sm: { [vars$l.fontSize]: '14px' },
|
|
11948
|
+
md: { [vars$l.fontSize]: '16px' },
|
|
11949
|
+
lg: { [vars$l.fontSize]: '18px' },
|
|
11893
11950
|
},
|
|
11894
11951
|
|
|
11895
11952
|
mode: {
|
|
11896
11953
|
default: {
|
|
11897
|
-
[vars$
|
|
11954
|
+
[vars$l.textColor]: globalRefs$e.colors.surface.dark,
|
|
11898
11955
|
_bordered: {
|
|
11899
|
-
[vars$
|
|
11956
|
+
[vars$l.borderColor]: globalRefs$e.colors.surface.light,
|
|
11900
11957
|
},
|
|
11901
11958
|
},
|
|
11902
11959
|
primary: {
|
|
11903
|
-
[vars$
|
|
11960
|
+
[vars$l.textColor]: globalRefs$e.colors.primary.main,
|
|
11904
11961
|
_bordered: {
|
|
11905
|
-
[vars$
|
|
11962
|
+
[vars$l.borderColor]: globalRefs$e.colors.primary.light,
|
|
11906
11963
|
},
|
|
11907
11964
|
},
|
|
11908
11965
|
secondary: {
|
|
11909
|
-
[vars$
|
|
11966
|
+
[vars$l.textColor]: globalRefs$e.colors.secondary.main,
|
|
11910
11967
|
_bordered: {
|
|
11911
|
-
[vars$
|
|
11968
|
+
[vars$l.borderColor]: globalRefs$e.colors.secondary.light,
|
|
11912
11969
|
},
|
|
11913
11970
|
},
|
|
11914
11971
|
error: {
|
|
11915
|
-
[vars$
|
|
11972
|
+
[vars$l.textColor]: globalRefs$e.colors.error.main,
|
|
11916
11973
|
_bordered: {
|
|
11917
|
-
[vars$
|
|
11974
|
+
[vars$l.borderColor]: globalRefs$e.colors.error.light,
|
|
11918
11975
|
},
|
|
11919
11976
|
},
|
|
11920
11977
|
success: {
|
|
11921
|
-
[vars$
|
|
11978
|
+
[vars$l.textColor]: globalRefs$e.colors.success.main,
|
|
11922
11979
|
_bordered: {
|
|
11923
|
-
[vars$
|
|
11980
|
+
[vars$l.borderColor]: globalRefs$e.colors.success.light,
|
|
11924
11981
|
},
|
|
11925
11982
|
},
|
|
11926
11983
|
},
|
|
@@ -11929,11 +11986,11 @@ const badge$2 = {
|
|
|
11929
11986
|
var badge$3 = /*#__PURE__*/Object.freeze({
|
|
11930
11987
|
__proto__: null,
|
|
11931
11988
|
default: badge$2,
|
|
11932
|
-
vars: vars$
|
|
11989
|
+
vars: vars$l
|
|
11933
11990
|
});
|
|
11934
11991
|
|
|
11935
|
-
const componentName$
|
|
11936
|
-
class RawAvatar extends createBaseClass({ componentName: componentName$
|
|
11992
|
+
const componentName$l = getComponentName('avatar');
|
|
11993
|
+
class RawAvatar extends createBaseClass({ componentName: componentName$l, baseSelector: ':host > .wrapper' }) {
|
|
11937
11994
|
constructor() {
|
|
11938
11995
|
super();
|
|
11939
11996
|
|
|
@@ -12072,21 +12129,21 @@ const avatar = {
|
|
|
12072
12129
|
},
|
|
12073
12130
|
};
|
|
12074
12131
|
|
|
12075
|
-
const vars$
|
|
12132
|
+
const vars$k = {
|
|
12076
12133
|
...compVars$1,
|
|
12077
12134
|
};
|
|
12078
12135
|
|
|
12079
12136
|
var avatar$1 = /*#__PURE__*/Object.freeze({
|
|
12080
12137
|
__proto__: null,
|
|
12081
12138
|
default: avatar,
|
|
12082
|
-
vars: vars$
|
|
12139
|
+
vars: vars$k
|
|
12083
12140
|
});
|
|
12084
12141
|
|
|
12085
|
-
const componentName$
|
|
12142
|
+
const componentName$k = getComponentName('mappings-field-internal');
|
|
12086
12143
|
|
|
12087
|
-
createBaseInputClass({ componentName: componentName$
|
|
12144
|
+
createBaseInputClass({ componentName: componentName$k, baseSelector: 'div' });
|
|
12088
12145
|
|
|
12089
|
-
const componentName$
|
|
12146
|
+
const componentName$j = getComponentName('mappings-field');
|
|
12090
12147
|
|
|
12091
12148
|
const customMixin$4 = (superclass) =>
|
|
12092
12149
|
class MappingsFieldMixinClass extends superclass {
|
|
@@ -12115,14 +12172,14 @@ const customMixin$4 = (superclass) =>
|
|
|
12115
12172
|
const template = document.createElement('template');
|
|
12116
12173
|
|
|
12117
12174
|
template.innerHTML = `
|
|
12118
|
-
<${componentName$
|
|
12175
|
+
<${componentName$k}
|
|
12119
12176
|
tabindex="-1"
|
|
12120
|
-
></${componentName$
|
|
12177
|
+
></${componentName$k}>
|
|
12121
12178
|
`;
|
|
12122
12179
|
|
|
12123
12180
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
|
12124
12181
|
|
|
12125
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
|
12182
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$k);
|
|
12126
12183
|
|
|
12127
12184
|
forwardAttrs(this, this.inputElement, {
|
|
12128
12185
|
includeAttrs: [
|
|
@@ -12254,47 +12311,47 @@ const MappingsFieldClass = compose(
|
|
|
12254
12311
|
'options',
|
|
12255
12312
|
'error-message',
|
|
12256
12313
|
],
|
|
12257
|
-
componentName: componentName$
|
|
12314
|
+
componentName: componentName$j,
|
|
12258
12315
|
})
|
|
12259
12316
|
);
|
|
12260
12317
|
|
|
12261
12318
|
const globalRefs$c = getThemeRefs(globals);
|
|
12262
12319
|
|
|
12263
|
-
const vars$
|
|
12320
|
+
const vars$j = MappingsFieldClass.cssVarList;
|
|
12264
12321
|
|
|
12265
12322
|
const mappingsField = {
|
|
12266
|
-
[vars$
|
|
12267
|
-
[vars$
|
|
12268
|
-
[vars$
|
|
12269
|
-
[vars$
|
|
12270
|
-
[vars$
|
|
12271
|
-
[vars$
|
|
12272
|
-
[vars$
|
|
12273
|
-
[vars$
|
|
12274
|
-
[vars$
|
|
12275
|
-
[vars$
|
|
12323
|
+
[vars$j.hostWidth]: refs.width,
|
|
12324
|
+
[vars$j.hostDirection]: refs.direction,
|
|
12325
|
+
[vars$j.fontSize]: refs.fontSize,
|
|
12326
|
+
[vars$j.fontFamily]: refs.fontFamily,
|
|
12327
|
+
[vars$j.separatorFontSize]: '14px',
|
|
12328
|
+
[vars$j.labelsFontSize]: '14px',
|
|
12329
|
+
[vars$j.labelsLineHeight]: '1',
|
|
12330
|
+
[vars$j.labelsMarginBottom]: '6px',
|
|
12331
|
+
[vars$j.labelTextColor]: refs.labelTextColor,
|
|
12332
|
+
[vars$j.itemMarginBottom]: '1em',
|
|
12276
12333
|
// To be positioned correctly, the min width has to match the text field min width
|
|
12277
|
-
[vars$
|
|
12334
|
+
[vars$j.valueLabelMinWidth]: refs.minWidth,
|
|
12278
12335
|
// To be positioned correctly, the min width has to match the combo box field min width
|
|
12279
|
-
[vars$
|
|
12280
|
-
[vars$
|
|
12281
|
-
[vars$
|
|
12336
|
+
[vars$j.attrLabelMinWidth]: `calc(12em + 2 * ${globalRefs$c.border.xs})`,
|
|
12337
|
+
[vars$j.separatorWidth]: '70px',
|
|
12338
|
+
[vars$j.removeButtonWidth]: '60px',
|
|
12282
12339
|
};
|
|
12283
12340
|
|
|
12284
12341
|
var mappingsField$1 = /*#__PURE__*/Object.freeze({
|
|
12285
12342
|
__proto__: null,
|
|
12286
12343
|
default: mappingsField,
|
|
12287
12344
|
mappingsField: mappingsField,
|
|
12288
|
-
vars: vars$
|
|
12345
|
+
vars: vars$j
|
|
12289
12346
|
});
|
|
12290
12347
|
|
|
12291
12348
|
var deleteIcon = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iMTgiIHZpZXdCb3g9IjAgMCAxNCAxOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEgMTZDMSAxNy4xIDEuOSAxOCAzIDE4SDExQzEyLjEgMTggMTMgMTcuMSAxMyAxNlY0SDFWMTZaTTMgNkgxMVYxNkgzVjZaTTEwLjUgMUw5LjUgMEg0LjVMMy41IDFIMFYzSDE0VjFIMTAuNVoiIGZpbGw9ImN1cnJlbnRjb2xvciIvPgo8L3N2Zz4K";
|
|
12292
12349
|
|
|
12293
12350
|
var editIcon = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTUiIGhlaWdodD0iMTUiIHZpZXdCb3g9IjAgMCAxNSAxNSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEwLjAwMDIgMC45OTIxNDlDMTAuMDAwMiAxLjAxNjE1IDEwLjAwMDIgMS4wMTYxNSAxMC4wMDAyIDEuMDE2MTVMOC4yMjQxOSAzLjAwODE1SDIuOTkyMTlDMi40NjQxOSAzLjAwODE1IDIuMDA4MTkgMy40NDAxNSAyLjAwODE5IDMuOTkyMTVWMTIuMDA4MkMyLjAwODE5IDEyLjUzNjIgMi40NDAxOSAxMi45OTIyIDIuOTkyMTkgMTIuOTkyMkg1LjUzNjE5QzUuODQ4MTkgMTMuMDQwMiA2LjE2MDE5IDEzLjA0MDIgNi40NzIxOSAxMi45OTIySDExLjAwODJDMTEuNTM2MiAxMi45OTIyIDExLjk5MjIgMTIuNTYwMiAxMS45OTIyIDEyLjAwODJWNy43ODQxNkwxMy45MzYyIDUuNjI0MTVMMTQuMDA4MiA1LjY3MjE1VjExLjk4NDJDMTQuMDA4MiAxMy42NjQyIDEyLjY2NDIgMTUuMDA4MiAxMS4wMDgyIDE1LjAwODJIMy4wMTYxOUMxLjMzNjE5IDE1LjAwODIgLTAuMDA3ODEyNSAxMy42NjQyIC0wLjAwNzgxMjUgMTEuOTg0MlYzLjk5MjE1Qy0wLjAwNzgxMjUgMi4zMzYxNSAxLjMzNjE5IDAuOTkyMTQ5IDMuMDE2MTkgMC45OTIxNDlIMTAuMDAwMlpNMTEuMjcyMiAyLjYyNDE1TDEyLjYxNjIgNC4xMTIxNUw3LjcyMDE5IDkuNjgwMTZDNy41MDQxOSA5LjkyMDE2IDYuODMyMTkgMTAuMjMyMiA1LjY4MDE5IDEwLjYxNjJDNS42NTYxOSAxMC42NDAyIDUuNjA4MTkgMTAuNjQwMiA1LjU2MDE5IDEwLjYxNjJDNS40NjQxOSAxMC41OTIyIDUuMzkyMTkgMTAuNDcyMiA1LjQ0MDE5IDEwLjM3NjJDNS43NTIxOSA5LjI0ODE2IDYuMDQwMTkgOC41NTIxNiA2LjI1NjE5IDguMzEyMTZMMTEuMjcyMiAyLjYyNDE1Wk0xMS45MjAyIDEuODU2MTVMMTMuMjg4MiAwLjMyMDE0OUMxMy42NDgyIC0wLjA4Nzg1MTYgMTQuMjcyMiAtMC4xMTE4NTIgMTQuNjgwMiAwLjI3MjE0OUMxNS4wODgyIDAuNjMyMTQ5IDE1LjExMjIgMS4yODAxNSAxNC43NTIyIDEuNjg4MTVMMTMuMjY0MiAzLjM2ODE1TDExLjkyMDIgMS44NTYxNVoiIGZpbGw9ImN1cnJlbnRjb2xvciIvPgo8L3N2Zz4K";
|
|
12294
12351
|
|
|
12295
|
-
const componentName$
|
|
12352
|
+
const componentName$i = getComponentName('user-attribute');
|
|
12296
12353
|
class RawUserAttribute extends createBaseClass({
|
|
12297
|
-
componentName: componentName$
|
|
12354
|
+
componentName: componentName$i,
|
|
12298
12355
|
baseSelector: ':host > .root',
|
|
12299
12356
|
}) {
|
|
12300
12357
|
constructor() {
|
|
@@ -12529,31 +12586,31 @@ const UserAttributeClass = compose(
|
|
|
12529
12586
|
)(RawUserAttribute);
|
|
12530
12587
|
|
|
12531
12588
|
const globalRefs$b = getThemeRefs(globals);
|
|
12532
|
-
const vars$
|
|
12589
|
+
const vars$i = UserAttributeClass.cssVarList;
|
|
12533
12590
|
|
|
12534
12591
|
const userAttribute = {
|
|
12535
|
-
[vars$
|
|
12536
|
-
[vars$
|
|
12537
|
-
[vars$
|
|
12538
|
-
[vars$
|
|
12539
|
-
[vars$
|
|
12540
|
-
[vars$
|
|
12592
|
+
[vars$i.hostDirection]: globalRefs$b.direction,
|
|
12593
|
+
[vars$i.labelTextWidth]: '150px',
|
|
12594
|
+
[vars$i.valueTextWidth]: '200px',
|
|
12595
|
+
[vars$i.badgeMaxWidth]: '85px',
|
|
12596
|
+
[vars$i.itemsGap]: '16px',
|
|
12597
|
+
[vars$i.hostMinWidth]: '530px',
|
|
12541
12598
|
_fullWidth: {
|
|
12542
|
-
[vars$
|
|
12599
|
+
[vars$i.hostWidth]: '100%',
|
|
12543
12600
|
},
|
|
12544
12601
|
};
|
|
12545
12602
|
|
|
12546
12603
|
var userAttribute$1 = /*#__PURE__*/Object.freeze({
|
|
12547
12604
|
__proto__: null,
|
|
12548
12605
|
default: userAttribute,
|
|
12549
|
-
vars: vars$
|
|
12606
|
+
vars: vars$i
|
|
12550
12607
|
});
|
|
12551
12608
|
|
|
12552
12609
|
var greenVIcon = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTggMEMzLjYgMCAwIDMuNiAwIDhDMCAxMi40IDMuNiAxNiA4IDE2QzEyLjQgMTYgMTYgMTIuNCAxNiA4QzE2IDMuNiAxMi40IDAgOCAwWk03LjEgMTEuN0wyLjkgNy42TDQuMyA2LjJMNyA4LjlMMTIgNEwxMy40IDUuNEw3LjEgMTEuN1oiIGZpbGw9IiM0Q0FGNTAiLz4KPC9zdmc+Cg==";
|
|
12553
12610
|
|
|
12554
|
-
const componentName$
|
|
12611
|
+
const componentName$h = getComponentName('user-auth-method');
|
|
12555
12612
|
class RawUserAuthMethod extends createBaseClass({
|
|
12556
|
-
componentName: componentName$
|
|
12613
|
+
componentName: componentName$h,
|
|
12557
12614
|
baseSelector: ':host > .root',
|
|
12558
12615
|
}) {
|
|
12559
12616
|
constructor() {
|
|
@@ -12747,31 +12804,31 @@ const UserAuthMethodClass = compose(
|
|
|
12747
12804
|
)(RawUserAuthMethod);
|
|
12748
12805
|
|
|
12749
12806
|
const globalRefs$a = getThemeRefs(globals);
|
|
12750
|
-
const vars$
|
|
12807
|
+
const vars$h = UserAuthMethodClass.cssVarList;
|
|
12751
12808
|
|
|
12752
12809
|
const userAuthMethod = {
|
|
12753
|
-
[vars$
|
|
12754
|
-
[vars$
|
|
12755
|
-
[vars$
|
|
12756
|
-
[vars$
|
|
12757
|
-
[vars$
|
|
12758
|
-
[vars$
|
|
12810
|
+
[vars$h.hostDirection]: globalRefs$a.direction,
|
|
12811
|
+
[vars$h.labelTextWidth]: '200px',
|
|
12812
|
+
[vars$h.itemsGap]: '16px',
|
|
12813
|
+
[vars$h.hostMinWidth]: '530px',
|
|
12814
|
+
[vars$h.iconSize]: '24px',
|
|
12815
|
+
[vars$h.iconColor]: 'currentcolor',
|
|
12759
12816
|
_fullWidth: {
|
|
12760
|
-
[vars$
|
|
12817
|
+
[vars$h.hostWidth]: '100%',
|
|
12761
12818
|
},
|
|
12762
12819
|
};
|
|
12763
12820
|
|
|
12764
12821
|
var userAuthMethod$1 = /*#__PURE__*/Object.freeze({
|
|
12765
12822
|
__proto__: null,
|
|
12766
12823
|
default: userAuthMethod,
|
|
12767
|
-
vars: vars$
|
|
12824
|
+
vars: vars$h
|
|
12768
12825
|
});
|
|
12769
12826
|
|
|
12770
|
-
const componentName$
|
|
12827
|
+
const componentName$g = getComponentName('saml-group-mappings-internal');
|
|
12771
12828
|
|
|
12772
|
-
createBaseInputClass({ componentName: componentName$
|
|
12829
|
+
createBaseInputClass({ componentName: componentName$g, baseSelector: '' });
|
|
12773
12830
|
|
|
12774
|
-
const componentName$
|
|
12831
|
+
const componentName$f = getComponentName('saml-group-mappings');
|
|
12775
12832
|
|
|
12776
12833
|
const customMixin$3 = (superclass) =>
|
|
12777
12834
|
class SamlGroupMappingsMixinClass extends superclass {
|
|
@@ -12781,14 +12838,14 @@ const customMixin$3 = (superclass) =>
|
|
|
12781
12838
|
const template = document.createElement('template');
|
|
12782
12839
|
|
|
12783
12840
|
template.innerHTML = `
|
|
12784
|
-
<${componentName$
|
|
12841
|
+
<${componentName$g}
|
|
12785
12842
|
tabindex="-1"
|
|
12786
|
-
></${componentName$
|
|
12843
|
+
></${componentName$g}>
|
|
12787
12844
|
`;
|
|
12788
12845
|
|
|
12789
12846
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
|
12790
12847
|
|
|
12791
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
|
12848
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$g);
|
|
12792
12849
|
|
|
12793
12850
|
forwardAttrs(this, this.inputElement, {
|
|
12794
12851
|
includeAttrs: [
|
|
@@ -12865,61 +12922,61 @@ const SamlGroupMappingsClass = compose(
|
|
|
12865
12922
|
'options',
|
|
12866
12923
|
'error-message',
|
|
12867
12924
|
],
|
|
12868
|
-
componentName: componentName$
|
|
12925
|
+
componentName: componentName$f,
|
|
12869
12926
|
})
|
|
12870
12927
|
);
|
|
12871
12928
|
|
|
12872
|
-
const vars$
|
|
12929
|
+
const vars$g = SamlGroupMappingsClass.cssVarList;
|
|
12873
12930
|
|
|
12874
12931
|
const samlGroupMappings = {
|
|
12875
|
-
[vars$
|
|
12876
|
-
[vars$
|
|
12877
|
-
[vars$
|
|
12932
|
+
[vars$g.hostWidth]: refs.width,
|
|
12933
|
+
[vars$g.hostDirection]: refs.direction,
|
|
12934
|
+
[vars$g.groupNameInputMarginBottom]: '1em',
|
|
12878
12935
|
};
|
|
12879
12936
|
|
|
12880
12937
|
var samlGroupMappings$1 = /*#__PURE__*/Object.freeze({
|
|
12881
12938
|
__proto__: null,
|
|
12882
12939
|
default: samlGroupMappings,
|
|
12883
12940
|
samlGroupMappings: samlGroupMappings,
|
|
12884
|
-
vars: vars$
|
|
12941
|
+
vars: vars$g
|
|
12885
12942
|
});
|
|
12886
12943
|
|
|
12887
12944
|
const globalRefs$9 = getThemeRefs(globals);
|
|
12888
|
-
const vars$
|
|
12945
|
+
const vars$f = PolicyValidationClass.cssVarList;
|
|
12889
12946
|
|
|
12890
12947
|
const policyValidation = {
|
|
12891
|
-
[vars$
|
|
12892
|
-
[vars$
|
|
12893
|
-
[vars$
|
|
12894
|
-
[vars$
|
|
12895
|
-
[vars$
|
|
12896
|
-
[vars$
|
|
12897
|
-
[vars$
|
|
12898
|
-
[vars$
|
|
12899
|
-
[vars$
|
|
12900
|
-
[vars$
|
|
12901
|
-
[vars$
|
|
12902
|
-
[vars$
|
|
12903
|
-
[vars$
|
|
12904
|
-
[vars$
|
|
12905
|
-
[vars$
|
|
12906
|
-
[vars$
|
|
12948
|
+
[vars$f.fontFamily]: refs.fontFamily,
|
|
12949
|
+
[vars$f.fontSize]: refs.labelFontSize,
|
|
12950
|
+
[vars$f.textColor]: refs.labelTextColor,
|
|
12951
|
+
[vars$f.borderWidth]: refs.borderWidth,
|
|
12952
|
+
[vars$f.borderStyle]: refs.borderStyle,
|
|
12953
|
+
[vars$f.borderColor]: refs.borderColor,
|
|
12954
|
+
[vars$f.borderRadius]: globalRefs$9.radius.sm,
|
|
12955
|
+
[vars$f.backgroundColor]: 'none',
|
|
12956
|
+
[vars$f.padding]: '0px',
|
|
12957
|
+
[vars$f.labelMargin]: globalRefs$9.spacing.sm,
|
|
12958
|
+
[vars$f.itemsSpacing]: globalRefs$9.spacing.lg,
|
|
12959
|
+
[vars$f.itemSymbolDefault]: "'\\2022'", // "•"
|
|
12960
|
+
[vars$f.itemSymbolSuccess]: "'\\2713'", // "✓"
|
|
12961
|
+
[vars$f.itemSymbolError]: "'\\2A09'", // "⨉"
|
|
12962
|
+
[vars$f.itemSymbolSuccessColor]: globalRefs$9.colors.success.main,
|
|
12963
|
+
[vars$f.itemSymbolErrorColor]: globalRefs$9.colors.error.main,
|
|
12907
12964
|
};
|
|
12908
12965
|
|
|
12909
12966
|
var policyValidation$1 = /*#__PURE__*/Object.freeze({
|
|
12910
12967
|
__proto__: null,
|
|
12911
12968
|
default: policyValidation,
|
|
12912
|
-
vars: vars$
|
|
12969
|
+
vars: vars$f
|
|
12913
12970
|
});
|
|
12914
12971
|
|
|
12915
|
-
const vars$
|
|
12972
|
+
const vars$e = IconClass.cssVarList;
|
|
12916
12973
|
|
|
12917
12974
|
const icon = {};
|
|
12918
12975
|
|
|
12919
12976
|
var icon$1 = /*#__PURE__*/Object.freeze({
|
|
12920
12977
|
__proto__: null,
|
|
12921
12978
|
default: icon,
|
|
12922
|
-
vars: vars$
|
|
12979
|
+
vars: vars$e
|
|
12923
12980
|
});
|
|
12924
12981
|
|
|
12925
12982
|
const decode = (input) => {
|
|
@@ -12932,9 +12989,9 @@ const tpl = (input, inline) => {
|
|
|
12932
12989
|
return inline ? input : `<pre>${input}</pre>`;
|
|
12933
12990
|
};
|
|
12934
12991
|
|
|
12935
|
-
const componentName$
|
|
12992
|
+
const componentName$e = getComponentName('code-snippet');
|
|
12936
12993
|
|
|
12937
|
-
let CodeSnippet$1 = class CodeSnippet extends createBaseClass({ componentName: componentName$
|
|
12994
|
+
let CodeSnippet$1 = class CodeSnippet extends createBaseClass({ componentName: componentName$e, baseSelector: ':host > code' }) {
|
|
12938
12995
|
static get observedAttributes() {
|
|
12939
12996
|
return ['lang', 'inline'];
|
|
12940
12997
|
}
|
|
@@ -13166,7 +13223,7 @@ const CodeSnippetClass = compose(
|
|
|
13166
13223
|
|
|
13167
13224
|
const globalRefs$8 = getThemeRefs(globals);
|
|
13168
13225
|
|
|
13169
|
-
const vars$
|
|
13226
|
+
const vars$d = CodeSnippetClass.cssVarList;
|
|
13170
13227
|
|
|
13171
13228
|
const light = {
|
|
13172
13229
|
color1: '#fa0',
|
|
@@ -13201,50 +13258,50 @@ const dark = {
|
|
|
13201
13258
|
};
|
|
13202
13259
|
|
|
13203
13260
|
const CodeSnippet = {
|
|
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$
|
|
13237
|
-
[vars$
|
|
13238
|
-
[vars$
|
|
13239
|
-
[vars$
|
|
13240
|
-
[vars$
|
|
13241
|
-
[vars$
|
|
13242
|
-
[vars$
|
|
13243
|
-
[vars$
|
|
13244
|
-
[vars$
|
|
13245
|
-
[vars$
|
|
13246
|
-
[vars$
|
|
13247
|
-
[vars$
|
|
13261
|
+
[vars$d.rootBgColor]: globalRefs$8.colors.surface.main,
|
|
13262
|
+
[vars$d.rootTextColor]: globalRefs$8.colors.surface.contrast,
|
|
13263
|
+
[vars$d.docTagTextColor]: light.color2,
|
|
13264
|
+
[vars$d.keywordTextColor]: light.color2,
|
|
13265
|
+
[vars$d.metaKeywordTextColor]: light.color2,
|
|
13266
|
+
[vars$d.templateTagTextColor]: light.color2,
|
|
13267
|
+
[vars$d.templateVariableTextColor]: light.color2,
|
|
13268
|
+
[vars$d.typeTextColor]: light.color2,
|
|
13269
|
+
[vars$d.variableLanguageTextColor]: light.color2,
|
|
13270
|
+
[vars$d.titleTextColor]: light.color3,
|
|
13271
|
+
[vars$d.titleClassTextColor]: light.color3,
|
|
13272
|
+
[vars$d.titleClassInheritedTextColor]: light.color3,
|
|
13273
|
+
[vars$d.titleFunctionTextColor]: light.color3,
|
|
13274
|
+
[vars$d.attrTextColor]: light.color4,
|
|
13275
|
+
[vars$d.attributeTextColor]: light.color4,
|
|
13276
|
+
[vars$d.literalTextColor]: light.color4,
|
|
13277
|
+
[vars$d.metaTextColor]: light.color4,
|
|
13278
|
+
[vars$d.numberTextColor]: light.color4,
|
|
13279
|
+
[vars$d.operatorTextColor]: light.color4,
|
|
13280
|
+
[vars$d.variableTextColor]: light.color4,
|
|
13281
|
+
[vars$d.selectorAttrTextColor]: light.color4,
|
|
13282
|
+
[vars$d.selectorClassTextColor]: light.color4,
|
|
13283
|
+
[vars$d.selectorIdTextColor]: light.color4,
|
|
13284
|
+
[vars$d.regexpTextColor]: light.color13,
|
|
13285
|
+
[vars$d.stringTextColor]: light.color13,
|
|
13286
|
+
[vars$d.metaStringTextColor]: light.color13,
|
|
13287
|
+
[vars$d.builtInTextColor]: light.color5,
|
|
13288
|
+
[vars$d.symbolTextColor]: light.color5,
|
|
13289
|
+
[vars$d.commentTextColor]: light.color6,
|
|
13290
|
+
[vars$d.codeTextColor]: light.color6,
|
|
13291
|
+
[vars$d.formulaTextColor]: light.color6,
|
|
13292
|
+
[vars$d.nameTextColor]: light.color7,
|
|
13293
|
+
[vars$d.quoteTextColor]: light.color7,
|
|
13294
|
+
[vars$d.selectorTagTextColor]: light.color7,
|
|
13295
|
+
[vars$d.selectorPseudoTextColor]: light.color7,
|
|
13296
|
+
[vars$d.substTextColor]: light.color8,
|
|
13297
|
+
[vars$d.sectionTextColor]: light.color4,
|
|
13298
|
+
[vars$d.bulletTextColor]: light.color9,
|
|
13299
|
+
[vars$d.emphasisTextColor]: light.color8,
|
|
13300
|
+
[vars$d.strongTextColor]: light.color8,
|
|
13301
|
+
[vars$d.additionTextColor]: light.color7,
|
|
13302
|
+
[vars$d.additionBgColor]: light.color10,
|
|
13303
|
+
[vars$d.deletionTextColor]: light.color2,
|
|
13304
|
+
[vars$d.deletionBgColor]: light.color10,
|
|
13248
13305
|
/* purposely ignored */
|
|
13249
13306
|
// [vars.charEscapeTextColor]: '',
|
|
13250
13307
|
// [vars.linkTextColor]: '',
|
|
@@ -13256,50 +13313,50 @@ const CodeSnippet = {
|
|
|
13256
13313
|
|
|
13257
13314
|
const codeSnippetDarkThemeOverrides = {
|
|
13258
13315
|
codeSnippet: {
|
|
13259
|
-
[vars$
|
|
13260
|
-
[vars$
|
|
13261
|
-
[vars$
|
|
13262
|
-
[vars$
|
|
13263
|
-
[vars$
|
|
13264
|
-
[vars$
|
|
13265
|
-
[vars$
|
|
13266
|
-
[vars$
|
|
13267
|
-
[vars$
|
|
13268
|
-
[vars$
|
|
13269
|
-
[vars$
|
|
13270
|
-
[vars$
|
|
13271
|
-
[vars$
|
|
13272
|
-
[vars$
|
|
13273
|
-
[vars$
|
|
13274
|
-
[vars$
|
|
13275
|
-
[vars$
|
|
13276
|
-
[vars$
|
|
13277
|
-
[vars$
|
|
13278
|
-
[vars$
|
|
13279
|
-
[vars$
|
|
13280
|
-
[vars$
|
|
13281
|
-
[vars$
|
|
13282
|
-
[vars$
|
|
13283
|
-
[vars$
|
|
13284
|
-
[vars$
|
|
13285
|
-
[vars$
|
|
13286
|
-
[vars$
|
|
13287
|
-
[vars$
|
|
13288
|
-
[vars$
|
|
13289
|
-
[vars$
|
|
13290
|
-
[vars$
|
|
13291
|
-
[vars$
|
|
13292
|
-
[vars$
|
|
13293
|
-
[vars$
|
|
13294
|
-
[vars$
|
|
13295
|
-
[vars$
|
|
13296
|
-
[vars$
|
|
13297
|
-
[vars$
|
|
13298
|
-
[vars$
|
|
13299
|
-
[vars$
|
|
13300
|
-
[vars$
|
|
13301
|
-
[vars$
|
|
13302
|
-
[vars$
|
|
13316
|
+
[vars$d.rootBgColor]: globalRefs$8.colors.surface.main,
|
|
13317
|
+
[vars$d.rootTextColor]: globalRefs$8.colors.surface.contrast,
|
|
13318
|
+
[vars$d.docTagTextColor]: dark.color2,
|
|
13319
|
+
[vars$d.keywordTextColor]: dark.color2,
|
|
13320
|
+
[vars$d.metaKeywordTextColor]: dark.color2,
|
|
13321
|
+
[vars$d.templateTagTextColor]: dark.color2,
|
|
13322
|
+
[vars$d.templateVariableTextColor]: dark.color2,
|
|
13323
|
+
[vars$d.typeTextColor]: dark.color2,
|
|
13324
|
+
[vars$d.variableLanguageTextColor]: dark.color2,
|
|
13325
|
+
[vars$d.titleTextColor]: dark.color3,
|
|
13326
|
+
[vars$d.titleClassTextColor]: dark.color3,
|
|
13327
|
+
[vars$d.titleClassInheritedTextColor]: dark.color3,
|
|
13328
|
+
[vars$d.titleFunctionTextColor]: dark.color3,
|
|
13329
|
+
[vars$d.attrTextColor]: dark.color4,
|
|
13330
|
+
[vars$d.attributeTextColor]: dark.color4,
|
|
13331
|
+
[vars$d.literalTextColor]: dark.color4,
|
|
13332
|
+
[vars$d.metaTextColor]: dark.color4,
|
|
13333
|
+
[vars$d.numberTextColor]: dark.color4,
|
|
13334
|
+
[vars$d.operatorTextColor]: dark.color4,
|
|
13335
|
+
[vars$d.variableTextColor]: dark.color4,
|
|
13336
|
+
[vars$d.selectorAttrTextColor]: dark.color4,
|
|
13337
|
+
[vars$d.selectorClassTextColor]: dark.color4,
|
|
13338
|
+
[vars$d.selectorIdTextColor]: dark.color4,
|
|
13339
|
+
[vars$d.regexpTextColor]: dark.color13,
|
|
13340
|
+
[vars$d.stringTextColor]: dark.color13,
|
|
13341
|
+
[vars$d.metaStringTextColor]: dark.color13,
|
|
13342
|
+
[vars$d.builtInTextColor]: dark.color5,
|
|
13343
|
+
[vars$d.symbolTextColor]: dark.color5,
|
|
13344
|
+
[vars$d.commentTextColor]: dark.color6,
|
|
13345
|
+
[vars$d.codeTextColor]: dark.color6,
|
|
13346
|
+
[vars$d.formulaTextColor]: dark.color6,
|
|
13347
|
+
[vars$d.nameTextColor]: dark.color7,
|
|
13348
|
+
[vars$d.quoteTextColor]: dark.color7,
|
|
13349
|
+
[vars$d.selectorTagTextColor]: dark.color7,
|
|
13350
|
+
[vars$d.selectorPseudoTextColor]: dark.color7,
|
|
13351
|
+
[vars$d.substTextColor]: dark.color8,
|
|
13352
|
+
[vars$d.sectionTextColor]: dark.color4,
|
|
13353
|
+
[vars$d.bulletTextColor]: dark.color9,
|
|
13354
|
+
[vars$d.emphasisTextColor]: dark.color8,
|
|
13355
|
+
[vars$d.strongTextColor]: dark.color8,
|
|
13356
|
+
[vars$d.additionTextColor]: dark.color7,
|
|
13357
|
+
[vars$d.additionBgColor]: dark.color10,
|
|
13358
|
+
[vars$d.deletionTextColor]: dark.color2,
|
|
13359
|
+
[vars$d.deletionBgColor]: dark.color10,
|
|
13303
13360
|
},
|
|
13304
13361
|
};
|
|
13305
13362
|
|
|
@@ -13307,10 +13364,10 @@ var codeSnippet = /*#__PURE__*/Object.freeze({
|
|
|
13307
13364
|
__proto__: null,
|
|
13308
13365
|
codeSnippetDarkThemeOverrides: codeSnippetDarkThemeOverrides,
|
|
13309
13366
|
default: CodeSnippet,
|
|
13310
|
-
vars: vars$
|
|
13367
|
+
vars: vars$d
|
|
13311
13368
|
});
|
|
13312
13369
|
|
|
13313
|
-
const componentName$
|
|
13370
|
+
const componentName$d = getComponentName('radio-button');
|
|
13314
13371
|
|
|
13315
13372
|
const customMixin$2 = (superclass) =>
|
|
13316
13373
|
class CustomMixin extends superclass {
|
|
@@ -13375,11 +13432,11 @@ const RadioButtonClass = compose(
|
|
|
13375
13432
|
wrappedEleName: 'vaadin-radio-button',
|
|
13376
13433
|
excludeAttrsSync: ['tabindex', 'data'],
|
|
13377
13434
|
includeForwardProps: ['checked', 'name', 'disabled'],
|
|
13378
|
-
componentName: componentName$
|
|
13435
|
+
componentName: componentName$d,
|
|
13379
13436
|
})
|
|
13380
13437
|
);
|
|
13381
13438
|
|
|
13382
|
-
const componentName$
|
|
13439
|
+
const componentName$c = getComponentName('radio-group');
|
|
13383
13440
|
|
|
13384
13441
|
const RadioGroupMixin = (superclass) =>
|
|
13385
13442
|
class RadioGroupMixinClass extends superclass {
|
|
@@ -13394,12 +13451,12 @@ const RadioGroupMixin = (superclass) =>
|
|
|
13394
13451
|
|
|
13395
13452
|
// we are overriding vaadin children getter so it will run on our custom elements
|
|
13396
13453
|
Object.defineProperty(this.baseElement, 'children', {
|
|
13397
|
-
get: () => this.querySelectorAll(componentName$
|
|
13454
|
+
get: () => this.querySelectorAll(componentName$d),
|
|
13398
13455
|
});
|
|
13399
13456
|
|
|
13400
13457
|
// we are overriding vaadin __filterRadioButtons so it will run on our custom elements
|
|
13401
13458
|
this.baseElement.__filterRadioButtons = (nodes) => {
|
|
13402
|
-
return nodes.filter((node) => node.localName === componentName$
|
|
13459
|
+
return nodes.filter((node) => node.localName === componentName$d);
|
|
13403
13460
|
};
|
|
13404
13461
|
|
|
13405
13462
|
// vaadin radio group missing some input properties
|
|
@@ -13549,38 +13606,38 @@ const RadioGroupClass = compose(
|
|
|
13549
13606
|
`,
|
|
13550
13607
|
|
|
13551
13608
|
excludeAttrsSync: ['tabindex', 'size', 'data', 'direction'],
|
|
13552
|
-
componentName: componentName$
|
|
13609
|
+
componentName: componentName$c,
|
|
13553
13610
|
includeForwardProps: ['value'],
|
|
13554
13611
|
})
|
|
13555
13612
|
);
|
|
13556
13613
|
|
|
13557
|
-
const vars$
|
|
13614
|
+
const vars$c = RadioGroupClass.cssVarList;
|
|
13558
13615
|
const globalRefs$7 = getThemeRefs(globals);
|
|
13559
13616
|
|
|
13560
13617
|
const radioGroup = {
|
|
13561
|
-
[vars$
|
|
13562
|
-
[vars$
|
|
13563
|
-
[vars$
|
|
13564
|
-
[vars$
|
|
13565
|
-
[vars$
|
|
13566
|
-
[vars$
|
|
13567
|
-
[vars$
|
|
13568
|
-
[vars$
|
|
13569
|
-
[vars$
|
|
13570
|
-
[vars$
|
|
13618
|
+
[vars$c.buttonsRowGap]: '9px',
|
|
13619
|
+
[vars$c.hostWidth]: refs.width,
|
|
13620
|
+
[vars$c.hostDirection]: refs.direction,
|
|
13621
|
+
[vars$c.fontSize]: refs.fontSize,
|
|
13622
|
+
[vars$c.fontFamily]: refs.fontFamily,
|
|
13623
|
+
[vars$c.labelTextColor]: refs.labelTextColor,
|
|
13624
|
+
[vars$c.labelRequiredIndicator]: refs.requiredIndicator,
|
|
13625
|
+
[vars$c.errorMessageTextColor]: refs.errorMessageTextColor,
|
|
13626
|
+
[vars$c.helperTextColor]: refs.helperTextColor,
|
|
13627
|
+
[vars$c.itemsLabelColor]: globalRefs$7.colors.surface.contrast,
|
|
13571
13628
|
|
|
13572
13629
|
textAlign: {
|
|
13573
|
-
right: { [vars$
|
|
13574
|
-
left: { [vars$
|
|
13575
|
-
center: { [vars$
|
|
13630
|
+
right: { [vars$c.inputTextAlign]: 'right' },
|
|
13631
|
+
left: { [vars$c.inputTextAlign]: 'left' },
|
|
13632
|
+
center: { [vars$c.inputTextAlign]: 'center' },
|
|
13576
13633
|
},
|
|
13577
13634
|
|
|
13578
13635
|
_fullWidth: {
|
|
13579
|
-
[vars$
|
|
13636
|
+
[vars$c.buttonsSpacing]: 'space-between',
|
|
13580
13637
|
},
|
|
13581
13638
|
|
|
13582
13639
|
_disabled: {
|
|
13583
|
-
[vars$
|
|
13640
|
+
[vars$c.itemsLabelColor]: globalRefs$7.colors.surface.light,
|
|
13584
13641
|
},
|
|
13585
13642
|
};
|
|
13586
13643
|
|
|
@@ -13588,24 +13645,24 @@ var radioGroup$1 = /*#__PURE__*/Object.freeze({
|
|
|
13588
13645
|
__proto__: null,
|
|
13589
13646
|
default: radioGroup,
|
|
13590
13647
|
radioGroup: radioGroup,
|
|
13591
|
-
vars: vars$
|
|
13648
|
+
vars: vars$c
|
|
13592
13649
|
});
|
|
13593
13650
|
|
|
13594
|
-
const vars$
|
|
13651
|
+
const vars$b = RadioButtonClass.cssVarList;
|
|
13595
13652
|
const globalRefs$6 = getThemeRefs(globals);
|
|
13596
13653
|
|
|
13597
13654
|
const radioButton = {
|
|
13598
|
-
[vars$
|
|
13599
|
-
[vars$
|
|
13600
|
-
[vars$
|
|
13601
|
-
[vars$
|
|
13602
|
-
[vars$
|
|
13603
|
-
[vars$
|
|
13604
|
-
[vars$
|
|
13605
|
-
[vars$
|
|
13655
|
+
[vars$b.fontFamily]: refs.fontFamily,
|
|
13656
|
+
[vars$b.radioSize]: 'calc(1em + 6px)',
|
|
13657
|
+
[vars$b.radioMargin]: 'auto 4px',
|
|
13658
|
+
[vars$b.radioCheckedSize]: `calc(var(${vars$b.radioSize})/5)`,
|
|
13659
|
+
[vars$b.radioCheckedColor]: globalRefs$6.colors.surface.light,
|
|
13660
|
+
[vars$b.radioBackgroundColor]: globalRefs$6.colors.surface.light,
|
|
13661
|
+
[vars$b.radioBorderColor]: 'none',
|
|
13662
|
+
[vars$b.radioBorderWidth]: 0,
|
|
13606
13663
|
|
|
13607
13664
|
_checked: {
|
|
13608
|
-
[vars$
|
|
13665
|
+
[vars$b.radioBackgroundColor]: globalRefs$6.colors.surface.contrast,
|
|
13609
13666
|
},
|
|
13610
13667
|
|
|
13611
13668
|
_hover: {
|
|
@@ -13614,16 +13671,16 @@ const radioButton = {
|
|
|
13614
13671
|
|
|
13615
13672
|
size: {
|
|
13616
13673
|
xs: {
|
|
13617
|
-
[vars$
|
|
13674
|
+
[vars$b.fontSize]: '12px',
|
|
13618
13675
|
},
|
|
13619
13676
|
sm: {
|
|
13620
|
-
[vars$
|
|
13677
|
+
[vars$b.fontSize]: '14px',
|
|
13621
13678
|
},
|
|
13622
13679
|
md: {
|
|
13623
|
-
[vars$
|
|
13680
|
+
[vars$b.fontSize]: '16px',
|
|
13624
13681
|
},
|
|
13625
13682
|
lg: {
|
|
13626
|
-
[vars$
|
|
13683
|
+
[vars$b.fontSize]: '18px',
|
|
13627
13684
|
},
|
|
13628
13685
|
},
|
|
13629
13686
|
};
|
|
@@ -13632,7 +13689,7 @@ var radioButton$1 = /*#__PURE__*/Object.freeze({
|
|
|
13632
13689
|
__proto__: null,
|
|
13633
13690
|
default: radioButton,
|
|
13634
13691
|
radioButton: radioButton,
|
|
13635
|
-
vars: vars$
|
|
13692
|
+
vars: vars$b
|
|
13636
13693
|
});
|
|
13637
13694
|
|
|
13638
13695
|
const SUPPORTED_FORMATS = ['MM/DD/YYYY', 'DD/MM/YYYY', 'YYYY/MM/DD'];
|
|
@@ -13950,7 +14007,7 @@ const nextMonth = (timestamp) => {
|
|
|
13950
14007
|
return date;
|
|
13951
14008
|
};
|
|
13952
14009
|
|
|
13953
|
-
const componentName$
|
|
14010
|
+
const componentName$b = getComponentName('calendar');
|
|
13954
14011
|
|
|
13955
14012
|
const observedAttrs$1 = [
|
|
13956
14013
|
'initial-value',
|
|
@@ -13967,7 +14024,7 @@ const observedAttrs$1 = [
|
|
|
13967
14024
|
|
|
13968
14025
|
const calendarUiAttrs = ['calendar-label-submit', 'calendar-label-cancel'];
|
|
13969
14026
|
|
|
13970
|
-
const BaseInputClass$1 = createBaseInputClass({ componentName: componentName$
|
|
14027
|
+
const BaseInputClass$1 = createBaseInputClass({ componentName: componentName$b, baseSelector: 'div' });
|
|
13971
14028
|
|
|
13972
14029
|
class RawCalendar extends BaseInputClass$1 {
|
|
13973
14030
|
static get observedAttributes() {
|
|
@@ -14582,92 +14639,92 @@ const CalendarClass = compose(
|
|
|
14582
14639
|
|
|
14583
14640
|
const globalRefs$5 = getThemeRefs(globals);
|
|
14584
14641
|
|
|
14585
|
-
const vars$
|
|
14642
|
+
const vars$a = CalendarClass.cssVarList;
|
|
14586
14643
|
|
|
14587
14644
|
const calendar = {
|
|
14588
|
-
[vars$
|
|
14589
|
-
[vars$
|
|
14590
|
-
[vars$
|
|
14645
|
+
[vars$a.fontFamily]: refs.fontFamily,
|
|
14646
|
+
[vars$a.fontSize]: refs.fontSize,
|
|
14647
|
+
[vars$a.hostDirection]: refs.direction,
|
|
14591
14648
|
|
|
14592
|
-
[vars$
|
|
14649
|
+
[vars$a.calendarPadding]: '1em',
|
|
14593
14650
|
|
|
14594
|
-
[vars$
|
|
14595
|
-
[vars$
|
|
14596
|
-
[vars$
|
|
14597
|
-
[vars$
|
|
14651
|
+
[vars$a.topNavVerticalPadding]: '1em',
|
|
14652
|
+
[vars$a.topNavAlignment]: 'space-between',
|
|
14653
|
+
[vars$a.topNavGap]: '0',
|
|
14654
|
+
[vars$a.topNavSelectorsGap]: '0.5em',
|
|
14598
14655
|
|
|
14599
|
-
[vars$
|
|
14600
|
-
[vars$
|
|
14601
|
-
[vars$
|
|
14602
|
-
[vars$
|
|
14656
|
+
[vars$a.bottomNavVerticalPadding]: '0.75em',
|
|
14657
|
+
[vars$a.bottomNavHorizontalPadding]: '1.5em',
|
|
14658
|
+
[vars$a.bottomNavAlignment]: 'space-between',
|
|
14659
|
+
[vars$a.bottomNavGap]: '0.5em',
|
|
14603
14660
|
|
|
14604
|
-
[vars$
|
|
14605
|
-
[vars$
|
|
14606
|
-
[vars$
|
|
14607
|
-
[vars$
|
|
14661
|
+
[vars$a.navMarginBottom]: '0.75em',
|
|
14662
|
+
[vars$a.navBorderBottomWidth]: '1px',
|
|
14663
|
+
[vars$a.navBorderBottomColor]: globalRefs$5.colors.surface.highlight,
|
|
14664
|
+
[vars$a.navBorderBottomStyle]: 'solid',
|
|
14608
14665
|
|
|
14609
|
-
[vars$
|
|
14610
|
-
[vars$
|
|
14666
|
+
[vars$a.yearInputWidth]: '6em',
|
|
14667
|
+
[vars$a.monthInputWidth]: '8em',
|
|
14611
14668
|
|
|
14612
|
-
[vars$
|
|
14613
|
-
[vars$
|
|
14669
|
+
[vars$a.navButtonSize]: '24px',
|
|
14670
|
+
[vars$a.navButtonCursor]: 'pointer',
|
|
14614
14671
|
|
|
14615
|
-
[vars$
|
|
14616
|
-
[vars$
|
|
14672
|
+
[vars$a.weekdayFontSize]: '0.875em',
|
|
14673
|
+
[vars$a.weekdayFontWeight]: '500',
|
|
14617
14674
|
|
|
14618
14675
|
// day table cell
|
|
14619
|
-
[vars$
|
|
14676
|
+
[vars$a.dayHeight]: '3.125em',
|
|
14620
14677
|
|
|
14621
14678
|
// day value
|
|
14622
|
-
[vars$
|
|
14623
|
-
[vars$
|
|
14624
|
-
[vars$
|
|
14625
|
-
[vars$
|
|
14626
|
-
[vars$
|
|
14627
|
-
[vars$
|
|
14628
|
-
[vars$
|
|
14629
|
-
[vars$
|
|
14630
|
-
[vars$
|
|
14631
|
-
[vars$
|
|
14679
|
+
[vars$a.daySize]: '2.125em',
|
|
14680
|
+
[vars$a.dayFontSize]: '1em',
|
|
14681
|
+
[vars$a.dayRadius]: '50%',
|
|
14682
|
+
[vars$a.dayTextAlign]: 'center',
|
|
14683
|
+
[vars$a.dayPadding]: '0',
|
|
14684
|
+
[vars$a.dayTextColor]: globalRefs$5.colors.surface.contrast,
|
|
14685
|
+
[vars$a.dayFontWeight]: '500',
|
|
14686
|
+
[vars$a.dayBackgroundColor]: 'transparent',
|
|
14687
|
+
[vars$a.dayCursor]: 'pointer',
|
|
14688
|
+
[vars$a.dayBackgroundColorHover]: globalRefs$5.colors.primary.highlight,
|
|
14632
14689
|
|
|
14633
14690
|
// selected day
|
|
14634
|
-
[vars$
|
|
14635
|
-
[vars$
|
|
14691
|
+
[vars$a.daySelectedBackgroundColor]: globalRefs$5.colors.primary.main,
|
|
14692
|
+
[vars$a.daySelectedTextdColor]: globalRefs$5.colors.primary.contrast,
|
|
14636
14693
|
|
|
14637
14694
|
// disabled day (out of min/max range)
|
|
14638
|
-
[vars$
|
|
14695
|
+
[vars$a.dayDisabledTextdColor]: globalRefs$5.colors.surface.light,
|
|
14639
14696
|
|
|
14640
14697
|
// today
|
|
14641
|
-
[vars$
|
|
14642
|
-
[vars$
|
|
14643
|
-
[vars$
|
|
14698
|
+
[vars$a.currentDayBorderColor]: globalRefs$5.colors.surface.light,
|
|
14699
|
+
[vars$a.currentDayBorderWidth]: '1px',
|
|
14700
|
+
[vars$a.currentDayBorderStyle]: 'solid',
|
|
14644
14701
|
|
|
14645
14702
|
size: {
|
|
14646
|
-
xs: { [vars$
|
|
14647
|
-
sm: { [vars$
|
|
14648
|
-
md: { [vars$
|
|
14649
|
-
lg: { [vars$
|
|
14703
|
+
xs: { [vars$a.fontSize]: '12px' },
|
|
14704
|
+
sm: { [vars$a.fontSize]: '14px' },
|
|
14705
|
+
md: { [vars$a.fontSize]: '16px' },
|
|
14706
|
+
lg: { [vars$a.fontSize]: '18px' },
|
|
14650
14707
|
},
|
|
14651
14708
|
|
|
14652
|
-
[vars$
|
|
14709
|
+
[vars$a.navButtonRotation]: 'rotate(180deg)',
|
|
14653
14710
|
|
|
14654
14711
|
_disabled: {
|
|
14655
|
-
[vars$
|
|
14656
|
-
[vars$
|
|
14657
|
-
[vars$
|
|
14658
|
-
[vars$
|
|
14712
|
+
[vars$a.navButtonOpacity]: '0.5',
|
|
14713
|
+
[vars$a.dayBackgroundColorHover]: 'none',
|
|
14714
|
+
[vars$a.navButtonCursor]: 'default',
|
|
14715
|
+
[vars$a.dayCursor]: 'default',
|
|
14659
14716
|
},
|
|
14660
14717
|
|
|
14661
14718
|
_fullWidth: {
|
|
14662
|
-
[vars$
|
|
14663
|
-
[vars$
|
|
14719
|
+
[vars$a.hostWidth]: '100%',
|
|
14720
|
+
[vars$a.dayBlockAlign]: '0 auto',
|
|
14664
14721
|
},
|
|
14665
14722
|
};
|
|
14666
14723
|
|
|
14667
14724
|
var calendar$1 = /*#__PURE__*/Object.freeze({
|
|
14668
14725
|
__proto__: null,
|
|
14669
14726
|
default: calendar,
|
|
14670
|
-
vars: vars$
|
|
14727
|
+
vars: vars$a
|
|
14671
14728
|
});
|
|
14672
14729
|
|
|
14673
14730
|
const patterns = {
|
|
@@ -14801,12 +14858,12 @@ class DateCounter {
|
|
|
14801
14858
|
}
|
|
14802
14859
|
}
|
|
14803
14860
|
|
|
14804
|
-
const componentName$
|
|
14861
|
+
const componentName$a = getComponentName('date-field');
|
|
14805
14862
|
|
|
14806
14863
|
// we set baseSelector to `vaadin-popover` as a temporary hack, so our portalMixin will
|
|
14807
14864
|
// be able to process this component's overlay. The whole process needs refactoring as soon as possible.
|
|
14808
14865
|
const BASE_SELECTOR = 'vaadin-popover';
|
|
14809
|
-
const BaseInputClass = createBaseInputClass({ componentName: componentName$
|
|
14866
|
+
const BaseInputClass = createBaseInputClass({ componentName: componentName$a, baseSelector: BASE_SELECTOR });
|
|
14810
14867
|
|
|
14811
14868
|
const dateFieldAttrs = ['format', 'opened', 'initial-value', 'readonly'];
|
|
14812
14869
|
const calendarAttrs = ['years-range', 'calendar-months', 'calendar-weekdays'];
|
|
@@ -15481,31 +15538,31 @@ const globalRefs$4 = getThemeRefs(globals);
|
|
|
15481
15538
|
const shadowColor$1 = '#00000020';
|
|
15482
15539
|
const { shadow } = globalRefs$4;
|
|
15483
15540
|
|
|
15484
|
-
const vars$
|
|
15541
|
+
const vars$9 = DateFieldClass.cssVarList;
|
|
15485
15542
|
|
|
15486
15543
|
const dateField = {
|
|
15487
|
-
[vars$
|
|
15488
|
-
[vars$
|
|
15489
|
-
[vars$
|
|
15490
|
-
|
|
15491
|
-
[vars$
|
|
15492
|
-
[vars$
|
|
15493
|
-
[vars$
|
|
15494
|
-
[vars$
|
|
15495
|
-
[vars$
|
|
15496
|
-
[vars$
|
|
15497
|
-
[vars$
|
|
15498
|
-
[vars$
|
|
15499
|
-
[vars$
|
|
15500
|
-
|
|
15501
|
-
[vars$
|
|
15502
|
-
[vars$
|
|
15544
|
+
[vars$9.hostWidth]: refs.width,
|
|
15545
|
+
[vars$9.hostDirection]: refs.direction,
|
|
15546
|
+
[vars$9.iconMargin]: '0.375em',
|
|
15547
|
+
|
|
15548
|
+
[vars$9.overlay.marginTop]: `calc(${refs.outlineWidth} + 1px)`,
|
|
15549
|
+
[vars$9.overlay.backgroundColor]: refs.backgroundColor,
|
|
15550
|
+
[vars$9.overlay.backdropBackgroundColor]: 'transparent',
|
|
15551
|
+
[vars$9.overlay.backdropPointerEvents]: 'all',
|
|
15552
|
+
[vars$9.overlay.boxShadow]: `${shadow.wide.xl} ${shadowColor$1}, ${shadow.narrow.xl} ${shadowColor$1}`,
|
|
15553
|
+
[vars$9.overlay.outlineWidth]: '0',
|
|
15554
|
+
[vars$9.overlay.outlineColor]: 'transparent',
|
|
15555
|
+
[vars$9.overlay.outlineStyle]: 'none',
|
|
15556
|
+
[vars$9.overlay.padding]: '0',
|
|
15557
|
+
|
|
15558
|
+
[vars$9.rtlInputDirection]: 'ltr',
|
|
15559
|
+
[vars$9.rtlInputAlignment]: 'right',
|
|
15503
15560
|
};
|
|
15504
15561
|
|
|
15505
15562
|
var dateField$1 = /*#__PURE__*/Object.freeze({
|
|
15506
15563
|
__proto__: null,
|
|
15507
15564
|
default: dateField,
|
|
15508
|
-
vars: vars$
|
|
15565
|
+
vars: vars$9
|
|
15509
15566
|
});
|
|
15510
15567
|
|
|
15511
15568
|
const activeableMixin = (superclass) =>
|
|
@@ -15523,7 +15580,7 @@ const activeableMixin = (superclass) =>
|
|
|
15523
15580
|
}
|
|
15524
15581
|
};
|
|
15525
15582
|
|
|
15526
|
-
const componentName$
|
|
15583
|
+
const componentName$9 = getComponentName('list-item');
|
|
15527
15584
|
|
|
15528
15585
|
const customMixin$1 = (superclass) =>
|
|
15529
15586
|
class ListItemMixinClass extends superclass {
|
|
@@ -15572,11 +15629,11 @@ const ListItemClass = compose(
|
|
|
15572
15629
|
componentNameValidationMixin,
|
|
15573
15630
|
customMixin$1,
|
|
15574
15631
|
activeableMixin
|
|
15575
|
-
)(createBaseClass({ componentName: componentName$
|
|
15632
|
+
)(createBaseClass({ componentName: componentName$9, baseSelector: 'slot' }));
|
|
15576
15633
|
|
|
15577
|
-
const componentName$
|
|
15634
|
+
const componentName$8 = getComponentName('list');
|
|
15578
15635
|
|
|
15579
|
-
class RawList extends createBaseClass({ componentName: componentName$
|
|
15636
|
+
class RawList extends createBaseClass({ componentName: componentName$8, baseSelector: '.wrapper' }) {
|
|
15580
15637
|
static get observedAttributes() {
|
|
15581
15638
|
return ['variant', 'readonly'];
|
|
15582
15639
|
}
|
|
@@ -15729,7 +15786,7 @@ const compVars = ListClass.cssVarList;
|
|
|
15729
15786
|
|
|
15730
15787
|
const [helperTheme, helperRefs, helperVars] = createHelperVars(
|
|
15731
15788
|
{ shadowColor: '#00000020' },
|
|
15732
|
-
componentName$
|
|
15789
|
+
componentName$8
|
|
15733
15790
|
);
|
|
15734
15791
|
|
|
15735
15792
|
const { shadowColor } = helperRefs;
|
|
@@ -15769,7 +15826,7 @@ const list$1 = {
|
|
|
15769
15826
|
},
|
|
15770
15827
|
};
|
|
15771
15828
|
|
|
15772
|
-
const vars$
|
|
15829
|
+
const vars$8 = {
|
|
15773
15830
|
...compVars,
|
|
15774
15831
|
...helperVars,
|
|
15775
15832
|
};
|
|
@@ -15777,49 +15834,49 @@ const vars$7 = {
|
|
|
15777
15834
|
var list$2 = /*#__PURE__*/Object.freeze({
|
|
15778
15835
|
__proto__: null,
|
|
15779
15836
|
default: list$1,
|
|
15780
|
-
vars: vars$
|
|
15837
|
+
vars: vars$8
|
|
15781
15838
|
});
|
|
15782
15839
|
|
|
15783
15840
|
const globalRefs$2 = getThemeRefs(globals);
|
|
15784
15841
|
|
|
15785
|
-
const vars$
|
|
15842
|
+
const vars$7 = ListItemClass.cssVarList;
|
|
15786
15843
|
|
|
15787
15844
|
const list = {
|
|
15788
|
-
[vars$
|
|
15789
|
-
[vars$
|
|
15790
|
-
[vars$
|
|
15791
|
-
[vars$
|
|
15792
|
-
[vars$
|
|
15793
|
-
[vars$
|
|
15794
|
-
[vars$
|
|
15795
|
-
[vars$
|
|
15796
|
-
[vars$
|
|
15797
|
-
[vars$
|
|
15798
|
-
[vars$
|
|
15845
|
+
[vars$7.backgroundColor]: globalRefs$2.colors.surface.main,
|
|
15846
|
+
[vars$7.padding]: globalRefs$2.spacing.lg,
|
|
15847
|
+
[vars$7.gap]: globalRefs$2.spacing.md,
|
|
15848
|
+
[vars$7.borderStyle]: 'solid',
|
|
15849
|
+
[vars$7.borderWidth]: globalRefs$2.border.xs,
|
|
15850
|
+
[vars$7.borderColor]: globalRefs$2.colors.surface.main,
|
|
15851
|
+
[vars$7.borderRadius]: globalRefs$2.radius.sm,
|
|
15852
|
+
[vars$7.cursor]: 'pointer',
|
|
15853
|
+
[vars$7.alignItems]: 'center',
|
|
15854
|
+
[vars$7.flexDirection]: 'row',
|
|
15855
|
+
[vars$7.transition]: 'border-color 0.2s, background-color 0.2s',
|
|
15799
15856
|
|
|
15800
15857
|
variant: {
|
|
15801
15858
|
tile: {
|
|
15802
|
-
[vars$
|
|
15803
|
-
[vars$
|
|
15804
|
-
[vars$
|
|
15859
|
+
[vars$7.alignItems]: 'flex-start',
|
|
15860
|
+
[vars$7.flexDirection]: 'column',
|
|
15861
|
+
[vars$7.borderColor]: globalRefs$2.colors.surface.light,
|
|
15805
15862
|
},
|
|
15806
15863
|
},
|
|
15807
15864
|
|
|
15808
15865
|
_hover: {
|
|
15809
|
-
[vars$
|
|
15866
|
+
[vars$7.backgroundColor]: globalRefs$2.colors.surface.highlight,
|
|
15810
15867
|
},
|
|
15811
15868
|
|
|
15812
15869
|
_active: {
|
|
15813
|
-
[vars$
|
|
15814
|
-
[vars$
|
|
15815
|
-
[vars$
|
|
15870
|
+
[vars$7.backgroundColor]: globalRefs$2.colors.surface.main,
|
|
15871
|
+
[vars$7.borderColor]: globalRefs$2.colors.primary.light,
|
|
15872
|
+
[vars$7.outline]: `1px solid ${globalRefs$2.colors.primary.light}`,
|
|
15816
15873
|
},
|
|
15817
15874
|
};
|
|
15818
15875
|
|
|
15819
15876
|
var listItem = /*#__PURE__*/Object.freeze({
|
|
15820
15877
|
__proto__: null,
|
|
15821
15878
|
default: list,
|
|
15822
|
-
vars: vars$
|
|
15879
|
+
vars: vars$7
|
|
15823
15880
|
});
|
|
15824
15881
|
|
|
15825
15882
|
const defaultValidateSchema = () => true;
|
|
@@ -15921,7 +15978,7 @@ const createDynamicDataMixin =
|
|
|
15921
15978
|
}
|
|
15922
15979
|
};
|
|
15923
15980
|
|
|
15924
|
-
const componentName$
|
|
15981
|
+
const componentName$7 = getComponentName('apps-list');
|
|
15925
15982
|
|
|
15926
15983
|
const limitAbbreviation = (str, limit = 2) =>
|
|
15927
15984
|
str
|
|
@@ -15983,7 +16040,7 @@ const AppsListClass = compose(
|
|
|
15983
16040
|
slots: ['empty-state'],
|
|
15984
16041
|
wrappedEleName: 'descope-list',
|
|
15985
16042
|
excludeAttrsSync: ['tabindex', 'class', 'empty'],
|
|
15986
|
-
componentName: componentName$
|
|
16043
|
+
componentName: componentName$7,
|
|
15987
16044
|
style: () => `
|
|
15988
16045
|
:host {
|
|
15989
16046
|
width: 100%;
|
|
@@ -16008,33 +16065,33 @@ const AppsListClass = compose(
|
|
|
16008
16065
|
})
|
|
16009
16066
|
);
|
|
16010
16067
|
|
|
16011
|
-
const vars$
|
|
16068
|
+
const vars$6 = AppsListClass.cssVarList;
|
|
16012
16069
|
const globalRefs$1 = getThemeRefs(globals);
|
|
16013
16070
|
|
|
16014
16071
|
const defaultHeight = '400px';
|
|
16015
16072
|
|
|
16016
16073
|
const appsList = {
|
|
16017
|
-
[vars$
|
|
16018
|
-
[vars$
|
|
16019
|
-
[vars$
|
|
16020
|
-
[vars$
|
|
16074
|
+
[vars$6.itemsFontWeight]: 'normal',
|
|
16075
|
+
[vars$6.itemsTextAlign]: 'start',
|
|
16076
|
+
[vars$6.hostDirection]: globalRefs$1.direction,
|
|
16077
|
+
[vars$6.maxHeight]: defaultHeight,
|
|
16021
16078
|
|
|
16022
16079
|
_empty: {
|
|
16023
|
-
[vars$
|
|
16080
|
+
[vars$6.minHeight]: defaultHeight,
|
|
16024
16081
|
},
|
|
16025
16082
|
|
|
16026
16083
|
size: {
|
|
16027
16084
|
xs: {
|
|
16028
|
-
[vars$
|
|
16085
|
+
[vars$6.itemsFontSize]: '14px',
|
|
16029
16086
|
},
|
|
16030
16087
|
sm: {
|
|
16031
|
-
[vars$
|
|
16088
|
+
[vars$6.itemsFontSize]: '14px',
|
|
16032
16089
|
},
|
|
16033
16090
|
md: {
|
|
16034
|
-
[vars$
|
|
16091
|
+
[vars$6.itemsFontSize]: '16px',
|
|
16035
16092
|
},
|
|
16036
16093
|
lg: {
|
|
16037
|
-
[vars$
|
|
16094
|
+
[vars$6.itemsFontSize]: '20px',
|
|
16038
16095
|
},
|
|
16039
16096
|
},
|
|
16040
16097
|
};
|
|
@@ -16042,10 +16099,10 @@ const appsList = {
|
|
|
16042
16099
|
var appsList$1 = /*#__PURE__*/Object.freeze({
|
|
16043
16100
|
__proto__: null,
|
|
16044
16101
|
default: appsList,
|
|
16045
|
-
vars: vars$
|
|
16102
|
+
vars: vars$6
|
|
16046
16103
|
});
|
|
16047
16104
|
|
|
16048
|
-
const componentName$
|
|
16105
|
+
const componentName$6 = getComponentName('scopes-list');
|
|
16049
16106
|
const variants = ['checkbox', 'switch'];
|
|
16050
16107
|
|
|
16051
16108
|
const itemRenderer = ({ id, desc, required = false }, _, ref) => {
|
|
@@ -16064,7 +16121,7 @@ const itemRenderer = ({ id, desc, required = false }, _, ref) => {
|
|
|
16064
16121
|
`;
|
|
16065
16122
|
};
|
|
16066
16123
|
|
|
16067
|
-
class RawScopesList extends createBaseClass({ componentName: componentName$
|
|
16124
|
+
class RawScopesList extends createBaseClass({ componentName: componentName$6, baseSelector: 'div' }) {
|
|
16068
16125
|
constructor() {
|
|
16069
16126
|
super();
|
|
16070
16127
|
|
|
@@ -16169,28 +16226,28 @@ const ScopesListClass = compose(
|
|
|
16169
16226
|
componentNameValidationMixin
|
|
16170
16227
|
)(RawScopesList);
|
|
16171
16228
|
|
|
16172
|
-
const vars$
|
|
16229
|
+
const vars$5 = ScopesListClass.cssVarList;
|
|
16173
16230
|
|
|
16174
16231
|
const scopesList = {
|
|
16175
|
-
[vars$
|
|
16176
|
-
[vars$
|
|
16177
|
-
[vars$
|
|
16232
|
+
[vars$5.requiredInputBorderColor]: theme$1._disabled[vars$R.borderColor],
|
|
16233
|
+
[vars$5.requiredInputValueTextColor]: theme$1._disabled[vars$R.valueTextColor],
|
|
16234
|
+
[vars$5.hostWidth]: '280px',
|
|
16178
16235
|
_fullWidth: {
|
|
16179
|
-
[vars$
|
|
16236
|
+
[vars$5.hostWidth]: '100%',
|
|
16180
16237
|
},
|
|
16181
16238
|
};
|
|
16182
16239
|
|
|
16183
16240
|
var scopesList$1 = /*#__PURE__*/Object.freeze({
|
|
16184
16241
|
__proto__: null,
|
|
16185
16242
|
default: scopesList,
|
|
16186
|
-
vars: vars$
|
|
16243
|
+
vars: vars$5
|
|
16187
16244
|
});
|
|
16188
16245
|
|
|
16189
16246
|
var arrowsImg = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjkiIGhlaWdodD0iMjgiIHZpZXdCb3g9IjAgMCAyOSAyOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTkuMTQ0OTIgMTUuNjQ1TDcuNDk5OTIgMTRMMi44MzMyNSAxOC42NjY3TDcuNDk5OTIgMjMuMzMzM0w5LjE0NDkyIDIxLjY4ODNMNy4zMDE1OSAxOS44MzMzSDI0Ljk5OTlWMTcuNUg3LjMwMTU5TDkuMTQ0OTIgMTUuNjQ1WiIgZmlsbD0iIzYzNkM3NCIvPgo8cGF0aCBkPSJNMTkuODU1IDEyLjM1NTNMMjEuNSAxNC4wMDAzTDI2LjE2NjcgOS4zMzM2NkwyMS41IDQuNjY2OTlMMTkuODU1IDYuMzExOTlMMjEuNjk4MyA4LjE2Njk5SDRWMTAuNTAwM0gyMS42OTgzTDE5Ljg1NSAxMi4zNTUzWiIgZmlsbD0iIzYzNkM3NCIvPgo8L3N2Zz4K";
|
|
16190
16247
|
|
|
16191
|
-
const componentName$
|
|
16248
|
+
const componentName$5 = getComponentName('third-party-app-logo');
|
|
16192
16249
|
class RawThirdPartyAppLogoClass extends createBaseClass({
|
|
16193
|
-
componentName: componentName$
|
|
16250
|
+
componentName: componentName$5,
|
|
16194
16251
|
baseSelector: '.wrapper',
|
|
16195
16252
|
}) {
|
|
16196
16253
|
constructor() {
|
|
@@ -16285,31 +16342,31 @@ const ThirdPartyAppLogoClass = compose(
|
|
|
16285
16342
|
)(RawThirdPartyAppLogoClass);
|
|
16286
16343
|
|
|
16287
16344
|
const globalRefs = getThemeRefs(globals);
|
|
16288
|
-
const vars$
|
|
16345
|
+
const vars$4 = ThirdPartyAppLogoClass.cssVarList;
|
|
16289
16346
|
|
|
16290
16347
|
const thirdPartyAppLogo = {
|
|
16291
|
-
[vars$
|
|
16292
|
-
[vars$
|
|
16293
|
-
[vars$
|
|
16348
|
+
[vars$4.gap]: globalRefs.spacing.lg,
|
|
16349
|
+
[vars$4.arrowsColor]: globalRefs.colors.surface.dark,
|
|
16350
|
+
[vars$4.thirdPartyAppLogoFallback]:
|
|
16294
16351
|
'url(https://imgs.descope.com/components/third-party-app-logo-placeholder.svg)',
|
|
16295
|
-
[vars$
|
|
16352
|
+
[vars$4.companyLogoFallback]:
|
|
16296
16353
|
'url(https://imgs.descope.com/components/project-logo-placeholder.svg)',
|
|
16297
16354
|
size: {
|
|
16298
16355
|
xs: {
|
|
16299
|
-
[vars$
|
|
16300
|
-
[vars$
|
|
16356
|
+
[vars$4.logoMaxHeight]: '30px',
|
|
16357
|
+
[vars$4.logoMaxWidth]: '120px',
|
|
16301
16358
|
},
|
|
16302
16359
|
sm: {
|
|
16303
|
-
[vars$
|
|
16304
|
-
[vars$
|
|
16360
|
+
[vars$4.logoMaxHeight]: '40px',
|
|
16361
|
+
[vars$4.logoMaxWidth]: '160px',
|
|
16305
16362
|
},
|
|
16306
16363
|
md: {
|
|
16307
|
-
[vars$
|
|
16308
|
-
[vars$
|
|
16364
|
+
[vars$4.logoMaxHeight]: '48px',
|
|
16365
|
+
[vars$4.logoMaxWidth]: '200px',
|
|
16309
16366
|
},
|
|
16310
16367
|
lg: {
|
|
16311
|
-
[vars$
|
|
16312
|
-
[vars$
|
|
16368
|
+
[vars$4.logoMaxHeight]: '60px',
|
|
16369
|
+
[vars$4.logoMaxWidth]: '240px',
|
|
16313
16370
|
},
|
|
16314
16371
|
},
|
|
16315
16372
|
};
|
|
@@ -16317,10 +16374,10 @@ const thirdPartyAppLogo = {
|
|
|
16317
16374
|
var thirdPartyAppLogo$1 = /*#__PURE__*/Object.freeze({
|
|
16318
16375
|
__proto__: null,
|
|
16319
16376
|
default: thirdPartyAppLogo,
|
|
16320
|
-
vars: vars$
|
|
16377
|
+
vars: vars$4
|
|
16321
16378
|
});
|
|
16322
16379
|
|
|
16323
|
-
const componentName$
|
|
16380
|
+
const componentName$4 = getComponentName('security-questions-setup');
|
|
16324
16381
|
|
|
16325
16382
|
const attrsToSync$1 = [
|
|
16326
16383
|
'full-width',
|
|
@@ -16336,7 +16393,7 @@ const attrsToSync$1 = [
|
|
|
16336
16393
|
];
|
|
16337
16394
|
|
|
16338
16395
|
const attrsToReRender$1 = ['count', 'questions'];
|
|
16339
|
-
class RawSecurityQuestionsSetup extends createBaseClass({ componentName: componentName$
|
|
16396
|
+
class RawSecurityQuestionsSetup extends createBaseClass({ componentName: componentName$4, baseSelector: 'div' }) {
|
|
16340
16397
|
constructor() {
|
|
16341
16398
|
super();
|
|
16342
16399
|
|
|
@@ -16443,7 +16500,7 @@ class RawSecurityQuestionsSetup extends createBaseClass({ componentName: compone
|
|
|
16443
16500
|
return JSON.parse(this.getAttribute('questions')) || [];
|
|
16444
16501
|
} catch (e) {
|
|
16445
16502
|
// eslint-disable-next-line no-console
|
|
16446
|
-
console.error(componentName$
|
|
16503
|
+
console.error(componentName$4, 'Error parsing questions attribute', e);
|
|
16447
16504
|
return [];
|
|
16448
16505
|
}
|
|
16449
16506
|
}
|
|
@@ -16551,22 +16608,22 @@ const SecurityQuestionsSetupClass = compose(
|
|
|
16551
16608
|
componentNameValidationMixin
|
|
16552
16609
|
)(RawSecurityQuestionsSetup);
|
|
16553
16610
|
|
|
16554
|
-
const vars$
|
|
16611
|
+
const vars$3 = SecurityQuestionsSetupClass.cssVarList;
|
|
16555
16612
|
|
|
16556
16613
|
const securityQuestionsSetup = {
|
|
16557
|
-
[vars$
|
|
16614
|
+
[vars$3.hostWidth]: 'fit-content',
|
|
16558
16615
|
_fullWidth: {
|
|
16559
|
-
[vars$
|
|
16616
|
+
[vars$3.hostWidth]: '100%',
|
|
16560
16617
|
},
|
|
16561
16618
|
};
|
|
16562
16619
|
|
|
16563
16620
|
var securityQuestionsSetup$1 = /*#__PURE__*/Object.freeze({
|
|
16564
16621
|
__proto__: null,
|
|
16565
16622
|
default: securityQuestionsSetup,
|
|
16566
|
-
vars: vars$
|
|
16623
|
+
vars: vars$3
|
|
16567
16624
|
});
|
|
16568
16625
|
|
|
16569
|
-
const componentName$
|
|
16626
|
+
const componentName$3 = getComponentName('security-questions-verify');
|
|
16570
16627
|
|
|
16571
16628
|
const textFieldsAttrs = [
|
|
16572
16629
|
'full-width',
|
|
@@ -16587,7 +16644,7 @@ const attrMappings = {
|
|
|
16587
16644
|
const attrsToSync = [...textFieldsAttrs, ...textsAttrs];
|
|
16588
16645
|
|
|
16589
16646
|
const attrsToReRender = ['questions'];
|
|
16590
|
-
class RawSecurityQuestionsVerify extends createBaseClass({ componentName: componentName$
|
|
16647
|
+
class RawSecurityQuestionsVerify extends createBaseClass({ componentName: componentName$3, baseSelector: 'div' }) {
|
|
16591
16648
|
constructor() {
|
|
16592
16649
|
super();
|
|
16593
16650
|
|
|
@@ -16658,7 +16715,7 @@ class RawSecurityQuestionsVerify extends createBaseClass({ componentName: compon
|
|
|
16658
16715
|
return JSON.parse(this.getAttribute('questions')) || [];
|
|
16659
16716
|
} catch (e) {
|
|
16660
16717
|
// eslint-disable-next-line no-console
|
|
16661
|
-
console.error(componentName$
|
|
16718
|
+
console.error(componentName$3, 'Error parsing questions attribute', e);
|
|
16662
16719
|
return [];
|
|
16663
16720
|
}
|
|
16664
16721
|
}
|
|
@@ -16768,21 +16825,327 @@ const SecurityQuestionsVerifyClass = compose(
|
|
|
16768
16825
|
componentNameValidationMixin
|
|
16769
16826
|
)(RawSecurityQuestionsVerify);
|
|
16770
16827
|
|
|
16771
|
-
const vars$
|
|
16828
|
+
const vars$2 = SecurityQuestionsVerifyClass.cssVarList;
|
|
16772
16829
|
|
|
16773
16830
|
const securityQuestionsVerify = {
|
|
16774
|
-
[vars$
|
|
16775
|
-
[vars$
|
|
16831
|
+
[vars$2.hostWidth]: 'min-content',
|
|
16832
|
+
[vars$2.questionCursor]: 'pointer',
|
|
16776
16833
|
_fullWidth: {
|
|
16777
|
-
[vars$
|
|
16834
|
+
[vars$2.hostWidth]: '100%',
|
|
16778
16835
|
},
|
|
16779
|
-
[vars$
|
|
16780
|
-
[vars$
|
|
16836
|
+
[vars$2.questionFontSize]: refs.fontSize,
|
|
16837
|
+
[vars$2.questionFontFamily]: refs.fontFamily,
|
|
16781
16838
|
};
|
|
16782
16839
|
|
|
16783
16840
|
var securityQuestionsVerify$1 = /*#__PURE__*/Object.freeze({
|
|
16784
16841
|
__proto__: null,
|
|
16785
16842
|
default: securityQuestionsVerify,
|
|
16843
|
+
vars: vars$2
|
|
16844
|
+
});
|
|
16845
|
+
|
|
16846
|
+
const NUMERIC_RE = /^\d+$/;
|
|
16847
|
+
|
|
16848
|
+
const isNumericValue = (val) => NUMERIC_RE.test(val.replaceAll('+', '').replaceAll('-', ''));
|
|
16849
|
+
|
|
16850
|
+
const sanitizeCountryCodePrefix = (val) => val.replace(/\+\d+-/, '');
|
|
16851
|
+
|
|
16852
|
+
const componentName$2 = getComponentName('hybrid-field');
|
|
16853
|
+
|
|
16854
|
+
const attrs = {
|
|
16855
|
+
shared: [
|
|
16856
|
+
'label',
|
|
16857
|
+
'placeholder',
|
|
16858
|
+
'bordered',
|
|
16859
|
+
'full-width',
|
|
16860
|
+
'label-type',
|
|
16861
|
+
'size',
|
|
16862
|
+
'disabled',
|
|
16863
|
+
'readonly',
|
|
16864
|
+
'required',
|
|
16865
|
+
'st-host-direction',
|
|
16866
|
+
],
|
|
16867
|
+
email: [
|
|
16868
|
+
'data-errormessage-value-missing-email',
|
|
16869
|
+
'data-errormessage-pattern-mismatch-email',
|
|
16870
|
+
'external-input',
|
|
16871
|
+
],
|
|
16872
|
+
phone: {
|
|
16873
|
+
countryCode: [
|
|
16874
|
+
'country-input-label',
|
|
16875
|
+
'country-input-placeholder',
|
|
16876
|
+
'restrict-countries',
|
|
16877
|
+
'default-code',
|
|
16878
|
+
'phone-minlength',
|
|
16879
|
+
'data-errormessage-value-missing-phone',
|
|
16880
|
+
],
|
|
16881
|
+
inputBox: [
|
|
16882
|
+
'restrict-countries',
|
|
16883
|
+
'default-code',
|
|
16884
|
+
'phone-minlength',
|
|
16885
|
+
'data-errormessage-value-missing-phone',
|
|
16886
|
+
],
|
|
16887
|
+
},
|
|
16888
|
+
};
|
|
16889
|
+
|
|
16890
|
+
const attrMap = {
|
|
16891
|
+
email: {
|
|
16892
|
+
'data-errormessage-value-missing-email': 'data-errormessage-value-missing',
|
|
16893
|
+
'data-errormessage-pattern-mismatch-email': 'data-errormessage-pattern-mismatch',
|
|
16894
|
+
},
|
|
16895
|
+
phone: {
|
|
16896
|
+
placeholder: 'phone-input-placeholder',
|
|
16897
|
+
'phone-minlength': 'minlength',
|
|
16898
|
+
'data-errormessage-value-missing-phone': 'data-errormessage-value-missing',
|
|
16899
|
+
},
|
|
16900
|
+
};
|
|
16901
|
+
|
|
16902
|
+
const EMAIL_FIELD = 'descope-email-field';
|
|
16903
|
+
const PHONE_FIELD = 'descope-phone-field';
|
|
16904
|
+
const PHONE_INPUT_BOX_FIELD = 'descope-phone-input-box-field';
|
|
16905
|
+
|
|
16906
|
+
const BaseClass$1 = createBaseClass({
|
|
16907
|
+
componentName: componentName$2,
|
|
16908
|
+
baseSelector: 'div',
|
|
16909
|
+
});
|
|
16910
|
+
|
|
16911
|
+
class RawHybridField extends BaseClass$1 {
|
|
16912
|
+
#isReportedValidity = false;
|
|
16913
|
+
|
|
16914
|
+
#selectionStart;
|
|
16915
|
+
|
|
16916
|
+
constructor() {
|
|
16917
|
+
super();
|
|
16918
|
+
|
|
16919
|
+
this.attachShadow({ mode: 'open' }).innerHTML = `
|
|
16920
|
+
<style>
|
|
16921
|
+
:host {
|
|
16922
|
+
display: inline-flex;
|
|
16923
|
+
box-sizing: border-box;
|
|
16924
|
+
padding: 0;
|
|
16925
|
+
gap: 0;
|
|
16926
|
+
}
|
|
16927
|
+
.wrapper {
|
|
16928
|
+
display: grid;
|
|
16929
|
+
place-content: center;
|
|
16930
|
+
}
|
|
16931
|
+
descope-email-field,
|
|
16932
|
+
descope-phone-field,
|
|
16933
|
+
descope-phone-input-box-field {
|
|
16934
|
+
grid-area: 1/1;
|
|
16935
|
+
width: 100%;
|
|
16936
|
+
height: 100%;
|
|
16937
|
+
}
|
|
16938
|
+
.hidden {
|
|
16939
|
+
visibility: hidden;
|
|
16940
|
+
}
|
|
16941
|
+
</style>
|
|
16942
|
+
<div class="wrapper">
|
|
16943
|
+
<descope-email-field external-input="${this.isExternalInput}"></descope-email-field>
|
|
16944
|
+
<descope-phone-field allow-alphanumeric-input="true"></descope-phone-field>
|
|
16945
|
+
<descope-phone-input-box-field allow-alphanumeric-input="true"></descope-phone-input-box-field>
|
|
16946
|
+
</div>
|
|
16947
|
+
`;
|
|
16948
|
+
}
|
|
16949
|
+
|
|
16950
|
+
get isExternalInput() {
|
|
16951
|
+
return this.getAttribute('external-input') === 'true';
|
|
16952
|
+
}
|
|
16953
|
+
|
|
16954
|
+
get emailInputEle() {
|
|
16955
|
+
return this.isExternalInput ? this.emailInput.externalInput : this.emailInput.inputElement;
|
|
16956
|
+
}
|
|
16957
|
+
|
|
16958
|
+
get phoneVariant() {
|
|
16959
|
+
const isInputBox = this.getAttribute('phone-variant') === 'inputBox';
|
|
16960
|
+
return isInputBox ? this.phoneInputBoxInput : this.phoneCountryCodeInput;
|
|
16961
|
+
}
|
|
16962
|
+
|
|
16963
|
+
get defaultCode() {
|
|
16964
|
+
const firstItem = this.phoneCountryCodeInput.countryCodes?.[0] || '';
|
|
16965
|
+
return this.getAttribute('default-code') || firstItem;
|
|
16966
|
+
}
|
|
16967
|
+
|
|
16968
|
+
get activeInputEle() {
|
|
16969
|
+
if (this.activeInput === this.emailInput) {
|
|
16970
|
+
return this.emailInputEle;
|
|
16971
|
+
}
|
|
16972
|
+
return this.phoneVariant.phoneNumberInputEle;
|
|
16973
|
+
}
|
|
16974
|
+
|
|
16975
|
+
get value() {
|
|
16976
|
+
return this.activeInput?.value || '';
|
|
16977
|
+
}
|
|
16978
|
+
|
|
16979
|
+
set value(val) {
|
|
16980
|
+
this.handleActiveInput(val);
|
|
16981
|
+
this.activeInput.value = val;
|
|
16982
|
+
}
|
|
16983
|
+
|
|
16984
|
+
init() {
|
|
16985
|
+
super.init?.();
|
|
16986
|
+
this.initInputs();
|
|
16987
|
+
this.updateAttrs();
|
|
16988
|
+
this.toggleInputVisibility();
|
|
16989
|
+
}
|
|
16990
|
+
|
|
16991
|
+
initInputs() {
|
|
16992
|
+
this.emailInput = this.shadowRoot.querySelector(EMAIL_FIELD);
|
|
16993
|
+
this.phoneCountryCodeInput = this.shadowRoot.querySelector(PHONE_FIELD);
|
|
16994
|
+
this.phoneInputBoxInput = this.shadowRoot.querySelector(PHONE_INPUT_BOX_FIELD);
|
|
16995
|
+
|
|
16996
|
+
this.inputs = [this.emailInput, this.phoneCountryCodeInput, this.phoneInputBoxInput];
|
|
16997
|
+
|
|
16998
|
+
this.activeInput = this.emailInput;
|
|
16999
|
+
|
|
17000
|
+
this.initInputEles();
|
|
17001
|
+
this.overrideEmailInputType();
|
|
17002
|
+
|
|
17003
|
+
// We want to prevent Vaadin from changing the input type to `email`
|
|
17004
|
+
// otherwise, we cannot get the selectionStart from the input.
|
|
17005
|
+
const origEmailSetAttr = this.emailInput.setAttribute.bind(this.emailInputEle);
|
|
17006
|
+
this.emailInputEle.setAttribute = (name, value) => {
|
|
17007
|
+
if (name !== 'type' || value !== 'email' || !this.emailInput.hasAttribute('focused')) {
|
|
17008
|
+
return origEmailSetAttr(name, value);
|
|
17009
|
+
}
|
|
17010
|
+
return false;
|
|
17011
|
+
};
|
|
17012
|
+
}
|
|
17013
|
+
|
|
17014
|
+
// we need to listen on the inner `input` element itself, otherwise we don't always get an `input` event
|
|
17015
|
+
initInputEles() {
|
|
17016
|
+
const inputEles = [
|
|
17017
|
+
this.emailInputEle,
|
|
17018
|
+
this.phoneCountryCodeInput.phoneNumberInputEle,
|
|
17019
|
+
this.phoneInputBoxInput.phoneNumberInputEle,
|
|
17020
|
+
];
|
|
17021
|
+
|
|
17022
|
+
inputEles.forEach((ele) => {
|
|
17023
|
+
ele?.addEventListener('input', this.onValueChange.bind(this));
|
|
17024
|
+
});
|
|
17025
|
+
}
|
|
17026
|
+
|
|
17027
|
+
overrideEmailInputType() {
|
|
17028
|
+
this.emailInputEle.addEventListener('focus', () => {
|
|
17029
|
+
this.emailInputEle.setAttribute('type', 'text');
|
|
17030
|
+
});
|
|
17031
|
+
this.emailInputEle.addEventListener('blur', () => {
|
|
17032
|
+
setTimeout(() => {
|
|
17033
|
+
this.emailInputEle?.setAttribute('type', 'email');
|
|
17034
|
+
});
|
|
17035
|
+
});
|
|
17036
|
+
}
|
|
17037
|
+
|
|
17038
|
+
updateAttrs() {
|
|
17039
|
+
this.inputs.forEach((input) => forwardAttrs(this, input, { includeAttrs: attrs.shared }));
|
|
17040
|
+
|
|
17041
|
+
forwardAttrs(this, this.emailInput, { includeAttrs: attrs.email, mapAttrs: attrMap.email });
|
|
17042
|
+
|
|
17043
|
+
forwardAttrs(this, this.phoneCountryCodeInput, {
|
|
17044
|
+
includeAttrs: attrs.phone.countryCode,
|
|
17045
|
+
mapAttrs: attrMap.phone,
|
|
17046
|
+
});
|
|
17047
|
+
|
|
17048
|
+
forwardAttrs(this, this.phoneInputBoxInput, {
|
|
17049
|
+
includeAttrs: attrs.phone.inputBox,
|
|
17050
|
+
mapAttrs: attrMap.phone,
|
|
17051
|
+
});
|
|
17052
|
+
|
|
17053
|
+
setTimeout(() => this.phoneCountryCodeInput.setAttribute('default-code', this.defaultCode));
|
|
17054
|
+
}
|
|
17055
|
+
|
|
17056
|
+
onValueChange() {
|
|
17057
|
+
this.#selectionStart = this.activeInputEle.selectionStart;
|
|
17058
|
+
this.handleActiveInput(this.activeInput.value);
|
|
17059
|
+
}
|
|
17060
|
+
|
|
17061
|
+
handleActiveInput(val) {
|
|
17062
|
+
const expectedActiveInput = isNumericValue(val) ? this.phoneVariant : this.emailInput;
|
|
17063
|
+
|
|
17064
|
+
if (this.activeInput !== expectedActiveInput) {
|
|
17065
|
+
this.setActiveInput(expectedActiveInput);
|
|
17066
|
+
}
|
|
17067
|
+
}
|
|
17068
|
+
|
|
17069
|
+
setActiveInput(expectedActiveInput) {
|
|
17070
|
+
const val = this.activeInput.value;
|
|
17071
|
+
this.activeInput = expectedActiveInput;
|
|
17072
|
+
this.setActiveInputValue(val);
|
|
17073
|
+
if (this.#isReportedValidity) this.activeInput.reportValidity();
|
|
17074
|
+
this.setActiveInputSelectionStart();
|
|
17075
|
+
this.toggleInputVisibility();
|
|
17076
|
+
}
|
|
17077
|
+
|
|
17078
|
+
setActiveInputSelectionStart() {
|
|
17079
|
+
setTimeout(() => {
|
|
17080
|
+
this.activeInputEle.focus();
|
|
17081
|
+
this.activeInputEle.setSelectionRange?.(this.#selectionStart, this.#selectionStart);
|
|
17082
|
+
});
|
|
17083
|
+
}
|
|
17084
|
+
|
|
17085
|
+
setActiveInputValue(val) {
|
|
17086
|
+
const sanitizedVal = sanitizeCountryCodePrefix(val);
|
|
17087
|
+
const isPhoneField = this.activeInput.localName === PHONE_FIELD;
|
|
17088
|
+
const value = isPhoneField
|
|
17089
|
+
? `${this.phoneCountryCodeInput.countryCodeItems}-${sanitizedVal}`
|
|
17090
|
+
: sanitizedVal;
|
|
17091
|
+
this.activeInput.value = value;
|
|
17092
|
+
}
|
|
17093
|
+
|
|
17094
|
+
toggleInputVisibility() {
|
|
17095
|
+
this.inputs.forEach((input) => {
|
|
17096
|
+
input !== this.activeInput ? input.classList.add('hidden') : input.classList.remove('hidden');
|
|
17097
|
+
});
|
|
17098
|
+
}
|
|
17099
|
+
|
|
17100
|
+
reportValidity() {
|
|
17101
|
+
this.#isReportedValidity = true;
|
|
17102
|
+
|
|
17103
|
+
const ele = this.activeInputEle;
|
|
17104
|
+
|
|
17105
|
+
// On reportValidity we want to set the caret at the end of the input value.
|
|
17106
|
+
// Since checkValidity triggers `focus` on the input, it sets the caret at the start of the input,
|
|
17107
|
+
// regardless the existing value.
|
|
17108
|
+
setTimeout(() => {
|
|
17109
|
+
ele.setSelectionRange?.(ele.value.length, ele.value.length);
|
|
17110
|
+
});
|
|
17111
|
+
|
|
17112
|
+
return this.activeInput.reportValidity();
|
|
17113
|
+
}
|
|
17114
|
+
|
|
17115
|
+
checkValidity() {
|
|
17116
|
+
return this.activeInput.checkValidity();
|
|
17117
|
+
}
|
|
17118
|
+
}
|
|
17119
|
+
|
|
17120
|
+
const HybridFieldClass = compose(
|
|
17121
|
+
createStyleMixin({ componentNameOverride: getComponentName('input-wrapper') }),
|
|
17122
|
+
createStyleMixin({
|
|
17123
|
+
mappings: {
|
|
17124
|
+
hostWidth: { selector: () => ':host', property: 'width' },
|
|
17125
|
+
hostDirection: [
|
|
17126
|
+
{ selector: () => 'descope-email-field', property: 'direction' },
|
|
17127
|
+
{ selector: () => 'descope-phone-field', property: 'direction' },
|
|
17128
|
+
{ selector: () => 'descope-phone-input-box-field', property: 'direction' },
|
|
17129
|
+
],
|
|
17130
|
+
},
|
|
17131
|
+
}),
|
|
17132
|
+
draggableMixin,
|
|
17133
|
+
componentNameValidationMixin
|
|
17134
|
+
)(RawHybridField);
|
|
17135
|
+
|
|
17136
|
+
const vars$1 = HybridFieldClass.cssVarList;
|
|
17137
|
+
|
|
17138
|
+
const hybridField = {
|
|
17139
|
+
[vars$1.hostDirection]: refs.direction,
|
|
17140
|
+
|
|
17141
|
+
_fullWidth: {
|
|
17142
|
+
[vars$1.hostWidth]: '100%',
|
|
17143
|
+
},
|
|
17144
|
+
};
|
|
17145
|
+
|
|
17146
|
+
var hybridField$1 = /*#__PURE__*/Object.freeze({
|
|
17147
|
+
__proto__: null,
|
|
17148
|
+
default: hybridField,
|
|
16786
17149
|
vars: vars$1
|
|
16787
17150
|
});
|
|
16788
17151
|
|
|
@@ -16840,6 +17203,7 @@ const components = {
|
|
|
16840
17203
|
thirdPartyAppLogo: thirdPartyAppLogo$1,
|
|
16841
17204
|
securityQuestionsSetup: securityQuestionsSetup$1,
|
|
16842
17205
|
securityQuestionsVerify: securityQuestionsVerify$1,
|
|
17206
|
+
hybridField: hybridField$1,
|
|
16843
17207
|
};
|
|
16844
17208
|
|
|
16845
17209
|
const theme = Object.keys(components).reduce(
|
|
@@ -16852,7 +17216,7 @@ const vars = Object.keys(components).reduce(
|
|
|
16852
17216
|
);
|
|
16853
17217
|
|
|
16854
17218
|
const defaultTheme = { globals, components: theme };
|
|
16855
|
-
const themeVars = { globals: vars$
|
|
17219
|
+
const themeVars = { globals: vars$T, components: vars };
|
|
16856
17220
|
|
|
16857
17221
|
const colors = {
|
|
16858
17222
|
surface: {
|
|
@@ -17208,6 +17572,7 @@ exports.DividerClass = DividerClass;
|
|
|
17208
17572
|
exports.EmailFieldClass = EmailFieldClass;
|
|
17209
17573
|
exports.EnrichedTextClass = EnrichedTextClass;
|
|
17210
17574
|
exports.GridClass = GridClass;
|
|
17575
|
+
exports.HybridFieldClass = HybridFieldClass;
|
|
17211
17576
|
exports.ImageClass = ImageClass;
|
|
17212
17577
|
exports.LinkClass = LinkClass;
|
|
17213
17578
|
exports.ListClass = ListClass;
|