@nova-design-system/nova-react 3.22.0 → 3.23.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/_commonjsHelpers-B85MJLTf-CFO10eej.js +7 -0
- package/dist/cjs/{collapse.animation-6e0b08df-AHWzNGm_.js → collapse.animation-DZDm0vSK-C2TOIhIK.js} +3 -3
- package/dist/cjs/{fade.animation-9b939939-DV--bM4S.js → fade.animation-DcRL9lcm-DAZeHoKN.js} +75 -75
- package/dist/cjs/generated/components.server.js +245 -50
- package/dist/cjs/{grow.animation-24ad5cf8-LUp_ITEx.js → grow.animation-CvHGHBL4-DDIEYBK-.js} +5 -5
- package/dist/cjs/i18n.utils-DOZbXX2L-BizoXo6c.js +2498 -0
- package/dist/cjs/{index-WPRkQD3O.js → index-CtjeeUI-.js} +12063 -7049
- package/dist/cjs/index.js +12 -1
- package/dist/cjs/inputmask-CSo292ul-DlvupPk6.js +3758 -0
- package/dist/cjs/{nv-accordion-item.entry-BuTvA6w9.js → nv-accordion-item.entry-B_l0-ux0.js} +11 -10
- package/dist/cjs/{nv-accordion.entry-Dtsfw6He.js → nv-accordion.entry-BX8_YuZF.js} +8 -5
- package/dist/cjs/{nv-alert.entry-TIdfdU7Y.js → nv-alert.entry-DCWYR0OK.js} +22 -22
- package/dist/cjs/{nv-avatar.entry-CaxrhPuw.js → nv-avatar.entry-C_xZD3Lp.js} +11 -11
- package/dist/cjs/{nv-badge_2.entry-CfYvTZxX.js → nv-badge_2.entry-JjqANStV.js} +24 -24
- package/dist/cjs/{nv-breadcrumb.entry-BCZ4MmfD.js → nv-breadcrumb.entry-DQZDn6cm.js} +5 -5
- package/dist/cjs/{nv-breadcrumbs.entry-DwzCE7F6.js → nv-breadcrumbs.entry-Bz0GjhY_.js} +3 -3
- package/dist/cjs/{nv-button.entry-Cr_86bcZ.js → nv-button.entry-Br1DH9Vj.js} +9 -9
- package/dist/cjs/{nv-buttongroup.entry-CWjRoHY1.js → nv-buttongroup.entry-BZaTKN_n.js} +3 -3
- package/dist/cjs/{nv-calendar.entry-CXfwNt6G.js → nv-calendar.entry-D9ESuu7C.js} +105 -79
- package/dist/cjs/{nv-col.entry-CJLDS3LY.js → nv-col.entry-CfgPMMxS.js} +5 -5
- package/dist/cjs/{nv-datagrid.entry-Cns8XSud.js → nv-datagrid.entry-DcB5q2oC.js} +14 -14
- package/dist/cjs/{nv-datagridcolumn.entry-CFFAipHF.js → nv-datagridcolumn.entry-BhKOzXA6.js} +2 -1
- package/dist/cjs/{nv-dialog.entry-CDSK9pUH.js → nv-dialog.entry-O47Eol_7.js} +23 -23
- package/dist/cjs/{nv-dialogfooter_2.entry-To_dGUn4.js → nv-dialogfooter_2.entry-Dn16bI8a.js} +10 -11
- package/dist/cjs/nv-fieldcheckbox.entry-Bx6ArV_b.js +177 -0
- package/dist/cjs/{nv-fielddate.entry-C3pXtMHL.js → nv-fielddate.entry-B4P0U8QG.js} +86 -40
- package/dist/cjs/{nv-fielddaterange.entry-CjVVPEK_.js → nv-fielddaterange.entry-BORwYJ-k.js} +150 -101
- package/dist/cjs/nv-fielddropdown.entry-DzBAIynY.js +687 -0
- package/dist/cjs/{nv-fielddropdownitem.entry-Dah-PaE8.js → nv-fielddropdownitem.entry-C_17isWd.js} +6 -5
- package/dist/cjs/{nv-fieldmultiselect.entry-BMLjhqoJ.js → nv-fieldmultiselect.entry-DiqRreWh.js} +347 -232
- package/dist/cjs/nv-fieldnumber.entry-C9O4UPp3.js +187 -0
- package/dist/cjs/nv-fieldpassword.entry-BfVJNT0A.js +165 -0
- package/dist/cjs/{nv-fieldradio.entry-X_2VT1Dj.js → nv-fieldradio.entry-CG22oETM.js} +10 -10
- package/dist/cjs/{nv-fieldselect.entry-pSp-2rNn.js → nv-fieldselect.entry-BPQEtrv2.js} +52 -13
- package/dist/cjs/{nv-fieldslider.entry-pZf7zzLU.js → nv-fieldslider.entry-CozmnUfN.js} +16 -31
- package/dist/cjs/nv-fieldtext.entry-BD-z01ru.js +163 -0
- package/dist/cjs/{nv-fieldtextarea.entry-t3Ixxi23.js → nv-fieldtextarea.entry-7UrKWDHg.js} +51 -12
- package/dist/cjs/{nv-fieldtime.entry-DY7D5_6K.js → nv-fieldtime.entry-DakOlLiO.js} +109 -57
- package/dist/cjs/{nv-icon.entry-6oYPSf4c.js → nv-icon.entry-Db00kB2u.js} +11 -11
- package/dist/cjs/{nv-iconbutton_2.entry-ChULGovr.js → nv-iconbutton_2.entry-CaKCa8NT.js} +7 -8
- package/dist/cjs/{nv-menu.entry-sd0tatWq.js → nv-menu.entry-CK2HdmBt.js} +16 -29
- package/dist/cjs/{nv-menuitem.entry-CCOqR7UF.js → nv-menuitem.entry-mKMqCAdz.js} +6 -5
- package/dist/cjs/nv-notification-bullet.entry-DtbjtFxs.js +77 -0
- package/dist/cjs/{nv-notification.entry-Cc3zE3yY.js → nv-notification.entry-CLb0gNu3.js} +39 -39
- package/dist/cjs/{nv-notificationcontainer.entry-DV4D6oOH.js → nv-notificationcontainer.entry-Cijivlm6.js} +3 -3
- package/dist/cjs/{nv-popover.entry-DQSwI2jT.js → nv-popover.entry-mLdLSp6n.js} +49 -45
- package/dist/cjs/{nv-row.entry-UUuMSAY5.js → nv-row.entry-C2C94fcv.js} +3 -3
- package/dist/cjs/nv-sidebar.entry-inDVNJ4s.js +177 -0
- package/dist/cjs/nv-sidebarcontent.entry-DxoljE15.js +22 -0
- package/dist/cjs/nv-sidebardivider.entry-D_yern0R.js +22 -0
- package/dist/cjs/nv-sidebarfooter.entry-Rkkn9TB_.js +22 -0
- package/dist/cjs/nv-sidebargroup.entry-C1p9qqxr.js +23 -0
- package/dist/cjs/nv-sidebarheader.entry-CYpD_4pI.js +22 -0
- package/dist/cjs/nv-sidebarlogo.entry-BgK03M1v.js +32 -0
- package/dist/cjs/nv-sidebarnavitem.entry-DglvcCOD.js +297 -0
- package/dist/cjs/nv-sidebarnavsubitem.entry-Dt1jKmC-.js +35 -0
- package/dist/cjs/{nv-split.entry-CYP2bTTM.js → nv-split.entry-mzg2F66T.js} +6 -6
- package/dist/cjs/{nv-stack.entry-D35-75Vw.js → nv-stack.entry-nnvjTrBy.js} +5 -5
- package/dist/cjs/{nv-table.entry-DevWJBnL.js → nv-table.entry-DkbNgxtI.js} +4 -4
- package/dist/cjs/{nv-tableheader.entry-Hs7nUSOC.js → nv-tableheader.entry-CRVFTQA-.js} +6 -6
- package/dist/cjs/{nv-toggle.entry-Eje9d--6.js → nv-toggle.entry-oC9TVkr1.js} +9 -9
- package/dist/cjs/nv-togglebutton.entry-BTWCzbS9.js +67 -0
- package/dist/cjs/{nv-togglebuttongroup.entry-CWN_Ucry.js → nv-togglebuttongroup.entry-BYXX5ejg.js} +8 -5
- package/dist/cjs/{nv-tooltip.entry-BGkKDEFg.js → nv-tooltip.entry-OJGxfJEh.js} +5 -5
- package/dist/cjs/{style-value-types.es-f5d10b79-D0QCM8OB.js → style-value-types.es-xlgmw4x8-B1vLqX9m.js} +6 -3
- package/dist/cjs/{v4-a79185f4-2n0dOd_Y.js → v4-BdYh22OP-C1vaJ4yP.js} +1 -1
- package/dist/generated/components.js +80 -0
- package/dist/generated/components.server.js +216 -50
- package/dist/providers/NotificationProvider.js +3 -4
- package/dist/types/generated/components.d.ts +32 -0
- package/dist/types/generated/components.server.d.ts +32 -0
- package/package.json +2 -2
- package/dist/cjs/_commonjsHelpers-1789f0cf-BJu3ubxk.js +0 -10
- package/dist/cjs/inputmask-edcad3c1-B9Omti4z.js +0 -3749
- package/dist/cjs/nv-fieldcheckbox.entry-fdonR07Z.js +0 -138
- package/dist/cjs/nv-fielddropdown.entry-C9mXuNNj.js +0 -392
- package/dist/cjs/nv-fieldnumber.entry-DBdJviXu.js +0 -148
- package/dist/cjs/nv-fieldpassword.entry-Cim_usSM.js +0 -122
- package/dist/cjs/nv-fieldtext.entry-DlI_ExaV.js +0 -124
- package/dist/cjs/nv-togglebutton.entry-LGI7pIeK.js +0 -56
- /package/dist/cjs/{clsx-297c1ffe-BtxeOLZW.js → clsx-ChV9xqsO-BtxeOLZW.js} +0 -0
- /package/dist/cjs/{constants-69bafca2-DpB_ghPF.js → constants-BReL3Lsa-DpB_ghPF.js} +0 -0
- /package/dist/cjs/{timeline.animation-79215cd4-KteJaZPb.js → timeline.animation-CgHCo_Ho-KteJaZPb.js} +0 -0
package/dist/cjs/{nv-accordion-item.entry-BuTvA6w9.js → nv-accordion-item.entry-B_l0-ux0.js}
RENAMED
|
@@ -1,18 +1,18 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
4
|
-
var
|
|
5
|
-
require('./style-value-types.es-
|
|
3
|
+
var index = require('./index-CtjeeUI-.js');
|
|
4
|
+
var collapse_animationDZDm0vSK = require('./collapse.animation-DZDm0vSK-C2TOIhIK.js');
|
|
5
|
+
require('./style-value-types.es-xlgmw4x8-B1vLqX9m.js');
|
|
6
|
+
require('@stencil/react-output-target/runtime');
|
|
6
7
|
require('react');
|
|
7
8
|
require('react-dom');
|
|
8
9
|
|
|
9
10
|
const nvAccordionItemCss = "nv-accordion-item{display:block;border-bottom:var(--spacing-px) solid var(--color-content-low-border)}nv-accordion-item:last-child{border-bottom:none}nv-accordion-item .nv-accordion-item__header{cursor:pointer;display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-4)}nv-accordion-item .nv-accordion-item__header .nv-accordion-item__chevron{margin-left:var(--spacing-2);flex-shrink:0}nv-accordion-item .nv-accordion-item__header .nv-accordion-item__header-content{display:flex;flex-direction:column;gap:var(--spacing-0-5);flex:1;min-width:0}nv-accordion-item .nv-accordion-item__header .nv-accordion-item__title{color:var(--color-content-high-text);font-size:var(--font-size-lg);font-style:normal;font-weight:var(--font-weight-medium-emphasis);line-height:var(--line-height-lg);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}nv-accordion-item .nv-accordion-item__header .nv-accordion-item__subtitle{color:var(--color-content-low-text);font-size:var(--font-size-md);font-style:normal;font-weight:var(--font-weight-medium-emphasis);line-height:var(--line-height-base);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}nv-accordion-item .nv-accordion-item__content{background:var(--color-level-10-background)}nv-accordion-item .nv-accordion-item__content .nv-accordion-item__content-inner{padding:var(--spacing-4);color:var(--color-content-low-text);font-size:var(--font-size-md);font-style:normal;font-weight:var(--font-weight-medium-emphasis);line-height:var(--line-height-base);}nv-accordion-item.is-disabled{opacity:var(--opacity-disabled);pointer-events:none}nv-accordion-item.is-open .nv-accordion-item__header{border-bottom:var(--spacing-px) solid var(--color-content-low-border)}nv-accordion-item:last-child .nv-accordion-item__content{border-radius:0 0 calc(var(--radius-rounded-lg) - var(--spacing-px)) calc(var(--radius-rounded-lg) - var(--spacing-px))}";
|
|
10
|
-
const NvAccordionItemStyle0 = nvAccordionItemCss;
|
|
11
11
|
|
|
12
12
|
const NvAccordionItem = class {
|
|
13
13
|
constructor(hostRef) {
|
|
14
14
|
index.registerInstance(this, hostRef);
|
|
15
|
-
this.itemToggle = index.createEvent(this, "itemToggle");
|
|
15
|
+
this.itemToggle = index.createEvent(this, "itemToggle", 7);
|
|
16
16
|
this.isToggling = false;
|
|
17
17
|
/**
|
|
18
18
|
* Open or closed
|
|
@@ -26,6 +26,7 @@ const NvAccordionItem = class {
|
|
|
26
26
|
* Parent expansion mode (accordion or multi)
|
|
27
27
|
*/
|
|
28
28
|
this.mode = 'accordion';
|
|
29
|
+
/* eslint-enable nova/event-bubbling */
|
|
29
30
|
//#endregion EVENTS
|
|
30
31
|
/****************************************************************************/
|
|
31
32
|
//#region STATE
|
|
@@ -126,7 +127,7 @@ const NvAccordionItem = class {
|
|
|
126
127
|
return;
|
|
127
128
|
}
|
|
128
129
|
this.isAnimating = true;
|
|
129
|
-
const { collapse, expand } =
|
|
130
|
+
const { collapse, expand } = collapse_animationDZDm0vSK.useCollapse(this.contentRef, {
|
|
130
131
|
duration: 200,
|
|
131
132
|
});
|
|
132
133
|
if (open) {
|
|
@@ -146,7 +147,7 @@ const NvAccordionItem = class {
|
|
|
146
147
|
componentDidLoad() {
|
|
147
148
|
if (this.contentRef) {
|
|
148
149
|
setTimeout(() => {
|
|
149
|
-
const { setExpanded, setCollapsed } =
|
|
150
|
+
const { setExpanded, setCollapsed } = collapse_animationDZDm0vSK.useCollapse(this.contentRef, {
|
|
150
151
|
duration: 200,
|
|
151
152
|
});
|
|
152
153
|
if (this.open) {
|
|
@@ -196,18 +197,18 @@ const NvAccordionItem = class {
|
|
|
196
197
|
/****************************************************************************/
|
|
197
198
|
//#region RENDER
|
|
198
199
|
render() {
|
|
199
|
-
return (index.h(index.Host, { key: '
|
|
200
|
+
return (index.h(index.Host, { key: '2e0becd0e89aabb8e0b652a48102a64c1eb97203', class: {
|
|
200
201
|
'nv-accordion-item': true,
|
|
201
202
|
'is-open': this.currentOpenState,
|
|
202
203
|
'is-disabled': this.disabled,
|
|
203
204
|
'is-animating': this.isAnimating,
|
|
204
|
-
}, role: "listitem", "aria-expanded": this.currentOpenState ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false' }, index.h("div", { key: '
|
|
205
|
+
}, role: "listitem", "aria-expanded": this.currentOpenState ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false' }, index.h("div", { key: 'f267eed06e3bc21f50f435cd7cd17b2fe35e17ac', class: "nv-accordion-item__header", onClick: this.handleHeaderClick, "aria-controls": "content" }, index.h("slot", { key: '9abeaede22eaad412e4a127f6fc301547a9ace8d', name: "header" }, index.h("div", { key: '3ab6c2c3869293545663260b2516dec66d90cf7b', class: "nv-accordion-item__header-content" }, this.itemTitle && (index.h("span", { key: '298cc19aa800d5a1d787571c8195a038df767dd8', class: "nv-accordion-item__title" }, this.itemTitle)), this.subtitle && (index.h("span", { key: 'f3428043b7020d065a4e4845eea84ab7b24810eb', class: "nv-accordion-item__subtitle" }, this.subtitle)))), index.h("nv-iconbutton", { key: '17956b3a0530a5d32086fb0ff08d41b6c82c53e0', emphasis: "low", size: "sm", shape: "square", name: this.chevronIconName, tabindex: this.disabled ? -1 : 0, onClick: this.handleIconClick, onKeyDown: this.handleHeaderKeyDown, "aria-controls": "content", "aria-label": this.currentOpenState ? 'Close the section' : 'Open the section' })), index.h("div", { key: '9a417daa4d79b380c949737732ce7a8ecb84e2fc', id: "content", class: "nv-accordion-item__content", ref: el => (this.contentRef = el) }, index.h("div", { key: '6dcdfcc391faa485b38f23cc2146af950fc6e367', class: "nv-accordion-item__content-inner" }, index.h("slot", { key: '2440c14ca77420204c556e7cfb3094205d192bb7', name: "content" })))));
|
|
205
206
|
}
|
|
206
207
|
get el() { return index.getElement(this); }
|
|
207
208
|
static get watchers() { return {
|
|
208
209
|
"open": ["onOpenChanged"]
|
|
209
210
|
}; }
|
|
210
211
|
};
|
|
211
|
-
NvAccordionItem.style =
|
|
212
|
+
NvAccordionItem.style = nvAccordionItemCss;
|
|
212
213
|
|
|
213
214
|
exports.nv_accordion_item = NvAccordionItem;
|
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-CtjeeUI-.js');
|
|
4
|
+
require('@stencil/react-output-target/runtime');
|
|
4
5
|
require('react');
|
|
5
6
|
require('react-dom');
|
|
6
7
|
|
|
7
8
|
const nvAccordionCss = "nv-accordion{display:block;border:var(--spacing-px) solid var(--color-content-low-border);border-radius:var(--radius-rounded-lg)}nv-accordion .nv-accordion__footer{padding:var(--spacing-3);background:var(--color-level-05-background);border-radius:0 0 var(--radius-rounded-lg) var(--radius-rounded-lg);margin-top:calc(var(--spacing-px) * -1);border-top:var(--spacing-px) solid var(--color-content-low-border)}nv-accordion .nv-accordion__footer:empty{display:none}";
|
|
8
|
-
const NvAccordionStyle0 = nvAccordionCss;
|
|
9
9
|
|
|
10
10
|
const NvAccordion = class {
|
|
11
11
|
constructor(hostRef) {
|
|
12
12
|
index.registerInstance(this, hostRef);
|
|
13
|
-
this.openIndexesChanged = index.createEvent(this, "openIndexesChanged");
|
|
13
|
+
this.openIndexesChanged = index.createEvent(this, "openIndexesChanged", 3);
|
|
14
14
|
/****************************************************************************/
|
|
15
15
|
//#region PROPERTIES
|
|
16
16
|
/**
|
|
@@ -100,11 +100,13 @@ const NvAccordion = class {
|
|
|
100
100
|
index.forceUpdate(item);
|
|
101
101
|
});
|
|
102
102
|
}
|
|
103
|
+
/* eslint-disable nova/native-event-listener */
|
|
103
104
|
/**
|
|
104
105
|
* Listens to itemToggle events from nv-accordion-item elements
|
|
105
106
|
* @param {CustomEvent<boolean>} event Event emitted by nv-accordion-item
|
|
106
107
|
*/
|
|
107
108
|
onItemToggle(event) {
|
|
109
|
+
event.stopPropagation();
|
|
108
110
|
if (this.updatingFromInternal) {
|
|
109
111
|
return;
|
|
110
112
|
}
|
|
@@ -118,6 +120,7 @@ const NvAccordion = class {
|
|
|
118
120
|
console.warn('[onItemToggle] Target item not found in items list');
|
|
119
121
|
}
|
|
120
122
|
}
|
|
123
|
+
/* eslint-enable nova/native-event-listener */
|
|
121
124
|
//#endregion METHODS
|
|
122
125
|
/****************************************************************************/
|
|
123
126
|
//#region WATCHERS
|
|
@@ -163,7 +166,7 @@ const NvAccordion = class {
|
|
|
163
166
|
//#region RENDER
|
|
164
167
|
render() {
|
|
165
168
|
var _a;
|
|
166
|
-
return (index.h(index.Host, { key: '
|
|
169
|
+
return (index.h(index.Host, { key: 'b498df032480f7b961883ad963ea1c7729e964cb', role: "list", class: "nv-accordion" }, ((_a = this.data) === null || _a === void 0 ? void 0 : _a.length) ? (this.data.map((item, i) => {
|
|
167
170
|
var _a;
|
|
168
171
|
return (index.h("nv-accordion-item", { key: (_a = item.id) !== null && _a !== void 0 ? _a : i, itemTitle: item.title, disabled: item.disabled, open: (this.openIndexes || []).includes(i), mode: this.mode }, item.subtitle ? (index.h("div", { slot: "header" }, index.h("div", { class: "nv-accordion-item__header-content" }, index.h("span", { class: "nv-accordion-item__title" }, item.title), index.h("span", { class: "nv-accordion-item__subtitle" }, item.subtitle)))) : null, index.h("div", { slot: "content" }, item.content), item.footer && index.h("div", { slot: "footer" }, item.footer)));
|
|
169
172
|
})) : (index.h("slot", null))));
|
|
@@ -174,6 +177,6 @@ const NvAccordion = class {
|
|
|
174
177
|
"mode": ["onModeChange"]
|
|
175
178
|
}; }
|
|
176
179
|
};
|
|
177
|
-
NvAccordion.style =
|
|
180
|
+
NvAccordion.style = nvAccordionCss;
|
|
178
181
|
|
|
179
182
|
exports.nv_accordion = NvAccordion;
|
|
@@ -1,24 +1,24 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
4
|
-
var
|
|
5
|
-
var
|
|
6
|
-
var
|
|
7
|
-
var
|
|
8
|
-
require('./style-value-types.es-
|
|
9
|
-
var
|
|
3
|
+
var index = require('./index-CtjeeUI-.js');
|
|
4
|
+
var clsxChV9xqsO = require('./clsx-ChV9xqsO-BtxeOLZW.js');
|
|
5
|
+
var constantsBReL3Lsa = require('./constants-BReL3Lsa-DpB_ghPF.js');
|
|
6
|
+
var collapse_animationDZDm0vSK = require('./collapse.animation-DZDm0vSK-C2TOIhIK.js');
|
|
7
|
+
var fade_animationDcRL9lcm = require('./fade.animation-DcRL9lcm-DAZeHoKN.js');
|
|
8
|
+
require('./style-value-types.es-xlgmw4x8-B1vLqX9m.js');
|
|
9
|
+
var timeline_animationCgHCo_Ho = require('./timeline.animation-CgHCo_Ho-KteJaZPb.js');
|
|
10
|
+
require('@stencil/react-output-target/runtime');
|
|
10
11
|
require('react');
|
|
11
12
|
require('react-dom');
|
|
12
13
|
|
|
13
14
|
const nvAlertCss = "nv-alert{display:flex !important;align-items:flex-start;position:relative;gap:var(--alert-gap-x);border-radius:var(--alert-radius);font-family:var(--font-family-default), var(--font-family-fallback), sans-serif}nv-alert>nv-icon{margin-left:var(--alert-icon-position-x);margin-top:var(--alert-icon-position-y)}nv-alert.hidden{display:none !important}nv-alert.feedback-information{background-color:var(--components-alert-information-background);border:1px solid var(--components-alert-information-border) !important}nv-alert.feedback-information>.close:focus,nv-alert.feedback-information>.close:focus-within{outline:none}nv-alert.feedback-information>.close:focus-visible,nv-alert.feedback-information>.close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-alert-information-border);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-alert.feedback-warning{background-color:var(--components-alert-warning-background);border:1px solid var(--components-alert-warning-border) !important}nv-alert.feedback-warning>.close:focus,nv-alert.feedback-warning>.close:focus-within{outline:none}nv-alert.feedback-warning>.close:focus-visible,nv-alert.feedback-warning>.close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-alert-warning-border);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-alert.feedback-error{background-color:var(--components-alert-error-background);border:1px solid var(--components-alert-error-border) !important}nv-alert.feedback-error>.close:focus,nv-alert.feedback-error>.close:focus-within{outline:none}nv-alert.feedback-error>.close:focus-visible,nv-alert.feedback-error>.close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-alert-error-border);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-alert.feedback-success{background-color:var(--components-alert-success-background);border:1px solid var(--components-alert-success-border) !important}nv-alert.feedback-success>.close:focus,nv-alert.feedback-success>.close:focus-within{outline:none}nv-alert.feedback-success>.close:focus-visible,nv-alert.feedback-success>.close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-alert-success-border);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-alert.feedback-neutral{background-color:var(--components-alert-neutral-background);border:1px solid var(--components-alert-neutral-border) !important}nv-alert.feedback-neutral>.close:focus,nv-alert.feedback-neutral>.close:focus-within{outline:none}nv-alert.feedback-neutral>.close:focus-visible,nv-alert.feedback-neutral>.close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-alert-neutral-border);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-alert>nv-icon.icon-information{color:var(--components-alert-information-icon)}nv-alert>nv-icon.icon-warning{color:var(--components-alert-warning-icon)}nv-alert>nv-icon.icon-error{color:var(--components-alert-error-icon)}nv-alert>nv-icon.icon-success{color:var(--components-alert-success-icon)}nv-alert>nv-icon.icon-neutral{color:var(--components-alert-neutral-icon)}nv-alert>.content{display:flex;padding:var(--alert-padding);padding-right:calc(var(--alert-padding) + var(--spacing-5) + var(--spacing-1));padding-left:0;flex-direction:column;gap:var(--alert-gap-y)}nv-alert>.content>.heading{color:var(--components-alert-content-title);font-size:var(--alert-heading-font-size);line-height:var(--alert-heading-line-height);font-weight:var(--alert-heading-font-weight)}nv-alert>.content>.message{color:var(--components-alert-content-description);font-size:var(--alert-message-font-size);line-height:var(--alert-message-line-height)}nv-alert>.close{border-radius:var(--alert-radius);position:absolute;display:flex;top:var(--alert-icon-position-y);right:var(--alert-icon-position-x);padding:0;border:none;background:none;cursor:pointer}";
|
|
14
|
-
const NvAlertStyle0 = nvAlertCss;
|
|
15
15
|
|
|
16
16
|
const NvAlert = class {
|
|
17
17
|
constructor(hostRef) {
|
|
18
18
|
index.registerInstance(this, hostRef);
|
|
19
|
-
this.hiddenChanged = index.createEvent(this, "hiddenChanged");
|
|
20
|
-
this.hiddenChangedComplete = index.createEvent(this, "hiddenChangedComplete");
|
|
21
|
-
this.closeClicked = index.createEvent(this, "closeClicked");
|
|
19
|
+
this.hiddenChanged = index.createEvent(this, "hiddenChanged", 3);
|
|
20
|
+
this.hiddenChangedComplete = index.createEvent(this, "hiddenChangedComplete", 3);
|
|
21
|
+
this.closeClicked = index.createEvent(this, "closeClicked", 3);
|
|
22
22
|
//#endregion DEPRECATED
|
|
23
23
|
/****************************************************************************/
|
|
24
24
|
//#region PROPERTIES
|
|
@@ -64,15 +64,15 @@ const NvAlert = class {
|
|
|
64
64
|
*/
|
|
65
65
|
this.getDefaultIcon = () => {
|
|
66
66
|
switch (this.feedback) {
|
|
67
|
-
case
|
|
67
|
+
case constantsBReL3Lsa.FeedbackColors.Warning:
|
|
68
68
|
return 'alert-circle';
|
|
69
|
-
case
|
|
69
|
+
case constantsBReL3Lsa.FeedbackColors.Information:
|
|
70
70
|
return 'info-circle';
|
|
71
|
-
case
|
|
71
|
+
case constantsBReL3Lsa.FeedbackColors.Success:
|
|
72
72
|
return 'circle-check';
|
|
73
|
-
case
|
|
73
|
+
case constantsBReL3Lsa.FeedbackColors.Error:
|
|
74
74
|
return 'alert-circle';
|
|
75
|
-
case
|
|
75
|
+
case constantsBReL3Lsa.FeedbackColors.Neutral:
|
|
76
76
|
return 'help';
|
|
77
77
|
default:
|
|
78
78
|
return 'info-circle';
|
|
@@ -118,15 +118,15 @@ const NvAlert = class {
|
|
|
118
118
|
this.toggleHiddenClass(hidden);
|
|
119
119
|
return;
|
|
120
120
|
}
|
|
121
|
-
const { fadeIn, fadeOut } =
|
|
122
|
-
const { collapse, expand } =
|
|
121
|
+
const { fadeIn, fadeOut } = fade_animationDcRL9lcm.useFade(this.el, { duration: 150 });
|
|
122
|
+
const { collapse, expand } = collapse_animationDZDm0vSK.useCollapse(this.el, { duration: 250 });
|
|
123
123
|
if (hidden) {
|
|
124
|
-
await
|
|
124
|
+
await timeline_animationCgHCo_Ho.timeline(fadeOut, collapse).start();
|
|
125
125
|
this.toggleHiddenClass(true);
|
|
126
126
|
}
|
|
127
127
|
else {
|
|
128
128
|
this.toggleHiddenClass(false);
|
|
129
|
-
await
|
|
129
|
+
await timeline_animationCgHCo_Ho.timeline(expand, fadeIn).start();
|
|
130
130
|
}
|
|
131
131
|
}
|
|
132
132
|
/**
|
|
@@ -164,13 +164,13 @@ const NvAlert = class {
|
|
|
164
164
|
//#region RENDER
|
|
165
165
|
render() {
|
|
166
166
|
var _a;
|
|
167
|
-
return (index.h(index.Host, { key: '
|
|
167
|
+
return (index.h(index.Host, { key: '2c89126ecbdca5e8df9c0541a4e312d2dc8a9fb3', role: "alert", class: clsxChV9xqsO.clsx('root', `feedback-${this.feedback}`) }, index.h("nv-icon", { key: '3aa514682ac670d81c7c88fa8b9b6f02e2761c45', name: (_a = this.icon) !== null && _a !== void 0 ? _a : this.getDefaultIcon(), class: `icon-${this.feedback}`, size: "md" }), index.h("div", { key: '5049bdb9d17b9ef07e15554631cc8fbd557e4b22', class: "content" }, this.heading && index.h("p", { key: '3faaa7e738f484f2f7dc543866eadaa861c0709b', class: "heading" }, this.heading), this.message && index.h("p", { key: 'abd16d9cb5bc2f28e63c534e8f9f2169e511df2f', class: "message" }, this.message), index.h("slot", { key: '0b14b616a7e6665f903f0aa6c32f706b0aa8bd27' })), this.dismissible && (index.h("button", { key: '5d35998aac73ea82ef06e1d083597a7677c0cd70', class: "close", type: "button", onClick: this.handleDismiss }, index.h("nv-icon", { key: '3088178c1152525a400d116ac07ce372dadd420b', name: "x", size: "sm" })))));
|
|
168
168
|
}
|
|
169
169
|
get el() { return index.getElement(this); }
|
|
170
170
|
static get watchers() { return {
|
|
171
171
|
"hidden": ["handleHiddenChange"]
|
|
172
172
|
}; }
|
|
173
173
|
};
|
|
174
|
-
NvAlert.style =
|
|
174
|
+
NvAlert.style = nvAlertCss;
|
|
175
175
|
|
|
176
176
|
exports.nv_alert = NvAlert;
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
4
|
-
var
|
|
5
|
-
var
|
|
3
|
+
var index = require('./index-CtjeeUI-.js');
|
|
4
|
+
var clsxChV9xqsO = require('./clsx-ChV9xqsO-BtxeOLZW.js');
|
|
5
|
+
var constantsBReL3Lsa = require('./constants-BReL3Lsa-DpB_ghPF.js');
|
|
6
|
+
require('@stencil/react-output-target/runtime');
|
|
6
7
|
require('react');
|
|
7
8
|
require('react-dom');
|
|
8
9
|
|
|
9
10
|
const nvAvatarCss = "nv-avatar{align-items:center !important;background-color:var(--components-avatar-background-1);border-radius:var(--radius-rounded-full) !important;display:flex !important;flex-shrink:0 !important;font-family:var(--font-family-default), var(--font-family-fallback), sans-serif;font-style:normal;font-weight:var(--font-weight-medium-emphasis);justify-content:center !important;leading-trim:both;line-height:1 !important;text-align:center;text-edge:cap;text-transform:uppercase}nv-avatar.avatar-color-1{background-color:var(--components-avatar-background-1);color:var(--components-avatar-content-1)}nv-avatar.avatar-color-2{background-color:var(--components-avatar-background-2);color:var(--components-avatar-content-2)}nv-avatar.avatar-color-3{background-color:var(--components-avatar-background-3);color:var(--components-avatar-content-3)}nv-avatar.avatar-color-4{background-color:var(--components-avatar-background-4);color:var(--components-avatar-content-4)}nv-avatar.avatar-color-5{background-color:var(--components-avatar-background-5);color:var(--components-avatar-content-5)}nv-avatar.avatar-color-6{background-color:var(--components-avatar-background-6);color:var(--components-avatar-content-6)}nv-avatar.avatar-color-7{background-color:var(--components-avatar-background-7);color:var(--components-avatar-content-7)}nv-avatar.avatar-color-8{background-color:var(--components-avatar-background-8);color:var(--components-avatar-content-8)}nv-avatar.avatar-color-9{background-color:var(--components-avatar-background-9);color:var(--components-avatar-content-9)}nv-avatar.avatar-color-10{background-color:var(--components-avatar-background-10);color:var(--components-avatar-content-10)}nv-avatar img{height:100%;width:100%;object-fit:cover;object-position:center;border-radius:50%}nv-avatar.avatar-xs{width:var(--avatar-xs-size);height:var(--avatar-xs-size);font-size:var(--avatar-xs-font-size);line-height:var(--avatar-xs-font-size)}nv-avatar.avatar-xs nv-icon>svg{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-avatar.avatar-sm{width:var(--avatar-sm-size);height:var(--avatar-sm-size);font-size:var(--avatar-sm-font-size);line-height:var(--avatar-sm-font-size)}nv-avatar.avatar-sm nv-icon>svg{width:var(--spacing-4);height:var(--spacing-4);stroke-width:1.5px}nv-avatar.avatar-md{width:var(--avatar-md-size);height:var(--avatar-md-size);font-size:var(--avatar-md-font-size);line-height:var(--avatar-md-font-size)}nv-avatar.avatar-md nv-icon>svg{width:var(--spacing-5);height:var(--spacing-5);stroke-width:1.6px}nv-avatar.avatar-lg{width:var(--avatar-lg-size);height:var(--avatar-lg-size);font-size:var(--avatar-lg-font-size);line-height:var(--avatar-lg-font-size)}nv-avatar.avatar-lg nv-icon>svg{width:var(--spacing-6);height:var(--spacing-6);stroke-width:1.8px}nv-avatar.avatar-xl{width:var(--avatar-xl-size);height:var(--avatar-xl-size);font-size:var(--avatar-xl-font-size);line-height:var(--avatar-xl-font-size)}nv-avatar.avatar-xl nv-icon>svg{width:var(--spacing-7);height:var(--spacing-7);stroke-width:1.9px}";
|
|
10
|
-
const NvAvatarStyle0 = nvAvatarCss;
|
|
11
11
|
|
|
12
12
|
const NvAvatar = class {
|
|
13
13
|
constructor(hostRef) {
|
|
@@ -24,19 +24,19 @@ const NvAvatar = class {
|
|
|
24
24
|
}
|
|
25
25
|
componentWillRender() {
|
|
26
26
|
if (this.xsmall) {
|
|
27
|
-
this.size =
|
|
27
|
+
this.size = constantsBReL3Lsa.SemanticSizes.ExtraSmall;
|
|
28
28
|
}
|
|
29
29
|
if (this.small) {
|
|
30
|
-
this.size =
|
|
30
|
+
this.size = constantsBReL3Lsa.SemanticSizes.Small;
|
|
31
31
|
}
|
|
32
32
|
if (this.medium) {
|
|
33
|
-
this.size =
|
|
33
|
+
this.size = constantsBReL3Lsa.SemanticSizes.Medium;
|
|
34
34
|
}
|
|
35
35
|
if (this.large) {
|
|
36
|
-
this.size =
|
|
36
|
+
this.size = constantsBReL3Lsa.SemanticSizes.Large;
|
|
37
37
|
}
|
|
38
38
|
if (this.xlarge) {
|
|
39
|
-
this.size =
|
|
39
|
+
this.size = constantsBReL3Lsa.SemanticSizes.ExtraLarge;
|
|
40
40
|
}
|
|
41
41
|
if (this.text) {
|
|
42
42
|
this.initials = this.text;
|
|
@@ -60,9 +60,9 @@ const NvAvatar = class {
|
|
|
60
60
|
/****************************************************************************/
|
|
61
61
|
//#region RENDER
|
|
62
62
|
render() {
|
|
63
|
-
return (index.h(index.Host, { key: '127d470eb9121f611f9e18f029ab9ef15a4a49df', class:
|
|
63
|
+
return (index.h(index.Host, { key: '127d470eb9121f611f9e18f029ab9ef15a4a49df', class: clsxChV9xqsO.clsx(`avatar-${this.size}`, `avatar-color-${this.color}`), "aria-label": this.alt }, this.src ? (index.h("img", { src: this.src, alt: this.alt })) : this.initials ? (this.trimInitials(this.initials)) : (index.h("slot", { name: "icon" }, index.h("nv-icon", { name: "user" })))));
|
|
64
64
|
}
|
|
65
65
|
};
|
|
66
|
-
NvAvatar.style =
|
|
66
|
+
NvAvatar.style = nvAvatarCss;
|
|
67
67
|
|
|
68
68
|
exports.nv_avatar = NvAvatar;
|
|
@@ -1,23 +1,23 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
4
|
-
var
|
|
5
|
-
var
|
|
6
|
-
var
|
|
7
|
-
require('./style-value-types.es-
|
|
8
|
-
var
|
|
3
|
+
var index = require('./index-CtjeeUI-.js');
|
|
4
|
+
var clsxChV9xqsO = require('./clsx-ChV9xqsO-BtxeOLZW.js');
|
|
5
|
+
var collapse_animationDZDm0vSK = require('./collapse.animation-DZDm0vSK-C2TOIhIK.js');
|
|
6
|
+
var fade_animationDcRL9lcm = require('./fade.animation-DcRL9lcm-DAZeHoKN.js');
|
|
7
|
+
require('./style-value-types.es-xlgmw4x8-B1vLqX9m.js');
|
|
8
|
+
var timeline_animationCgHCo_Ho = require('./timeline.animation-CgHCo_Ho-KteJaZPb.js');
|
|
9
|
+
require('@stencil/react-output-target/runtime');
|
|
9
10
|
require('react');
|
|
10
11
|
require('react-dom');
|
|
11
12
|
|
|
12
13
|
const nvBadgeCss = "nv-badge{padding:var(--badge-padding-y) var(--badge-padding-x);display:inline-flex !important;gap:var(--badge-gap-x);vertical-align:middle;align-items:center;border-radius:var(--radius-rounded-full);border-style:solid;border-width:0.5px;height:fit-content;width:fit-content}nv-badge.is-icon-only{padding:var(--badge-padding-y) var(--badge-padding-icon-only-x);gap:var(--badge-gap-icon-only-x)}nv-badge.with-gap{padding:var(--badge-padding-y) var(--badge-padding-x);display:inline-flex !important;gap:var(--badge-gap-x);vertical-align:middle;align-items:center;border-radius:var(--radius-rounded-full);border-style:solid;border-width:0.5px;height:fit-content;width:fit-content}nv-badge.with-gap.is-icon-only{padding:var(--badge-padding-y) var(--badge-padding-icon-only-x);gap:var(--badge-gap-icon-only-x)}nv-badge.visually-hidden{position:absolute;padding:0;border:0;overflow:hidden;white-space:nowrap;width:1px;height:1px;margin:-1px;clip:rect(0, 0, 0, 0)}nv-badge:not(.with-gap){padding:var(--badge-padding-y) var(--badge-padding-x);display:inline-flex !important;gap:var(--badge-gap-x);vertical-align:middle;align-items:center;border-radius:var(--radius-rounded-full);border-style:solid;border-width:0.5px;height:fit-content;width:fit-content}nv-badge:not(.with-gap).is-icon-only{padding:var(--badge-padding-y) var(--badge-padding-icon-only-x);gap:var(--badge-gap-icon-only-x)}nv-badge.badge-1{color:var(--color-rainbow-1-text);background-color:var(--color-rainbow-1-background);border-color:var(--color-rainbow-1-border)}nv-badge.badge-1 .close:focus,nv-badge.badge-1 .close:focus-within{outline:none}nv-badge.badge-1 .close:focus-visible,nv-badge.badge-1 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-1-content);outline-offset:calc(var(--focus-outline-offset) * 0.2)}nv-badge.badge-1 nv-icon{color:var(--color-rainbow-1-icon)}nv-badge.badge-2{color:var(--color-rainbow-2-text);background-color:var(--color-rainbow-2-background);border-color:var(--color-rainbow-2-border)}nv-badge.badge-2 .close:focus,nv-badge.badge-2 .close:focus-within{outline:none}nv-badge.badge-2 .close:focus-visible,nv-badge.badge-2 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-2-content);outline-offset:calc(var(--focus-outline-offset) * 0.2)}nv-badge.badge-2 nv-icon{color:var(--color-rainbow-2-icon)}nv-badge.badge-3{color:var(--color-rainbow-3-text);background-color:var(--color-rainbow-3-background);border-color:var(--color-rainbow-3-border)}nv-badge.badge-3 .close:focus,nv-badge.badge-3 .close:focus-within{outline:none}nv-badge.badge-3 .close:focus-visible,nv-badge.badge-3 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-3-content);outline-offset:calc(var(--focus-outline-offset) * 0.2)}nv-badge.badge-3 nv-icon{color:var(--color-rainbow-3-icon)}nv-badge.badge-4{color:var(--color-rainbow-4-text);background-color:var(--color-rainbow-4-background);border-color:var(--color-rainbow-4-border)}nv-badge.badge-4 .close:focus,nv-badge.badge-4 .close:focus-within{outline:none}nv-badge.badge-4 .close:focus-visible,nv-badge.badge-4 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-4-content);outline-offset:calc(var(--focus-outline-offset) * 0.2)}nv-badge.badge-4 nv-icon{color:var(--color-rainbow-4-icon)}nv-badge.badge-5{color:var(--color-rainbow-5-text);background-color:var(--color-rainbow-5-background);border-color:var(--color-rainbow-5-border)}nv-badge.badge-5 .close:focus,nv-badge.badge-5 .close:focus-within{outline:none}nv-badge.badge-5 .close:focus-visible,nv-badge.badge-5 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-5-content);outline-offset:calc(var(--focus-outline-offset) * 0.2)}nv-badge.badge-5 nv-icon{color:var(--color-rainbow-5-icon)}nv-badge.badge-6{color:var(--color-rainbow-6-text);background-color:var(--color-rainbow-6-background);border-color:var(--color-rainbow-6-border)}nv-badge.badge-6 .close:focus,nv-badge.badge-6 .close:focus-within{outline:none}nv-badge.badge-6 .close:focus-visible,nv-badge.badge-6 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-6-content);outline-offset:calc(var(--focus-outline-offset) * 0.2)}nv-badge.badge-6 nv-icon{color:var(--color-rainbow-6-icon)}nv-badge.badge-7{color:var(--color-rainbow-7-text);background-color:var(--color-rainbow-7-background);border-color:var(--color-rainbow-7-border)}nv-badge.badge-7 .close:focus,nv-badge.badge-7 .close:focus-within{outline:none}nv-badge.badge-7 .close:focus-visible,nv-badge.badge-7 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-7-content);outline-offset:calc(var(--focus-outline-offset) * 0.2)}nv-badge.badge-7 nv-icon{color:var(--color-rainbow-7-icon)}nv-badge.badge-8{color:var(--color-rainbow-8-text);background-color:var(--color-rainbow-8-background);border-color:var(--color-rainbow-8-border)}nv-badge.badge-8 .close:focus,nv-badge.badge-8 .close:focus-within{outline:none}nv-badge.badge-8 .close:focus-visible,nv-badge.badge-8 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-8-content);outline-offset:calc(var(--focus-outline-offset) * 0.2)}nv-badge.badge-8 nv-icon{color:var(--color-rainbow-8-icon)}nv-badge.badge-9{color:var(--color-rainbow-9-text);background-color:var(--color-rainbow-9-background);border-color:var(--color-rainbow-9-border)}nv-badge.badge-9 .close:focus,nv-badge.badge-9 .close:focus-within{outline:none}nv-badge.badge-9 .close:focus-visible,nv-badge.badge-9 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-9-content);outline-offset:calc(var(--focus-outline-offset) * 0.2)}nv-badge.badge-9 nv-icon{color:var(--color-rainbow-9-icon)}nv-badge.badge-10{color:var(--color-rainbow-10-text);background-color:var(--color-rainbow-10-background);border-color:var(--color-rainbow-10-border)}nv-badge.badge-10 .close:focus,nv-badge.badge-10 .close:focus-within{outline:none}nv-badge.badge-10 .close:focus-visible,nv-badge.badge-10 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-10-content);outline-offset:calc(var(--focus-outline-offset) * 0.2)}nv-badge.badge-10 nv-icon{color:var(--color-rainbow-10-icon)}nv-badge.badge-error{color:var(--color-feedback-error-low-text);background-color:var(--color-feedback-error-low-background);border-color:var(--color-feedback-error-low-border)}nv-badge.badge-error .close:focus,nv-badge.badge-error .close:focus-within{outline:none}nv-badge.badge-error .close:focus-visible,nv-badge.badge-error .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-feedback-error-low-content, var(--color-feedback-error-low-text));outline-offset:calc(var(--focus-outline-offset) * 0.2)}nv-badge.badge-error nv-icon{color:var(--color-feedback-error-low-icon)}nv-badge.badge-information{color:var(--color-feedback-information-low-text);background-color:var(--color-feedback-information-low-background);border-color:var(--color-feedback-information-low-border)}nv-badge.badge-information .close:focus,nv-badge.badge-information .close:focus-within{outline:none}nv-badge.badge-information .close:focus-visible,nv-badge.badge-information .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-feedback-information-low-content, var(--color-feedback-information-low-text));outline-offset:calc(var(--focus-outline-offset) * 0.2)}nv-badge.badge-information nv-icon{color:var(--color-feedback-information-low-icon)}nv-badge.badge-neutral{color:var(--color-feedback-neutral-low-text);background-color:var(--color-feedback-neutral-low-background);border-color:var(--color-feedback-neutral-low-border)}nv-badge.badge-neutral .close:focus,nv-badge.badge-neutral .close:focus-within{outline:none}nv-badge.badge-neutral .close:focus-visible,nv-badge.badge-neutral .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-feedback-neutral-low-content, var(--color-feedback-neutral-low-text));outline-offset:calc(var(--focus-outline-offset) * 0.2)}nv-badge.badge-neutral nv-icon{color:var(--color-feedback-neutral-low-icon)}nv-badge.badge-success{color:var(--color-feedback-success-low-text);background-color:var(--color-feedback-success-low-background);border-color:var(--color-feedback-success-low-border)}nv-badge.badge-success .close:focus,nv-badge.badge-success .close:focus-within{outline:none}nv-badge.badge-success .close:focus-visible,nv-badge.badge-success .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-feedback-success-low-content, var(--color-feedback-success-low-text));outline-offset:calc(var(--focus-outline-offset) * 0.2)}nv-badge.badge-success nv-icon{color:var(--color-feedback-success-low-icon)}nv-badge.badge-warning{color:var(--color-feedback-warning-low-text);background-color:var(--color-feedback-warning-low-background);border-color:var(--color-feedback-warning-low-border)}nv-badge.badge-warning .close:focus,nv-badge.badge-warning .close:focus-within{outline:none}nv-badge.badge-warning .close:focus-visible,nv-badge.badge-warning .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-feedback-warning-low-content, var(--color-feedback-warning-low-text));outline-offset:calc(var(--focus-outline-offset) * 0.2)}nv-badge.badge-warning nv-icon{color:var(--color-feedback-warning-low-icon)}nv-badge.badge-amber{color:var(--color-rainbow-1-text);background-color:var(--color-rainbow-1-background);border-color:var(--color-rainbow-1-border)}nv-badge.badge-amber .close:focus,nv-badge.badge-amber .close:focus-within{outline:none}nv-badge.badge-amber .close:focus-visible,nv-badge.badge-amber .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-amber-content, var(--color-rainbow-1-text));outline-offset:calc(var(--focus-outline-offset) * 0.2)}nv-badge.badge-amber nv-icon{color:var(--color-rainbow-1-icon)}nv-badge.badge-orange{color:var(--color-rainbow-2-text);background-color:var(--color-rainbow-2-background);border-color:var(--color-rainbow-2-border)}nv-badge.badge-orange .close:focus,nv-badge.badge-orange .close:focus-within{outline:none}nv-badge.badge-orange .close:focus-visible,nv-badge.badge-orange .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-orange-content, var(--color-rainbow-2-text));outline-offset:calc(var(--focus-outline-offset) * 0.2)}nv-badge.badge-orange nv-icon{color:var(--color-rainbow-2-icon)}nv-badge.badge-turquoise{color:var(--color-rainbow-5-text);background-color:var(--color-rainbow-5-background);border-color:var(--color-rainbow-5-border)}nv-badge.badge-turquoise .close:focus,nv-badge.badge-turquoise .close:focus-within{outline:none}nv-badge.badge-turquoise .close:focus-visible,nv-badge.badge-turquoise .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-turquoise-content, var(--color-rainbow-5-text));outline-offset:calc(var(--focus-outline-offset) * 0.2)}nv-badge.badge-turquoise nv-icon{color:var(--color-rainbow-5-icon)}nv-badge.badge-crimson{color:var(--color-rainbow-6-text);background-color:var(--color-rainbow-6-background);border-color:var(--color-rainbow-6-border)}nv-badge.badge-crimson .close:focus,nv-badge.badge-crimson .close:focus-within{outline:none}nv-badge.badge-crimson .close:focus-visible,nv-badge.badge-crimson .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-crimson-content, var(--color-rainbow-6-text));outline-offset:calc(var(--focus-outline-offset) * 0.2)}nv-badge.badge-crimson nv-icon{color:var(--color-rainbow-6-icon)}nv-badge.badge-lime{color:var(--color-rainbow-9-text);background-color:var(--color-rainbow-9-background);border-color:var(--color-rainbow-9-border)}nv-badge.badge-lime .close:focus,nv-badge.badge-lime .close:focus-within{outline:none}nv-badge.badge-lime .close:focus-visible,nv-badge.badge-lime .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-lime-content, var(--color-rainbow-9-text));outline-offset:calc(var(--focus-outline-offset) * 0.2)}nv-badge.badge-lime nv-icon{color:var(--color-rainbow-9-icon)}nv-badge.badge-petrol{color:var(--color-rainbow-8-text);background-color:var(--color-rainbow-8-background);border-color:var(--color-rainbow-8-border)}nv-badge.badge-petrol .close:focus,nv-badge.badge-petrol .close:focus-within{outline:none}nv-badge.badge-petrol .close:focus-visible,nv-badge.badge-petrol .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-petrol-content, var(--color-rainbow-8-text));outline-offset:calc(var(--focus-outline-offset) * 0.2)}nv-badge.badge-petrol nv-icon{color:var(--color-rainbow-8-icon)}nv-badge span{font-size:var(--font-size-xs);line-height:var(--line-height-xs) !important;text-align:center}nv-badge nv-icon>svg.icon-xs{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-badge nv-icon>svg.icon-sm{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-badge nv-icon>svg.icon-md{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-badge nv-icon>svg.icon-lg{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-badge nv-icon>svg.icon-xl{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-badge .close{padding:0;line-height:0;border:none;background:none;cursor:pointer;color:inherit;display:inline-flex;align-items:center;aspect-ratio:1/1;border-radius:var(--radius-rounded-full)}";
|
|
13
|
-
const NvBadgeStyle0 = nvBadgeCss;
|
|
14
14
|
|
|
15
15
|
const NvBadge = class {
|
|
16
16
|
constructor(hostRef) {
|
|
17
17
|
index.registerInstance(this, hostRef);
|
|
18
|
-
this.closeClicked = index.createEvent(this, "closeClicked");
|
|
19
|
-
this.hiddenChanged = index.createEvent(this, "hiddenChanged");
|
|
20
|
-
this.hiddenChangedComplete = index.createEvent(this, "hiddenChangedComplete");
|
|
18
|
+
this.closeClicked = index.createEvent(this, "closeClicked", 3);
|
|
19
|
+
this.hiddenChanged = index.createEvent(this, "hiddenChanged", 3);
|
|
20
|
+
this.hiddenChangedComplete = index.createEvent(this, "hiddenChangedComplete", 3);
|
|
21
21
|
/****************************************************************************/
|
|
22
22
|
//#region DEPRECATED
|
|
23
23
|
/**
|
|
@@ -100,12 +100,12 @@ const NvBadge = class {
|
|
|
100
100
|
this.hiddenChanged.emit(hidden);
|
|
101
101
|
if (this._isHidden === true)
|
|
102
102
|
this._isHidden = hidden;
|
|
103
|
-
const { fadeIn, fadeOut } =
|
|
104
|
-
const { collapse, expand } =
|
|
103
|
+
const { fadeIn, fadeOut } = fade_animationDcRL9lcm.useFade(this.el, { duration: 150 });
|
|
104
|
+
const { collapse, expand } = collapse_animationDZDm0vSK.useCollapse(this.el, { duration: 150 });
|
|
105
105
|
if (hidden === true)
|
|
106
|
-
await
|
|
106
|
+
await timeline_animationCgHCo_Ho.timeline(fadeOut, collapse).start();
|
|
107
107
|
if (hidden === false)
|
|
108
|
-
await
|
|
108
|
+
await timeline_animationCgHCo_Ho.timeline(expand, fadeIn).start();
|
|
109
109
|
this.hiddenChangedComplete.emit(hidden);
|
|
110
110
|
if (this._isHidden === false)
|
|
111
111
|
this._isHidden = hidden;
|
|
@@ -125,8 +125,8 @@ const NvBadge = class {
|
|
|
125
125
|
}
|
|
126
126
|
if (this.hidden) {
|
|
127
127
|
this._isHidden = true;
|
|
128
|
-
const { setCollapsed } =
|
|
129
|
-
const { setFadeOut } =
|
|
128
|
+
const { setCollapsed } = collapse_animationDZDm0vSK.useCollapse(this.el);
|
|
129
|
+
const { setFadeOut } = fade_animationDcRL9lcm.useFade(this.el);
|
|
130
130
|
setCollapsed();
|
|
131
131
|
setFadeOut();
|
|
132
132
|
}
|
|
@@ -135,12 +135,12 @@ const NvBadge = class {
|
|
|
135
135
|
/****************************************************************************/
|
|
136
136
|
//#region RENDER
|
|
137
137
|
render() {
|
|
138
|
-
return (index.h(index.Host, { key: '
|
|
138
|
+
return (index.h(index.Host, { key: 'e47c85f80669870b4cd825fa29ebee7610751728', class: clsxChV9xqsO.clsx(`badge-${this.color}`, {
|
|
139
139
|
'has-close': this.dismissible,
|
|
140
140
|
'with-gap': this.dismissible || this.label,
|
|
141
141
|
'visually-hidden': this._isHidden,
|
|
142
142
|
'is-icon-only': this.isIconOnly,
|
|
143
|
-
}) }, index.h("slot", { key: '
|
|
143
|
+
}) }, index.h("slot", { key: '63909cdcb1edc9e685d1b60534d72ed3dd700d05', name: "leading-icon" }, this.leadIcon && index.h("nv-icon", { key: 'ca443b29509145863f0fc4a8f814c57669342d15', name: this.leadIcon, size: "sm" })), index.h("span", { key: 'fbae90db0aa23cf0d204b14002ca702ad3731b51', class: clsxChV9xqsO.clsx({ 'visually-hidden': this.isIconOnly }) }, this.label, index.h("slot", { key: '93e818db9d012176d407b19097c7513d7d462053' })), this.dismissible && (index.h("button", { key: 'c48984564102d04914a967aa3f9a29defae62455', onClick: this.handleClose, class: "close", type: "button" }, index.h("nv-icon", { key: '849a32c60019a99909e0383ad593fc1daf00dc59', name: "x", size: "sm" })))));
|
|
144
144
|
}
|
|
145
145
|
get el() { return index.getElement(this); }
|
|
146
146
|
static get watchers() { return {
|
|
@@ -149,15 +149,14 @@ const NvBadge = class {
|
|
|
149
149
|
"hidden": ["handleHiddenChange"]
|
|
150
150
|
}; }
|
|
151
151
|
};
|
|
152
|
-
NvBadge.style =
|
|
152
|
+
NvBadge.style = nvBadgeCss;
|
|
153
153
|
|
|
154
|
-
const nvFielddropdownitemcheckCss = "nv-fielddropdownitemcheck{cursor:pointer;display:flex;padding:var(--list-dropdown-item-padding-y) var(--list-dropdown-item-padding-x);border-radius:var(--list-dropdown-item-radius)}nv-fielddropdownitemcheck
|
|
155
|
-
const NvFielddropdownitemcheckStyle0 = nvFielddropdownitemcheckCss;
|
|
154
|
+
const nvFielddropdownitemcheckCss = "nv-fielddropdownitemcheck slot-fb,nv-fielddropdownitemcheck span{all:unset}nv-fielddropdownitemcheck{cursor:pointer;display:flex;padding:var(--list-dropdown-item-padding-y) var(--list-dropdown-item-padding-x);border-radius:var(--list-dropdown-item-radius)}nv-fielddropdownitemcheck:hover{background-color:var(--components-list-dropdown-item-background-hover)}";
|
|
156
155
|
|
|
157
156
|
const NvFielddropdownitemcheck = class {
|
|
158
157
|
constructor(hostRef) {
|
|
159
158
|
index.registerInstance(this, hostRef);
|
|
160
|
-
this.itemChecked = index.createEvent(this, "itemChecked");
|
|
159
|
+
this.itemChecked = index.createEvent(this, "itemChecked", 7);
|
|
161
160
|
/****************************************************************************/
|
|
162
161
|
//#region PROPERTIES
|
|
163
162
|
/**
|
|
@@ -168,6 +167,7 @@ const NvFielddropdownitemcheck = class {
|
|
|
168
167
|
* Disables the item, preventing any user interaction.
|
|
169
168
|
*/
|
|
170
169
|
this.disabled = false;
|
|
170
|
+
/* eslint-enable nova/event-bubbling */
|
|
171
171
|
//#endregion EVENTS
|
|
172
172
|
/****************************************************************************/
|
|
173
173
|
//#region METHODS
|
|
@@ -203,11 +203,11 @@ const NvFielddropdownitemcheck = class {
|
|
|
203
203
|
/****************************************************************************/
|
|
204
204
|
//#region RENDER
|
|
205
205
|
render() {
|
|
206
|
-
return (index.h(index.Host, { key: '
|
|
206
|
+
return (index.h(index.Host, { key: 'e748d27a6ee1168b069793541de3bf2defd34b85', onClick: this.handleClick }, index.h("nv-fieldcheckbox", { key: '967307de6a757e0cd5cb061d57ce94c04c3e84e4', checked: this.checked, name: this.label || this.value, label: this.label || this.value, labelPlacement: "after", description: this.description, disabled: this.disabled, tabindex: "-1", onCheckedChanged: this.onFieldcheckboxChanged }, index.h("slot", { key: '9e76ecb6c08ef6b9fe3ea07790c469676fdad227' }), index.h("slot", { key: '9a40f79c6685e89d58b661bcd00c00158fe6bce6', name: "main" }), index.h("slot", { key: '8c901183f49fa4f911a8265df45a19202259015a', name: "label" }), index.h("slot", { key: 'd35e5af79bb83482d5e8568b5aaedc6815ec9b4e', name: "description" }))));
|
|
207
207
|
}
|
|
208
208
|
get el() { return index.getElement(this); }
|
|
209
209
|
};
|
|
210
|
-
NvFielddropdownitemcheck.style =
|
|
210
|
+
NvFielddropdownitemcheck.style = nvFielddropdownitemcheckCss;
|
|
211
211
|
|
|
212
212
|
exports.nv_badge = NvBadge;
|
|
213
213
|
exports.nv_fielddropdownitemcheck = NvFielddropdownitemcheck;
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
4
|
-
var
|
|
3
|
+
var index = require('./index-CtjeeUI-.js');
|
|
4
|
+
var clsxChV9xqsO = require('./clsx-ChV9xqsO-BtxeOLZW.js');
|
|
5
|
+
require('@stencil/react-output-target/runtime');
|
|
5
6
|
require('react');
|
|
6
7
|
require('react-dom');
|
|
7
8
|
|
|
8
9
|
const nvBreadcrumbCss = "nv-breadcrumb{display:flex;align-items:center;color:var(--components-breadcrumb-text);font-size:var(--font-size-sm);font-style:normal;font-weight:var(--font-weight-medium-emphasis);line-height:var(--line-height-sm)}nv-breadcrumb.visually-hidden{position:absolute;padding:0;border:0;overflow:hidden;white-space:nowrap;width:1px;height:1px;margin:-1px;clip:rect(0, 0, 0, 0)}nv-breadcrumb ul{display:flex;flex-direction:column;gap:var(--spacing-1-5);padding:var(--spacing-1)}nv-breadcrumb ul a,nv-breadcrumb ul button{display:inline-flex;align-self:center;color:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;line-height:inherit;text-decoration:none}nv-breadcrumb ul a:focus,nv-breadcrumb ul a:focus-within,nv-breadcrumb ul button:focus,nv-breadcrumb ul button:focus-within{outline:none}nv-breadcrumb ul a:focus-visible,nv-breadcrumb ul a:has(:focus-visible),nv-breadcrumb ul button:focus-visible,nv-breadcrumb ul button:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 0.5) solid var(--components-breadcrumb-text-hover);outline-offset:calc(var(--focus-outline-offset) * 0.3)}nv-breadcrumb ul a:hover,nv-breadcrumb ul button:hover{text-decoration:underline;color:var(--components-breadcrumb-text-hover)}nv-breadcrumb>a,nv-breadcrumb>button{display:inline-flex;align-self:center;color:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;line-height:inherit;text-decoration:none}nv-breadcrumb>a:focus,nv-breadcrumb>a:focus-within,nv-breadcrumb>button:focus,nv-breadcrumb>button:focus-within{outline:none}nv-breadcrumb>a:focus-visible,nv-breadcrumb>a:has(:focus-visible),nv-breadcrumb>button:focus-visible,nv-breadcrumb>button:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 0.5) solid var(--components-breadcrumb-text-hover);outline-offset:calc(var(--focus-outline-offset) * 0.3)}nv-breadcrumb>a:hover,nv-breadcrumb>button:hover{text-decoration:underline;color:var(--components-breadcrumb-text-hover)}nv-breadcrumb span[data-scope=separator]{display:inline-flex;padding-left:var(--breadcrumb-padding-y)}";
|
|
9
|
-
const NvBreadcrumbStyle0 = nvBreadcrumbCss;
|
|
10
10
|
|
|
11
11
|
const NvBreadcrumb = class {
|
|
12
12
|
constructor(hostRef) {
|
|
@@ -37,10 +37,10 @@ const NvBreadcrumb = class {
|
|
|
37
37
|
/****************************************************************************/
|
|
38
38
|
//#region RENDER
|
|
39
39
|
render() {
|
|
40
|
-
return (index.h(index.Host, { key: 'b0cfdee987585488bd49734900ee421b081e6df4', role: "listitem", "aria-current": this.current ? 'location' : undefined, class:
|
|
40
|
+
return (index.h(index.Host, { key: 'b0cfdee987585488bd49734900ee421b081e6df4', role: "listitem", "aria-current": this.current ? 'location' : undefined, class: clsxChV9xqsO.clsx({ 'visually-hidden': this.current }) }, this.type === 'collapsed' ? (index.h("button", { ref: el => (this.popoverTrigger = el) }, "...")) : (index.h("slot", null)), this.tooltip && (index.h("nv-tooltip", { key: '970d9552c3f81bffd86889fc2ff169f73810507b', message: this.tooltip, triggerElement: this.popoverTrigger, placement: "top" })), this.type === 'collapsed' && (index.h("nv-popover", { key: '1b14ce172db49aaeb199d6801978f96204ba05a1', triggerMode: "click", groupName: "breadcrumbs", triggerElement: this.popoverTrigger }, index.h("ul", { key: 'b984309f9290bb4bcfed796200ffaad6e52a2b93', slot: "content" }, index.h("slot", { key: '189408f75e689b98b4cf9397074dbaefaecece9a' })))), index.h("span", { key: '62a4bed098620043b69f1e7dcf51db7de035f5fc', "data-scope": "separator" }, "/")));
|
|
41
41
|
}
|
|
42
42
|
get el() { return index.getElement(this); }
|
|
43
43
|
};
|
|
44
|
-
NvBreadcrumb.style =
|
|
44
|
+
NvBreadcrumb.style = nvBreadcrumbCss;
|
|
45
45
|
|
|
46
46
|
exports.nv_breadcrumb = NvBreadcrumb;
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-CtjeeUI-.js');
|
|
4
|
+
require('@stencil/react-output-target/runtime');
|
|
4
5
|
require('react');
|
|
5
6
|
require('react-dom');
|
|
6
7
|
|
|
7
8
|
const nvBreadcrumbsCss = "nv-breadcrumbs{display:block}nv-breadcrumbs>ol{display:flex;flex-wrap:wrap;align-items:center;gap:var(--breadcrumb-padding-y)}nv-breadcrumbs nv-breadcrumb:last-child [data-scope=separator],nv-breadcrumbs nv-breadcrumb:last-child [slot=separator]{display:none}";
|
|
8
|
-
const NvBreadcrumbsStyle0 = nvBreadcrumbsCss;
|
|
9
9
|
|
|
10
10
|
const NvBreadcrumbs = class {
|
|
11
11
|
constructor(hostRef) {
|
|
@@ -16,6 +16,6 @@ const NvBreadcrumbs = class {
|
|
|
16
16
|
return (index.h(index.Host, { key: '4337fe5161c0ce444001e1b92221f3adac26e4bf', role: "navigation", "aria-label": "breadcrumbs" }, index.h("ol", { key: '00d470eadfe879be525a4a4b7ec3368601a0697c' }, index.h("slot", { key: '2d012f152b49f33f399aa14dfb18a4c39265128c' }))));
|
|
17
17
|
}
|
|
18
18
|
};
|
|
19
|
-
NvBreadcrumbs.style =
|
|
19
|
+
NvBreadcrumbs.style = nvBreadcrumbsCss;
|
|
20
20
|
|
|
21
21
|
exports.nv_breadcrumbs = NvBreadcrumbs;
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
4
|
-
var
|
|
3
|
+
var index = require('./index-CtjeeUI-.js');
|
|
4
|
+
var constantsBReL3Lsa = require('./constants-BReL3Lsa-DpB_ghPF.js');
|
|
5
|
+
require('@stencil/react-output-target/runtime');
|
|
5
6
|
require('react');
|
|
6
7
|
require('react-dom');
|
|
7
8
|
|
|
8
9
|
const nvButtonCss = "nv-button{text-decoration:none;display:inline-flex;justify-content:center;align-items:center;font-style:normal;font-weight:var(--font-weight-medium-emphasis);font-family:var(--font-family-default), var(--font-family-fallback), sans-serif;transition:background-color 150ms ease-out;user-select:none;cursor:pointer;height:fit-content;width:fit-content}nv-button[size=xs]{padding:var(--button-xs-padding-y) var(--button-xs-padding-x);gap:var(--button-xs-gap);border-radius:var(--button-xs-border-radius);line-height:var(--button-xs-line-height);height:var(--button-xs-height);font-size:var(--button-xs-font-size)}nv-button[size=xs] nv-icon>svg{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-button[size=sm]{padding:var(--button-sm-padding-y) var(--button-sm-padding-x);gap:var(--button-sm-gap);border-radius:var(--button-sm-border-radius);line-height:var(--button-sm-line-height);height:var(--button-sm-height);font-size:var(--button-sm-font-size)}nv-button[size=sm] nv-icon>svg{width:var(--spacing-4);height:var(--spacing-4);stroke-width:1.5px}nv-button[size=md]{padding:var(--button-md-padding-y) var(--button-md-padding-x);gap:var(--button-md-gap);border-radius:var(--button-md-border-radius);line-height:var(--button-md-line-height);height:var(--button-md-height);font-size:var(--button-md-font-size)}nv-button[size=md] nv-icon>svg{width:var(--spacing-5);height:var(--spacing-5);stroke-width:1.6px}nv-button[size=lg]{padding:var(--button-lg-padding-y) var(--button-lg-padding-x);gap:var(--button-lg-gap);border-radius:var(--button-lg-border-radius);line-height:var(--button-lg-line-height);height:var(--button-lg-height);font-size:var(--button-lg-font-size)}nv-button[size=lg] nv-icon>svg{width:var(--spacing-6);height:var(--spacing-6);stroke-width:1.8px}nv-button[emphasis=high]{background:var(--components-button-high-background);border:1px solid var(--components-button-high-border);color:var(--components-button-high-text)}nv-button[emphasis=high]:hover{background:var(--components-button-high-background-hover);border:1px solid var(--components-button-high-border);color:var(--components-button-high-text-hover)}nv-button[emphasis=high]:active{background:var(--components-button-high-background-active);border:1px solid var(--components-button-high-border-active);color:var(--components-button-high-text-active)}nv-button[emphasis=high]:focus,nv-button[emphasis=high]:focus-within{outline:none}nv-button[emphasis=high]:focus-visible,nv-button[emphasis=high]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-button[emphasis=high]:disabled:not([disabled=false]){opacity:0.5;cursor:not-allowed;box-shadow:none}nv-button[emphasis=high][active]:not([active=false]){background:var(--components-button-high-background-active);border:1px solid var(--components-button-high-border-active);color:var(--components-button-high-text-active)}nv-button[emphasis=high][danger]:not([danger=false]){background:var(--components-button-destructive-high-background);border:1px solid transparent;color:var(--components-button-destructive-high-text)}nv-button[emphasis=high][danger]:not([danger=false]):hover{background:var(--components-button-destructive-high-background-hover);border:1px solid transparent;color:var(--components-button-destructive-high-text-hover)}nv-button[emphasis=high][danger]:not([danger=false]):focus,nv-button[emphasis=high][danger]:not([danger=false]):focus-within{outline:none}nv-button[emphasis=high][danger]:not([danger=false]):focus-visible,nv-button[emphasis=high][danger]:not([danger=false]):has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-destructive);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-button[emphasis=medium]{background:var(--components-button-medium-background);border:1px solid var(--components-button-medium-border);color:var(--components-button-medium-text)}nv-button[emphasis=medium]:hover{background:var(--components-button-medium-background-hover);border:1px solid var(--components-button-medium-border);color:var(--components-button-medium-text-hover)}nv-button[emphasis=medium]:active{background:var(--components-button-medium-background-active);border:1px solid var(--components-button-medium-border-active);color:var(--components-button-medium-text-active)}nv-button[emphasis=medium]:focus,nv-button[emphasis=medium]:focus-within{outline:none}nv-button[emphasis=medium]:focus-visible,nv-button[emphasis=medium]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-button[emphasis=medium]:disabled:not([disabled=false]){opacity:0.5;cursor:not-allowed;box-shadow:none}nv-button[emphasis=medium][active]:not([active=false]){background:var(--components-button-medium-background-active);border:1px solid var(--components-button-medium-border-active);color:var(--components-button-medium-text-active)}nv-button[emphasis=medium][danger]:not([danger=false]){background:var(--components-button-destructive-medium-background);border:1px solid var(--components-button-destructive-medium-border);color:var(--components-button-destructive-medium-text)}nv-button[emphasis=medium][danger]:not([danger=false]):hover{background:var(--components-button-destructive-medium-background-hover);border:1px solid var(--components-button-destructive-medium-border);color:var(--components-button-destructive-medium-text-hover)}nv-button[emphasis=medium][danger]:not([danger=false]):focus,nv-button[emphasis=medium][danger]:not([danger=false]):focus-within{outline:none}nv-button[emphasis=medium][danger]:not([danger=false]):focus-visible,nv-button[emphasis=medium][danger]:not([danger=false]):has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-destructive);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-button[emphasis=low]{background:var(--components-button-low-background);border:1px solid var(--components-button-low-border);color:var(--components-button-low-text)}nv-button[emphasis=low]:hover{background:var(--components-button-low-background-hover);border:1px solid var(--components-button-low-border);color:var(--components-button-low-text-hover)}nv-button[emphasis=low]:active{background:var(--components-button-low-background-active);border:1px solid var(--components-button-low-border-active);color:var(--components-button-low-text-active)}nv-button[emphasis=low]:focus,nv-button[emphasis=low]:focus-within{outline:none}nv-button[emphasis=low]:focus-visible,nv-button[emphasis=low]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-button[emphasis=low]:disabled:not([disabled=false]){opacity:0.5;cursor:not-allowed;box-shadow:none}nv-button[emphasis=low][active]:not([active=false]){background:var(--components-button-low-background-active);border:1px solid var(--components-button-low-border-active);color:var(--components-button-low-text-active)}nv-button[emphasis=low][danger]:not([danger=false]){background:var(--components-button-destructive-low-background);border:1px solid var(--components-button-destructive-low-border);color:var(--components-button-destructive-low-text)}nv-button[emphasis=low][danger]:not([danger=false]):hover{background:var(--components-button-destructive-low-background-hover);border:1px solid var(--components-button-destructive-low-border);color:var(--components-button-destructive-low-text-hover)}nv-button[emphasis=low][danger]:not([danger=false]):focus,nv-button[emphasis=low][danger]:not([danger=false]):focus-within{outline:none}nv-button[emphasis=low][danger]:not([danger=false]):focus-visible,nv-button[emphasis=low][danger]:not([danger=false]):has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-destructive);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-button[emphasis=lower]{background:var(--components-button-lower-background);border:1px solid var(--components-button-lower-border);color:var(--components-button-lower-text)}nv-button[emphasis=lower]:hover{background:var(--components-button-lower-background-hover);border:1px solid var(--components-button-lower-border);color:var(--components-button-lower-text-hover)}nv-button[emphasis=lower]:active{background:var(--components-button-lower-background-active);border:1px solid var(--components-button-lower-border-active);color:var(--components-button-lower-text-active)}nv-button[emphasis=lower]:focus,nv-button[emphasis=lower]:focus-within{outline:none}nv-button[emphasis=lower]:focus-visible,nv-button[emphasis=lower]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-button[emphasis=lower]:disabled:not([disabled=false]){opacity:0.5;cursor:not-allowed;box-shadow:none}nv-button[emphasis=lower][active]:not([active=false]){background:var(--components-button-lower-background-active);border:1px solid var(--components-button-lower-border-active);color:var(--components-button-lower-text-active)}nv-button[emphasis=lower][danger]:not([danger=false]){background:var(--components-button-destructive-lower-background);border:1px solid var(--components-button-destructive-lower-border);color:var(--components-button-destructive-lower-text)}nv-button[emphasis=lower][danger]:not([danger=false]):hover{background:var(--components-button-destructive-lower-background-hover);border:1px solid var(--components-button-destructive-lower-border);color:var(--components-button-destructive-lower-text-hover)}nv-button[emphasis=lower][danger]:not([danger=false]):focus,nv-button[emphasis=lower][danger]:not([danger=false]):focus-within{outline:none}nv-button[emphasis=lower][danger]:not([danger=false]):focus-visible,nv-button[emphasis=lower][danger]:not([danger=false]):has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-destructive);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-button[fluid]:not([fluid=false]){width:100%}nv-button[loading]:not([loading=false]) [slot=leading-icon]{display:none}";
|
|
9
|
-
const NvButtonStyle0 = nvButtonCss;
|
|
10
10
|
|
|
11
11
|
const NvButton = class {
|
|
12
12
|
constructor(hostRef) {
|
|
@@ -82,11 +82,11 @@ const NvButton = class {
|
|
|
82
82
|
event.preventDefault();
|
|
83
83
|
return;
|
|
84
84
|
}
|
|
85
|
-
if (this.type !==
|
|
85
|
+
if (this.type !== constantsBReL3Lsa.ButtonType.Button &&
|
|
86
86
|
(this.form || ((_a = this.internals) === null || _a === void 0 ? void 0 : _a.form))) {
|
|
87
87
|
this.processFormAction();
|
|
88
88
|
}
|
|
89
|
-
else if (this.form && this.type ===
|
|
89
|
+
else if (this.form && this.type === constantsBReL3Lsa.ButtonType.Button) {
|
|
90
90
|
console.warn('Button has a form id but is not of type submit or reset so no form action will be processed.', `Button:`, this.el);
|
|
91
91
|
}
|
|
92
92
|
};
|
|
@@ -105,10 +105,10 @@ const NvButton = class {
|
|
|
105
105
|
return;
|
|
106
106
|
}
|
|
107
107
|
switch (this.type) {
|
|
108
|
-
case
|
|
108
|
+
case constantsBReL3Lsa.ButtonType.Submit:
|
|
109
109
|
formElement.requestSubmit();
|
|
110
110
|
break;
|
|
111
|
-
case
|
|
111
|
+
case constantsBReL3Lsa.ButtonType.Reset:
|
|
112
112
|
formElement.reset();
|
|
113
113
|
break;
|
|
114
114
|
}
|
|
@@ -150,7 +150,7 @@ const NvButton = class {
|
|
|
150
150
|
/****************************************************************************/
|
|
151
151
|
//#region RENDER
|
|
152
152
|
render() {
|
|
153
|
-
return (index.h(index.Host, { key: '785b6127926d695ddaaff1a1f740102abd5132bb', role: "button", tabindex: this.disableTabindex ? -1 : 0, onClick: this.handleButtonClick }, this.loading && (index.h("nv-loader", { key: 'b361e4ac45cc1612723d6a67f866b8cdce3c4abc', size: this.size ===
|
|
153
|
+
return (index.h(index.Host, { key: '785b6127926d695ddaaff1a1f740102abd5132bb', role: "button", tabindex: this.disableTabindex ? -1 : 0, onClick: this.handleButtonClick }, this.loading && (index.h("nv-loader", { key: 'b361e4ac45cc1612723d6a67f866b8cdce3c4abc', size: this.size === constantsBReL3Lsa.ButtonSize.Large ? 'sm' : 'xs' })), index.h("slot", { key: 'b23c877bd95ae0a02c89c83e4e3d5f0178d646a5', name: "leading-icon" }), index.h("slot", { key: '7c95b1f28a64e7bb5ca02abf2190dfda62d1c758' }), index.h("slot", { key: 'f1cd34ea21393b78bc2f5140364d47b9e70f505c', name: "trailing-icon" })));
|
|
154
154
|
}
|
|
155
155
|
static get formAssociated() { return true; }
|
|
156
156
|
get el() { return index.getElement(this); }
|
|
@@ -159,6 +159,6 @@ const NvButton = class {
|
|
|
159
159
|
"disabled": ["handleDisabledChange"]
|
|
160
160
|
}; }
|
|
161
161
|
};
|
|
162
|
-
NvButton.style =
|
|
162
|
+
NvButton.style = nvButtonCss;
|
|
163
163
|
|
|
164
164
|
exports.nv_button = NvButton;
|