@nova-design-system/nova-react 3.0.0-beta.45 → 3.0.0-beta.47
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/{index-S09Gr7Tw.js → index-Byv3Vmev.js} +654 -526
- package/dist/cjs/index.js +1 -2
- package/dist/cjs/{nv-alert.entry-DH8Qd2s2.js → nv-alert.entry-BXY4KXbF.js} +1 -1
- package/dist/cjs/{nv-avatar.entry-B3-elLZC.js → nv-avatar.entry-BnPSKkJJ.js} +1 -1
- package/dist/cjs/{nv-badge_2.entry-D15EDzX0.js → nv-badge_2.entry-BsI3B8Rr.js} +5 -5
- package/dist/cjs/{nv-breadcrumb.entry-DG49Nj1L.js → nv-breadcrumb.entry-D5vGHLOG.js} +2 -2
- package/dist/cjs/{nv-breadcrumbs.entry-BqJO5pbN.js → nv-breadcrumbs.entry-CsaqAsnb.js} +2 -2
- package/dist/cjs/{nv-button.entry-CN9kB98T.js → nv-button.entry-DzZfGZGy.js} +2 -2
- package/dist/cjs/{nv-calendar.entry-CMEgSU64.js → nv-calendar.entry-CGKv_-gO.js} +49 -20
- package/dist/cjs/{nv-col.entry-wcZ9HHAb.js → nv-col.entry-Cng8NaTW.js} +2 -2
- package/dist/cjs/{nv-datagrid.entry-GCLeN2qT.js → nv-datagrid.entry-BbAOzpiO.js} +379 -86
- package/dist/cjs/nv-datagridcolumn.entry-CRogHbVM.js +22 -0
- package/dist/cjs/{nv-dialog.entry-DfY0TaYp.js → nv-dialog.entry-BSIZGYGF.js} +2 -2
- package/dist/cjs/{nv-dialogfooter_2.entry-OByWsulH.js → nv-dialogfooter_2.entry-Q4_li_QU.js} +3 -3
- package/dist/cjs/{nv-fieldcheckbox.entry-Bqpe9BK3.js → nv-fieldcheckbox.entry-DmgzfmRd.js} +5 -5
- package/dist/cjs/{nv-fielddate.entry-DJePv6tR.js → nv-fielddate.entry-qAvLX_Ru.js} +6 -6
- package/dist/cjs/{nv-fielddaterange.entry--YC750sX.js → nv-fielddaterange.entry-DVB8Rwxk.js} +5 -5
- package/dist/cjs/{nv-fielddropdown.entry-BPlTlc_S.js → nv-fielddropdown.entry-DKXmoXeW.js} +16 -36
- package/dist/cjs/{nv-fielddropdownitem.entry-zwoGySum.js → nv-fielddropdownitem.entry-BVLVXi0e.js} +2 -2
- package/dist/cjs/{nv-fieldmultiselect.entry-Bg_v0LUF.js → nv-fieldmultiselect.entry-DrTbd3Dj.js} +31 -87
- package/dist/cjs/{nv-fieldnumber.entry-BLNaq7yr.js → nv-fieldnumber.entry-DegbEHRL.js} +4 -4
- package/dist/cjs/{nv-fieldpassword.entry-iSEdS5R8.js → nv-fieldpassword.entry-gqjlEl7a.js} +10 -8
- package/dist/cjs/{nv-fieldradio.entry-Dov4vZkh.js → nv-fieldradio.entry-CVEY4v6F.js} +4 -4
- package/dist/cjs/{nv-fieldselect.entry-NmpesarX.js → nv-fieldselect.entry-BrCUuRWa.js} +6 -6
- package/dist/cjs/{nv-fieldtext.entry-r6oQajRS.js → nv-fieldtext.entry-q9NnqL5c.js} +4 -4
- package/dist/cjs/{nv-fieldtextarea.entry-CJ2yQkfi.js → nv-fieldtextarea.entry-B4qiLmX1.js} +4 -4
- package/dist/cjs/{nv-fieldtime.entry-Bxoj6N53.js → nv-fieldtime.entry-Bp2IWjhN.js} +10 -10
- package/dist/cjs/{nv-icon.entry-CWKRt8F0.js → nv-icon.entry-B1ax9cJS.js} +2 -2
- package/dist/cjs/{nv-iconbutton_2.entry-CnbscpNn.js → nv-iconbutton_2.entry-BRPAGl2S.js} +3 -3
- package/dist/cjs/{nv-menu.entry-wC7oSruP.js → nv-menu.entry-BiWiIZAm.js} +19 -45
- package/dist/cjs/{nv-menuitem.entry-BVSa1vrS.js → nv-menuitem.entry-CFkXoZ_r.js} +2 -2
- package/dist/cjs/{nv-popover.entry-ChP1we3l.js → nv-popover.entry-KT1iQUJk.js} +2 -2
- package/dist/cjs/{nv-row.entry-D6FeFpzG.js → nv-row.entry-Cs2GDrcu.js} +2 -2
- package/dist/cjs/{nv-stack.entry-zjJmztkO.js → nv-stack.entry-Ci7pxGSo.js} +2 -2
- package/dist/cjs/{nv-table.entry-CGX0jsR3.js → nv-table.entry-N4MV8Y6E.js} +3 -3
- package/dist/cjs/{nv-tablecolumn.entry-Cwdmo_RY.js → nv-tablecolumn.entry-CTz4jsZl.js} +1 -1
- package/dist/cjs/{nv-toggle.entry-BvToMkI2.js → nv-toggle.entry-m10-ncYR.js} +3 -3
- package/dist/cjs/{nv-tooltip.entry-DZ7_lB-p.js → nv-tooltip.entry-B6aRDto3.js} +2 -2
- package/dist/generated/components.js +0 -8
- package/dist/types/generated/components.d.ts +0 -3
- package/package.json +1 -1
- package/dist/cjs/nv-base.entry-D-_RUZTX.js +0 -71
- package/dist/cjs/nv-datagridcolumn.entry-lgIz71UU.js +0 -18
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var index = require('./index-Byv3Vmev.js');
|
|
4
|
+
require('react');
|
|
5
|
+
|
|
6
|
+
const NvDatagridcolumn = class {
|
|
7
|
+
constructor(hostRef) {
|
|
8
|
+
index.registerInstance(this, hostRef);
|
|
9
|
+
/**
|
|
10
|
+
* Whether the column need to be repeated with the template.
|
|
11
|
+
*/
|
|
12
|
+
this.repeatTemplate = false;
|
|
13
|
+
}
|
|
14
|
+
//#endregion PROPERTIES
|
|
15
|
+
/****************************************************************************/
|
|
16
|
+
//#region RENDER
|
|
17
|
+
render() {
|
|
18
|
+
return (index.h(index.Host, { key: '20839d4a0abfa07e55a49b434ad26e3ddaebb66b' }, index.h("slot", { key: '2c1b24aef73e9be8e500d48741e4dc6a42ed6f06', name: "header" }), index.h("slot", { key: 'cbc4bcbb080f8647c6f702e4a52411fe9be1f6ca', name: "cell" })));
|
|
19
|
+
}
|
|
20
|
+
};
|
|
21
|
+
|
|
22
|
+
exports.nv_datagridcolumn = NvDatagridcolumn;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-Byv3Vmev.js');
|
|
4
4
|
var events_utilsFe1d907f = require('./events.utils-fe1d907f-01N__3wY.js');
|
|
5
5
|
var clsx297c1ffe = require('./clsx-297c1ffe-BtxeOLZW.js');
|
|
6
6
|
var constants98e2dcc2 = require('./constants-98e2dcc2-C0SBCapP.js');
|
|
@@ -776,7 +776,7 @@ const NvDialog = class {
|
|
|
776
776
|
//#region RENDER
|
|
777
777
|
render() {
|
|
778
778
|
const hasForm = this.form || this.el.querySelector('form');
|
|
779
|
-
return (index.h(index.Host, { key: '
|
|
779
|
+
return (index.h(index.Host, { key: '97fcd67a39e1ade8b2c85280d98aa756e693fdaf' }, index.h("slot", { key: 'cd2126fc88215305b1229e03c70ee8efbd4bd518', name: "trigger" }), index.h("dialog", { key: 'f7d40530e0f0646e1d8c415c0ec341e959e142e6', ref: el => (this.dialogElement = el), onClose: this.handleDialogClose, role: "dialog", "aria-modal": "true", "aria-labelledby": "dialog-header", "aria-describedby": "dialog-content", class: clsx297c1ffe.clsx({ full: this.full }) }, index.h("div", { key: '44c81193f1946a1ae0819e96d0217bf986c6e99a', class: "content" }, !this.undismissable && (index.h("nv-button", { key: '5c2cf4e7434903f72ba814af716ce93826caaa3a', class: "close-button", emphasis: "lower", size: "sm", onClick: this.handleCloseButton, "aria-label": "Close dialog" }, index.h("nv-icon", { key: '97b57d2340aaf1cd04e49d0f4e594b2de5295809', name: "x", size: "sm" }))), this.headerElement ? (index.h("slot", { name: "header" })) : (index.h("nv-dialogheader", { id: "dialog-header" })), index.h("div", { key: '27cd8b2058505be1e0ee0e380bf44582c37c525f', class: "content-body", id: "dialog-content" }, index.h("slot", { key: 'cef88d8a7fe28518842c206761adc2fd753b2648' })), this.footerElement ? (index.h("slot", { name: "footer" })) : (index.h("nv-dialogfooter", { form: this.form, primaryButtonType: hasForm ? constants98e2dcc2.ButtonType.Submit : constants98e2dcc2.ButtonType.Button, onDialogCanceled: this.handleCancelButton, undismissable: this.undismissable }))))));
|
|
780
780
|
}
|
|
781
781
|
get el() { return index.getElement(this); }
|
|
782
782
|
static get watchers() { return {
|
package/dist/cjs/{nv-dialogfooter_2.entry-OByWsulH.js → nv-dialogfooter_2.entry-Q4_li_QU.js}
RENAMED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-Byv3Vmev.js');
|
|
4
4
|
var constants98e2dcc2 = require('./constants-98e2dcc2-C0SBCapP.js');
|
|
5
5
|
require('react');
|
|
6
6
|
|
|
@@ -89,7 +89,7 @@ const NvDialogfooter = class {
|
|
|
89
89
|
/****************************************************************************/
|
|
90
90
|
//#region RENDER
|
|
91
91
|
render() {
|
|
92
|
-
return (index.h(index.Host, { key: '
|
|
92
|
+
return (index.h(index.Host, { key: '5756a0cc697188c3fdee2930b1c6ae7922af71cc' }, !this.hasSlot ? (index.h(index.Fragment, null, !this.undismissable && (index.h("nv-button", { onClick: this.handleCancel, emphasis: "low", size: "sm" }, this.cancelLabel)), index.h("nv-button", { onClick: this.handlePrimary, disabled: this.disabled, danger: this.danger, size: "sm", emphasis: "high", form: this.form, type: this.primaryButtonType }, this.leadingIcon && (index.h("nv-icon", { slot: "leading-icon", name: this.leadingIcon, size: "sm" })), this.primaryLabel, this.trailingIcon && (index.h("nv-icon", { slot: "trailing-icon", name: this.trailingIcon, size: "sm" }))))) : (index.h("slot", null))));
|
|
93
93
|
}
|
|
94
94
|
static get formAssociated() { return true; }
|
|
95
95
|
get el() { return index.getElement(this); }
|
|
@@ -124,7 +124,7 @@ const NvDialogheader = class {
|
|
|
124
124
|
/****************************************************************************/
|
|
125
125
|
//#region RENDER
|
|
126
126
|
render() {
|
|
127
|
-
return (index.h(index.Host, { key: '
|
|
127
|
+
return (index.h(index.Host, { key: '850e2408cb7a35903be3bc51fbee000fc58f4a76' }, !this.hasSlot ? (index.h(index.Fragment, null, index.h("div", { class: "heading" }, this.heading), index.h("div", { class: "subheading" }, this.subheading))) : (index.h("slot", null))));
|
|
128
128
|
}
|
|
129
129
|
get el() { return index.getElement(this); }
|
|
130
130
|
};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-Byv3Vmev.js');
|
|
4
4
|
var clsx297c1ffe = require('./clsx-297c1ffe-BtxeOLZW.js');
|
|
5
5
|
var v4A79185f4 = require('./v4-a79185f4-2n0dOd_Y.js');
|
|
6
6
|
require('react');
|
|
@@ -118,13 +118,13 @@ const NvFieldcheckbox = class {
|
|
|
118
118
|
/****************************************************************************/
|
|
119
119
|
//#region RENDER
|
|
120
120
|
render() {
|
|
121
|
-
return (index.h(index.Host, { key: '
|
|
121
|
+
return (index.h(index.Host, { key: '98f9dfdadab534193e7076f929c9820a231fecba', class: clsx297c1ffe.clsx(this.labelPlacement === 'before' && 'label-placement-before', this.error && 'error') }, index.h("div", { key: '5a4d02d46b7c8c8930c24f794452180d58604ffe', class: "input-container" }, index.h("input", { key: 'f7a4002a5fb9800ed4036638773ac42c49d4ae0f', type: "checkbox", id: this.inputId, name: this.name, autofocus: this.autofocus, autocomplete: "off", value: this.value, checked: Boolean(this.checked), disabled: this.disabled || this.readonly, readonly: this.readonly && !this.required, required: this.required, indeterminate: this.indeterminate, ref: el => {
|
|
122
122
|
if (el) {
|
|
123
123
|
el.indeterminate = this.indeterminate;
|
|
124
124
|
}
|
|
125
|
-
} }), index.h("span", { key: '
|
|
126
|
-
this.el.querySelector('[slot="description"]')) && (index.h("div", { key: '
|
|
127
|
-
this.el.querySelector('[slot="error-description"]')) && (index.h("div", { key: '
|
|
125
|
+
} }), index.h("span", { key: '56a2547ecf96ef3f7f28054592471323497cb94f', class: "icon" }, this.checked && !this.indeterminate && (index.h("slot", { key: 'af4e10bd52b42850c8348e0aed8c90a7e700d64a', name: "checked-icon" }, index.h("svg", { key: '105847f526c391566cef42fa35d94fbaba0e8984', xmlns: "http://www.w3.org/2000/svg", width: "14", height: "14", viewBox: "0 0 14 14", fill: "none" }, index.h("path", { key: '41e221d5f3eab7a4cc88d4ed9454f198d69ec815', d: "M11.6667 3.5L5.25004 9.91667L2.33337 7", "stroke-linecap": "round", "stroke-linejoin": "round" })))), this.indeterminate && (index.h("slot", { key: '3a1f5ffdc34a1ecdc1bb7f1b5347e1f12f5f690d', name: "indeterminate-icon" }, index.h("svg", { key: '1b68c27172d5b6b9ba2419d278c0ac0299d7a4b7', class: "indeterminate-svg", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 14 14", fill: "none" }, index.h("path", { key: '7b2f4e5fe1d961fad290aade639b9807446f34ba', d: "M2.9165 7H11.0832", "stroke-linecap": "round", "stroke-linejoin": "round" })))))), index.h("div", { key: 'd472d7d8901ff7de37fe370bf5d637fc8ae6069d', class: "text-container" }, (this.label || this.el.querySelector('[slot="label"]')) && (index.h("label", { key: 'c8dbda4d6f9cb757476c9a96934599171f6ea7ae', htmlFor: this.inputId, class: clsx297c1ffe.clsx(this.hideLabel && 'visually-hidden') }, index.h("slot", { key: '3c0ec17aeb856457b63981fd0e21ead69ca3af0f', name: "label" }, this.label))), (this.description ||
|
|
126
|
+
this.el.querySelector('[slot="description"]')) && (index.h("div", { key: 'dff6c3a69496324cabcf25ae7639c98a7d908769', class: "description" }, index.h("slot", { key: '498c8216c9a0a537f1aa2a542b3caa688b76e55d', name: "description" }, this.description))), (this.errorDescription ||
|
|
127
|
+
this.el.querySelector('[slot="error-description"]')) && (index.h("div", { key: '6c584da0ad93e7f0ad62610d760c36d77b1a6fc6', hidden: !this.error, class: "error-description" }, index.h("slot", { key: '93df382e666707cdde3133daae7aa66914215149', name: "error-description" }, this.errorDescription))))));
|
|
128
128
|
}
|
|
129
129
|
static get formAssociated() { return true; }
|
|
130
130
|
get el() { return index.getElement(this); }
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-Byv3Vmev.js');
|
|
4
4
|
var inputmaskEdcad3c1 = require('./inputmask-edcad3c1-B9Omti4z.js');
|
|
5
5
|
var v4A79185f4 = require('./v4-a79185f4-2n0dOd_Y.js');
|
|
6
6
|
require('react');
|
|
@@ -261,12 +261,12 @@ const NvFielddate = class {
|
|
|
261
261
|
/****************************************************************************/
|
|
262
262
|
//#region RENDER
|
|
263
263
|
render() {
|
|
264
|
-
return (index.h(index.Host, { key: '
|
|
265
|
-
this.el.querySelector('[slot="label"]')) && (index.h("label", { key: '
|
|
264
|
+
return (index.h(index.Host, { key: '817d7baa3525b53962f9afe3d1eb56d7fcbcaf0e' }, ((this.label && this.label.length > 0) ||
|
|
265
|
+
this.el.querySelector('[slot="label"]')) && (index.h("label", { key: '00faded19c22c4883b7ef4de71d90c13c287d60d', htmlFor: this.inputId }, index.h("slot", { key: '48b7e470d654b9f07c3eba400145b8936c9eb27e', name: "label" }, this.label))), index.h("nv-popover", { key: '5b8e57124c0a08097874ac9ad0280908c3f2e330', ref: el => (this.popoverElement = el), id: this.popoverId, triggerMode: "controlled", placement: "bottom-start", open: this.open }, index.h("div", { key: '902097ce5a7f208ac97f72a847d68b80cd16419a', slot: "trigger", class: "input-wrapper" }, index.h("slot", { key: '909ff8453e9e48516582c64dae0762987cbd5986', name: "before-input" }), index.h("div", { key: 'e62714e613e9bffc5a6a302d72cdfea75555756a', class: "input-container", onClick: this.handleInputContainerClick }, index.h("slot", { key: '9d4e6bd15fe09bee974676032d4b75a73f733674', name: "leading-input" }), index.h("input", { key: '4565589e720150706096cbdeeadefb84ee836c39', id: this.inputId, ref: e => (this.inputElement = e), placeholder: this.placeholder, name: this.name, disabled: this.disabled, readOnly: this.readonly, required: this.required, autofocus: this.autofocus, value: this.singleValue, onInput: this.handleInput, onFocus: this.handleFocus }), index.h("nv-iconbutton", { key: '115ba5c4e9bbd502c51d04894a5cf88f98167231', class: "toggle-calendar-icon", name: "calendar" //{this.open ? 'chevron-top' : 'chevron-down'}
|
|
266
266
|
,
|
|
267
|
-
size: "md", emphasis: "lower", "aria-label": this.open ? 'Hide calendar' : 'Show calendar', "aria-pressed": this.open.toString(), onClick: this.toggleCalendar, tabIndex: this.disabled ? -1 : 0 })), index.h("slot", { key: '
|
|
268
|
-
this.el.querySelector('[slot="description"]')) && (index.h("div", { key: '
|
|
269
|
-
this.el.querySelector('[slot="error-description"]')) && (index.h("div", { key: '
|
|
267
|
+
size: "md", emphasis: "lower", "aria-label": this.open ? 'Hide calendar' : 'Show calendar', "aria-pressed": this.open.toString(), onClick: this.toggleCalendar, tabIndex: this.disabled ? -1 : 0 })), index.h("slot", { key: '3df2883ebe71fa1dd437f5dc62d82019b3550b88', name: "after-input" })), index.h("div", { key: '61241669d9599d23f2cf024d8e65becdafe58847', slot: "content" }, index.h("nv-calendar", { key: 'dd3c67a46e8addbf1017eaf578447a09a3dd9e66', dateFormat: this.dateFormat, singleValue: this.singleValue, firstDayOfWeek: this.firstDayOfWeek, numberOfCalendars: this.numberOfCalendars, min: this.min, max: this.max, locale: this.locale, shortcutsPlacement: this.shortcutsPlacement, showActions: this.showActions, shortcuts: this.shortcuts, showWeekNumbers: this.showWeekNumbers, disabledDates: this.disabledDates }))), ((this.description && this.description.length > 0) ||
|
|
268
|
+
this.el.querySelector('[slot="description"]')) && (index.h("div", { key: 'f835c89363c45529512e156b313cb35f71ef5264', class: "description" }, index.h("slot", { key: '738d49ee6e525310375eba5da057573104d3c2ed', name: "description" }, this.description))), (this.errorDescription ||
|
|
269
|
+
this.el.querySelector('[slot="error-description"]')) && (index.h("div", { key: '7c5c07db1af3423efc9a1b1127c1b3cbdede0a28', hidden: !this.error, class: "error-description" }, this.el.querySelector('[slot="error-description"]') ? (index.h("slot", { name: "error-description" })) : (this.errorDescription))), index.h("slot", { key: 'ccfd311cbbb56b9b336317d0e543fc57676a60d3' })));
|
|
270
270
|
}
|
|
271
271
|
get el() { return index.getElement(this); }
|
|
272
272
|
static get watchers() { return {
|
package/dist/cjs/{nv-fielddaterange.entry--YC750sX.js → nv-fielddaterange.entry-DVB8Rwxk.js}
RENAMED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-Byv3Vmev.js');
|
|
4
4
|
var inputmaskEdcad3c1 = require('./inputmask-edcad3c1-B9Omti4z.js');
|
|
5
5
|
var v4A79185f4 = require('./v4-a79185f4-2n0dOd_Y.js');
|
|
6
6
|
require('react');
|
|
@@ -335,15 +335,15 @@ const NvFielddaterange = class {
|
|
|
335
335
|
/****************************************************************************/
|
|
336
336
|
//#region RENDER
|
|
337
337
|
render() {
|
|
338
|
-
return (index.h(index.Host, { key: '
|
|
339
|
-
this.el.querySelector('[slot="label"]')) && (index.h("label", { key: '
|
|
338
|
+
return (index.h(index.Host, { key: '965223047219ae767b07ccecb0a00580ea39c232' }, ((this.label && this.label.length > 0) ||
|
|
339
|
+
this.el.querySelector('[slot="label"]')) && (index.h("label", { key: '096d6a34148da30d61686024b5891e7e15cd92e2', htmlFor: this.startInputId }, index.h("slot", { key: 'ee6e84ef1927ad809e7dddb2f4ad5ef7380d0bca', name: "label" }, this.label))), index.h("nv-popover", { key: '1a0549e85ab73157b379fcbcee014a7d85be9752', ref: el => (this.popoverElement = el), id: this.popoverId, triggerMode: "controlled", placement: "bottom-start", open: this.open }, index.h("div", { key: 'd9fc4c8f379e3c1884867c87bcaa67b2da1c64ae', slot: "trigger", class: "input-wrapper" }, index.h("slot", { key: '4189696f3e877c19d4c24b09377b2ab0ce9aa437', name: "before-input" }), index.h("div", { key: '98025c8fc29121c736deb3042e961ef0eb1442fe', class: "input-container" }, index.h("slot", { key: '897481f836e33fd70a7c3b083a4e9b3db87637f2', name: "leading-input" }), index.h("div", { key: '788df58693fafaf8c78645b81d1b09a828138ccf', class: "range-inputs" }, index.h("input", { key: '7966b844668ca4cb02ac34886b62ee24cb7b1399', id: this.startInputId, type: "text", placeholder: this.startPlaceholder, name: this.startName, disabled: this.disabled, readOnly: this.readonly, required: this.required, autofocus: this.shouldAutoFocus, value: this.startValue, onInput: this.handleStartInput, onFocus: this.handleFocus }), index.h("svg", { key: '67c0b68f0fb32ce122f9d4e5b1240440f3b649d0', xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round", class: "icon icon-tabler icons-tabler-outline icon-tabler-arrows-move-horizontal" }, index.h("path", { key: 'eb68f32a768c1c48b51a45ddba3f85357b8045e6', stroke: "none", d: "M0 0h24v24H0z", fill: "none" }), index.h("path", { key: 'b8ccaf592dc2d36719a8418800a736b06d1c1775', d: "M18 9l3 3l-3 3" }), index.h("path", { key: 'c4b8d8e8ffad9a339abcde63a9a0feb2ddc771d3', d: "M15 12h6" }), index.h("path", { key: '7a28c7086d7085163ff8d885acd7434b4e5ea69a', d: "M6 9l-3 3l3 3" }), index.h("path", { key: '39917978c25b13a270f0852818b31868f2034832', d: "M3 12h6" })), index.h("input", { key: 'aaad42e407d1fe8e31a7e7c153e2d4cd35d8d2df', id: this.endInputId, type: "text", placeholder: this.endPlaceholder, name: this.endName, disabled: this.disabled, readOnly: this.readonly, required: this.required, value: this.endValue, onInput: this.handleEndInput, onFocus: this.handleFocus })), index.h("nv-iconbutton", { key: '04701e7bdf80a869f8a5f519141ac99c0077c20b', class: "toggle-calendar-icon", name: "calendar", size: "md", emphasis: "lower", "aria-label": this.open ? 'Hide calendar' : 'Show calendar', "aria-pressed": this.open.toString(), onClick: this.toggleCalendar, tabIndex: this.disabled ? -1 : 0 })), index.h("slot", { key: 'cf1a48dcd20b4e363a746c9f26ecae8085e8ebbd', name: "after-input" })), index.h("div", { key: 'a36a223b6d5edd30bb9a4590d059caede5412b6a', slot: "content" }, index.h("nv-calendar", { key: '1ff22f214d648c4bb35455cf477529251c436e2d', dateFormat: this.dateFormat, rangeValue: this.startValue && this.endValue
|
|
340
340
|
? JSON.stringify({
|
|
341
341
|
start: this.startValue,
|
|
342
342
|
end: this.endValue,
|
|
343
343
|
})
|
|
344
344
|
: '', firstDayOfWeek: this.firstDayOfWeek, numberOfCalendars: this.numberOfCalendars, min: this.min, max: this.max, locale: this.locale, shortcutsPlacement: this.shortcutsPlacement, showActions: this.showActions, shortcuts: this.shortcuts, showWeekNumbers: this.showWeekNumbers, disabledDates: this.disabledDates, selectionType: "range" }))), ((this.description && this.description.length > 0) ||
|
|
345
|
-
this.el.querySelector('[slot="description"]')) && (index.h("div", { key: '
|
|
346
|
-
this.el.querySelector('[slot="error-description"]')) && (index.h("div", { key: '
|
|
345
|
+
this.el.querySelector('[slot="description"]')) && (index.h("div", { key: '780f82060de810eb394285f4799511d2223312a3', class: "description" }, index.h("slot", { key: '326cbf626387738b9997f3b4d452c50ea2b3d5b2', name: "description" }, this.description))), (this.errorDescription ||
|
|
346
|
+
this.el.querySelector('[slot="error-description"]')) && (index.h("div", { key: '6043f611a60f14976b8572e975621fac57b18f89', hidden: !this.error, class: "error-description" }, this.el.querySelector('[slot="error-description"]') ? (index.h("slot", { name: "error-description" })) : (this.errorDescription))), index.h("slot", { key: '129fe5bcd6c5bd9449242dc6b4f0e1c90ae31082' })));
|
|
347
347
|
}
|
|
348
348
|
get el() { return index.getElement(this); }
|
|
349
349
|
static get watchers() { return {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-Byv3Vmev.js');
|
|
4
4
|
var v4A79185f4 = require('./v4-a79185f4-2n0dOd_Y.js');
|
|
5
5
|
require('react');
|
|
6
6
|
|
|
@@ -74,12 +74,7 @@ const NvFielddropdown = class {
|
|
|
74
74
|
//#region STATE
|
|
75
75
|
/** The text entered by the user for filtering dropdown items. */
|
|
76
76
|
this.filterText = '';
|
|
77
|
-
this.isFilterable = this.filterable;
|
|
78
77
|
this.selectedValues = new Set();
|
|
79
|
-
/**
|
|
80
|
-
* Options configuration for the dropdown items.
|
|
81
|
-
*/
|
|
82
|
-
this.parsedOptions = [];
|
|
83
78
|
this.handleInputContainerClick = (event) => {
|
|
84
79
|
if (this.disabled || this.readonly) {
|
|
85
80
|
return;
|
|
@@ -122,17 +117,17 @@ const NvFielddropdown = class {
|
|
|
122
117
|
this.open = !this.open;
|
|
123
118
|
};
|
|
124
119
|
this.getSelectedLabel = () => {
|
|
125
|
-
var _a, _b, _c, _d, _e;
|
|
120
|
+
var _a, _b, _c, _d, _e, _f;
|
|
126
121
|
if (!this.value)
|
|
127
122
|
return '';
|
|
128
|
-
if (this.
|
|
129
|
-
const matchingItem = this.
|
|
130
|
-
return (
|
|
123
|
+
if (((_a = this.options) === null || _a === void 0 ? void 0 : _a.length) > 1) {
|
|
124
|
+
const matchingItem = this.options.find(option => option.value === this.value);
|
|
125
|
+
return (_c = (_b = matchingItem === null || matchingItem === void 0 ? void 0 : matchingItem.label) !== null && _b !== void 0 ? _b : matchingItem === null || matchingItem === void 0 ? void 0 : matchingItem.value) !== null && _c !== void 0 ? _c : this.value;
|
|
131
126
|
}
|
|
132
127
|
const items = Array.from(this.el.querySelectorAll('nv-fielddropdownitem'));
|
|
133
128
|
const matchingItem = items.find(item => item.value === this.value);
|
|
134
129
|
const selectedLabel = matchingItem
|
|
135
|
-
? (
|
|
130
|
+
? (_f = (_d = matchingItem.label) !== null && _d !== void 0 ? _d : (_e = matchingItem.textContent) === null || _e === void 0 ? void 0 : _e.trim()) !== null && _f !== void 0 ? _f : matchingItem.value
|
|
136
131
|
: '';
|
|
137
132
|
return selectedLabel;
|
|
138
133
|
};
|
|
@@ -164,32 +159,17 @@ const NvFielddropdown = class {
|
|
|
164
159
|
handleOpenChanged(event) {
|
|
165
160
|
this.open = event.detail; // Update `open` based on the popover state
|
|
166
161
|
}
|
|
167
|
-
watchFilterableHandler(newValue) {
|
|
168
|
-
this.isFilterable = newValue;
|
|
169
|
-
this.filterable = newValue;
|
|
170
|
-
}
|
|
171
162
|
watchValueHandler(newValue) {
|
|
172
163
|
this.valueChanged.emit(newValue);
|
|
173
164
|
}
|
|
174
165
|
handleOptionsChange(newValue) {
|
|
175
166
|
var _a;
|
|
176
|
-
if (newValue)
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
this.value = (_a = defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.value) !== null && _a !== void 0 ? _a : '';
|
|
183
|
-
this.updateSelectedItem(this.value);
|
|
184
|
-
}
|
|
185
|
-
}
|
|
186
|
-
catch (error) {
|
|
187
|
-
console.error('nv-fielddropdown: error parsing options:', error);
|
|
188
|
-
this.parsedOptions = [];
|
|
189
|
-
}
|
|
190
|
-
}
|
|
191
|
-
else {
|
|
192
|
-
this.parsedOptions = [];
|
|
167
|
+
if (!newValue)
|
|
168
|
+
return;
|
|
169
|
+
if (!this.value) {
|
|
170
|
+
const defaultValue = newValue.find(option => option.selected);
|
|
171
|
+
this.value = (_a = defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.value) !== null && _a !== void 0 ? _a : '';
|
|
172
|
+
this.updateSelectedItem(this.value);
|
|
193
173
|
}
|
|
194
174
|
}
|
|
195
175
|
handleBlur(event) {
|
|
@@ -344,14 +324,14 @@ const NvFielddropdown = class {
|
|
|
344
324
|
/****************************************************************************/
|
|
345
325
|
//#region RENDER
|
|
346
326
|
render() {
|
|
347
|
-
|
|
348
|
-
|
|
349
|
-
this.el.querySelector('[slot="
|
|
327
|
+
var _a;
|
|
328
|
+
return (index.h(index.Host, { key: '6c23d4cfd361e1f40a2181db66692eb0d6326bfe', role: "combobox", "aria-expanded": this.open.toString(), "aria-haspopup": "listbox", "aria-label": this.label }, (this.label || this.el.querySelector('[slot="label"]')) && (index.h("label", { key: 'db9a30ece9e669c70b18193b3cc7d14967a5e071', htmlFor: this.inputId }, index.h("slot", { key: 'b7a721b25b82646d34ce141526775f24a9849f4b', name: "label" }, this.label))), index.h("nv-popover", { key: '724756cb69b4b6ef8837e6f7f53a65eb42a43b5e', ref: el => (this.popoverElement = el), triggerMode: "controlled", placement: "bottom-start", open: this.open }, index.h("div", { key: '0092cd2b78234ec2e0cdc70433246a2985b7e57f', class: "input-wrapper", slot: "trigger" }, index.h("slot", { key: '519c1a407c8309861673b9eadb723edb0c70ae68', name: "before-input" }), index.h("div", { key: 'd88af43846337d9bfd6aeb4f28ab2dc7e56de4e8', class: "input-container", onClick: this.handleInputContainerClick }, index.h("slot", { key: '8e91459d89acbf7a1cde5e75c520b11b109e810d', name: "leading-input" }), this.filterable || this.disabled || this.readonly ? (index.h("input", { "data-scope": "focusable", id: this.inputId, type: "search", ref: e => (this.inputElement = e), autofocus: this.autofocus, autocomplete: this.autocomplete, placeholder: this.placeholder, name: this.name, value: this.getSelectedLabel(), required: this.required, disabled: this.disabled, readOnly: this.readonly, onInput: this.handleInput, onFocus: this.handleInputFocus, onClick: this.handleInputFocus, onKeyDown: this.handleKeyDown })) : (index.h("p", { "data-scope": "focusable", id: this.inputId, class: "non-filterable-text", onClick: this.handleInputContainerClick, tabIndex: this.disabled ? -1 : 0, onKeyDown: this.handleKeyDown, onFocus: this.handleInputFocus }, this.getSelectedLabel() || this.value || this.placeholder)), this.filterable && this.filterText && this.open && (index.h("nv-iconbutton", { key: '55efb1100997af6b9b4ee41c489a9e628d36b749', name: "x", size: "md", emphasis: "lower", class: "clear-button", onClick: this.clearFilter, "aria-label": "Clear input" })), this.error && (index.h("nv-icon", { key: '69cfcac7b21d0e9faf9bad7f306bab187a761758', name: "alert-circle", class: "validation", size: "md" })), index.h("nv-iconbutton", { key: '5b773edca6a5028eb8cedb42632a9c5b6e8b3d36', "data-scope": "toggle-dropdown", name: this.open ? 'chevron-top' : 'chevron-down', size: "md", emphasis: "lower", "aria-label": this.open ? 'Hide dropdown' : 'Show dropdown', "aria-pressed": this.open.toString(), onClick: this.togglePopover, tabIndex: this.disabled ? -1 : 0 })), index.h("slot", { key: 'c225279e1ec938e2fbe672ce02e8d2a79cb7ff1e', name: "after-input" })), index.h("div", { key: '94905d2f6a0b7faae17540139c0bd2458e4c98ae', slot: "content" }, ((_a = this.options) === null || _a === void 0 ? void 0 : _a.length) > 0 ? (index.h("ul", null, this.options.map(option => (index.h("nv-fielddropdownitem", { label: option.label, value: option.value, disabled: option.disabled, selected: option.value === this.value }))))) : (index.h("slot", { name: "content" })))), (this.description ||
|
|
329
|
+
this.el.querySelector('[slot="description"]')) && (index.h("div", { key: '5d0b74de616aefa056d17cb70fab0d36ab9b41c3', class: "description" }, index.h("slot", { key: 'bab9d8222164d2227c6024ac2bd5675142ccb964', name: "description" }, this.description))), (this.errorDescription ||
|
|
330
|
+
this.el.querySelector('[slot="error-description"]')) && (index.h("div", { key: '58596e0c753e8bb90f9d21432607427b0a029d64', hidden: !this.error, class: "error-description" }, index.h("slot", { key: '6062d632aee6e825cd2d17a22180cb24d66e2864', name: "error-description" }, this.errorDescription)))));
|
|
350
331
|
}
|
|
351
332
|
static get formAssociated() { return true; }
|
|
352
333
|
get el() { return index.getElement(this); }
|
|
353
334
|
static get watchers() { return {
|
|
354
|
-
"filterable": ["watchFilterableHandler"],
|
|
355
335
|
"value": ["watchValueHandler"],
|
|
356
336
|
"options": ["handleOptionsChange"]
|
|
357
337
|
}; }
|
package/dist/cjs/{nv-fielddropdownitem.entry-zwoGySum.js → nv-fielddropdownitem.entry-BVLVXi0e.js}
RENAMED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-Byv3Vmev.js');
|
|
4
4
|
require('react');
|
|
5
5
|
|
|
6
6
|
const nvFielddropdownitemCss = "nv-fielddropdownitem{display:flex;gap:var(--spacing-2);flex-wrap:wrap;align-items:center;width:100%;padding:var(--list-dropdown-item-padding-y) var(--list-dropdown-item-padding-x);font-weight:var(--menu-contextual-item-font-weight);font-size:var(--list-dropdown-font-size);line-height:var(--list-dropdown-line-height);color:var(--components-list-dropdown-item-label-default);border-radius:var(--list-dropdown-item-radius);transition:background-color 150ms ease-out, color 150ms ease-out;cursor:pointer}nv-fielddropdownitem:hover,nv-fielddropdownitem:focus,nv-fielddropdownitem:focus-within{background-color:var(--components-list-dropdown-item-background-hover);color:var(--components-menu-contextual-item-content-hover)}nv-fielddropdownitem[disabled]:not([disabled=false]){cursor:not-allowed;background-color:unset;color:var(--components-menu-contextual-item-content-disabled)}nv-fielddropdownitem .text-wrapper{display:flex;flex-grow:1;align-items:center;justify-content:space-between}nv-fielddropdownitem [data-scope=text]{flex-grow:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}nv-fielddropdownitem nv-icon[data-scope=selected]{color:var(--components-list-dropdown-item-label-default);align-self:center;margin-left:auto}";
|
|
@@ -59,7 +59,7 @@ const NvFielddropdownitem = class {
|
|
|
59
59
|
/****************************************************************************/
|
|
60
60
|
//#region RENDER
|
|
61
61
|
render() {
|
|
62
|
-
return (index.h(index.Host, { key: '
|
|
62
|
+
return (index.h(index.Host, { key: '86699901e52c35392ae5e60013f542427973a626', role: "menuitem", tabindex: '-1', onClick: this.handleSelected }, index.h("slot", { key: 'f2d893f0692821fc0e918da9283eb174c3429173' }), !this.composed && (index.h("div", { key: '5e62842ee3b0e79333f99a3ec8d92dd843ebd96e', class: "text-wrapper" }, index.h("span", { key: 'baa00ac59b5d85d912f34fc16fbf82d87af849e2', "data-scope": "text" }, this.label))), this.selected && (index.h("nv-icon", { key: 'f9a5082e4cee6b68531809f9861e3da83b3001d6', name: "check", "aria-hidden": "true", "data-scope": "selected" }))));
|
|
63
63
|
}
|
|
64
64
|
get el() { return index.getElement(this); }
|
|
65
65
|
};
|