@rededor/cura 0.3.9 → 0.4.1

package/dist/esm/cura-icons-view.entry.js

@@ -1,25 +0,0 @@
-import { r as registerInstance, h, H as Host } from './index-92c824be.js';
-
-const iconsetdefaulticons = ["360", "accessibility", "alertCircle", "alertTriangle", "arrowDown", "arrowDownCircle", "arrowLeft", "arrowLeftCircle", "arrowRight", "arrowRightCircle", "arrowUp", "arrowUpCircle", "attach", "avatarF", "avatarM", "biometry", "bloodGroup", "calendar", "cam", "camOff", "central", "chatCircle", "check", "checkBadge", "checkCircle", "checkDouble", "clock", "close", "closeCircle", "collapse", "config", "delete", "desktop", "deslike", "download", "duplicate", "edit", "exam", "expand", "facebook", "fileBmp", "fileJpg", "filePdf", "filePng", "fileUpload", "fileXls", "filter", "fullscreen", "gallery", "geotag", "google", "hate", "healthPlan", "height", "height2", "home", "horizontalList", "imageUp", "info2", "infoCircle", "instagram", "key", "language", "language2", "languageEN", "languagePT", "lattes", "like", "likeHand", "link", "linkExternal", "linkedin", "list", "login", "logout", "love", "mail", "mail2", "medical", "menuHamburguer", "menuKebab", "menuMeatballs", "mic", "micOff", "minus", "minusCircle", "minusSquare", "mobile", "neutral", "news", "notification", "order", "partner", "phone", "play", "plus", "plusCircle", "plusSquare", "print", "profile", "profile2", "pulldownG", "pulldownP", "pullupG", "pullupP", "questionCircle", "questionSquare", "range", "reload", "schedule", "search", "secure", "share", "share2", "sound", "soundOff", "subItem", "target", "team", "twitter", "unLink", "unSecure", "unlikeHand", "upload", "verticalList", "viewFalse", "viewTrue", "weight", "whatsapp", "wifi", "youtube", "zoomIn", "zoomOut"];
-
-const curaIconsViewCss = ":host{display:block;padding:24px;font-family:\"Roboto\", Arial, Helvetica, sans-serif}.iconDetail{display:block}.iconSizes{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.iconSizes .size{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;text-align:center;margin-right:9px;padding:8px}.iconSizes .size:last-child{margin-right:0}.iconSizes .size span{font-size:10px}.iconSizes.invert{margin-top:12px}.iconSizes.invert .size{background-color:#262626;color:#F6F6F6;border-radius:3px}.icons{margin-top:28px;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;position:relative}.icons .icon{position:relative;padding:4px;cursor:pointer;opacity:0.6;-webkit-transition:opacity 0.2s linear;transition:opacity 0.2s linear}.icons .icon span{font-size:12px;padding:6px;-webkit-box-sizing:border-box;box-sizing:border-box;background:#000;color:#FFF;border-radius:2px;position:absolute;top:-2px;left:50%;-webkit-transform:translateX(-50%) translateY(-100%);transform:translateX(-50%) translateY(-100%);display:none}.icons .icon:hover{opacity:1}.icons .icon:hover span{display:block}";
-
-const CuraIconsView = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.sizes = [16, 20, 24, 32, 40, 48, 64, 72, 128];
-    this.colors = ['primary', 'secondary', 'accent', 'info', 'warning', 'error', 'success', 'neutral'];
-    this.setSelected = (icon) => {
-      this.selected = icon;
-    };
-    this.selected = '360';
-  }
-  render() {
-    return (h(Host, null, h("div", { class: "iconDetail" }, h("h4", null, this.selected), h("div", { class: "iconSizes" }, this.sizes.map(size => h("div", { class: "size" }, h("cura-icon", { name: this.selected, size: size }), h("span", null, size)))), h("div", { class: "iconSizes invert" }, this.sizes.map(size => h("div", { class: "size" }, h("cura-icon", { name: this.selected, size: size, color: "neutral-white" }), h("span", null, size)))), h("div", { class: "iconSizes" }, this.colors.map(color => h("div", { class: "size" }, h("cura-icon", { name: this.selected, color: color }), h("span", null, color))), h("div", { class: "size" }, h("cura-icon", { name: this.selected, disabled: true }), h("span", null, "Disabled")))), h("div", { class: "icons" }, iconsetdefaulticons.map(icon => h("div", { class: "icon", onClick: () => this.setSelected(icon) }, h("cura-icon", { name: icon }), h("span", null, icon))))));
-  }
-};
-CuraIconsView.style = curaIconsViewCss;
-
-export { CuraIconsView as cura_icons_view };
-
-//# sourceMappingURL=cura-icons-view.entry.js.map

package/dist/esm/cura-icons-view.entry.js.map

@@ -1 +0,0 @@
-{"file":"cura-icons-view.entry.js","mappings":"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","names":[],"sources":["./src/assets/icons/iconset-default-list.ts","./src/components/cura-icons-view/cura-icons-view.scss?tag=cura-icons-view&encapsulation=shadow","./src/components/cura-icons-view/cura-icons-view.tsx"],"sourcesContent":["export default [\"360\",\"accessibility\",\"alertCircle\",\"alertTriangle\",\"arrowDown\",\"arrowDownCircle\",\"arrowLeft\",\"arrowLeftCircle\",\"arrowRight\",\"arrowRightCircle\",\"arrowUp\",\"arrowUpCircle\",\"attach\",\"avatarF\",\"avatarM\",\"biometry\",\"bloodGroup\",\"calendar\",\"cam\",\"camOff\",\"central\",\"chatCircle\",\"check\",\"checkBadge\",\"checkCircle\",\"checkDouble\",\"clock\",\"close\",\"closeCircle\",\"collapse\",\"config\",\"delete\",\"desktop\",\"deslike\",\"download\",\"duplicate\",\"edit\",\"exam\",\"expand\",\"facebook\",\"fileBmp\",\"fileJpg\",\"filePdf\",\"filePng\",\"fileUpload\",\"fileXls\",\"filter\",\"fullscreen\",\"gallery\",\"geotag\",\"google\",\"hate\",\"healthPlan\",\"height\",\"height2\",\"home\",\"horizontalList\",\"imageUp\",\"info2\",\"infoCircle\",\"instagram\",\"key\",\"language\",\"language2\",\"languageEN\",\"languagePT\",\"lattes\",\"like\",\"likeHand\",\"link\",\"linkExternal\",\"linkedin\",\"list\",\"login\",\"logout\",\"love\",\"mail\",\"mail2\",\"medical\",\"menuHamburguer\",\"menuKebab\",\"menuMeatballs\",\"mic\",\"micOff\",\"minus\",\"minusCircle\",\"minusSquare\",\"mobile\",\"neutral\",\"news\",\"notification\",\"order\",\"partner\",\"phone\",\"play\",\"plus\",\"plusCircle\",\"plusSquare\",\"print\",\"profile\",\"profile2\",\"pulldownG\",\"pulldownP\",\"pullupG\",\"pullupP\",\"questionCircle\",\"questionSquare\",\"range\",\"reload\",\"schedule\",\"search\",\"secure\",\"share\",\"share2\",\"sound\",\"soundOff\",\"subItem\",\"target\",\"team\",\"twitter\",\"unLink\",\"unSecure\",\"unlikeHand\",\"upload\",\"verticalList\",\"viewFalse\",\"viewTrue\",\"weight\",\"whatsapp\",\"wifi\",\"youtube\",\"zoomIn\",\"zoomOut\"];",":host {\n  display: block;\n  padding: 24px;\n  font-family: 'Roboto', Arial, Helvetica, sans-serif;\n}\n\n.iconDetail {\n  display: block;\n}\n\n.iconSizes {\n  display: flex;\n  align-items: center;\n\n\n  .size {\n    display: flex;\n    flex-direction: column;\n    text-align: center;\n    margin-right: 9px;\n    padding: 8px;\n\n    &:last-child { margin-right: 0; }\n    span {\n      font-size: 10px;\n    }\n  }\n\n  &.invert {\n    margin-top: 12px;\n\n    .size {\n      background-color: #262626;\n      color: #F6F6F6;\n      border-radius: 3px;\n    }\n  }\n}\n\n.icons {\n  margin-top: 28px;\n  display: flex;\n  flex-wrap: wrap;\n  position: relative;\n\n  .icon {\n    position: relative;\n    padding: 4px;\n    cursor: pointer;\n    opacity: .6;\n    transition: opacity .2s linear;\n    span {\n      font-size: 12px;\n      padding: 6px;\n      box-sizing: border-box;\n      background: #000;\n      color: #FFF;\n      border-radius: 2px;\n      position: absolute;\n      top: -2px;\n      left: 50%;\n      transform: translateX(-50%) translateY(-100%);\n      display: none;\n    }\n\n    &:hover {\n      opacity: 1;\n\n      span { display: block; }\n    }\n  }\n}\n\n","import { Component, Host, h, State } from '@stencil/core';\nimport iconsetdefaulticons from '../../assets/icons/iconset-default-list';\n\n@Component({\n  tag: 'cura-icons-view',\n  styleUrl: 'cura-icons-view.scss',\n  shadow: true,\n})\nexport class CuraIconsView {\n\n  sizes = [16, 20, 24, 32, 40, 48, 64, 72, 128];\n  colors = ['primary', 'secondary', 'accent', 'info', 'warning', 'error', 'success', 'neutral'];\n  @State() selected = '360';\n\n  setSelected = (icon) => {\n    this.selected = icon;\n  }\n\n  render() {\n    return (\n      <Host>\n        <div class=\"iconDetail\">\n          <h4>{ this.selected }</h4>\n          <div class=\"iconSizes\">\n            { this.sizes.map( size =>\n\n              <div class=\"size\">\n                <cura-icon name={this.selected} size={size}></cura-icon>\n                <span>{ size }</span>\n              </div>\n            )}\n          </div>\n          <div class=\"iconSizes invert\">\n            { this.sizes.map( size =>\n\n              <div class=\"size\">\n                <cura-icon name={this.selected} size={size} color=\"neutral-white\"></cura-icon>\n                <span>{ size }</span>\n              </div>\n            )}\n          </div>\n          <div class=\"iconSizes\">\n            { this.colors.map( color =>\n              <div class=\"size\">\n                <cura-icon name={this.selected} color={color}></cura-icon>\n                <span>{ color }</span>\n              </div>\n            )}\n            <div class=\"size\">\n              <cura-icon name={this.selected} disabled></cura-icon>\n              <span>Disabled</span>\n            </div>\n          </div>\n        </div>\n        <div class=\"icons\">\n          { iconsetdefaulticons.map(icon =>\n            <div class=\"icon\" onClick={() => this.setSelected(icon)}>\n              <cura-icon name={icon}></cura-icon>\n              <span>{icon}</span>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n\n}\n"],"version":3}

package/dist/esm-es5/app-globals-1370f3c7.js

@@ -1,2 +0,0 @@
-var ThemeDefault={color:{primary:{100:"#71C5E8",300:"#449CD5",500:"#005EB8",700:"#004890",900:"#002855"},secondary:{100:"#F5ECE3",300:"#DDC0A2",500:"#CCA074",700:"#886B4D",900:"#292017"},accent:{100:"#FFC27B",300:"#FFA84A",500:"#FF8200",700:"#D7720A",900:"#9B5A1A"}},spacing:{base:4},font:{size:"14px",color:"#4A4A4A",body:"'Roboto', Arial, Helvetica, sans-serif",heading:"'Roboto', Arial, Helvetica, sans-serif",display:"'Roboto', Arial, Helvetica, sans-serif",weights:{thin:100,light:300,regular:400,medium:500,bold:700,black:900}}};var ThemeMaternity=Object.assign(Object.assign({},ThemeDefault),{color:{primary:{100:"#F8E3E2",300:"#FFB3AB",500:"#DA716F",700:"#914B4A",900:"#492625"},secondary:{100:"#FDFBF9",300:"#F7F4EE",500:"#F5ECE3",700:"#CCC5BD",900:"#A39D97"},accent:{100:"#ECEFF9",300:"#8599CB",500:"#0B1497",700:"#070D65",900:"#040732"}},font:{size:"14px",color:"#4A4A4A",body:"'Gotham', Arial, Helvetica, sans-serif",heading:"'Gotham', Arial, Helvetica, sans-serif",display:"'Gotham', Arial, Helvetica, sans-serif",weights:{thin:325,light:325,regular:325,medium:350,bold:400,black:425}}});var ThemeOncology=Object.assign(Object.assign({},ThemeDefault),{color:{primary:{100:"#AABEE1",300:"#557EC4",500:"#003DA6",700:"#00296F",900:"#000C21"},secondary:{100:"#CDD7E3",300:"#9BAFC7",500:"#6886AB",700:"#365E8F",900:"#043673"},accent:{100:"#99CFFF",300:"#47A9FF",500:"#0083F5",700:"#006DCC",900:"#0058A4"},aux:{100:"#DAF2EF",300:"#84D4CA",500:"#47BFB0",700:"#2F7F75",900:"#0E2623"}},font:{size:"14px",color:"#4A4A4A",body:"'Hanken Grotesk', Arial, Helvetica, sans-serif",heading:"'Hanken Grotesk', Arial, Helvetica, sans-serif",display:"'Hanken Grotesk', Arial, Helvetica, sans-serif",weights:{thin:100,light:300,regular:400,medium:500,bold:700,black:900}}});var ThemePresets={default:ThemeDefault,maternidade:ThemeMaternity,oncologia:ThemeOncology};var Static={color:{success:{100:"#DFF6E9",300:"#94E1B5",500:"#5FD290",700:"#3F8C60",900:"#132A1D"},info:{100:"#CFE2FF",300:"#95BFFF",500:"#6EA8FF",700:"#517BBB",900:"#253855"},error:{100:"#FBDDDD",300:"#F28F8F",500:"#EB5757",700:"#9D3A3A",900:"#2F1111"},warning:{100:"#FCFAC4",300:"#F8F489",500:"#F5EF4E",700:"#A39F34",900:"#313010"},neutral:{0:"#FFFFFF",100:"#F6F6F6",200:"#E9E9E9",300:"#E2E2E2",400:"#D4D4D4",500:"#B7B7B7",600:"#929292",700:"#6E6E6E",800:"#4A4A4A",900:"#262626"}}};var CuraThemeColorsModule=function(){function e(){this.NeutralDepthAlias={purewhite:"0",white:"100",pale:"200",lighter:"300",light:"400",base:"500",medium:"600",dark:"700",darker:"800",black:"900"};this.ColorDepthAlias={lighter:"100",light:"300",base:"500",dark:"700",darker:"900"}}e.prototype.getColor=function(e){if(e===void 0){e="primary-base"}var t=this.splitColorDepth(e),r=t.color,o=t.depth;var a=this.getStatic(r,o);if(a)return a;return this.getDynamic(r,o)};e.prototype.getStatic=function(e,t){var r,o,a,i;var n=Static.color[e];if(!n)return null;return e==="neutral"?((r=Static.color[e])===null||r===void 0?void 0:r[this.NeutralDepthAlias[t]])||((o=Static.color[e])===null||o===void 0?void 0:o[t]):((a=Static.color[e])===null||a===void 0?void 0:a[this.ColorDepthAlias[t]])||((i=Static.color[e])===null||i===void 0?void 0:i[t])};e.prototype.getDynamic=function(e,t){var r=this.ColorDepthAlias[t]?"--cura-color-".concat(e,"-").concat(this.ColorDepthAlias[t]):"--cura-color-".concat(e,"-").concat(t);return getComputedStyle(document.body).getPropertyValue(r)?"var(".concat(r,")"):"var(--cura-color-primary-500)"};e.prototype.splitColorDepth=function(e){var t=e.toLowerCase().split(/-(.*)/),r=t[0],o=t[1];return{color:r!==null&&r!==void 0?r:"primary",depth:o!==null&&o!==void 0?o:"base"}};return e}();var CuraThemeSpacingModule=function(){function e(){this.curaSpacing="--cura-spacing-base"}e.prototype.getSpacing=function(){if(getComputedStyle(document.body).getPropertyValue(this.curaSpacing)){return"var(".concat(this.curaSpacing,")")}return"4"};return e}();var CuraThemeFontsModule=function(){function e(){this.getSize=function(){return"var(--cura-font-size)"};this.getColor=function(){return"var(--cura-font-color)"}}e.prototype.getFamily=function(e){if(e===void 0){e="body"}var t="--cura-font-".concat(e.toLowerCase());return getComputedStyle(document.body).getPropertyValue(t)?"var(".concat(t,")"):"var(--cura-font-body)"};e.prototype.getWeights=function(){var e={};Object.keys(ThemeDefault.font.weights).forEach((function(t){return e[t]="var(--cura-font-weights-".concat(t,")")}));return e};return e}();var CuraThemeModule=function(){function e(){var e=this;this.prefix="--cura";this.colors=new CuraThemeColorsModule;this.spacing=new CuraThemeSpacingModule;this.fonts=new CuraThemeFontsModule;this.setCssVar=function(t,r){var o=e.groupPath(r,t[0]);e.body.style.setProperty(o,t[1])};this.groupPath=function(e,t){return"".concat(e,"-").concat(t)};this.isObject=function(e){return e&&typeof e==="object"&&!Array.isArray(e)};this.mergeObject=function(t,r){var o=Object.entries(t);for(var a=0,i=o;a<i.length;a++){var n=i[a];if(e.isObject(n[1])){e.mergeObject(n[1],r[n[0]])}else{r[n[0]]=n[1]}}};this.buildCssVars=function(t,r){var o=Object.entries(r);for(var a=0,i=o;a<i.length;a++){var n=i[a];if(e.isObject(n[1])){e.buildCssVars(e.groupPath(t,n[0]),n[1])}else{e.setCssVar(n,t)}}};this.body=window.document.documentElement.querySelector("body")}e.prototype.load=function(e){if(e===void 0){e="default"}var t=ThemePresets[e]?ThemePresets[e]:ThemePresets.default;this.buildCssVars(this.prefix,t)};e.prototype.setCustom=function(e){var t=e.name;if(t in ThemePresets){console.log("Error building custom theme. Theme %s already exists. Loading default theme.",t);this.load("default")}else{var r=e.fromPreset&&e.fromPreset in ThemePresets?ThemePresets[e.fromPreset]:ThemePresets.default;var o=Object.assign({},JSON.parse(JSON.stringify(r)));this.mergeObject(e.definitions,o);ThemePresets[t]=o;this.load(t)}};return e}();var CuraAPI=function(){function e(e){this.localAssetsPath=e&&e.localAssetsPath?e.localAssetsPath:"/assets";var t=new CuraThemeModule;this.theme={load:function(e){t.load(e)},setCustom:function(e){t.setCustom(e)},colors:{getColor:function(e){return t.colors.getColor(e)}},fonts:{getFamily:function(e){return t.fonts.getFamily(e)},getWeights:function(){return t.fonts.getWeights()},getSize:function(){return t.fonts.getSize()},getColor:function(){return t.fonts.getColor()}},spacing:{getSpacing:function(){return t.spacing.getSpacing()}}};if(e&&e.customTheme){this.theme.setCustom(e.customTheme)}else{var r=e&&e.theme?e.theme:"default";this.theme.load(r)}}return e}();function appGlobalScript(){var e=window.CuraInit;window.CuraAPI=e?new CuraAPI(e):new CuraAPI;var t=window.CuraAPI;window.dispatchEvent(new CustomEvent("CuraAPIReady",{detail:{api:t}}));if(e&&typeof e.onReady==="function")e.onReady(t)}var globalScripts=appGlobalScript;export{globalScripts as g};
-//# sourceMappingURL=app-globals-1370f3c7.js.map

package/dist/esm-es5/app-globals-1370f3c7.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["ThemeDefault","color","primary","secondary","accent","spacing","base","font","size","body","heading","display","weights","thin","light","regular","medium","bold","black","ThemeMaternity","Object","assign","ThemeOncology","aux","ThemePresets","default","maternidade","oncologia","Static","success","info","error","warning","neutral","CuraThemeColorsModule","this","NeutralDepthAlias","purewhite","white","pale","lighter","dark","darker","ColorDepthAlias","prototype","getColor","colorWithDepth","_e","splitColorDepth","depth","staticColor","getStatic","getDynamic","colorObj","_a","_b","_c","_d","themeVar","concat","getComputedStyle","document","getPropertyValue","toLowerCase","split","CuraThemeSpacingModule","curaSpacing","getSpacing","CuraThemeFontsModule","getSize","getFamily","type","curaFontFamilyCSSVar","getWeights","keys","forEach","key","CuraThemeModule","_this","prefix","colors","fonts","setCssVar","prop","path","varName","groupPath","style","setProperty","a","b","isObject","val","Array","isArray","mergeObject","from","to","entries","_i","entries_1","length","e","buildCssVars","obj","entries_2","window","documentElement","querySelector","load","theme","preset","setCustom","customTheme","customTag","name","console","log","fromPreset","newTheme","JSON","parse","stringify","definitions","CuraAPI","config","localAssetsPath","themeModule","themeTag","customThemeDefinitions","CuraInit","api","dispatchEvent","CustomEvent","detail","onReady","globalScripts","appGlobalScript"],"sources":["src/api/theme-presets/theme-default.ts","src/api/theme-presets/theme-maternity.ts","src/api/theme-presets/theme-oncology.ts","src/api/theme-presets/theme-presets.ts","src/api/theme-presets/static.ts","src/api/modules/cura-theme-colors-module.ts","src/api/modules/cura-theme-spacing-module.ts","src/api/modules/cura-theme-fonts-module.ts","src/api/modules/cura-theme-module.ts","src/api/cura-api.ts","src/rededor-cura-start.ts","@stencil/core/internal/app-globals"],"sourcesContent":["/**\n * Cura Default Theme\n */\nexport const ThemeDefault = {\n  /* Colors */\n  color: {\n    primary: {\n      '100': '#71C5E8',\n      '300': '#449CD5',\n      '500': '#005EB8',\n      '700': '#004890',\n      '900': '#002855'\n    },\n    secondary: {\n      '100': '#F5ECE3',\n      '300': '#DDC0A2',\n      '500': '#CCA074',\n      '700': '#886B4D',\n      '900': '#292017'\n    },\n    accent: {\n      '100': '#FFC27B',\n      '300': '#FFA84A',\n      '500': '#FF8200',\n      '700': '#D7720A',\n      '900': '#9B5A1A'\n    }\n  },\n  /* Spacing */\n  spacing: {\n    base: 4,\n  },\n  /* Fonts */\n  font: {\n    size: '14px',\n    color: '#4A4A4A',\n    body: \"'Roboto', Arial, Helvetica, sans-serif\",\n    heading: \"'Roboto', Arial, Helvetica, sans-serif\",\n    display: \"'Roboto', Arial, Helvetica, sans-serif\",\n    weights: {\n      thin: 100,\n      light: 300,\n      regular: 400,\n      medium: 500,\n      bold: 700,\n      black: 900\n    },\n  }\n};\n","/**\n * Maternity Theme\n */\nimport { ThemeDefault } from \"./theme-default\";\n\nexport const ThemeMaternity = {\n  /* Get default theme */\n  ...ThemeDefault,\n  \n  /* Custom */\n  /* Colors */\n  color: {\n    primary: {\n      '100': '#F8E3E2',\n      '300': '#FFB3AB',\n      '500': '#DA716F',\n      '700': '#914B4A',\n      '900': '#492625'\n    },\n    secondary: {\n      '100': '#FDFBF9',\n      '300': '#F7F4EE',\n      '500': '#F5ECE3',\n      '700': '#CCC5BD',\n      '900': '#A39D97'\n    },\n    accent: {\n      '100': '#ECEFF9',\n      '300': '#8599CB',\n      '500': '#0B1497',\n      '700': '#070D65',\n      '900': '#040732'\n    }\n  },\n  font: {\n    size: '14px',\n    color: '#4A4A4A',\n    body: \"'Gotham', Arial, Helvetica, sans-serif\",\n    heading: \"'Gotham', Arial, Helvetica, sans-serif\",\n    display: \"'Gotham', Arial, Helvetica, sans-serif\",\n    weights: {\n      thin: 325,\n      light: 325,\n      regular: 325,      \n      medium: 350,\n      bold: 400,\n      black: 425\n    },\n  }\n};\n","/**\n * Oncology Theme\n */\nimport { ThemeDefault } from \"./theme-default\";\n\nexport const ThemeOncology = {\n  /* Get default theme */\n  ...ThemeDefault,\n\n  /* Custom */\n  /* Colors */\n  color: {\n    primary: {\n      '100': '#AABEE1',\n      '300': '#557EC4',\n      '500': '#003DA6',\n      '700': '#00296F',\n      '900': '#000C21'\n    },\n    secondary: {\n      '100': '#CDD7E3',\n      '300': '#9BAFC7',\n      '500': '#6886AB',\n      '700': '#365E8F',\n      '900': '#043673',\n    },\n    accent: {\n      '100': '#99CFFF',\n      '300': '#47A9FF',\n      '500': '#0083F5',\n      '700': '#006DCC',\n      '900': '#0058A4',\n    },\n    aux: {\n      '100': '#DAF2EF',\n      '300': '#84D4CA',\n      '500': '#47BFB0',\n      '700': '#2F7F75',\n      '900': '#0E2623',\n    },\n  },\n  font: {\n    size: '14px',\n    color: '#4A4A4A',\n    body: \"'Hanken Grotesk', Arial, Helvetica, sans-serif\",\n    heading: \"'Hanken Grotesk', Arial, Helvetica, sans-serif\",\n    display: \"'Hanken Grotesk', Arial, Helvetica, sans-serif\",\n    weights: {\n      thin: 100,\n      light: 300,\n      regular: 400,\n      medium: 500,\n      bold: 700,\n      black: 900\n    },\n  }\n};\n","import { ThemeDefault } from './theme-default';\nimport { ThemeMaternity } from './theme-maternity';\nimport { ThemeOncology } from './theme-oncology';\n\nexport const ThemePresets = {\n  'default': ThemeDefault,\n  'maternidade': ThemeMaternity,\n  'oncologia': ThemeOncology,\n};\n","/**\n * Static\n */\nexport const Static = {\n  /* Colors */\n  color: {\n    success: {\n      '100': '#DFF6E9',\n      '300': '#94E1B5',\n      '500': '#5FD290',\n      '700': '#3F8C60',\n      '900': '#132A1D',\n    },\n    info: {\n      '100': '#CFE2FF',\n      '300': '#95BFFF',\n      '500': '#6EA8FF',\n      '700': '#517BBB',\n      '900': '#253855',\n    },\n    error: {\n      '100': '#FBDDDD',\n      '300': '#F28F8F',\n      '500': '#EB5757',\n      '700': '#9D3A3A',\n      '900': '#2F1111',\n    },\n    warning: {\n      '100': '#FCFAC4',\n      '300': '#F8F489',\n      '500': '#F5EF4E',\n      '700': '#A39F34',\n      '900': '#313010',\n    },\n    neutral: {\n      '0': '#FFFFFF',\n      '100': '#F6F6F6',\n      '200': '#E9E9E9',\n      '300': '#E2E2E2',\n      '400': '#D4D4D4',\n      '500': '#B7B7B7',\n      '600': '#929292',\n      '700': '#6E6E6E',\n      '800': '#4A4A4A',\n      '900': '#262626',\n    },\n  },\n};\n","import { Static } from \"../theme-presets/static\";\n\nexport default class CuraThemeColorsModule {\n  \n  NeutralDepthAlias = {\n    'purewhite': '0',\n    'white': '100',\n    'pale': '200',\n    'lighter': '300',\n    'light': '400',\n    'base': '500',\n    'medium': '600',\n    'dark': '700',\n    'darker': '800',\n    'black': '900',\n  };\n\n  ColorDepthAlias = {\n    'lighter': '100',\n    'light': '300',\n    'base': '500',\n    'dark': '700',\n    'darker': '900'\n  }\n\n  constructor() {}\n\n  /**\n   * Get theme color.\n   * @param colorWithDepth string Ex.: primary-light\n   * @returns css color property. Color definition or related css var from the theme.\n   */\n  getColor(colorWithDepth: string = \"primary-base\"): string {\n    const { color, depth } = this.splitColorDepth(colorWithDepth);\n    const staticColor = this.getStatic(color, depth);\n    if (staticColor) return staticColor;\n    return this.getDynamic(color, depth);\n  }\n\n  /**\n   * Internal: Look for static color by name and depth.\n   * @param color Color name.\n   * @param depth Depth number or alias.\n   * @returns Static color definition.\n   */\n  getStatic(color: string, depth: string) {\n    const colorObj = Static.color[color];\n    if (!colorObj) return null;\n    return color === 'neutral'\n      ? Static.color[color]?.[this.NeutralDepthAlias[depth]] || Static.color[color]?.[depth]\n      : Static.color[color]?.[this.ColorDepthAlias[depth]] || Static.color[color]?.[depth];\n  }\n\n  /**\n   * Internal: Look for theme dynamic colors.\n   * @param color Color name.\n   * @param depth Depth number or alias.\n   * @returns Related CSS variable defined by the theme.\n   */\n  getDynamic(color: string, depth: string) {\n    const themeVar = this.ColorDepthAlias[depth]\n      ? `--cura-color-${color}-${this.ColorDepthAlias[depth]}`\n      : `--cura-color-${color}-${depth}`;\n    return getComputedStyle(document.body).getPropertyValue(themeVar)\n      ? `var(${themeVar})`\n      : `var(--cura-color-primary-500)`;\n  }\n\n  /**\n   * Internal: Split color strings\n   * @param colorWithDepth Color string [color]-[depth]. Ex.: primary-dark or primary-700.\n   * @returns Object { color: string, depth: string }.\n   */\n  private splitColorDepth(colorWithDepth: string): { color: string, depth: string } {\n    const [ color, depth ] = colorWithDepth.toLowerCase().split(/-(.*)/);\n    return { color: color ?? \"primary\", depth: depth ?? \"base\" };\n  }\n\n}\n","export default class CuraThemeSpacingModule {\n\n  private curaSpacing = '--cura-spacing-base';\n\n  constructor() {}\n\n  /** Returns the base spacing var defined in the theme */\n  getSpacing(): string {\n    if (getComputedStyle(document.body).getPropertyValue(this.curaSpacing)) {\n      return `var(${this.curaSpacing})`;\n    }\n    return '4';\n  }\n}\n","import { ThemeDefault } from \"../theme-presets/theme-default\";\n\nexport default class CuraThemeFontsModule {\n\n  constructor() {}\n\n  /**\n   * Get the CSS variable related to the font family defined by the theme.\n   * @param type 'body' | 'heading' | 'display'\n   * @returns Related css variable as a string.\n   */\n  getFamily(type: string = \"body\"): string {\n    const curaFontFamilyCSSVar = `--cura-font-${type.toLowerCase()}`;\n    return getComputedStyle(document.body).getPropertyValue(curaFontFamilyCSSVar)\n      ? `var(${curaFontFamilyCSSVar})`\n      : 'var(--cura-font-body)';\n  }\n\n  /**\n   * Get the CSS variables related to font weights defined by the theme.\n   * @returns Object with CSS vars weights definitions for thin, light, regular, medium, bold and black fonts.\n   */\n  getWeights(): any {\n    const weights = {};\n    Object.keys(ThemeDefault.font.weights).forEach((key) => weights[key] = `var(--cura-font-weights-${key})`);\n    return weights;\n  }\n\n  /**\n   * Get the CSS variable related to the font size base defined by the theme.\n   * @returns Related CSS variable as a string.\n   */\n  getSize = () => `var(--cura-font-size)`;\n\n  /**\n   * Get CSS variable related to the font color defined by the theme.\n   * @returns Related CSS variable as a string.\n   */\n  getColor = () => `var(--cura-font-color)`;\n\n}\n","import { ThemePresets } from \"../theme-presets/theme-presets\";\nimport { CuraCustomTheme } from \"../cura-api.type\";\nimport CuraThemeColorsModule from \"./cura-theme-colors-module\";\nimport CuraThemeSpacingModule from \"./cura-theme-spacing-module\";\nimport CuraThemeFontsModule from \"./cura-theme-fonts-module\";\n\nexport default class CuraThemeModule {\n\n  body: HTMLBodyElement;\n  prefix = '--cura';\n  colors = new CuraThemeColorsModule();\n  spacing = new CuraThemeSpacingModule();\n  fonts = new CuraThemeFontsModule();\n\n  constructor() {\n    this.body = window.document.documentElement.querySelector('body');\n  }\n\n  /**\n   * Load a theme.\n   * @param theme Theme tag.\n   */\n  load(theme = 'default') {\n    const preset = ThemePresets[theme] ? ThemePresets[theme] : ThemePresets.default;\n    this.buildCssVars(this.prefix, preset);\n  }\n\n  /**\n   * Define a custom theme\n   * @param customTheme Custom theme object definition\n   */\n  setCustom(customTheme: CuraCustomTheme) {\n    const customTag = customTheme.name;\n    if (customTag in ThemePresets) {\n      console.log('Error building custom theme. Theme %s already exists. Loading default theme.', customTag);\n      this.load('default');\n    } else {\n      const preset = customTheme.fromPreset && customTheme.fromPreset in ThemePresets\n        ? ThemePresets[customTheme.fromPreset]\n        : ThemePresets.default;\n      const newTheme = {...JSON.parse(JSON.stringify(preset))};\n      this.mergeObject(customTheme.definitions, newTheme);\n      ThemePresets[customTag] = newTheme;\n      this.load(customTag);\n    }\n  }\n\n  /* Private */\n\n  /** Set css var based on object structure */\n  setCssVar = (prop, path) => {\n    const varName = this.groupPath(path, prop[0]);\n    this.body.style.setProperty(varName, prop[1]);\n  }\n\n  groupPath = (a, b) => `${a}-${b}`;\n\n  isObject = (val) => {\n    return val && typeof val === 'object' && !Array.isArray(val);\n  }\n\n  /** Deep merge objects */\n  mergeObject = (from, to) => {\n    const entries = Object.entries(from);\n    for (let e of entries) {\n      if (this.isObject(e[1])) {\n        this.mergeObject(e[1], to[e[0]]);\n      } else {\n        to[e[0]] = e[1];\n      }\n    }\n  }\n\n  /** Set css vars from preset object */\n  buildCssVars = (path, obj) => {\n    const entries = Object.entries(obj);\n    for (let e of entries) {\n      if (this.isObject(e[1])) {\n        this.buildCssVars(this.groupPath(path, e[0]), e[1]);\n      } else {\n        this.setCssVar(e, path);\n      }\n    }\n  }\n}\n","import { CuraConfig, APIThemeFunctions, CuraCustomTheme } from './cura-api.type';\nimport CuraThemeModule from './modules/cura-theme-module';\n\nexport default class CuraAPI {\n\n  theme: APIThemeFunctions;\n  localAssetsPath: string;\n\n  constructor (config?: CuraConfig) {\n    this.localAssetsPath = config && config.localAssetsPath ? config.localAssetsPath : `/assets`;\n    const themeModule = new CuraThemeModule();\n    this.theme = {\n      load: function(themeTag: string) { themeModule.load(themeTag); },\n      setCustom: function(customThemeDefinitions: CuraCustomTheme) { themeModule.setCustom(customThemeDefinitions); },\n      colors: {\n        getColor: function(colorWithDepth?: string) { return themeModule.colors.getColor(colorWithDepth) },\n      },\n      fonts: {\n        getFamily: function(type?: string) { return themeModule.fonts.getFamily(type) },\n        getWeights: function() { return themeModule.fonts.getWeights() },\n        getSize: function() { return themeModule.fonts.getSize() },\n        getColor: function() { return themeModule.fonts.getColor() }\n      },\n      spacing: {\n        getSpacing: function() { return themeModule.spacing.getSpacing(); },\n      },\n   };\n    if (config && config.customTheme) {\n      this.theme.setCustom(config.customTheme);\n    } else {\n      const theme = config && config.theme ? config.theme : 'default';\n      this.theme.load(theme);\n    }\n  }\n\n}\n","import CuraAPI from './api/cura-api';\nimport { CuraConfig } from './api/cura-api.type';\n// import { setAssetPath } from '@stencil/core';\n\n// setAssetPath(import.meta.url);\ndeclare global {\n  interface Window {\n    CuraAPI?: CuraAPI,\n    CuraInit?: CuraConfig\n  }\n}\n\nexport default function() {\n  const config = window.CuraInit;\n  window.CuraAPI = config ? new CuraAPI(config) : new CuraAPI();\n  const api = window.CuraAPI;\n  window.dispatchEvent(new CustomEvent(\"CuraAPIReady\", { detail: {api} }));\n  if (config && typeof config.onReady === 'function') config.onReady(api);\n}\n","import appGlobalScript from '/Users/fellipesoares/Code/cura/packages/component-lib/src/rededor-cura-start.ts';\nexport const globalScripts = appGlobalScript;\n"],"mappings":"AAGO,IAAMA,aAAe,CAE1BC,MAAO,CACLC,QAAS,CACP,IAAO,UACP,IAAO,UACP,IAAO,UACP,IAAO,UACP,IAAO,WAETC,UAAW,CACT,IAAO,UACP,IAAO,UACP,IAAO,UACP,IAAO,UACP,IAAO,WAETC,OAAQ,CACN,IAAO,UACP,IAAO,UACP,IAAO,UACP,IAAO,UACP,IAAO,YAIXC,QAAS,CACPC,KAAM,GAGRC,KAAM,CACJC,KAAM,OACNP,MAAO,UACPQ,KAAM,yCACNC,QAAS,yCACTC,QAAS,yCACTC,QAAS,CACPC,KAAM,IACNC,MAAO,IACPC,QAAS,IACTC,OAAQ,IACRC,KAAM,IACNC,MAAO,OCxCN,IAAMC,eAAcC,OAAAC,OAAAD,OAAAC,OAAA,GAEtBrB,cAAY,CAIfC,MAAO,CACLC,QAAS,CACP,IAAO,UACP,IAAO,UACP,IAAO,UACP,IAAO,UACP,IAAO,WAETC,UAAW,CACT,IAAO,UACP,IAAO,UACP,IAAO,UACP,IAAO,UACP,IAAO,WAETC,OAAQ,CACN,IAAO,UACP,IAAO,UACP,IAAO,UACP,IAAO,UACP,IAAO,YAGXG,KAAM,CACJC,KAAM,OACNP,MAAO,UACPQ,KAAM,yCACNC,QAAS,yCACTC,QAAS,yCACTC,QAAS,CACPC,KAAM,IACNC,MAAO,IACPC,QAAS,IACTC,OAAQ,IACRC,KAAM,IACNC,MAAO,QCzCN,IAAMI,cAAaF,OAAAC,OAAAD,OAAAC,OAAA,GAErBrB,cAAY,CAIfC,MAAO,CACLC,QAAS,CACP,IAAO,UACP,IAAO,UACP,IAAO,UACP,IAAO,UACP,IAAO,WAETC,UAAW,CACT,IAAO,UACP,IAAO,UACP,IAAO,UACP,IAAO,UACP,IAAO,WAETC,OAAQ,CACN,IAAO,UACP,IAAO,UACP,IAAO,UACP,IAAO,UACP,IAAO,WAETmB,IAAK,CACH,IAAO,UACP,IAAO,UACP,IAAO,UACP,IAAO,UACP,IAAO,YAGXhB,KAAM,CACJC,KAAM,OACNP,MAAO,UACPQ,KAAM,iDACNC,QAAS,iDACTC,QAAS,iDACTC,QAAS,CACPC,KAAM,IACNC,MAAO,IACPC,QAAS,IACTC,OAAQ,IACRC,KAAM,IACNC,MAAO,QCjDN,IAAMM,aAAe,CAC1BC,QAAWzB,aACX0B,YAAeP,eACfQ,UAAaL,eCJR,IAAMM,OAAS,CAEpB3B,MAAO,CACL4B,QAAS,CACP,IAAO,UACP,IAAO,UACP,IAAO,UACP,IAAO,UACP,IAAO,WAETC,KAAM,CACJ,IAAO,UACP,IAAO,UACP,IAAO,UACP,IAAO,UACP,IAAO,WAETC,MAAO,CACL,IAAO,UACP,IAAO,UACP,IAAO,UACP,IAAO,UACP,IAAO,WAETC,QAAS,CACP,IAAO,UACP,IAAO,UACP,IAAO,UACP,IAAO,UACP,IAAO,WAETC,QAAS,CACP,EAAK,UACL,IAAO,UACP,IAAO,UACP,IAAO,UACP,IAAO,UACP,IAAO,UACP,IAAO,UACP,IAAO,UACP,IAAO,UACP,IAAO,a,qCCnBX,SAAAC,IArBAC,KAAAC,kBAAoB,CAClBC,UAAa,IACbC,MAAS,MACTC,KAAQ,MACRC,QAAW,MACX1B,MAAS,MACTR,KAAQ,MACRU,OAAU,MACVyB,KAAQ,MACRC,OAAU,MACVxB,MAAS,OAGXiB,KAAAQ,gBAAkB,CAChBH,QAAW,MACX1B,MAAS,MACTR,KAAQ,MACRmC,KAAQ,MACRC,OAAU,M,CAUZR,EAAAU,UAAAC,SAAA,SAASC,GAAA,GAAAA,SAAA,GAAAA,EAAA,cAAuC,CACxC,IAAAC,EAAmBZ,KAAKa,gBAAgBF,GAAtC7C,EAAK8C,EAAA9C,MAAEgD,EAAKF,EAAAE,MACpB,IAAMC,EAAcf,KAAKgB,UAAUlD,EAAOgD,GAC1C,GAAIC,EAAa,OAAOA,EACxB,OAAOf,KAAKiB,WAAWnD,EAAOgD,E,EAShCf,EAAAU,UAAAO,UAAA,SAAUlD,EAAegD,G,YACvB,IAAMI,EAAWzB,OAAO3B,MAAMA,GAC9B,IAAKoD,EAAU,OAAO,KACtB,OAAOpD,IAAU,YACbqD,EAAA1B,OAAO3B,MAAMA,MAAM,MAAAqD,SAAA,SAAAA,EAAGnB,KAAKC,kBAAkBa,QAAWM,EAAA3B,OAAO3B,MAAMA,MAAM,MAAAsD,SAAA,SAAAA,EAAGN,MAC9EO,EAAA5B,OAAO3B,MAAMA,MAAM,MAAAuD,SAAA,SAAAA,EAAGrB,KAAKQ,gBAAgBM,QAAWQ,EAAA7B,OAAO3B,MAAMA,MAAM,MAAAwD,SAAA,SAAAA,EAAGR,G,EASlFf,EAAAU,UAAAQ,WAAA,SAAWnD,EAAegD,GACxB,IAAMS,EAAWvB,KAAKQ,gBAAgBM,GAClC,gBAAAU,OAAgB1D,EAAK,KAAA0D,OAAIxB,KAAKQ,gBAAgBM,IAC9C,gBAAAU,OAAgB1D,EAAK,KAAA0D,OAAIV,GAC7B,OAAOW,iBAAiBC,SAASpD,MAAMqD,iBAAiBJ,GACpD,OAAAC,OAAOD,EAAQ,KACf,+B,EAQExB,EAAAU,UAAAI,gBAAA,SAAgBF,GAChB,IAAAC,EAAmBD,EAAeiB,cAAcC,MAAM,SAApD/D,EAAK8C,EAAA,GAAEE,EAAKF,EAAA,GACpB,MAAO,CAAE9C,MAAOA,IAAK,MAALA,SAAK,EAALA,EAAS,UAAWgD,MAAOA,IAAK,MAALA,SAAK,EAALA,EAAS,O,oDCvEtD,SAAAgB,IAFQ9B,KAAA+B,YAAc,qB,CAKtBD,EAAArB,UAAAuB,WAAA,WACE,GAAIP,iBAAiBC,SAASpD,MAAMqD,iBAAiB3B,KAAK+B,aAAc,CACtE,MAAO,OAAAP,OAAOxB,KAAK+B,YAAW,I,CAEhC,MAAO,G,kDCPT,SAAAE,IA4BAjC,KAAAkC,QAAU,WAAM,+BAMhBlC,KAAAU,SAAW,WAAM,+B,CA3BjBuB,EAAAxB,UAAA0B,UAAA,SAAUC,GAAA,GAAAA,SAAA,GAAAA,EAAA,MAAqB,CAC7B,IAAMC,EAAuB,eAAAb,OAAeY,EAAKR,eACjD,OAAOH,iBAAiBC,SAASpD,MAAMqD,iBAAiBU,GACpD,OAAAb,OAAOa,EAAoB,KAC3B,uB,EAONJ,EAAAxB,UAAA6B,WAAA,WACE,IAAM7D,EAAU,GAChBQ,OAAOsD,KAAK1E,aAAaO,KAAKK,SAAS+D,SAAQ,SAACC,GAAQ,OAAAhE,EAAQgE,GAAO,2BAAAjB,OAA2BiB,EAAG,IAA7C,IACxD,OAAOhE,C,6CCXT,SAAAiE,IAAA,IAAAC,EAAA3C,KALAA,KAAA4C,OAAS,SACT5C,KAAA6C,OAAS,IAAI9C,sBACbC,KAAA9B,QAAU,IAAI4D,uBACd9B,KAAA8C,MAAQ,IAAIb,qBAsCZjC,KAAA+C,UAAY,SAACC,EAAMC,GACjB,IAAMC,EAAUP,EAAKQ,UAAUF,EAAMD,EAAK,IAC1CL,EAAKrE,KAAK8E,MAAMC,YAAYH,EAASF,EAAK,G,EAG5ChD,KAAAmD,UAAY,SAACG,EAAGC,GAAM,SAAA/B,OAAG8B,EAAC,KAAA9B,OAAI+B,EAAR,EAEtBvD,KAAAwD,SAAW,SAACC,GACV,OAAOA,UAAcA,IAAQ,WAAaC,MAAMC,QAAQF,E,EAI1DzD,KAAA4D,YAAc,SAACC,EAAMC,GACnB,IAAMC,EAAU9E,OAAO8E,QAAQF,GAC/B,IAAc,IAAAG,EAAA,EAAAC,EAAAF,EAAAC,EAAAC,EAAAC,OAAAF,IAAS,CAAlB,IAAIG,EAACF,EAAAD,GACR,GAAIrB,EAAKa,SAASW,EAAE,IAAK,CACvBxB,EAAKiB,YAAYO,EAAE,GAAIL,EAAGK,EAAE,I,KACvB,CACLL,EAAGK,EAAE,IAAMA,EAAE,E,IAMnBnE,KAAAoE,aAAe,SAACnB,EAAMoB,GACpB,IAAMN,EAAU9E,OAAO8E,QAAQM,GAC/B,IAAc,IAAAL,EAAA,EAAAM,EAAAP,EAAAC,EAAAM,EAAAJ,OAAAF,IAAS,CAAlB,IAAIG,EAACG,EAAAN,GACR,GAAIrB,EAAKa,SAASW,EAAE,IAAK,CACvBxB,EAAKyB,aAAazB,EAAKQ,UAAUF,EAAMkB,EAAE,IAAKA,EAAE,G,KAC3C,CACLxB,EAAKI,UAAUoB,EAAGlB,E,IAjEtBjD,KAAK1B,KAAOiG,OAAO7C,SAAS8C,gBAAgBC,cAAc,O,CAO5D/B,EAAAjC,UAAAiE,KAAA,SAAKC,GAAA,GAAAA,SAAA,GAAAA,EAAA,SAAiB,CACpB,IAAMC,EAASvF,aAAasF,GAAStF,aAAasF,GAAStF,aAAaC,QACxEU,KAAKoE,aAAapE,KAAK4C,OAAQgC,E,EAOjClC,EAAAjC,UAAAoE,UAAA,SAAUC,GACR,IAAMC,EAAYD,EAAYE,KAC9B,GAAID,KAAa1F,aAAc,CAC7B4F,QAAQC,IAAI,+EAAgFH,GAC5F/E,KAAK0E,KAAK,U,KACL,CACL,IAAME,EAASE,EAAYK,YAAcL,EAAYK,cAAc9F,aAC/DA,aAAayF,EAAYK,YACzB9F,aAAaC,QACjB,IAAM8F,EAAQnG,OAAAC,OAAA,GAAOmG,KAAKC,MAAMD,KAAKE,UAAUX,KAC/C5E,KAAK4D,YAAYkB,EAAYU,YAAaJ,GAC1C/F,aAAa0F,GAAaK,EAC1BpF,KAAK0E,KAAKK,E,sCCnCd,SAAAU,EAAaC,GACX1F,KAAK2F,gBAAkBD,GAAUA,EAAOC,gBAAkBD,EAAOC,gBAAkB,UACnF,IAAMC,EAAc,IAAIlD,gBACxB1C,KAAK2E,MAAQ,CACXD,KAAM,SAASmB,GAAoBD,EAAYlB,KAAKmB,EAAU,EAC9DhB,UAAW,SAASiB,GAA2CF,EAAYf,UAAUiB,EAAwB,EAC7GjD,OAAQ,CACNnC,SAAU,SAASC,GAA2B,OAAOiF,EAAY/C,OAAOnC,SAASC,EAAe,GAElGmC,MAAO,CACLX,UAAW,SAASC,GAAiB,OAAOwD,EAAY9C,MAAMX,UAAUC,EAAK,EAC7EE,WAAY,WAAa,OAAOsD,EAAY9C,MAAMR,YAAY,EAC9DJ,QAAS,WAAa,OAAO0D,EAAY9C,MAAMZ,SAAS,EACxDxB,SAAU,WAAa,OAAOkF,EAAY9C,MAAMpC,UAAU,GAE5DxC,QAAS,CACP8D,WAAY,WAAa,OAAO4D,EAAY1H,QAAQ8D,YAAa,IAGrE,GAAI0D,GAAUA,EAAOZ,YAAa,CAChC9E,KAAK2E,MAAME,UAAUa,EAAOZ,Y,KACvB,CACL,IAAMH,EAAQe,GAAUA,EAAOf,MAAQe,EAAOf,MAAQ,UACtD3E,KAAK2E,MAAMD,KAAKC,E,yCClBpB,IAAMe,EAASnB,OAAOwB,SACtBxB,OAAOkB,QAAUC,EAAS,IAAID,QAAAC,GAAA,IAAAD,QAC9B,IAAMO,EAAMzB,OAAOkB,QACnBlB,OAAO0B,cAAc,IAAIC,YAAA,gBAAAC,OAAA,CAAAH,UACzB,GAAIN,UAAiBA,EAAOU,UAAY,WAAYV,EAAOU,QAAQJ,EACrE,CCjBY,IAACK,cAAgBC,uB"}

package/dist/esm-es5/cura-button_9.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["curaButtonCss","CuraButton","prototype","handleChangeColor","this","setColors","connectedCallback","weights","window","CuraAPI","theme","fonts","getWeights","styles","spacing","getSpacing","colors","getColor","getSize","getFamily","medium","textAlign","getClasses","classes","concat","size","toLowerCase","iconPosition","iconOnly","fontColor","disabled","isLoading","Object","assign","color","getIcon","iconName","iconSize","getSymbolColor","h","name","iconset","handleClick","e","preventDefault","render","_this","Host","href","target","class","style","onClick","label","inverted","curaButtonOutlineCss","CuraButtonOutline","curaButtonTransparentCss","CuraButtonTransparent","curaDisplayCss","CuraDisplay","setFontProperties","bold","black","setHostProperty","spotColor","prop","value","host","setProperty","getHeadingTag","tags","default","level","curaHeadingCss","CuraHeading","weight","regular","curaIconCss","CuraIcon","sizes","stroke","sizeHandler","scaledStroke","colorHandler","assetsPath","localAssetsPath","version","viewBox","preserveAspectRatio","xmlns","xlinkHref","curaLoaderCircleCss","CuraLoaderCircle","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/buttons/cura-button/cura-button.scss?tag=cura-button&encapsulation=shadow","src/components/buttons/cura-button/cura-button.tsx","src/components/buttons/cura-button-outline/cura-button-outline.scss?tag=cura-button-outline&encapsulation=shadow","src/components/buttons/cura-button-outline/cura-button-outline.tsx","src/components/buttons/cura-button-transparent/cura-button-transparent.scss?tag=cura-button-transparent&encapsulation=shadow","src/components/buttons/cura-button-transparent/cura-button-transparent.tsx","src/components/text/cura-display/cura-display.scss?tag=cura-display&encapsulation=shadow","src/components/text/cura-display/cura-display.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":["@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/buttons.scss\";\n\n:host {\n  @include button-host();\n\n  button, a {\n    @include button-element() {\n      background-color: transparent;\n      border: none;\n      box-shadow: inset 0px 0px 0px 2px var(--color-base);\n\n      &:not(.disabled):not(.isLoading):hover {\n        box-shadow: inset 0px 0px 0px 2px var(--color-light);\n        .label { color: var(--color-light); }\n        cura-icon { --color: var(--color-light) !important; }\n      }\n\n      &:not(.disabled):not(.inverted):not(.isLoading):active { \n        box-shadow: inset 0px 0px 0px 2px var(--color-dark);\n        .label { color: var(--color-dark); }\n        cura-icon { --color: var(--color-dark) !important; }\n      }\n    };\n\n    @include button-sizes();\n\n    // Children Elements\n    @include button-container();\n    @include button-label() {\n      color: var(--color-base);\n      &.inverted { color: var(--neutral-white); }\n    }\n    @include button-icon();\n\n    // Disabled state\n    @include button-disabled() {\n      box-shadow: inset 0px 0px 0px 2px var(--neutral-base);\n      .label, .label.inverted { color: var(--neutral-dark); }\n      &.inverted {\n        opacity: 0.6;\n        box-shadow: inset 0px 0px 0px 2px var(--neutral-white);\n        .label, .label.inverted { color: var(--neutral-white); }\n        cura-icon { --color: var(--neutral-white) !important; }\n        cura-loader-circle { --color: var(--neutral-white) !important; }\n      }\n    };\n\n    // FAB / Icon-only\n    @include button-icon-only-behavior();\n\n    // Light version, inverted.\n    &.inverted {\n      box-shadow: inset 0px 0px 0px 2px var(--neutral-white);\n      &:not(.disabled):not(.isLoading):hover { \n        box-shadow: inset 0px 0px 0px 2px var(--color-lighter);\n        .label { color: var(--color-lighter); }\n        cura-icon { --color: var(--color-lighter) !important; }\n      }\n      &:not(.disabled):not(.isLoading):active {\n        box-shadow: inset 0px 0px 0px 2px var(--color-light);\n        .label { color: var(--color-light); }\n        cura-icon { --color: var(--color-light) !important; }\n      }\n    }\n\n    // Loading State\n    @include button-loading();\n\n  }\n\n}\n","import { Component, Host, h, Prop, Watch, State } from '@stencil/core';\n\n@Component({\n  tag: 'cura-button-outline',\n  styleUrl: 'cura-button-outline.scss',\n  shadow: true,\n})\nexport class CuraButtonOutline {\n\n  /**\n  * Button size: small | medium | large (default)\n  */\n  @Prop({reflect: true}) size: 'small' | 'medium' | 'large' = 'large';\n\n  /**\n  * Disabled state. Boolean.\n  */\n  @Prop({reflect: true}) disabled = false;\n  /**\n  * Loading state. Boolean.\n  */\n  @Prop({reflect: true}) isLoading = false;\n  \n  /**\n  * Name of the icon to be used from iconset.\n  */\n  @Prop({reflect: true}) iconName: string;\n  /**\n  * Custom iconset if needed.\n  */\n  @Prop({reflect: true}) iconset = 'default';\n  /**\n  * Icon position: left (default) | right.\n  */\n  @Prop({reflect: true}) iconPosition: 'left' | 'right' = 'left';\n  /**\n  * Set button to FAB/icon only.\n  */\n  @Prop({reflect: true}) iconOnly: false;\n\n  /**\n  * Property href switch button to link.\n  */\n  @Prop({reflect: true}) href: string;\n  /**\n  * Set target if link.\n  */\n  @Prop({reflect: true}) target = \"_self\";\n\n  /**\n  * Color base from color scheme. Default: accent.\n  */\n  @Prop() 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-base'] = window.CuraAPI.theme.colors.getColor(`neutral-base`);\n    this.styles['--neutral-dark'] = window.CuraAPI.theme.colors.getColor(`neutral-dark`);\n    this.styles['--font-size'] = window.CuraAPI.theme.fonts.getSize();\n    this.styles['--font-family'] = window.CuraAPI.theme.fonts.getFamily();\n    this.styles['--font-weight-medium'] = this.weights.medium;\n    this.styles['--text-align'] = this.textAlign;\n    this.setColors();\n  }\n  \n  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-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    };\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        : `${this.color}-base`;\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/buttons.scss\";\n\n:host {\n  @include button-host();\n\n  button, a {\n    @include button-element() {\n      background-color: transparent;\n      border-width: 0px;\n      border-color: transparent;\n\n      &:not(.disabled):not(.isLoading):hover {\n        .label { color: var(--color-light); }\n        cura-icon { --color: var(--color-light) !important; }\n      }\n\n      &:not(.disabled):not(.inverted):not(.isLoading):active { \n        .label { color: var(--color-dark); }\n        cura-icon { --color: var(--color-dark) !important; }\n      }\n    }\n    \n    @include button-sizes();\n\n    // Children Elements\n    @include button-container();\n    @include button-label() {\n      color: var(--color-base);\n      &.inverted { color: var(--neutral-white); }\n    }\n    @include button-icon();\n\n    // Disabled state\n    @include button-disabled() {\n      border-color: var(--neutral-base);\n      .label, .label.inverted { color: var(--neutral-dark); }\n      &.inverted {\n        opacity: 0.6;\n        .label, .label.inverted { color: var(--neutral-white); }\n        cura-icon { --color: var(--neutral-white) !important; }\n        cura-loader-circle { --color: var(--neutral-white) !important; }\n      }\n    }\n\n    // FAB / Icon-only\n    @include button-icon-only-behavior();\n\n    &.inverted {\n      &:not(.isLoading):not(.disabled):hover { \n        .label { color: var(--color-lighter); }\n        cura-icon { --color: var(--color-lighter) !important; }\n      }\n      &:not(.isLoading):not(.disabled):active {\n        .label { color: var(--color-light); }\n        cura-icon { --color: var(--color-light) !important; }\n      }\n    }\n\n    // Loading State\n    @include button-loading();\n\n  }\n}\n","import { Component, Host, h, Prop, State, Watch } from '@stencil/core';\n\n@Component({\n  tag: 'cura-button-transparent',\n  styleUrl: 'cura-button-transparent.scss',\n  shadow: true,\n})\nexport class CuraButtonTransparent {\n\n   /**\n    * Button size: small | medium | large (default)\n    */\n   @Prop({reflect: true}) size: 'small' | 'medium' | 'large' = 'large';\n \n   /**\n    * Disabled state. Boolean.\n    */\n   @Prop({reflect: true}) disabled = false;\n   /**\n    * Loading state. Boolean.\n    */\n   @Prop({reflect: true}) isLoading = false;\n   \n   /**\n    * Name of the icon to be used from iconset.\n    */\n   @Prop({reflect: true}) iconName: string;\n   /**\n    * Custom iconset if needed.\n    */\n   @Prop({reflect: true}) iconset = 'default';\n   /**\n    * Icon position: left (default) | right.\n    */\n   @Prop({reflect: true}) iconPosition: 'left' | 'right' = 'left';\n   /**\n    * Set button to FAB/icon only.\n    */\n   @Prop({reflect: true}) iconOnly: false;\n \n   /**\n    * Property href switch button to link.\n    */\n   @Prop({reflect: true}) href: string;\n   /**\n    * Set target if link.\n    */\n   @Prop({reflect: true}) target = \"_self\";\n \n   /**\n    * Color base from color scheme. Default: accent.\n    */\n   @Prop() 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-base'] = window.CuraAPI.theme.colors.getColor(`neutral-base`);\n     this.styles['--neutral-dark'] = window.CuraAPI.theme.colors.getColor(`neutral-dark`);\n     this.styles['--font-size'] = window.CuraAPI.theme.fonts.getSize();\n     this.styles['--font-family'] = window.CuraAPI.theme.fonts.getFamily();\n     this.styles['--font-weight-medium'] = this.weights.medium;\n     this.styles['--text-align'] = this.textAlign;\n     this.setColors();\n   }\n   \n   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-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     };\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         : `${this.color}-base`;\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);\n  text-transform: uppercase;\n\n  h1, h2, h3, h4, h5, h6 {\n    font-family: var(--font-family);\n    font-size: 4.285em;\n    font-weight: var(--font-weight-black);\n    color: var(--color-body);\n    line-height: 120%;\n    letter-spacing: -4%;\n    margin-block-start: var(--block-margin);\n    margin-block-end: var(--block-margin);\n\n    &.large {\n      font-size:6.21em;\n    }\n\n    &.small {\n      font-size: 3em;\n      font-weight: var(--font-weight-bold);\n    }\n\n  }\n\n  @include medium-only() {\n    h1, h2, h3, h4, h5, h6 { \n      font-size: 4.92em;\n\n      &.large {\n        font-size: 7.07em;\n      }\n\n      &.small {\n        font-size: 3.428em;\n      }\n\n    }\n  }\n\n  @include large-up() {\n    h1, h2, h3, h4, h5, h6 { \n      font-size: 6.14em;\n      line-height: 125%;\n\n      &.large {\n        font-size: 8.857em;\n        letter-spacing: -6%;\n      }\n\n      &.small {\n        font-size: 4.285em;\n        letter-spacing: -2%;\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-bold);\n    color: var(--color-link);\n    text-decoration: none;\n    text-underline-offset: 10%;\n    cursor: pointer;\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","import { Component, Host, h, Element, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'cura-display',\n  styleUrl: 'cura-display.scss',\n  shadow: true,\n})\nexport class CuraDisplay {\n\n  /**\n   * Heading level for semantics.\n   * Values: 1(default)-6.\n   */\n  @Prop({reflect: true}) level = 1;\n  /**\n  * Heading style size.\n  * Values: small | regular(default) | large.\n  */\n  @Prop({reflect: true}) size = 'regular';\n  /**\n  * Apply light color to text in dark background.\n  * Values: boolean.\n  */\n  @Prop({reflect: true}) inverted = false;\n  /**\n  * Apply base system color to elements like <a> and <abbr>.\n  * Values: String primary(default) | secondary | accent | neutral | success | error | warning | info.\n  */\n  @Prop({reflect: true}) spotColor = 'primary';\n \n   /**\n    * Host element <cura-heading>\n    */\n   @Element() host: HTMLElement;\n \n   /**\n    * Internal Props\n    */\n   weights: any;\n   styles: any;\n\n   connectedCallback() {\n    this.weights = window.CuraAPI.theme.fonts.getWeights();\n    this.setFontProperties();\n    this.setColors();\n  }\n\n  getClasses() {\n    const classes = {};\n    classes[this.size.toLowerCase()] =  true;\n    return classes;\n  }\n\n  setFontProperties() {\n    this.styles = {\n      '--font-family': window.CuraAPI.theme.fonts.getFamily('display'),\n      '--font-size': window.CuraAPI.theme.fonts.getSize(),\n      '--font-weight-bold': this.weights.bold,\n      '--font-weight-black': this.weights.black\n    }\n    this.setHostProperty('--font-size', window.CuraAPI.theme.fonts.getSize());\n    this.setHostProperty('--block-margin', '0.5em');\n  }\n\n  setColors() {\n    const fontColor = this.inverted \n      ? window.CuraAPI.theme.colors.getColor('neutral-white') \n      : window.CuraAPI.theme.fonts.getColor();\n    this.styles['--color-body'] = fontColor || window.CuraAPI.theme.colors.getColor('neutral-darker');\n    this.styles['--color-link'] = this.inverted \n      ? window.CuraAPI.theme.colors.getColor(`${this.spotColor}-lighter`)\n      : window.CuraAPI.theme.colors.getColor(`${this.spotColor}-dark`);\n  }\n\n  setHostProperty(prop: string, value: string) {\n    this.host.style.setProperty(prop, value);\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>\n        { this.getHeadingTag() }\n      </Host>\n    );\n  }\n\n}\n","@import '../../../scss/mixins/responsive.scss';\n\n:host {\n  display: block;\n  font-size: var(--font-size);\n\n  h1, h2, h3, h4, h5, h6 {\n    font-family: var(--font-family);\n    font-size: 1.71em;\n    font-weight: var(--font-weight-regular);\n    color: var(--color-body);\n    line-height: 130%;\n    letter-spacing: 0%;\n    margin-block-start: var(--block-margin);\n    margin-block-end: var(--block-margin);\n\n    &.bold-weight {\n      font-weight: var(--font-weight-medium);\n    }\n\n    &.large {\n      font-size: 2.07em;\n      letter-spacing: -2%;\n    }\n\n    &.small {\n      font-size: 1.214em;\n      line-height: 150%;\n      letter-spacing: 0%;\n\n      &.bold-weight {\n        font-weight: var(--font-weight-bold);\n      }\n    }\n\n  }\n\n  @include medium-only() {\n    h1, h2, h3, h4, h5, h6 { \n      font-size: 2em;\n\n      &.large {\n        font-size: 2.357em;\n      }\n\n      &.small {\n        font-size: 1.357em;\n      }\n\n    }\n  }\n\n  @include large-up() {\n    h1, h2, h3, h4, h5, h6 { \n      font-size: 2.5em;\n      line-height: 135%;\n      letter-spacing: -2%;\n\n      &.large {\n        font-size: 2.92em;\n      }\n\n      &.small {\n        font-size: 1.71em;\n        line-height: 160%;\n        letter-spacing: 0%;\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-bold);\n    color: var(--color-link);\n    text-decoration: none;\n    text-underline-offset: 10%;\n    cursor: pointer;\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","import { Component, Host, h, Prop, Element } 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.\n   * Values: 1(default)-6.\n   */\n  @Prop({reflect: true}) level = 1;\n  /**\n   * Heading style size.\n   * Values: small | regular(default) | large.\n   */\n  @Prop({reflect: true}) size = 'regular';\n  /**\n   * Heading font weight.\n   * Values: regular(default) | bold.\n   */\n  @Prop({reflect: true}) weight = 'regular';\n  /**\n  * Apply light color to text in dark background.\n  * Values: boolean.\n  */\n  @Prop({reflect: true}) inverted = false;\n  /**\n  * Apply base system color to elements like <a> and <abbr>.\n  * Values: String primary(default) | secondary | accent | neutral | success | error | warning | info.\n  */\n  @Prop({reflect: true}) spotColor = 'primary';\n\n  /**\n   * Host element <cura-heading>\n   */\n  @Element() host: HTMLElement;\n\n  /**\n   * Internal Props\n   */\n  weights: any;\n  styles: any;\n\n  connectedCallback() {\n    this.weights = window.CuraAPI.theme.fonts.getWeights();\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.styles = {\n      '--font-family': window.CuraAPI.theme.fonts.getFamily('heading'),\n      '--font-size': window.CuraAPI.theme.fonts.getSize(),\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    this.setHostProperty('--font-size', window.CuraAPI.theme.fonts.getSize());\n    this.setHostProperty('--block-margin', '0.5em');\n  }\n\n  setColors() {\n    const fontColor = this.inverted \n      ? window.CuraAPI.theme.colors.getColor('neutral-white') \n      : window.CuraAPI.theme.fonts.getColor();\n    this.styles['--color-body'] = fontColor || window.CuraAPI.theme.colors.getColor('neutral-darker');\n    this.styles['--color-link'] = this.inverted \n      ? window.CuraAPI.theme.colors.getColor(`${this.spotColor}-lighter`)\n      : window.CuraAPI.theme.colors.getColor(`${this.spotColor}-dark`);\n  }\n\n  setHostProperty(prop: string, value: string) {\n    this.host.style.setProperty(prop, value);\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>\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';\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  sizes = {\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    \"default\": {size: 24, stroke: 2}\n  };\n\n  @Watch('size')\n  sizeHandler(size: string | number) {\n    const scaledStroke = (iconSize: string | number) => {\n      return `${this.sizes[iconSize].stroke * (this.sizes.default.size / this.sizes[iconSize].size)}px`;\n    }\n    this.setHostProperty('--size', this.sizes[`${size}`] ? `${this.sizes[size].size}px` : `${this.sizes.default.size}px`);\n    this.setHostProperty('--stroke', this.sizes[`${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));\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;\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);\n\n  p {\n    font-family: var(--font-family);\n    font-size: var(--font-size);\n    font-weight: var(--font-weight-regular);\n    color: var(--color-body);\n    line-height: 140%;\n    letter-spacing: 2%;\n    margin-block-start: var(--block-margin);\n    margin-block-end: var(--block-margin);\n\n    &.large {\n      font-size: 1.21em;\n      line-height: 150%;\n      letter-spacing: 0%;\n    }\n\n    &.small {\n      font-size: 0.85em;\n      line-height: 135%;\n      letter-spacing: 4%;\n    }\n\n    &.caption {\n      font-size: 0.71em;\n      line-height: 135%;\n      letter-spacing: 6%;\n    }\n  }\n\n  @include medium-only() {\n    p { \n      font-size: 1.14em;\n      line-height: 145%;\n\n      &.large {\n        font-size: 1.35em;\n        line-height: 150%;\n      }\n\n      &.small {\n        font-size: 1em;\n        line-height: 135%;\n      }\n\n      &.caption {\n        font-size: 0.85em;\n        line-height: 135%;\n        letter-spacing: 6%;\n      }\n    }\n  }\n\n  @include large-up() {\n    p { \n      font-size: 1.42em;\n      line-height: 150%;\n      letter-spacing: 0%;\n\n      &.large {\n        font-size: 1.71em;\n        line-height: 160%;\n      }\n\n      &.small {\n        font-size: 1.21em;\n        line-height: 145%;\n        letter-spacing: 0%;\n      }\n\n      &.caption {\n        font-size: 1em;\n        line-height: 145%;\n        letter-spacing: 2%;\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(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 } 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 (default) | large | small | caption.\n   */\n  @Prop({reflect: true}) size = 'regular';\n  /**\n  * Apply light color to text in dark background.\n  * Values: boolean.\n  */\n  @Prop({reflect: true}) inverted = false;\n  /**\n  * Apply base system color to elements like <a> and <abbr>.\n  * Values: String primary(default) | secondary | accent | neutral | success | error | warning | info.\n  */\n  @Prop({reflect: true}) spotColor = 'primary';\n  \n  /**\n   * Host element <cura-paragraph>\n   */\n  @Element() host: HTMLElement;\n\n  /**\n   * Internal Props\n   */\n  weights: any;\n  styles: any;\n\n  connectedCallback() {\n    this.weights = window.CuraAPI.theme.fonts.getWeights();\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.styles = {\n      '--font-family': window.CuraAPI.theme.fonts.getFamily('body'),\n      '--font-size': window.CuraAPI.theme.fonts.getSize(),\n      '--font-weight-regular': this.weights.regular,\n      '--font-weight-medium': this.weights.medium,\n      '--font-weight-bold': this.weights.bold\n    }\n    this.setHostProperty('--font-size', window.CuraAPI.theme.fonts.getSize());\n    this.setHostProperty('--block-margin', '1.25em');\n  }\n\n  setColors() {\n    const fontColor = this.inverted \n      ? window.CuraAPI.theme.colors.getColor('neutral-white') \n      : window.CuraAPI.theme.fonts.getColor();\n    this.styles['--color-body'] = fontColor || window.CuraAPI.theme.colors.getColor('neutral-darker');\n    this.styles['--color-link'] = this.inverted \n      ? window.CuraAPI.theme.colors.getColor(`${this.spotColor}-lighter`)\n      : window.CuraAPI.theme.colors.getColor(`${this.spotColor}-dark`);\n  }\n\n  setHostProperty(prop: string, value: string) {\n    this.host.style.setProperty(prop, value);\n  }\n\n  render() {\n    return (\n      <Host>\n        <p style={this.styles} class={this.setsizeClass()}>\n          <slot></slot>\n        </p>\n      </Host>\n    );\n  }\n\n}\n"],"mappings":"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"}

package/dist/esm-es5/cura-icons-view.entry.js

@@ -1,2 +0,0 @@
-import{r as registerInstance,h,H as Host}from"./index-92c824be.js";var iconsetdefaulticons=["360","accessibility","alertCircle","alertTriangle","arrowDown","arrowDownCircle","arrowLeft","arrowLeftCircle","arrowRight","arrowRightCircle","arrowUp","arrowUpCircle","attach","avatarF","avatarM","biometry","bloodGroup","calendar","cam","camOff","central","chatCircle","check","checkBadge","checkCircle","checkDouble","clock","close","closeCircle","collapse","config","delete","desktop","deslike","download","duplicate","edit","exam","expand","facebook","fileBmp","fileJpg","filePdf","filePng","fileUpload","fileXls","filter","fullscreen","gallery","geotag","google","hate","healthPlan","height","height2","home","horizontalList","imageUp","info2","infoCircle","instagram","key","language","language2","languageEN","languagePT","lattes","like","likeHand","link","linkExternal","linkedin","list","login","logout","love","mail","mail2","medical","menuHamburguer","menuKebab","menuMeatballs","mic","micOff","minus","minusCircle","minusSquare","mobile","neutral","news","notification","order","partner","phone","play","plus","plusCircle","plusSquare","print","profile","profile2","pulldownG","pulldownP","pullupG","pullupP","questionCircle","questionSquare","range","reload","schedule","search","secure","share","share2","sound","soundOff","subItem","target","team","twitter","unLink","unSecure","unlikeHand","upload","verticalList","viewFalse","viewTrue","weight","whatsapp","wifi","youtube","zoomIn","zoomOut"];var curaIconsViewCss=':host{display:block;padding:24px;font-family:"Roboto", Arial, Helvetica, sans-serif}.iconDetail{display:block}.iconSizes{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.iconSizes .size{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;text-align:center;margin-right:9px;padding:8px}.iconSizes .size:last-child{margin-right:0}.iconSizes .size span{font-size:10px}.iconSizes.invert{margin-top:12px}.iconSizes.invert .size{background-color:#262626;color:#F6F6F6;border-radius:3px}.icons{margin-top:28px;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;position:relative}.icons .icon{position:relative;padding:4px;cursor:pointer;opacity:0.6;-webkit-transition:opacity 0.2s linear;transition:opacity 0.2s linear}.icons .icon span{font-size:12px;padding:6px;-webkit-box-sizing:border-box;box-sizing:border-box;background:#000;color:#FFF;border-radius:2px;position:absolute;top:-2px;left:50%;-webkit-transform:translateX(-50%) translateY(-100%);transform:translateX(-50%) translateY(-100%);display:none}.icons .icon:hover{opacity:1}.icons .icon:hover span{display:block}';var CuraIconsView=function(){function e(e){var i=this;registerInstance(this,e);this.sizes=[16,20,24,32,40,48,64,72,128];this.colors=["primary","secondary","accent","info","warning","error","success","neutral"];this.setSelected=function(e){i.selected=e};this.selected="360"}e.prototype.render=function(){var e=this;return h(Host,null,h("div",{class:"iconDetail"},h("h4",null,this.selected),h("div",{class:"iconSizes"},this.sizes.map((function(i){return h("div",{class:"size"},h("cura-icon",{name:e.selected,size:i}),h("span",null,i))}))),h("div",{class:"iconSizes invert"},this.sizes.map((function(i){return h("div",{class:"size"},h("cura-icon",{name:e.selected,size:i,color:"neutral-white"}),h("span",null,i))}))),h("div",{class:"iconSizes"},this.colors.map((function(i){return h("div",{class:"size"},h("cura-icon",{name:e.selected,color:i}),h("span",null,i))})),h("div",{class:"size"},h("cura-icon",{name:this.selected,disabled:true}),h("span",null,"Disabled")))),h("div",{class:"icons"},iconsetdefaulticons.map((function(i){return h("div",{class:"icon",onClick:function(){return e.setSelected(i)}},h("cura-icon",{name:i}),h("span",null,i))}))))};return e}();CuraIconsView.style=curaIconsViewCss;export{CuraIconsView as cura_icons_view};
-//# sourceMappingURL=cura-icons-view.entry.js.map

package/dist/esm-es5/cura-icons-view.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["iconsetdefaulticons","curaIconsViewCss","CuraIconsView","this","sizes","colors","setSelected","icon","_this","selected","prototype","render","h","Host","class","map","size","name","color","disabled","onClick"],"sources":["src/assets/icons/iconset-default-list.ts","src/components/cura-icons-view/cura-icons-view.scss?tag=cura-icons-view&encapsulation=shadow","src/components/cura-icons-view/cura-icons-view.tsx"],"sourcesContent":["export default [\"360\",\"accessibility\",\"alertCircle\",\"alertTriangle\",\"arrowDown\",\"arrowDownCircle\",\"arrowLeft\",\"arrowLeftCircle\",\"arrowRight\",\"arrowRightCircle\",\"arrowUp\",\"arrowUpCircle\",\"attach\",\"avatarF\",\"avatarM\",\"biometry\",\"bloodGroup\",\"calendar\",\"cam\",\"camOff\",\"central\",\"chatCircle\",\"check\",\"checkBadge\",\"checkCircle\",\"checkDouble\",\"clock\",\"close\",\"closeCircle\",\"collapse\",\"config\",\"delete\",\"desktop\",\"deslike\",\"download\",\"duplicate\",\"edit\",\"exam\",\"expand\",\"facebook\",\"fileBmp\",\"fileJpg\",\"filePdf\",\"filePng\",\"fileUpload\",\"fileXls\",\"filter\",\"fullscreen\",\"gallery\",\"geotag\",\"google\",\"hate\",\"healthPlan\",\"height\",\"height2\",\"home\",\"horizontalList\",\"imageUp\",\"info2\",\"infoCircle\",\"instagram\",\"key\",\"language\",\"language2\",\"languageEN\",\"languagePT\",\"lattes\",\"like\",\"likeHand\",\"link\",\"linkExternal\",\"linkedin\",\"list\",\"login\",\"logout\",\"love\",\"mail\",\"mail2\",\"medical\",\"menuHamburguer\",\"menuKebab\",\"menuMeatballs\",\"mic\",\"micOff\",\"minus\",\"minusCircle\",\"minusSquare\",\"mobile\",\"neutral\",\"news\",\"notification\",\"order\",\"partner\",\"phone\",\"play\",\"plus\",\"plusCircle\",\"plusSquare\",\"print\",\"profile\",\"profile2\",\"pulldownG\",\"pulldownP\",\"pullupG\",\"pullupP\",\"questionCircle\",\"questionSquare\",\"range\",\"reload\",\"schedule\",\"search\",\"secure\",\"share\",\"share2\",\"sound\",\"soundOff\",\"subItem\",\"target\",\"team\",\"twitter\",\"unLink\",\"unSecure\",\"unlikeHand\",\"upload\",\"verticalList\",\"viewFalse\",\"viewTrue\",\"weight\",\"whatsapp\",\"wifi\",\"youtube\",\"zoomIn\",\"zoomOut\"];",":host {\n  display: block;\n  padding: 24px;\n  font-family: 'Roboto', Arial, Helvetica, sans-serif;\n}\n\n.iconDetail {\n  display: block;\n}\n\n.iconSizes {\n  display: flex;\n  align-items: center;\n\n\n  .size {\n    display: flex;\n    flex-direction: column;\n    text-align: center;\n    margin-right: 9px;\n    padding: 8px;\n\n    &:last-child { margin-right: 0; }\n    span {\n      font-size: 10px;\n    }\n  }\n\n  &.invert {\n    margin-top: 12px;\n\n    .size {\n      background-color: #262626;\n      color: #F6F6F6;\n      border-radius: 3px;\n    }\n  }\n}\n\n.icons {\n  margin-top: 28px;\n  display: flex;\n  flex-wrap: wrap;\n  position: relative;\n\n  .icon {\n    position: relative;\n    padding: 4px;\n    cursor: pointer;\n    opacity: .6;\n    transition: opacity .2s linear;\n    span {\n      font-size: 12px;\n      padding: 6px;\n      box-sizing: border-box;\n      background: #000;\n      color: #FFF;\n      border-radius: 2px;\n      position: absolute;\n      top: -2px;\n      left: 50%;\n      transform: translateX(-50%) translateY(-100%);\n      display: none;\n    }\n\n    &:hover {\n      opacity: 1;\n\n      span { display: block; }\n    }\n  }\n}\n\n","import { Component, Host, h, State } from '@stencil/core';\nimport iconsetdefaulticons from '../../assets/icons/iconset-default-list';\n\n@Component({\n  tag: 'cura-icons-view',\n  styleUrl: 'cura-icons-view.scss',\n  shadow: true,\n})\nexport class CuraIconsView {\n\n  sizes = [16, 20, 24, 32, 40, 48, 64, 72, 128];\n  colors = ['primary', 'secondary', 'accent', 'info', 'warning', 'error', 'success', 'neutral'];\n  @State() selected = '360';\n\n  setSelected = (icon) => {\n    this.selected = icon;\n  }\n\n  render() {\n    return (\n      <Host>\n        <div class=\"iconDetail\">\n          <h4>{ this.selected }</h4>\n          <div class=\"iconSizes\">\n            { this.sizes.map( size =>\n\n              <div class=\"size\">\n                <cura-icon name={this.selected} size={size}></cura-icon>\n                <span>{ size }</span>\n              </div>\n            )}\n          </div>\n          <div class=\"iconSizes invert\">\n            { this.sizes.map( size =>\n\n              <div class=\"size\">\n                <cura-icon name={this.selected} size={size} color=\"neutral-white\"></cura-icon>\n                <span>{ size }</span>\n              </div>\n            )}\n          </div>\n          <div class=\"iconSizes\">\n            { this.colors.map( color =>\n              <div class=\"size\">\n                <cura-icon name={this.selected} color={color}></cura-icon>\n                <span>{ color }</span>\n              </div>\n            )}\n            <div class=\"size\">\n              <cura-icon name={this.selected} disabled></cura-icon>\n              <span>Disabled</span>\n            </div>\n          </div>\n        </div>\n        <div class=\"icons\">\n          { iconsetdefaulticons.map(icon =>\n            <div class=\"icon\" onClick={() => this.setSelected(icon)}>\n              <cura-icon name={icon}></cura-icon>\n              <span>{icon}</span>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n\n}\n"],"mappings":"mEAAA,IAAAA,oBAAe,CAAC,MAAM,gBAAgB,cAAc,gBAAgB,YAAY,kBAAkB,YAAY,kBAAkB,aAAa,mBAAmB,UAAU,gBAAgB,SAAS,UAAU,UAAU,WAAW,aAAa,WAAW,MAAM,SAAS,UAAU,aAAa,QAAQ,aAAa,cAAc,cAAc,QAAQ,QAAQ,cAAc,WAAW,SAAS,SAAS,UAAU,UAAU,WAAW,YAAY,OAAO,OAAO,SAAS,WAAW,UAAU,UAAU,UAAU,UAAU,aAAa,UAAU,SAAS,aAAa,UAAU,SAAS,SAAS,OAAO,aAAa,SAAS,UAAU,OAAO,iBAAiB,UAAU,QAAQ,aAAa,YAAY,MAAM,WAAW,YAAY,aAAa,aAAa,SAAS,OAAO,WAAW,OAAO,eAAe,WAAW,OAAO,QAAQ,SAAS,OAAO,OAAO,QAAQ,UAAU,iBAAiB,YAAY,gBAAgB,MAAM,SAAS,QAAQ,cAAc,cAAc,SAAS,UAAU,OAAO,eAAe,QAAQ,UAAU,QAAQ,OAAO,OAAO,aAAa,aAAa,QAAQ,UAAU,WAAW,YAAY,YAAY,UAAU,UAAU,iBAAiB,iBAAiB,QAAQ,SAAS,WAAW,SAAS,SAAS,QAAQ,SAAS,QAAQ,WAAW,UAAU,SAAS,OAAO,UAAU,SAAS,WAAW,aAAa,SAAS,eAAe,YAAY,WAAW,SAAS,WAAW,OAAO,UAAU,SAAS,WCAz4C,IAAMC,iBAAmB,snC,ICQZC,cAAa,W,kDAExBC,KAAAC,MAAQ,CAAC,GAAI,GAAI,GAAI,GAAI,GAAI,GAAI,GAAI,GAAI,KACzCD,KAAAE,OAAS,CAAC,UAAW,YAAa,SAAU,OAAQ,UAAW,QAAS,UAAW,WAGnFF,KAAAG,YAAc,SAACC,GACbC,EAAKC,SAAWF,C,gBAHE,K,CAMpBL,EAAAQ,UAAAC,OAAA,eAAAH,EAAAL,KACE,OACES,EAACC,KAAI,KACHD,EAAA,OAAKE,MAAM,cACTF,EAAA,UAAMT,KAAKM,UACXG,EAAA,OAAKE,MAAM,aACPX,KAAKC,MAAMW,KAAK,SAAAC,GAEhB,OAAAJ,EAAA,OAAKE,MAAM,QACTF,EAAA,aAAWK,KAAMT,EAAKC,SAAUO,KAAMA,IACtCJ,EAAA,YAAQI,GAFV,KAMJJ,EAAA,OAAKE,MAAM,oBACPX,KAAKC,MAAMW,KAAK,SAAAC,GAEhB,OAAAJ,EAAA,OAAKE,MAAM,QACTF,EAAA,aAAWK,KAAMT,EAAKC,SAAUO,KAAMA,EAAME,MAAM,kBAClDN,EAAA,YAAQI,GAFV,KAMJJ,EAAA,OAAKE,MAAM,aACPX,KAAKE,OAAOU,KAAK,SAAAG,GACjB,OAAAN,EAAA,OAAKE,MAAM,QACTF,EAAA,aAAWK,KAAMT,EAAKC,SAAUS,MAAOA,IACvCN,EAAA,YAAQM,GAFV,IAKFN,EAAA,OAAKE,MAAM,QACTF,EAAA,aAAWK,KAAMd,KAAKM,SAAUU,SAAQ,OACxCP,EAAA,2BAINA,EAAA,OAAKE,MAAM,SACPd,oBAAoBe,KAAI,SAAAR,GACxB,OAAAK,EAAA,OAAKE,MAAM,OAAOM,QAAS,WAAM,OAAAZ,EAAKF,YAAYC,EAAjB,GAC/BK,EAAA,aAAWK,KAAMV,IACjBK,EAAA,YAAOL,GAFT,K,WAhDc,G"}