@rededor/cura 1.4.0-alpha.1 → 1.5.0-alpha.0

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

@@ -0,0 +1,220 @@
+import { Host, h } from "@stencil/core";
+export class CuraBadgePill {
+    constructor() {
+        this.theme = window.CuraAPI.theme;
+        this.type = 'solid';
+        this.color = 'primary';
+        this.iconName = undefined;
+        this.iconset = 'default';
+        this.disabled = false;
+        this.iconOnly = false;
+        this.borderRadius = "2px";
+        this.styles = {};
+    }
+    handleColorChange() {
+        this.setColors();
+    }
+    connectedCallback() {
+        this.setBaseStyles();
+        this.setColors();
+    }
+    setBaseStyles() {
+        this.styles['--base-spacing'] = this.theme.spacing.getSpacing();
+        this.styles['--font-family'] = this.theme.fonts.getFamily();
+        this.styles['--font-size'] = this.theme.fonts.getSize();
+        this.styles = Object.assign({}, this.styles);
+    }
+    setColors() {
+        const colors = [
+            { name: '--color-background', theme: `${this.color}-lighter` },
+            { name: '--color-base', theme: `${this.color}-dark` },
+            { name: '--color-background-disabled', theme: 'neutral-pale' },
+            { name: '--color-outline-disabled', theme: 'neutral-medium' },
+        ];
+        colors.forEach(color => {
+            this.styles[color.name] = this.theme.colors.getColor(color.theme);
+        });
+        this.styles = Object.assign({}, this.styles);
+    }
+    hostCSSProperties() {
+        return {
+            '--border-radius': this.borderRadius || '2px',
+        };
+    }
+    getClasses() {
+        const classes = {};
+        classes['badge-container'] = true;
+        classes[`icon-only`] = this.iconOnly;
+        classes['disabled'] = this.disabled;
+        classes[`${this.type}`] = true;
+        return classes;
+    }
+    getSymbolColor() {
+        return this.disabled
+            ? 'neutral-medium'
+            : `${this.color}-dark`;
+    }
+    getIcon() {
+        if (!this.iconName)
+            return '';
+        return h("cura-icon", { name: this.iconName, iconset: this.iconset, size: 'micro', color: this.getSymbolColor() });
+    }
+    render() {
+        const symbolColor = this.getSymbolColor();
+        return (h(Host, { key: 'd2b79aa7ede4462cd2b591b62321ef69b9e4fed3', style: this.hostCSSProperties() }, h("div", { key: 'a82383b03c02990b5879ca647ae06cabb5c32845', class: this.getClasses(), style: this.styles }, this.getIcon(), h("cura-label", { key: '1ccf493530fa6b7cee25db83d0fcb37cf308df3d', size: 'xsmall', "line-height": "117%", color: symbolColor }, h("slot", { key: '488e4fbd8b30cfcd15b25c9227e129b1c6e1ce32' })))));
+    }
+    static get is() { return "cura-badge-pill"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["cura-badge-pill.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["cura-badge-pill.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "type": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'solid' | 'outline' | 'transparent'",
+                    "resolved": "\"outline\" | \"solid\" | \"transparent\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Badge type: solid | outline | transparent"
+                },
+                "attribute": "type",
+                "reflect": true,
+                "defaultValue": "'solid'"
+            },
+            "color": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'primary' | 'secondary' | 'accent' | 'neutral' | 'info' | 'success' | 'warning' | 'error'",
+                    "resolved": "\"accent\" | \"error\" | \"info\" | \"neutral\" | \"primary\" | \"secondary\" | \"success\" | \"warning\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Color base from color scheme. Default: primary"
+                },
+                "attribute": "color",
+                "reflect": false,
+                "defaultValue": "'primary'"
+            },
+            "iconName": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Name of the icon to be used from iconset"
+                },
+                "attribute": "icon-name",
+                "reflect": true
+            },
+            "iconset": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Custom iconset if needed"
+                },
+                "attribute": "iconset",
+                "reflect": true,
+                "defaultValue": "'default'"
+            },
+            "disabled": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Disabled state. Boolean"
+                },
+                "attribute": "disabled",
+                "reflect": true,
+                "defaultValue": "false"
+            },
+            "iconOnly": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Set badge to icon only. Boolean"
+                },
+                "attribute": "icon-only",
+                "reflect": true,
+                "defaultValue": "false"
+            },
+            "borderRadius": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Set border-radius."
+                },
+                "attribute": "border-radius",
+                "reflect": true,
+                "defaultValue": "\"2px\""
+            }
+        };
+    }
+    static get states() {
+        return {
+            "styles": {}
+        };
+    }
+    static get elementRef() { return "host"; }
+    static get watchers() {
+        return [{
+                "propName": "color",
+                "methodName": "handleColorChange"
+            }];
+    }
+}
+//# sourceMappingURL=cura-badge-pill.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"cura-badge-pill.js","sourceRoot":"","sources":["../../../../src/components/badges/cura-badge-pill/cura-badge-pill.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, Prop, State, h, Watch, Element } from '@stencil/core';\n\n@Component({\n  tag: 'cura-badge-pill',\n  styleUrl: 'cura-badge-pill.scss',\n  shadow: true,\n})\nexport class CuraBadgePill {\n  @Element() host: HTMLElement;\n\n  /**\n   * Badge type: solid | outline | transparent\n   */\n  @Prop({ reflect: true }) type: 'solid' | 'outline' | 'transparent' = 'solid';\n\n  /**\n   * Color base from color scheme. Default: primary\n   */\n  @Prop() color: 'primary' | 'secondary' | 'accent' | 'neutral' | 'info' | 'success' | 'warning' | 'error' = '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  handleColorChange() {\n    this.setColors();\n  }\n\n  connectedCallback() {\n    this.setBaseStyles();\n    this.setColors();\n  }\n\n  private setBaseStyles() {\n    this.styles['--base-spacing'] = this.theme.spacing.getSpacing();\n    this.styles['--font-family'] = this.theme.fonts.getFamily();\n    this.styles['--font-size'] = this.theme.fonts.getSize();\n    this.styles = { ...this.styles };\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    colors.forEach(color => {\n      this.styles[color.name] = this.theme.colors.getColor(color.theme);\n    });\n    this.styles = { ...this.styles };\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\n      ? 'neutral-medium'\n      : `${this.color}-dark`;\n  }\n\n  getIcon() {\n    if (!this.iconName) return '';\n    return <cura-icon\n      name={this.iconName}\n      iconset={this.iconset}\n      size={'micro'}\n      color={this.getSymbolColor()}\n    />;\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"]}

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

@@ -0,0 +1,126 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s)
+        if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+            t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import iconNames from "../../../assets/icons/iconset-default-list";
+export default {
+    title: 'Componentes/Badges/Badge Pill',
+    tags: ['autodocs'],
+    render: (_a) => {
+        var args = __rest(_a, []);
+        return `<cura-badge-pill
+  type="${args.type}"
+  color="${args.color}"${args.iconName ? `
+  icon-name="${args.iconName}"` : ''} ${args.iconset ? `
+  iconset="${args.iconset}"` : ''} ${args.disabled ? `
+  disabled` : ''} ${args.iconOnly ? `
+  icon-only` : ''} ${args.borderRadius ? `
+  border-radius="${args.borderRadius}"` : ''}
+>
+  ${args.label}
+</cura-badge-pill>
+${args.cssBorderRadius ? `<style>
+  cura-badge-pill {
+    --border-radius: ${args.cssBorderRadius} !important;
+  }
+</style>` : ''}`;
+    },
+    argTypes: {
+        type: {
+            control: { type: 'select' },
+            options: ['solid', 'outline', 'transparent'],
+            description: 'Tipo do badge',
+            table: {
+                category: 'Properties',
+                defaultValue: { summary: 'solid' }
+            }
+        },
+        color: {
+            control: { type: 'select' },
+            options: ['primary', 'secondary', 'accent', 'neutral', 'info', 'success', 'warning', 'error'],
+            description: 'Cor base do badge',
+            table: {
+                category: 'Properties',
+                defaultValue: { summary: 'primary' }
+            }
+        },
+        iconName: {
+            control: { type: 'select' },
+            options: ['', ...iconNames],
+            description: 'Nome do ícone do iconset',
+            table: {
+                category: 'Icons'
+            }
+        },
+        iconset: {
+            control: { type: 'text' },
+            description: 'Conjunto de ícones personalizado',
+            table: {
+                category: 'Icons',
+                defaultValue: { summary: 'default' }
+            }
+        },
+        iconOnly: {
+            control: 'boolean',
+            description: 'Mostra apenas o ícone',
+            table: {
+                category: 'Icons',
+                defaultValue: { summary: false }
+            }
+        },
+        disabled: {
+            control: 'boolean',
+            description: 'Estado desabilitado',
+            table: {
+                category: 'State',
+                defaultValue: { summary: false }
+            }
+        },
+        label: {
+            control: 'text',
+            description: 'Label do badge',
+            table: {
+                category: 'Properties'
+            }
+        },
+        borderRadius: {
+            control: 'text',
+            description: 'Border radius do badge',
+            table: {
+                category: 'Properties',
+                defaultValue: { summary: '2px' }
+            }
+        },
+        cssBorderRadius: {
+            control: 'text',
+            name: '--border-radius',
+            description: 'É possível sobrescrever o border-radius do componente (Ex: 10px, 50%, etc.)',
+            table: {
+                category: 'CSS Properties',
+                defaultValue: { summary: '' }
+            }
+        },
+    },
+};
+export const BadgePill = {
+    args: {
+        type: 'solid',
+        color: 'primary',
+        iconName: '',
+        iconset: '',
+        disabled: false,
+        iconOnly: false,
+        label: 'Badge Pill',
+        borderRadius: '',
+        cssBorderRadius: '',
+    },
+};
+//# sourceMappingURL=cura-badge-pill.stories.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"cura-badge-pill.stories.js","sourceRoot":"","sources":["../../../../src/components/badges/cura-badge-pill/cura-badge-pill.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import iconNames from '../../../assets/icons/iconset-default-list';\n\nexport default {\n  title: 'Componentes/Badges/Badge Pill',\n  tags: ['autodocs'],\n  render: ({ ...args }) => {\n    return `<cura-badge-pill\n  type=\"${args.type}\"\n  color=\"${args.color}\"${args.iconName ? `\n  icon-name=\"${args.iconName}\"` : ''} ${args.iconset ? `\n  iconset=\"${args.iconset}\"` : ''} ${args.disabled ? `\n  disabled` : ''} ${args.iconOnly ? `\n  icon-only` : ''} ${args.borderRadius ? `\n  border-radius=\"${args.borderRadius}\"` : ''}\n>\n  ${args.label}\n</cura-badge-pill>\n${args.cssBorderRadius ? `<style>\n  cura-badge-pill {\n    --border-radius: ${args.cssBorderRadius} !important;\n  }\n</style>` : ''}`;\n  },\n  argTypes: {\n    type: {\n      control: { type: 'select' },\n      options: ['solid', 'outline', 'transparent'],\n      description: 'Tipo do badge',\n      table: {\n        category: 'Properties',\n        defaultValue: { summary: 'solid' }\n      }\n    },\n    color: {\n      control: { type: 'select' },\n      options: ['primary', 'secondary', 'accent', 'neutral', 'info', 'success', 'warning', 'error'],\n      description: 'Cor base do badge',\n      table: {\n        category: 'Properties',\n        defaultValue: { summary: 'primary' }\n      }\n    },\n    iconName: {\n      control: { type: 'select' },\n      options: ['', ...iconNames],\n      description: 'Nome do ícone do iconset',\n      table: {\n        category: 'Icons'\n      }\n    },\n    iconset: {\n      control: { type: 'text' },\n      description: 'Conjunto de ícones personalizado',\n      table: {\n        category: 'Icons',\n        defaultValue: { summary: 'default' }\n      }\n    },\n    iconOnly: {\n      control: 'boolean',\n      description: 'Mostra apenas o ícone',\n      table: {\n        category: 'Icons',\n        defaultValue: { summary: false }\n      }\n    },\n    disabled: {\n      control: 'boolean',\n      description: 'Estado desabilitado',\n      table: {\n        category: 'State',\n        defaultValue: { summary: false }\n      }\n    },\n    label: {\n      control: 'text',\n      description: 'Label do badge',\n      table: {\n        category: 'Properties'\n      }\n    },\n    borderRadius: {\n      control: 'text',\n      description: 'Border radius do badge',\n      table: {\n        category: 'Properties',\n        defaultValue: { summary: '2px' }\n      }\n    },\n    cssBorderRadius: {\n      control: 'text',\n      name: '--border-radius',\n      description: 'É possível sobrescrever o border-radius do componente (Ex: 10px, 50%, etc.)',\n      table: {\n        category: 'CSS Properties',\n        defaultValue: { summary: '' }\n      }\n    },\n  },\n};\n\nexport const BadgePill = {\n  args: {\n    type: 'solid',\n    color: 'primary',\n    iconName: '',\n    iconset: '',\n    disabled: false,\n    iconOnly: false,\n    label: 'Badge Pill',\n    borderRadius: '',\n    cssBorderRadius: '',\n  },\n};\n\n"]}

package/dist/collection/components/buttons/cura-button/cura-button.js

@@ -88,7 +88,7 @@ export class CuraButton {
     render() {
         const symbolColor = this.getSymbolColor();
         const labelSize = labelSizes[this.size] || labelSizes["default"];
-        return (h(Host, { key: '2831f74cc53bbadcaf1648c759090204cf3c20ea' }, this.href ? (h("a", { href: this.disabled ? '' : this.href, target: this.target, class: this.getClasses(), style: this.styles, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave() }, h("span", { class: "button-container" }, this.getIcon(), h("cura-label", { class: "label", size: labelSize, lineHeight: '105%', color: symbolColor }, h("slot", null))), h("cura-loader-circle", { size: this.size, color: symbolColor }))) : (h("button", { class: this.getClasses(), style: this.styles, disabled: this.disabled || null, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave(), type: this.type }, h("span", { class: "button-container" }, this.getIcon(), h("cura-label", { class: "label", size: labelSize, lineHeight: '105%', color: symbolColor }, h("slot", null))), h("cura-loader-circle", { size: this.size, color: symbolColor })))));
+        return (h(Host, { key: '07b87d98fb398bc2897e666dc8cd54734f20734d' }, this.href ? (h("a", { href: this.disabled ? '' : this.href, target: this.target, class: this.getClasses(), style: this.styles, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave() }, h("span", { class: "button-container" }, this.getIcon(), h("cura-label", { class: "label", size: labelSize, lineHeight: '105%', color: symbolColor }, h("slot", null))), h("cura-loader-circle", { size: this.size, color: symbolColor }))) : (h("button", { class: this.getClasses(), style: this.styles, disabled: this.disabled || null, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave(), type: this.type }, h("span", { class: "button-container" }, this.getIcon(), h("cura-label", { class: "label", size: labelSize, lineHeight: '105%', color: symbolColor }, h("slot", null))), h("cura-loader-circle", { size: this.size, color: symbolColor })))));
     }
     static get is() { return "cura-button"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/buttons/cura-button-outline/cura-button-outline.js

@@ -87,7 +87,7 @@ export class CuraButtonOutline {
     render() {
         const symbolColor = this.getSymbolColor();
         const labelSize = labelSizes[this.size] || labelSizes["default"];
-        return (h(Host, { key: '5adde27bc83165040d4279e4835646e13b08a412' }, this.href ? (h("a", { href: this.disabled ? '' : this.href, target: this.target, class: this.getClasses(), style: this.styles, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave() }, h("span", { class: "button-container" }, this.getIcon(), h("cura-label", { size: labelSize, lineHeight: '105%', color: symbolColor }, h("slot", null))), h("cura-loader-circle", { size: this.size, color: symbolColor }))) : (h("button", { class: this.getClasses(), style: this.styles, disabled: this.disabled || null, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave(), type: this.type }, h("span", { class: "button-container" }, this.getIcon(), h("cura-label", { size: labelSize, lineHeight: '105%', color: symbolColor }, h("slot", null))), h("cura-loader-circle", { size: this.size, color: symbolColor })))));
+        return (h(Host, { key: '0a0c25f94d0c18dbb90e4836ca3e7bcbbe10d032' }, this.href ? (h("a", { href: this.disabled ? '' : this.href, target: this.target, class: this.getClasses(), style: this.styles, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave() }, h("span", { class: "button-container" }, this.getIcon(), h("cura-label", { size: labelSize, lineHeight: '105%', color: symbolColor }, h("slot", null))), h("cura-loader-circle", { size: this.size, color: symbolColor }))) : (h("button", { class: this.getClasses(), style: this.styles, disabled: this.disabled || null, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave(), type: this.type }, h("span", { class: "button-container" }, this.getIcon(), h("cura-label", { size: labelSize, lineHeight: '105%', color: symbolColor }, h("slot", null))), h("cura-loader-circle", { size: this.size, color: symbolColor })))));
     }
     static get is() { return "cura-button-outline"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/buttons/cura-button-select/cura-button-select.js

@@ -57,15 +57,6 @@ export class CuraButtonSelect {
             return this.selected ? 'neutral-white' : 'neutral-black';
         }
     }
-    getColorCounter() {
-        if (this.background === 'dark' && this.disabled) {
-            return !this.selected ? 'neutral-black' : 'neutral-dark';
-        }
-        if (this.background === 'light' && this.disabled) {
-            return 'neutral-pale';
-        }
-        return `${this.color}-lighter`;
-    }
     getColorBagdeNumber() {
         if (this.background === 'dark' && this.disabled) {
             return this.selected ? 'neutral-black' : 'neutral-dark';
@@ -83,7 +74,7 @@ export class CuraButtonSelect {
         return h("cura-icon", { name: this.iconName, size: iconSize, color: this.getLabelFontColor() });
     }
     getCounter() {
-        return (h("cura-badge-number", { color: this.getColorCounter(), class: "badge-number" }, h("cura-label", { color: this.getColorBagdeNumber(), size: "small" }, this.counter)));
+        return (h("cura-badge-counter", { number: this.counter, color: this.color, disabled: this.disabled || null, class: "badge-number" }));
     }
     getCheckIconRight() {
         const iconSize = this.size === 'large' ? 20 : 16;
@@ -105,7 +96,7 @@ export class CuraButtonSelect {
     }
     render() {
         const labelSize = labelSizes[this.size] || labelSizes['default'];
-        return (h(Host, { key: '8b766a3e23c2af13a47d113884047d19717702f2' }, h("button", { key: '90b57f260baa61de7c73e09965e190cd13eb62e1', class: this.getClasses(), style: this.styles, disabled: this.disabled, onClick: e => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave() }, h("div", { key: 'f318438fa59f43846ce5043e4ee290faf3cf05d4', class: "button-container" }, this.iconName ? this.getIcon() : null, h("cura-label", { key: '2d069740c62b32dd3aa0fd74bdafb951d8deb73b', class: "label", size: labelSize, lineHeight: "0%", color: this.getLabelFontColor(), weight: "regular" }, h("slot", { key: 'e71e072d1dd91bbbafa939181cc22ba7b7c6189e' })), this.counter ? this.getCounter() : null, this.iconPosition === 'right' && this.selected ? this.getCheckIconRight() : null))));
+        return (h(Host, { key: '4b7592b68a09c5b93ec1c9ec6b84c7e5afa06ec3' }, h("button", { key: 'd607a733d64f73bd4bd4405e0aeb9d7f5ceebf52', class: this.getClasses(), style: this.styles, disabled: this.disabled, onClick: e => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave() }, h("div", { key: '14e2f5b7309bf6c2252c81ab2f02fb36670facf3', class: "button-container" }, this.iconName ? this.getIcon() : null, h("cura-label", { key: '0759d70b0105a56dfa42bce78f2f5b8c33b04254', class: "label", size: labelSize, lineHeight: "0%", color: this.getLabelFontColor(), weight: "regular" }, h("slot", { key: 'a9935483ee6c67b8142878672804dfb7df0d8479' })), this.counter ? this.getCounter() : null, this.iconPosition === 'right' && this.selected ? this.getCheckIconRight() : null))));
     }
     static get is() { return "cura-button-select"; }
     static get encapsulation() { return "shadow"; }
@@ -175,11 +166,11 @@ export class CuraButtonSelect {
                 "defaultValue": "'medium'"
             },
             "counter": {
-                "type": "any",
+                "type": "number",
                 "mutable": true,
                 "complexType": {
-                    "original": "string | number | null",
-                    "resolved": "number | string",
+                    "original": "number | null",
+                    "resolved": "number",
                     "references": {}
                 },
                 "required": false,

package/dist/collection/components/buttons/cura-button-select/cura-button-select.js.map

@@ -1 +1 @@
-{"version":3,"file":"cura-button-select.js","sourceRoot":"","sources":["../../../../src/components/buttons/cura-button-select/cura-button-select.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, Host, Prop, State, Watch, h } from '@stencil/core';\nimport { labelSizes } from '../cura-button.definitions';\n\n@Component({\n  tag: 'cura-button-select',\n  styleUrl: 'cura-button-select.scss',\n  shadow: true,\n})\nexport class CuraButtonSelect {\n  @Element() host: HTMLElement;\n\n  @Prop({ reflect: true, mutable: true }) selected = false;\n  @Prop({ reflect: true, mutable: true }) iconName: string;\n  @Prop({ reflect: true }) size: 'small' | 'medium' | 'large' = 'medium';\n  @Prop({ reflect: true, mutable: true }) counter: string | number | null;\n  @Prop({ reflect: true }) disabled: boolean;\n  @Prop() background: 'dark' | 'light' = 'light';\n  @Prop() color: string = 'primary';\n  @Prop({ reflect: true }) iconPosition: 'left' | 'right';\n\n  @State() hovered = false;\n  @State() styles = {};\n\n  @Event({ eventName: 'onclick' }) onclick: EventEmitter<{ selected: boolean }>;\n\n  theme = window.CuraAPI.theme;\n\n  weights;\n\n  @Watch('background')\n  @Watch('color')\n  setColors() {\n    const colors = [\n      { name: '--color-border', thema: this.background === 'light' ? `${this.color}-darker` : 'neutral-white' },\n      { name: '--color-border-hover-pressed', thema: this.background === 'light' ? `${this.color}-dark` : `${this.color}-light` },\n      { name: '--color-background-hover', thema: this.background === 'light' ? `${this.color}-light` : `${this.color}-dark` },\n      { name: '--color-select', thema: this.background === 'light' ? `${this.color}-base` : 'neutral-white' },\n      { name: '--color-select-hover-pressed', thema: this.background === 'light' ? `${this.color}-dark` : `${this.color}-lighter` },\n      { name: '--color-select-focus', thema: this.background === 'light' ? `${this.color}-base` : `${this.color}-lighter` },\n      { name: '--color-disable-select', thema: this.background === 'light' ? 'neutral-white' : 'neutral-black' },\n      { name: '--color-border-disable-unselect', thema: 'neutral-dark' },\n      { name: '--color-counter-disabled', thema: this.background === 'light' ? 'neutral-pale' : 'neutral-black' },\n      { name: '--color-counter', thema: !this.disabled && 'primary-lighter' },\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  getClasses() {\n    const classes = {};\n    classes[`${this.size?.toLowerCase()}`] = true;\n    classes[`icon-${this.iconPosition.toLowerCase()}`] = true;\n    classes['disabled'] = this.disabled;\n    classes['selected'] = this.selected;\n    return classes;\n  }\n\n  connectedCallback() {\n    this.weights = window.CuraAPI.theme.fonts.getWeights();\n    this.styles['--base-spacing'] = window.CuraAPI.theme.spacing.getSpacing();\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.setColors();\n  }\n\n  getLabelFontColor() {\n    if (this.disabled) return 'neutral-dark';\n\n    if (this.background === 'dark') {\n      return this.selected ? 'neutral-black' : 'neutral-white';\n    }\n    if (this.background === 'light') {\n      return this.selected ? 'neutral-white' : 'neutral-black';\n    }\n  }\n\n  getColorCounter() {\n    if (this.background === 'dark' && this.disabled) {\n      return !this.selected ? 'neutral-black' : 'neutral-dark';\n    }\n\n    if (this.background === 'light' && this.disabled) {\n      return 'neutral-pale';\n    }\n    return `${this.color}-lighter`;\n  }\n\n  getColorBagdeNumber() {\n    if (this.background === 'dark' && this.disabled) {\n      return this.selected ? 'neutral-black' : 'neutral-dark';\n    }\n\n    if (this.background === 'light' && this.disabled) {\n      return 'neutral-medium';\n    }\n\n    return `${this.color}-darker`;\n  }\n\n  getIcon() {\n    const iconSize = this.size === 'large' ? 20 : 16;\n    if (this.iconPosition === 'right') {\n      return;\n    }\n\n    return <cura-icon name={this.iconName} size={iconSize} color={this.getLabelFontColor()} />;\n  }\n\n  getCounter() {\n    return (\n      <cura-badge-number color={this.getColorCounter()} class=\"badge-number\">\n        <cura-label color={this.getColorBagdeNumber()} size=\"small\">\n          {this.counter}\n        </cura-label>\n      </cura-badge-number>\n    );\n  }\n\n  getCheckIconRight() {\n    const iconSize = this.size === 'large' ? 20 : 16;\n    return <cura-icon name=\"check\" size={iconSize} color={this.getLabelFontColor()}></cura-icon>;\n  }\n\n  handleMouseEnter() {\n    if (this.disabled) return;\n    this.hovered = true;\n  }\n\n  handleMouseLeave() {\n    this.hovered = false;\n  }\n\n  handleClick(e: Event) {\n    if (this.disabled) e.preventDefault();\n    this.selected = !this.selected;\n    this.onclick.emit({ selected: this.selected });\n  }\n\n  render() {\n    const labelSize = labelSizes[this.size] || labelSizes['default'];\n    return (\n      <Host>\n        <button\n          class={this.getClasses()}\n          style={this.styles}\n          disabled={this.disabled}\n          onClick={e => this.handleClick(e)}\n          onMouseEnter={() => this.handleMouseEnter()}\n          onMouseLeave={() => this.handleMouseLeave()}\n        >\n          <div class=\"button-container\">\n            {this.iconName ? this.getIcon() : null}\n            <cura-label class=\"label\" size={labelSize} lineHeight=\"0%\" color={this.getLabelFontColor()} weight=\"regular\">\n              <slot></slot>\n            </cura-label>\n            {this.counter ? this.getCounter() : null}\n            {this.iconPosition === 'right' && this.selected ? this.getCheckIconRight() : null}\n          </div>\n        </button>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"cura-button-select.js","sourceRoot":"","sources":["../../../../src/components/buttons/cura-button-select/cura-button-select.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,EAAgB,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AACrG,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AAOxD,MAAM,OAAO,gBAAgB;;QAiB3B,UAAK,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC;wBAdsB,KAAK;;oBAEM,QAAQ;;;0BAG/B,OAAO;qBACtB,SAAS;;uBAGd,KAAK;sBACN,EAAE;;IAUpB,SAAS;QACP,MAAM,MAAM,GAAG;YACb,EAAE,IAAI,EAAE,gBAAgB,EAAE,KAAK,EAAE,IAAI,CAAC,UAAU,KAAK,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,SAAS,CAAC,CAAC,CAAC,eAAe,EAAE;YACzG,EAAE,IAAI,EAAE,8BAA8B,EAAE,KAAK,EAAE,IAAI,CAAC,UAAU,KAAK,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,QAAQ,EAAE;YAC3H,EAAE,IAAI,EAAE,0BAA0B,EAAE,KAAK,EAAE,IAAI,CAAC,UAAU,KAAK,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,QAAQ,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,OAAO,EAAE;YACvH,EAAE,IAAI,EAAE,gBAAgB,EAAE,KAAK,EAAE,IAAI,CAAC,UAAU,KAAK,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,OAAO,CAAC,CAAC,CAAC,eAAe,EAAE;YACvG,EAAE,IAAI,EAAE,8BAA8B,EAAE,KAAK,EAAE,IAAI,CAAC,UAAU,KAAK,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,UAAU,EAAE;YAC7H,EAAE,IAAI,EAAE,sBAAsB,EAAE,KAAK,EAAE,IAAI,CAAC,UAAU,KAAK,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,UAAU,EAAE;YACrH,EAAE,IAAI,EAAE,wBAAwB,EAAE,KAAK,EAAE,IAAI,CAAC,UAAU,KAAK,OAAO,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,eAAe,EAAE;YAC1G,EAAE,IAAI,EAAE,iCAAiC,EAAE,KAAK,EAAE,cAAc,EAAE;YAClE,EAAE,IAAI,EAAE,0BAA0B,EAAE,KAAK,EAAE,IAAI,CAAC,UAAU,KAAK,OAAO,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,eAAe,EAAE;YAC3G,EAAE,IAAI,EAAE,iBAAiB,EAAE,KAAK,EAAE,CAAC,IAAI,CAAC,QAAQ,IAAI,iBAAiB,EAAE;SACxE,CAAC;QAEF,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;QACvG,IAAI,CAAC,MAAM,qBAAQ,IAAI,CAAC,MAAM,CAAE,CAAC;IACnC,CAAC;IAED,UAAU;;QACR,MAAM,OAAO,GAAG,EAAE,CAAC;QACnB,OAAO,CAAC,GAAG,MAAA,IAAI,CAAC,IAAI,0CAAE,WAAW,EAAE,EAAE,CAAC,GAAG,IAAI,CAAC;QAC9C,OAAO,CAAC,QAAQ,IAAI,CAAC,YAAY,CAAC,WAAW,EAAE,EAAE,CAAC,GAAG,IAAI,CAAC;QAC1D,OAAO,CAAC,UAAU,CAAC,GAAG,IAAI,CAAC,QAAQ,CAAC;QACpC,OAAO,CAAC,UAAU,CAAC,GAAG,IAAI,CAAC,QAAQ,CAAC;QACpC,OAAO,OAAO,CAAC;IACjB,CAAC;IAED,iBAAiB;QACf,IAAI,CAAC,OAAO,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,UAAU,EAAE,CAAC;QACvD,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC;QAC1E,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,OAAO,EAAE,CAAC;QAClE,IAAI,CAAC,MAAM,CAAC,eAAe,CAAC,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,SAAS,EAAE,CAAC;QACtE,IAAI,CAAC,MAAM,CAAC,sBAAsB,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC;QAC1D,IAAI,CAAC,SAAS,EAAE,CAAC;IACnB,CAAC;IAED,iBAAiB;QACf,IAAI,IAAI,CAAC,QAAQ;YAAE,OAAO,cAAc,CAAC;QAEzC,IAAI,IAAI,CAAC,UAAU,KAAK,MAAM,EAAE,CAAC;YAC/B,OAAO,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,eAAe,CAAC;QAC3D,CAAC;QACD,IAAI,IAAI,CAAC,UAAU,KAAK,OAAO,EAAE,CAAC;YAChC,OAAO,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,eAAe,CAAC;QAC3D,CAAC;IACH,CAAC;IAED,mBAAmB;QACjB,IAAI,IAAI,CAAC,UAAU,KAAK,MAAM,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;YAChD,OAAO,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,cAAc,CAAC;QAC1D,CAAC;QAED,IAAI,IAAI,CAAC,UAAU,KAAK,OAAO,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;YACjD,OAAO,gBAAgB,CAAC;QAC1B,CAAC;QAED,OAAO,GAAG,IAAI,CAAC,KAAK,SAAS,CAAC;IAChC,CAAC;IAED,OAAO;QACL,MAAM,QAAQ,GAAG,IAAI,CAAC,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;QACjD,IAAI,IAAI,CAAC,YAAY,KAAK,OAAO,EAAE,CAAC;YAClC,OAAO;QACT,CAAC;QAED,OAAO,iBAAW,IAAI,EAAE,IAAI,CAAC,QAAQ,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,IAAI,CAAC,iBAAiB,EAAE,GAAI,CAAC;IAC7F,CAAC;IAED,UAAU;QACR,OAAO,CACL,0BACE,MAAM,EAAE,IAAI,CAAC,OAAO,EACpB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAAI,IAAI,EAC/B,KAAK,EAAC,cAAc,GACD,CACtB,CAAC;IACJ,CAAC;IAED,iBAAiB;QACf,MAAM,QAAQ,GAAG,IAAI,CAAC,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;QACjD,OAAO,iBAAW,IAAI,EAAC,OAAO,EAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,IAAI,CAAC,iBAAiB,EAAE,GAAc,CAAC;IAC/F,CAAC;IAED,gBAAgB;QACd,IAAI,IAAI,CAAC,QAAQ;YAAE,OAAO;QAC1B,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;IACtB,CAAC;IAED,gBAAgB;QACd,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;IACvB,CAAC;IAED,WAAW,CAAC,CAAQ;QAClB,IAAI,IAAI,CAAC,QAAQ;YAAE,CAAC,CAAC,cAAc,EAAE,CAAC;QACtC,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC;QAC/B,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,CAAC,CAAC;IACjD,CAAC;IAED,MAAM;QACJ,MAAM,SAAS,GAAG,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,UAAU,CAAC,SAAS,CAAC,CAAC;QACjE,OAAO,CACL,EAAC,IAAI;YACH,+DACE,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EACxB,KAAK,EAAE,IAAI,CAAC,MAAM,EAClB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,EACjC,YAAY,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,gBAAgB,EAAE,EAC3C,YAAY,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,gBAAgB,EAAE;gBAE3C,4DAAK,KAAK,EAAC,kBAAkB;oBAC1B,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,IAAI;oBACtC,mEAAY,KAAK,EAAC,OAAO,EAAC,IAAI,EAAE,SAAS,EAAE,UAAU,EAAC,IAAI,EAAC,KAAK,EAAE,IAAI,CAAC,iBAAiB,EAAE,EAAE,MAAM,EAAC,SAAS;wBAC1G,8DAAa,CACF;oBACZ,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,UAAU,EAAE,CAAC,CAAC,CAAC,IAAI;oBACvC,IAAI,CAAC,YAAY,KAAK,OAAO,IAAI,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,iBAAiB,EAAE,CAAC,CAAC,CAAC,IAAI,CAC7E,CACC,CACJ,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Element, Event, EventEmitter, Host, Prop, State, Watch, h } from '@stencil/core';\nimport { labelSizes } from '../cura-button.definitions';\n\n@Component({\n  tag: 'cura-button-select',\n  styleUrl: 'cura-button-select.scss',\n  shadow: true,\n})\nexport class CuraButtonSelect {\n  @Element() host: HTMLElement;\n\n  @Prop({ reflect: true, mutable: true }) selected = false;\n  @Prop({ reflect: true, mutable: true }) iconName: string;\n  @Prop({ reflect: true }) size: 'small' | 'medium' | 'large' = 'medium';\n  @Prop({ reflect: true, mutable: true }) counter: number | null;\n  @Prop({ reflect: true }) disabled: boolean;\n  @Prop() background: 'dark' | 'light' = 'light';\n  @Prop() color: string = 'primary';\n  @Prop({ reflect: true }) iconPosition: 'left' | 'right';\n\n  @State() hovered = false;\n  @State() styles = {};\n\n  @Event({ eventName: 'onclick' }) onclick: EventEmitter<{ selected: boolean }>;\n\n  theme = window.CuraAPI.theme;\n\n  weights;\n\n  @Watch('background')\n  @Watch('color')\n  setColors() {\n    const colors = [\n      { name: '--color-border', thema: this.background === 'light' ? `${this.color}-darker` : 'neutral-white' },\n      { name: '--color-border-hover-pressed', thema: this.background === 'light' ? `${this.color}-dark` : `${this.color}-light` },\n      { name: '--color-background-hover', thema: this.background === 'light' ? `${this.color}-light` : `${this.color}-dark` },\n      { name: '--color-select', thema: this.background === 'light' ? `${this.color}-base` : 'neutral-white' },\n      { name: '--color-select-hover-pressed', thema: this.background === 'light' ? `${this.color}-dark` : `${this.color}-lighter` },\n      { name: '--color-select-focus', thema: this.background === 'light' ? `${this.color}-base` : `${this.color}-lighter` },\n      { name: '--color-disable-select', thema: this.background === 'light' ? 'neutral-white' : 'neutral-black' },\n      { name: '--color-border-disable-unselect', thema: 'neutral-dark' },\n      { name: '--color-counter-disabled', thema: this.background === 'light' ? 'neutral-pale' : 'neutral-black' },\n      { name: '--color-counter', thema: !this.disabled && 'primary-lighter' },\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  getClasses() {\n    const classes = {};\n    classes[`${this.size?.toLowerCase()}`] = true;\n    classes[`icon-${this.iconPosition.toLowerCase()}`] = true;\n    classes['disabled'] = this.disabled;\n    classes['selected'] = this.selected;\n    return classes;\n  }\n\n  connectedCallback() {\n    this.weights = window.CuraAPI.theme.fonts.getWeights();\n    this.styles['--base-spacing'] = window.CuraAPI.theme.spacing.getSpacing();\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.setColors();\n  }\n\n  getLabelFontColor() {\n    if (this.disabled) return 'neutral-dark';\n\n    if (this.background === 'dark') {\n      return this.selected ? 'neutral-black' : 'neutral-white';\n    }\n    if (this.background === 'light') {\n      return this.selected ? 'neutral-white' : 'neutral-black';\n    }\n  }\n\n  getColorBagdeNumber() {\n    if (this.background === 'dark' && this.disabled) {\n      return this.selected ? 'neutral-black' : 'neutral-dark';\n    }\n\n    if (this.background === 'light' && this.disabled) {\n      return 'neutral-medium';\n    }\n\n    return `${this.color}-darker`;\n  }\n\n  getIcon() {\n    const iconSize = this.size === 'large' ? 20 : 16;\n    if (this.iconPosition === 'right') {\n      return;\n    }\n\n    return <cura-icon name={this.iconName} size={iconSize} color={this.getLabelFontColor()} />;\n  }\n\n  getCounter() {\n    return (\n      <cura-badge-counter\n        number={this.counter}\n        color={this.color}\n        disabled={this.disabled || null}\n        class=\"badge-number\">\n      </cura-badge-counter>\n    );\n  }\n\n  getCheckIconRight() {\n    const iconSize = this.size === 'large' ? 20 : 16;\n    return <cura-icon name=\"check\" size={iconSize} color={this.getLabelFontColor()}></cura-icon>;\n  }\n\n  handleMouseEnter() {\n    if (this.disabled) return;\n    this.hovered = true;\n  }\n\n  handleMouseLeave() {\n    this.hovered = false;\n  }\n\n  handleClick(e: Event) {\n    if (this.disabled) e.preventDefault();\n    this.selected = !this.selected;\n    this.onclick.emit({ selected: this.selected });\n  }\n\n  render() {\n    const labelSize = labelSizes[this.size] || labelSizes['default'];\n    return (\n      <Host>\n        <button\n          class={this.getClasses()}\n          style={this.styles}\n          disabled={this.disabled}\n          onClick={e => this.handleClick(e)}\n          onMouseEnter={() => this.handleMouseEnter()}\n          onMouseLeave={() => this.handleMouseLeave()}\n        >\n          <div class=\"button-container\">\n            {this.iconName ? this.getIcon() : null}\n            <cura-label class=\"label\" size={labelSize} lineHeight=\"0%\" color={this.getLabelFontColor()} weight=\"regular\">\n              <slot></slot>\n            </cura-label>\n            {this.counter ? this.getCounter() : null}\n            {this.iconPosition === 'right' && this.selected ? this.getCheckIconRight() : null}\n          </div>\n        </button>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/buttons/cura-button-transparent/cura-button-transparent.js

@@ -76,7 +76,7 @@ export class CuraButtonTransparent {
     render() {
         const symbolColor = this.getSymbolColor();
         const labelSize = labelSizes[this.size] || labelSizes["default"];
-        return (h(Host, { key: '60ab1e67798d35b9bb391ad491e4a9e6f3bc123f' }, this.href ? (h("a", { href: this.disabled ? '' : this.href, target: this.target, class: this.getClasses(), style: this.styles, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave() }, h("span", { class: "button-container" }, this.getIcon(), h("cura-label", { size: labelSize, lineHeight: '105%', color: symbolColor }, h("slot", null))), h("cura-loader-circle", { size: this.size, color: symbolColor }))) : (h("button", { class: this.getClasses(), style: this.styles, disabled: this.disabled || null, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave(), type: this.type }, h("span", { class: "button-container" }, this.getIcon(), h("cura-label", { size: labelSize, lineHeight: '105%', color: symbolColor }, h("slot", null))), h("cura-loader-circle", { size: this.size, color: symbolColor })))));
+        return (h(Host, { key: 'f93f2f1b495403127238468c57edfcb5e9f69d43' }, this.href ? (h("a", { href: this.disabled ? '' : this.href, target: this.target, class: this.getClasses(), style: this.styles, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave() }, h("span", { class: "button-container" }, this.getIcon(), h("cura-label", { size: labelSize, lineHeight: '105%', color: symbolColor }, h("slot", null))), h("cura-loader-circle", { size: this.size, color: symbolColor }))) : (h("button", { class: this.getClasses(), style: this.styles, disabled: this.disabled || null, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave(), type: this.type }, h("span", { class: "button-container" }, this.getIcon(), h("cura-label", { size: labelSize, lineHeight: '105%', color: symbolColor }, h("slot", null))), h("cura-loader-circle", { size: this.size, color: symbolColor })))));
     }
     static get is() { return "cura-button-transparent"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/cura-alert/cura-alert.js

@@ -44,7 +44,7 @@ export class CuraAlert {
         return this.icon ? this.icon : iconMapping[this.type];
     }
     render() {
-        return (h(Host, { key: 'e8998ea87d6a1342f6907ac96d2ee73c9f2ef2ad' }, h("div", { key: '917a9c712631eb1f3af2caf3d9d1bbdb7390c239', class: this.getClasses(), style: this.styles }, h("cura-icon", { key: '406ec8e8ebbdcb7b634c26085785fb5e6943c23c', name: this.getNameIcon(), class: "icon-left", size: 16, color: `${this.type}-dark` }), h("div", { key: 'de416db715df6bf4335def85044564e51af97b2d', class: "content" }, this.label ? (h("cura-label", { class: "title", size: "small", color: "neutral-darker", weight: "bold" }, this.label)) : '', h("cura-paragraph", { key: '7c759da9b461769f01facda7b52faac4fad4ff86', class: "text", color: `${this.type}-darker`, size: "xsmall", marginBlock: "0", lineHeight: "133.33%" }, h("slot", { key: 'f71f45289c632acbe25c19db15de07b09ec395fe' })), h("slot", { key: 'd46e508a7da7579fc4aed665c9606d1d7a93ceb4', name: "actions" })), this.closeable ?
+        return (h(Host, { key: 'a0b22404673b1568b9cb937150dda71ce4c99d50' }, h("div", { key: 'c30bf1b97d1e1ffaf334ef3bca6cdd1f081c679c', class: this.getClasses(), style: this.styles }, h("cura-icon", { key: '1bd88c8a19e073d7b9d967d8df38bb74063cd110', name: this.getNameIcon(), class: "icon-left", size: 16, color: `${this.type}-dark` }), h("div", { key: '0df09a27c27c7e1743f7cfb9e71c96b102ff4484', class: "content" }, this.label ? (h("cura-label", { class: "title", size: "small", color: "neutral-darker", weight: "bold" }, this.label)) : '', h("cura-paragraph", { key: '687cc7ab050299f0878c2d10ccd28e92708db85d', class: "text", color: `${this.type}-darker`, size: "xsmall", marginBlock: "0", lineHeight: "133.33%" }, h("slot", { key: 'e2d85d40e65029ea71a43aa23e7298d6dcc7efa9' })), h("slot", { key: 'a28fe90c9bfe2b9fb22f196eab7bb2e09e408dbf', name: "actions" })), this.closeable ?
             (h("cura-icon", { name: "close", size: 16, color: "error-dark", class: "icon-right", onClick: this.handleClose }))
             : '')));
     }

package/dist/collection/components/cura-avatar/cura-avatar.js

@@ -39,7 +39,7 @@ export class CuraAvatar {
         this.imageSrc = this.imageSrcDefault || `${this.assetsPath}/images/avatar/patient-default.svg`;
     }
     render() {
-        return (h(Host, { key: '01de93bd7f04abfba6c189c944f71cc75528b187', style: this.hostCSSProperties(), role: "img" }, h("div", { key: '8d34f270a8c70a46678f7ec16d7d210eecc6b43e', class: this.getClasses(), style: this.styles }, h("img", { key: 'c0997bfcdb3468d5017ca5902c76e8ec0e8ea6f9', src: this.imageSrc || this.imageSrcDefault || `${this.assetsPath}/images/avatar/patient-default.svg`, onError: () => this.onSrcError() }))));
+        return (h(Host, { key: '467e74004b400e80a2d7f8e1a40cd9d7e782ff8a', style: this.hostCSSProperties(), role: "img" }, h("div", { key: 'c38a163b8aeebd07f8aece7aea9889c336df92a5', class: this.getClasses(), style: this.styles }, h("img", { key: 'a22868d4aae4029afb9b325a5c8f5556fa8984ea', src: this.imageSrc || this.imageSrcDefault || `${this.assetsPath}/images/avatar/patient-default.svg`, onError: () => this.onSrcError() }))));
     }
     static get is() { return "cura-avatar"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/cura-calendar/cura-calendar.js

@@ -452,7 +452,7 @@ export class CuraCalendar {
     }
     render() {
         const { months } = this.fetchMonthNames();
-        return (h(Host, { key: '2167c17db3fcc20b3b9de3e8b4c071f78369d37e', style: this.getHostCSSProperties() }, h("div", { key: 'e09c187cd19bc53cd9b4c592001c8de8bc30bdd7', class: `calendar ${this.floating ? 'floating' : ''} ${this.embedded ? 'embedded' : ''}`, style: this.styles }, h("header", { key: 'c89688cd2b5e398364b3b0208eb01ae82aa7d808', class: "header" }, h("div", { key: 'a18b029a7446791c87303e959c3c7ecd3bdead47', class: `month-year ${this.type === 'dropdown' && 'dropdown'}` }, h("cura-icon", { key: '25532f4297827c6431fb9be4491894952cda1c8f', class: `icon ${this.type === 'dropdown' && 'dropdown'}`, name: "left", color: this.determinePrevButtonColor(), onClick: !this.collapsed ? () => this.updateCurrentMonth('prev') : () => this.updateCurrentWeek('prev') }), this.type === 'dropdown' ? (h("div", { class: "select" }, h("cura-select", { size: "small", class: "drop-month", mode: "transparent", value: months[getMonth(this.currentDate)], onSelected: e => this.onMonthDropdownChange(e) }, months.map((month, index) => (h("cura-select-option", { size: "xsmall", key: index, value: month }, month)))), h("cura-select", { size: "small", class: "drop-year", mode: "transparent", value: getYear(this.currentDate).toString(), onSelected: e => this.onYearDropdownChange(e) }, this.fetchYearList().map((year, index) => (h("cura-select-option", { key: index, value: year.toString() }, year.toString())))))) : (h("cura-label", { color: "neutral-black", size: "large" }, months[getMonth(this.currentDate)].slice(0, 3), ", ", getYear(this.currentDate))), h("cura-icon", { key: '52d65856b6797a8ad185fdeb0bd40abee24cc95e', class: `icon ${this.type === 'dropdown' && 'dropdown'}`, name: "right", color: "primary-base", onClick: !this.collapsed ? () => this.updateCurrentMonth('next') : () => this.updateCurrentWeek('next') }))), h("span", { key: '83afcab7b30fc4bdf3e02810dc911000c71a6d68', class: "days-of-week" }, this.fetchWeekDays().map((day, index) => (h("cura-label", { class: "day", size: "xsmall", color: "neutral-black", weight: "bold", key: index }, day === 'sab' ? 'SÁB' : day.toLocaleUpperCase())))), h("div", { key: 'f5b55f62ced251c9a77138492e77aeb6feb3e117', class: "dates" }, !this.collapsed
+        return (h(Host, { key: '859c5f15de173c774dc9f8a88792845741b665e2', style: this.getHostCSSProperties() }, h("div", { key: '5838783d7ecb5b2258ef7ef73ba32ca7ddbad470', class: `calendar ${this.floating ? 'floating' : ''} ${this.embedded ? 'embedded' : ''}`, style: this.styles }, h("header", { key: '16245dbb73d9d0a277891b3853f451b89acccc35', class: "header" }, h("div", { key: '9a22c4386363642fa7219edebd9e9a5cfb5220aa', class: `month-year ${this.type === 'dropdown' && 'dropdown'}` }, h("cura-icon", { key: '4d3ee4454dfc8bbcd8d76df101b553c86b0cea8f', class: `icon ${this.type === 'dropdown' && 'dropdown'}`, name: "left", color: this.determinePrevButtonColor(), onClick: !this.collapsed ? () => this.updateCurrentMonth('prev') : () => this.updateCurrentWeek('prev') }), this.type === 'dropdown' ? (h("div", { class: "select" }, h("cura-select", { size: "small", class: "drop-month", mode: "transparent", value: months[getMonth(this.currentDate)], onSelected: e => this.onMonthDropdownChange(e) }, months.map((month, index) => (h("cura-select-option", { size: "xsmall", key: index, value: month }, month)))), h("cura-select", { size: "small", class: "drop-year", mode: "transparent", value: getYear(this.currentDate).toString(), onSelected: e => this.onYearDropdownChange(e) }, this.fetchYearList().map((year, index) => (h("cura-select-option", { key: index, value: year.toString() }, year.toString())))))) : (h("cura-label", { color: "neutral-black", size: "large" }, months[getMonth(this.currentDate)].slice(0, 3), ", ", getYear(this.currentDate))), h("cura-icon", { key: '1f54119aafaa80816cdd016100a7987cba6656b0', class: `icon ${this.type === 'dropdown' && 'dropdown'}`, name: "right", color: "primary-base", onClick: !this.collapsed ? () => this.updateCurrentMonth('next') : () => this.updateCurrentWeek('next') }))), h("span", { key: '40be6c876675cf43b42e214e30639e48873dc4bc', class: "days-of-week" }, this.fetchWeekDays().map((day, index) => (h("cura-label", { class: "day", size: "xsmall", color: "neutral-black", weight: "bold", key: index }, day === 'sab' ? 'SÁB' : day.toLocaleUpperCase())))), h("div", { key: '72cae6b30fa5b7d5e180b796458d1844aba27ea9', class: "dates" }, !this.collapsed
             ? this.fetchDaysOfMonth().map((day, index) => (h("div", { key: index, class: this.getClasses(day), onClick: () => this.onDateClick(day) }, day ? format(day, 'd') : '')))
             : this.fetchDaysOfWeek().map((day, index) => (h("div", { key: index, class: this.getClasses(day), onClick: () => this.onDateClick(day) }, day ? format(day, 'd') : '')))), this.collapsed !== null ? (this.collapsed ? (h("div", { class: "collapsed-container" }, h("cura-button-transparent", { onClick: () => this.showNotColapsedCalendar(), size: "small", color: "primary", fontColor: "dark", iconName: "plusCircle" }, "Veja mais datas"))) : (h("div", { class: "collapsed-container" }, h("cura-button-transparent", { onClick: () => this.showColapsedCalendar(), size: "small", color: "primary", fontColor: "dark", iconName: "minusCircle" }, "Veja menos datas")))) : null)));
     }

package/dist/collection/components/cura-card/cura-card.js

@@ -34,7 +34,7 @@ export class CuraCard {
         return classes;
     }
     render() {
-        return (h(Host, { key: '72140d7ae467677c7acbdb3ff45fa84c9fe60fce', role: this.href ? 'link' : 'div' }, this.href ? (h("a", { class: this.getClasses(), target: this.target, style: this.styles, href: this.href }, h("slot", null))) : (h("div", { class: this.getClasses(), style: this.styles }, h("slot", null)))));
+        return (h(Host, { key: '9478ce754c108db722dbc5bcbb00a0884b6c6f38', role: this.href ? 'link' : 'div' }, this.href ? (h("a", { class: this.getClasses(), target: this.target, style: this.styles, href: this.href }, h("slot", null))) : (h("div", { class: this.getClasses(), style: this.styles }, h("slot", null)))));
     }
     static get is() { return "cura-card"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/cura-icon/cura-icon.definitions.js

@@ -1,4 +1,3 @@
-export const microIcons = ['arrowDown', 'arrowLeft', 'arrowRight', 'arrowUp', 'check', 'checkDouble', 'close', 'closeCircle', 'collapse', 'down', 'expand', 'linkExternal', 'link', 'left', 'minus', 'minusCircle', 'minusSquare', 'order', 'subItem', 'right', 'plus', 'plusCircle', 'plusSquare', 'up', 'filter', 'swap'];
 export const iconSizes = {
     "128": { size: 128, stroke: 5.25 },
     "72": { size: 72, stroke: 3.5 },
@@ -9,7 +8,7 @@ export const iconSizes = {
     "24": { size: 24, stroke: 2 },
     "20": { size: 20, stroke: 1.75 },
     "16": { size: 16, stroke: 1.5 },
-    "micro": { size: 12, stroke: 1.5 },
+    "micro": { size: 12, stroke: 1.25 },
     "default": { size: 24, stroke: 2 }
 };
 //# sourceMappingURL=cura-icon.definitions.js.map

package/dist/collection/components/cura-icon/cura-icon.definitions.js.map

@@ -1 +1 @@
-{"version":3,"file":"cura-icon.definitions.js","sourceRoot":"","sources":["../../../src/components/cura-icon/cura-icon.definitions.tsx"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,WAAW,EAAC,WAAW,EAAC,YAAY,EAAC,SAAS,EAAC,OAAO,EAAC,aAAa,EAAC,OAAO,EAAC,aAAa,EAAC,UAAU,EAAC,MAAM,EAAC,QAAQ,EAAC,cAAc,EAAC,MAAM,EAAC,MAAM,EAAC,OAAO,EAAC,aAAa,EAAC,aAAa,EAAC,OAAO,EAAC,SAAS,EAAC,OAAO,EAAC,MAAM,EAAC,YAAY,EAAC,YAAY,EAAC,IAAI,EAAC,QAAQ,EAAC,MAAM,CAAC,CAAC;AAEnS,MAAM,CAAC,MAAM,SAAS,GAAG;IACvB,KAAK,EAAE,EAAC,IAAI,EAAE,GAAG,EAAE,MAAM,EAAE,IAAI,EAAC;IAChC,IAAI,EAAE,EAAC,IAAI,EAAE,EAAE,EAAE,MAAM,EAAE,GAAG,EAAC;IAC7B,IAAI,EAAE,EAAC,IAAI,EAAE,EAAE,EAAE,MAAM,EAAE,IAAI,EAAC;IAC9B,IAAI,EAAE,EAAC,IAAI,EAAE,EAAE,EAAE,MAAM,EAAE,IAAI,EAAC;IAC9B,IAAI,EAAE,EAAC,IAAI,EAAE,EAAE,EAAE,MAAM,EAAE,GAAG,EAAC;IAC7B,IAAI,EAAE,EAAC,IAAI,EAAE,EAAE,EAAE,MAAM,EAAE,IAAI,EAAC;IAC9B,IAAI,EAAE,EAAC,IAAI,EAAE,EAAE,EAAE,MAAM,EAAE,CAAC,EAAC;IAC3B,IAAI,EAAE,EAAC,IAAI,EAAE,EAAE,EAAE,MAAM,EAAE,IAAI,EAAC;IAC9B,IAAI,EAAE,EAAC,IAAI,EAAE,EAAE,EAAE,MAAM,EAAE,GAAG,EAAC;IAC7B,OAAO,EAAE,EAAC,IAAI,EAAE,EAAE,EAAE,MAAM,EAAE,GAAG,EAAE;IACjC,SAAS,EAAE,EAAC,IAAI,EAAE,EAAE,EAAE,MAAM,EAAE,CAAC,EAAC;CACjC,CAAC","sourcesContent":["export const microIcons = ['arrowDown','arrowLeft','arrowRight','arrowUp','check','checkDouble','close','closeCircle','collapse','down','expand','linkExternal','link','left','minus','minusCircle','minusSquare','order','subItem','right','plus','plusCircle','plusSquare','up','filter','swap'];\n\nexport const iconSizes = {\n  \"128\": {size: 128, stroke: 5.25},\n  \"72\": {size: 72, stroke: 3.5},\n  \"64\": {size: 64, stroke: 3.25},\n  \"48\": {size: 48, stroke: 2.75},\n  \"40\": {size: 40, stroke: 2.5},\n  \"32\": {size: 32, stroke: 2.25},\n  \"24\": {size: 24, stroke: 2},\n  \"20\": {size: 20, stroke: 1.75},\n  \"16\": {size: 16, stroke: 1.5},\n  \"micro\": {size: 12, stroke: 1.5 },\n  \"default\": {size: 24, stroke: 2}\n};\n"]}
+{"version":3,"file":"cura-icon.definitions.js","sourceRoot":"","sources":["../../../src/components/cura-icon/cura-icon.definitions.tsx"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,SAAS,GAAG;IACvB,KAAK,EAAE,EAAC,IAAI,EAAE,GAAG,EAAE,MAAM,EAAE,IAAI,EAAC;IAChC,IAAI,EAAE,EAAC,IAAI,EAAE,EAAE,EAAE,MAAM,EAAE,GAAG,EAAC;IAC7B,IAAI,EAAE,EAAC,IAAI,EAAE,EAAE,EAAE,MAAM,EAAE,IAAI,EAAC;IAC9B,IAAI,EAAE,EAAC,IAAI,EAAE,EAAE,EAAE,MAAM,EAAE,IAAI,EAAC;IAC9B,IAAI,EAAE,EAAC,IAAI,EAAE,EAAE,EAAE,MAAM,EAAE,GAAG,EAAC;IAC7B,IAAI,EAAE,EAAC,IAAI,EAAE,EAAE,EAAE,MAAM,EAAE,IAAI,EAAC;IAC9B,IAAI,EAAE,EAAC,IAAI,EAAE,EAAE,EAAE,MAAM,EAAE,CAAC,EAAC;IAC3B,IAAI,EAAE,EAAC,IAAI,EAAE,EAAE,EAAE,MAAM,EAAE,IAAI,EAAC;IAC9B,IAAI,EAAE,EAAC,IAAI,EAAE,EAAE,EAAE,MAAM,EAAE,GAAG,EAAC;IAC7B,OAAO,EAAE,EAAC,IAAI,EAAE,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE;IAClC,SAAS,EAAE,EAAC,IAAI,EAAE,EAAE,EAAE,MAAM,EAAE,CAAC,EAAC;CACjC,CAAC","sourcesContent":["export const iconSizes = {\n  \"128\": {size: 128, stroke: 5.25},\n  \"72\": {size: 72, stroke: 3.5},\n  \"64\": {size: 64, stroke: 3.25},\n  \"48\": {size: 48, stroke: 2.75},\n  \"40\": {size: 40, stroke: 2.5},\n  \"32\": {size: 32, stroke: 2.25},\n  \"24\": {size: 24, stroke: 2},\n  \"20\": {size: 20, stroke: 1.75},\n  \"16\": {size: 16, stroke: 1.5},\n  \"micro\": {size: 12, stroke: 1.25 },\n  \"default\": {size: 24, stroke: 2}\n};\n"]}