@descope/web-components-ui 1.0.347 → 1.0.348

package/dist/cjs/index.cjs.js

@@ -1133,7 +1133,7 @@ const createProxy = ({
 
     constructor() {
       super().attachShadow({ mode: 'open', delegatesFocus }).innerHTML = `
-			<style id="create-proxy">${isFunction(style) ? style() : style}</style>
+			<style id="create-proxy">${(isFunction(style) ? style() : style) || ''}</style>
 			<${wrappedEleName}>
 			${slots
         .map(
@@ -5026,12 +5026,8 @@ let EnrichedText$2 = class EnrichedText extends createBaseClass({ componentName:
         margin-bottom: 1em;
       }
       a {
-        text-decoration: none;
         cursor: pointer;
       }
-      a:hover {
-        text-decoration: underline;
-      }
       blockquote {
         padding: 0 2em;
       }
@@ -5176,6 +5172,8 @@ const EnrichedTextClass = compose(
       textLineHeight: { property: 'line-height' },
       textAlign: {},
       linkColor: { selector: 'a', property: 'color' },
+      linkTextDecoration: { selector: 'a', property: 'text-decoration' },
+      linkHoverTextDecoration: { selector: 'a:hover', property: 'text-decoration' },
       minHeight: {},
       minWidth: {},
     },
@@ -5199,10 +5197,6 @@ class RawLink extends createBaseClass({ componentName: componentName$B, baseSele
 		}
 		:host a {
 			display: inline;
-			text-decoration: none;
-		}
-		:host a:hover {
-			text-decoration: underline;
 		}
 		</style>
 		<div>
@@ -5229,12 +5223,13 @@ class RawLink extends createBaseClass({ componentName: componentName$B, baseSele
 
 const selectors$2 = {
   host: { selector: () => ':host' },
+  link: { selector: () => ':host a' },
   anchor: {},
   wrapper: { selector: () => ':host > div' },
   text: { selector: () => TextClass.componentName },
 };
 
-const { anchor, text: text$1, host: host$h, wrapper: wrapper$1 } = selectors$2;
+const { anchor, text: text$1, host: host$h, wrapper: wrapper$1, link: link$3 } = selectors$2;
 
 const LinkClass = compose(
   createStyleMixin({
@@ -5242,6 +5237,7 @@ const LinkClass = compose(
       hostWidth: { ...host$h, property: 'width' },
       hostDirection: { ...text$1, property: 'direction' },
       textAlign: wrapper$1,
+      textDecoration: { ...link$3, property: 'text-decoration', fallback: 'none' },
       textColor: [
         { ...anchor, property: 'color' },
         { ...text$1, property: TextClass.cssVarList.textColor },
@@ -5269,6 +5265,8 @@ const EnrichedText = {
   [vars$u.textColor]: globalRefs$l.colors.surface.dark,
 
   [vars$u.linkColor]: `var(${LinkClass.cssVarList.textColor})`,
+  [vars$u.linkTextDecoration]: 'none',
+  [vars$u.linkHoverTextDecoration]: 'underline',
 
   [vars$u.minWidth]: '0.25em',
   [vars$u.minHeight]: '1.35em',
@@ -5362,6 +5360,10 @@ const link$1 = {
     [vars$t.hostWidth]: '100%',
   },
 
+  _hover: {
+    [vars$t.textDecoration]: 'underline',
+  },
+
   mode: {
     secondary: {
       [vars$t.textColor]: globalRefs$k.colors.secondary.main,
@@ -12585,6 +12587,9 @@ const RadioButtonClass = compose(
       radioMargin: { selector: '::part(radio)', property: 'margin' },
       radioCheckedSize: { selector: '::part(radio)::after', property: 'border-width' },
       radioCheckedColor: { selector: '::part(radio)::after', property: 'border-color' },
+      radioBorderColor: { selector: '::part(radio)', property: 'border-color', fallback: 'none' },
+      radioBorderWidth: { selector: '::part(radio)', property: 'border-width', fallback: 0 },
+      radioBorderStyle: { selector: '::part(radio)', property: 'border-style', fallback: 'solid' },
     },
   }),
   composedProxyInputMixin({ proxyProps: ['setSelectionRange'] }),
@@ -12822,6 +12827,8 @@ const radioButton = {
   [vars$1.radioCheckedSize]: `calc(var(${vars$1.radioSize})/5)`,
   [vars$1.radioCheckedColor]: globalRefs.colors.surface.light,
   [vars$1.radioBackgroundColor]: globalRefs.colors.surface.light,
+  [vars$1.radioBorderColor]: 'none',
+  [vars$1.radioBorderWidth]: 0,
 
   _checked: {
     [vars$1.radioBackgroundColor]: globalRefs.colors.surface.contrast,