import{toConsumableArray as o}from"../../../../_virtual/_rollupPluginBabelHelpers.js";import e from"classnames";import{difference as r,intersection as t}from"lodash-es";import"prop-types";import l,{forwardRef as n,useCallback as i,useRef as s,useMemo as c}from"react";import{SIZES as a}from"../../../../constants/sizes.js";import{contentColors as u,COLOR_STYLES as m}from"../../../../utils/colors-vars-map.js";import d from"../../../Icon/Icons/components/NoColor.js";import{COLOR_SHAPES as C,DEFAULT_NUMBER_OF_COLORS_IN_LINE as p}from"../../ColorPickerConstants.js";import{calculateColorPickerWidth as f}from"../../services/ColorPickerStyleService.js";import"./ColorPickerContentComponent.scss.js";import{useGridKeyboardNavigationContext as I,GridKeyboardNavigationContext as S}from"../../../GridKeyboardNavigationContext/GridKeyboardNavigationContext.js";import{ColorPickerClearButton as v}from"./ColorPickerClearButton.js";import{ColorPickerColorsGrid as h}from"./ColorPickerColorsGrid.js";var L=n((function(n,a){var m=n.className,d=n.onValueChange,C=n.value,p=n.noColorText,L=n.colorStyle,k=n.ColorIndicatorIcon,y=n.SelectedIndicatorIcon,E=n.shouldRenderIndicatorWithoutBackground,N=n.NoColorIcon,O=n.isBlackListMode,R=n.colorsList,j=n.isMultiselect,B=n.colorSize,b=n.numberOfColorsInLine,M=n.tooltipContentByColor,g=n.focusOnMount,x=n.colorShape,P=n.forceUseRawColorList,T=n.showColorNameTooltip,w=i((function(){d(null)}),[d]),z=s(null),U=s(null),G=c((function(){return P?R:O?r(u,R):t(u,R)}),[P,O,R]),_=i((function(e){if(j){var r=o(C);if(r.includes(e)){var t=r.indexOf(e);t>-1&&r.splice(t,1)}else r.push(e);d(r)}else d([e])}),[j,d,C]),A=c((function(){return[{topElement:z,bottomElement:U}]}),[]),W=I(A,a),K=f(B,b);return l.createElement("div",{className:e("color-picker-content--wrapper",m),style:{width:K},ref:a,tabIndex:-1},l.createElement(S.Provider,{value:W},l.createElement(h,{ref:z,onColorClicked:_,colorsToRender:G,numberOfColorsInLine:b,focusOnMount:g,value:C,colorStyle:L,ColorIndicatorIcon:k,shouldRenderIndicatorWithoutBackground:E,SelectedIndicatorIcon:y,colorSize:B,tooltipContentByColor:M,colorShape:x,showColorNameTooltip:T&&!P}),p&&l.createElement(v,{Icon:N,onClick:w,text:p,ref:U})))}));L.COLOR_STYLES=m,L.sizes=a,L.colorShapes=C,L.defaultProps={className:"",onValueChange:function(){},ColorIndicatorIcon:void 0,SelectedIndicatorIcon:void 0,colorStyle:L.COLOR_STYLES.REGULAR,value:"",noColorText:void 0,shouldRenderIndicatorWithoutBackground:!1,NoColorIcon:d,isBlackListMode:!0,colorsList:[],colorSize:L.sizes.MEDIUM,numberOfColorsInLine:p,tooltipContentByColor:{},focusOnMount:!1,colorShape:L.colorShapes.SQUARE,isMultiselect:!1,forceUseRawColorList:!1,showColorNameTooltip:!1};var k=L;export{k as default};
