@rededor/cura 1.6.1-alpha.8 → 1.7.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/assets/assets/icons/iconset-default-list.ts +1 -1
- package/dist/assets/assets/icons/iconset-default-tmp.svg +4 -0
- package/dist/assets/assets/icons/iconset-default.svg +1 -1
- package/dist/cjs/{app-globals-28c6f5c4.js → app-globals-6d5b51b6.js} +2 -2
- package/dist/cjs/{app-globals-28c6f5c4.js.map → app-globals-6d5b51b6.js.map} +1 -1
- package/dist/cjs/{cura-accordion_18.cjs.entry.js → cura-accordion_20.cjs.entry.js} +148 -8
- package/dist/cjs/cura-accordion_20.cjs.entry.js.map +1 -0
- package/dist/cjs/cura-checkbox.cjs.entry.js +4 -3
- package/dist/cjs/cura-checkbox.cjs.entry.js.map +1 -1
- package/dist/cjs/cura-display.cjs.entry.js +1 -1
- package/dist/cjs/cura-icons-view.cjs.entry.js +1 -1
- package/dist/cjs/cura-icons-view.cjs.entry.js.map +1 -1
- package/dist/cjs/cura-modal.cjs.entry.js +3 -3
- package/dist/cjs/cura-modal.cjs.entry.js.map +1 -1
- package/dist/cjs/cura-radio.cjs.entry.js +4 -3
- package/dist/cjs/cura-radio.cjs.entry.js.map +1 -1
- package/dist/cjs/cura-switch.cjs.entry.js +4 -4
- package/dist/cjs/cura-switch.cjs.entry.js.map +1 -1
- package/dist/cjs/cura-tabs-button.cjs.entry.js +106 -0
- package/dist/cjs/cura-tabs-button.cjs.entry.js.map +1 -0
- package/dist/cjs/cura-tabs-transparent.cjs.entry.js +105 -0
- package/dist/cjs/cura-tabs-transparent.cjs.entry.js.map +1 -0
- package/dist/cjs/cura-tabs.definitions-b8955ad4.js +12 -0
- package/dist/cjs/cura-tabs.definitions-b8955ad4.js.map +1 -0
- package/dist/cjs/{cura-theme-module-f1e4a309.js → cura-theme-module-09bb63a4.js} +32 -1
- package/dist/cjs/cura-theme-module-09bb63a4.js.map +1 -0
- package/dist/cjs/cura.cjs.js +3 -3
- package/dist/cjs/index.cjs.js +1 -1
- package/dist/cjs/loader.cjs.js +3 -3
- package/dist/collection/api/theme-presets/theme-perinatal-temporary.js +32 -0
- package/dist/collection/api/theme-presets/theme-perinatal-temporary.js.map +1 -0
- package/dist/collection/api/theme-presets/theme-presets.js +2 -0
- package/dist/collection/api/theme-presets/theme-presets.js.map +1 -1
- package/dist/collection/assets/icons/iconset-default-list.js +1 -1
- package/dist/collection/assets/icons/iconset-default-list.js.map +1 -1
- package/dist/collection/assets/icons/iconset-default-tmp.svg +4 -0
- package/dist/collection/assets/icons/iconset-default.svg +1 -1
- package/dist/collection/assets-raw/icons/default/vaccine.svg +3 -0
- package/dist/collection/collection-manifest.json +4 -0
- package/dist/collection/components/cura-avatar/cura-avatar.js +34 -16
- package/dist/collection/components/cura-avatar/cura-avatar.js.map +1 -1
- package/dist/collection/components/cura-modal/cura-modal.css +1 -1
- package/dist/collection/components/cura-modal/cura-modal.js +2 -2
- package/dist/collection/components/cura-modal/cura-modal.js.map +1 -1
- package/dist/collection/components/forms/cura-checkbox/cura-checkbox.css +5 -7
- package/dist/collection/components/forms/cura-checkbox/cura-checkbox.js +31 -6
- package/dist/collection/components/forms/cura-checkbox/cura-checkbox.js.map +1 -1
- package/dist/collection/components/forms/cura-radio/cura-radio.css +8 -11
- package/dist/collection/components/forms/cura-radio/cura-radio.js +31 -6
- package/dist/collection/components/forms/cura-radio/cura-radio.js.map +1 -1
- package/dist/collection/components/forms/cura-select/cura-select.css +1 -1
- package/dist/collection/components/forms/cura-select/cura-select.js +22 -3
- package/dist/collection/components/forms/cura-select/cura-select.js.map +1 -1
- package/dist/collection/components/forms/cura-select/cura-select.stories.js +12 -0
- package/dist/collection/components/forms/cura-select/cura-select.stories.js.map +1 -1
- package/dist/collection/components/forms/cura-switch/cura-switch.css +1 -4
- package/dist/collection/components/forms/cura-switch/cura-switch.js +31 -7
- package/dist/collection/components/forms/cura-switch/cura-switch.js.map +1 -1
- package/dist/collection/components/tabs/cura-tabs/cura-tabs.css +170 -0
- package/dist/collection/components/tabs/cura-tabs/cura-tabs.js +263 -0
- package/dist/collection/components/tabs/cura-tabs/cura-tabs.js.map +1 -0
- package/dist/collection/components/tabs/cura-tabs/cura-tabs.stories.js +89 -0
- package/dist/collection/components/tabs/cura-tabs/cura-tabs.stories.js.map +1 -0
- package/dist/collection/components/tabs/cura-tabs-button/cura-tabs-button.css +176 -0
- package/dist/collection/components/tabs/cura-tabs-button/cura-tabs-button.js +259 -0
- package/dist/collection/components/tabs/cura-tabs-button/cura-tabs-button.js.map +1 -0
- package/dist/collection/components/tabs/cura-tabs-button/cura-tabs-button.stories.js +96 -0
- package/dist/collection/components/tabs/cura-tabs-button/cura-tabs-button.stories.js.map +1 -0
- package/dist/collection/components/tabs/cura-tabs-group/cura-tabs-group.css +25 -0
- package/dist/collection/components/tabs/cura-tabs-group/cura-tabs-group.js +133 -0
- package/dist/collection/components/tabs/cura-tabs-group/cura-tabs-group.js.map +1 -0
- package/dist/collection/components/tabs/cura-tabs-group/cura-tabs-group.stories.js +65 -0
- package/dist/collection/components/tabs/cura-tabs-group/cura-tabs-group.stories.js.map +1 -0
- package/dist/collection/components/tabs/cura-tabs-transparent/cura-tabs-transparent.css +168 -0
- package/dist/collection/components/tabs/cura-tabs-transparent/cura-tabs-transparent.js +258 -0
- package/dist/collection/components/tabs/cura-tabs-transparent/cura-tabs-transparent.js.map +1 -0
- package/dist/collection/components/tabs/cura-tabs-transparent/cura-tabs-transparent.stories.js +89 -0
- package/dist/collection/components/tabs/cura-tabs-transparent/cura-tabs-transparent.stories.js.map +1 -0
- package/dist/collection/components/tabs/cura-tabs.definitions.js +7 -0
- package/dist/collection/components/tabs/cura-tabs.definitions.js.map +1 -0
- package/dist/collection/components/text/cura-display/cura-display.js +1 -1
- package/dist/collection/components/text/cura-heading/cura-heading.js +1 -1
- package/dist/collection/components/text/cura-paragraph/cura-paragraph.js +1 -1
- package/dist/components/cura-avatar.js +1 -1
- package/dist/components/cura-avatar.js.map +1 -1
- package/dist/components/cura-checkbox.js +6 -4
- package/dist/components/cura-checkbox.js.map +1 -1
- package/dist/components/cura-display.js +1 -1
- package/dist/components/cura-heading2.js +1 -1
- package/dist/components/cura-icons-view.js +1 -1
- package/dist/components/cura-icons-view.js.map +1 -1
- package/dist/components/cura-modal.js +3 -3
- package/dist/components/cura-modal.js.map +1 -1
- package/dist/components/cura-paragraph2.js +1 -1
- package/dist/components/cura-radio.js +6 -4
- package/dist/components/cura-radio.js.map +1 -1
- package/dist/components/cura-select2.js +6 -4
- package/dist/components/cura-select2.js.map +1 -1
- package/dist/components/cura-switch.js +6 -5
- package/dist/components/cura-switch.js.map +1 -1
- package/dist/components/cura-tabs-button.d.ts +11 -0
- package/dist/components/cura-tabs-button.js +150 -0
- package/dist/components/cura-tabs-button.js.map +1 -0
- package/dist/components/cura-tabs-group.d.ts +11 -0
- package/dist/components/cura-tabs-group.js +64 -0
- package/dist/components/cura-tabs-group.js.map +1 -0
- package/dist/components/cura-tabs-transparent.d.ts +11 -0
- package/dist/components/cura-tabs-transparent.js +143 -0
- package/dist/components/cura-tabs-transparent.js.map +1 -0
- package/dist/components/cura-tabs.d.ts +11 -0
- package/dist/components/cura-tabs.definitions.js +10 -0
- package/dist/components/cura-tabs.definitions.js.map +1 -0
- package/dist/components/cura-tabs.js +148 -0
- package/dist/components/cura-tabs.js.map +1 -0
- package/dist/components/index.js +39 -0
- package/dist/components/index.js.map +1 -1
- package/dist/cura/cura.esm.js +1 -1
- package/dist/cura/cura.esm.js.map +1 -1
- package/dist/cura/index.esm.js +1 -1
- package/dist/cura/p-0ccde0ff.entry.js +2 -0
- package/dist/cura/p-0ccde0ff.entry.js.map +1 -0
- package/dist/cura/p-1ef21ae9.entry.js +2 -0
- package/dist/cura/p-1ef21ae9.entry.js.map +1 -0
- package/dist/cura/p-53c18ed4.js +2 -0
- package/dist/cura/p-53c18ed4.js.map +1 -0
- package/dist/cura/p-5c6f9593.entry.js +2 -0
- package/dist/cura/p-5c6f9593.entry.js.map +1 -0
- package/dist/cura/{p-0c25333f.js → p-6cbd49dd.js} +2 -2
- package/dist/cura/p-7a68835f.entry.js +2 -0
- package/dist/cura/p-7a68835f.entry.js.map +1 -0
- package/dist/cura/p-7e2d1229.entry.js +2 -0
- package/dist/cura/p-7e2d1229.entry.js.map +1 -0
- package/dist/cura/{p-ac01bec2.entry.js → p-8aade007.entry.js} +2 -2
- package/dist/cura/p-9f460031.js +2 -0
- package/dist/cura/p-9f460031.js.map +1 -0
- package/dist/cura/p-b4ee956b.entry.js +2 -0
- package/dist/cura/p-b4ee956b.entry.js.map +1 -0
- package/dist/cura/p-b6ff8ac1.entry.js +2 -0
- package/dist/cura/p-b6ff8ac1.entry.js.map +1 -0
- package/dist/cura/p-d8e1e182.entry.js +2 -0
- package/dist/cura/p-d8e1e182.entry.js.map +1 -0
- package/dist/esm/{app-globals-ca1945d1.js → app-globals-c2abb41c.js} +2 -2
- package/dist/esm/{app-globals-ca1945d1.js.map → app-globals-c2abb41c.js.map} +1 -1
- package/dist/esm/{cura-accordion_18.entry.js → cura-accordion_20.entry.js} +147 -9
- package/dist/esm/cura-accordion_20.entry.js.map +1 -0
- package/dist/esm/cura-checkbox.entry.js +4 -3
- package/dist/esm/cura-checkbox.entry.js.map +1 -1
- package/dist/esm/cura-display.entry.js +1 -1
- package/dist/esm/cura-icons-view.entry.js +1 -1
- package/dist/esm/cura-icons-view.entry.js.map +1 -1
- package/dist/esm/cura-modal.entry.js +3 -3
- package/dist/esm/cura-modal.entry.js.map +1 -1
- package/dist/esm/cura-radio.entry.js +4 -3
- package/dist/esm/cura-radio.entry.js.map +1 -1
- package/dist/esm/cura-switch.entry.js +4 -4
- package/dist/esm/cura-switch.entry.js.map +1 -1
- package/dist/esm/cura-tabs-button.entry.js +102 -0
- package/dist/esm/cura-tabs-button.entry.js.map +1 -0
- package/dist/esm/cura-tabs-transparent.entry.js +101 -0
- package/dist/esm/cura-tabs-transparent.entry.js.map +1 -0
- package/dist/esm/cura-tabs.definitions-a017126e.js +10 -0
- package/dist/esm/cura-tabs.definitions-a017126e.js.map +1 -0
- package/dist/esm/{cura-theme-module-0fa5ee0b.js → cura-theme-module-bf286f68.js} +32 -1
- package/dist/esm/cura-theme-module-bf286f68.js.map +1 -0
- package/dist/esm/cura.js +3 -3
- package/dist/esm/index.js +1 -1
- package/dist/esm/loader.js +3 -3
- package/dist/types/api/theme-presets/theme-perinatal-temporary.d.ts +43 -0
- package/dist/types/api/theme-presets/theme-presets.d.ts +43 -0
- package/dist/types/components/cura-avatar/cura-avatar.d.ts +37 -0
- package/dist/types/components/forms/cura-checkbox/cura-checkbox.d.ts +17 -4
- package/dist/types/components/forms/cura-radio/cura-radio.d.ts +17 -4
- package/dist/types/components/forms/cura-select/cura-select.d.ts +6 -0
- package/dist/types/components/forms/cura-select/cura-select.stories.d.ts +11 -0
- package/dist/types/components/forms/cura-switch/cura-switch.d.ts +16 -3
- package/dist/types/components/tabs/cura-tabs/cura-tabs.d.ts +30 -0
- package/dist/types/components/tabs/cura-tabs/cura-tabs.stories.d.ts +99 -0
- package/dist/types/components/tabs/cura-tabs-button/cura-tabs-button.d.ts +29 -0
- package/dist/types/components/tabs/cura-tabs-button/cura-tabs-button.stories.d.ts +99 -0
- package/dist/types/components/tabs/cura-tabs-group/cura-tabs-group.d.ts +18 -0
- package/dist/types/components/tabs/cura-tabs-group/cura-tabs-group.stories.d.ts +57 -0
- package/dist/types/components/tabs/cura-tabs-transparent/cura-tabs-transparent.d.ts +29 -0
- package/dist/types/components/tabs/cura-tabs-transparent/cura-tabs-transparent.stories.d.ts +99 -0
- package/dist/types/components/tabs/cura-tabs.definitions.d.ts +6 -0
- package/dist/types/components.d.ts +298 -24
- package/package.json +2 -2
- package/dist/cjs/cura-accordion_18.cjs.entry.js.map +0 -1
- package/dist/cjs/cura-theme-module-f1e4a309.js.map +0 -1
- package/dist/cura/p-03feed94.entry.js +0 -2
- package/dist/cura/p-03feed94.entry.js.map +0 -1
- package/dist/cura/p-07817634.entry.js +0 -2
- package/dist/cura/p-07817634.entry.js.map +0 -1
- package/dist/cura/p-84c18273.entry.js +0 -2
- package/dist/cura/p-84c18273.entry.js.map +0 -1
- package/dist/cura/p-9fce5ec5.entry.js +0 -2
- package/dist/cura/p-9fce5ec5.entry.js.map +0 -1
- package/dist/cura/p-b84924e1.entry.js +0 -2
- package/dist/cura/p-b84924e1.entry.js.map +0 -1
- package/dist/cura/p-b856b946.entry.js +0 -2
- package/dist/cura/p-b856b946.entry.js.map +0 -1
- package/dist/cura/p-bf8e2037.js +0 -2
- package/dist/cura/p-bf8e2037.js.map +0 -1
- package/dist/esm/cura-accordion_18.entry.js.map +0 -1
- package/dist/esm/cura-theme-module-0fa5ee0b.js.map +0 -1
- /package/dist/cura/{p-0c25333f.js.map → p-6cbd49dd.js.map} +0 -0
- /package/dist/cura/{p-ac01bec2.entry.js.map → p-8aade007.entry.js.map} +0 -0
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as t,c as e,h as o,H as r}from"./p-4ee8efca.js";import{l as s}from"./p-53c18ed4.js";const a=":host button,:host a{outline:none;box-shadow:none;box-sizing:border-box;display:flex;width:100%;align-items:center;justify-content:center;text-decoration:none !important;font-size:var(--font-size);cursor:pointer;transition:background-color 0.07s linear, box-shadow 0.07s linear, border-color 0.07s linear;border-radius:var(--border-radius);position:relative;background-color:transparent;box-sizing:border-box;border:none;min-width:120px;width:fit-content;display:flex;align-items:center;justify-content:center}:host button:focus,:host a:focus{outline:2px solid #6EA8FF}:host button.border-bottom,:host a.border-bottom{border-bottom:1px solid var(--border-bottom-color)}:host button.small,:host a.small{padding:calc(var(--cura-spacing-base) * 2px) calc(var(--cura-spacing-base) * 2px)}:host button.medium,:host a.medium{padding:calc(var(--cura-spacing-base) * 3px) calc(var(--cura-spacing-base) * 3px)}:host button.large,:host a.large{padding:calc(var(--cura-spacing-base) * 3px) calc(var(--cura-spacing-base) * 4px)}:host button:not(.selected),:host a:not(.selected){border-color:var(--border-color)}:host button:focus,:host a:focus{border-color:var(--primary-light)}:host button:not(.disabled,.selected):hover,:host a:not(.disabled,.selected):hover{background-color:var(--background-color-hover)}:host button:not(.disabled,.selected):hover.dark,:host a:not(.disabled,.selected):hover.dark{border-color:var(--neutral-purewhite)}:host button cura-icon,:host a cura-icon{margin-right:calc(var(--cura-spacing-base) * 2px)}:host button.selected,:host a.selected{cursor:pointer}:host button.selected:not(.disabled),:host a.selected:not(.disabled){border-bottom:1px solid var(--border-bottom-color-selected)}:host button.disabled,:host a.disabled{cursor:not-allowed}";const i=a;const n=class{constructor(o){t(this,o);this.tabSelect=e(this,"tabSelect",7);this.name=undefined;this.iconName=undefined;this.selected=false;this.disabled=false;this.borderBottom=true;this.size="large";this.colorMode="light";this.hovered=false;this.styles={}}setColors(){const t=[{name:"--border-bottom-color",theme:this.colorMode==="light"?"neutral-base":"primary"},{name:"--border-bottom-color-selected",theme:this.colorMode==="light"?"primary-dark":"primary-lighter"}];t.forEach((t=>{if(t.theme)this.styles[t.name]=window.CuraAPI.theme.colors.getColor(t.theme)}));this.styles=Object.assign({},this.styles)}computeContentColor(){if(this.disabled)return"neutral-dark";if(this.colorMode==="dark"){if(this.hovered&&!this.selected){return"neutral-purewhite"}return this.selected?"primary-lighter":"neutral-purewhite"}if(this.hovered&&!this.selected){return"primary-dark"}return this.selected?"primary-base":"neutral-black"}getIcon(){if(!this.iconName)return"";const t=this.size==="large"?20:16;const e=this.computeContentColor();return o("cura-icon",{name:this.iconName,size:t,color:e})}getClasses(){return{[this.size]:true,[this.colorMode]:true,selected:this.selected,disabled:this.disabled,"border-bottom":this.borderBottom}}connectedCallback(){this.styles=Object.assign(Object.assign({},this.styles),{"--primary-dark":window.CuraAPI.theme.colors.getColor("primary-dark"),"--neutral-purewhite":window.CuraAPI.theme.colors.getColor("neutral-purewhite"),"--base-spacing":window.CuraAPI.theme.spacing.getSpacing()});this.setColors()}handleMouseEnter(){if(this.disabled)return;this.hovered=true}handleMouseLeave(){this.hovered=false}handleClick(t){if(this.disabled){t.preventDefault();return}this.selected=!this.selected;this.tabSelect.emit({name:this.name})}render(){const t=s[this.size]||s["default"];const e=this.computeContentColor();return o(r,{key:"d3c9e277a079381def09397dc922d697aa99d70a",role:"button","aria-pressed":this.selected,"aria-disabled":this.disabled},o("button",{key:"ab4cac9782f48c367c4ada4e303f9422971dc38e",class:this.getClasses(),style:this.styles,onClick:t=>this.handleClick(t),disabled:this.disabled,onMouseEnter:this.handleMouseEnter.bind(this),onMouseLeave:this.handleMouseLeave.bind(this)},this.getIcon(),o("cura-label",{key:"c6567bdf7b80efc3380a8a93bf52de966e1caa7d",size:t,color:e,lineHeight:"0",marginBlock:"0"},o("slot",{key:"93c392107790a2c0e3499e5b7bd742219203a980"}))))}static get watchers(){return{colorMode:["setColors"]}}};n.style=i;export{n as cura_tabs_transparent};
|
|
2
|
+
//# sourceMappingURL=p-b6ff8ac1.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["curaTabsTransparentCss","CuraTabsTransparentStyle0","CuraTabsTransparent","setColors","colors","name","theme","this","colorMode","forEach","c","styles","window","CuraAPI","getColor","Object","assign","computeContentColor","disabled","hovered","selected","getIcon","iconName","iconSize","size","iconColor","h","color","getClasses","borderBottom","connectedCallback","spacing","getSpacing","handleMouseEnter","handleMouseLeave","handleClick","e","preventDefault","tabSelect","emit","render","labelSize","labelSizes","labelColor","Host","key","role","class","style","onClick","onMouseEnter","bind","onMouseLeave","lineHeight","marginBlock"],"sources":["src/components/tabs/cura-tabs-transparent/cura-tabs-transparent.scss?tag=cura-tabs-transparent&encapsulation=shadow","src/components/tabs/cura-tabs-transparent/cura-tabs-transparent.tsx"],"sourcesContent":["@import '../../../scss/mixins/spacing.scss';\n@import '../../../scss/mixins/buttons.scss';\n\n$button-sizes: (\n small: $spacing-mini $spacing-mini,\n medium: $spacing-xxxs $spacing-xxxs,\n large: $spacing-xxxs $spacing-xxs,\n);\n\n:host {\n button,\n a {\n @include button-element() {\n background-color: transparent;\n box-sizing: border-box;\n border: none;\n\n min-width: 120px;\n width: fit-content;\n\n display: flex;\n align-items: center;\n justify-content: center;\n\n &.border-bottom {\n border-bottom: 1px solid var(--border-bottom-color);\n }\n\n @each $size, $padding in $button-sizes {\n &.#{$size} {\n padding: $padding;\n }\n }\n\n &:not(.selected) {\n border-color: var(--border-color);\n }\n\n &:focus {\n border-color: var(--primary-light);\n }\n\n &:not(.disabled, .selected):hover {\n background-color: var(--background-color-hover);\n\n &.dark {\n border-color: var(--neutral-purewhite);\n }\n }\n\n cura-icon {\n margin-right: #{$spacing-mini};\n }\n\n @include button-selected() {\n &:not(.disabled) {\n border-bottom: 1px solid var(--border-bottom-color-selected);\n }\n }\n\n &.disabled {\n cursor: not-allowed;\n }\n }\n }\n}\n","import { Component, Event, EventEmitter, h, Host, Prop, State, Watch } from '@stencil/core';\nimport { labelSizes } from '../cura-tabs.definitions';\n\n@Component({\n tag: 'cura-tabs-transparent',\n styleUrl: 'cura-tabs-transparent.scss',\n shadow: true,\n})\nexport class CuraTabsTransparent {\n @Prop({ reflect: true }) name: string;\n @Prop({ reflect: true }) iconName: string;\n @Prop({ reflect: true, mutable: true }) selected: boolean = false;\n @Prop({ reflect: true, mutable: true }) disabled: boolean = false;\n @Prop({ reflect: true, mutable: true }) borderBottom: boolean = true;\n @Prop({ reflect: true }) size: 'small' | 'medium' | 'large' = 'large';\n @Prop({ reflect: true, mutable: true }) colorMode: 'dark' | 'light' = 'light';\n\n @State() hovered = false;\n @State() styles: Record<string, string> = {};\n\n @Event() tabSelect: EventEmitter<{ name: string }>;\n\n @Watch('colorMode')\n setColors() {\n const colors = [\n {\n name: '--border-bottom-color',\n theme: this.colorMode === 'light' ? 'neutral-base' : 'primary',\n },\n {\n name: '--border-bottom-color-selected',\n theme: this.colorMode === 'light' ? 'primary-dark' : 'primary-lighter',\n },\n ];\n\n colors.forEach(c => {\n if (c.theme) this.styles[c.name] = window.CuraAPI.theme.colors.getColor(c.theme);\n });\n\n this.styles = { ...this.styles };\n }\n\n computeContentColor(): string {\n if (this.disabled) return 'neutral-dark';\n\n if (this.colorMode === 'dark') {\n if (this.hovered && !this.selected) {\n return 'neutral-purewhite';\n }\n return this.selected ? 'primary-lighter' : 'neutral-purewhite';\n }\n\n if (this.hovered && !this.selected) {\n return 'primary-dark';\n }\n\n return this.selected ? 'primary-base' : 'neutral-black';\n }\n\n getIcon() {\n if (!this.iconName) return '';\n const iconSize = this.size === 'large' ? 20 : 16;\n const iconColor = this.computeContentColor();\n\n return <cura-icon name={this.iconName} size={iconSize} color={iconColor}></cura-icon>;\n }\n\n getClasses() {\n return {\n [this.size]: true,\n [this.colorMode]: true,\n 'selected': this.selected,\n 'disabled': this.disabled,\n 'border-bottom': this.borderBottom,\n };\n }\n\n connectedCallback() {\n this.styles = {\n ...this.styles,\n '--primary-dark': window.CuraAPI.theme.colors.getColor('primary-dark'),\n '--neutral-purewhite': window.CuraAPI.theme.colors.getColor('neutral-purewhite'),\n '--base-spacing': window.CuraAPI.theme.spacing.getSpacing(),\n };\n\n this.setColors();\n }\n\n handleMouseEnter() {\n if (this.disabled) return;\n this.hovered = true;\n }\n\n handleMouseLeave() {\n this.hovered = false;\n }\n\n handleClick(e: Event) {\n if (this.disabled) {\n e.preventDefault();\n return;\n }\n\n this.selected = !this.selected;\n this.tabSelect.emit({ name: this.name });\n }\n\n render() {\n const labelSize = labelSizes[this.size] || labelSizes['default'];\n const labelColor = this.computeContentColor();\n\n return (\n <Host role=\"button\" aria-pressed={this.selected} aria-disabled={this.disabled}>\n <button\n class={this.getClasses()}\n style={this.styles}\n onClick={e => this.handleClick(e)}\n disabled={this.disabled}\n onMouseEnter={this.handleMouseEnter.bind(this)}\n onMouseLeave={this.handleMouseLeave.bind(this)}\n >\n {this.getIcon()}\n <cura-label size={labelSize} color={labelColor} lineHeight=\"0\" marginBlock=\"0\">\n <slot></slot>\n </cura-label>\n </button>\n </Host>\n );\n }\n}\n"],"mappings":"6FAAA,MAAMA,EAAyB,muDAC/B,MAAAC,EAAeD,E,MCOFE,EAAmB,M,wHAG8B,M,cACA,M,kBACI,K,UACF,Q,eACQ,Q,aAEnD,M,YACuB,E,CAK1C,SAAAC,GACE,MAAMC,EAAS,CACb,CACEC,KAAM,wBACNC,MAAOC,KAAKC,YAAc,QAAU,eAAiB,WAEvD,CACEH,KAAM,iCACNC,MAAOC,KAAKC,YAAc,QAAU,eAAiB,oBAIzDJ,EAAOK,SAAQC,IACb,GAAIA,EAAEJ,MAAOC,KAAKI,OAAOD,EAAEL,MAAQO,OAAOC,QAAQP,MAAMF,OAAOU,SAASJ,EAAEJ,MAAM,IAGlFC,KAAKI,OAAMI,OAAAC,OAAA,GAAQT,KAAKI,O,CAG1B,mBAAAM,GACE,GAAIV,KAAKW,SAAU,MAAO,eAE1B,GAAIX,KAAKC,YAAc,OAAQ,CAC7B,GAAID,KAAKY,UAAYZ,KAAKa,SAAU,CAClC,MAAO,mB,CAET,OAAOb,KAAKa,SAAW,kBAAoB,mB,CAG7C,GAAIb,KAAKY,UAAYZ,KAAKa,SAAU,CAClC,MAAO,c,CAGT,OAAOb,KAAKa,SAAW,eAAiB,e,CAG1C,OAAAC,GACE,IAAKd,KAAKe,SAAU,MAAO,GAC3B,MAAMC,EAAWhB,KAAKiB,OAAS,QAAU,GAAK,GAC9C,MAAMC,EAAYlB,KAAKU,sBAEvB,OAAOS,EAAA,aAAWrB,KAAME,KAAKe,SAAUE,KAAMD,EAAUI,MAAOF,G,CAGhE,UAAAG,GACE,MAAO,CACL,CAACrB,KAAKiB,MAAO,KACb,CAACjB,KAAKC,WAAY,KAClBY,SAAYb,KAAKa,SACjBF,SAAYX,KAAKW,SACjB,gBAAiBX,KAAKsB,a,CAI1B,iBAAAC,GACEvB,KAAKI,OAAMI,OAAAC,OAAAD,OAAAC,OAAA,GACNT,KAAKI,QAAM,CACd,iBAAkBC,OAAOC,QAAQP,MAAMF,OAAOU,SAAS,gBACvD,sBAAuBF,OAAOC,QAAQP,MAAMF,OAAOU,SAAS,qBAC5D,iBAAkBF,OAAOC,QAAQP,MAAMyB,QAAQC,eAGjDzB,KAAKJ,W,CAGP,gBAAA8B,GACE,GAAI1B,KAAKW,SAAU,OACnBX,KAAKY,QAAU,I,CAGjB,gBAAAe,GACE3B,KAAKY,QAAU,K,CAGjB,WAAAgB,CAAYC,GACV,GAAI7B,KAAKW,SAAU,CACjBkB,EAAEC,iBACF,M,CAGF9B,KAAKa,UAAYb,KAAKa,SACtBb,KAAK+B,UAAUC,KAAK,CAAElC,KAAME,KAAKF,M,CAGnC,MAAAmC,GACE,MAAMC,EAAYC,EAAWnC,KAAKiB,OAASkB,EAAW,WACtD,MAAMC,EAAapC,KAAKU,sBAExB,OACES,EAACkB,EAAI,CAAAC,IAAA,2CAACC,KAAK,SAAQ,eAAevC,KAAKa,SAAQ,gBAAiBb,KAAKW,UACnEQ,EAAA,UAAAmB,IAAA,2CACEE,MAAOxC,KAAKqB,aACZoB,MAAOzC,KAAKI,OACZsC,QAASb,GAAK7B,KAAK4B,YAAYC,GAC/BlB,SAAUX,KAAKW,SACfgC,aAAc3C,KAAK0B,iBAAiBkB,KAAK5C,MACzC6C,aAAc7C,KAAK2B,iBAAiBiB,KAAK5C,OAExCA,KAAKc,UACNK,EAAA,cAAAmB,IAAA,2CAAYrB,KAAMiB,EAAWd,MAAOgB,EAAYU,WAAW,IAAIC,YAAY,KACzE5B,EAAA,QAAAmB,IAAA,+C","ignoreList":[]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as e,c as r,h as a,H as s,g as t}from"./p-4ee8efca.js";import{f as o}from"./p-f9b8f665.js";const c='@charset "UTF-8";:host{display:block;box-sizing:border-box;min-width:0}.container{display:flex;align-items:center;flex-direction:row-reverse;justify-content:start;gap:var(--gap);cursor:pointer}.position.container{flex-direction:row}.position .label-wrapper{justify-content:end}.position .message{text-align:right}.position .label{order:1}.info{display:flex;flex-direction:column;overflow:hidden}.label.textoverflow-single{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;display:block;min-width:0;max-width:100%}.label-wrapper{display:flex;justify-content:start;align-items:center;gap:5px}.control{width:fit-content;cursor:pointer;position:relative}.checkbox{appearance:none;border:2px solid var(--neutral-base-neutral-medium);border-radius:4px;background:var(--neutral-black-neutral-purewhite);flex:1 0;display:flex;align-items:center;justify-content:center;position:relative;cursor:pointer;box-sizing:border-box;width:var(--size);height:var(--size);flex:0 0 var(--size)}.icon{position:absolute;display:flex;opacity:0;transition:opacity 0.3s}.checkbox:focus{border-color:var(--info-base) !important}.disabled .checkbox{background:var(--neutral-black-neutral-white);border-color:var(--neutral-darker-neutral-base);cursor:not-allowed}.disabled .checkbox:hover{border-color:var(--neutral-darker-neutral-base) !important}.disabled.checked .checkbox,.disabled.indeterminate .checkbox{background:var(--neutral-black-neutral-white);border-color:var(--neutral-darker-neutral-base)}.disabled.checked .checkbox:hover,.disabled.indeterminate .checkbox:hover{border-color:var(--neutral-base-neutral-white);background:var(--primary-base-neutral-white)}.disabled .checkbox:focus{border-color:var(--neutral-darker-neutral-base) !important}.checked .checkbox{border-color:var(--color-dark);background:var(--color-base)}.checked .checkbox:hover{border-color:var(--color-base) !important;background:var(--color-light)}.indeterminate .checkbox{border-color:var(--color-base);background:var(--color-light)}.indeterminate .checkbox:hover{border-color:var(--color-dark) !important;background:var(--color-base)}.checked .icon,.indeterminate .icon{opacity:1}:not(.disabled):not(.checked):not(.indeterminate) .checkbox:hover{border-color:var(--neutral-purewhite-neutral-dark)}.success.dark .checkbox{background:var(--neutral-black)}.success .checkbox{border-color:var(--success-base);background:var(--success-lighter)}.success .checkbox:hover{border-color:var(--success-base) !important}.success.checked .checkbox{border-color:var(--success-dark-base);background:var(--success-base-lighter)}.success.checked .checkbox:hover{border-color:var(--success-dark-base)}.error.dark .checkbox{background:var(--neutral-black)}.error .checkbox{border-color:var(--error-base);background:var(--error-lighter)}.error .checkbox:hover{border-color:var(--error-base) !important}.error.checked .checkbox{border-color:var(--error-dark-base);background:var(--error-base-lighter)}.error.checked .checkbox:hover{border-color:var(--error-dark-base)}input{appearance:none;-webkit-appearance:none;-moz-appearance:none}';const i=c;const n=class{constructor(a){e(this,a);this.onchange=r(this,"onchange",7);if(a.$hostElement$["s-ei"]){this.internals=a.$hostElement$["s-ei"]}else{this.internals=a.$hostElement$.attachInternals();a.$hostElement$["s-ei"]=this.internals}this.isDarkBackground=()=>this.background==="dark";this.isDarkIconColor=()=>this.iconColor==="dark";this.handleClick=()=>{if(this.disabled)return;this.indeterminate=false;this.checked=!this.checked;this.internals.setFormValue(this.value);this.onchange.emit({value:this.value,checked:this.checked,indeterminate:this.indeterminate})};this.checked=false;this.indeterminate=false;this.status="default";this.disabled=false;this.required=false;this.label=undefined;this.ontabindex=0;this.position="left";this.value=undefined;this.name=undefined;this.size="medium";this.background="light";this.iconColor="dark";this.color="accent";this.overflowLabel="none";this.overflowHelper="none";this.styles={}}sizeHandler(){this.styles=Object.assign(Object.assign({},this.styles),{"--size":`${o[this.size].size}px`,"--gap":`${o[this.size].gap}px`})}setColors(){const e=[{name:"--color-base",background:`${this.color}-base`},{name:"--color-lighter",background:`${this.color}-lighter`},{name:"--color-light",background:`${this.color}-light`},{name:"--color-dark",background:`${this.color}-dark`},{name:"--info-base",background:"info-base"},{name:"--error-base",background:"error-base"},{name:"--success-lighter",background:"success-lighter"},{name:"--success-base",background:"success-base"},{name:"--success-dark",background:"success-dark"},{name:"--error-lighter",background:"error-lighter"},{name:"--neutral-black",background:"neutral-black"},{name:"--primary-base-neutral-white",background:this.isDarkBackground()?"primary-base":"neutral-white"},{name:"--neutral-base-neutral-medium",background:this.isDarkBackground()?"neutral-base":"neutral-medium"},{name:"--neutral-black-neutral-purewhite",background:this.isDarkBackground()?"neutral-black":"neutral-purewhite"},{name:"--neutral-black-neutral-white",background:this.isDarkBackground()?"neutral-black":"neutral-white"},{name:"--neutral-darker-neutral-base",background:this.isDarkBackground()?"neutral-darker":"neutral-base"},{name:"--neutral-base-neutral-base",background:this.isDarkBackground()?"primary-base":"neutral-base"},{name:"--neutral-purewhite-neutral-dark",background:this.isDarkBackground()?"neutral-purewhite":"neutral-dark"},{name:"--primary-base-neutral-medium",background:this.isDarkBackground()?"primary-base":"neutral-medium"},{name:"--success-base-lighter",background:this.isDarkBackground()?"success-base":"success-lighter"},{name:"--success-dark-base",background:this.isDarkBackground()?"success-dark":"success-base"},{name:"--error-base-lighter",background:this.isDarkBackground()?"error-base":"error-lighter"},{name:"--error-dark-base",background:this.isDarkBackground()?"error-dark":"error-base"}];e.forEach((e=>{this.styles[e.name]=window.CuraAPI.theme.colors.getColor(e.background)}));this.styles=Object.assign({},this.styles)}connectedCallback(){this.sizeHandler();this.setColors()}formAssociatedCallback(e){e.ariaLabel=this.label}formStateRestoreCallback(e){this.value=e.value;this.checked=e.checked;this.indeterminate=e.indeterminate;this.internals.setFormValue(this.value)}formResetCallback(){this.value="";this.checked=false;this.indeterminate=false;this.internals.setValidity({});this.internals.setFormValue(this.value)}formDisabledCallback(e){this.disabled=e}getClasses(){const e={};e["container"]=true;e["checked"]=this.checked;e["disabled"]=this.disabled;e[this.background]=true;e["indeterminate"]=this.indeterminate;e["position"]=this.position==="right";e[this.status]=true;return e}assignColor(e){if(this.disabled)return this.isDarkBackground()?"neutral-dark":"neutral-dark";const r={success:{icon:"success-dark",label:this.isDarkBackground()?"success-lighter":"success-darker",message:this.isDarkBackground()?"success-base":"success-dark"},error:{icon:"error-dark",label:this.isDarkBackground()?"error-lighter":"neutral-darker",message:this.isDarkBackground()?"error-base":"error-dark"},default:{icon:this.isDarkIconColor()?"neutral-black":"neutral-purewhite",label:this.isDarkBackground()?"neutral-white":"neutral-black",message:this.isDarkBackground()?"primary-lighter":"neutral-dark"}};return r[this.status][e]}getIcon(){const e=this.indeterminate?"minus":"check";const r=this.assignColor("icon");const s=this.size==="large"?20:"micro";return a("cura-icon",{class:"icon",name:e,size:s,color:r})}render(){return a(s,{key:"2e951be46f80c67ea87aaf1c613e29ae7a1cc856",role:"checkbox","aria-checked":this.checked,"aria-disabled":this.disabled,"aria-required":this.required,"aria-invalid":this.status==="error"},a("div",{key:"341a30934dd6660b03e6be161999fad24fb005ef",class:this.getClasses(),style:this.styles,onClick:this.handleClick},a("div",{key:"58f32f6b047d19b8af2468b6007cf2dfb1297476",class:"info"},a("div",{key:"e23407390368c638e4e8cd9119ad3ccd1767d861",class:"label-wrapper"},a("cura-label",{key:"d7ce7b39441203e9058b0227edbfc75dd320806f",textOverflow:this.overflowLabel,class:`label${this.overflowLabel==="single"?" textoverflow-single":""}`,weight:"bold",size:this.size==="large"?"medium":"xsmall",color:this.assignColor("label")},this.label),this.required&&a("cura-paragraph",{key:"0684b9ab1f517083bc681bd0731aedf6d38c9873",lineHeight:"0%",marginBlock:"0",color:"error-base"},"*"," ")),a("cura-label",{key:"499419ee720a7c7ba7e42fc8fcebccfb4e0b0c42",textOverflow:this.overflowHelper,color:this.assignColor("message"),size:"xsmall",class:"message"},a("slot",{key:"7c9637fa4a8082f6451851452db1b751218a20ec"}))),a("div",{key:"91b0a1f42d65d72aca24ff8a852d3c6f461a9cb7",class:"checkbox",tabIndex:this.ontabindex},a("input",{key:"4f1db30730b2d68d3d0f3036fd5924a9da1b541b",type:"checkbox",name:this.name,value:this.value,disabled:this.disabled,required:this.required,checked:this.checked,indeterminate:this.indeterminate}),this.getIcon())))}static get formAssociated(){return true}get host(){return t(this)}static get watchers(){return{size:["sizeHandler"],color:["setColors"],background:["setColors","assignColor"],iconColor:["assignColor"]}}};n.style=i;export{n as cura_checkbox};
|
|
2
|
+
//# sourceMappingURL=p-d8e1e182.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["curaCheckboxCss","CuraCheckboxStyle0","CuraCheckbox","this","isDarkBackground","background","isDarkIconColor","iconColor","handleClick","disabled","indeterminate","checked","internals","setFormValue","value","onchange","emit","sizeHandler","styles","Object","assign","formsSizes","size","gap","setColors","colors","name","color","forEach","window","CuraAPI","theme","getColor","connectedCallback","formAssociatedCallback","form","ariaLabel","label","formStateRestoreCallback","state","formResetCallback","setValidity","formDisabledCallback","getClasses","classes","position","status","assignColor","type","statusColors","success","icon","message","error","default","getIcon","iconName","iconSize","h","class","render","Host","key","role","required","style","onClick","textOverflow","overflowLabel","weight","lineHeight","marginBlock","overflowHelper","tabIndex","ontabindex"],"sources":["src/components/forms/cura-checkbox/cura-checkbox.scss?tag=cura-checkbox&encapsulation=shadow","src/components/forms/cura-checkbox/cura-checkbox.tsx"],"sourcesContent":["@import '../../../scss/mixins/text.scss';\n\n:host {\n display: block;\n box-sizing: border-box;\n\n min-width: 0;\n}\n\n/* Container e Layout */\n.container {\n display: flex;\n align-items: center;\n flex-direction: row-reverse;\n justify-content: start;\n gap: var(--gap);\n\n cursor: pointer;\n}\n\n.position {\n &.container {\n flex-direction: row;\n }\n\n .label-wrapper {\n justify-content: end;\n }\n\n .message {\n text-align: right;\n }\n\n .label {\n order: 1;\n }\n}\n\n.info {\n display: flex;\n flex-direction: column;\n\n overflow: hidden;\n}\n\n.label.textoverflow-single {\n @include truncate-single();\n min-width: 0;\n max-width: 100%;\n}\n\n.label-wrapper {\n display: flex;\n justify-content: start;\n align-items: center;\n gap: 5px;\n}\n\n/* Control e Checkbox */\n.control {\n width: fit-content;\n cursor: pointer;\n position: relative;\n}\n\n.checkbox {\n appearance: none;\n border: 2px solid var(--neutral-base-neutral-medium);\n border-radius: 4px;\n background: var(--neutral-black-neutral-purewhite);\n flex: 1 0;\n display: flex;\n align-items: center;\n justify-content: center;\n position: relative;\n cursor: pointer;\n box-sizing: border-box;\n width: var(--size);\n height: var(--size);\n flex: 0 0 var(--size);\n}\n\n.icon {\n position: absolute;\n display: flex;\n opacity: 0;\n transition: opacity 0.3s;\n}\n\n/* Estados de Foco */\n.checkbox:focus {\n border-color: var(--info-base) !important;\n}\n\n/* Estado Disabled */\n.disabled .checkbox {\n background: var(--neutral-black-neutral-white);\n border-color: var(--neutral-darker-neutral-base);\n cursor: not-allowed;\n\n &:hover {\n border-color: var(--neutral-darker-neutral-base) !important;\n }\n}\n\n.disabled.checked .checkbox,\n.disabled.indeterminate .checkbox {\n background: var(--neutral-black-neutral-white);\n border-color: var(--neutral-darker-neutral-base);\n\n &:hover {\n border-color: var(--neutral-base-neutral-white);\n background: var(--primary-base-neutral-white);\n }\n}\n\n.disabled .checkbox:focus {\n border-color: var(--neutral-darker-neutral-base) !important;\n}\n\n/* Estado Checked */\n.checked .checkbox {\n border-color: var(--color-dark);\n background: var(--color-base);\n\n &:hover {\n border-color: var(--color-base) !important;\n background: var(--color-light);\n }\n}\n\n/* Estado Indeterminate */\n.indeterminate .checkbox {\n border-color: var(--color-base);\n background: var(--color-light);\n\n &:hover {\n border-color: var(--color-dark) !important;\n background: var(--color-base);\n }\n}\n\n.checked .icon,\n.indeterminate .icon {\n opacity: 1;\n}\n\n/* Hover para não disabled, default, checked, indeterminate */\n:not(.disabled):not(.checked):not(.indeterminate) .checkbox:hover {\n border-color: var(--neutral-purewhite-neutral-dark);\n}\n\n/* Estado Success */\n\n.success.dark .checkbox {\n background: var(--neutral-black);\n}\n\n.success .checkbox {\n border-color: var(--success-base);\n background: var(--success-lighter);\n\n &:hover {\n border-color: var(--success-base) !important;\n }\n}\n\n.success.checked .checkbox {\n border-color: var(--success-dark-base);\n background: var(--success-base-lighter);\n\n &:hover {\n border-color: var(--success-dark-base);\n }\n}\n\n/* Estado Error */\n\n.error.dark .checkbox {\n background: var(--neutral-black);\n}\n\n.error .checkbox {\n border-color: var(--error-base);\n background: var(--error-lighter);\n\n &:hover {\n border-color: var(--error-base) !important;\n }\n}\n\n.error.checked .checkbox {\n border-color: var(--error-dark-base);\n background: var(--error-base-lighter);\n\n &:hover {\n border-color: var(--error-dark-base);\n }\n}\n\n/* Input */\ninput {\n appearance: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n}\n","import { Component, Prop, Event, Element, h, Host, Watch, EventEmitter, State, AttachInternals } from '@stencil/core';\nimport { formsSizes } from '../cura-forms.definitions';\n\n@Component({\n tag: 'cura-checkbox',\n styleUrl: 'cura-checkbox.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class CuraCheckbox {\n /**\n * Reflects the checked state of the checkbox.\n * Mutable property allowing state change.\n */\n @Prop({ reflect: true, mutable: true }) checked: boolean = false;\n /**\n * Reflects the indeterminate state of the checkbox.\n * Mutable property allowing state change.\n */\n @Prop({ reflect: true, mutable: true }) indeterminate: boolean = false;\n /**\n * Status of the checkbox.\n * Can be 'error', 'success', or 'default'.\n */\n @Prop({ reflect: true, mutable: true }) status: 'error' | 'success' | 'default' = 'default';\n /**\n * Reflects the disabled state of the checkbox.\n */\n @Prop({ reflect: true }) disabled: boolean = false;\n /**\n * Reflects the required state of the checkbox.\n */\n @Prop({ reflect: true }) required: boolean = false;\n /**\n * Text label associated with the checkbox.\n */\n @Prop({ reflect: true }) label: string;\n /**\n * Specifies the tabindex of the checkbox.\n */\n @Prop({ reflect: true }) ontabindex: number = 0;\n /**\n * Position of the label relative to the checkbox.\n * Can be 'left' or 'right'.\n */\n @Prop({ reflect: true }) position: 'left' | 'right' = 'left';\n /**\n * Value associated with the checkbox.\n */\n @Prop({ reflect: true }) value: string;\n /**\n * Name attribute of the checkbox.\n */\n @Prop({ reflect: true }) name: string;\n /**\n * Size of the checkbox.\n * Can be 'small', 'medium', or 'large'.\n */\n @Prop({ reflect: true }) size: 'small' | 'medium' | 'large' = 'medium';\n /**\n * Background theme of the checkbox.\n * Can be 'dark' or 'light'.\n */\n @Prop() background: 'dark' | 'light' = 'light';\n /**\n * iconColor theme of the checkbox.\n * Can be 'dark' or 'light'.\n */\n @Prop() iconColor: 'dark' | 'light' = 'dark';\n /**\n * Color theme of the checkbox.\n */\n @Prop() color = 'accent';\n\n /**\n * Controls how the label text should handle overflow.\n * - `'none'`: No overflow handling; the label displays normally.\n * - `'single'`: The label will be truncated with an ellipsis if it overflows a single line.\n * - `string`: Custom overflow handling mode.\n *\n * @default 'none'\n */\n @Prop({ reflect: true }) overflowLabel: 'none' | 'single' | string = 'none';\n\n /**\n * Controls how the helper text should handle overflow.\n * - `'none'`: No overflow handling; the label displays normally.\n * - `'single'`: The label will be truncated with an ellipsis if it overflows a single line.\n * - `string`: Custom overflow handling mode.\n *\n * @default 'none'\n */\n @Prop({ reflect: true }) overflowHelper: 'none' | 'single' | string = 'none';\n\n @State() styles = {};\n\n @Element() host: HTMLElement;\n\n @Event() onchange: EventEmitter<{ value: string; checked: boolean; indeterminate: boolean }>;\n\n @AttachInternals() internals: ElementInternals;\n\n isDarkBackground = () => this.background === 'dark';\n\n isDarkIconColor = () => this.iconColor === 'dark';\n\n @Watch('size')\n sizeHandler() {\n this.styles = {\n ...this.styles,\n '--size': `${formsSizes[this.size].size}px`,\n '--gap': `${formsSizes[this.size].gap}px`,\n };\n }\n\n /**\n * Watches changes in color and background properties to update styles.\n */\n @Watch('color')\n @Watch('background')\n setColors() {\n const colors = [\n { name: '--color-base', background: `${this.color}-base` },\n { name: '--color-lighter', background: `${this.color}-lighter` },\n { name: '--color-light', background: `${this.color}-light` },\n { name: '--color-dark', background: `${this.color}-dark` },\n { name: '--info-base', background: 'info-base' },\n { name: '--error-base', background: 'error-base' },\n { name: '--success-lighter', background: 'success-lighter' },\n { name: '--success-base', background: 'success-base' },\n { name: '--success-dark', background: 'success-dark' },\n { name: '--error-lighter', background: 'error-lighter' },\n { name: '--neutral-black', background: 'neutral-black' },\n { name: '--primary-base-neutral-white', background: this.isDarkBackground() ? 'primary-base' : 'neutral-white' },\n { name: '--neutral-base-neutral-medium', background: this.isDarkBackground() ? 'neutral-base' : 'neutral-medium' },\n { name: '--neutral-black-neutral-purewhite', background: this.isDarkBackground() ? 'neutral-black' : 'neutral-purewhite' },\n { name: '--neutral-black-neutral-white', background: this.isDarkBackground() ? 'neutral-black' : 'neutral-white' },\n { name: '--neutral-darker-neutral-base', background: this.isDarkBackground() ? 'neutral-darker' : 'neutral-base' },\n { name: '--neutral-base-neutral-base', background: this.isDarkBackground() ? 'primary-base' : 'neutral-base' },\n { name: '--neutral-purewhite-neutral-dark', background: this.isDarkBackground() ? 'neutral-purewhite' : 'neutral-dark' },\n { name: '--primary-base-neutral-medium', background: this.isDarkBackground() ? 'primary-base' : 'neutral-medium' },\n { name: '--success-base-lighter', background: this.isDarkBackground() ? 'success-base' : 'success-lighter' },\n { name: '--success-dark-base', background: this.isDarkBackground() ? 'success-dark' : 'success-base' },\n { name: '--error-base-lighter', background: this.isDarkBackground() ? 'error-base' : 'error-lighter' },\n { name: '--error-dark-base', background: this.isDarkBackground() ? 'error-dark' : 'error-base' },\n ];\n\n colors.forEach(color => {\n this.styles[color.name] = window.CuraAPI.theme.colors.getColor(color.background);\n });\n this.styles = { ...this.styles };\n }\n\n connectedCallback() {\n this.sizeHandler();\n this.setColors();\n }\n\n /**\n * Callback for form association.\n */\n formAssociatedCallback(form: { ariaLabel: string }) {\n form.ariaLabel = this.label;\n }\n\n /**\n * Callback to restore the switch state from the form.\n */\n formStateRestoreCallback(state: { value: string; checked: boolean; indeterminate: boolean }) {\n this.value = state.value;\n this.checked = state.checked;\n this.indeterminate = state.indeterminate;\n this.internals.setFormValue(this.value);\n }\n\n /**\n * Callback to reset the switch state when the form is reset.\n */\n formResetCallback() {\n this.value = '';\n this.checked = false;\n this.indeterminate = false;\n this.internals.setValidity({});\n this.internals.setFormValue(this.value);\n }\n\n /**\n * Callback to update the switch's disabled state when the form's disabled state changes.\n */\n formDisabledCallback(disabled: boolean) {\n this.disabled = disabled;\n }\n\n handleClick = () => {\n if (this.disabled) return;\n\n this.indeterminate = false;\n this.checked = !this.checked;\n this.internals.setFormValue(this.value);\n this.onchange.emit({ value: this.value, checked: this.checked, indeterminate: this.indeterminate });\n };\n\n getClasses() {\n const classes = {};\n classes['container'] = true;\n classes['checked'] = this.checked;\n classes['disabled'] = this.disabled;\n classes[this.background] = true;\n classes['indeterminate'] = this.indeterminate;\n classes['position'] = this.position === 'right';\n classes[this.status] = true;\n\n return classes;\n }\n\n /**\n * Assigns color based on status and background theme.\n * @param defaultColor Default color.\n */\n @Watch('background')\n @Watch('iconColor')\n assignColor(type: 'icon' | 'label' | 'message') {\n if (this.disabled) return this.isDarkBackground() ? 'neutral-dark' : 'neutral-dark';\n\n const statusColors = {\n success: {\n icon: 'success-dark',\n label: this.isDarkBackground() ? 'success-lighter' : 'success-darker',\n message: this.isDarkBackground() ? 'success-base' : 'success-dark',\n },\n error: {\n icon: 'error-dark',\n label: this.isDarkBackground() ? 'error-lighter' : 'neutral-darker',\n message: this.isDarkBackground() ? 'error-base' : 'error-dark',\n },\n default: {\n icon: this.isDarkIconColor() ? 'neutral-black' : 'neutral-purewhite',\n label: this.isDarkBackground() ? 'neutral-white' : 'neutral-black',\n message: this.isDarkBackground() ? 'primary-lighter' : 'neutral-dark',\n },\n };\n\n return statusColors[this.status][type];\n }\n\n /**\n * Retrieves icon element based on checkbox state.\n */\n getIcon() {\n const iconName = this.indeterminate ? 'minus' : 'check';\n const iconColor = this.assignColor('icon');\n const iconSize = this.size === 'large' ? 20 : 'micro';\n\n return <cura-icon class=\"icon\" name={iconName} size={iconSize} color={iconColor}></cura-icon>;\n }\n\n render() {\n return (\n <Host role=\"checkbox\" aria-checked={this.checked} aria-disabled={this.disabled} aria-required={this.required} aria-invalid={this.status === 'error'}>\n <div class={this.getClasses()} style={this.styles} onClick={this.handleClick}>\n <div class=\"info\">\n <div class=\"label-wrapper\">\n <cura-label\n textOverflow={this.overflowLabel}\n class={`label${this.overflowLabel === 'single' ? ' textoverflow-single' : ''}`}\n weight=\"bold\"\n size={this.size === 'large' ? 'medium' : 'xsmall'}\n color={this.assignColor('label')}\n >\n {this.label}\n </cura-label>\n {this.required && (\n <cura-paragraph lineHeight=\"0%\" marginBlock=\"0\" color=\"error-base\">\n *{' '}\n </cura-paragraph>\n )}\n </div>\n <cura-label textOverflow={this.overflowHelper} color={this.assignColor('message')} size=\"xsmall\" class=\"message\">\n <slot></slot>\n </cura-label>\n </div>\n <div class={'checkbox'} tabIndex={this.ontabindex}>\n <input\n type=\"checkbox\"\n name={this.name}\n value={this.value}\n disabled={this.disabled}\n required={this.required}\n checked={this.checked}\n indeterminate={this.indeterminate}\n />\n {this.getIcon()}\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { C as CuraThemeModule } from './cura-theme-module-
|
|
1
|
+
import { C as CuraThemeModule } from './cura-theme-module-bf286f68.js';
|
|
2
2
|
|
|
3
3
|
class CuraAPI {
|
|
4
4
|
constructor(config) {
|
|
@@ -65,4 +65,4 @@ const globalScripts = appGlobalScript;
|
|
|
65
65
|
|
|
66
66
|
export { globalScripts as g };
|
|
67
67
|
|
|
68
|
-
//# sourceMappingURL=app-globals-
|
|
68
|
+
//# sourceMappingURL=app-globals-c2abb41c.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"app-globals-
|
|
1
|
+
{"file":"app-globals-c2abb41c.js","mappings":"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","names":[],"sources":["src/api/cura-api.ts","src/rededor-cura-start.ts","@stencil/core/internal/app-globals"],"sourcesContent":["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, opacity?: number) { return themeModule.colors.getColor(colorWithDepth, opacity) },\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 breakpoints: {\n get: function(size?: 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge', position?: 'min' | 'max') { return themeModule.breakpoints.get(size, position); }\n }\n };\n this._addGlobalClasses();\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 _addGlobalClasses() {\n const styleId = \"cura_global_classes\";\n let styleElement = document.head.querySelector(`#${styleId}`);\n if (!styleElement) {\n styleElement = document.createElement(\"style\");\n styleElement.id = styleId;\n styleElement.textContent = `\n .cura-body-scroll-lock {\n overflow: hidden;\n position: fixed;\n left: 0;\n right: 0;\n top: 0;\n }\n `;\n document.head.appendChild(styleElement);\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"],"version":3}
|
|
@@ -2,6 +2,7 @@ import { r as registerInstance, h, H as Host, g as getElement, c as createEvent
|
|
|
2
2
|
import { l as labelSizes } from './cura-button.definitions-617d3bad.js';
|
|
3
3
|
import { S as Static } from './static-090f0088.js';
|
|
4
4
|
import { i as iconSizes } from './cura-icon.definitions-a892c0e2.js';
|
|
5
|
+
import { l as labelSizes$1 } from './cura-tabs.definitions-a017126e.js';
|
|
5
6
|
|
|
6
7
|
const curaAccordionCss = ":host{display:block;color:var(--font-color);font-size:var(--font-size);font-size:var(--font-size);font-family:var(--font-family);font-weight:var(--font-weight-regular)}";
|
|
7
8
|
const CuraAccordionStyle0 = curaAccordionCss;
|
|
@@ -178,7 +179,7 @@ const CuraAvatar = class {
|
|
|
178
179
|
this.imageSrc = this.imageSrcDefault || `${this.assetsPath}/images/avatar/patient-default.svg`;
|
|
179
180
|
}
|
|
180
181
|
render() {
|
|
181
|
-
return (h(Host, { key: '
|
|
182
|
+
return (h(Host, { key: '51683368cca9bff9bdf3a8e835990c89df3cd4be', style: this.hostCSSProperties(), role: "img" }, h("div", { key: '84196bf4ed6914904f14f8ec0d07b40ceace5ebf', class: this.getClasses(), style: this.styles }, h("img", { key: '8968215d670f9cd5a042dd66e6dc15a75d07c68e', src: this.imageSrc || this.imageSrcDefault || `${this.assetsPath}/images/avatar/patient-default.svg`, onError: () => this.onSrcError() }))));
|
|
182
183
|
}
|
|
183
184
|
get host() { return getElement(this); }
|
|
184
185
|
static get watchers() { return {
|
|
@@ -938,7 +939,7 @@ const CuraHeading = class {
|
|
|
938
939
|
return tags[`${this.level}`] || tags['default'];
|
|
939
940
|
}
|
|
940
941
|
render() {
|
|
941
|
-
return (h(Host, { key: '
|
|
942
|
+
return (h(Host, { key: 'd32c25d0110f82182f4559789f3d2db04e040afe', style: this.hostCSSProperties(), role: "heading", "aria-level": this.level }, this.getHeadingTag()));
|
|
942
943
|
}
|
|
943
944
|
get host() { return getElement(this); }
|
|
944
945
|
};
|
|
@@ -5126,13 +5127,13 @@ const CuraParagraph = class {
|
|
|
5126
5127
|
return classes;
|
|
5127
5128
|
}
|
|
5128
5129
|
render() {
|
|
5129
|
-
return (h(Host, { key: '
|
|
5130
|
+
return (h(Host, { key: 'c3789e60b50107cc39c51e4a3ec317e86c966689', style: this.hostCSSProperties() }, h("p", { key: 'f70ffc6277b6164dfc8d230123820efb3d5daa64', style: this.styles, class: this.getClasses() }, h("slot", { key: '66251e59d51637fc7820516b17af8947cc9168e8' }))));
|
|
5130
5131
|
}
|
|
5131
5132
|
get host() { return getElement(this); }
|
|
5132
5133
|
};
|
|
5133
5134
|
CuraParagraph.style = CuraParagraphStyle0;
|
|
5134
5135
|
|
|
5135
|
-
const curaSelectCss = ":host{display:block;position:relative;font-family:var(--font-family)}.wrapper{width:100%;user-select:none;text-align:left !important}.wrapper cura-label{margin-bottom:8px}.wrapper .helper-text{margin-top:8px;color:var(--neutral-dark)}.wrapper .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box}.wrapper .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper .cura-input-field .feedback-icon{padding-left:12px}.wrapper .cura-input-field .up-down-icon{order:3;padding-right:6px;cursor:pointer;pointer-events:all}.wrapper .cura-input-field .up-down-button{background-color:transparent;border:none}.wrapper .cura-input-field input{padding:0px 12px 0px 8px;cursor:pointer}.wrapper .cura-input-field.open{border-radius:4px 4px 0 0 !important}.wrapper.transparent{background-color:transparent;padding:0px;max-height:80px}.wrapper.transparent .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box;background-color:transparent !important;border:none !important;border-radius:0;height:27px}.wrapper.transparent .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.transparent .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.transparent .cura-input-field .feedback-icon{padding-left:12px}.wrapper.transparent .cura-input-field input{color:var(--neutral-black) !important;font-size:16px;font-weight:var(--font-weight-bold) !important;padding:0}.wrapper.transparent .cura-input-field input::placeholder{color:var(--neutral-black)}.wrapper.transparent .cura-input-field .feedback-icon{order:3;margin:0 20px 0 0}.wrapper.transparent:focus-within .cura-input-field{border:none !important;background-color:transparent !important}.wrapper.transparent:focus-within .cura-input-field input{border:none !important;outline:none}.wrapper.transparent .helper-text{margin-top:0px}.wrapper:hover:not(.disabled):not(.isLoading):not(.success):not(.error):not(.isFocused):not(.readOnly):not(.transparent) .cura-input-field{border-color:var(--neutral-dark)}.wrapper:hover:not(.disabled):not(.isLoading):not(.success):not(.error):not(.isFocused):not(.readOnly):not(.transparent) .cura-input-field input{color:var(--neutral-dark)}.wrapper:hover:not(.disabled):not(.isLoading):not(.success):not(.error):not(.isFocused):not(.readOnly):not(.transparent) .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper:focus-within:not(.selection) .cura-input-field{border:2px solid var(--info-base) !important;background-color:var(--neutral-purewhite);outline:none}.wrapper:focus-within:not(.selection) .cura-input-field input{color:var(--neutral-black) !important}.wrapper:focus-within.selection .cura-input-field{border-radius:4px 4px 0px 0px}.wrapper.success .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box}.wrapper.success .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.success .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.success .cura-input-field .feedback-icon{padding-left:12px}.wrapper.success .cura-input-field input{color:var(--success-darker) !important}.wrapper.success .cura-input-field input::placeholder{color:var(--success-darker) !important}.wrapper.success:not(.transparent) .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box;border:2px solid var(--success-dark) !important;background-color:var(--success-lighter) !important}.wrapper.success:not(.transparent) .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.success:not(.transparent) .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.success:not(.transparent) .cura-input-field .feedback-icon{padding-left:12px}.wrapper.error .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box}.wrapper.error .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.error .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.error .cura-input-field .feedback-icon{padding-left:12px}.wrapper.error .cura-input-field input{color:var(--error-darker) !important}.wrapper.error .cura-input-field input::placeholder{color:var(--error-darker) !important}.wrapper.error:not(.transparent) .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box;border:2px solid var(--error-dark) !important;background-color:var(--error-lighter) !important}.wrapper.error:not(.transparent) .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.error:not(.transparent) .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.error:not(.transparent) .cura-input-field .feedback-icon{padding-left:12px}.wrapper.small .cura-input-field{width:100%;height:32px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box}.wrapper.small .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:12px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.small .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.small .cura-input-field .feedback-icon{padding-left:12px}.wrapper.small .cura-input-field input{line-height:13px;letter-spacing:0.72px}.wrapper.small .helper-text{margin-top:8px;color:var(--neutral-dark);font-weight:var(--font-weight-regular)}.wrapper.small.label .menu{top:53px}.wrapper.small .menu{top:33px}.wrapper.medium .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box}.wrapper.medium .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.medium .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.medium .cura-input-field .feedback-icon{padding-left:12px}.wrapper.medium .cura-input-field input{line-height:16px;letter-spacing:0.56px}.wrapper.medium .helper-text{margin-top:8px;color:var(--neutral-dark);font-weight:var(--font-weight-regular)}.wrapper.medium.label .menu{top:61px}.wrapper.medium .menu{top:40px}.wrapper.large .cura-input-field{width:100%;height:44px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box}.wrapper.large .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:16px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.large .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.large .cura-input-field .feedback-icon{padding-left:12px}.wrapper.large .helper-text{margin-top:8px;color:var(--neutral-dark);font-weight:var(--font-weight-bold)}.wrapper.large.label .menu{top:69px}.wrapper.large .menu{top:47px}.wrapper.disabled .cura-input-field{background-color:var(--neutral-white);border:2px solid var(--neutral-base)}.wrapper.disabled .cura-input-field input{color:var(--neutral-medium)}.wrapper.disabled .cura-input-field input::placeholder{color:var(--neutral-medium)}.required{color:red}.menu{position:absolute;left:0;right:-1px;background:#fff;border:2px solid var(--neutral-light);border-radius:4px;z-index:1000;max-height:285px;overflow:hidden;border-top:transparent;align-items:center;scrollbar-color:var(--neutral-medium) var(--neutral-black-20);overflow-y:auto;box-shadow:0px 4px 8px 0px rgba(38, 38, 38, 0.16)}.menu.open{border-radius:0 !important;padding:12px}";
|
|
5136
|
+
const curaSelectCss = ":host{display:block;position:relative;font-family:var(--font-family)}.wrapper{width:100%;user-select:none;text-align:left !important}.wrapper cura-label{margin-bottom:8px}.wrapper .helper-text{margin-top:8px;color:var(--neutral-dark)}.wrapper .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box}.wrapper .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper .cura-input-field .feedback-icon{padding-left:12px}.wrapper .cura-input-field .up-down-icon{order:3;padding-right:6px;cursor:pointer;pointer-events:all}.wrapper .cura-input-field .up-down-button{background-color:transparent;border:none}.wrapper .cura-input-field input{padding:0px 12px 0px 8px;cursor:pointer}.wrapper .cura-input-field.open{border-radius:4px 4px 0 0 !important}.wrapper.transparent{background-color:transparent;padding:0px;max-height:80px}.wrapper.transparent .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box;background-color:transparent !important;border:none !important;border-radius:0;height:27px}.wrapper.transparent .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.transparent .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.transparent .cura-input-field .feedback-icon{padding-left:12px}.wrapper.transparent .cura-input-field input{color:var(--neutral-black) !important;font-size:16px;font-weight:var(--font-weight-bold) !important;padding:0}.wrapper.transparent .cura-input-field input::placeholder{color:var(--neutral-black)}.wrapper.transparent .cura-input-field .feedback-icon{order:3;margin:0 20px 0 0}.wrapper.transparent:focus-within .cura-input-field{border:none !important;background-color:transparent !important}.wrapper.transparent:focus-within .cura-input-field input{border:none !important;outline:none}.wrapper.transparent .helper-text{margin-top:0px}.wrapper:hover:not(.disabled):not(.isLoading):not(.success):not(.error):not(.isFocused):not(.readOnly):not(.transparent) .cura-input-field{border-color:var(--neutral-dark)}.wrapper:hover:not(.disabled):not(.isLoading):not(.success):not(.error):not(.isFocused):not(.readOnly):not(.transparent) .cura-input-field input{color:var(--neutral-dark)}.wrapper:hover:not(.disabled):not(.isLoading):not(.success):not(.error):not(.isFocused):not(.readOnly):not(.transparent) .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper:focus-within:not(.selection) .cura-input-field{border:2px solid var(--info-base) !important;background-color:var(--neutral-purewhite);outline:none}.wrapper:focus-within:not(.selection) .cura-input-field input{color:var(--neutral-black) !important}.wrapper:focus-within.selection .cura-input-field{border-radius:4px 4px 0px 0px}.wrapper.success .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box}.wrapper.success .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.success .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.success .cura-input-field .feedback-icon{padding-left:12px}.wrapper.success .cura-input-field input{color:var(--success-darker) !important}.wrapper.success .cura-input-field input::placeholder{color:var(--success-darker) !important}.wrapper.success:not(.transparent) .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box;border:2px solid var(--success-dark) !important;background-color:var(--success-lighter) !important}.wrapper.success:not(.transparent) .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.success:not(.transparent) .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.success:not(.transparent) .cura-input-field .feedback-icon{padding-left:12px}.wrapper.error .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box}.wrapper.error .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.error .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.error .cura-input-field .feedback-icon{padding-left:12px}.wrapper.error .cura-input-field input{color:var(--error-darker) !important}.wrapper.error .cura-input-field input::placeholder{color:var(--error-darker) !important}.wrapper.error:not(.transparent) .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box;border:2px solid var(--error-dark) !important;background-color:var(--error-lighter) !important}.wrapper.error:not(.transparent) .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.error:not(.transparent) .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.error:not(.transparent) .cura-input-field .feedback-icon{padding-left:12px}.wrapper.small .cura-input-field{width:100%;height:32px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box}.wrapper.small .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:12px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.small .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.small .cura-input-field .feedback-icon{padding-left:12px}.wrapper.small .cura-input-field input{line-height:13px;letter-spacing:0.72px}.wrapper.small .helper-text{margin-top:8px;color:var(--neutral-dark);font-weight:var(--font-weight-regular)}.wrapper.small.label .menu{top:53px}.wrapper.small .menu{top:33px}.wrapper.medium .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box}.wrapper.medium .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.medium .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.medium .cura-input-field .feedback-icon{padding-left:12px}.wrapper.medium .cura-input-field input{line-height:16px;letter-spacing:0.56px}.wrapper.medium .helper-text{margin-top:8px;color:var(--neutral-dark);font-weight:var(--font-weight-regular)}.wrapper.medium.label .menu{top:61px}.wrapper.medium .menu{top:40px}.wrapper.large .cura-input-field{width:100%;height:44px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box}.wrapper.large .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:16px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.large .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.large .cura-input-field .feedback-icon{padding-left:12px}.wrapper.large .helper-text{margin-top:8px;color:var(--neutral-dark);font-weight:var(--font-weight-bold)}.wrapper.large.label .menu{top:69px}.wrapper.large .menu{top:47px}.wrapper.disabled .cura-input-field{background-color:var(--neutral-white);border:2px solid var(--neutral-base)}.wrapper.disabled .cura-input-field input{color:var(--neutral-medium)}.wrapper.disabled .cura-input-field input::placeholder{color:var(--neutral-medium)}.required{color:red}.menu{position:absolute;left:0;right:-1px;background:#fff;border:2px solid var(--neutral-light);border-radius:4px;z-index:1000;max-height:var(--max-height);overflow:hidden;border-top:transparent;align-items:center;scrollbar-color:var(--neutral-medium) var(--neutral-black-20);overflow-y:auto;box-shadow:0px 4px 8px 0px rgba(38, 38, 38, 0.16)}.menu.open{border-radius:0 !important;padding:12px}";
|
|
5136
5137
|
const CuraSelectStyle0 = curaSelectCss;
|
|
5137
5138
|
|
|
5138
5139
|
const CuraSelect = class {
|
|
@@ -5228,6 +5229,7 @@ const CuraSelect = class {
|
|
|
5228
5229
|
this.required = false;
|
|
5229
5230
|
this.searchBehavior = false;
|
|
5230
5231
|
this.caseSensitive = true;
|
|
5232
|
+
this.maxHeight = '285px';
|
|
5231
5233
|
this.isHovered = false;
|
|
5232
5234
|
this.isFocused = false;
|
|
5233
5235
|
this.isOpen = false;
|
|
@@ -5450,13 +5452,13 @@ const CuraSelect = class {
|
|
|
5450
5452
|
document.removeEventListener('click', this.handleClickOutside);
|
|
5451
5453
|
}
|
|
5452
5454
|
render() {
|
|
5453
|
-
return (h(Host, { key: '
|
|
5455
|
+
return (h(Host, { key: 'e9217707e382cf64c4a1d93ed0b07b06fe75cf5b', style: this.styles, role: "combobox", "aria-label": this.label, "aria-required": String(this.required), "aria-disabled": String(this.disabled), "aria-invalid": String(this.status === 'error') }, h("div", { key: 'cd4017145d95d80e0f2df6daaeb96d699d21028e', class: this.getClasses(), onMouseEnter: () => (this.isHovered = true), onMouseLeave: () => (this.isHovered = false), onClick: this.handleClick }, this.label && (h("cura-label", { key: 'b004e05ae6b7998e01ce335323e434a0e4cc5b10', class: "label", weight: "bold", size: this.size === 'large' ? 'small' : 'xsmall', color: this.getColor('label') }, this.label, " ", this.required && h("span", { key: 'c8dc7ee9960208f7fd63803e3894d5c5ee225f84', class: "required" }, "* "))), h("div", { key: '6a4da3e7b43e297f58ccfaaa03dd8ae847bb40fe', class: {
|
|
5454
5456
|
'cura-input-field': true,
|
|
5455
5457
|
'open': this.isOpen,
|
|
5456
|
-
} }, this.renderIcon(), h("input", { key: '
|
|
5458
|
+
} }, this.renderIcon(), h("input", { key: 'af593857db2f30b9cc58b4d3218a8f86d20b8431', type: "text", autocomplete: "off", onFocus: () => (this.isFocused = true), onBlur: () => (this.isFocused = false), onKeyDown: this.handleKeyNavigation, "aria-required": String(this.required), "aria-disabled": String(this.disabled), "aria-invalid": String(this.status === 'error'), onInput: this.handleInputChange, style: this.styles, placeholder: this.placeholder, disabled: this.disabled, required: this.required, value: this.textInput, readonly: this.searchBehavior ? null : true }), h("button", { key: 'e87bafd632d2c91cb1ef5cc9380d8cd6040f39f4', class: "up-down-button" }, h("cura-icon", { key: 'fa20c2690f5b37d9d9ad636389b0f774b4fa24c7', name: this.isOpen ? 'up' : 'down', class: "up-down-icon", color: this.disabled ? 'neutral-dark' : 'primary-base', size: 16, iconset: "default" }))), h("cura-label", { key: '8755ec21f14adefa9e4cbc24a49057b6199b1ff8', class: "helper-text", size: "xsmall", color: this.getColor('text'), weight: this.mode === 'transparent' ? 'bold' : 'regular' }, h("slot", { key: '78e4f029a3d191450c7b3bd8f1a32565bae3ee23' })), this.isOpen && (h("div", { key: '2ba5af7297dd23d088a7fca7f166522769293301', class: {
|
|
5457
5459
|
menu: true,
|
|
5458
5460
|
open: this.isOpen,
|
|
5459
|
-
} }, h("slot", { key: '
|
|
5461
|
+
}, style: { '--max-height': this.maxHeight } }, h("slot", { key: '08e5cbbdd57b42e15d854e4c335f22833075d941', name: "option" }))))));
|
|
5460
5462
|
}
|
|
5461
5463
|
static get formAssociated() { return true; }
|
|
5462
5464
|
get host() { return getElement(this); }
|
|
@@ -5515,6 +5517,142 @@ const CuraSelectOption = class {
|
|
|
5515
5517
|
};
|
|
5516
5518
|
CuraSelectOption.style = CuraSelectOptionStyle0;
|
|
5517
5519
|
|
|
5518
|
-
|
|
5520
|
+
const curaTabsCss = ":host button,:host a{outline:none;box-shadow:none;box-sizing:border-box;display:flex;width:100%;align-items:center;justify-content:center;text-decoration:none !important;font-size:var(--font-size);cursor:pointer;transition:background-color 0.07s linear, box-shadow 0.07s linear, border-color 0.07s linear;border-radius:var(--border-radius);position:relative;background-color:transparent;box-sizing:border-box;border:none;min-width:120px;width:fit-content;display:flex;align-items:center;justify-content:center;border-radius:4px 4px 0 0}:host button:focus,:host a:focus{outline:2px solid #6EA8FF}:host button.border-bottom,:host a.border-bottom{border-bottom:1px solid var(--border-bottom-color)}:host button:not(.disabled,.selected):hover,:host a:not(.disabled,.selected):hover{background-color:var(--background-color-hover)}:host button:not(.disabled,.selected):hover.light,:host a:not(.disabled,.selected):hover.light{border-bottom-color:var(--primary-dark)}:host button:not(.disabled,.selected):hover.dark,:host a:not(.disabled,.selected):hover.dark{border-bottom-color:var(--neutral-purewhite)}:host button.small,:host a.small{padding:calc(var(--cura-spacing-base) * 2px) calc(var(--cura-spacing-base) * 2px)}:host button.medium,:host a.medium{padding:calc(var(--cura-spacing-base) * 3px) calc(var(--cura-spacing-base) * 3px)}:host button.large,:host a.large{padding:calc(var(--cura-spacing-base) * 3px) calc(var(--cura-spacing-base) * 4px)}:host button:focus,:host a:focus{border:2px solid var(--primary-light)}:host button cura-icon,:host a cura-icon{margin-right:calc(var(--cura-spacing-base) * 2px)}:host button.selected,:host a.selected{cursor:pointer;background-color:var(--background-color-selected)}:host button.selected.disabled,:host a.selected.disabled{background-color:var(--background-disabled-selected)}:host button.disabled,:host a.disabled{cursor:not-allowed}";
|
|
5521
|
+
const CuraTabsStyle0 = curaTabsCss;
|
|
5519
5522
|
|
|
5520
|
-
|
|
5523
|
+
const CuraTabs = class {
|
|
5524
|
+
constructor(hostRef) {
|
|
5525
|
+
registerInstance(this, hostRef);
|
|
5526
|
+
this.tabSelect = createEvent(this, "tabSelect", 7);
|
|
5527
|
+
this.name = undefined;
|
|
5528
|
+
this.iconName = undefined;
|
|
5529
|
+
this.selected = false;
|
|
5530
|
+
this.disabled = false;
|
|
5531
|
+
this.borderBottom = true;
|
|
5532
|
+
this.size = 'large';
|
|
5533
|
+
this.colorMode = 'light';
|
|
5534
|
+
this.hovered = false;
|
|
5535
|
+
this.styles = {};
|
|
5536
|
+
}
|
|
5537
|
+
setColors() {
|
|
5538
|
+
const colors = [
|
|
5539
|
+
{ name: '--background-color-selected', theme: this.colorMode === 'light' ? 'primary-base' : 'primary-lighter' },
|
|
5540
|
+
{ name: '--background-color-hover', theme: this.colorMode === 'light' ? 'primary-lighter' : null },
|
|
5541
|
+
{
|
|
5542
|
+
name: '--background-disabled-selected',
|
|
5543
|
+
theme: this.colorMode === 'light' ? 'neutral-pale' : 'neutral-black',
|
|
5544
|
+
},
|
|
5545
|
+
{
|
|
5546
|
+
name: '--border-bottom-color',
|
|
5547
|
+
theme: this.colorMode === 'light' ? 'neutral-base' : 'primary',
|
|
5548
|
+
},
|
|
5549
|
+
];
|
|
5550
|
+
colors.forEach(c => {
|
|
5551
|
+
if (c.theme)
|
|
5552
|
+
this.styles[c.name] = window.CuraAPI.theme.colors.getColor(c.theme);
|
|
5553
|
+
});
|
|
5554
|
+
this.styles = Object.assign({}, this.styles);
|
|
5555
|
+
}
|
|
5556
|
+
computeContentColor() {
|
|
5557
|
+
if (this.disabled)
|
|
5558
|
+
return 'neutral-dark';
|
|
5559
|
+
if (this.colorMode === 'dark') {
|
|
5560
|
+
if (this.hovered && !this.selected) {
|
|
5561
|
+
return 'neutral-purewhite';
|
|
5562
|
+
}
|
|
5563
|
+
return this.selected ? 'neutral-black' : 'primary-lighter';
|
|
5564
|
+
}
|
|
5565
|
+
return this.selected ? 'neutral-purewhite' : 'primary-dark';
|
|
5566
|
+
}
|
|
5567
|
+
updateDynamicStyles() {
|
|
5568
|
+
if (this.colorMode === 'dark' && this.hovered && !this.selected) {
|
|
5569
|
+
this.styles = Object.assign(Object.assign({}, this.styles), { '--border-bottom-color': window.CuraAPI.theme.colors.getColor('neutral-purewhite') });
|
|
5570
|
+
}
|
|
5571
|
+
}
|
|
5572
|
+
getIcon() {
|
|
5573
|
+
if (!this.iconName)
|
|
5574
|
+
return '';
|
|
5575
|
+
const iconSize = this.size === 'large' ? 20 : 16;
|
|
5576
|
+
const iconColor = this.computeContentColor();
|
|
5577
|
+
return h("cura-icon", { name: this.iconName, size: iconSize, color: iconColor });
|
|
5578
|
+
}
|
|
5579
|
+
getClasses() {
|
|
5580
|
+
return {
|
|
5581
|
+
[this.size]: true,
|
|
5582
|
+
[this.colorMode]: true,
|
|
5583
|
+
'selected': this.selected,
|
|
5584
|
+
'disabled': this.disabled,
|
|
5585
|
+
'border-bottom': this.borderBottom,
|
|
5586
|
+
};
|
|
5587
|
+
}
|
|
5588
|
+
connectedCallback() {
|
|
5589
|
+
this.styles = Object.assign(Object.assign({}, this.styles), { '--primary-dark': window.CuraAPI.theme.colors.getColor('primary-dark'), '--neutral-purewhite': window.CuraAPI.theme.colors.getColor('neutral-purewhite'), '--base-spacing': window.CuraAPI.theme.spacing.getSpacing() });
|
|
5590
|
+
this.setColors();
|
|
5591
|
+
}
|
|
5592
|
+
handleMouseEnter() {
|
|
5593
|
+
if (this.disabled)
|
|
5594
|
+
return;
|
|
5595
|
+
this.hovered = true;
|
|
5596
|
+
}
|
|
5597
|
+
handleMouseLeave() {
|
|
5598
|
+
this.hovered = false;
|
|
5599
|
+
}
|
|
5600
|
+
handleClick(e) {
|
|
5601
|
+
if (this.disabled) {
|
|
5602
|
+
e.preventDefault();
|
|
5603
|
+
return;
|
|
5604
|
+
}
|
|
5605
|
+
this.selected = !this.selected;
|
|
5606
|
+
this.tabSelect.emit({ name: this.name });
|
|
5607
|
+
}
|
|
5608
|
+
render() {
|
|
5609
|
+
const labelSize = labelSizes$1[this.size] || labelSizes$1['default'];
|
|
5610
|
+
const labelColor = this.computeContentColor();
|
|
5611
|
+
this.updateDynamicStyles();
|
|
5612
|
+
return (h(Host, { key: '3966968b73a9a51ec26f3206cdb09fbfcb3d3daf', role: "button", "aria-pressed": this.selected, "aria-disabled": this.disabled }, h("button", { key: '00cc6382c635a05c52fd74b3e02e968c2d94cacb', class: this.getClasses(), style: this.styles, onClick: e => this.handleClick(e), disabled: this.disabled, onMouseEnter: this.handleMouseEnter.bind(this), onMouseLeave: this.handleMouseLeave.bind(this) }, this.getIcon(), h("cura-label", { key: 'e193500f156c10cf0442e6f504e19d552c19f849', size: labelSize, color: labelColor, lineHeight: "0", marginBlock: "0" }, h("slot", { key: '8a0ac7c4b2ff4990093d13b4110e370616cf39f4' })))));
|
|
5613
|
+
}
|
|
5614
|
+
static get watchers() { return {
|
|
5615
|
+
"colorMode": ["setColors"]
|
|
5616
|
+
}; }
|
|
5617
|
+
};
|
|
5618
|
+
CuraTabs.style = CuraTabsStyle0;
|
|
5619
|
+
|
|
5620
|
+
const curaTabsGroupCss = ":host{display:flex;gap:var(--gap)}:host(.border-bottom){position:relative}:host(.border-bottom)::after{content:\"\";position:absolute;bottom:0;left:0;right:0;height:1px;background:var(--border-color);z-index:0}::slotted(cura-tabs),::slotted(cura-tabs-transparent){position:relative;z-index:1}";
|
|
5621
|
+
const CuraTabsGroupStyle0 = curaTabsGroupCss;
|
|
5622
|
+
|
|
5623
|
+
const CuraTabsGroup = class {
|
|
5624
|
+
constructor(hostRef) {
|
|
5625
|
+
registerInstance(this, hostRef);
|
|
5626
|
+
this.tabChange = createEvent(this, "tabChange", 7);
|
|
5627
|
+
this.gap = 0;
|
|
5628
|
+
this.borderBottom = true;
|
|
5629
|
+
this.colorMode = 'light';
|
|
5630
|
+
this.styles = {};
|
|
5631
|
+
}
|
|
5632
|
+
handleTabSelect(ev) {
|
|
5633
|
+
this.updateSelectedTab(ev.detail.name);
|
|
5634
|
+
}
|
|
5635
|
+
updateSelectedTab(value) {
|
|
5636
|
+
const tabs = this.host.querySelectorAll('cura-tabs, cura-tabs-transparent, cura-tabs-button');
|
|
5637
|
+
tabs.forEach((tab) => {
|
|
5638
|
+
tab.selected = tab.name === value;
|
|
5639
|
+
});
|
|
5640
|
+
}
|
|
5641
|
+
getClasses() {
|
|
5642
|
+
return {
|
|
5643
|
+
'border-bottom': this.borderBottom,
|
|
5644
|
+
};
|
|
5645
|
+
}
|
|
5646
|
+
connectedCallback() {
|
|
5647
|
+
this.styles = Object.assign(Object.assign({}, this.styles), { '--border-color': window.CuraAPI.theme.colors.getColor(this.colorMode === 'light' ? 'neutral-base' : 'primary-base'), '--gap': `${this.gap}px` });
|
|
5648
|
+
}
|
|
5649
|
+
render() {
|
|
5650
|
+
return (h(Host, { key: 'fb6a6ae52fd5bdfb8c3978a75f26be87479ccafa', role: "tablist", style: this.styles, class: this.getClasses() }, h("slot", { key: 'afca97b27c8359f8236331257e4db41f1332e071' })));
|
|
5651
|
+
}
|
|
5652
|
+
get host() { return getElement(this); }
|
|
5653
|
+
};
|
|
5654
|
+
CuraTabsGroup.style = CuraTabsGroupStyle0;
|
|
5655
|
+
|
|
5656
|
+
export { CuraAccordion as cura_accordion, CuraAccordionItem as cura_accordion_item, CuraAvatar as cura_avatar, CuraDistance as cura_badge_distance, CuraButton as cura_button, CuraButtonTransparent as cura_button_transparent, CuraDropdownSearch as cura_dropdown_search, CuraDropdownSearchCategory as cura_dropdown_search_category, CuraDropdownSearchOption as cura_dropdown_search_option, CuraHeading as cura_heading, CuraIcon as cura_icon, CuraInputText as cura_input_text, CuraLabel as cura_label, CuraLoaderCircle as cura_loader_circle, CuraPageTemplate as cura_page_template, CuraParagraph as cura_paragraph, CuraSelect as cura_select, CuraSelectOption as cura_select_option, CuraTabs as cura_tabs, CuraTabsGroup as cura_tabs_group };
|
|
5657
|
+
|
|
5658
|
+
//# sourceMappingURL=cura-accordion_20.entry.js.map
|