@rededor/cura 1.4.0-alpha.0 → 1.4.0

package/dist/cura/p-f23c4ed8.entry.js

@@ -0,0 +1,2 @@
+import{r as a,c as e,h as t,H as i}from"./p-fd5ed6b0.js";const o=":host{display:block}.modal{position:fixed;height:100%;width:100%;top:var(--top-offset);bottom:var(--bottom-offset);left:var(--left-offset);right:var(--right-offset);z-index:-1;margin-top:var(--offset-top)}.modal.open{z-index:100}.modal.open .backdrop,.modal.open .wrapper{opacity:1;visibility:visible;animation:fadeIn 0.3s ease-out}.container{display:flex;align-items:center;justify-content:center}.backdrop,.wrapper{opacity:0;visibility:hidden;transition:opacity 0.3s ease, visibility 0.3s ease}.backdrop{background-color:var(--background-color);z-index:90;animation:fadeIn 0.3s ease-out}.wrapper{position:fixed;background-color:var(--neutral-white);border:2px solid var(--neutral-light);border-radius:calc(var(--base-spacing) * 3px);width:700px;max-width:600px;min-width:200px;padding:0px calc(var(--base-spacing) * 4px) calc(var(--base-spacing) * 4px) calc(var(--base-spacing) * 4px);z-index:100;box-shadow:0px 8px 16px 0px var(--neutral-black-shadow-4, rgba(38, 38, 38, 0.12));transform:scale(0.95);transition:transform 0.3s ease-out, opacity 0.3s ease, visibility 0.3s ease}.wrapper ::slotted(*){max-height:80vh;overflow:auto;padding-right:calc(var(--base-spacing) * 5px)}.modal.open .wrapper{transform:scale(1);opacity:1;visibility:visible}.close{justify-self:flex-end;padding-top:calc(var(--base-spacing) * 4px);background:none;border:none;cursor:pointer}.close.mobile{display:none}.close.desktop{display:flex}@media (max-width: 768px){.wrapper{position:fixed;bottom:0px;width:80%;padding-top:calc(var(--base-spacing) * 4px);padding-bottom:0px;border-radius:calc(var(--base-spacing) * 3px) calc(var(--base-spacing) * 3px) 0px 0px;border-bottom:none}.close{align-items:center;border-top:1px dashed var(--neutral-light);margin-top:calc(var(--base-spacing) * 4px);padding:calc(var(--base-spacing) * 4px) 0px;justify-content:center;width:100%}.close.mobile{display:flex;gap:calc(var(--base-spacing) * 2px)}.close.desktop{display:none}}@keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes fadeOut{from{opacity:1}to{opacity:0}}";const s=o;const r=class{constructor(t){a(this,t);this.modalClose=e(this,"modalClose",7);this.handleClose=()=>{this.modalClose.emit();this.open=false};this.open=false;this.background="light";this.top=0;this.bottom=0;this.left=0;this.right=0;this.styles={}}setColors(){const a={dark:window.CuraAPI.theme.colors.getColor("neutral-black",.4),light:window.CuraAPI.theme.colors.getColor("primary-darker",.8)};this.styles=Object.assign(Object.assign({},this.styles),{"--background-color":a[this.background]})}setOffset(a,e){this.styles=Object.assign(Object.assign({},this.styles),{[`--${a}-offset`]:`${e}px`})}setTop(){this.setOffset("top",this.top)}setBottom(){this.setOffset("bottom",this.bottom)}setLeft(){this.setOffset("left",this.left)}setRight(){this.setOffset("right",this.right)}connectedCallback(){this.styles=Object.assign(Object.assign({},this.styles),{"--neutral-white":window.CuraAPI.theme.colors.getColor("neutral-white"),"--neutral-light":window.CuraAPI.theme.colors.getColor("neutral-light"),"--base-spacing":window.CuraAPI.theme.spacing.getSpacing()});this.setColors();this.setTop();this.setBottom();this.setLeft();this.setRight()}render(){return t(i,{key:"5061e0536f1f06ae425a810fc15eb85d36caa271",role:"dialog","aria-modal":"true"},t("div",{key:"2afc242ddb391923dccfb6adc218179d32ee85e3",class:this.open?"modal container open":"modal container",style:this.styles},t("div",{key:"5cf4d0d0817e23774984991467b8a34297f47336",class:this.open?"modal backdrop open":"modal backdrop",onClick:this.handleClose}),t("div",{key:"ba6a2679ce03c87c88e42c4f28616ab9afc09116",class:"wrapper"},t("button",{key:"cc3126fa311ef7eb75dbdb56468d7b53af13740c",class:"close desktop",onClick:this.handleClose},t("cura-icon",{key:"b116480ab348f69fafbbc5e8bef7ee5a43640b00",name:"close",color:"error-dark",size:"small"})),t("slot",{key:"7fd83b4991dee4e7cab92bf6e357efa4ce3c1d71"}),t("button",{key:"1351ba9d296c1362197496f336a20007cd6f45f0",class:"close mobile",onClick:this.handleClose},t("cura-icon",{key:"3d72c9f8981c380ab8ff19e4507497703011aece",name:"close",color:"error-dark",size:"16"}),t("cura-paragraph",{key:"77e1144a9edb1c20e34f9f7e02ea97264d525143",color:"error-dark",size:"small",marginBlock:"0"},"Fechar")))))}static get watchers(){return{background:["setColors"],top:["setTop"],bottom:["setBottom"],left:["setLeft"],right:["setRight"]}}};r.style=s;export{r as cura_modal};
+//# sourceMappingURL=p-f23c4ed8.entry.js.map

package/dist/cura/p-f23c4ed8.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["curaModalCss","CuraModalStyle0","CuraModal","this","handleClose","modalClose","emit","open","setColors","backgroundTheme","dark","window","CuraAPI","theme","colors","getColor","light","styles","Object","assign","background","setOffset","name","value","setTop","top","setBottom","bottom","setLeft","left","setRight","right","connectedCallback","spacing","getSpacing","render","h","Host","key","role","class","style","onClick","color","size","marginBlock"],"sources":["src/components/cura-modal/cura-modal.scss?tag=cura-modal&encapsulation=shadow","src/components/cura-modal/cura-modal.tsx"],"sourcesContent":["@import '../../../src/scss/mixins/spacing.scss';\n@import '../../../src/scss/mixins/shadows.scss';\n@import '../../../src/scss/mixins/responsive.scss';\n@import '../../../src/scss/mixins/animations.scss';\n\n:host {\n  display: block;\n}\n\n.modal {\n  position: fixed;\n  height: 100%;\n  width: 100%;\n  top: var(--top-offset);\n  bottom: var(--bottom-offset);\n  left: var(--left-offset);\n  right: var(--right-offset);\n  z-index: -1;\n  margin-top: var(--offset-top);\n\n  &.open {\n    z-index: 100;\n\n    .backdrop,\n    .wrapper {\n      opacity: 1;\n      visibility: visible;\n      animation: fadeIn 0.3s ease-out;\n    }\n  }\n}\n\n.container {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.backdrop,\n.wrapper {\n  opacity: 0;\n  visibility: hidden;\n  transition: opacity 0.3s ease, visibility 0.3s ease;\n}\n\n.backdrop {\n  background-color: var(--background-color);\n  z-index: 90;\n  animation: fadeIn 0.3s ease-out;\n}\n\n.wrapper {\n  position: fixed;\n  background-color: var(--neutral-white);\n  border: 2px solid var(--neutral-light);\n  border-radius: #{$spacing-xxxs};\n  width: 700px;\n  max-width: 600px;\n  min-width: 200px;\n  padding: #{$spacing-none} #{$spacing-xxs} #{$spacing-xxs} #{$spacing-xxs};\n  z-index: 100;\n\n  @include shadow-level4();\n\n  transform: scale(0.95);\n  transition: transform 0.3s ease-out, opacity 0.3s ease, visibility 0.3s ease;\n\n  ::slotted(*) {\n    max-height: 80vh;\n    overflow: auto;\n    padding-right: #{$spacing-xs};\n  }\n}\n\n.modal.open .wrapper {\n  transform: scale(1);\n  opacity: 1;\n  visibility: visible;\n}\n\n.close {\n  justify-self: flex-end;\n  padding-top: #{$spacing-xxs};\n  background: none;\n  border: none;\n  cursor: pointer;\n\n  &.mobile {\n    display: none;\n  }\n\n  &.desktop {\n    display: flex;\n  }\n}\n\n@include mobile-only() {\n  .wrapper {\n    position: fixed;\n    bottom: #{$spacing-none};\n    width: 80%;\n    padding-top: #{$spacing-xxs};\n    padding-bottom: #{$spacing-none};\n    border-radius: #{$spacing-xxxs} #{$spacing-xxxs} #{$spacing-none} #{$spacing-none};\n    border-bottom: none;\n  }\n\n  .close {\n    align-items: center;\n    border-top: 1px dashed var(--neutral-light);\n    margin-top: #{$spacing-xxs};\n    padding: #{$spacing-xxs} #{$spacing-none};\n    justify-content: center;\n    width: 100%;\n\n    &.mobile {\n      display: flex;\n      gap: #{$spacing-mini};\n    }\n\n    &.desktop {\n      display: none;\n    }\n  }\n}\n\n@include fadeIn();\n@include fadeOut();\n","import { Component, Event, EventEmitter, Host, Prop, State, Watch, h } from '@stencil/core';\n\n@Component({\n  tag: 'cura-modal',\n  styleUrl: 'cura-modal.scss',\n  shadow: true,\n})\nexport class CuraModal {\n  /**\n   * Property open to control modal visibility.\n   * Default: false\n   */\n  @Prop({ mutable: true, reflect: true }) open?: boolean = false;\n  /**\n   * Property background to control modal backdrop color.\n   * Default: light\n   */\n  @Prop() background?: 'dark' | 'light' = 'light';\n  /**\n   * Property top to control modal top position.\n   * Default: 0px\n   */\n  @Prop() top?: number = 0;\n  /**\n   * Property bottom to control modal bottom position.\n   * Default: 0px\n   */\n  @Prop() bottom?: number = 0;\n  /**\n   * Property left to control modal left position.\n   * Default: 0px\n   */\n  @Prop() left?: number = 0;\n  /**\n   * Property right to control modal right position.\n   * Default: 0px\n   */\n  @Prop() right?: number = 0;\n  /**\n   * Event close to handle modal close.\n   */\n  @Event({ eventName: 'modalClose' }) modalClose: EventEmitter<void>;\n\n  @State() styles = {};\n\n  @Watch('background')\n  setColors() {\n    const backgroundTheme = {\n      dark: window.CuraAPI.theme.colors.getColor('neutral-black', 0.4),\n      light: window.CuraAPI.theme.colors.getColor('primary-darker', 0.8),\n    };\n\n    this.styles = {\n      ...this.styles,\n      '--background-color': backgroundTheme[this.background],\n    };\n  }\n\n  setOffset(name: string, value: number) {\n    this.styles = {\n      ...this.styles,\n      [`--${name}-offset`]: `${value}px`,\n    };\n  }\n\n  @Watch('top')\n  setTop() {\n    this.setOffset('top', this.top);\n  }\n\n  @Watch('bottom')\n  setBottom() {\n    this.setOffset('bottom', this.bottom);\n  }\n\n  @Watch('left')\n  setLeft() {\n    this.setOffset('left', this.left);\n  }\n\n  @Watch('right')\n  setRight() {\n    this.setOffset('right', this.right);\n  }\n\n  connectedCallback() {\n    this.styles = {\n      ...this.styles,\n      '--neutral-white': window.CuraAPI.theme.colors.getColor('neutral-white'),\n      '--neutral-light': window.CuraAPI.theme.colors.getColor('neutral-light'),\n      '--base-spacing': window.CuraAPI.theme.spacing.getSpacing(),\n    };\n    this.setColors();\n    this.setTop();\n    this.setBottom();\n    this.setLeft();\n    this.setRight();\n  }\n\n  private handleClose = () => {\n    this.modalClose.emit();\n    this.open = false;\n  };\n\n  render() {\n    return (\n      <Host role=\"dialog\" aria-modal=\"true\">\n        <div class={this.open ? 'modal container open' : 'modal container'} style={this.styles}>\n          <div class={this.open ? 'modal backdrop open' : 'modal backdrop'} onClick={this.handleClose}></div>\n          <div class=\"wrapper\">\n            {/* Desktop button */}\n            <button class=\"close desktop\" onClick={this.handleClose}>\n              <cura-icon name=\"close\" color=\"error-dark\" size=\"small\"></cura-icon>\n            </button>\n            <slot></slot>\n            {/* Mobile button */}\n            <button class=\"close mobile\" onClick={this.handleClose}>\n              <cura-icon name=\"close\" color=\"error-dark\" size=\"16\"></cura-icon>\n              <cura-paragraph color=\"error-dark\" size=\"small\" marginBlock=\"0\">\n                Fechar\n              </cura-paragraph>\n            </button>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAe,o/DACrB,MAAAC,EAAeD,E,MCMFE,EAAS,M,gEA4FZC,KAAAC,YAAc,KACpBD,KAAKE,WAAWC,OAChBH,KAAKI,KAAO,KAAK,E,UAzFsC,M,gBAKjB,Q,SAKjB,E,YAKG,E,UAKF,E,WAKC,E,YAMP,E,CAGlB,SAAAC,GACE,MAAMC,EAAkB,CACtBC,KAAMC,OAAOC,QAAQC,MAAMC,OAAOC,SAAS,gBAAiB,IAC5DC,MAAOL,OAAOC,QAAQC,MAAMC,OAAOC,SAAS,iBAAkB,KAGhEZ,KAAKc,OAAMC,OAAAC,OAAAD,OAAAC,OAAA,GACNhB,KAAKc,QAAM,CACd,qBAAsBR,EAAgBN,KAAKiB,a,CAI/C,SAAAC,CAAUC,EAAcC,GACtBpB,KAAKc,OAAMC,OAAAC,OAAAD,OAAAC,OAAA,GACNhB,KAAKc,QAAM,CACd,CAAC,KAAKK,YAAgB,GAAGC,O,CAK7B,MAAAC,GACErB,KAAKkB,UAAU,MAAOlB,KAAKsB,I,CAI7B,SAAAC,GACEvB,KAAKkB,UAAU,SAAUlB,KAAKwB,O,CAIhC,OAAAC,GACEzB,KAAKkB,UAAU,OAAQlB,KAAK0B,K,CAI9B,QAAAC,GACE3B,KAAKkB,UAAU,QAASlB,KAAK4B,M,CAG/B,iBAAAC,GACE7B,KAAKc,OAAMC,OAAAC,OAAAD,OAAAC,OAAA,GACNhB,KAAKc,QAAM,CACd,kBAAmBN,OAAOC,QAAQC,MAAMC,OAAOC,SAAS,iBACxD,kBAAmBJ,OAAOC,QAAQC,MAAMC,OAAOC,SAAS,iBACxD,iBAAkBJ,OAAOC,QAAQC,MAAMoB,QAAQC,eAEjD/B,KAAKK,YACLL,KAAKqB,SACLrB,KAAKuB,YACLvB,KAAKyB,UACLzB,KAAK2B,U,CAQP,MAAAK,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,KAAK,SAAQ,aAAY,QAC7BH,EAAA,OAAAE,IAAA,2CAAKE,MAAOrC,KAAKI,KAAO,uBAAyB,kBAAmBkC,MAAOtC,KAAKc,QAC9EmB,EAAA,OAAAE,IAAA,2CAAKE,MAAOrC,KAAKI,KAAO,sBAAwB,iBAAkBmC,QAASvC,KAAKC,cAChFgC,EAAA,OAAAE,IAAA,2CAAKE,MAAM,WAETJ,EAAA,UAAAE,IAAA,2CAAQE,MAAM,gBAAgBE,QAASvC,KAAKC,aAC1CgC,EAAA,aAAAE,IAAA,2CAAWhB,KAAK,QAAQqB,MAAM,aAAaC,KAAK,WAElDR,EAAA,QAAAE,IAAA,6CAEAF,EAAA,UAAAE,IAAA,2CAAQE,MAAM,eAAeE,QAASvC,KAAKC,aACzCgC,EAAA,aAAAE,IAAA,2CAAWhB,KAAK,QAAQqB,MAAM,aAAaC,KAAK,OAChDR,EAAA,kBAAAE,IAAA,2CAAgBK,MAAM,aAAaC,KAAK,QAAQC,YAAY,KAAG,a","ignoreList":[]}

package/dist/cura/p-f5d45776.entry.js

@@ -0,0 +1,2 @@
+import{r as e,h as o,H as c}from"./p-fd5ed6b0.js";const r=":host{display:block;box-sizing:border-box;width:100%}cura-label{padding:12px 0px;border-bottom:1px solid var(--neutral-light)}";const a=r;const t=class{constructor(o){e(this,o)}render(){return o(c,{key:"ff083af27d3250e4722c6f238b80b33f739cb64c",slot:"dropdown-search-option"},o("cura-label",{key:"62e9b2a758e000eb1ce5e5a76c1e9e555b5a4c8c",color:"neutral-dark",size:"xsmall",lineHeight:"16px",marginBlock:"0"},o("slot",{key:"e96fd0daa9b210bdea256d88c17b6cc9c425c5bc"})))}};t.style=a;export{t as cura_dropdown_search_option_title};
+//# sourceMappingURL=p-f5d45776.entry.js.map

package/dist/esm/cura-accordion_12.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, h, H as Host, g as getElement, c as createEvent } from './index-747aad85.js';
 import { l as labelSizes } from './cura-button.definitions-617d3bad.js';
-import { m as microIcons, i as iconSizes } from './cura-icon.definitions-aaa4e80f.js';
+import { i as iconSizes } from './cura-icon.definitions-a892c0e2.js';
 
 const curaAccordionCss = ":host{display:block;color:var(--font-color);font-size:var(--font-size);font-size:var(--font-size);font-family:var(--font-family);font-weight:var(--font-weight-regular)}";
 const CuraAccordionStyle0 = curaAccordionCss;
@@ -226,7 +226,7 @@ const CuraButton = class {
     render() {
         const symbolColor = this.getSymbolColor();
         const labelSize = labelSizes[this.size] || labelSizes["default"];
-        return (h(Host, { key: '2831f74cc53bbadcaf1648c759090204cf3c20ea' }, this.href ? (h("a", { href: this.disabled ? '' : this.href, target: this.target, class: this.getClasses(), style: this.styles, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave() }, h("span", { class: "button-container" }, this.getIcon(), h("cura-label", { class: "label", size: labelSize, lineHeight: '105%', color: symbolColor }, h("slot", null))), h("cura-loader-circle", { size: this.size, color: symbolColor }))) : (h("button", { class: this.getClasses(), style: this.styles, disabled: this.disabled || null, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave(), type: this.type }, h("span", { class: "button-container" }, this.getIcon(), h("cura-label", { class: "label", size: labelSize, lineHeight: '105%', color: symbolColor }, h("slot", null))), h("cura-loader-circle", { size: this.size, color: symbolColor })))));
+        return (h(Host, { key: '27ce2e8e003caac05d652a9a25054f689d9e3841' }, this.href ? (h("a", { href: this.disabled ? '' : this.href, target: this.target, class: this.getClasses(), style: this.styles, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave() }, h("span", { class: "button-container" }, this.getIcon(), h("cura-label", { class: "label", size: labelSize, lineHeight: '105%', color: symbolColor }, h("slot", null))), h("cura-loader-circle", { size: this.size, color: symbolColor }))) : (h("button", { class: this.getClasses(), style: this.styles, disabled: this.disabled || null, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave(), type: this.type }, h("span", { class: "button-container" }, this.getIcon(), h("cura-label", { class: "label", size: labelSize, lineHeight: '105%', color: symbolColor }, h("slot", null))), h("cura-loader-circle", { size: this.size, color: symbolColor })))));
     }
     static get formAssociated() { return true; }
     static get watchers() { return {
@@ -303,7 +303,7 @@ const CuraHeading = class {
         return tags[`${this.level}`] || tags['default'];
     }
     render() {
-        return (h(Host, { key: '83a6a2a08051c3654f609f0e1824f41f48a6ff83', style: this.hostCSSProperties() }, this.getHeadingTag()));
+        return (h(Host, { key: '16f2897c60b5a41256f326d520277480e2800f17', style: this.hostCSSProperties() }, this.getHeadingTag()));
     }
     get host() { return getElement(this); }
     static get watchers() { return {
@@ -326,10 +326,6 @@ const CuraIcon = class {
         this.disabled = false;
     }
     sizeHandler(size) {
-        if (size === 'micro' && !microIcons.includes(this.name)) {
-            size = 16;
-            console.warn(`Icon ${this.name} doesn't support micro size. Minimum size of 16 was applied instead.`);
-        }
         const scaledStroke = (iconSize) => {
             return `${iconSizes[iconSize].stroke * (iconSizes.default.size / iconSizes[iconSize].size)}px`;
         };
@@ -348,7 +344,7 @@ const CuraIcon = class {
         this.host.style.setProperty(prop, value);
     }
     render() {
-        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}` }))));
+        return (h(Host, { key: '0a9f6e85bc7be23072c17fd8f99ca88601e2a830' }, h("svg", { key: '00e4c6f5ce357b7a974d3dd0a27948fc1e8138ce', version: "1.1", viewBox: "0 0 24 24", preserveAspectRatio: "xMidYMid meet", xmlns: "http://www.w3.org/2000/svg" }, h("use", { key: '504a842d6b030539cb615cf60b090fbc9f771761', xlinkHref: `${this.assetsPath}/icons/iconset-${this.iconset}.svg#${this.name}` }))));
     }
     get host() { return getElement(this); }
     static get watchers() { return {
@@ -4365,7 +4361,7 @@ const CuraLabel = class {
         };
     }
     render() {
-        return (h(Host, { key: '8d691e1d4c38c30d1e50bc981b9e6de89b3506e0', style: this.hostCSSProperties() }, h("p", { key: 'b68944f4fe1e65aecf6a627f3bba547418bc125b', style: this.styles, class: this.getClasses() }, h("slot", { key: 'f8ac467674d94fe94adc075743b12111d1e32469' }))));
+        return (h(Host, { key: 'cd35f2488c9783fc69bf2aea4c56c5dbb6e4d954', style: this.hostCSSProperties() }, h("p", { key: '2ab39f5cbd61b55525b4d2d9c39d19106b735ebb', style: this.styles, class: this.getClasses() }, h("slot", { key: 'f30ccdb0c038ae93096ab94db4a80a407a9976dc' }))));
     }
     get host() { return getElement(this); }
     static get watchers() { return {
@@ -4399,7 +4395,7 @@ const CuraLoaderCircle = class {
         };
     }
     render() {
-        return (h(Host, { key: '9ef3dd91b5958a5aeb90fe51120f5d9cc768ca62', style: this.getStyles() }, h("svg", { key: '96b6a2ac1ee77c14b68ea7ee462bae4a122f0c1f', viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("g", { key: '01e9425e96b2f8b63a0115dfba358a46d86574c5' }, h("circle", { key: '5ba2e9d288de3b48d33c57ef9c8c282511683739', cx: "8", cy: "8", r: "7", stroke: "url(#paint0_linear_13485_11488)", "stroke-width": "2" }), h("path", { key: 'b2069b38fc2a810c6b838eb4c924619a14ef5648', d: "M1 8C1 4.13401 4.11877 1 7.96596 1C9.53445 1 10.9819 1.52093 12.1462 2.4C12.8959 2.96601 13.5282 3.68049 14 4.5", "stroke-width": "2" })), h("defs", { key: '4e04a92c3cb8ba0084112f1a14a7815317ca92c5' }, h("linearGradient", { key: '4369f1a5c6d66b37cc00ca88c3e5c77867867fbf', id: "paint0_linear_13485_11488", x1: "15.7", y1: "4.5", x2: "4.15", y2: "11.5", gradientUnits: "userSpaceOnUse" }, h("stop", { key: '224eac239fcd4f22e3ca7b044d89942757381b9e' }), h("stop", { key: '35236a39f2156fefea7878a60dd1e559d3d1f850', offset: "1" }))))));
+        return (h(Host, { key: 'b54c7d6fb5f297776c415fc6320dcc56a8d8e23f', style: this.getStyles() }, h("svg", { key: '678e5b6959113b39bbd99cfa1cc24fe3476f88f5', viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("g", { key: 'f644ac82003dc4a59944d75d315c0e0e857de2c0' }, h("circle", { key: 'edf0ee851a9baf6f4928f961b296de9b82652aba', cx: "8", cy: "8", r: "7", stroke: "url(#paint0_linear_13485_11488)", "stroke-width": "2" }), h("path", { key: '60892a122ff4036ca29e550794ab1ce06c221359', d: "M1 8C1 4.13401 4.11877 1 7.96596 1C9.53445 1 10.9819 1.52093 12.1462 2.4C12.8959 2.96601 13.5282 3.68049 14 4.5", "stroke-width": "2" })), h("defs", { key: '3b9a54760fe0bab2e8fe6139b8c7365d11e1d966' }, h("linearGradient", { key: '447ab3c5dd38685173404c775c7fd993f6ffd696', id: "paint0_linear_13485_11488", x1: "15.7", y1: "4.5", x2: "4.15", y2: "11.5", gradientUnits: "userSpaceOnUse" }, h("stop", { key: 'df6855ea0c534bd6a623580573f999f1e078f77f' }), h("stop", { key: '8a76e2928a39673780ad5561dbc5b4204af62fcb', offset: "1" }))))));
     }
 };
 CuraLoaderCircle.style = CuraLoaderCircleStyle0;
@@ -4423,7 +4419,7 @@ const CuraPageTemplate = class {
         return classes;
     }
     render() {
-        return (h(Host, { key: 'd79c3d22ccbd93d8a56c700e3016507d18720464' }, h("div", { key: 'a717f44d6b5df9f00ffe61fff816721705748040', style: this.styles, class: "grid-template" }, h("div", { key: '7a3d585d4213799b32e2043327442b21833fd4fc', id: "sub-header" }, h("slot", { key: 'dbab9738fe221a426642e5d63e88130e1f351591', name: 'sub-header' })), h("div", { key: '39f2878cac260b70b8e53b57b6b9b5b07f658251', id: "header" }, h("slot", { key: '511af91f30dfcfde3ced7bce4c341a2802c88db8', name: 'header' })), h("div", { key: 'ed8d1b1e0d5ffca939c525ee8320da7f2afde95d', id: "pre-content" }, h("slot", { key: 'dd8c722ddd113f49965a6397625980aace8b78e8', name: 'pre-content' })), h("div", { key: '64a5767bbc858f18e44a3339b6bb567b3e5a8c0d', id: "content-container", class: this.getClasses() }, h("div", { key: '919e9d54e10f1469264f193545e80b680b63c801', id: "sidebar-left" }, h("slot", { key: '8ddeb7358bd9f6d0e08b1e3f323219b8980eec9c', name: 'sidebar-left' })), h("div", { key: '48e3860c1674658c386124c80a35b85bdb085e3e', id: "content" }, h("slot", { key: '8bc21a187897a5e9cd2e922285364a02425cefa6', name: "content" }), h("slot", { key: '587d13eed3fedcbf9e33dc4084cb2554ba70125d' })), h("div", { key: '7f620fd04b4cf4a051954dca8a95293c2a7c1d9a', id: "sidebar-right" }, h("slot", { key: '3499275e67a00fcaab4f044535dbeb19c1040569', name: 'sidebar-right' }))), h("div", { key: '59b9e4a5fe541f2ad6dac53a40588482b33e0cad', id: "post-body" }, h("slot", { key: '7493b3b330cabf263990a149c1b526501260de95', name: 'post-body' })), h("div", { key: '4a35c95f7ad04f04bb8673babc06d243e1b8f931', id: "footer" }, h("slot", { key: 'f69ffbd9c9cabe72e1ee4f147f7a1448311a7f0c', name: 'footer' })), h("div", { key: 'd53b60b2d9170797e7dc12b3179c24b7f76ac41d', id: "sub-footer" }, h("slot", { key: '75dcebb2f223ed1d0b1181ea3773fbb6bf096e33', name: 'sub-footer' })))));
+        return (h(Host, { key: '1e08a43c7701b7063cb652f6e040d3d5f5eb09a4' }, h("div", { key: '8aed196bdd1e4385a5cd397d531f32d5d6a34e45', style: this.styles, class: "grid-template" }, h("div", { key: '92bb8cc24ddc2a6c7cb81cca6326e3aae62fe9fb', id: "sub-header" }, h("slot", { key: 'af2542eb9aae107bb96009e1dbf234099e3fee06', name: 'sub-header' })), h("div", { key: '11ccbfe4b8f226d5f312b9db81cb10bf7aff6058', id: "header" }, h("slot", { key: 'f4cf6ce66934479b421841c0d85341ad771f8801', name: 'header' })), h("div", { key: 'b0af61b6a26cffbae8722a265bbf695984aeb192', id: "pre-content" }, h("slot", { key: '1c6e615377935f2d8bcdc0106a7f8ef46a4096c8', name: 'pre-content' })), h("div", { key: '7c9600de42ea9338571f59c7dfa07e8d83d907f3', id: "content-container", class: this.getClasses() }, h("div", { key: '8e9c4100038b1a7add298292b039098a66936fc3', id: "sidebar-left" }, h("slot", { key: '266eface0f8eb826fce97ec1c6eb8a5f2a983256', name: 'sidebar-left' })), h("div", { key: 'da2e6b2a9d72cb80f5f340e877388ce82e285d97', id: "content" }, h("slot", { key: '8e1fb56cad2e3b693fb40c87bc8b8813ac1c5cec', name: "content" }), h("slot", { key: '7fcfa41e62fbb3eb03e6350d2242119cea4a7172' })), h("div", { key: '561cdd39b2327375fbfab17b7d9ba61d3c8641e1', id: "sidebar-right" }, h("slot", { key: 'abb1a3c4b46a4e576f9720582e41237f323baedb', name: 'sidebar-right' }))), h("div", { key: '273e8172b1084ef92d125ec3c524bd0a357e740a', id: "post-body" }, h("slot", { key: '9c0ba47959028dd86b5d83fe9050e4cbd51b09f0', name: 'post-body' })), h("div", { key: 'ec53311edaed349b82cf37be5957d9a07e1e25d3', id: "footer" }, h("slot", { key: '16d56243b257ba7b3b6919c5fcd4b482d646b925', name: 'footer' })), h("div", { key: 'ed81fc5a890b564a6b437f61122259b6ea5a94f2', id: "sub-footer" }, h("slot", { key: '88c1d8297bd16ac01f7f5e81803cee6d1b13aa41', name: 'sub-footer' })))));
     }
     get host() { return getElement(this); }
 };
@@ -4479,7 +4475,7 @@ const CuraParagraph = class {
         };
     }
     render() {
-        return (h(Host, { key: 'fc146c5173887dd80bb1798d58b7fbe29775e2de', style: this.hostCSSProperties() }, h("p", { key: '0defc510c08182261e22a4ab47a24d939199db24', style: this.styles, class: this.setsizeClass() }, h("slot", { key: 'e70c68a1da0596dc8d2273f5679c9193a354e313' }))));
+        return (h(Host, { key: '237ff05930df443e9e8c2cb618554525c2312e35', style: this.hostCSSProperties() }, h("p", { key: '71afec31842fc60f17881613ab2f36f4cffd358b', style: this.styles, class: this.setsizeClass() }, h("slot", { key: '07fa9781d53113b7d4f9b7732b48d6836f700406' }))));
     }
     get host() { return getElement(this); }
     static get watchers() { return {
@@ -4767,13 +4763,13 @@ const CuraSelect = class {
         return (h("cura-icon", { class: 'feedback-icon', name: icon, iconset: 'default', size: this.size === 'large' ? 20 : 16, color: this.getColor('icon'), style: this.styles }));
     }
     render() {
-        return (h(Host, { key: 'f01b52d0da1c417723c9da0ce7002155b3cbb07d', style: this.styles }, h("div", { key: '2798e5cd7f16e8679520900374e569cca1e5bee8', class: this.getClasses(), onMouseEnter: () => (this.isHovered = true), onMouseLeave: () => (this.isHovered = false), onClick: this.handleClick }, this.label && (h("cura-label", { key: '5f9f645c3199e6299f000f5ab167139f536442b8', class: 'label', weight: 'bold', size: this.size === 'large' ? 'small' : 'xsmall', color: this.getColor('label') }, this.label, " ", this.required && h("span", { key: '2bca7ed64c1d44152161c2d71173f70b8b2fbacc', class: 'required' }, "* "))), h("div", { key: 'c1e77ccc2d1853b8749fea57e5ca3554363ef168', class: {
+        return (h(Host, { key: 'cb2962534d4f39e83739c14396bf7ada6389f4e2', style: this.styles }, h("div", { key: '2b09c26a8f5e1dd8f11b8624c4fbc4d840cdb9fd', class: this.getClasses(), onMouseEnter: () => (this.isHovered = true), onMouseLeave: () => (this.isHovered = false), onClick: this.handleClick }, this.label && (h("cura-label", { key: 'c6585f4b4024a42ce4e105acec9f1710b7c0eb71', class: 'label', weight: 'bold', size: this.size === 'large' ? 'small' : 'xsmall', color: this.getColor('label') }, this.label, " ", this.required && h("span", { key: '4dcc4a50529b1521b43a7e8bbeee62d0bbc12dc7', class: 'required' }, "* "))), h("div", { key: '189da945bff9d9e946ef5b46d2a021b29b508214', class: {
                 'cura-input-field': true,
                 'open': this.isOpen
-            } }, this.renderIcon(), h("input", { key: '66e99e0a7c3b00516cc2f1240d08511c9434201b', type: "text", autocomplete: 'off', onFocus: () => (this.isFocused = true), onBlur: () => (this.isFocused = false), onKeyDown: this.handleKeyNavigation, "aria-required": String(this.required), "aria-disabled": String(this.disabled), "aria-invalid": String(this.status === 'error'), onInput: this.handleInputChange, style: this.styles, placeholder: this.placeholder, disabled: this.disabled, required: this.required, value: this.textInput, readonly: this.searchBehavior ? null : true }), h("cura-icon", { key: '4efde985b30016b633818f9fafe6c1f538b4776e', name: this.isOpen ? 'up' : 'down', class: "up-down-icon", color: this.disabled ? 'neutral-dark' : 'primary-base', size: 16, iconset: 'default' })), h("cura-label", { key: 'ead6b6a9f95acc7f2cf2e7474f72c1627e0bd8cd', class: "helper-text", size: 'xsmall', color: this.getColor('text'), weight: this.mode === 'transparent' ? 'bold' : 'regular' }, h("slot", { key: 'e01c6c99fecb78822d092a41db0b969ca160cea1' })), this.isOpen && (h("div", { key: '0fedad3cac056457810c984eb471bd9a703f2ff4', class: {
+            } }, this.renderIcon(), h("input", { key: '13cc7d03a4770819a84239ab934f7a73f10434db', type: "text", autocomplete: 'off', onFocus: () => (this.isFocused = true), onBlur: () => (this.isFocused = false), onKeyDown: this.handleKeyNavigation, "aria-required": String(this.required), "aria-disabled": String(this.disabled), "aria-invalid": String(this.status === 'error'), onInput: this.handleInputChange, style: this.styles, placeholder: this.placeholder, disabled: this.disabled, required: this.required, value: this.textInput, readonly: this.searchBehavior ? null : true }), h("cura-icon", { key: 'c0ccb27b7de0849b0e960e69ef472463a4b9d02b', name: this.isOpen ? 'up' : 'down', class: "up-down-icon", color: this.disabled ? 'neutral-dark' : 'primary-base', size: 16, iconset: 'default' })), h("cura-label", { key: '5b093234b507fe6a2c350e9bee5e9a24eba2e5d6', class: "helper-text", size: 'xsmall', color: this.getColor('text'), weight: this.mode === 'transparent' ? 'bold' : 'regular' }, h("slot", { key: 'c051fa93257f3d68945fa15edd2ab10e9ca75087' })), this.isOpen && (h("div", { key: '8a20447dee35780853e3560c86975ead069e9369', class: {
                 'menu': true,
                 'open': this.isOpen
-            } }, h("slot", { key: '1330a45037f002b5fd20a356f1fe5b982999e512', name: 'option' }))))));
+            } }, h("slot", { key: 'dff5e6b54842ed9a6e458414977080069a0c4b5c', name: 'option' }))))));
     }
     static get formAssociated() { return true; }
     get host() { return getElement(this); }
@@ -4823,7 +4819,7 @@ const CuraSelectOption = class {
         };
     }
     render() {
-        return (h(Host, { key: '42fe72a8cadcb2745fa41cced2bf8f571ca0fb81', slot: "option" }, h("div", { key: '275c6ba6baaf1c28af3c6cce6abc36dc8c496e13', class: this.getClasses(), style: this.styles }, h("cura-label", { key: 'a5f2e672f55fe16b749f6f5d33c1ba64eb415ca8', color: `${this.selected ? 'primary-base' : 'neutral-black'}`, size: this.getSize('label'), "margin-block": "0" }, h("slot", { key: '37b09097f6f51515fe63f07a5b6bb2449ba51e60' })), this.selected && h("cura-icon", { key: '88b01b9505ea9c46ddd19be78db4bd084601687d', name: 'check', size: this.getSize('icon'), color: "primary-base" }))));
+        return (h(Host, { key: 'cf0489e6e396d60d4a4f71e306727ac12b3fbb7a', slot: "option" }, h("div", { key: 'e970f361bff2c54e0324e43a612d3fa45a83b2bd', class: this.getClasses(), style: this.styles }, h("cura-label", { key: '7bbcc39a51c2c9e14f233c94ea2dcf20543e11eb', color: `${this.selected ? 'primary-base' : 'neutral-black'}`, size: this.getSize('label'), "margin-block": "0" }, h("slot", { key: 'f5a54eaf4e2ef19239ca185b39897f98d11f05c7' })), this.selected && h("cura-icon", { key: '8a1560793da12ec6f5d3e9dc2db7e242a440267c', name: 'check', size: this.getSize('icon'), color: "primary-base" }))));
     }
     get host() { return getElement(this); }
     static get watchers() { return {