@descope/web-components-ui 1.0.387 → 1.0.389
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 +1318 -1209
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/index.esm.js +1267 -1157
- package/dist/index.esm.js.map +1 -1
- package/dist/umd/5459.js +1 -1
- package/dist/umd/DescopeDev.js +1 -1
- package/dist/umd/boolean-fields-descope-checkbox-index-js.js +1 -1
- package/dist/umd/boolean-fields-descope-switch-toggle-index-js.js +1 -1
- package/dist/umd/descope-apps-list-index-js.js +1 -1
- package/dist/umd/descope-date-field-index-js.js +1 -1
- package/dist/umd/descope-email-field-index-js.js +1 -1
- package/dist/umd/descope-grid-descope-grid-selection-column-index-js.js +1 -1
- package/dist/umd/descope-grid-index-js.js +1 -1
- package/dist/umd/descope-new-password-index-js.js +1 -1
- package/dist/umd/descope-number-field-index-js.js +1 -1
- package/dist/umd/descope-passcode-index-js.js +1 -1
- package/dist/umd/descope-radio-group-index-js.js +1 -1
- package/dist/umd/descope-scopes-list-index-js.js +2 -0
- package/dist/umd/descope-scopes-list-index-js.js.LICENSE.txt +5 -0
- package/dist/umd/descope-text-field-index-js.js +1 -1
- package/dist/umd/index.js +1 -1
- package/dist/umd/mapping-fields-descope-mappings-field-index-js.js +1 -1
- package/package.json +1 -1
- package/src/components/boolean-fields/commonStyles.js +1 -2
- package/src/components/boolean-fields/descope-checkbox/CheckboxClass.js +6 -0
- package/src/components/descope-date-field/DateFieldClass.js +6 -1
- package/src/components/descope-scopes-list/ScopesListClass.js +111 -0
- package/src/components/descope-scopes-list/index.js +7 -0
- package/src/components/descope-text-field/textFieldMappings.js +1 -0
- package/src/index.cjs.js +1 -0
- package/src/index.js +1 -0
- package/src/mixins/createDynamicDataMixin.js +9 -28
- package/src/theme/components/checkbox.js +1 -8
- package/src/theme/components/dateField.js +3 -1
- package/src/theme/components/index.js +2 -0
- package/src/theme/components/scopesList.js +15 -0
package/dist/cjs/index.cjs.js
CHANGED
@@ -643,7 +643,7 @@ const globals = {
|
|
643
643
|
fonts,
|
644
644
|
direction,
|
645
645
|
};
|
646
|
-
const vars$
|
646
|
+
const vars$P = getThemeVars(globals);
|
647
647
|
|
648
648
|
const createCssVar = (varName, fallback) => `var(${varName}${fallback ? `, ${fallback}` : ''})`;
|
649
649
|
|
@@ -2935,9 +2935,9 @@ const createIcon = async (src) => {
|
|
2935
2935
|
|
2936
2936
|
/* eslint-disable no-use-before-define */
|
2937
2937
|
|
2938
|
-
const componentName$
|
2938
|
+
const componentName$Y = getComponentName('icon');
|
2939
2939
|
|
2940
|
-
class RawIcon extends createBaseClass({ componentName: componentName$
|
2940
|
+
class RawIcon extends createBaseClass({ componentName: componentName$Y, baseSelector: 'slot' }) {
|
2941
2941
|
static get observedAttributes() {
|
2942
2942
|
return ['src'];
|
2943
2943
|
}
|
@@ -3022,7 +3022,7 @@ const clickableMixin = (superclass) =>
|
|
3022
3022
|
}
|
3023
3023
|
};
|
3024
3024
|
|
3025
|
-
const componentName$
|
3025
|
+
const componentName$X = getComponentName('button');
|
3026
3026
|
|
3027
3027
|
const resetStyles = `
|
3028
3028
|
:host {
|
@@ -3138,7 +3138,7 @@ const ButtonClass = compose(
|
|
3138
3138
|
}
|
3139
3139
|
`,
|
3140
3140
|
excludeAttrsSync: ['tabindex'],
|
3141
|
-
componentName: componentName$
|
3141
|
+
componentName: componentName$X,
|
3142
3142
|
})
|
3143
3143
|
);
|
3144
3144
|
|
@@ -3186,7 +3186,7 @@ const mode = {
|
|
3186
3186
|
surface: globalRefs$x.colors.surface,
|
3187
3187
|
};
|
3188
3188
|
|
3189
|
-
const [helperTheme$4, helperRefs$4, helperVars$4] = createHelperVars({ mode }, componentName$
|
3189
|
+
const [helperTheme$4, helperRefs$4, helperVars$4] = createHelperVars({ mode }, componentName$X);
|
3190
3190
|
|
3191
3191
|
const button = {
|
3192
3192
|
...helperTheme$4,
|
@@ -3298,7 +3298,7 @@ const button = {
|
|
3298
3298
|
},
|
3299
3299
|
};
|
3300
3300
|
|
3301
|
-
const vars$
|
3301
|
+
const vars$O = {
|
3302
3302
|
...compVars$6,
|
3303
3303
|
...helperVars$4,
|
3304
3304
|
};
|
@@ -3306,7 +3306,7 @@ const vars$N = {
|
|
3306
3306
|
var button$1 = /*#__PURE__*/Object.freeze({
|
3307
3307
|
__proto__: null,
|
3308
3308
|
default: button,
|
3309
|
-
vars: vars$
|
3309
|
+
vars: vars$O
|
3310
3310
|
});
|
3311
3311
|
|
3312
3312
|
const {
|
@@ -3366,6 +3366,7 @@ var textFieldMappings = {
|
|
3366
3366
|
hostWidth: { ...host$n, property: 'width' },
|
3367
3367
|
hostMinWidth: { ...host$n, property: 'min-width' },
|
3368
3368
|
hostDirection: { ...host$n, property: 'direction' },
|
3369
|
+
inputDirection: { ...input$1, property: 'direction' },
|
3369
3370
|
|
3370
3371
|
inputBackgroundColor: [
|
3371
3372
|
{ ...inputField$6, property: 'background-color' },
|
@@ -3599,7 +3600,7 @@ const inputFloatingLabelStyle = () => {
|
|
3599
3600
|
`;
|
3600
3601
|
};
|
3601
3602
|
|
3602
|
-
const componentName$
|
3603
|
+
const componentName$W = getComponentName('text-field');
|
3603
3604
|
|
3604
3605
|
const observedAttrs$2 = ['type', 'label-type', 'copy-to-clipboard'];
|
3605
3606
|
|
@@ -3721,14 +3722,14 @@ const TextFieldClass = compose(
|
|
3721
3722
|
}
|
3722
3723
|
`,
|
3723
3724
|
excludeAttrsSync: ['tabindex'],
|
3724
|
-
componentName: componentName$
|
3725
|
+
componentName: componentName$W,
|
3725
3726
|
})
|
3726
3727
|
);
|
3727
3728
|
|
3728
|
-
const componentName$
|
3729
|
+
const componentName$V = getComponentName('input-wrapper');
|
3729
3730
|
const globalRefs$w = getThemeRefs(globals);
|
3730
3731
|
|
3731
|
-
const [theme$1, refs, vars$
|
3732
|
+
const [theme$1, refs, vars$N] = createHelperVars(
|
3732
3733
|
{
|
3733
3734
|
labelTextColor: globalRefs$w.colors.surface.dark,
|
3734
3735
|
labelFontSize: '14px', // not taken from globals as it is fixed in all inputs
|
@@ -3840,70 +3841,70 @@ const [theme$1, refs, vars$M] = createHelperVars(
|
|
3840
3841
|
backgroundColor: globalRefs$w.colors.surface.main,
|
3841
3842
|
},
|
3842
3843
|
},
|
3843
|
-
componentName$
|
3844
|
+
componentName$V
|
3844
3845
|
);
|
3845
3846
|
|
3846
3847
|
var inputWrapper = /*#__PURE__*/Object.freeze({
|
3847
3848
|
__proto__: null,
|
3848
3849
|
default: theme$1,
|
3849
3850
|
refs: refs,
|
3850
|
-
vars: vars$
|
3851
|
+
vars: vars$N
|
3851
3852
|
});
|
3852
3853
|
|
3853
3854
|
const globalRefs$v = getThemeRefs(globals);
|
3854
|
-
const vars$
|
3855
|
+
const vars$M = TextFieldClass.cssVarList;
|
3855
3856
|
|
3856
3857
|
const textField$1 = {
|
3857
|
-
[vars$
|
3858
|
-
[vars$
|
3859
|
-
[vars$
|
3860
|
-
[vars$
|
3861
|
-
[vars$
|
3862
|
-
[vars$
|
3863
|
-
[vars$
|
3864
|
-
[vars$
|
3865
|
-
[vars$
|
3866
|
-
[vars$
|
3867
|
-
[vars$
|
3868
|
-
[vars$
|
3869
|
-
[vars$
|
3870
|
-
[vars$
|
3871
|
-
[vars$
|
3872
|
-
[vars$
|
3873
|
-
[vars$
|
3874
|
-
[vars$
|
3875
|
-
[vars$
|
3876
|
-
[vars$
|
3877
|
-
[vars$
|
3878
|
-
[vars$
|
3879
|
-
[vars$
|
3880
|
-
[vars$
|
3881
|
-
[vars$
|
3858
|
+
[vars$M.hostWidth]: refs.width,
|
3859
|
+
[vars$M.hostMinWidth]: refs.minWidth,
|
3860
|
+
[vars$M.hostDirection]: refs.direction,
|
3861
|
+
[vars$M.fontSize]: refs.fontSize,
|
3862
|
+
[vars$M.fontFamily]: refs.fontFamily,
|
3863
|
+
[vars$M.labelFontSize]: refs.labelFontSize,
|
3864
|
+
[vars$M.labelFontWeight]: refs.labelFontWeight,
|
3865
|
+
[vars$M.labelTextColor]: refs.labelTextColor,
|
3866
|
+
[vars$M.labelRequiredIndicator]: refs.requiredIndicator,
|
3867
|
+
[vars$M.errorMessageTextColor]: refs.errorMessageTextColor,
|
3868
|
+
[vars$M.inputValueTextColor]: refs.valueTextColor,
|
3869
|
+
[vars$M.inputPlaceholderColor]: refs.placeholderTextColor,
|
3870
|
+
[vars$M.inputBorderWidth]: refs.borderWidth,
|
3871
|
+
[vars$M.inputBorderStyle]: refs.borderStyle,
|
3872
|
+
[vars$M.inputBorderColor]: refs.borderColor,
|
3873
|
+
[vars$M.inputBorderRadius]: refs.borderRadius,
|
3874
|
+
[vars$M.inputOutlineWidth]: refs.outlineWidth,
|
3875
|
+
[vars$M.inputOutlineStyle]: refs.outlineStyle,
|
3876
|
+
[vars$M.inputOutlineColor]: refs.outlineColor,
|
3877
|
+
[vars$M.inputOutlineOffset]: refs.outlineOffset,
|
3878
|
+
[vars$M.inputBackgroundColor]: refs.backgroundColor,
|
3879
|
+
[vars$M.inputHeight]: refs.inputHeight,
|
3880
|
+
[vars$M.inputHorizontalPadding]: refs.horizontalPadding,
|
3881
|
+
[vars$M.helperTextColor]: refs.helperTextColor,
|
3882
|
+
[vars$M.textAlign]: refs.textAlign,
|
3882
3883
|
textAlign: {
|
3883
|
-
right: { [vars$
|
3884
|
-
left: { [vars$
|
3885
|
-
center: { [vars$
|
3884
|
+
right: { [vars$M.inputTextAlign]: 'right' },
|
3885
|
+
left: { [vars$M.inputTextAlign]: 'left' },
|
3886
|
+
center: { [vars$M.inputTextAlign]: 'center' },
|
3886
3887
|
},
|
3887
|
-
[vars$
|
3888
|
-
[vars$
|
3889
|
-
[vars$
|
3890
|
-
[vars$
|
3891
|
-
[vars$
|
3892
|
-
[vars$
|
3893
|
-
[vars$
|
3894
|
-
[vars$
|
3895
|
-
[vars$
|
3896
|
-
[vars$
|
3897
|
-
[vars$
|
3898
|
-
[vars$
|
3899
|
-
[vars$
|
3888
|
+
[vars$M.labelPosition]: refs.labelPosition,
|
3889
|
+
[vars$M.labelTopPosition]: refs.labelTopPosition,
|
3890
|
+
[vars$M.labelHorizontalPosition]: refs.labelHorizontalPosition,
|
3891
|
+
[vars$M.inputTransformY]: refs.inputTransformY,
|
3892
|
+
[vars$M.inputTransition]: refs.inputTransition,
|
3893
|
+
[vars$M.marginInlineStart]: refs.marginInlineStart,
|
3894
|
+
[vars$M.placeholderOpacity]: refs.placeholderOpacity,
|
3895
|
+
[vars$M.inputVerticalAlignment]: refs.inputVerticalAlignment,
|
3896
|
+
[vars$M.valueInputHeight]: refs.valueInputHeight,
|
3897
|
+
[vars$M.valueInputMarginBottom]: refs.valueInputMarginBottom,
|
3898
|
+
[vars$M.inputIconOffset]: globalRefs$v.spacing.md,
|
3899
|
+
[vars$M.inputIconSize]: refs.inputIconSize,
|
3900
|
+
[vars$M.inputIconColor]: refs.placeholderTextColor,
|
3900
3901
|
};
|
3901
3902
|
|
3902
3903
|
var textField$2 = /*#__PURE__*/Object.freeze({
|
3903
3904
|
__proto__: null,
|
3904
3905
|
default: textField$1,
|
3905
3906
|
textField: textField$1,
|
3906
|
-
vars: vars$
|
3907
|
+
vars: vars$M
|
3907
3908
|
});
|
3908
3909
|
|
3909
3910
|
const passwordDraggableMixin = (superclass) =>
|
@@ -3945,7 +3946,7 @@ const passwordDraggableMixin = (superclass) =>
|
|
3945
3946
|
}
|
3946
3947
|
};
|
3947
3948
|
|
3948
|
-
const componentName$
|
3949
|
+
const componentName$U = getComponentName('password');
|
3949
3950
|
|
3950
3951
|
const customMixin$b = (superclass) =>
|
3951
3952
|
class PasswordFieldMixinClass extends superclass {
|
@@ -4220,58 +4221,58 @@ const PasswordClass = compose(
|
|
4220
4221
|
}
|
4221
4222
|
`,
|
4222
4223
|
excludeAttrsSync: ['tabindex'],
|
4223
|
-
componentName: componentName$
|
4224
|
+
componentName: componentName$U,
|
4224
4225
|
})
|
4225
4226
|
);
|
4226
4227
|
|
4227
4228
|
const globalRefs$u = getThemeRefs(globals);
|
4228
|
-
const vars$
|
4229
|
+
const vars$L = PasswordClass.cssVarList;
|
4229
4230
|
|
4230
4231
|
const password = {
|
4231
|
-
[vars$
|
4232
|
-
[vars$
|
4233
|
-
[vars$
|
4234
|
-
[vars$
|
4235
|
-
[vars$
|
4236
|
-
[vars$
|
4237
|
-
[vars$
|
4238
|
-
[vars$
|
4239
|
-
[vars$
|
4240
|
-
[vars$
|
4241
|
-
[vars$
|
4242
|
-
[vars$
|
4243
|
-
[vars$
|
4244
|
-
[vars$
|
4245
|
-
[vars$
|
4246
|
-
[vars$
|
4247
|
-
[vars$
|
4248
|
-
[vars$
|
4249
|
-
[vars$
|
4250
|
-
[vars$
|
4251
|
-
[vars$
|
4252
|
-
[vars$
|
4253
|
-
[vars$
|
4254
|
-
[vars$
|
4255
|
-
[vars$
|
4256
|
-
[vars$
|
4257
|
-
[vars$
|
4258
|
-
[vars$
|
4259
|
-
[vars$
|
4260
|
-
[vars$
|
4261
|
-
[vars$
|
4262
|
-
[vars$
|
4263
|
-
[vars$
|
4264
|
-
[vars$
|
4265
|
-
[vars$
|
4232
|
+
[vars$L.hostWidth]: refs.width,
|
4233
|
+
[vars$L.hostMinWidth]: refs.minWidth,
|
4234
|
+
[vars$L.hostDirection]: refs.direction,
|
4235
|
+
[vars$L.fontSize]: refs.fontSize,
|
4236
|
+
[vars$L.fontFamily]: refs.fontFamily,
|
4237
|
+
[vars$L.labelFontSize]: refs.labelFontSize,
|
4238
|
+
[vars$L.labelFontWeight]: refs.labelFontWeight,
|
4239
|
+
[vars$L.labelTextColor]: refs.labelTextColor,
|
4240
|
+
[vars$L.errorMessageTextColor]: refs.errorMessageTextColor,
|
4241
|
+
[vars$L.inputHorizontalPadding]: refs.horizontalPadding,
|
4242
|
+
[vars$L.inputHeight]: refs.inputHeight,
|
4243
|
+
[vars$L.inputBackgroundColor]: refs.backgroundColor,
|
4244
|
+
[vars$L.labelRequiredIndicator]: refs.requiredIndicator,
|
4245
|
+
[vars$L.inputValueTextColor]: refs.valueTextColor,
|
4246
|
+
[vars$L.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
4247
|
+
[vars$L.inputBorderWidth]: refs.borderWidth,
|
4248
|
+
[vars$L.inputBorderStyle]: refs.borderStyle,
|
4249
|
+
[vars$L.inputBorderColor]: refs.borderColor,
|
4250
|
+
[vars$L.inputBorderRadius]: refs.borderRadius,
|
4251
|
+
[vars$L.inputOutlineWidth]: refs.outlineWidth,
|
4252
|
+
[vars$L.inputOutlineStyle]: refs.outlineStyle,
|
4253
|
+
[vars$L.inputOutlineColor]: refs.outlineColor,
|
4254
|
+
[vars$L.inputOutlineOffset]: refs.outlineOffset,
|
4255
|
+
[vars$L.revealButtonOffset]: globalRefs$u.spacing.md,
|
4256
|
+
[vars$L.revealButtonSize]: refs.toggleButtonSize,
|
4257
|
+
[vars$L.revealButtonColor]: refs.placeholderTextColor,
|
4258
|
+
[vars$L.labelPosition]: refs.labelPosition,
|
4259
|
+
[vars$L.labelTopPosition]: refs.labelTopPosition,
|
4260
|
+
[vars$L.labelHorizontalPosition]: refs.labelHorizontalPosition,
|
4261
|
+
[vars$L.inputTransformY]: refs.inputTransformY,
|
4262
|
+
[vars$L.inputTransition]: refs.inputTransition,
|
4263
|
+
[vars$L.marginInlineStart]: refs.marginInlineStart,
|
4264
|
+
[vars$L.placeholderOpacity]: refs.placeholderOpacity,
|
4265
|
+
[vars$L.inputVerticalAlignment]: refs.inputVerticalAlignment,
|
4266
|
+
[vars$L.valueInputHeight]: refs.valueInputHeight,
|
4266
4267
|
};
|
4267
4268
|
|
4268
4269
|
var password$1 = /*#__PURE__*/Object.freeze({
|
4269
4270
|
__proto__: null,
|
4270
4271
|
default: password,
|
4271
|
-
vars: vars$
|
4272
|
+
vars: vars$L
|
4272
4273
|
});
|
4273
4274
|
|
4274
|
-
const componentName$
|
4275
|
+
const componentName$T = getComponentName('number-field');
|
4275
4276
|
|
4276
4277
|
const NumberFieldClass = compose(
|
4277
4278
|
createStyleMixin({
|
@@ -4305,55 +4306,55 @@ const NumberFieldClass = compose(
|
|
4305
4306
|
}
|
4306
4307
|
`,
|
4307
4308
|
excludeAttrsSync: ['tabindex'],
|
4308
|
-
componentName: componentName$
|
4309
|
+
componentName: componentName$T,
|
4309
4310
|
})
|
4310
4311
|
);
|
4311
4312
|
|
4312
|
-
const vars$
|
4313
|
+
const vars$K = NumberFieldClass.cssVarList;
|
4313
4314
|
|
4314
4315
|
const numberField = {
|
4315
|
-
[vars$
|
4316
|
-
[vars$
|
4317
|
-
[vars$
|
4318
|
-
[vars$
|
4319
|
-
[vars$
|
4320
|
-
[vars$
|
4321
|
-
[vars$
|
4322
|
-
[vars$
|
4323
|
-
[vars$
|
4324
|
-
[vars$
|
4325
|
-
[vars$
|
4326
|
-
[vars$
|
4327
|
-
[vars$
|
4328
|
-
[vars$
|
4329
|
-
[vars$
|
4330
|
-
[vars$
|
4331
|
-
[vars$
|
4332
|
-
[vars$
|
4333
|
-
[vars$
|
4334
|
-
[vars$
|
4335
|
-
[vars$
|
4336
|
-
[vars$
|
4337
|
-
[vars$
|
4338
|
-
[vars$
|
4339
|
-
[vars$
|
4340
|
-
[vars$
|
4341
|
-
[vars$
|
4342
|
-
[vars$
|
4343
|
-
[vars$
|
4344
|
-
[vars$
|
4345
|
-
[vars$
|
4346
|
-
[vars$
|
4347
|
-
[vars$
|
4316
|
+
[vars$K.hostWidth]: refs.width,
|
4317
|
+
[vars$K.hostMinWidth]: refs.minWidth,
|
4318
|
+
[vars$K.hostDirection]: refs.direction,
|
4319
|
+
[vars$K.fontSize]: refs.fontSize,
|
4320
|
+
[vars$K.fontFamily]: refs.fontFamily,
|
4321
|
+
[vars$K.labelFontSize]: refs.labelFontSize,
|
4322
|
+
[vars$K.labelFontWeight]: refs.labelFontWeight,
|
4323
|
+
[vars$K.labelTextColor]: refs.labelTextColor,
|
4324
|
+
[vars$K.errorMessageTextColor]: refs.errorMessageTextColor,
|
4325
|
+
[vars$K.inputValueTextColor]: refs.valueTextColor,
|
4326
|
+
[vars$K.inputPlaceholderColor]: refs.placeholderTextColor,
|
4327
|
+
[vars$K.inputBorderWidth]: refs.borderWidth,
|
4328
|
+
[vars$K.inputBorderStyle]: refs.borderStyle,
|
4329
|
+
[vars$K.inputBorderColor]: refs.borderColor,
|
4330
|
+
[vars$K.inputBorderRadius]: refs.borderRadius,
|
4331
|
+
[vars$K.inputOutlineWidth]: refs.outlineWidth,
|
4332
|
+
[vars$K.inputOutlineStyle]: refs.outlineStyle,
|
4333
|
+
[vars$K.inputOutlineColor]: refs.outlineColor,
|
4334
|
+
[vars$K.inputOutlineOffset]: refs.outlineOffset,
|
4335
|
+
[vars$K.inputBackgroundColor]: refs.backgroundColor,
|
4336
|
+
[vars$K.labelRequiredIndicator]: refs.requiredIndicator,
|
4337
|
+
[vars$K.inputHorizontalPadding]: refs.horizontalPadding,
|
4338
|
+
[vars$K.inputHeight]: refs.inputHeight,
|
4339
|
+
[vars$K.labelPosition]: refs.labelPosition,
|
4340
|
+
[vars$K.labelTopPosition]: refs.labelTopPosition,
|
4341
|
+
[vars$K.labelHorizontalPosition]: refs.labelHorizontalPosition,
|
4342
|
+
[vars$K.inputTransformY]: refs.inputTransformY,
|
4343
|
+
[vars$K.inputTransition]: refs.inputTransition,
|
4344
|
+
[vars$K.marginInlineStart]: refs.marginInlineStart,
|
4345
|
+
[vars$K.placeholderOpacity]: refs.placeholderOpacity,
|
4346
|
+
[vars$K.inputVerticalAlignment]: refs.inputVerticalAlignment,
|
4347
|
+
[vars$K.valueInputHeight]: refs.valueInputHeight,
|
4348
|
+
[vars$K.valueInputMarginBottom]: refs.valueInputMarginBottom,
|
4348
4349
|
};
|
4349
4350
|
|
4350
4351
|
var numberField$1 = /*#__PURE__*/Object.freeze({
|
4351
4352
|
__proto__: null,
|
4352
4353
|
default: numberField,
|
4353
|
-
vars: vars$
|
4354
|
+
vars: vars$K
|
4354
4355
|
});
|
4355
4356
|
|
4356
|
-
const componentName$
|
4357
|
+
const componentName$S = getComponentName('email-field');
|
4357
4358
|
|
4358
4359
|
const defaultPattern = "^[\\w\\.\\%\\+\\-']+@[\\w\\.\\-]+\\.[A-Za-z]{2,}$";
|
4359
4360
|
const defaultAutocomplete = 'username';
|
@@ -4421,55 +4422,55 @@ const EmailFieldClass = compose(
|
|
4421
4422
|
}
|
4422
4423
|
`,
|
4423
4424
|
excludeAttrsSync: ['tabindex'],
|
4424
|
-
componentName: componentName$
|
4425
|
+
componentName: componentName$S,
|
4425
4426
|
})
|
4426
4427
|
);
|
4427
4428
|
|
4428
|
-
const vars$
|
4429
|
+
const vars$J = EmailFieldClass.cssVarList;
|
4429
4430
|
|
4430
4431
|
const emailField = {
|
4431
|
-
[vars$
|
4432
|
-
[vars$
|
4433
|
-
[vars$
|
4434
|
-
[vars$
|
4435
|
-
[vars$
|
4436
|
-
[vars$
|
4437
|
-
[vars$
|
4438
|
-
[vars$
|
4439
|
-
[vars$
|
4440
|
-
[vars$
|
4441
|
-
[vars$
|
4442
|
-
[vars$
|
4443
|
-
[vars$
|
4444
|
-
[vars$
|
4445
|
-
[vars$
|
4446
|
-
[vars$
|
4447
|
-
[vars$
|
4448
|
-
[vars$
|
4449
|
-
[vars$
|
4450
|
-
[vars$
|
4451
|
-
[vars$
|
4452
|
-
[vars$
|
4453
|
-
[vars$
|
4454
|
-
[vars$
|
4455
|
-
[vars$
|
4456
|
-
[vars$
|
4457
|
-
[vars$
|
4458
|
-
[vars$
|
4459
|
-
[vars$
|
4460
|
-
[vars$
|
4461
|
-
[vars$
|
4462
|
-
[vars$
|
4463
|
-
[vars$
|
4432
|
+
[vars$J.hostWidth]: refs.width,
|
4433
|
+
[vars$J.hostMinWidth]: refs.minWidth,
|
4434
|
+
[vars$J.hostDirection]: refs.direction,
|
4435
|
+
[vars$J.fontSize]: refs.fontSize,
|
4436
|
+
[vars$J.fontFamily]: refs.fontFamily,
|
4437
|
+
[vars$J.labelFontSize]: refs.labelFontSize,
|
4438
|
+
[vars$J.labelFontWeight]: refs.labelFontWeight,
|
4439
|
+
[vars$J.labelTextColor]: refs.labelTextColor,
|
4440
|
+
[vars$J.errorMessageTextColor]: refs.errorMessageTextColor,
|
4441
|
+
[vars$J.inputValueTextColor]: refs.valueTextColor,
|
4442
|
+
[vars$J.labelRequiredIndicator]: refs.requiredIndicator,
|
4443
|
+
[vars$J.inputPlaceholderColor]: refs.placeholderTextColor,
|
4444
|
+
[vars$J.inputBorderWidth]: refs.borderWidth,
|
4445
|
+
[vars$J.inputBorderStyle]: refs.borderStyle,
|
4446
|
+
[vars$J.inputBorderColor]: refs.borderColor,
|
4447
|
+
[vars$J.inputBorderRadius]: refs.borderRadius,
|
4448
|
+
[vars$J.inputOutlineWidth]: refs.outlineWidth,
|
4449
|
+
[vars$J.inputOutlineStyle]: refs.outlineStyle,
|
4450
|
+
[vars$J.inputOutlineColor]: refs.outlineColor,
|
4451
|
+
[vars$J.inputOutlineOffset]: refs.outlineOffset,
|
4452
|
+
[vars$J.inputBackgroundColor]: refs.backgroundColor,
|
4453
|
+
[vars$J.inputHorizontalPadding]: refs.horizontalPadding,
|
4454
|
+
[vars$J.inputHeight]: refs.inputHeight,
|
4455
|
+
[vars$J.labelPosition]: refs.labelPosition,
|
4456
|
+
[vars$J.labelTopPosition]: refs.labelTopPosition,
|
4457
|
+
[vars$J.labelHorizontalPosition]: refs.labelHorizontalPosition,
|
4458
|
+
[vars$J.inputTransformY]: refs.inputTransformY,
|
4459
|
+
[vars$J.inputTransition]: refs.inputTransition,
|
4460
|
+
[vars$J.marginInlineStart]: refs.marginInlineStart,
|
4461
|
+
[vars$J.placeholderOpacity]: refs.placeholderOpacity,
|
4462
|
+
[vars$J.inputVerticalAlignment]: refs.inputVerticalAlignment,
|
4463
|
+
[vars$J.valueInputHeight]: refs.valueInputHeight,
|
4464
|
+
[vars$J.valueInputMarginBottom]: refs.valueInputMarginBottom,
|
4464
4465
|
};
|
4465
4466
|
|
4466
4467
|
var emailField$1 = /*#__PURE__*/Object.freeze({
|
4467
4468
|
__proto__: null,
|
4468
4469
|
default: emailField,
|
4469
|
-
vars: vars$
|
4470
|
+
vars: vars$J
|
4470
4471
|
});
|
4471
4472
|
|
4472
|
-
const componentName$
|
4473
|
+
const componentName$R = getComponentName('text-area');
|
4473
4474
|
|
4474
4475
|
const {
|
4475
4476
|
host: host$l,
|
@@ -4545,49 +4546,49 @@ const TextAreaClass = compose(
|
|
4545
4546
|
${resetInputCursor('vaadin-text-area')}
|
4546
4547
|
`,
|
4547
4548
|
excludeAttrsSync: ['tabindex'],
|
4548
|
-
componentName: componentName$
|
4549
|
+
componentName: componentName$R,
|
4549
4550
|
})
|
4550
4551
|
);
|
4551
4552
|
|
4552
|
-
const vars$
|
4553
|
+
const vars$I = TextAreaClass.cssVarList;
|
4553
4554
|
|
4554
4555
|
const textArea = {
|
4555
|
-
[vars$
|
4556
|
-
[vars$
|
4557
|
-
[vars$
|
4558
|
-
[vars$
|
4559
|
-
[vars$
|
4560
|
-
[vars$
|
4561
|
-
[vars$
|
4562
|
-
[vars$
|
4563
|
-
[vars$
|
4564
|
-
[vars$
|
4565
|
-
[vars$
|
4566
|
-
[vars$
|
4567
|
-
[vars$
|
4568
|
-
[vars$
|
4569
|
-
[vars$
|
4570
|
-
[vars$
|
4571
|
-
[vars$
|
4572
|
-
[vars$
|
4573
|
-
[vars$
|
4574
|
-
[vars$
|
4575
|
-
[vars$
|
4556
|
+
[vars$I.hostWidth]: refs.width,
|
4557
|
+
[vars$I.hostMinWidth]: refs.minWidth,
|
4558
|
+
[vars$I.hostDirection]: refs.direction,
|
4559
|
+
[vars$I.fontSize]: refs.fontSize,
|
4560
|
+
[vars$I.fontFamily]: refs.fontFamily,
|
4561
|
+
[vars$I.labelTextColor]: refs.labelTextColor,
|
4562
|
+
[vars$I.labelRequiredIndicator]: refs.requiredIndicator,
|
4563
|
+
[vars$I.errorMessageTextColor]: refs.errorMessageTextColor,
|
4564
|
+
[vars$I.inputBackgroundColor]: refs.backgroundColor,
|
4565
|
+
[vars$I.inputValueTextColor]: refs.valueTextColor,
|
4566
|
+
[vars$I.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
4567
|
+
[vars$I.inputBorderRadius]: refs.borderRadius,
|
4568
|
+
[vars$I.inputBorderWidth]: refs.borderWidth,
|
4569
|
+
[vars$I.inputBorderStyle]: refs.borderStyle,
|
4570
|
+
[vars$I.inputBorderColor]: refs.borderColor,
|
4571
|
+
[vars$I.inputOutlineWidth]: refs.outlineWidth,
|
4572
|
+
[vars$I.inputOutlineStyle]: refs.outlineStyle,
|
4573
|
+
[vars$I.inputOutlineColor]: refs.outlineColor,
|
4574
|
+
[vars$I.inputOutlineOffset]: refs.outlineOffset,
|
4575
|
+
[vars$I.inputResizeType]: 'vertical',
|
4576
|
+
[vars$I.inputMinHeight]: '5em',
|
4576
4577
|
textAlign: {
|
4577
|
-
right: { [vars$
|
4578
|
-
left: { [vars$
|
4579
|
-
center: { [vars$
|
4578
|
+
right: { [vars$I.inputTextAlign]: 'right' },
|
4579
|
+
left: { [vars$I.inputTextAlign]: 'left' },
|
4580
|
+
center: { [vars$I.inputTextAlign]: 'center' },
|
4580
4581
|
},
|
4581
4582
|
|
4582
4583
|
_readonly: {
|
4583
|
-
[vars$
|
4584
|
+
[vars$I.inputResizeType]: 'none',
|
4584
4585
|
},
|
4585
4586
|
};
|
4586
4587
|
|
4587
4588
|
var textArea$1 = /*#__PURE__*/Object.freeze({
|
4588
4589
|
__proto__: null,
|
4589
4590
|
default: textArea,
|
4590
|
-
vars: vars$
|
4591
|
+
vars: vars$I
|
4591
4592
|
});
|
4592
4593
|
|
4593
4594
|
const createBaseInputClass = (...args) =>
|
@@ -4598,9 +4599,9 @@ const createBaseInputClass = (...args) =>
|
|
4598
4599
|
inputEventsDispatchingMixin
|
4599
4600
|
)(createBaseClass(...args));
|
4600
4601
|
|
4601
|
-
const componentName$
|
4602
|
+
const componentName$Q = getComponentName('boolean-field-internal');
|
4602
4603
|
|
4603
|
-
createBaseInputClass({ componentName: componentName$
|
4604
|
+
createBaseInputClass({ componentName: componentName$Q, baseSelector: 'div' });
|
4604
4605
|
|
4605
4606
|
const booleanFieldMixin = (superclass) =>
|
4606
4607
|
class BooleanFieldMixinClass extends superclass {
|
@@ -4609,14 +4610,14 @@ const booleanFieldMixin = (superclass) =>
|
|
4609
4610
|
|
4610
4611
|
const template = document.createElement('template');
|
4611
4612
|
template.innerHTML = `
|
4612
|
-
<${componentName$
|
4613
|
+
<${componentName$Q}
|
4613
4614
|
tabindex="-1"
|
4614
4615
|
slot="input"
|
4615
|
-
></${componentName$
|
4616
|
+
></${componentName$Q}>
|
4616
4617
|
`;
|
4617
4618
|
|
4618
4619
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
4619
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
4620
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$Q);
|
4620
4621
|
this.checkbox = this.inputElement.querySelector('vaadin-checkbox');
|
4621
4622
|
|
4622
4623
|
forwardAttrs(this, this.inputElement, {
|
@@ -4654,8 +4655,7 @@ vaadin-text-field {
|
|
4654
4655
|
align-items: flex-start;
|
4655
4656
|
}
|
4656
4657
|
vaadin-text-field::before {
|
4657
|
-
|
4658
|
-
margin: 0;
|
4658
|
+
content: unset;
|
4659
4659
|
}
|
4660
4660
|
vaadin-text-field::part(label) {
|
4661
4661
|
position: absolute;
|
@@ -4686,7 +4686,7 @@ descope-boolean-field-internal {
|
|
4686
4686
|
}
|
4687
4687
|
`;
|
4688
4688
|
|
4689
|
-
const componentName$
|
4689
|
+
const componentName$P = getComponentName('checkbox');
|
4690
4690
|
|
4691
4691
|
const {
|
4692
4692
|
host: host$k,
|
@@ -4762,6 +4762,7 @@ const CheckboxClass = compose(
|
|
4762
4762
|
:host {
|
4763
4763
|
display: inline-flex;
|
4764
4764
|
max-width: 100%;
|
4765
|
+
margin: 1px;
|
4765
4766
|
}
|
4766
4767
|
|
4767
4768
|
:host ::part(error-message) {
|
@@ -4785,6 +4786,11 @@ const CheckboxClass = compose(
|
|
4785
4786
|
vaadin-checkbox::part(checkbox)::after {
|
4786
4787
|
top: 0;
|
4787
4788
|
left: 0;
|
4789
|
+
-webkit-text-fill-color: initial;
|
4790
|
+
}
|
4791
|
+
|
4792
|
+
vaadin-checkbox label {
|
4793
|
+
-webkit-text-fill-color: initial;
|
4788
4794
|
}
|
4789
4795
|
|
4790
4796
|
vaadin-text-field::part(input-field)::after {
|
@@ -4792,51 +4798,44 @@ const CheckboxClass = compose(
|
|
4792
4798
|
}
|
4793
4799
|
`,
|
4794
4800
|
excludeAttrsSync: ['label', 'tabindex'],
|
4795
|
-
componentName: componentName$
|
4801
|
+
componentName: componentName$P,
|
4796
4802
|
})
|
4797
4803
|
);
|
4798
4804
|
|
4799
|
-
const vars$
|
4805
|
+
const vars$H = CheckboxClass.cssVarList;
|
4800
4806
|
const checkboxSize = '1.35em';
|
4801
4807
|
|
4802
4808
|
const checkbox = {
|
4803
|
-
[vars$
|
4804
|
-
[vars$
|
4805
|
-
[vars$
|
4806
|
-
[vars$
|
4807
|
-
[vars$
|
4808
|
-
[vars$
|
4809
|
-
[vars$
|
4810
|
-
[vars$
|
4811
|
-
[vars$
|
4812
|
-
[vars$
|
4813
|
-
[vars$
|
4814
|
-
[vars$
|
4815
|
-
[vars$
|
4816
|
-
[vars$
|
4817
|
-
[vars$
|
4818
|
-
[vars$
|
4819
|
-
[vars$
|
4820
|
-
[vars$
|
4821
|
-
[vars$
|
4822
|
-
[vars$
|
4823
|
-
|
4824
|
-
_checked: {
|
4825
|
-
[vars$G.inputValueTextColor]: refs.valueTextColor,
|
4826
|
-
},
|
4827
|
-
|
4828
|
-
_disabled: {
|
4829
|
-
[vars$G.labelTextColor]: refs.labelTextColor,
|
4830
|
-
},
|
4809
|
+
[vars$H.hostWidth]: refs.width,
|
4810
|
+
[vars$H.hostDirection]: refs.direction,
|
4811
|
+
[vars$H.fontSize]: refs.fontSize,
|
4812
|
+
[vars$H.fontFamily]: refs.fontFamily,
|
4813
|
+
[vars$H.labelTextColor]: refs.labelTextColor,
|
4814
|
+
[vars$H.labelRequiredIndicator]: refs.requiredIndicator,
|
4815
|
+
[vars$H.labelFontWeight]: '400',
|
4816
|
+
[vars$H.labelLineHeight]: checkboxSize,
|
4817
|
+
[vars$H.labelSpacing]: '1em',
|
4818
|
+
[vars$H.errorMessageTextColor]: refs.errorMessageTextColor,
|
4819
|
+
[vars$H.inputOutlineWidth]: refs.outlineWidth,
|
4820
|
+
[vars$H.inputOutlineOffset]: refs.outlineOffset,
|
4821
|
+
[vars$H.inputOutlineColor]: refs.outlineColor,
|
4822
|
+
[vars$H.inputOutlineStyle]: refs.outlineStyle,
|
4823
|
+
[vars$H.inputBorderRadius]: refs.borderRadius,
|
4824
|
+
[vars$H.inputBorderColor]: refs.borderColor,
|
4825
|
+
[vars$H.inputBorderWidth]: refs.borderWidth,
|
4826
|
+
[vars$H.inputBorderStyle]: refs.borderStyle,
|
4827
|
+
[vars$H.inputBackgroundColor]: refs.backgroundColor,
|
4828
|
+
[vars$H.inputSize]: checkboxSize,
|
4829
|
+
[vars$H.inputValueTextColor]: refs.valueTextColor,
|
4831
4830
|
};
|
4832
4831
|
|
4833
4832
|
var checkbox$1 = /*#__PURE__*/Object.freeze({
|
4834
4833
|
__proto__: null,
|
4835
4834
|
default: checkbox,
|
4836
|
-
vars: vars$
|
4835
|
+
vars: vars$H
|
4837
4836
|
});
|
4838
4837
|
|
4839
|
-
const componentName$
|
4838
|
+
const componentName$O = getComponentName('switch-toggle');
|
4840
4839
|
|
4841
4840
|
const {
|
4842
4841
|
host: host$j,
|
@@ -4968,7 +4967,7 @@ const SwitchToggleClass = compose(
|
|
4968
4967
|
}
|
4969
4968
|
`,
|
4970
4969
|
excludeAttrsSync: ['label', 'tabindex'],
|
4971
|
-
componentName: componentName$
|
4970
|
+
componentName: componentName$O,
|
4972
4971
|
})
|
4973
4972
|
);
|
4974
4973
|
|
@@ -4976,74 +4975,74 @@ const knobMargin = '2px';
|
|
4976
4975
|
const checkboxHeight = '1.25em';
|
4977
4976
|
|
4978
4977
|
const globalRefs$t = getThemeRefs(globals);
|
4979
|
-
const vars$
|
4978
|
+
const vars$G = SwitchToggleClass.cssVarList;
|
4980
4979
|
|
4981
4980
|
const switchToggle = {
|
4982
|
-
[vars$
|
4983
|
-
[vars$
|
4984
|
-
[vars$
|
4985
|
-
[vars$
|
4986
|
-
|
4987
|
-
[vars$
|
4988
|
-
[vars$
|
4989
|
-
[vars$
|
4990
|
-
[vars$
|
4991
|
-
|
4992
|
-
[vars$
|
4993
|
-
[vars$
|
4994
|
-
[vars$
|
4995
|
-
[vars$
|
4996
|
-
[vars$
|
4997
|
-
[vars$
|
4998
|
-
[vars$
|
4999
|
-
|
5000
|
-
[vars$
|
5001
|
-
[vars$
|
5002
|
-
[vars$
|
5003
|
-
[vars$
|
5004
|
-
[vars$
|
5005
|
-
[vars$
|
5006
|
-
|
5007
|
-
[vars$
|
5008
|
-
[vars$
|
5009
|
-
[vars$
|
5010
|
-
[vars$
|
5011
|
-
[vars$
|
5012
|
-
[vars$
|
4981
|
+
[vars$G.hostWidth]: refs.width,
|
4982
|
+
[vars$G.hostDirection]: refs.direction,
|
4983
|
+
[vars$G.fontSize]: refs.fontSize,
|
4984
|
+
[vars$G.fontFamily]: refs.fontFamily,
|
4985
|
+
|
4986
|
+
[vars$G.inputOutlineWidth]: refs.outlineWidth,
|
4987
|
+
[vars$G.inputOutlineOffset]: refs.outlineOffset,
|
4988
|
+
[vars$G.inputOutlineColor]: refs.outlineColor,
|
4989
|
+
[vars$G.inputOutlineStyle]: refs.outlineStyle,
|
4990
|
+
|
4991
|
+
[vars$G.trackBorderStyle]: refs.borderStyle,
|
4992
|
+
[vars$G.trackBorderWidth]: refs.borderWidth, // var `trackBorderWidth` used outside the theme for `left` margin calculation
|
4993
|
+
[vars$G.trackBorderColor]: refs.borderColor,
|
4994
|
+
[vars$G.trackBackgroundColor]: refs.backgroundColor,
|
4995
|
+
[vars$G.trackBorderRadius]: globalRefs$t.radius.md,
|
4996
|
+
[vars$G.trackWidth]: '2.5em', // var `trackWidth` used outside the theme for `left` margin calculation
|
4997
|
+
[vars$G.trackHeight]: checkboxHeight,
|
4998
|
+
|
4999
|
+
[vars$G.knobSize]: `calc(1em - ${knobMargin})`,
|
5000
|
+
[vars$G.knobRadius]: '50%',
|
5001
|
+
[vars$G.knobTopOffset]: '1px',
|
5002
|
+
[vars$G.knobLeftOffset]: knobMargin,
|
5003
|
+
[vars$G.knobColor]: refs.labelTextColor,
|
5004
|
+
[vars$G.knobTransitionDuration]: '0.3s',
|
5005
|
+
|
5006
|
+
[vars$G.labelTextColor]: refs.labelTextColor,
|
5007
|
+
[vars$G.labelFontWeight]: '400',
|
5008
|
+
[vars$G.labelLineHeight]: '1.35em',
|
5009
|
+
[vars$G.labelSpacing]: '1em',
|
5010
|
+
[vars$G.labelRequiredIndicator]: refs.requiredIndicator,
|
5011
|
+
[vars$G.errorMessageTextColor]: refs.errorMessageTextColor,
|
5013
5012
|
|
5014
5013
|
_checked: {
|
5015
|
-
[vars$
|
5016
|
-
[vars$
|
5017
|
-
[vars$
|
5018
|
-
[vars$
|
5014
|
+
[vars$G.trackBorderColor]: refs.borderColor,
|
5015
|
+
[vars$G.knobLeftOffset]: `calc(100% - var(${vars$G.knobSize}) - ${knobMargin})`,
|
5016
|
+
[vars$G.knobColor]: refs.valueTextColor,
|
5017
|
+
[vars$G.knobTextColor]: refs.valueTextColor,
|
5019
5018
|
},
|
5020
5019
|
|
5021
5020
|
_disabled: {
|
5022
|
-
[vars$
|
5023
|
-
[vars$
|
5024
|
-
[vars$
|
5025
|
-
[vars$
|
5021
|
+
[vars$G.knobColor]: globalRefs$t.colors.surface.light,
|
5022
|
+
[vars$G.trackBorderColor]: globalRefs$t.colors.surface.light,
|
5023
|
+
[vars$G.trackBackgroundColor]: globalRefs$t.colors.surface.main,
|
5024
|
+
[vars$G.labelTextColor]: refs.labelTextColor,
|
5026
5025
|
_checked: {
|
5027
|
-
[vars$
|
5028
|
-
[vars$
|
5026
|
+
[vars$G.knobColor]: globalRefs$t.colors.surface.light,
|
5027
|
+
[vars$G.trackBackgroundColor]: globalRefs$t.colors.surface.main,
|
5029
5028
|
},
|
5030
5029
|
},
|
5031
5030
|
|
5032
5031
|
_invalid: {
|
5033
|
-
[vars$
|
5034
|
-
[vars$
|
5032
|
+
[vars$G.trackBorderColor]: globalRefs$t.colors.error.main,
|
5033
|
+
[vars$G.knobColor]: globalRefs$t.colors.error.main,
|
5035
5034
|
},
|
5036
5035
|
};
|
5037
5036
|
|
5038
5037
|
var switchToggle$1 = /*#__PURE__*/Object.freeze({
|
5039
5038
|
__proto__: null,
|
5040
5039
|
default: switchToggle,
|
5041
|
-
vars: vars$
|
5040
|
+
vars: vars$G
|
5042
5041
|
});
|
5043
5042
|
|
5044
|
-
const componentName$
|
5043
|
+
const componentName$N = getComponentName('container');
|
5045
5044
|
|
5046
|
-
class RawContainer extends createBaseClass({ componentName: componentName$
|
5045
|
+
class RawContainer extends createBaseClass({ componentName: componentName$N, baseSelector: 'slot' }) {
|
5047
5046
|
constructor() {
|
5048
5047
|
super();
|
5049
5048
|
|
@@ -5118,7 +5117,7 @@ const [helperTheme$3, helperRefs$3, helperVars$3] = createHelperVars(
|
|
5118
5117
|
horizontalAlignment,
|
5119
5118
|
shadowColor: '#00000020', // if we want to support transparency vars, we should use different color format
|
5120
5119
|
},
|
5121
|
-
componentName$
|
5120
|
+
componentName$N
|
5122
5121
|
);
|
5123
5122
|
|
5124
5123
|
const { shadowColor: shadowColor$3 } = helperRefs$3;
|
@@ -5205,7 +5204,7 @@ const container = {
|
|
5205
5204
|
},
|
5206
5205
|
};
|
5207
5206
|
|
5208
|
-
const vars$
|
5207
|
+
const vars$F = {
|
5209
5208
|
...compVars$5,
|
5210
5209
|
...helperVars$3,
|
5211
5210
|
};
|
@@ -5213,7 +5212,7 @@ const vars$E = {
|
|
5213
5212
|
var container$1 = /*#__PURE__*/Object.freeze({
|
5214
5213
|
__proto__: null,
|
5215
5214
|
default: container,
|
5216
|
-
vars: vars$
|
5215
|
+
vars: vars$F
|
5217
5216
|
});
|
5218
5217
|
|
5219
5218
|
const createCssVarImageClass = ({ componentName, varName, fallbackVarName }) => {
|
@@ -5266,69 +5265,69 @@ const createCssVarImageClass = ({ componentName, varName, fallbackVarName }) =>
|
|
5266
5265
|
return CssVarImageClass;
|
5267
5266
|
};
|
5268
5267
|
|
5269
|
-
const componentName$
|
5268
|
+
const componentName$M = getComponentName('logo');
|
5270
5269
|
|
5271
5270
|
const LogoClass = createCssVarImageClass({
|
5272
|
-
componentName: componentName$
|
5271
|
+
componentName: componentName$M,
|
5273
5272
|
varName: 'url',
|
5274
5273
|
fallbackVarName: 'fallbackUrl',
|
5275
5274
|
});
|
5276
5275
|
|
5277
|
-
const vars$
|
5276
|
+
const vars$E = LogoClass.cssVarList;
|
5278
5277
|
|
5279
5278
|
const logo$2 = {
|
5280
|
-
[vars$
|
5279
|
+
[vars$E.fallbackUrl]: 'url(https://imgs.descope.com/components/no-logo-placeholder.svg)',
|
5281
5280
|
};
|
5282
5281
|
|
5283
5282
|
var logo$3 = /*#__PURE__*/Object.freeze({
|
5284
5283
|
__proto__: null,
|
5285
5284
|
default: logo$2,
|
5286
|
-
vars: vars$
|
5285
|
+
vars: vars$E
|
5287
5286
|
});
|
5288
5287
|
|
5289
|
-
const componentName$
|
5288
|
+
const componentName$L = getComponentName('totp-image');
|
5290
5289
|
|
5291
5290
|
const TotpImageClass = createCssVarImageClass({
|
5292
|
-
componentName: componentName$
|
5291
|
+
componentName: componentName$L,
|
5293
5292
|
varName: 'url',
|
5294
5293
|
fallbackVarName: 'fallbackUrl',
|
5295
5294
|
});
|
5296
5295
|
|
5297
|
-
const vars$
|
5296
|
+
const vars$D = TotpImageClass.cssVarList;
|
5298
5297
|
|
5299
5298
|
const logo$1 = {
|
5300
|
-
[vars$
|
5299
|
+
[vars$D.fallbackUrl]: 'url(https://imgs.descope.com/components/totp-placeholder.svg)',
|
5301
5300
|
};
|
5302
5301
|
|
5303
5302
|
var totpImage = /*#__PURE__*/Object.freeze({
|
5304
5303
|
__proto__: null,
|
5305
5304
|
default: logo$1,
|
5306
|
-
vars: vars$
|
5305
|
+
vars: vars$D
|
5307
5306
|
});
|
5308
5307
|
|
5309
|
-
const componentName$
|
5308
|
+
const componentName$K = getComponentName('notp-image');
|
5310
5309
|
|
5311
5310
|
const NotpImageClass = createCssVarImageClass({
|
5312
|
-
componentName: componentName$
|
5311
|
+
componentName: componentName$K,
|
5313
5312
|
varName: 'url',
|
5314
5313
|
fallbackVarName: 'fallbackUrl',
|
5315
5314
|
});
|
5316
5315
|
|
5317
|
-
const vars$
|
5316
|
+
const vars$C = NotpImageClass.cssVarList;
|
5318
5317
|
|
5319
5318
|
const logo = {
|
5320
|
-
[vars$
|
5319
|
+
[vars$C.fallbackUrl]: 'url(https://imgs.descope.com/components/notp-placeholder.svg)',
|
5321
5320
|
};
|
5322
5321
|
|
5323
5322
|
var notpImage = /*#__PURE__*/Object.freeze({
|
5324
5323
|
__proto__: null,
|
5325
5324
|
default: logo,
|
5326
|
-
vars: vars$
|
5325
|
+
vars: vars$C
|
5327
5326
|
});
|
5328
5327
|
|
5329
|
-
const componentName$
|
5328
|
+
const componentName$J = getComponentName('text');
|
5330
5329
|
|
5331
|
-
class RawText extends createBaseClass({ componentName: componentName$
|
5330
|
+
class RawText extends createBaseClass({ componentName: componentName$J, baseSelector: ':host > slot' }) {
|
5332
5331
|
constructor() {
|
5333
5332
|
super();
|
5334
5333
|
|
@@ -5386,94 +5385,94 @@ const TextClass = compose(
|
|
5386
5385
|
)(RawText);
|
5387
5386
|
|
5388
5387
|
const globalRefs$r = getThemeRefs(globals);
|
5389
|
-
const vars$
|
5388
|
+
const vars$B = TextClass.cssVarList;
|
5390
5389
|
|
5391
5390
|
const text$2 = {
|
5392
|
-
[vars$
|
5393
|
-
[vars$
|
5394
|
-
[vars$
|
5395
|
-
[vars$
|
5391
|
+
[vars$B.hostDirection]: globalRefs$r.direction,
|
5392
|
+
[vars$B.textLineHeight]: '1.35em',
|
5393
|
+
[vars$B.textAlign]: 'left',
|
5394
|
+
[vars$B.textColor]: globalRefs$r.colors.surface.dark,
|
5396
5395
|
|
5397
5396
|
variant: {
|
5398
5397
|
h1: {
|
5399
|
-
[vars$
|
5400
|
-
[vars$
|
5401
|
-
[vars$
|
5398
|
+
[vars$B.fontSize]: globalRefs$r.typography.h1.size,
|
5399
|
+
[vars$B.fontWeight]: globalRefs$r.typography.h1.weight,
|
5400
|
+
[vars$B.fontFamily]: globalRefs$r.typography.h1.font,
|
5402
5401
|
},
|
5403
5402
|
h2: {
|
5404
|
-
[vars$
|
5405
|
-
[vars$
|
5406
|
-
[vars$
|
5403
|
+
[vars$B.fontSize]: globalRefs$r.typography.h2.size,
|
5404
|
+
[vars$B.fontWeight]: globalRefs$r.typography.h2.weight,
|
5405
|
+
[vars$B.fontFamily]: globalRefs$r.typography.h2.font,
|
5407
5406
|
},
|
5408
5407
|
h3: {
|
5409
|
-
[vars$
|
5410
|
-
[vars$
|
5411
|
-
[vars$
|
5408
|
+
[vars$B.fontSize]: globalRefs$r.typography.h3.size,
|
5409
|
+
[vars$B.fontWeight]: globalRefs$r.typography.h3.weight,
|
5410
|
+
[vars$B.fontFamily]: globalRefs$r.typography.h3.font,
|
5412
5411
|
},
|
5413
5412
|
subtitle1: {
|
5414
|
-
[vars$
|
5415
|
-
[vars$
|
5416
|
-
[vars$
|
5413
|
+
[vars$B.fontSize]: globalRefs$r.typography.subtitle1.size,
|
5414
|
+
[vars$B.fontWeight]: globalRefs$r.typography.subtitle1.weight,
|
5415
|
+
[vars$B.fontFamily]: globalRefs$r.typography.subtitle1.font,
|
5417
5416
|
},
|
5418
5417
|
subtitle2: {
|
5419
|
-
[vars$
|
5420
|
-
[vars$
|
5421
|
-
[vars$
|
5418
|
+
[vars$B.fontSize]: globalRefs$r.typography.subtitle2.size,
|
5419
|
+
[vars$B.fontWeight]: globalRefs$r.typography.subtitle2.weight,
|
5420
|
+
[vars$B.fontFamily]: globalRefs$r.typography.subtitle2.font,
|
5422
5421
|
},
|
5423
5422
|
body1: {
|
5424
|
-
[vars$
|
5425
|
-
[vars$
|
5426
|
-
[vars$
|
5423
|
+
[vars$B.fontSize]: globalRefs$r.typography.body1.size,
|
5424
|
+
[vars$B.fontWeight]: globalRefs$r.typography.body1.weight,
|
5425
|
+
[vars$B.fontFamily]: globalRefs$r.typography.body1.font,
|
5427
5426
|
},
|
5428
5427
|
body2: {
|
5429
|
-
[vars$
|
5430
|
-
[vars$
|
5431
|
-
[vars$
|
5428
|
+
[vars$B.fontSize]: globalRefs$r.typography.body2.size,
|
5429
|
+
[vars$B.fontWeight]: globalRefs$r.typography.body2.weight,
|
5430
|
+
[vars$B.fontFamily]: globalRefs$r.typography.body2.font,
|
5432
5431
|
},
|
5433
5432
|
},
|
5434
5433
|
|
5435
5434
|
mode: {
|
5436
5435
|
primary: {
|
5437
|
-
[vars$
|
5436
|
+
[vars$B.textColor]: globalRefs$r.colors.surface.contrast,
|
5438
5437
|
},
|
5439
5438
|
secondary: {
|
5440
|
-
[vars$
|
5439
|
+
[vars$B.textColor]: globalRefs$r.colors.surface.dark,
|
5441
5440
|
},
|
5442
5441
|
error: {
|
5443
|
-
[vars$
|
5442
|
+
[vars$B.textColor]: globalRefs$r.colors.error.main,
|
5444
5443
|
},
|
5445
5444
|
success: {
|
5446
|
-
[vars$
|
5445
|
+
[vars$B.textColor]: globalRefs$r.colors.success.main,
|
5447
5446
|
},
|
5448
5447
|
},
|
5449
5448
|
|
5450
5449
|
textAlign: {
|
5451
|
-
right: { [vars$
|
5452
|
-
left: { [vars$
|
5453
|
-
center: { [vars$
|
5450
|
+
right: { [vars$B.textAlign]: 'right' },
|
5451
|
+
left: { [vars$B.textAlign]: 'left' },
|
5452
|
+
center: { [vars$B.textAlign]: 'center' },
|
5454
5453
|
},
|
5455
5454
|
|
5456
5455
|
_fullWidth: {
|
5457
|
-
[vars$
|
5456
|
+
[vars$B.hostWidth]: '100%',
|
5458
5457
|
},
|
5459
5458
|
|
5460
5459
|
_italic: {
|
5461
|
-
[vars$
|
5460
|
+
[vars$B.fontStyle]: 'italic',
|
5462
5461
|
},
|
5463
5462
|
|
5464
5463
|
_uppercase: {
|
5465
|
-
[vars$
|
5464
|
+
[vars$B.textTransform]: 'uppercase',
|
5466
5465
|
},
|
5467
5466
|
|
5468
5467
|
_lowercase: {
|
5469
|
-
[vars$
|
5468
|
+
[vars$B.textTransform]: 'lowercase',
|
5470
5469
|
},
|
5471
5470
|
};
|
5472
5471
|
|
5473
5472
|
var text$3 = /*#__PURE__*/Object.freeze({
|
5474
5473
|
__proto__: null,
|
5475
5474
|
default: text$2,
|
5476
|
-
vars: vars$
|
5475
|
+
vars: vars$B
|
5477
5476
|
});
|
5478
5477
|
|
5479
5478
|
const disableRules = [
|
@@ -5500,9 +5499,9 @@ const decodeHTML = (html) => {
|
|
5500
5499
|
/* eslint-disable no-param-reassign */
|
5501
5500
|
|
5502
5501
|
|
5503
|
-
const componentName$
|
5502
|
+
const componentName$I = getComponentName('enriched-text');
|
5504
5503
|
|
5505
|
-
class EnrichedText extends createBaseClass({ componentName: componentName$
|
5504
|
+
class EnrichedText extends createBaseClass({ componentName: componentName$I, baseSelector: ':host > div' }) {
|
5506
5505
|
#origLinkRenderer;
|
5507
5506
|
|
5508
5507
|
#origEmRenderer;
|
@@ -5698,9 +5697,9 @@ const EnrichedTextClass = compose(
|
|
5698
5697
|
componentNameValidationMixin
|
5699
5698
|
)(EnrichedText);
|
5700
5699
|
|
5701
|
-
const componentName$
|
5700
|
+
const componentName$H = getComponentName('link');
|
5702
5701
|
|
5703
|
-
class RawLink extends createBaseClass({ componentName: componentName$
|
5702
|
+
class RawLink extends createBaseClass({ componentName: componentName$H, baseSelector: ':host a' }) {
|
5704
5703
|
constructor() {
|
5705
5704
|
super();
|
5706
5705
|
|
@@ -5765,37 +5764,37 @@ const LinkClass = compose(
|
|
5765
5764
|
)(RawLink);
|
5766
5765
|
|
5767
5766
|
const globalRefs$q = getThemeRefs(globals);
|
5768
|
-
const vars$
|
5767
|
+
const vars$A = LinkClass.cssVarList;
|
5769
5768
|
|
5770
5769
|
const link$1 = {
|
5771
|
-
[vars$
|
5772
|
-
[vars$
|
5770
|
+
[vars$A.hostDirection]: globalRefs$q.direction,
|
5771
|
+
[vars$A.cursor]: 'pointer',
|
5773
5772
|
|
5774
|
-
[vars$
|
5773
|
+
[vars$A.textColor]: globalRefs$q.colors.primary.main,
|
5775
5774
|
|
5776
5775
|
textAlign: {
|
5777
|
-
right: { [vars$
|
5778
|
-
left: { [vars$
|
5779
|
-
center: { [vars$
|
5776
|
+
right: { [vars$A.textAlign]: 'right' },
|
5777
|
+
left: { [vars$A.textAlign]: 'left' },
|
5778
|
+
center: { [vars$A.textAlign]: 'center' },
|
5780
5779
|
},
|
5781
5780
|
|
5782
5781
|
_fullWidth: {
|
5783
|
-
[vars$
|
5782
|
+
[vars$A.hostWidth]: '100%',
|
5784
5783
|
},
|
5785
5784
|
|
5786
5785
|
_hover: {
|
5787
|
-
[vars$
|
5786
|
+
[vars$A.textDecoration]: 'underline',
|
5788
5787
|
},
|
5789
5788
|
|
5790
5789
|
mode: {
|
5791
5790
|
secondary: {
|
5792
|
-
[vars$
|
5791
|
+
[vars$A.textColor]: globalRefs$q.colors.secondary.main,
|
5793
5792
|
},
|
5794
5793
|
error: {
|
5795
|
-
[vars$
|
5794
|
+
[vars$A.textColor]: globalRefs$q.colors.error.main,
|
5796
5795
|
},
|
5797
5796
|
success: {
|
5798
|
-
[vars$
|
5797
|
+
[vars$A.textColor]: globalRefs$q.colors.success.main,
|
5799
5798
|
},
|
5800
5799
|
},
|
5801
5800
|
};
|
@@ -5803,37 +5802,37 @@ const link$1 = {
|
|
5803
5802
|
var link$2 = /*#__PURE__*/Object.freeze({
|
5804
5803
|
__proto__: null,
|
5805
5804
|
default: link$1,
|
5806
|
-
vars: vars$
|
5805
|
+
vars: vars$A
|
5807
5806
|
});
|
5808
5807
|
|
5809
5808
|
const globalRefs$p = getThemeRefs(globals);
|
5810
|
-
const vars$
|
5809
|
+
const vars$z = EnrichedTextClass.cssVarList;
|
5811
5810
|
|
5812
5811
|
const enrichedText = {
|
5813
|
-
[vars$
|
5814
|
-
[vars$
|
5812
|
+
[vars$z.hostDirection]: globalRefs$p.direction,
|
5813
|
+
[vars$z.hostWidth]: useVar(vars$B.hostWidth),
|
5815
5814
|
|
5816
|
-
[vars$
|
5817
|
-
[vars$
|
5818
|
-
[vars$
|
5815
|
+
[vars$z.textLineHeight]: useVar(vars$B.textLineHeight),
|
5816
|
+
[vars$z.textColor]: useVar(vars$B.textColor),
|
5817
|
+
[vars$z.textAlign]: useVar(vars$B.textAlign),
|
5819
5818
|
|
5820
|
-
[vars$
|
5821
|
-
[vars$
|
5822
|
-
[vars$
|
5819
|
+
[vars$z.fontSize]: useVar(vars$B.fontSize),
|
5820
|
+
[vars$z.fontWeight]: useVar(vars$B.fontWeight),
|
5821
|
+
[vars$z.fontFamily]: useVar(vars$B.fontFamily),
|
5823
5822
|
|
5824
|
-
[vars$
|
5825
|
-
[vars$
|
5826
|
-
[vars$
|
5823
|
+
[vars$z.linkColor]: useVar(vars$A.textColor),
|
5824
|
+
[vars$z.linkTextDecoration]: 'none',
|
5825
|
+
[vars$z.linkHoverTextDecoration]: 'underline',
|
5827
5826
|
|
5828
|
-
[vars$
|
5829
|
-
[vars$
|
5830
|
-
[vars$
|
5827
|
+
[vars$z.fontWeightBold]: '900',
|
5828
|
+
[vars$z.minWidth]: '0.25em',
|
5829
|
+
[vars$z.minHeight]: '1.35em',
|
5831
5830
|
|
5832
|
-
[vars$
|
5831
|
+
[vars$z.hostDisplay]: 'inline-block',
|
5833
5832
|
|
5834
5833
|
_empty: {
|
5835
5834
|
_hideWhenEmpty: {
|
5836
|
-
[vars$
|
5835
|
+
[vars$z.hostDisplay]: 'none',
|
5837
5836
|
},
|
5838
5837
|
},
|
5839
5838
|
};
|
@@ -5841,11 +5840,11 @@ const enrichedText = {
|
|
5841
5840
|
var enrichedText$1 = /*#__PURE__*/Object.freeze({
|
5842
5841
|
__proto__: null,
|
5843
5842
|
default: enrichedText,
|
5844
|
-
vars: vars$
|
5843
|
+
vars: vars$z
|
5845
5844
|
});
|
5846
5845
|
|
5847
|
-
const componentName$
|
5848
|
-
class RawDivider extends createBaseClass({ componentName: componentName$
|
5846
|
+
const componentName$G = getComponentName('divider');
|
5847
|
+
class RawDivider extends createBaseClass({ componentName: componentName$G, baseSelector: ':host > div' }) {
|
5849
5848
|
constructor() {
|
5850
5849
|
super();
|
5851
5850
|
|
@@ -5890,7 +5889,7 @@ class RawDivider extends createBaseClass({ componentName: componentName$F, baseS
|
|
5890
5889
|
}
|
5891
5890
|
}
|
5892
5891
|
|
5893
|
-
const textVars$
|
5892
|
+
const textVars$4 = TextClass.cssVarList;
|
5894
5893
|
const { host: host$h, before, after: after$1, text } = {
|
5895
5894
|
host: { selector: () => ':host' },
|
5896
5895
|
before: { selector: '::before' },
|
@@ -5909,7 +5908,7 @@ const DividerClass = compose(
|
|
5909
5908
|
alignItems: {},
|
5910
5909
|
alignSelf: {},
|
5911
5910
|
flexDirection: {},
|
5912
|
-
textAlign: { ...text, property: textVars$
|
5911
|
+
textAlign: { ...text, property: textVars$4.textAlign },
|
5913
5912
|
|
5914
5913
|
labelTextWidth: { ...text, property: 'width' },
|
5915
5914
|
labelTextMaxWidth: { ...text, property: 'max-width' },
|
@@ -5952,7 +5951,7 @@ const [helperTheme$2, helperRefs$2, helperVars$2] = createHelperVars(
|
|
5952
5951
|
thickness: '2px',
|
5953
5952
|
spacing: '10px',
|
5954
5953
|
},
|
5955
|
-
componentName$
|
5954
|
+
componentName$G
|
5956
5955
|
);
|
5957
5956
|
|
5958
5957
|
const divider = {
|
@@ -5983,7 +5982,7 @@ const divider = {
|
|
5983
5982
|
},
|
5984
5983
|
};
|
5985
5984
|
|
5986
|
-
const vars$
|
5985
|
+
const vars$y = {
|
5987
5986
|
...compVars$4,
|
5988
5987
|
...helperVars$2,
|
5989
5988
|
};
|
@@ -5991,18 +5990,18 @@ const vars$x = {
|
|
5991
5990
|
var divider$1 = /*#__PURE__*/Object.freeze({
|
5992
5991
|
__proto__: null,
|
5993
5992
|
default: divider,
|
5994
|
-
vars: vars$
|
5993
|
+
vars: vars$y
|
5995
5994
|
});
|
5996
5995
|
|
5997
5996
|
/* eslint-disable no-param-reassign */
|
5998
5997
|
|
5999
|
-
const componentName$
|
5998
|
+
const componentName$F = getComponentName('passcode-internal');
|
6000
5999
|
|
6001
|
-
createBaseInputClass({ componentName: componentName$
|
6000
|
+
createBaseInputClass({ componentName: componentName$F, baseSelector: 'div' });
|
6002
6001
|
|
6003
|
-
const componentName$
|
6002
|
+
const componentName$E = getComponentName('loader-radial');
|
6004
6003
|
|
6005
|
-
class RawLoaderRadial extends createBaseClass({ componentName: componentName$
|
6004
|
+
class RawLoaderRadial extends createBaseClass({ componentName: componentName$E, baseSelector: ':host > div' }) {
|
6006
6005
|
constructor() {
|
6007
6006
|
super();
|
6008
6007
|
|
@@ -6046,7 +6045,7 @@ const LoaderRadialClass = compose(
|
|
6046
6045
|
componentNameValidationMixin
|
6047
6046
|
)(RawLoaderRadial);
|
6048
6047
|
|
6049
|
-
const componentName$
|
6048
|
+
const componentName$D = getComponentName('passcode');
|
6050
6049
|
|
6051
6050
|
const observedAttributes$3 = ['digits'];
|
6052
6051
|
|
@@ -6065,17 +6064,17 @@ const customMixin$9 = (superclass) =>
|
|
6065
6064
|
const template = document.createElement('template');
|
6066
6065
|
|
6067
6066
|
template.innerHTML = `
|
6068
|
-
<${componentName$
|
6067
|
+
<${componentName$F}
|
6069
6068
|
bordered="true"
|
6070
6069
|
name="code"
|
6071
6070
|
tabindex="-1"
|
6072
6071
|
slot="input"
|
6073
|
-
><slot></slot></${componentName$
|
6072
|
+
><slot></slot></${componentName$F}>
|
6074
6073
|
`;
|
6075
6074
|
|
6076
6075
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
6077
6076
|
|
6078
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
6077
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$F);
|
6079
6078
|
|
6080
6079
|
forwardAttrs(this, this.inputElement, { includeAttrs: ['digits', 'size', 'loading'] });
|
6081
6080
|
}
|
@@ -6107,13 +6106,13 @@ const {
|
|
6107
6106
|
errorMessage: { selector: '::part(error-message)' },
|
6108
6107
|
};
|
6109
6108
|
|
6110
|
-
const textVars$
|
6109
|
+
const textVars$3 = TextFieldClass.cssVarList;
|
6111
6110
|
const loaderVars = LoaderRadialClass.cssVarList;
|
6112
6111
|
|
6113
6112
|
const PasscodeClass = compose(
|
6114
6113
|
createStyleMixin({
|
6115
6114
|
mappings: {
|
6116
|
-
fontSize: [{ ...digitField, property: textVars$
|
6115
|
+
fontSize: [{ ...digitField, property: textVars$3.fontSize }, host$g],
|
6117
6116
|
hostWidth: { property: 'width' },
|
6118
6117
|
hostDirection: { ...host$g, property: 'direction' },
|
6119
6118
|
fontFamily: [host$g, { ...label$6 }],
|
@@ -6125,20 +6124,20 @@ const PasscodeClass = compose(
|
|
6125
6124
|
errorMessageTextColor: { ...errorMessage$7, property: 'color' },
|
6126
6125
|
digitValueTextColor: {
|
6127
6126
|
selector: TextFieldClass.componentName,
|
6128
|
-
property: textVars$
|
6127
|
+
property: textVars$3.inputValueTextColor,
|
6129
6128
|
},
|
6130
6129
|
digitSize: [
|
6131
6130
|
{ ...digitField, property: 'height' },
|
6132
6131
|
{ ...digitField, property: 'width' },
|
6133
6132
|
],
|
6134
|
-
digitPadding: { ...digitField, property: textVars$
|
6135
|
-
digitTextAlign: { ...digitField, property: textVars$
|
6136
|
-
digitCaretTextColor: { ...digitField, property: textVars$
|
6133
|
+
digitPadding: { ...digitField, property: textVars$3.inputHorizontalPadding },
|
6134
|
+
digitTextAlign: { ...digitField, property: textVars$3.inputTextAlign },
|
6135
|
+
digitCaretTextColor: { ...digitField, property: textVars$3.inputCaretTextColor },
|
6137
6136
|
digitSpacing: { ...internalWrapper$1, property: 'gap' },
|
6138
|
-
digitOutlineColor: { ...digitField, property: textVars$
|
6139
|
-
digitOutlineWidth: { ...digitField, property: textVars$
|
6137
|
+
digitOutlineColor: { ...digitField, property: textVars$3.inputOutlineColor },
|
6138
|
+
digitOutlineWidth: { ...digitField, property: textVars$3.inputOutlineWidth },
|
6140
6139
|
|
6141
|
-
focusedDigitFieldOutlineColor: { ...focusedDigitField, property: textVars$
|
6140
|
+
focusedDigitFieldOutlineColor: { ...focusedDigitField, property: textVars$3.inputOutlineColor },
|
6142
6141
|
overlayOpacity: { ...internalWrapper$1, property: 'opacity' },
|
6143
6142
|
spinnerSize: { selector: LoaderRadialClass.componentName, property: loaderVars.spinnerSize },
|
6144
6143
|
},
|
@@ -6186,7 +6185,7 @@ const PasscodeClass = compose(
|
|
6186
6185
|
|
6187
6186
|
descope-passcode-internal descope-text-field {
|
6188
6187
|
min-width: 2em;
|
6189
|
-
max-width: var(${textVars$
|
6188
|
+
max-width: var(${textVars$3.inputHeight});
|
6190
6189
|
}
|
6191
6190
|
|
6192
6191
|
vaadin-text-field::part(input-field) {
|
@@ -6227,56 +6226,56 @@ const PasscodeClass = compose(
|
|
6227
6226
|
${resetInputCursor('vaadin-text-field')}
|
6228
6227
|
`,
|
6229
6228
|
excludeAttrsSync: ['tabindex'],
|
6230
|
-
componentName: componentName$
|
6229
|
+
componentName: componentName$D,
|
6231
6230
|
})
|
6232
6231
|
);
|
6233
6232
|
|
6234
|
-
const vars$
|
6233
|
+
const vars$x = PasscodeClass.cssVarList;
|
6235
6234
|
|
6236
6235
|
const passcode = {
|
6237
|
-
[vars$
|
6238
|
-
[vars$
|
6239
|
-
[vars$
|
6240
|
-
[vars$
|
6241
|
-
[vars$
|
6242
|
-
[vars$
|
6243
|
-
[vars$
|
6244
|
-
[vars$
|
6245
|
-
[vars$
|
6246
|
-
[vars$
|
6247
|
-
[vars$
|
6248
|
-
[vars$
|
6249
|
-
[vars$
|
6250
|
-
[vars$
|
6251
|
-
[vars$
|
6236
|
+
[vars$x.hostDirection]: refs.direction,
|
6237
|
+
[vars$x.fontFamily]: refs.fontFamily,
|
6238
|
+
[vars$x.fontSize]: refs.fontSize,
|
6239
|
+
[vars$x.labelTextColor]: refs.labelTextColor,
|
6240
|
+
[vars$x.labelRequiredIndicator]: refs.requiredIndicator,
|
6241
|
+
[vars$x.errorMessageTextColor]: refs.errorMessageTextColor,
|
6242
|
+
[vars$x.digitValueTextColor]: refs.valueTextColor,
|
6243
|
+
[vars$x.digitPadding]: '0',
|
6244
|
+
[vars$x.digitTextAlign]: 'center',
|
6245
|
+
[vars$x.digitSpacing]: '4px',
|
6246
|
+
[vars$x.hostWidth]: refs.width,
|
6247
|
+
[vars$x.digitOutlineColor]: 'transparent',
|
6248
|
+
[vars$x.digitOutlineWidth]: refs.outlineWidth,
|
6249
|
+
[vars$x.focusedDigitFieldOutlineColor]: refs.outlineColor,
|
6250
|
+
[vars$x.digitSize]: refs.inputHeight,
|
6252
6251
|
|
6253
6252
|
size: {
|
6254
|
-
xs: { [vars$
|
6255
|
-
sm: { [vars$
|
6256
|
-
md: { [vars$
|
6257
|
-
lg: { [vars$
|
6253
|
+
xs: { [vars$x.spinnerSize]: '15px' },
|
6254
|
+
sm: { [vars$x.spinnerSize]: '20px' },
|
6255
|
+
md: { [vars$x.spinnerSize]: '20px' },
|
6256
|
+
lg: { [vars$x.spinnerSize]: '20px' },
|
6258
6257
|
},
|
6259
6258
|
|
6260
6259
|
_hideCursor: {
|
6261
|
-
[vars$
|
6260
|
+
[vars$x.digitCaretTextColor]: 'transparent',
|
6262
6261
|
},
|
6263
6262
|
|
6264
6263
|
_loading: {
|
6265
|
-
[vars$
|
6264
|
+
[vars$x.overlayOpacity]: refs.overlayOpacity,
|
6266
6265
|
},
|
6267
6266
|
};
|
6268
6267
|
|
6269
6268
|
var passcode$1 = /*#__PURE__*/Object.freeze({
|
6270
6269
|
__proto__: null,
|
6271
6270
|
default: passcode,
|
6272
|
-
vars: vars$
|
6271
|
+
vars: vars$x
|
6273
6272
|
});
|
6274
6273
|
|
6275
|
-
const componentName$
|
6274
|
+
const componentName$C = getComponentName('loader-linear');
|
6276
6275
|
|
6277
|
-
class RawLoaderLinear extends createBaseClass({ componentName: componentName$
|
6276
|
+
class RawLoaderLinear extends createBaseClass({ componentName: componentName$C, baseSelector: ':host > div' }) {
|
6278
6277
|
static get componentName() {
|
6279
|
-
return componentName$
|
6278
|
+
return componentName$C;
|
6280
6279
|
}
|
6281
6280
|
|
6282
6281
|
constructor() {
|
@@ -6338,48 +6337,48 @@ const LoaderLinearClass = compose(
|
|
6338
6337
|
)(RawLoaderLinear);
|
6339
6338
|
|
6340
6339
|
const globalRefs$n = getThemeRefs(globals);
|
6341
|
-
const vars$
|
6340
|
+
const vars$w = LoaderLinearClass.cssVarList;
|
6342
6341
|
|
6343
6342
|
const loaderLinear = {
|
6344
|
-
[vars$
|
6345
|
-
[vars$
|
6343
|
+
[vars$w.hostDisplay]: 'inline-block',
|
6344
|
+
[vars$w.hostWidth]: '100%',
|
6346
6345
|
|
6347
|
-
[vars$
|
6348
|
-
[vars$
|
6346
|
+
[vars$w.barColor]: globalRefs$n.colors.surface.contrast,
|
6347
|
+
[vars$w.barWidth]: '20%',
|
6349
6348
|
|
6350
|
-
[vars$
|
6351
|
-
[vars$
|
6349
|
+
[vars$w.barBackgroundColor]: globalRefs$n.colors.surface.light,
|
6350
|
+
[vars$w.barBorderRadius]: '4px',
|
6352
6351
|
|
6353
|
-
[vars$
|
6354
|
-
[vars$
|
6355
|
-
[vars$
|
6356
|
-
[vars$
|
6352
|
+
[vars$w.animationDuration]: '2s',
|
6353
|
+
[vars$w.animationTimingFunction]: 'linear',
|
6354
|
+
[vars$w.animationIterationCount]: 'infinite',
|
6355
|
+
[vars$w.verticalPadding]: '0.25em',
|
6357
6356
|
|
6358
6357
|
size: {
|
6359
|
-
xs: { [vars$
|
6360
|
-
sm: { [vars$
|
6361
|
-
md: { [vars$
|
6362
|
-
lg: { [vars$
|
6358
|
+
xs: { [vars$w.barHeight]: '2px' },
|
6359
|
+
sm: { [vars$w.barHeight]: '4px' },
|
6360
|
+
md: { [vars$w.barHeight]: '6px' },
|
6361
|
+
lg: { [vars$w.barHeight]: '8px' },
|
6363
6362
|
},
|
6364
6363
|
|
6365
6364
|
mode: {
|
6366
6365
|
primary: {
|
6367
|
-
[vars$
|
6366
|
+
[vars$w.barColor]: globalRefs$n.colors.primary.main,
|
6368
6367
|
},
|
6369
6368
|
secondary: {
|
6370
|
-
[vars$
|
6369
|
+
[vars$w.barColor]: globalRefs$n.colors.secondary.main,
|
6371
6370
|
},
|
6372
6371
|
},
|
6373
6372
|
|
6374
6373
|
_hidden: {
|
6375
|
-
[vars$
|
6374
|
+
[vars$w.hostDisplay]: 'none',
|
6376
6375
|
},
|
6377
6376
|
};
|
6378
6377
|
|
6379
6378
|
var loaderLinear$1 = /*#__PURE__*/Object.freeze({
|
6380
6379
|
__proto__: null,
|
6381
6380
|
default: loaderLinear,
|
6382
|
-
vars: vars$
|
6381
|
+
vars: vars$w
|
6383
6382
|
});
|
6384
6383
|
|
6385
6384
|
const globalRefs$m = getThemeRefs(globals);
|
@@ -6397,7 +6396,7 @@ const [helperTheme$1, helperRefs$1, helperVars$1] = createHelperVars(
|
|
6397
6396
|
},
|
6398
6397
|
},
|
6399
6398
|
},
|
6400
|
-
componentName$
|
6399
|
+
componentName$E
|
6401
6400
|
);
|
6402
6401
|
|
6403
6402
|
const loaderRadial = {
|
@@ -6426,7 +6425,7 @@ const loaderRadial = {
|
|
6426
6425
|
[compVars$3.hostDisplay]: 'none',
|
6427
6426
|
},
|
6428
6427
|
};
|
6429
|
-
const vars$
|
6428
|
+
const vars$v = {
|
6430
6429
|
...compVars$3,
|
6431
6430
|
...helperVars$1,
|
6432
6431
|
};
|
@@ -6434,10 +6433,10 @@ const vars$u = {
|
|
6434
6433
|
var loaderRadial$1 = /*#__PURE__*/Object.freeze({
|
6435
6434
|
__proto__: null,
|
6436
6435
|
default: loaderRadial,
|
6437
|
-
vars: vars$
|
6436
|
+
vars: vars$v
|
6438
6437
|
});
|
6439
6438
|
|
6440
|
-
const componentName$
|
6439
|
+
const componentName$B = getComponentName('combo-box');
|
6441
6440
|
|
6442
6441
|
const ComboBoxMixin = (superclass) =>
|
6443
6442
|
class ComboBoxMixinClass extends superclass {
|
@@ -6882,83 +6881,83 @@ const ComboBoxClass = compose(
|
|
6882
6881
|
// and reset items to an empty array, and opening the list box with no items
|
6883
6882
|
// to display.
|
6884
6883
|
excludeAttrsSync: ['tabindex', 'size', 'data'],
|
6885
|
-
componentName: componentName$
|
6884
|
+
componentName: componentName$B,
|
6886
6885
|
includeForwardProps: ['items', 'renderer', 'selectedItem'],
|
6887
6886
|
})
|
6888
6887
|
);
|
6889
6888
|
|
6890
6889
|
const globalRefs$l = getThemeRefs(globals);
|
6891
|
-
const vars$
|
6890
|
+
const vars$u = ComboBoxClass.cssVarList;
|
6892
6891
|
|
6893
6892
|
const comboBox = {
|
6894
|
-
[vars$
|
6895
|
-
[vars$
|
6896
|
-
[vars$
|
6897
|
-
[vars$
|
6898
|
-
[vars$
|
6899
|
-
[vars$
|
6900
|
-
[vars$
|
6901
|
-
[vars$
|
6902
|
-
[vars$
|
6903
|
-
[vars$
|
6904
|
-
[vars$
|
6905
|
-
[vars$
|
6906
|
-
[vars$
|
6907
|
-
[vars$
|
6908
|
-
[vars$
|
6909
|
-
[vars$
|
6910
|
-
[vars$
|
6911
|
-
[vars$
|
6912
|
-
[vars$
|
6913
|
-
[vars$
|
6914
|
-
[vars$
|
6915
|
-
[vars$
|
6916
|
-
[vars$
|
6917
|
-
[vars$
|
6918
|
-
[vars$
|
6919
|
-
[vars$
|
6920
|
-
[vars$
|
6921
|
-
[vars$
|
6922
|
-
[vars$
|
6923
|
-
[vars$
|
6924
|
-
[vars$
|
6925
|
-
[vars$
|
6926
|
-
[vars$
|
6927
|
-
[vars$
|
6928
|
-
[vars$
|
6929
|
-
[vars$
|
6930
|
-
[vars$
|
6931
|
-
[vars$
|
6893
|
+
[vars$u.hostWidth]: refs.width,
|
6894
|
+
[vars$u.hostDirection]: refs.direction,
|
6895
|
+
[vars$u.fontSize]: refs.fontSize,
|
6896
|
+
[vars$u.fontFamily]: refs.fontFamily,
|
6897
|
+
[vars$u.labelFontSize]: refs.labelFontSize,
|
6898
|
+
[vars$u.labelFontWeight]: refs.labelFontWeight,
|
6899
|
+
[vars$u.labelTextColor]: refs.labelTextColor,
|
6900
|
+
[vars$u.errorMessageTextColor]: refs.errorMessageTextColor,
|
6901
|
+
[vars$u.inputBorderColor]: refs.borderColor,
|
6902
|
+
[vars$u.inputBorderWidth]: refs.borderWidth,
|
6903
|
+
[vars$u.inputBorderStyle]: refs.borderStyle,
|
6904
|
+
[vars$u.inputBorderRadius]: refs.borderRadius,
|
6905
|
+
[vars$u.inputOutlineColor]: refs.outlineColor,
|
6906
|
+
[vars$u.inputOutlineOffset]: refs.outlineOffset,
|
6907
|
+
[vars$u.inputOutlineWidth]: refs.outlineWidth,
|
6908
|
+
[vars$u.inputOutlineStyle]: refs.outlineStyle,
|
6909
|
+
[vars$u.labelRequiredIndicator]: refs.requiredIndicator,
|
6910
|
+
[vars$u.inputValueTextColor]: refs.valueTextColor,
|
6911
|
+
[vars$u.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
6912
|
+
[vars$u.inputBackgroundColor]: refs.backgroundColor,
|
6913
|
+
[vars$u.inputHorizontalPadding]: refs.horizontalPadding,
|
6914
|
+
[vars$u.inputHeight]: refs.inputHeight,
|
6915
|
+
[vars$u.inputDropdownButtonColor]: globalRefs$l.colors.surface.dark,
|
6916
|
+
[vars$u.inputDropdownButtonCursor]: 'pointer',
|
6917
|
+
[vars$u.inputDropdownButtonSize]: refs.toggleButtonSize,
|
6918
|
+
[vars$u.inputDropdownButtonOffset]: globalRefs$l.spacing.xs,
|
6919
|
+
[vars$u.overlayItemPaddingInlineStart]: globalRefs$l.spacing.xs,
|
6920
|
+
[vars$u.overlayItemPaddingInlineEnd]: globalRefs$l.spacing.lg,
|
6921
|
+
[vars$u.labelPosition]: refs.labelPosition,
|
6922
|
+
[vars$u.labelTopPosition]: refs.labelTopPosition,
|
6923
|
+
[vars$u.labelHorizontalPosition]: refs.labelHorizontalPosition,
|
6924
|
+
[vars$u.inputTransformY]: refs.inputTransformY,
|
6925
|
+
[vars$u.inputTransition]: refs.inputTransition,
|
6926
|
+
[vars$u.marginInlineStart]: refs.marginInlineStart,
|
6927
|
+
[vars$u.placeholderOpacity]: refs.placeholderOpacity,
|
6928
|
+
[vars$u.inputVerticalAlignment]: refs.inputVerticalAlignment,
|
6929
|
+
[vars$u.valueInputHeight]: refs.valueInputHeight,
|
6930
|
+
[vars$u.valueInputMarginBottom]: refs.valueInputMarginBottom,
|
6932
6931
|
|
6933
6932
|
_readonly: {
|
6934
|
-
[vars$
|
6933
|
+
[vars$u.inputDropdownButtonCursor]: 'default',
|
6935
6934
|
},
|
6936
6935
|
|
6937
6936
|
// Overlay theme exposed via the component:
|
6938
|
-
[vars$
|
6939
|
-
[vars$
|
6940
|
-
[vars$
|
6941
|
-
[vars$
|
6942
|
-
[vars$
|
6943
|
-
[vars$
|
6937
|
+
[vars$u.overlayFontSize]: refs.fontSize,
|
6938
|
+
[vars$u.overlayFontFamily]: refs.fontFamily,
|
6939
|
+
[vars$u.overlayCursor]: 'pointer',
|
6940
|
+
[vars$u.overlayItemBoxShadow]: 'none',
|
6941
|
+
[vars$u.overlayBackground]: refs.backgroundColor,
|
6942
|
+
[vars$u.overlayTextColor]: refs.valueTextColor,
|
6944
6943
|
|
6945
6944
|
// Overlay direct theme:
|
6946
|
-
[vars$
|
6947
|
-
[vars$
|
6945
|
+
[vars$u.overlay.minHeight]: '400px',
|
6946
|
+
[vars$u.overlay.margin]: '0',
|
6948
6947
|
};
|
6949
6948
|
|
6950
6949
|
var comboBox$1 = /*#__PURE__*/Object.freeze({
|
6951
6950
|
__proto__: null,
|
6952
6951
|
comboBox: comboBox,
|
6953
6952
|
default: comboBox,
|
6954
|
-
vars: vars$
|
6953
|
+
vars: vars$u
|
6955
6954
|
});
|
6956
6955
|
|
6957
6956
|
const observedAttributes$2 = ['src', 'alt'];
|
6958
6957
|
|
6959
|
-
const componentName$
|
6958
|
+
const componentName$A = getComponentName('image');
|
6960
6959
|
|
6961
|
-
const BaseClass$1 = createBaseClass({ componentName: componentName$
|
6960
|
+
const BaseClass$1 = createBaseClass({ componentName: componentName$A, baseSelector: ':host > img' });
|
6962
6961
|
class RawImage extends BaseClass$1 {
|
6963
6962
|
static get observedAttributes() {
|
6964
6963
|
return observedAttributes$2.concat(BaseClass$1.observedAttributes || []);
|
@@ -6998,14 +6997,14 @@ const ImageClass = compose(
|
|
6998
6997
|
draggableMixin
|
6999
6998
|
)(RawImage);
|
7000
6999
|
|
7001
|
-
const vars$
|
7000
|
+
const vars$t = ImageClass.cssVarList;
|
7002
7001
|
|
7003
7002
|
const image = {};
|
7004
7003
|
|
7005
7004
|
var image$1 = /*#__PURE__*/Object.freeze({
|
7006
7005
|
__proto__: null,
|
7007
7006
|
default: image,
|
7008
|
-
vars: vars$
|
7007
|
+
vars: vars$t
|
7009
7008
|
});
|
7010
7009
|
|
7011
7010
|
var CountryCodes = [
|
@@ -8224,14 +8223,14 @@ var CountryCodes = [
|
|
8224
8223
|
].sort((a, b) => (a.name < b.name ? -1 : 1)),
|
8225
8224
|
];
|
8226
8225
|
|
8227
|
-
const componentName$
|
8226
|
+
const componentName$z = getComponentName('phone-field-internal');
|
8228
8227
|
|
8229
|
-
createBaseInputClass({ componentName: componentName$
|
8228
|
+
createBaseInputClass({ componentName: componentName$z, baseSelector: 'div' });
|
8230
8229
|
|
8231
|
-
const textVars$
|
8230
|
+
const textVars$2 = TextFieldClass.cssVarList;
|
8232
8231
|
const comboVars = ComboBoxClass.cssVarList;
|
8233
8232
|
|
8234
|
-
const componentName$
|
8233
|
+
const componentName$y = getComponentName('phone-field');
|
8235
8234
|
|
8236
8235
|
const customMixin$8 = (superclass) =>
|
8237
8236
|
class PhoneFieldMixinClass extends superclass {
|
@@ -8245,15 +8244,15 @@ const customMixin$8 = (superclass) =>
|
|
8245
8244
|
const template = document.createElement('template');
|
8246
8245
|
|
8247
8246
|
template.innerHTML = `
|
8248
|
-
<${componentName$
|
8247
|
+
<${componentName$z}
|
8249
8248
|
tabindex="-1"
|
8250
8249
|
slot="input"
|
8251
|
-
></${componentName$
|
8250
|
+
></${componentName$z}>
|
8252
8251
|
`;
|
8253
8252
|
|
8254
8253
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
8255
8254
|
|
8256
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
8255
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$z);
|
8257
8256
|
|
8258
8257
|
forwardAttrs(this.shadowRoot.host, this.inputElement, {
|
8259
8258
|
includeAttrs: [
|
@@ -8365,11 +8364,11 @@ const PhoneFieldClass = compose(
|
|
8365
8364
|
errorMessageTextColor: { ...errorMessage$5, property: 'color' },
|
8366
8365
|
|
8367
8366
|
inputValueTextColor: [
|
8368
|
-
{ ...phoneInput$1, property: textVars$
|
8367
|
+
{ ...phoneInput$1, property: textVars$2.inputValueTextColor },
|
8369
8368
|
{ ...countryCodeInput, property: comboVars.inputValueTextColor },
|
8370
8369
|
],
|
8371
8370
|
|
8372
|
-
inputPlaceholderTextColor: { ...phoneInput$1, property: textVars$
|
8371
|
+
inputPlaceholderTextColor: { ...phoneInput$1, property: textVars$2.inputPlaceholderColor },
|
8373
8372
|
|
8374
8373
|
overlayItemBackgroundColor: {
|
8375
8374
|
selector: 'descope-combo-box',
|
@@ -8382,9 +8381,9 @@ const PhoneFieldClass = compose(
|
|
8382
8381
|
inputOutlineOffset: { ...inputField$2, property: 'outline-offset' },
|
8383
8382
|
|
8384
8383
|
valueInputHeight: [{ ...countryCodeInput, property: comboVars.valueInputHeight }],
|
8385
|
-
valueInputMarginBottom: [{ ...phoneInput$1, property: textVars$
|
8384
|
+
valueInputMarginBottom: [{ ...phoneInput$1, property: textVars$2.valueInputMarginBottom }],
|
8386
8385
|
marginInlineStart: [
|
8387
|
-
{ ...phoneInput$1, property: textVars$
|
8386
|
+
{ ...phoneInput$1, property: textVars$2.marginInlineStart },
|
8388
8387
|
{ ...countryCodeInput, property: comboVars.marginInlineStart },
|
8389
8388
|
],
|
8390
8389
|
},
|
@@ -8453,10 +8452,10 @@ const PhoneFieldClass = compose(
|
|
8453
8452
|
}
|
8454
8453
|
descope-text-field {
|
8455
8454
|
flex-grow: 1;
|
8456
|
-
${textVars$
|
8457
|
-
${textVars$
|
8458
|
-
${textVars$
|
8459
|
-
${textVars$
|
8455
|
+
${textVars$2.inputOutlineWidth}: 0;
|
8456
|
+
${textVars$2.inputOutlineOffset}: 0;
|
8457
|
+
${textVars$2.inputBorderWidth}: 0;
|
8458
|
+
${textVars$2.inputBorderRadius}: 0;
|
8460
8459
|
}
|
8461
8460
|
|
8462
8461
|
:host([label-type="floating"]) vaadin-text-field::part(label) {
|
@@ -8475,36 +8474,36 @@ const PhoneFieldClass = compose(
|
|
8475
8474
|
${resetInputLabelPosition('vaadin-text-field')}
|
8476
8475
|
`,
|
8477
8476
|
excludeAttrsSync: ['tabindex'],
|
8478
|
-
componentName: componentName$
|
8477
|
+
componentName: componentName$y,
|
8479
8478
|
})
|
8480
8479
|
);
|
8481
8480
|
|
8482
|
-
const vars$
|
8481
|
+
const vars$s = PhoneFieldClass.cssVarList;
|
8483
8482
|
|
8484
8483
|
const phoneField = {
|
8485
|
-
[vars$
|
8486
|
-
[vars$
|
8487
|
-
[vars$
|
8488
|
-
[vars$
|
8489
|
-
[vars$
|
8490
|
-
[vars$
|
8491
|
-
[vars$
|
8492
|
-
[vars$
|
8493
|
-
[vars$
|
8494
|
-
[vars$
|
8495
|
-
[vars$
|
8496
|
-
[vars$
|
8497
|
-
[vars$
|
8498
|
-
[vars$
|
8499
|
-
[vars$
|
8500
|
-
[vars$
|
8501
|
-
[vars$
|
8502
|
-
[vars$
|
8503
|
-
[vars$
|
8504
|
-
[vars$
|
8505
|
-
[vars$
|
8506
|
-
[vars$
|
8507
|
-
[vars$
|
8484
|
+
[vars$s.hostWidth]: refs.width,
|
8485
|
+
[vars$s.hostDirection]: refs.direction,
|
8486
|
+
[vars$s.fontSize]: refs.fontSize,
|
8487
|
+
[vars$s.fontFamily]: refs.fontFamily,
|
8488
|
+
[vars$s.labelTextColor]: refs.labelTextColor,
|
8489
|
+
[vars$s.labelRequiredIndicator]: refs.requiredIndicator,
|
8490
|
+
[vars$s.errorMessageTextColor]: refs.errorMessageTextColor,
|
8491
|
+
[vars$s.inputValueTextColor]: refs.valueTextColor,
|
8492
|
+
[vars$s.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
8493
|
+
[vars$s.inputBorderStyle]: refs.borderStyle,
|
8494
|
+
[vars$s.inputBorderWidth]: refs.borderWidth,
|
8495
|
+
[vars$s.inputBorderColor]: refs.borderColor,
|
8496
|
+
[vars$s.inputBorderRadius]: refs.borderRadius,
|
8497
|
+
[vars$s.inputOutlineStyle]: refs.outlineStyle,
|
8498
|
+
[vars$s.inputOutlineWidth]: refs.outlineWidth,
|
8499
|
+
[vars$s.inputOutlineColor]: refs.outlineColor,
|
8500
|
+
[vars$s.inputOutlineOffset]: refs.outlineOffset,
|
8501
|
+
[vars$s.phoneInputWidth]: refs.minWidth,
|
8502
|
+
[vars$s.countryCodeInputWidth]: '5em',
|
8503
|
+
[vars$s.countryCodeDropdownWidth]: '20em',
|
8504
|
+
[vars$s.marginInlineStart]: '-0.25em',
|
8505
|
+
[vars$s.valueInputHeight]: refs.valueInputHeight,
|
8506
|
+
[vars$s.valueInputMarginBottom]: refs.valueInputMarginBottom,
|
8508
8507
|
|
8509
8508
|
// '@overlay': {
|
8510
8509
|
// overlayItemBackgroundColor: 'red'
|
@@ -8514,16 +8513,16 @@ const phoneField = {
|
|
8514
8513
|
var phoneField$1 = /*#__PURE__*/Object.freeze({
|
8515
8514
|
__proto__: null,
|
8516
8515
|
default: phoneField,
|
8517
|
-
vars: vars$
|
8516
|
+
vars: vars$s
|
8518
8517
|
});
|
8519
8518
|
|
8520
|
-
const componentName$
|
8519
|
+
const componentName$x = getComponentName('phone-field-internal-input-box');
|
8521
8520
|
|
8522
|
-
createBaseInputClass({ componentName: componentName$
|
8521
|
+
createBaseInputClass({ componentName: componentName$x, baseSelector: 'div' });
|
8523
8522
|
|
8524
|
-
const textVars = TextFieldClass.cssVarList;
|
8523
|
+
const textVars$1 = TextFieldClass.cssVarList;
|
8525
8524
|
|
8526
|
-
const componentName$
|
8525
|
+
const componentName$w = getComponentName('phone-input-box-field');
|
8527
8526
|
|
8528
8527
|
const customMixin$7 = (superclass) =>
|
8529
8528
|
class PhoneInputBoxFieldMixinClass extends superclass {
|
@@ -8537,15 +8536,15 @@ const customMixin$7 = (superclass) =>
|
|
8537
8536
|
const template = document.createElement('template');
|
8538
8537
|
|
8539
8538
|
template.innerHTML = `
|
8540
|
-
<${componentName$
|
8539
|
+
<${componentName$x}
|
8541
8540
|
tabindex="-1"
|
8542
8541
|
slot="input"
|
8543
|
-
></${componentName$
|
8542
|
+
></${componentName$x}>
|
8544
8543
|
`;
|
8545
8544
|
|
8546
8545
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
8547
8546
|
|
8548
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
8547
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$x);
|
8549
8548
|
|
8550
8549
|
forwardAttrs(this.shadowRoot.host, this.inputElement, {
|
8551
8550
|
includeAttrs: [
|
@@ -8620,9 +8619,9 @@ const PhoneFieldInputBoxClass = compose(
|
|
8620
8619
|
labelRequiredIndicator: { ...requiredIndicator$3, property: 'content' },
|
8621
8620
|
errorMessageTextColor: { ...errorMessage$4, property: 'color' },
|
8622
8621
|
|
8623
|
-
inputValueTextColor: { ...phoneInput, property: textVars.inputValueTextColor },
|
8622
|
+
inputValueTextColor: { ...phoneInput, property: textVars$1.inputValueTextColor },
|
8624
8623
|
|
8625
|
-
inputPlaceholderTextColor: { ...phoneInput, property: textVars.inputPlaceholderColor },
|
8624
|
+
inputPlaceholderTextColor: { ...phoneInput, property: textVars$1.inputPlaceholderColor },
|
8626
8625
|
|
8627
8626
|
inputOutlineStyle: { ...inputField$1, property: 'outline-style' },
|
8628
8627
|
inputOutlineColor: { ...inputField$1, property: 'outline-color' },
|
@@ -8641,7 +8640,7 @@ const PhoneFieldInputBoxClass = compose(
|
|
8641
8640
|
valueInputHeight: { ...inputElement$1, property: 'height' },
|
8642
8641
|
valueInputMarginBottom: {
|
8643
8642
|
selector: TextFieldClass.componentName,
|
8644
|
-
property: textVars.valueInputMarginBottom,
|
8643
|
+
property: textVars$1.valueInputMarginBottom,
|
8645
8644
|
},
|
8646
8645
|
},
|
8647
8646
|
}),
|
@@ -8698,10 +8697,10 @@ const PhoneFieldInputBoxClass = compose(
|
|
8698
8697
|
descope-text-field {
|
8699
8698
|
flex-grow: 1;
|
8700
8699
|
width: 100%;
|
8701
|
-
${textVars.inputOutlineWidth}: 0;
|
8702
|
-
${textVars.inputOutlineOffset}: 0;
|
8703
|
-
${textVars.inputBorderWidth}: 0;
|
8704
|
-
${textVars.inputBorderRadius}: 0;
|
8700
|
+
${textVars$1.inputOutlineWidth}: 0;
|
8701
|
+
${textVars$1.inputOutlineOffset}: 0;
|
8702
|
+
${textVars$1.inputBorderWidth}: 0;
|
8703
|
+
${textVars$1.inputBorderRadius}: 0;
|
8705
8704
|
direction: ltr;
|
8706
8705
|
}
|
8707
8706
|
vaadin-text-field[readonly] > input:placeholder-shown {
|
@@ -8722,68 +8721,68 @@ const PhoneFieldInputBoxClass = compose(
|
|
8722
8721
|
${inputFloatingLabelStyle()}
|
8723
8722
|
`,
|
8724
8723
|
excludeAttrsSync: ['tabindex'],
|
8725
|
-
componentName: componentName$
|
8724
|
+
componentName: componentName$w,
|
8726
8725
|
})
|
8727
8726
|
);
|
8728
8727
|
|
8729
|
-
const vars$
|
8728
|
+
const vars$r = PhoneFieldInputBoxClass.cssVarList;
|
8730
8729
|
|
8731
8730
|
const phoneInputBoxField = {
|
8732
|
-
[vars$
|
8733
|
-
[vars$
|
8734
|
-
[vars$
|
8735
|
-
[vars$
|
8736
|
-
[vars$
|
8737
|
-
[vars$
|
8738
|
-
[vars$
|
8739
|
-
[vars$
|
8740
|
-
[vars$
|
8741
|
-
[vars$
|
8742
|
-
[vars$
|
8743
|
-
[vars$
|
8744
|
-
[vars$
|
8745
|
-
[vars$
|
8746
|
-
[vars$
|
8747
|
-
[vars$
|
8748
|
-
[vars$
|
8749
|
-
[vars$
|
8750
|
-
[vars$
|
8751
|
-
[vars$
|
8752
|
-
[vars$
|
8753
|
-
[vars$
|
8754
|
-
[vars$
|
8755
|
-
[vars$
|
8756
|
-
[vars$
|
8757
|
-
[vars$
|
8758
|
-
[vars$
|
8759
|
-
[vars$
|
8760
|
-
[vars$
|
8731
|
+
[vars$r.hostWidth]: '16em',
|
8732
|
+
[vars$r.hostMinWidth]: refs.minWidth,
|
8733
|
+
[vars$r.hostDirection]: refs.direction,
|
8734
|
+
[vars$r.fontSize]: refs.fontSize,
|
8735
|
+
[vars$r.fontFamily]: refs.fontFamily,
|
8736
|
+
[vars$r.labelFontSize]: refs.labelFontSize,
|
8737
|
+
[vars$r.labelFontWeight]: refs.labelFontWeight,
|
8738
|
+
[vars$r.labelTextColor]: refs.labelTextColor,
|
8739
|
+
[vars$r.labelRequiredIndicator]: refs.requiredIndicator,
|
8740
|
+
[vars$r.errorMessageTextColor]: refs.errorMessageTextColor,
|
8741
|
+
[vars$r.inputValueTextColor]: refs.valueTextColor,
|
8742
|
+
[vars$r.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
8743
|
+
[vars$r.inputBorderStyle]: refs.borderStyle,
|
8744
|
+
[vars$r.inputBorderWidth]: refs.borderWidth,
|
8745
|
+
[vars$r.inputBorderColor]: refs.borderColor,
|
8746
|
+
[vars$r.inputBorderRadius]: refs.borderRadius,
|
8747
|
+
[vars$r.inputOutlineStyle]: refs.outlineStyle,
|
8748
|
+
[vars$r.inputOutlineWidth]: refs.outlineWidth,
|
8749
|
+
[vars$r.inputOutlineColor]: refs.outlineColor,
|
8750
|
+
[vars$r.inputOutlineOffset]: refs.outlineOffset,
|
8751
|
+
[vars$r.labelPosition]: refs.labelPosition,
|
8752
|
+
[vars$r.labelTopPosition]: refs.labelTopPosition,
|
8753
|
+
[vars$r.labelHorizontalPosition]: refs.labelHorizontalPosition,
|
8754
|
+
[vars$r.inputTransformY]: refs.inputTransformY,
|
8755
|
+
[vars$r.inputTransition]: refs.inputTransition,
|
8756
|
+
[vars$r.marginInlineStart]: refs.marginInlineStart,
|
8757
|
+
[vars$r.valueInputHeight]: refs.valueInputHeight,
|
8758
|
+
[vars$r.valueInputMarginBottom]: refs.valueInputMarginBottom,
|
8759
|
+
[vars$r.inputHorizontalPadding]: '0',
|
8761
8760
|
|
8762
8761
|
_fullWidth: {
|
8763
|
-
[vars$
|
8762
|
+
[vars$r.hostWidth]: refs.width,
|
8764
8763
|
},
|
8765
8764
|
};
|
8766
8765
|
|
8767
8766
|
var phoneInputBoxField$1 = /*#__PURE__*/Object.freeze({
|
8768
8767
|
__proto__: null,
|
8769
8768
|
default: phoneInputBoxField,
|
8770
|
-
vars: vars$
|
8769
|
+
vars: vars$r
|
8771
8770
|
});
|
8772
8771
|
|
8773
|
-
const componentName$
|
8772
|
+
const componentName$v = getComponentName('new-password-internal');
|
8774
8773
|
|
8775
8774
|
const interpolateString = (template, values) =>
|
8776
8775
|
template.replace(/{{(\w+)+}}/g, (match, key) => values?.[key] || match);
|
8777
8776
|
|
8778
8777
|
// eslint-disable-next-line max-classes-per-file
|
8779
8778
|
|
8780
|
-
const componentName$
|
8779
|
+
const componentName$u = getComponentName('policy-validation');
|
8781
8780
|
|
8782
8781
|
const overrideAttrs = ['data-password-policy-value-minlength'];
|
8783
8782
|
const dataAttrs = ['data', 'active-policies', 'overrides', ...overrideAttrs];
|
8784
8783
|
const policyAttrs = ['label', 'value', ...dataAttrs];
|
8785
8784
|
|
8786
|
-
class RawPolicyValidation extends createBaseClass({ componentName: componentName$
|
8785
|
+
class RawPolicyValidation extends createBaseClass({ componentName: componentName$u, baseSelector: ':host > div' }) {
|
8787
8786
|
#availablePolicies;
|
8788
8787
|
|
8789
8788
|
#activePolicies = [];
|
@@ -8991,7 +8990,7 @@ const PolicyValidationClass = compose(
|
|
8991
8990
|
componentNameValidationMixin
|
8992
8991
|
)(RawPolicyValidation);
|
8993
8992
|
|
8994
|
-
const componentName$
|
8993
|
+
const componentName$t = getComponentName('new-password');
|
8995
8994
|
|
8996
8995
|
const policyPreviewVars = PolicyValidationClass.cssVarList;
|
8997
8996
|
|
@@ -9005,18 +9004,18 @@ const customMixin$6 = (superclass) =>
|
|
9005
9004
|
const externalInputAttr = this.getAttribute('external-input');
|
9006
9005
|
|
9007
9006
|
template.innerHTML = `
|
9008
|
-
<${componentName$
|
9007
|
+
<${componentName$v}
|
9009
9008
|
name="new-password"
|
9010
9009
|
tabindex="-1"
|
9011
9010
|
slot="input"
|
9012
9011
|
external-input="${externalInputAttr}"
|
9013
9012
|
>
|
9014
|
-
</${componentName$
|
9013
|
+
</${componentName$v}>
|
9015
9014
|
`;
|
9016
9015
|
|
9017
9016
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
9018
9017
|
|
9019
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
9018
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$v);
|
9020
9019
|
|
9021
9020
|
if (this.getAttribute('external-input') === 'true') {
|
9022
9021
|
this.initExternalInput();
|
@@ -9192,40 +9191,40 @@ const NewPasswordClass = compose(
|
|
9192
9191
|
}
|
9193
9192
|
`,
|
9194
9193
|
excludeAttrsSync: ['tabindex'],
|
9195
|
-
componentName: componentName$
|
9194
|
+
componentName: componentName$t,
|
9196
9195
|
})
|
9197
9196
|
);
|
9198
9197
|
|
9199
9198
|
const globalRefs$k = getThemeRefs(globals);
|
9200
|
-
const vars$
|
9199
|
+
const vars$q = NewPasswordClass.cssVarList;
|
9201
9200
|
|
9202
9201
|
const newPassword = {
|
9203
|
-
[vars$
|
9204
|
-
[vars$
|
9205
|
-
[vars$
|
9206
|
-
[vars$
|
9207
|
-
[vars$
|
9208
|
-
[vars$
|
9209
|
-
[vars$
|
9210
|
-
[vars$
|
9211
|
-
[vars$
|
9212
|
-
[vars$
|
9213
|
-
[vars$
|
9214
|
-
[vars$
|
9215
|
-
[vars$
|
9202
|
+
[vars$q.hostWidth]: refs.width,
|
9203
|
+
[vars$q.hostMinWidth]: refs.minWidth,
|
9204
|
+
[vars$q.hostDirection]: refs.direction,
|
9205
|
+
[vars$q.fontSize]: refs.fontSize,
|
9206
|
+
[vars$q.fontFamily]: refs.fontFamily,
|
9207
|
+
[vars$q.labelFontSize]: refs.labelFontSize,
|
9208
|
+
[vars$q.labelFontWeight]: refs.labelFontWeight,
|
9209
|
+
[vars$q.labelTextColor]: refs.labelTextColor,
|
9210
|
+
[vars$q.spaceBetweenInputs]: '1em',
|
9211
|
+
[vars$q.errorMessageTextColor]: refs.errorMessageTextColor,
|
9212
|
+
[vars$q.policyPreviewBackgroundColor]: 'none',
|
9213
|
+
[vars$q.policyPreviewPadding]: globalRefs$k.spacing.lg,
|
9214
|
+
[vars$q.valueInputHeight]: refs.valueInputHeight,
|
9216
9215
|
|
9217
9216
|
_required: {
|
9218
9217
|
// NewPassword doesn't pass `required` attribute to its Password components.
|
9219
9218
|
// That's why we fake the required indicator on each input.
|
9220
9219
|
// We do that by injecting `::after` element, and populating it with requiredIndicator content.
|
9221
|
-
[vars$
|
9220
|
+
[vars$q.inputsRequiredIndicator]: refs.requiredIndicator, // used to populate required content for NewPassword input fields outside the theme
|
9222
9221
|
},
|
9223
9222
|
};
|
9224
9223
|
|
9225
9224
|
var newPassword$1 = /*#__PURE__*/Object.freeze({
|
9226
9225
|
__proto__: null,
|
9227
9226
|
default: newPassword,
|
9228
|
-
vars: vars$
|
9227
|
+
vars: vars$q
|
9229
9228
|
});
|
9230
9229
|
|
9231
9230
|
const getFileBase64 = (fileObj) => {
|
@@ -9240,7 +9239,7 @@ const getFilename = (fileObj) => {
|
|
9240
9239
|
return fileObj.name.replace(/^.*\\/, '');
|
9241
9240
|
};
|
9242
9241
|
|
9243
|
-
const componentName$
|
9242
|
+
const componentName$s = getComponentName('upload-file');
|
9244
9243
|
|
9245
9244
|
const observedAttributes$1 = [
|
9246
9245
|
'title',
|
@@ -9255,7 +9254,7 @@ const observedAttributes$1 = [
|
|
9255
9254
|
'icon',
|
9256
9255
|
];
|
9257
9256
|
|
9258
|
-
const BaseInputClass$2 = createBaseInputClass({ componentName: componentName$
|
9257
|
+
const BaseInputClass$2 = createBaseInputClass({ componentName: componentName$s, baseSelector: ':host > div' });
|
9259
9258
|
|
9260
9259
|
class RawUploadFile extends BaseInputClass$2 {
|
9261
9260
|
static get observedAttributes() {
|
@@ -9470,77 +9469,77 @@ const UploadFileClass = compose(
|
|
9470
9469
|
componentNameValidationMixin
|
9471
9470
|
)(RawUploadFile);
|
9472
9471
|
|
9473
|
-
const vars$
|
9472
|
+
const vars$p = UploadFileClass.cssVarList;
|
9474
9473
|
|
9475
9474
|
const uploadFile = {
|
9476
|
-
[vars$
|
9477
|
-
[vars$
|
9478
|
-
[vars$
|
9475
|
+
[vars$p.hostDirection]: refs.direction,
|
9476
|
+
[vars$p.labelTextColor]: refs.labelTextColor,
|
9477
|
+
[vars$p.fontFamily]: refs.fontFamily,
|
9479
9478
|
|
9480
|
-
[vars$
|
9479
|
+
[vars$p.iconSize]: '2em',
|
9481
9480
|
|
9482
|
-
[vars$
|
9483
|
-
[vars$
|
9481
|
+
[vars$p.hostPadding]: '0.75em',
|
9482
|
+
[vars$p.gap]: '0.5em',
|
9484
9483
|
|
9485
|
-
[vars$
|
9486
|
-
[vars$
|
9487
|
-
[vars$
|
9484
|
+
[vars$p.fontSize]: '16px',
|
9485
|
+
[vars$p.titleFontWeight]: '500',
|
9486
|
+
[vars$p.lineHeight]: '1em',
|
9488
9487
|
|
9489
|
-
[vars$
|
9490
|
-
[vars$
|
9491
|
-
[vars$
|
9492
|
-
[vars$
|
9488
|
+
[vars$p.borderWidth]: refs.borderWidth,
|
9489
|
+
[vars$p.borderColor]: refs.borderColor,
|
9490
|
+
[vars$p.borderRadius]: refs.borderRadius,
|
9491
|
+
[vars$p.borderStyle]: 'dashed',
|
9493
9492
|
|
9494
9493
|
_required: {
|
9495
|
-
[vars$
|
9494
|
+
[vars$p.requiredIndicator]: refs.requiredIndicator,
|
9496
9495
|
},
|
9497
9496
|
|
9498
9497
|
size: {
|
9499
9498
|
xs: {
|
9500
|
-
[vars$
|
9501
|
-
[vars$
|
9502
|
-
[vars$
|
9503
|
-
[vars$
|
9504
|
-
[vars$
|
9499
|
+
[vars$p.hostHeight]: '196px',
|
9500
|
+
[vars$p.hostWidth]: '200px',
|
9501
|
+
[vars$p.titleFontSize]: '0.875em',
|
9502
|
+
[vars$p.descriptionFontSize]: '0.875em',
|
9503
|
+
[vars$p.lineHeight]: '1.25em',
|
9505
9504
|
},
|
9506
9505
|
sm: {
|
9507
|
-
[vars$
|
9508
|
-
[vars$
|
9509
|
-
[vars$
|
9510
|
-
[vars$
|
9511
|
-
[vars$
|
9506
|
+
[vars$p.hostHeight]: '216px',
|
9507
|
+
[vars$p.hostWidth]: '230px',
|
9508
|
+
[vars$p.titleFontSize]: '1em',
|
9509
|
+
[vars$p.descriptionFontSize]: '0.875em',
|
9510
|
+
[vars$p.lineHeight]: '1.25em',
|
9512
9511
|
},
|
9513
9512
|
md: {
|
9514
|
-
[vars$
|
9515
|
-
[vars$
|
9516
|
-
[vars$
|
9517
|
-
[vars$
|
9518
|
-
[vars$
|
9513
|
+
[vars$p.hostHeight]: '256px',
|
9514
|
+
[vars$p.hostWidth]: '312px',
|
9515
|
+
[vars$p.titleFontSize]: '1.125em',
|
9516
|
+
[vars$p.descriptionFontSize]: '1em',
|
9517
|
+
[vars$p.lineHeight]: '1.5em',
|
9519
9518
|
},
|
9520
9519
|
lg: {
|
9521
|
-
[vars$
|
9522
|
-
[vars$
|
9523
|
-
[vars$
|
9524
|
-
[vars$
|
9525
|
-
[vars$
|
9520
|
+
[vars$p.hostHeight]: '280px',
|
9521
|
+
[vars$p.hostWidth]: '336px',
|
9522
|
+
[vars$p.titleFontSize]: '1.125em',
|
9523
|
+
[vars$p.descriptionFontSize]: '1.125em',
|
9524
|
+
[vars$p.lineHeight]: '1.75em',
|
9526
9525
|
},
|
9527
9526
|
},
|
9528
9527
|
|
9529
9528
|
_fullWidth: {
|
9530
|
-
[vars$
|
9529
|
+
[vars$p.hostWidth]: refs.width,
|
9531
9530
|
},
|
9532
9531
|
};
|
9533
9532
|
|
9534
9533
|
var uploadFile$1 = /*#__PURE__*/Object.freeze({
|
9535
9534
|
__proto__: null,
|
9536
9535
|
default: uploadFile,
|
9537
|
-
vars: vars$
|
9536
|
+
vars: vars$p
|
9538
9537
|
});
|
9539
9538
|
|
9540
|
-
const componentName$
|
9539
|
+
const componentName$r = getComponentName('button-selection-group-item');
|
9541
9540
|
|
9542
9541
|
class RawSelectItem extends createBaseClass({
|
9543
|
-
componentName: componentName$
|
9542
|
+
componentName: componentName$r,
|
9544
9543
|
baseSelector: ':host > descope-button',
|
9545
9544
|
}) {
|
9546
9545
|
get size() {
|
@@ -9649,37 +9648,37 @@ const ButtonSelectionGroupItemClass = compose(
|
|
9649
9648
|
|
9650
9649
|
const globalRefs$j = getThemeRefs(globals);
|
9651
9650
|
|
9652
|
-
const vars$
|
9651
|
+
const vars$o = ButtonSelectionGroupItemClass.cssVarList;
|
9653
9652
|
|
9654
9653
|
const buttonSelectionGroupItem = {
|
9655
|
-
[vars$
|
9656
|
-
[vars$
|
9657
|
-
[vars$
|
9658
|
-
[vars$
|
9659
|
-
[vars$
|
9660
|
-
[vars$
|
9661
|
-
[vars$
|
9662
|
-
[vars$
|
9654
|
+
[vars$o.hostDirection]: 'inherit',
|
9655
|
+
[vars$o.backgroundColor]: globalRefs$j.colors.surface.main,
|
9656
|
+
[vars$o.labelTextColor]: globalRefs$j.colors.surface.contrast,
|
9657
|
+
[vars$o.borderColor]: globalRefs$j.colors.surface.light,
|
9658
|
+
[vars$o.borderStyle]: 'solid',
|
9659
|
+
[vars$o.borderRadius]: globalRefs$j.radius.sm,
|
9660
|
+
[vars$o.outlineColor]: 'transparent',
|
9661
|
+
[vars$o.borderWidth]: globalRefs$j.border.xs,
|
9663
9662
|
|
9664
9663
|
_hover: {
|
9665
|
-
[vars$
|
9664
|
+
[vars$o.backgroundColor]: globalRefs$j.colors.surface.highlight,
|
9666
9665
|
},
|
9667
9666
|
|
9668
9667
|
_focused: {
|
9669
|
-
[vars$
|
9668
|
+
[vars$o.outlineColor]: globalRefs$j.colors.surface.light,
|
9670
9669
|
},
|
9671
9670
|
|
9672
9671
|
_selected: {
|
9673
|
-
[vars$
|
9674
|
-
[vars$
|
9675
|
-
[vars$
|
9672
|
+
[vars$o.borderColor]: globalRefs$j.colors.surface.contrast,
|
9673
|
+
[vars$o.backgroundColor]: globalRefs$j.colors.surface.contrast,
|
9674
|
+
[vars$o.labelTextColor]: globalRefs$j.colors.surface.main,
|
9676
9675
|
},
|
9677
9676
|
};
|
9678
9677
|
|
9679
9678
|
var buttonSelectionGroupItem$1 = /*#__PURE__*/Object.freeze({
|
9680
9679
|
__proto__: null,
|
9681
9680
|
default: buttonSelectionGroupItem,
|
9682
|
-
vars: vars$
|
9681
|
+
vars: vars$o
|
9683
9682
|
});
|
9684
9683
|
|
9685
9684
|
const createBaseButtonSelectionGroupInternalClass = (componentName) => {
|
@@ -9778,10 +9777,10 @@ const createBaseButtonSelectionGroupInternalClass = (componentName) => {
|
|
9778
9777
|
return BaseButtonSelectionGroupInternalClass;
|
9779
9778
|
};
|
9780
9779
|
|
9781
|
-
const componentName$
|
9780
|
+
const componentName$q = getComponentName('button-selection-group-internal');
|
9782
9781
|
|
9783
9782
|
class ButtonSelectionGroupInternalClass extends createBaseButtonSelectionGroupInternalClass(
|
9784
|
-
componentName$
|
9783
|
+
componentName$q
|
9785
9784
|
) {
|
9786
9785
|
getSelectedNode() {
|
9787
9786
|
return this.items.find((item) => item.hasAttribute('selected'));
|
@@ -10013,7 +10012,7 @@ const buttonSelectionGroupStyles = `
|
|
10013
10012
|
${resetInputCursor('vaadin-text-field')}
|
10014
10013
|
`;
|
10015
10014
|
|
10016
|
-
const componentName$
|
10015
|
+
const componentName$p = getComponentName('button-selection-group');
|
10017
10016
|
|
10018
10017
|
const buttonSelectionGroupMixin = (superclass) =>
|
10019
10018
|
class ButtonMultiSelectionGroupMixinClass extends superclass {
|
@@ -10022,19 +10021,19 @@ const buttonSelectionGroupMixin = (superclass) =>
|
|
10022
10021
|
const template = document.createElement('template');
|
10023
10022
|
|
10024
10023
|
template.innerHTML = `
|
10025
|
-
<${componentName$
|
10024
|
+
<${componentName$q}
|
10026
10025
|
name="button-selection-group"
|
10027
10026
|
slot="input"
|
10028
10027
|
tabindex="-1"
|
10029
10028
|
part="internal-component"
|
10030
10029
|
>
|
10031
10030
|
<slot></slot>
|
10032
|
-
</${componentName$
|
10031
|
+
</${componentName$q}>
|
10033
10032
|
`;
|
10034
10033
|
|
10035
10034
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
10036
10035
|
|
10037
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
10036
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$q);
|
10038
10037
|
|
10039
10038
|
forwardAttrs(this, this.inputElement, {
|
10040
10039
|
includeAttrs: ['size', 'default-value', 'allow-deselect'],
|
@@ -10059,7 +10058,7 @@ const ButtonSelectionGroupClass = compose(
|
|
10059
10058
|
wrappedEleName: 'vaadin-text-field',
|
10060
10059
|
style: () => buttonSelectionGroupStyles,
|
10061
10060
|
excludeAttrsSync: ['tabindex'],
|
10062
|
-
componentName: componentName$
|
10061
|
+
componentName: componentName$p,
|
10063
10062
|
})
|
10064
10063
|
);
|
10065
10064
|
|
@@ -10075,22 +10074,22 @@ const createBaseButtonSelectionGroupMappings = (vars) => ({
|
|
10075
10074
|
[vars.hostWidth]: refs.width,
|
10076
10075
|
});
|
10077
10076
|
|
10078
|
-
const vars$
|
10077
|
+
const vars$n = ButtonSelectionGroupClass.cssVarList;
|
10079
10078
|
|
10080
10079
|
const buttonSelectionGroup = {
|
10081
|
-
...createBaseButtonSelectionGroupMappings(vars$
|
10080
|
+
...createBaseButtonSelectionGroupMappings(vars$n),
|
10082
10081
|
};
|
10083
10082
|
|
10084
10083
|
var buttonSelectionGroup$1 = /*#__PURE__*/Object.freeze({
|
10085
10084
|
__proto__: null,
|
10086
10085
|
default: buttonSelectionGroup,
|
10087
|
-
vars: vars$
|
10086
|
+
vars: vars$n
|
10088
10087
|
});
|
10089
10088
|
|
10090
|
-
const componentName$
|
10089
|
+
const componentName$o = getComponentName('button-multi-selection-group-internal');
|
10091
10090
|
|
10092
10091
|
class ButtonMultiSelectionGroupInternalClass extends createBaseButtonSelectionGroupInternalClass(
|
10093
|
-
componentName$
|
10092
|
+
componentName$o
|
10094
10093
|
) {
|
10095
10094
|
#getSelectedNodes() {
|
10096
10095
|
return this.items.filter((item) => item.hasAttribute('selected'));
|
@@ -10193,7 +10192,7 @@ class ButtonMultiSelectionGroupInternalClass extends createBaseButtonSelectionGr
|
|
10193
10192
|
}
|
10194
10193
|
}
|
10195
10194
|
|
10196
|
-
const componentName$
|
10195
|
+
const componentName$n = getComponentName('button-multi-selection-group');
|
10197
10196
|
|
10198
10197
|
const buttonMultiSelectionGroupMixin = (superclass) =>
|
10199
10198
|
class ButtonMultiSelectionGroupMixinClass extends superclass {
|
@@ -10202,19 +10201,19 @@ const buttonMultiSelectionGroupMixin = (superclass) =>
|
|
10202
10201
|
const template = document.createElement('template');
|
10203
10202
|
|
10204
10203
|
template.innerHTML = `
|
10205
|
-
<${componentName$
|
10204
|
+
<${componentName$o}
|
10206
10205
|
name="button-selection-group"
|
10207
10206
|
slot="input"
|
10208
10207
|
tabindex="-1"
|
10209
10208
|
part="internal-component"
|
10210
10209
|
>
|
10211
10210
|
<slot></slot>
|
10212
|
-
</${componentName$
|
10211
|
+
</${componentName$o}>
|
10213
10212
|
`;
|
10214
10213
|
|
10215
10214
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
10216
10215
|
|
10217
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
10216
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$o);
|
10218
10217
|
|
10219
10218
|
forwardAttrs(this, this.inputElement, {
|
10220
10219
|
includeAttrs: ['size', 'default-values', 'min-items-selection', 'max-items-selection'],
|
@@ -10239,23 +10238,23 @@ const ButtonMultiSelectionGroupClass = compose(
|
|
10239
10238
|
wrappedEleName: 'vaadin-text-field',
|
10240
10239
|
style: () => buttonSelectionGroupStyles,
|
10241
10240
|
excludeAttrsSync: ['tabindex'],
|
10242
|
-
componentName: componentName$
|
10241
|
+
componentName: componentName$n,
|
10243
10242
|
})
|
10244
10243
|
);
|
10245
10244
|
|
10246
|
-
const vars$
|
10245
|
+
const vars$m = ButtonMultiSelectionGroupClass.cssVarList;
|
10247
10246
|
|
10248
10247
|
const buttonMultiSelectionGroup = {
|
10249
|
-
...createBaseButtonSelectionGroupMappings(vars$
|
10248
|
+
...createBaseButtonSelectionGroupMappings(vars$m),
|
10250
10249
|
};
|
10251
10250
|
|
10252
10251
|
var buttonMultiSelectionGroup$1 = /*#__PURE__*/Object.freeze({
|
10253
10252
|
__proto__: null,
|
10254
10253
|
default: buttonMultiSelectionGroup,
|
10255
|
-
vars: vars$
|
10254
|
+
vars: vars$m
|
10256
10255
|
});
|
10257
10256
|
|
10258
|
-
const componentName$
|
10257
|
+
const componentName$m = getComponentName('modal');
|
10259
10258
|
|
10260
10259
|
const customMixin$5 = (superclass) =>
|
10261
10260
|
class ModalMixinClass extends superclass {
|
@@ -10354,7 +10353,7 @@ const ModalClass = compose(
|
|
10354
10353
|
wrappedEleName: 'vaadin-dialog',
|
10355
10354
|
style: () => ``,
|
10356
10355
|
excludeAttrsSync: ['tabindex', 'opened'],
|
10357
|
-
componentName: componentName$
|
10356
|
+
componentName: componentName$m,
|
10358
10357
|
})
|
10359
10358
|
);
|
10360
10359
|
|
@@ -10368,14 +10367,14 @@ const modal = {
|
|
10368
10367
|
[compVars$2.overlayWidth]: '540px',
|
10369
10368
|
};
|
10370
10369
|
|
10371
|
-
const vars$
|
10370
|
+
const vars$l = {
|
10372
10371
|
...compVars$2,
|
10373
10372
|
};
|
10374
10373
|
|
10375
10374
|
var modal$1 = /*#__PURE__*/Object.freeze({
|
10376
10375
|
__proto__: null,
|
10377
10376
|
default: modal,
|
10378
|
-
vars: vars$
|
10377
|
+
vars: vars$l
|
10379
10378
|
});
|
10380
10379
|
|
10381
10380
|
const isValidDataType = (data) => {
|
@@ -10451,7 +10450,7 @@ const defaultRowDetailsRenderer = (item, itemLabelsMapping) => {
|
|
10451
10450
|
`;
|
10452
10451
|
};
|
10453
10452
|
|
10454
|
-
const componentName$
|
10453
|
+
const componentName$l = getComponentName('grid');
|
10455
10454
|
|
10456
10455
|
const GridMixin = (superclass) =>
|
10457
10456
|
class GridMixinClass extends superclass {
|
@@ -10805,52 +10804,52 @@ const GridClass = compose(
|
|
10805
10804
|
/*!css*/
|
10806
10805
|
`,
|
10807
10806
|
excludeAttrsSync: ['columns', 'tabindex'],
|
10808
|
-
componentName: componentName$
|
10807
|
+
componentName: componentName$l,
|
10809
10808
|
})
|
10810
10809
|
);
|
10811
10810
|
|
10812
10811
|
const globalRefs$g = getThemeRefs(globals);
|
10813
|
-
const vars$
|
10812
|
+
const vars$k = GridClass.cssVarList;
|
10814
10813
|
|
10815
10814
|
const grid = {
|
10816
|
-
[vars$
|
10817
|
-
[vars$
|
10818
|
-
[vars$
|
10819
|
-
[vars$
|
10820
|
-
[vars$
|
10821
|
-
|
10822
|
-
[vars$
|
10823
|
-
[vars$
|
10824
|
-
|
10825
|
-
[vars$
|
10826
|
-
[vars$
|
10827
|
-
[vars$
|
10828
|
-
|
10829
|
-
[vars$
|
10830
|
-
[vars$
|
10831
|
-
[vars$
|
10832
|
-
[vars$
|
10833
|
-
|
10834
|
-
[vars$
|
10835
|
-
[vars$
|
10836
|
-
|
10837
|
-
[vars$
|
10838
|
-
[vars$
|
10839
|
-
[vars$
|
10840
|
-
|
10841
|
-
[vars$
|
10842
|
-
[vars$
|
10843
|
-
[vars$
|
10844
|
-
[vars$
|
10845
|
-
[vars$
|
10846
|
-
[vars$
|
10847
|
-
[vars$
|
10848
|
-
[vars$
|
10849
|
-
[vars$
|
10850
|
-
[vars$
|
10815
|
+
[vars$k.hostWidth]: '100%',
|
10816
|
+
[vars$k.hostHeight]: '100%',
|
10817
|
+
[vars$k.hostMinHeight]: '400px',
|
10818
|
+
[vars$k.fontWeight]: '400',
|
10819
|
+
[vars$k.backgroundColor]: globalRefs$g.colors.surface.main,
|
10820
|
+
|
10821
|
+
[vars$k.fontSize]: refs.fontSize,
|
10822
|
+
[vars$k.fontFamily]: refs.fontFamily,
|
10823
|
+
|
10824
|
+
[vars$k.sortIndicatorsColor]: globalRefs$g.colors.surface.light,
|
10825
|
+
[vars$k.activeSortIndicator]: globalRefs$g.colors.surface.dark,
|
10826
|
+
[vars$k.resizeHandleColor]: globalRefs$g.colors.surface.light,
|
10827
|
+
|
10828
|
+
[vars$k.borderWidth]: refs.borderWidth,
|
10829
|
+
[vars$k.borderStyle]: refs.borderStyle,
|
10830
|
+
[vars$k.borderRadius]: refs.borderRadius,
|
10831
|
+
[vars$k.borderColor]: 'transparent',
|
10832
|
+
|
10833
|
+
[vars$k.headerRowTextColor]: globalRefs$g.colors.surface.dark,
|
10834
|
+
[vars$k.separatorColor]: globalRefs$g.colors.surface.light,
|
10835
|
+
|
10836
|
+
[vars$k.valueTextColor]: globalRefs$g.colors.surface.contrast,
|
10837
|
+
[vars$k.selectedBackgroundColor]: globalRefs$g.colors.surface.highlight,
|
10838
|
+
[vars$k.hostDirection]: globalRefs$g.direction,
|
10839
|
+
|
10840
|
+
[vars$k.toggleDetailsPanelButtonSize]: '1em',
|
10841
|
+
[vars$k.toggleDetailsPanelButtonOpenedColor]: globalRefs$g.colors.surface.contrast,
|
10842
|
+
[vars$k.toggleDetailsPanelButtonClosedColor]: globalRefs$g.colors.surface.light,
|
10843
|
+
[vars$k.toggleDetailsPanelButtonCursor]: 'pointer',
|
10844
|
+
[vars$k.detailsPanelBackgroundColor]: globalRefs$g.colors.surface.highlight,
|
10845
|
+
[vars$k.detailsPanelBorderTopColor]: globalRefs$g.colors.surface.light,
|
10846
|
+
[vars$k.detailsPanelLabelsColor]: globalRefs$g.colors.surface.dark,
|
10847
|
+
[vars$k.detailsPanelLabelsFontSize]: '0.8em',
|
10848
|
+
[vars$k.detailsPanelItemsGap]: '2em',
|
10849
|
+
[vars$k.detailsPanelPadding]: '12px 0',
|
10851
10850
|
|
10852
10851
|
_bordered: {
|
10853
|
-
[vars$
|
10852
|
+
[vars$k.borderColor]: refs.borderColor,
|
10854
10853
|
},
|
10855
10854
|
};
|
10856
10855
|
|
@@ -10858,10 +10857,10 @@ var grid$1 = /*#__PURE__*/Object.freeze({
|
|
10858
10857
|
__proto__: null,
|
10859
10858
|
default: grid,
|
10860
10859
|
grid: grid,
|
10861
|
-
vars: vars$
|
10860
|
+
vars: vars$k
|
10862
10861
|
});
|
10863
10862
|
|
10864
|
-
const componentName$
|
10863
|
+
const componentName$k = getComponentName('notification-card');
|
10865
10864
|
|
10866
10865
|
const notificationCardMixin = (superclass) =>
|
10867
10866
|
class NotificationCardMixinClass extends superclass {
|
@@ -10969,54 +10968,54 @@ const NotificationCardClass = compose(
|
|
10969
10968
|
}
|
10970
10969
|
`,
|
10971
10970
|
excludeAttrsSync: ['tabindex'],
|
10972
|
-
componentName: componentName$
|
10971
|
+
componentName: componentName$k,
|
10973
10972
|
})
|
10974
10973
|
);
|
10975
10974
|
|
10976
10975
|
const globalRefs$f = getThemeRefs(globals);
|
10977
|
-
const vars$
|
10976
|
+
const vars$j = NotificationCardClass.cssVarList;
|
10978
10977
|
|
10979
10978
|
const shadowColor$2 = '#00000020';
|
10980
10979
|
|
10981
10980
|
const notification = {
|
10982
|
-
[vars$
|
10983
|
-
[vars$
|
10984
|
-
[vars$
|
10985
|
-
[vars$
|
10986
|
-
[vars$
|
10987
|
-
[vars$
|
10988
|
-
[vars$
|
10989
|
-
[vars$
|
10990
|
-
[vars$
|
10981
|
+
[vars$j.hostMinWidth]: '415px',
|
10982
|
+
[vars$j.fontFamily]: globalRefs$f.fonts.font1.family,
|
10983
|
+
[vars$j.fontSize]: globalRefs$f.typography.body1.size,
|
10984
|
+
[vars$j.backgroundColor]: globalRefs$f.colors.surface.main,
|
10985
|
+
[vars$j.textColor]: globalRefs$f.colors.surface.contrast,
|
10986
|
+
[vars$j.boxShadow]: `${globalRefs$f.shadow.wide.xl} ${shadowColor$2}, ${globalRefs$f.shadow.narrow.xl} ${shadowColor$2}`,
|
10987
|
+
[vars$j.verticalPadding]: '0.625em',
|
10988
|
+
[vars$j.horizontalPadding]: '1.5em',
|
10989
|
+
[vars$j.borderRadius]: globalRefs$f.radius.xs,
|
10991
10990
|
|
10992
10991
|
_bordered: {
|
10993
|
-
[vars$
|
10994
|
-
[vars$
|
10995
|
-
[vars$
|
10992
|
+
[vars$j.borderWidth]: globalRefs$f.border.sm,
|
10993
|
+
[vars$j.borderStyle]: 'solid',
|
10994
|
+
[vars$j.borderColor]: 'transparent',
|
10996
10995
|
},
|
10997
10996
|
|
10998
10997
|
size: {
|
10999
|
-
xs: { [vars$
|
11000
|
-
sm: { [vars$
|
11001
|
-
md: { [vars$
|
11002
|
-
lg: { [vars$
|
10998
|
+
xs: { [vars$j.fontSize]: '12px' },
|
10999
|
+
sm: { [vars$j.fontSize]: '14px' },
|
11000
|
+
md: { [vars$j.fontSize]: '16px' },
|
11001
|
+
lg: { [vars$j.fontSize]: '18px' },
|
11003
11002
|
},
|
11004
11003
|
|
11005
11004
|
mode: {
|
11006
11005
|
primary: {
|
11007
|
-
[vars$
|
11008
|
-
[vars$
|
11009
|
-
[vars$
|
11006
|
+
[vars$j.backgroundColor]: globalRefs$f.colors.primary.main,
|
11007
|
+
[vars$j.textColor]: globalRefs$f.colors.primary.contrast,
|
11008
|
+
[vars$j.borderColor]: globalRefs$f.colors.primary.light,
|
11010
11009
|
},
|
11011
11010
|
success: {
|
11012
|
-
[vars$
|
11013
|
-
[vars$
|
11014
|
-
[vars$
|
11011
|
+
[vars$j.backgroundColor]: globalRefs$f.colors.success.main,
|
11012
|
+
[vars$j.textColor]: globalRefs$f.colors.success.contrast,
|
11013
|
+
[vars$j.borderColor]: globalRefs$f.colors.success.light,
|
11015
11014
|
},
|
11016
11015
|
error: {
|
11017
|
-
[vars$
|
11018
|
-
[vars$
|
11019
|
-
[vars$
|
11016
|
+
[vars$j.backgroundColor]: globalRefs$f.colors.error.main,
|
11017
|
+
[vars$j.textColor]: globalRefs$f.colors.error.contrast,
|
11018
|
+
[vars$j.borderColor]: globalRefs$f.colors.error.light,
|
11020
11019
|
},
|
11021
11020
|
},
|
11022
11021
|
};
|
@@ -11024,10 +11023,10 @@ const notification = {
|
|
11024
11023
|
var notificationCard = /*#__PURE__*/Object.freeze({
|
11025
11024
|
__proto__: null,
|
11026
11025
|
default: notification,
|
11027
|
-
vars: vars$
|
11026
|
+
vars: vars$j
|
11028
11027
|
});
|
11029
11028
|
|
11030
|
-
const componentName$
|
11029
|
+
const componentName$j = getComponentName('multi-select-combo-box');
|
11031
11030
|
|
11032
11031
|
const multiSelectComboBoxMixin = (superclass) =>
|
11033
11032
|
class MultiSelectComboBoxMixinClass extends superclass {
|
@@ -11661,93 +11660,93 @@ const MultiSelectComboBoxClass = compose(
|
|
11661
11660
|
// Note: we exclude `placeholder` because the vaadin component observes it and
|
11662
11661
|
// tries to override it, causing us to lose the user set placeholder.
|
11663
11662
|
excludeAttrsSync: ['tabindex', 'size', 'data', 'placeholder'],
|
11664
|
-
componentName: componentName$
|
11663
|
+
componentName: componentName$j,
|
11665
11664
|
includeForwardProps: ['items', 'renderer', 'selectedItems'],
|
11666
11665
|
})
|
11667
11666
|
);
|
11668
11667
|
|
11669
11668
|
const globalRefs$e = getThemeRefs(globals);
|
11670
|
-
const vars$
|
11669
|
+
const vars$i = MultiSelectComboBoxClass.cssVarList;
|
11671
11670
|
|
11672
11671
|
const multiSelectComboBox = {
|
11673
|
-
[vars$
|
11674
|
-
[vars$
|
11675
|
-
[vars$
|
11676
|
-
[vars$
|
11677
|
-
[vars$
|
11678
|
-
[vars$
|
11679
|
-
[vars$
|
11680
|
-
[vars$
|
11681
|
-
[vars$
|
11682
|
-
[vars$
|
11683
|
-
[vars$
|
11684
|
-
[vars$
|
11685
|
-
[vars$
|
11686
|
-
[vars$
|
11687
|
-
[vars$
|
11688
|
-
[vars$
|
11689
|
-
[vars$
|
11690
|
-
[vars$
|
11691
|
-
[vars$
|
11692
|
-
[vars$
|
11693
|
-
[vars$
|
11694
|
-
[vars$
|
11695
|
-
[vars$
|
11696
|
-
[vars$
|
11697
|
-
[vars$
|
11698
|
-
[vars$
|
11699
|
-
[vars$
|
11700
|
-
[vars$
|
11701
|
-
[vars$
|
11702
|
-
[vars$
|
11703
|
-
[vars$
|
11704
|
-
[vars$
|
11705
|
-
[vars$
|
11706
|
-
[vars$
|
11707
|
-
[vars$
|
11708
|
-
[vars$
|
11709
|
-
[vars$
|
11710
|
-
[vars$
|
11711
|
-
[vars$
|
11712
|
-
[vars$
|
11713
|
-
[vars$
|
11672
|
+
[vars$i.hostWidth]: refs.width,
|
11673
|
+
[vars$i.hostDirection]: refs.direction,
|
11674
|
+
[vars$i.fontSize]: refs.fontSize,
|
11675
|
+
[vars$i.fontFamily]: refs.fontFamily,
|
11676
|
+
[vars$i.labelFontSize]: refs.labelFontSize,
|
11677
|
+
[vars$i.labelFontWeight]: refs.labelFontWeight,
|
11678
|
+
[vars$i.labelTextColor]: refs.labelTextColor,
|
11679
|
+
[vars$i.errorMessageTextColor]: refs.errorMessageTextColor,
|
11680
|
+
[vars$i.inputBorderColor]: refs.borderColor,
|
11681
|
+
[vars$i.inputBorderWidth]: refs.borderWidth,
|
11682
|
+
[vars$i.inputBorderStyle]: refs.borderStyle,
|
11683
|
+
[vars$i.inputBorderRadius]: refs.borderRadius,
|
11684
|
+
[vars$i.inputOutlineColor]: refs.outlineColor,
|
11685
|
+
[vars$i.inputOutlineOffset]: refs.outlineOffset,
|
11686
|
+
[vars$i.inputOutlineWidth]: refs.outlineWidth,
|
11687
|
+
[vars$i.inputOutlineStyle]: refs.outlineStyle,
|
11688
|
+
[vars$i.labelRequiredIndicator]: refs.requiredIndicator,
|
11689
|
+
[vars$i.inputValueTextColor]: refs.valueTextColor,
|
11690
|
+
[vars$i.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
11691
|
+
[vars$i.inputBackgroundColor]: refs.backgroundColor,
|
11692
|
+
[vars$i.inputHorizontalPadding]: refs.horizontalPadding,
|
11693
|
+
[vars$i.inputVerticalPadding]: refs.verticalPadding,
|
11694
|
+
[vars$i.inputHeight]: refs.inputHeight,
|
11695
|
+
[vars$i.inputDropdownButtonColor]: globalRefs$e.colors.surface.dark,
|
11696
|
+
[vars$i.inputDropdownButtonCursor]: 'pointer',
|
11697
|
+
[vars$i.inputDropdownButtonSize]: refs.toggleButtonSize,
|
11698
|
+
[vars$i.inputDropdownButtonOffset]: globalRefs$e.spacing.xs,
|
11699
|
+
[vars$i.overlayItemPaddingInlineStart]: globalRefs$e.spacing.xs,
|
11700
|
+
[vars$i.overlayItemPaddingInlineEnd]: globalRefs$e.spacing.lg,
|
11701
|
+
[vars$i.chipFontSize]: refs.chipFontSize,
|
11702
|
+
[vars$i.chipTextColor]: globalRefs$e.colors.surface.contrast,
|
11703
|
+
[vars$i.chipBackgroundColor]: globalRefs$e.colors.surface.light,
|
11704
|
+
[vars$i.labelPosition]: refs.labelPosition,
|
11705
|
+
[vars$i.labelTopPosition]: refs.labelTopPosition,
|
11706
|
+
[vars$i.labelLeftPosition]: refs.labelLeftPosition,
|
11707
|
+
[vars$i.labelHorizontalPosition]: refs.labelHorizontalPosition,
|
11708
|
+
[vars$i.inputTransformY]: refs.inputTransformY,
|
11709
|
+
[vars$i.inputTransition]: refs.inputTransition,
|
11710
|
+
[vars$i.marginInlineStart]: refs.marginInlineStart,
|
11711
|
+
[vars$i.placeholderOpacity]: refs.placeholderOpacity,
|
11712
|
+
[vars$i.inputVerticalAlignment]: refs.inputVerticalAlignment,
|
11714
11713
|
|
11715
11714
|
labelType: {
|
11716
11715
|
floating: {
|
11717
|
-
[vars$
|
11716
|
+
[vars$i.inputHorizontalPadding]: '0.25em',
|
11718
11717
|
_hasValue: {
|
11719
|
-
[vars$
|
11718
|
+
[vars$i.inputHorizontalPadding]: '0.45em',
|
11720
11719
|
},
|
11721
11720
|
},
|
11722
11721
|
},
|
11723
11722
|
|
11724
11723
|
_readonly: {
|
11725
|
-
[vars$
|
11724
|
+
[vars$i.inputDropdownButtonCursor]: 'default',
|
11726
11725
|
},
|
11727
11726
|
|
11728
11727
|
// Overlay theme exposed via the component:
|
11729
|
-
[vars$
|
11730
|
-
[vars$
|
11731
|
-
[vars$
|
11732
|
-
[vars$
|
11733
|
-
[vars$
|
11734
|
-
[vars$
|
11728
|
+
[vars$i.overlayFontSize]: refs.fontSize,
|
11729
|
+
[vars$i.overlayFontFamily]: refs.fontFamily,
|
11730
|
+
[vars$i.overlayCursor]: 'pointer',
|
11731
|
+
[vars$i.overlayItemBoxShadow]: 'none',
|
11732
|
+
[vars$i.overlayBackground]: refs.backgroundColor,
|
11733
|
+
[vars$i.overlayTextColor]: refs.valueTextColor,
|
11735
11734
|
|
11736
11735
|
// Overlay direct theme:
|
11737
|
-
[vars$
|
11738
|
-
[vars$
|
11736
|
+
[vars$i.overlay.minHeight]: '400px',
|
11737
|
+
[vars$i.overlay.margin]: '0',
|
11739
11738
|
};
|
11740
11739
|
|
11741
11740
|
var multiSelectComboBox$1 = /*#__PURE__*/Object.freeze({
|
11742
11741
|
__proto__: null,
|
11743
11742
|
default: multiSelectComboBox,
|
11744
11743
|
multiSelectComboBox: multiSelectComboBox,
|
11745
|
-
vars: vars$
|
11744
|
+
vars: vars$i
|
11746
11745
|
});
|
11747
11746
|
|
11748
|
-
const componentName$
|
11747
|
+
const componentName$i = getComponentName('badge');
|
11749
11748
|
|
11750
|
-
class RawBadge extends createBaseClass({ componentName: componentName$
|
11749
|
+
class RawBadge extends createBaseClass({ componentName: componentName$i, baseSelector: ':host > div' }) {
|
11751
11750
|
constructor() {
|
11752
11751
|
super();
|
11753
11752
|
|
@@ -11799,65 +11798,65 @@ const BadgeClass = compose(
|
|
11799
11798
|
)(RawBadge);
|
11800
11799
|
|
11801
11800
|
const globalRefs$d = getThemeRefs(globals);
|
11802
|
-
const vars$
|
11801
|
+
const vars$h = BadgeClass.cssVarList;
|
11803
11802
|
|
11804
11803
|
const badge$2 = {
|
11805
|
-
[vars$
|
11806
|
-
[vars$
|
11804
|
+
[vars$h.hostWidth]: 'fit-content',
|
11805
|
+
[vars$h.hostDirection]: globalRefs$d.direction,
|
11807
11806
|
|
11808
|
-
[vars$
|
11807
|
+
[vars$h.textAlign]: 'center',
|
11809
11808
|
|
11810
|
-
[vars$
|
11811
|
-
[vars$
|
11809
|
+
[vars$h.fontFamily]: globalRefs$d.fonts.font1.family,
|
11810
|
+
[vars$h.fontWeight]: '400',
|
11812
11811
|
|
11813
|
-
[vars$
|
11814
|
-
[vars$
|
11812
|
+
[vars$h.verticalPadding]: '0.25em',
|
11813
|
+
[vars$h.horizontalPadding]: '0.5em',
|
11815
11814
|
|
11816
|
-
[vars$
|
11817
|
-
[vars$
|
11818
|
-
[vars$
|
11819
|
-
[vars$
|
11815
|
+
[vars$h.borderWidth]: globalRefs$d.border.xs,
|
11816
|
+
[vars$h.borderRadius]: globalRefs$d.radius.xs,
|
11817
|
+
[vars$h.borderColor]: 'transparent',
|
11818
|
+
[vars$h.borderStyle]: 'solid',
|
11820
11819
|
|
11821
11820
|
_fullWidth: {
|
11822
|
-
[vars$
|
11821
|
+
[vars$h.hostWidth]: '100%',
|
11823
11822
|
},
|
11824
11823
|
|
11825
11824
|
size: {
|
11826
|
-
xs: { [vars$
|
11827
|
-
sm: { [vars$
|
11828
|
-
md: { [vars$
|
11829
|
-
lg: { [vars$
|
11825
|
+
xs: { [vars$h.fontSize]: '12px' },
|
11826
|
+
sm: { [vars$h.fontSize]: '14px' },
|
11827
|
+
md: { [vars$h.fontSize]: '16px' },
|
11828
|
+
lg: { [vars$h.fontSize]: '18px' },
|
11830
11829
|
},
|
11831
11830
|
|
11832
11831
|
mode: {
|
11833
11832
|
default: {
|
11834
|
-
[vars$
|
11833
|
+
[vars$h.textColor]: globalRefs$d.colors.surface.dark,
|
11835
11834
|
_bordered: {
|
11836
|
-
[vars$
|
11835
|
+
[vars$h.borderColor]: globalRefs$d.colors.surface.light,
|
11837
11836
|
},
|
11838
11837
|
},
|
11839
11838
|
primary: {
|
11840
|
-
[vars$
|
11839
|
+
[vars$h.textColor]: globalRefs$d.colors.primary.main,
|
11841
11840
|
_bordered: {
|
11842
|
-
[vars$
|
11841
|
+
[vars$h.borderColor]: globalRefs$d.colors.primary.light,
|
11843
11842
|
},
|
11844
11843
|
},
|
11845
11844
|
secondary: {
|
11846
|
-
[vars$
|
11845
|
+
[vars$h.textColor]: globalRefs$d.colors.secondary.main,
|
11847
11846
|
_bordered: {
|
11848
|
-
[vars$
|
11847
|
+
[vars$h.borderColor]: globalRefs$d.colors.secondary.light,
|
11849
11848
|
},
|
11850
11849
|
},
|
11851
11850
|
error: {
|
11852
|
-
[vars$
|
11851
|
+
[vars$h.textColor]: globalRefs$d.colors.error.main,
|
11853
11852
|
_bordered: {
|
11854
|
-
[vars$
|
11853
|
+
[vars$h.borderColor]: globalRefs$d.colors.error.light,
|
11855
11854
|
},
|
11856
11855
|
},
|
11857
11856
|
success: {
|
11858
|
-
[vars$
|
11857
|
+
[vars$h.textColor]: globalRefs$d.colors.success.main,
|
11859
11858
|
_bordered: {
|
11860
|
-
[vars$
|
11859
|
+
[vars$h.borderColor]: globalRefs$d.colors.success.light,
|
11861
11860
|
},
|
11862
11861
|
},
|
11863
11862
|
},
|
@@ -11866,11 +11865,11 @@ const badge$2 = {
|
|
11866
11865
|
var badge$3 = /*#__PURE__*/Object.freeze({
|
11867
11866
|
__proto__: null,
|
11868
11867
|
default: badge$2,
|
11869
|
-
vars: vars$
|
11868
|
+
vars: vars$h
|
11870
11869
|
});
|
11871
11870
|
|
11872
|
-
const componentName$
|
11873
|
-
class RawAvatar extends createBaseClass({ componentName: componentName$
|
11871
|
+
const componentName$h = getComponentName('avatar');
|
11872
|
+
class RawAvatar extends createBaseClass({ componentName: componentName$h, baseSelector: ':host > .wrapper' }) {
|
11874
11873
|
constructor() {
|
11875
11874
|
super();
|
11876
11875
|
|
@@ -12009,21 +12008,21 @@ const avatar = {
|
|
12009
12008
|
},
|
12010
12009
|
};
|
12011
12010
|
|
12012
|
-
const vars$
|
12011
|
+
const vars$g = {
|
12013
12012
|
...compVars$1,
|
12014
12013
|
};
|
12015
12014
|
|
12016
12015
|
var avatar$1 = /*#__PURE__*/Object.freeze({
|
12017
12016
|
__proto__: null,
|
12018
12017
|
default: avatar,
|
12019
|
-
vars: vars$
|
12018
|
+
vars: vars$g
|
12020
12019
|
});
|
12021
12020
|
|
12022
|
-
const componentName$
|
12021
|
+
const componentName$g = getComponentName('mappings-field-internal');
|
12023
12022
|
|
12024
|
-
createBaseInputClass({ componentName: componentName$
|
12023
|
+
createBaseInputClass({ componentName: componentName$g, baseSelector: 'div' });
|
12025
12024
|
|
12026
|
-
const componentName$
|
12025
|
+
const componentName$f = getComponentName('mappings-field');
|
12027
12026
|
|
12028
12027
|
const customMixin$4 = (superclass) =>
|
12029
12028
|
class MappingsFieldMixinClass extends superclass {
|
@@ -12052,14 +12051,14 @@ const customMixin$4 = (superclass) =>
|
|
12052
12051
|
const template = document.createElement('template');
|
12053
12052
|
|
12054
12053
|
template.innerHTML = `
|
12055
|
-
<${componentName$
|
12054
|
+
<${componentName$g}
|
12056
12055
|
tabindex="-1"
|
12057
|
-
></${componentName$
|
12056
|
+
></${componentName$g}>
|
12058
12057
|
`;
|
12059
12058
|
|
12060
12059
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
12061
12060
|
|
12062
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
12061
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$g);
|
12063
12062
|
|
12064
12063
|
forwardAttrs(this, this.inputElement, {
|
12065
12064
|
includeAttrs: [
|
@@ -12191,47 +12190,47 @@ const MappingsFieldClass = compose(
|
|
12191
12190
|
'options',
|
12192
12191
|
'error-message',
|
12193
12192
|
],
|
12194
|
-
componentName: componentName$
|
12193
|
+
componentName: componentName$f,
|
12195
12194
|
})
|
12196
12195
|
);
|
12197
12196
|
|
12198
12197
|
const globalRefs$b = getThemeRefs(globals);
|
12199
12198
|
|
12200
|
-
const vars$
|
12199
|
+
const vars$f = MappingsFieldClass.cssVarList;
|
12201
12200
|
|
12202
12201
|
const mappingsField = {
|
12203
|
-
[vars$
|
12204
|
-
[vars$
|
12205
|
-
[vars$
|
12206
|
-
[vars$
|
12207
|
-
[vars$
|
12208
|
-
[vars$
|
12209
|
-
[vars$
|
12210
|
-
[vars$
|
12211
|
-
[vars$
|
12212
|
-
[vars$
|
12202
|
+
[vars$f.hostWidth]: refs.width,
|
12203
|
+
[vars$f.hostDirection]: refs.direction,
|
12204
|
+
[vars$f.fontSize]: refs.fontSize,
|
12205
|
+
[vars$f.fontFamily]: refs.fontFamily,
|
12206
|
+
[vars$f.separatorFontSize]: '14px',
|
12207
|
+
[vars$f.labelsFontSize]: '14px',
|
12208
|
+
[vars$f.labelsLineHeight]: '1',
|
12209
|
+
[vars$f.labelsMarginBottom]: '6px',
|
12210
|
+
[vars$f.labelTextColor]: refs.labelTextColor,
|
12211
|
+
[vars$f.itemMarginBottom]: '1em',
|
12213
12212
|
// To be positioned correctly, the min width has to match the text field min width
|
12214
|
-
[vars$
|
12213
|
+
[vars$f.valueLabelMinWidth]: refs.minWidth,
|
12215
12214
|
// To be positioned correctly, the min width has to match the combo box field min width
|
12216
|
-
[vars$
|
12217
|
-
[vars$
|
12218
|
-
[vars$
|
12215
|
+
[vars$f.attrLabelMinWidth]: `calc(12em + 2 * ${globalRefs$b.border.xs})`,
|
12216
|
+
[vars$f.separatorWidth]: '70px',
|
12217
|
+
[vars$f.removeButtonWidth]: '60px',
|
12219
12218
|
};
|
12220
12219
|
|
12221
12220
|
var mappingsField$1 = /*#__PURE__*/Object.freeze({
|
12222
12221
|
__proto__: null,
|
12223
12222
|
default: mappingsField,
|
12224
12223
|
mappingsField: mappingsField,
|
12225
|
-
vars: vars$
|
12224
|
+
vars: vars$f
|
12226
12225
|
});
|
12227
12226
|
|
12228
12227
|
var deleteIcon = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iMTgiIHZpZXdCb3g9IjAgMCAxNCAxOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEgMTZDMSAxNy4xIDEuOSAxOCAzIDE4SDExQzEyLjEgMTggMTMgMTcuMSAxMyAxNlY0SDFWMTZaTTMgNkgxMVYxNkgzVjZaTTEwLjUgMUw5LjUgMEg0LjVMMy41IDFIMFYzSDE0VjFIMTAuNVoiIGZpbGw9ImN1cnJlbnRjb2xvciIvPgo8L3N2Zz4K";
|
12229
12228
|
|
12230
12229
|
var editIcon = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTUiIGhlaWdodD0iMTUiIHZpZXdCb3g9IjAgMCAxNSAxNSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEwLjAwMDIgMC45OTIxNDlDMTAuMDAwMiAxLjAxNjE1IDEwLjAwMDIgMS4wMTYxNSAxMC4wMDAyIDEuMDE2MTVMOC4yMjQxOSAzLjAwODE1SDIuOTkyMTlDMi40NjQxOSAzLjAwODE1IDIuMDA4MTkgMy40NDAxNSAyLjAwODE5IDMuOTkyMTVWMTIuMDA4MkMyLjAwODE5IDEyLjUzNjIgMi40NDAxOSAxMi45OTIyIDIuOTkyMTkgMTIuOTkyMkg1LjUzNjE5QzUuODQ4MTkgMTMuMDQwMiA2LjE2MDE5IDEzLjA0MDIgNi40NzIxOSAxMi45OTIySDExLjAwODJDMTEuNTM2MiAxMi45OTIyIDExLjk5MjIgMTIuNTYwMiAxMS45OTIyIDEyLjAwODJWNy43ODQxNkwxMy45MzYyIDUuNjI0MTVMMTQuMDA4MiA1LjY3MjE1VjExLjk4NDJDMTQuMDA4MiAxMy42NjQyIDEyLjY2NDIgMTUuMDA4MiAxMS4wMDgyIDE1LjAwODJIMy4wMTYxOUMxLjMzNjE5IDE1LjAwODIgLTAuMDA3ODEyNSAxMy42NjQyIC0wLjAwNzgxMjUgMTEuOTg0MlYzLjk5MjE1Qy0wLjAwNzgxMjUgMi4zMzYxNSAxLjMzNjE5IDAuOTkyMTQ5IDMuMDE2MTkgMC45OTIxNDlIMTAuMDAwMlpNMTEuMjcyMiAyLjYyNDE1TDEyLjYxNjIgNC4xMTIxNUw3LjcyMDE5IDkuNjgwMTZDNy41MDQxOSA5LjkyMDE2IDYuODMyMTkgMTAuMjMyMiA1LjY4MDE5IDEwLjYxNjJDNS42NTYxOSAxMC42NDAyIDUuNjA4MTkgMTAuNjQwMiA1LjU2MDE5IDEwLjYxNjJDNS40NjQxOSAxMC41OTIyIDUuMzkyMTkgMTAuNDcyMiA1LjQ0MDE5IDEwLjM3NjJDNS43NTIxOSA5LjI0ODE2IDYuMDQwMTkgOC41NTIxNiA2LjI1NjE5IDguMzEyMTZMMTEuMjcyMiAyLjYyNDE1Wk0xMS45MjAyIDEuODU2MTVMMTMuMjg4MiAwLjMyMDE0OUMxMy42NDgyIC0wLjA4Nzg1MTYgMTQuMjcyMiAtMC4xMTE4NTIgMTQuNjgwMiAwLjI3MjE0OUMxNS4wODgyIDAuNjMyMTQ5IDE1LjExMjIgMS4yODAxNSAxNC43NTIyIDEuNjg4MTVMMTMuMjY0MiAzLjM2ODE1TDExLjkyMDIgMS44NTYxNVoiIGZpbGw9ImN1cnJlbnRjb2xvciIvPgo8L3N2Zz4K";
|
12231
12230
|
|
12232
|
-
const componentName$
|
12231
|
+
const componentName$e = getComponentName('user-attribute');
|
12233
12232
|
class RawUserAttribute extends createBaseClass({
|
12234
|
-
componentName: componentName$
|
12233
|
+
componentName: componentName$e,
|
12235
12234
|
baseSelector: ':host > .root',
|
12236
12235
|
}) {
|
12237
12236
|
constructor() {
|
@@ -12466,31 +12465,31 @@ const UserAttributeClass = compose(
|
|
12466
12465
|
)(RawUserAttribute);
|
12467
12466
|
|
12468
12467
|
const globalRefs$a = getThemeRefs(globals);
|
12469
|
-
const vars$
|
12468
|
+
const vars$e = UserAttributeClass.cssVarList;
|
12470
12469
|
|
12471
12470
|
const userAttribute = {
|
12472
|
-
[vars$
|
12473
|
-
[vars$
|
12474
|
-
[vars$
|
12475
|
-
[vars$
|
12476
|
-
[vars$
|
12477
|
-
[vars$
|
12471
|
+
[vars$e.hostDirection]: globalRefs$a.direction,
|
12472
|
+
[vars$e.labelTextWidth]: '150px',
|
12473
|
+
[vars$e.valueTextWidth]: '200px',
|
12474
|
+
[vars$e.badgeMaxWidth]: '85px',
|
12475
|
+
[vars$e.itemsGap]: '16px',
|
12476
|
+
[vars$e.hostMinWidth]: '530px',
|
12478
12477
|
_fullWidth: {
|
12479
|
-
[vars$
|
12478
|
+
[vars$e.hostWidth]: '100%',
|
12480
12479
|
},
|
12481
12480
|
};
|
12482
12481
|
|
12483
12482
|
var userAttribute$1 = /*#__PURE__*/Object.freeze({
|
12484
12483
|
__proto__: null,
|
12485
12484
|
default: userAttribute,
|
12486
|
-
vars: vars$
|
12485
|
+
vars: vars$e
|
12487
12486
|
});
|
12488
12487
|
|
12489
12488
|
var greenVIcon = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTggMEMzLjYgMCAwIDMuNiAwIDhDMCAxMi40IDMuNiAxNiA4IDE2QzEyLjQgMTYgMTYgMTIuNCAxNiA4QzE2IDMuNiAxMi40IDAgOCAwWk03LjEgMTEuN0wyLjkgNy42TDQuMyA2LjJMNyA4LjlMMTIgNEwxMy40IDUuNEw3LjEgMTEuN1oiIGZpbGw9IiM0Q0FGNTAiLz4KPC9zdmc+Cg==";
|
12490
12489
|
|
12491
|
-
const componentName$
|
12490
|
+
const componentName$d = getComponentName('user-auth-method');
|
12492
12491
|
class RawUserAuthMethod extends createBaseClass({
|
12493
|
-
componentName: componentName$
|
12492
|
+
componentName: componentName$d,
|
12494
12493
|
baseSelector: ':host > .root',
|
12495
12494
|
}) {
|
12496
12495
|
constructor() {
|
@@ -12683,30 +12682,30 @@ const UserAuthMethodClass = compose(
|
|
12683
12682
|
)(RawUserAuthMethod);
|
12684
12683
|
|
12685
12684
|
const globalRefs$9 = getThemeRefs(globals);
|
12686
|
-
const vars$
|
12685
|
+
const vars$d = UserAuthMethodClass.cssVarList;
|
12687
12686
|
|
12688
12687
|
const userAuthMethod = {
|
12689
|
-
[vars$
|
12690
|
-
[vars$
|
12691
|
-
[vars$
|
12692
|
-
[vars$
|
12693
|
-
[vars$
|
12688
|
+
[vars$d.hostDirection]: globalRefs$9.direction,
|
12689
|
+
[vars$d.labelTextWidth]: '200px',
|
12690
|
+
[vars$d.itemsGap]: '16px',
|
12691
|
+
[vars$d.hostMinWidth]: '530px',
|
12692
|
+
[vars$d.iconSize]: '24px',
|
12694
12693
|
_fullWidth: {
|
12695
|
-
[vars$
|
12694
|
+
[vars$d.hostWidth]: '100%',
|
12696
12695
|
},
|
12697
12696
|
};
|
12698
12697
|
|
12699
12698
|
var userAuthMethod$1 = /*#__PURE__*/Object.freeze({
|
12700
12699
|
__proto__: null,
|
12701
12700
|
default: userAuthMethod,
|
12702
|
-
vars: vars$
|
12701
|
+
vars: vars$d
|
12703
12702
|
});
|
12704
12703
|
|
12705
|
-
const componentName$
|
12704
|
+
const componentName$c = getComponentName('saml-group-mappings-internal');
|
12706
12705
|
|
12707
|
-
createBaseInputClass({ componentName: componentName$
|
12706
|
+
createBaseInputClass({ componentName: componentName$c, baseSelector: '' });
|
12708
12707
|
|
12709
|
-
const componentName$
|
12708
|
+
const componentName$b = getComponentName('saml-group-mappings');
|
12710
12709
|
|
12711
12710
|
const customMixin$3 = (superclass) =>
|
12712
12711
|
class SamlGroupMappingsMixinClass extends superclass {
|
@@ -12716,14 +12715,14 @@ const customMixin$3 = (superclass) =>
|
|
12716
12715
|
const template = document.createElement('template');
|
12717
12716
|
|
12718
12717
|
template.innerHTML = `
|
12719
|
-
<${componentName$
|
12718
|
+
<${componentName$c}
|
12720
12719
|
tabindex="-1"
|
12721
|
-
></${componentName$
|
12720
|
+
></${componentName$c}>
|
12722
12721
|
`;
|
12723
12722
|
|
12724
12723
|
this.baseElement.appendChild(template.content.cloneNode(true));
|
12725
12724
|
|
12726
|
-
this.inputElement = this.shadowRoot.querySelector(componentName$
|
12725
|
+
this.inputElement = this.shadowRoot.querySelector(componentName$c);
|
12727
12726
|
|
12728
12727
|
forwardAttrs(this, this.inputElement, {
|
12729
12728
|
includeAttrs: [
|
@@ -12800,61 +12799,61 @@ const SamlGroupMappingsClass = compose(
|
|
12800
12799
|
'options',
|
12801
12800
|
'error-message',
|
12802
12801
|
],
|
12803
|
-
componentName: componentName$
|
12802
|
+
componentName: componentName$b,
|
12804
12803
|
})
|
12805
12804
|
);
|
12806
12805
|
|
12807
|
-
const vars$
|
12806
|
+
const vars$c = SamlGroupMappingsClass.cssVarList;
|
12808
12807
|
|
12809
12808
|
const samlGroupMappings = {
|
12810
|
-
[vars$
|
12811
|
-
[vars$
|
12812
|
-
[vars$
|
12809
|
+
[vars$c.hostWidth]: refs.width,
|
12810
|
+
[vars$c.hostDirection]: refs.direction,
|
12811
|
+
[vars$c.groupNameInputMarginBottom]: '1em',
|
12813
12812
|
};
|
12814
12813
|
|
12815
12814
|
var samlGroupMappings$1 = /*#__PURE__*/Object.freeze({
|
12816
12815
|
__proto__: null,
|
12817
12816
|
default: samlGroupMappings,
|
12818
12817
|
samlGroupMappings: samlGroupMappings,
|
12819
|
-
vars: vars$
|
12818
|
+
vars: vars$c
|
12820
12819
|
});
|
12821
12820
|
|
12822
12821
|
const globalRefs$8 = getThemeRefs(globals);
|
12823
|
-
const vars$
|
12822
|
+
const vars$b = PolicyValidationClass.cssVarList;
|
12824
12823
|
|
12825
12824
|
const policyValidation = {
|
12826
|
-
[vars$
|
12827
|
-
[vars$
|
12828
|
-
[vars$
|
12829
|
-
[vars$
|
12830
|
-
[vars$
|
12831
|
-
[vars$
|
12832
|
-
[vars$
|
12833
|
-
[vars$
|
12834
|
-
[vars$
|
12835
|
-
[vars$
|
12836
|
-
[vars$
|
12837
|
-
[vars$
|
12838
|
-
[vars$
|
12839
|
-
[vars$
|
12840
|
-
[vars$
|
12841
|
-
[vars$
|
12825
|
+
[vars$b.fontFamily]: refs.fontFamily,
|
12826
|
+
[vars$b.fontSize]: refs.labelFontSize,
|
12827
|
+
[vars$b.textColor]: refs.labelTextColor,
|
12828
|
+
[vars$b.borderWidth]: refs.borderWidth,
|
12829
|
+
[vars$b.borderStyle]: refs.borderStyle,
|
12830
|
+
[vars$b.borderColor]: refs.borderColor,
|
12831
|
+
[vars$b.borderRadius]: globalRefs$8.radius.sm,
|
12832
|
+
[vars$b.backgroundColor]: 'none',
|
12833
|
+
[vars$b.padding]: '0px',
|
12834
|
+
[vars$b.labelMargin]: globalRefs$8.spacing.sm,
|
12835
|
+
[vars$b.itemsSpacing]: globalRefs$8.spacing.lg,
|
12836
|
+
[vars$b.itemSymbolDefault]: "'\\2022'", // "•"
|
12837
|
+
[vars$b.itemSymbolSuccess]: "'\\2713'", // "✓"
|
12838
|
+
[vars$b.itemSymbolError]: "'\\2A09'", // "⨉"
|
12839
|
+
[vars$b.itemSymbolSuccessColor]: globalRefs$8.colors.success.main,
|
12840
|
+
[vars$b.itemSymbolErrorColor]: globalRefs$8.colors.error.main,
|
12842
12841
|
};
|
12843
12842
|
|
12844
12843
|
var policyValidation$1 = /*#__PURE__*/Object.freeze({
|
12845
12844
|
__proto__: null,
|
12846
12845
|
default: policyValidation,
|
12847
|
-
vars: vars$
|
12846
|
+
vars: vars$b
|
12848
12847
|
});
|
12849
12848
|
|
12850
|
-
const vars$
|
12849
|
+
const vars$a = IconClass.cssVarList;
|
12851
12850
|
|
12852
12851
|
const icon = {};
|
12853
12852
|
|
12854
12853
|
var icon$1 = /*#__PURE__*/Object.freeze({
|
12855
12854
|
__proto__: null,
|
12856
12855
|
default: icon,
|
12857
|
-
vars: vars$
|
12856
|
+
vars: vars$a
|
12858
12857
|
});
|
12859
12858
|
|
12860
12859
|
const decode = (input) => {
|
@@ -12867,9 +12866,9 @@ const tpl = (input, inline) => {
|
|
12867
12866
|
return inline ? input : `<pre>${input}</pre>`;
|
12868
12867
|
};
|
12869
12868
|
|
12870
|
-
const componentName$
|
12869
|
+
const componentName$a = getComponentName('code-snippet');
|
12871
12870
|
|
12872
|
-
let CodeSnippet$1 = class CodeSnippet extends createBaseClass({ componentName: componentName$
|
12871
|
+
let CodeSnippet$1 = class CodeSnippet extends createBaseClass({ componentName: componentName$a, baseSelector: ':host > code' }) {
|
12873
12872
|
static get observedAttributes() {
|
12874
12873
|
return ['lang', 'inline'];
|
12875
12874
|
}
|
@@ -13101,7 +13100,7 @@ const CodeSnippetClass = compose(
|
|
13101
13100
|
|
13102
13101
|
const globalRefs$7 = getThemeRefs(globals);
|
13103
13102
|
|
13104
|
-
const vars$
|
13103
|
+
const vars$9 = CodeSnippetClass.cssVarList;
|
13105
13104
|
|
13106
13105
|
const light = {
|
13107
13106
|
color1: '#fa0',
|
@@ -13136,50 +13135,50 @@ const dark = {
|
|
13136
13135
|
};
|
13137
13136
|
|
13138
13137
|
const CodeSnippet = {
|
13139
|
-
[vars$
|
13140
|
-
[vars$
|
13141
|
-
[vars$
|
13142
|
-
[vars$
|
13143
|
-
[vars$
|
13144
|
-
[vars$
|
13145
|
-
[vars$
|
13146
|
-
[vars$
|
13147
|
-
[vars$
|
13148
|
-
[vars$
|
13149
|
-
[vars$
|
13150
|
-
[vars$
|
13151
|
-
[vars$
|
13152
|
-
[vars$
|
13153
|
-
[vars$
|
13154
|
-
[vars$
|
13155
|
-
[vars$
|
13156
|
-
[vars$
|
13157
|
-
[vars$
|
13158
|
-
[vars$
|
13159
|
-
[vars$
|
13160
|
-
[vars$
|
13161
|
-
[vars$
|
13162
|
-
[vars$
|
13163
|
-
[vars$
|
13164
|
-
[vars$
|
13165
|
-
[vars$
|
13166
|
-
[vars$
|
13167
|
-
[vars$
|
13168
|
-
[vars$
|
13169
|
-
[vars$
|
13170
|
-
[vars$
|
13171
|
-
[vars$
|
13172
|
-
[vars$
|
13173
|
-
[vars$
|
13174
|
-
[vars$
|
13175
|
-
[vars$
|
13176
|
-
[vars$
|
13177
|
-
[vars$
|
13178
|
-
[vars$
|
13179
|
-
[vars$
|
13180
|
-
[vars$
|
13181
|
-
[vars$
|
13182
|
-
[vars$
|
13138
|
+
[vars$9.rootBgColor]: globalRefs$7.colors.surface.main,
|
13139
|
+
[vars$9.rootTextColor]: globalRefs$7.colors.surface.contrast,
|
13140
|
+
[vars$9.docTagTextColor]: light.color2,
|
13141
|
+
[vars$9.keywordTextColor]: light.color2,
|
13142
|
+
[vars$9.metaKeywordTextColor]: light.color2,
|
13143
|
+
[vars$9.templateTagTextColor]: light.color2,
|
13144
|
+
[vars$9.templateVariableTextColor]: light.color2,
|
13145
|
+
[vars$9.typeTextColor]: light.color2,
|
13146
|
+
[vars$9.variableLanguageTextColor]: light.color2,
|
13147
|
+
[vars$9.titleTextColor]: light.color3,
|
13148
|
+
[vars$9.titleClassTextColor]: light.color3,
|
13149
|
+
[vars$9.titleClassInheritedTextColor]: light.color3,
|
13150
|
+
[vars$9.titleFunctionTextColor]: light.color3,
|
13151
|
+
[vars$9.attrTextColor]: light.color4,
|
13152
|
+
[vars$9.attributeTextColor]: light.color4,
|
13153
|
+
[vars$9.literalTextColor]: light.color4,
|
13154
|
+
[vars$9.metaTextColor]: light.color4,
|
13155
|
+
[vars$9.numberTextColor]: light.color4,
|
13156
|
+
[vars$9.operatorTextColor]: light.color4,
|
13157
|
+
[vars$9.variableTextColor]: light.color4,
|
13158
|
+
[vars$9.selectorAttrTextColor]: light.color4,
|
13159
|
+
[vars$9.selectorClassTextColor]: light.color4,
|
13160
|
+
[vars$9.selectorIdTextColor]: light.color4,
|
13161
|
+
[vars$9.regexpTextColor]: light.color13,
|
13162
|
+
[vars$9.stringTextColor]: light.color13,
|
13163
|
+
[vars$9.metaStringTextColor]: light.color13,
|
13164
|
+
[vars$9.builtInTextColor]: light.color5,
|
13165
|
+
[vars$9.symbolTextColor]: light.color5,
|
13166
|
+
[vars$9.commentTextColor]: light.color6,
|
13167
|
+
[vars$9.codeTextColor]: light.color6,
|
13168
|
+
[vars$9.formulaTextColor]: light.color6,
|
13169
|
+
[vars$9.nameTextColor]: light.color7,
|
13170
|
+
[vars$9.quoteTextColor]: light.color7,
|
13171
|
+
[vars$9.selectorTagTextColor]: light.color7,
|
13172
|
+
[vars$9.selectorPseudoTextColor]: light.color7,
|
13173
|
+
[vars$9.substTextColor]: light.color8,
|
13174
|
+
[vars$9.sectionTextColor]: light.color4,
|
13175
|
+
[vars$9.bulletTextColor]: light.color9,
|
13176
|
+
[vars$9.emphasisTextColor]: light.color8,
|
13177
|
+
[vars$9.strongTextColor]: light.color8,
|
13178
|
+
[vars$9.additionTextColor]: light.color7,
|
13179
|
+
[vars$9.additionBgColor]: light.color10,
|
13180
|
+
[vars$9.deletionTextColor]: light.color2,
|
13181
|
+
[vars$9.deletionBgColor]: light.color10,
|
13183
13182
|
/* purposely ignored */
|
13184
13183
|
// [vars.charEscapeTextColor]: '',
|
13185
13184
|
// [vars.linkTextColor]: '',
|
@@ -13191,50 +13190,50 @@ const CodeSnippet = {
|
|
13191
13190
|
|
13192
13191
|
const codeSnippetDarkThemeOverrides = {
|
13193
13192
|
codeSnippet: {
|
13194
|
-
[vars$
|
13195
|
-
[vars$
|
13196
|
-
[vars$
|
13197
|
-
[vars$
|
13198
|
-
[vars$
|
13199
|
-
[vars$
|
13200
|
-
[vars$
|
13201
|
-
[vars$
|
13202
|
-
[vars$
|
13203
|
-
[vars$
|
13204
|
-
[vars$
|
13205
|
-
[vars$
|
13206
|
-
[vars$
|
13207
|
-
[vars$
|
13208
|
-
[vars$
|
13209
|
-
[vars$
|
13210
|
-
[vars$
|
13211
|
-
[vars$
|
13212
|
-
[vars$
|
13213
|
-
[vars$
|
13214
|
-
[vars$
|
13215
|
-
[vars$
|
13216
|
-
[vars$
|
13217
|
-
[vars$
|
13218
|
-
[vars$
|
13219
|
-
[vars$
|
13220
|
-
[vars$
|
13221
|
-
[vars$
|
13222
|
-
[vars$
|
13223
|
-
[vars$
|
13224
|
-
[vars$
|
13225
|
-
[vars$
|
13226
|
-
[vars$
|
13227
|
-
[vars$
|
13228
|
-
[vars$
|
13229
|
-
[vars$
|
13230
|
-
[vars$
|
13231
|
-
[vars$
|
13232
|
-
[vars$
|
13233
|
-
[vars$
|
13234
|
-
[vars$
|
13235
|
-
[vars$
|
13236
|
-
[vars$
|
13237
|
-
[vars$
|
13193
|
+
[vars$9.rootBgColor]: globalRefs$7.colors.surface.main,
|
13194
|
+
[vars$9.rootTextColor]: globalRefs$7.colors.surface.contrast,
|
13195
|
+
[vars$9.docTagTextColor]: dark.color2,
|
13196
|
+
[vars$9.keywordTextColor]: dark.color2,
|
13197
|
+
[vars$9.metaKeywordTextColor]: dark.color2,
|
13198
|
+
[vars$9.templateTagTextColor]: dark.color2,
|
13199
|
+
[vars$9.templateVariableTextColor]: dark.color2,
|
13200
|
+
[vars$9.typeTextColor]: dark.color2,
|
13201
|
+
[vars$9.variableLanguageTextColor]: dark.color2,
|
13202
|
+
[vars$9.titleTextColor]: dark.color3,
|
13203
|
+
[vars$9.titleClassTextColor]: dark.color3,
|
13204
|
+
[vars$9.titleClassInheritedTextColor]: dark.color3,
|
13205
|
+
[vars$9.titleFunctionTextColor]: dark.color3,
|
13206
|
+
[vars$9.attrTextColor]: dark.color4,
|
13207
|
+
[vars$9.attributeTextColor]: dark.color4,
|
13208
|
+
[vars$9.literalTextColor]: dark.color4,
|
13209
|
+
[vars$9.metaTextColor]: dark.color4,
|
13210
|
+
[vars$9.numberTextColor]: dark.color4,
|
13211
|
+
[vars$9.operatorTextColor]: dark.color4,
|
13212
|
+
[vars$9.variableTextColor]: dark.color4,
|
13213
|
+
[vars$9.selectorAttrTextColor]: dark.color4,
|
13214
|
+
[vars$9.selectorClassTextColor]: dark.color4,
|
13215
|
+
[vars$9.selectorIdTextColor]: dark.color4,
|
13216
|
+
[vars$9.regexpTextColor]: dark.color13,
|
13217
|
+
[vars$9.stringTextColor]: dark.color13,
|
13218
|
+
[vars$9.metaStringTextColor]: dark.color13,
|
13219
|
+
[vars$9.builtInTextColor]: dark.color5,
|
13220
|
+
[vars$9.symbolTextColor]: dark.color5,
|
13221
|
+
[vars$9.commentTextColor]: dark.color6,
|
13222
|
+
[vars$9.codeTextColor]: dark.color6,
|
13223
|
+
[vars$9.formulaTextColor]: dark.color6,
|
13224
|
+
[vars$9.nameTextColor]: dark.color7,
|
13225
|
+
[vars$9.quoteTextColor]: dark.color7,
|
13226
|
+
[vars$9.selectorTagTextColor]: dark.color7,
|
13227
|
+
[vars$9.selectorPseudoTextColor]: dark.color7,
|
13228
|
+
[vars$9.substTextColor]: dark.color8,
|
13229
|
+
[vars$9.sectionTextColor]: dark.color4,
|
13230
|
+
[vars$9.bulletTextColor]: dark.color9,
|
13231
|
+
[vars$9.emphasisTextColor]: dark.color8,
|
13232
|
+
[vars$9.strongTextColor]: dark.color8,
|
13233
|
+
[vars$9.additionTextColor]: dark.color7,
|
13234
|
+
[vars$9.additionBgColor]: dark.color10,
|
13235
|
+
[vars$9.deletionTextColor]: dark.color2,
|
13236
|
+
[vars$9.deletionBgColor]: dark.color10,
|
13238
13237
|
},
|
13239
13238
|
};
|
13240
13239
|
|
@@ -13242,10 +13241,10 @@ var codeSnippet = /*#__PURE__*/Object.freeze({
|
|
13242
13241
|
__proto__: null,
|
13243
13242
|
codeSnippetDarkThemeOverrides: codeSnippetDarkThemeOverrides,
|
13244
13243
|
default: CodeSnippet,
|
13245
|
-
vars: vars$
|
13244
|
+
vars: vars$9
|
13246
13245
|
});
|
13247
13246
|
|
13248
|
-
const componentName$
|
13247
|
+
const componentName$9 = getComponentName('radio-button');
|
13249
13248
|
|
13250
13249
|
const customMixin$2 = (superclass) =>
|
13251
13250
|
class CustomMixin extends superclass {
|
@@ -13310,11 +13309,11 @@ const RadioButtonClass = compose(
|
|
13310
13309
|
wrappedEleName: 'vaadin-radio-button',
|
13311
13310
|
excludeAttrsSync: ['tabindex', 'data'],
|
13312
13311
|
includeForwardProps: ['checked', 'name', 'disabled'],
|
13313
|
-
componentName: componentName$
|
13312
|
+
componentName: componentName$9,
|
13314
13313
|
})
|
13315
13314
|
);
|
13316
13315
|
|
13317
|
-
const componentName$
|
13316
|
+
const componentName$8 = getComponentName('radio-group');
|
13318
13317
|
|
13319
13318
|
const RadioGroupMixin = (superclass) =>
|
13320
13319
|
class RadioGroupMixinClass extends superclass {
|
@@ -13329,12 +13328,12 @@ const RadioGroupMixin = (superclass) =>
|
|
13329
13328
|
|
13330
13329
|
// we are overriding vaadin children getter so it will run on our custom elements
|
13331
13330
|
Object.defineProperty(this.baseElement, 'children', {
|
13332
|
-
get: () => this.querySelectorAll(componentName$
|
13331
|
+
get: () => this.querySelectorAll(componentName$9),
|
13333
13332
|
});
|
13334
13333
|
|
13335
13334
|
// we are overriding vaadin __filterRadioButtons so it will run on our custom elements
|
13336
13335
|
this.baseElement.__filterRadioButtons = (nodes) => {
|
13337
|
-
return nodes.filter((node) => node.localName === componentName$
|
13336
|
+
return nodes.filter((node) => node.localName === componentName$9);
|
13338
13337
|
};
|
13339
13338
|
|
13340
13339
|
// vaadin radio group missing some input properties
|
@@ -13484,38 +13483,38 @@ const RadioGroupClass = compose(
|
|
13484
13483
|
`,
|
13485
13484
|
|
13486
13485
|
excludeAttrsSync: ['tabindex', 'size', 'data', 'direction'],
|
13487
|
-
componentName: componentName$
|
13486
|
+
componentName: componentName$8,
|
13488
13487
|
includeForwardProps: ['value'],
|
13489
13488
|
})
|
13490
13489
|
);
|
13491
13490
|
|
13492
|
-
const vars$
|
13491
|
+
const vars$8 = RadioGroupClass.cssVarList;
|
13493
13492
|
const globalRefs$6 = getThemeRefs(globals);
|
13494
13493
|
|
13495
13494
|
const radioGroup = {
|
13496
|
-
[vars$
|
13497
|
-
[vars$
|
13498
|
-
[vars$
|
13499
|
-
[vars$
|
13500
|
-
[vars$
|
13501
|
-
[vars$
|
13502
|
-
[vars$
|
13503
|
-
[vars$
|
13504
|
-
[vars$
|
13505
|
-
[vars$
|
13495
|
+
[vars$8.buttonsRowGap]: '9px',
|
13496
|
+
[vars$8.hostWidth]: refs.width,
|
13497
|
+
[vars$8.hostDirection]: refs.direction,
|
13498
|
+
[vars$8.fontSize]: refs.fontSize,
|
13499
|
+
[vars$8.fontFamily]: refs.fontFamily,
|
13500
|
+
[vars$8.labelTextColor]: refs.labelTextColor,
|
13501
|
+
[vars$8.labelRequiredIndicator]: refs.requiredIndicator,
|
13502
|
+
[vars$8.errorMessageTextColor]: refs.errorMessageTextColor,
|
13503
|
+
[vars$8.helperTextColor]: refs.helperTextColor,
|
13504
|
+
[vars$8.itemsLabelColor]: globalRefs$6.colors.surface.contrast,
|
13506
13505
|
|
13507
13506
|
textAlign: {
|
13508
|
-
right: { [vars$
|
13509
|
-
left: { [vars$
|
13510
|
-
center: { [vars$
|
13507
|
+
right: { [vars$8.inputTextAlign]: 'right' },
|
13508
|
+
left: { [vars$8.inputTextAlign]: 'left' },
|
13509
|
+
center: { [vars$8.inputTextAlign]: 'center' },
|
13511
13510
|
},
|
13512
13511
|
|
13513
13512
|
_fullWidth: {
|
13514
|
-
[vars$
|
13513
|
+
[vars$8.buttonsSpacing]: 'space-between',
|
13515
13514
|
},
|
13516
13515
|
|
13517
13516
|
_disabled: {
|
13518
|
-
[vars$
|
13517
|
+
[vars$8.itemsLabelColor]: globalRefs$6.colors.surface.light,
|
13519
13518
|
},
|
13520
13519
|
};
|
13521
13520
|
|
@@ -13523,24 +13522,24 @@ var radioGroup$1 = /*#__PURE__*/Object.freeze({
|
|
13523
13522
|
__proto__: null,
|
13524
13523
|
default: radioGroup,
|
13525
13524
|
radioGroup: radioGroup,
|
13526
|
-
vars: vars$
|
13525
|
+
vars: vars$8
|
13527
13526
|
});
|
13528
13527
|
|
13529
|
-
const vars$
|
13528
|
+
const vars$7 = RadioButtonClass.cssVarList;
|
13530
13529
|
const globalRefs$5 = getThemeRefs(globals);
|
13531
13530
|
|
13532
13531
|
const radioButton = {
|
13533
|
-
[vars$
|
13534
|
-
[vars$
|
13535
|
-
[vars$
|
13536
|
-
[vars$
|
13537
|
-
[vars$
|
13538
|
-
[vars$
|
13539
|
-
[vars$
|
13540
|
-
[vars$
|
13532
|
+
[vars$7.fontFamily]: refs.fontFamily,
|
13533
|
+
[vars$7.radioSize]: 'calc(1em + 6px)',
|
13534
|
+
[vars$7.radioMargin]: 'auto 4px',
|
13535
|
+
[vars$7.radioCheckedSize]: `calc(var(${vars$7.radioSize})/5)`,
|
13536
|
+
[vars$7.radioCheckedColor]: globalRefs$5.colors.surface.light,
|
13537
|
+
[vars$7.radioBackgroundColor]: globalRefs$5.colors.surface.light,
|
13538
|
+
[vars$7.radioBorderColor]: 'none',
|
13539
|
+
[vars$7.radioBorderWidth]: 0,
|
13541
13540
|
|
13542
13541
|
_checked: {
|
13543
|
-
[vars$
|
13542
|
+
[vars$7.radioBackgroundColor]: globalRefs$5.colors.surface.contrast,
|
13544
13543
|
},
|
13545
13544
|
|
13546
13545
|
_hover: {
|
@@ -13549,16 +13548,16 @@ const radioButton = {
|
|
13549
13548
|
|
13550
13549
|
size: {
|
13551
13550
|
xs: {
|
13552
|
-
[vars$
|
13551
|
+
[vars$7.fontSize]: '12px',
|
13553
13552
|
},
|
13554
13553
|
sm: {
|
13555
|
-
[vars$
|
13554
|
+
[vars$7.fontSize]: '14px',
|
13556
13555
|
},
|
13557
13556
|
md: {
|
13558
|
-
[vars$
|
13557
|
+
[vars$7.fontSize]: '16px',
|
13559
13558
|
},
|
13560
13559
|
lg: {
|
13561
|
-
[vars$
|
13560
|
+
[vars$7.fontSize]: '18px',
|
13562
13561
|
},
|
13563
13562
|
},
|
13564
13563
|
};
|
@@ -13567,7 +13566,7 @@ var radioButton$1 = /*#__PURE__*/Object.freeze({
|
|
13567
13566
|
__proto__: null,
|
13568
13567
|
default: radioButton,
|
13569
13568
|
radioButton: radioButton,
|
13570
|
-
vars: vars$
|
13569
|
+
vars: vars$7
|
13571
13570
|
});
|
13572
13571
|
|
13573
13572
|
const SUPPORTED_FORMATS = ['MM/DD/YYYY', 'DD/MM/YYYY', 'YYYY/MM/DD'];
|
@@ -13885,7 +13884,7 @@ const nextMonth = (timestamp) => {
|
|
13885
13884
|
return date;
|
13886
13885
|
};
|
13887
13886
|
|
13888
|
-
const componentName$
|
13887
|
+
const componentName$7 = getComponentName('calendar');
|
13889
13888
|
|
13890
13889
|
const observedAttrs$1 = [
|
13891
13890
|
'initial-value',
|
@@ -13902,7 +13901,7 @@ const observedAttrs$1 = [
|
|
13902
13901
|
|
13903
13902
|
const calendarUiAttrs = ['calendar-label-submit', 'calendar-label-cancel'];
|
13904
13903
|
|
13905
|
-
const BaseInputClass$1 = createBaseInputClass({ componentName: componentName$
|
13904
|
+
const BaseInputClass$1 = createBaseInputClass({ componentName: componentName$7, baseSelector: 'div' });
|
13906
13905
|
|
13907
13906
|
class RawCalendar extends BaseInputClass$1 {
|
13908
13907
|
static get observedAttributes() {
|
@@ -14517,92 +14516,92 @@ const CalendarClass = compose(
|
|
14517
14516
|
|
14518
14517
|
const globalRefs$4 = getThemeRefs(globals);
|
14519
14518
|
|
14520
|
-
const vars$
|
14519
|
+
const vars$6 = CalendarClass.cssVarList;
|
14521
14520
|
|
14522
14521
|
const calendar = {
|
14523
|
-
[vars$
|
14524
|
-
[vars$
|
14525
|
-
[vars$
|
14522
|
+
[vars$6.fontFamily]: refs.fontFamily,
|
14523
|
+
[vars$6.fontSize]: refs.fontSize,
|
14524
|
+
[vars$6.hostDirection]: refs.direction,
|
14526
14525
|
|
14527
|
-
[vars$
|
14526
|
+
[vars$6.calendarPadding]: '1em',
|
14528
14527
|
|
14529
|
-
[vars$
|
14530
|
-
[vars$
|
14531
|
-
[vars$
|
14532
|
-
[vars$
|
14528
|
+
[vars$6.topNavVerticalPadding]: '1em',
|
14529
|
+
[vars$6.topNavAlignment]: 'space-between',
|
14530
|
+
[vars$6.topNavGap]: '0',
|
14531
|
+
[vars$6.topNavSelectorsGap]: '0.5em',
|
14533
14532
|
|
14534
|
-
[vars$
|
14535
|
-
[vars$
|
14536
|
-
[vars$
|
14537
|
-
[vars$
|
14533
|
+
[vars$6.bottomNavVerticalPadding]: '0.75em',
|
14534
|
+
[vars$6.bottomNavHorizontalPadding]: '1.5em',
|
14535
|
+
[vars$6.bottomNavAlignment]: 'space-between',
|
14536
|
+
[vars$6.bottomNavGap]: '0.5em',
|
14538
14537
|
|
14539
|
-
[vars$
|
14540
|
-
[vars$
|
14541
|
-
[vars$
|
14542
|
-
[vars$
|
14538
|
+
[vars$6.navMarginBottom]: '0.75em',
|
14539
|
+
[vars$6.navBorderBottomWidth]: '1px',
|
14540
|
+
[vars$6.navBorderBottomColor]: globalRefs$4.colors.surface.highlight,
|
14541
|
+
[vars$6.navBorderBottomStyle]: 'solid',
|
14543
14542
|
|
14544
|
-
[vars$
|
14545
|
-
[vars$
|
14543
|
+
[vars$6.yearInputWidth]: '6em',
|
14544
|
+
[vars$6.monthInputWidth]: '8em',
|
14546
14545
|
|
14547
|
-
[vars$
|
14548
|
-
[vars$
|
14546
|
+
[vars$6.navButtonSize]: '24px',
|
14547
|
+
[vars$6.navButtonCursor]: 'pointer',
|
14549
14548
|
|
14550
|
-
[vars$
|
14551
|
-
[vars$
|
14549
|
+
[vars$6.weekdayFontSize]: '0.875em',
|
14550
|
+
[vars$6.weekdayFontWeight]: '500',
|
14552
14551
|
|
14553
14552
|
// day table cell
|
14554
|
-
[vars$
|
14553
|
+
[vars$6.dayHeight]: '3.125em',
|
14555
14554
|
|
14556
14555
|
// day value
|
14557
|
-
[vars$
|
14558
|
-
[vars$
|
14559
|
-
[vars$
|
14560
|
-
[vars$
|
14561
|
-
[vars$
|
14562
|
-
[vars$
|
14563
|
-
[vars$
|
14564
|
-
[vars$
|
14565
|
-
[vars$
|
14566
|
-
[vars$
|
14556
|
+
[vars$6.daySize]: '2.125em',
|
14557
|
+
[vars$6.dayFontSize]: '1em',
|
14558
|
+
[vars$6.dayRadius]: '50%',
|
14559
|
+
[vars$6.dayTextAlign]: 'center',
|
14560
|
+
[vars$6.dayPadding]: '0',
|
14561
|
+
[vars$6.dayTextColor]: globalRefs$4.colors.surface.contrast,
|
14562
|
+
[vars$6.dayFontWeight]: '500',
|
14563
|
+
[vars$6.dayBackgroundColor]: 'transparent',
|
14564
|
+
[vars$6.dayCursor]: 'pointer',
|
14565
|
+
[vars$6.dayBackgroundColorHover]: globalRefs$4.colors.primary.highlight,
|
14567
14566
|
|
14568
14567
|
// selected day
|
14569
|
-
[vars$
|
14570
|
-
[vars$
|
14568
|
+
[vars$6.daySelectedBackgroundColor]: globalRefs$4.colors.primary.main,
|
14569
|
+
[vars$6.daySelectedTextdColor]: globalRefs$4.colors.primary.contrast,
|
14571
14570
|
|
14572
14571
|
// disabled day (out of min/max range)
|
14573
|
-
[vars$
|
14572
|
+
[vars$6.dayDisabledTextdColor]: globalRefs$4.colors.surface.light,
|
14574
14573
|
|
14575
14574
|
// today
|
14576
|
-
[vars$
|
14577
|
-
[vars$
|
14578
|
-
[vars$
|
14575
|
+
[vars$6.currentDayBorderColor]: globalRefs$4.colors.surface.light,
|
14576
|
+
[vars$6.currentDayBorderWidth]: '1px',
|
14577
|
+
[vars$6.currentDayBorderStyle]: 'solid',
|
14579
14578
|
|
14580
14579
|
size: {
|
14581
|
-
xs: { [vars$
|
14582
|
-
sm: { [vars$
|
14583
|
-
md: { [vars$
|
14584
|
-
lg: { [vars$
|
14580
|
+
xs: { [vars$6.fontSize]: '12px' },
|
14581
|
+
sm: { [vars$6.fontSize]: '14px' },
|
14582
|
+
md: { [vars$6.fontSize]: '16px' },
|
14583
|
+
lg: { [vars$6.fontSize]: '18px' },
|
14585
14584
|
},
|
14586
14585
|
|
14587
|
-
[vars$
|
14586
|
+
[vars$6.navButtonRotation]: 'rotate(180deg)',
|
14588
14587
|
|
14589
14588
|
_disabled: {
|
14590
|
-
[vars$
|
14591
|
-
[vars$
|
14592
|
-
[vars$
|
14593
|
-
[vars$
|
14589
|
+
[vars$6.navButtonOpacity]: '0.5',
|
14590
|
+
[vars$6.dayBackgroundColorHover]: 'none',
|
14591
|
+
[vars$6.navButtonCursor]: 'default',
|
14592
|
+
[vars$6.dayCursor]: 'default',
|
14594
14593
|
},
|
14595
14594
|
|
14596
14595
|
_fullWidth: {
|
14597
|
-
[vars$
|
14598
|
-
[vars$
|
14596
|
+
[vars$6.hostWidth]: '100%',
|
14597
|
+
[vars$6.dayBlockAlign]: '0 auto',
|
14599
14598
|
},
|
14600
14599
|
};
|
14601
14600
|
|
14602
14601
|
var calendar$1 = /*#__PURE__*/Object.freeze({
|
14603
14602
|
__proto__: null,
|
14604
14603
|
default: calendar,
|
14605
|
-
vars: vars$
|
14604
|
+
vars: vars$6
|
14606
14605
|
});
|
14607
14606
|
|
14608
14607
|
const patterns = {
|
@@ -14736,12 +14735,12 @@ class DateCounter {
|
|
14736
14735
|
}
|
14737
14736
|
}
|
14738
14737
|
|
14739
|
-
const componentName$
|
14738
|
+
const componentName$6 = getComponentName('date-field');
|
14740
14739
|
|
14741
14740
|
// we set baseSelector to `vaadin-popover` as a temporary hack, so our portalMixin will
|
14742
14741
|
// be able to process this component's overlay. The whole process needs refactoring as soon as possible.
|
14743
14742
|
const BASE_SELECTOR = 'vaadin-popover';
|
14744
|
-
const BaseInputClass = createBaseInputClass({ componentName: componentName$
|
14743
|
+
const BaseInputClass = createBaseInputClass({ componentName: componentName$6, baseSelector: BASE_SELECTOR });
|
14745
14744
|
|
14746
14745
|
const dateFieldAttrs = ['format', 'opened', 'initial-value', 'readonly'];
|
14747
14746
|
const calendarAttrs = ['years-range', 'calendar-months', 'calendar-weekdays'];
|
@@ -15352,9 +15351,11 @@ class RawDateFieldClass extends BaseInputClass {
|
|
15352
15351
|
}
|
15353
15352
|
}
|
15354
15353
|
|
15355
|
-
const
|
15354
|
+
const textVars = TextFieldClass.cssVarList;
|
15355
|
+
const { host, input, inputEleRTL, toggleButton, overlay, backdrop } = {
|
15356
15356
|
host: { selector: () => ':host' },
|
15357
15357
|
input: { selector: () => 'descope-text-field' },
|
15358
|
+
inputEleRTL: { selector: () => ':host([st-host-direction="rtl"]) descope-text-field' },
|
15358
15359
|
toggleButton: { selector: () => '.toggle-calendar' },
|
15359
15360
|
overlay: { selector: 'vaadin-popover-overlay::part(overlay)' },
|
15360
15361
|
backdrop: { selector: 'vaadin-popover-overlay::part(backdrop)' },
|
@@ -15368,6 +15369,8 @@ const DateFieldClass = compose(
|
|
15368
15369
|
hostWidth: { ...host, property: 'width' },
|
15369
15370
|
hostDirection: { ...host, property: 'direction' },
|
15370
15371
|
textAlign: { ...input, property: 'text-align' },
|
15372
|
+
rtlInputDirection: { ...inputEleRTL, property: textVars.inputDirection },
|
15373
|
+
rtlInputAlignment: { ...inputEleRTL, property: textVars.inputTextAlign },
|
15371
15374
|
overlayGap: {
|
15372
15375
|
property: () => DateFieldClass.cssVarList.overlayGap,
|
15373
15376
|
},
|
@@ -15409,32 +15412,34 @@ const DateFieldClass = compose(
|
|
15409
15412
|
)(RawDateFieldClass);
|
15410
15413
|
|
15411
15414
|
const globalRefs$3 = getThemeRefs(globals);
|
15412
|
-
|
15413
15415
|
const shadowColor$1 = '#00000020';
|
15414
15416
|
const { shadow } = globalRefs$3;
|
15415
15417
|
|
15416
|
-
const vars$
|
15418
|
+
const vars$5 = DateFieldClass.cssVarList;
|
15417
15419
|
|
15418
15420
|
const dateField = {
|
15419
|
-
[vars$
|
15420
|
-
[vars$
|
15421
|
-
[vars$
|
15422
|
-
|
15423
|
-
[vars$
|
15424
|
-
[vars$
|
15425
|
-
[vars$
|
15426
|
-
[vars$
|
15427
|
-
[vars$
|
15428
|
-
[vars$
|
15429
|
-
[vars$
|
15430
|
-
[vars$
|
15431
|
-
[vars$
|
15421
|
+
[vars$5.hostWidth]: refs.width,
|
15422
|
+
[vars$5.hostDirection]: refs.direction,
|
15423
|
+
[vars$5.iconMargin]: '0.375em',
|
15424
|
+
|
15425
|
+
[vars$5.overlay.marginTop]: `calc(${refs.outlineWidth} + 1px)`,
|
15426
|
+
[vars$5.overlay.backgroundColor]: refs.backgroundColor,
|
15427
|
+
[vars$5.overlay.backdropBackgroundColor]: 'transparent',
|
15428
|
+
[vars$5.overlay.backdropPointerEvents]: 'all',
|
15429
|
+
[vars$5.overlay.boxShadow]: `${shadow.wide.xl} ${shadowColor$1}, ${shadow.narrow.xl} ${shadowColor$1}`,
|
15430
|
+
[vars$5.overlay.outlineWidth]: '0',
|
15431
|
+
[vars$5.overlay.outlineColor]: 'transparent',
|
15432
|
+
[vars$5.overlay.outlineStyle]: 'none',
|
15433
|
+
[vars$5.overlay.padding]: '0',
|
15434
|
+
|
15435
|
+
[vars$5.rtlInputDirection]: 'ltr',
|
15436
|
+
[vars$5.rtlInputAlignment]: 'right',
|
15432
15437
|
};
|
15433
15438
|
|
15434
15439
|
var dateField$1 = /*#__PURE__*/Object.freeze({
|
15435
15440
|
__proto__: null,
|
15436
15441
|
default: dateField,
|
15437
|
-
vars: vars$
|
15442
|
+
vars: vars$5
|
15438
15443
|
});
|
15439
15444
|
|
15440
15445
|
const activeableMixin = (superclass) =>
|
@@ -15452,7 +15457,7 @@ const activeableMixin = (superclass) =>
|
|
15452
15457
|
}
|
15453
15458
|
};
|
15454
15459
|
|
15455
|
-
const componentName$
|
15460
|
+
const componentName$5 = getComponentName('list-item');
|
15456
15461
|
|
15457
15462
|
const customMixin$1 = (superclass) =>
|
15458
15463
|
class ListItemMixinClass extends superclass {
|
@@ -15501,11 +15506,11 @@ const ListItemClass = compose(
|
|
15501
15506
|
componentNameValidationMixin,
|
15502
15507
|
customMixin$1,
|
15503
15508
|
activeableMixin
|
15504
|
-
)(createBaseClass({ componentName: componentName$
|
15509
|
+
)(createBaseClass({ componentName: componentName$5, baseSelector: 'slot' }));
|
15505
15510
|
|
15506
|
-
const componentName$
|
15511
|
+
const componentName$4 = getComponentName('list');
|
15507
15512
|
|
15508
|
-
class RawList extends createBaseClass({ componentName: componentName$
|
15513
|
+
class RawList extends createBaseClass({ componentName: componentName$4, baseSelector: '.wrapper' }) {
|
15509
15514
|
static get observedAttributes() {
|
15510
15515
|
return ['variant', 'readonly'];
|
15511
15516
|
}
|
@@ -15658,7 +15663,7 @@ const compVars = ListClass.cssVarList;
|
|
15658
15663
|
|
15659
15664
|
const [helperTheme, helperRefs, helperVars] = createHelperVars(
|
15660
15665
|
{ shadowColor: '#00000020' },
|
15661
|
-
componentName$
|
15666
|
+
componentName$4
|
15662
15667
|
);
|
15663
15668
|
|
15664
15669
|
const { shadowColor } = helperRefs;
|
@@ -15698,7 +15703,7 @@ const list$1 = {
|
|
15698
15703
|
},
|
15699
15704
|
};
|
15700
15705
|
|
15701
|
-
const vars$
|
15706
|
+
const vars$4 = {
|
15702
15707
|
...compVars,
|
15703
15708
|
...helperVars,
|
15704
15709
|
};
|
@@ -15706,49 +15711,49 @@ const vars$3 = {
|
|
15706
15711
|
var list$2 = /*#__PURE__*/Object.freeze({
|
15707
15712
|
__proto__: null,
|
15708
15713
|
default: list$1,
|
15709
|
-
vars: vars$
|
15714
|
+
vars: vars$4
|
15710
15715
|
});
|
15711
15716
|
|
15712
15717
|
const globalRefs$1 = getThemeRefs(globals);
|
15713
15718
|
|
15714
|
-
const vars$
|
15719
|
+
const vars$3 = ListItemClass.cssVarList;
|
15715
15720
|
|
15716
15721
|
const list = {
|
15717
|
-
[vars$
|
15718
|
-
[vars$
|
15719
|
-
[vars$
|
15720
|
-
[vars$
|
15721
|
-
[vars$
|
15722
|
-
[vars$
|
15723
|
-
[vars$
|
15724
|
-
[vars$
|
15725
|
-
[vars$
|
15726
|
-
[vars$
|
15727
|
-
[vars$
|
15722
|
+
[vars$3.backgroundColor]: globalRefs$1.colors.surface.main,
|
15723
|
+
[vars$3.padding]: globalRefs$1.spacing.lg,
|
15724
|
+
[vars$3.gap]: globalRefs$1.spacing.md,
|
15725
|
+
[vars$3.borderStyle]: 'solid',
|
15726
|
+
[vars$3.borderWidth]: globalRefs$1.border.xs,
|
15727
|
+
[vars$3.borderColor]: globalRefs$1.colors.surface.main,
|
15728
|
+
[vars$3.borderRadius]: globalRefs$1.radius.sm,
|
15729
|
+
[vars$3.cursor]: 'pointer',
|
15730
|
+
[vars$3.alignItems]: 'center',
|
15731
|
+
[vars$3.flexDirection]: 'row',
|
15732
|
+
[vars$3.transition]: 'border-color 0.2s, background-color 0.2s',
|
15728
15733
|
|
15729
15734
|
variant: {
|
15730
15735
|
tile: {
|
15731
|
-
[vars$
|
15732
|
-
[vars$
|
15733
|
-
[vars$
|
15736
|
+
[vars$3.alignItems]: 'flex-start',
|
15737
|
+
[vars$3.flexDirection]: 'column',
|
15738
|
+
[vars$3.borderColor]: globalRefs$1.colors.surface.light,
|
15734
15739
|
},
|
15735
15740
|
},
|
15736
15741
|
|
15737
15742
|
_hover: {
|
15738
|
-
[vars$
|
15743
|
+
[vars$3.backgroundColor]: globalRefs$1.colors.surface.highlight,
|
15739
15744
|
},
|
15740
15745
|
|
15741
15746
|
_active: {
|
15742
|
-
[vars$
|
15743
|
-
[vars$
|
15744
|
-
[vars$
|
15747
|
+
[vars$3.backgroundColor]: globalRefs$1.colors.surface.main,
|
15748
|
+
[vars$3.borderColor]: globalRefs$1.colors.primary.light,
|
15749
|
+
[vars$3.outline]: `1px solid ${globalRefs$1.colors.primary.light}`,
|
15745
15750
|
},
|
15746
15751
|
};
|
15747
15752
|
|
15748
15753
|
var listItem = /*#__PURE__*/Object.freeze({
|
15749
15754
|
__proto__: null,
|
15750
15755
|
default: list,
|
15751
|
-
vars: vars$
|
15756
|
+
vars: vars$3
|
15752
15757
|
});
|
15753
15758
|
|
15754
15759
|
const defaultValidateSchema = () => true;
|
@@ -15826,18 +15831,14 @@ const createDynamicDataMixin =
|
|
15826
15831
|
init() {
|
15827
15832
|
super.init?.();
|
15828
15833
|
|
15829
|
-
|
15830
|
-
|
15831
|
-
|
15832
|
-
(attrs)
|
15833
|
-
|
15834
|
-
|
15835
|
-
|
15836
|
-
|
15837
|
-
);
|
15838
|
-
} else {
|
15839
|
-
this.#renderItems();
|
15840
|
-
}
|
15834
|
+
observeAttributes(
|
15835
|
+
this,
|
15836
|
+
(attrs) => {
|
15837
|
+
if (attrs.includes('data')) this.#handleDataAttr();
|
15838
|
+
else this.#renderItems();
|
15839
|
+
},
|
15840
|
+
{ includeAttrs: [...rerenderAttrsList, 'data'] }
|
15841
|
+
);
|
15841
15842
|
}
|
15842
15843
|
|
15843
15844
|
#handleDataAttr() {
|
@@ -15846,30 +15847,15 @@ const createDynamicDataMixin =
|
|
15846
15847
|
if (!dataAttr) return;
|
15847
15848
|
|
15848
15849
|
try {
|
15849
|
-
this
|
15850
|
+
this.data = JSON.parse(dataAttr);
|
15850
15851
|
} catch (e) {
|
15851
15852
|
// eslint-disable-next-line no-console
|
15852
15853
|
console.warn('Invalid JSON data', dataAttr);
|
15853
15854
|
}
|
15854
15855
|
}
|
15855
|
-
|
15856
|
-
attributeChangedCallback(name, oldValue, newValue) {
|
15857
|
-
super.attributeChangedCallback?.(name, oldValue, newValue);
|
15858
|
-
|
15859
|
-
if (newValue === oldValue) return;
|
15860
|
-
|
15861
|
-
if (name === 'data') {
|
15862
|
-
try {
|
15863
|
-
this.data = JSON.parse(newValue);
|
15864
|
-
} catch (e) {
|
15865
|
-
// eslint-disable-next-line no-console
|
15866
|
-
console.warn('Invalid JSON data', newValue);
|
15867
|
-
}
|
15868
|
-
}
|
15869
|
-
}
|
15870
15856
|
};
|
15871
15857
|
|
15872
|
-
const componentName$
|
15858
|
+
const componentName$3 = getComponentName('apps-list');
|
15873
15859
|
|
15874
15860
|
const limitAbbreviation = (str, limit = 2) =>
|
15875
15861
|
str
|
@@ -15879,7 +15865,7 @@ const limitAbbreviation = (str, limit = 2) =>
|
|
15879
15865
|
.map((s) => s[0]?.toUpperCase())
|
15880
15866
|
.join('');
|
15881
15867
|
|
15882
|
-
const itemRenderer = ({ name, icon, url }, _, ref) => `
|
15868
|
+
const itemRenderer$1 = ({ name, icon, url }, _, ref) => `
|
15883
15869
|
<a ${url ? `href="${url}" title="${url}"` : ''} target="_blank">
|
15884
15870
|
<descope-list-item>
|
15885
15871
|
<descope-avatar
|
@@ -15922,7 +15908,7 @@ const AppsListClass = compose(
|
|
15922
15908
|
},
|
15923
15909
|
},
|
15924
15910
|
}),
|
15925
|
-
createDynamicDataMixin({ itemRenderer, rerenderAttrsList: ['size'] }),
|
15911
|
+
createDynamicDataMixin({ itemRenderer: itemRenderer$1, rerenderAttrsList: ['size'] }),
|
15926
15912
|
draggableMixin,
|
15927
15913
|
componentNameValidationMixin,
|
15928
15914
|
customMixin
|
@@ -15931,7 +15917,7 @@ const AppsListClass = compose(
|
|
15931
15917
|
slots: ['empty-state'],
|
15932
15918
|
wrappedEleName: 'descope-list',
|
15933
15919
|
excludeAttrsSync: ['tabindex', 'class', 'empty'],
|
15934
|
-
componentName: componentName$
|
15920
|
+
componentName: componentName$3,
|
15935
15921
|
style: () => `
|
15936
15922
|
:host {
|
15937
15923
|
width: 100%;
|
@@ -15956,33 +15942,33 @@ const AppsListClass = compose(
|
|
15956
15942
|
})
|
15957
15943
|
);
|
15958
15944
|
|
15959
|
-
const vars$
|
15945
|
+
const vars$2 = AppsListClass.cssVarList;
|
15960
15946
|
const globalRefs = getThemeRefs(globals);
|
15961
15947
|
|
15962
15948
|
const defaultHeight = '400px';
|
15963
15949
|
|
15964
15950
|
const appsList = {
|
15965
|
-
[vars$
|
15966
|
-
[vars$
|
15967
|
-
[vars$
|
15968
|
-
[vars$
|
15951
|
+
[vars$2.itemsFontWeight]: 'normal',
|
15952
|
+
[vars$2.itemsTextAlign]: 'start',
|
15953
|
+
[vars$2.hostDirection]: globalRefs.direction,
|
15954
|
+
[vars$2.maxHeight]: defaultHeight,
|
15969
15955
|
|
15970
15956
|
_empty: {
|
15971
|
-
[vars$
|
15957
|
+
[vars$2.minHeight]: defaultHeight,
|
15972
15958
|
},
|
15973
15959
|
|
15974
15960
|
size: {
|
15975
15961
|
xs: {
|
15976
|
-
[vars$
|
15962
|
+
[vars$2.itemsFontSize]: '14px',
|
15977
15963
|
},
|
15978
15964
|
sm: {
|
15979
|
-
[vars$
|
15965
|
+
[vars$2.itemsFontSize]: '14px',
|
15980
15966
|
},
|
15981
15967
|
md: {
|
15982
|
-
[vars$
|
15968
|
+
[vars$2.itemsFontSize]: '16px',
|
15983
15969
|
},
|
15984
15970
|
lg: {
|
15985
|
-
[vars$
|
15971
|
+
[vars$2.itemsFontSize]: '20px',
|
15986
15972
|
},
|
15987
15973
|
},
|
15988
15974
|
};
|
@@ -15990,6 +15976,127 @@ const appsList = {
|
|
15990
15976
|
var appsList$1 = /*#__PURE__*/Object.freeze({
|
15991
15977
|
__proto__: null,
|
15992
15978
|
default: appsList,
|
15979
|
+
vars: vars$2
|
15980
|
+
});
|
15981
|
+
|
15982
|
+
const componentName$2 = getComponentName('scopes-list');
|
15983
|
+
const variants = ['checkbox', 'switch'];
|
15984
|
+
|
15985
|
+
const itemRenderer = ({ id, desc, required = false }, _, ref) => {
|
15986
|
+
const ComponentClass = ref.variant === 'checkbox' ? CheckboxClass : SwitchToggleClass;
|
15987
|
+
|
15988
|
+
return `
|
15989
|
+
<${ComponentClass.componentName}
|
15990
|
+
bordered="true"
|
15991
|
+
size=${ref.size}
|
15992
|
+
label="${desc}"
|
15993
|
+
data-id="${id}"
|
15994
|
+
readonly="${required || ref.isReadOnly}"
|
15995
|
+
required="${required}"
|
15996
|
+
checked="true"
|
15997
|
+
></${ComponentClass.componentName}>
|
15998
|
+
`;
|
15999
|
+
};
|
16000
|
+
|
16001
|
+
class RawScopesList extends createBaseClass({ componentName: componentName$2, baseSelector: 'div' }) {
|
16002
|
+
constructor() {
|
16003
|
+
super();
|
16004
|
+
|
16005
|
+
this.attachShadow({ mode: 'open' }).innerHTML = `
|
16006
|
+
<style>
|
16007
|
+
:host {
|
16008
|
+
display: inline-flex;
|
16009
|
+
}
|
16010
|
+
|
16011
|
+
div {
|
16012
|
+
display: flex;
|
16013
|
+
flex-direction: column;
|
16014
|
+
}
|
16015
|
+
|
16016
|
+
</style>
|
16017
|
+
<div></div>
|
16018
|
+
`;
|
16019
|
+
}
|
16020
|
+
|
16021
|
+
get isReadOnly() {
|
16022
|
+
return this.getAttribute('readonly') === 'true';
|
16023
|
+
}
|
16024
|
+
|
16025
|
+
get size() {
|
16026
|
+
return this.getAttribute('size') || 'sm';
|
16027
|
+
}
|
16028
|
+
|
16029
|
+
get value() {
|
16030
|
+
return Array.from(this.shadowRoot.querySelector('div').children).reduce(
|
16031
|
+
(acc, el) => ({ ...acc, [el.getAttribute('data-id')]: el.checked }),
|
16032
|
+
{}
|
16033
|
+
);
|
16034
|
+
}
|
16035
|
+
|
16036
|
+
get variant() {
|
16037
|
+
const variant = this.getAttribute('variant');
|
16038
|
+
|
16039
|
+
return variants.includes(variant) ? variant : variants[0];
|
16040
|
+
}
|
16041
|
+
}
|
16042
|
+
|
16043
|
+
const ScopesListClass = compose(
|
16044
|
+
createStyleMixin({
|
16045
|
+
mappings: {
|
16046
|
+
hostWidth: { selector: () => ':host', property: 'width' },
|
16047
|
+
hostDirection: [
|
16048
|
+
{ selector: () => ':host', property: 'direction' },
|
16049
|
+
{
|
16050
|
+
selector: () => CheckboxClass.componentName,
|
16051
|
+
property: CheckboxClass.cssVarList.hostDirection,
|
16052
|
+
},
|
16053
|
+
{
|
16054
|
+
selector: () => SwitchToggleClass.componentName,
|
16055
|
+
property: SwitchToggleClass.cssVarList.hostDirection,
|
16056
|
+
},
|
16057
|
+
],
|
16058
|
+
gap: { selector: () => 'div', property: 'gap' },
|
16059
|
+
requiredInputBorderColor: [
|
16060
|
+
{
|
16061
|
+
selector: `${CheckboxClass.componentName}[required="true"]`,
|
16062
|
+
property: CheckboxClass.cssVarList.inputBorderColor,
|
16063
|
+
},
|
16064
|
+
{
|
16065
|
+
selector: `${SwitchToggleClass.componentName}[required="true"]`,
|
16066
|
+
property: SwitchToggleClass.cssVarList.inputBorderColor,
|
16067
|
+
},
|
16068
|
+
],
|
16069
|
+
requiredInputValueTextColor: [
|
16070
|
+
{
|
16071
|
+
selector: `${CheckboxClass.componentName}[required="true"]`,
|
16072
|
+
property: CheckboxClass.cssVarList.inputValueTextColor,
|
16073
|
+
},
|
16074
|
+
{
|
16075
|
+
selector: `${SwitchToggleClass.componentName}[required="true"]`,
|
16076
|
+
property: SwitchToggleClass.cssVarList.knobColor,
|
16077
|
+
},
|
16078
|
+
],
|
16079
|
+
},
|
16080
|
+
}),
|
16081
|
+
createDynamicDataMixin({ itemRenderer, rerenderAttrsList: ['size', 'variant'] }),
|
16082
|
+
draggableMixin,
|
16083
|
+
componentNameValidationMixin
|
16084
|
+
)(RawScopesList);
|
16085
|
+
|
16086
|
+
const vars$1 = ScopesListClass.cssVarList;
|
16087
|
+
|
16088
|
+
const scopesList = {
|
16089
|
+
[vars$1.requiredInputBorderColor]: theme$1._disabled[vars$N.borderColor],
|
16090
|
+
[vars$1.requiredInputValueTextColor]: theme$1._disabled[vars$N.valueTextColor],
|
16091
|
+
[vars$1.hostWidth]: '280px',
|
16092
|
+
_fullWidth: {
|
16093
|
+
[vars$1.hostWidth]: '100%',
|
16094
|
+
},
|
16095
|
+
};
|
16096
|
+
|
16097
|
+
var scopesList$1 = /*#__PURE__*/Object.freeze({
|
16098
|
+
__proto__: null,
|
16099
|
+
default: scopesList,
|
15993
16100
|
vars: vars$1
|
15994
16101
|
});
|
15995
16102
|
|
@@ -16043,6 +16150,7 @@ const components = {
|
|
16043
16150
|
list: list$2,
|
16044
16151
|
listItem,
|
16045
16152
|
appsList: appsList$1,
|
16153
|
+
scopesList: scopesList$1,
|
16046
16154
|
};
|
16047
16155
|
|
16048
16156
|
const theme = Object.keys(components).reduce(
|
@@ -16055,7 +16163,7 @@ const vars = Object.keys(components).reduce(
|
|
16055
16163
|
);
|
16056
16164
|
|
16057
16165
|
const defaultTheme = { globals, components: theme };
|
16058
|
-
const themeVars = { globals: vars$
|
16166
|
+
const themeVars = { globals: vars$P, components: vars };
|
16059
16167
|
|
16060
16168
|
const colors = {
|
16061
16169
|
surface: {
|
@@ -16434,6 +16542,7 @@ exports.RadioButtonClass = RadioButtonClass;
|
|
16434
16542
|
exports.RadioGroupClass = RadioGroupClass;
|
16435
16543
|
exports.RecaptchaClass = RecaptchaClass;
|
16436
16544
|
exports.SamlGroupMappingsClass = SamlGroupMappingsClass;
|
16545
|
+
exports.ScopesListClass = ScopesListClass;
|
16437
16546
|
exports.SwitchToggleClass = SwitchToggleClass;
|
16438
16547
|
exports.TextAreaClass = TextAreaClass;
|
16439
16548
|
exports.TextClass = TextClass;
|