@progressive-development/pd-order 0.1.130 → 0.5.1

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.
Files changed (42) hide show
  1. package/dist/index.js +12 -0
  2. package/dist/locales/be.js +10 -0
  3. package/dist/locales/de.js +14 -4
  4. package/dist/locales/en.js +10 -0
  5. package/dist/pd-order-contacts.js +3 -1
  6. package/dist/pd-order-summary.js +3 -1
  7. package/dist/src/PdOrderContacts.js +155 -33
  8. package/dist/src/PdOrderSummary.js +8 -8
  9. package/package.json +18 -16
  10. package/dist/node_modules/@progressive-development/pd-contact/pd-contact.js +0 -2
  11. package/dist/node_modules/@progressive-development/pd-contact/src/PdContact.js +0 -566
  12. package/dist/node_modules/@progressive-development/pd-content/pd-collapse.js +0 -2
  13. package/dist/node_modules/@progressive-development/pd-content/pd-edit-content.js +0 -2
  14. package/dist/node_modules/@progressive-development/pd-content/src/PdCollapse.js +0 -135
  15. package/dist/node_modules/@progressive-development/pd-content/src/PdEditContent.js +0 -223
  16. package/dist/node_modules/@progressive-development/pd-dialog/pd-popup.js +0 -2
  17. package/dist/node_modules/@progressive-development/pd-dialog/src/PdPopup.js +0 -112
  18. package/dist/node_modules/@progressive-development/pd-forms/pd-checkbox.js +0 -2
  19. package/dist/node_modules/@progressive-development/pd-forms/pd-form-container.js +0 -2
  20. package/dist/node_modules/@progressive-development/pd-forms/pd-form-row.js +0 -2
  21. package/dist/node_modules/@progressive-development/pd-forms/pd-hover-box.js +0 -2
  22. package/dist/node_modules/@progressive-development/pd-forms/pd-input.js +0 -2
  23. package/dist/node_modules/@progressive-development/pd-forms/pd-radio-group.js +0 -2
  24. package/dist/node_modules/@progressive-development/pd-forms/src/PdBaseInputElement.js +0 -86
  25. package/dist/node_modules/@progressive-development/pd-forms/src/PdBaseUi.js +0 -33
  26. package/dist/node_modules/@progressive-development/pd-forms/src/PdBaseUiInput.js +0 -229
  27. package/dist/node_modules/@progressive-development/pd-forms/src/PdCheckbox.js +0 -230
  28. package/dist/node_modules/@progressive-development/pd-forms/src/PdFormContainer.js +0 -167
  29. package/dist/node_modules/@progressive-development/pd-forms/src/PdFormRow.js +0 -92
  30. package/dist/node_modules/@progressive-development/pd-forms/src/PdHoverBox.js +0 -108
  31. package/dist/node_modules/@progressive-development/pd-forms/src/PdInput.js +0 -79
  32. package/dist/node_modules/@progressive-development/pd-forms/src/PdRadioGroup.js +0 -72
  33. package/dist/node_modules/@progressive-development/pd-forms/src/shared-input-field-styles.js +0 -152
  34. package/dist/node_modules/@progressive-development/pd-forms/src/shared-input-styles.js +0 -64
  35. package/dist/node_modules/@progressive-development/pd-icon/pd-icon.js +0 -4
  36. package/dist/node_modules/@progressive-development/pd-icon/src/PdIcon.js +0 -595
  37. package/dist/node_modules/@progressive-development/pd-price/pd-pricetable.js +0 -2
  38. package/dist/node_modules/@progressive-development/pd-price/src/PdPricetable.js +0 -149
  39. package/dist/node_modules/fecha/lib/fecha.js +0 -200
  40. package/dist/node_modules/lit/node_modules/lit-html/directive.js +0 -27
  41. package/dist/node_modules/lit/node_modules/lit-html/directives/class-map.js +0 -36
  42. package/dist/node_modules/lit/node_modules/lit-html/lit-html.js +0 -242
@@ -1,223 +0,0 @@
1
- import { html, LitElement, css } from "lit";
2
- import { PDColorStyles, PDFontStyles } from "@progressive-development/pd-shared-styles";
3
- /**
4
- * @license
5
- * Copyright (c) 2021 PD Progressive Development UG. All rights reserved.
6
- */
7
- const editIcon = html`<svg
8
- class="edit"
9
- id="Layer_1"
10
- version="1.1"
11
- viewBox="0 0 19 19"
12
- xml:space="preserve"
13
- xmlns="http://www.w3.org/2000/svg"
14
- xmlns:xlink="http://www.w3.org/1999/xlink"
15
- >
16
- <g>
17
- <path
18
- d="M8.44,7.25C8.348,7.342,8.277,7.447,8.215,7.557L8.174,7.516L8.149,7.69 C8.049,7.925,8.014,8.183,8.042,8.442l-0.399,2.796l2.797-0.399c0.259,0.028,0.517-0.007,0.752-0.107l0.174-0.024l-0.041-0.041 c0.109-0.062,0.215-0.133,0.307-0.225l5.053-5.053l-3.191-3.191L8.44,7.25z"
19
- fill="var(--edit-fill-color)"
20
- />
21
- <path
22
- d="M18.183,1.568l-0.87-0.87c-0.641-0.641-1.637-0.684-2.225-0.097l-0.797,0.797l3.191,3.191l0.797-0.798 C18.867,3.205,18.824,2.209,18.183,1.568z"
23
- fill="var(--edit-fill-color)"
24
- />
25
- <path
26
- d="M15,9.696V17H2V2h8.953l1.523-1.42c0.162-0.161,0.353-0.221,0.555-0.293 c0.043-0.119,0.104-0.18,0.176-0.287H0v19h17V7.928L15,9.696z"
27
- fill="var(--edit-fill-color)"
28
- />
29
- </g>
30
- </svg>`;
31
- class PdEditContent extends LitElement {
32
- /**
33
- * @event edit-content
34
- */
35
- static get styles() {
36
- return [
37
- PDColorStyles,
38
- PDFontStyles,
39
- css`
40
- :host {
41
- display: block;
42
- }
43
-
44
- h4 {
45
- font-family: var(--pd-default-font-title-family);
46
- font-size: var(--pd-ec-font-title-size, 1.2em);
47
- margin-top: 0px;
48
- margin-bottom: 2px;
49
- line-height: 40px;
50
- color: var(--pd-ec-font-title-col, var(--pd-default-bg-col));
51
- padding-left: 5px;
52
- }
53
-
54
- .header {
55
- display: flex;
56
- gap: 5px;
57
- background-color: var(--pd-ec-bg-col, var(--pd-default-col));
58
- align-items: center;
59
- }
60
-
61
- .circle {
62
- margin-left: 5px;
63
- display: flex;
64
- align-items: center;
65
- justify-content: center;
66
- width: 27px;
67
- height: 27px;
68
- border-radius: 50%;
69
- background-color: var(--pd-ec-font-title-col, var(--pd-default-bg-col));
70
- }
71
-
72
- .step-number {
73
- font-family: var(--pd-default-font-title-family);
74
- font-size: var(--pd-ec-font-title-size, 1.2em);
75
- font-weight: var(--pd-ec-nr-font-weight, bold); ;
76
- color: var(--pd-ec-bg-col, var(--pd-default-col));
77
- }
78
-
79
- /* Temporär? Hier noch sehr aufwendig mit div/span? */
80
-
81
- .label {
82
- display: inline-block;
83
- font-weight: bold;
84
- width: 200px;
85
- padding-top: 10px;
86
- }
87
-
88
- /* Temporär */
89
- a {
90
- cursor: pointer;
91
- font-family: var(--pd-default-font-link-family);
92
- font-size: var(--pd-default-font-link-size);
93
- color: var(--pd-default-font-link-col);
94
- --edit-fill-color: var(--pd-default-font-link-col);
95
- }
96
- a:hover {
97
- color: var(--pd-default-font-link-col-hover);
98
- --edit-fill-color: var(--pd-default-font-link-col-hover);
99
- }
100
-
101
- .edit {
102
- width: 1.1em;
103
- }
104
- /*
105
- could used as class for given svg icons, workaround class
106
- hard coded for specific icon => maybe use custom properties here, but not for that hack...
107
- */
108
- .own-edit-icon {
109
- width: 2em;
110
- margin-top: -10px;
111
- }
112
-
113
- .link-row {
114
- padding-top: 5px;
115
- padding-bottom: 5px;
116
- display: flex;
117
- flex-wrap: wrap;
118
- gap: 15px;
119
- }
120
-
121
- .link-item {
122
- display: flex;
123
- gap: 2px;
124
- white-space: nowrap;
125
- align-items: center;
126
- pointer-events: none;
127
- }
128
-
129
- .param-data {
130
- padding-bottom: 10px;
131
- }
132
-
133
- @media (max-width: 360px) {
134
- .label {
135
- width: 130px;
136
- }
137
- }
138
- `
139
- ];
140
- }
141
- static get properties() {
142
- return {
143
- stepNumber: { type: Number },
144
- contentTitle: { type: String },
145
- data: { type: Array },
146
- editLinks: { type: Array },
147
- // TODO: [TIM-37] Put together with edit icon/editDisabled
148
- editDisabled: { type: Boolean }
149
- };
150
- }
151
- constructor() {
152
- super();
153
- this.stepNumber = void 0;
154
- this.contentTitle = "";
155
- this.data = [];
156
- this.editLinks = [];
157
- this.editDisabled = false;
158
- }
159
- render() {
160
- return html`
161
- <div class="header">
162
- ${this.stepNumber ? html`
163
- <div class="circle">
164
- <span class="step-number">${this.stepNumber}</span>
165
- </div>
166
- ` : ""}
167
- <h4>${this.contentTitle}</h4>
168
- </div>
169
- <div>
170
- ${this.data ? html`
171
- <div class="param-data">
172
- ${this.data.map(
173
- (dataEntry) => html`
174
- <div>
175
- <span class="label">${dataEntry.name}</span>
176
- <span class="value">${dataEntry.val}</span>
177
- </div>
178
- `
179
- )}
180
- </div>` : ""}
181
- <slot></slot>
182
- <div class="link-row">
183
- ${this.editDisabled ? "" : html`
184
- <a @click="${this._editContent}">
185
- <div class="link-item">${editIcon} Bewerk ${this.contentTitle}</div>
186
- </a>
187
- `}
188
- ${this.editLinks.map(
189
- (link) => html`
190
- <a data-link="${link.key}" @click="${this._editContent}">
191
- <div class="link-item">${PdEditContent._getLinkLogo(link)} ${link.txt}</div>
192
- </a>`
193
- )}
194
- </div>
195
- </div>
196
- `;
197
- }
198
- static _getLinkLogo(link) {
199
- if (link.icon) {
200
- return link.icon;
201
- }
202
- if (link.defaultIcon) {
203
- return editIcon;
204
- }
205
- return "";
206
- }
207
- _editContent(e) {
208
- const { link } = e.target.dataset;
209
- this.dispatchEvent(
210
- new CustomEvent("edit-content", {
211
- detail: {
212
- step: this.stepNumber,
213
- link
214
- },
215
- bubbles: true,
216
- composed: true
217
- })
218
- );
219
- }
220
- }
221
- export {
222
- PdEditContent
223
- };
@@ -1,2 +0,0 @@
1
- import { PdPopup } from "./src/PdPopup.js";
2
- window.customElements.define("pd-popup", PdPopup);
@@ -1,112 +0,0 @@
1
- import { LitElement, css, html } from "lit";
2
- import { ICON_CLOSE } from "../../pd-icon/src/PdIcon.js";
3
- import "../../pd-icon/pd-icon.js";
4
- import { PDColorStyles } from "@progressive-development/pd-shared-styles";
5
- /**
6
- * @license
7
- * Copyright (c) 2021 PD Progressive Development UG. All rights reserved.
8
- */
9
- class PdPopup extends LitElement {
10
- static get styles() {
11
- return [
12
- PDColorStyles,
13
- css`
14
- :host {
15
- display: block;
16
- }
17
-
18
- /* The Modal (background) */
19
- .modal {
20
- position: fixed; /* Stay in place */
21
- z-index: 100; /* Sit on top */
22
- left: 0;
23
- top: 0;
24
- width: 100%; /* Full width */
25
- height: 100%; /* Full height */
26
- overflow: auto; /* Enable scroll if needed */
27
- /* RGBA Wert muss hier verwendet werden #AFC1D2 to rgba for opacity */
28
- background-color: var(--pd-popup-modal-bg-rgba, rgba(175, 193, 210, 0.8));
29
-
30
- /* specific for PdPopup, abobe also used for PdPopupDialog */
31
- display: var(--pd-popup-default-display, none); /* Hidden by default */
32
- padding-top: 100px; /* Location of the box */
33
- }
34
-
35
- /* Modal Content */
36
- .modal-content {
37
- background-color: var(--pd-default-bg-col);
38
- opacity: 1;
39
- margin: auto;
40
- padding: var(--pd-popup-modal-padding, 20px);
41
- padding-bottom: 130px;
42
- border: 2px solid var(--pd-default-col);
43
- width: 80%;
44
- max-width: 1200px;
45
- position: relative;
46
- }
47
-
48
- .modal-content-slot {
49
- max-width: var(--pd-popup-modal-slot-max-width, 1000px);
50
- margin: var(--pd-popup-modal-slot-margin, 0 30px);
51
- }
52
-
53
- .close-icon {
54
- position: absolute;
55
- cursor: pointer;
56
- right: 1.2em;
57
- top: 1.2em;
58
- }`
59
- ];
60
- }
61
- render() {
62
- return html`
63
- <!-- Trigger/Open The Modal -->
64
- <span @click="${this._activatePopup}" @keypress="${this._activatePopup}"
65
- ><slot name="small-view"></slot
66
- ></span>
67
-
68
- <!-- The Modal -->
69
- <div id="modalId" class="modal">
70
- <!-- Modal content -->
71
- <div class="modal-content">
72
- <pd-icon icon="${ICON_CLOSE}" class="close-icon"
73
- @click="${this._closePopup}"></pd-icon>
74
- <div class="modal-content-slot">
75
- <slot name="content"></slot>
76
- </div>
77
- </div>
78
- </div>
79
- `;
80
- }
81
- showPopup() {
82
- this._activatePopup();
83
- }
84
- hidePopup() {
85
- this._closePopup();
86
- }
87
- _activatePopup() {
88
- const modal = this.shadowRoot.getElementById("modalId");
89
- modal.style.display = "block";
90
- }
91
- _closePopup() {
92
- const modal = this.shadowRoot.getElementById("modalId");
93
- modal.style.display = "none";
94
- this.dispatchEvent(
95
- new CustomEvent("popup-close", {
96
- bubbles: true,
97
- composed: true
98
- })
99
- );
100
- }
101
- /*
102
- // When the user clicks anywhere outside of the modal, close it
103
- window.onclick = function(event) {
104
- if (event.target == modal) {
105
- modal.style.display = "none";
106
- }
107
- }
108
- */
109
- }
110
- export {
111
- PdPopup
112
- };
@@ -1,2 +0,0 @@
1
- import { PdCheckbox } from "./src/PdCheckbox.js";
2
- window.customElements.define("pd-checkbox", PdCheckbox);
@@ -1,2 +0,0 @@
1
- import { PdFormContainer } from "./src/PdFormContainer.js";
2
- window.customElements.define("pd-form-container", PdFormContainer);
@@ -1,2 +0,0 @@
1
- import { PdFormRow } from "./src/PdFormRow.js";
2
- window.customElements.define("pd-form-row", PdFormRow);
@@ -1,2 +0,0 @@
1
- import { PdHoverBox } from "./src/PdHoverBox.js";
2
- window.customElements.define("pd-hover-box", PdHoverBox);
@@ -1,2 +0,0 @@
1
- import { PdInput } from "./src/PdInput.js";
2
- window.customElements.define("pd-input", PdInput);
@@ -1,2 +0,0 @@
1
- import { PdRadioGroup } from "./src/PdRadioGroup.js";
2
- window.customElements.define("pd-radio-group", PdRadioGroup);
@@ -1,86 +0,0 @@
1
- import { PdBaseUIInput, INPUT_TYPE_DATE, INPUT_TYPE_TEXT, INPUT_TYPE_FILE, INPUT_TYPE_SELECT, INPUT_TYPE_AREA } from "./PdBaseUiInput.js";
2
- import { SharedInputFieldStyles } from "./shared-input-field-styles.js";
3
- /**
4
- * @license
5
- * Copyright (c) 2021 PD Progressive Development UG. All rights reserved.
6
- *
7
- * Abstract base lit class for pd-input elements.
8
- *
9
- * Used from:
10
- * - pd-input
11
- * - pd-input-area
12
- * - pd-select
13
- *
14
- * Used to:
15
- * - define element specific css
16
- * - handle auto completion
17
- *
18
- * Events:
19
- * - TODO
20
- *
21
- * Custom Properties (shared-input-field-styles):
22
- * ... TODO
23
- *
24
- */
25
- class PdBaseInputElement extends PdBaseUIInput {
26
- /**
27
- * Fire when the `pd-input` loses focus.
28
- * @event focus-lost
29
- */
30
- static get styles() {
31
- return [PdBaseUIInput.styles, SharedInputFieldStyles];
32
- }
33
- static get properties() {
34
- return {
35
- placeHolder: { type: String },
36
- /* not used at the moment */
37
- name: { type: String },
38
- autoCompleteName: { type: String }
39
- };
40
- }
41
- constructor() {
42
- super();
43
- this.placeHolder = "";
44
- this.name = "";
45
- this._input = {};
46
- }
47
- firstUpdated() {
48
- this._input = this.shadowRoot.querySelector(this._getElementName());
49
- }
50
- focus() {
51
- this._input.focus();
52
- }
53
- _onBlur(event) {
54
- this.dispatchEvent(
55
- new CustomEvent("focus-lost", {
56
- detail: {
57
- value: this._input.value
58
- },
59
- composed: true,
60
- bubbles: true
61
- })
62
- );
63
- this._handleChangedValue(this._input.value, event, true, true);
64
- }
65
- _onKeyUp(event) {
66
- this._handleChangedValue(this._input.value, event, true);
67
- }
68
- _getElementName() {
69
- switch (this._inputType) {
70
- case INPUT_TYPE_AREA:
71
- return "textarea";
72
- case INPUT_TYPE_SELECT:
73
- return "select";
74
- case INPUT_TYPE_FILE:
75
- case INPUT_TYPE_TEXT:
76
- return "input";
77
- case INPUT_TYPE_DATE:
78
- return "pd-input";
79
- default:
80
- return "";
81
- }
82
- }
83
- }
84
- export {
85
- PdBaseInputElement
86
- };
@@ -1,33 +0,0 @@
1
- import { LitElement } from "lit";
2
- import { updateWhenLocaleChanges } from "@lit/localize";
3
- import { PDColorStyles, PDFontStyles } from "@progressive-development/pd-shared-styles";
4
- /**
5
- * @license
6
- * Copyright (c) 2021 PD Progressive Development UG. All rights reserved.
7
- *
8
- * Abstract base lit class for all pd-form elements.
9
- * Import shared-global-style to make common custom properties available to all components.
10
- *
11
- * Used from:
12
- * - pd-base-ui-input
13
- *
14
- * Used to:
15
- * - define css (import shared-global-styles.js)
16
- * - define common properties (detailieren, aktuell keine)
17
- * - define updateWhenLocaleChanges for all pd-elements (check, aktuell nur für pd-form-container benötigt)
18
- *
19
- * Custom Properties (shared-global-styles):
20
- * ... TODO
21
- */
22
- class PdBaseUI extends LitElement {
23
- static get styles() {
24
- return [PDColorStyles, PDFontStyles];
25
- }
26
- constructor() {
27
- super();
28
- updateWhenLocaleChanges(this);
29
- }
30
- }
31
- export {
32
- PdBaseUI
33
- };