crmbonus-component-wake 0.0.7 → 0.0.8
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/crmbonus-component-wake/app-modal.entry.js +1 -1
- package/dist/crmbonus-component-wake/crm-bonus-form.entry.js +1 -1
- package/dist/crmbonus-component-wake/crm-bonus.entry.js +1 -1
- package/dist/crmbonus-component-wake/phone-input-mask.entry.js +2 -2
- package/dist/crmbonus-component-wake/phone-input-mask.entry.js.map +1 -1
- package/dist/types/components/phone/phone-input-mask.d.ts +1 -1
- package/dist/types/components.d.ts +1 -1
- package/package.json +1 -1
- package/dist/crmbonus-component-wake/index-144d2e69.js +0 -3039
- package/dist/crmbonus-component-wake/index-144d2e69.js.map +0 -1
- package/dist/crmbonus-component-wake/index-2aa8671b.js +0 -3039
- package/dist/crmbonus-component-wake/index-2aa8671b.js.map +0 -1
|
@@ -13,7 +13,7 @@ const AppModal = class {
|
|
|
13
13
|
this.modalClosed.emit();
|
|
14
14
|
}
|
|
15
15
|
render() {
|
|
16
|
-
return (h("div", { key: '
|
|
16
|
+
return (h("div", { key: '7b733aa3839cb1a565a9492f8963c8fccf5633c1', class: `modal-backdrop ${this.isOpen ? 'visible' : ''}` }, h("div", { key: '3f6c192264c33d8fc1e87fe0663f04be745d5703', class: "modal" }, h("div", { key: 'cee602791571eb2a35bffc9f371ffb9f984390a2', class: "modal-header" }, h("h3", { key: '049767eae88f55e58c26b64147396c449f1b86ff' }, this.modalTitle), h("button", { key: '05b70bb33c1171759885a1f5c110a725edc13d5a', class: "close-button", onClick: () => this.closeModal() }, "\u00D7")), h("div", { key: '647eeff3f03e9cce2fd03209cd537424fe06d130', class: "modal-body" }, h("slot", { key: 'd88039e09e4ff4df6525f9355a969025e8dad611' })))));
|
|
17
17
|
}
|
|
18
18
|
};
|
|
19
19
|
AppModal.style = appModalCss;
|
|
@@ -11,7 +11,7 @@ const CrmBonusForm = class {
|
|
|
11
11
|
console.log('phone', phone);
|
|
12
12
|
}
|
|
13
13
|
render() {
|
|
14
|
-
return (h("div", { key: '
|
|
14
|
+
return (h("div", { key: 'ffa1f40984bf1e1f999c80fd1c48f05be7db7c89', class: "form-container" }, h("phone-input-mask", { key: '54a2b31fe85e39db84c74125fb0847a0526228a9', ref: ref => this.phoneInputMask = ref }), h("button", { key: 'fa9c933cd6503200491a8622b219f729fb64924d', class: "button", onClick: () => this.validate() }, "validar")));
|
|
15
15
|
}
|
|
16
16
|
};
|
|
17
17
|
CrmBonusForm.style = crmBonusFormCss;
|
|
@@ -12,7 +12,7 @@ const MyComponent = class {
|
|
|
12
12
|
}
|
|
13
13
|
render() {
|
|
14
14
|
console.log('userId', this.userId);
|
|
15
|
-
return (h("div", { key: '
|
|
15
|
+
return (h("div", { key: '4fa36e21d1ca9c22a55d722eb06361d28d1eb247' }, h("div", { key: '54a109f0063c059c266f34c0bf0e8910ed2411bc', class: "container-button" }, h("img", { key: 'bf9204f5cd85fe980ecc69e6f65eeed5249b8f63', src: logoSvg, onClick: () => (this.showModal = true) })), h("app-modal", { key: '9b7dfa38b25c2c3106db9be63a1ea1c3427a07d3', isOpen: this.showModal, modalTitle: `Título do Modal ${this.userId}`, onModalClosed: () => (this.showModal = false) }, h("crm-bonus-form", { key: 'e35cd157c76a9142282804279681a41474d29ef0' }))));
|
|
16
16
|
}
|
|
17
17
|
static get assetsDirs() { return ["assets"]; }
|
|
18
18
|
};
|
|
@@ -21,11 +21,11 @@ const PhoneInputMask = class {
|
|
|
21
21
|
const input = event.target;
|
|
22
22
|
this.phone = this.formatPhone(input.value);
|
|
23
23
|
}
|
|
24
|
-
getPhone() {
|
|
24
|
+
async getPhone() {
|
|
25
25
|
return this.phone;
|
|
26
26
|
}
|
|
27
27
|
render() {
|
|
28
|
-
return (h("input", { key: '
|
|
28
|
+
return (h("input", { key: '1b768d2d024a5482908316d7653bb02404332a64', id: "phone", type: "tel", class: "phone", value: this.phone, onInput: (event) => this.handleInput(event), placeholder: "(12) 94567-8910" }));
|
|
29
29
|
}
|
|
30
30
|
};
|
|
31
31
|
PhoneInputMask.style = phoneInputMaskCss;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"phone-input-mask.entry.esm.js","mappings":";;AAAA,MAAM,iBAAiB,GAAG,+zBAA+zB;;MCO50B,cAAc;;;qBACE,EAAE;;IAEnB,WAAW,CAAC,KAAa;QAC7B,MAAM,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC;QACzC,MAAM,KAAK,GAAG,OAAO,CAAC,KAAK,CAAC,+BAA+B,CAAC,CAAC;QAC7D,IAAI,CAAC,KAAK;YAAE,OAAO,KAAK,CAAC;QAEzB,MAAM,KAAK,GAAG,KAAK,CAAC,CAAC,CAAC,GAAG,IAAI,KAAK,CAAC,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC;QAC7C,MAAM,KAAK,GAAG,KAAK,CAAC,CAAC,CAAC,GAAG,KAAK,KAAK,CAAC,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC;QAC9C,MAAM,KAAK,GAAG,KAAK,CAAC,CAAC,CAAC,GAAG,IAAI,KAAK,CAAC,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC;QAE7C,OAAO,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,EAAE,CAAC;KACrC;IAEO,WAAW,CAAC,KAAY;QAC5B,MAAM,KAAK,GAAG,KAAK,CAAC,MAA0B,CAAC;QAC/C,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;KAC9C;IAGM,QAAQ;
|
|
1
|
+
{"file":"phone-input-mask.entry.esm.js","mappings":";;AAAA,MAAM,iBAAiB,GAAG,+zBAA+zB;;MCO50B,cAAc;;;qBACE,EAAE;;IAEnB,WAAW,CAAC,KAAa;QAC7B,MAAM,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC;QACzC,MAAM,KAAK,GAAG,OAAO,CAAC,KAAK,CAAC,+BAA+B,CAAC,CAAC;QAC7D,IAAI,CAAC,KAAK;YAAE,OAAO,KAAK,CAAC;QAEzB,MAAM,KAAK,GAAG,KAAK,CAAC,CAAC,CAAC,GAAG,IAAI,KAAK,CAAC,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC;QAC7C,MAAM,KAAK,GAAG,KAAK,CAAC,CAAC,CAAC,GAAG,KAAK,KAAK,CAAC,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC;QAC9C,MAAM,KAAK,GAAG,KAAK,CAAC,CAAC,CAAC,GAAG,IAAI,KAAK,CAAC,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC;QAE7C,OAAO,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,EAAE,CAAC;KACrC;IAEO,WAAW,CAAC,KAAY;QAC5B,MAAM,KAAK,GAAG,KAAK,CAAC,MAA0B,CAAC;QAC/C,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;KAC9C;IAGM,MAAM,QAAQ;QACjB,OAAO,IAAI,CAAC,KAAK,CAAC;KACrB;IAED,MAAM;QACF,QACI,8DACI,EAAE,EAAC,OAAO,EACV,IAAI,EAAC,KAAK,EACV,KAAK,EAAC,OAAO,EACb,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,OAAO,EAAE,CAAC,KAAK,KAAK,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,EAC3C,WAAW,EAAC,iBAAiB,GAC/B,EACJ;KACL;;;;;;","names":[],"sources":["src/components/phone/phone-input-mask.css?tag=phone-input-mask&encapsulation=shadow","src/components/phone/phone-input-mask.tsx"],"sourcesContent":[".inline-text-field-container {\n display: flex;\n flex-direction: column;\n}\n\n@supports (top: max(0%)) {\n .mdc-text-field--outlined {\n padding-right: max(16px, var(--mdc-shape-small, 4px));\n }\n}\n\n@supports (top: max(0%)) {\n .mdc-text-field--outlined {\n padding-left: max(16px, calc(var(--mdc-shape-small, 4px) + 4px));\n }\n}\n\n.mdc-text-field--outlined {\n height: 55px;\n overflow: visible;\n}\n\n.phone {\n width: 300px;\n height: 50px;\n font-size: 18px;\n padding: 10px;\n color: grey;\n border: 1px solid #d3c6c6;\n outline: none;\n}\n\n.mdc-text-field {\n border-top-left-radius: 4px;\n border-top-left-radius: var(--mdc-shape-small, 4px);\n border-top-right-radius: 4px;\n border-top-right-radius: var(--mdc-shape-small, 4px);\n border-bottom-right-radius: 0;\n border-bottom-left-radius: 0;\n display: inline-flex;\n align-items: baseline;\n padding: 0 16px;\n position: relative;\n box-sizing: border-box;\n overflow: hidden;\n will-change: opacity, transform, color;\n}","import { Component, h, Method, State } from '@stencil/core';\n\n@Component({\n tag: 'phone-input-mask',\n styleUrl: 'phone-input-mask.css',\n shadow: true,\n})\nexport class PhoneInputMask {\n @State() phone: string = '';\n\n private formatPhone(value: string): string {\n const cleaned = value.replace(/\\D/g, ''); // Remove tudo que não for número\n const match = cleaned.match(/^(\\d{0,2})(\\d{0,5})(\\d{0,4})$/);\n if (!match) return value;\n\n const part1 = match[1] ? `(${match[1]}` : '';\n const part2 = match[2] ? `) ${match[2]}` : '';\n const part3 = match[3] ? `-${match[3]}` : '';\n\n return `${part1}${part2}${part3}`;\n }\n\n private handleInput(event: Event): void {\n const input = event.target as HTMLInputElement;\n this.phone = this.formatPhone(input.value);\n }\n\n @Method()\n public async getPhone() {\n return this.phone;\n }\n\n render() {\n return (\n <input\n id=\"phone\"\n type=\"tel\"\n class=\"phone\"\n value={this.phone}\n onInput={(event) => this.handleInput(event)}\n placeholder=\"(12) 94567-8910\"\n />\n );\n }\n}\n"],"version":3}
|