npm - @deephaven/components - Versions diffs - 1.8.1-beta.8 → 1.9.0 - Mend

@deephaven/components 1.8.1-beta.8 → 1.9.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 (11) hide show

package/dist/popper/Popper.css +5 -0
package/dist/popper/Popper.css.map +1 -1
package/dist/popper/Popper.d.ts +4 -0
package/dist/popper/Popper.d.ts.map +1 -1
package/dist/popper/Popper.js +58 -12
package/dist/popper/Popper.js.map +1 -1
package/dist/theme/theme-dark/theme-dark-components.css +1 -1
package/dist/theme/theme-dark/theme-dark-components.css.map +1 -1
package/dist/theme/theme-light/theme-light-components.css +1 -1
package/dist/theme/theme-light/theme-light-components.css.map +1 -1
package/package.json +8 -8

package/dist/popper/Popper.css CHANGED Viewed

@@ -4,6 +4,9 @@
   position: absolute;
   z-index: 5000;
 }
+.popper-container .spectrum-theme-provider {
+  max-height: inherit;
+}
 .popper.popper-tooltip {
   --background-color: var(--dh-color-tooltip-bg);
@@ -18,9 +21,11 @@
   transition: visibility 0.15s, opacity 0.15s;
   pointer-events: none;
   outline: 0;
+  max-height: inherit;
 }
 .popper .popper-content {
   position: relative;
+  max-height: inherit;
 }
 .popper .popper-content .tooltip-content {
   text-align: center;

package/dist/popper/Popper.css.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sourceRoot":"","sources":["../../scss/custom.scss","../../scss/bootstrap_overrides.scss","../../src/popper/Popper.scss"],"names":[],"mappings":"AAAA;AC6LA;ACvLA;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;EAEA;EACA;EACA,eDuIc;ECtId,YDuIW;ECtIX,YACE;EAEF;EACA;;AAEA;EACE;;AAEA;EACE;EACA;;AAIJ;EACE;EACA;EACA;EACA;EACA,QAxCU;EAyCV;;;AAIJ;EACE;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;AAAA;EAME;;;AAGF;AAAA;EAME;;;AAGF;AAAA;EAME;;;AAGF;AAAA;EAME;;;AAGF;AAAA;AAAA;AAAA;EAYE;EACA;EACA;;;AAGF;EACE,eAjHY;;AAmHZ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAIJ;EACE,YA/HY;;AAiIZ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAIJ;EACE,aA7IY;;AA+IZ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAIJ;EACE,cA3JY;;AA6JZ;EACE;EACA;EACA;EACA;EACA;EACA;EACA","file":"Popper.css","sourcesContent":["/* stylelint-disable scss/at-import-no-partial-leading-underscore /\n// Consumers should be able to resolve bootstrap/ to node_modules/bootstrap\n\n//Make bootstrap functions available for use in overrides\n@import 'bootstrap/scss/_functions.scss';\n@import './bootstrap_overrides.scss';\n\n//_variable imports come after bootstrap default overrides,\n// makes all other variables and mixins from bootstrap available\n/// with just importing customer.scss\n@import 'bootstrap/scss/_variables.scss';\n@import 'bootstrap/scss/_mixins.scss';\n\n//New variables come after imports\n@import './new_variables.scss';\n@import './util.scss';\n","// Styling overrides for bootstrap\n@use 'sass:map';\n\n// Override / set color variables\n$red: var(--dh-color-visual-red);\n$orange: var(--dh-color-visual-orange);\n$yellow: var(--dh-color-visual-yellow);\n$green: var(--dh-color-visual-green);\n$blue: var(--dh-color-visual-blue);\n$purple: var(--dh-color-visual-purple);\n\n// Fallback colors are used if theme isn't loaded\n// this is required for error messages if the API doesn't load\n\n//Define our Gray scale\n$gray-100: var(--dh-color-gray-900, #fcfcfa);\n$gray-200: var(--dh-color-gray-800);\n$gray-300: var(--dh-color-gray-700);\n$gray-400: var(--dh-color-gray-600);\n$gray-500: var(--dh-color-gray-500);\n// intentional duplicate, scale doesn't line up otherwise\n// as we have gray-850 and spectrum doesn't and it is needed\n$gray-600: var(--dh-color-gray-500);\n$gray-700: var(--dh-color-gray-400);\n$gray-800: var(--dh-color-gray-300);\n$gray-850: var(--dh-color-gray-200);\n$gray-900: var(--dh-color-gray-75);\n$black: var(--dh-color-black, #1a171a);\n$white: var(--dh-color-white, #f0f0ee);\n\n//Define some UI colors\n$interfacegray: var(--dh-color-content-bg, #2d2a2e);\n$interfaceblue: var(--dh-color-accent-bg);\n$interfacewhite: $white;\n$interfaceblack: $black;\n$content-bg: var(--dh-color-content-bg, #2d2a2e);\n$background: var(--dh-color-bg, #1a171a);\n$foreground: var(--dh-color-fg, #f0f0ee);\n\n// Extend default Bootstrap $grays map\n$grays-custom: (\n '850': $gray-850,\n);\n$grays: () !default;\n$grays: map-merge($grays, $grays-custom);\n\n// Extend default Bootstrap $colors map\n$colors-custom: (\n 'black': $black,\n);\n$colors: () !default;\n$colors: map-merge($colors, $colors-custom);\n\n// Override default Bootstrap $theme-colors map by mapping each key to itself.\n// These will then be re-mapped inside of `button-outline-variant` and\n// `button-outline-variant` mixins in `bootstrap_override_mixins_buttons.scss`\n$theme-colors-self-map: ();\n@each $key\n in (\n 'primary',\n 'secondary',\n 'success',\n 'info',\n 'warning',\n 'danger',\n 'light',\n 'dark'\n )\n{\n $theme-colors-self-map: map.set($theme-colors-self-map, $key, $key);\n}\n$theme-colors: () !default;\n$theme-colors: map-merge($theme-colors, $theme-colors-self-map);\n\n// Used by bootstrap_override_mixins_buttons.scss to map Bootstrap colors to\n// DH semantic colors\n$bootstrap-dh-semantic-map: (\n 'primary': 'accent',\n 'secondary': 'neutral',\n 'success': 'positive',\n 'info': 'info',\n 'warning': 'notice',\n 'danger': 'negative',\n // We shouldn't be using these, but mapping so they work with our custom\n // `color-yiq` mixin. If we find a way to remove $light + $dark that are\n // defined in Bootstrap _variables.scss, we should remove these\n 'light': 'neutral',\n 'dark': 'neutral',\n);\n\n//Set default colors\n$body-bg: $black;\n$body-color: $interfacewhite;\n\n// Set brand colors\n$primary: var(--dh-color-accent-bg);\n$primary-hover: var(--dh-color-accent-hover-bg);\n$primary-dark: var(--dh-color-accent-down-bg);\n$secondary: var(--dh-color-neutral-bg);\n$secondary-hover: var(--dh-color-neutral-hover-bg);\n$success: $green;\n$info: $yellow;\n$warning: $orange;\n$danger: var(--dh-color-negative-bg);\n$danger-hover: var(--dh-color-negative-hover-bg);\n// We really don't want to use $light or $dark variables, but Bootstrap defines\n// them in _variables.scss. Explicitly setting them to ensure we are in control\n// of their values. If we can find a way to remove them, we should\n$light: var(--dh-color-gray-light);\n$dark: var(--dh-color-gray-dark);\n// Bootstrap doesn't define $mid, and we want to move away from this particular\n// semantic. Should be deleted by #1635\n$mid: var(--dh-color-gray-mid);\n\n$semantic-colors: (\n 'primary-hover': $primary-hover,\n 'primary-dark': $primary-dark,\n 'mid': $mid,\n 'content-bg': $interfacegray,\n 'background': $interfaceblack,\n 'foreground': $interfacewhite,\n 'secondary-hover': $secondary-hover,\n 'danger-hover': $danger-hover,\n);\n\n$component-active-bg: $primary;\n$theme-color-interval: 9%;\n$yiq-contrasted-threshold: 180;\n\n// Override fonts\n$font-family-sans-serif:\n 'Fira Sans',\n -apple-system,\n blinkmacsystemfont,\n 'Segoe UI',\n 'Roboto',\n 'Helvetica Neue',\n arial,\n sans-serif; //fira sans then native system ui fallbacks\n$font-family-monospace: 'Fira Mono', menlo, monaco, consolas, 'Liberation Mono',\n 'Courier New', monospace;\n$font-family-base: $font-family-sans-serif;\n\n$headings-font-weight: 400;\n\n//Text overides\n$text-muted: $gray-400;\n\n//Style Selection highlight color\n$text-select-color: var(--dh-color-text-highlight);\n\n//Grid variables, same value as default just making easily accessible\n$grid-gutter-width: 30px;\n\n//Visual Overrides\n$border-radius: 4px;\n$box-shadow: 0 0.1rem 1rem var(--dh-color-dropshadow);\n\n//Override Btn\n$btn-border-radius: 4rem;\n$btn-padding-x: 1.5rem;\n$btn-transition:\n color 0.12s ease-in-out,\n background-color 0.12s ease-in-out,\n border-color 0.12s ease-in-out,\n box-shadow 0.12s ease-in-out; //default 0.15 is too long\n$btn-border-width: 2px;\n$btn-font-weight: var(--spectrum-global-font-weight-bold);\n$btn-line-height: 1.3;\n\n//Override Inputs\n$input-bg: var(--dh-color-input-bg);\n$input-disabled-bg: var(--dh-color-input-disabled-bg);\n$input-color: var(--dh-color-input-fg);\n$input-border-color: var(--dh-color-input-border);\n$input-placeholder-color: var(--dh-color-input-placeholder);\n$input-focus-border-color: var(--dh-color-input-focus-border);\n\n$input-btn-focus-width: 0.2rem;\n$input-btn-focus-color: color-mix(\n in srgb,\n var(--dh-color-accent) 35%,\n transparent\n);\n$input-btn-focus-box-shadow: 0 0 0 $input-btn-focus-width $input-btn-focus-color;\n$input-btn-line-height: 1.3;\n// Bootstrap uses a calc expression to determine the input height (calc(line-height + 2padding-y + border)).\n// The padding-y value has to be in rem to match units as it is a SASS calc.\n// Using 0.42145rem with 1.3 line height gets us to spectrum's 32px.\n/* stylelint-disable-next-line number-max-precision */\n$input-btn-padding-y: 0.42145rem;\n\n//checkbox\n$custom-control-indicator-bg: var(--dh-color-input-bg);\n$custom-control-indicator-border-color: var(--dh-color-input-border);\n$custom-checkbox-indicator-border-radius: 2px;\n$custom-control-indicator-border-width: 2px;\n$custom-control-indicator-active-bg: var(--dh-color-input-bg);\n$custom-control-indicator-active-border-color: var(--dh-color-input-fg);\n$custom-control-indicator-checked-bg: var(--dh-color-input-fg);\n$custom-control-indicator-checked-color: black; // used as mask fill color\n$custom-checkbox-indicator-indeterminate-bg: var(--dh-color-input-fg);\n$custom-control-indicator-bg-size: 75% 75%;\n$custom-control-indicator-disabled-bg: var(--dh-color-input-disabled-bg);\n$custom-control-indicator-checked-disabled-bg: var(\n --dh-color-input-disabled-bg\n);\n$custom-control-label-disabled-color: var(--dh-color-input-disabled-fg);\n\n// The $custom-select-indicator variable is used by Bootstrap to provide the\n// icon for the select dropdown. Inline svgs can't use CSS variables, so we hard\n// code the color to #929192 (the default value of --dh-color-gray-600). PR #1651\n// overrides this icon altogether for known dropdowns, so technically we may not\n// need this, but it's here in case there are any remaining instances.\n$custom-select-indicator-color: #929192;\n$custom-select-bg: var(--dh-color-selector-bg);\n$custom-select-bg-size: 16px 16px;\n//dhSort icon encoded\n$custom-select-indicator: str-replace(\n url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='#{$custom-select-indicator-color}' d='M4 7l-.4-.8 4-3.7h.8l4 3.7-.4.8H4zm0 2l-.4.8 4 3.7h.8l4-3.7L12 9H4z'/%3E%3C/svg%3E\"),\n '#',\n '%23'\n);\n$custom-select-focus-box-shadow: $input-btn-focus-box-shadow;\n$custom-select-disabled-color: $gray-500;\n$custom-select-disabled-bg: $gray-800;\n\n//modal\n$modal-content-bg: $content-bg;\n$modal-content-border-width: 0;\n$modal-md: 550px;\n$close-color: var(--dh-color-text);\n$close-text-shadow: none;\n\n// Toast notification\n$toast-bg: var(--dh-color-accent-100);\n$toast-color: var(--dh-color-text);\n$toast-error-bg: var(--dh-color-negative-bg);\n$toast-error-color: var(--dh-color-text);\n\n//tooltips\n$tooltip-bg: var(--dh-color-tooltip-bg);\n$tooltip-color: var(--dh-color-tooltip-fg);\n$tooltip-box-shadow: 0 0.1rem 1.5rem 0.1rem var(--dh-color-tooltip-box-shadow);\n\n//drowdowns\n$dropdown-bg: $gray-600;\n$dropdown-link-color: $foreground;\n$dropdown-link-hover-color: $foreground;\n$dropdown-link-hover-bg: var(--dh-color-item-list-hover-bg);\n$dropdown-divider-bg: $gray-700;\n\n//context menus\n$contextmenu-bg: var(--dh-color-popover-bg);\n$contextmenu-color: var(--dh-color-text);\n$contextmenu-disabled-color: var(--dh-color-text-disabled);\n$contextmenu-keyboard-selected-bg: var(--dh-color-keyboard-selected-bg);\n$contextmenu-selected-bg: var(--dh-color-item-list-hover-bg);\n$contextmenu-selected-color: var(--dh-color-item-list-selected-fg);\n\n//hr\n$hr-border-color: var(--dh-color-hr);\n\n//links\n$link-color: $gray-400;\n$link-hover-color: $foreground;\n\n//progress-bar\n$progress-bg: $gray-600;\n$progress-border-radius: 1rem;\n\n// Set global options\n$enable-shadows: false;\n$enable-gradients: false;\n$enable-print-styles: false; //I don't think anyone should expect to \"print\" this app.\n\n// Transition times\n$transition: 0.15s;\n$transition-mid: 0.2s;\n$transition-long: 0.3s;\n$transition-slow: 0.6s;\n\n//form-validation icon, uses vsWarning icon encoded here as svg\n$form-feedback-icon-invalid-color: $danger;\n$form-feedback-icon-invalid: str-replace(\n url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cg fill='none'%3E%3Cg fill='#{$form-feedback-icon-invalid-color}'%3E%3Cpath d='M7.56 1h.88l6.54 12.26-.44.74H1.44L1 13.26 7.56 1zM8 2.28 2.28 13H13.7L8 2.28zM8.625 12v-1h-1.25v1h1.25zm-1.25-2V6h1.25v4h-1.25z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E \"),\n '#',\n '%23'\n);\n\n// This section of variables is not consumed directly by DH, but they need to be\n// defined for sass to compile _variables\n$table-dark-bg: $gray-800;\n$table-dark-accent-bg: var(--dh-color-highlight-hover);\n$table-dark-hover-bg: var(--dh-color-highlight-active);\n$table-dark-border-color: $gray-700;\n$popover-bg: var(--dh-color-tooltip-bg);\n$popover-border-color: var(--dh-color-overlay-modal-bg);\n$popover-header-bg: #000;\n$popover-arrow-outer-color: var(--dh-color-dropshadow);\n$custom-range-thumb-active-bg: var(--dh-color-accent-1100);\n","@import '../../scss/custom.scss';\n\n$arrow-width: 5px;\n$animation-scale: 0.92;\n$animation-offset: 10px;\n\n.popper-container {\n position: absolute;\n z-index: 5000;\n}\n\n.popper.popper-tooltip {\n --background-color: var(--dh-color-tooltip-bg);\n}\n\n.popper {\n --background-color: var(--dh-color-popover-bg);\n\n background: var(--background-color);\n color: var(--dh-color-tooltip-fg);\n border-radius: $border-radius;\n box-shadow: $box-shadow;\n transition:\n visibility $transition,\n opacity $transition;\n pointer-events: none;\n outline: 0;\n\n .popper-content {\n position: relative;\n\n .tooltip-content {\n text-align: center;\n padding: $tooltip-padding-y $tooltip-padding-x;\n }\n }\n\n .popper-arrow {\n width: 0;\n height: 0;\n border-style: solid;\n position: absolute;\n margin: $arrow-width;\n border-color: var(--background-color);\n }\n}\n\n.popper.interactive {\n pointer-events: auto;\n}\n\n.popper-transition-enter {\n opacity: 0;\n transition: none;\n}\n\n.popper-transition-exit {\n opacity: 0;\n transition: all $transition;\n}\n\n.popper-container[x-placement^='top']\n > .spectrum-theme-provider\n .popper-transition-enter,\n.popper-container[x-placement^='top']\n > .spectrum-theme-provider\n .popper-transition-exit {\n transform: scale($animation-scale) translate(0, $animation-offset);\n}\n\n.popper-container[x-placement^='right']\n > .spectrum-theme-provider\n .popper-transition-enter,\n.popper-container[x-placement^='right']\n > .spectrum-theme-provider\n .popper-transition-exit {\n transform: scale($animation-scale) translate(-$animation-offset, 0);\n}\n\n.popper-container[x-placement^='bottom']\n > .spectrum-theme-provider\n .popper-transition-enter,\n.popper-container[x-placement^='bottom']\n > .spectrum-theme-provider\n .popper-transition-exit {\n transform: scale($animation-scale) translate(0, -$animation-offset);\n}\n\n.popper-container[x-placement^='left']\n > .spectrum-theme-provider\n .popper-transition-enter,\n.popper-container[x-placement^='left']\n > .spectrum-theme-provider\n .popper-transition-exit {\n transform: scale($animation-scale) translate($animation-offset, 0);\n}\n\n.popper-container[x-placement^='top']\n > .spectrum-theme-provider\n .popper-transition-enter-active.popper,\n.popper-container[x-placement^='right']\n > .spectrum-theme-provider\n .popper-transition-enter-active.popper,\n.popper-container[x-placement^='bottom']\n > .spectrum-theme-provider\n .popper-transition-enter-active.popper,\n.popper-container[x-placement^='left']\n > .spectrum-theme-provider\n .popper-transition-enter-active.popper {\n opacity: 1;\n transform: none;\n transition: all $transition ease-out;\n}\n\n.popper-container[x-placement^='top'] > .spectrum-theme-provider .popper {\n margin-bottom: $arrow-width;\n\n .popper-arrow {\n border-width: $arrow-width $arrow-width 0 $arrow-width;\n border-left-color: transparent;\n border-right-color: transparent;\n border-bottom-color: transparent;\n bottom: -$arrow-width;\n margin-top: 0;\n margin-bottom: 0;\n }\n}\n\n.popper-container[x-placement^='bottom'] > .spectrum-theme-provider .popper {\n margin-top: $arrow-width;\n\n .popper-arrow {\n border-width: 0 $arrow-width $arrow-width $arrow-width;\n border-left-color: transparent;\n border-right-color: transparent;\n border-top-color: transparent;\n top: -$arrow-width;\n margin-top: 0;\n margin-bottom: 0;\n }\n}\n\n.popper-container[x-placement^='right'] > .spectrum-theme-provider .popper {\n margin-left: $arrow-width;\n\n .popper-arrow {\n border-width: $arrow-width $arrow-width $arrow-width 0;\n border-left-color: transparent;\n border-top-color: transparent;\n border-bottom-color: transparent;\n left: -$arrow-width;\n margin-left: 0;\n margin-right: 0;\n }\n}\n\n.popper-container[x-placement^='left'] > .spectrum-theme-provider .popper {\n margin-right: $arrow-width;\n\n .popper-arrow {\n border-width: $arrow-width 0 $arrow-width $arrow-width;\n border-top-color: transparent;\n border-right-color: transparent;\n border-bottom-color: transparent;\n right: -$arrow-width;\n margin-left: 0;\n margin-right: 0;\n }\n}\n"]}
1	+ {"version":3,"sourceRoot":"","sources":["../../scss/custom.scss","../../scss/bootstrap_overrides.scss","../../src/popper/Popper.scss"],"names":[],"mappings":"AAAA;AC6LA;ACvLA;EACE;EACA;;AAEA;EACE;;;AAIJ;EACE;;;AAGF;EACE;EAEA;EACA;EACA,eDmIc;EClId,YDmIW;EClIX,YACE;EAEF;EACA;EACA;;AAEA;EACE;EACA;;AAEA;EACE;EACA;;AAIJ;EACE;EACA;EACA;EACA;EACA,QA9CU;EA+CV;;;AAIJ;EACE;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;AAAA;EAME;;;AAGF;AAAA;EAME;;;AAGF;AAAA;EAME;;;AAGF;AAAA;EAME;;;AAGF;AAAA;AAAA;AAAA;EAYE;EACA;EACA;;;AAGF;EACE,eAvHY;;AAyHZ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAIJ;EACE,YArIY;;AAuIZ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAIJ;EACE,aAnJY;;AAqJZ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAIJ;EACE,cAjKY;;AAmKZ;EACE;EACA;EACA;EACA;EACA;EACA;EACA","file":"Popper.css","sourcesContent":["/* stylelint-disable scss/at-import-no-partial-leading-underscore /\n// Consumers should be able to resolve bootstrap/ to node_modules/bootstrap\n\n//Make bootstrap functions available for use in overrides\n@import 'bootstrap/scss/_functions.scss';\n@import './bootstrap_overrides.scss';\n\n//_variable imports come after bootstrap default overrides,\n// makes all other variables and mixins from bootstrap available\n/// with just importing customer.scss\n@import 'bootstrap/scss/_variables.scss';\n@import 'bootstrap/scss/_mixins.scss';\n\n//New variables come after imports\n@import './new_variables.scss';\n@import './util.scss';\n","// Styling overrides for bootstrap\n@use 'sass:map';\n\n// Override / set color variables\n$red: var(--dh-color-visual-red);\n$orange: var(--dh-color-visual-orange);\n$yellow: var(--dh-color-visual-yellow);\n$green: var(--dh-color-visual-green);\n$blue: var(--dh-color-visual-blue);\n$purple: var(--dh-color-visual-purple);\n\n// Fallback colors are used if theme isn't loaded\n// this is required for error messages if the API doesn't load\n\n//Define our Gray scale\n$gray-100: var(--dh-color-gray-900, #fcfcfa);\n$gray-200: var(--dh-color-gray-800);\n$gray-300: var(--dh-color-gray-700);\n$gray-400: var(--dh-color-gray-600);\n$gray-500: var(--dh-color-gray-500);\n// intentional duplicate, scale doesn't line up otherwise\n// as we have gray-850 and spectrum doesn't and it is needed\n$gray-600: var(--dh-color-gray-500);\n$gray-700: var(--dh-color-gray-400);\n$gray-800: var(--dh-color-gray-300);\n$gray-850: var(--dh-color-gray-200);\n$gray-900: var(--dh-color-gray-75);\n$black: var(--dh-color-black, #1a171a);\n$white: var(--dh-color-white, #f0f0ee);\n\n//Define some UI colors\n$interfacegray: var(--dh-color-content-bg, #2d2a2e);\n$interfaceblue: var(--dh-color-accent-bg);\n$interfacewhite: $white;\n$interfaceblack: $black;\n$content-bg: var(--dh-color-content-bg, #2d2a2e);\n$background: var(--dh-color-bg, #1a171a);\n$foreground: var(--dh-color-fg, #f0f0ee);\n\n// Extend default Bootstrap $grays map\n$grays-custom: (\n '850': $gray-850,\n);\n$grays: () !default;\n$grays: map-merge($grays, $grays-custom);\n\n// Extend default Bootstrap $colors map\n$colors-custom: (\n 'black': $black,\n);\n$colors: () !default;\n$colors: map-merge($colors, $colors-custom);\n\n// Override default Bootstrap $theme-colors map by mapping each key to itself.\n// These will then be re-mapped inside of `button-outline-variant` and\n// `button-outline-variant` mixins in `bootstrap_override_mixins_buttons.scss`\n$theme-colors-self-map: ();\n@each $key\n in (\n 'primary',\n 'secondary',\n 'success',\n 'info',\n 'warning',\n 'danger',\n 'light',\n 'dark'\n )\n{\n $theme-colors-self-map: map.set($theme-colors-self-map, $key, $key);\n}\n$theme-colors: () !default;\n$theme-colors: map-merge($theme-colors, $theme-colors-self-map);\n\n// Used by bootstrap_override_mixins_buttons.scss to map Bootstrap colors to\n// DH semantic colors\n$bootstrap-dh-semantic-map: (\n 'primary': 'accent',\n 'secondary': 'neutral',\n 'success': 'positive',\n 'info': 'info',\n 'warning': 'notice',\n 'danger': 'negative',\n // We shouldn't be using these, but mapping so they work with our custom\n // `color-yiq` mixin. If we find a way to remove $light + $dark that are\n // defined in Bootstrap _variables.scss, we should remove these\n 'light': 'neutral',\n 'dark': 'neutral',\n);\n\n//Set default colors\n$body-bg: $black;\n$body-color: $interfacewhite;\n\n// Set brand colors\n$primary: var(--dh-color-accent-bg);\n$primary-hover: var(--dh-color-accent-hover-bg);\n$primary-dark: var(--dh-color-accent-down-bg);\n$secondary: var(--dh-color-neutral-bg);\n$secondary-hover: var(--dh-color-neutral-hover-bg);\n$success: $green;\n$info: $yellow;\n$warning: $orange;\n$danger: var(--dh-color-negative-bg);\n$danger-hover: var(--dh-color-negative-hover-bg);\n// We really don't want to use $light or $dark variables, but Bootstrap defines\n// them in _variables.scss. Explicitly setting them to ensure we are in control\n// of their values. If we can find a way to remove them, we should\n$light: var(--dh-color-gray-light);\n$dark: var(--dh-color-gray-dark);\n// Bootstrap doesn't define $mid, and we want to move away from this particular\n// semantic. Should be deleted by #1635\n$mid: var(--dh-color-gray-mid);\n\n$semantic-colors: (\n 'primary-hover': $primary-hover,\n 'primary-dark': $primary-dark,\n 'mid': $mid,\n 'content-bg': $interfacegray,\n 'background': $interfaceblack,\n 'foreground': $interfacewhite,\n 'secondary-hover': $secondary-hover,\n 'danger-hover': $danger-hover,\n);\n\n$component-active-bg: $primary;\n$theme-color-interval: 9%;\n$yiq-contrasted-threshold: 180;\n\n// Override fonts\n$font-family-sans-serif:\n 'Fira Sans',\n -apple-system,\n blinkmacsystemfont,\n 'Segoe UI',\n 'Roboto',\n 'Helvetica Neue',\n arial,\n sans-serif; //fira sans then native system ui fallbacks\n$font-family-monospace: 'Fira Mono', menlo, monaco, consolas, 'Liberation Mono',\n 'Courier New', monospace;\n$font-family-base: $font-family-sans-serif;\n\n$headings-font-weight: 400;\n\n//Text overides\n$text-muted: $gray-400;\n\n//Style Selection highlight color\n$text-select-color: var(--dh-color-text-highlight);\n\n//Grid variables, same value as default just making easily accessible\n$grid-gutter-width: 30px;\n\n//Visual Overrides\n$border-radius: 4px;\n$box-shadow: 0 0.1rem 1rem var(--dh-color-dropshadow);\n\n//Override Btn\n$btn-border-radius: 4rem;\n$btn-padding-x: 1.5rem;\n$btn-transition:\n color 0.12s ease-in-out,\n background-color 0.12s ease-in-out,\n border-color 0.12s ease-in-out,\n box-shadow 0.12s ease-in-out; //default 0.15 is too long\n$btn-border-width: 2px;\n$btn-font-weight: var(--spectrum-global-font-weight-bold);\n$btn-line-height: 1.3;\n\n//Override Inputs\n$input-bg: var(--dh-color-input-bg);\n$input-disabled-bg: var(--dh-color-input-disabled-bg);\n$input-color: var(--dh-color-input-fg);\n$input-border-color: var(--dh-color-input-border);\n$input-placeholder-color: var(--dh-color-input-placeholder);\n$input-focus-border-color: var(--dh-color-input-focus-border);\n\n$input-btn-focus-width: 0.2rem;\n$input-btn-focus-color: color-mix(\n in srgb,\n var(--dh-color-accent) 35%,\n transparent\n);\n$input-btn-focus-box-shadow: 0 0 0 $input-btn-focus-width $input-btn-focus-color;\n$input-btn-line-height: 1.3;\n// Bootstrap uses a calc expression to determine the input height (calc(line-height + 2padding-y + border)).\n// The padding-y value has to be in rem to match units as it is a SASS calc.\n// Using 0.42145rem with 1.3 line height gets us to spectrum's 32px.\n/* stylelint-disable-next-line number-max-precision */\n$input-btn-padding-y: 0.42145rem;\n\n//checkbox\n$custom-control-indicator-bg: var(--dh-color-input-bg);\n$custom-control-indicator-border-color: var(--dh-color-input-border);\n$custom-checkbox-indicator-border-radius: 2px;\n$custom-control-indicator-border-width: 2px;\n$custom-control-indicator-active-bg: var(--dh-color-input-bg);\n$custom-control-indicator-active-border-color: var(--dh-color-input-fg);\n$custom-control-indicator-checked-bg: var(--dh-color-input-fg);\n$custom-control-indicator-checked-color: black; // used as mask fill color\n$custom-checkbox-indicator-indeterminate-bg: var(--dh-color-input-fg);\n$custom-control-indicator-bg-size: 75% 75%;\n$custom-control-indicator-disabled-bg: var(--dh-color-input-disabled-bg);\n$custom-control-indicator-checked-disabled-bg: var(\n --dh-color-input-disabled-bg\n);\n$custom-control-label-disabled-color: var(--dh-color-input-disabled-fg);\n\n// The $custom-select-indicator variable is used by Bootstrap to provide the\n// icon for the select dropdown. Inline svgs can't use CSS variables, so we hard\n// code the color to #929192 (the default value of --dh-color-gray-600). PR #1651\n// overrides this icon altogether for known dropdowns, so technically we may not\n// need this, but it's here in case there are any remaining instances.\n$custom-select-indicator-color: #929192;\n$custom-select-bg: var(--dh-color-selector-bg);\n$custom-select-bg-size: 16px 16px;\n//dhSort icon encoded\n$custom-select-indicator: str-replace(\n url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='#{$custom-select-indicator-color}' d='M4 7l-.4-.8 4-3.7h.8l4 3.7-.4.8H4zm0 2l-.4.8 4 3.7h.8l4-3.7L12 9H4z'/%3E%3C/svg%3E\"),\n '#',\n '%23'\n);\n$custom-select-focus-box-shadow: $input-btn-focus-box-shadow;\n$custom-select-disabled-color: $gray-500;\n$custom-select-disabled-bg: $gray-800;\n\n//modal\n$modal-content-bg: $content-bg;\n$modal-content-border-width: 0;\n$modal-md: 550px;\n$close-color: var(--dh-color-text);\n$close-text-shadow: none;\n\n// Toast notification\n$toast-bg: var(--dh-color-accent-100);\n$toast-color: var(--dh-color-text);\n$toast-error-bg: var(--dh-color-negative-bg);\n$toast-error-color: var(--dh-color-text);\n\n//tooltips\n$tooltip-bg: var(--dh-color-tooltip-bg);\n$tooltip-color: var(--dh-color-tooltip-fg);\n$tooltip-box-shadow: 0 0.1rem 1.5rem 0.1rem var(--dh-color-tooltip-box-shadow);\n\n//drowdowns\n$dropdown-bg: $gray-600;\n$dropdown-link-color: $foreground;\n$dropdown-link-hover-color: $foreground;\n$dropdown-link-hover-bg: var(--dh-color-item-list-hover-bg);\n$dropdown-divider-bg: $gray-700;\n\n//context menus\n$contextmenu-bg: var(--dh-color-popover-bg);\n$contextmenu-color: var(--dh-color-text);\n$contextmenu-disabled-color: var(--dh-color-text-disabled);\n$contextmenu-keyboard-selected-bg: var(--dh-color-keyboard-selected-bg);\n$contextmenu-selected-bg: var(--dh-color-item-list-hover-bg);\n$contextmenu-selected-color: var(--dh-color-item-list-selected-fg);\n\n//hr\n$hr-border-color: var(--dh-color-hr);\n\n//links\n$link-color: $gray-400;\n$link-hover-color: $foreground;\n\n//progress-bar\n$progress-bg: $gray-600;\n$progress-border-radius: 1rem;\n\n// Set global options\n$enable-shadows: false;\n$enable-gradients: false;\n$enable-print-styles: false; //I don't think anyone should expect to \"print\" this app.\n\n// Transition times\n$transition: 0.15s;\n$transition-mid: 0.2s;\n$transition-long: 0.3s;\n$transition-slow: 0.6s;\n\n//form-validation icon, uses vsWarning icon encoded here as svg\n$form-feedback-icon-invalid-color: $danger;\n$form-feedback-icon-invalid: str-replace(\n url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cg fill='none'%3E%3Cg fill='#{$form-feedback-icon-invalid-color}'%3E%3Cpath d='M7.56 1h.88l6.54 12.26-.44.74H1.44L1 13.26 7.56 1zM8 2.28 2.28 13H13.7L8 2.28zM8.625 12v-1h-1.25v1h1.25zm-1.25-2V6h1.25v4h-1.25z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E \"),\n '#',\n '%23'\n);\n\n// This section of variables is not consumed directly by DH, but they need to be\n// defined for sass to compile _variables\n$table-dark-bg: $gray-800;\n$table-dark-accent-bg: var(--dh-color-highlight-hover);\n$table-dark-hover-bg: var(--dh-color-highlight-active);\n$table-dark-border-color: $gray-700;\n$popover-bg: var(--dh-color-tooltip-bg);\n$popover-border-color: var(--dh-color-overlay-modal-bg);\n$popover-header-bg: #000;\n$popover-arrow-outer-color: var(--dh-color-dropshadow);\n$custom-range-thumb-active-bg: var(--dh-color-accent-1100);\n","@import '../../scss/custom.scss';\n\n$arrow-width: 5px;\n$animation-scale: 0.92;\n$animation-offset: 10px;\n\n.popper-container {\n position: absolute;\n z-index: 5000;\n\n .spectrum-theme-provider {\n max-height: inherit;\n }\n}\n\n.popper.popper-tooltip {\n --background-color: var(--dh-color-tooltip-bg);\n}\n\n.popper {\n --background-color: var(--dh-color-popover-bg);\n\n background: var(--background-color);\n color: var(--dh-color-tooltip-fg);\n border-radius: $border-radius;\n box-shadow: $box-shadow;\n transition:\n visibility $transition,\n opacity $transition;\n pointer-events: none;\n outline: 0;\n max-height: inherit;\n\n .popper-content {\n position: relative;\n max-height: inherit;\n\n .tooltip-content {\n text-align: center;\n padding: $tooltip-padding-y $tooltip-padding-x;\n }\n }\n\n .popper-arrow {\n width: 0;\n height: 0;\n border-style: solid;\n position: absolute;\n margin: $arrow-width;\n border-color: var(--background-color);\n }\n}\n\n.popper.interactive {\n pointer-events: auto;\n}\n\n.popper-transition-enter {\n opacity: 0;\n transition: none;\n}\n\n.popper-transition-exit {\n opacity: 0;\n transition: all $transition;\n}\n\n.popper-container[x-placement^='top']\n > .spectrum-theme-provider\n .popper-transition-enter,\n.popper-container[x-placement^='top']\n > .spectrum-theme-provider\n .popper-transition-exit {\n transform: scale($animation-scale) translate(0, $animation-offset);\n}\n\n.popper-container[x-placement^='right']\n > .spectrum-theme-provider\n .popper-transition-enter,\n.popper-container[x-placement^='right']\n > .spectrum-theme-provider\n .popper-transition-exit {\n transform: scale($animation-scale) translate(-$animation-offset, 0);\n}\n\n.popper-container[x-placement^='bottom']\n > .spectrum-theme-provider\n .popper-transition-enter,\n.popper-container[x-placement^='bottom']\n > .spectrum-theme-provider\n .popper-transition-exit {\n transform: scale($animation-scale) translate(0, -$animation-offset);\n}\n\n.popper-container[x-placement^='left']\n > .spectrum-theme-provider\n .popper-transition-enter,\n.popper-container[x-placement^='left']\n > .spectrum-theme-provider\n .popper-transition-exit {\n transform: scale($animation-scale) translate($animation-offset, 0);\n}\n\n.popper-container[x-placement^='top']\n > .spectrum-theme-provider\n .popper-transition-enter-active.popper,\n.popper-container[x-placement^='right']\n > .spectrum-theme-provider\n .popper-transition-enter-active.popper,\n.popper-container[x-placement^='bottom']\n > .spectrum-theme-provider\n .popper-transition-enter-active.popper,\n.popper-container[x-placement^='left']\n > .spectrum-theme-provider\n .popper-transition-enter-active.popper {\n opacity: 1;\n transform: none;\n transition: all $transition ease-out;\n}\n\n.popper-container[x-placement^='top'] > .spectrum-theme-provider .popper {\n margin-bottom: $arrow-width;\n\n .popper-arrow {\n border-width: $arrow-width $arrow-width 0 $arrow-width;\n border-left-color: transparent;\n border-right-color: transparent;\n border-bottom-color: transparent;\n bottom: -$arrow-width;\n margin-top: 0;\n margin-bottom: 0;\n }\n}\n\n.popper-container[x-placement^='bottom'] > .spectrum-theme-provider .popper {\n margin-top: $arrow-width;\n\n .popper-arrow {\n border-width: 0 $arrow-width $arrow-width $arrow-width;\n border-left-color: transparent;\n border-right-color: transparent;\n border-top-color: transparent;\n top: -$arrow-width;\n margin-top: 0;\n margin-bottom: 0;\n }\n}\n\n.popper-container[x-placement^='right'] > .spectrum-theme-provider .popper {\n margin-left: $arrow-width;\n\n .popper-arrow {\n border-width: $arrow-width $arrow-width $arrow-width 0;\n border-left-color: transparent;\n border-top-color: transparent;\n border-bottom-color: transparent;\n left: -$arrow-width;\n margin-left: 0;\n margin-right: 0;\n }\n}\n\n.popper-container[x-placement^='left'] > .spectrum-theme-provider .popper {\n margin-right: $arrow-width;\n\n .popper-arrow {\n border-width: $arrow-width 0 $arrow-width $arrow-width;\n border-top-color: transparent;\n border-right-color: transparent;\n border-bottom-color: transparent;\n right: -$arrow-width;\n margin-left: 0;\n margin-right: 0;\n }\n}\n"]}

package/dist/popper/Popper.d.ts CHANGED Viewed

@@ -24,9 +24,11 @@ interface PopperProps {
     timeout: number;
     onEntered: () => void;
     onExited: () => void;
+    onBlur: (e: React.FocusEvent) => void;
     isShown: boolean;
     closeOnBlur: boolean;
     interactive: boolean;
+    keepInParent: boolean;
     referenceObject: ReferenceObject | null;
     'data-testid'?: string;
 }
@@ -41,9 +43,11 @@ declare class Popper extends Component<PopperProps, PopperState> {
         timeout: 150;
         onEntered(): void;
         onExited(): void;
+        onBlur(): void;
         isShown: boolean;
         interactive: boolean;
         closeOnBlur: boolean;
+        keepInParent: boolean;
         referenceObject: null;
         'data-testid': undefined;
     };

package/dist/popper/Popper.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Popper.d.ts","sourceRoot":"","sources":["../../src/popper/Popper.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAEH,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIzC,OAAO,QAAQ,EAAE,EAAE,KAAK,aAAa,EAAE,KAAK,eAAe,EAAE,MAAM,WAAW,CAAC;AAE/E,OAAO,eAAe,CAAC;~~AAKvB~~,UAAU,WAAW;IACnB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,OAAO,EAAE,aAAa,CAAC;IACvB,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,OAAO,EAAE,OAAO,CAAC;IACjB,WAAW,EAAE,OAAO,CAAC;IACrB,WAAW,EAAE,OAAO,CAAC;IACrB,eAAe,EAAE,eAAe,GAAG,IAAI,CAAC;IACxC,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,UAAU,WAAW;IACnB,IAAI,EAAE,OAAO,CAAC;IACd,MAAM,EAAE,QAAQ,GAAG,IAAI,CAAC;CACzB;AAED,cAAM,MAAO,SAAQ,SAAS,CAAC,WAAW,EAAE,WAAW,CAAC;IACtD,MAAM,CAAC,YAAY;;;;qBAIJ,IAAI;oBAGL,IAAI~~;;;;;;MAQhB~~;gBAEU,KAAK,EAAE,WAAW;IAsB9B,kBAAkB,CAAC,SAAS,EAAE,WAAW,GAAG,IAAI;~~IAehD~~,oBAAoB,IAAI,IAAI;IAI5B,OAAO,EAAE,cAAc,CAAC;IAExB,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;IAE3C,OAAO,kCAAqC;IAG5C,GAAG,EAAE,MAAM,CAAC;IAEZ,wFAAwF;IACxF,iBAAiB,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI,GAAG,WAAW,GAAG,IAAI;IAYlE,UAAU,IAAI,IAAI;~~IAwDlB~~,aAAa,CAAC,WAAW,UAAO,GAAG,IAAI;IAsBvC,IAAI,IAAI,IAAI;IASZ,IAAI,IAAI,IAAI;IAIZ,cAAc,IAAI,IAAI;IAKtB,UAAU,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,GAAG,IAAI;~~IASrC~~,WAAW,IAAI,IAAI;IAKnB,UAAU,IAAI,IAAI;IASlB,aAAa,IAAI,GAAG,CAAC,OAAO;IA4C5B,MAAM,IAAI,GAAG,CAAC,OAAO;CActB;AAED,eAAe,MAAM,CAAC;AACtB,YAAY,EAAE,aAAa,EAAE,eAAe,EAAE,CAAC"}
1	+ {"version":3,"file":"Popper.d.ts","sourceRoot":"","sources":["../../src/popper/Popper.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAEH,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIzC,OAAO,QAAQ,EAAE,EAAE,KAAK,aAAa,EAAE,KAAK,eAAe,EAAE,MAAM,WAAW,CAAC;AAE/E,OAAO,eAAe,CAAC;AAmCvB,UAAU,WAAW;IACnB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,OAAO,EAAE,aAAa,CAAC;IACvB,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACtC,OAAO,EAAE,OAAO,CAAC;IACjB,WAAW,EAAE,OAAO,CAAC;IACrB,WAAW,EAAE,OAAO,CAAC;IACrB,YAAY,EAAE,OAAO,CAAC;IACtB,eAAe,EAAE,eAAe,GAAG,IAAI,CAAC;IACxC,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,UAAU,WAAW;IACnB,IAAI,EAAE,OAAO,CAAC;IACd,MAAM,EAAE,QAAQ,GAAG,IAAI,CAAC;CACzB;AAED,cAAM,MAAO,SAAQ,SAAS,CAAC,WAAW,EAAE,WAAW,CAAC;IACtD,MAAM,CAAC,YAAY;;;;qBAIJ,IAAI;oBAGL,IAAI;kBAGN,IAAI;;;;;;;MASd;gBAEU,KAAK,EAAE,WAAW;IAsB9B,kBAAkB,CAAC,SAAS,EAAE,WAAW,GAAG,IAAI;IAoBhD,oBAAoB,IAAI,IAAI;IAI5B,OAAO,EAAE,cAAc,CAAC;IAExB,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;IAE3C,OAAO,kCAAqC;IAG5C,GAAG,EAAE,MAAM,CAAC;IAEZ,wFAAwF;IACxF,iBAAiB,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI,GAAG,WAAW,GAAG,IAAI;IAYlE,UAAU,IAAI,IAAI;IAuElB,aAAa,CAAC,WAAW,UAAO,GAAG,IAAI;IAsBvC,IAAI,IAAI,IAAI;IASZ,IAAI,IAAI,IAAI;IAIZ,cAAc,IAAI,IAAI;IAKtB,UAAU,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,GAAG,IAAI;IAarC,WAAW,IAAI,IAAI;IAKnB,UAAU,IAAI,IAAI;IASlB,aAAa,IAAI,GAAG,CAAC,OAAO;IA4C5B,MAAM,IAAI,GAAG,CAAC,OAAO;CActB;AAED,eAAe,MAAM,CAAC;AACtB,YAAY,EAAE,aAAa,EAAE,eAAe,EAAE,CAAC"}

package/dist/popper/Popper.js CHANGED Viewed

@@ -30,6 +30,28 @@ import "./Popper.css";
 import { SpectrumThemeProvider } from "../theme/SpectrumThemeProvider.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 var POPPER_CLASS_NAME = 'popper';
+var KEEP_IN_PARENT_OPTIONS = {
+  placement: 'bottom-end',
+  modifiers: {
+    preventOverflow: {
+      boundariesElement: 'scrollParent',
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      fn: (data, options) => {
+        var _PopperJs$Defaults$mo, _PopperJs$Defaults$mo2;
+        var modified = (_PopperJs$Defaults$mo = PopperJs.Defaults.modifiers) === null || _PopperJs$Defaults$mo === void 0 || (_PopperJs$Defaults$mo = _PopperJs$Defaults$mo.preventOverflow) === null || _PopperJs$Defaults$mo === void 0 || (_PopperJs$Defaults$mo2 = _PopperJs$Defaults$mo.fn) === null || _PopperJs$Defaults$mo2 === void 0 ? void 0 : _PopperJs$Defaults$mo2.call(_PopperJs$Defaults$mo, data, options);
+        if (modified == null) {
+          return data;
+        }
+        modified.styles.maxHeight = "".concat(document.documentElement.clientHeight - data.offsets.popper.top - 2 * options.padding // Double padding because there is top and bottom to account for
+        , "px");
+        return modified !== null && modified !== void 0 ? modified : data;
+      }
+    },
+    flip: {
+      enabled: false
+    }
+  }
+};
 class Popper extends Component {
   constructor(props) {
     super(props);
@@ -60,15 +82,21 @@ class Popper extends Component {
     var {
       isShown
     } = this.props;
+    var {
+      popper
+    } = this.state;
     if (prevProps.isShown !== isShown) {
-      if (isShown) {
-        cancelAnimationFrame(this.rAF);
-        this.rAF = window.requestAnimationFrame(() => {
+      cancelAnimationFrame(this.rAF);
+      this.rAF = window.requestAnimationFrame(() => {
+        if (isShown) {
           this.show();
-        });
-      } else {
-        this.hide();
-      }
+        } else {
+          this.hide();
+        }
+      });
+    }
+    if (popper) {
+      popper.scheduleUpdate();
     }
   }
   componentWillUnmount() {
@@ -82,6 +110,7 @@ class Popper extends Component {
     return this.getVisibleElement(element.parentElement);
   }
   initPopper() {
+    var _defaultOptions$modif, _optionsProp$modifier;
     var {
       popper: statePopper
     } = this.state;
@@ -96,16 +125,22 @@ class Popper extends Component {
       return;
     }
     var {
-      options
+      options: optionsProp,
+      keepInParent
     } = this.props;
-    options = _objectSpread({
+    var defaultOptions = keepInParent ? KEEP_IN_PARENT_OPTIONS : {
       placement: 'auto',
       modifiers: {
         preventOverflow: {
           boundariesElement: 'viewport'
         }
       }
-    }, options);
+    };
+    var options = _objectSpread(_objectSpread(_objectSpread({}, defaultOptions), optionsProp), {}, {
+      modifiers: _objectSpread(_objectSpread(_objectSpread({}, defaultOptions.modifiers), optionsProp.modifiers), {}, {
+        preventOverflow: _objectSpread(_objectSpread({}, (_defaultOptions$modif = defaultOptions.modifiers) === null || _defaultOptions$modif === void 0 ? void 0 : _defaultOptions$modif.preventOverflow), (_optionsProp$modifier = optionsProp.modifiers) === null || _optionsProp$modifier === void 0 ? void 0 : _optionsProp$modifier.preventOverflow)
+      })
+    });
     document.body.appendChild(this.element);
     var parent = this.getVisibleElement(this.container.current);
     if (parent == null) {
@@ -180,11 +215,18 @@ class Popper extends Component {
     if (popper) popper.scheduleUpdate();
   }
   handleBlur(e) {
+    var {
+      closeOnBlur,
+      onBlur
+    } = this.props;
     if (!(e.relatedTarget instanceof HTMLElement)) {
       return;
     }
     if (!this.element.contains(e.relatedTarget)) {
-      this.hide();
+      onBlur === null || onBlur === void 0 || onBlur(e);
+      if (closeOnBlur) {
+        this.hide();
+      }
     }
   }
   handleEnter() {
@@ -237,7 +279,7 @@ class Popper extends Component {
           className: classNames(POPPER_CLASS_NAME, {
             interactive
           }, className),
-          onBlur: closeOnBlur ? this.handleBlur : undefined,
+          onBlur: this.handleBlur,
           tabIndex: closeOnBlur ? -1 : undefined,
           role: "presentation",
           children: /*#__PURE__*/_jsxs("div", {
@@ -279,9 +321,13 @@ _defineProperty(Popper, "defaultProps", {
   onExited() {
     // no-op
   },
+  onBlur() {
+    // no-op
+  },
   isShown: false,
   interactive: false,
   closeOnBlur: false,
+  keepInParent: false,
   referenceObject: null,
   'data-testid': undefined
 });

package/dist/popper/Popper.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Popper.js","names":["React","Component","ReactDOM","flushSync","classNames","CSSTransition","PopperJs","ThemeExport","SpectrumThemeProvider","jsx","_jsx","jsxs","_jsxs","POPPER_CLASS_NAME","Popper","constructor","props","_defineProperty","createRef","handleEnter","bind","handleExit","handleBlur","element","document","createElement","className","container","rAF","isShown","state","show","popper","componentDidUpdate","prevProps","cancelAnimationFrame","window","requestAnimationFrame","hide","componentWillUnmount","destroyPopper","getVisibleElement","clientHeight","clientWidth","parentElement","initPopper","statePopper","closeOnBlur","referenceObject","current","options","_objectSpread","placement","modifiers","preventOverflow","boundariesElement","body","appendChild","parent","scheduleUpdate","popperEl","querySelector","concat","HTMLElement","contains","activeElement","focus","setState","updateState","arguments","length","undefined","destroy","removeChild","e","relatedTarget","onEntered","onExited","renderContent","children","timeout","interactive","isPortal","in","nodeRef","ref","onClick","stopPropagation","onKeyDown","key","onBlur","tabIndex","role","render","dataTestId","style","display","createPortal","transitionMs"],"sources":["../../src/popper/Popper.tsx"],"sourcesContent":["/*\n A component for creating popover dialogs. Only requires child element.\n \n <Popper\n * options={popperOptions}\n * className=\"whatever\"\n * onEntered={this.handleEnter}\n * onExited={this.handleExit}\n * closeOnBlur // if you want dialog to self close, on click outside\n * interactive // if popper contents will be interactable\n * isShown={variable} // controls if its shown or not,\n * ref={this.popper} // or via ref and this.popper.show() or this.popper.hide()\n * >\n * <ChildContent />\n * </Popper>\n /\n\nimport React, { Component } from 'react';\nimport ReactDOM, { flushSync } from 'react-dom';\nimport classNames from 'classnames';\nimport { CSSTransition } from 'react-transition-group';\nimport PopperJs, { type PopperOptions, type ReferenceObject } from 'popper.js';\nimport ThemeExport from '../ThemeExport';\nimport './Popper.scss';\nimport { SpectrumThemeProvider } from '../theme/SpectrumThemeProvider';\n\nconst POPPER_CLASS_NAME = 'popper';\n\ninterface PopperProps {\n children: React.ReactNode;\n options: PopperOptions;\n className: string;\n timeout: number;\n onEntered: () => void;\n onExited: () => void;\n isShown: boolean;\n closeOnBlur: boolean;\n interactive: boolean;\n referenceObject: ReferenceObject \| null;\n 'data-testid'?: string;\n}\n\ninterface PopperState {\n show: boolean;\n popper: PopperJs \| null;\n}\n\nclass Popper extends Component<PopperProps, PopperState> {\n static defaultProps = {\n options: {},\n className: '',\n timeout: ThemeExport.transitionMs,\n onEntered(): void {\n // no-op\n },\n onExited(): void {\n // no-op\n },\n isShown: false,\n interactive: false,\n closeOnBlur: false,\n referenceObject: null,\n 'data-testid': undefined,\n };\n\n constructor(props: PopperProps) {\n super(props);\n\n this.handleEnter = this.handleEnter.bind(this);\n this.handleExit = this.handleExit.bind(this);\n this.handleBlur = this.handleBlur.bind(this);\n this.element = document.createElement('div');\n this.element.className = 'popper-container';\n this.container = React.createRef<HTMLDivElement>();\n\n // cancelAnimationFrame does nothing if the handle isn't recognized\n // requestAnimationFrame provides a non-zero number, so 0 as a default should be safe\n this.rAF = 0;\n\n const { isShown } = this.props;\n\n this.state = {\n show: isShown,\n popper: null,\n };\n }\n\n componentDidUpdate(prevProps: PopperProps): void {\n const { isShown } = this.props;\n\n if (prevProps.isShown !== isShown) {\n if (isShown) {\n cancelAnimationFrame(this.rAF);\n this.rAF = window.requestAnimationFrame(() => {\n this.show();\n });\n } else {\n this.hide();\n }\n }\n }\n\n componentWillUnmount(): void {\n this.destroyPopper(false);\n }\n\n element: HTMLDivElement;\n\n container: React.RefObject<HTMLDivElement>;\n\n nodeRef = React.createRef<HTMLDivElement>();\n\n // This is the request animation frame handle number\n rAF: number;\n\n /* Goes through an element and it's parents until the first visible element is found /\n getVisibleElement(element: HTMLElement \| null): HTMLElement \| null {\n if (\n element == null \|\|\n element.clientHeight > 0 \|\|\n element.clientWidth > 0\n ) {\n return element;\n }\n\n return this.getVisibleElement(element.parentElement);\n }\n\n initPopper(): void {\n const { popper: statePopper } = this.state;\n const { closeOnBlur, referenceObject } = this.props;\n\n if (statePopper) {\n return;\n }\n\n if (this.container.current === null) {\n return;\n }\n\n let { options } = this.props;\n options = {\n placement: 'auto',\n modifiers: { preventOverflow: { boundariesElement: 'viewport' } },\n ...options,\n };\n document.body.appendChild(this.element);\n\n let parent = this.getVisibleElement(this.container.current);\n if (parent == null) {\n parent = this.container.current;\n }\n\n const popper = new PopperJs(\n referenceObject \|\| parent,\n this.element,\n options\n );\n popper.scheduleUpdate();\n\n // delayed due to scheduleUpdate\n cancelAnimationFrame(this.rAF);\n this.rAF = window.requestAnimationFrame(() => {\n // If the current focus is not on the .popper or one of its descendants,\n // set the focus to the .popper element. This is necessary for close on\n // blur to work.\n if (closeOnBlur) {\n const popperEl = this.element.querySelector(`.${POPPER_CLASS_NAME}`);\n\n if (\n popperEl instanceof HTMLElement &&\n !popperEl.contains(document.activeElement)\n ) {\n popperEl.focus();\n }\n }\n });\n\n // Needed to make the animation work\n flushSync(() => {\n this.setState({ popper });\n });\n }\n\n destroyPopper(updateState = true): void {\n cancelAnimationFrame(this.rAF);\n\n const { popper } = this.state;\n if (!popper) {\n return;\n }\n\n popper.destroy();\n\n // If component is exiting and unmounted in\n // the same frame, destroy can be called twice.\n // Check to make sure removeChild isn't called twice.\n if (document.body.contains(this.element)) {\n document.body.removeChild(this.element);\n }\n\n if (updateState) {\n this.setState({ popper: null });\n }\n }\n\n show(): void {\n this.initPopper();\n\n // Needed to make the animation work\n flushSync(() => {\n this.setState({ show: true });\n });\n }\n\n hide(): void {\n this.setState({ show: false });\n }\n\n scheduleUpdate(): void {\n const { popper } = this.state;\n if (popper) popper.scheduleUpdate();\n }\n\n handleBlur(e: React.FocusEvent): void {\n if (!(e.relatedTarget instanceof HTMLElement)) {\n return;\n }\n if (!this.element.contains(e.relatedTarget)) {\n this.hide();\n }\n }\n\n handleEnter(): void {\n const { onEntered } = this.props;\n onEntered(); // trigger any parent component waiting for enter handler\n }\n\n handleExit(): void {\n const { onExited } = this.props;\n const { show } = this.state;\n if (!show) {\n this.destroyPopper();\n }\n onExited(); // trigger any parent component waiting for exited handler\n }\n\n renderContent(): JSX.Element {\n const { className, children, timeout, interactive, closeOnBlur } =\n this.props;\n const { show } = this.state;\n\n return (\n <SpectrumThemeProvider isPortal>\n <CSSTransition\n in={show}\n timeout={timeout}\n classNames=\"popper-transition\"\n onEntered={this.handleEnter}\n onExited={this.handleExit}\n nodeRef={this.nodeRef}\n >\n <div\n ref={this.nodeRef}\n onClick={e => {\n // stop click events from escaping popper\n e.stopPropagation();\n }}\n onKeyDown={e => {\n if (e.key === 'Escape') this.hide();\n }}\n className={classNames(\n POPPER_CLASS_NAME,\n { interactive },\n className\n )}\n onBlur={closeOnBlur ? this.handleBlur : undefined}\n tabIndex={closeOnBlur ? -1 : undefined}\n role=\"presentation\"\n >\n <div className=\"popper-content\">\n {children}\n {/ eslint-disable-next-line react/no-unknown-property */}\n <div className=\"popper-arrow\" x-arrow=\"\" />\n </div>\n </div>\n </CSSTransition>\n </SpectrumThemeProvider>\n );\n }\n\n render(): JSX.Element {\n const { popper } = this.state;\n const { 'data-testid': dataTestId } = this.props;\n return (\n <div\n className=\"popper-parent-container\"\n ref={this.container}\n style={{ display: 'none' }}\n data-testid={dataTestId}\n >\n {popper && ReactDOM.createPortal(this.renderContent(), this.element)}\n </div>\n );\n }\n}\n\nexport default Popper;\nexport type { PopperOptions, ReferenceObject };\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"file":"Popper.js","names":["React","Component","ReactDOM","flushSync","classNames","CSSTransition","PopperJs","ThemeExport","SpectrumThemeProvider","jsx","_jsx","jsxs","_jsxs","POPPER_CLASS_NAME","KEEP_IN_PARENT_OPTIONS","placement","modifiers","preventOverflow","boundariesElement","fn","data","options","_PopperJs$Defaults$mo","_PopperJs$Defaults$mo2","modified","Defaults","call","styles","maxHeight","concat","document","documentElement","clientHeight","offsets","popper","top","padding","flip","enabled","Popper","constructor","props","_defineProperty","createRef","handleEnter","bind","handleExit","handleBlur","element","createElement","className","container","rAF","isShown","state","show","componentDidUpdate","prevProps","cancelAnimationFrame","window","requestAnimationFrame","hide","scheduleUpdate","componentWillUnmount","destroyPopper","getVisibleElement","clientWidth","parentElement","initPopper","_defaultOptions$modif","_optionsProp$modifier","statePopper","closeOnBlur","referenceObject","current","optionsProp","keepInParent","defaultOptions","_objectSpread","body","appendChild","parent","popperEl","querySelector","HTMLElement","contains","activeElement","focus","setState","updateState","arguments","length","undefined","destroy","removeChild","e","onBlur","relatedTarget","onEntered","onExited","renderContent","children","timeout","interactive","isPortal","in","nodeRef","ref","onClick","stopPropagation","onKeyDown","key","tabIndex","role","render","dataTestId","style","display","createPortal","transitionMs"],"sources":["../../src/popper/Popper.tsx"],"sourcesContent":["/*\n A component for creating popover dialogs. Only requires child element.\n \n <Popper\n * options={popperOptions}\n * className=\"whatever\"\n * onEntered={this.handleEnter}\n * onExited={this.handleExit}\n * closeOnBlur // if you want dialog to self close, on click outside\n * interactive // if popper contents will be interactable\n * isShown={variable} // controls if its shown or not,\n * ref={this.popper} // or via ref and this.popper.show() or this.popper.hide()\n * >\n * <ChildContent />\n * </Popper>\n /\n\nimport React, { Component } from 'react';\nimport ReactDOM, { flushSync } from 'react-dom';\nimport classNames from 'classnames';\nimport { CSSTransition } from 'react-transition-group';\nimport PopperJs, { type PopperOptions, type ReferenceObject } from 'popper.js';\nimport ThemeExport from '../ThemeExport';\nimport './Popper.scss';\nimport { SpectrumThemeProvider } from '../theme/SpectrumThemeProvider';\n\nconst POPPER_CLASS_NAME = 'popper';\n\nconst KEEP_IN_PARENT_OPTIONS: PopperOptions = {\n placement: 'bottom-end',\n modifiers: {\n preventOverflow: {\n boundariesElement: 'scrollParent',\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n fn: (data, options: any) => {\n const modified = PopperJs.Defaults.modifiers?.preventOverflow?.fn?.(\n data,\n options\n );\n\n if (modified == null) {\n return data;\n }\n\n modified.styles.maxHeight = `${\n document.documentElement.clientHeight -\n data.offsets.popper.top -\n 2 options.padding // Double padding because there is top and bottom to account for\n }px`;\n return modified ?? data;\n },\n },\n flip: {\n enabled: false,\n },\n },\n};\n\ninterface PopperProps {\n children: React.ReactNode;\n options: PopperOptions;\n className: string;\n timeout: number;\n onEntered: () => void;\n onExited: () => void;\n onBlur: (e: React.FocusEvent) => void;\n isShown: boolean;\n closeOnBlur: boolean;\n interactive: boolean;\n keepInParent: boolean;\n referenceObject: ReferenceObject \| null;\n 'data-testid'?: string;\n}\n\ninterface PopperState {\n show: boolean;\n popper: PopperJs \| null;\n}\n\nclass Popper extends Component<PopperProps, PopperState> {\n static defaultProps = {\n options: {},\n className: '',\n timeout: ThemeExport.transitionMs,\n onEntered(): void {\n // no-op\n },\n onExited(): void {\n // no-op\n },\n onBlur(): void {\n // no-op\n },\n isShown: false,\n interactive: false,\n closeOnBlur: false,\n keepInParent: false,\n referenceObject: null,\n 'data-testid': undefined,\n };\n\n constructor(props: PopperProps) {\n super(props);\n\n this.handleEnter = this.handleEnter.bind(this);\n this.handleExit = this.handleExit.bind(this);\n this.handleBlur = this.handleBlur.bind(this);\n this.element = document.createElement('div');\n this.element.className = 'popper-container';\n this.container = React.createRef<HTMLDivElement>();\n\n // cancelAnimationFrame does nothing if the handle isn't recognized\n // requestAnimationFrame provides a non-zero number, so 0 as a default should be safe\n this.rAF = 0;\n\n const { isShown } = this.props;\n\n this.state = {\n show: isShown,\n popper: null,\n };\n }\n\n componentDidUpdate(prevProps: PopperProps): void {\n const { isShown } = this.props;\n const { popper } = this.state;\n\n if (prevProps.isShown !== isShown) {\n cancelAnimationFrame(this.rAF);\n this.rAF = window.requestAnimationFrame(() => {\n if (isShown) {\n this.show();\n } else {\n this.hide();\n }\n });\n }\n\n if (popper) {\n popper.scheduleUpdate();\n }\n }\n\n componentWillUnmount(): void {\n this.destroyPopper(false);\n }\n\n element: HTMLDivElement;\n\n container: React.RefObject<HTMLDivElement>;\n\n nodeRef = React.createRef<HTMLDivElement>();\n\n // This is the request animation frame handle number\n rAF: number;\n\n /** Goes through an element and it's parents until the first visible element is found /\n getVisibleElement(element: HTMLElement \| null): HTMLElement \| null {\n if (\n element == null \|\|\n element.clientHeight > 0 \|\|\n element.clientWidth > 0\n ) {\n return element;\n }\n\n return this.getVisibleElement(element.parentElement);\n }\n\n initPopper(): void {\n const { popper: statePopper } = this.state;\n const { closeOnBlur, referenceObject } = this.props;\n\n if (statePopper) {\n return;\n }\n\n if (this.container.current === null) {\n return;\n }\n\n const { options: optionsProp, keepInParent } = this.props;\n const defaultOptions = keepInParent\n ? KEEP_IN_PARENT_OPTIONS\n : ({\n placement: 'auto',\n modifiers: { preventOverflow: { boundariesElement: 'viewport' } },\n } satisfies PopperOptions);\n\n const options = {\n ...defaultOptions,\n ...optionsProp,\n modifiers: {\n ...defaultOptions.modifiers,\n ...optionsProp.modifiers,\n preventOverflow: {\n ...defaultOptions.modifiers?.preventOverflow,\n ...optionsProp.modifiers?.preventOverflow,\n },\n },\n } satisfies PopperOptions;\n\n document.body.appendChild(this.element);\n\n let parent = this.getVisibleElement(this.container.current);\n if (parent == null) {\n parent = this.container.current;\n }\n\n const popper = new PopperJs(\n referenceObject \|\| parent,\n this.element,\n options\n );\n popper.scheduleUpdate();\n\n // delayed due to scheduleUpdate\n cancelAnimationFrame(this.rAF);\n this.rAF = window.requestAnimationFrame(() => {\n // If the current focus is not on the .popper or one of its descendants,\n // set the focus to the .popper element. This is necessary for close on\n // blur to work.\n if (closeOnBlur) {\n const popperEl = this.element.querySelector(`.${POPPER_CLASS_NAME}`);\n\n if (\n popperEl instanceof HTMLElement &&\n !popperEl.contains(document.activeElement)\n ) {\n popperEl.focus();\n }\n }\n });\n\n // Needed to make the animation work\n flushSync(() => {\n this.setState({ popper });\n });\n }\n\n destroyPopper(updateState = true): void {\n cancelAnimationFrame(this.rAF);\n\n const { popper } = this.state;\n if (!popper) {\n return;\n }\n\n popper.destroy();\n\n // If component is exiting and unmounted in\n // the same frame, destroy can be called twice.\n // Check to make sure removeChild isn't called twice.\n if (document.body.contains(this.element)) {\n document.body.removeChild(this.element);\n }\n\n if (updateState) {\n this.setState({ popper: null });\n }\n }\n\n show(): void {\n this.initPopper();\n\n // Needed to make the animation work\n flushSync(() => {\n this.setState({ show: true });\n });\n }\n\n hide(): void {\n this.setState({ show: false });\n }\n\n scheduleUpdate(): void {\n const { popper } = this.state;\n if (popper) popper.scheduleUpdate();\n }\n\n handleBlur(e: React.FocusEvent): void {\n const { closeOnBlur, onBlur } = this.props;\n if (!(e.relatedTarget instanceof HTMLElement)) {\n return;\n }\n if (!this.element.contains(e.relatedTarget)) {\n onBlur?.(e);\n if (closeOnBlur) {\n this.hide();\n }\n }\n }\n\n handleEnter(): void {\n const { onEntered } = this.props;\n onEntered(); // trigger any parent component waiting for enter handler\n }\n\n handleExit(): void {\n const { onExited } = this.props;\n const { show } = this.state;\n if (!show) {\n this.destroyPopper();\n }\n onExited(); // trigger any parent component waiting for exited handler\n }\n\n renderContent(): JSX.Element {\n const { className, children, timeout, interactive, closeOnBlur } =\n this.props;\n const { show } = this.state;\n\n return (\n <SpectrumThemeProvider isPortal>\n <CSSTransition\n in={show}\n timeout={timeout}\n classNames=\"popper-transition\"\n onEntered={this.handleEnter}\n onExited={this.handleExit}\n nodeRef={this.nodeRef}\n >\n <div\n ref={this.nodeRef}\n onClick={e => {\n // stop click events from escaping popper\n e.stopPropagation();\n }}\n onKeyDown={e => {\n if (e.key === 'Escape') this.hide();\n }}\n className={classNames(\n POPPER_CLASS_NAME,\n { interactive },\n className\n )}\n onBlur={this.handleBlur}\n tabIndex={closeOnBlur ? -1 : undefined}\n role=\"presentation\"\n >\n <div className=\"popper-content\">\n {children}\n {/ eslint-disable-next-line react/no-unknown-property */}\n <div className=\"popper-arrow\" x-arrow=\"\" />\n </div>\n </div>\n </CSSTransition>\n </SpectrumThemeProvider>\n );\n }\n\n render(): JSX.Element {\n const { popper } = this.state;\n const { 'data-testid': dataTestId } = this.props;\n return (\n <div\n className=\"popper-parent-container\"\n ref={this.container}\n style={{ display: 'none' }}\n data-testid={dataTestId}\n >\n {popper && ReactDOM.createPortal(this.renderContent(), this.element)}\n </div>\n );\n }\n}\n\nexport default Popper;\nexport type { PopperOptions, ReferenceObject };\n"],"mappings":"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","ignoreList":[]}

package/dist/theme/theme-dark/theme-dark-components.css CHANGED Viewed

	@@ -1 +1 @@
1	- :root{--dh-color-loading-spinner-primary: var(--dh-color-accent-bg);--dh-color-loading-spinner-secondary: color-mix( in srgb, var(--dh-color-gray-800) 50%, transparent );--dh-color-quickactions-bg: color-mix( in srgb, var(--dh-color-visual-gray) 90%, transparent );--dh-color-radial-reaction: color-mix( in srgb, var(--dh-color-visual-gray) 60%, transparent );--dh-color-colorpicker-border: color-mix( in srgb, var(--dh-color-visual-gray) 10%, transparent );--dh-logo-img: var(--dh-logo-dark-img);--dh-color-login-form-bg: var(--dh-color-gray-400);--dh-color-login-status-message: var(--dh-color-gray-600);--dh-color-login-logo-bg: var(--dh-color-gray-900);--dh-color-login-footer-fg: var(--dh-color-gray-700);--dh-color-random-area-plot-animation-fg-fill: color-mix( in srgb, var(--dh-color-accent) 8%, transparent );--dh-color-random-area-plot-animation-fg-stroke: color-mix( in srgb, var(--dh-color-accent) 20%, transparent );--dh-color-random-area-plot-animation-bg: var(--dh-color-gray-75);--dh-color-random-area-plot-animation-grid: var(--dh-color-gray-300);--dh-color-action-bg: var(--dh-color-gray-75);--dh-color-action-fg: var(--dh-color-text);--dh-color-action-border: var(--dh-color-border);--dh-color-action-down-bg: var(--dh-color-gray-300);--dh-color-action-hover-bg: var(--dh-color-gray-50);--dh-color-action-hover-fg: var(--dh-color-text-hover);--dh-color-action-hover-border: var(--dh-color-hover-border);--dh-color-action-active-bg: var(--dh-color-gray-800);--dh-color-action-active-fg: var(--dh-color-gray-50);--dh-color-action-active-border: var(--dh-color-gray-800);--dh-color-action-active-hover-bg: var(--dh-color-gray-900);--dh-color-action-active-hover-fg: var(--dh-color-gray-50);--dh-color-action-active-hover-border: var(--dh-color-gray-900);--dh-color-action-disabled-bg: transparent;--dh-color-action-disabled-fg: var(--dh-color-text-disabled);--dh-color-action-disabled-border: var(--dh-color-gray-300);--dh-color-icon-fg: var(--dh-color-gray-700);--dh-color-icon-disabled-fg: var(--dh-color-gray-400);--dh-color-input-bg: var(--dh-color-gray-75);--dh-color-input-fg: var(--dh-color-text);--dh-color-input-border: var(--dh-color-border);--dh-color-input-placeholder: var(--dh-color-gray-600);--dh-color-input-active-bg: var(--dh-color-input-bg);--dh-color-input-disabled-bg: var(--dh-color-disabled-bg);--dh-color-input-disabled-border: transparent;--dh-color-input-disabled-fg: var(--dh-color-text-disabled);--dh-color-input-hover-border: var(--dh-color-hover-border);--dh-color-input-focus-border: var(--dh-color-border-focus);--dh-color-search-icon: var(--dh-color-fg);--dh-color-form-control-error: var(--dh-color-visual-negative);--dh-color-form-control-error-shadow: color-mix( in srgb, var(--dh-color-visual-negative) 25%, transparent );--dh-color-label-text: var(--dh-color-gray-700);--dh-color-selector-fg: var(--dh-color-icon-fg);--dh-color-selector-bg: var(--dh-color-gray-75);--dh-color-selector-hover-bg: var(--dh-color-gray-50);--dh-color-selector-hover-fg: var(--dh-color-gray-900);--dh-color-selector-disabled-fg: var(--dh-color-icon-disabled-fg);--dh-color-item-list-bg: transparent;--dh-color-item-list-active-bg: var(--dh-color-highlight-active);--dh-color-item-list-hover-bg: var(--dh-color-highlight-hover);--dh-color-item-list-selected-fg: var(--dh-color-text);--dh-color-item-list-selected-bg: var(--dh-color-highlight-selected);--dh-color-item-list-selected-hover-bg: var( --dh-color-highlight-selected-hover );--dh-color-item-list-selected-inactive-bg: var(--dh-color-gray-200);--dh-color-item-list-selected-border: var(--dh-color-accent-900);--dh-color-item-list-drop-target-fg: var(--dh-color-white);--dh-color-item-list-keyboard-selected-bg: color-mix( in srgb, var(--dh-color-accent) 50%, transparent );--dh-color-golden-layout-tab-header-bg: var(--dh-color-gray-75);--dh-color-golden-layout-tab-bg: var(--dh-color-gray-75);--dh-color-golden-layout-tab-selected-bg: var(--dh-color-content-bg);--dh-color-menu-item-fg: var(--dh-color-gray-700);--dh-color-hr: var(--dh-color-gray-300);--dh-color-dialog-title-fg: var(--dh-color-heading-text);--dh-color-dialog-fg: var(--dh-color-text);--dh-color-popover-bg: var(--dh-color-bg);--dh-color-tooltip-bg: var(--dh-color-gray-400);--dh-color-tooltip-fg: var(--dh-color-fg);--dh-color-tooltip-box-shadow: var(--dh-color-dropshadow);--dh-color-well-bg: color-mix( in srgb, var(--dh-color-visual-gray) 2%, transparent );--dh-color-well-border: color-mix( in srgb, var(--dh-color-visual-gray) 5%, transparent );--dh-toggle-switch-bg: var(--dh-color-gray-500)}/# sourceMappingURL=theme-dark-components.css.map /
1	+ :root{--dh-color-loading-spinner-primary: var(--dh-color-accent-bg);--dh-color-loading-spinner-secondary: color-mix( in srgb, var(--dh-color-gray-800) 50%, transparent );--dh-color-quickactions-bg: color-mix( in srgb, var(--dh-color-visual-gray) 90%, transparent );--dh-color-radial-reaction: color-mix( in srgb, var(--dh-color-visual-gray) 60%, transparent );--dh-color-colorpicker-border: color-mix( in srgb, var(--dh-color-visual-gray) 10%, transparent );--dh-logo-img: var(--dh-logo-dark-img);--dh-color-login-form-bg: var(--dh-color-gray-400);--dh-color-login-status-message: var(--dh-color-gray-600);--dh-color-login-logo-bg: var(--dh-color-gray-900);--dh-color-login-footer-fg: var(--dh-color-gray-700);--dh-color-random-area-plot-animation-fg-fill: color-mix( in srgb, var(--dh-color-accent) 8%, transparent );--dh-color-random-area-plot-animation-fg-stroke: color-mix( in srgb, var(--dh-color-accent) 20%, transparent );--dh-color-random-area-plot-animation-bg: var(--dh-color-gray-75);--dh-color-random-area-plot-animation-grid: var(--dh-color-gray-300);--dh-color-action-bg: var(--dh-color-gray-75);--dh-color-action-fg: var(--dh-color-text);--dh-color-action-border: var(--dh-color-border);--dh-color-action-down-bg: var(--dh-color-gray-300);--dh-color-action-hover-bg: var(--dh-color-gray-50);--dh-color-action-hover-fg: var(--dh-color-text-hover);--dh-color-action-hover-border: var(--dh-color-hover-border);--dh-color-action-active-bg: var(--dh-color-gray-800);--dh-color-action-active-fg: var(--dh-color-gray-50);--dh-color-action-active-border: var(--dh-color-gray-800);--dh-color-action-active-hover-bg: var(--dh-color-gray-900);--dh-color-action-active-hover-fg: var(--dh-color-gray-50);--dh-color-action-active-hover-border: var(--dh-color-gray-900);--dh-color-action-disabled-bg: transparent;--dh-color-action-disabled-fg: var(--dh-color-text-disabled);--dh-color-action-disabled-border: var(--dh-color-gray-300);--dh-color-icon-fg: var(--dh-color-gray-700);--dh-color-icon-disabled-fg: var(--dh-color-gray-400);--dh-color-input-bg: var(--dh-color-gray-75);--dh-color-input-fg: var(--dh-color-text);--dh-color-input-border: var(--dh-color-border);--dh-color-input-placeholder: var(--dh-color-gray-600);--dh-color-input-active-bg: var(--dh-color-input-bg);--dh-color-input-disabled-bg: var(--dh-color-disabled-bg);--dh-color-input-disabled-border: transparent;--dh-color-input-disabled-fg: var(--dh-color-text-disabled);--dh-color-input-hover-border: var(--dh-color-hover-border);--dh-color-input-focus-border: var(--dh-color-border-focus);--dh-color-search-icon: var(--dh-color-fg);--dh-color-form-control-error: var(--dh-color-visual-negative);--dh-color-form-control-error-shadow: color-mix( in srgb, var(--dh-color-visual-negative) 25%, transparent );--dh-color-label-text: var(--dh-color-gray-700);--dh-color-selector-fg: var(--dh-color-icon-fg);--dh-color-selector-bg: var(--dh-color-gray-75);--dh-color-selector-hover-bg: var(--dh-color-gray-50);--dh-color-selector-hover-fg: var(--dh-color-gray-900);--dh-color-selector-disabled-fg: var(--dh-color-icon-disabled-fg);--dh-color-item-list-bg: transparent;--dh-color-item-list-active-bg: var(--dh-color-highlight-active);--dh-color-item-list-hover-bg: var(--dh-color-highlight-hover);--dh-color-item-list-selected-fg: var(--dh-color-text);--dh-color-item-list-selected-bg: var(--dh-color-highlight-selected);--dh-color-item-list-selected-hover-bg: var( --dh-color-highlight-selected-hover );--dh-color-item-list-selected-inactive-bg: var(--dh-color-gray-200);--dh-color-item-list-selected-border: var(--dh-color-accent-900);--dh-color-item-list-drop-target-fg: var(--dh-color-white);--dh-color-item-list-keyboard-selected-bg: color-mix( in srgb, var(--dh-color-accent) 50%, transparent );--dh-color-golden-layout-tab-header-bg: var(--dh-color-gray-75);--dh-color-golden-layout-tab-bg: var(--dh-color-gray-75);--dh-color-golden-layout-tab-selected-bg: var(--dh-color-content-bg);--dh-color-menu-item-fg: var(--dh-color-gray-700);--dh-color-hr: var(--dh-color-gray-300);--dh-color-dialog-title-fg: var(--dh-color-heading-text);--dh-color-dialog-fg: var(--dh-color-text);--dh-color-popover-bg: var(--dh-color-bg);--dh-color-popover-border: var(--dh-color-gray-400);--dh-color-tooltip-bg: var(--dh-color-gray-400);--dh-color-tooltip-fg: var(--dh-color-fg);--dh-color-tooltip-box-shadow: var(--dh-color-dropshadow);--dh-color-well-bg: color-mix( in srgb, var(--dh-color-visual-gray) 2%, transparent );--dh-color-well-border: color-mix( in srgb, var(--dh-color-visual-gray) 5%, transparent );--dh-toggle-switch-bg: var(--dh-color-gray-500)}/# sourceMappingURL=theme-dark-components.css.map /

package/dist/theme/theme-dark/theme-dark-components.css.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sourceRoot":"","sources":["../../../src/theme/theme-dark/theme-dark-components.css"],"names":[],"mappings":"AAEA,MACE,8DACA,sGAKA,+FAKA,+FAKA,kGAOA,uCAGA,mDACA,0DACA,mDACA,qDAIA,4GAKA,+GAKA,kEACA,qEAGA,8CACA,2CACA,iDAEA,oDAEA,oDACA,uDACA,6DAEA,sDACA,qDACA,0DAEA,4DACA,2DACA,gEAEA,2CACA,6DACA,4DAGA,6CACA,sDAGA,6CACA,0CACA,gDACA,uDACA,qDACA,0DACA,8CACA,4DACA,4DACA,4DAGA,2CACA,+DACA,6GAOA,gDAGA,gDACA,gDACA,sDACA,uDACA,kEAGA,qCACA,iEACA,+DACA,uDACA,qEACA,mFAGA,oEACA,iEACA,2DAEA,yGAeA,gEACA,yDACA,qEAGA,kDAGA,wCAGA,yDACA,2CAGA,~~0CAGA~~,gDACA,0CACA,0DAGA,sFAKA,0FAOA","file":"theme-dark-components.css","sourcesContent":["/* stylelint-disable custom-property-empty-line-before /\n/ stylelint-disable alpha-value-notation /\n:root {\n --dh-color-loading-spinner-primary: var(--dh-color-accent-bg);\n --dh-color-loading-spinner-secondary: color-mix(\n in srgb,\n var(--dh-color-gray-800) 50%,\n transparent\n );\n --dh-color-quickactions-bg: color-mix(\n in srgb,\n var(--dh-color-visual-gray) 90%,\n transparent\n );\n --dh-color-radial-reaction: color-mix(\n in srgb,\n var(--dh-color-visual-gray) 60%,\n transparent\n );\n --dh-color-colorpicker-border: color-mix(\n in srgb,\n var(--dh-color-visual-gray) 10%,\n transparent\n );\n\n / Logo /\n --dh-logo-img: var(--dh-logo-dark-img);\n\n / Login /\n --dh-color-login-form-bg: var(--dh-color-gray-400);\n --dh-color-login-status-message: var(--dh-color-gray-600);\n --dh-color-login-logo-bg: var(--dh-color-gray-900);\n --dh-color-login-footer-fg: var(--dh-color-gray-700);\n\n / We should base this color on something from the palette, but for now just\n * hard coding the original value /\n --dh-color-random-area-plot-animation-fg-fill: color-mix(\n in srgb,\n var(--dh-color-accent) 8%,\n transparent\n );\n --dh-color-random-area-plot-animation-fg-stroke: color-mix(\n in srgb,\n var(--dh-color-accent) 20%,\n transparent\n );\n --dh-color-random-area-plot-animation-bg: var(--dh-color-gray-75);\n --dh-color-random-area-plot-animation-grid: var(--dh-color-gray-300);\n\n / Actions /\n --dh-color-action-bg: var(--dh-color-gray-75);\n --dh-color-action-fg: var(--dh-color-text);\n --dh-color-action-border: var(--dh-color-border);\n\n --dh-color-action-down-bg: var(--dh-color-gray-300);\n\n --dh-color-action-hover-bg: var(--dh-color-gray-50);\n --dh-color-action-hover-fg: var(--dh-color-text-hover);\n --dh-color-action-hover-border: var(--dh-color-hover-border);\n\n --dh-color-action-active-bg: var(--dh-color-gray-800);\n --dh-color-action-active-fg: var(--dh-color-gray-50);\n --dh-color-action-active-border: var(--dh-color-gray-800);\n\n --dh-color-action-active-hover-bg: var(--dh-color-gray-900);\n --dh-color-action-active-hover-fg: var(--dh-color-gray-50);\n --dh-color-action-active-hover-border: var(--dh-color-gray-900);\n\n --dh-color-action-disabled-bg: transparent;\n --dh-color-action-disabled-fg: var(--dh-color-text-disabled);\n --dh-color-action-disabled-border: var(--dh-color-gray-300);\n\n / Icons /\n --dh-color-icon-fg: var(--dh-color-gray-700);\n --dh-color-icon-disabled-fg: var(--dh-color-gray-400);\n\n / Inputs /\n --dh-color-input-bg: var(--dh-color-gray-75);\n --dh-color-input-fg: var(--dh-color-text);\n --dh-color-input-border: var(--dh-color-border);\n --dh-color-input-placeholder: var(--dh-color-gray-600);\n --dh-color-input-active-bg: var(--dh-color-input-bg);\n --dh-color-input-disabled-bg: var(--dh-color-disabled-bg);\n --dh-color-input-disabled-border: transparent;\n --dh-color-input-disabled-fg: var(--dh-color-text-disabled);\n --dh-color-input-hover-border: var(--dh-color-hover-border);\n --dh-color-input-focus-border: var(--dh-color-border-focus);\n\n / Form Controls /\n --dh-color-search-icon: var(--dh-color-fg);\n --dh-color-form-control-error: var(--dh-color-visual-negative);\n --dh-color-form-control-error-shadow: color-mix(\n in srgb,\n var(--dh-color-visual-negative) 25%,\n transparent\n );\n\n / Labels /\n --dh-color-label-text: var(--dh-color-gray-700);\n\n / Selectors (pickers, dropdowns, select, etc.) /\n --dh-color-selector-fg: var(--dh-color-icon-fg);\n --dh-color-selector-bg: var(--dh-color-gray-75);\n --dh-color-selector-hover-bg: var(--dh-color-gray-50);\n --dh-color-selector-hover-fg: var(--dh-color-gray-900);\n --dh-color-selector-disabled-fg: var(--dh-color-icon-disabled-fg);\n\n / Item List /\n --dh-color-item-list-bg: transparent;\n --dh-color-item-list-active-bg: var(--dh-color-highlight-active);\n --dh-color-item-list-hover-bg: var(--dh-color-highlight-hover);\n --dh-color-item-list-selected-fg: var(--dh-color-text);\n --dh-color-item-list-selected-bg: var(--dh-color-highlight-selected);\n --dh-color-item-list-selected-hover-bg: var(\n --dh-color-highlight-selected-hover\n );\n --dh-color-item-list-selected-inactive-bg: var(--dh-color-gray-200);\n --dh-color-item-list-selected-border: var(--dh-color-accent-900);\n --dh-color-item-list-drop-target-fg: var(--dh-color-white);\n\n --dh-color-item-list-keyboard-selected-bg: color-mix(\n in srgb,\n var(--dh-color-accent) 50%,\n transparent\n );\n\n / \n * There are a couple of related variables used in Enterprise SingleClickItemList.\n * that aren't consumed in DHC. We should see if there is a way to include these\n * in the theming variables.\n * --dh-color-item-list-keyboard-selected-border\n * --dh-color-item-list-keyboard-selected-hover-bg\n /\n\n / Golden Layout /\n --dh-color-golden-layout-tab-header-bg: var(--dh-color-gray-75);\n --dh-color-golden-layout-tab-bg: var(--dh-color-gray-75);\n --dh-color-golden-layout-tab-selected-bg: var(--dh-color-content-bg);\n\n / Navigation Menu /\n --dh-color-menu-item-fg: var(--dh-color-gray-700);\n\n / Hr /\n --dh-color-hr: var(--dh-color-gray-300);\n\n / Dialogs /\n --dh-color-dialog-title-fg: var(--dh-color-heading-text);\n --dh-color-dialog-fg: var(--dh-color-text);\n\n / Popovers /\n --dh-color-popover-bg: var(--dh-color-bg);\n\n / Tooltips /\n --dh-color-tooltip-bg: var(--dh-color-gray-400);\n --dh-color-tooltip-fg: var(--dh-color-fg);\n --dh-color-tooltip-box-shadow: var(--dh-color-dropshadow);\n\n / Wells /\n --dh-color-well-bg: color-mix(\n in srgb,\n var(--dh-color-visual-gray) 2%,\n transparent\n );\n --dh-color-well-border: color-mix(\n in srgb,\n var(--dh-color-visual-gray) 5%,\n transparent\n );\n\n / Switch */\n --dh-toggle-switch-bg: var(--dh-color-gray-500);\n}\n"]}
1	+ {"version":3,"sourceRoot":"","sources":["../../../src/theme/theme-dark/theme-dark-components.css"],"names":[],"mappings":"AAEA,MACE,8DACA,sGAKA,+FAKA,+FAKA,kGAOA,uCAGA,mDACA,0DACA,mDACA,qDAIA,4GAKA,+GAKA,kEACA,qEAGA,8CACA,2CACA,iDAEA,oDAEA,oDACA,uDACA,6DAEA,sDACA,qDACA,0DAEA,4DACA,2DACA,gEAEA,2CACA,6DACA,4DAGA,6CACA,sDAGA,6CACA,0CACA,gDACA,uDACA,qDACA,0DACA,8CACA,4DACA,4DACA,4DAGA,2CACA,+DACA,6GAOA,gDAGA,gDACA,gDACA,sDACA,uDACA,kEAGA,qCACA,iEACA,+DACA,uDACA,qEACA,mFAGA,oEACA,iEACA,2DAEA,yGAeA,gEACA,yDACA,qEAGA,kDAGA,wCAGA,yDACA,2CAGA,0CACA,oDAGA,gDACA,0CACA,0DAGA,sFAKA,0FAOA","file":"theme-dark-components.css","sourcesContent":["/* stylelint-disable custom-property-empty-line-before /\n/ stylelint-disable alpha-value-notation /\n:root {\n --dh-color-loading-spinner-primary: var(--dh-color-accent-bg);\n --dh-color-loading-spinner-secondary: color-mix(\n in srgb,\n var(--dh-color-gray-800) 50%,\n transparent\n );\n --dh-color-quickactions-bg: color-mix(\n in srgb,\n var(--dh-color-visual-gray) 90%,\n transparent\n );\n --dh-color-radial-reaction: color-mix(\n in srgb,\n var(--dh-color-visual-gray) 60%,\n transparent\n );\n --dh-color-colorpicker-border: color-mix(\n in srgb,\n var(--dh-color-visual-gray) 10%,\n transparent\n );\n\n / Logo /\n --dh-logo-img: var(--dh-logo-dark-img);\n\n / Login /\n --dh-color-login-form-bg: var(--dh-color-gray-400);\n --dh-color-login-status-message: var(--dh-color-gray-600);\n --dh-color-login-logo-bg: var(--dh-color-gray-900);\n --dh-color-login-footer-fg: var(--dh-color-gray-700);\n\n / We should base this color on something from the palette, but for now just\n * hard coding the original value /\n --dh-color-random-area-plot-animation-fg-fill: color-mix(\n in srgb,\n var(--dh-color-accent) 8%,\n transparent\n );\n --dh-color-random-area-plot-animation-fg-stroke: color-mix(\n in srgb,\n var(--dh-color-accent) 20%,\n transparent\n );\n --dh-color-random-area-plot-animation-bg: var(--dh-color-gray-75);\n --dh-color-random-area-plot-animation-grid: var(--dh-color-gray-300);\n\n / Actions /\n --dh-color-action-bg: var(--dh-color-gray-75);\n --dh-color-action-fg: var(--dh-color-text);\n --dh-color-action-border: var(--dh-color-border);\n\n --dh-color-action-down-bg: var(--dh-color-gray-300);\n\n --dh-color-action-hover-bg: var(--dh-color-gray-50);\n --dh-color-action-hover-fg: var(--dh-color-text-hover);\n --dh-color-action-hover-border: var(--dh-color-hover-border);\n\n --dh-color-action-active-bg: var(--dh-color-gray-800);\n --dh-color-action-active-fg: var(--dh-color-gray-50);\n --dh-color-action-active-border: var(--dh-color-gray-800);\n\n --dh-color-action-active-hover-bg: var(--dh-color-gray-900);\n --dh-color-action-active-hover-fg: var(--dh-color-gray-50);\n --dh-color-action-active-hover-border: var(--dh-color-gray-900);\n\n --dh-color-action-disabled-bg: transparent;\n --dh-color-action-disabled-fg: var(--dh-color-text-disabled);\n --dh-color-action-disabled-border: var(--dh-color-gray-300);\n\n / Icons /\n --dh-color-icon-fg: var(--dh-color-gray-700);\n --dh-color-icon-disabled-fg: var(--dh-color-gray-400);\n\n / Inputs /\n --dh-color-input-bg: var(--dh-color-gray-75);\n --dh-color-input-fg: var(--dh-color-text);\n --dh-color-input-border: var(--dh-color-border);\n --dh-color-input-placeholder: var(--dh-color-gray-600);\n --dh-color-input-active-bg: var(--dh-color-input-bg);\n --dh-color-input-disabled-bg: var(--dh-color-disabled-bg);\n --dh-color-input-disabled-border: transparent;\n --dh-color-input-disabled-fg: var(--dh-color-text-disabled);\n --dh-color-input-hover-border: var(--dh-color-hover-border);\n --dh-color-input-focus-border: var(--dh-color-border-focus);\n\n / Form Controls /\n --dh-color-search-icon: var(--dh-color-fg);\n --dh-color-form-control-error: var(--dh-color-visual-negative);\n --dh-color-form-control-error-shadow: color-mix(\n in srgb,\n var(--dh-color-visual-negative) 25%,\n transparent\n );\n\n / Labels /\n --dh-color-label-text: var(--dh-color-gray-700);\n\n / Selectors (pickers, dropdowns, select, etc.) /\n --dh-color-selector-fg: var(--dh-color-icon-fg);\n --dh-color-selector-bg: var(--dh-color-gray-75);\n --dh-color-selector-hover-bg: var(--dh-color-gray-50);\n --dh-color-selector-hover-fg: var(--dh-color-gray-900);\n --dh-color-selector-disabled-fg: var(--dh-color-icon-disabled-fg);\n\n / Item List /\n --dh-color-item-list-bg: transparent;\n --dh-color-item-list-active-bg: var(--dh-color-highlight-active);\n --dh-color-item-list-hover-bg: var(--dh-color-highlight-hover);\n --dh-color-item-list-selected-fg: var(--dh-color-text);\n --dh-color-item-list-selected-bg: var(--dh-color-highlight-selected);\n --dh-color-item-list-selected-hover-bg: var(\n --dh-color-highlight-selected-hover\n );\n --dh-color-item-list-selected-inactive-bg: var(--dh-color-gray-200);\n --dh-color-item-list-selected-border: var(--dh-color-accent-900);\n --dh-color-item-list-drop-target-fg: var(--dh-color-white);\n\n --dh-color-item-list-keyboard-selected-bg: color-mix(\n in srgb,\n var(--dh-color-accent) 50%,\n transparent\n );\n\n / \n * There are a couple of related variables used in Enterprise SingleClickItemList.\n * that aren't consumed in DHC. We should see if there is a way to include these\n * in the theming variables.\n * --dh-color-item-list-keyboard-selected-border\n * --dh-color-item-list-keyboard-selected-hover-bg\n /\n\n / Golden Layout /\n --dh-color-golden-layout-tab-header-bg: var(--dh-color-gray-75);\n --dh-color-golden-layout-tab-bg: var(--dh-color-gray-75);\n --dh-color-golden-layout-tab-selected-bg: var(--dh-color-content-bg);\n\n / Navigation Menu /\n --dh-color-menu-item-fg: var(--dh-color-gray-700);\n\n / Hr /\n --dh-color-hr: var(--dh-color-gray-300);\n\n / Dialogs /\n --dh-color-dialog-title-fg: var(--dh-color-heading-text);\n --dh-color-dialog-fg: var(--dh-color-text);\n\n / Popovers /\n --dh-color-popover-bg: var(--dh-color-bg);\n --dh-color-popover-border: var(--dh-color-gray-400);\n\n / Tooltips /\n --dh-color-tooltip-bg: var(--dh-color-gray-400);\n --dh-color-tooltip-fg: var(--dh-color-fg);\n --dh-color-tooltip-box-shadow: var(--dh-color-dropshadow);\n\n / Wells /\n --dh-color-well-bg: color-mix(\n in srgb,\n var(--dh-color-visual-gray) 2%,\n transparent\n );\n --dh-color-well-border: color-mix(\n in srgb,\n var(--dh-color-visual-gray) 5%,\n transparent\n );\n\n / Switch */\n --dh-toggle-switch-bg: var(--dh-color-gray-500);\n}\n"]}

package/dist/theme/theme-light/theme-light-components.css CHANGED Viewed

	@@ -1 +1 @@
1	- :root{--dh-color-loading-spinner-primary: var(--dh-color-accent-bg);--dh-color-loading-spinner-secondary: color-mix( in srgb, var(--dh-color-gray-800) 50%, transparent );--dh-color-quickactions-bg: color-mix( in srgb, var(--dh-color-visual-gray) 90%, transparent );--dh-color-radial-reaction: color-mix( in srgb, var(--dh-color-visual-gray) 60%, transparent );--dh-color-colorpicker-border: color-mix( in srgb, var(--dh-color-visual-gray) 10%, transparent );--dh-logo-img: var(--dh-logo-light-img);--dh-color-login-form-bg: var(--dh-color-gray-200);--dh-color-login-status-message: var(--dh-color-gray-600);--dh-color-login-logo-bg: var(--dh-color-gray-50);--dh-color-login-footer-fg: var(--dh-color-gray-700);--dh-color-random-area-plot-animation-fg-fill: color-mix( in srgb, var(--dh-color-accent) 8%, transparent );--dh-color-random-area-plot-animation-fg-stroke: color-mix( in srgb, var(--dh-color-accent) 20%, transparent );--dh-color-random-area-plot-animation-bg: var(--dh-color-gray-75);--dh-color-random-area-plot-animation-grid: var(--dh-color-gray-300);--dh-color-action-bg: var(--dh-color-gray-75);--dh-color-action-fg: var(--dh-color-text);--dh-color-action-border: var(--dh-color-border);--dh-color-action-down-bg: var(--dh-color-gray-300);--dh-color-action-hover-bg: var(--dh-color-gray-50);--dh-color-action-hover-fg: var(--dh-color-text-hover);--dh-color-action-hover-border: var(--dh-color-hover-border);--dh-color-action-active-bg: var(--dh-color-accent-bg);--dh-color-action-active-fg: var(--dh-color-accent-contrast);--dh-color-action-active-border: var(--dh-color-accent-bg);--dh-color-action-active-hover-bg: var(--dh-color-accent-hover-bg);--dh-color-action-active-hover-fg: var(--dh-color-accent-contrast);--dh-color-action-active-hover-border: var(--dh-color-accent-hover-bg);--dh-color-action-disabled-bg: transparent;--dh-color-action-disabled-fg: var(--dh-color-text-disabled);--dh-color-action-disabled-border: var(--dh-color-gray-300);--dh-color-icon-fg: var(--dh-color-gray-700);--dh-color-icon-disabled-fg: var(--dh-color-gray-400);--dh-color-input-bg: var(--dh-color-gray-50);--dh-color-input-fg: var(--dh-color-text);--dh-color-input-border: var(--dh-color-border);--dh-color-input-placeholder: var(--dh-color-gray-600);--dh-color-input-active-bg: var(--dh-color-input-bg);--dh-color-input-disabled-bg: var(--dh-color-disabled-bg);--dh-color-input-disabled-border: transparent;--dh-color-input-disabled-fg: var(--dh-color-text-disabled);--dh-color-input-hover-border: var(--dh-color-hover-border);--dh-color-input-focus-border: var(--dh-color-border-focus);--dh-color-search-icon: var(--dh-color-fg);--dh-color-form-control-error: var(--dh-color-visual-negative);--dh-color-form-control-error-shadow: color-mix( in srgb, var(--dh-color-visual-negative) 25%, transparent );--dh-color-label-text: var(--dh-color-gray-700);--dh-color-selector-fg: var(--dh-color-icon-fg);--dh-color-selector-bg: var(--dh-color-gray-75);--dh-color-selector-hover-bg: var(--dh-color-gray-50);--dh-color-selector-hover-fg: var(--dh-color-gray-900);--dh-color-selector-disabled-fg: var(--dh-color-icon-disabled-fg);--dh-color-item-list-bg: transparent;--dh-color-item-list-active-bg: var(--dh-color-highlight-active);--dh-color-item-list-hover-bg: var(--dh-color-highlight-hover);--dh-color-item-list-selected-fg: var(--dh-color-text);--dh-color-item-list-selected-bg: var(--dh-color-highlight-selected);--dh-color-item-list-selected-hover-bg: var( --dh-color-highlight-selected-hover );--dh-color-item-list-selected-inactive-bg: var(--dh-color-gray-300);--dh-color-item-list-selected-border: var(--dh-color-accent-900);--dh-color-item-list-drop-target-fg: var(--dh-color-white);--dh-color-item-list-keyboard-selected-bg: color-mix( in srgb, var(--dh-color-accent) 50%, transparent );--dh-color-golden-layout-tab-header-bg: var(--dh-color-gray-200);--dh-color-golden-layout-tab-bg: var(--dh-color-gray-100);--dh-color-golden-layout-tab-selected-bg: var(--dh-color-content-bg);--dh-color-menu-item-fg: var(--dh-color-gray-700);--dh-color-hr: var(--dh-color-gray-300);--dh-color-dialog-title-fg: var(--dh-color-heading-text);--dh-color-dialog-fg: var(--dh-color-text);--dh-color-popover-bg: var(--dh-color-gray-50);--dh-color-tooltip-bg: var(--dh-color-gray-50);--dh-color-tooltip-fg: var(--dh-color-fg);--dh-color-tooltip-box-shadow: var(--dh-color-dropshadow);--dh-color-well-bg: color-mix(var(--dh-color-visual-gray) 2%, transparent);--dh-color-well-border: color-mix( in srgb, var(--dh-color-visual-gray) 5%, transparent );--dh-toggle-switch-bg: var(--dh-color-gray-400)}/# sourceMappingURL=theme-light-components.css.map /
1	+ :root{--dh-color-loading-spinner-primary: var(--dh-color-accent-bg);--dh-color-loading-spinner-secondary: color-mix( in srgb, var(--dh-color-gray-800) 50%, transparent );--dh-color-quickactions-bg: color-mix( in srgb, var(--dh-color-visual-gray) 90%, transparent );--dh-color-radial-reaction: color-mix( in srgb, var(--dh-color-visual-gray) 60%, transparent );--dh-color-colorpicker-border: color-mix( in srgb, var(--dh-color-visual-gray) 10%, transparent );--dh-logo-img: var(--dh-logo-light-img);--dh-color-login-form-bg: var(--dh-color-gray-200);--dh-color-login-status-message: var(--dh-color-gray-600);--dh-color-login-logo-bg: var(--dh-color-gray-50);--dh-color-login-footer-fg: var(--dh-color-gray-700);--dh-color-random-area-plot-animation-fg-fill: color-mix( in srgb, var(--dh-color-accent) 8%, transparent );--dh-color-random-area-plot-animation-fg-stroke: color-mix( in srgb, var(--dh-color-accent) 20%, transparent );--dh-color-random-area-plot-animation-bg: var(--dh-color-gray-75);--dh-color-random-area-plot-animation-grid: var(--dh-color-gray-300);--dh-color-action-bg: var(--dh-color-gray-75);--dh-color-action-fg: var(--dh-color-text);--dh-color-action-border: var(--dh-color-border);--dh-color-action-down-bg: var(--dh-color-gray-300);--dh-color-action-hover-bg: var(--dh-color-gray-50);--dh-color-action-hover-fg: var(--dh-color-text-hover);--dh-color-action-hover-border: var(--dh-color-hover-border);--dh-color-action-active-bg: var(--dh-color-accent-bg);--dh-color-action-active-fg: var(--dh-color-accent-contrast);--dh-color-action-active-border: var(--dh-color-accent-bg);--dh-color-action-active-hover-bg: var(--dh-color-accent-hover-bg);--dh-color-action-active-hover-fg: var(--dh-color-accent-contrast);--dh-color-action-active-hover-border: var(--dh-color-accent-hover-bg);--dh-color-action-disabled-bg: transparent;--dh-color-action-disabled-fg: var(--dh-color-text-disabled);--dh-color-action-disabled-border: var(--dh-color-gray-300);--dh-color-icon-fg: var(--dh-color-gray-700);--dh-color-icon-disabled-fg: var(--dh-color-gray-400);--dh-color-input-bg: var(--dh-color-gray-50);--dh-color-input-fg: var(--dh-color-text);--dh-color-input-border: var(--dh-color-border);--dh-color-input-placeholder: var(--dh-color-gray-600);--dh-color-input-active-bg: var(--dh-color-input-bg);--dh-color-input-disabled-bg: var(--dh-color-disabled-bg);--dh-color-input-disabled-border: transparent;--dh-color-input-disabled-fg: var(--dh-color-text-disabled);--dh-color-input-hover-border: var(--dh-color-hover-border);--dh-color-input-focus-border: var(--dh-color-border-focus);--dh-color-search-icon: var(--dh-color-fg);--dh-color-form-control-error: var(--dh-color-visual-negative);--dh-color-form-control-error-shadow: color-mix( in srgb, var(--dh-color-visual-negative) 25%, transparent );--dh-color-label-text: var(--dh-color-gray-700);--dh-color-selector-fg: var(--dh-color-icon-fg);--dh-color-selector-bg: var(--dh-color-gray-75);--dh-color-selector-hover-bg: var(--dh-color-gray-50);--dh-color-selector-hover-fg: var(--dh-color-gray-900);--dh-color-selector-disabled-fg: var(--dh-color-icon-disabled-fg);--dh-color-item-list-bg: transparent;--dh-color-item-list-active-bg: var(--dh-color-highlight-active);--dh-color-item-list-hover-bg: var(--dh-color-highlight-hover);--dh-color-item-list-selected-fg: var(--dh-color-text);--dh-color-item-list-selected-bg: var(--dh-color-highlight-selected);--dh-color-item-list-selected-hover-bg: var( --dh-color-highlight-selected-hover );--dh-color-item-list-selected-inactive-bg: var(--dh-color-gray-300);--dh-color-item-list-selected-border: var(--dh-color-accent-900);--dh-color-item-list-drop-target-fg: var(--dh-color-white);--dh-color-item-list-keyboard-selected-bg: color-mix( in srgb, var(--dh-color-accent) 50%, transparent );--dh-color-golden-layout-tab-header-bg: var(--dh-color-gray-200);--dh-color-golden-layout-tab-bg: var(--dh-color-gray-100);--dh-color-golden-layout-tab-selected-bg: var(--dh-color-content-bg);--dh-color-menu-item-fg: var(--dh-color-gray-700);--dh-color-hr: var(--dh-color-gray-300);--dh-color-dialog-title-fg: var(--dh-color-heading-text);--dh-color-dialog-fg: var(--dh-color-text);--dh-color-popover-bg: var(--dh-color-gray-50);--dh-color-popover-border: var(--dh-color-gray-400);--dh-color-tooltip-bg: var(--dh-color-gray-50);--dh-color-tooltip-fg: var(--dh-color-fg);--dh-color-tooltip-box-shadow: var(--dh-color-dropshadow);--dh-color-well-bg: color-mix(var(--dh-color-visual-gray) 2%, transparent);--dh-color-well-border: color-mix( in srgb, var(--dh-color-visual-gray) 5%, transparent );--dh-toggle-switch-bg: var(--dh-color-gray-400)}/# sourceMappingURL=theme-light-components.css.map /

package/dist/theme/theme-light/theme-light-components.css.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sourceRoot":"","sources":["../../../src/theme/theme-light/theme-light-components.css"],"names":[],"mappings":"AAEA,MACE,8DACA,sGAKA,+FAKA,+FAKA,kGAOA,wCAGA,mDACA,0DACA,kDACA,qDAIA,4GAKA,+GAKA,kEACA,qEAGA,8CACA,2CACA,iDAEA,oDAEA,oDACA,uDACA,6DAEA,uDACA,6DACA,2DAEA,mEACA,mEACA,uEAEA,2CACA,6DACA,4DAGA,6CACA,sDAGA,6CACA,0CACA,gDACA,uDACA,qDACA,0DACA,8CACA,4DACA,4DACA,4DAGA,2CACA,+DACA,6GAOA,gDAGA,gDACA,gDACA,sDACA,uDACA,kEAGA,qCACA,iEACA,+DACA,uDACA,qEACA,mFAGA,oEACA,iEACA,2DAEA,yGAeA,iEACA,0DACA,qEAGA,kDAGA,wCAGA,yDACA,2CAGA,+~~CAGA~~,+CACA,0CACA,0DAGA,2EACA,0FAOA","file":"theme-light-components.css","sourcesContent":["/* stylelint-disable custom-property-empty-line-before /\n/ stylelint-disable alpha-value-notation /\n:root {\n --dh-color-loading-spinner-primary: var(--dh-color-accent-bg);\n --dh-color-loading-spinner-secondary: color-mix(\n in srgb,\n var(--dh-color-gray-800) 50%,\n transparent\n );\n --dh-color-quickactions-bg: color-mix(\n in srgb,\n var(--dh-color-visual-gray) 90%,\n transparent\n );\n --dh-color-radial-reaction: color-mix(\n in srgb,\n var(--dh-color-visual-gray) 60%,\n transparent\n );\n --dh-color-colorpicker-border: color-mix(\n in srgb,\n var(--dh-color-visual-gray) 10%,\n transparent\n );\n\n / Logo /\n --dh-logo-img: var(--dh-logo-light-img);\n\n / Login /\n --dh-color-login-form-bg: var(--dh-color-gray-200);\n --dh-color-login-status-message: var(--dh-color-gray-600);\n --dh-color-login-logo-bg: var(--dh-color-gray-50);\n --dh-color-login-footer-fg: var(--dh-color-gray-700);\n\n / We should base this color on something from the palette, but for now just\n * hard coding the original value /\n --dh-color-random-area-plot-animation-fg-fill: color-mix(\n in srgb,\n var(--dh-color-accent) 8%,\n transparent\n );\n --dh-color-random-area-plot-animation-fg-stroke: color-mix(\n in srgb,\n var(--dh-color-accent) 20%,\n transparent\n );\n --dh-color-random-area-plot-animation-bg: var(--dh-color-gray-75);\n --dh-color-random-area-plot-animation-grid: var(--dh-color-gray-300);\n\n / Actions /\n --dh-color-action-bg: var(--dh-color-gray-75);\n --dh-color-action-fg: var(--dh-color-text);\n --dh-color-action-border: var(--dh-color-border);\n\n --dh-color-action-down-bg: var(--dh-color-gray-300);\n\n --dh-color-action-hover-bg: var(--dh-color-gray-50);\n --dh-color-action-hover-fg: var(--dh-color-text-hover);\n --dh-color-action-hover-border: var(--dh-color-hover-border);\n\n --dh-color-action-active-bg: var(--dh-color-accent-bg);\n --dh-color-action-active-fg: var(--dh-color-accent-contrast);\n --dh-color-action-active-border: var(--dh-color-accent-bg);\n\n --dh-color-action-active-hover-bg: var(--dh-color-accent-hover-bg);\n --dh-color-action-active-hover-fg: var(--dh-color-accent-contrast);\n --dh-color-action-active-hover-border: var(--dh-color-accent-hover-bg);\n\n --dh-color-action-disabled-bg: transparent;\n --dh-color-action-disabled-fg: var(--dh-color-text-disabled);\n --dh-color-action-disabled-border: var(--dh-color-gray-300);\n\n / Icons /\n --dh-color-icon-fg: var(--dh-color-gray-700);\n --dh-color-icon-disabled-fg: var(--dh-color-gray-400);\n\n / Inputs /\n --dh-color-input-bg: var(--dh-color-gray-50);\n --dh-color-input-fg: var(--dh-color-text);\n --dh-color-input-border: var(--dh-color-border);\n --dh-color-input-placeholder: var(--dh-color-gray-600);\n --dh-color-input-active-bg: var(--dh-color-input-bg);\n --dh-color-input-disabled-bg: var(--dh-color-disabled-bg);\n --dh-color-input-disabled-border: transparent;\n --dh-color-input-disabled-fg: var(--dh-color-text-disabled);\n --dh-color-input-hover-border: var(--dh-color-hover-border);\n --dh-color-input-focus-border: var(--dh-color-border-focus);\n\n / Form Controls /\n --dh-color-search-icon: var(--dh-color-fg);\n --dh-color-form-control-error: var(--dh-color-visual-negative);\n --dh-color-form-control-error-shadow: color-mix(\n in srgb,\n var(--dh-color-visual-negative) 25%,\n transparent\n );\n\n / Labels /\n --dh-color-label-text: var(--dh-color-gray-700);\n\n / Selectors (pickers, dropdowns, select, etc.) /\n --dh-color-selector-fg: var(--dh-color-icon-fg);\n --dh-color-selector-bg: var(--dh-color-gray-75);\n --dh-color-selector-hover-bg: var(--dh-color-gray-50);\n --dh-color-selector-hover-fg: var(--dh-color-gray-900);\n --dh-color-selector-disabled-fg: var(--dh-color-icon-disabled-fg);\n\n / Item List /\n --dh-color-item-list-bg: transparent;\n --dh-color-item-list-active-bg: var(--dh-color-highlight-active);\n --dh-color-item-list-hover-bg: var(--dh-color-highlight-hover);\n --dh-color-item-list-selected-fg: var(--dh-color-text);\n --dh-color-item-list-selected-bg: var(--dh-color-highlight-selected);\n --dh-color-item-list-selected-hover-bg: var(\n --dh-color-highlight-selected-hover\n );\n --dh-color-item-list-selected-inactive-bg: var(--dh-color-gray-300);\n --dh-color-item-list-selected-border: var(--dh-color-accent-900);\n --dh-color-item-list-drop-target-fg: var(--dh-color-white);\n\n --dh-color-item-list-keyboard-selected-bg: color-mix(\n in srgb,\n var(--dh-color-accent) 50%,\n transparent\n );\n\n / \n * There are a couple of related variables used in Enterprise SingleClickItemList.\n * that aren't consumed in DHC. We should see if there is a way to include these\n * in the theming variables.\n * --dh-color-item-list-keyboard-selected-border\n * --dh-color-item-list-keyboard-selected-hover-bg\n /\n\n / Golden Layout /\n --dh-color-golden-layout-tab-header-bg: var(--dh-color-gray-200);\n --dh-color-golden-layout-tab-bg: var(--dh-color-gray-100);\n --dh-color-golden-layout-tab-selected-bg: var(--dh-color-content-bg);\n\n / Navigation Menu /\n --dh-color-menu-item-fg: var(--dh-color-gray-700);\n\n / Hr /\n --dh-color-hr: var(--dh-color-gray-300);\n\n / Dialogs /\n --dh-color-dialog-title-fg: var(--dh-color-heading-text);\n --dh-color-dialog-fg: var(--dh-color-text);\n\n / Popovers /\n --dh-color-popover-bg: var(--dh-color-gray-50);\n\n / Tooltips /\n --dh-color-tooltip-bg: var(--dh-color-gray-50);\n --dh-color-tooltip-fg: var(--dh-color-fg);\n --dh-color-tooltip-box-shadow: var(--dh-color-dropshadow);\n\n / Wells /\n --dh-color-well-bg: color-mix(var(--dh-color-visual-gray) 2%, transparent);\n --dh-color-well-border: color-mix(\n in srgb,\n var(--dh-color-visual-gray) 5%,\n transparent\n );\n\n / Switch */\n --dh-toggle-switch-bg: var(--dh-color-gray-400);\n}\n"]}
1	+ {"version":3,"sourceRoot":"","sources":["../../../src/theme/theme-light/theme-light-components.css"],"names":[],"mappings":"AAEA,MACE,8DACA,sGAKA,+FAKA,+FAKA,kGAOA,wCAGA,mDACA,0DACA,kDACA,qDAIA,4GAKA,+GAKA,kEACA,qEAGA,8CACA,2CACA,iDAEA,oDAEA,oDACA,uDACA,6DAEA,uDACA,6DACA,2DAEA,mEACA,mEACA,uEAEA,2CACA,6DACA,4DAGA,6CACA,sDAGA,6CACA,0CACA,gDACA,uDACA,qDACA,0DACA,8CACA,4DACA,4DACA,4DAGA,2CACA,+DACA,6GAOA,gDAGA,gDACA,gDACA,sDACA,uDACA,kEAGA,qCACA,iEACA,+DACA,uDACA,qEACA,mFAGA,oEACA,iEACA,2DAEA,yGAeA,iEACA,0DACA,qEAGA,kDAGA,wCAGA,yDACA,2CAGA,+CACA,oDAGA,+CACA,0CACA,0DAGA,2EACA,0FAOA","file":"theme-light-components.css","sourcesContent":["/* stylelint-disable custom-property-empty-line-before /\n/ stylelint-disable alpha-value-notation /\n:root {\n --dh-color-loading-spinner-primary: var(--dh-color-accent-bg);\n --dh-color-loading-spinner-secondary: color-mix(\n in srgb,\n var(--dh-color-gray-800) 50%,\n transparent\n );\n --dh-color-quickactions-bg: color-mix(\n in srgb,\n var(--dh-color-visual-gray) 90%,\n transparent\n );\n --dh-color-radial-reaction: color-mix(\n in srgb,\n var(--dh-color-visual-gray) 60%,\n transparent\n );\n --dh-color-colorpicker-border: color-mix(\n in srgb,\n var(--dh-color-visual-gray) 10%,\n transparent\n );\n\n / Logo /\n --dh-logo-img: var(--dh-logo-light-img);\n\n / Login /\n --dh-color-login-form-bg: var(--dh-color-gray-200);\n --dh-color-login-status-message: var(--dh-color-gray-600);\n --dh-color-login-logo-bg: var(--dh-color-gray-50);\n --dh-color-login-footer-fg: var(--dh-color-gray-700);\n\n / We should base this color on something from the palette, but for now just\n * hard coding the original value /\n --dh-color-random-area-plot-animation-fg-fill: color-mix(\n in srgb,\n var(--dh-color-accent) 8%,\n transparent\n );\n --dh-color-random-area-plot-animation-fg-stroke: color-mix(\n in srgb,\n var(--dh-color-accent) 20%,\n transparent\n );\n --dh-color-random-area-plot-animation-bg: var(--dh-color-gray-75);\n --dh-color-random-area-plot-animation-grid: var(--dh-color-gray-300);\n\n / Actions /\n --dh-color-action-bg: var(--dh-color-gray-75);\n --dh-color-action-fg: var(--dh-color-text);\n --dh-color-action-border: var(--dh-color-border);\n\n --dh-color-action-down-bg: var(--dh-color-gray-300);\n\n --dh-color-action-hover-bg: var(--dh-color-gray-50);\n --dh-color-action-hover-fg: var(--dh-color-text-hover);\n --dh-color-action-hover-border: var(--dh-color-hover-border);\n\n --dh-color-action-active-bg: var(--dh-color-accent-bg);\n --dh-color-action-active-fg: var(--dh-color-accent-contrast);\n --dh-color-action-active-border: var(--dh-color-accent-bg);\n\n --dh-color-action-active-hover-bg: var(--dh-color-accent-hover-bg);\n --dh-color-action-active-hover-fg: var(--dh-color-accent-contrast);\n --dh-color-action-active-hover-border: var(--dh-color-accent-hover-bg);\n\n --dh-color-action-disabled-bg: transparent;\n --dh-color-action-disabled-fg: var(--dh-color-text-disabled);\n --dh-color-action-disabled-border: var(--dh-color-gray-300);\n\n / Icons /\n --dh-color-icon-fg: var(--dh-color-gray-700);\n --dh-color-icon-disabled-fg: var(--dh-color-gray-400);\n\n / Inputs /\n --dh-color-input-bg: var(--dh-color-gray-50);\n --dh-color-input-fg: var(--dh-color-text);\n --dh-color-input-border: var(--dh-color-border);\n --dh-color-input-placeholder: var(--dh-color-gray-600);\n --dh-color-input-active-bg: var(--dh-color-input-bg);\n --dh-color-input-disabled-bg: var(--dh-color-disabled-bg);\n --dh-color-input-disabled-border: transparent;\n --dh-color-input-disabled-fg: var(--dh-color-text-disabled);\n --dh-color-input-hover-border: var(--dh-color-hover-border);\n --dh-color-input-focus-border: var(--dh-color-border-focus);\n\n / Form Controls /\n --dh-color-search-icon: var(--dh-color-fg);\n --dh-color-form-control-error: var(--dh-color-visual-negative);\n --dh-color-form-control-error-shadow: color-mix(\n in srgb,\n var(--dh-color-visual-negative) 25%,\n transparent\n );\n\n / Labels /\n --dh-color-label-text: var(--dh-color-gray-700);\n\n / Selectors (pickers, dropdowns, select, etc.) /\n --dh-color-selector-fg: var(--dh-color-icon-fg);\n --dh-color-selector-bg: var(--dh-color-gray-75);\n --dh-color-selector-hover-bg: var(--dh-color-gray-50);\n --dh-color-selector-hover-fg: var(--dh-color-gray-900);\n --dh-color-selector-disabled-fg: var(--dh-color-icon-disabled-fg);\n\n / Item List /\n --dh-color-item-list-bg: transparent;\n --dh-color-item-list-active-bg: var(--dh-color-highlight-active);\n --dh-color-item-list-hover-bg: var(--dh-color-highlight-hover);\n --dh-color-item-list-selected-fg: var(--dh-color-text);\n --dh-color-item-list-selected-bg: var(--dh-color-highlight-selected);\n --dh-color-item-list-selected-hover-bg: var(\n --dh-color-highlight-selected-hover\n );\n --dh-color-item-list-selected-inactive-bg: var(--dh-color-gray-300);\n --dh-color-item-list-selected-border: var(--dh-color-accent-900);\n --dh-color-item-list-drop-target-fg: var(--dh-color-white);\n\n --dh-color-item-list-keyboard-selected-bg: color-mix(\n in srgb,\n var(--dh-color-accent) 50%,\n transparent\n );\n\n / \n * There are a couple of related variables used in Enterprise SingleClickItemList.\n * that aren't consumed in DHC. We should see if there is a way to include these\n * in the theming variables.\n * --dh-color-item-list-keyboard-selected-border\n * --dh-color-item-list-keyboard-selected-hover-bg\n /\n\n / Golden Layout /\n --dh-color-golden-layout-tab-header-bg: var(--dh-color-gray-200);\n --dh-color-golden-layout-tab-bg: var(--dh-color-gray-100);\n --dh-color-golden-layout-tab-selected-bg: var(--dh-color-content-bg);\n\n / Navigation Menu /\n --dh-color-menu-item-fg: var(--dh-color-gray-700);\n\n / Hr /\n --dh-color-hr: var(--dh-color-gray-300);\n\n / Dialogs /\n --dh-color-dialog-title-fg: var(--dh-color-heading-text);\n --dh-color-dialog-fg: var(--dh-color-text);\n\n / Popovers /\n --dh-color-popover-bg: var(--dh-color-gray-50);\n --dh-color-popover-border: var(--dh-color-gray-400);\n\n / Tooltips /\n --dh-color-tooltip-bg: var(--dh-color-gray-50);\n --dh-color-tooltip-fg: var(--dh-color-fg);\n --dh-color-tooltip-box-shadow: var(--dh-color-dropshadow);\n\n / Wells /\n --dh-color-well-bg: color-mix(var(--dh-color-visual-gray) 2%, transparent);\n --dh-color-well-border: color-mix(\n in srgb,\n var(--dh-color-visual-gray) 5%,\n transparent\n );\n\n / Switch */\n --dh-toggle-switch-bg: var(--dh-color-gray-400);\n}\n"]}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@deephaven/components",
-  "version": "1.8.1-beta.8+f3eb5389",
+  "version": "1.9.0",
   "description": "Deephaven React component library",
   "author": "Deephaven Data Labs LLC",
   "license": "Apache-2.0",
@@ -25,10 +25,10 @@
   },
   "dependencies": {
     "@adobe/react-spectrum": "3.38.0",
-    "@deephaven/icons": "^1.8.1-beta.8+f3eb5389",
-    "@deephaven/log": "^1.8.1-beta.8+f3eb5389",
-    "@deephaven/react-hooks": "^1.8.1-beta.8+f3eb5389",
-    "@deephaven/utils": "^1.8.1-beta.8+f3eb5389",
+    "@deephaven/icons": "^1.2.0",
+    "@deephaven/log": "^1.8.0",
+    "@deephaven/react-hooks": "^1.8.0",
+    "@deephaven/utils": "^1.8.0",
     "@fontsource/fira-mono": "5.0.13",
     "@fontsource/fira-sans": "5.0.20",
     "@fortawesome/fontawesome-svg-core": "^6.2.1",
@@ -62,8 +62,8 @@
     "react-is": ">=16.8.0"
   },
   "devDependencies": {
-    "@deephaven/mocks": "^1.8.1-beta.8+f3eb5389",
-    "@deephaven/test-utils": "^1.8.1-beta.8+f3eb5389",
+    "@deephaven/mocks": "^1.1.0",
+    "@deephaven/test-utils": "^1.8.0",
     "react-redux": "^7.2.7"
   },
   "files": [
@@ -78,5 +78,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "f3eb5389531d00888d8846c12fc9f11aaed1f691"
+  "gitHead": "590def353bdddd4fa81dce63b150b4d15f1e50fe"
 }