npm - @rededor/cura - Versions diffs - 1.5.1 → 1.6.0-alpha.1 - Mend

@rededor/cura 1.5.1 → 1.6.0-alpha.1

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

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

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-e6d728ec.js');
+const index = require('./index-12d54921.js');
 const curaCardCss = ":host{display:block;box-sizing:border-box;font-size:var(--font-size);font-family:var(--font-family)}:host ::slotted(*){display:flex;align-items:center;justify-content:center;font-size:var(--font-size);font-family:var(--font-family)}a{display:block;text-decoration:none !important;color:inherit}.solid{background-color:var(--neutral-purewhite);border:2px solid var(--neutral-base);border-radius:12px;overflow:hidden;padding:0px;box-shadow:none}.solid ::slotted(*){border-radius:0}.solid.hasPadding{padding:20px}.solid.hasPadding ::slotted(*){border-radius:4px !important}.solid.hasShadow{border:2px solid var(--neutral-base);box-shadow:0px 1px 4px 0px var(--neutral-black-shadow, rgba(38, 38, 38, 0.16))}.solid.cardLink{background-color:var(--neutral-purewhite);border:2px solid var(--primary-base);border-radius:12px;padding:0px;box-shadow:none;cursor:pointer}.solid.cardLink ::slotted(*){border-radius:0px}.solid.cardLink:hover{border:2px solid var(--primary-lighter) !important}.solid.cardLink.hasPadding{padding:20px}.solid.cardLink.hasPadding ::slotted(*){border-radius:4px !important}.solid.cardLink.hasPadding:hover{border:2px solid var(--primary-lighter) !important}.solid.cardLink.hasShadow{border:2px solid var(--primary-base);box-shadow:0px 4px 8px 0px var(--neutral-black-shadow, rgba(38, 38, 38, 0.16))}.solid.cardLink:not(.hasPadding).hasShadow ::slotted(*){border-radius:12px !important}.solid.cardLink.dark{background-color:var(--neutral-purewhite);border:2px solid var(--neutral-purewhite)}.solid.cardLink.dark:hover{border:2px solid var(--primary-lighter)}.transparent{background-color:transparent;border:0;border-radius:12px;padding:0px;overflow:hidden}.transparent ::slotted(*){border-radius:12px}.transparent.hasPadding{padding:20px}.transparent.hasPadding ::slotted(*){border-radius:4px}.transparent.cardLink{background-color:transparent;border:2px solid var(--primary-base);overflow:hidden;border-radius:12px;padding:0px;box-shadow:none}.transparent.cardLink ::slotted(*){border-radius:0px !important}.transparent.cardLink:hover{border:2px solid var(--primary-lighter) !important}.transparent.cardLink.light{background-color:var(--neutral-purewhite);border:2px solid var(--primary-base)}.transparent.cardLink.light ::slotted(*){border-radius:12px !important}.transparent.cardLink.light:hover{border-color:var(--primary-lighter) !important}.transparent.cardLink.dark{background-color:transparent;border:2px solid var(--neutral-purewhite)}.transparent.cardLink.dark:hover{border:0}.transparent.cardLink.hasPadding{padding:20px}.transparent.cardLink.hasPadding ::slotted(*){border-radius:4px !important}";
 const CuraCardStyle0 = curaCardCss;

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

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-e6d728ec.js');
+const index = require('./index-12d54921.js');
 const curaForms_definitions = require('./cura-forms.definitions-c164f1b8.js');
 const curaCheckboxCss = "@charset \"UTF-8\";:host{display:block;width:fit-content;box-sizing:border-box}.container{display:flex;align-items:center;flex-direction:row-reverse;gap:var(--gap)}.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}.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}";
@@ -164,7 +164,7 @@ const CuraCheckbox = class {
         return index.h("cura-icon", { class: "icon", name: iconName, size: iconSize, color: iconColor });
     }
     render() {
-        return (index.h(index.Host, { key: 'c589b642a730e09b8d5ba60b69b45f131560ffda' }, index.h("div", { key: '85ee55dc52042e513e070d68af348dc78d1990e2', class: this.getClasses(), style: this.styles, onClick: this.handleClick }, index.h("div", { key: '59e78d3b717b0bbd77d98da09ab7f1da30d02f14', class: "info" }, index.h("div", { key: '64d683966633a625e7e477fcf1b00364d5fd3fa7', class: "label-wrapper" }, index.h("cura-label", { key: '76d34006ffd837285cb899278f759d95862097c5', class: "label", weight: 'bold', size: this.size === 'large' ? 'medium' : 'xsmall', color: this.assignColor('label') }, this.label), this.required && index.h("cura-paragraph", { key: '01394587736d7402d5c6729e9f7e93f7b08ad742', lineHeight: '0%', marginBlock: '0', color: "error-base" }, "* ")), index.h("cura-label", { key: 'fcbbea9a05b9299a814111ea36d7412df6f54e92', color: this.assignColor('message'), size: "xsmall", class: "message" }, index.h("slot", { key: '99c46ed2eb8492cbebb114d828935f1ec0bf7796' }))), index.h("div", { key: '6291780f613af4e320c486b46697df6f19bdce0e', class: 'checkbox', tabIndex: this.ontabindex }, index.h("input", { key: 'b922e6498ecfd28391843cdfa45c850f045f3ab6', 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: '8c4fdab5276ff9eb200299a5584ac8e96ef11974' }, index.h("div", { key: '3074370b481f50e7c3b8183e1aa643a37992f05b', class: this.getClasses(), style: this.styles, onClick: this.handleClick }, index.h("div", { key: 'adb656d2d5dc3212735c427e08c7d03d8c94f83e', class: "info" }, index.h("div", { key: '55747701dd4ed57a6ed3132d996639219ba950e1', class: "label-wrapper" }, index.h("cura-label", { key: 'b5224ec0a274789c03f6b8e0a5c5ed7fda911c58', class: "label", weight: 'bold', size: this.size === 'large' ? 'medium' : 'xsmall', color: this.assignColor('label') }, this.label), this.required && index.h("cura-paragraph", { key: '188a2ed6c915cec53d495edd77ec2dd88fafe714', lineHeight: '0%', marginBlock: '0', color: "error-base" }, "* ")), index.h("cura-label", { key: '6b63e628f4aeb066dc73feaca720edb12dc207f1', color: this.assignColor('message'), size: "xsmall", class: "message" }, index.h("slot", { key: '880c28c63878169f84a14c96d12c925edc3611bb' }))), index.h("div", { key: '01dd5e638a5043c4349193c97dd7acfe57dc4498', class: 'checkbox', tabIndex: this.ontabindex }, index.h("input", { key: '5ff82da2b58e7bd88f2866a2677151fb49814b3c', 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-display.cjs.entry.js CHANGED Viewed

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-e6d728ec.js');
+const index = require('./index-12d54921.js');
 const curaDisplayCss = ":host{display:block;font-size:var(--font-size-base)}:host h1,:host h2,:host h3,:host h4,:host h5,:host h6{font-family:var(--font-family);font-size:3em;font-weight:var(--font-weight-bold);color:var(--color-body);line-height:var(--line-height);margin-block:var(--margin-block);letter-spacing:0px}:host h1.small,:host h2.small,:host h3.small,:host h4.small,:host h5.small,:host h6.small{font-size:2.2857142857em;letter-spacing:-1.68px}@media (min-width: 769px) and (max-width: 1920px){:host h1,:host h2,:host h3,:host h4,:host h5,:host h6{font-size:3.429em}:host h1.small,:host h2.small,:host h3.small,:host h4.small,:host h5.small,:host h6.small{font-size:2.8571428571em;letter-spacing:-1.92px}}@media (min-width: 1921px){:host h1,:host h2,:host h3,:host h4,:host h5,:host h6{font-size:4.286em;line-height:calc(var(--line-height) + 5%)}:host h1.small,:host h2.small,:host h3.small,:host h4.small,:host h5.small,:host h6.small{font-size:3.5714285714em;letter-spacing:-1.2px}}:host ::slotted(b),:host ::slotted(strong){font-weight:var(--font-weight-bold)}:host ::slotted(a){font-weight:var(--font-weight-bold);color:var(--color-link);text-underline-offset:10%;cursor:pointer}:host ::slotted(u){text-underline-offset:10%}:host ::slotted(i),:host ::slotted(em){font-style:italic;font-weight:var(--font-weight-medium)}:host ::slotted(abbr){color:var(--color-link);text-decoration:underline dashed 1px var(--color-link);text-underline-offset:10%;cursor:default}";
 const CuraDisplayStyle0 = curaDisplayCss;
@@ -69,7 +69,7 @@ const CuraDisplay = class {
         return tags[`${this.level}`] || tags['default'];
     }
     render() {
-        return (index.h(index.Host, { key: '01876449797c600a4fa37c9b4addd80855e6fc83', style: this.hostCSSProperties() }, this.getHeadingTag()));
+        return (index.h(index.Host, { key: '7e0a43f434bce1797cebbe4d6d2565e64d64bab7', style: this.hostCSSProperties() }, this.getHeadingTag()));
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/cura-dropdown-search-not-found.cjs.entry.js ADDED Viewed

@@ -0,0 +1,28 @@
+'use strict';
+Object.defineProperty(exports, '__esModule', { value: true });
+const index = require('./index-12d54921.js');
+const curaDropdownSearchNotFoundCss = ":host{display:block;box-sizing:border-box}:host .component-container{box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;display:flex;align-items:center;justify-content:flex-start;min-height:calc(var(--cura-spacing-base) * 10px);padding:0 calc(var(--cura-spacing-base) * 1px);border-bottom:1px solid var(--neutral-light);border-bottom:none;cursor:default}:host .component-container cura-heading{--margin-block:0 !important;flex:1}";
+const CuraDropdownSearchNotFoundStyle0 = curaDropdownSearchNotFoundCss;
+const CuraDropdownSearchNotFound = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.actionclick = index.createEvent(this, "actionclick", 7);
+        this.handleClick = (ev) => {
+            this.actionclick.emit();
+            ev.preventDefault();
+            ev.stopPropagation();
+        };
+    }
+    render() {
+        return (index.h(index.Host, { key: '899559f0e05394638cd9c6dd61897383453ed176' }, index.h("div", { key: '0b1ed35b82f1df7feac928ab84e08149a38a79a3', class: "component-container", onClick: this.handleClick }, index.h("cura-heading", { key: '49f423b01e6719790bf7f3bcda6f3239042c0c9f', size: "xsmall", weight: "bold", color: "error-dark" }, index.h("slot", { key: '4fbcfb5602729f92f84a22d003d5b2e66e481b6c' })))));
+    }
+};
+CuraDropdownSearchNotFound.style = CuraDropdownSearchNotFoundStyle0;
+exports.cura_dropdown_search_not_found = CuraDropdownSearchNotFound;
+//# sourceMappingURL=cura-dropdown-search-not-found.cjs.entry.js.map

package/dist/cjs/cura-dropdown-search-not-found.cjs.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"cura-dropdown-search-not-found.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,6BAA6B,GAAG,2cAA2c,CAAC;AAClf,yCAAe,6BAA6B;;MCM/B,0BAA0B;IALvC;;;QASE,gBAAW,GAAG,CAAC,EAAS;YACtB,IAAI,CAAC,WAAW,CAAC,IAAI,EAAE,CAAC;YACxB,EAAE,CAAC,cAAc,EAAE,CAAC;YACpB,EAAE,CAAC,eAAe,EAAE,CAAC;SACtB,CAAA;KAaF;IAXC,MAAM;QACJ,QACEA,QAACC,UAAI,uDACHD,kEAAK,KAAK,EAAC,qBAAqB,EAAC,OAAO,EAAG,IAAI,CAAC,WAAW,IACzDA,2EAAc,IAAI,EAAC,QAAQ,EAAC,MAAM,EAAC,MAAM,EAAC,KAAK,EAAC,YAAY,IAC1DA,oEAAa,CACA,CACX,CACD,EACP;KACH;;;;;;","names":["h","Host"],"sources":["src/components/cura-dropdown-search-new/cura-dropdown-search-not-found/cura-dropdown-search-not-found.scss?tag=cura-dropdown-search-not-found&encapsulation=shadow","src/components/cura-dropdown-search-new/cura-dropdown-search-not-found/cura-dropdown-search-not-found.tsx"],"sourcesContent":["@import '../../../scss/mixins/spacing.scss';\n@import '../../../scss/mixins/dropdown-search-options.scss';\n\n:host {\n @include host-component();\n\n .component-container {\n @include component-container();\n border-bottom: none;\n cursor: default;\n\n cura-heading {\n --margin-block: 0 !important;\n flex: 1;\n }\n }\n}","import { Component, Host, h, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n tag: 'cura-dropdown-search-not-found',\n styleUrl: 'cura-dropdown-search-not-found.scss',\n shadow: true,\n})\nexport class CuraDropdownSearchNotFound {\n\n @Event() actionclick: EventEmitter<any>;\n\n handleClick = (ev: Event) => {\n this.actionclick.emit();\n ev.preventDefault();\n ev.stopPropagation();\n }\n\n render() {\n return (\n <Host>\n <div class=\"component-container\" onClick={ this.handleClick }>\n <cura-heading size=\"xsmall\" weight=\"bold\" color=\"error-dark\">\n <slot></slot>\n </cura-heading>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/cjs/cura-dropdown-search-option-title.cjs.entry.js CHANGED Viewed

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-e6d728ec.js');
+const index = require('./index-12d54921.js');
 const curaDropdownSearchOptionTitleCss = ":host{display:block;box-sizing:border-box;width:100%}cura-label{padding:12px 0px;border-bottom:1px solid var(--neutral-light)}";
 const CuraDropdownSearchOptionTitleStyle0 = curaDropdownSearchOptionTitleCss;
@@ -12,7 +12,7 @@ const CuraDropdownSearchOptionTitle = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h(index.Host, { key: 'b378a877e6a90727e3216c284c2a064992f2dfc9', slot: "dropdown-search-option" }, index.h("cura-label", { key: 'e2d457a7d42bcacae09012322b19a54e44fb109f', color: "neutral-dark", size: "xsmall", lineHeight: "16px", marginBlock: "0" }, index.h("slot", { key: 'e889fa1839988a0f138e14ad15b0e250100ba38c' }))));
+        return (index.h(index.Host, { key: '4782e0381a903b7b71851e7ccee12ef94a3343ab', slot: "dropdown-search-option" }, index.h("cura-label", { key: '4f287507290fc374eef609a3c18e1fc9ba970ae7', color: "neutral-dark", size: "xsmall", lineHeight: "16px", marginBlock: "0" }, index.h("slot", { key: 'a5d129e76e15613b8983acd2034808803cbf1f38' }))));
     }
 };
 CuraDropdownSearchOptionTitle.style = CuraDropdownSearchOptionTitleStyle0;

package/dist/cjs/cura-dropdown-search-option.cjs.entry.js CHANGED Viewed

@@ -2,9 +2,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-e6d728ec.js');
+const index = require('./index-12d54921.js');
-const curaDropdownSearchOptionCss = ":host{display:block;box-sizing:border-box;width:100%}:host(:last-of-type) .content-container{border-bottom:none}.option-container{width:100%;display:flex}.option-container:hover:not(.disabled):not(.selected) .content-container{background-color:var(--neutral-white)}.option-container.selected .content-container{background-color:var(--primary-lighter)}.option-container.disabled{cursor:default}.content-container{display:flex;width:100%;box-sizing:border-box;padding:calc(var(--base-spacing) * 2px) calc(var(--base-spacing) * 1px);background-color:var(--neutral-purewhite);border-bottom:1px solid var(--neutral-light)}.content-container ::slotted(div[slot=action]){display:flex;justify-content:end}.option-info{width:100%;display:flex;align-items:center;align-content:center;justify-content:center;gap:calc(var(--base-spacing) * 2px);flex-direction:row;box-sizing:border-box;cursor:pointer}.option-info cura-heading{width:100%;margin-block:0px}.option-info ::slotted(div[slot=image]){min-width:calc(var(--base-spacing) * 8px);display:flex;justify-content:center;align-items:center}";
+const curaDropdownSearchOptionCss = ":host{display:block;box-sizing:border-box;width:100%}:host(:last-of-type) .content-container{border-bottom:none}.option-container{width:100%;display:flex}.option-container:hover:not(.disabled):not(.selected) .content-container{background-color:var(--neutral-white)}.option-container.selected .content-container{background-color:var(--primary-lighter)}.option-container.disabled{cursor:default}.content-container{display:flex;width:100%;box-sizing:border-box;padding:calc(var(--cura-spacing-base) * 2px) calc(var(--cura-spacing-base) * 1px);background-color:var(--neutral-purewhite);border-bottom:1px solid var(--neutral-light)}.content-container ::slotted(div[slot=action]){display:flex;justify-content:end}.option-info{width:100%;display:flex;align-items:center;align-content:center;justify-content:center;gap:calc(var(--cura-spacing-base) * 2px);flex-direction:row;box-sizing:border-box;cursor:pointer}.option-info cura-heading{width:100%;margin-block:0px}.option-info ::slotted(div[slot=image]){min-width:calc(var(--cura-spacing-base) * 8px);display:flex;justify-content:center;align-items:center}";
 const CuraDropdownSearchOptionStyle0 = curaDropdownSearchOptionCss;
 const CuraDropdownSearchOption = class {
@@ -46,12 +46,12 @@ const CuraDropdownSearchOption = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: '515f662d5fb08cd77e7ad24de425ec34497e5e6e', slot: "dropdown-search-option" }, index.h("div", { key: '8decccf2416ae3ea135bba38845da2a63c9cfdce', style: this.styles, class: {
+        return (index.h(index.Host, { key: '81c4404d784d2038823d84bf2b4beef53a874644', slot: "dropdown-search-option" }, index.h("div", { key: '476757ab00466607c2ab01a2b5a82da4c45087af', style: this.styles, class: {
                 "option-container": true,
                 hovered: this.selectable ? this.hovered : false,
                 selected: this.selected,
                 disabled: !this.selectable
-            } }, index.h("div", { key: '8c3cce88d40c764ae87cf8c54e3fb9fe9651f62d', class: "content-container" }, index.h("div", { key: '1c674ff6a3721c42e034b994bf903d8608100cb8', class: "option-info", onClick: (e) => this.handleOptionClick(e) }, index.h("slot", { key: '7a6545a242da0774b74a403b2dc26ce378d146fd', name: "image" }), index.h("cura-heading", { key: '860fede2f20748b5e15ddf3222cd0c6ce3ff1f8c', size: "xsmall", lineHeight: "16px", marginBlock: "0px", weight: "bold", color: "neutral-black" }, index.h("slot", { key: 'e9a7610e2d561cb399d58c44f98fb9ea0e6cf5c6' }))), index.h("slot", { key: 'c784f7cddd4d5e246126ef43ab08e82db51fc2be', name: "action" })))));
+            } }, index.h("div", { key: '2a35edbe88ed99587972e0e657250867cb6ba814', class: "content-container" }, index.h("div", { key: '5bb136c9c5386d6c40985a86bc7e2e85c239110e', class: "option-info", onClick: (e) => this.handleOptionClick(e) }, index.h("slot", { key: 'f5ad44434728cb3879819f6016fcf9927354c05f', name: "image" }), index.h("cura-heading", { key: '43fa2a1c1a206f6bd1b0f52f5bc536cbb98bbe56', size: "xsmall", lineHeight: "16px", marginBlock: "0px", weight: "bold", color: "neutral-black" }, index.h("slot", { key: '197963392c5cef12d29dfbe312f4359b950de9f3' }))), index.h("slot", { key: '146144af1e1a5d1a18eb2aceaa71b749a4c61ba6', name: "action" })))));
     }
     get hostElement() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/cura-dropdown-search-option.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"cura-dropdown-search-option.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,2BAA2B,GAAG,~~0jCAA0jC~~,CAAC;~~AAC/lC~~,uCAAe,2BAA2B;;MCM7B,wBAAwB;;;;QAyC3B,sBAAiB,GAAG,CAAC,CAAQ;YACnC,IAAI,IAAI,CAAC,UAAU,EAAE;gBACnB,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC;gBAC/B,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;gBACrC,IAAI,CAAC,eAAe,EAAE,CAAC;aACxB;iBAAM;gBACL,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,CAAC,CAAC,wBAAwB,EAAE,CAAC;aAC9B;SACF,CAAC;;wBAzC0D,KAAK;0BAKlB,IAAI;uBAKQ,KAAK;sBAE9C,EAAE;;IAWpB,iBAAiB;QACf,IAAI,CAAC,OAAO,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,UAAU,EAAE,CAAC;QACvD,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC;QAC1E,IAAI,CAAC,MAAM,CAAC,qBAAqB,CAAC,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,mBAAmB,CAAC,CAAC;QAC/F,IAAI,CAAC,MAAM,CAAC,iBAAiB,CAAC,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,eAAe,CAAC,CAAC;QACvF,IAAI,CAAC,MAAM,CAAC,iBAAiB,CAAC,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,eAAe,CAAC,CAAC;QACvF,IAAI,CAAC,MAAM,CAAC,mBAAmB,CAAC,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,iBAAiB,EAAE,EAAE,CAAC,CAAC;KAChG;IAaD,gBAAgB;QACd,IAAI,CAAC,eAAe,EAAE,CAAC;KACxB;IAGO,eAAe;QACrB,MAAM,WAAW,GAAG,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,0BAA0B,CAAC,CAAC;QAC/E,IAAI,WAAW,EAAE;YACf,WAAW,CAAC,YAAY,CAAC,OAAO,EAAE,IAAI,CAAC,QAAQ,GAAG,SAAS,GAAG,cAAc,CAAC,CAAC;SAC/E;KACF;IAED,MAAM;QACJ,QACEA,QAACC,UAAI,qDAAC,IAAI,EAAC,wBAAwB,IACjCD,kEACE,KAAK,EAAE,IAAI,CAAC,MAAM,EAClB,KAAK,EAAE;gBACL,kBAAkB,EAAE,IAAI;gBACxB,OAAO,EAAE,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,OAAO,GAAG,KAAK;gBAC/C,QAAQ,EAAE,IAAI,CAAC,QAAQ;gBACvB,QAAQ,EAAE,CAAC,IAAI,CAAC,UAAU;aAC3B,IACDA,kEAAK,KAAK,EAAC,mBAAmB,IAC5BA,kEAAK,KAAK,EAAC,aAAa,EAAC,OAAO,EAAE,CAAC,CAAC,KAAK,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,IAChEA,mEAAM,IAAI,EAAC,OAAO,GAAQ,EAC1BA,2EAAc,IAAI,EAAC,QAAQ,EAAC,UAAU,EAAC,MAAM,EAAC,WAAW,EAAC,KAAK,EAAC,MAAM,EAAC,MAAM,EAAC,KAAK,EAAC,eAAe,IACjGA,oEAAa,CACA,CACX,EACNA,mEAAM,IAAI,EAAC,QAAQ,GAAQ,CACvB,CACF,CACD,EACP;KACH;;;;;;;;;;","names":["h","Host"],"sources":["src/components/forms/cura-dropdown-search/cura-dropdown-search-option/cura-dropdown-search-option.scss?tag=cura-dropdown-search-option&encapsulation=shadow","src/components/forms/cura-dropdown-search/cura-dropdown-search-option/cura-dropdown-search-option.tsx"],"sourcesContent":["@import \"../../../../scss/mixins/spacing.scss\";\n\n:host {\n display: block;\n box-sizing: border-box;\n width: 100%;\n}\n\n:host(:last-of-type) .content-container {\n border-bottom: none;\n}\n\n.option-container {\n width: 100%;\n display: flex;\n\n &:hover:not(.disabled):not(.selected) .content-container {\n background-color: var(--neutral-white);\n }\n\n &.selected .content-container {\n background-color: var(--primary-lighter);\n }\n\n &.disabled {\n cursor: default;\n }\n}\n\n.content-container {\n display: flex;\n width: 100%;\n box-sizing: border-box;\n padding: #{$spacing-mini} #{$spacing-tiny};\n background-color: var(--neutral-purewhite);\n border-bottom: 1px solid var(--neutral-light);\n\n ::slotted(div[slot='action']) {\n display: flex;\n justify-content: end;\n }\n}\n\n.option-info {\n width: 100%;\n display: flex;\n align-items: center;\n align-content: center;\n justify-content: center;\n gap: #{$spacing-mini};\n flex-direction: row;\n box-sizing: border-box;\n cursor: pointer;\n\n cura-heading {\n width: 100%;\n margin-block: 0px;\n }\n\n ::slotted(div[slot='image']) {\n min-width: #{$spacing-m};\n display: flex;\n justify-content: center;\n align-items: center;\n }\n}\n","import { Component, Element, Event, EventEmitter, Host, Prop, State, Watch, h } from '@stencil/core';\n\n@Component({\n tag: 'cura-dropdown-search-option',\n styleUrl: 'cura-dropdown-search-option.scss',\n shadow: true,\n})\nexport class CuraDropdownSearchOption {\n /*\n The value of the dropdown search option.\n /\n @Prop({ reflect: true }) value: string;\n\n /\n Indicates if the dropdown search option is selected.\n /\n @Prop({ reflect: true, mutable: true }) selected: boolean = false;\n\n /\n Indicates if the dropdown search is selectable.\n /\n @Prop({ reflect: true }) selectable: boolean = true;\n\n /\n Indicates if the dropdown search option is hovered.\n /\n @Prop({ reflect: true, mutable: true }) hovered: boolean = false;\n\n @State() styles = {};\n\n /\n Event emitted when the option is selected.\n */\n @Event() optionSelected: EventEmitter<string>;\n\n @Element() hostElement: HTMLElement;\n\n weights;\n\n connectedCallback() {\n this.weights = window.CuraAPI.theme.fonts.getWeights();\n this.styles['--base-spacing'] = window.CuraAPI.theme.spacing.getSpacing();\n this.styles['--neutral-purewhite'] = window.CuraAPI.theme.colors.getColor(`neutral-purewhite`);\n this.styles['--neutral-light'] = window.CuraAPI.theme.colors.getColor(`neutral-light`);\n this.styles['--neutral-white'] = window.CuraAPI.theme.colors.getColor(`neutral-white`);\n this.styles['--primary-lighter'] = window.CuraAPI.theme.colors.getColor(`primary-lighter`, 50);\n }\n\n private handleOptionClick = (e: Event) => {\n if (this.selectable) {\n this.selected = !this.selected;\n this.optionSelected.emit(this.value);\n this.updateIconColor();\n } else {\n e.preventDefault();\n e.stopImmediatePropagation();\n }\n };\n\n componentDidLoad() {\n this.updateIconColor();\n }\n\n @Watch('selected')\n private updateIconColor() {\n const iconElement = this.hostElement.querySelector('[slot=\"image\"] cura-icon');\n if (iconElement) {\n iconElement.setAttribute('color', this.selected ? 'primary' : 'neutral-dark');\n }\n }\n\n render() {\n return (\n <Host slot=\"dropdown-search-option\">\n <div\n style={this.styles}\n class={{\n \"option-container\": true,\n hovered: this.selectable ? this.hovered : false,\n selected: this.selected,\n disabled: !this.selectable\n }}>\n <div class=\"content-container\">\n <div class=\"option-info\" onClick={(e) => this.handleOptionClick(e)}>\n <slot name=\"image\"></slot>\n <cura-heading size=\"xsmall\" lineHeight=\"16px\" marginBlock=\"0px\" weight=\"bold\" color=\"neutral-black\">\n <slot></slot>\n </cura-heading>\n </div>\n <slot name=\"action\"></slot>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"cura-dropdown-search-option.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,2BAA2B,GAAG,8kCAA8kC,CAAC;AACnnC,uCAAe,2BAA2B;;MCM7B,wBAAwB;;;;QAyC3B,sBAAiB,GAAG,CAAC,CAAQ;YACnC,IAAI,IAAI,CAAC,UAAU,EAAE;gBACnB,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC;gBAC/B,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;gBACrC,IAAI,CAAC,eAAe,EAAE,CAAC;aACxB;iBAAM;gBACL,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,CAAC,CAAC,wBAAwB,EAAE,CAAC;aAC9B;SACF,CAAC;;wBAzC0D,KAAK;0BAKlB,IAAI;uBAKQ,KAAK;sBAE9C,EAAE;;IAWpB,iBAAiB;QACf,IAAI,CAAC,OAAO,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,UAAU,EAAE,CAAC;QACvD,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC;QAC1E,IAAI,CAAC,MAAM,CAAC,qBAAqB,CAAC,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,mBAAmB,CAAC,CAAC;QAC/F,IAAI,CAAC,MAAM,CAAC,iBAAiB,CAAC,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,eAAe,CAAC,CAAC;QACvF,IAAI,CAAC,MAAM,CAAC,iBAAiB,CAAC,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,eAAe,CAAC,CAAC;QACvF,IAAI,CAAC,MAAM,CAAC,mBAAmB,CAAC,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,iBAAiB,EAAE,EAAE,CAAC,CAAC;KAChG;IAaD,gBAAgB;QACd,IAAI,CAAC,eAAe,EAAE,CAAC;KACxB;IAGO,eAAe;QACrB,MAAM,WAAW,GAAG,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,0BAA0B,CAAC,CAAC;QAC/E,IAAI,WAAW,EAAE;YACf,WAAW,CAAC,YAAY,CAAC,OAAO,EAAE,IAAI,CAAC,QAAQ,GAAG,SAAS,GAAG,cAAc,CAAC,CAAC;SAC/E;KACF;IAED,MAAM;QACJ,QACEA,QAACC,UAAI,qDAAC,IAAI,EAAC,wBAAwB,IACjCD,kEACE,KAAK,EAAE,IAAI,CAAC,MAAM,EAClB,KAAK,EAAE;gBACL,kBAAkB,EAAE,IAAI;gBACxB,OAAO,EAAE,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,OAAO,GAAG,KAAK;gBAC/C,QAAQ,EAAE,IAAI,CAAC,QAAQ;gBACvB,QAAQ,EAAE,CAAC,IAAI,CAAC,UAAU;aAC3B,IACDA,kEAAK,KAAK,EAAC,mBAAmB,IAC5BA,kEAAK,KAAK,EAAC,aAAa,EAAC,OAAO,EAAE,CAAC,CAAC,KAAK,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,IAChEA,mEAAM,IAAI,EAAC,OAAO,GAAQ,EAC1BA,2EAAc,IAAI,EAAC,QAAQ,EAAC,UAAU,EAAC,MAAM,EAAC,WAAW,EAAC,KAAK,EAAC,MAAM,EAAC,MAAM,EAAC,KAAK,EAAC,eAAe,IACjGA,oEAAa,CACA,CACX,EACNA,mEAAM,IAAI,EAAC,QAAQ,GAAQ,CACvB,CACF,CACD,EACP;KACH;;;;;;;;;;","names":["h","Host"],"sources":["src/components/forms/cura-dropdown-search/cura-dropdown-search-option/cura-dropdown-search-option.scss?tag=cura-dropdown-search-option&encapsulation=shadow","src/components/forms/cura-dropdown-search/cura-dropdown-search-option/cura-dropdown-search-option.tsx"],"sourcesContent":["@import \"../../../../scss/mixins/spacing.scss\";\n\n:host {\n display: block;\n box-sizing: border-box;\n width: 100%;\n}\n\n:host(:last-of-type) .content-container {\n border-bottom: none;\n}\n\n.option-container {\n width: 100%;\n display: flex;\n\n &:hover:not(.disabled):not(.selected) .content-container {\n background-color: var(--neutral-white);\n }\n\n &.selected .content-container {\n background-color: var(--primary-lighter);\n }\n\n &.disabled {\n cursor: default;\n }\n}\n\n.content-container {\n display: flex;\n width: 100%;\n box-sizing: border-box;\n padding: #{$spacing-mini} #{$spacing-tiny};\n background-color: var(--neutral-purewhite);\n border-bottom: 1px solid var(--neutral-light);\n\n ::slotted(div[slot='action']) {\n display: flex;\n justify-content: end;\n }\n}\n\n.option-info {\n width: 100%;\n display: flex;\n align-items: center;\n align-content: center;\n justify-content: center;\n gap: #{$spacing-mini};\n flex-direction: row;\n box-sizing: border-box;\n cursor: pointer;\n\n cura-heading {\n width: 100%;\n margin-block: 0px;\n }\n\n ::slotted(div[slot='image']) {\n min-width: #{$spacing-m};\n display: flex;\n justify-content: center;\n align-items: center;\n }\n}\n","import { Component, Element, Event, EventEmitter, Host, Prop, State, Watch, h } from '@stencil/core';\n\n@Component({\n tag: 'cura-dropdown-search-option',\n styleUrl: 'cura-dropdown-search-option.scss',\n shadow: true,\n})\nexport class CuraDropdownSearchOption {\n /*\n The value of the dropdown search option.\n /\n @Prop({ reflect: true }) value: string;\n\n /\n Indicates if the dropdown search option is selected.\n /\n @Prop({ reflect: true, mutable: true }) selected: boolean = false;\n\n /\n Indicates if the dropdown search is selectable.\n /\n @Prop({ reflect: true }) selectable: boolean = true;\n\n /\n Indicates if the dropdown search option is hovered.\n /\n @Prop({ reflect: true, mutable: true }) hovered: boolean = false;\n\n @State() styles = {};\n\n /\n Event emitted when the option is selected.\n */\n @Event() optionSelected: EventEmitter<string>;\n\n @Element() hostElement: HTMLElement;\n\n weights;\n\n connectedCallback() {\n this.weights = window.CuraAPI.theme.fonts.getWeights();\n this.styles['--base-spacing'] = window.CuraAPI.theme.spacing.getSpacing();\n this.styles['--neutral-purewhite'] = window.CuraAPI.theme.colors.getColor(`neutral-purewhite`);\n this.styles['--neutral-light'] = window.CuraAPI.theme.colors.getColor(`neutral-light`);\n this.styles['--neutral-white'] = window.CuraAPI.theme.colors.getColor(`neutral-white`);\n this.styles['--primary-lighter'] = window.CuraAPI.theme.colors.getColor(`primary-lighter`, 50);\n }\n\n private handleOptionClick = (e: Event) => {\n if (this.selectable) {\n this.selected = !this.selected;\n this.optionSelected.emit(this.value);\n this.updateIconColor();\n } else {\n e.preventDefault();\n e.stopImmediatePropagation();\n }\n };\n\n componentDidLoad() {\n this.updateIconColor();\n }\n\n @Watch('selected')\n private updateIconColor() {\n const iconElement = this.hostElement.querySelector('[slot=\"image\"] cura-icon');\n if (iconElement) {\n iconElement.setAttribute('color', this.selected ? 'primary' : 'neutral-dark');\n }\n }\n\n render() {\n return (\n <Host slot=\"dropdown-search-option\">\n <div\n style={this.styles}\n class={{\n \"option-container\": true,\n hovered: this.selectable ? this.hovered : false,\n selected: this.selected,\n disabled: !this.selectable\n }}>\n <div class=\"content-container\">\n <div class=\"option-info\" onClick={(e) => this.handleOptionClick(e)}>\n <slot name=\"image\"></slot>\n <cura-heading size=\"xsmall\" lineHeight=\"16px\" marginBlock=\"0px\" weight=\"bold\" color=\"neutral-black\">\n <slot></slot>\n </cura-heading>\n </div>\n <slot name=\"action\"></slot>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/cjs/cura-dropdown-search.cjs.entry.js CHANGED Viewed

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-e6d728ec.js');
+const index = require('./index-12d54921.js');
 const curaDropdownSearchCss = ":host{display:block;width:100%;box-sizing:border-box}.dropdown{display:flex;position:relative;flex-direction:column;width:inherit}.dropdown .dropdown-search-list{z-index:1000}.dropdown-input-search{width:100%;display:flex;justify-content:center;align-items:center;background:transparent}.dropdown-input-search.dropdown-open ::part(cura-input-field){border-radius:4px 4px 0px 0px}.dropdown-input-search.dropdown-open ::slotted([slot=helperText]){display:none}.dropdown-input-search.dropdown-open cura-input-text ::slotted([slot=helperText]){display:none}.dropdown-search-list{position:absolute;top:calc(100% - 8px);width:100%;max-height:var(--dropdown-max-height);padding:12px 12px;margin:0;box-sizing:border-box;box-shadow:0px 4px 8px 0px var(--neutral-black-shadow, rgba(38, 38, 38, 0.16));border-radius:0px 0px 4px 4px;border-top:0 var(--neutral-light);border-right:2px solid var(--neutral-light);border-bottom:2px solid var(--neutral-light);border-left:2px solid var(--neutral-light);background-color:var(--neutral-purewhite);list-style:none;overflow-y:auto;display:none}.dropdown-search-list.visible{display:block}.dropdown-search-list-input-search{width:inherit;display:flex;justify-content:center;align-items:center;padding:16px 8px;border-bottom:2px solid var(--info-base);background-color:var(--neutral-purewhite)}.dropdown-search-list-input-search cura-input-text{width:inherit}.dropdown-search-list-input-search.error{background-color:var(--error-lighter);border-bottom:2px solid var(--error-dark)}.dropdown-mobile{position:fixed;top:1%;left:0;right:0;width:100%;z-index:10000}.dropdown-mobile .dropdown-input-search{display:flex;background-color:var(--neutral-purewhite);border-bottom:2px solid var(--info-base);z-index:10000}.dropdown-mobile .dropdown-input-search cura-button-transparent{display:flex;margin-right:4px}.dropdown-mobile .dropdown-input-search cura-input-text{padding:12px 8px 12px 0px}.dropdown-mobile .dropdown-input-search.error{background-color:var(--error-lighter);border-bottom:2px solid var(--error-dark)}.dropdown-mobile .dropdown-input-search.dropdown-open{display:flex}.dropdown-mobile .dropdown-input-search.dropdown-open ::slotted([slot=helperText]){display:block}.dropdown-mobile .dropdown-search-list{position:static;width:100%;height:calc(100vh - var(--dynamic-input-search-height, 0));max-height:none;padding:12px 12px;margin:0;box-sizing:border-box;box-shadow:none;border:none;background-color:var(--neutral-purewhite);list-style:none;overflow-y:auto;z-index:10000}";
 const CuraDropdownSearchStyle0 = curaDropdownSearchCss;
@@ -269,9 +269,9 @@ const CuraDropdownSearch = class {
     }
     render() {
         const isMobileDropdown = this.isMobile && this.isDropdownOpen;
-        return (index.h(index.Host, { key: '29caf35386c324e85a5b68caa280193e8f1a3aae', style: this.hostCSSProperties(), class: "dropdown-overlay" }, index.h("div", { key: '879dc628c89920323a97f5b29aeadf6e774615ef', class: `dropdown ${isMobileDropdown ? 'dropdown-mobile' : ''}`, style: this.styles }, index.h("div", { key: '31c2df66c5311abedfd1661fb9d8b135dde4ea8a', class: this.getClasses() }, this.isMobile && this.isDropdownOpen && (index.h("cura-button-transparent", { key: '418fa19788b7dd8374d4c9c78837ad89c9f11f9e', fontColor: "dark", onClick: () => this.handleGoBack(), iconName: "arrowLeft", size: "medium", iconOnly: true, color: "primary" })), index.h("cura-input-text", { key: '78dfa84f63f4a5a3b72f94e589b9c362d8e78e19', disabled: this.disabled, label: this.label, part: "cura-input-field", mode: isMobileDropdown ? 'transparent' : 'default', required: this.required, hideErrorIcon: this.status === 'error', iconName: this.iconName || 'search', value: this.value, status: this.status, onValueChange: e => this.onValueChange(e.target.value), onInput: e => this.handleInputChange(e), onFocus: () => this.handleOnFocus(), onClick: () => (window.innerWidth < 768 ? (this.isMobile = true) : null), onBlur: () => {
+        return (index.h(index.Host, { key: '8e47b4652a5f7143b9f9d8704105624debd5ab86', style: this.hostCSSProperties(), class: "dropdown-overlay" }, index.h("div", { key: 'a5c9a6878be61268fb2a6fe5f42c3811aaa25e92', class: `dropdown ${isMobileDropdown ? 'dropdown-mobile' : ''}`, style: this.styles }, index.h("div", { key: 'c10d5a2793e7961370f63b124eb8538c0fe161a2', class: this.getClasses() }, this.isMobile && this.isDropdownOpen && (index.h("cura-button-transparent", { key: 'a5d8233857277aa56c7d4d8048c8d8199635f117', fontColor: "dark", onClick: () => this.handleGoBack(), iconName: "arrowLeft", size: "medium", iconOnly: true, color: "primary" })), index.h("cura-input-text", { key: '1f780e794a2e42fa4771f9f6f5cb04f44d5d17d3', disabled: this.disabled, label: this.label, part: "cura-input-field", mode: isMobileDropdown ? 'transparent' : 'default', required: this.required, hideErrorIcon: this.status === 'error', iconName: this.iconName || 'search', value: this.value, status: this.status, onValueChange: e => this.onValueChange(e.target.value), onInput: e => this.handleInputChange(e), onFocus: () => this.handleOnFocus(), onClick: () => (window.innerWidth < 768 ? (this.isMobile = true) : null), onBlur: () => {
                 this.handleOnBlur();
-            }, placeholder: this.placeholder, size: this.size, onKeyDown: this.handleKeyDown }, index.h("slot", { key: 'e7f13fc467083f08b4666f4323b8734fb734fe1c', name: "helperText" }))), index.h("div", { key: '9a39a16c1dfefd6481593ce062036e19cd1b65fa', id: "dropdown-search-list", class: this.getDropdownClasses() }, index.h("slot", { key: '36af7eb7212ea066af0edb68b5e12bf9f931fae1', name: "dropdown-search-option", onSlotchange: this.handleSlotChange })))));
+            }, placeholder: this.placeholder, size: this.size, onKeyDown: this.handleKeyDown }, index.h("slot", { key: '87882a490816c64d8780ce4a02b975034e111473', name: "helperText" }))), index.h("div", { key: 'b0120ab7c2db1a5dcc071e4b79f9aac7d50ae998', id: "dropdown-search-list", class: this.getDropdownClasses() }, index.h("slot", { key: 'b780c4b317c6aa557a6be5fe3d4c957d943b92c8', name: "dropdown-search-option", onSlotchange: this.handleSlotChange })))));
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {

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

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-e6d728ec.js');
+const index = require('./index-12d54921.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"];
@@ -24,7 +24,7 @@ const CuraIconsView = class {
         this.sizes.unshift(this.sizes.pop());
     }
     render() {
-        return (index.h(index.Host, { key: '4918bc5d13f24f3133af45ce5991b3f3f43e99cf' }, index.h("div", { key: '837d47976a39702b13ceb5a7c5ac8ae097d34988', class: "iconDetail" }, index.h("cura-heading", { key: 'de4c75c4652b464991aa173cf7243db65f9ba2ba', size: "small", "margin-block": "0 24px" }, "Icon: ", index.h("b", { key: '77591ce199e5140ddcde3d7b956586d27fe6bc05' }, this.selected)), index.h("div", { key: '6da36b174603d48ab3b11a8490c424f164855147', class: "iconSizes" }, this.sizes.map(size => index.h("div", { class: "size" }, index.h("cura-icon", { name: this.selected, size: size }), index.h("span", null, size)))), index.h("div", { key: '4920c8010e0a55f80bb557f4ba0e537b7861ae36', class: "iconSizes invert" }, this.sizes.map(size => index.h("div", { class: "size" }, index.h("cura-icon", { name: this.selected, size: size, color: "neutral-white" }), index.h("span", null, size))))), index.h("div", { key: '99739b351fb25036efd4b55774c0f077058be8fc', class: "icons" }, iconsetdefaulticons.map(icon => index.h("div", { class: { icon: true, selected: icon === this.selected }, onClick: () => this.setSelected(icon) }, index.h("cura-icon", { name: icon, size: "32", color: icon === this.selected ? 'accent-dark' : 'neutral-dark' }), index.h("cura-label", { size: "xsmall", weight: icon === this.selected ? 'bold' : 'regular', color: icon === this.selected ? 'accent-dark' : 'neutral-dark' }, icon))))));
+        return (index.h(index.Host, { key: '08ac6235b9218c2202cd4957bb78100216b5b680' }, index.h("div", { key: '71856330d5f050d46b83c06125d29a235532bf98', class: "iconDetail" }, index.h("cura-heading", { key: '2520247cde8d71b1a31ce028c4525b04e6302bf1', size: "small", "margin-block": "0 24px" }, "Icon: ", index.h("b", { key: '5cf48d96ed36dd5514357c65b0ec8c9f137bb1e4' }, this.selected)), index.h("div", { key: '7eda1e7db5efc89abb583631a5e959e31397684f', class: "iconSizes" }, this.sizes.map(size => index.h("div", { class: "size" }, index.h("cura-icon", { name: this.selected, size: size }), index.h("span", null, size)))), index.h("div", { key: 'f443dab7e85fe89a207da8fbefb024b0c22fa084', class: "iconSizes invert" }, this.sizes.map(size => index.h("div", { class: "size" }, index.h("cura-icon", { name: this.selected, size: size, color: "neutral-white" }), index.h("span", null, size))))), index.h("div", { key: '5ea3b71259ae5454297a94aef4ce1e154c968512', class: "icons" }, iconsetdefaulticons.map(icon => index.h("div", { class: { icon: true, selected: icon === this.selected }, onClick: () => this.setSelected(icon) }, index.h("cura-icon", { name: icon, size: "32", color: icon === this.selected ? 'accent-dark' : 'neutral-dark' }), index.h("cura-label", { size: "xsmall", weight: icon === this.selected ? 'bold' : 'regular', color: icon === this.selected ? 'accent-dark' : 'neutral-dark' }, icon))))));
     }
 };
 CuraIconsView.style = CuraIconsViewStyle0;

package/dist/cjs/cura-input-date.cjs.entry.js CHANGED Viewed

@@ -2,10 +2,10 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-e6d728ec.js');
+const index = require('./index-12d54921.js');
 const index$1 = require('./index-6dc29195.js');
-const curaInputDateCss = ":host{display:block}.container{display:flex;flex-direction:column;position:relative}.container .calendar{padding:0px calc(var(--base-spacing) * 3px);margin-top:-8px;border-radius:0px 0px 4px 4px;border-top:0px;border-right:2px solid #D4D4D4;border-bottom:2px solid #D4D4D4;border-left:2px solid #D4D4D4;box-shadow:0px 4px 8px 0px var(--neutral-black-shadow, rgba(38, 38, 38, 0.16));position:absolute;top:100%;z-index:10;display:none;opacity:0;pointer-events:none}.container .calendar.visible{box-sizing:border-box;display:block;opacity:1;pointer-events:auto;width:100%;background-color:#fff}";
+const curaInputDateCss = ":host{display:block}.container{display:flex;flex-direction:column;position:relative}.container .calendar{padding:0px calc(var(--cura-spacing-base) * 3px);margin-top:-8px;border-radius:0px 0px 4px 4px;border-top:0px;border-right:2px solid #D4D4D4;border-bottom:2px solid #D4D4D4;border-left:2px solid #D4D4D4;box-shadow:0px 4px 8px 0px var(--neutral-black-shadow, rgba(38, 38, 38, 0.16));position:absolute;top:100%;z-index:10;display:none;opacity:0;pointer-events:none}.container .calendar.visible{box-sizing:border-box;display:block;opacity:1;pointer-events:auto;width:100%;background-color:#fff}";
 const CuraInputDateStyle0 = curaInputDateCss;
 const CuraInputDate = class {
@@ -173,7 +173,7 @@ const CuraInputDate = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: '1395108764c1957abb9371b82ab983d076aaf61e' }, index.h("div", { key: 'e3134a1cfbf6f07b83f148b3e1b9c699e273a098', class: "container", style: this.styles }, index.h("cura-input-text", { key: '507ce8cedd5a169832579ae3ea313d3b3d6813d2', label: this.label, name: this.name, status: this.status, value: this.value, onFocus: () => this.showCalendar(), size: this.size, "icon-name": this.iconName, placeholder: this.dateSettings.placeholder, "mask-preset": this.dateSettings.mask, "enable-selection-mode": true, onKeyUp: event => this.handleInputDates(event), autocomplete: "off", onValueChange: event => this.handleChangeDates(event) }, this.renderCalendarOrHelperText()))));
+        return (index.h(index.Host, { key: '6561926408fe00e541e6e7932a448f5a46cb5909' }, index.h("div", { key: '23e9db15f773d76e01c1dd0d7b71d6765a9a6c26', class: "container", style: this.styles }, index.h("cura-input-text", { key: '040e257cfaf01fbf0bd087d3abf0d159e7d1ac7a', label: this.label, name: this.name, status: this.status, value: this.value, onFocus: () => this.showCalendar(), size: this.size, "icon-name": this.iconName, placeholder: this.dateSettings.placeholder, "mask-preset": this.dateSettings.mask, "enable-selection-mode": true, onKeyUp: event => this.handleInputDates(event), autocomplete: "off", onValueChange: event => this.handleChangeDates(event) }, this.renderCalendarOrHelperText()))));
     }
     static get formAssociated() { return true; }
     get el() { return index.getElement(this); }

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

	@@ -1 +1 @@
1	- {"file":"cura-input-date.entry.cjs.js","mappings":";;;;;;;AAAA,MAAM,gBAAgB,GAAG,ilBAAilB,CAAC;AAC3mB,4BAAe,gBAAgB;;MCSlB,aAAa;;;;;qBAMkB,EAAE;sBAKsC,SAAS;oBAK7B,QAAQ;oBAK7B,EAAE;;;;;wBAyBE,EAAE;2BAKQ,IAAI;sBAczC,EAAE;iCAEkB,KAAK;qBAElB,EAAE;qBAED,EAAE;4BAEJ;YACtB,WAAW,EAAE,IAAI;YACjB,IAAI,EAAE,MAAM;YACZ,IAAI,EAAE,QAAQ;SACf;;IAED,iBAAiB;QACf,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC;QACxD,MAAM,OAAO,GAAG,KAAK,CAAC,UAAU,EAAE,CAAC;QAEnC,IAAI,CAAC,MAAM,GAAG;YACZ,gBAAgB,EAAE,OAAO,CAAC,UAAU,EAAE;YACtC,qBAAqB,EAAE,MAAM,CAAC,QAAQ,CAAC,mBAAmB,CAAC;YAC3D,mBAAmB,EAAE,MAAM,CAAC,QAAQ,CAAC,iBAAiB,CAAC;YACvD,gBAAgB,EAAE,MAAM,CAAC,QAAQ,CAAC,cAAc,CAAC;YACjD,aAAa,EAAE,KAAK,CAAC,OAAO,EAAE;YAC9B,cAAc,EAAE,KAAK,CAAC,QAAQ,EAAE;YAChC,eAAe,EAAE,KAAK,CAAC,SAAS,EAAE;YAClC,uBAAuB,EAAE,OAAO,CAAC,OAAO;SACzC,CAAC;KACH;IAED,iBAAiB;QACf,IAAI,CAAC,kBAAkB,EAAE,CAAC;KAC3B;;;;IAKD,sBAAsB,CAAC,IAA2B;QAChD,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC;KAC7B;IAGD,kBAAkB;QAChB,MAAM,WAAW,GAAG,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC;QAEhE,IAAI,IAAI,CAAC,wBAAwB,CAAC,WAAW,CAAC,EAAE;YAC9C,IAAI,CAAC,YAAY,GAAG,WAAW,CAAC;SACjC;KACF;IAED,eAAe,CAAC,OAAgB;QAC9B,OAAO;YACL,WAAW,EAAE,IAAI,CAAC,WAAW,KAAK,OAAO,GAAG,yBAAyB,GAAG,YAAY,CAAC;YACrF,IAAI,EAAE,OAAO,GAAG,WAAW,GAAG,MAAM;YACpC,IAAI,EAAE,OAAO,GAAG,OAAO,GAAG,QAAQ;SACnC,CAAC;KACH;IAED,wBAAwB,CAAC,WAAgB;QACvC,OAAO,IAAI,CAAC,YAAY,CAAC,WAAW,KAAK,WAAW,CAAC,WAAW,IAAI,IAAI,CAAC,YAAY,CAAC,IAAI,KAAK,WAAW,CAAC,IAAI,IAAI,IAAI,CAAC,YAAY,CAAC,IAAI,KAAK,WAAW,CAAC,IAAI,CAAC;KAChK;IAGD,WAAW,CAAC,EAAoB;QAC9B,IAAI,IAAI,CAAC,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,MAAM,CAAC,EAAE;YAC/B,OAAO;SACR;QACD,IAAI,CAAC,YAAY,EAAE,CAAC;KACrB;IAED,YAAY;QACV,IAAI,CAAC,iBAAiB,GAAG,KAAK,CAAC;KAChC;IAED,YAAY;QACV,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC;KAC/B;IAED,gBAAgB,CAAC,KAAU;QACzB,MAAM,UAAU,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;QAEtC,MAAM,cAAc,GAAG,qDAAqD,CAAC;QAC7E,MAAM,eAAe,GAAG,yBAAyB,CAAC;QAElD,IAAI,cAAc,CAAC,IAAI,CAAC,UAAU,CAAC,EAAE;YACnC,MAAM,OAAO,GAAG,UAAU,CAAC,KAAK,CAAC,cAAc,CAAC,CAAC;YACjD,MAAM,SAAS,GAAG,IAAI,CAAC,iBAAiB,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC;YACrD,MAAM,OAAO,GAAG,IAAI,CAAC,iBAAiB,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC;YACnD,IAAI,IAAI,CAAC,WAAW,CAAC,SAAS,CAAC,IAAI,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,EAAE;gBAC5D,IAAI,CAAC,MAAM,GAAG,SAAS,CAAC;gBACxB,IAAI,CAAC,KAAK,GAAG,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC;gBAClC,IAAI,CAAC,KAAK,GAAG,GAAG,IAAI,CAAC,iBAAiB,CAAC,SAAS,CAAC,MAAM,IAAI,CAAC,iBAAiB,CAAC,OAAO,CAAC,EAAE,CAAC;gBACzF,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;aAClC;iBAAM;gBACL,IAAI,CAAC,UAAU,EAAE,CAAC;aACnB;SACF;aAAM,IAAI,eAAe,CAAC,IAAI,CAAC,UAAU,CAAC,EAAE;YAC3C,MAAM,OAAO,GAAG,UAAU,CAAC,KAAK,CAAC,eAAe,CAAC,CAAC;YAClD,MAAM,UAAU,GAAG,IAAI,CAAC,iBAAiB,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC;YACtD,IAAI,IAAI,CAAC,WAAW,CAAC,UAAU,CAAC,EAAE;gBAChC,IAAI,CAAC,MAAM,GAAG,SAAS,CAAC;gBACxB,IAAI,CAAC,KAAK,GAAG,CAAC,UAAU,CAAC,CAAC;gBAC1B,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,iBAAiB,CAAC,UAAU,CAAC,CAAC;gBAChD,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;aAClC;iBAAM;gBACL,IAAI,CAAC,UAAU,EAAE,CAAC;aACnB;SACF;aAAM;YACL,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC;SACjB;KACF;IAED,iBAAiB,CAAC,KAAgD;QAChE,IAAI,KAAK,CAAC,MAAM,KAAK,EAAE,EAAE;YACvB,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC;YAChB,IAAI,CAAC,MAAM,GAAG,SAAS,CAAC;YACxB,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC;YAChB,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;YACjC,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;SAC1C;KACF;IAED,WAAW,CAAC,IAAU;QACpB,MAAM,KAAK,GAAG,IAAI,IAAI,EAAE,CAAC;QACzB,KAAK,CAAC,QAAQ,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;QAE3B,IAAI,IAAI,CAAC,gBAAgB;YAAE,OAAO,CAACA,gBAAQ,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;QACzD,IAAI,IAAI,CAAC,kBAAkB;YAAE,OAAO,CAACC,eAAO,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;QAC1D,OAAO,IAAI,CAAC;KACb;IAED,iBAAiB,CAAC,UAAkB;QAClC,MAAM,CAAC,GAAG,EAAE,KAAK,EAAE,IAAI,CAAC,GAAG,UAAU,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC;QAC7D,OAAO,IAAI,IAAI,CAAC,IAAI,EAAE,KAAK,GAAG,CAAC,EAAE,GAAG,CAAC,CAAC;KACvC;IAED,iBAAiB,CAAC,IAAU;QAC1B,MAAM,GAAG,GAAG,MAAM,CAAC,IAAI,CAAC,OAAO,EAAE,CAAC,CAAC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC;QACpD,MAAM,KAAK,GAAG,MAAM,CAAC,IAAI,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC;QAC3D,MAAM,IAAI,GAAG,IAAI,CAAC,WAAW,EAAE,CAAC;QAEhC,OAAO,GAAG,GAAG,IAAI,KAAK,IAAI,IAAI,EAAE,CAAC;KAClC;IAED,UAAU;QACR,IAAI,CAAC,MAAM,GAAG,OAAO,CAAC;QACtB,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC;QAChB,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;KAC1C;IAED,0BAA0B;QACxB,IAAI,IAAI,CAAC,iBAAiB,EAAE;YAC1B,QACEC,iBAAK,KAAK,EAAC,kBAAkB,IAC3BA,2BACE,WAAW,EAAE,IAAI,CAAC,KAAK,EACvB,IAAI,EAAE,IAAI,CAAC,YAAY,CAAC,IAA0B,EAClD,KAAK,EAAC,MAAM,EACZ,QAAQ,EAAC,OAAO,EAChB,QAAQ,EAAE,KAAK,EACf,QAAQ,EAAE,KAAK,EACf,kBAAkB,EAAE,IAAI,CAAC,kBAAkB,EAC3C,gBAAgB,EAAE,IAAI,CAAC,gBAAgB,EACvC,aAAa,EAAE,CAAC;oBACd,MAAM,IAAI,GAAG,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC;oBAC3B,IAAI,IAAI,CAAC,MAAM,KAAK,CAAC,EAAE;wBACrB,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC;qBAC9C;yBAAM,IAAI,IAAI,CAAC,MAAM,GAAG,CAAC,EAAE;wBAC1B,IAAI,CAAC,KAAK,GAAG,GAAG,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,MAAM,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC;qBACtG;yBAAM;wBACL,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC;qBACjB;oBACD,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;iBAClC,GACD,CACE,EACN;SACH;aAAM;YACL,OAAO,IAAI,CAAC,UAAU,CAAC;SACxB;KACF;IAED,MAAM;QACJ,QACEA,QAACC,UAAI,uDACHD,kEAAK,KAAK,EAAC,WAAW,EAAC,KAAK,EAAE,IAAI,CAAC,MAAM,IACvCA,8EACE,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,OAAO,EAAE,MAAM,IAAI,CAAC,YAAY,EAAE,EAClC,IAAI,EAAE,IAAI,CAAC,IAAI,eACJ,IAAI,CAAC,QAAQ,EACxB,WAAW,EAAE,IAAI,CAAC,YAAY,CAAC,WAAW,iBAC7B,IAAI,CAAC,YAAY,CAAC,IAAI,2BACZ,IAAI,EAC3B,OAAO,EAAE,KAAK,IAAI,IAAI,CAAC,gBAAgB,CAAC,KAAK,CAAC,EAC9C,YAAY,EAAC,KAAK,EAClB,aAAa,EAAE,KAAK,IAAI,IAAI,CAAC,iBAAiB,CAAC,KAAK,CAAC,IAEpD,IAAI,CAAC,0BAA0B,EAAE,CAClB,CACd,CACD,EACP;KACH;;;;;;;;;;;","names":["isBefore","isAfter","h","Host"],"sources":["src/components/forms/cura-input-date/cura-input-date.scss?tag=cura-input-date&encapsulation=shadow","src/components/forms/cura-input-date/cura-input-date.tsx"],"sourcesContent":["@import '../../../../src/scss/mixins/shadows.scss';\n@import '../../../../src/scss/mixins/spacing.scss';\n\n:host {\n display: block;\n}\n\n.container{\n display: flex;\n flex-direction: column;\n position: relative;\n\n .calendar{\n padding: #{$spacing-none} #{$spacing-xxxs};\n margin-top: -8px;\n border-radius: 0px 0px 4px 4px;\n border-top: 0px;\n border-right: 2px solid #D4D4D4;\n border-bottom:2px solid #D4D4D4;\n border-left: 2px solid #D4D4D4;\n @include shadow-level3(--neutral-black-shadow);\n position: absolute;\n top: 100%; \n z-index: 10; \n display: none; \n opacity: 0;\n pointer-events: none; \n }\n\n .calendar.visible {\n box-sizing: border-box;\n display: block;\n opacity: 1;\n pointer-events: auto; \n width: 100%;\n background-color: #fff;\n }\n}\n","import { Component, Element, Host, Listen, Prop, State, Watch, h, Event, EventEmitter } from '@stencil/core';\nimport { CuraInputTextCustomEvent } from '../../../components';\nimport { isAfter, isBefore } from 'date-fns';\n\n@Component({\n tag: 'cura-input-date',\n styleUrl: 'cura-input-date.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class CuraInputDate {\n @Element() el: HTMLElement;\n\n /*\n Label text for the input date\n /\n @Prop({ reflect: true }) label?: string = '';\n\n /\n Indicates input status (default: default)\n /\n @Prop({ reflect: true, mutable: true }) status: 'error' \| 'success' \| 'default' = 'default';\n\n /\n Size of the input mode default: 'small', 'medium', or 'large' (default: 'medium')\n /\n @Prop({ reflect: true }) size: 'small' \| 'medium' \| 'large' = 'medium';\n\n /\n Name text for the input date\n /\n @Prop({ reflect: true }) name?: string = '';\n\n /\n Helper text displayed below the input\n /\n @Prop({ reflect: true }) helperText?: string;\n\n /\n Enables the date range selection mode, allowing users to select a period of dates\n /\n @Prop({ reflect: true }) enableRangeDates: boolean;\n\n /\n Controls whether future dates (dates before the current date) should be disabled\n /\n @Prop({ reflect: true }) disableFutureDates: boolean;\n\n /\n Controls whether past dates (dates before the current date) should be disabled\n /\n @Prop({ reflect: true }) disablePassDates: boolean;\n\n /\n Whether to display a cura icon (default: null)\n /\n @Prop({ reflect: true }) iconName?: string = '';\n\n /\n Placeholder text for the input\n /\n @Prop({ reflect: true }) placeholder?: string \| null = null;\n\n /\n Emitted when the value of the input changes\n * @type {EventEmitter<string>}\n /\n @Event() dateChange: EventEmitter<string>;\n\n /\n Emitted when the value of the status changes\n * @type {EventEmitter<string>}\n /\n @Event() statusInputChange: EventEmitter<string>;\n\n @State() styles = {};\n\n @State() isCalendarVisible: boolean = false;\n\n @State() dates: Date[] = [];\n\n @State() value?: string = '';\n\n @State() dateSettings = {\n placeholder: null,\n mask: 'date',\n mode: 'single',\n };\n\n connectedCallback() {\n const { fonts, colors, spacing } = window.CuraAPI.theme;\n const weights = fonts.getWeights();\n\n this.styles = {\n '--base-spacing': spacing.getSpacing(),\n '--neutral-purewhite': colors.getColor('neutral-purewhite'),\n '--neutral-lighter': colors.getColor('neutral-lighter'),\n '--neutral-base': colors.getColor('neutral-base'),\n '--font-size': fonts.getSize(),\n '--font-color': fonts.getColor(),\n '--font-family': fonts.getFamily(),\n '--font-weight-regular': weights.regular,\n };\n }\n\n componentWillLoad() {\n this.updateDateSettings();\n }\n\n /\n Callback for form association\n /\n formAssociatedCallback(form: { ariaLabel: string }) {\n form.ariaLabel = this.label;\n }\n\n @Watch('enableRangeDates')\n updateDateSettings() {\n const newSettings = this.getDateSettings(this.enableRangeDates);\n\n if (this.shouldUpdateDateSettings(newSettings)) {\n this.dateSettings = newSettings;\n }\n }\n\n getDateSettings(isRange: boolean) {\n return {\n placeholder: this.placeholder \|\| (isRange ? 'dd/mm/aaaa - dd/mm/aaaa' : 'dd/mm/aaaa'),\n mask: isRange ? 'dateRange' : 'date',\n mode: isRange ? 'range' : 'single',\n };\n }\n\n shouldUpdateDateSettings(newSettings: any) {\n return this.dateSettings.placeholder !== newSettings.placeholder \|\| this.dateSettings.mask !== newSettings.mask \|\| this.dateSettings.mode !== newSettings.mode;\n }\n\n @Listen('click', { target: 'window' })\n handleClick(ev: { target: Node }) {\n if (this.el.contains(ev.target)) {\n return;\n }\n this.hideCalendar();\n }\n\n hideCalendar() {\n this.isCalendarVisible = false;\n }\n\n showCalendar() {\n this.isCalendarVisible = true;\n }\n\n handleInputDates(event: any) {\n const inputValue = event.target.value;\n\n const dateRangeRegex = /^(\\d{2}\\/\\d{2}\\/\\d{4})\\s-\\s*(\\d{2}\\/\\d{2}\\/\\d{4})$/;\n const simpleDateRegex = /^(\\d{2}\\/\\d{2}\\/\\d{4})$/;\n\n if (dateRangeRegex.test(inputValue)) {\n const matches = inputValue.match(dateRangeRegex);\n const startDate = this.parseStringToDate(matches[1]);\n const endDate = this.parseStringToDate(matches[2]);\n if (this.isDateValid(startDate) && this.isDateValid(endDate)) {\n this.status = 'default';\n this.dates = [startDate, endDate];\n this.value = `${this.parseDateToString(startDate)} - ${this.parseDateToString(endDate)}`;\n this.dateChange.emit(this.value);\n } else {\n this.resetDates();\n }\n } else if (simpleDateRegex.test(inputValue)) {\n const matches = inputValue.match(simpleDateRegex);\n const singleDate = this.parseStringToDate(matches[1]);\n if (this.isDateValid(singleDate)) {\n this.status = 'default';\n this.dates = [singleDate];\n this.value = this.parseDateToString(singleDate);\n this.dateChange.emit(this.value);\n } else {\n this.resetDates();\n }\n } else {\n this.dates = [];\n }\n }\n\n handleChangeDates(event: CuraInputTextCustomEvent<string \| number>) {\n if (event.detail === '') {\n this.dates = [];\n this.status = 'default';\n this.value = '';\n this.dateChange.emit(this.value);\n this.statusInputChange.emit(this.status);\n }\n }\n\n isDateValid(date: Date) {\n const today = new Date();\n today.setHours(0, 0, 0, 0);\n\n if (this.disablePassDates) return !isBefore(date, today);\n if (this.disableFutureDates) return !isAfter(date, today);\n return true;\n }\n\n parseStringToDate(dateString: string): Date {\n const [day, month, year] = dateString.split('/').map(Number);\n return new Date(year, month - 1, day);\n }\n\n parseDateToString(date: Date): string {\n const day = String(date.getDate()).padStart(2, '0');\n const month = String(date.getMonth() + 1).padStart(2, '0');\n const year = date.getFullYear();\n\n return `${day}/${month}/${year}`;\n }\n\n resetDates() {\n this.status = 'error';\n this.dates = [];\n this.statusInputChange.emit(this.status);\n }\n\n renderCalendarOrHelperText() {\n if (this.isCalendarVisible) {\n return (\n <div class=\"calendar visible\">\n <cura-calendar\n customDates={this.dates}\n mode={this.dateSettings.mode as 'single' \| 'range'}\n width=\"100%\"\n maxWidth=\"400px\"\n embedded={false}\n floating={false}\n disableFutureDates={this.disableFutureDates}\n disablePassDates={this.disablePassDates}\n onOnchangeday={e => {\n const days = e.detail.days;\n if (days.length === 1) {\n this.value = this.parseDateToString(days[0]);\n } else if (days.length > 0) {\n this.value = `${this.parseDateToString(days[0])} - ${this.parseDateToString(days[days.length - 1])}`;\n } else {\n this.value = '';\n }\n this.dateChange.emit(this.value);\n }}\n />\n </div>\n );\n } else {\n return this.helperText;\n }\n }\n\n render() {\n return (\n <Host>\n <div class=\"container\" style={this.styles}>\n <cura-input-text\n label={this.label}\n name={this.name}\n status={this.status}\n value={this.value}\n onFocus={() => this.showCalendar()}\n size={this.size}\n icon-name={this.iconName}\n placeholder={this.dateSettings.placeholder}\n mask-preset={this.dateSettings.mask}\n enable-selection-mode={true}\n onKeyUp={event => this.handleInputDates(event)}\n autocomplete=\"off\"\n onValueChange={event => this.handleChangeDates(event)}\n >\n {this.renderCalendarOrHelperText()}\n </cura-input-text>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"cura-input-date.entry.cjs.js","mappings":"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","names":["isBefore","isAfter","h","Host"],"sources":["src/components/forms/cura-input-date/cura-input-date.scss?tag=cura-input-date&encapsulation=shadow","src/components/forms/cura-input-date/cura-input-date.tsx"],"sourcesContent":["@import '../../../../src/scss/mixins/shadows.scss';\n@import '../../../../src/scss/mixins/spacing.scss';\n\n:host {\n display: block;\n}\n\n.container{\n display: flex;\n flex-direction: column;\n position: relative;\n\n .calendar{\n padding: #{$spacing-none} #{$spacing-xxxs};\n margin-top: -8px;\n border-radius: 0px 0px 4px 4px;\n border-top: 0px;\n border-right: 2px solid #D4D4D4;\n border-bottom:2px solid #D4D4D4;\n border-left: 2px solid #D4D4D4;\n @include shadow-level3(--neutral-black-shadow);\n position: absolute;\n top: 100%; \n z-index: 10; \n display: none; \n opacity: 0;\n pointer-events: none; \n }\n\n .calendar.visible {\n box-sizing: border-box;\n display: block;\n opacity: 1;\n pointer-events: auto; \n width: 100%;\n background-color: #fff;\n }\n}\n","import { Component, Element, Host, Listen, Prop, State, Watch, h, Event, EventEmitter } from '@stencil/core';\nimport { CuraInputTextCustomEvent } from '../../../components';\nimport { isAfter, isBefore } from 'date-fns';\n\n@Component({\n tag: 'cura-input-date',\n styleUrl: 'cura-input-date.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class CuraInputDate {\n @Element() el: HTMLElement;\n\n /*\n Label text for the input date\n /\n @Prop({ reflect: true }) label?: string = '';\n\n /\n Indicates input status (default: default)\n /\n @Prop({ reflect: true, mutable: true }) status: 'error' \| 'success' \| 'default' = 'default';\n\n /\n Size of the input mode default: 'small', 'medium', or 'large' (default: 'medium')\n /\n @Prop({ reflect: true }) size: 'small' \| 'medium' \| 'large' = 'medium';\n\n /\n Name text for the input date\n /\n @Prop({ reflect: true }) name?: string = '';\n\n /\n Helper text displayed below the input\n /\n @Prop({ reflect: true }) helperText?: string;\n\n /\n Enables the date range selection mode, allowing users to select a period of dates\n /\n @Prop({ reflect: true }) enableRangeDates: boolean;\n\n /\n Controls whether future dates (dates before the current date) should be disabled\n /\n @Prop({ reflect: true }) disableFutureDates: boolean;\n\n /\n Controls whether past dates (dates before the current date) should be disabled\n /\n @Prop({ reflect: true }) disablePassDates: boolean;\n\n /\n Whether to display a cura icon (default: null)\n /\n @Prop({ reflect: true }) iconName?: string = '';\n\n /\n Placeholder text for the input\n /\n @Prop({ reflect: true }) placeholder?: string \| null = null;\n\n /\n Emitted when the value of the input changes\n * @type {EventEmitter<string>}\n /\n @Event() dateChange: EventEmitter<string>;\n\n /\n Emitted when the value of the status changes\n * @type {EventEmitter<string>}\n /\n @Event() statusInputChange: EventEmitter<string>;\n\n @State() styles = {};\n\n @State() isCalendarVisible: boolean = false;\n\n @State() dates: Date[] = [];\n\n @State() value?: string = '';\n\n @State() dateSettings = {\n placeholder: null,\n mask: 'date',\n mode: 'single',\n };\n\n connectedCallback() {\n const { fonts, colors, spacing } = window.CuraAPI.theme;\n const weights = fonts.getWeights();\n\n this.styles = {\n '--base-spacing': spacing.getSpacing(),\n '--neutral-purewhite': colors.getColor('neutral-purewhite'),\n '--neutral-lighter': colors.getColor('neutral-lighter'),\n '--neutral-base': colors.getColor('neutral-base'),\n '--font-size': fonts.getSize(),\n '--font-color': fonts.getColor(),\n '--font-family': fonts.getFamily(),\n '--font-weight-regular': weights.regular,\n };\n }\n\n componentWillLoad() {\n this.updateDateSettings();\n }\n\n /\n Callback for form association\n /\n formAssociatedCallback(form: { ariaLabel: string }) {\n form.ariaLabel = this.label;\n }\n\n @Watch('enableRangeDates')\n updateDateSettings() {\n const newSettings = this.getDateSettings(this.enableRangeDates);\n\n if (this.shouldUpdateDateSettings(newSettings)) {\n this.dateSettings = newSettings;\n }\n }\n\n getDateSettings(isRange: boolean) {\n return {\n placeholder: this.placeholder \|\| (isRange ? 'dd/mm/aaaa - dd/mm/aaaa' : 'dd/mm/aaaa'),\n mask: isRange ? 'dateRange' : 'date',\n mode: isRange ? 'range' : 'single',\n };\n }\n\n shouldUpdateDateSettings(newSettings: any) {\n return this.dateSettings.placeholder !== newSettings.placeholder \|\| this.dateSettings.mask !== newSettings.mask \|\| this.dateSettings.mode !== newSettings.mode;\n }\n\n @Listen('click', { target: 'window' })\n handleClick(ev: { target: Node }) {\n if (this.el.contains(ev.target)) {\n return;\n }\n this.hideCalendar();\n }\n\n hideCalendar() {\n this.isCalendarVisible = false;\n }\n\n showCalendar() {\n this.isCalendarVisible = true;\n }\n\n handleInputDates(event: any) {\n const inputValue = event.target.value;\n\n const dateRangeRegex = /^(\\d{2}\\/\\d{2}\\/\\d{4})\\s-\\s*(\\d{2}\\/\\d{2}\\/\\d{4})$/;\n const simpleDateRegex = /^(\\d{2}\\/\\d{2}\\/\\d{4})$/;\n\n if (dateRangeRegex.test(inputValue)) {\n const matches = inputValue.match(dateRangeRegex);\n const startDate = this.parseStringToDate(matches[1]);\n const endDate = this.parseStringToDate(matches[2]);\n if (this.isDateValid(startDate) && this.isDateValid(endDate)) {\n this.status = 'default';\n this.dates = [startDate, endDate];\n this.value = `${this.parseDateToString(startDate)} - ${this.parseDateToString(endDate)}`;\n this.dateChange.emit(this.value);\n } else {\n this.resetDates();\n }\n } else if (simpleDateRegex.test(inputValue)) {\n const matches = inputValue.match(simpleDateRegex);\n const singleDate = this.parseStringToDate(matches[1]);\n if (this.isDateValid(singleDate)) {\n this.status = 'default';\n this.dates = [singleDate];\n this.value = this.parseDateToString(singleDate);\n this.dateChange.emit(this.value);\n } else {\n this.resetDates();\n }\n } else {\n this.dates = [];\n }\n }\n\n handleChangeDates(event: CuraInputTextCustomEvent<string \| number>) {\n if (event.detail === '') {\n this.dates = [];\n this.status = 'default';\n this.value = '';\n this.dateChange.emit(this.value);\n this.statusInputChange.emit(this.status);\n }\n }\n\n isDateValid(date: Date) {\n const today = new Date();\n today.setHours(0, 0, 0, 0);\n\n if (this.disablePassDates) return !isBefore(date, today);\n if (this.disableFutureDates) return !isAfter(date, today);\n return true;\n }\n\n parseStringToDate(dateString: string): Date {\n const [day, month, year] = dateString.split('/').map(Number);\n return new Date(year, month - 1, day);\n }\n\n parseDateToString(date: Date): string {\n const day = String(date.getDate()).padStart(2, '0');\n const month = String(date.getMonth() + 1).padStart(2, '0');\n const year = date.getFullYear();\n\n return `${day}/${month}/${year}`;\n }\n\n resetDates() {\n this.status = 'error';\n this.dates = [];\n this.statusInputChange.emit(this.status);\n }\n\n renderCalendarOrHelperText() {\n if (this.isCalendarVisible) {\n return (\n <div class=\"calendar visible\">\n <cura-calendar\n customDates={this.dates}\n mode={this.dateSettings.mode as 'single' \| 'range'}\n width=\"100%\"\n maxWidth=\"400px\"\n embedded={false}\n floating={false}\n disableFutureDates={this.disableFutureDates}\n disablePassDates={this.disablePassDates}\n onOnchangeday={e => {\n const days = e.detail.days;\n if (days.length === 1) {\n this.value = this.parseDateToString(days[0]);\n } else if (days.length > 0) {\n this.value = `${this.parseDateToString(days[0])} - ${this.parseDateToString(days[days.length - 1])}`;\n } else {\n this.value = '';\n }\n this.dateChange.emit(this.value);\n }}\n />\n </div>\n );\n } else {\n return this.helperText;\n }\n }\n\n render() {\n return (\n <Host>\n <div class=\"container\" style={this.styles}>\n <cura-input-text\n label={this.label}\n name={this.name}\n status={this.status}\n value={this.value}\n onFocus={() => this.showCalendar()}\n size={this.size}\n icon-name={this.iconName}\n placeholder={this.dateSettings.placeholder}\n mask-preset={this.dateSettings.mask}\n enable-selection-mode={true}\n onKeyUp={event => this.handleInputDates(event)}\n autocomplete=\"off\"\n onValueChange={event => this.handleChangeDates(event)}\n >\n {this.renderCalendarOrHelperText()}\n </cura-input-text>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/cjs/cura-loader-bar.cjs.entry.js CHANGED Viewed

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-e6d728ec.js');
+const index = require('./index-12d54921.js');
 const curaLoaderBarCss = ":host{display:block}:host .progress-bar{position:absolute;left:0;bottom:0;width:100%;height:4px;background-color:var(--neutral-base)}:host .progress-bar span{position:absolute;left:0;bottom:0;width:var(--bar-width);height:100%;border-radius:0 2px 2px 0;background-color:var(--color-base);transition:width 0.2s linear}";
 const CuraLoaderBarStyle0 = curaLoaderBarCss;
@@ -25,7 +25,7 @@ const CuraLoaderBar = class {
         this.setProgress();
     }
     render() {
-        return (index.h(index.Host, { key: '4dc7ef7b17bfb408fa7ff9a74509637bb9045353' }, index.h("div", { key: 'cd2654377f0b45c5b6fa6aa57940f5d81cfd0cce', id: "progress-bar", class: "progress-bar", style: this.styles }, index.h("span", { key: '5d7b4a058162b840f167adb81843403f6c488c4e', class: "progress-bar-fill" }))));
+        return (index.h(index.Host, { key: '282ee3653b83cbf7e34920c62ee6a00d22add8d0' }, index.h("div", { key: '2a5c70d038d6b362ac9d24e60de2ccb68221f7e3', id: "progress-bar", class: "progress-bar", style: this.styles }, index.h("span", { key: 'b10c55dda03fe7c92cf1aec1432a6338c04f2e3d', class: "progress-bar-fill" }))));
     }
     setColor() {
         this.styles = Object.assign(Object.assign({}, this.styles), { '--neutral-base': window.CuraAPI.theme.colors.getColor(`neutral-base`, 0.2), '--color-base': window.CuraAPI.theme.colors.getColor(this.color) });

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

@@ -2,9 +2,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-e6d728ec.js');
+const index = require('./index-12d54921.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(--base-spacing) * 3px);max-width:600px;min-width:200px;padding:0px calc(var(--base-spacing) * 4px) calc(var(--base-spacing) * 4px) calc(var(--base-spacing) * 4px);z-index: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(--base-spacing) * 5px)}.modal.open .wrapper{transform:scale(1);opacity:1;visibility:visible}.close{justify-self:flex-end;padding-top:calc(var(--base-spacing) * 4px);background:none;border:none;cursor:pointer}.close.mobile{display:none}.close.desktop{display:flex}@media (max-width: 768px){.wrapper{position:fixed;bottom:0px;width:80%;padding-top:calc(var(--base-spacing) * 4px);padding-bottom:0px;border-radius:calc(var(--base-spacing) * 3px) calc(var(--base-spacing) * 3px) 0px 0px;border-bottom:none}.close{align-items:center;border-top:1px dashed var(--neutral-light);margin-top:calc(var(--base-spacing) * 4px);padding:calc(var(--base-spacing) * 4px) 0px;justify-content:center;width:100%}.close.mobile{display:flex;gap:calc(var(--base-spacing) * 2px)}.close.desktop{display:none}}@keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes fadeOut{from{opacity:1}to{opacity:0}}";
+const 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:0px 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}@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) * 4px) 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 {
@@ -56,7 +56,7 @@ const CuraModal = class {
         this.setRight();
     }
     render() {
-        return (index.h(index.Host, { key: '50f4146aed5392ae16803fb060d4921a5e8a3271', role: "dialog", "aria-modal": "true", style: { '--zIndex': this.zindex } }, index.h("div", { key: '149e99a4b8b479515ed3d67c5c8aea08d4d96d1c', class: this.open ? 'modal container open' : 'modal container', style: this.styles }, index.h("div", { key: 'f32f7f7e16475c51babf95e1ca5f4fea449c1bb0', class: this.open ? 'modal backdrop open' : 'modal backdrop', onClick: this.handleClose }), index.h("div", { key: '183f7ab8f2cee8106795f6104c38a2c93272387f', class: "wrapper" }, index.h("button", { key: '28778c8120c92dfcae0443dccd21f55a204bd82e', class: "close desktop", onClick: this.handleClose }, index.h("cura-icon", { key: 'a847de5c1314ea1460673870334f3f98e98f1cf9', name: "close", color: "error-dark", size: "small" })), index.h("slot", { key: 'e08b556b7232425c2b83a21dac75d30fb4361a83' }), index.h("button", { key: 'e736a95f878ff5a2ad6897d9140fd74b26939445', class: "close mobile", onClick: this.handleClose }, index.h("cura-icon", { key: '9eaeaca6f4ea9d3cde5fd44e108de389c727f991', name: "close", color: "error-dark", size: "16" }), index.h("cura-paragraph", { key: '2476b85e5dd7d6092d3d1d1714ee4a79b73b12d0', color: "error-dark", size: "small", marginBlock: "0" }, this.mobileCloseLabel))))));
+        return (index.h(index.Host, { key: 'cec1266a4daaac89f69e4f08c94574db9cd970f8', role: "dialog", "aria-modal": "true", style: { '--zIndex': this.zindex } }, index.h("div", { key: '5b330fb69c2360e9c6053d2650c43cbf643eb751', class: this.open ? 'modal container open' : 'modal container', style: this.styles }, index.h("div", { key: '8187dd2df05750a19f85e156059b66d8d56c8b00', class: this.open ? 'modal backdrop open' : 'modal backdrop', onClick: this.handleClose }), index.h("div", { key: '6a34bc7d67fa48c86d2ada7c167a834c09713ad7', class: "wrapper" }, index.h("button", { key: '6e268d5260404b51dd8779007725c19635066881', class: "close desktop", onClick: this.handleClose }, index.h("cura-icon", { key: '7b5644d466b0b9282b6b9d484ea1c0f4384e2aef', name: "close", color: "error-dark", size: "small" })), index.h("slot", { key: '890dc7befdbd96fc8d5cc62a4ad856631b6a7f1e' }), index.h("button", { key: '5f7610ea323e3cad1e12acac7cb66345c8eacf98', class: "close mobile", onClick: this.handleClose }, index.h("cura-icon", { key: 'e9e82d2d4fe0b181131bd0bd7fae8feebaabfd9c', name: "close", color: "error-dark", size: "16" }), index.h("cura-paragraph", { key: 'b9930dd44ca205ec4747c62c005beb36e974698b', color: "error-dark", size: "small", marginBlock: "0" }, 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,~~ihEAAihE~~,CAAC;~~AACviE~~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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-white);\n border: 2px solid var(--neutral-light);\n border-radius: #{$spacing-xxxs};\n max-width: 600px;\n min-width: 200px;\n padding: #{$spacing-none} #{$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 }\n}\n\n@include mobile-only() {\n .wrapper {\n position: fixed;\n bottom: #{$spacing-none};\n width: 80%;\n padding-top: #{$spacing-xxs};\n padding-bottom: #{$spacing-none};\n border-radius: #{$spacing-xxxs} #{$spacing-xxxs} #{$spacing-none} #{$spacing-none};\n border-bottom: none;\n }\n\n .close {\n align-items: center;\n border-top: 1px dashed var(--neutral-light);\n margin-top: #{$spacing-xxs};\n padding: #{$spacing-xxs} #{$spacing-none};\n justify-content: center;\n width: 100%;\n\n &.mobile {\n display: flex;\n gap: #{$spacing-mini};\n }\n\n &.desktop {\n display: none;\n }\n }\n}\n\n@include fadeIn();\n@include fadeOut();\n","import { Component, Event, EventEmitter, Host, Prop, State, Watch, h } from '@stencil/core';\n\n@Component({\n tag: 'cura-modal',\n styleUrl: 'cura-modal.scss',\n shadow: true,\n})\nexport class CuraModal {\n /\n Property open to control modal visibility.\n * Default: false\n /\n @Prop({ mutable: true, reflect: true }) open?: boolean = false;\n /\n Property background to control modal backdrop color.\n * Default: light\n /\n @Prop() background?: 'dark' \| 'light' = 'light';\n /\n Property top to control modal top position.\n * Default: 0px\n /\n @Prop() top?: number = 0;\n /\n Property bottom to control modal bottom position.\n * Default: 0px\n /\n @Prop() bottom?: number = 0;\n /\n Property left to control modal left position.\n * Default: 0px\n /\n @Prop() left?: number = 0;\n /\n Property right to control modal right position.\n * Default: 0px\n /\n @Prop() right?: number = 0;\n /\n 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 connectedCallback() {\n this.styles = {\n ...this.styles,\n '--neutral-white': window.CuraAPI.theme.colors.getColor('neutral-white'),\n '--neutral-light': window.CuraAPI.theme.colors.getColor('neutral-light'),\n '--base-spacing': window.CuraAPI.theme.spacing.getSpacing(),\n };\n this.setColors();\n this.setTop();\n this.setBottom();\n this.setLeft();\n this.setRight();\n }\n\n private handleClose = () => {\n this.modalClose.emit();\n this.open = false;\n };\n\n render() {\n return (\n <Host role=\"dialog\" aria-modal=\"true\" 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 <button class=\"close desktop\" onClick={this.handleClose}>\n <cura-icon name=\"close\" color=\"error-dark\" size=\"small\"></cura-icon>\n </button>\n <slot></slot>\n {/ Mobile button */}\n <button class=\"close mobile\" onClick={this.handleClose}>\n <cura-icon name=\"close\" color=\"error-dark\" size=\"16\"></cura-icon>\n <cura-paragraph color=\"error-dark\" size=\"small\" marginBlock=\"0\">\n {this.mobileCloseLabel}\n </cura-paragraph>\n </button>\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-white);\n border: 2px solid var(--neutral-light);\n border-radius: #{$spacing-xxxs};\n max-width: 600px;\n min-width: 200px;\n padding: #{$spacing-none} #{$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 }\n}\n\n@include mobile-only() {\n .wrapper {\n position: fixed;\n bottom: #{$spacing-none};\n width: 80%;\n padding-top: #{$spacing-xxs};\n padding-bottom: #{$spacing-none};\n border-radius: #{$spacing-xxxs} #{$spacing-xxxs} #{$spacing-none} #{$spacing-none};\n border-bottom: none;\n }\n\n .close {\n align-items: center;\n border-top: 1px dashed var(--neutral-light);\n margin-top: #{$spacing-xxs};\n padding: #{$spacing-xxs} #{$spacing-none};\n justify-content: center;\n width: 100%;\n\n &.mobile {\n display: flex;\n gap: #{$spacing-mini};\n }\n\n &.desktop {\n display: none;\n }\n }\n}\n\n@include fadeIn();\n@include fadeOut();\n","import { Component, Event, EventEmitter, Host, Prop, State, Watch, h } from '@stencil/core';\n\n@Component({\n tag: 'cura-modal',\n styleUrl: 'cura-modal.scss',\n shadow: true,\n})\nexport class CuraModal {\n /\n Property open to control modal visibility.\n * Default: false\n /\n @Prop({ mutable: true, reflect: true }) open?: boolean = false;\n /\n Property background to control modal backdrop color.\n * Default: light\n /\n @Prop() background?: 'dark' \| 'light' = 'light';\n /\n Property top to control modal top position.\n * Default: 0px\n /\n @Prop() top?: number = 0;\n /\n Property bottom to control modal bottom position.\n * Default: 0px\n /\n @Prop() bottom?: number = 0;\n /\n Property left to control modal left position.\n * Default: 0px\n /\n @Prop() left?: number = 0;\n /\n Property right to control modal right position.\n * Default: 0px\n /\n @Prop() right?: number = 0;\n /\n 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 connectedCallback() {\n this.styles = {\n ...this.styles,\n '--neutral-white': window.CuraAPI.theme.colors.getColor('neutral-white'),\n '--neutral-light': window.CuraAPI.theme.colors.getColor('neutral-light'),\n '--base-spacing': window.CuraAPI.theme.spacing.getSpacing(),\n };\n this.setColors();\n this.setTop();\n this.setBottom();\n this.setLeft();\n this.setRight();\n }\n\n private handleClose = () => {\n this.modalClose.emit();\n this.open = false;\n };\n\n render() {\n return (\n <Host role=\"dialog\" aria-modal=\"true\" 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 <button class=\"close desktop\" onClick={this.handleClose}>\n <cura-icon name=\"close\" color=\"error-dark\" size=\"small\"></cura-icon>\n </button>\n <slot></slot>\n {/ Mobile button */}\n <button class=\"close mobile\" onClick={this.handleClose}>\n <cura-icon name=\"close\" color=\"error-dark\" size=\"16\"></cura-icon>\n <cura-paragraph color=\"error-dark\" size=\"small\" marginBlock=\"0\">\n {this.mobileCloseLabel}\n </cura-paragraph>\n </button>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/cjs/cura-progress-bar_2.cjs.entry.js CHANGED Viewed

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-e6d728ec.js');
+const index = require('./index-12d54921.js');
 const curaProgressBarCss = ":host{display:block;box-sizing:border-box}.progress-bar{position:relative;display:flex;align-items:center;justify-content:center}.progress-bar span{position:absolute;display:flex}";
 const CuraProgressBarStyle0 = curaProgressBarCss;
@@ -21,7 +21,7 @@ const CuraProgressBar = class {
         const circumference = radius * Math.PI * 2;
         const dash = (this.progress * circumference) / 100;
         const viewBox = `0 0 ${this.size} ${this.size}`;
-        return (index.h(index.Host, { key: 'e0da7ede087161c67c9dd0371d15030dd5107a19' }, index.h("div", { key: 'ebe68fb426b46e94b7d03ded4e8aaed852337f30', class: "progress-bar" }, index.h("svg", { key: 'ace46878d45bfbe51dae29c3020d74f43c2f5147', width: this.size, height: this.size, viewBox: viewBox }, index.h("circle", { key: 'dbbde61a95a7f13dc14a72fe538da43953852d7b', fill: "none", stroke: "#ccc", cx: this.size / 2, cy: this.size / 2, r: radius, "stroke-width": `${this.strokeWidth}px` }), this.active && (index.h("circle", { key: '272c197451a47c73cfa91d7f7578a50b26958732', fill: "none", stroke: this.progressColor, cx: this.size / 2, cy: this.size / 2, r: radius, "stroke-width": `${this.strokeWidth}px`, transform: `rotate(-90 ${this.size / 2} ${this.size / 2})`, "stroke-dasharray": `${dash}px ${circumference - dash}px`, "stroke-linecap": "round", style: { transition: 'all 0.5s' } }))), index.h("span", { key: 'a80f024e09fb54218fe97039459472855226c063' }, index.h("slot", { key: '5683f5edd5b54bd852fc1036b284656bfda066c4' })))));
+        return (index.h(index.Host, { key: '9453ea7e8d763048b3a789ca720ed1fea987cd71' }, index.h("div", { key: 'cf9624ef2a367e6d246a488af50e7a5534864dce', class: "progress-bar" }, index.h("svg", { key: '54f0788b7d9cd26baebd3fa07a573f3cca9071c7', width: this.size, height: this.size, viewBox: viewBox }, index.h("circle", { key: '3eb559fbde401961eb14e38113d38a32dd947165', fill: "none", stroke: "#ccc", cx: this.size / 2, cy: this.size / 2, r: radius, "stroke-width": `${this.strokeWidth}px` }), this.active && (index.h("circle", { key: '838fcf3567ff35a23a361ba1999e5c83f751179a', fill: "none", stroke: this.progressColor, cx: this.size / 2, cy: this.size / 2, r: radius, "stroke-width": `${this.strokeWidth}px`, transform: `rotate(-90 ${this.size / 2} ${this.size / 2})`, "stroke-dasharray": `${dash}px ${circumference - dash}px`, "stroke-linecap": "round", style: { transition: 'all 0.5s' } }))), index.h("span", { key: '1cc5c38639225399117c7ad34095a44dfe5093f4' }, index.h("slot", { key: 'be0129c555a7e6a2901857e70a5540b087c04a81' })))));
     }
 };
 CuraProgressBar.style = CuraProgressBarStyle0;
@@ -86,7 +86,7 @@ const CuraStepperItem = class {
     }
     render() {
         const { badgeColor, textColor, icon, iconOnly } = this.getStatusProperties();
-        return (index.h(index.Host, { key: 'c226daf451d9c861d5303474ef0fc31c1602371b' }, index.h("div", { key: '7aece988946e4bef02c597a80ea1a505c201e188', class: "item-container", style: this.styles }, index.h("cura-badge-pill", { key: 'd0362b4a4ee3c047173399ea5f7c912a5a0f7810', type: "solid", color: badgeColor, "icon-name": icon, "icon-only": iconOnly, "border-radius": "50%" }, this.label), this.displayHeading && this.heading && (index.h("cura-paragraph", { key: '015effecdb26be22386363e77bd5a0e671701d60', marginBlock: "0", size: "xsmall", color: textColor }, this.heading)))));
+        return (index.h(index.Host, { key: '779f6c1eb875477b8ceb8ed223e8432081f67bc9' }, index.h("div", { key: '14f773ffa6d576f2894fa0515f878eddf48205fb', class: "item-container", style: this.styles }, index.h("cura-badge-pill", { key: '492f9988b7f7f6f4fc0838a99a015da3411017fe', type: "solid", color: badgeColor, "icon-name": icon, "icon-only": iconOnly, "border-radius": "50%" }, this.label), this.displayHeading && this.heading && (index.h("cura-paragraph", { key: 'b0d3cafa0bfddd990ee745b3b82b44df9daaca71', marginBlock: "0", size: "xsmall", color: textColor }, this.heading)))));
     }
     get hostElement() { return index.getElement(this); }
 };

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

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-e6d728ec.js');
+const index = require('./index-12d54921.js');
 const curaForms_definitions = require('./cura-forms.definitions-c164f1b8.js');
 const curaRadioCss = "@charset \"UTF-8\";:host{display:block;width:fit-content;box-sizing:border-box;}:host .container{display:flex;align-items:center;flex-direction:row-reverse;gap:var(--gap)}: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 .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)}";
@@ -137,7 +137,7 @@ const CuraRadio = class {
         return statusColors[this.status][type];
     }
     render() {
-        return (index.h(index.Host, { key: 'eecc279b05da57162acf41d62bac48a00cc9d985' }, index.h("div", { key: '279b6922349bf02b7e65065bcb98b9c824073516', class: this.getClasses(), style: this.styles }, index.h("div", { key: 'a6a2de8f8d7e6efbca3aee079255451e448903a2', class: "info" }, index.h("div", { key: '6d2733ca86d087031e1ec4fdea26d5906f695479', class: "label-wrapper" }, index.h("cura-label", { key: '2c0c878411bb846ff7bcf24c385895f1d86b3022', class: "label", size: this.size === 'large' ? 'medium' : 'xsmall', color: this.assignColor('label') }, this.label), this.required && index.h("cura-paragraph", { key: '07abc53858276dc6429381a0c658c562e1d05933', lineHeight: '0%', marginBlock: '0', color: "error-base" }, "* ")), index.h("cura-label", { key: 'ab5c0451842242ee584f2d3b430b803498190118', color: this.assignColor('message'), size: "xsmall", class: "message" }, index.h("slot", { key: '3673a0a1ecc7f9dfa6975bdddaf708ed8ad1b72d' }))), index.h("input", { key: 'db602c601168ada1a5a375d3ef122d4f315fa256', type: "radio", class: `radio ${this.size.toLocaleLowerCase()}`, name: this.name, value: this.value, required: this.required, tabIndex: this.ontabindex, disabled: this.disabled, checked: this.checked, onClick: this.handleClick }))));
+        return (index.h(index.Host, { key: 'fa38dc0c23638cc267d9d52c2796d6a079439484' }, index.h("div", { key: 'cbe3fe10a7bc3fe0bd7a6ef73fbbadfbc7334e2c', class: this.getClasses(), style: this.styles }, index.h("div", { key: '0649b867ec06c0069c655cffbe109f8d258509c2', class: "info" }, index.h("div", { key: '7f8bfc46f21677cf661418f7b9c380fadddf1860', class: "label-wrapper" }, index.h("cura-label", { key: 'a259c61bb7adc503dbeea4329c22aa37e9e8996a', class: "label", size: this.size === 'large' ? 'medium' : 'xsmall', color: this.assignColor('label') }, this.label), this.required && index.h("cura-paragraph", { key: '0ffdc2c6f69f7ada640439a603c1b91125a3c332', lineHeight: '0%', marginBlock: '0', color: "error-base" }, "* ")), index.h("cura-label", { key: 'ae59fe9a1a05a9e69e257986f91f609bd03b66b9', color: this.assignColor('message'), size: "xsmall", class: "message" }, index.h("slot", { key: '524b6e086ff9ea32d8db78a78e354992b0d844d8' }))), index.h("input", { key: '0d0b4e915da4691f319ae340d54032fdcce90405', type: "radio", class: `radio ${this.size.toLocaleLowerCase()}`, name: this.name, value: this.value, required: this.required, tabIndex: this.ontabindex, disabled: this.disabled, checked: this.checked, onClick: this.handleClick }))));
     }
     static get formAssociated() { return true; }
     get host() { return index.getElement(this); }

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

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-e6d728ec.js');
+const index = require('./index-12d54921.js');
 const curaStepperCss = ":host{display:block;box-sizing:border-box;width:100%}cura-heading{--margin-block:0 !important}.container{display:flex}.compact{display:flex;padding:0px;justify-content:space-between;align-items:center}.compact .heading{text-align:right}.stepper-list{gap:4px;display:flex;flex-shrink:0;align-items:center;padding:0;flex:1;width:100%;justify-content:space-between}.step{display:flex;align-items:center;flex-direction:row;flex:1;gap:4px}.step .wrapper{flex:1;position:relative}.step .divider{background-color:var(--neutral-light);height:2px;flex:1;transition:all 1s}.step .animation{position:absolute;top:0;left:0;right:0;width:var(--progress-width)}.step .done{background-color:var(--success-light)}.step .stop{background-color:var(--error-light)}.step .active{background-color:var(--info-light)}.last{flex:0}";
 const CuraStepperStyle0 = curaStepperCss;
@@ -112,7 +112,7 @@ const CuraStepper = class {
         return (index.h("div", { class: "container", style: this.styles }, index.h("div", { class: "stepper-list" }, this.stepList.map((step, stepIndex) => this.renderStep(step, stepIndex)))));
     }
     render() {
-        return index.h(index.Host, { key: 'a6562de52fefff80eb2d310555ce56956cce64d9' }, this.variant === 'default' ? this.renderStepper() : this.renderCompactStepper());
+        return index.h(index.Host, { key: '55bff7769007721f0c0366d1a6a9b197bbaebfbd' }, this.variant === 'default' ? this.renderStepper() : this.renderCompactStepper());
     }
     get host() { return index.getElement(this); }
 };

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

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-e6d728ec.js');
+const index = require('./index-12d54921.js');
 const curaForms_definitions = require('./cura-forms.definitions-c164f1b8.js');
 const curaSwitchCss = "@charset \"UTF-8\";:host{display:block;width:fit-content;box-sizing:border-box}.container{display:flex;align-items:center;flex-direction:row-reverse;gap:var(--gap);text-align:left}.position{flex-direction:row}.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)}";
@@ -109,7 +109,7 @@ const CuraSwitch = class {
         return classes;
     }
     render() {
-        return (index.h(index.Host, { key: '11257c8df21e4d88ef7a1e26b72f8c53fd316edd' }, index.h("div", { key: '358b9bf587443350fd092abb179b2207064c9278', class: this.getClasses(), style: this.styles }, index.h("div", { key: 'acc517d68a7fde4a83653a7fadbdb337e6175498', class: "info" }, index.h("cura-label", { key: 'dede214a31292a72e8f55adb50060628a1a101c0', 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: 'a96960a7e898e8f9d7151c468d18e52860d589d1', style: { textAlign: this.position === 'right' ? 'right' : 'left' }, color: this.assignColor('primary-lighter', 'neutral-dark'), size: "xsmall", class: "message" }, index.h("slot", { key: 'de46f003bf8046e3742d831cc45d22471e19c0a4' }))), index.h("div", { key: 'ae0c72cd68ed42fec1338d6ded49d7b535157476', onClick: this.toggleSwitch, class: "control" }, index.h("div", { key: '3aa0e60235071541289ea6a430966094a2753520', class: `track ${this.size.toLowerCase()}` }, index.h("div", { key: '419866ba2b46a394428f83e6824ebb315e6671a1', class: `thumb ${this.size.toLowerCase()}`, tabIndex: this.ontabindex }))))));
+        return (index.h(index.Host, { key: '4ea77f70fe3fe34aac7b8ec7a177ded8c5050e8c' }, index.h("div", { key: '25b0da8f4b11a43dd2ac27a4fbbd652b7bed17a4', class: this.getClasses(), style: this.styles }, index.h("div", { key: '6edfaafe8986d4978328a8b31165598d3c7d79aa', class: "info" }, index.h("cura-label", { key: '24403a30f3d345353371aa2c2639052f86ba3a92', 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: '2d1ef3fd6634cbb96603d413c702bb2787512a1c', style: { textAlign: this.position === 'right' ? 'right' : 'left' }, color: this.assignColor('primary-lighter', 'neutral-dark'), size: "xsmall", class: "message" }, index.h("slot", { key: '889dc39d9a6ced5c0873affe6249d7b7e7e54747' }))), index.h("div", { key: 'c4a524cb4a30cb9b7e9f1aa0302c796cda620c1e', onClick: this.toggleSwitch, class: "control" }, index.h("div", { key: '5715b16aeb18b50721739504690586455210f392', class: `track ${this.size.toLowerCase()}` }, index.h("div", { key: 'a83c9ab52f707844eefb86f59f1ed520a44586f1', class: `thumb ${this.size.toLowerCase()}`, tabIndex: this.ontabindex }))))));
     }
     static get formAssociated() { return true; }
     static get watchers() { return {