@marioschmidt/design-system-components 1.2.0 → 1.2.2

package/dist/docs/ds-button/readme.md

@@ -4,10 +4,10 @@
 
 ## Properties
 
-| Property   | Attribute  | Description                                     | Type                                     | Default     |
-| ---------- | ---------- | ----------------------------------------------- | ---------------------------------------- | ----------- |
-| `disabled` | `disabled` | Disabled state                                  | `boolean`                                | `false`     |
-| `variant`  | `variant`  | Button variant: primary, secondary, or tertiary | `"primary" \| "secondary" \| "tertiary"` | `'primary'` |
+| Property   | Attribute  | Description                                                   | Type                                                                                                                              | Default           |
+| ---------- | ---------- | ------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------- | ----------------- |
+| `disabled` | `disabled` | Disables the button interaction and applies disabled styling. | `boolean`                                                                                                                         | `false`           |
+| `variant`  | `variant`  | Button variant determining visual style.                      | `"ghost" \| "primary-brand" \| "primary-neutral" \| "primary-success" \| "secondary" \| "tertiary-neutral" \| "tertiary-success"` | `'primary-brand'` |
 
 
 ----------------------------------------------

package/dist/esm/bds.js

@@ -1,5 +1,5 @@
-import { p as promiseResolve, g as globalScripts, b as bootstrapLazy } from './index-Wtf1fKUK.js';
-export { s as setNonce } from './index-Wtf1fKUK.js';
+import { p as promiseResolve, g as globalScripts, b as bootstrapLazy } from './index-DjQpvXJW.js';
+export { s as setNonce } from './index-DjQpvXJW.js';
 
 /*
  Stencil Client Patch Browser v4.39.0 | MIT Licensed | https://stenciljs.com

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

@@ -1,25 +1,29 @@
-import { r as registerInstance, h } from './index-Wtf1fKUK.js';
+import { r as registerInstance, h } from './index-DjQpvXJW.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) {
         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 (h("button", { key: '9cdec7f2d8913050c2f934f9b006113a73e52fe9', class: {
+        return (h("button", { key: 'b2c29af56fa84e6274900496d1a57bf7be6070e0', class: {
                 'ds-button': true,
                 [`ds-button--${this.variant}`]: true,
                 'ds-button--disabled': this.disabled,
-            }, disabled: this.disabled }, h("span", { key: '0939f9a53d3c9c0d76f19edec687f1c869ebb9d9', class: "ds-button__label" }, h("slot", { key: 'adf41ca5922e4fab4dbb176a21134c9cb52937c1' }))));
+            }, disabled: this.disabled }, h("span", { key: '8d7cd171306ed6e7b3507fea53e54df4d886d1a0', class: "ds-button__label" }, h("slot", { key: 'c040145f092daf57dd086a9991bcb5d0dc4f97dc' }))));
     }
 };
 DsButton.style = dsButtonCss();