@progressive-development/pd-order 0.9.2 → 1.0.0

package/LICENSE

@@ -1,2 +1,21 @@
-No License, all rights reserved
-@2021 - PD Progressive Development UG
+MIT License
+
+Copyright (c) 2021-present PD Progressive Development UG
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,76 +1,50 @@
-# \<pd-order>
+# @progressive-development/pd-order
 
-This webcomponent follows the [open-wc](https://github.com/open-wc/open-wc) recommendation.
+[![npm version](https://img.shields.io/npm/v/@progressive-development/pd-order.svg)](https://www.npmjs.com/package/@progressive-development/pd-order)
+[![License: MIT](https://img.shields.io/badge/License-MIT-blue.svg)](LICENSE)
+
+Order flow components for multi-address management and order summaries.
+
+## Features
+
+- **Lit 3 & TypeScript** – Modern, type-safe web components
+- **Accessible** – WCAG 2.1 compliant, keyboard navigation, ARIA support
+- **Themeable** – CSS Custom Properties for easy customization
+- **Localized** – Built-in i18n support (EN, DE, BE)
+- **Lightweight** – No heavy dependencies, tree-shakeable
+- **Framework-agnostic** – Works with React, Vue, Angular, or vanilla JS
+- **Multi-Address Management** – Handle customer, billing, property, and manager addresses with smart fallbacks
+- **Property Owner Scenarios** – Specialized fields for landlord workflows with conditional address sections
+- **Dual Display Modes** – Switch between full edit form and compact summary view
+- **Order Summary with Terms** – Price table integration, tax display, and legal consent checkbox with modal
 
 ## Installation
 
 ```bash
-npm i pd-order
+npm install @progressive-development/pd-order
 ```
 
-## Usage
+## Quick Start
 
 ```html
 <script type="module">
-  import 'pd-order/pd-order.js';
+  import '@progressive-development/pd-order';
 </script>
 
-<pd-order></pd-order>
+<pd-order-contacts></pd-order-contacts>
 ```
 
-## Linting and formatting
+## Components
 
-To scan the project for linting and formatting errors, run
+| Component | Description |
+|-----------|-------------|
+| `<pd-order-contacts>` | Multi-address contact management |
+| `<pd-order-summary>` | Order overview with pricing and terms |
 
-```bash
-npm run lint
-```
-
-To automatically fix linting and formatting errors, run
-
-```bash
-npm run format
-```
+## Documentation
 
-## Testing with Web Test Runner
-
-To execute a single test run:
-
-```bash
-npm run test
-```
-
-To run the tests in interactive watch mode run:
-
-```bash
-npm run test:watch
-```
+📖 **Full documentation:** [pd-components.web.app](https://pd-components.web.app/)
 
-## Demoing with Storybook
-
-To run a local instance of Storybook for your component, run
-
-```bash
-npm run storybook
-```
-
-To build a production version of Storybook, run
-
-```bash
-npm run storybook:build
-```
-
-
-## Tooling configs
-
-For most of the tools, the configuration is in the `package.json` to minimize the amount of files in your project.
-
-If you customize the configuration a lot, you can consider moving them to individual files.
-
-## Local Demo with `web-dev-server`
-
-```bash
-npm start
-```
+## License
 
-To run a local development server that serves the basic demo located in `demo/index.html`
+MIT © [PD Progressive Development UG](https://progressive-development.com)

package/dist/pd-order-contacts/PdOrderContacts.d.ts

@@ -1,37 +1,41 @@
 import { LitElement, CSSResultGroup, PropertyValues } from 'lit';
 import { PdContactData, PdContactMatch } from '@progressive-development/pd-contact';
 /**
- * Renders and manages contact input sections for order processing.
- * Supports optional billing address, property owner info and admin contact.
+ * Order contact management with multiple address sections.
  *
- * @fires validate-form - Triggers validation of embedded contact components.
- * @slot - General slot
  * @tagname pd-order-contacts
+ * @summary Multi-contact form with order, billing, admin, and property addresses.
+ *
+ * @event validate-form - Fired during contact validation.
  */
 export declare class PdOrderContacts extends LitElement {
-    /** Zeigt die Komponente im Zusammenfassungsmodus (read-only) */
+    /** Show read-only summary mode */
     summary: boolean;
-    /** Überschriften für die einzelnen Kontaktsektionen */
+    /** Section title overrides for contact headers */
     contactTitle: Record<string, string>;
-    /** Liste erforderlicher Eingabefelder je Kontakt (z.B. ['street', 'zip']) */
+    /** Required field names per contact (e.g., ['street', 'zip']) */
     requiredFields: string[];
-    /** Kontaktadresse des Auftraggebers */
+    /** Primary order contact data */
     orderContact?: PdContactData;
-    /** Optionale separate Rechnungsadresse */
+    /** Optional separate billing address */
     billingContact?: PdContactData;
-    /** Optionale Verwaltungsadresse */
+    /** Optional admin/management contact */
     adminContact?: PdContactData;
-    /** Adresse der Immobilie, falls abweichend */
+    /** Property address if different from order address */
     propertyContact?: PdContactData;
-    /** Aktiviert die Option zur separaten Rechnungsadresse */
+    /** Enable billing address option */
     withPayment: boolean;
-    /** Aktiviert die Option zur Verwaltung von Vermieterinformationen */
+    /** Enable property owner/landlord options */
     withPropertyOwner: boolean;
+    /** Enable property date field */
     withPropertyDate: boolean;
-    /** Optionaler Match-Parameter zur Feldvalidierung oder Mapping-Zwecken */
+    /** Optional field validation/mapping configuration */
     match?: PdContactMatch;
+    /** @ignore */
     private _ownBillingContact;
+    /** @ignore */
     private _ownAdminContact;
+    /** @ignore */
     private _isPropertyOwner;
     static styles: CSSResultGroup;
     update(changedProps: PropertyValues<this>): void;

package/dist/pd-order-contacts/PdOrderContacts.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PdOrderContacts.d.ts","sourceRoot":"","sources":["../../src/pd-order-contacts/PdOrderContacts.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,UAAU,EAIV,cAAc,EACd,cAAc,EACf,MAAM,KAAK,CAAC;AAIb,OAAO,uDAAuD,CAAC;AAC/D,OAAO,iDAAiD,CAAC;AACzD,OAAO,gDAAgD,CAAC;AACxD,OAAO,+CAA+C,CAAC;AAIvD,OAAO,EAEL,aAAa,EACb,cAAc,EACf,MAAM,qCAAqC,CAAC;AAE7C;;;;;;;GAOG;AACH,qBACa,eAAgB,SAAQ,UAAU;IAC7C,gEAAgE;IAEhE,OAAO,UAAS;IAEhB,uDAAuD;IAEvD,YAAY,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAM;IAE1C,6EAA6E;IAE7E,cAAc,EAAE,MAAM,EAAE,CAAM;IAE9B,uCAAuC;IAEvC,YAAY,CAAC,EAAE,aAAa,CAAC;IAE7B,0CAA0C;IAE1C,cAAc,CAAC,EAAE,aAAa,CAAC;IAE/B,mCAAmC;IAEnC,YAAY,CAAC,EAAE,aAAa,CAAC;IAE7B,8CAA8C;IAE9C,eAAe,CAAC,EAAE,aAAa,CAAC;IAEhC,0DAA0D;IAE1D,WAAW,UAAS;IAEpB,qEAAqE;IAErE,iBAAiB,UAAS;IAG1B,gBAAgB,UAAS;IAEzB,0EAA0E;IAE1E,KAAK,CAAC,EAAE,cAAc,CAAC;IAGvB,OAAO,CAAC,kBAAkB,CAAS;IAGnC,OAAO,CAAC,gBAAgB,CAAS;IAGjC,OAAO,CAAC,gBAAgB,CAAS;IAEjC,OAAgB,MAAM,EAAE,cAAc,CA+CpC;IAEO,MAAM,CAAC,YAAY,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAazD,SAAS,CAAC,MAAM;IAIhB,OAAO,CAAC,mBAAmB;IAiK3B,OAAO,CAAC,cAAc;IA+CtB,IAAI,KAAK,IAAI,OAAO,CASnB;IAEY,eAAe,IAAI,OAAO,CAAC,OAAO,CAAC;IAkCzC,SAAS;IAWhB,OAAO,CAAC,eAAe;CAoBxB"}
+{"version":3,"file":"PdOrderContacts.d.ts","sourceRoot":"","sources":["../../src/pd-order-contacts/PdOrderContacts.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,UAAU,EAIV,cAAc,EACd,cAAc,EACf,MAAM,KAAK,CAAC;AAIb,OAAO,uDAAuD,CAAC;AAC/D,OAAO,iDAAiD,CAAC;AACzD,OAAO,gDAAgD,CAAC;AACxD,OAAO,+CAA+C,CAAC;AAIvD,OAAO,EAEL,aAAa,EACb,cAAc,EACf,MAAM,qCAAqC,CAAC;AAE7C;;;;;;;GAOG;AACH,qBACa,eAAgB,SAAQ,UAAU;IAC7C,kCAAkC;IAElC,OAAO,UAAS;IAEhB,kDAAkD;IAElD,YAAY,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAM;IAE1C,iEAAiE;IAEjE,cAAc,EAAE,MAAM,EAAE,CAAM;IAE9B,iCAAiC;IAEjC,YAAY,CAAC,EAAE,aAAa,CAAC;IAE7B,wCAAwC;IAExC,cAAc,CAAC,EAAE,aAAa,CAAC;IAE/B,wCAAwC;IAExC,YAAY,CAAC,EAAE,aAAa,CAAC;IAE7B,uDAAuD;IAEvD,eAAe,CAAC,EAAE,aAAa,CAAC;IAEhC,oCAAoC;IAEpC,WAAW,UAAS;IAEpB,6CAA6C;IAE7C,iBAAiB,UAAS;IAE1B,iCAAiC;IAEjC,gBAAgB,UAAS;IAEzB,sDAAsD;IAEtD,KAAK,CAAC,EAAE,cAAc,CAAC;IAEvB,cAAc;IAEd,OAAO,CAAC,kBAAkB,CAAS;IAEnC,cAAc;IAEd,OAAO,CAAC,gBAAgB,CAAS;IAEjC,cAAc;IAEd,OAAO,CAAC,gBAAgB,CAAS;IAEjC,OAAgB,MAAM,EAAE,cAAc,CA+CpC;IAEO,MAAM,CAAC,YAAY,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAazD,SAAS,CAAC,MAAM;IAIhB,OAAO,CAAC,mBAAmB;IAiK3B,OAAO,CAAC,cAAc;IA+CtB,IAAI,KAAK,IAAI,OAAO,CASnB;IAEY,eAAe,IAAI,OAAO,CAAC,OAAO,CAAC;IAkCzC,SAAS;IAWhB,OAAO,CAAC,eAAe;CAoBxB"}

package/dist/pd-order-contacts/PdOrderContacts.js

@@ -325,12 +325,12 @@ PdOrderContacts.styles = [
       }
 
       .property-owner-box {
-        border: 2px solid #007b8f;
-        border-radius: 8px;
-        padding: 16px;
-        margin: 16px 0;
-        background-color: #f8fafb;
-        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+        border: 2px solid var(--pd-default-col);
+        border-radius: var(--pd-radius-lg);
+        padding: var(--pd-spacing-lg);
+        margin: var(--pd-spacing-lg) 0;
+        background-color: var(--pd-default-bg-light-col);
+        box-shadow: var(--pd-shadow-md);
       }
     `
 ];

package/dist/pd-order-contacts/pd-order-contacts.stories.d.ts

@@ -1,17 +1,65 @@
-import { Meta, StoryFn } from '@storybook/web-components';
-import { PdOrderContacts } from './pd-order-contacts';
-declare const _default: Meta<PdOrderContacts>;
-export default _default;
-export declare const Default: StoryFn<PdOrderContacts>;
-export declare const WithPropertyDate: StoryFn<PdOrderContacts>;
-export declare const RequiredFields: StoryFn<PdOrderContacts>;
-export declare const WithBilling: StoryFn<PdOrderContacts>;
-export declare const WithBillingAndAdmin: StoryFn<PdOrderContacts>;
-export declare const WithBillingAdminPropertyDate: StoryFn<PdOrderContacts>;
-export declare const ViewOnly: StoryFn<PdOrderContacts>;
-export declare const ViewWithBilling: StoryFn<PdOrderContacts>;
-export declare const ViewWithBillingAndAdmin: StoryFn<PdOrderContacts>;
-export declare const Filled: StoryFn<PdOrderContacts>;
-export declare const FilledWithAdmin: StoryFn<PdOrderContacts>;
-export declare const FilledWithAdminAndDate: StoryFn<PdOrderContacts>;
+import { Meta, StoryObj } from '@storybook/web-components-vite';
+import { PdContactData } from '@progressive-development/pd-contact';
+/**
+ * Story arguments interface for pd-order-contacts component.
+ * Maps to the component's public API for multi-contact order forms.
+ */
+interface PdOrderContactsArgs {
+    /** Show read-only summary mode */
+    summary: boolean;
+    /** Enable billing address option */
+    withPayment: boolean;
+    /** Enable property owner/landlord options */
+    withPropertyOwner: boolean;
+    /** Enable property date field */
+    withPropertyDate: boolean;
+    /** Required field names per contact */
+    requiredFields: string[];
+    /** Primary order contact data */
+    orderContact?: PdContactData;
+    /** Optional billing contact data */
+    billingContact?: PdContactData;
+    /** Optional admin contact data */
+    adminContact?: PdContactData;
+    /** Optional property address data */
+    propertyContact?: PdContactData;
+}
+/**
+ * ## pd-order-contacts
+ *
+ * Multi-contact management component for order workflows with collapsible
+ * address sections for order, billing, property, and admin contacts.
+ *
+ * ### Features
+ * - Primary order contact form (always visible)
+ * - Optional billing address section with toggle
+ * - Optional property owner section with landlord checkbox
+ * - Optional property date field
+ * - Admin/management contact for property owners
+ * - Summary mode for read-only display of all contacts
+ * - Form validation with required field support across all contacts
+ * - Collapsible sections via pd-collapse-group
+ *
+ * ### Form Methods
+ * - `triggerValidate()` — validates all visible contacts, opens first invalid section
+ * - `getValues()` — returns all visible contact data
+ * - `valid` — getter for current validation state
+ */
+declare const meta: Meta<PdOrderContactsArgs>;
+export default meta;
+type Story = StoryObj<PdOrderContactsArgs>;
+/** Default empty order contacts form with a single address section. Interactive via Controls panel. */
+export declare const Default: Story;
+/** Form with pre-populated order contact data. */
+export declare const Prepopulated: Story;
+/** Form with billing address section enabled — shows toggle to add separate billing address. */
+export declare const WithBilling: Story;
+/** Form with property owner section — includes landlord checkbox, property address, and admin contact. */
+export declare const WithPropertyOwner: Story;
+/** All features enabled with pre-populated data across all contact sections. */
+export declare const FullyConfigured: Story;
+/** Read-only summary showing all configured contacts side by side. */
+export declare const SummaryMode: Story;
+/** Form with all fields marked as required — triggers validation on submit. */
+export declare const RequiredFields: Story;
 //# sourceMappingURL=pd-order-contacts.stories.d.ts.map

package/dist/pd-order-contacts/pd-order-contacts.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"pd-order-contacts.stories.d.ts","sourceRoot":"","sources":["../../src/pd-order-contacts/pd-order-contacts.stories.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,2BAA2B,CAAC;AAE/D,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,qBAAqB,CAAC;wBAMxB,IAAI,CAAC,eAAe,CAAC;AAJ1B,wBAI2B;AA8E3B,eAAO,MAAM,OAAO,0BAAoB,CAAC;AAKzC,eAAO,MAAM,gBAAgB,0BAAoB,CAAC;AAMlD,eAAO,MAAM,cAAc,0BAAoB,CAAC;AAiBhD,eAAO,MAAM,WAAW,0BAAoB,CAAC;AAM7C,eAAO,MAAM,mBAAmB,0BAAoB,CAAC;AAOrD,eAAO,MAAM,4BAA4B,0BAAoB,CAAC;AAQ9D,eAAO,MAAM,QAAQ,0BAAoB,CAAC;AAM1C,eAAO,MAAM,eAAe,0BAAoB,CAAC;AAOjD,eAAO,MAAM,uBAAuB,0BAAoB,CAAC;AASzD,eAAO,MAAM,MAAM,0BAAoB,CAAC;AAQxC,eAAO,MAAM,eAAe,0BAAoB,CAAC;AAWjD,eAAO,MAAM,sBAAsB,0BAAoB,CAAC"}
+{"version":3,"file":"pd-order-contacts.stories.d.ts","sourceRoot":"","sources":["../../src/pd-order-contacts/pd-order-contacts.stories.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAGrE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,qCAAqC,CAAC;AACzE,OAAO,6CAA6C,CAAC;AAGrD,OAAO,wBAAwB,CAAC;AAMhC;;;GAGG;AACH,UAAU,mBAAmB;IAC3B,kCAAkC;IAClC,OAAO,EAAE,OAAO,CAAC;IACjB,oCAAoC;IACpC,WAAW,EAAE,OAAO,CAAC;IACrB,6CAA6C;IAC7C,iBAAiB,EAAE,OAAO,CAAC;IAC3B,iCAAiC;IACjC,gBAAgB,EAAE,OAAO,CAAC;IAC1B,uCAAuC;IACvC,cAAc,EAAE,MAAM,EAAE,CAAC;IACzB,iCAAiC;IACjC,YAAY,CAAC,EAAE,aAAa,CAAC;IAC7B,oCAAoC;IACpC,cAAc,CAAC,EAAE,aAAa,CAAC;IAC/B,kCAAkC;IAClC,YAAY,CAAC,EAAE,aAAa,CAAC;IAC7B,qCAAqC;IACrC,eAAe,CAAC,EAAE,aAAa,CAAC;CACjC;AA0FD;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,mBAAmB,CAkGnC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,mBAAmB,CAAC,CAAC;AAM3C,uGAAuG;AACvG,eAAO,MAAM,OAAO,EAAE,KAAU,CAAC;AAMjC,kDAAkD;AAClD,eAAO,MAAM,YAAY,EAAE,KAI1B,CAAC;AAMF,gGAAgG;AAChG,eAAO,MAAM,WAAW,EAAE,KAKzB,CAAC;AAMF,0GAA0G;AAC1G,eAAO,MAAM,iBAAiB,EAAE,KAc/B,CAAC;AAMF,gFAAgF;AAChF,eAAO,MAAM,eAAe,EAAE,KAkB7B,CAAC;AAMF,sEAAsE;AACtE,eAAO,MAAM,WAAW,EAAE,KA8CzB,CAAC;AAMF,+EAA+E;AAC/E,eAAO,MAAM,cAAc,EAAE,KAI5B,CAAC"}

package/dist/pd-order-summary/PdOrderSummary.d.ts

@@ -1,31 +1,31 @@
 import { LitElement, CSSResultGroup, TemplateResult } from 'lit';
 import { PdOrderStep } from '../types.js';
 /**
- * Komponente zur Darstellung der Bestellübersicht
+ * Order summary component displaying steps, pricing, and agreement.
  *
- * @fires go-to - Wird ausgelöst, wenn der Benutzer "edit-content" aktiviert
- * @slot legal - Slot für die AGB-Inhalte
  * @tagname pd-order-summary
+ * @summary Order summary with steps, pricing, and terms agreement.
+ *
+ * @event go-to - Fired when user clicks edit on a step. Detail: `{ step }`.
+ *
+ * @slot legal - Terms and conditions content.
+ * @slot [stepKey] - Named slots for custom step content.
+ *
+ * @cssprop --pd-order-summary-payment-bg-col - Payment section background. Default: `var(--pd-default-light-col)`.
  */
 export declare class PdOrderSummary extends LitElement {
-    /**
-     * Die Liste der Bestellschritte (z.B. Buchung, Kontaktdaten, etc.),
-     * wie sie in der Zusammenfassung gerendert werden.
-     */
+    /** Order steps to display in summary (e.g., booking, contacts) */
     orderSteps: PdOrderStep[];
-    /**
-     * Gibt an, ob ein Zahlungsabschnitt mit Preisdetails angezeigt werden soll.
-     */
+    /** Show payment/pricing section */
     withPayment: boolean;
-    /**
-     * Gibt an, ob eine Checkbox zur Zustimmung zu den AGB angezeigt und validiert werden soll.
-     */
+    /** Show terms agreement checkbox with validation */
     withAgreement: boolean;
-    /**
-     * Die vollständigen Bestelldaten inklusive Postleitzahl, Kontakten und Preisinformationen.
-     */
+    /** Complete order data including zip, contacts, and pricing */
     order?: any;
+    /** @ignore */
     private _agreeForm;
+    /** @ignore */
+    private _agreePopup;
     static styles: CSSResultGroup;
     firstUpdated(): void;
     render(): TemplateResult<1>;

package/dist/pd-order-summary/PdOrderSummary.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PdOrderSummary.d.ts","sourceRoot":"","sources":["../../src/pd-order-summary/PdOrderSummary.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAI5E,OAAO,qDAAqD,CAAC;AAC7D,OAAO,+CAA+C,CAAC;AACvD,OAAO,+CAA+C,CAAC;AAEvD,OAAO,iDAAiD,CAAC;AACzD,OAAO,6CAA6C,CAAC;AACrD,OAAO,qDAAqD,CAAC;AAE7D,OAAO,EAAsB,WAAW,EAAE,MAAM,aAAa,CAAC;AAE9D,OAAO,2CAA2C,CAAC;AAGnD;;;;;;GAMG;AACH,qBACa,cAAe,SAAQ,UAAU;IAC5C;;;OAGG;IAEH,UAAU,EAAE,WAAW,EAAE,CAAM;IAE/B;;OAEG;IAEH,WAAW,UAAS;IAEpB;;OAEG;IAEH,aAAa,UAAS;IAEtB;;OAEG;IAEH,KAAK,CAAC,EAAE,GAAG,CAAC;IAGZ,OAAO,CAAC,UAAU,CAAmB;IAErC,OAAgB,MAAM,EAAE,cAAc,CAmDpC;IAEO,YAAY,IAAI,IAAI;IAYpB,MAAM;IA0Df,IAAI,KAAK,YAER;IAEY,eAAe,IAAI,OAAO,CAAC,OAAO,CAAC;IA6BhD,SAAS,CAAC,oBAAoB,CAC5B,IAAI,EAAE,WAAW,EACjB,KAAK,EAAE,MAAM,GACZ,cAAc;IAkBjB,SAAS,CAAC,6BAA6B,CACrC,IAAI,EAAE,WAAW,EACjB,KAAK,EAAE,MAAM,GACZ,cAAc,GAAG,IAAI;IAUxB,SAAS,CAAC,mBAAmB,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,WAAW;IAoB9D,OAAO,CAAC,uBAAuB;CAOhC"}
+{"version":3,"file":"PdOrderSummary.d.ts","sourceRoot":"","sources":["../../src/pd-order-summary/PdOrderSummary.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAI5E,OAAO,qDAAqD,CAAC;AAC7D,OAAO,+CAA+C,CAAC;AACvD,OAAO,+CAA+C,CAAC;AAEvD,OAAO,iDAAiD,CAAC;AACzD,OAAO,6CAA6C,CAAC;AAErD,OAAO,qDAAqD,CAAC;AAE7D,OAAO,EAAsB,WAAW,EAAE,MAAM,aAAa,CAAC;AAE9D,OAAO,2CAA2C,CAAC;AAGnD;;;;;;;;;;;;GAYG;AACH,qBACa,cAAe,SAAQ,UAAU;IAC5C,kEAAkE;IAElE,UAAU,EAAE,WAAW,EAAE,CAAM;IAE/B,mCAAmC;IAEnC,WAAW,UAAS;IAEpB,oDAAoD;IAEpD,aAAa,UAAS;IAEtB,+DAA+D;IAE/D,KAAK,CAAC,EAAE,GAAG,CAAC;IAEZ,cAAc;IAEd,OAAO,CAAC,UAAU,CAAmB;IAErC,cAAc;IAEd,OAAO,CAAC,WAAW,CAAW;IAE9B,OAAgB,MAAM,EAAE,cAAc,CAmDpC;IAEO,YAAY,IAAI,IAAI;IAYpB,MAAM;IAyDf,IAAI,KAAK,YAER;IAEY,eAAe,IAAI,OAAO,CAAC,OAAO,CAAC;IA6BhD,SAAS,CAAC,oBAAoB,CAC5B,IAAI,EAAE,WAAW,EACjB,KAAK,EAAE,MAAM,GACZ,cAAc;IAkBjB,SAAS,CAAC,6BAA6B,CACrC,IAAI,EAAE,WAAW,EACjB,KAAK,EAAE,MAAM,GACZ,cAAc,GAAG,IAAI;IAUxB,SAAS,CAAC,mBAAmB,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,WAAW;IAoB9D,OAAO,CAAC,uBAAuB;CAIhC"}

package/dist/pd-order-summary/PdOrderSummary.js

@@ -40,7 +40,6 @@ let PdOrderSummary = class extends LitElement {
   render() {
     if (!this.order) return html`<p>No order is set</p>`;
     return html`
-      <h3>${msg("Übersicht", { id: "pd.order.summary.title" })}</h3>
       <div class="edit-summary-container">
         ${this.orderSteps.map(
       (step, index) => this._mapOrderStepSummary(step, index)
@@ -162,10 +161,7 @@ let PdOrderSummary = class extends LitElement {
   }
   _openTermsAndConditions(e) {
     e.stopPropagation();
-    const popup = this.shadowRoot?.getElementById(
-      "agreePopupId"
-    );
-    popup?.showPopup();
+    this._agreePopup?.showPopup();
   }
 };
 PdOrderSummary.styles = [
@@ -235,6 +231,9 @@ __decorateClass([
 __decorateClass([
   query("#submitSummaryFormId")
 ], PdOrderSummary.prototype, "_agreeForm", 2);
+__decorateClass([
+  query("#agreePopupId")
+], PdOrderSummary.prototype, "_agreePopup", 2);
 PdOrderSummary = __decorateClass([
   localized()
 ], PdOrderSummary);

package/dist/pd-order-summary/pd-order-summary.stories.d.ts

@@ -1,13 +1,59 @@
-import { Meta, StoryFn } from '@storybook/web-components';
-import { TestSummary } from '../stories/test-impl/test-summary.js';
-declare const _default: Meta<TestSummary>;
-export default _default;
-export declare const OrderSummary: StoryFn<TestSummary & {
-    orderContact: any;
-    billingContact?: any;
-}>;
-export declare const OrderSummaryEmptyBilling: StoryFn<TestSummary & {
-    orderContact: any;
-    billingContact?: any;
-}>;
+import { Meta, StoryObj } from '@storybook/web-components-vite';
+import { PdContactData } from '@progressive-development/pd-contact';
+import { PdOrderStep } from '../types.js';
+/**
+ * Story arguments interface for pd-order-summary component.
+ * Maps to the component's public API for order summary display.
+ */
+interface PdOrderSummaryArgs {
+    /** Show payment/pricing section */
+    withPayment: boolean;
+    /** Show terms agreement checkbox with validation */
+    withAgreement: boolean;
+    /** Order steps to display in summary */
+    orderSteps: PdOrderStep[];
+    /** Primary order contact data */
+    orderContact: PdContactData;
+    /** Optional billing contact data */
+    billingContact?: PdContactData;
+}
+/**
+ * ## pd-order-summary
+ *
+ * Order summary component that displays configurable steps, pricing information,
+ * and an optional terms-and-conditions agreement.
+ *
+ * ### Features
+ * - Configurable order steps with edit-content integration
+ * - Automatic contact summary rendering for "contacts" step key
+ * - Price table with tax calculation via pd-pricetable
+ * - Terms and conditions agreement checkbox with popup
+ * - Named slots for custom step content and legal text
+ * - Fires `go-to` event when user clicks edit on a step
+ *
+ * ### Slots
+ * - `legal` — Terms and conditions content (shown in popup)
+ * - `[stepKey]` — Named slots for custom step content
+ *
+ * ### Usage Note
+ * Stories use `pd-order-summary-test` (a test wrapper that extends PdOrderSummary)
+ * to provide a concrete implementation for demo purposes.
+ */
+declare const meta: Meta<PdOrderSummaryArgs>;
+export default meta;
+type Story = StoryObj<PdOrderSummaryArgs>;
+/** Default order summary with payment and agreement enabled. Interactive via Controls panel. */
+export declare const Default: Story;
+/** Order summary showing separate billing contact alongside order contact. */
+export declare const WithBillingContact: Story;
+/** Order summary without the pricing/payment section — for non-billable orders. */
+export declare const WithoutPayment: Story;
+/** Order summary without the terms agreement checkbox — when agreement is handled elsewhere. */
+export declare const WithoutAgreement: Story;
+/** Minimal order summary without payment and agreement — just the order steps and contacts. */
+export declare const Minimal: Story;
+/** All summary configurations side by side for comparison. */
+export declare const AllConfigurations: Story;
+/** CSS Custom Properties — Branded and Redesigned payment section variants. */
+export declare const CustomStyling: Story;
 //# sourceMappingURL=pd-order-summary.stories.d.ts.map

package/dist/pd-order-summary/pd-order-summary.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"pd-order-summary.stories.d.ts","sourceRoot":"","sources":["../../src/pd-order-summary/pd-order-summary.stories.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,2BAA2B,CAAC;AAI/D,OAAO,EAAE,WAAW,EAAE,MAAM,sCAAsC,CAAC;AACnE,OAAO,sCAAsC,CAAC;wBAMzC,IAAI,CAAC,WAAW,CAAC;AAJtB,wBAIuB;AA0EvB,eAAO,MAAM,YAAY;kBAxCP,GAAG;qBACA,GAAG;EAuCqB,CAAC;AAuB9C,eAAO,MAAM,wBAAwB;kBA/DnB,GAAG;qBACA,GAAG;EA8DiC,CAAC"}
+{"version":3,"file":"pd-order-summary.stories.d.ts","sourceRoot":"","sources":["../../src/pd-order-summary/pd-order-summary.stories.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAGrE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,qCAAqC,CAAC;AACzE,OAAO,6CAA6C,CAAC;AAErD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAG/C,OAAO,sCAAsC,CAAC;AAM9C;;;GAGG;AACH,UAAU,kBAAkB;IAC1B,mCAAmC;IACnC,WAAW,EAAE,OAAO,CAAC;IACrB,oDAAoD;IACpD,aAAa,EAAE,OAAO,CAAC;IACvB,wCAAwC;IACxC,UAAU,EAAE,WAAW,EAAE,CAAC;IAC1B,iCAAiC;IACjC,YAAY,EAAE,aAAa,CAAC;IAC5B,oCAAoC;IACpC,cAAc,CAAC,EAAE,aAAa,CAAC;CAChC;AA4FD;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,kBAAkB,CAiGlC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,kBAAkB,CAAC,CAAC;AAM1C,gGAAgG;AAChG,eAAO,MAAM,OAAO,EAAE,KAAU,CAAC;AAMjC,8EAA8E;AAC9E,eAAO,MAAM,kBAAkB,EAAE,KAIhC,CAAC;AAMF,mFAAmF;AACnF,eAAO,MAAM,cAAc,EAAE,KAI5B,CAAC;AAMF,gGAAgG;AAChG,eAAO,MAAM,gBAAgB,EAAE,KAI9B,CAAC;AAMF,+FAA+F;AAC/F,eAAO,MAAM,OAAO,EAAE,KAYrB,CAAC;AAMF,8DAA8D;AAC9D,eAAO,MAAM,iBAAiB,EAAE,KAqD/B,CAAC;AAMF,+EAA+E;AAC/E,eAAO,MAAM,aAAa,EAAE,KAwE3B,CAAC"}

package/package.json

@@ -1,9 +1,12 @@
 {
   "name": "@progressive-development/pd-order",
-  "version": "0.9.2",
+  "version": "1.0.0",
   "description": "Progressive Development Order Component",
   "author": "PD Progressive Development",
-  "license": "SEE LICENSE IN LICENSE",
+  "license": "MIT",
+  "publishConfig": {
+    "access": "public"
+  },
   "main": "./dist/index.js",
   "module": "./dist/index.js",
   "type": "module",
@@ -27,12 +30,12 @@
     "@lit/localize": "^0.12.2",
     "fecha": "^4.2.3",
     "tslib": "^2.8.1",
-    "@progressive-development/pd-shared-styles": "0.3.0",
-    "@progressive-development/pd-price": "0.9.2",
-    "@progressive-development/pd-contact": "0.9.2",
-    "@progressive-development/pd-forms": "0.9.2",
-    "@progressive-development/pd-dialog": "0.9.2",
-    "@progressive-development/pd-content": "0.9.2"
+    "@progressive-development/pd-shared-styles": "0.3.1",
+    "@progressive-development/pd-contact": "1.0.0",
+    "@progressive-development/pd-content": "1.0.0",
+    "@progressive-development/pd-forms": "1.0.0",
+    "@progressive-development/pd-dialog": "1.0.0",
+    "@progressive-development/pd-price": "1.0.0"
   },
   "customElements": "custom-elements.json",
   "keywords": [