@corva/ui 3.80.0-2 → 3.80.0-4

package/components/RealTimeValuesSidebar/SidebarFooter.js

@@ -1,2 +1,2 @@
-import{memo as o,useContext as s}from"react";import t from"classnames";import{makeStyles as n,Box as e}from"@material-ui/core";import i from"../IconButton/index.js";import{RightIcon as r,UpIcon as c,PlusIcon as p,LeftIcon as m,DownIcon as a}from"../../icons/iconParkIcons.js";import"../../componentsV2/Text/Text.js";import"../../componentsV2/Grid/Grid.js";import"../../componentsV2/Grid/Cell.js";import"@babel/runtime/helpers/defineProperty";import"../../componentsV2/Header/Header.scss.js";import{jsx as l,jsxs as d}from"react/jsx-runtime";import"../../componentsV2/Button/Button.js";import"../../componentsV2/ButtonIcon/ButtonIcon.js";import{Tooltip as j}from"../../componentsV2/Tooltip/Tooltip.js";import"../../componentsV2/Popover/Popover.js";import"../../componentsV2/PopoverPanel/PopoverPanel.js";import"../../componentsV2/Radio/Radio.js";import"@babel/runtime/helpers/objectWithoutProperties";import"../../componentsV2/RadioAndCheckboxGroup/RadioAndCheckboxGroup.scss.js";import"../../componentsV2/Checkbox/Checkbox.js";import"@babel/runtime/helpers/toConsumableArray";import"../../componentsV2/TextInput/TextInput.js";import"../../componentsV2/TextInputNext/TextInputNext.js";import"../../componentsV2/TextArea/TextArea.js";import"../../componentsV2/Label/Label.js";import"@babel/runtime/helpers/slicedToArray";import"lodash";import"../../componentsV2/TextEndTruncated/TextEndTruncated.scss.js";import"../../componentsV2/TextMiddleTruncated/TextMiddleTruncated.constants.js";import"../../componentsV2/TextMiddleTruncated/TextMiddleTruncated.scss.js";import"../../componentsV2/TextLink/TextLink.js";import"../../componentsV2/Chip/Chip.js";import"../../componentsV2/ChipAlert/ChipAlert.js";import"../../componentsV2/ChipIndicator/ChipIndicator.js";import"../../componentsV2/Avatar/Avatar.js";import"../../componentsV2/AvatarGroup/AvatarGroup.js";import"@material-ui/lab";import"../../componentsV2/ToggleButtons/ToggleButtons.scss.js";import"../../componentsV2/Paper/Paper.js";import"../../componentsV2/ModalWindow/ModalWindow.js";import"uuid";import"../DevCenter/DevCenterAppContainer/components/DcFullscreenElemsCoordinatorProvider/DcFullscreenElemsCoordinatorProvider.js";import"../DevCenter/DevCenterAppContainer/components/DcFullscreenElemsCoordinatorProvider/IsInsideDcFullscreenElemProvider.js";import"../DevCenter/DevCenterAppContainer/components/IsInsideIsolatedDcAppProvider.js";import"../../componentsV2/Modal/Modal.scss.js";import"../../componentsV2/Menu/Menu.js";import"../../componentsV2/utils.js";import"../../icons/customIcons/icons/AddMessage.js";import"../../icons/customIcons/icons/DragOne.js";import"../../icons/customIcons/icons/Attention.js";import"../../icons/customIcons/icons/Collapse.js";import"../../icons/customIcons/icons/Dashboard.js";import"../../icons/customIcons/icons/Expand.js";import"../../icons/customIcons/icons/FolderClosed.js";import"../../icons/customIcons/icons/FolderClosedFilled.js";import"../../icons/customIcons/icons/FolderOpened.js";import"../../icons/customIcons/icons/GreaterOrEqual.js";import"../../icons/customIcons/icons/LessOrEqual.js";import"../../icons/customIcons/icons/Search.js";import"../../icons/customIcons/icons/SearchOne.js";import"../../icons/customIcons/icons/Wellhub.js";import"../../icons/customIcons/icons/MultiRuler.js";import"../../icons/customIcons/icons/Checkbox.js";import"../../icons/customIcons/icons/CheckboxChecked.js";import"../../icons/customIcons/icons/CheckboxIndeterminate.js";import"../../icons/customIcons/icons/Radio.js";import"../../icons/customIcons/icons/RadioChecked.js";import"../../icons/customIcons/icons/SimulFrac.js";import"../../icons/customIcons/icons/ZipperFrac.js";import"../../icons/customIcons/icons/CautionFilled.js";import"../../icons/customIcons/icons/InfoRounded.js";import"../../icons/customIcons/icons/FlameFilled.js";import"../../icons/customIcons/icons/MoreApp.js";import"../../icons/customIcons/icons/Pad.js";import"../../icons/customIcons/icons/DrilloutUnit.js";import"../../icons/customIcons/icons/FracFleet.js";import"../../icons/customIcons/icons/Global.js";import"../../icons/customIcons/icons/Program.js";import"../../icons/customIcons/icons/Rig.js";import"../../icons/customIcons/icons/Well.js";import"../../icons/customIcons/icons/Gap.js";import"../../icons/customIcons/icons/Pin.js";import"../../icons/customIcons/icons/PinOne.js";import"../../icons/customIcons/icons/PinOneCrossed.js";import"../../icons/customIcons/icons/CloseOneFilled.js";import"../../icons/customIcons/icons/AttentionFilled.js";import"../../icons/customIcons/icons/CheckOneFilled.js";import"../../icons/customIcons/icons/Archive.js";import"../../icons/customIcons/icons/ArchiveCancel.js";import"../../icons/customIcons/icons/Unarchive.js";import"../../icons/customIcons/icons/Archived.js";import"../../icons/customIcons/icons/InterventionUnit.js";import"../../icons/customIcons/icons/CloudDelete.js";import"../../icons/customIcons/icons/Lasso.js";import"../../icons/customIcons/icons/Radius.js";import"../../icons/customIcons/icons/ErrorOps.js";import"../../icons/customIcons/icons/DataTypeOps.js";import"../../icons/customIcons/icons/FalsePositiveOps.js";import"../../icons/customIcons/icons/CalibrationOps.js";import"../../icons/customIcons/icons/CriticalOps.js";import"../../icons/customIcons/icons/Company.js";import"../../icons/customIcons/icons/ArchiveOne.js";import"../../icons/customIcons/icons/ParseBotFusion.js";import"../../icons/customIcons/icons/Connect.js";import"../../icons/customIcons/icons/PuzzleOne.js";import"../../icons/customIcons/icons/Feed.js";import"../../icons/customIcons/icons/Prompt.js";import"../../icons/customIcons/icons/Companies.js";import"../../icons/customIcons/icons/ClipboardAi.js";import"../../icons/customIcons/icons/Key.js";import"../../icons/customIcons/icons/AtSignCrossed.js";import"../../icons/customIcons/icons/MappingManual.js";import"../../icons/customIcons/icons/Mapping.js";import"../../icons/customIcons/icons/Metrics.js";import"../../icons/customIcons/icons/Drops.js";import"../../icons/customIcons/icons/ClipboardSearch.js";import"../../icons/customIcons/icons/Template.js";import"../../icons/customIcons/icons/ClipboardMetrics.js";import"../../icons/customIcons/icons/ClipboardBuilder.js";import"../../icons/customIcons/icons/UnitConversion.js";import"../../icons/customIcons/icons/NPT.js";import"../../icons/customIcons/icons/GuidedFrac.js";import"../../componentsV2/Hint/Hint.scss.js";import"../../componentsV2/Counter/Counter.js";import"../../componentsV2/BadgeBase/BadgeBase.scss.js";import"../../componentsV2/TemplatesControl/TemplatesControl.js";import"zustand";import"../../componentsV2/TemplatesControl/utils.js";import"../../componentsV2/TemplatesControl/icons/folder/index.js";import"../../componentsV2/TemplatesControl/Store/utils.js";import"@babel/runtime/helpers/asyncToGenerator";import"@babel/runtime/regenerator";import"../../componentsV2/TemplatesControl/types.js";import"../UserMention/utils/index.js";import"../../utils/convert.js";import"../../constants/completion.js";import"moment";import"../../constants/alerts.js";import"../../utils/casing/validation.js";import"lodash/mean";import"../../constants/streamSourceType.js";import"lodash/get";import"file-saver";import"query-string";import"../../constants/goals.js";import"../../constants/segment.js";import"../../constants/apps.js";import"../../constants/drillstring.js";import"../../constants/appPackages.js";import"../../constants/notifications.js";import"../../constants/feed.js";import"../../constants/bha.js";import"../../constants/corvaCompanyId.js";import"../GradientManager/configuration/constants.js";import"../../utils/drillstring/conversion.js";import"lodash/set";import"lodash/cloneDeep";import"lodash/isNumber";import"lodash/has";import"../../utils/ga.js";import"../../utils/goalsConfig/goalsConfig.js";import"../../utils/lasParser.js";import"../../utils/main.js";import"../../utils/metrics/metricsConfig.js";import"../../utils/mobileDetect.js";import"../../utils/feed.js";import"../../utils/reports.js";import"moment-timezone";import"@babel/runtime/helpers/typeof";import"../../utils/dashboardReports.js";import"../../utils/env.js";import"file-extension";import"image-extensions";import"video-extensions";import"../../utils/jsonaDataFormatter.js";import"../../utils/bha.js";import"jsona";import"../../clients/jsonApi/index.js";import"../../utils/shareRecentRequest.js";import"../../utils/charts/Styles.scss.js";import"../../utils/getSingleAsset.js";import"../../permissions/PermissionsContext.js";import"../../permissions/constants/index.js";import"../../permissions/withPermissionsHOC.js";import"../../permissions/ProvidePermissions.js";import"../../componentsV2/BadgeDot/BadgeDot.scss.js";import"../../componentsV2/LoaderLinear/LoaderLinear.js";import"../../componentsV2/LoaderLogo/LoaderLogo.constants.js";import"../../componentsV2/LoaderLogo/LoaderLogo.scss.js";import"../../componentsV2/Switch/Switch.js";import"../../componentsV2/Tabs/Tabs.js";import"../../componentsV2/EmptyState/EmptyState.scss.js";import"../../componentsV2/FileIcon/FileIcon.js";import"../../componentsV2/Tag/Tag.js";import"react-dropzone";import"../../componentsV2/FilesDropzone/FilesDropzone.scss.js";import"../../componentsV2/FilesLoader/FilesLoader.scss.js";import"../../componentsV2/FilesProcessor/FilesProcessor.scss.js";import"../../componentsV2/Skeleton/Skeleton.scss.js";import"../../componentsV2/CopyToClipboard/CopyToClipboard.scss.js";import"../../componentsV2/Stepper/Step/Step.scss.js";import"../../componentsV2/Stepper/Stepper.scss.js";import"../../componentsV2/ButtonLive/ButtonLive.js";import"../../componentsV2/ButtonText/ButtonText.js";import"../../componentsV2/IndicatorLive/IndicatorLive.js";import"../../componentsV2/Accordion/Accordion.scss.js";import"../../componentsV2/Breadcrumbs/Breadcrumbs.scss.js";import"../../componentsV2/BadgeComment/BadgeComment.js";import"../../componentsV2/AppContainer/AppContainer.js";import"../../componentsV2/AppContainer/AppContainer.constants.js";import"../../componentsV2/AppFooter/AppFooter.js";import"../../componentsV2/AppCommonsProvider/AppCommonsContext.js";import"../../componentsV2/AppHeader/AppHeader.constants.js";import"../../componentsV2/AppHeader/AppBadge/AppBadge.scss.js";import"../DevCenter/DevCenterRouterContext/DevCenterRouterContext.js";import"../DevCenter/DevCenterRouterContext/UniversalLink/UniversalLink.js";import"react-router-dom";import"../../componentsV2/AppHeader/AppAssets/utils.js";import"../../componentsV2/AppHeader/AppAssets/AppAssets.scss.js";import"../PadModeSelect/PadModeSelect.js";import"../../componentsV2/AppHeader/PadMode/PadMode.scss.js";import"../../componentsV2/PadModeSelect/PadModeSelect.js";import"../../componentsV2/PadModeSelect/PadModeSelect.constants.js";import"../../componentsV2/AppCommonsProvider/AppCommonsProvider.js";import"../../componentsV2/AppHeader/V3/VersionSelect/VersionSelect.js";import"../../componentsV2/UniversalLink/UniversalLink.scss.js";import"../../componentsV2/AppHeader/V3/AssetChips/AssetChips.scss.js";import"../../componentsV2/AppHeader/V3/DqStatusIcon/DqStatusIcon.js";import"../../componentsV2/AppHeader/V3/DqStatusIcon/DqStatusIcon.constants.js";import"../../componentsV2/AppFooter/DqPopover/DqStatusIcon/DqStatusIcon.js";import"../../componentsV2/AppDqPopover/DqAlertTooltip/DqAlertTooltip.scss.js";import"../../componentsV2/AppDqPopover/DqAlert/DqAlert.scss.js";import"../../componentsV2/AppDqPopover/DqAsset/DqAsset.scss.js";import"../../componentsV2/AppDqPopover/AppDqPopover.scss.js";import"../AppIcon/AppIcon.js";import"../../componentsV2/AppHeader/V3/AssetSelector/AssetSelectorChip/AssetSelectorChip.js";import"../../componentsV2/AppHeader/V3/AssetSelector/constants.js";import"../../componentsV2/AppHeader/V3/AssetSelector/AssetSelectorSelect/AssetSelectorSelect.scss.js";import"../../componentsV2/AppHeader/V3/AssetSelector/AssetSelectorSelect/loadAssets.js";import"../../componentsV2/AppHeader/V3/AssetSelector/AssetSelector.scss.js";import"querystring";import"../../clients/subscriptions/subscriptions-client.factory.js";import"../StatusBadge/constants.js";import"lodash/unset";import"../../clients/api/apiCore.js";import"../../clients/constants.js";import"../../clients/sso/auth0.js";import"../../clients/sso/oauth2.js";import"../../clients/api/rateLimiter.js";import"lodash/isEmpty";import"lodash/sortBy";import"../DevCenter/DevCenterAppContainer/components/CommentsSwitch/CommentsSwitchContext.js";import"../../componentsV2/AppPanel/AppPanelsContext.js";import"../../componentsV2/AppHeader/V3/AppTitle/AppTitle.constants.js";import"../../componentsV2/AppHeader/V3/AppTitle/AppTitle.scss.js";import"../../componentsV2/AppHeader/V3/constants.scss.js";import"../../componentsV2/AppHeader/V3/SettingsButton/SettingsButton.constants.js";import"../../componentsV2/AppHeader/V3/Actions/Actions.constants.js";import"../../componentsV2/AppHeader/V3/Actions/Actions.scss.js";import"../../componentsV2/AppHeader/V3/AppHeaderV3.scss.js";import"../../componentsV2/AppHeader/AppHeader.scss.js";import"../../componentsV2/OffsetWellsButton/OffsetWellsButton.js";import"../../componentsV2/ChartAxisExtreme/ChartAxisExtreme.scss.js";import"highcharts";import"../../componentsV2/ChartAxisExtreme/ChartAxisExtremeDragTracker.js";import"../../componentsV2/Autocomplete/Autocomplete.js";import"../../componentsV2/Select/Select.js";import"../../componentsV2/AppPanel/AppPanel.js";import"../../componentsV2/AppSettingsDivider/AppSettingsDivider.scss.js";import"../../componentsV2/WellArchivedMessage/WellArchivedMessage.js";import"../../componentsV2/DatePicker/DatePicker.js";import"../../componentsV2/DragHandle/DragHandle.js";import"../../componentsV2/CompletionsOffsetWellPicker/CompletionsOffsetWellPicker.js";import"../../componentsV2/Slider/constants.js";import"../../componentsV2/Slider/components/SliderThumb.js";import"../../componentsV2/Slider/Slider.scss.js";import"../../componentsV2/SliderAdvanced/SliderAdvanced.js";import"react-color";import"../../componentsV2/ColorPicker/Swatches/Swatches.scss.js";import"../../componentsV2/ColorPicker/OpacityDragtracker/OpacityDragTracker.scss.js";import"../../componentsV2/ColorPicker/ColorPicker.scss.js";import"../../componentsV2/ChartHelper/ChartHelper.scss.js";import"../../componentsV2/Hotkey/Hotkey.js";import"@tanstack/react-query";import"../../componentsV2/InterventionEventSelector/useInterventionUnitEvents.js";import"../../componentsV2/InterventionEventSelector/InterventionEventSelector.scss.js";import u from"./RealTimeSidebarContext.js";import{ORIENTATIONS as V}from"./enums.js";var A=n((function(o){return{button:{fontSize:14,fontWeight:500},buttonIcon:{fontSize:24,marginRight:8},closedButton:{marginBottom:"78px",zIndex:1e3},rtSidebarFooter:{position:"absolute",right:0,"&.vertical":{left:0,bottom:0},"&.horizontal":{top:0}},rtSidebarFooterIcon:{color:o.palette.primary.text6},rtSidebarFooterActions:{display:"flex",paddingRight:"5px",alignItems:"center",height:48,width:48,padding:6,"&.horizontal":{flexDirection:"row-reverse"}},actionButton:{padding:12,height:36,width:36},openToggleContainer:{alignItems:"center",bottom:0,display:"flex",flex:"0 0",height:48,padding:6,position:"absolute",width:"100%",justifyContent:"flex-start",paddingRight:6},collapseTooltip:{marginTop:-8},expandTooltip:{marginTop:-48}}})),C=o((function(o){var n=o.onSidebarOpened,C=o.onSidebarClosed,I=o.className,h=A(),g=s(u),v=g.isSidebarOpen,S=g.orientation,b=g.handleOpenCloseDialog;return l("div",{className:t(h.rtSidebarFooter,S,I),"data-testid":"sidebar_footer",children:v?l(e,{className:h.openToggleContainer,children:l(j,{title:"Collapse",className:h.collapseTooltip,children:d("div",{className:t(h.rtSidebarFooterActions,S),children:[l(i,{"data-testid":"sidebar_close_button",onClick:C,className:h.actionButton,children:S===V.vertical?l(r,{}):l(c,{className:h.rtSidebarFooterIcon})}),S===V.horizontal&&l(i,{color:"primary",tooltipProps:{title:"Add"},onClick:function(){return b(!0)},className:h.actionButton,children:l(p,{})})]})})}):l(j,{title:"Expand",className:h.expandTooltip,children:l("div",{className:t(h.rtSidebarFooterActions,S),children:l(i,{onClick:n,"data-testid":"sidebar_open_button",className:t(h.closedButton,h.actionButton),children:S===V.vertical?l(m,{}):l(a,{})})})})})}));export{C as default};
+import{memo as o,useContext as s}from"react";import t from"classnames";import{makeStyles as n,Box as e}from"@material-ui/core";import i from"../IconButton/index.js";import{RightIcon as r,UpIcon as c,PlusIcon as p,LeftIcon as m,DownIcon as a}from"../../icons/iconParkIcons.js";import"../../componentsV2/Text/Text.js";import"../../componentsV2/Grid/Grid.js";import"../../componentsV2/Grid/Cell.js";import"@babel/runtime/helpers/defineProperty";import"../../componentsV2/Header/Header.scss.js";import{jsx as l,jsxs as d}from"react/jsx-runtime";import"../../componentsV2/Button/Button.js";import"../../componentsV2/ButtonIcon/ButtonIcon.js";import{Tooltip as j}from"../../componentsV2/Tooltip/Tooltip.js";import"../../componentsV2/Popover/Popover.js";import"../../componentsV2/PopoverPanel/PopoverPanel.js";import"../../componentsV2/Radio/Radio.js";import"@babel/runtime/helpers/objectWithoutProperties";import"../../componentsV2/RadioAndCheckboxGroup/RadioAndCheckboxGroup.scss.js";import"../../componentsV2/Checkbox/Checkbox.js";import"@babel/runtime/helpers/toConsumableArray";import"../../componentsV2/TextInput/TextInput.js";import"../../componentsV2/TextInputNext/TextInputNext.js";import"../../componentsV2/TextArea/TextArea.js";import"../../componentsV2/Label/Label.js";import"@babel/runtime/helpers/slicedToArray";import"lodash";import"../../componentsV2/TextEndTruncated/TextEndTruncated.scss.js";import"../../componentsV2/TextMiddleTruncated/TextMiddleTruncated.constants.js";import"../../componentsV2/TextMiddleTruncated/TextMiddleTruncated.scss.js";import"../../componentsV2/TextLink/TextLink.js";import"../../componentsV2/Chip/Chip.js";import"../../componentsV2/ChipAlert/ChipAlert.js";import"../../componentsV2/ChipIndicator/ChipIndicator.js";import"../../componentsV2/Avatar/Avatar.js";import"../../componentsV2/AvatarGroup/AvatarGroup.js";import"@material-ui/lab";import"../../componentsV2/ToggleButtons/ToggleButtons.scss.js";import"../../componentsV2/Paper/Paper.js";import"../../componentsV2/ModalWindow/ModalWindow.js";import"uuid";import"../DevCenter/DevCenterAppContainer/components/DcFullscreenElemsCoordinatorProvider/DcFullscreenElemsCoordinatorProvider.js";import"../DevCenter/DevCenterAppContainer/components/DcFullscreenElemsCoordinatorProvider/IsInsideDcFullscreenElemProvider.js";import"../DevCenter/DevCenterAppContainer/components/IsInsideIsolatedDcAppProvider.js";import"../../componentsV2/Modal/Modal.scss.js";import"../../componentsV2/Menu/Menu.js";import"../../componentsV2/utils.js";import"../../icons/customIcons/icons/AddMessage.js";import"../../icons/customIcons/icons/DragOne.js";import"../../icons/customIcons/icons/Attention.js";import"../../icons/customIcons/icons/Collapse.js";import"../../icons/customIcons/icons/Dashboard.js";import"../../icons/customIcons/icons/Expand.js";import"../../icons/customIcons/icons/FolderClosed.js";import"../../icons/customIcons/icons/FolderClosedFilled.js";import"../../icons/customIcons/icons/FolderOpened.js";import"../../icons/customIcons/icons/GreaterOrEqual.js";import"../../icons/customIcons/icons/LessOrEqual.js";import"../../icons/customIcons/icons/Search.js";import"../../icons/customIcons/icons/SearchOne.js";import"../../icons/customIcons/icons/Wellhub.js";import"../../icons/customIcons/icons/MultiRuler.js";import"../../icons/customIcons/icons/Checkbox.js";import"../../icons/customIcons/icons/CheckboxChecked.js";import"../../icons/customIcons/icons/CheckboxIndeterminate.js";import"../../icons/customIcons/icons/Radio.js";import"../../icons/customIcons/icons/RadioChecked.js";import"../../icons/customIcons/icons/SimulFrac.js";import"../../icons/customIcons/icons/ZipperFrac.js";import"../../icons/customIcons/icons/CautionFilled.js";import"../../icons/customIcons/icons/InfoRounded.js";import"../../icons/customIcons/icons/FlameFilled.js";import"../../icons/customIcons/icons/MoreApp.js";import"../../icons/customIcons/icons/Pad.js";import"../../icons/customIcons/icons/DrilloutUnit.js";import"../../icons/customIcons/icons/FracFleet.js";import"../../icons/customIcons/icons/Global.js";import"../../icons/customIcons/icons/Program.js";import"../../icons/customIcons/icons/Rig.js";import"../../icons/customIcons/icons/Well.js";import"../../icons/customIcons/icons/Gap.js";import"../../icons/customIcons/icons/Pin.js";import"../../icons/customIcons/icons/PinOne.js";import"../../icons/customIcons/icons/PinOneCrossed.js";import"../../icons/customIcons/icons/CloseOneFilled.js";import"../../icons/customIcons/icons/AttentionFilled.js";import"../../icons/customIcons/icons/CheckOneFilled.js";import"../../icons/customIcons/icons/Archive.js";import"../../icons/customIcons/icons/ArchiveCancel.js";import"../../icons/customIcons/icons/Unarchive.js";import"../../icons/customIcons/icons/Archived.js";import"../../icons/customIcons/icons/InterventionUnit.js";import"../../icons/customIcons/icons/CloudDelete.js";import"../../icons/customIcons/icons/Lasso.js";import"../../icons/customIcons/icons/Radius.js";import"../../icons/customIcons/icons/ErrorOps.js";import"../../icons/customIcons/icons/DataTypeOps.js";import"../../icons/customIcons/icons/FalsePositiveOps.js";import"../../icons/customIcons/icons/CalibrationOps.js";import"../../icons/customIcons/icons/CriticalOps.js";import"../../icons/customIcons/icons/Company.js";import"../../icons/customIcons/icons/ArchiveOne.js";import"../../icons/customIcons/icons/ParseBotFusion.js";import"../../icons/customIcons/icons/Connect.js";import"../../icons/customIcons/icons/PuzzleOne.js";import"../../icons/customIcons/icons/Feed.js";import"../../icons/customIcons/icons/Prompt.js";import"../../icons/customIcons/icons/Companies.js";import"../../icons/customIcons/icons/ClipboardAi.js";import"../../icons/customIcons/icons/Key.js";import"../../icons/customIcons/icons/AtSignCrossed.js";import"../../icons/customIcons/icons/MappingManual.js";import"../../icons/customIcons/icons/Mapping.js";import"../../icons/customIcons/icons/Metrics.js";import"../../icons/customIcons/icons/Drops.js";import"../../icons/customIcons/icons/ClipboardSearch.js";import"../../icons/customIcons/icons/Template.js";import"../../icons/customIcons/icons/ClipboardMetrics.js";import"../../icons/customIcons/icons/ClipboardBuilder.js";import"../../icons/customIcons/icons/UnitConversion.js";import"../../icons/customIcons/icons/NPT.js";import"../../icons/customIcons/icons/GuidedFrac.js";import"../../componentsV2/Hint/Hint.scss.js";import"../../componentsV2/Counter/Counter.js";import"../../componentsV2/BadgeBase/BadgeBase.scss.js";import"../../componentsV2/TemplatesControl/TemplatesControl.js";import"zustand";import"../../componentsV2/TemplatesControl/utils.js";import"../../componentsV2/TemplatesControl/icons/folder/index.js";import"../../componentsV2/TemplatesControl/Store/utils.js";import"@babel/runtime/helpers/asyncToGenerator";import"@babel/runtime/regenerator";import"../../componentsV2/TemplatesControl/types.js";import"../UserMention/utils/index.js";import"../../utils/convert.js";import"../../constants/completion.js";import"moment";import"../../constants/alerts.js";import"../../utils/casing/validation.js";import"lodash/mean";import"../../constants/streamSourceType.js";import"lodash/get";import"file-saver";import"query-string";import"../../constants/goals.js";import"../../constants/segment.js";import"../../constants/apps.js";import"../../constants/drillstring.js";import"../../constants/appPackages.js";import"../../constants/notifications.js";import"../../constants/feed.js";import"../../constants/bha.js";import"../../constants/corvaCompanyId.js";import"../GradientManager/configuration/constants.js";import"../../utils/drillstring/conversion.js";import"lodash/set";import"lodash/cloneDeep";import"lodash/isNumber";import"lodash/has";import"../../utils/ga.js";import"../../utils/goalsConfig/goalsConfig.js";import"../../utils/lasParser.js";import"../../utils/main.js";import"../../utils/metrics/metricsConfig.js";import"../../utils/mobileDetect.js";import"../../utils/feed.js";import"../../utils/reports.js";import"moment-timezone";import"@babel/runtime/helpers/typeof";import"../../utils/dashboardReports.js";import"../../utils/env.js";import"file-extension";import"image-extensions";import"video-extensions";import"../../utils/jsonaDataFormatter.js";import"../../utils/bha.js";import"jsona";import"../../clients/jsonApi/index.js";import"../../utils/shareRecentRequest.js";import"../../utils/charts/Styles.scss.js";import"../../utils/getSingleAsset.js";import"../../permissions/PermissionsContext.js";import"../../permissions/constants/index.js";import"../../permissions/withPermissionsHOC.js";import"../../permissions/ProvidePermissions.js";import"../../componentsV2/BadgeDot/BadgeDot.scss.js";import"../../componentsV2/LoaderLinear/LoaderLinear.js";import"../../componentsV2/LoaderLogo/LoaderLogo.constants.js";import"../../componentsV2/LoaderLogo/LoaderLogo.scss.js";import"../../componentsV2/Switch/Switch.js";import"../../componentsV2/Tabs/Tabs.js";import"../../componentsV2/EmptyState/EmptyState.scss.js";import"../../componentsV2/FileIcon/FileIcon.js";import"../../componentsV2/Tag/Tag.js";import"react-dropzone";import"../../componentsV2/FilesDropzone/FilesDropzone.scss.js";import"../../componentsV2/FilesLoader/FilesLoader.scss.js";import"../../componentsV2/FilesProcessor/FilesProcessor.scss.js";import"../../componentsV2/Skeleton/Skeleton.scss.js";import"../../componentsV2/CopyToClipboard/CopyToClipboard.scss.js";import"../../componentsV2/Stepper/Step/Step.scss.js";import"../../componentsV2/Stepper/Stepper.scss.js";import"../../componentsV2/ButtonLive/ButtonLive.js";import"../../componentsV2/ButtonText/ButtonText.js";import"../../componentsV2/IndicatorLive/IndicatorLive.js";import"../../componentsV2/Accordion/Accordion.scss.js";import"../../componentsV2/Breadcrumbs/Breadcrumbs.scss.js";import"../../componentsV2/BadgeComment/BadgeComment.js";import"../../componentsV2/AppContainer/AppContainer.js";import"../../componentsV2/AppContainer/AppContainer.constants.js";import"../../componentsV2/AppFooter/AppFooter.js";import"../../componentsV2/AppCommonsProvider/AppCommonsContext.js";import"../../componentsV2/AppHeader/AppHeader.constants.js";import"../../componentsV2/AppHeader/AppBadge/AppBadge.scss.js";import"../DevCenter/DevCenterRouterContext/DevCenterRouterContext.js";import"../DevCenter/DevCenterRouterContext/UniversalLink/UniversalLink.js";import"react-router-dom";import"../../componentsV2/AppHeader/AppAssets/utils.js";import"../../componentsV2/AppHeader/AppAssets/AppAssets.scss.js";import"../PadModeSelect/PadModeSelect.js";import"../../componentsV2/AppHeader/PadMode/PadMode.scss.js";import"../../componentsV2/PadModeSelect/PadModeSelect.js";import"../../componentsV2/PadModeSelect/PadModeSelect.constants.js";import"../../componentsV2/AppCommonsProvider/AppCommonsProvider.js";import"../../componentsV2/AppHeader/V3/VersionSelect/VersionSelect.js";import"../../componentsV2/UniversalLink/UniversalLink.scss.js";import"../../componentsV2/AppHeader/V3/AssetChips/AssetChips.scss.js";import"../../componentsV2/AppHeader/V3/DqStatusIcon/DqStatusIcon.js";import"../../componentsV2/AppHeader/V3/DqStatusIcon/DqStatusIcon.constants.js";import"../../componentsV2/AppFooter/DqPopover/DqStatusIcon/DqStatusIcon.js";import"../../componentsV2/AppDqPopover/DqAlertTooltip/DqAlertTooltip.scss.js";import"../../componentsV2/AppDqPopover/DqAlert/DqAlert.scss.js";import"../../componentsV2/AppDqPopover/DqAsset/DqAsset.scss.js";import"../../componentsV2/AppDqPopover/AppDqPopover.scss.js";import"../AppIcon/AppIcon.js";import"../../componentsV2/AppHeader/V3/AssetSelector/AssetSelectorChip/AssetSelectorChip.js";import"../../componentsV2/AppHeader/V3/AssetSelector/constants.js";import"../../componentsV2/AppHeader/V3/AssetSelector/AssetSelectorSelect/AssetSelectorSelect.scss.js";import"../../componentsV2/AppHeader/V3/AssetSelector/AssetSelectorSelect/loadAssets.js";import"../../componentsV2/AppHeader/V3/AssetSelector/AssetSelector.scss.js";import"querystring";import"../../clients/subscriptions/subscriptions-client.factory.js";import"../StatusBadge/constants.js";import"lodash/unset";import"../../clients/api/apiCore.js";import"../../clients/constants.js";import"../../clients/sso/auth0.js";import"../../clients/sso/oauth2.js";import"../../clients/api/rateLimiter.js";import"lodash/isEmpty";import"lodash/sortBy";import"../DevCenter/DevCenterAppContainer/components/CommentsSwitch/CommentsSwitchContext.js";import"../../componentsV2/AppPanel/AppPanelsContext.js";import"../../componentsV2/AppHeader/V3/AppTitle/AppTitle.constants.js";import"../../componentsV2/AppHeader/V3/AppTitle/AppTitle.scss.js";import"../../componentsV2/AppHeader/V3/constants.scss.js";import"../../componentsV2/AppHeader/V3/SettingsButton/SettingsButton.constants.js";import"../../componentsV2/AppHeader/V3/Actions/Actions.constants.js";import"../../componentsV2/AppHeader/V3/Actions/Actions.scss.js";import"../../componentsV2/AppHeader/V3/AppHeaderV3.scss.js";import"../../componentsV2/AppHeader/AppHeader.scss.js";import"../../componentsV2/OffsetWellsButton/OffsetWellsButton.js";import"../../componentsV2/ChartAxisExtreme/ChartAxisExtreme.scss.js";import"highcharts";import"../../componentsV2/ChartAxisExtreme/ChartAxisExtremeDragTracker.js";import"../../componentsV2/Autocomplete/Autocomplete.js";import"../../componentsV2/Select/Select.js";import"../../componentsV2/AppPanel/AppPanel.js";import"../../componentsV2/AppSettingsDivider/AppSettingsDivider.scss.js";import"../../componentsV2/WellArchivedMessage/WellArchivedMessage.js";import"../../componentsV2/DatePicker/DatePicker.js";import"../../componentsV2/DragHandle/DragHandle.js";import"../../componentsV2/CompletionsOffsetWellPicker/CompletionsOffsetWellPicker.js";import"../../componentsV2/Slider/constants.js";import"../../componentsV2/Slider/components/SliderThumb.js";import"../../componentsV2/Slider/Slider.scss.js";import"../../componentsV2/SliderAdvanced/SliderAdvanced.js";import"react-color";import"../../componentsV2/ColorPicker/ColorPicker.constants.js";import"../../componentsV2/ColorPicker/Swatches/Swatches.scss.js";import"../../componentsV2/ColorPicker/OpacityDragtracker/OpacityDragTracker.scss.js";import"../../componentsV2/ColorPicker/ColorPicker.scss.js";import"../../componentsV2/ChartHelper/ChartHelper.scss.js";import"../../componentsV2/Hotkey/Hotkey.js";import"@tanstack/react-query";import"../../componentsV2/InterventionEventSelector/useInterventionUnitEvents.js";import"../../componentsV2/InterventionEventSelector/InterventionEventSelector.scss.js";import u from"./RealTimeSidebarContext.js";import{ORIENTATIONS as V}from"./enums.js";var A=n((function(o){return{button:{fontSize:14,fontWeight:500},buttonIcon:{fontSize:24,marginRight:8},closedButton:{marginBottom:"78px",zIndex:1e3},rtSidebarFooter:{position:"absolute",right:0,"&.vertical":{left:0,bottom:0},"&.horizontal":{top:0}},rtSidebarFooterIcon:{color:o.palette.primary.text6},rtSidebarFooterActions:{display:"flex",paddingRight:"5px",alignItems:"center",height:48,width:48,padding:6,"&.horizontal":{flexDirection:"row-reverse"}},actionButton:{padding:12,height:36,width:36},openToggleContainer:{alignItems:"center",bottom:0,display:"flex",flex:"0 0",height:48,padding:6,position:"absolute",width:"100%",justifyContent:"flex-start",paddingRight:6},collapseTooltip:{marginTop:-8},expandTooltip:{marginTop:-48}}})),C=o((function(o){var n=o.onSidebarOpened,C=o.onSidebarClosed,I=o.className,h=A(),g=s(u),v=g.isSidebarOpen,S=g.orientation,b=g.handleOpenCloseDialog;return l("div",{className:t(h.rtSidebarFooter,S,I),"data-testid":"sidebar_footer",children:v?l(e,{className:h.openToggleContainer,children:l(j,{title:"Collapse",className:h.collapseTooltip,children:d("div",{className:t(h.rtSidebarFooterActions,S),children:[l(i,{"data-testid":"sidebar_close_button",onClick:C,className:h.actionButton,children:S===V.vertical?l(r,{}):l(c,{className:h.rtSidebarFooterIcon})}),S===V.horizontal&&l(i,{color:"primary",tooltipProps:{title:"Add"},onClick:function(){return b(!0)},className:h.actionButton,children:l(p,{})})]})})}):l(j,{title:"Expand",className:h.expandTooltip,children:l("div",{className:t(h.rtSidebarFooterActions,S),children:l(i,{onClick:n,"data-testid":"sidebar_open_button",className:t(h.closedButton,h.actionButton),children:S===V.vertical?l(m,{}):l(a,{})})})})})}));export{C as default};
 //# sourceMappingURL=SidebarFooter.js.map

package/components/RealTimeValuesSidebar/SidebarFooter.js.map

@@ -1 +1 @@
-{"version":3,"file":"SidebarFooter.js","sources":["../../../src/components/RealTimeValuesSidebar/SidebarFooter.tsx"],"sourcesContent":["import { FC, memo, useContext } from 'react';\nimport classNames from 'classnames';\n\nimport { Box, makeStyles } from '@material-ui/core';\n\nimport IconButton from '~/components/IconButton';\nimport { PlusIcon, DownIcon, LeftIcon, RightIcon, UpIcon } from '~/icons/iconParkIcons';\nimport { Tooltip } from '~/componentsV2';\n\nimport { SidebarFooterProps } from './types';\nimport RealTimeSidebarContext from './RealTimeSidebarContext';\nimport { ORIENTATIONS } from './enums';\n\nconst useStyles = makeStyles((theme: any) => ({\n  button: {\n    fontSize: 14,\n    fontWeight: 500,\n  },\n  buttonIcon: {\n    fontSize: 24,\n    marginRight: 8,\n  },\n  closedButton: {\n    marginBottom: '78px',\n    zIndex: 1000,\n  },\n\n  rtSidebarFooter: {\n    position: 'absolute',\n    right: 0,\n    '&.vertical': {\n      left: 0,\n      bottom: 0,\n    },\n    '&.horizontal': {\n      top: 0,\n    },\n  },\n\n  rtSidebarFooterIcon: {\n    color: theme.palette.primary.text6,\n  },\n\n  rtSidebarFooterActions: {\n    display: 'flex',\n    paddingRight: '5px',\n    alignItems: 'center',\n    height: 48,\n    width: 48,\n    padding: 6,\n\n    '&.horizontal': {\n      flexDirection: 'row-reverse',\n    },\n  },\n\n  actionButton: {\n    padding: 12,\n    height: 36,\n    width: 36,\n  },\n\n  openToggleContainer: {\n    alignItems: 'center',\n    bottom: 0,\n    display: 'flex',\n    flex: '0 0',\n    height: 48,\n    padding: 6,\n    position: 'absolute',\n    width: '100%',\n    justifyContent: 'flex-start',\n    paddingRight: 6,\n  },\n\n  collapseTooltip: {\n    marginTop: -8,\n  },\n\n  expandTooltip: {\n    marginTop: -48,\n  }\n}));\n\nconst SidebarFooter: FC<SidebarFooterProps> = ({ onSidebarOpened, onSidebarClosed, className }) => {\n  const classes = useStyles();\n\n  const { isSidebarOpen, orientation, handleOpenCloseDialog } = useContext(RealTimeSidebarContext)!;\n\n  return (\n    <div\n      className={classNames(classes.rtSidebarFooter, orientation, className)}\n      data-testid=\"sidebar_footer\"\n    >\n      {isSidebarOpen ? (\n        <Box className={classes.openToggleContainer}>\n          <Tooltip title=\"Collapse\" className={classes.collapseTooltip}>\n            <div className={classNames(classes.rtSidebarFooterActions, orientation)}>\n                <IconButton\n                  data-testid=\"sidebar_close_button\"\n                  onClick={onSidebarClosed}\n                  className={classes.actionButton}\n                >\n                  {orientation === ORIENTATIONS.vertical ? (\n                    <RightIcon />\n                  ) : (\n                    <UpIcon className={classes.rtSidebarFooterIcon} />\n                  )}\n                </IconButton>\n                {orientation === ORIENTATIONS.horizontal && (\n                  <IconButton\n                    color=\"primary\"\n                    tooltipProps={{ title: 'Add' }}\n                    onClick={() => handleOpenCloseDialog(true)}\n                    className={classes.actionButton}\n                  >\n                    <PlusIcon />\n                  </IconButton>\n                )}\n            </div>\n          </Tooltip>\n        </Box>\n      ) : (\n        <Tooltip title=\"Expand\" className={classes.expandTooltip}>\n          <div className={classNames(classes.rtSidebarFooterActions, orientation)}>\n            <IconButton\n              onClick={onSidebarOpened}\n              data-testid=\"sidebar_open_button\"\n              className={classNames(classes.closedButton, classes.actionButton)}\n            >\n              {orientation === ORIENTATIONS.vertical ? <LeftIcon /> : <DownIcon />}\n            </IconButton>\n          </div>\n        </Tooltip>\n      )}\n    </div>\n  );\n};\n\nexport default memo(SidebarFooter);\n"],"names":["useStyles","makeStyles","theme","button","fontSize","fontWeight","buttonIcon","marginRight","closedButton","marginBottom","zIndex","rtSidebarFooter","position","right","left","bottom","top","rtSidebarFooterIcon","color","palette","primary","text6","rtSidebarFooterActions","display","paddingRight","alignItems","height","width","padding","flexDirection","actionButton","openToggleContainer","flex","justifyContent","collapseTooltip","marginTop","expandTooltip","memo","_ref","onSidebarOpened","onSidebarClosed","className","classes","useContext","RealTimeSidebarContext","isSidebarOpen","orientation","handleOpenCloseDialog","_jsx","classNames","children","Box","Tooltip","title","_jsxs","IconButton","onClick","ORIENTATIONS","vertical","RightIcon","UpIcon","horizontal","tooltipProps","PlusIcon","LeftIcon","DownIcon"],"mappings":"yvcAaA,IAAMA,EAAYC,GAAW,SAACC,GAAU,MAAM,CAC5CC,OAAQ,CACNC,SAAU,GACVC,WAAY,KAEdC,WAAY,CACVF,SAAU,GACVG,YAAa,GAEfC,aAAc,CACZC,aAAc,OACdC,OAAQ,KAGVC,gBAAiB,CACfC,SAAU,WACVC,MAAO,EACP,aAAc,CACZC,KAAM,EACNC,OAAQ,GAEV,eAAgB,CACdC,IAAK,IAITC,oBAAqB,CACnBC,MAAOhB,EAAMiB,QAAQC,QAAQC,OAG/BC,uBAAwB,CACtBC,QAAS,OACTC,aAAc,MACdC,WAAY,SACZC,OAAQ,GACRC,MAAO,GACPC,QAAS,EAET,eAAgB,CACdC,cAAe,gBAInBC,aAAc,CACZF,QAAS,GACTF,OAAQ,GACRC,MAAO,IAGTI,oBAAqB,CACnBN,WAAY,SACZV,OAAQ,EACRQ,QAAS,OACTS,KAAM,MACNN,OAAQ,GACRE,QAAS,EACThB,SAAU,WACVe,MAAO,OACPM,eAAgB,aAChBT,aAAc,GAGhBU,gBAAiB,CACfC,WAAY,GAGdC,cAAe,CACbD,WAAY,IAEf,IAyDcE,EAAAA,GAvD+B,SAAqDC,GAAA,IAAlDC,IAAAA,gBAAiBC,IAAAA,gBAAiBC,IAAAA,UAC3EC,EAAU1C,IAE8C2C,EAAAA,EAAWC,GAAjEC,IAAAA,cAAeC,IAAAA,YAAaC,IAAAA,sBAEpC,OACEC,EAAA,MAAA,CACEP,UAAWQ,EAAWP,EAAQ/B,gBAAiBmC,EAAaL,GAC5D,cAAY,iBAAgBS,SAE3BL,EACCG,EAACG,EAAG,CAACV,UAAWC,EAAQX,oBAAoBmB,SAC1CF,EAACI,EAAO,CAACC,MAAM,WAAWZ,UAAWC,EAAQR,gBAAgBgB,SAC3DI,EAAA,MAAA,CAAKb,UAAWQ,EAAWP,EAAQpB,uBAAwBwB,GAAaI,SAAA,CACpEF,EAACO,EAAU,CACT,cAAY,uBACZC,QAAShB,EACTC,UAAWC,EAAQZ,aAAaoB,SAE/BJ,IAAgBW,EAAaC,SAC5BV,EAACW,EAAS,CAAA,GAEVX,EAACY,EAAM,CAACnB,UAAWC,EAAQzB,wBAG9B6B,IAAgBW,EAAaI,YAC5Bb,EAACO,EAAU,CACTrC,MAAM,UACN4C,aAAc,CAAET,MAAO,OACvBG,QAAS,WAAA,OAAMT,GAAsB,EAAM,EAC3CN,UAAWC,EAAQZ,aAAaoB,SAEhCF,EAACe,EAAQ,aAOrBf,EAACI,EAAO,CAACC,MAAM,SAASZ,UAAWC,EAAQN,cAAcc,SACvDF,EAAA,MAAA,CAAKP,UAAWQ,EAAWP,EAAQpB,uBAAwBwB,GAAaI,SACtEF,EAACO,EAAU,CACTC,QAASjB,EACT,cAAY,sBACZE,UAAWQ,EAAWP,EAAQlC,aAAckC,EAAQZ,cAAcoB,SAEjEJ,IAAgBW,EAAaC,SAAWV,EAACgB,EAAQ,CAAA,GAAMhB,EAACiB,EAAQ,WAO/E"}
+{"version":3,"file":"SidebarFooter.js","sources":["../../../src/components/RealTimeValuesSidebar/SidebarFooter.tsx"],"sourcesContent":["import { FC, memo, useContext } from 'react';\nimport classNames from 'classnames';\n\nimport { Box, makeStyles } from '@material-ui/core';\n\nimport IconButton from '~/components/IconButton';\nimport { PlusIcon, DownIcon, LeftIcon, RightIcon, UpIcon } from '~/icons/iconParkIcons';\nimport { Tooltip } from '~/componentsV2';\n\nimport { SidebarFooterProps } from './types';\nimport RealTimeSidebarContext from './RealTimeSidebarContext';\nimport { ORIENTATIONS } from './enums';\n\nconst useStyles = makeStyles((theme: any) => ({\n  button: {\n    fontSize: 14,\n    fontWeight: 500,\n  },\n  buttonIcon: {\n    fontSize: 24,\n    marginRight: 8,\n  },\n  closedButton: {\n    marginBottom: '78px',\n    zIndex: 1000,\n  },\n\n  rtSidebarFooter: {\n    position: 'absolute',\n    right: 0,\n    '&.vertical': {\n      left: 0,\n      bottom: 0,\n    },\n    '&.horizontal': {\n      top: 0,\n    },\n  },\n\n  rtSidebarFooterIcon: {\n    color: theme.palette.primary.text6,\n  },\n\n  rtSidebarFooterActions: {\n    display: 'flex',\n    paddingRight: '5px',\n    alignItems: 'center',\n    height: 48,\n    width: 48,\n    padding: 6,\n\n    '&.horizontal': {\n      flexDirection: 'row-reverse',\n    },\n  },\n\n  actionButton: {\n    padding: 12,\n    height: 36,\n    width: 36,\n  },\n\n  openToggleContainer: {\n    alignItems: 'center',\n    bottom: 0,\n    display: 'flex',\n    flex: '0 0',\n    height: 48,\n    padding: 6,\n    position: 'absolute',\n    width: '100%',\n    justifyContent: 'flex-start',\n    paddingRight: 6,\n  },\n\n  collapseTooltip: {\n    marginTop: -8,\n  },\n\n  expandTooltip: {\n    marginTop: -48,\n  }\n}));\n\nconst SidebarFooter: FC<SidebarFooterProps> = ({ onSidebarOpened, onSidebarClosed, className }) => {\n  const classes = useStyles();\n\n  const { isSidebarOpen, orientation, handleOpenCloseDialog } = useContext(RealTimeSidebarContext)!;\n\n  return (\n    <div\n      className={classNames(classes.rtSidebarFooter, orientation, className)}\n      data-testid=\"sidebar_footer\"\n    >\n      {isSidebarOpen ? (\n        <Box className={classes.openToggleContainer}>\n          <Tooltip title=\"Collapse\" className={classes.collapseTooltip}>\n            <div className={classNames(classes.rtSidebarFooterActions, orientation)}>\n                <IconButton\n                  data-testid=\"sidebar_close_button\"\n                  onClick={onSidebarClosed}\n                  className={classes.actionButton}\n                >\n                  {orientation === ORIENTATIONS.vertical ? (\n                    <RightIcon />\n                  ) : (\n                    <UpIcon className={classes.rtSidebarFooterIcon} />\n                  )}\n                </IconButton>\n                {orientation === ORIENTATIONS.horizontal && (\n                  <IconButton\n                    color=\"primary\"\n                    tooltipProps={{ title: 'Add' }}\n                    onClick={() => handleOpenCloseDialog(true)}\n                    className={classes.actionButton}\n                  >\n                    <PlusIcon />\n                  </IconButton>\n                )}\n            </div>\n          </Tooltip>\n        </Box>\n      ) : (\n        <Tooltip title=\"Expand\" className={classes.expandTooltip}>\n          <div className={classNames(classes.rtSidebarFooterActions, orientation)}>\n            <IconButton\n              onClick={onSidebarOpened}\n              data-testid=\"sidebar_open_button\"\n              className={classNames(classes.closedButton, classes.actionButton)}\n            >\n              {orientation === ORIENTATIONS.vertical ? <LeftIcon /> : <DownIcon />}\n            </IconButton>\n          </div>\n        </Tooltip>\n      )}\n    </div>\n  );\n};\n\nexport default memo(SidebarFooter);\n"],"names":["useStyles","makeStyles","theme","button","fontSize","fontWeight","buttonIcon","marginRight","closedButton","marginBottom","zIndex","rtSidebarFooter","position","right","left","bottom","top","rtSidebarFooterIcon","color","palette","primary","text6","rtSidebarFooterActions","display","paddingRight","alignItems","height","width","padding","flexDirection","actionButton","openToggleContainer","flex","justifyContent","collapseTooltip","marginTop","expandTooltip","memo","_ref","onSidebarOpened","onSidebarClosed","className","classes","useContext","RealTimeSidebarContext","isSidebarOpen","orientation","handleOpenCloseDialog","_jsx","classNames","children","Box","Tooltip","title","_jsxs","IconButton","onClick","ORIENTATIONS","vertical","RightIcon","UpIcon","horizontal","tooltipProps","PlusIcon","LeftIcon","DownIcon"],"mappings":"yzcAaA,IAAMA,EAAYC,GAAW,SAACC,GAAU,MAAM,CAC5CC,OAAQ,CACNC,SAAU,GACVC,WAAY,KAEdC,WAAY,CACVF,SAAU,GACVG,YAAa,GAEfC,aAAc,CACZC,aAAc,OACdC,OAAQ,KAGVC,gBAAiB,CACfC,SAAU,WACVC,MAAO,EACP,aAAc,CACZC,KAAM,EACNC,OAAQ,GAEV,eAAgB,CACdC,IAAK,IAITC,oBAAqB,CACnBC,MAAOhB,EAAMiB,QAAQC,QAAQC,OAG/BC,uBAAwB,CACtBC,QAAS,OACTC,aAAc,MACdC,WAAY,SACZC,OAAQ,GACRC,MAAO,GACPC,QAAS,EAET,eAAgB,CACdC,cAAe,gBAInBC,aAAc,CACZF,QAAS,GACTF,OAAQ,GACRC,MAAO,IAGTI,oBAAqB,CACnBN,WAAY,SACZV,OAAQ,EACRQ,QAAS,OACTS,KAAM,MACNN,OAAQ,GACRE,QAAS,EACThB,SAAU,WACVe,MAAO,OACPM,eAAgB,aAChBT,aAAc,GAGhBU,gBAAiB,CACfC,WAAY,GAGdC,cAAe,CACbD,WAAY,IAEf,IAyDcE,EAAAA,GAvD+B,SAAqDC,GAAA,IAAlDC,IAAAA,gBAAiBC,IAAAA,gBAAiBC,IAAAA,UAC3EC,EAAU1C,IAE8C2C,EAAAA,EAAWC,GAAjEC,IAAAA,cAAeC,IAAAA,YAAaC,IAAAA,sBAEpC,OACEC,EAAA,MAAA,CACEP,UAAWQ,EAAWP,EAAQ/B,gBAAiBmC,EAAaL,GAC5D,cAAY,iBAAgBS,SAE3BL,EACCG,EAACG,EAAG,CAACV,UAAWC,EAAQX,oBAAoBmB,SAC1CF,EAACI,EAAO,CAACC,MAAM,WAAWZ,UAAWC,EAAQR,gBAAgBgB,SAC3DI,EAAA,MAAA,CAAKb,UAAWQ,EAAWP,EAAQpB,uBAAwBwB,GAAaI,SAAA,CACpEF,EAACO,EAAU,CACT,cAAY,uBACZC,QAAShB,EACTC,UAAWC,EAAQZ,aAAaoB,SAE/BJ,IAAgBW,EAAaC,SAC5BV,EAACW,EAAS,CAAA,GAEVX,EAACY,EAAM,CAACnB,UAAWC,EAAQzB,wBAG9B6B,IAAgBW,EAAaI,YAC5Bb,EAACO,EAAU,CACTrC,MAAM,UACN4C,aAAc,CAAET,MAAO,OACvBG,QAAS,WAAA,OAAMT,GAAsB,EAAM,EAC3CN,UAAWC,EAAQZ,aAAaoB,SAEhCF,EAACe,EAAQ,aAOrBf,EAACI,EAAO,CAACC,MAAM,SAASZ,UAAWC,EAAQN,cAAcc,SACvDF,EAAA,MAAA,CAAKP,UAAWQ,EAAWP,EAAQpB,uBAAwBwB,GAAaI,SACtEF,EAACO,EAAU,CACTC,QAASjB,EACT,cAAY,sBACZE,UAAWQ,EAAWP,EAAQlC,aAAckC,EAAQZ,cAAcoB,SAEjEJ,IAAgBW,EAAaC,SAAWV,EAACgB,EAAQ,CAAA,GAAMhB,EAACiB,EAAQ,WAO/E"}

package/componentsV2/ColorPicker/ColorPicker.constants.d.ts

@@ -0,0 +1,7 @@
+export declare enum ColorPickerTestIds {
+    IndicatorTestId = "CorvaUI.ColorPicker.IndicatorTestId",
+    PopoverTestId = "CorvaUI.ColorPicker.PopoverTestId",
+    SwatchTestId = "CorvaUI.ColorPicker.SwatchTestId",
+    SelectedSwatchTestId = "CorvaUI.ColorPicker.SelectedSwatchTestId"
+}
+//# sourceMappingURL=ColorPicker.constants.d.ts.map

package/componentsV2/ColorPicker/ColorPicker.constants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColorPicker.constants.d.ts","sourceRoot":"","sources":["../../../src/componentsV2/ColorPicker/ColorPicker.constants.ts"],"names":[],"mappings":"AAAA,oBAAY,kBAAkB;IAC5B,eAAe,wCAAwC;IACvD,aAAa,sCAAsC;IACnD,YAAY,qCAAqC;IACjD,oBAAoB,6CAA6C;CAClE"}

package/componentsV2/ColorPicker/ColorPicker.constants.js

@@ -0,0 +1,2 @@
+var e;!function(e){e.IndicatorTestId="CorvaUI.ColorPicker.IndicatorTestId",e.PopoverTestId="CorvaUI.ColorPicker.PopoverTestId",e.SwatchTestId="CorvaUI.ColorPicker.SwatchTestId",e.SelectedSwatchTestId="CorvaUI.ColorPicker.SelectedSwatchTestId"}(e||(e={}));export{e as ColorPickerTestIds};
+//# sourceMappingURL=ColorPicker.constants.js.map

package/componentsV2/ColorPicker/ColorPicker.constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColorPicker.constants.js","sources":["../../../src/componentsV2/ColorPicker/ColorPicker.constants.ts"],"sourcesContent":["export enum ColorPickerTestIds {\n  IndicatorTestId = 'CorvaUI.ColorPicker.IndicatorTestId',\n  PopoverTestId = 'CorvaUI.ColorPicker.PopoverTestId',\n  SwatchTestId = 'CorvaUI.ColorPicker.SwatchTestId',\n  SelectedSwatchTestId = 'CorvaUI.ColorPicker.SelectedSwatchTestId',\n}\n"],"names":["ColorPickerTestIds"],"mappings":"AAAA,IAAYA,GAKX,SALWA,GAAAA,EAAkB,gBAAA,sCAAlBA,EAAkB,cAAA,oCAAlBA,EAAkB,aAAA,mCAAlBA,EAAkB,qBAAA,0CAAlBA,CAKX,CALWA,IAAAA,EAAkB,CAAA"}

package/componentsV2/ColorPicker/ColorPicker.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ColorPicker.d.ts","sourceRoot":"","sources":["../../../src/componentsV2/ColorPicker/ColorPicker.tsx"],"names":[],"mappings":"AAeA,OAAO,EAAiB,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AACrE,OAAO,EAAW,YAAY,EAAE,MAAM,YAAY,CAAC;AAcnD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAEnC,IAAI,CAAC,EAAE,kBAAkB,CAAC,MAAM,CAAC,CAAC;IAClC,KAAK,CAAC,EAAE,kBAAkB,CAAC,OAAO,CAAC,CAAC;IACpC,cAAc,CAAC,EAAE,kBAAkB,CAAC,gBAAgB,CAAC,CAAC;IACtD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,GAAG,KAAK,CAAC;IACvB;;OAEG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IAEtB,gBAAgB,CAAC,EAAE,YAAY,CAAC,WAAW,CAAC,CAAC;IAE7C,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IAErB;;OAEG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAC1B,IAAI,CACF,QAAQ,CAAC,kBAAkB,CAAC,CAAC,oBAAoB,CAAC,EAClD,SAAS,GAAG,mBAAmB,GAAG,QAAQ,GAAG,QAAQ,CACtD,GACC,MAAM,CAAC,WAAW,GAAG,SAAS,EAAE,MAAM,CAAC,CAC1C,CAAC;IAEF,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAmBF,eAAO,MAAM,WAAW,mLAgBrB,gBAAgB,4CAgXlB,CAAC"}
+{"version":3,"file":"ColorPicker.d.ts","sourceRoot":"","sources":["../../../src/componentsV2/ColorPicker/ColorPicker.tsx"],"names":[],"mappings":"AAeA,OAAO,EAAiB,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AACrE,OAAO,EAAW,YAAY,EAAE,MAAM,YAAY,CAAC;AAenD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAEnC,IAAI,CAAC,EAAE,kBAAkB,CAAC,MAAM,CAAC,CAAC;IAClC,KAAK,CAAC,EAAE,kBAAkB,CAAC,OAAO,CAAC,CAAC;IACpC,cAAc,CAAC,EAAE,kBAAkB,CAAC,gBAAgB,CAAC,CAAC;IACtD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,GAAG,KAAK,CAAC;IACvB;;OAEG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IAEtB,gBAAgB,CAAC,EAAE,YAAY,CAAC,WAAW,CAAC,CAAC;IAE7C,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IAErB;;OAEG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAC1B,IAAI,CACF,QAAQ,CAAC,kBAAkB,CAAC,CAAC,oBAAoB,CAAC,EAClD,SAAS,GAAG,mBAAmB,GAAG,QAAQ,GAAG,QAAQ,CACtD,GACC,MAAM,CAAC,WAAW,GAAG,SAAS,EAAE,MAAM,CAAC,CAC1C,CAAC;IAEF,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAmBF,eAAO,MAAM,WAAW,mLAgBrB,gBAAgB,4CAkXlB,CAAC"}

package/componentsV2/ColorPicker/ColorPicker.js

@@ -1,2 +1,2 @@
-import o from"@babel/runtime/helpers/slicedToArray";import n from"@babel/runtime/helpers/defineProperty";import s from"classnames";import{useMemo as c,useState as i,useRef as t,useCallback as r,useEffect as e}from"react";import{ChromePicker as a}from"react-color";import{throttle as m}from"lodash";import{v4 as l}from"uuid";import{TextInputNext as u}from"../TextInputNext/TextInputNext.js";import{Popover as p}from"../Popover/Popover.js";import{ButtonIcon as d}from"../ButtonIcon/ButtonIcon.js";import{Tooltip as j}from"../Tooltip/Tooltip.js";import{Popper as I}from"../Popper/Popper.js";import{Swatches as f}from"./Swatches/Swatches.js";import{parseColor as h,channelsToHex as b,channelsToRgba as v,defaultColor as C}from"./utils.js";import{OpacityDragTracker as y}from"./OpacityDragtracker/OpacityDragtracker.js";import{useChromePickerAccessibility as g}from"./useChromePickerAccessibility.js";import O from"./ColorPicker.scss.js";import{PaletteIcon as P,PickerIcon as k}from"../../icons/iconParkIcons.js";import"../../icons/customIcons/icons/AddMessage.js";import"../../icons/customIcons/icons/DragOne.js";import"../../icons/customIcons/icons/Attention.js";import"../../icons/customIcons/icons/Collapse.js";import"../../icons/customIcons/icons/Dashboard.js";import"../../icons/customIcons/icons/Expand.js";import"../../icons/customIcons/icons/FolderClosed.js";import"../../icons/customIcons/icons/FolderClosedFilled.js";import"../../icons/customIcons/icons/FolderOpened.js";import"../../icons/customIcons/icons/GreaterOrEqual.js";import"../../icons/customIcons/icons/LessOrEqual.js";import"../../icons/customIcons/icons/Search.js";import"../../icons/customIcons/icons/SearchOne.js";import"../../icons/customIcons/icons/Wellhub.js";import"../../icons/customIcons/icons/MultiRuler.js";import"../../icons/customIcons/icons/Checkbox.js";import"../../icons/customIcons/icons/CheckboxChecked.js";import"../../icons/customIcons/icons/CheckboxIndeterminate.js";import"../../icons/customIcons/icons/Radio.js";import"../../icons/customIcons/icons/RadioChecked.js";import"../../icons/customIcons/icons/SimulFrac.js";import"../../icons/customIcons/icons/ZipperFrac.js";import"../../icons/customIcons/icons/CautionFilled.js";import"../../icons/customIcons/icons/InfoRounded.js";import"../../icons/customIcons/icons/FlameFilled.js";import"../../icons/customIcons/icons/MoreApp.js";import"../../icons/customIcons/icons/Pad.js";import"../../icons/customIcons/icons/DrilloutUnit.js";import"../../icons/customIcons/icons/FracFleet.js";import"../../icons/customIcons/icons/Global.js";import"../../icons/customIcons/icons/Program.js";import"../../icons/customIcons/icons/Rig.js";import"../../icons/customIcons/icons/Well.js";import"../../icons/customIcons/icons/Gap.js";import"../../icons/customIcons/icons/Pin.js";import"../../icons/customIcons/icons/PinOne.js";import"../../icons/customIcons/icons/PinOneCrossed.js";import"../../icons/customIcons/icons/CloseOneFilled.js";import"../../icons/customIcons/icons/AttentionFilled.js";import"../../icons/customIcons/icons/CheckOneFilled.js";import"../../icons/customIcons/icons/Archive.js";import"../../icons/customIcons/icons/ArchiveCancel.js";import"../../icons/customIcons/icons/Unarchive.js";import"../../icons/customIcons/icons/Archived.js";import"../../icons/customIcons/icons/InterventionUnit.js";import"../../icons/customIcons/icons/CloudDelete.js";import"../../icons/customIcons/icons/Lasso.js";import"../../icons/customIcons/icons/Radius.js";import"../../icons/customIcons/icons/ErrorOps.js";import"../../icons/customIcons/icons/DataTypeOps.js";import"../../icons/customIcons/icons/FalsePositiveOps.js";import"../../icons/customIcons/icons/CalibrationOps.js";import"../../icons/customIcons/icons/CriticalOps.js";import"../../icons/customIcons/icons/Company.js";import"../../icons/customIcons/icons/ArchiveOne.js";import"../../icons/customIcons/icons/ParseBotFusion.js";import"../../icons/customIcons/icons/Connect.js";import"../../icons/customIcons/icons/PuzzleOne.js";import"../../icons/customIcons/icons/Feed.js";import"../../icons/customIcons/icons/Prompt.js";import"../../icons/customIcons/icons/Companies.js";import"../../icons/customIcons/icons/ClipboardAi.js";import"../../icons/customIcons/icons/Key.js";import"../../icons/customIcons/icons/AtSignCrossed.js";import"../../icons/customIcons/icons/MappingManual.js";import"../../icons/customIcons/icons/Mapping.js";import"../../icons/customIcons/icons/Metrics.js";import"../../icons/customIcons/icons/Drops.js";import"../../icons/customIcons/icons/ClipboardSearch.js";import"../../icons/customIcons/icons/Template.js";import"../../icons/customIcons/icons/ClipboardMetrics.js";import"../../icons/customIcons/icons/ClipboardBuilder.js";import"../../icons/customIcons/icons/UnitConversion.js";import"../../icons/customIcons/icons/NPT.js";import"../../icons/customIcons/icons/GuidedFrac.js";import{jsxs as D,Fragment as F,jsx as N}from"react/jsx-runtime";function x(o,n){var s=Object.keys(o);if(Object.getOwnPropertySymbols){var c=Object.getOwnPropertySymbols(o);n&&(c=c.filter((function(n){return Object.getOwnPropertyDescriptor(o,n).enumerable}))),s.push.apply(s,c)}return s}function A(o){for(var s=1;s<arguments.length;s++){var c=null!=arguments[s]?arguments[s]:{};s%2?x(Object(c),!0).forEach((function(s){n(o,s,c[s])})):Object.getOwnPropertyDescriptors?Object.defineProperties(o,Object.getOwnPropertyDescriptors(c)):x(Object(c)).forEach((function(n){Object.defineProperty(o,n,Object.getOwnPropertyDescriptor(c,n))}))}return o}var S={small:O.small,medium:O.medium,large:O.large},w={inputContainer:O.inputContainer,numberStepButtons:O.numberStepButtons,prefix:O.prefixContainer,suffix:O.suffixContainer,input:O.input,label:O.label},T=function(x){var T=x.format,E=void 0===T?"hex":T,M=x.className,B=x.label,R=x.labelPlacement,z=void 0===R?"top":R,W=x.popoverPlacement,L=void 0===W?"bottom-start":W,G=x.testId,K=x.disabled,U=x.size,q=void 0===U?"small":U,V=x.onOpen,H=x.onClose,Z=x.value,J=void 0===Z?C:Z,Q=x.onChange,X=x.disableOpacityDrag,Y=x.enableAlpha,$=void 0!==Y&&Y,_=x.elementsClassNames,oo=c((function(){try{var o=h(J);return A(A({},o),{},{a:$?o.a:1})}catch(o){return h(C)}}),[J,$]),no=c((function(){return _?Object.entries(_).reduce((function(c,i){var t=o(i,2),r=t[0],e=t[1];return A(A({},c),{},n({},r,c[r]?s(c[r],e):e))}),A({},w)):w}),[_]),so=i(!1),co=o(so,2),io=co[0],to=co[1],ro=t(null),eo=t(null),ao=i(!0),mo=o(ao,2),lo=mo[0],uo=mo[1],po=i(null),jo=o(po,2),Io=jo[0],fo=jo[1],ho=i(oo),bo=o(ho,2),vo=bo[0],Co=bo[1],yo=t(null),go=c((function(){return"corva-color-picker-".concat(l())}),[]),Oo="".concat(go,"-opacity-input"),Po="".concat(go,"-label"),ko="".concat(go,"-opacity-label"),Do=Boolean(B),Fo=r((function(){to(!0),null==V||V()}),[V]),No=r((function(o){o.preventDefault(),fo(null),Fo()}),[Fo]),xo=r((function(){fo(null),Fo()}),[Fo]),Ao=r((function(o){K||"Enter"!==o.key&&" "!==o.key&&"ArrowDown"!==o.key||(o.preventDefault(),fo("palette"),Fo())}),[K,Fo]),So=r((function(){var o,n,s=!(null===(o=yo.current)||void 0===o||!o.contains(document.activeElement));(fo(null),to(!1),null==H||H(),s)&&(null===(n=eo.current)||void 0===n||n.focus({preventScroll:!0}))}),[H]),wo=r((function(o){fo(0===o.detail?"palette":null),uo(!0)}),[]),To=r((function(o){fo(0===o.detail?"picker":null),uo(!1)}),[]),Eo=r((function(){return fo(null)}),[]),Mo=r((function(o){return Co(o.rgb)}),[]),Bo=r((function(o){var n="hex"===E?b(o,$):v(o,$);null==Q||Q(n)}),[E,Q,$]),Ro=r((function(o){Co(o),Bo(o)}),[Bo]),zo=g({color:vo,enableAlpha:$,isActive:!lo,onChange:Ro}),Wo=zo.pickerRef,Lo=zo.onKeyDown;e((function(){var o;if("picker"===Io&&!lo){var n=null===(o=Wo.current)||void 0===o?void 0:o.querySelector('[data-color-picker-control="saturation"]');n&&(n.focus({preventScroll:!0}),Eo())}}),[Eo,Io,lo,Wo]);var Go=r((function(o){var n=Number(o);if(!(Number.isNaN(n)||n<0||n>100)){var s=A(A({},oo),{},{a:n/100});Bo(s)}}),[oo,Bo]),Ko=r((function(o){Bo(o.rgb)}),[Bo]),Uo=r((function(o){var n=oo.a||1,s=$&&0===o.a?0:n;Bo(A(A({},o),{},{a:s}))}),[Bo,oo.a,$]),qo=r((function(){setTimeout((function(){var o,n;to(!1),null===(o=document.activeElement)||void 0===o||null===(n=o.blur)||void 0===n||n.call(o)}),0)}),[]),Vo=c((function(){return m((function(o){var n=String(Math.round(o));Go(n)}),100)}),[Go]);e((function(){Co(oo)}),[oo]),e((function(){io&&uo(!0)}),[io]);var Ho=String(Math.round(100*vo.a)),Zo=(null==L?void 0:L.startsWith("top"))||(null==L?void 0:L.startsWith("bottom")),Jo=(null==L?void 0:L.startsWith("left"))||(null==L?void 0:L.startsWith("right")),Qo=Do?D(F,{children:[N("label",{id:Po,htmlFor:Oo,children:"string"==typeof B?N(u.Label,{children:B}):B}),N("span",{id:ko,hidden:!0,children:"Opacity"})]}):void 0,Xo=c((function(){return Do?{id:Oo,"aria-labelledby":"".concat(Po," ").concat(ko)}:{id:Oo,"aria-label":"Opacity"}}),[Do,Oo,Po,ko]);return D(F,{children:[N(u,{label:Qo,labelPlacement:z,disabled:K,size:q,rootTagName:"div",prefix:D(F,{children:[D("div",{className:O.fakeValue,children:[Ho,N("span",{className:O.fakeValuePercent,children:"%"})]}),N("div",{ref:eo,className:s(O.indicator,0===vo.a&&O.transparent,no.indicator),style:{"--corvaui-colorpicker-indicatorcolor":b(vo,!1)},onClick:K?void 0:No,onKeyDown:Ao,role:"button","aria-label":Do?void 0:"Color picker","aria-labelledby":Do?Po:void 0,"aria-expanded":io,"aria-disabled":K,tabIndex:K?-1:0})]}),suffix:!io&&$&&!X&&!K&&N(y,{value:Number(Ho),onDrag:Vo,onDragEnd:qo}),className:s(O.root,S[q],!$&&O.noAlpha,M),testId:G,inputContainerRef:ro,value:Ho,onChange:Go,onFocus:xo,inputType:"number",inputMode:"numeric",elementsClassNames:no,htmlAttributes:Xo}),D(p,{ref:yo,anchorEl:ro.current,open:io,onClose:So,placement:L,className:s(O.popover,Zo&&O.marginVertical,Jo&&O.marginHorizontal,0===vo.a&&O.isTransparent,no.popover),children:[lo?N(f,{onChange:Uo,value:oo,addTransparent:$,autoFocus:"palette"===Io,onAutoFocus:Eo}):N("div",{ref:Wo,className:O.pickerContainer,onKeyDown:Lo,children:N(a,{color:vo,onChange:Mo,onChangeComplete:Ko,disableAlpha:!$,className:O.picker})}),D("div",{className:O.switchButtons,children:[N(j,{title:"Palette",children:N(d,{ariaLabel:"Show color palette",size:"medium",type:lo?"secondary":"tertiary",onClick:wo,children:N(P,{})})}),N(j,{title:"Pick your own",children:N(d,{ariaLabel:"Show custom color picker",size:"medium",type:lo?"tertiary":"secondary",onClick:To,children:N(k,{})})})]})]}),io&&$&&!X&&N(I,{open:io,anchorEl:ro.current,className:O.dragTrackerPopper,placement:"right",children:N(y,{onDrag:Vo,onDragEnd:qo})})]})};export{T as ColorPicker};
+import o from"@babel/runtime/helpers/slicedToArray";import n from"@babel/runtime/helpers/defineProperty";import s from"classnames";import{useMemo as c,useState as i,useRef as t,useCallback as r,useEffect as e}from"react";import{ChromePicker as a}from"react-color";import{throttle as m}from"lodash";import{v4 as l}from"uuid";import{TextInputNext as u}from"../TextInputNext/TextInputNext.js";import{Popover as p}from"../Popover/Popover.js";import{ButtonIcon as d}from"../ButtonIcon/ButtonIcon.js";import{Tooltip as j}from"../Tooltip/Tooltip.js";import{Popper as I}from"../Popper/Popper.js";import{Swatches as f}from"./Swatches/Swatches.js";import{ColorPickerTestIds as h}from"./ColorPicker.constants.js";import{parseColor as v,channelsToHex as b,channelsToRgba as C,defaultColor as y}from"./utils.js";import{OpacityDragTracker as g}from"./OpacityDragtracker/OpacityDragtracker.js";import{useChromePickerAccessibility as O}from"./useChromePickerAccessibility.js";import P from"./ColorPicker.scss.js";import{PaletteIcon as k,PickerIcon as D}from"../../icons/iconParkIcons.js";import"../../icons/customIcons/icons/AddMessage.js";import"../../icons/customIcons/icons/DragOne.js";import"../../icons/customIcons/icons/Attention.js";import"../../icons/customIcons/icons/Collapse.js";import"../../icons/customIcons/icons/Dashboard.js";import"../../icons/customIcons/icons/Expand.js";import"../../icons/customIcons/icons/FolderClosed.js";import"../../icons/customIcons/icons/FolderClosedFilled.js";import"../../icons/customIcons/icons/FolderOpened.js";import"../../icons/customIcons/icons/GreaterOrEqual.js";import"../../icons/customIcons/icons/LessOrEqual.js";import"../../icons/customIcons/icons/Search.js";import"../../icons/customIcons/icons/SearchOne.js";import"../../icons/customIcons/icons/Wellhub.js";import"../../icons/customIcons/icons/MultiRuler.js";import"../../icons/customIcons/icons/Checkbox.js";import"../../icons/customIcons/icons/CheckboxChecked.js";import"../../icons/customIcons/icons/CheckboxIndeterminate.js";import"../../icons/customIcons/icons/Radio.js";import"../../icons/customIcons/icons/RadioChecked.js";import"../../icons/customIcons/icons/SimulFrac.js";import"../../icons/customIcons/icons/ZipperFrac.js";import"../../icons/customIcons/icons/CautionFilled.js";import"../../icons/customIcons/icons/InfoRounded.js";import"../../icons/customIcons/icons/FlameFilled.js";import"../../icons/customIcons/icons/MoreApp.js";import"../../icons/customIcons/icons/Pad.js";import"../../icons/customIcons/icons/DrilloutUnit.js";import"../../icons/customIcons/icons/FracFleet.js";import"../../icons/customIcons/icons/Global.js";import"../../icons/customIcons/icons/Program.js";import"../../icons/customIcons/icons/Rig.js";import"../../icons/customIcons/icons/Well.js";import"../../icons/customIcons/icons/Gap.js";import"../../icons/customIcons/icons/Pin.js";import"../../icons/customIcons/icons/PinOne.js";import"../../icons/customIcons/icons/PinOneCrossed.js";import"../../icons/customIcons/icons/CloseOneFilled.js";import"../../icons/customIcons/icons/AttentionFilled.js";import"../../icons/customIcons/icons/CheckOneFilled.js";import"../../icons/customIcons/icons/Archive.js";import"../../icons/customIcons/icons/ArchiveCancel.js";import"../../icons/customIcons/icons/Unarchive.js";import"../../icons/customIcons/icons/Archived.js";import"../../icons/customIcons/icons/InterventionUnit.js";import"../../icons/customIcons/icons/CloudDelete.js";import"../../icons/customIcons/icons/Lasso.js";import"../../icons/customIcons/icons/Radius.js";import"../../icons/customIcons/icons/ErrorOps.js";import"../../icons/customIcons/icons/DataTypeOps.js";import"../../icons/customIcons/icons/FalsePositiveOps.js";import"../../icons/customIcons/icons/CalibrationOps.js";import"../../icons/customIcons/icons/CriticalOps.js";import"../../icons/customIcons/icons/Company.js";import"../../icons/customIcons/icons/ArchiveOne.js";import"../../icons/customIcons/icons/ParseBotFusion.js";import"../../icons/customIcons/icons/Connect.js";import"../../icons/customIcons/icons/PuzzleOne.js";import"../../icons/customIcons/icons/Feed.js";import"../../icons/customIcons/icons/Prompt.js";import"../../icons/customIcons/icons/Companies.js";import"../../icons/customIcons/icons/ClipboardAi.js";import"../../icons/customIcons/icons/Key.js";import"../../icons/customIcons/icons/AtSignCrossed.js";import"../../icons/customIcons/icons/MappingManual.js";import"../../icons/customIcons/icons/Mapping.js";import"../../icons/customIcons/icons/Metrics.js";import"../../icons/customIcons/icons/Drops.js";import"../../icons/customIcons/icons/ClipboardSearch.js";import"../../icons/customIcons/icons/Template.js";import"../../icons/customIcons/icons/ClipboardMetrics.js";import"../../icons/customIcons/icons/ClipboardBuilder.js";import"../../icons/customIcons/icons/UnitConversion.js";import"../../icons/customIcons/icons/NPT.js";import"../../icons/customIcons/icons/GuidedFrac.js";import{jsxs as F,Fragment as N,jsx as x}from"react/jsx-runtime";function A(o,n){var s=Object.keys(o);if(Object.getOwnPropertySymbols){var c=Object.getOwnPropertySymbols(o);n&&(c=c.filter((function(n){return Object.getOwnPropertyDescriptor(o,n).enumerable}))),s.push.apply(s,c)}return s}function S(o){for(var s=1;s<arguments.length;s++){var c=null!=arguments[s]?arguments[s]:{};s%2?A(Object(c),!0).forEach((function(s){n(o,s,c[s])})):Object.getOwnPropertyDescriptors?Object.defineProperties(o,Object.getOwnPropertyDescriptors(c)):A(Object(c)).forEach((function(n){Object.defineProperty(o,n,Object.getOwnPropertyDescriptor(c,n))}))}return o}var w={small:P.small,medium:P.medium,large:P.large},T={inputContainer:P.inputContainer,numberStepButtons:P.numberStepButtons,prefix:P.prefixContainer,suffix:P.suffixContainer,input:P.input,label:P.label},E=function(A){var E=A.format,M=void 0===E?"hex":E,B=A.className,R=A.label,z=A.labelPlacement,W=void 0===z?"top":z,L=A.popoverPlacement,G=void 0===L?"bottom-start":L,K=A.testId,U=A.disabled,q=A.size,V=void 0===q?"small":q,H=A.onOpen,Z=A.onClose,J=A.value,Q=void 0===J?y:J,X=A.onChange,Y=A.disableOpacityDrag,$=A.enableAlpha,_=void 0!==$&&$,oo=A.elementsClassNames,no=c((function(){try{var o=v(Q);return S(S({},o),{},{a:_?o.a:1})}catch(o){return v(y)}}),[Q,_]),so=c((function(){return oo?Object.entries(oo).reduce((function(c,i){var t=o(i,2),r=t[0],e=t[1];return S(S({},c),{},n({},r,c[r]?s(c[r],e):e))}),S({},T)):T}),[oo]),co=i(!1),io=o(co,2),to=io[0],ro=io[1],eo=t(null),ao=t(null),mo=i(!0),lo=o(mo,2),uo=lo[0],po=lo[1],jo=i(null),Io=o(jo,2),fo=Io[0],ho=Io[1],vo=i(no),bo=o(vo,2),Co=bo[0],yo=bo[1],go=t(null),Oo=c((function(){return"corva-color-picker-".concat(l())}),[]),Po="".concat(Oo,"-opacity-input"),ko="".concat(Oo,"-label"),Do="".concat(Oo,"-opacity-label"),Fo=Boolean(R),No=r((function(){ro(!0),null==H||H()}),[H]),xo=r((function(o){o.preventDefault(),ho(null),No()}),[No]),Ao=r((function(){ho(null),No()}),[No]),So=r((function(o){U||"Enter"!==o.key&&" "!==o.key&&"ArrowDown"!==o.key||(o.preventDefault(),ho("palette"),No())}),[U,No]),wo=r((function(){var o,n,s=!(null===(o=go.current)||void 0===o||!o.contains(document.activeElement));(ho(null),ro(!1),null==Z||Z(),s)&&(null===(n=ao.current)||void 0===n||n.focus({preventScroll:!0}))}),[Z]),To=r((function(o){ho(0===o.detail?"palette":null),po(!0)}),[]),Eo=r((function(o){ho(0===o.detail?"picker":null),po(!1)}),[]),Mo=r((function(){return ho(null)}),[]),Bo=r((function(o){return yo(o.rgb)}),[]),Ro=r((function(o){var n="hex"===M?b(o,_):C(o,_);null==X||X(n)}),[M,X,_]),zo=r((function(o){yo(o),Ro(o)}),[Ro]),Wo=O({color:Co,enableAlpha:_,isActive:!uo,onChange:zo}),Lo=Wo.pickerRef,Go=Wo.onKeyDown;e((function(){var o;if("picker"===fo&&!uo){var n=null===(o=Lo.current)||void 0===o?void 0:o.querySelector('[data-color-picker-control="saturation"]');n&&(n.focus({preventScroll:!0}),Mo())}}),[Mo,fo,uo,Lo]);var Ko=r((function(o){var n=Number(o);if(!(Number.isNaN(n)||n<0||n>100)){var s=S(S({},no),{},{a:n/100});Ro(s)}}),[no,Ro]),Uo=r((function(o){Ro(o.rgb)}),[Ro]),qo=r((function(o){var n=no.a||1,s=_&&0===o.a?0:n;Ro(S(S({},o),{},{a:s}))}),[Ro,no.a,_]),Vo=r((function(){setTimeout((function(){var o,n;ro(!1),null===(o=document.activeElement)||void 0===o||null===(n=o.blur)||void 0===n||n.call(o)}),0)}),[]),Ho=c((function(){return m((function(o){var n=String(Math.round(o));Ko(n)}),100)}),[Ko]);e((function(){yo(no)}),[no]),e((function(){to&&po(!0)}),[to]);var Zo=String(Math.round(100*Co.a)),Jo=(null==G?void 0:G.startsWith("top"))||(null==G?void 0:G.startsWith("bottom")),Qo=(null==G?void 0:G.startsWith("left"))||(null==G?void 0:G.startsWith("right")),Xo=Fo?F(N,{children:[x("label",{id:ko,htmlFor:Po,children:"string"==typeof R?x(u.Label,{children:R}):R}),x("span",{id:Do,hidden:!0,children:"Opacity"})]}):void 0,Yo=c((function(){return Fo?{id:Po,"aria-labelledby":"".concat(ko," ").concat(Do)}:{id:Po,"aria-label":"Opacity"}}),[Fo,Po,ko,Do]);return F(N,{children:[x(u,{label:Xo,labelPlacement:W,disabled:U,size:V,rootTagName:"div",prefix:F(N,{children:[F("div",{className:P.fakeValue,children:[Zo,x("span",{className:P.fakeValuePercent,children:"%"})]}),x("div",{ref:ao,"data-testid":h.IndicatorTestId,className:s(P.indicator,0===Co.a&&P.transparent,so.indicator),style:{"--corvaui-colorpicker-indicatorcolor":b(Co,!1)},onClick:U?void 0:xo,onKeyDown:So,role:"button","aria-label":Fo?void 0:"Color picker","aria-labelledby":Fo?ko:void 0,"aria-expanded":to,"aria-disabled":U,tabIndex:U?-1:0})]}),suffix:!to&&_&&!Y&&!U&&x(g,{value:Number(Zo),onDrag:Ho,onDragEnd:Vo}),className:s(P.root,w[V],!_&&P.noAlpha,B),testId:K,inputContainerRef:eo,value:Zo,onChange:Ko,onFocus:Ao,inputType:"number",inputMode:"numeric",elementsClassNames:so,htmlAttributes:Yo}),F(p,{ref:go,testId:h.PopoverTestId,anchorEl:eo.current,open:to,onClose:wo,placement:G,className:s(P.popover,Jo&&P.marginVertical,Qo&&P.marginHorizontal,0===Co.a&&P.isTransparent,so.popover),children:[uo?x(f,{onChange:qo,value:no,addTransparent:_,autoFocus:"palette"===fo,onAutoFocus:Mo}):x("div",{ref:Lo,className:P.pickerContainer,onKeyDown:Go,children:x(a,{color:Co,onChange:Bo,onChangeComplete:Uo,disableAlpha:!_,className:P.picker})}),F("div",{className:P.switchButtons,children:[x(j,{title:"Palette",children:x(d,{ariaLabel:"Show color palette",size:"medium",type:uo?"secondary":"tertiary",onClick:To,children:x(k,{})})}),x(j,{title:"Pick your own",children:x(d,{ariaLabel:"Show custom color picker",size:"medium",type:uo?"tertiary":"secondary",onClick:Eo,children:x(D,{})})})]})]}),to&&_&&!Y&&x(I,{open:to,anchorEl:eo.current,className:P.dragTrackerPopper,placement:"right",children:x(g,{onDrag:Ho,onDragEnd:Vo})})]})};export{E as ColorPicker};
 //# sourceMappingURL=ColorPicker.js.map

package/componentsV2/ColorPicker/ColorPicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"ColorPicker.js","sources":["../../../src/componentsV2/ColorPicker/ColorPicker.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport {\n  CSSProperties,\n  KeyboardEventHandler,\n  MouseEventHandler,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { ChromePicker, ColorResult } from 'react-color';\nimport { throttle } from 'lodash';\nimport { v4 as uuidv4 } from 'uuid';\n\nimport { TextInputNext, TextInputNextProps } from '../TextInputNext';\nimport { Popover, PopoverProps } from '../Popover';\nimport { ButtonIcon } from '../ButtonIcon';\nimport { Tooltip } from '../Tooltip';\nimport { Popper } from '../Popper';\n\nimport { Swatches } from './Swatches';\nimport { channelsToHex, channelsToRgba, ColorChannels, defaultColor, parseColor } from './utils';\nimport { OpacityDragTracker } from './OpacityDragtracker';\nimport { useChromePickerAccessibility } from './useChromePickerAccessibility';\n\nimport styles from './ColorPicker.scss';\n\nimport { PaletteIcon, PickerIcon } from '~/icons';\n\nexport type ColorPickerProps = {\n  value?: string;\n  onChange?: (value: string) => void;\n\n  size?: TextInputNextProps['size'];\n  label?: TextInputNextProps['label'];\n  labelPlacement?: TextInputNextProps['labelPlacement'];\n  disabled?: boolean;\n  /**\n   * Disables drag to change opacity functinality\n   */\n  disableOpacityDrag?: boolean;\n  /**\n   * Determines base format of the colour `rgb(RRR, GGG, BBB[, AAA])` or `#RRGGBB[AA]`\n   */\n  format?: 'rgb' | 'hex';\n  /**\n   * Allows user to control color's opacity, adds alpha channel to resulting color string\n   */\n  enableAlpha?: boolean;\n\n  popoverPlacement?: PopoverProps['placement'];\n\n  onOpen?: () => void;\n  onClose?: () => void;\n\n  /**\n   * An escape hatch to tweak styling of internal elements\n   */\n  elementsClassNames?: Partial<\n    Omit<\n      Required<TextInputNextProps>['elementsClassNames'],\n      'message' | 'numberStepButtons' | 'prefix' | 'suffix'\n    > &\n      Record<'indicator' | 'popover', string>\n  >;\n\n  className?: string;\n  testId?: string;\n};\n\nconst SizeToClassMap: Record<Required<ColorPickerProps>['size'], string> = {\n  small: styles.small,\n  medium: styles.medium,\n  large: styles.large,\n};\n\nconst ownInputElementsClassNames: TextInputNextProps['elementsClassNames'] = {\n  inputContainer: styles.inputContainer,\n  numberStepButtons: styles.numberStepButtons,\n  prefix: styles.prefixContainer,\n  suffix: styles.suffixContainer,\n  input: styles.input,\n  label: styles.label,\n};\n\ntype FocusTarget = 'palette' | 'picker';\n\nexport const ColorPicker = ({\n  format = 'hex',\n  className,\n  label,\n  labelPlacement = 'top',\n  popoverPlacement = 'bottom-start',\n  testId,\n  disabled,\n  size = 'small',\n  onOpen,\n  onClose,\n  value = defaultColor,\n  onChange,\n  disableOpacityDrag,\n  enableAlpha = false,\n  elementsClassNames,\n}: ColorPickerProps) => {\n  const valueChannels = useMemo(() => {\n    try {\n      const channels = parseColor(value);\n\n      return { ...channels, a: enableAlpha ? channels.a : 1 };\n    } catch (_) {\n      return parseColor(defaultColor);\n    }\n  }, [value, enableAlpha]);\n\n  const realElementsClassNames = useMemo((): Required<ColorPickerProps>['elementsClassNames'] => {\n    return elementsClassNames\n      ? Object.entries(elementsClassNames).reduce<Required<ColorPickerProps>['elementsClassNames']>(\n          (acc, pair) => {\n            const [key, value] = pair as [\n              keyof Required<ColorPickerProps>['elementsClassNames'],\n              string\n            ];\n            return {\n              ...acc,\n              [key]: acc[key] ? classNames(acc[key], value) : value,\n            };\n          },\n          {\n            ...ownInputElementsClassNames,\n          }\n        )\n      : ownInputElementsClassNames;\n  }, [elementsClassNames]);\n\n  const [isMenuOpen, setIsOpen] = useState(false);\n  const inputContainerRef = useRef<HTMLDivElement>(null);\n  const indicatorRef = useRef<HTMLDivElement>(null);\n  const [isSwatches, setIsSwatches] = useState(true);\n  const [focusTarget, setFocusTarget] = useState<FocusTarget | null>(null);\n  const [internalValue, setInternalValue] = useState<ColorChannels>(valueChannels);\n  const popoverRef = useRef<HTMLDivElement>(null);\n  const accessibilityId = useMemo(() => `corva-color-picker-${uuidv4()}`, []);\n  const inputId = `${accessibilityId}-opacity-input`;\n  const labelId = `${accessibilityId}-label`;\n  const opacityLabelId = `${accessibilityId}-opacity-label`;\n  const hasLabel = Boolean(label);\n\n  const openMenu = useCallback(() => {\n    setIsOpen(true);\n    onOpen?.();\n  }, [onOpen]);\n\n  const openMenuSwatch = useCallback<MouseEventHandler>(\n    e => {\n      e.preventDefault();\n      setFocusTarget(null);\n      openMenu();\n    },\n    [openMenu]\n  );\n\n  const openMenuFocus = useCallback(() => {\n    setFocusTarget(null);\n    openMenu();\n  }, [openMenu]);\n\n  const openMenuKeyDown = useCallback<KeyboardEventHandler<HTMLDivElement>>(\n    event => {\n      if (!disabled && (event.key === 'Enter' || event.key === ' ' || event.key === 'ArrowDown')) {\n        event.preventDefault();\n        setFocusTarget('palette');\n        openMenu();\n      }\n    },\n    [disabled, openMenu]\n  );\n\n  const closeMenu = useCallback(() => {\n    const isFocusInPopover = !!popoverRef.current?.contains(document.activeElement);\n\n    setFocusTarget(null);\n    setIsOpen(false);\n    onClose?.();\n\n    // Return focus to the trigger so keyboard flow is not lost after Escape/outside dismiss\n    if (isFocusInPopover) {\n      indicatorRef.current?.focus({ preventScroll: true });\n    }\n  }, [onClose]);\n\n  const setSwatches = useCallback<MouseEventHandler<HTMLButtonElement>>(event => {\n    setFocusTarget(event.detail === 0 ? 'palette' : null);\n    setIsSwatches(true);\n  }, []);\n\n  const setPicker = useCallback<MouseEventHandler<HTMLButtonElement>>(event => {\n    setFocusTarget(event.detail === 0 ? 'picker' : null);\n    setIsSwatches(false);\n  }, []);\n\n  const clearFocusTarget = useCallback(() => setFocusTarget(null), []);\n\n  const onInternalValueChange = useCallback(\n    (color: ColorResult) => setInternalValue(color.rgb),\n    []\n  );\n\n  const onActualChange = useCallback(\n    (color: ColorChannels) => {\n      const formatted =\n        format === 'hex' ? channelsToHex(color, enableAlpha) : channelsToRgba(color, enableAlpha);\n      onChange?.(formatted);\n    },\n    [format, onChange, enableAlpha]\n  );\n\n  const onKeyboardPickerChange = useCallback(\n    (color: ColorChannels) => {\n      setInternalValue(color);\n      onActualChange(color);\n    },\n    [onActualChange]\n  );\n\n  const { pickerRef, onKeyDown: onPickerKeyDown } = useChromePickerAccessibility({\n    color: internalValue,\n    enableAlpha,\n    isActive: !isSwatches,\n    onChange: onKeyboardPickerChange,\n  });\n\n  useEffect(() => {\n    if (focusTarget !== 'picker' || isSwatches) {\n      return;\n    }\n\n    const firstControl = pickerRef.current?.querySelector<HTMLElement>(\n      '[data-color-picker-control=\"saturation\"]'\n    );\n\n    if (firstControl) {\n      firstControl.focus({ preventScroll: true });\n      clearFocusTarget();\n    }\n  }, [clearFocusTarget, focusTarget, isSwatches, pickerRef]);\n\n  const onOpacityInputChange = useCallback(\n    (opacityString: string) => {\n      const opacityNumber = Number(opacityString);\n\n      if (Number.isNaN(opacityNumber) || opacityNumber < 0 || opacityNumber > 100) {\n        return;\n      }\n\n      const color = { ...valueChannels, a: opacityNumber / 100 };\n      onActualChange(color);\n    },\n    [valueChannels, onActualChange]\n  );\n\n  const pickerOnChange = useCallback(\n    (color: ColorResult) => {\n      onActualChange(color.rgb);\n    },\n    [onActualChange]\n  );\n\n  const swatchOnChange = useCallback(\n    (color: ColorChannels) => {\n      const nonZeroAlpha = valueChannels.a || 1;\n      const alpha = enableAlpha && color.a === 0 ? 0 : nonZeroAlpha;\n      onActualChange({ ...color, a: alpha });\n    },\n    [onActualChange, valueChannels.a, enableAlpha]\n  );\n\n  // Prevents focus on opacity drag end\n  const onOpacityDragEnd = useCallback(() => {\n    setTimeout(() => {\n      setIsOpen(false);\n      (document.activeElement as HTMLElement | null)?.blur?.();\n    }, 0);\n  }, []);\n\n  const onOpacityDrag = useMemo(\n    () =>\n      throttle((percent: number) => {\n        const newFieldValue = String(Math.round(percent));\n        onOpacityInputChange(newFieldValue);\n      }, 100),\n    [onOpacityInputChange]\n  );\n\n  useEffect(() => {\n    setInternalValue(valueChannels);\n  }, [valueChannels]);\n\n  useEffect(() => {\n    if (isMenuOpen) {\n      setIsSwatches(true);\n    }\n  }, [isMenuOpen]);\n\n  const inputValue = String(Math.round(internalValue.a * 100));\n\n  const hasVerticalMargin =\n    popoverPlacement?.startsWith('top') || popoverPlacement?.startsWith('bottom');\n  const hasHorizontalMargin =\n    popoverPlacement?.startsWith('left') || popoverPlacement?.startsWith('right');\n  const accessibleLabel = hasLabel ? (\n    <>\n      <label id={labelId} htmlFor={inputId}>\n        {typeof label === 'string' ? <TextInputNext.Label>{label}</TextInputNext.Label> : label}\n      </label>\n      <span id={opacityLabelId} hidden>\n        Opacity\n      </span>\n    </>\n  ) : undefined;\n  const inputHtmlAttributes: TextInputNextProps['htmlAttributes'] = useMemo(\n    () =>\n      hasLabel\n        ? {\n            id: inputId,\n            'aria-labelledby': `${labelId} ${opacityLabelId}`,\n          }\n        : {\n            id: inputId,\n            'aria-label': 'Opacity',\n          },\n    [hasLabel, inputId, labelId, opacityLabelId]\n  );\n\n  return (\n    <>\n      <TextInputNext\n        label={accessibleLabel}\n        labelPlacement={labelPlacement}\n        disabled={disabled}\n        size={size}\n        rootTagName=\"div\"\n        prefix={\n          <>\n            <div className={styles.fakeValue}>\n              {inputValue}\n              <span className={styles.fakeValuePercent}>%</span>\n            </div>\n\n            <div\n              ref={indicatorRef}\n              className={classNames(\n                styles.indicator,\n                internalValue.a === 0 && styles.transparent,\n                realElementsClassNames.indicator\n              )}\n              style={\n                {\n                  '--corvaui-colorpicker-indicatorcolor': channelsToHex(internalValue, false),\n                } as CSSProperties\n              }\n              onClick={disabled ? undefined : openMenuSwatch}\n              onKeyDown={openMenuKeyDown}\n              role=\"button\"\n              aria-label={hasLabel ? undefined : 'Color picker'}\n              aria-labelledby={hasLabel ? labelId : undefined}\n              aria-expanded={isMenuOpen}\n              aria-disabled={disabled}\n              tabIndex={disabled ? -1 : 0}\n            />\n          </>\n        }\n        suffix={\n          !isMenuOpen &&\n          enableAlpha &&\n          !disableOpacityDrag &&\n          !disabled && (\n            <OpacityDragTracker\n              value={Number(inputValue)}\n              onDrag={onOpacityDrag}\n              onDragEnd={onOpacityDragEnd}\n            />\n          )\n        }\n        className={classNames(\n          styles.root,\n          SizeToClassMap[size],\n          !enableAlpha && styles.noAlpha,\n          className\n        )}\n        testId={testId}\n        inputContainerRef={inputContainerRef}\n        value={inputValue}\n        onChange={onOpacityInputChange}\n        onFocus={openMenuFocus}\n        inputType=\"number\"\n        inputMode=\"numeric\"\n        elementsClassNames={realElementsClassNames}\n        htmlAttributes={inputHtmlAttributes}\n      />\n\n      {/* Popover backdrop is needed for ColorPicker to work better in popovers: click outside will close the ColorPicker but not the popover */}\n      <Popover\n        ref={popoverRef}\n        anchorEl={inputContainerRef.current}\n        open={isMenuOpen}\n        onClose={closeMenu}\n        placement={popoverPlacement}\n        className={classNames(\n          styles.popover,\n          hasVerticalMargin && styles.marginVertical,\n          hasHorizontalMargin && styles.marginHorizontal,\n          internalValue.a === 0 && styles.isTransparent,\n          realElementsClassNames.popover\n        )}\n      >\n        {isSwatches ? (\n          <Swatches\n            onChange={swatchOnChange}\n            value={valueChannels}\n            addTransparent={enableAlpha}\n            autoFocus={focusTarget === 'palette'}\n            onAutoFocus={clearFocusTarget}\n          />\n        ) : (\n          <div ref={pickerRef} className={styles.pickerContainer} onKeyDown={onPickerKeyDown}>\n            <ChromePicker\n              color={internalValue}\n              onChange={onInternalValueChange}\n              onChangeComplete={pickerOnChange}\n              disableAlpha={!enableAlpha}\n              className={styles.picker}\n            />\n          </div>\n        )}\n        <div className={styles.switchButtons}>\n          <Tooltip title=\"Palette\">\n            <ButtonIcon\n              ariaLabel=\"Show color palette\"\n              size=\"medium\"\n              type={isSwatches ? 'secondary' : 'tertiary'}\n              onClick={setSwatches}\n            >\n              <PaletteIcon />\n            </ButtonIcon>\n          </Tooltip>\n          <Tooltip title=\"Pick your own\">\n            <ButtonIcon\n              ariaLabel=\"Show custom color picker\"\n              size=\"medium\"\n              type={!isSwatches ? 'secondary' : 'tertiary'}\n              onClick={setPicker}\n            >\n              <PickerIcon />\n            </ButtonIcon>\n          </Tooltip>\n        </div>\n      </Popover>\n\n      {/* Opacity Drag Tracker should work even with popover open with a backdrop */}\n      {isMenuOpen && enableAlpha && !disableOpacityDrag && (\n        <Popper\n          open={isMenuOpen}\n          anchorEl={inputContainerRef.current}\n          className={styles.dragTrackerPopper}\n          placement=\"right\"\n        >\n          <OpacityDragTracker onDrag={onOpacityDrag} onDragEnd={onOpacityDragEnd} />\n        </Popper>\n      )}\n    </>\n  );\n};\n"],"names":["SizeToClassMap","small","styles","medium","large","ownInputElementsClassNames","inputContainer","numberStepButtons","prefix","prefixContainer","suffix","suffixContainer","input","label","ColorPicker","_ref","_ref$format","format","className","_ref$labelPlacement","labelPlacement","_ref$popoverPlacement","popoverPlacement","testId","disabled","_ref$size","size","onOpen","onClose","_ref$value","value","defaultColor","onChange","disableOpacityDrag","_ref$enableAlpha","enableAlpha","elementsClassNames","valueChannels","useMemo","channels","parseColor","_objectSpread","a","_","realElementsClassNames","Object","entries","reduce","acc","pair","_ref3","_slicedToArray","key","classNames","useState","_useState2","_useState","isMenuOpen","setIsOpen","inputContainerRef","useRef","indicatorRef","_useState4","_useState3","isSwatches","setIsSwatches","_useState6","_useState5","focusTarget","setFocusTarget","_useState8","_useState7","internalValue","setInternalValue","popoverRef","accessibilityId","concat","uuidv4","inputId","labelId","opacityLabelId","hasLabel","Boolean","openMenu","useCallback","openMenuSwatch","e","preventDefault","openMenuFocus","openMenuKeyDown","event","closeMenu","_popoverRef$current","_indicatorRef$current","isFocusInPopover","current","contains","document","activeElement","focus","preventScroll","setSwatches","detail","setPicker","clearFocusTarget","onInternalValueChange","color","rgb","onActualChange","formatted","channelsToHex","channelsToRgba","onKeyboardPickerChange","_useChromePickerAcces","useChromePickerAccessibility","isActive","pickerRef","onPickerKeyDown","onKeyDown","useEffect","_pickerRef$current","firstControl","querySelector","onOpacityInputChange","opacityString","opacityNumber","Number","isNaN","pickerOnChange","swatchOnChange","nonZeroAlpha","alpha","onOpacityDragEnd","setTimeout","_document$activeEleme","_document$activeEleme2","blur","call","onOpacityDrag","throttle","percent","newFieldValue","String","Math","round","inputValue","hasVerticalMargin","startsWith","hasHorizontalMargin","accessibleLabel","_jsxs","_Fragment","children","_jsx","id","htmlFor","TextInputNext","Label","hidden","undefined","inputHtmlAttributes","rootTagName","fakeValue","fakeValuePercent","ref","indicator","transparent","style","onClick","role","tabIndex","OpacityDragTracker","onDrag","onDragEnd","root","noAlpha","onFocus","inputType","inputMode","htmlAttributes","Popover","anchorEl","open","placement","popover","marginVertical","marginHorizontal","isTransparent","Swatches","addTransparent","autoFocus","onAutoFocus","pickerContainer","ChromePicker","onChangeComplete","disableAlpha","picker","switchButtons","Tooltip","title","ButtonIcon","ariaLabel","type","PaletteIcon","PickerIcon","Popper","dragTrackerPopper"],"mappings":"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"}
+{"version":3,"file":"ColorPicker.js","sources":["../../../src/componentsV2/ColorPicker/ColorPicker.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport {\n  CSSProperties,\n  KeyboardEventHandler,\n  MouseEventHandler,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { ChromePicker, ColorResult } from 'react-color';\nimport { throttle } from 'lodash';\nimport { v4 as uuidv4 } from 'uuid';\n\nimport { TextInputNext, TextInputNextProps } from '../TextInputNext';\nimport { Popover, PopoverProps } from '../Popover';\nimport { ButtonIcon } from '../ButtonIcon';\nimport { Tooltip } from '../Tooltip';\nimport { Popper } from '../Popper';\n\nimport { Swatches } from './Swatches';\nimport { ColorPickerTestIds } from './ColorPicker.constants';\nimport { channelsToHex, channelsToRgba, ColorChannels, defaultColor, parseColor } from './utils';\nimport { OpacityDragTracker } from './OpacityDragtracker';\nimport { useChromePickerAccessibility } from './useChromePickerAccessibility';\n\nimport styles from './ColorPicker.scss';\n\nimport { PaletteIcon, PickerIcon } from '~/icons';\n\nexport type ColorPickerProps = {\n  value?: string;\n  onChange?: (value: string) => void;\n\n  size?: TextInputNextProps['size'];\n  label?: TextInputNextProps['label'];\n  labelPlacement?: TextInputNextProps['labelPlacement'];\n  disabled?: boolean;\n  /**\n   * Disables drag to change opacity functinality\n   */\n  disableOpacityDrag?: boolean;\n  /**\n   * Determines base format of the colour `rgb(RRR, GGG, BBB[, AAA])` or `#RRGGBB[AA]`\n   */\n  format?: 'rgb' | 'hex';\n  /**\n   * Allows user to control color's opacity, adds alpha channel to resulting color string\n   */\n  enableAlpha?: boolean;\n\n  popoverPlacement?: PopoverProps['placement'];\n\n  onOpen?: () => void;\n  onClose?: () => void;\n\n  /**\n   * An escape hatch to tweak styling of internal elements\n   */\n  elementsClassNames?: Partial<\n    Omit<\n      Required<TextInputNextProps>['elementsClassNames'],\n      'message' | 'numberStepButtons' | 'prefix' | 'suffix'\n    > &\n      Record<'indicator' | 'popover', string>\n  >;\n\n  className?: string;\n  testId?: string;\n};\n\nconst SizeToClassMap: Record<Required<ColorPickerProps>['size'], string> = {\n  small: styles.small,\n  medium: styles.medium,\n  large: styles.large,\n};\n\nconst ownInputElementsClassNames: TextInputNextProps['elementsClassNames'] = {\n  inputContainer: styles.inputContainer,\n  numberStepButtons: styles.numberStepButtons,\n  prefix: styles.prefixContainer,\n  suffix: styles.suffixContainer,\n  input: styles.input,\n  label: styles.label,\n};\n\ntype FocusTarget = 'palette' | 'picker';\n\nexport const ColorPicker = ({\n  format = 'hex',\n  className,\n  label,\n  labelPlacement = 'top',\n  popoverPlacement = 'bottom-start',\n  testId,\n  disabled,\n  size = 'small',\n  onOpen,\n  onClose,\n  value = defaultColor,\n  onChange,\n  disableOpacityDrag,\n  enableAlpha = false,\n  elementsClassNames,\n}: ColorPickerProps) => {\n  const valueChannels = useMemo(() => {\n    try {\n      const channels = parseColor(value);\n\n      return { ...channels, a: enableAlpha ? channels.a : 1 };\n    } catch (_) {\n      return parseColor(defaultColor);\n    }\n  }, [value, enableAlpha]);\n\n  const realElementsClassNames = useMemo((): Required<ColorPickerProps>['elementsClassNames'] => {\n    return elementsClassNames\n      ? Object.entries(elementsClassNames).reduce<Required<ColorPickerProps>['elementsClassNames']>(\n          (acc, pair) => {\n            const [key, value] = pair as [\n              keyof Required<ColorPickerProps>['elementsClassNames'],\n              string\n            ];\n            return {\n              ...acc,\n              [key]: acc[key] ? classNames(acc[key], value) : value,\n            };\n          },\n          {\n            ...ownInputElementsClassNames,\n          }\n        )\n      : ownInputElementsClassNames;\n  }, [elementsClassNames]);\n\n  const [isMenuOpen, setIsOpen] = useState(false);\n  const inputContainerRef = useRef<HTMLDivElement>(null);\n  const indicatorRef = useRef<HTMLDivElement>(null);\n  const [isSwatches, setIsSwatches] = useState(true);\n  const [focusTarget, setFocusTarget] = useState<FocusTarget | null>(null);\n  const [internalValue, setInternalValue] = useState<ColorChannels>(valueChannels);\n  const popoverRef = useRef<HTMLDivElement>(null);\n  const accessibilityId = useMemo(() => `corva-color-picker-${uuidv4()}`, []);\n  const inputId = `${accessibilityId}-opacity-input`;\n  const labelId = `${accessibilityId}-label`;\n  const opacityLabelId = `${accessibilityId}-opacity-label`;\n  const hasLabel = Boolean(label);\n\n  const openMenu = useCallback(() => {\n    setIsOpen(true);\n    onOpen?.();\n  }, [onOpen]);\n\n  const openMenuSwatch = useCallback<MouseEventHandler>(\n    e => {\n      e.preventDefault();\n      setFocusTarget(null);\n      openMenu();\n    },\n    [openMenu]\n  );\n\n  const openMenuFocus = useCallback(() => {\n    setFocusTarget(null);\n    openMenu();\n  }, [openMenu]);\n\n  const openMenuKeyDown = useCallback<KeyboardEventHandler<HTMLDivElement>>(\n    event => {\n      if (!disabled && (event.key === 'Enter' || event.key === ' ' || event.key === 'ArrowDown')) {\n        event.preventDefault();\n        setFocusTarget('palette');\n        openMenu();\n      }\n    },\n    [disabled, openMenu]\n  );\n\n  const closeMenu = useCallback(() => {\n    const isFocusInPopover = !!popoverRef.current?.contains(document.activeElement);\n\n    setFocusTarget(null);\n    setIsOpen(false);\n    onClose?.();\n\n    // Return focus to the trigger so keyboard flow is not lost after Escape/outside dismiss\n    if (isFocusInPopover) {\n      indicatorRef.current?.focus({ preventScroll: true });\n    }\n  }, [onClose]);\n\n  const setSwatches = useCallback<MouseEventHandler<HTMLButtonElement>>(event => {\n    setFocusTarget(event.detail === 0 ? 'palette' : null);\n    setIsSwatches(true);\n  }, []);\n\n  const setPicker = useCallback<MouseEventHandler<HTMLButtonElement>>(event => {\n    setFocusTarget(event.detail === 0 ? 'picker' : null);\n    setIsSwatches(false);\n  }, []);\n\n  const clearFocusTarget = useCallback(() => setFocusTarget(null), []);\n\n  const onInternalValueChange = useCallback(\n    (color: ColorResult) => setInternalValue(color.rgb),\n    []\n  );\n\n  const onActualChange = useCallback(\n    (color: ColorChannels) => {\n      const formatted =\n        format === 'hex' ? channelsToHex(color, enableAlpha) : channelsToRgba(color, enableAlpha);\n      onChange?.(formatted);\n    },\n    [format, onChange, enableAlpha]\n  );\n\n  const onKeyboardPickerChange = useCallback(\n    (color: ColorChannels) => {\n      setInternalValue(color);\n      onActualChange(color);\n    },\n    [onActualChange]\n  );\n\n  const { pickerRef, onKeyDown: onPickerKeyDown } = useChromePickerAccessibility({\n    color: internalValue,\n    enableAlpha,\n    isActive: !isSwatches,\n    onChange: onKeyboardPickerChange,\n  });\n\n  useEffect(() => {\n    if (focusTarget !== 'picker' || isSwatches) {\n      return;\n    }\n\n    const firstControl = pickerRef.current?.querySelector<HTMLElement>(\n      '[data-color-picker-control=\"saturation\"]'\n    );\n\n    if (firstControl) {\n      firstControl.focus({ preventScroll: true });\n      clearFocusTarget();\n    }\n  }, [clearFocusTarget, focusTarget, isSwatches, pickerRef]);\n\n  const onOpacityInputChange = useCallback(\n    (opacityString: string) => {\n      const opacityNumber = Number(opacityString);\n\n      if (Number.isNaN(opacityNumber) || opacityNumber < 0 || opacityNumber > 100) {\n        return;\n      }\n\n      const color = { ...valueChannels, a: opacityNumber / 100 };\n      onActualChange(color);\n    },\n    [valueChannels, onActualChange]\n  );\n\n  const pickerOnChange = useCallback(\n    (color: ColorResult) => {\n      onActualChange(color.rgb);\n    },\n    [onActualChange]\n  );\n\n  const swatchOnChange = useCallback(\n    (color: ColorChannels) => {\n      const nonZeroAlpha = valueChannels.a || 1;\n      const alpha = enableAlpha && color.a === 0 ? 0 : nonZeroAlpha;\n      onActualChange({ ...color, a: alpha });\n    },\n    [onActualChange, valueChannels.a, enableAlpha]\n  );\n\n  // Prevents focus on opacity drag end\n  const onOpacityDragEnd = useCallback(() => {\n    setTimeout(() => {\n      setIsOpen(false);\n      (document.activeElement as HTMLElement | null)?.blur?.();\n    }, 0);\n  }, []);\n\n  const onOpacityDrag = useMemo(\n    () =>\n      throttle((percent: number) => {\n        const newFieldValue = String(Math.round(percent));\n        onOpacityInputChange(newFieldValue);\n      }, 100),\n    [onOpacityInputChange]\n  );\n\n  useEffect(() => {\n    setInternalValue(valueChannels);\n  }, [valueChannels]);\n\n  useEffect(() => {\n    if (isMenuOpen) {\n      setIsSwatches(true);\n    }\n  }, [isMenuOpen]);\n\n  const inputValue = String(Math.round(internalValue.a * 100));\n\n  const hasVerticalMargin =\n    popoverPlacement?.startsWith('top') || popoverPlacement?.startsWith('bottom');\n  const hasHorizontalMargin =\n    popoverPlacement?.startsWith('left') || popoverPlacement?.startsWith('right');\n  const accessibleLabel = hasLabel ? (\n    <>\n      <label id={labelId} htmlFor={inputId}>\n        {typeof label === 'string' ? <TextInputNext.Label>{label}</TextInputNext.Label> : label}\n      </label>\n      <span id={opacityLabelId} hidden>\n        Opacity\n      </span>\n    </>\n  ) : undefined;\n  const inputHtmlAttributes: TextInputNextProps['htmlAttributes'] = useMemo(\n    () =>\n      hasLabel\n        ? {\n            id: inputId,\n            'aria-labelledby': `${labelId} ${opacityLabelId}`,\n          }\n        : {\n            id: inputId,\n            'aria-label': 'Opacity',\n          },\n    [hasLabel, inputId, labelId, opacityLabelId]\n  );\n\n  return (\n    <>\n      <TextInputNext\n        label={accessibleLabel}\n        labelPlacement={labelPlacement}\n        disabled={disabled}\n        size={size}\n        rootTagName=\"div\"\n        prefix={\n          <>\n            <div className={styles.fakeValue}>\n              {inputValue}\n              <span className={styles.fakeValuePercent}>%</span>\n            </div>\n\n            <div\n              ref={indicatorRef}\n              data-testid={ColorPickerTestIds.IndicatorTestId}\n              className={classNames(\n                styles.indicator,\n                internalValue.a === 0 && styles.transparent,\n                realElementsClassNames.indicator\n              )}\n              style={\n                {\n                  '--corvaui-colorpicker-indicatorcolor': channelsToHex(internalValue, false),\n                } as CSSProperties\n              }\n              onClick={disabled ? undefined : openMenuSwatch}\n              onKeyDown={openMenuKeyDown}\n              role=\"button\"\n              aria-label={hasLabel ? undefined : 'Color picker'}\n              aria-labelledby={hasLabel ? labelId : undefined}\n              aria-expanded={isMenuOpen}\n              aria-disabled={disabled}\n              tabIndex={disabled ? -1 : 0}\n            />\n          </>\n        }\n        suffix={\n          !isMenuOpen &&\n          enableAlpha &&\n          !disableOpacityDrag &&\n          !disabled && (\n            <OpacityDragTracker\n              value={Number(inputValue)}\n              onDrag={onOpacityDrag}\n              onDragEnd={onOpacityDragEnd}\n            />\n          )\n        }\n        className={classNames(\n          styles.root,\n          SizeToClassMap[size],\n          !enableAlpha && styles.noAlpha,\n          className\n        )}\n        testId={testId}\n        inputContainerRef={inputContainerRef}\n        value={inputValue}\n        onChange={onOpacityInputChange}\n        onFocus={openMenuFocus}\n        inputType=\"number\"\n        inputMode=\"numeric\"\n        elementsClassNames={realElementsClassNames}\n        htmlAttributes={inputHtmlAttributes}\n      />\n\n      {/* Popover backdrop is needed for ColorPicker to work better in popovers: click outside will close the ColorPicker but not the popover */}\n      <Popover\n        ref={popoverRef}\n        testId={ColorPickerTestIds.PopoverTestId}\n        anchorEl={inputContainerRef.current}\n        open={isMenuOpen}\n        onClose={closeMenu}\n        placement={popoverPlacement}\n        className={classNames(\n          styles.popover,\n          hasVerticalMargin && styles.marginVertical,\n          hasHorizontalMargin && styles.marginHorizontal,\n          internalValue.a === 0 && styles.isTransparent,\n          realElementsClassNames.popover\n        )}\n      >\n        {isSwatches ? (\n          <Swatches\n            onChange={swatchOnChange}\n            value={valueChannels}\n            addTransparent={enableAlpha}\n            autoFocus={focusTarget === 'palette'}\n            onAutoFocus={clearFocusTarget}\n          />\n        ) : (\n          <div ref={pickerRef} className={styles.pickerContainer} onKeyDown={onPickerKeyDown}>\n            <ChromePicker\n              color={internalValue}\n              onChange={onInternalValueChange}\n              onChangeComplete={pickerOnChange}\n              disableAlpha={!enableAlpha}\n              className={styles.picker}\n            />\n          </div>\n        )}\n        <div className={styles.switchButtons}>\n          <Tooltip title=\"Palette\">\n            <ButtonIcon\n              ariaLabel=\"Show color palette\"\n              size=\"medium\"\n              type={isSwatches ? 'secondary' : 'tertiary'}\n              onClick={setSwatches}\n            >\n              <PaletteIcon />\n            </ButtonIcon>\n          </Tooltip>\n          <Tooltip title=\"Pick your own\">\n            <ButtonIcon\n              ariaLabel=\"Show custom color picker\"\n              size=\"medium\"\n              type={!isSwatches ? 'secondary' : 'tertiary'}\n              onClick={setPicker}\n            >\n              <PickerIcon />\n            </ButtonIcon>\n          </Tooltip>\n        </div>\n      </Popover>\n\n      {/* Opacity Drag Tracker should work even with popover open with a backdrop */}\n      {isMenuOpen && enableAlpha && !disableOpacityDrag && (\n        <Popper\n          open={isMenuOpen}\n          anchorEl={inputContainerRef.current}\n          className={styles.dragTrackerPopper}\n          placement=\"right\"\n        >\n          <OpacityDragTracker onDrag={onOpacityDrag} onDragEnd={onOpacityDragEnd} />\n        </Popper>\n      )}\n    </>\n  );\n};\n"],"names":["SizeToClassMap","small","styles","medium","large","ownInputElementsClassNames","inputContainer","numberStepButtons","prefix","prefixContainer","suffix","suffixContainer","input","label","ColorPicker","_ref","_ref$format","format","className","_ref$labelPlacement","labelPlacement","_ref$popoverPlacement","popoverPlacement","testId","disabled","_ref$size","size","onOpen","onClose","_ref$value","value","defaultColor","onChange","disableOpacityDrag","_ref$enableAlpha","enableAlpha","elementsClassNames","valueChannels","useMemo","channels","parseColor","_objectSpread","a","_","realElementsClassNames","Object","entries","reduce","acc","pair","_ref3","_slicedToArray","key","classNames","useState","_useState2","_useState","isMenuOpen","setIsOpen","inputContainerRef","useRef","indicatorRef","_useState4","_useState3","isSwatches","setIsSwatches","_useState6","_useState5","focusTarget","setFocusTarget","_useState8","_useState7","internalValue","setInternalValue","popoverRef","accessibilityId","concat","uuidv4","inputId","labelId","opacityLabelId","hasLabel","Boolean","openMenu","useCallback","openMenuSwatch","e","preventDefault","openMenuFocus","openMenuKeyDown","event","closeMenu","_popoverRef$current","_indicatorRef$current","isFocusInPopover","current","contains","document","activeElement","focus","preventScroll","setSwatches","detail","setPicker","clearFocusTarget","onInternalValueChange","color","rgb","onActualChange","formatted","channelsToHex","channelsToRgba","onKeyboardPickerChange","_useChromePickerAcces","useChromePickerAccessibility","isActive","pickerRef","onPickerKeyDown","onKeyDown","useEffect","_pickerRef$current","firstControl","querySelector","onOpacityInputChange","opacityString","opacityNumber","Number","isNaN","pickerOnChange","swatchOnChange","nonZeroAlpha","alpha","onOpacityDragEnd","setTimeout","_document$activeEleme","_document$activeEleme2","blur","call","onOpacityDrag","throttle","percent","newFieldValue","String","Math","round","inputValue","hasVerticalMargin","startsWith","hasHorizontalMargin","accessibleLabel","_jsxs","_Fragment","children","_jsx","id","htmlFor","TextInputNext","Label","hidden","undefined","inputHtmlAttributes","rootTagName","fakeValue","fakeValuePercent","ref","ColorPickerTestIds","IndicatorTestId","indicator","transparent","style","onClick","role","tabIndex","OpacityDragTracker","onDrag","onDragEnd","root","noAlpha","onFocus","inputType","inputMode","htmlAttributes","Popover","PopoverTestId","anchorEl","open","placement","popover","marginVertical","marginHorizontal","isTransparent","Swatches","addTransparent","autoFocus","onAutoFocus","pickerContainer","ChromePicker","onChangeComplete","disableAlpha","picker","switchButtons","Tooltip","title","ButtonIcon","ariaLabel","type","PaletteIcon","PickerIcon","Popper","dragTrackerPopper"],"mappings":"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"}

package/componentsV2/ColorPicker/Swatches/Swatches.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Swatches.d.ts","sourceRoot":"","sources":["../../../../src/componentsV2/ColorPicker/Swatches/Swatches.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,aAAa,EAA4B,MAAM,UAAU,CAAC;AAQnE,MAAM,MAAM,aAAa,GAAG;IAC1B;;OAEG;IACH,KAAK,EAAE,aAAa,CAAC;IACrB,QAAQ,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;IACzC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;CAC1B,CAAC;AAIF,eAAO,MAAM,QAAQ,iEAMlB,aAAa,4CAqHf,CAAC"}
+{"version":3,"file":"Swatches.d.ts","sourceRoot":"","sources":["../../../../src/componentsV2/ColorPicker/Swatches/Swatches.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,aAAa,EAA4B,MAAM,UAAU,CAAC;AAUnE,MAAM,MAAM,aAAa,GAAG;IAC1B;;OAEG;IACH,KAAK,EAAE,aAAa,CAAC;IACrB,QAAQ,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;IACzC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;CAC1B,CAAC;AAIF,eAAO,MAAM,QAAQ,iEAMlB,aAAa,4CA4Hf,CAAC"}

package/componentsV2/ColorPicker/Swatches/Swatches.js

@@ -1,2 +1,2 @@
-import o from"@babel/runtime/helpers/objectWithoutProperties";import s from"@babel/runtime/helpers/defineProperty";import c from"classnames";import{isEqual as n}from"lodash";import{useRef as i,useEffect as t}from"react";import{parseColor as r,getLuminance as e}from"../utils.js";import{paletteColors as m}from"./constants.js";import p from"./Swatches.scss.js";import{CheckSmallIcon as u}from"../../../icons/iconParkIcons.js";import"../../../icons/customIcons/icons/AddMessage.js";import"../../../icons/customIcons/icons/DragOne.js";import"../../../icons/customIcons/icons/Attention.js";import"../../../icons/customIcons/icons/Collapse.js";import"../../../icons/customIcons/icons/Dashboard.js";import"../../../icons/customIcons/icons/Expand.js";import"../../../icons/customIcons/icons/FolderClosed.js";import"../../../icons/customIcons/icons/FolderClosedFilled.js";import"../../../icons/customIcons/icons/FolderOpened.js";import"../../../icons/customIcons/icons/GreaterOrEqual.js";import"../../../icons/customIcons/icons/LessOrEqual.js";import"../../../icons/customIcons/icons/Search.js";import"../../../icons/customIcons/icons/SearchOne.js";import"../../../icons/customIcons/icons/Wellhub.js";import"../../../icons/customIcons/icons/MultiRuler.js";import"../../../icons/customIcons/icons/Checkbox.js";import"../../../icons/customIcons/icons/CheckboxChecked.js";import"../../../icons/customIcons/icons/CheckboxIndeterminate.js";import"../../../icons/customIcons/icons/Radio.js";import"../../../icons/customIcons/icons/RadioChecked.js";import"../../../icons/customIcons/icons/SimulFrac.js";import"../../../icons/customIcons/icons/ZipperFrac.js";import"../../../icons/customIcons/icons/CautionFilled.js";import"../../../icons/customIcons/icons/InfoRounded.js";import"../../../icons/customIcons/icons/FlameFilled.js";import"../../../icons/customIcons/icons/MoreApp.js";import"../../../icons/customIcons/icons/Pad.js";import"../../../icons/customIcons/icons/DrilloutUnit.js";import"../../../icons/customIcons/icons/FracFleet.js";import"../../../icons/customIcons/icons/Global.js";import"../../../icons/customIcons/icons/Program.js";import"../../../icons/customIcons/icons/Rig.js";import"../../../icons/customIcons/icons/Well.js";import"../../../icons/customIcons/icons/Gap.js";import"../../../icons/customIcons/icons/Pin.js";import"../../../icons/customIcons/icons/PinOne.js";import"../../../icons/customIcons/icons/PinOneCrossed.js";import"../../../icons/customIcons/icons/CloseOneFilled.js";import"../../../icons/customIcons/icons/AttentionFilled.js";import"../../../icons/customIcons/icons/CheckOneFilled.js";import"../../../icons/customIcons/icons/Archive.js";import"../../../icons/customIcons/icons/ArchiveCancel.js";import"../../../icons/customIcons/icons/Unarchive.js";import"../../../icons/customIcons/icons/Archived.js";import"../../../icons/customIcons/icons/InterventionUnit.js";import"../../../icons/customIcons/icons/CloudDelete.js";import"../../../icons/customIcons/icons/Lasso.js";import"../../../icons/customIcons/icons/Radius.js";import"../../../icons/customIcons/icons/ErrorOps.js";import"../../../icons/customIcons/icons/DataTypeOps.js";import"../../../icons/customIcons/icons/FalsePositiveOps.js";import"../../../icons/customIcons/icons/CalibrationOps.js";import"../../../icons/customIcons/icons/CriticalOps.js";import"../../../icons/customIcons/icons/Company.js";import"../../../icons/customIcons/icons/ArchiveOne.js";import"../../../icons/customIcons/icons/ParseBotFusion.js";import"../../../icons/customIcons/icons/Connect.js";import"../../../icons/customIcons/icons/PuzzleOne.js";import"../../../icons/customIcons/icons/Feed.js";import"../../../icons/customIcons/icons/Prompt.js";import"../../../icons/customIcons/icons/Companies.js";import"../../../icons/customIcons/icons/ClipboardAi.js";import"../../../icons/customIcons/icons/Key.js";import"../../../icons/customIcons/icons/AtSignCrossed.js";import"../../../icons/customIcons/icons/MappingManual.js";import"../../../icons/customIcons/icons/Mapping.js";import"../../../icons/customIcons/icons/Metrics.js";import"../../../icons/customIcons/icons/Drops.js";import"../../../icons/customIcons/icons/ClipboardSearch.js";import"../../../icons/customIcons/icons/Template.js";import"../../../icons/customIcons/icons/ClipboardMetrics.js";import"../../../icons/customIcons/icons/ClipboardBuilder.js";import"../../../icons/customIcons/icons/UnitConversion.js";import"../../../icons/customIcons/icons/NPT.js";import"../../../icons/customIcons/icons/GuidedFrac.js";import{jsx as a}from"react/jsx-runtime";var l=["a"];function j(o,s){var c=Object.keys(o);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(o);s&&(n=n.filter((function(s){return Object.getOwnPropertyDescriptor(o,s).enumerable}))),c.push.apply(c,n)}return c}function I(o){for(var c=1;c<arguments.length;c++){var n=null!=arguments[c]?arguments[c]:{};c%2?j(Object(n),!0).forEach((function(c){s(o,c,n[c])})):Object.getOwnPropertyDescriptors?Object.defineProperties(o,Object.getOwnPropertyDescriptors(n)):j(Object(n)).forEach((function(s){Object.defineProperty(o,s,Object.getOwnPropertyDescriptor(n,s))}))}return o}var d=function(s){var j=s.value,d=s.onChange,b=s.addTransparent,f=s.autoFocus,h=s.onAutoFocus,O=i([]),v=I(I({},j),{},{a:1}),C=0===j.a,g=b?m.toSpliced(11,1,"#FFFFFF00"):m,F=function(s){var c=r(s),i=c.a,t=I(I({},o(c,l)),{},{a:1}),e=0===i;return n(v,t)&&!e&&!C||C&&e},P=g.findIndex(F);t((function(){if(f){var o=-1===P?0:P,s=O.current[o];s&&(s.focus({preventScroll:!0}),null==h||h())}}),[f,h,P]);var k=function(o,s){var c;(d(r(g[o])),s)&&(null===(c=O.current[o])||void 0===c||c.focus({preventScroll:!0}))},y=function(o){var s,c=Number(o.currentTarget.dataset.index);switch(o.key){case"ArrowRight":s=(c+1)%g.length;break;case"ArrowLeft":s=(c-1+g.length)%g.length;break;case"ArrowDown":s=(c+12)%g.length;break;case"ArrowUp":s=(c-12+g.length)%g.length;break;case"Home":s=0;break;case"End":s=g.length-1;break;case"Enter":case" ":return o.preventDefault(),void k(c,!1);default:return}"number"==typeof s&&(o.preventDefault(),k(s,!0))};return a("div",{className:p.root,role:"radiogroup","aria-label":"Color palette",children:g.map((function(o,s){var n=r(o),i=e(o)>.97,t=0===n.a,m=F(o);return a("div",{ref:function(o){O.current[s]=o},className:c(p.swatch,m&&p.selected,t&&p.transparent,(i||t)&&p.darkAccent),onClick:function(){return d(n)},onKeyDown:y,style:t?void 0:{background:o},role:"radio","aria-checked":m,"aria-label":t?"Transparent":o.toUpperCase(),tabIndex:m||-1===P&&0===s?0:-1,"data-index":s,children:a(u,{size:14,className:p.icon})},o)}))})};export{d as Swatches};
+import o from"@babel/runtime/helpers/objectWithoutProperties";import s from"@babel/runtime/helpers/defineProperty";import c from"classnames";import{isEqual as n}from"lodash";import{useRef as i,useEffect as t}from"react";import{parseColor as r,getLuminance as e}from"../utils.js";import{ColorPickerTestIds as m}from"../ColorPicker.constants.js";import{paletteColors as p}from"./constants.js";import a from"./Swatches.scss.js";import{CheckSmallIcon as u}from"../../../icons/iconParkIcons.js";import"../../../icons/customIcons/icons/AddMessage.js";import"../../../icons/customIcons/icons/DragOne.js";import"../../../icons/customIcons/icons/Attention.js";import"../../../icons/customIcons/icons/Collapse.js";import"../../../icons/customIcons/icons/Dashboard.js";import"../../../icons/customIcons/icons/Expand.js";import"../../../icons/customIcons/icons/FolderClosed.js";import"../../../icons/customIcons/icons/FolderClosedFilled.js";import"../../../icons/customIcons/icons/FolderOpened.js";import"../../../icons/customIcons/icons/GreaterOrEqual.js";import"../../../icons/customIcons/icons/LessOrEqual.js";import"../../../icons/customIcons/icons/Search.js";import"../../../icons/customIcons/icons/SearchOne.js";import"../../../icons/customIcons/icons/Wellhub.js";import"../../../icons/customIcons/icons/MultiRuler.js";import"../../../icons/customIcons/icons/Checkbox.js";import"../../../icons/customIcons/icons/CheckboxChecked.js";import"../../../icons/customIcons/icons/CheckboxIndeterminate.js";import"../../../icons/customIcons/icons/Radio.js";import"../../../icons/customIcons/icons/RadioChecked.js";import"../../../icons/customIcons/icons/SimulFrac.js";import"../../../icons/customIcons/icons/ZipperFrac.js";import"../../../icons/customIcons/icons/CautionFilled.js";import"../../../icons/customIcons/icons/InfoRounded.js";import"../../../icons/customIcons/icons/FlameFilled.js";import"../../../icons/customIcons/icons/MoreApp.js";import"../../../icons/customIcons/icons/Pad.js";import"../../../icons/customIcons/icons/DrilloutUnit.js";import"../../../icons/customIcons/icons/FracFleet.js";import"../../../icons/customIcons/icons/Global.js";import"../../../icons/customIcons/icons/Program.js";import"../../../icons/customIcons/icons/Rig.js";import"../../../icons/customIcons/icons/Well.js";import"../../../icons/customIcons/icons/Gap.js";import"../../../icons/customIcons/icons/Pin.js";import"../../../icons/customIcons/icons/PinOne.js";import"../../../icons/customIcons/icons/PinOneCrossed.js";import"../../../icons/customIcons/icons/CloseOneFilled.js";import"../../../icons/customIcons/icons/AttentionFilled.js";import"../../../icons/customIcons/icons/CheckOneFilled.js";import"../../../icons/customIcons/icons/Archive.js";import"../../../icons/customIcons/icons/ArchiveCancel.js";import"../../../icons/customIcons/icons/Unarchive.js";import"../../../icons/customIcons/icons/Archived.js";import"../../../icons/customIcons/icons/InterventionUnit.js";import"../../../icons/customIcons/icons/CloudDelete.js";import"../../../icons/customIcons/icons/Lasso.js";import"../../../icons/customIcons/icons/Radius.js";import"../../../icons/customIcons/icons/ErrorOps.js";import"../../../icons/customIcons/icons/DataTypeOps.js";import"../../../icons/customIcons/icons/FalsePositiveOps.js";import"../../../icons/customIcons/icons/CalibrationOps.js";import"../../../icons/customIcons/icons/CriticalOps.js";import"../../../icons/customIcons/icons/Company.js";import"../../../icons/customIcons/icons/ArchiveOne.js";import"../../../icons/customIcons/icons/ParseBotFusion.js";import"../../../icons/customIcons/icons/Connect.js";import"../../../icons/customIcons/icons/PuzzleOne.js";import"../../../icons/customIcons/icons/Feed.js";import"../../../icons/customIcons/icons/Prompt.js";import"../../../icons/customIcons/icons/Companies.js";import"../../../icons/customIcons/icons/ClipboardAi.js";import"../../../icons/customIcons/icons/Key.js";import"../../../icons/customIcons/icons/AtSignCrossed.js";import"../../../icons/customIcons/icons/MappingManual.js";import"../../../icons/customIcons/icons/Mapping.js";import"../../../icons/customIcons/icons/Metrics.js";import"../../../icons/customIcons/icons/Drops.js";import"../../../icons/customIcons/icons/ClipboardSearch.js";import"../../../icons/customIcons/icons/Template.js";import"../../../icons/customIcons/icons/ClipboardMetrics.js";import"../../../icons/customIcons/icons/ClipboardBuilder.js";import"../../../icons/customIcons/icons/UnitConversion.js";import"../../../icons/customIcons/icons/NPT.js";import"../../../icons/customIcons/icons/GuidedFrac.js";import{jsx as l}from"react/jsx-runtime";var j=["a"];function I(o,s){var c=Object.keys(o);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(o);s&&(n=n.filter((function(s){return Object.getOwnPropertyDescriptor(o,s).enumerable}))),c.push.apply(c,n)}return c}function d(o){for(var c=1;c<arguments.length;c++){var n=null!=arguments[c]?arguments[c]:{};c%2?I(Object(n),!0).forEach((function(c){s(o,c,n[c])})):Object.getOwnPropertyDescriptors?Object.defineProperties(o,Object.getOwnPropertyDescriptors(n)):I(Object(n)).forEach((function(s){Object.defineProperty(o,s,Object.getOwnPropertyDescriptor(n,s))}))}return o}var f=function(s){var I=s.value,f=s.onChange,b=s.addTransparent,h=s.autoFocus,O=s.onAutoFocus,v=i([]),C=d(d({},I),{},{a:1}),g=0===I.a,F=b?p.toSpliced(11,1,"#FFFFFF00"):p,P=function(s){var c=r(s),i=c.a,t=d(d({},o(c,j)),{},{a:1}),e=0===i;return n(C,t)&&!e&&!g||g&&e},k=F.findIndex(P);t((function(){if(h){var o=-1===k?0:k,s=v.current[o];s&&(s.focus({preventScroll:!0}),null==O||O())}}),[h,O,k]);var y=function(o,s){var c;(f(r(F[o])),s)&&(null===(c=v.current[o])||void 0===c||c.focus({preventScroll:!0}))},w=function(o){var s,c=Number(o.currentTarget.dataset.index);switch(o.key){case"ArrowRight":s=(c+1)%F.length;break;case"ArrowLeft":s=(c-1+F.length)%F.length;break;case"ArrowDown":s=(c+12)%F.length;break;case"ArrowUp":s=(c-12+F.length)%F.length;break;case"Home":s=0;break;case"End":s=F.length-1;break;case"Enter":case" ":return o.preventDefault(),void y(c,!1);default:return}"number"==typeof s&&(o.preventDefault(),y(s,!0))};return l("div",{className:a.root,role:"radiogroup","aria-label":"Color palette",children:F.map((function(o,s){var n=r(o),i=e(o)>.97,t=0===n.a,p=P(o);return l("div",{ref:function(o){v.current[s]=o},className:c(a.swatch,p&&a.selected,t&&a.transparent,(i||t)&&a.darkAccent),onClick:function(){return f(n)},onKeyDown:w,style:t?void 0:{background:o},role:"radio","aria-checked":p,"aria-label":t?"Transparent":o.toUpperCase(),tabIndex:p||-1===k&&0===s?0:-1,"data-index":s,"data-testid":m.SwatchTestId,"data-color":o.toUpperCase(),"data-selected":p,children:l(u,{size:14,className:a.icon,"data-testid":p?m.SelectedSwatchTestId:void 0})},o)}))})};export{f as Swatches};
 //# sourceMappingURL=Swatches.js.map

package/componentsV2/ColorPicker/Swatches/Swatches.js.map

@@ -1 +1 @@
-{"version":3,"file":"Swatches.js","sources":["../../../../src/componentsV2/ColorPicker/Swatches/Swatches.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport { isEqual } from 'lodash';\nimport { KeyboardEventHandler, useEffect, useRef } from 'react';\n\nimport { ColorChannels, getLuminance, parseColor } from '../utils';\n\nimport { paletteColors } from './constants';\n\nimport styles from './Swatches.scss';\n\nimport { CheckSmallIcon } from '~/icons';\n\nexport type SwatchesProps = {\n  /**\n   * Hex or rgba, with or without alpha\n   */\n  value: ColorChannels;\n  onChange: (color: ColorChannels) => void;\n  addTransparent?: boolean;\n  autoFocus?: boolean;\n  onAutoFocus?: () => void;\n};\n\nconst colorsPerRow = 12;\n\nexport const Swatches = ({\n  value,\n  onChange,\n  addTransparent,\n  autoFocus,\n  onAutoFocus,\n}: SwatchesProps) => {\n  const swatchRefs = useRef<Array<HTMLDivElement | null>>([]);\n  const opaqueValue = { ...value, a: 1 };\n  const isValueTransparent = value.a === 0;\n\n  const colors = addTransparent\n    ? paletteColors.toSpliced(colorsPerRow - 1, 1, '#FFFFFF00')\n    : paletteColors;\n\n  const isSelectedColor = (color: string) => {\n    const { a, ...colorChannels } = parseColor(color);\n    const opaqueColor = { ...colorChannels, a: 1 };\n    const isTransparent = a === 0;\n\n    return (\n      (isEqual(opaqueValue, opaqueColor) && !isTransparent && !isValueTransparent) ||\n      (isValueTransparent && isTransparent)\n    );\n  };\n\n  const selectedIndex = colors.findIndex(isSelectedColor);\n\n  useEffect(() => {\n    if (!autoFocus) {\n      return;\n    }\n\n    const focusIndex = selectedIndex === -1 ? 0 : selectedIndex;\n    const swatch = swatchRefs.current[focusIndex];\n\n    if (swatch) {\n      swatch.focus({ preventScroll: true });\n      onAutoFocus?.();\n    }\n  }, [autoFocus, onAutoFocus, selectedIndex]);\n\n  const selectColor = (index: number, focus: boolean) => {\n    onChange(parseColor(colors[index]));\n\n    if (focus) {\n      swatchRefs.current[index]?.focus({ preventScroll: true });\n    }\n  };\n\n  const handleKeyDown: KeyboardEventHandler<HTMLDivElement> = event => {\n    const currentIndex = Number(event.currentTarget.dataset.index);\n    let nextIndex: number | undefined;\n\n    switch (event.key) {\n      case 'ArrowRight':\n        nextIndex = (currentIndex + 1) % colors.length;\n        break;\n      case 'ArrowLeft':\n        nextIndex = (currentIndex - 1 + colors.length) % colors.length;\n        break;\n      case 'ArrowDown':\n        nextIndex = (currentIndex + colorsPerRow) % colors.length;\n        break;\n      case 'ArrowUp':\n        nextIndex = (currentIndex - colorsPerRow + colors.length) % colors.length;\n        break;\n      case 'Home':\n        nextIndex = 0;\n        break;\n      case 'End':\n        nextIndex = colors.length - 1;\n        break;\n      case 'Enter':\n      case ' ':\n        event.preventDefault();\n        selectColor(currentIndex, false);\n        return;\n      default:\n        return;\n    }\n\n    if (typeof nextIndex === 'number') {\n      event.preventDefault();\n      selectColor(nextIndex, true);\n    }\n  };\n\n  return (\n    <div className={styles.root} role=\"radiogroup\" aria-label=\"Color palette\">\n      {colors.map((color, index) => {\n        const channels = parseColor(color);\n        const isLightColor = getLuminance(color) > 0.97;\n        const isTransparent = channels.a === 0;\n        const isSelected = isSelectedColor(color);\n\n        return (\n          <div\n            key={color}\n            ref={element => {\n              swatchRefs.current[index] = element;\n            }}\n            className={classNames(\n              styles.swatch,\n              isSelected && styles.selected,\n              isTransparent && styles.transparent,\n              (isLightColor || isTransparent) && styles.darkAccent\n            )}\n            onClick={() => onChange(channels)}\n            onKeyDown={handleKeyDown}\n            style={isTransparent ? undefined : { background: color }}\n            role=\"radio\"\n            aria-checked={isSelected}\n            aria-label={isTransparent ? 'Transparent' : color.toUpperCase()}\n            tabIndex={isSelected || (selectedIndex === -1 && index === 0) ? 0 : -1}\n            data-index={index}\n          >\n            <CheckSmallIcon size={14} className={styles.icon} />\n          </div>\n        );\n      })}\n    </div>\n  );\n};\n"],"names":["Swatches","_ref","value","onChange","addTransparent","autoFocus","onAutoFocus","swatchRefs","useRef","opaqueValue","a","isValueTransparent","colors","paletteColors","toSpliced","colorsPerRow","isSelectedColor","color","parseColor","opaqueColor","_objectWithoutProperties","_parseColor","_excluded","isTransparent","isEqual","selectedIndex","findIndex","useEffect","focusIndex","swatch","current","focus","preventScroll","selectColor","index","_swatchRefs$current$i","handleKeyDown","event","nextIndex","currentIndex","Number","currentTarget","dataset","key","length","preventDefault","_jsx","className","styles","root","role","children","map","channels","isLightColor","getLuminance","isSelected","ref","element","classNames","selected","transparent","darkAccent","onClick","onKeyDown","style","undefined","background","toUpperCase","tabIndex","CheckSmallIcon","size","icon"],"mappings":"+hKAuBA,IAEaA,EAAW,SAMHC,GAAA,IALnBC,IAAAA,MACAC,IAAAA,SACAC,IAAAA,eACAC,IAAAA,UACAC,IAAAA,YAEMC,EAAaC,EAAqC,IAClDC,SAAmBP,GAAK,GAAA,CAAEQ,EAAG,IAC7BC,EAAiC,IAAZT,EAAMQ,EAE3BE,EAASR,EACXS,EAAcC,UAAUC,GAAkB,EAAG,aAC7CF,EAEEG,EAAkB,SAACC,GACvB,IAAgCC,EAAAA,EAAWD,GAAnCP,IAAAA,EACFS,SADqBC,EAAAC,EAAAC,IACW,GAAA,CAAEZ,EAAG,IACrCa,EAAsB,IAANb,EAEtB,OACGc,EAAQf,EAAaU,KAAiBI,IAAkBZ,GACxDA,GAAsBY,GAIrBE,EAAgBb,EAAOc,UAAUV,GAEvCW,GAAU,WACR,GAAKtB,EAAL,CAIA,IAAMuB,GAAgC,IAAnBH,EAAuB,EAAIA,EACxCI,EAAStB,EAAWuB,QAAQF,GAE9BC,IACFA,EAAOE,MAAM,CAAEC,eAAe,IAC9B1B,SAAAA,IAPF,CASD,GAAE,CAACD,EAAWC,EAAamB,IAE5B,IAAMQ,EAAc,SAACC,EAAeH,GAGvB,IAAAI,GAFXhC,EAASe,EAAWN,EAAOsB,KAEvBH,KACuB,QAAzBxB,EAAAA,EAAWuB,QAAQI,UAAM,IAAAC,GAAzBA,EAA2BJ,MAAM,CAAEC,eAAe,MAIhDI,EAAsD,SAAAC,GAC1D,IACIC,EADEC,EAAeC,OAAOH,EAAMI,cAAcC,QAAQR,OAGxD,OAAQG,EAAMM,KACZ,IAAK,aACHL,GAAaC,EAAe,GAAK3B,EAAOgC,OACxC,MACF,IAAK,YACHN,GAAaC,EAAe,EAAI3B,EAAOgC,QAAUhC,EAAOgC,OACxD,MACF,IAAK,YACHN,GAAaC,EAhEA,IAgE+B3B,EAAOgC,OACnD,MACF,IAAK,UACHN,GAAaC,EAnEA,GAmE8B3B,EAAOgC,QAAUhC,EAAOgC,OACnE,MACF,IAAK,OACHN,EAAY,EACZ,MACF,IAAK,MACHA,EAAY1B,EAAOgC,OAAS,EAC5B,MACF,IAAK,QACL,IAAK,IAGH,OAFAP,EAAMQ,sBACNZ,EAAYM,GAAc,GAE5B,QACE,OAGqB,iBAAdD,IACTD,EAAMQ,iBACNZ,EAAYK,GAAW,KAI3B,OACEQ,EAAA,MAAA,CAAKC,UAAWC,EAAOC,KAAMC,KAAK,aAAa,aAAW,gBAAeC,SACtEvC,EAAOwC,KAAI,SAACnC,EAAOiB,GAClB,IAAMmB,EAAWnC,EAAWD,GACtBqC,EAAeC,EAAatC,GAAS,IACrCM,EAA+B,IAAf8B,EAAS3C,EACzB8C,EAAaxC,EAAgBC,GAEnC,OACE6B,EAAA,MAAA,CAEEW,IAAK,SAAAC,GACHnD,EAAWuB,QAAQI,GAASwB,CAC5B,EACFX,UAAWY,EACTX,EAAOnB,OACP2B,GAAcR,EAAOY,SACrBrC,GAAiByB,EAAOa,aACvBP,GAAgB/B,IAAkByB,EAAOc,YAE5CC,QAAS,WAAA,OAAM5D,EAASkD,EAAU,EAClCW,UAAW5B,EACX6B,MAAO1C,OAAgB2C,EAAY,CAAEC,WAAYlD,GACjDiC,KAAK,QACL,eAAcM,EACd,aAAYjC,EAAgB,cAAgBN,EAAMmD,cAClDC,SAAUb,IAAkC,IAAnB/B,GAAkC,IAAVS,EAAe,GAAK,EACrE,aAAYA,EAAMiB,SAElBL,EAACwB,EAAc,CAACC,KAAM,GAAIxB,UAAWC,EAAOwB,QAnBvCvD,OAyBjB"}
+{"version":3,"file":"Swatches.js","sources":["../../../../src/componentsV2/ColorPicker/Swatches/Swatches.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport { isEqual } from 'lodash';\nimport { KeyboardEventHandler, useEffect, useRef } from 'react';\n\nimport { ColorChannels, getLuminance, parseColor } from '../utils';\n\nimport { ColorPickerTestIds } from '../ColorPicker.constants';\n\nimport { paletteColors } from './constants';\n\nimport styles from './Swatches.scss';\n\nimport { CheckSmallIcon } from '~/icons';\n\nexport type SwatchesProps = {\n  /**\n   * Hex or rgba, with or without alpha\n   */\n  value: ColorChannels;\n  onChange: (color: ColorChannels) => void;\n  addTransparent?: boolean;\n  autoFocus?: boolean;\n  onAutoFocus?: () => void;\n};\n\nconst colorsPerRow = 12;\n\nexport const Swatches = ({\n  value,\n  onChange,\n  addTransparent,\n  autoFocus,\n  onAutoFocus,\n}: SwatchesProps) => {\n  const swatchRefs = useRef<Array<HTMLDivElement | null>>([]);\n  const opaqueValue = { ...value, a: 1 };\n  const isValueTransparent = value.a === 0;\n\n  const colors = addTransparent\n    ? paletteColors.toSpliced(colorsPerRow - 1, 1, '#FFFFFF00')\n    : paletteColors;\n\n  const isSelectedColor = (color: string) => {\n    const { a, ...colorChannels } = parseColor(color);\n    const opaqueColor = { ...colorChannels, a: 1 };\n    const isTransparent = a === 0;\n\n    return (\n      (isEqual(opaqueValue, opaqueColor) && !isTransparent && !isValueTransparent) ||\n      (isValueTransparent && isTransparent)\n    );\n  };\n\n  const selectedIndex = colors.findIndex(isSelectedColor);\n\n  useEffect(() => {\n    if (!autoFocus) {\n      return;\n    }\n\n    const focusIndex = selectedIndex === -1 ? 0 : selectedIndex;\n    const swatch = swatchRefs.current[focusIndex];\n\n    if (swatch) {\n      swatch.focus({ preventScroll: true });\n      onAutoFocus?.();\n    }\n  }, [autoFocus, onAutoFocus, selectedIndex]);\n\n  const selectColor = (index: number, focus: boolean) => {\n    onChange(parseColor(colors[index]));\n\n    if (focus) {\n      swatchRefs.current[index]?.focus({ preventScroll: true });\n    }\n  };\n\n  const handleKeyDown: KeyboardEventHandler<HTMLDivElement> = event => {\n    const currentIndex = Number(event.currentTarget.dataset.index);\n    let nextIndex: number | undefined;\n\n    switch (event.key) {\n      case 'ArrowRight':\n        nextIndex = (currentIndex + 1) % colors.length;\n        break;\n      case 'ArrowLeft':\n        nextIndex = (currentIndex - 1 + colors.length) % colors.length;\n        break;\n      case 'ArrowDown':\n        nextIndex = (currentIndex + colorsPerRow) % colors.length;\n        break;\n      case 'ArrowUp':\n        nextIndex = (currentIndex - colorsPerRow + colors.length) % colors.length;\n        break;\n      case 'Home':\n        nextIndex = 0;\n        break;\n      case 'End':\n        nextIndex = colors.length - 1;\n        break;\n      case 'Enter':\n      case ' ':\n        event.preventDefault();\n        selectColor(currentIndex, false);\n        return;\n      default:\n        return;\n    }\n\n    if (typeof nextIndex === 'number') {\n      event.preventDefault();\n      selectColor(nextIndex, true);\n    }\n  };\n\n  return (\n    <div className={styles.root} role=\"radiogroup\" aria-label=\"Color palette\">\n      {colors.map((color, index) => {\n        const channels = parseColor(color);\n        const isLightColor = getLuminance(color) > 0.97;\n        const isTransparent = channels.a === 0;\n        const isSelected = isSelectedColor(color);\n\n        return (\n          <div\n            key={color}\n            ref={element => {\n              swatchRefs.current[index] = element;\n            }}\n            className={classNames(\n              styles.swatch,\n              isSelected && styles.selected,\n              isTransparent && styles.transparent,\n              (isLightColor || isTransparent) && styles.darkAccent\n            )}\n            onClick={() => onChange(channels)}\n            onKeyDown={handleKeyDown}\n            style={isTransparent ? undefined : { background: color }}\n            role=\"radio\"\n            aria-checked={isSelected}\n            aria-label={isTransparent ? 'Transparent' : color.toUpperCase()}\n            tabIndex={isSelected || (selectedIndex === -1 && index === 0) ? 0 : -1}\n            data-index={index}\n            data-testid={ColorPickerTestIds.SwatchTestId}\n            data-color={color.toUpperCase()}\n            data-selected={isSelected}\n          >\n            <CheckSmallIcon\n              size={14}\n              className={styles.icon}\n              data-testid={isSelected ? ColorPickerTestIds.SelectedSwatchTestId : undefined}\n            />\n          </div>\n        );\n      })}\n    </div>\n  );\n};\n"],"names":["Swatches","_ref","value","onChange","addTransparent","autoFocus","onAutoFocus","swatchRefs","useRef","opaqueValue","a","isValueTransparent","colors","paletteColors","toSpliced","colorsPerRow","isSelectedColor","color","parseColor","opaqueColor","_objectWithoutProperties","_parseColor","_excluded","isTransparent","isEqual","selectedIndex","findIndex","useEffect","focusIndex","swatch","current","focus","preventScroll","selectColor","index","_swatchRefs$current$i","handleKeyDown","event","nextIndex","currentIndex","Number","currentTarget","dataset","key","length","preventDefault","_jsx","className","styles","root","role","children","map","channels","isLightColor","getLuminance","isSelected","ref","element","classNames","selected","transparent","darkAccent","onClick","onKeyDown","style","undefined","background","toUpperCase","tabIndex","ColorPickerTestIds","SwatchTestId","CheckSmallIcon","size","icon","SelectedSwatchTestId"],"mappings":"gmKAyBA,IAEaA,EAAW,SAMHC,GAAA,IALnBC,IAAAA,MACAC,IAAAA,SACAC,IAAAA,eACAC,IAAAA,UACAC,IAAAA,YAEMC,EAAaC,EAAqC,IAClDC,SAAmBP,GAAK,GAAA,CAAEQ,EAAG,IAC7BC,EAAiC,IAAZT,EAAMQ,EAE3BE,EAASR,EACXS,EAAcC,UAAUC,GAAkB,EAAG,aAC7CF,EAEEG,EAAkB,SAACC,GACvB,IAAgCC,EAAAA,EAAWD,GAAnCP,IAAAA,EACFS,SADqBC,EAAAC,EAAAC,IACW,GAAA,CAAEZ,EAAG,IACrCa,EAAsB,IAANb,EAEtB,OACGc,EAAQf,EAAaU,KAAiBI,IAAkBZ,GACxDA,GAAsBY,GAIrBE,EAAgBb,EAAOc,UAAUV,GAEvCW,GAAU,WACR,GAAKtB,EAAL,CAIA,IAAMuB,GAAgC,IAAnBH,EAAuB,EAAIA,EACxCI,EAAStB,EAAWuB,QAAQF,GAE9BC,IACFA,EAAOE,MAAM,CAAEC,eAAe,IAC9B1B,SAAAA,IAPF,CASD,GAAE,CAACD,EAAWC,EAAamB,IAE5B,IAAMQ,EAAc,SAACC,EAAeH,GAGvB,IAAAI,GAFXhC,EAASe,EAAWN,EAAOsB,KAEvBH,KACuB,QAAzBxB,EAAAA,EAAWuB,QAAQI,UAAM,IAAAC,GAAzBA,EAA2BJ,MAAM,CAAEC,eAAe,MAIhDI,EAAsD,SAAAC,GAC1D,IACIC,EADEC,EAAeC,OAAOH,EAAMI,cAAcC,QAAQR,OAGxD,OAAQG,EAAMM,KACZ,IAAK,aACHL,GAAaC,EAAe,GAAK3B,EAAOgC,OACxC,MACF,IAAK,YACHN,GAAaC,EAAe,EAAI3B,EAAOgC,QAAUhC,EAAOgC,OACxD,MACF,IAAK,YACHN,GAAaC,EAhEA,IAgE+B3B,EAAOgC,OACnD,MACF,IAAK,UACHN,GAAaC,EAnEA,GAmE8B3B,EAAOgC,QAAUhC,EAAOgC,OACnE,MACF,IAAK,OACHN,EAAY,EACZ,MACF,IAAK,MACHA,EAAY1B,EAAOgC,OAAS,EAC5B,MACF,IAAK,QACL,IAAK,IAGH,OAFAP,EAAMQ,sBACNZ,EAAYM,GAAc,GAE5B,QACE,OAGqB,iBAAdD,IACTD,EAAMQ,iBACNZ,EAAYK,GAAW,KAI3B,OACEQ,EAAA,MAAA,CAAKC,UAAWC,EAAOC,KAAMC,KAAK,aAAa,aAAW,gBAAeC,SACtEvC,EAAOwC,KAAI,SAACnC,EAAOiB,GAClB,IAAMmB,EAAWnC,EAAWD,GACtBqC,EAAeC,EAAatC,GAAS,IACrCM,EAA+B,IAAf8B,EAAS3C,EACzB8C,EAAaxC,EAAgBC,GAEnC,OACE6B,EAAA,MAAA,CAEEW,IAAK,SAAAC,GACHnD,EAAWuB,QAAQI,GAASwB,CAC5B,EACFX,UAAWY,EACTX,EAAOnB,OACP2B,GAAcR,EAAOY,SACrBrC,GAAiByB,EAAOa,aACvBP,GAAgB/B,IAAkByB,EAAOc,YAE5CC,QAAS,WAAA,OAAM5D,EAASkD,EAAU,EAClCW,UAAW5B,EACX6B,MAAO1C,OAAgB2C,EAAY,CAAEC,WAAYlD,GACjDiC,KAAK,QACL,eAAcM,EACd,aAAYjC,EAAgB,cAAgBN,EAAMmD,cAClDC,SAAUb,IAAkC,IAAnB/B,GAAkC,IAAVS,EAAe,GAAK,EACrE,aAAYA,EACZ,cAAaoC,EAAmBC,aAChC,aAAYtD,EAAMmD,cAClB,gBAAeZ,EAAWL,SAE1BL,EAAC0B,EAAc,CACbC,KAAM,GACN1B,UAAWC,EAAO0B,KAClB,cAAalB,EAAac,EAAmBK,0BAAuBT,KAzBjEjD,OAgCjB"}

package/componentsV2/ColorPicker/index.d.ts

@@ -1,2 +1,3 @@
 export * from './ColorPicker';
+export { ColorPickerTestIds } from './ColorPicker.constants';
 //# sourceMappingURL=index.d.ts.map

package/componentsV2/ColorPicker/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/componentsV2/ColorPicker/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/componentsV2/ColorPicker/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC"}