@zendeskgarden/react-colorpickers 9.0.0-next.9 → 9.1.0

package/dist/typings/styled/ColorPicker/StyledAlphaRange.d.ts

@@ -5,5 +5,5 @@
  * found at http://www.apache.org/licenses/LICENSE-2.0.
  */
 import { DefaultTheme } from 'styled-components';
-import { IRGBColor } from '../../types';
-export declare const StyledAlphaRange: import("styled-components").StyledComponent<"input", DefaultTheme, IRGBColor, never>;
+import { IRGBColorProps } from '../types';
+export declare const StyledAlphaRange: import("styled-components").StyledComponent<"input", DefaultTheme, IRGBColorProps, never>;

package/dist/typings/styled/ColorPicker/StyledColorPicker.d.ts

@@ -5,7 +5,7 @@
  * found at http://www.apache.org/licenses/LICENSE-2.0.
  */
 interface IStyledColorPickerProps {
-    isOpaque?: boolean;
+    $isOpaque?: boolean;
 }
 export declare const getColorPickerWidth: (props: IStyledColorPickerProps) => 268 | 312;
 export declare const StyledColorPicker: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {

package/dist/typings/styled/ColorPicker/StyledColorWell.d.ts

@@ -6,7 +6,7 @@
  */
 import { DefaultTheme } from 'styled-components';
 interface IStyledColorWellProps {
-    hue: number;
+    $hue: number;
 }
 export declare const StyledColorWell: import("styled-components").StyledComponent<"div", DefaultTheme, IStyledColorWellProps, never>;
 export {};

package/dist/typings/styled/ColorPicker/StyledPreview.d.ts

@@ -5,9 +5,9 @@
  * found at http://www.apache.org/licenses/LICENSE-2.0.
  */
 import { DefaultTheme } from 'styled-components';
-import { IRGBColor } from '../../types';
-interface IStyledColorPreviewProps extends IRGBColor {
-    isOpaque?: boolean;
+import { IRGBColorProps } from '../types';
+interface IStyledColorPreviewProps extends IRGBColorProps {
+    $isOpaque?: boolean;
 }
 export declare const StyledPreview: import("styled-components").StyledComponent<"div", DefaultTheme, IStyledColorPreviewProps, never>;
 export {};

package/dist/typings/styled/ColorPicker/StyledSliders.d.ts

@@ -4,10 +4,11 @@
  * Use of this source code is governed under the Apache License, Version 2.0
  * found at http://www.apache.org/licenses/LICENSE-2.0.
  */
+import { DefaultTheme } from 'styled-components';
 interface IStyledSlidersProps {
-    isOpaque?: boolean;
+    $isOpaque?: boolean;
 }
-export declare const StyledSliders: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
+export declare const StyledSliders: import("styled-components").StyledComponent<"div", DefaultTheme, {
     'data-garden-id': string;
     'data-garden-version': string;
 } & IStyledSlidersProps, "data-garden-id" | "data-garden-version">;

package/dist/typings/styled/ColorPickerDialog/StyledButton.d.ts

@@ -10,6 +10,5 @@
  */
 export declare const StyledButton: import("styled-components").StyledComponent<any, import("styled-components").DefaultTheme, object & {
     isNeutral: boolean;
-    'data-garden-id': string;
     'data-garden-version': string;
 }, string | number | symbol>;

package/dist/typings/styled/ColorPickerDialog/StyledButtonPreview.d.ts

@@ -7,6 +7,6 @@
 import { ThemeProps, DefaultTheme } from 'styled-components';
 import { IColorPickerDialogProps } from '../../types';
 export interface IStyleButtonPreviewProps extends ThemeProps<DefaultTheme> {
-    backgroundColor?: IColorPickerDialogProps['color'];
+    $backgroundColor?: IColorPickerDialogProps['color'];
 }
 export declare const StyledButtonPreview: import("styled-components").StyledComponent<"span", DefaultTheme, IStyleButtonPreviewProps, never>;

package/dist/typings/styled/ColorPickerDialog/{StyledTooltipModal.d.ts → StyledTooltipDialog.d.ts}

@@ -5,9 +5,9 @@
  * found at http://www.apache.org/licenses/LICENSE-2.0.
  */
 /**
- * 1. Override default TooltipModal styling
+ * 1. Override default TooltipDialog styling
  */
-export declare const StyledTooltipModal: import("styled-components").StyledComponent<any, import("styled-components").DefaultTheme, object & {
+export declare const StyledTooltipDialog: import("styled-components").StyledComponent<any, import("styled-components").DefaultTheme, object & {
     'data-garden-id': string;
     'data-garden-version': string;
 }, string | number | symbol>;

package/dist/typings/styled/ColorSwatch/StyledColorSwatchLabel.d.ts

@@ -6,7 +6,7 @@
  */
 import { DefaultTheme, ThemeProps } from 'styled-components';
 interface IStyledColorSwatchLabelProps extends ThemeProps<DefaultTheme> {
-    backgroundColor: string;
+    $backgroundColor: string;
 }
 export declare const StyledColorSwatchLabel: import("styled-components").StyledComponent<"span", DefaultTheme, import("../ColorPickerDialog/StyledButtonPreview").IStyleButtonPreviewProps & {
     as: string;

package/dist/typings/styled/common/StyledRange.d.ts

@@ -6,7 +6,7 @@
  */
 import { ThemeProps, DefaultTheme } from 'styled-components';
 export interface IStyledRangeProps {
-    isOpaque?: boolean;
+    $isOpaque?: boolean;
 }
 export declare const trackStyles: (styles: string, modifier?: string) => string;
 export declare const getTrackHeight: (props: IStyledRangeProps & ThemeProps<DefaultTheme>) => number;
@@ -15,4 +15,4 @@ export declare const StyledRange: import("styled-components").StyledComponent<"i
     'data-garden-id': string;
     'data-garden-version': string;
     hasLowerTrack: boolean;
-}, "data-garden-id" | "data-garden-version" | "hasLowerTrack">;
+} & IStyledRangeProps, "data-garden-id" | "data-garden-version" | "hasLowerTrack">;

package/dist/typings/styled/index.d.ts

@@ -19,7 +19,7 @@ export * from './ColorPicker/StyledRGBAField';
 export * from './ColorPicker/StyledSliders';
 export * from './ColorPickerDialog/StyledButton';
 export * from './ColorPickerDialog/StyledButtonPreview';
-export * from './ColorPickerDialog/StyledTooltipModal';
+export * from './ColorPickerDialog/StyledTooltipDialog';
 export * from './ColorPickerDialog/StyledTooltipBody';
 export * from './ColorSwatch/StyledColorSwatch';
 export * from './ColorSwatch/StyledColorSwatchInput';

package/dist/typings/styled/types.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Copyright Zendesk, Inc.
+ *
+ * Use of this source code is governed under the Apache License, Version 2.0
+ * found at http://www.apache.org/licenses/LICENSE-2.0.
+ */
+export interface IRGBColorProps {
+    $red: number;
+    $green: number;
+    $blue: number;
+    $alpha?: number;
+}

package/dist/typings/types/index.d.ts

@@ -5,7 +5,7 @@
  * found at http://www.apache.org/licenses/LICENSE-2.0.
  */
 import { HTMLAttributes } from 'react';
-import { ITooltipModalProps } from '@zendeskgarden/react-modals';
+import { ITooltipDialogProps } from '@zendeskgarden/react-modals';
 export interface IColor {
     hex: string;
     hue: number;
@@ -67,21 +67,21 @@ export interface IColorPickerDialogProps extends IColorPickerProps {
      */
     onClose?: (color: IColor) => void;
     /** Adjusts the placement of the color dialog */
-    placement?: ITooltipModalProps['placement'];
+    placement?: ITooltipDialogProps['placement'];
     /** Disables the color dialog button */
     disabled?: boolean;
     /**
      * Sets the `z-index` of the color dialog
      */
-    zIndex?: ITooltipModalProps['zIndex'];
+    zIndex?: ITooltipDialogProps['zIndex'];
     /**
      * Adds an arrow to the color dialog
      */
-    hasArrow?: ITooltipModalProps['hasArrow'];
+    hasArrow?: ITooltipDialogProps['hasArrow'];
     /**
      * Animates the color dialog
      */
-    isAnimated?: ITooltipModalProps['isAnimated'];
+    isAnimated?: ITooltipDialogProps['isAnimated'];
     /**
      * Opens the dialog in a controlled color picker dialog
      */
@@ -130,15 +130,15 @@ export interface IColorSwatchProps extends Omit<HTMLAttributes<HTMLTableElement>
 }
 export interface IColorSwatchDialogProps extends IColorSwatchProps {
     /** Adjusts the placement of the color dialog */
-    placement?: ITooltipModalProps['placement'];
+    placement?: ITooltipDialogProps['placement'];
     /** Disables the color dialog button */
     disabled?: boolean;
     /** Sets the `z-index` of the color dialog */
-    zIndex?: ITooltipModalProps['zIndex'];
+    zIndex?: ITooltipDialogProps['zIndex'];
     /** Adds an arrow to the color dialog */
-    hasArrow?: ITooltipModalProps['hasArrow'];
+    hasArrow?: ITooltipDialogProps['hasArrow'];
     /** Animates the color dialog */
-    isAnimated?: ITooltipModalProps['isAnimated'];
+    isAnimated?: ITooltipDialogProps['isAnimated'];
     /** Applies inset `box-shadow` styling on focus */
     focusInset?: boolean;
     /** Passes HTML attributes to the color dialog button element */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zendeskgarden/react-colorpickers",
-  "version": "9.0.0-next.9",
+  "version": "9.1.0",
   "description": "Components related to color pickers in the Garden Design System",
   "license": "Apache-2.0",
   "author": "Zendesk Garden <garden@zendesk.com>",
@@ -23,27 +23,27 @@
   "dependencies": {
     "@zendeskgarden/container-grid": "^3.0.0",
     "@zendeskgarden/container-utilities": "^2.0.0",
-    "@zendeskgarden/react-buttons": "^9.0.0-next.9",
-    "@zendeskgarden/react-forms": "^9.0.0-next.9",
-    "@zendeskgarden/react-modals": "^9.0.0-next.9",
-    "@zendeskgarden/react-tooltips": "^9.0.0-next.9",
+    "@zendeskgarden/react-buttons": "^9.1.0",
+    "@zendeskgarden/react-forms": "^9.1.0",
+    "@zendeskgarden/react-modals": "^9.1.0",
+    "@zendeskgarden/react-tooltips": "^9.1.0",
     "lodash.isequal": "^4.5.0",
     "lodash.throttle": "^4.1.1",
-    "polished": "^4.0.0",
+    "polished": "^4.3.1",
     "prop-types": "^15.7.2",
     "react-merge-refs": "^2.0.0"
   },
   "peerDependencies": {
     "@zendeskgarden/react-theming": ">=9.0.0-next",
-    "react": ">=16.8.0",
-    "react-dom": ">=16.8.0",
+    "react": "^16.8.0 || ^17.0.0 || ^18.0.0",
+    "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0",
     "styled-components": "^5.3.1"
   },
   "devDependencies": {
     "@types/lodash.isequal": "4.5.8",
     "@types/lodash.throttle": "4.1.9",
-    "@zendeskgarden/react-theming": "^9.0.0-next.9",
-    "@zendeskgarden/svg-icons": "7.0.0"
+    "@zendeskgarden/react-theming": "^9.1.0",
+    "@zendeskgarden/svg-icons": "7.3.0"
   },
   "keywords": [
     "colorpicker",
@@ -56,5 +56,5 @@
     "access": "public"
   },
   "zendeskgarden:src": "src/index.ts",
-  "gitHead": "771281b562d376a6aee04b0cd71dd888b3ae4a1d"
+  "gitHead": "a2842d18615ad057d75988fde4df5a0c79d2714e"
 }

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

@@ -1,23 +0,0 @@
-/**
-* Copyright Zendesk, Inc.
-*
-* Use of this source code is governed under the Apache License, Version 2.0
-* found at http://www.apache.org/licenses/LICENSE-2.0.
-*/
-import styled from 'styled-components';
-import { TooltipModal } from '@zendeskgarden/react-modals';
-import { retrieveComponentStyles, DEFAULT_THEME } from '@zendeskgarden/react-theming';
-
-const COMPONENT_ID = 'colorpickers.colordialog_tooltipmodal';
-const StyledTooltipModal = styled(TooltipModal).attrs({
-  'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.0.0-next.9'
-}).withConfig({
-  displayName: "StyledTooltipModal",
-  componentId: "sc-gykkrw-0"
-})(["width:auto !important;", ";"], props => retrieveComponentStyles(COMPONENT_ID, props));
-StyledTooltipModal.defaultProps = {
-  theme: DEFAULT_THEME
-};
-
-export { StyledTooltipModal };