@foxy.io/elements 1.12.0-beta.5 → 1.13.0-beta.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 (57) hide show
  1. package/dist/cdn/foxy-applied-tax-card.js +1 -1
  2. package/dist/cdn/foxy-custom-field-card.js +1 -1
  3. package/dist/cdn/foxy-customer-card.js +1 -1
  4. package/dist/cdn/foxy-discount-card.js +1 -1
  5. package/dist/cdn/foxy-tax-card.js +1 -0
  6. package/dist/cdn/foxy-tax-form.js +1 -0
  7. package/dist/cdn/foxy-transaction-card.js +1 -1
  8. package/dist/cdn/shared-67157a25.js +1 -0
  9. package/dist/cdn/translations/country/zh-cn.json +248 -0
  10. package/dist/cdn/translations/country/zh-hk.json +245 -0
  11. package/dist/cdn/translations/customer-portal/de.json +35 -0
  12. package/dist/cdn/translations/shared/de.json +59 -1
  13. package/dist/cdn/translations/shared/en.json +16 -0
  14. package/dist/cdn/translations/shared/es.json +40 -0
  15. package/dist/elements/public/CustomFieldCard/TwoLineCard.js +10 -2
  16. package/dist/elements/public/CustomFieldCard/TwoLineCard.js.map +1 -1
  17. package/dist/elements/public/CustomerCard/CustomerCard.d.ts +11 -0
  18. package/dist/elements/public/CustomerCard/CustomerCard.js +22 -7
  19. package/dist/elements/public/CustomerCard/CustomerCard.js.map +1 -1
  20. package/dist/elements/public/CustomerCard/index.d.ts +1 -0
  21. package/dist/elements/public/CustomerCard/index.js +1 -0
  22. package/dist/elements/public/CustomerCard/index.js.map +1 -1
  23. package/dist/elements/public/TaxCard/TaxCard.d.ts +24 -0
  24. package/dist/elements/public/TaxCard/TaxCard.js +52 -0
  25. package/dist/elements/public/TaxCard/TaxCard.js.map +1 -0
  26. package/dist/elements/public/TaxCard/index.d.ts +5 -0
  27. package/dist/elements/public/TaxCard/index.js +7 -0
  28. package/dist/elements/public/TaxCard/index.js.map +1 -0
  29. package/dist/elements/public/TaxCard/types.d.ts +3 -0
  30. package/dist/elements/public/TaxCard/types.js +2 -0
  31. package/dist/elements/public/TaxCard/types.js.map +1 -0
  32. package/dist/elements/public/TaxForm/TaxForm.d.ts +102 -0
  33. package/dist/elements/public/TaxForm/TaxForm.js +687 -0
  34. package/dist/elements/public/TaxForm/TaxForm.js.map +1 -0
  35. package/dist/elements/public/TaxForm/index.d.ts +9 -0
  36. package/dist/elements/public/TaxForm/index.js +11 -0
  37. package/dist/elements/public/TaxForm/index.js.map +1 -0
  38. package/dist/elements/public/TaxForm/types.d.ts +33 -0
  39. package/dist/elements/public/TaxForm/types.js +2 -0
  40. package/dist/elements/public/TaxForm/types.js.map +1 -0
  41. package/dist/elements/public/TransactionCard/TransactionCard.d.ts +15 -0
  42. package/dist/elements/public/TransactionCard/TransactionCard.js +51 -27
  43. package/dist/elements/public/TransactionCard/TransactionCard.js.map +1 -1
  44. package/dist/elements/public/TransactionCard/index.d.ts +1 -0
  45. package/dist/elements/public/TransactionCard/index.js +1 -0
  46. package/dist/elements/public/TransactionCard/index.js.map +1 -1
  47. package/dist/elements/public/TransactionCard/types.d.ts +1 -1
  48. package/dist/elements/public/TransactionCard/types.js.map +1 -1
  49. package/dist/elements/public/index.d.ts +2 -0
  50. package/dist/elements/public/index.defined.d.ts +2 -0
  51. package/dist/elements/public/index.defined.js +2 -0
  52. package/dist/elements/public/index.defined.js.map +1 -1
  53. package/dist/elements/public/index.js +2 -0
  54. package/dist/elements/public/index.js.map +1 -1
  55. package/package.json +1 -1
  56. package/dist/cdn/shared-dea02a36.js +0 -1
  57. package/dist/cdn/translations/admin/en.json +0 -59
@@ -0,0 +1,687 @@
1
+ import { Checkbox, PropertyTable } from "../../private/index.js";
2
+ import { Nucleon } from '@foxy.io/sdk/core';
3
+ import { ScopedElementsMixin } from '@open-wc/scoped-elements';
4
+ import { html } from 'lit-html';
5
+ import { ConfigurableMixin } from "../../../mixins/configurable.js";
6
+ import { NucleonElement } from "../NucleonElement/NucleonElement.js";
7
+ import { ThemeableMixin } from "../../../mixins/themeable.js";
8
+ import { TranslatableMixin } from "../../../mixins/translatable.js";
9
+ import { classMap } from "../../../utils/class-map.js";
10
+ import { ifDefined } from 'lit-html/directives/if-defined';
11
+ import { interpret } from 'xstate';
12
+ // prettier-ignore
13
+ const defaultLiveRateCountries = ['US', 'CA', 'AT', 'BE', 'BG', 'CY', 'CZ', 'DE', 'DK', 'EE', 'ES', 'FI', 'FR', 'GB', 'GR', 'HR', 'HU', 'IE', 'IM', 'IT', 'LT', 'LU', 'LV', 'MC', 'MT', 'NL', 'PL', 'PT', 'RO', 'SE', 'SI', 'SK'];
14
+ const taxJarLiveRateCountries = [...defaultLiveRateCountries, 'AU'];
15
+ const NS = 'tax-form';
16
+ const Base = ConfigurableMixin(ThemeableMixin(ScopedElementsMixin(TranslatableMixin(NucleonElement, NS))));
17
+ /**
18
+ * Form element for creating or editing taxes (`fx:tax`).
19
+ *
20
+ * @slot name:before
21
+ * @slot name:after
22
+ *
23
+ * @slot type:before
24
+ * @slot type:after
25
+ *
26
+ * @slot country:before
27
+ * @slot country:after
28
+ *
29
+ * @slot region:before
30
+ * @slot region:after
31
+ *
32
+ * @slot city:before
33
+ * @slot city:after
34
+ *
35
+ * @slot provider:before
36
+ * @slot provider:after
37
+ *
38
+ * @slot rate:before
39
+ * @slot rate:after
40
+ *
41
+ * @slot apply-to-shipping:before
42
+ * @slot apply-to-shipping:after
43
+ *
44
+ * @slot use-origin-rates:before
45
+ * @slot use-origin-rates:after
46
+ *
47
+ * @slot exempt-all-customer-tax-ids:before
48
+ * @slot exempt-all-customer-tax-ids:after
49
+ *
50
+ * @slot timestamps:before
51
+ * @slot timestamps:after
52
+ *
53
+ * @slot delete:before
54
+ * @slot delete:after
55
+ *
56
+ * @slot create:before
57
+ * @slot create:after
58
+ *
59
+ * @element foxy-tax-form
60
+ * @since 1.13.0
61
+ */
62
+ export class TaxForm extends Base {
63
+ constructor() {
64
+ super(...arguments);
65
+ this.templates = {};
66
+ this.__countries = '';
67
+ this.__regions = '';
68
+ this.__countriesService = interpret(Nucleon.machine.withConfig({
69
+ services: {
70
+ sendGet: async () => {
71
+ const response = await new TaxForm.API(this).fetch(this.countries);
72
+ if (!response.ok)
73
+ throw new Error(await response.text());
74
+ return await response.json();
75
+ },
76
+ },
77
+ }));
78
+ this.__regionsService = interpret(Nucleon.machine.withConfig({
79
+ services: {
80
+ sendGet: async () => {
81
+ var _a;
82
+ const url = new URL(this.regions);
83
+ url.searchParams.set('country_code', (_a = this.form.country) !== null && _a !== void 0 ? _a : 'US');
84
+ const response = await new TaxForm.API(this).fetch(url.toString());
85
+ if (!response.ok)
86
+ throw new Error(await response.text());
87
+ return await response.json();
88
+ },
89
+ },
90
+ }));
91
+ }
92
+ static get scopedElements() {
93
+ return {
94
+ 'vaadin-integer-field': customElements.get('vaadin-integer-field'),
95
+ 'vaadin-text-field': customElements.get('vaadin-text-field'),
96
+ 'vaadin-combo-box': customElements.get('vaadin-combo-box'),
97
+ 'vaadin-button': customElements.get('vaadin-button'),
98
+ 'vaadin-select': customElements.get('vaadin-select'),
99
+ 'foxy-internal-confirm-dialog': customElements.get('foxy-internal-confirm-dialog'),
100
+ 'foxy-spinner': customElements.get('foxy-spinner'),
101
+ 'foxy-i18n': customElements.get('foxy-i18n'),
102
+ 'x-property-table': PropertyTable,
103
+ 'x-checkbox': Checkbox,
104
+ };
105
+ }
106
+ static get properties() {
107
+ return {
108
+ ...super.properties,
109
+ countries: { type: String, noAccessor: true },
110
+ regions: { type: String, noAccessor: true },
111
+ };
112
+ }
113
+ static get v8n() {
114
+ return [
115
+ ({ name: v }) => !!v || 'name_required',
116
+ ({ name: v }) => !v || v.length <= 30 || 'name_too_long',
117
+ ({ type: v }) => !!v || 'type_required',
118
+ ({ type: v }) => (v && this.__types.includes(v)) || 'type_unknown',
119
+ ({ country: c, type: t }) => t != 'country' || !!c || 'country_required',
120
+ ({ country: c, use_origin_rates: r }) => !r || !!c || 'country_required',
121
+ ({ country: v }) => !v || !!v.match(/[A-Z]{2}/) || 'country_unknown',
122
+ ({ region: v, type: t }) => t != 'region' || !!v || 'region_required',
123
+ ({ region: v }) => !v || v.length <= 20 || 'region_unknown',
124
+ ({ city: v }) => !v || v.length <= 20 || 'city_too_long',
125
+ ({ city: c, type: t }) => t != 'local' || !!c || 'city_required',
126
+ ({ service_provider: v }) => !v || this.__providers.includes(v) || 'service_provider_unknown',
127
+ ({ is_live: l, service_provider: v }) => !l || !!v || 'service_provider_required',
128
+ ({ rate: v }) => !v || v <= 100 || 'rate_unknown',
129
+ ({ is_live: l, rate: v }) => !!l || !!v || 'rate_required',
130
+ ];
131
+ }
132
+ get countries() {
133
+ return this.__countries;
134
+ }
135
+ set countries(value) {
136
+ this.__countries = value;
137
+ if (value) {
138
+ this.__countriesService.send({ type: 'FETCH' });
139
+ }
140
+ else {
141
+ this.__countriesService.send({ type: 'SET_DATA', data: null });
142
+ }
143
+ }
144
+ get regions() {
145
+ return this.__regions;
146
+ }
147
+ set regions(value) {
148
+ this.__regions = value;
149
+ if (value) {
150
+ this.__regionsService.send({ type: 'FETCH' });
151
+ }
152
+ else {
153
+ this.__regionsService.send({ type: 'SET_DATA', data: null });
154
+ }
155
+ }
156
+ connectedCallback() {
157
+ super.connectedCallback();
158
+ this.__countriesService.onTransition(({ changed }) => changed && this.requestUpdate());
159
+ this.__countriesService.onChange(() => this.requestUpdate());
160
+ this.__countriesService.start();
161
+ this.__regionsService.onTransition(({ changed }) => changed && this.requestUpdate());
162
+ this.__regionsService.onChange(() => this.requestUpdate());
163
+ this.__regionsService.start();
164
+ }
165
+ render() {
166
+ var _a, _b;
167
+ return html `
168
+ <div class="relative space-y-m">
169
+ ${this.__isNameHidden ? null : this.__renderName()}
170
+ ${this.__isTypeHidden ? null : this.__renderType()}
171
+ ${this.__isCountryHidden ? null : this.__renderCountry()}
172
+ ${this.__isRegionHidden ? null : this.__renderRegion()}
173
+ ${this.__isCityHidden ? null : this.__renderCity()}
174
+ ${this.__isProviderHidden ? null : this.__renderProvider()}
175
+ ${this.__isRateHidden ? null : this.__renderRate()}
176
+ ${this.__isApplyToShippingHidden ? null : this.__renderApplyToShipping()}
177
+ ${this.__isUseOriginRatesHidden ? null : this.__renderUseOriginRates()}
178
+ ${this.__isExemptAllCustomerTaxIdsHidden ? null : this.__renderExemptAllCustomerTaxIds()}
179
+ ${this.__isTimestampsHidden ? null : this.__renderTimestamps()}
180
+ ${this.__isCreateHidden ? null : this.__renderCreate()}
181
+ ${this.__isDeleteHidden ? null : this.__renderDelete()}
182
+
183
+ <div
184
+ class=${classMap({
185
+ 'transition duration-500 ease-in-out absolute inset-0 flex': true,
186
+ 'opacity-0 pointer-events-none': !this.in('busy') && !this.in('fail'),
187
+ })}
188
+ >
189
+ <foxy-spinner
190
+ layout="vertical"
191
+ class="m-auto p-m bg-base shadow-xs rounded-t-l rounded-b-l"
192
+ state=${this.in('fail') ? 'error' : this.in('busy') ? 'busy' : 'empty'}
193
+ lang=${this.lang}
194
+ ns="${this.ns} ${(_b = (_a = customElements.get('foxy-spinner')) === null || _a === void 0 ? void 0 : _a.defaultNS) !== null && _b !== void 0 ? _b : ''}"
195
+ >
196
+ </foxy-spinner>
197
+ </div>
198
+ </div>
199
+ `;
200
+ }
201
+ disconnectedCallback() {
202
+ super.disconnectedCallback();
203
+ this.__countriesService.stop();
204
+ this.__regionsService.stop();
205
+ }
206
+ get __isNameHidden() {
207
+ return this.hiddenSelector.matches('name', true);
208
+ }
209
+ get __isTypeHidden() {
210
+ return this.hiddenSelector.matches('type', true);
211
+ }
212
+ get __isCountryHidden() {
213
+ if (this.hiddenSelector.matches('country', true))
214
+ return true;
215
+ if (this.form.type === 'union')
216
+ return !this.form.use_origin_rates;
217
+ return !['country', 'region', 'local'].includes(this.form.type);
218
+ }
219
+ get __isRegionHidden() {
220
+ if (this.hiddenSelector.matches('region', true))
221
+ return true;
222
+ return this.form.type !== 'local' && this.form.type !== 'region';
223
+ }
224
+ get __isCityHidden() {
225
+ if (this.hiddenSelector.matches('city', true))
226
+ return true;
227
+ return this.form.type !== 'local';
228
+ }
229
+ get __isProviderHidden() {
230
+ if (this.hiddenSelector.matches('provider', true))
231
+ return true;
232
+ return !this.form.type || this.form.type === 'global' || this.form.type === 'local';
233
+ }
234
+ get __isRateHidden() {
235
+ if (this.hiddenSelector.matches('rate', true))
236
+ return true;
237
+ return !this.form.type || this.form.is_live === true;
238
+ }
239
+ get __isApplyToShippingHidden() {
240
+ if (this.hiddenSelector.matches('apply-to-shipping', true))
241
+ return true;
242
+ if (this.form.type === undefined)
243
+ return true;
244
+ return !!this.form.is_live && defaultLiveRateCountries.includes(this.form.country);
245
+ }
246
+ get __isUseOriginRatesHidden() {
247
+ if (this.hiddenSelector.matches('use-origin-rates', true))
248
+ return true;
249
+ return this.form.type !== 'union' || !this.form.is_live || !!this.form.service_provider;
250
+ }
251
+ get __isExemptAllCustomerTaxIdsHidden() {
252
+ if (this.hiddenSelector.matches('exempt-all-customer-tax-ids', true))
253
+ return true;
254
+ const provider = this.form.service_provider;
255
+ return provider === undefined || provider === 'onesource' || provider === 'avalara';
256
+ }
257
+ get __isTimestampsHidden() {
258
+ if (this.hiddenSelector.matches('timestamps', true))
259
+ return true;
260
+ return !this.data;
261
+ }
262
+ get __isCreateHidden() {
263
+ if (this.hiddenSelector.matches('create', true))
264
+ return true;
265
+ return !!this.data;
266
+ }
267
+ get __isDeleteHidden() {
268
+ if (this.hiddenSelector.matches('delete', true))
269
+ return true;
270
+ return !this.data;
271
+ }
272
+ __renderName() {
273
+ return html `
274
+ <div>
275
+ ${this.renderTemplateOrSlot('name:before')}
276
+
277
+ <vaadin-text-field
278
+ class="w-full"
279
+ label=${this.t('name')}
280
+ value=${ifDefined(this.form.name)}
281
+ ?disabled=${this.in('busy') || this.disabledSelector.matches('name', true)}
282
+ ?readonly=${this.readonlySelector.matches('name', true)}
283
+ @input=${(evt) => {
284
+ const newName = evt.currentTarget.value;
285
+ this.edit({ name: newName });
286
+ }}
287
+ >
288
+ </vaadin-text-field>
289
+
290
+ ${this.renderTemplateOrSlot('name:after')}
291
+ </div>
292
+ `;
293
+ }
294
+ __renderType() {
295
+ const types = [
296
+ { label: this.t('tax_global'), value: 'global' },
297
+ { label: this.t('tax_union'), value: 'union' },
298
+ { label: this.t('tax_country'), value: 'country' },
299
+ { label: this.t('tax_region'), value: 'region' },
300
+ { label: this.t('tax_local'), value: 'local' },
301
+ ];
302
+ return html `
303
+ <div>
304
+ ${this.renderTemplateOrSlot('type:before')}
305
+
306
+ <vaadin-combo-box
307
+ item-value-path="value"
308
+ item-label-path="label"
309
+ item-id-path="value"
310
+ label=${this.t('type')}
311
+ value=${ifDefined(this.form.type)}
312
+ class="w-full"
313
+ .items=${types}
314
+ ?disabled=${this.in('busy') || this.disabledSelector.matches('type', true)}
315
+ ?readonly=${this.readonlySelector.matches('type', true)}
316
+ @change=${(evt) => {
317
+ this.edit({
318
+ type: evt.currentTarget.value,
319
+ country: '',
320
+ region: '',
321
+ city: '',
322
+ service_provider: '',
323
+ apply_to_shipping: false,
324
+ use_origin_rates: false,
325
+ exempt_all_customer_tax_ids: false,
326
+ is_live: false,
327
+ rate: 0,
328
+ });
329
+ }}
330
+ >
331
+ </vaadin-combo-box>
332
+
333
+ ${this.renderTemplateOrSlot('type:after')}
334
+ </div>
335
+ `;
336
+ }
337
+ __renderCountry() {
338
+ var _a;
339
+ const isLoadingItems = this.__countriesService.state.matches('busy');
340
+ const isLoadingData = this.in('busy');
341
+ const isLoading = isLoadingItems || isLoadingData;
342
+ const json = this.__countriesService.state.context.data;
343
+ const items = Object.values((_a = json === null || json === void 0 ? void 0 : json.values) !== null && _a !== void 0 ? _a : {});
344
+ return html `
345
+ <div>
346
+ ${this.renderTemplateOrSlot('country:before')}
347
+
348
+ <vaadin-combo-box
349
+ item-value-path="cc2"
350
+ item-label-path="default"
351
+ item-id-path="cc2"
352
+ label="${this.t('country')}${isLoadingItems ? ` • ${this.t('loading_busy')}` : ''}"
353
+ value=${ifDefined(this.form.country)}
354
+ class="w-full"
355
+ .items=${items}
356
+ ?allow-custom-value=${items.length === 0}
357
+ ?disabled=${isLoading || this.disabledSelector.matches('country', true)}
358
+ ?readonly=${this.readonlySelector.matches('country', true)}
359
+ @change=${(evt) => {
360
+ this.edit({
361
+ country: evt.currentTarget.value,
362
+ region: '',
363
+ city: '',
364
+ is_live: false,
365
+ service_provider: '',
366
+ });
367
+ if (this.__isApplyToShippingHidden)
368
+ this.edit({ apply_to_shipping: false });
369
+ this.__regionsService.send({ type: 'FETCH' });
370
+ }}
371
+ >
372
+ </vaadin-combo-box>
373
+
374
+ ${this.renderTemplateOrSlot('country:after')}
375
+ </div>
376
+ `;
377
+ }
378
+ __renderRegion() {
379
+ var _a;
380
+ const isLoadingItems = this.__regionsService.state.matches('busy');
381
+ const isLoadingData = this.in('busy');
382
+ const isLoading = isLoadingItems || isLoadingData;
383
+ const json = this.__regionsService.state.context.data;
384
+ const items = Object.values((_a = json === null || json === void 0 ? void 0 : json.values) !== null && _a !== void 0 ? _a : {});
385
+ return html `
386
+ <div>
387
+ ${this.renderTemplateOrSlot('region:before')}
388
+
389
+ <vaadin-combo-box
390
+ item-value-path="code"
391
+ item-label-path="default"
392
+ item-id-path="code"
393
+ label="${this.t('region')}${isLoadingItems ? ` • ${this.t('loading_busy')}` : ''}"
394
+ value=${ifDefined(this.form.region)}
395
+ class="w-full"
396
+ .items=${items}
397
+ ?allow-custom-value=${items.length === 0}
398
+ ?disabled=${isLoading || this.disabledSelector.matches('region', true)}
399
+ ?readonly=${this.readonlySelector.matches('region', true)}
400
+ @change=${(evt) => {
401
+ const newRegion = evt.currentTarget.value;
402
+ this.edit({ region: newRegion, city: '' });
403
+ }}
404
+ >
405
+ </vaadin-combo-box>
406
+
407
+ ${this.renderTemplateOrSlot('region:after')}
408
+ </div>
409
+ `;
410
+ }
411
+ __renderCity() {
412
+ return html `
413
+ <div>
414
+ ${this.renderTemplateOrSlot('city:before')}
415
+
416
+ <vaadin-text-field
417
+ class="w-full"
418
+ label=${this.t('city')}
419
+ value=${ifDefined(this.form.city)}
420
+ ?disabled=${this.in('busy') || this.disabledSelector.matches('city', true)}
421
+ ?readonly=${this.readonlySelector.matches('city', true)}
422
+ @input=${(evt) => {
423
+ const newCity = evt.currentTarget.value;
424
+ this.edit({ city: newCity });
425
+ }}
426
+ >
427
+ </vaadin-text-field>
428
+
429
+ ${this.renderTemplateOrSlot('city:after')}
430
+ </div>
431
+ `;
432
+ }
433
+ __renderProvider() {
434
+ const items = [
435
+ { label: this.t('tax_rate_provider_none'), value: 'none' },
436
+ { label: 'Avalara AvaTax 15', value: 'avalara' },
437
+ { label: 'Thomson Reuters ONESOURCE', value: 'onesource' },
438
+ ];
439
+ if (defaultLiveRateCountries.includes(this.form.country)) {
440
+ items.push({ label: this.t('tax_rate_provider_default'), value: 'default' });
441
+ }
442
+ if (taxJarLiveRateCountries.includes(this.form.country)) {
443
+ items.push({ label: 'TaxJar', value: 'taxjar' });
444
+ }
445
+ return html `
446
+ <div>
447
+ ${this.renderTemplateOrSlot('provider:before')}
448
+
449
+ <vaadin-combo-box
450
+ item-value-path="value"
451
+ item-label-path="label"
452
+ item-id-path="value"
453
+ label=${this.t('tax_rate_provider')}
454
+ value=${this.form.service_provider || this.form.is_live ? 'default' : 'none'}
455
+ class="w-full"
456
+ allow-custom-value
457
+ .items=${items}
458
+ ?disabled=${this.in('busy') || this.disabledSelector.matches('provider', true)}
459
+ ?readonly=${this.readonlySelector.matches('provider', true)}
460
+ @change=${(evt) => {
461
+ const newValue = evt.currentTarget.value;
462
+ const newProvider = newValue === 'none' || newValue === 'default' ? '' : newValue;
463
+ this.edit({
464
+ service_provider: newProvider,
465
+ is_live: newValue !== 'none',
466
+ });
467
+ if (this.__isApplyToShippingHidden)
468
+ this.edit({ apply_to_shipping: false });
469
+ if (this.__isExemptAllCustomerTaxIdsHidden)
470
+ this.edit({ exempt_all_customer_tax_ids: false });
471
+ if (this.__isUseOriginRatesHidden)
472
+ this.edit({ use_origin_rates: false });
473
+ }}
474
+ >
475
+ </vaadin-combo-box>
476
+
477
+ ${this.renderTemplateOrSlot('provider:after')}
478
+ </div>
479
+ `;
480
+ }
481
+ __renderRate() {
482
+ return html `
483
+ <div>
484
+ ${this.renderTemplateOrSlot('rate:before')}
485
+
486
+ <vaadin-integer-field
487
+ class="w-full"
488
+ label=${this.t('tax_rate')}
489
+ value=${ifDefined(this.form.rate)}
490
+ min="0"
491
+ prevent-invalid-input
492
+ has-controls
493
+ ?disabled=${this.in('busy') || this.disabledSelector.matches('rate', true)}
494
+ ?readonly=${this.readonlySelector.matches('rate', true)}
495
+ @change=${(evt) => {
496
+ const newRate = parseInt(evt.currentTarget.value);
497
+ this.edit({ rate: newRate });
498
+ }}
499
+ >
500
+ </vaadin-integer-field>
501
+
502
+ ${this.renderTemplateOrSlot('rate:after')}
503
+ </div>
504
+ `;
505
+ }
506
+ __renderApplyToShipping() {
507
+ return html `
508
+ <div>
509
+ ${this.renderTemplateOrSlot('apply-to-shipping:before')}
510
+
511
+ <x-checkbox
512
+ class="leading-s"
513
+ ?disabled=${this.disabledSelector.matches('apply-to-shipping', true)}
514
+ ?readonly=${this.readonlySelector.matches('apply-to-shipping', true)}
515
+ ?checked=${!!this.form.apply_to_shipping}
516
+ @change=${(evt) => this.edit({ apply_to_shipping: evt.detail })}
517
+ >
518
+ <foxy-i18n
519
+ class="block text-m text-body"
520
+ lang=${this.lang}
521
+ key="tax_apply_to_shipping"
522
+ ns=${this.ns}
523
+ >
524
+ </foxy-i18n>
525
+
526
+ <foxy-i18n
527
+ class="block text-s text-secondary"
528
+ lang=${this.lang}
529
+ key="tax_apply_to_shipping_explainer"
530
+ ns=${this.ns}
531
+ >
532
+ </foxy-i18n>
533
+ </x-checkbox>
534
+
535
+ ${this.renderTemplateOrSlot('apply-to-shipping:after')}
536
+ </div>
537
+ `;
538
+ }
539
+ __renderUseOriginRates() {
540
+ return html `
541
+ <div>
542
+ ${this.renderTemplateOrSlot('use-origin-rates:before')}
543
+
544
+ <x-checkbox
545
+ class="leading-s"
546
+ ?disabled=${this.disabledSelector.matches('use-origin-rates', true)}
547
+ ?readonly=${this.readonlySelector.matches('use-origin-rates', true)}
548
+ ?checked=${!!this.form.use_origin_rates}
549
+ @change=${(evt) => this.edit({ use_origin_rates: evt.detail })}
550
+ >
551
+ <foxy-i18n
552
+ class="block text-m text-body"
553
+ lang=${this.lang}
554
+ key="tax_use_origin_rates"
555
+ ns=${this.ns}
556
+ >
557
+ </foxy-i18n>
558
+
559
+ <foxy-i18n
560
+ class="block text-s text-secondary"
561
+ lang=${this.lang}
562
+ key="tax_use_origin_rates_explainer"
563
+ ns=${this.ns}
564
+ >
565
+ </foxy-i18n>
566
+ </x-checkbox>
567
+
568
+ ${this.renderTemplateOrSlot('use-origin-rates:after')}
569
+ </div>
570
+ `;
571
+ }
572
+ __renderExemptAllCustomerTaxIds() {
573
+ return html `
574
+ <div>
575
+ ${this.renderTemplateOrSlot('exempt-all-customer-tax-ids:before')}
576
+
577
+ <x-checkbox
578
+ class="leading-s"
579
+ ?disabled=${this.disabledSelector.matches('exempt-all-customer-tax-ids', true)}
580
+ ?readonly=${this.readonlySelector.matches('exempt-all-customer-tax-ids', true)}
581
+ ?checked=${!!this.form.exempt_all_customer_tax_ids}
582
+ @change=${(evt) => {
583
+ this.edit({ exempt_all_customer_tax_ids: evt.detail });
584
+ }}
585
+ >
586
+ <foxy-i18n
587
+ class="block text-m text-body"
588
+ lang=${this.lang}
589
+ key="tax_exempt_all_customer_tax_ids"
590
+ ns=${this.ns}
591
+ >
592
+ </foxy-i18n>
593
+
594
+ <foxy-i18n
595
+ class="block text-s text-secondary"
596
+ lang=${this.lang}
597
+ key="tax_exempt_all_customer_tax_ids_explainer"
598
+ ns=${this.ns}
599
+ >
600
+ </foxy-i18n>
601
+ </x-checkbox>
602
+
603
+ ${this.renderTemplateOrSlot('exempt-all-customer-tax-ids:after')}
604
+ </div>
605
+ `;
606
+ }
607
+ __renderTimestamps() {
608
+ return html `
609
+ <div>
610
+ ${this.renderTemplateOrSlot('timestamps:before')}
611
+
612
+ <x-property-table
613
+ .items=${['date_modified', 'date_created'].map(field => ({
614
+ name: this.t(field),
615
+ value: this.data ? this.t('date', { value: new Date(this.data[field]) }) : '',
616
+ }))}
617
+ >
618
+ </x-property-table>
619
+
620
+ ${this.renderTemplateOrSlot('timestamps:after')}
621
+ </div>
622
+ `;
623
+ }
624
+ __renderCreate() {
625
+ const isCleanTemplateInvalid = this.in({ idle: { template: { clean: 'invalid' } } });
626
+ const isDirtyTemplateInvalid = this.in({ idle: { template: { dirty: 'invalid' } } });
627
+ const isCleanSnapshotInvalid = this.in({ idle: { snapshot: { clean: 'invalid' } } });
628
+ const isDirtySnapshotInvalid = this.in({ idle: { snapshot: { dirty: 'invalid' } } });
629
+ const isTemplateInvalid = isCleanTemplateInvalid || isDirtyTemplateInvalid;
630
+ const isSnaphotInvalid = isCleanSnapshotInvalid || isDirtySnapshotInvalid;
631
+ const isInvalid = isTemplateInvalid || isSnaphotInvalid;
632
+ const isBusy = this.in('busy');
633
+ return html `
634
+ <div>
635
+ ${this.renderTemplateOrSlot('create:before')}
636
+
637
+ <vaadin-button
638
+ class="w-full"
639
+ theme="primary success"
640
+ ?disabled=${isBusy || isInvalid || this.disabledSelector.matches('create', true)}
641
+ @click=${this.submit}
642
+ >
643
+ <foxy-i18n ns=${this.ns} key="create" lang=${this.lang}></foxy-i18n>
644
+ </vaadin-button>
645
+
646
+ ${this.renderTemplateOrSlot('create:after')}
647
+ </div>
648
+ `;
649
+ }
650
+ __renderDelete() {
651
+ return html `
652
+ <div>
653
+ <foxy-internal-confirm-dialog
654
+ message="delete_prompt"
655
+ confirm="delete"
656
+ cancel="cancel"
657
+ header="delete"
658
+ theme="primary error"
659
+ lang=${this.lang}
660
+ ns=${this.ns}
661
+ id="confirm"
662
+ @hide=${(evt) => !evt.detail.cancelled && this.delete()}
663
+ >
664
+ </foxy-internal-confirm-dialog>
665
+
666
+ ${this.renderTemplateOrSlot('delete:before')}
667
+
668
+ <vaadin-button
669
+ theme="primary error"
670
+ class="w-full"
671
+ ?disabled=${this.in('busy') || this.disabledSelector.matches('delete', true)}
672
+ @click=${(evt) => {
673
+ const confirm = this.renderRoot.querySelector('#confirm');
674
+ confirm.show(evt.currentTarget);
675
+ }}
676
+ >
677
+ <foxy-i18n ns=${this.ns} key="delete" lang=${this.lang}></foxy-i18n>
678
+ </vaadin-button>
679
+
680
+ ${this.renderTemplateOrSlot('delete:after')}
681
+ </div>
682
+ `;
683
+ }
684
+ }
685
+ TaxForm.__providers = ['avalara', '', 'taxjar', 'onesource'];
686
+ TaxForm.__types = ['global', 'country', 'region', 'local', 'union'];
687
+ //# sourceMappingURL=TaxForm.js.map