@salla.sa/twilight-components 2.12.38 → 2.12.39
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/salla-add-product-button_41.cjs.entry.js +1 -1
- package/dist/cjs/salla-add-product-button_41.cjs.entry.js.map +1 -1
- package/dist/collection/components/salla-tel-input/salla-tel-input.js +1 -1
- package/dist/collection/components/salla-tel-input/salla-tel-input.js.map +1 -1
- package/dist/components/salla-tel-input2.js +1 -1
- package/dist/components/salla-tel-input2.js.map +1 -1
- package/dist/esm/salla-add-product-button_41.entry.js +1 -1
- package/dist/esm/salla-add-product-button_41.entry.js.map +1 -1
- package/dist/esm-es5/salla-add-product-button_41.entry.js +1 -1
- package/dist/esm-es5/salla-add-product-button_41.entry.js.map +1 -1
- package/dist/twilight/p-a04e6e5e.system.js +1 -1
- package/dist/twilight/{p-695467d5.entry.js → p-c53f2b8f.entry.js} +2 -2
- package/dist/twilight/{p-695467d5.entry.js.map → p-c53f2b8f.entry.js.map} +1 -1
- package/dist/twilight/{p-09f2c48c.system.entry.js → p-e5c8f9dc.system.entry.js} +2 -2
- package/dist/twilight/{p-09f2c48c.system.entry.js.map → p-e5c8f9dc.system.entry.js.map} +1 -1
- package/dist/twilight/twilight.esm.js +1 -1
- package/package.json +3 -3
|
@@ -66,7 +66,7 @@ export class SallaTelInput {
|
|
|
66
66
|
formatOnDisplay: false,
|
|
67
67
|
separateDialCode: true,
|
|
68
68
|
autoPlaceholder: 'aggressive',
|
|
69
|
-
utilsScript: 'https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/
|
|
69
|
+
utilsScript: 'https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/18.2.1/js/utils.min.js',
|
|
70
70
|
});
|
|
71
71
|
this.phoneInput.addEventListener("countrychange", () => {
|
|
72
72
|
let data = this.iti.getSelectedCountryData();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"salla-tel-input.js","sourceRoot":"","sources":["../../../src/components/salla-tel-input/salla-tel-input.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Element, Component, Host, h, Prop, Method, Event, EventEmitter, State } from '@stencil/core';\nimport TelInput from \"intl-tel-input\";\nimport { Phone } from './interfaces';\n\n@Component({ tag: 'salla-tel-input', styleUrl: 'salla-tel-input.scss' })\n\nexport class SallaTelInput {\n constructor() {\n salla.lang.onLoaded(() => {\n this.mobileLabel = salla.lang.get('common.elements.mobile');\n this.countryCodeLabel = salla.lang.get('common.elements.country_code');\n this.invalidNumber = salla.lang.get('common.errors.invalid_value', { attribute: this.mobileLabel });\n this.invalidCountryCode = salla.lang.get('common.errors.invalid_value', { attribute: this.countryCodeLabel });\n this.tooShort = salla.lang.get('common.errors.too_short', { attribute: this.mobileLabel });\n this.tooLong = salla.lang.get('common.errors.too_long', { attribute: this.mobileLabel });\n this.mobileRequired = salla.lang.get('common.errors.field_required', { attribute: this.mobileLabel });\n this.errorMap = [this.invalidNumber, this.invalidCountryCode, this.tooShort, this.tooLong, this.invalidNumber];\n });\n }\n\n /**\n * Current mobile number\n */\n @Prop({ mutable: true }) phone: string;\n /**\n * input name\n */\n @Prop() name: string = 'phone';\n /**\n * Current country_code\n */\n @Prop({ mutable: true }) countryCode: string = salla.config.get('user.country_code', 'SA') || 'SA';\n\n /**\n * Event emmitted when user enters a phone number.\n */\n @Event() phoneEntered: EventEmitter<Phone>;\n\n\n @Element() host: HTMLElement;\n @State() mobileRequired: string;\n @State() countryCodeLabel: string = salla.lang.get('common.country_code');\n @State() mobileLabel: string = salla.lang.get('common.elements.mobile');\n @State() tooShort: string = salla.lang.get('common.errors.too_short', { attribute: this.mobileLabel });\n @State() tooLong: string = salla.lang.get('common.errors.too_long', { attribute: this.mobileLabel });\n @State() invalidCountryCode: string = salla.lang.get('common.errors.invalid_value', { attribute: this.countryCodeLabel });\n @State() invalidNumber: string = salla.lang.get('common.errors.invalid_value', { attribute: this.mobileLabel });\n @State() errorMap: string[] = [this.invalidNumber, this.invalidCountryCode, this.tooShort, this.tooLong, this.invalidNumber];\n\n private phoneInput: HTMLInputElement;\n private countryCodeInput: HTMLInputElement;\n private errorMsg: any;\n private iti: any;\n\n\n /**\n * Get current values\n * @return {{mobile:number,countryCode:'SA'|string}}\n */\n @Method()\n async getValues() {\n return {\n [this.name]: this.phone = this.phoneInput.value,\n countryCode: this.countryCode = this.countryCodeInput.value,\n countryKey: (this.host.querySelector('.iti__selected-dial-code') as any).innerText\n }\n }\n\n /**\n * Is current data valid or not\n * @return {boolean}\n */\n @Method()\n async isValid() {\n this.reset();\n if (this.iti.isValidNumber()) return true;\n\n if (!this.phoneInput.value.trim()) {\n this.phoneInput.classList.add(\"s-has-error\");\n this.errorMsg.innerText = this.mobileRequired || 'The mobile is required';\n return;\n }\n\n this.phoneInput.classList.add(\"s-has-error\");\n let errorCode = this.iti.getValidationError();\n this.errorMsg.innerText = this.errorMap[errorCode] || '';\n\n salla.logger.info('Phone number (' + this.countryCode + ' - ' + this.phone + ') is not valid, error code ' + errorCode);\n return false;\n }\n\n private initTelInput() {\n salla.helpers.inputDigitsOnly(this.phoneInput);\n this.iti = TelInput(this.phoneInput, {\n initialCountry: this.countryCode || 'sa',\n preferredCountries: ['sa', 'ae', 'kw', 'bh', 'qa', 'iq', 'om', 'ye', 'eg', 'jo', 'ps', 'sd', 'lb', 'dz', 'tn', 'ma', 'ly'],\n excludeCountries: ['sy', 'ir', 'cu', 'kp'],\n formatOnDisplay: false,\n separateDialCode: true,\n autoPlaceholder: 'aggressive',\n utilsScript: 'https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/17.0.12/js/utils.min.js',\n });\n this.phoneInput.addEventListener(\"countrychange\", () => {\n let data = this.iti.getSelectedCountryData();\n let value = data.iso2.toUpperCase();\n this.countryCodeInput.value = value\n this.countryCode = value;\n this.phoneEntered.emit({ number: this.phone, country_code: value })\n });\n\n // on blur: validate\n // this.phoneInput.addEventListener('blur', () => this.isValid());\n\n // on keyup / change flag: reset\n this.phoneInput.addEventListener('input', (e: Event) => {\n salla.helpers.inputDigitsOnly(e.target);\n this.reset();\n this.phoneEntered.emit({ number: (e.target as HTMLInputElement).value, country_code: this.countryCode })\n });\n\n }\n\n private reset() {\n this.phoneInput.classList.remove(\"s-has-error\");\n this.errorMsg.innerHTML = \"\";\n };\n\n private handleCountryInput(event) {\n if (!!this.phone) {\n this.phoneEntered.emit({ number: event.target.value, country_code: this.countryCode })\n }\n }\n\n\n render() {\n return (\n <Host class=\"s-tel-input\">\n <input type=\"tel\" name={this.name} value={this.phone} onChange={(event) => this.handleCountryInput(event)} ref={el => this.phoneInput = el}\n enterkeyhint=\"next\"\n autocomplete=\"tel\"\n class=\"s-tel-input-control tel-input s-ltr\" />\n <span class=\"s-tel-input-error-msg\" ref={el => this.errorMsg = el}/>\n <input type=\"hidden\" name=\"country_code\" value={this.countryCode} ref={el => this.countryCodeInput = el}\n class=\"country_code\" />\n </Host>\n );\n }\n\n componentDidLoad() {\n this.initTelInput();\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"salla-tel-input.js","sourceRoot":"","sources":["../../../src/components/salla-tel-input/salla-tel-input.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Element, Component, Host, h, Prop, Method, Event, EventEmitter, State } from '@stencil/core';\nimport TelInput from \"intl-tel-input\";\nimport { Phone } from './interfaces';\n\n@Component({ tag: 'salla-tel-input', styleUrl: 'salla-tel-input.scss' })\n\nexport class SallaTelInput {\n constructor() {\n salla.lang.onLoaded(() => {\n this.mobileLabel = salla.lang.get('common.elements.mobile');\n this.countryCodeLabel = salla.lang.get('common.elements.country_code');\n this.invalidNumber = salla.lang.get('common.errors.invalid_value', { attribute: this.mobileLabel });\n this.invalidCountryCode = salla.lang.get('common.errors.invalid_value', { attribute: this.countryCodeLabel });\n this.tooShort = salla.lang.get('common.errors.too_short', { attribute: this.mobileLabel });\n this.tooLong = salla.lang.get('common.errors.too_long', { attribute: this.mobileLabel });\n this.mobileRequired = salla.lang.get('common.errors.field_required', { attribute: this.mobileLabel });\n this.errorMap = [this.invalidNumber, this.invalidCountryCode, this.tooShort, this.tooLong, this.invalidNumber];\n });\n }\n\n /**\n * Current mobile number\n */\n @Prop({ mutable: true }) phone: string;\n /**\n * input name\n */\n @Prop() name: string = 'phone';\n /**\n * Current country_code\n */\n @Prop({ mutable: true }) countryCode: string = salla.config.get('user.country_code', 'SA') || 'SA';\n\n /**\n * Event emmitted when user enters a phone number.\n */\n @Event() phoneEntered: EventEmitter<Phone>;\n\n\n @Element() host: HTMLElement;\n @State() mobileRequired: string;\n @State() countryCodeLabel: string = salla.lang.get('common.country_code');\n @State() mobileLabel: string = salla.lang.get('common.elements.mobile');\n @State() tooShort: string = salla.lang.get('common.errors.too_short', { attribute: this.mobileLabel });\n @State() tooLong: string = salla.lang.get('common.errors.too_long', { attribute: this.mobileLabel });\n @State() invalidCountryCode: string = salla.lang.get('common.errors.invalid_value', { attribute: this.countryCodeLabel });\n @State() invalidNumber: string = salla.lang.get('common.errors.invalid_value', { attribute: this.mobileLabel });\n @State() errorMap: string[] = [this.invalidNumber, this.invalidCountryCode, this.tooShort, this.tooLong, this.invalidNumber];\n\n private phoneInput: HTMLInputElement;\n private countryCodeInput: HTMLInputElement;\n private errorMsg: any;\n private iti: any;\n\n\n /**\n * Get current values\n * @return {{mobile:number,countryCode:'SA'|string}}\n */\n @Method()\n async getValues() {\n return {\n [this.name]: this.phone = this.phoneInput.value,\n countryCode: this.countryCode = this.countryCodeInput.value,\n countryKey: (this.host.querySelector('.iti__selected-dial-code') as any).innerText\n }\n }\n\n /**\n * Is current data valid or not\n * @return {boolean}\n */\n @Method()\n async isValid() {\n this.reset();\n if (this.iti.isValidNumber()) return true;\n\n if (!this.phoneInput.value.trim()) {\n this.phoneInput.classList.add(\"s-has-error\");\n this.errorMsg.innerText = this.mobileRequired || 'The mobile is required';\n return;\n }\n\n this.phoneInput.classList.add(\"s-has-error\");\n let errorCode = this.iti.getValidationError();\n this.errorMsg.innerText = this.errorMap[errorCode] || '';\n\n salla.logger.info('Phone number (' + this.countryCode + ' - ' + this.phone + ') is not valid, error code ' + errorCode);\n return false;\n }\n\n private initTelInput() {\n salla.helpers.inputDigitsOnly(this.phoneInput);\n this.iti = TelInput(this.phoneInput, {\n initialCountry: this.countryCode || 'sa',\n preferredCountries: ['sa', 'ae', 'kw', 'bh', 'qa', 'iq', 'om', 'ye', 'eg', 'jo', 'ps', 'sd', 'lb', 'dz', 'tn', 'ma', 'ly'],\n excludeCountries: ['sy', 'ir', 'cu', 'kp'],\n formatOnDisplay: false,\n separateDialCode: true,\n autoPlaceholder: 'aggressive',\n utilsScript: 'https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/18.2.1/js/utils.min.js',\n });\n this.phoneInput.addEventListener(\"countrychange\", () => {\n let data = this.iti.getSelectedCountryData();\n let value = data.iso2.toUpperCase();\n this.countryCodeInput.value = value\n this.countryCode = value;\n this.phoneEntered.emit({ number: this.phone, country_code: value })\n });\n\n // on blur: validate\n // this.phoneInput.addEventListener('blur', () => this.isValid());\n\n // on keyup / change flag: reset\n this.phoneInput.addEventListener('input', (e: Event) => {\n salla.helpers.inputDigitsOnly(e.target);\n this.reset();\n this.phoneEntered.emit({ number: (e.target as HTMLInputElement).value, country_code: this.countryCode })\n });\n\n }\n\n private reset() {\n this.phoneInput.classList.remove(\"s-has-error\");\n this.errorMsg.innerHTML = \"\";\n };\n\n private handleCountryInput(event) {\n if (!!this.phone) {\n this.phoneEntered.emit({ number: event.target.value, country_code: this.countryCode })\n }\n }\n\n\n render() {\n return (\n <Host class=\"s-tel-input\">\n <input type=\"tel\" name={this.name} value={this.phone} onChange={(event) => this.handleCountryInput(event)} ref={el => this.phoneInput = el}\n enterkeyhint=\"next\"\n autocomplete=\"tel\"\n class=\"s-tel-input-control tel-input s-ltr\" />\n <span class=\"s-tel-input-error-msg\" ref={el => this.errorMsg = el}/>\n <input type=\"hidden\" name=\"country_code\" value={this.countryCode} ref={el => this.countryCodeInput = el}\n class=\"country_code\" />\n </Host>\n );\n }\n\n componentDidLoad() {\n this.initTelInput();\n }\n}\n"]}
|
|
@@ -1431,7 +1431,7 @@ const SallaTelInput = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
|
|
|
1431
1431
|
formatOnDisplay: false,
|
|
1432
1432
|
separateDialCode: true,
|
|
1433
1433
|
autoPlaceholder: 'aggressive',
|
|
1434
|
-
utilsScript: 'https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/
|
|
1434
|
+
utilsScript: 'https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/18.2.1/js/utils.min.js',
|
|
1435
1435
|
});
|
|
1436
1436
|
this.phoneInput.addEventListener("countrychange", () => {
|
|
1437
1437
|
let data = this.iti.getSelectedCountryData();
|