@descope/web-components-ui 1.0.306 → 1.0.307
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/cjs/index.cjs.js +757 -677
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/index.esm.js +706 -626
- package/dist/index.esm.js.map +1 -1
- package/dist/umd/DescopeDev.js +1 -1
- package/dist/umd/button-selection-group-fields-descope-button-multi-selection-group-index-js.js +1 -1
- package/dist/umd/button-selection-group-fields-descope-button-selection-group-index-js.js +1 -1
- package/dist/umd/button-selection-group-fields-descope-button-selection-group-item-index-js.js +1 -1
- package/dist/umd/descope-button-index-js.js +4 -4
- package/dist/umd/descope-icon-index-js.js +1 -0
- package/dist/umd/descope-upload-file-index-js.js +1 -1
- package/dist/umd/descope-user-attribute-index-js.js +1 -1
- package/dist/umd/descope-user-auth-method-index-js.js +1 -1
- package/dist/umd/index.js +1 -1
- package/dist/umd/mapping-fields-descope-mappings-field-index-js.js +1 -1
- package/dist/umd/mapping-fields-descope-saml-group-mappings-index-js.js +1 -1
- package/package.json +1 -1
- package/src/components/descope-button/ButtonClass.js +5 -0
- package/src/components/descope-icon/IconClass.js +65 -0
- package/src/components/descope-icon/index.js +5 -0
- package/src/index.js +1 -0
- package/src/theme/components/button.js +1 -0
- package/src/theme/components/icon.js +7 -0
- package/src/theme/components/index.js +2 -0
package/dist/cjs/index.cjs.js
CHANGED
@@ -631,7 +631,7 @@ const globals = {
|
|
631
631
|
fonts,
|
632
632
|
direction,
|
633
633
|
};
|
634
|
-
const vars$
|
634
|
+
const vars$G = getThemeVars(globals);
|
635
635
|
|
636
636
|
const createCssVar = (varName, fallback) => `var(${varName}${fallback ? `, ${fallback}` : ''})`;
|
637
637
|
|
@@ -2566,6 +2566,70 @@ const inputEventsDispatchingMixin = (superclass) =>
|
|
2566
2566
|
}
|
2567
2567
|
};
|
2568
2568
|
|
2569
|
+
/* eslint-disable no-use-before-define */
|
2570
|
+
|
2571
|
+
const componentName$P = getComponentName('icon');
|
2572
|
+
|
2573
|
+
class RawIcon extends createBaseClass({ componentName: componentName$P, baseSelector: 'slot' }) {
|
2574
|
+
constructor() {
|
2575
|
+
super();
|
2576
|
+
|
2577
|
+
this.attachShadow({ mode: 'open' }).innerHTML = `
|
2578
|
+
<style>
|
2579
|
+
:host > slot {
|
2580
|
+
box-sizing: border-box;
|
2581
|
+
width: 100%;
|
2582
|
+
height: 100%;
|
2583
|
+
display: flex;
|
2584
|
+
overflow: auto;
|
2585
|
+
}
|
2586
|
+
:host {
|
2587
|
+
display: inline-block;
|
2588
|
+
}
|
2589
|
+
</style>
|
2590
|
+
<slot></slot>
|
2591
|
+
`;
|
2592
|
+
}
|
2593
|
+
|
2594
|
+
get items() {
|
2595
|
+
return this.shadowRoot.querySelector('slot').assignedNodes();
|
2596
|
+
}
|
2597
|
+
|
2598
|
+
#onChildrenChange() {
|
2599
|
+
// force hide icon if empty.
|
2600
|
+
if (this.items?.length > 0) {
|
2601
|
+
this.shadowRoot.host.style.setProperty('display', 'inline-block');
|
2602
|
+
} else {
|
2603
|
+
this.shadowRoot.host.style.setProperty('display', 'none');
|
2604
|
+
}
|
2605
|
+
|
2606
|
+
// set fill for all inner svgs to fill var and a fallback
|
2607
|
+
const elems = this.querySelectorAll('*[fill]');
|
2608
|
+
elems.forEach((ele) =>
|
2609
|
+
ele.setAttribute(
|
2610
|
+
'fill',
|
2611
|
+
`var(${IconClass.cssVarList.fill}, ${ele.getAttribute('fill') || "''"})`
|
2612
|
+
)
|
2613
|
+
);
|
2614
|
+
}
|
2615
|
+
|
2616
|
+
init() {
|
2617
|
+
observeChildren(this, this.#onChildrenChange.bind(this));
|
2618
|
+
}
|
2619
|
+
}
|
2620
|
+
|
2621
|
+
const IconClass = compose(
|
2622
|
+
createStyleMixin({
|
2623
|
+
mappings: {
|
2624
|
+
fill: {},
|
2625
|
+
},
|
2626
|
+
}),
|
2627
|
+
draggableMixin,
|
2628
|
+
componentNameValidationMixin
|
2629
|
+
)(RawIcon);
|
2630
|
+
|
2631
|
+
customElements.define(componentName$P, IconClass);
|
2632
|
+
|
2569
2633
|
const clickableMixin = (superclass) =>
|
2570
2634
|
class ClickableMixinClass extends superclass {
|
2571
2635
|
get isLoading() {
|
@@ -2647,6 +2711,10 @@ const ButtonClass = compose(
|
|
2647
2711
|
verticalPadding: [{ property: 'padding-top' }, { property: 'padding-bottom' }],
|
2648
2712
|
|
2649
2713
|
labelTextColor: { property: 'color' },
|
2714
|
+
iconColor: {
|
2715
|
+
selector: () => `::slotted(${IconClass.componentName})`,
|
2716
|
+
property: IconClass.cssVarList.fill,
|
2717
|
+
},
|
2650
2718
|
labelTextDecoration: { ...label$a, property: 'text-decoration' },
|
2651
2719
|
labelSpacing: { ...label$a, property: 'gap' },
|
2652
2720
|
textAlign: { ...label$a, property: 'justify-content', fallback: 'center' },
|
@@ -2787,6 +2855,7 @@ const button = {
|
|
2787
2855
|
[helperVars$3.dark]: globalRefs$o.colors.surface.dark,
|
2788
2856
|
[helperVars$3.light]: globalRefs$o.colors.surface.light,
|
2789
2857
|
[helperVars$3.contrast]: globalRefs$o.colors.surface.main,
|
2858
|
+
[compVars$5.iconColor]: globalRefs$o.colors.surface.main,
|
2790
2859
|
},
|
2791
2860
|
|
2792
2861
|
variant: {
|
@@ -2834,7 +2903,7 @@ const button = {
|
|
2834
2903
|
},
|
2835
2904
|
};
|
2836
2905
|
|
2837
|
-
const vars$
|
2906
|
+
const vars$F = {
|
2838
2907
|
...compVars$5,
|
2839
2908
|
...helperVars$3,
|
2840
2909
|
};
|
@@ -2842,7 +2911,7 @@ const vars$E = {
|
|
2842
2911
|
var button$1 = /*#__PURE__*/Object.freeze({
|
2843
2912
|
__proto__: null,
|
2844
2913
|
default: button,
|
2845
|
-
vars: vars$
|
2914
|
+
vars: vars$F
|
2846
2915
|
});
|
2847
2916
|
|
2848
2917
|
const {
|
@@ -3107,7 +3176,7 @@ const TextFieldClass = compose(
|
|
3107
3176
|
const componentName$M = getComponentName('input-wrapper');
|
3108
3177
|
const globalRefs$n = getThemeRefs(globals);
|
3109
3178
|
|
3110
|
-
const [theme$1, refs, vars$
|
3179
|
+
const [theme$1, refs, vars$E] = createHelperVars(
|
3111
3180
|
{
|
3112
3181
|
labelTextColor: globalRefs$n.colors.surface.dark,
|
3113
3182
|
labelFontSize: '14px', // not taken from globals as it is fixed in all inputs
|
@@ -3184,38 +3253,38 @@ var inputWrapper = /*#__PURE__*/Object.freeze({
|
|
3184
3253
|
__proto__: null,
|
3185
3254
|
default: theme$1,
|
3186
3255
|
refs: refs,
|
3187
|
-
vars: vars$
|
3256
|
+
vars: vars$E
|
3188
3257
|
});
|
3189
3258
|
|
3190
|
-
const vars$
|
3259
|
+
const vars$D = TextFieldClass.cssVarList;
|
3191
3260
|
|
3192
3261
|
const textField$1 = {
|
3193
|
-
[vars$
|
3194
|
-
[vars$
|
3195
|
-
[vars$
|
3196
|
-
[vars$
|
3197
|
-
[vars$
|
3198
|
-
[vars$
|
3199
|
-
[vars$
|
3200
|
-
[vars$
|
3201
|
-
[vars$
|
3202
|
-
[vars$
|
3203
|
-
[vars$
|
3204
|
-
[vars$
|
3205
|
-
[vars$
|
3206
|
-
[vars$
|
3207
|
-
[vars$
|
3208
|
-
[vars$
|
3209
|
-
[vars$
|
3210
|
-
[vars$
|
3211
|
-
[vars$
|
3212
|
-
[vars$
|
3213
|
-
[vars$
|
3214
|
-
[vars$
|
3262
|
+
[vars$D.hostWidth]: refs.width,
|
3263
|
+
[vars$D.hostMinWidth]: refs.minWidth,
|
3264
|
+
[vars$D.hostDirection]: refs.direction,
|
3265
|
+
[vars$D.fontSize]: refs.fontSize,
|
3266
|
+
[vars$D.fontFamily]: refs.fontFamily,
|
3267
|
+
[vars$D.labelTextColor]: refs.labelTextColor,
|
3268
|
+
[vars$D.labelRequiredIndicator]: refs.requiredIndicator,
|
3269
|
+
[vars$D.errorMessageTextColor]: refs.errorMessageTextColor,
|
3270
|
+
[vars$D.inputValueTextColor]: refs.valueTextColor,
|
3271
|
+
[vars$D.inputPlaceholderColor]: refs.placeholderTextColor,
|
3272
|
+
[vars$D.inputBorderWidth]: refs.borderWidth,
|
3273
|
+
[vars$D.inputBorderStyle]: refs.borderStyle,
|
3274
|
+
[vars$D.inputBorderColor]: refs.borderColor,
|
3275
|
+
[vars$D.inputBorderRadius]: refs.borderRadius,
|
3276
|
+
[vars$D.inputOutlineWidth]: refs.outlineWidth,
|
3277
|
+
[vars$D.inputOutlineStyle]: refs.outlineStyle,
|
3278
|
+
[vars$D.inputOutlineColor]: refs.outlineColor,
|
3279
|
+
[vars$D.inputOutlineOffset]: refs.outlineOffset,
|
3280
|
+
[vars$D.inputBackgroundColor]: refs.backgroundColor,
|
3281
|
+
[vars$D.inputHeight]: refs.inputHeight,
|
3282
|
+
[vars$D.inputHorizontalPadding]: refs.horizontalPadding,
|
3283
|
+
[vars$D.helperTextColor]: refs.helperTextColor,
|
3215
3284
|
textAlign: {
|
3216
|
-
right: { [vars$
|
3217
|
-
left: { [vars$
|
3218
|
-
center: { [vars$
|
3285
|
+
right: { [vars$D.inputTextAlign]: 'right' },
|
3286
|
+
left: { [vars$D.inputTextAlign]: 'left' },
|
3287
|
+
center: { [vars$D.inputTextAlign]: 'center' },
|
3219
3288
|
},
|
3220
3289
|
};
|
3221
3290
|
|
@@ -3223,7 +3292,7 @@ var textField$2 = /*#__PURE__*/Object.freeze({
|
|
3223
3292
|
__proto__: null,
|
3224
3293
|
default: textField$1,
|
3225
3294
|
textField: textField$1,
|
3226
|
-
vars: vars$
|
3295
|
+
vars: vars$D
|
3227
3296
|
});
|
3228
3297
|
|
3229
3298
|
const passwordDraggableMixin = (superclass) =>
|
@@ -3394,38 +3463,38 @@ const PasswordClass = compose(
|
|
3394
3463
|
);
|
3395
3464
|
|
3396
3465
|
const globalRefs$m = getThemeRefs(globals);
|
3397
|
-
const vars$
|
3466
|
+
const vars$C = PasswordClass.cssVarList;
|
3398
3467
|
|
3399
3468
|
const password = {
|
3400
|
-
[vars$
|
3401
|
-
[vars$
|
3402
|
-
[vars$
|
3403
|
-
[vars$
|
3404
|
-
[vars$
|
3405
|
-
[vars$
|
3406
|
-
[vars$
|
3407
|
-
[vars$
|
3408
|
-
[vars$
|
3409
|
-
[vars$
|
3410
|
-
[vars$
|
3411
|
-
[vars$
|
3412
|
-
[vars$
|
3413
|
-
[vars$
|
3414
|
-
[vars$
|
3415
|
-
[vars$
|
3416
|
-
[vars$
|
3417
|
-
[vars$
|
3418
|
-
[vars$
|
3419
|
-
[vars$
|
3420
|
-
[vars$
|
3421
|
-
[vars$
|
3422
|
-
[vars$
|
3469
|
+
[vars$C.hostWidth]: refs.width,
|
3470
|
+
[vars$C.hostDirection]: refs.direction,
|
3471
|
+
[vars$C.fontSize]: refs.fontSize,
|
3472
|
+
[vars$C.fontFamily]: refs.fontFamily,
|
3473
|
+
[vars$C.labelTextColor]: refs.labelTextColor,
|
3474
|
+
[vars$C.errorMessageTextColor]: refs.errorMessageTextColor,
|
3475
|
+
[vars$C.inputHorizontalPadding]: refs.horizontalPadding,
|
3476
|
+
[vars$C.inputHeight]: refs.inputHeight,
|
3477
|
+
[vars$C.inputBackgroundColor]: refs.backgroundColor,
|
3478
|
+
[vars$C.labelRequiredIndicator]: refs.requiredIndicator,
|
3479
|
+
[vars$C.inputValueTextColor]: refs.valueTextColor,
|
3480
|
+
[vars$C.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
3481
|
+
[vars$C.inputBorderWidth]: refs.borderWidth,
|
3482
|
+
[vars$C.inputBorderStyle]: refs.borderStyle,
|
3483
|
+
[vars$C.inputBorderColor]: refs.borderColor,
|
3484
|
+
[vars$C.inputBorderRadius]: refs.borderRadius,
|
3485
|
+
[vars$C.inputOutlineWidth]: refs.outlineWidth,
|
3486
|
+
[vars$C.inputOutlineStyle]: refs.outlineStyle,
|
3487
|
+
[vars$C.inputOutlineColor]: refs.outlineColor,
|
3488
|
+
[vars$C.inputOutlineOffset]: refs.outlineOffset,
|
3489
|
+
[vars$C.revealButtonOffset]: globalRefs$m.spacing.md,
|
3490
|
+
[vars$C.revealButtonSize]: refs.toggleButtonSize,
|
3491
|
+
[vars$C.revealButtonColor]: refs.placeholderTextColor,
|
3423
3492
|
};
|
3424
3493
|
|
3425
3494
|
var password$1 = /*#__PURE__*/Object.freeze({
|
3426
3495
|
__proto__: null,
|
3427
3496
|
default: password,
|
3428
|
-
vars: vars$
|
3497
|
+
vars: vars$C
|
3429
3498
|
});
|
3430
3499
|
|
3431
3500
|
const componentName$K = getComponentName('number-field');
|
@@ -3458,36 +3527,36 @@ const NumberFieldClass = compose(
|
|
3458
3527
|
})
|
3459
3528
|
);
|
3460
3529
|
|
3461
|
-
const vars$
|
3530
|
+
const vars$B = NumberFieldClass.cssVarList;
|
3462
3531
|
|
3463
3532
|
const numberField = {
|
3464
|
-
[vars$
|
3465
|
-
[vars$
|
3466
|
-
[vars$
|
3467
|
-
[vars$
|
3468
|
-
[vars$
|
3469
|
-
[vars$
|
3470
|
-
[vars$
|
3471
|
-
[vars$
|
3472
|
-
[vars$
|
3473
|
-
[vars$
|
3474
|
-
[vars$
|
3475
|
-
[vars$
|
3476
|
-
[vars$
|
3477
|
-
[vars$
|
3478
|
-
[vars$
|
3479
|
-
[vars$
|
3480
|
-
[vars$
|
3481
|
-
[vars$
|
3482
|
-
[vars$
|
3483
|
-
[vars$
|
3484
|
-
[vars$
|
3533
|
+
[vars$B.hostWidth]: refs.width,
|
3534
|
+
[vars$B.hostMinWidth]: refs.minWidth,
|
3535
|
+
[vars$B.hostDirection]: refs.direction,
|
3536
|
+
[vars$B.fontSize]: refs.fontSize,
|
3537
|
+
[vars$B.fontFamily]: refs.fontFamily,
|
3538
|
+
[vars$B.labelTextColor]: refs.labelTextColor,
|
3539
|
+
[vars$B.errorMessageTextColor]: refs.errorMessageTextColor,
|
3540
|
+
[vars$B.inputValueTextColor]: refs.valueTextColor,
|
3541
|
+
[vars$B.inputPlaceholderColor]: refs.placeholderTextColor,
|
3542
|
+
[vars$B.inputBorderWidth]: refs.borderWidth,
|
3543
|
+
[vars$B.inputBorderStyle]: refs.borderStyle,
|
3544
|
+
[vars$B.inputBorderColor]: refs.borderColor,
|
3545
|
+
[vars$B.inputBorderRadius]: refs.borderRadius,
|
3546
|
+
[vars$B.inputOutlineWidth]: refs.outlineWidth,
|
3547
|
+
[vars$B.inputOutlineStyle]: refs.outlineStyle,
|
3548
|
+
[vars$B.inputOutlineColor]: refs.outlineColor,
|
3549
|
+
[vars$B.inputOutlineOffset]: refs.outlineOffset,
|
3550
|
+
[vars$B.inputBackgroundColor]: refs.backgroundColor,
|
3551
|
+
[vars$B.labelRequiredIndicator]: refs.requiredIndicator,
|
3552
|
+
[vars$B.inputHorizontalPadding]: refs.horizontalPadding,
|
3553
|
+
[vars$B.inputHeight]: refs.inputHeight,
|
3485
3554
|
};
|
3486
3555
|
|
3487
3556
|
var numberField$1 = /*#__PURE__*/Object.freeze({
|
3488
3557
|
__proto__: null,
|
3489
3558
|
default: numberField,
|
3490
|
-
vars: vars$
|
3559
|
+
vars: vars$B
|
3491
3560
|
});
|
3492
3561
|
|
3493
3562
|
const componentName$J = getComponentName('email-field');
|
@@ -3529,36 +3598,36 @@ const EmailFieldClass = compose(
|
|
3529
3598
|
})
|
3530
3599
|
);
|
3531
3600
|
|
3532
|
-
const vars$
|
3601
|
+
const vars$A = EmailFieldClass.cssVarList;
|
3533
3602
|
|
3534
3603
|
const emailField = {
|
3535
|
-
[vars$
|
3536
|
-
[vars$
|
3537
|
-
[vars$
|
3538
|
-
[vars$
|
3539
|
-
[vars$
|
3540
|
-
[vars$
|
3541
|
-
[vars$
|
3542
|
-
[vars$
|
3543
|
-
[vars$
|
3544
|
-
[vars$
|
3545
|
-
[vars$
|
3546
|
-
[vars$
|
3547
|
-
[vars$
|
3548
|
-
[vars$
|
3549
|
-
[vars$
|
3550
|
-
[vars$
|
3551
|
-
[vars$
|
3552
|
-
[vars$
|
3553
|
-
[vars$
|
3554
|
-
[vars$
|
3555
|
-
[vars$
|
3604
|
+
[vars$A.hostWidth]: refs.width,
|
3605
|
+
[vars$A.hostMinWidth]: refs.minWidth,
|
3606
|
+
[vars$A.hostDirection]: refs.direction,
|
3607
|
+
[vars$A.fontSize]: refs.fontSize,
|
3608
|
+
[vars$A.fontFamily]: refs.fontFamily,
|
3609
|
+
[vars$A.labelTextColor]: refs.labelTextColor,
|
3610
|
+
[vars$A.errorMessageTextColor]: refs.errorMessageTextColor,
|
3611
|
+
[vars$A.inputValueTextColor]: refs.valueTextColor,
|
3612
|
+
[vars$A.labelRequiredIndicator]: refs.requiredIndicator,
|
3613
|
+
[vars$A.inputPlaceholderColor]: refs.placeholderTextColor,
|
3614
|
+
[vars$A.inputBorderWidth]: refs.borderWidth,
|
3615
|
+
[vars$A.inputBorderStyle]: refs.borderStyle,
|
3616
|
+
[vars$A.inputBorderColor]: refs.borderColor,
|
3617
|
+
[vars$A.inputBorderRadius]: refs.borderRadius,
|
3618
|
+
[vars$A.inputOutlineWidth]: refs.outlineWidth,
|
3619
|
+
[vars$A.inputOutlineStyle]: refs.outlineStyle,
|
3620
|
+
[vars$A.inputOutlineColor]: refs.outlineColor,
|
3621
|
+
[vars$A.inputOutlineOffset]: refs.outlineOffset,
|
3622
|
+
[vars$A.inputBackgroundColor]: refs.backgroundColor,
|
3623
|
+
[vars$A.inputHorizontalPadding]: refs.horizontalPadding,
|
3624
|
+
[vars$A.inputHeight]: refs.inputHeight,
|
3556
3625
|
};
|
3557
3626
|
|
3558
3627
|
var emailField$1 = /*#__PURE__*/Object.freeze({
|
3559
3628
|
__proto__: null,
|
3560
3629
|
default: emailField,
|
3561
|
-
vars: vars$
|
3630
|
+
vars: vars$A
|
3562
3631
|
});
|
3563
3632
|
|
3564
3633
|
const componentName$I = getComponentName('text-area');
|
@@ -3641,45 +3710,45 @@ const TextAreaClass = compose(
|
|
3641
3710
|
})
|
3642
3711
|
);
|
3643
3712
|
|
3644
|
-
const vars$
|
3713
|
+
const vars$z = TextAreaClass.cssVarList;
|
3645
3714
|
|
3646
3715
|
const textArea = {
|
3647
|
-
[vars$
|
3648
|
-
[vars$
|
3649
|
-
[vars$
|
3650
|
-
[vars$
|
3651
|
-
[vars$
|
3652
|
-
[vars$
|
3653
|
-
[vars$
|
3654
|
-
[vars$
|
3655
|
-
[vars$
|
3656
|
-
[vars$
|
3657
|
-
[vars$
|
3658
|
-
[vars$
|
3659
|
-
[vars$
|
3660
|
-
[vars$
|
3661
|
-
[vars$
|
3662
|
-
[vars$
|
3663
|
-
[vars$
|
3664
|
-
[vars$
|
3665
|
-
[vars$
|
3666
|
-
[vars$
|
3667
|
-
[vars$
|
3716
|
+
[vars$z.hostWidth]: refs.width,
|
3717
|
+
[vars$z.hostMinWidth]: refs.minWidth,
|
3718
|
+
[vars$z.hostDirection]: refs.direction,
|
3719
|
+
[vars$z.fontSize]: refs.fontSize,
|
3720
|
+
[vars$z.fontFamily]: refs.fontFamily,
|
3721
|
+
[vars$z.labelTextColor]: refs.labelTextColor,
|
3722
|
+
[vars$z.labelRequiredIndicator]: refs.requiredIndicator,
|
3723
|
+
[vars$z.errorMessageTextColor]: refs.errorMessageTextColor,
|
3724
|
+
[vars$z.inputBackgroundColor]: refs.backgroundColor,
|
3725
|
+
[vars$z.inputValueTextColor]: refs.valueTextColor,
|
3726
|
+
[vars$z.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
3727
|
+
[vars$z.inputBorderRadius]: refs.borderRadius,
|
3728
|
+
[vars$z.inputBorderWidth]: refs.borderWidth,
|
3729
|
+
[vars$z.inputBorderStyle]: refs.borderStyle,
|
3730
|
+
[vars$z.inputBorderColor]: refs.borderColor,
|
3731
|
+
[vars$z.inputOutlineWidth]: refs.outlineWidth,
|
3732
|
+
[vars$z.inputOutlineStyle]: refs.outlineStyle,
|
3733
|
+
[vars$z.inputOutlineColor]: refs.outlineColor,
|
3734
|
+
[vars$z.inputOutlineOffset]: refs.outlineOffset,
|
3735
|
+
[vars$z.inputResizeType]: 'vertical',
|
3736
|
+
[vars$z.inputMinHeight]: '5em',
|
3668
3737
|
textAlign: {
|
3669
|
-
right: { [vars$
|
3670
|
-
left: { [vars$
|
3671
|
-
center: { [vars$
|
3738
|
+
right: { [vars$z.inputTextAlign]: 'right' },
|
3739
|
+
left: { [vars$z.inputTextAlign]: 'left' },
|
3740
|
+
center: { [vars$z.inputTextAlign]: 'center' },
|
3672
3741
|
},
|
3673
3742
|
|
3674
3743
|
_readonly: {
|
3675
|
-
[vars$
|
3744
|
+
[vars$z.inputResizeType]: 'none',
|
3676
3745
|
},
|
3677
3746
|
};
|
3678
3747
|
|
3679
3748
|
var textArea$1 = /*#__PURE__*/Object.freeze({
|
3680
3749
|
__proto__: null,
|
3681
3750
|
default: textArea,
|
3682
|
-
vars: vars$
|
3751
|
+
vars: vars$z
|
3683
3752
|
});
|
3684
3753
|
|
3685
3754
|
const createBaseInputClass = (...args) =>
|
@@ -3888,44 +3957,44 @@ const CheckboxClass = compose(
|
|
3888
3957
|
})
|
3889
3958
|
);
|
3890
3959
|
|
3891
|
-
const vars$
|
3960
|
+
const vars$y = CheckboxClass.cssVarList;
|
3892
3961
|
const checkboxSize = '1.35em';
|
3893
3962
|
|
3894
3963
|
const checkbox = {
|
3895
|
-
[vars$
|
3896
|
-
[vars$
|
3897
|
-
[vars$
|
3898
|
-
[vars$
|
3899
|
-
[vars$
|
3900
|
-
[vars$
|
3901
|
-
[vars$
|
3902
|
-
[vars$
|
3903
|
-
[vars$
|
3904
|
-
[vars$
|
3905
|
-
[vars$
|
3906
|
-
[vars$
|
3907
|
-
[vars$
|
3908
|
-
[vars$
|
3909
|
-
[vars$
|
3910
|
-
[vars$
|
3911
|
-
[vars$
|
3912
|
-
[vars$
|
3913
|
-
[vars$
|
3914
|
-
[vars$
|
3964
|
+
[vars$y.hostWidth]: refs.width,
|
3965
|
+
[vars$y.hostDirection]: refs.direction,
|
3966
|
+
[vars$y.fontSize]: refs.fontSize,
|
3967
|
+
[vars$y.fontFamily]: refs.fontFamily,
|
3968
|
+
[vars$y.labelTextColor]: refs.labelTextColor,
|
3969
|
+
[vars$y.labelRequiredIndicator]: refs.requiredIndicator,
|
3970
|
+
[vars$y.labelFontWeight]: '400',
|
3971
|
+
[vars$y.labelLineHeight]: checkboxSize,
|
3972
|
+
[vars$y.labelSpacing]: '1em',
|
3973
|
+
[vars$y.errorMessageTextColor]: refs.errorMessageTextColor,
|
3974
|
+
[vars$y.inputOutlineWidth]: refs.outlineWidth,
|
3975
|
+
[vars$y.inputOutlineOffset]: refs.outlineOffset,
|
3976
|
+
[vars$y.inputOutlineColor]: refs.outlineColor,
|
3977
|
+
[vars$y.inputOutlineStyle]: refs.outlineStyle,
|
3978
|
+
[vars$y.inputBorderRadius]: refs.borderRadius,
|
3979
|
+
[vars$y.inputBorderColor]: refs.borderColor,
|
3980
|
+
[vars$y.inputBorderWidth]: refs.borderWidth,
|
3981
|
+
[vars$y.inputBorderStyle]: refs.borderStyle,
|
3982
|
+
[vars$y.inputBackgroundColor]: refs.backgroundColor,
|
3983
|
+
[vars$y.inputSize]: checkboxSize,
|
3915
3984
|
|
3916
3985
|
_checked: {
|
3917
|
-
[vars$
|
3986
|
+
[vars$y.inputValueTextColor]: refs.valueTextColor,
|
3918
3987
|
},
|
3919
3988
|
|
3920
3989
|
_disabled: {
|
3921
|
-
[vars$
|
3990
|
+
[vars$y.labelTextColor]: refs.labelTextColor,
|
3922
3991
|
},
|
3923
3992
|
};
|
3924
3993
|
|
3925
3994
|
var checkbox$1 = /*#__PURE__*/Object.freeze({
|
3926
3995
|
__proto__: null,
|
3927
3996
|
default: checkbox,
|
3928
|
-
vars: vars$
|
3997
|
+
vars: vars$y
|
3929
3998
|
});
|
3930
3999
|
|
3931
4000
|
const componentName$F = getComponentName('switch-toggle');
|
@@ -4068,69 +4137,69 @@ const knobMargin = '2px';
|
|
4068
4137
|
const checkboxHeight = '1.25em';
|
4069
4138
|
|
4070
4139
|
const globalRefs$l = getThemeRefs(globals);
|
4071
|
-
const vars$
|
4140
|
+
const vars$x = SwitchToggleClass.cssVarList;
|
4072
4141
|
|
4073
4142
|
const switchToggle = {
|
4074
|
-
[vars$
|
4075
|
-
[vars$
|
4076
|
-
[vars$
|
4077
|
-
[vars$
|
4078
|
-
|
4079
|
-
[vars$
|
4080
|
-
[vars$
|
4081
|
-
[vars$
|
4082
|
-
[vars$
|
4083
|
-
|
4084
|
-
[vars$
|
4085
|
-
[vars$
|
4086
|
-
[vars$
|
4087
|
-
[vars$
|
4088
|
-
[vars$
|
4089
|
-
[vars$
|
4090
|
-
[vars$
|
4091
|
-
|
4092
|
-
[vars$
|
4093
|
-
[vars$
|
4094
|
-
[vars$
|
4095
|
-
[vars$
|
4096
|
-
[vars$
|
4097
|
-
[vars$
|
4098
|
-
|
4099
|
-
[vars$
|
4100
|
-
[vars$
|
4101
|
-
[vars$
|
4102
|
-
[vars$
|
4103
|
-
[vars$
|
4104
|
-
[vars$
|
4143
|
+
[vars$x.hostWidth]: refs.width,
|
4144
|
+
[vars$x.hostDirection]: refs.direction,
|
4145
|
+
[vars$x.fontSize]: refs.fontSize,
|
4146
|
+
[vars$x.fontFamily]: refs.fontFamily,
|
4147
|
+
|
4148
|
+
[vars$x.inputOutlineWidth]: refs.outlineWidth,
|
4149
|
+
[vars$x.inputOutlineOffset]: refs.outlineOffset,
|
4150
|
+
[vars$x.inputOutlineColor]: refs.outlineColor,
|
4151
|
+
[vars$x.inputOutlineStyle]: refs.outlineStyle,
|
4152
|
+
|
4153
|
+
[vars$x.trackBorderStyle]: refs.borderStyle,
|
4154
|
+
[vars$x.trackBorderWidth]: refs.borderWidth, // var `trackBorderWidth` used outside the theme for `left` margin calculation
|
4155
|
+
[vars$x.trackBorderColor]: refs.borderColor,
|
4156
|
+
[vars$x.trackBackgroundColor]: refs.backgroundColor,
|
4157
|
+
[vars$x.trackBorderRadius]: globalRefs$l.radius.md,
|
4158
|
+
[vars$x.trackWidth]: '2.5em', // var `trackWidth` used outside the theme for `left` margin calculation
|
4159
|
+
[vars$x.trackHeight]: checkboxHeight,
|
4160
|
+
|
4161
|
+
[vars$x.knobSize]: `calc(1em - ${knobMargin})`,
|
4162
|
+
[vars$x.knobRadius]: '50%',
|
4163
|
+
[vars$x.knobTopOffset]: '1px',
|
4164
|
+
[vars$x.knobLeftOffset]: knobMargin,
|
4165
|
+
[vars$x.knobColor]: refs.labelTextColor,
|
4166
|
+
[vars$x.knobTransitionDuration]: '0.3s',
|
4167
|
+
|
4168
|
+
[vars$x.labelTextColor]: refs.labelTextColor,
|
4169
|
+
[vars$x.labelFontWeight]: '400',
|
4170
|
+
[vars$x.labelLineHeight]: '1.35em',
|
4171
|
+
[vars$x.labelSpacing]: '1em',
|
4172
|
+
[vars$x.labelRequiredIndicator]: refs.requiredIndicator,
|
4173
|
+
[vars$x.errorMessageTextColor]: refs.errorMessageTextColor,
|
4105
4174
|
|
4106
4175
|
_checked: {
|
4107
|
-
[vars$
|
4108
|
-
[vars$
|
4109
|
-
[vars$
|
4110
|
-
[vars$
|
4176
|
+
[vars$x.trackBorderColor]: refs.borderColor,
|
4177
|
+
[vars$x.knobLeftOffset]: `calc(100% - var(${vars$x.knobSize}) - ${knobMargin})`,
|
4178
|
+
[vars$x.knobColor]: refs.valueTextColor,
|
4179
|
+
[vars$x.knobTextColor]: refs.valueTextColor,
|
4111
4180
|
},
|
4112
4181
|
|
4113
4182
|
_disabled: {
|
4114
|
-
[vars$
|
4115
|
-
[vars$
|
4116
|
-
[vars$
|
4117
|
-
[vars$
|
4183
|
+
[vars$x.knobColor]: globalRefs$l.colors.surface.light,
|
4184
|
+
[vars$x.trackBorderColor]: globalRefs$l.colors.surface.light,
|
4185
|
+
[vars$x.trackBackgroundColor]: globalRefs$l.colors.surface.main,
|
4186
|
+
[vars$x.labelTextColor]: refs.labelTextColor,
|
4118
4187
|
_checked: {
|
4119
|
-
[vars$
|
4120
|
-
[vars$
|
4188
|
+
[vars$x.knobColor]: globalRefs$l.colors.surface.light,
|
4189
|
+
[vars$x.trackBackgroundColor]: globalRefs$l.colors.surface.main,
|
4121
4190
|
},
|
4122
4191
|
},
|
4123
4192
|
|
4124
4193
|
_invalid: {
|
4125
|
-
[vars$
|
4126
|
-
[vars$
|
4194
|
+
[vars$x.trackBorderColor]: globalRefs$l.colors.error.main,
|
4195
|
+
[vars$x.knobColor]: globalRefs$l.colors.error.main,
|
4127
4196
|
},
|
4128
4197
|
};
|
4129
4198
|
|
4130
4199
|
var switchToggle$1 = /*#__PURE__*/Object.freeze({
|
4131
4200
|
__proto__: null,
|
4132
4201
|
default: switchToggle,
|
4133
|
-
vars: vars$
|
4202
|
+
vars: vars$x
|
4134
4203
|
});
|
4135
4204
|
|
4136
4205
|
const componentName$E = getComponentName('container');
|
@@ -4296,7 +4365,7 @@ const container = {
|
|
4296
4365
|
},
|
4297
4366
|
};
|
4298
4367
|
|
4299
|
-
const vars$
|
4368
|
+
const vars$w = {
|
4300
4369
|
...compVars$4,
|
4301
4370
|
...helperVars$2,
|
4302
4371
|
};
|
@@ -4304,7 +4373,7 @@ const vars$v = {
|
|
4304
4373
|
var container$1 = /*#__PURE__*/Object.freeze({
|
4305
4374
|
__proto__: null,
|
4306
4375
|
default: container,
|
4307
|
-
vars: vars$
|
4376
|
+
vars: vars$w
|
4308
4377
|
});
|
4309
4378
|
|
4310
4379
|
const createCssVarImageClass = ({ componentName, varName, fallbackVarName }) => {
|
@@ -4365,16 +4434,16 @@ const LogoClass = createCssVarImageClass({
|
|
4365
4434
|
fallbackVarName: 'fallbackUrl',
|
4366
4435
|
});
|
4367
4436
|
|
4368
|
-
const vars$
|
4437
|
+
const vars$v = LogoClass.cssVarList;
|
4369
4438
|
|
4370
4439
|
const logo$2 = {
|
4371
|
-
[vars$
|
4440
|
+
[vars$v.fallbackUrl]: 'url(https://imgs.descope.com/components/no-logo-placeholder.svg)',
|
4372
4441
|
};
|
4373
4442
|
|
4374
4443
|
var logo$3 = /*#__PURE__*/Object.freeze({
|
4375
4444
|
__proto__: null,
|
4376
4445
|
default: logo$2,
|
4377
|
-
vars: vars$
|
4446
|
+
vars: vars$v
|
4378
4447
|
});
|
4379
4448
|
|
4380
4449
|
const componentName$C = getComponentName('totp-image');
|
@@ -4385,16 +4454,16 @@ const TotpImageClass = createCssVarImageClass({
|
|
4385
4454
|
fallbackVarName: 'fallbackUrl',
|
4386
4455
|
});
|
4387
4456
|
|
4388
|
-
const vars$
|
4457
|
+
const vars$u = TotpImageClass.cssVarList;
|
4389
4458
|
|
4390
4459
|
const logo$1 = {
|
4391
|
-
[vars$
|
4460
|
+
[vars$u.fallbackUrl]: 'url(https://imgs.descope.com/components/totp-placeholder.svg)',
|
4392
4461
|
};
|
4393
4462
|
|
4394
4463
|
var totpImage = /*#__PURE__*/Object.freeze({
|
4395
4464
|
__proto__: null,
|
4396
4465
|
default: logo$1,
|
4397
|
-
vars: vars$
|
4466
|
+
vars: vars$u
|
4398
4467
|
});
|
4399
4468
|
|
4400
4469
|
const componentName$B = getComponentName('notp-image');
|
@@ -4405,16 +4474,16 @@ const NotpImageClass = createCssVarImageClass({
|
|
4405
4474
|
fallbackVarName: 'fallbackUrl',
|
4406
4475
|
});
|
4407
4476
|
|
4408
|
-
const vars$
|
4477
|
+
const vars$t = NotpImageClass.cssVarList;
|
4409
4478
|
|
4410
4479
|
const logo = {
|
4411
|
-
[vars$
|
4480
|
+
[vars$t.fallbackUrl]: 'url(https://imgs.descope.com/components/notp-placeholder.svg)',
|
4412
4481
|
};
|
4413
4482
|
|
4414
4483
|
var notpImage = /*#__PURE__*/Object.freeze({
|
4415
4484
|
__proto__: null,
|
4416
4485
|
default: logo,
|
4417
|
-
vars: vars$
|
4486
|
+
vars: vars$t
|
4418
4487
|
});
|
4419
4488
|
|
4420
4489
|
const componentName$A = getComponentName('text');
|
@@ -4476,93 +4545,93 @@ const TextClass = compose(
|
|
4476
4545
|
)(RawText);
|
4477
4546
|
|
4478
4547
|
const globalRefs$j = getThemeRefs(globals);
|
4479
|
-
const vars$
|
4548
|
+
const vars$s = TextClass.cssVarList;
|
4480
4549
|
|
4481
4550
|
const text$2 = {
|
4482
|
-
[vars$
|
4483
|
-
[vars$
|
4484
|
-
[vars$
|
4485
|
-
[vars$
|
4551
|
+
[vars$s.hostDirection]: globalRefs$j.direction,
|
4552
|
+
[vars$s.textLineHeight]: '1.35em',
|
4553
|
+
[vars$s.textAlign]: 'left',
|
4554
|
+
[vars$s.textColor]: globalRefs$j.colors.surface.dark,
|
4486
4555
|
variant: {
|
4487
4556
|
h1: {
|
4488
|
-
[vars$
|
4489
|
-
[vars$
|
4490
|
-
[vars$
|
4557
|
+
[vars$s.fontSize]: globalRefs$j.typography.h1.size,
|
4558
|
+
[vars$s.fontWeight]: globalRefs$j.typography.h1.weight,
|
4559
|
+
[vars$s.fontFamily]: globalRefs$j.typography.h1.font,
|
4491
4560
|
},
|
4492
4561
|
h2: {
|
4493
|
-
[vars$
|
4494
|
-
[vars$
|
4495
|
-
[vars$
|
4562
|
+
[vars$s.fontSize]: globalRefs$j.typography.h2.size,
|
4563
|
+
[vars$s.fontWeight]: globalRefs$j.typography.h2.weight,
|
4564
|
+
[vars$s.fontFamily]: globalRefs$j.typography.h2.font,
|
4496
4565
|
},
|
4497
4566
|
h3: {
|
4498
|
-
[vars$
|
4499
|
-
[vars$
|
4500
|
-
[vars$
|
4567
|
+
[vars$s.fontSize]: globalRefs$j.typography.h3.size,
|
4568
|
+
[vars$s.fontWeight]: globalRefs$j.typography.h3.weight,
|
4569
|
+
[vars$s.fontFamily]: globalRefs$j.typography.h3.font,
|
4501
4570
|
},
|
4502
4571
|
subtitle1: {
|
4503
|
-
[vars$
|
4504
|
-
[vars$
|
4505
|
-
[vars$
|
4572
|
+
[vars$s.fontSize]: globalRefs$j.typography.subtitle1.size,
|
4573
|
+
[vars$s.fontWeight]: globalRefs$j.typography.subtitle1.weight,
|
4574
|
+
[vars$s.fontFamily]: globalRefs$j.typography.subtitle1.font,
|
4506
4575
|
},
|
4507
4576
|
subtitle2: {
|
4508
|
-
[vars$
|
4509
|
-
[vars$
|
4510
|
-
[vars$
|
4577
|
+
[vars$s.fontSize]: globalRefs$j.typography.subtitle2.size,
|
4578
|
+
[vars$s.fontWeight]: globalRefs$j.typography.subtitle2.weight,
|
4579
|
+
[vars$s.fontFamily]: globalRefs$j.typography.subtitle2.font,
|
4511
4580
|
},
|
4512
4581
|
body1: {
|
4513
|
-
[vars$
|
4514
|
-
[vars$
|
4515
|
-
[vars$
|
4582
|
+
[vars$s.fontSize]: globalRefs$j.typography.body1.size,
|
4583
|
+
[vars$s.fontWeight]: globalRefs$j.typography.body1.weight,
|
4584
|
+
[vars$s.fontFamily]: globalRefs$j.typography.body1.font,
|
4516
4585
|
},
|
4517
4586
|
body2: {
|
4518
|
-
[vars$
|
4519
|
-
[vars$
|
4520
|
-
[vars$
|
4587
|
+
[vars$s.fontSize]: globalRefs$j.typography.body2.size,
|
4588
|
+
[vars$s.fontWeight]: globalRefs$j.typography.body2.weight,
|
4589
|
+
[vars$s.fontFamily]: globalRefs$j.typography.body2.font,
|
4521
4590
|
},
|
4522
4591
|
},
|
4523
4592
|
|
4524
4593
|
mode: {
|
4525
4594
|
primary: {
|
4526
|
-
[vars$
|
4595
|
+
[vars$s.textColor]: globalRefs$j.colors.surface.contrast,
|
4527
4596
|
},
|
4528
4597
|
secondary: {
|
4529
|
-
[vars$
|
4598
|
+
[vars$s.textColor]: globalRefs$j.colors.surface.dark,
|
4530
4599
|
},
|
4531
4600
|
error: {
|
4532
|
-
[vars$
|
4601
|
+
[vars$s.textColor]: globalRefs$j.colors.error.main,
|
4533
4602
|
},
|
4534
4603
|
success: {
|
4535
|
-
[vars$
|
4604
|
+
[vars$s.textColor]: globalRefs$j.colors.success.main,
|
4536
4605
|
},
|
4537
4606
|
},
|
4538
4607
|
|
4539
4608
|
textAlign: {
|
4540
|
-
right: { [vars$
|
4541
|
-
left: { [vars$
|
4542
|
-
center: { [vars$
|
4609
|
+
right: { [vars$s.textAlign]: 'right' },
|
4610
|
+
left: { [vars$s.textAlign]: 'left' },
|
4611
|
+
center: { [vars$s.textAlign]: 'center' },
|
4543
4612
|
},
|
4544
4613
|
|
4545
4614
|
_fullWidth: {
|
4546
|
-
[vars$
|
4615
|
+
[vars$s.hostWidth]: '100%',
|
4547
4616
|
},
|
4548
4617
|
|
4549
4618
|
_italic: {
|
4550
|
-
[vars$
|
4619
|
+
[vars$s.fontStyle]: 'italic',
|
4551
4620
|
},
|
4552
4621
|
|
4553
4622
|
_uppercase: {
|
4554
|
-
[vars$
|
4623
|
+
[vars$s.textTransform]: 'uppercase',
|
4555
4624
|
},
|
4556
4625
|
|
4557
4626
|
_lowercase: {
|
4558
|
-
[vars$
|
4627
|
+
[vars$s.textTransform]: 'lowercase',
|
4559
4628
|
},
|
4560
4629
|
};
|
4561
4630
|
|
4562
4631
|
var text$3 = /*#__PURE__*/Object.freeze({
|
4563
4632
|
__proto__: null,
|
4564
4633
|
default: text$2,
|
4565
|
-
vars: vars$
|
4634
|
+
vars: vars$s
|
4566
4635
|
});
|
4567
4636
|
|
4568
4637
|
const textRuleSet = {
|
@@ -4809,122 +4878,122 @@ const LinkClass = compose(
|
|
4809
4878
|
)(RawLink);
|
4810
4879
|
|
4811
4880
|
const globalRefs$i = getThemeRefs(globals);
|
4812
|
-
const vars$
|
4881
|
+
const vars$r = EnrichedTextClass.cssVarList;
|
4813
4882
|
|
4814
4883
|
const EnrichedText = {
|
4815
|
-
[vars$
|
4884
|
+
[vars$r.hostDirection]: globalRefs$i.direction,
|
4816
4885
|
|
4817
|
-
[vars$
|
4818
|
-
[vars$
|
4819
|
-
[vars$
|
4886
|
+
[vars$r.fontSize]: globalRefs$i.typography.body1.size,
|
4887
|
+
[vars$r.fontWeight]: globalRefs$i.typography.body1.weight,
|
4888
|
+
[vars$r.fontFamily]: globalRefs$i.typography.body1.font,
|
4820
4889
|
|
4821
|
-
[vars$
|
4822
|
-
[vars$
|
4823
|
-
[vars$
|
4890
|
+
[vars$r.textLineHeight]: '1.35em',
|
4891
|
+
[vars$r.textAlign]: 'left',
|
4892
|
+
[vars$r.textColor]: globalRefs$i.colors.surface.dark,
|
4824
4893
|
|
4825
|
-
[vars$
|
4894
|
+
[vars$r.linkColor]: `var(${LinkClass.cssVarList.textColor})`,
|
4826
4895
|
|
4827
4896
|
mode: {
|
4828
4897
|
primary: {
|
4829
|
-
[vars$
|
4898
|
+
[vars$r.textColor]: globalRefs$i.colors.surface.contrast,
|
4830
4899
|
},
|
4831
4900
|
secondary: {
|
4832
|
-
[vars$
|
4901
|
+
[vars$r.textColor]: globalRefs$i.colors.surface.dark,
|
4833
4902
|
},
|
4834
4903
|
error: {
|
4835
|
-
[vars$
|
4904
|
+
[vars$r.textColor]: globalRefs$i.colors.error.main,
|
4836
4905
|
},
|
4837
4906
|
success: {
|
4838
|
-
[vars$
|
4907
|
+
[vars$r.textColor]: globalRefs$i.colors.success.main,
|
4839
4908
|
},
|
4840
4909
|
},
|
4841
4910
|
|
4842
4911
|
variant: {
|
4843
4912
|
h1: {
|
4844
|
-
[vars$
|
4845
|
-
[vars$
|
4846
|
-
[vars$
|
4913
|
+
[vars$r.fontSize]: globalRefs$i.typography.h1.size,
|
4914
|
+
[vars$r.fontWeight]: globalRefs$i.typography.h1.weight,
|
4915
|
+
[vars$r.fontFamily]: globalRefs$i.typography.h1.font,
|
4847
4916
|
},
|
4848
4917
|
h2: {
|
4849
|
-
[vars$
|
4850
|
-
[vars$
|
4851
|
-
[vars$
|
4918
|
+
[vars$r.fontSize]: globalRefs$i.typography.h2.size,
|
4919
|
+
[vars$r.fontWeight]: globalRefs$i.typography.h2.weight,
|
4920
|
+
[vars$r.fontFamily]: globalRefs$i.typography.h2.font,
|
4852
4921
|
},
|
4853
4922
|
h3: {
|
4854
|
-
[vars$
|
4855
|
-
[vars$
|
4856
|
-
[vars$
|
4923
|
+
[vars$r.fontSize]: globalRefs$i.typography.h3.size,
|
4924
|
+
[vars$r.fontWeight]: globalRefs$i.typography.h3.weight,
|
4925
|
+
[vars$r.fontFamily]: globalRefs$i.typography.h3.font,
|
4857
4926
|
},
|
4858
4927
|
subtitle1: {
|
4859
|
-
[vars$
|
4860
|
-
[vars$
|
4861
|
-
[vars$
|
4928
|
+
[vars$r.fontSize]: globalRefs$i.typography.subtitle1.size,
|
4929
|
+
[vars$r.fontWeight]: globalRefs$i.typography.subtitle1.weight,
|
4930
|
+
[vars$r.fontFamily]: globalRefs$i.typography.subtitle1.font,
|
4862
4931
|
},
|
4863
4932
|
subtitle2: {
|
4864
|
-
[vars$
|
4865
|
-
[vars$
|
4866
|
-
[vars$
|
4933
|
+
[vars$r.fontSize]: globalRefs$i.typography.subtitle2.size,
|
4934
|
+
[vars$r.fontWeight]: globalRefs$i.typography.subtitle2.weight,
|
4935
|
+
[vars$r.fontFamily]: globalRefs$i.typography.subtitle2.font,
|
4867
4936
|
},
|
4868
4937
|
body1: {
|
4869
|
-
[vars$
|
4870
|
-
[vars$
|
4871
|
-
[vars$
|
4938
|
+
[vars$r.fontSize]: globalRefs$i.typography.body1.size,
|
4939
|
+
[vars$r.fontWeight]: globalRefs$i.typography.body1.weight,
|
4940
|
+
[vars$r.fontFamily]: globalRefs$i.typography.body1.font,
|
4872
4941
|
},
|
4873
4942
|
body2: {
|
4874
|
-
[vars$
|
4875
|
-
[vars$
|
4876
|
-
[vars$
|
4943
|
+
[vars$r.fontSize]: globalRefs$i.typography.body2.size,
|
4944
|
+
[vars$r.fontWeight]: globalRefs$i.typography.body2.weight,
|
4945
|
+
[vars$r.fontFamily]: globalRefs$i.typography.body2.font,
|
4877
4946
|
},
|
4878
4947
|
},
|
4879
4948
|
|
4880
4949
|
textAlign: {
|
4881
|
-
right: { [vars$
|
4882
|
-
left: { [vars$
|
4883
|
-
center: { [vars$
|
4950
|
+
right: { [vars$r.textAlign]: 'right' },
|
4951
|
+
left: { [vars$r.textAlign]: 'left' },
|
4952
|
+
center: { [vars$r.textAlign]: 'center' },
|
4884
4953
|
},
|
4885
4954
|
|
4886
4955
|
_fullWidth: {
|
4887
|
-
[vars$
|
4956
|
+
[vars$r.hostWidth]: '100%',
|
4888
4957
|
},
|
4889
4958
|
};
|
4890
4959
|
|
4891
4960
|
var EnrichedText$1 = /*#__PURE__*/Object.freeze({
|
4892
4961
|
__proto__: null,
|
4893
4962
|
default: EnrichedText,
|
4894
|
-
vars: vars$
|
4963
|
+
vars: vars$r
|
4895
4964
|
});
|
4896
4965
|
|
4897
4966
|
const globalRefs$h = getThemeRefs(globals);
|
4898
|
-
const vars$
|
4967
|
+
const vars$q = LinkClass.cssVarList;
|
4899
4968
|
|
4900
4969
|
const link = {
|
4901
|
-
[vars$
|
4902
|
-
[vars$
|
4970
|
+
[vars$q.hostDirection]: globalRefs$h.direction,
|
4971
|
+
[vars$q.cursor]: 'pointer',
|
4903
4972
|
|
4904
|
-
[vars$
|
4973
|
+
[vars$q.textColor]: globalRefs$h.colors.primary.main,
|
4905
4974
|
|
4906
4975
|
textAlign: {
|
4907
|
-
right: { [vars$
|
4908
|
-
left: { [vars$
|
4909
|
-
center: { [vars$
|
4976
|
+
right: { [vars$q.textAlign]: 'right' },
|
4977
|
+
left: { [vars$q.textAlign]: 'left' },
|
4978
|
+
center: { [vars$q.textAlign]: 'center' },
|
4910
4979
|
},
|
4911
4980
|
|
4912
4981
|
_fullWidth: {
|
4913
|
-
[vars$
|
4982
|
+
[vars$q.hostWidth]: '100%',
|
4914
4983
|
},
|
4915
4984
|
|
4916
4985
|
mode: {
|
4917
4986
|
primary: {
|
4918
|
-
[vars$
|
4987
|
+
[vars$q.textColor]: globalRefs$h.colors.primary.main,
|
4919
4988
|
},
|
4920
4989
|
secondary: {
|
4921
|
-
[vars$
|
4990
|
+
[vars$q.textColor]: globalRefs$h.colors.secondary.main,
|
4922
4991
|
},
|
4923
4992
|
error: {
|
4924
|
-
[vars$
|
4993
|
+
[vars$q.textColor]: globalRefs$h.colors.error.main,
|
4925
4994
|
},
|
4926
4995
|
success: {
|
4927
|
-
[vars$
|
4996
|
+
[vars$q.textColor]: globalRefs$h.colors.success.main,
|
4928
4997
|
},
|
4929
4998
|
},
|
4930
4999
|
};
|
@@ -4932,7 +5001,7 @@ const link = {
|
|
4932
5001
|
var link$1 = /*#__PURE__*/Object.freeze({
|
4933
5002
|
__proto__: null,
|
4934
5003
|
default: link,
|
4935
|
-
vars: vars$
|
5004
|
+
vars: vars$q
|
4936
5005
|
});
|
4937
5006
|
|
4938
5007
|
const componentName$x = getComponentName('divider');
|
@@ -5074,7 +5143,7 @@ const divider = {
|
|
5074
5143
|
},
|
5075
5144
|
};
|
5076
5145
|
|
5077
|
-
const vars$
|
5146
|
+
const vars$p = {
|
5078
5147
|
...compVars$3,
|
5079
5148
|
...helperVars$1,
|
5080
5149
|
};
|
@@ -5082,7 +5151,7 @@ const vars$o = {
|
|
5082
5151
|
var divider$1 = /*#__PURE__*/Object.freeze({
|
5083
5152
|
__proto__: null,
|
5084
5153
|
default: divider,
|
5085
|
-
vars: vars$
|
5154
|
+
vars: vars$p
|
5086
5155
|
});
|
5087
5156
|
|
5088
5157
|
/* eslint-disable no-param-reassign */
|
@@ -5317,45 +5386,45 @@ const PasscodeClass = compose(
|
|
5317
5386
|
})
|
5318
5387
|
);
|
5319
5388
|
|
5320
|
-
const vars$
|
5389
|
+
const vars$o = PasscodeClass.cssVarList;
|
5321
5390
|
|
5322
5391
|
const passcode = {
|
5323
|
-
[vars$
|
5324
|
-
[vars$
|
5325
|
-
[vars$
|
5326
|
-
[vars$
|
5327
|
-
[vars$
|
5328
|
-
[vars$
|
5329
|
-
[vars$
|
5330
|
-
[vars$
|
5331
|
-
[vars$
|
5332
|
-
[vars$
|
5333
|
-
[vars$
|
5334
|
-
[vars$
|
5335
|
-
[vars$
|
5336
|
-
[vars$
|
5337
|
-
[vars$
|
5392
|
+
[vars$o.hostDirection]: refs.direction,
|
5393
|
+
[vars$o.fontFamily]: refs.fontFamily,
|
5394
|
+
[vars$o.fontSize]: refs.fontSize,
|
5395
|
+
[vars$o.labelTextColor]: refs.labelTextColor,
|
5396
|
+
[vars$o.labelRequiredIndicator]: refs.requiredIndicator,
|
5397
|
+
[vars$o.errorMessageTextColor]: refs.errorMessageTextColor,
|
5398
|
+
[vars$o.digitValueTextColor]: refs.valueTextColor,
|
5399
|
+
[vars$o.digitPadding]: '0',
|
5400
|
+
[vars$o.digitTextAlign]: 'center',
|
5401
|
+
[vars$o.digitSpacing]: '4px',
|
5402
|
+
[vars$o.hostWidth]: refs.width,
|
5403
|
+
[vars$o.digitOutlineColor]: 'transparent',
|
5404
|
+
[vars$o.digitOutlineWidth]: refs.outlineWidth,
|
5405
|
+
[vars$o.focusedDigitFieldOutlineColor]: refs.outlineColor,
|
5406
|
+
[vars$o.digitSize]: refs.inputHeight,
|
5338
5407
|
|
5339
5408
|
size: {
|
5340
|
-
xs: { [vars$
|
5341
|
-
sm: { [vars$
|
5342
|
-
md: { [vars$
|
5343
|
-
lg: { [vars$
|
5409
|
+
xs: { [vars$o.spinnerSize]: '15px' },
|
5410
|
+
sm: { [vars$o.spinnerSize]: '20px' },
|
5411
|
+
md: { [vars$o.spinnerSize]: '20px' },
|
5412
|
+
lg: { [vars$o.spinnerSize]: '20px' },
|
5344
5413
|
},
|
5345
5414
|
|
5346
5415
|
_hideCursor: {
|
5347
|
-
[vars$
|
5416
|
+
[vars$o.digitCaretTextColor]: 'transparent',
|
5348
5417
|
},
|
5349
5418
|
|
5350
5419
|
_loading: {
|
5351
|
-
[vars$
|
5420
|
+
[vars$o.overlayOpacity]: refs.overlayOpacity,
|
5352
5421
|
},
|
5353
5422
|
};
|
5354
5423
|
|
5355
5424
|
var passcode$1 = /*#__PURE__*/Object.freeze({
|
5356
5425
|
__proto__: null,
|
5357
5426
|
default: passcode,
|
5358
|
-
vars: vars$
|
5427
|
+
vars: vars$o
|
5359
5428
|
});
|
5360
5429
|
|
5361
5430
|
const componentName$t = getComponentName('loader-linear');
|
@@ -5424,48 +5493,48 @@ const LoaderLinearClass = compose(
|
|
5424
5493
|
)(RawLoaderLinear);
|
5425
5494
|
|
5426
5495
|
const globalRefs$f = getThemeRefs(globals);
|
5427
|
-
const vars$
|
5496
|
+
const vars$n = LoaderLinearClass.cssVarList;
|
5428
5497
|
|
5429
5498
|
const loaderLinear = {
|
5430
|
-
[vars$
|
5431
|
-
[vars$
|
5499
|
+
[vars$n.hostDisplay]: 'inline-block',
|
5500
|
+
[vars$n.hostWidth]: '100%',
|
5432
5501
|
|
5433
|
-
[vars$
|
5434
|
-
[vars$
|
5502
|
+
[vars$n.barColor]: globalRefs$f.colors.surface.contrast,
|
5503
|
+
[vars$n.barWidth]: '20%',
|
5435
5504
|
|
5436
|
-
[vars$
|
5437
|
-
[vars$
|
5505
|
+
[vars$n.barBackgroundColor]: globalRefs$f.colors.surface.light,
|
5506
|
+
[vars$n.barBorderRadius]: '4px',
|
5438
5507
|
|
5439
|
-
[vars$
|
5440
|
-
[vars$
|
5441
|
-
[vars$
|
5442
|
-
[vars$
|
5508
|
+
[vars$n.animationDuration]: '2s',
|
5509
|
+
[vars$n.animationTimingFunction]: 'linear',
|
5510
|
+
[vars$n.animationIterationCount]: 'infinite',
|
5511
|
+
[vars$n.verticalPadding]: '0.25em',
|
5443
5512
|
|
5444
5513
|
size: {
|
5445
|
-
xs: { [vars$
|
5446
|
-
sm: { [vars$
|
5447
|
-
md: { [vars$
|
5448
|
-
lg: { [vars$
|
5514
|
+
xs: { [vars$n.barHeight]: '2px' },
|
5515
|
+
sm: { [vars$n.barHeight]: '4px' },
|
5516
|
+
md: { [vars$n.barHeight]: '6px' },
|
5517
|
+
lg: { [vars$n.barHeight]: '8px' },
|
5449
5518
|
},
|
5450
5519
|
|
5451
5520
|
mode: {
|
5452
5521
|
primary: {
|
5453
|
-
[vars$
|
5522
|
+
[vars$n.barColor]: globalRefs$f.colors.primary.main,
|
5454
5523
|
},
|
5455
5524
|
secondary: {
|
5456
|
-
[vars$
|
5525
|
+
[vars$n.barColor]: globalRefs$f.colors.secondary.main,
|
5457
5526
|
},
|
5458
5527
|
},
|
5459
5528
|
|
5460
5529
|
_hidden: {
|
5461
|
-
[vars$
|
5530
|
+
[vars$n.hostDisplay]: 'none',
|
5462
5531
|
},
|
5463
5532
|
};
|
5464
5533
|
|
5465
5534
|
var loaderLinear$1 = /*#__PURE__*/Object.freeze({
|
5466
5535
|
__proto__: null,
|
5467
5536
|
default: loaderLinear,
|
5468
|
-
vars: vars$
|
5537
|
+
vars: vars$n
|
5469
5538
|
});
|
5470
5539
|
|
5471
5540
|
const globalRefs$e = getThemeRefs(globals);
|
@@ -5512,7 +5581,7 @@ const loaderRadial = {
|
|
5512
5581
|
[compVars$2.hostDisplay]: 'none',
|
5513
5582
|
},
|
5514
5583
|
};
|
5515
|
-
const vars$
|
5584
|
+
const vars$m = {
|
5516
5585
|
...compVars$2,
|
5517
5586
|
...helperVars,
|
5518
5587
|
};
|
@@ -5520,7 +5589,7 @@ const vars$l = {
|
|
5520
5589
|
var loaderRadial$1 = /*#__PURE__*/Object.freeze({
|
5521
5590
|
__proto__: null,
|
5522
5591
|
default: loaderRadial,
|
5523
|
-
vars: vars$
|
5592
|
+
vars: vars$m
|
5524
5593
|
});
|
5525
5594
|
|
5526
5595
|
const componentName$s = getComponentName('combo-box');
|
@@ -5912,58 +5981,58 @@ const ComboBoxClass = compose(
|
|
5912
5981
|
);
|
5913
5982
|
|
5914
5983
|
const globalRefs$d = getThemeRefs(globals);
|
5915
|
-
const vars$
|
5984
|
+
const vars$l = ComboBoxClass.cssVarList;
|
5916
5985
|
|
5917
5986
|
const comboBox = {
|
5918
|
-
[vars$
|
5919
|
-
[vars$
|
5920
|
-
[vars$
|
5921
|
-
[vars$
|
5922
|
-
[vars$
|
5923
|
-
[vars$
|
5924
|
-
[vars$
|
5925
|
-
[vars$
|
5926
|
-
[vars$
|
5927
|
-
[vars$
|
5928
|
-
[vars$
|
5929
|
-
[vars$
|
5930
|
-
[vars$
|
5931
|
-
[vars$
|
5932
|
-
[vars$
|
5933
|
-
[vars$
|
5934
|
-
[vars$
|
5935
|
-
[vars$
|
5936
|
-
[vars$
|
5937
|
-
[vars$
|
5938
|
-
[vars$
|
5939
|
-
[vars$
|
5940
|
-
[vars$
|
5941
|
-
[vars$
|
5942
|
-
[vars$
|
5943
|
-
[vars$
|
5987
|
+
[vars$l.hostWidth]: refs.width,
|
5988
|
+
[vars$l.hostDirection]: refs.direction,
|
5989
|
+
[vars$l.fontSize]: refs.fontSize,
|
5990
|
+
[vars$l.fontFamily]: refs.fontFamily,
|
5991
|
+
[vars$l.labelTextColor]: refs.labelTextColor,
|
5992
|
+
[vars$l.errorMessageTextColor]: refs.errorMessageTextColor,
|
5993
|
+
[vars$l.inputBorderColor]: refs.borderColor,
|
5994
|
+
[vars$l.inputBorderWidth]: refs.borderWidth,
|
5995
|
+
[vars$l.inputBorderStyle]: refs.borderStyle,
|
5996
|
+
[vars$l.inputBorderRadius]: refs.borderRadius,
|
5997
|
+
[vars$l.inputOutlineColor]: refs.outlineColor,
|
5998
|
+
[vars$l.inputOutlineOffset]: refs.outlineOffset,
|
5999
|
+
[vars$l.inputOutlineWidth]: refs.outlineWidth,
|
6000
|
+
[vars$l.inputOutlineStyle]: refs.outlineStyle,
|
6001
|
+
[vars$l.labelRequiredIndicator]: refs.requiredIndicator,
|
6002
|
+
[vars$l.inputValueTextColor]: refs.valueTextColor,
|
6003
|
+
[vars$l.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
6004
|
+
[vars$l.inputBackgroundColor]: refs.backgroundColor,
|
6005
|
+
[vars$l.inputHorizontalPadding]: refs.horizontalPadding,
|
6006
|
+
[vars$l.inputHeight]: refs.inputHeight,
|
6007
|
+
[vars$l.inputDropdownButtonColor]: globalRefs$d.colors.surface.dark,
|
6008
|
+
[vars$l.inputDropdownButtonCursor]: 'pointer',
|
6009
|
+
[vars$l.inputDropdownButtonSize]: refs.toggleButtonSize,
|
6010
|
+
[vars$l.inputDropdownButtonOffset]: globalRefs$d.spacing.xs,
|
6011
|
+
[vars$l.overlayItemPaddingInlineStart]: globalRefs$d.spacing.xs,
|
6012
|
+
[vars$l.overlayItemPaddingInlineEnd]: globalRefs$d.spacing.lg,
|
5944
6013
|
|
5945
6014
|
_readonly: {
|
5946
|
-
[vars$
|
6015
|
+
[vars$l.inputDropdownButtonCursor]: 'default',
|
5947
6016
|
},
|
5948
6017
|
|
5949
6018
|
// Overlay theme exposed via the component:
|
5950
|
-
[vars$
|
5951
|
-
[vars$
|
5952
|
-
[vars$
|
5953
|
-
[vars$
|
5954
|
-
[vars$
|
5955
|
-
[vars$
|
6019
|
+
[vars$l.overlayFontSize]: refs.fontSize,
|
6020
|
+
[vars$l.overlayFontFamily]: refs.fontFamily,
|
6021
|
+
[vars$l.overlayCursor]: 'pointer',
|
6022
|
+
[vars$l.overlayItemBoxShadow]: 'none',
|
6023
|
+
[vars$l.overlayBackground]: refs.backgroundColor,
|
6024
|
+
[vars$l.overlayTextColor]: refs.valueTextColor,
|
5956
6025
|
|
5957
6026
|
// Overlay direct theme:
|
5958
|
-
[vars$
|
5959
|
-
[vars$
|
6027
|
+
[vars$l.overlay.minHeight]: '400px',
|
6028
|
+
[vars$l.overlay.margin]: '0',
|
5960
6029
|
};
|
5961
6030
|
|
5962
6031
|
var comboBox$1 = /*#__PURE__*/Object.freeze({
|
5963
6032
|
__proto__: null,
|
5964
6033
|
comboBox: comboBox,
|
5965
6034
|
default: comboBox,
|
5966
|
-
vars: vars$
|
6035
|
+
vars: vars$l
|
5967
6036
|
});
|
5968
6037
|
|
5969
6038
|
const observedAttributes$2 = ['src', 'alt'];
|
@@ -6010,14 +6079,14 @@ const ImageClass = compose(
|
|
6010
6079
|
draggableMixin
|
6011
6080
|
)(RawImage);
|
6012
6081
|
|
6013
|
-
const vars$
|
6082
|
+
const vars$k = ImageClass.cssVarList;
|
6014
6083
|
|
6015
6084
|
const image = {};
|
6016
6085
|
|
6017
6086
|
var image$1 = /*#__PURE__*/Object.freeze({
|
6018
6087
|
__proto__: null,
|
6019
6088
|
default: image,
|
6020
|
-
vars: vars$
|
6089
|
+
vars: vars$k
|
6021
6090
|
});
|
6022
6091
|
|
6023
6092
|
var CountryCodes = [
|
@@ -7465,29 +7534,29 @@ const PhoneFieldClass = compose(
|
|
7465
7534
|
})
|
7466
7535
|
);
|
7467
7536
|
|
7468
|
-
const vars$
|
7537
|
+
const vars$j = PhoneFieldClass.cssVarList;
|
7469
7538
|
|
7470
7539
|
const phoneField = {
|
7471
|
-
[vars$
|
7472
|
-
[vars$
|
7473
|
-
[vars$
|
7474
|
-
[vars$
|
7475
|
-
[vars$
|
7476
|
-
[vars$
|
7477
|
-
[vars$
|
7478
|
-
[vars$
|
7479
|
-
[vars$
|
7480
|
-
[vars$
|
7481
|
-
[vars$
|
7482
|
-
[vars$
|
7483
|
-
[vars$
|
7484
|
-
[vars$
|
7485
|
-
[vars$
|
7486
|
-
[vars$
|
7487
|
-
[vars$
|
7488
|
-
[vars$
|
7489
|
-
[vars$
|
7490
|
-
[vars$
|
7540
|
+
[vars$j.hostWidth]: refs.width,
|
7541
|
+
[vars$j.hostDirection]: refs.direction,
|
7542
|
+
[vars$j.fontSize]: refs.fontSize,
|
7543
|
+
[vars$j.fontFamily]: refs.fontFamily,
|
7544
|
+
[vars$j.labelTextColor]: refs.labelTextColor,
|
7545
|
+
[vars$j.labelRequiredIndicator]: refs.requiredIndicator,
|
7546
|
+
[vars$j.errorMessageTextColor]: refs.errorMessageTextColor,
|
7547
|
+
[vars$j.inputValueTextColor]: refs.valueTextColor,
|
7548
|
+
[vars$j.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
7549
|
+
[vars$j.inputBorderStyle]: refs.borderStyle,
|
7550
|
+
[vars$j.inputBorderWidth]: refs.borderWidth,
|
7551
|
+
[vars$j.inputBorderColor]: refs.borderColor,
|
7552
|
+
[vars$j.inputBorderRadius]: refs.borderRadius,
|
7553
|
+
[vars$j.inputOutlineStyle]: refs.outlineStyle,
|
7554
|
+
[vars$j.inputOutlineWidth]: refs.outlineWidth,
|
7555
|
+
[vars$j.inputOutlineColor]: refs.outlineColor,
|
7556
|
+
[vars$j.inputOutlineOffset]: refs.outlineOffset,
|
7557
|
+
[vars$j.phoneInputWidth]: refs.minWidth,
|
7558
|
+
[vars$j.countryCodeInputWidth]: '5em',
|
7559
|
+
[vars$j.countryCodeDropdownWidth]: '20em',
|
7491
7560
|
|
7492
7561
|
// '@overlay': {
|
7493
7562
|
// overlayItemBackgroundColor: 'red'
|
@@ -7497,7 +7566,7 @@ const phoneField = {
|
|
7497
7566
|
var phoneField$1 = /*#__PURE__*/Object.freeze({
|
7498
7567
|
__proto__: null,
|
7499
7568
|
default: phoneField,
|
7500
|
-
vars: vars$
|
7569
|
+
vars: vars$j
|
7501
7570
|
});
|
7502
7571
|
|
7503
7572
|
const componentName$o = getComponentName('phone-field-internal-input-box');
|
@@ -7665,36 +7734,36 @@ const PhoneFieldInputBoxClass = compose(
|
|
7665
7734
|
})
|
7666
7735
|
);
|
7667
7736
|
|
7668
|
-
const vars$
|
7737
|
+
const vars$i = PhoneFieldInputBoxClass.cssVarList;
|
7669
7738
|
|
7670
7739
|
const phoneInputBoxField = {
|
7671
|
-
[vars$
|
7672
|
-
[vars$
|
7673
|
-
[vars$
|
7674
|
-
[vars$
|
7675
|
-
[vars$
|
7676
|
-
[vars$
|
7677
|
-
[vars$
|
7678
|
-
[vars$
|
7679
|
-
[vars$
|
7680
|
-
[vars$
|
7681
|
-
[vars$
|
7682
|
-
[vars$
|
7683
|
-
[vars$
|
7684
|
-
[vars$
|
7685
|
-
[vars$
|
7686
|
-
[vars$
|
7687
|
-
[vars$
|
7688
|
-
[vars$
|
7740
|
+
[vars$i.hostWidth]: '16em',
|
7741
|
+
[vars$i.hostMinWidth]: refs.minWidth,
|
7742
|
+
[vars$i.hostDirection]: refs.direction,
|
7743
|
+
[vars$i.fontSize]: refs.fontSize,
|
7744
|
+
[vars$i.fontFamily]: refs.fontFamily,
|
7745
|
+
[vars$i.labelTextColor]: refs.labelTextColor,
|
7746
|
+
[vars$i.labelRequiredIndicator]: refs.requiredIndicator,
|
7747
|
+
[vars$i.errorMessageTextColor]: refs.errorMessageTextColor,
|
7748
|
+
[vars$i.inputValueTextColor]: refs.valueTextColor,
|
7749
|
+
[vars$i.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
7750
|
+
[vars$i.inputBorderStyle]: refs.borderStyle,
|
7751
|
+
[vars$i.inputBorderWidth]: refs.borderWidth,
|
7752
|
+
[vars$i.inputBorderColor]: refs.borderColor,
|
7753
|
+
[vars$i.inputBorderRadius]: refs.borderRadius,
|
7754
|
+
[vars$i.inputOutlineStyle]: refs.outlineStyle,
|
7755
|
+
[vars$i.inputOutlineWidth]: refs.outlineWidth,
|
7756
|
+
[vars$i.inputOutlineColor]: refs.outlineColor,
|
7757
|
+
[vars$i.inputOutlineOffset]: refs.outlineOffset,
|
7689
7758
|
_fullWidth: {
|
7690
|
-
[vars$
|
7759
|
+
[vars$i.hostWidth]: refs.width,
|
7691
7760
|
},
|
7692
7761
|
};
|
7693
7762
|
|
7694
7763
|
var phoneInputBoxField$1 = /*#__PURE__*/Object.freeze({
|
7695
7764
|
__proto__: null,
|
7696
7765
|
default: phoneInputBoxField,
|
7697
|
-
vars: vars$
|
7766
|
+
vars: vars$i
|
7698
7767
|
});
|
7699
7768
|
|
7700
7769
|
const componentName$m = getComponentName('new-password-internal');
|
@@ -8076,31 +8145,31 @@ const NewPasswordClass = compose(
|
|
8076
8145
|
);
|
8077
8146
|
|
8078
8147
|
const globalRefs$c = getThemeRefs(globals);
|
8079
|
-
const vars$
|
8148
|
+
const vars$h = NewPasswordClass.cssVarList;
|
8080
8149
|
|
8081
8150
|
const newPassword = {
|
8082
|
-
[vars$
|
8083
|
-
[vars$
|
8084
|
-
[vars$
|
8085
|
-
[vars$
|
8086
|
-
[vars$
|
8087
|
-
[vars$
|
8088
|
-
[vars$
|
8089
|
-
[vars$
|
8090
|
-
[vars$
|
8151
|
+
[vars$h.hostWidth]: refs.width,
|
8152
|
+
[vars$h.hostMinWidth]: refs.minWidth,
|
8153
|
+
[vars$h.hostDirection]: refs.direction,
|
8154
|
+
[vars$h.fontSize]: refs.fontSize,
|
8155
|
+
[vars$h.fontFamily]: refs.fontFamily,
|
8156
|
+
[vars$h.spaceBetweenInputs]: '1em',
|
8157
|
+
[vars$h.errorMessageTextColor]: refs.errorMessageTextColor,
|
8158
|
+
[vars$h.policyPreviewBackgroundColor]: 'none',
|
8159
|
+
[vars$h.policyPreviewPadding]: globalRefs$c.spacing.lg,
|
8091
8160
|
|
8092
8161
|
_required: {
|
8093
8162
|
// NewPassword doesn't pass `required` attribute to its Password components.
|
8094
8163
|
// That's why we fake the required indicator on each input.
|
8095
8164
|
// We do that by injecting `::after` element, and populating it with requiredIndicator content.
|
8096
|
-
[vars$
|
8165
|
+
[vars$h.inputsRequiredIndicator]: refs.requiredIndicator, // used to populate required content for NewPassword input fields outside the theme
|
8097
8166
|
},
|
8098
8167
|
};
|
8099
8168
|
|
8100
8169
|
var newPassword$1 = /*#__PURE__*/Object.freeze({
|
8101
8170
|
__proto__: null,
|
8102
8171
|
default: newPassword,
|
8103
|
-
vars: vars$
|
8172
|
+
vars: vars$h
|
8104
8173
|
});
|
8105
8174
|
|
8106
8175
|
const getFileBase64 = (fileObj) => {
|
@@ -8302,7 +8371,7 @@ class RawUploadFile extends BaseInputClass {
|
|
8302
8371
|
}
|
8303
8372
|
|
8304
8373
|
const buttonVars = ButtonClass.cssVarList;
|
8305
|
-
const { host: host$8, wrapper, icon, title, description, requiredIndicator: requiredIndicator$2 } = {
|
8374
|
+
const { host: host$8, wrapper, icon: icon$2, title, description, requiredIndicator: requiredIndicator$2 } = {
|
8306
8375
|
host: { selector: () => ':host' },
|
8307
8376
|
wrapper: { selector: () => ':host > div' },
|
8308
8377
|
icon: { selector: () => '::slotted(*)' },
|
@@ -8337,7 +8406,7 @@ const UploadFileClass = compose(
|
|
8337
8406
|
{ ...title, property: 'color' },
|
8338
8407
|
{ ...description, property: 'color' },
|
8339
8408
|
],
|
8340
|
-
iconSize: { ...icon, property: 'width' },
|
8409
|
+
iconSize: { ...icon$2, property: 'width' },
|
8341
8410
|
requiredIndicator: { ...requiredIndicator$2, property: 'content' },
|
8342
8411
|
},
|
8343
8412
|
}),
|
@@ -8345,71 +8414,71 @@ const UploadFileClass = compose(
|
|
8345
8414
|
componentNameValidationMixin
|
8346
8415
|
)(RawUploadFile);
|
8347
8416
|
|
8348
|
-
const vars$
|
8417
|
+
const vars$g = UploadFileClass.cssVarList;
|
8349
8418
|
|
8350
8419
|
const uploadFile = {
|
8351
|
-
[vars$
|
8352
|
-
[vars$
|
8353
|
-
[vars$
|
8420
|
+
[vars$g.hostDirection]: refs.direction,
|
8421
|
+
[vars$g.labelTextColor]: refs.labelTextColor,
|
8422
|
+
[vars$g.fontFamily]: refs.fontFamily,
|
8354
8423
|
|
8355
|
-
[vars$
|
8424
|
+
[vars$g.iconSize]: '2em',
|
8356
8425
|
|
8357
|
-
[vars$
|
8358
|
-
[vars$
|
8426
|
+
[vars$g.hostPadding]: '0.75em',
|
8427
|
+
[vars$g.gap]: '0.5em',
|
8359
8428
|
|
8360
|
-
[vars$
|
8361
|
-
[vars$
|
8362
|
-
[vars$
|
8429
|
+
[vars$g.fontSize]: '16px',
|
8430
|
+
[vars$g.titleFontWeight]: '500',
|
8431
|
+
[vars$g.lineHeight]: '1em',
|
8363
8432
|
|
8364
|
-
[vars$
|
8365
|
-
[vars$
|
8366
|
-
[vars$
|
8367
|
-
[vars$
|
8433
|
+
[vars$g.borderWidth]: refs.borderWidth,
|
8434
|
+
[vars$g.borderColor]: refs.borderColor,
|
8435
|
+
[vars$g.borderRadius]: refs.borderRadius,
|
8436
|
+
[vars$g.borderStyle]: 'dashed',
|
8368
8437
|
|
8369
8438
|
_required: {
|
8370
|
-
[vars$
|
8439
|
+
[vars$g.requiredIndicator]: refs.requiredIndicator,
|
8371
8440
|
},
|
8372
8441
|
|
8373
8442
|
size: {
|
8374
8443
|
xs: {
|
8375
|
-
[vars$
|
8376
|
-
[vars$
|
8377
|
-
[vars$
|
8378
|
-
[vars$
|
8379
|
-
[vars$
|
8444
|
+
[vars$g.hostHeight]: '196px',
|
8445
|
+
[vars$g.hostWidth]: '200px',
|
8446
|
+
[vars$g.titleFontSize]: '0.875em',
|
8447
|
+
[vars$g.descriptionFontSize]: '0.875em',
|
8448
|
+
[vars$g.lineHeight]: '1.25em',
|
8380
8449
|
},
|
8381
8450
|
sm: {
|
8382
|
-
[vars$
|
8383
|
-
[vars$
|
8384
|
-
[vars$
|
8385
|
-
[vars$
|
8386
|
-
[vars$
|
8451
|
+
[vars$g.hostHeight]: '216px',
|
8452
|
+
[vars$g.hostWidth]: '230px',
|
8453
|
+
[vars$g.titleFontSize]: '1em',
|
8454
|
+
[vars$g.descriptionFontSize]: '0.875em',
|
8455
|
+
[vars$g.lineHeight]: '1.25em',
|
8387
8456
|
},
|
8388
8457
|
md: {
|
8389
|
-
[vars$
|
8390
|
-
[vars$
|
8391
|
-
[vars$
|
8392
|
-
[vars$
|
8393
|
-
[vars$
|
8458
|
+
[vars$g.hostHeight]: '256px',
|
8459
|
+
[vars$g.hostWidth]: '312px',
|
8460
|
+
[vars$g.titleFontSize]: '1.125em',
|
8461
|
+
[vars$g.descriptionFontSize]: '1em',
|
8462
|
+
[vars$g.lineHeight]: '1.5em',
|
8394
8463
|
},
|
8395
8464
|
lg: {
|
8396
|
-
[vars$
|
8397
|
-
[vars$
|
8398
|
-
[vars$
|
8399
|
-
[vars$
|
8400
|
-
[vars$
|
8465
|
+
[vars$g.hostHeight]: '280px',
|
8466
|
+
[vars$g.hostWidth]: '336px',
|
8467
|
+
[vars$g.titleFontSize]: '1.125em',
|
8468
|
+
[vars$g.descriptionFontSize]: '1.125em',
|
8469
|
+
[vars$g.lineHeight]: '1.75em',
|
8401
8470
|
},
|
8402
8471
|
},
|
8403
8472
|
|
8404
8473
|
_fullWidth: {
|
8405
|
-
[vars$
|
8474
|
+
[vars$g.hostWidth]: refs.width,
|
8406
8475
|
},
|
8407
8476
|
};
|
8408
8477
|
|
8409
8478
|
var uploadFile$1 = /*#__PURE__*/Object.freeze({
|
8410
8479
|
__proto__: null,
|
8411
8480
|
default: uploadFile,
|
8412
|
-
vars: vars$
|
8481
|
+
vars: vars$g
|
8413
8482
|
});
|
8414
8483
|
|
8415
8484
|
const componentName$i = getComponentName('button-selection-group-item');
|
@@ -8524,37 +8593,37 @@ const ButtonSelectionGroupItemClass = compose(
|
|
8524
8593
|
|
8525
8594
|
const globalRefs$b = getThemeRefs(globals);
|
8526
8595
|
|
8527
|
-
const vars$
|
8596
|
+
const vars$f = ButtonSelectionGroupItemClass.cssVarList;
|
8528
8597
|
|
8529
8598
|
const buttonSelectionGroupItem = {
|
8530
|
-
[vars$
|
8531
|
-
[vars$
|
8532
|
-
[vars$
|
8533
|
-
[vars$
|
8534
|
-
[vars$
|
8535
|
-
[vars$
|
8536
|
-
[vars$
|
8537
|
-
[vars$
|
8599
|
+
[vars$f.hostDirection]: 'inherit',
|
8600
|
+
[vars$f.backgroundColor]: globalRefs$b.colors.surface.main,
|
8601
|
+
[vars$f.labelTextColor]: globalRefs$b.colors.surface.contrast,
|
8602
|
+
[vars$f.borderColor]: globalRefs$b.colors.surface.light,
|
8603
|
+
[vars$f.borderStyle]: 'solid',
|
8604
|
+
[vars$f.borderRadius]: globalRefs$b.radius.sm,
|
8605
|
+
[vars$f.outlineColor]: 'transparent',
|
8606
|
+
[vars$f.borderWidth]: globalRefs$b.border.xs,
|
8538
8607
|
|
8539
8608
|
_hover: {
|
8540
|
-
[vars$
|
8609
|
+
[vars$f.backgroundColor]: globalRefs$b.colors.surface.highlight,
|
8541
8610
|
},
|
8542
8611
|
|
8543
8612
|
_focused: {
|
8544
|
-
[vars$
|
8613
|
+
[vars$f.outlineColor]: globalRefs$b.colors.surface.light,
|
8545
8614
|
},
|
8546
8615
|
|
8547
8616
|
_selected: {
|
8548
|
-
[vars$
|
8549
|
-
[vars$
|
8550
|
-
[vars$
|
8617
|
+
[vars$f.borderColor]: globalRefs$b.colors.surface.contrast,
|
8618
|
+
[vars$f.backgroundColor]: globalRefs$b.colors.surface.contrast,
|
8619
|
+
[vars$f.labelTextColor]: globalRefs$b.colors.surface.main,
|
8551
8620
|
},
|
8552
8621
|
};
|
8553
8622
|
|
8554
8623
|
var buttonSelectionGroupItem$1 = /*#__PURE__*/Object.freeze({
|
8555
8624
|
__proto__: null,
|
8556
8625
|
default: buttonSelectionGroupItem,
|
8557
|
-
vars: vars$
|
8626
|
+
vars: vars$f
|
8558
8627
|
});
|
8559
8628
|
|
8560
8629
|
const createBaseButtonSelectionGroupInternalClass = (componentName) => {
|
@@ -8950,16 +9019,16 @@ const createBaseButtonSelectionGroupMappings = (vars) => ({
|
|
8950
9019
|
[vars.hostWidth]: refs.width,
|
8951
9020
|
});
|
8952
9021
|
|
8953
|
-
const vars$
|
9022
|
+
const vars$e = ButtonSelectionGroupClass.cssVarList;
|
8954
9023
|
|
8955
9024
|
const buttonSelectionGroup = {
|
8956
|
-
...createBaseButtonSelectionGroupMappings(vars$
|
9025
|
+
...createBaseButtonSelectionGroupMappings(vars$e),
|
8957
9026
|
};
|
8958
9027
|
|
8959
9028
|
var buttonSelectionGroup$1 = /*#__PURE__*/Object.freeze({
|
8960
9029
|
__proto__: null,
|
8961
9030
|
default: buttonSelectionGroup,
|
8962
|
-
vars: vars$
|
9031
|
+
vars: vars$e
|
8963
9032
|
});
|
8964
9033
|
|
8965
9034
|
const componentName$f = getComponentName('button-multi-selection-group-internal');
|
@@ -9118,16 +9187,16 @@ const ButtonMultiSelectionGroupClass = compose(
|
|
9118
9187
|
})
|
9119
9188
|
);
|
9120
9189
|
|
9121
|
-
const vars$
|
9190
|
+
const vars$d = ButtonMultiSelectionGroupClass.cssVarList;
|
9122
9191
|
|
9123
9192
|
const buttonMultiSelectionGroup = {
|
9124
|
-
...createBaseButtonSelectionGroupMappings(vars$
|
9193
|
+
...createBaseButtonSelectionGroupMappings(vars$d),
|
9125
9194
|
};
|
9126
9195
|
|
9127
9196
|
var buttonMultiSelectionGroup$1 = /*#__PURE__*/Object.freeze({
|
9128
9197
|
__proto__: null,
|
9129
9198
|
default: buttonMultiSelectionGroup,
|
9130
|
-
vars: vars$
|
9199
|
+
vars: vars$d
|
9131
9200
|
});
|
9132
9201
|
|
9133
9202
|
const componentName$d = getComponentName('modal');
|
@@ -9243,14 +9312,14 @@ const modal = {
|
|
9243
9312
|
[compVars$1.overlayWidth]: '540px',
|
9244
9313
|
};
|
9245
9314
|
|
9246
|
-
const vars$
|
9315
|
+
const vars$c = {
|
9247
9316
|
...compVars$1,
|
9248
9317
|
};
|
9249
9318
|
|
9250
9319
|
var modal$1 = /*#__PURE__*/Object.freeze({
|
9251
9320
|
__proto__: null,
|
9252
9321
|
default: modal,
|
9253
|
-
vars: vars$
|
9322
|
+
vars: vars$c
|
9254
9323
|
});
|
9255
9324
|
|
9256
9325
|
const isValidDataType = (data) => {
|
@@ -9504,35 +9573,35 @@ const GridClass = compose(
|
|
9504
9573
|
);
|
9505
9574
|
|
9506
9575
|
const globalRefs$8 = getThemeRefs(globals);
|
9507
|
-
const vars$
|
9576
|
+
const vars$b = GridClass.cssVarList;
|
9508
9577
|
|
9509
9578
|
const grid = {
|
9510
|
-
[vars$
|
9511
|
-
[vars$
|
9512
|
-
[vars$
|
9513
|
-
[vars$
|
9514
|
-
[vars$
|
9579
|
+
[vars$b.hostWidth]: '100%',
|
9580
|
+
[vars$b.hostHeight]: '100%',
|
9581
|
+
[vars$b.hostMinHeight]: '400px',
|
9582
|
+
[vars$b.fontWeight]: '400',
|
9583
|
+
[vars$b.backgroundColor]: globalRefs$8.colors.surface.main,
|
9515
9584
|
|
9516
|
-
[vars$
|
9517
|
-
[vars$
|
9585
|
+
[vars$b.fontSize]: refs.fontSize,
|
9586
|
+
[vars$b.fontFamily]: refs.fontFamily,
|
9518
9587
|
|
9519
|
-
[vars$
|
9520
|
-
[vars$
|
9521
|
-
[vars$
|
9588
|
+
[vars$b.sortIndicatorsColor]: globalRefs$8.colors.surface.light,
|
9589
|
+
[vars$b.activeSortIndicator]: globalRefs$8.colors.surface.dark,
|
9590
|
+
[vars$b.resizeHandleColor]: globalRefs$8.colors.surface.light,
|
9522
9591
|
|
9523
|
-
[vars$
|
9524
|
-
[vars$
|
9525
|
-
[vars$
|
9526
|
-
[vars$
|
9592
|
+
[vars$b.borderWidth]: refs.borderWidth,
|
9593
|
+
[vars$b.borderStyle]: refs.borderStyle,
|
9594
|
+
[vars$b.borderRadius]: refs.borderRadius,
|
9595
|
+
[vars$b.borderColor]: 'transparent',
|
9527
9596
|
|
9528
|
-
[vars$
|
9529
|
-
[vars$
|
9597
|
+
[vars$b.headerRowTextColor]: globalRefs$8.colors.surface.dark,
|
9598
|
+
[vars$b.separatorColor]: globalRefs$8.colors.surface.light,
|
9530
9599
|
|
9531
|
-
[vars$
|
9532
|
-
[vars$
|
9600
|
+
[vars$b.valueTextColor]: globalRefs$8.colors.surface.contrast,
|
9601
|
+
[vars$b.selectedBackgroundColor]: globalRefs$8.colors.surface.highlight,
|
9533
9602
|
|
9534
9603
|
_bordered: {
|
9535
|
-
[vars$
|
9604
|
+
[vars$b.borderColor]: refs.borderColor,
|
9536
9605
|
},
|
9537
9606
|
};
|
9538
9607
|
|
@@ -9540,7 +9609,7 @@ var grid$1 = /*#__PURE__*/Object.freeze({
|
|
9540
9609
|
__proto__: null,
|
9541
9610
|
default: grid,
|
9542
9611
|
grid: grid,
|
9543
|
-
vars: vars$
|
9612
|
+
vars: vars$b
|
9544
9613
|
});
|
9545
9614
|
|
9546
9615
|
const componentName$b = getComponentName('notification-card');
|
@@ -9656,49 +9725,49 @@ const NotificationCardClass = compose(
|
|
9656
9725
|
);
|
9657
9726
|
|
9658
9727
|
const globalRefs$7 = getThemeRefs(globals);
|
9659
|
-
const vars$
|
9728
|
+
const vars$a = NotificationCardClass.cssVarList;
|
9660
9729
|
|
9661
9730
|
const shadowColor = '#00000020';
|
9662
9731
|
|
9663
9732
|
const notification = {
|
9664
|
-
[vars$
|
9665
|
-
[vars$
|
9666
|
-
[vars$
|
9667
|
-
[vars$
|
9668
|
-
[vars$
|
9669
|
-
[vars$
|
9670
|
-
[vars$
|
9671
|
-
[vars$
|
9672
|
-
[vars$
|
9733
|
+
[vars$a.hostMinWidth]: '415px',
|
9734
|
+
[vars$a.fontFamily]: globalRefs$7.fonts.font1.family,
|
9735
|
+
[vars$a.fontSize]: globalRefs$7.typography.body1.size,
|
9736
|
+
[vars$a.backgroundColor]: globalRefs$7.colors.surface.main,
|
9737
|
+
[vars$a.textColor]: globalRefs$7.colors.surface.contrast,
|
9738
|
+
[vars$a.boxShadow]: `${globalRefs$7.shadow.wide.xl} ${shadowColor}, ${globalRefs$7.shadow.narrow.xl} ${shadowColor}`,
|
9739
|
+
[vars$a.verticalPadding]: '0.625em',
|
9740
|
+
[vars$a.horizontalPadding]: '1.5em',
|
9741
|
+
[vars$a.borderRadius]: globalRefs$7.radius.xs,
|
9673
9742
|
|
9674
9743
|
_bordered: {
|
9675
|
-
[vars$
|
9676
|
-
[vars$
|
9677
|
-
[vars$
|
9744
|
+
[vars$a.borderWidth]: globalRefs$7.border.sm,
|
9745
|
+
[vars$a.borderStyle]: 'solid',
|
9746
|
+
[vars$a.borderColor]: 'transparent',
|
9678
9747
|
},
|
9679
9748
|
|
9680
9749
|
size: {
|
9681
|
-
xs: { [vars$
|
9682
|
-
sm: { [vars$
|
9683
|
-
md: { [vars$
|
9684
|
-
lg: { [vars$
|
9750
|
+
xs: { [vars$a.fontSize]: '12px' },
|
9751
|
+
sm: { [vars$a.fontSize]: '14px' },
|
9752
|
+
md: { [vars$a.fontSize]: '16px' },
|
9753
|
+
lg: { [vars$a.fontSize]: '18px' },
|
9685
9754
|
},
|
9686
9755
|
|
9687
9756
|
mode: {
|
9688
9757
|
primary: {
|
9689
|
-
[vars$
|
9690
|
-
[vars$
|
9691
|
-
[vars$
|
9758
|
+
[vars$a.backgroundColor]: globalRefs$7.colors.primary.main,
|
9759
|
+
[vars$a.textColor]: globalRefs$7.colors.primary.contrast,
|
9760
|
+
[vars$a.borderColor]: globalRefs$7.colors.primary.light,
|
9692
9761
|
},
|
9693
9762
|
success: {
|
9694
|
-
[vars$
|
9695
|
-
[vars$
|
9696
|
-
[vars$
|
9763
|
+
[vars$a.backgroundColor]: globalRefs$7.colors.success.main,
|
9764
|
+
[vars$a.textColor]: globalRefs$7.colors.success.contrast,
|
9765
|
+
[vars$a.borderColor]: globalRefs$7.colors.success.light,
|
9697
9766
|
},
|
9698
9767
|
error: {
|
9699
|
-
[vars$
|
9700
|
-
[vars$
|
9701
|
-
[vars$
|
9768
|
+
[vars$a.backgroundColor]: globalRefs$7.colors.error.main,
|
9769
|
+
[vars$a.textColor]: globalRefs$7.colors.error.contrast,
|
9770
|
+
[vars$a.borderColor]: globalRefs$7.colors.error.light,
|
9702
9771
|
},
|
9703
9772
|
},
|
9704
9773
|
};
|
@@ -9706,7 +9775,7 @@ const notification = {
|
|
9706
9775
|
var notificationCard = /*#__PURE__*/Object.freeze({
|
9707
9776
|
__proto__: null,
|
9708
9777
|
default: notification,
|
9709
|
-
vars: vars$
|
9778
|
+
vars: vars$a
|
9710
9779
|
});
|
9711
9780
|
|
9712
9781
|
const componentName$a = getComponentName('multi-select-combo-box');
|
@@ -10319,62 +10388,62 @@ const MultiSelectComboBoxClass = compose(
|
|
10319
10388
|
);
|
10320
10389
|
|
10321
10390
|
const globalRefs$6 = getThemeRefs(globals);
|
10322
|
-
const vars$
|
10391
|
+
const vars$9 = MultiSelectComboBoxClass.cssVarList;
|
10323
10392
|
|
10324
10393
|
const multiSelectComboBox = {
|
10325
|
-
[vars$
|
10326
|
-
[vars$
|
10327
|
-
[vars$
|
10328
|
-
[vars$
|
10329
|
-
[vars$
|
10330
|
-
[vars$
|
10331
|
-
[vars$
|
10332
|
-
[vars$
|
10333
|
-
[vars$
|
10334
|
-
[vars$
|
10335
|
-
[vars$
|
10336
|
-
[vars$
|
10337
|
-
[vars$
|
10338
|
-
[vars$
|
10339
|
-
[vars$
|
10340
|
-
[vars$
|
10341
|
-
[vars$
|
10342
|
-
[vars$
|
10343
|
-
[vars$
|
10344
|
-
[vars$
|
10345
|
-
[vars$
|
10346
|
-
[vars$
|
10347
|
-
[vars$
|
10348
|
-
[vars$
|
10349
|
-
[vars$
|
10350
|
-
[vars$
|
10351
|
-
[vars$
|
10352
|
-
[vars$
|
10353
|
-
[vars$
|
10354
|
-
[vars$
|
10394
|
+
[vars$9.hostWidth]: refs.width,
|
10395
|
+
[vars$9.hostDirection]: refs.direction,
|
10396
|
+
[vars$9.fontSize]: refs.fontSize,
|
10397
|
+
[vars$9.fontFamily]: refs.fontFamily,
|
10398
|
+
[vars$9.labelTextColor]: refs.labelTextColor,
|
10399
|
+
[vars$9.errorMessageTextColor]: refs.errorMessageTextColor,
|
10400
|
+
[vars$9.inputBorderColor]: refs.borderColor,
|
10401
|
+
[vars$9.inputBorderWidth]: refs.borderWidth,
|
10402
|
+
[vars$9.inputBorderStyle]: refs.borderStyle,
|
10403
|
+
[vars$9.inputBorderRadius]: refs.borderRadius,
|
10404
|
+
[vars$9.inputOutlineColor]: refs.outlineColor,
|
10405
|
+
[vars$9.inputOutlineOffset]: refs.outlineOffset,
|
10406
|
+
[vars$9.inputOutlineWidth]: refs.outlineWidth,
|
10407
|
+
[vars$9.inputOutlineStyle]: refs.outlineStyle,
|
10408
|
+
[vars$9.labelRequiredIndicator]: refs.requiredIndicator,
|
10409
|
+
[vars$9.inputValueTextColor]: refs.valueTextColor,
|
10410
|
+
[vars$9.inputPlaceholderTextColor]: refs.placeholderTextColor,
|
10411
|
+
[vars$9.inputBackgroundColor]: refs.backgroundColor,
|
10412
|
+
[vars$9.inputHorizontalPadding]: refs.horizontalPadding,
|
10413
|
+
[vars$9.inputVerticalPadding]: refs.verticalPadding,
|
10414
|
+
[vars$9.inputHeight]: refs.inputHeight,
|
10415
|
+
[vars$9.inputDropdownButtonColor]: globalRefs$6.colors.surface.dark,
|
10416
|
+
[vars$9.inputDropdownButtonCursor]: 'pointer',
|
10417
|
+
[vars$9.inputDropdownButtonSize]: refs.toggleButtonSize,
|
10418
|
+
[vars$9.inputDropdownButtonOffset]: globalRefs$6.spacing.xs,
|
10419
|
+
[vars$9.overlayItemPaddingInlineStart]: globalRefs$6.spacing.xs,
|
10420
|
+
[vars$9.overlayItemPaddingInlineEnd]: globalRefs$6.spacing.lg,
|
10421
|
+
[vars$9.chipFontSize]: refs.chipFontSize,
|
10422
|
+
[vars$9.chipTextColor]: globalRefs$6.colors.surface.contrast,
|
10423
|
+
[vars$9.chipBackgroundColor]: globalRefs$6.colors.surface.light,
|
10355
10424
|
|
10356
10425
|
_readonly: {
|
10357
|
-
[vars$
|
10426
|
+
[vars$9.inputDropdownButtonCursor]: 'default',
|
10358
10427
|
},
|
10359
10428
|
|
10360
10429
|
// Overlay theme exposed via the component:
|
10361
|
-
[vars$
|
10362
|
-
[vars$
|
10363
|
-
[vars$
|
10364
|
-
[vars$
|
10365
|
-
[vars$
|
10366
|
-
[vars$
|
10430
|
+
[vars$9.overlayFontSize]: refs.fontSize,
|
10431
|
+
[vars$9.overlayFontFamily]: refs.fontFamily,
|
10432
|
+
[vars$9.overlayCursor]: 'pointer',
|
10433
|
+
[vars$9.overlayItemBoxShadow]: 'none',
|
10434
|
+
[vars$9.overlayBackground]: refs.backgroundColor,
|
10435
|
+
[vars$9.overlayTextColor]: refs.valueTextColor,
|
10367
10436
|
|
10368
10437
|
// Overlay direct theme:
|
10369
|
-
[vars$
|
10370
|
-
[vars$
|
10438
|
+
[vars$9.overlay.minHeight]: '400px',
|
10439
|
+
[vars$9.overlay.margin]: '0',
|
10371
10440
|
};
|
10372
10441
|
|
10373
10442
|
var multiSelectComboBox$1 = /*#__PURE__*/Object.freeze({
|
10374
10443
|
__proto__: null,
|
10375
10444
|
default: multiSelectComboBox,
|
10376
10445
|
multiSelectComboBox: multiSelectComboBox,
|
10377
|
-
vars: vars$
|
10446
|
+
vars: vars$9
|
10378
10447
|
});
|
10379
10448
|
|
10380
10449
|
const componentName$9 = getComponentName('badge');
|
@@ -10431,65 +10500,65 @@ const BadgeClass = compose(
|
|
10431
10500
|
)(RawBadge);
|
10432
10501
|
|
10433
10502
|
const globalRefs$5 = getThemeRefs(globals);
|
10434
|
-
const vars$
|
10503
|
+
const vars$8 = BadgeClass.cssVarList;
|
10435
10504
|
|
10436
10505
|
const badge$2 = {
|
10437
|
-
[vars$
|
10438
|
-
[vars$
|
10506
|
+
[vars$8.hostWidth]: 'fit-content',
|
10507
|
+
[vars$8.hostDirection]: globalRefs$5.direction,
|
10439
10508
|
|
10440
|
-
[vars$
|
10509
|
+
[vars$8.textAlign]: 'center',
|
10441
10510
|
|
10442
|
-
[vars$
|
10443
|
-
[vars$
|
10511
|
+
[vars$8.fontFamily]: globalRefs$5.fonts.font1.family,
|
10512
|
+
[vars$8.fontWeight]: '400',
|
10444
10513
|
|
10445
|
-
[vars$
|
10446
|
-
[vars$
|
10514
|
+
[vars$8.verticalPadding]: '0.25em',
|
10515
|
+
[vars$8.horizontalPadding]: '0.5em',
|
10447
10516
|
|
10448
|
-
[vars$
|
10449
|
-
[vars$
|
10450
|
-
[vars$
|
10451
|
-
[vars$
|
10517
|
+
[vars$8.borderWidth]: globalRefs$5.border.xs,
|
10518
|
+
[vars$8.borderRadius]: globalRefs$5.radius.xs,
|
10519
|
+
[vars$8.borderColor]: 'transparent',
|
10520
|
+
[vars$8.borderStyle]: 'solid',
|
10452
10521
|
|
10453
10522
|
_fullWidth: {
|
10454
|
-
[vars$
|
10523
|
+
[vars$8.hostWidth]: '100%',
|
10455
10524
|
},
|
10456
10525
|
|
10457
10526
|
size: {
|
10458
|
-
xs: { [vars$
|
10459
|
-
sm: { [vars$
|
10460
|
-
md: { [vars$
|
10461
|
-
lg: { [vars$
|
10527
|
+
xs: { [vars$8.fontSize]: '12px' },
|
10528
|
+
sm: { [vars$8.fontSize]: '14px' },
|
10529
|
+
md: { [vars$8.fontSize]: '16px' },
|
10530
|
+
lg: { [vars$8.fontSize]: '18px' },
|
10462
10531
|
},
|
10463
10532
|
|
10464
10533
|
mode: {
|
10465
10534
|
default: {
|
10466
|
-
[vars$
|
10535
|
+
[vars$8.textColor]: globalRefs$5.colors.surface.dark,
|
10467
10536
|
_bordered: {
|
10468
|
-
[vars$
|
10537
|
+
[vars$8.borderColor]: globalRefs$5.colors.surface.light,
|
10469
10538
|
},
|
10470
10539
|
},
|
10471
10540
|
primary: {
|
10472
|
-
[vars$
|
10541
|
+
[vars$8.textColor]: globalRefs$5.colors.primary.main,
|
10473
10542
|
_bordered: {
|
10474
|
-
[vars$
|
10543
|
+
[vars$8.borderColor]: globalRefs$5.colors.primary.light,
|
10475
10544
|
},
|
10476
10545
|
},
|
10477
10546
|
secondary: {
|
10478
|
-
[vars$
|
10547
|
+
[vars$8.textColor]: globalRefs$5.colors.secondary.main,
|
10479
10548
|
_bordered: {
|
10480
|
-
[vars$
|
10549
|
+
[vars$8.borderColor]: globalRefs$5.colors.secondary.light,
|
10481
10550
|
},
|
10482
10551
|
},
|
10483
10552
|
error: {
|
10484
|
-
[vars$
|
10553
|
+
[vars$8.textColor]: globalRefs$5.colors.error.main,
|
10485
10554
|
_bordered: {
|
10486
|
-
[vars$
|
10555
|
+
[vars$8.borderColor]: globalRefs$5.colors.error.light,
|
10487
10556
|
},
|
10488
10557
|
},
|
10489
10558
|
success: {
|
10490
|
-
[vars$
|
10559
|
+
[vars$8.textColor]: globalRefs$5.colors.success.main,
|
10491
10560
|
_bordered: {
|
10492
|
-
[vars$
|
10561
|
+
[vars$8.borderColor]: globalRefs$5.colors.success.light,
|
10493
10562
|
},
|
10494
10563
|
},
|
10495
10564
|
},
|
@@ -10498,7 +10567,7 @@ const badge$2 = {
|
|
10498
10567
|
var badge$3 = /*#__PURE__*/Object.freeze({
|
10499
10568
|
__proto__: null,
|
10500
10569
|
default: badge$2,
|
10501
|
-
vars: vars$
|
10570
|
+
vars: vars$8
|
10502
10571
|
});
|
10503
10572
|
|
10504
10573
|
const componentName$8 = getComponentName('avatar');
|
@@ -10636,14 +10705,14 @@ const avatar = {
|
|
10636
10705
|
},
|
10637
10706
|
};
|
10638
10707
|
|
10639
|
-
const vars$
|
10708
|
+
const vars$7 = {
|
10640
10709
|
...compVars,
|
10641
10710
|
};
|
10642
10711
|
|
10643
10712
|
var avatar$1 = /*#__PURE__*/Object.freeze({
|
10644
10713
|
__proto__: null,
|
10645
10714
|
default: avatar,
|
10646
|
-
vars: vars$
|
10715
|
+
vars: vars$7
|
10647
10716
|
});
|
10648
10717
|
|
10649
10718
|
const componentName$7 = getComponentName('mappings-field-internal');
|
@@ -10821,32 +10890,32 @@ const MappingsFieldClass = compose(
|
|
10821
10890
|
|
10822
10891
|
const globalRefs$3 = getThemeRefs(globals);
|
10823
10892
|
|
10824
|
-
const vars$
|
10893
|
+
const vars$6 = MappingsFieldClass.cssVarList;
|
10825
10894
|
|
10826
10895
|
const mappingsField = {
|
10827
|
-
[vars$
|
10828
|
-
[vars$
|
10829
|
-
[vars$
|
10830
|
-
[vars$
|
10831
|
-
[vars$
|
10832
|
-
[vars$
|
10833
|
-
[vars$
|
10834
|
-
[vars$
|
10835
|
-
[vars$
|
10836
|
-
[vars$
|
10896
|
+
[vars$6.hostWidth]: refs.width,
|
10897
|
+
[vars$6.hostDirection]: refs.direction,
|
10898
|
+
[vars$6.fontSize]: refs.fontSize,
|
10899
|
+
[vars$6.fontFamily]: refs.fontFamily,
|
10900
|
+
[vars$6.separatorFontSize]: '14px',
|
10901
|
+
[vars$6.labelsFontSize]: '14px',
|
10902
|
+
[vars$6.labelsLineHeight]: '1',
|
10903
|
+
[vars$6.labelsMarginBottom]: '6px',
|
10904
|
+
[vars$6.labelTextColor]: refs.labelTextColor,
|
10905
|
+
[vars$6.itemMarginBottom]: '1em',
|
10837
10906
|
// To be positioned correctly, the min width has to match the text field min width
|
10838
|
-
[vars$
|
10907
|
+
[vars$6.valueLabelMinWidth]: refs.minWidth,
|
10839
10908
|
// To be positioned correctly, the min width has to match the combo box field min width
|
10840
|
-
[vars$
|
10841
|
-
[vars$
|
10842
|
-
[vars$
|
10909
|
+
[vars$6.attrLabelMinWidth]: `calc(12em + 2 * ${globalRefs$3.border.xs})`,
|
10910
|
+
[vars$6.separatorWidth]: '70px',
|
10911
|
+
[vars$6.removeButtonWidth]: '60px',
|
10843
10912
|
};
|
10844
10913
|
|
10845
10914
|
var mappingsField$1 = /*#__PURE__*/Object.freeze({
|
10846
10915
|
__proto__: null,
|
10847
10916
|
default: mappingsField,
|
10848
10917
|
mappingsField: mappingsField,
|
10849
|
-
vars: vars$
|
10918
|
+
vars: vars$6
|
10850
10919
|
});
|
10851
10920
|
|
10852
10921
|
var deleteIcon = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iMTgiIHZpZXdCb3g9IjAgMCAxNCAxOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEgMTZDMSAxNy4xIDEuOSAxOCAzIDE4SDExQzEyLjEgMTggMTMgMTcuMSAxMyAxNlY0SDFWMTZaTTMgNkgxMVYxNkgzVjZaTTEwLjUgMUw5LjUgMEg0LjVMMy41IDFIMFYzSDE0VjFIMTAuNVoiIGZpbGw9ImN1cnJlbnRjb2xvciIvPgo8L3N2Zz4K";
|
@@ -11086,24 +11155,24 @@ const UserAttributeClass = compose(
|
|
11086
11155
|
)(RawUserAttribute);
|
11087
11156
|
|
11088
11157
|
const globalRefs$2 = getThemeRefs(globals);
|
11089
|
-
const vars$
|
11158
|
+
const vars$5 = UserAttributeClass.cssVarList;
|
11090
11159
|
|
11091
11160
|
const userAttribute = {
|
11092
|
-
[vars$
|
11093
|
-
[vars$
|
11094
|
-
[vars$
|
11095
|
-
[vars$
|
11096
|
-
[vars$
|
11097
|
-
[vars$
|
11161
|
+
[vars$5.hostDirection]: globalRefs$2.direction,
|
11162
|
+
[vars$5.labelTextWidth]: '150px',
|
11163
|
+
[vars$5.valueTextWidth]: '200px',
|
11164
|
+
[vars$5.badgeMaxWidth]: '85px',
|
11165
|
+
[vars$5.itemsGap]: '16px',
|
11166
|
+
[vars$5.hostMinWidth]: '530px',
|
11098
11167
|
_fullWidth: {
|
11099
|
-
[vars$
|
11168
|
+
[vars$5.hostWidth]: '100%',
|
11100
11169
|
},
|
11101
11170
|
};
|
11102
11171
|
|
11103
11172
|
var userAttribute$1 = /*#__PURE__*/Object.freeze({
|
11104
11173
|
__proto__: null,
|
11105
11174
|
default: userAttribute,
|
11106
|
-
vars: vars$
|
11175
|
+
vars: vars$5
|
11107
11176
|
});
|
11108
11177
|
|
11109
11178
|
var greenVIcon = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTggMEMzLjYgMCAwIDMuNiAwIDhDMCAxMi40IDMuNiAxNiA4IDE2QzEyLjQgMTYgMTYgMTIuNCAxNiA4QzE2IDMuNiAxMi40IDAgOCAwWk03LjEgMTEuN0wyLjkgNy42TDQuMyA2LjJMNyA4LjlMMTIgNEwxMy40IDUuNEw3LjEgMTEuN1oiIGZpbGw9IiM0Q0FGNTAiLz4KPC9zdmc+Cg==";
|
@@ -11303,23 +11372,23 @@ const UserAuthMethodClass = compose(
|
|
11303
11372
|
)(RawUserAuthMethod);
|
11304
11373
|
|
11305
11374
|
const globalRefs$1 = getThemeRefs(globals);
|
11306
|
-
const vars$
|
11375
|
+
const vars$4 = UserAuthMethodClass.cssVarList;
|
11307
11376
|
|
11308
11377
|
const userAuthMethod = {
|
11309
|
-
[vars$
|
11310
|
-
[vars$
|
11311
|
-
[vars$
|
11312
|
-
[vars$
|
11313
|
-
[vars$
|
11378
|
+
[vars$4.hostDirection]: globalRefs$1.direction,
|
11379
|
+
[vars$4.labelTextWidth]: '200px',
|
11380
|
+
[vars$4.itemsGap]: '16px',
|
11381
|
+
[vars$4.hostMinWidth]: '530px',
|
11382
|
+
[vars$4.iconSize]: '24px',
|
11314
11383
|
_fullWidth: {
|
11315
|
-
[vars$
|
11384
|
+
[vars$4.hostWidth]: '100%',
|
11316
11385
|
},
|
11317
11386
|
};
|
11318
11387
|
|
11319
11388
|
var userAuthMethod$1 = /*#__PURE__*/Object.freeze({
|
11320
11389
|
__proto__: null,
|
11321
11390
|
default: userAuthMethod,
|
11322
|
-
vars: vars$
|
11391
|
+
vars: vars$4
|
11323
11392
|
});
|
11324
11393
|
|
11325
11394
|
const componentName$3 = getComponentName('saml-group-mappings-internal');
|
@@ -11424,46 +11493,56 @@ const SamlGroupMappingsClass = compose(
|
|
11424
11493
|
})
|
11425
11494
|
);
|
11426
11495
|
|
11427
|
-
const vars$
|
11496
|
+
const vars$3 = SamlGroupMappingsClass.cssVarList;
|
11428
11497
|
|
11429
11498
|
const samlGroupMappings = {
|
11430
|
-
[vars$
|
11431
|
-
[vars$
|
11432
|
-
[vars$
|
11499
|
+
[vars$3.hostWidth]: refs.width,
|
11500
|
+
[vars$3.hostDirection]: refs.direction,
|
11501
|
+
[vars$3.groupNameInputMarginBottom]: '1em',
|
11433
11502
|
};
|
11434
11503
|
|
11435
11504
|
var samlGroupMappings$1 = /*#__PURE__*/Object.freeze({
|
11436
11505
|
__proto__: null,
|
11437
11506
|
default: samlGroupMappings,
|
11438
11507
|
samlGroupMappings: samlGroupMappings,
|
11439
|
-
vars: vars$
|
11508
|
+
vars: vars$3
|
11440
11509
|
});
|
11441
11510
|
|
11442
11511
|
const globalRefs = getThemeRefs(globals);
|
11443
|
-
const vars$
|
11512
|
+
const vars$2 = PolicyValidationClass.cssVarList;
|
11444
11513
|
|
11445
11514
|
const policyValidation = {
|
11446
|
-
[vars$
|
11447
|
-
[vars$
|
11448
|
-
[vars$
|
11449
|
-
[vars$
|
11450
|
-
[vars$
|
11451
|
-
[vars$
|
11452
|
-
[vars$
|
11453
|
-
[vars$
|
11454
|
-
[vars$
|
11455
|
-
[vars$
|
11456
|
-
[vars$
|
11457
|
-
[vars$
|
11458
|
-
[vars$
|
11459
|
-
[vars$
|
11460
|
-
[vars$
|
11461
|
-
[vars$
|
11515
|
+
[vars$2.fontFamily]: refs.fontFamily,
|
11516
|
+
[vars$2.fontSize]: refs.labelFontSize,
|
11517
|
+
[vars$2.textColor]: refs.labelTextColor,
|
11518
|
+
[vars$2.borderWidth]: refs.borderWidth,
|
11519
|
+
[vars$2.borderStyle]: refs.borderStyle,
|
11520
|
+
[vars$2.borderColor]: refs.borderColor,
|
11521
|
+
[vars$2.borderRadius]: globalRefs.radius.sm,
|
11522
|
+
[vars$2.backgroundColor]: 'none',
|
11523
|
+
[vars$2.padding]: '0px',
|
11524
|
+
[vars$2.labelMargin]: globalRefs.spacing.sm,
|
11525
|
+
[vars$2.itemsSpacing]: globalRefs.spacing.lg,
|
11526
|
+
[vars$2.itemSymbolDefault]: "'\\2022'", // "•"
|
11527
|
+
[vars$2.itemSymbolSuccess]: "'\\2713'", // "✓"
|
11528
|
+
[vars$2.itemSymbolError]: "'\\2A09'", // "⨉"
|
11529
|
+
[vars$2.itemSymbolSuccessColor]: globalRefs.colors.success.main,
|
11530
|
+
[vars$2.itemSymbolErrorColor]: globalRefs.colors.error.main,
|
11462
11531
|
};
|
11463
11532
|
|
11464
11533
|
var policyValidation$1 = /*#__PURE__*/Object.freeze({
|
11465
11534
|
__proto__: null,
|
11466
11535
|
default: policyValidation,
|
11536
|
+
vars: vars$2
|
11537
|
+
});
|
11538
|
+
|
11539
|
+
const vars$1 = IconClass.cssVarList;
|
11540
|
+
|
11541
|
+
const icon = {};
|
11542
|
+
|
11543
|
+
var icon$1 = /*#__PURE__*/Object.freeze({
|
11544
|
+
__proto__: null,
|
11545
|
+
default: icon,
|
11467
11546
|
vars: vars$1
|
11468
11547
|
});
|
11469
11548
|
|
@@ -11508,6 +11587,7 @@ const components = {
|
|
11508
11587
|
userAuthMethod: userAuthMethod$1,
|
11509
11588
|
samlGroupMappings: samlGroupMappings$1,
|
11510
11589
|
policyValidation: policyValidation$1,
|
11590
|
+
icon: icon$1,
|
11511
11591
|
};
|
11512
11592
|
|
11513
11593
|
const theme = Object.keys(components).reduce(
|
@@ -11520,7 +11600,7 @@ const vars = Object.keys(components).reduce(
|
|
11520
11600
|
);
|
11521
11601
|
|
11522
11602
|
const defaultTheme = { globals, components: theme };
|
11523
|
-
const themeVars = { globals: vars$
|
11603
|
+
const themeVars = { globals: vars$G, components: vars };
|
11524
11604
|
|
11525
11605
|
const colors = {
|
11526
11606
|
surface: {
|