@marioschmidt/design-system-components 1.1.0 → 1.2.1

package/dist/cjs/bds.cjs.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-D8A-8VrK.js');
+var index = require('./index-Bg-5nAHg.js');
 
 var _documentCurrentScript = typeof document !== 'undefined' ? document.currentScript : null;
 /*

package/dist/cjs/ds-button_2.cjs.entry.js

@@ -1,27 +1,31 @@
 'use strict';
 
-var index = require('./index-D8A-8VrK.js');
+var index = require('./index-Bg-5nAHg.js');
 
-const dsButtonCss = () => `:host{display:inline-block}.ds-button{display:inline-flex;align-items:center;justify-content:center;cursor:pointer;border:none;transition:background-color 0.2s ease, border-color 0.2s ease;padding:var(--button-stack-space, 6px) var(--button-inline-space, 16px);border-radius:var(--button-border-radius, 4px);font-family:var(--button-label-font-family);font-weight:var(--font-weight-bold, 700);font-size:var(--button-label-font-size, 15px);line-height:var(--button-label-line-height, 15px)}.ds-button--primary{background-color:var(--button-primary-brand-bg-color-idle, #DD0000);color:var(--button-primary-label-color, #FFFFFF)}.ds-button--primary:hover:not(:disabled){background-color:var(--button-primary-brand-bg-color-hover, #B80000)}.ds-button--secondary{background-color:var(--button-secondary-bg-color-idle, #E9ECEF);color:var(--button-secondary-label-color, #4B525A)}.ds-button--secondary:hover:not(:disabled){background-color:var(--button-secondary-bg-color-hover, #CED4DA)}.ds-button--tertiary{background-color:transparent;color:var(--button-tertiary-label-color, #4B525A);border:1px solid var(--button-tertiary-border-color-idle, #CED4DA)}.ds-button--tertiary:hover:not(:disabled){border-color:var(--button-tertiary-border-color-hover, #4B525A)}.ds-button--disabled{opacity:0.5;cursor:not-allowed}.ds-button__label{text-transform:uppercase;letter-spacing:0.02em}`;
+const dsButtonCss = () => `:host{display:inline-block}.ds-button{display:inline-flex;align-items:center;justify-content:center;cursor:pointer;border:none;background:transparent;transition:background-color 0.2s ease,
+    border-color 0.2s ease,
+    color 0.2s ease;padding:var(--button-stack-space) var(--button-inline-space);min-height:var(--button-height-size);gap:var(--button-content-gap-space);border-radius:var(--button-border-radius);font-family:var(--button-label-font-family);font-weight:var(--font-weight-bold);font-size:var(--button-label-font-size);line-height:var(--button-label-line-height);letter-spacing:var(--letter-space-0-p-5);text-transform:uppercase}.ds-button__label{display:inline-flex;align-items:center;gap:inherit}.ds-button--primary-brand{background-color:var(--button-primary-brand-bg-color-idle);color:var(--button-primary-brand-label-color)}.ds-button--primary-brand:hover:not(:disabled){background-color:var(--button-primary-brand-bg-color-hover)}.ds-button--primary-brand:active:not(:disabled){background-color:var(--button-primary-brand-bg-color-active)}.ds-button--primary-neutral{background-color:var(--button-primary-neutral-bg-color-idle);color:var(--button-primary-neutral-label-color)}.ds-button--primary-neutral:hover:not(:disabled){background-color:var(--button-primary-neutral-bg-color-hover)}.ds-button--primary-neutral:active:not(:disabled){background-color:var(--button-primary-neutral-bg-color-active)}.ds-button--primary-success{background-color:var(--button-primary-success-bg-color-idle);color:var(--button-primary-success-label-color)}.ds-button--primary-success:hover:not(:disabled){background-color:var(--button-primary-success-bg-color-hover)}.ds-button--primary-success:active:not(:disabled){background-color:var(--button-primary-success-bg-color-active)}.ds-button--secondary{background-color:var(--button-secondary-bg-color-idle);color:var(--button-secondary-label-color)}.ds-button--secondary:hover:not(:disabled){background-color:var(--button-secondary-bg-color-hover)}.ds-button--secondary:active:not(:disabled){background-color:var(--button-secondary-bg-color-active)}.ds-button--tertiary-neutral{background-color:transparent;color:var(--button-tertiary-neutral-label-color);border:var(--button-border-width-size) solid var(--button-tertiary-neutral-border-color-idle)}.ds-button--tertiary-neutral:hover:not(:disabled){background-color:var(--button-tertiary-neutral-bg-color-hover);border-color:var(--button-tertiary-neutral-border-color-hover)}.ds-button--tertiary-neutral:active:not(:disabled){background-color:var(--button-tertiary-neutral-bg-color-active)}.ds-button--tertiary-success{background-color:transparent;color:var(--button-tertiary-success-label-color);border:var(--button-border-width-size) solid var(--button-tertiary-success-border-color)}.ds-button--tertiary-success:hover:not(:disabled){background-color:var(--button-tertiary-success-bg-color-hover)}.ds-button--ghost{background-color:transparent;color:var(--button-ghost-label-color)}.ds-button--ghost:hover:not(:disabled){background-color:var(--button-ghost-bg-color-hover)}.ds-button--ghost:active:not(:disabled){background-color:var(--button-ghost-bg-color-active)}.ds-button--disabled,.ds-button:disabled{cursor:not-allowed;background-color:var(--button-disabled-bg-color);color:var(--button-disabled-label-color);border-color:var(--button-disabled-border-color)}.ds-button--disabled:hover,.ds-button--disabled:active,.ds-button:disabled:hover,.ds-button:disabled:active{background-color:var(--button-disabled-bg-color);color:var(--button-disabled-label-color);border-color:var(--button-disabled-border-color)}.ds-button:focus-visible{outline:2px solid var(--core-color-primary);outline-offset:2px}`;
 
 const DsButton = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         /**
-         * Button variant: primary, secondary, or tertiary
+         * Button variant determining visual style.
+         * @default 'primary-brand'
          */
-        this.variant = 'primary';
+        this.variant = 'primary-brand';
         /**
-         * Disabled state
+         * Disables the button interaction and applies disabled styling.
+         * @default false
          */
         this.disabled = false;
     }
     render() {
-        return (index.h("button", { key: '9cdec7f2d8913050c2f934f9b006113a73e52fe9', class: {
+        return (index.h("button", { key: 'b2c29af56fa84e6274900496d1a57bf7be6070e0', class: {
                 'ds-button': true,
                 [`ds-button--${this.variant}`]: true,
                 'ds-button--disabled': this.disabled,
-            }, disabled: this.disabled }, index.h("span", { key: '0939f9a53d3c9c0d76f19edec687f1c869ebb9d9', class: "ds-button__label" }, index.h("slot", { key: 'adf41ca5922e4fab4dbb176a21134c9cb52937c1' }))));
+            }, disabled: this.disabled }, index.h("span", { key: '8d7cd171306ed6e7b3507fea53e54df4d886d1a0', class: "ds-button__label" }, index.h("slot", { key: 'c040145f092daf57dd086a9991bcb5d0dc4f97dc' }))));
     }
 };
 DsButton.style = dsButtonCss();