@descope/web-components-ui 1.0.175 → 1.0.177

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/index.d.ts CHANGED
@@ -47,7 +47,6 @@ export type Theme = {
47
47
  logo: Record<string, any>;
48
48
  container: Record<string, any>;
49
49
  link: Record<string, any>;
50
- button: Record<string, any>;
51
50
  text: Record<string, any>;
52
51
  inputWrapper: Record<string, any>;
53
52
  };
package/dist/index.esm.js CHANGED
@@ -1252,7 +1252,6 @@ const ButtonClass = compose(
1252
1252
  borderWidth: {},
1253
1253
 
1254
1254
  verticalPadding: [{ property: 'padding-top' }, { property: 'padding-bottom' }],
1255
- horizontalPadding: [{ property: 'padding-left' }, { property: 'padding-right' }],
1256
1255
 
1257
1256
  labelTextColor: { property: 'color' },
1258
1257
  labelTextDecoration: { ...label$a, property: 'text-decoration' },
@@ -1277,6 +1276,10 @@ const ButtonClass = compose(
1277
1276
  vaadin-button {
1278
1277
  height: calc(var(${ButtonClass.cssVarList.hostHeight}) - var(${ButtonClass.cssVarList.outlineWidth}) - var(${ButtonClass.cssVarList.outlineOffset}));
1279
1278
  }
1279
+ [square="true"]:not([full-width="true"]) {
1280
+ width: calc(var(${ButtonClass.cssVarList.hostWidth}) - var(${ButtonClass.cssVarList.outlineWidth}) - var(${ButtonClass.cssVarList.outlineOffset}));
1281
+ padding: 0;
1282
+ }
1280
1283
  `,
1281
1284
  excludeAttrsSync: ['tabindex'],
1282
1285
  componentName: componentName$t,
@@ -4535,7 +4538,7 @@ const componentName$8 = getComponentName('phone-field-internal');
4535
4538
  const commonAttrs$1 = ['disabled', 'size', 'bordered', 'invalid', 'readonly'];
4536
4539
  const countryAttrs = ['country-input-placeholder', 'default-code', 'restrict-countries'];
4537
4540
  const phoneAttrs = ['phone-input-placeholder', 'maxlength'];
4538
- const mapAttrs = {
4541
+ const mapAttrs$1 = {
4539
4542
  'country-input-placeholder': 'placeholder',
4540
4543
  'phone-input-placeholder': 'placeholder',
4541
4544
  };
@@ -4715,7 +4718,7 @@ let PhoneFieldInternal$1 = class PhoneFieldInternal extends BaseInputClass$3 {
4715
4718
  if (attrName === 'default-code' && newValue) {
4716
4719
  this.handleDefaultCountryCode(newValue);
4717
4720
  } else if (inputRelatedAttrs$1.includes(attrName)) {
4718
- const attr = mapAttrs[attrName] || attrName;
4721
+ const attr = mapAttrs$1[attrName] || attrName;
4719
4722
 
4720
4723
  if (commonAttrs$1.includes(attrName)) {
4721
4724
  this.inputs.forEach((input) => input.setAttribute(attr, newValue));
@@ -4966,7 +4969,17 @@ const getCountryByCodeId = (countryCode) => {
4966
4969
 
4967
4970
  const componentName$6 = getComponentName('phone-field-internal-input-box');
4968
4971
 
4969
- const observedAttributes$2 = ['disabled', 'size', 'bordered', 'invalid', 'readonly', 'placeholder'];
4972
+ const observedAttributes$2 = [
4973
+ 'disabled',
4974
+ 'size',
4975
+ 'bordered',
4976
+ 'invalid',
4977
+ 'readonly',
4978
+ 'phone-input-placeholder',
4979
+ ];
4980
+ const mapAttrs = {
4981
+ 'phone-input-placeholder': 'placeholder',
4982
+ };
4970
4983
 
4971
4984
  const BaseInputClass$2 = createBaseInputClass({ componentName: componentName$6, baseSelector: 'div' });
4972
4985
 
@@ -5101,7 +5114,8 @@ class PhoneFieldInternal extends BaseInputClass$2 {
5101
5114
  super.attributeChangedCallback(attrName, oldValue, newValue);
5102
5115
 
5103
5116
  if (oldValue !== newValue && observedAttributes$2.includes(attrName)) {
5104
- this.phoneNumberInput.setAttribute(attrName, newValue);
5117
+ const attr = mapAttrs[attrName] || attrName;
5118
+ this.phoneNumberInput.setAttribute(attr, newValue);
5105
5119
  }
5106
5120
  }
5107
5121
  }
@@ -5143,6 +5157,7 @@ const customMixin$1 = (superclass) =>
5143
5157
  'maxlength',
5144
5158
  'default-code',
5145
5159
  'disabled',
5160
+ 'phone-input-placeholder',
5146
5161
  ],
5147
5162
  });
5148
5163
  }
@@ -6305,9 +6320,6 @@ const mode = {
6305
6320
 
6306
6321
  const [helperTheme$3, helperRefs$3, helperVars$3] = createHelperVars({ mode }, componentName$t);
6307
6322
 
6308
- const verticalPaddingRatio = 3;
6309
- const horizontalPaddingRatio = 2;
6310
-
6311
6323
  const button = {
6312
6324
  ...helperTheme$3,
6313
6325
 
@@ -6315,6 +6327,7 @@ const button = {
6315
6327
 
6316
6328
  [compVars$3.cursor]: 'pointer',
6317
6329
  [compVars$3.hostHeight]: '3em',
6330
+ [compVars$3.hostWidth]: 'auto',
6318
6331
 
6319
6332
  [compVars$3.borderRadius]: globalRefs$b.radius.sm,
6320
6333
  [compVars$3.borderWidth]: globalRefs$b.border.xs,
@@ -6323,8 +6336,7 @@ const button = {
6323
6336
 
6324
6337
  [compVars$3.labelSpacing]: '0.25em',
6325
6338
 
6326
- [compVars$3.verticalPadding]: `calc(var(${compVars$3.fontSize}) / ${verticalPaddingRatio})`,
6327
- [compVars$3.horizontalPadding]: `calc(var(${compVars$3.fontSize}) / ${horizontalPaddingRatio})`,
6339
+ [compVars$3.verticalPadding]: '1em',
6328
6340
 
6329
6341
  [compVars$3.outlineWidth]: globals.border.sm,
6330
6342
  [compVars$3.outlineOffset]: '0px', // keep `px` unit for external calc
@@ -6338,6 +6350,12 @@ const button = {
6338
6350
  lg: { [compVars$3.fontSize]: '18px' },
6339
6351
  },
6340
6352
 
6353
+ _square: {
6354
+ [compVars$3.hostHeight]: '3em',
6355
+ [compVars$3.hostWidth]: '3em',
6356
+ [compVars$3.verticalPadding]: '0',
6357
+ },
6358
+
6341
6359
  _fullWidth: {
6342
6360
  [compVars$3.hostWidth]: '100%',
6343
6361
  },