@progressive-development/pd-order 1.1.1 → 1.1.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.ts +1 -1
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1 -1
- package/dist/pd-order-contacts/PdOrderContacts.d.ts +21 -0
- package/dist/pd-order-contacts/PdOrderContacts.d.ts.map +1 -1
- package/dist/pd-order-contacts/PdOrderContacts.js +127 -0
- package/dist/types.d.ts +18 -0
- package/dist/types.d.ts.map +1 -1
- package/package.json +5 -5
- package/dist/pd-order-agreement/pd-order-agreement.stories.d.ts +0 -41
- package/dist/pd-order-agreement/pd-order-agreement.stories.d.ts.map +0 -1
- package/dist/pd-order-contacts/pd-order-contacts.stories.d.ts +0 -65
- package/dist/pd-order-contacts/pd-order-contacts.stories.d.ts.map +0 -1
- package/dist/pd-order-summary/pd-order-summary.stories.d.ts +0 -54
- package/dist/pd-order-summary/pd-order-summary.stories.d.ts.map +0 -1
package/dist/index.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
export { PdOrderContacts } from './pd-order-contacts/pd-order-contacts.js';
|
|
2
2
|
export { PdOrderSummary } from './pd-order-summary/pd-order-summary.js';
|
|
3
3
|
export { PdOrderAgreement } from './pd-order-agreement/pd-order-agreement.js';
|
|
4
|
-
export type { PdOrderContactData, PdOrderStep } from './types.js';
|
|
4
|
+
export type { ContactSectionConfig, PdOrderContactData, PdOrderStep, } from './types.js';
|
|
5
5
|
export type { PdOrderAgreementChangeDetail, PdOrderAgreementChangeEvent, } from './pd-order-agreement/types.js';
|
|
6
6
|
export { templates as beTemplates } from './generated/locales/be.js';
|
|
7
7
|
export { templates as deTemplates } from './generated/locales/de.js';
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,0CAA0C,CAAC;AAC3E,OAAO,EAAE,cAAc,EAAE,MAAM,wCAAwC,CAAC;AACxE,OAAO,EAAE,gBAAgB,EAAE,MAAM,4CAA4C,CAAC;AAE9E,YAAY,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,0CAA0C,CAAC;AAC3E,OAAO,EAAE,cAAc,EAAE,MAAM,wCAAwC,CAAC;AACxE,OAAO,EAAE,gBAAgB,EAAE,MAAM,4CAA4C,CAAC;AAE9E,YAAY,EACV,oBAAoB,EACpB,kBAAkB,EAClB,WAAW,GACZ,MAAM,YAAY,CAAC;AACpB,YAAY,EACV,4BAA4B,EAC5B,2BAA2B,GAC5B,MAAM,+BAA+B,CAAC;AAEvC,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
CHANGED
|
@@ -4,6 +4,6 @@ import './pd-order-agreement.js';
|
|
|
4
4
|
export { templates as beTemplates } from './locales/be.js';
|
|
5
5
|
export { templates as deTemplates } from './locales/de.js';
|
|
6
6
|
export { templates as enTemplates } from './locales/en.js';
|
|
7
|
+
export { PdOrderAgreement } from './pd-order-agreement/PdOrderAgreement.js';
|
|
7
8
|
export { PdOrderContacts } from './pd-order-contacts/PdOrderContacts.js';
|
|
8
9
|
export { PdOrderSummary } from './pd-order-summary/PdOrderSummary.js';
|
|
9
|
-
export { PdOrderAgreement } from './pd-order-agreement/PdOrderAgreement.js';
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { LitElement, CSSResultGroup, PropertyValues } from 'lit';
|
|
2
2
|
import { PdContactData, PdContactMatch } from '@progressive-development/pd-contact';
|
|
3
|
+
import { ContactSectionConfig } from '../types.js';
|
|
3
4
|
/**
|
|
4
5
|
* Order contact management with multiple address sections.
|
|
5
6
|
*
|
|
@@ -31,6 +32,19 @@ export declare class PdOrderContacts extends LitElement {
|
|
|
31
32
|
withPropertyDate: boolean;
|
|
32
33
|
/** Optional field validation/mapping configuration */
|
|
33
34
|
match?: PdContactMatch;
|
|
35
|
+
/** Konfigurierbare Kontakt-Sektionen. Wenn gesetzt, werden die hardcoded-Sektionen ersetzt. */
|
|
36
|
+
contactSections?: ContactSectionConfig[];
|
|
37
|
+
/** Kontaktdaten für konfigurierbare Sektionen, indiziert nach section.key. */
|
|
38
|
+
sectionData?: Record<string, PdContactData | undefined>;
|
|
39
|
+
/** Welche optionalen Sektionen aktiv sind */
|
|
40
|
+
private _activeSections;
|
|
41
|
+
/**
|
|
42
|
+
* Stabile leere Objekt-Referenz pro Section-Key.
|
|
43
|
+
* Verhindert, dass `.contact="${sectionData?.[key] ?? {}}"` bei jedem
|
|
44
|
+
* Re-Render ein neues {} erzeugt und damit PdContact.willUpdate triggert,
|
|
45
|
+
* was _socialMediaItems auf [] resettet (Bug: Social-Media-Verlust).
|
|
46
|
+
*/
|
|
47
|
+
private _emptyContactCache;
|
|
34
48
|
/** @ignore */
|
|
35
49
|
private _ownBillingContact;
|
|
36
50
|
/** @ignore */
|
|
@@ -42,6 +56,13 @@ export declare class PdOrderContacts extends LitElement {
|
|
|
42
56
|
protected render(): import('lit').TemplateResult<1>;
|
|
43
57
|
private _renderEditContacts;
|
|
44
58
|
private _renderSummary;
|
|
59
|
+
/** Gibt eine stabile Referenz für den contact-Property-Wert zurück.
|
|
60
|
+
* Wenn sectionData den Key enthält, wird das echte Objekt zurückgegeben.
|
|
61
|
+
* Ansonsten ein gecachtes leeres Objekt, damit Lit keinen Property-Change triggert. */
|
|
62
|
+
private _getContactData;
|
|
63
|
+
private _renderConfiguredSections;
|
|
64
|
+
private _renderConfiguredSummary;
|
|
65
|
+
private _toggleSection;
|
|
45
66
|
get valid(): boolean;
|
|
46
67
|
triggerValidate(): Promise<boolean>;
|
|
47
68
|
getValues(): any;
|
|
@@ -1 +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,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;
|
|
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,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,aAAa,CAAC;AAExD;;;;;;;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,+FAA+F;IAE/F,eAAe,CAAC,EAAE,oBAAoB,EAAE,CAAC;IAEzC,8EAA8E;IAE9E,WAAW,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,aAAa,GAAG,SAAS,CAAC,CAAC;IAExD,6CAA6C;IAE7C,OAAO,CAAC,eAAe,CAAqB;IAE5C;;;;;OAKG;IACH,OAAO,CAAC,kBAAkB,CAAqC;IAE/D,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;IA0BzD,SAAS,CAAC,MAAM;IAIhB,OAAO,CAAC,mBAAmB;IAoK3B,OAAO,CAAC,cAAc;IAkDtB;;4FAEwF;IACxF,OAAO,CAAC,eAAe;IASvB,OAAO,CAAC,yBAAyB;IAyDjC,OAAO,CAAC,wBAAwB;IAsBhC,OAAO,CAAC,cAAc;IAUtB,IAAI,KAAK,IAAI,OAAO,CASnB;IAEY,eAAe,IAAI,OAAO,CAAC,OAAO,CAAC;IAkCzC,SAAS;IAWhB,OAAO,CAAC,eAAe;CA2BxB"}
|
|
@@ -25,6 +25,14 @@ let PdOrderContacts = class extends LitElement {
|
|
|
25
25
|
this.withPayment = false;
|
|
26
26
|
this.withPropertyOwner = false;
|
|
27
27
|
this.withPropertyDate = false;
|
|
28
|
+
this._activeSections = /* @__PURE__ */ new Set();
|
|
29
|
+
/**
|
|
30
|
+
* Stabile leere Objekt-Referenz pro Section-Key.
|
|
31
|
+
* Verhindert, dass `.contact="${sectionData?.[key] ?? {}}"` bei jedem
|
|
32
|
+
* Re-Render ein neues {} erzeugt und damit PdContact.willUpdate triggert,
|
|
33
|
+
* was _socialMediaItems auf [] resettet (Bug: Social-Media-Verlust).
|
|
34
|
+
*/
|
|
35
|
+
this._emptyContactCache = {};
|
|
28
36
|
this._ownBillingContact = false;
|
|
29
37
|
this._ownAdminContact = false;
|
|
30
38
|
this._isPropertyOwner = false;
|
|
@@ -39,12 +47,24 @@ let PdOrderContacts = class extends LitElement {
|
|
|
39
47
|
if (changedProps.has("propertyContact")) {
|
|
40
48
|
this._isPropertyOwner = !!this.propertyContact;
|
|
41
49
|
}
|
|
50
|
+
if (changedProps.has("sectionData") && this.sectionData && this.contactSections) {
|
|
51
|
+
const active = /* @__PURE__ */ new Set();
|
|
52
|
+
for (const section of this.contactSections) {
|
|
53
|
+
if (section.optional && this.sectionData[section.key]) {
|
|
54
|
+
active.add(section.key);
|
|
55
|
+
}
|
|
56
|
+
}
|
|
57
|
+
this._activeSections = active;
|
|
58
|
+
}
|
|
42
59
|
super.update(changedProps);
|
|
43
60
|
}
|
|
44
61
|
render() {
|
|
45
62
|
return this.summary ? this._renderSummary() : this._renderEditContacts();
|
|
46
63
|
}
|
|
47
64
|
_renderEditContacts() {
|
|
65
|
+
if (this.contactSections) {
|
|
66
|
+
return this._renderConfiguredSections();
|
|
67
|
+
}
|
|
48
68
|
return html`
|
|
49
69
|
<pd-collapse-group>
|
|
50
70
|
<pd-collapse id="orderContactCollapseId">
|
|
@@ -188,6 +208,9 @@ let PdOrderContacts = class extends LitElement {
|
|
|
188
208
|
`;
|
|
189
209
|
}
|
|
190
210
|
_renderSummary() {
|
|
211
|
+
if (this.contactSections) {
|
|
212
|
+
return this._renderConfiguredSummary();
|
|
213
|
+
}
|
|
191
214
|
return html`
|
|
192
215
|
<div class="summary-box">
|
|
193
216
|
${this.orderContact ? html`
|
|
@@ -221,6 +244,94 @@ let PdOrderContacts = class extends LitElement {
|
|
|
221
244
|
</div>
|
|
222
245
|
`;
|
|
223
246
|
}
|
|
247
|
+
/** Gibt eine stabile Referenz für den contact-Property-Wert zurück.
|
|
248
|
+
* Wenn sectionData den Key enthält, wird das echte Objekt zurückgegeben.
|
|
249
|
+
* Ansonsten ein gecachtes leeres Objekt, damit Lit keinen Property-Change triggert. */
|
|
250
|
+
_getContactData(key) {
|
|
251
|
+
const data = this.sectionData?.[key];
|
|
252
|
+
if (data) return data;
|
|
253
|
+
if (!this._emptyContactCache[key]) {
|
|
254
|
+
this._emptyContactCache[key] = {};
|
|
255
|
+
}
|
|
256
|
+
return this._emptyContactCache[key];
|
|
257
|
+
}
|
|
258
|
+
_renderConfiguredSections() {
|
|
259
|
+
const sections = this.contactSections;
|
|
260
|
+
return html`
|
|
261
|
+
<pd-collapse-group>
|
|
262
|
+
${sections.map((section) => {
|
|
263
|
+
const isActive = !section.optional || this._activeSections.has(section.key);
|
|
264
|
+
return html`
|
|
265
|
+
<pd-collapse id="${section.key}CollapseId">
|
|
266
|
+
<div slot="header">${section.label}</div>
|
|
267
|
+
<div slot="content">
|
|
268
|
+
${section.optional ? isActive ? html`
|
|
269
|
+
<p>
|
|
270
|
+
<a
|
|
271
|
+
@click="${() => this._toggleSection(section.key, false)}"
|
|
272
|
+
>${section.label} deaktivieren</a
|
|
273
|
+
>
|
|
274
|
+
</p>
|
|
275
|
+
<pd-contact
|
|
276
|
+
id="${section.key}"
|
|
277
|
+
class="collapse-contact"
|
|
278
|
+
.contact="${this._getContactData(section.key)}"
|
|
279
|
+
.inputFields="${section.inputFields ?? []}"
|
|
280
|
+
.requiredFields="${section.requiredFields ?? []}"
|
|
281
|
+
></pd-contact>
|
|
282
|
+
` : html`
|
|
283
|
+
<p>${section.optionalHint ?? ""}</p>
|
|
284
|
+
<p>
|
|
285
|
+
<a
|
|
286
|
+
@click="${() => this._toggleSection(section.key, true)}"
|
|
287
|
+
>${section.optionalActivateLabel ?? `${section.label} angeben`}</a
|
|
288
|
+
>
|
|
289
|
+
</p>
|
|
290
|
+
` : html`
|
|
291
|
+
<pd-contact
|
|
292
|
+
id="${section.key}"
|
|
293
|
+
class="collapse-contact"
|
|
294
|
+
.contact="${this._getContactData(section.key)}"
|
|
295
|
+
.inputFields="${section.inputFields ?? []}"
|
|
296
|
+
.requiredFields="${section.requiredFields ?? []}"
|
|
297
|
+
></pd-contact>
|
|
298
|
+
`}
|
|
299
|
+
</div>
|
|
300
|
+
</pd-collapse>
|
|
301
|
+
`;
|
|
302
|
+
})}
|
|
303
|
+
</pd-collapse-group>
|
|
304
|
+
`;
|
|
305
|
+
}
|
|
306
|
+
_renderConfiguredSummary() {
|
|
307
|
+
const sections = this.contactSections;
|
|
308
|
+
return html`
|
|
309
|
+
<div class="summary-box">
|
|
310
|
+
${sections.map((section) => {
|
|
311
|
+
const isActive = !section.optional || this._activeSections.has(section.key);
|
|
312
|
+
if (!isActive) return nothing;
|
|
313
|
+
const data = this.sectionData?.[section.key];
|
|
314
|
+
if (!data) return nothing;
|
|
315
|
+
return html`
|
|
316
|
+
<pd-contact
|
|
317
|
+
addressTitle="${section.summaryLabel ?? section.label}"
|
|
318
|
+
.contact="${data}"
|
|
319
|
+
summary
|
|
320
|
+
></pd-contact>
|
|
321
|
+
`;
|
|
322
|
+
})}
|
|
323
|
+
</div>
|
|
324
|
+
`;
|
|
325
|
+
}
|
|
326
|
+
_toggleSection(key, active) {
|
|
327
|
+
const next = new Set(this._activeSections);
|
|
328
|
+
if (active) {
|
|
329
|
+
next.add(key);
|
|
330
|
+
} else {
|
|
331
|
+
next.delete(key);
|
|
332
|
+
}
|
|
333
|
+
this._activeSections = next;
|
|
334
|
+
}
|
|
224
335
|
get valid() {
|
|
225
336
|
for (const { id, condition = true } of this._getCollapseMap()) {
|
|
226
337
|
if (!condition) continue;
|
|
@@ -266,6 +377,13 @@ let PdOrderContacts = class extends LitElement {
|
|
|
266
377
|
return contactValues;
|
|
267
378
|
}
|
|
268
379
|
_getCollapseMap() {
|
|
380
|
+
if (this.contactSections) {
|
|
381
|
+
return this.contactSections.map((s) => ({
|
|
382
|
+
id: s.key,
|
|
383
|
+
collapse: `${s.key}CollapseId`,
|
|
384
|
+
condition: !s.optional || this._activeSections.has(s.key)
|
|
385
|
+
}));
|
|
386
|
+
}
|
|
269
387
|
return [
|
|
270
388
|
{ id: "orderContactId", collapse: "orderContactCollapseId" },
|
|
271
389
|
{
|
|
@@ -367,6 +485,15 @@ __decorateClass([
|
|
|
367
485
|
__decorateClass([
|
|
368
486
|
property({ type: Object })
|
|
369
487
|
], PdOrderContacts.prototype, "match", 2);
|
|
488
|
+
__decorateClass([
|
|
489
|
+
property({ type: Array })
|
|
490
|
+
], PdOrderContacts.prototype, "contactSections", 2);
|
|
491
|
+
__decorateClass([
|
|
492
|
+
property({ type: Object })
|
|
493
|
+
], PdOrderContacts.prototype, "sectionData", 2);
|
|
494
|
+
__decorateClass([
|
|
495
|
+
state()
|
|
496
|
+
], PdOrderContacts.prototype, "_activeSections", 2);
|
|
370
497
|
__decorateClass([
|
|
371
498
|
state()
|
|
372
499
|
], PdOrderContacts.prototype, "_ownBillingContact", 2);
|
package/dist/types.d.ts
CHANGED
|
@@ -16,4 +16,22 @@ export interface PdOrderContactData {
|
|
|
16
16
|
adminContact?: PdContactData;
|
|
17
17
|
propertyContact?: PdContactData;
|
|
18
18
|
}
|
|
19
|
+
export interface ContactSectionConfig {
|
|
20
|
+
/** Eindeutiger Key, auch Schlüssel in getValues() */
|
|
21
|
+
key: string;
|
|
22
|
+
/** Collapse-Header im Edit-Modus */
|
|
23
|
+
label: string;
|
|
24
|
+
/** Label in Summary-Ansicht (default: label) */
|
|
25
|
+
summaryLabel?: string;
|
|
26
|
+
/** pd-contact inputFields */
|
|
27
|
+
inputFields?: string[];
|
|
28
|
+
/** pd-contact requiredFields */
|
|
29
|
+
requiredFields?: string[];
|
|
30
|
+
/** Wenn true: Section startet zugeklappt mit Toggle-Link */
|
|
31
|
+
optional?: boolean;
|
|
32
|
+
/** Text wenn optional und deaktiviert */
|
|
33
|
+
optionalHint?: string;
|
|
34
|
+
/** Link-Text zum Aktivieren */
|
|
35
|
+
optionalActivateLabel?: string;
|
|
36
|
+
}
|
|
19
37
|
//# sourceMappingURL=types.d.ts.map
|
package/dist/types.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,qCAAqC,CAAC;AAEpE,MAAM,WAAW,WAAW;IAC1B,qEAAqE;IACrE,GAAG,EAAE,MAAM,CAAC;IACZ,uDAAuD;IACvD,IAAI,EAAE,MAAM,CAAC;IACb,oDAAoD;IACpD,IAAI,CAAC,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;CACxC;AAED,MAAM,WAAW,kBAAkB;IACjC,YAAY,CAAC,EAAE,aAAa,CAAC;IAC7B,cAAc,CAAC,EAAE,aAAa,CAAC;IAC/B,YAAY,CAAC,EAAE,aAAa,CAAC;IAC7B,eAAe,CAAC,EAAE,aAAa,CAAC;CACjC"}
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,qCAAqC,CAAC;AAEpE,MAAM,WAAW,WAAW;IAC1B,qEAAqE;IACrE,GAAG,EAAE,MAAM,CAAC;IACZ,uDAAuD;IACvD,IAAI,EAAE,MAAM,CAAC;IACb,oDAAoD;IACpD,IAAI,CAAC,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;CACxC;AAED,MAAM,WAAW,kBAAkB;IACjC,YAAY,CAAC,EAAE,aAAa,CAAC;IAC7B,cAAc,CAAC,EAAE,aAAa,CAAC;IAC/B,YAAY,CAAC,EAAE,aAAa,CAAC;IAC7B,eAAe,CAAC,EAAE,aAAa,CAAC;CACjC;AAED,MAAM,WAAW,oBAAoB;IACnC,qDAAqD;IACrD,GAAG,EAAE,MAAM,CAAC;IACZ,oCAAoC;IACpC,KAAK,EAAE,MAAM,CAAC;IACd,gDAAgD;IAChD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,6BAA6B;IAC7B,WAAW,CAAC,EAAE,MAAM,EAAE,CAAC;IACvB,gCAAgC;IAChC,cAAc,CAAC,EAAE,MAAM,EAAE,CAAC;IAC1B,4DAA4D;IAC5D,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,yCAAyC;IACzC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,+BAA+B;IAC/B,qBAAqB,CAAC,EAAE,MAAM,CAAC;CAChC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@progressive-development/pd-order",
|
|
3
|
-
"version": "1.1.
|
|
3
|
+
"version": "1.1.3",
|
|
4
4
|
"description": "Progressive Development Order Component",
|
|
5
5
|
"author": "PD Progressive Development",
|
|
6
6
|
"license": "MIT",
|
|
@@ -32,11 +32,11 @@
|
|
|
32
32
|
"fecha": "^4.2.3",
|
|
33
33
|
"tslib": "^2.8.1",
|
|
34
34
|
"@progressive-development/pd-shared-styles": "0.3.2",
|
|
35
|
-
"@progressive-development/pd-forms": "1.0.
|
|
35
|
+
"@progressive-development/pd-forms": "1.0.3",
|
|
36
|
+
"@progressive-development/pd-contact": "1.0.4",
|
|
37
|
+
"@progressive-development/pd-content": "1.0.3",
|
|
36
38
|
"@progressive-development/pd-price": "1.0.1",
|
|
37
|
-
"@progressive-development/pd-
|
|
38
|
-
"@progressive-development/pd-contact": "1.0.2",
|
|
39
|
-
"@progressive-development/pd-dialog": "1.0.1"
|
|
39
|
+
"@progressive-development/pd-dialog": "1.0.3"
|
|
40
40
|
},
|
|
41
41
|
"customElements": "custom-elements.json",
|
|
42
42
|
"keywords": [
|
|
@@ -1,41 +0,0 @@
|
|
|
1
|
-
import { Meta, StoryObj } from '@storybook/web-components-vite';
|
|
2
|
-
/**
|
|
3
|
-
* Story arguments interface for pd-order-agreement component.
|
|
4
|
-
* Maps to the component's public API for agreement acceptance.
|
|
5
|
-
*/
|
|
6
|
-
interface PdOrderAgreementArgs {
|
|
7
|
-
/** Whether agreement is required for form validation */
|
|
8
|
-
required: boolean;
|
|
9
|
-
}
|
|
10
|
-
/**
|
|
11
|
-
* ## pd-order-agreement
|
|
12
|
-
*
|
|
13
|
-
* Terms and conditions agreement component with checkbox validation and popup display.
|
|
14
|
-
*
|
|
15
|
-
* ### Features
|
|
16
|
-
* - Required/optional agreement checkbox with validation
|
|
17
|
-
* - Terms and conditions popup via pd-popup
|
|
18
|
-
* - Fires `pd-agreement-change` event on state change
|
|
19
|
-
* - Integrates with pd-order-summary via the `agreement` slot
|
|
20
|
-
* - Full i18n support via @lit/localize
|
|
21
|
-
*
|
|
22
|
-
* ### Accessibility
|
|
23
|
-
* - Checkbox supports keyboard navigation (Tab, Space)
|
|
24
|
-
* - Terms link is activatable via Enter/Space
|
|
25
|
-
* - Popup dialog for accessible modal viewing of terms
|
|
26
|
-
* - Validation messages announced to screen readers
|
|
27
|
-
*/
|
|
28
|
-
declare const meta: Meta<PdOrderAgreementArgs>;
|
|
29
|
-
export default meta;
|
|
30
|
-
type Story = StoryObj<PdOrderAgreementArgs>;
|
|
31
|
-
/** Default agreement with required checkbox and legal content. */
|
|
32
|
-
export declare const Default: Story;
|
|
33
|
-
/** Agreement with rich legal content in the popup slot. */
|
|
34
|
-
export declare const WithLegalContent: Story;
|
|
35
|
-
/** Overview of all agreement states for comparison. */
|
|
36
|
-
export declare const AllStates: Story;
|
|
37
|
-
/** Integration: pd-order-agreement inside pd-order-summary via the agreement slot. */
|
|
38
|
-
export declare const InOrderContext: Story;
|
|
39
|
-
/** CSS Custom Properties — customize link color. */
|
|
40
|
-
export declare const CustomStyling: Story;
|
|
41
|
-
//# sourceMappingURL=pd-order-agreement.stories.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"pd-order-agreement.stories.d.ts","sourceRoot":"","sources":["../../src/pd-order-agreement/pd-order-agreement.stories.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAIrE,OAAO,6CAA6C,CAAC;AAIrD,OAAO,yBAAyB,CAAC;AACjC,OAAO,yCAAyC,CAAC;AAEjD,OAAO,sCAAsC,CAAC;AAM9C;;;GAGG;AACH,UAAU,oBAAoB;IAC5B,wDAAwD;IACxD,QAAQ,EAAE,OAAO,CAAC;CACnB;AAqFD;;;;;;;;;;;;;;;;;GAiBG;AACH,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,oBAAoB,CAqEpC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,oBAAoB,CAAC,CAAC;AAM5C,kEAAkE;AAClE,eAAO,MAAM,OAAO,EAAE,KAOrB,CAAC;AAMF,2DAA2D;AAC3D,eAAO,MAAM,gBAAgB,EAAE,KAqC9B,CAAC;AAMF,uDAAuD;AACvD,eAAO,MAAM,SAAS,EAAE,KAwCvB,CAAC;AAMF,sFAAsF;AACtF,eAAO,MAAM,cAAc,EAAE,KAsB5B,CAAC;AAMF,oDAAoD;AACpD,eAAO,MAAM,aAAa,EAAE,KA6D3B,CAAC"}
|
|
@@ -1,65 +0,0 @@
|
|
|
1
|
-
import { Meta, StoryObj } from '@storybook/web-components-vite';
|
|
2
|
-
import { PdContactData } from '@progressive-development/pd-contact';
|
|
3
|
-
/**
|
|
4
|
-
* Story arguments interface for pd-order-contacts component.
|
|
5
|
-
* Maps to the component's public API for multi-contact order forms.
|
|
6
|
-
*/
|
|
7
|
-
interface PdOrderContactsArgs {
|
|
8
|
-
/** Show read-only summary mode */
|
|
9
|
-
summary: boolean;
|
|
10
|
-
/** Enable billing address option */
|
|
11
|
-
withPayment: boolean;
|
|
12
|
-
/** Enable property owner/landlord options */
|
|
13
|
-
withPropertyOwner: boolean;
|
|
14
|
-
/** Enable property date field */
|
|
15
|
-
withPropertyDate: boolean;
|
|
16
|
-
/** Required field names per contact */
|
|
17
|
-
requiredFields: string[];
|
|
18
|
-
/** Primary order contact data */
|
|
19
|
-
orderContact?: PdContactData;
|
|
20
|
-
/** Optional billing contact data */
|
|
21
|
-
billingContact?: PdContactData;
|
|
22
|
-
/** Optional admin contact data */
|
|
23
|
-
adminContact?: PdContactData;
|
|
24
|
-
/** Optional property address data */
|
|
25
|
-
propertyContact?: PdContactData;
|
|
26
|
-
}
|
|
27
|
-
/**
|
|
28
|
-
* ## pd-order-contacts
|
|
29
|
-
*
|
|
30
|
-
* Multi-contact management component for order workflows with collapsible
|
|
31
|
-
* address sections for order, billing, property, and admin contacts.
|
|
32
|
-
*
|
|
33
|
-
* ### Features
|
|
34
|
-
* - Primary order contact form (always visible)
|
|
35
|
-
* - Optional billing address section with toggle
|
|
36
|
-
* - Optional property owner section with landlord checkbox
|
|
37
|
-
* - Optional property date field
|
|
38
|
-
* - Admin/management contact for property owners
|
|
39
|
-
* - Summary mode for read-only display of all contacts
|
|
40
|
-
* - Form validation with required field support across all contacts
|
|
41
|
-
* - Collapsible sections via pd-collapse-group
|
|
42
|
-
*
|
|
43
|
-
* ### Form Methods
|
|
44
|
-
* - `triggerValidate()` — validates all visible contacts, opens first invalid section
|
|
45
|
-
* - `getValues()` — returns all visible contact data
|
|
46
|
-
* - `valid` — getter for current validation state
|
|
47
|
-
*/
|
|
48
|
-
declare const meta: Meta<PdOrderContactsArgs>;
|
|
49
|
-
export default meta;
|
|
50
|
-
type Story = StoryObj<PdOrderContactsArgs>;
|
|
51
|
-
/** Default empty order contacts form with a single address section. Interactive via Controls panel. */
|
|
52
|
-
export declare const Default: Story;
|
|
53
|
-
/** Form with pre-populated order contact data. */
|
|
54
|
-
export declare const Prepopulated: Story;
|
|
55
|
-
/** Form with billing address section enabled — shows toggle to add separate billing address. */
|
|
56
|
-
export declare const WithBilling: Story;
|
|
57
|
-
/** Form with property owner section — includes landlord checkbox, property address, and admin contact. */
|
|
58
|
-
export declare const WithPropertyOwner: Story;
|
|
59
|
-
/** All features enabled with pre-populated data across all contact sections. */
|
|
60
|
-
export declare const FullyConfigured: Story;
|
|
61
|
-
/** Read-only summary showing all configured contacts side by side. */
|
|
62
|
-
export declare const SummaryMode: Story;
|
|
63
|
-
/** Form with all fields marked as required — triggers validation on submit. */
|
|
64
|
-
export declare const RequiredFields: Story;
|
|
65
|
-
//# sourceMappingURL=pd-order-contacts.stories.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"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"}
|
|
@@ -1,54 +0,0 @@
|
|
|
1
|
-
import { Meta, StoryObj } from '@storybook/web-components-vite';
|
|
2
|
-
import { PdContactData } from '@progressive-development/pd-contact';
|
|
3
|
-
import { PdOrderStep } from '../types.js';
|
|
4
|
-
/**
|
|
5
|
-
* Story arguments interface for pd-order-summary component.
|
|
6
|
-
* Maps to the component's public API for order summary display.
|
|
7
|
-
*/
|
|
8
|
-
interface PdOrderSummaryArgs {
|
|
9
|
-
/** Show payment/pricing section */
|
|
10
|
-
withPayment: boolean;
|
|
11
|
-
/** Order steps to display in summary */
|
|
12
|
-
orderSteps: PdOrderStep[];
|
|
13
|
-
/** Primary order contact data */
|
|
14
|
-
orderContact: PdContactData;
|
|
15
|
-
/** Optional billing contact data */
|
|
16
|
-
billingContact?: PdContactData;
|
|
17
|
-
}
|
|
18
|
-
/**
|
|
19
|
-
* ## pd-order-summary
|
|
20
|
-
*
|
|
21
|
-
* Order summary component that displays configurable steps and pricing information.
|
|
22
|
-
*
|
|
23
|
-
* ### Features
|
|
24
|
-
* - Configurable order steps with edit-content integration
|
|
25
|
-
* - Automatic contact summary rendering for "contacts" step key
|
|
26
|
-
* - Price table with tax calculation via pd-pricetable
|
|
27
|
-
* - Agreement slot for pd-order-agreement integration
|
|
28
|
-
* - Named slots for custom step content
|
|
29
|
-
* - Fires `go-to` event when user clicks edit on a step
|
|
30
|
-
*
|
|
31
|
-
* ### Slots
|
|
32
|
-
* - `agreement` — Slot for pd-order-agreement component
|
|
33
|
-
* - `[stepKey]` — Named slots for custom step content
|
|
34
|
-
*
|
|
35
|
-
* ### Usage Note
|
|
36
|
-
* Stories use `pd-order-summary-test` (a test wrapper that extends PdOrderSummary)
|
|
37
|
-
* to provide a concrete implementation for demo purposes.
|
|
38
|
-
*/
|
|
39
|
-
declare const meta: Meta<PdOrderSummaryArgs>;
|
|
40
|
-
export default meta;
|
|
41
|
-
type Story = StoryObj<PdOrderSummaryArgs>;
|
|
42
|
-
/** Default order summary with payment enabled. Interactive via Controls panel. */
|
|
43
|
-
export declare const Default: Story;
|
|
44
|
-
/** Order summary showing separate billing contact alongside order contact. */
|
|
45
|
-
export declare const WithBillingContact: Story;
|
|
46
|
-
/** Order summary without the pricing/payment section — for non-billable orders. */
|
|
47
|
-
export declare const WithoutPayment: Story;
|
|
48
|
-
/** Order summary with pd-order-agreement in the agreement slot. */
|
|
49
|
-
export declare const WithAgreementSlot: Story;
|
|
50
|
-
/** All summary configurations side by side for comparison. */
|
|
51
|
-
export declare const AllConfigurations: Story;
|
|
52
|
-
/** CSS Custom Properties — Branded and Redesigned payment section variants. */
|
|
53
|
-
export declare const CustomStyling: Story;
|
|
54
|
-
//# sourceMappingURL=pd-order-summary.stories.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"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;AAEzE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAG/C,OAAO,sCAAsC,CAAC;AAC9C,OAAO,6CAA6C,CAAC;AAMrD;;;GAGG;AACH,UAAU,kBAAkB;IAC1B,mCAAmC;IACnC,WAAW,EAAE,OAAO,CAAC;IACrB,wCAAwC;IACxC,UAAU,EAAE,WAAW,EAAE,CAAC;IAC1B,iCAAiC;IACjC,YAAY,EAAE,aAAa,CAAC;IAC5B,oCAAoC;IACpC,cAAc,CAAC,EAAE,aAAa,CAAC;CAChC;AA8ED;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,kBAAkB,CAiFlC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,kBAAkB,CAAC,CAAC;AAM1C,kFAAkF;AAClF,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,mEAAmE;AACnE,eAAO,MAAM,iBAAiB,EAAE,KAqB/B,CAAC;AAMF,8DAA8D;AAC9D,eAAO,MAAM,iBAAiB,EAAE,KA0D/B,CAAC;AAMF,+EAA+E;AAC/E,eAAO,MAAM,aAAa,EAAE,KAwE3B,CAAC"}
|