npm - @rededor/cura - Versions diffs - 1.5.1 → 1.6.0-alpha.1 - Mend

@rededor/cura 1.5.1 → 1.6.0-alpha.1

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 (404) hide show

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

@@ -2,9 +2,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-e6d728ec.js');
+const index = require('./index-12d54921.js');
-const curaAlertCss = ":host{display:block;box-sizing:border-box}:host .conteiner{display:flex;box-sizing:border-box;padding:calc(var(--base-spacing) * 3px);gap:calc(var(--base-spacing) * 3px);flex-shrink:0;border:1px solid var(--color-base);border-radius:4px;background-color:var(--color-lighter)}:host .conteiner.floating{box-shadow:0px 4px 8px 0px rgba(38, 38, 38, 0.16)}:host .content{flex:1;flex-direction:column;display:flex;gap:calc(var(--base-spacing) * 1px)}:host .icon-right{cursor:pointer}";
+const curaAlertCss = ":host{display:block;box-sizing:border-box}:host .conteiner{display:flex;box-sizing:border-box;padding:calc(var(--cura-spacing-base) * 3px);gap:calc(var(--cura-spacing-base) * 3px);flex-shrink:0;border:1px solid var(--color-base);border-radius:4px;background-color:var(--color-lighter)}:host .conteiner.floating{box-shadow:0px 4px 8px 0px rgba(38, 38, 38, 0.16)}:host .content{flex:1;flex-direction:column;display:flex;gap:calc(var(--cura-spacing-base) * 1px)}:host .icon-right{cursor:pointer}";
 const CuraAlertStyle0 = curaAlertCss;
 const CuraAlert = class {
@@ -54,7 +54,7 @@ const CuraAlert = class {
         return this.icon ? this.icon : iconMapping[this.type];
     }
     render() {
-        return (index.h(index.Host, { key: 'a0b22404673b1568b9cb937150dda71ce4c99d50' }, index.h("div", { key: 'c30bf1b97d1e1ffaf334ef3bca6cdd1f081c679c', class: this.getClasses(), style: this.styles }, index.h("cura-icon", { key: '1bd88c8a19e073d7b9d967d8df38bb74063cd110', name: this.getNameIcon(), class: "icon-left", size: 16, color: `${this.type}-dark` }), index.h("div", { key: '0df09a27c27c7e1743f7cfb9e71c96b102ff4484', class: "content" }, this.label ? (index.h("cura-label", { class: "title", size: "small", color: "neutral-darker", weight: "bold" }, this.label)) : '', index.h("cura-paragraph", { key: '687cc7ab050299f0878c2d10ccd28e92708db85d', class: "text", color: `${this.type}-darker`, size: "xsmall", marginBlock: "0", lineHeight: "133.33%" }, index.h("slot", { key: 'e2d85d40e65029ea71a43aa23e7298d6dcc7efa9' })), index.h("slot", { key: 'a28fe90c9bfe2b9fb22f196eab7bb2e09e408dbf', name: "actions" })), this.closeable ?
+        return (index.h(index.Host, { key: 'a0b22404673b1568b9cb937150dda71ce4c99d50' }, index.h("div", { key: 'c30bf1b97d1e1ffaf334ef3bca6cdd1f081c679c', class: this.getClasses(), style: this.styles }, index.h("cura-icon", { key: '1bd88c8a19e073d7b9d967d8df38bb74063cd110', name: this.getNameIcon(), class: "icon-left", size: 16, color: `${this.type}-dark` }), index.h("div", { key: '0df09a27c27c7e1743f7cfb9e71c96b102ff4484', class: "content" }, this.label ? (index.h("cura-heading", { class: "title", size: "xsmall", color: "neutral-black", weight: "bold", "margin-block": "1px 0" }, this.label)) : '', index.h("cura-paragraph", { key: '00a039ac0b80bac62eb261c5cf8401b605e867a4', class: "text", color: `${this.type}-darker`, size: "xsmall", marginBlock: "0", lineHeight: "133.33%" }, index.h("slot", { key: 'ba6989082e1f15337d5bb390b799b3dc3fda12eb' })), index.h("slot", { key: 'def5ab8aeca163432a52c9eb810f69c95d012313', name: "actions" })), this.closeable ?
             (index.h("cura-icon", { name: "close", size: 16, color: "error-dark", class: "icon-right", onClick: this.handleClose }))
             : '')));
     }

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

	@@ -1 +1 @@
1	- {"file":"cura-alert.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,YAAY,GAAG~~,+dAA+d~~,CAAC;~~AACrf~~,wBAAe,YAAY;;MCKd,SAAS;;;;QAkDpB,gBAAW,GAAG;YACZ,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC;YAClB,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC;SACpB,CAAC;oBAlDuD,MAAM;wBAC3B,KAAK;;yBAEJ,IAAI;;sBAGvB,EAAE;;IAKpB,SAAS;QACP,MAAM,MAAM,GAAG;YACb,EAAE,IAAI,EAAE,iBAAiB,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC,IAAI,UAAU,EAAE;YAC1D,EAAE,IAAI,EAAE,iBAAiB,EAAE,KAAK,EAAE,eAAe,EAAE;YACnD,EAAE,IAAI,EAAE,eAAe,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC,IAAI,QAAQ,EAAE;YACtD,EAAE,IAAI,EAAE,cAAc,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC,IAAI,OAAO,EAAE;SACrD,CAAC;QAEF,MAAM,CAAC,OAAO,CAAC,KAAK;YAClB,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;SAC7E,CAAC,CAAC;QACH,IAAI,CAAC,MAAM,qBAAO,IAAI,CAAC,MAAM,CAAC,CAAC;KAChC;IAED,iBAAiB;QACf,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC;QAC1E,IAAI,CAAC,SAAS,EAAE,CAAC;KAClB;IAED,UAAU;QACR,MAAM,OAAO,GAAG,EAAE,CAAC;QACnB,OAAO,CAAC,WAAW,CAAC,GAAG,IAAI,CAAC;QAC5B,OAAO,CAAC,UAAU,CAAC,GAAG,IAAI,CAAC,QAAQ,CAAC;QACpC,OAAO,OAAO,CAAC;KAChB;IAED,WAAW;QACT,MAAM,WAAW,GAAG;YAClB,IAAI,EAAE,YAAY;YAClB,OAAO,EAAE,aAAa;YACtB,OAAO,EAAE,aAAa;YACtB,KAAK,EAAE,eAAe;SACvB,CAAC;QACF,OAAO,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,GAAG,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;KACvD;IAOD,MAAM;QACJ,QACEA,QAACC,UAAI,uDACHD,kEAAK,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,MAAM,IAC/CA,wEAAW,IAAI,EAAE,IAAI,CAAC,WAAW,EAAE,EAAE,KAAK,EAAC,WAAW,EAAC,IAAI,EAAE,EAAE,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC,IAAI,OAAO,GAAc,EACzGA,kEAAK,KAAK,EAAC,SAAS,IAChB,IAAI,CAAC,KAAK,IACZA,~~wBAAY~~,KAAK,EAAC,OAAO,EAAC,IAAI,EAAC,~~OAAO~~,EAAC,KAAK,EAAC,~~gBAAgB~~,EAAC,MAAM,EAAC,MAAM,~~IACxE~~,IAAI,CAAC,KAAK,~~CACA~~,~~IACT~~,EAAE,EACNA,6EAAgB,KAAK,EAAC,MAAM,EAAC,KAAK,EAAE,GAAG,IAAI,CAAC,IAAI,SAAS,EAAE,IAAI,EAAC,QAAQ,EAAC,WAAW,EAAC,GAAG,EAAC,UAAU,EAAC,SAAS,IAC3GA,oEAAa,CACE,EACjBA,mEAAM,IAAI,EAAC,SAAS,GAAQ,CACxB,EACJ,IAAI,CAAC,SAAS;aACfA,uBAAW,IAAI,EAAC,OAAO,EAAC,IAAI,EAAE,EAAE,EAAE,KAAK,EAAC,YAAY,EAAC,KAAK,EAAC,YAAY,EAAC,OAAO,EAAE,IAAI,CAAC,WAAW,GAAc;cAC9G,EAAE,CACA,CACD,EACP;KACH;;;;;;;;;;","names":["h","Host"],"sources":["src/components/cura-alert/cura-alert.scss?tag=cura-alert&encapsulation=shadow","src/components/cura-alert/cura-alert.tsx"],"sourcesContent":["@import \"../../scss/mixins/spacing.scss\";\n\n:host {\n display: block;\n box-sizing: border-box;\n\n .conteiner {\n display: flex;\n box-sizing: border-box;\n padding: #{$spacing-xxxs};\n gap: #{$spacing-xxxs};\n flex-shrink: 0;\n border: 1px solid var(--color-base);\n border-radius: 4px;\n background-color: var(--color-lighter);\n &.floating {\n box-shadow: 0px 4px 8px 0px rgba(38, 38, 38, 0.16);\n }\n }\n\n .content {\n flex: 1;\n flex-direction: column;\n display: flex;\n gap: #{$spacing-tiny};\n }\n\n .icon-right {\n cursor: pointer;\n }\n\n}\n","import { Component, Element, Prop, Host, h, State, Watch, Event, EventEmitter } from '@stencil/core';\n@Component({\n tag: 'cura-alert',\n styleUrl: 'cura-alert.scss',\n shadow: true,\n})\nexport class CuraAlert {\n @Element() host: HTMLElement;\n\n @Prop() type: 'info' \| 'success' \| 'warning' \| 'error' = 'info';\n @Prop({ reflect: true }) floating = false;\n @Prop({ reflect: true }) label: string;\n @Prop({ reflect: true }) closeable = true;\n @Prop({ reflect: true }) icon: string;\n\n @State() styles = {};\n\n @Event({ eventName: 'close' }) close: EventEmitter<void>;\n\n @Watch('type')\n setColors() {\n const colors = [\n { name: '--color-lighter', theme: `${this.type}-lighter` },\n { name: '--neutral-black', theme: 'neutral-black' },\n { name: '--color-light', theme: `${this.type}-light` },\n { name: '--color-base', theme: `${this.type}-base` },\n ];\n\n colors.forEach(color => {\n this.styles[color.name] = window.CuraAPI.theme.colors.getColor(color.theme);\n });\n this.styles = {...this.styles};\n }\n\n connectedCallback() {\n this.styles['--base-spacing'] = window.CuraAPI.theme.spacing.getSpacing();\n this.setColors();\n }\n\n getClasses() {\n const classes = {};\n classes['conteiner'] = true;\n classes['floating'] = this.floating;\n return classes;\n }\n\n getNameIcon() {\n const iconMapping = {\n info: 'infoCircle',\n success: 'checkCircle',\n warning: 'alertCircle',\n error: 'alertTriangle',\n };\n return this.icon ? this.icon : iconMapping[this.type];\n }\n\n handleClose = () => {\n this.close.emit();\n this.host.remove();\n };\n\n render() {\n return (\n <Host>\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-~~label~~ class=\"title\" size=\"~~small~~\" color=\"neutral-~~darker~~\" weight=\"bold\">\n {this.label}\n </cura-~~label~~>\n ) : ''}\n <cura-paragraph class=\"text\" color={`${this.type}-darker`} size=\"xsmall\" marginBlock=\"0\" lineHeight=\"133.33%\">\n <slot></slot>\n </cura-paragraph>\n <slot name=\"actions\"></slot>\n </div>\n { this.closeable ?\n (<cura-icon name=\"close\" size={16} color=\"error-dark\" class=\"icon-right\" onClick={this.handleClose}></cura-icon>)\n : '' }\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"cura-alert.entry.cjs.js","mappings":"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","names":["h","Host"],"sources":["src/components/cura-alert/cura-alert.scss?tag=cura-alert&encapsulation=shadow","src/components/cura-alert/cura-alert.tsx"],"sourcesContent":["@import \"../../scss/mixins/spacing.scss\";\n\n:host {\n display: block;\n box-sizing: border-box;\n\n .conteiner {\n display: flex;\n box-sizing: border-box;\n padding: #{$spacing-xxxs};\n gap: #{$spacing-xxxs};\n flex-shrink: 0;\n border: 1px solid var(--color-base);\n border-radius: 4px;\n background-color: var(--color-lighter);\n &.floating {\n box-shadow: 0px 4px 8px 0px rgba(38, 38, 38, 0.16);\n }\n }\n\n .content {\n flex: 1;\n flex-direction: column;\n display: flex;\n gap: #{$spacing-tiny};\n }\n\n .icon-right {\n cursor: pointer;\n }\n\n}\n","import { Component, Element, Prop, Host, h, State, Watch, Event, EventEmitter } from '@stencil/core';\n@Component({\n tag: 'cura-alert',\n styleUrl: 'cura-alert.scss',\n shadow: true,\n})\nexport class CuraAlert {\n @Element() host: HTMLElement;\n\n @Prop() type: 'info' \| 'success' \| 'warning' \| 'error' = 'info';\n @Prop({ reflect: true }) floating = false;\n @Prop({ reflect: true }) label: string;\n @Prop({ reflect: true }) closeable = true;\n @Prop({ reflect: true }) icon: string;\n\n @State() styles = {};\n\n @Event({ eventName: 'close' }) close: EventEmitter<void>;\n\n @Watch('type')\n setColors() {\n const colors = [\n { name: '--color-lighter', theme: `${this.type}-lighter` },\n { name: '--neutral-black', theme: 'neutral-black' },\n { name: '--color-light', theme: `${this.type}-light` },\n { name: '--color-base', theme: `${this.type}-base` },\n ];\n\n colors.forEach(color => {\n this.styles[color.name] = window.CuraAPI.theme.colors.getColor(color.theme);\n });\n this.styles = {...this.styles};\n }\n\n connectedCallback() {\n this.styles['--base-spacing'] = window.CuraAPI.theme.spacing.getSpacing();\n this.setColors();\n }\n\n getClasses() {\n const classes = {};\n classes['conteiner'] = true;\n classes['floating'] = this.floating;\n return classes;\n }\n\n getNameIcon() {\n const iconMapping = {\n info: 'infoCircle',\n success: 'checkCircle',\n warning: 'alertCircle',\n error: 'alertTriangle',\n };\n return this.icon ? this.icon : iconMapping[this.type];\n }\n\n handleClose = () => {\n this.close.emit();\n this.host.remove();\n };\n\n render() {\n return (\n <Host>\n <div class={this.getClasses()} style={this.styles}>\n <cura-icon name={this.getNameIcon()} class=\"icon-left\" size={16} color={`${this.type}-dark`}></cura-icon>\n <div class=\"content\">\n { this.label ? (\n <cura-heading class=\"title\" size=\"xsmall\" color=\"neutral-black\" weight=\"bold\" margin-block=\"1px 0\">\n {this.label}\n </cura-heading>\n ) : ''}\n <cura-paragraph class=\"text\" color={`${this.type}-darker`} size=\"xsmall\" marginBlock=\"0\" lineHeight=\"133.33%\">\n <slot></slot>\n </cura-paragraph>\n <slot name=\"actions\"></slot>\n </div>\n { this.closeable ?\n (<cura-icon name=\"close\" size={16} color=\"error-dark\" class=\"icon-right\" onClick={this.handleClose}></cura-icon>)\n : '' }\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

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

@@ -2,9 +2,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-e6d728ec.js');
+const index = require('./index-12d54921.js');
-const curaBadgeCounterCss = ":host{width:fit-content;display:inline-block;height:calc(var(--base-spacing) * 4px);position:relative}:host .container{display:flex;min-width:calc(var(--base-spacing) * 4px);width:fit-content;height:calc(var(--base-spacing) * 4px);justify-content:center;align-items:center;border-radius:calc(calc(var(--base-spacing) * 4px) / 2);background:var(--background-color);box-sizing:border-box;padding:0 calc(var(--base-spacing) * 1px);position:relative}:host .container.outline,:host .container.transparent{background:transparent !important}:host .container.outline::before{content:\"\";width:100%;height:100%;position:absolute;left:0px;top:0px;box-sizing:border-box;border:1px solid var(--background-color);border-radius:calc(calc(var(--base-spacing) * 4px) / 2)}";
+const curaBadgeCounterCss = ":host{width:fit-content;display:inline-block;height:calc(var(--cura-spacing-base) * 4px);position:relative}:host .container{display:flex;min-width:calc(var(--cura-spacing-base) * 4px);width:fit-content;height:calc(var(--cura-spacing-base) * 4px);justify-content:center;align-items:center;border-radius:calc(calc(var(--cura-spacing-base) * 4px) / 2);background:var(--background-color);box-sizing:border-box;padding:0 calc(var(--cura-spacing-base) * 1px);position:relative}:host .container.outline,:host .container.transparent{background:transparent !important}:host .container.outline::before{content:\"\";width:100%;height:100%;position:absolute;left:0px;top:0px;box-sizing:border-box;border:1px solid var(--background-color);border-radius:calc(calc(var(--cura-spacing-base) * 4px) / 2)}";
 const CuraBadgeCounterStyle0 = curaBadgeCounterCss;
 const CuraBadgeNumber = class {

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

	@@ -1 +1 @@
1	- {"file":"cura-badge-counter.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,mBAAmB,GAAG,~~uvBAAuvB~~,CAAC;~~AACpxB~~,+BAAe,mBAAmB;;MCMrB,eAAe;;;QAE1B,UAAK,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC;QAqB7B,eAAU,GAAG,gBAAgB,CAAC;QAC9B,gBAAW,GAAG,iBAAiB,CAAC;;qBAZR,SAAS;wBAIL,KAAK;oBAI4B,OAAO;sBAElD,EAAE;;IAOpB,iBAAiB;QACf,IAAI,CAAC,SAAS,EAAE,CAAC;KAClB;IAED,SAAS;QACP,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC;;QAEvC,IAAI,IAAI,CAAC,IAAI,KAAK,SAAS,IAAI,IAAI,CAAC,IAAI,KAAK,aAAa,EAAE;YAC1D,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,QAAQ,GAAG,gBAAgB,GAAG,GAAG,KAAK,OAAO,CAAC;YACtE,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,WAAW,CAAC;;SAEpC;aAAM;YACL,IAAI,CAAC,WAAW,GAAG,KAAK,KAAK,SAAS,IAAI,IAAI,CAAC,QAAQ,GAAG,cAAc,GAAG,GAAG,KAAK,UAAU,CAAC;YAC9F,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,QAAQ,GAAG,gBAAgB,GAAG,GAAG,KAAK,OAAO,CAAC;SACtE;QACD,IAAI,CAAC,MAAM,mCACN,IAAI,CAAC,MAAM,KACd,oBAAoB,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,GAAG,IAAI,CAAC,WAAW,EAAE,CAAC,GACxE,CAAA;KACF;IAED,iBAAiB;QACf,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC;QAChE,IAAI,CAAC,SAAS,EAAE,CAAC;KAClB;IAED,UAAU;QACR,MAAM,OAAO,GAAG;YACd,WAAW,EAAE,IAAI;SAClB,CAAC;QACF,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,GAAG,IAAI,CAAC;QACxC,OAAO,OAAO,CAAC;KAChB;IAGD,MAAM;QACJ,QACEA,QAACC,UAAI,uDACD,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,MAAM,IAAI,CAAC,GAAG,EAAE,IACtCD,iBAAK,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,MAAM,IAC/CA,wBAAY,IAAI,EAAC,QAAQ,iBAAa,MAAM,EAAC,KAAK,EAAE,IAAI,CAAC,UAAU,IAChE,IAAI,CAAC,MAAM,IAAI,GAAG,GAAG,KAAK,GAAG,IAAI,CAAC,MAAM,CAC9B,CACT,CACL,CACI,EACP;KACH;;;;;;;;;;;","names":["h","Host"],"sources":["src/components/badges/cura-badge-counter/cura-badge-counter.scss?tag=cura-badge-counter&encapsulation=shadow","src/components/badges/cura-badge-counter/cura-badge-counter.tsx"],"sourcesContent":["@import '../../../scss/mixins/spacing.scss';\n\n:host {\n width: fit-content;\n display: inline-block;\n height: #{$spacing-xxs};\n position: relative;\n\n .container {\n display: flex;\n min-width: #{$spacing-xxs};\n width: fit-content;\n height: #{$spacing-xxs};\n justify-content: center;\n align-items: center;\n border-radius: calc(#{$spacing-xxs} / 2);\n background: var(--background-color);\n box-sizing: border-box;\n padding: 0 #{$spacing-tiny};\n position: relative;\n\n &.outline,\n &.transparent {\n background: transparent !important;\n }\n\n &.outline {\n &::before {\n content: \"\";\n width: 100%;\n height: 100%;\n position: absolute;\n left: 0px;\n top: 0px;\n box-sizing: border-box;\n border: 1px solid var(--background-color);\n border-radius: calc(#{$spacing-xxs} / 2);\n }\n }\n }\n\n}\n","import { Component, Host, Prop, h, State, Watch } from '@stencil/core';\n\n@Component({\n tag: 'cura-badge-counter',\n styleUrl: 'cura-badge-counter.scss',\n shadow: true,\n})\nexport class CuraBadgeNumber {\n\n theme = window.CuraAPI.theme;\n\n /** Número a ser representado no badge.\n * Apresentará 99+ para números acima desse valor.\n /\n @Prop({ reflect: true }) number: number \| null;\n /\n Cor fundamental do design system sem profundidade.\n * Ex.: primary (padrão)\n /\n @Prop() color: string = 'primary';\n /\n Define o estado do badge como desabilitado ou habilitado.\n /\n @Prop() disabled: boolean = false;\n /\n Define o estilo visual entre solid (default), outline ou transparent.\n /\n @Prop() type: 'solid' \| 'outline' \| 'transparent' \| string = 'solid';\n\n @State() styles = {};\n labelColor = 'primary-darker';\n bgColorName = 'primary-lighter';\n\n @Watch(\"disabled\")\n @Watch(\"color\")\n @Watch(\"type\")\n handleColorChange() {\n this.setColors();\n }\n\n setColors() {\n const color = this.color.toLowerCase();\n /* type outline and transparent /\n if (this.type === 'outline' \|\| this.type === 'transparent') {\n this.bgColorName = this.disabled ? `neutral-medium` : `${color}-dark`;\n this.labelColor = this.bgColorName;\n /* type solid - default */\n } else {\n this.bgColorName = color === 'neutral' \|\| this.disabled ? `neutral-pale` : `${color}-lighter`;\n this.labelColor = this.disabled ? 'neutral-medium' : `${color}-dark`;\n }\n this.styles = {\n ...this.styles,\n '--background-color': this.theme.colors.getColor(`${this.bgColorName}`),\n }\n }\n\n connectedCallback() {\n this.styles['--base-spacing'] = this.theme.spacing.getSpacing();\n this.setColors();\n }\n\n getClasses() {\n const classes = {\n 'container': true\n };\n classes[this.type.toLowerCase()] = true;\n return classes;\n }\n\n\n render() {\n return (\n <Host>\n { this.number && this.number <= 0 ? '' : (\n <div class={this.getClasses()} style={this.styles}>\n <cura-label size=\"xsmall\" line-height=\"none\" color={this.labelColor}>\n {this.number >= 100 ? '99+' : this.number}\n </cura-label>\n </div>\n )}\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"cura-badge-counter.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,mBAAmB,GAAG,qxBAAqxB,CAAC;AAClzB,+BAAe,mBAAmB;;MCMrB,eAAe;;;QAE1B,UAAK,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC;QAqB7B,eAAU,GAAG,gBAAgB,CAAC;QAC9B,gBAAW,GAAG,iBAAiB,CAAC;;qBAZR,SAAS;wBAIL,KAAK;oBAI4B,OAAO;sBAElD,EAAE;;IAOpB,iBAAiB;QACf,IAAI,CAAC,SAAS,EAAE,CAAC;KAClB;IAED,SAAS;QACP,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC;;QAEvC,IAAI,IAAI,CAAC,IAAI,KAAK,SAAS,IAAI,IAAI,CAAC,IAAI,KAAK,aAAa,EAAE;YAC1D,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,QAAQ,GAAG,gBAAgB,GAAG,GAAG,KAAK,OAAO,CAAC;YACtE,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,WAAW,CAAC;;SAEpC;aAAM;YACL,IAAI,CAAC,WAAW,GAAG,KAAK,KAAK,SAAS,IAAI,IAAI,CAAC,QAAQ,GAAG,cAAc,GAAG,GAAG,KAAK,UAAU,CAAC;YAC9F,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,QAAQ,GAAG,gBAAgB,GAAG,GAAG,KAAK,OAAO,CAAC;SACtE;QACD,IAAI,CAAC,MAAM,mCACN,IAAI,CAAC,MAAM,KACd,oBAAoB,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,GAAG,IAAI,CAAC,WAAW,EAAE,CAAC,GACxE,CAAA;KACF;IAED,iBAAiB;QACf,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC;QAChE,IAAI,CAAC,SAAS,EAAE,CAAC;KAClB;IAED,UAAU;QACR,MAAM,OAAO,GAAG;YACd,WAAW,EAAE,IAAI;SAClB,CAAC;QACF,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,GAAG,IAAI,CAAC;QACxC,OAAO,OAAO,CAAC;KAChB;IAGD,MAAM;QACJ,QACEA,QAACC,UAAI,uDACD,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,MAAM,IAAI,CAAC,GAAG,EAAE,IACtCD,iBAAK,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,MAAM,IAC/CA,wBAAY,IAAI,EAAC,QAAQ,iBAAa,MAAM,EAAC,KAAK,EAAE,IAAI,CAAC,UAAU,IAChE,IAAI,CAAC,MAAM,IAAI,GAAG,GAAG,KAAK,GAAG,IAAI,CAAC,MAAM,CAC9B,CACT,CACL,CACI,EACP;KACH;;;;;;;;;;;","names":["h","Host"],"sources":["src/components/badges/cura-badge-counter/cura-badge-counter.scss?tag=cura-badge-counter&encapsulation=shadow","src/components/badges/cura-badge-counter/cura-badge-counter.tsx"],"sourcesContent":["@import '../../../scss/mixins/spacing.scss';\n\n:host {\n width: fit-content;\n display: inline-block;\n height: #{$spacing-xxs};\n position: relative;\n\n .container {\n display: flex;\n min-width: #{$spacing-xxs};\n width: fit-content;\n height: #{$spacing-xxs};\n justify-content: center;\n align-items: center;\n border-radius: calc(#{$spacing-xxs} / 2);\n background: var(--background-color);\n box-sizing: border-box;\n padding: 0 #{$spacing-tiny};\n position: relative;\n\n &.outline,\n &.transparent {\n background: transparent !important;\n }\n\n &.outline {\n &::before {\n content: \"\";\n width: 100%;\n height: 100%;\n position: absolute;\n left: 0px;\n top: 0px;\n box-sizing: border-box;\n border: 1px solid var(--background-color);\n border-radius: calc(#{$spacing-xxs} / 2);\n }\n }\n }\n\n}\n","import { Component, Host, Prop, h, State, Watch } from '@stencil/core';\n\n@Component({\n tag: 'cura-badge-counter',\n styleUrl: 'cura-badge-counter.scss',\n shadow: true,\n})\nexport class CuraBadgeNumber {\n\n theme = window.CuraAPI.theme;\n\n /** Número a ser representado no badge.\n * Apresentará 99+ para números acima desse valor.\n /\n @Prop({ reflect: true }) number: number \| null;\n /\n Cor fundamental do design system sem profundidade.\n * Ex.: primary (padrão)\n /\n @Prop() color: string = 'primary';\n /\n Define o estado do badge como desabilitado ou habilitado.\n /\n @Prop() disabled: boolean = false;\n /\n Define o estilo visual entre solid (default), outline ou transparent.\n /\n @Prop() type: 'solid' \| 'outline' \| 'transparent' \| string = 'solid';\n\n @State() styles = {};\n labelColor = 'primary-darker';\n bgColorName = 'primary-lighter';\n\n @Watch(\"disabled\")\n @Watch(\"color\")\n @Watch(\"type\")\n handleColorChange() {\n this.setColors();\n }\n\n setColors() {\n const color = this.color.toLowerCase();\n /* type outline and transparent /\n if (this.type === 'outline' \|\| this.type === 'transparent') {\n this.bgColorName = this.disabled ? `neutral-medium` : `${color}-dark`;\n this.labelColor = this.bgColorName;\n /* type solid - default */\n } else {\n this.bgColorName = color === 'neutral' \|\| this.disabled ? `neutral-pale` : `${color}-lighter`;\n this.labelColor = this.disabled ? 'neutral-medium' : `${color}-dark`;\n }\n this.styles = {\n ...this.styles,\n '--background-color': this.theme.colors.getColor(`${this.bgColorName}`),\n }\n }\n\n connectedCallback() {\n this.styles['--base-spacing'] = this.theme.spacing.getSpacing();\n this.setColors();\n }\n\n getClasses() {\n const classes = {\n 'container': true\n };\n classes[this.type.toLowerCase()] = true;\n return classes;\n }\n\n\n render() {\n return (\n <Host>\n { this.number && this.number <= 0 ? '' : (\n <div class={this.getClasses()} style={this.styles}>\n <cura-label size=\"xsmall\" line-height=\"none\" color={this.labelColor}>\n {this.number >= 100 ? '99+' : this.number}\n </cura-label>\n </div>\n )}\n </Host>\n );\n }\n}\n"],"version":3}

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

@@ -2,9 +2,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-e6d728ec.js');
+const index = require('./index-12d54921.js');
-const curaBadgeDotCss = ":host{display:block;position:relative;width:fit-content;height:fit-content}:host .container{width:calc(var(--base-spacing) * 2px);height:calc(var(--base-spacing) * 2px);position:relative;box-sizing:border-box}:host .container::before{width:100%;height:100%;position:absolute;left:0;top:0;content:\"\";box-sizing:border-box;border-radius:50%;border:1px solid var(--color-dark);background:var(--color)}:host .container.disabled::before{background:var(--neutral-pale);border:1px solid var(--neutral-medium)}:host .container.outline::before{background:transparent;border:2px solid var(--color)}:host .container.outline.disabled::before{border:2px solid var(--neutral-medium)}:host .container.transparent::before{background:var(--color-dark);border:none}:host .container.transparent.disabled::before{background:var(--neutral-medium);border:none}";
+const curaBadgeDotCss = ":host{display:block;position:relative;width:fit-content;height:fit-content}:host .container{width:calc(var(--cura-spacing-base) * 2px);height:calc(var(--cura-spacing-base) * 2px);position:relative;box-sizing:border-box}:host .container::before{width:100%;height:100%;position:absolute;left:0;top:0;content:\"\";box-sizing:border-box;border-radius:50%;border:1px solid var(--color-dark);background:var(--color)}:host .container.disabled::before{background:var(--neutral-pale);border:1px solid var(--neutral-medium)}:host .container.outline::before{background:transparent;border:2px solid var(--color)}:host .container.outline.disabled::before{border:2px solid var(--neutral-medium)}:host .container.transparent::before{background:var(--color-dark);border:none}:host .container.transparent.disabled::before{background:var(--neutral-medium);border:none}";
 const CuraBadgeDotStyle0 = curaBadgeDotCss;
 const CuraBadgeDot = class {

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

	@@ -1 +1 @@
1	- {"file":"cura-badge-dot.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,eAAe,GAAG,~~00BAA00B~~,CAAC;~~AACn2B~~,2BAAe,eAAe;;MCMjB,YAAY;;;QAEvB,UAAK,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC;qBAML,SAAS;wBAIU,KAAK;oBAI4B,OAAO;sBAEjE,EAAE;;IAGpB,iBAAiB;QACf,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC;QAChE,IAAI,CAAC,MAAM,CAAC,kBAAkB,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,cAAc,CAAC,CAAC;QAC7E,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,cAAc,CAAC,CAAC;QAC3E,IAAI,CAAC,SAAS,EAAE,CAAC;KAClB;IAED,SAAS;QACP,IAAI,CAAC,MAAM,mCACN,IAAI,CAAC,MAAM,KACd,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,GAAG,IAAI,CAAC,KAAK,EAAE,CAAC,EACtD,cAAc,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,GAAG,IAAI,CAAC,KAAK,OAAO,CAAC,GACjE,CAAA;KACF;IAED,UAAU;QACR,MAAM,OAAO,GAAG;YACd,WAAW,EAAE,IAAI;YACjB,UAAU,EAAE,IAAI,CAAC,QAAQ;SAC1B,CAAC;QACF,OAAO,CAAC,GAAG,IAAI,CAAC,IAAI,EAAE,CAAC,GAAG,IAAI,CAAC;QAC/B,OAAO,OAAO,CAAC;KAChB;IAED,MAAM;QACJ,QACEA,QAACC,UAAI,uDACHD,kEAAK,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,MAAM,GAAQ,CACpD,EACP;KACH;;;;;;","names":["h","Host"],"sources":["src/components/badges/cura-badge-dot/cura-badge-dot.scss?tag=cura-badge-dot&encapsulation=shadow","src/components/badges/cura-badge-dot/cura-badge-dot.tsx"],"sourcesContent":["@import \"../../../scss/mixins/spacing.scss\";\n\n:host {\n display: block;\n position: relative;\n width: fit-content;\n height: fit-content;\n\n .container {\n width: #{$spacing-mini};\n height: #{$spacing-mini};\n position: relative;\n box-sizing: border-box;\n\n &::before {\n width: 100%;\n height: 100%;\n position: absolute;\n left: 0;\n top: 0;\n content: \"\";\n box-sizing: border-box;\n border-radius: 50%;\n border: 1px solid var(--color-dark);\n background: var(--color);\n }\n\n &.disabled::before {\n background: var(--neutral-pale);\n border: 1px solid var(--neutral-medium);\n }\n\n &.outline::before {\n background: transparent;\n border: 2px solid var(--color);\n }\n &.outline.disabled::before {\n border: 2px solid var(--neutral-medium);\n }\n\n &.transparent::before {\n background: var(--color-dark);\n border: none;\n }\n &.transparent.disabled::before {\n background: var(--neutral-medium);\n border: none;\n }\n\n }\n}\n","import { Component, Host, h, Prop, State } from '@stencil/core';\n\n@Component({\n tag: 'cura-badge-dot',\n styleUrl: 'cura-badge-dot.scss',\n shadow: true,\n})\nexport class CuraBadgeDot {\n\n theme = window.CuraAPI.theme;\n\n /*\n Cor fundamental do design system sem profundidade.\n * Ex.: primary (padrão)\n /\n @Prop() color: string = 'primary';\n /\n Define o estado do badge como desabilitado ou habilitado.\n /\n @Prop({reflect: true}) disabled: boolean = false;\n /\n Define o estilo visual entre solid (default), outline ou transparent.\n */\n @Prop({reflect: true}) type: 'solid' \| 'outline' \| 'transparent' \| string = 'solid';\n\n @State() styles = {};\n\n\n connectedCallback() {\n this.styles['--base-spacing'] = this.theme.spacing.getSpacing();\n this.styles['--neutral-medium'] = this.theme.colors.getColor('neutral-dark');;\n this.styles['--neutral-pale'] = this.theme.colors.getColor('neutral-pale');;\n this.setColors();\n }\n\n setColors() {\n this.styles = {\n ...this.styles,\n '--color': this.theme.colors.getColor(`${this.color}`),\n '--color-dark': this.theme.colors.getColor(`${this.color}-dark`)\n }\n }\n\n getClasses() {\n const classes = {\n 'container': true,\n 'disabled': this.disabled\n };\n classes[`${this.type}`] = true;\n return classes;\n }\n\n render() {\n return (\n <Host>\n <div class={this.getClasses()} style={this.styles}></div>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"cura-badge-dot.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,eAAe,GAAG,o1BAAo1B,CAAC;AAC72B,2BAAe,eAAe;;MCMjB,YAAY;;;QAEvB,UAAK,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC;qBAML,SAAS;wBAIU,KAAK;oBAI4B,OAAO;sBAEjE,EAAE;;IAGpB,iBAAiB;QACf,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC;QAChE,IAAI,CAAC,MAAM,CAAC,kBAAkB,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,cAAc,CAAC,CAAC;QAC7E,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,cAAc,CAAC,CAAC;QAC3E,IAAI,CAAC,SAAS,EAAE,CAAC;KAClB;IAED,SAAS;QACP,IAAI,CAAC,MAAM,mCACN,IAAI,CAAC,MAAM,KACd,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,GAAG,IAAI,CAAC,KAAK,EAAE,CAAC,EACtD,cAAc,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,GAAG,IAAI,CAAC,KAAK,OAAO,CAAC,GACjE,CAAA;KACF;IAED,UAAU;QACR,MAAM,OAAO,GAAG;YACd,WAAW,EAAE,IAAI;YACjB,UAAU,EAAE,IAAI,CAAC,QAAQ;SAC1B,CAAC;QACF,OAAO,CAAC,GAAG,IAAI,CAAC,IAAI,EAAE,CAAC,GAAG,IAAI,CAAC;QAC/B,OAAO,OAAO,CAAC;KAChB;IAED,MAAM;QACJ,QACEA,QAACC,UAAI,uDACHD,kEAAK,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,MAAM,GAAQ,CACpD,EACP;KACH;;;;;;","names":["h","Host"],"sources":["src/components/badges/cura-badge-dot/cura-badge-dot.scss?tag=cura-badge-dot&encapsulation=shadow","src/components/badges/cura-badge-dot/cura-badge-dot.tsx"],"sourcesContent":["@import \"../../../scss/mixins/spacing.scss\";\n\n:host {\n display: block;\n position: relative;\n width: fit-content;\n height: fit-content;\n\n .container {\n width: #{$spacing-mini};\n height: #{$spacing-mini};\n position: relative;\n box-sizing: border-box;\n\n &::before {\n width: 100%;\n height: 100%;\n position: absolute;\n left: 0;\n top: 0;\n content: \"\";\n box-sizing: border-box;\n border-radius: 50%;\n border: 1px solid var(--color-dark);\n background: var(--color);\n }\n\n &.disabled::before {\n background: var(--neutral-pale);\n border: 1px solid var(--neutral-medium);\n }\n\n &.outline::before {\n background: transparent;\n border: 2px solid var(--color);\n }\n &.outline.disabled::before {\n border: 2px solid var(--neutral-medium);\n }\n\n &.transparent::before {\n background: var(--color-dark);\n border: none;\n }\n &.transparent.disabled::before {\n background: var(--neutral-medium);\n border: none;\n }\n\n }\n}\n","import { Component, Host, h, Prop, State } from '@stencil/core';\n\n@Component({\n tag: 'cura-badge-dot',\n styleUrl: 'cura-badge-dot.scss',\n shadow: true,\n})\nexport class CuraBadgeDot {\n\n theme = window.CuraAPI.theme;\n\n /*\n Cor fundamental do design system sem profundidade.\n * Ex.: primary (padrão)\n /\n @Prop() color: string = 'primary';\n /\n Define o estado do badge como desabilitado ou habilitado.\n /\n @Prop({reflect: true}) disabled: boolean = false;\n /\n Define o estilo visual entre solid (default), outline ou transparent.\n */\n @Prop({reflect: true}) type: 'solid' \| 'outline' \| 'transparent' \| string = 'solid';\n\n @State() styles = {};\n\n\n connectedCallback() {\n this.styles['--base-spacing'] = this.theme.spacing.getSpacing();\n this.styles['--neutral-medium'] = this.theme.colors.getColor('neutral-dark');;\n this.styles['--neutral-pale'] = this.theme.colors.getColor('neutral-pale');;\n this.setColors();\n }\n\n setColors() {\n this.styles = {\n ...this.styles,\n '--color': this.theme.colors.getColor(`${this.color}`),\n '--color-dark': this.theme.colors.getColor(`${this.color}-dark`)\n }\n }\n\n getClasses() {\n const classes = {\n 'container': true,\n 'disabled': this.disabled\n };\n classes[`${this.type}`] = true;\n return classes;\n }\n\n render() {\n return (\n <Host>\n <div class={this.getClasses()} style={this.styles}></div>\n </Host>\n );\n }\n}\n"],"version":3}

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

@@ -2,9 +2,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-e6d728ec.js');
+const index = require('./index-12d54921.js');
-const curaBadgePillCss = ".badge-container{display:flex;align-items:center;justify-content:center;gap:calc(var(--base-spacing) * 1px);padding:calc(var(--base-spacing) * 1px);border-radius:var(--border-radius);font-family:var(--font-family);font-size:var(--font-size);position:relative;box-sizing:border-box;width:fit-content;height:calc(var(--base-spacing) * 5px);min-width:calc(var(--base-spacing) * 5px);background-color:var(--color-background)}.badge-container::before{content:\"\";width:100%;height:100%;position:absolute;left:0px;top:0px;box-sizing:border-box;border:1px solid transparent;border-radius:var(--border-radius);pointer-events:none}.badge-container.icon-only cura-label{display:none !important}.badge-container.disabled{background-color:var(--color-background-disabled)}.badge-container.outline{background-color:transparent}.badge-container.outline::before{border:1px solid var(--color-base)}.badge-container.outline.disabled::before{border:1px solid var(--color-outline-disabled)}.badge-container.transparent{background-color:transparent}.badge-container.transparent::before{border:1px solid transparent}.badge-container.transparent.disabled{background-color:transparent}.badge-container cura-icon{display:flex}";
+const curaBadgePillCss = ".badge-container{display:flex;align-items:center;justify-content:center;gap:calc(var(--cura-spacing-base) * 1px);padding:calc(var(--cura-spacing-base) * 1px);border-radius:var(--border-radius);font-family:var(--font-family);font-size:var(--font-size);position:relative;box-sizing:border-box;width:fit-content;height:calc(var(--cura-spacing-base) * 5px);min-width:calc(var(--cura-spacing-base) * 5px);background-color:var(--color-background)}.badge-container::before{content:\"\";width:100%;height:100%;position:absolute;left:0px;top:0px;box-sizing:border-box;border:1px solid transparent;border-radius:var(--border-radius);pointer-events:none}.badge-container.icon-only cura-label{display:none !important}.badge-container.disabled{background-color:var(--color-background-disabled)}.badge-container.outline{background-color:transparent}.badge-container.outline::before{border:1px solid var(--color-base)}.badge-container.outline.disabled::before{border:1px solid var(--color-outline-disabled)}.badge-container.transparent{background-color:transparent}.badge-container.transparent::before{border:1px solid transparent}.badge-container.transparent.disabled{background-color:transparent}.badge-container cura-icon{display:flex}";
 const CuraBadgePillStyle0 = curaBadgePillCss;
 const CuraBadgePill = class {

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

	@@ -1 +1 @@
1	- {"file":"cura-badge-pill.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,gBAAgB,GAAG,~~qrCAAqrC~~,CAAC;~~AAC/sC~~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","names":["h","Host"],"sources":["src/components/badges/cura-badge-pill/cura-badge-pill.scss?tag=cura-badge-pill&encapsulation=shadow","src/components/badges/cura-badge-pill/cura-badge-pill.tsx"],"sourcesContent":["@import \"../../../scss/mixins/spacing.scss\";\n\n.badge-container {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: #{$spacing-tiny};\n padding: #{$spacing-tiny};\n border-radius: var(--border-radius);\n font-family: var(--font-family);\n font-size: var(--font-size);\n position: relative;\n box-sizing: border-box;\n width: fit-content;\n height: #{$spacing-xs};\n min-width: #{$spacing-xs};\n\n background-color: var(--color-background);\n\n &::before {\n content: \"\";\n width: 100%;\n height: 100%;\n position: absolute;\n left: 0px;\n top: 0px;\n box-sizing: border-box;\n border: 1px solid transparent;\n border-radius: var(--border-radius);\n pointer-events: none;\n }\n\n &.icon-only {\n cura-label {\n display: none !important;\n }\n }\n\n &.disabled {\n background-color: var(--color-background-disabled);\n }\n\n &.outline {\n background-color: transparent;\n\n &::before {\n border: 1px solid var(--color-base);\n }\n\n &.disabled::before {\n border: 1px solid var(--color-outline-disabled);\n }\n }\n\n &.transparent {\n background-color: transparent;\n\n &::before {\n border: 1px solid transparent;\n }\n\n &.disabled {\n background-color: transparent;\n }\n }\n\n cura-icon {\n display: flex;\n }\n}\n","import { Component, Host, Prop, State, h, Watch, Element } from '@stencil/core';\n\n@Component({\n tag: 'cura-badge-pill',\n styleUrl: 'cura-badge-pill.scss',\n shadow: true,\n})\nexport class CuraBadgePill {\n @Element() host: HTMLElement;\n\n /*\n Badge type: solid \| outline \| transparent\n /\n @Prop({ reflect: true }) type: 'solid' \| 'outline' \| 'transparent' = 'solid';\n\n /\n Color base from color scheme. Default: primary\n /\n @Prop() color: 'primary' \| 'secondary' \| 'accent' \| 'neutral' \| 'info' \| 'success' \| 'warning' \| 'error' = 'primary';\n\n /\n Name of the icon to be used from iconset\n /\n @Prop({ reflect: true }) iconName: string;\n\n /\n Custom iconset if needed\n /\n @Prop({ reflect: true }) iconset = 'default';\n\n /\n Disabled state. Boolean\n /\n @Prop({ reflect: true }) disabled = false;\n\n /\n Set badge to icon only. Boolean\n /\n @Prop({ reflect: true }) iconOnly = false;\n\n /\n Set border-radius.\n */\n @Prop({ reflect: true }) borderRadius: string = '2px';\n\n @State() styles = {};\n\n theme = window.CuraAPI.theme;\n\n @Watch('color')\n watchColorChange() {\n this.setColors();\n }\n\n connectedCallback() {\n this.setBaseStyles();\n this.setColors();\n }\n\n private setBaseStyles() {\n this.styles = {\n ...this.styles,\n '--base-spacing': this.theme.spacing.getSpacing(),\n '--font-family': this.theme.fonts.getFamily(),\n '--font-size': this.theme.fonts.getSize(),\n };\n }\n\n private setColors() {\n const colors = [\n { name: '--color-background', theme: `${this.color}-lighter` },\n { name: '--color-base', theme: `${this.color}-dark` },\n { name: '--color-background-disabled', theme: 'neutral-pale' },\n { name: '--color-outline-disabled', theme: 'neutral-medium' },\n ];\n\n const newStyles = { ...this.styles };\n colors.forEach(color => {\n newStyles[color.name] = this.theme.colors.getColor(color.theme);\n });\n\n this.styles = newStyles;\n }\n\n hostCSSProperties() {\n return {\n '--border-radius': this.borderRadius \|\| '2px',\n };\n }\n\n getClasses() {\n const classes = {};\n classes['badge-container'] = true;\n classes[`icon-only`] = this.iconOnly;\n classes['disabled'] = this.disabled;\n classes[`${this.type}`] = true;\n return classes;\n }\n\n getSymbolColor() {\n return this.disabled ? 'neutral-medium' : `${this.color}-dark`;\n }\n\n getIcon() {\n if (!this.iconName) return '';\n return <cura-icon name={this.iconName} iconset={this.iconset} size={'micro'} color={this.getSymbolColor()} />;\n }\n\n render() {\n const symbolColor = this.getSymbolColor();\n return (\n <Host style={this.hostCSSProperties()}>\n <div class={this.getClasses()} style={this.styles}>\n {this.getIcon()}\n <cura-label size=\"xsmall\" line-height=\"117%\" color={symbolColor}>\n <slot></slot>\n </cura-label>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"cura-badge-pill.entry.cjs.js","mappings":"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","names":["h","Host"],"sources":["src/components/badges/cura-badge-pill/cura-badge-pill.scss?tag=cura-badge-pill&encapsulation=shadow","src/components/badges/cura-badge-pill/cura-badge-pill.tsx"],"sourcesContent":["@import \"../../../scss/mixins/spacing.scss\";\n\n.badge-container {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: #{$spacing-tiny};\n padding: #{$spacing-tiny};\n border-radius: var(--border-radius);\n font-family: var(--font-family);\n font-size: var(--font-size);\n position: relative;\n box-sizing: border-box;\n width: fit-content;\n height: #{$spacing-xs};\n min-width: #{$spacing-xs};\n\n background-color: var(--color-background);\n\n &::before {\n content: \"\";\n width: 100%;\n height: 100%;\n position: absolute;\n left: 0px;\n top: 0px;\n box-sizing: border-box;\n border: 1px solid transparent;\n border-radius: var(--border-radius);\n pointer-events: none;\n }\n\n &.icon-only {\n cura-label {\n display: none !important;\n }\n }\n\n &.disabled {\n background-color: var(--color-background-disabled);\n }\n\n &.outline {\n background-color: transparent;\n\n &::before {\n border: 1px solid var(--color-base);\n }\n\n &.disabled::before {\n border: 1px solid var(--color-outline-disabled);\n }\n }\n\n &.transparent {\n background-color: transparent;\n\n &::before {\n border: 1px solid transparent;\n }\n\n &.disabled {\n background-color: transparent;\n }\n }\n\n cura-icon {\n display: flex;\n }\n}\n","import { Component, Host, Prop, State, h, Watch, Element } from '@stencil/core';\n\n@Component({\n tag: 'cura-badge-pill',\n styleUrl: 'cura-badge-pill.scss',\n shadow: true,\n})\nexport class CuraBadgePill {\n @Element() host: HTMLElement;\n\n /*\n Badge type: solid \| outline \| transparent\n /\n @Prop({ reflect: true }) type: 'solid' \| 'outline' \| 'transparent' = 'solid';\n\n /\n Color base from color scheme. Default: primary\n /\n @Prop() color: 'primary' \| 'secondary' \| 'accent' \| 'neutral' \| 'info' \| 'success' \| 'warning' \| 'error' = 'primary';\n\n /\n Name of the icon to be used from iconset\n /\n @Prop({ reflect: true }) iconName: string;\n\n /\n Custom iconset if needed\n /\n @Prop({ reflect: true }) iconset = 'default';\n\n /\n Disabled state. Boolean\n /\n @Prop({ reflect: true }) disabled = false;\n\n /\n Set badge to icon only. Boolean\n /\n @Prop({ reflect: true }) iconOnly = false;\n\n /\n Set border-radius.\n */\n @Prop({ reflect: true }) borderRadius: string = '2px';\n\n @State() styles = {};\n\n theme = window.CuraAPI.theme;\n\n @Watch('color')\n watchColorChange() {\n this.setColors();\n }\n\n connectedCallback() {\n this.setBaseStyles();\n this.setColors();\n }\n\n private setBaseStyles() {\n this.styles = {\n ...this.styles,\n '--base-spacing': this.theme.spacing.getSpacing(),\n '--font-family': this.theme.fonts.getFamily(),\n '--font-size': this.theme.fonts.getSize(),\n };\n }\n\n private setColors() {\n const colors = [\n { name: '--color-background', theme: `${this.color}-lighter` },\n { name: '--color-base', theme: `${this.color}-dark` },\n { name: '--color-background-disabled', theme: 'neutral-pale' },\n { name: '--color-outline-disabled', theme: 'neutral-medium' },\n ];\n\n const newStyles = { ...this.styles };\n colors.forEach(color => {\n newStyles[color.name] = this.theme.colors.getColor(color.theme);\n });\n\n this.styles = newStyles;\n }\n\n hostCSSProperties() {\n return {\n '--border-radius': this.borderRadius \|\| '2px',\n };\n }\n\n getClasses() {\n const classes = {};\n classes['badge-container'] = true;\n classes[`icon-only`] = this.iconOnly;\n classes['disabled'] = this.disabled;\n classes[`${this.type}`] = true;\n return classes;\n }\n\n getSymbolColor() {\n return this.disabled ? 'neutral-medium' : `${this.color}-dark`;\n }\n\n getIcon() {\n if (!this.iconName) return '';\n return <cura-icon name={this.iconName} iconset={this.iconset} size={'micro'} color={this.getSymbolColor()} />;\n }\n\n render() {\n const symbolColor = this.getSymbolColor();\n return (\n <Host style={this.hostCSSProperties()}>\n <div class={this.getClasses()} style={this.styles}>\n {this.getIcon()}\n <cura-label size=\"xsmall\" line-height=\"117%\" color={symbolColor}>\n <slot></slot>\n </cura-label>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

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

@@ -2,10 +2,10 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-e6d728ec.js');
+const index = require('./index-12d54921.js');
 const curaButton_definitions = require('./cura-button.definitions-f036371c.js');
-const curaButtonOutlineCss = ":host{--border-radius:4px;display:inline-block;vertical-align:middle;position:relative}:host button,:host a{outline:none;box-shadow:none;box-sizing:border-box;display:flex;width:100%;align-items:center;justify-content:center;text-decoration:none !important;font-size:var(--font-size);cursor:pointer;transition:background-color 0.07s linear, box-shadow 0.07s linear, border-color 0.07s linear;border-radius:var(--border-radius);position:relative;background-color:transparent;box-sizing:border-box;border:none}:host button:focus,:host a:focus{outline:2px solid #6EA8FF}:host button::before,:host a::before{content:\"\";width:100%;height:100%;position:absolute;left:0px;top:0px;box-sizing:border-box;border:2px solid var(--color-dark-neutral-purewhite);border-radius:var(--border-radius)}:host button:not(.disabled):not(.isLoading):hover,:host a:not(.disabled):not(.isLoading):hover{background-color:var(--color-lighter-color-darker)}:host button:not(.disabled):not(.inverted):not(.isLoading):active,:host a:not(.disabled):not(.inverted):not(.isLoading):active{background-color:var(--color-light-color-darker)}:host button.large,:host a.large{padding:calc(var(--base-spacing) * 3px) calc(var(--base-spacing) * 4px);min-height:calc(var(--base-spacing) * 11px)}:host button.medium,:host a.medium{padding:calc(var(--base-spacing) * 3px);min-height:calc(var(--base-spacing) * 10px)}:host button.small,:host a.small{padding:calc(var(--base-spacing) * 2px);min-height:calc(var(--base-spacing) * 8px)}:host button .button-container,:host a .button-container{display:flex;align-items:center;opacity:1;transition:opacity 0.2s linear;position:relative}:host button.icon-right .button-container,:host a.icon-right .button-container{flex-direction:row-reverse}:host button.justify .button-container,:host a.justify .button-container{width:100%}:host button cura-label,:host a cura-label{flex:1;text-align:var(--text-align, \"left\")}:host button.icon-left cura-icon,:host a.icon-left cura-icon{margin-right:calc(var(--base-spacing) * 3px)}:host button.icon-right cura-icon,:host a.icon-right cura-icon{margin-left:calc(var(--base-spacing) * 3px)}:host button.medium.icon-left cura-icon,:host button.small.icon-left cura-icon,:host a.medium.icon-left cura-icon,:host a.small.icon-left cura-icon{margin-right:calc(var(--base-spacing) * 2px)}:host button.medium.icon-right cura-icon,:host button.small.icon-right cura-icon,:host a.medium.icon-right cura-icon,:host a.small.icon-right cura-icon{margin-left:calc(var(--base-spacing) * 2px)}:host button.disabled,:host a.disabled{cursor:not-allowed}:host button.disabled::before,:host a.disabled::before{border-color:var(--neutral-dark)}:host button.icon-only,:host a.icon-only{padding:calc(var(--base-spacing) * 3px) calc(var(--base-spacing) * 3px)}:host button.icon-only cura-label,:host a.icon-only cura-label{display:none}:host button.icon-only cura-icon,:host a.icon-only cura-icon{margin-left:0 !important;margin-right:0 !important}:host button.icon-only.medium,:host a.icon-only.medium{padding:calc(var(--base-spacing) * 3px)}:host button.icon-only.small,:host a.icon-only.small{padding:calc(var(--base-spacing) * 2px)}:host button cura-loader-circle,:host a cura-loader-circle{position:absolute;display:none}:host button.isLoading,:host a.isLoading{cursor:wait}:host button.isLoading .button-container,:host a.isLoading .button-container{opacity:0}:host button.isLoading cura-loader-circle,:host a.isLoading cura-loader-circle{display:block}";
+const curaButtonOutlineCss = ":host{--border-radius:4px;display:inline-block;vertical-align:middle;position:relative}:host button,:host a{outline:none;box-shadow:none;box-sizing:border-box;display:flex;width:100%;align-items:center;justify-content:center;text-decoration:none !important;font-size:var(--font-size);cursor:pointer;transition:background-color 0.07s linear, box-shadow 0.07s linear, border-color 0.07s linear;border-radius:var(--border-radius);position:relative;background-color:transparent;box-sizing:border-box;border:none}:host button:focus,:host a:focus{outline:2px solid #6EA8FF}:host button::before,:host a::before{content:\"\";width:100%;height:100%;position:absolute;left:0px;top:0px;box-sizing:border-box;border:2px solid var(--color-dark-neutral-purewhite);border-radius:var(--border-radius)}:host button:not(.disabled):not(.isLoading):hover,:host a:not(.disabled):not(.isLoading):hover{background-color:var(--color-lighter-color-darker)}:host button:not(.disabled):not(.inverted):not(.isLoading):active,:host a:not(.disabled):not(.inverted):not(.isLoading):active{background-color:var(--color-light-color-darker)}:host button.large,:host a.large{padding:calc(var(--cura-spacing-base) * 3px) calc(var(--cura-spacing-base) * 4px);min-height:calc(var(--cura-spacing-base) * 11px)}:host button.medium,:host a.medium{padding:calc(var(--cura-spacing-base) * 3px);min-height:calc(var(--cura-spacing-base) * 10px)}:host button.small,:host a.small{padding:calc(var(--cura-spacing-base) * 2px);min-height:calc(var(--cura-spacing-base) * 8px)}:host button .button-container,:host a .button-container{display:flex;align-items:center;opacity:1;transition:opacity 0.2s linear;position:relative}:host button.icon-right .button-container,:host a.icon-right .button-container{flex-direction:row-reverse}:host button.justify .button-container,:host a.justify .button-container{width:100%}:host button cura-label,:host a cura-label{flex:1;text-align:var(--text-align, \"left\")}:host button.icon-left cura-icon,:host a.icon-left cura-icon{margin-right:calc(var(--cura-spacing-base) * 3px)}:host button.icon-right cura-icon,:host a.icon-right cura-icon{margin-left:calc(var(--cura-spacing-base) * 3px)}:host button.medium.icon-left cura-icon,:host button.small.icon-left cura-icon,:host a.medium.icon-left cura-icon,:host a.small.icon-left cura-icon{margin-right:calc(var(--cura-spacing-base) * 2px)}:host button.medium.icon-right cura-icon,:host button.small.icon-right cura-icon,:host a.medium.icon-right cura-icon,:host a.small.icon-right cura-icon{margin-left:calc(var(--cura-spacing-base) * 2px)}:host button.disabled,:host a.disabled{cursor:not-allowed}:host button.disabled::before,:host a.disabled::before{border-color:var(--neutral-dark)}:host button.icon-only,:host a.icon-only{padding:calc(var(--cura-spacing-base) * 3px) calc(var(--cura-spacing-base) * 3px)}:host button.icon-only cura-label,:host a.icon-only cura-label{display:none}:host button.icon-only cura-icon,:host a.icon-only cura-icon{margin-left:0 !important;margin-right:0 !important}:host button.icon-only.medium,:host a.icon-only.medium{padding:calc(var(--cura-spacing-base) * 3px)}:host button.icon-only.small,:host a.icon-only.small{padding:calc(var(--cura-spacing-base) * 2px)}:host button cura-loader-circle,:host a cura-loader-circle{position:absolute;display:none}:host button.isLoading,:host a.isLoading{cursor:wait}:host button.isLoading .button-container,:host a.isLoading .button-container{opacity:0}:host button.isLoading cura-loader-circle,:host a.isLoading cura-loader-circle{display:block}";
 const CuraButtonOutlineStyle0 = curaButtonOutlineCss;
 const CuraButtonOutline = class {

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

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

package/dist/cjs/cura-button-select.cjs.entry.js CHANGED Viewed

@@ -2,10 +2,10 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-e6d728ec.js');
+const index = require('./index-12d54921.js');
 const curaButton_definitions = require('./cura-button.definitions-f036371c.js');
-const curaButtonSelectCss = ":host{--border-radius:4px;display:inline-block;vertical-align:middle;position:relative}:host button,:host a{outline:none;box-shadow:none;box-sizing:border-box;display:flex;width:100%;align-items:center;justify-content:center;text-decoration:none !important;font-size:var(--font-size);cursor:pointer;transition:background-color 0.07s linear, box-shadow 0.07s linear, border-color 0.07s linear;border-radius:var(--border-radius);position:relative;background-color:var(--neutral-purewhite);box-sizing:border-box;border:none}:host button:focus,:host a:focus{outline:2px solid #6EA8FF}:host button::before,:host a::before{content:\"\";width:100%;height:100%;position:absolute;left:0px;top:0px;box-sizing:border-box;border:2px solid var(--color-border);border-radius:var(--border-radius)}:host button:not(.disabled):hover,:host a:not(.disabled):hover{background-color:var(--color-background-hover);border-color:var(--color-border-hover-pressed)}:host button:focus,:host a:focus{border-color:var(--color-border) !important}:host button.large,:host a.large{padding:calc(var(--base-spacing) * 3px) calc(var(--base-spacing) * 4px);min-height:calc(var(--base-spacing) * 11px)}:host button.medium,:host a.medium{padding:calc(var(--base-spacing) * 3px);min-height:calc(var(--base-spacing) * 10px)}:host button.small,:host a.small{padding:calc(var(--base-spacing) * 2px);min-height:calc(var(--base-spacing) * 8px)}:host button cura-label,:host a cura-label{flex:1;text-align:var(--text-align, \"left\")}:host button .button-container,:host a .button-container{display:flex;align-items:center;opacity:1;transition:opacity 0.2s linear;position:relative;flex-direction:row !important}:host button .button-container .badge-number,:host a .button-container .badge-number{margin-left:10px}:host button.icon-right .button-container,:host a.icon-right .button-container{flex-direction:row-reverse}:host button.justify .button-container,:host a.justify .button-container{width:100%}:host button.icon-left cura-icon,:host a.icon-left cura-icon{margin-right:calc(var(--base-spacing) * 3px)}:host button.icon-right cura-icon,:host a.icon-right cura-icon{margin-left:calc(var(--base-spacing) * 3px)}:host button.medium.icon-left cura-icon,:host button.small.icon-left cura-icon,:host a.medium.icon-left cura-icon,:host a.small.icon-left cura-icon{margin-right:calc(var(--base-spacing) * 2px)}:host button.medium.icon-right cura-icon,:host button.small.icon-right cura-icon,:host a.medium.icon-right cura-icon,:host a.small.icon-right cura-icon{margin-left:calc(var(--base-spacing) * 2px)}:host button.selected,:host a.selected{cursor:pointer;background-color:var(--color-select);border-color:var(--color-select)}:host button.selected:not(.disabled):hover,:host a.selected:not(.disabled):hover{background-color:var(--color-border-hover-pressed);border-color:var(--color-border-hover-pressed)}:host button.selected:focus,:host a.selected:focus{border-color:var(--color-select-focus) !important}:host button.selected.disabled,:host a.selected.disabled{background-color:var(--color-disable-select);border-color:var(--color-disable-select)}:host button.disabled,:host a.disabled{cursor:not-allowed;background-color:var(--neutral-white-primary-darker);border-color:var(--color-border-disable-unselect)}";
+const curaButtonSelectCss = ":host{--border-radius:4px;display:inline-block;vertical-align:middle;position:relative}:host button,:host a{outline:none;box-shadow:none;box-sizing:border-box;display:flex;width:100%;align-items:center;justify-content:center;text-decoration:none !important;font-size:var(--font-size);cursor:pointer;transition:background-color 0.07s linear, box-shadow 0.07s linear, border-color 0.07s linear;border-radius:var(--border-radius);position:relative;background-color:var(--neutral-purewhite);box-sizing:border-box;border:none}:host button:focus,:host a:focus{outline:2px solid #6EA8FF}:host button::before,:host a::before{content:\"\";width:100%;height:100%;position:absolute;left:0px;top:0px;box-sizing:border-box;border:2px solid var(--color-border);border-radius:var(--border-radius)}:host button:not(.disabled):hover,:host a:not(.disabled):hover{background-color:var(--color-background-hover);border-color:var(--color-border-hover-pressed)}:host button:focus,:host a:focus{border-color:var(--color-border) !important}:host button.large,:host a.large{padding:calc(var(--cura-spacing-base) * 3px) calc(var(--cura-spacing-base) * 4px);min-height:calc(var(--cura-spacing-base) * 11px)}:host button.medium,:host a.medium{padding:calc(var(--cura-spacing-base) * 3px);min-height:calc(var(--cura-spacing-base) * 10px)}:host button.small,:host a.small{padding:calc(var(--cura-spacing-base) * 2px);min-height:calc(var(--cura-spacing-base) * 8px)}:host button cura-label,:host a cura-label{flex:1;text-align:var(--text-align, \"left\")}:host button .button-container,:host a .button-container{display:flex;align-items:center;opacity:1;transition:opacity 0.2s linear;position:relative;flex-direction:row !important}:host button .button-container .badge-number,:host a .button-container .badge-number{margin-left:10px}:host button.icon-right .button-container,:host a.icon-right .button-container{flex-direction:row-reverse}:host button.justify .button-container,:host a.justify .button-container{width:100%}:host button.icon-left cura-icon,:host a.icon-left cura-icon{margin-right:calc(var(--cura-spacing-base) * 3px)}:host button.icon-right cura-icon,:host a.icon-right cura-icon{margin-left:calc(var(--cura-spacing-base) * 3px)}:host button.medium.icon-left cura-icon,:host button.small.icon-left cura-icon,:host a.medium.icon-left cura-icon,:host a.small.icon-left cura-icon{margin-right:calc(var(--cura-spacing-base) * 2px)}:host button.medium.icon-right cura-icon,:host button.small.icon-right cura-icon,:host a.medium.icon-right cura-icon,:host a.small.icon-right cura-icon{margin-left:calc(var(--cura-spacing-base) * 2px)}:host button.selected,:host a.selected{cursor:pointer;background-color:var(--color-select);border-color:var(--color-select)}:host button.selected:not(.disabled):hover,:host a.selected:not(.disabled):hover{background-color:var(--color-border-hover-pressed);border-color:var(--color-border-hover-pressed)}:host button.selected:focus,:host a.selected:focus{border-color:var(--color-select-focus) !important}:host button.selected.disabled,:host a.selected.disabled{background-color:var(--color-disable-select);border-color:var(--color-disable-select)}:host button.disabled,:host a.disabled{cursor:not-allowed;background-color:var(--neutral-white-primary-darker);border-color:var(--color-border-disable-unselect)}";
 const CuraButtonSelectStyle0 = curaButtonSelectCss;
 const CuraButtonSelect = class {

package/dist/cjs/cura-button-select.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"cura-button-select.entry.cjs.js","mappings":"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","names":["h","labelSizes","Host"],"sources":["src/components/buttons/cura-button-select/cura-button-select.scss?tag=cura-button-select&encapsulation=shadow","src/components/buttons/cura-button-select/cura-button-select.tsx"],"sourcesContent":["@import '../../../scss/mixins/buttons.scss';\n\n:host {\n @include button-host();\n\n button,\n a {\n @include button-element() {\n background-color: var(--neutral-purewhite);\n box-sizing: border-box;\n border: none;\n\n &::before {\n content: '';\n width: 100%;\n height: 100%;\n position: absolute;\n left: 0px;\n top: 0px;\n box-sizing: border-box;\n border: 2px solid var(--color-border);\n border-radius: var(--border-radius);\n }\n\n &:not(.disabled):hover {\n background-color: var(--color-background-hover);\n border-color: var(--color-border-hover-pressed);\n }\n\n &:focus {\n border-color: var(--color-border) !important;\n }\n }\n\n @include button-sizes();\n\n @include button-label();\n\n // Children Elements\n @include button-container() {\n flex-direction: row !important;\n\n .badge-number {\n margin-left: 10px;\n }\n }\n\n @include button-icon();\n\n // selected state\n @include button-selected() {\n background-color: var(--color-select);\n border-color: var(--color-select);\n\n &:not(.disabled):hover {\n background-color: var(--color-border-hover-pressed);\n border-color: var(--color-border-hover-pressed);\n }\n\n &:focus {\n border-color: var(--color-select-focus) !important;\n }\n\n &.disabled {\n background-color: var(--color-disable-select);\n border-color: var(--color-disable-select);\n }\n }\n\n // Disabled state\n @include button-disabled() {\n background-color: var(--neutral-white-primary-darker);\n border-color: var(--color-border-disable-unselect);\n }\n }\n}\n","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"],"version":3}
1	+ {"file":"cura-button-select.entry.cjs.js","mappings":";;;;;;;AAAA,MAAM,mBAAmB,GAAG,8vGAA8vG,CAAC;AAC3xG,+BAAe,mBAAmB;;MCOrB,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,GAAG,GAAG,IAAI,CAAC,KAAK,SAAS,GAAG,eAAe,EAAE;YACzG,EAAE,IAAI,EAAE,8BAA8B,EAAE,KAAK,EAAE,IAAI,CAAC,UAAU,KAAK,OAAO,GAAG,GAAG,IAAI,CAAC,KAAK,OAAO,GAAG,GAAG,IAAI,CAAC,KAAK,QAAQ,EAAE;YAC3H,EAAE,IAAI,EAAE,0BAA0B,EAAE,KAAK,EAAE,IAAI,CAAC,UAAU,KAAK,OAAO,GAAG,GAAG,IAAI,CAAC,KAAK,QAAQ,GAAG,GAAG,IAAI,CAAC,KAAK,OAAO,EAAE;YACvH,EAAE,IAAI,EAAE,gBAAgB,EAAE,KAAK,EAAE,IAAI,CAAC,UAAU,KAAK,OAAO,GAAG,GAAG,IAAI,CAAC,KAAK,OAAO,GAAG,eAAe,EAAE;YACvG,EAAE,IAAI,EAAE,8BAA8B,EAAE,KAAK,EAAE,IAAI,CAAC,UAAU,KAAK,OAAO,GAAG,GAAG,IAAI,CAAC,KAAK,OAAO,GAAG,GAAG,IAAI,CAAC,KAAK,UAAU,EAAE;YAC7H,EAAE,IAAI,EAAE,sBAAsB,EAAE,KAAK,EAAE,IAAI,CAAC,UAAU,KAAK,OAAO,GAAG,GAAG,IAAI,CAAC,KAAK,OAAO,GAAG,GAAG,IAAI,CAAC,KAAK,UAAU,EAAE;YACrH,EAAE,IAAI,EAAE,wBAAwB,EAAE,KAAK,EAAE,IAAI,CAAC,UAAU,KAAK,OAAO,GAAG,eAAe,GAAG,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,GAAG,cAAc,GAAG,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,KAAK,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;KAClC;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;KAChB;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;KAClB;IAED,iBAAiB;QACf,IAAI,IAAI,CAAC,QAAQ;YAAE,OAAO,cAAc,CAAC;QAEzC,IAAI,IAAI,CAAC,UAAU,KAAK,MAAM,EAAE;YAC9B,OAAO,IAAI,CAAC,QAAQ,GAAG,eAAe,GAAG,eAAe,CAAC;SAC1D;QACD,IAAI,IAAI,CAAC,UAAU,KAAK,OAAO,EAAE;YAC/B,OAAO,IAAI,CAAC,QAAQ,GAAG,eAAe,GAAG,eAAe,CAAC;SAC1D;KACF;IAED,mBAAmB;QACjB,IAAI,IAAI,CAAC,UAAU,KAAK,MAAM,IAAI,IAAI,CAAC,QAAQ,EAAE;YAC/C,OAAO,IAAI,CAAC,QAAQ,GAAG,eAAe,GAAG,cAAc,CAAC;SACzD;QAED,IAAI,IAAI,CAAC,UAAU,KAAK,OAAO,IAAI,IAAI,CAAC,QAAQ,EAAE;YAChD,OAAO,gBAAgB,CAAC;SACzB;QAED,OAAO,GAAG,IAAI,CAAC,KAAK,SAAS,CAAC;KAC/B;IAED,OAAO;QACL,MAAM,QAAQ,GAAG,IAAI,CAAC,IAAI,KAAK,OAAO,GAAG,EAAE,GAAG,EAAE,CAAC;QACjD,IAAI,IAAI,CAAC,YAAY,KAAK,OAAO,EAAE;YACjC,OAAO;SACR;QAED,OAAOA,uBAAW,IAAI,EAAE,IAAI,CAAC,QAAQ,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,IAAI,CAAC,iBAAiB,EAAE,GAAI,CAAC;KAC5F;IAED,UAAU;QACR,QACEA,gCACE,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,EACrB;KACH;IAED,iBAAiB;QACf,MAAM,QAAQ,GAAG,IAAI,CAAC,IAAI,KAAK,OAAO,GAAG,EAAE,GAAG,EAAE,CAAC;QACjD,OAAOA,uBAAW,IAAI,EAAC,OAAO,EAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,IAAI,CAAC,iBAAiB,EAAE,GAAc,CAAC;KAC9F;IAED,gBAAgB;QACd,IAAI,IAAI,CAAC,QAAQ;YAAE,OAAO;QAC1B,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;KACrB;IAED,gBAAgB;QACd,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;KACtB;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;KAChD;IAED,MAAM;QACJ,MAAM,SAAS,GAAGC,iCAAU,CAAC,IAAI,CAAC,IAAI,CAAC,IAAIA,iCAAU,CAAC,SAAS,CAAC,CAAC;QACjE,QACED,QAACE,UAAI,uDACHF,qEACE,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EACxB,KAAK,EAAE,IAAI,CAAC,MAAM,EAClB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,OAAO,EAAE,CAAC,IAAI,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,EACjC,YAAY,EAAE,MAAM,IAAI,CAAC,gBAAgB,EAAE,EAC3C,YAAY,EAAE,MAAM,IAAI,CAAC,gBAAgB,EAAE,IAE3CA,kEAAK,KAAK,EAAC,kBAAkB,IAC1B,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,OAAO,EAAE,GAAG,IAAI,EACtCA,yEAAY,KAAK,EAAC,OAAO,EAAC,IAAI,EAAE,SAAS,EAAE,UAAU,EAAC,IAAI,EAAC,KAAK,EAAE,IAAI,CAAC,iBAAiB,EAAE,EAAE,MAAM,EAAC,SAAS,IAC1GA,oEAAa,CACF,EACZ,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,UAAU,EAAE,GAAG,IAAI,EACvC,IAAI,CAAC,YAAY,KAAK,OAAO,IAAI,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,iBAAiB,EAAE,GAAG,IAAI,CAC7E,CACC,CACJ,EACP;KACH;;;;;;;;;;;","names":["h","labelSizes","Host"],"sources":["src/components/buttons/cura-button-select/cura-button-select.scss?tag=cura-button-select&encapsulation=shadow","src/components/buttons/cura-button-select/cura-button-select.tsx"],"sourcesContent":["@import '../../../scss/mixins/buttons.scss';\n\n:host {\n @include button-host();\n\n button,\n a {\n @include button-element() {\n background-color: var(--neutral-purewhite);\n box-sizing: border-box;\n border: none;\n\n &::before {\n content: '';\n width: 100%;\n height: 100%;\n position: absolute;\n left: 0px;\n top: 0px;\n box-sizing: border-box;\n border: 2px solid var(--color-border);\n border-radius: var(--border-radius);\n }\n\n &:not(.disabled):hover {\n background-color: var(--color-background-hover);\n border-color: var(--color-border-hover-pressed);\n }\n\n &:focus {\n border-color: var(--color-border) !important;\n }\n }\n\n @include button-sizes();\n\n @include button-label();\n\n // Children Elements\n @include button-container() {\n flex-direction: row !important;\n\n .badge-number {\n margin-left: 10px;\n }\n }\n\n @include button-icon();\n\n // selected state\n @include button-selected() {\n background-color: var(--color-select);\n border-color: var(--color-select);\n\n &:not(.disabled):hover {\n background-color: var(--color-border-hover-pressed);\n border-color: var(--color-border-hover-pressed);\n }\n\n &:focus {\n border-color: var(--color-select-focus) !important;\n }\n\n &.disabled {\n background-color: var(--color-disable-select);\n border-color: var(--color-disable-select);\n }\n }\n\n // Disabled state\n @include button-disabled() {\n background-color: var(--neutral-white-primary-darker);\n border-color: var(--color-border-disable-unselect);\n }\n }\n}\n","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"],"version":3}

package/dist/cjs/cura-calendar.cjs.entry.js CHANGED Viewed

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index$1 = require('./index-e6d728ec.js');
+const index$1 = require('./index-12d54921.js');
 const index = require('./index-6dc29195.js');
 function toInteger(dirtyNumber) {
@@ -3451,7 +3451,7 @@ var locale = {
 };
 const ptBR = locale;
-const curaCalendarCss = ":host{display:block;width:var(--width);min-width:var(--min-width);max-width:var(--max-width);margin:0 auto}:host .calendar{display:flex;flex-direction:column;gap:5px;width:var(--width);min-width:var(--min-width);max-width:var(--max-width);border-radius:4px;overflow:hidden;background:#fff;font-family:var(--font-family)}:host .calendar.embedded{border:2px solid var(--neutral-light);padding:0px 12px 12px 12px}:host .calendar.floating{box-shadow:0 4px 8px var(--neutral-light)}:host .header{position:relative;padding:12px 0}:host .header::after{content:\"\";position:absolute;bottom:0;left:2px;right:2px;border-bottom:2px dotted var(--neutral-light)}:host .month-year{display:flex;padding:12px 8px;justify-content:space-between;align-self:stretch}:host .month-year.dropdown{padding:0%}:host .select{display:flex;padding:7px 10px 0px;justify-content:center;align-items:center;gap:6px;flex:1 0 0}:host .drop-month{display:flex;max-width:118px;padding:0px;align-items:flex-start;gap:0px;flex:1 0 0}:host .drop-year{display:flex;min-width:80px;max-width:85px;padding:0px;align-items:flex-start;gap:0px;flex:1 0 0}:host .days-of-week{display:flex;height:30px;padding:4px;justify-content:center;align-items:center;gap:4px;flex-shrink:0}:host .day{flex:1;text-align:center}:host .dates{display:flex;flex-wrap:wrap;align-items:center;align-self:stretch;gap:0}:host .icon{cursor:pointer;position:relative;overflow:hidden;border-radius:50%}:host .icon.dropdown{margin-top:10px}:host .icon::before{content:\"\";position:absolute;border-radius:50%;top:50%;left:50%;width:20px;height:20px;background:var(--accent-base);transform:translate(-50%, -50%) scale(0);transition:transform 0.2s ease}:host .icon:active::before{transform:translate(-50%, -50%) scale(1)}:host .icon:active{transform:scale(1)}:host .collapsed-container{text-align:center;position:relative;display:flex;align-items:center;justify-content:center;padding-top:10px}:host .collapsed-container::before{content:\"\";position:absolute;bottom:0;top:0;left:2px;right:2px;border-top:2px dotted var(--neutral-light)}:host .date{display:flex;justify-content:center;align-items:center;height:auto;width:14.2857142857%;aspect-ratio:1;font-size:14px;cursor:pointer;position:relative;box-sizing:border-box;text-align:center;flex-shrink:0}:host .date.today{border:2px solid var(--primary-darker);border-radius:50%;color:var(--primary-darker)}:host .date.selected,:host .date.default-dates{color:var(--neutral-black) !important;background:var(--accent-base);border-radius:50%;border:none}:host .date.invalid{color:var(--neutral-dark) !important;cursor:not-allowed}:host .date.invalid:hover{background:none;box-shadow:none}:host .date.valid{color:var(--primary-darker);font-weight:var(--font-weight-bold)}:host .date.range.start{border-radius:50% 0 0 50%;color:var(--primary-darker) !important;background:var(--accent-base)}:host .date.range.interval{border-radius:0;background-color:var(--accent-light);color:var(--neutral-black)}:host .date.range.interval.today{border:none}:host .date.range.end{border-radius:0 50% 50% 0;color:var(--primary-darker) !important;background:var(--accent-base)}:host .date:hover{background:var(--accent-light);border-radius:50%;color:var(--neutral-black)}:host select,:host input{width:60px;font-size:16px;box-shadow:0 2px 2px var(--neutral-black);padding:5px;border-radius:4px;border:1px solid #ccc;background:#f7f7f7}.teste{width:100%}";
+const curaCalendarCss = ":host{display:block;width:var(--width);min-width:var(--min-width);max-width:var(--max-width);margin:0 auto}:host .calendar{display:flex;flex-direction:column;gap:5px;width:var(--width);min-width:var(--min-width);max-width:var(--max-width);border-radius:4px;overflow:hidden;background:#fff;font-family:var(--font-family)}:host .calendar.embedded{border:2px solid var(--neutral-light);padding:0px 12px 12px 12px}:host .calendar.floating{box-shadow:0 4px 8px var(--neutral-light)}:host .header{position:relative;padding:12px 0}:host .header::after{content:\"\";position:absolute;bottom:0;left:2px;right:2px;border-bottom:2px dotted var(--neutral-light)}:host .month-year{display:flex;padding:12px 8px;justify-content:space-between;align-self:stretch}:host .month-year.dropdown{padding:0%}:host .select{display:flex;padding:7px 10px 0px;justify-content:center;align-items:center;gap:6px;flex:1 0 0}:host .drop-month{display:flex;max-width:118px;padding:0px;align-items:flex-start;gap:0px;flex:1 0 0}:host .drop-year{display:flex;min-width:80px;max-width:85px;padding:0px;align-items:flex-start;gap:0px;flex:1 0 0}:host .days-of-week{display:flex;height:30px;padding:4px;justify-content:center;align-items:center;gap:4px;flex-shrink:0}:host .day{flex:1;text-align:center}:host .dates{display:flex;flex-wrap:wrap;align-items:center;align-self:stretch;gap:0}:host .icon{cursor:pointer;position:relative;overflow:hidden;border-radius:50%}:host .icon.dropdown{margin-top:10px}:host .icon::before{content:\"\";position:absolute;border-radius:50%;top:50%;left:50%;width:20px;height:20px;background:var(--primary-base);transform:translate(-50%, -50%) scale(0);transition:transform 0.2s ease}:host .icon:active::before{transform:translate(-50%, -50%) scale(1)}:host .icon:active{transform:scale(1)}:host .collapsed-container{text-align:center;position:relative;display:flex;align-items:center;justify-content:center;padding-top:10px}:host .collapsed-container::before{content:\"\";position:absolute;bottom:0;top:0;left:2px;right:2px;border-top:2px dotted var(--neutral-light)}:host .date{display:flex;justify-content:center;align-items:center;height:auto;width:14.2857142857%;aspect-ratio:1;font-size:14px;cursor:pointer;position:relative;box-sizing:border-box;text-align:center;flex-shrink:0}:host .date.today{border:2px solid var(--primary-darker);border-radius:50%;color:var(--primary-darker)}:host .date.selected{color:var(--select-label) !important;background:var(--primary-base);border-radius:50%}:host .date.default-dates{color:var(--neutral-white);background:var(--primary-base);border-radius:50%;border:none}:host .date.invalid{color:var(--neutral-dark) !important;cursor:not-allowed}:host .date.invalid:hover{background:none;box-shadow:none}:host .date.valid{color:var(--primary-darker);font-weight:var(--font-weight-bold)}:host .date.range.start{border-radius:50% 0 0 50%;color:var(--select-label) !important;background:var(--primary-base)}:host .date.range.interval{border-radius:0;background:var(--primary-lighter);color:var(--neutral-black) !important}:host .date.range.interval.today{border:none}:host .date.range.end{border-radius:0 50% 50% 0;color:var(--select-label) !important;background:var(--primary-base)}:host .date:hover{background:var(--primary-lighter);border-radius:50%;color:var(--neutral-white)}:host select,:host input{width:60px;font-size:16px;box-shadow:0 2px 2px var(--neutral-black);padding:5px;border-radius:4px;border:1px solid #ccc;background:#f7f7f7}";
 const CuraCalendarStyle0 = curaCalendarCss;
 const CuraCalendar = class {
@@ -3479,6 +3479,7 @@ const CuraCalendar = class {
         this.collapsed = null;
         this.floating = undefined;
         this.embedded = undefined;
+        this.selectLabelColorMode = 'light';
         this.currentDate = new Date();
         this.selectedDates = [];
         this.rangeStart = null;
@@ -3491,12 +3492,15 @@ const CuraCalendar = class {
         this.setFontProperties();
         this.initializeDefaultDates();
         const colors = [
-            { name: '--accent-base', theme: 'accent-base' },
-            { name: '--accent-light', theme: 'accent-light' },
+            { name: '--primary-base', theme: 'primary-base' },
+            { name: '--primary-lighter', theme: 'primary-lighter' },
+            { name: '--primary-light', theme: 'primary-light' },
             { name: '--neutral-black', theme: 'neutral-black' },
             { name: '--primary-darker', theme: 'primary-darker' },
             { name: '--neutral-dark', theme: 'neutral-dark' },
             { name: '--neutral-light', theme: 'neutral-light' },
+            { name: '--neutral-white', theme: 'neutral-white' },
+            { name: '--select-label', theme: this.selectLabelColorMode === 'dark' ? 'neutral-black' : 'neutral-white' },
         ];
         colors.forEach(color => (this.styles = Object.assign(Object.assign({}, this.styles), { [color.name]: this.theme.colors.getColor(color.theme) })));
     }
@@ -3906,7 +3910,7 @@ const CuraCalendar = class {
     }
     render() {
         const { months } = this.fetchMonthNames();
-        return (index$1.h(index$1.Host, { key: '859c5f15de173c774dc9f8a88792845741b665e2', style: this.getHostCSSProperties() }, index$1.h("div", { key: '5838783d7ecb5b2258ef7ef73ba32ca7ddbad470', class: `calendar ${this.floating ? 'floating' : ''} ${this.embedded ? 'embedded' : ''}`, style: this.styles }, index$1.h("header", { key: '16245dbb73d9d0a277891b3853f451b89acccc35', class: "header" }, index$1.h("div", { key: '9a22c4386363642fa7219edebd9e9a5cfb5220aa', class: `month-year ${this.type === 'dropdown' && 'dropdown'}` }, index$1.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' ? (index$1.h("div", { class: "select" }, index$1.h("cura-select", { size: "small", class: "drop-month", mode: "transparent", value: months[getMonth(this.currentDate)], onSelected: e => this.onMonthDropdownChange(e) }, months.map((month, index) => (index$1.h("cura-select-option", { size: "xsmall", key: index, value: month }, month)))), index$1.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) => (index$1.h("cura-select-option", { key: index, value: year.toString() }, year.toString())))))) : (index$1.h("cura-label", { color: "neutral-black", size: "large" }, months[getMonth(this.currentDate)].slice(0, 3), ", ", getYear(this.currentDate))), index$1.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') }))), index$1.h("span", { key: '40be6c876675cf43b42e214e30639e48873dc4bc', class: "days-of-week" }, this.fetchWeekDays().map((day, index) => (index$1.h("cura-label", { class: "day", size: "xsmall", color: "neutral-black", weight: "bold", key: index }, day === 'sab' ? 'SÁB' : day.toLocaleUpperCase())))), index$1.h("div", { key: '72cae6b30fa5b7d5e180b796458d1844aba27ea9', class: "dates" }, !this.collapsed
+        return (index$1.h(index$1.Host, { key: 'ae4a9147b11d95bbc2551b2ae090e94544e6dfff', style: this.getHostCSSProperties() }, index$1.h("div", { key: '84c22c868bbd9ccbfe6167b5162c8196ebd816a8', class: `calendar ${this.floating ? 'floating' : ''} ${this.embedded ? 'embedded' : ''}`, style: this.styles }, index$1.h("header", { key: 'ea6f883598de9a4ea1801c29eeaec1cf16ab74cc', class: "header" }, index$1.h("div", { key: 'e1f03e867a906d73e76245e669dbb8248e6f9d15', class: `month-year ${this.type === 'dropdown' && 'dropdown'}` }, index$1.h("cura-icon", { key: '81b9e1b8e20d611e3250bac789ed6b8ea1248d59', class: `icon ${this.type === 'dropdown' && 'dropdown'}`, name: "left", color: this.determinePrevButtonColor(), onClick: !this.collapsed ? () => this.updateCurrentMonth('prev') : () => this.updateCurrentWeek('prev') }), this.type === 'dropdown' ? (index$1.h("div", { class: "select" }, index$1.h("cura-select", { size: "small", class: "drop-month", mode: "transparent", value: months[getMonth(this.currentDate)], onSelected: e => this.onMonthDropdownChange(e) }, months.map((month, index) => (index$1.h("cura-select-option", { size: "xsmall", key: index, value: month }, month)))), index$1.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) => (index$1.h("cura-select-option", { key: index, value: year.toString() }, year.toString())))))) : (index$1.h("cura-label", { color: "neutral-black", size: "large" }, months[getMonth(this.currentDate)].slice(0, 3), ", ", getYear(this.currentDate))), index$1.h("cura-icon", { key: '5e1b1e265ceeb4910014ea637fdd6909d8cd1076', class: `icon ${this.type === 'dropdown' && 'dropdown'}`, name: "right", color: "primary-base", onClick: !this.collapsed ? () => this.updateCurrentMonth('next') : () => this.updateCurrentWeek('next') }))), index$1.h("span", { key: '3cfb73b9e65e546526f30e25e440bf9235c01213', class: "days-of-week" }, this.fetchWeekDays().map((day, index) => (index$1.h("cura-label", { class: "day", size: "xsmall", color: "neutral-black", weight: "bold", key: index }, day === 'sab' ? 'SÁB' : day.toLocaleUpperCase())))), index$1.h("div", { key: 'b4a4a2cfbac55a1b965b1f52e4ac06e5fef2be54', class: "dates" }, !this.collapsed
             ? this.fetchDaysOfMonth().map((day, index) => (index$1.h("div", { key: index, class: this.getClasses(day), onClick: () => this.onDateClick(day) }, day ? format(day, 'd') : '')))
             : this.fetchDaysOfWeek().map((day, index) => (index$1.h("div", { key: index, class: this.getClasses(day), onClick: () => this.onDateClick(day) }, day ? format(day, 'd') : '')))), this.collapsed !== null ? (this.collapsed ? (index$1.h("div", { class: "collapsed-container" }, index$1.h("cura-button-transparent", { onClick: () => this.showNotColapsedCalendar(), size: "small", color: "primary", fontColor: "dark", iconName: "plusCircle" }, "Veja mais datas"))) : (index$1.h("div", { class: "collapsed-container" }, index$1.h("cura-button-transparent", { onClick: () => this.showColapsedCalendar(), size: "small", color: "primary", fontColor: "dark", iconName: "minusCircle" }, "Veja menos datas")))) : null)));
     }