@descope/web-components-ui 1.0.346 → 1.0.348

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.esm.js CHANGED
@@ -719,7 +719,7 @@ const createProxy = ({
719
719
 
720
720
  constructor() {
721
721
  super().attachShadow({ mode: 'open', delegatesFocus }).innerHTML = `
722
- <style id="create-proxy">${isFunction(style) ? style() : style}</style>
722
+ <style id="create-proxy">${(isFunction(style) ? style() : style) || ''}</style>
723
723
  <${wrappedEleName}>
724
724
  ${slots
725
725
  .map(
@@ -2675,10 +2675,6 @@ class RawLink extends createBaseClass({ componentName: componentName$L, baseSele
2675
2675
  }
2676
2676
  :host a {
2677
2677
  display: inline;
2678
- text-decoration: none;
2679
- }
2680
- :host a:hover {
2681
- text-decoration: underline;
2682
2678
  }
2683
2679
  </style>
2684
2680
  <div>
@@ -2705,12 +2701,13 @@ class RawLink extends createBaseClass({ componentName: componentName$L, baseSele
2705
2701
 
2706
2702
  const selectors$1 = {
2707
2703
  host: { selector: () => ':host' },
2704
+ link: { selector: () => ':host a' },
2708
2705
  anchor: {},
2709
2706
  wrapper: { selector: () => ':host > div' },
2710
2707
  text: { selector: () => TextClass.componentName },
2711
2708
  };
2712
2709
 
2713
- const { anchor, text: text$2, host: host$h, wrapper: wrapper$1 } = selectors$1;
2710
+ const { anchor, text: text$2, host: host$h, wrapper: wrapper$1, link: link$3 } = selectors$1;
2714
2711
 
2715
2712
  const LinkClass = compose(
2716
2713
  createStyleMixin({
@@ -2718,6 +2715,7 @@ const LinkClass = compose(
2718
2715
  hostWidth: { ...host$h, property: 'width' },
2719
2716
  hostDirection: { ...text$2, property: 'direction' },
2720
2717
  textAlign: wrapper$1,
2718
+ textDecoration: { ...link$3, property: 'text-decoration', fallback: 'none' },
2721
2719
  textColor: [
2722
2720
  { ...anchor, property: 'color' },
2723
2721
  { ...text$2, property: TextClass.cssVarList.textColor },
@@ -3660,6 +3658,12 @@ const disableRules = [
3660
3658
  'html_block',
3661
3659
  ];
3662
3660
 
3661
+ const decodeHTML = (html) => {
3662
+ const textArea = document.createElement('textarea');
3663
+ textArea.innerHTML = html;
3664
+ return textArea.value;
3665
+ };
3666
+
3663
3667
  /* eslint-disable no-param-reassign */
3664
3668
 
3665
3669
  const componentName$C = getComponentName('enriched-text');
@@ -3696,12 +3700,8 @@ let EnrichedText$2 = class EnrichedText extends createBaseClass({ componentName:
3696
3700
  margin-bottom: 1em;
3697
3701
  }
3698
3702
  a {
3699
- text-decoration: none;
3700
3703
  cursor: pointer;
3701
3704
  }
3702
- a:hover {
3703
- text-decoration: underline;
3704
- }
3705
3705
  blockquote {
3706
3706
  padding: 0 2em;
3707
3707
  }
@@ -3788,7 +3788,7 @@ let EnrichedText$2 = class EnrichedText extends createBaseClass({ componentName:
3788
3788
  }
3789
3789
 
3790
3790
  #initProcessor() {
3791
- this.processor = new MarkdownIt();
3791
+ this.processor = new MarkdownIt('commonmark', { html: true });
3792
3792
  this.#storeOrigRenderers();
3793
3793
  this.#updateProcessorRules();
3794
3794
  this.#customizeLinkRenderer();
@@ -3808,11 +3808,11 @@ let EnrichedText$2 = class EnrichedText extends createBaseClass({ componentName:
3808
3808
  return;
3809
3809
  }
3810
3810
 
3811
- let html = this.textContent;
3811
+ let html = decodeHTML(this.innerHTML);
3812
3812
 
3813
3813
  try {
3814
3814
  const tokens = this.processor.parse(html, { references: undefined });
3815
- html = this.processor.renderer.render(tokens, { breaks: true });
3815
+ html = this.processor.renderer.render(tokens, { html: true, breaks: true });
3816
3816
  } catch (e) {
3817
3817
  // eslint-disable-next-line no-console
3818
3818
  console.warn('Not parsing invalid markdown token');
@@ -3838,11 +3838,16 @@ const EnrichedTextClass = compose(
3838
3838
  fontSize: {},
3839
3839
  fontFamily: {},
3840
3840
  fontWeight: {},
3841
- fontWeightBold: { selector: () => ':host strong', property: 'font-weight' },
3841
+ fontWeightBold: [
3842
+ { selector: () => ':host strong', property: 'font-weight' },
3843
+ { selector: () => ':host b', property: 'font-weight' },
3844
+ ],
3842
3845
  textColor: { property: 'color' },
3843
3846
  textLineHeight: { property: 'line-height' },
3844
3847
  textAlign: {},
3845
3848
  linkColor: { selector: 'a', property: 'color' },
3849
+ linkTextDecoration: { selector: 'a', property: 'text-decoration' },
3850
+ linkHoverTextDecoration: { selector: 'a:hover', property: 'text-decoration' },
3846
3851
  minHeight: {},
3847
3852
  minWidth: {},
3848
3853
  },
@@ -11281,6 +11286,9 @@ const RadioButtonClass = compose(
11281
11286
  radioMargin: { selector: '::part(radio)', property: 'margin' },
11282
11287
  radioCheckedSize: { selector: '::part(radio)::after', property: 'border-width' },
11283
11288
  radioCheckedColor: { selector: '::part(radio)::after', property: 'border-color' },
11289
+ radioBorderColor: { selector: '::part(radio)', property: 'border-color', fallback: 'none' },
11290
+ radioBorderWidth: { selector: '::part(radio)', property: 'border-width', fallback: 0 },
11291
+ radioBorderStyle: { selector: '::part(radio)', property: 'border-style', fallback: 'solid' },
11284
11292
  },
11285
11293
  }),
11286
11294
  composedProxyInputMixin({ proxyProps: ['setSelectionRange'] }),
@@ -12759,6 +12767,8 @@ const EnrichedText = {
12759
12767
  [vars$u.textColor]: globalRefs$l.colors.surface.dark,
12760
12768
 
12761
12769
  [vars$u.linkColor]: `var(${LinkClass.cssVarList.textColor})`,
12770
+ [vars$u.linkTextDecoration]: 'none',
12771
+ [vars$u.linkHoverTextDecoration]: 'underline',
12762
12772
 
12763
12773
  [vars$u.minWidth]: '0.25em',
12764
12774
  [vars$u.minHeight]: '1.35em',
@@ -12852,6 +12862,10 @@ const link = {
12852
12862
  [vars$t.hostWidth]: '100%',
12853
12863
  },
12854
12864
 
12865
+ _hover: {
12866
+ [vars$t.textDecoration]: 'underline',
12867
+ },
12868
+
12855
12869
  mode: {
12856
12870
  secondary: {
12857
12871
  [vars$t.textColor]: globalRefs$k.colors.secondary.main,
@@ -14018,6 +14032,8 @@ const radioButton = {
14018
14032
  [vars$1.radioCheckedSize]: `calc(var(${vars$1.radioSize})/5)`,
14019
14033
  [vars$1.radioCheckedColor]: globalRefs.colors.surface.light,
14020
14034
  [vars$1.radioBackgroundColor]: globalRefs.colors.surface.light,
14035
+ [vars$1.radioBorderColor]: 'none',
14036
+ [vars$1.radioBorderWidth]: 0,
14021
14037
 
14022
14038
  _checked: {
14023
14039
  [vars$1.radioBackgroundColor]: globalRefs.colors.surface.contrast,