crmbonus-component-wake 2.1.22-homolog-tray → 2.1.23-local

package/dist/collection/components/_crm-bonus-form/subcomponents/giftback-progress/giftback-progress.css

@@ -1,109 +1,109 @@
-:host {
-    display: flex;
-    /* background-color: #f8f4eb; */
-    border-radius: 10px;
-    padding: 16px;
-    /* box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); */
-    max-width: 100%;
-    flex-direction: column;
-}
-
-.giftback-container {
-    display: flex;
-    flex-direction: column;
-}
-
-.giftback-container p {
-    /* font-size: medium; */
-}
-
-
-h3 {
-    margin: 0 0 10px;
-    /* font-size: 18px; */
-}
-
-p {
-    margin: 5px 0;
-    /* font-size: 14px; */
-    align-self: start;
-}
-
-.validity {
-    /* font-size: 12px; */
-    color: #888;
-}
-
-.progress-container {
-    display: flex;
-    align-items: center;
-    margin: 10px 0;
-}
-
-progress-container span {
-    /* font-size: 12px; */
-    color: #666;
-}
-
-input[type='range'] {
-    flex: 1;
-    margin: 0 10px;
-    appearance: none;
-    background-color: #ccc;
-    height: 6px;
-    border-radius: 3px;
-    outline: none;
-    cursor: pointer;
-}
-
-input[type='range']::-webkit-slider-thumb {
-    appearance: none;
-    width: 14px;
-    height: 14px;
-    border-radius: 50%;
-    background-color: #555;
-    cursor: pointer;
-}
-
-.remaining {
-    font-weight: bold;
-    /* font-size: 14px; */
-    color: #333;
-}
-
-.button {
-    top: 50%;
-    background-color: #6c6c7e;
-    color: #fff;
-    border: none;
-    border-radius: 10px;
-    padding: 10px;
-    min-height: 30px;
-    min-width: 120px;
-    /* font-size: 19px; */
-    cursor: pointer;
-}
-
-.button-cancel {
-    top: 50%;
-    background-color: #ffffff;
-    color: #1e1c1c;
-    border: 1px solid gray;
-    border-radius: 10px;
-    padding: 10px;
-    min-height: 30px;
-    min-width: 120px;
-    /* font-size: 19px; */
-    cursor: pointer;
-}
-
-.disabled {
-    opacity: 0.6;
-    cursor: not-allowed;
-}
-
-.footer-button-giftback {
-    display: flex;
-    justify-content: space-between;
-    margin-top: 14px;
+:host {
+    display: flex;
+    /* background-color: #f8f4eb; */
+    border-radius: 10px;
+    padding: 16px;
+    /* box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); */
+    max-width: 100%;
+    flex-direction: column;
+}
+
+.giftback-container {
+    display: flex;
+    flex-direction: column;
+}
+
+.giftback-container p {
+    /* font-size: medium; */
+}
+
+
+h3 {
+    margin: 0 0 10px;
+    /* font-size: 18px; */
+}
+
+p {
+    margin: 5px 0;
+    /* font-size: 14px; */
+    align-self: start;
+}
+
+.validity {
+    /* font-size: 12px; */
+    color: #888;
+}
+
+.progress-container {
+    display: flex;
+    align-items: center;
+    margin: 10px 0;
+}
+
+progress-container span {
+    /* font-size: 12px; */
+    color: #666;
+}
+
+input[type='range'] {
+    flex: 1;
+    margin: 0 10px;
+    appearance: none;
+    background-color: #ccc;
+    height: 6px;
+    border-radius: 3px;
+    outline: none;
+    cursor: pointer;
+}
+
+input[type='range']::-webkit-slider-thumb {
+    appearance: none;
+    width: 14px;
+    height: 14px;
+    border-radius: 50%;
+    background-color: #555;
+    cursor: pointer;
+}
+
+.remaining {
+    font-weight: bold;
+    /* font-size: 14px; */
+    color: #333;
+}
+
+.button {
+    top: 50%;
+    background-color: #6c6c7e;
+    color: #fff;
+    border: none;
+    border-radius: 10px;
+    padding: 10px;
+    min-height: 30px;
+    min-width: 120px;
+    /* font-size: 19px; */
+    cursor: pointer;
+}
+
+.button-cancel {
+    top: 50%;
+    background-color: #ffffff;
+    color: #1e1c1c;
+    border: 1px solid gray;
+    border-radius: 10px;
+    padding: 10px;
+    min-height: 30px;
+    min-width: 120px;
+    /* font-size: 19px; */
+    cursor: pointer;
+}
+
+.disabled {
+    opacity: 0.6;
+    cursor: not-allowed;
+}
+
+.footer-button-giftback {
+    display: flex;
+    justify-content: space-between;
+    margin-top: 14px;
 }

package/dist/collection/components/_crm-bonus-form/subcomponents/giftback-progress/giftback-progress.js

@@ -26,7 +26,7 @@ export class GiftbackProgress {
     }
     render() {
         const remainingGiftback = this.bonus.minimumPurchase - this.bonus.totalValue;
-        return (h("div", { key: 'c1680dc6ea2d0c11e850bf9d6d17154463012f2e', class: "giftback-container" }, h("p", { key: '6ec6b57b186af3e62ebd4cd3a4064c971533f573' }, "Voc\u00EA possui at\u00E9 ", h("strong", { key: 'e53a6abaf90459c8be4adf32a835f61abf283737' }, "R$ ", this.bonus.totalBonus.toFixed(2)), " de Giftback nessa compra!"), h("p", { key: '3fd4f5ea5f5a1938cf98b9d5aa998bd38c9bcf71', class: "validity" }, "V\u00E1lido at\u00E9: ", new Date(this.bonus.firstValidityDate).toLocaleDateString('pt-Br')), h("p", { key: 'c27d0b1880d1508006a62ceed34a1b4e49191622' }, "Voc\u00EA est\u00E1 utilizando ", h("strong", { key: '88bd223bf1e426cb15c2c79e1c01b1cdb0a087d7' }, "R$ ", this.usedValue.toFixed(2)), " nessa compra"), h("div", { key: 'c64d835dd75fce0cde17c56d79e5acc8c863a4c8', class: "progress-container" }, h("span", { key: 'f172eec3888deb302476d673dff783de8dbc9d9e' }, "R$ 0"), h("input", { key: '91f44e02cb55a9ea0754607e2c81304470d44129', disabled: true, type: "range", min: "0", step: "0.01", max: this.bonus.totalBonus, value: this.usedValue, onInput: (event) => this.handleSliderChange(event) }), h("span", { key: '39c34000013b29ee2a5ced46c87e75acd8f0ccb2' }, "R$ ", this.bonus.totalBonus.toFixed(2))), h("p", { key: '027d3d6d7cb51a5b3ac6779273fc4e922e67ac6b', class: "remaining" }, "Faltam ", h("strong", { key: '979b7e9fdcfe1b3220f5fa6e76bc2daaa662c59c' }, "R$ ", remainingGiftback > 0 ? remainingGiftback.toFixed(2) : Number(0).toFixed(2)), " para utilizar o valor total do Giftback."), h("div", { key: 'dc966024c72ff82b941ac70483fb93aec926049c', class: "footer-button-giftback" }, h("button", { key: 'f68f1f00a82bb9bed9a7b3419d04056cee02244c', class: "button-cancel", disabled: this.loading, onClick: () => this.cancel() }, "Cancelar"), h("button", { key: 'e4218c2baec40e7799391a53795465f58be263e6', class: `button ${this.loading ? 'disabled' : ''} `, disabled: this.loading, onClick: () => this.handleReserve(this.usedValue) }, !this.loading ? "Aplicar" : h("loading-spinner", { size: "10px", color: "#fff" })))));
+        return (h("div", { key: '59d859108264c1a84e90e7752747ed31779b1830', class: "giftback-container" }, h("p", { key: 'c9335b66d2b28e44681777c853ec52ab0135e16f' }, "Voc\u00EA possui at\u00E9 ", h("strong", { key: '160029d8ad4b5c11d840243ca895d27fbcbee5a9' }, "R$ ", this.bonus.totalBonus.toFixed(2)), " de Giftback nessa compra!"), h("p", { key: '5f81b5b7b45241fe5f6ff1720c3833082c4703ea', class: "validity" }, "V\u00E1lido at\u00E9: ", new Date(this.bonus.firstValidityDate).toLocaleDateString('pt-Br')), h("p", { key: 'eb0a0cb8d5015a7ecb6ae7cf12049f5edcd63e9c' }, "Voc\u00EA est\u00E1 utilizando ", h("strong", { key: 'f0106bfb69bbdff8b21d566cefd92c242e47ad7c' }, "R$ ", this.usedValue.toFixed(2)), " nessa compra"), h("div", { key: 'e9018ad33cc33fad3fa68708a7faf58e303d87da', class: "progress-container" }, h("span", { key: '158ed756a190bbea2b1bfe54fe1eb9185f81a172' }, "R$ 0"), h("input", { key: '8a932c663702fa7be590f055773d19bc796799ac', disabled: true, type: "range", min: "0", step: "0.01", max: this.bonus.totalBonus, value: this.usedValue, onInput: (event) => this.handleSliderChange(event) }), h("span", { key: '4b6ed89646ddc6b0003385e6ea4e2fe34a16f480' }, "R$ ", this.bonus.totalBonus.toFixed(2))), h("p", { key: 'b17882427b521344934412cf5b1c1fd97e58cd8d', class: "remaining" }, "Faltam ", h("strong", { key: '4d0a31a77f050975578312fa356da9b8ac6f5ee6' }, "R$ ", remainingGiftback > 0 ? remainingGiftback.toFixed(2) : Number(0).toFixed(2)), " para utilizar o valor total do Giftback."), h("div", { key: '744157790d538c711b49d04ae9da30140c01288e', class: "footer-button-giftback" }, h("button", { key: '9b4dc8e20b5f243db4aefe5bb5722ceb512acaca', class: "button-cancel", disabled: this.loading, onClick: () => this.cancel() }, "Cancelar"), h("button", { key: '50491467550f5c89b9e60689c69773157f7e3e05', class: `button ${this.loading ? 'disabled' : ''} `, disabled: this.loading, onClick: () => this.handleReserve(this.usedValue) }, !this.loading ? "Aplicar" : h("loading-spinner", { size: "10px", color: "#fff" })))));
     }
     static get is() { return "giftback-progress"; }
     static get encapsulation() { return "shadow"; }
@@ -84,7 +84,7 @@ export class GiftbackProgress {
                     "tags": [],
                     "text": ""
                 },
-                "defaultValue": "{\n        totalBonus: 0,\n        cartId: \"\",\n        minimumPurchase: 0,\n        bonusBalance: 0,\n        calculatedValue: 0,\n        firstValidityDate: \"\"\n    }"
+                "defaultValue": "{\r\n        totalBonus: 0,\r\n        cartId: \"\",\r\n        minimumPurchase: 0,\r\n        bonusBalance: 0,\r\n        calculatedValue: 0,\r\n        firstValidityDate: \"\"\r\n    }"
             },
             "reserve": {
                 "type": "unknown",

package/dist/collection/components/_crm-bonus-form/subcomponents/giftback-progress/giftback-progress.js.map

@@ -1 +1 @@
-{"version":3,"file":"giftback-progress.js","sourceRoot":"","sources":["../../../../../../src/components/_crm-bonus-form/subcomponents/giftback-progress/giftback-progress.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, State, Prop } from '@stencil/core';\nimport { IBonus } from '../../../../dto/validate.pin.bonus';\n\n@Component({\n    tag: 'giftback-progress',\n    styleUrl: 'giftback-progress.css',\n    shadow: true,\n})\nexport class GiftbackProgress {\n    @State() usedValue: number = 0;\n\n    @Prop() loading: boolean = false;\n\n    @Prop() bonus: Partial<IBonus> = {\n        totalBonus: 0,\n        cartId: \"\",\n        minimumPurchase: 0,\n        bonusBalance: 0,\n        calculatedValue: 0,\n        firstValidityDate: \"\"\n    };\n\n    @Prop() reserve: (amountRedeemed: number) => void;\n    @Prop() cancel: () => void;\n\n    componentWillLoad() {\n        this.usedValue = parseFloat(this.bonus.bonusBalance.toString());\n    }\n\n    handleSliderChange(event: Event) {\n        const input = event.target as HTMLInputElement;\n        this.usedValue = parseFloat(input.value);\n    }\n\n    async handleReserve(value: number) {\n        this.reserve(value);\n    }\n\n    render() {\n        const remainingGiftback = this.bonus.minimumPurchase - this.bonus.totalValue;\n\n        return (\n            <div class=\"giftback-container\">\n                <p>\n                    Você possui até <strong>R$ {this.bonus.totalBonus.toFixed(2)}</strong> de Giftback nessa compra!\n                </p>\n                <p class=\"validity\">Válido até: {new Date(this.bonus.firstValidityDate).toLocaleDateString('pt-Br')}</p>\n\n                <p>Você está utilizando <strong>R$ {this.usedValue.toFixed(2)}</strong> nessa compra</p>\n\n                <div class=\"progress-container\">\n                    <span>R$ 0</span>\n                    <input\n                        disabled\n                        type=\"range\"\n                        min=\"0\"\n                        step=\"0.01\"\n                        max={this.bonus.totalBonus}\n                        value={this.usedValue}\n                        onInput={(event) => this.handleSliderChange(event)}\n                    />\n                    <span>R$ {this.bonus.totalBonus.toFixed(2)}</span>\n                </div>\n\n                <p class=\"remaining\">\n                    Faltam <strong>R$ {remainingGiftback > 0 ? remainingGiftback.toFixed(2) : Number(0).toFixed(2)}</strong> para utilizar o valor total do Giftback.\n                </p>\n\n                <div class=\"footer-button-giftback\">\n\n                    <button class=\"button-cancel\" disabled={this.loading} onClick={() => this.cancel()} >\n                        Cancelar\n                    </button>\n\n                    <button class={`button ${this.loading ? 'disabled' : ''} `} disabled={this.loading} onClick={() => this.handleReserve(this.usedValue)}>\n                        {\n                            !this.loading ? \"Aplicar\" : <loading-spinner size=\"10px\" color=\"#fff\" />\n                        }\n                    </button>\n                </div>\n            </div>\n        );\n    }\n}\n"]}
+{"version":3,"file":"giftback-progress.js","sourceRoot":"","sources":["../../../../../../src/components/_crm-bonus-form/subcomponents/giftback-progress/giftback-progress.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAQ1D,MAAM,OAAO,gBAAgB;;yBACI,CAAC;uBAEH,KAAK;qBAEC;YAC7B,UAAU,EAAE,CAAC;YACb,MAAM,EAAE,EAAE;YACV,eAAe,EAAE,CAAC;YAClB,YAAY,EAAE,CAAC;YACf,eAAe,EAAE,CAAC;YAClB,iBAAiB,EAAE,EAAE;SACxB;;;;IAKD,iBAAiB;QACb,IAAI,CAAC,SAAS,GAAG,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,QAAQ,EAAE,CAAC,CAAC;IACpE,CAAC;IAED,kBAAkB,CAAC,KAAY;QAC3B,MAAM,KAAK,GAAG,KAAK,CAAC,MAA0B,CAAC;QAC/C,IAAI,CAAC,SAAS,GAAG,UAAU,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;IAC7C,CAAC;IAED,KAAK,CAAC,aAAa,CAAC,KAAa;QAC7B,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;IACxB,CAAC;IAED,MAAM;QACF,MAAM,iBAAiB,GAAG,IAAI,CAAC,KAAK,CAAC,eAAe,GAAG,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC;QAE7E,OAAO,CACH,4DAAK,KAAK,EAAC,oBAAoB;YAC3B;;gBACoB;;oBAAY,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC,CAAC,CAAU;6CACtE;YACJ,0DAAG,KAAK,EAAC,UAAU;;gBAAc,IAAI,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,iBAAiB,CAAC,CAAC,kBAAkB,CAAC,OAAO,CAAC,CAAK;YAExG;;gBAAwB;;oBAAY,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC,CAAU;gCAAiB;YAExF,4DAAK,KAAK,EAAC,oBAAoB;gBAC3B,sEAAiB;gBACjB,8DACI,QAAQ,QACR,IAAI,EAAC,OAAO,EACZ,GAAG,EAAC,GAAG,EACP,IAAI,EAAC,MAAM,EACX,GAAG,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,EAC1B,KAAK,EAAE,IAAI,CAAC,SAAS,EACrB,OAAO,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,IAAI,CAAC,kBAAkB,CAAC,KAAK,CAAC,GACpD;gBACF;;oBAAU,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC,CAAC,CAAQ,CAChD;YAEN,0DAAG,KAAK,EAAC,WAAW;;gBACT;;oBAAY,iBAAiB,GAAG,CAAC,CAAC,CAAC,CAAC,iBAAiB,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAU;4DACxG;YAEJ,4DAAK,KAAK,EAAC,wBAAwB;gBAE/B,+DAAQ,KAAK,EAAC,eAAe,EAAC,QAAQ,EAAE,IAAI,CAAC,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,MAAM,EAAE,eAEzE;gBAET,+DAAQ,KAAK,EAAE,UAAU,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,GAAG,EAAE,QAAQ,EAAE,IAAI,CAAC,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,SAAS,CAAC,IAE7H,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,uBAAiB,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,MAAM,GAAG,CAEvE,CACP,CACJ,CACT,CAAC;IACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, h, State, Prop } from '@stencil/core';\r\nimport { IBonus } from '../../../../dto/validate.pin.bonus';\r\n\r\n@Component({\r\n    tag: 'giftback-progress',\r\n    styleUrl: 'giftback-progress.css',\r\n    shadow: true,\r\n})\r\nexport class GiftbackProgress {\r\n    @State() usedValue: number = 0;\r\n\r\n    @Prop() loading: boolean = false;\r\n\r\n    @Prop() bonus: Partial<IBonus> = {\r\n        totalBonus: 0,\r\n        cartId: \"\",\r\n        minimumPurchase: 0,\r\n        bonusBalance: 0,\r\n        calculatedValue: 0,\r\n        firstValidityDate: \"\"\r\n    };\r\n\r\n    @Prop() reserve: (amountRedeemed: number) => void;\r\n    @Prop() cancel: () => void;\r\n\r\n    componentWillLoad() {\r\n        this.usedValue = parseFloat(this.bonus.bonusBalance.toString());\r\n    }\r\n\r\n    handleSliderChange(event: Event) {\r\n        const input = event.target as HTMLInputElement;\r\n        this.usedValue = parseFloat(input.value);\r\n    }\r\n\r\n    async handleReserve(value: number) {\r\n        this.reserve(value);\r\n    }\r\n\r\n    render() {\r\n        const remainingGiftback = this.bonus.minimumPurchase - this.bonus.totalValue;\r\n\r\n        return (\r\n            <div class=\"giftback-container\">\r\n                <p>\r\n                    Você possui até <strong>R$ {this.bonus.totalBonus.toFixed(2)}</strong> de Giftback nessa compra!\r\n                </p>\r\n                <p class=\"validity\">Válido até: {new Date(this.bonus.firstValidityDate).toLocaleDateString('pt-Br')}</p>\r\n\r\n                <p>Você está utilizando <strong>R$ {this.usedValue.toFixed(2)}</strong> nessa compra</p>\r\n\r\n                <div class=\"progress-container\">\r\n                    <span>R$ 0</span>\r\n                    <input\r\n                        disabled\r\n                        type=\"range\"\r\n                        min=\"0\"\r\n                        step=\"0.01\"\r\n                        max={this.bonus.totalBonus}\r\n                        value={this.usedValue}\r\n                        onInput={(event) => this.handleSliderChange(event)}\r\n                    />\r\n                    <span>R$ {this.bonus.totalBonus.toFixed(2)}</span>\r\n                </div>\r\n\r\n                <p class=\"remaining\">\r\n                    Faltam <strong>R$ {remainingGiftback > 0 ? remainingGiftback.toFixed(2) : Number(0).toFixed(2)}</strong> para utilizar o valor total do Giftback.\r\n                </p>\r\n\r\n                <div class=\"footer-button-giftback\">\r\n\r\n                    <button class=\"button-cancel\" disabled={this.loading} onClick={() => this.cancel()} >\r\n                        Cancelar\r\n                    </button>\r\n\r\n                    <button class={`button ${this.loading ? 'disabled' : ''} `} disabled={this.loading} onClick={() => this.handleReserve(this.usedValue)}>\r\n                        {\r\n                            !this.loading ? \"Aplicar\" : <loading-spinner size=\"10px\" color=\"#fff\" />\r\n                        }\r\n                    </button>\r\n                </div>\r\n            </div>\r\n        );\r\n    }\r\n}\r\n"]}

package/dist/collection/components/_crm-bonus-form/subcomponents/name-input/name-input.css

@@ -1,108 +1,108 @@
-.bc-form-control {
-    display: block;
-    width: 90%;
-    height: 24px;
-    padding: 7px 18px;
-    /* font-size: 14px; */
-    line-height: 1.42857143;
-    color: #555;
-    background-color: #fff;
-    background-image: none;
-    border: 1px solid #ccc;
-    border-radius: 0px;
-    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
-    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
-    -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
-    -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
-    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
-}
-
-.bc-btn {
-    display: inline-block;
-    padding: 6px 12px;
-    margin-bottom: 0;
-    /* font-size: 14px; */
-    font-weight: 400;
-    line-height: 1.42857143;
-    text-align: center;
-    white-space: nowrap;
-    vertical-align: middle;
-    -ms-touch-action: manipulation;
-    touch-action: manipulation;
-    cursor: pointer;
-    -webkit-user-select: none;
-    -moz-user-select: none;
-    -ms-user-select: none;
-    user-select: none;
-    background-image: none;
-    border: 1px solid transparent;
-    border-radius: 0px;
-}
-
-.bc-btn-process {
-    background: #00162e;
-    border-color: #00162e;
-    width: 30%;
-    color: #fff;
-}
-
-.bc-footer-btn {
-    display: flex;
-    justify-content: end;
-    margin: 11px;
-}
-
-.name-container {
-    font-weight: bold;
-    color: #494545;
-}
-
-
-button {
-    padding: 10px 20px;
-    background-color: #ddd;
-    border: none;
-    border-radius: 5px;
-    cursor: pointer;
-}
-
-button:hover {
-    background-color: #bbb;
-}
-
-.success {
-    color: green;
-    margin-top: 10px;
-}
-
-.button {
-    top: 50%;
-    background-color: #6c6c7e;
-    color: #fff;
-    border: none;
-    border-radius: 10px;
-    padding: 11px;
-    min-width: 120px;
-    /* font-size: 20px; */
-    cursor: pointer;
-}
-
-.button-cancel {
-    top: 50%;
-    background-color: #ffffff;
-    color: #1e1c1c;
-    border: 1px solid gray;
-    border-radius: 10px;
-    padding: 10px;
-    min-height: 30px;
-    min-width: 120px;
-    /* font-size: 19px; */
-    cursor: pointer;
-}
-
-.footer-button {
-    display: flex;
-    justify-content: space-between;
-    width: 97%;
-    margin-top: 14px;
+.bc-form-control {
+    display: block;
+    width: 90%;
+    height: 24px;
+    padding: 7px 18px;
+    /* font-size: 14px; */
+    line-height: 1.42857143;
+    color: #555;
+    background-color: #fff;
+    background-image: none;
+    border: 1px solid #ccc;
+    border-radius: 0px;
+    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
+    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
+    -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
+    -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
+    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
+}
+
+.bc-btn {
+    display: inline-block;
+    padding: 6px 12px;
+    margin-bottom: 0;
+    /* font-size: 14px; */
+    font-weight: 400;
+    line-height: 1.42857143;
+    text-align: center;
+    white-space: nowrap;
+    vertical-align: middle;
+    -ms-touch-action: manipulation;
+    touch-action: manipulation;
+    cursor: pointer;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    background-image: none;
+    border: 1px solid transparent;
+    border-radius: 0px;
+}
+
+.bc-btn-process {
+    background: #00162e;
+    border-color: #00162e;
+    width: 30%;
+    color: #fff;
+}
+
+.bc-footer-btn {
+    display: flex;
+    justify-content: end;
+    margin: 11px;
+}
+
+.name-container {
+    font-weight: bold;
+    color: #494545;
+}
+
+
+button {
+    padding: 10px 20px;
+    background-color: #ddd;
+    border: none;
+    border-radius: 5px;
+    cursor: pointer;
+}
+
+button:hover {
+    background-color: #bbb;
+}
+
+.success {
+    color: green;
+    margin-top: 10px;
+}
+
+.button {
+    top: 50%;
+    background-color: #6c6c7e;
+    color: #fff;
+    border: none;
+    border-radius: 10px;
+    padding: 11px;
+    min-width: 120px;
+    /* font-size: 20px; */
+    cursor: pointer;
+}
+
+.button-cancel {
+    top: 50%;
+    background-color: #ffffff;
+    color: #1e1c1c;
+    border: 1px solid gray;
+    border-radius: 10px;
+    padding: 10px;
+    min-height: 30px;
+    min-width: 120px;
+    /* font-size: 19px; */
+    cursor: pointer;
+}
+
+.footer-button {
+    display: flex;
+    justify-content: space-between;
+    width: 97%;
+    margin-top: 14px;
 }

package/dist/collection/components/_crm-bonus-form/subcomponents/name-input/name-input.js

@@ -19,7 +19,7 @@ export class NameInput {
         this.applyName(name);
     }
     render() {
-        return (h("div", { key: 'e7340de629d6b39389a55b1b93e85ff9481fe635', class: "name-container" }, h("p", { key: '1b8306842614d144b9776956053828f23adfa3ab' }, "Seu Nome:"), h("input", { key: 'eb92740ed0fc8f56f4dc2d6af0fc47c083bb1368', class: "bc-form-control", type: "text", value: this.value, onChange: (event) => this.handleChangeName(event) }), h("p", { key: 'c184767bc91444cb357e3103a909186fa8223d56' }, this.message), h("div", { key: '80b817a03faa730519ddd3d1e61a227ead8a90cf', class: "footer-button" }, h("button", { key: '4863eed4addae2d3dee9ee415e8797cabf7b054c', class: "button-cancel", disabled: this.loading, onClick: () => this.cancel() }, "Cancelar"), h("button", { key: 'b50b5919b0db45d13abc7d968baba4e8616e9ed5', class: `button ${this.loading ? 'disabled' : ''} `, disabled: this.loading, onClick: () => this.handleSetName(this.newValue) }, !this.loading ? "Continua" : h("loading-spinner", { size: "15px", color: "#fff" })))));
+        return (h("div", { key: '5cbd25af143ea45b2358effb448d920d9a9abfb4', class: "name-container" }, h("p", { key: 'e277b2345070c4eb6614f45aa8730fd4332938de' }, "Seu Nome:"), h("input", { key: 'b8b1dcf61f07a7a28491288aae58374c2a15bd5a', class: "bc-form-control", type: "text", value: this.value, onChange: (event) => this.handleChangeName(event) }), h("p", { key: '657756c09c431d649fc72a06b50591687c8753d2' }, this.message), h("div", { key: 'c2b13c2f44925723fd271709b125d785d46b34a3', class: "footer-button" }, h("button", { key: 'e58913207a82be6469adf58a337e9cd15914f623', class: "button-cancel", disabled: this.loading, onClick: () => this.cancel() }, "Cancelar"), h("button", { key: '816ef162682b36801651148c380f13c69221f830', class: `button ${this.loading ? 'disabled' : ''} `, disabled: this.loading, onClick: () => this.handleSetName(this.newValue) }, !this.loading ? "Continua" : h("loading-spinner", { size: "15px", color: "#fff" })))));
     }
     static get is() { return "name-input"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/_crm-bonus-form/subcomponents/name-input/name-input.js.map

@@ -1 +1 @@
-{"version":3,"file":"name-input.js","sourceRoot":"","sources":["../../../../../../src/components/_crm-bonus-form/subcomponents/name-input/name-input.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAO1D,MAAM,OAAO,SAAS;;;;;;;;;IAWlB,gBAAgB,CAAC,KAAU;QACvB,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;IACvC,CAAC;IAGD,aAAa,CAAC,IAAY;QACtB,IAAG,CAAC,IAAI,EAAE,CAAC;YACP,IAAI,CAAC,OAAO,GAAG,kBAAkB,CAAC;YAClC,OAAM;QACV,CAAC;QAED,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC;IACzB,CAAC;IAED,MAAM;QACF,OAAO,CACH,4DAAK,KAAK,EAAC,gBAAgB;YACvB,wEAAgB;YAChB,8DAAO,KAAK,EAAC,iBAAiB,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,IAAI,CAAC,gBAAgB,CAAC,KAAK,CAAC,GAAI;YAEnH,4DAAK,IAAI,CAAC,OAAO,CAAM;YAMvB,4DAAK,KAAK,EAAC,eAAe;gBACtB,+DAAQ,KAAK,EAAC,eAAe,EAAC,QAAQ,EAAE,IAAI,CAAC,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,MAAM,EAAE,eAEzE;gBACT,+DAAQ,KAAK,EAAE,UAAU,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,GAAG,EAAE,QAAQ,EAAE,IAAI,CAAC,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,QAAQ,CAAC,IAE5H,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,uBAAiB,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,MAAM,GAAG,CAExE,CACP,CACJ,CACT,CAAA;IACL,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Prop, State, h } from \"@stencil/core\";\n\n@Component({\n    tag: 'name-input',\n    styleUrl: 'name-input.css',\n    shadow: true\n})\nexport class NameInput {\n\n    @Prop() value: string;\n\n    @Prop() loading: boolean;\n    @Prop() applyName: (value: string) => void;\n    @Prop() cancel: () => void;\n    \n    @State() newValue: string;\n    @State() message: string;\n\n    handleChangeName(event: any) {\n        this.newValue = event.target.value;\n    }\n\n\n    handleSetName(name: string) {\n        if(!name) {\n            this.message = \"Informe seu nome\";\n            return\n        }\n\n        this.applyName(name);\n    }\n\n    render() {\n        return (\n            <div class=\"name-container\">\n                <p>Seu Nome:</p>\n                <input class=\"bc-form-control\" type=\"text\" value={this.value} onChange={(event) => this.handleChangeName(event)} />\n\n                <p>{ this.message }</p>\n\n                {/* <div class=\"bc-footer-btn\">\n                    <button class=\"bc-btn bc-btn-process\" onClick={() => this.applyName(this.newValue)} >Prosseguir</button>\n                </div> */}\n\n                <div class=\"footer-button\">\n                    <button class=\"button-cancel\" disabled={this.loading} onClick={() => this.cancel()}>\n                        Cancelar\n                    </button>\n                    <button class={`button ${this.loading ? 'disabled' : ''} `} disabled={this.loading} onClick={() => this.handleSetName(this.newValue)}>\n                        {\n                            !this.loading ? \"Continua\" : <loading-spinner size=\"15px\" color=\"#fff\" />\n                        }\n                    </button>\n                </div>\n            </div>\n        )\n    }\n}"]}
+{"version":3,"file":"name-input.js","sourceRoot":"","sources":["../../../../../../src/components/_crm-bonus-form/subcomponents/name-input/name-input.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAO1D,MAAM,OAAO,SAAS;;;;;;;;;IAWlB,gBAAgB,CAAC,KAAU;QACvB,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;IACvC,CAAC;IAGD,aAAa,CAAC,IAAY;QACtB,IAAG,CAAC,IAAI,EAAE,CAAC;YACP,IAAI,CAAC,OAAO,GAAG,kBAAkB,CAAC;YAClC,OAAM;QACV,CAAC;QAED,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC;IACzB,CAAC;IAED,MAAM;QACF,OAAO,CACH,4DAAK,KAAK,EAAC,gBAAgB;YACvB,wEAAgB;YAChB,8DAAO,KAAK,EAAC,iBAAiB,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,IAAI,CAAC,gBAAgB,CAAC,KAAK,CAAC,GAAI;YAEnH,4DAAK,IAAI,CAAC,OAAO,CAAM;YAMvB,4DAAK,KAAK,EAAC,eAAe;gBACtB,+DAAQ,KAAK,EAAC,eAAe,EAAC,QAAQ,EAAE,IAAI,CAAC,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,MAAM,EAAE,eAEzE;gBACT,+DAAQ,KAAK,EAAE,UAAU,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,GAAG,EAAE,QAAQ,EAAE,IAAI,CAAC,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,QAAQ,CAAC,IAE5H,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,uBAAiB,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,MAAM,GAAG,CAExE,CACP,CACJ,CACT,CAAA;IACL,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Prop, State, h } from \"@stencil/core\";\r\n\r\n@Component({\r\n    tag: 'name-input',\r\n    styleUrl: 'name-input.css',\r\n    shadow: true\r\n})\r\nexport class NameInput {\r\n\r\n    @Prop() value: string;\r\n\r\n    @Prop() loading: boolean;\r\n    @Prop() applyName: (value: string) => void;\r\n    @Prop() cancel: () => void;\r\n    \r\n    @State() newValue: string;\r\n    @State() message: string;\r\n\r\n    handleChangeName(event: any) {\r\n        this.newValue = event.target.value;\r\n    }\r\n\r\n\r\n    handleSetName(name: string) {\r\n        if(!name) {\r\n            this.message = \"Informe seu nome\";\r\n            return\r\n        }\r\n\r\n        this.applyName(name);\r\n    }\r\n\r\n    render() {\r\n        return (\r\n            <div class=\"name-container\">\r\n                <p>Seu Nome:</p>\r\n                <input class=\"bc-form-control\" type=\"text\" value={this.value} onChange={(event) => this.handleChangeName(event)} />\r\n\r\n                <p>{ this.message }</p>\r\n\r\n                {/* <div class=\"bc-footer-btn\">\r\n                    <button class=\"bc-btn bc-btn-process\" onClick={() => this.applyName(this.newValue)} >Prosseguir</button>\r\n                </div> */}\r\n\r\n                <div class=\"footer-button\">\r\n                    <button class=\"button-cancel\" disabled={this.loading} onClick={() => this.cancel()}>\r\n                        Cancelar\r\n                    </button>\r\n                    <button class={`button ${this.loading ? 'disabled' : ''} `} disabled={this.loading} onClick={() => this.handleSetName(this.newValue)}>\r\n                        {\r\n                            !this.loading ? \"Continua\" : <loading-spinner size=\"15px\" color=\"#fff\" />\r\n                        }\r\n                    </button>\r\n                </div>\r\n            </div>\r\n        )\r\n    }\r\n}"]}

package/dist/collection/components/_crm-bonus-form/subcomponents/phone/phone.input.js

@@ -10,7 +10,7 @@ export class PhoneInput {
         await this.sendPin(phone);
     }
     render() {
-        return (h("div", { key: '4b2f63715915ccb6f93280e58a3ff4cc7e33565f', class: "form-container" }, h("phone-input-mask", { key: '674a74515ad83198f23e969c21f8f19f2c359054', initialValue: this.value, ref: ref => this.phoneInputMask = ref }), h("button", { key: 'd5149879044c72b5a06780eb9a9aea05b0ad966a', class: `btn btn-success btnCrm ${this.loading ? 'disabled' : ''} `, disabled: this.loading, onClick: () => this.validatePhone() }, !this.loading ? "validar" : h("loading-spinner", { size: "11px", color: "#fff" }))));
+        return (h("div", { key: '044d8a3c65878d89149fe5090e091f26a7ba9c70', class: "form-container" }, h("phone-input-mask", { key: 'b5c8c42c5fad360bfb890945399bd52fa758a16c', initialValue: this.value, ref: ref => this.phoneInputMask = ref }), h("button", { key: '6a1b1a3bbaf8ad5dee8630f79753a2dcd77cb60a', class: `btn btn-success btnCrm ${this.loading ? 'disabled' : ''} `, disabled: this.loading, onClick: () => this.validatePhone() }, !this.loading ? "validar" : h("loading-spinner", { size: "11px", color: "#fff" }))));
     }
     static get is() { return "phone-input"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/_crm-bonus-form/subcomponents/phone/phone.input.js.map

@@ -1 +1 @@
-{"version":3,"file":"phone.input.js","sourceRoot":"","sources":["../../../../../../src/components/_crm-bonus-form/subcomponents/phone/phone.input.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAMnD,MAAM,OAAO,UAAU;;;;;;IAQnB,KAAK,CAAC,aAAa;QACf,MAAM,KAAK,GAAG,MAAM,IAAI,CAAC,cAAc,CAAC,QAAQ,EAAE,CAAC;QACnD,MAAM,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;IAC9B,CAAC;IAED,MAAM;QACF,OAAO,CACH,4DAAK,KAAK,EAAC,gBAAgB;YACvB,yEAAkB,YAAY,EAAE,IAAI,CAAC,KAAK,EAAE,GAAG,EAAE,GAAG,CAAC,EAAE,CAAC,IAAI,CAAC,cAAc,GAAG,GAAG,GAAI;YACrF,+DAAQ,KAAK,EAAE,0BAA0B,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,GAAG,EAAE,QAAQ,EAAE,IAAI,CAAC,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,aAAa,EAAE,IAE/H,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,uBAAiB,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,MAAM,GAAG,CAEvE,CACP,CACT,CAAA;IACL,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Prop, h } from \"@stencil/core\";\n\n@Component({\n    tag: 'phone-input',\n    shadow: true\n})\nexport class PhoneInput {\n\n    private phoneInputMask: HTMLPhoneInputMaskElement;\n\n    @Prop() sendPin: Function;\n    @Prop() loading: boolean;\n    @Prop() value: string;\n\n    async validatePhone() {\n        const phone = await this.phoneInputMask.getPhone();\n        await this.sendPin(phone);\n    }\n\n    render() {\n        return (\n            <div class=\"form-container\">\n                <phone-input-mask initialValue={this.value} ref={ref => this.phoneInputMask = ref} />\n                <button class={`btn btn-success btnCrm ${this.loading ? 'disabled' : ''} `} disabled={this.loading} onClick={() => this.validatePhone()}>\n                    {\n                        !this.loading ? \"validar\" : <loading-spinner size=\"11px\" color=\"#fff\" />\n                    }\n                </button>\n            </div>\n        )\n    }\n}"]}
+{"version":3,"file":"phone.input.js","sourceRoot":"","sources":["../../../../../../src/components/_crm-bonus-form/subcomponents/phone/phone.input.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAMnD,MAAM,OAAO,UAAU;;;;;;IAQnB,KAAK,CAAC,aAAa;QACf,MAAM,KAAK,GAAG,MAAM,IAAI,CAAC,cAAc,CAAC,QAAQ,EAAE,CAAC;QACnD,MAAM,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;IAC9B,CAAC;IAED,MAAM;QACF,OAAO,CACH,4DAAK,KAAK,EAAC,gBAAgB;YACvB,yEAAkB,YAAY,EAAE,IAAI,CAAC,KAAK,EAAE,GAAG,EAAE,GAAG,CAAC,EAAE,CAAC,IAAI,CAAC,cAAc,GAAG,GAAG,GAAI;YACrF,+DAAQ,KAAK,EAAE,0BAA0B,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,GAAG,EAAE,QAAQ,EAAE,IAAI,CAAC,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,aAAa,EAAE,IAE/H,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,uBAAiB,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,MAAM,GAAG,CAEvE,CACP,CACT,CAAA;IACL,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Prop, h } from \"@stencil/core\";\r\n\r\n@Component({\r\n    tag: 'phone-input',\r\n    shadow: true\r\n})\r\nexport class PhoneInput {\r\n\r\n    private phoneInputMask: HTMLPhoneInputMaskElement;\r\n\r\n    @Prop() sendPin: Function;\r\n    @Prop() loading: boolean;\r\n    @Prop() value: string;\r\n\r\n    async validatePhone() {\r\n        const phone = await this.phoneInputMask.getPhone();\r\n        await this.sendPin(phone);\r\n    }\r\n\r\n    render() {\r\n        return (\r\n            <div class=\"form-container\">\r\n                <phone-input-mask initialValue={this.value} ref={ref => this.phoneInputMask = ref} />\r\n                <button class={`btn btn-success btnCrm ${this.loading ? 'disabled' : ''} `} disabled={this.loading} onClick={() => this.validatePhone()}>\r\n                    {\r\n                        !this.loading ? \"validar\" : <loading-spinner size=\"11px\" color=\"#fff\" />\r\n                    }\r\n                </button>\r\n            </div>\r\n        )\r\n    }\r\n}"]}

package/dist/collection/components/_crm-bonus-form/subcomponents/phone-cancel/phone.cancel.input.js

@@ -10,7 +10,7 @@ export class PhoneCancelInput {
         await this.sendPin(phone);
     }
     render() {
-        return (h("div", { key: 'f7193a1738d8703d87a22a05247fbd98e1056c3e', class: "form-container" }, h("phone-input-mask", { key: '1fff9798c93f258b83be39b827565ab1c81ed41e', initialValue: `Valor aplicado R$ ${this.value}`, ref: ref => this.phoneInputMask = ref, disabled: true }), h("button", { key: 'ab8e0245f18b81531a2def44f69f6b4ddde8eb2a', class: `btn btn-success btnCrm ${this.loading ? 'disabled' : ''} `, disabled: this.loading, onClick: () => this.validatePhone() }, !this.loading ? "Cancelar" : h("loading-spinner", { size: "11px", color: "#fff" }))));
+        return (h("div", { key: 'c68967a705328ed9c1a637f6dd9fd26ce691eaa8', class: "form-container" }, h("phone-input-mask", { key: '699a1b03f73fcaf68e6b9688ef4263db839104dc', initialValue: `Valor aplicado R$ ${this.value}`, ref: ref => this.phoneInputMask = ref, disabled: true }), h("button", { key: 'f3d67ee7a5fbeb9ae34c18edc22faa029afe85f2', class: `btn btn-success btnCrm ${this.loading ? 'disabled' : ''} `, disabled: this.loading, onClick: () => this.validatePhone() }, !this.loading ? "Cancelar" : h("loading-spinner", { size: "11px", color: "#fff" }))));
     }
     static get is() { return "phone-cancel-input"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/_crm-bonus-form/subcomponents/phone-cancel/phone.cancel.input.js.map

@@ -1 +1 @@
-{"version":3,"file":"phone.cancel.input.js","sourceRoot":"","sources":["../../../../../../src/components/_crm-bonus-form/subcomponents/phone-cancel/phone.cancel.input.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAMnD,MAAM,OAAO,gBAAgB;;;;;;IAQzB,KAAK,CAAC,aAAa;QACf,MAAM,KAAK,GAAG,MAAM,IAAI,CAAC,cAAc,CAAC,QAAQ,EAAE,CAAC;QACnD,MAAM,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;IAC9B,CAAC;IAED,MAAM;QACF,OAAO,CACH,4DAAK,KAAK,EAAC,gBAAgB;YACvB,yEAAkB,YAAY,EAAE,qBAAqB,IAAI,CAAC,KAAK,EAAE,EAAE,GAAG,EAAE,GAAG,CAAC,EAAE,CAAC,IAAI,CAAC,cAAc,GAAG,GAAG,EAAE,QAAQ,EAAE,IAAI,GAAI;YAC5H,+DAAQ,KAAK,EAAE,0BAA0B,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,GAAG,EAAE,QAAQ,EAAE,IAAI,CAAC,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,aAAa,EAAE,IAE/H,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,uBAAiB,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,MAAM,GAAG,CAExE,CACP,CACT,CAAC;IACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Prop, h } from \"@stencil/core\";\n\n@Component({\n    tag: 'phone-cancel-input',\n    shadow: true\n})\nexport class PhoneCancelInput {\n\n    private phoneInputMask: HTMLPhoneInputMaskElement;\n\n    @Prop() sendPin: Function;\n    @Prop() loading: boolean;\n    @Prop() value: string;\n\n    async validatePhone() {\n        const phone = await this.phoneInputMask.getPhone();\n        await this.sendPin(phone);\n    }\n\n    render() {\n        return (\n            <div class=\"form-container\">\n                <phone-input-mask initialValue={`Valor aplicado R$ ${this.value}`} ref={ref => this.phoneInputMask = ref} disabled={true} />\n                <button class={`btn btn-success btnCrm ${this.loading ? 'disabled' : ''} `} disabled={this.loading} onClick={() => this.validatePhone()}>\n                    {\n                        !this.loading ? \"Cancelar\" : <loading-spinner size=\"11px\" color=\"#fff\" />\n                    }\n                </button>\n            </div>\n        );\n    }\n}"]}
+{"version":3,"file":"phone.cancel.input.js","sourceRoot":"","sources":["../../../../../../src/components/_crm-bonus-form/subcomponents/phone-cancel/phone.cancel.input.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAMnD,MAAM,OAAO,gBAAgB;;;;;;IAQzB,KAAK,CAAC,aAAa;QACf,MAAM,KAAK,GAAG,MAAM,IAAI,CAAC,cAAc,CAAC,QAAQ,EAAE,CAAC;QACnD,MAAM,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;IAC9B,CAAC;IAED,MAAM;QACF,OAAO,CACH,4DAAK,KAAK,EAAC,gBAAgB;YACvB,yEAAkB,YAAY,EAAE,qBAAqB,IAAI,CAAC,KAAK,EAAE,EAAE,GAAG,EAAE,GAAG,CAAC,EAAE,CAAC,IAAI,CAAC,cAAc,GAAG,GAAG,EAAE,QAAQ,EAAE,IAAI,GAAI;YAC5H,+DAAQ,KAAK,EAAE,0BAA0B,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,GAAG,EAAE,QAAQ,EAAE,IAAI,CAAC,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,aAAa,EAAE,IAE/H,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,uBAAiB,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,MAAM,GAAG,CAExE,CACP,CACT,CAAC;IACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Prop, h } from \"@stencil/core\";\r\n\r\n@Component({\r\n    tag: 'phone-cancel-input',\r\n    shadow: true\r\n})\r\nexport class PhoneCancelInput {\r\n\r\n    private phoneInputMask: HTMLPhoneInputMaskElement;\r\n\r\n    @Prop() sendPin: Function;\r\n    @Prop() loading: boolean;\r\n    @Prop() value: string;\r\n\r\n    async validatePhone() {\r\n        const phone = await this.phoneInputMask.getPhone();\r\n        await this.sendPin(phone);\r\n    }\r\n\r\n    render() {\r\n        return (\r\n            <div class=\"form-container\">\r\n                <phone-input-mask initialValue={`Valor aplicado R$ ${this.value}`} ref={ref => this.phoneInputMask = ref} disabled={true} />\r\n                <button class={`btn btn-success btnCrm ${this.loading ? 'disabled' : ''} `} disabled={this.loading} onClick={() => this.validatePhone()}>\r\n                    {\r\n                        !this.loading ? \"Cancelar\" : <loading-spinner size=\"11px\" color=\"#fff\" />\r\n                    }\r\n                </button>\r\n            </div>\r\n        );\r\n    }\r\n}"]}

package/dist/collection/components/button/crm-button.css

@@ -1,22 +1,22 @@
-input, button {
-    margin: 0;
-    padding: 10px; /* Ajuste o valor conforme necessário */
-}
-
-.crm-contaner-button {
-    height: auto;
-    width: auto;
-}
-
-.crm-button {
-    height: 48px;
-    width: 100%;
-    border: 1px solid #000;
-    padding: 14px 20px;
-    background-color: #000;
-    color: #fff;
-    /* font-size: 14px; */
-    line-height: 20px;
-    font-weight: 500;
-    cursor: pointer;
+input, button {
+    margin: 0;
+    padding: 10px; /* Ajuste o valor conforme necessário */
+}
+
+.crm-contaner-button {
+    height: auto;
+    width: auto;
+}
+
+.crm-button {
+    height: 48px;
+    width: 100%;
+    border: 1px solid #000;
+    padding: 14px 20px;
+    background-color: #000;
+    color: #fff;
+    /* font-size: 14px; */
+    line-height: 20px;
+    font-weight: 500;
+    cursor: pointer;
 }

package/dist/collection/components/button/index.js

@@ -6,7 +6,7 @@ export class Button {
         this.handleClick = undefined;
     }
     render() {
-        return (h("div", { key: '6fce890879cd807d0893166b22de304739e6dcd7', class: "crm-contaner-button" }, h("button", { key: '843f7745bf183fb7ad88e70a60f25ac462de4e84', class: "crm-button", onClick: () => this.handleClick() }, !this.loading ? this.txtBtn : h("loading-spinner", { size: "15px", color: "#fff" }))));
+        return (h("div", { key: '00732759335f3dedd853446aff46a18bfb05f6f5', class: "crm-contaner-button" }, h("button", { key: '9cdc1c8adfa2203fb0b4f4cb35f83bae779485a0', class: "crm-button", onClick: () => this.handleClick() }, !this.loading ? this.txtBtn : h("loading-spinner", { size: "15px", color: "#fff" }))));
     }
     static get is() { return "crm-button"; }
     static get originalStyleUrls() {

package/dist/collection/components/button/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/button/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAMnD,MAAM,OAAO,MAAM;;;;;;IAOf,MAAM;QACF,OAAO,CACH,4DAAK,KAAK,EAAC,qBAAqB;YAC5B,+DAAQ,KAAK,EAAC,YAAY,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE,IAEpD,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,uBAAiB,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,MAAM,GAAG,CAEzE,CACP,CACT,CAAA;IACL,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Prop, h } from \"@stencil/core\";\n\n@Component({\n    tag: 'crm-button',\n    styleUrl: 'crm-button.css'\n})\nexport class Button {\n\n    @Prop() txtBtn: string;\n    @Prop() loading: boolean;\n\n    @Prop() handleClick: () => void;\n\n    render() {\n        return (\n            <div class=\"crm-contaner-button\">\n                <button class=\"crm-button\" onClick={() => this.handleClick()}>\n                    {\n                        !this.loading ? this.txtBtn : <loading-spinner size=\"15px\" color=\"#fff\" />\n                    }\n                </button>\n            </div>\n        )\n    }\n}"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/button/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAMnD,MAAM,OAAO,MAAM;;;;;;IAOf,MAAM;QACF,OAAO,CACH,4DAAK,KAAK,EAAC,qBAAqB;YAC5B,+DAAQ,KAAK,EAAC,YAAY,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE,IAEpD,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,uBAAiB,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,MAAM,GAAG,CAEzE,CACP,CACT,CAAA;IACL,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Prop, h } from \"@stencil/core\";\r\n\r\n@Component({\r\n    tag: 'crm-button',\r\n    styleUrl: 'crm-button.css'\r\n})\r\nexport class Button {\r\n\r\n    @Prop() txtBtn: string;\r\n    @Prop() loading: boolean;\r\n\r\n    @Prop() handleClick: () => void;\r\n\r\n    render() {\r\n        return (\r\n            <div class=\"crm-contaner-button\">\r\n                <button class=\"crm-button\" onClick={() => this.handleClick()}>\r\n                    {\r\n                        !this.loading ? this.txtBtn : <loading-spinner size=\"15px\" color=\"#fff\" />\r\n                    }\r\n                </button>\r\n            </div>\r\n        )\r\n    }\r\n}"]}