crmbonus-component-wake 1.0.35 → 1.0.37

package/dist/cjs/{giftback-finish_3.cjs.entry.js → giftback-finish_4.cjs.entry.js}

@@ -14,7 +14,7 @@ const GiftbackFinish = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h("div", { key: 'e72f82799146a6e94acbdd62324e07cdf9f77009', class: "message-finish" }, index.h("img", { key: '46e2436a3dbe4745225c3b9674e6bf6c299ad63e', src: successSvgrepoComSvg, width: 80 }), index.h("p", { key: '270e42050956f7f3d1ae9b90f314211fa310f797' }, "Legal! O B\u00F4nus ser\u00E1 aplicado na sua compra.")));
+        return (index.h("div", { key: '9b4f55d912fec91eeb8a4b885166bef049402ec0', class: "message-finish" }, index.h("img", { key: '372f7c9feb16579ecdbe5b6bd3f08e5bbe7b5a78', src: successSvgrepoComSvg, width: 80 }), index.h("p", { key: '9560741099089050a2bbe7153c2b69dd4ce085c9' }, "Legal! O B\u00F4nus ser\u00E1 aplicado na sua compra.")));
     }
 };
 GiftbackFinish.style = GiftbackFinishStyle0;
@@ -54,7 +54,7 @@ const GiftbackPin = class {
         }
     }
     render() {
-        return (index.h("div", { key: '7fe6a9f55ca436ecfcc20f106c1efeddd8387490', class: "form-container-pin" }, index.h("div", { key: 'aece84fab5ecf94ce5ca90fd1912623dd3c1b9b8' }, index.h("p", { key: '5134dd8eb3478f59dcfcdca6612e885b76578cba' }, "Insira o PIN de 4 d\u00EDgitos enviado por SMS."), index.h("div", { key: '8855be06a09925746a5b18323726dd67ec73d7c3', class: "pin-container" }, this.pin.map((_, index$1) => (index.h("input", { type: "text", maxLength: 1, value: this.pin[index$1], onInput: (event) => this.handleInput(event, index$1) }))))), index.h("div", { key: '1c5523feb6c9dafbfddd5388170de5fea7627f62', class: "footer-button" }, index.h("button", { key: '8506cd68998d4ecb76f8a8a262373605a06827de', class: "button-cancel", disabled: this.loading, onClick: () => this.cancel() }, "Cancelar"), index.h("button", { key: '4dda0af894ad5849ba27d3a4f6c15c80d6c984ae', class: `button ${this.loading ? 'disabled' : ''} `, disabled: this.loading, onClick: () => this.validatePin() }, !this.loading ? "Enviar" : index.h("loading-spinner", { size: "15px", color: "#fff" })))));
+        return (index.h("div", { key: 'c6d72e244011769962527f246a429ae11b873d84', class: "form-container-pin" }, index.h("div", { key: '242f10469a6455338475f9f4e11f4ecee654b7b1' }, index.h("p", { key: 'f902c5ca022d3672048f102a47cfa3fabf578222' }, "Insira o PIN de 4 d\u00EDgitos enviado por SMS."), index.h("div", { key: '2498c713571a5c7447a8d9305b8ba3b37d96b04e', class: "pin-container" }, this.pin.map((_, index$1) => (index.h("input", { type: "text", maxLength: 1, value: this.pin[index$1], onInput: (event) => this.handleInput(event, index$1) }))))), index.h("div", { key: '19d59cc3b47ab153dc85f9323cd49bc933cfbe5c', class: "footer-button" }, index.h("button", { key: '9323cfdc0965b3783bad9624b3663c5204e9c979', class: "button-cancel", disabled: this.loading, onClick: () => this.cancel() }, "Cancelar"), index.h("button", { key: 'e464a6cace10b33d81bf14eefdc4c9b8fc6a753b', class: `button ${this.loading ? 'disabled' : ''} `, disabled: this.loading, onClick: () => this.validatePin() }, !this.loading ? "Enviar" : index.h("loading-spinner", { size: "15px", color: "#fff" })))));
     }
 };
 GiftbackPin.style = GiftbackPinStyle0;
@@ -90,13 +90,43 @@ const GiftbackProgress = class {
     }
     render() {
         const remainingGiftback = this.bonus.minimumPurchase - this.bonus.totalValue;
-        return (index.h("div", { key: 'c2fb3f6a887887e197b55e951dbf50054e27e77a', class: "giftback-container" }, index.h("p", { key: '1d08aaaa1d260f3938e472e95b1e194be50c3987' }, "Voc\u00EA possui at\u00E9 ", index.h("strong", { key: '99d39bc977a41c9d098c812b61ae41c25342f65c' }, "R$ ", this.bonus.totalBonus.toFixed(2)), " de Giftback nessa compra!"), index.h("p", { key: '68fc8504eabfdf6e9e873780bb6863521a683e58', class: "validity" }, "V\u00E1lido at\u00E9: ", new Date(this.bonus.firstValidityDate).toLocaleDateString('pt-Br')), index.h("p", { key: 'fe4c8804f8d577e530330050cfae9c33c2be36d7' }, "Voc\u00EA est\u00E1 utilizando ", index.h("strong", { key: 'd1d2a6ad0ca1da77e5a4ab9a595af74a11fb9862' }, "R$ ", this.usedValue.toFixed(2)), " nessa compra"), index.h("div", { key: 'b0eac608016c3136a344c03d456355d7ffcc8dfc', class: "progress-container" }, index.h("span", { key: 'a88626a3f0d0109fca8b593da05e76f54eb69e28' }, "R$ 0"), index.h("input", { key: '5d19e34becada60c728f9fce1fa67eede16b7844', disabled: true, type: "range", min: "0", step: "0.01", max: this.bonus.totalBonus, value: this.usedValue, onInput: (event) => this.handleSliderChange(event) }), index.h("span", { key: '31f0b18eff1ffbd2fb86941653beacad567514ca' }, "R$ ", this.bonus.totalBonus.toFixed(2))), index.h("p", { key: '5f278047d5bb21282890de0304bc2e8addf8ea43', class: "remaining" }, "Faltam ", index.h("strong", { key: 'fa220ca91d366eb5e5eec4bf7e94ace4584b0dbe' }, "R$ ", remainingGiftback > 0 ? remainingGiftback.toFixed(2) : Number(0).toFixed(2)), " para utilizar o valor total do Giftback."), index.h("div", { key: '248c3376e92b8daab0c821e79e083ef6f44bff9e', class: "footer-button-giftback" }, index.h("button", { key: 'fe612e24a59abed7ef27e6a0425d40efaad218c2', class: "button-cancel", disabled: this.loading, onClick: () => this.cancel() }, "Cancelar"), index.h("button", { key: '6f86a5b1eeedf01c9eabe9313fdf7b00dc264e96', class: `button ${this.loading ? 'disabled' : ''} `, disabled: this.loading, onClick: () => this.handleReserve(this.usedValue) }, !this.loading ? "Aplicar" : index.h("loading-spinner", { size: "10px", color: "#fff" })))));
+        return (index.h("div", { key: '50707f64ae18b69d163445a873e5a676d783cd5d', class: "giftback-container" }, index.h("p", { key: '57b12806322c0d8dbd6f4f3a9199f08cd8552cfe' }, "Voc\u00EA possui at\u00E9 ", index.h("strong", { key: '9c8b93f8b99455d5d03cd88a2e0e3d601b3b5e8d' }, "R$ ", this.bonus.totalBonus.toFixed(2)), " de Giftback nessa compra!"), index.h("p", { key: 'e518e6ac4eb0bfa32b5b3d0868096debe4614c9f', class: "validity" }, "V\u00E1lido at\u00E9: ", new Date(this.bonus.firstValidityDate).toLocaleDateString('pt-Br')), index.h("p", { key: '6f44fc3bffd5e6b6d1532de48cebaa50a3d875ee' }, "Voc\u00EA est\u00E1 utilizando ", index.h("strong", { key: '8043f0279fb4d0d4814eb17ee898aefb6af2ffd0' }, "R$ ", this.usedValue.toFixed(2)), " nessa compra"), index.h("div", { key: '3981051ab3bd96b1a64aa875bc8670ed079fa335', class: "progress-container" }, index.h("span", { key: '2dc247e804ca3025f1db69bc72413f8f9010a6ef' }, "R$ 0"), index.h("input", { key: '674a8867420b5f36ecd0c4eaa917b9e50d8823ac', disabled: true, type: "range", min: "0", step: "0.01", max: this.bonus.totalBonus, value: this.usedValue, onInput: (event) => this.handleSliderChange(event) }), index.h("span", { key: '50e13d71a0c7972b0d51742079609594a1b79480' }, "R$ ", this.bonus.totalBonus.toFixed(2))), index.h("p", { key: 'd6212b01dca380c6566b057175fef396820ad68f', class: "remaining" }, "Faltam ", index.h("strong", { key: '807117779462b58fc949944bb11b28ebdd8f6c01' }, "R$ ", remainingGiftback > 0 ? remainingGiftback.toFixed(2) : Number(0).toFixed(2)), " para utilizar o valor total do Giftback."), index.h("div", { key: '7b9052d19750a0b49904e020ddc8316eb3230389', class: "footer-button-giftback" }, index.h("button", { key: '7bcebd92b0009a3539ef4e7b256d47bfa7da905b', class: "button-cancel", disabled: this.loading, onClick: () => this.cancel() }, "Cancelar"), index.h("button", { key: '97ea78d1b223b8691ebfee8a99234ca974e436e6', class: `button ${this.loading ? 'disabled' : ''} `, disabled: this.loading, onClick: () => this.handleReserve(this.usedValue) }, !this.loading ? "Aplicar" : index.h("loading-spinner", { size: "10px", color: "#fff" })))));
     }
 };
 GiftbackProgress.style = GiftbackProgressStyle0;
 
+const nameInputCss = ".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}";
+const NameInputStyle0 = nameInputCss;
+
+const NameInput = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.value = undefined;
+        this.loading = undefined;
+        this.applyName = undefined;
+        this.cancel = undefined;
+        this.newValue = undefined;
+        this.message = undefined;
+    }
+    handleChangeName(event) {
+        this.newValue = event.target.value;
+    }
+    handleSetName(name) {
+        if (!name) {
+            this.message = "Informe seu nome";
+            return;
+        }
+        this.applyName(name);
+    }
+    render() {
+        return (index.h("div", { key: '79187b5c58617f7f7d0062f4174cf7c37727808c', class: "name-container" }, index.h("p", { key: '23e6bb34fe19a23f9c3654130e4586022f5f1581' }, "Seu Nome:"), index.h("input", { key: '8ba653c5e1bfdf808429caad0fccc1a5c12197c5', class: "bc-form-control", type: "text", value: this.value, onChange: (event) => this.handleChangeName(event) }), index.h("p", { key: 'da3559a3af2b93496be7fa97b0f3a9e966598781' }, this.message), index.h("div", { key: 'cf3c035a61e08e7353a9cd038f0ee98ecff18d66', class: "footer-button" }, index.h("button", { key: 'a437bb82b68f2ea881163dcf4c200950418fb853', class: "button-cancel", disabled: this.loading, onClick: () => this.cancel() }, "Cancelar"), index.h("button", { key: 'd68da6ed31f22ff53ca2c953cece48ef2aabe6ba', class: `button ${this.loading ? 'disabled' : ''} `, disabled: this.loading, onClick: () => this.handleSetName(this.newValue) }, !this.loading ? "Continua" : index.h("loading-spinner", { size: "15px", color: "#fff" })))));
+    }
+};
+NameInput.style = NameInputStyle0;
+
 exports.giftback_finish = GiftbackFinish;
 exports.giftback_pin = GiftbackPin;
 exports.giftback_progress = GiftbackProgress;
+exports.name_input = NameInput;
 
-//# sourceMappingURL=giftback-finish_3.cjs.entry.js.map
+//# sourceMappingURL=giftback-finish_4.cjs.entry.js.map

package/dist/cjs/giftback-finish_4.cjs.entry.js.map

@@ -0,0 +1 @@
+{"file":"giftback-finish.giftback-pin.giftback-progress.name-input.entry.cjs.js","mappings":"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","names":["h","success","index"],"sources":["src/components/crm-bonus/assets/svg/success-svgrepo-com.svg","src/components/crm-bonus-form/subcomponents/giftback-finish/giftback-finish.css?tag=giftback-finish&encapsulation=shadow","src/components/crm-bonus-form/subcomponents/giftback-finish/giftback-finish.tsx","src/components/crm-bonus-form/subcomponents/giftback-pin/giftback-pin.css?tag=giftback-pin&encapsulation=shadow","src/components/crm-bonus-form/subcomponents/giftback-pin/giftback-pin.tsx","src/components/crm-bonus-form/subcomponents/giftback-progress/giftback-progress.css?tag=giftback-progress&encapsulation=shadow","src/components/crm-bonus-form/subcomponents/giftback-progress/giftback-progress.tsx","src/components/crm-bonus-form/subcomponents/name-input/name-input.css?tag=name-input","src/components/crm-bonus-form/subcomponents/name-input/name-input.tsx"],"sourcesContent":["<?xml version=\"1.0\" encoding=\"iso-8859-1\"?>\r\n<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->\r\n<svg version=\"1.1\" id=\"Capa_1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" \r\n\t viewBox=\"0 0 50 50\" xml:space=\"preserve\">\r\n<circle style=\"fill:#25AE88;\" cx=\"25\" cy=\"25\" r=\"25\"/>\r\n<polyline style=\"fill:none;stroke:#FFFFFF;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;\" points=\"\r\n\t38,15 22,33 12,25 \"/>\r\n</svg>",".message-finish {\n    align-content: center;\n    text-align: center;\n}\n\n.message-finish p {\n    color: #777676;\n    font-size: xx-large;\n    font-family: sans-serif;\n}","import { Component, h } from \"@stencil/core\";\nimport success from '../../../crm-bonus/assets/svg/success-svgrepo-com.svg'\n\n@Component({\n    tag: 'giftback-finish',\n    styleUrl: 'giftback-finish.css',\n    shadow: true\n})\nexport class GiftbackFinish {\n    render() {\n        return (\n            <div class=\"message-finish\">\n                <img src={success} width={80} />\n                <p>Legal! O Bônus será aplicado na sua compra.</p>\n            </div>\n        )\n    }\n}",":host {\n    display: block;\n    font-family: Arial, sans-serif;\n}\n\n.form-container-pin {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n}\n\n.pin-container {\n    display: flex;\n    gap: 10px;\n    margin: 26px 0;\n}\n\ninput {\n    width: 58px;\n    height: 40px;\n    font-size: 18px;\n    text-align: center;\n    border: 1px solid #ccc;\n    border-radius: 5px;\n}\n\nbutton {\n    padding: 10px 20px;\n    background-color: #ddd;\n    border: none;\n    border-radius: 5px;\n    cursor: pointer;\n}\n\nbutton:hover {\n    background-color: #bbb;\n}\n\n.success {\n    color: green;\n    margin-top: 10px;\n}\n\n.button {\n    top: 50%;\n    background-color: #6c6c7e;\n    color: #fff;\n    border: none;\n    border-radius: 10px;\n    padding: 15px;\n    min-height: 30px;\n    min-width: 120px;\n    font-size: 20px;\n    cursor: pointer;\n}\n\n.button-cancel {\n    top: 50%;\n    background-color: #ffffff;\n    color: #1e1c1c;\n    border: 1px solid gray;\n    border-radius: 10px;\n    padding: 10px;\n    min-height: 30px;\n    min-width: 120px;\n    font-size: 19px;\n    cursor: pointer;\n}\n\n.footer-button {\n    display: flex;\n    justify-content: space-between;\n    width: 100%;\n}","import { Component, h, Prop, State } from '@stencil/core';\nimport { IPinSent } from '../../../../dto/pin.sent';\n\n@Component({\n    tag: 'giftback-pin',\n    styleUrl: 'giftback-pin.css',\n    shadow: true,\n})\nexport class GiftbackPin {\n\n    @Prop() sent: IPinSent;\n    @Prop() validate: (pin: string) => void;\n    @Prop() cancel: () => void;\n\n    @State() pin: string[] = ['', '', '', ''];\n    @State() isVerified: boolean = false;\n\n    @Prop() loading: boolean = false;\n\n    handleInput(event: Event, index: number) {\n        const input = event.target as HTMLInputElement;\n        const value = input.value.slice(0, 1); // Limitar a um único dígito\n        this.pin[index] = value;\n\n        // Focar no próximo campo, se possível\n        if (value && index < this.pin.length - 1) {\n            const nextInput = input.nextElementSibling as HTMLInputElement;\n            nextInput?.focus();\n        }\n\n        this.pin = [...this.pin];\n    }\n\n    validatePin() {\n        console.log('this.pin', this.pin);\n        this.validate(this.pin.join(\"\"))\n    }\n\n    verifyPin() {\n        const pinCode = this.pin.join('');\n        if (pinCode === '9999') {\n            this.isVerified = true;\n        }\n    }\n\n    render() {\n        return (\n            <div class=\"form-container-pin\">\n                <div >\n                    <p>Insira o PIN de 4 dígitos enviado por SMS.</p>\n                    <div class=\"pin-container\">\n                        {this.pin.map((_, index) => (\n                            <input\n                                type=\"text\"\n                                maxLength={1}\n                                value={this.pin[index]}\n                                onInput={(event) => this.handleInput(event, index)}\n                            />\n                        ))}\n                    </div>\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.validatePin()}>\n                        {\n                            !this.loading ? \"Enviar\" : <loading-spinner size=\"15px\" color=\"#fff\" />\n                        }\n                    </button>\n                </div>\n                {/* <button onClick={() => this.verifyPin()}>Enviar</button>\n                {this.isVerified && <p class=\"success\">Código verificado com sucesso!</p>} */}\n            </div>\n        );\n    }\n}\n",":host {\n    display: flex;\n    font-family: Arial, sans-serif;\n    /* background-color: #f8f4eb; */\n    border-radius: 10px;\n    padding: 16px;\n    /* box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); */\n    max-width: 100%;\n    flex-direction: column;\n}\n\n.giftback-container {\n    display: flex;\n    flex-direction: column;\n}\n\n.giftback-container p {\n    font-size: medium;\n}\n\nh3 {\n    margin: 0 0 10px;\n    font-size: 18px;\n}\n\np {\n    margin: 5px 0;\n    font-size: 14px;\n    align-self: start;\n}\n\n.validity {\n    font-size: 12px;\n    color: #888;\n}\n\n.progress-container {\n    display: flex;\n    align-items: center;\n    margin: 10px 0;\n}\n\nprogress-container span {\n    font-size: 12px;\n    color: #666;\n}\n\ninput[type='range'] {\n    flex: 1;\n    margin: 0 10px;\n    appearance: none;\n    background-color: #ccc;\n    height: 6px;\n    border-radius: 3px;\n    outline: none;\n    cursor: pointer;\n}\n\ninput[type='range']::-webkit-slider-thumb {\n    appearance: none;\n    width: 14px;\n    height: 14px;\n    border-radius: 50%;\n    background-color: #555;\n    cursor: pointer;\n}\n\n.remaining {\n    font-weight: bold;\n    font-size: 14px;\n    color: #333;\n}\n\n.button {\n    top: 50%;\n    background-color: #6c6c7e;\n    color: #fff;\n    border: none;\n    border-radius: 10px;\n    padding: 10px;\n    min-height: 30px;\n    min-width: 120px;\n    font-size: 19px;\n    cursor: pointer;\n}\n\n.button-cancel {\n    top: 50%;\n    background-color: #ffffff;\n    color: #1e1c1c;\n    border: 1px solid gray;\n    border-radius: 10px;\n    padding: 10px;\n    min-height: 30px;\n    min-width: 120px;\n    font-size: 19px;\n    cursor: pointer;\n}\n\n.disabled {\n    opacity: 0.6;\n    cursor: not-allowed;\n}\n\n.footer-button-giftback {\n    display: flex;\n    justify-content: space-between;\n    margin-top: 14px;\n}","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",".bc-form-control {\n    display: block;\n    width: 90%;\n    height: 24px;\n    padding: 7px 18px;\n    font-size: 14px;\n    line-height: 1.42857143;\n    color: #555;\n    background-color: #fff;\n    background-image: none;\n    border: 1px solid #ccc;\n    border-radius: 0px;\n    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);\n    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);\n    -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;\n    -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;\n    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;\n}\n\n.bc-btn {\n    display: inline-block;\n    padding: 6px 12px;\n    margin-bottom: 0;\n    font-size: 14px;\n    font-weight: 400;\n    line-height: 1.42857143;\n    text-align: center;\n    white-space: nowrap;\n    vertical-align: middle;\n    -ms-touch-action: manipulation;\n    touch-action: manipulation;\n    cursor: pointer;\n    -webkit-user-select: none;\n    -moz-user-select: none;\n    -ms-user-select: none;\n    user-select: none;\n    background-image: none;\n    border: 1px solid transparent;\n    border-radius: 0px;\n}\n\n.bc-btn-process {\n    background: #00162e;\n    border-color: #00162e;\n    width: 30%;\n    color: #fff;\n}\n\n.bc-footer-btn {\n    display: flex;\n    justify-content: end;\n    margin: 11px;\n}\n\n.name-container {\n    font-weight: bold;\n    color: #494545;\n}\n\n\nbutton {\n    padding: 10px 20px;\n    background-color: #ddd;\n    border: none;\n    border-radius: 5px;\n    cursor: pointer;\n}\n\nbutton:hover {\n    background-color: #bbb;\n}\n\n.success {\n    color: green;\n    margin-top: 10px;\n}\n\n.button {\n    top: 50%;\n    background-color: #6c6c7e;\n    color: #fff;\n    border: none;\n    border-radius: 10px;\n    padding: 11px;\n    min-width: 120px;\n    font-size: 20px;\n    cursor: pointer;\n}\n\n.button-cancel {\n    top: 50%;\n    background-color: #ffffff;\n    color: #1e1c1c;\n    border: 1px solid gray;\n    border-radius: 10px;\n    padding: 10px;\n    min-height: 30px;\n    min-width: 120px;\n    font-size: 19px;\n    cursor: pointer;\n}\n\n.footer-button {\n    display: flex;\n    justify-content: space-between;\n    width: 97%;\n    margin-top: 14px;\n}","import { Component, Prop, State, h } from \"@stencil/core\";\n\n@Component({\n    tag: 'name-input',\n    styleUrl: 'name-input.css'\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}

package/dist/cjs/{index-296f70bf.js → index-861e0cbe.js}

@@ -2,10 +2,11 @@
 
 exports.StepFormEnum = void 0;
 (function (StepFormEnum) {
+    StepFormEnum[StepFormEnum["STEP_NAME"] = 0] = "STEP_NAME";
     StepFormEnum[StepFormEnum["STEP_PHONE"] = 1] = "STEP_PHONE";
     StepFormEnum[StepFormEnum["STEP_PIN"] = 2] = "STEP_PIN";
     StepFormEnum[StepFormEnum["STEP_RESERVE"] = 3] = "STEP_RESERVE";
     StepFormEnum[StepFormEnum["STEP_APPLY"] = 4] = "STEP_APPLY";
 })(exports.StepFormEnum || (exports.StepFormEnum = {}));
 
-//# sourceMappingURL=index-296f70bf.js.map
+//# sourceMappingURL=index-861e0cbe.js.map

package/dist/cjs/index-861e0cbe.js.map

@@ -0,0 +1 @@
+{"file":"index-861e0cbe.js","mappings":";;AAAYA;AAAZ,WAAY,YAAY;IACpB,yDAAa,CAAA;IACb,2DAAc,CAAA;IACd,uDAAY,CAAA;IACZ,+DAAgB,CAAA;IAChB,2DAAc,CAAA;AAClB,CAAC,EANWA,oBAAY,KAAZA,oBAAY;;","names":["StepFormEnum"],"sources":["src/contants/index.ts"],"sourcesContent":["export enum StepFormEnum {\n    STEP_NAME = 0,\n    STEP_PHONE = 1,\n    STEP_PIN = 2,\n    STEP_RESERVE = 3,\n    STEP_APPLY = 4\n}"],"version":3}

package/dist/cjs/loader.cjs.js

@@ -8,7 +8,7 @@ const appGlobals = require('./app-globals-3a1e7e63.js');
 const defineCustomElements = async (win, options) => {
   if (typeof window === 'undefined') return undefined;
   await appGlobals.globalScripts();
-  return index.bootstrapLazy([["crm-bonus.cjs",[[1,"crm-bonus",{"userId":[2,"userid"],"storeName":[8,"storename"],"productsInString":[1,"products"],"cartId":[8,"cartid"],"showModal":[32],"products":[32],"customer":[32],"loading":[32],"message":[32],"phone":[32],"canCancel":[32],"amountCancel":[32],"sent":[32]}]]],["crm-bonus-note.cjs",[[0,"crm-bonus-note",{"url":[32]}]]],["pedido-finalizado.cjs",[[0,"pedido-finalizado",{"cartId":[1,"cartid"],"orderId":[2,"orderid"],"metadadoString":[1,"metadado"]}]]],["phone-input-mask.cjs",[[1,"phone-input-mask",{"initialValue":[1,"initial-value"],"disabled":[4],"phone":[32],"getPhone":[64]}]]],["loading-spinner.cjs",[[1,"loading-spinner",{"size":[1],"color":[1]}]]],["giftback-finish_3.cjs",[[1,"giftback-pin",{"sent":[16],"validate":[16],"cancel":[16],"loading":[4],"pin":[32],"isVerified":[32]}],[1,"giftback-progress",{"loading":[4],"bonus":[16],"reserve":[16],"cancel":[16],"usedValue":[32]}],[1,"giftback-finish"]]],["app-modal_4.cjs",[[1,"crm-bonus-form",{"storeName":[8,"storename"],"cartId":[8,"cart-id"],"products":[16],"customer":[16],"sent":[16],"stepNext":[2,"step-next"],"phone":[2],"saveStore":[16],"cancel":[16],"loading":[32],"step":[32],"message":[32],"bonus":[32],"setStep":[64]}],[0,"phone-cancel-input",{"sendPin":[16],"loading":[4],"value":[1]}],[0,"phone-input",{"sendPin":[16],"loading":[4],"value":[1]}],[1,"app-modal",{"isOpen":[516,"is-open"],"modalTitle":[1,"modal-title"]}]]]], options);
+  return index.bootstrapLazy([["crm-bonus.cjs",[[1,"crm-bonus",{"userId":[2,"userid"],"storeName":[8,"storename"],"productsInString":[1,"products"],"cartId":[8,"cartid"],"showModal":[32],"products":[32],"customer":[32],"loading":[32],"message":[32],"phone":[32],"canCancel":[32],"amountCancel":[32],"sent":[32]}]]],["crm-bonus-note.cjs",[[0,"crm-bonus-note",{"url":[32]}]]],["pedido-finalizado.cjs",[[0,"pedido-finalizado",{"cartId":[1,"cartid"],"orderId":[2,"orderid"],"metadadoString":[1,"metadado"]}]]],["phone-input-mask.cjs",[[1,"phone-input-mask",{"initialValue":[1,"initial-value"],"disabled":[4],"phone":[32],"getPhone":[64]}]]],["loading-spinner.cjs",[[1,"loading-spinner",{"size":[1],"color":[1]}]]],["giftback-finish_4.cjs",[[1,"giftback-pin",{"sent":[16],"validate":[16],"cancel":[16],"loading":[4],"pin":[32],"isVerified":[32]}],[1,"giftback-progress",{"loading":[4],"bonus":[16],"reserve":[16],"cancel":[16],"usedValue":[32]}],[0,"name-input",{"value":[1],"loading":[4],"applyName":[16],"cancel":[16],"newValue":[32],"message":[32]}],[1,"giftback-finish"]]],["app-modal_4.cjs",[[1,"crm-bonus-form",{"storeName":[8,"storename"],"cartId":[8,"cart-id"],"products":[16],"customer":[16],"sent":[16],"stepNext":[2,"step-next"],"phone":[2],"loadingModal":[4,"loading-modal"],"saveStore":[16],"cancel":[16],"handleCustomerName":[16],"loading":[32],"step":[32],"message":[32],"bonus":[32],"setStep":[64]}],[0,"phone-cancel-input",{"sendPin":[16],"loading":[4],"value":[1]}],[0,"phone-input",{"sendPin":[16],"loading":[4],"value":[1]}],[1,"app-modal",{"isOpen":[516,"is-open"],"modalTitle":[1,"modal-title"]}]]]], options);
 };
 
 exports.setNonce = index.setNonce;

package/dist/cjs/loading-spinner.cjs.entry.js

@@ -14,7 +14,7 @@ const LoadingSpinner = class {
         this.color = '#0078d7';
     }
     render() {
-        return (index.h("div", { key: 'bf8c1b0ae13f857499905cba4a56f6bc787e7caf', class: "spinner", style: { width: this.size, height: this.size, borderColor: `${this.color} transparent transparent transparent` } }));
+        return (index.h("div", { key: 'dc2bd14b5fefd8566b4f4cd89789aa0ae0a51db3', class: "spinner", style: { width: this.size, height: this.size, borderColor: `${this.color} transparent transparent transparent` } }));
     }
 };
 LoadingSpinner.style = LoadingSpinnerStyle0;

package/dist/cjs/pedido-finalizado.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-52d8a075.js');
-const crmbonus_service = require('./crmbonus.service-e6b51638.js');
+const crmbonus_service = require('./crmbonus.service-e46a5941.js');
 
 const Pedido = class {
     constructor(hostRef) {
@@ -27,7 +27,7 @@ const Pedido = class {
         }
     }
     render() {
-        return (index.h("div", { key: 'eedf1e7aa823c9866d49ff6c4cf89858c8702258' }));
+        return (index.h("div", { key: '0110099751c9874bf52036de9a4f2d94095d7663' }));
     }
 };
 

package/dist/cjs/phone-input-mask.cjs.entry.js

@@ -35,7 +35,7 @@ const PhoneInputMask = class {
         return this.phone;
     }
     render() {
-        return (index.h("input", { key: '2c0a1c1fad52a39b65bf3327c82093199bcf441e', disabled: this.disabled, id: "phone", type: "tel", class: "phone", value: this.phone, onInput: (event) => this.handleInput(event), placeholder: "(12) 94567-8910" }));
+        return (index.h("input", { key: 'ec33b7963cefd79431a0c0663df8fa1a82b09564', disabled: this.disabled, id: "phone", type: "tel", class: "phone", value: this.phone, onInput: (event) => this.handleInput(event), placeholder: "(12) 94567-8910" }));
     }
 };
 PhoneInputMask.style = PhoneInputMaskStyle0;

package/dist/collection/collection-manifest.json

@@ -5,6 +5,7 @@
     "components/crm-bonus-form/subcomponents/giftback-finish/giftback-finish.js",
     "components/crm-bonus-form/subcomponents/giftback-pin/giftback-pin.js",
     "components/crm-bonus-form/subcomponents/giftback-progress/giftback-progress.js",
+    "components/crm-bonus-form/subcomponents/name-input/name-input.js",
     "components/crm-bonus-form/subcomponents/phone/phone.input.js",
     "components/crm-bonus-form/subcomponents/phone-cancel/phone.cancel.input.js",
     "components/loading-spinner/loading-spinner.js",

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

@@ -0,0 +1 @@
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/button/index.tsx"],"names":[],"mappings":"","sourcesContent":[""]}

package/dist/collection/components/crm-bonus/crm-bonus.js

@@ -33,7 +33,6 @@ export class CrmBonus {
                 console.log('user', this.customer);
             }
             const amount = localStorage.getItem(this.cartId);
-            console.log('amount', amount);
             if (amount) {
                 this.canCancel = true;
                 this.amountCancel = amount;
@@ -51,7 +50,25 @@ export class CrmBonus {
         try {
             const _phone = phone.replace(/\D/g, '');
             this.phone = Number(_phone);
-            this.sent = await this.crmBonusService.sendPin(this.phone, this.storeName);
+            this.sent = await this.crmBonusService.sendPin(this.phone, this.customer.name, this.storeName);
+            ;
+            await this.crmBonusRef.setStep(StepFormEnum.STEP_PIN);
+            this.showModal = true;
+        }
+        catch (error) {
+            this.message = (_b = (_a = error === null || error === void 0 ? void 0 : error.response) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.message;
+        }
+        finally {
+            this.loading = false;
+        }
+    }
+    async sendPinName(customerName) {
+        var _a, _b;
+        this.loading = true;
+        this.message = "";
+        try {
+            this.customer.name = customerName;
+            this.sent = await this.crmBonusService.sendPin(this.phone, this.customer.name, this.storeName);
             ;
             await this.crmBonusRef.setStep(StepFormEnum.STEP_PIN);
             this.showModal = true;
@@ -88,9 +105,24 @@ export class CrmBonus {
             this.loading = false;
         }
     }
+    async handleSendPin(phone) {
+        this.message = "";
+        if (!phone) {
+            this.message = "Informe seu telefone";
+            return;
+        }
+        this.customer.phone = phone;
+        const _phone = phone.replace(/\D/g, '');
+        this.phone = Number(_phone);
+        if (this.customer.name) {
+            return this.sendPin(phone);
+        }
+        await this.crmBonusRef.setStep(StepFormEnum.STEP_NAME);
+        this.showModal = true;
+    }
     render() {
-        return (h("div", { key: '0392d18435b29da7594c5ddec8dca0a5a2c892f6', class: "section-cart-crm" }, h("p", { key: '7f5cb65fe1ebce8397d5d6c8d3d13d09ad55d8db', class: "text-left fbits-responsive-carrinho-desconto-texto" }, "Giftback"), h("div", { key: '82922b373a5c6d0eb72d59826c5b10425fa9fb81', class: "container-button" }, this.canCancel ? h("phone-cancel-input", { value: this.amountCancel, sendPin: () => { this.cancel(); }, loading: this.loading })
-            : h("phone-input", { value: this.customer.phone, sendPin: (phone) => { this.sendPin(phone); }, loading: this.loading })), h("p", { key: '113c2653a276730fd3ecd675f50a0f147c656620', class: "message-alert" }, this.message), h("app-modal", { key: 'ffda850ab8dc0534e56f868554eaaa794b168427', isOpen: this.showModal, modalTitle: `Giftback`, onModalClosed: () => (this.showModal = false) }, h("crm-bonus-form", { key: '3b3493173363fd799f26b37e6d94f9455e19f2bf', saveStore: (amount) => this.save(amount), ref: ref => this.crmBonusRef = ref, sent: this.sent, phone: this.phone, cancel: () => this.handleCloseModal(), storeName: this.storeName, products: this.buildProducts(), cartId: this.cartId, customer: this.customer }))));
+        return (h("div", { key: '5c53647f64ad11462e22b019a480d5d9d51b2285', class: "section-cart-crm" }, h("p", { key: '8ecb472520c31572e708eb54498863287140bf27', class: "text-left fbits-responsive-carrinho-desconto-texto" }, "Giftback"), h("div", { key: '8b461b55b8beaa9527105a72b5c2acf0f40bbd3d', class: "container-button" }, this.canCancel ? h("phone-cancel-input", { value: this.amountCancel, sendPin: () => { this.cancel(); }, loading: this.loading })
+            : h("phone-input", { value: this.customer.phone, sendPin: (phone) => { this.handleSendPin(phone); }, loading: this.loading })), h("p", { key: 'e6ceb0d9ff146acaa46cc48f0364e06941697212', class: "message-alert" }, this.message), h("app-modal", { key: 'f0ebc9eb453fe79190658edfa8677107ae4d019f', isOpen: this.showModal, modalTitle: `Giftback`, onModalClosed: () => (this.showModal = false) }, h("crm-bonus-form", { key: '26cf5335eeb69e4b69ba1d4add8f8ed6a764e41c', loadingModal: this.loading, saveStore: (amount) => this.save(amount), ref: ref => this.crmBonusRef = ref, sent: this.sent, phone: this.phone, cancel: () => this.handleCloseModal(), storeName: this.storeName, products: this.buildProducts(), cartId: this.cartId, customer: this.customer, handleCustomerName: (name) => this.sendPinName(name) }))));
     }
     static get is() { return "crm-bonus"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/crm-bonus/crm-bonus.js.map

@@ -1 +1 @@
-{"version":3,"file":"crm-bonus.js","sourceRoot":"","sources":["../../../../src/components/crm-bonus/crm-bonus.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Prop, State, h } from '@stencil/core';\nimport { IProduct, IProductWake, ICustomer } from '../../dto/validate.pin.bonus';\nimport { CrmBonusService } from '../../services/crmbonus.service';\nimport { IPinSent } from '../../components';\nimport { StepFormEnum } from '../../contants';\n\n@Component({\n  tag: 'crm-bonus',\n  styleUrl: 'crm-bonus.css',\n  shadow: true,\n  assetsDirs: ['assets']\n})\nexport class CrmBonus {\n\n  private crmBonusService: CrmBonusService = new CrmBonusService();\n\n  private crmBonusRef: HTMLCrmBonusFormElement;\n\n  @State() showModal: boolean = false;\n  @Prop({ attribute: 'userid' }) userId: number;\n  @Prop({ attribute: 'storename' }) storeName;\n  @Prop({ attribute: 'products' }) productsInString: string;\n  @Prop({ attribute: 'cartid' }) cartId;\n\n  @State() products: Array<IProductWake>;\n  @State() customer: ICustomer = {\n    birthDate: \"\",\n    document: \"\",\n    name: \"\",\n    phone: \"\"\n  };\n\n  @State() loading: boolean = false;\n  @State() message: string;\n  @State() phone: number;\n  @State() canCancel: boolean = false;\n  @State() amountCancel: string;\n  @State() sent: IPinSent;\n\n\n  async componentWillLoad() {\n    await this.handleLoad();\n  }\n\n  async handleLoad() {\n    try {\n      if (this.userId) {\n        this.customer = await this.crmBonusService.getCustomer(this.userId, this.storeName);\n        console.log('user', this.customer);\n      }\n\n      const amount = localStorage.getItem(this.cartId);\n      console.log('amount', amount)\n\n      if (amount) {\n        this.canCancel = true;\n        this.amountCancel = amount;\n      }\n\n    } catch (error) {\n      console.log('info customer')\n    }\n    this.products = JSON.parse(this.productsInString);\n  }\n\n  public async sendPin(phone: string) {\n    this.loading = true;\n    this.message = \"\";\n\n    try {\n      const _phone = phone.replace(/\\D/g, '');\n      this.phone = Number(_phone);\n      this.sent = await this.crmBonusService.sendPin(this.phone, this.storeName);;\n      await this.crmBonusRef.setStep(StepFormEnum.STEP_PIN);\n      this.showModal = true;\n    } catch (error) {\n      this.message = error?.response?.data?.message\n    } finally {\n      this.loading = false\n    }\n  }\n\n  buildProducts(): IProduct[] {\n    return this.products.map(product => ({ sku: product.SKU, value: (product.PrecoPor * product.Quantidade), variantId: product.ProdutoVarianteId, qtd: product.Quantidade }))\n  }\n\n  handleCloseModal() {\n    this.showModal = false;\n  }\n\n  save(amount: number) {\n    localStorage.setItem(this.cartId, amount.toString());\n    this.canCancel = true;\n    this.amountCancel = amount.toString()\n  }\n\n  async cancel() {\n    this.message = \"\";\n    this.loading = true;\n    try {\n      await this.crmBonusService.cancel(this.cartId, this.storeName);\n      this.canCancel = false;\n    } catch (error) {\n      this.message = \"Não consegui cancelar o bônus, tente novamente!\"\n    } finally {\n      this.loading = false;\n    }\n  }\n\n  render() {\n    return (\n      <div class=\"section-cart-crm\">\n        <p class=\"text-left fbits-responsive-carrinho-desconto-texto\">Giftback</p>\n        <div class=\"container-button\">\n          {/* <img src={logo} onClick={() => (this.showModal = true)} /> */}\n          {\n            this.canCancel ? <phone-cancel-input value={this.amountCancel} sendPin={() => { this.cancel() }} loading={this.loading} />\n              : <phone-input value={this.customer.phone} sendPin={(phone) => { this.sendPin(phone) }} loading={this.loading} />\n          }\n        </div>\n        <p class=\"message-alert\" >{this.message}</p>\n        <app-modal\n          isOpen={this.showModal}\n          modalTitle={`Giftback`}\n          onModalClosed={() => (this.showModal = false)}\n        >\n          <crm-bonus-form saveStore={(amount: number) => this.save(amount)} ref={ref => this.crmBonusRef = ref} sent={this.sent} phone={this.phone} cancel={() => this.handleCloseModal()} storeName={this.storeName} products={this.buildProducts()} cartId={this.cartId} customer={this.customer} />\n        </app-modal>\n      </div>\n    )\n  }\n}\n"]}
+{"version":3,"file":"crm-bonus.js","sourceRoot":"","sources":["../../../../src/components/crm-bonus/crm-bonus.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Prop, State, h } from '@stencil/core';\nimport { IProduct, IProductWake, ICustomer } from '../../dto/validate.pin.bonus';\nimport { CrmBonusService } from '../../services/crmbonus.service';\nimport { IPinSent } from '../../components';\nimport { StepFormEnum } from '../../contants';\n\n@Component({\n  tag: 'crm-bonus',\n  styleUrl: 'crm-bonus.css',\n  shadow: true,\n  assetsDirs: ['assets']\n})\nexport class CrmBonus {\n\n  private crmBonusService: CrmBonusService = new CrmBonusService();\n\n  private crmBonusRef: HTMLCrmBonusFormElement;\n\n  @State() showModal: boolean = false;\n  @Prop({ attribute: 'userid' }) userId: number;\n  @Prop({ attribute: 'storename' }) storeName;\n  @Prop({ attribute: 'products' }) productsInString: string;\n  @Prop({ attribute: 'cartid' }) cartId;\n\n  @State() products: Array<IProductWake>;\n  @State() customer: ICustomer = {\n    birthDate: \"\",\n    document: \"\",\n    name: \"\",\n    phone: \"\"\n  };\n\n  @State() loading: boolean = false;\n  @State() message: string;\n  @State() phone: number;\n  @State() canCancel: boolean = false;\n  @State() amountCancel: string;\n  @State() sent: IPinSent;\n\n\n  async componentWillLoad() {\n    await this.handleLoad();\n  }\n\n  async handleLoad() {\n    try {\n      if (this.userId) {\n        this.customer = await this.crmBonusService.getCustomer(this.userId, this.storeName);\n        console.log('user', this.customer);\n      }\n\n      const amount = localStorage.getItem(this.cartId);\n\n      if (amount) {\n        this.canCancel = true;\n        this.amountCancel = amount;\n      }\n\n    } catch (error) {\n      console.log('info customer')\n    }\n    this.products = JSON.parse(this.productsInString);\n  }\n\n  public async sendPin(phone: string) {\n    this.loading = true;\n    this.message = \"\";\n\n    try {\n\n      const _phone = phone.replace(/\\D/g, '');\n      this.phone = Number(_phone);\n\n      this.sent = await this.crmBonusService.sendPin(this.phone, this.customer.name, this.storeName);;\n\n      await this.crmBonusRef.setStep(StepFormEnum.STEP_PIN);\n\n      this.showModal = true;\n    } catch (error) {\n      this.message = error?.response?.data?.message\n    } finally {\n      this.loading = false\n    }\n  }\n\n  public async sendPinName(customerName: string) {\n    this.loading = true;\n    this.message = \"\";\n\n    try {\n      this.customer.name = customerName;\n\n      this.sent = await this.crmBonusService.sendPin(this.phone, this.customer.name, this.storeName);;\n\n      await this.crmBonusRef.setStep(StepFormEnum.STEP_PIN);\n\n      this.showModal = true;\n    } catch (error) {\n      this.message = error?.response?.data?.message\n    } finally {\n      this.loading = false\n    }\n  }\n\n  buildProducts(): IProduct[] {\n    return this.products.map(product => ({ sku: product.SKU, value: (product.PrecoPor * product.Quantidade), variantId: product.ProdutoVarianteId, qtd: product.Quantidade }))\n  }\n\n  handleCloseModal() {\n    this.showModal = false;\n  }\n\n  save(amount: number) {\n    localStorage.setItem(this.cartId, amount.toString());\n    this.canCancel = true;\n    this.amountCancel = amount.toString()\n  }\n\n  async cancel() {\n    this.message = \"\";\n    this.loading = true;\n    try {\n      await this.crmBonusService.cancel(this.cartId, this.storeName);\n      this.canCancel = false;\n    } catch (error) {\n      this.message = \"Não consegui cancelar o bônus, tente novamente!\"\n    } finally {\n      this.loading = false;\n    }\n  }\n\n  async handleSendPin(phone: string) {\n    this.message = \"\"\n    if(!phone) {\n      this.message = \"Informe seu telefone\";\n      return;\n    }\n\n    this.customer.phone = phone;\n    const _phone = phone.replace(/\\D/g, '');\n    this.phone = Number(_phone);\n\n    if (this.customer.name) {\n      return this.sendPin(phone)\n    }\n\n    await this.crmBonusRef.setStep(StepFormEnum.STEP_NAME);\n    this.showModal = true;\n  }\n\n  render() {\n    return (\n      <div class=\"section-cart-crm\">\n        <p class=\"text-left fbits-responsive-carrinho-desconto-texto\">Giftback</p>\n        <div class=\"container-button\">\n          {/* <img src={logo} onClick={() => (this.showModal = true)} /> */}\n          {\n            this.canCancel ? <phone-cancel-input value={this.amountCancel} sendPin={() => { this.cancel() }} loading={this.loading} />\n              : <phone-input value={this.customer.phone} sendPin={(phone) => { this.handleSendPin(phone) }} loading={this.loading} />\n          }\n        </div>\n        <p class=\"message-alert\" >{this.message}</p>\n        <app-modal\n          isOpen={this.showModal}\n          modalTitle={`Giftback`}\n          onModalClosed={() => (this.showModal = false)}\n        >\n          <crm-bonus-form\n            loadingModal={this.loading}\n            saveStore={(amount: number) => this.save(amount)}\n            ref={ref => this.crmBonusRef = ref}\n            sent={this.sent}\n            phone={this.phone}\n            cancel={() => this.handleCloseModal()}\n            storeName={this.storeName}\n            products={this.buildProducts()}\n            cartId={this.cartId} customer={this.customer}\n            handleCustomerName={(name: string) => this.sendPinName(name)}\n          />\n        </app-modal>\n      </div>\n    )\n  }\n}\n"]}

package/dist/collection/components/crm-bonus-form/crm-bonus-form.js

@@ -16,10 +16,12 @@ export class CrmBonusForm {
         this.sent = undefined;
         this.stepNext = undefined;
         this.phone = undefined;
+        this.loadingModal = undefined;
         this.saveStore = undefined;
         this.cancel = undefined;
+        this.handleCustomerName = undefined;
         this.loading = false;
-        this.step = StepFormEnum.STEP_RESERVE;
+        this.step = StepFormEnum.STEP_NAME;
         this.message = undefined;
         this.bonus = undefined;
     }
@@ -79,7 +81,7 @@ export class CrmBonusForm {
         this.cancel();
     }
     render() {
-        return (h(Host, { key: '5498ff56b7041d92bf76a31cd8f0d631b989a968' }, this.step === StepFormEnum.STEP_PIN && h("giftback-pin", { key: '1d7b7a077cf859f64d5215eccbdf3b18a030ccb4', cancel: () => this.handleCancel(), sent: this.sent, validate: (data) => this.validateBonus(data), loading: this.loading }), this.step === StepFormEnum.STEP_RESERVE && h("giftback-progress", { key: 'c98f204305d87a64229d8af2316c4dfc9d07ec08', loading: this.loading, cancel: () => this.handleCancel(), bonus: this.bonus, reserve: (amountRedeemed) => this.reserveApply(amountRedeemed) }), this.step === StepFormEnum.STEP_APPLY && h("giftback-finish", { key: '0f7c19a8c5b8ce92566c3de1e68d771dba87c0c8' }), h("p", { key: '8993849d1175c0edb8e8107dd5edc6c011cfe2e6', class: "message-error" }, this.message)));
+        return (h(Host, { key: 'f6a7cd35839626b3c0e2597381e5526cbf169ce3' }, this.step == StepFormEnum.STEP_NAME && h("name-input", { key: '1fe4bbbc3700acb899ce58083a532ad15f48b95b', loading: this.loadingModal, value: this.customer.name, applyName: (name) => this.handleCustomerName(name) }), this.step === StepFormEnum.STEP_PIN && h("giftback-pin", { key: '01b7dca40f3864eee97b3f831e6d764a7486f002', cancel: () => this.handleCancel(), sent: this.sent, validate: (data) => this.validateBonus(data), loading: this.loading }), this.step === StepFormEnum.STEP_RESERVE && h("giftback-progress", { key: '2de9188e93b309ee4fbb84081332d8389f6389c7', loading: this.loading, cancel: () => this.handleCancel(), bonus: this.bonus, reserve: (amountRedeemed) => this.reserveApply(amountRedeemed) }), this.step === StepFormEnum.STEP_APPLY && h("giftback-finish", { key: '35f5e99289da7eefefd282cb5b0df96536c71d72' }), h("p", { key: 'ee33107ba9b3c211d6744d57cd51720d5709e421', class: "message-error" }, this.message)));
     }
     static get is() { return "crm-bonus-form"; }
     static get encapsulation() { return "shadow"; }
@@ -202,7 +204,7 @@ export class CrmBonusForm {
                 "mutable": false,
                 "complexType": {
                     "original": "StepFormEnum",
-                    "resolved": "StepFormEnum.STEP_APPLY | StepFormEnum.STEP_PHONE | StepFormEnum.STEP_PIN | StepFormEnum.STEP_RESERVE",
+                    "resolved": "StepFormEnum.STEP_APPLY | StepFormEnum.STEP_NAME | StepFormEnum.STEP_PHONE | StepFormEnum.STEP_PIN | StepFormEnum.STEP_RESERVE",
                     "references": {
                         "StepFormEnum": {
                             "location": "import",
@@ -237,6 +239,23 @@ export class CrmBonusForm {
                 "attribute": "phone",
                 "reflect": false
             },
+            "loadingModal": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "loading-modal",
+                "reflect": false
+            },
             "saveStore": {
                 "type": "unknown",
                 "mutable": false,
@@ -266,6 +285,21 @@ export class CrmBonusForm {
                     "tags": [],
                     "text": ""
                 }
+            },
+            "handleCustomerName": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "(name: string) => void",
+                    "resolved": "(name: string) => void",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                }
             }
         };
     }

package/dist/collection/components/crm-bonus-form/crm-bonus-form.js.map

@@ -1 +1 @@
-{"version":3,"file":"crm-bonus-form.js","sourceRoot":"","sources":["../../../../src/components/crm-bonus-form/crm-bonus-form.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, Method, Prop, State, h } from \"@stencil/core\";\nimport { CrmBonusService } from \"../../services/crmbonus.service\";\nimport { IBonus, ICustomer, IProccesPinBonusDto, IProduct } from \"../../dto/validate.pin.bonus\";\nimport { StepFormEnum } from \"../../contants\";\nimport { IPinSent } from '../../dto/pin.sent';\n\n@Component({\n    tag: 'crm-bonus-form',\n    styleUrl: 'crm-bonus-form.css',\n    shadow: true\n})\nexport class CrmBonusForm {\n\n    private crmBonusService: CrmBonusService = new CrmBonusService();\n\n    @Prop({ attribute: 'storename' }) storeName;\n    @Prop() cartId;\n    @Prop() products: Array<IProduct>;\n    @Prop() customer: ICustomer = {\n        phone: \"\",\n        birthDate: \"\",\n        document: \"\",\n        name: \"\"\n    };\n    @Prop() sent: IPinSent;\n    @Prop() stepNext: StepFormEnum;\n    @Prop() phone: number;\n\n    @Prop() saveStore: (amount: number) => void;\n\n    @Prop() cancel: () => void;\n\n    @State() loading: boolean = false;\n\n    @State() step: number = StepFormEnum.STEP_RESERVE;\n\n    @State() message: string;\n\n    @State() bonus: IBonus;\n\n    @Method()\n    async setStep(step: StepFormEnum) {\n        this.step = step\n    }\n\n    public async validateBonus(pin: string) {\n        this.loading = true;\n        this.message = \"\";\n        const payload: IProccesPinBonusDto = {\n            pin: pin,\n            cellphone: this.phone.toString(),\n            loja_id: this.sent.storeId,\n            user_id: this.sent.userId,\n            cartId: this.cartId,\n            products: this.products\n        }\n\n        try {\n            this.bonus = await this.crmBonusService.validatePinBonus(payload, this.storeName);\n\n            console.log('[this.bonus]', this.bonus);\n            this.step = StepFormEnum.STEP_RESERVE;\n        } catch (error) {\n            this.message = error?.response?.data?.message\n        } finally {\n            this.loading = false;\n        }\n        console.log('payload', payload)\n    }\n\n    public async reserveApply(amount: number) {\n        this.loading = true;\n        this.message = \"\";\n        try {\n            await this.reserve(amount);\n\n            this.step = StepFormEnum.STEP_APPLY;\n\n            this.saveStore(amount);\n        } catch (error) {\n            this.message = \"ocorreu um error ao solicitar a aplicação do bonus! tente novamente\"\n        } finally {\n            this.loading = false;\n        }\n    }\n\n    public async reserve(amount: number) {\n        await this.crmBonusService.reserve({\n            redeemed_bonus: amount,\n            cart_id: this.cartId,\n            ticket: this.cartId,\n            gross_value: this.bonus.totalValue,\n        }, this.storeName);\n    }\n\n    public handleCancel() {\n        this.step = StepFormEnum.STEP_PHONE;\n        this.cancel()\n    }\n\n    render() {\n        return (\n            <Host>\n                {/* {this.step === StepFormEnum.STEP_PHONE && <phone-input value={this.customer.phone} sendPin={(phone) => this.sendPin(phone)} loading={this.loading} />} */}\n                {this.step === StepFormEnum.STEP_PIN && <giftback-pin cancel={() => this.handleCancel()} sent={this.sent} validate={(data) => this.validateBonus(data)} loading={this.loading} />}\n\n                {this.step === StepFormEnum.STEP_RESERVE && <giftback-progress loading={this.loading} cancel={() => this.handleCancel()} bonus={this.bonus} reserve={(amountRedeemed: number) => this.reserveApply(amountRedeemed)} />}\n                {this.step === StepFormEnum.STEP_APPLY && <giftback-finish />}\n                <p class=\"message-error\">{this.message}</p>\n            </Host>\n        )\n    }\n}"]}
+{"version":3,"file":"crm-bonus-form.js","sourceRoot":"","sources":["../../../../src/components/crm-bonus-form/crm-bonus-form.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, Method, Prop, State, h } from \"@stencil/core\";\nimport { CrmBonusService } from \"../../services/crmbonus.service\";\nimport { IBonus, ICustomer, IProccesPinBonusDto, IProduct } from \"../../dto/validate.pin.bonus\";\nimport { StepFormEnum } from \"../../contants\";\nimport { IPinSent } from '../../dto/pin.sent';\n\n@Component({\n    tag: 'crm-bonus-form',\n    styleUrl: 'crm-bonus-form.css',\n    shadow: true\n})\nexport class CrmBonusForm {\n\n    private crmBonusService: CrmBonusService = new CrmBonusService();\n\n    @Prop({ attribute: 'storename' }) storeName;\n    @Prop() cartId;\n    @Prop() products: Array<IProduct>;\n    @Prop() customer: ICustomer = {\n        phone: \"\",\n        birthDate: \"\",\n        document: \"\",\n        name: \"\"\n    };\n    @Prop() sent: IPinSent;\n    @Prop() stepNext: StepFormEnum;\n    @Prop() phone: number;\n    @Prop() loadingModal: boolean;\n\n    @Prop() saveStore: (amount: number) => void;\n\n    @Prop() cancel: () => void;\n\n    @Prop() handleCustomerName: (name: string) => void;\n\n    @State() loading: boolean = false;\n\n    @State() step: number = StepFormEnum.STEP_NAME;\n\n    @State() message: string;\n\n    @State() bonus: IBonus;\n\n    @Method()\n    async setStep(step: StepFormEnum) {\n        this.step = step\n    }\n\n    public async validateBonus(pin: string) {\n        this.loading = true;\n        this.message = \"\";\n        const payload: IProccesPinBonusDto = {\n            pin: pin,\n            cellphone: this.phone.toString(),\n            loja_id: this.sent.storeId,\n            user_id: this.sent.userId,\n            cartId: this.cartId,\n            products: this.products\n        }\n\n        try {\n            this.bonus = await this.crmBonusService.validatePinBonus(payload, this.storeName);\n\n            console.log('[this.bonus]', this.bonus);\n            this.step = StepFormEnum.STEP_RESERVE;\n        } catch (error) {\n            this.message = error?.response?.data?.message\n        } finally {\n            this.loading = false;\n        }\n        console.log('payload', payload)\n    }\n\n    public async reserveApply(amount: number) {\n        this.loading = true;\n        this.message = \"\";\n        try {\n            await this.reserve(amount);\n\n            this.step = StepFormEnum.STEP_APPLY;\n\n            this.saveStore(amount);\n        } catch (error) {\n            this.message = \"ocorreu um error ao solicitar a aplicação do bonus! tente novamente\"\n        } finally {\n            this.loading = false;\n        }\n    }\n\n    public async reserve(amount: number) {\n        await this.crmBonusService.reserve({\n            redeemed_bonus: amount,\n            cart_id: this.cartId,\n            ticket: this.cartId,\n            gross_value: this.bonus.totalValue,\n        }, this.storeName);\n    }\n\n    public handleCancel() {\n        this.step = StepFormEnum.STEP_PHONE;\n        this.cancel()\n    }\n\n    render() {\n        return (\n            <Host>\n                {/* {this.step === StepFormEnum.STEP_PHONE && <phone-input value={this.customer.phone} sendPin={(phone) => this.sendPin(phone)} loading={this.loading} />} */}\n                \n                {this.step == StepFormEnum.STEP_NAME && <name-input loading={this.loadingModal} value={this.customer.name} applyName={(name) => this.handleCustomerName(name)} />}\n                {this.step === StepFormEnum.STEP_PIN && <giftback-pin cancel={() => this.handleCancel()} sent={this.sent} validate={(data) => this.validateBonus(data)} loading={this.loading} />}\n\n                {this.step === StepFormEnum.STEP_RESERVE && <giftback-progress loading={this.loading} cancel={() => this.handleCancel()} bonus={this.bonus} reserve={(amountRedeemed: number) => this.reserveApply(amountRedeemed)} />}\n                {this.step === StepFormEnum.STEP_APPLY && <giftback-finish />}\n                <p class=\"message-error\">{this.message}</p>\n            </Host>\n        )\n    }\n}"]}

package/dist/collection/components/crm-bonus-form/subcomponents/giftback-finish/giftback-finish.js

@@ -2,7 +2,7 @@ import { h } from "@stencil/core";
 import success from "../../../crm-bonus/assets/svg/success-svgrepo-com.svg";
 export class GiftbackFinish {
     render() {
-        return (h("div", { key: 'e72f82799146a6e94acbdd62324e07cdf9f77009', class: "message-finish" }, h("img", { key: '46e2436a3dbe4745225c3b9674e6bf6c299ad63e', src: success, width: 80 }), h("p", { key: '270e42050956f7f3d1ae9b90f314211fa310f797' }, "Legal! O B\u00F4nus ser\u00E1 aplicado na sua compra.")));
+        return (h("div", { key: '9b4f55d912fec91eeb8a4b885166bef049402ec0', class: "message-finish" }, h("img", { key: '372f7c9feb16579ecdbe5b6bd3f08e5bbe7b5a78', src: success, width: 80 }), h("p", { key: '9560741099089050a2bbe7153c2b69dd4ce085c9' }, "Legal! O B\u00F4nus ser\u00E1 aplicado na sua compra.")));
     }
     static get is() { return "giftback-finish"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/crm-bonus-form/subcomponents/giftback-pin/giftback-pin.js

@@ -30,7 +30,7 @@ export class GiftbackPin {
         }
     }
     render() {
-        return (h("div", { key: '7fe6a9f55ca436ecfcc20f106c1efeddd8387490', class: "form-container-pin" }, h("div", { key: 'aece84fab5ecf94ce5ca90fd1912623dd3c1b9b8' }, h("p", { key: '5134dd8eb3478f59dcfcdca6612e885b76578cba' }, "Insira o PIN de 4 d\u00EDgitos enviado por SMS."), h("div", { key: '8855be06a09925746a5b18323726dd67ec73d7c3', class: "pin-container" }, this.pin.map((_, index) => (h("input", { type: "text", maxLength: 1, value: this.pin[index], onInput: (event) => this.handleInput(event, index) }))))), h("div", { key: '1c5523feb6c9dafbfddd5388170de5fea7627f62', class: "footer-button" }, h("button", { key: '8506cd68998d4ecb76f8a8a262373605a06827de', class: "button-cancel", disabled: this.loading, onClick: () => this.cancel() }, "Cancelar"), h("button", { key: '4dda0af894ad5849ba27d3a4f6c15c80d6c984ae', class: `button ${this.loading ? 'disabled' : ''} `, disabled: this.loading, onClick: () => this.validatePin() }, !this.loading ? "Enviar" : h("loading-spinner", { size: "15px", color: "#fff" })))));
+        return (h("div", { key: 'c6d72e244011769962527f246a429ae11b873d84', class: "form-container-pin" }, h("div", { key: '242f10469a6455338475f9f4e11f4ecee654b7b1' }, h("p", { key: 'f902c5ca022d3672048f102a47cfa3fabf578222' }, "Insira o PIN de 4 d\u00EDgitos enviado por SMS."), h("div", { key: '2498c713571a5c7447a8d9305b8ba3b37d96b04e', class: "pin-container" }, this.pin.map((_, index) => (h("input", { type: "text", maxLength: 1, value: this.pin[index], onInput: (event) => this.handleInput(event, index) }))))), h("div", { key: '19d59cc3b47ab153dc85f9323cd49bc933cfbe5c', class: "footer-button" }, h("button", { key: '9323cfdc0965b3783bad9624b3663c5204e9c979', class: "button-cancel", disabled: this.loading, onClick: () => this.cancel() }, "Cancelar"), h("button", { key: 'e464a6cace10b33d81bf14eefdc4c9b8fc6a753b', class: `button ${this.loading ? 'disabled' : ''} `, disabled: this.loading, onClick: () => this.validatePin() }, !this.loading ? "Enviar" : h("loading-spinner", { size: "15px", color: "#fff" })))));
     }
     static get is() { return "giftback-pin"; }
     static get encapsulation() { return "shadow"; }

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: 'c2fb3f6a887887e197b55e951dbf50054e27e77a', class: "giftback-container" }, h("p", { key: '1d08aaaa1d260f3938e472e95b1e194be50c3987' }, "Voc\u00EA possui at\u00E9 ", h("strong", { key: '99d39bc977a41c9d098c812b61ae41c25342f65c' }, "R$ ", this.bonus.totalBonus.toFixed(2)), " de Giftback nessa compra!"), h("p", { key: '68fc8504eabfdf6e9e873780bb6863521a683e58', class: "validity" }, "V\u00E1lido at\u00E9: ", new Date(this.bonus.firstValidityDate).toLocaleDateString('pt-Br')), h("p", { key: 'fe4c8804f8d577e530330050cfae9c33c2be36d7' }, "Voc\u00EA est\u00E1 utilizando ", h("strong", { key: 'd1d2a6ad0ca1da77e5a4ab9a595af74a11fb9862' }, "R$ ", this.usedValue.toFixed(2)), " nessa compra"), h("div", { key: 'b0eac608016c3136a344c03d456355d7ffcc8dfc', class: "progress-container" }, h("span", { key: 'a88626a3f0d0109fca8b593da05e76f54eb69e28' }, "R$ 0"), h("input", { key: '5d19e34becada60c728f9fce1fa67eede16b7844', disabled: true, type: "range", min: "0", step: "0.01", max: this.bonus.totalBonus, value: this.usedValue, onInput: (event) => this.handleSliderChange(event) }), h("span", { key: '31f0b18eff1ffbd2fb86941653beacad567514ca' }, "R$ ", this.bonus.totalBonus.toFixed(2))), h("p", { key: '5f278047d5bb21282890de0304bc2e8addf8ea43', class: "remaining" }, "Faltam ", h("strong", { key: 'fa220ca91d366eb5e5eec4bf7e94ace4584b0dbe' }, "R$ ", remainingGiftback > 0 ? remainingGiftback.toFixed(2) : Number(0).toFixed(2)), " para utilizar o valor total do Giftback."), h("div", { key: '248c3376e92b8daab0c821e79e083ef6f44bff9e', class: "footer-button-giftback" }, h("button", { key: 'fe612e24a59abed7ef27e6a0425d40efaad218c2', class: "button-cancel", disabled: this.loading, onClick: () => this.cancel() }, "Cancelar"), h("button", { key: '6f86a5b1eeedf01c9eabe9313fdf7b00dc264e96', 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: '50707f64ae18b69d163445a873e5a676d783cd5d', class: "giftback-container" }, h("p", { key: '57b12806322c0d8dbd6f4f3a9199f08cd8552cfe' }, "Voc\u00EA possui at\u00E9 ", h("strong", { key: '9c8b93f8b99455d5d03cd88a2e0e3d601b3b5e8d' }, "R$ ", this.bonus.totalBonus.toFixed(2)), " de Giftback nessa compra!"), h("p", { key: 'e518e6ac4eb0bfa32b5b3d0868096debe4614c9f', class: "validity" }, "V\u00E1lido at\u00E9: ", new Date(this.bonus.firstValidityDate).toLocaleDateString('pt-Br')), h("p", { key: '6f44fc3bffd5e6b6d1532de48cebaa50a3d875ee' }, "Voc\u00EA est\u00E1 utilizando ", h("strong", { key: '8043f0279fb4d0d4814eb17ee898aefb6af2ffd0' }, "R$ ", this.usedValue.toFixed(2)), " nessa compra"), h("div", { key: '3981051ab3bd96b1a64aa875bc8670ed079fa335', class: "progress-container" }, h("span", { key: '2dc247e804ca3025f1db69bc72413f8f9010a6ef' }, "R$ 0"), h("input", { key: '674a8867420b5f36ecd0c4eaa917b9e50d8823ac', disabled: true, type: "range", min: "0", step: "0.01", max: this.bonus.totalBonus, value: this.usedValue, onInput: (event) => this.handleSliderChange(event) }), h("span", { key: '50e13d71a0c7972b0d51742079609594a1b79480' }, "R$ ", this.bonus.totalBonus.toFixed(2))), h("p", { key: 'd6212b01dca380c6566b057175fef396820ad68f', class: "remaining" }, "Faltam ", h("strong", { key: '807117779462b58fc949944bb11b28ebdd8f6c01' }, "R$ ", remainingGiftback > 0 ? remainingGiftback.toFixed(2) : Number(0).toFixed(2)), " para utilizar o valor total do Giftback."), h("div", { key: '7b9052d19750a0b49904e020ddc8316eb3230389', class: "footer-button-giftback" }, h("button", { key: '7bcebd92b0009a3539ef4e7b256d47bfa7da905b', class: "button-cancel", disabled: this.loading, onClick: () => this.cancel() }, "Cancelar"), h("button", { key: '97ea78d1b223b8691ebfee8a99234ca974e436e6', 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"; }

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

@@ -0,0 +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;
+}