@instructure/ui-color-picker 9.0.2-snapshot-2 → 9.0.2-snapshot-4

package/CHANGELOG.md

@@ -3,7 +3,7 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
-## [9.0.2-snapshot-2](https://github.com/instructure/instructure-ui/compare/v9.0.1...v9.0.2-snapshot-2) (2024-05-28)
+## [9.0.2-snapshot-4](https://github.com/instructure/instructure-ui/compare/v9.0.1...v9.0.2-snapshot-4) (2024-06-05)
 
 **Note:** Version bump only for package @instructure/ui-color-picker
 

package/es/ColorContrast/ColorContrastLocator.js

@@ -25,7 +25,7 @@ import { locator } from '@instructure/ui-test-locator';
 import { find } from '@instructure/ui-test-queries';
 
 /* eslint-disable no-restricted-imports */
-// @ts-expect-error bypass no type definition found error
+// @ts-ignore: Cannot find module
 import { PillLocator } from '@instructure/ui-pill/es/Pill/PillLocator';
 /* eslint-enable no-restricted-imports */
 

package/es/ColorContrast/index.js

@@ -1,4 +1,4 @@
-var _dec, _dec2, _class, _class2;
+var _dec, _dec2, _class, _ColorContrast;
 /*
  * The MIT License (MIT)
  *
@@ -43,7 +43,7 @@ import generateComponentTheme from './theme';
 category: components
 ---
 **/
-let ColorContrast = (_dec = withStyle(generateStyle, generateComponentTheme), _dec2 = testable(), _dec(_class = _dec2(_class = (_class2 = class ColorContrast extends Component {
+let ColorContrast = (_dec = withStyle(generateStyle, generateComponentTheme), _dec2 = testable(), _dec(_class = _dec2(_class = (_ColorContrast = class ColorContrast extends Component {
   constructor(props) {
     super(props);
     this.ref = null;
@@ -155,8 +155,8 @@ let ColorContrast = (_dec = withStyle(generateStyle, generateComponentTheme), _d
       size: "x-large"
     }, contrast, ":1"), this.renderPreview(), this.renderStatus(contrast >= 4.5, normalTextLabel), this.renderStatus(contrast >= 3, largeTextLabel), this.renderStatus(contrast >= 3, graphicsTextLabel));
   }
-}, _class2.displayName = "ColorContrast", _class2.propTypes = propTypes, _class2.allowedProps = allowedProps, _class2.componentId = 'ColorContrast', _class2.defaultProps = {
+}, _ColorContrast.displayName = "ColorContrast", _ColorContrast.propTypes = propTypes, _ColorContrast.allowedProps = allowedProps, _ColorContrast.componentId = 'ColorContrast', _ColorContrast.defaultProps = {
   withoutColorPreview: false
-}, _class2)) || _class) || _class);
+}, _ColorContrast)) || _class) || _class);
 export { ColorContrast };
 export default ColorContrast;

package/es/ColorIndicator/index.js

@@ -1,4 +1,4 @@
-var _dec, _dec2, _class, _class2;
+var _dec, _dec2, _class, _ColorIndicator;
 /*
  * The MIT License (MIT)
  *
@@ -37,7 +37,7 @@ import { propTypes, allowedProps } from './props';
 category: components
 ---
 **/
-let ColorIndicator = (_dec = withStyle(generateStyle, generateComponentTheme), _dec2 = testable(), _dec(_class = _dec2(_class = (_class2 = class ColorIndicator extends Component {
+let ColorIndicator = (_dec = withStyle(generateStyle, generateComponentTheme), _dec2 = testable(), _dec(_class = _dec2(_class = (_ColorIndicator = class ColorIndicator extends Component {
   constructor(...args) {
     super(...args);
     this.ref = null;
@@ -64,8 +64,8 @@ let ColorIndicator = (_dec = withStyle(generateStyle, generateComponentTheme), _
       css: styles === null || styles === void 0 ? void 0 : styles.colorIndicator
     }));
   }
-}, _class2.displayName = "ColorIndicator", _class2.propTypes = propTypes, _class2.allowedProps = allowedProps, _class2.componentId = 'ColorIndicator', _class2.defaultProps = {
+}, _ColorIndicator.displayName = "ColorIndicator", _ColorIndicator.propTypes = propTypes, _ColorIndicator.allowedProps = allowedProps, _ColorIndicator.componentId = 'ColorIndicator', _ColorIndicator.defaultProps = {
   shape: 'circle'
-}, _class2)) || _class) || _class);
+}, _ColorIndicator)) || _class) || _class);
 export default ColorIndicator;
 export { ColorIndicator };

package/es/ColorMixer/ColorPalette/index.js

@@ -1,4 +1,4 @@
-var _dec, _dec2, _class, _class2;
+var _dec, _dec2, _class, _ColorPalette;
 /*
  * The MIT License (MIT)
  *
@@ -40,7 +40,7 @@ import generateComponentTheme from './theme';
 private: true
 ---
 **/
-let ColorPalette = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle, generateComponentTheme), _dec(_class = _dec2(_class = (_class2 = class ColorPalette extends Component {
+let ColorPalette = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle, generateComponentTheme), _dec(_class = _dec2(_class = (_ColorPalette = class ColorPalette extends Component {
   constructor(props) {
     var _this$props$styles;
     super(props);
@@ -223,5 +223,5 @@ let ColorPalette = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyl
       }
     }));
   }
-}, _class2.displayName = "ColorPalette", _class2.propTypes = propTypes, _class2.allowedProps = allowedProps, _class2.componentId = 'ColorMixer.Palette', _class2)) || _class) || _class);
+}, _ColorPalette.displayName = "ColorPalette", _ColorPalette.propTypes = propTypes, _ColorPalette.allowedProps = allowedProps, _ColorPalette.componentId = 'ColorMixer.Palette', _ColorPalette)) || _class) || _class);
 export default ColorPalette;

package/es/ColorMixer/RGBAInput/index.js

@@ -1,4 +1,4 @@
-var _dec, _class, _class2, _span;
+var _dec, _class, _RGBAInput, _span;
 /*
  * The MIT License (MIT)
  *
@@ -38,7 +38,7 @@ import generateComponentTheme from './theme';
 private: true
 ---
 **/
-let RGBAInput = (_dec = withStyle(generateStyle, generateComponentTheme), _dec(_class = (_class2 = class RGBAInput extends Component {
+let RGBAInput = (_dec = withStyle(generateStyle, generateComponentTheme), _dec(_class = (_RGBAInput = class RGBAInput extends Component {
   constructor(props) {
     super(props);
     this.ref = null;
@@ -129,7 +129,7 @@ let RGBAInput = (_dec = withStyle(generateStyle, generateComponentTheme), _dec(_
       renderLabel: jsx(ScreenReaderContent, null, this.props.rgbAlphaInputScreenReaderLabel)
     }))));
   }
-}, _class2.displayName = "RGBAInput", _class2.propTypes = propTypes, _class2.allowedProps = allowedProps, _class2.componentId = 'ColorMixer.RGBAInput', _class2.defaultProps = {
+}, _RGBAInput.displayName = "RGBAInput", _RGBAInput.propTypes = propTypes, _RGBAInput.allowedProps = allowedProps, _RGBAInput.componentId = 'ColorMixer.RGBAInput', _RGBAInput.defaultProps = {
   withAlpha: false
-}, _class2)) || _class);
+}, _RGBAInput)) || _class);
 export default RGBAInput;

package/es/ColorMixer/Slider/index.js

@@ -1,4 +1,4 @@
-var _dec, _class, _class2;
+var _dec, _class, _Slider;
 /*
  * The MIT License (MIT)
  *
@@ -37,7 +37,7 @@ import generateComponentTheme from './theme';
 private: true
 ---
 **/
-let Slider = (_dec = withStyle(generateStyle, generateComponentTheme), _dec(_class = (_class2 = class Slider extends Component {
+let Slider = (_dec = withStyle(generateStyle, generateComponentTheme), _dec(_class = (_Slider = class Slider extends Component {
   constructor(...args) {
     super(...args);
     this.ref = null;
@@ -180,7 +180,7 @@ let Slider = (_dec = withStyle(generateStyle, generateComponentTheme), _dec(_cla
       css: (_this$props$styles4 = this.props.styles) === null || _this$props$styles4 === void 0 ? void 0 : _this$props$styles4.slider
     })));
   }
-}, _class2.displayName = "Slider", _class2.propTypes = propTypes, _class2.allowedProps = allowedProps, _class2.componentId = 'ColorMixer.Slider', _class2.defaultProps = {
+}, _Slider.displayName = "Slider", _Slider.propTypes = propTypes, _Slider.allowedProps = allowedProps, _Slider.componentId = 'ColorMixer.Slider', _Slider.defaultProps = {
   isColorSlider: false
-}, _class2)) || _class);
+}, _Slider)) || _class);
 export default Slider;

package/es/ColorMixer/index.js

@@ -1,4 +1,4 @@
-var _dec, _dec2, _class, _class2;
+var _dec, _dec2, _class, _ColorMixer;
 /*
  * The MIT License (MIT)
  *
@@ -41,7 +41,7 @@ import generateStyle from './styles';
 category: components
 ---
 **/
-let ColorMixer = (_dec = withStyle(generateStyle, null), _dec2 = testable(), _dec(_class = _dec2(_class = (_class2 = class ColorMixer extends Component {
+let ColorMixer = (_dec = withStyle(generateStyle, null), _dec2 = testable(), _dec(_class = _dec2(_class = (_ColorMixer = class ColorMixer extends Component {
   constructor(props) {
     super(props);
     this.ref = null;
@@ -205,10 +205,10 @@ let ColorMixer = (_dec = withStyle(generateStyle, null), _dec2 = testable(), _de
       rgbAlphaInputScreenReaderLabel: rgbAlphaInputScreenReaderLabel
     }));
   }
-}, _class2.displayName = "ColorMixer", _class2.propTypes = propTypes, _class2.allowedProps = allowedProps, _class2.componentId = 'ColorMixer', _class2.defaultProps = {
+}, _ColorMixer.displayName = "ColorMixer", _ColorMixer.propTypes = propTypes, _ColorMixer.allowedProps = allowedProps, _ColorMixer.componentId = 'ColorMixer', _ColorMixer.defaultProps = {
   value: '#000',
   withAlpha: false,
   disabled: false
-}, _class2)) || _class) || _class);
+}, _ColorMixer)) || _class) || _class);
 export { ColorMixer };
 export default ColorMixer;

package/es/ColorPicker/ColorPickerLocator.js

@@ -26,7 +26,7 @@ import { find, findAll, parseQueryArguments, findWithText, within } from '@instr
 import { ColorPicker } from '.';
 
 /* eslint-disable no-restricted-imports */
-// @ts-expect-error bypass no type definition found error
+// @ts-ignore: Cannot find module
 import { PopoverLocator } from '@instructure/ui-popover/es/Popover/PopoverLocator';
 /* eslint-enable no-restricted-imports */
 

package/es/ColorPicker/index.js

@@ -1,4 +1,4 @@
-var _dec, _dec2, _class, _class2, _IconTroubleLine, _IconWarningLine, _IconCheckDarkLine, _IconInfoLine;
+var _dec, _dec2, _class, _ColorPicker, _IconTroubleLine, _IconWarningLine, _IconCheckDarkLine, _IconInfoLine;
 /*
  * The MIT License (MIT)
  *
@@ -50,7 +50,7 @@ const acceptedCharactersForHEX = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '
 category: components
 ---
 **/
-let ColorPicker = (_dec = withStyle(generateStyle, generateComponentTheme), _dec2 = testable(), _dec(_class = _dec2(_class = (_class2 = class ColorPicker extends Component {
+let ColorPicker = (_dec = withStyle(generateStyle, generateComponentTheme), _dec2 = testable(), _dec(_class = _dec2(_class = (_ColorPicker = class ColorPicker extends Component {
   constructor(props) {
     super(props);
     this.ref = null;
@@ -428,11 +428,11 @@ let ColorPicker = (_dec = withStyle(generateStyle, generateComponentTheme), _dec
       css: (_this$props$styles8 = this.props.styles) === null || _this$props$styles8 === void 0 ? void 0 : _this$props$styles8.colorMixerButtonWrapper
     }, this.renderPopover())));
   }
-}, _class2.displayName = "ColorPicker", _class2.propTypes = propTypes, _class2.allowedProps = allowedProps, _class2.componentId = 'ColorPicker', _class2.defaultProps = {
+}, _ColorPicker.displayName = "ColorPicker", _ColorPicker.propTypes = propTypes, _ColorPicker.allowedProps = allowedProps, _ColorPicker.componentId = 'ColorPicker', _ColorPicker.defaultProps = {
   disabled: false,
   withAlpha: false,
   width: '22.5rem',
   popoverMaxHeight: '100vh'
-}, _class2)) || _class) || _class);
+}, _ColorPicker)) || _class) || _class);
 export { ColorPicker };
 export default ColorPicker;

package/es/ColorPreset/ColorPresetLocator.js

@@ -25,18 +25,18 @@ import { locator } from '@instructure/ui-test-locator';
 import { find } from '@instructure/ui-test-queries';
 
 /* eslint-disable no-restricted-imports */
-// @ts-expect-error bypass no type definition found error
+// @ts-ignore: Cannot find module
 import { DrilldownLocator } from '@instructure/ui-drilldown/es/Drilldown/DrilldownLocator';
-// @ts-expect-error bypass no type definition found error
+// @ts-ignore: Cannot find module
 import { TooltipLocator } from '@instructure/ui-tooltip/es/Tooltip/TooltipLocator';
-// @ts-expect-error bypass no type definition found error
+// @ts-ignore: Cannot find module
 import { PopoverLocator } from '@instructure/ui-popover/es/Popover/PopoverLocator';
 /* eslint-enable no-restricted-imports */
 
 import { ColorIndicatorLocator } from '../ColorIndicator/ColorIndicatorLocator';
 import { ColorPreset } from './index';
 
-// @ts-expect-error ts-migrate(2339) FIXME: Property 'selector' does not exist on type 'typeof... Remove this comment to see the full error message
+// @ts-ignore: The inferred type exceeds the maximum the compiler will serialize
 export const ColorPresetLocator = locator(ColorPreset.selector, {
   findAllColorIndicators: (...args) => {
     return ColorIndicatorLocator.findAll(...args);

package/es/ColorPreset/index.js

@@ -1,4 +1,4 @@
-var _dec, _dec2, _class, _class2, _IconAddLine;
+var _dec, _dec2, _class, _ColorPreset, _IconAddLine;
 /*
  * The MIT License (MIT)
  *
@@ -48,7 +48,7 @@ import { propTypes, allowedProps } from './props';
 category: components
 ---
 **/
-let ColorPreset = (_dec = withStyle(generateStyle, generateComponentTheme), _dec2 = testable(), _dec(_class = _dec2(_class = (_class2 = class ColorPreset extends Component {
+let ColorPreset = (_dec = withStyle(generateStyle, generateComponentTheme), _dec2 = testable(), _dec(_class = _dec2(_class = (_ColorPreset = class ColorPreset extends Component {
   constructor(props) {
     super(props);
     this.ref = null;
@@ -245,8 +245,8 @@ let ColorPreset = (_dec = withStyle(generateStyle, generateComponentTheme), _dec
       }, this.renderColorIndicator(color, true));
     }));
   }
-}, _class2.displayName = "ColorPreset", _class2.propTypes = propTypes, _class2.allowedProps = allowedProps, _class2.componentId = 'ColorPreset', _class2.defaultProps = {
+}, _ColorPreset.displayName = "ColorPreset", _ColorPreset.propTypes = propTypes, _ColorPreset.allowedProps = allowedProps, _ColorPreset.componentId = 'ColorPreset', _ColorPreset.defaultProps = {
   disabled: false
-}, _class2)) || _class) || _class);
+}, _ColorPreset)) || _class) || _class);
 export { ColorPreset };
 export default ColorPreset;

package/lib/ColorContrast/ColorContrastLocator.js

@@ -33,7 +33,7 @@ var _index = require("./index");
  */
 
 /* eslint-disable no-restricted-imports */
-// @ts-expect-error bypass no type definition found error
+// @ts-ignore: Cannot find module
 
 /* eslint-enable no-restricted-imports */
 

package/lib/ColorContrast/index.js

@@ -18,7 +18,7 @@ var _ColorIndicator = _interopRequireDefault(require("../ColorIndicator"));
 var _props = require("./props");
 var _styles = _interopRequireDefault(require("./styles"));
 var _theme = _interopRequireDefault(require("./theme"));
-var _dec, _dec2, _class, _class2;
+var _dec, _dec2, _class, _ColorContrast;
 /*
  * The MIT License (MIT)
  *
@@ -49,7 +49,7 @@ var _dec, _dec2, _class, _class2;
 category: components
 ---
 **/
-let ColorContrast = exports.ColorContrast = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec2 = (0, _testable.testable)(), _dec(_class = _dec2(_class = (_class2 = class ColorContrast extends _react.Component {
+let ColorContrast = exports.ColorContrast = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec2 = (0, _testable.testable)(), _dec(_class = _dec2(_class = (_ColorContrast = class ColorContrast extends _react.Component {
   constructor(props) {
     super(props);
     this.ref = null;
@@ -161,7 +161,7 @@ let ColorContrast = exports.ColorContrast = (_dec = (0, _emotion.withStyle)(_sty
       size: "x-large"
     }, contrast, ":1"), this.renderPreview(), this.renderStatus(contrast >= 4.5, normalTextLabel), this.renderStatus(contrast >= 3, largeTextLabel), this.renderStatus(contrast >= 3, graphicsTextLabel));
   }
-}, _class2.displayName = "ColorContrast", _class2.propTypes = _props.propTypes, _class2.allowedProps = _props.allowedProps, _class2.componentId = 'ColorContrast', _class2.defaultProps = {
+}, _ColorContrast.displayName = "ColorContrast", _ColorContrast.propTypes = _props.propTypes, _ColorContrast.allowedProps = _props.allowedProps, _ColorContrast.componentId = 'ColorContrast', _ColorContrast.defaultProps = {
   withoutColorPreview: false
-}, _class2)) || _class) || _class);
+}, _ColorContrast)) || _class) || _class);
 var _default = exports.default = ColorContrast;

package/lib/ColorIndicator/index.js

@@ -12,7 +12,7 @@ var _emotion = require("@instructure/emotion");
 var _styles = _interopRequireDefault(require("./styles"));
 var _theme = _interopRequireDefault(require("./theme"));
 var _props = require("./props");
-var _dec, _dec2, _class, _class2;
+var _dec, _dec2, _class, _ColorIndicator;
 /*
  * The MIT License (MIT)
  *
@@ -42,7 +42,7 @@ var _dec, _dec2, _class, _class2;
 category: components
 ---
 **/
-let ColorIndicator = exports.ColorIndicator = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec2 = (0, _testable.testable)(), _dec(_class = _dec2(_class = (_class2 = class ColorIndicator extends _react.Component {
+let ColorIndicator = exports.ColorIndicator = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec2 = (0, _testable.testable)(), _dec(_class = _dec2(_class = (_ColorIndicator = class ColorIndicator extends _react.Component {
   constructor(...args) {
     super(...args);
     this.ref = null;
@@ -69,7 +69,7 @@ let ColorIndicator = exports.ColorIndicator = (_dec = (0, _emotion.withStyle)(_s
       css: styles === null || styles === void 0 ? void 0 : styles.colorIndicator
     }));
   }
-}, _class2.displayName = "ColorIndicator", _class2.propTypes = _props.propTypes, _class2.allowedProps = _props.allowedProps, _class2.componentId = 'ColorIndicator', _class2.defaultProps = {
+}, _ColorIndicator.displayName = "ColorIndicator", _ColorIndicator.propTypes = _props.propTypes, _ColorIndicator.allowedProps = _props.allowedProps, _ColorIndicator.componentId = 'ColorIndicator', _ColorIndicator.defaultProps = {
   shape: 'circle'
-}, _class2)) || _class) || _class);
+}, _ColorIndicator)) || _class) || _class);
 var _default = exports.default = ColorIndicator;

package/lib/ColorMixer/ColorPalette/index.js

@@ -16,7 +16,7 @@ var _shallowCompare = _interopRequireDefault(require("../utils/shallowCompare"))
 var _props = require("./props");
 var _styles = _interopRequireDefault(require("./styles"));
 var _theme = _interopRequireDefault(require("./theme"));
-var _dec, _dec2, _class, _class2;
+var _dec, _dec2, _class, _ColorPalette;
 /*
  * The MIT License (MIT)
  *
@@ -46,7 +46,7 @@ var _dec, _dec2, _class, _class2;
 private: true
 ---
 **/
-let ColorPalette = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec2 = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec(_class = _dec2(_class = (_class2 = class ColorPalette extends _react.Component {
+let ColorPalette = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec2 = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec(_class = _dec2(_class = (_ColorPalette = class ColorPalette extends _react.Component {
   constructor(props) {
     var _this$props$styles;
     super(props);
@@ -229,5 +229,5 @@ let ColorPalette = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec
       }
     }));
   }
-}, _class2.displayName = "ColorPalette", _class2.propTypes = _props.propTypes, _class2.allowedProps = _props.allowedProps, _class2.componentId = 'ColorMixer.Palette', _class2)) || _class) || _class);
+}, _ColorPalette.displayName = "ColorPalette", _ColorPalette.propTypes = _props.propTypes, _ColorPalette.allowedProps = _props.allowedProps, _ColorPalette.componentId = 'ColorMixer.Palette', _ColorPalette)) || _class) || _class);
 var _default = exports.default = ColorPalette;

package/lib/ColorMixer/RGBAInput/index.js

@@ -14,7 +14,7 @@ var _TextInput = require("@instructure/ui-text-input/lib/TextInput");
 var _props = require("./props");
 var _styles = _interopRequireDefault(require("./styles"));
 var _theme = _interopRequireDefault(require("./theme"));
-var _dec, _class, _class2, _span;
+var _dec, _class, _RGBAInput, _span;
 /*
  * The MIT License (MIT)
  *
@@ -44,7 +44,7 @@ var _dec, _class, _class2, _span;
 private: true
 ---
 **/
-let RGBAInput = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec(_class = (_class2 = class RGBAInput extends _react.Component {
+let RGBAInput = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec(_class = (_RGBAInput = class RGBAInput extends _react.Component {
   constructor(props) {
     super(props);
     this.ref = null;
@@ -135,7 +135,7 @@ let RGBAInput = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default)
       renderLabel: (0, _emotion.jsx)(_ScreenReaderContent.ScreenReaderContent, null, this.props.rgbAlphaInputScreenReaderLabel)
     }))));
   }
-}, _class2.displayName = "RGBAInput", _class2.propTypes = _props.propTypes, _class2.allowedProps = _props.allowedProps, _class2.componentId = 'ColorMixer.RGBAInput', _class2.defaultProps = {
+}, _RGBAInput.displayName = "RGBAInput", _RGBAInput.propTypes = _props.propTypes, _RGBAInput.allowedProps = _props.allowedProps, _RGBAInput.componentId = 'ColorMixer.RGBAInput', _RGBAInput.defaultProps = {
   withAlpha: false
-}, _class2)) || _class);
+}, _RGBAInput)) || _class);
 var _default = exports.default = RGBAInput;

package/lib/ColorMixer/Slider/index.js

@@ -13,7 +13,7 @@ var _View = require("@instructure/ui-view/lib/View");
 var _props = require("./props");
 var _styles = _interopRequireDefault(require("./styles"));
 var _theme = _interopRequireDefault(require("./theme"));
-var _dec, _class, _class2;
+var _dec, _class, _Slider;
 /*
  * The MIT License (MIT)
  *
@@ -43,7 +43,7 @@ var _dec, _class, _class2;
 private: true
 ---
 **/
-let Slider = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec(_class = (_class2 = class Slider extends _react.Component {
+let Slider = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec(_class = (_Slider = class Slider extends _react.Component {
   constructor(...args) {
     super(...args);
     this.ref = null;
@@ -186,7 +186,7 @@ let Slider = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _
       css: (_this$props$styles4 = this.props.styles) === null || _this$props$styles4 === void 0 ? void 0 : _this$props$styles4.slider
     })));
   }
-}, _class2.displayName = "Slider", _class2.propTypes = _props.propTypes, _class2.allowedProps = _props.allowedProps, _class2.componentId = 'ColorMixer.Slider', _class2.defaultProps = {
+}, _Slider.displayName = "Slider", _Slider.propTypes = _props.propTypes, _Slider.allowedProps = _props.allowedProps, _Slider.componentId = 'ColorMixer.Slider', _Slider.defaultProps = {
   isColorSlider: false
-}, _class2)) || _class);
+}, _Slider)) || _class);
 var _default = exports.default = Slider;

package/lib/ColorMixer/index.js

@@ -16,7 +16,7 @@ var _Slider = _interopRequireDefault(require("./Slider"));
 var _RGBAInput = _interopRequireDefault(require("./RGBAInput"));
 var _props = require("./props");
 var _styles = _interopRequireDefault(require("./styles"));
-var _dec, _dec2, _class, _class2;
+var _dec, _dec2, _class, _ColorMixer;
 /*
  * The MIT License (MIT)
  *
@@ -46,7 +46,7 @@ var _dec, _dec2, _class, _class2;
 category: components
 ---
 **/
-let ColorMixer = exports.ColorMixer = (_dec = (0, _emotion.withStyle)(_styles.default, null), _dec2 = (0, _testable.testable)(), _dec(_class = _dec2(_class = (_class2 = class ColorMixer extends _react.Component {
+let ColorMixer = exports.ColorMixer = (_dec = (0, _emotion.withStyle)(_styles.default, null), _dec2 = (0, _testable.testable)(), _dec(_class = _dec2(_class = (_ColorMixer = class ColorMixer extends _react.Component {
   constructor(props) {
     super(props);
     this.ref = null;
@@ -210,9 +210,9 @@ let ColorMixer = exports.ColorMixer = (_dec = (0, _emotion.withStyle)(_styles.de
       rgbAlphaInputScreenReaderLabel: rgbAlphaInputScreenReaderLabel
     }));
   }
-}, _class2.displayName = "ColorMixer", _class2.propTypes = _props.propTypes, _class2.allowedProps = _props.allowedProps, _class2.componentId = 'ColorMixer', _class2.defaultProps = {
+}, _ColorMixer.displayName = "ColorMixer", _ColorMixer.propTypes = _props.propTypes, _ColorMixer.allowedProps = _props.allowedProps, _ColorMixer.componentId = 'ColorMixer', _ColorMixer.defaultProps = {
   value: '#000',
   withAlpha: false,
   disabled: false
-}, _class2)) || _class) || _class);
+}, _ColorMixer)) || _class) || _class);
 var _default = exports.default = ColorMixer;

package/lib/ColorPicker/ColorPickerLocator.js

@@ -35,8 +35,11 @@ var _ColorPresetLocator = require("../ColorPreset/ColorPresetLocator");
  * SOFTWARE.
  */
 
-/* eslint-disable no-restricted-imports */ // @ts-expect-error bypass no type definition found error
+/* eslint-disable no-restricted-imports */
+// @ts-ignore: Cannot find module
+
 /* eslint-enable no-restricted-imports */
+
 async function _findColorPreset(...args) {
   const popoverContent = await _PopoverLocator.PopoverLocator.findContent(...args);
   const colorPreset = await _ColorPresetLocator.ColorPresetLocator.find(popoverContent.getDOMNode());

package/lib/ColorPicker/index.js

@@ -29,7 +29,7 @@ var _ColorPreset = _interopRequireDefault(require("../ColorPreset"));
 var _styles = _interopRequireDefault(require("./styles"));
 var _theme = _interopRequireDefault(require("./theme"));
 var _props = require("./props");
-var _dec, _dec2, _class, _class2, _IconTroubleLine, _IconWarningLine, _IconCheckDarkLine, _IconInfoLine;
+var _dec, _dec2, _class, _ColorPicker, _IconTroubleLine, _IconWarningLine, _IconCheckDarkLine, _IconInfoLine;
 /*
  * The MIT License (MIT)
  *
@@ -62,7 +62,7 @@ const acceptedCharactersForHEX = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '
 category: components
 ---
 **/
-let ColorPicker = exports.ColorPicker = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec2 = (0, _testable.testable)(), _dec(_class = _dec2(_class = (_class2 = class ColorPicker extends _react.Component {
+let ColorPicker = exports.ColorPicker = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec2 = (0, _testable.testable)(), _dec(_class = _dec2(_class = (_ColorPicker = class ColorPicker extends _react.Component {
   constructor(props) {
     super(props);
     this.ref = null;
@@ -440,10 +440,10 @@ let ColorPicker = exports.ColorPicker = (_dec = (0, _emotion.withStyle)(_styles.
       css: (_this$props$styles8 = this.props.styles) === null || _this$props$styles8 === void 0 ? void 0 : _this$props$styles8.colorMixerButtonWrapper
     }, this.renderPopover())));
   }
-}, _class2.displayName = "ColorPicker", _class2.propTypes = _props.propTypes, _class2.allowedProps = _props.allowedProps, _class2.componentId = 'ColorPicker', _class2.defaultProps = {
+}, _ColorPicker.displayName = "ColorPicker", _ColorPicker.propTypes = _props.propTypes, _ColorPicker.allowedProps = _props.allowedProps, _ColorPicker.componentId = 'ColorPicker', _ColorPicker.defaultProps = {
   disabled: false,
   withAlpha: false,
   width: '22.5rem',
   popoverMaxHeight: '100vh'
-}, _class2)) || _class) || _class);
+}, _ColorPicker)) || _class) || _class);
 var _default = exports.default = ColorPicker;

package/lib/ColorPreset/ColorPresetLocator.js

@@ -36,15 +36,15 @@ var _index = require("./index");
  */
 
 /* eslint-disable no-restricted-imports */
-// @ts-expect-error bypass no type definition found error
+// @ts-ignore: Cannot find module
 
-// @ts-expect-error bypass no type definition found error
+// @ts-ignore: Cannot find module
 
-// @ts-expect-error bypass no type definition found error
+// @ts-ignore: Cannot find module
 
 /* eslint-enable no-restricted-imports */
 
-// @ts-expect-error ts-migrate(2339) FIXME: Property 'selector' does not exist on type 'typeof... Remove this comment to see the full error message
+// @ts-ignore: The inferred type exceeds the maximum the compiler will serialize
 const ColorPresetLocator = exports.ColorPresetLocator = (0, _locator.locator)(_index.ColorPreset.selector, {
   findAllColorIndicators: (...args) => {
     return _ColorIndicatorLocator.ColorIndicatorLocator.findAll(...args);

package/lib/ColorPreset/index.js

@@ -25,7 +25,7 @@ var _ColorContrast = require("../ColorContrast");
 var _styles = _interopRequireDefault(require("./styles"));
 var _theme = _interopRequireDefault(require("./theme"));
 var _props = require("./props");
-var _dec, _dec2, _class, _class2, _IconAddLine;
+var _dec, _dec2, _class, _ColorPreset, _IconAddLine;
 /*
  * The MIT License (MIT)
  *
@@ -55,7 +55,7 @@ var _dec, _dec2, _class, _class2, _IconAddLine;
 category: components
 ---
 **/
-let ColorPreset = exports.ColorPreset = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec2 = (0, _testable.testable)(), _dec(_class = _dec2(_class = (_class2 = class ColorPreset extends _react.Component {
+let ColorPreset = exports.ColorPreset = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec2 = (0, _testable.testable)(), _dec(_class = _dec2(_class = (_ColorPreset = class ColorPreset extends _react.Component {
   constructor(props) {
     super(props);
     this.ref = null;
@@ -252,7 +252,7 @@ let ColorPreset = exports.ColorPreset = (_dec = (0, _emotion.withStyle)(_styles.
       }, this.renderColorIndicator(color, true));
     }));
   }
-}, _class2.displayName = "ColorPreset", _class2.propTypes = _props.propTypes, _class2.allowedProps = _props.allowedProps, _class2.componentId = 'ColorPreset', _class2.defaultProps = {
+}, _ColorPreset.displayName = "ColorPreset", _ColorPreset.propTypes = _props.propTypes, _ColorPreset.allowedProps = _props.allowedProps, _ColorPreset.componentId = 'ColorPreset', _ColorPreset.defaultProps = {
   disabled: false
-}, _class2)) || _class) || _class);
+}, _ColorPreset)) || _class) || _class);
 var _default = exports.default = ColorPreset;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instructure/ui-color-picker",
-  "version": "9.0.2-snapshot-2",
+  "version": "9.0.2-snapshot-4",
   "description": "A UI component library made by Instructure Inc.",
   "author": "Instructure, Inc. Engineering and Product Design",
   "module": "./es/index.js",
@@ -23,34 +23,34 @@
   },
   "license": "MIT",
   "dependencies": {
-    "@babel/runtime": "^7.23.2",
-    "@instructure/console": "9.0.2-snapshot-2",
-    "@instructure/emotion": "9.0.2-snapshot-2",
-    "@instructure/shared-types": "9.0.2-snapshot-2",
-    "@instructure/ui-a11y-content": "9.0.2-snapshot-2",
-    "@instructure/ui-buttons": "9.0.2-snapshot-2",
-    "@instructure/ui-color-utils": "9.0.2-snapshot-2",
-    "@instructure/ui-dom-utils": "9.0.2-snapshot-2",
-    "@instructure/ui-drilldown": "9.0.2-snapshot-2",
-    "@instructure/ui-form-field": "9.0.2-snapshot-2",
-    "@instructure/ui-icons": "9.0.2-snapshot-2",
-    "@instructure/ui-pill": "9.0.2-snapshot-2",
-    "@instructure/ui-popover": "9.0.2-snapshot-2",
-    "@instructure/ui-react-utils": "9.0.2-snapshot-2",
-    "@instructure/ui-testable": "9.0.2-snapshot-2",
-    "@instructure/ui-text": "9.0.2-snapshot-2",
-    "@instructure/ui-text-input": "9.0.2-snapshot-2",
-    "@instructure/ui-themes": "9.0.2-snapshot-2",
-    "@instructure/ui-tooltip": "9.0.2-snapshot-2",
-    "@instructure/ui-utils": "9.0.2-snapshot-2",
-    "@instructure/ui-view": "9.0.2-snapshot-2",
+    "@babel/runtime": "^7.24.5",
+    "@instructure/console": "9.0.2-snapshot-4",
+    "@instructure/emotion": "9.0.2-snapshot-4",
+    "@instructure/shared-types": "9.0.2-snapshot-4",
+    "@instructure/ui-a11y-content": "9.0.2-snapshot-4",
+    "@instructure/ui-buttons": "9.0.2-snapshot-4",
+    "@instructure/ui-color-utils": "9.0.2-snapshot-4",
+    "@instructure/ui-dom-utils": "9.0.2-snapshot-4",
+    "@instructure/ui-drilldown": "9.0.2-snapshot-4",
+    "@instructure/ui-form-field": "9.0.2-snapshot-4",
+    "@instructure/ui-icons": "9.0.2-snapshot-4",
+    "@instructure/ui-pill": "9.0.2-snapshot-4",
+    "@instructure/ui-popover": "9.0.2-snapshot-4",
+    "@instructure/ui-react-utils": "9.0.2-snapshot-4",
+    "@instructure/ui-testable": "9.0.2-snapshot-4",
+    "@instructure/ui-text": "9.0.2-snapshot-4",
+    "@instructure/ui-text-input": "9.0.2-snapshot-4",
+    "@instructure/ui-themes": "9.0.2-snapshot-4",
+    "@instructure/ui-tooltip": "9.0.2-snapshot-4",
+    "@instructure/ui-utils": "9.0.2-snapshot-4",
+    "@instructure/ui-view": "9.0.2-snapshot-4",
     "prop-types": "^15.8.1"
   },
   "devDependencies": {
-    "@instructure/ui-babel-preset": "9.0.2-snapshot-2",
-    "@instructure/ui-test-locator": "9.0.2-snapshot-2",
-    "@instructure/ui-test-queries": "9.0.2-snapshot-2",
-    "@instructure/ui-test-utils": "9.0.2-snapshot-2"
+    "@instructure/ui-babel-preset": "9.0.2-snapshot-4",
+    "@instructure/ui-test-locator": "9.0.2-snapshot-4",
+    "@instructure/ui-test-queries": "9.0.2-snapshot-4",
+    "@instructure/ui-test-utils": "9.0.2-snapshot-4"
   },
   "peerDependencies": {
     "react": ">=16.8 <=18"

package/src/ColorContrast/ColorContrastLocator.ts

@@ -25,7 +25,7 @@ import { locator } from '@instructure/ui-test-locator'
 import { find } from '@instructure/ui-test-queries'
 
 /* eslint-disable no-restricted-imports */
-// @ts-expect-error bypass no type definition found error
+// @ts-ignore: Cannot find module
 import { PillLocator } from '@instructure/ui-pill/es/Pill/PillLocator'
 /* eslint-enable no-restricted-imports */