@rededor/cura-hydrate 1.4.0 → 1.5.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.
- package/index.js +407 -83
- package/index.mjs +407 -83
- package/package.json +1 -1
package/index.js
CHANGED
|
@@ -3036,7 +3036,7 @@ class CuraAlert {
|
|
|
3036
3036
|
return this.icon ? this.icon : iconMapping[this.type];
|
|
3037
3037
|
}
|
|
3038
3038
|
render() {
|
|
3039
|
-
return (hAsync(Host, { key: '
|
|
3039
|
+
return (hAsync(Host, { key: 'a0b22404673b1568b9cb937150dda71ce4c99d50' }, hAsync("div", { key: 'c30bf1b97d1e1ffaf334ef3bca6cdd1f081c679c', class: this.getClasses(), style: this.styles }, hAsync("cura-icon", { key: '1bd88c8a19e073d7b9d967d8df38bb74063cd110', name: this.getNameIcon(), class: "icon-left", size: 16, color: `${this.type}-dark` }), hAsync("div", { key: '0df09a27c27c7e1743f7cfb9e71c96b102ff4484', class: "content" }, this.label ? (hAsync("cura-label", { class: "title", size: "small", color: "neutral-darker", weight: "bold" }, this.label)) : '', hAsync("cura-paragraph", { key: '687cc7ab050299f0878c2d10ccd28e92708db85d', class: "text", color: `${this.type}-darker`, size: "xsmall", marginBlock: "0", lineHeight: "133.33%" }, hAsync("slot", { key: 'e2d85d40e65029ea71a43aa23e7298d6dcc7efa9' })), hAsync("slot", { key: 'a28fe90c9bfe2b9fb22f196eab7bb2e09e408dbf', name: "actions" })), this.closeable ?
|
|
3040
3040
|
(hAsync("cura-icon", { name: "close", size: 16, color: "error-dark", class: "icon-right", onClick: this.handleClose }))
|
|
3041
3041
|
: '')));
|
|
3042
3042
|
}
|
|
@@ -3112,7 +3112,7 @@ class CuraAvatar {
|
|
|
3112
3112
|
this.imageSrc = this.imageSrcDefault || `${this.assetsPath}/images/avatar/patient-default.svg`;
|
|
3113
3113
|
}
|
|
3114
3114
|
render() {
|
|
3115
|
-
return (hAsync(Host, { key: '
|
|
3115
|
+
return (hAsync(Host, { key: '467e74004b400e80a2d7f8e1a40cd9d7e782ff8a', style: this.hostCSSProperties(), role: "img" }, hAsync("div", { key: 'c38a163b8aeebd07f8aece7aea9889c336df92a5', class: this.getClasses(), style: this.styles }, hAsync("img", { key: 'a22868d4aae4029afb9b325a5c8f5556fa8984ea', src: this.imageSrc || this.imageSrcDefault || `${this.assetsPath}/images/avatar/patient-default.svg`, onError: () => this.onSrcError() }))));
|
|
3116
3116
|
}
|
|
3117
3117
|
get host() { return getElement(this); }
|
|
3118
3118
|
static get watchers() { return {
|
|
@@ -3140,6 +3140,54 @@ class CuraAvatar {
|
|
|
3140
3140
|
}; }
|
|
3141
3141
|
}
|
|
3142
3142
|
|
|
3143
|
+
const curaBadgeDotCss = ":host{display:block;position:relative;width:fit-content;height:fit-content}:host .container{width:calc(var(--base-spacing) * 2px);height:calc(var(--base-spacing) * 2px);position:relative;box-sizing:border-box}:host .container::before{width:100%;height:100%;position:absolute;left:0;top:0;content:\"\";box-sizing:border-box;border-radius:50%;border:1px solid var(--color-dark);background:var(--color)}:host .container.disabled::before{background:var(--neutral-pale);border:1px solid var(--neutral-medium)}:host .container.outline::before{background:transparent;border:2px solid var(--color)}:host .container.outline.disabled::before{border:2px solid var(--neutral-medium)}:host .container.transparent::before{background:var(--color-dark);border:none}:host .container.transparent.disabled::before{background:var(--neutral-medium);border:none}";
|
|
3144
|
+
var CuraBadgeDotStyle0 = curaBadgeDotCss;
|
|
3145
|
+
|
|
3146
|
+
class CuraBadgeDot {
|
|
3147
|
+
constructor(hostRef) {
|
|
3148
|
+
registerInstance(this, hostRef);
|
|
3149
|
+
this.theme = window.CuraAPI.theme;
|
|
3150
|
+
this.color = 'primary';
|
|
3151
|
+
this.disabled = false;
|
|
3152
|
+
this.type = 'solid';
|
|
3153
|
+
this.styles = {};
|
|
3154
|
+
}
|
|
3155
|
+
connectedCallback() {
|
|
3156
|
+
this.styles['--base-spacing'] = this.theme.spacing.getSpacing();
|
|
3157
|
+
this.styles['--neutral-medium'] = this.theme.colors.getColor('neutral-dark');
|
|
3158
|
+
this.styles['--neutral-pale'] = this.theme.colors.getColor('neutral-pale');
|
|
3159
|
+
this.setColors();
|
|
3160
|
+
}
|
|
3161
|
+
setColors() {
|
|
3162
|
+
this.styles = Object.assign(Object.assign({}, this.styles), { '--color': this.theme.colors.getColor(`${this.color}`), '--color-dark': this.theme.colors.getColor(`${this.color}-dark`) });
|
|
3163
|
+
}
|
|
3164
|
+
getClasses() {
|
|
3165
|
+
const classes = {
|
|
3166
|
+
'container': true,
|
|
3167
|
+
'disabled': this.disabled
|
|
3168
|
+
};
|
|
3169
|
+
classes[`${this.type}`] = true;
|
|
3170
|
+
return classes;
|
|
3171
|
+
}
|
|
3172
|
+
render() {
|
|
3173
|
+
return (hAsync(Host, { key: '00e335977fbb0677db9d95bab901a012ba8a5c06' }, hAsync("div", { key: 'e828743793731c986f37dd6a9f7abdc78b63932b', class: this.getClasses(), style: this.styles })));
|
|
3174
|
+
}
|
|
3175
|
+
static get style() { return CuraBadgeDotStyle0; }
|
|
3176
|
+
static get cmpMeta() { return {
|
|
3177
|
+
"$flags$": 9,
|
|
3178
|
+
"$tagName$": "cura-badge-dot",
|
|
3179
|
+
"$members$": {
|
|
3180
|
+
"color": [1],
|
|
3181
|
+
"disabled": [516],
|
|
3182
|
+
"type": [513],
|
|
3183
|
+
"styles": [32]
|
|
3184
|
+
},
|
|
3185
|
+
"$listeners$": undefined,
|
|
3186
|
+
"$lazyBundleId$": "-",
|
|
3187
|
+
"$attrsToReflect$": [["disabled", "disabled"], ["type", "type"]]
|
|
3188
|
+
}; }
|
|
3189
|
+
}
|
|
3190
|
+
|
|
3143
3191
|
const curaBadgeCounterCss = ":host{width:fit-content;display:inline-block;height:calc(var(--base-spacing) * 4px);position:relative}:host .container{display:flex;min-width:calc(var(--base-spacing) * 4px);width:fit-content;height:calc(var(--base-spacing) * 4px);justify-content:center;align-items:center;border-radius:calc(calc(var(--base-spacing) * 4px) / 2);background:var(--background-color);box-sizing:border-box;padding:0 calc(var(--base-spacing) * 1px);position:relative}:host .container.outline,:host .container.transparent{background:transparent !important}:host .container.outline::before{content:\"\";width:100%;height:100%;position:absolute;left:0px;top:0px;box-sizing:border-box;border:1px solid var(--background-color);border-radius:calc(calc(var(--base-spacing) * 4px) / 2)}";
|
|
3144
3192
|
var CuraBadgeCounterStyle0 = curaBadgeCounterCss;
|
|
3145
3193
|
|
|
@@ -3178,13 +3226,13 @@ class CuraBadgeNumber {
|
|
|
3178
3226
|
}
|
|
3179
3227
|
getClasses() {
|
|
3180
3228
|
const classes = {
|
|
3181
|
-
'container': true
|
|
3229
|
+
'container': true
|
|
3182
3230
|
};
|
|
3183
3231
|
classes[this.type.toLowerCase()] = true;
|
|
3184
3232
|
return classes;
|
|
3185
3233
|
}
|
|
3186
3234
|
render() {
|
|
3187
|
-
return (hAsync(Host, { key: '
|
|
3235
|
+
return (hAsync(Host, { key: '8b67f2b913a10de53a519cdafcfbcb140b2adda5' }, this.number && this.number <= 0 ? '' : (hAsync("div", { class: this.getClasses(), style: this.styles }, hAsync("cura-label", { size: "xsmall", "line-height": "none", color: this.labelColor }, this.number >= 100 ? '99+' : this.number)))));
|
|
3188
3236
|
}
|
|
3189
3237
|
static get watchers() { return {
|
|
3190
3238
|
"disabled": ["handleColorChange"],
|
|
@@ -3247,6 +3295,7 @@ class CuraBadgePill {
|
|
|
3247
3295
|
colors.forEach(color => {
|
|
3248
3296
|
this.styles[color.name] = this.theme.colors.getColor(color.theme);
|
|
3249
3297
|
});
|
|
3298
|
+
this.styles = Object.assign({}, this.styles);
|
|
3250
3299
|
}
|
|
3251
3300
|
hostCSSProperties() {
|
|
3252
3301
|
return {
|
|
@@ -3273,7 +3322,7 @@ class CuraBadgePill {
|
|
|
3273
3322
|
}
|
|
3274
3323
|
render() {
|
|
3275
3324
|
const symbolColor = this.getSymbolColor();
|
|
3276
|
-
return (hAsync(Host, { key: '
|
|
3325
|
+
return (hAsync(Host, { key: 'd2b79aa7ede4462cd2b591b62321ef69b9e4fed3', style: this.hostCSSProperties() }, hAsync("div", { key: 'a82383b03c02990b5879ca647ae06cabb5c32845', class: this.getClasses(), style: this.styles }, this.getIcon(), hAsync("cura-label", { key: '1ccf493530fa6b7cee25db83d0fcb37cf308df3d', size: 'xsmall', "line-height": "117%", color: symbolColor }, hAsync("slot", { key: '488e4fbd8b30cfcd15b25c9227e129b1c6e1ce32' })))));
|
|
3277
3326
|
}
|
|
3278
3327
|
get host() { return getElement(this); }
|
|
3279
3328
|
static get watchers() { return {
|
|
@@ -3405,7 +3454,7 @@ class CuraButton {
|
|
|
3405
3454
|
render() {
|
|
3406
3455
|
const symbolColor = this.getSymbolColor();
|
|
3407
3456
|
const labelSize = labelSizes[this.size] || labelSizes["default"];
|
|
3408
|
-
return (hAsync(Host, { key: '
|
|
3457
|
+
return (hAsync(Host, { key: '07b87d98fb398bc2897e666dc8cd54734f20734d' }, this.href ? (hAsync("a", { href: this.disabled ? '' : this.href, target: this.target, class: this.getClasses(), style: this.styles, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave() }, hAsync("span", { class: "button-container" }, this.getIcon(), hAsync("cura-label", { class: "label", size: labelSize, lineHeight: '105%', color: symbolColor }, hAsync("slot", null))), hAsync("cura-loader-circle", { size: this.size, color: symbolColor }))) : (hAsync("button", { class: this.getClasses(), style: this.styles, disabled: this.disabled || null, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave(), type: this.type }, hAsync("span", { class: "button-container" }, this.getIcon(), hAsync("cura-label", { class: "label", size: labelSize, lineHeight: '105%', color: symbolColor }, hAsync("slot", null))), hAsync("cura-loader-circle", { size: this.size, color: symbolColor })))));
|
|
3409
3458
|
}
|
|
3410
3459
|
static get formAssociated() { return true; }
|
|
3411
3460
|
static get watchers() { return {
|
|
@@ -3539,7 +3588,7 @@ class CuraButtonOutline {
|
|
|
3539
3588
|
render() {
|
|
3540
3589
|
const symbolColor = this.getSymbolColor();
|
|
3541
3590
|
const labelSize = labelSizes[this.size] || labelSizes["default"];
|
|
3542
|
-
return (hAsync(Host, { key: '
|
|
3591
|
+
return (hAsync(Host, { key: '0a0c25f94d0c18dbb90e4836ca3e7bcbbe10d032' }, this.href ? (hAsync("a", { href: this.disabled ? '' : this.href, target: this.target, class: this.getClasses(), style: this.styles, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave() }, hAsync("span", { class: "button-container" }, this.getIcon(), hAsync("cura-label", { size: labelSize, lineHeight: '105%', color: symbolColor }, hAsync("slot", null))), hAsync("cura-loader-circle", { size: this.size, color: symbolColor }))) : (hAsync("button", { class: this.getClasses(), style: this.styles, disabled: this.disabled || null, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave(), type: this.type }, hAsync("span", { class: "button-container" }, this.getIcon(), hAsync("cura-label", { size: labelSize, lineHeight: '105%', color: symbolColor }, hAsync("slot", null))), hAsync("cura-loader-circle", { size: this.size, color: symbolColor })))));
|
|
3543
3592
|
}
|
|
3544
3593
|
static get formAssociated() { return true; }
|
|
3545
3594
|
static get watchers() { return {
|
|
@@ -3677,7 +3726,7 @@ class CuraButtonSelect {
|
|
|
3677
3726
|
}
|
|
3678
3727
|
render() {
|
|
3679
3728
|
const labelSize = labelSizes[this.size] || labelSizes['default'];
|
|
3680
|
-
return (hAsync(Host, { key: '
|
|
3729
|
+
return (hAsync(Host, { key: '4b7592b68a09c5b93ec1c9ec6b84c7e5afa06ec3' }, hAsync("button", { key: 'd607a733d64f73bd4bd4405e0aeb9d7f5ceebf52', class: this.getClasses(), style: this.styles, disabled: this.disabled, onClick: e => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave() }, hAsync("div", { key: '14e2f5b7309bf6c2252c81ab2f02fb36670facf3', class: "button-container" }, this.iconName ? this.getIcon() : null, hAsync("cura-label", { key: '0759d70b0105a56dfa42bce78f2f5b8c33b04254', class: "label", size: labelSize, lineHeight: "0%", color: this.getLabelFontColor(), weight: "regular" }, hAsync("slot", { key: 'a9935483ee6c67b8142878672804dfb7df0d8479' })), this.counter ? this.getCounter() : null, this.iconPosition === 'right' && this.selected ? this.getCheckIconRight() : null))));
|
|
3681
3730
|
}
|
|
3682
3731
|
get host() { return getElement(this); }
|
|
3683
3732
|
static get watchers() { return {
|
|
@@ -3793,7 +3842,7 @@ class CuraButtonTransparent {
|
|
|
3793
3842
|
render() {
|
|
3794
3843
|
const symbolColor = this.getSymbolColor();
|
|
3795
3844
|
const labelSize = labelSizes[this.size] || labelSizes["default"];
|
|
3796
|
-
return (hAsync(Host, { key: '
|
|
3845
|
+
return (hAsync(Host, { key: 'f93f2f1b495403127238468c57edfcb5e9f69d43' }, this.href ? (hAsync("a", { href: this.disabled ? '' : this.href, target: this.target, class: this.getClasses(), style: this.styles, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave() }, hAsync("span", { class: "button-container" }, this.getIcon(), hAsync("cura-label", { size: labelSize, lineHeight: '105%', color: symbolColor }, hAsync("slot", null))), hAsync("cura-loader-circle", { size: this.size, color: symbolColor }))) : (hAsync("button", { class: this.getClasses(), style: this.styles, disabled: this.disabled || null, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave(), type: this.type }, hAsync("span", { class: "button-container" }, this.getIcon(), hAsync("cura-label", { size: labelSize, lineHeight: '105%', color: symbolColor }, hAsync("slot", null))), hAsync("cura-loader-circle", { size: this.size, color: symbolColor })))));
|
|
3797
3846
|
}
|
|
3798
3847
|
static get formAssociated() { return true; }
|
|
3799
3848
|
static get watchers() { return {
|
|
@@ -7846,7 +7895,7 @@ class CuraCalendar {
|
|
|
7846
7895
|
}
|
|
7847
7896
|
render() {
|
|
7848
7897
|
const { months } = this.fetchMonthNames();
|
|
7849
|
-
return (hAsync(Host, { key: '
|
|
7898
|
+
return (hAsync(Host, { key: '859c5f15de173c774dc9f8a88792845741b665e2', style: this.getHostCSSProperties() }, hAsync("div", { key: '5838783d7ecb5b2258ef7ef73ba32ca7ddbad470', class: `calendar ${this.floating ? 'floating' : ''} ${this.embedded ? 'embedded' : ''}`, style: this.styles }, hAsync("header", { key: '16245dbb73d9d0a277891b3853f451b89acccc35', class: "header" }, hAsync("div", { key: '9a22c4386363642fa7219edebd9e9a5cfb5220aa', class: `month-year ${this.type === 'dropdown' && 'dropdown'}` }, hAsync("cura-icon", { key: '4d3ee4454dfc8bbcd8d76df101b553c86b0cea8f', class: `icon ${this.type === 'dropdown' && 'dropdown'}`, name: "left", color: this.determinePrevButtonColor(), onClick: !this.collapsed ? () => this.updateCurrentMonth('prev') : () => this.updateCurrentWeek('prev') }), this.type === 'dropdown' ? (hAsync("div", { class: "select" }, hAsync("cura-select", { size: "small", class: "drop-month", mode: "transparent", value: months[getMonth(this.currentDate)], onSelected: e => this.onMonthDropdownChange(e) }, months.map((month, index) => (hAsync("cura-select-option", { size: "xsmall", key: index, value: month }, month)))), hAsync("cura-select", { size: "small", class: "drop-year", mode: "transparent", value: getYear(this.currentDate).toString(), onSelected: e => this.onYearDropdownChange(e) }, this.fetchYearList().map((year, index) => (hAsync("cura-select-option", { key: index, value: year.toString() }, year.toString())))))) : (hAsync("cura-label", { color: "neutral-black", size: "large" }, months[getMonth(this.currentDate)].slice(0, 3), ", ", getYear(this.currentDate))), hAsync("cura-icon", { key: '1f54119aafaa80816cdd016100a7987cba6656b0', class: `icon ${this.type === 'dropdown' && 'dropdown'}`, name: "right", color: "primary-base", onClick: !this.collapsed ? () => this.updateCurrentMonth('next') : () => this.updateCurrentWeek('next') }))), hAsync("span", { key: '40be6c876675cf43b42e214e30639e48873dc4bc', class: "days-of-week" }, this.fetchWeekDays().map((day, index) => (hAsync("cura-label", { class: "day", size: "xsmall", color: "neutral-black", weight: "bold", key: index }, day === 'sab' ? 'SÁB' : day.toLocaleUpperCase())))), hAsync("div", { key: '72cae6b30fa5b7d5e180b796458d1844aba27ea9', class: "dates" }, !this.collapsed
|
|
7850
7899
|
? this.fetchDaysOfMonth().map((day, index) => (hAsync("div", { key: index, class: this.getClasses(day), onClick: () => this.onDateClick(day) }, day ? format(day, 'd') : '')))
|
|
7851
7900
|
: this.fetchDaysOfWeek().map((day, index) => (hAsync("div", { key: index, class: this.getClasses(day), onClick: () => this.onDateClick(day) }, day ? format(day, 'd') : '')))), this.collapsed !== null ? (this.collapsed ? (hAsync("div", { class: "collapsed-container" }, hAsync("cura-button-transparent", { onClick: () => this.showNotColapsedCalendar(), size: "small", color: "primary", fontColor: "dark", iconName: "plusCircle" }, "Veja mais datas"))) : (hAsync("div", { class: "collapsed-container" }, hAsync("cura-button-transparent", { onClick: () => this.showColapsedCalendar(), size: "small", color: "primary", fontColor: "dark", iconName: "minusCircle" }, "Veja menos datas")))) : null)));
|
|
7852
7901
|
}
|
|
@@ -7930,7 +7979,7 @@ class CuraCard {
|
|
|
7930
7979
|
return classes;
|
|
7931
7980
|
}
|
|
7932
7981
|
render() {
|
|
7933
|
-
return (hAsync(Host, { key: '
|
|
7982
|
+
return (hAsync(Host, { key: '9478ce754c108db722dbc5bcbb00a0884b6c6f38', role: this.href ? 'link' : 'div' }, this.href ? (hAsync("a", { class: this.getClasses(), target: this.target, style: this.styles, href: this.href }, hAsync("slot", null))) : (hAsync("div", { class: this.getClasses(), style: this.styles }, hAsync("slot", null)))));
|
|
7934
7983
|
}
|
|
7935
7984
|
static get style() { return CuraCardStyle0; }
|
|
7936
7985
|
static get cmpMeta() { return {
|
|
@@ -8125,7 +8174,7 @@ class CuraCheckbox {
|
|
|
8125
8174
|
return hAsync("cura-icon", { class: "icon", name: iconName, size: iconSize, color: iconColor });
|
|
8126
8175
|
}
|
|
8127
8176
|
render() {
|
|
8128
|
-
return (hAsync(Host, { key: '
|
|
8177
|
+
return (hAsync(Host, { key: 'c589b642a730e09b8d5ba60b69b45f131560ffda' }, hAsync("div", { key: '85ee55dc52042e513e070d68af348dc78d1990e2', class: this.getClasses(), style: this.styles, onClick: this.handleClick }, hAsync("div", { key: '59e78d3b717b0bbd77d98da09ab7f1da30d02f14', class: "info" }, hAsync("div", { key: '64d683966633a625e7e477fcf1b00364d5fd3fa7', class: "label-wrapper" }, hAsync("cura-label", { key: '76d34006ffd837285cb899278f759d95862097c5', class: "label", weight: 'bold', size: this.size === 'large' ? 'medium' : 'xsmall', color: this.assignColor('label') }, this.label), this.required && hAsync("cura-paragraph", { key: '01394587736d7402d5c6729e9f7e93f7b08ad742', lineHeight: '0%', marginBlock: '0', color: "error-base" }, "* ")), hAsync("cura-label", { key: 'fcbbea9a05b9299a814111ea36d7412df6f54e92', color: this.assignColor('message'), size: "xsmall", class: "message" }, hAsync("slot", { key: '99c46ed2eb8492cbebb114d828935f1ec0bf7796' }))), hAsync("div", { key: '6291780f613af4e320c486b46697df6f19bdce0e', class: 'checkbox', tabIndex: this.ontabindex }, hAsync("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()))));
|
|
8129
8178
|
}
|
|
8130
8179
|
static get formAssociated() { return true; }
|
|
8131
8180
|
get host() { return getElement(this); }
|
|
@@ -8227,7 +8276,7 @@ class CuraDisplay {
|
|
|
8227
8276
|
return tags[`${this.level}`] || tags['default'];
|
|
8228
8277
|
}
|
|
8229
8278
|
render() {
|
|
8230
|
-
return (hAsync(Host, { key: '
|
|
8279
|
+
return (hAsync(Host, { key: '01876449797c600a4fa37c9b4addd80855e6fc83', style: this.hostCSSProperties() }, this.getHeadingTag()));
|
|
8231
8280
|
}
|
|
8232
8281
|
get host() { return getElement(this); }
|
|
8233
8282
|
static get watchers() { return {
|
|
@@ -8253,7 +8302,7 @@ class CuraDisplay {
|
|
|
8253
8302
|
}; }
|
|
8254
8303
|
}
|
|
8255
8304
|
|
|
8256
|
-
const curaBadgeDistanceCss = ":host .container{display:flex;flex-direction:column;justify-content:center;align-items:center;width:calc(var(--base-spacing) *
|
|
8305
|
+
const curaBadgeDistanceCss = ":host .container{display:flex;flex-direction:column;justify-content:center;align-items:center;width:calc(var(--base-spacing) * 10px);height:calc(var(--base-spacing) * 10px);border-radius:calc(var(--base-spacing) * 1px);background:var(--neutral-pale)}";
|
|
8257
8306
|
var CuraBadgeDistanceStyle0 = curaBadgeDistanceCss;
|
|
8258
8307
|
|
|
8259
8308
|
class CuraDistance {
|
|
@@ -8303,7 +8352,7 @@ class CuraDistance {
|
|
|
8303
8352
|
}; }
|
|
8304
8353
|
}
|
|
8305
8354
|
|
|
8306
|
-
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;
|
|
8355
|
+
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}";
|
|
8307
8356
|
var CuraDropdownSearchStyle0 = curaDropdownSearchCss;
|
|
8308
8357
|
|
|
8309
8358
|
class CuraDropdownSearch {
|
|
@@ -8313,16 +8362,14 @@ class CuraDropdownSearch {
|
|
|
8313
8362
|
this.onselect = createEvent(this, "onselect", 7);
|
|
8314
8363
|
this.overlayElement = null;
|
|
8315
8364
|
this.adjustInputPosition = () => {
|
|
8316
|
-
|
|
8317
|
-
|
|
8318
|
-
|
|
8319
|
-
|
|
8320
|
-
|
|
8321
|
-
|
|
8322
|
-
|
|
8323
|
-
|
|
8324
|
-
}
|
|
8325
|
-
});
|
|
8365
|
+
var _a, _b;
|
|
8366
|
+
const isKeyboardOpen = (window === null || window === void 0 ? void 0 : window.innerHeight) < this.screenDefaultHeight;
|
|
8367
|
+
const dropdown = (_a = this.host.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.dropdown-mobile');
|
|
8368
|
+
if (dropdown) {
|
|
8369
|
+
dropdown.style.position = isKeyboardOpen ? 'absolute' : 'fixed';
|
|
8370
|
+
dropdown.style.bottom = isKeyboardOpen ? `${((_b = window === null || window === void 0 ? void 0 : window.screen) === null || _b === void 0 ? void 0 : _b.height) - (window === null || window === void 0 ? void 0 : window.innerHeight)}px` : '0';
|
|
8371
|
+
window.scroll({ top: 0, left: 0, behavior: 'smooth' });
|
|
8372
|
+
}
|
|
8326
8373
|
};
|
|
8327
8374
|
this.handleSlotChange = () => {
|
|
8328
8375
|
this.options = Array.from(this.host.querySelectorAll('cura-dropdown-search-option'));
|
|
@@ -8364,6 +8411,10 @@ class CuraDropdownSearch {
|
|
|
8364
8411
|
}
|
|
8365
8412
|
}
|
|
8366
8413
|
};
|
|
8414
|
+
this.setUp = () => {
|
|
8415
|
+
this.handleResize();
|
|
8416
|
+
this.adjustInputPosition();
|
|
8417
|
+
};
|
|
8367
8418
|
this.size = 'large';
|
|
8368
8419
|
this.status = 'default';
|
|
8369
8420
|
this.disabled = false;
|
|
@@ -8385,6 +8436,7 @@ class CuraDropdownSearch {
|
|
|
8385
8436
|
this.hoveredIndex = -1;
|
|
8386
8437
|
this.options = [];
|
|
8387
8438
|
this.originalOverflow = '';
|
|
8439
|
+
this.screenDefaultHeight = 0;
|
|
8388
8440
|
}
|
|
8389
8441
|
connectedCallback() {
|
|
8390
8442
|
this.weights = window.CuraAPI.theme.fonts.getWeights();
|
|
@@ -8417,12 +8469,15 @@ class CuraDropdownSearch {
|
|
|
8417
8469
|
}
|
|
8418
8470
|
}
|
|
8419
8471
|
componentDidLoad() {
|
|
8420
|
-
|
|
8421
|
-
|
|
8472
|
+
var _a;
|
|
8473
|
+
this.screenDefaultHeight = window === null || window === void 0 ? void 0 : window.innerHeight;
|
|
8474
|
+
window === null || window === void 0 ? void 0 : window.addEventListener('resize', this.setUp);
|
|
8475
|
+
(_a = window === null || window === void 0 ? void 0 : window.visualViewport) === null || _a === void 0 ? void 0 : _a.addEventListener('resize', this.adjustInputPosition);
|
|
8422
8476
|
}
|
|
8423
8477
|
disconnectedCallback() {
|
|
8424
|
-
|
|
8425
|
-
window.removeEventListener('resize', this.
|
|
8478
|
+
var _a;
|
|
8479
|
+
window === null || window === void 0 ? void 0 : window.removeEventListener('resize', this.setUp);
|
|
8480
|
+
(_a = window === null || window === void 0 ? void 0 : window.visualViewport) === null || _a === void 0 ? void 0 : _a.removeEventListener('resize', this.adjustInputPosition);
|
|
8426
8481
|
}
|
|
8427
8482
|
showOverlay() {
|
|
8428
8483
|
if (!this.overlayElement) {
|
|
@@ -8449,7 +8504,7 @@ class CuraDropdownSearch {
|
|
|
8449
8504
|
}
|
|
8450
8505
|
addClickListenersToOptions() {
|
|
8451
8506
|
this.options.forEach((option, index) => {
|
|
8452
|
-
option.addEventListener('optionSelected', () => this.onSelectedOption(index));
|
|
8507
|
+
option === null || option === void 0 ? void 0 : option.addEventListener('optionSelected', () => this.onSelectedOption(index));
|
|
8453
8508
|
});
|
|
8454
8509
|
}
|
|
8455
8510
|
updateSelectedOption(value) {
|
|
@@ -8457,7 +8512,7 @@ class CuraDropdownSearch {
|
|
|
8457
8512
|
this.hoveredIndex = selectedOptionIndex;
|
|
8458
8513
|
this.updateOptionAttribute('hovered', this.hoveredIndex);
|
|
8459
8514
|
this.updateOptionAttribute('selected', this.hoveredIndex);
|
|
8460
|
-
this.
|
|
8515
|
+
this.scrollHoveredOptionIntoView();
|
|
8461
8516
|
this.adjustInputPosition();
|
|
8462
8517
|
}
|
|
8463
8518
|
onSelectedOption(index) {
|
|
@@ -8477,7 +8532,7 @@ class CuraDropdownSearch {
|
|
|
8477
8532
|
const newIndex = (this.hoveredIndex + direction + visibleOptions.length) % visibleOptions.length;
|
|
8478
8533
|
this.hoveredIndex = newIndex;
|
|
8479
8534
|
this.updateOptionAttribute('hovered', this.hoveredIndex);
|
|
8480
|
-
this.
|
|
8535
|
+
this.scrollHoveredOptionIntoView();
|
|
8481
8536
|
}
|
|
8482
8537
|
updateOptionAttribute(attribute, indexToUpdate) {
|
|
8483
8538
|
this.options.forEach((option, index) => {
|
|
@@ -8489,7 +8544,7 @@ class CuraDropdownSearch {
|
|
|
8489
8544
|
const currentValue = this.value;
|
|
8490
8545
|
this.hoveredIndex = visibleOptions.findIndex(option => option.getAttribute('value') === currentValue);
|
|
8491
8546
|
}
|
|
8492
|
-
|
|
8547
|
+
scrollHoveredOptionIntoView() {
|
|
8493
8548
|
var _a;
|
|
8494
8549
|
const container = (_a = this.host.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.dropdown-search-list');
|
|
8495
8550
|
const hoveredOption = this.options[this.hoveredIndex];
|
|
@@ -8556,9 +8611,9 @@ class CuraDropdownSearch {
|
|
|
8556
8611
|
}
|
|
8557
8612
|
render() {
|
|
8558
8613
|
const isMobileDropdown = this.isMobile && this.isDropdownOpen;
|
|
8559
|
-
return (hAsync(Host, { key: '
|
|
8614
|
+
return (hAsync(Host, { key: 'b65367e4fa490b0dff8616bb9d82665bf3bb6f2b', style: this.hostCSSProperties(), class: "dropdown-overlay" }, hAsync("div", { key: 'ab7e1b6038a6dfa6b707bc97f225d68ed97bdc07', class: `dropdown ${isMobileDropdown ? 'dropdown-mobile' : ''}`, style: this.styles }, hAsync("div", { key: '7e3ab85750a9d868fa789d1f1841c0a907b8948c', class: this.getClasses() }, this.isMobile && this.isDropdownOpen && (hAsync("cura-button-transparent", { key: 'f171dceed48f41ad15736cbb358a1ffa6288d261', fontColor: "dark", onClick: () => this.handleGoBack(), iconName: "arrowLeft", size: "medium", iconOnly: true, color: "primary" })), hAsync("cura-input-text", { key: '53e7aa39324cc7c4ce52388f80823d0fb144d4e0', 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: () => {
|
|
8560
8615
|
this.handleOnBlur();
|
|
8561
|
-
}, placeholder: this.placeholder, size: this.size, onKeyDown: this.handleKeyDown }, hAsync("slot", { key: '
|
|
8616
|
+
}, placeholder: this.placeholder, size: this.size, onKeyDown: this.handleKeyDown }, hAsync("slot", { key: '0fec269301bc1aa23978ec2b52adb856e9e8f17d', name: "helperText" }))), hAsync("div", { key: 'a6060851435b1da0bac0adb2445bfb90000c17d7', id: "dropdown-search-list", class: this.getDropdownClasses() }, hAsync("slot", { key: '5443c23f1279be7243a27fccb39aa9ce35452b99', name: "dropdown-search-option", onSlotchange: this.handleSlotChange })))));
|
|
8562
8617
|
}
|
|
8563
8618
|
get host() { return getElement(this); }
|
|
8564
8619
|
static get watchers() { return {
|
|
@@ -8589,7 +8644,8 @@ class CuraDropdownSearch {
|
|
|
8589
8644
|
"isOnBlurInput": [32],
|
|
8590
8645
|
"hoveredIndex": [32],
|
|
8591
8646
|
"options": [32],
|
|
8592
|
-
"originalOverflow": [32]
|
|
8647
|
+
"originalOverflow": [32],
|
|
8648
|
+
"screenDefaultHeight": [32]
|
|
8593
8649
|
},
|
|
8594
8650
|
"$listeners$": undefined,
|
|
8595
8651
|
"$lazyBundleId$": "-",
|
|
@@ -8639,12 +8695,12 @@ class CuraDropdownSearchOption {
|
|
|
8639
8695
|
}
|
|
8640
8696
|
}
|
|
8641
8697
|
render() {
|
|
8642
|
-
return (hAsync(Host, { key: '
|
|
8698
|
+
return (hAsync(Host, { key: '515f662d5fb08cd77e7ad24de425ec34497e5e6e', slot: "dropdown-search-option" }, hAsync("div", { key: '8decccf2416ae3ea135bba38845da2a63c9cfdce', style: this.styles, class: {
|
|
8643
8699
|
"option-container": true,
|
|
8644
8700
|
hovered: this.selectable ? this.hovered : false,
|
|
8645
8701
|
selected: this.selected,
|
|
8646
8702
|
disabled: !this.selectable
|
|
8647
|
-
} }, hAsync("div", { key: '
|
|
8703
|
+
} }, hAsync("div", { key: '8c3cce88d40c764ae87cf8c54e3fb9fe9651f62d', class: "content-container" }, hAsync("div", { key: '1c674ff6a3721c42e034b994bf903d8608100cb8', class: "option-info", onClick: (e) => this.handleOptionClick(e) }, hAsync("slot", { key: '7a6545a242da0774b74a403b2dc26ce378d146fd', name: "image" }), hAsync("cura-heading", { key: '860fede2f20748b5e15ddf3222cd0c6ce3ff1f8c', size: "xsmall", lineHeight: "16px", marginBlock: "0px", weight: "bold", color: "neutral-black" }, hAsync("slot", { key: 'e9a7610e2d561cb399d58c44f98fb9ea0e6cf5c6' }))), hAsync("slot", { key: 'c784f7cddd4d5e246126ef43ab08e82db51fc2be', name: "action" })))));
|
|
8648
8704
|
}
|
|
8649
8705
|
get hostElement() { return getElement(this); }
|
|
8650
8706
|
static get watchers() { return {
|
|
@@ -8675,7 +8731,7 @@ class CuraDropdownSearchOptionTitle {
|
|
|
8675
8731
|
registerInstance(this, hostRef);
|
|
8676
8732
|
}
|
|
8677
8733
|
render() {
|
|
8678
|
-
return (hAsync(Host, { key: '
|
|
8734
|
+
return (hAsync(Host, { key: 'b378a877e6a90727e3216c284c2a064992f2dfc9', slot: "dropdown-search-option" }, hAsync("cura-label", { key: 'e2d457a7d42bcacae09012322b19a54e44fb109f', color: "neutral-dark", size: "xsmall", lineHeight: "16px", marginBlock: "0" }, hAsync("slot", { key: 'e889fa1839988a0f138e14ad15b0e250100ba38c' }))));
|
|
8679
8735
|
}
|
|
8680
8736
|
static get style() { return CuraDropdownSearchOptionTitleStyle0; }
|
|
8681
8737
|
static get cmpMeta() { return {
|
|
@@ -8755,7 +8811,7 @@ class CuraHeading {
|
|
|
8755
8811
|
return tags[`${this.level}`] || tags['default'];
|
|
8756
8812
|
}
|
|
8757
8813
|
render() {
|
|
8758
|
-
return (hAsync(Host, { key: '
|
|
8814
|
+
return (hAsync(Host, { key: '6384b5f7302399cca695c7c51d403ee704c95a48', style: this.hostCSSProperties() }, this.getHeadingTag()));
|
|
8759
8815
|
}
|
|
8760
8816
|
get host() { return getElement(this); }
|
|
8761
8817
|
static get watchers() { return {
|
|
@@ -8827,7 +8883,7 @@ class CuraIcon {
|
|
|
8827
8883
|
this.host.style.setProperty(prop, value);
|
|
8828
8884
|
}
|
|
8829
8885
|
render() {
|
|
8830
|
-
return (hAsync(Host, { key: '
|
|
8886
|
+
return (hAsync(Host, { key: '09f68d2b455427bf45dca2e6b30e993ebfa6b3a0' }, hAsync("svg", { key: 'f15fea7564efac510263f06f8d15288fec004f66', version: "1.1", viewBox: "0 0 24 24", preserveAspectRatio: "xMidYMid meet", xmlns: "http://www.w3.org/2000/svg" }, hAsync("use", { key: 'b88136d10453dc9e1d2c41ceb10676b348430ae3', xlinkHref: `${this.assetsPath}/icons/iconset-${this.iconset}.svg#${this.name}` }))));
|
|
8831
8887
|
}
|
|
8832
8888
|
get host() { return getElement(this); }
|
|
8833
8889
|
static get watchers() { return {
|
|
@@ -8871,7 +8927,7 @@ class CuraIconsView {
|
|
|
8871
8927
|
this.sizes.unshift(this.sizes.pop());
|
|
8872
8928
|
}
|
|
8873
8929
|
render() {
|
|
8874
|
-
return (hAsync(Host, { key: '
|
|
8930
|
+
return (hAsync(Host, { key: '4918bc5d13f24f3133af45ce5991b3f3f43e99cf' }, hAsync("div", { key: '837d47976a39702b13ceb5a7c5ac8ae097d34988', class: "iconDetail" }, hAsync("cura-heading", { key: 'de4c75c4652b464991aa173cf7243db65f9ba2ba', size: "small", "margin-block": "0 24px" }, "Icon: ", hAsync("b", { key: '77591ce199e5140ddcde3d7b956586d27fe6bc05' }, this.selected)), hAsync("div", { key: '6da36b174603d48ab3b11a8490c424f164855147', class: "iconSizes" }, this.sizes.map(size => hAsync("div", { class: "size" }, hAsync("cura-icon", { name: this.selected, size: size }), hAsync("span", null, size)))), hAsync("div", { key: '4920c8010e0a55f80bb557f4ba0e537b7861ae36', class: "iconSizes invert" }, this.sizes.map(size => hAsync("div", { class: "size" }, hAsync("cura-icon", { name: this.selected, size: size, color: "neutral-white" }), hAsync("span", null, size))))), hAsync("div", { key: '99739b351fb25036efd4b55774c0f077058be8fc', class: "icons" }, iconsetdefaulticons.map(icon => hAsync("div", { class: { icon: true, selected: icon === this.selected }, onClick: () => this.setSelected(icon) }, hAsync("cura-icon", { name: icon, size: "32", color: icon === this.selected ? 'accent-dark' : 'neutral-dark' }), hAsync("cura-label", { size: "xsmall", weight: icon === this.selected ? 'bold' : 'regular', color: icon === this.selected ? 'accent-dark' : 'neutral-dark' }, icon))))));
|
|
8875
8931
|
}
|
|
8876
8932
|
static get style() { return CuraIconsViewStyle0; }
|
|
8877
8933
|
static get cmpMeta() { return {
|
|
@@ -9054,7 +9110,7 @@ class CuraInputDate {
|
|
|
9054
9110
|
}
|
|
9055
9111
|
}
|
|
9056
9112
|
render() {
|
|
9057
|
-
return (hAsync(Host, { key: '
|
|
9113
|
+
return (hAsync(Host, { key: '1395108764c1957abb9371b82ab983d076aaf61e' }, hAsync("div", { key: 'e3134a1cfbf6f07b83f148b3e1b9c699e273a098', class: "container", style: this.styles }, hAsync("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()))));
|
|
9058
9114
|
}
|
|
9059
9115
|
static get formAssociated() { return true; }
|
|
9060
9116
|
get el() { return getElement(this); }
|
|
@@ -13129,7 +13185,7 @@ class CuraLabel {
|
|
|
13129
13185
|
};
|
|
13130
13186
|
}
|
|
13131
13187
|
render() {
|
|
13132
|
-
return (hAsync(Host, { key: '
|
|
13188
|
+
return (hAsync(Host, { key: '0155daf05e29fca75db8d8b8b103a4d3b60c1bc9', style: this.hostCSSProperties() }, hAsync("p", { key: 'cd63e97738f18f2842e3f6e3a0d086dd0c240651', style: this.styles, class: this.getClasses() }, hAsync("slot", { key: 'e20da850c970c10f03f832d59db1050f2329c856' }))));
|
|
13133
13189
|
}
|
|
13134
13190
|
get host() { return getElement(this); }
|
|
13135
13191
|
static get watchers() { return {
|
|
@@ -13176,7 +13232,7 @@ class CuraLoaderBar {
|
|
|
13176
13232
|
this.setProgress();
|
|
13177
13233
|
}
|
|
13178
13234
|
render() {
|
|
13179
|
-
return (hAsync(Host, { key: '
|
|
13235
|
+
return (hAsync(Host, { key: '4dc7ef7b17bfb408fa7ff9a74509637bb9045353' }, hAsync("div", { key: 'cd2654377f0b45c5b6fa6aa57940f5d81cfd0cce', id: "progress-bar", class: "progress-bar", style: this.styles }, hAsync("span", { key: '5d7b4a058162b840f167adb81843403f6c488c4e', class: "progress-bar-fill" }))));
|
|
13180
13236
|
}
|
|
13181
13237
|
setColor() {
|
|
13182
13238
|
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) });
|
|
@@ -13228,7 +13284,7 @@ class CuraLoaderCircle {
|
|
|
13228
13284
|
};
|
|
13229
13285
|
}
|
|
13230
13286
|
render() {
|
|
13231
|
-
return (hAsync(Host, { key: '
|
|
13287
|
+
return (hAsync(Host, { key: '627023f3e413d6a28e802eaf011f0ca39ccc17d9', style: this.getStyles() }, hAsync("svg", { key: '1f7dab1ef6e82d81ffacf336660c508c039e7430', viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, hAsync("g", { key: '4baeff0f8c83335be93cd067dbed2cfa5d0be88a' }, hAsync("circle", { key: '7929b1120288af1f17976a69463bf8965f2e4fae', cx: "8", cy: "8", r: "7", stroke: "url(#paint0_linear_13485_11488)", "stroke-width": "2" }), hAsync("path", { key: '832582680715bedebca8f025d141d40785832a86', d: "M1 8C1 4.13401 4.11877 1 7.96596 1C9.53445 1 10.9819 1.52093 12.1462 2.4C12.8959 2.96601 13.5282 3.68049 14 4.5", "stroke-width": "2" })), hAsync("defs", { key: 'ad393945da8c664faed05c17ed1c51cae3a02edb' }, hAsync("linearGradient", { key: 'bf42d208d369c60bbdad5adf81c4c61144ad34eb', id: "paint0_linear_13485_11488", x1: "15.7", y1: "4.5", x2: "4.15", y2: "11.5", gradientUnits: "userSpaceOnUse" }, hAsync("stop", { key: '445c119c6cebcfb057826ebd090b883aa479a8cd' }), hAsync("stop", { key: '47555985163574e69556490d1d09c6283d31845c', offset: "1" }))))));
|
|
13232
13288
|
}
|
|
13233
13289
|
static get style() { return CuraLoaderCircleStyle0; }
|
|
13234
13290
|
static get cmpMeta() { return {
|
|
@@ -13244,7 +13300,7 @@ class CuraLoaderCircle {
|
|
|
13244
13300
|
}; }
|
|
13245
13301
|
}
|
|
13246
13302
|
|
|
13247
|
-
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:
|
|
13303
|
+
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);width:700px;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}}";
|
|
13248
13304
|
var CuraModalStyle0 = curaModalCss;
|
|
13249
13305
|
|
|
13250
13306
|
class CuraModal {
|
|
@@ -13261,6 +13317,8 @@ class CuraModal {
|
|
|
13261
13317
|
this.bottom = 0;
|
|
13262
13318
|
this.left = 0;
|
|
13263
13319
|
this.right = 0;
|
|
13320
|
+
this.mobileCloseLabel = 'Fechar';
|
|
13321
|
+
this.zindex = '100';
|
|
13264
13322
|
this.styles = {};
|
|
13265
13323
|
}
|
|
13266
13324
|
setColors() {
|
|
@@ -13294,7 +13352,7 @@ class CuraModal {
|
|
|
13294
13352
|
this.setRight();
|
|
13295
13353
|
}
|
|
13296
13354
|
render() {
|
|
13297
|
-
return (hAsync(Host, { key: '
|
|
13355
|
+
return (hAsync(Host, { key: '50f4146aed5392ae16803fb060d4921a5e8a3271', role: "dialog", "aria-modal": "true", style: { '--zIndex': this.zindex } }, hAsync("div", { key: '149e99a4b8b479515ed3d67c5c8aea08d4d96d1c', class: this.open ? 'modal container open' : 'modal container', style: this.styles }, hAsync("div", { key: 'f32f7f7e16475c51babf95e1ca5f4fea449c1bb0', class: this.open ? 'modal backdrop open' : 'modal backdrop', onClick: this.handleClose }), hAsync("div", { key: '183f7ab8f2cee8106795f6104c38a2c93272387f', class: "wrapper" }, hAsync("button", { key: '28778c8120c92dfcae0443dccd21f55a204bd82e', class: "close desktop", onClick: this.handleClose }, hAsync("cura-icon", { key: 'a847de5c1314ea1460673870334f3f98e98f1cf9', name: "close", color: "error-dark", size: "small" })), hAsync("slot", { key: 'e08b556b7232425c2b83a21dac75d30fb4361a83' }), hAsync("button", { key: 'e736a95f878ff5a2ad6897d9140fd74b26939445', class: "close mobile", onClick: this.handleClose }, hAsync("cura-icon", { key: '9eaeaca6f4ea9d3cde5fd44e108de389c727f991', name: "close", color: "error-dark", size: "16" }), hAsync("cura-paragraph", { key: '2476b85e5dd7d6092d3d1d1714ee4a79b73b12d0', color: "error-dark", size: "small", marginBlock: "0" }, this.mobileCloseLabel))))));
|
|
13298
13356
|
}
|
|
13299
13357
|
static get watchers() { return {
|
|
13300
13358
|
"background": ["setColors"],
|
|
@@ -13314,11 +13372,13 @@ class CuraModal {
|
|
|
13314
13372
|
"bottom": [2],
|
|
13315
13373
|
"left": [2],
|
|
13316
13374
|
"right": [2],
|
|
13375
|
+
"mobileCloseLabel": [513, "mobile-close-label"],
|
|
13376
|
+
"zindex": [513],
|
|
13317
13377
|
"styles": [32]
|
|
13318
13378
|
},
|
|
13319
13379
|
"$listeners$": undefined,
|
|
13320
13380
|
"$lazyBundleId$": "-",
|
|
13321
|
-
"$attrsToReflect$": [["open", "open"]]
|
|
13381
|
+
"$attrsToReflect$": [["open", "open"], ["mobileCloseLabel", "mobile-close-label"], ["zindex", "zindex"]]
|
|
13322
13382
|
}; }
|
|
13323
13383
|
}
|
|
13324
13384
|
|
|
@@ -13341,7 +13401,7 @@ class CuraPageTemplate {
|
|
|
13341
13401
|
return classes;
|
|
13342
13402
|
}
|
|
13343
13403
|
render() {
|
|
13344
|
-
return (hAsync(Host, { key: '
|
|
13404
|
+
return (hAsync(Host, { key: '9f26fb8ceb8b22ed9223bd215c07b6a19f6d78f1' }, hAsync("div", { key: '38541ca9be4feecb9911c96cc954ba7501dc9b5e', style: this.styles, class: "grid-template" }, hAsync("div", { key: 'daf436a589d75bb270f4b16230d1db1d7365c47e', id: "sub-header" }, hAsync("slot", { key: '547c858a5913c600c1b745f400319d207a04c7ce', name: 'sub-header' })), hAsync("div", { key: 'ba69ae91e87af01a8001a347f6de7d8ba7088619', id: "header" }, hAsync("slot", { key: '6f72885d42d005f234942f2cbf8eefd98f4d0241', name: 'header' })), hAsync("div", { key: 'd21dbb37e236b1b22e886a036a37fb2e65e538f3', id: "pre-content" }, hAsync("slot", { key: '31b14b314d1ee2672f15883ea4bcc3c542520558', name: 'pre-content' })), hAsync("div", { key: 'a1297f482f15b4947043401b25e2c4ecbedd31fd', id: "content-container", class: this.getClasses() }, hAsync("div", { key: '9c0c466a46c5fc81c64663dd0aff4e073cc6cb72', id: "sidebar-left" }, hAsync("slot", { key: '10364527d218b1c05064095a5a69a411cb23322a', name: 'sidebar-left' })), hAsync("div", { key: '23029f84833a0959f43f30b4dcc5d8bc08a0bf05', id: "content" }, hAsync("slot", { key: '8dbcf34f4808d0983df99c77b52f927b8f1a69d7', name: "content" }), hAsync("slot", { key: '6a235586dfb316c6449d531a566940d8de4e4a40' })), hAsync("div", { key: 'b88f94db774c17aaa312ca55c9e67d611cabace3', id: "sidebar-right" }, hAsync("slot", { key: '5efbbf777d7acb28e91f4dace10558926dafef60', name: 'sidebar-right' }))), hAsync("div", { key: 'f40b983f2266e565faba96e8906cd69073b6598c', id: "post-body" }, hAsync("slot", { key: 'd0f047c73b5b777f1eb9d61191bf172473c100cf', name: 'post-body' })), hAsync("div", { key: 'b54482672a8017036b060203b5426bb2897c75fa', id: "footer" }, hAsync("slot", { key: '4c65d471dcd2dfabc32e163cb9575f3d05fb2cda', name: 'footer' })), hAsync("div", { key: '24c5d5a19e6d3fb943a1e99a7dfcfe9ad7cbb283', id: "sub-footer" }, hAsync("slot", { key: '6f595500cac9906db6902685f172feaa7ee9e711', name: 'sub-footer' })))));
|
|
13345
13405
|
}
|
|
13346
13406
|
get host() { return getElement(this); }
|
|
13347
13407
|
static get style() { return CuraPageTemplateStyle0; }
|
|
@@ -13407,7 +13467,7 @@ class CuraParagraph {
|
|
|
13407
13467
|
};
|
|
13408
13468
|
}
|
|
13409
13469
|
render() {
|
|
13410
|
-
return (hAsync(Host, { key: '
|
|
13470
|
+
return (hAsync(Host, { key: '2ca388b3d1c31588765768ece303decb6e421a81', style: this.hostCSSProperties() }, hAsync("p", { key: '1f31f6b9831cceed88606754581f282a515e3598', style: this.styles, class: this.setsizeClass() }, hAsync("slot", { key: 'f50ffaf10f933daac9e2ae901556bbfc62ac8a72' }))));
|
|
13411
13471
|
}
|
|
13412
13472
|
get host() { return getElement(this); }
|
|
13413
13473
|
static get watchers() { return {
|
|
@@ -13432,6 +13492,42 @@ class CuraParagraph {
|
|
|
13432
13492
|
}; }
|
|
13433
13493
|
}
|
|
13434
13494
|
|
|
13495
|
+
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}";
|
|
13496
|
+
var CuraProgressBarStyle0 = curaProgressBarCss;
|
|
13497
|
+
|
|
13498
|
+
class CuraProgressBar {
|
|
13499
|
+
constructor(hostRef) {
|
|
13500
|
+
registerInstance(this, hostRef);
|
|
13501
|
+
this.progressColor = undefined;
|
|
13502
|
+
this.progress = undefined;
|
|
13503
|
+
this.size = 40;
|
|
13504
|
+
this.strokeWidth = 3.25;
|
|
13505
|
+
this.active = undefined;
|
|
13506
|
+
}
|
|
13507
|
+
render() {
|
|
13508
|
+
const radius = (this.size - this.strokeWidth) / 2;
|
|
13509
|
+
const circumference = radius * Math.PI * 2;
|
|
13510
|
+
const dash = (this.progress * circumference) / 100;
|
|
13511
|
+
const viewBox = `0 0 ${this.size} ${this.size}`;
|
|
13512
|
+
return (hAsync(Host, { key: 'e0da7ede087161c67c9dd0371d15030dd5107a19' }, hAsync("div", { key: 'ebe68fb426b46e94b7d03ded4e8aaed852337f30', class: "progress-bar" }, hAsync("svg", { key: 'ace46878d45bfbe51dae29c3020d74f43c2f5147', width: this.size, height: this.size, viewBox: viewBox }, hAsync("circle", { key: 'dbbde61a95a7f13dc14a72fe538da43953852d7b', fill: "none", stroke: "#ccc", cx: this.size / 2, cy: this.size / 2, r: radius, "stroke-width": `${this.strokeWidth}px` }), this.active && (hAsync("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' } }))), hAsync("span", { key: 'a80f024e09fb54218fe97039459472855226c063' }, hAsync("slot", { key: '5683f5edd5b54bd852fc1036b284656bfda066c4' })))));
|
|
13513
|
+
}
|
|
13514
|
+
static get style() { return CuraProgressBarStyle0; }
|
|
13515
|
+
static get cmpMeta() { return {
|
|
13516
|
+
"$flags$": 9,
|
|
13517
|
+
"$tagName$": "cura-progress-bar",
|
|
13518
|
+
"$members$": {
|
|
13519
|
+
"progressColor": [513, "progress-color"],
|
|
13520
|
+
"progress": [514],
|
|
13521
|
+
"size": [514],
|
|
13522
|
+
"strokeWidth": [514, "stroke-width"],
|
|
13523
|
+
"active": [516]
|
|
13524
|
+
},
|
|
13525
|
+
"$listeners$": undefined,
|
|
13526
|
+
"$lazyBundleId$": "-",
|
|
13527
|
+
"$attrsToReflect$": [["progressColor", "progress-color"], ["progress", "progress"], ["size", "size"], ["strokeWidth", "stroke-width"], ["active", "active"]]
|
|
13528
|
+
}; }
|
|
13529
|
+
}
|
|
13530
|
+
|
|
13435
13531
|
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)}";
|
|
13436
13532
|
var CuraRadioStyle0 = curaRadioCss;
|
|
13437
13533
|
|
|
@@ -13564,7 +13660,7 @@ class CuraRadio {
|
|
|
13564
13660
|
return statusColors[this.status][type];
|
|
13565
13661
|
}
|
|
13566
13662
|
render() {
|
|
13567
|
-
return (hAsync(Host, { key: '
|
|
13663
|
+
return (hAsync(Host, { key: 'eecc279b05da57162acf41d62bac48a00cc9d985' }, hAsync("div", { key: '279b6922349bf02b7e65065bcb98b9c824073516', class: this.getClasses(), style: this.styles }, hAsync("div", { key: 'a6a2de8f8d7e6efbca3aee079255451e448903a2', class: "info" }, hAsync("div", { key: '6d2733ca86d087031e1ec4fdea26d5906f695479', class: "label-wrapper" }, hAsync("cura-label", { key: '2c0c878411bb846ff7bcf24c385895f1d86b3022', class: "label", size: this.size === 'large' ? 'medium' : 'xsmall', color: this.assignColor('label') }, this.label), this.required && hAsync("cura-paragraph", { key: '07abc53858276dc6429381a0c658c562e1d05933', lineHeight: '0%', marginBlock: '0', color: "error-base" }, "* ")), hAsync("cura-label", { key: 'ab5c0451842242ee584f2d3b430b803498190118', color: this.assignColor('message'), size: "xsmall", class: "message" }, hAsync("slot", { key: '3673a0a1ecc7f9dfa6975bdddaf708ed8ad1b72d' }))), hAsync("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 }))));
|
|
13568
13664
|
}
|
|
13569
13665
|
static get formAssociated() { return true; }
|
|
13570
13666
|
get host() { return getElement(this); }
|
|
@@ -13598,7 +13694,7 @@ class CuraRadio {
|
|
|
13598
13694
|
}; }
|
|
13599
13695
|
}
|
|
13600
13696
|
|
|
13601
|
-
const curaSelectCss = ":host{display:block;position:relative;font-family:var(--font-family)}.wrapper{width:100%;user-select:none;text-align:left !important}.wrapper cura-label{margin-bottom:8px}.wrapper .helper-text{margin-top:8px;color:var(--neutral-dark)}.wrapper .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box}.wrapper .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper .cura-input-field .feedback-icon{padding-left:12px}.wrapper .cura-input-field .up-down-icon{order:3;padding-right:12px;cursor:pointer;pointer-events:all}.wrapper .cura-input-field input{padding:0px 12px 0px 8px;cursor:pointer}.wrapper .cura-input-field.open{border-radius:4px 4px 0 0 !important}.wrapper.transparent{background-color:transparent;padding:0px;max-height:80px}.wrapper.transparent .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box;background-color:transparent !important;border:none !important;border-radius:0;height:27px}.wrapper.transparent .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.transparent .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.transparent .cura-input-field .feedback-icon{padding-left:12px}.wrapper.transparent .cura-input-field input{color:var(--neutral-black) !important;font-size:16px;font-weight:var(--font-weight-bold) !important;padding:0}.wrapper.transparent .cura-input-field input::placeholder{color:var(--neutral-black)}.wrapper.transparent .cura-input-field .feedback-icon{order:3;margin:0 20px 0 0}.wrapper.transparent:focus-within .cura-input-field{border:none !important;background-color:transparent !important}.wrapper.transparent:focus-within .cura-input-field input{border:none !important;outline:none}.wrapper.transparent .helper-text{margin-top:0px}.wrapper:hover:not(.disabled):not(.isLoading):not(.success):not(.error):not(.isFocused):not(.readOnly):not(.transparent) .cura-input-field{border-color:var(--neutral-dark)}.wrapper:hover:not(.disabled):not(.isLoading):not(.success):not(.error):not(.isFocused):not(.readOnly):not(.transparent) .cura-input-field input{color:var(--neutral-dark)}.wrapper:hover:not(.disabled):not(.isLoading):not(.success):not(.error):not(.isFocused):not(.readOnly):not(.transparent) .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper:focus-within:not(.selection) .cura-input-field{border:2px solid var(--info-base) !important;background-color:var(--neutral-purewhite);outline:none}.wrapper:focus-within:not(.selection) .cura-input-field input{color:var(--neutral-black) !important}.wrapper:focus-within.selection .cura-input-field{border-radius:4px 4px 0px 0px}.wrapper.success .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box}.wrapper.success .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.success .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.success .cura-input-field .feedback-icon{padding-left:12px}.wrapper.success .cura-input-field input{color:var(--success-darker) !important}.wrapper.success .cura-input-field input::placeholder{color:var(--success-darker) !important}.wrapper.success:not(.transparent) .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box;border:2px solid var(--success-dark) !important;background-color:var(--success-lighter) !important}.wrapper.success:not(.transparent) .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.success:not(.transparent) .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.success:not(.transparent) .cura-input-field .feedback-icon{padding-left:12px}.wrapper.error .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box}.wrapper.error .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.error .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.error .cura-input-field .feedback-icon{padding-left:12px}.wrapper.error .cura-input-field input{color:var(--error-darker) !important}.wrapper.error .cura-input-field input::placeholder{color:var(--error-darker) !important}.wrapper.error:not(.transparent) .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box;border:2px solid var(--error-dark) !important;background-color:var(--error-lighter) !important}.wrapper.error:not(.transparent) .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.error:not(.transparent) .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.error:not(.transparent) .cura-input-field .feedback-icon{padding-left:12px}.wrapper.small .cura-input-field{width:100%;height:32px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box}.wrapper.small .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:12px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.small .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.small .cura-input-field .feedback-icon{padding-left:12px}.wrapper.small .cura-input-field input{line-height:13px;letter-spacing:0.72px}.wrapper.small .helper-text{margin-top:8px;color:var(--neutral-dark);font-weight:var(--font-weight-regular)}.wrapper.small.label .menu{top:53px}.wrapper.small .menu{top:33px}.wrapper.medium .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box}.wrapper.medium .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.medium .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.medium .cura-input-field .feedback-icon{padding-left:12px}.wrapper.medium .cura-input-field input{line-height:16px;letter-spacing:0.56px}.wrapper.medium .helper-text{margin-top:8px;color:var(--neutral-dark);font-weight:var(--font-weight-regular)}.wrapper.medium.label .menu{top:61px}.wrapper.medium .menu{top:40px}.wrapper.large .cura-input-field{width:100%;height:44px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box}.wrapper.large .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:16px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.large .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.large .cura-input-field .feedback-icon{padding-left:12px}.wrapper.large .helper-text{margin-top:8px;color:var(--neutral-dark);font-weight:var(--font-weight-bold)}.wrapper.large.label .menu{top:69px}.wrapper.large .menu{top:47px}.wrapper.disabled .cura-input-field{background-color:var(--neutral-white);border:2px solid var(--neutral-base)}.wrapper.disabled .cura-input-field input{color:var(--neutral-medium)}.wrapper.disabled .cura-input-field input::placeholder{color:var(--neutral-medium)}.required{color:red}.menu{position:absolute;left:0;right:-1px;background:#fff;border:2px solid var(--neutral-light);border-radius:4px;z-index:1000;max-height:285px;overflow:hidden;border-top:transparent;align-items:center;scrollbar-color:var(--neutral-medium) var(--neutral-black-20);overflow-y:auto;box-shadow:0px 4px 8px 0px rgba(38, 38, 38, 0.16)}.menu.open{border-radius:0 !important}";
|
|
13697
|
+
const curaSelectCss = ":host{display:block;position:relative;font-family:var(--font-family)}.wrapper{width:100%;user-select:none;text-align:left !important}.wrapper cura-label{margin-bottom:8px}.wrapper .helper-text{margin-top:8px;color:var(--neutral-dark)}.wrapper .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box}.wrapper .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper .cura-input-field .feedback-icon{padding-left:12px}.wrapper .cura-input-field .up-down-icon{order:3;padding-right:9px;cursor:pointer;pointer-events:all}.wrapper .cura-input-field .up-down-button{background-color:transparent;border:none}.wrapper .cura-input-field input{padding:0px 12px 0px 8px;cursor:pointer}.wrapper .cura-input-field.open{border-radius:4px 4px 0 0 !important}.wrapper.transparent{background-color:transparent;padding:0px;max-height:80px}.wrapper.transparent .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box;background-color:transparent !important;border:none !important;border-radius:0;height:27px}.wrapper.transparent .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.transparent .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.transparent .cura-input-field .feedback-icon{padding-left:12px}.wrapper.transparent .cura-input-field input{color:var(--neutral-black) !important;font-size:16px;font-weight:var(--font-weight-bold) !important;padding:0}.wrapper.transparent .cura-input-field input::placeholder{color:var(--neutral-black)}.wrapper.transparent .cura-input-field .feedback-icon{order:3;margin:0 20px 0 0}.wrapper.transparent:focus-within .cura-input-field{border:none !important;background-color:transparent !important}.wrapper.transparent:focus-within .cura-input-field input{border:none !important;outline:none}.wrapper.transparent .helper-text{margin-top:0px}.wrapper:hover:not(.disabled):not(.isLoading):not(.success):not(.error):not(.isFocused):not(.readOnly):not(.transparent) .cura-input-field{border-color:var(--neutral-dark)}.wrapper:hover:not(.disabled):not(.isLoading):not(.success):not(.error):not(.isFocused):not(.readOnly):not(.transparent) .cura-input-field input{color:var(--neutral-dark)}.wrapper:hover:not(.disabled):not(.isLoading):not(.success):not(.error):not(.isFocused):not(.readOnly):not(.transparent) .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper:focus-within:not(.selection) .cura-input-field{border:2px solid var(--info-base) !important;background-color:var(--neutral-purewhite);outline:none}.wrapper:focus-within:not(.selection) .cura-input-field input{color:var(--neutral-black) !important}.wrapper:focus-within.selection .cura-input-field{border-radius:4px 4px 0px 0px}.wrapper.success .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box}.wrapper.success .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.success .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.success .cura-input-field .feedback-icon{padding-left:12px}.wrapper.success .cura-input-field input{color:var(--success-darker) !important}.wrapper.success .cura-input-field input::placeholder{color:var(--success-darker) !important}.wrapper.success:not(.transparent) .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box;border:2px solid var(--success-dark) !important;background-color:var(--success-lighter) !important}.wrapper.success:not(.transparent) .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.success:not(.transparent) .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.success:not(.transparent) .cura-input-field .feedback-icon{padding-left:12px}.wrapper.error .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box}.wrapper.error .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.error .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.error .cura-input-field .feedback-icon{padding-left:12px}.wrapper.error .cura-input-field input{color:var(--error-darker) !important}.wrapper.error .cura-input-field input::placeholder{color:var(--error-darker) !important}.wrapper.error:not(.transparent) .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box;border:2px solid var(--error-dark) !important;background-color:var(--error-lighter) !important}.wrapper.error:not(.transparent) .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.error:not(.transparent) .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.error:not(.transparent) .cura-input-field .feedback-icon{padding-left:12px}.wrapper.small .cura-input-field{width:100%;height:32px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box}.wrapper.small .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:12px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.small .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.small .cura-input-field .feedback-icon{padding-left:12px}.wrapper.small .cura-input-field input{line-height:13px;letter-spacing:0.72px}.wrapper.small .helper-text{margin-top:8px;color:var(--neutral-dark);font-weight:var(--font-weight-regular)}.wrapper.small.label .menu{top:53px}.wrapper.small .menu{top:33px}.wrapper.medium .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box}.wrapper.medium .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.medium .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.medium .cura-input-field .feedback-icon{padding-left:12px}.wrapper.medium .cura-input-field input{line-height:16px;letter-spacing:0.56px}.wrapper.medium .helper-text{margin-top:8px;color:var(--neutral-dark);font-weight:var(--font-weight-regular)}.wrapper.medium.label .menu{top:61px}.wrapper.medium .menu{top:40px}.wrapper.large .cura-input-field{width:100%;height:44px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box}.wrapper.large .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:16px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.large .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.large .cura-input-field .feedback-icon{padding-left:12px}.wrapper.large .helper-text{margin-top:8px;color:var(--neutral-dark);font-weight:var(--font-weight-bold)}.wrapper.large.label .menu{top:69px}.wrapper.large .menu{top:47px}.wrapper.disabled .cura-input-field{background-color:var(--neutral-white);border:2px solid var(--neutral-base)}.wrapper.disabled .cura-input-field input{color:var(--neutral-medium)}.wrapper.disabled .cura-input-field input::placeholder{color:var(--neutral-medium)}.required{color:red}.menu{position:absolute;left:0;right:-1px;background:#fff;border:2px solid var(--neutral-light);border-radius:4px;z-index:1000;max-height:285px;overflow:hidden;border-top:transparent;align-items:center;scrollbar-color:var(--neutral-medium) var(--neutral-black-20);overflow-y:auto;box-shadow:0px 4px 8px 0px rgba(38, 38, 38, 0.16)}.menu.open{border-radius:0 !important}";
|
|
13602
13698
|
var CuraSelectStyle0 = curaSelectCss;
|
|
13603
13699
|
|
|
13604
13700
|
class CuraSelect {
|
|
@@ -13693,7 +13789,7 @@ class CuraSelect {
|
|
|
13693
13789
|
this.textInput = '';
|
|
13694
13790
|
}
|
|
13695
13791
|
updateOptionHighlights(newActiveINdex) {
|
|
13696
|
-
this.options.forEach((option, index) => option.active = index === newActiveINdex);
|
|
13792
|
+
this.options.forEach((option, index) => (option.active = index === newActiveINdex));
|
|
13697
13793
|
}
|
|
13698
13794
|
/**
|
|
13699
13795
|
* Filters the options based on the current input value.
|
|
@@ -13710,21 +13806,21 @@ class CuraSelect {
|
|
|
13710
13806
|
});
|
|
13711
13807
|
}
|
|
13712
13808
|
/**
|
|
13713
|
-
|
|
13714
|
-
|
|
13809
|
+
* Callback for form association.
|
|
13810
|
+
*/
|
|
13715
13811
|
formAssociatedCallback(form) {
|
|
13716
13812
|
form.ariaLabel = this.label;
|
|
13717
13813
|
}
|
|
13718
13814
|
/**
|
|
13719
|
-
|
|
13720
|
-
|
|
13815
|
+
* Callback to restore the switch state from the form.
|
|
13816
|
+
*/
|
|
13721
13817
|
formStateRestoreCallback(state) {
|
|
13722
13818
|
this.textInput = state.value;
|
|
13723
13819
|
this.updateSelectedOption();
|
|
13724
13820
|
}
|
|
13725
13821
|
/**
|
|
13726
|
-
|
|
13727
|
-
|
|
13822
|
+
* Callback to reset the switch state when the form is reset.
|
|
13823
|
+
*/
|
|
13728
13824
|
formResetCallback() {
|
|
13729
13825
|
this.textInput = '';
|
|
13730
13826
|
this.clearSelectedAttributes();
|
|
@@ -13732,8 +13828,8 @@ class CuraSelect {
|
|
|
13732
13828
|
this.internals.setValidity({});
|
|
13733
13829
|
}
|
|
13734
13830
|
/**
|
|
13735
|
-
|
|
13736
|
-
|
|
13831
|
+
* Callback to update the switch's disabled state when the form's disabled state changes.
|
|
13832
|
+
*/
|
|
13737
13833
|
formDisabledCallback(disabled) {
|
|
13738
13834
|
this.disabled = disabled;
|
|
13739
13835
|
}
|
|
@@ -13788,9 +13884,22 @@ class CuraSelect {
|
|
|
13788
13884
|
const fontWeights = fonts.getWeights();
|
|
13789
13885
|
this.styles = Object.assign(Object.assign({}, this.styles), { '--font-weight-medium': fontWeights.medium, '--font-weight-bold': fontWeights.bold, '--font-weight-regular': fontWeights.regular, '--font-color': fonts.getColor(), '--font-family': fonts.getFamily(), '--font-size': fonts.getSize() });
|
|
13790
13886
|
const colorKeys = [
|
|
13791
|
-
'primary-base',
|
|
13792
|
-
'neutral-
|
|
13793
|
-
'
|
|
13887
|
+
'primary-base',
|
|
13888
|
+
'neutral-purewhite',
|
|
13889
|
+
'neutral-white',
|
|
13890
|
+
'neutral-black',
|
|
13891
|
+
'neutral-medium',
|
|
13892
|
+
'neutral-light',
|
|
13893
|
+
'neutral-base',
|
|
13894
|
+
'neutral-dark',
|
|
13895
|
+
'success-dark',
|
|
13896
|
+
'success-darker',
|
|
13897
|
+
'success-lighter',
|
|
13898
|
+
'error-lighter',
|
|
13899
|
+
'error-dark',
|
|
13900
|
+
'error-darker',
|
|
13901
|
+
'error-base',
|
|
13902
|
+
'info-base',
|
|
13794
13903
|
];
|
|
13795
13904
|
colorKeys.forEach(key => {
|
|
13796
13905
|
this.styles[`--${key}`] = colors.getColor(key);
|
|
@@ -13873,16 +13982,16 @@ class CuraSelect {
|
|
|
13873
13982
|
if (this.status === 'default')
|
|
13874
13983
|
return null;
|
|
13875
13984
|
const icon = { success: 'checkCircle', error: 'alertCircle' }[this.status];
|
|
13876
|
-
return
|
|
13985
|
+
return hAsync("cura-icon", { class: "feedback-icon", name: icon, iconset: "default", size: this.size === 'large' ? 20 : 16, color: this.getColor('icon'), style: this.styles });
|
|
13877
13986
|
}
|
|
13878
13987
|
render() {
|
|
13879
|
-
return (hAsync(Host, { key: '
|
|
13988
|
+
return (hAsync(Host, { key: 'd0433e214411ca390ff69ffbfdc2d8d3f6364b9c', style: this.styles }, hAsync("div", { key: 'e644f2ff6f37867ab5d6737f99d772c72fdf17b9', class: this.getClasses(), onMouseEnter: () => (this.isHovered = true), onMouseLeave: () => (this.isHovered = false), onClick: this.handleClick }, this.label && (hAsync("cura-label", { key: '7f382f95d58b6e90b9e7f82ade4d55a4ae74a952', class: "label", weight: "bold", size: this.size === 'large' ? 'small' : 'xsmall', color: this.getColor('label') }, this.label, " ", this.required && hAsync("span", { key: 'e782b69050063221f9f8c011c753f03bff1b2fed', class: "required" }, "* "))), hAsync("div", { key: 'b9b1c4a4ad3b19bbec7640bbbe7921fc2e2dc2a9', class: {
|
|
13880
13989
|
'cura-input-field': true,
|
|
13881
|
-
'open': this.isOpen
|
|
13882
|
-
} }, this.renderIcon(), hAsync("input", { key: '
|
|
13883
|
-
|
|
13884
|
-
|
|
13885
|
-
} }, hAsync("slot", { key: '
|
|
13990
|
+
'open': this.isOpen,
|
|
13991
|
+
} }, this.renderIcon(), hAsync("input", { key: 'f107ce1837c7eb5e2be8e21073bc514861e36de5', type: "text", autocomplete: "off", onFocus: () => (this.isFocused = true), onBlur: () => (this.isFocused = false), onKeyDown: this.handleKeyNavigation, "aria-required": String(this.required), "aria-disabled": String(this.disabled), "aria-invalid": String(this.status === 'error'), onInput: this.handleInputChange, style: this.styles, placeholder: this.placeholder, disabled: this.disabled, required: this.required, value: this.textInput, readonly: this.searchBehavior ? null : true }), hAsync("button", { key: '2d535a37f67c28eee7a868de1d5fe5297aa91a1d', class: "up-down-button" }, hAsync("cura-icon", { key: '9292fb9f72d3c4f67b0cffaafdc3c0cceefb5b07', name: this.isOpen ? 'up' : 'down', class: "up-down-icon", color: this.disabled ? 'neutral-dark' : 'primary-base', size: 16, iconset: "default" }))), hAsync("cura-label", { key: '344572553d1920a66cab43912cae5f24200789c5', class: "helper-text", size: "xsmall", color: this.getColor('text'), weight: this.mode === 'transparent' ? 'bold' : 'regular' }, hAsync("slot", { key: 'a2dd9204ad33c6fb2518dca1bfaa18cc51c19d2a' })), this.isOpen && (hAsync("div", { key: '73fd79fd3073b0a9a4537e104e9e1721129da480', class: {
|
|
13992
|
+
menu: true,
|
|
13993
|
+
open: this.isOpen,
|
|
13994
|
+
} }, hAsync("slot", { key: 'dfd5a1f698dddeab8efec68beb5ff038024571dd', name: "option" }))))));
|
|
13886
13995
|
}
|
|
13887
13996
|
static get formAssociated() { return true; }
|
|
13888
13997
|
get host() { return getElement(this); }
|
|
@@ -13956,7 +14065,7 @@ class CuraSelectOption {
|
|
|
13956
14065
|
};
|
|
13957
14066
|
}
|
|
13958
14067
|
render() {
|
|
13959
|
-
return (hAsync(Host, { key: '
|
|
14068
|
+
return (hAsync(Host, { key: '7633d57e0ab5ba265c31e53dde513bdb0bc934e8', slot: "option" }, hAsync("div", { key: 'aa301dd963ffde79251ad79428934609ba70d713', class: this.getClasses(), style: this.styles }, hAsync("cura-label", { key: '2a55fc05a9bb9a47a4a4b191e85ce5fdb6c7d5cf', color: `${this.selected ? 'primary-base' : 'neutral-black'}`, size: this.getSize('label'), "margin-block": "0" }, hAsync("slot", { key: '4f28e0d1142cf847174f72614470b89ac3495197' })), this.selected && hAsync("cura-icon", { key: '189b1b8877e68648f5282281df144ead39b64441', name: 'check', size: this.getSize('icon'), color: "primary-base" }))));
|
|
13960
14069
|
}
|
|
13961
14070
|
get host() { return getElement(this); }
|
|
13962
14071
|
static get watchers() { return {
|
|
@@ -13979,6 +14088,216 @@ class CuraSelectOption {
|
|
|
13979
14088
|
}; }
|
|
13980
14089
|
}
|
|
13981
14090
|
|
|
14091
|
+
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}";
|
|
14092
|
+
var CuraStepperStyle0 = curaStepperCss;
|
|
14093
|
+
|
|
14094
|
+
class CuraStepper {
|
|
14095
|
+
constructor(hostRef) {
|
|
14096
|
+
registerInstance(this, hostRef);
|
|
14097
|
+
this.activeStepIndex = undefined;
|
|
14098
|
+
this.errorInCurrentStep = false;
|
|
14099
|
+
this.displayHeading = false;
|
|
14100
|
+
this.variant = 'default';
|
|
14101
|
+
this.steps = [];
|
|
14102
|
+
this.styles = {};
|
|
14103
|
+
this.stepList = [];
|
|
14104
|
+
}
|
|
14105
|
+
connectedCallback() {
|
|
14106
|
+
this.initializeSteps();
|
|
14107
|
+
const { fonts, colors, spacing } = window.CuraAPI.theme;
|
|
14108
|
+
const weights = fonts.getWeights();
|
|
14109
|
+
this.styles = this.generateStyles(colors, fonts, spacing, weights);
|
|
14110
|
+
}
|
|
14111
|
+
generateStyles(colors, fonts, spacing, weights) {
|
|
14112
|
+
return {
|
|
14113
|
+
'--base-spacing': spacing.getSpacing(),
|
|
14114
|
+
'--neutral-purewhite': colors.getColor('neutral-purewhite'),
|
|
14115
|
+
'--neutral-lighter': colors.getColor('neutral-lighter'),
|
|
14116
|
+
'--neutral-base': colors.getColor('neutral-base'),
|
|
14117
|
+
'--neutral-light': colors.getColor('neutral-light'),
|
|
14118
|
+
'--success-light': colors.getColor('success-light'),
|
|
14119
|
+
'--info-light': colors.getColor('info-light'),
|
|
14120
|
+
'--error-light': colors.getColor('error-light'),
|
|
14121
|
+
'--font-size': fonts.getSize(),
|
|
14122
|
+
'--font-color': fonts.getColor(),
|
|
14123
|
+
'--font-family': fonts.getFamily(),
|
|
14124
|
+
'--font-weight-regular': weights.regular,
|
|
14125
|
+
};
|
|
14126
|
+
}
|
|
14127
|
+
initializeSteps() {
|
|
14128
|
+
if (typeof this.steps === 'string') {
|
|
14129
|
+
this.stepList = JSON.parse(this.steps || '[]');
|
|
14130
|
+
}
|
|
14131
|
+
else {
|
|
14132
|
+
this.stepList = this.steps;
|
|
14133
|
+
}
|
|
14134
|
+
}
|
|
14135
|
+
getStepStatus(step) {
|
|
14136
|
+
if (this.activeStepIndex === step && this.errorInCurrentStep)
|
|
14137
|
+
return 'stop';
|
|
14138
|
+
if (this.activeStepIndex === step && this.stepList.length !== step)
|
|
14139
|
+
return 'active';
|
|
14140
|
+
if (this.activeStepIndex >= step)
|
|
14141
|
+
return 'done';
|
|
14142
|
+
return 'default';
|
|
14143
|
+
}
|
|
14144
|
+
getProgressStyles() {
|
|
14145
|
+
const progressStyles = {
|
|
14146
|
+
default: {
|
|
14147
|
+
progressColor: 'var(--info-light)',
|
|
14148
|
+
activeStepTextColor: 'info-darker',
|
|
14149
|
+
nextStepTextColor: 'info-dark',
|
|
14150
|
+
},
|
|
14151
|
+
firstStep: {
|
|
14152
|
+
progressColor: 'var(--info-light)',
|
|
14153
|
+
activeStepTextColor: 'neutral-dark',
|
|
14154
|
+
nextStepTextColor: 'neutral-medium',
|
|
14155
|
+
},
|
|
14156
|
+
completed: {
|
|
14157
|
+
progressColor: 'var(--success-light)',
|
|
14158
|
+
activeStepTextColor: 'success-darker',
|
|
14159
|
+
nextStepTextColor: 'success-dark',
|
|
14160
|
+
},
|
|
14161
|
+
error: {
|
|
14162
|
+
progressColor: 'var(--error-light)',
|
|
14163
|
+
activeStepTextColor: 'error-darker',
|
|
14164
|
+
nextStepTextColor: 'error-dark',
|
|
14165
|
+
},
|
|
14166
|
+
};
|
|
14167
|
+
if (this.errorInCurrentStep) {
|
|
14168
|
+
return progressStyles.error;
|
|
14169
|
+
}
|
|
14170
|
+
if (this.activeStepIndex === 0) {
|
|
14171
|
+
return progressStyles.firstStep;
|
|
14172
|
+
}
|
|
14173
|
+
if (this.activeStepIndex === this.stepList.length) {
|
|
14174
|
+
return progressStyles.completed;
|
|
14175
|
+
}
|
|
14176
|
+
return progressStyles.default;
|
|
14177
|
+
}
|
|
14178
|
+
renderCompactStepper() {
|
|
14179
|
+
var _a;
|
|
14180
|
+
const title = this.activeStepIndex === 0 ? this.stepList[this.activeStepIndex].title : this.stepList[this.activeStepIndex - 1].title;
|
|
14181
|
+
const subtitle = this.activeStepIndex === 0 ? this.stepList[this.activeStepIndex + 1].title : (_a = this.stepList[this.activeStepIndex]) === null || _a === void 0 ? void 0 : _a.title;
|
|
14182
|
+
const completed = this.activeStepIndex === this.stepList.length;
|
|
14183
|
+
const inProgress = !(completed || this.errorInCurrentStep);
|
|
14184
|
+
const { progressColor, activeStepTextColor, nextStepTextColor } = this.getProgressStyles();
|
|
14185
|
+
// Representa a porcentagem de progresso (step atual / quantidade de steps;)
|
|
14186
|
+
const progress = (this.activeStepIndex * 100) / this.stepList.length;
|
|
14187
|
+
return (hAsync("div", { class: "container compact", style: this.styles }, hAsync("cura-progress-bar", { progress: progress, progressColor: progressColor, active: this.activeStepIndex !== 0 }, !inProgress ? (hAsync("cura-icon", { name: this.errorInCurrentStep ? 'alertCircle' : 'checkCircle', color: this.errorInCurrentStep ? 'error-dark' : 'success-dark', size: "16" })) : (hAsync("cura-heading", { color: "neutral-dark", size: "xsmall" }, this.activeStepIndex, "/", this.stepList.length))), this.displayHeading && (hAsync("div", { class: "heading" }, hAsync("cura-heading", { size: "small", weight: "bold", color: activeStepTextColor }, title), !completed && (hAsync("cura-heading", { size: "xsmall", weight: "regular", color: nextStepTextColor }, "Pr\u00F3ximo: ", subtitle))))));
|
|
14188
|
+
}
|
|
14189
|
+
renderStep(step, stepIndex) {
|
|
14190
|
+
const stepStatus = this.getStepStatus(stepIndex + 1);
|
|
14191
|
+
const lastStep = stepIndex === this.stepList.length - 1;
|
|
14192
|
+
const progressWidth = stepStatus !== 'default' ? '100%' : '0';
|
|
14193
|
+
return (hAsync("div", { class: `step ${lastStep ? 'last' : ''}`, key: step.title }, hAsync("cura-stepper-item", { heading: step.title, label: step.label, displayHeading: this.displayHeading, status: stepStatus }), stepIndex < this.stepList.length - 1 && (hAsync("div", { class: "wrapper" }, hAsync("div", { class: "divider" }), hAsync("div", { class: `divider ${stepStatus} animation`, style: { '--progress-width': progressWidth } })))));
|
|
14194
|
+
}
|
|
14195
|
+
renderStepper() {
|
|
14196
|
+
return (hAsync("div", { class: "container", style: this.styles }, hAsync("div", { class: "stepper-list" }, this.stepList.map((step, stepIndex) => this.renderStep(step, stepIndex)))));
|
|
14197
|
+
}
|
|
14198
|
+
render() {
|
|
14199
|
+
return hAsync(Host, { key: 'a3c23a43dc82cba74b777a7e28ae7de1632ec95d' }, this.variant === 'default' ? this.renderStepper() : this.renderCompactStepper());
|
|
14200
|
+
}
|
|
14201
|
+
get host() { return getElement(this); }
|
|
14202
|
+
static get style() { return CuraStepperStyle0; }
|
|
14203
|
+
static get cmpMeta() { return {
|
|
14204
|
+
"$flags$": 9,
|
|
14205
|
+
"$tagName$": "cura-stepper",
|
|
14206
|
+
"$members$": {
|
|
14207
|
+
"activeStepIndex": [514, "active-step-index"],
|
|
14208
|
+
"errorInCurrentStep": [516, "error-in-current-step"],
|
|
14209
|
+
"displayHeading": [516, "display-heading"],
|
|
14210
|
+
"variant": [513],
|
|
14211
|
+
"steps": [1],
|
|
14212
|
+
"styles": [32],
|
|
14213
|
+
"stepList": [32]
|
|
14214
|
+
},
|
|
14215
|
+
"$listeners$": undefined,
|
|
14216
|
+
"$lazyBundleId$": "-",
|
|
14217
|
+
"$attrsToReflect$": [["activeStepIndex", "active-step-index"], ["errorInCurrentStep", "error-in-current-step"], ["displayHeading", "display-heading"], ["variant", "variant"]]
|
|
14218
|
+
}; }
|
|
14219
|
+
}
|
|
14220
|
+
|
|
14221
|
+
const curaStepperItemCss = ":host{display:block;box-sizing:border-box}.item-container{display:flex;gap:4px;align-items:center}";
|
|
14222
|
+
var CuraStepperItemStyle0 = curaStepperItemCss;
|
|
14223
|
+
|
|
14224
|
+
class CuraStepperItem {
|
|
14225
|
+
constructor(hostRef) {
|
|
14226
|
+
registerInstance(this, hostRef);
|
|
14227
|
+
this.statusMap = {
|
|
14228
|
+
active: {
|
|
14229
|
+
badgeColor: 'info',
|
|
14230
|
+
textColor: 'info-dark',
|
|
14231
|
+
icon: '',
|
|
14232
|
+
iconOnly: false,
|
|
14233
|
+
},
|
|
14234
|
+
stop: {
|
|
14235
|
+
badgeColor: 'error',
|
|
14236
|
+
textColor: 'error-darker',
|
|
14237
|
+
icon: 'alertCircle',
|
|
14238
|
+
iconOnly: true,
|
|
14239
|
+
},
|
|
14240
|
+
done: {
|
|
14241
|
+
badgeColor: 'success',
|
|
14242
|
+
textColor: 'success-darker',
|
|
14243
|
+
icon: 'checkCircle',
|
|
14244
|
+
iconOnly: true,
|
|
14245
|
+
},
|
|
14246
|
+
default: {
|
|
14247
|
+
badgeColor: 'neutral',
|
|
14248
|
+
textColor: 'neutral',
|
|
14249
|
+
icon: '',
|
|
14250
|
+
iconOnly: false,
|
|
14251
|
+
},
|
|
14252
|
+
};
|
|
14253
|
+
this.displayHeading = false;
|
|
14254
|
+
this.heading = undefined;
|
|
14255
|
+
this.label = undefined;
|
|
14256
|
+
this.status = 'default';
|
|
14257
|
+
this.styles = {};
|
|
14258
|
+
}
|
|
14259
|
+
connectedCallback() {
|
|
14260
|
+
this.updateStyles();
|
|
14261
|
+
}
|
|
14262
|
+
getStatusProperties() {
|
|
14263
|
+
return this.statusMap[this.status] || this.statusMap.default;
|
|
14264
|
+
}
|
|
14265
|
+
updateStyles() {
|
|
14266
|
+
const { fonts, colors, spacing } = window.CuraAPI.theme;
|
|
14267
|
+
const weights = fonts.getWeights();
|
|
14268
|
+
this.styles = {
|
|
14269
|
+
'--base-spacing': spacing.getSpacing(),
|
|
14270
|
+
'--neutral-purewhite': colors.getColor('neutral-purewhite'),
|
|
14271
|
+
'--neutral-lighter': colors.getColor('neutral-lighter'),
|
|
14272
|
+
'--neutral-base': colors.getColor('neutral-base'),
|
|
14273
|
+
'--font-size': fonts.getSize(),
|
|
14274
|
+
'--font-color': fonts.getColor(),
|
|
14275
|
+
'--font-family': fonts.getFamily(),
|
|
14276
|
+
'--font-weight-regular': weights.regular,
|
|
14277
|
+
};
|
|
14278
|
+
}
|
|
14279
|
+
render() {
|
|
14280
|
+
const { badgeColor, textColor, icon, iconOnly } = this.getStatusProperties();
|
|
14281
|
+
return (hAsync(Host, { key: 'c226daf451d9c861d5303474ef0fc31c1602371b' }, hAsync("div", { key: '7aece988946e4bef02c597a80ea1a505c201e188', class: "item-container", style: this.styles }, hAsync("cura-badge-pill", { key: 'd0362b4a4ee3c047173399ea5f7c912a5a0f7810', type: "solid", color: badgeColor, "icon-name": icon, "icon-only": iconOnly, "border-radius": "50%" }, this.label), this.displayHeading && this.heading && (hAsync("cura-paragraph", { key: '015effecdb26be22386363e77bd5a0e671701d60', marginBlock: "0", size: "xsmall", color: textColor }, this.heading)))));
|
|
14282
|
+
}
|
|
14283
|
+
get hostElement() { return getElement(this); }
|
|
14284
|
+
static get style() { return CuraStepperItemStyle0; }
|
|
14285
|
+
static get cmpMeta() { return {
|
|
14286
|
+
"$flags$": 9,
|
|
14287
|
+
"$tagName$": "cura-stepper-item",
|
|
14288
|
+
"$members$": {
|
|
14289
|
+
"displayHeading": [516, "display-heading"],
|
|
14290
|
+
"heading": [513],
|
|
14291
|
+
"label": [513],
|
|
14292
|
+
"status": [513],
|
|
14293
|
+
"styles": [32]
|
|
14294
|
+
},
|
|
14295
|
+
"$listeners$": undefined,
|
|
14296
|
+
"$lazyBundleId$": "-",
|
|
14297
|
+
"$attrsToReflect$": [["displayHeading", "display-heading"], ["heading", "heading"], ["label", "label"], ["status", "status"]]
|
|
14298
|
+
}; }
|
|
14299
|
+
}
|
|
14300
|
+
|
|
13982
14301
|
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)}";
|
|
13983
14302
|
var CuraSwitchStyle0 = curaSwitchCss;
|
|
13984
14303
|
|
|
@@ -14083,7 +14402,7 @@ class CuraSwitch {
|
|
|
14083
14402
|
return classes;
|
|
14084
14403
|
}
|
|
14085
14404
|
render() {
|
|
14086
|
-
return (hAsync(Host, { key: '
|
|
14405
|
+
return (hAsync(Host, { key: '11257c8df21e4d88ef7a1e26b72f8c53fd316edd' }, hAsync("div", { key: '358b9bf587443350fd092abb179b2207064c9278', class: this.getClasses(), style: this.styles }, hAsync("div", { key: 'acc517d68a7fde4a83653a7fadbdb337e6175498', class: "info" }, hAsync("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), hAsync("cura-label", { key: 'a96960a7e898e8f9d7151c468d18e52860d589d1', style: { textAlign: this.position === 'right' ? 'right' : 'left' }, color: this.assignColor('primary-lighter', 'neutral-dark'), size: "xsmall", class: "message" }, hAsync("slot", { key: 'de46f003bf8046e3742d831cc45d22471e19c0a4' }))), hAsync("div", { key: 'ae0c72cd68ed42fec1338d6ded49d7b535157476', onClick: this.toggleSwitch, class: "control" }, hAsync("div", { key: '3aa0e60235071541289ea6a430966094a2753520', class: `track ${this.size.toLowerCase()}` }, hAsync("div", { key: '419866ba2b46a394428f83e6824ebb315e6671a1', class: `thumb ${this.size.toLowerCase()}`, tabIndex: this.ontabindex }))))));
|
|
14087
14406
|
}
|
|
14088
14407
|
static get formAssociated() { return true; }
|
|
14089
14408
|
static get watchers() { return {
|
|
@@ -14139,7 +14458,7 @@ class CuraToast {
|
|
|
14139
14458
|
this.setStyle();
|
|
14140
14459
|
}
|
|
14141
14460
|
render() {
|
|
14142
|
-
return (hAsync(Host, { key: '
|
|
14461
|
+
return (hAsync(Host, { key: '4dc290042792d96f31c2e63936d70a77bc37917d' }, hAsync("div", { key: '668c102d3a31d0a0e39c390546fcf5422e954246', class: this.getClasses(), style: this.styles }, hAsync("cura-icon", { key: '502b24915e1000877ccd4ae25806b152b4a72948', class: "default-icon", name: this.getNameIcon(), size: 16, color: `${this.type}-dark` }), hAsync("div", { key: 'd7afe4d1a9740d3bd1bce04858f6e71e0c857da2', class: "content" }, hAsync("cura-heading", { key: '419e0d64e12e828efa2fecebe0eb86c74ff86dda', level: 4, size: "xsmall", color: `${this.type}-dark`, weight: "bold", "margin-block": "0" }, this.label), hAsync("cura-paragraph", { key: 'bc6f5c120f0b32858cbda9ebf16c5d79366452bb', color: `${this.type}-darker`, size: "xsmall", marginBlock: "0", lineHeight: "133.33%" }, hAsync("slot", { key: '9cc8ba28b3e5ee5d8137351cfbb5dc07b417b7e9' })), hAsync("slot", { key: 'f260ca44fa6cc515a1bda3ecb94dd1ac90f880d7', name: "actions" })), this.closeButton && hAsync("cura-icon", { key: '7db6c2e5c3c66ab0b12822fc8099e17b77ed2c39', class: "close-icon", name: "close", size: 16, color: "error-dark", onClick: this.handleClose }), this.loader && !!this.autoCloseDelay && hAsync("cura-loader-bar", { key: 'd0a6f1e838ec98f6dac5773214e1e5cf501e3e2e', color: `${this.type}-base`, progress: this.progress }))));
|
|
14143
14462
|
}
|
|
14144
14463
|
componentDidLoad() {
|
|
14145
14464
|
this.openContainer();
|
|
@@ -14258,9 +14577,10 @@ class CuraTooltip {
|
|
|
14258
14577
|
this.setStyle();
|
|
14259
14578
|
}
|
|
14260
14579
|
render() {
|
|
14261
|
-
return (hAsync(Host, { key: '
|
|
14580
|
+
return (hAsync(Host, { key: '3fe89da4d5b3a2830d4ab6a88e705b4cf2433289', role: "tooltip", id: this.elementId }, hAsync("div", { key: '6cece3dcbf275a851e0d53cb154b9dcf50a76948', class: "container", style: this.styles }, hAsync("div", { key: '802840b89feb6c4d89303da156f6f130e552a83b', class: "content" }, hAsync("cura-heading", { key: 'ea98692d4fc34f05dcf8fcd5c325b8a1cd408226', level: 4, size: "xsmall", color: "neutral-black", weight: "bold", "margin-block": "0" }, this.label), hAsync("cura-paragraph", { key: '38bb7bf9f0a837813b490062ba5645f7148ac74b', color: "neutral-dark", "spot-color": "secondary-darker", size: "xsmall", marginBlock: "0", lineHeight: "133.33%" }, hAsync("slot", { key: '960b6b6d8ee4636a31c2058aa4779050973e143e' }))), this.closeButton && !this.isMobile && hAsync("cura-icon", { key: 'd0bf72702fa8d24d1f5fac6fa473747bdaadcdaf', class: "close-icon", name: "close", size: 16, color: "error-dark", onClick: this.handleClose }), this.isMobile && hAsync("cura-button-transparent", { key: '2213a6353b3d326ecde2e9eefe84811bd3161727', class: "close-button", size: "small", type: "button", color: "error", "icon-name": "close", "icon-position": "right", onClick: this.handleClose }, "OK, entendi."))));
|
|
14262
14581
|
}
|
|
14263
14582
|
componentDidLoad() {
|
|
14583
|
+
var _a, _b, _c, _d, _e;
|
|
14264
14584
|
this.targetElement = document.querySelector(`[aria-labelledby="${this.elementId}"]`);
|
|
14265
14585
|
if (!this.interactive) {
|
|
14266
14586
|
this.host.style.visibility = 'visible';
|
|
@@ -14269,28 +14589,28 @@ class CuraTooltip {
|
|
|
14269
14589
|
this.host.style.visibility = 'hidden';
|
|
14270
14590
|
let openTimeoutID = null;
|
|
14271
14591
|
let closeTimeoutID = null;
|
|
14272
|
-
this.targetElement.addEventListener('mouseenter', () => {
|
|
14592
|
+
(_a = this.targetElement) === null || _a === void 0 ? void 0 : _a.addEventListener('mouseenter', () => {
|
|
14273
14593
|
clearTimeout(closeTimeoutID);
|
|
14274
14594
|
openTimeoutID = setTimeout(() => {
|
|
14275
14595
|
this.host.style.visibility = 'visible';
|
|
14276
14596
|
}, typeof this.delay === 'number' && this.delay > 250 ? this.delay : 250);
|
|
14277
14597
|
});
|
|
14278
|
-
this.targetElement.addEventListener('mouseleave', () => {
|
|
14598
|
+
(_b = this.targetElement) === null || _b === void 0 ? void 0 : _b.addEventListener('mouseleave', () => {
|
|
14279
14599
|
clearTimeout(openTimeoutID);
|
|
14280
14600
|
closeTimeoutID = setTimeout(() => {
|
|
14281
14601
|
this.handleClose();
|
|
14282
14602
|
}, typeof this.delay === 'number' && this.delay > 250 ? this.delay : 250);
|
|
14283
14603
|
});
|
|
14284
|
-
this.host.addEventListener('mouseenter', () => {
|
|
14604
|
+
(_c = this.host) === null || _c === void 0 ? void 0 : _c.addEventListener('mouseenter', () => {
|
|
14285
14605
|
if (window.getComputedStyle(this.host).visibility === 'visible') {
|
|
14286
14606
|
clearTimeout(closeTimeoutID);
|
|
14287
14607
|
}
|
|
14288
14608
|
});
|
|
14289
|
-
this.host.addEventListener('mouseleave', () => {
|
|
14609
|
+
(_d = this.host) === null || _d === void 0 ? void 0 : _d.addEventListener('mouseleave', () => {
|
|
14290
14610
|
clearTimeout(openTimeoutID);
|
|
14291
14611
|
this.handleClose();
|
|
14292
14612
|
});
|
|
14293
|
-
this.targetElement.addEventListener('click', () => {
|
|
14613
|
+
(_e = this.targetElement) === null || _e === void 0 ? void 0 : _e.addEventListener('click', () => {
|
|
14294
14614
|
if (window.getComputedStyle(this.host).visibility === 'hidden') {
|
|
14295
14615
|
openTimeoutID = setTimeout(() => {
|
|
14296
14616
|
this.host.style.visibility = 'visible';
|
|
@@ -14301,7 +14621,7 @@ class CuraTooltip {
|
|
|
14301
14621
|
this.handleClose();
|
|
14302
14622
|
}
|
|
14303
14623
|
});
|
|
14304
|
-
document.addEventListener('click', (event) => {
|
|
14624
|
+
document === null || document === void 0 ? void 0 : document.addEventListener('click', (event) => {
|
|
14305
14625
|
if (!this.targetElement.contains(event.target) && !this.host.contains(event.target)) {
|
|
14306
14626
|
clearTimeout(openTimeoutID);
|
|
14307
14627
|
this.handleClose();
|
|
@@ -14336,7 +14656,7 @@ class CuraTooltip {
|
|
|
14336
14656
|
this.host.style.bottom = this.isMobile ? '0' : 'unset';
|
|
14337
14657
|
container.style.flexDirection = this.isMobile ? 'column' : 'row';
|
|
14338
14658
|
if (this.isMobile) {
|
|
14339
|
-
this.host.style.left = '
|
|
14659
|
+
this.host.style.left = '0';
|
|
14340
14660
|
this.host.style.top = 'unset';
|
|
14341
14661
|
return;
|
|
14342
14662
|
}
|
|
@@ -14472,6 +14792,7 @@ registerComponents([
|
|
|
14472
14792
|
CuraAccordionItem,
|
|
14473
14793
|
CuraAlert,
|
|
14474
14794
|
CuraAvatar,
|
|
14795
|
+
CuraBadgeDot,
|
|
14475
14796
|
CuraBadgeNumber,
|
|
14476
14797
|
CuraBadgePill,
|
|
14477
14798
|
CuraButton,
|
|
@@ -14497,9 +14818,12 @@ registerComponents([
|
|
|
14497
14818
|
CuraModal,
|
|
14498
14819
|
CuraPageTemplate,
|
|
14499
14820
|
CuraParagraph,
|
|
14821
|
+
CuraProgressBar,
|
|
14500
14822
|
CuraRadio,
|
|
14501
14823
|
CuraSelect,
|
|
14502
14824
|
CuraSelectOption,
|
|
14825
|
+
CuraStepper,
|
|
14826
|
+
CuraStepperItem,
|
|
14503
14827
|
CuraSwitch,
|
|
14504
14828
|
CuraToast,
|
|
14505
14829
|
CuraTooltip,
|