@progressive-development/pd-dialog 1.0.2 → 1.1.0

package/dist/index.d.ts

@@ -6,6 +6,8 @@ export { BUTTON_KEY_CANCEL, BUTTON_KEY_CONFIRM, EVENT_CONFIRM, EVENT_CANCEL, } f
 export type { PdDialogType } from './pd-confirm-dialog/pd-confirm-dialog.js';
 export { PdFormDialog } from './pd-form-dialog/pd-form-dialog.js';
 export { EVENT_FORM_SUBMIT } from './pd-form-dialog/pd-form-dialog.js';
+export { PdAssistantInputBar } from './pd-assistant-input-bar/pd-assistant-input-bar.js';
+export { PdAssistantDialog } from './pd-assistant-dialog/pd-assistant-dialog.js';
 export type { PdDialogButton, PdSubmitDialogProps, PdSubmitDialogStatus, } from './types.js';
 export { templates as beTemplates } from './generated/locales/be.js';
 export { templates as deTemplates } from './generated/locales/de.js';

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AACjD,OAAO,EAAE,aAAa,EAAE,MAAM,sCAAsC,CAAC;AACrE,OAAO,EAAE,cAAc,EAAE,MAAM,wCAAwC,CAAC;AAGxE,OAAO,EAAE,eAAe,EAAE,MAAM,0CAA0C,CAAC;AAC3E,OAAO,EACL,iBAAiB,EACjB,kBAAkB,EAClB,aAAa,EACb,YAAY,GACb,MAAM,0CAA0C,CAAC;AAClD,YAAY,EAAE,YAAY,EAAE,MAAM,0CAA0C,CAAC;AAE7E,OAAO,EAAE,YAAY,EAAE,MAAM,oCAAoC,CAAC;AAClE,OAAO,EAAE,iBAAiB,EAAE,MAAM,oCAAoC,CAAC;AAGvE,YAAY,EACV,cAAc,EACd,mBAAmB,EACnB,oBAAoB,GACrB,MAAM,YAAY,CAAC;AAGpB,OAAO,EAAE,SAAS,IAAI,WAAW,EAAE,MAAM,2BAA2B,CAAC;AACrE,OAAO,EAAE,SAAS,IAAI,WAAW,EAAE,MAAM,2BAA2B,CAAC;AACrE,OAAO,EAAE,SAAS,IAAI,WAAW,EAAE,MAAM,2BAA2B,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AACjD,OAAO,EAAE,aAAa,EAAE,MAAM,sCAAsC,CAAC;AACrE,OAAO,EAAE,cAAc,EAAE,MAAM,wCAAwC,CAAC;AAGxE,OAAO,EAAE,eAAe,EAAE,MAAM,0CAA0C,CAAC;AAC3E,OAAO,EACL,iBAAiB,EACjB,kBAAkB,EAClB,aAAa,EACb,YAAY,GACb,MAAM,0CAA0C,CAAC;AAClD,YAAY,EAAE,YAAY,EAAE,MAAM,0CAA0C,CAAC;AAE7E,OAAO,EAAE,YAAY,EAAE,MAAM,oCAAoC,CAAC;AAClE,OAAO,EAAE,iBAAiB,EAAE,MAAM,oCAAoC,CAAC;AAGvE,OAAO,EAAE,mBAAmB,EAAE,MAAM,oDAAoD,CAAC;AACzF,OAAO,EAAE,iBAAiB,EAAE,MAAM,8CAA8C,CAAC;AAGjF,YAAY,EACV,cAAc,EACd,mBAAmB,EACnB,oBAAoB,GACrB,MAAM,YAAY,CAAC;AAGpB,OAAO,EAAE,SAAS,IAAI,WAAW,EAAE,MAAM,2BAA2B,CAAC;AACrE,OAAO,EAAE,SAAS,IAAI,WAAW,EAAE,MAAM,2BAA2B,CAAC;AACrE,OAAO,EAAE,SAAS,IAAI,WAAW,EAAE,MAAM,2BAA2B,CAAC"}

package/dist/index.js

@@ -3,9 +3,13 @@ import './pd-popup-dialog.js';
 import './pd-submit-dialog.js';
 export { BUTTON_KEY_CANCEL, BUTTON_KEY_CONFIRM, EVENT_CANCEL, EVENT_CONFIRM, PdConfirmDialog } from './pd-confirm-dialog/PdConfirmDialog.js';
 export { EVENT_FORM_SUBMIT, PdFormDialog } from './pd-form-dialog/PdFormDialog.js';
+import './pd-assistant-input-bar.js';
+import './pd-assistant-dialog.js';
 export { templates as beTemplates } from './locales/be.js';
 export { templates as deTemplates } from './locales/de.js';
 export { templates as enTemplates } from './locales/en.js';
+export { PdAssistantDialog } from './pd-assistant-dialog/PdAssistantDialog.js';
+export { PdAssistantInputBar } from './pd-assistant-input-bar/PdAssistantInputBar.js';
 export { PdPopup } from './pd-popup/PdPopup.js';
 export { PdPopupDialog } from './pd-popup-dialog/PdPopupDialog.js';
 export { PdSubmitDialog } from './pd-submit-dialog/PdSubmitDialog.js';

package/dist/pd-assistant-dialog/PdAssistantDialog.d.ts

@@ -0,0 +1,46 @@
+import { LitElement, CSSResultGroup, PropertyValues } from 'lit';
+/**
+ * Assistant-style dialog shell with header, scrollable content area, and input bar footer.
+ * Wraps pd-popup via composition. Reusable for AI chat, image search, etc.
+ *
+ * @tagname pd-assistant-dialog
+ * @summary Assistant dialog with header, content slot, and input bar.
+ *
+ * @event pd-assistant-dialog-close - Fired when dialog is closed.
+ * @event pd-assistant-submit - Bubbles from the input bar on submit.
+ *
+ * @slot - Default slot for main content (results, messages, etc.).
+ *
+ * @cssprop --pd-assistant-dialog-width - Dialog width. Default: `min(520px, 90vw)`.
+ * @cssprop --pd-assistant-dialog-content-min-height - Min content height. Default: `120px`.
+ * @cssprop --pd-assistant-dialog-content-max-height - Max content height. Default: `50vh`.
+ */
+export declare class PdAssistantDialog extends LitElement {
+    /** Whether the dialog is open. Reactive — controls pd-popup visibility. */
+    open: boolean;
+    /** Dialog title shown in the header. */
+    dialogTitle: string;
+    /** Icon displayed next to the title. */
+    dialogIcon: string;
+    /** Placeholder for the input bar. */
+    inputPlaceholder: string;
+    /** Button text for the input bar. */
+    inputButtonText: string;
+    /** Disable the input bar. */
+    inputDisabled: boolean;
+    /** Hide the input bar entirely. */
+    hideInput: boolean;
+    private _popup;
+    static styles: CSSResultGroup;
+    updated(changed: PropertyValues<this>): void;
+    render(): import('lit').TemplateResult<1>;
+    /** Open the dialog. */
+    show(): void;
+    /** Close the dialog. */
+    hide(): void;
+    /** Clear the input bar value. */
+    clearInput(): void;
+    private _onPopupClose;
+    private _onCloseKeyDown;
+}
+//# sourceMappingURL=PdAssistantDialog.d.ts.map

package/dist/pd-assistant-dialog/PdAssistantDialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PdAssistantDialog.d.ts","sourceRoot":"","sources":["../../src/pd-assistant-dialog/PdAssistantDialog.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EACL,UAAU,EAIV,cAAc,EACd,KAAK,cAAc,EACpB,MAAM,KAAK,CAAC;AAIb,OAAO,0CAA0C,CAAC;AAGlD,OAAO,yBAAyB,CAAC;AAEjC,OAAO,qDAAqD,CAAC;AAE7D;;;;;;;;;;;;;;;GAeG;AACH,qBAAa,iBAAkB,SAAQ,UAAU;IAC/C,2EAA2E;IAE3E,IAAI,UAAS;IAEb,wCAAwC;IAExC,WAAW,SAAM;IAEjB,wCAAwC;IAExC,UAAU,SAAM;IAEhB,qCAAqC;IAErC,gBAAgB,SAA6B;IAE7C,qCAAqC;IAErC,eAAe,SAAY;IAE3B,6BAA6B;IAE7B,aAAa,UAAS;IAEtB,mCAAmC;IAEnC,SAAS,UAAS;IAGlB,OAAO,CAAC,MAAM,CAAW;IAEzB,OAAgB,MAAM,EAAE,cAAc,CAsDpC;IAEO,OAAO,CAAC,OAAO,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAU5C,MAAM;IAgDf,uBAAuB;IAChB,IAAI,IAAI,IAAI;IAInB,wBAAwB;IACjB,IAAI,IAAI,IAAI;IAInB,iCAAiC;IAC1B,UAAU,IAAI,IAAI;IAOzB,OAAO,CAAC,aAAa;IAUrB,OAAO,CAAC,eAAe;CAMxB"}

package/dist/pd-assistant-dialog/PdAssistantDialog.js

@@ -0,0 +1,193 @@
+import { LitElement, css, nothing, html } from 'lit';
+import { property, query } from 'lit/decorators.js';
+import { pdIcons } from '@progressive-development/pd-icon';
+import '@progressive-development/pd-icon/pd-icon';
+import '../pd-popup.js';
+import '../pd-assistant-input-bar.js';
+
+var __defProp = Object.defineProperty;
+var __decorateClass = (decorators, target, key, kind) => {
+  var result = void 0 ;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators[i])
+      result = (decorator(target, key, result) ) || result;
+  if (result) __defProp(target, key, result);
+  return result;
+};
+class PdAssistantDialog extends LitElement {
+  constructor() {
+    super(...arguments);
+    this.open = false;
+    this.dialogTitle = "";
+    this.dialogIcon = "";
+    this.inputPlaceholder = "Suchbegriff eingeben...";
+    this.inputButtonText = "Suchen";
+    this.inputDisabled = false;
+    this.hideInput = false;
+  }
+  static {
+    this.styles = css`
+    :host {
+      display: contents;
+    }
+
+    pd-popup {
+      --pd-popup-width: var(--pd-assistant-dialog-width, min(520px, 90vw));
+      --pd-popup-max-width: var(--pd-assistant-dialog-width, min(520px, 90vw));
+      --pd-popup-modal-padding: 0;
+      --pd-popup-modal-padding-bottom: 0;
+      --pd-popup-modal-padding-top: 10vh;
+      --pd-popup-border-radius: 12px;
+      --pd-popup-modal-slot-max-width: 100%;
+      --pd-popup-modal-slot-margin: 0;
+    }
+
+    .dialog-header {
+      display: flex;
+      align-items: center;
+      gap: 8px;
+      padding: 16px 20px;
+      border-bottom: 1px solid var(--pd-default-light-col, #e0e0e0);
+    }
+
+    .dialog-header h3 {
+      margin: 0;
+      font-size: 1rem;
+      font-weight: 600;
+      flex: 1;
+    }
+
+    .dialog-header .header-icon {
+      --pd-icon-size: 1.25rem;
+      color: var(--pd-default-col, #0066cc);
+    }
+
+    .close-icon {
+      cursor: pointer;
+      --pd-icon-size: 1.25rem;
+    }
+
+    .close-icon:focus {
+      outline: 2px solid var(--pd-default-col);
+      outline-offset: 2px;
+      border-radius: var(--pd-radius-sm, 2px);
+    }
+
+    .dialog-content {
+      flex: 1;
+      overflow-y: auto;
+      min-height: var(--pd-assistant-dialog-content-min-height, 120px);
+      max-height: var(--pd-assistant-dialog-content-max-height, 50vh);
+      padding: 16px 20px;
+    }
+  `;
+  }
+  updated(changed) {
+    if (changed.has("open")) {
+      if (this.open) {
+        this._popup?.showPopup();
+      } else {
+        this._popup?.hidePopup();
+      }
+    }
+  }
+  render() {
+    return html`
+      <pd-popup
+        closeByEscape
+        closeByBackdrop
+        blockScroll
+        hideCloseIcon
+        popupLabel="${this.dialogTitle}"
+        @popup-close="${this._onPopupClose}"
+      >
+        <div slot="content">
+          <div class="dialog-header">
+            ${this.dialogIcon ? html`<pd-icon
+                  class="header-icon"
+                  .icon="${this.dialogIcon}"
+                ></pd-icon>` : nothing}
+            <h3>${this.dialogTitle}</h3>
+            <pd-icon
+              class="close-icon"
+              .icon="${pdIcons.ICON_CLOSE}"
+              tabindex="0"
+              role="button"
+              aria-label="Schließen"
+              @click="${this.hide}"
+              @keydown="${this._onCloseKeyDown}"
+            ></pd-icon>
+          </div>
+
+          <div class="dialog-content">
+            <slot></slot>
+          </div>
+
+          ${this.hideInput ? nothing : html`
+                <pd-assistant-input-bar
+                  placeholder="${this.inputPlaceholder}"
+                  buttonText="${this.inputButtonText}"
+                  ?disabled="${this.inputDisabled}"
+                ></pd-assistant-input-bar>
+              `}
+        </div>
+      </pd-popup>
+    `;
+  }
+  /** Open the dialog. */
+  show() {
+    this.open = true;
+  }
+  /** Close the dialog. */
+  hide() {
+    this.open = false;
+  }
+  /** Clear the input bar value. */
+  clearInput() {
+    const inputBar = this.renderRoot.querySelector(
+      "pd-assistant-input-bar"
+    );
+    inputBar?.clear();
+  }
+  _onPopupClose() {
+    this.open = false;
+    this.dispatchEvent(
+      new CustomEvent("pd-assistant-dialog-close", {
+        bubbles: true,
+        composed: true
+      })
+    );
+  }
+  _onCloseKeyDown(e) {
+    if (e.key === "Enter" || e.key === " ") {
+      e.preventDefault();
+      this.hide();
+    }
+  }
+}
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], PdAssistantDialog.prototype, "open");
+__decorateClass([
+  property({ type: String })
+], PdAssistantDialog.prototype, "dialogTitle");
+__decorateClass([
+  property({ type: String })
+], PdAssistantDialog.prototype, "dialogIcon");
+__decorateClass([
+  property({ type: String })
+], PdAssistantDialog.prototype, "inputPlaceholder");
+__decorateClass([
+  property({ type: String })
+], PdAssistantDialog.prototype, "inputButtonText");
+__decorateClass([
+  property({ type: Boolean })
+], PdAssistantDialog.prototype, "inputDisabled");
+__decorateClass([
+  property({ type: Boolean })
+], PdAssistantDialog.prototype, "hideInput");
+__decorateClass([
+  query("pd-popup")
+], PdAssistantDialog.prototype, "_popup");
+
+export { PdAssistantDialog };

package/dist/pd-assistant-dialog/pd-assistant-dialog.d.ts

@@ -0,0 +1,3 @@
+import { PdAssistantDialog } from './PdAssistantDialog.js';
+export { PdAssistantDialog };
+//# sourceMappingURL=pd-assistant-dialog.d.ts.map

package/dist/pd-assistant-dialog/pd-assistant-dialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"pd-assistant-dialog.d.ts","sourceRoot":"","sources":["../../src/pd-assistant-dialog/pd-assistant-dialog.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAO3D,OAAO,EAAE,iBAAiB,EAAE,CAAC"}

package/dist/pd-assistant-dialog.d.ts

@@ -0,0 +1,2 @@
+export * from './pd-assistant-dialog/pd-assistant-dialog'
+export {}

package/dist/pd-assistant-dialog.js

@@ -0,0 +1,8 @@
+import { PdAssistantDialog } from './pd-assistant-dialog/PdAssistantDialog.js';
+
+const tag = "pd-assistant-dialog";
+if (!customElements.get(tag)) {
+  customElements.define(tag, PdAssistantDialog);
+}
+
+export { PdAssistantDialog };

package/dist/pd-assistant-input-bar/PdAssistantInputBar.d.ts

@@ -0,0 +1,30 @@
+import { LitElement, CSSResultGroup } from 'lit';
+/**
+ * Input bar for assistant-style dialogs (search, chat).
+ *
+ * @tagname pd-assistant-input-bar
+ * @summary Text input with submit button for assistant dialogs.
+ *
+ * @event pd-assistant-submit - Fired on submit. Detail: `{ value: string }`.
+ *
+ * @cssprop --pd-assistant-input-bar-gap - Gap between input and button. Default: `8px`.
+ * @cssprop --pd-assistant-input-bar-padding - Bar padding. Default: `12px 20px 16px`.
+ */
+export declare class PdAssistantInputBar extends LitElement {
+    /** Placeholder text for the input field. */
+    placeholder: string;
+    /** Icon for the submit button. */
+    buttonIcon: any;
+    /** Button label text (shown if no icon, or as tooltip). */
+    buttonText: string;
+    /** Disable the input bar. */
+    disabled: boolean;
+    private _value;
+    static styles: CSSResultGroup;
+    render(): import('lit').TemplateResult<1>;
+    private _onInputChange;
+    private _onSubmit;
+    /** Clear the input field. */
+    clear(): void;
+}
+//# sourceMappingURL=PdAssistantInputBar.d.ts.map

package/dist/pd-assistant-input-bar/PdAssistantInputBar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PdAssistantInputBar.d.ts","sourceRoot":"","sources":["../../src/pd-assistant-input-bar/PdAssistantInputBar.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAE,UAAU,EAAa,cAAc,EAAE,MAAM,KAAK,CAAC;AAI5D,OAAO,0CAA0C,CAAC;AAClD,OAAO,4CAA4C,CAAC;AACpD,OAAO,6CAA6C,CAAC;AAErD;;;;;;;;;;GAUG;AACH,qBAAa,mBAAoB,SAAQ,UAAU;IACjD,4CAA4C;IAE5C,WAAW,SAA6B;IAExC,kCAAkC;IAElC,UAAU,MAAuB;IAEjC,2DAA2D;IAE3D,UAAU,SAAY;IAEtB,6BAA6B;IAE7B,QAAQ,UAAS;IAER,OAAO,CAAC,MAAM,CAAM;IAE7B,OAAgB,MAAM,EAAE,cAAc,CAiBpC;IAEO,MAAM;IAoBf,OAAO,CAAC,cAAc;IAItB,OAAO,CAAC,SAAS;IAajB,6BAA6B;IACtB,KAAK,IAAI,IAAI;CAGrB"}

package/dist/pd-assistant-input-bar/PdAssistantInputBar.js

@@ -0,0 +1,100 @@
+import { LitElement, css, html } from 'lit';
+import { property, state } from 'lit/decorators.js';
+import { pdIcons } from '@progressive-development/pd-icon';
+import '@progressive-development/pd-icon/pd-icon';
+import '@progressive-development/pd-forms/pd-input';
+import '@progressive-development/pd-forms/pd-button';
+
+var __defProp = Object.defineProperty;
+var __decorateClass = (decorators, target, key, kind) => {
+  var result = void 0 ;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators[i])
+      result = (decorator(target, key, result) ) || result;
+  if (result) __defProp(target, key, result);
+  return result;
+};
+class PdAssistantInputBar extends LitElement {
+  constructor() {
+    super(...arguments);
+    this.placeholder = "Suchbegriff eingeben...";
+    this.buttonIcon = pdIcons.ICON_SEARCH;
+    this.buttonText = "Suchen";
+    this.disabled = false;
+    this._value = "";
+  }
+  static {
+    this.styles = css`
+    :host {
+      display: block;
+    }
+
+    .input-row {
+      display: flex;
+      gap: var(--pd-assistant-input-bar-gap, 8px);
+      padding: var(--pd-assistant-input-bar-padding, 12px 20px 16px);
+      border-top: 1px solid var(--pd-default-light-col, #e0e0e0);
+      align-items: center;
+    }
+
+    .input-row pd-input {
+      flex: 1;
+      --pd-input-field-width: 100%;
+    }
+  `;
+  }
+  render() {
+    return html`
+      <div class="input-row">
+        <pd-input
+          placeHolder="${this.placeholder}"
+          .value="${this._value}"
+          ?disabled="${this.disabled}"
+          @pd-form-element-change="${this._onInputChange}"
+          @enter-pressed="${this._onSubmit}"
+        ></pd-input>
+        <pd-button
+          text="${this.buttonText}"
+          primary
+          ?disabled="${this.disabled || !this._value.trim()}"
+          @button-clicked="${this._onSubmit}"
+        ></pd-button>
+      </div>
+    `;
+  }
+  _onInputChange(e) {
+    this._value = e.detail.value;
+  }
+  _onSubmit() {
+    const value = this._value.trim();
+    if (!value || this.disabled) return;
+    this.dispatchEvent(
+      new CustomEvent("pd-assistant-submit", {
+        bubbles: true,
+        composed: true,
+        detail: { value }
+      })
+    );
+  }
+  /** Clear the input field. */
+  clear() {
+    this._value = "";
+  }
+}
+__decorateClass([
+  property({ type: String })
+], PdAssistantInputBar.prototype, "placeholder");
+__decorateClass([
+  property({ type: String })
+], PdAssistantInputBar.prototype, "buttonIcon");
+__decorateClass([
+  property({ type: String })
+], PdAssistantInputBar.prototype, "buttonText");
+__decorateClass([
+  property({ type: Boolean })
+], PdAssistantInputBar.prototype, "disabled");
+__decorateClass([
+  state()
+], PdAssistantInputBar.prototype, "_value");
+
+export { PdAssistantInputBar };

package/dist/pd-assistant-input-bar/pd-assistant-input-bar.d.ts

@@ -0,0 +1,3 @@
+import { PdAssistantInputBar } from './PdAssistantInputBar.js';
+export { PdAssistantInputBar };
+//# sourceMappingURL=pd-assistant-input-bar.d.ts.map

package/dist/pd-assistant-input-bar/pd-assistant-input-bar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"pd-assistant-input-bar.d.ts","sourceRoot":"","sources":["../../src/pd-assistant-input-bar/pd-assistant-input-bar.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;AAO/D,OAAO,EAAE,mBAAmB,EAAE,CAAC"}

package/dist/pd-assistant-input-bar.d.ts

@@ -0,0 +1,2 @@
+export * from './pd-assistant-input-bar/pd-assistant-input-bar'
+export {}

package/dist/pd-assistant-input-bar.js

@@ -0,0 +1,8 @@
+import { PdAssistantInputBar } from './pd-assistant-input-bar/PdAssistantInputBar.js';
+
+const tag = "pd-assistant-input-bar";
+if (!customElements.get(tag)) {
+  customElements.define(tag, PdAssistantInputBar);
+}
+
+export { PdAssistantInputBar };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progressive-development/pd-dialog",
-  "version": "1.0.2",
+  "version": "1.1.0",
   "description": "Progressive Development dialog components.",
   "author": "PD Progressive Development",
   "license": "MIT",
@@ -16,6 +16,8 @@
     "./pd-popup-dialog": "./dist/pd-popup-dialog.js",
     "./pd-popup": "./dist/pd-popup.js",
     "./pd-submit-dialog": "./dist/pd-submit-dialog.js",
+    "./pd-assistant-input-bar": "./dist/pd-assistant-input-bar.js",
+    "./pd-assistant-dialog": "./dist/pd-assistant-dialog.js",
     "./locales/be": "./dist/locales/be.js",
     "./locales/de": "./dist/locales/de.js",
     "./locales/en": "./dist/locales/en.js"
@@ -30,10 +32,10 @@
     "lit": "^3.3.1",
     "@lit/localize": "^0.12.2",
     "tslib": "^2.8.1",
-    "@progressive-development/pd-shared-styles": "0.3.2",
-    "@progressive-development/pd-icon": "1.0.2",
-    "@progressive-development/pd-forms": "1.0.2",
-    "@progressive-development/pd-price": "1.0.1"
+    "@progressive-development/pd-shared-styles": "0.4.0",
+    "@progressive-development/pd-price": "1.0.2",
+    "@progressive-development/pd-icon": "1.1.0",
+    "@progressive-development/pd-forms": "1.1.0"
   },
   "customElements": "custom-elements.json",
   "keywords": [

package/dist/pd-confirm-dialog/pd-confirm-dialog.stories.d.ts

@@ -1,107 +0,0 @@
-import { HTMLTemplateResult, CSSResultGroup } from 'lit';
-import { Meta, StoryObj } from '@storybook/web-components-vite';
-import { PdConfirmDialog, PdDialogType } from './PdConfirmDialog.js';
-/**
- * Example: Simple confirm dialog with warning
- */
-declare class ExampleDeleteConfirm extends PdConfirmDialog {
-    protected _dialogTitle: string;
-    protected _dialogType: PdDialogType;
-    protected _singleButton: boolean;
-    itemName: string;
-    protected _renderContent(): HTMLTemplateResult;
-}
-/**
- * Example: Info dialog with single button
- */
-declare class ExampleInfoDialog extends PdConfirmDialog {
-    protected _dialogTitle: string;
-    protected _dialogType: PdDialogType;
-    protected _singleButton: boolean;
-    message: string;
-    protected _renderContent(): HTMLTemplateResult;
-}
-/**
- * Example: Error dialog with custom content
- */
-declare class ExampleErrorDialog extends PdConfirmDialog {
-    protected _dialogTitle: string;
-    protected _dialogType: PdDialogType;
-    protected _singleButton: boolean;
-    errorCode: string;
-    errorMessage: string;
-    static styles: CSSResultGroup;
-    protected _renderContent(): HTMLTemplateResult;
-}
-/**
- * Example: Help dialog with formatted content
- */
-declare class ExampleHelpDialog extends PdConfirmDialog {
-    protected _dialogTitle: string;
-    protected _dialogType: PdDialogType;
-    protected _singleButton: boolean;
-    static styles: CSSResultGroup;
-    protected _renderContent(): HTMLTemplateResult;
-}
-declare global {
-    interface HTMLElementTagNameMap {
-        "example-delete-confirm": ExampleDeleteConfirm;
-        "example-info-dialog": ExampleInfoDialog;
-        "example-error-dialog": ExampleErrorDialog;
-        "example-help-dialog": ExampleHelpDialog;
-    }
-}
-/**
- * Story arguments interface for pd-confirm-dialog examples.
- * Maps to the example components' properties.
- */
-interface PdConfirmDialogArgs {
-    /** Item name for delete confirmation */
-    itemName: string;
-    /** Confirm button text */
-    confirmButtonText: string;
-    /** Cancel button text */
-    cancelButtonText: string;
-    /** Enable closing with Escape key */
-    closeByEscape: boolean;
-    /** Enable closing by clicking the backdrop */
-    closeByBackdrop: boolean;
-}
-/**
- * ## PdConfirmDialog (Abstract Base Class)
- *
- * Abstract base class for creating standardized confirmation dialogs.
- * Not used directly -- extend it and implement the required abstract members.
- *
- * ### Features
- * - Dialog types: info, warn, error, help with corresponding icons
- * - Two-button mode (confirm + cancel) or single-button mode
- * - Configurable button text via properties
- * - Escape key and backdrop click close support
- * - Standardized events: `pd-dialog-confirm` and `pd-dialog-cancel`
- *
- * ### How to Extend
- * Implement these abstract members:
- * - `_dialogTitle`: Dialog title string
- * - `_dialogType`: One of `"info" | "warn" | "error" | "help"`
- * - `_singleButton`: `true` for single confirm button, `false` for confirm + cancel
- * - `_renderContent()`: Returns the dialog body as `HTMLTemplateResult`
- *
- * ### Exported Constants
- * - `BUTTON_KEY_CONFIRM` / `BUTTON_KEY_CANCEL`: Button key identifiers
- * - `EVENT_CONFIRM` / `EVENT_CANCEL`: Event name constants
- */
-declare const meta: Meta<PdConfirmDialogArgs>;
-export default meta;
-type Story = StoryObj<PdConfirmDialogArgs>;
-/** Warning dialog with confirm and cancel buttons. Typical use case: Delete confirmation. */
-export declare const Default: Story;
-/** Overview of all four dialog types: warning, info, error, and help. */
-export declare const AllTypes: Story;
-/** Info dialog with single button -- typical success notification. */
-export declare const InfoNotification: Story;
-/** Error dialog with styled error details section. */
-export declare const ErrorWithDetails: Story;
-/** Help dialog with formatted keyboard shortcuts list. */
-export declare const HelpDialog: Story;
-//# sourceMappingURL=pd-confirm-dialog.stories.d.ts.map

package/dist/pd-confirm-dialog/pd-confirm-dialog.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"pd-confirm-dialog.stories.d.ts","sourceRoot":"","sources":["../../src/pd-confirm-dialog/pd-confirm-dialog.stories.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAa,kBAAkB,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAEpE,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAErE,OAAO,EACL,eAAe,EACf,YAAY,EAGb,MAAM,sBAAsB,CAAC;AAM9B;;GAEG;AACH,cACM,oBAAqB,SAAQ,eAAe;IAChD,SAAS,CAAC,YAAY,SAAiB;IACvC,SAAS,CAAC,WAAW,EAAE,YAAY,CAAU;IAC7C,SAAS,CAAC,aAAa,UAAS;IAGhC,QAAQ,SAAe;IAEvB,SAAS,CAAC,cAAc,IAAI,kBAAkB;CAM/C;AAED;;GAEG;AACH,cACM,iBAAkB,SAAQ,eAAe;IAC7C,SAAS,CAAC,YAAY,SAAiB;IACvC,SAAS,CAAC,WAAW,EAAE,YAAY,CAAU;IAC7C,SAAS,CAAC,aAAa,UAAQ;IAG/B,OAAO,SAAuC;IAE9C,SAAS,CAAC,cAAc,IAAI,kBAAkB;CAG/C;AAED;;GAEG;AACH,cACM,kBAAmB,SAAQ,eAAe;IAC9C,SAAS,CAAC,YAAY,SAAoB;IAC1C,SAAS,CAAC,WAAW,EAAE,YAAY,CAAW;IAC9C,SAAS,CAAC,aAAa,UAAQ;IAG/B,SAAS,SAAU;IAGnB,YAAY,SAAmC;IAE/C,MAAM,CAAC,MAAM,EAaR,cAAc,CAAC;IAEpB,SAAS,CAAC,cAAc,IAAI,kBAAkB;CAM/C;AAED;;GAEG;AACH,cACM,iBAAkB,SAAQ,eAAe;IAC7C,SAAS,CAAC,YAAY,SAAwB;IAC9C,SAAS,CAAC,WAAW,EAAE,YAAY,CAAU;IAC7C,SAAS,CAAC,aAAa,UAAQ;IAE/B,MAAM,CAAC,MAAM,EAoBR,cAAc,CAAC;IAEpB,SAAS,CAAC,cAAc,IAAI,kBAAkB;CAY/C;AAGD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,wBAAwB,EAAE,oBAAoB,CAAC;QAC/C,qBAAqB,EAAE,iBAAiB,CAAC;QACzC,sBAAsB,EAAE,kBAAkB,CAAC;QAC3C,qBAAqB,EAAE,iBAAiB,CAAC;KAC1C;CACF;AAMD;;;GAGG;AACH,UAAU,mBAAmB;IAC3B,wCAAwC;IACxC,QAAQ,EAAE,MAAM,CAAC;IACjB,0BAA0B;IAC1B,iBAAiB,EAAE,MAAM,CAAC;IAC1B,yBAAyB;IACzB,gBAAgB,EAAE,MAAM,CAAC;IACzB,qCAAqC;IACrC,aAAa,EAAE,OAAO,CAAC;IACvB,8CAA8C;IAC9C,eAAe,EAAE,OAAO,CAAC;CAC1B;AAMD;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,mBAAmB,CAgFnC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,mBAAmB,CAAC,CAAC;AAM3C,6FAA6F;AAC7F,eAAO,MAAM,OAAO,EAAE,KAUrB,CAAC;AAMF,yEAAyE;AACzE,eAAO,MAAM,QAAQ,EAAE,KAmDtB,CAAC;AAMF,sEAAsE;AACtE,eAAO,MAAM,gBAAgB,EAAE,KAoB9B,CAAC;AAMF,sDAAsD;AACtD,eAAO,MAAM,gBAAgB,EAAE,KAqB9B,CAAC;AAMF,0DAA0D;AAC1D,eAAO,MAAM,UAAU,EAAE,KAmBxB,CAAC"}

package/dist/pd-form-dialog/pd-form-dialog.stories.d.ts

@@ -1,118 +0,0 @@
-import { HTMLTemplateResult, CSSResultGroup } from 'lit';
-import { Meta, StoryObj } from '@storybook/web-components-vite';
-import { PdFormDialog } from './PdFormDialog.js';
-/**
- * Example: Contact form data interface
- */
-interface ContactFormData {
-    name: string;
-    email: string;
-    message: string;
-}
-/**
- * Example: Contact form dialog
- */
-declare class ExampleContactForm extends PdFormDialog<ContactFormData> {
-    protected _dialogTitle: string;
-    protected _formData: ContactFormData;
-    static styles: CSSResultGroup;
-    protected _isValidFormData(): boolean;
-    protected _renderContent(): HTMLTemplateResult;
-}
-/**
- * Example: User profile form data interface
- */
-interface ProfileFormData {
-    displayName: string;
-    bio: string;
-    language: string;
-}
-/**
- * Example: User profile form dialog
- */
-declare class ExampleProfileForm extends PdFormDialog<ProfileFormData> {
-    protected _dialogTitle: string;
-    protected _formData: ProfileFormData;
-    static styles: CSSResultGroup;
-    protected _isValidFormData(): boolean;
-    protected _renderContent(): HTMLTemplateResult;
-}
-/**
- * Example: Simple feedback form data interface
- */
-interface FeedbackFormData {
-    rating: string;
-    feedback: string;
-}
-/**
- * Example: Feedback form dialog with custom rating UI
- */
-declare class ExampleFeedbackForm extends PdFormDialog<FeedbackFormData> {
-    protected _dialogTitle: string;
-    protected _formData: FeedbackFormData;
-    static styles: CSSResultGroup;
-    protected _isValidFormData(): boolean;
-    private _selectRating;
-    protected _renderContent(): HTMLTemplateResult;
-}
-declare global {
-    interface HTMLElementTagNameMap {
-        "example-contact-form": ExampleContactForm;
-        "example-profile-form": ExampleProfileForm;
-        "example-feedback-form": ExampleFeedbackForm;
-    }
-}
-/**
- * Story arguments interface for pd-form-dialog examples.
- * Maps to the example components' properties.
- */
-interface PdFormDialogArgs {
-    /** Save button text */
-    saveButtonText: string;
-    /** Cancel button text */
-    cancelButtonText: string;
-    /** Show required field info text */
-    showRequiredFieldInfo: boolean;
-    /** Double-submit prevention timeout in ms */
-    submitDisableTimeout: number;
-}
-/**
- * ## PdFormDialog<T> (Abstract Base Class)
- *
- * Generic abstract base class for form dialogs with integrated validation.
- * Not used directly -- extend it with a type parameter for your form data.
- *
- * ### Features
- * - Integrated form validation via `pd-form-container`
- * - Save button automatically disabled until form is valid
- * - Double-submit prevention with configurable timeout
- * - Type-safe form data handling via generic `T` parameter
- * - Standardized events: `pd-form-submit` (with typed payload) and `pd-dialog-cancel`
- * - Required field info display (optional)
- *
- * ### How to Extend
- * Implement these abstract members:
- * - `_dialogTitle`: Dialog title string
- * - `_formData`: Your typed form data object
- * - `_isValidFormData()`: Additional validation beyond field-level validation
- * - `_renderContent()`: Returns form fields as `HTMLTemplateResult`
- *
- * ### Validation Flow
- * 1. Each form field validates individually (via pd-form-container)
- * 2. `_isValidFormData()` runs additional cross-field validation
- * 3. Save button enables only when both pass
- */
-declare const meta: Meta<PdFormDialogArgs>;
-export default meta;
-type Story = StoryObj<PdFormDialogArgs>;
-/** Contact form dialog with name, email, and message fields. Interactive via Controls panel. */
-export declare const Default: Story;
-/** User profile form with display name, bio, and language selection. */
-export declare const ProfileForm: Story;
-/** Feedback form with custom rating buttons and optional text area. */
-export declare const FeedbackForm: Story;
-/** Overview of all three form dialog implementations side by side. */
-export declare const AllForms: Story;
-/** Demonstrates the validation flow: Save button is disabled until form is valid. */
-export declare const ValidationBehavior: Story;
-//# sourceMappingURL=pd-form-dialog.stories.d.ts.map

package/dist/pd-form-dialog/pd-form-dialog.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"pd-form-dialog.stories.d.ts","sourceRoot":"","sources":["../../src/pd-form-dialog/pd-form-dialog.stories.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAa,kBAAkB,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAEpE,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAErE,OAAO,4CAA4C,CAAC;AACpD,OAAO,iDAAiD,CAAC;AACzD,OAAO,6CAA6C,CAAC;AAErD,OAAO,EAAE,YAAY,EAAqB,MAAM,mBAAmB,CAAC;AAOpE;;GAEG;AACH,UAAU,eAAe;IACvB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,CAAC;CACjB;AAED;;GAEG;AACH,cACM,kBAAmB,SAAQ,YAAY,CAAC,eAAe,CAAC;IAC5D,SAAS,CAAC,YAAY,SAAgB;IAGtC,SAAS,CAAC,SAAS,EAAE,eAAe,CAIlC;IAEF,MAAM,CAAC,MAAM,EASR,cAAc,CAAC;IAEpB,SAAS,CAAC,gBAAgB,IAAI,OAAO;IAIrC,SAAS,CAAC,cAAc,IAAI,kBAAkB;CA4B/C;AAED;;GAEG;AACH,UAAU,eAAe;IACvB,WAAW,EAAE,MAAM,CAAC;IACpB,GAAG,EAAE,MAAM,CAAC;IACZ,QAAQ,EAAE,MAAM,CAAC;CAClB;AAED;;GAEG;AACH,cACM,kBAAmB,SAAQ,YAAY,CAAC,eAAe,CAAC;IAC5D,SAAS,CAAC,YAAY,SAAkB;IAGxC,SAAS,CAAC,SAAS,EAAE,eAAe,CAIlC;IAEF,MAAM,CAAC,MAAM,EASR,cAAc,CAAC;IAEpB,SAAS,CAAC,gBAAgB,IAAI,OAAO;IAIrC,SAAS,CAAC,cAAc,IAAI,kBAAkB;CAgC/C;AAED;;GAEG;AACH,UAAU,gBAAgB;IACxB,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,MAAM,CAAC;CAClB;AAED;;GAEG;AACH,cACM,mBAAoB,SAAQ,YAAY,CAAC,gBAAgB,CAAC;IAC9D,SAAS,CAAC,YAAY,SAAqB;IAG3C,SAAS,CAAC,SAAS,EAAE,gBAAgB,CAGnC;IAEF,MAAM,CAAC,MAAM,EA6BR,cAAc,CAAC;IAEpB,SAAS,CAAC,gBAAgB,IAAI,OAAO;IAIrC,OAAO,CAAC,aAAa;IAKrB,SAAS,CAAC,cAAc,IAAI,kBAAkB;CAiC/C;AAGD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,sBAAsB,EAAE,kBAAkB,CAAC;QAC3C,sBAAsB,EAAE,kBAAkB,CAAC;QAC3C,uBAAuB,EAAE,mBAAmB,CAAC;KAC9C;CACF;AAMD;;;GAGG;AACH,UAAU,gBAAgB;IACxB,uBAAuB;IACvB,cAAc,EAAE,MAAM,CAAC;IACvB,yBAAyB;IACzB,gBAAgB,EAAE,MAAM,CAAC;IACzB,oCAAoC;IACpC,qBAAqB,EAAE,OAAO,CAAC;IAC/B,6CAA6C;IAC7C,oBAAoB,EAAE,MAAM,CAAC;CAC9B;AAMD;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,gBAAgB,CA0GhC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,gBAAgB,CAAC,CAAC;AAMxC,gGAAgG;AAChG,eAAO,MAAM,OAAO,EAAE,KASrB,CAAC;AAMF,wEAAwE;AACxE,eAAO,MAAM,WAAW,EAAE,KAoBzB,CAAC;AAMF,uEAAuE;AACvE,eAAO,MAAM,YAAY,EAAE,KAqB1B,CAAC;AAMF,sEAAsE;AACtE,eAAO,MAAM,QAAQ,EAAE,KAwCtB,CAAC;AAMF,qFAAqF;AACrF,eAAO,MAAM,kBAAkB,EAAE,KA6BhC,CAAC"}

package/dist/pd-popup/pd-popup.stories.d.ts

@@ -1,58 +0,0 @@
-import { Meta, StoryObj } from '@storybook/web-components-vite';
-/**
- * Story arguments interface for pd-popup component.
- * Maps to the component's public API.
- */
-interface PdPopupArgs {
-    /** Content for the trigger slot */
-    smallViewSlot: string;
-    /** Content displayed in the popup */
-    contentSlot: string;
-    /** Enable closing with Escape key */
-    closeByEscape: boolean;
-    /** Enable closing by clicking the backdrop overlay */
-    closeByBackdrop: boolean;
-    /** Hide the built-in close icon */
-    hideCloseIcon: boolean;
-    /** Block body scroll when popup is open */
-    blockScroll: boolean;
-    /** Accessible label for the popup */
-    popupLabel: string;
-}
-/**
- * ## pd-popup
- *
- * A modal popup component triggered by clicking a slot element.
- *
- * ### Features
- * - Trigger element via `small-view` slot (click to open)
- * - Full-screen modal overlay with centered content
- * - Built-in close icon (keyboard accessible, can be hidden)
- * - Optional close on Escape key press (`closeByEscape`)
- * - Optional close on backdrop click (`closeByBackdrop`)
- * - Programmatic control via `showPopup()` and `hidePopup()` methods
- * - Body scroll blocking when open (`blockScroll`)
- * - Accessibility: `role="dialog"`, `aria-modal="true"`, `aria-label`
- *
- * ### Accessibility
- * - Uses `role="dialog"` and `aria-modal="true"` on the modal container
- * - `aria-label` set via `popupLabel` property
- * - Close icon is keyboard focusable with `role="button"` and `aria-label`
- * - Supports Escape key and backdrop click for closing
- */
-declare const meta: Meta<PdPopupArgs>;
-export default meta;
-type Story = StoryObj<PdPopupArgs>;
-/** Default popup with simple text content. Interactive via Controls panel. */
-export declare const Default: Story;
-/** Popup with structured HTML content including headings, text, and lists. */
-export declare const RichContent: Story;
-/** Demonstrates the three closing mechanisms: close icon, Escape key, and backdrop click. */
-export declare const ClosingOptions: Story;
-/** Popup with the built-in close icon hidden. Content provides its own close mechanism. */
-export declare const HiddenCloseIcon: Story;
-/** Demonstrates opening and closing the popup programmatically via `showPopup()` / `hidePopup()`. */
-export declare const ProgrammaticControl: Story;
-/** CSS Custom Properties -- Branded and Redesigned variants. */
-export declare const CustomStyling: Story;
-//# sourceMappingURL=pd-popup.stories.d.ts.map

package/dist/pd-popup/pd-popup.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"pd-popup.stories.d.ts","sourceRoot":"","sources":["../../src/pd-popup/pd-popup.stories.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAGrE,OAAO,eAAe,CAAC;AAMvB;;;GAGG;AACH,UAAU,WAAW;IACnB,mCAAmC;IACnC,aAAa,EAAE,MAAM,CAAC;IACtB,qCAAqC;IACrC,WAAW,EAAE,MAAM,CAAC;IACpB,qCAAqC;IACrC,aAAa,EAAE,OAAO,CAAC;IACvB,sDAAsD;IACtD,eAAe,EAAE,OAAO,CAAC;IACzB,mCAAmC;IACnC,aAAa,EAAE,OAAO,CAAC;IACvB,2CAA2C;IAC3C,WAAW,EAAE,OAAO,CAAC;IACrB,qCAAqC;IACrC,UAAU,EAAE,MAAM,CAAC;CACpB;AAMD;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,WAAW,CA8F3B,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,WAAW,CAAC,CAAC;AAMnC,8EAA8E;AAC9E,eAAO,MAAM,OAAO,EAAE,KAAU,CAAC;AAMjC,8EAA8E;AAC9E,eAAO,MAAM,WAAW,EAAE,KA8BzB,CAAC;AAMF,6FAA6F;AAC7F,eAAO,MAAM,cAAc,EAAE,KAiE5B,CAAC;AAMF,2FAA2F;AAC3F,eAAO,MAAM,eAAe,EAAE,KA6B7B,CAAC;AAMF,qGAAqG;AACrG,eAAO,MAAM,mBAAmB,EAAE,KA6CjC,CAAC;AAMF,gEAAgE;AAChE,eAAO,MAAM,aAAa,EAAE,KAyG3B,CAAC"}

package/dist/pd-popup-dialog/pd-popup-dialog.stories.d.ts

@@ -1,55 +0,0 @@
-import { Meta, StoryObj } from '@storybook/web-components-vite';
-import { PdDialogButton } from '../types.js';
-/**
- * Story arguments interface for pd-popup-dialog component.
- * Maps to the component's public API.
- */
-interface PdPopupDialogArgs {
-    /** Dialog title text */
-    title: string;
-    /** Dialog type: info, warn, error, help */
-    type: "info" | "warn" | "error" | "help";
-    /** Footer button configurations */
-    buttons: PdDialogButton[];
-    /** Enable closing with Escape key */
-    closeByEscape: boolean;
-    /** Enable closing by clicking the backdrop overlay */
-    closeByBackdrop: boolean;
-}
-/**
- * ## pd-popup-dialog
- *
- * A structured modal dialog with colored header, content slot, and configurable footer buttons.
- *
- * ### Features
- * - Dialog types: info, warn, error, help (each with corresponding icon)
- * - Colored header with icon and title text
- * - Content area via `content` slot
- * - Configurable footer buttons via `buttons` array property
- * - Optional close on Escape key (`closeByEscape`)
- * - Optional close on backdrop click (`closeByBackdrop`)
- * - Programmatic control via `showPopup()` / `hidePopup()` methods
- * - Mobile-responsive: buttons stack vertically on small screens
- *
- * ### Accessibility
- * - Uses `role="dialog"` and `aria-modal="true"`
- * - Title linked via `aria-labelledby` for screen readers
- * - Footer buttons use native `<pd-button>` with keyboard support
- * - Escape key close support
- */
-declare const meta: Meta<PdPopupDialogArgs>;
-export default meta;
-type Story = StoryObj<PdPopupDialogArgs>;
-/** Default info dialog with OK and Cancel buttons. Interactive via Controls panel. */
-export declare const Default: Story;
-/** All four dialog types with their corresponding icons side by side. */
-export declare const AllTypes: Story;
-/** Different footer button configurations: single, two, and three buttons. */
-export declare const ButtonConfigurations: Story;
-/** Demonstrates opening/closing the dialog programmatically via `showPopup()` / `hidePopup()`. */
-export declare const ProgrammaticControl: Story;
-/** Dialog with a long title that wraps to multiple lines. */
-export declare const LongTitle: Story;
-/** CSS Custom Properties -- Branded and Redesigned variants. */
-export declare const CustomStyling: Story;
-//# sourceMappingURL=pd-popup-dialog.stories.d.ts.map

package/dist/pd-popup-dialog/pd-popup-dialog.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"pd-popup-dialog.stories.d.ts","sourceRoot":"","sources":["../../src/pd-popup-dialog/pd-popup-dialog.stories.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAGrE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAElD,OAAO,sBAAsB,CAAC;AAM9B;;;GAGG;AACH,UAAU,iBAAiB;IACzB,wBAAwB;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,2CAA2C;IAC3C,IAAI,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,MAAM,CAAC;IACzC,mCAAmC;IACnC,OAAO,EAAE,cAAc,EAAE,CAAC;IAC1B,qCAAqC;IACrC,aAAa,EAAE,OAAO,CAAC;IACvB,sDAAsD;IACtD,eAAe,EAAE,OAAO,CAAC;CAC1B;AAyBD;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,iBAAiB,CA+FjC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,iBAAiB,CAAC,CAAC;AAMzC,sFAAsF;AACtF,eAAO,MAAM,OAAO,EAAE,KAAU,CAAC;AAMjC,yEAAyE;AACzE,eAAO,MAAM,QAAQ,EAAE,KA0DtB,CAAC;AAMF,8EAA8E;AAC9E,eAAO,MAAM,oBAAoB,EAAE,KA+DlC,CAAC;AAMF,kGAAkG;AAClG,eAAO,MAAM,mBAAmB,EAAE,KAyDjC,CAAC;AAMF,6DAA6D;AAC7D,eAAO,MAAM,SAAS,EAAE,KAevB,CAAC;AAMF,gEAAgE;AAChE,eAAO,MAAM,aAAa,EAAE,KA4H3B,CAAC"}

package/dist/pd-submit-dialog/pd-submit-dialog.stories.d.ts

@@ -1,50 +0,0 @@
-import { Meta, StoryObj } from '@storybook/web-components-vite';
-import { PdSubmitDialogStatus } from '../types.js';
-/**
- * Story arguments interface for pd-submit-dialog component.
- * Maps to the component's public API.
- */
-interface PdSubmitDialogArgs {
-    /** Dialog title text */
-    title: string;
-    /** Current status: SEND (1), SUCCESS (2), or FAILED (3) */
-    status: PdSubmitDialogStatus;
-    /** Optional status message text */
-    statusMsg: string;
-    /** Confirmation email address */
-    confirmMail: string;
-    /** Custom progress text map */
-    progressTxtMap: Map<number, string>;
-}
-/**
- * ## pd-submit-dialog
- *
- * A progress dialog that shows loading, success, and failure states during async operations.
- *
- * ### Features
- * - Three progress states: SEND (loading spinner), SUCCESS (check icon), FAILED (error icon)
- * - Custom progress text per state via `progressTxtMap`
- * - Optional status message below the progress indicator
- * - Dynamic footer buttons based on current status (no buttons while loading)
- * - Content slot for additional information above the progress area
- * - Built on top of `pd-popup-dialog`
- *
- * ### Status Flow
- * 1. `PdSubmitDialogStatus.SEND` (1) -- Loading spinner, no buttons
- * 2. `PdSubmitDialogStatus.SUCCESS` (2) -- Success icon, "Close" button
- * 3. `PdSubmitDialogStatus.FAILED` (3) -- Error icon, action buttons
- */
-declare const meta: Meta<PdSubmitDialogArgs>;
-export default meta;
-type Story = StoryObj<PdSubmitDialogArgs>;
-/** Default submit dialog in sending state with loading spinner. Interactive via Controls panel. */
-export declare const Default: Story;
-/** All three progress states side by side: Sending, Success, and Failed. */
-export declare const AllStates: Story;
-/** Dialog in success state with check icon and Close button. */
-export declare const SuccessState: Story;
-/** Dialog in failed state with error icon, status message, and action buttons. */
-export declare const FailedState: Story;
-/** Demonstrates the `submit-content` slot with rich HTML content above the progress area. */
-export declare const WithSlotContent: Story;
-//# sourceMappingURL=pd-submit-dialog.stories.d.ts.map

package/dist/pd-submit-dialog/pd-submit-dialog.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"pd-submit-dialog.stories.d.ts","sourceRoot":"","sources":["../../src/pd-submit-dialog/pd-submit-dialog.stories.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAGrE,OAAO,EAAE,oBAAoB,EAAE,MAAM,aAAa,CAAC;AAEnD,OAAO,uBAAuB,CAAC;AAM/B;;;GAGG;AACH,UAAU,kBAAkB;IAC1B,wBAAwB;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,2DAA2D;IAC3D,MAAM,EAAE,oBAAoB,CAAC;IAC7B,mCAAmC;IACnC,SAAS,EAAE,MAAM,CAAC;IAClB,iCAAiC;IACjC,WAAW,EAAE,MAAM,CAAC;IACpB,+BAA+B;IAC/B,cAAc,EAAE,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;CACrC;AAsBD;;;;;;;;;;;;;;;;;GAiBG;AACH,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,kBAAkB,CA0FlC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,kBAAkB,CAAC,CAAC;AAM1C,mGAAmG;AACnG,eAAO,MAAM,OAAO,EAAE,KAAU,CAAC;AAMjC,4EAA4E;AAC5E,eAAO,MAAM,SAAS,EAAE,KA0DvB,CAAC;AAMF,gEAAgE;AAChE,eAAO,MAAM,YAAY,EAAE,KA2B1B,CAAC;AAMF,kFAAkF;AAClF,eAAO,MAAM,WAAW,EAAE,KA2BzB,CAAC;AAMF,6FAA6F;AAC7F,eAAO,MAAM,eAAe,EAAE,KAoC7B,CAAC"}