@rededor/cura 1.7.1 → 1.8.0

package/dist/collection/components/badges/cura-badge-counter/cura-badge-counter.js

@@ -2,13 +2,22 @@ import { Host, h } from "@stencil/core";
 export class CuraBadgeNumber {
     constructor() {
         this.theme = window.CuraAPI.theme;
-        this.labelColor = 'primary-darker';
-        this.bgColorName = 'primary-lighter';
-        this.number = undefined;
+        /**
+         * Cor fundamental do design system sem profundidade.
+         * Ex.: primary (padrão)
+         */
         this.color = 'primary';
+        /**
+         * Define o estado do badge como desabilitado ou habilitado.
+         */
         this.disabled = false;
+        /**
+         * Define o estilo visual entre solid (default), outline ou transparent.
+         */
         this.type = 'solid';
         this.styles = {};
+        this.labelColor = 'primary-darker';
+        this.bgColorName = 'primary-lighter';
     }
     handleColorChange() {
         this.setColors();
@@ -57,6 +66,7 @@ export class CuraBadgeNumber {
         return {
             "number": {
                 "type": "number",
+                "attribute": "number",
                 "mutable": false,
                 "complexType": {
                     "original": "number | null",
@@ -69,11 +79,13 @@ export class CuraBadgeNumber {
                     "tags": [],
                     "text": "N\u00FAmero a ser representado no badge.\nApresentar\u00E1 99+ para n\u00FAmeros acima desse valor."
                 },
-                "attribute": "number",
+                "getter": false,
+                "setter": false,
                 "reflect": true
             },
             "color": {
                 "type": "string",
+                "attribute": "color",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -86,12 +98,14 @@ export class CuraBadgeNumber {
                     "tags": [],
                     "text": "Cor fundamental do design system sem profundidade.\nEx.: primary (padr\u00E3o)"
                 },
-                "attribute": "color",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "'primary'"
             },
             "disabled": {
                 "type": "boolean",
+                "attribute": "disabled",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -104,12 +118,14 @@ export class CuraBadgeNumber {
                     "tags": [],
                     "text": "Define o estado do badge como desabilitado ou habilitado."
                 },
-                "attribute": "disabled",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "false"
             },
             "type": {
                 "type": "string",
+                "attribute": "type",
                 "mutable": false,
                 "complexType": {
                     "original": "'solid' | 'outline' | 'transparent' | string",
@@ -122,7 +138,8 @@ export class CuraBadgeNumber {
                     "tags": [],
                     "text": "Define o estilo visual entre solid (default), outline ou transparent."
                 },
-                "attribute": "type",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "'solid'"
             }

package/dist/collection/components/badges/cura-badge-counter/cura-badge-counter.js.map

@@ -1 +1 @@
-{"version":3,"file":"cura-badge-counter.js","sourceRoot":"","sources":["../../../../src/components/badges/cura-badge-counter/cura-badge-counter.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAOvE,MAAM,OAAO,eAAe;;QAE1B,UAAK,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC;QAqB7B,eAAU,GAAG,gBAAgB,CAAC;QAC9B,gBAAW,GAAG,iBAAiB,CAAC;;qBAZR,SAAS;wBAIL,KAAK;oBAI4B,OAAO;sBAElD,EAAE;;IAOpB,iBAAiB;QACf,IAAI,CAAC,SAAS,EAAE,CAAC;IACnB,CAAC;IAED,SAAS;QACP,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC;QACvC,mCAAmC;QACnC,IAAI,IAAI,CAAC,IAAI,KAAK,SAAS,IAAI,IAAI,CAAC,IAAI,KAAK,aAAa,EAAE,CAAC;YAC3D,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,GAAG,KAAK,OAAO,CAAC;YACtE,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,WAAW,CAAC;YACrC,2BAA2B;QAC3B,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,WAAW,GAAG,KAAK,KAAK,SAAS,IAAI,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,GAAG,KAAK,UAAU,CAAC;YAC9F,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,GAAG,KAAK,OAAO,CAAC;QACvE,CAAC;QACD,IAAI,CAAC,MAAM,mCACN,IAAI,CAAC,MAAM,KACd,oBAAoB,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,GAAG,IAAI,CAAC,WAAW,EAAE,CAAC,GACxE,CAAA;IACH,CAAC;IAED,iBAAiB;QACf,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC;QAChE,IAAI,CAAC,SAAS,EAAE,CAAC;IACnB,CAAC;IAED,UAAU;QACR,MAAM,OAAO,GAAG;YACd,WAAW,EAAE,IAAI;SAClB,CAAC;QACF,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,GAAG,IAAI,CAAC;QACxC,OAAO,OAAO,CAAC;IACjB,CAAC;IAGD,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,uDACD,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,MAAM,IAAI,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CACzC,WAAK,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,MAAM;YAC/C,kBAAY,IAAI,EAAC,QAAQ,iBAAa,MAAM,EAAC,KAAK,EAAE,IAAI,CAAC,UAAU,IAChE,IAAI,CAAC,MAAM,IAAI,GAAG,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,MAAM,CAC9B,CACT,CACL,CACI,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, Prop, h, State, Watch } from '@stencil/core';\n\n@Component({\n  tag: 'cura-badge-counter',\n  styleUrl: 'cura-badge-counter.scss',\n  shadow: true,\n})\nexport class CuraBadgeNumber {\n\n  theme = window.CuraAPI.theme;\n\n  /** Número a ser representado no badge.\n   * Apresentará 99+ para números acima desse valor.\n   */\n  @Prop({ reflect: true }) number: number | null;\n  /**\n   * Cor fundamental do design system sem profundidade.\n   * Ex.: primary (padrão)\n   */\n  @Prop() color: string = 'primary';\n  /**\n   * Define o estado do badge como desabilitado ou habilitado.\n   */\n  @Prop() disabled: boolean = false;\n  /**\n   * Define o estilo visual entre solid (default), outline ou transparent.\n   */\n  @Prop() type: 'solid' | 'outline' | 'transparent' | string = 'solid';\n\n  @State() styles = {};\n  labelColor = 'primary-darker';\n  bgColorName = 'primary-lighter';\n\n  @Watch(\"disabled\")\n  @Watch(\"color\")\n  @Watch(\"type\")\n  handleColorChange() {\n    this.setColors();\n  }\n\n  setColors() {\n    const color = this.color.toLowerCase();\n    /** type outline and transparent */\n    if (this.type === 'outline' || this.type === 'transparent') {\n      this.bgColorName = this.disabled ? `neutral-medium` : `${color}-dark`;\n      this.labelColor = this.bgColorName;\n    /** type solid - default */\n    } else {\n      this.bgColorName = color === 'neutral' || this.disabled ? `neutral-pale` : `${color}-lighter`;\n      this.labelColor = this.disabled ? 'neutral-medium' : `${color}-dark`;\n    }\n    this.styles = {\n      ...this.styles,\n      '--background-color': this.theme.colors.getColor(`${this.bgColorName}`),\n    }\n  }\n\n  connectedCallback() {\n    this.styles['--base-spacing'] = this.theme.spacing.getSpacing();\n    this.setColors();\n  }\n\n  getClasses() {\n    const classes = {\n      'container': true\n    };\n    classes[this.type.toLowerCase()] = true;\n    return classes;\n  }\n\n\n  render() {\n    return (\n      <Host>\n        { this.number && this.number <= 0 ? '' : (\n        <div class={this.getClasses()} style={this.styles}>\n          <cura-label size=\"xsmall\" line-height=\"none\" color={this.labelColor}>\n            {this.number >= 100 ? '99+' : this.number}\n          </cura-label>\n        </div>\n        )}\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"cura-badge-counter.js","sourceRoot":"","sources":["../../../../src/components/badges/cura-badge-counter/cura-badge-counter.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAOvE,MAAM,OAAO,eAAe;IAL5B;QAOE,UAAK,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC;QAM7B;;;WAGG;QACK,UAAK,GAAW,SAAS,CAAC;QAClC;;WAEG;QACK,aAAQ,GAAY,KAAK,CAAC;QAClC;;WAEG;QACK,SAAI,GAAiD,OAAO,CAAC;QAE5D,WAAM,GAAG,EAAE,CAAC;QACrB,eAAU,GAAG,gBAAgB,CAAC;QAC9B,gBAAW,GAAG,iBAAiB,CAAC;KAqDjC;IAhDC,iBAAiB;QACf,IAAI,CAAC,SAAS,EAAE,CAAC;IACnB,CAAC;IAED,SAAS;QACP,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC;QACvC,mCAAmC;QACnC,IAAI,IAAI,CAAC,IAAI,KAAK,SAAS,IAAI,IAAI,CAAC,IAAI,KAAK,aAAa,EAAE,CAAC;YAC3D,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,GAAG,KAAK,OAAO,CAAC;YACtE,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,WAAW,CAAC;YACrC,2BAA2B;QAC3B,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,WAAW,GAAG,KAAK,KAAK,SAAS,IAAI,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,GAAG,KAAK,UAAU,CAAC;YAC9F,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,GAAG,KAAK,OAAO,CAAC;QACvE,CAAC;QACD,IAAI,CAAC,MAAM,mCACN,IAAI,CAAC,MAAM,KACd,oBAAoB,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,GAAG,IAAI,CAAC,WAAW,EAAE,CAAC,GACxE,CAAA;IACH,CAAC;IAED,iBAAiB;QACf,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC;QAChE,IAAI,CAAC,SAAS,EAAE,CAAC;IACnB,CAAC;IAED,UAAU;QACR,MAAM,OAAO,GAAG;YACd,WAAW,EAAE,IAAI;SAClB,CAAC;QACF,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,GAAG,IAAI,CAAC;QACxC,OAAO,OAAO,CAAC;IACjB,CAAC;IAGD,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,uDACD,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,MAAM,IAAI,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CACzC,WAAK,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,MAAM;YAC/C,kBAAY,IAAI,EAAC,QAAQ,iBAAa,MAAM,EAAC,KAAK,EAAE,IAAI,CAAC,UAAU,IAChE,IAAI,CAAC,MAAM,IAAI,GAAG,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,MAAM,CAC9B,CACT,CACL,CACI,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, Prop, h, State, Watch } from '@stencil/core';\n\n@Component({\n  tag: 'cura-badge-counter',\n  styleUrl: 'cura-badge-counter.scss',\n  shadow: true,\n})\nexport class CuraBadgeNumber {\n\n  theme = window.CuraAPI.theme;\n\n  /** Número a ser representado no badge.\n   * Apresentará 99+ para números acima desse valor.\n   */\n  @Prop({ reflect: true }) number: number | null;\n  /**\n   * Cor fundamental do design system sem profundidade.\n   * Ex.: primary (padrão)\n   */\n  @Prop() color: string = 'primary';\n  /**\n   * Define o estado do badge como desabilitado ou habilitado.\n   */\n  @Prop() disabled: boolean = false;\n  /**\n   * Define o estilo visual entre solid (default), outline ou transparent.\n   */\n  @Prop() type: 'solid' | 'outline' | 'transparent' | string = 'solid';\n\n  @State() styles = {};\n  labelColor = 'primary-darker';\n  bgColorName = 'primary-lighter';\n\n  @Watch(\"disabled\")\n  @Watch(\"color\")\n  @Watch(\"type\")\n  handleColorChange() {\n    this.setColors();\n  }\n\n  setColors() {\n    const color = this.color.toLowerCase();\n    /** type outline and transparent */\n    if (this.type === 'outline' || this.type === 'transparent') {\n      this.bgColorName = this.disabled ? `neutral-medium` : `${color}-dark`;\n      this.labelColor = this.bgColorName;\n    /** type solid - default */\n    } else {\n      this.bgColorName = color === 'neutral' || this.disabled ? `neutral-pale` : `${color}-lighter`;\n      this.labelColor = this.disabled ? 'neutral-medium' : `${color}-dark`;\n    }\n    this.styles = {\n      ...this.styles,\n      '--background-color': this.theme.colors.getColor(`${this.bgColorName}`),\n    }\n  }\n\n  connectedCallback() {\n    this.styles['--base-spacing'] = this.theme.spacing.getSpacing();\n    this.setColors();\n  }\n\n  getClasses() {\n    const classes = {\n      'container': true\n    };\n    classes[this.type.toLowerCase()] = true;\n    return classes;\n  }\n\n\n  render() {\n    return (\n      <Host>\n        { this.number && this.number <= 0 ? '' : (\n        <div class={this.getClasses()} style={this.styles}>\n          <cura-label size=\"xsmall\" line-height=\"none\" color={this.labelColor}>\n            {this.number >= 100 ? '99+' : this.number}\n          </cura-label>\n        </div>\n        )}\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/badges/cura-badge-distance/cura-badge-distance.js

@@ -1,12 +1,12 @@
 import { Host, h } from "@stencil/core";
 export class CuraDistance {
     constructor() {
-        this.isThousandRounded = false;
-        this.theme = window.CuraAPI.theme;
         this.distance = 0;
         this.label = 'km';
         this.styles = {};
         this.displayDistance = 0;
+        this.isThousandRounded = false;
+        this.theme = window.CuraAPI.theme;
     }
     formatDistance() {
         const roundedDistance = this.distance % 1 !== 0 ? parseFloat(this.distance.toFixed(1)) : this.distance;
@@ -42,6 +42,7 @@ export class CuraDistance {
         return {
             "distance": {
                 "type": "number",
+                "attribute": "distance",
                 "mutable": false,
                 "complexType": {
                     "original": "number",
@@ -54,12 +55,14 @@ export class CuraDistance {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "distance",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "0"
             },
             "label": {
                 "type": "string",
+                "attribute": "label",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -72,7 +75,8 @@ export class CuraDistance {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "label",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
                 "defaultValue": "'km'"
             }

package/dist/collection/components/badges/cura-badge-distance/cura-badge-distance.js.map

@@ -1 +1 @@
-{"version":3,"file":"cura-badge-distance.js","sourceRoot":"","sources":["../../../../src/components/badges/cura-badge-distance/cura-badge-distance.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAOvE,MAAM,OAAO,YAAY;;QAMvB,sBAAiB,GAAG,KAAK,CAAC;QAE1B,UAAK,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC;wBANV,CAAC;qBACa,IAAI;sBACnB,EAAE;+BACO,CAAC;;IAM5B,cAAc;QACZ,MAAM,eAAe,GAAG,IAAI,CAAC,QAAQ,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC;QACvG,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC,GAAG,CAAC,eAAe,CAAC,IAAI,IAAI,CAAC;QAC3D,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,eAAe,GAAG,IAAI,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,eAAe,CAAC;IACpH,CAAC;IAGD,iBAAiB;QACf,IAAI,CAAC,gBAAgB,EAAE,CAAC;QACxB,IAAI,CAAC,cAAc,EAAE,CAAC;IACxB,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,4DAAK,KAAK,EAAC,WAAW,EAAC,KAAK,EAAE,IAAI,CAAC,MAAM;gBACvC,mEAAY,IAAI,EAAC,QAAQ,EAAC,MAAM,EAAC,MAAM,EAAC,KAAK,EAAC,eAAe;oBAC1D,IAAI,CAAC,eAAe;oBAAE,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAC7C;gBACb,mEAAY,IAAI,EAAC,QAAQ,EAAC,MAAM,EAAC,MAAM,EAAC,KAAK,EAAC,cAAc,IACzD,IAAI,CAAC,KAAK,CACA,CACT,CACD,CACR,CAAC;IACJ,CAAC;IAED,gBAAgB;QACd,IAAI,CAAC,MAAM,GAAG;YACZ,gBAAgB,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,cAAc,CAAC;YAC5D,gBAAgB,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,UAAU,EAAE;SAClD,CAAA;IACH,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAEF","sourcesContent":["import { Component, Host, Prop, State, Watch, h } from '@stencil/core';\n\n@Component({\n  tag: 'cura-badge-distance',\n  styleUrl: 'cura-badge-distance.scss',\n  shadow: true,\n})\nexport class CuraDistance {\n\n  @Prop() distance = 0;\n  @Prop({ reflect: true }) label = 'km';\n  @State() styles = {};\n  @State() displayDistance = 0;\n  isThousandRounded = false;\n\n  theme = window.CuraAPI.theme;\n\n  @Watch('distance')\n  formatDistance() {\n    const roundedDistance = this.distance % 1 !== 0 ? parseFloat(this.distance.toFixed(1)) : this.distance;    \n    this.isThousandRounded = Math.abs(roundedDistance) >= 1000;\n    this.displayDistance = this.isThousandRounded ? parseFloat((roundedDistance / 1000).toFixed(1)) : roundedDistance;\n  }\n\n\n  connectedCallback(){\n    this.setCssProperties();\n    this.formatDistance();    \n  }\n\n  render() {\n    return (\n      <Host>\n        <div class=\"container\" style={this.styles}>\n          <cura-label size='xsmall' weight='bold' color='neutral-black'>\n            {this.displayDistance}{this.isThousandRounded ? 'K' : ''}\n          </cura-label>\n          <cura-label size='xsmall' weight='bold' color='neutral-dark'>\n            {this.label}\n          </cura-label>\n        </div>\n      </Host>\n    );\n  }\n\n  setCssProperties() {\n    this.styles = {\n      '--neutral-pale': this.theme.colors.getColor(`neutral-pale`),\n      '--base-spacing': this.theme.spacing.getSpacing()\n    }\n  }\n\n}\n"]}
+{"version":3,"file":"cura-badge-distance.js","sourceRoot":"","sources":["../../../../src/components/badges/cura-badge-distance/cura-badge-distance.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAOvE,MAAM,OAAO,YAAY;IALzB;QAOU,aAAQ,GAAG,CAAC,CAAC;QACI,UAAK,GAAG,IAAI,CAAC;QAC7B,WAAM,GAAG,EAAE,CAAC;QACZ,oBAAe,GAAG,CAAC,CAAC;QAC7B,sBAAiB,GAAG,KAAK,CAAC;QAE1B,UAAK,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC;KAqC9B;IAlCC,cAAc;QACZ,MAAM,eAAe,GAAG,IAAI,CAAC,QAAQ,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC;QACvG,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC,GAAG,CAAC,eAAe,CAAC,IAAI,IAAI,CAAC;QAC3D,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,eAAe,GAAG,IAAI,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,eAAe,CAAC;IACpH,CAAC;IAGD,iBAAiB;QACf,IAAI,CAAC,gBAAgB,EAAE,CAAC;QACxB,IAAI,CAAC,cAAc,EAAE,CAAC;IACxB,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,4DAAK,KAAK,EAAC,WAAW,EAAC,KAAK,EAAE,IAAI,CAAC,MAAM;gBACvC,mEAAY,IAAI,EAAC,QAAQ,EAAC,MAAM,EAAC,MAAM,EAAC,KAAK,EAAC,eAAe;oBAC1D,IAAI,CAAC,eAAe;oBAAE,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAC7C;gBACb,mEAAY,IAAI,EAAC,QAAQ,EAAC,MAAM,EAAC,MAAM,EAAC,KAAK,EAAC,cAAc,IACzD,IAAI,CAAC,KAAK,CACA,CACT,CACD,CACR,CAAC;IACJ,CAAC;IAED,gBAAgB;QACd,IAAI,CAAC,MAAM,GAAG;YACZ,gBAAgB,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,cAAc,CAAC;YAC5D,gBAAgB,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,UAAU,EAAE;SAClD,CAAA;IACH,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAEF","sourcesContent":["import { Component, Host, Prop, State, Watch, h } from '@stencil/core';\n\n@Component({\n  tag: 'cura-badge-distance',\n  styleUrl: 'cura-badge-distance.scss',\n  shadow: true,\n})\nexport class CuraDistance {\n\n  @Prop() distance = 0;\n  @Prop({ reflect: true }) label = 'km';\n  @State() styles = {};\n  @State() displayDistance = 0;\n  isThousandRounded = false;\n\n  theme = window.CuraAPI.theme;\n\n  @Watch('distance')\n  formatDistance() {\n    const roundedDistance = this.distance % 1 !== 0 ? parseFloat(this.distance.toFixed(1)) : this.distance;    \n    this.isThousandRounded = Math.abs(roundedDistance) >= 1000;\n    this.displayDistance = this.isThousandRounded ? parseFloat((roundedDistance / 1000).toFixed(1)) : roundedDistance;\n  }\n\n\n  connectedCallback(){\n    this.setCssProperties();\n    this.formatDistance();    \n  }\n\n  render() {\n    return (\n      <Host>\n        <div class=\"container\" style={this.styles}>\n          <cura-label size='xsmall' weight='bold' color='neutral-black'>\n            {this.displayDistance}{this.isThousandRounded ? 'K' : ''}\n          </cura-label>\n          <cura-label size='xsmall' weight='bold' color='neutral-dark'>\n            {this.label}\n          </cura-label>\n        </div>\n      </Host>\n    );\n  }\n\n  setCssProperties() {\n    this.styles = {\n      '--neutral-pale': this.theme.colors.getColor(`neutral-pale`),\n      '--base-spacing': this.theme.spacing.getSpacing()\n    }\n  }\n\n}\n"]}

package/dist/collection/components/badges/cura-badge-dot/cura-badge-dot.js

@@ -2,8 +2,18 @@ import { Host, h } from "@stencil/core";
 export class CuraBadgeDot {
     constructor() {
         this.theme = window.CuraAPI.theme;
+        /**
+         * Cor fundamental do design system sem profundidade.
+         * Ex.: primary (padrão)
+         */
         this.color = 'primary';
+        /**
+         * Define o estado do badge como desabilitado ou habilitado.
+         */
         this.disabled = false;
+        /**
+         * Define o estilo visual entre solid (default), outline ou transparent.
+         */
         this.type = 'solid';
         this.styles = {};
     }
@@ -45,6 +55,7 @@ export class CuraBadgeDot {
         return {
             "color": {
                 "type": "string",
+                "attribute": "color",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -57,12 +68,14 @@ export class CuraBadgeDot {
                     "tags": [],
                     "text": "Cor fundamental do design system sem profundidade.\nEx.: primary (padr\u00E3o)"
                 },
-                "attribute": "color",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "'primary'"
             },
             "disabled": {
                 "type": "boolean",
+                "attribute": "disabled",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -75,12 +88,14 @@ export class CuraBadgeDot {
                     "tags": [],
                     "text": "Define o estado do badge como desabilitado ou habilitado."
                 },
-                "attribute": "disabled",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
                 "defaultValue": "false"
             },
             "type": {
                 "type": "string",
+                "attribute": "type",
                 "mutable": false,
                 "complexType": {
                     "original": "'solid' | 'outline' | 'transparent' | string",
@@ -93,7 +108,8 @@ export class CuraBadgeDot {
                     "tags": [],
                     "text": "Define o estilo visual entre solid (default), outline ou transparent."
                 },
-                "attribute": "type",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
                 "defaultValue": "'solid'"
             }

package/dist/collection/components/badges/cura-badge-dot/cura-badge-dot.js.map

@@ -1 +1 @@
-{"version":3,"file":"cura-badge-dot.js","sourceRoot":"","sources":["../../../../src/components/badges/cura-badge-dot/cura-badge-dot.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAOhE,MAAM,OAAO,YAAY;;QAEvB,UAAK,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC;qBAML,SAAS;wBAIU,KAAK;oBAI4B,OAAO;sBAEjE,EAAE;;IAGpB,iBAAiB;QACf,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC;QAChE,IAAI,CAAC,MAAM,CAAC,kBAAkB,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,cAAc,CAAC,CAAC;QAAA,CAAC;QAC9E,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,cAAc,CAAC,CAAC;QAAA,CAAC;QAC5E,IAAI,CAAC,SAAS,EAAE,CAAC;IACnB,CAAC;IAED,SAAS;QACP,IAAI,CAAC,MAAM,mCACN,IAAI,CAAC,MAAM,KACd,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,GAAG,IAAI,CAAC,KAAK,EAAE,CAAC,EACtD,cAAc,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,GAAG,IAAI,CAAC,KAAK,OAAO,CAAC,GACjE,CAAA;IACH,CAAC;IAED,UAAU;QACR,MAAM,OAAO,GAAG;YACd,WAAW,EAAE,IAAI;YACjB,UAAU,EAAE,IAAI,CAAC,QAAQ;SAC1B,CAAC;QACF,OAAO,CAAC,GAAG,IAAI,CAAC,IAAI,EAAE,CAAC,GAAG,IAAI,CAAC;QAC/B,OAAO,OAAO,CAAC;IACjB,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,4DAAK,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,MAAM,GAAQ,CACpD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, h, Prop, State } from '@stencil/core';\n\n@Component({\n  tag: 'cura-badge-dot',\n  styleUrl: 'cura-badge-dot.scss',\n  shadow: true,\n})\nexport class CuraBadgeDot {\n\n  theme = window.CuraAPI.theme;\n\n  /**\n   * Cor fundamental do design system sem profundidade.\n   * Ex.: primary (padrão)\n   */\n  @Prop() color: string = 'primary';\n  /**\n   * Define o estado do badge como desabilitado ou habilitado.\n   */\n  @Prop({reflect: true}) disabled: boolean = false;\n  /**\n   * Define o estilo visual entre solid (default), outline ou transparent.\n   */\n  @Prop({reflect: true}) type: 'solid' | 'outline' | 'transparent' | string = 'solid';\n\n  @State() styles = {};\n\n\n  connectedCallback() {\n    this.styles['--base-spacing'] = this.theme.spacing.getSpacing();\n    this.styles['--neutral-medium'] = this.theme.colors.getColor('neutral-dark');;\n    this.styles['--neutral-pale'] = this.theme.colors.getColor('neutral-pale');;\n    this.setColors();\n  }\n\n  setColors() {\n    this.styles = {\n      ...this.styles,\n      '--color': this.theme.colors.getColor(`${this.color}`),\n      '--color-dark': this.theme.colors.getColor(`${this.color}-dark`)\n    }\n  }\n\n  getClasses() {\n    const classes = {\n      'container': true,\n      'disabled': this.disabled\n    };\n    classes[`${this.type}`] = true;\n    return classes;\n  }\n\n  render() {\n    return (\n      <Host>\n        <div class={this.getClasses()} style={this.styles}></div>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"cura-badge-dot.js","sourceRoot":"","sources":["../../../../src/components/badges/cura-badge-dot/cura-badge-dot.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAOhE,MAAM,OAAO,YAAY;IALzB;QAOE,UAAK,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC;QAE7B;;;WAGG;QACK,UAAK,GAAW,SAAS,CAAC;QAClC;;WAEG;QACoB,aAAQ,GAAY,KAAK,CAAC;QACjD;;WAEG;QACoB,SAAI,GAAiD,OAAO,CAAC;QAE3E,WAAM,GAAG,EAAE,CAAC;KAkCtB;IA/BC,iBAAiB;QACf,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC;QAChE,IAAI,CAAC,MAAM,CAAC,kBAAkB,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,cAAc,CAAC,CAAC;QAAA,CAAC;QAC9E,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,cAAc,CAAC,CAAC;QAAA,CAAC;QAC5E,IAAI,CAAC,SAAS,EAAE,CAAC;IACnB,CAAC;IAED,SAAS;QACP,IAAI,CAAC,MAAM,mCACN,IAAI,CAAC,MAAM,KACd,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,GAAG,IAAI,CAAC,KAAK,EAAE,CAAC,EACtD,cAAc,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,GAAG,IAAI,CAAC,KAAK,OAAO,CAAC,GACjE,CAAA;IACH,CAAC;IAED,UAAU;QACR,MAAM,OAAO,GAAG;YACd,WAAW,EAAE,IAAI;YACjB,UAAU,EAAE,IAAI,CAAC,QAAQ;SAC1B,CAAC;QACF,OAAO,CAAC,GAAG,IAAI,CAAC,IAAI,EAAE,CAAC,GAAG,IAAI,CAAC;QAC/B,OAAO,OAAO,CAAC;IACjB,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,4DAAK,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,MAAM,GAAQ,CACpD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, h, Prop, State } from '@stencil/core';\n\n@Component({\n  tag: 'cura-badge-dot',\n  styleUrl: 'cura-badge-dot.scss',\n  shadow: true,\n})\nexport class CuraBadgeDot {\n\n  theme = window.CuraAPI.theme;\n\n  /**\n   * Cor fundamental do design system sem profundidade.\n   * Ex.: primary (padrão)\n   */\n  @Prop() color: string = 'primary';\n  /**\n   * Define o estado do badge como desabilitado ou habilitado.\n   */\n  @Prop({reflect: true}) disabled: boolean = false;\n  /**\n   * Define o estilo visual entre solid (default), outline ou transparent.\n   */\n  @Prop({reflect: true}) type: 'solid' | 'outline' | 'transparent' | string = 'solid';\n\n  @State() styles = {};\n\n\n  connectedCallback() {\n    this.styles['--base-spacing'] = this.theme.spacing.getSpacing();\n    this.styles['--neutral-medium'] = this.theme.colors.getColor('neutral-dark');;\n    this.styles['--neutral-pale'] = this.theme.colors.getColor('neutral-pale');;\n    this.setColors();\n  }\n\n  setColors() {\n    this.styles = {\n      ...this.styles,\n      '--color': this.theme.colors.getColor(`${this.color}`),\n      '--color-dark': this.theme.colors.getColor(`${this.color}-dark`)\n    }\n  }\n\n  getClasses() {\n    const classes = {\n      'container': true,\n      'disabled': this.disabled\n    };\n    classes[`${this.type}`] = true;\n    return classes;\n  }\n\n  render() {\n    return (\n      <Host>\n        <div class={this.getClasses()} style={this.styles}></div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/badges/cura-badge-pill/cura-badge-pill.js

@@ -1,15 +1,32 @@
 import { Host, h } from "@stencil/core";
 export class CuraBadgePill {
     constructor() {
-        this.theme = window.CuraAPI.theme;
+        /**
+         * Badge type: solid | outline | transparent
+         */
         this.type = 'solid';
+        /**
+         * Color base from color scheme. Default: primary
+         */
         this.color = 'primary';
-        this.iconName = undefined;
+        /**
+         * Custom iconset if needed
+         */
         this.iconset = 'default';
+        /**
+         * Disabled state. Boolean
+         */
         this.disabled = false;
+        /**
+         * Set badge to icon only. Boolean
+         */
         this.iconOnly = false;
+        /**
+         * Set border-radius.
+         */
         this.borderRadius = '2px';
         this.styles = {};
+        this.theme = window.CuraAPI.theme;
     }
     watchColorChange() {
         this.setColors();
@@ -75,6 +92,7 @@ export class CuraBadgePill {
         return {
             "type": {
                 "type": "string",
+                "attribute": "type",
                 "mutable": false,
                 "complexType": {
                     "original": "'solid' | 'outline' | 'transparent'",
@@ -87,12 +105,14 @@ export class CuraBadgePill {
                     "tags": [],
                     "text": "Badge type: solid | outline | transparent"
                 },
-                "attribute": "type",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
                 "defaultValue": "'solid'"
             },
             "color": {
                 "type": "string",
+                "attribute": "color",
                 "mutable": false,
                 "complexType": {
                     "original": "'primary' | 'secondary' | 'accent' | 'neutral' | 'info' | 'success' | 'warning' | 'error' | 'whatsapp'",
@@ -105,12 +125,14 @@ export class CuraBadgePill {
                     "tags": [],
                     "text": "Color base from color scheme. Default: primary"
                 },
-                "attribute": "color",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "'primary'"
             },
             "iconName": {
                 "type": "string",
+                "attribute": "icon-name",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -123,11 +145,13 @@ export class CuraBadgePill {
                     "tags": [],
                     "text": "Name of the icon to be used from iconset"
                 },
-                "attribute": "icon-name",
+                "getter": false,
+                "setter": false,
                 "reflect": true
             },
             "iconset": {
                 "type": "string",
+                "attribute": "iconset",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -140,12 +164,14 @@ export class CuraBadgePill {
                     "tags": [],
                     "text": "Custom iconset if needed"
                 },
-                "attribute": "iconset",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
                 "defaultValue": "'default'"
             },
             "disabled": {
                 "type": "boolean",
+                "attribute": "disabled",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -158,12 +184,14 @@ export class CuraBadgePill {
                     "tags": [],
                     "text": "Disabled state. Boolean"
                 },
-                "attribute": "disabled",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
                 "defaultValue": "false"
             },
             "iconOnly": {
                 "type": "boolean",
+                "attribute": "icon-only",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -176,12 +204,14 @@ export class CuraBadgePill {
                     "tags": [],
                     "text": "Set badge to icon only. Boolean"
                 },
-                "attribute": "icon-only",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
                 "defaultValue": "false"
             },
             "borderRadius": {
                 "type": "string",
+                "attribute": "border-radius",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -194,7 +224,8 @@ export class CuraBadgePill {
                     "tags": [],
                     "text": "Set border-radius."
                 },
-                "attribute": "border-radius",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
                 "defaultValue": "'2px'"
             }

package/dist/collection/components/badges/cura-badge-pill/cura-badge-pill.js.map

@@ -1 +1 @@
-{"version":3,"file":"cura-badge-pill.js","sourceRoot":"","sources":["../../../../src/components/badges/cura-badge-pill/cura-badge-pill.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, Prop, State, h, Watch, Element } from '@stencil/core';\n\n@Component({\n  tag: 'cura-badge-pill',\n  styleUrl: 'cura-badge-pill.scss',\n  shadow: true,\n})\nexport class CuraBadgePill {\n  @Element() host: HTMLElement;\n\n  /**\n   * Badge type: solid | outline | transparent\n   */\n  @Prop({ reflect: true }) type: 'solid' | 'outline' | 'transparent' = 'solid';\n\n  /**\n   * Color base from color scheme. Default: primary\n   */\n  @Prop() color: 'primary' | 'secondary' | 'accent' | 'neutral' | 'info' | 'success' | 'warning' | 'error' | 'whatsapp' = 'primary';\n\n  /**\n   * Name of the icon to be used from iconset\n   */\n  @Prop({ reflect: true }) iconName: string;\n\n  /**\n   * Custom iconset if needed\n   */\n  @Prop({ reflect: true }) iconset = 'default';\n\n  /**\n   * Disabled state. Boolean\n   */\n  @Prop({ reflect: true }) disabled = false;\n\n  /**\n   * Set badge to icon only. Boolean\n   */\n  @Prop({ reflect: true }) iconOnly = false;\n\n  /**\n   * Set border-radius.\n   */\n  @Prop({ reflect: true }) borderRadius: string = '2px';\n\n  @State() styles = {};\n\n  theme = window.CuraAPI.theme;\n\n  @Watch('color')\n  watchColorChange() {\n    this.setColors();\n  }\n\n  connectedCallback() {\n    this.setBaseStyles();\n    this.setColors();\n  }\n\n  private setBaseStyles() {\n    this.styles = {\n      ...this.styles,\n      '--base-spacing': this.theme.spacing.getSpacing(),\n      '--font-family': this.theme.fonts.getFamily(),\n      '--font-size': this.theme.fonts.getSize(),\n    };\n  }\n\n  private setColors() {\n    const colors = [\n      { name: '--color-background', theme: `${this.color}-lighter` },\n      { name: '--color-base', theme: `${this.color}-dark` },\n      { name: '--color-background-disabled', theme: 'neutral-pale' },\n      { name: '--color-outline-disabled', theme: 'neutral-medium' },\n    ];\n\n    const newStyles = { ...this.styles };\n    colors.forEach(color => {\n      newStyles[color.name] = this.theme.colors.getColor(color.theme);\n    });\n\n    this.styles = newStyles;\n  }\n\n  hostCSSProperties() {\n    return {\n      '--border-radius': this.borderRadius || '2px',\n    };\n  }\n\n  getClasses() {\n    const classes = {};\n    classes['badge-container'] = true;\n    classes[`icon-only`] = this.iconOnly;\n    classes['disabled'] = this.disabled;\n    classes[`${this.type}`] = true;\n    return classes;\n  }\n\n  getSymbolColor() {\n    return this.disabled ? 'neutral-medium' : `${this.color}-dark`;\n  }\n\n  getIcon() {\n    if (!this.iconName) return '';\n    return <cura-icon name={this.iconName} iconset={this.iconset} size={'micro'} color={this.getSymbolColor()} />;\n  }\n\n  render() {\n    const symbolColor = this.getSymbolColor();\n    return (\n      <Host style={this.hostCSSProperties()}>\n        <div class={this.getClasses()} style={this.styles}>\n          {this.getIcon()}\n          <cura-label size=\"xsmall\" line-height=\"117%\" color={symbolColor}>\n            <slot></slot>\n          </cura-label>\n        </div>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"cura-badge-pill.js","sourceRoot":"","sources":["../../../../src/components/badges/cura-badge-pill/cura-badge-pill.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, Prop, State, h, Watch, Element } from '@stencil/core';\n\n@Component({\n  tag: 'cura-badge-pill',\n  styleUrl: 'cura-badge-pill.scss',\n  shadow: true,\n})\nexport class CuraBadgePill {\n  @Element() host: HTMLElement;\n\n  /**\n   * Badge type: solid | outline | transparent\n   */\n  @Prop({ reflect: true }) type: 'solid' | 'outline' | 'transparent' = 'solid';\n\n  /**\n   * Color base from color scheme. Default: primary\n   */\n  @Prop() color: 'primary' | 'secondary' | 'accent' | 'neutral' | 'info' | 'success' | 'warning' | 'error' | 'whatsapp' = 'primary';\n\n  /**\n   * Name of the icon to be used from iconset\n   */\n  @Prop({ reflect: true }) iconName: string;\n\n  /**\n   * Custom iconset if needed\n   */\n  @Prop({ reflect: true }) iconset = 'default';\n\n  /**\n   * Disabled state. Boolean\n   */\n  @Prop({ reflect: true }) disabled = false;\n\n  /**\n   * Set badge to icon only. Boolean\n   */\n  @Prop({ reflect: true }) iconOnly = false;\n\n  /**\n   * Set border-radius.\n   */\n  @Prop({ reflect: true }) borderRadius: string = '2px';\n\n  @State() styles = {};\n\n  theme = window.CuraAPI.theme;\n\n  @Watch('color')\n  watchColorChange() {\n    this.setColors();\n  }\n\n  connectedCallback() {\n    this.setBaseStyles();\n    this.setColors();\n  }\n\n  private setBaseStyles() {\n    this.styles = {\n      ...this.styles,\n      '--base-spacing': this.theme.spacing.getSpacing(),\n      '--font-family': this.theme.fonts.getFamily(),\n      '--font-size': this.theme.fonts.getSize(),\n    };\n  }\n\n  private setColors() {\n    const colors = [\n      { name: '--color-background', theme: `${this.color}-lighter` },\n      { name: '--color-base', theme: `${this.color}-dark` },\n      { name: '--color-background-disabled', theme: 'neutral-pale' },\n      { name: '--color-outline-disabled', theme: 'neutral-medium' },\n    ];\n\n    const newStyles = { ...this.styles };\n    colors.forEach(color => {\n      newStyles[color.name] = this.theme.colors.getColor(color.theme);\n    });\n\n    this.styles = newStyles;\n  }\n\n  hostCSSProperties() {\n    return {\n      '--border-radius': this.borderRadius || '2px',\n    };\n  }\n\n  getClasses() {\n    const classes = {};\n    classes['badge-container'] = true;\n    classes[`icon-only`] = this.iconOnly;\n    classes['disabled'] = this.disabled;\n    classes[`${this.type}`] = true;\n    return classes;\n  }\n\n  getSymbolColor() {\n    return this.disabled ? 'neutral-medium' : `${this.color}-dark`;\n  }\n\n  getIcon() {\n    if (!this.iconName) return '';\n    return <cura-icon name={this.iconName} iconset={this.iconset} size={'micro'} color={this.getSymbolColor()} />;\n  }\n\n  render() {\n    const symbolColor = this.getSymbolColor();\n    return (\n      <Host style={this.hostCSSProperties()}>\n        <div class={this.getClasses()} style={this.styles}>\n          {this.getIcon()}\n          <cura-label size=\"xsmall\" line-height=\"117%\" color={symbolColor}>\n            <slot></slot>\n          </cura-label>\n        </div>\n      </Host>\n    );\n  }\n}\n"]}