crmbonus-component-wake 0.0.15 → 0.0.16

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

@@ -0,0 +1,95 @@
+:host {
+    display: flex;
+    font-family: Arial, sans-serif;
+    /* 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;
+}
+
+.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;
+}
+
+.disabled {
+    opacity: 0.6;
+    cursor: not-allowed;
+}
+
+.footer-button-giftback {
+    display: flex;
+    justify-content: end;
+    margin-top: 14px;
+}

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

@@ -0,0 +1,111 @@
+import { h } from "@stencil/core";
+export class GiftbackProgress {
+    constructor() {
+        this.usedValue = 0;
+        this.loading = false;
+        this.bonus = {
+            totalBonus: 0,
+            cartId: "",
+            minimumPurchase: 0,
+            bonusBalance: 0,
+            calculatedValue: 0,
+            firstValidityDate: ""
+        };
+        this.reserve = undefined;
+    }
+    componentWillLoad() {
+        this.usedValue = parseFloat(this.bonus.bonusBalance.toString());
+    }
+    handleSliderChange(event) {
+        const input = event.target;
+        this.usedValue = parseFloat(input.value);
+    }
+    async handleReserve() {
+        this.reserve(this.usedValue);
+    }
+    render() {
+        const remainingGiftback = this.bonus.minimumPurchase - this.bonus.totalValue;
+        return (h("div", { key: '2776b6595fb2327040dd6367b3a449e548c61071', class: "giftback-container" }, h("p", { key: '4c372a1651a1c47301114eac800ed6b0b4468253' }, "Voc\u00EA possui at\u00E9 ", h("strong", { key: 'dbc855a1f69a7f361b669641a3107845a5eb6c90' }, "R$ ", this.bonus.totalBonus.toFixed(2)), " de Giftback nessa compra!"), h("p", { key: '6cbb90dffbc56eb2154c994535560b806d098357', class: "validity" }, "V\u00E1lido at\u00E9: ", this.bonus.firstValidityDate), h("p", { key: '8627a67e6c50117b11338243b3a75877be933c93' }, "Voc\u00EA est\u00E1 utilizando ", h("strong", { key: '5f33968f5093f8fa4bd3356edaeedd5615e1f8ed' }, "R$ ", this.usedValue.toFixed(2)), " nessa compra"), h("div", { key: '7a0f8ba1f90dc90b63165711ede6ff5b2675cd2a', class: "progress-container" }, h("span", { key: '5ff34809c9bf65da14da6c2d517469f369f9f229' }, "R$ 0"), h("input", { key: '9e6dd1ebc75af146a9c4b3ecb14fdd0b735a2aaf', disabled: true, type: "range", min: "0", step: "0.01", max: this.bonus.totalBonus, value: this.usedValue, onInput: (event) => this.handleSliderChange(event) }), h("span", { key: 'fbec542c319bbe4fbfe949634afadbf8a0767549' }, "R$ ", this.bonus.totalBonus.toFixed(2))), h("p", { key: '89674dea3607e2e3af91a5cb82f5fa85666477f3', class: "remaining" }, "Faltam ", h("strong", { key: '96609b76717648932e71f56d3fbaa30a1cd9c742' }, "R$ ", remainingGiftback > 0 ? remainingGiftback.toFixed(2) : Number(0).toFixed(2)), " para utilizar o valor total do Giftback."), h("div", { key: 'a0b45a1749e930c057aff3025fbff3cad23023fb', class: "footer-button-giftback" }, h("button", { key: 'c8d54cadf35b81e284b5ec052849c3e3b8c13a55', class: `button ${this.loading ? 'disabled' : ''} `, disabled: this.loading, onClick: () => this.handleReserve() }, !this.loading ? "Aplicar" : h("loading-spinner", { size: "10px", color: "#fff" })))));
+    }
+    static get is() { return "giftback-progress"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["giftback-progress.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["giftback-progress.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "loading": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "loading",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "bonus": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "Partial<IBonus>",
+                    "resolved": "{ hasBonus?: boolean; bonusBalance?: number; totalBonus?: number; minimumPurchase?: number; bonusIds?: string; firstValidityDate?: string; history?: [{ validityStart: string; validityEnd: string; value: number; }, { validityStart: string; validityEnd: string; value: number; }]; storeId?: number; userId?: number; cartId?: string; calculatedValue?: number; totalValue?: number; }",
+                    "references": {
+                        "Partial": {
+                            "location": "global",
+                            "id": "global::Partial"
+                        },
+                        "IBonus": {
+                            "location": "import",
+                            "path": "../../../../dto/validate.pin.bonus",
+                            "id": "src/dto/validate.pin.bonus.ts::IBonus"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "defaultValue": "{\n        totalBonus: 0,\n        cartId: \"\",\n        minimumPurchase: 0,\n        bonusBalance: 0,\n        calculatedValue: 0,\n        firstValidityDate: \"\"\n    }"
+            },
+            "reserve": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "(amountRedeemed: number) => void",
+                    "resolved": "(amountRedeemed: number) => void",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                }
+            }
+        };
+    }
+    static get states() {
+        return {
+            "usedValue": {}
+        };
+    }
+}
+//# sourceMappingURL=giftback-progress.js.map

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

@@ -0,0 +1 @@
+{"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;;yBAKI,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;;;IAID,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;QACf,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;IACjC,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,CAAC,KAAK,CAAC,iBAAiB,CAAK;YAElE;;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;;oBAAa,iBAAiB,GAAG,CAAC,CAAC,CAAC,CAAC,iBAAiB,CAAC,OAAO,CAAC,CAAC,CAAC,CAAA,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAU;4DACxG;YAEJ,4DAAK,KAAK,EAAC,wBAAwB;gBAC/B,+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,EAAE,IAE/G,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';\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    // @Prop() maxValue: number = 50; // Valor máximo de Giftback permitido na compra\n    // @Prop() totalGiftback: number = 300; // Valor total disponível de Giftback\n    // @Prop() validityDate: string = '30/10/2024'; // Data de validade\n\n    @State() usedValue: number = 0; // Valor inicial de Giftback utilizado\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\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() {\n        this.reserve(this.usedValue);\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é: {this.bonus.firstValidityDate}</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                    <button class={`button ${this.loading ? 'disabled' : ''} `} disabled={this.loading} onClick={() => this.handleReserve()}>\n                        {\n                            !this.loading ? \"Aplicar\" : <loading-spinner size=\"10px\" color=\"#fff\" />\n                        }\n                    </button>\n                </div>\n            </div>\n        );\n    }\n}\n"]}

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

@@ -0,0 +1,75 @@
+import { h } from "@stencil/core";
+export class PhoneInput {
+    constructor() {
+        this.sendPin = undefined;
+        this.loading = undefined;
+        this.value = undefined;
+    }
+    async validatePhone() {
+        const phone = await this.phoneInputMask.getPhone();
+        await this.sendPin(phone);
+    }
+    render() {
+        return (h("div", { key: 'e61b8c94eadb746b3bb163b58f2eb0d6edb5da2b', class: "form-container" }, h("phone-input-mask", { key: 'bdbf45fc9484c60d0178b3ced6194e8f2b7622a5', initialValue: this.value, ref: ref => this.phoneInputMask = ref }), h("button", { key: '757ab72b47a673bcd27236ef9a50b201a6e75477', class: `button ${this.loading ? 'disabled' : ''} `, disabled: this.loading, onClick: () => this.validatePhone() }, !this.loading ? "validar" : h("loading-spinner", { size: "25px", color: "#fff" }))));
+    }
+    static get is() { return "phone-input"; }
+    static get properties() {
+        return {
+            "sendPin": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "Function",
+                    "resolved": "Function",
+                    "references": {
+                        "Function": {
+                            "location": "global",
+                            "id": "global::Function"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                }
+            },
+            "loading": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "loading",
+                "reflect": false
+            },
+            "value": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "value",
+                "reflect": false
+            }
+        };
+    }
+}
+//# sourceMappingURL=phone.input.js.map

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

@@ -0,0 +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;AAKnD,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,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,EAAE,IAE/G,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})\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={`button ${this.loading ? 'disabled' : ''} `} disabled={this.loading} onClick={() => this.validatePhone()}>\n                    {\n                        !this.loading ? \"validar\" : <loading-spinner size=\"25px\" color=\"#fff\" />\n                    }\n                </button>\n            </div>\n        )\n    }\n}"]}

package/dist/collection/components/loading-spinner/loading-spinner.css

@@ -0,0 +1,17 @@
+.spinner {
+    display: inline-block;
+    border: 4px solid transparent;
+    border-radius: 50%;
+    border-top-color: var(--color, #0078d7);
+    animation: spin 1s linear infinite;
+}
+
+@keyframes spin {
+    0% {
+        transform: rotate(0deg);
+    }
+
+    100% {
+        transform: rotate(360deg);
+    }
+}

package/dist/collection/components/loading-spinner/loading-spinner.js

@@ -0,0 +1,63 @@
+import { h } from "@stencil/core";
+export class LoadingSpinner {
+    constructor() {
+        this.size = '50px';
+        this.color = '#0078d7';
+    }
+    render() {
+        return (h("div", { key: 'b6cf2bbbb16ae4dbaa3850c450b21251f99d4bb6', class: "spinner", style: { width: this.size, height: this.size, borderColor: `${this.color} transparent transparent transparent` } }));
+    }
+    static get is() { return "loading-spinner"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["loading-spinner.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["loading-spinner.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "size": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "size",
+                "reflect": false,
+                "defaultValue": "'50px'"
+            },
+            "color": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "color",
+                "reflect": false,
+                "defaultValue": "'#0078d7'"
+            }
+        };
+    }
+}
+//# sourceMappingURL=loading-spinner.js.map

package/dist/collection/components/loading-spinner/loading-spinner.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"loading-spinner.js","sourceRoot":"","sources":["../../../../src/components/loading-spinner/loading-spinner.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAOnD,MAAM,OAAO,cAAc;;oBACA,MAAM;qBACL,SAAS;;IAEjC,MAAM;QACF,OAAO,CACH,4DAAK,KAAK,EAAC,SAAS,EAAC,KAAK,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,CAAC,IAAI,EAAE,WAAW,EAAE,GAAG,IAAI,CAAC,KAAK,sCAAsC,EAAE,GAAQ,CAChJ,CAAC;IACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, h, Prop } from '@stencil/core';\n\n@Component({\n    tag: 'loading-spinner',\n    styleUrl: 'loading-spinner.css',\n    shadow: true,\n})\nexport class LoadingSpinner {\n    @Prop() size: string = '50px'; // Tamanho do spinner (padrão 50px)\n    @Prop() color: string = '#0078d7'; // Cor do spinner (padrão azul)\n\n    render() {\n        return (\n            <div class=\"spinner\" style={{ width: this.size, height: this.size, borderColor: `${this.color} transparent transparent transparent` }}></div>\n        );\n    }\n}\n"]}

package/dist/collection/components/modal/app-modal.css

@@ -0,0 +1,45 @@
+.modal-backdrop {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background-color: rgba(0, 0, 0, 0.5);
+    display: none;
+    justify-content: center;
+    align-items: center;
+    z-index: 1000;
+  }
+  
+  .modal-backdrop.visible {
+    display: flex;
+  }
+  
+  .modal {
+    background: white;
+    border-radius: 8px;
+    padding: 1rem;
+    max-width: 500px;
+    width: 90%;
+    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
+  }
+  
+  .modal-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    border-bottom: 1px solid #ddd;
+    margin-bottom: 1rem;
+  }
+  
+  .close-button {
+    background: none;
+    border: none;
+    font-size: 1.5rem;
+    cursor: pointer;
+  }
+  
+  .modal-body {
+    /* padding: 1rem 0; */
+  }
+  

package/dist/collection/components/modal/app-modal.js

@@ -0,0 +1,83 @@
+import { h } from "@stencil/core";
+export class AppModal {
+    constructor() {
+        this.isOpen = false;
+        this.modalTitle = undefined;
+    }
+    closeModal() {
+        this.modalClosed.emit();
+    }
+    render() {
+        return (h("div", { key: '401a70f94253ae91a8b478fc90571c29c737e424', class: `modal-backdrop ${this.isOpen ? 'visible' : ''}` }, h("div", { key: 'c3c44a6af1badf5c82ae1839e93a12aa58796e17', class: "modal" }, h("div", { key: '6a496c77ea2ebce8cf69032d2cd4ce5c9d81d06a', class: "modal-header" }, h("h3", { key: 'e7c7dce48247d86143ad80bfb22dde660a778973' }, this.modalTitle), h("button", { key: 'c8bf96f0e4076f32289a6b4b88d16d721dc4cf19', class: "close-button", onClick: () => this.closeModal() }, "\u00D7")), h("div", { key: '23b43b8f0dca9c850fabc0183d4b7f68e8702910', class: "modal-body" }, h("slot", { key: '6d4b908d54be27679dc45daf2c1f0312bd924a17' })))));
+    }
+    static get is() { return "app-modal"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["app-modal.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["app-modal.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "isOpen": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "is-open",
+                "reflect": true,
+                "defaultValue": "false"
+            },
+            "modalTitle": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "modal-title",
+                "reflect": false
+            }
+        };
+    }
+    static get events() {
+        return [{
+                "method": "modalClosed",
+                "name": "modalClosed",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "void",
+                    "resolved": "void",
+                    "references": {}
+                }
+            }];
+    }
+}
+//# sourceMappingURL=app-modal.js.map

package/dist/collection/components/modal/app-modal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"app-modal.js","sourceRoot":"","sources":["../../../../src/components/modal/app-modal.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAgB,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAOxE,MAAM,OAAO,QAAQ;;sBAG0B,KAAK;;;IAQxC,UAAU;QACd,IAAI,CAAC,WAAW,CAAC,IAAI,EAAE,CAAC;IAC5B,CAAC;IAED,MAAM;QACF,OAAO,CACH,4DAAK,KAAK,EAAE,kBAAkB,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,EAAE;YACxD,4DAAK,KAAK,EAAC,OAAO;gBACd,4DAAK,KAAK,EAAC,cAAc;oBACrB,6DAAK,IAAI,CAAC,UAAU,CAAM;oBAC1B,+DAAQ,KAAK,EAAC,cAAc,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,UAAU,EAAE,aAEpD,CACP;gBACN,4DAAK,KAAK,EAAC,YAAY;oBACnB,8DAAQ,CACN,CACJ,CACJ,CACT,CAAA;IACL,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Event, EventEmitter, Prop, h } from \"@stencil/core\";\n\n@Component({\n    tag: 'app-modal',\n    styleUrl: 'app-modal.css',\n    shadow: true,\n})\nexport class AppModal {\n\n    // Controle da visibilidade do modal\n    @Prop({ reflect: true }) isOpen: boolean = false;\n\n    // Título do modal\n    @Prop() modalTitle: string;\n\n    // Evento emitido ao fechar o modal\n    @Event() modalClosed: EventEmitter<void>;\n\n    private closeModal() {\n        this.modalClosed.emit();\n    }\n\n    render() {\n        return (\n            <div class={`modal-backdrop ${this.isOpen ? 'visible' : ''}`}>\n                <div class=\"modal\">\n                    <div class=\"modal-header\">\n                        <h3>{this.modalTitle}</h3>\n                        <button class=\"close-button\" onClick={() => this.closeModal()}>\n                            ×\n                        </button>\n                    </div>\n                    <div class=\"modal-body\">\n                        <slot />\n                    </div>\n                </div>\n            </div>\n        )\n    }\n}"]}

package/dist/collection/components/pedido/pedido.js

@@ -0,0 +1,58 @@
+import { h } from "@stencil/core";
+import { CrmBonusService } from "../../services/crmbonus.service";
+export class Pedido {
+    constructor() {
+        this.cartId = undefined;
+        this.orderId = undefined;
+    }
+    async componentWillLoad() {
+        console.log('this.cartId', this.cartId);
+        console.log('this.orderid', this.orderId);
+        if (this.cartId && this.orderId) {
+            await new CrmBonusService().updateOrder(this.cartId, this.orderId);
+        }
+    }
+    render() {
+        return (h("div", { key: '86d63a792c62b57256fb0b52daadff4302c7cc2a' }));
+    }
+    static get is() { return "pedido-finalizado"; }
+    static get properties() {
+        return {
+            "cartId": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "cartid",
+                "reflect": false
+            },
+            "orderId": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "orderid",
+                "reflect": false
+            }
+        };
+    }
+}
+//# sourceMappingURL=pedido.js.map

package/dist/collection/components/pedido/pedido.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"pedido.js","sourceRoot":"","sources":["../../../../src/components/pedido/pedido.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AACnD,OAAO,EAAE,eAAe,EAAE,MAAM,iCAAiC,CAAC;AAKlE,MAAM,OAAO,MAAM;;;;;IAKf,KAAK,CAAC,iBAAiB;QACnB,OAAO,CAAC,GAAG,CAAC,aAAa,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;QACxC,OAAO,CAAC,GAAG,CAAC,cAAc,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC;QAC1C,IAAG,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,OAAO,EAAE,CAAC;YAC7B,MAAM,IAAI,eAAe,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC,MAAM,EAAE,IAAI,CAAC,OAAO,CAAC,CAAA;QACtE,CAAC;IACL,CAAC;IAED,MAAM;QACF,OAAO,CACH,6DAAW,CACd,CAAA;IACL,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Prop, h } from \"@stencil/core\";\nimport { CrmBonusService } from \"../../services/crmbonus.service\";\n\n@Component({\n    tag: \"pedido-finalizado\"\n})\nexport class Pedido {\n\n    @Prop({ attribute:\"cartid\" }) cartId: string;\n    @Prop({ attribute:\"orderid\" }) orderId: number;\n\n    async componentWillLoad() {\n        console.log('this.cartId', this.cartId);\n        console.log('this.orderid', this.orderId);\n        if(this.cartId && this.orderId) {\n            await new CrmBonusService().updateOrder(this.cartId, this.orderId)\n        }\n    }\n\n    render() {\n        return (\n            <div></div>\n        )\n    }\n}"]}

package/dist/collection/components/phone/phone-input-mask.css

@@ -0,0 +1,47 @@
+.inline-text-field-container {
+    display: flex;
+    flex-direction: column;
+}
+
+@supports (top: max(0%)) {
+    .mdc-text-field--outlined {
+        padding-right: max(16px, var(--mdc-shape-small, 4px));
+    }
+}
+
+@supports (top: max(0%)) {
+    .mdc-text-field--outlined {
+        padding-left: max(16px, calc(var(--mdc-shape-small, 4px) + 4px));
+    }
+}
+
+.mdc-text-field--outlined {
+    height: 55px;
+    overflow: visible;
+}
+
+.phone {
+    width: 300px;
+    height: 50px;
+    font-size: 18px;
+    padding: 10px;
+    color: grey;
+    border: 1px solid #d3c6c6;
+    outline: none;
+}
+
+.mdc-text-field {
+    border-top-left-radius: 4px;
+    border-top-left-radius: var(--mdc-shape-small, 4px);
+    border-top-right-radius: 4px;
+    border-top-right-radius: var(--mdc-shape-small, 4px);
+    border-bottom-right-radius: 0;
+    border-bottom-left-radius: 0;
+    display: inline-flex;
+    align-items: baseline;
+    padding: 0 16px;
+    position: relative;
+    box-sizing: border-box;
+    overflow: hidden;
+    will-change: opacity, transform, color;
+}