@foxy.io/elements 1.15.0-beta.2 → 1.15.0-beta.5

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 (170) hide show
  1. package/dist/cdn/foxy-access-recovery-form.js +1 -1
  2. package/dist/cdn/foxy-address-card.js +1 -1
  3. package/dist/cdn/foxy-address-form.js +1 -1
  4. package/dist/cdn/foxy-applied-tax-card.js +1 -1
  5. package/dist/cdn/foxy-attribute-card.js +1 -1
  6. package/dist/cdn/foxy-attribute-form.js +1 -1
  7. package/dist/cdn/foxy-cancellation-form.js +1 -1
  8. package/dist/cdn/foxy-collection-page.js +1 -1
  9. package/dist/cdn/foxy-collection-pages.js +1 -1
  10. package/dist/cdn/foxy-coupon-card.js +1 -1
  11. package/dist/cdn/foxy-coupon-code-form.js +1 -1
  12. package/dist/cdn/foxy-coupon-codes-form.js +1 -1
  13. package/dist/cdn/foxy-coupon-form.js +1 -1
  14. package/dist/cdn/foxy-custom-field-card.js +1 -1
  15. package/dist/cdn/foxy-custom-field-form.js +1 -1
  16. package/dist/cdn/foxy-customer-api.js +1 -1
  17. package/dist/cdn/foxy-customer-card.js +1 -1
  18. package/dist/cdn/foxy-customer-form.js +1 -1
  19. package/dist/cdn/foxy-customer-portal-settings.js +1 -169
  20. package/dist/cdn/foxy-customer-portal.js +1 -1
  21. package/dist/cdn/foxy-customer.js +1 -1
  22. package/dist/cdn/foxy-customers-table.js +1 -1
  23. package/dist/cdn/foxy-discount-card.js +1 -1
  24. package/dist/cdn/foxy-donation.js +1 -1
  25. package/dist/cdn/foxy-email-template-form.js +1 -1
  26. package/dist/cdn/foxy-error-entry-card.js +1 -1
  27. package/dist/cdn/foxy-form-dialog.js +1 -1
  28. package/dist/cdn/foxy-generate-codes-form.js +1 -1
  29. package/dist/cdn/foxy-gift-card-card.js +1 -0
  30. package/dist/cdn/foxy-gift-card-code-form.js +1 -0
  31. package/dist/cdn/foxy-gift-card-codes-form.js +1 -0
  32. package/dist/cdn/foxy-gift-card-form.js +1 -0
  33. package/dist/cdn/foxy-i18n.js +1 -1
  34. package/dist/cdn/foxy-items-form.js +1 -1
  35. package/dist/cdn/foxy-nucleon-element.js +1 -1
  36. package/dist/cdn/foxy-pagination.js +1 -1
  37. package/dist/cdn/foxy-payment-card.js +1 -1
  38. package/dist/cdn/foxy-payment-method-card.js +1 -1
  39. package/dist/cdn/foxy-query-builder.js +1 -1
  40. package/dist/cdn/foxy-sign-in-form.js +1 -1
  41. package/dist/cdn/foxy-spinner.js +1 -1
  42. package/dist/cdn/foxy-subscription-card.js +1 -1
  43. package/dist/cdn/foxy-subscription-form.js +1 -1
  44. package/dist/cdn/foxy-subscriptions-table.js +1 -1
  45. package/dist/cdn/foxy-table.js +1 -1
  46. package/dist/cdn/foxy-tax-card.js +1 -1
  47. package/dist/cdn/foxy-tax-form.js +1 -1
  48. package/dist/cdn/foxy-template-config-form.js +1 -1
  49. package/dist/cdn/foxy-template-form.js +1 -1
  50. package/dist/cdn/foxy-transaction-card.js +1 -1
  51. package/dist/cdn/foxy-transactions-table.js +1 -1
  52. package/dist/cdn/foxy-user-form.js +1 -1
  53. package/dist/cdn/foxy-users-table.js +1 -1
  54. package/dist/cdn/shared-0032dc09.js +302 -0
  55. package/dist/cdn/{shared-9af7b5f0.js → shared-02945b27.js} +1 -1
  56. package/dist/cdn/{shared-c6a4b2d6.js → shared-05488216.js} +1 -1
  57. package/dist/cdn/{shared-b03b6d72.js → shared-07049bfe.js} +1 -1
  58. package/dist/cdn/{shared-ccea5a33.js → shared-08c63028.js} +1 -1
  59. package/dist/cdn/shared-09069d7c.js +1 -0
  60. package/dist/cdn/shared-0e4d19e2.js +1 -0
  61. package/dist/cdn/{shared-d3831f99.js → shared-21419f10.js} +1 -1
  62. package/dist/cdn/{shared-423a4840.js → shared-39e3ae67.js} +1 -1
  63. package/dist/cdn/{shared-51b5e223.js → shared-40b5267a.js} +1 -1
  64. package/dist/cdn/{shared-d9a260f0.js → shared-43abbdd9.js} +1 -1
  65. package/dist/cdn/{shared-fb403e1f.js → shared-448781f9.js} +1 -1
  66. package/dist/cdn/{shared-a8d96c23.js → shared-4cc1da27.js} +1 -1
  67. package/dist/cdn/{shared-8f7a66c4.js → shared-4dc6d228.js} +1 -1
  68. package/dist/cdn/{shared-c1dadefe.js → shared-5535f38f.js} +1 -1
  69. package/dist/cdn/{shared-a11160e7.js → shared-5639389e.js} +1 -1
  70. package/dist/cdn/shared-66633ff7.js +1 -0
  71. package/dist/cdn/{shared-0bda8ecb.js → shared-67ca44d2.js} +1 -1
  72. package/dist/cdn/{shared-30131f76.js → shared-756034e4.js} +1 -1
  73. package/dist/cdn/shared-7f0a9790.js +1 -0
  74. package/dist/cdn/shared-8a5ec3cf.js +1 -0
  75. package/dist/cdn/{shared-b2330475.js → shared-a23cf7c8.js} +1 -1
  76. package/dist/cdn/{shared-ff149b55.js → shared-b30bc42d.js} +1 -1
  77. package/dist/cdn/{shared-a4e6ecb0.js → shared-b9f18aaa.js} +1 -1
  78. package/dist/cdn/{shared-f875a4f8.js → shared-cf6751d3.js} +1 -1
  79. package/dist/cdn/{shared-51e28c83.js → shared-df730f90.js} +1 -1
  80. package/dist/cdn/{shared-4038cb18.js → shared-e209cb55.js} +1 -1
  81. package/dist/cdn/{shared-cd3c902e.js → shared-e68b9c83.js} +1 -1
  82. package/dist/cdn/translations/shared/en.json +178 -0
  83. package/dist/cdn/translations/shared/zh-hk.json +179 -0
  84. package/dist/elements/private/EditableList/EditableList.js +1 -0
  85. package/dist/elements/private/EditableList/EditableList.js.map +1 -1
  86. package/dist/elements/private/FrequencyInput/FrequencyInput.d.ts +2 -1
  87. package/dist/elements/private/FrequencyInput/FrequencyInput.js +3 -1
  88. package/dist/elements/private/FrequencyInput/FrequencyInput.js.map +1 -1
  89. package/dist/elements/public/CollectionPage/CollectionPage.js +3 -1
  90. package/dist/elements/public/CollectionPage/CollectionPage.js.map +1 -1
  91. package/dist/elements/public/CollectionPage/types.d.ts +2 -0
  92. package/dist/elements/public/CollectionPage/types.js.map +1 -1
  93. package/dist/elements/public/CouponCard/CouponCard.js +2 -2
  94. package/dist/elements/public/CouponCard/CouponCard.js.map +1 -1
  95. package/dist/elements/public/CouponCodesForm/CouponCodesForm.d.ts +2 -0
  96. package/dist/elements/public/CouponCodesForm/CouponCodesForm.js +7 -1
  97. package/dist/elements/public/CouponCodesForm/CouponCodesForm.js.map +1 -1
  98. package/dist/elements/public/CouponForm/CouponForm.js +0 -2
  99. package/dist/elements/public/CouponForm/CouponForm.js.map +1 -1
  100. package/dist/elements/public/GiftCardCard/GiftCardCard.d.ts +26 -0
  101. package/dist/elements/public/GiftCardCard/GiftCardCard.js +118 -0
  102. package/dist/elements/public/GiftCardCard/GiftCardCard.js.map +1 -0
  103. package/dist/elements/public/GiftCardCard/index.d.ts +5 -0
  104. package/dist/elements/public/GiftCardCard/index.js +7 -0
  105. package/dist/elements/public/GiftCardCard/index.js.map +1 -0
  106. package/dist/elements/public/GiftCardCard/types.d.ts +11 -0
  107. package/dist/elements/public/GiftCardCard/types.js +2 -0
  108. package/dist/elements/public/GiftCardCard/types.js.map +1 -0
  109. package/dist/elements/public/GiftCardCodeForm/GiftCardCodeForm.d.ts +55 -0
  110. package/dist/elements/public/GiftCardCodeForm/GiftCardCodeForm.js +292 -0
  111. package/dist/elements/public/GiftCardCodeForm/GiftCardCodeForm.js.map +1 -0
  112. package/dist/elements/public/GiftCardCodeForm/index.d.ts +10 -0
  113. package/dist/elements/public/GiftCardCodeForm/index.js +12 -0
  114. package/dist/elements/public/GiftCardCodeForm/index.js.map +1 -0
  115. package/dist/elements/public/GiftCardCodeForm/types.d.ts +19 -0
  116. package/dist/elements/public/GiftCardCodeForm/types.js +2 -0
  117. package/dist/elements/public/GiftCardCodeForm/types.js.map +1 -0
  118. package/dist/elements/public/GiftCardCodesForm/GiftCardCodesForm.d.ts +31 -0
  119. package/dist/elements/public/GiftCardCodesForm/GiftCardCodesForm.js +215 -0
  120. package/dist/elements/public/GiftCardCodesForm/GiftCardCodesForm.js.map +1 -0
  121. package/dist/elements/public/GiftCardCodesForm/index.d.ts +8 -0
  122. package/dist/elements/public/GiftCardCodesForm/index.js +12 -0
  123. package/dist/elements/public/GiftCardCodesForm/index.js.map +1 -0
  124. package/dist/elements/public/GiftCardCodesForm/internal/InternalGiftCardCodesFormListItem.d.ts +19 -0
  125. package/dist/elements/public/GiftCardCodesForm/internal/InternalGiftCardCodesFormListItem.js +48 -0
  126. package/dist/elements/public/GiftCardCodesForm/internal/InternalGiftCardCodesFormListItem.js.map +1 -0
  127. package/dist/elements/public/GiftCardCodesForm/types.d.ts +16 -0
  128. package/dist/elements/public/GiftCardCodesForm/types.js +2 -0
  129. package/dist/elements/public/GiftCardCodesForm/types.js.map +1 -0
  130. package/dist/elements/public/GiftCardForm/GiftCardForm.d.ts +66 -0
  131. package/dist/elements/public/GiftCardForm/GiftCardForm.js +650 -0
  132. package/dist/elements/public/GiftCardForm/GiftCardForm.js.map +1 -0
  133. package/dist/elements/public/GiftCardForm/currencies.d.ts +1 -0
  134. package/dist/elements/public/GiftCardForm/currencies.js +173 -0
  135. package/dist/elements/public/GiftCardForm/currencies.js.map +1 -0
  136. package/dist/elements/public/GiftCardForm/index.d.ts +18 -0
  137. package/dist/elements/public/GiftCardForm/index.js +20 -0
  138. package/dist/elements/public/GiftCardForm/index.js.map +1 -0
  139. package/dist/elements/public/GiftCardForm/private/CategoryRestrictionsPage.d.ts +20 -0
  140. package/dist/elements/public/GiftCardForm/private/CategoryRestrictionsPage.js +99 -0
  141. package/dist/elements/public/GiftCardForm/private/CategoryRestrictionsPage.js.map +1 -0
  142. package/dist/elements/public/GiftCardForm/private/CategoryRestrictionsPageItem.d.ts +20 -0
  143. package/dist/elements/public/GiftCardForm/private/CategoryRestrictionsPageItem.js +52 -0
  144. package/dist/elements/public/GiftCardForm/private/CategoryRestrictionsPageItem.js.map +1 -0
  145. package/dist/elements/public/GiftCardForm/private/CategoryRestrictionsPageItemContent.d.ts +20 -0
  146. package/dist/elements/public/GiftCardForm/private/CategoryRestrictionsPageItemContent.js +53 -0
  147. package/dist/elements/public/GiftCardForm/private/CategoryRestrictionsPageItemContent.js.map +1 -0
  148. package/dist/elements/public/GiftCardForm/types.d.ts +28 -0
  149. package/dist/elements/public/GiftCardForm/types.js +2 -0
  150. package/dist/elements/public/GiftCardForm/types.js.map +1 -0
  151. package/dist/elements/public/NucleonElement/NucleonElement.js +4 -4
  152. package/dist/elements/public/NucleonElement/NucleonElement.js.map +1 -1
  153. package/dist/elements/public/index.d.ts +4 -0
  154. package/dist/elements/public/index.defined.d.ts +4 -0
  155. package/dist/elements/public/index.defined.js +4 -0
  156. package/dist/elements/public/index.defined.js.map +1 -1
  157. package/dist/elements/public/index.js +4 -0
  158. package/dist/elements/public/index.js.map +1 -1
  159. package/dist/mixins/themeable.js +12 -0
  160. package/dist/mixins/themeable.js.map +1 -1
  161. package/dist/utils/parse-duration.d.ts +1 -1
  162. package/dist/utils/parse-duration.js +7 -3
  163. package/dist/utils/parse-duration.js.map +1 -1
  164. package/package.json +2 -2
  165. package/dist/cdn/shared-0fcdd1c4.js +0 -1
  166. package/dist/cdn/shared-4fa5f144.js +0 -1
  167. package/dist/cdn/shared-6b7602c7.js +0 -1
  168. package/dist/cdn/shared-710ed658.js +0 -134
  169. package/dist/cdn/shared-800a5471.js +0 -1
  170. package/dist/cdn/shared-87ca7818.js +0 -1
@@ -0,0 +1,650 @@
1
+ import { ScopedElementsMixin } from '@open-wc/scoped-elements';
2
+ import { html } from 'lit-element';
3
+ import { ifDefined } from 'lit-html/directives/if-defined';
4
+ import { ConfigurableMixin } from "../../../mixins/configurable.js";
5
+ import { ResponsiveMixin } from "../../../mixins/responsive.js";
6
+ import { ThemeableMixin } from "../../../mixins/themeable.js";
7
+ import { TranslatableMixin } from "../../../mixins/translatable.js";
8
+ import { classMap } from "../../../utils/class-map.js";
9
+ import { FrequencyInput } from "../../private/FrequencyInput/FrequencyInput.js";
10
+ import { EditableList } from "../../private/EditableList/EditableList.js";
11
+ import { Group } from "../../private/Group/Group.js";
12
+ import { PropertyTable } from "../../private/PropertyTable/PropertyTable.js";
13
+ import { NucleonElement } from "../NucleonElement/NucleonElement.js";
14
+ import { Type } from "../QueryBuilder/types.js";
15
+ import { currencies } from "./currencies.js";
16
+ import { CategoryRestrictionsPage } from "./private/CategoryRestrictionsPage.js";
17
+ const NS = 'gift-card-form';
18
+ const Base = ScopedElementsMixin(ThemeableMixin(ConfigurableMixin(ResponsiveMixin(TranslatableMixin(NucleonElement, NS)))));
19
+ /**
20
+ * Form element for creating or editing gift cards (`fx:gift_card`).
21
+ *
22
+ * @slot name:before
23
+ * @slot name:after
24
+ *
25
+ * @slot currency:before
26
+ * @slot currency:after
27
+ *
28
+ * @slot expires:before
29
+ * @slot expires:after
30
+ *
31
+ * @slot codes:before
32
+ * @slot codes:after
33
+ *
34
+ * @slot product-restrictions:before
35
+ * @slot product-restrictions:after
36
+ *
37
+ * @slot category-restrictions:before
38
+ * @slot category-restrictions:after
39
+ *
40
+ * @slot timestamps:before
41
+ * @slot timestamps:after
42
+ *
43
+ * @slot delete:before
44
+ * @slot delete:after
45
+ *
46
+ * @slot create:before
47
+ * @slot create:after
48
+ *
49
+ * @element foxy-gift-card-form
50
+ * @since 1.15.0
51
+ */
52
+ export class GiftCardForm extends Base {
53
+ constructor() {
54
+ super(...arguments);
55
+ this.__codesTableColumns = [
56
+ {
57
+ header: ctx => html `<foxy-i18n lang=${ctx.lang} key="code" ns=${ctx.ns}></foxy-i18n>`,
58
+ cell: ctx => html `
59
+ <vaadin-button
60
+ theme="tertiary contrast"
61
+ class="p-0"
62
+ @click=${(evt) => {
63
+ const dialog = this.renderRoot.querySelector('#code-dialog');
64
+ const button = evt.currentTarget;
65
+ dialog.href = ctx.data._links.self.href;
66
+ dialog.show(button);
67
+ }}
68
+ >
69
+ <span class="font-tnum">${ctx.data.code}</span>
70
+ </vaadin-button>
71
+ `,
72
+ },
73
+ {
74
+ header: ctx => html `<foxy-i18n lang=${ctx.lang} key="date_created" ns=${ctx.ns}></foxy-i18n>`,
75
+ cell: ctx => html `
76
+ <foxy-i18n
77
+ options=${JSON.stringify({ value: ctx.data.date_created })}
78
+ class="text-tertiary"
79
+ lang=${ctx.lang}
80
+ key="date"
81
+ ns=${ctx.ns}
82
+ >
83
+ </foxy-i18n>
84
+ `,
85
+ },
86
+ {
87
+ hideBelow: 'sm',
88
+ header: c => html `<foxy-i18n lang=${c.lang} key="date_modified" ns=${c.ns}></foxy-i18n>`,
89
+ cell: ctx => html `
90
+ <foxy-i18n
91
+ options=${JSON.stringify({ value: ctx.data.date_modified })}
92
+ class="text-tertiary"
93
+ lang=${ctx.lang}
94
+ key="date"
95
+ ns=${ctx.ns}
96
+ >
97
+ </foxy-i18n>
98
+ `,
99
+ },
100
+ {
101
+ header: c => html `<foxy-i18n lang=${c.lang} key="used_codes" ns=${c.ns}></foxy-i18n>`,
102
+ cell: ctx => html `${ctx.data.current_balance}`,
103
+ },
104
+ ];
105
+ this.__codesTableQuery = null;
106
+ this.__itemCategories = '';
107
+ }
108
+ static get scopedElements() {
109
+ return {
110
+ 'vaadin-text-field': customElements.get('vaadin-text-field'),
111
+ 'vaadin-combo-box': customElements.get('vaadin-combo-box'),
112
+ 'vaadin-button': customElements.get('vaadin-button'),
113
+ 'iron-icon': customElements.get('iron-icon'),
114
+ 'foxy-internal-confirm-dialog': customElements.get('foxy-internal-confirm-dialog'),
115
+ 'foxy-internal-sandbox': customElements.get('foxy-internal-sandbox'),
116
+ 'foxy-query-builder': customElements.get('foxy-query-builder'),
117
+ 'foxy-form-dialog': customElements.get('foxy-form-dialog'),
118
+ 'foxy-pagination': customElements.get('foxy-pagination'),
119
+ 'foxy-spinner': customElements.get('foxy-spinner'),
120
+ 'foxy-table': customElements.get('foxy-table'),
121
+ 'foxy-i18n': customElements.get('foxy-i18n'),
122
+ 'x-category-restrictions-page': CategoryRestrictionsPage,
123
+ 'x-frequency-input': FrequencyInput,
124
+ 'x-property-table': PropertyTable,
125
+ 'x-editable-list': EditableList,
126
+ 'x-group': Group,
127
+ };
128
+ }
129
+ static get properties() {
130
+ return {
131
+ ...super.properties,
132
+ __codesTableQuery: { attribute: false },
133
+ __itemCategories: { attribute: false },
134
+ };
135
+ }
136
+ static get v8n() {
137
+ return [
138
+ ({ name: v }) => !!v || 'name_required',
139
+ ({ name: v }) => !v || v.length <= 50 || 'name_too_long',
140
+ ];
141
+ }
142
+ render() {
143
+ var _a, _b;
144
+ const hidden = this.hiddenSelector;
145
+ const isNameHidden = hidden.matches('name', true);
146
+ const isCurrencyHidden = hidden.matches('currency', true);
147
+ const isExpiresHidden = hidden.matches('expires', true);
148
+ return html `
149
+ <div class="relative space-y-l">
150
+ ${isNameHidden && isCurrencyHidden && isExpiresHidden
151
+ ? ''
152
+ : html `
153
+ <div class="grid grid-cols-1 sm-grid-cols-3 md-grid-cols-4 gap-m">
154
+ ${isNameHidden ? '' : html `<div class="md-col-span-2">${this.__renderName()}</div>`}
155
+ ${isCurrencyHidden ? '' : this.__renderCurrency()}
156
+ ${isExpiresHidden ? '' : this.__renderExpires()}
157
+ </div>
158
+ `}
159
+ ${hidden.matches('codes', true) || !this.data ? '' : this.__renderCodes()}
160
+ ${hidden.matches('product-restrictions', true) ? '' : this.__renderProductRestrictions()}
161
+ ${hidden.matches('category-restrictions', true) || !this.data
162
+ ? ''
163
+ : this.__renderCategoryRestrictions()}
164
+ ${hidden.matches('timestamps', true) ? '' : this.__renderTimestamps()}
165
+ ${hidden.matches('create', true) || !!this.data ? '' : this.__renderCreate()}
166
+ ${hidden.matches('delete', true) || !this.data ? '' : this.__renderDelete()}
167
+
168
+ <div
169
+ data-testid="spinner"
170
+ class=${classMap({
171
+ 'transition duration-500 ease-in-out absolute inset-0 flex': true,
172
+ 'opacity-0 pointer-events-none': !this.in('busy') && !this.in('fail'),
173
+ })}
174
+ >
175
+ <foxy-spinner
176
+ layout="vertical"
177
+ class="m-auto p-m bg-base shadow-xs rounded-t-l rounded-b-l"
178
+ state=${this.in('fail') ? 'error' : this.in('busy') ? 'busy' : 'empty'}
179
+ lang=${this.lang}
180
+ ns="${this.ns} ${(_b = (_a = customElements.get('foxy-spinner')) === null || _a === void 0 ? void 0 : _a.defaultNS) !== null && _b !== void 0 ? _b : ''}"
181
+ >
182
+ </foxy-spinner>
183
+ </div>
184
+ </div>
185
+ `;
186
+ }
187
+ async _sendGet() {
188
+ const giftCard = await super._sendGet();
189
+ const store = await super._fetch(giftCard._links['fx:store'].href);
190
+ const categoriesURL = new URL(store._links['fx:item_categories'].href);
191
+ categoriesURL.searchParams.set('limit', '5');
192
+ this.__itemCategories = categoriesURL.toString();
193
+ return giftCard;
194
+ }
195
+ __getErrorMessage(prefix) {
196
+ const error = this.errors.find(err => err.startsWith(prefix));
197
+ return error ? this.t(error.replace(prefix, 'v8n')).toString() : '';
198
+ }
199
+ __getValidator(prefix) {
200
+ return () => !this.errors.some(err => err.startsWith(prefix));
201
+ }
202
+ __renderName() {
203
+ var _a;
204
+ return html `
205
+ <div>
206
+ ${this.renderTemplateOrSlot('name:before')}
207
+
208
+ <vaadin-text-field
209
+ error-message=${this.__getErrorMessage('name')}
210
+ helper-text=${this.t('gift_card_name_helper_text')}
211
+ data-testid="name"
212
+ class="w-full"
213
+ label=${this.t('name')}
214
+ .checkValidity=${this.__getValidator('name')}
215
+ .value=${(_a = this.form.name) !== null && _a !== void 0 ? _a : ''}
216
+ ?disabled=${this.in('busy') || this.disabledSelector.matches('name', true)}
217
+ ?readonly=${this.readonlySelector.matches('name', true)}
218
+ required
219
+ @keydown=${(evt) => evt.key === 'Enter' && this.submit()}
220
+ @input=${(evt) => {
221
+ const newName = evt.currentTarget.value;
222
+ this.edit({ name: newName });
223
+ }}
224
+ >
225
+ </vaadin-text-field>
226
+
227
+ ${this.renderTemplateOrSlot('name:after')}
228
+ </div>
229
+ `;
230
+ }
231
+ __renderCurrency() {
232
+ var _a, _b;
233
+ return html `
234
+ <div>
235
+ ${this.renderTemplateOrSlot('currency:before')}
236
+
237
+ <vaadin-combo-box
238
+ item-label-path="label"
239
+ item-value-path="value"
240
+ item-id-path="value"
241
+ class="w-full"
242
+ label=${this.t('currency')}
243
+ ?disabled=${!this.in('idle') || this.disabledSelector.matches('currency', true)}
244
+ ?readonly=${this.readonlySelector.matches('currency', true)}
245
+ .value=${(_b = (_a = this.form.currency_code) === null || _a === void 0 ? void 0 : _a.toLowerCase()) !== null && _b !== void 0 ? _b : ''}
246
+ .items=${currencies.map(code => ({
247
+ label: `${this.t(`currency_${code}`)} (${code.toUpperCase()})`,
248
+ value: code,
249
+ }))}
250
+ @change=${(evt) => {
251
+ const comboBox = evt.currentTarget;
252
+ this.edit({ currency_code: comboBox.value });
253
+ }}
254
+ >
255
+ </vaadin-combo-box>
256
+
257
+ ${this.renderTemplateOrSlot('currency:after')}
258
+ </div>
259
+ `;
260
+ }
261
+ __renderExpires() {
262
+ var _a;
263
+ return html `
264
+ <div>
265
+ ${this.renderTemplateOrSlot('expires:before')}
266
+
267
+ <x-frequency-input
268
+ class="w-full"
269
+ label=${this.t('expires_after')}
270
+ placeholder=${this.t('select')}
271
+ ?disabled=${!this.in('idle') || this.disabledSelector.matches('expires', true)}
272
+ ?readonly=${this.readonlySelector.matches('expires', true)}
273
+ .value=${(_a = this.form.expires_after) !== null && _a !== void 0 ? _a : ''}
274
+ @change=${(evt) => {
275
+ const input = evt.currentTarget;
276
+ this.edit({ expires_after: input.value });
277
+ }}
278
+ >
279
+ </x-frequency-input>
280
+
281
+ ${this.renderTemplateOrSlot('expires:after')}
282
+ </div>
283
+ `;
284
+ }
285
+ __renderCodes() {
286
+ var _a;
287
+ const { disabledSelector, group, data, lang, ns } = this;
288
+ const isDisabled = !this.in('idle') || disabledSelector.matches('codes', true);
289
+ const filters = this.__codesTableQuery;
290
+ const url = new URL(data._links['fx:gift_card_codes'].href);
291
+ new URLSearchParams(filters !== null && filters !== void 0 ? filters : '').forEach((value, name) => url.searchParams.set(name, value));
292
+ url.searchParams.set('limit', '5');
293
+ const filterButtonLabel = filters === null ? 'filter' : 'clear_filters';
294
+ const filterButtonIcon = `icons:${filters === null ? 'filter-list' : 'clear'}`;
295
+ return html `
296
+ <foxy-form-dialog
297
+ disabledcontrols=${disabledSelector.zoom('codes:generate:form').toString()}
298
+ readonlycontrols=${this.readonlySelector.zoom('codes:generate:form').toString()}
299
+ hiddencontrols="save-button ${this.hiddenSelector.zoom('codes:generate:form').toString()}"
300
+ header="generate"
301
+ parent=${(_a = data === null || data === void 0 ? void 0 : data._links['fx:generate_codes'].href) !== null && _a !== void 0 ? _a : ''}
302
+ group=${group}
303
+ lang=${lang}
304
+ form="foxy-generate-codes-form"
305
+ ns=${ns}
306
+ id="generate-codes-dialog"
307
+ alert
308
+ .related=${[url.toString()]}
309
+ >
310
+ </foxy-form-dialog>
311
+
312
+ <foxy-form-dialog
313
+ disabledcontrols=${disabledSelector.zoom('codes:form').toString()}
314
+ readonlycontrols=${this.readonlySelector.zoom('codes:form').toString()}
315
+ hiddencontrols=${this.hiddenSelector.zoom('codes:form').toString()}
316
+ header="code"
317
+ parent=${url.toString()}
318
+ group=${group}
319
+ lang=${lang}
320
+ form="foxy-gift-card-code-form"
321
+ ns=${ns}
322
+ id="code-dialog"
323
+ >
324
+ </foxy-form-dialog>
325
+
326
+ <foxy-form-dialog
327
+ disabledcontrols=${disabledSelector.zoom('codes:import:form').toString()}
328
+ readonlycontrols=${this.readonlySelector.zoom('codes:import:form').toString()}
329
+ hiddencontrols="save-button ${this.hiddenSelector.zoom('codes:generate:form').toString()}"
330
+ header="import"
331
+ parent=${data._links['fx:gift_card_codes'].href}
332
+ group=${group}
333
+ lang=${lang}
334
+ form="foxy-gift-card-codes-form"
335
+ ns=${ns}
336
+ id="import-dialog"
337
+ >
338
+ </foxy-form-dialog>
339
+
340
+ <div>
341
+ ${this.renderTemplateOrSlot('codes:before')}
342
+
343
+ <div class="flex items-center justify-between mb-xs space-x-s">
344
+ <foxy-i18n
345
+ class="text-s font-medium text-secondary leading-none flex-1"
346
+ lang=${lang}
347
+ key="code_plural"
348
+ ns=${ns}
349
+ >
350
+ </foxy-i18n>
351
+
352
+ <vaadin-button
353
+ theme="success tertiary small"
354
+ ?disabled=${isDisabled}
355
+ @click=${(evt) => {
356
+ const dialog = this.renderRoot.querySelector('#generate-codes-dialog');
357
+ const button = evt.currentTarget;
358
+ dialog === null || dialog === void 0 ? void 0 : dialog.show(button);
359
+ }}
360
+ >
361
+ <foxy-i18n class="text-s" lang=${lang} key="generate" ns=${ns}></foxy-i18n>
362
+ <iron-icon class="icon-inline text-s" icon="icons:add"></iron-icon>
363
+ </vaadin-button>
364
+
365
+ <vaadin-button
366
+ theme="contrast tertiary small"
367
+ ?disabled=${isDisabled}
368
+ @click=${(evt) => {
369
+ const dialog = this.renderRoot.querySelector('#import-dialog');
370
+ const button = evt.currentTarget;
371
+ dialog === null || dialog === void 0 ? void 0 : dialog.show(button);
372
+ }}
373
+ >
374
+ <foxy-i18n class="text-s" lang=${lang} key="import" ns=${ns}></foxy-i18n>
375
+ <iron-icon class="icon-inline text-s" icon="icons:open-in-browser"></iron-icon>
376
+ </vaadin-button>
377
+
378
+ <vaadin-button
379
+ theme="contrast ${filters === null ? 'tertiary' : ''} small"
380
+ ?disabled=${isDisabled}
381
+ @click=${() => (this.__codesTableQuery = filters === null ? '' : null)}
382
+ >
383
+ <foxy-i18n class="text-s" lang=${lang} key=${filterButtonLabel} ns=${ns}></foxy-i18n>
384
+ <iron-icon class="icon-inline text-s" icon=${filterButtonIcon}></iron-icon>
385
+ </vaadin-button>
386
+ </div>
387
+
388
+ <foxy-query-builder
389
+ class="bg-contrast-5 rounded-tl-l rounded-tr-s rounded-b-l p-m mb-s"
390
+ lang=${lang}
391
+ ns=${ns}
392
+ ?disabled=${isDisabled}
393
+ ?hidden=${filters === null}
394
+ .options=${GiftCardForm.__codesQueryOptions}
395
+ .value=${filters !== null && filters !== void 0 ? filters : ''}
396
+ @change=${(evt) => {
397
+ const queryBuilder = evt.currentTarget;
398
+ this.__codesTableQuery = queryBuilder.value;
399
+ }}
400
+ >
401
+ </foxy-query-builder>
402
+
403
+ <foxy-pagination first=${url.toString()} lang=${lang} ns=${ns} ?disabled=${isDisabled}>
404
+ <foxy-table
405
+ class="px-m mb-s border border-contrast-10 rounded-t-l rounded-b-l"
406
+ group=${group}
407
+ lang=${lang}
408
+ ns=${ns}
409
+ .columns=${this.__codesTableColumns}
410
+ >
411
+ </foxy-table>
412
+ </foxy-pagination>
413
+
414
+ ${this.renderTemplateOrSlot('codes:after')}
415
+ </div>
416
+ `;
417
+ }
418
+ __renderProductRestrictions() {
419
+ var _a;
420
+ const scope = 'product-restrictions';
421
+ const isDisabled = !this.in('idle') || this.disabledSelector.matches(scope, true);
422
+ const isReadonly = this.readonlySelector.matches(scope, true);
423
+ const restrictions = (_a = this.form.product_code_restrictions) !== null && _a !== void 0 ? _a : '';
424
+ const groups = [
425
+ { header: 'allow', items: [] },
426
+ { header: 'block', items: [] },
427
+ ];
428
+ if (restrictions) {
429
+ restrictions.split(',').forEach(value => {
430
+ const isBlocklistValue = value.startsWith('-');
431
+ const target = isBlocklistValue ? 1 : 0;
432
+ const label = isBlocklistValue ? value.substring(1) : value;
433
+ groups[target].items.push({ label, value });
434
+ });
435
+ }
436
+ return html `
437
+ <div>
438
+ ${this.renderTemplateOrSlot('product-restrictions:before')}
439
+
440
+ <div class="space-y-s">
441
+ <x-group frame>
442
+ <foxy-i18n
443
+ class=${isDisabled ? 'text-disabled' : 'text-secondary'}
444
+ slot="header"
445
+ lang=${this.lang}
446
+ key="product_restrictions"
447
+ ns=${this.ns}
448
+ >
449
+ </foxy-i18n>
450
+
451
+ <div class="grid sm-grid-cols-2 bg-contrast-10" style="gap: 1px">
452
+ ${groups.map((group, index) => {
453
+ return html `
454
+ <x-group class="bg-base pt-m">
455
+ <foxy-i18n
456
+ class=${isDisabled ? 'text-disabled' : 'text-tertiary'}
457
+ slot="header"
458
+ lang=${this.lang}
459
+ key=${group.header}
460
+ ns=${this.ns}
461
+ >
462
+ </foxy-i18n>
463
+
464
+ <x-editable-list
465
+ lang=${this.lang}
466
+ ns=${this.ns}
467
+ ?disabled=${isDisabled}
468
+ ?readonly=${isReadonly}
469
+ .items=${group.items}
470
+ @change=${(evt) => {
471
+ const newItemsByGroup = [
472
+ index === 0 ? evt.currentTarget.items : groups[0].items,
473
+ index === 1 ? evt.currentTarget.items : groups[1].items,
474
+ ];
475
+ const newSanitizedItemsByGroup = newItemsByGroup
476
+ .map(list => list.map(v => v.value.replace(/^[\s-]*/, '').trimEnd()))
477
+ .map(list => list.filter(v => !!v))
478
+ .map(list => Array.from(new Set(list)));
479
+ const newRestrictions = newSanitizedItemsByGroup[0]
480
+ .concat(newSanitizedItemsByGroup[1].map(v => `-${v}`))
481
+ .join(',');
482
+ this.edit({ product_code_restrictions: newRestrictions });
483
+ }}
484
+ >
485
+ </x-editable-list>
486
+ </x-group>
487
+ `;
488
+ })}
489
+ </div>
490
+ </x-group>
491
+
492
+ <foxy-i18n
493
+ class=${classMap({
494
+ 'block text-xs leading-s transition-colors': true,
495
+ 'text-secondary': !isDisabled,
496
+ 'text-disabled': isDisabled,
497
+ })}
498
+ lang=${this.lang}
499
+ key="gift_card_product_restrictions_explainer"
500
+ ns=${this.ns}
501
+ >
502
+ </foxy-i18n>
503
+ </div>
504
+
505
+ ${this.renderTemplateOrSlot('product-restrictions:after')}
506
+ </div>
507
+ `;
508
+ }
509
+ __renderCategoryRestrictions() {
510
+ var _a;
511
+ const scope = 'category-restrictions';
512
+ const isDisabled = !this.in('idle') || this.disabledSelector.matches(scope, true);
513
+ const isReadonly = this.readonlySelector.matches(scope, true);
514
+ return html `
515
+ ${this.renderTemplateOrSlot('category-restrictions:before')}
516
+
517
+ <div class="space-y-xs">
518
+ <foxy-pagination
519
+ first=${this.__itemCategories}
520
+ lang=${this.lang}
521
+ ns=${this.ns}
522
+ ?disabled=${isDisabled}
523
+ >
524
+ <foxy-i18n
525
+ class="block text-s font-medium text-secondary leading-none mb-s"
526
+ lang=${this.lang}
527
+ key="category_restrictions"
528
+ ns=${this.ns}
529
+ >
530
+ </foxy-i18n>
531
+
532
+ <x-category-restrictions-page
533
+ gift-card-item-categories=${ifDefined((_a = this.data) === null || _a === void 0 ? void 0 : _a._links['fx:gift_card_item_categories'].href)}
534
+ gift-card=${this.href}
535
+ class="border border-contrast-10 rounded-t-l rounded-b-l mb-s"
536
+ group=${this.group}
537
+ lang=${this.lang}
538
+ ns=${this.ns}
539
+ ?disabled=${isDisabled}
540
+ ?readonly=${isReadonly}
541
+ >
542
+ </x-category-restrictions-page>
543
+ </foxy-pagination>
544
+
545
+ <foxy-i18n
546
+ class="block text-xs leading-s text-secondary"
547
+ lang=${this.lang}
548
+ key="gift_card_category_restrictions_helper_text"
549
+ ns=${this.ns}
550
+ >
551
+ </foxy-i18n>
552
+ </div>
553
+
554
+ ${this.renderTemplateOrSlot('category-restrictions:after')}
555
+ `;
556
+ }
557
+ __renderTimestamps() {
558
+ return html `
559
+ <div>
560
+ ${this.renderTemplateOrSlot('timestamps:before')}
561
+
562
+ <x-property-table
563
+ data-testid="timestamps"
564
+ .items=${['date_modified', 'date_created'].map(field => {
565
+ var _a;
566
+ return ({
567
+ name: this.t(field),
568
+ value: ((_a = this.data) === null || _a === void 0 ? void 0 : _a[field]) ? this.t('date', { value: new Date(this.data[field]) })
569
+ : '',
570
+ });
571
+ })}
572
+ >
573
+ </x-property-table>
574
+
575
+ ${this.renderTemplateOrSlot('timestamps:after')}
576
+ </div>
577
+ `;
578
+ }
579
+ __renderCreate() {
580
+ const isCleanTemplateInvalid = this.in({ idle: { template: { clean: 'invalid' } } });
581
+ const isDirtyTemplateInvalid = this.in({ idle: { template: { dirty: 'invalid' } } });
582
+ const isCleanSnapshotInvalid = this.in({ idle: { snapshot: { clean: 'invalid' } } });
583
+ const isDirtySnapshotInvalid = this.in({ idle: { snapshot: { dirty: 'invalid' } } });
584
+ const isTemplateInvalid = isCleanTemplateInvalid || isDirtyTemplateInvalid;
585
+ const isSnaphotInvalid = isCleanSnapshotInvalid || isDirtySnapshotInvalid;
586
+ const isInvalid = isTemplateInvalid || isSnaphotInvalid;
587
+ const isBusy = this.in('busy');
588
+ return html `
589
+ <div>
590
+ ${this.renderTemplateOrSlot('create:before')}
591
+
592
+ <vaadin-button
593
+ data-testid="create"
594
+ class="w-full"
595
+ theme="primary success"
596
+ ?disabled=${isBusy || isInvalid || this.disabledSelector.matches('create', true)}
597
+ @click=${this.submit}
598
+ >
599
+ <foxy-i18n ns=${this.ns} key="create" lang=${this.lang}></foxy-i18n>
600
+ </vaadin-button>
601
+
602
+ ${this.renderTemplateOrSlot('create:after')}
603
+ </div>
604
+ `;
605
+ }
606
+ __renderDelete() {
607
+ return html `
608
+ <div>
609
+ <foxy-internal-confirm-dialog
610
+ data-testid="confirm"
611
+ message="delete_prompt"
612
+ confirm="delete"
613
+ cancel="cancel"
614
+ header="delete"
615
+ theme="primary error"
616
+ lang=${this.lang}
617
+ ns=${this.ns}
618
+ id="confirm"
619
+ @hide=${(evt) => !evt.detail.cancelled && this.delete()}
620
+ >
621
+ </foxy-internal-confirm-dialog>
622
+
623
+ ${this.renderTemplateOrSlot('delete:before')}
624
+
625
+ <vaadin-button
626
+ data-testid="delete"
627
+ theme="primary error"
628
+ class="w-full"
629
+ ?disabled=${this.in('busy') || this.disabledSelector.matches('delete', true)}
630
+ @click=${(evt) => {
631
+ const confirm = this.renderRoot.querySelector('#confirm');
632
+ confirm.show(evt.currentTarget);
633
+ }}
634
+ >
635
+ <foxy-i18n ns=${this.ns} key="delete" lang=${this.lang}></foxy-i18n>
636
+ </vaadin-button>
637
+
638
+ ${this.renderTemplateOrSlot('delete:after')}
639
+ </div>
640
+ `;
641
+ }
642
+ }
643
+ GiftCardForm.__codesQueryOptions = [
644
+ { label: 'code', path: 'code', type: Type.String },
645
+ { label: 'current_balance', path: 'current_balance', type: Type.Number },
646
+ { label: 'end_date', path: 'end_date', type: Type.Date },
647
+ { label: 'date_created', path: 'date_created', type: Type.Date },
648
+ { label: 'date_modified', path: 'date_modified', type: Type.Date },
649
+ ];
650
+ //# sourceMappingURL=GiftCardForm.js.map