npm - @rededor/cura - Versions diffs - 0.5.2 → 0.5.3 - Mend

@rededor/cura 0.5.2 → 0.5.3

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

package/dist/cura/p-bb3f9d05.entry.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{r as t,h as o,H as e,g as i}from"./p-ba66d7be.js";import{m as s,i as a}from"./p-c791725b.js";const l=':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)}:host::after{content:"";display:block;border-bottom:solid 1px var(--neutral-base);width:100%}';const n=class{constructor(o){t(this,o);this.mutationObserverCallback=(t,o)=>{var e;for(const o of t){if(o.type==="attributes"&&o.attributeName==="opened"&&((e=o.target)===null\|\|e===void 0?void 0:e["opened"])){if(this.behavior!=="default")continue;this.host.querySelectorAll("cura-accordion-item").forEach((t=>{if(t!=o.target){t.opened=false}}))}if(o.type==="childList"){const t=Array.from(o.addedNodes\|\|[]);for(let o of t){this.setChildProperties(o)}}}};this.mutationObserver=new MutationObserver(this.mutationObserverCallback);this.color="primary";this.activeColor="accent";this.colorMode="dark";this.iconSize=32;this.openIcon="down";this.closeIcon="up";this.iconColor="";this.iconActiveColor="";this.behavior="default";this.styles={}}handleChangeColor(){this.setColors()}connectedCallback(){const t=window.CuraAPI.theme.fonts.getWeights();this.styles["--base-spacing"]=window.CuraAPI.theme.spacing.getSpacing();this.styles["--neutral-purewhite"]=window.CuraAPI.theme.colors.getColor(`neutral-purewhite`);this.styles["--neutral-lighter"]=window.CuraAPI.theme.colors.getColor(`neutral-lighter`);this.styles["--neutral-base"]=window.CuraAPI.theme.colors.getColor(`neutral-base`);this.styles["--font-size"]=window.CuraAPI.theme.fonts.getSize();this.styles["--font-color"]=window.CuraAPI.theme.fonts.getColor();this.styles["--font-family"]=window.CuraAPI.theme.fonts.getFamily();this.styles["--font-weight-regular"]=t.regular;this.setColors()}componentDidLoad(){this.host.querySelectorAll("cura-accordion-item").forEach((t=>{this.setChildProperties(t)}));const t={childList:true,subtree:true,attributes:true};this.mutationObserver.observe(this.host,t)}disconnectedCallback(){this.mutationObserver.disconnect()}setChildProperties(t){t.colorMode=this.colorMode;t.iconColor=this.iconColor\|\|this.color;t.iconActiveColor=this.iconActiveColor\|\|this.activeColor;t.iconSize=this.iconSize;t.openIcon=this.openIcon;t.closeIcon=this.closeIcon}setColors(){this.styles=Object.assign(Object.assign({},this.styles),{"--color-lighter":window.CuraAPI.theme.colors.getColor(`${this.color}-lighter`),"--color-light":window.CuraAPI.theme.colors.getColor(`${this.color}-light`),"--color-base":window.CuraAPI.theme.colors.getColor(`${this.color}-base`),"--color-dark":window.CuraAPI.theme.colors.getColor(`${this.color}-dark`),"--color-active-lighter":window.CuraAPI.theme.colors.getColor(`${this.activeColor}-lighter`),"--color-active-light":window.CuraAPI.theme.colors.getColor(`${this.activeColor}-light`),"--color-active-base":window.CuraAPI.theme.colors.getColor(`${this.activeColor}-base`),"--color-active-dark":window.CuraAPI.theme.colors.getColor(`${this.activeColor}-dark`),"--icon-color-lighter":window.CuraAPI.theme.colors.getColor(`${this.iconColor\|\|this.color}-lighter`),"--icon-color-light":window.CuraAPI.theme.colors.getColor(`${this.iconColor\|\|this.color}-light`),"--icon-color-base":window.CuraAPI.theme.colors.getColor(`${this.iconColor\|\|this.color}-base`),"--icon-color-dark":window.CuraAPI.theme.colors.getColor(`${this.iconColor\|\|this.color}-dark`),"--icon-color-active-lighter":window.CuraAPI.theme.colors.getColor(`${this.iconActiveColor\|\|this.activeColor}-lighter`),"--icon-color-active-light":window.CuraAPI.theme.colors.getColor(`${this.iconActiveColor\|\|this.activeColor}-light`),"--icon-color-active-base":window.CuraAPI.theme.colors.getColor(`${this.iconActiveColor\|\|this.activeColor}-base`),"--icon-color-active-dark":window.CuraAPI.theme.colors.getColor(`${this.iconActiveColor\|\|this.activeColor}-dark`)})}render(){return o(e,{style:this.styles},o("slot",{name:"accordion-item"}))}get host(){return i(this)}static get watchers(){return{color:["handleChangeColor"],activeColor:["handleChangeColor"]}}};n.style=l;const r=':host{display:block}:host .accordion-item{width:100%}:host .accordion-item .label{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}:host .accordion-item .label::before{content:"";display:block;border-top:solid 1px var(--neutral-base);width:100%}:host .accordion-item .label .label-container{display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:center;align-items:center;gap:calc(var(--base-spacing) * 2px);min-height:40px;word-break:break-word;cursor:pointer;font-size:1.14em;font-weight:var(--font-weight-regular);color:var(--color-base);padding:0px}:host .accordion-item .label .label-container cura-icon{margin-right:4px}:host .accordion-item .label .label-container:hover{color:var(--color-light)}:host .accordion-item .label .label-container:hover cura-icon{--color:var(--icon-color-light) !important}:host .accordion-item .label .label-container:active{color:var(--color-dark)}:host .accordion-item .label .label-container:active cura-icon{--color:var(--icon-color-dark) !important}:host .accordion-item .content{font-size:1em;overflow:hidden;max-height:0;-webkit-transition:max-height 0.25s ease;transition:max-height 0.25s ease}:host .accordion-item .content .content-wrapper{padding:calc(var(--base-spacing) * 2px) 0px;border-top:solid 1px var(--neutral-base)}:host .accordion-item.active .label .label-container{color:var(--color-active-base)}:host .accordion-item.active .label .label-container:hover{color:var(--color-active-light)}:host .accordion-item.active .label .label-container:hover cura-icon{--color:var(--icon-color-active-light) !important}:host .accordion-item.active .label .label-container:active{color:var(--color-active-dark)}:host .accordion-item.active .label .label-container:active cura-icon{--color:var(--icon-color-active-dark) !important}:host .accordion-item.active .content{max-height:200vh;overflow-y:auto;-webkit-transition:max-height 0.5s ease 0.14s;transition:max-height 0.5s ease 0.14s}:host .accordion-item.inverted .label .label-container{color:var(--neutral-lighter)}:host .accordion-item.inverted .label .label-container:hover{color:var(--color-lighter)}:host .accordion-item.inverted .label .label-container:hover cura-icon{--color:var(--icon-color-lighter) !important}:host .accordion-item.inverted .label .label-container:active{color:var(--color-light)}:host .accordion-item.inverted .label .label-container:active cura-icon{--color:var(--icon-color-light) !important}:host .accordion-item.active.inverted .label .label-container{color:var(--neutral-purewhite)}:host .accordion-item.active.inverted .label .label-container:hover{color:var(--color-active-lighter)}:host .accordion-item.active.inverted .label .label-container:hover cura-icon{--color:var(--icon-color-active-lighter) !important}:host .accordion-item.active.inverted .label .label-container:active{color:var(--color-active-light)}:host .accordion-item.active.inverted .label .label-container:active cura-icon{--color:var(--icon-color-active-light) !important}@media (min-width: 769px) and (max-width: 992px){:host .accordion-item .label .label-container{font-size:1.29em}:host .accordion-item .content{font-size:1.14em}}@media (min-width: 993px){:host .accordion-item .label .label-container{font-size:1.29em}:host .accordion-item .content{font-size:1.14em}}';const h=class{constructor(o){t(this,o);this.label="";this.iconSize=32;this.openIcon="down";this.closeIcon="up";this.iconColor="";this.iconActiveColor="";this.colorMode="dark";this.opened=false;this.styles={}}getIconColor(){const t=this.colorMode==="light";const o=t?"neutral-lighter":`${this.iconColor}-base`;const e=t?"neutral-purewhite":`${this.iconActiveColor}-base`;return this.opened?e:o}getClasses(){const t={};t["accordion-item"]=true;t["active"]=this.opened;t["inverted"]=this.colorMode==="light";return t}accordionItemClick(t){this.opened=!this.opened}render(){return o(e,{slot:"accordion-item"},o("div",{class:this.getClasses(),style:this.styles},o("div",{class:"label",onClick:t=>this.accordionItemClick(t)},o("div",{class:"label-container"},o("span",null,this.label),o("cura-icon",{name:this.opened?this.closeIcon:this.openIcon,size:this.iconSize,color:this.getIconColor()}))),o("div",{class:"content"},o("div",{class:"content-wrapper"},o("slot",null)))))}};h.style=r;const c=':host{--border-radius:4px;display:inline-block;vertical-align:middle}:host button,:host a{outline:none;-webkit-box-shadow:none;box-shadow:none;-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;width:100%;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;text-decoration:none !important;font-size:var(--font-size);cursor:pointer;-webkit-transition:background-color 0.07s linear, border-color 0.07s linear, -webkit-box-shadow 0.07s linear;transition:background-color 0.07s linear, border-color 0.07s linear, -webkit-box-shadow 0.07s linear;transition:background-color 0.07s linear, box-shadow 0.07s linear, border-color 0.07s linear;transition:background-color 0.07s linear, box-shadow 0.07s linear, border-color 0.07s linear, -webkit-box-shadow 0.07s linear;border-radius:var(--border-radius);background-color:var(--color-base);border:none;padding:calc(var(--base-spacing) * 3.5px) calc(var(--base-spacing) * 4px);min-height:calc(var(--base-spacing) * 13px);min-width:calc(var(--base-spacing) * 13px)}:host button:not(.isLoading):not(.disabled):hover,:host a:not(.isLoading):not(.disabled):hover{background-color:var(--color-light)}:host button:not(.isLoading):not(.disabled):active,:host a:not(.isLoading):not(.disabled):active{background-color:var(--color-dark)}:host button:hover,:host a:hover{-webkit-box-shadow:0 4px 8px 0 rgba(38, 38, 38, 0.16);box-shadow:0 4px 8px 0 rgba(38, 38, 38, 0.16)}:host button.medium:hover,:host a.medium:hover{-webkit-box-shadow:0 3px 6px 0 rgba(38, 38, 38, 0.16);box-shadow:0 3px 6px 0 rgba(38, 38, 38, 0.16)}:host button.small:hover,:host a.small:hover{-webkit-box-shadow:0 2px 5px 0 rgba(38, 38, 38, 0.16);box-shadow:0 2px 5px 0 rgba(38, 38, 38, 0.16)}:host button:active,:host button.disabled:hover,:host button.isLoading:hover,:host a:active,:host a.disabled:hover,:host a.isLoading:hover{-webkit-box-shadow:none !important;box-shadow:none !important}:host button.medium,:host a.medium{padding:calc(var(--base-spacing) * 2.75px) calc(var(--base-spacing) * 4px);min-height:calc(var(--base-spacing) * 11px);min-width:calc(var(--base-spacing) * 11px)}:host button.small,:host a.small{padding:calc(var(--base-spacing) * 1.5px) calc(var(--base-spacing) * 3px);min-height:calc(var(--base-spacing) * 8px);min-width:calc(var(--base-spacing) * 8px)}:host button .button-container,:host a .button-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;opacity:1;-webkit-transition:opacity 0.2s linear;transition:opacity 0.2s linear}:host button.icon-right .button-container,:host a.icon-right .button-container{-ms-flex-direction:row-reverse;flex-direction:row-reverse}:host button .label,:host a .label{-ms-flex:1;flex:1;font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:1.43em;line-height:1.2em;text-align:var(--text-align, "left");color:var(--neutral-black)}:host button .label.inverted,:host a .label.inverted{color:var(--neutral-white)}:host button.medium .label,:host a.medium .label{font-size:1.14em}:host button.small .label,:host a.small .label{font-size:1em}: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 a.medium.icon-left cura-icon{margin-right:calc(var(--base-spacing) * 2.7px)}:host button.medium.icon-right cura-icon,:host a.medium.icon-right cura-icon{margin-left:calc(var(--base-spacing) * 2.7px)}:host button.small.icon-left cura-icon,:host a.small.icon-left cura-icon{margin-right:calc(var(--base-spacing) * 2.5px)}:host button.small.icon-right cura-icon,:host a.small.icon-right cura-icon{margin-left:calc(var(--base-spacing) * 2.5px)}:host button.disabled,:host a.disabled{cursor:not-allowed;background-color:var(--neutral-light)}:host button.disabled .label,:host button.disabled .label.inverted,:host a.disabled .label,:host a.disabled .label.inverted{color:var(--neutral-dark)}:host button.icon-only,:host a.icon-only{padding:calc(var(--base-spacing) * 3.5px)}:host button.icon-only .label,:host a.icon-only .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) * 2.75px)}:host button.icon-only.small,:host a.icon-only.small{padding:calc(var(--base-spacing) * 1.5px)}: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.3}:host button.isLoading.icon-only .button-container,:host a.isLoading.icon-only .button-container{opacity:0}:host button.isLoading cura-loader-circle,:host a.isLoading cura-loader-circle{display:block}';const d=class{constructor(o){t(this,o);this.size="medium";this.disabled=false;this.isLoading=false;this.iconName=undefined;this.iconset="default";this.iconPosition="left";this.iconOnly=false;this.href=undefined;this.target="_self";this.color="accent";this.fontColor="dark";this.textAlign="left";this.styles={}}handleChangeColor(){this.setColors()}connectedCallback(){this.weights=window.CuraAPI.theme.fonts.getWeights();this.styles["--base-spacing"]=window.CuraAPI.theme.spacing.getSpacing();this.styles["--neutral-white"]=window.CuraAPI.theme.colors.getColor(`neutral-white`);this.styles["--neutral-light"]=window.CuraAPI.theme.colors.getColor(`neutral-light`);this.styles["--neutral-dark"]=window.CuraAPI.theme.colors.getColor(`neutral-dark`);this.styles["--font-size"]=window.CuraAPI.theme.fonts.getSize();this.styles["--font-family"]=window.CuraAPI.theme.fonts.getFamily();this.styles["--font-weight-medium"]=this.weights.medium;this.styles["--text-align"]=this.textAlign;this.setColors()}getClasses(){const t={};t[`${this.size.toLowerCase()}`]=true;t[`icon-${this.iconPosition.toLowerCase()}`]=true;t[`icon-only`]=this.iconOnly;t["inverted"]=this.fontColor==="light";t["disabled"]=this.disabled;t["isLoading"]=this.isLoading;return t}setColors(){this.styles=Object.assign(Object.assign({},this.styles),{"--color-light":window.CuraAPI.theme.colors.getColor(`${this.color}-light`),"--color-base":window.CuraAPI.theme.colors.getColor(`${this.color}-base`),"--color-dark":window.CuraAPI.theme.colors.getColor(`${this.color}-dark`)})}getIcon(){if(!this.iconName)return"";const t=this.size==="small"?16:this.size==="medium"?20:24;const e=this.getSymbolColor();return o("cura-icon",{name:this.iconName,iconset:this.iconset,size:t,color:e})}getSymbolColor(){return this.disabled?"neutral-dark":this.fontColor==="light"?"neutral-white":"neutral-black"}handleClick(t){if(this.disabled\|\|this.isLoading)t.preventDefault()}render(){return o(e,null,this.href?o("a",{href:this.disabled?"":this.href,target:this.target,class:this.getClasses(),style:this.styles,onClick:t=>this.handleClick(t)},o("span",{class:"button-container"},this.getIcon(),o("span",{class:{label:true,inverted:this.fontColor==="light"}},o("slot",null))),o("cura-loader-circle",{size:this.size,color:this.getSymbolColor()})):o("button",{class:this.getClasses(),style:this.styles,disabled:this.disabled\|\|null,onClick:t=>this.handleClick(t)},o("span",{class:"button-container"},this.getIcon(),o("span",{class:{label:true,inverted:this.fontColor==="light"}},o("slot",null))),o("cura-loader-circle",{size:this.size,color:this.getSymbolColor()})))}static get watchers(){return{color:["handleChangeColor"]}}};d.style=c;const g=":host{display:block;font-size:var(--font-size-base)}:host h1,:host h2,:host h3,:host h4,:host h5,:host h6{font-family:var(--font-family);font-size:1.714em;font-weight:var(--font-weight-regular);color:var(--color-body);line-height:var(--line-height);margin-block:var(--margin-block);letter-spacing:0px}:host h1.bold-weight,:host h2.bold-weight,:host h3.bold-weight,:host h4.bold-weight,:host h5.bold-weight,:host h6.bold-weight{font-weight:var(--font-weight-medium)}:host h1.large,:host h2.large,:host h3.large,:host h4.large,:host h5.large,:host h6.large{font-size:2.071em;letter-spacing:-0.58px}:host h1.small,:host h2.small,:host h3.small,:host h4.small,:host h5.small,:host h6.small{font-size:1.214em;line-height:calc(var(--line-height) + 20%)}:host h1.small.bold-weight,:host h1.small ::slotted(b),:host h1.small ::slotted(strong),:host h2.small.bold-weight,:host h2.small ::slotted(b),:host h2.small ::slotted(strong),:host h3.small.bold-weight,:host h3.small ::slotted(b),:host h3.small ::slotted(strong),:host h4.small.bold-weight,:host h4.small ::slotted(b),:host h4.small ::slotted(strong),:host h5.small.bold-weight,:host h5.small ::slotted(b),:host h5.small ::slotted(strong),:host h6.small.bold-weight,:host h6.small ::slotted(b),:host h6.small ::slotted(strong){font-weight:var(--font-weight-bold)}:host h1.xsmall,:host h2.xsmall,:host h3.xsmall,:host h4.xsmall,:host h5.xsmall,:host h6.xsmall{font-size:0.714em;font-weight:var(--font-weight-medium);letter-spacing:0.6px}:host h1.xsmall.bold-weight,:host h1.xsmall ::slotted(b),:host h1.xsmall ::slotted(strong),:host h2.xsmall.bold-weight,:host h2.xsmall ::slotted(b),:host h2.xsmall ::slotted(strong),:host h3.xsmall.bold-weight,:host h3.xsmall ::slotted(b),:host h3.xsmall ::slotted(strong),:host h4.xsmall.bold-weight,:host h4.xsmall ::slotted(b),:host h4.xsmall ::slotted(strong),:host h5.xsmall.bold-weight,:host h5.xsmall ::slotted(b),:host h5.xsmall ::slotted(strong),:host h6.xsmall.bold-weight,:host h6.xsmall ::slotted(b),:host h6.xsmall ::slotted(strong){font-weight:var(--font-weight-bold)}@media (min-width: 769px) and (max-width: 1920px){:host h1,:host h2,:host h3,:host h4,:host h5,:host h6{font-size:2em}:host h1.large,:host h2.large,:host h3.large,:host h4.large,:host h5.large,:host h6.large{font-size:2.357em;letter-spacing:-0.66px}:host h1.small,:host h2.small,:host h3.small,:host h4.small,:host h5.small,:host h6.small{font-size:1.357em}:host h1.xsmall,:host h2.xsmall,:host h3.xsmall,:host h4.xsmall,:host h5.xsmall,:host h6.xsmall{font-size:0.857em;line-height:calc(var(--line-height) + 3%);letter-spacing:0.72px}}@media (min-width: 1921px){:host h1,:host h2,:host h3,:host h4,:host h5,:host h6{font-size:2.5em;line-height:calc(var(--line-height) + 5%);letter-spacing:-0.82px}:host h1.large,:host h2.large,:host h3.large,:host h4.large,:host h5.large,:host h6.large{font-size:2.929em}:host h1.small,:host h2.small,:host h3.small,:host h4.small,:host h5.small,:host h6.small{font-size:1.714em;line-height:calc(var(--line-height) + 30%);letter-spacing:0%}:host h1.xsmall,:host h2.xsmall,:host h3.xsmall,:host h4.xsmall,:host h5.xsmall,:host h6.xsmall{font-size:1em;line-height:calc(var(--line-height) + 12.857%);letter-spacing:0.28px}}:host ::slotted(b),:host ::slotted(strong){font-weight:var(--font-weight-medium)}:host ::slotted(a){font-weight:var(--font-weight-bold);color:var(--color-link);text-underline-offset:10%;cursor:pointer}:host ::slotted(u){text-underline-offset:10%}:host ::slotted(abbr){color:var(--color-link);-webkit-text-decoration:underline dashed 1px var(--color-link);text-decoration:underline dashed 1px var(--color-link);text-underline-offset:10%;cursor:default}:host ::slotted(i),:host ::slotted(em){font-weight:var(--font-weight-medium)}";const m=class{constructor(o){t(this,o);this.theme=window.CuraAPI.theme;this.level=1;this.size="medium";this.weight="regular";this.spotColor="accent-dark";this.color=undefined;this.marginBlock="1.25em";this.lineHeight="130%";this.styles={}}handleChangeColor(){this.setColors()}connectedCallback(){this.setFontProperties();this.setColors()}getClasses(){const t={};t[this.size.toLowerCase()]=true;t[`${this.weight.toLowerCase()}-weight`]=true;return t}setFontProperties(){this.weights=this.theme.fonts.getWeights();this.fontSizeBase=this.theme.fonts.getSize();this.styles={"--font-family":window.CuraAPI.theme.fonts.getFamily("heading"),"--font-weight-regular":this.weights.regular,"--font-weight-medium":this.weights.medium,"--font-weight-bold":this.weights.bold,"--font-weight-black":this.weights.black}}hostCSSProperties(){return{"--margin-block":this.marginBlock,"--font-size-base":this.fontSizeBase,"--line-height":this.lineHeight}}setColors(){const t=this.color?this.theme.colors.getColor(this.color):this.theme.fonts.getColor();this.styles=Object.assign(Object.assign({},this.styles),{"--color-body":t\|\|this.theme.colors.getColor("neutral-darker"),"--color-link":this.theme.colors.getColor(`${this.spotColor}`)})}getHeadingTag(){const t={1:o("h1",{style:this.styles,class:this.getClasses()},o("slot",null)),2:o("h2",{style:this.styles,class:this.getClasses()},o("slot",null)),3:o("h3",{style:this.styles,class:this.getClasses()},o("slot",null)),4:o("h4",{style:this.styles,class:this.getClasses()},o("slot",null)),5:o("h5",{style:this.styles,class:this.getClasses()},o("slot",null)),6:o("h6",{style:this.styles,class:this.getClasses()},o("slot",null)),default:o("h1",{style:this.styles,class:this.getClasses()},o("slot",null))};return t[`${this.level}`]\|\|t["default"]}render(){return o(e,{style:this.hostCSSProperties()},this.getHeadingTag())}get host(){return i(this)}static get watchers(){return{color:["handleChangeColor"],spotColor:["handleChangeColor"]}}};m.style=g;const b=":host{width:var(--size);height:var(--size)}:host svg{display:inline-block;stroke:var(--color);width:var(--size);height:var(--size);stroke-width:var(--stroke);fill:none}";const p=class{constructor(o){t(this,o);this.name="";this.color="neutral-base";this.size=undefined;this.iconset="default";this.disabled=false}sizeHandler(t){if(t==="micro"&&!s.includes(this.name)){t=16;console.warn(`Icon ${this.name} doesn't support micro size. Minimum size of 16 was applied instead.`)}const o=t=>`${a[t].stroke(a.default.size/a[t].size)}px`;this.setHostProperty("--size",a[`${t}`]?`${a[t].size}px`:`${a.default.size}px`);this.setHostProperty("--stroke",a[`${t}`]?o(t):o("default"))}colorHandler(){this.setHostProperty("--color",window.CuraAPI.theme.colors.getColor(this.disabled?"neutral-light":this.color\|\|"neutral"))}connectedCallback(){this.assetsPath=window.CuraAPI.localAssetsPath;this.sizeHandler(this.size);this.colorHandler()}setHostProperty(t,o){this.host.style.setProperty(t,o)}render(){return o(e,null,o("svg",{version:"1.1",viewBox:"0 0 24 24",preserveAspectRatio:"xMidYMid meet",xmlns:"http://www.w3.org/2000/svg"},o("use",{xlinkHref:`${this.assetsPath}/icons/iconset-${this.iconset}.svg#${this.name}`})))}get host(){return i(this)}static get watchers(){return{size:["sizeHandler"],color:["colorHandler"],disabled:["colorHandler"]}}};p.style=b;const u=":host{display:inline-block;width:var(--size);height:var(--size)}:host svg{width:var(--size);height:var(--size);-webkit-animation:rotate 0.7s linear infinite;animation:rotate 0.7s linear infinite}:host circle,:host path{stroke-miterlimit:10;stroke-linecap:round;stroke-linejoin:round}:host path{stroke:var(--color)}:host stop{stop-color:var(--color)}:host linearGradient stop:first-child{stop-opacity:0.14}@-webkit-keyframes rotate{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes rotate{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}";const v=class{constructor(o){t(this,o);this.sizes={xlarge:32,large:24,medium:20,small:16,default:16};this.getPxSize=()=>this.sizes[this.size]\|\|this.sizes["default"];this.size="medium";this.color="neutral-white"}getStyles(){return{"--size":`${this.getPxSize()}px`,"--color":window.CuraAPI.theme.colors.getColor(this.color)}}render(){return o(e,{style:this.getStyles()},o("svg",{viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg"},o("g",null,o("circle",{cx:"8",cy:"8",r:"7",stroke:"url(#paint0_linear_13485_11488)","stroke-width":"2"}),o("path",{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"})),o("defs",null,o("linearGradient",{id:"paint0_linear_13485_11488",x1:"15.7",y1:"4.5",x2:"4.15",y2:"11.5",gradientUnits:"userSpaceOnUse"},o("stop",null),o("stop",{offset:"1"})))))}};v.style=u;const w=':host{display:block}:host .grid-template{display:grid;grid-template-rows:auto;grid-template-columns:auto;grid-template-areas:"sub-header" "header" "pre-content" "content-container" "post-body" "footer" "sub-footer"}:host .grid-template #sub-header{grid-area:sub-header}:host .grid-template #header{grid-area:header}:host .grid-template #pre-content{grid-area:pre-content}:host .grid-template #content-container{grid-area:content-container}:host .grid-template #post-body{grid-area:post-body}:host .grid-template #footer{grid-area:footer}:host .grid-template #sub-footer{grid-area:sub-footer}@media (max-width: 768px){:host .grid-template{padding:0px}}@media (min-width: 769px) and (max-width: 992px){:host .grid-template{padding:0px}}@media (min-width: 993px) and (max-width: 1920px){:host .grid-template{padding:0px}:host .grid-template #content-container #sidebar-left ::slotted(div[slot=sidebar-left]){margin-right:calc(var(--spacing) 5px)}:host .grid-template #content-container #sidebar-right ::slotted(div[slot=sidebar-right]){margin-left:calc(var(--spacing) * 5px)}:host .grid-template #content-container{display:-ms-flexbox;display:flex}:host .grid-template #content-container #content{-ms-flex-positive:1;flex-grow:1}:host .grid-template #content-container #sidebar-left,:host .grid-template #content-container #sidebar-right{max-width:20%}}@media (min-width: 1921px){:host .grid-template{padding:0px}:host .grid-template #content-container #sidebar-left ::slotted(div[slot=sidebar-left]){margin-right:calc(var(--spacing) * 7px)}:host .grid-template #content-container #sidebar-right ::slotted(div[slot=sidebar-right]){margin-left:calc(var(--spacing) * 7px)}:host .grid-template #content-container{display:-ms-flexbox;display:flex}:host .grid-template #content-container #content{-ms-flex-positive:1;flex-grow:1}:host .grid-template #content-container #sidebar-left,:host .grid-template #content-container #sidebar-right{max-width:20%}:host .grid-template #content-container.centered{max-width:1921px;justify-self:center}}';const f=class{constructor(o){t(this,o);this.contentwidth="default"}connectedCallback(){this.styles={"--spacing":window.CuraAPI.theme.spacing.getSpacing()}}getClasses(){const t={};t[this.contentwidth.toLowerCase()]=true;return t}render(){return o(e,null,o("div",{style:this.styles,class:"grid-template"},o("div",{id:"sub-header"},o("slot",{name:"sub-header"})),o("div",{id:"header"},o("slot",{name:"header"})),o("div",{id:"pre-content"},o("slot",{name:"pre-content"})),o("div",{id:"content-container",class:this.getClasses()},o("div",{id:"sidebar-left"},o("slot",{name:"sidebar-left"})),o("div",{id:"content"},o("slot",{name:"content"}),o("slot",null)),o("div",{id:"sidebar-right"},o("slot",{name:"sidebar-right"}))),o("div",{id:"post-body"},o("slot",{name:"post-body"})),o("div",{id:"footer"},o("slot",{name:"footer"})),o("div",{id:"sub-footer"},o("slot",{name:"sub-footer"}))))}get host(){return i(this)}};f.style=w;const x=":host{display:block;font-size:var(--font-size-base)}:host p{font-family:var(--font-family);font-size:var(--font-size-base);font-weight:var(--font-weight-regular);color:var(--color-body);line-height:var(--line-height);margin-block:var(--margin-block);letter-spacing:0.28px}:host p.large{font-size:1.214em;line-height:calc(var(--line-height) + 10%);letter-spacing:0px}:host p.small{font-size:0.85em;line-height:calc(var(--line-height) - 5%);letter-spacing:0.48px}:host p.caption,:host p.xsmall{font-size:0.714em;line-height:calc(var(--line-height) - 5%);letter-spacing:0.6px}@media (min-width: 769px) and (max-width: 1920px){:host p{font-size:1.143em;line-height:calc(var(--line-height) + 5%);letter-spacing:0.32px}:host p.large{font-size:1.357em;line-height:calc(var(--line-height) + 10%);letter-spacing:0px}:host p.small{font-size:1em;line-height:calc(var(--line-height) - 5%);letter-spacing:0.56px}:host p.caption,:host p.xsmall{font-size:0.85em;line-height:calc(var(--line-height) - 5%);letter-spacing:0.72px}}@media (min-width: 1921px){:host p{font-size:1.429em;line-height:calc(var(--line-height) + 10%);letter-spacing:0px}:host p.large{font-size:1.714em;line-height:calc(var(--line-height) + 20%)}:host p.small{font-size:1.21em;line-height:calc(var(--line-height) + 5%);letter-spacing:0px}:host p.caption,:host p.xsmall{font-size:1em;line-height:calc(var(--line-height) + 5%);letter-spacing:0.28px}}:host ::slotted(b),:host ::slotted(strong){font-weight:var(--font-weight-bold)}:host ::slotted(a){font-weight:var(--font-weight-medium);color:var(--color-link);text-underline-offset:10%}:host ::slotted(u){font-weight:var(--font-weight-medium);text-underline-offset:10%}:host ::slotted(abbr){color:var(--color-link);-webkit-text-decoration:underline dashed 1px var(--color-link);text-decoration:underline dashed 1px var(--color-link);text-underline-offset:10%;cursor:default}";const k=class{constructor(o){t(this,o);this.theme=window.CuraAPI.theme;this.size="medium";this.spotColor="accent-dark";this.color=undefined;this.marginBlock="1.25em";this.lineHeight="140%";this.styles={}}handleChangeColor(){this.setColors()}connectedCallback(){this.setFontProperties();this.setColors()}setsizeClass(){const t={};t[this.size.toLowerCase()]=true;return t}setFontProperties(){this.weights=this.theme.fonts.getWeights();this.fontSizeBase=this.theme.fonts.getSize();this.styles={"--font-family":this.theme.fonts.getFamily("body"),"--font-weight-regular":this.weights.regular,"--font-weight-medium":this.weights.medium,"--font-weight-bold":this.weights.bold}}setColors(){const t=this.color?this.theme.colors.getColor(this.color):this.theme.fonts.getColor();this.styles=Object.assign(Object.assign({},this.styles),{"--color-body":t\|\|this.theme.colors.getColor("neutral-darker"),"--color-link":this.theme.colors.getColor(`${this.spotColor}`)})}hostCSSProperties(){return{"--margin-block":this.marginBlock,"--font-size-base":this.fontSizeBase,"--line-height":this.lineHeight}}render(){return o(e,{style:this.hostCSSProperties()},o("p",{style:this.styles,class:this.setsizeClass()},o("slot",null)))}get host(){return i(this)}static get watchers(){return{color:["handleChangeColor"],spotColor:["handleChangeColor"]}}};k.style=x;export{n as cura_accordion,h as cura_accordion_item,d as cura_button,m as cura_heading,p as cura_icon,v as cura_loader_circle,f as cura_page_template,k as cura_paragraph};
2	+ //# sourceMappingURL=p-bb3f9d05.entry.js.map

package/dist/cura/p-bb3f9d05.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["curaAccordionCss","CuraAccordion","this","mutationObserverCallback","mutations","_","mutation","type","attributeName","_a","target","behavior","host","querySelectorAll","forEach","item","opened","addedNodes","Array","from","node","setChildProperties","mutationObserver","MutationObserver","handleChangeColor","setColors","connectedCallback","weights","window","CuraAPI","theme","fonts","getWeights","styles","spacing","getSpacing","colors","getColor","getSize","getFamily","regular","componentDidLoad","options","childList","subtree","attributes","observe","disconnectedCallback","disconnect","colorMode","iconColor","color","iconActiveColor","activeColor","iconSize","openIcon","closeIcon","Object","assign","render","h","Host","style","name","curaAccordionItemCss","CuraAccordionItem","getIconColor","inverted","getClasses","classes","accordionItemClick","slot","class","onClick","e","label","size","curaButtonCss","CuraButton","medium","textAlign","toLowerCase","iconPosition","iconOnly","fontColor","disabled","isLoading","getIcon","iconName","getSymbolColor","iconset","handleClick","preventDefault","href","curaHeadingCss","CuraHeading","setFontProperties","weight","fontSizeBase","bold","black","hostCSSProperties","marginBlock","lineHeight","spotColor","getHeadingTag","tags","default","level","curaIconCss","CuraIcon","sizeHandler","microIcons","includes","console","warn","scaledStroke","iconSizes","stroke","setHostProperty","colorHandler","assetsPath","localAssetsPath","prop","value","setProperty","version","viewBox","preserveAspectRatio","xmlns","xlinkHref","curaLoaderCircleCss","CuraLoaderCircle","sizes","xlarge","large","small","getPxSize","getStyles","fill","cx","cy","r","d","id","x1","y1","x2","y2","gradientUnits","offset","curaPageTemplateCss","CuraPageTemplate","contentwidth","curaParagraphCss","CuraParagraph","setsizeClass","sizeclass"],"sources":["./src/components/accordion/cura-accordion/cura-accordion.scss?tag=cura-accordion&encapsulation=shadow","./src/components/accordion/cura-accordion/cura-accordion.tsx","./src/components/accordion/cura-accordion-item/cura-accordion-item.scss?tag=cura-accordion-item&encapsulation=shadow","./src/components/accordion/cura-accordion-item/cura-accordion-item.tsx","./src/components/buttons/cura-button/cura-button.scss?tag=cura-button&encapsulation=shadow","./src/components/buttons/cura-button/cura-button.tsx","./src/components/text/cura-heading/cura-heading.scss?tag=cura-heading&encapsulation=shadow","./src/components/text/cura-heading/cura-heading.tsx","./src/components/cura-icon/cura-icon.scss?tag=cura-icon&encapsulation=shadow","./src/components/cura-icon/cura-icon.tsx","./src/components/loaders/cura-loader-circle/cura-loader-circle.scss?tag=cura-loader-circle&encapsulation=shadow","./src/components/loaders/cura-loader-circle/cura-loader-circle.tsx","./src/components/cura-page-template/cura-page-template.scss?tag=cura-page-template&encapsulation=shadow","./src/components/cura-page-template/cura-page-template.tsx","./src/components/text/cura-paragraph/cura-paragraph.scss?tag=cura-paragraph&encapsulation=shadow","./src/components/text/cura-paragraph/cura-paragraph.tsx"],"sourcesContent":[":host {\n display: block;\n color: var(--font-color);\n font-size: var(--font-size);\n font-size: var(--font-size);\n font-family: var(--font-family);\n font-weight: var(--font-weight-regular);\n\n &::after {\n content: \"\";\n display: block;\n border-bottom: solid 1px var(--neutral-base);\n width: 100%;\n }\n}\n\n","import { Component, Element, Host, Prop, State, Watch, h } from '@stencil/core';\n\n@Component({\n tag: 'cura-accordion',\n styleUrl: 'cura-accordion.scss',\n shadow: true,\n})\nexport class CuraAccordion {\n\n @Element() host: HTMLElement;\n\n /**\n * Color scheme base color\n */\n @Prop({reflect: true}) color = 'primary';\n @Prop({reflect: true}) activeColor = 'accent';\n @Watch('color')\n @Watch('activeColor')\n handleChangeColor() {\n this.setColors();\n }\n\n /**\n * Set the color mode to dark or light\n */\n @Prop({reflect: true}) colorMode: 'dark' | 'light' = 'dark';\n\n /**\n * Accordion items icons\n */\n @Prop({reflect: true}) iconSize = 32;\n @Prop({reflect: true}) openIcon = 'down';\n @Prop({reflect: true}) closeIcon = 'up';\n\n /**\n * Color scheme base color\n * (By default, the icon will use the same color of 'color' and 'activeColor')\n */\n @Prop({reflect: true}) iconColor = '';\n @Prop({reflect: true}) iconActiveColor = '';\n\n /**\n * Accordion behavior when item is clicked\n * (The default will close all items except the current one)\n */\n @Prop({reflect: true}) behavior: 'default' | 'keep-open' = 'default';\n\n mutationObserverCallback = (mutations: MutationRecord[], _: MutationObserver) => {\n for (const mutation of mutations) {\n if (mutation.type === 'attributes' && mutation.attributeName === 'opened' && mutation.target?.['opened']) {\n if (this.behavior !== 'default') continue;\n this.host.querySelectorAll('cura-accordion-item').forEach(item => {\n if (item != mutation.target) {\n item.opened = false;\n }\n });\n }\n if (mutation.type === 'childList') {\n const addedNodes = Array.from(mutation.addedNodes || []);\n for(let node of addedNodes) {\n this.setChildProperties(node as HTMLCuraAccordionItemElement);\n }\n }\n }\n }\n mutationObserver: MutationObserver = new MutationObserver(this.mutationObserverCallback);\n\n @State() styles = {};\n\n connectedCallback() {\n const weights = window.CuraAPI.theme.fonts.getWeights();\n this.styles['--base-spacing'] = window.CuraAPI.theme.spacing.getSpacing();\n this.styles['--neutral-purewhite'] = window.CuraAPI.theme.colors.getColor(`neutral-purewhite`);\n this.styles['--neutral-lighter'] = window.CuraAPI.theme.colors.getColor(`neutral-lighter`);\n this.styles['--neutral-base'] = window.CuraAPI.theme.colors.getColor(`neutral-base`);\n this.styles['--font-size'] = window.CuraAPI.theme.fonts.getSize();\n this.styles['--font-color'] = window.CuraAPI.theme.fonts.getColor();\n this.styles['--font-family'] = window.CuraAPI.theme.fonts.getFamily();\n this.styles['--font-weight-regular'] = weights.regular;\n this.setColors();\n }\n\n componentDidLoad() {\n this.host.querySelectorAll('cura-accordion-item').forEach(item => {\n this.setChildProperties(item);\n });\n const options: MutationObserverInit = {childList: true, subtree: true, attributes: true}\n this.mutationObserver.observe(this.host, options)\n }\n\n disconnectedCallback() {\n this.mutationObserver.disconnect();\n }\n\n setChildProperties(item: HTMLCuraAccordionItemElement) {\n // Theme\n item.colorMode = this.colorMode;\n item.iconColor = this.iconColor || this.color;\n item.iconActiveColor = this.iconActiveColor || this.activeColor;\n // Icon\n item.iconSize = this.iconSize;\n item.openIcon = this.openIcon;\n item.closeIcon = this.closeIcon;\n }\n\n setColors() {\n this.styles = {\n ...this.styles,\n '--color-lighter': window.CuraAPI.theme.colors.getColor(`${this.color}-lighter`),\n '--color-light': window.CuraAPI.theme.colors.getColor(`${this.color}-light`),\n '--color-base': window.CuraAPI.theme.colors.getColor(`${this.color}-base`),\n '--color-dark': window.CuraAPI.theme.colors.getColor(`${this.color}-dark`),\n '--color-active-lighter': window.CuraAPI.theme.colors.getColor(`${this.activeColor}-lighter`),\n '--color-active-light': window.CuraAPI.theme.colors.getColor(`${this.activeColor}-light`),\n '--color-active-base': window.CuraAPI.theme.colors.getColor(`${this.activeColor}-base`),\n '--color-active-dark': window.CuraAPI.theme.colors.getColor(`${this.activeColor}-dark`),\n\n '--icon-color-lighter': window.CuraAPI.theme.colors.getColor(`${this.iconColor || this.color}-lighter`),\n '--icon-color-light': window.CuraAPI.theme.colors.getColor(`${this.iconColor || this.color}-light`),\n '--icon-color-base': window.CuraAPI.theme.colors.getColor(`${this.iconColor || this.color}-base`),\n '--icon-color-dark': window.CuraAPI.theme.colors.getColor(`${this.iconColor || this.color}-dark`),\n '--icon-color-active-lighter': window.CuraAPI.theme.colors.getColor(`${this.iconActiveColor || this.activeColor}-lighter`),\n '--icon-color-active-light': window.CuraAPI.theme.colors.getColor(`${this.iconActiveColor || this.activeColor}-light`),\n '--icon-color-active-base': window.CuraAPI.theme.colors.getColor(`${this.iconActiveColor || this.activeColor}-base`),\n '--icon-color-active-dark': window.CuraAPI.theme.colors.getColor(`${this.iconActiveColor || this.activeColor}-dark`),\n };\n }\n\n render() {\n return (\n <Host style={this.styles}>\n <slot name='accordion-item'></slot>\n </Host>\n );\n }\n\n}\n","@import '../../../scss/mixins/responsive.scss';\n\n:host {\n display: block;\n\n .accordion-item {\n width: 100%;\n\n .label {\n display: flex;\n flex-direction: column;\n &::before {\n content: \"\";\n display: block;\n border-top: solid 1px var(--neutral-base);\n width: 100%;\n }\n .label-container {\n display: flex;\n flex-grow: 1;\n justify-content: space-between;\n align-items: center;\n gap: calc(var(--base-spacing) * 2px);\n min-height: 40px;\n word-break: break-word;\n cursor: pointer;\n font-size: 1.14em;\n font-weight: var(--font-weight-regular);\n color: var(--color-base);\n padding: 0px;\n\n cura-icon {\n margin-right: 4px;\n }\n\n &:hover {\n color: var(--color-light);\n cura-icon {\n --color: var(--icon-color-light) !important;\n }\n }\n &:active {\n color: var(--color-dark);\n cura-icon {\n --color: var(--icon-color-dark) !important;\n }\n }\n }\n }\n\n .content {\n font-size: 1em;\n overflow: hidden;\n max-height: 0;\n transition: max-height .25s ease;\n .content-wrapper {\n padding: calc(var(--base-spacing) * 2px) 0px;\n border-top: solid 1px var(--neutral-base);\n }\n }\n\n &.active {\n .label .label-container {\n color: var(--color-active-base);\n &:hover {\n color: var(--color-active-light);\n cura-icon {\n --color: var(--icon-color-active-light) !important;\n }\n }\n &:active {\n color: var(--color-active-dark);\n cura-icon {\n --color: var(--icon-color-active-dark) !important;\n }\n }\n }\n\n .content {\n max-height: 200vh;\n overflow-y: auto;\n transition: max-height .5s ease .14s;\n }\n }\n\n &.inverted {\n .label .label-container {\n color: var(--neutral-lighter);\n &:hover {\n color: var(--color-lighter);\n cura-icon {\n --color: var(--icon-color-lighter) !important;\n }\n }\n &:active {\n color: var(--color-light);\n cura-icon {\n --color: var(--icon-color-light) !important;\n }\n }\n }\n }\n\n &.active.inverted {\n .label .label-container {\n color: var(--neutral-purewhite);\n &:hover {\n color: var(--color-active-lighter);\n cura-icon {\n --color: var(--icon-color-active-lighter) !important;\n }\n }\n &:active {\n color: var(--color-active-light);\n cura-icon {\n --color: var(--icon-color-active-light) !important;\n }\n }\n }\n }\n }\n\n @include medium-only() {\n .accordion-item {\n .label .label-container {\n font-size: 1.29em;\n }\n\n .content {\n font-size: 1.14em;\n }\n }\n }\n\n @include large-up() {\n .accordion-item {\n .label .label-container {\n font-size: 1.29em;\n }\n\n .content {\n font-size: 1.14em;\n }\n }\n }\n}\n","import { Component, Host, Prop, State, h } from '@stencil/core';\n\n@Component({\n tag: 'cura-accordion-item',\n styleUrl: 'cura-accordion-item.scss',\n shadow: true,\n})\nexport class CuraAccordionItem {\n\n /**\n * Text label for accordion item\n */\n @Prop({reflect: true}) label: string = '';\n\n /** ***Properties below are inherited from the cura-accordion*** */\n /**\n * Accordion items icons\n */\n @Prop({reflect: true}) iconSize = 32;\n @Prop({reflect: true}) openIcon = 'down';\n @Prop({reflect: true}) closeIcon = 'up';\n\n /**\n * Color scheme base color\n * (By default, the icon will use the same color of 'color' and 'activeColor')\n */\n @Prop({reflect: true}) iconColor = '';\n @Prop({reflect: true}) iconActiveColor = '';\n\n /**\n * Set the color mode to dark or light\n */\n @Prop() colorMode: 'dark' | 'light' = 'dark';\n\n @Prop({ reflect: true, mutable: true }) opened: boolean = false;\n\n @State() styles = {};\n\n getIconColor() {\n const inverted = this.colorMode === 'light';\n const iconColor = inverted ? 'neutral-lighter' : `${this.iconColor}-base`;\n const iconActiveColor = inverted ? 'neutral-purewhite' : `${this.iconActiveColor}-base`;\n return this.opened ? iconActiveColor : iconColor;\n }\n\n getClasses() {\n const classes = {};\n classes['accordion-item'] = true;\n classes['active'] = this.opened;\n classes['inverted'] = this.colorMode === 'light';\n return classes;\n }\n\n accordionItemClick(_: Event) {\n this.opened = !this.opened;\n }\n\n render() {\n return (\n <Host slot=\"accordion-item\">\n <div class={this.getClasses()} style={this.styles}>\n <div class=\"label\" onClick={e => this.accordionItemClick(e)}>\n <div class=\"label-container\">\n <span>{this.label}</span>\n <cura-icon name={this.opened ? this.closeIcon : this.openIcon} size={this.iconSize} color={this.getIconColor()}></cura-icon>\n </div>\n </div>\n <div class='content'>\n <div class=\"content-wrapper\">\n <slot></slot>\n </div>\n </div>\n </div>\n </Host>\n );\n }\n\n}\n","@import \"../../../scss/mixins/buttons.scss\";\n\n:host {\n @include button-host();\n\n button, a {\n @include button-element() {\n background-color: var(--color-base);\n border: none;\n &:not(.isLoading):not(.disabled):hover { background-color: var(--color-light); }\n &:not(.isLoading):not(.disabled):active { background-color: var(--color-dark); }\n };\n @include button-shadow-behavior();\n @include button-sizes();\n\n // Children Elements\n @include button-container();\n @include button-label() {\n color: var(--neutral-black);\n &.inverted { color: var(--neutral-white); }\n }\n @include button-icon();\n\n // Disabled state\n @include button-disabled() {\n background-color: var(--neutral-light); \n .label, .label.inverted { color: var(--neutral-dark); }\n };\n\n // FAB / Icon-only\n @include button-icon-only-behavior();\n\n // Loading State\n @include button-loading();\n\n }\n}\n","import { Component, Host, h, Prop, Watch, State } from '@stencil/core';\n\n@Component({\n tag: 'cura-button',\n styleUrl: 'cura-button.scss',\n shadow: true,\n})\nexport class CuraButton {\n\n /**\n * Button size: small | medium | large (default)\n */\n @Prop({reflect: true}) size: 'small' | 'medium' | 'large' = 'medium';\n\n /**\n * Disabled state. Boolean.\n */\n @Prop({reflect: true}) disabled = false;\n /**\n * Loading state. Boolean.\n */\n @Prop({reflect: true}) isLoading = false;\n\n /**\n * Name of the icon to be used from iconset.\n */\n @Prop({reflect: true}) iconName: string;\n /**\n * Custom iconset if needed.\n */\n @Prop({reflect: true}) iconset = 'default';\n /**\n * Icon position: left (default) | right.\n */\n @Prop({reflect: true}) iconPosition: 'left' | 'right' = 'left';\n /**\n * Set button to FAB/icon only.\n */\n @Prop({reflect: true}) iconOnly = false;\n\n /**\n * Property href switch button to link.\n */\n @Prop({reflect: true}) href: string;\n /**\n * Set target if link.\n */\n @Prop({reflect: true}) target = \"_self\";\n\n /**\n * Color base from color scheme. Default: accent.\n */\n @Prop() color = 'accent';\n @Watch('color')\n handleChangeColor() {\n this.setColors();\n }\n /**\n * Set the font color to dark or light.\n */\n @Prop({reflect: true}) fontColor: 'dark' | 'light' = 'dark';\n /**\n * Set text aligment for the button label.\n * Vales: left (default) | center | right.\n */\n @Prop({reflect: true}) textAlign: 'left' | 'center' | 'right' = 'left';\n\n\n @State() styles = {};\n\n weights;\n\n connectedCallback() {\n this.weights = window.CuraAPI.theme.fonts.getWeights();\n this.styles['--base-spacing'] = window.CuraAPI.theme.spacing.getSpacing();\n this.styles['--neutral-white'] = window.CuraAPI.theme.colors.getColor(`neutral-white`);\n this.styles['--neutral-light'] = window.CuraAPI.theme.colors.getColor(`neutral-light`);\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 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['inverted'] = this.fontColor === 'light';\n classes['disabled'] = this.disabled;\n classes['isLoading'] = this.isLoading;\n return classes;\n }\n\n setColors() {\n this.styles = {\n ...this.styles,\n '--color-light': window.CuraAPI.theme.colors.getColor(`${this.color}-light`),\n '--color-base': window.CuraAPI.theme.colors.getColor(`${this.color}-base`),\n '--color-dark': window.CuraAPI.theme.colors.getColor(`${this.color}-dark`)\n };\n }\n\n getIcon() {\n if (!this.iconName) return '';\n const iconSize = this.size === 'small' ? 16 : this.size === 'medium' ? 20 : 24;\n const color = this.getSymbolColor();\n return <cura-icon name={this.iconName} iconset={this.iconset} size={iconSize} color={color}></cura-icon>;\n }\n\n getSymbolColor() {\n return this.disabled\n ? 'neutral-dark'\n : this.fontColor === 'light'\n ? 'neutral-white'\n : 'neutral-black';\n }\n\n handleClick(e: Event) {\n if (this.disabled || this.isLoading) e.preventDefault();\n }\n\n render() {\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 <span class=\"button-container\">\n { this.getIcon() }\n <span class={{label: true, inverted: this.fontColor === 'light'}}><slot></slot></span>\n </span>\n <cura-loader-circle size={this.size} color={this.getSymbolColor()}></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 <span class=\"button-container\">\n { this.getIcon() }\n <span class={{label: true, inverted: this.fontColor === 'light'}}><slot></slot></span>\n </span>\n <cura-loader-circle size={this.size} color={this.getSymbolColor()}></cura-loader-circle>\n </button>\n )}\n </Host>\n );\n }\n\n}\n","@import '../../../scss/mixins/responsive.scss';\n\n:host {\n display: block;\n font-size: var(--font-size-base);\n\n h1, h2, h3, h4, h5, h6 {\n font-family: var(--font-family);\n font-size: 1.714em;\n font-weight: var(--font-weight-regular);\n color: var(--color-body);\n line-height: var(--line-height);\n margin-block: var(--margin-block);\n letter-spacing: 0px;\n\n &.bold-weight {\n font-weight: var(--font-weight-medium);\n }\n\n &.large {\n font-size: 2.071em;\n letter-spacing: -0.58px;\n }\n\n &.small {\n font-size: 1.214em;\n line-height: calc(var(--line-height) + 20%);\n\n &.bold-weight, ::slotted(b), ::slotted(strong) {\n font-weight: var(--font-weight-bold);\n }\n }\n\n &.xsmall {\n font-size: 0.714em;\n font-weight: var(--font-weight-medium);\n letter-spacing: 0.6px;\n\n &.bold-weight, ::slotted(b), ::slotted(strong) {\n font-weight: var(--font-weight-bold);\n }\n }\n\n }\n\n @include medium-large() {\n h1, h2, h3, h4, h5, h6 {\n font-size: 2em;\n\n &.large {\n font-size: 2.357em;\n letter-spacing: -0.66px;\n }\n\n &.small {\n font-size: 1.357em;\n }\n\n &.xsmall {\n font-size: 0.857em;\n line-height: calc(var(--line-height) + 3%);\n letter-spacing: 0.72px;\n }\n\n }\n }\n\n @include xlarge-only() {\n h1, h2, h3, h4, h5, h6 {\n font-size: 2.5em;\n line-height: calc(var(--line-height) + 5%);\n letter-spacing: -0.82px;\n\n &.large {\n font-size: 2.929em;\n }\n\n &.small {\n font-size: 1.714em;\n line-height: calc(var(--line-height) + 30%);\n letter-spacing: 0%;\n }\n\n &.xsmall {\n font-size: 1em;\n line-height: calc(var(--line-height) + 12.857%);\n letter-spacing: 0.28px;\n }\n }\n }\n\n ::slotted(b), ::slotted(strong) {\n font-weight: var(--font-weight-medium);\n }\n\n ::slotted(a) {\n font-weight: var(--font-weight-bold);\n color: var(--color-link);\n text-underline-offset: 10%;\n cursor: pointer;\n }\n\n ::slotted(u) {\n text-underline-offset: 10%;\n }\n\n ::slotted(abbr) {\n color: var(--color-link);\n text-decoration: underline dashed 1px var(--color-link);\n text-underline-offset: 10%;\n cursor: default;\n }\n\n ::slotted(i), ::slotted(em) {\n font-weight: var(--font-weight-medium);\n }\n\n}\n","import { Component, Host, h, Prop, Element, Watch, State } from '@stencil/core';\n\n@Component({\n tag: 'cura-heading',\n styleUrl: 'cura-heading.scss',\n shadow: true,\n})\nexport class CuraHeading {\n\n /**\n * Heading level for semantics. Will render the related HTML tag <h1>, <h2>, ...\n * Values: 1(default) to 6.\n */\n @Prop({reflect: true}) level: 1 | 2 | 3 | 4 | 5 | 6 = 1;\n\n /**\n * Heading style size.\n * Values: regular (deprecated), medium (default) | large | small | caption (deprecated) | xsmall.\n */\n @Prop({reflect: true}) size: 'regular' | 'medium' | 'large' | 'small' | 'caption' | 'xsmall' = 'medium';\n\n /**\n * Heading font weight. It is possible to use regular HTML tags like <b> or <strong> as well.\n * Values: regular (default) | bold.\n */\n @Prop({reflect: true}) weight: 'regular' | 'bold' = 'regular';\n\n /**\n * Apply design system color to interactive elements like <a> and <abbr> inside the text.\n * Values: Color from design system scheme. Default to 'accent-dark'.\n */\n @Prop({reflect: true}) spotColor = 'accent-dark';\n\n /**\n * Text color.\n * Values: Color from design system scheme. Default to the font color from the theme.\n */\n @Prop() color: string;\n @Watch('color')\n @Watch('spotColor')\n handleChangeColor() {\n this.setColors();\n }\n\n /**\n * CSS margin-block property values.\n * Default to 1.25em\n */\n @Prop({reflect: true}) marginBlock = '1.25em';\n\n /**\n * CSS line-height property values.\n * Default to 140%\n */\n @Prop({reflect: true}) lineHeight = '130%';\n\n /**\n * Host element <cura-heading>\n */\n @Element() host: HTMLElement;\n\n /**\n * Internal Props\n */\n weights: any;\n fontSizeBase: string;\n @State() styles = {};\n theme = window.CuraAPI.theme;\n\n connectedCallback() {\n this.setFontProperties();\n this.setColors();\n }\n\n getClasses() {\n const classes = {};\n classes[this.size.toLowerCase()] = true;\n classes[`${this.weight.toLowerCase()}-weight`] = true;\n return classes;\n }\n\n setFontProperties() {\n this.weights = this.theme.fonts.getWeights();\n this.fontSizeBase = this.theme.fonts.getSize();\n this.styles = {\n '--font-family': window.CuraAPI.theme.fonts.getFamily('heading'),\n '--font-weight-regular': this.weights.regular,\n '--font-weight-medium': this.weights.medium,\n '--font-weight-bold': this.weights.bold,\n '--font-weight-black': this.weights.black\n }\n }\n\n hostCSSProperties() {\n return {\n '--margin-block': this.marginBlock,\n '--font-size-base': this.fontSizeBase,\n '--line-height': this.lineHeight\n };\n }\n\n setColors() {\n const fontColor = this.color\n ? this.theme.colors.getColor(this.color)\n : this.theme.fonts.getColor();\n this.styles = {\n ...this.styles,\n '--color-body': fontColor || this.theme.colors.getColor('neutral-darker'),\n '--color-link': this.theme.colors.getColor(`${this.spotColor}`)\n };\n }\n\n getHeadingTag() {\n const tags = {\n '1': <h1 style={this.styles} class={this.getClasses()}><slot></slot></h1>,\n '2': <h2 style={this.styles} class={this.getClasses()}><slot></slot></h2>,\n '3': <h3 style={this.styles} class={this.getClasses()}><slot></slot></h3>,\n '4': <h4 style={this.styles} class={this.getClasses()}><slot></slot></h4>,\n '5': <h5 style={this.styles} class={this.getClasses()}><slot></slot></h5>,\n '6': <h6 style={this.styles} class={this.getClasses()}><slot></slot></h6>,\n 'default': <h1 style={this.styles} class={this.getClasses()}><slot></slot></h1>\n };\n return tags[`${this.level}`] || tags['default'];\n }\n\n render() {\n return (\n <Host style={this.hostCSSProperties()}>\n { this.getHeadingTag() }\n </Host>\n );\n }\n\n}\n",":host {\n width: var(--size);\n height: var(--size);\n svg {\n display: inline-block;\n stroke: var(--color);\n width: var(--size);\n height: var(--size);\n stroke-width: var(--stroke);\n fill: none;\n }\n}\n","import { Component, Host, h, Prop, Element, Watch } from '@stencil/core';\nimport { microIcons, iconSizes } from './cura-icon.definitions';\n\n@Component({\n tag: 'cura-icon',\n styleUrl: 'cura-icon.scss',\n shadow: true\n})\nexport class CuraIcon {\n\n @Prop({reflect: true}) name = '';\n @Prop() color = 'neutral-base';\n @Prop() size: string | number;\n @Prop({reflect: true}) iconset = 'default';\n @Prop() disabled = false;\n\n @Element() host: HTMLElement;\n\n @Watch('size')\n sizeHandler(size: string | number) {\n if (size === 'micro' && !microIcons.includes(this.name) ) {\n size = 16;\n console.warn(`Icon ${this.name} doesn't support micro size. Minimum size of 16 was applied instead.`);\n }\n const scaledStroke = (iconSize: string | number) => {\n return `${iconSizes[iconSize].stroke * (iconSizes.default.size / iconSizes[iconSize].size)}px`;\n }\n this.setHostProperty('--size', iconSizes[`${size}`] ? `${iconSizes[size].size}px` : `${iconSizes.default.size}px`);\n this.setHostProperty('--stroke', iconSizes[`${size}`] ? scaledStroke(size) : scaledStroke(\"default\"));\n }\n\n @Watch('color')\n @Watch('disabled')\n colorHandler() {\n this.setHostProperty('--color', window.CuraAPI.theme.colors.getColor(this.disabled ? 'neutral-light' : this.color || 'neutral'));\n }\n\n assetsPath: string;\n\n connectedCallback() {\n this.assetsPath = window.CuraAPI.localAssetsPath;\n this.sizeHandler(this.size);\n this.colorHandler();\n }\n\n setHostProperty(prop: string, value: string) {\n this.host.style.setProperty(prop, value);\n }\n\n render() {\n return (\n <Host>\n <svg\n version=\"1.1\"\n viewBox=\"0 0 24 24\"\n preserveAspectRatio=\"xMidYMid meet\"\n xmlns=\"http://www.w3.org/2000/svg\">\n <use\n xlinkHref={`${this.assetsPath}/icons/iconset-${this.iconset}.svg#${this.name}`}>\n </use>\n </svg>\n </Host>\n );\n }\n\n}\n","@import '../../../scss/mixins/animations.scss';\n\n:host {\n display: inline-block;\n width: var(--size);\n height: var(--size);\n \n svg {\n width: var(--size);\n height: var(--size);\n animation: rotate .7s linear infinite;\n }\n\n circle, path {\n stroke-miterlimit: 10;\n stroke-linecap: round;\n stroke-linejoin: round;\n }\n\n path { stroke: var(--color); }\n\n stop { stop-color: var(--color); }\n linearGradient stop:first-child {\n stop-opacity: 0.14;\n }\n}\n\n@include rotate();\n\n","import { Component, Host, h, Prop } from '@stencil/core';\n\n@Component({\n tag: 'cura-loader-circle',\n styleUrl: 'cura-loader-circle.scss',\n shadow: true,\n})\nexport class CuraLoaderCircle {\n\n /**\n * Loader size. Values: small, medium or large.\n */\n @Prop({reflect: true}) size: 'small' | 'medium' | 'large' | 'xlarge' = 'medium';\n /**\n * One from color scheme. Default: neutral-white.\n */\n @Prop({reflect: true}) color = 'neutral-white';\n\n sizes = {\n xlarge: 32,\n large: 24,\n medium: 20,\n small: 16,\n default: 16,\n };\n\n getPxSize = () => this.sizes[this.size] || this.sizes['default'];\n\n getStyles() {\n return {\n '--size': `${this.getPxSize()}px`,\n '--color': window.CuraAPI.theme.colors.getColor(this.color)\n }\n }\n\n render() {\n return (\n <Host style={this.getStyles()}>\n <svg viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <g>\n <circle cx=\"8\" cy=\"8\" r=\"7\" stroke=\"url(#paint0_linear_13485_11488)\" stroke-width=\"2\"/>\n <path 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\"/>\n </g>\n <defs>\n <linearGradient id=\"paint0_linear_13485_11488\" x1=\"15.7\" y1=\"4.5\" x2=\"4.15\" y2=\"11.5\" gradientUnits=\"userSpaceOnUse\">\n <stop/>\n <stop offset=\"1\"/>\n </linearGradient>\n </defs>\n </svg>\n </Host>\n );\n }\n\n}\n","@import '../../scss/mixins/responsive.scss';\n\n@mixin template-spacing($spacing-scale: 0px, $large-device: false) {\n $spacing-px: calc(var(--spacing) * $spacing-scale);\n padding: 0px;\n @if $large-device {\n #content-container {\n #sidebar-left ::slotted(div[slot=\"sidebar-left\"]) {\n margin-right: $spacing-px;\n }\n #sidebar-right ::slotted(div[slot=\"sidebar-right\"]) {\n margin-left: $spacing-px;\n }\n }\n }\n}\n\n:host {\n display: block;\n\n .grid-template {\n display: grid;\n grid-template-rows: auto;\n grid-template-columns: auto;\n grid-template-areas:\n 'sub-header'\n 'header'\n 'pre-content'\n 'content-container'\n 'post-body'\n 'footer'\n 'sub-footer';\n\n #sub-header {\n grid-area: sub-header;\n }\n\n #header {\n grid-area: header;\n }\n\n #pre-content {\n grid-area: pre-content;\n }\n\n #content-container {\n grid-area: content-container;\n }\n\n #post-body {\n grid-area: post-body;\n }\n\n #footer {\n grid-area: footer;\n }\n\n #sub-footer {\n grid-area: sub-footer;\n }\n\n @include mobile-only() {\n $spacing-scale: 4px;\n @include template-spacing($spacing-scale);\n }\n\n @include medium-only() {\n $spacing-scale: 5px;\n @include template-spacing($spacing-scale);\n }\n\n @include large-only() {\n $spacing-scale: 5px;\n @include template-spacing($spacing-scale, true);\n #content-container {\n display: flex;\n #content {\n flex-grow: 1;\n }\n #sidebar-left, #sidebar-right {\n max-width: 20%;\n }\n }\n }\n\n @include xlarge-only() {\n $spacing-scale: 7px;\n @include template-spacing($spacing-scale, true);\n #content-container {\n display: flex;\n #content {\n flex-grow: 1;\n }\n #sidebar-left, #sidebar-right {\n max-width: 20%;\n }\n &.centered {\n max-width: $breakpoint-xlarge-min;\n justify-self: center;\n }\n }\n }\n }\n}\n","import { Component, Element, Host, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'cura-page-template',\n styleUrl: 'cura-page-template.scss',\n shadow: true,\n})\nexport class CuraPageTemplate {\n\n @Prop({reflect: true}) contentwidth: 'default' | 'centered' = 'default';\n\n @Element() host: HTMLElement;\n\n styles: any;\n\n connectedCallback() {\n this.styles = {\n '--spacing': window.CuraAPI.theme.spacing.getSpacing(),\n }\n }\n\n getClasses() {\n const classes = {};\n classes[this.contentwidth.toLowerCase()] = true;\n return classes;\n }\n\n render() {\n return (\n <Host>\n <div style={this.styles} class=\"grid-template\">\n <div id=\"sub-header\">\n <slot name='sub-header'></slot>\n </div>\n <div id=\"header\">\n <slot name='header'></slot>\n </div>\n <div id=\"pre-content\">\n <slot name='pre-content'></slot>\n </div>\n <div id=\"content-container\" class={this.getClasses()}>\n <div id=\"sidebar-left\">\n <slot name='sidebar-left'></slot>\n </div>\n <div id=\"content\">\n <slot name=\"content\"></slot>\n <slot></slot>\n </div>\n <div id=\"sidebar-right\">\n <slot name='sidebar-right'></slot>\n </div>\n </div>\n <div id=\"post-body\">\n <slot name='post-body'></slot>\n </div>\n <div id=\"footer\">\n <slot name='footer'></slot>\n </div>\n <div id=\"sub-footer\">\n <slot name='sub-footer'></slot>\n </div>\n </div>\n </Host>\n );\n }\n\n}\n","@import '../../../scss/mixins/responsive.scss';\n\n:host {\n display: block;\n font-size: var(--font-size-base);\n\n p {\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n font-weight: var(--font-weight-regular);\n color: var(--color-body);\n line-height: var(--line-height);\n margin-block: var(--margin-block);\n letter-spacing: 0.28px;\n\n &.large {\n font-size: 1.214em;\n line-height: calc(var(--line-height) + 10%);\n letter-spacing: 0px;\n }\n\n &.small {\n font-size: 0.85em;\n line-height: calc(var(--line-height) - 5%);\n letter-spacing: 0.48px;\n }\n\n &.caption, &.xsmall {\n font-size: 0.714em;\n line-height: calc(var(--line-height) - 5%);\n letter-spacing: 0.6px;\n }\n }\n\n @include medium-large() {\n p {\n font-size: 1.143em;\n line-height: calc(var(--line-height) + 5%);\n letter-spacing: 0.32px;\n\n &.large {\n font-size: 1.357em;\n line-height: calc(var(--line-height) + 10%);\n letter-spacing: 0px;\n }\n\n &.small {\n font-size: 1em;\n line-height: calc(var(--line-height) - 5%);\n letter-spacing: 0.56px;\n }\n\n &.caption, &.xsmall {\n font-size: 0.85em;\n line-height: calc(var(--line-height) - 5%);\n letter-spacing: 0.72px;\n }\n }\n }\n\n @include xlarge-only() {\n p {\n font-size: 1.429em;\n line-height: calc(var(--line-height) + 10%);\n letter-spacing: 0px;\n\n &.large {\n font-size: 1.714em;\n line-height: calc(var(--line-height) + 20%);\n }\n\n &.small {\n font-size: 1.21em;\n line-height: calc(var(--line-height) + 5%);\n letter-spacing: 0px;\n }\n\n &.caption, &.xsmall {\n font-size: 1em;\n line-height: calc(var(--line-height) + 5%);\n letter-spacing: 0.28px;\n }\n }\n }\n\n ::slotted(b), ::slotted(strong) {\n font-weight: var(--font-weight-bold);\n }\n\n ::slotted(a) {\n font-weight: var(--font-weight-medium);\n color: var(--color-link);\n text-underline-offset: 10%;\n }\n\n ::slotted(u) {\n font-weight: var(--font-weight-medium);\n text-underline-offset: 10%;\n }\n\n ::slotted(abbr) {\n color: var(--color-link);\n text-decoration: underline dashed 1px var(--color-link);\n text-underline-offset: 10%;\n cursor: default;\n }\n\n}\n\n","import { Component, Host, Prop, h, Element, Watch, State } from '@stencil/core';\n\n@Component({\n tag: 'cura-paragraph',\n styleUrl: 'cura-paragraph.scss',\n shadow: true,\n})\nexport class CuraParagraph {\n\n /**\n * Set size of body text.\n * Values: regular (deprecated), medium (default) | large | small | caption (deprecated) | xsmall.\n */\n @Prop({reflect: true}) size: 'regular' | 'medium' | 'large' | 'small' | 'caption' | 'xsmall' = 'medium';\n\n /**\n * Apply design system color to interactive elements like <a> and <abbr> inside the text.\n * Values: Color from design system scheme. Default to 'accent-dark'.\n */\n @Prop({reflect: true}) spotColor = 'accent-dark';\n\n /**\n * Text color.\n * Values: Color from design system scheme. Default to the font color from the theme.\n */\n @Prop() color: string;\n @Watch('color')\n @Watch('spotColor')\n handleChangeColor() {\n this.setColors();\n }\n\n /**\n * CSS margin-block property values.\n * Default to 1.25em\n */\n @Prop({reflect: true}) marginBlock = '1.25em';\n\n /**\n * CSS line-height property values.\n * Default to 140%\n */\n @Prop({reflect: true}) lineHeight = '140%';\n\n /**\n * Host element <cura-paragraph>\n */\n @Element() host: HTMLElement;\n\n /**\n * Internal Props\n */\n weights: any;\n fontSizeBase: string;\n @State() styles = {};\n theme = window.CuraAPI.theme;\n\n connectedCallback() {\n this.setFontProperties();\n this.setColors();\n }\n\n setsizeClass() {\n const sizeclass = {};\n sizeclass[this.size.toLowerCase()] = true;\n return sizeclass;\n }\n\n setFontProperties() {\n this.weights = this.theme.fonts.getWeights();\n this.fontSizeBase = this.theme.fonts.getSize();\n this.styles = {\n '--font-family': this.theme.fonts.getFamily('body'),\n '--font-weight-regular': this.weights.regular,\n '--font-weight-medium': this.weights.medium,\n '--font-weight-bold': this.weights.bold\n };\n }\n\n setColors() {\n const fontColor = this.color\n ? this.theme.colors.getColor(this.color)\n : this.theme.fonts.getColor();\n this.styles = {\n ...this.styles,\n '--color-body': fontColor || this.theme.colors.getColor('neutral-darker'),\n '--color-link': this.theme.colors.getColor(`${this.spotColor}`)\n };\n }\n\n hostCSSProperties() {\n return {\n '--margin-block': this.marginBlock,\n '--font-size-base': this.fontSizeBase,\n '--line-height': this.lineHeight\n };\n }\n\n render() {\n return (\n <Host style={this.hostCSSProperties()}>\n <p style={this.styles} class={this.setsizeClass()}>\n <slot></slot>\n </p>\n </Host>\n );\n }\n\n}\n"],"mappings":"oGAAA,MAAMA,EAAmB,wQ,MCOZC,EAAa,M,yBAwCxBC,KAAAC,yBAA2B,CAACC,EAA6BC,K,MACvD,IAAK,MAAMC,KAAYF,EAAW,CAChC,GAAIE,EAASC,OAAS,cAAgBD,EAASE,gBAAkB,YAAYC,EAAAH,EAASI,UAAM,MAAAD,SAAA,SAAAA,EAAG,WAAW,CACxG,GAAIP,KAAKS,WAAa,UAAW,SACjCT,KAAKU,KAAKC,iBAAiB,uBAAuBC,SAAQC,IACxD,GAAIA,GAAQT,EAASI,OAAQ,CAC3BK,EAAKC,OAAS,K,KAIpB,GAAIV,EAASC,OAAS,YAAa,CACjC,MAAMU,EAAaC,MAAMC,KAAKb,EAASW,YAAc,IACrD,IAAI,IAAIG,KAAQH,EAAY,CAC1Bf,KAAKmB,mBAAmBD,E,KAKhClB,KAAAoB,iBAAqC,IAAIC,iBAAiBrB,KAAKC,0B,WAnDhC,U,iBACM,S,eAUgB,O,cAKnB,G,cACA,O,eACC,K,eAMA,G,qBACM,G,cAMkB,U,YAsBzC,E,CAjDlBqB,oBACEtB,KAAKuB,W,CAkDPC,oBACE,MAAMC,EAAUC,OAAOC,QAAQC,MAAMC,MAAMC,aAC3C9B,KAAK+B,OAAO,kBAAoBL,OAAOC,QAAQC,MAAMI,QAAQC,aAC7DjC,KAAK+B,OAAO,uBAAyBL,OAAOC,QAAQC,MAAMM,OAAOC,SAAS,qBAC1EnC,KAAK+B,OAAO,qBAAuBL,OAAOC,QAAQC,MAAMM,OAAOC,SAAS,mBACxEnC,KAAK+B,OAAO,kBAAoBL,OAAOC,QAAQC,MAAMM,OAAOC,SAAS,gBACrEnC,KAAK+B,OAAO,eAAiBL,OAAOC,QAAQC,MAAMC,MAAMO,UACxDpC,KAAK+B,OAAO,gBAAkBL,OAAOC,QAAQC,MAAMC,MAAMM,WACzDnC,KAAK+B,OAAO,iBAAmBL,OAAOC,QAAQC,MAAMC,MAAMQ,YAC1DrC,KAAK+B,OAAO,yBAA2BN,EAAQa,QAC/CtC,KAAKuB,W,CAGPgB,mBACEvC,KAAKU,KAAKC,iBAAiB,uBAAuBC,SAAQC,IACxDb,KAAKmB,mBAAmBN,EAAK,IAE/B,MAAM2B,EAAgC,CAACC,UAAW,KAAMC,QAAS,KAAMC,WAAY,MACnF3C,KAAKoB,iBAAiBwB,QAAQ5C,KAAKU,KAAM8B,E,CAG3CK,uBACE7C,KAAKoB,iBAAiB0B,Y,CAGxB3B,mBAAmBN,GAEjBA,EAAKkC,UAAY/C,KAAK+C,UACtBlC,EAAKmC,UAAYhD,KAAKgD,WAAahD,KAAKiD,MACxCpC,EAAKqC,gBAAkBlD,KAAKkD,iBAAmBlD,KAAKmD,YAEpDtC,EAAKuC,SAAWpD,KAAKoD,SACrBvC,EAAKwC,SAAWrD,KAAKqD,SACrBxC,EAAKyC,UAAYtD,KAAKsD,S,CAGxB/B,YACEvB,KAAK+B,OAAMwB,OAAAC,OAAAD,OAAAC,OAAA,GACNxD,KAAK+B,QAAM,CACd,kBAAmBL,OAAOC,QAAQC,MAAMM,OAAOC,SAAS,GAAGnC,KAAKiD,iBAChE,gBAAiBvB,OAAOC,QAAQC,MAAMM,OAAOC,SAAS,GAAGnC,KAAKiD,eAC9D,eAAgBvB,OAAOC,QAAQC,MAAMM,OAAOC,SAAS,GAAGnC,KAAKiD,cAC7D,eAAgBvB,OAAOC,QAAQC,MAAMM,OAAOC,SAAS,GAAGnC,KAAKiD,cAC7D,yBAA0BvB,OAAOC,QAAQC,MAAMM,OAAOC,SAAS,GAAGnC,KAAKmD,uBACvE,uBAAwBzB,OAAOC,QAAQC,MAAMM,OAAOC,SAAS,GAAGnC,KAAKmD,qBACrE,sBAAuBzB,OAAOC,QAAQC,MAAMM,OAAOC,SAAS,GAAGnC,KAAKmD,oBACpE,sBAAuBzB,OAAOC,QAAQC,MAAMM,OAAOC,SAAS,GAAGnC,KAAKmD,oBAEpE,uBAAwBzB,OAAOC,QAAQC,MAAMM,OAAOC,SAAS,GAAGnC,KAAKgD,WAAahD,KAAKiD,iBACvF,qBAAsBvB,OAAOC,QAAQC,MAAMM,OAAOC,SAAS,GAAGnC,KAAKgD,WAAahD,KAAKiD,eACrF,oBAAqBvB,OAAOC,QAAQC,MAAMM,OAAOC,SAAS,GAAGnC,KAAKgD,WAAahD,KAAKiD,cACpF,oBAAqBvB,OAAOC,QAAQC,MAAMM,OAAOC,SAAS,GAAGnC,KAAKgD,WAAahD,KAAKiD,cACpF,8BAA+BvB,OAAOC,QAAQC,MAAMM,OAAOC,SAAS,GAAGnC,KAAKkD,iBAAmBlD,KAAKmD,uBACpG,4BAA6BzB,OAAOC,QAAQC,MAAMM,OAAOC,SAAS,GAAGnC,KAAKkD,iBAAmBlD,KAAKmD,qBAClG,2BAA4BzB,OAAOC,QAAQC,MAAMM,OAAOC,SAAS,GAAGnC,KAAKkD,iBAAmBlD,KAAKmD,oBACjG,2BAA4BzB,OAAOC,QAAQC,MAAMM,OAAOC,SAAS,GAAGnC,KAAKkD,iBAAmBlD,KAAKmD,qB,CAIrGM,SACE,OACEC,EAACC,EAAI,CAACC,MAAO5D,KAAK+B,QAChB2B,EAAA,QAAMG,KAAK,mB,mICnInB,MAAMC,EAAuB,0zG,MCOhBC,EAAiB,M,oCAKW,G,cAML,G,cACA,O,eACC,K,eAMA,G,qBACM,G,eAKH,O,YAEoB,M,YAExC,E,CAElBC,eACE,MAAMC,EAAWjE,KAAK+C,YAAc,QACpC,MAAMC,EAAYiB,EAAW,kBAAoB,GAAGjE,KAAKgD,iBACzD,MAAME,EAAkBe,EAAW,oBAAsB,GAAGjE,KAAKkD,uBACjE,OAAOlD,KAAKc,OAASoC,EAAkBF,C,CAGzCkB,aACE,MAAMC,EAAU,GAChBA,EAAQ,kBAAoB,KAC5BA,EAAQ,UAAYnE,KAAKc,OACzBqD,EAAQ,YAAcnE,KAAK+C,YAAc,QACzC,OAAOoB,C,CAGTC,mBAAmBjE,GACjBH,KAAKc,QAAUd,KAAKc,M,CAGtB2C,SACE,OACEC,EAACC,EAAI,CAACU,KAAK,kBACTX,EAAA,OAAKY,MAAOtE,KAAKkE,aAAcN,MAAO5D,KAAK+B,QACzC2B,EAAA,OAAKY,MAAM,QAAQC,QAASC,GAAKxE,KAAKoE,mBAAmBI,IACvDd,EAAA,OAAKY,MAAM,mBACTZ,EAAA,YAAO1D,KAAKyE,OACZf,EAAA,aAAWG,KAAM7D,KAAKc,OAASd,KAAKsD,UAAYtD,KAAKqD,SAAUqB,KAAM1E,KAAKoD,SAAUH,MAAOjD,KAAKgE,mBAGpGN,EAAA,OAAKY,MAAM,WACTZ,EAAA,OAAKY,MAAM,mBACTZ,EAAA,gB,aCrEd,MAAMiB,EAAgB,g2J,MCOTC,EAAU,M,mCAKuC,S,cAK1B,M,eAIC,M,qCASF,U,kBAIuB,O,cAItB,M,gCASF,Q,WAKhB,S,eAQqC,O,eAKW,O,YAG9C,E,CAdlBtD,oBACEtB,KAAKuB,W,CAiBPC,oBACExB,KAAKyB,QAAUC,OAAOC,QAAQC,MAAMC,MAAMC,aAC1C9B,KAAK+B,OAAO,kBAAoBL,OAAOC,QAAQC,MAAMI,QAAQC,aAC7DjC,KAAK+B,OAAO,mBAAqBL,OAAOC,QAAQC,MAAMM,OAAOC,SAAS,iBACtEnC,KAAK+B,OAAO,mBAAqBL,OAAOC,QAAQC,MAAMM,OAAOC,SAAS,iBACtEnC,KAAK+B,OAAO,kBAAoBL,OAAOC,QAAQC,MAAMM,OAAOC,SAAS,gBACrEnC,KAAK+B,OAAO,eAAiBL,OAAOC,QAAQC,MAAMC,MAAMO,UACxDpC,KAAK+B,OAAO,iBAAmBL,OAAOC,QAAQC,MAAMC,MAAMQ,YAC1DrC,KAAK+B,OAAO,wBAA0B/B,KAAKyB,QAAQoD,OACnD7E,KAAK+B,OAAO,gBAAkB/B,KAAK8E,UACnC9E,KAAKuB,W,CAGP2C,aACE,MAAMC,EAAU,GAChBA,EAAQ,GAAGnE,KAAK0E,KAAKK,iBAAmB,KACxCZ,EAAQ,QAAQnE,KAAKgF,aAAaD,iBAAmB,KACrDZ,EAAQ,aAAenE,KAAKiF,SAC5Bd,EAAQ,YAAcnE,KAAKkF,YAAc,QACzCf,EAAQ,YAAcnE,KAAKmF,SAC3BhB,EAAQ,aAAenE,KAAKoF,UAC5B,OAAOjB,C,CAGT5C,YACEvB,KAAK+B,OAAMwB,OAAAC,OAAAD,OAAAC,OAAA,GACNxD,KAAK+B,QAAM,CACd,gBAAiBL,OAAOC,QAAQC,MAAMM,OAAOC,SAAS,GAAGnC,KAAKiD,eAC9D,eAAgBvB,OAAOC,QAAQC,MAAMM,OAAOC,SAAS,GAAGnC,KAAKiD,cAC7D,eAAgBvB,OAAOC,QAAQC,MAAMM,OAAOC,SAAS,GAAGnC,KAAKiD,e,CAIjEoC,UACE,IAAKrF,KAAKsF,SAAU,MAAO,GAC3B,MAAMlC,EAAWpD,KAAK0E,OAAS,QAAU,GAAK1E,KAAK0E,OAAS,SAAW,GAAK,GAC5E,MAAMzB,EAAQjD,KAAKuF,iBACnB,OAAO7B,EAAA,aAAWG,KAAM7D,KAAKsF,SAAUE,QAASxF,KAAKwF,QAASd,KAAMtB,EAAUH,MAAOA,G,CAGvFsC,iBACE,OAAOvF,KAAKmF,SACR,eACAnF,KAAKkF,YAAc,QACjB,gBACA,e,CAGRO,YAAYjB,GACV,GAAIxE,KAAKmF,UAAYnF,KAAKoF,UAAWZ,EAAEkB,gB,CAGzCjC,SACE,OACEC,EAACC,EAAI,KACH3D,KAAK2F,KACLjC,EAAA,KAAGiC,KAAM3F,KAAKmF,SAAW,GAAKnF,KAAK2F,KACjCnF,OAAQR,KAAKQ,OACb8D,MAAOtE,KAAKkE,aACZN,MAAO5D,KAAK+B,OACZwC,QAAUC,GAAMxE,KAAKyF,YAAYjB,IACjCd,EAAA,QAAMY,MAAM,oBACRtE,KAAKqF,UACP3B,EAAA,QAAMY,MAAO,CAACG,MAAO,KAAMR,SAAUjE,KAAKkF,YAAc,UAAUxB,EAAA,eAEpEA,EAAA,sBAAoBgB,KAAM1E,KAAK0E,KAAMzB,MAAOjD,KAAKuF,oBAGnD7B,EAAA,UAAQY,MAAOtE,KAAKkE,aAClBN,MAAO5D,KAAK+B,OACZoD,SAAUnF,KAAKmF,UAAY,KAC3BZ,QAAUC,GAAMxE,KAAKyF,YAAYjB,IACjCd,EAAA,QAAMY,MAAM,oBACRtE,KAAKqF,UACP3B,EAAA,QAAMY,MAAO,CAACG,MAAO,KAAMR,SAAUjE,KAAKkF,YAAc,UAAUxB,EAAA,eAEpEA,EAAA,sBAAoBgB,KAAM1E,KAAK0E,KAAMzB,MAAOjD,KAAKuF,oB,uECpJ3D,MAAMK,EAAiB,wqH,MCOVC,EAAW,M,yBA4DtB7F,KAAA4B,MAAQF,OAAOC,QAAQC,M,WAtDgC,E,UAMwC,S,YAM3C,U,eAMjB,c,sCAiBE,S,gBAMD,O,YAYlB,E,CA1BlBN,oBACEtB,KAAKuB,W,CA4BPC,oBACExB,KAAK8F,oBACL9F,KAAKuB,W,CAGP2C,aACE,MAAMC,EAAU,GAChBA,EAAQnE,KAAK0E,KAAKK,eAAkB,KACpCZ,EAAQ,GAAGnE,KAAK+F,OAAOhB,wBAA0B,KACjD,OAAOZ,C,CAGT2B,oBACE9F,KAAKyB,QAAUzB,KAAK4B,MAAMC,MAAMC,aAChC9B,KAAKgG,aAAehG,KAAK4B,MAAMC,MAAMO,UACrCpC,KAAK+B,OAAS,CACZ,gBAAiBL,OAAOC,QAAQC,MAAMC,MAAMQ,UAAU,WACtD,wBAAyBrC,KAAKyB,QAAQa,QACtC,uBAAwBtC,KAAKyB,QAAQoD,OACrC,qBAAsB7E,KAAKyB,QAAQwE,KACnC,sBAAuBjG,KAAKyB,QAAQyE,M,CAIxCC,oBACE,MAAO,CACL,iBAAkBnG,KAAKoG,YACvB,mBAAoBpG,KAAKgG,aACzB,gBAAiBhG,KAAKqG,W,CAI1B9E,YACE,MAAM2D,EAAYlF,KAAKiD,MACnBjD,KAAK4B,MAAMM,OAAOC,SAASnC,KAAKiD,OAChCjD,KAAK4B,MAAMC,MAAMM,WACrBnC,KAAK+B,OAAMwB,OAAAC,OAAAD,OAAAC,OAAA,GACNxD,KAAK+B,QAAM,CACd,eAAgBmD,GAAalF,KAAK4B,MAAMM,OAAOC,SAAS,kBACxD,eAAgBnC,KAAK4B,MAAMM,OAAOC,SAAS,GAAGnC,KAAKsG,c,CAIvDC,gBACE,MAAMC,EAAO,CACX,EAAK9C,EAAA,MAAIE,MAAO5D,KAAK+B,OAAQuC,MAAOtE,KAAKkE,cAAcR,EAAA,cACvD,EAAKA,EAAA,MAAIE,MAAO5D,KAAK+B,OAAQuC,MAAOtE,KAAKkE,cAAcR,EAAA,cACvD,EAAKA,EAAA,MAAIE,MAAO5D,KAAK+B,OAAQuC,MAAOtE,KAAKkE,cAAcR,EAAA,cACvD,EAAKA,EAAA,MAAIE,MAAO5D,KAAK+B,OAAQuC,MAAOtE,KAAKkE,cAAcR,EAAA,cACvD,EAAKA,EAAA,MAAIE,MAAO5D,KAAK+B,OAAQuC,MAAOtE,KAAKkE,cAAcR,EAAA,cACvD,EAAKA,EAAA,MAAIE,MAAO5D,KAAK+B,OAAQuC,MAAOtE,KAAKkE,cAAcR,EAAA,cACvD+C,QAAW/C,EAAA,MAAIE,MAAO5D,KAAK+B,OAAQuC,MAAOtE,KAAKkE,cAAcR,EAAA,eAE/D,OAAO8C,EAAK,GAAGxG,KAAK0G,UAAYF,EAAK,U,CAGvC/C,SACE,OACEC,EAACC,EAAI,CAACC,MAAO5D,KAAKmG,qBACdnG,KAAKuG,gB,iIChIf,MAAMI,EAAc,2K,MCQPC,EAAQ,M,mCAEW,G,WACd,e,iCAEiB,U,cACd,K,CAKnBC,YAAYnC,GACV,GAAIA,IAAS,UAAYoC,EAAWC,SAAS/G,KAAK6D,MAAQ,CACxDa,EAAO,GACPsC,QAAQC,KAAK,QAAQjH,KAAK6D,2E,CAE5B,MAAMqD,EAAgB9D,GACb,GAAG+D,EAAU/D,GAAUgE,QAAUD,EAAUV,QAAQ/B,KAAOyC,EAAU/D,GAAUsB,UAEvF1E,KAAKqH,gBAAgB,SAAUF,EAAU,GAAGzC,KAAU,GAAGyC,EAAUzC,GAAMA,SAAW,GAAGyC,EAAUV,QAAQ/B,UACzG1E,KAAKqH,gBAAgB,WAAYF,EAAU,GAAGzC,KAAUwC,EAAaxC,GAAQwC,EAAa,W,CAK5FI,eACEtH,KAAKqH,gBAAgB,UAAW3F,OAAOC,QAAQC,MAAMM,OAAOC,SAASnC,KAAKmF,SAAW,gBAAkBnF,KAAKiD,OAAS,W,CAKvHzB,oBACExB,KAAKuH,WAAa7F,OAAOC,QAAQ6F,gBACjCxH,KAAK6G,YAAY7G,KAAK0E,MACtB1E,KAAKsH,c,CAGPD,gBAAgBI,EAAcC,GAC5B1H,KAAKU,KAAKkD,MAAM+D,YAAYF,EAAMC,E,CAGpCjE,SACE,OACEC,EAACC,EAAI,KACHD,EAAA,OACEkE,QAAQ,MACRC,QAAQ,YACRC,oBAAoB,gBACpBC,MAAM,8BACNrE,EAAA,OACEsE,UAAW,GAAGhI,KAAKuH,4BAA4BvH,KAAKwF,eAAexF,KAAK6D,U,2IC1DpF,MAAMoE,EAAsB,0qB,MCOfC,EAAgB,M,yBAW3BlI,KAAAmI,MAAQ,CACNC,OAAQ,GACRC,MAAO,GACPxD,OAAQ,GACRyD,MAAO,GACP7B,QAAS,IAGXzG,KAAAuI,UAAY,IAAMvI,KAAKmI,MAAMnI,KAAK0E,OAAS1E,KAAKmI,MAAM,W,UAdiB,S,WAIxC,e,CAY/BK,YACE,MAAO,CACL,SAAU,GAAGxI,KAAKuI,gBAClB,UAAW7G,OAAOC,QAAQC,MAAMM,OAAOC,SAASnC,KAAKiD,O,CAIzDQ,SACE,OACEC,EAACC,EAAI,CAACC,MAAO5D,KAAKwI,aAChB9E,EAAA,OAAKmE,QAAQ,YAAYY,KAAK,OAAOV,MAAM,8BACzCrE,EAAA,SACEA,EAAA,UAAQgF,GAAG,IAAIC,GAAG,IAAIC,EAAE,IAAIxB,OAAO,kCAAiC,eAAc,MAClF1D,EAAA,QAAMmF,EAAE,kHAAiH,eAAc,OAEzInF,EAAA,YACEA,EAAA,kBAAgBoF,GAAG,4BAA4BC,GAAG,OAAOC,GAAG,MAAMC,GAAG,OAAOC,GAAG,OAAOC,cAAc,kBAClGzF,EAAA,aACAA,EAAA,QAAM0F,OAAO,S,aC9C3B,MAAMC,EAAsB,o/D,MCOfC,EAAgB,M,2CAEmC,S,CAM9D9H,oBACExB,KAAK+B,OAAS,CACZ,YAAaL,OAAOC,QAAQC,MAAMI,QAAQC,a,CAI9CiC,aACE,MAAMC,EAAU,GAChBA,EAAQnE,KAAKuJ,aAAaxE,eAAiB,KAC3C,OAAOZ,C,CAGTV,SACE,OACEC,EAACC,EAAI,KACHD,EAAA,OAAKE,MAAO5D,KAAK+B,OAAQuC,MAAM,iBAC7BZ,EAAA,OAAKoF,GAAG,cACNpF,EAAA,QAAMG,KAAK,gBAEbH,EAAA,OAAKoF,GAAG,UACNpF,EAAA,QAAMG,KAAK,YAEbH,EAAA,OAAKoF,GAAG,eACNpF,EAAA,QAAMG,KAAK,iBAEbH,EAAA,OAAKoF,GAAG,oBAAoBxE,MAAOtE,KAAKkE,cACtCR,EAAA,OAAKoF,GAAG,gBACNpF,EAAA,QAAMG,KAAK,kBAEbH,EAAA,OAAKoF,GAAG,WACNpF,EAAA,QAAMG,KAAK,YACXH,EAAA,cAEFA,EAAA,OAAKoF,GAAG,iBACNpF,EAAA,QAAMG,KAAK,oBAGfH,EAAA,OAAKoF,GAAG,aACNpF,EAAA,QAAMG,KAAK,eAEbH,EAAA,OAAKoF,GAAG,UACNpF,EAAA,QAAMG,KAAK,YAEbH,EAAA,OAAKoF,GAAG,cACNpF,EAAA,QAAMG,KAAK,iB,uCC3DvB,MAAM2F,EAAmB,y1D,MCOZC,EAAa,M,yBAgDxBzJ,KAAA4B,MAAQF,OAAOC,QAAQC,M,UA1CwE,S,eAM5D,c,sCAiBE,S,gBAMD,O,YAYlB,E,CA1BlBN,oBACEtB,KAAKuB,W,CA4BPC,oBACExB,KAAK8F,oBACL9F,KAAKuB,W,CAGPmI,eACE,MAAMC,EAAY,GAClBA,EAAU3J,KAAK0E,KAAKK,eAAiB,KACrC,OAAO4E,C,CAGT7D,oBACE9F,KAAKyB,QAAUzB,KAAK4B,MAAMC,MAAMC,aAChC9B,KAAKgG,aAAehG,KAAK4B,MAAMC,MAAMO,UACrCpC,KAAK+B,OAAS,CACZ,gBAAiB/B,KAAK4B,MAAMC,MAAMQ,UAAU,QAC5C,wBAAyBrC,KAAKyB,QAAQa,QACtC,uBAAwBtC,KAAKyB,QAAQoD,OACrC,qBAAsB7E,KAAKyB,QAAQwE,K,CAIvC1E,YACE,MAAM2D,EAAYlF,KAAKiD,MACnBjD,KAAK4B,MAAMM,OAAOC,SAASnC,KAAKiD,OAChCjD,KAAK4B,MAAMC,MAAMM,WACrBnC,KAAK+B,OAAMwB,OAAAC,OAAAD,OAAAC,OAAA,GACNxD,KAAK+B,QAAM,CACd,eAAgBmD,GAAalF,KAAK4B,MAAMM,OAAOC,SAAS,kBACxD,eAAgBnC,KAAK4B,MAAMM,OAAOC,SAAS,GAAGnC,KAAKsG,c,CAIvDH,oBACE,MAAO,CACL,iBAAkBnG,KAAKoG,YACvB,mBAAoBpG,KAAKgG,aACzB,gBAAiBhG,KAAKqG,W,CAI1B5C,SACE,OACEC,EAACC,EAAI,CAACC,MAAO5D,KAAKmG,qBAChBzC,EAAA,KAAGE,MAAO5D,KAAK+B,OAAQuC,MAAOtE,KAAK0J,gBACjChG,EAAA,c"}

package/dist/cura/p-c791725b.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ const e=["arrowDown","arrowLeft","arrowRight","arrowUp","check","checkDouble","close","closeCircle","collapse","down","expand","linkExternal","link","left","minus","minusCircle","minusSquare","order","subItem","right","plus","plusCircle","plusSquare","up","filter","swap"];const s={128:{size:128,stroke:5.25},72:{size:72,stroke:3.5},64:{size:64,stroke:3.25},48:{size:48,stroke:2.75},40:{size:40,stroke:2.5},32:{size:32,stroke:2.25},24:{size:24,stroke:2},20:{size:20,stroke:1.75},16:{size:16,stroke:1.5},micro:{size:12,stroke:1.5},default:{size:24,stroke:2}};export{s as i,e as m};
2	+ //# sourceMappingURL=p-c791725b.js.map

package/dist/cura/p-c791725b.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["microIcons","iconSizes","size","stroke","micro","default"],"sources":["./src/components/cura-icon/cura-icon.definitions.tsx"],"sourcesContent":["export const microIcons = ['arrowDown','arrowLeft','arrowRight','arrowUp','check','checkDouble','close','closeCircle','collapse','down','expand','linkExternal','link','left','minus','minusCircle','minusSquare','order','subItem','right','plus','plusCircle','plusSquare','up','filter','swap'];\n\nexport const iconSizes = {\n \"128\": {size: 128, stroke: 5.25},\n \"72\": {size: 72, stroke: 3.5},\n \"64\": {size: 64, stroke: 3.25},\n \"48\": {size: 48, stroke: 2.75},\n \"40\": {size: 40, stroke: 2.5},\n \"32\": {size: 32, stroke: 2.25},\n \"24\": {size: 24, stroke: 2},\n \"20\": {size: 20, stroke: 1.75},\n \"16\": {size: 16, stroke: 1.5},\n \"micro\": {size: 12, stroke: 1.5 },\n \"default\": {size: 24, stroke: 2}\n};\n"],"mappings":"MAAaA,EAAa,CAAC,YAAY,YAAY,aAAa,UAAU,QAAQ,cAAc,QAAQ,cAAc,WAAW,OAAO,SAAS,eAAe,OAAO,OAAO,QAAQ,cAAc,cAAc,QAAQ,UAAU,QAAQ,OAAO,aAAa,aAAa,KAAK,SAAS,Q,MAE9QC,EAAY,CACvB,IAAO,CAACC,KAAM,IAAKC,OAAQ,MAC3B,GAAM,CAACD,KAAM,GAAIC,OAAQ,KACzB,GAAM,CAACD,KAAM,GAAIC,OAAQ,MACzB,GAAM,CAACD,KAAM,GAAIC,OAAQ,MACzB,GAAM,CAACD,KAAM,GAAIC,OAAQ,KACzB,GAAM,CAACD,KAAM,GAAIC,OAAQ,MACzB,GAAM,CAACD,KAAM,GAAIC,OAAQ,GACzB,GAAM,CAACD,KAAM,GAAIC,OAAQ,MACzB,GAAM,CAACD,KAAM,GAAIC,OAAQ,KACzBC,MAAS,CAACF,KAAM,GAAIC,OAAQ,KAC5BE,QAAW,CAACH,KAAM,GAAIC,OAAQ,W"}

package/dist/cura/p-c9afb94f.entry.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{r,c as e,h as a,H as s,g as t}from"./p-ba66d7be.js";import{f as o}from"./p-3688570d.js";const i='@charset "UTF-8";:host{display:block;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;-webkit-box-sizing:border-box;box-sizing:border-box;}:host .container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-direction:row-reverse;flex-direction:row-reverse;gap:var(--gap)}:host .position.container{-ms-flex-direction:row;flex-direction:row}:host .position .label-wrapper{-ms-flex-pack:end;justify-content:end}:host .position .message{text-align:right}:host .position .label{-ms-flex-order:1;order:1}:host .info{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}:host .label-wrapper{display:-ms-flexbox;display:flex;-ms-flex-pack:start;justify-content:start;-ms-flex-align:center;align-items:center;gap:5px}:host .control{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;cursor:pointer;position:relative}:host .radio{margin:0;appearance:none;-webkit-appearance:none;-moz-appearance:none;border-radius:50%;border:2px solid var(--primary-base-neutral-medium);background:var(--neutral-purewhite);-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-transition:border-color 0.3s;transition:border-color 0.3s;position:relative;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;cursor:pointer;width:var(--size);height:var(--size);-ms-flex:0 0 var(--size);flex:0 0 var(--size)}:host .radio::after{content:"";background:var(--color-base-light);border-radius:50%;opacity:0;-webkit-transition:opacity 0.3s;transition:opacity 0.3s;width:var(--size-after);height:var(--size-after)}:host .radio:focus{border-color:var(--info-base) !important}:host .success .radio{border-color:var(--success-base);background:var(--success-lighter)}:host .success .radio:hover{border-color:var(--success-base) !important}:host .success.checked .radio{border-color:var(--success-base)}:host .success.checked .radio::after{background:var(--success-base)}:host .success.checked .radio:hover{background:var(--success-lighter) !important;border-color:var(--success-base) !important}:host .success.checked .radio:hover::after{background:var(--success-base) !important}:host .error .radio{border-color:var(--error-base);background:var(--error-lighter)}:host .error .radio:hover{border-color:var(--error-base) !important}:host .error.checked .radio{border-color:var(--error-base)}:host .error.checked .radio::after{background:var(--error-base)}:host .error.checked .radio:hover{background:var(--error-lighter) !important;border-color:var(--error-base) !important}:host .error.checked .radio:hover::after{background:var(--error-base) !important}:host .checked .radio::after{opacity:1;background:var(--color-base)}:host .checked .radio{border-color:var(--color-dark)}:host .checked .radio:hover{border-color:var(--color-light) !important}:host .checked .radio:hover::after{background:var(--color-light)}:host .disabled .radio{background:var(--primary-base-neutral-white);border-color:var(--primary-darker-neutral-base);cursor:not-allowed}:host .disabled .radio::after{background:var(--neutral-lighter)}:host .disabled.checked .radio{border-color:var(--primary-base-neutral-base) !important;background:var(--primary-darker-neutral-white) !important}:host .disabled.checked .radio::after{background:var(--primary-base-neutral-base) !important}:host :not(.disabled):not(.checked) .radio:hover{border-color:var(--primary-base-neutral-dark)}';const c=class{constructor(a){r(this,a);this.onchange=e(this,"onchange",7);this.sizes={large:{size:20},medium:{size:14},small:{size:10}};this.isDarkbackground=()=>this.background==="dark";this.handleClick=()=>{if(this.disabled)return;this.checked=!this.checked;this.onchange.emit({value:this.value,checked:this.checked})};this.checked=false;this.status="default";this.disabled=false;this.required=false;this.label="";this.ontabindex=undefined;this.position="left";this.value="";this.name="";this.background="light";this.size="medium";this.color="accent";this.styles={}}sizeHandler(){this.styles["--size-after"]=`${this.sizes[this.size].size}px`;this.styles["--size"]=`${o[this.size].size}px`;this.styles["--gap"]=`${o[this.size].gap}px`}setColors(){const r=[{name:"--info-base",background:"info-base"},{name:"--color-light",background:`${this.color}-light`},{name:"--color-base",background:`${this.color}-base`},{name:"--color-dark",background:`${this.color}-dark`},{name:"--neutral-purewhite",background:"neutral-purewhite"},{name:"--success-lighter",background:"success-lighter"},{name:"--success-base",background:"success-base"},{name:"--error-lighter",background:"error-lighter"},{name:"--error-base",background:"error-base"},{name:"--primary-base-neutral-medium",background:this.isDarkbackground()?"primary-base":"neutral-medium"},{name:"--primary-base-neutral-white",background:this.isDarkbackground()?"primary-base":"neutral-white"},{name:"--primary-darker-neutral-white",background:this.isDarkbackground()?"primary-darker":"neutral-white"},{name:"--primary-darker-neutral-base",background:this.isDarkbackground()?"primary-darker":"neutral-base"},{name:"--primary-base-neutral-base",background:this.isDarkbackground()?"primary-base":"neutral-base"},{name:"--primary-base-neutral-dark",background:this.isDarkbackground()?"primary-base":"neutral-dark"},{name:"--primary-base-neutral-medium",background:this.isDarkbackground()?"primary-base":"neutral-medium"},{name:"--success-base-dark",background:this.isDarkbackground()?"success-base":"success-dark"},{name:"--error-base-dark",background:this.isDarkbackground()?"error-base":"error-dark"}];r.forEach((r=>this.styles[r.name]=window.CuraAPI.theme.colors.getColor(r.background)))}connectedCallback(){this.sizeHandler();this.setColors()}getClasses(){const r={};r["container"]=true;r["checked"]=this.checked;r["disabled"]=this.disabled;r["position"]=this.position==="right";r[this.status]=true;return r}assignColor(r){if(this.disabled)return this.isDarkbackground()?"primary-darker":"neutral-medium";const e={success:{label:this.isDarkbackground()?"success-lighter":"success-darker",message:this.isDarkbackground()?"success-base":"success-dark"},error:{label:this.isDarkbackground()?"error-lighter":"neutral-darker",message:this.isDarkbackground()?"error-base":"error-dark"},default:{label:this.isDarkbackground()?"neutral-white":"neutral-black",message:this.isDarkbackground()?"primary-lighter":"neutral-dark"}};return e[this.status][r]}render(){return a(s,null,a("div",{class:this.getClasses(),style:this.styles},a("div",{class:"info"},a("div",{class:"label-wrapper"},a("cura-label",{class:"label",size:this.size==="large"?"medium":"xsmall",color:this.assignColor("label")},this.label),this.required&&a("cura-paragraph",{lineHeight:"0%",marginBlock:"0",color:"error-base"},"* ")),a("cura-label",{color:this.assignColor("message"),size:"xsmall",class:"message"},a("slot",null))),a("input",{type:"radio",class:`radio ${this.size.toLocaleLowerCase()}`,name:this.name,value:this.value,required:this.required,tabIndex:this.ontabindex,disabled:this.disabled,checked:this.checked,onClick:this.handleClick})))}get host(){return t(this)}static get watchers(){return{size:["sizeHandler"],color:["setColors"],background:["setColors","assignColor"]}}};c.style=i;export{c as cura_radio};
2	+ //# sourceMappingURL=p-c9afb94f.entry.js.map

package/dist/cura/p-c9afb94f.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["curaRadioCss","CuraRadio","this","sizes","large","size","medium","small","isDarkbackground","background","handleClick","disabled","checked","onchange","emit","value","sizeHandler","styles","formsSizes","gap","setColors","colors","name","color","forEach","window","CuraAPI","theme","getColor","connectedCallback","getClasses","classes","position","status","assignColor","type","statusColors","success","label","message","error","default","render","h","Host","class","style","required","lineHeight","marginBlock","toLocaleLowerCase","tabIndex","ontabindex","onClick"],"sources":["./src/components/forms/cura-radio/cura-radio.scss?tag=cura-radio&encapsulation=shadow","./src/components/forms/cura-radio/cura-radio.tsx"],"sourcesContent":["\n\n:host {\n display: block;\n width: fit-content;\n box-sizing: border-box;\n\n.container {\n display: flex;\n align-items: center;\n flex-direction: row-reverse;\n gap: var(--gap);\n}\n\n.position {\n\n &.container {\n flex-direction: row;\n }\n\n .label-wrapper {\n justify-content: end;\n }\n\n .message {\n text-align: right;\n }\n\n .label {\n order:1\n }\n\n}\n\n.info {\n display: flex;\n flex-direction: column;\n}\n\n.label-wrapper {\n display: flex;\n justify-content: start;\n align-items: center;\n gap: 5px;\n}\n\n\n.control {\n width: fit-content;\n cursor: pointer;\n position: relative;\n}\n\n\n.radio {\n margin: 0;\n appearance: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n border-radius: 50%;\n border: 2px solid var(--primary-base-neutral-medium);\n background: var(--neutral-purewhite);\n box-sizing: border-box;\n transition: border-color 0.3s;\n position: relative;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n width: var(--size);\n height: var(--size);\n flex: 0 0 var(--size);\n\n &::after {\n content: '';\n background: var(--color-base-light);\n border-radius: 50%;\n opacity: 0;\n transition: opacity 0.3s;\n width: var(--size-after);\n height: var(--size-after);\n }\n\n &:focus {\n border-color: var(--info-base) !important;\n }\n\n}\n\n\n/* Estado Success */\n.success .radio {\n border-color: var(--success-base);\n background: var(--success-lighter);\n\n &:hover{\n border-color: var(--success-base) !important;\n }\n}\n\n.success.checked .radio {\n border-color: var(--success-base);\n\n &::after {\n background: var(--success-base);\n }\n\n &:hover {\n background: var(--success-lighter) !important;\n border-color: var(--success-base) !important;\n\n &::after {\n background: var(--success-base) !important;\n }\n }\n}\n\n\n/* Estado Error */\n.error .radio {\n border-color: var(--error-base);\n background: var(--error-lighter);\n\n &:hover{\n border-color: var(--error-base) !important;\n }\n}\n\n.error.checked .radio {\n border-color: var(--error-base);\n\n &::after {\n background: var(--error-base);\n }\n\n &:hover {\n background: var(--error-lighter) !important;\n border-color: var(--error-base) !important;\n\n &::after {\n background: var(--error-base) !important;\n }\n }\n}\n\n\n/* Estado checked */\n.checked .radio::after {\n opacity: 1;\n background: var(--color-base);\n}\n\n.checked .radio {\n border-color: var(--color-dark) ;\n}\n\n.checked .radio:hover {\n border-color: var(--color-light) !important;\n}\n\n.checked .radio:hover::after {\n background: var(--color-light);\n}\n\n/* Estado disabled */\n.disabled .radio {\n background: var(--primary-base-neutral-white);\n border-color: var(--primary-darker-neutral-base) ;\n cursor: not-allowed;\n}\n\n.disabled .radio::after {\n background: var(--neutral-lighter);\n}\n\n.disabled.checked .radio {\n border-color: var(--primary-base-neutral-base) !important;\n background: var(--primary-darker-neutral-white) !important;\n}\n\n.disabled.checked .radio::after {\n background: var(--primary-base-neutral-base) !important;\n}\n\n\n/* Estado hover para não disabled e não checked */\n:not(.disabled):not(.checked) .radio:hover {\n border-color: var(--primary-base-neutral-dark);\n}\n\n\n}\n","import { Component, Prop, Event, Element, h, Host, Watch, EventEmitter, State } from '@stencil/core';\nimport { formsSizes } from '../cura-forms.definitions';\n\n@Component({\n tag: 'cura-radio',\n styleUrl: 'cura-radio.scss',\n shadow: true,\n})\nexport class CuraRadio {\n /**\n * Reflects the checked state of the radio button.\n * Mutable property allowing state change.\n */\n @Prop({ reflect: true, mutable: true }) checked: boolean = false;\n /**\n * Status of the radio button.\n * Can be 'error', 'success', or 'default'.\n */\n @Prop({ reflect: true, mutable: true }) status: 'error' | 'success' | 'default' = 'default';\n /**\n * Reflects the disabled state of the radio button.\n */\n @Prop({ reflect: true }) disabled: boolean = false;\n /**\n * Reflects the required state of the radio button.\n */\n @Prop({ reflect: true }) required: boolean = false;\n /**\n * Text label associated with the radio button.\n */\n @Prop({ reflect: true }) label: string = '';\n /**\n * Specifies the tabindex of the radio button.\n */\n @Prop({ reflect: true }) ontabindex: number;\n /**\n * Position of the label relative to the radio button.\n * Can be 'left' or 'right'.\n */\n @Prop({ reflect: true }) position: \"left\" | \"right\" = 'left';\n /**\n * Value associated with the radio button.\n */\n @Prop({ reflect: true }) value: string = '';\n /**\n * Name attribute of the radio button.\n */\n @Prop({ reflect: true }) name: string = '';\n /**\n * Background theme of the radio button.\n * Can be 'dark' or 'light'.\n */\n @Prop() background: 'dark' | 'light' = 'light';\n /**\n * Size of the radio button.\n * Can be 'small', 'medium', or 'large'.\n */\n @Prop() size: 'small' | 'medium' | 'large' = 'medium';\n /**\n * Color theme of the radio button.\n */\n @Prop() color = 'accent';\n\n @State() styles = {}\n\n @Element() host: HTMLElement;\n\n @Event() onchange: EventEmitter<{ value: string, checked: boolean }>;\n\n sizes = {\n \"large\": { size: 20 },\n \"medium\": { size: 14 },\n \"small\": { size: 10 },\n };\n\n\n isDarkbackground = () => this.background === 'dark';\n\n @Watch('size')\n sizeHandler() {\n this.styles['--size-after'] = `${this.sizes[this.size].size}px`\n this.styles['--size'] = `${formsSizes[this.size].size}px`\n this.styles['--gap'] = `${formsSizes[this.size].gap}px`\n }\n\n\n @Watch('color')\n @Watch('background')\n setColors() {\n\n const colors = [\n { name: '--info-base', background: 'info-base' },\n { name: '--color-light', background: `${this.color}-light` },\n { name: '--color-base', background: `${this.color}-base` },\n { name: '--color-dark', background: `${this.color}-dark` },\n { name: '--neutral-purewhite', background: 'neutral-purewhite' },\n { name: '--success-lighter', background: 'success-lighter' },\n { name: '--success-base', background: 'success-base' },\n { name: '--error-lighter', background: 'error-lighter' },\n { name: '--error-base', background: 'error-base' },\n { name: '--primary-base-neutral-medium', background: this.isDarkbackground() ? 'primary-base' : 'neutral-medium' },\n { name: '--primary-base-neutral-white', background: this.isDarkbackground() ? 'primary-base' : 'neutral-white' },\n { name: '--primary-darker-neutral-white', background: this.isDarkbackground() ? 'primary-darker' : 'neutral-white' },\n { name: '--primary-darker-neutral-base', background: this.isDarkbackground() ? 'primary-darker' : 'neutral-base' },\n { name: '--primary-base-neutral-base', background: this.isDarkbackground() ? 'primary-base' : 'neutral-base' },\n { name: '--primary-base-neutral-dark', background: this.isDarkbackground() ? 'primary-base' : 'neutral-dark' },\n { name: '--primary-base-neutral-medium', background: this.isDarkbackground() ? 'primary-base' : 'neutral-medium' },\n { name: '--success-base-dark', background: this.isDarkbackground() ? 'success-base' : 'success-dark' },\n { name: '--error-base-dark', background: this.isDarkbackground() ? 'error-base' : 'error-dark' },\n ];\n\n colors.forEach(color => this.styles[color.name] = window.CuraAPI.theme.colors.getColor(color.background))\n }\n\n connectedCallback() {\n this.sizeHandler()\n this.setColors();\n }\n\n handleClick = () => {\n if (this.disabled) return;\n\n this.checked = !this.checked;\n this.onchange.emit({ value: this.value, checked: this.checked });\n };\n\n getClasses() {\n const classes = {};\n classes['container'] = true;\n classes['checked'] = this.checked;\n classes['disabled'] = this.disabled;\n classes['position'] = this.position === 'right';\n classes[this.status] = true;\n\n return classes;\n }\n\n @Watch('background')\n assignColor(type: 'label' | 'message',) {\n if (this.disabled) return this.isDarkbackground() ? 'primary-darker' : 'neutral-medium';\n\n const statusColors = {\n success: {\n label: this.isDarkbackground() ? 'success-lighter' : 'success-darker',\n message: this.isDarkbackground() ? 'success-base' : 'success-dark'\n },\n error: {\n label: this.isDarkbackground() ? 'error-lighter' : 'neutral-darker',\n message: this.isDarkbackground() ? 'error-base' : 'error-dark'\n },\n default: {\n label: this.isDarkbackground() ? 'neutral-white' : 'neutral-black',\n message: this.isDarkbackground() ? 'primary-lighter' : 'neutral-dark'\n }\n };\n\n return statusColors[this.status][type];\n }\n\n render() {\n return (\n <Host>\n <div class={this.getClasses()} style={this.styles}>\n <div class=\"info\">\n <div class=\"label-wrapper\">\n <cura-label\n class=\"label\"\n size={this.size === 'large' ? 'medium' : 'xsmall'}\n color={this.assignColor('label')}>\n {this.label}\n </cura-label>\n {this.required && <cura-paragraph lineHeight='0%' marginBlock='0' color=\"error-base\" >* </cura-paragraph>}\n </div>\n <cura-label\n color={this.assignColor('message')}\n size=\"xsmall\"\n class=\"message\">\n <slot></slot>\n </cura-label>\n </div>\n <input\n type=\"radio\"\n class={`radio ${this.size.toLocaleLowerCase()}`}\n name={this.name}\n value={this.value}\n required={this.required}\n tabIndex={this.ontabindex}\n disabled={this.disabled}\n checked={this.checked}\n onClick={this.handleClick}\n />\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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"}

package/dist/cura/p-d3f9c888.system.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ System.register([],(function(e){"use strict";return{execute:function(){var i=e("f",{large:{size:32,gap:16},medium:{size:24,gap:12},small:{size:20,gap:8}})}}}));
2	+ //# sourceMappingURL=p-d3f9c888.system.js.map

package/dist/cura/p-d3f9c888.system.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["formsSizes","exports","large","size","gap","medium","small"],"sources":["src/components/forms/cura-forms.definitions.tsx"],"sourcesContent":["export const formsSizes = {\n \"large\": {\n size: 32,\n gap: 16,\n },\n \"medium\": {\n size: 24,\n gap: 12,\n },\n \"small\": {\n size: 20,\n gap: 8,\n },\n};\n"],"mappings":"2EAAaA,EAAUC,EAAA,IAAG,CACxBC,MAAS,CACPC,KAAM,GACNC,IAAK,IAEPC,OAAU,CACRF,KAAM,GACNC,IAAK,IAEPE,MAAS,CACPH,KAAM,GACNC,IAAK,I"}

package/dist/cura/{p-ca054b07.system.entry.js → p-e5e259fd.system.entry.js} RENAMED Viewed

@@ -1,2 +1,2 @@
-System.register(["./p-c0c00396.system.js"],(function(t){"use strict";var e,o,s,i;return{setters:[function(t){e=t.r;o=t.h;s=t.H;i=t.g}],execute:function(){var h=":host{display:block;font-size:var(--font-size-base)}:host h1,:host h2,:host h3,:host h4,:host h5,:host h6{font-family:var(--font-family);font-size:3em;font-weight:var(--font-weight-bold);color:var(--color-body);line-height:var(--line-height);margin-block:var(--margin-block);letter-spacing:0px}@media (min-width: 769px) and (max-width: 1920px){:host h1,:host h2,:host h3,:host h4,:host h5,:host h6{font-size:3.429em}}@media (min-width: 1921px){:host h1,:host h2,:host h3,:host h4,:host h5,:host h6{font-size:4.286em;line-height:calc(var(--line-height) + 5%)}}:host ::slotted(b),:host ::slotted(strong){font-weight:var(--font-weight-bold)}:host ::slotted(a){font-weight:var(--font-weight-bold);color:var(--color-link);text-underline-offset:10%;cursor:pointer}:host ::slotted(u){text-underline-offset:10%}:host ::slotted(abbr){color:var(--color-link);-webkit-text-decoration:underline dashed 1px var(--color-link);text-decoration:underline dashed 1px var(--color-link);text-underline-offset:10%;cursor:default}";var l=t("cura_display",function(){function t(t){e(this,t);this.theme=window.CuraAPI.theme;this.level=1;this.spotColor="accent-dark";this.color=undefined;this.marginBlock="1.25em";this.lineHeight="120%";this.styles={}}t.prototype.handleChangeColor=function(){this.setColors()};t.prototype.connectedCallback=function(){this.setFontProperties();this.setColors()};t.prototype.setFontProperties=function(){this.weights=this.theme.fonts.getWeights();this.fontSizeBase=this.theme.fonts.getSize();this.styles={"--font-family":window.CuraAPI.theme.fonts.getFamily("display"),"--font-size":window.CuraAPI.theme.fonts.getSize(),"--font-weight-bold":this.weights.bold}};t.prototype.hostCSSProperties=function(){return{"--margin-block":this.marginBlock,"--font-size-base":this.fontSizeBase,"--line-height":this.lineHeight}};t.prototype.setColors=function(){var t=this.color?this.theme.colors.getColor(this.color):this.theme.fonts.getColor();this.styles=Object.assign(Object.assign({},this.styles),{"--color-body":t||this.theme.colors.getColor("neutral-darker"),"--color-link":this.theme.colors.getColor("".concat(this.spotColor))})};t.prototype.getHeadingTag=function(){var t={1:o("h1",{style:this.styles},o("slot",null)),2:o("h2",{style:this.styles},o("slot",null)),3:o("h3",{style:this.styles},o("slot",null)),4:o("h4",{style:this.styles},o("slot",null)),5:o("h5",{style:this.styles},o("slot",null)),6:o("h6",{style:this.styles},o("slot",null)),default:o("h1",{style:this.styles},o("slot",null))};return t["".concat(this.level)]||t["default"]};t.prototype.render=function(){return o(s,{style:this.hostCSSProperties()},this.getHeadingTag())};Object.defineProperty(t.prototype,"host",{get:function(){return i(this)},enumerable:false,configurable:true});Object.defineProperty(t,"watchers",{get:function(){return{color:["handleChangeColor"],spotColor:["handleChangeColor"]}},enumerable:false,configurable:true});return t}());l.style=h}}}));
-//# sourceMappingURL=p-ca054b07.system.entry.js.map
+System.register(["./p-36a83bc7.system.js"],(function(t){"use strict";var e,o,s,i;return{setters:[function(t){e=t.r;o=t.h;s=t.H;i=t.g}],execute:function(){var h=":host{display:block;font-size:var(--font-size-base)}:host h1,:host h2,:host h3,:host h4,:host h5,:host h6{font-family:var(--font-family);font-size:3em;font-weight:var(--font-weight-bold);color:var(--color-body);line-height:var(--line-height);margin-block:var(--margin-block);letter-spacing:0px}@media (min-width: 769px) and (max-width: 1920px){:host h1,:host h2,:host h3,:host h4,:host h5,:host h6{font-size:3.429em}}@media (min-width: 1921px){:host h1,:host h2,:host h3,:host h4,:host h5,:host h6{font-size:4.286em;line-height:calc(var(--line-height) + 5%)}}:host ::slotted(b),:host ::slotted(strong){font-weight:var(--font-weight-bold)}:host ::slotted(a){font-weight:var(--font-weight-bold);color:var(--color-link);text-underline-offset:10%;cursor:pointer}:host ::slotted(u){text-underline-offset:10%}:host ::slotted(abbr){color:var(--color-link);-webkit-text-decoration:underline dashed 1px var(--color-link);text-decoration:underline dashed 1px var(--color-link);text-underline-offset:10%;cursor:default}";var l=t("cura_display",function(){function t(t){e(this,t);this.theme=window.CuraAPI.theme;this.level=1;this.spotColor="accent-dark";this.color=undefined;this.marginBlock="1.25em";this.lineHeight="120%";this.styles={}}t.prototype.handleChangeColor=function(){this.setColors()};t.prototype.connectedCallback=function(){this.setFontProperties();this.setColors()};t.prototype.setFontProperties=function(){this.weights=this.theme.fonts.getWeights();this.fontSizeBase=this.theme.fonts.getSize();this.styles={"--font-family":window.CuraAPI.theme.fonts.getFamily("display"),"--font-size":window.CuraAPI.theme.fonts.getSize(),"--font-weight-bold":this.weights.bold}};t.prototype.hostCSSProperties=function(){return{"--margin-block":this.marginBlock,"--font-size-base":this.fontSizeBase,"--line-height":this.lineHeight}};t.prototype.setColors=function(){var t=this.color?this.theme.colors.getColor(this.color):this.theme.fonts.getColor();this.styles=Object.assign(Object.assign({},this.styles),{"--color-body":t||this.theme.colors.getColor("neutral-darker"),"--color-link":this.theme.colors.getColor("".concat(this.spotColor))})};t.prototype.getHeadingTag=function(){var t={1:o("h1",{style:this.styles},o("slot",null)),2:o("h2",{style:this.styles},o("slot",null)),3:o("h3",{style:this.styles},o("slot",null)),4:o("h4",{style:this.styles},o("slot",null)),5:o("h5",{style:this.styles},o("slot",null)),6:o("h6",{style:this.styles},o("slot",null)),default:o("h1",{style:this.styles},o("slot",null))};return t["".concat(this.level)]||t["default"]};t.prototype.render=function(){return o(s,{style:this.hostCSSProperties()},this.getHeadingTag())};Object.defineProperty(t.prototype,"host",{get:function(){return i(this)},enumerable:false,configurable:true});Object.defineProperty(t,"watchers",{get:function(){return{color:["handleChangeColor"],spotColor:["handleChangeColor"]}},enumerable:false,configurable:true});return t}());l.style=h}}}));
+//# sourceMappingURL=p-e5e259fd.system.entry.js.map

package/dist/cura/{p-49813052.entry.js → p-edeffbfc.entry.js} RENAMED Viewed

@@ -1,2 +1,2 @@
-import{r as t,h as s,H as o,g as h}from"./p-46d20db3.js";const e=":host{display:block;font-size:var(--font-size-base)}:host h1,:host h2,:host h3,:host h4,:host h5,:host h6{font-family:var(--font-family);font-size:3em;font-weight:var(--font-weight-bold);color:var(--color-body);line-height:var(--line-height);margin-block:var(--margin-block);letter-spacing:0px}@media (min-width: 769px) and (max-width: 1920px){:host h1,:host h2,:host h3,:host h4,:host h5,:host h6{font-size:3.429em}}@media (min-width: 1921px){:host h1,:host h2,:host h3,:host h4,:host h5,:host h6{font-size:4.286em;line-height:calc(var(--line-height) + 5%)}}:host ::slotted(b),:host ::slotted(strong){font-weight:var(--font-weight-bold)}:host ::slotted(a){font-weight:var(--font-weight-bold);color:var(--color-link);text-underline-offset:10%;cursor:pointer}:host ::slotted(u){text-underline-offset:10%}:host ::slotted(abbr){color:var(--color-link);-webkit-text-decoration:underline dashed 1px var(--color-link);text-decoration:underline dashed 1px var(--color-link);text-underline-offset:10%;cursor:default}";const i=class{constructor(s){t(this,s);this.theme=window.CuraAPI.theme;this.level=1;this.spotColor="accent-dark";this.color=undefined;this.marginBlock="1.25em";this.lineHeight="120%";this.styles={}}handleChangeColor(){this.setColors()}connectedCallback(){this.setFontProperties();this.setColors()}setFontProperties(){this.weights=this.theme.fonts.getWeights();this.fontSizeBase=this.theme.fonts.getSize();this.styles={"--font-family":window.CuraAPI.theme.fonts.getFamily("display"),"--font-size":window.CuraAPI.theme.fonts.getSize(),"--font-weight-bold":this.weights.bold}}hostCSSProperties(){return{"--margin-block":this.marginBlock,"--font-size-base":this.fontSizeBase,"--line-height":this.lineHeight}}setColors(){const t=this.color?this.theme.colors.getColor(this.color):this.theme.fonts.getColor();this.styles=Object.assign(Object.assign({},this.styles),{"--color-body":t||this.theme.colors.getColor("neutral-darker"),"--color-link":this.theme.colors.getColor(`${this.spotColor}`)})}getHeadingTag(){const t={1:s("h1",{style:this.styles},s("slot",null)),2:s("h2",{style:this.styles},s("slot",null)),3:s("h3",{style:this.styles},s("slot",null)),4:s("h4",{style:this.styles},s("slot",null)),5:s("h5",{style:this.styles},s("slot",null)),6:s("h6",{style:this.styles},s("slot",null)),default:s("h1",{style:this.styles},s("slot",null))};return t[`${this.level}`]||t["default"]}render(){return s(o,{style:this.hostCSSProperties()},this.getHeadingTag())}get host(){return h(this)}static get watchers(){return{color:["handleChangeColor"],spotColor:["handleChangeColor"]}}};i.style=e;export{i as cura_display};
-//# sourceMappingURL=p-49813052.entry.js.map
+import{r as t,h as s,H as o,g as h}from"./p-ba66d7be.js";const e=":host{display:block;font-size:var(--font-size-base)}:host h1,:host h2,:host h3,:host h4,:host h5,:host h6{font-family:var(--font-family);font-size:3em;font-weight:var(--font-weight-bold);color:var(--color-body);line-height:var(--line-height);margin-block:var(--margin-block);letter-spacing:0px}@media (min-width: 769px) and (max-width: 1920px){:host h1,:host h2,:host h3,:host h4,:host h5,:host h6{font-size:3.429em}}@media (min-width: 1921px){:host h1,:host h2,:host h3,:host h4,:host h5,:host h6{font-size:4.286em;line-height:calc(var(--line-height) + 5%)}}:host ::slotted(b),:host ::slotted(strong){font-weight:var(--font-weight-bold)}:host ::slotted(a){font-weight:var(--font-weight-bold);color:var(--color-link);text-underline-offset:10%;cursor:pointer}:host ::slotted(u){text-underline-offset:10%}:host ::slotted(abbr){color:var(--color-link);-webkit-text-decoration:underline dashed 1px var(--color-link);text-decoration:underline dashed 1px var(--color-link);text-underline-offset:10%;cursor:default}";const i=class{constructor(s){t(this,s);this.theme=window.CuraAPI.theme;this.level=1;this.spotColor="accent-dark";this.color=undefined;this.marginBlock="1.25em";this.lineHeight="120%";this.styles={}}handleChangeColor(){this.setColors()}connectedCallback(){this.setFontProperties();this.setColors()}setFontProperties(){this.weights=this.theme.fonts.getWeights();this.fontSizeBase=this.theme.fonts.getSize();this.styles={"--font-family":window.CuraAPI.theme.fonts.getFamily("display"),"--font-size":window.CuraAPI.theme.fonts.getSize(),"--font-weight-bold":this.weights.bold}}hostCSSProperties(){return{"--margin-block":this.marginBlock,"--font-size-base":this.fontSizeBase,"--line-height":this.lineHeight}}setColors(){const t=this.color?this.theme.colors.getColor(this.color):this.theme.fonts.getColor();this.styles=Object.assign(Object.assign({},this.styles),{"--color-body":t||this.theme.colors.getColor("neutral-darker"),"--color-link":this.theme.colors.getColor(`${this.spotColor}`)})}getHeadingTag(){const t={1:s("h1",{style:this.styles},s("slot",null)),2:s("h2",{style:this.styles},s("slot",null)),3:s("h3",{style:this.styles},s("slot",null)),4:s("h4",{style:this.styles},s("slot",null)),5:s("h5",{style:this.styles},s("slot",null)),6:s("h6",{style:this.styles},s("slot",null)),default:s("h1",{style:this.styles},s("slot",null))};return t[`${this.level}`]||t["default"]}render(){return s(o,{style:this.hostCSSProperties()},this.getHeadingTag())}get host(){return h(this)}static get watchers(){return{color:["handleChangeColor"],spotColor:["handleChangeColor"]}}};i.style=e;export{i as cura_display};
+//# sourceMappingURL=p-edeffbfc.entry.js.map

package/dist/cura/p-eea5ca70.system.entry.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ System.register(["./p-36a83bc7.system.js","./p-d3f9c888.system.js"],(function(e){"use strict";var r,a,s,i,o,t;return{setters:[function(e){r=e.r;a=e.c;s=e.h;i=e.H;o=e.g},function(e){t=e.f}],execute:function(){var c='@charset "UTF-8";:host{display:block;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;-webkit-box-sizing:border-box;box-sizing:border-box}.container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-direction:row-reverse;flex-direction:row-reverse;gap:var(--gap)}.position.container{-ms-flex-direction:row;flex-direction:row}.position .label-wrapper{-ms-flex-pack:end;justify-content:end}.position .message{text-align:right}.position .label{-ms-flex-order:1;order:1}.info{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.label-wrapper{display:-ms-flexbox;display:flex;-ms-flex-pack:start;justify-content:start;-ms-flex-align:center;align-items:center;gap:5px}.control{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;cursor:pointer;position:relative}.checkbox{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:2px solid var(--primary-base-neutral-medium);border-radius:4px;background:var(--neutral-lighter-neutral-purewhite);-ms-flex:1 0;flex:1 0;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;position:relative;cursor:pointer;-webkit-box-sizing:border-box;box-sizing:border-box;width:var(--size);height:var(--size);-ms-flex:0 0 var(--size);flex:0 0 var(--size)}.icon{position:absolute;display:-ms-flexbox;display:flex;opacity:0;-webkit-transition:opacity 0.3s;transition:opacity 0.3s}.checkbox:focus{border-color:var(--info-base) !important}.disabled .checkbox{background:var(--primary-darker-neutral-white);border-color:var(--primary-base-neutral-base);cursor:not-allowed}.disabled .checkbox:hover{border-color:var(--primary-base-neutral-base) !important}.disabled.checked .checkbox,.disabled.indeterminate .checkbox{background:var(--primary-base-neutral-white);border-color:var(--primary-base-neutral-base)}.disabled.checked .checkbox:hover,.disabled.indeterminate .checkbox:hover{border-color:var(--primary-base-neutral-base) !important;background:var(--primary-base-neutral-white)}.disabled .checkbox:focus{border-color:var(--primary-base-neutral-base)}.checked .checkbox,.indeterminate .checkbox{border-color:var(--color-dark);background:var(--color-base)}.checked .checkbox:hover,.indeterminate .checkbox:hover{border-color:var(--color-light) !important;background:var(--color-lighter)}.checked .icon,.indeterminate .icon{opacity:1}:not(.disabled):not(.checked):not(.indeterminate) .checkbox:hover{border-color:var(--primary-base-neutral-dark)}.success .checkbox{border-color:var(--success-base);background:var(--success-lighter)}.success .checkbox:hover{border-color:var(--success-base) !important}.success.checked .checkbox{border-color:var(--success-dark-base);background:var(--success-base-lighter)}.success.checked .checkbox:hover{border-color:var(--success-dark-base)}.error .checkbox{border-color:var(--error-base);background:var(--error-lighter)}.error .checkbox:hover{border-color:var(--error-base) !important}.error.checked .checkbox{border-color:var(--error-dark-base);background:var(--error-base-lighter)}.error.checked .checkbox:hover{border-color:var(--error-dark-base)}input{appearance:none;-webkit-appearance:none;-moz-appearance:none}';var n=e("cura_checkbox",function(){function e(e){var s=this;r(this,e);this.onchange=a(this,"onchange",7);this.isDarkbackground=function(){return s.background==="dark"};this.isDarkIconColor=function(){return s.iconColor==="dark"};this.handleClick=function(){if(s.disabled)return;s.indeterminate=false;s.checked=!s.checked;s.onchange.emit({value:s.value,checked:s.checked,indeterminate:s.indeterminate})};this.checked=false;this.indeterminate=false;this.status="default";this.disabled=false;this.required=false;this.label=undefined;this.ontabindex=0;this.position="left";this.value=undefined;this.name=undefined;this.size="medium";this.background="light";this.iconColor="dark";this.color="accent";this.styles={}}e.prototype.sizeHandler=function(){this.styles["--size"]="".concat(t[this.size].size,"px");this.styles["--gap"]="".concat(t[this.size].gap,"px")};e.prototype.setColors=function(){var e=this;var r=[{name:"--color-base",background:"".concat(this.color,"-base")},{name:"--color-lighter",background:"".concat(this.color,"-lighter")},{name:"--color-light",background:"".concat(this.color,"-light")},{name:"--color-dark",background:"".concat(this.color,"-dark")},{name:"--info-base",background:"info-base"},{name:"--error-base",background:"error-base"},{name:"--success-lighter",background:"success-lighter"},{name:"--success-base",background:"success-base"},{name:"--success-dark",background:"success-dark"},{name:"--error-lighter",background:"error-lighter"},{name:"--primary-base-neutral-white",background:this.isDarkbackground()?"primary-base":"neutral-white"},{name:"--primary-base-neutral-medium",background:this.isDarkbackground()?"primary-base":"neutral-medium"},{name:"--neutral-lighter-neutral-purewhite",background:this.isDarkbackground()?"neutral-lighter":"neutral-purewhite"},{name:"--primary-darker-neutral-white",background:this.isDarkbackground()?"primary-darker":"neutral-white"},{name:"--primary-base-neutral-base",background:this.isDarkbackground()?"primary-base":"neutral-base"},{name:"--primary-base-neutral-dark",background:this.isDarkbackground()?"primary-base":"neutral-dark"},{name:"--primary-base-neutral-medium",background:this.isDarkbackground()?"primary-base":"neutral-medium"},{name:"--success-base-lighter",background:this.isDarkbackground()?"success-base":"success-lighter"},{name:"--success-dark-base",background:this.isDarkbackground()?"success-dark":"success-base"},{name:"--error-base-lighter",background:this.isDarkbackground()?"error-base":"error-lighter"},{name:"--error-dark-base",background:this.isDarkbackground()?"error-dark":"error-base"}];r.forEach((function(r){return e.styles[r.name]=window.CuraAPI.theme.colors.getColor(r.background)}));this.styles=Object.assign({},this.styles)};e.prototype.connectedCallback=function(){this.sizeHandler();this.setColors()};e.prototype.getClasses=function(){var e={};e["container"]=true;e["checked"]=this.checked;e["disabled"]=this.disabled;e["indeterminate"]=this.indeterminate;e["position"]=this.position==="right";e[this.status]=true;return e};e.prototype.assignColor=function(e){if(this.disabled)return this.isDarkbackground()?"primary-darker":"neutral-medium";var r={success:{icon:"success-dark",label:this.isDarkbackground()?"success-lighter":"success-darker",message:this.isDarkbackground()?"success-base":"success-dark"},error:{icon:"error-dark",label:this.isDarkbackground()?"error-lighter":"neutral-darker",message:this.isDarkbackground()?"error-base":"error-dark"},default:{icon:this.isDarkIconColor()?"neutral-black":"neutral-purewhite",label:this.isDarkbackground()?"neutral-white":"neutral-black",message:this.isDarkbackground()?"primary-lighter":"neutral-dark"}};return r[this.status][e]};e.prototype.getIcon=function(){var e=this.indeterminate?"minus":"check";var r=this.assignColor("icon");var a=this.size==="large"?20:"micro";return s("cura-icon",{class:"icon",name:e,size:a,color:r})};e.prototype.render=function(){return s(i,null,s("div",{class:this.getClasses(),style:this.styles},s("div",{class:"info"},s("div",{class:"label-wrapper"},s("cura-label",{class:"label",size:this.size==="large"?"medium":"xsmall",color:this.assignColor("label")},this.label),this.required&&s("cura-paragraph",{lineHeight:"0%",marginBlock:"0",color:"error-base"},"* ")),s("cura-label",{color:this.assignColor("message"),size:"xsmall",class:"message"},s("slot",null))),s("div",{class:"checkbox",onClick:this.handleClick,tabIndex:this.ontabindex},s("input",{type:"checkbox",name:this.name,value:this.value,disabled:this.disabled,required:this.required,checked:this.checked,indeterminate:this.indeterminate}),this.getIcon())))};Object.defineProperty(e.prototype,"host",{get:function(){return o(this)},enumerable:false,configurable:true});Object.defineProperty(e,"watchers",{get:function(){return{size:["sizeHandler"],color:["setColors"],background:["setColors","assignColor"],iconColor:["assignColor"]}},enumerable:false,configurable:true});return e}());n.style=c}}}));
2	+ //# sourceMappingURL=p-eea5ca70.system.entry.js.map

package/dist/cura/p-eea5ca70.system.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["curaCheckboxCss","CuraCheckbox","exports","this","isDarkbackground","_this","background","isDarkIconColor","iconColor","handleClick","disabled","indeterminate","checked","onchange","emit","value","class_1","prototype","sizeHandler","styles","concat","formsSizes","size","gap","setColors","colors","name","color","forEach","window","CuraAPI","theme","getColor","Object","assign","connectedCallback","getClasses","classes","position","status","assignColor","type","statusColors","success","icon","label","message","error","default","getIcon","iconName","iconSize","h","class","render","Host","style","required","lineHeight","marginBlock","onClick","tabIndex","ontabindex"],"sources":["src/components/forms/cura-checkbox/cura-checkbox.scss?tag=cura-checkbox&encapsulation=shadow","src/components/forms/cura-checkbox/cura-checkbox.tsx"],"sourcesContent":[":host {\n display: block;\n width: fit-content;\n box-sizing: border-box;\n}\n\n/* Container e Layout */\n.container {\n display: flex;\n align-items: center;\n flex-direction: row-reverse;\n gap: var(--gap);\n\n}\n\n.position {\n\n &.container {\n flex-direction: row;\n }\n\n .label-wrapper {\n justify-content: end;\n }\n\n .message {\n text-align: right;\n }\n\n .label {\n order:1\n }\n\n}\n\n.info {\n display: flex;\n flex-direction: column;\n}\n\n.label-wrapper {\n display: flex;\n justify-content: start;\n align-items: center;\n gap: 5px;\n}\n\n/* Control e Checkbox */\n.control {\n width: fit-content;\n cursor: pointer;\n position: relative;\n}\n\n.checkbox {\n appearance: none;\n border: 2px solid var(--primary-base-neutral-medium);\n border-radius: 4px;\n background: var(--neutral-lighter-neutral-purewhite);\n flex: 1 0;\n display: flex;\n align-items: center;\n justify-content: center;\n position: relative;\n cursor: pointer;\n box-sizing: border-box;\n width: var(--size);\n height: var(--size);\n flex: 0 0 var(--size);\n}\n\n.icon {\n position: absolute;\n display: flex;\n opacity: 0;\n transition: opacity 0.3s;\n}\n\n/* Estados de Foco */\n.checkbox:focus {\n border-color: var(--info-base) !important;\n}\n\n/* Estado Disabled */\n.disabled .checkbox {\n background: var(--primary-darker-neutral-white);\n border-color: var(--primary-base-neutral-base);\n cursor: not-allowed;\n\n &:hover {\n border-color: var(--primary-base-neutral-base) !important;\n }\n}\n\n.disabled.checked .checkbox,\n.disabled.indeterminate .checkbox {\n background: var(--primary-base-neutral-white);\n border-color: var(--primary-base-neutral-base);\n\n &:hover {\n border-color: var(--primary-base-neutral-base) !important;\n background: var(--primary-base-neutral-white);\n\n }\n}\n\n.disabled .checkbox:focus {\n border-color: var(--primary-base-neutral-base);\n}\n\n/* Estado Checked */\n.checked .checkbox,\n.indeterminate .checkbox {\n border-color: var(--color-dark);\n background: var(--color-base);\n\n &:hover {\n border-color: var(--color-light) !important;\n background: var(--color-lighter);\n }\n}\n\n.checked .icon,\n.indeterminate .icon {\n opacity: 1;\n}\n\n/* Hover para não disabled, checked, indeterminate */\n:not(.disabled):not(.checked):not(.indeterminate) .checkbox:hover {\n border-color: var(--primary-base-neutral-dark);\n}\n\n/* Estado Success */\n.success .checkbox {\n border-color: var(--success-base) ;\n background: var(--success-lighter);\n\n &:hover{\n border-color: var(--success-base) !important;\n }\n}\n\n.success.checked .checkbox {\n border-color: var(--success-dark-base);\n background: var(--success-base-lighter);\n\n &:hover {\n border-color: var(--success-dark-base);\n }\n}\n\n/* Estado Error */\n.error .checkbox {\n border-color: var(--error-base);\n background: var(--error-lighter);\n\n &:hover {\n border-color: var(--error-base) !important;\n }\n}\n\n.error.checked .checkbox {\n border-color: var(--error-dark-base);\n background: var(--error-base-lighter);\n\n &:hover {\n border-color: var(--error-dark-base);\n }\n}\n\n/* Input */\ninput {\n appearance: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n}\n","import { Component, Prop, Event, Element, h, Host, Watch, EventEmitter, State } from '@stencil/core';\nimport { formsSizes } from '../cura-forms.definitions';\n\n@Component({\n tag: 'cura-checkbox',\n styleUrl: 'cura-checkbox.scss',\n shadow: true,\n})\n\nexport class CuraCheckbox {\n /**\n * Reflects the checked state of the checkbox.\n * Mutable property allowing state change.\n */\n @Prop({ reflect: true, mutable: true }) checked: boolean = false;\n /**\n * Reflects the indeterminate state of the checkbox.\n * Mutable property allowing state change.\n */\n @Prop({ reflect: true, mutable: true }) indeterminate: boolean = false;\n /**\n * Status of the checkbox.\n * Can be 'error', 'success', or 'default'.\n */\n @Prop({ reflect: true, mutable: true }) status: 'error' | 'success' | 'default' = 'default';\n /**\n * Reflects the disabled state of the checkbox.\n */\n @Prop({ reflect: true }) disabled: boolean = false;\n /**\n * Reflects the required state of the checkbox.\n */\n @Prop({ reflect: true }) required: boolean = false;\n /**\n * Text label associated with the checkbox.\n */\n @Prop({ reflect: true }) label: string;\n /**\n * Specifies the tabindex of the checkbox.\n */\n @Prop({ reflect: true }) ontabindex: number = 0;\n /**\n * Position of the label relative to the checkbox.\n * Can be 'left' or 'right'.\n */\n @Prop({ reflect: true }) position: 'left' | 'right' = 'left';\n /**\n * Value associated with the checkbox.\n */\n @Prop({ reflect: true }) value: string;\n /**\n * Name attribute of the checkbox.\n */\n @Prop({ reflect: true }) name: string;\n /**\n * Size of the checkbox.\n * Can be 'small', 'medium', or 'large'.\n */\n @Prop({ reflect: true }) size: 'small' | 'medium' | 'large' = 'medium';\n /**\n * Background theme of the checkbox.\n * Can be 'dark' or 'light'.\n */\n @Prop() background: 'dark' | 'light' = 'light';\n /**\n * iconColor theme of the checkbox.\n * Can be 'dark' or 'light'.\n */\n @Prop() iconColor: 'dark' | 'light' = 'dark';\n /**\n * Color theme of the checkbox.\n */\n @Prop() color = 'accent';\n\n @State() styles = {};\n\n @Element() host: HTMLElement;\n\n @Event() onchange: EventEmitter<{ value: string, checked: boolean, indeterminate: boolean }>;\n\n isDarkbackground = () => this.background === 'dark';\n\n isDarkIconColor = () => this.iconColor === 'dark';\n\n @Watch('size')\n sizeHandler() {\n this.styles['--size'] = `${formsSizes[this.size].size}px`\n this.styles['--gap'] = `${formsSizes[this.size].gap}px`\n }\n\n /**\n * Watches changes in color and background properties to update styles.\n */\n @Watch('color')\n @Watch('background')\n setColors() {\n const colors = [\n { name: '--color-base', background: `${this.color}-base` },\n { name: '--color-lighter', background: `${this.color}-lighter` },\n { name: '--color-light', background: `${this.color}-light` },\n { name: '--color-dark', background: `${this.color}-dark` },\n { name: '--info-base', background: 'info-base' },\n { name: '--error-base', background: 'error-base' },\n { name: '--success-lighter', background: 'success-lighter' },\n { name: '--success-base', background: 'success-base' },\n { name: '--success-dark', background: 'success-dark' },\n { name: '--error-lighter', background: 'error-lighter' },\n { name: '--primary-base-neutral-white', background: this.isDarkbackground() ? 'primary-base' : 'neutral-white' },\n { name: '--primary-base-neutral-medium', background: this.isDarkbackground() ? 'primary-base' : 'neutral-medium' },\n { name: '--neutral-lighter-neutral-purewhite', background: this.isDarkbackground() ? 'neutral-lighter' : 'neutral-purewhite' },\n { name: '--primary-darker-neutral-white', background: this.isDarkbackground() ? 'primary-darker' : 'neutral-white' },\n { name: '--primary-base-neutral-base', background: this.isDarkbackground() ? 'primary-base' : 'neutral-base' },\n { name: '--primary-base-neutral-dark', background: this.isDarkbackground() ? 'primary-base' : 'neutral-dark' },\n { name: '--primary-base-neutral-medium', background: this.isDarkbackground() ? 'primary-base' : 'neutral-medium' },\n { name: '--success-base-lighter', background: this.isDarkbackground() ? 'success-base' : 'success-lighter' },\n { name: '--success-dark-base', background: this.isDarkbackground() ? 'success-dark' : 'success-base' },\n { name: '--error-base-lighter', background: this.isDarkbackground() ? 'error-base' : 'error-lighter' },\n { name: '--error-dark-base', background: this.isDarkbackground() ? 'error-dark' : 'error-base' },\n ];\n\n colors.forEach(color => this.styles[color.name] = window.CuraAPI.theme.colors.getColor(color.background));\n this.styles = { ...this.styles };\n }\n\n connectedCallback() {\n this.sizeHandler()\n this.setColors();\n }\n\n /**\n * Handles click event on the checkbox.\n * Emits onchange event with value, checked, and indeterminate states.\n */\n handleClick = () => {\n if (this.disabled) return;\n\n this.indeterminate = false;\n this.checked = !this.checked;\n this.onchange.emit({ value: this.value, checked: this.checked, indeterminate: this.indeterminate });\n };\n\n /**\n * Retrieves classes based on component state for conditional styling.\n */\n getClasses() {\n const classes = {};\n classes['container'] = true;\n classes['checked'] = this.checked;\n classes['disabled'] = this.disabled;\n classes['indeterminate'] = this.indeterminate;\n classes['position'] = this.position === 'right';\n classes[this.status] = true;\n\n return classes;\n }\n\n /**\n * Assigns color based on status and background theme.\n * @param defaultColor Default color.\n */\n\n @Watch('background')\n @Watch('iconColor')\n assignColor(type: 'icon' | 'label' | 'message',) {\n if (this.disabled) return this.isDarkbackground() ? 'primary-darker' : 'neutral-medium';\n\n const statusColors = {\n success: {\n icon: 'success-dark',\n label: this.isDarkbackground() ? 'success-lighter' : 'success-darker',\n message: this.isDarkbackground() ? 'success-base' : 'success-dark'\n },\n error: {\n icon: 'error-dark',\n label: this.isDarkbackground() ? 'error-lighter' : 'neutral-darker',\n message: this.isDarkbackground() ? 'error-base' : 'error-dark'\n },\n default: {\n icon: this.isDarkIconColor() ? 'neutral-black' : 'neutral-purewhite',\n label: this.isDarkbackground() ? 'neutral-white' : 'neutral-black',\n message: this.isDarkbackground() ? 'primary-lighter' : 'neutral-dark'\n }\n };\n\n return statusColors[this.status][type];\n }\n\n /**\n * Retrieves icon element based on checkbox state.\n */\n getIcon() {\n const iconName = this.indeterminate ? 'minus' : \"check\"\n const iconColor = this.assignColor('icon');\n const iconSize = this.size === 'large' ? 20 : \"micro\"\n\n return <cura-icon class=\"icon\" name={iconName} size={iconSize} color={iconColor}></cura-icon>\n }\n\n\n render() {\n return (\n <Host>\n <div class={this.getClasses()} style={this.styles}>\n <div class=\"info\">\n <div class=\"label-wrapper\">\n <cura-label\n class=\"label\"\n size={this.size === 'large' ? 'medium' : 'xsmall'}\n color={this.assignColor('label')}>\n {this.label}\n </cura-label>\n {this.required && <cura-paragraph lineHeight='0%' marginBlock='0' color=\"error-base\" >* </cura-paragraph>}\n </div>\n <cura-label\n color={this.assignColor('message')}\n size=\"xsmall\"\n class=\"message\">\n <slot></slot>\n </cura-label>\n </div>\n <div class={\"checkbox\"} onClick={this.handleClick} tabIndex={this.ontabindex}>\n <input\n type=\"checkbox\"\n name={this.name}\n value={this.value}\n disabled={this.disabled}\n required={this.required}\n checked={this.checked}\n indeterminate={this.indeterminate}\n />\n {this.getIcon()}\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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"}

package/dist/cura/p-f6e61abf.system.entry.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ System.register(["./p-36a83bc7.system.js","./p-d3f9c888.system.js"],(function(r){"use strict";var e,t,a,i,o;return{setters:[function(r){e=r.r;t=r.c;a=r.h;i=r.H},function(r){o=r.f}],execute:function(){var s='@charset "UTF-8";:host{display:block;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;-webkit-box-sizing:border-box;box-sizing:border-box}.container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-direction:row-reverse;flex-direction:row-reverse;gap:var(--gap)}.position.container{-ms-flex-direction:row;flex-direction:row}.position .label{text-align:right}.position .message{text-align:right}.control{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.track{background:var(--neutral-base-black-40);border-radius:16px;-webkit-transition:background-color 0.3s;transition:background-color 0.3s;-ms-flex-align:start;align-items:flex-start;-ms-flex-negative:0;flex-shrink:0;-webkit-box-sizing:border-box;box-sizing:border-box;width:var(--size-track);height:var(--size)}.thumb{background-color:var(--neutral-white-purewhite);border:2px solid var(--neutral-medium);border-radius:50%;position:absolute;-webkit-transition:outline 0.3s, -webkit-transform 0.3s;transition:outline 0.3s, -webkit-transform 0.3s;transition:transform 0.3s, outline 0.3s;transition:transform 0.3s, outline 0.3s, -webkit-transform 0.3s;display:inline-block;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-box-sizing:border-box;box-sizing:border-box;width:var(--size);height:var(--size)}.checked .thumb{border-color:var(--color-dark-light);background:var(--color-lighter);-webkit-transform:translateX(var(--size));transform:translateX(var(--size))}.checked .thumb:hover{background:var(--neutral-white-purewhite) !important}.checked .track{background:var(--color-base-lighter-50)}.disabled .track{background:var(--primary-base-neutral-black-20)}.disabled .thumb{background:var(--neutral-lighter) !important;border-color:var(--primary-dark-neutral-base);cursor:not-allowed}.disabled.checked .track{background:var(--primary-base-neutral-black-20)}.disabled .thumb:hover{background:var(--neutral-lighter) !important;border-color:var(--primary-dark-neutral-base) !important}:not(.disabled):not(.checked) .thumb:hover{border-color:var(--color-dark-light);background:var(--color-lighter)}:not(.disabled) .thumb:focus{border-color:var(--info-base) !important;z-index:1}';var n=r("cura_switch",function(){function r(r){var a=this;e(this,r);this.onchange=t(this,"onchange",7);this.sizes={large:{size:64},medium:{size:48},small:{size:40}};this.isDarkbackground=function(){return a.background==="dark"};this.toggleSwitch=function(){if(a.disabled)return null;a.checked=!a.checked;a.onchange.emit({checked:a.checked})};this.checked=false;this.disabled=false;this.label="";this.ontabindex=0;this.position="left";this.size="medium";this.background="light";this.color="accent";this.styles={}}r.prototype.sizeHandler=function(){this.styles["--size-track"]="".concat(this.sizes[this.size].size,"px");this.styles["--size"]="".concat(o[this.size].size,"px");this.styles["--gap"]="".concat(o[this.size].gap,"px")};r.prototype.setColors=function(){var r=this;var e=[{name:"--info-base",background:"info-base"},{name:"--neutral-medium",background:"neutral-medium"},{name:"--color-lighter",background:"".concat(this.color,"-lighter")},{name:"--color-base-lighter-50",background:"".concat(this.color,"-").concat(this.isDarkbackground()?"base":"lighter"),opacity:.5},{name:"--color-base-light",background:"".concat(this.color,"-").concat(this.isDarkbackground()?"base":"light")},{name:"--color-dark-light",background:"".concat(this.color,"-").concat(this.isDarkbackground()?"dark":"light")},{name:"--primary-lighter-neutral-dark",background:this.isDarkbackground()?"primary-lighter":"neutral-dark"},{name:"--primary-base-neutral-medium",background:this.isDarkbackground()?"primary-base":"neutral-medium"},{name:"--neutral-white-purewhite",background:"neutral-".concat(this.isDarkbackground()?"white":"purewhite")},{name:"--primary-base-neutral-black-20",background:"".concat(this.isDarkbackground()?"primary-base":"neutral-black"),opacity:.2},{name:"--neutral-base-black-40",background:"neutral-".concat(this.isDarkbackground()?"base":"black"),opacity:.4},{name:"--primary-dark-neutral-base",background:"".concat(this.isDarkbackground()?"primary-dark":"neutral-base")},{name:"--neutral-lighter",background:"".concat(this.isDarkbackground()?"primary-base":"neutral-lighter")}];e.forEach((function(e){return r.styles[e.name]=window.CuraAPI.theme.colors.getColor(e.background,e===null\|\|e===void 0?void 0:e.opacity)}))};r.prototype.connectedCallback=function(){this.sizeHandler();this.setColors()};r.prototype.assignColor=function(r,e){if(this.disabled)return this.isDarkbackground()?"primary-base":"neutral-medium";return this.isDarkbackground()?r:e};r.prototype.getClasses=function(){var r={};r["container"]=true;r["checked"]=this.checked;r["disabled"]=this.disabled;r["position"]=this.position==="right";return r};r.prototype.render=function(){return a(i,null,a("div",{class:this.getClasses(),style:this.styles},a("div",{class:"info"},a("cura-label",{class:"label",size:this.size==="large"?"medium":"xsmall",lineHeight:"125%",color:this.assignColor("neutral-white","neutral-black")},this.label),a("cura-label",{color:this.assignColor("primary-lighter","neutral-dark"),size:"xsmall",class:"message"},a("slot",null))),a("div",{onClick:this.toggleSwitch,class:"control"},a("div",{class:"track ".concat(this.size.toLowerCase())},a("div",{class:"thumb ".concat(this.size.toLowerCase()),tabIndex:this.ontabindex})))))};Object.defineProperty(r,"watchers",{get:function(){return{size:["sizeHandler"],color:["setColors"],background:["setColors"]}},enumerable:false,configurable:true});return r}());n.style=s}}}));
2	+ //# sourceMappingURL=p-f6e61abf.system.entry.js.map

package/dist/cura/p-f6e61abf.system.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["curaSwitchCss","CuraSwitch","exports","this","sizes","large","size","medium","small","isDarkbackground","_this","background","toggleSwitch","disabled","checked","onchange","emit","class_1","prototype","sizeHandler","styles","concat","formsSizes","gap","setColors","colors","name","color","opacity","forEach","window","CuraAPI","theme","getColor","connectedCallback","assignColor","colorDark","colorLight","getClasses","classes","position","render","h","Host","class","style","lineHeight","label","onClick","toLowerCase","tabIndex","ontabindex"],"sources":["src/components/forms/cura-switch/cura-switch.scss?tag=cura-switch&encapsulation=shadow","src/components/forms/cura-switch/cura-switch.tsx"],"sourcesContent":[":host {\n display: block;\n width: fit-content;\n box-sizing: border-box;\n}\n\n.container {\n display: flex;\n align-items: center;\n flex-direction: row-reverse;\n gap: var(--gap);\n}\n\n.position {\n\n &.container {\n flex-direction: row;\n }\n\n .label {\n text-align: right;\n }\n\n .message {\n text-align: right;\n }\n}\n\n.control {\n width: fit-content;\n}\n\n/* Estilos para o controle de switch */\n.track {\n background: var(--neutral-base-black-40);\n border-radius: 16px;\n transition: background-color 0.3s;\n align-items: flex-start;\n flex-shrink: 0;\n box-sizing: border-box;\n width: var(--size-track);\n height: var(--size);\n}\n\n.thumb {\n background-color: var(--neutral-white-purewhite);\n border: 2px solid var(--neutral-medium);\n border-radius: 50%;\n position: absolute;\n transition: transform 0.3s, outline 0.3s;\n display: inline-block;\n cursor: pointer;\n user-select: none;\n box-sizing: border-box;\n width: var(--size);\n height: var(--size);\n}\n\n/* Estado \"checked\" */\n.checked .thumb {\n border-color: var(--color-dark-light);\n background: var(--color-lighter);\n transform: translateX(var(--size));\n}\n\n.checked .thumb:hover {\n background: var(--neutral-white-purewhite) !important;\n}\n\n.checked .track {\n background: var(--color-base-lighter-50);\n}\n\n/* Estado \"disabled\" */\n\n.disabled .track {\n background: var(--primary-base-neutral-black-20);\n\n}\n\n.disabled .thumb {\n background: var(--neutral-lighter) !important;\n border-color: var(--primary-dark-neutral-base);\n cursor: not-allowed;\n\n}\n\n.disabled.checked .track {\n background: var(--primary-base-neutral-black-20);\n}\n\n.disabled .thumb:hover {\n background: var(--neutral-lighter) !important;\n border-color: var(--primary-dark-neutral-base) !important;\n}\n\n/* Estado hover para não disabled e não checked */\n:not(.disabled):not(.checked) .thumb:hover {\n border-color: var(--color-dark-light);\n background: var(--color-lighter);\n}\n\n/* Estado hover para não disabled */\n:not(.disabled) .thumb:focus {\n border-color: var(--info-base) !important;\n z-index: 1;\n}\n","import { Component, Prop, Event, h, Host, Watch, EventEmitter, State } from '@stencil/core';\nimport { formsSizes } from '../cura-forms.definitions';\n\n@Component({\n tag: 'cura-switch',\n styleUrl: 'cura-switch.scss',\n shadow: true,\n})\n\nexport class CuraSwitch {\n /**\n * Indicates whether the switch is checked or not.\n */\n @Prop({ reflect: true, mutable: true }) checked: boolean = false;\n /**\n * Indicates whether the switch is disabled or not.\n */\n @Prop({ reflect: true }) disabled: boolean = false;\n /**\n * The label text to display next to the switch.\n */\n @Prop({ reflect: true }) label: string = '';\n /**\n * Tab index for the switch element.\n * Reflects as an HTML attribute.\n */\n @Prop({ reflect: true }) ontabindex: number = 0;\n /**\n * Position of the label relative to the switch.\n * Can be 'left' or 'right'.\n */\n @Prop({ reflect: true }) position: \"left\" | \"right\" = 'left';\n /**\n * Size of the switch.\n * Can be 'small', 'medium', or 'large'.\n */\n @Prop({ reflect: true }) size: 'small' | 'medium' | 'large' = 'medium';\n /**\n * Background style of the switch.\n * Can be 'dark' or 'light'.\n */\n @Prop() background: 'dark' | 'light' = 'light';\n /**\n * Accent color of the switch.\n */\n @Prop() color = 'accent';\n\n @State() styles = {};\n\n @Event({ eventName: 'onchange', composed: true, cancelable: true, bubbles: true }) onchange: EventEmitter<{ checked: boolean }>;\n\n sizes = {\n \"large\": { size: 64 },\n \"medium\": { size: 48 },\n \"small\": { size: 40 },\n };\n\n\n isDarkbackground = () => this.background === 'dark';\n\n @Watch('size')\n sizeHandler() {\n this.styles['--size-track'] = `${this.sizes[this.size].size}px`\n this.styles['--size'] = `${formsSizes[this.size].size}px`\n this.styles['--gap'] = `${formsSizes[this.size].gap}px`\n }\n\n @Watch('color')\n @Watch('background')\n setColors() {\n const colors = [\n { name: '--info-base', background: 'info-base' },\n { name: '--neutral-medium', background: 'neutral-medium' },\n { name: '--color-lighter', background: `${this.color}-lighter` },\n { name: '--color-base-lighter-50', background: `${this.color}-${this.isDarkbackground() ? 'base' : 'lighter'}`, opacity: 0.5 },\n { name: '--color-base-light', background: `${this.color}-${this.isDarkbackground() ? 'base' : 'light'}` },\n { name: '--color-dark-light', background: `${this.color}-${this.isDarkbackground() ? 'dark' : 'light'}` },\n { name: '--primary-lighter-neutral-dark', background: this.isDarkbackground() ? 'primary-lighter' : 'neutral-dark' },\n { name: '--primary-base-neutral-medium', background: this.isDarkbackground() ? 'primary-base' : 'neutral-medium' },\n { name: '--neutral-white-purewhite', background: `neutral-${this.isDarkbackground() ? 'white' : 'purewhite'}` },\n { name: '--primary-base-neutral-black-20', background: `${this.isDarkbackground() ? 'primary-base' : 'neutral-black'}`, opacity: 0.2 },\n { name: '--neutral-base-black-40', background: `neutral-${this.isDarkbackground() ? 'base' : 'black'}`, opacity: 0.4 },\n { name: '--primary-dark-neutral-base', background: `${this.isDarkbackground() ? 'primary-dark' : 'neutral-base'}` },\n { name: '--neutral-lighter', background: `${this.isDarkbackground() ? 'primary-base' : 'neutral-lighter'}` },\n ];\n\n colors.forEach(color => this.styles[color.name] = window.CuraAPI.theme.colors.getColor(color.background, color?.opacity));\n }\n\n connectedCallback() {\n this.sizeHandler()\n this.setColors();\n }\n\n toggleSwitch = () => {\n if (this.disabled) return null;\n\n this.checked = !this.checked;\n this.onchange.emit({ checked: this.checked })\n };\n\n assignColor(colorDark: string, colorLight: string) {\n if (this.disabled) return this.isDarkbackground() ? 'primary-base' : 'neutral-medium';\n return this.isDarkbackground() ? colorDark : colorLight\n }\n\n getClasses() {\n const classes = {};\n classes['container'] = true;\n classes['checked'] = this.checked;\n classes['disabled'] = this.disabled;\n classes['position'] = this.position === 'right';\n\n return classes;\n }\n\n\n render() {\n return (\n <Host>\n <div class={this.getClasses()} style={this.styles}>\n <div class=\"info\">\n <cura-label class=\"label\"\n size={this.size === 'large' ? 'medium' : 'xsmall'}\n lineHeight=\"125%\"\n color={this.assignColor('neutral-white', 'neutral-black')}>\n {this.label}\n </cura-label>\n <cura-label\n color={this.assignColor('primary-lighter', 'neutral-dark')}\n size=\"xsmall\"\n class=\"message\">\n <slot></slot>\n </cura-label>\n </div>\n\n <div onClick={this.toggleSwitch} class=\"control\">\n <div class={`track ${this.size.toLowerCase()}`}>\n <div class={`thumb ${this.size.toLowerCase()}`} tabIndex={this.ontabindex}></div>\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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"}