npm - @rededor/cura - Versions diffs - 1.7.0 → 1.8.0 - Mend

@rededor/cura 1.7.0 → 1.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (569) hide show

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

@@ -2,19 +2,56 @@ import { Host, h } from "@stencil/core";
 import { labelSizes } from "../cura-button.definitions";
 export class CuraButtonTransparent {
     constructor() {
+        /**
+         * 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: accent.
+         */
         this.color = 'primary';
+        /**
+         * Set the font color to dark or light.
+         * Default: dark.
+         */
         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.hovered = false;
         this.styles = {};
@@ -95,6 +132,7 @@ export class CuraButtonTransparent {
         return {
             "type": {
                 "type": "string",
+                "attribute": "type",
                 "mutable": false,
                 "complexType": {
                     "original": "'button' | 'reset' | 'submit'",
@@ -107,12 +145,14 @@ export class CuraButtonTransparent {
                     "tags": [],
                     "text": "Button type: button (default) | submit | reset"
                 },
-                "attribute": "type",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
                 "defaultValue": "'button'"
             },
             "size": {
                 "type": "string",
+                "attribute": "size",
                 "mutable": false,
                 "complexType": {
                     "original": "'small' | 'medium' | 'large'",
@@ -125,12 +165,14 @@ export class CuraButtonTransparent {
                     "tags": [],
                     "text": "Button size: small | medium | large (default)"
                 },
-                "attribute": "size",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
                 "defaultValue": "'large'"
             },
             "disabled": {
                 "type": "boolean",
+                "attribute": "disabled",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -143,12 +185,14 @@ export class CuraButtonTransparent {
                     "tags": [],
                     "text": "Disabled state. Boolean."
                 },
-                "attribute": "disabled",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
                 "defaultValue": "false"
             },
             "isLoading": {
                 "type": "boolean",
+                "attribute": "is-loading",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -161,12 +205,14 @@ export class CuraButtonTransparent {
                     "tags": [],
                     "text": "Loading state. Boolean."
                 },
-                "attribute": "is-loading",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
                 "defaultValue": "false"
             },
             "iconName": {
                 "type": "string",
+                "attribute": "icon-name",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -179,11 +225,13 @@ export class CuraButtonTransparent {
                     "tags": [],
                     "text": "Name of the icon to be used from iconset."
                 },
-                "attribute": "icon-name",
+                "getter": false,
+                "setter": false,
                 "reflect": true
             },
             "iconset": {
                 "type": "string",
+                "attribute": "iconset",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -196,12 +244,14 @@ export class CuraButtonTransparent {
                     "tags": [],
                     "text": "Custom iconset if needed."
                 },
-                "attribute": "iconset",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
                 "defaultValue": "'default'"
             },
             "iconPosition": {
                 "type": "string",
+                "attribute": "icon-position",
                 "mutable": false,
                 "complexType": {
                     "original": "'left' | 'right'",
@@ -214,12 +264,14 @@ export class CuraButtonTransparent {
                     "tags": [],
                     "text": "Icon position: left (default) | right."
                 },
-                "attribute": "icon-position",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
                 "defaultValue": "'left'"
             },
             "iconOnly": {
                 "type": "boolean",
+                "attribute": "icon-only",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -232,12 +284,14 @@ export class CuraButtonTransparent {
                     "tags": [],
                     "text": "Set button to FAB/icon only."
                 },
-                "attribute": "icon-only",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
                 "defaultValue": "false"
             },
             "href": {
                 "type": "string",
+                "attribute": "href",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -250,11 +304,13 @@ export class CuraButtonTransparent {
                     "tags": [],
                     "text": "Property href switch button to link."
                 },
-                "attribute": "href",
+                "getter": false,
+                "setter": false,
                 "reflect": true
             },
             "target": {
                 "type": "string",
+                "attribute": "target",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -267,12 +323,14 @@ export class CuraButtonTransparent {
                     "tags": [],
                     "text": "Set target if link."
                 },
-                "attribute": "target",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
                 "defaultValue": "\"_self\""
             },
             "color": {
                 "type": "string",
+                "attribute": "color",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -285,12 +343,14 @@ export class CuraButtonTransparent {
                     "tags": [],
                     "text": "Color base from color scheme. Default: accent."
                 },
-                "attribute": "color",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
                 "defaultValue": "'primary'"
             },
             "fontColor": {
                 "type": "string",
+                "attribute": "font-color",
                 "mutable": false,
                 "complexType": {
                     "original": "'dark' | 'light'",
@@ -303,12 +363,14 @@ export class CuraButtonTransparent {
                     "tags": [],
                     "text": "Set the font color to dark or light.\nDefault: dark."
                 },
-                "attribute": "font-color",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
                 "defaultValue": "'dark'"
             },
             "textAlign": {
                 "type": "string",
+                "attribute": "text-align",
                 "mutable": false,
                 "complexType": {
                     "original": "'left' | 'center' | 'right'",
@@ -321,12 +383,14 @@ export class CuraButtonTransparent {
                     "tags": [],
                     "text": "Set text aligment for the button label.\nVales: left (default) | center | right."
                 },
-                "attribute": "text-align",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
                 "defaultValue": "'left'"
             },
             "justify": {
                 "type": "boolean",
+                "attribute": "justify",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -339,7 +403,8 @@ export class CuraButtonTransparent {
                     "tags": [],
                     "text": "Justify icons and label inside the button.\nVales: false (default) | true."
                 },
-                "attribute": "justify",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
                 "defaultValue": "false"
             }

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

	@@ -1 +1 @@
1	- {"version":3,"file":"cura-button-transparent.js","sourceRoot":"","sources":["../../../../src/components/buttons/cura-button-transparent/cura-button-transparent.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, State, Watch, AttachInternals } from '@stencil/core';\nimport { labelSizes } from '../cura-button.definitions';\n\n@Component({\n tag: 'cura-button-transparent',\n styleUrl: 'cura-button-transparent.scss',\n shadow: true,\n formAssociated: true\n})\nexport class CuraButtonTransparent {\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 /\n Color base from color scheme. Default: accent.\n /\n @Prop({ reflect: true }) color = 'primary';\n\n /\n Set the font color to dark or light.\n * Default: dark.\n /\n @Prop({ reflect: true }) 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() hovered = false;\n\n @State() styles = {};\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 }\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\n getIcon() {\n if (!this.iconName) return null;\n const iconSize = this.size === 'large' ? 20 : 16;\n return <cura-icon name={this.iconName} iconset={this.iconset} size={iconSize} color={this.getSymbolColor()}></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 @Watch('fontColor')\n @Watch('color')\n getSymbolColor() {\n if (this.disabled) return 'neutral-dark';\n if (this.hovered && !this.isLoading) return this.fontColor === 'light' ? `${this.color}-light` : `${this.color}-darker`;\n return this.fontColor === 'light' ? 'neutral-white' : `${this.color}-dark`;\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"]}
1	+ {"version":3,"file":"cura-button-transparent.js","sourceRoot":"","sources":["../../../../src/components/buttons/cura-button-transparent/cura-button-transparent.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AACxF,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AAQxD,MAAM,OAAO,qBAAqB;IANlC;QAUE;;WAEG;QACsB,SAAI,GAAkC,QAAQ,CAAC;QAExE;;WAEG;QACsB,SAAI,GAAiC,OAAO,CAAC;QAEtE;;WAEG;QACsB,aAAQ,GAAG,KAAK,CAAC;QAC1C;;WAEG;QACsB,cAAS,GAAG,KAAK,CAAC;QAM3C;;WAEG;QACsB,YAAO,GAAG,SAAS,CAAC;QAC7C;;WAEG;QACsB,iBAAY,GAAqB,MAAM,CAAC;QACjE;;WAEG;QACsB,aAAQ,GAAG,KAAK,CAAC;QAM1C;;WAEG;QACsB,WAAM,GAAG,OAAO,CAAC;QAE1C;;WAEG;QACsB,UAAK,GAAG,SAAS,CAAC;QAE3C;;;WAGG;QACsB,cAAS,GAAqB,MAAM,CAAC;QAC9D;;;WAGG;QACsB,cAAS,GAAgC,MAAM,CAAC;QAEzE;;;WAGG;QACsB,YAAO,GAAG,KAAK,CAAC;QAEhC,YAAO,GAAG,KAAK,CAAC;QAEhB,WAAM,GAAG,EAAE,CAAC;KAqGtB;IAjGC,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,iBAAiB,CAAC,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,eAAe,CAAC,CAAC;QACvF,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,cAAc,CAAC,CAAC;QACrF,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,cAAc,CAAC,CAAC;QACrF,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,MAAM,CAAC,cAAc,CAAC,GAAG,IAAI,CAAC,SAAS,CAAC;IAC/C,CAAC;IAED,UAAU;QACR,MAAM,OAAO,GAAG,EAAE,CAAC;QACnB,OAAO,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,EAAE,CAAC,GAAG,IAAI,CAAC;QAC7C,OAAO,CAAC,QAAQ,IAAI,CAAC,YAAY,CAAC,WAAW,EAAE,EAAE,CAAC,GAAG,IAAI,CAAC;QAC1D,OAAO,CAAC,WAAW,CAAC,GAAG,IAAI,CAAC,QAAQ,CAAC;QACrC,OAAO,CAAC,UAAU,CAAC,GAAG,IAAI,CAAC,QAAQ,CAAC;QACpC,OAAO,CAAC,WAAW,CAAC,GAAG,IAAI,CAAC,SAAS,CAAC;QACtC,OAAO,CAAC,SAAS,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC;QAClC,OAAO,OAAO,CAAC;IACjB,CAAC;IAGD,OAAO;QACL,IAAI,CAAC,IAAI,CAAC,QAAQ;YAAE,OAAO,IAAI,CAAC;QAChC,MAAM,QAAQ,GAAG,IAAI,CAAC,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;QACjD,OAAO,iBAAW,IAAI,EAAE,IAAI,CAAC,QAAQ,EAAE,OAAO,EAAE,IAAI,CAAC,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,IAAI,CAAC,cAAc,EAAE,GAAc,CAAC;IAC3H,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;IAID,cAAc;QACZ,IAAI,IAAI,CAAC,QAAQ;YAAE,OAAO,cAAc,CAAC;QACzC,IAAI,IAAI,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,SAAS;YAAE,OAAO,IAAI,CAAC,SAAS,KAAK,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,QAAQ,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,SAAS,CAAC;QACxH,OAAO,IAAI,CAAC,SAAS,KAAK,OAAO,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,OAAO,CAAC;IAC7E,CAAC;IAED,WAAW,CAAC,CAAQ;QAClB,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC;YACpC,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,OAAO;QACT,CAAC;QACD,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;YACf,IAAI,IAAI,CAAC,IAAI,KAAK,QAAQ,IAAI,IAAI,CAAC,SAAS,CAAC,IAAI;gBAAE,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC;YAChF,IAAI,IAAI,CAAC,IAAI,KAAK,OAAO,IAAI,IAAI,CAAC,SAAS,CAAC,IAAI;gBAAE,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;QAChF,CAAC;IACH,CAAC;IAED,MAAM;QACJ,MAAM,WAAW,GAAG,IAAI,CAAC,cAAc,EAAE,CAAC;QAC1C,MAAM,SAAS,GAAG,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,UAAU,CAAC,SAAS,CAAC,CAAC;QACjE,OAAO,CACL,EAAC,IAAI,qDAAC,IAAI,EAAG,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,mBAC1B,IAAI,CAAC,QAAQ,IAC3B,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CACX,SAAG,IAAI,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,EACrC,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EACxB,KAAK,EAAE,IAAI,CAAC,MAAM,EAClB,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,EACnC,YAAY,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,gBAAgB,EAAE,EAC3C,YAAY,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,gBAAgB,EAAE;YAC3C,YAAM,KAAK,EAAC,kBAAkB;gBAC3B,IAAI,CAAC,OAAO,EAAE;gBACf,kBAAY,IAAI,EAAE,SAAS,EAAE,UAAU,EAAC,QAAQ,EAAC,KAAK,EAAE,WAAW;oBAAE,eAAa,CAAa,CAC1F;YACP,0BAAoB,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,KAAK,EAAE,WAAW,GAAuB,CAC5E,CACL,CAAC,CAAC,CAAC,CACF,cAAQ,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EAC9B,KAAK,EAAE,IAAI,CAAC,MAAM,EAClB,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAAI,IAAI,EAC/B,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,EACnC,YAAY,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,gBAAgB,EAAE,EAC3C,YAAY,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,gBAAgB,EAAE,EAC3C,IAAI,EAAE,IAAI,CAAC,IAAI;YACf,YAAM,KAAK,EAAC,kBAAkB;gBAC3B,IAAI,CAAC,OAAO,EAAE;gBACf,kBAAY,IAAI,EAAE,SAAS,EAAE,UAAU,EAAC,QAAQ,EAAC,KAAK,EAAE,WAAW;oBAAE,eAAa,CAAa,CAC1F;YACP,0BAAoB,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,KAAK,EAAE,WAAW,GAAuB,CACvE,CACV,CACI,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAEF","sourcesContent":["import { Component, Host, h, Prop, State, Watch, AttachInternals } from '@stencil/core';\nimport { labelSizes } from '../cura-button.definitions';\n\n@Component({\n tag: 'cura-button-transparent',\n styleUrl: 'cura-button-transparent.scss',\n shadow: true,\n formAssociated: true\n})\nexport class CuraButtonTransparent {\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 /\n Color base from color scheme. Default: accent.\n /\n @Prop({ reflect: true }) color = 'primary';\n\n /\n Set the font color to dark or light.\n * Default: dark.\n /\n @Prop({ reflect: true }) 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() hovered = false;\n\n @State() styles = {};\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 }\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\n getIcon() {\n if (!this.iconName) return null;\n const iconSize = this.size === 'large' ? 20 : 16;\n return <cura-icon name={this.iconName} iconset={this.iconset} size={iconSize} color={this.getSymbolColor()}></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 @Watch('fontColor')\n @Watch('color')\n getSymbolColor() {\n if (this.disabled) return 'neutral-dark';\n if (this.hovered && !this.isLoading) return this.fontColor === 'light' ? `${this.color}-light` : `${this.color}-darker`;\n return this.fontColor === 'light' ? 'neutral-white' : `${this.color}-dark`;\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"]}

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

@@ -1,16 +1,14 @@
 import { Host, h } from "@stencil/core";
 export class CuraAlert {
     constructor() {
-        this.handleClose = () => {
-            this.close.emit();
-            this.host.remove();
-        };
         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 = [
@@ -64,6 +62,7 @@ export class CuraAlert {
         return {
             "type": {
                 "type": "string",
+                "attribute": "type",
                 "mutable": false,
                 "complexType": {
                     "original": "'info' | 'success' | 'warning' | 'error'",
@@ -76,12 +75,14 @@ export class CuraAlert {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "type",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "'info'"
             },
             "floating": {
                 "type": "boolean",
+                "attribute": "floating",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -94,12 +95,14 @@ export class CuraAlert {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "floating",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
                 "defaultValue": "false"
             },
             "label": {
                 "type": "string",
+                "attribute": "label",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -112,11 +115,13 @@ export class CuraAlert {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "label",
+                "getter": false,
+                "setter": false,
                 "reflect": true
             },
             "closeable": {
                 "type": "boolean",
+                "attribute": "closeable",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -129,12 +134,14 @@ export class CuraAlert {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "closeable",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
                 "defaultValue": "true"
             },
             "icon": {
                 "type": "string",
+                "attribute": "icon",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -147,7 +154,8 @@ export class CuraAlert {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "icon",
+                "getter": false,
+                "setter": false,
                 "reflect": true
             }
         };

package/dist/collection/components/cura-alert/cura-alert.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"cura-alert.js","sourceRoot":"","sources":["../../../src/components/cura-alert/cura-alert.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAgB,MAAM,eAAe,CAAC;AAMrG,MAAM,OAAO,SAAS~~;;QAkDpB~~,gBAAW,GAAG,GAAG,EAAE;YACjB,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC;YAClB,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC;QACrB,CAAC,CAAC;~~oBAlDuD,MAAM~~;~~wBAC3B~~,~~KAAK;;yBAEJ,IAAI;;sBAGvB,EAAE;;IAKpB,~~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~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~CACF","sourcesContent":["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"]}
1	+ {"version":3,"file":"cura-alert.js","sourceRoot":"","sources":["../../../src/components/cura-alert/cura-alert.tsx"],"names":[],"mappings":"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","sourcesContent":["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"]}

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

@@ -2,15 +2,32 @@ import { Host, h } from "@stencil/core";
 import { avatarSizes } from "./cura-avatar.definitions";
 export class CuraAvatar {
     constructor() {
+        /**
+         * Size of the avatar. Values: 80, 40, 32, 24.
+         * @default 80
+         */
         this.size = '80';
+        /**
+         * Background color of the avatar.
+         * Accepts any color from the theme.
+         * @default neutral-purewhite
+         */
         this.backgroundColor = 'neutral-purewhite';
-        this.borderColor = undefined;
+        /**
+         * Border radius of the avatar.
+         * @default 50%
+         */
         this.borderRadius = '50%';
+        /**
+         * Show border of the avatar.
+         * @default false
+         */
         this.border = false;
+        /**
+         * Type of the avatar.
+         * @default default
+         */
         this.type = 'default';
-        this.imageSrc = undefined;
-        this.imageSrcDefault = undefined;
-        this.floating = undefined;
         this.styles = {};
     }
     sizeHandler(size) {
@@ -57,6 +74,7 @@ export class CuraAvatar {
         return {
             "size": {
                 "type": "string",
+                "attribute": "size",
                 "mutable": false,
                 "complexType": {
                     "original": "'80' | '40' | '32' | '24'",
@@ -72,12 +90,14 @@ export class CuraAvatar {
                         }],
                     "text": "Size of the avatar. Values: 80, 40, 32, 24."
                 },
-                "attribute": "size",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "'80'"
             },
             "backgroundColor": {
                 "type": "string",
+                "attribute": "background-color",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -93,12 +113,14 @@ export class CuraAvatar {
                         }],
                     "text": "Background color of the avatar.\nAccepts any color from the theme."
                 },
-                "attribute": "background-color",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
                 "defaultValue": "'neutral-purewhite'"
             },
             "borderColor": {
                 "type": "string",
+                "attribute": "border-color",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -111,11 +133,13 @@ export class CuraAvatar {
                     "tags": [],
                     "text": "Border color of the avatar.\nAccepts any color from the theme."
                 },
-                "attribute": "border-color",
+                "getter": false,
+                "setter": false,
                 "reflect": true
             },
             "borderRadius": {
                 "type": "string",
+                "attribute": "border-radius",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -131,12 +155,14 @@ export class CuraAvatar {
                         }],
                     "text": "Border radius of the avatar."
                 },
-                "attribute": "border-radius",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
                 "defaultValue": "'50%'"
             },
             "border": {
                 "type": "boolean",
+                "attribute": "border",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -152,12 +178,14 @@ export class CuraAvatar {
                         }],
                     "text": "Show border of the avatar."
                 },
-                "attribute": "border",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
                 "defaultValue": "false"
             },
             "type": {
                 "type": "string",
+                "attribute": "type",
                 "mutable": false,
                 "complexType": {
                     "original": "'default' | 'branding'",
@@ -173,12 +201,14 @@ export class CuraAvatar {
                         }],
                     "text": "Type of the avatar."
                 },
-                "attribute": "type",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
                 "defaultValue": "'default'"
             },
             "imageSrc": {
                 "type": "string",
+                "attribute": "image-src",
                 "mutable": true,
                 "complexType": {
                     "original": "string",
@@ -191,11 +221,13 @@ export class CuraAvatar {
                     "tags": [],
                     "text": "Image source of the avatar.\nAccepts any image source. If not provided, the default image will be used."
                 },
-                "attribute": "image-src",
+                "getter": false,
+                "setter": false,
                 "reflect": true
             },
             "imageSrcDefault": {
                 "type": "string",
+                "attribute": "image-src-default",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -208,11 +240,13 @@ export class CuraAvatar {
                     "tags": [],
                     "text": "Default image source of the avatar.\nSome predefined images are available in the design system assets folder."
                 },
-                "attribute": "image-src-default",
+                "getter": false,
+                "setter": false,
                 "reflect": true
             },
             "floating": {
                 "type": "boolean",
+                "attribute": "floating",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -228,7 +262,8 @@ export class CuraAvatar {
                         }],
                     "text": "Floating state of the avatar."
                 },
-                "attribute": "floating",
+                "getter": false,
+                "setter": false,
                 "reflect": true
             }
         };