@rededor/cura 1.7.0 → 1.8.0

package/dist/cjs/cura-alert.cjs.entry.js

@@ -1,26 +1,22 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-60783089.js');
+var index = require('./index-BK9MSAiE.js');
+require('./cura-theme-module-CJkmAxBA.js');
 
 const curaAlertCss = ":host{display:block;box-sizing:border-box}:host .conteiner{display:flex;box-sizing:border-box;padding:calc(var(--cura-spacing-base) * 3px);gap:calc(var(--cura-spacing-base) * 3px);flex-shrink:0;border:1px solid var(--color-base);border-radius:4px;background-color:var(--color-lighter)}:host .conteiner.floating{box-shadow:0px 4px 8px 0px rgba(38, 38, 38, 0.16)}:host .content{flex:1;flex-direction:column;display:flex;gap:calc(var(--cura-spacing-base) * 1px)}:host .icon-right{cursor:pointer}";
-const CuraAlertStyle0 = curaAlertCss;
 
 const CuraAlert = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        this.close = index.createEvent(this, "close", 7);
-        this.handleClose = () => {
-            this.close.emit();
-            this.host.remove();
-        };
+        this.close = index.createEvent(this, "close");
         this.type = 'info';
         this.floating = false;
-        this.label = undefined;
         this.closeable = true;
-        this.icon = undefined;
         this.styles = {};
+        this.handleClose = () => {
+            this.close.emit();
+            this.host.remove();
+        };
     }
     setColors() {
         const colors = [
@@ -63,8 +59,9 @@ const CuraAlert = class {
         "type": ["setColors"]
     }; }
 };
-CuraAlert.style = CuraAlertStyle0;
+CuraAlert.style = curaAlertCss;
 
 exports.cura_alert = CuraAlert;
+//# sourceMappingURL=cura-alert.entry.cjs.js.map
 
 //# sourceMappingURL=cura-alert.cjs.entry.js.map

package/dist/cjs/cura-alert.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"cura-alert.entry.cjs.js","mappings":"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","names":["h","Host"],"sources":["src/components/cura-alert/cura-alert.scss?tag=cura-alert&encapsulation=shadow","src/components/cura-alert/cura-alert.tsx"],"sourcesContent":["@import \"../../scss/mixins/spacing.scss\";\n\n:host {\n  display: block;\n  box-sizing: border-box;\n\n  .conteiner {\n    display: flex;\n    box-sizing: border-box;\n    padding: #{$spacing-xxxs};\n    gap: #{$spacing-xxxs};\n    flex-shrink: 0;\n    border: 1px solid var(--color-base);\n    border-radius: 4px;\n    background-color: var(--color-lighter);\n    &.floating {\n      box-shadow: 0px 4px 8px 0px rgba(38, 38, 38, 0.16);\n    }\n  }\n\n  .content {\n    flex: 1;\n    flex-direction: column;\n    display: flex;\n    gap: #{$spacing-tiny};\n  }\n\n  .icon-right {\n    cursor: pointer;\n  }\n\n}\n","import { Component, Element, Prop, Host, h, State, Watch, Event, EventEmitter } from '@stencil/core';\n@Component({\n  tag: 'cura-alert',\n  styleUrl: 'cura-alert.scss',\n  shadow: true,\n})\nexport class CuraAlert {\n  @Element() host: HTMLElement;\n\n  @Prop() type: 'info' | 'success' | 'warning' | 'error' = 'info';\n  @Prop({ reflect: true }) floating = false;\n  @Prop({ reflect: true }) label: string;\n  @Prop({ reflect: true }) closeable = true;\n  @Prop({ reflect: true }) icon: string;\n\n  @State() styles = {};\n\n  @Event({ eventName: 'close' }) close: EventEmitter<void>;\n\n  @Watch('type')\n  setColors() {\n    const colors = [\n      { name: '--color-lighter', theme: `${this.type}-lighter` },\n      { name: '--neutral-black', theme: 'neutral-black' },\n      { name: '--color-light', theme: `${this.type}-light` },\n      { name: '--color-base', theme: `${this.type}-base` },\n    ];\n\n    colors.forEach(color => {\n      this.styles[color.name] = window.CuraAPI.theme.colors.getColor(color.theme);\n    });\n    this.styles = {...this.styles};\n  }\n\n  connectedCallback() {\n    this.styles['--base-spacing'] = window.CuraAPI.theme.spacing.getSpacing();\n    this.setColors();\n  }\n\n  getClasses() {\n    const classes = {};\n    classes['conteiner'] = true;\n    classes['floating'] = this.floating;\n    return classes;\n  }\n\n  getNameIcon() {\n    const iconMapping = {\n      info: 'infoCircle',\n      success: 'checkCircle',\n      warning: 'alertCircle',\n      error: 'alertTriangle',\n    };\n    return this.icon ? this.icon : iconMapping[this.type];\n  }\n\n  handleClose = () => {\n    this.close.emit();\n    this.host.remove();\n  };\n\n  render() {\n    return (\n      <Host role=\"alert\"\n        aria-live=\"polite\"\n        aria-atomic=\"true\"\n        aria-label={this.label}>\n        <div class={this.getClasses()} style={this.styles}>\n          <cura-icon name={this.getNameIcon()} class=\"icon-left\" size={16} color={`${this.type}-dark`}></cura-icon>\n          <div class=\"content\">\n            { this.label ? (\n            <cura-heading class=\"title\" size=\"xsmall\" color=\"neutral-black\" weight=\"bold\" margin-block=\"1px 0\">\n              {this.label}\n            </cura-heading>\n            ) : ''}\n            <cura-paragraph class=\"text\" color={`${this.type}-darker`} size=\"xsmall\" marginBlock=\"0\" lineHeight=\"133.33%\">\n              <slot></slot>\n            </cura-paragraph>\n            <slot name=\"actions\"></slot>\n          </div>\n          { this.closeable ?\n          (<cura-icon name=\"close\" size={16} color=\"error-dark\" class=\"icon-right\" onClick={this.handleClose}></cura-icon>)\n          : '' }\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"cura-alert.entry.cjs.js","mappings":"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","names":["h","Host"],"sources":["src/components/cura-alert/cura-alert.scss?tag=cura-alert&encapsulation=shadow","src/components/cura-alert/cura-alert.tsx"],"sourcesContent":["@import \"../../scss/mixins/spacing.scss\";\n\n:host {\n  display: block;\n  box-sizing: border-box;\n\n  .conteiner {\n    display: flex;\n    box-sizing: border-box;\n    padding: #{$spacing-xxxs};\n    gap: #{$spacing-xxxs};\n    flex-shrink: 0;\n    border: 1px solid var(--color-base);\n    border-radius: 4px;\n    background-color: var(--color-lighter);\n    &.floating {\n      box-shadow: 0px 4px 8px 0px rgba(38, 38, 38, 0.16);\n    }\n  }\n\n  .content {\n    flex: 1;\n    flex-direction: column;\n    display: flex;\n    gap: #{$spacing-tiny};\n  }\n\n  .icon-right {\n    cursor: pointer;\n  }\n\n}\n","import { Component, Element, Prop, Host, h, State, Watch, Event, EventEmitter } from '@stencil/core';\n@Component({\n  tag: 'cura-alert',\n  styleUrl: 'cura-alert.scss',\n  shadow: true,\n})\nexport class CuraAlert {\n  @Element() host: HTMLElement;\n\n  @Prop() type: 'info' | 'success' | 'warning' | 'error' = 'info';\n  @Prop({ reflect: true }) floating = false;\n  @Prop({ reflect: true }) label: string;\n  @Prop({ reflect: true }) closeable = true;\n  @Prop({ reflect: true }) icon: string;\n\n  @State() styles = {};\n\n  @Event({ eventName: 'close' }) close: EventEmitter<void>;\n\n  @Watch('type')\n  setColors() {\n    const colors = [\n      { name: '--color-lighter', theme: `${this.type}-lighter` },\n      { name: '--neutral-black', theme: 'neutral-black' },\n      { name: '--color-light', theme: `${this.type}-light` },\n      { name: '--color-base', theme: `${this.type}-base` },\n    ];\n\n    colors.forEach(color => {\n      this.styles[color.name] = window.CuraAPI.theme.colors.getColor(color.theme);\n    });\n    this.styles = {...this.styles};\n  }\n\n  connectedCallback() {\n    this.styles['--base-spacing'] = window.CuraAPI.theme.spacing.getSpacing();\n    this.setColors();\n  }\n\n  getClasses() {\n    const classes = {};\n    classes['conteiner'] = true;\n    classes['floating'] = this.floating;\n    return classes;\n  }\n\n  getNameIcon() {\n    const iconMapping = {\n      info: 'infoCircle',\n      success: 'checkCircle',\n      warning: 'alertCircle',\n      error: 'alertTriangle',\n    };\n    return this.icon ? this.icon : iconMapping[this.type];\n  }\n\n  handleClose = () => {\n    this.close.emit();\n    this.host.remove();\n  };\n\n  render() {\n    return (\n      <Host role=\"alert\"\n        aria-live=\"polite\"\n        aria-atomic=\"true\"\n        aria-label={this.label}>\n        <div class={this.getClasses()} style={this.styles}>\n          <cura-icon name={this.getNameIcon()} class=\"icon-left\" size={16} color={`${this.type}-dark`}></cura-icon>\n          <div class=\"content\">\n            { this.label ? (\n            <cura-heading class=\"title\" size=\"xsmall\" color=\"neutral-black\" weight=\"bold\" margin-block=\"1px 0\">\n              {this.label}\n            </cura-heading>\n            ) : ''}\n            <cura-paragraph class=\"text\" color={`${this.type}-darker`} size=\"xsmall\" marginBlock=\"0\" lineHeight=\"133.33%\">\n              <slot></slot>\n            </cura-paragraph>\n            <slot name=\"actions\"></slot>\n          </div>\n          { this.closeable ?\n          (<cura-icon name=\"close\" size={16} color=\"error-dark\" class=\"icon-right\" onClick={this.handleClose}></cura-icon>)\n          : '' }\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/cura-alert.entry.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"cura-alert.entry.cjs.js","sources":["src/components/cura-alert/cura-alert.scss?tag=cura-alert&encapsulation=shadow","src/components/cura-alert/cura-alert.tsx"],"sourcesContent":["@import \"../../scss/mixins/spacing.scss\";\n\n:host {\n  display: block;\n  box-sizing: border-box;\n\n  .conteiner {\n    display: flex;\n    box-sizing: border-box;\n    padding: #{$spacing-xxxs};\n    gap: #{$spacing-xxxs};\n    flex-shrink: 0;\n    border: 1px solid var(--color-base);\n    border-radius: 4px;\n    background-color: var(--color-lighter);\n    &.floating {\n      box-shadow: 0px 4px 8px 0px rgba(38, 38, 38, 0.16);\n    }\n  }\n\n  .content {\n    flex: 1;\n    flex-direction: column;\n    display: flex;\n    gap: #{$spacing-tiny};\n  }\n\n  .icon-right {\n    cursor: pointer;\n  }\n\n}\n","import { Component, Element, Prop, Host, h, State, Watch, Event, EventEmitter } from '@stencil/core';\n@Component({\n  tag: 'cura-alert',\n  styleUrl: 'cura-alert.scss',\n  shadow: true,\n})\nexport class CuraAlert {\n  @Element() host: HTMLElement;\n\n  @Prop() type: 'info' | 'success' | 'warning' | 'error' = 'info';\n  @Prop({ reflect: true }) floating = false;\n  @Prop({ reflect: true }) label: string;\n  @Prop({ reflect: true }) closeable = true;\n  @Prop({ reflect: true }) icon: string;\n\n  @State() styles = {};\n\n  @Event({ eventName: 'close' }) close: EventEmitter<void>;\n\n  @Watch('type')\n  setColors() {\n    const colors = [\n      { name: '--color-lighter', theme: `${this.type}-lighter` },\n      { name: '--neutral-black', theme: 'neutral-black' },\n      { name: '--color-light', theme: `${this.type}-light` },\n      { name: '--color-base', theme: `${this.type}-base` },\n    ];\n\n    colors.forEach(color => {\n      this.styles[color.name] = window.CuraAPI.theme.colors.getColor(color.theme);\n    });\n    this.styles = {...this.styles};\n  }\n\n  connectedCallback() {\n    this.styles['--base-spacing'] = window.CuraAPI.theme.spacing.getSpacing();\n    this.setColors();\n  }\n\n  getClasses() {\n    const classes = {};\n    classes['conteiner'] = true;\n    classes['floating'] = this.floating;\n    return classes;\n  }\n\n  getNameIcon() {\n    const iconMapping = {\n      info: 'infoCircle',\n      success: 'checkCircle',\n      warning: 'alertCircle',\n      error: 'alertTriangle',\n    };\n    return this.icon ? this.icon : iconMapping[this.type];\n  }\n\n  handleClose = () => {\n    this.close.emit();\n    this.host.remove();\n  };\n\n  render() {\n    return (\n      <Host role=\"alert\"\n        aria-live=\"polite\"\n        aria-atomic=\"true\"\n        aria-label={this.label}>\n        <div class={this.getClasses()} style={this.styles}>\n          <cura-icon name={this.getNameIcon()} class=\"icon-left\" size={16} color={`${this.type}-dark`}></cura-icon>\n          <div class=\"content\">\n            { this.label ? (\n            <cura-heading class=\"title\" size=\"xsmall\" color=\"neutral-black\" weight=\"bold\" margin-block=\"1px 0\">\n              {this.label}\n            </cura-heading>\n            ) : ''}\n            <cura-paragraph class=\"text\" color={`${this.type}-darker`} size=\"xsmall\" marginBlock=\"0\" lineHeight=\"133.33%\">\n              <slot></slot>\n            </cura-paragraph>\n            <slot name=\"actions\"></slot>\n          </div>\n          { this.closeable ?\n          (<cura-icon name=\"close\" size={16} color=\"error-dark\" class=\"icon-right\" onClick={this.handleClose}></cura-icon>)\n          : '' }\n        </div>\n      </Host>\n    );\n  }\n}\n"],"names":["h","Host"],"mappings":";;;;;AAAA,MAAM,YAAY,GAAG,8eAA8e;;MCMtf,SAAS,GAAA,MAAA;AALtB,IAAA,WAAA,CAAA,OAAA,EAAA;;;AAQU,QAAA,IAAI,CAAA,IAAA,GAA6C,MAAM;AACtC,QAAA,IAAQ,CAAA,QAAA,GAAG,KAAK;AAEhB,QAAA,IAAS,CAAA,SAAA,GAAG,IAAI;AAGhC,QAAA,IAAM,CAAA,MAAA,GAAG,EAAE;AAyCpB,QAAA,IAAW,CAAA,WAAA,GAAG,MAAK;AACjB,YAAA,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE;AACjB,YAAA,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE;AACpB,SAAC;AA4BF;IAnEC,SAAS,GAAA;AACP,QAAA,MAAM,MAAM,GAAG;YACb,EAAE,IAAI,EAAE,iBAAiB,EAAE,KAAK,EAAE,CAAA,EAAG,IAAI,CAAC,IAAI,CAAA,QAAA,CAAU,EAAE;AAC1D,YAAA,EAAE,IAAI,EAAE,iBAAiB,EAAE,KAAK,EAAE,eAAe,EAAE;YACnD,EAAE,IAAI,EAAE,eAAe,EAAE,KAAK,EAAE,CAAA,EAAG,IAAI,CAAC,IAAI,CAAA,MAAA,CAAQ,EAAE;YACtD,EAAE,IAAI,EAAE,cAAc,EAAE,KAAK,EAAE,CAAA,EAAG,IAAI,CAAC,IAAI,CAAA,KAAA,CAAO,EAAE;SACrD;AAED,QAAA,MAAM,CAAC,OAAO,CAAC,KAAK,IAAG;YACrB,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC;AAC7E,SAAC,CAAC;AACF,QAAA,IAAI,CAAC,MAAM,GAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAO,IAAI,CAAC,MAAM,CAAC;;IAGhC,iBAAiB,GAAA;AACf,QAAA,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,OAAO,CAAC,UAAU,EAAE;QACzE,IAAI,CAAC,SAAS,EAAE;;IAGlB,UAAU,GAAA;QACR,MAAM,OAAO,GAAG,EAAE;AAClB,QAAA,OAAO,CAAC,WAAW,CAAC,GAAG,IAAI;AAC3B,QAAA,OAAO,CAAC,UAAU,CAAC,GAAG,IAAI,CAAC,QAAQ;AACnC,QAAA,OAAO,OAAO;;IAGhB,WAAW,GAAA;AACT,QAAA,MAAM,WAAW,GAAG;AAClB,YAAA,IAAI,EAAE,YAAY;AAClB,YAAA,OAAO,EAAE,aAAa;AACtB,YAAA,OAAO,EAAE,aAAa;AACtB,YAAA,KAAK,EAAE,eAAe;SACvB;AACD,QAAA,OAAO,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,GAAG,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC;;IAQvD,MAAM,GAAA;QACJ,QACEA,OAAA,CAACC,UAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAC,IAAI,EAAC,OAAO,EACN,WAAA,EAAA,QAAQ,EACN,aAAA,EAAA,MAAM,EACN,YAAA,EAAA,IAAI,CAAC,KAAK,EAAA,EACtBD,OAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,MAAM,EAAA,EAC/CA,OAAW,CAAA,WAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAE,IAAI,CAAC,WAAW,EAAE,EAAE,KAAK,EAAC,WAAW,EAAC,IAAI,EAAE,EAAE,EAAE,KAAK,EAAE,CAAG,EAAA,IAAI,CAAC,IAAI,CAAA,KAAA,CAAO,EAAc,CAAA,EACzGA,OAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,SAAS,EAAA,EAChB,IAAI,CAAC,KAAK,IACZA,OAAA,CAAA,cAAA,EAAA,EAAc,KAAK,EAAC,OAAO,EAAC,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAC,eAAe,EAAC,MAAM,EAAC,MAAM,kBAAc,OAAO,EAAA,EAC/F,IAAI,CAAC,KAAK,CACE,IACX,EAAE,EACNA,OAAgB,CAAA,gBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,MAAM,EAAC,KAAK,EAAE,CAAG,EAAA,IAAI,CAAC,IAAI,CAAA,OAAA,CAAS,EAAE,IAAI,EAAC,QAAQ,EAAC,WAAW,EAAC,GAAG,EAAC,UAAU,EAAC,SAAS,EAAA,EAC3GA,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAa,CACE,EACjBA,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,SAAS,EAAA,CAAQ,CACxB,EACJ,IAAI,CAAC,SAAS;AAChB,aAACA,OAAA,CAAA,WAAA,EAAA,EAAW,IAAI,EAAC,OAAO,EAAC,IAAI,EAAE,EAAE,EAAE,KAAK,EAAC,YAAY,EAAC,KAAK,EAAC,YAAY,EAAC,OAAO,EAAE,IAAI,CAAC,WAAW,EAAA,CAAc;AAChH,cAAE,EAAE,CACA,CACD;;;;;;;;;;;"}

package/dist/cjs/cura-badge-counter.cjs.entry.js

@@ -1,23 +1,30 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-60783089.js');
+var index = require('./index-BK9MSAiE.js');
+require('./cura-theme-module-CJkmAxBA.js');
 
 const curaBadgeCounterCss = ":host{width:fit-content;display:inline-block;height:calc(var(--cura-spacing-base) * 4px);position:relative}:host .container{display:flex;min-width:calc(var(--cura-spacing-base) * 4px);width:fit-content;height:calc(var(--cura-spacing-base) * 4px);justify-content:center;align-items:center;border-radius:calc(calc(var(--cura-spacing-base) * 4px) / 2);background:var(--background-color);box-sizing:border-box;padding:0 calc(var(--cura-spacing-base) * 1px);position:relative}:host .container.outline,:host .container.transparent{background:transparent !important}:host .container.outline::before{content:\"\";width:100%;height:100%;position:absolute;left:0px;top:0px;box-sizing:border-box;border:1px solid var(--background-color);border-radius:calc(calc(var(--cura-spacing-base) * 4px) / 2)}";
-const CuraBadgeCounterStyle0 = curaBadgeCounterCss;
 
 const CuraBadgeNumber = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         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();
@@ -56,8 +63,9 @@ const CuraBadgeNumber = class {
         "type": ["handleColorChange"]
     }; }
 };
-CuraBadgeNumber.style = CuraBadgeCounterStyle0;
+CuraBadgeNumber.style = curaBadgeCounterCss;
 
 exports.cura_badge_counter = CuraBadgeNumber;
+//# sourceMappingURL=cura-badge-counter.entry.cjs.js.map
 
 //# sourceMappingURL=cura-badge-counter.cjs.entry.js.map

package/dist/cjs/cura-badge-counter.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"cura-badge-counter.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,mBAAmB,GAAG,qxBAAqxB,CAAC;AAClzB,+BAAe,mBAAmB;;MCMrB,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;KAClB;IAED,SAAS;QACP,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC;;QAEvC,IAAI,IAAI,CAAC,IAAI,KAAK,SAAS,IAAI,IAAI,CAAC,IAAI,KAAK,aAAa,EAAE;YAC1D,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,QAAQ,GAAG,gBAAgB,GAAG,GAAG,KAAK,OAAO,CAAC;YACtE,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,WAAW,CAAC;;SAEpC;aAAM;YACL,IAAI,CAAC,WAAW,GAAG,KAAK,KAAK,SAAS,IAAI,IAAI,CAAC,QAAQ,GAAG,cAAc,GAAG,GAAG,KAAK,UAAU,CAAC;YAC9F,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,QAAQ,GAAG,gBAAgB,GAAG,GAAG,KAAK,OAAO,CAAC;SACtE;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;KACF;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;KAClB;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;KAChB;IAGD,MAAM;QACJ,QACEA,QAACC,UAAI,uDACD,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,MAAM,IAAI,CAAC,GAAG,EAAE,IACtCD,iBAAK,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,MAAM,IAC/CA,wBAAY,IAAI,EAAC,QAAQ,iBAAa,MAAM,EAAC,KAAK,EAAE,IAAI,CAAC,UAAU,IAChE,IAAI,CAAC,MAAM,IAAI,GAAG,GAAG,KAAK,GAAG,IAAI,CAAC,MAAM,CAC9B,CACT,CACL,CACI,EACP;KACH;;;;;;;;;;;","names":["h","Host"],"sources":["src/components/badges/cura-badge-counter/cura-badge-counter.scss?tag=cura-badge-counter&encapsulation=shadow","src/components/badges/cura-badge-counter/cura-badge-counter.tsx"],"sourcesContent":["@import '../../../scss/mixins/spacing.scss';\n\n:host {\n  width: fit-content;\n  display: inline-block;\n  height: #{$spacing-xxs};\n  position: relative;\n\n  .container {\n    display: flex;\n    min-width: #{$spacing-xxs};\n    width: fit-content;\n    height: #{$spacing-xxs};\n    justify-content: center;\n    align-items: center;\n    border-radius: calc(#{$spacing-xxs} / 2);\n    background: var(--background-color);\n    box-sizing: border-box;\n    padding: 0 #{$spacing-tiny};\n    position: relative;\n\n    &.outline,\n    &.transparent {\n      background: transparent !important;\n    }\n\n    &.outline {\n      &::before {\n        content: \"\";\n        width: 100%;\n        height: 100%;\n        position: absolute;\n        left: 0px;\n        top: 0px;\n        box-sizing: border-box;\n        border: 1px solid var(--background-color);\n        border-radius: calc(#{$spacing-xxs} / 2);\n      }\n    }\n  }\n\n}\n","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.entry.cjs.js","mappings":";;;;;AAAA,MAAM,mBAAmB,GAAG,qxBAAqxB;;MCOpyB,eAAe,GAAA,MAAA;AAL5B,IAAA,WAAA,CAAA,OAAA,EAAA;;QAOE,IAAA,CAAA,KAAK,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK;AAM5B;;;AAGG;AACK,QAAA,IAAK,CAAA,KAAA,GAAW,SAAS;AACjC;;AAEG;AACK,QAAA,IAAQ,CAAA,QAAA,GAAY,KAAK;AACjC;;AAEG;AACK,QAAA,IAAI,CAAA,IAAA,GAAiD,OAAO;AAE3D,QAAA,IAAM,CAAA,MAAA,GAAG,EAAE;AACpB,QAAA,IAAU,CAAA,UAAA,GAAG,gBAAgB;AAC7B,QAAA,IAAW,CAAA,WAAA,GAAG,iBAAiB;AAqDhC;IAhDC,iBAAiB,GAAA;QACf,IAAI,CAAC,SAAS,EAAE;;IAGlB,SAAS,GAAA;QACP,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,WAAW,EAAE;;AAEtC,QAAA,IAAI,IAAI,CAAC,IAAI,KAAK,SAAS,IAAI,IAAI,CAAC,IAAI,KAAK,aAAa,EAAE;AAC1D,YAAA,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,QAAQ,GAAG,CAAA,cAAA,CAAgB,GAAG,CAAG,EAAA,KAAK,OAAO;AACrE,YAAA,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,WAAW;;;aAE7B;YACL,IAAI,CAAC,WAAW,GAAG,KAAK,KAAK,SAAS,IAAI,IAAI,CAAC,QAAQ,GAAG,cAAc,GAAG,CAAG,EAAA,KAAK,UAAU;AAC7F,YAAA,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,QAAQ,GAAG,gBAAgB,GAAG,CAAG,EAAA,KAAK,OAAO;;AAEtE,QAAA,IAAI,CAAC,MAAM,GAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EACN,IAAI,CAAC,MAAM,CACd,EAAA,EAAA,oBAAoB,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAA,EAAG,IAAI,CAAC,WAAW,EAAE,CAAC,EAAA,CACxE;;IAGH,iBAAiB,GAAA;AACf,QAAA,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,UAAU,EAAE;QAC/D,IAAI,CAAC,SAAS,EAAE;;IAGlB,UAAU,GAAA;AACR,QAAA,MAAM,OAAO,GAAG;AACd,YAAA,WAAW,EAAE;SACd;QACD,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,GAAG,IAAI;AACvC,QAAA,OAAO,OAAO;;IAIhB,MAAM,GAAA;AACJ,QAAA,QACEA,OAAA,CAACC,UAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACD,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,MAAM,IAAI,CAAC,GAAG,EAAE,IACtCD,OAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,MAAM,EAAA,EAC/CA,OAAA,CAAA,YAAA,EAAA,EAAY,IAAI,EAAC,QAAQ,EAAA,aAAA,EAAa,MAAM,EAAC,KAAK,EAAE,IAAI,CAAC,UAAU,EAChE,EAAA,IAAI,CAAC,MAAM,IAAI,GAAG,GAAG,KAAK,GAAG,IAAI,CAAC,MAAM,CAC9B,CACT,CACL,CACI;;;;;;;;;;;;","names":["h","Host"],"sources":["src/components/badges/cura-badge-counter/cura-badge-counter.scss?tag=cura-badge-counter&encapsulation=shadow","src/components/badges/cura-badge-counter/cura-badge-counter.tsx"],"sourcesContent":["@import '../../../scss/mixins/spacing.scss';\n\n:host {\n  width: fit-content;\n  display: inline-block;\n  height: #{$spacing-xxs};\n  position: relative;\n\n  .container {\n    display: flex;\n    min-width: #{$spacing-xxs};\n    width: fit-content;\n    height: #{$spacing-xxs};\n    justify-content: center;\n    align-items: center;\n    border-radius: calc(#{$spacing-xxs} / 2);\n    background: var(--background-color);\n    box-sizing: border-box;\n    padding: 0 #{$spacing-tiny};\n    position: relative;\n\n    &.outline,\n    &.transparent {\n      background: transparent !important;\n    }\n\n    &.outline {\n      &::before {\n        content: \"\";\n        width: 100%;\n        height: 100%;\n        position: absolute;\n        left: 0px;\n        top: 0px;\n        box-sizing: border-box;\n        border: 1px solid var(--background-color);\n        border-radius: calc(#{$spacing-xxs} / 2);\n      }\n    }\n  }\n\n}\n","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}

package/dist/cjs/cura-badge-counter.entry.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"cura-badge-counter.entry.cjs.js","sources":["src/components/badges/cura-badge-counter/cura-badge-counter.scss?tag=cura-badge-counter&encapsulation=shadow","src/components/badges/cura-badge-counter/cura-badge-counter.tsx"],"sourcesContent":["@import '../../../scss/mixins/spacing.scss';\n\n:host {\n  width: fit-content;\n  display: inline-block;\n  height: #{$spacing-xxs};\n  position: relative;\n\n  .container {\n    display: flex;\n    min-width: #{$spacing-xxs};\n    width: fit-content;\n    height: #{$spacing-xxs};\n    justify-content: center;\n    align-items: center;\n    border-radius: calc(#{$spacing-xxs} / 2);\n    background: var(--background-color);\n    box-sizing: border-box;\n    padding: 0 #{$spacing-tiny};\n    position: relative;\n\n    &.outline,\n    &.transparent {\n      background: transparent !important;\n    }\n\n    &.outline {\n      &::before {\n        content: \"\";\n        width: 100%;\n        height: 100%;\n        position: absolute;\n        left: 0px;\n        top: 0px;\n        box-sizing: border-box;\n        border: 1px solid var(--background-color);\n        border-radius: calc(#{$spacing-xxs} / 2);\n      }\n    }\n  }\n\n}\n","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"],"names":["h","Host"],"mappings":";;;;;AAAA,MAAM,mBAAmB,GAAG,qxBAAqxB;;MCOpyB,eAAe,GAAA,MAAA;AAL5B,IAAA,WAAA,CAAA,OAAA,EAAA;;QAOE,IAAA,CAAA,KAAK,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK;AAM5B;;;AAGG;AACK,QAAA,IAAK,CAAA,KAAA,GAAW,SAAS;AACjC;;AAEG;AACK,QAAA,IAAQ,CAAA,QAAA,GAAY,KAAK;AACjC;;AAEG;AACK,QAAA,IAAI,CAAA,IAAA,GAAiD,OAAO;AAE3D,QAAA,IAAM,CAAA,MAAA,GAAG,EAAE;AACpB,QAAA,IAAU,CAAA,UAAA,GAAG,gBAAgB;AAC7B,QAAA,IAAW,CAAA,WAAA,GAAG,iBAAiB;AAqDhC;IAhDC,iBAAiB,GAAA;QACf,IAAI,CAAC,SAAS,EAAE;;IAGlB,SAAS,GAAA;QACP,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,WAAW,EAAE;;AAEtC,QAAA,IAAI,IAAI,CAAC,IAAI,KAAK,SAAS,IAAI,IAAI,CAAC,IAAI,KAAK,aAAa,EAAE;AAC1D,YAAA,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,QAAQ,GAAG,CAAA,cAAA,CAAgB,GAAG,CAAG,EAAA,KAAK,OAAO;AACrE,YAAA,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,WAAW;;;aAE7B;YACL,IAAI,CAAC,WAAW,GAAG,KAAK,KAAK,SAAS,IAAI,IAAI,CAAC,QAAQ,GAAG,cAAc,GAAG,CAAG,EAAA,KAAK,UAAU;AAC7F,YAAA,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,QAAQ,GAAG,gBAAgB,GAAG,CAAG,EAAA,KAAK,OAAO;;AAEtE,QAAA,IAAI,CAAC,MAAM,GAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EACN,IAAI,CAAC,MAAM,CACd,EAAA,EAAA,oBAAoB,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAA,EAAG,IAAI,CAAC,WAAW,EAAE,CAAC,EAAA,CACxE;;IAGH,iBAAiB,GAAA;AACf,QAAA,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,UAAU,EAAE;QAC/D,IAAI,CAAC,SAAS,EAAE;;IAGlB,UAAU,GAAA;AACR,QAAA,MAAM,OAAO,GAAG;AACd,YAAA,WAAW,EAAE;SACd;QACD,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,GAAG,IAAI;AACvC,QAAA,OAAO,OAAO;;IAIhB,MAAM,GAAA;AACJ,QAAA,QACEA,OAAA,CAACC,UAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACD,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,MAAM,IAAI,CAAC,GAAG,EAAE,IACtCD,OAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,MAAM,EAAA,EAC/CA,OAAA,CAAA,YAAA,EAAA,EAAY,IAAI,EAAC,QAAQ,EAAA,aAAA,EAAa,MAAM,EAAC,KAAK,EAAE,IAAI,CAAC,UAAU,EAChE,EAAA,IAAI,CAAC,MAAM,IAAI,GAAG,GAAG,KAAK,GAAG,IAAI,CAAC,MAAM,CAC9B,CACT,CACL,CACI;;;;;;;;;;;;"}

package/dist/cjs/cura-badge-dot.cjs.entry.js

@@ -1,18 +1,26 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-60783089.js');
+var index = require('./index-BK9MSAiE.js');
+require('./cura-theme-module-CJkmAxBA.js');
 
 const curaBadgeDotCss = ":host{display:block;position:relative;width:fit-content;height:fit-content}:host .container{width:calc(var(--cura-spacing-base) * 2px);height:calc(var(--cura-spacing-base) * 2px);position:relative;box-sizing:border-box}:host .container::before{width:100%;height:100%;position:absolute;left:0;top:0;content:\"\";box-sizing:border-box;border-radius:50%;border:1px solid var(--color-dark);background:var(--color)}:host .container.disabled::before{background:var(--neutral-pale);border:1px solid var(--neutral-medium)}:host .container.outline::before{background:transparent;border:2px solid var(--color)}:host .container.outline.disabled::before{border:2px solid var(--neutral-medium)}:host .container.transparent::before{background:var(--color-dark);border:none}:host .container.transparent.disabled::before{background:var(--neutral-medium);border:none}";
-const CuraBadgeDotStyle0 = curaBadgeDotCss;
 
 const CuraBadgeDot = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         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 = {};
     }
@@ -37,8 +45,9 @@ const CuraBadgeDot = class {
         return (index.h(index.Host, { key: '00e335977fbb0677db9d95bab901a012ba8a5c06' }, index.h("div", { key: 'e828743793731c986f37dd6a9f7abdc78b63932b', class: this.getClasses(), style: this.styles })));
     }
 };
-CuraBadgeDot.style = CuraBadgeDotStyle0;
+CuraBadgeDot.style = curaBadgeDotCss;
 
 exports.cura_badge_dot = CuraBadgeDot;
+//# sourceMappingURL=cura-badge-dot.entry.cjs.js.map
 
 //# sourceMappingURL=cura-badge-dot.cjs.entry.js.map

package/dist/cjs/cura-badge-dot.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"cura-badge-dot.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,eAAe,GAAG,o1BAAo1B,CAAC;AAC72B,2BAAe,eAAe;;MCMjB,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;QAC7E,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,cAAc,CAAC,CAAC;QAC3E,IAAI,CAAC,SAAS,EAAE,CAAC;KAClB;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;KACF;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;KAChB;IAED,MAAM;QACJ,QACEA,QAACC,UAAI,uDACHD,kEAAK,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,MAAM,GAAQ,CACpD,EACP;KACH;;;;;;","names":["h","Host"],"sources":["src/components/badges/cura-badge-dot/cura-badge-dot.scss?tag=cura-badge-dot&encapsulation=shadow","src/components/badges/cura-badge-dot/cura-badge-dot.tsx"],"sourcesContent":["@import \"../../../scss/mixins/spacing.scss\";\n\n:host {\n  display: block;\n  position: relative;\n  width: fit-content;\n  height: fit-content;\n\n  .container {\n    width: #{$spacing-mini};\n    height: #{$spacing-mini};\n    position: relative;\n    box-sizing: border-box;\n\n    &::before {\n      width: 100%;\n      height: 100%;\n      position: absolute;\n      left: 0;\n      top: 0;\n      content: \"\";\n      box-sizing: border-box;\n      border-radius: 50%;\n      border: 1px solid var(--color-dark);\n      background: var(--color);\n    }\n\n    &.disabled::before {\n      background: var(--neutral-pale);\n      border: 1px solid var(--neutral-medium);\n    }\n\n    &.outline::before {\n      background: transparent;\n      border: 2px solid var(--color);\n    }\n    &.outline.disabled::before {\n      border: 2px solid var(--neutral-medium);\n    }\n\n    &.transparent::before {\n      background: var(--color-dark);\n      border: none;\n    }\n    &.transparent.disabled::before {\n      background: var(--neutral-medium);\n      border: none;\n    }\n\n  }\n}\n","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.entry.cjs.js","mappings":";;;;;AAAA,MAAM,eAAe,GAAG,o1BAAo1B;;MCO/1B,YAAY,GAAA,MAAA;AALzB,IAAA,WAAA,CAAA,OAAA,EAAA;;QAOE,IAAA,CAAA,KAAK,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK;AAE5B;;;AAGG;AACK,QAAA,IAAK,CAAA,KAAA,GAAW,SAAS;AACjC;;AAEG;AACoB,QAAA,IAAQ,CAAA,QAAA,GAAY,KAAK;AAChD;;AAEG;AACoB,QAAA,IAAI,CAAA,IAAA,GAAiD,OAAO;AAE1E,QAAA,IAAM,CAAA,MAAA,GAAG,EAAE;AAkCrB;IA/BC,iBAAiB,GAAA;AACf,QAAA,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,UAAU,EAAE;AAC/D,QAAA,IAAI,CAAC,MAAM,CAAC,kBAAkB,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,cAAc,CAAC;AAC5E,QAAA,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,cAAc,CAAC;QAC1E,IAAI,CAAC,SAAS,EAAE;;IAGlB,SAAS,GAAA;QACP,IAAI,CAAC,MAAM,GAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EACN,IAAI,CAAC,MAAM,KACd,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAA,EAAG,IAAI,CAAC,KAAK,CAAA,CAAE,CAAC,EACtD,cAAc,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAG,EAAA,IAAI,CAAC,KAAK,CAAO,KAAA,CAAA,CAAC,GACjE;;IAGH,UAAU,GAAA;AACR,QAAA,MAAM,OAAO,GAAG;AACd,YAAA,WAAW,EAAE,IAAI;YACjB,UAAU,EAAE,IAAI,CAAC;SAClB;QACD,OAAO,CAAC,GAAG,IAAI,CAAC,IAAI,CAAE,CAAA,CAAC,GAAG,IAAI;AAC9B,QAAA,OAAO,OAAO;;IAGhB,MAAM,GAAA;AACJ,QAAA,QACEA,QAACC,UAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACHD,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,MAAM,EAAQ,CAAA,CACpD;;;;;;;","names":["h","Host"],"sources":["src/components/badges/cura-badge-dot/cura-badge-dot.scss?tag=cura-badge-dot&encapsulation=shadow","src/components/badges/cura-badge-dot/cura-badge-dot.tsx"],"sourcesContent":["@import \"../../../scss/mixins/spacing.scss\";\n\n:host {\n  display: block;\n  position: relative;\n  width: fit-content;\n  height: fit-content;\n\n  .container {\n    width: #{$spacing-mini};\n    height: #{$spacing-mini};\n    position: relative;\n    box-sizing: border-box;\n\n    &::before {\n      width: 100%;\n      height: 100%;\n      position: absolute;\n      left: 0;\n      top: 0;\n      content: \"\";\n      box-sizing: border-box;\n      border-radius: 50%;\n      border: 1px solid var(--color-dark);\n      background: var(--color);\n    }\n\n    &.disabled::before {\n      background: var(--neutral-pale);\n      border: 1px solid var(--neutral-medium);\n    }\n\n    &.outline::before {\n      background: transparent;\n      border: 2px solid var(--color);\n    }\n    &.outline.disabled::before {\n      border: 2px solid var(--neutral-medium);\n    }\n\n    &.transparent::before {\n      background: var(--color-dark);\n      border: none;\n    }\n    &.transparent.disabled::before {\n      background: var(--neutral-medium);\n      border: none;\n    }\n\n  }\n}\n","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}

package/dist/cjs/cura-badge-dot.entry.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"cura-badge-dot.entry.cjs.js","sources":["src/components/badges/cura-badge-dot/cura-badge-dot.scss?tag=cura-badge-dot&encapsulation=shadow","src/components/badges/cura-badge-dot/cura-badge-dot.tsx"],"sourcesContent":["@import \"../../../scss/mixins/spacing.scss\";\n\n:host {\n  display: block;\n  position: relative;\n  width: fit-content;\n  height: fit-content;\n\n  .container {\n    width: #{$spacing-mini};\n    height: #{$spacing-mini};\n    position: relative;\n    box-sizing: border-box;\n\n    &::before {\n      width: 100%;\n      height: 100%;\n      position: absolute;\n      left: 0;\n      top: 0;\n      content: \"\";\n      box-sizing: border-box;\n      border-radius: 50%;\n      border: 1px solid var(--color-dark);\n      background: var(--color);\n    }\n\n    &.disabled::before {\n      background: var(--neutral-pale);\n      border: 1px solid var(--neutral-medium);\n    }\n\n    &.outline::before {\n      background: transparent;\n      border: 2px solid var(--color);\n    }\n    &.outline.disabled::before {\n      border: 2px solid var(--neutral-medium);\n    }\n\n    &.transparent::before {\n      background: var(--color-dark);\n      border: none;\n    }\n    &.transparent.disabled::before {\n      background: var(--neutral-medium);\n      border: none;\n    }\n\n  }\n}\n","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"],"names":["h","Host"],"mappings":";;;;;AAAA,MAAM,eAAe,GAAG,o1BAAo1B;;MCO/1B,YAAY,GAAA,MAAA;AALzB,IAAA,WAAA,CAAA,OAAA,EAAA;;QAOE,IAAA,CAAA,KAAK,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK;AAE5B;;;AAGG;AACK,QAAA,IAAK,CAAA,KAAA,GAAW,SAAS;AACjC;;AAEG;AACoB,QAAA,IAAQ,CAAA,QAAA,GAAY,KAAK;AAChD;;AAEG;AACoB,QAAA,IAAI,CAAA,IAAA,GAAiD,OAAO;AAE1E,QAAA,IAAM,CAAA,MAAA,GAAG,EAAE;AAkCrB;IA/BC,iBAAiB,GAAA;AACf,QAAA,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,UAAU,EAAE;AAC/D,QAAA,IAAI,CAAC,MAAM,CAAC,kBAAkB,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,cAAc,CAAC;AAC5E,QAAA,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,cAAc,CAAC;QAC1E,IAAI,CAAC,SAAS,EAAE;;IAGlB,SAAS,GAAA;QACP,IAAI,CAAC,MAAM,GAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EACN,IAAI,CAAC,MAAM,KACd,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAA,EAAG,IAAI,CAAC,KAAK,CAAA,CAAE,CAAC,EACtD,cAAc,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAG,EAAA,IAAI,CAAC,KAAK,CAAO,KAAA,CAAA,CAAC,GACjE;;IAGH,UAAU,GAAA;AACR,QAAA,MAAM,OAAO,GAAG;AACd,YAAA,WAAW,EAAE,IAAI;YACjB,UAAU,EAAE,IAAI,CAAC;SAClB;QACD,OAAO,CAAC,GAAG,IAAI,CAAC,IAAI,CAAE,CAAA,CAAC,GAAG,IAAI;AAC9B,QAAA,OAAO,OAAO;;IAGhB,MAAM,GAAA;AACJ,QAAA,QACEA,QAACC,UAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACHD,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,MAAM,EAAQ,CAAA,CACpD;;;;;;;"}

package/dist/cjs/cura-badge-pill.cjs.entry.js

@@ -1,24 +1,39 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-60783089.js');
+var index = require('./index-BK9MSAiE.js');
+require('./cura-theme-module-CJkmAxBA.js');
 
 const curaBadgePillCss = ".badge-container{display:flex;align-items:center;justify-content:center;gap:calc(var(--cura-spacing-base) * 1px);padding:calc(var(--cura-spacing-base) * 1px);border-radius:var(--border-radius);font-family:var(--font-family);font-size:var(--font-size);position:relative;box-sizing:border-box;width:fit-content;height:calc(var(--cura-spacing-base) * 5px);min-width:calc(var(--cura-spacing-base) * 5px);background-color:var(--color-background)}.badge-container::before{content:\"\";width:100%;height:100%;position:absolute;left:0px;top:0px;box-sizing:border-box;border:1px solid transparent;border-radius:var(--border-radius);pointer-events:none}.badge-container.icon-only cura-label{display:none !important}.badge-container.disabled{background-color:var(--color-background-disabled)}.badge-container.outline{background-color:transparent}.badge-container.outline::before{border:1px solid var(--color-base)}.badge-container.outline.disabled::before{border:1px solid var(--color-outline-disabled)}.badge-container.transparent{background-color:transparent}.badge-container.transparent::before{border:1px solid transparent}.badge-container.transparent.disabled{background-color:transparent}.badge-container cura-icon{display:flex}";
-const CuraBadgePillStyle0 = curaBadgePillCss;
 
 const CuraBadgePill = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        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();
@@ -73,8 +88,9 @@ const CuraBadgePill = class {
         "color": ["watchColorChange"]
     }; }
 };
-CuraBadgePill.style = CuraBadgePillStyle0;
+CuraBadgePill.style = curaBadgePillCss;
 
 exports.cura_badge_pill = CuraBadgePill;
+//# sourceMappingURL=cura-badge-pill.entry.cjs.js.map
 
 //# sourceMappingURL=cura-badge-pill.cjs.entry.js.map

package/dist/cjs/cura-badge-pill.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"cura-badge-pill.entry.cjs.js","mappings":"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","names":["h","Host"],"sources":["src/components/badges/cura-badge-pill/cura-badge-pill.scss?tag=cura-badge-pill&encapsulation=shadow","src/components/badges/cura-badge-pill/cura-badge-pill.tsx"],"sourcesContent":["@import \"../../../scss/mixins/spacing.scss\";\n\n.badge-container {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: #{$spacing-tiny};\n  padding: #{$spacing-tiny};\n  border-radius: var(--border-radius);\n  font-family: var(--font-family);\n  font-size: var(--font-size);\n  position: relative;\n  box-sizing: border-box;\n  width: fit-content;\n  height: #{$spacing-xs};\n  min-width: #{$spacing-xs};\n\n  background-color: var(--color-background);\n\n  &::before {\n    content: \"\";\n    width: 100%;\n    height: 100%;\n    position: absolute;\n    left: 0px;\n    top: 0px;\n    box-sizing: border-box;\n    border: 1px solid transparent;\n    border-radius: var(--border-radius);\n    pointer-events: none;\n  }\n\n  &.icon-only {\n    cura-label {\n      display: none !important;\n    }\n  }\n\n  &.disabled {\n    background-color: var(--color-background-disabled);\n  }\n\n  &.outline {\n    background-color: transparent;\n\n    &::before {\n      border: 1px solid var(--color-base);\n    }\n\n    &.disabled::before {\n      border: 1px solid var(--color-outline-disabled);\n    }\n  }\n\n  &.transparent {\n    background-color: transparent;\n\n    &::before {\n      border: 1px solid transparent;\n    }\n\n    &.disabled {\n      background-color: transparent;\n    }\n  }\n\n  cura-icon {\n    display: flex;\n  }\n}\n","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.entry.cjs.js","mappings":"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","names":["h","Host"],"sources":["src/components/badges/cura-badge-pill/cura-badge-pill.scss?tag=cura-badge-pill&encapsulation=shadow","src/components/badges/cura-badge-pill/cura-badge-pill.tsx"],"sourcesContent":["@import \"../../../scss/mixins/spacing.scss\";\n\n.badge-container {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: #{$spacing-tiny};\n  padding: #{$spacing-tiny};\n  border-radius: var(--border-radius);\n  font-family: var(--font-family);\n  font-size: var(--font-size);\n  position: relative;\n  box-sizing: border-box;\n  width: fit-content;\n  height: #{$spacing-xs};\n  min-width: #{$spacing-xs};\n\n  background-color: var(--color-background);\n\n  &::before {\n    content: \"\";\n    width: 100%;\n    height: 100%;\n    position: absolute;\n    left: 0px;\n    top: 0px;\n    box-sizing: border-box;\n    border: 1px solid transparent;\n    border-radius: var(--border-radius);\n    pointer-events: none;\n  }\n\n  &.icon-only {\n    cura-label {\n      display: none !important;\n    }\n  }\n\n  &.disabled {\n    background-color: var(--color-background-disabled);\n  }\n\n  &.outline {\n    background-color: transparent;\n\n    &::before {\n      border: 1px solid var(--color-base);\n    }\n\n    &.disabled::before {\n      border: 1px solid var(--color-outline-disabled);\n    }\n  }\n\n  &.transparent {\n    background-color: transparent;\n\n    &::before {\n      border: 1px solid transparent;\n    }\n\n    &.disabled {\n      background-color: transparent;\n    }\n  }\n\n  cura-icon {\n    display: flex;\n  }\n}\n","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}

package/dist/cjs/cura-badge-pill.entry.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"cura-badge-pill.entry.cjs.js","sources":["src/components/badges/cura-badge-pill/cura-badge-pill.scss?tag=cura-badge-pill&encapsulation=shadow","src/components/badges/cura-badge-pill/cura-badge-pill.tsx"],"sourcesContent":["@import \"../../../scss/mixins/spacing.scss\";\n\n.badge-container {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: #{$spacing-tiny};\n  padding: #{$spacing-tiny};\n  border-radius: var(--border-radius);\n  font-family: var(--font-family);\n  font-size: var(--font-size);\n  position: relative;\n  box-sizing: border-box;\n  width: fit-content;\n  height: #{$spacing-xs};\n  min-width: #{$spacing-xs};\n\n  background-color: var(--color-background);\n\n  &::before {\n    content: \"\";\n    width: 100%;\n    height: 100%;\n    position: absolute;\n    left: 0px;\n    top: 0px;\n    box-sizing: border-box;\n    border: 1px solid transparent;\n    border-radius: var(--border-radius);\n    pointer-events: none;\n  }\n\n  &.icon-only {\n    cura-label {\n      display: none !important;\n    }\n  }\n\n  &.disabled {\n    background-color: var(--color-background-disabled);\n  }\n\n  &.outline {\n    background-color: transparent;\n\n    &::before {\n      border: 1px solid var(--color-base);\n    }\n\n    &.disabled::before {\n      border: 1px solid var(--color-outline-disabled);\n    }\n  }\n\n  &.transparent {\n    background-color: transparent;\n\n    &::before {\n      border: 1px solid transparent;\n    }\n\n    &.disabled {\n      background-color: transparent;\n    }\n  }\n\n  cura-icon {\n    display: flex;\n  }\n}\n","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"],"names":["h","Host"],"mappings":"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"}

package/dist/cjs/cura-button-outline.cjs.entry.js

@@ -1,12 +1,10 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-60783089.js');
-const curaButton_definitions = require('./cura-button.definitions-f036371c.js');
+var index = require('./index-BK9MSAiE.js');
+var curaButton_definitions = require('./cura-button.definitions-B3SK8MaV.js');
+require('./cura-theme-module-CJkmAxBA.js');
 
 const curaButtonOutlineCss = ":host{--border-radius:4px;display:inline-block;vertical-align:middle;position:relative}:host button,:host a{outline:none;box-shadow:none;box-sizing:border-box;display:flex;width:100%;align-items:center;justify-content:center;text-decoration:none !important;font-size:var(--font-size);cursor:pointer;transition:background-color 0.07s linear, box-shadow 0.07s linear, border-color 0.07s linear;border-radius:var(--border-radius);position:relative;background-color:transparent;box-sizing:border-box;border:none}:host button:focus,:host a:focus{outline:2px solid #6EA8FF}:host button::before,:host a::before{content:\"\";width:100%;height:100%;position:absolute;left:0px;top:0px;box-sizing:border-box;border:2px solid var(--color-dark-neutral-purewhite);border-radius:var(--border-radius)}:host button:not(.disabled):not(.isLoading):hover,:host a:not(.disabled):not(.isLoading):hover{background-color:var(--color-lighter-color-darker)}:host button:not(.disabled):not(.inverted):not(.isLoading):active,:host a:not(.disabled):not(.inverted):not(.isLoading):active{background-color:var(--color-light-color-darker)}:host button.large,:host a.large{padding:calc(var(--cura-spacing-base) * 3px) calc(var(--cura-spacing-base) * 4px);min-height:calc(var(--cura-spacing-base) * 11px)}:host button.medium,:host a.medium{padding:calc(var(--cura-spacing-base) * 3px);min-height:calc(var(--cura-spacing-base) * 10px)}:host button.small,:host a.small{padding:calc(var(--cura-spacing-base) * 2px);min-height:calc(var(--cura-spacing-base) * 8px)}:host button .button-container,:host a .button-container{display:flex;align-items:center;opacity:1;transition:opacity 0.2s linear;position:relative}:host button.icon-right .button-container,:host a.icon-right .button-container{flex-direction:row-reverse}:host button.justify .button-container,:host a.justify .button-container{width:100%}:host button cura-label,:host a cura-label{flex:1;text-align:var(--text-align, \"left\")}:host button.icon-left cura-icon,:host a.icon-left cura-icon{margin-right:calc(var(--cura-spacing-base) * 3px)}:host button.icon-right cura-icon,:host a.icon-right cura-icon{margin-left:calc(var(--cura-spacing-base) * 3px)}:host button.medium.icon-left cura-icon,:host button.small.icon-left cura-icon,:host a.medium.icon-left cura-icon,:host a.small.icon-left cura-icon{margin-right:calc(var(--cura-spacing-base) * 2px)}:host button.medium.icon-right cura-icon,:host button.small.icon-right cura-icon,:host a.medium.icon-right cura-icon,:host a.small.icon-right cura-icon{margin-left:calc(var(--cura-spacing-base) * 2px)}:host button.disabled,:host a.disabled{cursor:not-allowed}:host button.disabled::before,:host a.disabled::before{border-color:var(--neutral-dark)}:host button.icon-only,:host a.icon-only{padding:calc(var(--cura-spacing-base) * 3px) calc(var(--cura-spacing-base) * 3px)}:host button.icon-only cura-label,:host a.icon-only cura-label{display:none}:host button.icon-only cura-icon,:host a.icon-only cura-icon{margin-left:0 !important;margin-right:0 !important}:host button.icon-only.medium,:host a.icon-only.medium{padding:calc(var(--cura-spacing-base) * 3px)}:host button.icon-only.small,:host a.icon-only.small{padding:calc(var(--cura-spacing-base) * 2px)}:host button cura-loader-circle,:host a cura-loader-circle{position:absolute;display:none}:host button.isLoading,:host a.isLoading{cursor:wait}:host button.isLoading .button-container,:host a.isLoading .button-container{opacity:0}:host button.isLoading cura-loader-circle,:host a.isLoading cura-loader-circle{display:block}";
-const CuraButtonOutlineStyle0 = curaButtonOutlineCss;
 
 const CuraButtonOutline = class {
     constructor(hostRef) {
@@ -18,20 +16,59 @@ const CuraButtonOutline = class {
             this.internals = hostRef.$hostElement$.attachInternals();
             hostRef.$hostElement$["s-ei"] = this.internals;
         }
+        /**
+         * Button type: button (default) | submit | reset
+         */
         this.type = 'button';
+        /**
+        * Button size: small | medium | large (default)
+        */
         this.size = 'large';
+        /**
+        * Disabled state. Boolean.
+        */
         this.disabled = false;
+        /**
+        * Loading state. Boolean.
+        */
         this.isLoading = false;
-        this.iconName = undefined;
+        /**
+        * Custom iconset if needed.
+        */
         this.iconset = 'default';
+        /**
+        * Icon position: left (default) | right.
+        */
         this.iconPosition = 'left';
+        /**
+        * Set button to FAB/icon only.
+        */
         this.iconOnly = false;
-        this.href = undefined;
+        /**
+        * Set target if link.
+        */
         this.target = "_self";
+        /**
+        * Color base from color scheme. Default: primary.
+        */
         this.color = 'primary';
+        /**
+        * Set the font background to dark or light.
+        */
         this.background = 'light';
+        /**
+        * Set the font color to dark or light.
+        */
         this.fontColor = 'dark';
+        /**
+        * Set text aligment for the button label.
+        * Vales: left (default) | center | right.
+        */
         this.textAlign = 'left';
+        /**
+         * Justify icons and label inside the button.
+         * Vales: false (default) | true.
+         */
         this.justify = false;
         this.styles = {};
         this.hovered = false;
@@ -112,8 +149,9 @@ const CuraButtonOutline = class {
         "fontColor": ["getSymbolColor"]
     }; }
 };
-CuraButtonOutline.style = CuraButtonOutlineStyle0;
+CuraButtonOutline.style = curaButtonOutlineCss;
 
 exports.cura_button_outline = CuraButtonOutline;
+//# sourceMappingURL=cura-button-outline.entry.cjs.js.map
 
 //# sourceMappingURL=cura-button-outline.cjs.entry.js.map

package/dist/cjs/cura-button-outline.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"cura-button-outline.entry.cjs.js","mappings":"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","names":["h","labelSizes","Host"],"sources":["src/components/buttons/cura-button-outline/cura-button-outline.scss?tag=cura-button-outline&encapsulation=shadow","src/components/buttons/cura-button-outline/cura-button-outline.tsx"],"sourcesContent":["@import \"../../../scss/mixins/buttons.scss\";\n\n:host {\n  @include button-host();\n\n  button, a {\n    @include button-element() {\n      background-color: transparent;\n      box-sizing: border-box;\n      border: none;\n\n      &::before {\n        content: \"\";\n        width: 100%;\n        height: 100%;\n        position: absolute;\n        left: 0px;\n        top: 0px;\n        box-sizing: border-box;\n        border: 2px solid var(--color-dark-neutral-purewhite);\n        border-radius: var(--border-radius);\n      }\n\n      &:not(.disabled):not(.isLoading):hover {\n       background-color: var(--color-lighter-color-darker);\n      }\n\n      &:not(.disabled):not(.inverted):not(.isLoading):active {\n       background-color: var(--color-light-color-darker);\n      }\n\n    };\n\n    @include button-sizes();\n\n    // Children Elements\n    @include button-container();\n    @include button-label();\n\n\n    @include button-icon();\n\n    // Disabled state\n    @include button-disabled() {\n     &::before {\n      border-color: var(--neutral-dark);\n     }\n    };\n\n    // FAB / Icon-only\n    @include button-icon-only-behavior();\n\n    // Loading State\n    @include button-loading();\n\n  }\n\n}\n","import { Component, Host, h, Prop, Watch, State, AttachInternals } from '@stencil/core';\nimport { labelSizes } from '../cura-button.definitions';\n\n@Component({\n  tag: 'cura-button-outline',\n  styleUrl: 'cura-button-outline.scss',\n  shadow: true,\n  formAssociated: true\n})\nexport class CuraButtonOutline {\n\n  @AttachInternals() internals: ElementInternals;\n\n  /**\n   * Button type: button (default) | submit | reset\n   */\n  @Prop({ reflect: true }) type: 'button' | 'reset' | 'submit' = 'button';\n\n  /**\n  * Button size: small | medium | large (default)\n  */\n  @Prop({ reflect: true }) size: 'small' | 'medium' | 'large' = 'large';\n\n  /**\n  * Disabled state. Boolean.\n  */\n  @Prop({ reflect: true }) disabled = false;\n  /**\n  * Loading state. Boolean.\n  */\n  @Prop({ reflect: true }) isLoading = false;\n\n  /**\n  * Name of the icon to be used from iconset.\n  */\n  @Prop({ reflect: true }) iconName: string;\n  /**\n  * Custom iconset if needed.\n  */\n  @Prop({ reflect: true }) iconset = 'default';\n  /**\n  * Icon position: left (default) | right.\n  */\n  @Prop({ reflect: true }) iconPosition: 'left' | 'right' = 'left';\n  /**\n  * Set button to FAB/icon only.\n  */\n  @Prop({ reflect: true }) iconOnly = false;\n\n  /**\n  * Property href switch button to link.\n  */\n  @Prop({ reflect: true }) href: string;\n  /**\n  * Set target if link.\n  */\n  @Prop({ reflect: true }) target = \"_self\";\n  /**\n  * Color base from color scheme. Default: primary.\n  */\n  @Prop() color = 'primary';\n  /**\n  * Set the font background to dark or light.\n  */\n  @Prop() background: 'dark' | 'light' = 'light';\n\n  /**\n  * Set the font color to dark or light.\n  */\n  @Prop() fontColor: 'dark' | 'light' = 'dark';\n  /**\n  * Set text aligment for the button label.\n  * Vales: left (default) | center | right.\n  */\n  @Prop({ reflect: true }) textAlign: 'left' | 'center' | 'right' = 'left';\n\n  /**\n   * Justify icons and label inside the button.\n   * Vales: false (default) | true.\n   */\n  @Prop({ reflect: true }) justify = false;\n\n  @State() styles = {};\n\n  @State() hovered = false;\n\n  weights;\n\n  connectedCallback() {\n    this.weights = window.CuraAPI.theme.fonts.getWeights();\n    this.styles['--base-spacing'] = window.CuraAPI.theme.spacing.getSpacing();\n    this.styles['--neutral-white'] = window.CuraAPI.theme.colors.getColor(`neutral-white`);\n    this.styles['--neutral-base'] = window.CuraAPI.theme.colors.getColor(`neutral-base`);\n    this.styles['--neutral-dark'] = window.CuraAPI.theme.colors.getColor(`neutral-dark`);\n    this.styles['--font-size'] = window.CuraAPI.theme.fonts.getSize();\n    this.styles['--font-family'] = window.CuraAPI.theme.fonts.getFamily();\n    this.styles['--font-weight-medium'] = this.weights.medium;\n    this.styles['--text-align'] = this.textAlign;\n    this.setColors();\n  }\n\n\n  getClasses() {\n    const classes = {};\n    classes[`${this.size?.toLowerCase()}`] = true;\n    classes[`icon-${this.iconPosition.toLowerCase()}`] = true;\n    classes[`icon-only`] = this.iconOnly;\n    classes['disabled'] = this.disabled;\n    classes['isLoading'] = this.isLoading;\n    classes['justify'] = this.justify;\n    return classes;\n  }\n\n  @Watch('background')\n  @Watch('color')\n  setColors() {\n    const colors = [\n      { name: '--color-dark-neutral-purewhite', thema: `${this.background === 'light' ? `${this.color}-dark` : 'neutral-purewhite'}` },\n      { name: '--color-lighter-color-darker', thema: `${this.background === 'light' ? `${this.color}-lighter` : `${this.color}-darker`}` },\n      { name: '--color-light-color-darker', thema: `${this.background === 'light' ? `${this.color}-light` : `${this.color}-lighter`}` },\n      { name: '--neutral-dark', thema: 'neutral-dark' },\n    ]\n\n    colors.forEach(color => this.styles[color.name] = window.CuraAPI.theme.colors.getColor(color.thema));\n    this.styles = { ...this.styles };\n  }\n\n  getIcon() {\n    if (!this.iconName) return '';\n    const iconSize = this.size === 'large' ? 20 : 16;\n\n    return <cura-icon name={this.iconName} iconset={this.iconset} size={iconSize} color={this.getSymbolColor()}></cura-icon>;\n  }\n\n\n  handleMouseEnter() {\n    if (this.disabled) return;\n    this.hovered = true;\n  }\n\n  handleMouseLeave() {\n    this.hovered = false;\n  }\n\n  @Watch('fontColor')\n  @Watch('color')\n  getSymbolColor() {\n    if (this.disabled) return 'neutral-dark';\n    return this.fontColor === 'light' ? 'neutral-purewhite' : `${this.color}-darker`;\n  }\n\n  handleClick(e: Event) {\n    if (this.disabled || this.isLoading) {\n      e.preventDefault();\n      return;\n    }\n    if (!this.href) {\n      if (this.type === 'submit' && this.internals.form) this.internals.form.submit();\n      if (this.type === 'reset' && this.internals.form) this.internals.form.reset();\n    }\n  }\n\n  render() {\n    const symbolColor = this.getSymbolColor();\n    const labelSize = labelSizes[this.size] || labelSizes[\"default\"];\n    return (\n      <Host role={ this.href ? 'link' : this.type }\n        aria-disabled={this.disabled}>\n        {this.href ? (\n          <a href={this.disabled ? '' : this.href}\n            target={this.target}\n            class={this.getClasses()}\n            style={this.styles}\n            onClick={(e) => this.handleClick(e)}\n            onMouseEnter={() => this.handleMouseEnter()}\n            onMouseLeave={() => this.handleMouseLeave()}>\n            <span class=\"button-container\">\n              {this.getIcon()}\n              <cura-label size={labelSize} lineHeight='normal' color={symbolColor}><slot></slot></cura-label>\n            </span>\n            <cura-loader-circle size={this.size} color={symbolColor}></cura-loader-circle>\n          </a>\n        ) : (\n          <button class={this.getClasses()}\n            style={this.styles}\n            disabled={this.disabled || null}\n            onClick={(e) => this.handleClick(e)}\n            onMouseEnter={() => this.handleMouseEnter()}\n            onMouseLeave={() => this.handleMouseLeave()}\n            type={this.type}>\n            <span class=\"button-container\">\n              {this.getIcon()}\n              <cura-label size={labelSize} lineHeight='normal' color={symbolColor}><slot></slot></cura-label>\n            </span>\n            <cura-loader-circle size={this.size} color={symbolColor}></cura-loader-circle>\n          </button>\n        )}\n      </Host>\n    );\n  }\n\n}\n"],"version":3}
+{"file":"cura-button-outline.entry.cjs.js","mappings":"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","names":["h","labelSizes","Host"],"sources":["src/components/buttons/cura-button-outline/cura-button-outline.scss?tag=cura-button-outline&encapsulation=shadow","src/components/buttons/cura-button-outline/cura-button-outline.tsx"],"sourcesContent":["@import \"../../../scss/mixins/buttons.scss\";\n\n:host {\n  @include button-host();\n\n  button, a {\n    @include button-element() {\n      background-color: transparent;\n      box-sizing: border-box;\n      border: none;\n\n      &::before {\n        content: \"\";\n        width: 100%;\n        height: 100%;\n        position: absolute;\n        left: 0px;\n        top: 0px;\n        box-sizing: border-box;\n        border: 2px solid var(--color-dark-neutral-purewhite);\n        border-radius: var(--border-radius);\n      }\n\n      &:not(.disabled):not(.isLoading):hover {\n       background-color: var(--color-lighter-color-darker);\n      }\n\n      &:not(.disabled):not(.inverted):not(.isLoading):active {\n       background-color: var(--color-light-color-darker);\n      }\n\n    };\n\n    @include button-sizes();\n\n    // Children Elements\n    @include button-container();\n    @include button-label();\n\n\n    @include button-icon();\n\n    // Disabled state\n    @include button-disabled() {\n     &::before {\n      border-color: var(--neutral-dark);\n     }\n    };\n\n    // FAB / Icon-only\n    @include button-icon-only-behavior();\n\n    // Loading State\n    @include button-loading();\n\n  }\n\n}\n","import { Component, Host, h, Prop, Watch, State, AttachInternals } from '@stencil/core';\nimport { labelSizes } from '../cura-button.definitions';\n\n@Component({\n  tag: 'cura-button-outline',\n  styleUrl: 'cura-button-outline.scss',\n  shadow: true,\n  formAssociated: true\n})\nexport class CuraButtonOutline {\n\n  @AttachInternals() internals: ElementInternals;\n\n  /**\n   * Button type: button (default) | submit | reset\n   */\n  @Prop({ reflect: true }) type: 'button' | 'reset' | 'submit' = 'button';\n\n  /**\n  * Button size: small | medium | large (default)\n  */\n  @Prop({ reflect: true }) size: 'small' | 'medium' | 'large' = 'large';\n\n  /**\n  * Disabled state. Boolean.\n  */\n  @Prop({ reflect: true }) disabled = false;\n  /**\n  * Loading state. Boolean.\n  */\n  @Prop({ reflect: true }) isLoading = false;\n\n  /**\n  * Name of the icon to be used from iconset.\n  */\n  @Prop({ reflect: true }) iconName: string;\n  /**\n  * Custom iconset if needed.\n  */\n  @Prop({ reflect: true }) iconset = 'default';\n  /**\n  * Icon position: left (default) | right.\n  */\n  @Prop({ reflect: true }) iconPosition: 'left' | 'right' = 'left';\n  /**\n  * Set button to FAB/icon only.\n  */\n  @Prop({ reflect: true }) iconOnly = false;\n\n  /**\n  * Property href switch button to link.\n  */\n  @Prop({ reflect: true }) href: string;\n  /**\n  * Set target if link.\n  */\n  @Prop({ reflect: true }) target = \"_self\";\n  /**\n  * Color base from color scheme. Default: primary.\n  */\n  @Prop() color = 'primary';\n  /**\n  * Set the font background to dark or light.\n  */\n  @Prop() background: 'dark' | 'light' = 'light';\n\n  /**\n  * Set the font color to dark or light.\n  */\n  @Prop() fontColor: 'dark' | 'light' = 'dark';\n  /**\n  * Set text aligment for the button label.\n  * Vales: left (default) | center | right.\n  */\n  @Prop({ reflect: true }) textAlign: 'left' | 'center' | 'right' = 'left';\n\n  /**\n   * Justify icons and label inside the button.\n   * Vales: false (default) | true.\n   */\n  @Prop({ reflect: true }) justify = false;\n\n  @State() styles = {};\n\n  @State() hovered = false;\n\n  weights;\n\n  connectedCallback() {\n    this.weights = window.CuraAPI.theme.fonts.getWeights();\n    this.styles['--base-spacing'] = window.CuraAPI.theme.spacing.getSpacing();\n    this.styles['--neutral-white'] = window.CuraAPI.theme.colors.getColor(`neutral-white`);\n    this.styles['--neutral-base'] = window.CuraAPI.theme.colors.getColor(`neutral-base`);\n    this.styles['--neutral-dark'] = window.CuraAPI.theme.colors.getColor(`neutral-dark`);\n    this.styles['--font-size'] = window.CuraAPI.theme.fonts.getSize();\n    this.styles['--font-family'] = window.CuraAPI.theme.fonts.getFamily();\n    this.styles['--font-weight-medium'] = this.weights.medium;\n    this.styles['--text-align'] = this.textAlign;\n    this.setColors();\n  }\n\n\n  getClasses() {\n    const classes = {};\n    classes[`${this.size?.toLowerCase()}`] = true;\n    classes[`icon-${this.iconPosition.toLowerCase()}`] = true;\n    classes[`icon-only`] = this.iconOnly;\n    classes['disabled'] = this.disabled;\n    classes['isLoading'] = this.isLoading;\n    classes['justify'] = this.justify;\n    return classes;\n  }\n\n  @Watch('background')\n  @Watch('color')\n  setColors() {\n    const colors = [\n      { name: '--color-dark-neutral-purewhite', thema: `${this.background === 'light' ? `${this.color}-dark` : 'neutral-purewhite'}` },\n      { name: '--color-lighter-color-darker', thema: `${this.background === 'light' ? `${this.color}-lighter` : `${this.color}-darker`}` },\n      { name: '--color-light-color-darker', thema: `${this.background === 'light' ? `${this.color}-light` : `${this.color}-lighter`}` },\n      { name: '--neutral-dark', thema: 'neutral-dark' },\n    ]\n\n    colors.forEach(color => this.styles[color.name] = window.CuraAPI.theme.colors.getColor(color.thema));\n    this.styles = { ...this.styles };\n  }\n\n  getIcon() {\n    if (!this.iconName) return '';\n    const iconSize = this.size === 'large' ? 20 : 16;\n\n    return <cura-icon name={this.iconName} iconset={this.iconset} size={iconSize} color={this.getSymbolColor()}></cura-icon>;\n  }\n\n\n  handleMouseEnter() {\n    if (this.disabled) return;\n    this.hovered = true;\n  }\n\n  handleMouseLeave() {\n    this.hovered = false;\n  }\n\n  @Watch('fontColor')\n  @Watch('color')\n  getSymbolColor() {\n    if (this.disabled) return 'neutral-dark';\n    return this.fontColor === 'light' ? 'neutral-purewhite' : `${this.color}-darker`;\n  }\n\n  handleClick(e: Event) {\n    if (this.disabled || this.isLoading) {\n      e.preventDefault();\n      return;\n    }\n    if (!this.href) {\n      if (this.type === 'submit' && this.internals.form) this.internals.form.submit();\n      if (this.type === 'reset' && this.internals.form) this.internals.form.reset();\n    }\n  }\n\n  render() {\n    const symbolColor = this.getSymbolColor();\n    const labelSize = labelSizes[this.size] || labelSizes[\"default\"];\n    return (\n      <Host role={ this.href ? 'link' : this.type }\n        aria-disabled={this.disabled}>\n        {this.href ? (\n          <a href={this.disabled ? '' : this.href}\n            target={this.target}\n            class={this.getClasses()}\n            style={this.styles}\n            onClick={(e) => this.handleClick(e)}\n            onMouseEnter={() => this.handleMouseEnter()}\n            onMouseLeave={() => this.handleMouseLeave()}>\n            <span class=\"button-container\">\n              {this.getIcon()}\n              <cura-label size={labelSize} lineHeight='normal' color={symbolColor}><slot></slot></cura-label>\n            </span>\n            <cura-loader-circle size={this.size} color={symbolColor}></cura-loader-circle>\n          </a>\n        ) : (\n          <button class={this.getClasses()}\n            style={this.styles}\n            disabled={this.disabled || null}\n            onClick={(e) => this.handleClick(e)}\n            onMouseEnter={() => this.handleMouseEnter()}\n            onMouseLeave={() => this.handleMouseLeave()}\n            type={this.type}>\n            <span class=\"button-container\">\n              {this.getIcon()}\n              <cura-label size={labelSize} lineHeight='normal' color={symbolColor}><slot></slot></cura-label>\n            </span>\n            <cura-loader-circle size={this.size} color={symbolColor}></cura-loader-circle>\n          </button>\n        )}\n      </Host>\n    );\n  }\n\n}\n"],"version":3}

package/dist/cjs/cura-button-outline.entry.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"cura-button-outline.entry.cjs.js","sources":["src/components/buttons/cura-button-outline/cura-button-outline.scss?tag=cura-button-outline&encapsulation=shadow","src/components/buttons/cura-button-outline/cura-button-outline.tsx"],"sourcesContent":["@import \"../../../scss/mixins/buttons.scss\";\n\n:host {\n  @include button-host();\n\n  button, a {\n    @include button-element() {\n      background-color: transparent;\n      box-sizing: border-box;\n      border: none;\n\n      &::before {\n        content: \"\";\n        width: 100%;\n        height: 100%;\n        position: absolute;\n        left: 0px;\n        top: 0px;\n        box-sizing: border-box;\n        border: 2px solid var(--color-dark-neutral-purewhite);\n        border-radius: var(--border-radius);\n      }\n\n      &:not(.disabled):not(.isLoading):hover {\n       background-color: var(--color-lighter-color-darker);\n      }\n\n      &:not(.disabled):not(.inverted):not(.isLoading):active {\n       background-color: var(--color-light-color-darker);\n      }\n\n    };\n\n    @include button-sizes();\n\n    // Children Elements\n    @include button-container();\n    @include button-label();\n\n\n    @include button-icon();\n\n    // Disabled state\n    @include button-disabled() {\n     &::before {\n      border-color: var(--neutral-dark);\n     }\n    };\n\n    // FAB / Icon-only\n    @include button-icon-only-behavior();\n\n    // Loading State\n    @include button-loading();\n\n  }\n\n}\n","import { Component, Host, h, Prop, Watch, State, AttachInternals } from '@stencil/core';\nimport { labelSizes } from '../cura-button.definitions';\n\n@Component({\n  tag: 'cura-button-outline',\n  styleUrl: 'cura-button-outline.scss',\n  shadow: true,\n  formAssociated: true\n})\nexport class CuraButtonOutline {\n\n  @AttachInternals() internals: ElementInternals;\n\n  /**\n   * Button type: button (default) | submit | reset\n   */\n  @Prop({ reflect: true }) type: 'button' | 'reset' | 'submit' = 'button';\n\n  /**\n  * Button size: small | medium | large (default)\n  */\n  @Prop({ reflect: true }) size: 'small' | 'medium' | 'large' = 'large';\n\n  /**\n  * Disabled state. Boolean.\n  */\n  @Prop({ reflect: true }) disabled = false;\n  /**\n  * Loading state. Boolean.\n  */\n  @Prop({ reflect: true }) isLoading = false;\n\n  /**\n  * Name of the icon to be used from iconset.\n  */\n  @Prop({ reflect: true }) iconName: string;\n  /**\n  * Custom iconset if needed.\n  */\n  @Prop({ reflect: true }) iconset = 'default';\n  /**\n  * Icon position: left (default) | right.\n  */\n  @Prop({ reflect: true }) iconPosition: 'left' | 'right' = 'left';\n  /**\n  * Set button to FAB/icon only.\n  */\n  @Prop({ reflect: true }) iconOnly = false;\n\n  /**\n  * Property href switch button to link.\n  */\n  @Prop({ reflect: true }) href: string;\n  /**\n  * Set target if link.\n  */\n  @Prop({ reflect: true }) target = \"_self\";\n  /**\n  * Color base from color scheme. Default: primary.\n  */\n  @Prop() color = 'primary';\n  /**\n  * Set the font background to dark or light.\n  */\n  @Prop() background: 'dark' | 'light' = 'light';\n\n  /**\n  * Set the font color to dark or light.\n  */\n  @Prop() fontColor: 'dark' | 'light' = 'dark';\n  /**\n  * Set text aligment for the button label.\n  * Vales: left (default) | center | right.\n  */\n  @Prop({ reflect: true }) textAlign: 'left' | 'center' | 'right' = 'left';\n\n  /**\n   * Justify icons and label inside the button.\n   * Vales: false (default) | true.\n   */\n  @Prop({ reflect: true }) justify = false;\n\n  @State() styles = {};\n\n  @State() hovered = false;\n\n  weights;\n\n  connectedCallback() {\n    this.weights = window.CuraAPI.theme.fonts.getWeights();\n    this.styles['--base-spacing'] = window.CuraAPI.theme.spacing.getSpacing();\n    this.styles['--neutral-white'] = window.CuraAPI.theme.colors.getColor(`neutral-white`);\n    this.styles['--neutral-base'] = window.CuraAPI.theme.colors.getColor(`neutral-base`);\n    this.styles['--neutral-dark'] = window.CuraAPI.theme.colors.getColor(`neutral-dark`);\n    this.styles['--font-size'] = window.CuraAPI.theme.fonts.getSize();\n    this.styles['--font-family'] = window.CuraAPI.theme.fonts.getFamily();\n    this.styles['--font-weight-medium'] = this.weights.medium;\n    this.styles['--text-align'] = this.textAlign;\n    this.setColors();\n  }\n\n\n  getClasses() {\n    const classes = {};\n    classes[`${this.size?.toLowerCase()}`] = true;\n    classes[`icon-${this.iconPosition.toLowerCase()}`] = true;\n    classes[`icon-only`] = this.iconOnly;\n    classes['disabled'] = this.disabled;\n    classes['isLoading'] = this.isLoading;\n    classes['justify'] = this.justify;\n    return classes;\n  }\n\n  @Watch('background')\n  @Watch('color')\n  setColors() {\n    const colors = [\n      { name: '--color-dark-neutral-purewhite', thema: `${this.background === 'light' ? `${this.color}-dark` : 'neutral-purewhite'}` },\n      { name: '--color-lighter-color-darker', thema: `${this.background === 'light' ? `${this.color}-lighter` : `${this.color}-darker`}` },\n      { name: '--color-light-color-darker', thema: `${this.background === 'light' ? `${this.color}-light` : `${this.color}-lighter`}` },\n      { name: '--neutral-dark', thema: 'neutral-dark' },\n    ]\n\n    colors.forEach(color => this.styles[color.name] = window.CuraAPI.theme.colors.getColor(color.thema));\n    this.styles = { ...this.styles };\n  }\n\n  getIcon() {\n    if (!this.iconName) return '';\n    const iconSize = this.size === 'large' ? 20 : 16;\n\n    return <cura-icon name={this.iconName} iconset={this.iconset} size={iconSize} color={this.getSymbolColor()}></cura-icon>;\n  }\n\n\n  handleMouseEnter() {\n    if (this.disabled) return;\n    this.hovered = true;\n  }\n\n  handleMouseLeave() {\n    this.hovered = false;\n  }\n\n  @Watch('fontColor')\n  @Watch('color')\n  getSymbolColor() {\n    if (this.disabled) return 'neutral-dark';\n    return this.fontColor === 'light' ? 'neutral-purewhite' : `${this.color}-darker`;\n  }\n\n  handleClick(e: Event) {\n    if (this.disabled || this.isLoading) {\n      e.preventDefault();\n      return;\n    }\n    if (!this.href) {\n      if (this.type === 'submit' && this.internals.form) this.internals.form.submit();\n      if (this.type === 'reset' && this.internals.form) this.internals.form.reset();\n    }\n  }\n\n  render() {\n    const symbolColor = this.getSymbolColor();\n    const labelSize = labelSizes[this.size] || labelSizes[\"default\"];\n    return (\n      <Host role={ this.href ? 'link' : this.type }\n        aria-disabled={this.disabled}>\n        {this.href ? (\n          <a href={this.disabled ? '' : this.href}\n            target={this.target}\n            class={this.getClasses()}\n            style={this.styles}\n            onClick={(e) => this.handleClick(e)}\n            onMouseEnter={() => this.handleMouseEnter()}\n            onMouseLeave={() => this.handleMouseLeave()}>\n            <span class=\"button-container\">\n              {this.getIcon()}\n              <cura-label size={labelSize} lineHeight='normal' color={symbolColor}><slot></slot></cura-label>\n            </span>\n            <cura-loader-circle size={this.size} color={symbolColor}></cura-loader-circle>\n          </a>\n        ) : (\n          <button class={this.getClasses()}\n            style={this.styles}\n            disabled={this.disabled || null}\n            onClick={(e) => this.handleClick(e)}\n            onMouseEnter={() => this.handleMouseEnter()}\n            onMouseLeave={() => this.handleMouseLeave()}\n            type={this.type}>\n            <span class=\"button-container\">\n              {this.getIcon()}\n              <cura-label size={labelSize} lineHeight='normal' color={symbolColor}><slot></slot></cura-label>\n            </span>\n            <cura-loader-circle size={this.size} color={symbolColor}></cura-loader-circle>\n          </button>\n        )}\n      </Host>\n    );\n  }\n\n}\n"],"names":["h","labelSizes","Host"],"mappings":"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"}