@salla.sa/twilight-components 1.0.99 → 1.0.104

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 (129) hide show
  1. package/dist/cjs/{index-fdf99836.js → index-b4140db0.js} +26 -98
  2. package/dist/cjs/loader.cjs.js +3 -3
  3. package/dist/cjs/salla-add-product-button_6.cjs.entry.js +73 -56
  4. package/dist/cjs/salla-branches.cjs.entry.js +10 -6
  5. package/dist/cjs/salla-conditional-fields.cjs.entry.js +4 -5
  6. package/dist/cjs/salla-infinite-scroll.cjs.entry.js +1 -1
  7. package/dist/cjs/salla-installment.cjs.entry.js +1 -1
  8. package/dist/cjs/salla-localization-modal.cjs.entry.js +6 -5
  9. package/dist/cjs/salla-login-modal.cjs.entry.js +4 -4
  10. package/dist/cjs/salla-offer-modal.cjs.entry.js +4 -3
  11. package/dist/cjs/salla-quantity-input.cjs.entry.js +3 -3
  12. package/dist/cjs/salla-rating-modal.cjs.entry.js +5 -5
  13. package/dist/cjs/salla-rating-stars.cjs.entry.js +27 -36
  14. package/dist/cjs/{salla-verify-modal.cjs.entry.js → salla-verify.cjs.entry.js} +20 -14
  15. package/dist/cjs/twilight-components.cjs.js +3 -3
  16. package/dist/collection/collection-manifest.json +2 -3
  17. package/dist/collection/components/salla-add-product-button/salla-add-product-button.js +13 -28
  18. package/dist/collection/components/salla-branches/salla-branches.css +0 -3
  19. package/dist/collection/components/salla-branches/salla-branches.js +10 -6
  20. package/dist/collection/components/salla-button/salla-button.css +1 -88
  21. package/dist/collection/components/salla-button/salla-button.js +2 -26
  22. package/dist/collection/components/salla-conditional-fields/salla-conditional-fields.js +3 -7
  23. package/dist/collection/components/salla-infinite-scroll/salla-infinite-scroll.css +0 -3
  24. package/dist/collection/components/salla-installment/salla-installment.css +4 -3
  25. package/dist/collection/components/salla-localization-modal/salla-localization-modal.css +2 -16
  26. package/dist/collection/components/salla-localization-modal/salla-localization-modal.js +4 -3
  27. package/dist/collection/components/salla-login-modal/salla-login-modal.css +1 -8
  28. package/dist/collection/components/salla-login-modal/salla-login-modal.js +3 -3
  29. package/dist/collection/components/salla-modal/salla-modal.css +0 -3
  30. package/dist/collection/components/salla-modal/salla-modal.js +13 -12
  31. package/dist/collection/components/salla-offer-modal/salla-offer-modal.css +1 -25
  32. package/dist/collection/components/salla-offer-modal/salla-offer-modal.js +2 -1
  33. package/dist/collection/components/salla-product-availability/salla-product-availability.css +0 -3
  34. package/dist/collection/components/salla-product-availability/salla-product-availability.js +18 -13
  35. package/dist/collection/components/salla-quantity-input/salla-quantity-input.css +4 -3
  36. package/dist/collection/components/salla-quantity-input/salla-quantity-input.js +3 -3
  37. package/dist/collection/components/salla-rating-modal/salla-rating-modal.css +1 -20
  38. package/dist/collection/components/salla-rating-modal/salla-rating-modal.js +3 -3
  39. package/dist/collection/components/salla-rating-stars/salla-rating-stars.css +3 -5
  40. package/dist/collection/components/salla-rating-stars/salla-rating-stars.js +26 -35
  41. package/dist/collection/components/salla-search/salla-search.css +1 -45
  42. package/dist/collection/components/salla-search/salla-search.js +35 -16
  43. package/dist/collection/components/salla-tel-input/salla-tel-input.css +13 -8
  44. package/dist/collection/components/{salla-verify-modal/salla-verify-modal.css → salla-verify/salla-verify.css} +1 -8
  45. package/dist/collection/components/{salla-verify-modal/salla-verify-modal.js → salla-verify/salla-verify.js} +33 -26
  46. package/dist/collection/plugins/tailwind-theme/generator.js +6 -2
  47. package/dist/collection/plugins/tailwind-theme/index.js +3 -3
  48. package/dist/components/index.d.ts +17 -5
  49. package/dist/components/index.js +17 -0
  50. package/dist/components/salla-add-product-button.js +14 -12
  51. package/dist/components/salla-branches.js +9 -5
  52. package/dist/components/salla-button2.js +3 -10
  53. package/dist/components/salla-conditional-fields.js +3 -4
  54. package/dist/components/salla-localization-modal.js +5 -4
  55. package/dist/components/salla-login-modal.js +6 -6
  56. package/dist/components/salla-modal2.js +7 -7
  57. package/dist/components/salla-offer-modal.js +3 -2
  58. package/dist/components/salla-product-availability2.js +17 -12
  59. package/dist/components/salla-quantity-input.js +2 -2
  60. package/dist/components/salla-rating-modal.js +4 -4
  61. package/dist/components/salla-rating-stars2.js +26 -35
  62. package/dist/components/salla-search.js +33 -15
  63. package/dist/components/salla-tel-input2.js +3 -3
  64. package/dist/components/{salla-sizes-table.d.ts → salla-verify.d.ts} +4 -4
  65. package/dist/components/salla-verify.js +9 -0
  66. package/dist/components/{salla-verify-modal2.js → salla-verify2.js} +24 -18
  67. package/dist/esm/{index-4ffd4317.js → index-20b84fd0.js} +26 -98
  68. package/dist/esm/loader.js +3 -3
  69. package/dist/esm/polyfills/css-shim.js +1 -1
  70. package/dist/esm/salla-add-product-button_6.entry.js +73 -56
  71. package/dist/esm/salla-branches.entry.js +10 -6
  72. package/dist/esm/salla-conditional-fields.entry.js +4 -5
  73. package/dist/esm/salla-infinite-scroll.entry.js +1 -1
  74. package/dist/esm/salla-installment.entry.js +1 -1
  75. package/dist/esm/salla-localization-modal.entry.js +6 -5
  76. package/dist/esm/salla-login-modal.entry.js +4 -4
  77. package/dist/esm/salla-offer-modal.entry.js +4 -3
  78. package/dist/esm/salla-quantity-input.entry.js +3 -3
  79. package/dist/esm/salla-rating-modal.entry.js +5 -5
  80. package/dist/esm/salla-rating-stars.entry.js +27 -36
  81. package/dist/esm/{salla-verify-modal.entry.js → salla-verify.entry.js} +20 -14
  82. package/dist/esm/twilight-components.js +3 -3
  83. package/dist/twilight-components/{p-8c69a096.entry.js → p-15fac4f2.entry.js} +1 -1
  84. package/dist/twilight-components/p-27d01075.entry.js +4 -0
  85. package/dist/twilight-components/p-30e63760.entry.js +4 -0
  86. package/dist/twilight-components/{p-edbb12b2.entry.js → p-5ee94c9e.entry.js} +1 -1
  87. package/dist/twilight-components/p-799da239.entry.js +4 -0
  88. package/dist/twilight-components/p-9ff78dd1.entry.js +4 -0
  89. package/dist/twilight-components/p-c1952856.entry.js +4 -0
  90. package/dist/twilight-components/p-c2bef5f2.js +5 -0
  91. package/dist/twilight-components/p-cf143464.entry.js +4 -0
  92. package/dist/twilight-components/p-d3778858.entry.js +4 -0
  93. package/dist/twilight-components/p-ebd2e045.entry.js +4 -0
  94. package/dist/twilight-components/p-ec0a2892.entry.js +4 -0
  95. package/dist/twilight-components/{p-56065da6.entry.js → p-fab65162.entry.js} +1 -1
  96. package/dist/twilight-components/twilight-components.esm.js +1 -1
  97. package/dist/types/components/salla-add-product-button/salla-add-product-button.d.ts +1 -2
  98. package/dist/types/components/salla-button/salla-button.d.ts +0 -5
  99. package/dist/types/components/salla-rating-stars/salla-rating-stars.d.ts +1 -0
  100. package/dist/types/components/salla-search/salla-search.d.ts +6 -1
  101. package/dist/types/components/{salla-verify-modal/salla-verify-modal.d.ts → salla-verify/salla-verify.d.ts} +3 -2
  102. package/dist/types/components.d.ts +33 -50
  103. package/example/dist/translations.js +1 -1
  104. package/example/index.html +184 -162
  105. package/example/tailwind.config.js +4 -7
  106. package/package.json +9 -13
  107. package/dist/cjs/salla-sizes-table.cjs.entry.js +0 -22
  108. package/dist/collection/components/salla-conditional-fields/salla-conditional-fields.css +0 -3
  109. package/dist/collection/components/salla-sizes-table/salla-sizes-table.css +0 -6
  110. package/dist/collection/components/salla-sizes-table/salla-sizes-table.js +0 -18
  111. package/dist/components/salla-sizes-table.js +0 -37
  112. package/dist/components/salla-verify-modal.d.ts +0 -11
  113. package/dist/components/salla-verify-modal.js +0 -9
  114. package/dist/esm/salla-sizes-table.entry.js +0 -18
  115. package/dist/twilight-components/p-1d0e664c.js +0 -4
  116. package/dist/twilight-components/p-210f5278.entry.js +0 -4
  117. package/dist/twilight-components/p-2384537d.entry.js +0 -4
  118. package/dist/twilight-components/p-2b1c3490.entry.js +0 -4
  119. package/dist/twilight-components/p-7fae6b84.entry.js +0 -4
  120. package/dist/twilight-components/p-9e05640e.entry.js +0 -4
  121. package/dist/twilight-components/p-af450175.entry.js +0 -4
  122. package/dist/twilight-components/p-d762e16f.entry.js +0 -4
  123. package/dist/twilight-components/p-d77dd260.entry.js +0 -4
  124. package/dist/twilight-components/p-e435a209.entry.js +0 -4
  125. package/dist/twilight-components/p-ecaee6a4.entry.js +0 -4
  126. package/dist/types/components/salla-sizes-table/salla-sizes-table.d.ts +0 -3
  127. package/example/.DS_Store +0 -0
  128. package/example/.gitignore +0 -2
  129. package/example/dist/.DS_Store +0 -0
@@ -5,7 +5,7 @@
5
5
 
6
6
  Object.defineProperty(exports, '__esModule', { value: true });
7
7
 
8
- const index = require('./index-fdf99836.js');
8
+ const index = require('./index-b4140db0.js');
9
9
  const Helper = require('./Helper-8ae6a805.js');
10
10
 
11
11
  const sallaAddProductButtonCss = ":host{display:block}salla-add-product-button[width=wide]{width:100%}";
@@ -22,10 +22,6 @@ const SallaAddProductButton = class {
22
22
  this.donatingAmount = 0;
23
23
  this.productStatus = 'sale';
24
24
  this.productType = 'product';
25
- /**
26
- * Is the button currently disabled
27
- */
28
- this.disabled = false;
29
25
  }
30
26
  getLabel() {
31
27
  if (this.productStatus === 'sale') {
@@ -48,13 +44,20 @@ const SallaAddProductButton = class {
48
44
  * but its work only when the id is the only value is passed via the object
49
45
  * so we will filter the object entities to remove null and zero values in case we don't want the normal add item action
50
46
  */
51
- return salla.cart.quickAdd(Object.entries({
47
+ const data = Object.entries({
52
48
  id: this.productId,
53
49
  donating_amount: this.donatingAmount,
54
50
  quantity: this.quantity
55
- }).reduce((a, [k, v]) => (v ? (a[k] = v, a) : a), {}))
56
- .then((response) => this.success.emit(response))
57
- .catch((error) => this.failed.emit(error));
51
+ }).reduce((a, [k, v]) => (v ? (a[k] = v, a) : a), {});
52
+ return salla.cart.quickAdd(data)
53
+ .then((response) => {
54
+ console.log("🚀 ~ file: salla-add-product-button.tsx ~ line 67 ~ SallaAddProductButton ~ .then ~ response", response);
55
+ return this.success.emit(response);
56
+ })
57
+ .catch((error) => {
58
+ console.log("🚀 ~ file: salla-add-product-button.tsx ~ line 70 ~ SallaAddProductButton ~ addProductToCart ~ error", error);
59
+ return this.failed.emit(error);
60
+ });
58
61
  }
59
62
  getBtnAttributes() {
60
63
  for (let i = 0; i < this.host.attributes.length; i++) {
@@ -70,17 +73,17 @@ const SallaAddProductButton = class {
70
73
  render() {
71
74
  return (index.h(index.Host, null, this.productStatus === 'out-and-notify' && this.channels ?
72
75
  index.h("salla-product-availability", Object.assign({}, this.getBtnAttributes()), index.h("slot", null)) :
73
- index.h("salla-button", Object.assign({ ref: btn => this.btn = btn, onClick: event => this.addProductToCart(event), type: "button", fill: this.productStatus === 'sale' ? 'solid' : 'outline', color: this.productStatus === 'sale' ? 'primary' : 'light', "loader-position": "center" }, this.getBtnAttributes(), { disabled: this.productStatus !== 'sale' }), index.h("slot", null))));
76
+ index.h("salla-button", Object.assign({ ref: el => this.btn = el, onClick: event => this.addProductToCart(event), type: "button", fill: this.productStatus === 'sale' ? 'solid' : 'outline', color: this.productStatus === 'sale' ? 'primary' : 'light', "loader-position": "center" }, this.getBtnAttributes(), { disabled: this.productStatus !== 'sale' }), index.h("slot", null))));
74
77
  }
75
78
  componentDidRender() {
76
79
  //if label not passed, get label
77
- this.hasLabel || salla.lang.onLoaded(() => { var _a; return (_a = this.btn) === null || _a === void 0 ? void 0 : _a.setText(this.getLabel() || 'اضافة للسلة'); });
80
+ this.hasLabel || salla.event.on('languages::translations.loaded', () => this.btn.setText(this.getLabel() || 'اضافة للسلة'));
78
81
  }
79
82
  get host() { return index.getElement(this); }
80
83
  };
81
84
  SallaAddProductButton.style = sallaAddProductButtonCss;
82
85
 
83
- const sallaButtonCss = "salla-button{pointer-events:none}salla-button[type=submit],salla-button[type=button],salla-button[type=reset]{-webkit-appearance:none}salla-button[width=wide]{width:100%}.s-button-wrap[loading]{pointer-events:none}.s-button-wrap[loading] .s-button-element{pointer-events:none !important}.s-button-wrap[loading] .s-button-loader-center .s-button-text{opacity:0}.s-button-wrap .s-button-element[loading]{pointer-events:none !important}.s-button-wrap .s-button-element:not(:disabled){pointer-events:auto}.s-button-wrap .s-button-solid .s-button-loader:before{border-color:#fff #fff rgba(255, 255, 255, 0.2) rgba(255, 255, 255, 0.2)}.s-button-wrap .s-button-outline{border:1px solid currentColor}.s-button-wrap .s-button-outline:hover{border-color:transparent}.s-button-wrap .s-button-outline .s-button-loader:before{border-top-color:currentColor;border-left-color:currentColor}.s-button-wrap .s-button-icon.s-button-large{width:56px;height:56px}.s-button-wrap .s-button-icon.s-button-small{width:24px;height:24px}.s-button-wrap .s-button-icon.s-button-small .s-button-loader:before{width:0.85rem;height:0.85rem}.s-button-wrap .s-button-loader-after .s-button-load{flex-direction:row}.s-button-wrap .s-button-loader-start.s-button-element{padding-left:32px;padding-right:32px}.s-button-wrap .s-button-loader-start .s-button-loader{position:absolute;right:8px}.s-button-wrap .s-button-loader-start .s-button-loader [dir=ltr]{left:8px;right:auto}.s-button-wrap .s-button-loader-end.s-button-element{padding-left:32px;padding-right:32px}.s-button-wrap .s-button-loader-end .s-button-loader{position:absolute;left:8px}.s-button-wrap .s-button-loader-end .s-button-loader [dir=ltr]{right:8px;left:auto}.s-button-wrap .s-button-loader-center .s-button-loader{position:absolute;top:50%;left:50%;transform:translateY(-50%) translateX(-50%);margin:0 !important}";
86
+ const sallaButtonCss = "";
84
87
 
85
88
  const SallaButton = class {
86
89
  constructor(hostRef) {
@@ -118,13 +121,6 @@ const SallaButton = class {
118
121
  * If there is need to change loader position, pass the position
119
122
  */
120
123
  this.loaderPosition = 'after';
121
- /**
122
- * Is the button wide
123
- */
124
- this.wide = false;
125
- if (this.wide) {
126
- this.host.classList.add('s-button-wide');
127
- }
128
124
  }
129
125
  /**
130
126
  * Run loading animation
@@ -140,6 +136,7 @@ const SallaButton = class {
140
136
  */
141
137
  async stop() {
142
138
  this.host.removeAttribute('loading');
139
+ this.host.querySelector('button').removeAttribute('loading');
143
140
  if (this.loaderPosition == 'center')
144
141
  this.text.classList.remove('s-button-hide');
145
142
  return this.host;
@@ -168,7 +165,7 @@ const SallaButton = class {
168
165
  }
169
166
  getBtnAttributes() {
170
167
  for (let i = 0; i < this.host.attributes.length; i++) {
171
- if (!['color', 'fill', 'size', 'width', 'id', 'loading'].includes(this.host.attributes[i].name)) {
168
+ if (!['color', 'fill', 'size', 'width', 'id'].includes(this.host.attributes[i].name)) {
172
169
  this.hostAttributes[this.host.attributes[i].name] = this.host.attributes[i].value;
173
170
  }
174
171
  }
@@ -200,7 +197,7 @@ const sallaModalCss = "";
200
197
  const SallaModal = class {
201
198
  constructor(hostRef) {
202
199
  index.registerInstance(this, hostRef);
203
- this.isClosable = true; //todo::rename unclude
200
+ this.isClosable = true; //todo::rename unclude. Suggestion => persistent
204
201
  /**
205
202
  * The size of the modal
206
203
  */
@@ -316,17 +313,17 @@ const SallaModal = class {
316
313
  //todo:: pref for each modal
317
314
  render() {
318
315
  this.host.id = this.host.id || 'salla-modal';
319
- return (index.h(index.Host, { class: 'salla-modal s-modal-container s-hidden', "aria-modal": "true", role: "dialog" }, index.h("div", { class: "s-modal-overlay", ref: el => this.overlay = el, onClick: () => this.closeModal() }), index.h("div", { class: "s-modal-wrapper" }, index.h("span", { class: 's-modal-spacer s-modal-align-' + this.position }, "\u200B"), index.h("div", { class: 's-modal-body ' + 's-modal-align-' + this.position + ' s-modal-' + this.width + (this.noPadding ? ' s-modal-nopadding' : ' s-modal-padding') }, this.isLoading ?
316
+ return (index.h(index.Host, { class: 'salla-modal s-modal s-modal-container s-hidden', "aria-modal": "true", role: "dialog" }, index.h("div", { class: "s-modal-overlay", ref: el => this.overlay = el, onClick: () => this.closeModal() }), index.h("div", { class: "s-modal-wrapper" }, index.h("span", { class: 's-modal-spacer s-modal-align-' + this.position }, "\u200B"), index.h("div", { class: 's-modal-body ' + 's-modal-align-' + this.position + ' s-modal-' + this.width + (this.noPadding ? ' s-modal-nopadding' : ' s-modal-padding') }, this.isLoading ?
320
317
  index.h("div", { class: "s-modal-loader-wrap" }, index.h("span", { class: "s-modal-loader" }))
321
318
  :
322
319
  [
323
320
  index.h("div", { class: { 's-modal-header': true, 's-modal-is-center': this.icon != '' || this.imageIcon != '' } }, this.isClosable ?
324
321
  index.h("button", { class: "s-modal-close", onClick: () => this.closeModal(), type: "button" }, index.h("span", { class: "sicon-cancel" }))
325
- : '', this.modalTitle || this.subTitle ?
326
- index.h("div", { class: "s-modal-header-inner" }, this.iconStyle || this.icon
327
- ? index.h("div", { class: this.iconBlockClasses() }, index.h("i", { class: this.iconClasses() }))
328
- : this.imageIcon ? index.h("img", { class: "s-modal-header-img", src: this.imageIcon }) : '', index.h("div", { class: "s-modal-header-content" }, index.h("div", { class: { 's-modal-title': true, 's-modal-title-below': this.subTitleFirst }, innerHTML: this.modalTitle }), index.h("p", { class: { 's-modal-sub-title': true }, innerHTML: this.subTitle })))
329
- : ''),
322
+ : '', index.h("div", { class: "s-modal-header-inner" }, this.iconStyle || this.icon
323
+ ? index.h("div", { class: this.iconBlockClasses() }, index.h("i", { class: this.iconClasses() }))
324
+ : this.imageIcon ? index.h("img", { class: "s-modal-header-img", src: this.imageIcon }) : '', index.h("div", { class: "s-modal-header-content" }, index.h("div", { class: { 's-modal-title': true, 's-modal-title-below': this.subTitleFirst }, innerHTML: this.modalTitle }), index.h("p", { class: { 's-modal-sub-title': true }, innerHTML: this.subTitle })))
325
+ // : ''
326
+ , "// : ''"),
330
327
  index.h("slot", null),
331
328
  index.h("slot", { name: "footer" })
332
329
  ]))));
@@ -359,6 +356,7 @@ const SallaProductAvailability = class {
359
356
  this.isSubscribed = false;
360
357
  // @Method()
361
358
  this.submit = async () => {
359
+ console.log("🚀 ~ file: salla-product-availability.tsx ~ line 74 ~ SallaProductAvailability ~ submit= ~ submit");
362
360
  if (this.isUser) {
363
361
  return salla.api.product.availabilitySubscribe(this.productId)
364
362
  .then(() => this.isSubscribed = true);
@@ -414,21 +412,25 @@ const SallaProductAvailability = class {
414
412
  this.isVisitorSubscribed = salla.storage.get(`product-${this.productId}-subscribed`);
415
413
  }
416
414
  channelsWatcher(newValue) {
417
- this.channels_ = newValue.split(',');
415
+ this.channels_ = !!newValue ? newValue.split(',') : [];
418
416
  }
419
417
  async validateform() {
420
- if (this.channels_.includes('email')) {
421
- const isEmailValid = Helper.Helper.isValidEmail(this.email.value);
422
- if (isEmailValid)
423
- return;
424
- !isEmailValid && this.validateField(this.email, this.emailErrorMsg);
418
+ try {
419
+ if (this.channels_.includes('email')) {
420
+ const isEmailValid = Helper.Helper.isValidEmail(this.email.value);
421
+ if (isEmailValid)
422
+ return;
423
+ !isEmailValid && this.validateField(this.email, this.emailErrorMsg);
424
+ }
425
+ if (this.channels_.includes('sms')) {
426
+ const isPhoneValid = await this.mobileInput.isValid();
427
+ if (isPhoneValid)
428
+ return;
429
+ }
425
430
  }
426
- if (this.channels_.includes('sms')) {
427
- const isPhoneValid = await this.mobileInput.isValid();
428
- if (isPhoneValid)
429
- return;
431
+ catch (error) {
432
+ throw ('Please insert required fields');
430
433
  }
431
- throw ('Please insert required fields');
432
434
  }
433
435
  validateField(field, errorMsg) {
434
436
  field.classList.add('s-has-error');
@@ -448,7 +450,7 @@ const SallaProductAvailability = class {
448
450
  ] : '', this.channels_.includes('sms') ? [
449
451
  index.h("label", { class: "s-product-availability-label" }, this.mobileLabel),
450
452
  index.h("salla-tel-input", { ref: el => this.mobileInput = el, onKeyDown: e => this.typing(e, this.submit) })
451
- ] : ''), index.h("div", { slot: "footer", class: "s-product-availability-footer" }, index.h("salla-button", { width: "wide", color: "light", fill: "outline", onClick: () => this.modal.close(), ref: btn => this.cancelBtn = btn }, salla.lang.get('common.elements.cancel')), index.h("salla-button", { "loader-position": 'center', width: "wide", ref: btn => this.btn = btn, onClick: () => this.submit() }, salla.lang.get('common.elements.submit')))));
453
+ ] : ''), index.h("div", { slot: "footer", class: "s-product-availability-footer" }, index.h("salla-button", { class: "modal-cancel-btn", width: "wide", color: "light", fill: "outline", onClick: () => this.modal.close(), ref: btn => this.cancelBtn = btn }, salla.lang.get('common.elements.cancel')), index.h("salla-button", { class: "submit-btn", "loader-position": 'center', width: "wide", ref: btn => this.btn = btn, onClick: () => this.submit() }, salla.lang.get('common.elements.submit')))));
452
454
  }
453
455
  get host() { return index.getElement(this); }
454
456
  static get watchers() { return {
@@ -457,13 +459,15 @@ const SallaProductAvailability = class {
457
459
  };
458
460
  SallaProductAvailability.style = sallaProductAvailabilityCss;
459
461
 
460
- const sallaSearchCss = "#s-search-modal .s-search-inline{border:1px solid #eee}#s-search-modal .s-search-no-results .s-search-input,#s-search-modal .s-search-container-open .s-search-input{border-bottom:1px solid #f4f4f5}#s-search-modal .s-search-product-image{font-size:0;position:relative}#s-search-modal .s-search-product-image:before{content:\"\";position:absolute;width:100%;height:100%;left:0;top:0;background:#eee}#s-search-modal .s-modal-wrapper{align-items:flex-start;padding:0}#s-search-modal .s-modal-spacer{display:inline}#s-search-modal .s-modal-body{padding:0;max-width:90%;margin-top:3.2rem;border-radius:0.5rem;background:transparent;overflow:visible}#s-search-modal .s-modal-close{top:50%;transform:translateY(-50%)}";
462
+ const sallaSearchCss = "";
461
463
 
462
464
  const SallaSearch = class {
463
465
  constructor(hostRef) {
464
466
  index.registerInstance(this, hostRef);
465
467
  var _a;
466
468
  this.inputValue = '';
469
+ this.typing = false;
470
+ this.debounce = setTimeout(() => '', 1000);
467
471
  this.inline = false;
468
472
  this.oval = false;
469
473
  this.height = 60;
@@ -477,6 +481,7 @@ const SallaSearch = class {
477
481
  salla.event.on('modalOpened', () => this.onModalOpen());
478
482
  salla.event.on('modalClosed', () => this.onModalClose());
479
483
  }
484
+ ;
480
485
  onModalOpen() {
481
486
  setTimeout(() => this.searchInput.focus(), 300);
482
487
  }
@@ -494,20 +499,29 @@ const SallaSearch = class {
494
499
  ' <div class="s-search-product-title">{name}</div> <div class="s-search-product-price">{price} <span class="s-search-product-regular-price">{regular_price}</span></div>' +
495
500
  '</div>';
496
501
  }
497
- search(e) {
498
- this.inputValue = e.target.value;
499
- Helper.Helper.hideElement(this.noResults);
500
- if (e.target.value.length === 0) {
502
+ debounceSearch(event) {
503
+ this.typing = true;
504
+ clearTimeout(this.debounce);
505
+ this.debounce = setTimeout(() => {
506
+ this.typing = false;
507
+ this.search_term = event.target.value;
508
+ }, 500);
509
+ }
510
+ handelSearch(val) {
511
+ this.inputValue = val;
512
+ if (val.length > 2) {
513
+ this.search(val);
514
+ }
515
+ else {
501
516
  this.results = undefined;
502
517
  this.afterSearching();
503
- return;
504
- }
505
- if (e.target.value.length <= 2) {
506
- return;
507
518
  }
519
+ }
520
+ search(val) {
521
+ Helper.Helper.hideElement(this.noResults);
508
522
  //run loading spinner or stop it
509
523
  Helper.Helper.toggleElementClassIf(this.searchIcon, 's-search-spinner-loader', 'sicon-search', () => true);
510
- salla.product.search(e.target.value)
524
+ salla.product.search(val)
511
525
  .then(response => this.results = response)
512
526
  .catch(err => err !== 'Query is same as previous one!' ? this.results = undefined : null)
513
527
  .finally(() => this.afterSearching(/*isEmpty*/ false));
@@ -518,20 +532,20 @@ const SallaSearch = class {
518
532
  Helper.Helper.toggleElementClassIf(this.container, 's-search-container-open', 's-search-no-results', () => { var _a; return (_a = this.results) === null || _a === void 0 ? void 0 : _a.data.length; })
519
533
  .toggleElementClassIf(this.searchIcon, 's-search-spinner-loader', 'sicon-search', () => false); //stop searching anime
520
534
  salla.product.api.previousQuery = ''; //avoid having error 'Query is same as previous one!' after reopen modal;
521
- this.inputValue.length == 0 ? this.container.classList.remove('s-search-no-results') : '';
535
+ this.inputValue.length < 3 ? this.container.classList.remove('s-search-no-results') : '';
522
536
  }
523
537
  render() {
524
538
  var _a;
525
- const searchContent = index.h("div", { class: { 's-search-container': true, 's-search-inline': this.inline }, ref: container => this.container = container, style: this.oval ? { borderRadius: this.height / 2 + 'px' } : {} }, index.h("input", { class: "s-search-input", type: "text", placeholder: this.placeholder, onInput: e => this.search(e), style: { height: this.height + 'px' }, ref: input => this.searchInput = input }), index.h("span", { class: "s-search-icon-wrap" }, index.h("i", { class: "s-search-icon sicon-search", ref: el => this.searchIcon = el })), index.h("div", { class: "s-search-results" }, (_a = this.results) === null || _a === void 0 ? void 0 :
539
+ const searchContent = index.h("div", { class: { 's-search-container': true, 's-search-inline': this.inline }, ref: container => this.container = container }, index.h("input", { class: "s-search-input", type: "text", placeholder: this.placeholder, onInput: e => this.debounceSearch(e), style: { height: this.height + 'px', borderRadius: this.oval ? this.height / 2 + 'px' : '' }, ref: input => this.searchInput = input }), index.h("span", { class: "s-search-icon-wrap" }, index.h("i", { class: "s-search-icon sicon-search", ref: el => this.searchIcon = el })), index.h("div", { class: "s-search-results" }, (_a = this.results) === null || _a === void 0 ? void 0 :
526
540
  _a.data.map(item => index.h("a", { href: item.url, class: { "s-search-product": true, 's-search-product-not-available': !item.is_available }, innerHTML: this.productSlot
527
541
  .replace(/\{name\}/g, item.name)
528
542
  .replace(/\{price\}/g, salla.money(item.price))
529
543
  .replace(/\{regular_price\}/g, item.has_special_price ? salla.money(item.regular_price) : '')
530
544
  .replace(/\{image\}/g, item.thumbnail) })), index.h("p", { ref: el => this.noResults = el, class: "s-search-no-results-placeholder" }, this.noResultsText)));
531
545
  return (this.inline ?
532
- index.h("div", { id: "s-search-modal" }, searchContent)
546
+ index.h("div", { class: "s-search-modal" }, searchContent)
533
547
  :
534
- index.h("salla-modal", { position: "top", id: "s-search-modal", ref: modal => this.modal = modal }, searchContent));
548
+ index.h("salla-modal", { position: "top", class: "s-search-modal", ref: modal => this.modal = modal }, searchContent));
535
549
  }
536
550
  /**
537
551
  * Run it one time after load
@@ -540,6 +554,9 @@ const SallaSearch = class {
540
554
  this.afterSearching();
541
555
  }
542
556
  get host() { return index.getElement(this); }
557
+ static get watchers() { return {
558
+ "search_term": ["handelSearch"]
559
+ }; }
543
560
  };
544
561
  SallaSearch.style = sallaSearchCss;
545
562
 
@@ -559,7 +576,7 @@ function commonjsRequire () {
559
576
 
560
577
  var intlTelInput$1 = createCommonjsModule(function (module) {
561
578
  /*
562
- * International Telephone Input v17.0.15
579
+ * International Telephone Input v17.0.18
563
580
  * https://github.com/jackocnr/intl-tel-input.git
564
581
  * Licensed under the MIT license
565
582
  */
@@ -1898,7 +1915,7 @@ var intlTelInput$1 = createCommonjsModule(function (module) {
1898
1915
  // default options
1899
1916
  intlTelInputGlobals.defaults = defaults;
1900
1917
  // version
1901
- intlTelInputGlobals.version = "17.0.15";
1918
+ intlTelInputGlobals.version = "17.0.18";
1902
1919
  // convenience wrapper
1903
1920
  return function(input, options) {
1904
1921
  var iti = new Iti(input, options);
@@ -1916,7 +1933,7 @@ var intlTelInput$1 = createCommonjsModule(function (module) {
1916
1933
  */
1917
1934
  var intlTelInput = intlTelInput$1;
1918
1935
 
1919
- const sallaTelInputCss = "@charset \"UTF-8\";.iti{width:100%;position:relative;display:inline-block}.iti *{box-sizing:border-box;-moz-box-sizing:border-box}.iti__hide{display:none}.iti__v-hide{visibility:hidden}.iti input,.iti input[type=text],.iti input[type=tel]{position:relative;z-index:0;direction:ltr !important;margin-top:0 !important;margin-bottom:0 !important;padding-left:95px !important;padding-right:15px !important;margin-left:0 !important}.iti__flag-container{width:100%;position:absolute;top:0;bottom:0;left:0;padding:1px}.iti__selected-flag{width:80px;z-index:1;position:relative;display:flex;align-items:center;height:100%;float:left;padding:0 15px;box-shadow:none !important;outline:none !important}.ltr .iti__selected-flag{justify-content:flex-end}.iti__selected-flag:before{content:\"\";display:block;width:1px;height:70%;background:#eee;position:absolute;top:15%;right:0}.iti__selected-flag .iti__flag{display:none}.iti__arrow{width:15px;height:15px;line-height:15px;position:absolute;left:10px;top:50%;transform:translateY(-50%)}.iti__arrow:after{content:\"\";font-family:sallaicons;font-size:16px;color:#999;opacity:0.65}.iti__arrow--up:after{transform:rotate(180deg)}.iti__country-list{width:100%;max-height:160px;position:absolute;top:100%;left:0;z-index:2;list-style:none;margin:0;padding:0;margin:5px 0 0 0;border-radius:5px;box-shadow:0px 2px 4px 2px rgba(0, 0, 0, 0.05);border:1px solid #f5f7f9;background-color:white;white-space:nowrap;overflow:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch}.iti__country-list::-webkit-scrollbar{width:4px}.dark .iti__country-list{background-color:#52525b;border-color:#52525b}.iti__country-list li{display:flex;align-items:center;justify-content:flex-start;flex-direction:row;padding:8px 10px;transition:background-color 0.3s}.iti__country-list li span{font-size:12px}.iti__country-list li:hover,.iti__country-list li.highlighted{background-color:rgba(0, 0, 0, 0.05)}.iti__country-list--dropup{bottom:100%;top:unset;margin:0 0 5px 0}@media (max-width: 500px){.iti__country-list{white-space:normal}}.iti__flag-box{display:inline-block;width:20px;margin:0 0 0 5px}.iti__divider{padding-bottom:5px;margin-bottom:5px;border-bottom:1px solid #eee}.iti__country{padding:5px 10px;outline:none}.iti__dial-code{font-family:Arial;color:#999;unicode-bidi:plaintext;letter-spacing:1px}.iti__country.iti__highlight{background-color:rgba(0, 0, 0, 0.05)}.iti__flag-box,.iti__country-name,.iti__dial-code{vertical-align:middle}.iti__country-name{flex:auto;margin:0;padding:0 10px;white-space:normal;line-height:1.3}.iti--allow-dropdown .iti__flag-container,.iti--separate-dial-code .iti__flag-container{left:0}.iti--allow-dropdown .iti__flag-container:hover{cursor:pointer}.iti--allow-dropdown input[disabled]+.iti__flag-container:hover,.iti--allow-dropdown input[readonly]+.iti__flag-container:hover{cursor:default}.iti--allow-dropdown input[disabled]+.iti__flag-container:hover .iti__selected-flag,.iti--allow-dropdown input[readonly]+.iti__flag-container:hover .iti__selected-flag{background-color:transparent}.iti--separate-dial-code .iti__selected-dial-code{unicode-bidi:plaintext;direction:ltr;letter-spacing:1px;font-family:\"Arial\", serif;font-size:13px}.iti--container{position:absolute;top:-1000px;z-index:1060;padding:1px}.iti--container:hover{cursor:pointer}.iti-mobile .iti--container{inset:0;margin:20px;width:calc(100% - 40px);position:fixed;z-index:9999}.iti-mobile .iti__country-list{max-height:100%;width:100%;inset:0}.iti-mobile .iti__country{padding:10px 10px;line-height:1.5em}.iti__flag{width:20px}.iti__flag.iti__be{width:18px}.iti__flag.iti__ch{width:15px}.iti__flag.iti__mc{width:19px}.iti__flag.iti__ne{width:18px}.iti__flag.iti__np{width:13px}.iti__flag.iti__va{width:15px}@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi){.iti__flag{background-size:5652px 15px}}.iti__flag.iti__ac{height:10px;background-position:0px 0px}.iti__flag.iti__ad{height:14px;background-position:-22px 0px}.iti__flag.iti__ae{height:10px;background-position:-44px 0px}.iti__flag.iti__af{height:14px;background-position:-66px 0px}.iti__flag.iti__ag{height:14px;background-position:-88px 0px}.iti__flag.iti__ai{height:10px;background-position:-110px 0px}.iti__flag.iti__al{height:15px;background-position:-132px 0px}.iti__flag.iti__am{height:10px;background-position:-154px 0px}.iti__flag.iti__ao{height:14px;background-position:-176px 0px}.iti__flag.iti__aq{height:14px;background-position:-198px 0px}.iti__flag.iti__ar{height:13px;background-position:-220px 0px}.iti__flag.iti__as{height:10px;background-position:-242px 0px}.iti__flag.iti__at{height:14px;background-position:-264px 0px}.iti__flag.iti__au{height:10px;background-position:-286px 0px}.iti__flag.iti__aw{height:14px;background-position:-308px 0px}.iti__flag.iti__ax{height:13px;background-position:-330px 0px}.iti__flag.iti__az{height:10px;background-position:-352px 0px}.iti__flag.iti__ba{height:10px;background-position:-374px 0px}.iti__flag.iti__bb{height:14px;background-position:-396px 0px}.iti__flag.iti__bd{height:12px;background-position:-418px 0px}.iti__flag.iti__be{height:15px;background-position:-440px 0px}.iti__flag.iti__bf{height:14px;background-position:-460px 0px}.iti__flag.iti__bg{height:12px;background-position:-482px 0px}.iti__flag.iti__bh{height:12px;background-position:-504px 0px}.iti__flag.iti__bi{height:12px;background-position:-526px 0px}.iti__flag.iti__bj{height:14px;background-position:-548px 0px}.iti__flag.iti__bl{height:14px;background-position:-570px 0px}.iti__flag.iti__bm{height:10px;background-position:-592px 0px}.iti__flag.iti__bn{height:10px;background-position:-614px 0px}.iti__flag.iti__bo{height:14px;background-position:-636px 0px}.iti__flag.iti__bq{height:14px;background-position:-658px 0px}.iti__flag.iti__br{height:14px;background-position:-680px 0px}.iti__flag.iti__bs{height:10px;background-position:-702px 0px}.iti__flag.iti__bt{height:14px;background-position:-724px 0px}.iti__flag.iti__bv{height:15px;background-position:-746px 0px}.iti__flag.iti__bw{height:14px;background-position:-768px 0px}.iti__flag.iti__by{height:10px;background-position:-790px 0px}.iti__flag.iti__bz{height:14px;background-position:-812px 0px}.iti__flag.iti__ca{height:10px;background-position:-834px 0px}.iti__flag.iti__cc{height:10px;background-position:-856px 0px}.iti__flag.iti__cd{height:15px;background-position:-878px 0px}.iti__flag.iti__cf{height:14px;background-position:-900px 0px}.iti__flag.iti__cg{height:14px;background-position:-922px 0px}.iti__flag.iti__ch{height:15px;background-position:-944px 0px}.iti__flag.iti__ci{height:14px;background-position:-961px 0px}.iti__flag.iti__ck{height:10px;background-position:-983px 0px}.iti__flag.iti__cl{height:14px;background-position:-1005px 0px}.iti__flag.iti__cm{height:14px;background-position:-1027px 0px}.iti__flag.iti__cn{height:14px;background-position:-1049px 0px}.iti__flag.iti__co{height:14px;background-position:-1071px 0px}.iti__flag.iti__cp{height:14px;background-position:-1093px 0px}.iti__flag.iti__cr{height:12px;background-position:-1115px 0px}.iti__flag.iti__cu{height:10px;background-position:-1137px 0px}.iti__flag.iti__cv{height:12px;background-position:-1159px 0px}.iti__flag.iti__cw{height:14px;background-position:-1181px 0px}.iti__flag.iti__cx{height:10px;background-position:-1203px 0px}.iti__flag.iti__cy{height:14px;background-position:-1225px 0px}.iti__flag.iti__cz{height:14px;background-position:-1247px 0px}.iti__flag.iti__de{height:12px;background-position:-1269px 0px}.iti__flag.iti__dg{height:10px;background-position:-1291px 0px}.iti__flag.iti__dj{height:14px;background-position:-1313px 0px}.iti__flag.iti__dk{height:15px;background-position:-1335px 0px}.iti__flag.iti__dm{height:10px;background-position:-1357px 0px}.iti__flag.iti__do{height:14px;background-position:-1379px 0px}.iti__flag.iti__dz{height:14px;background-position:-1401px 0px}.iti__flag.iti__ea{height:14px;background-position:-1423px 0px}.iti__flag.iti__ec{height:14px;background-position:-1445px 0px}.iti__flag.iti__ee{height:13px;background-position:-1467px 0px}.iti__flag.iti__eg{height:14px;background-position:-1489px 0px}.iti__flag.iti__eh{height:10px;background-position:-1511px 0px}.iti__flag.iti__er{height:10px;background-position:-1533px 0px}.iti__flag.iti__es{height:14px;background-position:-1555px 0px}.iti__flag.iti__et{height:10px;background-position:-1577px 0px}.iti__flag.iti__eu{height:14px;background-position:-1599px 0px}.iti__flag.iti__fi{height:12px;background-position:-1621px 0px}.iti__flag.iti__fj{height:10px;background-position:-1643px 0px}.iti__flag.iti__fk{height:10px;background-position:-1665px 0px}.iti__flag.iti__fm{height:11px;background-position:-1687px 0px}.iti__flag.iti__fo{height:15px;background-position:-1709px 0px}.iti__flag.iti__fr{height:14px;background-position:-1731px 0px}.iti__flag.iti__ga{height:15px;background-position:-1753px 0px}.iti__flag.iti__gb{height:10px;background-position:-1775px 0px}.iti__flag.iti__gd{height:12px;background-position:-1797px 0px}.iti__flag.iti__ge{height:14px;background-position:-1819px 0px}.iti__flag.iti__gf{height:14px;background-position:-1841px 0px}.iti__flag.iti__gg{height:14px;background-position:-1863px 0px}.iti__flag.iti__gh{height:14px;background-position:-1885px 0px}.iti__flag.iti__gi{height:10px;background-position:-1907px 0px}.iti__flag.iti__gl{height:14px;background-position:-1929px 0px}.iti__flag.iti__gm{height:14px;background-position:-1951px 0px}.iti__flag.iti__gn{height:14px;background-position:-1973px 0px}.iti__flag.iti__gp{height:14px;background-position:-1995px 0px}.iti__flag.iti__gq{height:14px;background-position:-2017px 0px}.iti__flag.iti__gr{height:14px;background-position:-2039px 0px}.iti__flag.iti__gs{height:10px;background-position:-2061px 0px}.iti__flag.iti__gt{height:13px;background-position:-2083px 0px}.iti__flag.iti__gu{height:11px;background-position:-2105px 0px}.iti__flag.iti__gw{height:10px;background-position:-2127px 0px}.iti__flag.iti__gy{height:12px;background-position:-2149px 0px}.iti__flag.iti__hk{height:14px;background-position:-2171px 0px}.iti__flag.iti__hm{height:10px;background-position:-2193px 0px}.iti__flag.iti__hn{height:10px;background-position:-2215px 0px}.iti__flag.iti__hr{height:10px;background-position:-2237px 0px}.iti__flag.iti__ht{height:12px;background-position:-2259px 0px}.iti__flag.iti__hu{height:10px;background-position:-2281px 0px}.iti__flag.iti__ic{height:14px;background-position:-2303px 0px}.iti__flag.iti__id{height:14px;background-position:-2325px 0px}.iti__flag.iti__ie{height:10px;background-position:-2347px 0px}.iti__flag.iti__il{height:15px;background-position:-2369px 0px}.iti__flag.iti__im{height:10px;background-position:-2391px 0px}.iti__flag.iti__in{height:14px;background-position:-2413px 0px}.iti__flag.iti__io{height:10px;background-position:-2435px 0px}.iti__flag.iti__iq{height:14px;background-position:-2457px 0px}.iti__flag.iti__ir{height:12px;background-position:-2479px 0px}.iti__flag.iti__is{height:15px;background-position:-2501px 0px}.iti__flag.iti__it{height:14px;background-position:-2523px 0px}.iti__flag.iti__je{height:12px;background-position:-2545px 0px}.iti__flag.iti__jm{height:10px;background-position:-2567px 0px}.iti__flag.iti__jo{height:10px;background-position:-2589px 0px}.iti__flag.iti__jp{height:14px;background-position:-2611px 0px}.iti__flag.iti__ke{height:14px;background-position:-2633px 0px}.iti__flag.iti__kg{height:12px;background-position:-2655px 0px}.iti__flag.iti__kh{height:13px;background-position:-2677px 0px}.iti__flag.iti__ki{height:10px;background-position:-2699px 0px}.iti__flag.iti__km{height:12px;background-position:-2721px 0px}.iti__flag.iti__kn{height:14px;background-position:-2743px 0px}.iti__flag.iti__kp{height:10px;background-position:-2765px 0px}.iti__flag.iti__kr{height:14px;background-position:-2787px 0px}.iti__flag.iti__kw{height:10px;background-position:-2809px 0px}.iti__flag.iti__ky{height:10px;background-position:-2831px 0px}.iti__flag.iti__kz{height:10px;background-position:-2853px 0px}.iti__flag.iti__la{height:14px;background-position:-2875px 0px}.iti__flag.iti__lb{height:14px;background-position:-2897px 0px}.iti__flag.iti__lc{height:10px;background-position:-2919px 0px}.iti__flag.iti__li{height:12px;background-position:-2941px 0px}.iti__flag.iti__lk{height:10px;background-position:-2963px 0px}.iti__flag.iti__lr{height:11px;background-position:-2985px 0px}.iti__flag.iti__ls{height:14px;background-position:-3007px 0px}.iti__flag.iti__lt{height:12px;background-position:-3029px 0px}.iti__flag.iti__lu{height:12px;background-position:-3051px 0px}.iti__flag.iti__lv{height:10px;background-position:-3073px 0px}.iti__flag.iti__ly{height:10px;background-position:-3095px 0px}.iti__flag.iti__ma{height:14px;background-position:-3117px 0px}.iti__flag.iti__mc{height:15px;background-position:-3139px 0px}.iti__flag.iti__md{height:10px;background-position:-3160px 0px}.iti__flag.iti__me{height:10px;background-position:-3182px 0px}.iti__flag.iti__mf{height:14px;background-position:-3204px 0px}.iti__flag.iti__mg{height:14px;background-position:-3226px 0px}.iti__flag.iti__mh{height:11px;background-position:-3248px 0px}.iti__flag.iti__mk{height:10px;background-position:-3270px 0px}.iti__flag.iti__ml{height:14px;background-position:-3292px 0px}.iti__flag.iti__mm{height:14px;background-position:-3314px 0px}.iti__flag.iti__mn{height:10px;background-position:-3336px 0px}.iti__flag.iti__mo{height:14px;background-position:-3358px 0px}.iti__flag.iti__mp{height:10px;background-position:-3380px 0px}.iti__flag.iti__mq{height:14px;background-position:-3402px 0px}.iti__flag.iti__mr{height:14px;background-position:-3424px 0px}.iti__flag.iti__ms{height:10px;background-position:-3446px 0px}.iti__flag.iti__mt{height:14px;background-position:-3468px 0px}.iti__flag.iti__mu{height:14px;background-position:-3490px 0px}.iti__flag.iti__mv{height:14px;background-position:-3512px 0px}.iti__flag.iti__mw{height:14px;background-position:-3534px 0px}.iti__flag.iti__mx{height:12px;background-position:-3556px 0px}.iti__flag.iti__my{height:10px;background-position:-3578px 0px}.iti__flag.iti__mz{height:14px;background-position:-3600px 0px}.iti__flag.iti__na{height:14px;background-position:-3622px 0px}.iti__flag.iti__nc{height:10px;background-position:-3644px 0px}.iti__flag.iti__ne{height:15px;background-position:-3666px 0px}.iti__flag.iti__nf{height:10px;background-position:-3686px 0px}.iti__flag.iti__ng{height:10px;background-position:-3708px 0px}.iti__flag.iti__ni{height:12px;background-position:-3730px 0px}.iti__flag.iti__nl{height:14px;background-position:-3752px 0px}.iti__flag.iti__no{height:15px;background-position:-3774px 0px}.iti__flag.iti__np{height:15px;background-position:-3796px 0px}.iti__flag.iti__nr{height:10px;background-position:-3811px 0px}.iti__flag.iti__nu{height:10px;background-position:-3833px 0px}.iti__flag.iti__nz{height:10px;background-position:-3855px 0px}.iti__flag.iti__om{height:10px;background-position:-3877px 0px}.iti__flag.iti__pa{height:14px;background-position:-3899px 0px}.iti__flag.iti__pe{height:14px;background-position:-3921px 0px}.iti__flag.iti__pf{height:14px;background-position:-3943px 0px}.iti__flag.iti__pg{height:15px;background-position:-3965px 0px}.iti__flag.iti__ph{height:10px;background-position:-3987px 0px}.iti__flag.iti__pk{height:14px;background-position:-4009px 0px}.iti__flag.iti__pl{height:13px;background-position:-4031px 0px}.iti__flag.iti__pm{height:14px;background-position:-4053px 0px}.iti__flag.iti__pn{height:10px;background-position:-4075px 0px}.iti__flag.iti__pr{height:14px;background-position:-4097px 0px}.iti__flag.iti__ps{height:10px;background-position:-4119px 0px}.iti__flag.iti__pt{height:14px;background-position:-4141px 0px}.iti__flag.iti__pw{height:13px;background-position:-4163px 0px}.iti__flag.iti__py{height:11px;background-position:-4185px 0px}.iti__flag.iti__qa{height:8px;background-position:-4207px 0px}.iti__flag.iti__re{height:14px;background-position:-4229px 0px}.iti__flag.iti__ro{height:14px;background-position:-4251px 0px}.iti__flag.iti__rs{height:14px;background-position:-4273px 0px}.iti__flag.iti__ru{height:14px;background-position:-4295px 0px}.iti__flag.iti__rw{height:14px;background-position:-4317px 0px}.iti__flag.iti__sa{height:14px;background-position:-4339px 0px}.iti__flag.iti__sb{height:10px;background-position:-4361px 0px}.iti__flag.iti__sc{height:10px;background-position:-4383px 0px}.iti__flag.iti__sd{height:10px;background-position:-4405px 0px}.iti__flag.iti__se{height:13px;background-position:-4427px 0px}.iti__flag.iti__sg{height:14px;background-position:-4449px 0px}.iti__flag.iti__sh{height:10px;background-position:-4471px 0px}.iti__flag.iti__si{height:10px;background-position:-4493px 0px}.iti__flag.iti__sj{height:15px;background-position:-4515px 0px}.iti__flag.iti__sk{height:14px;background-position:-4537px 0px}.iti__flag.iti__sl{height:14px;background-position:-4559px 0px}.iti__flag.iti__sm{height:15px;background-position:-4581px 0px}.iti__flag.iti__sn{height:14px;background-position:-4603px 0px}.iti__flag.iti__so{height:14px;background-position:-4625px 0px}.iti__flag.iti__sr{height:14px;background-position:-4647px 0px}.iti__flag.iti__ss{height:10px;background-position:-4669px 0px}.iti__flag.iti__st{height:10px;background-position:-4691px 0px}.iti__flag.iti__sv{height:12px;background-position:-4713px 0px}.iti__flag.iti__sx{height:14px;background-position:-4735px 0px}.iti__flag.iti__sy{height:14px;background-position:-4757px 0px}.iti__flag.iti__sz{height:14px;background-position:-4779px 0px}.iti__flag.iti__ta{height:10px;background-position:-4801px 0px}.iti__flag.iti__tc{height:10px;background-position:-4823px 0px}.iti__flag.iti__td{height:14px;background-position:-4845px 0px}.iti__flag.iti__tf{height:14px;background-position:-4867px 0px}.iti__flag.iti__tg{height:13px;background-position:-4889px 0px}.iti__flag.iti__th{height:14px;background-position:-4911px 0px}.iti__flag.iti__tj{height:10px;background-position:-4933px 0px}.iti__flag.iti__tk{height:10px;background-position:-4955px 0px}.iti__flag.iti__tl{height:10px;background-position:-4977px 0px}.iti__flag.iti__tm{height:14px;background-position:-4999px 0px}.iti__flag.iti__tn{height:14px;background-position:-5021px 0px}.iti__flag.iti__to{height:10px;background-position:-5043px 0px}.iti__flag.iti__tr{height:14px;background-position:-5065px 0px}.iti__flag.iti__tt{height:12px;background-position:-5087px 0px}.iti__flag.iti__tv{height:10px;background-position:-5109px 0px}.iti__flag.iti__tw{height:14px;background-position:-5131px 0px}.iti__flag.iti__tz{height:14px;background-position:-5153px 0px}.iti__flag.iti__ua{height:14px;background-position:-5175px 0px}.iti__flag.iti__ug{height:14px;background-position:-5197px 0px}.iti__flag.iti__um{height:11px;background-position:-5219px 0px}.iti__flag.iti__un{height:14px;background-position:-5241px 0px}.iti__flag.iti__us{height:11px;background-position:-5263px 0px}.iti__flag.iti__uy{height:14px;background-position:-5285px 0px}.iti__flag.iti__uz{height:10px;background-position:-5307px 0px}.iti__flag.iti__va{height:15px;background-position:-5329px 0px}.iti__flag.iti__vc{height:14px;background-position:-5346px 0px}.iti__flag.iti__ve{height:14px;background-position:-5368px 0px}.iti__flag.iti__vg{height:10px;background-position:-5390px 0px}.iti__flag.iti__vi{height:14px;background-position:-5412px 0px}.iti__flag.iti__vn{height:14px;background-position:-5434px 0px}.iti__flag.iti__vu{height:12px;background-position:-5456px 0px}.iti__flag.iti__wf{height:14px;background-position:-5478px 0px}.iti__flag.iti__ws{height:10px;background-position:-5500px 0px}.iti__flag.iti__xk{height:15px;background-position:-5522px 0px}.iti__flag.iti__ye{height:14px;background-position:-5544px 0px}.iti__flag.iti__yt{height:14px;background-position:-5566px 0px}.iti__flag.iti__za{height:14px;background-position:-5588px 0px}.iti__flag.iti__zm{height:14px;background-position:-5610px 0px}.iti__flag.iti__zw{height:10px;background-position:-5632px 0px}.iti__flag{height:15px;box-shadow:0px 0px 1px 0px #888;background-image:url(\"https://intl-tel-input.com/node_modules/intl-tel-input/build/img/flags.png\");background-repeat:no-repeat;background-color:#f5f7f9;background-position:20px 0}@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi){.iti__flag{background-image:url(\"https://intl-tel-input.com/node_modules/intl-tel-input/build/img/flags@2x.png\")}}.iti__flag.iti__np{background-color:transparent}";
1936
+ const sallaTelInputCss = "@charset \"UTF-8\";.iti{width:100%;position:relative;display:inline-block}.iti *{box-sizing:border-box;-moz-box-sizing:border-box}.iti__hide{display:none}.iti__v-hide{visibility:hidden}.iti input,.iti input[type=text],.iti input[type=tel]{position:relative;z-index:0;direction:ltr !important;margin-top:0 !important;margin-bottom:0 !important;padding-left:95px !important;padding-right:15px !important;margin-left:0 !important}.iti__flag-container{width:100%;position:absolute;top:0;bottom:0;left:0;padding:1px}.iti__selected-flag{width:80px;z-index:1;position:relative;display:flex;align-items:center;height:100%;float:left;padding:0 15px;box-shadow:none !important;outline:none !important}.ltr .iti__selected-flag{justify-content:flex-end}.iti__selected-flag:before{content:\"\";display:block;width:1px;height:70%;background:#eee;position:absolute;top:15%;right:0}.iti__selected-flag .iti__flag{display:none}.iti__arrow{width:15px;height:15px;line-height:15px;position:absolute;left:10px;top:50%;transform:translateY(-50%)}.iti__arrow:after{content:\"\";font-family:sallaicons;font-size:16px;color:#999;opacity:0.65}.iti__arrow--up:after{transform:rotate(180deg)}.iti__country-list{width:100%;max-height:160px;position:absolute;top:100%;left:0;z-index:2;list-style:none;margin:0;padding:0;margin:5px 0 0 0;border-radius:5px;box-shadow:0px 2px 4px 2px rgba(0, 0, 0, 0.05);border:1px solid #f5f7f9;background-color:white;white-space:nowrap;overflow:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch}.iti__country-list::-webkit-scrollbar{width:4px}.dark .iti__country-list{background-color:#52525b;border-color:#52525b}.iti__country-list li{display:flex;align-items:center;justify-content:flex-start;flex-direction:row;padding:8px 10px;transition:background-color 0.3s}.iti__country-list li span{font-size:12px}.iti__country-list li:hover,.iti__country-list li.highlighted{background-color:rgba(0, 0, 0, 0.05)}.iti__country-list--dropup{bottom:100%;top:unset;margin:0 0 5px 0}@media (max-width: 500px){.iti__country-list{white-space:normal}}.iti__flag-box{display:inline-block;width:20px;margin:0 0 0 5px}.iti__divider{padding-bottom:5px;margin-bottom:5px;border-bottom:1px solid #eee}.iti__country{padding:5px 10px;outline:none}.iti__dial-code{font-family:Arial;color:#999;unicode-bidi:plaintext;letter-spacing:1px}.iti__country.iti__highlight{background-color:rgba(0, 0, 0, 0.05)}.iti__flag-box,.iti__country-name,.iti__dial-code{vertical-align:middle}.iti__country-name{flex:auto;margin:0;padding:0 10px;white-space:normal;line-height:1.3}.iti--allow-dropdown .iti__flag-container,.iti--separate-dial-code .iti__flag-container{left:0}.iti--allow-dropdown .iti__flag-container:hover{cursor:pointer}.iti--allow-dropdown input[disabled]+.iti__flag-container:hover,.iti--allow-dropdown input[readonly]+.iti__flag-container:hover{cursor:default}.iti--allow-dropdown input[disabled]+.iti__flag-container:hover .iti__selected-flag,.iti--allow-dropdown input[readonly]+.iti__flag-container:hover .iti__selected-flag{background-color:transparent}.iti--separate-dial-code .iti__selected-dial-code{unicode-bidi:plaintext;direction:ltr;letter-spacing:1px;font-family:\"Arial\", serif;font-size:13px}.iti--container{position:absolute;top:-1000px;z-index:1060;padding:1px}.iti--container:hover{cursor:pointer}.iti-mobile .iti--container{inset:0;margin:20px;width:calc(100% - 40px);position:fixed;z-index:9999}.iti-mobile .iti__country-list{max-height:100%;width:100%;inset:0}.iti-mobile .iti__country{padding:10px 10px;line-height:1.5em}.iti__flag{width:20px}.iti__flag.iti__be{width:18px}.iti__flag.iti__ch{width:15px}.iti__flag.iti__mc{width:19px}.iti__flag.iti__ne{width:18px}.iti__flag.iti__np{width:13px}.iti__flag.iti__va{width:15px}@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi){.iti__flag{background-size:5652px 15px}}.iti__flag.iti__ac{height:10px;background-position:0px 0px}.iti__flag.iti__ad{height:14px;background-position:-22px 0px}.iti__flag.iti__ae{height:10px;background-position:-44px 0px}.iti__flag.iti__af{height:14px;background-position:-66px 0px}.iti__flag.iti__ag{height:14px;background-position:-88px 0px}.iti__flag.iti__ai{height:10px;background-position:-110px 0px}.iti__flag.iti__al{height:15px;background-position:-132px 0px}.iti__flag.iti__am{height:10px;background-position:-154px 0px}.iti__flag.iti__ao{height:14px;background-position:-176px 0px}.iti__flag.iti__aq{height:14px;background-position:-198px 0px}.iti__flag.iti__ar{height:13px;background-position:-220px 0px}.iti__flag.iti__as{height:10px;background-position:-242px 0px}.iti__flag.iti__at{height:14px;background-position:-264px 0px}.iti__flag.iti__au{height:10px;background-position:-286px 0px}.iti__flag.iti__aw{height:14px;background-position:-308px 0px}.iti__flag.iti__ax{height:13px;background-position:-330px 0px}.iti__flag.iti__az{height:10px;background-position:-352px 0px}.iti__flag.iti__ba{height:10px;background-position:-374px 0px}.iti__flag.iti__bb{height:14px;background-position:-396px 0px}.iti__flag.iti__bd{height:12px;background-position:-418px 0px}.iti__flag.iti__be{height:15px;background-position:-440px 0px}.iti__flag.iti__bf{height:14px;background-position:-460px 0px}.iti__flag.iti__bg{height:12px;background-position:-482px 0px}.iti__flag.iti__bh{height:12px;background-position:-504px 0px}.iti__flag.iti__bi{height:12px;background-position:-526px 0px}.iti__flag.iti__bj{height:14px;background-position:-548px 0px}.iti__flag.iti__bl{height:14px;background-position:-570px 0px}.iti__flag.iti__bm{height:10px;background-position:-592px 0px}.iti__flag.iti__bn{height:10px;background-position:-614px 0px}.iti__flag.iti__bo{height:14px;background-position:-636px 0px}.iti__flag.iti__bq{height:14px;background-position:-658px 0px}.iti__flag.iti__br{height:14px;background-position:-680px 0px}.iti__flag.iti__bs{height:10px;background-position:-702px 0px}.iti__flag.iti__bt{height:14px;background-position:-724px 0px}.iti__flag.iti__bv{height:15px;background-position:-746px 0px}.iti__flag.iti__bw{height:14px;background-position:-768px 0px}.iti__flag.iti__by{height:10px;background-position:-790px 0px}.iti__flag.iti__bz{height:14px;background-position:-812px 0px}.iti__flag.iti__ca{height:10px;background-position:-834px 0px}.iti__flag.iti__cc{height:10px;background-position:-856px 0px}.iti__flag.iti__cd{height:15px;background-position:-878px 0px}.iti__flag.iti__cf{height:14px;background-position:-900px 0px}.iti__flag.iti__cg{height:14px;background-position:-922px 0px}.iti__flag.iti__ch{height:15px;background-position:-944px 0px}.iti__flag.iti__ci{height:14px;background-position:-961px 0px}.iti__flag.iti__ck{height:10px;background-position:-983px 0px}.iti__flag.iti__cl{height:14px;background-position:-1005px 0px}.iti__flag.iti__cm{height:14px;background-position:-1027px 0px}.iti__flag.iti__cn{height:14px;background-position:-1049px 0px}.iti__flag.iti__co{height:14px;background-position:-1071px 0px}.iti__flag.iti__cp{height:14px;background-position:-1093px 0px}.iti__flag.iti__cr{height:12px;background-position:-1115px 0px}.iti__flag.iti__cu{height:10px;background-position:-1137px 0px}.iti__flag.iti__cv{height:12px;background-position:-1159px 0px}.iti__flag.iti__cw{height:14px;background-position:-1181px 0px}.iti__flag.iti__cx{height:10px;background-position:-1203px 0px}.iti__flag.iti__cy{height:14px;background-position:-1225px 0px}.iti__flag.iti__cz{height:14px;background-position:-1247px 0px}.iti__flag.iti__de{height:12px;background-position:-1269px 0px}.iti__flag.iti__dg{height:10px;background-position:-1291px 0px}.iti__flag.iti__dj{height:14px;background-position:-1313px 0px}.iti__flag.iti__dk{height:15px;background-position:-1335px 0px}.iti__flag.iti__dm{height:10px;background-position:-1357px 0px}.iti__flag.iti__do{height:14px;background-position:-1379px 0px}.iti__flag.iti__dz{height:14px;background-position:-1401px 0px}.iti__flag.iti__ea{height:14px;background-position:-1423px 0px}.iti__flag.iti__ec{height:14px;background-position:-1445px 0px}.iti__flag.iti__ee{height:13px;background-position:-1467px 0px}.iti__flag.iti__eg{height:14px;background-position:-1489px 0px}.iti__flag.iti__eh{height:10px;background-position:-1511px 0px}.iti__flag.iti__er{height:10px;background-position:-1533px 0px}.iti__flag.iti__es{height:14px;background-position:-1555px 0px}.iti__flag.iti__et{height:10px;background-position:-1577px 0px}.iti__flag.iti__eu{height:14px;background-position:-1599px 0px}.iti__flag.iti__fi{height:12px;background-position:-1621px 0px}.iti__flag.iti__fj{height:10px;background-position:-1643px 0px}.iti__flag.iti__fk{height:10px;background-position:-1665px 0px}.iti__flag.iti__fm{height:11px;background-position:-1687px 0px}.iti__flag.iti__fo{height:15px;background-position:-1709px 0px}.iti__flag.iti__fr{height:14px;background-position:-1731px 0px}.iti__flag.iti__ga{height:15px;background-position:-1753px 0px}.iti__flag.iti__gb{height:10px;background-position:-1775px 0px}.iti__flag.iti__gd{height:12px;background-position:-1797px 0px}.iti__flag.iti__ge{height:14px;background-position:-1819px 0px}.iti__flag.iti__gf{height:14px;background-position:-1841px 0px}.iti__flag.iti__gg{height:14px;background-position:-1863px 0px}.iti__flag.iti__gh{height:14px;background-position:-1885px 0px}.iti__flag.iti__gi{height:10px;background-position:-1907px 0px}.iti__flag.iti__gl{height:14px;background-position:-1929px 0px}.iti__flag.iti__gm{height:14px;background-position:-1951px 0px}.iti__flag.iti__gn{height:14px;background-position:-1973px 0px}.iti__flag.iti__gp{height:14px;background-position:-1995px 0px}.iti__flag.iti__gq{height:14px;background-position:-2017px 0px}.iti__flag.iti__gr{height:14px;background-position:-2039px 0px}.iti__flag.iti__gs{height:10px;background-position:-2061px 0px}.iti__flag.iti__gt{height:13px;background-position:-2083px 0px}.iti__flag.iti__gu{height:11px;background-position:-2105px 0px}.iti__flag.iti__gw{height:10px;background-position:-2127px 0px}.iti__flag.iti__gy{height:12px;background-position:-2149px 0px}.iti__flag.iti__hk{height:14px;background-position:-2171px 0px}.iti__flag.iti__hm{height:10px;background-position:-2193px 0px}.iti__flag.iti__hn{height:10px;background-position:-2215px 0px}.iti__flag.iti__hr{height:10px;background-position:-2237px 0px}.iti__flag.iti__ht{height:12px;background-position:-2259px 0px}.iti__flag.iti__hu{height:10px;background-position:-2281px 0px}.iti__flag.iti__ic{height:14px;background-position:-2303px 0px}.iti__flag.iti__id{height:14px;background-position:-2325px 0px}.iti__flag.iti__ie{height:10px;background-position:-2347px 0px}.iti__flag.iti__il{height:15px;background-position:-2369px 0px}.iti__flag.iti__im{height:10px;background-position:-2391px 0px}.iti__flag.iti__in{height:14px;background-position:-2413px 0px}.iti__flag.iti__io{height:10px;background-position:-2435px 0px}.iti__flag.iti__iq{height:14px;background-position:-2457px 0px}.iti__flag.iti__ir{height:12px;background-position:-2479px 0px}.iti__flag.iti__is{height:15px;background-position:-2501px 0px}.iti__flag.iti__it{height:14px;background-position:-2523px 0px}.iti__flag.iti__je{height:12px;background-position:-2545px 0px}.iti__flag.iti__jm{height:10px;background-position:-2567px 0px}.iti__flag.iti__jo{height:10px;background-position:-2589px 0px}.iti__flag.iti__jp{height:14px;background-position:-2611px 0px}.iti__flag.iti__ke{height:14px;background-position:-2633px 0px}.iti__flag.iti__kg{height:12px;background-position:-2655px 0px}.iti__flag.iti__kh{height:13px;background-position:-2677px 0px}.iti__flag.iti__ki{height:10px;background-position:-2699px 0px}.iti__flag.iti__km{height:12px;background-position:-2721px 0px}.iti__flag.iti__kn{height:14px;background-position:-2743px 0px}.iti__flag.iti__kp{height:10px;background-position:-2765px 0px}.iti__flag.iti__kr{height:14px;background-position:-2787px 0px}.iti__flag.iti__kw{height:10px;background-position:-2809px 0px}.iti__flag.iti__ky{height:10px;background-position:-2831px 0px}.iti__flag.iti__kz{height:10px;background-position:-2853px 0px}.iti__flag.iti__la{height:14px;background-position:-2875px 0px}.iti__flag.iti__lb{height:14px;background-position:-2897px 0px}.iti__flag.iti__lc{height:10px;background-position:-2919px 0px}.iti__flag.iti__li{height:12px;background-position:-2941px 0px}.iti__flag.iti__lk{height:10px;background-position:-2963px 0px}.iti__flag.iti__lr{height:11px;background-position:-2985px 0px}.iti__flag.iti__ls{height:14px;background-position:-3007px 0px}.iti__flag.iti__lt{height:12px;background-position:-3029px 0px}.iti__flag.iti__lu{height:12px;background-position:-3051px 0px}.iti__flag.iti__lv{height:10px;background-position:-3073px 0px}.iti__flag.iti__ly{height:10px;background-position:-3095px 0px}.iti__flag.iti__ma{height:14px;background-position:-3117px 0px}.iti__flag.iti__mc{height:15px;background-position:-3139px 0px}.iti__flag.iti__md{height:10px;background-position:-3160px 0px}.iti__flag.iti__me{height:10px;background-position:-3182px 0px}.iti__flag.iti__mf{height:14px;background-position:-3204px 0px}.iti__flag.iti__mg{height:14px;background-position:-3226px 0px}.iti__flag.iti__mh{height:11px;background-position:-3248px 0px}.iti__flag.iti__mk{height:10px;background-position:-3270px 0px}.iti__flag.iti__ml{height:14px;background-position:-3292px 0px}.iti__flag.iti__mm{height:14px;background-position:-3314px 0px}.iti__flag.iti__mn{height:10px;background-position:-3336px 0px}.iti__flag.iti__mo{height:14px;background-position:-3358px 0px}.iti__flag.iti__mp{height:10px;background-position:-3380px 0px}.iti__flag.iti__mq{height:14px;background-position:-3402px 0px}.iti__flag.iti__mr{height:14px;background-position:-3424px 0px}.iti__flag.iti__ms{height:10px;background-position:-3446px 0px}.iti__flag.iti__mt{height:14px;background-position:-3468px 0px}.iti__flag.iti__mu{height:14px;background-position:-3490px 0px}.iti__flag.iti__mv{height:14px;background-position:-3512px 0px}.iti__flag.iti__mw{height:14px;background-position:-3534px 0px}.iti__flag.iti__mx{height:12px;background-position:-3556px 0px}.iti__flag.iti__my{height:10px;background-position:-3578px 0px}.iti__flag.iti__mz{height:14px;background-position:-3600px 0px}.iti__flag.iti__na{height:14px;background-position:-3622px 0px}.iti__flag.iti__nc{height:10px;background-position:-3644px 0px}.iti__flag.iti__ne{height:15px;background-position:-3666px 0px}.iti__flag.iti__nf{height:10px;background-position:-3686px 0px}.iti__flag.iti__ng{height:10px;background-position:-3708px 0px}.iti__flag.iti__ni{height:12px;background-position:-3730px 0px}.iti__flag.iti__nl{height:14px;background-position:-3752px 0px}.iti__flag.iti__no{height:15px;background-position:-3774px 0px}.iti__flag.iti__np{height:15px;background-position:-3796px 0px}.iti__flag.iti__nr{height:10px;background-position:-3811px 0px}.iti__flag.iti__nu{height:10px;background-position:-3833px 0px}.iti__flag.iti__nz{height:10px;background-position:-3855px 0px}.iti__flag.iti__om{height:10px;background-position:-3877px 0px}.iti__flag.iti__pa{height:14px;background-position:-3899px 0px}.iti__flag.iti__pe{height:14px;background-position:-3921px 0px}.iti__flag.iti__pf{height:14px;background-position:-3943px 0px}.iti__flag.iti__pg{height:15px;background-position:-3965px 0px}.iti__flag.iti__ph{height:10px;background-position:-3987px 0px}.iti__flag.iti__pk{height:14px;background-position:-4009px 0px}.iti__flag.iti__pl{height:13px;background-position:-4031px 0px}.iti__flag.iti__pm{height:14px;background-position:-4053px 0px}.iti__flag.iti__pn{height:10px;background-position:-4075px 0px}.iti__flag.iti__pr{height:14px;background-position:-4097px 0px}.iti__flag.iti__ps{height:10px;background-position:-4119px 0px}.iti__flag.iti__pt{height:14px;background-position:-4141px 0px}.iti__flag.iti__pw{height:13px;background-position:-4163px 0px}.iti__flag.iti__py{height:11px;background-position:-4185px 0px}.iti__flag.iti__qa{height:8px;background-position:-4207px 0px}.iti__flag.iti__re{height:14px;background-position:-4229px 0px}.iti__flag.iti__ro{height:14px;background-position:-4251px 0px}.iti__flag.iti__rs{height:14px;background-position:-4273px 0px}.iti__flag.iti__ru{height:14px;background-position:-4295px 0px}.iti__flag.iti__rw{height:14px;background-position:-4317px 0px}.iti__flag.iti__sa{height:14px;background-position:-4339px 0px}.iti__flag.iti__sb{height:10px;background-position:-4361px 0px}.iti__flag.iti__sc{height:10px;background-position:-4383px 0px}.iti__flag.iti__sd{height:10px;background-position:-4405px 0px}.iti__flag.iti__se{height:13px;background-position:-4427px 0px}.iti__flag.iti__sg{height:14px;background-position:-4449px 0px}.iti__flag.iti__sh{height:10px;background-position:-4471px 0px}.iti__flag.iti__si{height:10px;background-position:-4493px 0px}.iti__flag.iti__sj{height:15px;background-position:-4515px 0px}.iti__flag.iti__sk{height:14px;background-position:-4537px 0px}.iti__flag.iti__sl{height:14px;background-position:-4559px 0px}.iti__flag.iti__sm{height:15px;background-position:-4581px 0px}.iti__flag.iti__sn{height:14px;background-position:-4603px 0px}.iti__flag.iti__so{height:14px;background-position:-4625px 0px}.iti__flag.iti__sr{height:14px;background-position:-4647px 0px}.iti__flag.iti__ss{height:10px;background-position:-4669px 0px}.iti__flag.iti__st{height:10px;background-position:-4691px 0px}.iti__flag.iti__sv{height:12px;background-position:-4713px 0px}.iti__flag.iti__sx{height:14px;background-position:-4735px 0px}.iti__flag.iti__sy{height:14px;background-position:-4757px 0px}.iti__flag.iti__sz{height:14px;background-position:-4779px 0px}.iti__flag.iti__ta{height:10px;background-position:-4801px 0px}.iti__flag.iti__tc{height:10px;background-position:-4823px 0px}.iti__flag.iti__td{height:14px;background-position:-4845px 0px}.iti__flag.iti__tf{height:14px;background-position:-4867px 0px}.iti__flag.iti__tg{height:13px;background-position:-4889px 0px}.iti__flag.iti__th{height:14px;background-position:-4911px 0px}.iti__flag.iti__tj{height:10px;background-position:-4933px 0px}.iti__flag.iti__tk{height:10px;background-position:-4955px 0px}.iti__flag.iti__tl{height:10px;background-position:-4977px 0px}.iti__flag.iti__tm{height:14px;background-position:-4999px 0px}.iti__flag.iti__tn{height:14px;background-position:-5021px 0px}.iti__flag.iti__to{height:10px;background-position:-5043px 0px}.iti__flag.iti__tr{height:14px;background-position:-5065px 0px}.iti__flag.iti__tt{height:12px;background-position:-5087px 0px}.iti__flag.iti__tv{height:10px;background-position:-5109px 0px}.iti__flag.iti__tw{height:14px;background-position:-5131px 0px}.iti__flag.iti__tz{height:14px;background-position:-5153px 0px}.iti__flag.iti__ua{height:14px;background-position:-5175px 0px}.iti__flag.iti__ug{height:14px;background-position:-5197px 0px}.iti__flag.iti__um{height:11px;background-position:-5219px 0px}.iti__flag.iti__un{height:14px;background-position:-5241px 0px}.iti__flag.iti__us{height:11px;background-position:-5263px 0px}.iti__flag.iti__uy{height:14px;background-position:-5285px 0px}.iti__flag.iti__uz{height:10px;background-position:-5307px 0px}.iti__flag.iti__va{height:15px;background-position:-5329px 0px}.iti__flag.iti__vc{height:14px;background-position:-5346px 0px}.iti__flag.iti__ve{height:14px;background-position:-5368px 0px}.iti__flag.iti__vg{height:10px;background-position:-5390px 0px}.iti__flag.iti__vi{height:14px;background-position:-5412px 0px}.iti__flag.iti__vn{height:14px;background-position:-5434px 0px}.iti__flag.iti__vu{height:12px;background-position:-5456px 0px}.iti__flag.iti__wf{height:14px;background-position:-5478px 0px}.iti__flag.iti__ws{height:10px;background-position:-5500px 0px}.iti__flag.iti__xk{height:15px;background-position:-5522px 0px}.iti__flag.iti__ye{height:14px;background-position:-5544px 0px}.iti__flag.iti__yt{height:14px;background-position:-5566px 0px}.iti__flag.iti__za{height:14px;background-position:-5588px 0px}.iti__flag.iti__zm{height:14px;background-position:-5610px 0px}.iti__flag.iti__zw{height:10px;background-position:-5632px 0px}.iti__flag{height:15px;box-shadow:0px 0px 1px 0px #888;background-image:url(\"https://cdn.salla.network/images/flags.png\");background-repeat:no-repeat;background-color:#f5f7f9;background-position:20px 0}@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi){.iti__flag{background-image:url(\"https://cdn.salla.network/images/flags@2x.png\")}}.iti__flag.iti__np{background-color:transparent}";
1920
1937
 
1921
1938
  const SallaTelInput = class {
1922
1939
  constructor(hostRef) {
@@ -5,14 +5,14 @@
5
5
 
6
6
  Object.defineProperty(exports, '__esModule', { value: true });
7
7
 
8
- const index = require('./index-fdf99836.js');
8
+ const index = require('./index-b4140db0.js');
9
9
 
10
10
  const sallaBranchesCss = "";
11
11
 
12
12
  const SallaBranches = class {
13
13
  constructor(hostRef) {
14
14
  index.registerInstance(this, hostRef);
15
- this.open = false;
15
+ this.open = true;
16
16
  this.isOpenedBefore = salla.storage.get("branch-choosed-before");
17
17
  this.displayAs = 'default'; //todo:: change it to boolean, isPopup default false
18
18
  this.browseProductsFrom = 'all'; //todo:: get better name
@@ -46,10 +46,12 @@ const SallaBranches = class {
46
46
  }
47
47
  //todo:: add description for all @methods
48
48
  async show() {
49
- return this.modal.open();
49
+ var _a;
50
+ return (_a = this.modal) === null || _a === void 0 ? void 0 : _a.open();
50
51
  }
51
52
  async hide() {
52
- return this.modal.close();
53
+ var _a;
54
+ return (_a = this.modal) === null || _a === void 0 ? void 0 : _a.close();
53
55
  }
54
56
  handelChange(event) {
55
57
  this.selected = event.target.value;
@@ -65,7 +67,9 @@ const SallaBranches = class {
65
67
  }, 300);
66
68
  }
67
69
  render() {
68
- return (index.h("salla-modal", { icon: "sicon-store-alt", "modal-title": "\u0641\u0631\u0639 \u0627\u0644\u0631\u064A\u0627\u0636", "sub-title": "\u0623\u0646\u062A \u0627\u0644\u0622\u0646 \u062A\u062A\u0635\u0641\u062D \u0627\u0644\u0645\u062A\u062C\u0631 \u0645\u0646", "sub-title-first": true, "is-closable": !this.isOpenedBefore && this.displayAs == 'popup' ? 'false' : 'true', ref: modal => this.modal = modal, width: "sm", id: "s-branches-modal", class: "s-hidden" }, index.h("h4", { class: "s-branches-title" }, this.formTitle()), this.branches.length <= 5 ?
70
+ return (index.h("salla-modal", { icon: "sicon-store-alt", "modal-title": "\u0641\u0631\u0639 \u0627\u0644\u0631\u064A\u0627\u0636", "sub-title": "\u0623\u0646\u062A \u0627\u0644\u0622\u0646 \u062A\u062A\u0635\u0641\u062D \u0627\u0644\u0645\u062A\u062C\u0631 \u0645\u0646", "sub-title-first": true,
71
+ // is-closable={!this.isOpenedBefore && this.displayAs == 'popup' ? 'false' : 'true'}
72
+ ref: (modal) => this.modal = modal, width: "sm", id: "s-branches-modal", class: "s-hidden" }, index.h("h4", { class: "s-branches-title" }, this.formTitle()), this.branches.length <= 5 ?
69
73
  index.h("div", { class: "s-branches-space-v" }, this.branches.map((branch) => index.h("div", { class: "s-branches-input-wrap" }, index.h("input", { id: this.position + '_branch_' + branch.id, disabled: !branch.open && this.isChoiceable(), name: "lang", type: "radio", value: branch.id, onChange: (event) => this.handelChange(event), class: {
70
74
  's-branches-input': true,
71
75
  'opacity-50': !branch.open,
@@ -79,7 +83,7 @@ const SallaBranches = class {
79
83
  index.h("span", { class: this.statusColor(branch) }, branch.tag)))))
80
84
  :
81
85
  index.h("select", { class: "s-branches-select", onInput: (event) => this.handelChange(event) }, this.branches.map(branch => (index.h("option", { value: branch.id, disabled: !branch.open, selected: this.selected == branch.id }, branch.name, " ", branch.open ? '' : '- مُغلق')))), this.isChoiceable() ?
82
- index.h("slot", { name: "footer" }, index.h("salla-button", { ref: btn => this.btn = btn, onClick: () => this.handleSubmit(), class: "s-branches-submit", wide: true }, salla.lang.get('common.elements.ok')))
86
+ index.h("slot", { name: "footer" }, index.h("salla-button", { ref: btn => this.btn = btn, onClick: () => this.handleSubmit(), class: "s-branches-submit", width: "wide" }, salla.lang.get('common.elements.ok')))
83
87
  : ''));
84
88
  }
85
89
  componentDidRender() {
@@ -5,9 +5,7 @@
5
5
 
6
6
  Object.defineProperty(exports, '__esModule', { value: true });
7
7
 
8
- const index = require('./index-fdf99836.js');
9
-
10
- const sallaConditionalFieldsCss = ":host{display:block}";
8
+ const index = require('./index-b4140db0.js');
11
9
 
12
10
  const SallaConditionalFields = class {
13
11
  constructor(hostRef) {
@@ -15,6 +13,7 @@ const SallaConditionalFields = class {
15
13
  }
16
14
  changeHandler(event) {
17
15
  var _a;
16
+ console.log("🚀 ~ file: salla-conditional-fields.tsx ~ line 17 ~ SallaConditionalFields ~ changeHandler ~ changeHandler", event);
18
17
  salla.log('Received the change event: ', event);
19
18
  if (!event.target || !['SELECT'].includes(event.target.tagName) && !['checkbox'].includes(event.target.getAttribute('type'))) {
20
19
  salla.log('Ignore the change because is not support input: ' + (((_a = event === null || event === void 0 ? void 0 : event.target) === null || _a === void 0 ? void 0 : _a.tagName) || 'N/A'));
@@ -23,7 +22,7 @@ const SallaConditionalFields = class {
23
22
  // to extract the option id from the input name, the supported names are name[*] and name[*][]
24
23
  let optionId = event.target.name.replace('[]', '');
25
24
  let isMultiple = event.target.getAttribute('type') === 'checkbox';
26
- salla.log('Trying to find all the element with condation:', `[data-show-when^="${optionId}"]`);
25
+ salla.log('Trying to find all the element with condition:', `[data-show-when^="${optionId}"]`);
27
26
  this.host.querySelectorAll(`[data-show-when^="${optionId}"]`)
28
27
  .forEach((field) => {
29
28
  let isEqual = !(field === null || field === void 0 ? void 0 : field.dataset.showWhen.includes('!='));
@@ -72,6 +71,7 @@ const SallaConditionalFields = class {
72
71
  var _a;
73
72
  // @ts-ignore
74
73
  let optionName = (_a = field === null || field === void 0 ? void 0 : field.dataset) === null || _a === void 0 ? void 0 : _a.showWhen.replace(/(.*)(=|!=)(.*)/gm, '$1').trim();
74
+ console.log("🚀 ~ file: salla-conditional-fields.tsx ~ line 83 ~ SallaConditionalFields ~ this.host.querySelectorAll ~ optionName", optionName);
75
75
  if (!optionName) {
76
76
  return;
77
77
  }
@@ -85,6 +85,5 @@ const SallaConditionalFields = class {
85
85
  }
86
86
  get host() { return index.getElement(this); }
87
87
  };
88
- SallaConditionalFields.style = sallaConditionalFieldsCss;
89
88
 
90
89
  exports.salla_conditional_fields = SallaConditionalFields;
@@ -5,7 +5,7 @@
5
5
 
6
6
  Object.defineProperty(exports, '__esModule', { value: true });
7
7
 
8
- const index = require('./index-fdf99836.js');
8
+ const index = require('./index-b4140db0.js');
9
9
  const Helper = require('./Helper-8ae6a805.js');
10
10
 
11
11
  const sallaInfiniteScrollCss = "";
@@ -5,7 +5,7 @@
5
5
 
6
6
  Object.defineProperty(exports, '__esModule', { value: true });
7
7
 
8
- const index = require('./index-fdf99836.js');
8
+ const index = require('./index-b4140db0.js');
9
9
 
10
10
  const sallaInstallmentCss = "#tabbyPromoWrapper{background:white;border-radius:0.375rem;transition:box-shadow 0.5s cubic-bezier(0.4, 0, 0.2, 1);margin-bottom:20px}.salla-y #tabbyPromoWrapper{border:1px solid var(--color-grey-dark);border-radius:12px}#tabbyPromoWrapper:hover{box-shadow:0 0 #0000, 0 0 #0000, 5px 10px 30px #2B2D340D}#tabbyPromoWrapper #tabbyPromo *{font-family:var(--font-main)}#tabbyPromoWrapper #tabbyPromo>div>div{max-width:none;padding:15px;box-shadow:none;border:none}#tabbyPromoWrapper #tabbyPromo .tabby-promo-snippet{max-width:100%;min-height:100px;padding:18px 20px;border:none}#tabbyPromoWrapper #tabbyPromo .tabby-promo-snippet__text,#tabbyPromoWrapper #tabbyPromo .tabby-promo-snippet__link{font-size:var(--font-sm);color:var(--color-text) !important}#tabbyPromoWrapper #tabbyPromo .tabby-promo-snippet__link{font-weight:bold}.tabby-promo-wrapper #tabby-promo{font-family:var(--font-main) !important}.tabby-promo-wrapper #tabby-promo .tabby-promo__feature-title{font-size:var(--font-md)}.tabby-promo-wrapper #tabby-promo .tabby-promo__feature-desc{font-size:var(--font-sm);line-height:20px}.tamara-product-widget{margin-bottom:20px}.tamara-product-widget,.spotii-wrapper{min-height:100px;position:relative;color:var(--color-text);font-size:var(--font-sm);line-height:1.25;padding:18px 20px 18px 100px !important;background:white;border-radius:0.375rem;transition:box-shadow 0.5s cubic-bezier(0.4, 0, 0.2, 1)}.salla-y .tamara-product-widget,.salla-y .spotii-wrapper{border-radius:12px;border:1px solid var(--color-grey-dark)}.tamara-product-widget:hover,.spotii-wrapper:hover{box-shadow:0 0 #0000, 0 0 #0000, 5px 10px 30px #2B2D340D}.spotii-wrapper .spotii-promo{font-size:var(--font-md)}.spotii-wrapper .spotii-product-widget{font-size:var(--font-sm);margin-top:10px}.tamara-product-widget .tamara-logo{position:absolute;left:20px;top:18px;margin:0 !important}.ltr .tamara-product-widget .tamara-logo{right:20px;left:auto}.tamara-product-widget span{font-family:var(--font-main);font-size:var(--font-sm);color:var(--color-text)}.tamara-product-widget span:last-child{display:block;position:relative;margin-top:8px}.tamara-popup__wrap{overflow:auto !important}";
11
11