@progressive-development/pd-forms 0.7.10-t → 0.7.12

package/dist/pd-base-ui-input.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"pd-base-ui-input.d.ts","sourceRoot":"","sources":["../src/pd-base-ui-input.ts"],"names":[],"mappings":"AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AAEH,OAAO,EAAa,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAIhE,OAAO,0CAA0C,CAAC;AAElD,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAGxC,OAAO,EAAE,WAAW,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAYzD,OAAO,mBAAmB,CAAC;AAE3B;;;;;GAKG;AACH,eAAO,MAAM,eAAe,IAAI,CAAC;AACjC,eAAO,MAAM,iBAAiB,IAAI,CAAC;AACnC,eAAO,MAAM,gBAAgB,IAAI,CAAC;AAClC,eAAO,MAAM,gBAAgB,IAAI,CAAC;AAClC,eAAO,MAAM,eAAe,IAAI,CAAC;AACjC,eAAO,MAAM,sBAAsB,IAAI,CAAC;AACxC,eAAO,MAAM,eAAe,IAAI,CAAC;AACjC,eAAO,MAAM,eAAe,IAAI,CAAC;AACjC,eAAO,MAAM,eAAe,IAAI,CAAC;AAOjC,8BAAsB,aAAc,SAAQ,QAAQ;IAClD;;;OAGG;IAEH;;;OAGG;IAEH;;;OAGG;IAGH,QAAQ,UAAS;IAGjB,QAAQ,UAAS;IAGjB,QAAQ,UAAS;IAGjB,QAAQ,UAAS;IAGjB,WAAW,SAAM;IAGjB,SAAS,SAAM;IAGf,SAAS,SAAM;IAGf,mBAAmB,SAAO;IAG1B,KAAK,SAAM;IAGX,SAAS,EAAE,WAAW,CAAU;IAGhC,SAAS,EAAE,MAAM,CAAM;IAIvB,eAAe,UAAS;IAGxB,sBAAsB,UAAS;IAG/B,SAAS,CAAC,MAAM,UAAS;IAGzB,SAAS,CAAC,QAAQ,UAAS;IAG3B,SAAS,CAAC,MAAM,UAAS;IAGzB,SAAS,CAAC,SAAS,UAAQ;IAG3B,SAAS,CAAC,QAAQ,UAAS;IAG3B,SAAS,CAAC,QAAQ,UAAS;IAG3B,SAAS,CAAC,SAAS,SAAM;IAGzB,SAAS,CAAC,MAAM,SAAM;IAGtB,SAAS,CAAC,UAAU,SAAM;IAE1B,SAAS,CAAC,WAAW,EAAE,iBAAiB,EAAE,CAAM;IAEhD,OAAgB,MAAM,EAAE,cAAc,CAkBpC;IAEO,MAAM,CAAC,YAAY,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAkBhD,YAAY,IAAI,IAAI;IAOpB,oBAAoB,IAAI,IAAI;IAKrC,IAAI,QAAQ,IAAI,MAAM,CAErB;IAED,IAAI,QAAQ,CAAC,GAAG,EAAE,MAAM,EAEvB;IAED,IAAI,KAAK,IAAI,MAAM,CAElB;IAED,IAAI,KAAK,CAAC,GAAG,EAAE,MAAM,EAEpB;IAED,IAAI,KAAK,CAAC,GAAG,EAAE,OAAO,EAErB;IAED,IAAI,KAAK,CAAC,OAAO,EAAE,OAAO,EAEzB;IAEM,KAAK;IAkCL,KAAK,IAAI,IAAI;IAKpB,SAAS,CAAC,oBAAoB,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI;IAqBpD,SAAS,CAAC,sBAAsB,IAAI,IAAI;IAcxC,OAAO,CAAC,kBAAkB;IAkC1B,SAAS,CAAC,mBAAmB,CAC3B,QAAQ,EAAE,MAAM,EAChB,KAAK,EAAE,KAAK,GAAG,SAAS,EACxB,aAAa,UAAQ,EACrB,WAAW,UAAQ,EACnB,QAAQ,CAAC,EAAE,MAAM,IAAI,GACpB,IAAI;IAsCP,SAAS,CAAC,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,SAAS,CAAC,EAAE,MAAM;IAqB3D,SAAS,CAAC,WAAW,CAAC,QAAQ,GAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAM;;;;;;;IAW5D,SAAS,CAAC,eAAe;IAUzB,SAAS,CAAC,YAAY,CAAC,QAAQ,EAAE,MAAM,EAAE,eAAe,CAAC,EAAE,MAAM;IA0B1D,aAAa,CAAC,MAAM,CAAC,EAAE,OAAO,GAAG,OAAO,CAAC,OAAO,CAAC;IAoExD,SAAS,CAAC,iCAAiC,CAAC,MAAM,EAAE,OAAO;IAM3D,SAAS,CAAC,gBAAgB,CAAC,KAAK,CAAC,EAAE,OAAO,GAAG,MAAM;CAGpD"}
+{"version":3,"file":"pd-base-ui-input.d.ts","sourceRoot":"","sources":["../src/pd-base-ui-input.ts"],"names":[],"mappings":"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"}

package/dist/pd-base-ui-input.js

@@ -349,9 +349,6 @@ _PdBaseUIInput.styles = [
 
       .help-icon {
         --pd-icon-size: 20px;
-        --pd-icon-col-active: var(--pd-default-col);
-        --pd-icon-col-active-hover: var(--pd-default-hover-col);
-        --pd-icon-stroke-width: 0;
         cursor: help;
       }
     `

package/dist/pd-button-group.d.ts

@@ -1,4 +1,4 @@
-import { CSSResultGroup } from 'lit';
+import { CSSResultGroup, PropertyValues } from 'lit';
 import { PdBaseUI } from './pd-base-ui';
 import { ButtonData } from './types';
 export declare class PdButtonGroup extends PdBaseUI {
@@ -6,7 +6,7 @@ export declare class PdButtonGroup extends PdBaseUI {
     initValue: number[];
     private _selectedButtons;
     static styles: CSSResultGroup;
-    willUpdate(changedProps: Map<string, unknown>): void;
+    willUpdate(changedProps: PropertyValues<this>): void;
     render(): import('lit-html').TemplateResult<1>;
     private onClick;
 }

package/dist/pd-button-group.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"pd-button-group.d.ts","sourceRoot":"","sources":["../src/pd-button-group.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,cAAc,EAAE,MAAM,KAAK,CAAC;AAEhD,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AACxC,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAErC,qBACa,aAAc,SAAQ,QAAQ;IAEzC,UAAU,EAAE,UAAU,EAAE,CAAM;IAG9B,SAAS,EAAE,MAAM,EAAE,CAAM;IAGzB,OAAO,CAAC,gBAAgB,CAAgB;IAExC,OAAgB,MAAM,EAAE,cAAc,CAgDpC;IAEO,UAAU,CAAC,YAAY,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI;IAMpD,MAAM;IAiBf,OAAO,CAAC,OAAO;CAYhB"}
+{"version":3,"file":"pd-button-group.d.ts","sourceRoot":"","sources":["../src/pd-button-group.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAEhE,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AACxC,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAErC,OAAO,2BAA2B,CAAC;AAEnC,qBACa,aAAc,SAAQ,QAAQ;IAEzC,UAAU,EAAE,UAAU,EAAE,CAAM;IAG9B,SAAS,EAAE,MAAM,EAAE,CAAM;IAGzB,OAAO,CAAC,gBAAgB,CAAgB;IAExC,OAAgB,MAAM,EAAE,cAAc,CA0CpC;IAEO,UAAU,CAAC,YAAY,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAMpD,MAAM;IAiBf,OAAO,CAAC,OAAO;CAYhB"}

package/dist/pd-button-group.js

@@ -1,6 +1,7 @@
 import { css, html } from "lit";
 import { property, state, customElement } from "lit/decorators.js";
 import { PdBaseUI } from "./pd-base-ui.js";
+import "./pd-icon-panel-button.js";
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __decorateClass = (decorators, target, key, kind) => {
@@ -55,10 +56,11 @@ PdButtonGroup.styles = [
   PdBaseUI.styles,
   css`
       :host {
+        display: inline-block;
         --group-direction: var(--pd-button-group-direction, row);
-        --group-border-radius: var(--pd-border-radius, 0.5rem);
         --group-width: var(--pd-button-group-width, auto);
-        --pd-icon-button-border-radius: 0;
+        /*--pd-icon-button-border-radius: 0;*/
+        --group-border-radius: var(--pd-border-radius, 0.5rem);
       }
 
       .button-group {
@@ -67,13 +69,7 @@ PdButtonGroup.styles = [
         width: var(--group-width);
       }
 
-      .button-group pd-icon-panel-button {
-        flex: 1 1 auto;
-        margin: 0;
-        border-radius: 0;
-        border: none;
-      }
-
+      /*  geht noch nicht */
       .button-group pd-icon-panel-button:first-child {
         border-top-left-radius: var(--group-border-radius);
         border-bottom-left-radius: var(--group-border-radius);
@@ -84,7 +80,6 @@ PdButtonGroup.styles = [
         border-bottom-right-radius: var(--group-border-radiusm);
       }
 
-      /* Optional: für vertikale Ausrichtung spezifisch abrunden */
       :host([vertical]) .button-group pd-icon-panel-button:first-child {
         border-top-left-radius: var(--group-border-radius);
         border-top-right-radius: var(--group-border-radius);

package/dist/pd-checkbox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"pd-checkbox.d.ts","sourceRoot":"","sources":["../src/pd-checkbox.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqCG;AAEH,OAAO,EAAa,cAAc,EAAE,MAAM,KAAK,CAAC;AAIhD,OAAO,0CAA0C,CAAC;AAElD,OAAO,EAAE,aAAa,EAAoB,MAAM,oBAAoB,CAAC;AAGrE,qBACa,UAAW,SAAQ,aAAa;IAE3C,SAAS,EAAE,OAAO,GAAG,OAAO,GAAG,QAAQ,CAAW;IAElD,OAAgB,MAAM,EAAE,cAAc,CAgMpC;;IAOK,eAAe,CAAC,QAAQ,EAAE,MAAM,GAAG,OAAO,GAAG,IAAI;IAI/C,MAAM;IAuCf,OAAO,CAAC,QAAQ;IAMhB,OAAO,CAAC,WAAW;IAOnB,OAAO,CAAC,YAAY;IAIpB,SAAS,CAAC,gBAAgB,CAAC,KAAK,CAAC,EAAE,OAAO,GAAG,MAAM;IAM5C,KAAK,IAAI,IAAI;CAGrB"}
+{"version":3,"file":"pd-checkbox.d.ts","sourceRoot":"","sources":["../src/pd-checkbox.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqCG;AAEH,OAAO,EAAa,cAAc,EAAE,MAAM,KAAK,CAAC;AAIhD,OAAO,0CAA0C,CAAC;AAElD,OAAO,EAAE,aAAa,EAAoB,MAAM,oBAAoB,CAAC;AAGrE,qBACa,UAAW,SAAQ,aAAa;IAE3C,SAAS,EAAE,OAAO,GAAG,OAAO,GAAG,QAAQ,CAAW;IAElD,OAAgB,MAAM,EAAE,cAAc,CAiMpC;;IAOK,eAAe,CAAC,QAAQ,EAAE,MAAM,GAAG,OAAO,GAAG,IAAI;IAI/C,MAAM;IAuCf,OAAO,CAAC,QAAQ;IAMhB,OAAO,CAAC,WAAW;IAOnB,OAAO,CAAC,YAAY;IAIpB,SAAS,CAAC,gBAAgB,CAAC,KAAK,CAAC,EAAE,OAAO,GAAG,MAAM;IAM5C,KAAK,IAAI,IAAI;CAGrB"}

package/dist/pd-checkbox.js

@@ -85,23 +85,24 @@ PdCheckbox.styles = [
         /* active checkbox */
         --pd-icon-bg-col-active: var(
           --pd-cb-bg-col,
-          var(--pd-default-light-col)
+          var(--pd-default-lightest-col)
         );
-        --pd-icon-col-active: var(--pd-cb-col, var(--pd-default-hover-col));
-        --pd-icon-stroke-col-active: var(
-          --pd-cb-stroke-col,
-          var(--pd-default-col)
+        --pd-icon-col-active: var(
+          --pd-cb-col,
+          var(--pd-default-success-dark-col)
         );
 
         /* inactive checkbox */
         --pd-icon-bg-col: var(
           --pd-cb-unset-bg-col,
-          var(--pd-default-light-col)
+          var(--pd-default-lightest-col)
         );
-        --pd-icon-col: var(--pd-cb-col, var(--pd-default-bg-dark-col));
-        --pd-icon-stroke-col: var(--pd-cb-stroke-col, var(--pd-default-col));
+        --pd-icon-col: var(--pd-cb-col, var(--pd-default-error-dark-col));
 
-        --pd-icon-bg-col-hover: var(--pd-cb-bg-col, var(--pd-default-bg-col));
+        --pd-icon-bg-col-hover: var(
+          --pd-cb-bg-col,
+          var(--pd-default-light-col)
+        );
       }
 
       :host([checkType="SWITCH"]) {

package/dist/pd-icon-button-select-group.d.ts

@@ -1,4 +1,4 @@
-import { CSSResultGroup } from 'lit';
+import { CSSResultGroup, PropertyValues } from 'lit';
 import { PdBaseUI } from './pd-base-ui';
 import { ButtonData } from './types.js';
 export declare class PdIconButtonSelectGroup extends PdBaseUI {
@@ -6,6 +6,7 @@ export declare class PdIconButtonSelectGroup extends PdBaseUI {
     initValue: number;
     private _selectedValue;
     static styles: CSSResultGroup;
+    willUpdate(changedProps: PropertyValues<this>): void;
     render(): import('lit-html').TemplateResult<1> | "";
     private handleSelectionChange;
 }

package/dist/pd-icon-button-select-group.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"pd-icon-button-select-group.d.ts","sourceRoot":"","sources":["../src/pd-icon-button-select-group.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,cAAc,EAAE,MAAM,KAAK,CAAC;AAEhD,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAExC,OAAO,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAExC,OAAO,wBAAwB,CAAC;AAChC,OAAO,mBAAmB,CAAC;AAE3B,qBACa,uBAAwB,SAAQ,QAAQ;IAEnD,OAAO,EAAE,UAAU,EAAE,CAAM;IAG3B,SAAS,EAAE,MAAM,CAAM;IAGvB,OAAO,CAAC,cAAc,CAA0B;IAEhD,OAAgB,MAAM,EAAE,cAAc,CAapC;IAEO,MAAM;IAuBf,OAAO,CAAC,qBAAqB;CAc9B"}
+{"version":3,"file":"pd-icon-button-select-group.d.ts","sourceRoot":"","sources":["../src/pd-icon-button-select-group.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAEhE,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAExC,OAAO,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAExC,OAAO,wBAAwB,CAAC;AAChC,OAAO,mBAAmB,CAAC;AAE3B,qBACa,uBAAwB,SAAQ,QAAQ;IAEnD,OAAO,EAAE,UAAU,EAAE,CAAM;IAG3B,SAAS,EAAE,MAAM,CAAM;IAGvB,OAAO,CAAC,cAAc,CAAU;IAEhC,OAAgB,MAAM,EAAE,cAAc,CAcpC;IAEO,UAAU,CAAC,YAAY,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAMpD,MAAM;IAuBf,OAAO,CAAC,qBAAqB;CAc9B"}

package/dist/pd-icon-button-select-group.js

@@ -18,7 +18,11 @@ let PdIconButtonSelectGroup = class extends PdBaseUI {
     super(...arguments);
     this.options = [];
     this.initValue = -1;
-    this._selectedValue = this.initValue;
+  }
+  willUpdate(changedProps) {
+    if (changedProps.has("initValue") && this.initValue >= 0) {
+      this._selectedValue = this.initValue;
+    }
   }
   render() {
     if (!this.options || this.options.length === 0) {
@@ -59,13 +63,14 @@ PdIconButtonSelectGroup.styles = [
   PdBaseUI.styles,
   css`
       :host {
-        display: block;
+        display: inline-block;
         position: relative;
         --pd-icon-panel-button-panel-padding: 0px;
       }
 
       .button-group-style {
         --pd-button-group-direction: column;
+        --pd-icon-button-width: 100%;
       }
     `
 ];

package/dist/pd-icon-panel-button.d.ts

@@ -7,6 +7,7 @@ export declare class PdIconPanelButton extends PdBaseUI {
     panelButton: boolean;
     loading: boolean;
     selected: boolean;
+    primary: boolean;
     disableOnClickTime: number;
     hideClose: boolean;
     private _timerDisabled;

package/dist/pd-icon-panel-button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"pd-icon-panel-button.d.ts","sourceRoot":"","sources":["../src/pd-icon-panel-button.ts"],"names":[],"mappings":"AACA;;;GAGG;AAEH,OAAO,EAAE,cAAc,EAAa,MAAM,KAAK,CAAC;AAGhD,OAAO,0CAA0C,CAAC;AAClD,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAOxC,qBACa,iBAAkB,SAAQ,QAAQ;IAE7C,YAAY,CAAC,EAAE,MAAM,CAAC;IAGtB,UAAU,EAAE,MAAM,CAAQ;IAG1B,KAAK,CAAC,EAAE,MAAM,CAAC;IAGf,WAAW,EAAE,OAAO,CAAS;IAG7B,OAAO,EAAE,OAAO,CAAS;IAGzB,QAAQ,EAAE,OAAO,CAAS;IAG1B,kBAAkB,EAAE,MAAM,CAAM;IAGhC,SAAS,EAAE,OAAO,CAAS;IAI3B,OAAO,CAAC,cAAc,CAAkB;IAGxC,OAAO,CAAC,UAAU,CAAkB;IAEpC,OAAgB,MAAM,EAAE,cAAc,CA+LpC;IAEF,iBAAiB;IAKjB,oBAAoB;IAKpB,OAAO,CAAC,WAAW,CAEjB;IAGF,MAAM;IA6CN,OAAO,CAAC,UAAU;IAOlB,OAAO,CAAC,cAAc;IAsBtB,OAAO,CAAC,YAAY;CAQrB"}
+{"version":3,"file":"pd-icon-panel-button.d.ts","sourceRoot":"","sources":["../src/pd-icon-panel-button.ts"],"names":[],"mappings":"AACA;;;GAGG;AAEH,OAAO,EAAE,cAAc,EAAa,MAAM,KAAK,CAAC;AAGhD,OAAO,0CAA0C,CAAC;AAClD,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAOxC,qBACa,iBAAkB,SAAQ,QAAQ;IAE7C,YAAY,CAAC,EAAE,MAAM,CAAC;IAGtB,UAAU,EAAE,MAAM,CAAQ;IAG1B,KAAK,CAAC,EAAE,MAAM,CAAC;IAGf,WAAW,EAAE,OAAO,CAAS;IAG7B,OAAO,EAAE,OAAO,CAAS;IAGzB,QAAQ,EAAE,OAAO,CAAS;IAG1B,OAAO,EAAE,OAAO,CAAS;IAGzB,kBAAkB,EAAE,MAAM,CAAM;IAGhC,SAAS,EAAE,OAAO,CAAS;IAI3B,OAAO,CAAC,cAAc,CAAkB;IAGxC,OAAO,CAAC,UAAU,CAAkB;IAEpC,OAAgB,MAAM,EAAE,cAAc,CAiNpC;IAEF,iBAAiB;IAKjB,oBAAoB;IAKpB,OAAO,CAAC,WAAW,CAEjB;IAGF,MAAM;IAkDN,OAAO,CAAC,UAAU;IAOlB,OAAO,CAAC,cAAc;IAsBtB,OAAO,CAAC,YAAY;CAQrB"}

package/dist/pd-icon-panel-button.js

@@ -21,6 +21,7 @@ let PdIconPanelButton = class extends PdBaseUI {
     this.panelButton = false;
     this.loading = false;
     this.selected = false;
+    this.primary = false;
     this.disableOnClickTime = -1;
     this.hideClose = false;
     this._timerDisabled = false;
@@ -49,16 +50,16 @@ let PdIconPanelButton = class extends PdBaseUI {
       >
         ${this.loading ? html`<div class="loader"></div>` : this.pdButtonIcon ? html`
                 <pd-icon
-                  class="icon action-icon-color"
+                  class="button-icon action-icon-color ${this.primary || this.selected ? "" : "primary"}"
                   icon="${this.pdButtonIcon}"
-                  activeIcon
+                  ?activeIcon="${!this.primary && !this.selected}"
                 ></pd-icon>
               ` : ""}
-        <span>${this.buttonText}</span>
+        ${this.buttonText ? html`<span class="button-text">${this.buttonText}</span>` : ""}
         ${this.panelButton ? html` <pd-icon
               icon=${pdIcons.ICON_TOOGLE_ARROW}
               ?activeIcon=${!this._panelOpen}
-              class="small toggle-button"
+              class="small toggle-button  ${this.primary ? "" : "primary"}"
             ></pd-icon>` : ""}
       </div>
 
@@ -115,8 +116,6 @@ PdIconPanelButton.styles = [
       :host {
         display: inline-block; /* Verhindert, dass :host die volle Breite bekommt */
         position: relative;
-        width: var(--pd-icon-button-width, auto);
-        font-family: var(--pd-default-font-title-family);
       }
 
       :host([disabled]),
@@ -125,27 +124,42 @@ PdIconPanelButton.styles = [
       }
 
       .icon-button-style {
+        --pd-icon-size: var(--pd-icon-button-size, 32px);
+        width: var(--pd-icon-button-width, auto);
+
         z-index: 6;
+
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        gap: 0.5rem;
+
+        height: var(--pd-icon-button-height, 3em);
+        line-height: var(--pd-icon-button-line-height, 1);
+        padding: var(--pd-icon-button-padding, 0 1rem);
+
         background: var(
           --pd-icon-button-bg,
           #58a linear-gradient(hsla(0, 0%, 100%, 0.2), transparent)
         );
         background-color: var(--pd-icon-button-bgcol, var(--pd-default-col));
-        padding: 0.3em 0.8em;
         border: 1px solid
           var(--pd-icon-button-bordercol, var(--pd-default-dark-col));
         border-radius: var(--pd-icon-button-border-radius, 0.2em);
         transition: background-color 0.3s ease;
-        --pd-icon-size: 24px;
+
+        vertical-align: middle;
+        text-align: center;
+
         color: var(--pd-icon-button-txtcol, white);
+      }
+
+      .button-text {
         text-shadow: 0 -0.05em 0.05em rgba(0, 0, 0, 0.5);
-        font-size: var(--pd-icon-button-font-size, 125%);
-        line-height: var(--pd-icon-button-line-height, 1.5);
-        height: var(--pd-icon-button-height, auto);
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        text-align: center;
+        font-size: var(--pd-icon-button-font-size, 1.5rem);
+        font-weight: bold;
+        font-family: var(--pd-default-font-title-family);
+        margin-top: 0.2rem;
       }
 
       :host(:not([disabled]):not([_timerDisabled])) .icon-button-style:hover {
@@ -176,10 +190,7 @@ PdIconPanelButton.styles = [
           --pd-icon-button-primary-bgcol,
           var(--pd-secondary-col)
         );
-        color: var(
-          --pd-icon-button-primary-txtcol,
-          var(--pd-default-darkest-col)
-        );
+        color: var(--pd-icon-button-primary-txtcol, var(--pd-default-dark-col));
       }
 
       :host(:not([disabled]):not([_timerDisabled])[primary])
@@ -190,9 +201,16 @@ PdIconPanelButton.styles = [
 
       .panel {
         position: absolute;
-        width: max-content; /* Verhindert volle Breite */
-        min-width: 120%; /* Panel wird etwas breiter als der Button */
-        max-width: 300px; /* Optional: Maximale Breite */
+
+        min-width: var(
+          --pd-icon-button-panel-min-width,
+          100%
+        ); /* Panel wird so breit wie der Button */
+        max-width: var(
+          --pd-icon-button-panel-max-width,
+          300px
+        ); /* Optional: Maximale Breite */
+
         transform: scaleY(0);
         background: var(
           --pd-icon-button-panel-bg-col,
@@ -271,7 +289,7 @@ PdIconPanelButton.styles = [
         height: 12px;
         animation: spin 2s linear infinite;
 
-        margin-right: 1rem;
+        margin-right: 0.5rem;
       }
 
       :host([selected]:not([disabled]):not([_timerDisabled]))
@@ -280,6 +298,7 @@ PdIconPanelButton.styles = [
           --pd-icon-button-bgcol-selected,
           var(--pd-secondary-col)
         );
+        color: var(--pd-icon-button-primary-txtcol, var(--pd-default-dark-col));
         box-shadow:
           inset 0 2px 6px rgba(0, 0, 0, 0.4),
           0 0 0 2px rgba(0, 0, 0, 0.1);
@@ -318,6 +337,9 @@ __decorateClass([
 __decorateClass([
   property({ type: Boolean, reflect: true })
 ], PdIconPanelButton.prototype, "selected", 2);
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], PdIconPanelButton.prototype, "primary", 2);
 __decorateClass([
   property({ type: Number })
 ], PdIconPanelButton.prototype, "disableOnClickTime", 2);

package/dist/stories/pd-button-group.stories.d.ts

@@ -9,6 +9,8 @@ type Story = StoryObj;
 export declare const DefaultHorizontal: Story;
 export declare const WithInitialSelection: Story;
 export declare const VerticalGroup: Story;
+export declare const VerticalGroupSized: Story;
+export declare const HorizontalGroupSized: Story;
 export declare const NoInitialSelection: Story;
 export declare const EventLogging: Story;
 export declare const IconGroup: Story;

package/dist/stories/pd-button-group.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"pd-button-group.stories.d.ts","sourceRoot":"","sources":["../../src/stories/pd-button-group.stories.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,2BAA2B,CAAC;AAEhE,OAAO,uBAAuB,CAAC;AAS/B,QAAA,MAAM,IAAI;;;;CAIM,CAAC;AAEjB,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC;AAEtB,eAAO,MAAM,iBAAiB,EAAE,KAO/B,CAAC;AAEF,eAAO,MAAM,oBAAoB,EAAE,KAOlC,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAQ3B,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE,KAIhC,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAS1B,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAWvB,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,KAY/B,CAAC"}
+{"version":3,"file":"pd-button-group.stories.d.ts","sourceRoot":"","sources":["../../src/stories/pd-button-group.stories.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,2BAA2B,CAAC;AAEhE,OAAO,uBAAuB,CAAC;AAS/B,QAAA,MAAM,IAAI;;;;CAIM,CAAC;AAEjB,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC;AAEtB,eAAO,MAAM,iBAAiB,EAAE,KAI/B,CAAC;AAEF,eAAO,MAAM,oBAAoB,EAAE,KAOlC,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAQ3B,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE,KAOhC,CAAC;AAEF,eAAO,MAAM,oBAAoB,EAAE,KAOlC,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE,KAIhC,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAS1B,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAWvB,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,KAY/B,CAAC"}

package/dist/stories/pd-icon-button.stories.d.ts

@@ -23,6 +23,7 @@ export declare const DefaulIcontButtonDisabled: Story;
 export declare const DefaulIcontButtonTimerDisabled: Story;
 export declare const DefaulIcontButtonLoading: Story;
 export declare const DefaulIcontButtonPrimary: Story;
+export declare const DefaulIcontButtonPrimaryWithPanel: Story;
 export declare const DefaulIcontButtonPrimaryDisabled: Story;
 export declare const DefaulTextIcontButton: Story;
 export declare const PanelButton: Story;
@@ -31,4 +32,6 @@ export declare const PanelButtonWithContentRight: Story;
 export declare const PanelButtonWithContentUp: Story;
 export declare const PanelButtonWithContentRightUp: Story;
 export declare const ButtonSelected: Story;
+export declare const ButtonSelectedWithIcon: Story;
+export declare const ButtonTransparent: Story;
 //# sourceMappingURL=pd-icon-button.stories.d.ts.map

package/dist/stories/pd-icon-button.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"pd-icon-button.stories.d.ts","sourceRoot":"","sources":["../../src/stories/pd-icon-button.stories.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,2BAA2B,CAAC;AAEhE,OAAO,4BAA4B,CAAC;AAGpC,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;CAuBM,CAAC;AAEjB,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC;AAGtB,eAAO,MAAM,aAAa,EAAE,KAK3B,CAAC;AAGF,eAAO,MAAM,iBAAiB,EAAE,KAO/B,CAAC;AAEF,eAAO,MAAM,yBAAyB,EAAE,KAQvC,CAAC;AAEF,eAAO,MAAM,8BAA8B,EAAE,KAQ5C,CAAC;AAEF,eAAO,MAAM,wBAAwB,EAAE,KAQtC,CAAC;AAEF,eAAO,MAAM,wBAAwB,EAAE,KAQtC,CAAC;AAEF,eAAO,MAAM,gCAAgC,EAAE,KAS9C,CAAC;AAGF,eAAO,MAAM,qBAAqB,EAAE,KAMnC,CAAC;AAGF,eAAO,MAAM,WAAW,EAAE,KAOzB,CAAC;AAGF,eAAO,MAAM,sBAAsB,EAAE,KAgBpC,CAAC;AAGF,eAAO,MAAM,2BAA2B,EAAE,KAiBzC,CAAC;AAGF,eAAO,MAAM,wBAAwB,EAAE,KAiBtC,CAAC;AAGF,eAAO,MAAM,6BAA6B,EAAE,KAkB3C,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAuB5B,CAAC"}
+{"version":3,"file":"pd-icon-button.stories.d.ts","sourceRoot":"","sources":["../../src/stories/pd-icon-button.stories.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,2BAA2B,CAAC;AAEhE,OAAO,4BAA4B,CAAC;AAIpC,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;CAuBM,CAAC;AAEjB,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC;AAGtB,eAAO,MAAM,aAAa,EAAE,KAK3B,CAAC;AAGF,eAAO,MAAM,iBAAiB,EAAE,KAO/B,CAAC;AAEF,eAAO,MAAM,yBAAyB,EAAE,KAQvC,CAAC;AAEF,eAAO,MAAM,8BAA8B,EAAE,KAQ5C,CAAC;AAEF,eAAO,MAAM,wBAAwB,EAAE,KAQtC,CAAC;AAEF,eAAO,MAAM,wBAAwB,EAAE,KAQtC,CAAC;AAEF,eAAO,MAAM,iCAAiC,EAAE,KAQ/C,CAAC;AAEF,eAAO,MAAM,gCAAgC,EAAE,KAS9C,CAAC;AAGF,eAAO,MAAM,qBAAqB,EAAE,KAMnC,CAAC;AAGF,eAAO,MAAM,WAAW,EAAE,KAOzB,CAAC;AAGF,eAAO,MAAM,sBAAsB,EAAE,KAgBpC,CAAC;AAGF,eAAO,MAAM,2BAA2B,EAAE,KAiBzC,CAAC;AAGF,eAAO,MAAM,wBAAwB,EAAE,KAiBtC,CAAC;AAGF,eAAO,MAAM,6BAA6B,EAAE,KAkB3C,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAuB5B,CAAC;AAEF,eAAO,MAAM,sBAAsB,EAAE,KAwBpC,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,KAgH/B,CAAC"}

package/dist/styles/shared-input-field-styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"shared-input-field-styles.d.ts","sourceRoot":"","sources":["../../src/styles/shared-input-field-styles.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAIH;;GAEG;AACH,eAAO,MAAM,sBAAsB,yBAuKlC,CAAC"}
+{"version":3,"file":"shared-input-field-styles.d.ts","sourceRoot":"","sources":["../../src/styles/shared-input-field-styles.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAIH;;GAEG;AACH,eAAO,MAAM,sBAAsB,yBAmKlC,CAAC"}

package/dist/styles/shared-input-field-styles.js

@@ -58,10 +58,6 @@ const SharedInputFieldStyles = css`
       calc(var(--pd-input-field-height, 2rem) * 0.9)
     );
     --pd-icon-col-active: var(--pd-input-icon-color, #edf7fd);
-    --pd-icon-stroke-col-active: var(
-      --pd-input-icon-stroke-color,
-      var(--pd-default-color)
-    );
     top: 2px;
   }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progressive-development/pd-forms",
-  "version": "0.7.10t",
+  "version": "0.7.12",
   "description": "Webcomponent pd-forms for rendering form input elements.",
   "author": "PD Progressive Development",
   "license": "SEE LICENSE IN LICENSE",
@@ -54,7 +54,7 @@
   "dependencies": {
     "@lit-labs/motion": "^1.0.8",
     "@lit/localize": "^0.12.2",
-    "@progressive-development/pd-icon": "^0.7.4",
+    "@progressive-development/pd-icon": "^0.7.6",
     "@progressive-development/pd-shared-styles": "^0.2.5",
     "lit": "^3.3.0"
   },