@zendeskgarden/react-colorpickers 9.12.3 → 9.12.4

package/dist/esm/elements/ColorPicker/ColorWell.js

@@ -32,13 +32,12 @@ import '../../styled/ColorSwatch/StyledColorSwatchLabel.js';
 import '../../styled/ColorSwatch/StyledIcon.js';
 import '../../styled/ColorSwatch/StyledCell.js';
 
-const ColorWell = React__default.memo(_ref => {
-  let {
-    hue,
-    saturation,
-    lightness,
-    onChange
-  } = _ref;
+const ColorWell = React__default.memo(({
+  hue,
+  saturation,
+  lightness,
+  onChange
+}) => {
   const {
     rtl
   } = useContext(ThemeContext);

package/dist/esm/elements/ColorPicker/index.js

@@ -32,16 +32,15 @@ import '../../styled/ColorSwatch/StyledIcon.js';
 import '../../styled/ColorSwatch/StyledCell.js';
 import { reducer, getInitialState, convertStringToColor, areColorsEqual } from './reducer.js';
 
-const ColorPicker = forwardRef((_ref, ref) => {
-  let {
-    color,
-    defaultColor = '#fff',
-    isOpaque,
-    labels = {},
-    autofocus,
-    onChange,
-    ...props
-  } = _ref;
+const ColorPicker = forwardRef(({
+  color,
+  defaultColor = '#fff',
+  isOpaque,
+  labels = {},
+  autofocus,
+  onChange,
+  ...props
+}, ref) => {
   const [state, dispatch] = useReducer(reducer, getInitialState(color || defaultColor));
   const previousComputedColorRef = useRef(state.color);
   const previousStateColorRef = useRef(state.color);

package/dist/esm/elements/ColorPicker/reducer.js

@@ -5,7 +5,7 @@
 * found at http://www.apache.org/licenses/LICENSE-2.0.
 */
 import isEqual from 'lodash.isequal';
-import { parseToHsl, parseToRgb, rgb, hsl } from 'polished';
+import { parseToHsl, rgb, parseToRgb, hsl } from 'polished';
 import { hsvToHsl } from '../../utils/conversion.js';
 import { isValidHex } from '../../utils/validation.js';
 

package/dist/esm/elements/ColorPickerDialog/index.js

@@ -36,27 +36,26 @@ import '../../styled/ColorSwatch/StyledIcon.js';
 import '../../styled/ColorSwatch/StyledCell.js';
 import { useText, DEFAULT_THEME } from '@zendeskgarden/react-theming';
 
-const ColorPickerDialog = forwardRef((_ref, ref) => {
-  let {
-    color,
-    defaultColor,
-    placement = 'bottom-start',
-    onChange,
-    onClose,
-    labels,
-    hasArrow = false,
-    isAnimated = true,
-    isOpaque,
-    isOpen,
-    zIndex = 1000,
-    focusInset,
-    disabled,
-    buttonProps,
-    onDialogChange,
-    'aria-label': ariaLabel,
-    children,
-    ...props
-  } = _ref;
+const ColorPickerDialog = forwardRef(({
+  color,
+  defaultColor,
+  placement = 'bottom-start',
+  onChange,
+  onClose,
+  labels,
+  hasArrow = false,
+  isAnimated = true,
+  isOpaque,
+  isOpen,
+  zIndex = 1000,
+  focusInset,
+  disabled,
+  buttonProps,
+  onDialogChange,
+  'aria-label': ariaLabel,
+  children,
+  ...props
+}, ref) => {
   const isControlled = color !== null && color !== undefined;
   const isDialogControlled = isOpen !== undefined && isOpen !== null;
   const buttonRef = useRef(null);
@@ -69,15 +68,17 @@ const ColorPickerDialog = forwardRef((_ref, ref) => {
   const theme = useTheme() || DEFAULT_THEME;
   const openDialog = () => {
     setReferenceElement(buttonRef.current);
-    onDialogChange && onDialogChange({
+    onDialogChange?.({
       isOpen: true
     });
   };
   const closeDialog = () => {
-    setReferenceElement(null);
-    onDialogChange && onDialogChange({
-      isOpen: false
-    });
+    if (referenceElement) {
+      setReferenceElement(null);
+      onDialogChange?.({
+        isOpen: false
+      });
+    }
   };
   const onClick = composeEventHandlers(props.onClick, () => {
     if (referenceElement) {
@@ -118,7 +119,7 @@ const ColorPickerDialog = forwardRef((_ref, ref) => {
     referenceElement: referenceElement,
     onClose: () => {
       closeDialog();
-      onClose && onClose(isControlled ? color : uncontrolledColor);
+      onClose?.(isControlled ? color : uncontrolledColor);
     },
     "aria-label": ariaLabelText
   }, props), React__default.createElement(StyledTooltipBody, null, React__default.createElement(ColorPicker, {

package/dist/esm/elements/ColorSwatch/index.js

@@ -36,18 +36,17 @@ import { StyledColorSwatchLabel } from '../../styled/ColorSwatch/StyledColorSwat
 import { StyledIcon } from '../../styled/ColorSwatch/StyledIcon.js';
 import { StyledCell } from '../../styled/ColorSwatch/StyledCell.js';
 
-const ColorSwatch = forwardRef((_ref, ref) => {
-  let {
-    name,
-    colors,
-    isCheckboxGroup,
-    defaultSelectedColIndex,
-    defaultSelectedRowIndex,
-    selectedColIndex,
-    selectedRowIndex,
-    onSelect,
-    ...props
-  } = _ref;
+const ColorSwatch = forwardRef(({
+  name,
+  colors,
+  isCheckboxGroup,
+  defaultSelectedColIndex,
+  defaultSelectedRowIndex,
+  selectedColIndex,
+  selectedRowIndex,
+  onSelect,
+  ...props
+}, ref) => {
   const theme = useContext(ThemeContext) || DEFAULT_THEME;
   const environment = useDocument(theme);
   const gridRef = useRef();

package/dist/esm/elements/ColorSwatchDialog/index.js

@@ -36,29 +36,28 @@ import '../../styled/ColorSwatch/StyledColorSwatchLabel.js';
 import '../../styled/ColorSwatch/StyledIcon.js';
 import '../../styled/ColorSwatch/StyledCell.js';
 
-const ColorSwatchDialog = forwardRef((_ref, ref) => {
-  let {
-    name,
-    colors,
-    isCheckboxGroup,
-    selectedRowIndex,
-    selectedColIndex,
-    defaultSelectedRowIndex,
-    defaultSelectedColIndex,
-    placement = 'bottom-start',
-    onSelect,
-    hasArrow = false,
-    isAnimated = true,
-    zIndex = 1000,
-    isOpen,
-    focusInset,
-    disabled,
-    buttonProps,
-    onDialogChange,
-    children,
-    'aria-label': ariaLabel,
-    ...props
-  } = _ref;
+const ColorSwatchDialog = forwardRef(({
+  name,
+  colors,
+  isCheckboxGroup,
+  selectedRowIndex,
+  selectedColIndex,
+  defaultSelectedRowIndex,
+  defaultSelectedColIndex,
+  placement = 'bottom-start',
+  onSelect,
+  hasArrow = false,
+  isAnimated = true,
+  zIndex = 1000,
+  isOpen,
+  focusInset,
+  disabled,
+  buttonProps,
+  onDialogChange,
+  children,
+  'aria-label': ariaLabel,
+  ...props
+}, ref) => {
   const isControlled = selectedRowIndex !== undefined && selectedColIndex !== undefined;
   const isDialogControlled = isOpen !== undefined && isOpen !== null;
   const buttonRef = useRef(null);
@@ -89,15 +88,17 @@ const ColorSwatchDialog = forwardRef((_ref, ref) => {
   }, [isOpen, isDialogControlled]);
   const openDialog = () => {
     setReferenceElement(buttonRef.current);
-    onDialogChange && onDialogChange({
+    onDialogChange?.({
       isOpen: true
     });
   };
   const closeDialog = () => {
-    setReferenceElement(null);
-    onDialogChange && onDialogChange({
-      isOpen: false
-    });
+    if (referenceElement) {
+      setReferenceElement(null);
+      onDialogChange?.({
+        isOpen: false
+      });
+    }
   };
   const onClick = composeEventHandlers(props.onClick, () => {
     if (referenceElement) {

package/dist/esm/node_modules/@zendeskgarden/svg-icons/src/16/chevron-down-stroke.svg.js

@@ -6,17 +6,17 @@
 */
 import * as React from 'react';
 
-var _path;
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+var _path$1;
+function _extends$1() { return _extends$1 = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$1.apply(null, arguments); }
 var SvgChevronDownStroke = function SvgChevronDownStroke(props) {
-  return /*#__PURE__*/React.createElement("svg", _extends({
+  return /*#__PURE__*/React.createElement("svg", _extends$1({
     xmlns: "http://www.w3.org/2000/svg",
     width: 16,
     height: 16,
     focusable: "false",
     viewBox: "0 0 16 16",
     "aria-hidden": "true"
-  }, props), _path || (_path = /*#__PURE__*/React.createElement("path", {
+  }, props), _path$1 || (_path$1 = /*#__PURE__*/React.createElement("path", {
     fill: "currentColor",
     d: "M12.688 5.61a.5.5 0 01.69.718l-.066.062-5 4a.5.5 0 01-.542.054l-.082-.054-5-4a.5.5 0 01.55-.83l.074.05L8 9.359l4.688-3.75z"
   })));

package/dist/esm/styled/ColorPicker/StyledAlphaRange.js

@@ -8,8 +8,8 @@ import styled from 'styled-components';
 import { getCheckeredBackground } from '@zendeskgarden/react-theming';
 import { StyledRange, getTrackMargin, getTrackHeight } from '../common/StyledRange.js';
 
-const COMPONENT_ID = 'colorpickers.colorpicker_alpha';
-const background = props => {
+const COMPONENT_ID$i = 'colorpickers.colorpicker_alpha';
+const background$3 = props => {
   const direction = `to ${props.theme.rtl ? 'left' : 'right'}`;
   const fromColor = `rgba(${props.$red}, ${props.$green}, ${props.$blue}, 0)`;
   const toColor = `rgb(${props.$red}, ${props.$green}, ${props.$blue})`;
@@ -27,10 +27,10 @@ const background = props => {
 const StyledAlphaRange = styled(StyledRange).attrs(props => ({
   style: {
     backgroundSize: 'auto',
-    background: background(props)
+    background: background$3(props)
   },
-  'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.12.3'
+  'data-garden-id': COMPONENT_ID$i,
+  'data-garden-version': '9.12.4'
 })).withConfig({
   displayName: "StyledAlphaRange",
   componentId: "sc-1f6hp2j-0"

package/dist/esm/styled/ColorPicker/StyledColorPicker.js

@@ -7,13 +7,13 @@
 import styled from 'styled-components';
 import { componentStyles } from '@zendeskgarden/react-theming';
 
-const COMPONENT_ID = 'colorpickers.colorpicker';
+const COMPONENT_ID$l = 'colorpickers.colorpicker';
 const getColorPickerWidth = props => {
   return props.$isOpaque ? 268 : 312;
 };
 const StyledColorPicker = styled.div.attrs({
-  'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.12.3'
+  'data-garden-id': COMPONENT_ID$l,
+  'data-garden-version': '9.12.4'
 }).withConfig({
   displayName: "StyledColorPicker",
   componentId: "sc-gspq4q-0"

package/dist/esm/styled/ColorPicker/StyledColorWell.js

@@ -8,8 +8,8 @@ import styled from 'styled-components';
 import { rgba, hsl } from 'polished';
 import { componentStyles } from '@zendeskgarden/react-theming';
 
-const COMPONENT_ID = 'colorpickers.colorpicker_colorwell';
-const background = props => {
+const COMPONENT_ID$g = 'colorpickers.colorpicker_colorwell';
+const background$1 = props => {
   const blackAlpha = rgba(props.theme.palette.black, 0.9);
   const black = `linear-gradient(0deg, ${props.theme.palette.black}, ${blackAlpha} 1%, transparent 99%)`;
   const whiteAngle = `${props.theme.rtl ? -90 : 90}deg`;
@@ -19,11 +19,11 @@ const background = props => {
   return `${black}, ${white}, ${color}`;
 };
 const StyledColorWell = styled.div.attrs(props => ({
-  'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.12.3',
+  'data-garden-id': COMPONENT_ID$g,
+  'data-garden-version': '9.12.4',
   'data-test-id': 'colorwell',
   style: {
-    background: background(props)
+    background: background$1(props)
   }
 })).withConfig({
   displayName: "StyledColorWell",

package/dist/esm/styled/ColorPicker/StyledColorWellThumb.js

@@ -8,11 +8,10 @@ import styled, { css } from 'styled-components';
 import { stripUnit } from 'polished';
 import { componentStyles, getColor } from '@zendeskgarden/react-theming';
 
-const COMPONENT_ID = 'colorpickers.colorpicker_colorwell_thumb';
-const colorStyles = _ref => {
-  let {
-    theme
-  } = _ref;
+const COMPONENT_ID$f = 'colorpickers.colorpicker_colorwell_thumb';
+const colorStyles$1 = ({
+  theme
+}) => {
   const borderColor = getColor({
     theme,
     hue: 'white'
@@ -23,18 +22,17 @@ const colorStyles = _ref => {
   }))}`;
   return css(["border-color:", ";box-shadow:", ";"], borderColor, boxShadow);
 };
-const sizeStyles = _ref2 => {
-  let {
-    theme
-  } = _ref2;
+const sizeStyles$2 = ({
+  theme
+}) => {
   const borderWidth = stripUnit(theme.borderWidths.sm) * 2;
   const size = theme.space.base * 5;
   const translateValue = size / -2;
   return css(["transform:translate(", "px,", "px);box-sizing:border-box;border-width:", "px;width:", "px;height:", "px;"], translateValue, translateValue, borderWidth, size, size);
 };
 const StyledColorWellThumb = styled.div.attrs(props => ({
-  'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.12.3',
+  'data-garden-id': COMPONENT_ID$f,
+  'data-garden-version': '9.12.4',
   'data-test-id': 'colorwell-thumb',
   style: {
     top: `${props.$top}%`,
@@ -43,6 +41,6 @@ const StyledColorWellThumb = styled.div.attrs(props => ({
 })).withConfig({
   displayName: "StyledColorWellThumb",
   componentId: "sc-1npyab0-0"
-})(["position:absolute;border:", ";border-radius:50%;", " ", " ", ";"], props => props.theme.borders.sm, sizeStyles, colorStyles, componentStyles);
+})(["position:absolute;border:", ";border-radius:50%;", " ", " ", ";"], props => props.theme.borders.sm, sizeStyles$2, colorStyles$1, componentStyles);
 
 export { StyledColorWellThumb };

package/dist/esm/styled/ColorPicker/StyledHexField.js

@@ -8,10 +8,10 @@ import styled from 'styled-components';
 import { componentStyles } from '@zendeskgarden/react-theming';
 import { Field } from '@zendeskgarden/react-forms';
 
-const COMPONENT_ID = 'colorpickers.colorpicker_hex_field';
+const COMPONENT_ID$d = 'colorpickers.colorpicker_hex_field';
 const StyledHexField = styled(Field).attrs({
-  'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.12.3',
+  'data-garden-id': COMPONENT_ID$d,
+  'data-garden-version': '9.12.4',
   spellCheck: false
 }).withConfig({
   displayName: "StyledHexField",

package/dist/esm/styled/ColorPicker/StyledHueRange.js

@@ -7,10 +7,10 @@
 import styled from 'styled-components';
 import { StyledRange, getTrackMargin, getTrackHeight } from '../common/StyledRange.js';
 
-const COMPONENT_ID = 'colorpickers.colorpicker_hue';
+const COMPONENT_ID$j = 'colorpickers.colorpicker_hue';
 const StyledHueRange = styled(StyledRange).attrs({
-  'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.12.3'
+  'data-garden-id': COMPONENT_ID$j,
+  'data-garden-version': '9.12.4'
 }).withConfig({
   displayName: "StyledHueRange",
   componentId: "sc-1gdhww1-0"

package/dist/esm/styled/ColorPicker/StyledInput.js

@@ -8,10 +8,10 @@ import styled from 'styled-components';
 import { Input } from '@zendeskgarden/react-forms';
 import { componentStyles } from '@zendeskgarden/react-theming';
 
-const COMPONENT_ID = 'colorpickers.colorpicker_input';
+const COMPONENT_ID$b = 'colorpickers.colorpicker_input';
 const StyledInput = styled(Input).attrs({
-  'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.12.3',
+  'data-garden-id': COMPONENT_ID$b,
+  'data-garden-version': '9.12.4',
   focusInset: false
 }).withConfig({
   displayName: "StyledInput",

package/dist/esm/styled/ColorPicker/StyledInputGroup.js

@@ -7,10 +7,10 @@
 import styled from 'styled-components';
 import { componentStyles } from '@zendeskgarden/react-theming';
 
-const COMPONENT_ID = 'colorpickers.colorpicker_input_group';
+const COMPONENT_ID$a = 'colorpickers.colorpicker_input_group';
 const StyledInputGroup = styled.div.attrs({
-  'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.12.3'
+  'data-garden-id': COMPONENT_ID$a,
+  'data-garden-version': '9.12.4'
 }).withConfig({
   displayName: "StyledInputGroup",
   componentId: "sc-1m9g2wg-0"

package/dist/esm/styled/ColorPicker/StyledLabel.js

@@ -8,10 +8,10 @@ import styled from 'styled-components';
 import { Label } from '@zendeskgarden/react-forms';
 import { componentStyles } from '@zendeskgarden/react-theming';
 
-const COMPONENT_ID = 'colorpickers.colorpicker_label';
+const COMPONENT_ID$c = 'colorpickers.colorpicker_label';
 const StyledLabel = styled(Label).attrs({
-  'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.12.3'
+  'data-garden-id': COMPONENT_ID$c,
+  'data-garden-version': '9.12.4'
 }).withConfig({
   displayName: "StyledLabel",
   componentId: "sc-1vxt3m9-0"

package/dist/esm/styled/ColorPicker/StyledPreview.js

@@ -8,8 +8,8 @@ import styled from 'styled-components';
 import { rgba } from 'polished';
 import { componentStyles, getCheckeredBackground } from '@zendeskgarden/react-theming';
 
-const COMPONENT_ID = 'colorpickers.colorpicker_preview_box';
-const background = props => {
+const COMPONENT_ID$h = 'colorpickers.colorpicker_preview_box';
+const background$2 = props => {
   const alpha = props.$alpha ? props.$alpha / 100 : 0;
   let retVal = `rgba(${props.$red}, ${props.$green}, ${props.$blue}, ${alpha})`;
   if (!props.$isOpaque) {
@@ -23,10 +23,10 @@ const background = props => {
 };
 const StyledPreview = styled.div.attrs(props => ({
   style: {
-    background: background(props)
+    background: background$2(props)
   },
-  'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.12.3',
+  'data-garden-id': COMPONENT_ID$h,
+  'data-garden-version': '9.12.4',
   'data-test-id': 'preview-box'
 })).withConfig({
   displayName: "StyledPreview",

package/dist/esm/styled/ColorPicker/StyledRGBAField.js

@@ -8,8 +8,8 @@ import { Field } from '@zendeskgarden/react-forms';
 import styled from 'styled-components';
 import { componentStyles } from '@zendeskgarden/react-theming';
 
-const COMPONENT_ID = 'colorpickers.colorpicker_rgb_field';
-const sizeStyles = theme => {
+const COMPONENT_ID$9 = 'colorpickers.colorpicker_rgb_field';
+const sizeStyles$1 = theme => {
   const margin = `${theme.space.base * 1.5}px`;
   const width = `${theme.space.base * 12.75}px`;
   return `
@@ -19,11 +19,11 @@ const sizeStyles = theme => {
   `;
 };
 const StyledRGBAField = styled(Field).attrs({
-  'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.12.3'
+  'data-garden-id': COMPONENT_ID$9,
+  'data-garden-version': '9.12.4'
 }).withConfig({
   displayName: "StyledRGBAField",
   componentId: "sc-13266k8-0"
-})(["display:flex;flex-direction:column;text-align:center;", ";", ";"], props => sizeStyles(props.theme), componentStyles);
+})(["display:flex;flex-direction:column;text-align:center;", ";", ";"], props => sizeStyles$1(props.theme), componentStyles);
 
 export { StyledRGBAField };

package/dist/esm/styled/ColorPicker/StyledSliderGroup.js

@@ -7,10 +7,10 @@
 import styled from 'styled-components';
 import { componentStyles } from '@zendeskgarden/react-theming';
 
-const COMPONENT_ID = 'colorpickers.colorpicker_slider_group';
+const COMPONENT_ID$e = 'colorpickers.colorpicker_slider_group';
 const StyledSliderGroup = styled.div.attrs({
-  'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.12.3'
+  'data-garden-id': COMPONENT_ID$e,
+  'data-garden-version': '9.12.4'
 }).withConfig({
   displayName: "StyledSliderGroup",
   componentId: "sc-tigkzg-0"

package/dist/esm/styled/ColorPicker/StyledSliders.js

@@ -8,7 +8,7 @@ import styled from 'styled-components';
 import { componentStyles } from '@zendeskgarden/react-theming';
 import { getTrackHeight, getTrackMargin } from '../common/StyledRange.js';
 
-const COMPONENT_ID = 'colorpickers.colorpicker_sliders';
+const COMPONENT_ID$8 = 'colorpickers.colorpicker_sliders';
 const sizeStyles = props => {
   if (props.$isOpaque) {
     return undefined;
@@ -32,8 +32,8 @@ const sizeStyles = props => {
   `;
 };
 const StyledSliders = styled.div.attrs({
-  'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.12.3'
+  'data-garden-id': COMPONENT_ID$8,
+  'data-garden-version': '9.12.4'
 }).withConfig({
   displayName: "StyledSliders",
   componentId: "sc-1lgr50m-0"

package/dist/esm/styled/ColorPickerDialog/StyledButton.js

@@ -9,7 +9,7 @@ import { Button } from '@zendeskgarden/react-buttons';
 
 const StyledButton = styled(Button).attrs({
   isNeutral: true,
-  'data-garden-version': '9.12.3'
+  'data-garden-version': '9.12.4'
 }).withConfig({
   displayName: "StyledButton",
   componentId: "sc-1dlijfv-0"

package/dist/esm/styled/ColorPickerDialog/StyledButtonPreview.js

@@ -8,12 +8,11 @@ import styled from 'styled-components';
 import { rgba } from 'polished';
 import { getCheckeredBackground, componentStyles } from '@zendeskgarden/react-theming';
 
-const COMPONENT_ID = 'colorpickers.colordialog_preview';
-const background = _ref => {
-  let {
-    $backgroundColor,
-    theme
-  } = _ref;
+const COMPONENT_ID$7 = 'colorpickers.colordialog_preview';
+const background = ({
+  $backgroundColor,
+  theme
+}) => {
   let retVal;
   if (typeof $backgroundColor === 'string') {
     retVal = $backgroundColor;
@@ -38,8 +37,8 @@ const StyledButtonPreview = styled.span.attrs(props => ({
       overlay: background(props)
     })
   },
-  'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.12.3',
+  'data-garden-id': COMPONENT_ID$7,
+  'data-garden-version': '9.12.4',
   'data-test-id': 'dialog-preview'
 })).withConfig({
   displayName: "StyledButtonPreview",

package/dist/esm/styled/ColorPickerDialog/StyledTooltipBody.js

@@ -8,10 +8,10 @@ import styled from 'styled-components';
 import { TooltipDialog } from '@zendeskgarden/react-modals';
 import { componentStyles } from '@zendeskgarden/react-theming';
 
-const COMPONENT_ID = 'colorpickers.colordialog_tooltipdialog_body';
+const COMPONENT_ID$5 = 'colorpickers.colordialog_tooltipdialog_body';
 const StyledTooltipBody = styled(TooltipDialog.Body).attrs({
-  'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.12.3'
+  'data-garden-id': COMPONENT_ID$5,
+  'data-garden-version': '9.12.4'
 }).withConfig({
   displayName: "StyledTooltipBody",
   componentId: "sc-1ueddpo-0"

package/dist/esm/styled/ColorPickerDialog/StyledTooltipDialog.js

@@ -8,10 +8,10 @@ import styled from 'styled-components';
 import { TooltipDialog } from '@zendeskgarden/react-modals';
 import { componentStyles } from '@zendeskgarden/react-theming';
 
-const COMPONENT_ID = 'colorpickers.colordialog_tooltipdialog';
+const COMPONENT_ID$6 = 'colorpickers.colordialog_tooltipdialog';
 const StyledTooltipDialog = styled(TooltipDialog).attrs({
-  'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.12.3'
+  'data-garden-id': COMPONENT_ID$6,
+  'data-garden-version': '9.12.4'
 }).withConfig({
   displayName: "StyledTooltipDialog",
   componentId: "sc-1vbkccl-0"

package/dist/esm/styled/ColorSwatch/StyledCell.js

@@ -10,7 +10,7 @@ import { componentStyles } from '@zendeskgarden/react-theming';
 const COMPONENT_ID = 'colorpickers.swatch_cell';
 const StyledCell = styled.td.attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.12.3'
+  'data-garden-version': '9.12.4'
 }).withConfig({
   displayName: "StyledCell",
   componentId: "sc-qr3oit-0"

package/dist/esm/styled/ColorSwatch/StyledColorSwatch.js

@@ -7,10 +7,10 @@
 import styled from 'styled-components';
 import { componentStyles } from '@zendeskgarden/react-theming';
 
-const COMPONENT_ID = 'colorpickers.color_swatch';
+const COMPONENT_ID$4 = 'colorpickers.color_swatch';
 const StyledColorSwatch = styled.table.attrs({
-  'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.12.3'
+  'data-garden-id': COMPONENT_ID$4,
+  'data-garden-version': '9.12.4'
 }).withConfig({
   displayName: "StyledColorSwatch",
   componentId: "sc-ajx440-0"