@rededor/cura 1.2.0 → 1.3.0

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

@@ -1,3 +1,21 @@
+/**
+ * Global Spacing Definitions.
+ * Required CSS Properties:
+ * --base-spacing
+ */
+/* None: 0px */
+/* Tiny default: 4px */
+/* Mini default: 8px */
+/* XXXS default: 12px */
+/* XXS default: 16px */
+/* XS default: 20px */
+/* S default: 20px */
+/* M default: 32px */
+/* L default: 40px */
+/* XL default: 48px */
+/* XXL default: 64px */
+/* XXXL default: 72px */
+/* Huge default: 96px */
 :host {
   display: block;
   box-sizing: border-box;
@@ -5,8 +23,8 @@
 :host .conteiner {
   display: flex;
   box-sizing: border-box;
-  padding: 12px;
-  gap: 12px;
+  padding: calc(var(--base-spacing) * 3px);
+  gap: calc(var(--base-spacing) * 3px);
   flex-shrink: 0;
   border: 1px solid var(--color-base);
   border-radius: 4px;
@@ -15,16 +33,12 @@
 :host .conteiner.floating {
   box-shadow: 0px 4px 8px 0px rgba(38, 38, 38, 0.16);
 }
-:host .icon-left {
-  margin-right: 5px;
+:host .content {
+  flex: 1;
+  flex-direction: column;
+  display: flex;
+  gap: calc(var(--base-spacing) * 1px);
 }
 :host .icon-right {
-  margin-left: auto;
   cursor: pointer;
-}
-:host .text {
-  margin-top: 3px;
-}
-:host .actions {
-  margin-top: 5px;
 }

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

@@ -25,6 +25,7 @@ export class CuraAlert {
         this.styles = Object.assign({}, this.styles);
     }
     connectedCallback() {
+        this.styles['--base-spacing'] = window.CuraAPI.theme.spacing.getSpacing();
         this.setColors();
     }
     getClasses() {
@@ -43,7 +44,7 @@ export class CuraAlert {
         return this.icon ? this.icon : iconMapping[this.type];
     }
     render() {
-        return (h(Host, { key: 'c5398d59da323dee68eed1cb7c27841df0e12d14' }, h("div", { key: 'd9bb0ab7a2106e710a113513e6eeb1297b9bd205', class: this.getClasses(), style: this.styles }, h("cura-icon", { key: '54665c81a59cbca3686abc6f5e388da32e2211ed', name: this.getNameIcon(), class: "icon-left", size: 16, color: `${this.type}-dark` }), h("div", { key: '466f9f4aed5096658de1e19521cefe2915b095af', class: "content" }, h("cura-label", { key: '6b3d9cd0352b5d5254305baa5a71a1b1782f637f', class: "title", size: "small", color: "neutral-darker", weight: "bold" }, this.label), h("cura-paragraph", { key: '5dbad5e65d88b59a81b7df97154071a607d73900', class: "text", color: `${this.type}-darker`, size: "xsmall", marginBlock: "0", lineHeight: "133.33%" }, h("slot", { key: 'cb75d38c35d34a7bee4e187c640a1269bad192b0' })), h("div", { key: 'a6930bb463601a2ba429b23fad61847e8dee01f3', class: "actions" }, h("slot", { key: '7f4fc8b08a870f578d0b241df00650ebf3db83e0', name: "actions" }))), this.closeable ?
+        return (h(Host, { key: 'e8998ea87d6a1342f6907ac96d2ee73c9f2ef2ad' }, h("div", { key: '917a9c712631eb1f3af2caf3d9d1bbdb7390c239', class: this.getClasses(), style: this.styles }, h("cura-icon", { key: '406ec8e8ebbdcb7b634c26085785fb5e6943c23c', name: this.getNameIcon(), class: "icon-left", size: 16, color: `${this.type}-dark` }), h("div", { key: 'de416db715df6bf4335def85044564e51af97b2d', class: "content" }, this.label ? (h("cura-label", { class: "title", size: "small", color: "neutral-darker", weight: "bold" }, this.label)) : '', h("cura-paragraph", { key: '7c759da9b461769f01facda7b52faac4fad4ff86', class: "text", color: `${this.type}-darker`, size: "xsmall", marginBlock: "0", lineHeight: "133.33%" }, h("slot", { key: 'f71f45289c632acbe25c19db15de07b09ec395fe' })), h("slot", { key: 'd46e508a7da7579fc4aed665c9606d1d7a93ceb4', name: "actions" })), this.closeable ?
             (h("cura-icon", { name: "close", size: 16, color: "error-dark", class: "icon-right", onClick: this.handleClose }))
             : '')));
     }

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

@@ -1 +1 @@
-{"version":3,"file":"cura-alert.js","sourceRoot":"","sources":["../../../src/components/cura-alert/cura-alert.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Prop, Host, h, State, Watch, Event, EventEmitter } from '@stencil/core';\n@Component({\n  tag: 'cura-alert',\n  styleUrl: 'cura-alert.scss',\n  shadow: true,\n})\nexport class CuraAlert {\n  @Element() host: HTMLElement;\n\n  @Prop() type: 'info' | 'success' | 'warning' | 'error' = 'info';\n  @Prop({ reflect: true }) floating = false;\n  @Prop({ reflect: true }) label: string;\n  @Prop({ reflect: true }) closeable = true;\n  @Prop({ reflect: true }) icon: string;\n  @State()\n  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.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            <cura-label class=\"title\" size=\"small\" color=\"neutral-darker\" weight=\"bold\">\n              {this.label}\n            </cura-label>\n            <cura-paragraph class=\"text\" color={`${this.type}-darker`} size=\"xsmall\" marginBlock=\"0\" lineHeight=\"133.33%\">\n              <slot></slot>\n            </cura-paragraph>\n            <div class=\"actions\">\n              <slot name=\"actions\"></slot>\n            </div>\n          </div>\n          { this.closeable ?\n          (<cura-icon name=\"close\" size={16} color=\"error-dark\" class=\"icon-right\" onClick={this.handleClose}></cura-icon>)\n          : '' }\n        </div>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"cura-alert.js","sourceRoot":"","sources":["../../../src/components/cura-alert/cura-alert.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Prop, Host, h, State, Watch, Event, EventEmitter } from '@stencil/core';\n@Component({\n  tag: 'cura-alert',\n  styleUrl: 'cura-alert.scss',\n  shadow: true,\n})\nexport class CuraAlert {\n  @Element() host: HTMLElement;\n\n  @Prop() type: 'info' | 'success' | 'warning' | 'error' = 'info';\n  @Prop({ reflect: true }) floating = false;\n  @Prop({ reflect: true }) label: string;\n  @Prop({ reflect: true }) closeable = true;\n  @Prop({ reflect: true }) icon: string;\n\n  @State() styles = {};\n\n  @Event({ eventName: 'close' }) close: EventEmitter<void>;\n\n  @Watch('type')\n  setColors() {\n    const colors = [\n      { name: '--color-lighter', theme: `${this.type}-lighter` },\n      { name: '--neutral-black', theme: 'neutral-black' },\n      { name: '--color-light', theme: `${this.type}-light` },\n      { name: '--color-base', theme: `${this.type}-base` },\n    ];\n\n    colors.forEach(color => {\n      this.styles[color.name] = window.CuraAPI.theme.colors.getColor(color.theme);\n    });\n    this.styles = {...this.styles};\n  }\n\n  connectedCallback() {\n    this.styles['--base-spacing'] = window.CuraAPI.theme.spacing.getSpacing();\n    this.setColors();\n  }\n\n  getClasses() {\n    const classes = {};\n    classes['conteiner'] = true;\n    classes['floating'] = this.floating;\n    return classes;\n  }\n\n  getNameIcon() {\n    const iconMapping = {\n      info: 'infoCircle',\n      success: 'checkCircle',\n      warning: 'alertCircle',\n      error: 'alertTriangle',\n    };\n    return this.icon ? this.icon : iconMapping[this.type];\n  }\n\n  handleClose = () => {\n    this.close.emit();\n    this.host.remove();\n  };\n\n  render() {\n    return (\n      <Host>\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"]}

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

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

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

@@ -11,6 +11,7 @@
   gap: 5px;
   width: var(--width);
   min-width: var(--min-width);
+  max-width: var(--max-width);
   border-radius: 4px;
   overflow: hidden;
   background: #fff;

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

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

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

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

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

@@ -31,7 +31,7 @@ export class CuraIcon {
         this.host.style.setProperty(prop, value);
     }
     render() {
-        return (h(Host, { key: '8955586152a043a308ad539516973dba36bd145d' }, h("svg", { key: 'f383174620a5dcaa33d3d969a6cd57e814b96140', version: "1.1", viewBox: "0 0 24 24", preserveAspectRatio: "xMidYMid meet", xmlns: "http://www.w3.org/2000/svg" }, h("use", { key: '1f0550ed5a7826c7f7ef36ed34f45b3da4f4e80d', xlinkHref: `${this.assetsPath}/icons/iconset-${this.iconset}.svg#${this.name}` }))));
+        return (h(Host, { key: '0ab55b86ccb41c3be1c1a114c35c81d8488e12cc' }, h("svg", { key: 'c787e2ff356af580215cef7c05225ef5ac716d21', version: "1.1", viewBox: "0 0 24 24", preserveAspectRatio: "xMidYMid meet", xmlns: "http://www.w3.org/2000/svg" }, h("use", { key: '71c4f67a6d50cd2112fcef7cbac7b506d662911e', xlinkHref: `${this.assetsPath}/icons/iconset-${this.iconset}.svg#${this.name}` }))));
     }
     static get is() { return "cura-icon"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/cura-icons-view/cura-icons-view.js

@@ -14,9 +14,9 @@ export class CuraIconsView {
         this.sizes.unshift(this.sizes.pop());
     }
     render() {
-        return (h(Host, { key: '578795eda26d68314425907d7d4b0716eae31677' }, h("div", { key: '1cabf7e4ad314bbcb93d86c4ad22e5d8d69e2f81', class: "iconDetail" }, h("cura-heading", { key: '154ada215d4a13b674870c7b3ac85cb2b2c96873', size: "small", "margin-block": "0 24px" }, "Icon: ", h("b", { key: '84b323f4f81831142ccb51109a2bcbbe8748c8e9' }, this.selected)), h("div", { key: '71ee5a42938cc43014e4b306460ab03ed03a8d2d', class: "iconSizes" }, this.sizes.map(size => size === 'micro' && !microIcons.includes(this.selected) ? '' :
-            h("div", { class: "size" }, h("cura-icon", { name: this.selected, size: size }), h("span", null, size)))), h("div", { key: 'f0ce668720e9897ea8abcd4c105fed555d0537dc', class: "iconSizes invert" }, this.sizes.map(size => size === 'micro' && !microIcons.includes(this.selected) ? '' :
-            h("div", { class: "size" }, h("cura-icon", { name: this.selected, size: size, color: "neutral-white" }), h("span", null, size))))), h("div", { key: '2c2a0f8f18eff3da6b4379e9549683f4daf2755d', class: "icons" }, iconsetdefaulticons.map(icon => h("div", { class: { icon: true, selected: icon === this.selected }, onClick: () => this.setSelected(icon) }, h("cura-icon", { name: icon, size: "32", color: icon === this.selected ? 'accent-dark' : 'neutral-dark' }), h("cura-label", { size: "xsmall", weight: icon === this.selected ? 'bold' : 'regular', color: icon === this.selected ? 'accent-dark' : 'neutral-dark' }, icon), !microIcons.includes(icon) ? '' :
+        return (h(Host, { key: '8852f24d59f30c812ac2e05be38bba10bccb1fd8' }, h("div", { key: '6b88398ca80b05a62681d7b6834d5d0f59d790fa', class: "iconDetail" }, h("cura-heading", { key: '5b3cab1aa26adc1b1b09dc3f3f5c0bd2ac394f89', size: "small", "margin-block": "0 24px" }, "Icon: ", h("b", { key: 'eb974ce78dd33e56cd2c6118c6c399f029660547' }, this.selected)), h("div", { key: '46d600bbf0903861f5c982b0e73c4757447d0324', class: "iconSizes" }, this.sizes.map(size => size === 'micro' && !microIcons.includes(this.selected) ? '' :
+            h("div", { class: "size" }, h("cura-icon", { name: this.selected, size: size }), h("span", null, size)))), h("div", { key: '973355e41f1a10405c8224461625215aedabe0e3', class: "iconSizes invert" }, this.sizes.map(size => size === 'micro' && !microIcons.includes(this.selected) ? '' :
+            h("div", { class: "size" }, h("cura-icon", { name: this.selected, size: size, color: "neutral-white" }), h("span", null, size))))), h("div", { key: 'acd2b60eb99238893fc97aa177e96f43a3c54bd1', class: "icons" }, iconsetdefaulticons.map(icon => h("div", { class: { icon: true, selected: icon === this.selected }, onClick: () => this.setSelected(icon) }, h("cura-icon", { name: icon, size: "32", color: icon === this.selected ? 'accent-dark' : 'neutral-dark' }), h("cura-label", { size: "xsmall", weight: icon === this.selected ? 'bold' : 'regular', color: icon === this.selected ? 'accent-dark' : 'neutral-dark' }, icon), !microIcons.includes(icon) ? '' :
             h("cura-paragraph", { color: 'success-dark', size: "xsmall", "margin-block": "0px", "line-height": '100%' }, "MICRO"))))));
     }
     static get is() { return "cura-icons-view"; }

package/dist/collection/components/cura-page-template/cura-page-template.js

@@ -14,7 +14,7 @@ export class CuraPageTemplate {
         return classes;
     }
     render() {
-        return (h(Host, { key: 'ab4b10fe60c2d8cac394e1d4ab9e9415901e5e80' }, h("div", { key: 'bb1136f5c7dff53c8de05a1e4c2a0a16416f1c6e', style: this.styles, class: "grid-template" }, h("div", { key: 'eab90c228293eb3213380d8f2d74231dce0a3723', id: "sub-header" }, h("slot", { key: '5857d627c6038ada32dacd9840fd51f002245215', name: 'sub-header' })), h("div", { key: '9ebdd52e3f31f24b5a45c855539ee5c68f16b099', id: "header" }, h("slot", { key: 'ea50789c8628109a2d599f2a8a94dc3ac54f8b43', name: 'header' })), h("div", { key: 'c37250f3054ba97f31f6b6cff428ffbdf96869e9', id: "pre-content" }, h("slot", { key: 'e2c81d9af2c587356b26eaff85dec7318ddf52e2', name: 'pre-content' })), h("div", { key: 'ddd4aa8338ce668e42511b38d6b5ee8012f01c5b', id: "content-container", class: this.getClasses() }, h("div", { key: '31ebabdf53749aec5b526308b063f3c2c0d4821b', id: "sidebar-left" }, h("slot", { key: '01a4ce493250b17e7bef8c173bc66a10217f2f53', name: 'sidebar-left' })), h("div", { key: 'bde5a719d07f67230a56192ecc412721ff4d36bb', id: "content" }, h("slot", { key: '3cf647a29db3e59ccc7827f3ec01d55fa0a90109', name: "content" }), h("slot", { key: '8f8d9b784f5d65bbedace6378f7df09cc659968a' })), h("div", { key: '1dd69a2f8d28faa4a204d024b5884bd4ec37bf42', id: "sidebar-right" }, h("slot", { key: '4052cf77ae1be773f58a0b9c6bf39960591e1aa8', name: 'sidebar-right' }))), h("div", { key: '76188d32df6addc6f41018ba2bcb869b0811eaf2', id: "post-body" }, h("slot", { key: 'a9aa2d75a63a204ff2e24f525e9a4cbbacbb2dfa', name: 'post-body' })), h("div", { key: 'bd12d4cc7c2cde9428565899f0f89aaf6eaee04c', id: "footer" }, h("slot", { key: '3797061c1debbe0f415771def9068e56c96f9a5a', name: 'footer' })), h("div", { key: 'b5f292bd394bebc7394769827730daa4496c66b2', id: "sub-footer" }, h("slot", { key: '20f8a50ea6c385a2c4348508c2aab8558d3139cf', name: 'sub-footer' })))));
+        return (h(Host, { key: 'cc20723aa41b91ea1dc91ea638988b1758295194' }, h("div", { key: '77a47c8042fde17042614e9dfa451418f5599203', style: this.styles, class: "grid-template" }, h("div", { key: 'b6364534caa10c454c88cb0bee0cb15d5f5b3290', id: "sub-header" }, h("slot", { key: 'e9e8232ea90df3a7a9b41077c11b7471958b31ea', name: 'sub-header' })), h("div", { key: 'b5407cdf0d167f65a41c27b3056dffb8963f9494', id: "header" }, h("slot", { key: '75ca70a52852ba84507d836e20c3cd6e49b5ed7e', name: 'header' })), h("div", { key: 'b1a18551c7c91f0356a909d0187654af7cacfd9c', id: "pre-content" }, h("slot", { key: '46c5d27c42f0082115ed56b00ee5d9537a16b351', name: 'pre-content' })), h("div", { key: '9f9c30b4057d00cc026509eba99b8b066285f518', id: "content-container", class: this.getClasses() }, h("div", { key: '74c71d693d351e38183b501ab1ed955b1120bd13', id: "sidebar-left" }, h("slot", { key: 'f09fd413d695cb57cbdeba49192d0230dddb51ca', name: 'sidebar-left' })), h("div", { key: '60d8785cf429bbdc94132517707d672afa7cfca3', id: "content" }, h("slot", { key: 'd440f897831ff64fb3bed669728bf6d8c557037c', name: "content" }), h("slot", { key: '0e7fbe336f24608d80e7eda07869f58faf98c121' })), h("div", { key: 'e92ffc7632e10b98c25ea8f3dbe854bbdbd225a8', id: "sidebar-right" }, h("slot", { key: '9c9a8887643a1967df21c1d6625266ea119e828b', name: 'sidebar-right' }))), h("div", { key: '9ee23371a9d003db9ebb8b2f2d1803e71da01bd7', id: "post-body" }, h("slot", { key: '449fdc120956fd36f1fe71a7a5f2855a09baa9b3', name: 'post-body' })), h("div", { key: '31bc1a11a0152628a6bff3fee1b2cf739ef7cd82', id: "footer" }, h("slot", { key: '680ac49ea86a4945c13e52e8236e384d20a2867c', name: 'footer' })), h("div", { key: '1aebe595604aadc3b31e467d71532dd9d93301bf', id: "sub-footer" }, h("slot", { key: '58a2d0cebc85f73d09980b6daf8a04e7fceac133', name: 'sub-footer' })))));
     }
     static get is() { return "cura-page-template"; }
     static get encapsulation() { return "shadow"; }

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

@@ -21,7 +21,7 @@ export class CuraToast {
         this.setStyle();
     }
     render() {
-        return (h(Host, { key: 'b875e88d00075a71d6052563a45849f0b3124f13' }, h("div", { key: 'e766c7a687ec1f9ad943dc4e2ebb87c100da5b71', class: this.getClasses(), style: this.styles }, h("cura-icon", { key: '9379419d8403c5c7b14182bb136cd3375f8aa09a', class: "default-icon", name: this.getNameIcon(), size: 16, color: `${this.type}-dark` }), h("div", { key: '38f2a177984d826209d6fbdc9ad3036ef02a1825', class: "content" }, h("cura-heading", { key: 'a4fd1cce18d6208daa527b8da5687b47fbb59968', level: 4, size: "xsmall", color: `${this.type}-dark`, weight: "bold", "margin-block": "0" }, this.label), h("cura-paragraph", { key: 'fb803bbcbe47f1d2eca897ca5679d71294fe59ab', color: `${this.type}-darker`, size: "xsmall", marginBlock: "0", lineHeight: "133.33%" }, h("slot", { key: '9ea56d9f87a423b109945cd4cf4078347a9fc1e9' })), h("slot", { key: '045b4ae11997260832288428df6672be6e918730', name: "actions" })), this.closeButton && h("cura-icon", { key: 'e326bb7786f60c95bed9d910e46f47bb4273bb7b', class: "close-icon", name: "close", size: 16, color: "error-dark", onClick: this.handleClose }), this.loader && !!this.autoCloseDelay && h("cura-loader-bar", { key: 'bf1d59681ac35d79fe240777e5d5424ee2b4a4e7', color: `${this.type}-base`, progress: this.progress }))));
+        return (h(Host, { key: 'eb867953a8c56ae385b1226686cbe1b1e9df4318' }, h("div", { key: 'c901632a6fb414c981b5c149fdd7081306ae1130', class: this.getClasses(), style: this.styles }, h("cura-icon", { key: '98c9a49501c71ee60c6ae1d783bba11d5bdce999', class: "default-icon", name: this.getNameIcon(), size: 16, color: `${this.type}-dark` }), h("div", { key: '19b2e0bd0d816e94f3b9d1f113f4b833e770cee3', class: "content" }, h("cura-heading", { key: '17ed67e5b531b45b94f8dbc7d65675f7a57308f9', level: 4, size: "xsmall", color: `${this.type}-dark`, weight: "bold", "margin-block": "0" }, this.label), h("cura-paragraph", { key: 'dd90e612d924dff9b3e9896dc29cef2541ae51af', color: `${this.type}-darker`, size: "xsmall", marginBlock: "0", lineHeight: "133.33%" }, h("slot", { key: '33cd9c1dd10ae6d3ebd857fab5c70ca7151f8a1b' })), h("slot", { key: '12d18bd482b957cdc5ee7a4fab20bdffe6bc647d', name: "actions" })), this.closeButton && h("cura-icon", { key: '3a83cdd43c6c11587013111c29673f916509b165', class: "close-icon", name: "close", size: 16, color: "error-dark", onClick: this.handleClose }), this.loader && !!this.autoCloseDelay && h("cura-loader-bar", { key: '13ec00fd7146119e9eab81ed6d52b1020d1eb1e8', color: `${this.type}-base`, progress: this.progress }))));
     }
     componentDidLoad() {
         this.openContainer();

package/dist/collection/components/cura-tooltip/cura-tooltip.css

@@ -0,0 +1,159 @@
+/* Breakpoints variables */
+/**
+ * Responsive media for mobile (small) only.
+ * Use: @include mobile-only() { ... }
+ */
+/**
+ * Responsive media for medium only.
+ * Use: @include medium-only() { ... }
+ */
+/**
+ * Responsive media for large only.
+ * Use: @include large-only() { ... }
+ */
+/**
+ * Responsive media for xlarge only.
+ * Use: @include xlarge-only() { ... }
+ */
+/**
+ * Responsive media for medium to large.
+ * Use: @include medium-large() { ... }
+ */
+/**
+ * Responsive media for large and up.
+ * Use: @include large-up() { ... }
+ */
+/**
+ * Global Shadow Level Definitions.
+ * Required CSS Properties with respective opacities:
+ * --neutral-black,
+ * --neutral-purewhite,
+ * --accent-base
+ * --primary-base
+ */
+/**
+ * Shadow Level base definitions.
+ * Required CSS Properties: --neutral-purewhite opacity: 0.2
+ * Use: @include shadow-level1(){ ... }
+ */
+/**
+ * Shadow Level base definitions.
+ * Required CSS Properties: --neutral-black opacity: 0.16
+ * Use: @include shadow-level2(--neutral-black-shadow){ ... }
+ */
+/**
+ * Shadow Level base definitions.
+ * Required CSS Properties: --neutral-black opacity: 0.16
+ * Use: @include shadow-level3(--neutral-black-shadow){ ... }
+ */
+/**
+ * Shadow Level base definitions.
+ * Required CSS Properties: --neutral-black opacity: 0.12
+ * Use: @include shadow-level4(){ ... }
+ */
+/**
+ * Shadow Level base definitions.
+ * Required CSS Properties: --neutral-black opacity: 0.8
+ * Use: @include shadow-level5(){ ... }
+ */
+/**
+ * Shadow Level base definitions.
+ * Required CSS Properties: --accent-base opacity: 0.2
+ * Use: @include shadow-level5-accent(){ ... }
+ */
+/**
+ * Shadow Level base definitions.
+ * Required CSS Properties: --primary-base opacity: 0.16
+ * Use: @include shadow-level3-primary(){ ... }
+ */
+/**
+ * Global Spacing Definitions.
+ * Required CSS Properties:
+ * --base-spacing
+ */
+/* None: 0px */
+/* Tiny default: 4px */
+/* Mini default: 8px */
+/* XXXS default: 12px */
+/* XXS default: 16px */
+/* XS default: 20px */
+/* S default: 20px */
+/* M default: 32px */
+/* L default: 40px */
+/* XL default: 48px */
+/* XXL default: 64px */
+/* XXXL default: 72px */
+/* Huge default: 96px */
+:host {
+  position: absolute;
+  z-index: 99999;
+  display: block;
+  width: fit-content;
+  height: fit-content;
+  box-sizing: border-box;
+}
+@media (max-width: 768px) {
+  :host {
+    width: 100%;
+  }
+}
+:host .container {
+  display: flex;
+  box-sizing: border-box;
+  max-width: var(--max-width);
+  height: auto;
+  padding: calc(var(--base-spacing) * 2px);
+  border: 1px solid var(--neutral-light);
+  border-radius: calc(var(--base-spacing) * 1px);
+  background-color: var(--neutral-purewhite);
+  box-shadow: 0px 4px 8px 0px var(--neutral-black-shadow, rgba(38, 38, 38, 0.16));
+}
+@media (max-width: 768px) {
+  :host .container {
+    max-width: 90%;
+    height: fit-content;
+    padding: calc(var(--base-spacing) * 4px) calc(var(--base-spacing) * 4px) 0 calc(var(--base-spacing) * 4px);
+    margin: 0 auto;
+    border: 2px solid;
+    border-radius: calc(var(--base-spacing) * 3px) calc(var(--base-spacing) * 3px) 0 0;
+    border-color: var(--neutral-light) var(--neutral-light) transparent var(--neutral-light);
+  }
+}
+:host .container::after {
+  content: "";
+  position: absolute;
+  z-index: 99999;
+  width: calc(var(--base-spacing) * 2.5px);
+  height: calc(var(--base-spacing) * 2.5px);
+  border: 1px solid;
+  border-radius: 2px;
+  background-color: var(--neutral-purewhite);
+  left: var(--arrow-left);
+  top: var(--arrow-top);
+  border-color: var(--arrow-border-color);
+  transform: var(--arrow-translate) rotate(45deg);
+}
+@media (max-width: 768px) {
+  :host .container::after {
+    display: none;
+  }
+}
+:host .container .content {
+  flex: 1 1 0;
+  display: flex;
+  flex-direction: column;
+  gap: calc(var(--base-spacing) * 1px);
+}
+@media (max-width: 768px) {
+  :host .container .content {
+    padding-bottom: calc(var(--base-spacing) * 4px);
+    border-bottom: 1px dashed var(--neutral-light);
+  }
+}
+:host .container .close-icon {
+  margin-left: calc(var(--base-spacing) * 3px);
+  cursor: pointer;
+}
+:host .container .close-button {
+  padding: calc(var(--base-spacing) * 2px) 0;
+}