@descope/web-components-ui 1.0.100 → 1.0.102

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.
Files changed (28) hide show
  1. package/dist/index.esm.js +124 -63
  2. package/dist/index.esm.js.map +1 -1
  3. package/dist/umd/0.js +1 -1
  4. package/dist/umd/890.js +1 -1
  5. package/dist/umd/descope-combo-box-index-js.js +1 -1
  6. package/dist/umd/descope-new-password-descope-new-password-internal-index-js.js +1 -1
  7. package/dist/umd/descope-new-password-index-js.js +1 -1
  8. package/dist/umd/descope-passcode-index-js.js +1 -1
  9. package/dist/umd/descope-phone-field-descope-phone-field-internal-index-js.js +1 -1
  10. package/dist/umd/descope-phone-field-index-js.js +1 -1
  11. package/dist/umd/descope-text-field-index-js.js +1 -1
  12. package/package.json +1 -1
  13. package/src/components/descope-combo-box/ComboBox.js +17 -2
  14. package/src/components/descope-new-password/NewPassword.js +2 -1
  15. package/src/components/descope-new-password/index.js +2 -0
  16. package/src/components/descope-passcode/index.js +2 -0
  17. package/src/components/descope-password-field/PasswordField.js +3 -0
  18. package/src/components/descope-phone-field/PhoneField.js +20 -1
  19. package/src/components/descope-phone-field/descope-phone-field-internal/PhoneFieldInternal.js +1 -0
  20. package/src/components/descope-text-field/TextField.js +1 -1
  21. package/src/index.js +20 -20
  22. package/src/mixins/createStyleMixin/index.js +4 -1
  23. package/src/mixins/normalizeBooleanAttributesMixin.js +29 -4
  24. package/src/theme/components/comboBox.js +6 -0
  25. package/src/theme/components/passwordField.js +1 -1
  26. package/src/theme/components/phoneField.js +12 -6
  27. package/src/theme/components/text.js +0 -2
  28. package/src/theme/components/textArea.js +5 -1
package/dist/index.esm.js CHANGED
@@ -1,7 +1,6 @@
1
1
  import '@vaadin/button';
2
2
  import '@vaadin/checkbox';
3
3
  import '@vaadin/text-field';
4
- import '@vaadin/date-picker';
5
4
  import '@vaadin/email-field';
6
5
  import '@vaadin/number-field';
7
6
  import '@vaadin/password-field';
@@ -350,7 +349,10 @@ const createStyleMixin =
350
349
  );
351
350
 
352
351
  if (value) style?.setProperty(varName, value);
353
- else style?.removeProperty(varName);
352
+ else {
353
+ style?.removeProperty(varName);
354
+ this.removeAttribute(attrName);
355
+ }
354
356
  }
355
357
 
356
358
  #updateOverridesStyle(attrs = []) {
@@ -499,6 +501,27 @@ const hoverableMixin = (superclass) =>
499
501
  }
500
502
  };
501
503
 
504
+ const booleanAttributesList = [
505
+ 'readonly',
506
+ 'focused',
507
+ 'invalid',
508
+ 'has-label',
509
+ 'required',
510
+ 'disabled',
511
+ 'checked',
512
+ 'has-helper',
513
+ 'has-value',
514
+ 'step-buttons-visible',
515
+ 'hover',
516
+ 'has-error-message',
517
+ 'focus-ring',
518
+ 'opened',
519
+ 'active'
520
+ ];
521
+
522
+ const isBooleanAttribute = (attr) => {
523
+ return booleanAttributesList.includes(attr)
524
+ };
502
525
  // we want all the valueless attributes to have "true" value
503
526
  // and all the falsy attribute to be removed
504
527
  const normalizeBooleanAttributesMixin = (superclass) => class NormalizeBooleanAttributesMixinClass extends superclass {
@@ -509,10 +532,14 @@ const normalizeBooleanAttributesMixin = (superclass) => class NormalizeBooleanAt
509
532
  attrs.forEach(attr => {
510
533
  const attrVal = this.getAttribute(attr);
511
534
 
512
- if (attrVal === '') {
513
- this.setAttribute(attr, 'true');
514
- } else if (attrVal === 'false') {
515
- this.removeAttribute(attr);
535
+ if (isBooleanAttribute(attr)) {
536
+ if (attrVal === '') {
537
+ this.setAttribute(attr, 'true');
538
+ } else if (attrVal === 'false') {
539
+ this.removeAttribute(attr);
540
+ }
541
+ } else if (!attrVal) {
542
+ console.warn(`attribute "${attr}" has no value, should it be added to the boolean attributes list?`);
516
543
  }
517
544
  }), {});
518
545
  }
@@ -1062,7 +1089,7 @@ const inputEventsDispatchingMixin = (superclass) => class InputEventsDispatching
1062
1089
  }
1063
1090
  };
1064
1091
 
1065
- const componentName$o = getComponentName('button');
1092
+ const componentName$n = getComponentName('button');
1066
1093
 
1067
1094
  const resetStyles = `
1068
1095
  :host {
@@ -1136,7 +1163,7 @@ const Button = compose(
1136
1163
  ${editorOverrides}
1137
1164
  `,
1138
1165
  excludeAttrsSync: ['tabindex'],
1139
- componentName: componentName$o
1166
+ componentName: componentName$n
1140
1167
  })
1141
1168
  );
1142
1169
 
@@ -1169,7 +1196,7 @@ const loadingIndicatorStyles = `
1169
1196
  }
1170
1197
  `;
1171
1198
 
1172
- customElements.define(componentName$o, Button);
1199
+ customElements.define(componentName$n, Button);
1173
1200
 
1174
1201
  const createBaseInputClass = (...args) => compose(
1175
1202
  inputValidationMixin,
@@ -1178,7 +1205,7 @@ const createBaseInputClass = (...args) => compose(
1178
1205
  inputEventsDispatchingMixin
1179
1206
  )(createBaseClass(...args));
1180
1207
 
1181
- const componentName$n = getComponentName('boolean-field-internal');
1208
+ const componentName$m = getComponentName('boolean-field-internal');
1182
1209
 
1183
1210
  const forwardAttributes$1 = [
1184
1211
  'disabled',
@@ -1187,7 +1214,7 @@ const forwardAttributes$1 = [
1187
1214
  'readonly'
1188
1215
  ];
1189
1216
 
1190
- const BaseInputClass$3 = createBaseInputClass({ componentName: componentName$n, baseSelector: 'div' });
1217
+ const BaseInputClass$3 = createBaseInputClass({ componentName: componentName$m, baseSelector: 'div' });
1191
1218
 
1192
1219
  class BooleanInputInternal extends BaseInputClass$3 {
1193
1220
  constructor() {
@@ -1251,14 +1278,14 @@ const booleanFieldMixin = (superclass) =>
1251
1278
 
1252
1279
  const template = document.createElement('template');
1253
1280
  template.innerHTML = `
1254
- <${componentName$n}
1281
+ <${componentName$m}
1255
1282
  tabindex="-1"
1256
1283
  slot="input"
1257
- ></${componentName$n}>
1284
+ ></${componentName$m}>
1258
1285
  `;
1259
1286
 
1260
1287
  this.baseElement.appendChild(template.content.cloneNode(true));
1261
- this.inputElement = this.shadowRoot.querySelector(componentName$n);
1288
+ this.inputElement = this.shadowRoot.querySelector(componentName$m);
1262
1289
  this.checkbox = this.inputElement.querySelector('vaadin-checkbox');
1263
1290
 
1264
1291
  forwardAttrs(this, this.inputElement, {
@@ -1336,7 +1363,7 @@ descope-boolean-field-internal {
1336
1363
  }
1337
1364
  `;
1338
1365
 
1339
- const componentName$m = getComponentName('checkbox');
1366
+ const componentName$l = getComponentName('checkbox');
1340
1367
 
1341
1368
  const {
1342
1369
  host: host$9,
@@ -1420,15 +1447,15 @@ const Checkbox = compose(
1420
1447
  }
1421
1448
  `,
1422
1449
  excludeAttrsSync: ['tabindex'],
1423
- componentName: componentName$m
1450
+ componentName: componentName$l
1424
1451
  })
1425
1452
  );
1426
1453
 
1427
- customElements.define(componentName$n, BooleanInputInternal);
1454
+ customElements.define(componentName$m, BooleanInputInternal);
1428
1455
 
1429
- customElements.define(componentName$m, Checkbox);
1456
+ customElements.define(componentName$l, Checkbox);
1430
1457
 
1431
- const componentName$l = getComponentName('switch-toggle');
1458
+ const componentName$k = getComponentName('switch-toggle');
1432
1459
 
1433
1460
  const {
1434
1461
  host: host$8,
@@ -1535,17 +1562,17 @@ const SwitchToggle = compose(
1535
1562
  }
1536
1563
  `,
1537
1564
  excludeAttrsSync: ['tabindex'],
1538
- componentName: componentName$l
1565
+ componentName: componentName$k
1539
1566
  })
1540
1567
  );
1541
1568
 
1542
- customElements.define(componentName$l, SwitchToggle);
1569
+ customElements.define(componentName$k, SwitchToggle);
1543
1570
 
1544
- const componentName$k = getComponentName('loader-linear');
1571
+ const componentName$j = getComponentName('loader-linear');
1545
1572
 
1546
- class RawLoaderLinear extends createBaseClass({ componentName: componentName$k, baseSelector: ':host > div' }) {
1573
+ class RawLoaderLinear extends createBaseClass({ componentName: componentName$j, baseSelector: ':host > div' }) {
1547
1574
  static get componentName() {
1548
- return componentName$k;
1575
+ return componentName$j;
1549
1576
  }
1550
1577
  constructor() {
1551
1578
  super();
@@ -1603,11 +1630,11 @@ const LoaderLinear = compose(
1603
1630
  componentNameValidationMixin
1604
1631
  )(RawLoaderLinear);
1605
1632
 
1606
- customElements.define(componentName$k, LoaderLinear);
1633
+ customElements.define(componentName$j, LoaderLinear);
1607
1634
 
1608
- const componentName$j = getComponentName('loader-radial');
1635
+ const componentName$i = getComponentName('loader-radial');
1609
1636
 
1610
- class RawLoaderRadial extends createBaseClass({ componentName: componentName$j, baseSelector: ':host > div' }) {
1637
+ class RawLoaderRadial extends createBaseClass({ componentName: componentName$i, baseSelector: ':host > div' }) {
1611
1638
  constructor() {
1612
1639
  super();
1613
1640
 
@@ -1653,11 +1680,11 @@ const LoaderRadial = compose(
1653
1680
  componentNameValidationMixin
1654
1681
  )(RawLoaderRadial);
1655
1682
 
1656
- customElements.define(componentName$j, LoaderRadial);
1683
+ customElements.define(componentName$i, LoaderRadial);
1657
1684
 
1658
- const componentName$i = getComponentName('container');
1685
+ const componentName$h = getComponentName('container');
1659
1686
 
1660
- class RawContainer extends createBaseClass({ componentName: componentName$i, baseSelector: ':host > slot' }) {
1687
+ class RawContainer extends createBaseClass({ componentName: componentName$h, baseSelector: ':host > slot' }) {
1661
1688
  constructor() {
1662
1689
  super();
1663
1690
 
@@ -1715,23 +1742,7 @@ const Container = compose(
1715
1742
  componentNameValidationMixin
1716
1743
  )(RawContainer);
1717
1744
 
1718
- customElements.define(componentName$i, Container);
1719
-
1720
- const componentName$h = getComponentName('date-picker');
1721
-
1722
- const DatePicker = compose(
1723
- draggableMixin,
1724
- componentNameValidationMixin
1725
- )(
1726
- createProxy({
1727
- componentName: componentName$h,
1728
- slots: ['prefix', 'suffix'],
1729
- wrappedEleName: 'vaadin-date-picker',
1730
- style: ``
1731
- })
1732
- );
1733
-
1734
- customElements.define(componentName$h, DatePicker);
1745
+ customElements.define(componentName$h, Container);
1735
1746
 
1736
1747
  const componentName$g = getComponentName('divider');
1737
1748
  class RawDivider extends createBaseClass({ componentName: componentName$g, baseSelector: ':host > div' }) {
@@ -2429,6 +2440,7 @@ overrides$2 = `
2429
2440
 
2430
2441
  vaadin-text-field input {
2431
2442
  -webkit-mask-image: none;
2443
+ min-height: 0;
2432
2444
  }
2433
2445
 
2434
2446
  vaadin-text-field > label,
@@ -2439,7 +2451,6 @@ overrides$2 = `
2439
2451
  cursor: text;
2440
2452
  }
2441
2453
  vaadin-text-field[required]::part(required-indicator)::after {
2442
- font-size: "12px";
2443
2454
  content: "*";
2444
2455
  color: var(${TextField.cssVarList.color});
2445
2456
  }
@@ -2709,6 +2720,9 @@ const PasswordField = compose(
2709
2720
  vaadin-password-field {
2710
2721
  width: 100%;
2711
2722
  }
2723
+ vaadin-password-field::part(input-field) {
2724
+ padding: 0;
2725
+ }
2712
2726
  vaadin-password-field > input {
2713
2727
  min-height: 0;
2714
2728
  }
@@ -2918,7 +2932,13 @@ const ComboBoxMixin = (superclass) => class ComboBoxMixinClass extends superclas
2918
2932
  }
2919
2933
  };
2920
2934
 
2921
- const { host: host$2, input, placeholder, toggle, label: label$1 } = {
2935
+ const {
2936
+ host: host$2,
2937
+ input,
2938
+ placeholder,
2939
+ toggle,
2940
+ label: label$1
2941
+ } = {
2922
2942
  host: { selector: () => ':host' },
2923
2943
  input: { selector: '::part(input-field)' },
2924
2944
  placeholder: { selector: '> input:placeholder-shown' },
@@ -2938,7 +2958,7 @@ const ComboBox = compose(
2938
2958
  height: input,
2939
2959
  padding: input,
2940
2960
 
2941
- backgroundColor: input,
2961
+ inputBackgroundColor: { ...input, property: 'background-color' },
2942
2962
  boxShadow: input,
2943
2963
 
2944
2964
  borderColor: input,
@@ -3003,6 +3023,15 @@ const ComboBox = compose(
3003
3023
  border-radius: 0;
3004
3024
  padding: 0;
3005
3025
  }
3026
+ vaadin-combo-box::part(input-field)::after {
3027
+ opacity: 0;
3028
+ }
3029
+ vaadin-combo-box[readonly]::part(input-field)::after {
3030
+ border: none;
3031
+ }
3032
+ vaadin-combo-box[readonly] > input:placeholder-shown {
3033
+ opacity: 1;
3034
+ }
3006
3035
  `,
3007
3036
  // Note: we exclude `size` to avoid overriding Vaadin's ComboBox property
3008
3037
  // with the same name. Including it will cause Vaadin to calculate NaN size,
@@ -4260,6 +4289,7 @@ const commonAttrs$1 = [
4260
4289
  'size',
4261
4290
  'bordered',
4262
4291
  'invalid',
4292
+ 'readonly',
4263
4293
  ];
4264
4294
  const countryAttrs = ['country-input-placeholder', 'default-code'];
4265
4295
  const phoneAttrs = ['phone-input-placeholder', 'maxlength'];
@@ -4448,6 +4478,10 @@ const componentName$2 = getComponentName('phone-field');
4448
4478
 
4449
4479
  const customMixin$1 = (superclass) =>
4450
4480
  class PhoneFieldClass extends superclass {
4481
+ static get CountryCodes() {
4482
+ return CountryCodes;
4483
+ }
4484
+
4451
4485
  constructor() {
4452
4486
  super();
4453
4487
  }
@@ -4546,6 +4580,10 @@ const PhoneField = compose(
4546
4580
  selector: 'descope-combo-box',
4547
4581
  property: comboVars.overlayItemBackgroundColor
4548
4582
  },
4583
+
4584
+ outlineStyle: inputWrapper,
4585
+ outlineWidth: [inputWrapper, { property: 'padding' }],
4586
+ outlineColor: inputWrapper,
4549
4587
  },
4550
4588
  }),
4551
4589
  draggableMixin,
@@ -4564,9 +4602,15 @@ const PhoneField = compose(
4564
4602
  display: inline-flex;
4565
4603
  }
4566
4604
  vaadin-text-field {
4567
- padding: 0;
4568
4605
  width: 100%;
4569
4606
  height: 100%;
4607
+ box-sizing: border-box;
4608
+ }
4609
+ vaadin-text-field[focus-ring]::part(input-field) {
4610
+ box-shadow: none;
4611
+ }
4612
+ vaadin-text-field::before {
4613
+ height: 0;
4570
4614
  }
4571
4615
  vaadin-text-field::part(input-field) {
4572
4616
  padding: 0;
@@ -4598,6 +4642,7 @@ const PhoneField = compose(
4598
4642
  flex-grow: 1;
4599
4643
  min-height: 0;
4600
4644
  height: 100%;
4645
+ ${textVars.outlineWidth}: 0;
4601
4646
  ${textVars.borderWidth}: 0;
4602
4647
  ${textVars.borderRadius}: 0;
4603
4648
  }
@@ -4607,6 +4652,9 @@ const PhoneField = compose(
4607
4652
  vaadin-text-field[readonly] > input:placeholder-shown {
4608
4653
  opacity: 1;
4609
4654
  }
4655
+ vaadin-text-field::part(input-field)::after {
4656
+ border: none;
4657
+ }
4610
4658
  `,
4611
4659
  excludeAttrsSync: ['tabindex'],
4612
4660
  componentName: componentName$2
@@ -4676,7 +4724,7 @@ const NewPassword = compose(
4676
4724
  selector: PasswordField.componentName,
4677
4725
  property: PasswordField.cssVarList.inputTextColor
4678
4726
  },
4679
- inputsGap: {...internalInputsWrapper, property: 'gap'}
4727
+ inputsGap: { ...internalInputsWrapper, property: 'gap' }
4680
4728
  }
4681
4729
  }),
4682
4730
  draggableMixin,
@@ -4707,6 +4755,7 @@ const overrides = `
4707
4755
  background: transparent;
4708
4756
  overflow: hidden;
4709
4757
  box-shadow: none;
4758
+ padding: 0;
4710
4759
  }
4711
4760
  vaadin-text-field::part(input-field)::after {
4712
4761
  background: transparent;
@@ -5262,7 +5311,7 @@ const mode = {
5262
5311
  surface: globalRefs$f.colors.surface
5263
5312
  };
5264
5313
 
5265
- const [helperTheme$2, helperRefs$2] = createHelperVars({ mode }, componentName$o);
5314
+ const [helperTheme$2, helperRefs$2] = createHelperVars({ mode }, componentName$n);
5266
5315
 
5267
5316
  const verticalPaddingRatio = 3;
5268
5317
  const horizontalPaddingRatio = 2;
@@ -5414,7 +5463,7 @@ const passwordField = {
5414
5463
  [vars$e.wrapperBorderStyle]: 'solid',
5415
5464
  [vars$e.wrapperBorderWidth]: '1px',
5416
5465
  [vars$e.wrapperBorderColor]: 'transparent',
5417
- [vars$e.wrapperBorderRadius]: globalRefs$d.radius.sm,
5466
+ [vars$e.wrapperBorderRadius]: globalRefs$d.radius.xs,
5418
5467
  [vars$e.backgroundColor]: globalRefs$d.colors.surface.light,
5419
5468
 
5420
5469
  [vars$e.outlineWidth]: '2px',
@@ -5496,7 +5545,7 @@ const textArea = {
5496
5545
  [vars$d.borderRadius]: globalRefs$c.radius.sm,
5497
5546
  [vars$d.borderWidth]: '1px',
5498
5547
  [vars$d.borderStyle]: 'solid',
5499
- [vars$d.borderColor]: globalRefs$c.colors.surface.main,
5548
+ [vars$d.borderColor]: 'transparent',
5500
5549
  [vars$d.outlineWidth]: '2px',
5501
5550
  [vars$d.outlineStyle]: 'solid',
5502
5551
  [vars$d.outlineColor]: 'transparent',
@@ -5514,6 +5563,10 @@ const textArea = {
5514
5563
  [vars$d.cursor]: 'not-allowed'
5515
5564
  },
5516
5565
 
5566
+ _bordered: {
5567
+ [vars$d.borderColor]: globalRefs$c.colors.surface.main,
5568
+ },
5569
+
5517
5570
  _invalid: {
5518
5571
  [vars$d.labelColor]: globalRefs$c.colors.error.main,
5519
5572
  [vars$d.outlineColor]: globalRefs$c.colors.error.main
@@ -5789,7 +5842,6 @@ const vars$8 = Text.cssVarList;
5789
5842
 
5790
5843
  const text = {
5791
5844
  [vars$8.lineHeight]: '1em',
5792
- [vars$8.display]: 'inline-block',
5793
5845
  [vars$8.textAlign]: 'left',
5794
5846
  [vars$8.color]: globalRefs$8.colors.surface.dark,
5795
5847
  variant: {
@@ -5850,7 +5902,6 @@ const text = {
5850
5902
  },
5851
5903
  _fullWidth: {
5852
5904
  [vars$8.width]: '100%',
5853
- [vars$8.display]: 'block'
5854
5905
  },
5855
5906
  _italic: {
5856
5907
  [vars$8.fontStyle]: 'italic'
@@ -6097,6 +6148,7 @@ const comboBox = {
6097
6148
  [vars$2.placeholderColor]: globalRefs$2.colors.surface.main,
6098
6149
  [vars$2.toggleColor]: globalRefs$2.colors.surface.contrast,
6099
6150
  [vars$2.toggleCursor]: 'pointer',
6151
+ [vars$2.inputBackgroundColor]: globalRefs$2.colors.surface.light,
6100
6152
  size: {
6101
6153
  xs: {
6102
6154
  [vars$2.height]: '14px',
@@ -6124,6 +6176,11 @@ const comboBox = {
6124
6176
  [vars$2.padding]: `0 ${globalRefs$2.spacing.xl}`
6125
6177
  }
6126
6178
  },
6179
+
6180
+ _readonly: {
6181
+ [vars$2.toggleCursor]: 'default',
6182
+ },
6183
+
6127
6184
  _invalid: {
6128
6185
  [vars$2.borderColor]: globalRefs$2.colors.error.main,
6129
6186
  [vars$2.placeholderColor]: globalRefs$2.colors.error.light,
@@ -6157,31 +6214,26 @@ const phoneField = {
6157
6214
  xs: {
6158
6215
  [vars$1.inputHeight]: '14px',
6159
6216
  [vars$1.fontSize]: '8px',
6160
- [vars$1.padding]: `0 ${globalRefs$1.spacing.xs}`,
6161
6217
  [vars$1.countryCodeDropdownWidth]: '200px',
6162
6218
  },
6163
6219
  sm: {
6164
6220
  [vars$1.inputHeight]: '20px',
6165
6221
  [vars$1.fontSize]: '10px',
6166
- [vars$1.padding]: `0 ${globalRefs$1.spacing.sm}`,
6167
6222
  [vars$1.countryCodeDropdownWidth]: '240px',
6168
6223
  },
6169
6224
  md: {
6170
6225
  [vars$1.inputHeight]: '30px',
6171
6226
  [vars$1.fontSize]: '14px',
6172
- [vars$1.padding]: `0 ${globalRefs$1.spacing.md}`,
6173
6227
  [vars$1.countryCodeDropdownWidth]: '250px',
6174
6228
  },
6175
6229
  lg: {
6176
6230
  [vars$1.inputHeight]: '40px',
6177
6231
  [vars$1.fontSize]: '46px',
6178
- [vars$1.padding]: `0 ${globalRefs$1.spacing.lg}`,
6179
6232
  [vars$1.countryCodeDropdownWidth]: '250px',
6180
6233
  },
6181
6234
  xl: {
6182
6235
  [vars$1.inputHeight]: '50px',
6183
6236
  [vars$1.fontSize]: '25px',
6184
- [vars$1.padding]: `0 ${globalRefs$1.spacing.xl}`,
6185
6237
  [vars$1.countryCodeDropdownWidth]: '400px',
6186
6238
  }
6187
6239
  },
@@ -6196,7 +6248,16 @@ const phoneField = {
6196
6248
  [vars$1.wrapperBorderColor]: globalRefs$1.colors.surface.main
6197
6249
  },
6198
6250
 
6251
+ [vars$1.outlineStyle]: 'solid',
6252
+ [vars$1.outlineWidth]: '0.1em',
6253
+ [vars$1.outlineColor]: 'transparent',
6254
+
6255
+ _focused: {
6256
+ [vars$1.outlineColor]: globalRefs$1.colors.surface.main
6257
+ },
6258
+
6199
6259
  _invalid: {
6260
+ [vars$1.outlineColor]: globalRefs$1.colors.error.light,
6200
6261
  [vars$1.color]: globalRefs$1.colors.error.main,
6201
6262
  [vars$1.placeholderColor]: globalRefs$1.colors.error.light,
6202
6263
  [vars$1.wrapperBorderColor]: globalRefs$1.colors.error.main
@@ -6275,5 +6336,5 @@ var components = {
6275
6336
 
6276
6337
  var index = { globals, components };
6277
6338
 
6278
- export { componentsThemeManager, createComponentsTheme, index as defaultTheme, genColor, globalsThemeToStyle, themeToStyle };
6339
+ export { Button, Checkbox, Container, Divider, EmailField, Image, Link, LoaderLinear, LoaderRadial, Logo, NewPassword, NumberField, Passcode, PasswordField, PhoneField, SwitchToggle, Text, TextArea, TextField, componentsThemeManager, createComponentsTheme, index as defaultTheme, genColor, globalsThemeToStyle, themeToStyle };
6279
6340
  //# sourceMappingURL=index.esm.js.map