@descope/web-components-ui 3.3.2 → 3.3.4

package/dist/cjs/index.cjs.js

@@ -3308,6 +3308,7 @@ const ButtonClass = compose(
       hostDirection: { ...host$x, property: 'direction' },
       fontSize: {},
       fontFamily: {},
+      fontWeight: {},
 
       cursor: {},
       backgroundColor: {},
@@ -3322,7 +3323,10 @@ const ButtonClass = compose(
       borderStyle: {},
       borderWidth: {},
 
-      verticalPadding: [{ property: 'padding-top' }, { property: 'padding-bottom' }],
+      verticalPadding: [
+        { property: 'padding-top' },
+        { property: 'padding-bottom' },
+      ],
       horizontalPadding: [
         { property: 'padding-right', fallback: '0.875em' },
         { property: 'padding-left', fallback: '0.875em' },
@@ -3330,9 +3334,9 @@ const ButtonClass = compose(
 
       labelTextColor: { property: 'color' },
       iconColor: {
-		selector: () => `::slotted(*)`,
-		property: IconClass.cssVarList.fill
-	  },
+        selector: () => `::slotted(*)`,
+        property: IconClass.cssVarList.fill,
+      },
       labelTextDecoration: { ...label$a, property: 'text-decoration' },
       labelSpacing: { ...label$a, property: 'gap' },
       textAlign: { ...label$a, property: 'justify-content', fallback: 'center' },
@@ -3345,7 +3349,7 @@ const ButtonClass = compose(
   }),
   clickableMixin,
   draggableMixin$1,
-  componentNameValidationMixin$1
+  componentNameValidationMixin$1,
 )(
   createProxy$1({
     slots: ['', 'prefix', 'label', 'suffix'],
@@ -3371,7 +3375,7 @@ const ButtonClass = compose(
 		`,
     excludeAttrsSync: ['tabindex', 'class', 'style'],
     componentName: componentName$1i,
-  })
+  }),
 );
 
 const { color, fontSize } = ButtonClass.cssVarList;
@@ -3418,12 +3422,16 @@ const mode = {
   surface: globalRefs$H.colors.surface,
 };
 
-const [helperTheme$7, helperRefs$7, helperVars$6] = createHelperVars$1({ mode }, componentName$1i);
+const [helperTheme$7, helperRefs$7, helperVars$6] = createHelperVars$1(
+  { mode },
+  componentName$1i,
+);
 
 const button = {
   ...helperTheme$7,
 
   [compVars$9.fontFamily]: globalRefs$H.fonts.font1.family,
+  [compVars$9.fontWeight]: '400',
 
   [compVars$9.cursor]: 'pointer',
   [compVars$9.hostHeight]: '3em',
@@ -3946,7 +3954,16 @@ const EnrichedTextClass = compose(
 
 const componentName$1f = getComponentName('link');
 
-class RawLink extends createBaseClass$1({ componentName: componentName$1f, baseSelector: ':host a' }) {
+const observedAttrs$6 = ['href', 'readonly'];
+
+class RawLink extends createBaseClass$1({
+  componentName: componentName$1f,
+  baseSelector: ':host a',
+}) {
+  static get observedAttributes() {
+    return observedAttrs$6.concat(super.observedAttributes || []);
+  }
+
   constructor() {
     super();
 
@@ -3979,10 +3996,12 @@ class RawLink extends createBaseClass$1({ componentName: componentName$1f, baseS
       white-space: nowrap;
     }
       `,
-      this
+      this,
     );
 
-    forwardAttrs(this, this.shadowRoot.querySelector('a'), {
+    this.anchor = this.shadowRoot.querySelector('a');
+
+    forwardAttrs(this, this.anchor, {
       includeAttrs: ['href', 'target', 'tooltip'],
       mapAttrs: {
         tooltip: 'title',
@@ -3992,6 +4011,16 @@ class RawLink extends createBaseClass$1({ componentName: componentName$1f, baseS
     forwardAttrs(this, this.shadowRoot.querySelector('descope-text'), {
       includeAttrs: ['mode', 'variant'],
     });
+
+    this.anchor.addEventListener('click', (e) => {
+      if (this.readOnly) {
+        e.preventDefault();
+      }
+    });
+  }
+
+  get readOnly() {
+    return this.getAttribute('readonly') === 'true';
   }
 }
 
@@ -4011,7 +4040,11 @@ const LinkClass = compose(
       hostWidth: { ...host$v, property: 'width' },
       hostDirection: { ...text$2, property: 'direction' },
       textAlign: wrapper$1,
-      textDecoration: { ...link$3, property: 'text-decoration', fallback: 'none' },
+      textDecoration: {
+        ...link$3,
+        property: 'text-decoration',
+        fallback: 'none',
+      },
       textColor: [
         { ...anchor, property: 'color' },
         { ...text$2, property: TextClass.cssVarList.textColor },
@@ -4020,7 +4053,7 @@ const LinkClass = compose(
     },
   }),
   draggableMixin$1,
-  componentNameValidationMixin$1
+  componentNameValidationMixin$1,
 )(RawLink);
 
 const globalRefs$F = getThemeRefs$1(globals);