@deephaven/components 0.60.1-object-fetcher.7 → 0.61.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 (77) hide show
  1. package/css/BaseStyleSheet.css +62 -62
  2. package/css/BaseStyleSheet.css.map +1 -1
  3. package/dist/AutoCompleteInput.css.map +1 -1
  4. package/dist/AutoResizeTextarea.css.map +1 -1
  5. package/dist/CardFlip.css.map +1 -1
  6. package/dist/ComboBox.css.map +1 -1
  7. package/dist/CustomTimeSelect.css.map +1 -1
  8. package/dist/DraggableItemList.css +1 -1
  9. package/dist/DraggableItemList.css.map +1 -1
  10. package/dist/HierarchicalCheckboxMenu.css.map +1 -1
  11. package/dist/ItemList.css.map +1 -1
  12. package/dist/ItemListItem.css.map +1 -1
  13. package/dist/LoadingOverlay.css +1 -1
  14. package/dist/LoadingOverlay.css.map +1 -1
  15. package/dist/MaskedInput.css.map +1 -1
  16. package/dist/RandomAreaPlotAnimation.css.map +1 -1
  17. package/dist/SearchInput.css +2 -2
  18. package/dist/SearchInput.css.map +1 -1
  19. package/dist/SelectValueList.css +1 -1
  20. package/dist/SelectValueList.css.map +1 -1
  21. package/dist/SocketedButton.css +3 -3
  22. package/dist/SocketedButton.css.map +1 -1
  23. package/dist/ThemeExport.module.css.map +1 -1
  24. package/dist/TimeSlider.css +1 -1
  25. package/dist/TimeSlider.css.map +1 -1
  26. package/dist/TimeSlider.module.css +1 -1
  27. package/dist/TimeSlider.module.css.map +1 -1
  28. package/dist/ToastNotification.css.map +1 -1
  29. package/dist/UISwitch.css +1 -1
  30. package/dist/UISwitch.css.map +1 -1
  31. package/dist/ValidateLabelInput.css.map +1 -1
  32. package/dist/context-actions/ContextActions.css.map +1 -1
  33. package/dist/menu-actions/DropdownMenu.css.map +1 -1
  34. package/dist/modal/DebouncedModal.js +3 -1
  35. package/dist/modal/DebouncedModal.js.map +1 -1
  36. package/dist/modal/InfoModal.css.map +1 -1
  37. package/dist/navigation/Menu.css.map +1 -1
  38. package/dist/navigation/MenuItem.css +1 -1
  39. package/dist/navigation/MenuItem.css.map +1 -1
  40. package/dist/navigation/NavTabList.css +1 -1
  41. package/dist/navigation/NavTabList.css.map +1 -1
  42. package/dist/navigation/Page.css.map +1 -1
  43. package/dist/navigation/Stack.css +1 -1
  44. package/dist/navigation/Stack.css.map +1 -1
  45. package/dist/popper/Popper.css.map +1 -1
  46. package/dist/theme/ThemeUtils.d.ts.map +1 -1
  47. package/dist/theme/ThemeUtils.js +45 -23
  48. package/dist/theme/ThemeUtils.js.map +1 -1
  49. package/dist/theme/theme-dark/theme-dark-components.css +1 -1
  50. package/dist/theme/theme-dark/theme-dark-components.css.map +1 -1
  51. package/dist/theme/theme-dark/theme-dark-palette.css +1 -1
  52. package/dist/theme/theme-dark/theme-dark-palette.css.map +1 -1
  53. package/dist/theme/theme-dark/theme-dark-semantic-chart.css +1 -1
  54. package/dist/theme/theme-dark/theme-dark-semantic-chart.css.map +1 -1
  55. package/dist/theme/theme-dark/theme-dark-semantic-grid.css +1 -1
  56. package/dist/theme/theme-dark/theme-dark-semantic-grid.css.map +1 -1
  57. package/dist/theme/theme-dark/theme-dark-semantic.css +1 -1
  58. package/dist/theme/theme-dark/theme-dark-semantic.css.map +1 -1
  59. package/dist/theme/theme-light/theme-light-components.css +1 -1
  60. package/dist/theme/theme-light/theme-light-components.css.map +1 -1
  61. package/dist/theme/theme-light/theme-light-palette.css +1 -1
  62. package/dist/theme/theme-light/theme-light-palette.css.map +1 -1
  63. package/dist/theme/theme-light/theme-light-semantic-chart.css +1 -1
  64. package/dist/theme/theme-light/theme-light-semantic-chart.css.map +1 -1
  65. package/dist/theme/theme-light/theme-light-semantic-grid.css +1 -1
  66. package/dist/theme/theme-light/theme-light-semantic-grid.css.map +1 -1
  67. package/dist/theme/theme-light/theme-light-semantic.css +1 -1
  68. package/dist/theme/theme-light/theme-light-semantic.css.map +1 -1
  69. package/dist/theme/theme-spectrum/theme-spectrum-alias.module.css +1 -1
  70. package/dist/theme/theme-spectrum/theme-spectrum-alias.module.css.map +1 -1
  71. package/package.json +7 -7
  72. package/scss/BaseStyleSheet.scss +11 -10
  73. package/scss/bootstrap_override_mixins_buttons.scss +10 -2
  74. package/scss/bootstrap_overrides.scss +5 -1
  75. package/scss/custom.scss +1 -0
  76. package/scss/new_variables.scss +4 -20
  77. package/scss/util.scss +29 -0
@@ -1 +1 @@
1
- .dh-spectrum-alias{--spectrum-alias-background-color-default: var(--dh-color-bg);--spectrum-alias-background-color-disabled: var(--dh-color-disabled-bg);--spectrum-alias-label-text-color: var(--dh-color-label-text);--spectrum-alias-text-color: var(--dh-color-text);--spectrum-alias-text-color-hover: var(--dh-color-text-hover);--spectrum-alias-text-color-disabled: var(--dh-color-text-disabled);--spectrum-alias-border-color: var(--dh-color-border);--spectrum-alias-border-color-focus: var(--dh-color-border-focus);--spectrum-alias-input-border-color-key-focus: var( --spectrum-alias-border-color-focus );--spectrum-alias-focus-color: var(--dh-color-focus);--spectrum-alias-focus-ring-color: var(--dh-color-focus-ring);--spectrum-alias-icon-color: var(--dh-color-icon-fg);--spectrum-alias-icon-color-disabled: var(--dh-color-icon-disabled-fg);--spectrum-actionbutton-background-color-disabled: var( --dh-color-action-disabled-bg );--spectrum-actionbutton-border-color-disabled: var( --dh-color-action-disabled-border );--spectrum-actionbutton-text-color-disabled: var( --dh-color-action-disabled-fg );--spectrum-body-text-color: var(--dh-color-text);--spectrum-alias-dropshadow-color: var(--dh-color-dropshadow);--spectrum-alias-background-color-modal-overlay: var( --dh-color-modal-overlay-bg );--spectrum-alias-background-color-hover-overlay: var( --dh-color-overlay-hover-bg );--spectrum-colorarea-border-color: var(--dh-color-colorpicker-border);--spectrum-colorarea-border-color-hover: var(--dh-color-colorpicker-border);--spectrum-colorarea-border-color-down: var(--dh-color-colorpicker-border);--spectrum-colorarea-border-color-key-focus: var( --dh-color-colorpicker-border );--spectrum-colorslider-border-color: var(--dh-color-colorpicker-border);--spectrum-colorslider-border-color-hover: var(--dh-color-colorpicker-border);--spectrum-colorslider-border-color-down: var(--dh-color-colorpicker-border);--spectrum-colorslider-border-color-key-focus: var( --dh-color-colorpicker-border );--spectrum-colorslider-vertical-border-color: var( --dh-color-colorpicker-border );--spectrum-colorslider-vertical-border-color-hover: var( --dh-color-colorpicker-border );--spectrum-colorslider-vertical-border-color-down: var( --dh-color-colorpicker-border );--spectrum-colorslider-vertical-border-color-key-focus: var( --dh-color-colorpicker-border );--spectrum-colorwheel-border-color: var(--dh-color-colorpicker-border);--spectrum-colorwheel-border-color-hover: var(--dh-color-colorpicker-border);--spectrum-colorwheel-border-color-down: var(--dh-color-colorpicker-border);--spectrum-colorwheel-border-color-key-focus: var( --dh-color-colorpicker-border );--spectrum-alias-highlight-active: var(--dh-color-highlight-active);--spectrum-alias-highlight-hover: var(--dh-color-highlight-hover);--spectrum-alias-highlight-invalid: var(--dh-color-highlight-invalid);--spectrum-alias-highlight-selected: var(--dh-color-highlight-selected);--spectrum-alias-highlight-selected-hover: var( --dh-color-highlight-selected-hover );--spectrum-alias-text-highlight-color: var(--dh-color-text-highlight);--spectrum-alias-background-color-quickactions: var( --dh-color-quickactions-bg );--spectrum-alias-radial-reaction-color-default: var( --dh-color-radial-reaction );--spectrum-alias-appframe-border-color: var(--spectrum-global-color-gray-50);--spectrum-alias-appframe-separator-color: var( --spectrum-global-color-gray-50 );--spectrum-alias-pasteboard-background-color: var( --spectrum-global-color-gray-50 );--spectrum-tabs-compact-selection-indicator-color: var( --spectrum-global-color-blue-500 );--spectrum-tabs-compact-vertical-rule-color: var( --spectrum-global-color-gray-200 );--spectrum-tabs-compact-vertical-emphasized-selection-indicator-color: var( --spectrum-global-color-blue-500 );--spectrum-tabs-compact-vertical-emphasized-rule-color: var( --spectrum-global-color-gray-200 );--spectrum-tabs-emphasized-selection-indicator-color: var( --spectrum-global-color-blue-500 );--spectrum-tabs-quiet-compact-emphasized-selection-indicator-color: var( --spectrum-global-color-blue-500 );--spectrum-tabs-quiet-compact-vertical-emphasized-selection-indicator-color: var( --spectrum-global-color-blue-500 );--spectrum-tabs-quiet-emphasized-selection-indicator-color: var( --spectrum-global-color-blue-500 );--spectrum-tabs-quiet-vertical-emphasized-selection-indicator-color: var( --spectrum-global-color-blue-500 );--spectrum-well-background-color: var(--dh-color-well-bg);--spectrum-well-border-color: var(--dh-color-well-border);--spectrum-tray-background-color: var(--spectrum-global-color-gray-100);--react-spectrum-datepicker-placeholder-color: var( --spectrum-global-color-gray-600 );--spectrum-accent-background-color-default: var(--dh-color-accent-bg);--spectrum-accent-background-color-hover: var(--dh-color-accent-hover-bg);--spectrum-accent-background-color-down: var(--dh-color-accent-down-bg);--spectrum-accent-background-color-key-focus: var( --dh-color-accent-key-focus-bg );--spectrum-neutral-background-color-default: var(--dh-color-neutral-bg);--spectrum-neutral-background-color-hover: var(--dh-color-neutral-hover-bg);--spectrum-neutral-background-color-down: var(--dh-color-neutral-down-bg);--spectrum-neutral-background-color-key-focus: var( --dh-color-neutral-key-focus-bg );--spectrum-neutral-subdued-background-color-default: var( --dh-color-neutral-subdued-bg );--spectrum-neutral-subdued-background-color-hover: var( --dh-color-neutral-subdued-hover-bg );--spectrum-neutral-subdued-background-color-down: var( --dh-color-neutral-subdued-down-bg );--spectrum-neutral-subdued-background-color-key-focus: var( --dh-color-neutral-subdued-key-focus-bg );--spectrum-negative-background-color-default: var(--dh-color-negative-bg);--spectrum-negative-background-color-hover: var(--dh-color-negative-hover-bg);--spectrum-negative-background-color-down: var(--dh-color-negative-down-bg);--spectrum-negative-background-color-key-focus: var( --dh-color-negative-key-focus-bg );--spectrum-positive-background-color-default: var(--dh-color-positive-bg);--spectrum-positive-background-color-hover: var(--dh-color-positive-hover-bg);--spectrum-positive-background-color-down: var(--dh-color-positive-down-bg);--spectrum-positive-background-color-key-focus: var( --dh-color-positive-key-focus-bg );--spectrum-informative-background-color-default: var(--dh-color-info-bg);--spectrum-informative-background-color-hover: var(--dh-color-info-hover-bg);--spectrum-informative-background-color-down: var(--dh-color-info-down-bg);--spectrum-informative-background-color-key-focus: var( --dh-color-info-key-focus-bg );--spectrum-notice-background-color-default: var(--dh-color-notice-bg);--spectrum-notice-background-color-hover: var(--dh-color-notice-hover-bg);--spectrum-notice-background-color-down: var(--dh-color-notice-down-bg);--spectrum-notice-background-color-key-focus: var( --dh-color-notice-key-focus-bg );--spectrum-gray-background-color-default: var(--dh-color-gray-bg);--spectrum-red-background-color-default: var(--dh-color-red-bg);--spectrum-orange-background-color-default: var(--dh-color-orange-bg);--spectrum-yellow-background-color-default: var(--dh-color-yellow-bg);--spectrum-chartreuse-background-color-default: var(--dh-color-chartreuse-bg);--spectrum-celery-background-color-default: var(--dh-color-celery-bg);--spectrum-green-background-color-default: var(--dh-color-green-bg);--spectrum-seafoam-background-color-default: var(--dh-color-seafoam-bg);--spectrum-cyan-background-color-default: var(--dh-color-cyan-bg);--spectrum-blue-background-color-default: var(--dh-color-blue-bg);--spectrum-indigo-background-color-default: var(--dh-color-indigo-bg);--spectrum-purple-background-color-default: var(--dh-color-purple-bg);--spectrum-fuchsia-background-color-default: var(--dh-color-fuchsia-bg);--spectrum-magenta-background-color-default: var(--dh-color-magenta-bg);--spectrum-negative-visual-color: var(--dh-color-visual-negative);--spectrum-positive-visual-color: var(--dh-color-visual-positive);--spectrum-notice-visual-color: var(--dh-color-visual-notice);--spectrum-informative-visual-color: var(--dh-color-visual-info);--spectrum-gray-visual-color: var(--dh-color-visual-gray);--spectrum-red-visual-color: var(--dh-color-visual-red);--spectrum-orange-visual-color: var(--dh-color-visual-orange);--spectrum-yellow-visual-color: var(--dh-color-visual-yellow);--spectrum-chartreuse-visual-color: var(--dh-color-visual-chartreuse);--spectrum-celery-visual-color: var(--dh-color-visual-celery);--spectrum-green-visual-color: var(--dh-color-visual-green);--spectrum-seafoam-visual-color: var(--dh-color-visual-seafoam);--spectrum-cyan-visual-color: var(--dh-color-visual-cyan);--spectrum-blue-visual-color: var(--dh-color-visual-blue);--spectrum-indigo-visual-color: var(--dh-color-visual-indigo);--spectrum-purple-visual-color: var(--dh-color-visual-purple);--spectrum-fuchsia-visual-color: var(--dh-color-visual-fuchsia);--spectrum-magenta-visual-color: var(--dh-color-visual-magenta);--spectrum-textfield-background-color: var(--dh-color-input-bg);--spectrum-textfield-background-color-down: var(--dh-color-input-active-bg);--spectrum-textfield-background-color-disabled: var( --dh-color-input-disabled-bg );--spectrum-textfield-border-color: var(--dh-color-input-border);--spectrum-textfield-border-color-disabled: var( --dh-color-input-disabled-border );--spectrum-fieldbutton-background-color: var(--dh-color-selector-bg);--spectrum-fieldbutton-background-color-hover: var( --dh-color-selector-hover-bg );--spectrum-fieldbutton-background-color-disabled: var( --dh-color-input-disabled-bg );--spectrum-fieldbutton-border-color: var(--dh-color-input-border);--spectrum-fieldbutton-border-color-hover: var(--dh-color-input-hover-border);--spectrum-fieldbutton-icon-color: var(--dh-color-selector-fg);--spectrum-fieldbutton-icon-color-hover: var(--dh-color-selector-hover-fg);--spectrum-dialog-title-text-color: var(--dh-color-dialog-title-fg);--spectrum-dialog-content-text-color: var(--dh-color-dialog-fg);--spectrum-popover-background-color: var(--dh-color-popover-bg)}/*# sourceMappingURL=theme-spectrum-alias.module.css.map */
1
+ .dh-spectrum-alias{--spectrum-alias-background-color-default: var(--dh-color-bg);--spectrum-alias-background-color-disabled: var(--dh-color-disabled-bg);--spectrum-alias-label-text-color: var(--dh-color-label-text);--spectrum-alias-text-color: var(--dh-color-text);--spectrum-alias-text-color-hover: var(--dh-color-text-hover);--spectrum-alias-text-color-disabled: var(--dh-color-text-disabled);--spectrum-alias-border-color: var(--dh-color-border);--spectrum-alias-border-color-hover: var(--dh-color-hover-border);--spectrum-alias-border-color-focus: var(--dh-color-border-focus);--spectrum-alias-input-border-color-key-focus: var( --spectrum-alias-border-color-focus );--spectrum-alias-focus-color: var(--dh-color-focus);--spectrum-alias-focus-ring-color: var(--dh-color-focus-ring);--spectrum-alias-icon-color: var(--dh-color-icon-fg);--spectrum-alias-icon-color-disabled: var(--dh-color-icon-disabled-fg);--spectrum-actionbutton-background-color-disabled: var( --dh-color-action-disabled-bg );--spectrum-actionbutton-border-color-disabled: var( --dh-color-action-disabled-border );--spectrum-actionbutton-text-color-disabled: var( --dh-color-action-disabled-fg );--spectrum-body-text-color: var(--dh-color-text);--spectrum-alias-dropshadow-color: var(--dh-color-dropshadow);--spectrum-alias-background-color-modal-overlay: var( --dh-color-modal-overlay-bg );--spectrum-alias-background-color-hover-overlay: var( --dh-color-overlay-hover-bg );--spectrum-colorarea-border-color: var(--dh-color-colorpicker-border);--spectrum-colorarea-border-color-hover: var(--dh-color-colorpicker-border);--spectrum-colorarea-border-color-down: var(--dh-color-colorpicker-border);--spectrum-colorarea-border-color-key-focus: var( --dh-color-colorpicker-border );--spectrum-colorslider-border-color: var(--dh-color-colorpicker-border);--spectrum-colorslider-border-color-hover: var(--dh-color-colorpicker-border);--spectrum-colorslider-border-color-down: var(--dh-color-colorpicker-border);--spectrum-colorslider-border-color-key-focus: var( --dh-color-colorpicker-border );--spectrum-colorslider-vertical-border-color: var( --dh-color-colorpicker-border );--spectrum-colorslider-vertical-border-color-hover: var( --dh-color-colorpicker-border );--spectrum-colorslider-vertical-border-color-down: var( --dh-color-colorpicker-border );--spectrum-colorslider-vertical-border-color-key-focus: var( --dh-color-colorpicker-border );--spectrum-colorwheel-border-color: var(--dh-color-colorpicker-border);--spectrum-colorwheel-border-color-hover: var(--dh-color-colorpicker-border);--spectrum-colorwheel-border-color-down: var(--dh-color-colorpicker-border);--spectrum-colorwheel-border-color-key-focus: var( --dh-color-colorpicker-border );--spectrum-alias-highlight-active: var(--dh-color-highlight-active);--spectrum-alias-highlight-hover: var(--dh-color-highlight-hover);--spectrum-alias-highlight-invalid: var(--dh-color-highlight-invalid);--spectrum-alias-highlight-selected: var(--dh-color-highlight-selected);--spectrum-alias-highlight-selected-hover: var( --dh-color-highlight-selected-hover );--spectrum-alias-text-highlight-color: var(--dh-color-text-highlight);--spectrum-alias-background-color-quickactions: var( --dh-color-quickactions-bg );--spectrum-alias-radial-reaction-color-default: var( --dh-color-radial-reaction );--spectrum-alias-appframe-border-color: var(--spectrum-global-color-gray-50);--spectrum-alias-appframe-separator-color: var( --spectrum-global-color-gray-50 );--spectrum-alias-pasteboard-background-color: var( --spectrum-global-color-gray-50 );--spectrum-tabs-compact-selection-indicator-color: var( --spectrum-global-color-blue-500 );--spectrum-tabs-compact-vertical-rule-color: var( --spectrum-global-color-gray-200 );--spectrum-tabs-compact-vertical-emphasized-selection-indicator-color: var( --spectrum-global-color-blue-500 );--spectrum-tabs-compact-vertical-emphasized-rule-color: var( --spectrum-global-color-gray-200 );--spectrum-tabs-emphasized-selection-indicator-color: var( --spectrum-global-color-blue-500 );--spectrum-tabs-quiet-compact-emphasized-selection-indicator-color: var( --spectrum-global-color-blue-500 );--spectrum-tabs-quiet-compact-vertical-emphasized-selection-indicator-color: var( --spectrum-global-color-blue-500 );--spectrum-tabs-quiet-emphasized-selection-indicator-color: var( --spectrum-global-color-blue-500 );--spectrum-tabs-quiet-vertical-emphasized-selection-indicator-color: var( --spectrum-global-color-blue-500 );--spectrum-well-background-color: var(--dh-color-well-bg);--spectrum-well-border-color: var(--dh-color-well-border);--spectrum-tray-background-color: var(--spectrum-global-color-gray-100);--react-spectrum-datepicker-placeholder-color: var( --spectrum-global-color-gray-600 );--spectrum-accent-background-color-default: var(--dh-color-accent-bg);--spectrum-accent-background-color-hover: var(--dh-color-accent-hover-bg);--spectrum-accent-background-color-down: var(--dh-color-accent-down-bg);--spectrum-accent-background-color-key-focus: var( --dh-color-accent-key-focus-bg );--spectrum-neutral-background-color-default: var(--dh-color-neutral-bg);--spectrum-neutral-background-color-hover: var(--dh-color-neutral-hover-bg);--spectrum-neutral-background-color-down: var(--dh-color-neutral-down-bg);--spectrum-neutral-background-color-key-focus: var( --dh-color-neutral-key-focus-bg );--spectrum-neutral-subdued-background-color-default: var( --dh-color-neutral-subdued-bg );--spectrum-neutral-subdued-background-color-hover: var( --dh-color-neutral-subdued-hover-bg );--spectrum-neutral-subdued-background-color-down: var( --dh-color-neutral-subdued-down-bg );--spectrum-neutral-subdued-background-color-key-focus: var( --dh-color-neutral-subdued-key-focus-bg );--spectrum-negative-background-color-default: var(--dh-color-negative-bg);--spectrum-negative-background-color-hover: var(--dh-color-negative-hover-bg);--spectrum-negative-background-color-down: var(--dh-color-negative-down-bg);--spectrum-negative-background-color-key-focus: var( --dh-color-negative-key-focus-bg );--spectrum-positive-background-color-default: var(--dh-color-positive-bg);--spectrum-positive-background-color-hover: var(--dh-color-positive-hover-bg);--spectrum-positive-background-color-down: var(--dh-color-positive-down-bg);--spectrum-positive-background-color-key-focus: var( --dh-color-positive-key-focus-bg );--spectrum-informative-background-color-default: var(--dh-color-info-bg);--spectrum-informative-background-color-hover: var(--dh-color-info-hover-bg);--spectrum-informative-background-color-down: var(--dh-color-info-down-bg);--spectrum-informative-background-color-key-focus: var( --dh-color-info-key-focus-bg );--spectrum-notice-background-color-default: var(--dh-color-notice-bg);--spectrum-notice-background-color-hover: var(--dh-color-notice-hover-bg);--spectrum-notice-background-color-down: var(--dh-color-notice-down-bg);--spectrum-notice-background-color-key-focus: var( --dh-color-notice-key-focus-bg );--spectrum-gray-background-color-default: var(--dh-color-gray-bg);--spectrum-red-background-color-default: var(--dh-color-red-bg);--spectrum-orange-background-color-default: var(--dh-color-orange-bg);--spectrum-yellow-background-color-default: var(--dh-color-yellow-bg);--spectrum-chartreuse-background-color-default: var(--dh-color-chartreuse-bg);--spectrum-celery-background-color-default: var(--dh-color-celery-bg);--spectrum-green-background-color-default: var(--dh-color-green-bg);--spectrum-seafoam-background-color-default: var(--dh-color-seafoam-bg);--spectrum-cyan-background-color-default: var(--dh-color-cyan-bg);--spectrum-blue-background-color-default: var(--dh-color-blue-bg);--spectrum-indigo-background-color-default: var(--dh-color-indigo-bg);--spectrum-purple-background-color-default: var(--dh-color-purple-bg);--spectrum-fuchsia-background-color-default: var(--dh-color-fuchsia-bg);--spectrum-magenta-background-color-default: var(--dh-color-magenta-bg);--spectrum-negative-visual-color: var(--dh-color-visual-negative);--spectrum-positive-visual-color: var(--dh-color-visual-positive);--spectrum-notice-visual-color: var(--dh-color-visual-notice);--spectrum-informative-visual-color: var(--dh-color-visual-info);--spectrum-gray-visual-color: var(--dh-color-visual-gray);--spectrum-red-visual-color: var(--dh-color-visual-red);--spectrum-orange-visual-color: var(--dh-color-visual-orange);--spectrum-yellow-visual-color: var(--dh-color-visual-yellow);--spectrum-chartreuse-visual-color: var(--dh-color-visual-chartreuse);--spectrum-celery-visual-color: var(--dh-color-visual-celery);--spectrum-green-visual-color: var(--dh-color-visual-green);--spectrum-seafoam-visual-color: var(--dh-color-visual-seafoam);--spectrum-cyan-visual-color: var(--dh-color-visual-cyan);--spectrum-blue-visual-color: var(--dh-color-visual-blue);--spectrum-indigo-visual-color: var(--dh-color-visual-indigo);--spectrum-purple-visual-color: var(--dh-color-visual-purple);--spectrum-fuchsia-visual-color: var(--dh-color-visual-fuchsia);--spectrum-magenta-visual-color: var(--dh-color-visual-magenta);--spectrum-textfield-background-color: var(--dh-color-input-bg);--spectrum-textfield-background-color-down: var(--dh-color-input-active-bg);--spectrum-textfield-background-color-disabled: var( --dh-color-input-disabled-bg );--spectrum-textfield-border-color: var(--dh-color-input-border);--spectrum-textfield-border-color-disabled: var( --dh-color-input-disabled-border );--spectrum-fieldbutton-background-color: var(--dh-color-selector-bg);--spectrum-fieldbutton-background-color-hover: var( --dh-color-selector-hover-bg );--spectrum-fieldbutton-background-color-disabled: var( --dh-color-input-disabled-bg );--spectrum-fieldbutton-border-color: var(--dh-color-input-border);--spectrum-fieldbutton-border-color-hover: var(--dh-color-input-hover-border);--spectrum-fieldbutton-icon-color: var(--dh-color-selector-fg);--spectrum-fieldbutton-icon-color-hover: var(--dh-color-selector-hover-fg);--spectrum-dialog-title-text-color: var(--dh-color-dialog-title-fg);--spectrum-dialog-content-text-color: var(--dh-color-dialog-fg);--spectrum-popover-background-color: var(--dh-color-popover-bg)}/*# sourceMappingURL=theme-spectrum-alias.module.css.map */
@@ -1 +1 @@
1
- {"version":3,"sourceRoot":"","sources":["../../../src/theme/theme-spectrum/theme-spectrum-alias.module.css"],"names":[],"mappings":"AAEA,mBAEE,8DACA,wEAEA,8DACA,kDACA,8DACA,oEACA,sDACA,kEACA,0FAGA,oDACA,8DACA,qDACA,uEAEA,wFAGA,wFAGA,kFAKA,iDAGA,8DACA,oFAGA,oFAKA,sEACA,4EACA,2EACA,kFAGA,wEACA,8EACA,6EACA,oFAGA,mFAGA,yFAGA,wFAGA,6FAGA,uEACA,6EACA,4EACA,mFAKA,oEACA,kEACA,sEACA,wEACA,sFAIA,sEACA,kFAGA,kFAIA,6EACA,kFAGA,qFAKA,2FAGA,qFAGA,+GAGA,gGAGA,8FAGA,4GAGA,qHAGA,oGAGA,6GAKA,0DACA,0DAGA,wEAEA,uFAKA,sEACA,0EACA,wEACA,oFAKA,wEACA,4EACA,0EACA,sFAIA,0FAGA,8FAGA,4FAGA,sGAKA,0EACA,8EACA,4EACA,wFAKA,0EACA,8EACA,4EACA,wFAKA,yEACA,6EACA,2EACA,uFAKA,sEACA,0EACA,wEACA,oFAKA,kEACA,gEACA,sEACA,sEACA,8EACA,sEACA,oEACA,wEACA,kEACA,kEACA,sEACA,sEACA,wEACA,wEAGA,kEACA,kEACA,8DACA,iEAGA,0DACA,wDACA,8DACA,8DACA,sEACA,8DACA,4DACA,gEACA,0DACA,0DACA,8DACA,8DACA,gEACA,gEAKA,gEACA,4EACA,oFAGA,gEACA,oFAKA,qEACA,mFAGA,sFAGA,kEACA,8EACA,+DACA,2EAGA,oEACA,gEAGA","file":"theme-spectrum-alias.module.css","sourcesContent":["/* stylelint-disable custom-property-empty-line-before */\n/* stylelint-disable alpha-value-notation */\n.dh-spectrum-alias {\n /*********** Override variables in spectrum-global.css **********************/\n --spectrum-alias-background-color-default: var(--dh-color-bg);\n --spectrum-alias-background-color-disabled: var(--dh-color-disabled-bg);\n\n --spectrum-alias-label-text-color: var(--dh-color-label-text);\n --spectrum-alias-text-color: var(--dh-color-text);\n --spectrum-alias-text-color-hover: var(--dh-color-text-hover);\n --spectrum-alias-text-color-disabled: var(--dh-color-text-disabled);\n --spectrum-alias-border-color: var(--dh-color-border);\n --spectrum-alias-border-color-focus: var(--dh-color-border-focus);\n --spectrum-alias-input-border-color-key-focus: var(\n --spectrum-alias-border-color-focus\n );\n --spectrum-alias-focus-color: var(--dh-color-focus);\n --spectrum-alias-focus-ring-color: var(--dh-color-focus-ring);\n --spectrum-alias-icon-color: var(--dh-color-icon-fg);\n --spectrum-alias-icon-color-disabled: var(--dh-color-icon-disabled-fg);\n\n --spectrum-actionbutton-background-color-disabled: var(\n --dh-color-action-disabled-bg\n );\n --spectrum-actionbutton-border-color-disabled: var(\n --dh-color-action-disabled-border\n );\n --spectrum-actionbutton-text-color-disabled: var(\n --dh-color-action-disabled-fg\n );\n\n /*********** Override variables in spectrum-darkest.css *********************/\n --spectrum-body-text-color: var(--dh-color-text);\n\n /* Shadows / Overlays */\n --spectrum-alias-dropshadow-color: var(--dh-color-dropshadow);\n --spectrum-alias-background-color-modal-overlay: var(\n --dh-color-modal-overlay-bg\n );\n --spectrum-alias-background-color-hover-overlay: var(\n --dh-color-overlay-hover-bg\n );\n\n /* Color Picker Borders */\n --spectrum-colorarea-border-color: var(--dh-color-colorpicker-border);\n --spectrum-colorarea-border-color-hover: var(--dh-color-colorpicker-border);\n --spectrum-colorarea-border-color-down: var(--dh-color-colorpicker-border);\n --spectrum-colorarea-border-color-key-focus: var(\n --dh-color-colorpicker-border\n );\n --spectrum-colorslider-border-color: var(--dh-color-colorpicker-border);\n --spectrum-colorslider-border-color-hover: var(--dh-color-colorpicker-border);\n --spectrum-colorslider-border-color-down: var(--dh-color-colorpicker-border);\n --spectrum-colorslider-border-color-key-focus: var(\n --dh-color-colorpicker-border\n );\n --spectrum-colorslider-vertical-border-color: var(\n --dh-color-colorpicker-border\n );\n --spectrum-colorslider-vertical-border-color-hover: var(\n --dh-color-colorpicker-border\n );\n --spectrum-colorslider-vertical-border-color-down: var(\n --dh-color-colorpicker-border\n );\n --spectrum-colorslider-vertical-border-color-key-focus: var(\n --dh-color-colorpicker-border\n );\n --spectrum-colorwheel-border-color: var(--dh-color-colorpicker-border);\n --spectrum-colorwheel-border-color-hover: var(--dh-color-colorpicker-border);\n --spectrum-colorwheel-border-color-down: var(--dh-color-colorpicker-border);\n --spectrum-colorwheel-border-color-key-focus: var(\n --dh-color-colorpicker-border\n );\n\n /* Highlight */\n --spectrum-alias-highlight-active: var(--dh-color-highlight-active);\n --spectrum-alias-highlight-hover: var(--dh-color-highlight-hover);\n --spectrum-alias-highlight-invalid: var(--dh-color-highlight-invalid);\n --spectrum-alias-highlight-selected: var(--dh-color-highlight-selected);\n --spectrum-alias-highlight-selected-hover: var(\n --dh-color-highlight-selected-hover\n );\n\n --spectrum-alias-text-highlight-color: var(--dh-color-text-highlight);\n --spectrum-alias-background-color-quickactions: var(\n --dh-color-quickactions-bg\n );\n --spectrum-alias-radial-reaction-color-default: var(\n --dh-color-radial-reaction\n );\n\n --spectrum-alias-appframe-border-color: var(--spectrum-global-color-gray-50);\n --spectrum-alias-appframe-separator-color: var(\n --spectrum-global-color-gray-50\n );\n --spectrum-alias-pasteboard-background-color: var(\n --spectrum-global-color-gray-50\n );\n\n /* Tabs */\n --spectrum-tabs-compact-selection-indicator-color: var(\n --spectrum-global-color-blue-500\n );\n --spectrum-tabs-compact-vertical-rule-color: var(\n --spectrum-global-color-gray-200\n );\n --spectrum-tabs-compact-vertical-emphasized-selection-indicator-color: var(\n --spectrum-global-color-blue-500\n );\n --spectrum-tabs-compact-vertical-emphasized-rule-color: var(\n --spectrum-global-color-gray-200\n );\n --spectrum-tabs-emphasized-selection-indicator-color: var(\n --spectrum-global-color-blue-500\n );\n --spectrum-tabs-quiet-compact-emphasized-selection-indicator-color: var(\n --spectrum-global-color-blue-500\n );\n --spectrum-tabs-quiet-compact-vertical-emphasized-selection-indicator-color: var(\n --spectrum-global-color-blue-500\n );\n --spectrum-tabs-quiet-emphasized-selection-indicator-color: var(\n --spectrum-global-color-blue-500\n );\n --spectrum-tabs-quiet-vertical-emphasized-selection-indicator-color: var(\n --spectrum-global-color-blue-500\n );\n\n /* Wells */\n --spectrum-well-background-color: var(--dh-color-well-bg);\n --spectrum-well-border-color: var(--dh-color-well-border);\n\n /* PATCH: This is missing in Spectrum css */\n --spectrum-tray-background-color: var(--spectrum-global-color-gray-100);\n\n --react-spectrum-datepicker-placeholder-color: var(\n --spectrum-global-color-gray-600\n ); /* 4.8:1 contrast ratio */\n\n /* Accent */\n --spectrum-accent-background-color-default: var(--dh-color-accent-bg);\n --spectrum-accent-background-color-hover: var(--dh-color-accent-hover-bg);\n --spectrum-accent-background-color-down: var(--dh-color-accent-down-bg);\n --spectrum-accent-background-color-key-focus: var(\n --dh-color-accent-key-focus-bg\n );\n\n /* Neutral */\n --spectrum-neutral-background-color-default: var(--dh-color-neutral-bg);\n --spectrum-neutral-background-color-hover: var(--dh-color-neutral-hover-bg);\n --spectrum-neutral-background-color-down: var(--dh-color-neutral-down-bg);\n --spectrum-neutral-background-color-key-focus: var(\n --dh-color-neutral-key-focus-bg\n );\n\n --spectrum-neutral-subdued-background-color-default: var(\n --dh-color-neutral-subdued-bg\n );\n --spectrum-neutral-subdued-background-color-hover: var(\n --dh-color-neutral-subdued-hover-bg\n );\n --spectrum-neutral-subdued-background-color-down: var(\n --dh-color-neutral-subdued-down-bg\n );\n --spectrum-neutral-subdued-background-color-key-focus: var(\n --dh-color-neutral-subdued-key-focus-bg\n );\n\n /* Negative */\n --spectrum-negative-background-color-default: var(--dh-color-negative-bg);\n --spectrum-negative-background-color-hover: var(--dh-color-negative-hover-bg);\n --spectrum-negative-background-color-down: var(--dh-color-negative-down-bg);\n --spectrum-negative-background-color-key-focus: var(\n --dh-color-negative-key-focus-bg\n );\n\n /* Positive */\n --spectrum-positive-background-color-default: var(--dh-color-positive-bg);\n --spectrum-positive-background-color-hover: var(--dh-color-positive-hover-bg);\n --spectrum-positive-background-color-down: var(--dh-color-positive-down-bg);\n --spectrum-positive-background-color-key-focus: var(\n --dh-color-positive-key-focus-bg\n );\n\n /* Informative */\n --spectrum-informative-background-color-default: var(--dh-color-info-bg);\n --spectrum-informative-background-color-hover: var(--dh-color-info-hover-bg);\n --spectrum-informative-background-color-down: var(--dh-color-info-down-bg);\n --spectrum-informative-background-color-key-focus: var(\n --dh-color-info-key-focus-bg\n );\n\n /* Notice */\n --spectrum-notice-background-color-default: var(--dh-color-notice-bg);\n --spectrum-notice-background-color-hover: var(--dh-color-notice-hover-bg);\n --spectrum-notice-background-color-down: var(--dh-color-notice-down-bg);\n --spectrum-notice-background-color-key-focus: var(\n --dh-color-notice-key-focus-bg\n );\n\n /* Default Background */\n --spectrum-gray-background-color-default: var(--dh-color-gray-bg);\n --spectrum-red-background-color-default: var(--dh-color-red-bg);\n --spectrum-orange-background-color-default: var(--dh-color-orange-bg);\n --spectrum-yellow-background-color-default: var(--dh-color-yellow-bg);\n --spectrum-chartreuse-background-color-default: var(--dh-color-chartreuse-bg);\n --spectrum-celery-background-color-default: var(--dh-color-celery-bg);\n --spectrum-green-background-color-default: var(--dh-color-green-bg);\n --spectrum-seafoam-background-color-default: var(--dh-color-seafoam-bg);\n --spectrum-cyan-background-color-default: var(--dh-color-cyan-bg);\n --spectrum-blue-background-color-default: var(--dh-color-blue-bg);\n --spectrum-indigo-background-color-default: var(--dh-color-indigo-bg);\n --spectrum-purple-background-color-default: var(--dh-color-purple-bg);\n --spectrum-fuchsia-background-color-default: var(--dh-color-fuchsia-bg);\n --spectrum-magenta-background-color-default: var(--dh-color-magenta-bg);\n\n /* Visual levels */\n --spectrum-negative-visual-color: var(--dh-color-visual-negative);\n --spectrum-positive-visual-color: var(--dh-color-visual-positive);\n --spectrum-notice-visual-color: var(--dh-color-visual-notice);\n --spectrum-informative-visual-color: var(--dh-color-visual-info);\n\n /* Visual */\n --spectrum-gray-visual-color: var(--dh-color-visual-gray);\n --spectrum-red-visual-color: var(--dh-color-visual-red);\n --spectrum-orange-visual-color: var(--dh-color-visual-orange);\n --spectrum-yellow-visual-color: var(--dh-color-visual-yellow);\n --spectrum-chartreuse-visual-color: var(--dh-color-visual-chartreuse);\n --spectrum-celery-visual-color: var(--dh-color-visual-celery);\n --spectrum-green-visual-color: var(--dh-color-visual-green);\n --spectrum-seafoam-visual-color: var(--dh-color-visual-seafoam);\n --spectrum-cyan-visual-color: var(--dh-color-visual-cyan);\n --spectrum-blue-visual-color: var(--dh-color-visual-blue);\n --spectrum-indigo-visual-color: var(--dh-color-visual-indigo);\n --spectrum-purple-visual-color: var(--dh-color-visual-purple);\n --spectrum-fuchsia-visual-color: var(--dh-color-visual-fuchsia);\n --spectrum-magenta-visual-color: var(--dh-color-visual-magenta);\n\n /*********** Override component specific variables **************************/\n\n /* Textfield */\n --spectrum-textfield-background-color: var(--dh-color-input-bg);\n --spectrum-textfield-background-color-down: var(--dh-color-input-active-bg);\n --spectrum-textfield-background-color-disabled: var(\n --dh-color-input-disabled-bg\n );\n --spectrum-textfield-border-color: var(--dh-color-input-border);\n --spectrum-textfield-border-color-disabled: var(\n --dh-color-input-disabled-border\n );\n\n /* Fieldbutton */\n --spectrum-fieldbutton-background-color: var(--dh-color-selector-bg);\n --spectrum-fieldbutton-background-color-hover: var(\n --dh-color-selector-hover-bg\n );\n --spectrum-fieldbutton-background-color-disabled: var(\n --dh-color-input-disabled-bg\n );\n --spectrum-fieldbutton-border-color: var(--dh-color-input-border);\n --spectrum-fieldbutton-border-color-hover: var(--dh-color-input-hover-border);\n --spectrum-fieldbutton-icon-color: var(--dh-color-selector-fg);\n --spectrum-fieldbutton-icon-color-hover: var(--dh-color-selector-hover-fg);\n\n /* Dialogs */\n --spectrum-dialog-title-text-color: var(--dh-color-dialog-title-fg);\n --spectrum-dialog-content-text-color: var(--dh-color-dialog-fg);\n\n /* Popovers */\n --spectrum-popover-background-color: var(--dh-color-popover-bg);\n}\n"]}
1
+ {"version":3,"sourceRoot":"","sources":["../../../src/theme/theme-spectrum/theme-spectrum-alias.module.css"],"names":[],"mappings":"AAEA,mBAEE,8DACA,wEAEA,8DACA,kDACA,8DACA,oEACA,sDACA,kEACA,kEACA,0FAGA,oDACA,8DACA,qDACA,uEAEA,wFAGA,wFAGA,kFAKA,iDAGA,8DACA,oFAGA,oFAKA,sEACA,4EACA,2EACA,kFAGA,wEACA,8EACA,6EACA,oFAGA,mFAGA,yFAGA,wFAGA,6FAGA,uEACA,6EACA,4EACA,mFAKA,oEACA,kEACA,sEACA,wEACA,sFAIA,sEACA,kFAGA,kFAIA,6EACA,kFAGA,qFAKA,2FAGA,qFAGA,+GAGA,gGAGA,8FAGA,4GAGA,qHAGA,oGAGA,6GAKA,0DACA,0DAGA,wEAEA,uFAKA,sEACA,0EACA,wEACA,oFAKA,wEACA,4EACA,0EACA,sFAIA,0FAGA,8FAGA,4FAGA,sGAKA,0EACA,8EACA,4EACA,wFAKA,0EACA,8EACA,4EACA,wFAKA,yEACA,6EACA,2EACA,uFAKA,sEACA,0EACA,wEACA,oFAKA,kEACA,gEACA,sEACA,sEACA,8EACA,sEACA,oEACA,wEACA,kEACA,kEACA,sEACA,sEACA,wEACA,wEAGA,kEACA,kEACA,8DACA,iEAGA,0DACA,wDACA,8DACA,8DACA,sEACA,8DACA,4DACA,gEACA,0DACA,0DACA,8DACA,8DACA,gEACA,gEAKA,gEACA,4EACA,oFAGA,gEACA,oFAKA,qEACA,mFAGA,sFAGA,kEACA,8EACA,+DACA,2EAGA,oEACA,gEAGA","file":"theme-spectrum-alias.module.css","sourcesContent":["/* stylelint-disable custom-property-empty-line-before */\n/* stylelint-disable alpha-value-notation */\n.dh-spectrum-alias {\n /*********** Override variables in spectrum-global.css **********************/\n --spectrum-alias-background-color-default: var(--dh-color-bg);\n --spectrum-alias-background-color-disabled: var(--dh-color-disabled-bg);\n\n --spectrum-alias-label-text-color: var(--dh-color-label-text);\n --spectrum-alias-text-color: var(--dh-color-text);\n --spectrum-alias-text-color-hover: var(--dh-color-text-hover);\n --spectrum-alias-text-color-disabled: var(--dh-color-text-disabled);\n --spectrum-alias-border-color: var(--dh-color-border);\n --spectrum-alias-border-color-hover: var(--dh-color-hover-border);\n --spectrum-alias-border-color-focus: var(--dh-color-border-focus);\n --spectrum-alias-input-border-color-key-focus: var(\n --spectrum-alias-border-color-focus\n );\n --spectrum-alias-focus-color: var(--dh-color-focus);\n --spectrum-alias-focus-ring-color: var(--dh-color-focus-ring);\n --spectrum-alias-icon-color: var(--dh-color-icon-fg);\n --spectrum-alias-icon-color-disabled: var(--dh-color-icon-disabled-fg);\n\n --spectrum-actionbutton-background-color-disabled: var(\n --dh-color-action-disabled-bg\n );\n --spectrum-actionbutton-border-color-disabled: var(\n --dh-color-action-disabled-border\n );\n --spectrum-actionbutton-text-color-disabled: var(\n --dh-color-action-disabled-fg\n );\n\n /*********** Override variables in spectrum-darkest.css *********************/\n --spectrum-body-text-color: var(--dh-color-text);\n\n /* Shadows / Overlays */\n --spectrum-alias-dropshadow-color: var(--dh-color-dropshadow);\n --spectrum-alias-background-color-modal-overlay: var(\n --dh-color-modal-overlay-bg\n );\n --spectrum-alias-background-color-hover-overlay: var(\n --dh-color-overlay-hover-bg\n );\n\n /* Color Picker Borders */\n --spectrum-colorarea-border-color: var(--dh-color-colorpicker-border);\n --spectrum-colorarea-border-color-hover: var(--dh-color-colorpicker-border);\n --spectrum-colorarea-border-color-down: var(--dh-color-colorpicker-border);\n --spectrum-colorarea-border-color-key-focus: var(\n --dh-color-colorpicker-border\n );\n --spectrum-colorslider-border-color: var(--dh-color-colorpicker-border);\n --spectrum-colorslider-border-color-hover: var(--dh-color-colorpicker-border);\n --spectrum-colorslider-border-color-down: var(--dh-color-colorpicker-border);\n --spectrum-colorslider-border-color-key-focus: var(\n --dh-color-colorpicker-border\n );\n --spectrum-colorslider-vertical-border-color: var(\n --dh-color-colorpicker-border\n );\n --spectrum-colorslider-vertical-border-color-hover: var(\n --dh-color-colorpicker-border\n );\n --spectrum-colorslider-vertical-border-color-down: var(\n --dh-color-colorpicker-border\n );\n --spectrum-colorslider-vertical-border-color-key-focus: var(\n --dh-color-colorpicker-border\n );\n --spectrum-colorwheel-border-color: var(--dh-color-colorpicker-border);\n --spectrum-colorwheel-border-color-hover: var(--dh-color-colorpicker-border);\n --spectrum-colorwheel-border-color-down: var(--dh-color-colorpicker-border);\n --spectrum-colorwheel-border-color-key-focus: var(\n --dh-color-colorpicker-border\n );\n\n /* Highlight */\n --spectrum-alias-highlight-active: var(--dh-color-highlight-active);\n --spectrum-alias-highlight-hover: var(--dh-color-highlight-hover);\n --spectrum-alias-highlight-invalid: var(--dh-color-highlight-invalid);\n --spectrum-alias-highlight-selected: var(--dh-color-highlight-selected);\n --spectrum-alias-highlight-selected-hover: var(\n --dh-color-highlight-selected-hover\n );\n\n --spectrum-alias-text-highlight-color: var(--dh-color-text-highlight);\n --spectrum-alias-background-color-quickactions: var(\n --dh-color-quickactions-bg\n );\n --spectrum-alias-radial-reaction-color-default: var(\n --dh-color-radial-reaction\n );\n\n --spectrum-alias-appframe-border-color: var(--spectrum-global-color-gray-50);\n --spectrum-alias-appframe-separator-color: var(\n --spectrum-global-color-gray-50\n );\n --spectrum-alias-pasteboard-background-color: var(\n --spectrum-global-color-gray-50\n );\n\n /* Tabs */\n --spectrum-tabs-compact-selection-indicator-color: var(\n --spectrum-global-color-blue-500\n );\n --spectrum-tabs-compact-vertical-rule-color: var(\n --spectrum-global-color-gray-200\n );\n --spectrum-tabs-compact-vertical-emphasized-selection-indicator-color: var(\n --spectrum-global-color-blue-500\n );\n --spectrum-tabs-compact-vertical-emphasized-rule-color: var(\n --spectrum-global-color-gray-200\n );\n --spectrum-tabs-emphasized-selection-indicator-color: var(\n --spectrum-global-color-blue-500\n );\n --spectrum-tabs-quiet-compact-emphasized-selection-indicator-color: var(\n --spectrum-global-color-blue-500\n );\n --spectrum-tabs-quiet-compact-vertical-emphasized-selection-indicator-color: var(\n --spectrum-global-color-blue-500\n );\n --spectrum-tabs-quiet-emphasized-selection-indicator-color: var(\n --spectrum-global-color-blue-500\n );\n --spectrum-tabs-quiet-vertical-emphasized-selection-indicator-color: var(\n --spectrum-global-color-blue-500\n );\n\n /* Wells */\n --spectrum-well-background-color: var(--dh-color-well-bg);\n --spectrum-well-border-color: var(--dh-color-well-border);\n\n /* PATCH: This is missing in Spectrum css */\n --spectrum-tray-background-color: var(--spectrum-global-color-gray-100);\n\n --react-spectrum-datepicker-placeholder-color: var(\n --spectrum-global-color-gray-600\n ); /* 4.8:1 contrast ratio */\n\n /* Accent */\n --spectrum-accent-background-color-default: var(--dh-color-accent-bg);\n --spectrum-accent-background-color-hover: var(--dh-color-accent-hover-bg);\n --spectrum-accent-background-color-down: var(--dh-color-accent-down-bg);\n --spectrum-accent-background-color-key-focus: var(\n --dh-color-accent-key-focus-bg\n );\n\n /* Neutral */\n --spectrum-neutral-background-color-default: var(--dh-color-neutral-bg);\n --spectrum-neutral-background-color-hover: var(--dh-color-neutral-hover-bg);\n --spectrum-neutral-background-color-down: var(--dh-color-neutral-down-bg);\n --spectrum-neutral-background-color-key-focus: var(\n --dh-color-neutral-key-focus-bg\n );\n\n --spectrum-neutral-subdued-background-color-default: var(\n --dh-color-neutral-subdued-bg\n );\n --spectrum-neutral-subdued-background-color-hover: var(\n --dh-color-neutral-subdued-hover-bg\n );\n --spectrum-neutral-subdued-background-color-down: var(\n --dh-color-neutral-subdued-down-bg\n );\n --spectrum-neutral-subdued-background-color-key-focus: var(\n --dh-color-neutral-subdued-key-focus-bg\n );\n\n /* Negative */\n --spectrum-negative-background-color-default: var(--dh-color-negative-bg);\n --spectrum-negative-background-color-hover: var(--dh-color-negative-hover-bg);\n --spectrum-negative-background-color-down: var(--dh-color-negative-down-bg);\n --spectrum-negative-background-color-key-focus: var(\n --dh-color-negative-key-focus-bg\n );\n\n /* Positive */\n --spectrum-positive-background-color-default: var(--dh-color-positive-bg);\n --spectrum-positive-background-color-hover: var(--dh-color-positive-hover-bg);\n --spectrum-positive-background-color-down: var(--dh-color-positive-down-bg);\n --spectrum-positive-background-color-key-focus: var(\n --dh-color-positive-key-focus-bg\n );\n\n /* Informative */\n --spectrum-informative-background-color-default: var(--dh-color-info-bg);\n --spectrum-informative-background-color-hover: var(--dh-color-info-hover-bg);\n --spectrum-informative-background-color-down: var(--dh-color-info-down-bg);\n --spectrum-informative-background-color-key-focus: var(\n --dh-color-info-key-focus-bg\n );\n\n /* Notice */\n --spectrum-notice-background-color-default: var(--dh-color-notice-bg);\n --spectrum-notice-background-color-hover: var(--dh-color-notice-hover-bg);\n --spectrum-notice-background-color-down: var(--dh-color-notice-down-bg);\n --spectrum-notice-background-color-key-focus: var(\n --dh-color-notice-key-focus-bg\n );\n\n /* Default Background */\n --spectrum-gray-background-color-default: var(--dh-color-gray-bg);\n --spectrum-red-background-color-default: var(--dh-color-red-bg);\n --spectrum-orange-background-color-default: var(--dh-color-orange-bg);\n --spectrum-yellow-background-color-default: var(--dh-color-yellow-bg);\n --spectrum-chartreuse-background-color-default: var(--dh-color-chartreuse-bg);\n --spectrum-celery-background-color-default: var(--dh-color-celery-bg);\n --spectrum-green-background-color-default: var(--dh-color-green-bg);\n --spectrum-seafoam-background-color-default: var(--dh-color-seafoam-bg);\n --spectrum-cyan-background-color-default: var(--dh-color-cyan-bg);\n --spectrum-blue-background-color-default: var(--dh-color-blue-bg);\n --spectrum-indigo-background-color-default: var(--dh-color-indigo-bg);\n --spectrum-purple-background-color-default: var(--dh-color-purple-bg);\n --spectrum-fuchsia-background-color-default: var(--dh-color-fuchsia-bg);\n --spectrum-magenta-background-color-default: var(--dh-color-magenta-bg);\n\n /* Visual levels */\n --spectrum-negative-visual-color: var(--dh-color-visual-negative);\n --spectrum-positive-visual-color: var(--dh-color-visual-positive);\n --spectrum-notice-visual-color: var(--dh-color-visual-notice);\n --spectrum-informative-visual-color: var(--dh-color-visual-info);\n\n /* Visual */\n --spectrum-gray-visual-color: var(--dh-color-visual-gray);\n --spectrum-red-visual-color: var(--dh-color-visual-red);\n --spectrum-orange-visual-color: var(--dh-color-visual-orange);\n --spectrum-yellow-visual-color: var(--dh-color-visual-yellow);\n --spectrum-chartreuse-visual-color: var(--dh-color-visual-chartreuse);\n --spectrum-celery-visual-color: var(--dh-color-visual-celery);\n --spectrum-green-visual-color: var(--dh-color-visual-green);\n --spectrum-seafoam-visual-color: var(--dh-color-visual-seafoam);\n --spectrum-cyan-visual-color: var(--dh-color-visual-cyan);\n --spectrum-blue-visual-color: var(--dh-color-visual-blue);\n --spectrum-indigo-visual-color: var(--dh-color-visual-indigo);\n --spectrum-purple-visual-color: var(--dh-color-visual-purple);\n --spectrum-fuchsia-visual-color: var(--dh-color-visual-fuchsia);\n --spectrum-magenta-visual-color: var(--dh-color-visual-magenta);\n\n /*********** Override component specific variables **************************/\n\n /* Textfield */\n --spectrum-textfield-background-color: var(--dh-color-input-bg);\n --spectrum-textfield-background-color-down: var(--dh-color-input-active-bg);\n --spectrum-textfield-background-color-disabled: var(\n --dh-color-input-disabled-bg\n );\n --spectrum-textfield-border-color: var(--dh-color-input-border);\n --spectrum-textfield-border-color-disabled: var(\n --dh-color-input-disabled-border\n );\n\n /* Fieldbutton */\n --spectrum-fieldbutton-background-color: var(--dh-color-selector-bg);\n --spectrum-fieldbutton-background-color-hover: var(\n --dh-color-selector-hover-bg\n );\n --spectrum-fieldbutton-background-color-disabled: var(\n --dh-color-input-disabled-bg\n );\n --spectrum-fieldbutton-border-color: var(--dh-color-input-border);\n --spectrum-fieldbutton-border-color-hover: var(--dh-color-input-hover-border);\n --spectrum-fieldbutton-icon-color: var(--dh-color-selector-fg);\n --spectrum-fieldbutton-icon-color-hover: var(--dh-color-selector-hover-fg);\n\n /* Dialogs */\n --spectrum-dialog-title-text-color: var(--dh-color-dialog-title-fg);\n --spectrum-dialog-content-text-color: var(--dh-color-dialog-fg);\n\n /* Popovers */\n --spectrum-popover-background-color: var(--dh-color-popover-bg);\n}\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@deephaven/components",
3
- "version": "0.60.1-object-fetcher.7+443993f3",
3
+ "version": "0.61.0",
4
4
  "description": "Deephaven React component library",
5
5
  "author": "Deephaven Data Labs LLC",
6
6
  "license": "Apache-2.0",
@@ -25,10 +25,10 @@
25
25
  },
26
26
  "dependencies": {
27
27
  "@adobe/react-spectrum": "^3.29.0",
28
- "@deephaven/icons": "^0.60.1-object-fetcher.7+443993f3",
29
- "@deephaven/log": "^0.60.1-object-fetcher.7+443993f3",
30
- "@deephaven/react-hooks": "^0.60.1-object-fetcher.7+443993f3",
31
- "@deephaven/utils": "^0.60.1-object-fetcher.7+443993f3",
28
+ "@deephaven/icons": "^0.61.0",
29
+ "@deephaven/log": "^0.61.0",
30
+ "@deephaven/react-hooks": "^0.61.0",
31
+ "@deephaven/utils": "^0.61.0",
32
32
  "@fortawesome/fontawesome-svg-core": "^6.2.1",
33
33
  "@fortawesome/react-fontawesome": "^0.2.0",
34
34
  "@react-spectrum/theme-default": "^3.5.1",
@@ -52,7 +52,7 @@
52
52
  "react-dom": "^17.x"
53
53
  },
54
54
  "devDependencies": {
55
- "@deephaven/mocks": "^0.60.1-object-fetcher.7+443993f3"
55
+ "@deephaven/mocks": "^0.61.0"
56
56
  },
57
57
  "files": [
58
58
  "dist",
@@ -66,5 +66,5 @@
66
66
  "publishConfig": {
67
67
  "access": "public"
68
68
  },
69
- "gitHead": "443993f3fcc4a7501c154248468f65ff23f0ef23"
69
+ "gitHead": "1f47a8d21cb9daaf83361e130950c20155cfeffb"
70
70
  }
@@ -1,7 +1,6 @@
1
1
  // Import our custom variables and bootstrap
2
2
  // Can be imported directly by Vite since it resolves bootstrap to node_modules/bootstrap
3
3
  @import './custom.scss';
4
- @import './util.scss';
5
4
  @import './bootstrap_imports.scss';
6
5
 
7
6
  :root {
@@ -24,10 +23,10 @@ html {
24
23
 
25
24
  // override
26
25
  .text-black-50 {
27
- color: background-opacity(50) !important;
26
+ color: bg-opacity(50) !important;
28
27
  }
29
28
  .text-white-50 {
30
- color: foreground-opacity(50) !important;
29
+ color: fg-opacity(50) !important;
31
30
  }
32
31
 
33
32
  // deephaven-icons are designed on a 16px grid
@@ -46,7 +45,7 @@ body {
46
45
  padding: 0;
47
46
  overscroll-behavior: none;
48
47
  -ms-scroll-chaining: none;
49
- scrollbar-color: foreground-opacity(10) background-opacity(10); //applies to firefox only
48
+ scrollbar-color: fg-opacity(10) bg-opacity(10); //applies to firefox only
50
49
  }
51
50
 
52
51
  #root {
@@ -662,7 +661,7 @@ input[type='number']::-webkit-inner-spin-button {
662
661
 
663
662
  // style the same as monaco scrollbar
664
663
  ::-webkit-scrollbar-thumb {
665
- background: hsla(var(--dh-color-scrollbar-hsl), 0.18);
664
+ background: color-mix(in srgb, var(--dh-color-scrollbar) 18%, transparent);
666
665
  border-radius: 0;
667
666
  }
668
667
 
@@ -672,23 +671,25 @@ input[type='number']::-webkit-inner-spin-button {
672
671
  }
673
672
 
674
673
  ::-webkit-scrollbar-corner {
675
- background: background-opacity(10);
674
+ background: bg-opacity(10);
676
675
  }
677
676
 
678
677
  ::-webkit-scrollbar-track:horizontal {
679
- border-top: 1px solid hsla(var(--dh-color-scrollbar-hsl), 0.15);
678
+ border-top: 1px solid
679
+ color-mix(in srgb, var(--dh-color-scrollbar) 15%, transparent);
680
680
  }
681
681
 
682
682
  ::-webkit-scrollbar-track:vertical {
683
- border-left: 1px solid hsla(var(--dh-color-scrollbar-hsl), 0.15);
683
+ border-left: 1px solid
684
+ color-mix(in srgb, var(--dh-color-scrollbar) 15%, transparent);
684
685
  }
685
686
 
686
687
  ::-webkit-scrollbar-thumb:hover {
687
- background: hsla(var(--dh-color-scrollbar-hsl), 0.25);
688
+ background: color-mix(in srgb, var(--dh-color-scrollbar) 25%, transparent);
688
689
  }
689
690
 
690
691
  ::-webkit-scrollbar-thumb:active {
691
- background: hsla(var(--dh-color-scrollbar-hsl), 0.35);
692
+ background: color-mix(in srgb, var(--dh-color-scrollbar) 35%, transparent);
692
693
  }
693
694
 
694
695
  /********** Monaco Overides *********/
@@ -9,7 +9,11 @@
9
9
  // DH Customization: Convert semantic value to css variables
10
10
  $background: var(--dh-color-#{$semantic-value}-bg);
11
11
  $border: var(--dh-color-#{$semantic-value}-bg);
12
- $boxshadow-color: hsla(var(--dh-color-#{$semantic-value}-hsl), 0.5);
12
+ $boxshadow-color: color-mix(
13
+ in srgb,
14
+ var(--dh-color-#{$semantic-value}-bg) 50%,
15
+ transparent
16
+ );
13
17
  $hover-background: var(--dh-color-#{$semantic-value}-hover-bg);
14
18
  $hover-border: var(--dh-color-#{$semantic-value}-hover-bg);
15
19
  $active-background: var(--dh-color-#{$semantic-value}-down-bg);
@@ -76,7 +80,11 @@
76
80
  $semantic-value: map.get($bootstrap-dh-semantic-map, $bootstrap-value) or '';
77
81
 
78
82
  $color: var(--dh-color-#{$semantic-value}-bg);
79
- $boxshadow-color: hsla(var(--dh-color-#{$semantic-value}-hsl), 0.5);
83
+ $boxshadow-color: color-mix(
84
+ in srgb,
85
+ var(--dh-color-#{$semantic-value}-bg) 50%,
86
+ transparent
87
+ );
80
88
  $hover-color: color-yiq($semantic-value);
81
89
  $hover-background: var(--dh-color-#{$semantic-value}-hover-bg);
82
90
  $active-background: var(--dh-color-#{$semantic-value}-down-bg);
@@ -177,7 +177,11 @@ $input-placeholder-color: var(--dh-color-input-placeholder);
177
177
  $input-focus-border-color: var(--dh-color-input-focus-border);
178
178
 
179
179
  $input-btn-focus-width: 0.2rem;
180
- $input-btn-focus-color: hsla(var(--dh-color-accent-hsl), 0.35);
180
+ $input-btn-focus-color: color-mix(
181
+ in srgb,
182
+ var(--dh-color-accent) 35%,
183
+ transparent
184
+ );
181
185
  $input-btn-focus-box-shadow: 0 0 0 $input-btn-focus-width $input-btn-focus-color;
182
186
  $input-btn-line-height: 1.3;
183
187
  // Bootstrap uses a calc expression to determine the input height (calc(line-height + 2*padding-y + border)).
package/scss/custom.scss CHANGED
@@ -13,3 +13,4 @@
13
13
 
14
14
  //New variables come after imports
15
15
  @import './new_variables.scss';
16
+ @import './util.scss';
@@ -51,23 +51,7 @@ $ant-thickness: 1px;
51
51
  }
52
52
  }
53
53
 
54
- @function hsla-opacity($semantic-name, $i: 100) {
55
- @return hsla(var(--dh-color-#{$semantic-name}-hsl), math.div($i, 100));
56
- }
57
-
58
- @function accent-opacity($i: 100) {
59
- @return hsla-opacity('accent', $i);
60
- }
61
-
62
- @function background-opacity($i: 100) {
63
- @return hsla-opacity('bg', $i);
64
- }
65
-
66
- @function foreground-opacity($i: 100) {
67
- @return hsla-opacity('fg', $i);
68
- }
69
-
70
- $focus-bg-transparency: 0.12;
71
- $hover-bg-transparency: 0.14;
72
- $active-bg-transparency: 0.28;
73
- $exception-transparency: 0.13;
54
+ $focus-bg-transparency: 12%;
55
+ $hover-bg-transparency: 14%;
56
+ $active-bg-transparency: 28%;
57
+ $exception-transparency: 13%;
package/scss/util.scss CHANGED
@@ -53,3 +53,32 @@
53
53
  @function solid-gradient($color) {
54
54
  @return linear-gradient(0deg, $color, $color);
55
55
  }
56
+
57
+ @function color-mix-opacity($semantic-name, $i: 100) {
58
+ @return color-mix(
59
+ in srgb,
60
+ /* if $i doesn't contain a % sign, add one */
61
+ var(--dh-color-#{$semantic-name}) #{$i}#{if(unit($i) == '%', '', '%')},
62
+ transparent
63
+ );
64
+ }
65
+
66
+ @function accent-opacity($i: 100) {
67
+ @return color-mix-opacity('accent', $i);
68
+ }
69
+
70
+ @function negative-opacity($i: 100) {
71
+ @return color-mix-opacity('negative', $i);
72
+ }
73
+
74
+ @function black-opacity($i: 100) {
75
+ @return color-mix-opacity('black', $i);
76
+ }
77
+
78
+ @function bg-opacity($i: 100) {
79
+ @return color-mix-opacity('bg', $i);
80
+ }
81
+
82
+ @function fg-opacity($i: 100) {
83
+ @return color-mix-opacity('fg', $i);
84
+ }