@deephaven/components 0.71.1-beta.0 → 0.72.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 (39) hide show
  1. package/dist/Button.d.ts +1 -1
  2. package/dist/SearchInput.css +10 -12
  3. package/dist/SearchInput.css.map +1 -1
  4. package/dist/Select.d.ts +2 -1
  5. package/dist/Select.d.ts.map +1 -1
  6. package/dist/Select.js +5 -2
  7. package/dist/Select.js.map +1 -1
  8. package/dist/index.d.ts +0 -1
  9. package/dist/index.d.ts.map +1 -1
  10. package/dist/index.js +0 -1
  11. package/dist/index.js.map +1 -1
  12. package/dist/spectrum/index.js +1 -1
  13. package/dist/spectrum/picker/Picker.d.ts +6 -6
  14. package/dist/spectrum/picker/Picker.d.ts.map +1 -1
  15. package/dist/spectrum/picker/Picker.js +10 -9
  16. package/dist/spectrum/picker/Picker.js.map +1 -1
  17. package/dist/spectrum/picker/index.d.ts +1 -1
  18. package/dist/spectrum/picker/index.d.ts.map +1 -1
  19. package/dist/spectrum/picker/index.js +1 -1
  20. package/dist/spectrum/picker/index.js.map +1 -1
  21. package/dist/spectrum/utils/index.d.ts +3 -0
  22. package/dist/spectrum/utils/index.d.ts.map +1 -0
  23. package/dist/spectrum/utils/index.js +3 -0
  24. package/dist/spectrum/utils/index.js.map +1 -0
  25. package/dist/spectrum/utils/itemUtils.d.ts +111 -0
  26. package/dist/spectrum/utils/itemUtils.d.ts.map +1 -0
  27. package/dist/spectrum/{picker/PickerUtils.js → utils/itemUtils.js} +46 -45
  28. package/dist/spectrum/utils/itemUtils.js.map +1 -0
  29. package/dist/spectrum/{utils.d.ts → utils/themeUtils.d.ts} +2 -1
  30. package/dist/spectrum/utils/themeUtils.d.ts.map +1 -0
  31. package/dist/spectrum/{utils.js → utils/themeUtils.js} +3 -2
  32. package/dist/spectrum/utils/themeUtils.js.map +1 -0
  33. package/dist/theme/SpectrumThemeProvider.js +1 -1
  34. package/package.json +8 -7
  35. package/dist/spectrum/picker/PickerUtils.d.ts +0 -111
  36. package/dist/spectrum/picker/PickerUtils.d.ts.map +0 -1
  37. package/dist/spectrum/picker/PickerUtils.js.map +0 -1
  38. package/dist/spectrum/utils.d.ts.map +0 -1
  39. package/dist/spectrum/utils.js.map +0 -1
package/dist/Button.d.ts CHANGED
@@ -30,6 +30,6 @@ type IconOnlyButtonJsxTooltip = BaseButtonProps & {
30
30
  icon: IconDefinition | JSX.Element;
31
31
  children?: undefined;
32
32
  };
33
- declare const Button: React.ForwardRefExoticComponent<(Pick<ButtonWithChildren, "className" | "placeholder" | "value" | "onChange" | "onSelect" | "onSubmit" | "onFocus" | "onBlur" | "data-testid" | "key" | "form" | "slot" | "style" | "title" | "color" | "hidden" | "type" | "onKeyDown" | "onSelectCapture" | "children" | "id" | "defaultChecked" | "defaultValue" | "disabled" | "formAction" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "tooltip" | "onClick" | "tabIndex" | "role" | "aria-label" | "autoFocus" | "onKeyUp" | "aria-labelledby" | "aria-describedby" | "aria-details" | "onScroll" | "icon" | "active" | "lang" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "variant" | "spellCheck" | "formEncType" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "kind"> | Pick<IconOnlyButtonStringTooltip, "className" | "placeholder" | "value" | "onChange" | "onSelect" | "onSubmit" | "onFocus" | "onBlur" | "data-testid" | "key" | "form" | "slot" | "style" | "title" | "color" | "hidden" | "type" | "onKeyDown" | "onSelectCapture" | "children" | "id" | "defaultChecked" | "defaultValue" | "disabled" | "formAction" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "tooltip" | "onClick" | "tabIndex" | "role" | "aria-label" | "autoFocus" | "onKeyUp" | "aria-labelledby" | "aria-describedby" | "aria-details" | "onScroll" | "icon" | "active" | "lang" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "variant" | "spellCheck" | "formEncType" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "kind"> | Pick<IconOnlyButtonJsxTooltip, "className" | "placeholder" | "value" | "onChange" | "onSelect" | "onSubmit" | "onFocus" | "onBlur" | "data-testid" | "key" | "form" | "slot" | "style" | "title" | "color" | "hidden" | "type" | "onKeyDown" | "onSelectCapture" | "children" | "id" | "defaultChecked" | "defaultValue" | "disabled" | "formAction" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "tooltip" | "onClick" | "tabIndex" | "role" | "aria-label" | "autoFocus" | "onKeyUp" | "aria-labelledby" | "aria-describedby" | "aria-details" | "onScroll" | "icon" | "active" | "lang" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "variant" | "spellCheck" | "formEncType" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "kind">) & React.RefAttributes<HTMLButtonElement>>;
33
+ declare const Button: React.ForwardRefExoticComponent<(Pick<ButtonWithChildren, "className" | "placeholder" | "value" | "onChange" | "onSelect" | "onSubmit" | "onFocus" | "onBlur" | "data-testid" | "key" | "form" | "slot" | "style" | "title" | "color" | "hidden" | "type" | "onKeyDown" | "onSelectCapture" | "children" | "aria-label" | "id" | "defaultChecked" | "defaultValue" | "disabled" | "formAction" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "tooltip" | "onClick" | "tabIndex" | "role" | "icon" | "active" | "autoFocus" | "onKeyUp" | "aria-labelledby" | "aria-describedby" | "aria-details" | "onScroll" | "lang" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "variant" | "spellCheck" | "formEncType" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "kind"> | Pick<IconOnlyButtonStringTooltip, "className" | "placeholder" | "value" | "onChange" | "onSelect" | "onSubmit" | "onFocus" | "onBlur" | "data-testid" | "key" | "form" | "slot" | "style" | "title" | "color" | "hidden" | "type" | "onKeyDown" | "onSelectCapture" | "children" | "aria-label" | "id" | "defaultChecked" | "defaultValue" | "disabled" | "formAction" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "tooltip" | "onClick" | "tabIndex" | "role" | "icon" | "active" | "autoFocus" | "onKeyUp" | "aria-labelledby" | "aria-describedby" | "aria-details" | "onScroll" | "lang" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "variant" | "spellCheck" | "formEncType" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "kind"> | Pick<IconOnlyButtonJsxTooltip, "className" | "placeholder" | "value" | "onChange" | "onSelect" | "onSubmit" | "onFocus" | "onBlur" | "data-testid" | "key" | "form" | "slot" | "style" | "title" | "color" | "hidden" | "type" | "onKeyDown" | "onSelectCapture" | "children" | "aria-label" | "id" | "defaultChecked" | "defaultValue" | "disabled" | "formAction" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "tooltip" | "onClick" | "tabIndex" | "role" | "icon" | "active" | "autoFocus" | "onKeyUp" | "aria-labelledby" | "aria-describedby" | "aria-details" | "onScroll" | "lang" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "variant" | "spellCheck" | "formEncType" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "kind">) & React.RefAttributes<HTMLButtonElement>>;
34
34
  export default Button;
35
35
  //# sourceMappingURL=Button.d.ts.map
@@ -36,25 +36,23 @@
36
36
  .search-group .search-change-selection {
37
37
  position: absolute;
38
38
  right: 0.25rem;
39
- top: 15%;
40
- bottom: 15%;
41
- height: 70%;
39
+ top: 0;
40
+ height: 100%;
41
+ display: flex;
42
+ align-items: center;
42
43
  }
43
44
  .search-group .search-change-button {
44
- background: none;
45
- border: none;
46
45
  padding: 1px 2px;
46
+ height: calc(100% - 0.5rem);
47
47
  }
48
- .search-group .search-change-text {
48
+ .search-group .search-change-text,
49
+ .search-group .search-match {
49
50
  background-color: color-mix(in srgb, var(--dh-color-fg) 20%, transparent);
50
- border-radius: 10px;
51
- padding: 1px 5px;
51
+ border-radius: 20px;
52
+ padding: 0 5px;
52
53
  }
53
54
  .search-group .search-match {
54
- background-color: color-mix(in srgb, var(--dh-color-fg) 20%, transparent);
55
- border-radius: 10px;
56
- padding: 1px 5px;
57
- margin: 0 5px;
55
+ margin: 0 0.25rem;
58
56
  }
59
57
 
60
58
  /*# sourceMappingURL=SearchInput.css.map */
@@ -1 +1 @@
1
- {"version":3,"sourceRoot":"","sources":["../scss/custom.scss","../scss/bootstrap_overrides.scss","../src/SearchInput.scss","../scss/new_variables.scss","../scss/util.scss"],"names":[],"mappings":"AAAA;AC6LA;AC3LA;EACE;;AAEA;EACE;;AAGF;EACE;EACA;EACA;EACA,OCRO;EDSP;EACA;EACA;EACA;EACA;;AAGF;EEnBA,iBFoBc;EEnBd;EACA,YFmB2B;EElB3B;EACA;EACA,WFec;EAIZ;EACA,QALY;EAMZ,OANY;EAOZ;EACA;;AACA;EACE;;AAIJ;EACE;EACA,OClCO;EDmCP;EACA;EACA;;AAGF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA","file":"SearchInput.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 + 2*padding-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-input-disabled-fg);\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.search-group {\n position: relative;\n\n .form-control {\n padding-right: 1.75rem; // leave space for search icon and cancel button from browser\n }\n\n .search-icon {\n color: var(--dh-color-search-icon);\n pointer-events: none;\n position: absolute;\n right: $spacer-2;\n top: 0;\n bottom: 0;\n height: 100%;\n display: flex;\n align-items: center;\n }\n\n ::-webkit-search-cancel-button {\n $icon-size: 16px;\n @include icon-image-mask(var(--dh-svg-icon-search-cancel), $icon-size);\n\n // Need to specify -webkit-appearance: none for Chrome\n -webkit-appearance: none;\n height: $icon-size;\n width: $icon-size;\n opacity: 0.4;\n transition: opacity 300ms ease;\n &:hover {\n opacity: 1;\n }\n }\n\n .search-change-selection {\n position: absolute;\n right: $spacer-1;\n top: 15%;\n bottom: 15%;\n height: 70%;\n }\n\n .search-change-button {\n background: none;\n border: none;\n padding: 1px 2px;\n }\n\n .search-change-text {\n background-color: fg-opacity(20);\n border-radius: 10px;\n padding: 1px 5px;\n }\n\n .search-match {\n background-color: fg-opacity(20);\n border-radius: 10px;\n padding: 1px 5px;\n margin: 0 5px;\n }\n}\n","@use 'sass:math';\n\n//Set of spacer variables from the spacer map\n$spacer-0: map-get($spacers, 0); //0\n$spacer-1: map-get($spacers, 1);\n$spacer-2: map-get($spacers, 2);\n$spacer-3: map-get($spacers, 3);\n$spacer-4: map-get($spacers, 4);\n$spacer-5: map-get($spacers, 5);\n\n//Marching Ants for golden layout dropzone and drag and drop\n//top bottom, left right.\n//create 4 background images that are 50% color 1, 50% color 2 using graidents, two veritical, two horizontal\n//size them to ant-size and thickness\n//position those images along the egdes and make top/bottom repeat-x and left/right repeat-y\n//then offest each of those background positions by ant-size in animation to make them march.\n$ant-size: 8px;\n$ant-thickness: 1px;\n\n@mixin ants-base($color-1: black, $color-2: white) {\n background-image: linear-gradient(to right, $color-2 50%, $color-1 50%),\n linear-gradient(to right, $color-2 50%, $color-1 50%),\n linear-gradient(to bottom, $color-2 50%, $color-1 50%),\n linear-gradient(to bottom, $color-2 50%, $color-1 50%);\n background-size:\n $ant-size $ant-thickness,\n $ant-size $ant-thickness,\n $ant-thickness $ant-size,\n $ant-thickness $ant-size;\n background-position:\n 0 top,\n 0 bottom,\n left 0,\n right 0;\n background-repeat: repeat-x, repeat-x, repeat-y, repeat-y;\n animation: march 0.5s;\n animation-timing-function: linear;\n animation-iteration-count: infinite;\n}\n\n@mixin drag-stack($pseudo-element) {\n &::#{$pseudo-element} {\n content: ' ';\n background: $primary;\n box-shadow: $box-shadow;\n border-radius: $border-radius;\n position: absolute;\n height: 100%;\n width: 100%;\n @content;\n }\n}\n\n$focus-bg-transparency: 12%;\n$hover-bg-transparency: 14%;\n$active-bg-transparency: 28%;\n$exception-transparency: 13%;\n","// Setup a mask-image for an inline svg\n@mixin icon-image-mask($mask-image, $size: 16px) {\n background-size: $size;\n background-color: var(--dh-color-fg);\n mask-image: $mask-image;\n mask-position: center center;\n mask-repeat: no-repeat;\n mask-size: $size;\n}\n\n// Caret icon for pickers, dropdowns, select, etc.\n@mixin caret-icon() {\n $width: 10px;\n $height: 6px;\n @include icon-image-mask(var(--dh-svg-icon-selector-caret), $width $height);\n\n background-color: var(--dh-color-selector-fg);\n width: $width;\n height: $height;\n}\n\n/// Utilty for increasing specificity by repeating a given selector n number of\n/// times.\n///\n/// It should work for selectors that can be concatenated without delimiters\n/// such as '.some-selector.some-selector', '#some-id#some-id', or '&&'. A\n/// case where it would not work would be with an element selector e.g. 'divdiv'.\n///\n/// Example usage:\n///\n/// #{multiply-specificity-n('.some-selector', 2)} {\n/// }\n///\n/// would produce\n///\n/// .some-selector.some-selector {\n/// }\n///\n/// @param {string} $selector the selector to duplicate\n/// @param {number} $n number of times to duplicate\n/// @return {string} duplicated selector\n@function multiply-specificity-n($selector, $n) {\n $result: $selector;\n @for $i from 2 through $n {\n $result: selector-append($result, $selector);\n }\n\n @return $result;\n}\n\n// Linear gradient with same start and end color. Useful for certain scenarios\n// where we need a solid background image layer.\n@function solid-gradient($color) {\n @return linear-gradient(0deg, $color, $color);\n}\n\n@function color-mix-opacity($semantic-name, $i: 100) {\n @return color-mix(\n in srgb,\n /* if $i doesn't contain a % sign, add one */\n var(--dh-color-#{$semantic-name}) #{$i}#{if(unit($i) == '%', '', '%')},\n transparent\n );\n}\n\n@function accent-opacity($i: 100) {\n @return color-mix-opacity('accent', $i);\n}\n\n@function negative-opacity($i: 100) {\n @return color-mix-opacity('negative', $i);\n}\n\n@function black-opacity($i: 100) {\n @return color-mix-opacity('black', $i);\n}\n\n@function bg-opacity($i: 100) {\n @return color-mix-opacity('bg', $i);\n}\n\n@function fg-opacity($i: 100) {\n @return color-mix-opacity('fg', $i);\n}\n"]}
1
+ {"version":3,"sourceRoot":"","sources":["../scss/custom.scss","../scss/bootstrap_overrides.scss","../src/SearchInput.scss","../scss/new_variables.scss","../scss/util.scss"],"names":[],"mappings":"AAAA;AC6LA;AC3LA;EACE;;AAEA;EACE;;AAGF;EACE;EACA;EACA;EACA,OCRO;EDSP;EACA;EACA;EACA;EACA;;AAGF;EEnBA,iBFoBc;EEnBd;EACA,YFmB2B;EElB3B;EACA;EACA,WFec;EAIZ;EACA,QALY;EAMZ,OANY;EAOZ;EACA;;AACA;EACE;;AAIJ;EACE;EACA,OClCO;EDmCP;EACA;EACA;EACA;;AAGF;EACE;EACA;;AAGF;AAAA;EAEE;EACA;EACA;;AAGF;EACE","file":"SearchInput.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 + 2*padding-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-input-disabled-fg);\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.search-group {\n position: relative;\n\n .form-control {\n padding-right: 1.75rem; // leave space for search icon and cancel button from browser\n }\n\n .search-icon {\n color: var(--dh-color-search-icon);\n pointer-events: none;\n position: absolute;\n right: $spacer-2;\n top: 0;\n bottom: 0;\n height: 100%;\n display: flex;\n align-items: center;\n }\n\n ::-webkit-search-cancel-button {\n $icon-size: 16px;\n @include icon-image-mask(var(--dh-svg-icon-search-cancel), $icon-size);\n\n // Need to specify -webkit-appearance: none for Chrome\n -webkit-appearance: none;\n height: $icon-size;\n width: $icon-size;\n opacity: 0.4;\n transition: opacity 300ms ease;\n &:hover {\n opacity: 1;\n }\n }\n\n .search-change-selection {\n position: absolute;\n right: $spacer-1;\n top: 0;\n height: 100%;\n display: flex;\n align-items: center;\n }\n\n .search-change-button {\n padding: 1px 2px;\n height: calc(100% - $spacer-2);\n }\n\n .search-change-text,\n .search-match {\n background-color: fg-opacity(20);\n border-radius: 20px;\n padding: 0 5px;\n }\n\n .search-match {\n margin: 0 $spacer-1;\n }\n}\n","@use 'sass:math';\n\n//Set of spacer variables from the spacer map\n$spacer-0: map-get($spacers, 0); //0\n$spacer-1: map-get($spacers, 1);\n$spacer-2: map-get($spacers, 2);\n$spacer-3: map-get($spacers, 3);\n$spacer-4: map-get($spacers, 4);\n$spacer-5: map-get($spacers, 5);\n\n//Marching Ants for golden layout dropzone and drag and drop\n//top bottom, left right.\n//create 4 background images that are 50% color 1, 50% color 2 using graidents, two veritical, two horizontal\n//size them to ant-size and thickness\n//position those images along the egdes and make top/bottom repeat-x and left/right repeat-y\n//then offest each of those background positions by ant-size in animation to make them march.\n$ant-size: 8px;\n$ant-thickness: 1px;\n\n@mixin ants-base($color-1: black, $color-2: white) {\n background-image: linear-gradient(to right, $color-2 50%, $color-1 50%),\n linear-gradient(to right, $color-2 50%, $color-1 50%),\n linear-gradient(to bottom, $color-2 50%, $color-1 50%),\n linear-gradient(to bottom, $color-2 50%, $color-1 50%);\n background-size:\n $ant-size $ant-thickness,\n $ant-size $ant-thickness,\n $ant-thickness $ant-size,\n $ant-thickness $ant-size;\n background-position:\n 0 top,\n 0 bottom,\n left 0,\n right 0;\n background-repeat: repeat-x, repeat-x, repeat-y, repeat-y;\n animation: march 0.5s;\n animation-timing-function: linear;\n animation-iteration-count: infinite;\n}\n\n@mixin drag-stack($pseudo-element) {\n &::#{$pseudo-element} {\n content: ' ';\n background: $primary;\n box-shadow: $box-shadow;\n border-radius: $border-radius;\n position: absolute;\n height: 100%;\n width: 100%;\n @content;\n }\n}\n\n$focus-bg-transparency: 12%;\n$hover-bg-transparency: 14%;\n$active-bg-transparency: 28%;\n$exception-transparency: 13%;\n","// Setup a mask-image for an inline svg\n@mixin icon-image-mask($mask-image, $size: 16px) {\n background-size: $size;\n background-color: var(--dh-color-fg);\n mask-image: $mask-image;\n mask-position: center center;\n mask-repeat: no-repeat;\n mask-size: $size;\n}\n\n// Caret icon for pickers, dropdowns, select, etc.\n@mixin caret-icon() {\n $width: 10px;\n $height: 6px;\n @include icon-image-mask(var(--dh-svg-icon-selector-caret), $width $height);\n\n background-color: var(--dh-color-selector-fg);\n width: $width;\n height: $height;\n}\n\n/// Utilty for increasing specificity by repeating a given selector n number of\n/// times.\n///\n/// It should work for selectors that can be concatenated without delimiters\n/// such as '.some-selector.some-selector', '#some-id#some-id', or '&&'. A\n/// case where it would not work would be with an element selector e.g. 'divdiv'.\n///\n/// Example usage:\n///\n/// #{multiply-specificity-n('.some-selector', 2)} {\n/// }\n///\n/// would produce\n///\n/// .some-selector.some-selector {\n/// }\n///\n/// @param {string} $selector the selector to duplicate\n/// @param {number} $n number of times to duplicate\n/// @return {string} duplicated selector\n@function multiply-specificity-n($selector, $n) {\n $result: $selector;\n @for $i from 2 through $n {\n $result: selector-append($result, $selector);\n }\n\n @return $result;\n}\n\n// Linear gradient with same start and end color. Useful for certain scenarios\n// where we need a solid background image layer.\n@function solid-gradient($color) {\n @return linear-gradient(0deg, $color, $color);\n}\n\n@function color-mix-opacity($semantic-name, $i: 100) {\n @return color-mix(\n in srgb,\n /* if $i doesn't contain a % sign, add one */\n var(--dh-color-#{$semantic-name}) #{$i}#{if(unit($i) == '%', '', '%')},\n transparent\n );\n}\n\n@function accent-opacity($i: 100) {\n @return color-mix-opacity('accent', $i);\n}\n\n@function negative-opacity($i: 100) {\n @return color-mix-opacity('negative', $i);\n}\n\n@function black-opacity($i: 100) {\n @return color-mix-opacity('black', $i);\n}\n\n@function bg-opacity($i: 100) {\n @return color-mix-opacity('bg', $i);\n}\n\n@function fg-opacity($i: 100) {\n @return color-mix-opacity('fg', $i);\n}\n"]}
package/dist/Select.d.ts CHANGED
@@ -1,6 +1,7 @@
1
1
  import React from 'react';
2
2
  type baseSelectProps = Omit<React.HTMLProps<HTMLSelectElement>, 'onChange'>;
3
3
  export type SelectProps = baseSelectProps & {
4
+ isInvalid?: boolean;
4
5
  onChange: (value: string) => void;
5
6
  'data-testid'?: string;
6
7
  };
@@ -9,6 +10,6 @@ export type SelectProps = baseSelectProps & {
9
10
  * native select element.
10
11
  * @param props.onChange returns a string value and not the event
11
12
  */
12
- declare const Select: React.ForwardRefExoticComponent<Pick<SelectProps, "className" | "pattern" | "placeholder" | "value" | "onChange" | "onSelect" | "onSubmit" | "onFocus" | "onBlur" | "data-testid" | "key" | "cite" | "data" | "form" | "label" | "slot" | "span" | "style" | "summary" | "title" | "color" | "hidden" | "type" | "onKeyDown" | "onSelectCapture" | "start" | "children" | "id" | "accept" | "alt" | "capture" | "checked" | "defaultChecked" | "defaultValue" | "disabled" | "formAction" | "formMethod" | "formNoValidate" | "formTarget" | "height" | "list" | "max" | "maxLength" | "min" | "minLength" | "multiple" | "name" | "readOnly" | "required" | "size" | "src" | "step" | "useMap" | "width" | "onClick" | "tabIndex" | "role" | "aria-label" | "content" | "autoFocus" | "autoComplete" | "onKeyUp" | "aria-labelledby" | "aria-describedby" | "aria-details" | "onScroll" | "default" | "wrap" | "open" | "lang" | "media" | "method" | "target" | "crossOrigin" | "href" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "rows" | "download" | "spellCheck" | "formEncType" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "kind" | "htmlFor" | "action" | "nonce" | "selected" | "acceptCharset" | "allowFullScreen" | "allowTransparency" | "as" | "async" | "autoPlay" | "cellPadding" | "cellSpacing" | "charSet" | "challenge" | "classID" | "cols" | "colSpan" | "controls" | "coords" | "dateTime" | "defer" | "encType" | "frameBorder" | "headers" | "high" | "hrefLang" | "httpEquiv" | "integrity" | "keyParams" | "keyType" | "loop" | "low" | "manifest" | "marginHeight" | "marginWidth" | "mediaGroup" | "muted" | "noValidate" | "optimum" | "playsInline" | "poster" | "preload" | "rel" | "reversed" | "rowSpan" | "sandbox" | "scope" | "scoped" | "scrolling" | "seamless" | "shape" | "sizes" | "srcDoc" | "srcLang" | "srcSet" | "wmode"> & React.RefAttributes<HTMLSelectElement>>;
13
+ declare const Select: React.ForwardRefExoticComponent<Pick<SelectProps, "className" | "pattern" | "placeholder" | "value" | "onChange" | "onSelect" | "onSubmit" | "onFocus" | "onBlur" | "data-testid" | "key" | "cite" | "data" | "form" | "label" | "slot" | "span" | "style" | "summary" | "title" | "color" | "hidden" | "type" | "onKeyDown" | "onSelectCapture" | "start" | "children" | "aria-label" | "content" | "id" | "accept" | "alt" | "capture" | "checked" | "defaultChecked" | "defaultValue" | "disabled" | "formAction" | "formMethod" | "formNoValidate" | "formTarget" | "height" | "list" | "max" | "maxLength" | "min" | "minLength" | "multiple" | "name" | "readOnly" | "required" | "size" | "src" | "step" | "useMap" | "width" | "onClick" | "tabIndex" | "role" | "default" | "wrap" | "open" | "autoFocus" | "autoComplete" | "isInvalid" | "onKeyUp" | "aria-labelledby" | "aria-describedby" | "aria-details" | "onScroll" | "lang" | "media" | "method" | "target" | "crossOrigin" | "href" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "rows" | "download" | "spellCheck" | "formEncType" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "kind" | "htmlFor" | "action" | "nonce" | "selected" | "acceptCharset" | "allowFullScreen" | "allowTransparency" | "as" | "async" | "autoPlay" | "cellPadding" | "cellSpacing" | "charSet" | "challenge" | "classID" | "cols" | "colSpan" | "controls" | "coords" | "dateTime" | "defer" | "encType" | "frameBorder" | "headers" | "high" | "hrefLang" | "httpEquiv" | "integrity" | "keyParams" | "keyType" | "loop" | "low" | "manifest" | "marginHeight" | "marginWidth" | "mediaGroup" | "muted" | "noValidate" | "optimum" | "playsInline" | "poster" | "preload" | "rel" | "reversed" | "rowSpan" | "sandbox" | "scope" | "scoped" | "scrolling" | "seamless" | "shape" | "sizes" | "srcDoc" | "srcLang" | "srcSet" | "wmode"> & React.RefAttributes<HTMLSelectElement>>;
13
14
  export default Select;
14
15
  //# sourceMappingURL=Select.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../src/Select.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsB,MAAM,OAAO,CAAC;AAI3C,KAAK,eAAe,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,iBAAiB,CAAC,EAAE,UAAU,CAAC,CAAC;AAE5E,MAAM,MAAM,WAAW,GAAG,eAAe,GAAG;IAC1C,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AAEF;;;;GAIG;AAEH,QAAA,MAAM,MAAM,20LAgCX,CAAC;AAIF,eAAe,MAAM,CAAC"}
1
+ {"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../src/Select.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsB,MAAM,OAAO,CAAC;AAI3C,KAAK,eAAe,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,iBAAiB,CAAC,EAAE,UAAU,CAAC,CAAC;AAE5E,MAAM,MAAM,WAAW,GAAG,eAAe,GAAG;IAC1C,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AAEF;;;;GAIG;AAEH,QAAA,MAAM,MAAM,y1LAmCX,CAAC;AAIF,eAAe,MAAM,CAAC"}
package/dist/Select.js CHANGED
@@ -1,4 +1,4 @@
1
- var _excluded = ["children", "className", "onChange", "data-testid"];
1
+ var _excluded = ["children", "className", "isInvalid", "onChange", "data-testid"];
2
2
  function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
3
3
  function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
4
4
  function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
@@ -20,6 +20,7 @@ var Select = /*#__PURE__*/React.forwardRef((props, forwardedRef) => {
20
20
  var {
21
21
  children,
22
22
  className,
23
+ isInvalid,
23
24
  onChange,
24
25
  'data-testid': dataTestId
25
26
  } = props,
@@ -30,7 +31,9 @@ var Select = /*#__PURE__*/React.forwardRef((props, forwardedRef) => {
30
31
  }, [onChange]);
31
32
  return /*#__PURE__*/_jsx("select", _objectSpread(_objectSpread({
32
33
  ref: ref,
33
- className: classNames('custom-select', className),
34
+ className: classNames('custom-select', className, {
35
+ 'is-invalid': isInvalid
36
+ }),
34
37
  onChange: handleChange,
35
38
  "data-testid": dataTestId
36
39
  // eslint-disable-next-line react/jsx-props-no-spreading
@@ -1 +1 @@
1
- {"version":3,"file":"Select.js","names":["React","useCallback","classNames","useForwardedRef","jsx","_jsx","Select","forwardRef","props","forwardedRef","children","className","onChange","dataTestId","rest","_objectWithoutProperties","_excluded","ref","handleChange","event","target","value","_objectSpread","displayName"],"sources":["../src/Select.tsx"],"sourcesContent":["import React, { useCallback } from 'react';\nimport classNames from 'classnames';\nimport { useForwardedRef } from '@deephaven/react-hooks';\n\ntype baseSelectProps = Omit<React.HTMLProps<HTMLSelectElement>, 'onChange'>;\n\nexport type SelectProps = baseSelectProps & {\n onChange: (value: string) => void;\n 'data-testid'?: string;\n};\n\n/**\n * A custom select component with styling, which is a wrapper around the\n * native select element.\n * @param props.onChange returns a string value and not the event\n */\n\nconst Select = React.forwardRef<HTMLSelectElement, SelectProps>(\n (props, forwardedRef) => {\n const {\n children,\n className,\n onChange,\n 'data-testid': dataTestId,\n ...rest\n } = props;\n\n const ref = useForwardedRef<HTMLSelectElement>(forwardedRef);\n\n const handleChange = useCallback(\n (event: React.ChangeEvent<HTMLSelectElement>): void => {\n onChange(event.target.value);\n },\n [onChange]\n );\n\n return (\n <select\n ref={ref}\n className={classNames('custom-select', className)}\n onChange={handleChange}\n data-testid={dataTestId}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...rest}\n >\n {children}\n </select>\n );\n }\n);\n\nSelect.displayName = 'Select';\n\nexport default Select;\n"],"mappings":";;;;;;;;AAAA,OAAOA,KAAK,IAAIC,WAAW,QAAQ,OAAO;AAC1C,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,eAAe,QAAQ,wBAAwB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AASzD;AACA;AACA;AACA;AACA;;AAEA,IAAMC,MAAM,gBAAGN,KAAK,CAACO,UAAU,CAC7B,CAACC,KAAK,EAAEC,YAAY,KAAK;EACvB,IAAM;MACJC,QAAQ;MACRC,SAAS;MACTC,QAAQ;MACR,aAAa,EAAEC;IAEjB,CAAC,GAAGL,KAAK;IADJM,IAAI,GAAAC,wBAAA,CACLP,KAAK,EAAAQ,SAAA;EAET,IAAMC,GAAG,GAAGd,eAAe,CAAoBM,YAAY,CAAC;EAE5D,IAAMS,YAAY,GAAGjB,WAAW,CAC7BkB,KAA2C,IAAW;IACrDP,QAAQ,CAACO,KAAK,CAACC,MAAM,CAACC,KAAK,CAAC;EAC9B,CAAC,EACD,CAACT,QAAQ,CACX,CAAC;EAED,oBACEP,IAAA,WAAAiB,aAAA,CAAAA,aAAA;IACEL,GAAG,EAAEA,GAAI;IACTN,SAAS,EAAET,UAAU,CAAC,eAAe,EAAES,SAAS,CAAE;IAClDC,QAAQ,EAAEM,YAAa;IACvB,eAAaL;IACb;EAAA,GACIC,IAAI;IAAAJ,QAAA,EAEPA;EAAQ,EACH,CAAC;AAEb,CACF,CAAC;AAEDJ,MAAM,CAACiB,WAAW,GAAG,QAAQ;AAE7B,eAAejB,MAAM"}
1
+ {"version":3,"file":"Select.js","names":["React","useCallback","classNames","useForwardedRef","jsx","_jsx","Select","forwardRef","props","forwardedRef","children","className","isInvalid","onChange","dataTestId","rest","_objectWithoutProperties","_excluded","ref","handleChange","event","target","value","_objectSpread","displayName"],"sources":["../src/Select.tsx"],"sourcesContent":["import React, { useCallback } from 'react';\nimport classNames from 'classnames';\nimport { useForwardedRef } from '@deephaven/react-hooks';\n\ntype baseSelectProps = Omit<React.HTMLProps<HTMLSelectElement>, 'onChange'>;\n\nexport type SelectProps = baseSelectProps & {\n isInvalid?: boolean;\n onChange: (value: string) => void;\n 'data-testid'?: string;\n};\n\n/**\n * A custom select component with styling, which is a wrapper around the\n * native select element.\n * @param props.onChange returns a string value and not the event\n */\n\nconst Select = React.forwardRef<HTMLSelectElement, SelectProps>(\n (props, forwardedRef) => {\n const {\n children,\n className,\n isInvalid,\n onChange,\n 'data-testid': dataTestId,\n ...rest\n } = props;\n\n const ref = useForwardedRef<HTMLSelectElement>(forwardedRef);\n\n const handleChange = useCallback(\n (event: React.ChangeEvent<HTMLSelectElement>): void => {\n onChange(event.target.value);\n },\n [onChange]\n );\n\n return (\n <select\n ref={ref}\n className={classNames('custom-select', className, {\n 'is-invalid': isInvalid,\n })}\n onChange={handleChange}\n data-testid={dataTestId}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...rest}\n >\n {children}\n </select>\n );\n }\n);\n\nSelect.displayName = 'Select';\n\nexport default Select;\n"],"mappings":";;;;;;;;AAAA,OAAOA,KAAK,IAAIC,WAAW,QAAQ,OAAO;AAC1C,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,eAAe,QAAQ,wBAAwB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAUzD;AACA;AACA;AACA;AACA;;AAEA,IAAMC,MAAM,gBAAGN,KAAK,CAACO,UAAU,CAC7B,CAACC,KAAK,EAAEC,YAAY,KAAK;EACvB,IAAM;MACJC,QAAQ;MACRC,SAAS;MACTC,SAAS;MACTC,QAAQ;MACR,aAAa,EAAEC;IAEjB,CAAC,GAAGN,KAAK;IADJO,IAAI,GAAAC,wBAAA,CACLR,KAAK,EAAAS,SAAA;EAET,IAAMC,GAAG,GAAGf,eAAe,CAAoBM,YAAY,CAAC;EAE5D,IAAMU,YAAY,GAAGlB,WAAW,CAC7BmB,KAA2C,IAAW;IACrDP,QAAQ,CAACO,KAAK,CAACC,MAAM,CAACC,KAAK,CAAC;EAC9B,CAAC,EACD,CAACT,QAAQ,CACX,CAAC;EAED,oBACER,IAAA,WAAAkB,aAAA,CAAAA,aAAA;IACEL,GAAG,EAAEA,GAAI;IACTP,SAAS,EAAET,UAAU,CAAC,eAAe,EAAES,SAAS,EAAE;MAChD,YAAY,EAAEC;IAChB,CAAC,CAAE;IACHC,QAAQ,EAAEM,YAAa;IACvB,eAAaL;IACb;EAAA,GACIC,IAAI;IAAAL,QAAA,EAEPA;EAAQ,EACH,CAAC;AAEb,CACF,CAAC;AAEDJ,MAAM,CAACkB,WAAW,GAAG,QAAQ;AAE7B,eAAelB,MAAM"}
package/dist/index.d.ts CHANGED
@@ -49,7 +49,6 @@ export * from './SelectValueList';
49
49
  export * from './shortcuts';
50
50
  export { default as SocketedButton } from './SocketedButton';
51
51
  export * from './spectrum';
52
- export * from './spectrum/utils';
53
52
  export * from './TableViewEmptyState';
54
53
  export * from './TextWithTooltip';
55
54
  export * from './theme';
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
package/dist/index.js CHANGED
@@ -48,7 +48,6 @@ export * from "./SelectValueList.js";
48
48
  export * from "./shortcuts/index.js";
49
49
  export { default as SocketedButton } from "./SocketedButton.js";
50
50
  export * from "./spectrum/index.js";
51
- export * from "./spectrum/utils.js";
52
51
  export * from "./TableViewEmptyState.js";
53
52
  export * from "./TextWithTooltip.js";
54
53
  export * from "./theme/index.js";
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["default","AutoCompleteInput","AutoResizeTextarea","BasicModal","Button","ButtonGroup","ButtonOld","CardFlip","Collapse","Checkbox","ComboBox","CopyButton","CustomTimeSelect","DateTimeInput","DateInput","DebouncedSearchInput","DraggableItemList","DragUtils","EditableItemList","HierarchicalCheckboxMenu","ItemListItem","LoadingOverlay","LoadingSpinner","DropdownMenu","MaskedInput","Option","RadioGroup","RadioItem","RandomAreaPlotAnimation","Select","SearchInput","SelectValueList","SocketedButton","ThemeExport","TimeInput","TimeSlider","ToastNotification","UISwitch"],"sources":["../src/index.ts"],"sourcesContent":["export type { Range } from '@deephaven/utils';\nexport * from './actions';\nexport { default as AutoCompleteInput } from './AutoCompleteInput';\nexport { default as AutoResizeTextarea } from './AutoResizeTextarea';\nexport { default as BasicModal } from './BasicModal';\nexport { default as Button } from './Button';\nexport { default as ButtonGroup } from './ButtonGroup';\nexport { default as ButtonOld } from './ButtonOld';\nexport * from './BulkActionBar';\nexport { default as CardFlip } from './CardFlip';\nexport * from './context-actions';\nexport { default as Collapse } from './Collapse';\nexport { default as Checkbox } from './Checkbox';\nexport { default as ComboBox } from './ComboBox';\nexport { default as CopyButton } from './CopyButton';\nexport { default as CustomTimeSelect } from './CustomTimeSelect';\nexport { default as DateTimeInput } from './DateTimeInput';\nexport { default as DateInput } from './DateInput';\nexport { default as DebouncedSearchInput } from './DebouncedSearchInput';\nexport * from './dialogs';\nexport { default as DraggableItemList } from './DraggableItemList';\nexport * from './DraggableItemList';\nexport { default as DragUtils } from './DragUtils';\nexport { default as EditableItemList } from './EditableItemList';\nexport * from './ErrorBoundary';\nexport { default as HierarchicalCheckboxMenu } from './HierarchicalCheckboxMenu';\nexport * from './HierarchicalCheckboxMenu';\nexport * from './ItemList';\nexport { default as ItemListItem } from './ItemListItem';\nexport { default as LoadingOverlay } from './LoadingOverlay';\nexport { default as LoadingSpinner } from './LoadingSpinner';\nexport { default as DropdownMenu } from './menu-actions';\nexport * from './menu-actions';\nexport { default as MaskedInput } from './MaskedInput';\nexport * from './MaskedInput';\nexport * from './MaskedInputUtils';\nexport * from './navigation';\nexport { default as Option } from './Option';\nexport * from './popper';\nexport * from './modal';\nexport { default as RadioGroup } from './RadioGroup';\nexport { default as RadioItem } from './RadioItem';\nexport { default as RandomAreaPlotAnimation } from './RandomAreaPlotAnimation';\nexport * from './SearchableCombobox';\nexport { default as Select } from './Select';\nexport { default as SearchInput } from './SearchInput';\nexport { default as SelectValueList } from './SelectValueList';\nexport * from './SelectValueList';\nexport * from './shortcuts';\nexport { default as SocketedButton } from './SocketedButton';\nexport * from './spectrum';\nexport * from './spectrum/utils';\nexport * from './TableViewEmptyState';\nexport * from './TextWithTooltip';\nexport * from './theme';\nexport * from './transitions';\nexport { default as ThemeExport } from './ThemeExport';\nexport { default as TimeInput } from './TimeInput';\nexport { default as TimeSlider } from './TimeSlider';\nexport { default as ToastNotification } from './ToastNotification';\nexport { default as UISwitch } from './UISwitch';\n"],"mappings":";SAESA,OAAO,IAAIC,iBAAiB;AAAA,SAC5BD,OAAO,IAAIE,kBAAkB;AAAA,SAC7BF,OAAO,IAAIG,UAAU;AAAA,SACrBH,OAAO,IAAII,MAAM;AAAA,SACjBJ,OAAO,IAAIK,WAAW;AAAA,SACtBL,OAAO,IAAIM,SAAS;AAAA;AAAA,SAEpBN,OAAO,IAAIO,QAAQ;AAAA;AAAA,SAEnBP,OAAO,IAAIQ,QAAQ;AAAA,SACnBR,OAAO,IAAIS,QAAQ;AAAA,SACnBT,OAAO,IAAIU,QAAQ;AAAA,SACnBV,OAAO,IAAIW,UAAU;AAAA,SACrBX,OAAO,IAAIY,gBAAgB;AAAA,SAC3BZ,OAAO,IAAIa,aAAa;AAAA,SACxBb,OAAO,IAAIc,SAAS;AAAA,SACpBd,OAAO,IAAIe,oBAAoB;AAAA;AAAA,SAE/Bf,OAAO,IAAIgB,iBAAiB;AAAA;AAAA,SAE5BhB,OAAO,IAAIiB,SAAS;AAAA,SACpBjB,OAAO,IAAIkB,gBAAgB;AAAA;AAAA,SAE3BlB,OAAO,IAAImB,wBAAwB;AAAA;AAAA;AAAA,SAGnCnB,OAAO,IAAIoB,YAAY;AAAA,SACvBpB,OAAO,IAAIqB,cAAc;AAAA,SACzBrB,OAAO,IAAIsB,cAAc;AAAA,SACzBtB,OAAO,IAAIuB,YAAY;AAAA;AAAA,SAEvBvB,OAAO,IAAIwB,WAAW;AAAA;AAAA;AAAA;AAAA,SAItBxB,OAAO,IAAIyB,MAAM;AAAA;AAAA;AAAA,SAGjBzB,OAAO,IAAI0B,UAAU;AAAA,SACrB1B,OAAO,IAAI2B,SAAS;AAAA,SACpB3B,OAAO,IAAI4B,uBAAuB;AAAA;AAAA,SAElC5B,OAAO,IAAI6B,MAAM;AAAA,SACjB7B,OAAO,IAAI8B,WAAW;AAAA,SACtB9B,OAAO,IAAI+B,eAAe;AAAA;AAAA;AAAA,SAG1B/B,OAAO,IAAIgC,cAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,SAOzBhC,OAAO,IAAIiC,WAAW;AAAA,SACtBjC,OAAO,IAAIkC,SAAS;AAAA,SACpBlC,OAAO,IAAImC,UAAU;AAAA,SACrBnC,OAAO,IAAIoC,iBAAiB;AAAA,SAC5BpC,OAAO,IAAIqC,QAAQ"}
1
+ {"version":3,"file":"index.js","names":["default","AutoCompleteInput","AutoResizeTextarea","BasicModal","Button","ButtonGroup","ButtonOld","CardFlip","Collapse","Checkbox","ComboBox","CopyButton","CustomTimeSelect","DateTimeInput","DateInput","DebouncedSearchInput","DraggableItemList","DragUtils","EditableItemList","HierarchicalCheckboxMenu","ItemListItem","LoadingOverlay","LoadingSpinner","DropdownMenu","MaskedInput","Option","RadioGroup","RadioItem","RandomAreaPlotAnimation","Select","SearchInput","SelectValueList","SocketedButton","ThemeExport","TimeInput","TimeSlider","ToastNotification","UISwitch"],"sources":["../src/index.ts"],"sourcesContent":["export type { Range } from '@deephaven/utils';\nexport * from './actions';\nexport { default as AutoCompleteInput } from './AutoCompleteInput';\nexport { default as AutoResizeTextarea } from './AutoResizeTextarea';\nexport { default as BasicModal } from './BasicModal';\nexport { default as Button } from './Button';\nexport { default as ButtonGroup } from './ButtonGroup';\nexport { default as ButtonOld } from './ButtonOld';\nexport * from './BulkActionBar';\nexport { default as CardFlip } from './CardFlip';\nexport * from './context-actions';\nexport { default as Collapse } from './Collapse';\nexport { default as Checkbox } from './Checkbox';\nexport { default as ComboBox } from './ComboBox';\nexport { default as CopyButton } from './CopyButton';\nexport { default as CustomTimeSelect } from './CustomTimeSelect';\nexport { default as DateTimeInput } from './DateTimeInput';\nexport { default as DateInput } from './DateInput';\nexport { default as DebouncedSearchInput } from './DebouncedSearchInput';\nexport * from './dialogs';\nexport { default as DraggableItemList } from './DraggableItemList';\nexport * from './DraggableItemList';\nexport { default as DragUtils } from './DragUtils';\nexport { default as EditableItemList } from './EditableItemList';\nexport * from './ErrorBoundary';\nexport { default as HierarchicalCheckboxMenu } from './HierarchicalCheckboxMenu';\nexport * from './HierarchicalCheckboxMenu';\nexport * from './ItemList';\nexport { default as ItemListItem } from './ItemListItem';\nexport { default as LoadingOverlay } from './LoadingOverlay';\nexport { default as LoadingSpinner } from './LoadingSpinner';\nexport { default as DropdownMenu } from './menu-actions';\nexport * from './menu-actions';\nexport { default as MaskedInput } from './MaskedInput';\nexport * from './MaskedInput';\nexport * from './MaskedInputUtils';\nexport * from './navigation';\nexport { default as Option } from './Option';\nexport * from './popper';\nexport * from './modal';\nexport { default as RadioGroup } from './RadioGroup';\nexport { default as RadioItem } from './RadioItem';\nexport { default as RandomAreaPlotAnimation } from './RandomAreaPlotAnimation';\nexport * from './SearchableCombobox';\nexport { default as Select } from './Select';\nexport { default as SearchInput } from './SearchInput';\nexport { default as SelectValueList } from './SelectValueList';\nexport * from './SelectValueList';\nexport * from './shortcuts';\nexport { default as SocketedButton } from './SocketedButton';\nexport * from './spectrum';\nexport * from './TableViewEmptyState';\nexport * from './TextWithTooltip';\nexport * from './theme';\nexport * from './transitions';\nexport { default as ThemeExport } from './ThemeExport';\nexport { default as TimeInput } from './TimeInput';\nexport { default as TimeSlider } from './TimeSlider';\nexport { default as ToastNotification } from './ToastNotification';\nexport { default as UISwitch } from './UISwitch';\n"],"mappings":";SAESA,OAAO,IAAIC,iBAAiB;AAAA,SAC5BD,OAAO,IAAIE,kBAAkB;AAAA,SAC7BF,OAAO,IAAIG,UAAU;AAAA,SACrBH,OAAO,IAAII,MAAM;AAAA,SACjBJ,OAAO,IAAIK,WAAW;AAAA,SACtBL,OAAO,IAAIM,SAAS;AAAA;AAAA,SAEpBN,OAAO,IAAIO,QAAQ;AAAA;AAAA,SAEnBP,OAAO,IAAIQ,QAAQ;AAAA,SACnBR,OAAO,IAAIS,QAAQ;AAAA,SACnBT,OAAO,IAAIU,QAAQ;AAAA,SACnBV,OAAO,IAAIW,UAAU;AAAA,SACrBX,OAAO,IAAIY,gBAAgB;AAAA,SAC3BZ,OAAO,IAAIa,aAAa;AAAA,SACxBb,OAAO,IAAIc,SAAS;AAAA,SACpBd,OAAO,IAAIe,oBAAoB;AAAA;AAAA,SAE/Bf,OAAO,IAAIgB,iBAAiB;AAAA;AAAA,SAE5BhB,OAAO,IAAIiB,SAAS;AAAA,SACpBjB,OAAO,IAAIkB,gBAAgB;AAAA;AAAA,SAE3BlB,OAAO,IAAImB,wBAAwB;AAAA;AAAA;AAAA,SAGnCnB,OAAO,IAAIoB,YAAY;AAAA,SACvBpB,OAAO,IAAIqB,cAAc;AAAA,SACzBrB,OAAO,IAAIsB,cAAc;AAAA,SACzBtB,OAAO,IAAIuB,YAAY;AAAA;AAAA,SAEvBvB,OAAO,IAAIwB,WAAW;AAAA;AAAA;AAAA;AAAA,SAItBxB,OAAO,IAAIyB,MAAM;AAAA;AAAA;AAAA,SAGjBzB,OAAO,IAAI0B,UAAU;AAAA,SACrB1B,OAAO,IAAI2B,SAAS;AAAA,SACpB3B,OAAO,IAAI4B,uBAAuB;AAAA;AAAA,SAElC5B,OAAO,IAAI6B,MAAM;AAAA,SACjB7B,OAAO,IAAI8B,WAAW;AAAA,SACtB9B,OAAO,IAAI+B,eAAe;AAAA;AAAA;AAAA,SAG1B/B,OAAO,IAAIgC,cAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,SAMzBhC,OAAO,IAAIiC,WAAW;AAAA,SACtBjC,OAAO,IAAIkC,SAAS;AAAA,SACpBlC,OAAO,IAAImC,UAAU;AAAA,SACrBnC,OAAO,IAAIoC,iBAAiB;AAAA,SAC5BpC,OAAO,IAAIqC,QAAQ"}
@@ -22,5 +22,5 @@ export * from "./View.js";
22
22
  /**
23
23
  * Custom DH spectrum utils
24
24
  */
25
- export * from "./utils.js";
25
+ export * from "./utils/index.js";
26
26
  //# sourceMappingURL=index.js.map
@@ -1,13 +1,13 @@
1
1
  /// <reference types="react" />
2
- import { NormalizedSpectrumPickerProps, NormalizedPickerItem, PickerItemOrSection, TooltipOptions, PickerItemKey } from './PickerUtils';
2
+ import { NormalizedSpectrumPickerProps, NormalizedItem, ItemOrSection, TooltipOptions, ItemKey } from '../utils/itemUtils';
3
3
  export type PickerProps = {
4
- children: PickerItemOrSection | PickerItemOrSection[] | NormalizedPickerItem[];
4
+ children: ItemOrSection | ItemOrSection[] | NormalizedItem[];
5
5
  /** Can be set to true or a TooltipOptions to enable item tooltips */
6
6
  tooltip?: boolean | TooltipOptions;
7
7
  /** The currently selected key in the collection (controlled). */
8
- selectedKey?: PickerItemKey | null;
8
+ selectedKey?: ItemKey | null;
9
9
  /** The initial selected key in the collection (uncontrolled). */
10
- defaultSelectedKey?: PickerItemKey;
10
+ defaultSelectedKey?: ItemKey;
11
11
  /** Function to retrieve initial scroll position when opening the picker */
12
12
  getInitialScrollPosition?: () => Promise<number | null>;
13
13
  /**
@@ -16,14 +16,14 @@ export type PickerProps = {
16
16
  * `onSelectionChange`. We are renaming for better consistency with other
17
17
  * components.
18
18
  */
19
- onChange?: (key: PickerItemKey) => void;
19
+ onChange?: (key: ItemKey) => void;
20
20
  /** Handler that is called when the picker is scrolled. */
21
21
  onScroll?: (event: Event) => void;
22
22
  /**
23
23
  * Handler that is called when the selection changes.
24
24
  * @deprecated Use `onChange` instead
25
25
  */
26
- onSelectionChange?: (key: PickerItemKey) => void;
26
+ onSelectionChange?: (key: ItemKey) => void;
27
27
  } & Omit<NormalizedSpectrumPickerProps, 'children' | 'items' | 'onSelectionChange' | 'selectedKey' | 'defaultSelectedKey'>;
28
28
  /**
29
29
  * Picker component for selecting items from a list of items. Items can be
@@ -1 +1 @@
1
- {"version":3,"file":"Picker.d.ts","sourceRoot":"","sources":["../../../src/spectrum/picker/Picker.tsx"],"names":[],"mappings":";AAgBA,OAAO,EAEL,6BAA6B,EAG7B,oBAAoB,EACpB,mBAAmB,EACnB,cAAc,EACd,aAAa,EAEd,MAAM,eAAe,CAAC;AAIvB,MAAM,MAAM,WAAW,GAAG;IACxB,QAAQ,EACJ,mBAAmB,GACnB,mBAAmB,EAAE,GACrB,oBAAoB,EAAE,CAAC;IAC3B,qEAAqE;IACrE,OAAO,CAAC,EAAE,OAAO,GAAG,cAAc,CAAC;IACnC,iEAAiE;IACjE,WAAW,CAAC,EAAE,aAAa,GAAG,IAAI,CAAC;IACnC,iEAAiE;IACjE,kBAAkB,CAAC,EAAE,aAAa,CAAC;IACnC,2EAA2E;IAC3E,wBAAwB,CAAC,EAAE,MAAM,OAAO,CAAC,MAAM,GAAG,IAAI,CAAC,CAAC;IACxD;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,aAAa,KAAK,IAAI,CAAC;IAExC,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IAElC;;;OAGG;IACH,iBAAiB,CAAC,EAAE,CAAC,GAAG,EAAE,aAAa,KAAK,IAAI,CAAC;CAClD,GAKK,IAAI,CACR,6BAA6B,EAC3B,UAAU,GACV,OAAO,GACP,mBAAmB,GACnB,aAAa,GACb,oBAAoB,CACvB,CAAC;AAsBF;;;;;;GAMG;AACH,wBAAgB,MAAM,CAAC,EACrB,QAAQ,EACR,OAAc,EACd,kBAAkB,EAClB,WAAW,EACX,wBAAwB,EACxB,QAAQ,EACR,YAAY,EACZ,QAAyB,EACzB,iBAAiB,EAEjB,gBAAgB,EAChB,GAAG,mBAAmB,EACvB,EAAE,WAAW,GAAG,GAAG,CAAC,OAAO,CAoI3B;AAED,eAAe,MAAM,CAAC"}
1
+ {"version":3,"file":"Picker.d.ts","sourceRoot":"","sources":["../../../src/spectrum/picker/Picker.tsx"],"names":[],"mappings":";AAgBA,OAAO,EAEL,6BAA6B,EAG7B,cAAc,EACd,aAAa,EACb,cAAc,EACd,OAAO,EAER,MAAM,oBAAoB,CAAC;AAK5B,MAAM,MAAM,WAAW,GAAG;IACxB,QAAQ,EAAE,aAAa,GAAG,aAAa,EAAE,GAAG,cAAc,EAAE,CAAC;IAC7D,qEAAqE;IACrE,OAAO,CAAC,EAAE,OAAO,GAAG,cAAc,CAAC;IACnC,iEAAiE;IACjE,WAAW,CAAC,EAAE,OAAO,GAAG,IAAI,CAAC;IAC7B,iEAAiE;IACjE,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,2EAA2E;IAC3E,wBAAwB,CAAC,EAAE,MAAM,OAAO,CAAC,MAAM,GAAG,IAAI,CAAC,CAAC;IACxD;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,OAAO,KAAK,IAAI,CAAC;IAElC,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IAElC;;;OAGG;IACH,iBAAiB,CAAC,EAAE,CAAC,GAAG,EAAE,OAAO,KAAK,IAAI,CAAC;CAC5C,GAKK,IAAI,CACR,6BAA6B,EAC3B,UAAU,GACV,OAAO,GACP,mBAAmB,GACnB,aAAa,GACb,oBAAoB,CACvB,CAAC;AAsBF;;;;;;GAMG;AACH,wBAAgB,MAAM,CAAC,EACrB,QAAQ,EACR,OAAc,EACd,kBAAkB,EAClB,WAAW,EACX,wBAAwB,EACxB,QAAQ,EACR,YAAY,EACZ,QAAyB,EACzB,iBAAiB,EAEjB,gBAAgB,EAChB,GAAG,mBAAmB,EACvB,EAAE,WAAW,GAAG,GAAG,CAAC,OAAO,CAoI3B;AAED,eAAe,MAAM,CAAC"}
@@ -7,14 +7,15 @@ function _toPrimitive(input, hint) { if (typeof input !== "object" || input ===
7
7
  function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
8
8
  function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
9
9
  import { useCallback, useMemo } from 'react';
10
- import { Flex, Picker as SpectrumPicker, Text } from '@adobe/react-spectrum';
10
+ import { Flex, Picker as SpectrumPicker } from '@adobe/react-spectrum';
11
11
  import { getPositionOfSelectedItem, findSpectrumPickerScrollArea, isElementOfType, usePopoverOnScrollRef } from '@deephaven/react-hooks';
12
12
  import { EMPTY_FUNCTION, PICKER_ITEM_HEIGHT, PICKER_TOP_OFFSET } from '@deephaven/utils';
13
13
  import cl from 'classnames';
14
14
  import { Tooltip } from "../../popper/index.js";
15
- import { isNormalizedPickerSection, normalizePickerItemList, normalizeTooltipOptions, getPickerItemKey } from "./PickerUtils.js";
15
+ import { isNormalizedSection, normalizeItemList, normalizeTooltipOptions, getItemKey } from "../utils/itemUtils.js";
16
16
  import { PickerItemContent } from "./PickerItemContent.js";
17
17
  import { Item, Section } from "../shared.js";
18
+ import { Text } from "../Text.js";
18
19
  import { jsx as _jsx } from "react/jsx-runtime";
19
20
  import { Fragment as _Fragment } from "react/jsx-runtime";
20
21
  import { jsxs as _jsxs } from "react/jsx-runtime";
@@ -58,11 +59,11 @@ export function Picker(_ref) {
58
59
  UNSAFE_className
59
60
  } = _ref,
60
61
  spectrumPickerProps = _objectWithoutProperties(_ref, _excluded);
61
- var normalizedItems = useMemo(() => normalizePickerItemList(children), [children]);
62
+ var normalizedItems = useMemo(() => normalizeItemList(children), [children]);
62
63
  var tooltipOptions = useMemo(() => normalizeTooltipOptions(tooltip), [tooltip]);
63
64
  var renderItem = useCallback(normalizedItem => {
64
65
  var _normalizedItem$item$, _normalizedItem$item, _normalizedItem$item$2, _normalizedItem$item2;
65
- var key = getPickerItemKey(normalizedItem);
66
+ var key = getItemKey(normalizedItem);
66
67
  var content = (_normalizedItem$item$ = (_normalizedItem$item = normalizedItem.item) === null || _normalizedItem$item === void 0 ? void 0 : _normalizedItem$item.content) !== null && _normalizedItem$item$ !== void 0 ? _normalizedItem$item$ : '';
67
68
  var textValue = (_normalizedItem$item$2 = (_normalizedItem$item2 = normalizedItem.item) === null || _normalizedItem$item2 === void 0 ? void 0 : _normalizedItem$item2.textValue) !== null && _normalizedItem$item$2 !== void 0 ? _normalizedItem$item$2 : '';
68
69
  return /*#__PURE__*/_jsx(Item
@@ -107,12 +108,12 @@ export function Picker(_ref) {
107
108
  onOpenChange === null || onOpenChange === void 0 ? void 0 : onOpenChange(isOpen);
108
109
  }, [onOpenChange, popoverOnOpenChange]);
109
110
  var onSelectionChangeInternal = useCallback(key => {
110
- var _getPickerItemKey, _ref2;
111
+ var _getItemKey, _ref2;
111
112
  // The `key` arg will always be a string due to us setting the `Item` key
112
113
  // prop in `renderItem`. We need to find the matching item to determine
113
114
  // the actual key.
114
- var selectedItem = normalizedItems.find(item => String(getPickerItemKey(item)) === key);
115
- var actualKey = (_getPickerItemKey = getPickerItemKey(selectedItem)) !== null && _getPickerItemKey !== void 0 ? _getPickerItemKey : key;
115
+ var selectedItem = normalizedItems.find(item => String(getItemKey(item)) === key);
116
+ var actualKey = (_getItemKey = getItemKey(selectedItem)) !== null && _getItemKey !== void 0 ? _getItemKey : key;
116
117
  (_ref2 = onChange !== null && onChange !== void 0 ? onChange : onSelectionChange) === null || _ref2 === void 0 ? void 0 : _ref2(actualKey);
117
118
  }, [normalizedItems, onChange, onSelectionChange]);
118
119
  return /*#__PURE__*/_jsx(SpectrumPicker
@@ -134,13 +135,13 @@ export function Picker(_ref) {
134
135
  ,
135
136
  onSelectionChange: onSelectionChangeInternal,
136
137
  children: itemOrSection => {
137
- if (isNormalizedPickerSection(itemOrSection)) {
138
+ if (isNormalizedSection(itemOrSection)) {
138
139
  var _itemOrSection$item, _itemOrSection$item2;
139
140
  return /*#__PURE__*/_jsx(Section, {
140
141
  title: (_itemOrSection$item = itemOrSection.item) === null || _itemOrSection$item === void 0 ? void 0 : _itemOrSection$item.title,
141
142
  items: (_itemOrSection$item2 = itemOrSection.item) === null || _itemOrSection$item2 === void 0 ? void 0 : _itemOrSection$item2.items,
142
143
  children: renderItem
143
- }, getPickerItemKey(itemOrSection));
144
+ }, getItemKey(itemOrSection));
144
145
  }
145
146
  return renderItem(itemOrSection);
146
147
  }