@descope/web-components-ui 1.0.161 → 1.0.162
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 +121 -117
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/index.esm.js +121 -117
- package/dist/index.esm.js.map +1 -1
- package/package.json +1 -1
- package/src/theme/components/loader/loaderRadial.js +22 -19
package/dist/index.esm.js
CHANGED
@@ -5934,7 +5934,7 @@ const globals = {
|
|
5934
5934
|
const vars$o = getThemeVars(globals);
|
5935
5935
|
|
5936
5936
|
const globalRefs$b = getThemeRefs(globals);
|
5937
|
-
const compVars$
|
5937
|
+
const compVars$3 = ButtonClass.cssVarList;
|
5938
5938
|
|
5939
5939
|
const mode = {
|
5940
5940
|
primary: globalRefs$b.colors.primary,
|
@@ -5944,7 +5944,7 @@ const mode = {
|
|
5944
5944
|
surface: globalRefs$b.colors.surface,
|
5945
5945
|
};
|
5946
5946
|
|
5947
|
-
const [helperTheme$3, helperRefs$3, helperVars$
|
5947
|
+
const [helperTheme$3, helperRefs$3, helperVars$3] = createHelperVars({ mode }, componentName$r);
|
5948
5948
|
|
5949
5949
|
const verticalPaddingRatio = 3;
|
5950
5950
|
const horizontalPaddingRatio = 2;
|
@@ -5952,88 +5952,88 @@ const horizontalPaddingRatio = 2;
|
|
5952
5952
|
const button = {
|
5953
5953
|
...helperTheme$3,
|
5954
5954
|
|
5955
|
-
[compVars$
|
5955
|
+
[compVars$3.fontFamily]: globalRefs$b.fonts.font1.family,
|
5956
5956
|
|
5957
|
-
[compVars$
|
5958
|
-
[compVars$
|
5957
|
+
[compVars$3.cursor]: 'pointer',
|
5958
|
+
[compVars$3.hostHeight]: '3em',
|
5959
5959
|
|
5960
|
-
[compVars$
|
5961
|
-
[compVars$
|
5962
|
-
[compVars$
|
5963
|
-
[compVars$
|
5960
|
+
[compVars$3.borderRadius]: globalRefs$b.radius.sm,
|
5961
|
+
[compVars$3.borderWidth]: globalRefs$b.border.xs,
|
5962
|
+
[compVars$3.borderStyle]: 'solid',
|
5963
|
+
[compVars$3.borderColor]: 'transparent',
|
5964
5964
|
|
5965
|
-
[compVars$
|
5965
|
+
[compVars$3.labelSpacing]: '0.25em',
|
5966
5966
|
|
5967
|
-
[compVars$
|
5968
|
-
[compVars$
|
5967
|
+
[compVars$3.verticalPadding]: `calc(var(${compVars$3.fontSize}) / ${verticalPaddingRatio})`,
|
5968
|
+
[compVars$3.horizontalPadding]: `calc(var(${compVars$3.fontSize}) / ${horizontalPaddingRatio})`,
|
5969
5969
|
|
5970
|
-
[compVars$
|
5971
|
-
[compVars$
|
5972
|
-
[compVars$
|
5973
|
-
[compVars$
|
5970
|
+
[compVars$3.outlineWidth]: globals.border.sm,
|
5971
|
+
[compVars$3.outlineOffset]: '0px', // keep `px` unit for external calc
|
5972
|
+
[compVars$3.outlineStyle]: 'solid',
|
5973
|
+
[compVars$3.outlineColor]: 'transparent',
|
5974
5974
|
|
5975
5975
|
size: {
|
5976
|
-
xs: { [compVars$
|
5977
|
-
sm: { [compVars$
|
5978
|
-
md: { [compVars$
|
5979
|
-
lg: { [compVars$
|
5976
|
+
xs: { [compVars$3.fontSize]: '12px' },
|
5977
|
+
sm: { [compVars$3.fontSize]: '14px' },
|
5978
|
+
md: { [compVars$3.fontSize]: '16px' },
|
5979
|
+
lg: { [compVars$3.fontSize]: '18px' },
|
5980
5980
|
},
|
5981
5981
|
|
5982
5982
|
_fullWidth: {
|
5983
|
-
[compVars$
|
5983
|
+
[compVars$3.hostWidth]: '100%',
|
5984
5984
|
},
|
5985
5985
|
|
5986
5986
|
_loading: {
|
5987
|
-
[compVars$
|
5988
|
-
[compVars$
|
5987
|
+
[compVars$3.cursor]: 'wait',
|
5988
|
+
[compVars$3.labelTextColor]: helperRefs$3.main,
|
5989
5989
|
},
|
5990
5990
|
|
5991
5991
|
variant: {
|
5992
5992
|
contained: {
|
5993
|
-
[compVars$
|
5994
|
-
[compVars$
|
5993
|
+
[compVars$3.labelTextColor]: helperRefs$3.contrast,
|
5994
|
+
[compVars$3.backgroundColor]: helperRefs$3.main,
|
5995
5995
|
_hover: {
|
5996
|
-
[compVars$
|
5996
|
+
[compVars$3.backgroundColor]: helperRefs$3.dark,
|
5997
5997
|
_loading: {
|
5998
|
-
[compVars$
|
5998
|
+
[compVars$3.backgroundColor]: helperRefs$3.main,
|
5999
5999
|
},
|
6000
6000
|
},
|
6001
6001
|
_active: {
|
6002
|
-
[compVars$
|
6002
|
+
[compVars$3.backgroundColor]: helperRefs$3.main,
|
6003
6003
|
},
|
6004
6004
|
},
|
6005
6005
|
|
6006
6006
|
outline: {
|
6007
|
-
[compVars$
|
6008
|
-
[compVars$
|
6007
|
+
[compVars$3.labelTextColor]: helperRefs$3.main,
|
6008
|
+
[compVars$3.borderColor]: 'currentColor',
|
6009
6009
|
_hover: {
|
6010
|
-
[compVars$
|
6010
|
+
[compVars$3.labelTextColor]: helperRefs$3.dark,
|
6011
6011
|
},
|
6012
6012
|
_active: {
|
6013
|
-
[compVars$
|
6013
|
+
[compVars$3.labelTextColor]: helperRefs$3.main,
|
6014
6014
|
},
|
6015
6015
|
},
|
6016
6016
|
|
6017
6017
|
link: {
|
6018
|
-
[compVars$
|
6018
|
+
[compVars$3.labelTextColor]: helperRefs$3.main,
|
6019
6019
|
_hover: {
|
6020
|
-
[compVars$
|
6021
|
-
[compVars$
|
6020
|
+
[compVars$3.labelTextColor]: helperRefs$3.dark,
|
6021
|
+
[compVars$3.labelTextDecoration]: 'underline',
|
6022
6022
|
},
|
6023
6023
|
_active: {
|
6024
|
-
[compVars$
|
6024
|
+
[compVars$3.labelTextColor]: helperRefs$3.dark,
|
6025
6025
|
},
|
6026
6026
|
},
|
6027
6027
|
},
|
6028
6028
|
|
6029
6029
|
_focused: {
|
6030
|
-
[compVars$
|
6030
|
+
[compVars$3.outlineColor]: globalRefs$b.colors.surface.main,
|
6031
6031
|
},
|
6032
6032
|
};
|
6033
6033
|
|
6034
6034
|
const vars$n = {
|
6035
|
-
...compVars$
|
6036
|
-
...helperVars$
|
6035
|
+
...compVars$3,
|
6036
|
+
...helperVars$3,
|
6037
6037
|
};
|
6038
6038
|
|
6039
6039
|
var button$1 = /*#__PURE__*/Object.freeze({
|
@@ -6394,7 +6394,7 @@ var switchToggle$1 = /*#__PURE__*/Object.freeze({
|
|
6394
6394
|
|
6395
6395
|
const globalRefs$6 = getThemeRefs(globals);
|
6396
6396
|
|
6397
|
-
const compVars$
|
6397
|
+
const compVars$2 = ContainerClass.cssVarList;
|
6398
6398
|
|
6399
6399
|
const verticalAlignment = {
|
6400
6400
|
start: { verticalAlignment: 'start' },
|
@@ -6408,7 +6408,7 @@ const horizontalAlignment = {
|
|
6408
6408
|
end: { horizontalAlignment: 'end' },
|
6409
6409
|
};
|
6410
6410
|
|
6411
|
-
const [helperTheme$2, helperRefs$2, helperVars$
|
6411
|
+
const [helperTheme$2, helperRefs$2, helperVars$2] = createHelperVars(
|
6412
6412
|
{
|
6413
6413
|
verticalAlignment,
|
6414
6414
|
horizontalAlignment,
|
@@ -6422,85 +6422,85 @@ const { shadowColor } = helperRefs$2;
|
|
6422
6422
|
const container = {
|
6423
6423
|
...helperTheme$2,
|
6424
6424
|
|
6425
|
-
[compVars$
|
6426
|
-
[compVars$
|
6427
|
-
[compVars$
|
6428
|
-
[compVars$
|
6425
|
+
[compVars$2.hostWidth]: '100%',
|
6426
|
+
[compVars$2.boxShadow]: 'none',
|
6427
|
+
[compVars$2.backgroundColor]: globalRefs$6.colors.surface.light,
|
6428
|
+
[compVars$2.color]: globalRefs$6.colors.surface.contrast,
|
6429
6429
|
|
6430
6430
|
verticalPadding: {
|
6431
|
-
sm: { [compVars$
|
6432
|
-
md: { [compVars$
|
6433
|
-
lg: { [compVars$
|
6431
|
+
sm: { [compVars$2.verticalPadding]: '5px' },
|
6432
|
+
md: { [compVars$2.verticalPadding]: '10px' },
|
6433
|
+
lg: { [compVars$2.verticalPadding]: '20px' },
|
6434
6434
|
},
|
6435
6435
|
|
6436
6436
|
horizontalPadding: {
|
6437
|
-
sm: { [compVars$
|
6438
|
-
md: { [compVars$
|
6439
|
-
lg: { [compVars$
|
6437
|
+
sm: { [compVars$2.horizontalPadding]: '5px' },
|
6438
|
+
md: { [compVars$2.horizontalPadding]: '10px' },
|
6439
|
+
lg: { [compVars$2.horizontalPadding]: '20px' },
|
6440
6440
|
},
|
6441
6441
|
|
6442
6442
|
direction: {
|
6443
6443
|
row: {
|
6444
|
-
[compVars$
|
6445
|
-
[compVars$
|
6446
|
-
[compVars$
|
6447
|
-
[compVars$
|
6444
|
+
[compVars$2.flexDirection]: 'row',
|
6445
|
+
[compVars$2.alignItems]: helperRefs$2.verticalAlignment,
|
6446
|
+
[compVars$2.justifyContent]: helperRefs$2.horizontalAlignment,
|
6447
|
+
[compVars$2.flexWrap]: 'wrap',
|
6448
6448
|
horizontalAlignment: {
|
6449
6449
|
spaceBetween: {
|
6450
|
-
[helperVars$
|
6450
|
+
[helperVars$2.horizontalAlignment]: 'space-between',
|
6451
6451
|
},
|
6452
6452
|
},
|
6453
6453
|
},
|
6454
6454
|
column: {
|
6455
|
-
[compVars$
|
6456
|
-
[compVars$
|
6457
|
-
[compVars$
|
6455
|
+
[compVars$2.flexDirection]: 'column',
|
6456
|
+
[compVars$2.alignItems]: helperRefs$2.horizontalAlignment,
|
6457
|
+
[compVars$2.justifyContent]: helperRefs$2.verticalAlignment,
|
6458
6458
|
verticalAlignment: {
|
6459
6459
|
spaceBetween: {
|
6460
|
-
[helperVars$
|
6460
|
+
[helperVars$2.verticalAlignment]: 'space-between',
|
6461
6461
|
},
|
6462
6462
|
},
|
6463
6463
|
},
|
6464
6464
|
},
|
6465
6465
|
|
6466
6466
|
spaceBetween: {
|
6467
|
-
sm: { [compVars$
|
6468
|
-
md: { [compVars$
|
6469
|
-
lg: { [compVars$
|
6467
|
+
sm: { [compVars$2.gap]: '10px' },
|
6468
|
+
md: { [compVars$2.gap]: '20px' },
|
6469
|
+
lg: { [compVars$2.gap]: '30px' },
|
6470
6470
|
},
|
6471
6471
|
|
6472
6472
|
shadow: {
|
6473
6473
|
sm: {
|
6474
|
-
[compVars$
|
6474
|
+
[compVars$2.boxShadow]: `${globalRefs$6.shadow.wide.sm} ${shadowColor}, ${globalRefs$6.shadow.narrow.sm} ${shadowColor}`,
|
6475
6475
|
},
|
6476
6476
|
md: {
|
6477
|
-
[compVars$
|
6477
|
+
[compVars$2.boxShadow]: `${globalRefs$6.shadow.wide.md} ${shadowColor}, ${globalRefs$6.shadow.narrow.md} ${shadowColor}`,
|
6478
6478
|
},
|
6479
6479
|
lg: {
|
6480
|
-
[compVars$
|
6480
|
+
[compVars$2.boxShadow]: `${globalRefs$6.shadow.wide.lg} ${shadowColor}, ${globalRefs$6.shadow.narrow.lg} ${shadowColor}`,
|
6481
6481
|
},
|
6482
6482
|
xl: {
|
6483
|
-
[compVars$
|
6483
|
+
[compVars$2.boxShadow]: `${globalRefs$6.shadow.wide.xl} ${shadowColor}, ${globalRefs$6.shadow.narrow.xl} ${shadowColor}`,
|
6484
6484
|
},
|
6485
6485
|
'2xl': {
|
6486
|
-
[helperVars$
|
6487
|
-
[compVars$
|
6486
|
+
[helperVars$2.shadowColor]: '#00000050', // mimic daisyUI shadow settings
|
6487
|
+
[compVars$2.boxShadow]: `${globalRefs$6.shadow.wide['2xl']} ${shadowColor}`,
|
6488
6488
|
},
|
6489
6489
|
},
|
6490
6490
|
|
6491
6491
|
borderRadius: {
|
6492
|
-
sm: { [compVars$
|
6493
|
-
md: { [compVars$
|
6494
|
-
lg: { [compVars$
|
6495
|
-
xl: { [compVars$
|
6496
|
-
'2xl': { [compVars$
|
6497
|
-
'3xl': { [compVars$
|
6492
|
+
sm: { [compVars$2.borderRadius]: globalRefs$6.radius.sm },
|
6493
|
+
md: { [compVars$2.borderRadius]: globalRefs$6.radius.md },
|
6494
|
+
lg: { [compVars$2.borderRadius]: globalRefs$6.radius.lg },
|
6495
|
+
xl: { [compVars$2.borderRadius]: globalRefs$6.radius.xl },
|
6496
|
+
'2xl': { [compVars$2.borderRadius]: globalRefs$6.radius['2xl'] },
|
6497
|
+
'3xl': { [compVars$2.borderRadius]: globalRefs$6.radius['3xl'] },
|
6498
6498
|
},
|
6499
6499
|
};
|
6500
6500
|
|
6501
6501
|
const vars$e = {
|
6502
|
-
...compVars$
|
6503
|
-
...helperVars$
|
6502
|
+
...compVars$2,
|
6503
|
+
...helperVars$2,
|
6504
6504
|
};
|
6505
6505
|
|
6506
6506
|
var container$1 = /*#__PURE__*/Object.freeze({
|
@@ -6663,9 +6663,9 @@ var link$1 = /*#__PURE__*/Object.freeze({
|
|
6663
6663
|
});
|
6664
6664
|
|
6665
6665
|
const globalRefs$3 = getThemeRefs(globals);
|
6666
|
-
const compVars = DividerClass.cssVarList;
|
6666
|
+
const compVars$1 = DividerClass.cssVarList;
|
6667
6667
|
|
6668
|
-
const [helperTheme$1, helperRefs$1, helperVars] = createHelperVars(
|
6668
|
+
const [helperTheme$1, helperRefs$1, helperVars$1] = createHelperVars(
|
6669
6669
|
{
|
6670
6670
|
thickness: '2px',
|
6671
6671
|
spacing: '10px',
|
@@ -6676,32 +6676,32 @@ const [helperTheme$1, helperRefs$1, helperVars] = createHelperVars(
|
|
6676
6676
|
const divider = {
|
6677
6677
|
...helperTheme$1,
|
6678
6678
|
|
6679
|
-
[compVars.alignItems]: 'center',
|
6680
|
-
[compVars.flexDirection]: 'row',
|
6681
|
-
[compVars.alignSelf]: 'stretch',
|
6682
|
-
[compVars.hostWidth]: '100%',
|
6683
|
-
[compVars.stripeColor]: globalRefs$3.colors.surface.main,
|
6684
|
-
[compVars.stripeColorOpacity]: '0.5',
|
6685
|
-
[compVars.stripeHorizontalThickness]: helperRefs$1.thickness,
|
6686
|
-
[compVars.labelTextWidth]: 'fit-content',
|
6687
|
-
[compVars.labelTextMaxWidth]: 'calc(100% - 100px)',
|
6688
|
-
[compVars.labelTextHorizontalSpacing]: helperRefs$1.spacing,
|
6679
|
+
[compVars$1.alignItems]: 'center',
|
6680
|
+
[compVars$1.flexDirection]: 'row',
|
6681
|
+
[compVars$1.alignSelf]: 'stretch',
|
6682
|
+
[compVars$1.hostWidth]: '100%',
|
6683
|
+
[compVars$1.stripeColor]: globalRefs$3.colors.surface.main,
|
6684
|
+
[compVars$1.stripeColorOpacity]: '0.5',
|
6685
|
+
[compVars$1.stripeHorizontalThickness]: helperRefs$1.thickness,
|
6686
|
+
[compVars$1.labelTextWidth]: 'fit-content',
|
6687
|
+
[compVars$1.labelTextMaxWidth]: 'calc(100% - 100px)',
|
6688
|
+
[compVars$1.labelTextHorizontalSpacing]: helperRefs$1.spacing,
|
6689
6689
|
|
6690
6690
|
_vertical: {
|
6691
|
-
[compVars.minHeight]: '200px',
|
6692
|
-
[compVars.flexDirection]: 'column',
|
6693
|
-
[compVars.hostWidth]: 'fit-content',
|
6694
|
-
[compVars.hostPadding]: `0 calc(${helperRefs$1.thickness} * 3)`,
|
6695
|
-
[compVars.stripeVerticalThickness]: helperRefs$1.thickness,
|
6696
|
-
[compVars.labelTextWidth]: 'fit-content',
|
6697
|
-
[compVars.labelTextMaxWidth]: '100%',
|
6698
|
-
[compVars.labelTextVerticalSpacing]: helperRefs$1.spacing,
|
6691
|
+
[compVars$1.minHeight]: '200px',
|
6692
|
+
[compVars$1.flexDirection]: 'column',
|
6693
|
+
[compVars$1.hostWidth]: 'fit-content',
|
6694
|
+
[compVars$1.hostPadding]: `0 calc(${helperRefs$1.thickness} * 3)`,
|
6695
|
+
[compVars$1.stripeVerticalThickness]: helperRefs$1.thickness,
|
6696
|
+
[compVars$1.labelTextWidth]: 'fit-content',
|
6697
|
+
[compVars$1.labelTextMaxWidth]: '100%',
|
6698
|
+
[compVars$1.labelTextVerticalSpacing]: helperRefs$1.spacing,
|
6699
6699
|
},
|
6700
6700
|
};
|
6701
6701
|
|
6702
6702
|
const vars$9 = {
|
6703
|
-
...compVars,
|
6704
|
-
...helperVars,
|
6703
|
+
...compVars$1,
|
6704
|
+
...helperVars$1,
|
6705
6705
|
};
|
6706
6706
|
|
6707
6707
|
var divider$1 = /*#__PURE__*/Object.freeze({
|
@@ -6785,9 +6785,9 @@ var loaderLinear$1 = /*#__PURE__*/Object.freeze({
|
|
6785
6785
|
});
|
6786
6786
|
|
6787
6787
|
const globalRefs$1 = getThemeRefs(globals);
|
6788
|
-
const
|
6788
|
+
const compVars = LoaderRadialClass.cssVarList;
|
6789
6789
|
|
6790
|
-
const [helperTheme, helperRefs] = createHelperVars(
|
6790
|
+
const [helperTheme, helperRefs, helperVars] = createHelperVars(
|
6791
6791
|
{
|
6792
6792
|
spinnerColor: globalRefs$1.colors.surface.contrast,
|
6793
6793
|
mode: {
|
@@ -6805,29 +6805,33 @@ const [helperTheme, helperRefs] = createHelperVars(
|
|
6805
6805
|
const loaderRadial = {
|
6806
6806
|
...helperTheme,
|
6807
6807
|
|
6808
|
-
[
|
6809
|
-
[
|
6810
|
-
[
|
6811
|
-
[
|
6812
|
-
[
|
6813
|
-
[
|
6814
|
-
[
|
6815
|
-
[
|
6816
|
-
[
|
6817
|
-
[
|
6808
|
+
[compVars.animationDuration]: '2s',
|
6809
|
+
[compVars.animationTimingFunction]: 'linear',
|
6810
|
+
[compVars.animationIterationCount]: 'infinite',
|
6811
|
+
[compVars.spinnerBorderStyle]: 'solid',
|
6812
|
+
[compVars.spinnerBorderWidth]: '0.2em',
|
6813
|
+
[compVars.spinnerBorderRadius]: '50%',
|
6814
|
+
[compVars.spinnerQuadrant1Color]: helperRefs.spinnerColor,
|
6815
|
+
[compVars.spinnerQuadrant2Color]: 'transparent',
|
6816
|
+
[compVars.spinnerQuadrant3Color]: helperRefs.spinnerColor,
|
6817
|
+
[compVars.spinnerQuadrant4Color]: 'transparent',
|
6818
6818
|
|
6819
6819
|
size: {
|
6820
|
-
xs: { [
|
6821
|
-
sm: { [
|
6822
|
-
md: { [
|
6823
|
-
lg: { [
|
6824
|
-
xl: { [
|
6820
|
+
xs: { [compVars.spinnerSize]: '20px' },
|
6821
|
+
sm: { [compVars.spinnerSize]: '30px' },
|
6822
|
+
md: { [compVars.spinnerSize]: '40px' },
|
6823
|
+
lg: { [compVars.spinnerSize]: '60px' },
|
6824
|
+
xl: { [compVars.spinnerSize]: '80px' },
|
6825
6825
|
},
|
6826
6826
|
|
6827
6827
|
_hidden: {
|
6828
|
-
[
|
6828
|
+
[compVars.hostDisplay]: 'none',
|
6829
6829
|
},
|
6830
6830
|
};
|
6831
|
+
const vars$6 = {
|
6832
|
+
...compVars,
|
6833
|
+
...helperVars,
|
6834
|
+
};
|
6831
6835
|
|
6832
6836
|
var loaderRadial$1 = /*#__PURE__*/Object.freeze({
|
6833
6837
|
__proto__: null,
|