@nova-design-system/nova-webcomponents 3.9.1 → 3.10.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/{constants-8fb8ccc0.js → constants-3b6beb66.js} +15 -1
- package/dist/cjs/constants-3b6beb66.js.map +1 -0
- package/dist/cjs/index-c56424e5.js +12 -0
- package/dist/cjs/index.cjs.js +7 -1
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/native.cjs.js +1 -1
- package/dist/cjs/nv-accordion-item.cjs.entry.js +1 -1
- package/dist/cjs/nv-accordion-item.cjs.entry.js.map +1 -1
- package/dist/cjs/nv-alert.cjs.entry.js +2 -2
- package/dist/cjs/nv-alert.cjs.entry.js.map +1 -1
- package/dist/cjs/nv-avatar.cjs.entry.js +1 -1
- package/dist/cjs/nv-badge_2.cjs.entry.js +2 -2
- package/dist/cjs/nv-badge_2.cjs.entry.js.map +1 -1
- package/dist/cjs/nv-breadcrumb.cjs.entry.js +1 -1
- package/dist/cjs/nv-breadcrumb.cjs.entry.js.map +1 -1
- package/dist/cjs/nv-button.cjs.entry.js +2 -2
- package/dist/cjs/nv-button.cjs.entry.js.map +1 -1
- package/dist/cjs/nv-buttongroup.cjs.entry.js +198 -0
- package/dist/cjs/nv-buttongroup.cjs.entry.js.map +1 -0
- package/dist/cjs/nv-calendar.cjs.entry.js +114 -37
- package/dist/cjs/nv-calendar.cjs.entry.js.map +1 -1
- package/dist/cjs/nv-col.cjs.entry.js +1 -1
- package/dist/cjs/nv-datagrid.cjs.entry.js +4 -4
- package/dist/cjs/nv-datagrid.cjs.entry.js.map +1 -1
- package/dist/cjs/nv-datagridcolumn.cjs.entry.js +1 -1
- package/dist/cjs/nv-dialog.cjs.entry.js +2 -2
- package/dist/cjs/nv-dialogfooter_2.cjs.entry.js +3 -3
- package/dist/cjs/nv-fieldcheckbox.cjs.entry.js +5 -5
- package/dist/cjs/nv-fieldcheckbox.cjs.entry.js.map +1 -1
- package/dist/cjs/nv-fielddate.cjs.entry.js +6 -6
- package/dist/cjs/nv-fielddaterange.cjs.entry.js +6 -6
- package/dist/cjs/nv-fielddropdown.cjs.entry.js +3 -3
- package/dist/cjs/nv-fielddropdownitem.cjs.entry.js +1 -1
- package/dist/cjs/nv-fieldmultiselect.cjs.entry.js +377 -27
- package/dist/cjs/nv-fieldmultiselect.cjs.entry.js.map +1 -1
- package/dist/cjs/nv-fieldnumber.cjs.entry.js +3 -3
- package/dist/cjs/nv-fieldpassword.cjs.entry.js +3 -3
- package/dist/cjs/nv-fieldradio.cjs.entry.js +4 -4
- package/dist/cjs/nv-fieldradio.cjs.entry.js.map +1 -1
- package/dist/cjs/nv-fieldselect.cjs.entry.js +5 -5
- package/dist/cjs/nv-fieldslider.cjs.entry.js +3 -3
- package/dist/cjs/nv-fieldtext.cjs.entry.js +3 -3
- package/dist/cjs/nv-fieldtextarea.cjs.entry.js +3 -3
- package/dist/cjs/nv-fieldtime.cjs.entry.js +10 -10
- package/dist/cjs/nv-icon.cjs.entry.js +3 -3
- package/dist/cjs/nv-icon.cjs.entry.js.map +1 -1
- package/dist/cjs/nv-iconbutton_2.cjs.entry.js +3 -3
- package/dist/cjs/nv-iconbutton_2.cjs.entry.js.map +1 -1
- package/dist/cjs/nv-menu.cjs.entry.js +1 -1
- package/dist/cjs/nv-menuitem.cjs.entry.js +1 -1
- package/dist/cjs/nv-popover.cjs.entry.js +1 -1
- package/dist/cjs/nv-row.cjs.entry.js +1 -1
- package/dist/cjs/nv-stack.cjs.entry.js +1 -1
- package/dist/cjs/nv-table.cjs.entry.js +2 -2
- package/dist/cjs/nv-toggle.cjs.entry.js +3 -3
- package/dist/cjs/nv-toggle.cjs.entry.js.map +1 -1
- package/dist/cjs/nv-togglebutton.cjs.entry.js +58 -0
- package/dist/cjs/nv-togglebutton.cjs.entry.js.map +1 -0
- package/dist/cjs/nv-togglebuttongroup.cjs.entry.js +172 -0
- package/dist/cjs/nv-togglebuttongroup.cjs.entry.js.map +1 -0
- package/dist/cjs/nv-tooltip.cjs.entry.js +1 -1
- package/dist/collection/collection-manifest.json +3 -0
- package/dist/collection/components/nv-accordion-item/nv-accordion-item.js +1 -1
- package/dist/collection/components/nv-accordion-item/nv-accordion-item.js.map +1 -1
- package/dist/collection/components/nv-alert/nv-alert.css +5 -0
- package/dist/collection/components/nv-badge/nv-badge.css +21 -0
- package/dist/collection/components/nv-breadcrumb/nv-breadcrumb.css +2 -0
- package/dist/collection/components/nv-button/styles/nv-button.css +8 -0
- package/dist/collection/components/nv-buttongroup/nv-buttongroup.docs.js +43 -0
- package/dist/collection/components/nv-buttongroup/nv-buttongroup.docs.js.map +1 -0
- package/dist/collection/components/nv-buttongroup/nv-buttongroup.js +217 -0
- package/dist/collection/components/nv-buttongroup/nv-buttongroup.js.map +1 -0
- package/dist/collection/components/nv-buttongroup/nv-buttongroup.utils.js +86 -0
- package/dist/collection/components/nv-buttongroup/nv-buttongroup.utils.js.map +1 -0
- package/dist/collection/components/nv-buttongroup/styles/nv-buttongroup.css +73 -0
- package/dist/collection/components/nv-buttongroup/test/nv-buttongroup.utils.test.js +312 -0
- package/dist/collection/components/nv-buttongroup/test/nv-buttongroup.utils.test.js.map +1 -0
- package/dist/collection/components/nv-calendar/nv-calendar.css +9 -0
- package/dist/collection/components/nv-calendar/nv-calendar.js +37 -24
- package/dist/collection/components/nv-calendar/nv-calendar.js.map +1 -1
- package/dist/collection/components/nv-calendar/nv-calendar.utils.js +68 -0
- package/dist/collection/components/nv-calendar/nv-calendar.utils.js.map +1 -1
- package/dist/collection/components/nv-calendar/partials/calendar-grid.js +5 -3
- package/dist/collection/components/nv-calendar/partials/calendar-grid.js.map +1 -1
- package/dist/collection/components/nv-calendar/partials/day-cell.js +4 -9
- package/dist/collection/components/nv-calendar/partials/day-cell.js.map +1 -1
- package/dist/collection/components/nv-col/nv-col.js +1 -1
- package/dist/collection/components/nv-datagrid/nv-datagrid.css +1 -0
- package/dist/collection/components/nv-datagrid/nv-datagrid.js +2 -2
- package/dist/collection/components/nv-datagridcolumn/nv-datagridcolumn.js +1 -1
- package/dist/collection/components/nv-dialog/nv-dialog.js +1 -1
- package/dist/collection/components/nv-dialogfooter/nv-dialogfooter.js +1 -1
- package/dist/collection/components/nv-dialogheader/nv-dialogheader.js +1 -1
- package/dist/collection/components/nv-fieldcheckbox/nv-fieldcheckbox.css +1 -0
- package/dist/collection/components/nv-fieldcheckbox/nv-fieldcheckbox.js +4 -4
- package/dist/collection/components/nv-fielddate/nv-fielddate.js +6 -6
- package/dist/collection/components/nv-fielddaterange/nv-fielddaterange.js +6 -6
- package/dist/collection/components/nv-fielddropdown/nv-fielddropdown.js +3 -3
- package/dist/collection/components/nv-fielddropdownitem/nv-fielddropdownitem.js +1 -1
- package/dist/collection/components/nv-fielddropdownitemcheck/nv-fielddropdownitemcheck.js +1 -1
- package/dist/collection/components/nv-fielddropdownitemcheck/nv-fielddropdownitemcheck.js.map +1 -1
- package/dist/collection/components/nv-fieldmultiselect/nv-fieldmultiselect.docs.js +885 -122
- package/dist/collection/components/nv-fieldmultiselect/nv-fieldmultiselect.docs.js.map +1 -1
- package/dist/collection/components/nv-fieldmultiselect/nv-fieldmultiselect.js +561 -89
- package/dist/collection/components/nv-fieldmultiselect/nv-fieldmultiselect.js.map +1 -1
- package/dist/collection/components/nv-fieldmultiselect/styles/nv-fieldmultiselect.css +70 -16
- package/dist/collection/components/nv-fieldnumber/nv-fieldnumber.js +3 -3
- package/dist/collection/components/nv-fieldpassword/nv-fieldpassword.js +3 -3
- package/dist/collection/components/nv-fieldradio/nv-fieldradio.css +1 -0
- package/dist/collection/components/nv-fieldradio/nv-fieldradio.js +3 -3
- package/dist/collection/components/nv-fieldselect/nv-fieldselect.js +5 -5
- package/dist/collection/components/nv-fieldslider/nv-fieldslider.js +3 -3
- package/dist/collection/components/nv-fieldtext/nv-fieldtext.js +3 -3
- package/dist/collection/components/nv-fieldtextarea/nv-fieldtextarea.js +3 -3
- package/dist/collection/components/nv-fieldtime/nv-fieldtime.js +9 -9
- package/dist/collection/components/nv-icon/nv-icon.js +1 -1
- package/dist/collection/components/nv-icon/nv-icons.js +6 -0
- package/dist/collection/components/nv-icon/nv-icons.js.map +1 -1
- package/dist/collection/components/nv-iconbutton/nv-iconbutton.css +4 -0
- package/dist/collection/components/nv-iconbutton/nv-iconbutton.js +1 -1
- package/dist/collection/components/nv-loader/nv-loader.js +1 -1
- package/dist/collection/components/nv-menu/nv-menu.js +1 -1
- package/dist/collection/components/nv-menuitem/nv-menuitem.js +2 -2
- package/dist/collection/components/nv-popover/nv-popover.js +1 -1
- package/dist/collection/components/nv-row/nv-row.js +1 -1
- package/dist/collection/components/nv-stack/nv-stack.js +1 -1
- package/dist/collection/components/nv-table/nv-table.js +2 -2
- package/dist/collection/components/nv-toggle/nv-toggle.css +1 -0
- package/dist/collection/components/nv-toggle/nv-toggle.js +2 -2
- package/dist/collection/components/nv-togglebutton/nv-togglebutton.docs.js +6 -0
- package/dist/collection/components/nv-togglebutton/nv-togglebutton.docs.js.map +1 -0
- package/dist/collection/components/nv-togglebutton/nv-togglebutton.js +191 -0
- package/dist/collection/components/nv-togglebutton/nv-togglebutton.js.map +1 -0
- package/dist/collection/components/nv-togglebutton/styles/nv-togglebutton.css +135 -0
- package/dist/collection/components/nv-togglebuttongroup/nv-togglebuttongroup.docs.js +56 -0
- package/dist/collection/components/nv-togglebuttongroup/nv-togglebuttongroup.docs.js.map +1 -0
- package/dist/collection/components/nv-togglebuttongroup/nv-togglebuttongroup.js +324 -0
- package/dist/collection/components/nv-togglebuttongroup/nv-togglebuttongroup.js.map +1 -0
- package/dist/collection/components/nv-togglebuttongroup/styles/nv-togglebuttongroup.css +45 -0
- package/dist/collection/components/nv-tooltip/nv-tooltip.js +1 -1
- package/dist/collection/utils/constants.js +12 -0
- package/dist/collection/utils/constants.js.map +1 -1
- package/dist/components/index.js +7 -1
- package/dist/components/index.js.map +1 -1
- package/dist/components/nv-accordion-item.js +1 -1
- package/dist/components/nv-accordion.js +4 -4
- package/dist/components/nv-alert.js +3 -3
- package/dist/components/nv-alert.js.map +1 -1
- package/dist/components/nv-avatar.js +2 -2
- package/dist/components/nv-badge.js +1 -1
- package/dist/components/nv-breadcrumb.js +3 -3
- package/dist/components/nv-breadcrumb.js.map +1 -1
- package/dist/components/nv-button.js +1 -1
- package/dist/components/nv-buttongroup.d.ts +11 -0
- package/dist/components/nv-buttongroup.js +221 -0
- package/dist/components/nv-buttongroup.js.map +1 -0
- package/dist/components/nv-calendar.js +1 -1
- package/dist/components/nv-col.js +1 -1
- package/dist/components/nv-datagrid.js +6 -6
- package/dist/components/nv-datagrid.js.map +1 -1
- package/dist/components/nv-datagridcolumn.js +1 -1
- package/dist/components/nv-dialog.js +7 -7
- package/dist/components/nv-dialogfooter.js +1 -1
- package/dist/components/nv-dialogheader.js +1 -1
- package/dist/components/nv-fieldcheckbox.js +1 -1
- package/dist/components/nv-fielddate.js +12 -12
- package/dist/components/nv-fielddaterange.js +12 -12
- package/dist/components/nv-fielddropdown.js +8 -8
- package/dist/components/nv-fielddropdownitem.js +1 -1
- package/dist/components/nv-fielddropdownitemcheck.js +1 -1
- package/dist/components/nv-fieldmultiselect.js +399 -41
- package/dist/components/nv-fieldmultiselect.js.map +1 -1
- package/dist/components/nv-fieldnumber.js +1 -1
- package/dist/components/nv-fieldpassword.js +6 -6
- package/dist/components/nv-fieldradio.js +4 -4
- package/dist/components/nv-fieldradio.js.map +1 -1
- package/dist/components/nv-fieldselect.js +8 -8
- package/dist/components/nv-fieldslider.js +7 -7
- package/dist/components/nv-fieldtext.js +1 -1
- package/dist/components/nv-fieldtextarea.js +3 -3
- package/dist/components/nv-fieldtime.js +14 -14
- package/dist/components/nv-icon.js +1 -1
- package/dist/components/nv-iconbutton.js +1 -1
- package/dist/components/nv-loader.js +1 -1
- package/dist/components/nv-menu.js +4 -4
- package/dist/components/nv-menuitem.js +1 -1
- package/dist/components/nv-popover.js +1 -1
- package/dist/components/nv-row.js +1 -1
- package/dist/components/nv-stack.js +1 -1
- package/dist/components/nv-table.js +2 -2
- package/dist/components/nv-toggle.js +3 -3
- package/dist/components/nv-toggle.js.map +1 -1
- package/dist/components/nv-togglebutton.d.ts +11 -0
- package/dist/components/nv-togglebutton.js +78 -0
- package/dist/components/nv-togglebutton.js.map +1 -0
- package/dist/components/nv-togglebuttongroup.d.ts +11 -0
- package/dist/components/nv-togglebuttongroup.js +196 -0
- package/dist/components/nv-togglebuttongroup.js.map +1 -0
- package/dist/components/nv-tooltip.js +1 -1
- package/dist/components/{p-68ff562f.js → p-0ffb4785.js} +5 -5
- package/dist/components/{p-68ff562f.js.map → p-0ffb4785.js.map} +1 -1
- package/dist/components/{p-8067d283.js → p-195f46f3.js} +2 -2
- package/dist/components/{p-8067d283.js.map → p-195f46f3.js.map} +1 -1
- package/dist/components/{p-e4e1a926.js → p-1bb737fa.js} +3 -3
- package/dist/components/{p-e4e1a926.js.map → p-1bb737fa.js.map} +1 -1
- package/dist/components/{p-db4ba1d9.js → p-2db5d1ab.js} +7 -7
- package/dist/components/{p-db4ba1d9.js.map → p-2db5d1ab.js.map} +1 -1
- package/dist/components/{p-ba87d9d5.js → p-2ef4fb88.js} +3 -3
- package/dist/components/{p-ba87d9d5.js.map → p-2ef4fb88.js.map} +1 -1
- package/dist/components/{p-f1df2634.js → p-32e8e42e.js} +2 -2
- package/dist/components/{p-f1df2634.js.map → p-32e8e42e.js.map} +1 -1
- package/dist/components/{p-6de6866c.js → p-45a625fb.js} +6 -6
- package/dist/components/{p-6de6866c.js.map → p-45a625fb.js.map} +1 -1
- package/dist/components/{p-025b8a78.js → p-50d0db7b.js} +5 -5
- package/dist/components/{p-025b8a78.js.map → p-50d0db7b.js.map} +1 -1
- package/dist/components/{p-ed6686a1.js → p-51876ca1.js} +2 -2
- package/dist/components/{p-ed6686a1.js.map → p-51876ca1.js.map} +1 -1
- package/dist/components/{p-e104c58a.js → p-51a156ff.js} +3 -3
- package/dist/components/p-51a156ff.js.map +1 -0
- package/dist/components/p-8011513c.js +189 -0
- package/dist/components/{p-60064345.js.map → p-8011513c.js.map} +1 -1
- package/dist/components/{p-82e5674c.js → p-8aee1010.js} +116 -38
- package/dist/components/p-8aee1010.js.map +1 -0
- package/dist/components/{p-79e6b6a2.js → p-9fdaea9a.js} +5 -5
- package/dist/components/p-9fdaea9a.js.map +1 -0
- package/dist/components/{p-6460318d.js → p-a1fe0a5d.js} +4 -4
- package/dist/components/p-a1fe0a5d.js.map +1 -0
- package/dist/components/{p-1f505531.js → p-a3ddec4c.js} +15 -1
- package/dist/components/p-a3ddec4c.js.map +1 -0
- package/dist/components/{p-0143cee0.js → p-a5002d14.js} +6 -6
- package/dist/components/{p-0143cee0.js.map → p-a5002d14.js.map} +1 -1
- package/dist/components/{p-30f970c3.js → p-b659b999.js} +3 -3
- package/dist/components/{p-30f970c3.js.map → p-b659b999.js.map} +1 -1
- package/dist/components/{p-5d5668f0.js → p-cf06032d.js} +4 -4
- package/dist/components/{p-5d5668f0.js.map → p-cf06032d.js.map} +1 -1
- package/dist/components/{p-dfd2d4f0.js → p-fda58a76.js} +2 -2
- package/dist/components/{p-dfd2d4f0.js.map → p-fda58a76.js.map} +1 -1
- package/dist/esm/{constants-4faa1fae.js → constants-23aaef7b.js} +15 -1
- package/dist/esm/constants-23aaef7b.js.map +1 -0
- package/dist/esm/index-a1936cd0.js +12 -0
- package/dist/esm/index.js +7 -1
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/native.js +1 -1
- package/dist/esm/nv-accordion-item.entry.js +1 -1
- package/dist/esm/nv-accordion-item.entry.js.map +1 -1
- package/dist/esm/nv-alert.entry.js +2 -2
- package/dist/esm/nv-alert.entry.js.map +1 -1
- package/dist/esm/nv-avatar.entry.js +1 -1
- package/dist/esm/nv-badge_2.entry.js +2 -2
- package/dist/esm/nv-badge_2.entry.js.map +1 -1
- package/dist/esm/nv-breadcrumb.entry.js +1 -1
- package/dist/esm/nv-breadcrumb.entry.js.map +1 -1
- package/dist/esm/nv-button.entry.js +2 -2
- package/dist/esm/nv-button.entry.js.map +1 -1
- package/dist/esm/nv-buttongroup.entry.js +194 -0
- package/dist/esm/nv-buttongroup.entry.js.map +1 -0
- package/dist/esm/nv-calendar.entry.js +114 -37
- package/dist/esm/nv-calendar.entry.js.map +1 -1
- package/dist/esm/nv-col.entry.js +1 -1
- package/dist/esm/nv-datagrid.entry.js +4 -4
- package/dist/esm/nv-datagrid.entry.js.map +1 -1
- package/dist/esm/nv-datagridcolumn.entry.js +1 -1
- package/dist/esm/nv-dialog.entry.js +2 -2
- package/dist/esm/nv-dialogfooter_2.entry.js +3 -3
- package/dist/esm/nv-fieldcheckbox.entry.js +5 -5
- package/dist/esm/nv-fieldcheckbox.entry.js.map +1 -1
- package/dist/esm/nv-fielddate.entry.js +6 -6
- package/dist/esm/nv-fielddaterange.entry.js +6 -6
- package/dist/esm/nv-fielddropdown.entry.js +3 -3
- package/dist/esm/nv-fielddropdownitem.entry.js +1 -1
- package/dist/esm/nv-fieldmultiselect.entry.js +378 -28
- package/dist/esm/nv-fieldmultiselect.entry.js.map +1 -1
- package/dist/esm/nv-fieldnumber.entry.js +3 -3
- package/dist/esm/nv-fieldpassword.entry.js +3 -3
- package/dist/esm/nv-fieldradio.entry.js +4 -4
- package/dist/esm/nv-fieldradio.entry.js.map +1 -1
- package/dist/esm/nv-fieldselect.entry.js +5 -5
- package/dist/esm/nv-fieldslider.entry.js +3 -3
- package/dist/esm/nv-fieldtext.entry.js +3 -3
- package/dist/esm/nv-fieldtextarea.entry.js +3 -3
- package/dist/esm/nv-fieldtime.entry.js +10 -10
- package/dist/esm/nv-icon.entry.js +3 -3
- package/dist/esm/nv-icon.entry.js.map +1 -1
- package/dist/esm/nv-iconbutton_2.entry.js +3 -3
- package/dist/esm/nv-iconbutton_2.entry.js.map +1 -1
- package/dist/esm/nv-menu.entry.js +1 -1
- package/dist/esm/nv-menuitem.entry.js +1 -1
- package/dist/esm/nv-popover.entry.js +1 -1
- package/dist/esm/nv-row.entry.js +1 -1
- package/dist/esm/nv-stack.entry.js +1 -1
- package/dist/esm/nv-table.entry.js +2 -2
- package/dist/esm/nv-toggle.entry.js +3 -3
- package/dist/esm/nv-toggle.entry.js.map +1 -1
- package/dist/esm/nv-togglebutton.entry.js +54 -0
- package/dist/esm/nv-togglebutton.entry.js.map +1 -0
- package/dist/esm/nv-togglebuttongroup.entry.js +168 -0
- package/dist/esm/nv-togglebuttongroup.entry.js.map +1 -0
- package/dist/esm/nv-tooltip.entry.js +1 -1
- package/dist/native/index.esm.js +1 -1
- package/dist/native/index.esm.js.map +1 -1
- package/dist/native/native.css +1 -1
- package/dist/native/native.esm.js +1 -1
- package/dist/native/native.esm.js.map +1 -1
- package/dist/native/{p-2a6783ca.entry.js → p-0da8f0d1.entry.js} +2 -2
- package/dist/native/{p-2a6783ca.entry.js.map → p-0da8f0d1.entry.js.map} +1 -1
- package/dist/native/p-0ef94dae.entry.js +2 -0
- package/dist/native/{p-1ad1bff9.entry.js.map → p-0ef94dae.entry.js.map} +1 -1
- package/dist/native/p-13032ec1.entry.js +2 -0
- package/dist/native/p-13032ec1.entry.js.map +1 -0
- package/dist/native/p-184032cb.entry.js +2 -0
- package/dist/native/{p-a73fa60a.entry.js.map → p-184032cb.entry.js.map} +1 -1
- package/dist/native/p-2197ffdf.entry.js +2 -0
- package/dist/native/{p-fa81b77f.entry.js.map → p-2197ffdf.entry.js.map} +1 -1
- package/dist/native/p-234cfa2e.entry.js +2 -0
- package/dist/native/p-2a3325fb.entry.js +2 -0
- package/dist/native/p-2a3325fb.entry.js.map +1 -0
- package/dist/native/{p-3f139780.entry.js → p-2d647761.entry.js} +2 -2
- package/dist/native/{p-ff248eb8.entry.js → p-348c6bb4.entry.js} +2 -2
- package/dist/native/p-397c0fca.entry.js +2 -0
- package/dist/native/{p-51a57a3a.entry.js.map → p-397c0fca.entry.js.map} +1 -1
- package/dist/native/{p-55cd3d62.entry.js → p-3da64006.entry.js} +2 -2
- package/dist/native/p-3ed84cd9.entry.js +2 -0
- package/dist/native/{p-fcd52432.entry.js.map → p-3ed84cd9.entry.js.map} +1 -1
- package/dist/native/{p-3ff7a912.entry.js → p-3fcaac6d.entry.js} +2 -2
- package/dist/native/{p-b7ec9a1b.entry.js → p-4302824a.entry.js} +2 -2
- package/dist/native/p-43071c3b.entry.js +2 -0
- package/dist/native/p-44dd9a4c.entry.js +2 -0
- package/dist/native/p-44dd9a4c.entry.js.map +1 -0
- package/dist/native/p-464bb197.entry.js +2 -0
- package/dist/native/p-464bb197.entry.js.map +1 -0
- package/dist/native/{p-916acbd3.entry.js → p-49504fd6.entry.js} +2 -2
- package/dist/native/{p-bc77cac1.entry.js → p-553778e6.entry.js} +2 -2
- package/dist/native/p-553778e6.entry.js.map +1 -0
- package/dist/native/{p-bee62b2b.entry.js → p-5f0776cb.entry.js} +2 -2
- package/dist/native/p-62032cd9.entry.js +2 -0
- package/dist/native/p-62032cd9.entry.js.map +1 -0
- package/dist/native/{p-11012998.entry.js → p-676447d7.entry.js} +3 -3
- package/dist/native/{p-16ef7dd4.entry.js → p-681f2bac.entry.js} +2 -2
- package/dist/native/{p-4b15cff3.entry.js → p-7f0d576b.entry.js} +2 -2
- package/dist/native/{p-68edb2e8.entry.js → p-85f8f11a.entry.js} +2 -2
- package/dist/native/{p-0e005d95.entry.js → p-888ad58e.entry.js} +2 -2
- package/dist/native/{p-34bf336f.entry.js → p-92931ab8.entry.js} +2 -2
- package/dist/native/{p-f00a4552.entry.js → p-94dc9c41.entry.js} +2 -2
- package/dist/native/{p-85a54ef2.entry.js → p-9c5d6827.entry.js} +2 -2
- package/dist/native/{p-08452012.entry.js → p-9f451b8a.entry.js} +3 -3
- package/dist/native/{p-08452012.entry.js.map → p-9f451b8a.entry.js.map} +1 -1
- package/dist/native/{p-1f932a4b.entry.js → p-aacd8789.entry.js} +2 -2
- package/dist/native/p-ac5496e7.entry.js +2 -0
- package/dist/native/{p-9ea3d30d.entry.js → p-ad2cc829.entry.js} +2 -2
- package/dist/native/p-b2442d4b.entry.js +2 -0
- package/dist/native/{p-a36dc25a.entry.js.map → p-b2442d4b.entry.js.map} +1 -1
- package/dist/native/{p-67c34b8c.entry.js → p-b58fb522.entry.js} +2 -2
- package/dist/native/p-ba9906b7.entry.js +2 -0
- package/dist/native/{p-64cb38e6.entry.js.map → p-ba9906b7.entry.js.map} +1 -1
- package/dist/native/{p-f540db71.entry.js → p-dd023fd6.entry.js} +2 -2
- package/dist/native/p-f033c4ce.entry.js +2 -0
- package/dist/native/p-f033c4ce.entry.js.map +1 -0
- package/dist/native/{p-051db87c.entry.js → p-fb672f90.entry.js} +2 -2
- package/dist/native/p-fc9564b3.js +2 -0
- package/dist/native/p-fc9564b3.js.map +1 -0
- package/dist/types/components/nv-buttongroup/nv-buttongroup.d.ts +50 -0
- package/dist/types/components/nv-buttongroup/nv-buttongroup.docs.d.ts +4 -0
- package/dist/types/components/nv-buttongroup/nv-buttongroup.utils.d.ts +25 -0
- package/dist/types/components/nv-buttongroup/test/nv-buttongroup.utils.test.d.ts +1 -0
- package/dist/types/components/nv-calendar/nv-calendar.d.ts +11 -1
- package/dist/types/components/nv-calendar/nv-calendar.utils.d.ts +31 -0
- package/dist/types/components/nv-calendar/partials/calendar-grid.d.ts +11 -1
- package/dist/types/components/nv-calendar/partials/day-cell.d.ts +7 -1
- package/dist/types/components/nv-fieldmultiselect/nv-fieldmultiselect.d.ts +116 -23
- package/dist/types/components/nv-icon/nv-icons.d.ts +1 -1
- package/dist/types/components/nv-togglebutton/nv-togglebutton.d.ts +46 -0
- package/dist/types/components/nv-togglebutton/nv-togglebutton.docs.d.ts +4 -0
- package/dist/types/components/nv-togglebuttongroup/nv-togglebuttongroup.d.ts +80 -0
- package/dist/types/components/nv-togglebuttongroup/nv-togglebuttongroup.docs.d.ts +4 -0
- package/dist/types/components.d.ts +289 -2
- package/dist/types/utils/constants.d.ts +10 -0
- package/dist/vscode-data.json +189 -0
- package/hydrate/index.js +1058 -154
- package/hydrate/index.mjs +1058 -154
- package/package.json +14 -2
- package/dist/cjs/constants-8fb8ccc0.js.map +0 -1
- package/dist/components/p-1f505531.js.map +0 -1
- package/dist/components/p-60064345.js +0 -189
- package/dist/components/p-6460318d.js.map +0 -1
- package/dist/components/p-79e6b6a2.js.map +0 -1
- package/dist/components/p-82e5674c.js.map +0 -1
- package/dist/components/p-e104c58a.js.map +0 -1
- package/dist/esm/constants-4faa1fae.js.map +0 -1
- package/dist/native/p-10ce53ea.entry.js +0 -2
- package/dist/native/p-1ad1bff9.entry.js +0 -2
- package/dist/native/p-4a533dd8.entry.js +0 -2
- package/dist/native/p-4a533dd8.entry.js.map +0 -1
- package/dist/native/p-51a57a3a.entry.js +0 -2
- package/dist/native/p-64cb38e6.entry.js +0 -2
- package/dist/native/p-73c08f3b.entry.js +0 -2
- package/dist/native/p-73c08f3b.entry.js.map +0 -1
- package/dist/native/p-a36dc25a.entry.js +0 -2
- package/dist/native/p-a50f3850.entry.js +0 -2
- package/dist/native/p-a73fa60a.entry.js +0 -2
- package/dist/native/p-b3f9db23.entry.js +0 -2
- package/dist/native/p-b3f9db23.entry.js.map +0 -1
- package/dist/native/p-bc77cac1.entry.js.map +0 -1
- package/dist/native/p-e2d0a77d.js +0 -2
- package/dist/native/p-e2d0a77d.js.map +0 -1
- package/dist/native/p-ec92ee7a.entry.js +0 -2
- package/dist/native/p-fa81b77f.entry.js +0 -2
- package/dist/native/p-fcd52432.entry.js +0 -2
- /package/dist/native/{p-ec92ee7a.entry.js.map → p-234cfa2e.entry.js.map} +0 -0
- /package/dist/native/{p-3f139780.entry.js.map → p-2d647761.entry.js.map} +0 -0
- /package/dist/native/{p-ff248eb8.entry.js.map → p-348c6bb4.entry.js.map} +0 -0
- /package/dist/native/{p-55cd3d62.entry.js.map → p-3da64006.entry.js.map} +0 -0
- /package/dist/native/{p-3ff7a912.entry.js.map → p-3fcaac6d.entry.js.map} +0 -0
- /package/dist/native/{p-b7ec9a1b.entry.js.map → p-4302824a.entry.js.map} +0 -0
- /package/dist/native/{p-10ce53ea.entry.js.map → p-43071c3b.entry.js.map} +0 -0
- /package/dist/native/{p-916acbd3.entry.js.map → p-49504fd6.entry.js.map} +0 -0
- /package/dist/native/{p-bee62b2b.entry.js.map → p-5f0776cb.entry.js.map} +0 -0
- /package/dist/native/{p-11012998.entry.js.map → p-676447d7.entry.js.map} +0 -0
- /package/dist/native/{p-16ef7dd4.entry.js.map → p-681f2bac.entry.js.map} +0 -0
- /package/dist/native/{p-4b15cff3.entry.js.map → p-7f0d576b.entry.js.map} +0 -0
- /package/dist/native/{p-68edb2e8.entry.js.map → p-85f8f11a.entry.js.map} +0 -0
- /package/dist/native/{p-0e005d95.entry.js.map → p-888ad58e.entry.js.map} +0 -0
- /package/dist/native/{p-34bf336f.entry.js.map → p-92931ab8.entry.js.map} +0 -0
- /package/dist/native/{p-f00a4552.entry.js.map → p-94dc9c41.entry.js.map} +0 -0
- /package/dist/native/{p-85a54ef2.entry.js.map → p-9c5d6827.entry.js.map} +0 -0
- /package/dist/native/{p-1f932a4b.entry.js.map → p-aacd8789.entry.js.map} +0 -0
- /package/dist/native/{p-a50f3850.entry.js.map → p-ac5496e7.entry.js.map} +0 -0
- /package/dist/native/{p-9ea3d30d.entry.js.map → p-ad2cc829.entry.js.map} +0 -0
- /package/dist/native/{p-67c34b8c.entry.js.map → p-b58fb522.entry.js.map} +0 -0
- /package/dist/native/{p-f540db71.entry.js.map → p-dd023fd6.entry.js.map} +0 -0
- /package/dist/native/{p-051db87c.entry.js.map → p-fb672f90.entry.js.map} +0 -0
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as e,c as r,h as t,H as i,g as n}from"./p-d0a33e64.js";import{I as a}from"./p-53aa81dd.js";import{v as o}from"./p-f5ff676c.js";import"./p-0462f723.js";const s='nv-fieldslider .slider-container .track-container:has(.thumb:hover) .track-range{background:var(--components-slider-track-filled-hover)}nv-fieldslider .slider-container .track-container:has(.thumb:hover) .thumb{border-color:var(--components-slider-track-filled-hover)}nv-fieldslider .slider-container .track-container:has(.thumb:focus) .track-range{background:var(--components-slider-track-filled-focus)}nv-fieldslider .slider-container .track-container:has(.thumb:focus) .thumb{border-color:var(--components-slider-track-filled-focus)}nv-fieldslider[error] .slider-container .track-container .track .track-range{background:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container .track .thumb{border-color:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container .track .thumb:hover{border-color:var(--components-slider-track-filled-error);outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-slider-track-filled-error);outline-offset:calc(var(--focus-outline-offset) * 1);background-color:var(--components-slider-handler-background-error)}nv-fieldslider[error] .slider-container .track-container .track .thumb:focus{border-color:var(--components-slider-track-filled-error);outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-slider-track-filled-error);outline-offset:calc(var(--focus-outline-offset) * 1);background-color:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container:has(.thumb:hover) .track-range{background:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container:has(.thumb:hover) .thumb{border-color:var(--components-slider-track-filled-error)}nv-fielddaterange{--nv-field-border-default:var(--components-form-field-border-default);--nv-field-border-hover:var(--components-form-field-border-hover);--nv-field-border-focus:var(--components-form-field-border-focus);--nv-field-border-disabled:var(--components-form-field-border-default);--nv-field-border-readonly:var(--components-form-field-border-default);--nv-field-focus-box-shadow:var(--color-focus-brand);--nv-field-background:var(--components-form-field-background-default);display:flex;flex-direction:column;align-items:flex-start;gap:var(--form-gap-y);box-sizing:border-box;max-width:480px}nv-fielddaterange[fluid]:not([fluid=false]){max-width:unset}nv-fielddaterange[readonly]:not([readonly=false]){--nv-field-border-default:var(--components-form-field-border-readonly);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--components-form-field-border-focus);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-background:var(--components-form-field-background-readonly)}nv-fielddaterange[error]:not([error=false]){--nv-field-border-default:var(--components-form-field-border-error);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--nv-field-border-default);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-focus-box-shadow:var(--color-focus-destructive-in-field)}nv-fielddaterange[success]:not([success=false]){--nv-field-border-default:var(--components-form-field-border-success);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--nv-field-border-default);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-focus-box-shadow:var(--color-focus-success)}nv-fielddaterange[required]:not([required=false]) label::after{content:"*";color:var(--components-form-text-required);font-weight:700}nv-fielddaterange label{display:flex;align-items:center;gap:var(--form-label-gap);align-self:stretch;color:var(--components-form-text-label-default);font-family:"TT Norms Pro", sans-serif;font-size:var(--form-label-font-size);font-style:normal;font-weight:500;line-height:var(--form-label-line-height)}nv-fielddaterange nv-popover{width:100%;display:block}nv-fielddaterange nv-popover [data-scope=popover]{padding:0;background-color:var(--components-list-dropdown-background);border:1px solid var(--components-list-dropdown-border);width:auto}nv-fielddaterange nv-popover [slot=content]{display:block;width:100%}nv-fielddaterange .input-wrapper{display:flex;flex-wrap:wrap;gap:var(--form-gap-x);align-items:stretch;align-self:stretch;display:flex;align-items:center;gap:8px}nv-fielddaterange .input-wrapper .input-container{display:flex;flex-grow:1;justify-content:center;align-items:center;align-self:stretch;border-radius:var(--form-field-radius);border-width:1px;border-style:solid;border-color:var(--nv-field-border-default);opacity:var(--components-form-opacity-default, 1);background:var(--nv-field-background);transition:all 150ms ease-out}nv-fielddaterange .input-wrapper .input-container:hover{border-color:var(--nv-field-border-hover)}nv-fielddaterange .input-wrapper .input-container:focus-within,nv-fielddaterange .input-wrapper .input-container:focus-within:hover,nv-fielddaterange .input-wrapper .input-container:focus,nv-fielddaterange .input-wrapper .input-container:focus:hover{border-color:var(--nv-field-border-focus);box-shadow:0px 0px 0px var(--focus-field-stroke) var(--nv-field-focus-box-shadow)}nv-fielddaterange .input-wrapper .input-container:has(input:read-only){opacity:0.5;background-color:var(--components-form-field-background-readonly);border-color:var(--nv-field-border-readonly)}nv-fielddaterange .input-wrapper .input-container:has(input:disabled){opacity:0.5;background-color:var(--components-form-field-background-disabled);border-color:var(--nv-field-border-disabled)}nv-fielddaterange .input-wrapper .input-container:focus-within,nv-fielddaterange .input-wrapper .input-container:focus-within:hover,nv-fielddaterange .input-wrapper .input-container:focus,nv-fielddaterange .input-wrapper .input-container:focus:hover{box-shadow:none;border-color:var(--nv-field-border-default)}nv-fielddaterange .input-wrapper .input-container input{display:flex;align-items:center;flex:1 0 0;overflow:hidden;background-color:transparent;color:var(--components-form-field-content-text);padding:var(--form-field-padding-y) var(--form-field-padding-x);font-size:var(--form-field-font-size);font-style:normal;font-weight:500;line-height:var(--form-field-line-height);width:100%;width:100%}nv-fielddaterange .input-wrapper .input-container input:focus{outline:none}nv-fielddaterange .input-wrapper .input-container input::placeholder{overflow:hidden;color:var(--components-form-field-content-placeholder);text-overflow:ellipsis;font-family:"TT Norms Pro", sans-serif;font-size:var(--form-field-font-size);font-style:normal;font-weight:400;line-height:var(--form-field-line-height)}nv-fielddaterange .input-wrapper .input-container input[type=password]::-ms-clear,nv-fielddaterange .input-wrapper .input-container input[type=password]::-ms-reveal{display:none;width:0;height:0}nv-fielddaterange .input-wrapper .input-container input:focus-within,nv-fielddaterange .input-wrapper .input-container input:focus-within:hover,nv-fielddaterange .input-wrapper .input-container input:focus,nv-fielddaterange .input-wrapper .input-container input:focus:hover{outline:var(--focus-outline-stroke) solid var(--nv-field-border-focus);outline-offset:0px}nv-fielddaterange .input-wrapper .input-container input:focus-within~.range-separator,nv-fielddaterange .input-wrapper .input-container input:focus-within:hover~.range-separator,nv-fielddaterange .input-wrapper .input-container input:focus~.range-separator,nv-fielddaterange .input-wrapper .input-container input:focus:hover~.range-separator{background-color:transparent}nv-fielddaterange .input-wrapper .input-container>nv-iconbutton{border:0px;border-radius:0px}nv-fielddaterange .input-wrapper .input-container>nv-iconbutton:focus-visible{border-radius:var(--button-md-border-radius);outline-offset:-3px}nv-fielddaterange .input-wrapper .input-container nv-icon.validation{color:var(--nv-field-border-default)}nv-fielddaterange .description{display:flex;align-items:center;align-self:stretch;gap:var(--spacing-1);color:var(--components-form-text-description-default);font-family:"TT Norms Pro", sans-serif;font-size:var(--form-description-font-size);font-style:normal;line-height:var(--form-description-line-height)}nv-fielddaterange .error-description{display:flex;align-items:center;align-self:stretch;gap:var(--spacing-1);color:var(--components-form-text-description-default);font-family:"TT Norms Pro", sans-serif;font-size:var(--form-description-font-size);font-style:normal;line-height:var(--form-description-line-height);color:var(--components-form-text-description-error)}nv-fielddaterange .range-inputs{display:flex;align-items:center;gap:0;width:100%}nv-fielddaterange .range-inputs input{flex:1;border:none;outline:none;padding:0;font-size:var(--form-field-font-size);color:var(--components-form-field-content-text);background:transparent;min-width:0}nv-fielddaterange .range-inputs input::placeholder{color:var(--components-form-field-content-placeholder)}nv-fielddaterange .range-inputs input:disabled{cursor:not-allowed;color:var(--components-form-field-content-text);background-color:var(--components-form-field-background-disabled)}nv-fielddaterange .range-inputs .range-separator{width:1px;height:1.5rem;background-color:var(--color-content-medium-border)}';const d=s;const l=class{constructor(t){e(this,t);this.dateRangeChange=r(this,"dateRangeChange",7);this.valueChanged=r(this,"valueChanged",7);this.popoverId=o();this.startInputId=o();this.endInputId=o();this.disabled=false;this.readonly=false;this.required=false;this.error=false;this.success=false;this.autofocus=false;this.value="";this.startValue="";this.endValue="";this.open=false;this.firstDayOfWeek=1;this.numberOfCalendars=2;this.min="";this.max="";this.locale="en-BE";this.dateFormat="YYYY-MM-DD";this.shortcutsPlacement="bottom";this.showActions=false;this.fluid=false;this.parseUnifiedValue=e=>{if(!e){this.startValue="";this.endValue="";return}const r=e.split(",").map((e=>e.trim())).filter(Boolean);if(r.length>=2){this.startValue=r[0];this.endValue=r[1]}};this.handleClickOutside=e=>{if(this.open&&this.el&&!this.el.contains(e.target)){this.open=false}};this.handleStartInput=e=>{if(this.readonly||this.disabled){e.preventDefault();return}const r=e.target;this.startValue=r.value;this.value=`${r.value},${this.endValue}`;if(this.calendarElement){this.calendarElement.removeAttribute("data-prevent-navigation");this.updateCalendarValue();setTimeout((()=>{if(this.calendarElement){this.calendarElement.setAttribute("data-prevent-navigation","true")}}),100)}};this.handleEndInput=e=>{if(this.readonly||this.disabled){e.preventDefault();return}const r=e.target;this.endValue=r.value;this.value=`${this.startValue},${r.value}`;if(this.calendarElement){this.calendarElement.removeAttribute("data-prevent-navigation");this.updateCalendarValue();setTimeout((()=>{if(this.calendarElement){this.calendarElement.setAttribute("data-prevent-navigation","true")}}),100)}};this.handleFocus=e=>{if(this.readonly||this.disabled){e.preventDefault();e.target.blur();return}if(this.calendarElement){this.calendarElement.removeAttribute("data-prevent-navigation")}this.open=true;setTimeout((()=>{if(this.calendarElement){this.calendarElement.setAttribute("data-prevent-navigation","true")}}),300)};this.toggleCalendar=()=>{if(this.readonly||this.disabled){return}this.open=!this.open}}convertToInputmaskFormat(e){if(!e){return"dd/mm/yyyy"}const r={"YYYY-MM-DD":"yyyy-mm-dd","DD/MM/YYYY":"dd/mm/yyyy","MM/DD/YYYY":"mm/dd/yyyy","DD.MM.YYYY":"dd.mm.yyyy",YYYYMMDD:"yyyymmdd"};return r[e]||"dd/mm/yyyy"}updateCalendarValue(){}async clear(){this.startValue="";this.endValue="";this.value="";const e=this.el.querySelectorAll(".input-wrapper input");e.forEach((e=>{e.value="";if(e.inputmask){e.inputmask.remove()}}));this.valueChanged.emit("");this.dateRangeChange.emit({start:"",end:""});this.open=false;if(this.calendarElement){this.calendarElement.clear()}}updateMask(){const e=this.el.querySelectorAll(".input-wrapper input");e.forEach((e=>{var r,t;(t=(r=e.inputmask)===null||r===void 0?void 0:r.remove)===null||t===void 0?void 0:t.call(r);const i=new a({alias:"datetime",inputFormat:this.convertToInputmaskFormat(this.dateFormat),placeholder:this.convertToInputmaskFormat(this.dateFormat),clearIncomplete:false,showMaskOnHover:false,showMaskOnFocus:true,clearMaskOnLostFocus:!this.open,postValidation:true,oncleared:e=>{const r=e.target;if(r.id===this.startInputId){this.startValue=""}if(r.id===this.endInputId){this.endValue=""}},oncomplete:()=>{if(/[a-zA-Z]/g.test(this.value))return;const r=this.value.split(",").map((e=>e.trim())).filter(Boolean);if(r.length<2)return;this.valueChanged.emit(this.value);this.dateRangeChange.emit({start:this.startValue,end:e.value})}});i.mask(e)}))}connectedCallback(){document.addEventListener("click",this.handleClickOutside)}componentWillLoad(){if(this.value){this.parseUnifiedValue(this.value)}}componentDidLoad(){this.updateMask();const e=this.el.querySelectorAll(".input-wrapper input");e.forEach((e=>{if(e.name===this.startName&&this.startValue){requestAnimationFrame((()=>{e.value=this.startValue;const r=new CustomEvent("input",{bubbles:true});e.dispatchEvent(r)}))}else if(e.name===this.endName&&this.endValue){requestAnimationFrame((()=>{e.value=this.endValue;const r=new CustomEvent("input",{bubbles:true});e.dispatchEvent(r)}))}}))}componentDidRender(){const e=this.el.querySelectorAll(".input-wrapper input");e.forEach((e=>{const r=e.name===this.startName?this.startValue:this.endName?this.endValue:"";if(r){requestAnimationFrame((()=>{e.value=r;e.setAttribute("value",r)}))}}))}disconnectedCallback(){document.removeEventListener("click",this.handleClickOutside)}handleRangeDateChange(e){const{start:r,end:t}=e.detail||{};if(r&&t){this.startValue=r;this.endValue=t;this.value=`${r},${t}`;this.valueChanged.emit(this.value);this.dateRangeChange.emit({start:this.startValue,end:this.endValue});if(!this.showActions){this.open=false}}}handleCalendarValueChanged(e){const r=e.detail||"";if(r!==this.value){this.value=r;this.valueChanged.emit(r);this.parseUnifiedValue(r);this.dateRangeChange.emit({start:this.startValue,end:this.endValue})}}handleClosePopover(){this.open=false}handleApplyDateRange(){this.open=false}handleDateReset(e){const r=e.type==="singleDateChange"&&e.detail==="";const t=e.type==="rangeDateChange"&&e.detail&&e.detail.start===""&&e.detail.end==="";if(r||t){this.startValue="";this.endValue="";this.value="";this.valueChanged.emit("");const e=this.el.querySelectorAll(".input-wrapper input");e.forEach((e=>{e.value=""}));this.dateRangeChange.emit({start:"",end:""})}}handleKeyDown(e){if(!this.open){if(e.key==="ArrowDown"){this.open=true;e.preventDefault();return}return}if(!this.popoverElement){console.warn("nv-fielddaterange -> Popover element is not defined");return}}handleValueChange(e){this.parseUnifiedValue(e)}onOpenChanged(e){this.updateMask();if(this.contentRef){if(e){this.contentRef.style.transition="none";this.contentRef.style.maxHeight="0px";requestAnimationFrame((()=>{this.contentRef.style.transition="max-height 0.18s cubic-bezier(0.4,0,0.2,1)";this.contentRef.style.maxHeight=this.contentRef.scrollHeight+"px"}))}else{this.contentRef.style.transition="none";this.contentRef.style.maxHeight=this.contentRef.scrollHeight+"px";requestAnimationFrame((()=>{this.contentRef.style.transition="max-height 0.18s cubic-bezier(0.4,0,0.2,1)";this.contentRef.style.maxHeight="0px"}))}}}render(){return t(i,{key:"2f100d067fa3ca5917252ac2ce921eecac98791e"},(this.label&&this.label.length>0||this.el.querySelector('[slot="label"]'))&&t("label",{key:"d427e5fd307896971a798a61461a5545af107d95",htmlFor:this.startInputId},t("slot",{key:"b6735f19e0fa53528e0c088ee81eb54f7076a8b5",name:"label"},this.label)),t("nv-popover",{key:"069225a1606c105b9370f6eb0b5268fbf3fc5d96",ref:e=>this.popoverElement=e,id:this.popoverId,triggerMode:"controlled",placement:"bottom-start",open:this.open},t("div",{key:"ec43cbd1c063f2e8c4de3e765b776982da607fbe",slot:"trigger",class:"input-wrapper"},t("slot",{key:"6d6dc2263764bdd53674d9b62eb04904ceecf428",name:"before-input"}),t("div",{key:"d465d4a360baf008977e9f9c23058980c7357668",class:"input-container"},t("slot",{key:"52463fb16a84025f910ab5d34ad5f95e575a3999",name:"leading-input"}),t("div",{key:"a432151dabdf6976f463d794b24b85cb7c784d3f",class:"range-inputs"},t("input",{key:"98e48271dce40353ba577aedc1daca8398f9526a",id:this.startInputId,type:"text",placeholder:this.startPlaceholder||this.convertToInputmaskFormat(this.dateFormat),name:this.startName,disabled:this.disabled,readOnly:this.readonly,required:this.required,autofocus:this.autofocus,value:this.startValue,onInput:this.handleStartInput,onFocus:this.handleFocus,"data-scope":"date-range"}),t("div",{key:"daddef3bb169bcdf4baf4d5dd7c727d7fa66dd0f",class:"range-separator"}),t("input",{key:"c498d3b8a82372606d315a3102ada5763bc4791e",id:this.endInputId,type:"text",placeholder:this.endPlaceholder||this.convertToInputmaskFormat(this.dateFormat),name:this.endName,disabled:this.disabled,readOnly:this.readonly,required:this.required,value:this.endValue,onInput:this.handleEndInput,onFocus:this.handleFocus,"data-scope":"date-range"})),this.error&&t("nv-icon",{key:"c83a0f241b7eb2407117a5eb52caa1bee955c764",name:"alert-circle",class:"validation",size:"md"}),this.success&&t("nv-icon",{key:"a96c7cd55a903e38f10453fe6bbea0f828573367",name:"circle-check",class:"validation",size:"md"}),t("nv-iconbutton",{key:"39b92aa357457f0be9264335173f8335fdd84b26",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})),t("slot",{key:"b739f98ecb80e73fd84b557a0165438beb3f16bd",name:"after-input"})),t("div",{key:"503406610a224a2b0173fcf6117b1b3a45d3d44d",slot:"content"},t("nv-calendar",{key:"ac97339bef8aa214da1317601a31af2c2555acaa",ref:e=>this.calendarElement=e,dateFormat:this.dateFormat,value:this.value,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","data-prevent-navigation":"true"}))),(this.description&&this.description.length>0||this.el.querySelector('[slot="description"]'))&&t("div",{key:"302bf932d36f484db34d7c94206697fb469faadc",class:"description"},t("slot",{key:"133e4c69264dbb856f42dee40fbdfe2286caf87d",name:"description"},this.description)),(this.errorDescription||this.el.querySelector('[slot="error-description"]'))&&t("div",{key:"2cc57d57cb18cc7ac89135f5e128ffa9ee5487bc",hidden:!this.error,class:"error-description"},this.el.querySelector('[slot="error-description"]')?t("slot",{name:"error-description"}):this.errorDescription),t("slot",{key:"3ef1b28e2bd3879c33faefd20af8cf33360af56c"}))}get el(){return n(this)}static get watchers(){return{value:["handleValueChange"],open:["onOpenChanged"]}}};l.style=d;export{l as nv_fielddaterange};
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{r as e,c as r,h as t,H as i,g as n}from"./p-d0a33e64.js";import{I as a}from"./p-53aa81dd.js";import{v as o}from"./p-f5ff676c.js";import"./p-0462f723.js";const s='nv-fieldslider .slider-container .track-container:has(.thumb:hover) .track-range{background:var(--components-slider-track-filled-hover)}nv-fieldslider .slider-container .track-container:has(.thumb:hover) .thumb{border-color:var(--components-slider-track-filled-hover)}nv-fieldslider .slider-container .track-container:has(.thumb:focus) .track-range{background:var(--components-slider-track-filled-focus)}nv-fieldslider .slider-container .track-container:has(.thumb:focus) .thumb{border-color:var(--components-slider-track-filled-focus)}nv-fieldslider[error] .slider-container .track-container .track .track-range{background:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container .track .thumb{border-color:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container .track .thumb:hover{border-color:var(--components-slider-track-filled-error);outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-slider-track-filled-error);outline-offset:calc(var(--focus-outline-offset) * 1);background-color:var(--components-slider-handler-background-error)}nv-fieldslider[error] .slider-container .track-container .track .thumb:focus{border-color:var(--components-slider-track-filled-error);outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-slider-track-filled-error);outline-offset:calc(var(--focus-outline-offset) * 1);background-color:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container:has(.thumb:hover) .track-range{background:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container:has(.thumb:hover) .thumb{border-color:var(--components-slider-track-filled-error)}nv-fielddaterange{--nv-field-border-default:var(--components-form-field-border-default);--nv-field-border-hover:var(--components-form-field-border-hover);--nv-field-border-focus:var(--components-form-field-border-focus);--nv-field-border-disabled:var(--components-form-field-border-default);--nv-field-border-readonly:var(--components-form-field-border-default);--nv-field-focus-box-shadow:var(--color-focus-brand);--nv-field-background:var(--components-form-field-background-default);display:flex;flex-direction:column;align-items:flex-start;gap:var(--form-gap-y);box-sizing:border-box;max-width:480px}nv-fielddaterange[fluid]:not([fluid=false]){max-width:unset}nv-fielddaterange[readonly]:not([readonly=false]){--nv-field-border-default:var(--components-form-field-border-readonly);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--components-form-field-border-focus);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-background:var(--components-form-field-background-readonly)}nv-fielddaterange[error]:not([error=false]){--nv-field-border-default:var(--components-form-field-border-error);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--nv-field-border-default);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-focus-box-shadow:var(--color-focus-destructive-in-field)}nv-fielddaterange[success]:not([success=false]){--nv-field-border-default:var(--components-form-field-border-success);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--nv-field-border-default);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-focus-box-shadow:var(--color-focus-success)}nv-fielddaterange[required]:not([required=false]) label::after{content:"*";color:var(--components-form-text-required);font-weight:700}nv-fielddaterange label{display:flex;align-items:center;gap:var(--form-label-gap);align-self:stretch;color:var(--components-form-text-label-default);font-family:"TT Norms Pro", sans-serif;font-size:var(--form-label-font-size);font-style:normal;font-weight:500;line-height:var(--form-label-line-height)}nv-fielddaterange nv-popover{width:100%;display:block}nv-fielddaterange nv-popover [data-scope=popover]{padding:0;background-color:var(--components-list-dropdown-background);border:1px solid var(--components-list-dropdown-border);width:auto}nv-fielddaterange nv-popover [slot=content]{display:block;width:100%}nv-fielddaterange .input-wrapper{display:flex;flex-wrap:wrap;gap:var(--form-gap-x);align-items:stretch;align-self:stretch;display:flex;align-items:center;gap:8px}nv-fielddaterange .input-wrapper .input-container{display:flex;flex-grow:1;justify-content:center;align-items:center;align-self:stretch;border-radius:var(--form-field-radius);border-width:1px;border-style:solid;border-color:var(--nv-field-border-default);opacity:var(--components-form-opacity-default, 1);background:var(--nv-field-background);transition:all 150ms ease-out}nv-fielddaterange .input-wrapper .input-container:hover{border-color:var(--nv-field-border-hover)}nv-fielddaterange .input-wrapper .input-container:focus-within,nv-fielddaterange .input-wrapper .input-container:focus-within:hover,nv-fielddaterange .input-wrapper .input-container:focus,nv-fielddaterange .input-wrapper .input-container:focus:hover{border-color:var(--nv-field-border-focus);box-shadow:0px 0px 0px var(--focus-field-stroke) var(--nv-field-focus-box-shadow)}nv-fielddaterange .input-wrapper .input-container:has(input:read-only){opacity:0.5;background-color:var(--components-form-field-background-readonly);border-color:var(--nv-field-border-readonly)}nv-fielddaterange .input-wrapper .input-container:has(input:disabled){opacity:0.5;background-color:var(--components-form-field-background-disabled);border-color:var(--nv-field-border-disabled)}nv-fielddaterange .input-wrapper .input-container:focus-within,nv-fielddaterange .input-wrapper .input-container:focus-within:hover,nv-fielddaterange .input-wrapper .input-container:focus,nv-fielddaterange .input-wrapper .input-container:focus:hover{box-shadow:none;border-color:var(--nv-field-border-default)}nv-fielddaterange .input-wrapper .input-container input{display:flex;align-items:center;flex:1 0 0;overflow:hidden;background-color:transparent;color:var(--components-form-field-content-text);padding:var(--form-field-padding-y) var(--form-field-padding-x);font-size:var(--form-field-font-size);font-style:normal;font-weight:500;line-height:var(--form-field-line-height);width:100%;width:100%}nv-fielddaterange .input-wrapper .input-container input:focus{outline:none}nv-fielddaterange .input-wrapper .input-container input::placeholder{overflow:hidden;color:var(--components-form-field-content-placeholder);text-overflow:ellipsis;font-family:"TT Norms Pro", sans-serif;font-size:var(--form-field-font-size);font-style:normal;font-weight:400;line-height:var(--form-field-line-height)}nv-fielddaterange .input-wrapper .input-container input[type=password]::-ms-clear,nv-fielddaterange .input-wrapper .input-container input[type=password]::-ms-reveal{display:none;width:0;height:0}nv-fielddaterange .input-wrapper .input-container input:focus-within,nv-fielddaterange .input-wrapper .input-container input:focus-within:hover,nv-fielddaterange .input-wrapper .input-container input:focus,nv-fielddaterange .input-wrapper .input-container input:focus:hover{outline:var(--focus-outline-stroke) solid var(--nv-field-border-focus);outline-offset:0px}nv-fielddaterange .input-wrapper .input-container input:focus-within~.range-separator,nv-fielddaterange .input-wrapper .input-container input:focus-within:hover~.range-separator,nv-fielddaterange .input-wrapper .input-container input:focus~.range-separator,nv-fielddaterange .input-wrapper .input-container input:focus:hover~.range-separator{background-color:transparent}nv-fielddaterange .input-wrapper .input-container>nv-iconbutton{border:0px;border-radius:0px}nv-fielddaterange .input-wrapper .input-container>nv-iconbutton:focus-visible{border-radius:var(--button-md-border-radius);outline-offset:-3px}nv-fielddaterange .input-wrapper .input-container nv-icon.validation{color:var(--nv-field-border-default)}nv-fielddaterange .description{display:flex;align-items:center;align-self:stretch;gap:var(--spacing-1);color:var(--components-form-text-description-default);font-family:"TT Norms Pro", sans-serif;font-size:var(--form-description-font-size);font-style:normal;line-height:var(--form-description-line-height)}nv-fielddaterange .error-description{display:flex;align-items:center;align-self:stretch;gap:var(--spacing-1);color:var(--components-form-text-description-default);font-family:"TT Norms Pro", sans-serif;font-size:var(--form-description-font-size);font-style:normal;line-height:var(--form-description-line-height);color:var(--components-form-text-description-error)}nv-fielddaterange .range-inputs{display:flex;align-items:center;gap:0;width:100%}nv-fielddaterange .range-inputs input{flex:1;border:none;outline:none;padding:0;font-size:var(--form-field-font-size);color:var(--components-form-field-content-text);background:transparent;min-width:0}nv-fielddaterange .range-inputs input::placeholder{color:var(--components-form-field-content-placeholder)}nv-fielddaterange .range-inputs input:disabled{cursor:not-allowed;color:var(--components-form-field-content-text);background-color:var(--components-form-field-background-disabled)}nv-fielddaterange .range-inputs .range-separator{width:1px;height:1.5rem;background-color:var(--color-content-medium-border)}';const d=s;const l=class{constructor(t){e(this,t);this.dateRangeChange=r(this,"dateRangeChange",7);this.valueChanged=r(this,"valueChanged",7);this.popoverId=o();this.startInputId=o();this.endInputId=o();this.disabled=false;this.readonly=false;this.required=false;this.error=false;this.success=false;this.autofocus=false;this.value="";this.startValue="";this.endValue="";this.open=false;this.firstDayOfWeek=1;this.numberOfCalendars=2;this.min="";this.max="";this.locale="en-BE";this.dateFormat="YYYY-MM-DD";this.shortcutsPlacement="bottom";this.showActions=false;this.fluid=false;this.parseUnifiedValue=e=>{if(!e){this.startValue="";this.endValue="";return}const r=e.split(",").map((e=>e.trim())).filter(Boolean);if(r.length>=2){this.startValue=r[0];this.endValue=r[1]}};this.handleClickOutside=e=>{if(this.open&&this.el&&!this.el.contains(e.target)){this.open=false}};this.handleStartInput=e=>{if(this.readonly||this.disabled){e.preventDefault();return}const r=e.target;this.startValue=r.value;this.value=`${r.value},${this.endValue}`;if(this.calendarElement){this.calendarElement.removeAttribute("data-prevent-navigation");this.updateCalendarValue();setTimeout((()=>{if(this.calendarElement){this.calendarElement.setAttribute("data-prevent-navigation","true")}}),100)}};this.handleEndInput=e=>{if(this.readonly||this.disabled){e.preventDefault();return}const r=e.target;this.endValue=r.value;this.value=`${this.startValue},${r.value}`;if(this.calendarElement){this.calendarElement.removeAttribute("data-prevent-navigation");this.updateCalendarValue();setTimeout((()=>{if(this.calendarElement){this.calendarElement.setAttribute("data-prevent-navigation","true")}}),100)}};this.handleFocus=e=>{if(this.readonly||this.disabled){e.preventDefault();e.target.blur();return}if(this.calendarElement){this.calendarElement.removeAttribute("data-prevent-navigation")}this.open=true;setTimeout((()=>{if(this.calendarElement){this.calendarElement.setAttribute("data-prevent-navigation","true")}}),300)};this.toggleCalendar=()=>{if(this.readonly||this.disabled){return}this.open=!this.open}}convertToInputmaskFormat(e){if(!e){return"dd/mm/yyyy"}const r={"YYYY-MM-DD":"yyyy-mm-dd","DD/MM/YYYY":"dd/mm/yyyy","MM/DD/YYYY":"mm/dd/yyyy","DD.MM.YYYY":"dd.mm.yyyy",YYYYMMDD:"yyyymmdd"};return r[e]||"dd/mm/yyyy"}updateCalendarValue(){}async clear(){this.startValue="";this.endValue="";this.value="";const e=this.el.querySelectorAll(".input-wrapper input");e.forEach((e=>{e.value="";if(e.inputmask){e.inputmask.remove()}}));this.valueChanged.emit("");this.dateRangeChange.emit({start:"",end:""});this.open=false;if(this.calendarElement){this.calendarElement.clear()}}updateMask(){const e=this.el.querySelectorAll(".input-wrapper input");e.forEach((e=>{var r,t;(t=(r=e.inputmask)===null||r===void 0?void 0:r.remove)===null||t===void 0?void 0:t.call(r);const i=new a({alias:"datetime",inputFormat:this.convertToInputmaskFormat(this.dateFormat),placeholder:this.convertToInputmaskFormat(this.dateFormat),clearIncomplete:false,showMaskOnHover:false,showMaskOnFocus:true,clearMaskOnLostFocus:!this.open,postValidation:true,oncleared:e=>{const r=e.target;if(r.id===this.startInputId){this.startValue=""}if(r.id===this.endInputId){this.endValue=""}},oncomplete:()=>{if(/[a-zA-Z]/g.test(this.value))return;const r=this.value.split(",").map((e=>e.trim())).filter(Boolean);if(r.length<2)return;this.valueChanged.emit(this.value);this.dateRangeChange.emit({start:this.startValue,end:e.value})}});i.mask(e)}))}connectedCallback(){document.addEventListener("click",this.handleClickOutside)}componentWillLoad(){if(this.value){this.parseUnifiedValue(this.value)}}componentDidLoad(){this.updateMask();const e=this.el.querySelectorAll(".input-wrapper input");e.forEach((e=>{if(e.name===this.startName&&this.startValue){requestAnimationFrame((()=>{e.value=this.startValue;const r=new CustomEvent("input",{bubbles:true});e.dispatchEvent(r)}))}else if(e.name===this.endName&&this.endValue){requestAnimationFrame((()=>{e.value=this.endValue;const r=new CustomEvent("input",{bubbles:true});e.dispatchEvent(r)}))}}))}componentDidRender(){const e=this.el.querySelectorAll(".input-wrapper input");e.forEach((e=>{const r=e.name===this.startName?this.startValue:this.endName?this.endValue:"";if(r){requestAnimationFrame((()=>{e.value=r;e.setAttribute("value",r)}))}}))}disconnectedCallback(){document.removeEventListener("click",this.handleClickOutside)}handleRangeDateChange(e){const{start:r,end:t}=e.detail||{};if(r&&t){this.startValue=r;this.endValue=t;this.value=`${r},${t}`;this.valueChanged.emit(this.value);this.dateRangeChange.emit({start:this.startValue,end:this.endValue});if(!this.showActions){this.open=false}}}handleCalendarValueChanged(e){const r=e.detail||"";if(r!==this.value){this.value=r;this.valueChanged.emit(r);this.parseUnifiedValue(r);this.dateRangeChange.emit({start:this.startValue,end:this.endValue})}}handleClosePopover(){this.open=false}handleApplyDateRange(){this.open=false}handleDateReset(e){const r=e.type==="singleDateChange"&&e.detail==="";const t=e.type==="rangeDateChange"&&e.detail&&e.detail.start===""&&e.detail.end==="";if(r||t){this.startValue="";this.endValue="";this.value="";this.valueChanged.emit("");const e=this.el.querySelectorAll(".input-wrapper input");e.forEach((e=>{e.value=""}));this.dateRangeChange.emit({start:"",end:""})}}handleKeyDown(e){if(!this.open){if(e.key==="ArrowDown"){this.open=true;e.preventDefault();return}return}if(!this.popoverElement){console.warn("nv-fielddaterange -> Popover element is not defined");return}}handleValueChange(e){this.parseUnifiedValue(e)}onOpenChanged(e){this.updateMask();if(this.contentRef){if(e){this.contentRef.style.transition="none";this.contentRef.style.maxHeight="0px";requestAnimationFrame((()=>{this.contentRef.style.transition="max-height 0.18s cubic-bezier(0.4,0,0.2,1)";this.contentRef.style.maxHeight=this.contentRef.scrollHeight+"px"}))}else{this.contentRef.style.transition="none";this.contentRef.style.maxHeight=this.contentRef.scrollHeight+"px";requestAnimationFrame((()=>{this.contentRef.style.transition="max-height 0.18s cubic-bezier(0.4,0,0.2,1)";this.contentRef.style.maxHeight="0px"}))}}}render(){return t(i,{key:"1f11c1e95c0e1cdc54cc0fc22c6bb3c629d35560"},(this.label&&this.label.length>0||this.el.querySelector('[slot="label"]'))&&t("label",{key:"b7f2d251de0f4e9e8429095d0c74197a963ddb45",htmlFor:this.startInputId},t("slot",{key:"bdf0f487baf834fcfb48f81a5d4ba0ad786961f2",name:"label"},this.label)),t("nv-popover",{key:"cc25f182c4f6fb8dc5a8d70c9f6a5ab28eaf05bc",ref:e=>this.popoverElement=e,id:this.popoverId,triggerMode:"controlled",placement:"bottom-start",open:this.open},t("div",{key:"c2e0214f5e66baf986dcd4de7ea8a83044f90185",slot:"trigger",class:"input-wrapper"},t("slot",{key:"341b161e3b993305e4ddd6bdfa9138cefd5a8b06",name:"before-input"}),t("div",{key:"4ebf9b5ea2c188cd5b4e12bcdd800d040339ac41",class:"input-container"},t("slot",{key:"af19b28485924209146b42db39ec1295609e96e1",name:"leading-input"}),t("div",{key:"93bb5f085cc3da0eb81794bf106597c90b80be09",class:"range-inputs"},t("input",{key:"3a6143d6480bf57b4d3118cb293de529f4443c64",id:this.startInputId,type:"text",placeholder:this.startPlaceholder||this.convertToInputmaskFormat(this.dateFormat),name:this.startName,disabled:this.disabled,readOnly:this.readonly,required:this.required,autofocus:this.autofocus,value:this.startValue,onInput:this.handleStartInput,onFocus:this.handleFocus,"data-scope":"date-range"}),t("div",{key:"5b719fa2d4cf0505a2198fcbfb0aed622f3cd1d8",class:"range-separator"}),t("input",{key:"a126155bb80bcc9926e7b6eae9c02a7f88c447ef",id:this.endInputId,type:"text",placeholder:this.endPlaceholder||this.convertToInputmaskFormat(this.dateFormat),name:this.endName,disabled:this.disabled,readOnly:this.readonly,required:this.required,value:this.endValue,onInput:this.handleEndInput,onFocus:this.handleFocus,"data-scope":"date-range"})),this.error&&t("nv-icon",{key:"bb7ae5511eb9f2dbba73376ad36063a2143336a6",name:"alert-circle",class:"validation",size:"md"}),this.success&&t("nv-icon",{key:"0762e12a2686d58734b00e7fcc176231696d2e31",name:"circle-check",class:"validation",size:"md"}),t("nv-iconbutton",{key:"dca1f92d86b3e09d3826c8042c730f2ac1cc51d7",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})),t("slot",{key:"ef46e31ef47bb2b9aa485b69b65af2ec93ba94ab",name:"after-input"})),t("div",{key:"b96f6ee83f4d00a1cc74cc2a03a731a557c6fda5",slot:"content"},t("nv-calendar",{key:"0f7222572196deeb5c40899fea3b97dc12180665",ref:e=>this.calendarElement=e,dateFormat:this.dateFormat,value:this.value,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","data-prevent-navigation":"true"}))),(this.description&&this.description.length>0||this.el.querySelector('[slot="description"]'))&&t("div",{key:"17b857ca9a4529b8febd98a9477a6b176c7ba931",class:"description"},t("slot",{key:"c03f5413d16ca9adac251ad68d5f7a817520a5d9",name:"description"},this.description)),(this.errorDescription||this.el.querySelector('[slot="error-description"]'))&&t("div",{key:"4d246d32982bf90043fd3c46a24a2eebd9e2ecd7",hidden:!this.error,class:"error-description"},this.el.querySelector('[slot="error-description"]')?t("slot",{name:"error-description"}):this.errorDescription),t("slot",{key:"7cbbc91895e1772e0b1750e61db78b97285f8b85"}))}get el(){return n(this)}static get watchers(){return{value:["handleValueChange"],open:["onOpenChanged"]}}};l.style=d;export{l as nv_fielddaterange};
|
|
2
|
+
//# sourceMappingURL=p-3da64006.entry.js.map
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as e,c as r,h as o,H as d,g as i}from"./p-d0a33e64.js";import{c as a}from"./p-8a1a6e56.js";import{v as t}from"./p-f5ff676c.js";const n='nv-fieldradio{--nv-fieldradio-border-default:var(--components-form-field-border-default);--nv-fieldradio-border-hover:var(--components-form-field-border-hover);--nv-fieldradio-border-focus:var(--components-form-field-border-default);--nv-fieldradio-background-default:var(--components-form-field-background-default);--nv-fieldradio-background-checked:var(--components-form-field-background-checked);--nv-fieldradio-background-disabled:var(--components-form-field-background-disabled);--nv-fieldradio-focus-box-shadow:var(--color-focus-brand);--nv-fieldradio-dot-color-checked:var(--components-form-shape-foreground-default);--nv-fieldradio-dot-color-disabled:var(--components-form-shape-foreground-disabled);--nv-fieldradio-outline-color:var(--color-focus-brand);display:inline-flex;align-items:flex-start;gap:var(--form-gap-x)}nv-fieldradio:not([disabled]) input,nv-fieldradio:not([disabled]) label,nv-fieldradio[disabled=false] input,nv-fieldradio[disabled=false] label{cursor:pointer}nv-fieldradio.error{--nv-fieldradio-border-default:var(--components-form-field-border-error);--nv-fieldradio-border-hover:var(--nv-fieldradio-border-default);--nv-fieldradio-border-focus:var(--components-form-field-border-error);--nv-fieldradio-background-checked:var(--components-form-field-background-error);--nv-fieldradio-focus-box-shadow:var(--color-focus-destructive);--nv-fieldradio-dot-color-checked:var(--components-form-shape-foreground-default);--nv-fieldradio-dot-color-disabled:var(--components-form-field-border-error);--nv-fieldradio-outline-color:var(--color-focus-destructive)}nv-fieldradio.label-placement-before{flex-direction:row-reverse}nv-fieldradio[disabled]{opacity:0.5}nv-fieldradio label{align-self:stretch;color:var(--components-form-text-label-default);font-family:"TT Norms Pro", sans-serif;font-size:var(--form-label-font-size);font-style:normal;font-weight:var(--form-label-font-weight);line-height:var(--form-label-line-height)}nv-fieldradio input[type=radio]{appearance:none;position:relative;display:flex;width:var(--form-radio-size);height:var(--form-radio-size);padding:var(--form-radio-inner-circle-padding);flex-direction:column;align-items:flex-start;border-radius:var(--radius-rounded-full);border-width:var(--form-radio-border-width);border-style:solid;border-color:var(--nv-fieldradio-border-default);background:var(--nv-fieldradio-background-default)}nv-fieldradio input[type=radio]:hover{border-color:var(--nv-fieldradio-border-hover)}nv-fieldradio input[type=radio]:focus{border-color:var(--nv-fieldradio-border-focus)}nv-fieldradio input[type=radio]:focus,nv-fieldradio input[type=radio]:focus-within{outline:none}nv-fieldradio input[type=radio]:focus-visible,nv-fieldradio input[type=radio]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--nv-fieldradio-outline-color);outline-offset:calc(var(--focus-outline-offset) * 1);z-index:111}nv-fieldradio input[type=radio]:checked{background:var(--nv-fieldradio-background-checked);border-color:var(--nv-fieldradio-background-checked)}nv-fieldradio input[type=radio]:checked:hover,nv-fieldradio input[type=radio]:checked:focus{border-color:var(--nv-fieldradio-background-checked);background:var(--nv-fieldradio-background-checked)}nv-fieldradio input[type=radio]:checked::before{content:"";position:absolute;top:50%;right:50%;transform:translate(50%, -50%);left:0;width:var(--form-radio-inner-circle-size);height:var(--form-radio-inner-circle-size);flex-shrink:0;border-radius:var(--radius-rounded-full);background:var(--nv-fieldradio-dot-color-checked)}nv-fieldradio input[type=radio]:disabled{border-radius:var(--radius-rounded-full);border-width:var(--form-radio-border-width);border-style:solid;border-color:var(--nv-fieldradio-border-default);background:var(--nv-fieldradio-background-disabled)}nv-fieldradio input[type=radio]:disabled:checked::before{background:var(--nv-fieldradio-dot-color-disabled)}nv-fieldradio input[type=radio]:disabled:hover{border-color:var(--nv-fieldradio-border-default);background:var(--nv-fieldradio-background-disabled)}nv-fieldradio .description{align-self:stretch;color:var(--components-form-text-description-default);font-family:"TT Norms Pro", sans-serif;font-size:var(--form-description-font-size);font-style:normal;font-weight:var(--form-description-font-weight);line-height:var(--form-description-line-height)}nv-fieldradio .error-description{align-self:stretch;color:var(--components-form-text-description-default);font-family:"TT Norms Pro", sans-serif;font-size:var(--form-description-font-size);font-style:normal;font-weight:var(--form-description-font-weight);line-height:var(--form-description-line-height);color:var(--components-form-text-description-error)}nv-fieldradio .text-container{display:flex;flex-direction:column;align-items:flex-start;flex:1 0 0}';const l=n;const f=class{constructor(o){e(this,o);this.checkedChanged=r(this,"checkedChanged",7);this.labelBefore=false;this.inputId=t();this.error=false;this.checked=false;this.disabled=false;this.autofocus=false}componentWillRender(){if(this.message){this.description=this.message}if(this.labelBefore){this.labelPlacement="before"}}handleCheckedChange(e){this.checkedChanged.emit(e)}handleChange(e){const r=e.target;if((r===null||r===void 0?void 0:r.type)==="radio"){Array.from(document.getElementsByTagName("nv-fieldradio")).forEach((e=>{if(e.name===this.name){e.checked=false}}));this.checked=r.checked}}render(){return o(d,{key:"df74694648d4d6ca117d5766871d032b0ec0fa85",class:a(this.labelPlacement==="before"&&"label-placement-before",this.error&&"error")},o("input",{key:"cf30fb745aba5943414e1572a8f7a42af1bf0e3d",type:"radio",id:this.inputId,name:this.name,autofocus:this.autofocus,autocomplete:"off",value:this.value,checked:this.checked,disabled:this.disabled}),o("div",{key:"ff593d4187158ca803f5e49be365f701dc4d618d",class:"text-container"},(this.label||this.el.querySelector('[slot="label"]'))&&o("label",{key:"25120e7e90ce5fb99f90ddca35edc54c1d73f760",htmlFor:this.inputId},o("slot",{key:"557bc3204927f58c0c809870f766fdf36c701c7d",name:"label"},this.label)),(this.description||this.el.querySelector('[slot="description"]'))&&o("div",{key:"9ded425c581cd60f8ef33a830b594589d83fec71",class:"description"},o("slot",{key:"9554607229576afbd33da6bb95d08c7a0b354ee0",name:"description"},this.description)),(this.errorDescription||this.el.querySelector('[slot="error-description"]'))&&o("div",{key:"4435f0d7258e3ea0124d06763ffa6a8f17e8ba15",hidden:!this.error,class:"error-description"},o("slot",{key:"d4a80a4b4ddca790a4cb65d79d5d898da4140a07",name:"error-description"},this.errorDescription))))}static get formAssociated(){return true}get el(){return i(this)}static get watchers(){return{checked:["handleCheckedChange"]}}};f.style=l;export{f as nv_fieldradio};
|
|
2
|
+
//# sourceMappingURL=p-3ed84cd9.entry.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["nvFieldradioCss","NvFieldradioStyle0","NvFieldradio","constructor","hostRef","this","labelBefore","inputId","uuidv4","error","checked","disabled","autofocus","componentWillRender","message","description","labelPlacement","handleCheckedChange","checkedChanged","emit","handleChange","event","target","type","Array","from","document","getElementsByTagName","forEach","element","name","render","h","Host","key","class","clsx","id","autocomplete","value","label","el","querySelector","htmlFor","errorDescription","hidden"],"sources":["src/components/nv-fieldradio/nv-fieldradio.scss?tag=nv-fieldradio","src/components/nv-fieldradio/nv-fieldradio.tsx"],"sourcesContent":["@import \"../../styles/focus-ring\";\n\n@mixin fieldradio-variables() {\n --nv-fieldradio-border-default: var(--components-form-field-border-default);\n --nv-fieldradio-border-hover: var(--components-form-field-border-hover);\n --nv-fieldradio-border-focus: var(--components-form-field-border-default);\n --nv-fieldradio-background-default: var(--components-form-field-background-default);\n --nv-fieldradio-background-checked: var(--components-form-field-background-checked);\n --nv-fieldradio-background-disabled: var(--components-form-field-background-disabled);\n --nv-fieldradio-focus-box-shadow: var(--color-focus-brand);\n --nv-fieldradio-dot-color-checked: var(--components-form-shape-foreground-default);\n --nv-fieldradio-dot-color-disabled: var(--components-form-shape-foreground-disabled);\n --nv-fieldradio-outline-color: var(--color-focus-brand);\n}\n\n@mixin fieldradio-error-variables() {\n --nv-fieldradio-border-default: var(--components-form-field-border-error);\n --nv-fieldradio-border-hover: var(--nv-fieldradio-border-default);\n --nv-fieldradio-border-focus: var(--components-form-field-border-error);\n --nv-fieldradio-background-checked: var(--components-form-field-background-error);\n --nv-fieldradio-focus-box-shadow: var(--color-focus-destructive);\n --nv-fieldradio-dot-color-checked: var(--components-form-shape-foreground-default);\n --nv-fieldradio-dot-color-disabled: var(--components-form-field-border-error);\n --nv-fieldradio-outline-color: var(--color-focus-destructive);\n\n}\n\n@mixin root-styles() {\n display: inline-flex;\n align-items: flex-start;\n gap: var(--form-gap-x);\n\n &:not([disabled]),\n &[disabled=\"false\"] {\n input,\n label {\n cursor: pointer;\n }\n }\n}\n\n@mixin label-before-styles() {\n flex-direction: row-reverse;\n}\n\n@mixin label-styles() {\n align-self: stretch;\n color: var(--components-form-text-label-default);\n font-family: \"TT Norms Pro\", sans-serif;\n font-size: var(--form-label-font-size);\n font-style: normal;\n font-weight: var(--form-label-font-weight);\n line-height: var(--form-label-line-height);\n}\n\n@mixin description-styles() {\n align-self: stretch;\n color: var(--components-form-text-description-default);\n font-family: \"TT Norms Pro\", sans-serif;\n font-size: var(--form-description-font-size);\n font-style: normal;\n font-weight: var(--form-description-font-weight);\n line-height: var(--form-description-line-height);\n}\n\n@mixin error-description-styles() {\n @include description-styles();\n\n color: var(--components-form-text-description-error);\n}\n\n@mixin text-container-styles() {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n flex: 1 0 0;\n}\n\n@mixin input-styles() {\n appearance: none;\n position: relative;\n display: flex;\n width: var(--form-radio-size);\n height: var(--form-radio-size);\n padding: var(--form-radio-inner-circle-padding);\n flex-direction: column;\n align-items: flex-start;\n //gap: 10px;\n border-radius: var(--radius-rounded-full);\n border-width: var(--form-radio-border-width);\n border-style: solid;\n border-color: var(--nv-fieldradio-border-default);\n background: var(--nv-fieldradio-background-default);\n\n &:hover {\n border-color: var(--nv-fieldradio-border-hover);\n }\n\n &:focus {\n border-color: var(--nv-fieldradio-border-focus);\n }\n\n @include focus-ring(var(--nv-fieldradio-outline-color));\n\n &:checked {\n background: var(--nv-fieldradio-background-checked);\n border-color: var(--nv-fieldradio-background-checked);\n\n &:hover,\n &:focus {\n border-color: var(--nv-fieldradio-background-checked);\n background: var(--nv-fieldradio-background-checked);\n }\n\n &::before {\n content: \"\";\n position: absolute;\n top: 50%;\n right: 50%;\n transform: translate(50%, -50%);\n left: 0;\n width: var(--form-radio-inner-circle-size);\n height: var(--form-radio-inner-circle-size);\n flex-shrink: 0;\n border-radius: var(--radius-rounded-full);\n background: var(--nv-fieldradio-dot-color-checked);\n }\n }\n\n &:disabled {\n border-radius: var(--radius-rounded-full);\n border-width: var(--form-radio-border-width);\n border-style: solid;\n border-color: var(--nv-fieldradio-border-default);\n background: var(--nv-fieldradio-background-disabled);\n\n &:checked {\n &::before {\n background: var(--nv-fieldradio-dot-color-disabled);\n }\n }\n\n &:hover {\n border-color: var(--nv-fieldradio-border-default);\n background: var(--nv-fieldradio-background-disabled);\n }\n }\n}\n\nnv-fieldradio {\n @include fieldradio-variables();\n @include root-styles();\n\n &.error {\n @include fieldradio-error-variables();\n }\n\n &.label-placement-before {\n @include label-before-styles();\n }\n \n &[disabled] {\n // TODO: Find a way to use the --components-form-opacity-disabled variable properly, right now it outputs a value of 50px instead of 0.5.\n // opacity: var(--components-form-opacity-disabled); Error: Invalid value for --components-form-opacity-disabled (expected a <number> but got \"50px\")\n opacity: 0.5;\n }\n\n label {\n @include label-styles();\n }\n\n input[type=\"radio\"] {\n @include input-styles();\n }\n\n .description {\n @include description-styles();\n }\n\n .error-description {\n @include error-description-styles();\n }\n\n .text-container {\n @include text-container-styles();\n }\n}\n","import {\n Component,\n Host,\n h,\n Prop,\n Event,\n EventEmitter,\n Listen,\n Watch,\n Element,\n} from '@stencil/core';\nimport clsx from 'clsx';\nimport { v4 as uuidv4 } from 'uuid';\n\nimport { type LabelPlacement } from '../../utils/constants';\n\n/**\n * @slot label - Content to be placed as the label, will override the label prop.\n * @slot description - Content to be placed as the description, will override the description prop.\n * @slot error-description - Content to be placed as the error description, will override the errorDescription prop.\n */\n@Component({\n tag: 'nv-fieldradio',\n shadow: false,\n styleUrl: 'nv-fieldradio.scss',\n formAssociated: true,\n})\nexport class NvFieldradio {\n @Element() el: HTMLNvFieldradioElement;\n\n /****************************************************************************/\n //#region DEPRECATED\n\n /**\n * Adds a helpful hint message below the label\n * @deprecated use description instead.\n */\n @Prop({ reflect: true })\n readonly message: string;\n\n /**\n * Set the label placement to before the input\n * @deprecated use labelPlacement instead.\n */\n @Prop({ reflect: true })\n readonly labelBefore: boolean = false;\n\n componentWillRender() {\n if (this.message) {\n this.description = this.message;\n }\n\n if (this.labelBefore) {\n this.labelPlacement = 'before';\n }\n }\n\n //#endregion DEPRECATED\n /****************************************************************************/\n //#region PROPERTIES\n\n /**\n * Sets the ID for the radio button’s input element and the for attribute of\n * the associated label. If no ID is provided, a random one will be\n * automatically generated to ensure unique identification, facilitating\n * proper label association and accessibility.\n */\n @Prop({ reflect: true })\n readonly inputId: string = uuidv4();\n\n /**\n * Use this to assign a group name to your radio buttons. When you have\n * multiple radio buttons with the same name, users will be able to select\n * only one option within that group, making your forms more organized and\n * user-friendly.\n */\n @Prop({ reflect: true })\n readonly name: string;\n\n /**\n * Defines what data will be sent when the radio button is selected.\n * This helps you identify which option the user has chosen in your form,\n * ensuring accurate data collection. When the form is submitted, the data\n * will consist of a name=value pair.\n */\n @Prop({ reflect: true })\n readonly value: string;\n\n /**\n * Sets the text content that is rendered next to the input element of type\n * radio. This label is essential for accessibility and user clarity, as it\n * describes the purpose or option of the radio button.\n */\n @Prop({ reflect: true })\n readonly label: string;\n\n /**\n * Defines the position of the label relative to the radio button.\n */\n @Prop({ mutable: true, reflect: true })\n labelPlacement: `${LabelPlacement}`;\n\n /**\n * Adds a helpful hint message below the label. This description provides\n * extra information or context about the radio button option, assisting users\n * in making more informed choices.\n */\n @Prop({ mutable: true, reflect: true })\n description: string;\n\n /**\n * Highlight the radio button with error styling. It helps users quickly\n * identify which option needs attention, improving their form-filling\n * experience by making issues more visible.\n * @validator error\n */\n @Prop({ reflect: true })\n readonly error: boolean = false;\n\n /**\n * A description that appears when there is an error related to the radio\n * button.\n * @validator message\n */\n @Prop({ reflect: true })\n readonly errorDescription: string;\n\n /**\n * Controls whether the radio button is selected.\n */\n @Prop({ mutable: true, reflect: true })\n checked: boolean = false;\n\n /**\n * Disables the radio button, making it un-selectable.\n */\n @Prop({ reflect: true })\n readonly disabled: boolean = false;\n\n /**\n * Applies focus to the input field as soon as the component is mounted. This\n * is equivalent to setting the native autofocus attribute on an <input>\n * element.\n */\n @Prop({ reflect: true })\n // eslint-disable-next-line @stencil-community/reserved-member-names\n readonly autofocus: boolean = false;\n\n //#endregion PROPERTIES\n /****************************************************************************/\n //#region EVENTS\n\n /**\n * Emits when the checked state changes.\n * @bind checked\n */\n @Event()\n checkedChanged: EventEmitter<boolean>;\n\n //#endregion EVENTS\n /****************************************************************************/\n //#region WATCHERS\n\n /**\n * Watches for changes to the checked state and emits the new value.\n * @param {boolean} checked - The new value of the checked state.\n */\n @Watch('checked')\n handleCheckedChange(checked: boolean) {\n this.checkedChanged.emit(checked);\n }\n\n /**\n * Listens for the change event on the radio button input element and controls\n * the checked state of the host elements.\n * @param {Event} event - The change event.\n */\n @Listen('change')\n handleChange(event: Event) {\n const target = event.target as HTMLInputElement;\n\n if (target?.type === 'radio') {\n Array.from(document.getElementsByTagName('nv-fieldradio')).forEach(\n element => {\n if (element.name === this.name) {\n element.checked = false;\n }\n },\n );\n\n this.checked = target.checked;\n }\n }\n\n //#endregion WATCHERS\n /****************************************************************************/\n //#region RENDER\n\n render() {\n return (\n <Host\n class={clsx(\n this.labelPlacement === 'before' && 'label-placement-before',\n this.error && 'error',\n )}\n >\n <input\n type=\"radio\"\n id={this.inputId}\n name={this.name}\n autofocus={this.autofocus}\n autocomplete=\"off\"\n value={this.value}\n checked={this.checked}\n disabled={this.disabled}\n />\n\n <div class=\"text-container\">\n {(this.label || this.el.querySelector('[slot=\"label\"]')) && (\n <label htmlFor={this.inputId}>\n <slot name=\"label\">{this.label}</slot>\n </label>\n )}\n\n {(this.description ||\n this.el.querySelector('[slot=\"description\"]')) && (\n <div class=\"description\">\n <slot name=\"description\">{this.description}</slot>\n </div>\n )}\n\n {(this.errorDescription ||\n this.el.querySelector('[slot=\"error-description\"]')) && (\n <div hidden={!this.error} class=\"error-description\">\n <slot name=\"error-description\">{this.errorDescription}</slot>\n </div>\n )}\n </div>\n </Host>\n );\n }\n\n //#endregion RENDER\n}\n"],"mappings":"wIAAA,MAAMA,EAAkB,osJACxB,MAAAC,EAAeD,E,MC0BFE,EAAY,MANzB,WAAAC,CAAAC,G,yDAwBWC,KAAAC,YAAuB,MAuBvBD,KAAAE,QAAkBC,IAiDlBH,KAAAI,MAAiB,MAc1BJ,KAAAK,QAAmB,MAMVL,KAAAM,SAAoB,MASpBN,KAAAO,UAAqB,K,CAnG9B,mBAAAC,GACE,GAAIR,KAAKS,QAAS,CAChBT,KAAKU,YAAcV,KAAKS,O,CAG1B,GAAIT,KAAKC,YAAa,CACpBD,KAAKW,eAAiB,Q,EAmH1B,mBAAAC,CAAoBP,GAClBL,KAAKa,eAAeC,KAAKT,E,CAS3B,YAAAU,CAAaC,GACX,MAAMC,EAASD,EAAMC,OAErB,IAAIA,IAAM,MAANA,SAAM,SAANA,EAAQC,QAAS,QAAS,CAC5BC,MAAMC,KAAKC,SAASC,qBAAqB,kBAAkBC,SACzDC,IACE,GAAIA,EAAQC,OAASzB,KAAKyB,KAAM,CAC9BD,EAAQnB,QAAU,K,KAKxBL,KAAKK,QAAUY,EAAOZ,O,EAQ1B,MAAAqB,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAOC,EACL/B,KAAKW,iBAAmB,UAAY,yBACpCX,KAAKI,OAAS,UAGhBuB,EAAA,SAAAE,IAAA,2CACEX,KAAK,QACLc,GAAIhC,KAAKE,QACTuB,KAAMzB,KAAKyB,KACXlB,UAAWP,KAAKO,UAChB0B,aAAa,MACbC,MAAOlC,KAAKkC,MACZ7B,QAASL,KAAKK,QACdC,SAAUN,KAAKM,WAGjBqB,EAAA,OAAAE,IAAA,2CAAKC,MAAM,mBACP9B,KAAKmC,OAASnC,KAAKoC,GAAGC,cAAc,oBACpCV,EAAA,SAAAE,IAAA,2CAAOS,QAAStC,KAAKE,SACnByB,EAAA,QAAAE,IAAA,2CAAMJ,KAAK,SAASzB,KAAKmC,SAI3BnC,KAAKU,aACLV,KAAKoC,GAAGC,cAAc,0BACtBV,EAAA,OAAAE,IAAA,2CAAKC,MAAM,eACTH,EAAA,QAAAE,IAAA,2CAAMJ,KAAK,eAAezB,KAAKU,eAIjCV,KAAKuC,kBACLvC,KAAKoC,GAAGC,cAAc,gCACtBV,EAAA,OAAAE,IAAA,2CAAKW,QAASxC,KAAKI,MAAO0B,MAAM,qBAC9BH,EAAA,QAAAE,IAAA,2CAAMJ,KAAK,qBAAqBzB,KAAKuC,oB","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["nvFieldradioCss","NvFieldradioStyle0","NvFieldradio","constructor","hostRef","this","labelBefore","inputId","uuidv4","error","checked","disabled","autofocus","componentWillRender","message","description","labelPlacement","handleCheckedChange","checkedChanged","emit","handleChange","event","target","type","Array","from","document","getElementsByTagName","forEach","element","name","render","h","Host","key","class","clsx","id","autocomplete","value","label","el","querySelector","htmlFor","errorDescription","hidden"],"sources":["src/components/nv-fieldradio/nv-fieldradio.scss?tag=nv-fieldradio","src/components/nv-fieldradio/nv-fieldradio.tsx"],"sourcesContent":["@import \"../../styles/focus-ring\";\n\n@mixin fieldradio-variables() {\n --nv-fieldradio-border-default: var(--components-form-field-border-default);\n --nv-fieldradio-border-hover: var(--components-form-field-border-hover);\n --nv-fieldradio-border-focus: var(--components-form-field-border-default);\n --nv-fieldradio-background-default: var(--components-form-field-background-default);\n --nv-fieldradio-background-checked: var(--components-form-field-background-checked);\n --nv-fieldradio-background-disabled: var(--components-form-field-background-disabled);\n --nv-fieldradio-focus-box-shadow: var(--color-focus-brand);\n --nv-fieldradio-dot-color-checked: var(--components-form-shape-foreground-default);\n --nv-fieldradio-dot-color-disabled: var(--components-form-shape-foreground-disabled);\n --nv-fieldradio-outline-color: var(--color-focus-brand);\n}\n\n@mixin fieldradio-error-variables() {\n --nv-fieldradio-border-default: var(--components-form-field-border-error);\n --nv-fieldradio-border-hover: var(--nv-fieldradio-border-default);\n --nv-fieldradio-border-focus: var(--components-form-field-border-error);\n --nv-fieldradio-background-checked: var(--components-form-field-background-error);\n --nv-fieldradio-focus-box-shadow: var(--color-focus-destructive);\n --nv-fieldradio-dot-color-checked: var(--components-form-shape-foreground-default);\n --nv-fieldradio-dot-color-disabled: var(--components-form-field-border-error);\n --nv-fieldradio-outline-color: var(--color-focus-destructive);\n\n}\n\n@mixin root-styles() {\n display: inline-flex;\n align-items: flex-start;\n gap: var(--form-gap-x);\n\n &:not([disabled]),\n &[disabled=\"false\"] {\n input,\n label {\n cursor: pointer;\n }\n }\n}\n\n@mixin label-before-styles() {\n flex-direction: row-reverse;\n}\n\n@mixin label-styles() {\n align-self: stretch;\n color: var(--components-form-text-label-default);\n font-family: \"TT Norms Pro\", sans-serif;\n font-size: var(--form-label-font-size);\n font-style: normal;\n font-weight: var(--form-label-font-weight);\n line-height: var(--form-label-line-height);\n}\n\n@mixin description-styles() {\n align-self: stretch;\n color: var(--components-form-text-description-default);\n font-family: \"TT Norms Pro\", sans-serif;\n font-size: var(--form-description-font-size);\n font-style: normal;\n font-weight: var(--form-description-font-weight);\n line-height: var(--form-description-line-height);\n}\n\n@mixin error-description-styles() {\n @include description-styles();\n\n color: var(--components-form-text-description-error);\n}\n\n@mixin text-container-styles() {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n flex: 1 0 0;\n}\n\n@mixin input-styles() {\n appearance: none;\n position: relative;\n display: flex;\n width: var(--form-radio-size);\n height: var(--form-radio-size);\n padding: var(--form-radio-inner-circle-padding);\n flex-direction: column;\n align-items: flex-start;\n //gap: 10px;\n border-radius: var(--radius-rounded-full);\n border-width: var(--form-radio-border-width);\n border-style: solid;\n border-color: var(--nv-fieldradio-border-default);\n background: var(--nv-fieldradio-background-default);\n\n &:hover {\n border-color: var(--nv-fieldradio-border-hover);\n }\n\n &:focus {\n border-color: var(--nv-fieldradio-border-focus);\n }\n\n @include focus-ring(var(--nv-fieldradio-outline-color));\n\n &:checked {\n background: var(--nv-fieldradio-background-checked);\n border-color: var(--nv-fieldradio-background-checked);\n\n &:hover,\n &:focus {\n border-color: var(--nv-fieldradio-background-checked);\n background: var(--nv-fieldradio-background-checked);\n }\n\n &::before {\n content: \"\";\n position: absolute;\n top: 50%;\n right: 50%;\n transform: translate(50%, -50%);\n left: 0;\n width: var(--form-radio-inner-circle-size);\n height: var(--form-radio-inner-circle-size);\n flex-shrink: 0;\n border-radius: var(--radius-rounded-full);\n background: var(--nv-fieldradio-dot-color-checked);\n }\n }\n\n &:disabled {\n border-radius: var(--radius-rounded-full);\n border-width: var(--form-radio-border-width);\n border-style: solid;\n border-color: var(--nv-fieldradio-border-default);\n background: var(--nv-fieldradio-background-disabled);\n\n &:checked {\n &::before {\n background: var(--nv-fieldradio-dot-color-disabled);\n }\n }\n\n &:hover {\n border-color: var(--nv-fieldradio-border-default);\n background: var(--nv-fieldradio-background-disabled);\n }\n }\n}\n\nnv-fieldradio {\n @include fieldradio-variables();\n @include root-styles();\n\n &.error {\n @include fieldradio-error-variables();\n }\n\n &.label-placement-before {\n @include label-before-styles();\n }\n \n &[disabled] {\n // TODO: Find a way to use the --components-form-opacity-disabled variable properly, right now it outputs a value of 50px instead of 0.5.\n // opacity: var(--components-form-opacity-disabled); Error: Invalid value for --components-form-opacity-disabled (expected a <number> but got \"50px\")\n opacity: 0.5;\n }\n\n label {\n @include label-styles();\n }\n\n input[type=\"radio\"] {\n @include input-styles();\n }\n\n .description {\n @include description-styles();\n }\n\n .error-description {\n @include error-description-styles();\n }\n\n .text-container {\n @include text-container-styles();\n }\n}\n","import {\n Component,\n Host,\n h,\n Prop,\n Event,\n EventEmitter,\n Listen,\n Watch,\n Element,\n} from '@stencil/core';\nimport clsx from 'clsx';\nimport { v4 as uuidv4 } from 'uuid';\n\nimport { type LabelPlacement } from '../../utils/constants';\n\n/**\n * @slot label - Content to be placed as the label, will override the label prop.\n * @slot description - Content to be placed as the description, will override the description prop.\n * @slot error-description - Content to be placed as the error description, will override the errorDescription prop.\n */\n@Component({\n tag: 'nv-fieldradio',\n shadow: false,\n styleUrl: 'nv-fieldradio.scss',\n formAssociated: true,\n})\nexport class NvFieldradio {\n @Element() el: HTMLNvFieldradioElement;\n\n /****************************************************************************/\n //#region DEPRECATED\n\n /**\n * Adds a helpful hint message below the label\n * @deprecated use description instead.\n */\n @Prop({ reflect: true })\n readonly message: string;\n\n /**\n * Set the label placement to before the input\n * @deprecated use labelPlacement instead.\n */\n @Prop({ reflect: true })\n readonly labelBefore: boolean = false;\n\n componentWillRender() {\n if (this.message) {\n this.description = this.message;\n }\n\n if (this.labelBefore) {\n this.labelPlacement = 'before';\n }\n }\n\n //#endregion DEPRECATED\n /****************************************************************************/\n //#region PROPERTIES\n\n /**\n * Sets the ID for the radio button’s input element and the for attribute of\n * the associated label. If no ID is provided, a random one will be\n * automatically generated to ensure unique identification, facilitating\n * proper label association and accessibility.\n */\n @Prop({ reflect: true })\n readonly inputId: string = uuidv4();\n\n /**\n * Use this to assign a group name to your radio buttons. When you have\n * multiple radio buttons with the same name, users will be able to select\n * only one option within that group, making your forms more organized and\n * user-friendly.\n */\n @Prop({ reflect: true })\n readonly name: string;\n\n /**\n * Defines what data will be sent when the radio button is selected.\n * This helps you identify which option the user has chosen in your form,\n * ensuring accurate data collection. When the form is submitted, the data\n * will consist of a name=value pair.\n */\n @Prop({ reflect: true })\n readonly value: string;\n\n /**\n * Sets the text content that is rendered next to the input element of type\n * radio. This label is essential for accessibility and user clarity, as it\n * describes the purpose or option of the radio button.\n */\n @Prop({ reflect: true })\n readonly label: string;\n\n /**\n * Defines the position of the label relative to the radio button.\n */\n @Prop({ mutable: true, reflect: true })\n labelPlacement: `${LabelPlacement}`;\n\n /**\n * Adds a helpful hint message below the label. This description provides\n * extra information or context about the radio button option, assisting users\n * in making more informed choices.\n */\n @Prop({ mutable: true, reflect: true })\n description: string;\n\n /**\n * Highlight the radio button with error styling. It helps users quickly\n * identify which option needs attention, improving their form-filling\n * experience by making issues more visible.\n * @validator error\n */\n @Prop({ reflect: true })\n readonly error: boolean = false;\n\n /**\n * A description that appears when there is an error related to the radio\n * button.\n * @validator message\n */\n @Prop({ reflect: true })\n readonly errorDescription: string;\n\n /**\n * Controls whether the radio button is selected.\n */\n @Prop({ mutable: true, reflect: true })\n checked: boolean = false;\n\n /**\n * Disables the radio button, making it un-selectable.\n */\n @Prop({ reflect: true })\n readonly disabled: boolean = false;\n\n /**\n * Applies focus to the input field as soon as the component is mounted. This\n * is equivalent to setting the native autofocus attribute on an <input>\n * element.\n */\n @Prop({ reflect: true })\n // eslint-disable-next-line @stencil-community/reserved-member-names\n readonly autofocus: boolean = false;\n\n //#endregion PROPERTIES\n /****************************************************************************/\n //#region EVENTS\n\n /**\n * Emits when the checked state changes.\n * @bind checked\n */\n @Event()\n checkedChanged: EventEmitter<boolean>;\n\n //#endregion EVENTS\n /****************************************************************************/\n //#region WATCHERS\n\n /**\n * Watches for changes to the checked state and emits the new value.\n * @param {boolean} checked - The new value of the checked state.\n */\n @Watch('checked')\n handleCheckedChange(checked: boolean) {\n this.checkedChanged.emit(checked);\n }\n\n /**\n * Listens for the change event on the radio button input element and controls\n * the checked state of the host elements.\n * @param {Event} event - The change event.\n */\n @Listen('change')\n handleChange(event: Event) {\n const target = event.target as HTMLInputElement;\n\n if (target?.type === 'radio') {\n Array.from(document.getElementsByTagName('nv-fieldradio')).forEach(\n element => {\n if (element.name === this.name) {\n element.checked = false;\n }\n },\n );\n\n this.checked = target.checked;\n }\n }\n\n //#endregion WATCHERS\n /****************************************************************************/\n //#region RENDER\n\n render() {\n return (\n <Host\n class={clsx(\n this.labelPlacement === 'before' && 'label-placement-before',\n this.error && 'error',\n )}\n >\n <input\n type=\"radio\"\n id={this.inputId}\n name={this.name}\n autofocus={this.autofocus}\n autocomplete=\"off\"\n value={this.value}\n checked={this.checked}\n disabled={this.disabled}\n />\n\n <div class=\"text-container\">\n {(this.label || this.el.querySelector('[slot=\"label\"]')) && (\n <label htmlFor={this.inputId}>\n <slot name=\"label\">{this.label}</slot>\n </label>\n )}\n\n {(this.description ||\n this.el.querySelector('[slot=\"description\"]')) && (\n <div class=\"description\">\n <slot name=\"description\">{this.description}</slot>\n </div>\n )}\n\n {(this.errorDescription ||\n this.el.querySelector('[slot=\"error-description\"]')) && (\n <div hidden={!this.error} class=\"error-description\">\n <slot name=\"error-description\">{this.errorDescription}</slot>\n </div>\n )}\n </div>\n </Host>\n );\n }\n\n //#endregion RENDER\n}\n"],"mappings":"wIAAA,MAAMA,EAAkB,gtJACxB,MAAAC,EAAeD,E,MC0BFE,EAAY,MANzB,WAAAC,CAAAC,G,yDAwBWC,KAAAC,YAAuB,MAuBvBD,KAAAE,QAAkBC,IAiDlBH,KAAAI,MAAiB,MAc1BJ,KAAAK,QAAmB,MAMVL,KAAAM,SAAoB,MASpBN,KAAAO,UAAqB,K,CAnG9B,mBAAAC,GACE,GAAIR,KAAKS,QAAS,CAChBT,KAAKU,YAAcV,KAAKS,O,CAG1B,GAAIT,KAAKC,YAAa,CACpBD,KAAKW,eAAiB,Q,EAmH1B,mBAAAC,CAAoBP,GAClBL,KAAKa,eAAeC,KAAKT,E,CAS3B,YAAAU,CAAaC,GACX,MAAMC,EAASD,EAAMC,OAErB,IAAIA,IAAM,MAANA,SAAM,SAANA,EAAQC,QAAS,QAAS,CAC5BC,MAAMC,KAAKC,SAASC,qBAAqB,kBAAkBC,SACzDC,IACE,GAAIA,EAAQC,OAASzB,KAAKyB,KAAM,CAC9BD,EAAQnB,QAAU,K,KAKxBL,KAAKK,QAAUY,EAAOZ,O,EAQ1B,MAAAqB,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAOC,EACL/B,KAAKW,iBAAmB,UAAY,yBACpCX,KAAKI,OAAS,UAGhBuB,EAAA,SAAAE,IAAA,2CACEX,KAAK,QACLc,GAAIhC,KAAKE,QACTuB,KAAMzB,KAAKyB,KACXlB,UAAWP,KAAKO,UAChB0B,aAAa,MACbC,MAAOlC,KAAKkC,MACZ7B,QAASL,KAAKK,QACdC,SAAUN,KAAKM,WAGjBqB,EAAA,OAAAE,IAAA,2CAAKC,MAAM,mBACP9B,KAAKmC,OAASnC,KAAKoC,GAAGC,cAAc,oBACpCV,EAAA,SAAAE,IAAA,2CAAOS,QAAStC,KAAKE,SACnByB,EAAA,QAAAE,IAAA,2CAAMJ,KAAK,SAASzB,KAAKmC,SAI3BnC,KAAKU,aACLV,KAAKoC,GAAGC,cAAc,0BACtBV,EAAA,OAAAE,IAAA,2CAAKC,MAAM,eACTH,EAAA,QAAAE,IAAA,2CAAMJ,KAAK,eAAezB,KAAKU,eAIjCV,KAAKuC,kBACLvC,KAAKoC,GAAGC,cAAc,gCACtBV,EAAA,OAAAE,IAAA,2CAAKW,QAASxC,KAAKI,MAAO0B,MAAM,qBAC9BH,EAAA,QAAAE,IAAA,2CAAMJ,KAAK,qBAAqBzB,KAAKuC,oB","ignoreList":[]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{h as e,r as i,c as r,H as t,g as n}from"./p-d0a33e64.js";import{v as s}from"./p-f5ff676c.js";function a(e){if(Number.isInteger(e))return 0;const i=e.toString();const r=i.split(".")[1];return r?r.length:0}function o(e,i,r){return Math.max(i,Math.min(r,e))}function l(e,i,r){if(r===i)return 0;return(e-i)/(r-i)*100}function d(e,i,r,t){const n=o(e,i,r);const s=a(t);if(s>0){const e=Math.pow(10,s);const a=Math.round((n-i)*e);const l=Math.round(t*e);const d=Math.round(a/l);const c=d*l;const f=i+c/e;return o(parseFloat(f.toFixed(s)),i,r)}const l=(n-i)/t;const d=Math.round(l);const c=i+d*t;return o(c,i,r)}function c(e,i,r){const t=[];for(let n=e;n<=i;n+=r){t.push(Number(n.toFixed(10)))}if(t[t.length-1]!==i){t.push(i)}return t}function f(e,i){if(!i||i.length===0)return e;let r=i[0].value;let t=Math.abs(e-r);for(const n of i){const i=Math.abs(e-n.value);if(i<t){t=i;r=n.value}}return r}function h(e,i){const r=a(i);if(r>0){return e.toFixed(r)}return String(e)}const u=i=>{const{value:r,min:t,max:n,step:s,rawPosition:a,isDragging:d,snap:c,disabled:f,readonly:u,onKeyDown:v,labelBeforeValue:b,labelAfterValue:p}=i;let m=r;if(d&&!c){m=o(a,t,n)}const k=l(m,t,n);return e("div",{class:"thumb",style:{left:`${k}%`},role:"slider","aria-valuemin":t,"aria-valuemax":n,"aria-valuenow":r,"aria-disabled":f?"true":undefined,"aria-readonly":u?"true":undefined,tabindex:f?-1:0,onKeyDown:v},e("div",{class:"thumb-tooltip"},b&&e("span",{class:"label-before"},b),h(r,s),p&&e("span",{class:"label-after"},p)))};const v=i=>{const{rangeValue:r,rawRangePosition:t,activeDragThumb:n,isDragging:s,snap:a,min:d,max:c,step:f,disabled:u,readonly:v,onKeyDown:b,labelBeforeValue:p,labelAfterValue:m}=i;const[k,g]=r;let y=k;let x=g;if(s&&!a){const[e,i]=t;if(n==="left"){y=o(e,d,Math.min(g,c))}else if(n==="right"){x=o(i,Math.max(k,d),c)}}const w=l(y,d,c);const V=l(x,d,c);return[e("div",{class:"track-range",style:{left:`${w}%`,width:`${V-w}%`}}),e("div",{class:"thumb thumb-left",style:{left:`${w}%`},role:"slider","aria-valuemin":d,"aria-valuemax":c,"aria-valuenow":k,"aria-disabled":u?"true":undefined,"aria-readonly":v?"true":undefined,"data-thumb":"left",tabindex:u?-1:0,onKeyDown:b},e("div",{class:"thumb-tooltip"},p&&e("span",{class:"label-before"},p),h(k,f),m&&e("span",{class:"label-after"},m))),e("div",{class:"thumb thumb-right",style:{left:`${V}%`},role:"slider","aria-valuemin":d,"aria-valuemax":c,"aria-valuenow":g,"aria-disabled":u?"true":undefined,"aria-readonly":v?"true":undefined,"data-thumb":"right",tabindex:u?-1:0,onKeyDown:b},e("div",{class:"thumb-tooltip"},p&&e("span",{class:"label-before"},p),h(g,f),m&&e("span",{class:"label-after"},m)))]};const b=i=>{const{ticks:r,min:t,max:n}=i;if(r.length===0){return null}return e("div",{class:"track-ticks"},r.map((i=>{const r=l(i.value,t,n);return e("div",{class:"track-tick",style:{left:`${r}%`}},i.label&&e("div",{class:"tick-label"},i.label))})))};const p=i=>{const{range:r,hasField:t,value:n,rangeValue:s,index:a,inputId:o,min:l,max:d,step:c,disabled:f,readonly:h,onInput:u,labelBeforeValue:v,labelAfterValue:b,name:p,endName:m}=i;const k=r?s[a]:n;const g=r?{"data-index":a.toString()}:{};let y;if(r){if(a===0){y=p||""}else{y=m||(p?`${p}-end`:"")}}else{y=p||""}const x=t?"input-container":"input-container hidden-input";return t?e("div",{class:x},e("nv-fieldnumber",Object.assign({id:o,value:k,min:l,max:d,step:c,disabled:f,readonly:h,name:y},g,{onInput:u}),v&&e("span",{class:"label-before",slot:"leading-input"},v),b&&e("span",{class:"label-after",slot:"trailing-input"},b))):e("input",{id:o,type:"hidden",value:k,disabled:f,readonly:h,name:y})};const m='nv-fieldslider .slider-container .track-container:has(.thumb:hover) .track-range{background:var(--components-slider-track-filled-hover)}nv-fieldslider .slider-container .track-container:has(.thumb:hover) .thumb{border-color:var(--components-slider-track-filled-hover)}nv-fieldslider .slider-container .track-container:has(.thumb:focus) .track-range{background:var(--components-slider-track-filled-focus)}nv-fieldslider .slider-container .track-container:has(.thumb:focus) .thumb{border-color:var(--components-slider-track-filled-focus)}nv-fieldslider[error] .slider-container .track-container .track .track-range{background:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container .track .thumb{border-color:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container .track .thumb:hover{border-color:var(--components-slider-track-filled-error);outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-slider-track-filled-error);outline-offset:calc(var(--focus-outline-offset) * 1);background-color:var(--components-slider-handler-background-error)}nv-fieldslider[error] .slider-container .track-container .track .thumb:focus{border-color:var(--components-slider-track-filled-error);outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-slider-track-filled-error);outline-offset:calc(var(--focus-outline-offset) * 1);background-color:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container:has(.thumb:hover) .track-range{background:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container:has(.thumb:hover) .thumb{border-color:var(--components-slider-track-filled-error)}nv-fieldslider{--nv-field-border-default:var(--components-form-field-border-default);--nv-field-border-hover:var(--components-form-field-border-hover);--nv-field-border-focus:var(--components-form-field-border-focus);--nv-field-border-disabled:var(--components-form-field-border-default);--nv-field-border-readonly:var(--components-form-field-border-default);--nv-field-focus-box-shadow:var(--color-focus-brand);--nv-field-background:var(--components-form-field-background-default);display:flex;flex-direction:column;align-items:flex-start;gap:var(--form-gap-y);box-sizing:border-box;max-width:480px}nv-fieldslider .slider-container{width:100%;display:flex;flex-direction:row;align-items:center;gap:var(--form-gap-x)}nv-fieldslider .slider-container .track-container{position:relative;flex:1;height:calc(var(--slider-handler-size-min) + 0.25rem);padding:calc(var(--slider-handler-size-min) / 2) 0}nv-fieldslider .slider-container .track-container .track{position:relative;height:var(--slider-track-height);background:var(--components-slider-track-background);border-radius:var(--slider-track-radius);cursor:pointer}nv-fieldslider .slider-container .track-container .track .track-range{position:absolute;top:0;height:var(--slider-track-height);background:var(--components-slider-track-filled-default);border-radius:var(--slider-track-radius);pointer-events:none}nv-fieldslider .slider-container .track-container .track .thumb{position:absolute;top:50%;width:var(--slider-handler-size-min);height:var(--slider-handler-size-min);background:#ffffff;border:var(--slider-handler-stroke) solid var(--components-slider-track-filled-default);border-radius:50%;transform:translate(-50%, -50%);z-index:1;cursor:grab;transition:width 0.2s, height 0.2s, box-shadow 0.2s, background-color 0.2s}nv-fieldslider .slider-container .track-container .track .thumb:hover{width:var(--slider-handler-size-max);height:var(--slider-handler-size-max);border-color:var(--components-slider-track-filled-hover)}nv-fieldslider .slider-container .track-container .track .thumb:focus{width:var(--slider-handler-size-min);height:var(--slider-handler-size-min);border-color:var(--components-slider-track-filled-focus);outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1);transition:outline;background:var(--components-slider-handler-background-focus)}nv-fieldslider .slider-container .track-container .track .thumb:active{cursor:grabbing;background:var(--components-slider-handler-background-hover)}nv-fieldslider .slider-container .track-container .track .thumb .thumb-tooltip{position:absolute;top:25px;left:50%;background-color:var(--components-tooltip-background);color:var(--components-tooltip-text);padding:5px;border-radius:var(--tooltip-radius);font-size:var(--tooltip-font-size);z-index:10;pointer-events:none;user-select:none;opacity:0;transition:opacity 0.3s ease-in-out;transform:translateX(-50%)}nv-fieldslider .slider-container .track-container .track .thumb .thumb-tooltip:after{content:"";background:var(--components-tooltip-background);box-shadow:none;border:none;position:absolute;border-bottom-color:transparent;border-right-color:transparent;width:6px;height:6px;transform:rotate(45deg);border-radius:1px;top:-3px;left:50%;margin-left:-3px}nv-fieldslider .slider-container .track-container .track .thumb:hover .thumb-tooltip,nv-fieldslider .slider-container .track-container .track .thumb:active .thumb-tooltip,nv-fieldslider .slider-container .track-container .track .thumb:focus .thumb-tooltip{opacity:1}nv-fieldslider .slider-container .track-container .track-ticks{position:relative;height:1rem;margin-top:0.25rem}nv-fieldslider .slider-container .track-container .track-ticks .track-tick{position:absolute;top:0;width:var(--slider-tick-height);height:var(--slider-tick-height);background:var(--components-form-field-border-default);border-radius:50%;transform:translate(-50%, 0);pointer-events:none}nv-fieldslider .slider-container .track-container .track-ticks .track-tick:first-of-type{transform:translate(0, 0)}nv-fieldslider .slider-container .track-container .track-ticks .track-tick:last-of-type{transform:translate(-100%, 0)}nv-fieldslider .slider-container .track-container .track-ticks .track-tick .tick-label{position:absolute;top:calc(var(--slider-tick-height) + 0.25rem);left:50%;color:var(--components-form-field-border-default);transform:translateX(-50%);white-space:nowrap}.track-tick-first nv-fieldslider .slider-container .track-container .track-ticks .track-tick .tick-label{left:0;transform:translateX(0)}.track-tick-last nv-fieldslider .slider-container .track-container .track-ticks .track-tick .tick-label{left:100%;transform:translateX(-100%)}nv-fieldslider .slider-container .input-container{display:flex;flex-grow:1;justify-content:center;align-items:center;align-self:stretch;border-radius:var(--form-field-radius);border-width:1px;border-style:solid;border-color:var(--nv-field-border-default);opacity:var(--components-form-opacity-default, 1);background:var(--nv-field-background);transition:all 150ms ease-out;width:90px;flex-grow:unset}nv-fieldslider .slider-container .input-container:hover{border-color:var(--nv-field-border-hover)}nv-fieldslider .slider-container .input-container:focus-within,nv-fieldslider .slider-container .input-container:focus-within:hover,nv-fieldslider .slider-container .input-container:focus,nv-fieldslider .slider-container .input-container:focus:hover{border-color:var(--nv-field-border-focus);box-shadow:0px 0px 0px var(--focus-field-stroke) var(--nv-field-focus-box-shadow)}nv-fieldslider .slider-container .input-container:has(input:read-only){opacity:0.5;background-color:var(--components-form-field-background-readonly);border-color:var(--nv-field-border-readonly)}nv-fieldslider .slider-container .input-container:has(input:disabled){opacity:0.5;background-color:var(--components-form-field-background-disabled);border-color:var(--nv-field-border-disabled)}nv-fieldslider .slider-container .input-container input{display:flex;align-items:center;flex:1 0 0;overflow:hidden;background-color:transparent;color:var(--components-form-field-content-text);padding:var(--form-field-padding-y) var(--form-field-padding-x);font-size:var(--form-field-font-size);font-style:normal;font-weight:500;line-height:var(--form-field-line-height);width:100%;}nv-fieldslider .slider-container .input-container input:focus{outline:none}nv-fieldslider .slider-container .input-container input::placeholder{overflow:hidden;color:var(--components-form-field-content-placeholder);text-overflow:ellipsis;font-family:"TT Norms Pro", sans-serif;font-size:var(--form-field-font-size);font-style:normal;font-weight:400;line-height:var(--form-field-line-height)}nv-fieldslider .slider-container .input-container input[type=password]::-ms-clear,nv-fieldslider .slider-container .input-container input[type=password]::-ms-reveal{display:none;width:0;height:0}nv-fieldslider .slider-container .input-container .label-before{margin-left:var(--spacing-2);color:var(--components-form-field-icon-default)}nv-fieldslider .slider-container .input-container .label-after{margin-right:var(--spacing-2);color:var(--components-form-field-icon-default)}nv-fieldslider[fluid]:not([fluid=false]){max-width:unset}nv-fieldslider[error]:not([error=false]){--nv-field-border-default:var(--components-form-field-border-error);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--nv-field-border-default);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-focus-box-shadow:var(--color-focus-destructive-in-field)}nv-fieldslider[success]:not([success=false]){--nv-field-border-default:var(--components-form-field-border-success);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--nv-field-border-default);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-focus-box-shadow:var(--color-focus-success)}nv-fieldslider[readonly]:not([readonly=false]){--nv-field-border-default:var(--components-form-field-border-readonly);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--components-form-field-border-focus);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-background:var(--components-form-field-background-readonly)}nv-fieldslider[readonly]:not([readonly=false]) .track,nv-fieldslider[readonly]:not([readonly=false]) .thumb{cursor:default}nv-fieldslider label{display:flex;align-items:center;gap:var(--form-label-gap);align-self:stretch;color:var(--components-form-text-label-default);font-family:"TT Norms Pro", sans-serif;font-size:var(--form-label-font-size);font-style:normal;font-weight:500;line-height:var(--form-label-line-height)}nv-fieldslider nv-icon.validation{color:var(--nv-field-border-default)}nv-fieldslider[hide-label]:not([hide-label=false]) label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}nv-fieldslider[has-field]:not([has-field=false]) .thumb-tooltip{display:none}nv-fieldslider>.description{display:flex;align-items:center;align-self:stretch;gap:var(--spacing-1);color:var(--components-form-text-description-default);font-family:"TT Norms Pro", sans-serif;font-size:var(--form-description-font-size);font-style:normal;line-height:var(--form-description-line-height)}nv-fieldslider>.error-description{display:flex;align-items:center;align-self:stretch;gap:var(--spacing-1);color:var(--components-form-text-description-default);font-family:"TT Norms Pro", sans-serif;font-size:var(--form-description-font-size);font-style:normal;line-height:var(--form-description-line-height);color:var(--components-form-text-description-error)}nv-fieldslider>.error-description[hidden]{display:none}';const k=m;const g=class{constructor(e){i(this,e);this.valueChanged=r(this,"valueChanged",7);this.startInputId=s();this.endInputId=s();this.hideLabel=false;this.hasField=false;this.range=false;this.disabled=false;this.readonly=false;this.error=false;this.success=false;this.value=[0];this.step=1;this.snap=false;this.snapTicks=false;this.min=0;this.max=100;this.showTicks=false;this.fluid=false;this.isDragging=false;this.activeDragThumb="single";this.internalTicks=[];this.rawPosition=0;this.rawRangePosition=[0,0];this.valueInternal=0;this.rangeValueInternal=[0,0];this.parseValue=()=>{if(typeof this.value==="string"){console.error("Sliders require a number or array of numbers to be passed in the value prop.");return}if(this.range&&this.value.length!==2){console.error("Range sliders require an array of two values to be passed in the value prop.");return}if(!this.range&&this.value.length!==1){console.error("Single sliders require a single value as an array to be passed in the value prop.");return}this.valueInternal=this.value[0];this.rangeValueInternal=[this.value[0],this.value[1]]};this.onTrackInteraction=e=>{if(this.disabled||this.readonly){return}const i=e.currentTarget.getBoundingClientRect();const r=o((e.clientX-i.left)/i.width*100,0,100);const t=this.min+r/100*(this.max-this.min);this.rawPosition=t;if(this.range){const e=l(this.rangeValueInternal[0],this.min,this.max);const i=l(this.rangeValueInternal[1],this.min,this.max);const n=Math.abs(r-e);const s=Math.abs(r-i);if(n<=s){this.activeDragThumb="left";this.rawRangePosition=[t,this.rawRangePosition[1]];this.handleValueChange([t,this.rangeValueInternal[1]])}else{this.activeDragThumb="right";this.rawRangePosition=[this.rawRangePosition[0],t];this.handleValueChange([this.rangeValueInternal[0],t])}}else{this.activeDragThumb="single";this.rawPosition=t;this.handleValueChange(t)}this.isDragging=true;this.registerGlobalEvents()};this.onPointerMove=e=>{if(!this.isDragging||this.disabled||this.readonly){return}const i=this.el.querySelector(".track");if(!i)return;const r=i.getBoundingClientRect();const t=o((e.clientX-r.left)/r.width*100,0,100);const n=this.min+t/100*(this.max-this.min);if(this.range){if(this.activeDragThumb==="left"){this.rawRangePosition=[n,this.rawRangePosition[1]];this.handleValueChange([n,this.rangeValueInternal[1]])}else{this.rawRangePosition=[this.rawRangePosition[0],n];this.handleValueChange([this.rangeValueInternal[0],n])}}else{this.rawPosition=n;this.handleValueChange(n)}};this.onPointerUp=()=>{this.isDragging=false;this.removeGlobalEvents()};this.onKeyDown=e=>{if(this.disabled||this.readonly){return}let i;const r=e.shiftKey?10:1;const t=this.step*r;if(this.range){const r=e.target.getAttribute("data-thumb");const n=r==="left"?0:1;const s=[...this.rangeValueInternal];switch(e.key){case"ArrowRight":case"ArrowUp":s[n]+=t;break;case"ArrowLeft":case"ArrowDown":s[n]-=t;break;case"Home":s[n]=this.min;break;case"End":s[n]=this.max;break;case"PageUp":s[n]+=t*10;break;case"PageDown":s[n]-=t*10;break;default:return}i=s}else{switch(e.key){case"ArrowRight":case"ArrowUp":i=this.valueInternal+t;break;case"ArrowLeft":case"ArrowDown":i=this.valueInternal-t;break;case"Home":i=this.min;break;case"End":i=this.max;break;case"PageUp":i=this.valueInternal+t*10;break;case"PageDown":i=this.valueInternal-t*10;break;default:return}}e.preventDefault();this.handleValueChange(i)};this.handleFieldChange=e=>{const i=e.target;const r=parseFloat(i.value);if(isNaN(r)){return}if(this.range){const e=i.getAttribute("data-index")==="0"?0:1;const t=[...this.rangeValueInternal];t[e]=r;this.handleValueChange(t)}else{this.handleValueChange(r)}}}validateValue(e){const i=o(e,this.min,this.max);if(this.snapTicks&&this.internalTicks&&this.internalTicks.length>0){return f(i,this.internalTicks)}return d(i,this.min,this.max,this.step)}handleValueChange(e){if(this.disabled||this.readonly){return}if(this.range){if(Array.isArray(e)&&e.length===2){const i=[Math.min(e[0],e[1]),Math.max(e[0],e[1])];const r=[this.validateValue(i[0]),this.validateValue(i[1])];if(r[0]!==this.rangeValueInternal[0]||r[1]!==this.rangeValueInternal[1]){this.rangeValueInternal=r;this.value=this.rangeValueInternal;this.valueChanged.emit(this.rangeValueInternal)}}}else{if(typeof e==="number"){const i=this.validateValue(e);if(i!==this.valueInternal){this.valueInternal=i;this.value=[this.valueInternal];this.valueChanged.emit([this.valueInternal])}}}}generateDisplayTicks(){if(this.ticks&&this.ticks.length>0){this.internalTicks=[...this.ticks].sort(((e,i)=>e.value-i.value));return}if(!this.showTicks){this.internalTicks=[];return}const e=c(this.min,this.max,this.step);this.internalTicks=e.map((e=>({value:e})))}registerGlobalEvents(){document.addEventListener("pointermove",this.onPointerMove);document.addEventListener("pointerup",this.onPointerUp);document.addEventListener("pointercancel",this.onPointerUp)}removeGlobalEvents(){document.removeEventListener("pointermove",this.onPointerMove);document.removeEventListener("pointerup",this.onPointerUp);document.removeEventListener("pointercancel",this.onPointerUp)}onValueChange(){this.parseValue()}onConfigChange(){this.generateDisplayTicks();if(this.range){this.handleValueChange(this.rangeValueInternal)}else{this.handleValueChange(this.valueInternal)}}onRangeChange(e){if(e){this.rangeValueInternal=[this.min,this.valueInternal]}else{this.valueInternal=this.rangeValueInternal[1]}}connectedCallback(){this.parseValue();this.generateDisplayTicks();if(this.range){if(!Array.isArray(this.rangeValueInternal)||this.rangeValueInternal.length!==2){this.rangeValueInternal=[this.min,this.max]}this.handleValueChange(this.rangeValueInternal);this.rawRangePosition=[this.rangeValueInternal[0],this.rangeValueInternal[1]]}else{this.handleValueChange(this.valueInternal);this.rawPosition=this.valueInternal}}componentWillLoad(){if(this.value.length===1&&this.range){this.value=[this.value[0],this.value[0]]}else if(this.value.length===2&&!this.range){this.value=[this.value[0]]}}disconnectedCallback(){this.removeGlobalEvents()}render(){return e(t,{key:"d255ebffd908e0b64a9d80316de351c5a35fc230"},(this.label||this.el.querySelector('[slot="label"]'))&&e("label",{key:"e618f586707865f67d4008855299d4983b2bbb9d",htmlFor:this.startInputId},e("slot",{key:"fb9131f051ad669a797b5784f1cceee2169f8b8f",name:"label"},this.label)),e("div",{key:"37147af53e7e0a0145f543c2a1070378e41e6605",class:"slider-container"},this.range?e(p,{range:this.range,hasField:this.hasField,value:this.valueInternal,rangeValue:this.rangeValueInternal,index:0,inputId:this.startInputId,min:this.min,max:this.max,step:this.step,disabled:this.disabled,readonly:this.readonly,onInput:this.handleFieldChange,labelBeforeValue:this.labelBeforeValue,labelAfterValue:this.labelAfterValue,name:this.name,endName:this.endName}):null,e("div",{key:"64a7232e46499efb355deea683113042bc745ae0",class:"track-container"},e("div",{key:"b9f5f5dc7f5e98aaa44b6e361786804af1a9798c",class:"track",onPointerDown:this.onTrackInteraction},this.range?e(v,{rangeValue:this.rangeValueInternal,rawRangePosition:this.rawRangePosition,activeDragThumb:this.activeDragThumb,isDragging:this.isDragging,snap:this.snap,min:this.min,max:this.max,step:this.step,disabled:this.disabled,readonly:this.readonly,onKeyDown:this.onKeyDown,labelBeforeValue:this.labelBeforeValue,labelAfterValue:this.labelAfterValue}):e(u,{value:this.valueInternal,min:this.min,max:this.max,step:this.step,rawPosition:this.rawPosition,isDragging:this.isDragging,snap:this.snap,disabled:this.disabled,readonly:this.readonly,onKeyDown:this.onKeyDown,labelBeforeValue:this.labelBeforeValue,labelAfterValue:this.labelAfterValue})),e(b,{key:"40e2bc4b91cf40a1d0c7e1f126b092f9d149912b",ticks:this.internalTicks,min:this.min,max:this.max})),this.range?e(p,{range:this.range,hasField:this.hasField,value:this.valueInternal,rangeValue:this.rangeValueInternal,index:1,inputId:this.endInputId,min:this.min,max:this.max,step:this.step,disabled:this.disabled,readonly:this.readonly,onInput:this.handleFieldChange,labelBeforeValue:this.labelBeforeValue,labelAfterValue:this.labelAfterValue,name:this.name,endName:this.endName}):e(p,{range:this.range,hasField:this.hasField,value:this.valueInternal,rangeValue:this.rangeValueInternal,inputId:this.startInputId,min:this.min,max:this.max,step:this.step,disabled:this.disabled,readonly:this.readonly,onInput:this.handleFieldChange,labelBeforeValue:this.labelBeforeValue,labelAfterValue:this.labelAfterValue,name:this.name})),(this.success||this.description||this.el.querySelector('[slot="description"]'))&&e("div",{key:"830b5921d75ee627002ef19ddc7946948d1bb6a7",class:"description"},this.success&&e("nv-icon",{key:"451d013f7a3ffa19cb12df406187ec4001bbad2a",name:"circle-check",class:"validation",size:"md"}),e("slot",{key:"59f84a04d635db6ceb465a642d8584167bd0cd9d",name:"description"},this.description)),(this.error||this.errorDescription||this.el.querySelector('[slot="error-description"]'))&&e("div",{key:"10a5a273b0feeb9c0248b8aadcb801d7e832dcab",class:"error-description",hidden:!this.error},this.error&&e("nv-icon",{key:"7540ff563068f83701d82a8a948473b20351021f",name:"alert-circle",class:"validation",size:"md"}),e("slot",{key:"b76bfbbd817b15faf4f963f9c93c7d04cbbdade4",name:"error-description"},this.errorDescription)))}static get formAssociated(){return true}get el(){return n(this)}static get watchers(){return{value:["onValueChange"],min:["onConfigChange"],max:["onConfigChange"],step:["onConfigChange"],ticks:["onConfigChange"],showTicks:["onConfigChange"],snap:["onConfigChange"],snapTicks:["onConfigChange"],range:["onRangeChange"]}}};g.style=k;export{g as nv_fieldslider};
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{h as e,r as i,c as r,H as t,g as n}from"./p-d0a33e64.js";import{v as s}from"./p-f5ff676c.js";function a(e){if(Number.isInteger(e))return 0;const i=e.toString();const r=i.split(".")[1];return r?r.length:0}function o(e,i,r){return Math.max(i,Math.min(r,e))}function l(e,i,r){if(r===i)return 0;return(e-i)/(r-i)*100}function d(e,i,r,t){const n=o(e,i,r);const s=a(t);if(s>0){const e=Math.pow(10,s);const a=Math.round((n-i)*e);const l=Math.round(t*e);const d=Math.round(a/l);const c=d*l;const f=i+c/e;return o(parseFloat(f.toFixed(s)),i,r)}const l=(n-i)/t;const d=Math.round(l);const c=i+d*t;return o(c,i,r)}function c(e,i,r){const t=[];for(let n=e;n<=i;n+=r){t.push(Number(n.toFixed(10)))}if(t[t.length-1]!==i){t.push(i)}return t}function f(e,i){if(!i||i.length===0)return e;let r=i[0].value;let t=Math.abs(e-r);for(const n of i){const i=Math.abs(e-n.value);if(i<t){t=i;r=n.value}}return r}function h(e,i){const r=a(i);if(r>0){return e.toFixed(r)}return String(e)}const u=i=>{const{value:r,min:t,max:n,step:s,rawPosition:a,isDragging:d,snap:c,disabled:f,readonly:u,onKeyDown:v,labelBeforeValue:b,labelAfterValue:p}=i;let m=r;if(d&&!c){m=o(a,t,n)}const k=l(m,t,n);return e("div",{class:"thumb",style:{left:`${k}%`},role:"slider","aria-valuemin":t,"aria-valuemax":n,"aria-valuenow":r,"aria-disabled":f?"true":undefined,"aria-readonly":u?"true":undefined,tabindex:f?-1:0,onKeyDown:v},e("div",{class:"thumb-tooltip"},b&&e("span",{class:"label-before"},b),h(r,s),p&&e("span",{class:"label-after"},p)))};const v=i=>{const{rangeValue:r,rawRangePosition:t,activeDragThumb:n,isDragging:s,snap:a,min:d,max:c,step:f,disabled:u,readonly:v,onKeyDown:b,labelBeforeValue:p,labelAfterValue:m}=i;const[k,g]=r;let y=k;let x=g;if(s&&!a){const[e,i]=t;if(n==="left"){y=o(e,d,Math.min(g,c))}else if(n==="right"){x=o(i,Math.max(k,d),c)}}const w=l(y,d,c);const V=l(x,d,c);return[e("div",{class:"track-range",style:{left:`${w}%`,width:`${V-w}%`}}),e("div",{class:"thumb thumb-left",style:{left:`${w}%`},role:"slider","aria-valuemin":d,"aria-valuemax":c,"aria-valuenow":k,"aria-disabled":u?"true":undefined,"aria-readonly":v?"true":undefined,"data-thumb":"left",tabindex:u?-1:0,onKeyDown:b},e("div",{class:"thumb-tooltip"},p&&e("span",{class:"label-before"},p),h(k,f),m&&e("span",{class:"label-after"},m))),e("div",{class:"thumb thumb-right",style:{left:`${V}%`},role:"slider","aria-valuemin":d,"aria-valuemax":c,"aria-valuenow":g,"aria-disabled":u?"true":undefined,"aria-readonly":v?"true":undefined,"data-thumb":"right",tabindex:u?-1:0,onKeyDown:b},e("div",{class:"thumb-tooltip"},p&&e("span",{class:"label-before"},p),h(g,f),m&&e("span",{class:"label-after"},m)))]};const b=i=>{const{ticks:r,min:t,max:n}=i;if(r.length===0){return null}return e("div",{class:"track-ticks"},r.map((i=>{const r=l(i.value,t,n);return e("div",{class:"track-tick",style:{left:`${r}%`}},i.label&&e("div",{class:"tick-label"},i.label))})))};const p=i=>{const{range:r,hasField:t,value:n,rangeValue:s,index:a,inputId:o,min:l,max:d,step:c,disabled:f,readonly:h,onInput:u,labelBeforeValue:v,labelAfterValue:b,name:p,endName:m}=i;const k=r?s[a]:n;const g=r?{"data-index":a.toString()}:{};let y;if(r){if(a===0){y=p||""}else{y=m||(p?`${p}-end`:"")}}else{y=p||""}const x=t?"input-container":"input-container hidden-input";return t?e("div",{class:x},e("nv-fieldnumber",Object.assign({id:o,value:k,min:l,max:d,step:c,disabled:f,readonly:h,name:y},g,{onInput:u}),v&&e("span",{class:"label-before",slot:"leading-input"},v),b&&e("span",{class:"label-after",slot:"trailing-input"},b))):e("input",{id:o,type:"hidden",value:k,disabled:f,readonly:h,name:y})};const m='nv-fieldslider .slider-container .track-container:has(.thumb:hover) .track-range{background:var(--components-slider-track-filled-hover)}nv-fieldslider .slider-container .track-container:has(.thumb:hover) .thumb{border-color:var(--components-slider-track-filled-hover)}nv-fieldslider .slider-container .track-container:has(.thumb:focus) .track-range{background:var(--components-slider-track-filled-focus)}nv-fieldslider .slider-container .track-container:has(.thumb:focus) .thumb{border-color:var(--components-slider-track-filled-focus)}nv-fieldslider[error] .slider-container .track-container .track .track-range{background:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container .track .thumb{border-color:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container .track .thumb:hover{border-color:var(--components-slider-track-filled-error);outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-slider-track-filled-error);outline-offset:calc(var(--focus-outline-offset) * 1);background-color:var(--components-slider-handler-background-error)}nv-fieldslider[error] .slider-container .track-container .track .thumb:focus{border-color:var(--components-slider-track-filled-error);outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-slider-track-filled-error);outline-offset:calc(var(--focus-outline-offset) * 1);background-color:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container:has(.thumb:hover) .track-range{background:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container:has(.thumb:hover) .thumb{border-color:var(--components-slider-track-filled-error)}nv-fieldslider{--nv-field-border-default:var(--components-form-field-border-default);--nv-field-border-hover:var(--components-form-field-border-hover);--nv-field-border-focus:var(--components-form-field-border-focus);--nv-field-border-disabled:var(--components-form-field-border-default);--nv-field-border-readonly:var(--components-form-field-border-default);--nv-field-focus-box-shadow:var(--color-focus-brand);--nv-field-background:var(--components-form-field-background-default);display:flex;flex-direction:column;align-items:flex-start;gap:var(--form-gap-y);box-sizing:border-box;max-width:480px}nv-fieldslider .slider-container{width:100%;display:flex;flex-direction:row;align-items:center;gap:var(--form-gap-x)}nv-fieldslider .slider-container .track-container{position:relative;flex:1;height:calc(var(--slider-handler-size-min) + 0.25rem);padding:calc(var(--slider-handler-size-min) / 2) 0}nv-fieldslider .slider-container .track-container .track{position:relative;height:var(--slider-track-height);background:var(--components-slider-track-background);border-radius:var(--slider-track-radius);cursor:pointer}nv-fieldslider .slider-container .track-container .track .track-range{position:absolute;top:0;height:var(--slider-track-height);background:var(--components-slider-track-filled-default);border-radius:var(--slider-track-radius);pointer-events:none}nv-fieldslider .slider-container .track-container .track .thumb{position:absolute;top:50%;width:var(--slider-handler-size-min);height:var(--slider-handler-size-min);background:#ffffff;border:var(--slider-handler-stroke) solid var(--components-slider-track-filled-default);border-radius:50%;transform:translate(-50%, -50%);z-index:1;cursor:grab;transition:width 0.2s, height 0.2s, box-shadow 0.2s, background-color 0.2s}nv-fieldslider .slider-container .track-container .track .thumb:hover{width:var(--slider-handler-size-max);height:var(--slider-handler-size-max);border-color:var(--components-slider-track-filled-hover)}nv-fieldslider .slider-container .track-container .track .thumb:focus{width:var(--slider-handler-size-min);height:var(--slider-handler-size-min);border-color:var(--components-slider-track-filled-focus);outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1);transition:outline;background:var(--components-slider-handler-background-focus)}nv-fieldslider .slider-container .track-container .track .thumb:active{cursor:grabbing;background:var(--components-slider-handler-background-hover)}nv-fieldslider .slider-container .track-container .track .thumb .thumb-tooltip{position:absolute;top:25px;left:50%;background-color:var(--components-tooltip-background);color:var(--components-tooltip-text);padding:5px;border-radius:var(--tooltip-radius);font-size:var(--tooltip-font-size);z-index:10;pointer-events:none;user-select:none;opacity:0;transition:opacity 0.3s ease-in-out;transform:translateX(-50%)}nv-fieldslider .slider-container .track-container .track .thumb .thumb-tooltip:after{content:"";background:var(--components-tooltip-background);box-shadow:none;border:none;position:absolute;border-bottom-color:transparent;border-right-color:transparent;width:6px;height:6px;transform:rotate(45deg);border-radius:1px;top:-3px;left:50%;margin-left:-3px}nv-fieldslider .slider-container .track-container .track .thumb:hover .thumb-tooltip,nv-fieldslider .slider-container .track-container .track .thumb:active .thumb-tooltip,nv-fieldslider .slider-container .track-container .track .thumb:focus .thumb-tooltip{opacity:1}nv-fieldslider .slider-container .track-container .track-ticks{position:relative;height:1rem;margin-top:0.25rem}nv-fieldslider .slider-container .track-container .track-ticks .track-tick{position:absolute;top:0;width:var(--slider-tick-height);height:var(--slider-tick-height);background:var(--components-form-field-border-default);border-radius:50%;transform:translate(-50%, 0);pointer-events:none}nv-fieldslider .slider-container .track-container .track-ticks .track-tick:first-of-type{transform:translate(0, 0)}nv-fieldslider .slider-container .track-container .track-ticks .track-tick:last-of-type{transform:translate(-100%, 0)}nv-fieldslider .slider-container .track-container .track-ticks .track-tick .tick-label{position:absolute;top:calc(var(--slider-tick-height) + 0.25rem);left:50%;color:var(--components-form-field-border-default);transform:translateX(-50%);white-space:nowrap}.track-tick-first nv-fieldslider .slider-container .track-container .track-ticks .track-tick .tick-label{left:0;transform:translateX(0)}.track-tick-last nv-fieldslider .slider-container .track-container .track-ticks .track-tick .tick-label{left:100%;transform:translateX(-100%)}nv-fieldslider .slider-container .input-container{display:flex;flex-grow:1;justify-content:center;align-items:center;align-self:stretch;border-radius:var(--form-field-radius);border-width:1px;border-style:solid;border-color:var(--nv-field-border-default);opacity:var(--components-form-opacity-default, 1);background:var(--nv-field-background);transition:all 150ms ease-out;width:90px;flex-grow:unset}nv-fieldslider .slider-container .input-container:hover{border-color:var(--nv-field-border-hover)}nv-fieldslider .slider-container .input-container:focus-within,nv-fieldslider .slider-container .input-container:focus-within:hover,nv-fieldslider .slider-container .input-container:focus,nv-fieldslider .slider-container .input-container:focus:hover{border-color:var(--nv-field-border-focus);box-shadow:0px 0px 0px var(--focus-field-stroke) var(--nv-field-focus-box-shadow)}nv-fieldslider .slider-container .input-container:has(input:read-only){opacity:0.5;background-color:var(--components-form-field-background-readonly);border-color:var(--nv-field-border-readonly)}nv-fieldslider .slider-container .input-container:has(input:disabled){opacity:0.5;background-color:var(--components-form-field-background-disabled);border-color:var(--nv-field-border-disabled)}nv-fieldslider .slider-container .input-container input{display:flex;align-items:center;flex:1 0 0;overflow:hidden;background-color:transparent;color:var(--components-form-field-content-text);padding:var(--form-field-padding-y) var(--form-field-padding-x);font-size:var(--form-field-font-size);font-style:normal;font-weight:500;line-height:var(--form-field-line-height);width:100%;}nv-fieldslider .slider-container .input-container input:focus{outline:none}nv-fieldslider .slider-container .input-container input::placeholder{overflow:hidden;color:var(--components-form-field-content-placeholder);text-overflow:ellipsis;font-family:"TT Norms Pro", sans-serif;font-size:var(--form-field-font-size);font-style:normal;font-weight:400;line-height:var(--form-field-line-height)}nv-fieldslider .slider-container .input-container input[type=password]::-ms-clear,nv-fieldslider .slider-container .input-container input[type=password]::-ms-reveal{display:none;width:0;height:0}nv-fieldslider .slider-container .input-container .label-before{margin-left:var(--spacing-2);color:var(--components-form-field-icon-default)}nv-fieldslider .slider-container .input-container .label-after{margin-right:var(--spacing-2);color:var(--components-form-field-icon-default)}nv-fieldslider[fluid]:not([fluid=false]){max-width:unset}nv-fieldslider[error]:not([error=false]){--nv-field-border-default:var(--components-form-field-border-error);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--nv-field-border-default);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-focus-box-shadow:var(--color-focus-destructive-in-field)}nv-fieldslider[success]:not([success=false]){--nv-field-border-default:var(--components-form-field-border-success);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--nv-field-border-default);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-focus-box-shadow:var(--color-focus-success)}nv-fieldslider[readonly]:not([readonly=false]){--nv-field-border-default:var(--components-form-field-border-readonly);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--components-form-field-border-focus);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-background:var(--components-form-field-background-readonly)}nv-fieldslider[readonly]:not([readonly=false]) .track,nv-fieldslider[readonly]:not([readonly=false]) .thumb{cursor:default}nv-fieldslider label{display:flex;align-items:center;gap:var(--form-label-gap);align-self:stretch;color:var(--components-form-text-label-default);font-family:"TT Norms Pro", sans-serif;font-size:var(--form-label-font-size);font-style:normal;font-weight:500;line-height:var(--form-label-line-height)}nv-fieldslider nv-icon.validation{color:var(--nv-field-border-default)}nv-fieldslider[hide-label]:not([hide-label=false]) label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}nv-fieldslider[has-field]:not([has-field=false]) .thumb-tooltip{display:none}nv-fieldslider>.description{display:flex;align-items:center;align-self:stretch;gap:var(--spacing-1);color:var(--components-form-text-description-default);font-family:"TT Norms Pro", sans-serif;font-size:var(--form-description-font-size);font-style:normal;line-height:var(--form-description-line-height)}nv-fieldslider>.error-description{display:flex;align-items:center;align-self:stretch;gap:var(--spacing-1);color:var(--components-form-text-description-default);font-family:"TT Norms Pro", sans-serif;font-size:var(--form-description-font-size);font-style:normal;line-height:var(--form-description-line-height);color:var(--components-form-text-description-error)}nv-fieldslider>.error-description[hidden]{display:none}';const k=m;const g=class{constructor(e){i(this,e);this.valueChanged=r(this,"valueChanged",7);this.startInputId=s();this.endInputId=s();this.hideLabel=false;this.hasField=false;this.range=false;this.disabled=false;this.readonly=false;this.error=false;this.success=false;this.value=[0];this.step=1;this.snap=false;this.snapTicks=false;this.min=0;this.max=100;this.showTicks=false;this.fluid=false;this.isDragging=false;this.activeDragThumb="single";this.internalTicks=[];this.rawPosition=0;this.rawRangePosition=[0,0];this.valueInternal=0;this.rangeValueInternal=[0,0];this.parseValue=()=>{if(typeof this.value==="string"){console.error("Sliders require a number or array of numbers to be passed in the value prop.");return}if(this.range&&this.value.length!==2){console.error("Range sliders require an array of two values to be passed in the value prop.");return}if(!this.range&&this.value.length!==1){console.error("Single sliders require a single value as an array to be passed in the value prop.");return}this.valueInternal=this.value[0];this.rangeValueInternal=[this.value[0],this.value[1]]};this.onTrackInteraction=e=>{if(this.disabled||this.readonly){return}const i=e.currentTarget.getBoundingClientRect();const r=o((e.clientX-i.left)/i.width*100,0,100);const t=this.min+r/100*(this.max-this.min);this.rawPosition=t;if(this.range){const e=l(this.rangeValueInternal[0],this.min,this.max);const i=l(this.rangeValueInternal[1],this.min,this.max);const n=Math.abs(r-e);const s=Math.abs(r-i);if(n<=s){this.activeDragThumb="left";this.rawRangePosition=[t,this.rawRangePosition[1]];this.handleValueChange([t,this.rangeValueInternal[1]])}else{this.activeDragThumb="right";this.rawRangePosition=[this.rawRangePosition[0],t];this.handleValueChange([this.rangeValueInternal[0],t])}}else{this.activeDragThumb="single";this.rawPosition=t;this.handleValueChange(t)}this.isDragging=true;this.registerGlobalEvents()};this.onPointerMove=e=>{if(!this.isDragging||this.disabled||this.readonly){return}const i=this.el.querySelector(".track");if(!i)return;const r=i.getBoundingClientRect();const t=o((e.clientX-r.left)/r.width*100,0,100);const n=this.min+t/100*(this.max-this.min);if(this.range){if(this.activeDragThumb==="left"){this.rawRangePosition=[n,this.rawRangePosition[1]];this.handleValueChange([n,this.rangeValueInternal[1]])}else{this.rawRangePosition=[this.rawRangePosition[0],n];this.handleValueChange([this.rangeValueInternal[0],n])}}else{this.rawPosition=n;this.handleValueChange(n)}};this.onPointerUp=()=>{this.isDragging=false;this.removeGlobalEvents()};this.onKeyDown=e=>{if(this.disabled||this.readonly){return}let i;const r=e.shiftKey?10:1;const t=this.step*r;if(this.range){const r=e.target.getAttribute("data-thumb");const n=r==="left"?0:1;const s=[...this.rangeValueInternal];switch(e.key){case"ArrowRight":case"ArrowUp":s[n]+=t;break;case"ArrowLeft":case"ArrowDown":s[n]-=t;break;case"Home":s[n]=this.min;break;case"End":s[n]=this.max;break;case"PageUp":s[n]+=t*10;break;case"PageDown":s[n]-=t*10;break;default:return}i=s}else{switch(e.key){case"ArrowRight":case"ArrowUp":i=this.valueInternal+t;break;case"ArrowLeft":case"ArrowDown":i=this.valueInternal-t;break;case"Home":i=this.min;break;case"End":i=this.max;break;case"PageUp":i=this.valueInternal+t*10;break;case"PageDown":i=this.valueInternal-t*10;break;default:return}}e.preventDefault();this.handleValueChange(i)};this.handleFieldChange=e=>{const i=e.target;const r=parseFloat(i.value);if(isNaN(r)){return}if(this.range){const e=i.getAttribute("data-index")==="0"?0:1;const t=[...this.rangeValueInternal];t[e]=r;this.handleValueChange(t)}else{this.handleValueChange(r)}}}validateValue(e){const i=o(e,this.min,this.max);if(this.snapTicks&&this.internalTicks&&this.internalTicks.length>0){return f(i,this.internalTicks)}return d(i,this.min,this.max,this.step)}handleValueChange(e){if(this.disabled||this.readonly){return}if(this.range){if(Array.isArray(e)&&e.length===2){const i=[Math.min(e[0],e[1]),Math.max(e[0],e[1])];const r=[this.validateValue(i[0]),this.validateValue(i[1])];if(r[0]!==this.rangeValueInternal[0]||r[1]!==this.rangeValueInternal[1]){this.rangeValueInternal=r;this.value=this.rangeValueInternal;this.valueChanged.emit(this.rangeValueInternal)}}}else{if(typeof e==="number"){const i=this.validateValue(e);if(i!==this.valueInternal){this.valueInternal=i;this.value=[this.valueInternal];this.valueChanged.emit([this.valueInternal])}}}}generateDisplayTicks(){if(this.ticks&&this.ticks.length>0){this.internalTicks=[...this.ticks].sort(((e,i)=>e.value-i.value));return}if(!this.showTicks){this.internalTicks=[];return}const e=c(this.min,this.max,this.step);this.internalTicks=e.map((e=>({value:e})))}registerGlobalEvents(){document.addEventListener("pointermove",this.onPointerMove);document.addEventListener("pointerup",this.onPointerUp);document.addEventListener("pointercancel",this.onPointerUp)}removeGlobalEvents(){document.removeEventListener("pointermove",this.onPointerMove);document.removeEventListener("pointerup",this.onPointerUp);document.removeEventListener("pointercancel",this.onPointerUp)}onValueChange(){this.parseValue()}onConfigChange(){this.generateDisplayTicks();if(this.range){this.handleValueChange(this.rangeValueInternal)}else{this.handleValueChange(this.valueInternal)}}onRangeChange(e){if(e){this.rangeValueInternal=[this.min,this.valueInternal]}else{this.valueInternal=this.rangeValueInternal[1]}}connectedCallback(){this.parseValue();this.generateDisplayTicks();if(this.range){if(!Array.isArray(this.rangeValueInternal)||this.rangeValueInternal.length!==2){this.rangeValueInternal=[this.min,this.max]}this.handleValueChange(this.rangeValueInternal);this.rawRangePosition=[this.rangeValueInternal[0],this.rangeValueInternal[1]]}else{this.handleValueChange(this.valueInternal);this.rawPosition=this.valueInternal}}componentWillLoad(){if(this.value.length===1&&this.range){this.value=[this.value[0],this.value[0]]}else if(this.value.length===2&&!this.range){this.value=[this.value[0]]}}disconnectedCallback(){this.removeGlobalEvents()}render(){return e(t,{key:"7dafd85aa9bae558c6339bacc1ab0f9ca284f252"},(this.label||this.el.querySelector('[slot="label"]'))&&e("label",{key:"5a85de0b6d1216a1cdfa27172def79c7e2d17142",htmlFor:this.startInputId},e("slot",{key:"5f17b24bc70f148a70677f52dfe0be84162a675b",name:"label"},this.label)),e("div",{key:"5fb5d887c5fe61febfd877876365863f0657af93",class:"slider-container"},this.range?e(p,{range:this.range,hasField:this.hasField,value:this.valueInternal,rangeValue:this.rangeValueInternal,index:0,inputId:this.startInputId,min:this.min,max:this.max,step:this.step,disabled:this.disabled,readonly:this.readonly,onInput:this.handleFieldChange,labelBeforeValue:this.labelBeforeValue,labelAfterValue:this.labelAfterValue,name:this.name,endName:this.endName}):null,e("div",{key:"801e4189130725d5f4b3b0f116761e35a89f1236",class:"track-container"},e("div",{key:"fba52a45d3b5ba937b3e87441e17df458c490755",class:"track",onPointerDown:this.onTrackInteraction},this.range?e(v,{rangeValue:this.rangeValueInternal,rawRangePosition:this.rawRangePosition,activeDragThumb:this.activeDragThumb,isDragging:this.isDragging,snap:this.snap,min:this.min,max:this.max,step:this.step,disabled:this.disabled,readonly:this.readonly,onKeyDown:this.onKeyDown,labelBeforeValue:this.labelBeforeValue,labelAfterValue:this.labelAfterValue}):e(u,{value:this.valueInternal,min:this.min,max:this.max,step:this.step,rawPosition:this.rawPosition,isDragging:this.isDragging,snap:this.snap,disabled:this.disabled,readonly:this.readonly,onKeyDown:this.onKeyDown,labelBeforeValue:this.labelBeforeValue,labelAfterValue:this.labelAfterValue})),e(b,{key:"1530c379bac4d4d0d7ef2eb22ddabe507ace1c0a",ticks:this.internalTicks,min:this.min,max:this.max})),this.range?e(p,{range:this.range,hasField:this.hasField,value:this.valueInternal,rangeValue:this.rangeValueInternal,index:1,inputId:this.endInputId,min:this.min,max:this.max,step:this.step,disabled:this.disabled,readonly:this.readonly,onInput:this.handleFieldChange,labelBeforeValue:this.labelBeforeValue,labelAfterValue:this.labelAfterValue,name:this.name,endName:this.endName}):e(p,{range:this.range,hasField:this.hasField,value:this.valueInternal,rangeValue:this.rangeValueInternal,inputId:this.startInputId,min:this.min,max:this.max,step:this.step,disabled:this.disabled,readonly:this.readonly,onInput:this.handleFieldChange,labelBeforeValue:this.labelBeforeValue,labelAfterValue:this.labelAfterValue,name:this.name})),(this.success||this.description||this.el.querySelector('[slot="description"]'))&&e("div",{key:"032ea2e613073412908abe35fe04545d2369f04a",class:"description"},this.success&&e("nv-icon",{key:"ff7a4249402880359bc46dd07ff39acd196a7630",name:"circle-check",class:"validation",size:"md"}),e("slot",{key:"2fc0542506811cfc2d50eac140aae4cf97d279ea",name:"description"},this.description)),(this.error||this.errorDescription||this.el.querySelector('[slot="error-description"]'))&&e("div",{key:"d7ac4fc356cef87c86f7bd75dd4d5b4151379cfa",class:"error-description",hidden:!this.error},this.error&&e("nv-icon",{key:"598353c10d3f709fee22b44b8f831f22c2804d08",name:"alert-circle",class:"validation",size:"md"}),e("slot",{key:"a426ae3e63aafeea9d74cba5baa4bbf0fb65b0d1",name:"error-description"},this.errorDescription)))}static get formAssociated(){return true}get el(){return n(this)}static get watchers(){return{value:["onValueChange"],min:["onConfigChange"],max:["onConfigChange"],step:["onConfigChange"],ticks:["onConfigChange"],showTicks:["onConfigChange"],snap:["onConfigChange"],snapTicks:["onConfigChange"],range:["onRangeChange"]}}};g.style=k;export{g as nv_fieldslider};
|
|
2
|
+
//# sourceMappingURL=p-3fcaac6d.entry.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as e,c as r,h as t,H as i,g as o}from"./p-d0a33e64.js";import{v as l}from"./p-f5ff676c.js";const s='nv-fieldslider .slider-container .track-container:has(.thumb:hover) .track-range{background:var(--components-slider-track-filled-hover)}nv-fieldslider .slider-container .track-container:has(.thumb:hover) .thumb{border-color:var(--components-slider-track-filled-hover)}nv-fieldslider .slider-container .track-container:has(.thumb:focus) .track-range{background:var(--components-slider-track-filled-focus)}nv-fieldslider .slider-container .track-container:has(.thumb:focus) .thumb{border-color:var(--components-slider-track-filled-focus)}nv-fieldslider[error] .slider-container .track-container .track .track-range{background:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container .track .thumb{border-color:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container .track .thumb:hover{border-color:var(--components-slider-track-filled-error);outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-slider-track-filled-error);outline-offset:calc(var(--focus-outline-offset) * 1);background-color:var(--components-slider-handler-background-error)}nv-fieldslider[error] .slider-container .track-container .track .thumb:focus{border-color:var(--components-slider-track-filled-error);outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-slider-track-filled-error);outline-offset:calc(var(--focus-outline-offset) * 1);background-color:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container:has(.thumb:hover) .track-range{background:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container:has(.thumb:hover) .thumb{border-color:var(--components-slider-track-filled-error)}nv-fieldselect{--nv-field-border-default:var(--components-form-field-border-default);--nv-field-border-hover:var(--components-form-field-border-hover);--nv-field-border-focus:var(--components-form-field-border-focus);--nv-field-border-disabled:var(--components-form-field-border-default);--nv-field-border-readonly:var(--components-form-field-border-default);--nv-field-focus-box-shadow:var(--color-focus-brand);--nv-field-background:var(--components-form-field-background-default);display:flex;flex-direction:column;align-items:flex-start;gap:var(--form-gap-y);box-sizing:border-box;max-width:480px}nv-fieldselect[fluid]:not([fluid=false]){max-width:unset}nv-fieldselect[readonly]:not([readonly=false]){--nv-field-border-default:var(--components-form-field-border-readonly);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--components-form-field-border-focus);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-background:var(--components-form-field-background-readonly)}nv-fieldselect[display-value]:not([display-value=false]){--nv-field-border-default:var(--components-form-field-border-readonly);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--components-form-field-border-focus);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-background:var(--components-form-field-background-readonly)}nv-fieldselect[error]:not([error=false]){--nv-field-border-default:var(--components-form-field-border-error);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--nv-field-border-default);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-focus-box-shadow:var(--color-focus-destructive-in-field)}nv-fieldselect[success]:not([success=false]){--nv-field-border-default:var(--components-form-field-border-success);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--nv-field-border-default);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-focus-box-shadow:var(--color-focus-success)}nv-fieldselect[required]:not([required=false]) label::after{content:"*";color:var(--components-form-text-required);font-weight:700}nv-fieldselect[multiple]:not([multiple=false]) .select-wrapper>.select-container>.select-icons{top:var(--form-field-padding-y);right:var(--form-field-padding-x)}nv-fieldselect[multiple]:not([multiple=false]) .select-wrapper>.select-container>select{height:100%;box-sizing:border-box}nv-fieldselect label{display:flex;align-items:center;gap:var(--form-label-gap);align-self:stretch;color:var(--components-form-text-label-default);font-family:"TT Norms Pro", sans-serif;font-size:var(--form-label-font-size);font-style:normal;font-weight:500;line-height:var(--form-label-line-height)}nv-fieldselect .select-wrapper{display:flex;flex-wrap:wrap;align-items:stretch;align-self:stretch}nv-fieldselect .select-wrapper .select-container{position:relative;display:flex;flex-grow:1;justify-content:center;align-items:center;align-self:stretch;border-radius:var(--form-field-radius);border-width:1px;border-style:solid;border-color:var(--nv-field-border-default);opacity:var(--components-form-opacity-default);background:var(--nv-field-background);transition:all 150ms ease-out}nv-fieldselect .select-wrapper .select-container:hover{border-color:var(--nv-field-border-hover)}nv-fieldselect .select-wrapper .select-container:focus-within{border-color:var(--nv-field-border-focus);box-shadow:0 0 0 var(--focus-field-stroke) var(--nv-field-focus-box-shadow)}nv-fieldselect .select-wrapper .select-container:has(select:disabled){opacity:0.5;background-color:var(--components-form-field-background-disabled);border-color:var(--nv-field-border-disabled)}nv-fieldselect .select-wrapper .select-container>.select-icons{position:absolute;right:0;top:0;pointer-events:none}nv-fieldselect .select-wrapper .select-container>.select-icons>nv-iconbutton{border:0px;border-radius:0px}nv-fieldselect .select-wrapper .select-container>.select-icons>nv-iconbutton:focus-visible{border-radius:var(--button-md-border-radius);outline-offset:-3px}nv-fieldselect .select-wrapper .select-container input{display:flex;align-items:center;flex:1 0 0;overflow:hidden;background-color:transparent;color:var(--components-form-field-content-text);padding:var(--form-field-padding-y) var(--form-field-padding-x);font-size:var(--form-field-font-size);font-style:normal;font-weight:500;line-height:var(--form-field-line-height);width:100%;}nv-fieldselect .select-wrapper .select-container input:focus{outline:none}nv-fieldselect .select-wrapper .select-container input::placeholder{overflow:hidden;color:var(--components-form-field-content-placeholder);text-overflow:ellipsis;font-family:"TT Norms Pro", sans-serif;font-size:var(--form-field-font-size);font-style:normal;font-weight:400;line-height:var(--form-field-line-height)}nv-fieldselect .select-wrapper .select-container input[type=password]::-ms-clear,nv-fieldselect .select-wrapper .select-container input[type=password]::-ms-reveal{display:none;width:0;height:0}nv-fieldselect .select-wrapper .select-container input:read-only{opacity:0.5;background-color:var(--components-form-field-background-readonly, rgba(0, 0, 0, 0.1));border-color:var(--nv-field-border-readonly)}nv-fieldselect .select-wrapper .select-container select{display:flex;align-items:center;flex:1 0 0;overflow:hidden;background-color:transparent;color:var(--components-form-field-content-text);text-overflow:ellipsis;font-size:var(--form-field-font-size);font-style:normal;font-weight:500;height:var(--form-field-line-height);padding:var(--form-field-padding-y) var(--form-field-padding-x);box-sizing:content-box;-webkit-appearance:none;-moz-appearance:none;cursor:pointer}nv-fieldselect .select-wrapper .select-container select:focus{outline:none}nv-fieldselect .select-wrapper .select-container select::placeholder{overflow:hidden;color:var(--components-form-field-content-placeholder);text-overflow:ellipsis;font-family:"TT Norms Pro", sans-serif;font-size:var(--form-field-font-size);font-style:normal;font-weight:400;line-height:var(--form-field-line-height)}nv-fieldselect .select-wrapper .select-container select option{font-size:var(--form-field-font-size, 16px);font-style:normal;font-weight:500;line-height:var(--form-field-line-height, 24px);background-color:var(--color-level-05-background);color:var(--components-form-field-content-text)}nv-fieldselect .select-wrapper .select-container select.hidden{display:none}nv-fieldselect .select-wrapper .select-container nv-icon.readonly-icon{color:var(--nv-field-border-default)}nv-fieldselect .select-wrapper .select-container nv-icon.validation{color:var(--nv-field-border-default)}nv-fieldselect .description{display:flex;align-items:center;align-self:stretch;gap:var(--spacing-1);color:var(--components-form-text-description-default);font-family:"TT Norms Pro", sans-serif;font-size:var(--form-description-font-size);font-style:normal;line-height:var(--form-description-line-height)}nv-fieldselect .error-description{display:flex;align-items:center;align-self:stretch;gap:var(--spacing-1);color:var(--components-form-text-description-default);font-family:"TT Norms Pro", sans-serif;font-size:var(--form-description-font-size);font-style:normal;line-height:var(--form-description-line-height);color:var(--components-form-text-description-error)}';const n=s;const a=class{constructor(t){e(this,t);this.valueChanged=r(this,"valueChanged",7);this.computedDisplayValue="";this.internalReadonly=false;this.inputId=l();this.disabled=false;this.readonly=false;this.required=false;this.error=false;this.success=false;this.multiple=false;this.value="";this.displayValue=false;this.autofocus=false;this.fluid=false;this.handleSelectChange=e=>{const r=e.target;let t=Array.from(r.selectedOptions).map((e=>e.value));if(!this.multiple){t=t.slice(0,1)}this.value=this.multiple?t.join(", "):t[0]||"";this.valueChanged.emit(this.value);this.setFormValue()};this.handleSelectContainerClick=()=>{if(!this.internalReadonly&&this.selectElement){this.selectElement.focus()}}}updateDisplayValueWatcher(e){this.updateDisplayValue();if(this.selectElement){const r=e.split(",").map((e=>e.trim()));const t=this.selectElement.options;if(t){Array.from(t).forEach((e=>{e.selected=this.multiple?r.includes(e.value):e.value===r[0]}));if(!this.multiple){this.selectElement.value=e}}else{this.selectElement.value=r[0]||""}}this.setFormValue()}handleDisplayValueChange(e){this.internalReadonly=e;if(this.readonly){this.internalReadonly=true}}handleReadonlyChange(e){this.internalReadonly=e;if(this.displayValue){this.internalReadonly=true}}handleOptionsChange(e){if(!e)return;const r=e.find((e=>e.selected));if(r){this.value=r.value}}updateDisplayValue(){if(this.internalReadonly&&!this.displayValue){if(this.multiple){const e=this.value.split(",").map((e=>e.trim())).map((e=>this.getLabelFromId(e)||"")).filter((e=>e!==""));this.computedDisplayValue=e.join(", ")||""}else{this.computedDisplayValue=this.getLabelFromId(this.value)||""}}else if(this.internalReadonly&&this.displayValue){this.computedDisplayValue=this.value||""}}getLabelFromId(e){this.ensureSelectElement();if(!this.selectElement){return""}const r=this.selectElement.options;if(r){const t=Array.from(r).find((r=>r.value===e));return t?t.textContent.trim()||"":""}else{return""}}setFormValue(){this.internals.setFormValue(this.value)}ensureSelectElement(){if(!this.selectElement){this.selectElement=this.el.querySelector("select")}}componentWillRender(){this.updateDisplayValue();if(this.message){this.description=this.message}if(this.validation){this.errorDescription=this.validation;this.error=true}}componentWillLoad(){this.internalReadonly=this.readonly;if(this.displayValue){this.internalReadonly=true}if("attachInternals"in this.el){this.internals=this.el.attachInternals()}else{this.internals={setFormValue:e=>{const r=this.el.closest("form");if(r){const t=document.createElement("input");t.type="hidden";t.name=this.name;t.value=e;r.appendChild(t)}}}}if(this.multiple&&typeof this.value!=="string"){this.value=""}if(this.options){this.handleOptionsChange(this.options)}}componentDidLoad(){this.updateDisplayValue();if(this.selectElement){if(!this.multiple){this.selectElement.value=this.value}const e=this.multiple?this.value.split(",").map((e=>e.trim())):[this.value];const r=this.selectElement.options;if(r){Array.from(r).forEach((r=>{r.selected=this.multiple?e.includes(r.value):r.value===e[0]}))}else{this.selectElement.value=e[0]||""}}this.setFormValue()}render(){return t(i,{key:"6db1f2e159308d8b1e78932522c62f73e78db893"},(this.label||this.el.querySelector('[slot="label"]'))&&t("label",{key:"c329b6bb95018b0d9e574516ca8e801ea82828be",htmlFor:this.inputId},t("slot",{key:"94d57fd7026986a8ef86dacffb70f0e590c8d2d7",name:"label"},this.label)),t("div",{key:"fca0df783ac46ebd16aa8b6e8db1450d81d2a0e7",class:"select-wrapper"},t("slot",{key:"bd944f336912516b83f32f58bd76a7ff80de2fb6",name:"before-input"}),t("div",{key:"42729a7ba192d85fa76abef9b928c98e514f7ff3",class:"select-container",onClick:this.handleSelectContainerClick},t("slot",{key:"90ca0a9446a62a756e19b0b71db10fe8147eba25",name:"leading-input"}),this.internalReadonly&&t("input",{key:"55b2cf61b1ad07479a104c8d2ff4f46f41dd1677",id:this.inputId+"-readonly",type:"text",value:this.computedDisplayValue,readonly:true,class:"readonly-input","aria-readonly":"true","aria-label":this.label,"aria-describedby":this.error?`${this.inputId}-error`:`${this.inputId}-description`}),t("select",{key:"482be9d241679ad9f77f199c00b4a8d0434ac91e",id:this.inputId,ref:e=>this.selectElement=e,name:this.name,autofocus:this.autofocus,disabled:this.disabled,required:this.required,multiple:this.multiple,onChange:this.handleSelectChange,class:this.internalReadonly?"hidden":"","aria-label":this.label,"aria-describedby":this.error?`${this.inputId}-error`:`${this.inputId}-description`},this.options&&this.options.length>0?this.options.map((e=>t("option",{value:e.value,selected:e.selected,disabled:e.disabled},e.label))):t("slot",null)),t("div",{key:"17a31f45608536be911f3fca1e28e11caac7a065",class:"select-icons"},this.error&&t("nv-icon",{key:"f8f6f1545d87cfdf174755da82780356480de737",name:"alert-circle",class:"validation",size:"md"}),this.success&&t("nv-icon",{key:"f79e5968a6fc70cf56c07223a8a569648d77c082",name:"circle-check",class:"validation",size:"md"}),!this.multiple&&t("nv-iconbutton",{key:"d7f2c576a6c6c5d964f692c1f520d0e71af82f35",name:"chevron-down",size:"md",emphasis:"lower",tabindex:-1}))),t("slot",{key:"852c05430b705347f473899ff884725b511d527d",name:"after-input"})),(this.description||this.el.querySelector('[slot="description"]'))&&t("div",{key:"3f98fb2ee526fae3c74f2e2dd78d5f10b9e13475",class:"description",id:`${this.inputId}-description`},t("slot",{key:"268191d3ffc3191d7c946d805c6cd58dc1855dda",name:"description"},this.description)),(this.errorDescription||this.el.querySelector('[slot="error-description"]'))&&t("div",{key:"24b5935d22d7971f6aa5922a1fa8c47b8beb069f",class:"error-description",id:`${this.inputId}-error`},t("slot",{key:"5492aecb0537f91f8cf38430b4048bb7bd13edf8",name:"error-description"},this.errorDescription)))}static get formAssociated(){return true}get el(){return o(this)}static get watchers(){return{value:["updateDisplayValueWatcher"],displayValue:["handleDisplayValueChange"],readonly:["handleReadonlyChange"],options:["handleOptionsChange"]}}};a.style=n;export{a as nv_fieldselect};
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{r as e,c as r,h as t,H as i,g as o}from"./p-d0a33e64.js";import{v as l}from"./p-f5ff676c.js";const s='nv-fieldslider .slider-container .track-container:has(.thumb:hover) .track-range{background:var(--components-slider-track-filled-hover)}nv-fieldslider .slider-container .track-container:has(.thumb:hover) .thumb{border-color:var(--components-slider-track-filled-hover)}nv-fieldslider .slider-container .track-container:has(.thumb:focus) .track-range{background:var(--components-slider-track-filled-focus)}nv-fieldslider .slider-container .track-container:has(.thumb:focus) .thumb{border-color:var(--components-slider-track-filled-focus)}nv-fieldslider[error] .slider-container .track-container .track .track-range{background:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container .track .thumb{border-color:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container .track .thumb:hover{border-color:var(--components-slider-track-filled-error);outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-slider-track-filled-error);outline-offset:calc(var(--focus-outline-offset) * 1);background-color:var(--components-slider-handler-background-error)}nv-fieldslider[error] .slider-container .track-container .track .thumb:focus{border-color:var(--components-slider-track-filled-error);outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-slider-track-filled-error);outline-offset:calc(var(--focus-outline-offset) * 1);background-color:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container:has(.thumb:hover) .track-range{background:var(--components-slider-track-filled-error)}nv-fieldslider[error] .slider-container .track-container:has(.thumb:hover) .thumb{border-color:var(--components-slider-track-filled-error)}nv-fieldselect{--nv-field-border-default:var(--components-form-field-border-default);--nv-field-border-hover:var(--components-form-field-border-hover);--nv-field-border-focus:var(--components-form-field-border-focus);--nv-field-border-disabled:var(--components-form-field-border-default);--nv-field-border-readonly:var(--components-form-field-border-default);--nv-field-focus-box-shadow:var(--color-focus-brand);--nv-field-background:var(--components-form-field-background-default);display:flex;flex-direction:column;align-items:flex-start;gap:var(--form-gap-y);box-sizing:border-box;max-width:480px}nv-fieldselect[fluid]:not([fluid=false]){max-width:unset}nv-fieldselect[readonly]:not([readonly=false]){--nv-field-border-default:var(--components-form-field-border-readonly);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--components-form-field-border-focus);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-background:var(--components-form-field-background-readonly)}nv-fieldselect[display-value]:not([display-value=false]){--nv-field-border-default:var(--components-form-field-border-readonly);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--components-form-field-border-focus);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-background:var(--components-form-field-background-readonly)}nv-fieldselect[error]:not([error=false]){--nv-field-border-default:var(--components-form-field-border-error);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--nv-field-border-default);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-focus-box-shadow:var(--color-focus-destructive-in-field)}nv-fieldselect[success]:not([success=false]){--nv-field-border-default:var(--components-form-field-border-success);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--nv-field-border-default);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-focus-box-shadow:var(--color-focus-success)}nv-fieldselect[required]:not([required=false]) label::after{content:"*";color:var(--components-form-text-required);font-weight:700}nv-fieldselect[multiple]:not([multiple=false]) .select-wrapper>.select-container>.select-icons{top:var(--form-field-padding-y);right:var(--form-field-padding-x)}nv-fieldselect[multiple]:not([multiple=false]) .select-wrapper>.select-container>select{height:100%;box-sizing:border-box}nv-fieldselect label{display:flex;align-items:center;gap:var(--form-label-gap);align-self:stretch;color:var(--components-form-text-label-default);font-family:"TT Norms Pro", sans-serif;font-size:var(--form-label-font-size);font-style:normal;font-weight:500;line-height:var(--form-label-line-height)}nv-fieldselect .select-wrapper{display:flex;flex-wrap:wrap;align-items:stretch;align-self:stretch}nv-fieldselect .select-wrapper .select-container{position:relative;display:flex;flex-grow:1;justify-content:center;align-items:center;align-self:stretch;border-radius:var(--form-field-radius);border-width:1px;border-style:solid;border-color:var(--nv-field-border-default);opacity:var(--components-form-opacity-default);background:var(--nv-field-background);transition:all 150ms ease-out}nv-fieldselect .select-wrapper .select-container:hover{border-color:var(--nv-field-border-hover)}nv-fieldselect .select-wrapper .select-container:focus-within{border-color:var(--nv-field-border-focus);box-shadow:0 0 0 var(--focus-field-stroke) var(--nv-field-focus-box-shadow)}nv-fieldselect .select-wrapper .select-container:has(select:disabled){opacity:0.5;background-color:var(--components-form-field-background-disabled);border-color:var(--nv-field-border-disabled)}nv-fieldselect .select-wrapper .select-container>.select-icons{position:absolute;right:0;top:0;pointer-events:none}nv-fieldselect .select-wrapper .select-container>.select-icons>nv-iconbutton{border:0px;border-radius:0px}nv-fieldselect .select-wrapper .select-container>.select-icons>nv-iconbutton:focus-visible{border-radius:var(--button-md-border-radius);outline-offset:-3px}nv-fieldselect .select-wrapper .select-container input{display:flex;align-items:center;flex:1 0 0;overflow:hidden;background-color:transparent;color:var(--components-form-field-content-text);padding:var(--form-field-padding-y) var(--form-field-padding-x);font-size:var(--form-field-font-size);font-style:normal;font-weight:500;line-height:var(--form-field-line-height);width:100%;}nv-fieldselect .select-wrapper .select-container input:focus{outline:none}nv-fieldselect .select-wrapper .select-container input::placeholder{overflow:hidden;color:var(--components-form-field-content-placeholder);text-overflow:ellipsis;font-family:"TT Norms Pro", sans-serif;font-size:var(--form-field-font-size);font-style:normal;font-weight:400;line-height:var(--form-field-line-height)}nv-fieldselect .select-wrapper .select-container input[type=password]::-ms-clear,nv-fieldselect .select-wrapper .select-container input[type=password]::-ms-reveal{display:none;width:0;height:0}nv-fieldselect .select-wrapper .select-container input:read-only{opacity:0.5;background-color:var(--components-form-field-background-readonly, rgba(0, 0, 0, 0.1));border-color:var(--nv-field-border-readonly)}nv-fieldselect .select-wrapper .select-container select{display:flex;align-items:center;flex:1 0 0;overflow:hidden;background-color:transparent;color:var(--components-form-field-content-text);text-overflow:ellipsis;font-size:var(--form-field-font-size);font-style:normal;font-weight:500;height:var(--form-field-line-height);padding:var(--form-field-padding-y) var(--form-field-padding-x);box-sizing:content-box;-webkit-appearance:none;-moz-appearance:none;cursor:pointer}nv-fieldselect .select-wrapper .select-container select:focus{outline:none}nv-fieldselect .select-wrapper .select-container select::placeholder{overflow:hidden;color:var(--components-form-field-content-placeholder);text-overflow:ellipsis;font-family:"TT Norms Pro", sans-serif;font-size:var(--form-field-font-size);font-style:normal;font-weight:400;line-height:var(--form-field-line-height)}nv-fieldselect .select-wrapper .select-container select option{font-size:var(--form-field-font-size, 16px);font-style:normal;font-weight:500;line-height:var(--form-field-line-height, 24px);background-color:var(--color-level-05-background);color:var(--components-form-field-content-text)}nv-fieldselect .select-wrapper .select-container select.hidden{display:none}nv-fieldselect .select-wrapper .select-container nv-icon.readonly-icon{color:var(--nv-field-border-default)}nv-fieldselect .select-wrapper .select-container nv-icon.validation{color:var(--nv-field-border-default)}nv-fieldselect .description{display:flex;align-items:center;align-self:stretch;gap:var(--spacing-1);color:var(--components-form-text-description-default);font-family:"TT Norms Pro", sans-serif;font-size:var(--form-description-font-size);font-style:normal;line-height:var(--form-description-line-height)}nv-fieldselect .error-description{display:flex;align-items:center;align-self:stretch;gap:var(--spacing-1);color:var(--components-form-text-description-default);font-family:"TT Norms Pro", sans-serif;font-size:var(--form-description-font-size);font-style:normal;line-height:var(--form-description-line-height);color:var(--components-form-text-description-error)}';const n=s;const a=class{constructor(t){e(this,t);this.valueChanged=r(this,"valueChanged",7);this.computedDisplayValue="";this.internalReadonly=false;this.inputId=l();this.disabled=false;this.readonly=false;this.required=false;this.error=false;this.success=false;this.multiple=false;this.value="";this.displayValue=false;this.autofocus=false;this.fluid=false;this.handleSelectChange=e=>{const r=e.target;let t=Array.from(r.selectedOptions).map((e=>e.value));if(!this.multiple){t=t.slice(0,1)}this.value=this.multiple?t.join(", "):t[0]||"";this.valueChanged.emit(this.value);this.setFormValue()};this.handleSelectContainerClick=()=>{if(!this.internalReadonly&&this.selectElement){this.selectElement.focus()}}}updateDisplayValueWatcher(e){this.updateDisplayValue();if(this.selectElement){const r=e.split(",").map((e=>e.trim()));const t=this.selectElement.options;if(t){Array.from(t).forEach((e=>{e.selected=this.multiple?r.includes(e.value):e.value===r[0]}));if(!this.multiple){this.selectElement.value=e}}else{this.selectElement.value=r[0]||""}}this.setFormValue()}handleDisplayValueChange(e){this.internalReadonly=e;if(this.readonly){this.internalReadonly=true}}handleReadonlyChange(e){this.internalReadonly=e;if(this.displayValue){this.internalReadonly=true}}handleOptionsChange(e){if(!e)return;const r=e.find((e=>e.selected));if(r){this.value=r.value}}updateDisplayValue(){if(this.internalReadonly&&!this.displayValue){if(this.multiple){const e=this.value.split(",").map((e=>e.trim())).map((e=>this.getLabelFromId(e)||"")).filter((e=>e!==""));this.computedDisplayValue=e.join(", ")||""}else{this.computedDisplayValue=this.getLabelFromId(this.value)||""}}else if(this.internalReadonly&&this.displayValue){this.computedDisplayValue=this.value||""}}getLabelFromId(e){this.ensureSelectElement();if(!this.selectElement){return""}const r=this.selectElement.options;if(r){const t=Array.from(r).find((r=>r.value===e));return t?t.textContent.trim()||"":""}else{return""}}setFormValue(){this.internals.setFormValue(this.value)}ensureSelectElement(){if(!this.selectElement){this.selectElement=this.el.querySelector("select")}}componentWillRender(){this.updateDisplayValue();if(this.message){this.description=this.message}if(this.validation){this.errorDescription=this.validation;this.error=true}}componentWillLoad(){this.internalReadonly=this.readonly;if(this.displayValue){this.internalReadonly=true}if("attachInternals"in this.el){this.internals=this.el.attachInternals()}else{this.internals={setFormValue:e=>{const r=this.el.closest("form");if(r){const t=document.createElement("input");t.type="hidden";t.name=this.name;t.value=e;r.appendChild(t)}}}}if(this.multiple&&typeof this.value!=="string"){this.value=""}if(this.options){this.handleOptionsChange(this.options)}}componentDidLoad(){this.updateDisplayValue();if(this.selectElement){if(!this.multiple){this.selectElement.value=this.value}const e=this.multiple?this.value.split(",").map((e=>e.trim())):[this.value];const r=this.selectElement.options;if(r){Array.from(r).forEach((r=>{r.selected=this.multiple?e.includes(r.value):r.value===e[0]}))}else{this.selectElement.value=e[0]||""}}this.setFormValue()}render(){return t(i,{key:"8db3dc06b44e4db7e2a0742e601c12e18e758ce4"},(this.label||this.el.querySelector('[slot="label"]'))&&t("label",{key:"ba4f797c94d2e8155758caf61ac58ad81ec76e9c",htmlFor:this.inputId},t("slot",{key:"066e33d824ae5cf44e3c7e0ca63784d945a89fff",name:"label"},this.label)),t("div",{key:"0c07cf2f4628ef816e6d1e927fef0da2f822ca54",class:"select-wrapper"},t("slot",{key:"53dbbfa9adc491c47896c3898a3e2004a3ee7e54",name:"before-input"}),t("div",{key:"c31b867bd77008caca565d81805964da23f8330c",class:"select-container",onClick:this.handleSelectContainerClick},t("slot",{key:"7be8d229d57c77ec4c02761ae8c7e8bb7238a185",name:"leading-input"}),this.internalReadonly&&t("input",{key:"282485f65b1a7bc5b85623d5f892cb1d83a9e99c",id:this.inputId+"-readonly",type:"text",value:this.computedDisplayValue,readonly:true,class:"readonly-input","aria-readonly":"true","aria-label":this.label,"aria-describedby":this.error?`${this.inputId}-error`:`${this.inputId}-description`}),t("select",{key:"1170c1fc05941662434a7720cf00de136969621b",id:this.inputId,ref:e=>this.selectElement=e,name:this.name,autofocus:this.autofocus,disabled:this.disabled,required:this.required,multiple:this.multiple,onChange:this.handleSelectChange,class:this.internalReadonly?"hidden":"","aria-label":this.label,"aria-describedby":this.error?`${this.inputId}-error`:`${this.inputId}-description`},this.options&&this.options.length>0?this.options.map((e=>t("option",{value:e.value,selected:e.selected,disabled:e.disabled},e.label))):t("slot",null)),t("div",{key:"349a41292a5e2c20783884b04295f3fdfd40df42",class:"select-icons"},this.error&&t("nv-icon",{key:"586c197ccb0797b6e051c52e4734d06ae9fdff15",name:"alert-circle",class:"validation",size:"md"}),this.success&&t("nv-icon",{key:"506fbbb4c0248ce93b9c240b0db6f7714f285e09",name:"circle-check",class:"validation",size:"md"}),!this.multiple&&t("nv-iconbutton",{key:"848c3638af8d84eeb2a6b884c8e3c5aa549a053f",name:"chevron-down",size:"md",emphasis:"lower",tabindex:-1}))),t("slot",{key:"77e8ed090caf243296918a2916d5964090783a10",name:"after-input"})),(this.description||this.el.querySelector('[slot="description"]'))&&t("div",{key:"3b6f24dc66bbca05210bc77f64ef47524d6d4460",class:"description",id:`${this.inputId}-description`},t("slot",{key:"1e23487e1008b2c2c9c9208e315509be2a46eba3",name:"description"},this.description)),(this.errorDescription||this.el.querySelector('[slot="error-description"]'))&&t("div",{key:"8073f26e95848f831b210e3a8d730458d2b62e89",class:"error-description",id:`${this.inputId}-error`},t("slot",{key:"8980e5890052257fef11e0fe0b932ef933d34316",name:"error-description"},this.errorDescription)))}static get formAssociated(){return true}get el(){return o(this)}static get watchers(){return{value:["updateDisplayValueWatcher"],displayValue:["handleDisplayValueChange"],readonly:["handleReadonlyChange"],options:["handleOptionsChange"]}}};a.style=n;export{a as nv_fieldselect};
|
|
2
|
+
//# sourceMappingURL=p-4302824a.entry.js.map
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as t,c as s,h as e,H as a,g as i}from"./p-d0a33e64.js";import{d as n,e as o}from"./p-cb34aa4f.js";const r="nv-table{display:block}nv-table .hidden{display:none}nv-table table{border-collapse:collapse;border-color:inherit;text-indent:0;width:100%}nv-table th{text-align:left;border-bottom:1px solid var(--components-datagrid-header-border);height:var(--spacing-12);padding:var(--spacing-3) var(--spacing-4);font-size:var(--font-size-md);font-weight:700;color:var(--components-datagrid-header-text)}nv-table td{border-bottom:1px solid var(--components-datagrid-body-border);height:var(--spacing-12);max-height:var(--spacing-14);padding:var(--spacing-2) var(--spacing-4);font-size:var(--font-size-md);font-weight:400;color:var(--components-datagrid-body-text);white-space:nowrap;text-overflow:ellipsis}nv-table tbody>tr:hover{background:var(--color-interaction-container-neutral-background-hover)}";const l=r;const h=class{constructor(e){t(this,e);this.action=s(this,"action",7);this.templateCache=new Map;this.headerTemplateCache=new Map;this.parsedColumns=[];this.parsedData=[];this.table=null;this.data=[];this.columnsConfig=[];this.fallbackValue="N/A";this.noDataMessage="No data available";this.noColumnsNoDataMessage="No data or columns available to display."}cacheTemplates(){const t=Array.from(this.el.querySelectorAll("nv-tablecolumn"));t.forEach((t=>{const s=t.name;const e=t.querySelector('[slot="cell"]');if(e){const t=n(e);this.templateCache.set(s,t)}const a=t.querySelector('[slot="header"]');if(a){const t=n(a);this.headerTemplateCache.set(s,t)}else{const e=t.header;if(e){const t=document.createElement("div");t.textContent=e;this.headerTemplateCache.set(s,t)}}}))}parseDataAndColumns(){if(this.dataJson){this.parseJsonData(this.dataJson)}else if(this.data&&this.data.length>0){this.parseDataArray(this.data,this.parsedData)}if(this.columnsConfigJson){this.parseJsonColumns(this.columnsConfigJson,this.parsedColumns)}else if(this.columnsConfig&&this.columnsConfig.length>0){this.parseColumnsArray(this.columnsConfig,this.parsedColumns)}else if(this.headerTemplateCache.size>0){const t=Array.from(this.headerTemplateCache.keys());const s=t.map((t=>Object.assign({},{name:t,header:t?t.charAt(0).toUpperCase()+t.slice(1):""})));this.parseColumnsArray(s,this.parsedColumns)}else if(this.parsedData.length>0){const t=this.parsedData[0];const s=Object.keys(t).map((t=>({name:t,header:t.charAt(0).toUpperCase()+t.slice(1)})));this.parseColumnsArray(s,this.parsedColumns)}}deepEqual(t,s){return JSON.stringify(t)===JSON.stringify(s)}parseDataArray(t,s){const e=Array.isArray(t)?t:[];const a=Array.isArray(s)?s:[];if(this.deepEqual(e,a)){return}this.parsedData=Array.isArray(t)?t:[]}parseColumnsArray(t,s){const e=Array.isArray(t)?t:[];const a=Array.isArray(s)?s:[];if(this.deepEqual(e,a)){return}this.parsedColumns=e}initializeTable(){this.table=null;if(this.parsedColumns.length>0){this.table={columns:this.parsedColumns,data:this.getTableData()}}else{this.table=null}}getTableData(){if(this.parsedData&&Array.isArray(this.parsedData)&&this.parsedData.length>0){return[...this.parsedData]}else{return[]}}replaceKeyWithValue(t,s){var e;return(e=s.split(".").reduce(((t,s)=>t&&t[s]!==undefined?t[s]:undefined),t))!==null&&e!==void 0?e:this.fallbackValue}renderTemplate(t,s){if(!t){return null}const a=t instanceof HTMLTemplateElement?t.content:t;const i=n(a);i.querySelectorAll("*").forEach((t=>{this.replacePlaceholdersTextContent(t,s);this.replacePlaceholdersAttributes(t,s);this.replacePlaceholdersProperties(t,s)}));i.querySelectorAll("[data-bind-event]").forEach((t=>{const e=t.getAttribute("data-bind-event")||"";const a=e.split(":");if(!e.includes(":")||a.length<2){console.warn("Invalid data-bind-event format:",e);return}const i=a[0];const n=a[1];const o=a.length>2?a[2]:null;t.addEventListener(i,(()=>{var t;const e=(t=o===null||o===void 0?void 0:o.split(","))!==null&&t!==void 0?t:[];const a=e.reduce(((t,e)=>{t[e]=s===null||s===void 0?void 0:s[e];return t}),{});const i={keyAction:n,details:a};this.action.emit(i)}))}));setTimeout((()=>{i.querySelectorAll("*").forEach((t=>{if(typeof t.connectedCallback==="function"){t.connectedCallback()}}))}),0);return e("div",{ref:t=>{if(t){t.innerHTML="";t.appendChild(i)}}})}replacePlaceholdersTextContent(t,s){t.childNodes.forEach((t=>{if(t.nodeType===Node.TEXT_NODE){t.textContent=t.textContent.replace(/__([\w.]+)__/g,((t,e)=>this.replaceKeyWithValue(s,e)))}}))}replacePlaceholdersAttributes(t,s){Array.from(t.attributes).forEach((t=>{if(t.value.includes("__")){t.value=t.value.replace(/__([\w.]+)__/g,((t,e)=>this.replaceKeyWithValue(s,e)))}}))}replacePlaceholdersProperties(t,s){const e=new Set;Object.keys(t).forEach((t=>e.add(t)));let a=Object.getPrototypeOf(t);while(a&&a!==HTMLElement.prototype){Object.keys(a).forEach((t=>e.add(t)));a=Object.getPrototypeOf(a)}e.forEach((e=>{if(typeof t[e]!=="function"&&!e.startsWith("on")&&!o.has(e)){try{const a=t[e];if(typeof a==="string"&&a.includes("__")){t[e]=a.replace(/__([\w.]+)__/g,((t,e)=>this.replaceKeyWithValue(s,e)))}}catch(t){console.warn(`Could not assign property ${e}:`,t.message)}}}))}parseColumns(t,s){this.parseColumnsArray(t,s)}parseJsonColumns(t,s){try{const e=t?JSON.parse(t):[];this.parseColumnsArray(e,s)}catch(t){console.error("Invalid JSON format for columnsConfigJson:",t.message);this.parsedColumns=[]}}parseData(t,s){this.parseDataArray(t,s)}parseJsonData(t){try{const s=t?JSON.parse(t):[];this.parseDataArray(s,this.parsedData)}catch(t){console.error("Invalid JSON format for dataJson:",t.message);this.parsedData=[]}}handleParsedChange(){this.initializeTable()}componentWillLoad(){this.cacheTemplates();this.parseDataAndColumns()}render(){const t=!this.table||this.table===undefined||this.parsedColumns.length===0?[]:this.table.columns;const s=!this.table||this.table===undefined||this.parsedData.length===0?[]:this.table.data;return e(a,{key:"1b6e90df16e6f35fab46bdd7b9366122ace0c93f"},e("div",{key:"77d54a2d44fad92dd8eae7bba4752adb6da28406",class:"hidden"},e("slot",{key:"c5f9508d2ffcd61dd660acd11df74d7d1bf12516"})),e("slot",{key:"b1dc1a74cafbd302a9b81d1226ee7e7f4061c357",name:"before"}),this.parsedColumns.length===0&&this.parsedData.length===0?e("div",{class:"no-data"},this.noColumnsNoDataMessage):e("table",{class:"table"},this.parsedColumns.length>0&&t.length>0&&e("thead",{class:"table-header"},e("tr",null,t&&t.map((t=>e("th",{key:t.name},this.renderTemplate(this.headerTemplateCache.get(t.name),{})||t.header))))),e("tbody",{class:"table-body"},!s||s.length===0?e("tr",null,e("td",{colSpan:t.length||12,class:"no-data"},this.noDataMessage)):s.map((s=>e("tr",{key:JSON.stringify(s)},t.map((t=>{var a;return e("td",null,this.renderTemplate(this.templateCache.get(t.name),s)||((a=s[t.name])!==null&&a!==void 0?a:this.fallbackValue))}))))))),e("slot",{key:"2b90fd6d1e626faff3e7eb08e2b319ce02de4ec3",name:"after"}))}get el(){return i(this)}static get watchers(){return{columnsConfig:["parseColumns"],columnsConfigJson:["parseJsonColumns"],data:["parseData"],dataJson:["parseJsonData"],parsedColumns:["handleParsedChange"],parsedData:["handleParsedChange"]}}};h.style=l;export{h as nv_table};
|
|
2
|
+
//# sourceMappingURL=p-43071c3b.entry.js.map
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as o,c as t,h as n,H as e}from"./p-d0a33e64.js";const r="nv-togglebutton{display:inline-flex;justify-content:center;align-items:center}nv-togglebutton[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);font-size:var(--button-xs-font-size);padding-top:calc(var(--togglegroup-xs-button-padding-y) - 1px);padding-bottom:calc(var(--togglegroup-xs-button-padding-y) - 1px);border-radius:calc(var(--togglegroup-xs-button-radius));border-width:0}nv-togglebutton[size=xs] nv-icon>svg{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-togglebutton[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);font-size:var(--button-sm-font-size);padding-top:calc(var(--togglegroup-sm-button-padding-y) - 1px);padding-bottom:calc(var(--togglegroup-sm-button-padding-y) - 1px);border-radius:calc(var(--togglegroup-sm-button-radius));border-width:0}nv-togglebutton[size=sm] nv-icon>svg{width:var(--spacing-4);height:var(--spacing-4);stroke-width:1.5px}nv-togglebutton[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);font-size:var(--button-md-font-size);padding-top:calc(var(--togglegroup-md-button-padding-y) - 1px);padding-bottom:calc(var(--togglegroup-md-button-padding-y) - 1px);border-radius:calc(var(--togglegroup-md-button-radius));border-width:0}nv-togglebutton[size=md] nv-icon>svg{width:var(--spacing-5);height:var(--spacing-5);stroke-width:1.6px}nv-togglebutton[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);font-size:var(--button-lg-font-size);padding-top:calc(var(--togglegroup-lg-button-padding-y) - 1px);padding-bottom:calc(var(--togglegroup-lg-button-padding-y) - 1px);border-radius:calc(var(--togglegroup-lg-button-radius));border-width:0}nv-togglebutton[size=lg] nv-icon>svg{width:var(--spacing-6);height:var(--spacing-6);stroke-width:1.8px}nv-togglebutton[emphasis=high]{background:var(--components-button-low-background);border:1px solid var(--components-button-low-border);color:var(--components-button-low-text)}nv-togglebutton[emphasis=high]:hover{background:var(--components-button-low-background-hover);border:1px solid var(--components-button-low-border);color:var(--components-button-low-text-hover)}nv-togglebutton[emphasis=high]: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-togglebutton[emphasis=high]:focus,nv-togglebutton[emphasis=high]:focus-within{outline:none}nv-togglebutton[emphasis=high]:focus-visible,nv-togglebutton[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);z-index:111}nv-togglebutton[emphasis=high]:disabled:not([disabled=false]){opacity:0.5;cursor:not-allowed;box-shadow:none}nv-togglebutton[emphasis=high][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-togglebutton[emphasis=low]{background:var(--components-button-lower-background);border:1px solid var(--components-button-lower-border);color:var(--components-button-lower-text)}nv-togglebutton[emphasis=low]:hover{background:var(--components-button-lower-background-hover);border:1px solid var(--components-button-lower-border);color:var(--components-button-lower-text-hover)}nv-togglebutton[emphasis=low]: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-togglebutton[emphasis=low]:focus,nv-togglebutton[emphasis=low]:focus-within{outline:none}nv-togglebutton[emphasis=low]:focus-visible,nv-togglebutton[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);z-index:111}nv-togglebutton[emphasis=low]:disabled:not([disabled=false]){opacity:0.5;cursor:not-allowed;box-shadow:none}nv-togglebutton[emphasis=low][active]:not([active=false]),nv-togglebutton[emphasis=low]:active{background:var(--components-button-lower-background-hover);border:1px solid var(--components-button-lower-border);color:var(--components-button-lower-text-hover)}";const a=r;const i=class{constructor(n){o(this,n);this.toggled=t(this,"toggled",7);this.size="md";this.disabled=false;this.active=false;this.emphasis="high";this.handleClick=()=>{if(this.disabled)return;this.toggled.emit({value:this.value,active:this.active})}}render(){return n(e,{key:"81e773d6bafc0fd451fb7e71cb14ca709af2d07e",role:"button",tabindex:"0","aria-pressed":String(this.active),onClick:this.handleClick},n("slot",{key:"4cec2d6ae5388cdfd285ab15af356e9833b0ccb3"}))}};i.style=a;export{i as nv_togglebutton};
|
|
2
|
+
//# sourceMappingURL=p-44dd9a4c.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["nvTogglebuttonCss","NvTogglebuttonStyle0","NvTogglebutton","constructor","hostRef","this","size","disabled","active","emphasis","handleClick","toggled","emit","value","render","h","Host","key","role","tabindex","String","onClick"],"sources":["src/components/nv-togglebutton/styles/nv-togglebutton.scss?tag=nv-togglebutton","src/components/nv-togglebutton/nv-togglebutton.tsx"],"sourcesContent":["@use \"./mixins\" as *;\n\nnv-togglebutton {\n @include root-styles();\n\n @each $size in $sizes {\n &[size=\"#{$size}\"] {\n @include button-size-styles($size);\n @include togglegroup-button-size-styles($size);\n }\n }\n\n &[emphasis=\"high\"] {\n @include button-emphasis-styles('low');\n &[active]:not([active=\"false\"]) {\n @include button-active-styles('low');\n }\n }\n &[emphasis=\"low\"] {\n @include button-emphasis-styles('lower');\n &[active]:not([active=\"false\"]), &:active {\n @include button-hover-styles('lower');\n }\n }\n}\n","import { Component, Host, h, Prop, Event, EventEmitter } from '@stencil/core';\nimport { ToggleButtonEmphasis, ToggleButtonSize } from '../../utils/constants';\n\n/**\n * @slot default - Child content of the toggle button.\n */\n@Component({\n tag: 'nv-togglebutton',\n styleUrl: 'styles/nv-togglebutton.scss',\n shadow: false,\n})\nexport class NvTogglebutton {\n /****************************************************************************/\n //#region PROPERTIES\n\n /**\n * Determines how large or small the togglebutton appears, allowing for\n * customization of the togglebutton's dimensions to fit different design\n * specifications and user needs.\n */\n @Prop({ reflect: true })\n readonly size: `${ToggleButtonSize}` = 'md';\n\n /**\n * The value to associated with the button when selected in a\n * Togglebuttongroup.\n */\n @Prop({ reflect: true })\n readonly value: string;\n\n /**\n * Prevents all interaction, rendering the toggle in a non-interactive state.\n */\n @Prop({ reflect: true })\n readonly disabled: boolean = false;\n\n /**\n * Whether the button is active or not. Will not toggle automatically but\n * needs to be controlled externally.\n */\n @Prop({ reflect: true })\n readonly active: boolean = false;\n\n /**\n * Make it more or less visually prominent to users.\n */\n @Prop({ reflect: true })\n readonly emphasis: `${ToggleButtonEmphasis}` = 'high';\n\n //#endregion PROPERTIES\n /****************************************************************************/\n //#region METHODS\n\n private handleClick = () => {\n if (this.disabled) return;\n\n this.toggled.emit({\n value: this.value,\n active: this.active,\n });\n };\n\n //#endregion METHODS\n /****************************************************************************/\n //#region EVENTS\n\n /**\n * Emitted when the button is toggled.\n */\n @Event({ eventName: 'toggled' })\n toggled: EventEmitter<{\n /** The value associated with the button. */\n value: string;\n /** If the button is active when clicked. */\n active: boolean;\n }>;\n\n //#endregion EVENTS\n /****************************************************************************/\n //#region RENDER\n render() {\n return (\n <Host\n role=\"button\"\n tabindex=\"0\"\n aria-pressed={String(this.active)}\n onClick={this.handleClick}\n >\n <slot></slot>\n </Host>\n );\n }\n // #endregion RENDER\n}\n"],"mappings":"yDAAA,MAAMA,EAAoB,4oJAC1B,MAAAC,EAAeD,E,MCUFE,EAAc,MAL3B,WAAAC,CAAAC,G,2CAeWC,KAAAC,KAA8B,KAa9BD,KAAAE,SAAoB,MAOpBF,KAAAG,OAAkB,MAMlBH,KAAAI,SAAsC,OAMvCJ,KAAAK,YAAc,KACpB,GAAIL,KAAKE,SAAU,OAEnBF,KAAKM,QAAQC,KAAK,CAChBC,MAAOR,KAAKQ,MACZL,OAAQH,KAAKG,QACb,C,CAqBJ,MAAAM,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,KAAK,SACLC,SAAS,IAAG,eACEC,OAAOf,KAAKG,QAC1Ba,QAAShB,KAAKK,aAEdK,EAAA,QAAAE,IAAA,6C","ignoreList":[]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as t,h as o,H as i,g as r}from"./p-d0a33e64.js";function n(t){const o=t.tagName.toLowerCase();if(o==="nv-button"||o==="nv-iconbutton"||o==="a"){return t}for(const o of Array.from(t.children)){const t=n(o);if(t){return t}}return null}function e(t,o){const i=Array.from(t.children);const r=[];i.forEach((t=>{const o=n(t);if(o){r.push(o)}}));r.forEach((t=>{t.classList.remove("first","last","group-item")}));r.forEach(((t,i)=>{const n=i===0;const e=i===r.length-1;const s=t.tagName.toLowerCase();if(n){t.classList.add("first")}if(e){t.classList.add("last")}t.classList.add("group-item");if(s==="nv-button"||s==="nv-iconbutton"){t.setAttribute("size",o.size);t.setAttribute("emphasis",o.emphasis);if(o.fluid){t.setAttribute("fluid","")}else{t.removeAttribute("fluid")}}if(s==="a"){t.classList.add("nv-button");t.classList.add(`size-${o.size}`);t.classList.add(`emphasis-${o.emphasis}`);if(o.fluid){t.classList.add("fluid")}else{t.classList.remove("fluid")}}}))}const s="nv-buttongroup{display:flex}nv-buttongroup[emphasis=high]{gap:1px}nv-buttongroup[emphasis=low] .group-item,nv-buttongroup[emphasis=low] .group-item:hover{border:1px solid var(--components-button-low-text)}nv-buttongroup[emphasis=lower] .group-item,nv-buttongroup[emphasis=lower] .group-item:hover{border:1px solid var(--components-button-lower-text)}nv-buttongroup:not([orientation=vertical]) .group-item:not(.last):not(.first){border-radius:0}nv-buttongroup:not([orientation=vertical]) .group-item.first{border-top-right-radius:0;border-bottom-right-radius:0}nv-buttongroup:not([orientation=vertical]) .group-item.last{border-top-left-radius:0;border-bottom-left-radius:0}nv-buttongroup:not([orientation=vertical])[emphasis=medium] .group-item:not(.last){border-right:none}nv-buttongroup:not([orientation=vertical])[emphasis=low] .group-item:not(.last){border-right:none}nv-buttongroup:not([orientation=vertical])[emphasis=low] .group-item:not(.first){border-left:none}nv-buttongroup:not([orientation=vertical])[emphasis=lower] .group-item:not(.last){border-right:none}nv-buttongroup:not([orientation=vertical])[emphasis=lower] .group-item:not(.first){border-left:none}nv-buttongroup[orientation=vertical]{flex-direction:column;align-items:stretch;width:fit-content}nv-buttongroup[orientation=vertical] .group-item{width:unset;display:flex}nv-buttongroup[orientation=vertical] .group-item:not(.last):not(.first){border-radius:0}nv-buttongroup[orientation=vertical] .group-item.first{border-bottom-left-radius:0;border-bottom-right-radius:0}nv-buttongroup[orientation=vertical] .group-item.last{border-top-left-radius:0;border-top-right-radius:0}nv-buttongroup[orientation=vertical][emphasis=medium] .group-item:not(.last){border-bottom:none}nv-buttongroup[orientation=vertical][emphasis=low] .group-item:not(.last){border-bottom:none}nv-buttongroup[orientation=vertical][emphasis=low] .group-item:not(.first){border-top:none}nv-buttongroup[orientation=vertical][emphasis=lower] .group-item:not(.last){border-bottom:none}nv-buttongroup[orientation=vertical][emphasis=lower] .group-item:not(.first){border-top:none}";const u=s;const a=class{constructor(o){t(this,o);this.size="md";this.emphasis="medium";this.fluid=false;this.orientation="horizontal";this.forwardPropsToChildren=()=>{e(this.el,{size:this.size,emphasis:this.emphasis,fluid:this.fluid})};this.setupMutationObserver=()=>{this.mutationObserver=new MutationObserver((t=>{t.forEach((t=>{if(t.type==="childList"&&t.addedNodes.length>0){this.forwardPropsToChildren()}}))}));this.mutationObserver.observe(this.el,{childList:true,subtree:true})}}onEmphasisChange(){this.forwardPropsToChildren()}onSizeChange(){this.forwardPropsToChildren()}onFluidChange(){this.forwardPropsToChildren()}componentWillLoad(){this.forwardPropsToChildren();this.setupMutationObserver()}disconnectedCallback(){if(this.mutationObserver){this.mutationObserver.disconnect()}}render(){return o(i,{key:"d0322897a0312e7b55b087e4abfc94fcaf9f7747"},o("slot",{key:"70afccf10fe728482096d3fce42083e9931e06bd"}))}get el(){return r(this)}static get watchers(){return{emphasis:["onEmphasisChange"],size:["onSizeChange"],fluid:["onFluidChange"]}}};a.style=u;export{a as nv_buttongroup};
|
|
2
|
+
//# sourceMappingURL=p-464bb197.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["findFirstButtonOrLink","element","tagName","toLowerCase","child","Array","from","children","found","forwardPropsToChildren","containerElement","props","buttonElements","forEach","buttonOrLink","push","classList","remove","index","isFirst","isLast","length","add","setAttribute","size","emphasis","fluid","removeAttribute","nvButtongroupCss","NvButtongroupStyle0","NvButtongroup","constructor","hostRef","this","orientation","el","setupMutationObserver","mutationObserver","MutationObserver","mutations","mutation","type","addedNodes","observe","childList","subtree","onEmphasisChange","onSizeChange","onFluidChange","componentWillLoad","disconnectedCallback","disconnect","render","h","Host","key"],"sources":["src/components/nv-buttongroup/nv-buttongroup.utils.ts","src/components/nv-buttongroup/styles/nv-buttongroup.scss?tag=nv-buttongroup","src/components/nv-buttongroup/nv-buttongroup.tsx"],"sourcesContent":["/**\n * Utility functions for nv-buttongroup.\n */\n\n/**\n * Recursively finds the first button or link element within a container\n * @param {HTMLElement} element - The HTML element to search within\n * @returns {HTMLElement | null} The first button or link element found, or null if none exists\n */\nexport function findFirstButtonOrLink(\n element: HTMLElement,\n): HTMLElement | null {\n // Check if the element itself is a button or link\n const tagName = element.tagName.toLowerCase();\n if (\n tagName === 'nv-button' ||\n tagName === 'nv-iconbutton' ||\n tagName === 'a'\n ) {\n return element;\n }\n\n // Recursively search through children\n for (const child of Array.from(element.children) as HTMLElement[]) {\n const found = findFirstButtonOrLink(child);\n if (found) {\n return found;\n }\n }\n\n return null;\n}\n\n/**\n * Forwards the buttongroup properties to all child elements\n * @param {HTMLElement} containerElement - The container element containing the buttons\n * @param {object} props - The properties to forward to children\n * @param {string} props.size - The size property to apply\n * @param {string} props.emphasis - The emphasis property to apply\n * @param {boolean} props.fluid - Whether the buttons should be fluid\n */\nexport function forwardPropsToChildren(\n containerElement: HTMLElement,\n props: {\n /** The size property to apply */\n size: string;\n /** The emphasis property to apply */\n emphasis: string;\n /** Whether the buttons should be fluid */\n fluid: boolean;\n },\n): void {\n const children = Array.from(containerElement.children) as HTMLElement[];\n const buttonElements: HTMLElement[] = [];\n\n // Find the first button or link in each direct child\n children.forEach(child => {\n const buttonOrLink = findFirstButtonOrLink(child);\n if (buttonOrLink) {\n buttonElements.push(buttonOrLink);\n }\n });\n\n buttonElements.forEach(element => {\n element.classList.remove('first', 'last', 'group-item');\n });\n\n // Apply properties and positional classes to found elements\n buttonElements.forEach((element, index) => {\n const isFirst = index === 0;\n const isLast = index === buttonElements.length - 1;\n const tagName = element.tagName.toLowerCase();\n\n // Add positional classes\n if (isFirst) {\n element.classList.add('first');\n }\n if (isLast) {\n element.classList.add('last');\n }\n\n // Add group item classes\n element.classList.add('group-item');\n\n // Forward props to nv-button elements\n if (tagName === 'nv-button' || tagName === 'nv-iconbutton') {\n element.setAttribute('size', props.size);\n element.setAttribute('emphasis', props.emphasis);\n if (props.fluid) {\n element.setAttribute('fluid', '');\n } else {\n element.removeAttribute('fluid');\n }\n }\n\n // Forward props to anchor elements by adding CSS classes\n if (tagName === 'a') {\n element.classList.add('nv-button');\n element.classList.add(`size-${props.size}`);\n element.classList.add(`emphasis-${props.emphasis}`);\n if (props.fluid) {\n element.classList.add('fluid');\n } else {\n element.classList.remove('fluid');\n }\n }\n });\n}\n","@use \"./mixins\" as *;\n\nnv-buttongroup {\n @include root-styles();\n\n &[emphasis=\"high\"] {\n @include high-emphasis-styles();\n }\n &[emphasis=\"low\"] {\n @include low-emphasis-styles();\n }\n &[emphasis=\"lower\"] {\n @include lower-emphasis-styles();\n }\n\n &:not([orientation=\"vertical\"]) {\n @include border-radius-horizontal-styles();\n\n &[emphasis=\"medium\"] {\n @include medium-emphasis-horizontal-styles();\n }\n &[emphasis=\"low\"] {\n @include low-emphasis-horizontal-styles();\n }\n &[emphasis=\"lower\"] {\n @include lower-emphasis-horizontal-styles();\n }\n }\n\n &[orientation=\"vertical\"] {\n @include vertical-styles();\n @include border-radius-vertical-styles();\n\n &[emphasis=\"medium\"] {\n @include medium-emphasis-vertical-styles();\n }\n &[emphasis=\"low\"] {\n @include low-emphasis-vertical-styles();\n }\n &[emphasis=\"lower\"] {\n @include lower-emphasis-vertical-styles();\n }\n }\n}","import { Component, Host, h, Prop, Element, Watch } from '@stencil/core';\n\nimport { ButtonSize, ButtonEmphasis } from '../../utils/constants';\nimport { forwardPropsToChildren } from './nv-buttongroup.utils';\n\n/**\n * @slot default - Child buttons or links.\n */\n@Component({\n tag: 'nv-buttongroup',\n styleUrl: 'styles/nv-buttongroup.scss',\n shadow: false,\n})\nexport class NvButtongroup {\n @Element() el: HTMLNvButtongroupElement;\n private mutationObserver: MutationObserver;\n\n /****************************************************************************/\n //#region PROPERTIES\n\n /**\n * Determines how large or small all the buttons appear, allowing for\n * customization of the button's dimensions to fit different design\n * specifications and user needs.\n */\n @Prop({ reflect: true })\n readonly size: `${ButtonSize}` = 'md';\n\n /**\n * Adjusts the emphasis of all the buttons to make it more or less visually\n * prominent to users. Use this to draw attention to important actions or\n * reduce focus on less critical ones\n */\n @Prop({ reflect: true })\n readonly emphasis: `${ButtonEmphasis}` = 'medium';\n\n /**\n * Allows the button group to stretch and fill the entire width of its\n * container.\n */\n @Prop({ reflect: true })\n readonly fluid: boolean = false;\n\n /**\n * Determines the orientation of the button group. When enabled, the buttons\n * are stacked vertically rather than aligned side by side.\n */\n @Prop({ reflect: true })\n readonly orientation: 'vertical' | 'horizontal' = 'horizontal';\n\n //#endregion PROPERTIES\n /****************************************************************************/\n //#region METHODS\n\n /**\n * Forwards the buttongroup properties to all child elements\n */\n private forwardPropsToChildren = (): void => {\n forwardPropsToChildren(this.el, {\n size: this.size,\n emphasis: this.emphasis,\n fluid: this.fluid,\n });\n };\n\n /**\n * Sets up the MutationObserver to watch for changes in child elements\n */\n private setupMutationObserver = (): void => {\n this.mutationObserver = new MutationObserver(mutations => {\n mutations.forEach(mutation => {\n if (mutation.type === 'childList' && mutation.addedNodes.length > 0) {\n // Forward props to all children when changes occur\n this.forwardPropsToChildren();\n }\n });\n });\n\n this.mutationObserver.observe(this.el, {\n childList: true,\n subtree: true,\n });\n };\n\n //#endregion METHODS\n /****************************************************************************/\n //#region WATCHERS\n\n @Watch('emphasis')\n onEmphasisChange() {\n this.forwardPropsToChildren();\n }\n\n @Watch('size')\n onSizeChange() {\n this.forwardPropsToChildren();\n }\n\n @Watch('fluid')\n onFluidChange() {\n this.forwardPropsToChildren();\n }\n\n //#endregion WATCHERS\n /****************************************************************************/\n //#region LIFECYCLE\n\n componentWillLoad() {\n this.forwardPropsToChildren();\n this.setupMutationObserver();\n }\n\n disconnectedCallback() {\n if (this.mutationObserver) {\n this.mutationObserver.disconnect();\n }\n }\n\n //#endregion LIFECYCLE\n /****************************************************************************/\n //#region EVENTS\n //#endregion EVENTS\n /****************************************************************************/\n //#region RENDER\n render() {\n return (\n <Host>\n <slot></slot>\n </Host>\n );\n }\n // #endregion RENDER\n}\n"],"mappings":"kEASgBA,EACdC,GAGA,MAAMC,EAAUD,EAAQC,QAAQC,cAChC,GACED,IAAY,aACZA,IAAY,iBACZA,IAAY,IACZ,CACA,OAAOD,C,CAIT,IAAK,MAAMG,KAASC,MAAMC,KAAKL,EAAQM,UAA4B,CACjE,MAAMC,EAAQR,EAAsBI,GACpC,GAAII,EAAO,CACT,OAAOA,C,EAIX,OAAO,IACT,C,SAUgBC,EACdC,EACAC,GASA,MAAMJ,EAAWF,MAAMC,KAAKI,EAAiBH,UAC7C,MAAMK,EAAgC,GAGtCL,EAASM,SAAQT,IACf,MAAMU,EAAed,EAAsBI,GAC3C,GAAIU,EAAc,CAChBF,EAAeG,KAAKD,E,KAIxBF,EAAeC,SAAQZ,IACrBA,EAAQe,UAAUC,OAAO,QAAS,OAAQ,aAAa,IAIzDL,EAAeC,SAAQ,CAACZ,EAASiB,KAC/B,MAAMC,EAAUD,IAAU,EAC1B,MAAME,EAASF,IAAUN,EAAeS,OAAS,EACjD,MAAMnB,EAAUD,EAAQC,QAAQC,cAGhC,GAAIgB,EAAS,CACXlB,EAAQe,UAAUM,IAAI,Q,CAExB,GAAIF,EAAQ,CACVnB,EAAQe,UAAUM,IAAI,O,CAIxBrB,EAAQe,UAAUM,IAAI,cAGtB,GAAIpB,IAAY,aAAeA,IAAY,gBAAiB,CAC1DD,EAAQsB,aAAa,OAAQZ,EAAMa,MACnCvB,EAAQsB,aAAa,WAAYZ,EAAMc,UACvC,GAAId,EAAMe,MAAO,CACfzB,EAAQsB,aAAa,QAAS,G,KACzB,CACLtB,EAAQ0B,gBAAgB,Q,EAK5B,GAAIzB,IAAY,IAAK,CACnBD,EAAQe,UAAUM,IAAI,aACtBrB,EAAQe,UAAUM,IAAI,QAAQX,EAAMa,QACpCvB,EAAQe,UAAUM,IAAI,YAAYX,EAAMc,YACxC,GAAId,EAAMe,MAAO,CACfzB,EAAQe,UAAUM,IAAI,Q,KACjB,CACLrB,EAAQe,UAAUC,OAAO,Q,KAIjC,CC3GA,MAAMW,EAAmB,qkEACzB,MAAAC,EAAeD,E,MCYFE,EAAa,MAL1B,WAAAC,CAAAC,G,UAkBWC,KAAAT,KAAwB,KAQxBS,KAAAR,SAAgC,SAOhCQ,KAAAP,MAAiB,MAOjBO,KAAAC,YAAyC,aAS1CD,KAAAxB,uBAAyB,KAC/BA,EAAuBwB,KAAKE,GAAI,CAC9BX,KAAMS,KAAKT,KACXC,SAAUQ,KAAKR,SACfC,MAAOO,KAAKP,OACZ,EAMIO,KAAAG,sBAAwB,KAC9BH,KAAKI,iBAAmB,IAAIC,kBAAiBC,IAC3CA,EAAU1B,SAAQ2B,IAChB,GAAIA,EAASC,OAAS,aAAeD,EAASE,WAAWrB,OAAS,EAAG,CAEnEY,KAAKxB,wB,IAEP,IAGJwB,KAAKI,iBAAiBM,QAAQV,KAAKE,GAAI,CACrCS,UAAW,KACXC,QAAS,MACT,C,CAQJ,gBAAAC,GACEb,KAAKxB,wB,CAIP,YAAAsC,GACEd,KAAKxB,wB,CAIP,aAAAuC,GACEf,KAAKxB,wB,CAOP,iBAAAwC,GACEhB,KAAKxB,yBACLwB,KAAKG,uB,CAGP,oBAAAc,GACE,GAAIjB,KAAKI,iBAAkB,CACzBJ,KAAKI,iBAAiBc,Y,EAU1B,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,QAAAE,IAAA,6C","ignoreList":[]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as o,c as
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{r as o,c as t,h as e,H as a,g as r}from"./p-d0a33e64.js";const s="nv-tooltip{display:inline-block;position:relative;user-select:none}nv-tooltip:has([fluid]:not([fluid=false])){display:block}nv-tooltip [data-scope=popover]{background:var(--components-tooltip-background);color:var(--components-tooltip-text);font-weight:var(--font-weight-medium-emphasis);padding:var(--tooltip-padding-y) var(--tooltip-padding-x);font-size:var(--tooltip-font-size);border-radius:var(--tooltip-radius);border:none;box-shadow:0px var(--shadow-y-axis-lg-1) var(--shadow-blur-lg-1) var(--shadow-spread-lg-1) var(--shadow-color-opacity-1), 0px var(--shadow-y-axis-lg-2) var(--shadow-blur-lg-2) var(--shadow-spread-lg-2) var(--shadow-color-opacity-2)}nv-tooltip [data-scope=popover] [data-scope=arrow]{background:var(--components-tooltip-background);box-shadow:none;border:none}";const d=s;const i=class{constructor(e){o(this,e);this.openChanged=t(this,"openChanged",7);this.placement="bottom";this.enterDelay=0}componentWillLoad(){if(!this.triggerElement)this.triggerElement=Array.from(this.el.children).find((o=>o.getAttribute("slot")===null))}render(){return e(a,{key:"d4ee448b0dddf4229d3d845d86758a1e794c35e8"},e("slot",{key:"5d24c99b18925e44a8dedd868922227339638e73"}),e("nv-popover",{key:"4ee6f08994042689a628c238905484b1aa9de555",triggerMode:"hover",hasArrow:true,placement:this.placement,triggerElement:this.triggerElement,groupName:"tooltip",enterDelay:this.enterDelay},e("p",{key:"e8ac1f3f739f3b12172884e298494dede993b888",slot:"content"},this.message),e("slot",{key:"96c2e3f5d9b72f5311ebe89e8ebe18274b2bfb13",name:"content"})))}get el(){return r(this)}};i.style=d;export{i as nv_tooltip};
|
|
2
|
+
//# sourceMappingURL=p-49504fd6.entry.js.map
|