@descope/web-components-ui 1.0.402 → 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 +1565 -1208
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/index.esm.js +1612 -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/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/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 {
|
|
@@ -11732,93 +11781,93 @@ const MultiSelectComboBoxClass = compose(
|
|
|
11732
11781
|
// Note: we exclude `placeholder` because the vaadin component observes it and
|
|
11733
11782
|
// tries to override it, causing us to lose the user set placeholder.
|
|
11734
11783
|
excludeAttrsSync: ['tabindex', 'size', 'data', 'placeholder'],
|
|
11735
|
-
componentName: componentName$
|
|
11784
|
+
componentName: componentName$n,
|
|
11736
11785
|
includeForwardProps: ['items', 'renderer', 'selectedItems'],
|
|
11737
11786
|
})
|
|
11738
11787
|
);
|
|
11739
11788
|
|
|
11740
11789
|
const globalRefs$f = getThemeRefs(globals);
|
|
11741
|
-
const vars$
|
|
11790
|
+
const vars$m = MultiSelectComboBoxClass.cssVarList;
|
|
11742
11791
|
|
|
11743
11792
|
const multiSelectComboBox = {
|
|
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$
|
|
11777
|
-
[vars$
|
|
11778
|
-
[vars$
|
|
11779
|
-
[vars$
|
|
11780
|
-
[vars$
|
|
11781
|
-
[vars$
|
|
11782
|
-
[vars$
|
|
11783
|
-
[vars$
|
|
11784
|
-
[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,
|
|
11785
11834
|
|
|
11786
11835
|
labelType: {
|
|
11787
11836
|
floating: {
|
|
11788
|
-
[vars$
|
|
11837
|
+
[vars$m.inputHorizontalPadding]: '0.25em',
|
|
11789
11838
|
_hasValue: {
|
|
11790
|
-
[vars$
|
|
11839
|
+
[vars$m.inputHorizontalPadding]: '0.45em',
|
|
11791
11840
|
},
|
|
11792
11841
|
},
|
|
11793
11842
|
},
|
|
11794
11843
|
|
|
11795
11844
|
_readonly: {
|
|
11796
|
-
[vars$
|
|
11845
|
+
[vars$m.inputDropdownButtonCursor]: 'default',
|
|
11797
11846
|
},
|
|
11798
11847
|
|
|
11799
11848
|
// Overlay theme exposed via the component:
|
|
11800
|
-
[vars$
|
|
11801
|
-
[vars$
|
|
11802
|
-
[vars$
|
|
11803
|
-
[vars$
|
|
11804
|
-
[vars$
|
|
11805
|
-
[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,
|
|
11806
11855
|
|
|
11807
11856
|
// Overlay direct theme:
|
|
11808
|
-
[vars$
|
|
11809
|
-
[vars$
|
|
11857
|
+
[vars$m.overlay.minHeight]: '400px',
|
|
11858
|
+
[vars$m.overlay.margin]: '0',
|
|
11810
11859
|
};
|
|
11811
11860
|
|
|
11812
11861
|
var multiSelectComboBox$1 = /*#__PURE__*/Object.freeze({
|
|
11813
11862
|
__proto__: null,
|
|
11814
11863
|
default: multiSelectComboBox,
|
|
11815
11864
|
multiSelectComboBox: multiSelectComboBox,
|
|
11816
|
-
vars: vars$
|
|
11865
|
+
vars: vars$m
|
|
11817
11866
|
});
|
|
11818
11867
|
|
|
11819
|
-
const componentName$
|
|
11868
|
+
const componentName$m = getComponentName('badge');
|
|
11820
11869
|
|
|
11821
|
-
class RawBadge extends createBaseClass({ componentName: componentName$
|
|
11870
|
+
class RawBadge extends createBaseClass({ componentName: componentName$m, baseSelector: ':host > div' }) {
|
|
11822
11871
|
constructor() {
|
|
11823
11872
|
super();
|
|
11824
11873
|
|
|
@@ -11870,65 +11919,65 @@ const BadgeClass = compose(
|
|
|
11870
11919
|
)(RawBadge);
|
|
11871
11920
|
|
|
11872
11921
|
const globalRefs$e = getThemeRefs(globals);
|
|
11873
|
-
const vars$
|
|
11922
|
+
const vars$l = BadgeClass.cssVarList;
|
|
11874
11923
|
|
|
11875
11924
|
const badge$2 = {
|
|
11876
|
-
[vars$
|
|
11877
|
-
[vars$
|
|
11925
|
+
[vars$l.hostWidth]: 'fit-content',
|
|
11926
|
+
[vars$l.hostDirection]: globalRefs$e.direction,
|
|
11878
11927
|
|
|
11879
|
-
[vars$
|
|
11928
|
+
[vars$l.textAlign]: 'center',
|
|
11880
11929
|
|
|
11881
|
-
[vars$
|
|
11882
|
-
[vars$
|
|
11930
|
+
[vars$l.fontFamily]: globalRefs$e.fonts.font1.family,
|
|
11931
|
+
[vars$l.fontWeight]: '400',
|
|
11883
11932
|
|
|
11884
|
-
[vars$
|
|
11885
|
-
[vars$
|
|
11933
|
+
[vars$l.verticalPadding]: '0.25em',
|
|
11934
|
+
[vars$l.horizontalPadding]: '0.5em',
|
|
11886
11935
|
|
|
11887
|
-
[vars$
|
|
11888
|
-
[vars$
|
|
11889
|
-
[vars$
|
|
11890
|
-
[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',
|
|
11891
11940
|
|
|
11892
11941
|
_fullWidth: {
|
|
11893
|
-
[vars$
|
|
11942
|
+
[vars$l.hostWidth]: '100%',
|
|
11894
11943
|
},
|
|
11895
11944
|
|
|
11896
11945
|
size: {
|
|
11897
|
-
xs: { [vars$
|
|
11898
|
-
sm: { [vars$
|
|
11899
|
-
md: { [vars$
|
|
11900
|
-
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' },
|
|
11901
11950
|
},
|
|
11902
11951
|
|
|
11903
11952
|
mode: {
|
|
11904
11953
|
default: {
|
|
11905
|
-
[vars$
|
|
11954
|
+
[vars$l.textColor]: globalRefs$e.colors.surface.dark,
|
|
11906
11955
|
_bordered: {
|
|
11907
|
-
[vars$
|
|
11956
|
+
[vars$l.borderColor]: globalRefs$e.colors.surface.light,
|
|
11908
11957
|
},
|
|
11909
11958
|
},
|
|
11910
11959
|
primary: {
|
|
11911
|
-
[vars$
|
|
11960
|
+
[vars$l.textColor]: globalRefs$e.colors.primary.main,
|
|
11912
11961
|
_bordered: {
|
|
11913
|
-
[vars$
|
|
11962
|
+
[vars$l.borderColor]: globalRefs$e.colors.primary.light,
|
|
11914
11963
|
},
|
|
11915
11964
|
},
|
|
11916
11965
|
secondary: {
|
|
11917
|
-
[vars$
|
|
11966
|
+
[vars$l.textColor]: globalRefs$e.colors.secondary.main,
|
|
11918
11967
|
_bordered: {
|
|
11919
|
-
[vars$
|
|
11968
|
+
[vars$l.borderColor]: globalRefs$e.colors.secondary.light,
|
|
11920
11969
|
},
|
|
11921
11970
|
},
|
|
11922
11971
|
error: {
|
|
11923
|
-
[vars$
|
|
11972
|
+
[vars$l.textColor]: globalRefs$e.colors.error.main,
|
|
11924
11973
|
_bordered: {
|
|
11925
|
-
[vars$
|
|
11974
|
+
[vars$l.borderColor]: globalRefs$e.colors.error.light,
|
|
11926
11975
|
},
|
|
11927
11976
|
},
|
|
11928
11977
|
success: {
|
|
11929
|
-
[vars$
|
|
11978
|
+
[vars$l.textColor]: globalRefs$e.colors.success.main,
|
|
11930
11979
|
_bordered: {
|
|
11931
|
-
[vars$
|
|
11980
|
+
[vars$l.borderColor]: globalRefs$e.colors.success.light,
|
|
11932
11981
|
},
|
|
11933
11982
|
},
|
|
11934
11983
|
},
|
|
@@ -11937,11 +11986,11 @@ const badge$2 = {
|
|
|
11937
11986
|
var badge$3 = /*#__PURE__*/Object.freeze({
|
|
11938
11987
|
__proto__: null,
|
|
11939
11988
|
default: badge$2,
|
|
11940
|
-
vars: vars$
|
|
11989
|
+
vars: vars$l
|
|
11941
11990
|
});
|
|
11942
11991
|
|
|
11943
|
-
const componentName$
|
|
11944
|
-
class RawAvatar extends createBaseClass({ componentName: componentName$
|
|
11992
|
+
const componentName$l = getComponentName('avatar');
|
|
11993
|
+
class RawAvatar extends createBaseClass({ componentName: componentName$l, baseSelector: ':host > .wrapper' }) {
|
|
11945
11994
|
constructor() {
|
|
11946
11995
|
super();
|
|
11947
11996
|
|
|
@@ -12080,21 +12129,21 @@ const avatar = {
|
|
|
12080
12129
|
},
|
|
12081
12130
|
};
|
|
12082
12131
|
|
|
12083
|
-
const vars$
|
|
12132
|
+
const vars$k = {
|
|
12084
12133
|
...compVars$1,
|
|
12085
12134
|
};
|
|
12086
12135
|
|
|
12087
12136
|
var avatar$1 = /*#__PURE__*/Object.freeze({
|
|
12088
12137
|
__proto__: null,
|
|
12089
12138
|
default: avatar,
|
|
12090
|
-
vars: vars$
|
|
12139
|
+
vars: vars$k
|
|
12091
12140
|
});
|
|
12092
12141
|
|
|
12093
|
-
const componentName$
|
|
12142
|
+
const componentName$k = getComponentName('mappings-field-internal');
|
|
12094
12143
|
|
|
12095
|
-
createBaseInputClass({ componentName: componentName$
|
|
12144
|
+
createBaseInputClass({ componentName: componentName$k, baseSelector: 'div' });
|
|
12096
12145
|
|
|
12097
|
-
const componentName$
|
|
12146
|
+
const componentName$j = getComponentName('mappings-field');
|
|
12098
12147
|
|
|
12099
12148
|
const customMixin$4 = (superclass) =>
|
|
12100
12149
|
class MappingsFieldMixinClass extends superclass {
|
|
@@ -12123,14 +12172,14 @@ const customMixin$4 = (superclass) =>
|
|
|
12123
12172
|
const template = document.createElement('template');
|
|
12124
12173
|
|
|
12125
12174
|
template.innerHTML = `
|
|
12126
|
-
<${componentName$
|
|
12175
|
+
<${componentName$k}
|
|
12127
12176
|
tabindex="-1"
|
|
12128
|
-
></${componentName$
|
|
12177
|
+
></${componentName$k}>
|
|
12129
12178
|
`;
|
|
12130
12179
|
|
|
12131
12180
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
|
12132
12181
|
|
|
12133
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
|
12182
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$k);
|
|
12134
12183
|
|
|
12135
12184
|
forwardAttrs(this, this.inputElement, {
|
|
12136
12185
|
includeAttrs: [
|
|
@@ -12262,47 +12311,47 @@ const MappingsFieldClass = compose(
|
|
|
12262
12311
|
'options',
|
|
12263
12312
|
'error-message',
|
|
12264
12313
|
],
|
|
12265
|
-
componentName: componentName$
|
|
12314
|
+
componentName: componentName$j,
|
|
12266
12315
|
})
|
|
12267
12316
|
);
|
|
12268
12317
|
|
|
12269
12318
|
const globalRefs$c = getThemeRefs(globals);
|
|
12270
12319
|
|
|
12271
|
-
const vars$
|
|
12320
|
+
const vars$j = MappingsFieldClass.cssVarList;
|
|
12272
12321
|
|
|
12273
12322
|
const mappingsField = {
|
|
12274
|
-
[vars$
|
|
12275
|
-
[vars$
|
|
12276
|
-
[vars$
|
|
12277
|
-
[vars$
|
|
12278
|
-
[vars$
|
|
12279
|
-
[vars$
|
|
12280
|
-
[vars$
|
|
12281
|
-
[vars$
|
|
12282
|
-
[vars$
|
|
12283
|
-
[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',
|
|
12284
12333
|
// To be positioned correctly, the min width has to match the text field min width
|
|
12285
|
-
[vars$
|
|
12334
|
+
[vars$j.valueLabelMinWidth]: refs.minWidth,
|
|
12286
12335
|
// To be positioned correctly, the min width has to match the combo box field min width
|
|
12287
|
-
[vars$
|
|
12288
|
-
[vars$
|
|
12289
|
-
[vars$
|
|
12336
|
+
[vars$j.attrLabelMinWidth]: `calc(12em + 2 * ${globalRefs$c.border.xs})`,
|
|
12337
|
+
[vars$j.separatorWidth]: '70px',
|
|
12338
|
+
[vars$j.removeButtonWidth]: '60px',
|
|
12290
12339
|
};
|
|
12291
12340
|
|
|
12292
12341
|
var mappingsField$1 = /*#__PURE__*/Object.freeze({
|
|
12293
12342
|
__proto__: null,
|
|
12294
12343
|
default: mappingsField,
|
|
12295
12344
|
mappingsField: mappingsField,
|
|
12296
|
-
vars: vars$
|
|
12345
|
+
vars: vars$j
|
|
12297
12346
|
});
|
|
12298
12347
|
|
|
12299
12348
|
var deleteIcon = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iMTgiIHZpZXdCb3g9IjAgMCAxNCAxOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEgMTZDMSAxNy4xIDEuOSAxOCAzIDE4SDExQzEyLjEgMTggMTMgMTcuMSAxMyAxNlY0SDFWMTZaTTMgNkgxMVYxNkgzVjZaTTEwLjUgMUw5LjUgMEg0LjVMMy41IDFIMFYzSDE0VjFIMTAuNVoiIGZpbGw9ImN1cnJlbnRjb2xvciIvPgo8L3N2Zz4K";
|
|
12300
12349
|
|
|
12301
12350
|
var editIcon = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTUiIGhlaWdodD0iMTUiIHZpZXdCb3g9IjAgMCAxNSAxNSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEwLjAwMDIgMC45OTIxNDlDMTAuMDAwMiAxLjAxNjE1IDEwLjAwMDIgMS4wMTYxNSAxMC4wMDAyIDEuMDE2MTVMOC4yMjQxOSAzLjAwODE1SDIuOTkyMTlDMi40NjQxOSAzLjAwODE1IDIuMDA4MTkgMy40NDAxNSAyLjAwODE5IDMuOTkyMTVWMTIuMDA4MkMyLjAwODE5IDEyLjUzNjIgMi40NDAxOSAxMi45OTIyIDIuOTkyMTkgMTIuOTkyMkg1LjUzNjE5QzUuODQ4MTkgMTMuMDQwMiA2LjE2MDE5IDEzLjA0MDIgNi40NzIxOSAxMi45OTIySDExLjAwODJDMTEuNTM2MiAxMi45OTIyIDExLjk5MjIgMTIuNTYwMiAxMS45OTIyIDEyLjAwODJWNy43ODQxNkwxMy45MzYyIDUuNjI0MTVMMTQuMDA4MiA1LjY3MjE1VjExLjk4NDJDMTQuMDA4MiAxMy42NjQyIDEyLjY2NDIgMTUuMDA4MiAxMS4wMDgyIDE1LjAwODJIMy4wMTYxOUMxLjMzNjE5IDE1LjAwODIgLTAuMDA3ODEyNSAxMy42NjQyIC0wLjAwNzgxMjUgMTEuOTg0MlYzLjk5MjE1Qy0wLjAwNzgxMjUgMi4zMzYxNSAxLjMzNjE5IDAuOTkyMTQ5IDMuMDE2MTkgMC45OTIxNDlIMTAuMDAwMlpNMTEuMjcyMiAyLjYyNDE1TDEyLjYxNjIgNC4xMTIxNUw3LjcyMDE5IDkuNjgwMTZDNy41MDQxOSA5LjkyMDE2IDYuODMyMTkgMTAuMjMyMiA1LjY4MDE5IDEwLjYxNjJDNS42NTYxOSAxMC42NDAyIDUuNjA4MTkgMTAuNjQwMiA1LjU2MDE5IDEwLjYxNjJDNS40NjQxOSAxMC41OTIyIDUuMzkyMTkgMTAuNDcyMiA1LjQ0MDE5IDEwLjM3NjJDNS43NTIxOSA5LjI0ODE2IDYuMDQwMTkgOC41NTIxNiA2LjI1NjE5IDguMzEyMTZMMTEuMjcyMiAyLjYyNDE1Wk0xMS45MjAyIDEuODU2MTVMMTMuMjg4MiAwLjMyMDE0OUMxMy42NDgyIC0wLjA4Nzg1MTYgMTQuMjcyMiAtMC4xMTE4NTIgMTQuNjgwMiAwLjI3MjE0OUMxNS4wODgyIDAuNjMyMTQ5IDE1LjExMjIgMS4yODAxNSAxNC43NTIyIDEuNjg4MTVMMTMuMjY0MiAzLjM2ODE1TDExLjkyMDIgMS44NTYxNVoiIGZpbGw9ImN1cnJlbnRjb2xvciIvPgo8L3N2Zz4K";
|
|
12302
12351
|
|
|
12303
|
-
const componentName$
|
|
12352
|
+
const componentName$i = getComponentName('user-attribute');
|
|
12304
12353
|
class RawUserAttribute extends createBaseClass({
|
|
12305
|
-
componentName: componentName$
|
|
12354
|
+
componentName: componentName$i,
|
|
12306
12355
|
baseSelector: ':host > .root',
|
|
12307
12356
|
}) {
|
|
12308
12357
|
constructor() {
|
|
@@ -12537,31 +12586,31 @@ const UserAttributeClass = compose(
|
|
|
12537
12586
|
)(RawUserAttribute);
|
|
12538
12587
|
|
|
12539
12588
|
const globalRefs$b = getThemeRefs(globals);
|
|
12540
|
-
const vars$
|
|
12589
|
+
const vars$i = UserAttributeClass.cssVarList;
|
|
12541
12590
|
|
|
12542
12591
|
const userAttribute = {
|
|
12543
|
-
[vars$
|
|
12544
|
-
[vars$
|
|
12545
|
-
[vars$
|
|
12546
|
-
[vars$
|
|
12547
|
-
[vars$
|
|
12548
|
-
[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',
|
|
12549
12598
|
_fullWidth: {
|
|
12550
|
-
[vars$
|
|
12599
|
+
[vars$i.hostWidth]: '100%',
|
|
12551
12600
|
},
|
|
12552
12601
|
};
|
|
12553
12602
|
|
|
12554
12603
|
var userAttribute$1 = /*#__PURE__*/Object.freeze({
|
|
12555
12604
|
__proto__: null,
|
|
12556
12605
|
default: userAttribute,
|
|
12557
|
-
vars: vars$
|
|
12606
|
+
vars: vars$i
|
|
12558
12607
|
});
|
|
12559
12608
|
|
|
12560
12609
|
var greenVIcon = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTggMEMzLjYgMCAwIDMuNiAwIDhDMCAxMi40IDMuNiAxNiA4IDE2QzEyLjQgMTYgMTYgMTIuNCAxNiA4QzE2IDMuNiAxMi40IDAgOCAwWk03LjEgMTEuN0wyLjkgNy42TDQuMyA2LjJMNyA4LjlMMTIgNEwxMy40IDUuNEw3LjEgMTEuN1oiIGZpbGw9IiM0Q0FGNTAiLz4KPC9zdmc+Cg==";
|
|
12561
12610
|
|
|
12562
|
-
const componentName$
|
|
12611
|
+
const componentName$h = getComponentName('user-auth-method');
|
|
12563
12612
|
class RawUserAuthMethod extends createBaseClass({
|
|
12564
|
-
componentName: componentName$
|
|
12613
|
+
componentName: componentName$h,
|
|
12565
12614
|
baseSelector: ':host > .root',
|
|
12566
12615
|
}) {
|
|
12567
12616
|
constructor() {
|
|
@@ -12755,31 +12804,31 @@ const UserAuthMethodClass = compose(
|
|
|
12755
12804
|
)(RawUserAuthMethod);
|
|
12756
12805
|
|
|
12757
12806
|
const globalRefs$a = getThemeRefs(globals);
|
|
12758
|
-
const vars$
|
|
12807
|
+
const vars$h = UserAuthMethodClass.cssVarList;
|
|
12759
12808
|
|
|
12760
12809
|
const userAuthMethod = {
|
|
12761
|
-
[vars$
|
|
12762
|
-
[vars$
|
|
12763
|
-
[vars$
|
|
12764
|
-
[vars$
|
|
12765
|
-
[vars$
|
|
12766
|
-
[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',
|
|
12767
12816
|
_fullWidth: {
|
|
12768
|
-
[vars$
|
|
12817
|
+
[vars$h.hostWidth]: '100%',
|
|
12769
12818
|
},
|
|
12770
12819
|
};
|
|
12771
12820
|
|
|
12772
12821
|
var userAuthMethod$1 = /*#__PURE__*/Object.freeze({
|
|
12773
12822
|
__proto__: null,
|
|
12774
12823
|
default: userAuthMethod,
|
|
12775
|
-
vars: vars$
|
|
12824
|
+
vars: vars$h
|
|
12776
12825
|
});
|
|
12777
12826
|
|
|
12778
|
-
const componentName$
|
|
12827
|
+
const componentName$g = getComponentName('saml-group-mappings-internal');
|
|
12779
12828
|
|
|
12780
|
-
createBaseInputClass({ componentName: componentName$
|
|
12829
|
+
createBaseInputClass({ componentName: componentName$g, baseSelector: '' });
|
|
12781
12830
|
|
|
12782
|
-
const componentName$
|
|
12831
|
+
const componentName$f = getComponentName('saml-group-mappings');
|
|
12783
12832
|
|
|
12784
12833
|
const customMixin$3 = (superclass) =>
|
|
12785
12834
|
class SamlGroupMappingsMixinClass extends superclass {
|
|
@@ -12789,14 +12838,14 @@ const customMixin$3 = (superclass) =>
|
|
|
12789
12838
|
const template = document.createElement('template');
|
|
12790
12839
|
|
|
12791
12840
|
template.innerHTML = `
|
|
12792
|
-
<${componentName$
|
|
12841
|
+
<${componentName$g}
|
|
12793
12842
|
tabindex="-1"
|
|
12794
|
-
></${componentName$
|
|
12843
|
+
></${componentName$g}>
|
|
12795
12844
|
`;
|
|
12796
12845
|
|
|
12797
12846
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
|
12798
12847
|
|
|
12799
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
|
12848
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$g);
|
|
12800
12849
|
|
|
12801
12850
|
forwardAttrs(this, this.inputElement, {
|
|
12802
12851
|
includeAttrs: [
|
|
@@ -12873,61 +12922,61 @@ const SamlGroupMappingsClass = compose(
|
|
|
12873
12922
|
'options',
|
|
12874
12923
|
'error-message',
|
|
12875
12924
|
],
|
|
12876
|
-
componentName: componentName$
|
|
12925
|
+
componentName: componentName$f,
|
|
12877
12926
|
})
|
|
12878
12927
|
);
|
|
12879
12928
|
|
|
12880
|
-
const vars$
|
|
12929
|
+
const vars$g = SamlGroupMappingsClass.cssVarList;
|
|
12881
12930
|
|
|
12882
12931
|
const samlGroupMappings = {
|
|
12883
|
-
[vars$
|
|
12884
|
-
[vars$
|
|
12885
|
-
[vars$
|
|
12932
|
+
[vars$g.hostWidth]: refs.width,
|
|
12933
|
+
[vars$g.hostDirection]: refs.direction,
|
|
12934
|
+
[vars$g.groupNameInputMarginBottom]: '1em',
|
|
12886
12935
|
};
|
|
12887
12936
|
|
|
12888
12937
|
var samlGroupMappings$1 = /*#__PURE__*/Object.freeze({
|
|
12889
12938
|
__proto__: null,
|
|
12890
12939
|
default: samlGroupMappings,
|
|
12891
12940
|
samlGroupMappings: samlGroupMappings,
|
|
12892
|
-
vars: vars$
|
|
12941
|
+
vars: vars$g
|
|
12893
12942
|
});
|
|
12894
12943
|
|
|
12895
12944
|
const globalRefs$9 = getThemeRefs(globals);
|
|
12896
|
-
const vars$
|
|
12945
|
+
const vars$f = PolicyValidationClass.cssVarList;
|
|
12897
12946
|
|
|
12898
12947
|
const policyValidation = {
|
|
12899
|
-
[vars$
|
|
12900
|
-
[vars$
|
|
12901
|
-
[vars$
|
|
12902
|
-
[vars$
|
|
12903
|
-
[vars$
|
|
12904
|
-
[vars$
|
|
12905
|
-
[vars$
|
|
12906
|
-
[vars$
|
|
12907
|
-
[vars$
|
|
12908
|
-
[vars$
|
|
12909
|
-
[vars$
|
|
12910
|
-
[vars$
|
|
12911
|
-
[vars$
|
|
12912
|
-
[vars$
|
|
12913
|
-
[vars$
|
|
12914
|
-
[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,
|
|
12915
12964
|
};
|
|
12916
12965
|
|
|
12917
12966
|
var policyValidation$1 = /*#__PURE__*/Object.freeze({
|
|
12918
12967
|
__proto__: null,
|
|
12919
12968
|
default: policyValidation,
|
|
12920
|
-
vars: vars$
|
|
12969
|
+
vars: vars$f
|
|
12921
12970
|
});
|
|
12922
12971
|
|
|
12923
|
-
const vars$
|
|
12972
|
+
const vars$e = IconClass.cssVarList;
|
|
12924
12973
|
|
|
12925
12974
|
const icon = {};
|
|
12926
12975
|
|
|
12927
12976
|
var icon$1 = /*#__PURE__*/Object.freeze({
|
|
12928
12977
|
__proto__: null,
|
|
12929
12978
|
default: icon,
|
|
12930
|
-
vars: vars$
|
|
12979
|
+
vars: vars$e
|
|
12931
12980
|
});
|
|
12932
12981
|
|
|
12933
12982
|
const decode = (input) => {
|
|
@@ -12940,9 +12989,9 @@ const tpl = (input, inline) => {
|
|
|
12940
12989
|
return inline ? input : `<pre>${input}</pre>`;
|
|
12941
12990
|
};
|
|
12942
12991
|
|
|
12943
|
-
const componentName$
|
|
12992
|
+
const componentName$e = getComponentName('code-snippet');
|
|
12944
12993
|
|
|
12945
|
-
let CodeSnippet$1 = class CodeSnippet extends createBaseClass({ componentName: componentName$
|
|
12994
|
+
let CodeSnippet$1 = class CodeSnippet extends createBaseClass({ componentName: componentName$e, baseSelector: ':host > code' }) {
|
|
12946
12995
|
static get observedAttributes() {
|
|
12947
12996
|
return ['lang', 'inline'];
|
|
12948
12997
|
}
|
|
@@ -13174,7 +13223,7 @@ const CodeSnippetClass = compose(
|
|
|
13174
13223
|
|
|
13175
13224
|
const globalRefs$8 = getThemeRefs(globals);
|
|
13176
13225
|
|
|
13177
|
-
const vars$
|
|
13226
|
+
const vars$d = CodeSnippetClass.cssVarList;
|
|
13178
13227
|
|
|
13179
13228
|
const light = {
|
|
13180
13229
|
color1: '#fa0',
|
|
@@ -13209,50 +13258,50 @@ const dark = {
|
|
|
13209
13258
|
};
|
|
13210
13259
|
|
|
13211
13260
|
const CodeSnippet = {
|
|
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$
|
|
13248
|
-
[vars$
|
|
13249
|
-
[vars$
|
|
13250
|
-
[vars$
|
|
13251
|
-
[vars$
|
|
13252
|
-
[vars$
|
|
13253
|
-
[vars$
|
|
13254
|
-
[vars$
|
|
13255
|
-
[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,
|
|
13256
13305
|
/* purposely ignored */
|
|
13257
13306
|
// [vars.charEscapeTextColor]: '',
|
|
13258
13307
|
// [vars.linkTextColor]: '',
|
|
@@ -13264,50 +13313,50 @@ const CodeSnippet = {
|
|
|
13264
13313
|
|
|
13265
13314
|
const codeSnippetDarkThemeOverrides = {
|
|
13266
13315
|
codeSnippet: {
|
|
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$
|
|
13303
|
-
[vars$
|
|
13304
|
-
[vars$
|
|
13305
|
-
[vars$
|
|
13306
|
-
[vars$
|
|
13307
|
-
[vars$
|
|
13308
|
-
[vars$
|
|
13309
|
-
[vars$
|
|
13310
|
-
[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,
|
|
13311
13360
|
},
|
|
13312
13361
|
};
|
|
13313
13362
|
|
|
@@ -13315,10 +13364,10 @@ var codeSnippet = /*#__PURE__*/Object.freeze({
|
|
|
13315
13364
|
__proto__: null,
|
|
13316
13365
|
codeSnippetDarkThemeOverrides: codeSnippetDarkThemeOverrides,
|
|
13317
13366
|
default: CodeSnippet,
|
|
13318
|
-
vars: vars$
|
|
13367
|
+
vars: vars$d
|
|
13319
13368
|
});
|
|
13320
13369
|
|
|
13321
|
-
const componentName$
|
|
13370
|
+
const componentName$d = getComponentName('radio-button');
|
|
13322
13371
|
|
|
13323
13372
|
const customMixin$2 = (superclass) =>
|
|
13324
13373
|
class CustomMixin extends superclass {
|
|
@@ -13383,11 +13432,11 @@ const RadioButtonClass = compose(
|
|
|
13383
13432
|
wrappedEleName: 'vaadin-radio-button',
|
|
13384
13433
|
excludeAttrsSync: ['tabindex', 'data'],
|
|
13385
13434
|
includeForwardProps: ['checked', 'name', 'disabled'],
|
|
13386
|
-
componentName: componentName$
|
|
13435
|
+
componentName: componentName$d,
|
|
13387
13436
|
})
|
|
13388
13437
|
);
|
|
13389
13438
|
|
|
13390
|
-
const componentName$
|
|
13439
|
+
const componentName$c = getComponentName('radio-group');
|
|
13391
13440
|
|
|
13392
13441
|
const RadioGroupMixin = (superclass) =>
|
|
13393
13442
|
class RadioGroupMixinClass extends superclass {
|
|
@@ -13402,12 +13451,12 @@ const RadioGroupMixin = (superclass) =>
|
|
|
13402
13451
|
|
|
13403
13452
|
// we are overriding vaadin children getter so it will run on our custom elements
|
|
13404
13453
|
Object.defineProperty(this.baseElement, 'children', {
|
|
13405
|
-
get: () => this.querySelectorAll(componentName$
|
|
13454
|
+
get: () => this.querySelectorAll(componentName$d),
|
|
13406
13455
|
});
|
|
13407
13456
|
|
|
13408
13457
|
// we are overriding vaadin __filterRadioButtons so it will run on our custom elements
|
|
13409
13458
|
this.baseElement.__filterRadioButtons = (nodes) => {
|
|
13410
|
-
return nodes.filter((node) => node.localName === componentName$
|
|
13459
|
+
return nodes.filter((node) => node.localName === componentName$d);
|
|
13411
13460
|
};
|
|
13412
13461
|
|
|
13413
13462
|
// vaadin radio group missing some input properties
|
|
@@ -13557,38 +13606,38 @@ const RadioGroupClass = compose(
|
|
|
13557
13606
|
`,
|
|
13558
13607
|
|
|
13559
13608
|
excludeAttrsSync: ['tabindex', 'size', 'data', 'direction'],
|
|
13560
|
-
componentName: componentName$
|
|
13609
|
+
componentName: componentName$c,
|
|
13561
13610
|
includeForwardProps: ['value'],
|
|
13562
13611
|
})
|
|
13563
13612
|
);
|
|
13564
13613
|
|
|
13565
|
-
const vars$
|
|
13614
|
+
const vars$c = RadioGroupClass.cssVarList;
|
|
13566
13615
|
const globalRefs$7 = getThemeRefs(globals);
|
|
13567
13616
|
|
|
13568
13617
|
const radioGroup = {
|
|
13569
|
-
[vars$
|
|
13570
|
-
[vars$
|
|
13571
|
-
[vars$
|
|
13572
|
-
[vars$
|
|
13573
|
-
[vars$
|
|
13574
|
-
[vars$
|
|
13575
|
-
[vars$
|
|
13576
|
-
[vars$
|
|
13577
|
-
[vars$
|
|
13578
|
-
[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,
|
|
13579
13628
|
|
|
13580
13629
|
textAlign: {
|
|
13581
|
-
right: { [vars$
|
|
13582
|
-
left: { [vars$
|
|
13583
|
-
center: { [vars$
|
|
13630
|
+
right: { [vars$c.inputTextAlign]: 'right' },
|
|
13631
|
+
left: { [vars$c.inputTextAlign]: 'left' },
|
|
13632
|
+
center: { [vars$c.inputTextAlign]: 'center' },
|
|
13584
13633
|
},
|
|
13585
13634
|
|
|
13586
13635
|
_fullWidth: {
|
|
13587
|
-
[vars$
|
|
13636
|
+
[vars$c.buttonsSpacing]: 'space-between',
|
|
13588
13637
|
},
|
|
13589
13638
|
|
|
13590
13639
|
_disabled: {
|
|
13591
|
-
[vars$
|
|
13640
|
+
[vars$c.itemsLabelColor]: globalRefs$7.colors.surface.light,
|
|
13592
13641
|
},
|
|
13593
13642
|
};
|
|
13594
13643
|
|
|
@@ -13596,24 +13645,24 @@ var radioGroup$1 = /*#__PURE__*/Object.freeze({
|
|
|
13596
13645
|
__proto__: null,
|
|
13597
13646
|
default: radioGroup,
|
|
13598
13647
|
radioGroup: radioGroup,
|
|
13599
|
-
vars: vars$
|
|
13648
|
+
vars: vars$c
|
|
13600
13649
|
});
|
|
13601
13650
|
|
|
13602
|
-
const vars$
|
|
13651
|
+
const vars$b = RadioButtonClass.cssVarList;
|
|
13603
13652
|
const globalRefs$6 = getThemeRefs(globals);
|
|
13604
13653
|
|
|
13605
13654
|
const radioButton = {
|
|
13606
|
-
[vars$
|
|
13607
|
-
[vars$
|
|
13608
|
-
[vars$
|
|
13609
|
-
[vars$
|
|
13610
|
-
[vars$
|
|
13611
|
-
[vars$
|
|
13612
|
-
[vars$
|
|
13613
|
-
[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,
|
|
13614
13663
|
|
|
13615
13664
|
_checked: {
|
|
13616
|
-
[vars$
|
|
13665
|
+
[vars$b.radioBackgroundColor]: globalRefs$6.colors.surface.contrast,
|
|
13617
13666
|
},
|
|
13618
13667
|
|
|
13619
13668
|
_hover: {
|
|
@@ -13622,16 +13671,16 @@ const radioButton = {
|
|
|
13622
13671
|
|
|
13623
13672
|
size: {
|
|
13624
13673
|
xs: {
|
|
13625
|
-
[vars$
|
|
13674
|
+
[vars$b.fontSize]: '12px',
|
|
13626
13675
|
},
|
|
13627
13676
|
sm: {
|
|
13628
|
-
[vars$
|
|
13677
|
+
[vars$b.fontSize]: '14px',
|
|
13629
13678
|
},
|
|
13630
13679
|
md: {
|
|
13631
|
-
[vars$
|
|
13680
|
+
[vars$b.fontSize]: '16px',
|
|
13632
13681
|
},
|
|
13633
13682
|
lg: {
|
|
13634
|
-
[vars$
|
|
13683
|
+
[vars$b.fontSize]: '18px',
|
|
13635
13684
|
},
|
|
13636
13685
|
},
|
|
13637
13686
|
};
|
|
@@ -13640,7 +13689,7 @@ var radioButton$1 = /*#__PURE__*/Object.freeze({
|
|
|
13640
13689
|
__proto__: null,
|
|
13641
13690
|
default: radioButton,
|
|
13642
13691
|
radioButton: radioButton,
|
|
13643
|
-
vars: vars$
|
|
13692
|
+
vars: vars$b
|
|
13644
13693
|
});
|
|
13645
13694
|
|
|
13646
13695
|
const SUPPORTED_FORMATS = ['MM/DD/YYYY', 'DD/MM/YYYY', 'YYYY/MM/DD'];
|
|
@@ -13958,7 +14007,7 @@ const nextMonth = (timestamp) => {
|
|
|
13958
14007
|
return date;
|
|
13959
14008
|
};
|
|
13960
14009
|
|
|
13961
|
-
const componentName$
|
|
14010
|
+
const componentName$b = getComponentName('calendar');
|
|
13962
14011
|
|
|
13963
14012
|
const observedAttrs$1 = [
|
|
13964
14013
|
'initial-value',
|
|
@@ -13975,7 +14024,7 @@ const observedAttrs$1 = [
|
|
|
13975
14024
|
|
|
13976
14025
|
const calendarUiAttrs = ['calendar-label-submit', 'calendar-label-cancel'];
|
|
13977
14026
|
|
|
13978
|
-
const BaseInputClass$1 = createBaseInputClass({ componentName: componentName$
|
|
14027
|
+
const BaseInputClass$1 = createBaseInputClass({ componentName: componentName$b, baseSelector: 'div' });
|
|
13979
14028
|
|
|
13980
14029
|
class RawCalendar extends BaseInputClass$1 {
|
|
13981
14030
|
static get observedAttributes() {
|
|
@@ -14590,92 +14639,92 @@ const CalendarClass = compose(
|
|
|
14590
14639
|
|
|
14591
14640
|
const globalRefs$5 = getThemeRefs(globals);
|
|
14592
14641
|
|
|
14593
|
-
const vars$
|
|
14642
|
+
const vars$a = CalendarClass.cssVarList;
|
|
14594
14643
|
|
|
14595
14644
|
const calendar = {
|
|
14596
|
-
[vars$
|
|
14597
|
-
[vars$
|
|
14598
|
-
[vars$
|
|
14645
|
+
[vars$a.fontFamily]: refs.fontFamily,
|
|
14646
|
+
[vars$a.fontSize]: refs.fontSize,
|
|
14647
|
+
[vars$a.hostDirection]: refs.direction,
|
|
14599
14648
|
|
|
14600
|
-
[vars$
|
|
14649
|
+
[vars$a.calendarPadding]: '1em',
|
|
14601
14650
|
|
|
14602
|
-
[vars$
|
|
14603
|
-
[vars$
|
|
14604
|
-
[vars$
|
|
14605
|
-
[vars$
|
|
14651
|
+
[vars$a.topNavVerticalPadding]: '1em',
|
|
14652
|
+
[vars$a.topNavAlignment]: 'space-between',
|
|
14653
|
+
[vars$a.topNavGap]: '0',
|
|
14654
|
+
[vars$a.topNavSelectorsGap]: '0.5em',
|
|
14606
14655
|
|
|
14607
|
-
[vars$
|
|
14608
|
-
[vars$
|
|
14609
|
-
[vars$
|
|
14610
|
-
[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',
|
|
14611
14660
|
|
|
14612
|
-
[vars$
|
|
14613
|
-
[vars$
|
|
14614
|
-
[vars$
|
|
14615
|
-
[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',
|
|
14616
14665
|
|
|
14617
|
-
[vars$
|
|
14618
|
-
[vars$
|
|
14666
|
+
[vars$a.yearInputWidth]: '6em',
|
|
14667
|
+
[vars$a.monthInputWidth]: '8em',
|
|
14619
14668
|
|
|
14620
|
-
[vars$
|
|
14621
|
-
[vars$
|
|
14669
|
+
[vars$a.navButtonSize]: '24px',
|
|
14670
|
+
[vars$a.navButtonCursor]: 'pointer',
|
|
14622
14671
|
|
|
14623
|
-
[vars$
|
|
14624
|
-
[vars$
|
|
14672
|
+
[vars$a.weekdayFontSize]: '0.875em',
|
|
14673
|
+
[vars$a.weekdayFontWeight]: '500',
|
|
14625
14674
|
|
|
14626
14675
|
// day table cell
|
|
14627
|
-
[vars$
|
|
14676
|
+
[vars$a.dayHeight]: '3.125em',
|
|
14628
14677
|
|
|
14629
14678
|
// day value
|
|
14630
|
-
[vars$
|
|
14631
|
-
[vars$
|
|
14632
|
-
[vars$
|
|
14633
|
-
[vars$
|
|
14634
|
-
[vars$
|
|
14635
|
-
[vars$
|
|
14636
|
-
[vars$
|
|
14637
|
-
[vars$
|
|
14638
|
-
[vars$
|
|
14639
|
-
[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,
|
|
14640
14689
|
|
|
14641
14690
|
// selected day
|
|
14642
|
-
[vars$
|
|
14643
|
-
[vars$
|
|
14691
|
+
[vars$a.daySelectedBackgroundColor]: globalRefs$5.colors.primary.main,
|
|
14692
|
+
[vars$a.daySelectedTextdColor]: globalRefs$5.colors.primary.contrast,
|
|
14644
14693
|
|
|
14645
14694
|
// disabled day (out of min/max range)
|
|
14646
|
-
[vars$
|
|
14695
|
+
[vars$a.dayDisabledTextdColor]: globalRefs$5.colors.surface.light,
|
|
14647
14696
|
|
|
14648
14697
|
// today
|
|
14649
|
-
[vars$
|
|
14650
|
-
[vars$
|
|
14651
|
-
[vars$
|
|
14698
|
+
[vars$a.currentDayBorderColor]: globalRefs$5.colors.surface.light,
|
|
14699
|
+
[vars$a.currentDayBorderWidth]: '1px',
|
|
14700
|
+
[vars$a.currentDayBorderStyle]: 'solid',
|
|
14652
14701
|
|
|
14653
14702
|
size: {
|
|
14654
|
-
xs: { [vars$
|
|
14655
|
-
sm: { [vars$
|
|
14656
|
-
md: { [vars$
|
|
14657
|
-
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' },
|
|
14658
14707
|
},
|
|
14659
14708
|
|
|
14660
|
-
[vars$
|
|
14709
|
+
[vars$a.navButtonRotation]: 'rotate(180deg)',
|
|
14661
14710
|
|
|
14662
14711
|
_disabled: {
|
|
14663
|
-
[vars$
|
|
14664
|
-
[vars$
|
|
14665
|
-
[vars$
|
|
14666
|
-
[vars$
|
|
14712
|
+
[vars$a.navButtonOpacity]: '0.5',
|
|
14713
|
+
[vars$a.dayBackgroundColorHover]: 'none',
|
|
14714
|
+
[vars$a.navButtonCursor]: 'default',
|
|
14715
|
+
[vars$a.dayCursor]: 'default',
|
|
14667
14716
|
},
|
|
14668
14717
|
|
|
14669
14718
|
_fullWidth: {
|
|
14670
|
-
[vars$
|
|
14671
|
-
[vars$
|
|
14719
|
+
[vars$a.hostWidth]: '100%',
|
|
14720
|
+
[vars$a.dayBlockAlign]: '0 auto',
|
|
14672
14721
|
},
|
|
14673
14722
|
};
|
|
14674
14723
|
|
|
14675
14724
|
var calendar$1 = /*#__PURE__*/Object.freeze({
|
|
14676
14725
|
__proto__: null,
|
|
14677
14726
|
default: calendar,
|
|
14678
|
-
vars: vars$
|
|
14727
|
+
vars: vars$a
|
|
14679
14728
|
});
|
|
14680
14729
|
|
|
14681
14730
|
const patterns = {
|
|
@@ -14809,12 +14858,12 @@ class DateCounter {
|
|
|
14809
14858
|
}
|
|
14810
14859
|
}
|
|
14811
14860
|
|
|
14812
|
-
const componentName$
|
|
14861
|
+
const componentName$a = getComponentName('date-field');
|
|
14813
14862
|
|
|
14814
14863
|
// we set baseSelector to `vaadin-popover` as a temporary hack, so our portalMixin will
|
|
14815
14864
|
// be able to process this component's overlay. The whole process needs refactoring as soon as possible.
|
|
14816
14865
|
const BASE_SELECTOR = 'vaadin-popover';
|
|
14817
|
-
const BaseInputClass = createBaseInputClass({ componentName: componentName$
|
|
14866
|
+
const BaseInputClass = createBaseInputClass({ componentName: componentName$a, baseSelector: BASE_SELECTOR });
|
|
14818
14867
|
|
|
14819
14868
|
const dateFieldAttrs = ['format', 'opened', 'initial-value', 'readonly'];
|
|
14820
14869
|
const calendarAttrs = ['years-range', 'calendar-months', 'calendar-weekdays'];
|
|
@@ -15489,31 +15538,31 @@ const globalRefs$4 = getThemeRefs(globals);
|
|
|
15489
15538
|
const shadowColor$1 = '#00000020';
|
|
15490
15539
|
const { shadow } = globalRefs$4;
|
|
15491
15540
|
|
|
15492
|
-
const vars$
|
|
15541
|
+
const vars$9 = DateFieldClass.cssVarList;
|
|
15493
15542
|
|
|
15494
15543
|
const dateField = {
|
|
15495
|
-
[vars$
|
|
15496
|
-
[vars$
|
|
15497
|
-
[vars$
|
|
15498
|
-
|
|
15499
|
-
[vars$
|
|
15500
|
-
[vars$
|
|
15501
|
-
[vars$
|
|
15502
|
-
[vars$
|
|
15503
|
-
[vars$
|
|
15504
|
-
[vars$
|
|
15505
|
-
[vars$
|
|
15506
|
-
[vars$
|
|
15507
|
-
[vars$
|
|
15508
|
-
|
|
15509
|
-
[vars$
|
|
15510
|
-
[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',
|
|
15511
15560
|
};
|
|
15512
15561
|
|
|
15513
15562
|
var dateField$1 = /*#__PURE__*/Object.freeze({
|
|
15514
15563
|
__proto__: null,
|
|
15515
15564
|
default: dateField,
|
|
15516
|
-
vars: vars$
|
|
15565
|
+
vars: vars$9
|
|
15517
15566
|
});
|
|
15518
15567
|
|
|
15519
15568
|
const activeableMixin = (superclass) =>
|
|
@@ -15531,7 +15580,7 @@ const activeableMixin = (superclass) =>
|
|
|
15531
15580
|
}
|
|
15532
15581
|
};
|
|
15533
15582
|
|
|
15534
|
-
const componentName$
|
|
15583
|
+
const componentName$9 = getComponentName('list-item');
|
|
15535
15584
|
|
|
15536
15585
|
const customMixin$1 = (superclass) =>
|
|
15537
15586
|
class ListItemMixinClass extends superclass {
|
|
@@ -15580,11 +15629,11 @@ const ListItemClass = compose(
|
|
|
15580
15629
|
componentNameValidationMixin,
|
|
15581
15630
|
customMixin$1,
|
|
15582
15631
|
activeableMixin
|
|
15583
|
-
)(createBaseClass({ componentName: componentName$
|
|
15632
|
+
)(createBaseClass({ componentName: componentName$9, baseSelector: 'slot' }));
|
|
15584
15633
|
|
|
15585
|
-
const componentName$
|
|
15634
|
+
const componentName$8 = getComponentName('list');
|
|
15586
15635
|
|
|
15587
|
-
class RawList extends createBaseClass({ componentName: componentName$
|
|
15636
|
+
class RawList extends createBaseClass({ componentName: componentName$8, baseSelector: '.wrapper' }) {
|
|
15588
15637
|
static get observedAttributes() {
|
|
15589
15638
|
return ['variant', 'readonly'];
|
|
15590
15639
|
}
|
|
@@ -15737,7 +15786,7 @@ const compVars = ListClass.cssVarList;
|
|
|
15737
15786
|
|
|
15738
15787
|
const [helperTheme, helperRefs, helperVars] = createHelperVars(
|
|
15739
15788
|
{ shadowColor: '#00000020' },
|
|
15740
|
-
componentName$
|
|
15789
|
+
componentName$8
|
|
15741
15790
|
);
|
|
15742
15791
|
|
|
15743
15792
|
const { shadowColor } = helperRefs;
|
|
@@ -15777,7 +15826,7 @@ const list$1 = {
|
|
|
15777
15826
|
},
|
|
15778
15827
|
};
|
|
15779
15828
|
|
|
15780
|
-
const vars$
|
|
15829
|
+
const vars$8 = {
|
|
15781
15830
|
...compVars,
|
|
15782
15831
|
...helperVars,
|
|
15783
15832
|
};
|
|
@@ -15785,49 +15834,49 @@ const vars$7 = {
|
|
|
15785
15834
|
var list$2 = /*#__PURE__*/Object.freeze({
|
|
15786
15835
|
__proto__: null,
|
|
15787
15836
|
default: list$1,
|
|
15788
|
-
vars: vars$
|
|
15837
|
+
vars: vars$8
|
|
15789
15838
|
});
|
|
15790
15839
|
|
|
15791
15840
|
const globalRefs$2 = getThemeRefs(globals);
|
|
15792
15841
|
|
|
15793
|
-
const vars$
|
|
15842
|
+
const vars$7 = ListItemClass.cssVarList;
|
|
15794
15843
|
|
|
15795
15844
|
const list = {
|
|
15796
|
-
[vars$
|
|
15797
|
-
[vars$
|
|
15798
|
-
[vars$
|
|
15799
|
-
[vars$
|
|
15800
|
-
[vars$
|
|
15801
|
-
[vars$
|
|
15802
|
-
[vars$
|
|
15803
|
-
[vars$
|
|
15804
|
-
[vars$
|
|
15805
|
-
[vars$
|
|
15806
|
-
[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',
|
|
15807
15856
|
|
|
15808
15857
|
variant: {
|
|
15809
15858
|
tile: {
|
|
15810
|
-
[vars$
|
|
15811
|
-
[vars$
|
|
15812
|
-
[vars$
|
|
15859
|
+
[vars$7.alignItems]: 'flex-start',
|
|
15860
|
+
[vars$7.flexDirection]: 'column',
|
|
15861
|
+
[vars$7.borderColor]: globalRefs$2.colors.surface.light,
|
|
15813
15862
|
},
|
|
15814
15863
|
},
|
|
15815
15864
|
|
|
15816
15865
|
_hover: {
|
|
15817
|
-
[vars$
|
|
15866
|
+
[vars$7.backgroundColor]: globalRefs$2.colors.surface.highlight,
|
|
15818
15867
|
},
|
|
15819
15868
|
|
|
15820
15869
|
_active: {
|
|
15821
|
-
[vars$
|
|
15822
|
-
[vars$
|
|
15823
|
-
[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}`,
|
|
15824
15873
|
},
|
|
15825
15874
|
};
|
|
15826
15875
|
|
|
15827
15876
|
var listItem = /*#__PURE__*/Object.freeze({
|
|
15828
15877
|
__proto__: null,
|
|
15829
15878
|
default: list,
|
|
15830
|
-
vars: vars$
|
|
15879
|
+
vars: vars$7
|
|
15831
15880
|
});
|
|
15832
15881
|
|
|
15833
15882
|
const defaultValidateSchema = () => true;
|
|
@@ -15929,7 +15978,7 @@ const createDynamicDataMixin =
|
|
|
15929
15978
|
}
|
|
15930
15979
|
};
|
|
15931
15980
|
|
|
15932
|
-
const componentName$
|
|
15981
|
+
const componentName$7 = getComponentName('apps-list');
|
|
15933
15982
|
|
|
15934
15983
|
const limitAbbreviation = (str, limit = 2) =>
|
|
15935
15984
|
str
|
|
@@ -15991,7 +16040,7 @@ const AppsListClass = compose(
|
|
|
15991
16040
|
slots: ['empty-state'],
|
|
15992
16041
|
wrappedEleName: 'descope-list',
|
|
15993
16042
|
excludeAttrsSync: ['tabindex', 'class', 'empty'],
|
|
15994
|
-
componentName: componentName$
|
|
16043
|
+
componentName: componentName$7,
|
|
15995
16044
|
style: () => `
|
|
15996
16045
|
:host {
|
|
15997
16046
|
width: 100%;
|
|
@@ -16016,33 +16065,33 @@ const AppsListClass = compose(
|
|
|
16016
16065
|
})
|
|
16017
16066
|
);
|
|
16018
16067
|
|
|
16019
|
-
const vars$
|
|
16068
|
+
const vars$6 = AppsListClass.cssVarList;
|
|
16020
16069
|
const globalRefs$1 = getThemeRefs(globals);
|
|
16021
16070
|
|
|
16022
16071
|
const defaultHeight = '400px';
|
|
16023
16072
|
|
|
16024
16073
|
const appsList = {
|
|
16025
|
-
[vars$
|
|
16026
|
-
[vars$
|
|
16027
|
-
[vars$
|
|
16028
|
-
[vars$
|
|
16074
|
+
[vars$6.itemsFontWeight]: 'normal',
|
|
16075
|
+
[vars$6.itemsTextAlign]: 'start',
|
|
16076
|
+
[vars$6.hostDirection]: globalRefs$1.direction,
|
|
16077
|
+
[vars$6.maxHeight]: defaultHeight,
|
|
16029
16078
|
|
|
16030
16079
|
_empty: {
|
|
16031
|
-
[vars$
|
|
16080
|
+
[vars$6.minHeight]: defaultHeight,
|
|
16032
16081
|
},
|
|
16033
16082
|
|
|
16034
16083
|
size: {
|
|
16035
16084
|
xs: {
|
|
16036
|
-
[vars$
|
|
16085
|
+
[vars$6.itemsFontSize]: '14px',
|
|
16037
16086
|
},
|
|
16038
16087
|
sm: {
|
|
16039
|
-
[vars$
|
|
16088
|
+
[vars$6.itemsFontSize]: '14px',
|
|
16040
16089
|
},
|
|
16041
16090
|
md: {
|
|
16042
|
-
[vars$
|
|
16091
|
+
[vars$6.itemsFontSize]: '16px',
|
|
16043
16092
|
},
|
|
16044
16093
|
lg: {
|
|
16045
|
-
[vars$
|
|
16094
|
+
[vars$6.itemsFontSize]: '20px',
|
|
16046
16095
|
},
|
|
16047
16096
|
},
|
|
16048
16097
|
};
|
|
@@ -16050,10 +16099,10 @@ const appsList = {
|
|
|
16050
16099
|
var appsList$1 = /*#__PURE__*/Object.freeze({
|
|
16051
16100
|
__proto__: null,
|
|
16052
16101
|
default: appsList,
|
|
16053
|
-
vars: vars$
|
|
16102
|
+
vars: vars$6
|
|
16054
16103
|
});
|
|
16055
16104
|
|
|
16056
|
-
const componentName$
|
|
16105
|
+
const componentName$6 = getComponentName('scopes-list');
|
|
16057
16106
|
const variants = ['checkbox', 'switch'];
|
|
16058
16107
|
|
|
16059
16108
|
const itemRenderer = ({ id, desc, required = false }, _, ref) => {
|
|
@@ -16072,7 +16121,7 @@ const itemRenderer = ({ id, desc, required = false }, _, ref) => {
|
|
|
16072
16121
|
`;
|
|
16073
16122
|
};
|
|
16074
16123
|
|
|
16075
|
-
class RawScopesList extends createBaseClass({ componentName: componentName$
|
|
16124
|
+
class RawScopesList extends createBaseClass({ componentName: componentName$6, baseSelector: 'div' }) {
|
|
16076
16125
|
constructor() {
|
|
16077
16126
|
super();
|
|
16078
16127
|
|
|
@@ -16177,28 +16226,28 @@ const ScopesListClass = compose(
|
|
|
16177
16226
|
componentNameValidationMixin
|
|
16178
16227
|
)(RawScopesList);
|
|
16179
16228
|
|
|
16180
|
-
const vars$
|
|
16229
|
+
const vars$5 = ScopesListClass.cssVarList;
|
|
16181
16230
|
|
|
16182
16231
|
const scopesList = {
|
|
16183
|
-
[vars$
|
|
16184
|
-
[vars$
|
|
16185
|
-
[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',
|
|
16186
16235
|
_fullWidth: {
|
|
16187
|
-
[vars$
|
|
16236
|
+
[vars$5.hostWidth]: '100%',
|
|
16188
16237
|
},
|
|
16189
16238
|
};
|
|
16190
16239
|
|
|
16191
16240
|
var scopesList$1 = /*#__PURE__*/Object.freeze({
|
|
16192
16241
|
__proto__: null,
|
|
16193
16242
|
default: scopesList,
|
|
16194
|
-
vars: vars$
|
|
16243
|
+
vars: vars$5
|
|
16195
16244
|
});
|
|
16196
16245
|
|
|
16197
16246
|
var arrowsImg = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjkiIGhlaWdodD0iMjgiIHZpZXdCb3g9IjAgMCAyOSAyOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTkuMTQ0OTIgMTUuNjQ1TDcuNDk5OTIgMTRMMi44MzMyNSAxOC42NjY3TDcuNDk5OTIgMjMuMzMzM0w5LjE0NDkyIDIxLjY4ODNMNy4zMDE1OSAxOS44MzMzSDI0Ljk5OTlWMTcuNUg3LjMwMTU5TDkuMTQ0OTIgMTUuNjQ1WiIgZmlsbD0iIzYzNkM3NCIvPgo8cGF0aCBkPSJNMTkuODU1IDEyLjM1NTNMMjEuNSAxNC4wMDAzTDI2LjE2NjcgOS4zMzM2NkwyMS41IDQuNjY2OTlMMTkuODU1IDYuMzExOTlMMjEuNjk4MyA4LjE2Njk5SDRWMTAuNTAwM0gyMS42OTgzTDE5Ljg1NSAxMi4zNTUzWiIgZmlsbD0iIzYzNkM3NCIvPgo8L3N2Zz4K";
|
|
16198
16247
|
|
|
16199
|
-
const componentName$
|
|
16248
|
+
const componentName$5 = getComponentName('third-party-app-logo');
|
|
16200
16249
|
class RawThirdPartyAppLogoClass extends createBaseClass({
|
|
16201
|
-
componentName: componentName$
|
|
16250
|
+
componentName: componentName$5,
|
|
16202
16251
|
baseSelector: '.wrapper',
|
|
16203
16252
|
}) {
|
|
16204
16253
|
constructor() {
|
|
@@ -16293,31 +16342,31 @@ const ThirdPartyAppLogoClass = compose(
|
|
|
16293
16342
|
)(RawThirdPartyAppLogoClass);
|
|
16294
16343
|
|
|
16295
16344
|
const globalRefs = getThemeRefs(globals);
|
|
16296
|
-
const vars$
|
|
16345
|
+
const vars$4 = ThirdPartyAppLogoClass.cssVarList;
|
|
16297
16346
|
|
|
16298
16347
|
const thirdPartyAppLogo = {
|
|
16299
|
-
[vars$
|
|
16300
|
-
[vars$
|
|
16301
|
-
[vars$
|
|
16348
|
+
[vars$4.gap]: globalRefs.spacing.lg,
|
|
16349
|
+
[vars$4.arrowsColor]: globalRefs.colors.surface.dark,
|
|
16350
|
+
[vars$4.thirdPartyAppLogoFallback]:
|
|
16302
16351
|
'url(https://imgs.descope.com/components/third-party-app-logo-placeholder.svg)',
|
|
16303
|
-
[vars$
|
|
16352
|
+
[vars$4.companyLogoFallback]:
|
|
16304
16353
|
'url(https://imgs.descope.com/components/project-logo-placeholder.svg)',
|
|
16305
16354
|
size: {
|
|
16306
16355
|
xs: {
|
|
16307
|
-
[vars$
|
|
16308
|
-
[vars$
|
|
16356
|
+
[vars$4.logoMaxHeight]: '30px',
|
|
16357
|
+
[vars$4.logoMaxWidth]: '120px',
|
|
16309
16358
|
},
|
|
16310
16359
|
sm: {
|
|
16311
|
-
[vars$
|
|
16312
|
-
[vars$
|
|
16360
|
+
[vars$4.logoMaxHeight]: '40px',
|
|
16361
|
+
[vars$4.logoMaxWidth]: '160px',
|
|
16313
16362
|
},
|
|
16314
16363
|
md: {
|
|
16315
|
-
[vars$
|
|
16316
|
-
[vars$
|
|
16364
|
+
[vars$4.logoMaxHeight]: '48px',
|
|
16365
|
+
[vars$4.logoMaxWidth]: '200px',
|
|
16317
16366
|
},
|
|
16318
16367
|
lg: {
|
|
16319
|
-
[vars$
|
|
16320
|
-
[vars$
|
|
16368
|
+
[vars$4.logoMaxHeight]: '60px',
|
|
16369
|
+
[vars$4.logoMaxWidth]: '240px',
|
|
16321
16370
|
},
|
|
16322
16371
|
},
|
|
16323
16372
|
};
|
|
@@ -16325,10 +16374,10 @@ const thirdPartyAppLogo = {
|
|
|
16325
16374
|
var thirdPartyAppLogo$1 = /*#__PURE__*/Object.freeze({
|
|
16326
16375
|
__proto__: null,
|
|
16327
16376
|
default: thirdPartyAppLogo,
|
|
16328
|
-
vars: vars$
|
|
16377
|
+
vars: vars$4
|
|
16329
16378
|
});
|
|
16330
16379
|
|
|
16331
|
-
const componentName$
|
|
16380
|
+
const componentName$4 = getComponentName('security-questions-setup');
|
|
16332
16381
|
|
|
16333
16382
|
const attrsToSync$1 = [
|
|
16334
16383
|
'full-width',
|
|
@@ -16344,7 +16393,7 @@ const attrsToSync$1 = [
|
|
|
16344
16393
|
];
|
|
16345
16394
|
|
|
16346
16395
|
const attrsToReRender$1 = ['count', 'questions'];
|
|
16347
|
-
class RawSecurityQuestionsSetup extends createBaseClass({ componentName: componentName$
|
|
16396
|
+
class RawSecurityQuestionsSetup extends createBaseClass({ componentName: componentName$4, baseSelector: 'div' }) {
|
|
16348
16397
|
constructor() {
|
|
16349
16398
|
super();
|
|
16350
16399
|
|
|
@@ -16451,7 +16500,7 @@ class RawSecurityQuestionsSetup extends createBaseClass({ componentName: compone
|
|
|
16451
16500
|
return JSON.parse(this.getAttribute('questions')) || [];
|
|
16452
16501
|
} catch (e) {
|
|
16453
16502
|
// eslint-disable-next-line no-console
|
|
16454
|
-
console.error(componentName$
|
|
16503
|
+
console.error(componentName$4, 'Error parsing questions attribute', e);
|
|
16455
16504
|
return [];
|
|
16456
16505
|
}
|
|
16457
16506
|
}
|
|
@@ -16559,22 +16608,22 @@ const SecurityQuestionsSetupClass = compose(
|
|
|
16559
16608
|
componentNameValidationMixin
|
|
16560
16609
|
)(RawSecurityQuestionsSetup);
|
|
16561
16610
|
|
|
16562
|
-
const vars$
|
|
16611
|
+
const vars$3 = SecurityQuestionsSetupClass.cssVarList;
|
|
16563
16612
|
|
|
16564
16613
|
const securityQuestionsSetup = {
|
|
16565
|
-
[vars$
|
|
16614
|
+
[vars$3.hostWidth]: 'fit-content',
|
|
16566
16615
|
_fullWidth: {
|
|
16567
|
-
[vars$
|
|
16616
|
+
[vars$3.hostWidth]: '100%',
|
|
16568
16617
|
},
|
|
16569
16618
|
};
|
|
16570
16619
|
|
|
16571
16620
|
var securityQuestionsSetup$1 = /*#__PURE__*/Object.freeze({
|
|
16572
16621
|
__proto__: null,
|
|
16573
16622
|
default: securityQuestionsSetup,
|
|
16574
|
-
vars: vars$
|
|
16623
|
+
vars: vars$3
|
|
16575
16624
|
});
|
|
16576
16625
|
|
|
16577
|
-
const componentName$
|
|
16626
|
+
const componentName$3 = getComponentName('security-questions-verify');
|
|
16578
16627
|
|
|
16579
16628
|
const textFieldsAttrs = [
|
|
16580
16629
|
'full-width',
|
|
@@ -16595,7 +16644,7 @@ const attrMappings = {
|
|
|
16595
16644
|
const attrsToSync = [...textFieldsAttrs, ...textsAttrs];
|
|
16596
16645
|
|
|
16597
16646
|
const attrsToReRender = ['questions'];
|
|
16598
|
-
class RawSecurityQuestionsVerify extends createBaseClass({ componentName: componentName$
|
|
16647
|
+
class RawSecurityQuestionsVerify extends createBaseClass({ componentName: componentName$3, baseSelector: 'div' }) {
|
|
16599
16648
|
constructor() {
|
|
16600
16649
|
super();
|
|
16601
16650
|
|
|
@@ -16666,7 +16715,7 @@ class RawSecurityQuestionsVerify extends createBaseClass({ componentName: compon
|
|
|
16666
16715
|
return JSON.parse(this.getAttribute('questions')) || [];
|
|
16667
16716
|
} catch (e) {
|
|
16668
16717
|
// eslint-disable-next-line no-console
|
|
16669
|
-
console.error(componentName$
|
|
16718
|
+
console.error(componentName$3, 'Error parsing questions attribute', e);
|
|
16670
16719
|
return [];
|
|
16671
16720
|
}
|
|
16672
16721
|
}
|
|
@@ -16776,21 +16825,327 @@ const SecurityQuestionsVerifyClass = compose(
|
|
|
16776
16825
|
componentNameValidationMixin
|
|
16777
16826
|
)(RawSecurityQuestionsVerify);
|
|
16778
16827
|
|
|
16779
|
-
const vars$
|
|
16828
|
+
const vars$2 = SecurityQuestionsVerifyClass.cssVarList;
|
|
16780
16829
|
|
|
16781
16830
|
const securityQuestionsVerify = {
|
|
16782
|
-
[vars$
|
|
16783
|
-
[vars$
|
|
16831
|
+
[vars$2.hostWidth]: 'min-content',
|
|
16832
|
+
[vars$2.questionCursor]: 'pointer',
|
|
16784
16833
|
_fullWidth: {
|
|
16785
|
-
[vars$
|
|
16834
|
+
[vars$2.hostWidth]: '100%',
|
|
16786
16835
|
},
|
|
16787
|
-
[vars$
|
|
16788
|
-
[vars$
|
|
16836
|
+
[vars$2.questionFontSize]: refs.fontSize,
|
|
16837
|
+
[vars$2.questionFontFamily]: refs.fontFamily,
|
|
16789
16838
|
};
|
|
16790
16839
|
|
|
16791
16840
|
var securityQuestionsVerify$1 = /*#__PURE__*/Object.freeze({
|
|
16792
16841
|
__proto__: null,
|
|
16793
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,
|
|
16794
17149
|
vars: vars$1
|
|
16795
17150
|
});
|
|
16796
17151
|
|
|
@@ -16848,6 +17203,7 @@ const components = {
|
|
|
16848
17203
|
thirdPartyAppLogo: thirdPartyAppLogo$1,
|
|
16849
17204
|
securityQuestionsSetup: securityQuestionsSetup$1,
|
|
16850
17205
|
securityQuestionsVerify: securityQuestionsVerify$1,
|
|
17206
|
+
hybridField: hybridField$1,
|
|
16851
17207
|
};
|
|
16852
17208
|
|
|
16853
17209
|
const theme = Object.keys(components).reduce(
|
|
@@ -16860,7 +17216,7 @@ const vars = Object.keys(components).reduce(
|
|
|
16860
17216
|
);
|
|
16861
17217
|
|
|
16862
17218
|
const defaultTheme = { globals, components: theme };
|
|
16863
|
-
const themeVars = { globals: vars$
|
|
17219
|
+
const themeVars = { globals: vars$T, components: vars };
|
|
16864
17220
|
|
|
16865
17221
|
const colors = {
|
|
16866
17222
|
surface: {
|
|
@@ -17216,6 +17572,7 @@ exports.DividerClass = DividerClass;
|
|
|
17216
17572
|
exports.EmailFieldClass = EmailFieldClass;
|
|
17217
17573
|
exports.EnrichedTextClass = EnrichedTextClass;
|
|
17218
17574
|
exports.GridClass = GridClass;
|
|
17575
|
+
exports.HybridFieldClass = HybridFieldClass;
|
|
17219
17576
|
exports.ImageClass = ImageClass;
|
|
17220
17577
|
exports.LinkClass = LinkClass;
|
|
17221
17578
|
exports.ListClass = ListClass;
|