npm - @rededor/cura - Versions diffs - 1.6.1-alpha.8 → 1.7.0 - Mend

@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.

Files changed (206) hide show

package/dist/cjs/cura-checkbox.cjs.entry.js CHANGED Viewed

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-60783089.js');
 const curaForms_definitions = require('./cura-forms.definitions-c164f1b8.js');
-const curaCheckboxCss = "@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}.info.textoverflow-single{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;display:block}.label-wrapper{display:flex;justify-content:start;align-items:center;gap:5px}.label-wrapper.textoverflow-single{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;display:block}.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 curaCheckboxCss = "@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 CuraCheckboxStyle0 = curaCheckboxCss;
 const CuraCheckbox = class {
@@ -43,7 +43,8 @@ const CuraCheckbox = class {
         this.background = 'light';
         this.iconColor = 'dark';
         this.color = 'accent';
-        this.textOverflow = 'none';
+        this.overflowLabel = 'none';
+        this.overflowHelper = 'none';
         this.styles = {};
     }
     sizeHandler() {
@@ -165,7 +166,7 @@ const CuraCheckbox = class {
         return index.h("cura-icon", { class: "icon", name: iconName, size: iconSize, color: iconColor });
     }
     render() {
-        return (index.h(index.Host, { key: 'e21d722715810f05cf3e466e9be5bfd336612b16', role: "checkbox", "aria-checked": this.checked, "aria-disabled": this.disabled, "aria-required": this.required, "aria-invalid": this.status === 'error' }, index.h("div", { key: '2395e186f4ec1af0618bc887d0c363b8f48a4ae1', class: this.getClasses(), style: this.styles, onClick: this.handleClick }, index.h("div", { key: '8448200d67bdc09dddab7c9c2f5da5cb894ff010', class: `info ${this.textOverflow === 'single' ? 'textoverflow-single' : ''}` }, index.h("div", { key: '8b53feb54371634444781ce5d7bc9b62398ec373', class: `label-wrapper ${this.textOverflow === 'single' ? 'textoverflow-single' : ''}` }, index.h("cura-label", { key: '554e0e9d53a28d43b308f7f65555bd691958401a', textOverflow: this.textOverflow, class: "label", weight: "bold", size: this.size === 'large' ? 'medium' : 'xsmall', color: this.assignColor('label') }, this.label), this.required && (index.h("cura-paragraph", { key: 'b1fb3b2604b9012adb03a582f38eeaa46c144017', lineHeight: "0%", marginBlock: "0", color: "error-base" }, "*", ' '))), index.h("cura-label", { key: 'abd1d31bc14d10c624833f298b2d34f80a99d412', textOverflow: this.textOverflow, color: this.assignColor('message'), size: "xsmall", class: "message" }, index.h("slot", { key: '2ffd772eb62811f918e47dbbd5248339b8bbab8f' }))), index.h("div", { key: 'ccb93d0dcbc7c4eba7df0c63e7654eb2a9c4bdf1', class: 'checkbox', tabIndex: this.ontabindex }, index.h("input", { key: '93c5fc6e54828a9691b73a85eff57120aeb39e29', type: "checkbox", name: this.name, value: this.value, disabled: this.disabled, required: this.required, checked: this.checked, indeterminate: this.indeterminate }), this.getIcon()))));
+        return (index.h(index.Host, { key: '2e951be46f80c67ea87aaf1c613e29ae7a1cc856', role: "checkbox", "aria-checked": this.checked, "aria-disabled": this.disabled, "aria-required": this.required, "aria-invalid": this.status === 'error' }, index.h("div", { key: '341a30934dd6660b03e6be161999fad24fb005ef', class: this.getClasses(), style: this.styles, onClick: this.handleClick }, index.h("div", { key: '58f32f6b047d19b8af2468b6007cf2dfb1297476', class: "info" }, index.h("div", { key: 'e23407390368c638e4e8cd9119ad3ccd1767d861', class: "label-wrapper" }, index.h("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 && (index.h("cura-paragraph", { key: '0684b9ab1f517083bc681bd0731aedf6d38c9873', lineHeight: "0%", marginBlock: "0", color: "error-base" }, "*", ' '))), index.h("cura-label", { key: '499419ee720a7c7ba7e42fc8fcebccfb4e0b0c42', textOverflow: this.overflowHelper, color: this.assignColor('message'), size: "xsmall", class: "message" }, index.h("slot", { key: '7c9637fa4a8082f6451851452db1b751218a20ec' }))), index.h("div", { key: '91b0a1f42d65d72aca24ff8a852d3c6f461a9cb7', class: 'checkbox', tabIndex: this.ontabindex }, index.h("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 index.getElement(this); }

package/dist/cjs/cura-checkbox.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"cura-checkbox.entry.cjs.js","mappings":"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","names":["formsSizes","h","Host"],"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 &.textoverflow-single {\n @include truncate-single();\n }\n}\n\n.label-wrapper {\n display: flex;\n justify-content: start;\n align-items: center;\n gap: 5px;\n\n &.textoverflow-single {\n @include truncate-single();\n }\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 Apply text-overflow ellipsis definitions.\n * Default to none\n /\n @Prop({ reflect: true }) textOverflow: '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 ${this.textOverflow === 'single' ? 'textoverflow-single' : ''}`}>\n <div class={`label-wrapper ${this.textOverflow === 'single' ? 'textoverflow-single' : ''}`}>\n <cura-label textOverflow={this.textOverflow} class=\"label\" weight=\"bold\" size={this.size === 'large' ? 'medium' : 'xsmall'} color={this.assignColor('label')}>\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.textOverflow} 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"],"version":3}
1	+ {"file":"cura-checkbox.entry.cjs.js","mappings":";;;;;;;AAAA,MAAM,eAAe,GAAG,0gGAA0gG,CAAC;AACniG,2BAAe,eAAe;;MCQjB,YAAY;;;;;;;;;;;QA6FvB,qBAAgB,GAAG,MAAM,IAAI,CAAC,UAAU,KAAK,MAAM,CAAC;QAEpD,oBAAe,GAAG,MAAM,IAAI,CAAC,SAAS,KAAK,MAAM,CAAC;QAyFlD,gBAAW,GAAG;YACZ,IAAI,IAAI,CAAC,QAAQ;gBAAE,OAAO;YAE1B,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC;YAC3B,IAAI,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC;YAC7B,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;YACxC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,OAAO,EAAE,IAAI,CAAC,OAAO,EAAE,aAAa,EAAE,IAAI,CAAC,aAAa,EAAE,CAAC,CAAC;SACrG,CAAC;uBA1LyD,KAAK;6BAKC,KAAK;sBAKY,SAAS;wBAI9C,KAAK;wBAIL,KAAK;;0BAQJ,CAAC;wBAKO,MAAM;;;oBAaE,QAAQ;0BAK/B,OAAO;yBAKR,MAAM;qBAI5B,QAAQ;6BAU6C,MAAM;8BAUL,MAAM;sBAE1D,EAAE;;IAapB,WAAW;QACT,IAAI,CAAC,MAAM,mCACN,IAAI,CAAC,MAAM,KACd,QAAQ,EAAE,GAAGA,gCAAU,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,IAAI,IAAI,EAC3C,OAAO,EAAE,GAAGA,gCAAU,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,GAAG,IAAI,GAC1C,CAAC;KACH;;;;IAOD,SAAS;QACP,MAAM,MAAM,GAAG;YACb,EAAE,IAAI,EAAE,cAAc,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC,KAAK,OAAO,EAAE;YAC1D,EAAE,IAAI,EAAE,iBAAiB,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC,KAAK,UAAU,EAAE;YAChE,EAAE,IAAI,EAAE,eAAe,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC,KAAK,QAAQ,EAAE;YAC5D,EAAE,IAAI,EAAE,cAAc,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC,KAAK,OAAO,EAAE;YAC1D,EAAE,IAAI,EAAE,aAAa,EAAE,UAAU,EAAE,WAAW,EAAE;YAChD,EAAE,IAAI,EAAE,cAAc,EAAE,UAAU,EAAE,YAAY,EAAE;YAClD,EAAE,IAAI,EAAE,mBAAmB,EAAE,UAAU,EAAE,iBAAiB,EAAE;YAC5D,EAAE,IAAI,EAAE,gBAAgB,EAAE,UAAU,EAAE,cAAc,EAAE;YACtD,EAAE,IAAI,EAAE,gBAAgB,EAAE,UAAU,EAAE,cAAc,EAAE;YACtD,EAAE,IAAI,EAAE,iBAAiB,EAAE,UAAU,EAAE,eAAe,EAAE;YACxD,EAAE,IAAI,EAAE,iBAAiB,EAAE,UAAU,EAAE,eAAe,EAAE;YACxD,EAAE,IAAI,EAAE,8BAA8B,EAAE,UAAU,EAAE,IAAI,CAAC,gBAAgB,EAAE,GAAG,cAAc,GAAG,eAAe,EAAE;YAChH,EAAE,IAAI,EAAE,+BAA+B,EAAE,UAAU,EAAE,IAAI,CAAC,gBAAgB,EAAE,GAAG,cAAc,GAAG,gBAAgB,EAAE;YAClH,EAAE,IAAI,EAAE,mCAAmC,EAAE,UAAU,EAAE,IAAI,CAAC,gBAAgB,EAAE,GAAG,eAAe,GAAG,mBAAmB,EAAE;YAC1H,EAAE,IAAI,EAAE,+BAA+B,EAAE,UAAU,EAAE,IAAI,CAAC,gBAAgB,EAAE,GAAG,eAAe,GAAG,eAAe,EAAE;YAClH,EAAE,IAAI,EAAE,+BAA+B,EAAE,UAAU,EAAE,IAAI,CAAC,gBAAgB,EAAE,GAAG,gBAAgB,GAAG,cAAc,EAAE;YAClH,EAAE,IAAI,EAAE,6BAA6B,EAAE,UAAU,EAAE,IAAI,CAAC,gBAAgB,EAAE,GAAG,cAAc,GAAG,cAAc,EAAE;YAC9G,EAAE,IAAI,EAAE,kCAAkC,EAAE,UAAU,EAAE,IAAI,CAAC,gBAAgB,EAAE,GAAG,mBAAmB,GAAG,cAAc,EAAE;YACxH,EAAE,IAAI,EAAE,+BAA+B,EAAE,UAAU,EAAE,IAAI,CAAC,gBAAgB,EAAE,GAAG,cAAc,GAAG,gBAAgB,EAAE;YAClH,EAAE,IAAI,EAAE,wBAAwB,EAAE,UAAU,EAAE,IAAI,CAAC,gBAAgB,EAAE,GAAG,cAAc,GAAG,iBAAiB,EAAE;YAC5G,EAAE,IAAI,EAAE,qBAAqB,EAAE,UAAU,EAAE,IAAI,CAAC,gBAAgB,EAAE,GAAG,cAAc,GAAG,cAAc,EAAE;YACtG,EAAE,IAAI,EAAE,sBAAsB,EAAE,UAAU,EAAE,IAAI,CAAC,gBAAgB,EAAE,GAAG,YAAY,GAAG,eAAe,EAAE;YACtG,EAAE,IAAI,EAAE,mBAAmB,EAAE,UAAU,EAAE,IAAI,CAAC,gBAAgB,EAAE,GAAG,YAAY,GAAG,YAAY,EAAE;SACjG,CAAC;QAEF,MAAM,CAAC,OAAO,CAAC,KAAK;YAClB,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC;SAClF,CAAC,CAAC;QACH,IAAI,CAAC,MAAM,qBAAQ,IAAI,CAAC,MAAM,CAAE,CAAC;KAClC;IAED,iBAAiB;QACf,IAAI,CAAC,WAAW,EAAE,CAAC;QACnB,IAAI,CAAC,SAAS,EAAE,CAAC;KAClB;;;;IAKD,sBAAsB,CAAC,IAA2B;QAChD,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC;KAC7B;;;;IAKD,wBAAwB,CAAC,KAAkE;QACzF,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC,KAAK,CAAC;QACzB,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC;QAC7B,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC,aAAa,CAAC;QACzC,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;KACzC;;;;IAKD,iBAAiB;QACf,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC;QAChB,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;QACrB,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC;QAC3B,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,EAAE,CAAC,CAAC;QAC/B,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;KACzC;;;;IAKD,oBAAoB,CAAC,QAAiB;QACpC,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;KAC1B;IAWD,UAAU;QACR,MAAM,OAAO,GAAG,EAAE,CAAC;QACnB,OAAO,CAAC,WAAW,CAAC,GAAG,IAAI,CAAC;QAC5B,OAAO,CAAC,SAAS,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC;QAClC,OAAO,CAAC,UAAU,CAAC,GAAG,IAAI,CAAC,QAAQ,CAAC;QACpC,OAAO,CAAC,IAAI,CAAC,UAAU,CAAC,GAAG,IAAI,CAAC;QAChC,OAAO,CAAC,eAAe,CAAC,GAAG,IAAI,CAAC,aAAa,CAAC;QAC9C,OAAO,CAAC,UAAU,CAAC,GAAG,IAAI,CAAC,QAAQ,KAAK,OAAO,CAAC;QAChD,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,GAAG,IAAI,CAAC;QAE5B,OAAO,OAAO,CAAC;KAChB;;;;;IAQD,WAAW,CAAC,IAAkC;QAC5C,IAAI,IAAI,CAAC,QAAQ;YAAE,OAAO,IAAI,CAAC,gBAAgB,EAAE,GAAG,cAAc,GAAG,cAAc,CAAC;QAEpF,MAAM,YAAY,GAAG;YACnB,OAAO,EAAE;gBACP,IAAI,EAAE,cAAc;gBACpB,KAAK,EAAE,IAAI,CAAC,gBAAgB,EAAE,GAAG,iBAAiB,GAAG,gBAAgB;gBACrE,OAAO,EAAE,IAAI,CAAC,gBAAgB,EAAE,GAAG,cAAc,GAAG,cAAc;aACnE;YACD,KAAK,EAAE;gBACL,IAAI,EAAE,YAAY;gBAClB,KAAK,EAAE,IAAI,CAAC,gBAAgB,EAAE,GAAG,eAAe,GAAG,gBAAgB;gBACnE,OAAO,EAAE,IAAI,CAAC,gBAAgB,EAAE,GAAG,YAAY,GAAG,YAAY;aAC/D;YACD,OAAO,EAAE;gBACP,IAAI,EAAE,IAAI,CAAC,eAAe,EAAE,GAAG,eAAe,GAAG,mBAAmB;gBACpE,KAAK,EAAE,IAAI,CAAC,gBAAgB,EAAE,GAAG,eAAe,GAAG,eAAe;gBAClE,OAAO,EAAE,IAAI,CAAC,gBAAgB,EAAE,GAAG,iBAAiB,GAAG,cAAc;aACtE;SACF,CAAC;QAEF,OAAO,YAAY,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,CAAC;KACxC;;;;IAKD,OAAO;QACL,MAAM,QAAQ,GAAG,IAAI,CAAC,aAAa,GAAG,OAAO,GAAG,OAAO,CAAC;QACxD,MAAM,SAAS,GAAG,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC;QAC3C,MAAM,QAAQ,GAAG,IAAI,CAAC,IAAI,KAAK,OAAO,GAAG,EAAE,GAAG,OAAO,CAAC;QAEtD,OAAOC,uBAAW,KAAK,EAAC,MAAM,EAAC,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,SAAS,GAAc,CAAC;KAC/F;IAED,MAAM;QACJ,QACEA,QAACC,UAAI,qDAAC,IAAI,EAAC,UAAU,kBAAe,IAAI,CAAC,OAAO,mBAAiB,IAAI,CAAC,QAAQ,mBAAiB,IAAI,CAAC,QAAQ,kBAAgB,IAAI,CAAC,MAAM,KAAK,OAAO,IACjJD,kEAAK,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,MAAM,EAAE,OAAO,EAAE,IAAI,CAAC,WAAW,IAC1EA,kEAAK,KAAK,EAAC,MAAM,IACfA,kEAAK,KAAK,EAAC,eAAe,IACxBA,yEACE,YAAY,EAAE,IAAI,CAAC,aAAa,EAChC,KAAK,EAAE,QAAQ,IAAI,CAAC,aAAa,KAAK,QAAQ,GAAG,sBAAsB,GAAG,EAAE,EAAE,EAC9E,MAAM,EAAC,MAAM,EACb,IAAI,EAAE,IAAI,CAAC,IAAI,KAAK,OAAO,GAAG,QAAQ,GAAG,QAAQ,EACjD,KAAK,EAAE,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,IAE/B,IAAI,CAAC,KAAK,CACA,EACZ,IAAI,CAAC,QAAQ,KACZA,6EAAgB,UAAU,EAAC,IAAI,EAAC,WAAW,EAAC,GAAG,EAAC,KAAK,EAAC,YAAY,SAC9D,GAAG,CACU,CAClB,CACG,EACNA,yEAAY,YAAY,EAAE,IAAI,CAAC,cAAc,EAAE,KAAK,EAAE,IAAI,CAAC,WAAW,CAAC,SAAS,CAAC,EAAE,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAC,SAAS,IAC9GA,oEAAa,CACF,CACT,EACNA,kEAAK,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,IAAI,CAAC,UAAU,IAC/CA,oEACE,IAAI,EAAC,UAAU,EACf,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,aAAa,EAAE,IAAI,CAAC,aAAa,GACjC,EACD,IAAI,CAAC,OAAO,EAAE,CACX,CACF,CACD,EACP;KACH;;;;;;;;;;;;;;","names":["formsSizes","h","Host"],"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"],"version":3}

package/dist/cjs/cura-display.cjs.entry.js CHANGED Viewed

@@ -69,7 +69,7 @@ const CuraDisplay = class {
         return tags[`${this.level}`] || tags['default'];
     }
     render() {
-        return (index.h(index.Host, { key: 'd06d5fe13d7e9b52f2c4ba2da4367f5f96b3bd45', style: this.hostCSSProperties(), role: "heading", "aria-level": this.level }, this.getHeadingTag()));
+        return (index.h(index.Host, { key: '264f7e93aac5ecb7a775c6e505f230518e3959f4', style: this.hostCSSProperties(), role: "heading", "aria-level": this.level }, this.getHeadingTag()));
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/cura-icons-view.cjs.entry.js CHANGED Viewed

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-60783089.js');
 const curaIcon_definitions = require('./cura-icon.definitions-5223028b.js');
-const iconsetdefaulticons = ["360", "accessibility", "accessibility2", "accessibility3", "accessibility4", "addUser", "airdrop", "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", "contacts", "currency", "delete", "desktop", "doc", "down", "download", "drug", "duplicate", "edit", "elevator", "exam", "examDoc", "expand", "facebook", "fileBmp", "fileJpg", "filePdf", "filePng", "fileUpload", "fileXls", "filter", "fullscreen", "gallery", "geotag", "geotagUnity", "geotagUnityGroup", "google", "graph", "healthPlan", "heart", "height", "height2", "home", "horizontalList", "imageUp", "infoCircle", "instagram", "key", "lamp", "language", "language2", "languageEN", "languagePT", "lattes", "left", "like", "link", "linkExternal", "linkedin", "list", "login", "logout", "mail", "maintenance", "medDoc", "medEspec", "medImg", "medUser", "medical", "menuHamburguer", "menuKebab", "menuMeatballs", "mic", "micOff", "minus", "minusCircle", "minusSquare", "mobile", "news", "notification", "npsDeslike", "npsHate", "npsLike", "npsLove", "npsNeutral", "order", "parking", "partner", "phone", "play", "plus", "plusCircle", "plusSquare", "print", "profile", "profileCircle", "questionCircle", "questionSquare", "range", "reload", "ribbon", "right", "schedule", "scheduleCancel", "scheduleCheck", "scheduleHistorico", "search", "secure", "share", "siren", "sound", "soundOff", "subItem", "swap", "target", "team", "telegram", "twitter", "unLink", "unSecure", "unity", "unlike", "up", "upload", "verticalList", "viewFalse", "viewTrue", "weight", "whatsapp", "wifi", "wifiOff", "youtube", "zoomIn", "zoomOut"];
+const iconsetdefaulticons = ["360", "accessibility", "accessibility2", "accessibility3", "accessibility4", "addUser", "airdrop", "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", "contacts", "currency", "delete", "desktop", "doc", "down", "download", "drug", "duplicate", "edit", "elevator", "exam", "examDoc", "expand", "facebook", "fileBmp", "fileJpg", "filePdf", "filePng", "fileUpload", "fileXls", "filter", "fullscreen", "gallery", "geotag", "geotagUnity", "geotagUnityGroup", "google", "graph", "healthPlan", "heart", "height", "height2", "home", "horizontalList", "imageUp", "infoCircle", "instagram", "key", "lamp", "language", "language2", "languageEN", "languagePT", "lattes", "left", "like", "link", "linkExternal", "linkedin", "list", "login", "logout", "mail", "maintenance", "medDoc", "medEspec", "medImg", "medUser", "medical", "menuHamburguer", "menuKebab", "menuMeatballs", "mic", "micOff", "minus", "minusCircle", "minusSquare", "mobile", "news", "notification", "npsDeslike", "npsHate", "npsLike", "npsLove", "npsNeutral", "order", "parking", "partner", "phone", "play", "plus", "plusCircle", "plusSquare", "print", "profile", "profileCircle", "questionCircle", "questionSquare", "range", "reload", "ribbon", "right", "schedule", "scheduleCancel", "scheduleCheck", "scheduleHistorico", "search", "secure", "share", "siren", "sound", "soundOff", "subItem", "swap", "target", "team", "telegram", "twitter", "unLink", "unSecure", "unity", "unlike", "up", "upload", "vaccine", "verticalList", "viewFalse", "viewTrue", "weight", "whatsapp", "wifi", "wifiOff", "youtube", "zoomIn", "zoomOut"];
 const curaIconsViewCss = ":host{display:block;padding:24px;font-family:\"Roboto\", Arial, Helvetica, sans-serif}.iconDetail{display:block}.iconSizes{display:flex;align-items:center}.iconSizes .size{display:flex;flex-direction:column;text-align:center;align-items:center;margin-right:9px;padding:8px}.iconSizes .size:last-child{margin-right:0}.iconSizes .size span{font-size:10px;margin:8px 0}.iconSizes.invert{margin-top:12px}.iconSizes.invert .size{background-color:#2d2d2d;color:#F6F6F6;border-radius:3px}.icons{margin-top:28px;display:flex;flex-wrap:wrap;position:relative}.icons .icon{position:relative;padding:4px;cursor:pointer;opacity:0.6;transition:opacity 0.2s linear;width:105px;display:flex;flex-direction:column;text-align:center;align-items:center;margin-bottom:16px;box-sizing:border-box;}.icons .icon cura-label{margin-top:8px}.icons .icon cura-paragraph{margin-top:4px}";
 const CuraIconsViewStyle0 = curaIconsViewCss;

package/dist/cjs/cura-icons-view.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"cura-icons-view.entry.cjs.js","mappings":";;;;;;;AAAA,4BAAe,CAAC,KAAK,EAAC,eAAe,EAAC,gBAAgB,EAAC,gBAAgB,EAAC,gBAAgB,EAAC,SAAS,EAAC,SAAS,EAAC,aAAa,EAAC,eAAe,EAAC,WAAW,EAAC,iBAAiB,EAAC,WAAW,EAAC,iBAAiB,EAAC,YAAY,EAAC,kBAAkB,EAAC,SAAS,EAAC,eAAe,EAAC,QAAQ,EAAC,SAAS,EAAC,SAAS,EAAC,UAAU,EAAC,YAAY,EAAC,UAAU,EAAC,KAAK,EAAC,QAAQ,EAAC,SAAS,EAAC,YAAY,EAAC,OAAO,EAAC,YAAY,EAAC,aAAa,EAAC,aAAa,EAAC,OAAO,EAAC,OAAO,EAAC,aAAa,EAAC,UAAU,EAAC,QAAQ,EAAC,UAAU,EAAC,UAAU,EAAC,QAAQ,EAAC,SAAS,EAAC,KAAK,EAAC,MAAM,EAAC,UAAU,EAAC,MAAM,EAAC,WAAW,EAAC,MAAM,EAAC,UAAU,EAAC,MAAM,EAAC,SAAS,EAAC,QAAQ,EAAC,UAAU,EAAC,SAAS,EAAC,SAAS,EAAC,SAAS,EAAC,SAAS,EAAC,YAAY,EAAC,SAAS,EAAC,QAAQ,EAAC,YAAY,EAAC,SAAS,EAAC,QAAQ,EAAC,aAAa,EAAC,kBAAkB,EAAC,QAAQ,EAAC,OAAO,EAAC,YAAY,EAAC,OAAO,EAAC,QAAQ,EAAC,SAAS,EAAC,MAAM,EAAC,gBAAgB,EAAC,SAAS,EAAC,YAAY,EAAC,WAAW,EAAC,KAAK,EAAC,MAAM,EAAC,UAAU,EAAC,WAAW,EAAC,YAAY,EAAC,YAAY,EAAC,QAAQ,EAAC,MAAM,EAAC,MAAM,EAAC,MAAM,EAAC,cAAc,EAAC,UAAU,EAAC,MAAM,EAAC,OAAO,EAAC,QAAQ,EAAC,MAAM,EAAC,aAAa,EAAC,QAAQ,EAAC,UAAU,EAAC,QAAQ,EAAC,SAAS,EAAC,SAAS,EAAC,gBAAgB,EAAC,WAAW,EAAC,eAAe,EAAC,KAAK,EAAC,QAAQ,EAAC,OAAO,EAAC,aAAa,EAAC,aAAa,EAAC,QAAQ,EAAC,MAAM,EAAC,cAAc,EAAC,YAAY,EAAC,SAAS,EAAC,SAAS,EAAC,SAAS,EAAC,YAAY,EAAC,OAAO,EAAC,SAAS,EAAC,SAAS,EAAC,OAAO,EAAC,MAAM,EAAC,MAAM,EAAC,YAAY,EAAC,YAAY,EAAC,OAAO,EAAC,SAAS,EAAC,eAAe,EAAC,gBAAgB,EAAC,gBAAgB,EAAC,OAAO,EAAC,QAAQ,EAAC,QAAQ,EAAC,OAAO,EAAC,UAAU,EAAC,gBAAgB,EAAC,eAAe,EAAC,mBAAmB,EAAC,QAAQ,EAAC,QAAQ,EAAC,OAAO,EAAC,OAAO,EAAC,OAAO,EAAC,UAAU,EAAC,SAAS,EAAC,MAAM,EAAC,QAAQ,EAAC,MAAM,EAAC,UAAU,EAAC,SAAS,EAAC,QAAQ,EAAC,UAAU,EAAC,OAAO,EAAC,QAAQ,EAAC,IAAI,EAAC,QAAQ,EAAC,cAAc,EAAC,WAAW,EAAC,UAAU,EAAC,QAAQ,EAAC,UAAU,EAAC,MAAM,EAAC,SAAS,EAAC,SAAS,EAAC,QAAQ,EAAC,SAAS,CAAC;;~~ACArtD~~,MAAM,gBAAgB,GAAG,61BAA61B,CAAC;AACv3B,4BAAe,gBAAgB;;MCQlB,aAAa;;;QAExB,UAAK,GAAG,MAAM,CAAC,IAAI,CAACA,8BAAS,CAAC,CAAC,MAAM,CAAC,GAAG,IAAI,GAAG,KAAK,SAAS,CAAC,CAAC;QAChE,WAAM,GAAG,CAAC,SAAS,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,SAAS,EAAE,SAAS,CAAC,CAAC;QAO9F,gBAAW,GAAG,CAAC,IAAI;YACjB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;SACtB,CAAA;wBARmB,mBAAmB,CAAC,CAAC,CAAC;;IAE1C,iBAAiB;QACf,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,EAAE,CAAC,CAAC;KACtC;IAMD,MAAM;QACJ,QACEC,QAACC,UAAI,uDACHD,kEAAK,KAAK,EAAC,YAAY,IACrBA,2EAAc,IAAI,EAAC,OAAO,kBAAc,QAAQ,cAAOA,kEAAK,IAAI,CAAC,QAAQ,CAAM,CAAe,EAC9FA,kEAAK,KAAK,EAAC,WAAW,IAClB,IAAI,CAAC,KAAK,CAAC,GAAG,CAAE,IAAI,IACpBA,iBAAK,KAAK,EAAC,MAAM,IACfA,uBAAW,IAAI,EAAE,IAAI,CAAC,QAAQ,EAAE,IAAI,EAAE,IAAI,GAAc,EACxDA,sBAAQ,IAAI,CAAS,CACjB,CACP,CACG,EACNA,kEAAK,KAAK,EAAC,kBAAkB,IACzB,IAAI,CAAC,KAAK,CAAC,GAAG,CAAE,IAAI,IACpBA,iBAAK,KAAK,EAAC,MAAM,IACfA,uBAAW,IAAI,EAAE,IAAI,CAAC,QAAQ,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAC,eAAe,GAAa,EAC9EA,sBAAQ,IAAI,CAAS,CACjB,CACP,CACG,CACF,EACNA,kEAAK,KAAK,EAAC,OAAO,IACd,mBAAmB,CAAC,GAAG,CAAC,IAAI,IAC5BA,iBAAK,KAAK,EAAE,EAAC,IAAI,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,KAAK,IAAI,CAAC,QAAQ,EAAE,EAAE,OAAO,EAAE,MAAM,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAChGA,uBACE,IAAI,EAAE,IAAI,EACV,IAAI,EAAC,IAAI,EACT,KAAK,EAAE,IAAI,KAAK,IAAI,CAAC,QAAQ,GAAG,aAAa,GAAG,cAAc,GAAc,EAC9EA,wBACE,IAAI,EAAC,QAAQ,EACb,MAAM,EAAE,IAAI,KAAK,IAAI,CAAC,QAAQ,GAAG,MAAM,GAAG,SAAS,EACnD,KAAK,EAAE,IAAI,KAAK,IAAI,CAAC,QAAQ,GAAG,aAAa,GAAG,cAAc,IAAG,IAAI,CAAc,CACjF,CACP,CACG,CACD,EACP;KACH;;;;;;","names":["iconSizes","h","Host"],"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\",\"accessibility2\",\"accessibility3\",\"accessibility4\",\"addUser\",\"airdrop\",\"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\",\"contacts\",\"currency\",\"delete\",\"desktop\",\"doc\",\"down\",\"download\",\"drug\",\"duplicate\",\"edit\",\"elevator\",\"exam\",\"examDoc\",\"expand\",\"facebook\",\"fileBmp\",\"fileJpg\",\"filePdf\",\"filePng\",\"fileUpload\",\"fileXls\",\"filter\",\"fullscreen\",\"gallery\",\"geotag\",\"geotagUnity\",\"geotagUnityGroup\",\"google\",\"graph\",\"healthPlan\",\"heart\",\"height\",\"height2\",\"home\",\"horizontalList\",\"imageUp\",\"infoCircle\",\"instagram\",\"key\",\"lamp\",\"language\",\"language2\",\"languageEN\",\"languagePT\",\"lattes\",\"left\",\"like\",\"link\",\"linkExternal\",\"linkedin\",\"list\",\"login\",\"logout\",\"mail\",\"maintenance\",\"medDoc\",\"medEspec\",\"medImg\",\"medUser\",\"medical\",\"menuHamburguer\",\"menuKebab\",\"menuMeatballs\",\"mic\",\"micOff\",\"minus\",\"minusCircle\",\"minusSquare\",\"mobile\",\"news\",\"notification\",\"npsDeslike\",\"npsHate\",\"npsLike\",\"npsLove\",\"npsNeutral\",\"order\",\"parking\",\"partner\",\"phone\",\"play\",\"plus\",\"plusCircle\",\"plusSquare\",\"print\",\"profile\",\"profileCircle\",\"questionCircle\",\"questionSquare\",\"range\",\"reload\",\"ribbon\",\"right\",\"schedule\",\"scheduleCancel\",\"scheduleCheck\",\"scheduleHistorico\",\"search\",\"secure\",\"share\",\"siren\",\"sound\",\"soundOff\",\"subItem\",\"swap\",\"target\",\"team\",\"telegram\",\"twitter\",\"unLink\",\"unSecure\",\"unity\",\"unlike\",\"up\",\"upload\",\"verticalList\",\"viewFalse\",\"viewTrue\",\"weight\",\"whatsapp\",\"wifi\",\"wifiOff\",\"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 align-items: center;\n margin-right: 9px;\n padding: 8px;\n\n &:last-child { margin-right: 0; }\n span {\n font-size: 10px;\n margin: 8px 0;\n }\n }\n\n &.invert {\n margin-top: 12px;\n\n .size {\n background-color: #2d2d2d;\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 width: 105px;\n display: flex;\n flex-direction: column;\n text-align: center;\n align-items: center;\n margin-bottom: 16px;\n box-sizing: border-box;\n cura-label {\n margin-top: 8px;\n }\n cura-paragraph {\n margin-top: 4px;\n }\n /* &.selected {\n transform: scale(1.2);\n } */\n }\n}\n\n","import { Component, Host, h, State } from '@stencil/core';\nimport iconsetdefaulticons from '../../assets/icons/iconset-default-list';\nimport { iconSizes } from '../cura-icon/cura-icon.definitions';\n\n@Component({\n tag: 'cura-icons-view',\n styleUrl: 'cura-icons-view.scss',\n shadow: true,\n})\nexport class CuraIconsView {\n\n sizes = Object.keys(iconSizes).filter(key => key !== 'default');\n colors = ['primary', 'secondary', 'accent', 'info', 'warning', 'error', 'success', 'neutral'];\n @State() selected = iconsetdefaulticons[0];\n\n connectedCallback() {\n this.sizes.unshift(this.sizes.pop());\n }\n\n setSelected = (icon) => {\n this.selected = icon;\n }\n\n render() {\n return (\n <Host>\n <div class=\"iconDetail\">\n <cura-heading size=\"small\" margin-block=\"0 24px\">Icon: <b>{ this.selected }</b></cura-heading>\n <div class=\"iconSizes\">\n { this.sizes.map( size =>\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 <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>\n <div class=\"icons\">\n { iconsetdefaulticons.map(icon =>\n <div class={{icon: true, selected: icon === this.selected }} onClick={() => this.setSelected(icon)}>\n <cura-icon\n name={icon}\n size=\"32\"\n color={icon === this.selected ? 'accent-dark' : 'neutral-dark'}></cura-icon>\n <cura-label\n size=\"xsmall\"\n weight={icon === this.selected ? 'bold' : 'regular'}\n color={icon === this.selected ? 'accent-dark' : 'neutral-dark'}>{icon}</cura-label>\n </div>\n )}\n </div>\n </Host>\n );\n }\n\n}\n"],"version":3}
1	+ {"file":"cura-icons-view.entry.cjs.js","mappings":"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","names":["iconSizes","h","Host"],"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\",\"accessibility2\",\"accessibility3\",\"accessibility4\",\"addUser\",\"airdrop\",\"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\",\"contacts\",\"currency\",\"delete\",\"desktop\",\"doc\",\"down\",\"download\",\"drug\",\"duplicate\",\"edit\",\"elevator\",\"exam\",\"examDoc\",\"expand\",\"facebook\",\"fileBmp\",\"fileJpg\",\"filePdf\",\"filePng\",\"fileUpload\",\"fileXls\",\"filter\",\"fullscreen\",\"gallery\",\"geotag\",\"geotagUnity\",\"geotagUnityGroup\",\"google\",\"graph\",\"healthPlan\",\"heart\",\"height\",\"height2\",\"home\",\"horizontalList\",\"imageUp\",\"infoCircle\",\"instagram\",\"key\",\"lamp\",\"language\",\"language2\",\"languageEN\",\"languagePT\",\"lattes\",\"left\",\"like\",\"link\",\"linkExternal\",\"linkedin\",\"list\",\"login\",\"logout\",\"mail\",\"maintenance\",\"medDoc\",\"medEspec\",\"medImg\",\"medUser\",\"medical\",\"menuHamburguer\",\"menuKebab\",\"menuMeatballs\",\"mic\",\"micOff\",\"minus\",\"minusCircle\",\"minusSquare\",\"mobile\",\"news\",\"notification\",\"npsDeslike\",\"npsHate\",\"npsLike\",\"npsLove\",\"npsNeutral\",\"order\",\"parking\",\"partner\",\"phone\",\"play\",\"plus\",\"plusCircle\",\"plusSquare\",\"print\",\"profile\",\"profileCircle\",\"questionCircle\",\"questionSquare\",\"range\",\"reload\",\"ribbon\",\"right\",\"schedule\",\"scheduleCancel\",\"scheduleCheck\",\"scheduleHistorico\",\"search\",\"secure\",\"share\",\"siren\",\"sound\",\"soundOff\",\"subItem\",\"swap\",\"target\",\"team\",\"telegram\",\"twitter\",\"unLink\",\"unSecure\",\"unity\",\"unlike\",\"up\",\"upload\",\"vaccine\",\"verticalList\",\"viewFalse\",\"viewTrue\",\"weight\",\"whatsapp\",\"wifi\",\"wifiOff\",\"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 align-items: center;\n margin-right: 9px;\n padding: 8px;\n\n &:last-child { margin-right: 0; }\n span {\n font-size: 10px;\n margin: 8px 0;\n }\n }\n\n &.invert {\n margin-top: 12px;\n\n .size {\n background-color: #2d2d2d;\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 width: 105px;\n display: flex;\n flex-direction: column;\n text-align: center;\n align-items: center;\n margin-bottom: 16px;\n box-sizing: border-box;\n cura-label {\n margin-top: 8px;\n }\n cura-paragraph {\n margin-top: 4px;\n }\n /* &.selected {\n transform: scale(1.2);\n } */\n }\n}\n\n","import { Component, Host, h, State } from '@stencil/core';\nimport iconsetdefaulticons from '../../assets/icons/iconset-default-list';\nimport { iconSizes } from '../cura-icon/cura-icon.definitions';\n\n@Component({\n tag: 'cura-icons-view',\n styleUrl: 'cura-icons-view.scss',\n shadow: true,\n})\nexport class CuraIconsView {\n\n sizes = Object.keys(iconSizes).filter(key => key !== 'default');\n colors = ['primary', 'secondary', 'accent', 'info', 'warning', 'error', 'success', 'neutral'];\n @State() selected = iconsetdefaulticons[0];\n\n connectedCallback() {\n this.sizes.unshift(this.sizes.pop());\n }\n\n setSelected = (icon) => {\n this.selected = icon;\n }\n\n render() {\n return (\n <Host>\n <div class=\"iconDetail\">\n <cura-heading size=\"small\" margin-block=\"0 24px\">Icon: <b>{ this.selected }</b></cura-heading>\n <div class=\"iconSizes\">\n { this.sizes.map( size =>\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 <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>\n <div class=\"icons\">\n { iconsetdefaulticons.map(icon =>\n <div class={{icon: true, selected: icon === this.selected }} onClick={() => this.setSelected(icon)}>\n <cura-icon\n name={icon}\n size=\"32\"\n color={icon === this.selected ? 'accent-dark' : 'neutral-dark'}></cura-icon>\n <cura-label\n size=\"xsmall\"\n weight={icon === this.selected ? 'bold' : 'regular'}\n color={icon === this.selected ? 'accent-dark' : 'neutral-dark'}>{icon}</cura-label>\n </div>\n )}\n </div>\n </Host>\n );\n }\n\n}\n"],"version":3}

package/dist/cjs/cura-modal.cjs.entry.js CHANGED Viewed

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-60783089.js');
-const curaModalCss = ":host{display:block}.modal{position:fixed;height:100%;width:100%;top:var(--top-offset);bottom:var(--bottom-offset);left:var(--left-offset);right:var(--right-offset);z-index:-1;margin-top:var(--offset-top)}.modal.open{z-index:var(--zIndex)}.modal.open .backdrop,.modal.open .wrapper{opacity:1;visibility:visible;animation:fadeIn 0.3s ease-out}.container{display:flex;align-items:center;justify-content:center}.backdrop,.wrapper{opacity:0;visibility:hidden;transition:opacity 0.3s ease, visibility 0.3s ease}.backdrop{background-color:var(--background-color);z-index:calc(var(--zIndex) - 10);animation:fadeIn 0.3s ease-out}.wrapper{position:fixed;background-color:var(--neutral-white);border:2px solid var(--neutral-light);border-radius:calc(var(--cura-spacing-base) * 3px);max-width:600px;min-width:200px;padding:calc(calc(var(--cura-spacing-base) * 1px) / 2) calc(var(--cura-spacing-base) * 4px) calc(var(--cura-spacing-base) * 4px) calc(var(--cura-spacing-base) * 4px);z-index:var(--zIndex);box-shadow:0px 8px 16px 0px var(--neutral-black-shadow-4, rgba(38, 38, 38, 0.12));transform:scale(0.95);transition:transform 0.3s ease-out, opacity 0.3s ease, visibility 0.3s ease}.wrapper ::slotted(*){max-height:80vh;overflow:auto;padding-right:calc(var(--cura-spacing-base) * 5px)}.modal.open .wrapper{transform:scale(1);opacity:1;visibility:visible}.close{justify-self:flex-end;padding-top:calc(var(--cura-spacing-base) * 4px);background:none;border:none;cursor:pointer}.close.mobile{display:none}.close.desktop{display:flex;padding:0;margin-right:-8px}@media (max-width: 768px){.wrapper{position:fixed;bottom:0px;width:80%;padding-top:calc(var(--cura-spacing-base) * 4px);padding-bottom:0px;border-radius:calc(var(--cura-spacing-base) * 3px) calc(var(--cura-spacing-base) * 3px) 0px 0px;border-bottom:none}.close{align-items:center;border-top:1px dashed var(--neutral-light);margin-top:calc(var(--cura-spacing-base) * 4px);padding:calc(var(--cura-spacing-base) * 2px) 0px;justify-content:center;width:100%}.close.mobile{display:flex;gap:calc(var(--cura-spacing-base) * 2px)}.close.desktop{display:none}}@keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes fadeOut{from{opacity:1}to{opacity:0}}";
+const curaModalCss = ":host{display:block}.modal{position:fixed;height:100%;width:100%;top:var(--top-offset);bottom:var(--bottom-offset);left:var(--left-offset);right:var(--right-offset);z-index:-1;margin-top:var(--offset-top)}.modal.open{z-index:var(--zIndex)}.modal.open .backdrop,.modal.open .wrapper{opacity:1;visibility:visible;animation:fadeIn 0.3s ease-out}.container{display:flex;align-items:center;justify-content:center}.backdrop,.wrapper{opacity:0;visibility:hidden;transition:opacity 0.3s ease, visibility 0.3s ease}.backdrop{background-color:var(--background-color);z-index:calc(var(--zIndex) - 10);animation:fadeIn 0.3s ease-out}.wrapper{position:fixed;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-light);border-radius:calc(var(--cura-spacing-base) * 3px);max-width:600px;min-width:200px;padding:calc(calc(var(--cura-spacing-base) * 1px) / 2) calc(var(--cura-spacing-base) * 4px) calc(var(--cura-spacing-base) * 4px) calc(var(--cura-spacing-base) * 4px);z-index:var(--zIndex);box-shadow:0px 8px 16px 0px var(--neutral-black-shadow-4, rgba(38, 38, 38, 0.12));transform:scale(0.95);transition:transform 0.3s ease-out, opacity 0.3s ease, visibility 0.3s ease}.wrapper ::slotted(*){max-height:80vh;overflow:auto;padding-right:calc(var(--cura-spacing-base) * 5px)}.modal.open .wrapper{transform:scale(1);opacity:1;visibility:visible}.close{justify-self:flex-end;padding-top:calc(var(--cura-spacing-base) * 4px);background:none;border:none;cursor:pointer}.close.mobile{display:none}.close.desktop{display:flex;padding:0;margin-right:-8px}@media (max-width: 768px){.wrapper{position:fixed;bottom:0px;width:80%;padding-top:calc(var(--cura-spacing-base) * 4px);padding-bottom:0px;border-radius:calc(var(--cura-spacing-base) * 3px) calc(var(--cura-spacing-base) * 3px) 0px 0px;border-bottom:none}.close{align-items:center;border-top:1px dashed var(--neutral-light);margin-top:calc(var(--cura-spacing-base) * 4px);padding:calc(var(--cura-spacing-base) * 2px) 0px;justify-content:center;width:100%}.close.mobile{display:flex;gap:calc(var(--cura-spacing-base) * 2px)}.close.desktop{display:none}}@keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes fadeOut{from{opacity:1}to{opacity:0}}";
 const CuraModalStyle0 = curaModalCss;
 const CuraModal = class {
@@ -55,7 +55,7 @@ const CuraModal = class {
         this.setOffset('right', this.right);
     }
     connectedCallback() {
-        this.styles = Object.assign(Object.assign({}, this.styles), { '--neutral-white': window.CuraAPI.theme.colors.getColor('neutral-white'), '--neutral-light': window.CuraAPI.theme.colors.getColor('neutral-light'), '--base-spacing': window.CuraAPI.theme.spacing.getSpacing() });
+        this.styles = Object.assign(Object.assign({}, this.styles), { '--neutral-purewhite': window.CuraAPI.theme.colors.getColor('neutral-purewhite'), '--neutral-light': window.CuraAPI.theme.colors.getColor('neutral-light'), '--base-spacing': window.CuraAPI.theme.spacing.getSpacing() });
         this.setColors();
         this.setTop();
         this.setBottom();
@@ -69,7 +69,7 @@ const CuraModal = class {
         window.addEventListener('keydown', this.handleCloseOnEsc);
     }
     render() {
-        return (index.h(index.Host, { key: 'e61daa046292367d64aeaaf82e8cdd223b2f7dc5', role: "dialog", "aria-modal": "true", style: { '--zIndex': this.zindex } }, index.h("div", { key: 'f2b9cd2b8a3790c0fcab87343ea8a425bb76c264', class: this.open ? 'modal container open' : 'modal container', style: this.styles }, index.h("div", { key: '3cf96f5a6a316c0a5df6abaf224d518a6a0a2934', class: this.open ? 'modal backdrop open' : 'modal backdrop', onClick: this.handleClose }), index.h("div", { key: 'f297ec70cf7ef9a71d4620339ba364e71e4337f8', class: "wrapper" }, index.h("div", { key: 'd4a2151cd5be6877ff1be66f263c83941b604d5f', class: "close desktop" }, index.h("cura-button-transparent", { key: '27bbb629ac2988b98dfcbccdc72f08b2de70c9bc', iconName: "close", color: "error", size: "small", onClick: this.handleClose, iconOnly: true })), index.h("slot", { key: 'f5e5b7931668446fb796184ede3796dfacdd38ef' }), index.h("div", { key: '014df19d65e3db1420f9e8dc33e56fb3aed8a1cf', class: "close mobile", onClick: this.handleClose }, index.h("cura-button-transparent", { key: '0fa3373474539e8220c41ba0fefb276e30f86315', color: "error", iconName: "close", size: "small" }, "Fechar"))))));
+        return (index.h(index.Host, { key: '4ccdb55c36abada0f1a7c8f44b79603e3e3432cc', role: "dialog", "aria-modal": "true", style: { '--zIndex': this.zindex } }, index.h("div", { key: '1b7248b7549a903a7a9b08aa219f209e0f159d30', class: this.open ? 'modal container open' : 'modal container', style: this.styles }, index.h("div", { key: '6977bffb5232d6e45d217bf2db4f61748daf7ccf', class: this.open ? 'modal backdrop open' : 'modal backdrop', onClick: this.handleClose }), index.h("div", { key: '71f7c2cf8c56d4f0fdf443209e0f5e96e285e36e', class: "wrapper" }, index.h("div", { key: '80b99d594ee94b214318479e815194be75f3fea7', class: "close desktop" }, index.h("cura-button-transparent", { key: '9abea3d67b08611313ee28b44bf6775a37b9ab79', iconName: "close", color: "error", size: "small", onClick: this.handleClose, iconOnly: true })), index.h("slot", { key: '85364906c3b59f2ac7b95cd316babff55de10a0f' }), index.h("div", { key: 'a4106cee880560a7fdcb92b63f98feefbe8f283a', class: "close mobile", onClick: this.handleClose }, index.h("cura-button-transparent", { key: '794ab5cfdece8aa94ff85d37655a83c9df7a854a', color: "error", iconName: "close", size: "small" }, this.mobileCloseLabel))))));
     }
     static get watchers() { return {
         "background": ["setColors"],

package/dist/cjs/cura-modal.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"cura-modal.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,YAAY,GAAG,~~opEAAopE~~,CAAC;~~AAC1qE~~,wBAAe,YAAY;;MCMd,SAAS;;;;QAwFpB,qBAAgB,GAAG,CAAC,GAAkB;YACpC,IAAI,GAAG,CAAC,GAAG,KAAK,QAAQ,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE;gBACtC,~~OAAM~~;~~aACP~~;YAED,IAAI,CAAC,IAAI,GAAG,KAAK,~~CAAA~~;~~YACjB~~,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,~~CAAA~~;~~SACvB~~,~~CAAA~~;~~QAgBO~~,gBAAW,GAAG;YACpB,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC;YACvB,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;SACnB,CAAC;oBA7GuD,KAAK;0BAKtB,OAAO;mBAKxB,CAAC;sBAKE,CAAC;oBAKH,CAAC;qBAKA,CAAC;gCAK0B,QAAQ;sBAKlB,KAAK;sBAM7B,EAAE;;IAGpB,SAAS;QACP,MAAM,eAAe,GAAG;YACtB,IAAI,EAAE,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,eAAe,EAAE,GAAG,CAAC;YAChE,KAAK,EAAE,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,gBAAgB,EAAE,GAAG,CAAC;SACnE,CAAC;QAEF,IAAI,CAAC,MAAM,mCACN,IAAI,CAAC,MAAM,KACd,oBAAoB,EAAE,eAAe,CAAC,IAAI,CAAC,UAAU,CAAC,GACvD,CAAC;KACH;IAED,SAAS,CAAC,IAAY,EAAE,KAAa;QACnC,IAAI,CAAC,MAAM,mCACN,IAAI,CAAC,MAAM,KACd,CAAC,KAAK,IAAI,SAAS,GAAG,GAAG,KAAK,IAAI,GACnC,CAAC;KACH;IAGD,MAAM;QACJ,IAAI,CAAC,SAAS,CAAC,KAAK,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC;KACjC;IAGD,SAAS;QACP,IAAI,CAAC,SAAS,CAAC,QAAQ,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;KACvC;IAGD,OAAO;QACL,IAAI,CAAC,SAAS,CAAC,MAAM,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC;KACnC;IAGD,QAAQ;QACN,IAAI,CAAC,SAAS,CAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;KACrC;IAWD,iBAAiB;QACf,IAAI,CAAC,MAAM,mCACN,IAAI,CAAC,MAAM,KACd,~~iBAAiB~~,EAAE,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,~~eAAe~~,CAAC,~~EACxE~~,iBAAiB,EAAE,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,eAAe,CAAC,EACxE,gBAAgB,EAAE,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,OAAO,CAAC,UAAU,EAAE,GAC5D,CAAC;QACF,IAAI,CAAC,SAAS,EAAE,CAAC;QACjB,IAAI,CAAC,MAAM,EAAE,CAAC;QACd,IAAI,CAAC,SAAS,EAAE,CAAC;QACjB,IAAI,CAAC,OAAO,EAAE,CAAC;QACf,IAAI,CAAC,QAAQ,EAAE,CAAC;KACjB;IAOD,oBAAoB;QAClB,MAAM,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,gBAAgB,CAAC,~~CAAA~~;~~KAC7D~~;IAED,gBAAgB;QACd,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,gBAAgB,CAAC,~~CAAA~~;~~KAC1D~~;IAED,MAAM;QACJ,QACEA,QAACC,UAAI,qDAAC,IAAI,EAAC,QAAQ,~~gBACN~~,MAAM,~~EACjB~~,KAAK,EAAE,EAAE,UAAU,EAAE,IAAI,CAAC,MAAM,EAAE,~~IAClCD~~,kEAAK,KAAK,EAAE,IAAI,CAAC,IAAI,GAAG,sBAAsB,GAAG,iBAAiB,EAAE,KAAK,EAAE,IAAI,CAAC,MAAM,IACpFA,kEAAK,KAAK,EAAE,IAAI,CAAC,IAAI,GAAG,qBAAqB,GAAG,gBAAgB,EAAE,OAAO,EAAE,IAAI,CAAC,WAAW,GAAQ,EACnGA,kEAAK,KAAK,EAAC,SAAS,IAElBA,kEAAK,KAAK,EAAC,eAAe,IACxBA,~~sFACE~~,QAAQ,EAAC,OAAO,~~EAChB~~,KAAK,EAAC,OAAO,~~EACb~~,IAAI,EAAC,OAAO,~~EACZ~~,OAAO,EAAE,IAAI,CAAC,WAAW,~~EACzB~~,QAAQ,~~SACiB~~,~~CACvB~~,EACNA,oEAAa,EAEbA,kEAAK,KAAK,EAAC,cAAc,EAAC,OAAO,EAAE,IAAI,CAAC,WAAW,IACjDA,sFAAyB,KAAK,EAAC,OAAO,EAAC,QAAQ,EAAC,OAAO,EAAC,IAAI,EAAC,OAAO,~~aAAiC~~,~~CACjG~~,CACF,CACF,CACD,EACP;KACH;;;;;;;;;;;;;","names":["h","Host"],"sources":["src/components/cura-modal/cura-modal.scss?tag=cura-modal&encapsulation=shadow","src/components/cura-modal/cura-modal.tsx"],"sourcesContent":["@import '../../../src/scss/mixins/spacing.scss';\n@import '../../../src/scss/mixins/shadows.scss';\n@import '../../../src/scss/mixins/responsive.scss';\n@import '../../../src/scss/mixins/animations.scss';\n\n:host {\n display: block;\n}\n\n.modal {\n position: fixed;\n height: 100%;\n width: 100%;\n top: var(--top-offset);\n bottom: var(--bottom-offset);\n left: var(--left-offset);\n right: var(--right-offset);\n z-index: -1;\n margin-top: var(--offset-top);\n\n &.open {\n z-index: var(--zIndex);\n\n .backdrop,\n .wrapper {\n opacity: 1;\n visibility: visible;\n animation: fadeIn 0.3s ease-out;\n }\n }\n}\n\n.container {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.backdrop,\n.wrapper {\n opacity: 0;\n visibility: hidden;\n transition: opacity 0.3s ease, visibility 0.3s ease;\n}\n\n.backdrop {\n background-color: var(--background-color);\n z-index: calc(var(--zIndex) - 10);\n animation: fadeIn 0.3s ease-out;\n}\n\n.wrapper {\n position: fixed;\n background-color: var(--neutral-~~white~~);\n border: 2px solid var(--neutral-light);\n border-radius: #{$spacing-xxxs};\n max-width: 600px;\n min-width: 200px;\n padding: calc(#{$spacing-tiny} / 2) #{$spacing-xxs} #{$spacing-xxs} #{$spacing-xxs};\n z-index: var(--zIndex);\n\n @include shadow-level4();\n\n transform: scale(0.95);\n transition: transform 0.3s ease-out, opacity 0.3s ease, visibility 0.3s ease;\n\n ::slotted() {\n max-height: 80vh;\n overflow: auto;\n padding-right: #{$spacing-xs};\n }\n}\n\n.modal.open .wrapper {\n transform: scale(1);\n opacity: 1;\n visibility: visible;\n}\n\n.close {\n justify-self: flex-end;\n padding-top: #{$spacing-xxs};\n background: none;\n border: none;\n cursor: pointer;\n\n &.mobile {\n display: none;\n }\n\n &.desktop {\n display: flex;\n padding: 0;\n margin-right: -8px;\n }\n}\n\n@include mobile-only() {\n .wrapper {\n position: fixed;\n bottom: #{$spacing-none};\n width: 80%;\n padding-top: #{$spacing-xxs};\n padding-bottom: #{$spacing-none};\n border-radius: #{$spacing-xxxs} #{$spacing-xxxs} #{$spacing-none} #{$spacing-none};\n border-bottom: none;\n }\n\n .close {\n align-items: center;\n border-top: 1px dashed var(--neutral-light);\n margin-top: #{$spacing-xxs};\n padding: #{$spacing-mini} #{$spacing-none};\n justify-content: center;\n width: 100%;\n\n &.mobile {\n display: flex;\n gap: #{$spacing-mini};\n }\n\n &.desktop {\n display: none;\n }\n }\n}\n\n@include fadeIn();\n@include fadeOut();\n","import { Component, Event, EventEmitter, Host, Prop, State, Watch, h } from '@stencil/core';\n\n@Component({\n tag: 'cura-modal',\n styleUrl: 'cura-modal.scss',\n shadow: true,\n})\nexport class CuraModal {\n /\n Property open to control modal visibility.\n * Default: false\n /\n @Prop({ mutable: true, reflect: true }) open?: boolean = false;\n /\n Property background to control modal backdrop color.\n * Default: light\n /\n @Prop() background?: 'dark' \| 'light' = 'light';\n /\n Property top to control modal top position.\n * Default: 0px\n /\n @Prop() top?: number = 0;\n /\n Property bottom to control modal bottom position.\n * Default: 0px\n /\n @Prop() bottom?: number = 0;\n /\n Property left to control modal left position.\n * Default: 0px\n /\n @Prop() left?: number = 0;\n /\n Property right to control modal right position.\n * Default: 0px\n /\n @Prop() right?: number = 0;\n /\n Defines the label for the close button when the modal is viewed on mobile.\n * Default: Fechar\n /\n @Prop({ reflect: true }) mobileCloseLabel: string = 'Fechar';\n /\n Property zindex to control the z-index value of the component.\n * Default: 100\n /\n @Prop({ reflect: true }) zindex: string = '100';\n /\n Event close to handle modal close.\n /\n @Event({ eventName: 'modalClose' }) modalClose: EventEmitter<void>;\n\n @State() styles = {};\n\n @Watch('background')\n setColors() {\n const backgroundTheme = {\n dark: window.CuraAPI.theme.colors.getColor('neutral-black', 0.4),\n light: window.CuraAPI.theme.colors.getColor('primary-darker', 0.8),\n };\n\n this.styles = {\n ...this.styles,\n '--background-color': backgroundTheme[this.background],\n };\n }\n\n setOffset(name: string, value: number) {\n this.styles = {\n ...this.styles,\n [`--${name}-offset`]: `${value}px`,\n };\n }\n\n @Watch('top')\n setTop() {\n this.setOffset('top', this.top);\n }\n\n @Watch('bottom')\n setBottom() {\n this.setOffset('bottom', this.bottom);\n }\n\n @Watch('left')\n setLeft() {\n this.setOffset('left', this.left);\n }\n\n @Watch('right')\n setRight() {\n this.setOffset('right', this.right);\n }\n\n handleCloseOnEsc = (evt: KeyboardEvent) => {\n if (evt.key !== 'Escape' \|\| !this.open) {\n return\n }\n\n this.open = false\n this.modalClose.emit()\n }\n\n connectedCallback() {\n this.styles = {\n ...this.styles,\n '--neutral-~~white~~': window.CuraAPI.theme.colors.getColor('neutral-~~white~~'),\n '--neutral-light': window.CuraAPI.theme.colors.getColor('neutral-light'),\n '--base-spacing': window.CuraAPI.theme.spacing.getSpacing(),\n };\n this.setColors();\n this.setTop();\n this.setBottom();\n this.setLeft();\n this.setRight();\n }\n\n private handleClose = () => {\n this.modalClose.emit();\n this.open = false;\n };\n\n disconnectedCallback() {\n window.removeEventListener('keydown', this.handleCloseOnEsc)\n }\n\n componentDidLoad() {\n window.addEventListener('keydown', this.handleCloseOnEsc)\n }\n\n render() {\n return (\n <Host role=\"dialog\"\n aria-modal=\"true\"\n style={{ '--zIndex': this.zindex }}>\n <div class={this.open ? 'modal container open' : 'modal container'} style={this.styles}>\n <div class={this.open ? 'modal backdrop open' : 'modal backdrop'} onClick={this.handleClose}></div>\n <div class=\"wrapper\">\n {/ Desktop button /}\n <div class=\"close desktop\">\n <cura-button-transparent\n iconName=\"close\"\n color=\"error\"\n size=\"small\"\n onClick={this.handleClose}\n iconOnly\n ></cura-button-transparent>\n </div>\n <slot></slot>\n {/ Mobile button */}\n <div class=\"close mobile\" onClick={this.handleClose}>\n <cura-button-transparent color=\"error\" iconName=\"close\" size=\"small\"~~>Fechar~~</cura-button-transparent>\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"cura-modal.entry.cjs.js","mappings":"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","names":["h","Host"],"sources":["src/components/cura-modal/cura-modal.scss?tag=cura-modal&encapsulation=shadow","src/components/cura-modal/cura-modal.tsx"],"sourcesContent":["@import '../../../src/scss/mixins/spacing.scss';\n@import '../../../src/scss/mixins/shadows.scss';\n@import '../../../src/scss/mixins/responsive.scss';\n@import '../../../src/scss/mixins/animations.scss';\n\n:host {\n display: block;\n}\n\n.modal {\n position: fixed;\n height: 100%;\n width: 100%;\n top: var(--top-offset);\n bottom: var(--bottom-offset);\n left: var(--left-offset);\n right: var(--right-offset);\n z-index: -1;\n margin-top: var(--offset-top);\n\n &.open {\n z-index: var(--zIndex);\n\n .backdrop,\n .wrapper {\n opacity: 1;\n visibility: visible;\n animation: fadeIn 0.3s ease-out;\n }\n }\n}\n\n.container {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.backdrop,\n.wrapper {\n opacity: 0;\n visibility: hidden;\n transition: opacity 0.3s ease, visibility 0.3s ease;\n}\n\n.backdrop {\n background-color: var(--background-color);\n z-index: calc(var(--zIndex) - 10);\n animation: fadeIn 0.3s ease-out;\n}\n\n.wrapper {\n position: fixed;\n background-color: var(--neutral-purewhite);\n border: 2px solid var(--neutral-light);\n border-radius: #{$spacing-xxxs};\n max-width: 600px;\n min-width: 200px;\n padding: calc(#{$spacing-tiny} / 2) #{$spacing-xxs} #{$spacing-xxs} #{$spacing-xxs};\n z-index: var(--zIndex);\n\n @include shadow-level4();\n\n transform: scale(0.95);\n transition: transform 0.3s ease-out, opacity 0.3s ease, visibility 0.3s ease;\n\n ::slotted() {\n max-height: 80vh;\n overflow: auto;\n padding-right: #{$spacing-xs};\n }\n}\n\n.modal.open .wrapper {\n transform: scale(1);\n opacity: 1;\n visibility: visible;\n}\n\n.close {\n justify-self: flex-end;\n padding-top: #{$spacing-xxs};\n background: none;\n border: none;\n cursor: pointer;\n\n &.mobile {\n display: none;\n }\n\n &.desktop {\n display: flex;\n padding: 0;\n margin-right: -8px;\n }\n}\n\n@include mobile-only() {\n .wrapper {\n position: fixed;\n bottom: #{$spacing-none};\n width: 80%;\n padding-top: #{$spacing-xxs};\n padding-bottom: #{$spacing-none};\n border-radius: #{$spacing-xxxs} #{$spacing-xxxs} #{$spacing-none} #{$spacing-none};\n border-bottom: none;\n }\n\n .close {\n align-items: center;\n border-top: 1px dashed var(--neutral-light);\n margin-top: #{$spacing-xxs};\n padding: #{$spacing-mini} #{$spacing-none};\n justify-content: center;\n width: 100%;\n\n &.mobile {\n display: flex;\n gap: #{$spacing-mini};\n }\n\n &.desktop {\n display: none;\n }\n }\n}\n\n@include fadeIn();\n@include fadeOut();\n","import { Component, Event, EventEmitter, Host, Prop, State, Watch, h } from '@stencil/core';\n\n@Component({\n tag: 'cura-modal',\n styleUrl: 'cura-modal.scss',\n shadow: true,\n})\nexport class CuraModal {\n /\n Property open to control modal visibility.\n * Default: false\n /\n @Prop({ mutable: true, reflect: true }) open?: boolean = false;\n /\n Property background to control modal backdrop color.\n * Default: light\n /\n @Prop() background?: 'dark' \| 'light' = 'light';\n /\n Property top to control modal top position.\n * Default: 0px\n /\n @Prop() top?: number = 0;\n /\n Property bottom to control modal bottom position.\n * Default: 0px\n /\n @Prop() bottom?: number = 0;\n /\n Property left to control modal left position.\n * Default: 0px\n /\n @Prop() left?: number = 0;\n /\n Property right to control modal right position.\n * Default: 0px\n /\n @Prop() right?: number = 0;\n /\n Defines the label for the close button when the modal is viewed on mobile.\n * Default: Fechar\n /\n @Prop({ reflect: true }) mobileCloseLabel: string = 'Fechar';\n /\n Property zindex to control the z-index value of the component.\n * Default: 100\n /\n @Prop({ reflect: true }) zindex: string = '100';\n /\n Event close to handle modal close.\n /\n @Event({ eventName: 'modalClose' }) modalClose: EventEmitter<void>;\n\n @State() styles = {};\n\n @Watch('background')\n setColors() {\n const backgroundTheme = {\n dark: window.CuraAPI.theme.colors.getColor('neutral-black', 0.4),\n light: window.CuraAPI.theme.colors.getColor('primary-darker', 0.8),\n };\n\n this.styles = {\n ...this.styles,\n '--background-color': backgroundTheme[this.background],\n };\n }\n\n setOffset(name: string, value: number) {\n this.styles = {\n ...this.styles,\n [`--${name}-offset`]: `${value}px`,\n };\n }\n\n @Watch('top')\n setTop() {\n this.setOffset('top', this.top);\n }\n\n @Watch('bottom')\n setBottom() {\n this.setOffset('bottom', this.bottom);\n }\n\n @Watch('left')\n setLeft() {\n this.setOffset('left', this.left);\n }\n\n @Watch('right')\n setRight() {\n this.setOffset('right', this.right);\n }\n\n handleCloseOnEsc = (evt: KeyboardEvent) => {\n if (evt.key !== 'Escape' \|\| !this.open) {\n return;\n }\n\n this.open = false;\n this.modalClose.emit();\n };\n\n connectedCallback() {\n this.styles = {\n ...this.styles,\n '--neutral-purewhite': window.CuraAPI.theme.colors.getColor('neutral-purewhite'),\n '--neutral-light': window.CuraAPI.theme.colors.getColor('neutral-light'),\n '--base-spacing': window.CuraAPI.theme.spacing.getSpacing(),\n };\n this.setColors();\n this.setTop();\n this.setBottom();\n this.setLeft();\n this.setRight();\n }\n\n private handleClose = () => {\n this.modalClose.emit();\n this.open = false;\n };\n\n disconnectedCallback() {\n window.removeEventListener('keydown', this.handleCloseOnEsc);\n }\n\n componentDidLoad() {\n window.addEventListener('keydown', this.handleCloseOnEsc);\n }\n\n render() {\n return (\n <Host role=\"dialog\" aria-modal=\"true\" style={{ '--zIndex': this.zindex }}>\n <div class={this.open ? 'modal container open' : 'modal container'} style={this.styles}>\n <div class={this.open ? 'modal backdrop open' : 'modal backdrop'} onClick={this.handleClose}></div>\n <div class=\"wrapper\">\n {/ Desktop button /}\n <div class=\"close desktop\">\n <cura-button-transparent iconName=\"close\" color=\"error\" size=\"small\" onClick={this.handleClose} iconOnly></cura-button-transparent>\n </div>\n <slot></slot>\n {/ Mobile button */}\n <div class=\"close mobile\" onClick={this.handleClose}>\n <cura-button-transparent color=\"error\" iconName=\"close\" size=\"small\">\n {this.mobileCloseLabel}\n </cura-button-transparent>\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/cjs/cura-radio.cjs.entry.js CHANGED Viewed

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-60783089.js');
 const curaForms_definitions = require('./cura-forms.definitions-c164f1b8.js');
-const curaRadioCss = "@charset \"UTF-8\";:host{display:block;box-sizing:border-box;min-width:0;}:host .container{display:flex;align-items:center;flex-direction:row-reverse;justify-content:start;gap:var(--gap);cursor:pointer}:host .position.container{flex-direction:row}:host .position .label-wrapper{justify-content:end}:host .position .message{text-align:right}:host .position .label{order:1}:host .info{display:flex;flex-direction:column}:host .info.textoverflow-single{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;display:block}:host .label-wrapper{display:flex;justify-content:start;align-items:center;gap:5px}:host .label-wrapper.textoverflow-single{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;display:block}:host .control{width:fit-content;cursor:pointer;position:relative}:host .radio{margin:0;appearance:none;-webkit-appearance:none;-moz-appearance:none;border-radius:50%;border:2px solid var(--primary-base-neutral-medium);background:var(--neutral-purewhite);box-sizing:border-box;transition:border-color 0.3s;position:relative;display:flex;align-items:center;justify-content:center;cursor:pointer;width:var(--size);height:var(--size);flex:0 0 var(--size)}:host .radio::after{content:\"\";background:var(--color-base-light);border-radius:50%;opacity:0;transition:opacity 0.3s;width:var(--size-after);height:var(--size-after)}:host .radio:focus{border-color:var(--info-base) !important}:host .success .radio{border-color:var(--success-base);background:var(--success-lighter)}:host .success .radio:hover{border-color:var(--success-base) !important}:host .success.checked .radio{border-color:var(--success-base)}:host .success.checked .radio::after{background:var(--success-base)}:host .success.checked .radio:hover{background:var(--success-lighter) !important;border-color:var(--success-base) !important}:host .success.checked .radio:hover::after{background:var(--success-base) !important}:host .error .radio{border-color:var(--error-base);background:var(--error-lighter)}:host .error .radio:hover{border-color:var(--error-base) !important}:host .error.checked .radio{border-color:var(--error-base)}:host .error.checked .radio::after{background:var(--error-base)}:host .error.checked .radio:hover{background:var(--error-lighter) !important;border-color:var(--error-base) !important}:host .error.checked .radio:hover::after{background:var(--error-base) !important}:host .checked .radio::after{opacity:1;background:var(--color-base)}:host .checked .radio{border-color:var(--color-dark)}:host .checked .radio:hover{border-color:var(--color-light) !important}:host .checked .radio:hover::after{background:var(--color-light)}:host .disabled .radio{background:var(--primary-base-neutral-white);border-color:var(--primary-darker-neutral-base);cursor:not-allowed}:host .disabled .radio::after{background:var(--neutral-lighter)}:host .disabled.checked .radio{border-color:var(--primary-base-neutral-base) !important;background:var(--primary-darker-neutral-white) !important}:host .disabled.checked .radio::after{background:var(--primary-base-neutral-base) !important}:host :not(.disabled):not(.checked) .radio:hover{border-color:var(--primary-base-neutral-dark)}";
+const curaRadioCss = "@charset \"UTF-8\";:host{display:block;box-sizing:border-box;min-width:0;}:host .container{display:flex;align-items:center;flex-direction:row-reverse;justify-content:start;gap:var(--gap);cursor:pointer}:host .position.container{flex-direction:row}:host .position .label-wrapper{justify-content:end}:host .position .message{text-align:right}:host .position .label{order:1}:host .label.textoverflow-single{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;display:block;min-width:0;max-width:100%}:host .info{display:flex;flex-direction:column;overflow:hidden}:host .label-wrapper{display:flex;justify-content:start;align-items:center;gap:5px}:host .control{width:fit-content;cursor:pointer;position:relative}:host .radio{margin:0;appearance:none;-webkit-appearance:none;-moz-appearance:none;border-radius:50%;border:2px solid var(--primary-base-neutral-medium);background:var(--neutral-purewhite);box-sizing:border-box;transition:border-color 0.3s;position:relative;display:flex;align-items:center;justify-content:center;cursor:pointer;width:var(--size);height:var(--size);flex:0 0 var(--size)}:host .radio::after{content:\"\";background:var(--color-base-light);border-radius:50%;opacity:0;transition:opacity 0.3s;width:var(--size-after);height:var(--size-after)}:host .radio:focus{border-color:var(--info-base) !important}:host .success .radio{border-color:var(--success-base);background:var(--success-lighter)}:host .success .radio:hover{border-color:var(--success-base) !important}:host .success.checked .radio{border-color:var(--success-base)}:host .success.checked .radio::after{background:var(--success-base)}:host .success.checked .radio:hover{background:var(--success-lighter) !important;border-color:var(--success-base) !important}:host .success.checked .radio:hover::after{background:var(--success-base) !important}:host .error .radio{border-color:var(--error-base);background:var(--error-lighter)}:host .error .radio:hover{border-color:var(--error-base) !important}:host .error.checked .radio{border-color:var(--error-base)}:host .error.checked .radio::after{background:var(--error-base)}:host .error.checked .radio:hover{background:var(--error-lighter) !important;border-color:var(--error-base) !important}:host .error.checked .radio:hover::after{background:var(--error-base) !important}:host .checked .radio::after{opacity:1;background:var(--color-base)}:host .checked .radio{border-color:var(--color-dark)}:host .checked .radio:hover{border-color:var(--color-light) !important}:host .checked .radio:hover::after{background:var(--color-light)}:host .disabled .radio{background:var(--primary-base-neutral-white);border-color:var(--primary-darker-neutral-base);cursor:not-allowed}:host .disabled .radio::after{background:var(--neutral-lighter)}:host .disabled.checked .radio{border-color:var(--primary-base-neutral-base) !important;background:var(--primary-darker-neutral-white) !important}:host .disabled.checked .radio::after{background:var(--primary-base-neutral-base) !important}:host :not(.disabled):not(.checked) .radio:hover{border-color:var(--primary-base-neutral-dark)}";
 const CuraRadioStyle0 = curaRadioCss;
 const CuraRadio = class {
@@ -44,7 +44,8 @@ const CuraRadio = class {
         this.background = 'light';
         this.size = 'medium';
         this.color = 'accent';
-        this.textOverflow = 'none';
+        this.overflowLabel = 'none';
+        this.overflowHelper = 'none';
         this.styles = {};
     }
     sizeHandler() {
@@ -138,7 +139,7 @@ const CuraRadio = class {
         return statusColors[this.status][type];
     }
     render() {
-        return (index.h(index.Host, { key: 'b8145fc2c19d08429b06a91784884336345e0bc6', role: "radio", "aria-checked": this.checked, "aria-disabled": this.disabled, "aria-required": this.required, "aria-invalid": this.status === 'error' }, index.h("div", { key: '8bd6457e269d1126dea7cc5bf8b4b29951632bbd', class: this.getClasses(), style: this.styles, onClick: this.handleClick }, index.h("div", { key: '183084f6b59f734254b5d80deffc9ad9af435484', class: `info ${this.textOverflow === 'single' ? 'textoverflow-single' : ''}` }, index.h("div", { key: '54be186791a8897c95259187f8c4014f9341968a', class: `label-wrapper ${this.textOverflow === 'single' ? 'textoverflow-single' : ''}` }, index.h("cura-label", { key: 'bb16cb0151075f0bea7b7e3684aec2d8cbc30976', textOverflow: this.textOverflow, class: "label", size: this.size === 'large' ? 'medium' : 'xsmall', color: this.assignColor('label') }, this.label), this.required && (index.h("cura-paragraph", { key: '3acc3e5284d13eb805c98c01c65bbd8e27ca3091', lineHeight: "0%", marginBlock: "0", color: "error-base" }, "*", ' '))), index.h("cura-label", { key: '3773f9a5eed424fa9456efc773f332d903bb8a68', textOverflow: this.textOverflow, color: this.assignColor('message'), size: "xsmall", class: "message" }, index.h("slot", { key: '4329dd946e70d299038f524ba4ec4e12fa12f3f0' }))), index.h("input", { key: '1851ed2d83ba7d39173bce9566f91d70b98da64b', type: "radio", class: `radio ${this.size.toLocaleLowerCase()}`, name: this.name, value: this.value, required: this.required, tabIndex: this.ontabindex, disabled: this.disabled, checked: this.checked }))));
+        return (index.h(index.Host, { key: '550e164f2be33f4fdad6c194302723a00e51843c', role: "radio", "aria-checked": this.checked, "aria-disabled": this.disabled, "aria-required": this.required, "aria-invalid": this.status === 'error' }, index.h("div", { key: 'ebcfef353b7dd4655b1d809025060db952927521', class: this.getClasses(), style: this.styles, onClick: this.handleClick }, index.h("div", { key: '436ecc0f4fd72ff6a00a2a47f494e08aae65b3d6', class: "info" }, index.h("div", { key: '4836e4ce83d1fc3b338cfd216b46a7791ba6dc90', class: "label-wrapper" }, index.h("cura-label", { key: '434f0b816eee11b7da0b44f37880e31c52e2f853', textOverflow: this.overflowLabel, class: `label${this.overflowLabel === 'single' ? ' textoverflow-single' : ''}`, size: this.size === 'large' ? 'medium' : 'xsmall', color: this.assignColor('label') }, this.label), this.required && (index.h("cura-paragraph", { key: '1d06464488947f469abd5c3d1c25ebb2ed63a5bd', lineHeight: "0%", marginBlock: "0", color: "error-base" }, "*", ' '))), index.h("cura-label", { key: '508bb787d2da5d25de48516ed64d6b02c94d8546', textOverflow: this.overflowHelper, color: this.assignColor('message'), size: "xsmall", class: "message" }, index.h("slot", { key: 'f35d5c895f74ec02987474e71df9a5067ea51e70' }))), index.h("input", { key: 'fbd6ba47d6e8a9c812ad986964749507f9d33d62', type: "radio", class: `radio ${this.size.toLocaleLowerCase()}`, name: this.name, value: this.value, required: this.required, tabIndex: this.ontabindex, disabled: this.disabled, checked: this.checked }))));
     }
     static get formAssociated() { return true; }
     get host() { return index.getElement(this); }

package/dist/cjs/cura-radio.cjs.entry.js.map CHANGED Viewed

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

package/dist/cjs/cura-switch.cjs.entry.js CHANGED Viewed

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-60783089.js');
 const curaForms_definitions = require('./cura-forms.definitions-c164f1b8.js');
-const curaSwitchCss = "@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);text-align:left;cursor:pointer}.position{flex-direction:row}.info.textoverflow-single{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;display:block}.label,.message{text-align:left}.control{width:fit-content}.track{background:var(--neutral-dark-base);border-radius:16px;transition:background-color 0.3s;align-items:flex-start;flex-shrink:0;box-sizing:border-box;width:var(--size-track);height:var(--size);position:relative}.thumb{background:var(--neutral-purewhite);border:2px solid var(--neutral-darker-medium);border-radius:50%;position:absolute;transition:transform 0.3s, outline 0.3s;display:inline-block;cursor:pointer;user-select:none;box-sizing:border-box;width:var(--size);height:var(--size);top:50%;transform:translateY(-50%)}.checked .thumb{border-color:var(--color-dark);box-shadow:0px 4px 8px 0px var(--neutral-black-shadow, rgba(38, 38, 38, 0.16));background:var(--neutral-purewhite);transform:translateX(var(--size)) translateY(-50%)}.checked .thumb:hover{background:var(--neutral-pale) !important;border-color:var(--neutral-darker-medium) !important}.checked .thumb:active{border-color:var(--color-dark);background:var(--neutral-pale)}.checked .track{background:var(--color-base-light)}.disabled .track{background:var(--neutral-black-neutral-pale)}.disabled .thumb{background:var(--neutral-black-neutral-base) !important;border-color:var(--neutral-black-neutral-pale) !important;cursor:not-allowed}.disabled.checked .track{background:var(--neutral-black-neutral-pale)}.container.disabled .thumb:focus{outline:none !important;border-color:var(--neutral-black-neutral-pale) !important}:not(.disabled):not(.checked) .thumb:hover{border-color:var(--color-dark);background:var(--neutral-pale)}:not(.disabled):not(.checked) .thumb:active{border-color:var(--color-dark);background:var(--neutral-pale)}:not(.disabled) .thumb:focus{outline:2px solid var(--info-base) !important;border:2px solid var(--neutral-darker-medium);z-index:1}:not(.disabled) .checked .thumb:focus{outline:2px solid var(--info-base) !important;border-color:var(--color-dark)}";
+const curaSwitchCss = "@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);text-align:left;cursor:pointer}.position{flex-direction:row}.info{overflow:hidden}.label,.message{text-align:left}.control{width:fit-content}.track{background:var(--neutral-dark-base);border-radius:16px;transition:background-color 0.3s;align-items:flex-start;flex-shrink:0;box-sizing:border-box;width:var(--size-track);height:var(--size);position:relative}.thumb{background:var(--neutral-purewhite);border:2px solid var(--neutral-darker-medium);border-radius:50%;position:absolute;transition:transform 0.3s, outline 0.3s;display:inline-block;cursor:pointer;user-select:none;box-sizing:border-box;width:var(--size);height:var(--size);top:50%;transform:translateY(-50%)}.checked .thumb{border-color:var(--color-dark);box-shadow:0px 4px 8px 0px var(--neutral-black-shadow, rgba(38, 38, 38, 0.16));background:var(--neutral-purewhite);transform:translateX(var(--size)) translateY(-50%)}.checked .thumb:hover{background:var(--neutral-pale) !important;border-color:var(--neutral-darker-medium) !important}.checked .thumb:active{border-color:var(--color-dark);background:var(--neutral-pale)}.checked .track{background:var(--color-base-light)}.disabled .track{background:var(--neutral-black-neutral-pale)}.disabled .thumb{background:var(--neutral-black-neutral-base) !important;border-color:var(--neutral-black-neutral-pale) !important;cursor:not-allowed}.disabled.checked .track{background:var(--neutral-black-neutral-pale)}.container.disabled .thumb:focus{outline:none !important;border-color:var(--neutral-black-neutral-pale) !important}:not(.disabled):not(.checked) .thumb:hover{border-color:var(--color-dark);background:var(--neutral-pale)}:not(.disabled):not(.checked) .thumb:active{border-color:var(--color-dark);background:var(--neutral-pale)}:not(.disabled) .thumb:focus{outline:2px solid var(--info-base) !important;border:2px solid var(--neutral-darker-medium);z-index:1}:not(.disabled) .checked .thumb:focus{outline:2px solid var(--info-base) !important;border-color:var(--color-dark)}";
 const CuraSwitchStyle0 = curaSwitchCss;
 const CuraSwitch = class {
@@ -40,7 +40,8 @@ const CuraSwitch = class {
         this.size = 'medium';
         this.background = 'light';
         this.color = 'accent';
-        this.textOverflow = 'none';
+        this.overflowLabel = 'none';
+        this.overflowHelper = 'none';
         this.styles = {};
     }
     sizeHandler() {
@@ -107,11 +108,10 @@ const CuraSwitch = class {
         classes['checked'] = this.checked;
         classes['disabled'] = this.disabled;
         classes['position'] = this.position === 'right';
-        classes['textoverflow-single'] = this.textOverflow === 'single';
         return classes;
     }
     render() {
-        return (index.h(index.Host, { key: '774e59c0c00a11d231e30d032d7872d99eb3b8d1', role: "switch", "aria-checked": this.checked, "aria-disabled": this.disabled }, index.h("div", { key: 'e2bd25d79535f61b586fbf8a43915b5fccc308a2', class: this.getClasses(), style: this.styles, onClick: this.toggleSwitch }, index.h("div", { key: 'e68b9fac16600090db42037c507c2af81c1be0f3', class: `info ${this.textOverflow === 'single' ? 'textoverflow-single' : ''}` }, index.h("cura-label", { key: '70a99aa8a108b00d46bb0354785b601e393d6cc1', textOverflow: this.textOverflow, style: { textAlign: this.position === 'right' ? 'right' : 'left' }, class: "label", weight: "bold", size: this.size === 'large' ? 'medium' : 'xsmall', lineHeight: "125%", color: this.assignColor('neutral-white', 'neutral-black') }, this.label), index.h("cura-label", { key: '09b1ae5f5a3b4062b473dec49bd68583d24ce2c0', textOverflow: this.textOverflow, style: { textAlign: this.position === 'right' ? 'right' : 'left' }, color: this.assignColor('primary-lighter', 'neutral-dark'), size: "xsmall", class: "message" }, index.h("slot", { key: '380a487d0387fc5934413f558e5f6f2558cb19de' }))), index.h("div", { key: '3a1ebdc9faf0c34e5b2e1b1e55b1a57161e14cb5', class: "control" }, index.h("div", { key: 'bd027689060ae72fce3e77ef739822ccb4f16b49', class: `track ${this.size.toLowerCase()}` }, index.h("div", { key: '918744f9117e5f7ddcc0e9c9cdbf7735b396dc87', class: `thumb ${this.size.toLowerCase()}`, tabIndex: this.ontabindex }))))));
+        return (index.h(index.Host, { key: '39e910a3c68672eb23a123529a77f8ee0d1093aa', role: "switch", "aria-checked": this.checked, "aria-disabled": this.disabled }, index.h("div", { key: '649b89d2709b8afa30cfc1ba549d45ac3c9c04a1', class: this.getClasses(), style: this.styles, onClick: this.toggleSwitch }, index.h("div", { key: '4b1c7d704f0db997a4738abbd248c3a0bbcfdfcd', class: "info" }, index.h("cura-label", { key: 'b225b06ed00144348d08bb95c8a5bf2f1f48e610', textOverflow: this.overflowLabel, style: { textAlign: this.position === 'right' ? 'right' : 'left' }, class: "label", weight: "bold", size: this.size === 'large' ? 'medium' : 'xsmall', lineHeight: "125%", color: this.assignColor('neutral-white', 'neutral-black') }, this.label), index.h("cura-label", { key: '22f5e79e0b2e98867663a9a60436d11bc2ce236e', textOverflow: this.overflowHelper, style: { textAlign: this.position === 'right' ? 'right' : 'left' }, color: this.assignColor('primary-lighter', 'neutral-dark'), size: "xsmall", class: "message" }, index.h("slot", { key: 'd9ed12c05133baeec10aa149f26d6dc01b2e3cd8' }))), index.h("div", { key: 'd51364956de2b53735285109dd457cbff9500eb7', class: "control" }, index.h("div", { key: '5f1ce68eba5430eac69d670a72c4abd48a79a90d', class: `track ${this.size.toLowerCase()}` }, index.h("div", { key: '5077af32559bc7eb183745544844d01a6078ee1d', class: `thumb ${this.size.toLowerCase()}`, tabIndex: this.ontabindex }))))));
     }
     static get formAssociated() { return true; }
     static get watchers() { return {