@nova-design-system/nova-base 3.22.0 → 3.23.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (18) hide show
  1. package/assets/nova-fonts.css +10 -1
  2. package/dist/cjs/generated/nova-tailwind-components.js +0 -1
  3. package/dist/css/nova-utils.css +0 -2
  4. package/dist/css/ocean.css +144 -42
  5. package/dist/css/spark.css +144 -42
  6. package/dist/generated/nova-tailwind-components.d.ts +0 -1
  7. package/dist/generated/nova-tailwind-components.js +0 -1
  8. package/dist/js/ocean_dark.d.ts +19 -4
  9. package/dist/js/ocean_dark.js +27 -12
  10. package/dist/js/ocean_light.d.ts +19 -4
  11. package/dist/js/ocean_light.js +19 -4
  12. package/dist/js/spacings.d.ts +105 -33
  13. package/dist/js/spacings.js +105 -33
  14. package/dist/js/spark_dark.d.ts +19 -4
  15. package/dist/js/spark_dark.js +28 -13
  16. package/dist/js/spark_light.d.ts +19 -4
  17. package/dist/js/spark_light.js +19 -4
  18. package/package.json +2 -1
package/dist/css/spark.css CHANGED
@@ -66,7 +66,7 @@
66
66
  --color-transparent: rgba(255, 255, 255, 0);
67
67
  --color-white: #ffffff;
68
68
  --color-black: #000000;
69
- --color-interaction-container-neutral-background: rgba(255, 255, 255, 0);
69
+ --color-interaction-container-neutral-background: rgba(0, 0, 0, 0);
70
70
  --components-toggle-shape-hover: var(--color-gray-spark-300);
71
71
  --components-toggle-shape-default: var(--color-gray-spark-400);
72
72
  --components-toggle-background-disabled-checked: var(--color-gray-spark-600);
@@ -78,6 +78,8 @@
78
78
  --components-toggle-border-default: var(--color-gray-spark-400);
79
79
  --components-tooltip-border: var(--color-gray-spark-50);
80
80
  --components-tooltip-background: var(--color-gray-spark-50);
81
+ --components-splitter-old-border: var(--color-transparent);
82
+ --components-splitter-old-background: var(--color-interaction-container-neutral-background);
81
83
  --components-popover-background: var(--color-gray-spark-900);
82
84
  --components-menu-contextual-item-background: var(--color-interaction-container-neutral-background);
83
85
  --components-field-time-background-default: var(--color-interaction-container-neutral-background);
@@ -342,9 +344,20 @@
342
344
  --components-toggle-border-default-checked: var(--color-interaction-container-branded-high-border);
343
345
  --components-tooltip-supporting-text: var(--color-content-inverted-medium-text);
344
346
  --components-tooltip-text: var(--color-content-inverted-high-text);
347
+ --components-splitter-handle-background-hover: var(--color-interaction-container-branded-high-background-active);
348
+ --components-splitter-handle-background-active: var(--color-interaction-container-branded-high-background-active);
349
+ --components-splitter-handle-background: var(--color-content-low-border);
350
+ --components-splitter-line-background-hover: var(--color-interaction-container-branded-low-background-active);
351
+ --components-splitter-line-background-active: var(--color-interaction-container-branded-high-background-active);
352
+ --components-splitter-line-background: var(--color-level-10-background);
353
+ --components-splitter-old-border-active: var(--color-interaction-container-neutral-border-active);
354
+ --components-splitter-old-background-active: var(--color-interaction-container-neutral-background-active);
345
355
  --components-slider-handler-border-focus: var(--components-form-field-background-checked);
346
356
  --components-slider-handler-background-focus: var(--components-form-field-background-checked);
347
357
  --components-slider-track-background: var(--color-content-low-border);
358
+ --components-sidebar-border: var(--color-content-low-border);
359
+ --components-sidebar-divider: var(--color-content-low-border);
360
+ --components-sidebar-background: var(--color-level-00-background);
348
361
  --components-popover-supporting-text: var(--color-content-low-text);
349
362
  --components-popover-text: var(--color-content-medium-text);
350
363
  --components-popover-border: var(--color-content-low-border);
@@ -371,10 +384,6 @@
371
384
  --components-menu-contextual-border: var(--color-content-low-border);
372
385
  --components-menu-contextual-background: var(--color-level-00-background);
373
386
  --components-calendar-background: var(--color-level-00-background);
374
- --components-calendar-weeks-text-hover: var(--color-content-high-text);
375
- --components-calendar-weeks-text: var(--color-content-high-text);
376
- --components-calendar-weeks-background-hover: var(--color-level-15-background);
377
- --components-calendar-weeks-background: var(--color-level-10-background);
378
387
  --components-calendar-cell-text-today: var(--color-content-high-text);
379
388
  --components-calendar-cell-text-outside-month: var(--color-content-lower-text);
380
389
  --components-calendar-cell-text-in-range: var(--color-interaction-container-branded-low-text-active);
@@ -385,6 +394,10 @@
385
394
  --components-calendar-cell-background-hover: var(--color-interaction-container-branded-low-background-hover);
386
395
  --components-calendar-cell-background-in-range: var(--color-interaction-container-branded-low-background-active);
387
396
  --components-calendar-cell-background-selected: var(--color-interaction-container-branded-high-background-active);
397
+ --components-calendar-weeks-text-hover: var(--color-content-high-text);
398
+ --components-calendar-weeks-text: var(--color-content-high-text);
399
+ --components-calendar-weeks-background-hover: var(--color-level-15-background);
400
+ --components-calendar-weeks-background: var(--color-level-10-background);
388
401
  --components-calendar-header-text: var(--color-content-high-text);
389
402
  --components-calendar-border: var(--color-content-low-border);
390
403
  --components-field-time-border-active: var(--color-interaction-container-neutral-icon-active);
@@ -567,6 +580,8 @@
567
580
  --components-toggle-shape-disabled-checked: var(--color-interaction-container-neutral-icon);
568
581
  --components-toggle-shape-disabled: var(--color-interaction-container-neutral-icon);
569
582
  --components-toggle-background-hover: var(--color-interaction-container-neutral-background-hover);
583
+ --components-splitter-old-border-hover: var(--color-interaction-container-neutral-border-hover);
584
+ --components-splitter-old-background-hover: var(--color-interaction-container-neutral-background-hover);
570
585
  --components-slider-handler-border-readonly: var(--components-form-field-background-readonly);
571
586
  --components-slider-handler-border-disabled: var(--components-form-field-background-disabled);
572
587
  --components-slider-handler-border-error: var(--components-form-field-background-error);
@@ -710,6 +725,8 @@
710
725
  --components-toggle-border-default: var(--color-gray-spark-300);
711
726
  --components-tooltip-border: var(--color-gray-spark-900);
712
727
  --components-tooltip-background: var(--color-gray-spark-900);
728
+ --components-splitter-old-border: var(--color-transparent);
729
+ --components-splitter-old-background: var(--color-interaction-container-neutral-background);
713
730
  --components-popover-background: var(--color-gray-spark-00);
714
731
  --components-menu-contextual-item-background: var(--color-interaction-container-neutral-background);
715
732
  --components-field-time-background-default: var(--color-interaction-container-neutral-background);
@@ -974,9 +991,20 @@
974
991
  --components-toggle-border-default-checked: var(--color-interaction-container-branded-high-border);
975
992
  --components-tooltip-supporting-text: var(--color-content-inverted-medium-text);
976
993
  --components-tooltip-text: var(--color-content-inverted-high-text);
994
+ --components-splitter-handle-background-hover: var(--color-interaction-container-branded-high-background-active);
995
+ --components-splitter-handle-background-active: var(--color-interaction-container-branded-high-background-active);
996
+ --components-splitter-handle-background: var(--color-content-low-border);
997
+ --components-splitter-line-background-hover: var(--color-interaction-container-branded-low-background-hover);
998
+ --components-splitter-line-background-active: var(--color-interaction-container-branded-high-background-active);
999
+ --components-splitter-line-background: var(--color-level-10-background);
1000
+ --components-splitter-old-border-active: var(--color-interaction-container-neutral-border-active);
1001
+ --components-splitter-old-background-active: var(--color-interaction-container-neutral-background-active);
977
1002
  --components-slider-handler-border-focus: var(--components-form-field-background-checked);
978
1003
  --components-slider-handler-background-focus: var(--components-form-field-background-checked);
979
1004
  --components-slider-track-background: var(--color-content-low-border);
1005
+ --components-sidebar-border: var(--color-content-low-border);
1006
+ --components-sidebar-divider: var(--color-content-low-border);
1007
+ --components-sidebar-background: var(--color-level-00-background);
980
1008
  --components-popover-supporting-text: var(--color-content-low-text);
981
1009
  --components-popover-text: var(--color-content-medium-text);
982
1010
  --components-popover-border: var(--color-content-low-border);
@@ -1003,10 +1031,6 @@
1003
1031
  --components-menu-contextual-border: var(--color-content-low-border);
1004
1032
  --components-menu-contextual-background: var(--color-level-00-background);
1005
1033
  --components-calendar-background: var(--color-level-00-background);
1006
- --components-calendar-weeks-text-hover: var(--color-content-high-text);
1007
- --components-calendar-weeks-text: var(--color-content-high-text);
1008
- --components-calendar-weeks-background-hover: var(--color-level-15-background);
1009
- --components-calendar-weeks-background: var(--color-level-10-background);
1010
1034
  --components-calendar-cell-text-today: var(--color-content-high-text);
1011
1035
  --components-calendar-cell-text-outside-month: var(--color-content-lower-text);
1012
1036
  --components-calendar-cell-text-in-range: var(--color-interaction-container-branded-low-text-active);
@@ -1016,6 +1040,10 @@
1016
1040
  --components-calendar-cell-background-hover: var(--color-interaction-container-branded-low-background-hover);
1017
1041
  --components-calendar-cell-background-in-range: var(--color-interaction-container-branded-low-background-active);
1018
1042
  --components-calendar-cell-background-selected: var(--color-interaction-container-branded-high-background-active);
1043
+ --components-calendar-weeks-text-hover: var(--color-content-high-text);
1044
+ --components-calendar-weeks-text: var(--color-content-high-text);
1045
+ --components-calendar-weeks-background-hover: var(--color-level-15-background);
1046
+ --components-calendar-weeks-background: var(--color-level-10-background);
1019
1047
  --components-calendar-header-text: var(--color-content-high-text);
1020
1048
  --components-calendar-border: var(--color-content-low-border);
1021
1049
  --components-field-time-border-active: var(--color-interaction-container-neutral-icon-active);
@@ -1200,6 +1228,8 @@
1200
1228
  --components-toggle-shape-disabled-checked: var(--color-interaction-container-neutral-icon);
1201
1229
  --components-toggle-shape-disabled: var(--color-interaction-container-neutral-icon);
1202
1230
  --components-toggle-background-hover: var(--color-interaction-container-neutral-background-hover);
1231
+ --components-splitter-old-border-hover: var(--color-interaction-container-neutral-border-hover);
1232
+ --components-splitter-old-background-hover: var(--color-interaction-container-neutral-background-hover);
1203
1233
  --components-slider-handler-border-readonly: var(--components-form-field-background-readonly);
1204
1234
  --components-slider-handler-border-disabled: var(--components-form-field-background-disabled);
1205
1235
  --components-slider-handler-border-error: var(--components-form-field-background-error);
@@ -1531,7 +1561,6 @@
1531
1561
  */
1532
1562
 
1533
1563
  :root {
1534
- --slider-tick-radius: 1.0000px;
1535
1564
  --global-typography-legend-font-style: uppercase;
1536
1565
  --global-typography-label-font-style: normal;
1537
1566
  --global-typography-small-font-style: normal;
@@ -1559,10 +1588,18 @@
1559
1588
  --togglegroup-xs-button-radius: 1.0000px;
1560
1589
  --togglegroup-xs-button-padding-y: 1.0000px;
1561
1590
  --togglegroup-xs-padding: 3.0000px;
1591
+ --splitter-old-stroke: 1.0000px;
1592
+ --slider-tick-radius: 1.0000px;
1593
+ --sidebar-reduced-width: 68.0000px;
1594
+ --sidebar-notification-bullet-font-size: 9.0000px;
1595
+ --sidebar-width: 312.0000px;
1562
1596
  --popover-shadow-2-x: 0.0000px;
1563
1597
  --popover-shadow-1-blur: 1.0000px;
1564
1598
  --popover-shadow-1-x: 0.0000px;
1565
1599
  --popover-font-weight: 500;
1600
+ --navigation-primary-notification-bullet-font-size: 9.0000px;
1601
+ --navigation-reduced-max-width: 100.0000px;
1602
+ --navigation-width: 312.0000px;
1566
1603
  --menu-contextual-item-font-weight: 500;
1567
1604
  --menu-contextual-divider-padding-bottom: 3.0000px;
1568
1605
  --form-max-width: 480.0000px;
@@ -1575,6 +1612,18 @@
1575
1612
  --icon-stroke-sm: 1.4000px;
1576
1613
  --icon-stroke-xs: 1.2000px;
1577
1614
  --calendar-cell-dot-size: 3.0000px;
1615
+ --drawer-size-full-width: 1372.0000px;
1616
+ --drawer-size-lg-max-width: 1024.0000px;
1617
+ --drawer-size-lg-width: 992.0000px;
1618
+ --drawer-size-lg-min-width: 960.0000px;
1619
+ --drawer-size-md-max-width: 960.0000px;
1620
+ --drawer-size-md-width: 800.0000px;
1621
+ --drawer-size-md-min-width: 640.0000px;
1622
+ --drawer-size-sm-max-width: 480.0000px;
1623
+ --drawer-size-sm-width: 400.0000px;
1624
+ --drawer-size-sm-min-width: 320.0000px;
1625
+ --drawer-radius-top-right: 0.0000px;
1626
+ --drawer-radius-bottom-right: 0.0000px;
1578
1627
  --button-lg-ring-radius: 9.0000px;
1579
1628
  --button-md-ring-radius: 7.0000px;
1580
1629
  --button-sm-ring-radius: 5.0000px;
@@ -1590,6 +1639,17 @@
1590
1639
  --buttongroup-sm-button-padding-y: 4.0000px;
1591
1640
  --buttongroup-xs-button-radius: 1.0000px;
1592
1641
  --buttongroup-xs-padding: 2.0000px;
1642
+ --avatar-xl-font-size: 28.0000px;
1643
+ --avatar-lg-font-size: 22.0000px;
1644
+ --avatar-md-font-size: 18.0000px;
1645
+ --avatar-sm-font-size: 13.0000px;
1646
+ --avatar-xs-font-size: 10.0000px;
1647
+ --splitter-handle-radius: var(--radius-rounded-md);
1648
+ --splitter-handle-wide-hover: var(--spacing-2);
1649
+ --splitter-handle-wide: var(--spacing-1);
1650
+ --splitter-handle-long: var(--spacing-6);
1651
+ --splitter-gutter: var(--spacing-6);
1652
+ --splitter-line-width: var(--spacing-1);
1593
1653
  --pagination-table-padding-y: var(--spacing-2);
1594
1654
  --pagination-table-padding-x: var(--spacing-3);
1595
1655
  --pagination-table-padding-left: var(--spacing-3);
@@ -1615,14 +1675,6 @@
1615
1675
  --notification-gap-x-title: var(--spacing-2);
1616
1676
  --notification-gap-x: var(--spacing-3);
1617
1677
  --notification-icon-size: var(--spacing-5);
1618
- --navigation-primary-item-bullet-size: var(--spacing-5);
1619
- --navigation-primary-item-bullet-font-size: var(--font-size-xs);
1620
- --navigation-primary-item-radius: var(--radius-rounded-md);
1621
- --navigation-primary-item-icon-size: var(--spacing-5);
1622
- --navigation-primary-item-font-size: var(--font-size-md);
1623
- --navigation-primary-item-padding-y: var(--spacing-2);
1624
- --navigation-primary-item-padding-x: var(--spacing-3);
1625
- --navigation-primary-item-gap-x: var(--spacing-2);
1626
1678
  --loader-size-xl: var(--spacing-8);
1627
1679
  --loader-size-lg: var(--spacing-7);
1628
1680
  --loader-size-md: var(--spacing-6);
@@ -1664,21 +1716,6 @@
1664
1716
  --badge-height: var(--spacing-6);
1665
1717
  --badge-gap-icon-only-x: var(--spacing-0-5);
1666
1718
  --badge-gap-x: var(--spacing-1);
1667
- --avatar-xl-size: var(--spacing-16);
1668
- --avatar-xl-icon-size: var(--spacing-11);
1669
- --avatar-xl-font-size: var(--spacing-8);
1670
- --avatar-lg-size: var(--spacing-12);
1671
- --avatar-lg-icon-size: var(--spacing-8);
1672
- --avatar-lg-font-size: var(--spacing-6);
1673
- --avatar-md-size: var(--spacing-10);
1674
- --avatar-md-icon-size: var(--spacing-7);
1675
- --avatar-md-font-size: var(--spacing-5);
1676
- --avatar-sm-size: var(--spacing-8);
1677
- --avatar-sm-icon-size: var(--spacing-5);
1678
- --avatar-sm-font-size: var(--spacing-4);
1679
- --avatar-xs-size: var(--spacing-6);
1680
- --avatar-xs-icon-size: var(--spacing-4);
1681
- --avatar-xs-font-size: var(--spacing-3);
1682
1719
  --alert-message-line-height: var(--line-height-sm);
1683
1720
  --alert-message-font-weight: var(--font-weight-low-emphasis);
1684
1721
  --alert-message-font-size: var(--font-size-sm);
@@ -1693,15 +1730,6 @@
1693
1730
  --alert-icon-position-x: var(--spacing-4);
1694
1731
  --alert-gap-x: var(--spacing-3);
1695
1732
  --alert-icon-size: var(--spacing-5);
1696
- --slider-track-radius: var(--radius-rounded-sm);
1697
- --slider-track-padding-x: var(--spacing-3);
1698
- --slider-track-height: var(--spacing-1);
1699
- --slider-handler-stroke: var(--spacing-0-5);
1700
- --slider-handler-size-inner: var(--spacing-4);
1701
- --slider-handler-size-max: var(--spacing-6);
1702
- --slider-handler-size-min: var(--spacing-5);
1703
- --slider-tick-width: var(--spacing-0-5);
1704
- --slider-tick-height: var(--spacing-1);
1705
1733
  --global-typography-legend-font-weight: var(--font-weight-medium-emphasis);
1706
1734
  --global-typography-legend-line-height: var(--line-height-xs);
1707
1735
  --global-typography-legend-font-size: var(--font-size-xs);
@@ -1749,6 +1777,47 @@
1749
1777
  --togglegroup-xs-height: var(--spacing-6);
1750
1778
  --togglegroup-xs-gap: var(--spacing-0-5);
1751
1779
  --togglegroup-xs-radius: var(--radius-rounded-sm);
1780
+ --splitter-old-handler-radius: var(--radius-rounded-md);
1781
+ --splitter-old-handler-wide: var(--spacing-3);
1782
+ --splitter-old-handler-long: var(--spacing-6);
1783
+ --slider-track-radius: var(--radius-rounded-sm);
1784
+ --slider-track-padding-x: var(--spacing-3);
1785
+ --slider-track-height: var(--spacing-1);
1786
+ --slider-handler-size-inner: var(--spacing-4);
1787
+ --slider-handler-size-max: var(--spacing-6);
1788
+ --slider-handler-size-min: var(--spacing-5);
1789
+ --slider-handler-stroke: var(--spacing-0-5);
1790
+ --slider-tick-width: var(--spacing-0-5);
1791
+ --slider-tick-height: var(--spacing-1);
1792
+ --sidebar-divider-size: var(--spacing-px);
1793
+ --sidebar-sub-item-padding-left: var(--spacing-7);
1794
+ --sidebar-item-radius: var(--radius-rounded-md);
1795
+ --sidebar-item-padding-y-collapsed: var(--spacing-2-5);
1796
+ --sidebar-item-padding-y: var(--spacing-2);
1797
+ --sidebar-item-padding-x-collapsed: var(--spacing-2-5);
1798
+ --sidebar-item-padding-x: var(--spacing-3);
1799
+ --sidebar-item-icon-size: var(--spacing-5);
1800
+ --sidebar-item-gap-x: var(--spacing-2);
1801
+ --sidebar-item-font-size: var(--font-size-md);
1802
+ --sidebar-title-padding-y: var(--spacing-1);
1803
+ --sidebar-title-padding-x: var(--spacing-3);
1804
+ --sidebar-title-font-size: var(--font-size-sm);
1805
+ --sidebar-collapsible-button-position-right: var(--spacing-4);
1806
+ --sidebar-collapsible-button-position-top: var(--spacing-8);
1807
+ --sidebar-collapsible-button-padding: var(--spacing-2);
1808
+ --sidebar-collapsible-button-icon-size: var(--spacing-4);
1809
+ --sidebar-section-gap-y-collapsed: var(--spacing-1);
1810
+ --sidebar-section-gap-y: var(--spacing-0-5);
1811
+ --sidebar-group-gap-y: var(--spacing-1);
1812
+ --sidebar-footer-gap-y: var(--spacing-5);
1813
+ --sidebar-width-collapsed: var(--spacing-20);
1814
+ --sidebar-padding-y: var(--spacing-6);
1815
+ --sidebar-padding-x-collapsed: var(--spacing-5);
1816
+ --sidebar-padding-x: var(--spacing-6);
1817
+ --sidebar-gap-y: var(--spacing-3);
1818
+ --sidebar-notification-bullet-size-reduced: var(--spacing-1-5);
1819
+ --sidebar-notification-bullet-size: var(--spacing-4);
1820
+ --sidebar-notification-bullet-font-weight: var(--font-weight-medium-emphasis);
1752
1821
  --popover-radius: var(--radius-rounded-md);
1753
1822
  --popover-padding-y: var(--spacing-2);
1754
1823
  --popover-padding-x: var(--spacing-2);
@@ -1761,6 +1830,21 @@
1761
1830
  --popover-shadow-1-opacity: var(--shadow-color-opacity-3);
1762
1831
  --popover-shadow-1-spread: var(--shadow-spread-lg-1);
1763
1832
  --popover-shadow-1-y: var(--shadow-y-axis-none);
1833
+ --navigation-gap-y: var(--spacing-3);
1834
+ --navigation-primary-separator-size: var(--spacing-px);
1835
+ --navigation-primary-sub-item-padding-left-x: var(--spacing-7);
1836
+ --navigation-primary-item-radius: var(--radius-rounded-md);
1837
+ --navigation-primary-item-icon-size: var(--spacing-5);
1838
+ --navigation-primary-item-font-size: var(--font-size-md);
1839
+ --navigation-primary-item-padding-y: var(--spacing-2);
1840
+ --navigation-primary-item-padding-x: var(--spacing-3);
1841
+ --navigation-primary-item-gap-x: var(--spacing-2);
1842
+ --navigation-primary-title-font-size: var(--font-size-sm);
1843
+ --navigation-primary-title-padding-y: var(--spacing-1);
1844
+ --navigation-primary-title-padding-x: var(--spacing-3);
1845
+ --navigation-primary-notification-bullet-font-weight: var(--font-weight-medium-emphasis);
1846
+ --navigation-primary-notification-bullet-size-reduced: var(--spacing-1-5);
1847
+ --navigation-primary-notification-bullet-size: var(--spacing-4);
1764
1848
  --menu-contextual-radius: var(--radius-rounded-md);
1765
1849
  --menu-contextual-padding-y: var(--spacing-1);
1766
1850
  --menu-contextual-padding-x: var(--spacing-1);
@@ -1876,6 +1960,14 @@
1876
1960
  --calendar-cell-line-height: var(--line-height-sm);
1877
1961
  --calendar-cell-font-weight: var(--font-weight-low-emphasis);
1878
1962
  --calendar-cell-font-size: var(--font-size-sm);
1963
+ --drawer-padding-y: var(--spacing-6);
1964
+ --drawer-padding-x: var(--spacing-6);
1965
+ --drawer-header-padding-right: var(--spacing-8);
1966
+ --drawer-gap-y: var(--spacing-6);
1967
+ --drawer-dismissible-position-right: var(--spacing-6);
1968
+ --drawer-dismissible-position-top: var(--spacing-6);
1969
+ --drawer-radius-top-left: var(--radius-rounded-2xl);
1970
+ --drawer-radius-bottom-left: var(--radius-rounded-2xl);
1879
1971
  --button-lg-padding-y: var(--spacing-2-5);
1880
1972
  --button-lg-padding-x: var(--spacing-4);
1881
1973
  --button-lg-line-height: var(--line-height-lg);
@@ -1925,5 +2017,15 @@
1925
2017
  --buttongroup-xs-gap: var(--spacing-px);
1926
2018
  --buttongroup-xs-radius: var(--radius-rounded-sm);
1927
2019
  --buttongroup-xs-button-padding-y: var(--spacing-0-5);
2020
+ --avatar-xl-size: var(--spacing-16);
2021
+ --avatar-xl-icon-size: var(--spacing-11);
2022
+ --avatar-lg-size: var(--spacing-12);
2023
+ --avatar-lg-icon-size: var(--spacing-8);
2024
+ --avatar-md-size: var(--spacing-10);
2025
+ --avatar-md-icon-size: var(--spacing-7);
2026
+ --avatar-sm-size: var(--spacing-8);
2027
+ --avatar-sm-icon-size: var(--spacing-5);
2028
+ --avatar-xs-size: var(--spacing-6);
2029
+ --avatar-xs-icon-size: var(--spacing-4);
1928
2030
  }
1929
2031
 
package/dist/generated/nova-tailwind-components.d.ts CHANGED
@@ -127,7 +127,6 @@ export declare const NOVA_TAILWIND_COMPONENTS: {
127
127
  boxShadow: string;
128
128
  };
129
129
  '.nv-fieldtext > .input-wrapper .input-container:has(input:read-only)': {
130
- opacity: string;
131
130
  backgroundColor: string;
132
131
  borderColor: string;
133
132
  };
package/dist/generated/nova-tailwind-components.js CHANGED
@@ -128,7 +128,6 @@ export const NOVA_TAILWIND_COMPONENTS = {
128
128
  'boxShadow': '0px 0px 0px var(--focus-field-stroke) var(--nv-field-focus-box-shadow)'
129
129
  },
130
130
  '.nv-fieldtext > .input-wrapper .input-container:has(input:read-only)': {
131
- 'opacity': '0.5',
132
131
  'backgroundColor': 'var(--components-form-field-background-readonly)',
133
132
  'borderColor': 'var(--nv-field-border-readonly)'
134
133
  },
package/dist/js/ocean_dark.d.ts CHANGED
@@ -512,6 +512,10 @@ export const ComponentsFieldTimeTextActive : string;
512
512
  export const ComponentsFieldTimeBorderActive : string;
513
513
  export const ComponentsCalendarBorder : string;
514
514
  export const ComponentsCalendarHeaderText : string;
515
+ export const ComponentsCalendarWeeksBackground : string;
516
+ export const ComponentsCalendarWeeksBackgroundHover : string;
517
+ export const ComponentsCalendarWeeksText : string;
518
+ export const ComponentsCalendarWeeksTextHover : string;
515
519
  export const ComponentsCalendarCellBackground : string;
516
520
  export const ComponentsCalendarCellBackgroundSelected : string;
517
521
  export const ComponentsCalendarCellBackgroundInRange : string;
@@ -526,10 +530,6 @@ export const ComponentsCalendarCellTextInRange : string;
526
530
  export const ComponentsCalendarCellTextHover : string;
527
531
  export const ComponentsCalendarCellTextOutsideMonth : string;
528
532
  export const ComponentsCalendarCellTextToday : string;
529
- export const ComponentsCalendarWeeksBackground : string;
530
- export const ComponentsCalendarWeeksBackgroundHover : string;
531
- export const ComponentsCalendarWeeksText : string;
532
- export const ComponentsCalendarWeeksTextHover : string;
533
533
  export const ComponentsCalendarBackground : string;
534
534
  export const ComponentsMenuContextualBackground : string;
535
535
  export const ComponentsMenuContextualBorder : string;
@@ -561,6 +561,9 @@ export const ComponentsPopoverBackground : string;
561
561
  export const ComponentsPopoverBorder : string;
562
562
  export const ComponentsPopoverText : string;
563
563
  export const ComponentsPopoverSupportingText : string;
564
+ export const ComponentsSidebarBackground : string;
565
+ export const ComponentsSidebarDivider : string;
566
+ export const ComponentsSidebarBorder : string;
564
567
  export const ComponentsSliderTrackBackground : string;
565
568
  export const ComponentsSliderTrackFilledDefault : string;
566
569
  export const ComponentsSliderTrackFilledHover : string;
@@ -580,6 +583,18 @@ export const ComponentsSliderHandlerBorderFocus : string;
580
583
  export const ComponentsSliderHandlerBorderError : string;
581
584
  export const ComponentsSliderHandlerBorderDisabled : string;
582
585
  export const ComponentsSliderHandlerBorderReadonly : string;
586
+ export const ComponentsSplitterOldBackground : string;
587
+ export const ComponentsSplitterOldBackgroundHover : string;
588
+ export const ComponentsSplitterOldBackgroundActive : string;
589
+ export const ComponentsSplitterOldBorder : string;
590
+ export const ComponentsSplitterOldBorderHover : string;
591
+ export const ComponentsSplitterOldBorderActive : string;
592
+ export const ComponentsSplitterLineBackground : string;
593
+ export const ComponentsSplitterLineBackgroundActive : string;
594
+ export const ComponentsSplitterLineBackgroundHover : string;
595
+ export const ComponentsSplitterHandleBackground : string;
596
+ export const ComponentsSplitterHandleBackgroundActive : string;
597
+ export const ComponentsSplitterHandleBackgroundHover : string;
583
598
  export const ComponentsTooltipBackground : string;
584
599
  export const ComponentsTooltipBorder : string;
585
600
  export const ComponentsTooltipText : string;
package/dist/js/ocean_dark.js CHANGED
@@ -2,7 +2,7 @@
2
2
  * Do not edit directly, this file was auto-generated.
3
3
  */
4
4
 
5
- export const ColorInteractionContainerNeutralBackground = "#ffffff";
5
+ export const ColorInteractionContainerNeutralBackground = "#000000";
6
6
  export const ColorInteractionContainerNeutralBackgroundHover = "#171f22";
7
7
  export const ColorInteractionContainerNeutralBackgroundActive = "#0b292e";
8
8
  export const ColorInteractionContainerNeutralBorder = "#889499";
@@ -297,7 +297,7 @@ export const ComponentsButtonLowTextHover = "#4b9eaa";
297
297
  export const ComponentsButtonLowerBorder = "#ffffff";
298
298
  export const ComponentsButtonLowerBorderActive = "#ffffff";
299
299
  export const ComponentsButtonLowerBorderHover = "#ffffff";
300
- export const ComponentsButtonLowerBackground = "#ffffff";
300
+ export const ComponentsButtonLowerBackground = "#000000";
301
301
  export const ComponentsButtonLowerBackgroundActive = "#0b292e";
302
302
  export const ComponentsButtonLowerBackgroundHover = "#171f22";
303
303
  export const ComponentsButtonLowerIcon = "#889499";
@@ -389,9 +389,9 @@ export const ComponentsListDropdownItemLabelActive = "#889499";
389
389
  export const ComponentsListDropdownItemDescriptionDefault = "#889499";
390
390
  export const ComponentsListDropdownItemDescriptionHover = "#bac1c4";
391
391
  export const ComponentsListDropdownItemDescriptionDisabled = "#617177";
392
- export const ComponentsListDropdownItemBackgroundDefault = "#ffffff";
392
+ export const ComponentsListDropdownItemBackgroundDefault = "#000000";
393
393
  export const ComponentsListDropdownItemBackgroundHover = "#171f22";
394
- export const ComponentsListDropdownItemBackgroundDisabled = "#ffffff";
394
+ export const ComponentsListDropdownItemBackgroundDisabled = "#000000";
395
395
  export const ComponentsListDropdownItemBackgroundActive = "#0b292e";
396
396
  export const ComponentsListDropdownGroupTitleContent = "#bac1c4";
397
397
  export const ComponentsListDropdownGroupTitleBackground = "#ffffff";
@@ -493,17 +493,17 @@ export const ComponentsButtongroupLowerBorder = "#889499";
493
493
  export const ComponentsButtongroupLowerBackground = "#0b0f11";
494
494
  export const ComponentsDatagridHeaderBorder = "#617177";
495
495
  export const ComponentsDatagridHeaderText = "#f5f6f7";
496
- export const ComponentsDatagridHeaderBackground = "#ffffff";
496
+ export const ComponentsDatagridHeaderBackground = "#000000";
497
497
  export const ComponentsDatagridBodyBorder = "#394d55";
498
498
  export const ComponentsDatagridBodyText = "#bac1c4";
499
499
  export const ComponentsDatagridBodySubtext = "#889499";
500
- export const ComponentsDatagridBodyBackgroundDefault = "#ffffff";
500
+ export const ComponentsDatagridBodyBackgroundDefault = "#000000";
501
501
  export const ComponentsDatagridBodyBackgroundActive = "#0b292e";
502
502
  export const ComponentsDatagridBodyBackgroundHover = "#171f22";
503
503
  export const ComponentsDatagridExpanderContentBackground = "#0b0f11";
504
504
  export const ComponentsDatagridExpanderBorder = "#394d55";
505
505
  export const ComponentsDatagridExpanderExpanderBackground = "#171f22";
506
- export const ComponentsFieldTimeBackgroundDefault = "#ffffff";
506
+ export const ComponentsFieldTimeBackgroundDefault = "#000000";
507
507
  export const ComponentsFieldTimeBackgroundHover = "#171f22";
508
508
  export const ComponentsFieldTimeBackgroundActive = "#0b292e";
509
509
  export const ComponentsFieldTimeTextDefault = "#889499";
@@ -512,6 +512,10 @@ export const ComponentsFieldTimeTextActive = "#4b9eaa";
512
512
  export const ComponentsFieldTimeBorderActive = "#4b9eaa";
513
513
  export const ComponentsCalendarBorder = "#394d55";
514
514
  export const ComponentsCalendarHeaderText = "#f5f6f7";
515
+ export const ComponentsCalendarWeeksBackground = "#171f22";
516
+ export const ComponentsCalendarWeeksBackgroundHover = "#171f22";
517
+ export const ComponentsCalendarWeeksText = "#f5f6f7";
518
+ export const ComponentsCalendarWeeksTextHover = "#f5f6f7";
515
519
  export const ComponentsCalendarCellBackground = "#0b0f11";
516
520
  export const ComponentsCalendarCellBackgroundSelected = "#4b9eaa";
517
521
  export const ComponentsCalendarCellBackgroundInRange = "#0b292e";
@@ -526,14 +530,10 @@ export const ComponentsCalendarCellTextInRange = "#4b9eaa";
526
530
  export const ComponentsCalendarCellTextHover = "#bac1c4";
527
531
  export const ComponentsCalendarCellTextOutsideMonth = "#617177";
528
532
  export const ComponentsCalendarCellTextToday = "#f5f6f7";
529
- export const ComponentsCalendarWeeksBackground = "#171f22";
530
- export const ComponentsCalendarWeeksBackgroundHover = "#171f22";
531
- export const ComponentsCalendarWeeksText = "#f5f6f7";
532
- export const ComponentsCalendarWeeksTextHover = "#f5f6f7";
533
533
  export const ComponentsCalendarBackground = "#0b0f11";
534
534
  export const ComponentsMenuContextualBackground = "#0b0f11";
535
535
  export const ComponentsMenuContextualBorder = "#394d55";
536
- export const ComponentsMenuContextualItemBackground = "#ffffff";
536
+ export const ComponentsMenuContextualItemBackground = "#000000";
537
537
  export const ComponentsMenuContextualItemBackgroundHover = "#171f22";
538
538
  export const ComponentsMenuContextualItemShortcut = "#617177";
539
539
  export const ComponentsMenuContextualItemContent = "#889499";
@@ -561,6 +561,9 @@ export const ComponentsPopoverBackground = "#0b0f11";
561
561
  export const ComponentsPopoverBorder = "#394d55";
562
562
  export const ComponentsPopoverText = "#27353b";
563
563
  export const ComponentsPopoverSupportingText = "#889499";
564
+ export const ComponentsSidebarBackground = "#0b0f11";
565
+ export const ComponentsSidebarDivider = "#394d55";
566
+ export const ComponentsSidebarBorder = "#394d55";
564
567
  export const ComponentsSliderTrackBackground = "#394d55";
565
568
  export const ComponentsSliderTrackFilledDefault = "#617177";
566
569
  export const ComponentsSliderTrackFilledHover = "#889499";
@@ -580,6 +583,18 @@ export const ComponentsSliderHandlerBorderFocus = "#258998";
580
583
  export const ComponentsSliderHandlerBorderError = "#ff6161";
581
584
  export const ComponentsSliderHandlerBorderDisabled = "#171f22";
582
585
  export const ComponentsSliderHandlerBorderReadonly = "#11171a";
586
+ export const ComponentsSplitterOldBackground = "#000000";
587
+ export const ComponentsSplitterOldBackgroundHover = "#171f22";
588
+ export const ComponentsSplitterOldBackgroundActive = "#0b292e";
589
+ export const ComponentsSplitterOldBorder = "#ffffff";
590
+ export const ComponentsSplitterOldBorderHover = "#bac1c4";
591
+ export const ComponentsSplitterOldBorderActive = "#4b9eaa";
592
+ export const ComponentsSplitterLineBackground = "#171f22";
593
+ export const ComponentsSplitterLineBackgroundActive = "#4b9eaa";
594
+ export const ComponentsSplitterLineBackgroundHover = "#0b292e";
595
+ export const ComponentsSplitterHandleBackground = "#394d55";
596
+ export const ComponentsSplitterHandleBackgroundActive = "#4b9eaa";
597
+ export const ComponentsSplitterHandleBackgroundHover = "#4b9eaa";
583
598
  export const ComponentsTooltipBackground = "#f5f6f7";
584
599
  export const ComponentsTooltipBorder = "#f5f6f7";
585
600
  export const ComponentsTooltipText = "#0b0f11";
package/dist/js/ocean_light.d.ts CHANGED
@@ -512,6 +512,10 @@ export const ComponentsFieldTimeTextActive : string;
512
512
  export const ComponentsFieldTimeBorderActive : string;
513
513
  export const ComponentsCalendarBorder : string;
514
514
  export const ComponentsCalendarHeaderText : string;
515
+ export const ComponentsCalendarWeeksBackground : string;
516
+ export const ComponentsCalendarWeeksBackgroundHover : string;
517
+ export const ComponentsCalendarWeeksText : string;
518
+ export const ComponentsCalendarWeeksTextHover : string;
515
519
  export const ComponentsCalendarCellBackground : string;
516
520
  export const ComponentsCalendarCellBackgroundSelected : string;
517
521
  export const ComponentsCalendarCellBackgroundInRange : string;
@@ -526,10 +530,6 @@ export const ComponentsCalendarCellTextInRange : string;
526
530
  export const ComponentsCalendarCellTextHover : string;
527
531
  export const ComponentsCalendarCellTextOutsideMonth : string;
528
532
  export const ComponentsCalendarCellTextToday : string;
529
- export const ComponentsCalendarWeeksBackground : string;
530
- export const ComponentsCalendarWeeksBackgroundHover : string;
531
- export const ComponentsCalendarWeeksText : string;
532
- export const ComponentsCalendarWeeksTextHover : string;
533
533
  export const ComponentsCalendarBackground : string;
534
534
  export const ComponentsMenuContextualBackground : string;
535
535
  export const ComponentsMenuContextualBorder : string;
@@ -561,6 +561,9 @@ export const ComponentsPopoverBackground : string;
561
561
  export const ComponentsPopoverBorder : string;
562
562
  export const ComponentsPopoverText : string;
563
563
  export const ComponentsPopoverSupportingText : string;
564
+ export const ComponentsSidebarBackground : string;
565
+ export const ComponentsSidebarDivider : string;
566
+ export const ComponentsSidebarBorder : string;
564
567
  export const ComponentsSliderTrackBackground : string;
565
568
  export const ComponentsSliderTrackFilledDefault : string;
566
569
  export const ComponentsSliderTrackFilledHover : string;
@@ -580,6 +583,18 @@ export const ComponentsSliderHandlerBorderFocus : string;
580
583
  export const ComponentsSliderHandlerBorderError : string;
581
584
  export const ComponentsSliderHandlerBorderDisabled : string;
582
585
  export const ComponentsSliderHandlerBorderReadonly : string;
586
+ export const ComponentsSplitterOldBackground : string;
587
+ export const ComponentsSplitterOldBackgroundHover : string;
588
+ export const ComponentsSplitterOldBackgroundActive : string;
589
+ export const ComponentsSplitterOldBorder : string;
590
+ export const ComponentsSplitterOldBorderHover : string;
591
+ export const ComponentsSplitterOldBorderActive : string;
592
+ export const ComponentsSplitterLineBackground : string;
593
+ export const ComponentsSplitterLineBackgroundActive : string;
594
+ export const ComponentsSplitterLineBackgroundHover : string;
595
+ export const ComponentsSplitterHandleBackground : string;
596
+ export const ComponentsSplitterHandleBackgroundActive : string;
597
+ export const ComponentsSplitterHandleBackgroundHover : string;
583
598
  export const ComponentsTooltipBackground : string;
584
599
  export const ComponentsTooltipBorder : string;
585
600
  export const ComponentsTooltipText : string;
package/dist/js/ocean_light.js CHANGED
@@ -512,6 +512,10 @@ export const ComponentsFieldTimeTextActive = "#185963";
512
512
  export const ComponentsFieldTimeBorderActive = "#185963";
513
513
  export const ComponentsCalendarBorder = "#e1e4e6";
514
514
  export const ComponentsCalendarHeaderText = "#171f22";
515
+ export const ComponentsCalendarWeeksBackground = "#f5f6f7";
516
+ export const ComponentsCalendarWeeksBackgroundHover = "#eaeef0";
517
+ export const ComponentsCalendarWeeksText = "#171f22";
518
+ export const ComponentsCalendarWeeksTextHover = "#171f22";
515
519
  export const ComponentsCalendarCellBackground = "#ffffff";
516
520
  export const ComponentsCalendarCellBackgroundSelected = "#185963";
517
521
  export const ComponentsCalendarCellBackgroundInRange = "#e4f0f2";
@@ -526,10 +530,6 @@ export const ComponentsCalendarCellTextInRange = "#185963";
526
530
  export const ComponentsCalendarCellTextHover = "#34464d";
527
531
  export const ComponentsCalendarCellTextOutsideMonth = "#9fadb2";
528
532
  export const ComponentsCalendarCellTextToday = "#171f22";
529
- export const ComponentsCalendarWeeksBackground = "#f5f6f7";
530
- export const ComponentsCalendarWeeksBackgroundHover = "#eaeef0";
531
- export const ComponentsCalendarWeeksText = "#171f22";
532
- export const ComponentsCalendarWeeksTextHover = "#171f22";
533
533
  export const ComponentsCalendarBackground = "#ffffff";
534
534
  export const ComponentsMenuContextualBackground = "#ffffff";
535
535
  export const ComponentsMenuContextualBorder = "#e1e4e6";
@@ -561,6 +561,9 @@ export const ComponentsPopoverBackground = "#ffffff";
561
561
  export const ComponentsPopoverBorder = "#e1e4e6";
562
562
  export const ComponentsPopoverText = "#34464d";
563
563
  export const ComponentsPopoverSupportingText = "#617177";
564
+ export const ComponentsSidebarBackground = "#ffffff";
565
+ export const ComponentsSidebarDivider = "#e1e4e6";
566
+ export const ComponentsSidebarBorder = "#e1e4e6";
564
567
  export const ComponentsSliderTrackBackground = "#e1e4e6";
565
568
  export const ComponentsSliderTrackFilledDefault = "#bac1c4";
566
569
  export const ComponentsSliderTrackFilledHover = "#889499";
@@ -580,6 +583,18 @@ export const ComponentsSliderHandlerBorderFocus = "#1f717d";
580
583
  export const ComponentsSliderHandlerBorderError = "#bb1919";
581
584
  export const ComponentsSliderHandlerBorderDisabled = "#f5f6f7";
582
585
  export const ComponentsSliderHandlerBorderReadonly = "#fafbfb";
586
+ export const ComponentsSplitterOldBackground = "#ffffff";
587
+ export const ComponentsSplitterOldBackgroundHover = "#f5f6f7";
588
+ export const ComponentsSplitterOldBackgroundActive = "#e4f0f2";
589
+ export const ComponentsSplitterOldBorder = "#ffffff";
590
+ export const ComponentsSplitterOldBorderHover = "#34464d";
591
+ export const ComponentsSplitterOldBorderActive = "#185963";
592
+ export const ComponentsSplitterLineBackground = "#f5f6f7";
593
+ export const ComponentsSplitterLineBackgroundActive = "#185963";
594
+ export const ComponentsSplitterLineBackgroundHover = "#e4f0f2";
595
+ export const ComponentsSplitterHandleBackground = "#e1e4e6";
596
+ export const ComponentsSplitterHandleBackgroundActive = "#185963";
597
+ export const ComponentsSplitterHandleBackgroundHover = "#185963";
583
598
  export const ComponentsTooltipBackground = "#0b0f11";
584
599
  export const ComponentsTooltipBorder = "#0b0f11";
585
600
  export const ComponentsTooltipText = "#f5f6f7";