@nova-design-system/nova-react 3.11.0 → 3.13.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.
Files changed (64) hide show
  1. package/README.md +27 -58
  2. package/dist/cjs/collapse.animation-acda1bf5-BuORVmQv.js +214 -0
  3. package/dist/cjs/{constants-23aaef7b-Cj2b-su0.js → constants-d0f19e7b-s0SCO_vi.js} +5 -0
  4. package/dist/cjs/fade.animation-eb454088-Bma0SpTf.js +724 -0
  5. package/dist/cjs/{index-9kW3hkgy.js → index-Jgn7NELT.js} +2422 -1713
  6. package/dist/cjs/index.js +69 -1
  7. package/dist/cjs/{nv-accordion-item.entry-77CmzSqs.js → nv-accordion-item.entry-C7vVmDCg.js} +74 -40
  8. package/dist/cjs/nv-accordion.entry-CFynyAOo.js +178 -0
  9. package/dist/cjs/{nv-alert.entry-4ATJ67O4.js → nv-alert.entry-C_FMs0Yi.js} +20 -20
  10. package/dist/cjs/{nv-avatar.entry-DOI0QFTW.js → nv-avatar.entry-BvjSzIHn.js} +7 -7
  11. package/dist/cjs/nv-badge_2.entry-CLNvgVtj.js +212 -0
  12. package/dist/cjs/{nv-breadcrumb.entry-C6TteX7v.js → nv-breadcrumb.entry-Ch2Cvr_a.js} +2 -2
  13. package/dist/cjs/{nv-breadcrumbs.entry-CpYRzd4I.js → nv-breadcrumbs.entry-DmH8AGIm.js} +1 -1
  14. package/dist/cjs/{nv-button.entry-DUU-LHJM.js → nv-button.entry-B0lusQ2w.js} +8 -8
  15. package/dist/cjs/{nv-buttongroup.entry-BDdi1Z66.js → nv-buttongroup.entry-DLVCcdh9.js} +1 -1
  16. package/dist/cjs/{nv-calendar.entry-DMpLDXJG.js → nv-calendar.entry-BmX0f_Or.js} +20 -16
  17. package/dist/cjs/{nv-col.entry-WTuI3NnF.js → nv-col.entry-lysICYEC.js} +1 -1
  18. package/dist/cjs/{nv-datagrid.entry-BXqZFjrC.js → nv-datagrid.entry-vG3h5dj3.js} +7 -7
  19. package/dist/cjs/{nv-datagridcolumn.entry-B-M6q2Tk.js → nv-datagridcolumn.entry-9NynF9K-.js} +1 -1
  20. package/dist/cjs/{nv-dialog.entry-DEM7iOao.js → nv-dialog.entry-Ctsz1K-O.js} +3 -3
  21. package/dist/cjs/{nv-dialogfooter_2.entry-B09v2yKV.js → nv-dialogfooter_2.entry-B17HEgyc.js} +10 -7
  22. package/dist/cjs/{nv-fieldcheckbox.entry-Z5tjeUuU.js → nv-fieldcheckbox.entry-DMiADwqV.js} +2 -2
  23. package/dist/cjs/{nv-fielddate.entry-5lSIc9Ek.js → nv-fielddate.entry-D3X6Jl3u.js} +2 -2
  24. package/dist/cjs/{nv-fielddaterange.entry-CuhBqqML.js → nv-fielddaterange.entry-C8_SFFXW.js} +2 -2
  25. package/dist/cjs/{nv-fielddropdown.entry-BFFr0ATC.js → nv-fielddropdown.entry-BiBR8Qgs.js} +2 -2
  26. package/dist/cjs/{nv-fielddropdownitem.entry-BugR9GTU.js → nv-fielddropdownitem.entry-DQ8QK4AS.js} +1 -1
  27. package/dist/cjs/{nv-fieldmultiselect.entry-S7ur1tcN.js → nv-fieldmultiselect.entry-J5VTOPum.js} +2 -32
  28. package/dist/cjs/{nv-fieldnumber.entry-BMpv7Xab.js → nv-fieldnumber.entry-Djpg1HMq.js} +3 -3
  29. package/dist/cjs/{nv-fieldpassword.entry-B5WsGvF8.js → nv-fieldpassword.entry-DKT9Xn5H.js} +2 -2
  30. package/dist/cjs/{nv-fieldradio.entry-BhojWkU4.js → nv-fieldradio.entry-CPYf3K2o.js} +2 -2
  31. package/dist/cjs/{nv-fieldselect.entry-CCM3U7mj.js → nv-fieldselect.entry-DnbL7aZB.js} +2 -2
  32. package/dist/cjs/{nv-fieldslider.entry-XQRuw_C-.js → nv-fieldslider.entry-CNRJuo7v.js} +25 -17
  33. package/dist/cjs/{nv-fieldtext.entry-DtgMcL9y.js → nv-fieldtext.entry-B9lIHck7.js} +1 -1
  34. package/dist/cjs/{nv-fieldtextarea.entry-BF4luAgA.js → nv-fieldtextarea.entry-B2EDj8cm.js} +1 -1
  35. package/dist/cjs/{nv-fieldtime.entry-DyP6QWzm.js → nv-fieldtime.entry-CpoXpAPx.js} +61 -61
  36. package/dist/cjs/nv-icon.entry-DbOeEd4f.js +79 -0
  37. package/dist/cjs/{nv-iconbutton_2.entry-DlLquYC0.js → nv-iconbutton_2.entry-DR_wR73O.js} +2 -2
  38. package/dist/cjs/{nv-menu.entry-Dj2paHp_.js → nv-menu.entry-DB_G8hS_.js} +1 -1
  39. package/dist/cjs/{nv-menuitem.entry-DbV-21bC.js → nv-menuitem.entry-PBCNIzPI.js} +1 -1
  40. package/dist/cjs/nv-notification.entry-CyumbQS_.js +178 -0
  41. package/dist/cjs/{nv-popover.entry-mefWRuFR.js → nv-popover.entry-ttESQMgj.js} +29 -12
  42. package/dist/cjs/{nv-row.entry-Ds7BSvjO.js → nv-row.entry-DPEGaFeS.js} +2 -2
  43. package/dist/cjs/{nv-stack.entry-vlegAAKj.js → nv-stack.entry-CTPwlz23.js} +2 -2
  44. package/dist/cjs/{nv-table.entry-CiZvYc93.js → nv-table.entry-Dv1mZKcu.js} +3 -3
  45. package/dist/cjs/{nv-tablecolumn.entry-ChUzCWVu.js → nv-tablecolumn.entry-DrAaeHm-.js} +1 -1
  46. package/dist/cjs/{nv-toggle.entry-CLY7TxJv.js → nv-toggle.entry-D2TRd371.js} +4 -4
  47. package/dist/cjs/nv-togglebutton.entry-D95qOQ1K.js +55 -0
  48. package/dist/cjs/{nv-togglebuttongroup.entry-JZNZk6j2.js → nv-togglebuttongroup.entry-BNvyZgbh.js} +2 -2
  49. package/dist/cjs/{nv-tooltip.entry-BhwdNKUk.js → nv-tooltip.entry-oOw6EmyL.js} +12 -3
  50. package/dist/cjs/{stylefire.es-74da334a-y0piPjlz.js → style-value-types.es-f5d10b79-D0QCM8OB.js} +50 -694
  51. package/dist/cjs/{timeline.animation-adf35ecb-CE6Dsdxr.js → timeline.animation-79215cd4-KteJaZPb.js} +19 -0
  52. package/dist/generated/components.js +8 -0
  53. package/dist/generated/components.server.js +21 -2
  54. package/dist/index.js +1 -0
  55. package/dist/types/generated/components.d.ts +5 -0
  56. package/dist/types/generated/components.server.d.ts +5 -0
  57. package/dist/types/index.d.ts +1 -0
  58. package/package.json +4 -2
  59. package/dist/cjs/collapse.animation-16e3af45-CChx_tQJ.js +0 -84
  60. package/dist/cjs/fade.animation-71e8e34c-BAw_TYsB.js +0 -68
  61. package/dist/cjs/nv-accordion.entry-DCspxUr-.js +0 -164
  62. package/dist/cjs/nv-badge_2.entry-h081ah26.js +0 -212
  63. package/dist/cjs/nv-icon.entry-DlnsNiSG.js +0 -79
  64. package/dist/cjs/nv-togglebutton.entry-C6dUap1P.js +0 -55
@@ -1,212 +0,0 @@
1
- 'use strict';
2
-
3
- var index = require('./index-9kW3hkgy.js');
4
- var clsx297c1ffe = require('./clsx-297c1ffe-BtxeOLZW.js');
5
- var collapse_animation16e3af45 = require('./collapse.animation-16e3af45-CChx_tQJ.js');
6
- var fade_animation71e8e34c = require('./fade.animation-71e8e34c-BAw_TYsB.js');
7
- require('./stylefire.es-74da334a-y0piPjlz.js');
8
- var timeline_animationAdf35ecb = require('./timeline.animation-adf35ecb-CE6Dsdxr.js');
9
- require('react');
10
-
11
- const nvBadgeCss = "nv-badge{padding:var(--badge-padding-y) var(--badge-padding-x);display:inline-flex !important;gap:var(--badge-gap-x);vertical-align:middle;align-items:center;border-radius:var(--radius-rounded-full);border-style:solid;border-width:0.5px;height:fit-content;width:fit-content}nv-badge.is-icon-only{padding:var(--badge-padding-y) var(--badge-padding-icon-only-x);gap:var(--badge-gap-icon-only-x)}nv-badge.with-gap{padding:var(--badge-padding-y) var(--badge-padding-x);display:inline-flex !important;gap:var(--badge-gap-x);vertical-align:middle;align-items:center;border-radius:var(--radius-rounded-full);border-style:solid;border-width:0.5px;height:fit-content;width:fit-content}nv-badge.with-gap.is-icon-only{padding:var(--badge-padding-y) var(--badge-padding-icon-only-x);gap:var(--badge-gap-icon-only-x)}nv-badge.visually-hidden{position:absolute;padding:0;border:0;overflow:hidden;white-space:nowrap;width:1px;height:1px;margin:-1px;clip:rect(0, 0, 0, 0)}nv-badge:not(.with-gap){padding:var(--badge-padding-y) var(--badge-padding-x);display:inline-flex !important;gap:var(--badge-gap-x);vertical-align:middle;align-items:center;border-radius:var(--radius-rounded-full);border-style:solid;border-width:0.5px;height:fit-content;width:fit-content}nv-badge:not(.with-gap).is-icon-only{padding:var(--badge-padding-y) var(--badge-padding-icon-only-x);gap:var(--badge-gap-icon-only-x)}nv-badge.badge-1{color:var(--color-rainbow-1-text);background-color:var(--color-rainbow-1-background);border-color:var(--color-rainbow-1-border)}nv-badge.badge-1 .close:focus,nv-badge.badge-1 .close:focus-within{outline:none}nv-badge.badge-1 .close:focus-visible,nv-badge.badge-1 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-1-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-1 nv-icon{color:var(--color-rainbow-1-icon)}nv-badge.badge-2{color:var(--color-rainbow-2-text);background-color:var(--color-rainbow-2-background);border-color:var(--color-rainbow-2-border)}nv-badge.badge-2 .close:focus,nv-badge.badge-2 .close:focus-within{outline:none}nv-badge.badge-2 .close:focus-visible,nv-badge.badge-2 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-2-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-2 nv-icon{color:var(--color-rainbow-2-icon)}nv-badge.badge-3{color:var(--color-rainbow-3-text);background-color:var(--color-rainbow-3-background);border-color:var(--color-rainbow-3-border)}nv-badge.badge-3 .close:focus,nv-badge.badge-3 .close:focus-within{outline:none}nv-badge.badge-3 .close:focus-visible,nv-badge.badge-3 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-3-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-3 nv-icon{color:var(--color-rainbow-3-icon)}nv-badge.badge-4{color:var(--color-rainbow-4-text);background-color:var(--color-rainbow-4-background);border-color:var(--color-rainbow-4-border)}nv-badge.badge-4 .close:focus,nv-badge.badge-4 .close:focus-within{outline:none}nv-badge.badge-4 .close:focus-visible,nv-badge.badge-4 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-4-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-4 nv-icon{color:var(--color-rainbow-4-icon)}nv-badge.badge-5{color:var(--color-rainbow-5-text);background-color:var(--color-rainbow-5-background);border-color:var(--color-rainbow-5-border)}nv-badge.badge-5 .close:focus,nv-badge.badge-5 .close:focus-within{outline:none}nv-badge.badge-5 .close:focus-visible,nv-badge.badge-5 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-5-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-5 nv-icon{color:var(--color-rainbow-5-icon)}nv-badge.badge-6{color:var(--color-rainbow-6-text);background-color:var(--color-rainbow-6-background);border-color:var(--color-rainbow-6-border)}nv-badge.badge-6 .close:focus,nv-badge.badge-6 .close:focus-within{outline:none}nv-badge.badge-6 .close:focus-visible,nv-badge.badge-6 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-6-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-6 nv-icon{color:var(--color-rainbow-6-icon)}nv-badge.badge-7{color:var(--color-rainbow-7-text);background-color:var(--color-rainbow-7-background);border-color:var(--color-rainbow-7-border)}nv-badge.badge-7 .close:focus,nv-badge.badge-7 .close:focus-within{outline:none}nv-badge.badge-7 .close:focus-visible,nv-badge.badge-7 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-7-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-7 nv-icon{color:var(--color-rainbow-7-icon)}nv-badge.badge-8{color:var(--color-rainbow-8-text);background-color:var(--color-rainbow-8-background);border-color:var(--color-rainbow-8-border)}nv-badge.badge-8 .close:focus,nv-badge.badge-8 .close:focus-within{outline:none}nv-badge.badge-8 .close:focus-visible,nv-badge.badge-8 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-8-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-8 nv-icon{color:var(--color-rainbow-8-icon)}nv-badge.badge-9{color:var(--color-rainbow-9-text);background-color:var(--color-rainbow-9-background);border-color:var(--color-rainbow-9-border)}nv-badge.badge-9 .close:focus,nv-badge.badge-9 .close:focus-within{outline:none}nv-badge.badge-9 .close:focus-visible,nv-badge.badge-9 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-9-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-9 nv-icon{color:var(--color-rainbow-9-icon)}nv-badge.badge-10{color:var(--color-rainbow-10-text);background-color:var(--color-rainbow-10-background);border-color:var(--color-rainbow-10-border)}nv-badge.badge-10 .close:focus,nv-badge.badge-10 .close:focus-within{outline:none}nv-badge.badge-10 .close:focus-visible,nv-badge.badge-10 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-10-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-10 nv-icon{color:var(--color-rainbow-10-icon)}nv-badge.badge-error{color:var(--color-feedback-error-low-text);background-color:var(--color-feedback-error-low-background);border-color:var(--color-feedback-error-low-border)}nv-badge.badge-error .close:focus,nv-badge.badge-error .close:focus-within{outline:none}nv-badge.badge-error .close:focus-visible,nv-badge.badge-error .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-feedback-error-low-content, var(--color-feedback-error-low-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-error nv-icon{color:var(--color-feedback-error-low-icon)}nv-badge.badge-information{color:var(--color-feedback-information-low-text);background-color:var(--color-feedback-information-low-background);border-color:var(--color-feedback-information-low-border)}nv-badge.badge-information .close:focus,nv-badge.badge-information .close:focus-within{outline:none}nv-badge.badge-information .close:focus-visible,nv-badge.badge-information .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-feedback-information-low-content, var(--color-feedback-information-low-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-information nv-icon{color:var(--color-feedback-information-low-icon)}nv-badge.badge-neutral{color:var(--color-feedback-neutral-low-text);background-color:var(--color-feedback-neutral-low-background);border-color:var(--color-feedback-neutral-low-border)}nv-badge.badge-neutral .close:focus,nv-badge.badge-neutral .close:focus-within{outline:none}nv-badge.badge-neutral .close:focus-visible,nv-badge.badge-neutral .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-feedback-neutral-low-content, var(--color-feedback-neutral-low-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-neutral nv-icon{color:var(--color-feedback-neutral-low-icon)}nv-badge.badge-success{color:var(--color-feedback-success-low-text);background-color:var(--color-feedback-success-low-background);border-color:var(--color-feedback-success-low-border)}nv-badge.badge-success .close:focus,nv-badge.badge-success .close:focus-within{outline:none}nv-badge.badge-success .close:focus-visible,nv-badge.badge-success .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-feedback-success-low-content, var(--color-feedback-success-low-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-success nv-icon{color:var(--color-feedback-success-low-icon)}nv-badge.badge-warning{color:var(--color-feedback-warning-low-text);background-color:var(--color-feedback-warning-low-background);border-color:var(--color-feedback-warning-low-border)}nv-badge.badge-warning .close:focus,nv-badge.badge-warning .close:focus-within{outline:none}nv-badge.badge-warning .close:focus-visible,nv-badge.badge-warning .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-feedback-warning-low-content, var(--color-feedback-warning-low-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-warning nv-icon{color:var(--color-feedback-warning-low-icon)}nv-badge.badge-amber{color:var(--color-rainbow-1-text);background-color:var(--color-rainbow-1-background);border-color:var(--color-rainbow-1-border)}nv-badge.badge-amber .close:focus,nv-badge.badge-amber .close:focus-within{outline:none}nv-badge.badge-amber .close:focus-visible,nv-badge.badge-amber .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-amber-content, var(--color-rainbow-1-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-amber nv-icon{color:var(--color-rainbow-1-icon)}nv-badge.badge-orange{color:var(--color-rainbow-2-text);background-color:var(--color-rainbow-2-background);border-color:var(--color-rainbow-2-border)}nv-badge.badge-orange .close:focus,nv-badge.badge-orange .close:focus-within{outline:none}nv-badge.badge-orange .close:focus-visible,nv-badge.badge-orange .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-orange-content, var(--color-rainbow-2-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-orange nv-icon{color:var(--color-rainbow-2-icon)}nv-badge.badge-turquoise{color:var(--color-rainbow-5-text);background-color:var(--color-rainbow-5-background);border-color:var(--color-rainbow-5-border)}nv-badge.badge-turquoise .close:focus,nv-badge.badge-turquoise .close:focus-within{outline:none}nv-badge.badge-turquoise .close:focus-visible,nv-badge.badge-turquoise .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-turquoise-content, var(--color-rainbow-5-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-turquoise nv-icon{color:var(--color-rainbow-5-icon)}nv-badge.badge-crimson{color:var(--color-rainbow-6-text);background-color:var(--color-rainbow-6-background);border-color:var(--color-rainbow-6-border)}nv-badge.badge-crimson .close:focus,nv-badge.badge-crimson .close:focus-within{outline:none}nv-badge.badge-crimson .close:focus-visible,nv-badge.badge-crimson .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-crimson-content, var(--color-rainbow-6-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-crimson nv-icon{color:var(--color-rainbow-6-icon)}nv-badge.badge-lime{color:var(--color-rainbow-9-text);background-color:var(--color-rainbow-9-background);border-color:var(--color-rainbow-9-border)}nv-badge.badge-lime .close:focus,nv-badge.badge-lime .close:focus-within{outline:none}nv-badge.badge-lime .close:focus-visible,nv-badge.badge-lime .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-lime-content, var(--color-rainbow-9-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-lime nv-icon{color:var(--color-rainbow-9-icon)}nv-badge.badge-petrol{color:var(--color-rainbow-8-text);background-color:var(--color-rainbow-8-background);border-color:var(--color-rainbow-8-border)}nv-badge.badge-petrol .close:focus,nv-badge.badge-petrol .close:focus-within{outline:none}nv-badge.badge-petrol .close:focus-visible,nv-badge.badge-petrol .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-petrol-content, var(--color-rainbow-8-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-petrol nv-icon{color:var(--color-rainbow-8-icon)}nv-badge span{font-size:var(--font-size-xs);line-height:var(--line-height-xs) !important;text-align:center}nv-badge nv-icon>svg.icon-xs{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-badge nv-icon>svg.icon-sm{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-badge nv-icon>svg.icon-md{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-badge nv-icon>svg.icon-lg{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-badge nv-icon>svg.icon-xl{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-badge .close{padding:0;line-height:0;border:none;background:none;cursor:pointer;color:inherit;display:inline-flex;align-items:center;aspect-ratio:1/1;border-radius:var(--radius-rounded-full)}";
12
- const NvBadgeStyle0 = nvBadgeCss;
13
-
14
- const NvBadge = class {
15
- constructor(hostRef) {
16
- index.registerInstance(this, hostRef);
17
- this.closeClicked = index.createEvent(this, "closeClicked");
18
- this.hiddenChanged = index.createEvent(this, "hiddenChanged");
19
- this.hiddenChangedComplete = index.createEvent(this, "hiddenChangedComplete");
20
- /****************************************************************************/
21
- //#region DEPRECATED
22
- /**
23
- * Whether the badge is dismissible.
24
- * @deprecated use dismissible instead.
25
- */
26
- this.dismissal = false;
27
- //#endregion DEPRECATED
28
- /****************************************************************************/
29
- //#region PROPERTIES
30
- /**
31
- * The color of the badge.
32
- * deprecated Use status values or named colors instead.
33
- * Use a string between 1 to 10
34
- * or one of the status values: error, information, neutral, success, warning
35
- * or one of the color names: amber, orange, turquoise, crimson, lime
36
- */
37
- this.color = '1';
38
- /**
39
- * Main content of the badge.
40
- */
41
- this.label = null;
42
- /**
43
- * The lead icon of the badge.
44
- */
45
- this.leadIcon = null;
46
- /**
47
- * Whether the badge is dismissible.
48
- */
49
- this.dismissible = false;
50
- /**
51
- * Controls the visibility of the badge. Will animate with fade and collapse.
52
- */
53
- this.hidden = false; // eslint-disable-line @stencil-community/reserved-member-names
54
- /**
55
- * When true, the alert does not automatically close upon dismissing.
56
- * Useful for externally controlled component behavior.
57
- */
58
- this.preventAutoClose = false;
59
- /**
60
- * When true, the badge will only display an icon without label.
61
- * The label will be visually hidden but still accessible for screen readers.
62
- */
63
- this.isIconOnly = false;
64
- //#endregion LIFECYCLE
65
- /****************************************************************************/
66
- //#region METHODS
67
- /**
68
- * Handles the close button click.
69
- */
70
- this.handleClose = () => {
71
- if (!this.preventAutoClose) {
72
- this.hidden = true;
73
- }
74
- this.closeClicked.emit();
75
- };
76
- }
77
- //#endregion EVENTS
78
- /****************************************************************************/
79
- //#region WATCHERS
80
- /**
81
- * Handles the dismissal prop change.
82
- * @param {boolean} dismissal - The new dismissal value.
83
- */
84
- handleDismissalChange(dismissal) {
85
- this.dismissible = dismissal;
86
- }
87
- /**
88
- * Handles the icon prop change.
89
- * @param {string} icon - The new icon value.
90
- */
91
- handleIconChange(icon) {
92
- this.leadIcon = icon;
93
- }
94
- /**
95
- * Handles the hidden prop change.
96
- * @param {boolean} hidden - The new hidden value.
97
- */
98
- async handleHiddenChange(hidden) {
99
- this.hiddenChanged.emit(hidden);
100
- if (this._isHidden === true)
101
- this._isHidden = hidden;
102
- const { fadeIn, fadeOut } = fade_animation71e8e34c.useFade(this.ref, { duration: 150 });
103
- const { collapse, expand } = collapse_animation16e3af45.useCollapse(this.ref, { duration: 150 });
104
- if (hidden === true)
105
- await timeline_animationAdf35ecb.timeline(fadeOut, collapse).start();
106
- if (hidden === false)
107
- await timeline_animationAdf35ecb.timeline(expand, fadeIn).start();
108
- this.hiddenChangedComplete.emit(hidden);
109
- if (this._isHidden === false)
110
- this._isHidden = hidden;
111
- }
112
- //#endregion WATCHERS
113
- /****************************************************************************/
114
- //#region LIFECYCLE
115
- /**
116
- * Component will load.
117
- */
118
- componentWillLoad() {
119
- if (this.dismissal) {
120
- this.dismissible = this.dismissal;
121
- }
122
- if (this.icon != null && this.icon != '') {
123
- this.leadIcon = this.icon;
124
- }
125
- if (this.hidden) {
126
- this._isHidden = true;
127
- const { setCollapsed } = collapse_animation16e3af45.useCollapse(this.ref);
128
- const { setFadeOut } = fade_animation71e8e34c.useFade(this.ref);
129
- setCollapsed();
130
- setFadeOut();
131
- }
132
- }
133
- //#endregion METHODS
134
- /****************************************************************************/
135
- //#region RENDER
136
- render() {
137
- return (index.h(index.Host, { key: '435c5bb1f565c8bd95cca5c6828157c80f60aa39', class: clsx297c1ffe.clsx(`badge-${this.color}`, {
138
- 'has-close': this.dismissible,
139
- 'with-gap': this.dismissible || this.label,
140
- 'visually-hidden': this._isHidden,
141
- 'is-icon-only': this.isIconOnly,
142
- }) }, index.h("slot", { key: '271dc833471e026af5088f48227639682e661e97', name: "leading-icon" }, this.leadIcon && index.h("nv-icon", { key: 'e578eabf4c5a09e61e28c3839b943804acdf88e8', name: this.leadIcon, size: "sm" })), index.h("span", { key: '24d16a21b2b4499be712f9b747c9ab63c5e6ca0c', class: clsx297c1ffe.clsx({ 'visually-hidden': this.isIconOnly }) }, this.label, index.h("slot", { key: '3e3827620e6ade8be256ce7dd0b8bb949f36f2d5' })), this.dismissible && (index.h("button", { key: '90ed9ec1b71815554b963b0eafeb5536578700cf', onClick: this.handleClose, class: "close", type: "button" }, index.h("nv-icon", { key: 'df426e5d88c2bf02e7aa83c179c05db4795f03db', name: "x", size: "sm" })))));
143
- }
144
- get ref() { return index.getElement(this); }
145
- static get watchers() { return {
146
- "dismissal": ["handleDismissalChange"],
147
- "icon": ["handleIconChange"],
148
- "hidden": ["handleHiddenChange"]
149
- }; }
150
- };
151
- NvBadge.style = NvBadgeStyle0;
152
-
153
- const nvFielddropdownitemcheckCss = "nv-fielddropdownitemcheck{cursor:pointer;display:flex;padding:var(--list-dropdown-item-padding-y) var(--list-dropdown-item-padding-x);border-radius:var(--list-dropdown-item-radius)}nv-fielddropdownitemcheck slot-fb,nv-fielddropdownitemcheck span{all:unset}nv-fielddropdownitemcheck:hover{background-color:var(--components-list-dropdown-item-background-hover)}";
154
- const NvFielddropdownitemcheckStyle0 = nvFielddropdownitemcheckCss;
155
-
156
- const NvFielddropdownitemcheck = class {
157
- constructor(hostRef) {
158
- index.registerInstance(this, hostRef);
159
- this.itemChecked = index.createEvent(this, "itemChecked");
160
- /****************************************************************************/
161
- //#region PROPERTIES
162
- /**
163
- * Indicates whether the checkbox is selected.
164
- */
165
- this.checked = false;
166
- /**
167
- * Disables the item, preventing any user interaction.
168
- */
169
- this.disabled = false;
170
- //#endregion EVENTS
171
- /****************************************************************************/
172
- //#region METHODS
173
- /**
174
- * when the child <nv-fieldcheckbox> change its `checked` state,
175
- * update `this.checked` and emit `itemChecked`.
176
- * @param {CustomEvent<boolean>} event - The event emitted by the <nv-fieldcheckbox> component.
177
- */
178
- this.onFieldcheckboxChanged = (event) => {
179
- if (this.disabled)
180
- return;
181
- // NvFieldcheckbox has emitted checkedChanged
182
- this.checked = event.detail; // get the new state
183
- this.itemChecked.emit({
184
- value: this.value,
185
- checked: this.checked,
186
- group: this.group,
187
- });
188
- };
189
- /** Make sure the checkbox is checked when clicked anywhere in the item. */
190
- this.handleClick = () => {
191
- if (this.disabled)
192
- return;
193
- if (this.el.querySelector('input').checked) {
194
- this.checked = false;
195
- }
196
- else {
197
- this.checked = true;
198
- }
199
- };
200
- }
201
- //#endregion METHODS
202
- /****************************************************************************/
203
- //#region RENDER
204
- render() {
205
- return (index.h(index.Host, { key: 'cb922f0c0224c950ab5a87783028f2909eb1e39c', onClick: this.handleClick }, index.h("nv-fieldcheckbox", { key: '6f8748022131a8cd31b0f69851313f80c330172a', checked: this.checked, name: this.label || this.value, label: this.label || this.value, labelPlacement: "after", description: this.description, disabled: this.disabled, tabindex: "-1", onCheckedChanged: this.onFieldcheckboxChanged }, index.h("slot", { key: '20d1014accc6cfc00658703057b25037175287af' }), index.h("slot", { key: 'a7e61eed6bc72d3a14096cac2c195629a0ce2928', name: "main" }), index.h("slot", { key: '93f6bce370ac36f1ce3e0f2c1d9cdd598c14cb14', name: "label" }), index.h("slot", { key: '837359fc1fea49e0dea221039dc7466cdc86b757', name: "description" }))));
206
- }
207
- get el() { return index.getElement(this); }
208
- };
209
- NvFielddropdownitemcheck.style = NvFielddropdownitemcheckStyle0;
210
-
211
- exports.nv_badge = NvBadge;
212
- exports.nv_fielddropdownitemcheck = NvFielddropdownitemcheck;