npm - @corva/ui - Versions diffs - 3.75.0-10 → 3.75.0-11 - Mend

@corva/ui 3.75.0-10 → 3.75.0-11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1098) hide show

package/componentsV2/ButtonLive/ButtonLive.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ButtonLive.js","sources":["../../../src/componentsV2/ButtonLive/ButtonLive.tsx"],"sourcesContent":["import { forwardRef, MouseEventHandler, ReactNode } from 'react';\nimport classNames from 'classnames';\n\nimport { Button } from '../Button';\nimport { Tooltip } from '../Tooltip';\n\nimport styles from './ButtonLive.scss';\n\nimport { ArrowRightIcon } from '~/icons';\n\nexport type ButtonLiveProps = {\n /*\n Content\n */\n children?: ReactNode;\n size?: 'small' \| 'medium' \| 'large';\n disabled?: boolean;\n onClick?: MouseEventHandler<HTMLButtonElement>;\n tooltip?: ReactNode;\n\n className?: string;\n testId?: string;\n};\n\nconst SizeToClassMap: Record<Required<ButtonLiveProps>['size'], string> = {\n large: styles.large,\n medium: styles.medium,\n small: styles.small,\n};\n\nexport const ButtonLive = forwardRef<HTMLButtonElement, ButtonLiveProps>(\n (\n { children = 'Live', tooltip = 'Go to Live data', size = 'medium', className, ...rest },\n ref\n ) => {\n return (\n <Tooltip title={tooltip} disabled={!tooltip} placement=\"bottom-start\">\n <Button\n className={classNames(styles.root, SizeToClassMap[size], className)}\n size={size}\n ref={ref}\n type=\"tertiary\"\n prefix={<ArrowRightIcon />}\n {...rest}\n >\n {children}\n </Button>\n </Tooltip>\n );\n }\n);\n"],"names":["SizeToClassMap","large","styles","medium","small","ButtonLive","forwardRef","_ref","ref","_ref$children","children","_ref$tooltip","tooltip","_ref$size","size","className","rest","_objectWithoutProperties","_excluded","_jsx","Tooltip","title","disabled","placement","Button","_objectSpread","classNames","root","type","prefix","ArrowRightIcon"],"mappings":"~~ulJAwBA~~,IAAMA,EAAoE,CACxEC,MAAOC,EAAOD,MACdE,OAAQD,EAAOC,OACfC,MAAOF,EAAOE,OAGHC,EAAaC,GACxB,SAAAC,EAEEC,GACG,IAAAC,EAAAF,EAFDG,SAAAA,aAAW,OAAMD,EAAAE,EAAAJ,EAAEK,QAAAA,aAAU,kBAAiBD,EAAAE,EAAAN,EAAEO,KAAAA,aAAO,SAAQD,EAAEE,IAAAA,UAAcC,EAAIC,EAAAV,EAAAW,GAGrF,OACEC,EAACC,EAAO,CAACC,MAAOT,EAASU,UAAWV,EAASW,UAAU,eAAcb,SACnES,EAACK,EAAMC,EAAAA,EAAA,CACLV,UAAWW,EAAWxB,EAAOyB,KAAM3B,EAAec,GAAOC,GACzDD,KAAMA,EACNN,IAAKA,EACLoB,KAAK,WACLC,OAAQV,EAACW,EAAc,KACnBd,GAAI,GAAA,CAAAN,SAEPA,MAIT"}
1	+ {"version":3,"file":"ButtonLive.js","sources":["../../../src/componentsV2/ButtonLive/ButtonLive.tsx"],"sourcesContent":["import { forwardRef, MouseEventHandler, ReactNode } from 'react';\nimport classNames from 'classnames';\n\nimport { Button } from '../Button';\nimport { Tooltip } from '../Tooltip';\n\nimport styles from './ButtonLive.scss';\n\nimport { ArrowRightIcon } from '~/icons';\n\nexport type ButtonLiveProps = {\n /*\n Content\n */\n children?: ReactNode;\n size?: 'small' \| 'medium' \| 'large';\n disabled?: boolean;\n onClick?: MouseEventHandler<HTMLButtonElement>;\n tooltip?: ReactNode;\n\n className?: string;\n testId?: string;\n};\n\nconst SizeToClassMap: Record<Required<ButtonLiveProps>['size'], string> = {\n large: styles.large,\n medium: styles.medium,\n small: styles.small,\n};\n\nexport const ButtonLive = forwardRef<HTMLButtonElement, ButtonLiveProps>(\n (\n { children = 'Live', tooltip = 'Go to Live data', size = 'medium', className, ...rest },\n ref\n ) => {\n return (\n <Tooltip title={tooltip} disabled={!tooltip} placement=\"bottom-start\">\n <Button\n className={classNames(styles.root, SizeToClassMap[size], className)}\n size={size}\n ref={ref}\n type=\"tertiary\"\n prefix={<ArrowRightIcon />}\n {...rest}\n >\n {children}\n </Button>\n </Tooltip>\n );\n }\n);\n"],"names":["SizeToClassMap","large","styles","medium","small","ButtonLive","forwardRef","_ref","ref","_ref$children","children","_ref$tooltip","tooltip","_ref$size","size","className","rest","_objectWithoutProperties","_excluded","_jsx","Tooltip","title","disabled","placement","Button","_objectSpread","classNames","root","type","prefix","ArrowRightIcon"],"mappings":"isJAwBA,IAAMA,EAAoE,CACxEC,MAAOC,EAAOD,MACdE,OAAQD,EAAOC,OACfC,MAAOF,EAAOE,OAGHC,EAAaC,GACxB,SAAAC,EAEEC,GACG,IAAAC,EAAAF,EAFDG,SAAAA,aAAW,OAAMD,EAAAE,EAAAJ,EAAEK,QAAAA,aAAU,kBAAiBD,EAAAE,EAAAN,EAAEO,KAAAA,aAAO,SAAQD,EAAEE,IAAAA,UAAcC,EAAIC,EAAAV,EAAAW,GAGrF,OACEC,EAACC,EAAO,CAACC,MAAOT,EAASU,UAAWV,EAASW,UAAU,eAAcb,SACnES,EAACK,EAAMC,EAAAA,EAAA,CACLV,UAAWW,EAAWxB,EAAOyB,KAAM3B,EAAec,GAAOC,GACzDD,KAAMA,EACNN,IAAKA,EACLoB,KAAK,WACLC,OAAQV,EAACW,EAAc,KACnBd,GAAI,GAAA,CAAAN,SAEPA,MAIT"}

package/componentsV2/ChartAxisExtreme/ChartAxisExtreme.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import o from"@babel/runtime/helpers/slicedToArray";import s from"classnames";import{useState as c,useRef as i,useCallback as n,useMemo as t,useEffect as r}from"react";import{throttle as m}from"lodash";import{ChartAxisExtremeInput as e}from"./ChartAxisExtremeInput.js";import{usePositionStyles as u,defaultValueValidator as p,defaultValueFormatter as a,getDeltaDrag as l}from"./utils.js";import{ChartAxisExtremeDragTracker as j}from"./ChartAxisExtremeDragTracker.js";import I from"./ChartAxisExtreme.scss.js";import{UpIcon as d,LeftIcon as v,DownIcon as f,RightIcon as h}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/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/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 C,jsx as x}from"react/jsx-runtime";var g=function(g){var b=g.axis,A=g.testId,F=g.className,O=g.formatValue,D=g.value,y=g.dragDeltaValue,E=void 0===y?5:y,M=g.onChange,N=g.extremeType,T=g.validate,k=void 0===T?p:T,P=c(!1),z=o(P,2),S=z[0],w=z[1],R=c(),G=o(R,2),U=G[0],V=G[1],B=c(),L=o(B,2),q=L[0],W=L[1],K=c(!1),X=o(K,2),Y=X[0],Z=X[1],H=i(!1),J=i(null),Q=i(),$=Y?q:D,_=u({axis:b,extremeType:N}),oo=!b.horiz,so=O||a,co=n((function(o){return"number"==typeof E?Math.floor(o/(E||1)):E(o)}),[E]),io=n((function(o){return k(o,{axis:b,extremeType:N})}),[b,N,k]),no=n((function(){H.current=!1,w(!0)}),[]),to=n((function(){H.current=!1,w(!1)}),[]),ro=n((function(o){void 0!==o&&(null==M||M(o,{axis:b,extremeType:N})),to()}),[b,N,M,to]),mo=n((function(o){o.preventDefault(),Q.current=void 0,H.current=!0}),[]),eo=n((function(o){null==M||M(o,{axis:b,extremeType:N})}),[b,N,M]),uo=t((function(){return m((function(o){eo(o)}),300)}),[eo]),po=n((function(){H.current=!1,W(void 0),V(void 0),Z(!1),uo.flush()}),[uo]),ao=n((function(){!H.current||S||Y||(W($),V($),Z(!0))}),[Y,S,$]),lo=n((function(o){if(J.current&&b&&void 0!==U){var s;if(!Q.current)Q.current=null===(s=J.current)||void 0===s?void 0:s.getBoundingClientRect();var c=o.clientY,i=o.clientX,n=Q.current,t=n.y,r=n.height,m=n.x,e=n.width,u=oo?l(c,t,r):-l(i,m,e),p=U+co(u);io(p)&&(W(p),uo(p))}}),[io,b,co,U,oo,uo]);return r((function(){return function(){return uo.cancel()}}),[uo]),void 0!==$&&b?C("div",{className:s(I.root,F),style:_,"data-testid":A,children:[x(j,{isDragging:Y,onDragEnd:po,onDrag:lo,isVertical:oo}),C("div",{className:I.content,onMouseDown:mo,onMouseLeave:ao,onClick:no,ref:J,children:[C("div",{className:s(I.valueContainer,S&&I.isEditing,oo&&I.vertical),children:[x(oo?d:v,{size:Number(I.arrowsSize),className:I.valueArrow}),x("div",{className:I.value,children:so($)}),x(oo?f:h,{size:Number(I.arrowsSize),className:I.valueArrow})]}),x(e,{value:$,isEditing:S,onEditEnd:ro,validate:io,isVertical:oo})]})]}):null};export{g as ChartAxisExtreme};
+import o from"@babel/runtime/helpers/slicedToArray";import s from"classnames";import{useState as c,useRef as i,useCallback as n,useMemo as t,useEffect as r}from"react";import{throttle as m}from"lodash";import{ChartAxisExtremeInput as e}from"./ChartAxisExtremeInput.js";import{usePositionStyles as u,defaultValueValidator as p,defaultValueFormatter as a,getDeltaDrag as l}from"./utils.js";import{ChartAxisExtremeDragTracker as j}from"./ChartAxisExtremeDragTracker.js";import I from"./ChartAxisExtreme.scss.js";import{UpIcon as d,LeftIcon as v,DownIcon as f,RightIcon as h}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/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 C,jsx as x}from"react/jsx-runtime";var g=function(g){var F=g.axis,b=g.testId,A=g.className,O=g.formatValue,D=g.value,y=g.dragDeltaValue,E=void 0===y?5:y,M=g.onChange,N=g.extremeType,T=g.validate,k=void 0===T?p:T,P=c(!1),z=o(P,2),R=z[0],S=z[1],w=c(),G=o(w,2),U=G[0],V=G[1],B=c(),L=o(B,2),q=L[0],W=L[1],K=c(!1),X=o(K,2),Y=X[0],Z=X[1],H=i(!1),J=i(null),Q=i(),$=Y?q:D,_=u({axis:F,extremeType:N}),oo=!F.horiz,so=O||a,co=n((function(o){return"number"==typeof E?Math.floor(o/(E||1)):E(o)}),[E]),io=n((function(o){return k(o,{axis:F,extremeType:N})}),[F,N,k]),no=n((function(){H.current=!1,S(!0)}),[]),to=n((function(){H.current=!1,S(!1)}),[]),ro=n((function(o){void 0!==o&&(null==M||M(o,{axis:F,extremeType:N})),to()}),[F,N,M,to]),mo=n((function(o){o.preventDefault(),Q.current=void 0,H.current=!0}),[]),eo=n((function(o){null==M||M(o,{axis:F,extremeType:N})}),[F,N,M]),uo=t((function(){return m((function(o){eo(o)}),300)}),[eo]),po=n((function(){H.current=!1,W(void 0),V(void 0),Z(!1),uo.flush()}),[uo]),ao=n((function(){!H.current||R||Y||(W($),V($),Z(!0))}),[Y,R,$]),lo=n((function(o){if(J.current&&F&&void 0!==U){var s;if(!Q.current)Q.current=null===(s=J.current)||void 0===s?void 0:s.getBoundingClientRect();var c=o.clientY,i=o.clientX,n=Q.current,t=n.y,r=n.height,m=n.x,e=n.width,u=oo?l(c,t,r):-l(i,m,e),p=U+co(u);io(p)&&(W(p),uo(p))}}),[io,F,co,U,oo,uo]);return r((function(){return function(){return uo.cancel()}}),[uo]),void 0!==$&&F?C("div",{className:s(I.root,A),style:_,"data-testid":b,children:[x(j,{isDragging:Y,onDragEnd:po,onDrag:lo,isVertical:oo}),C("div",{className:I.content,onMouseDown:mo,onMouseLeave:ao,onClick:no,ref:J,children:[C("div",{className:s(I.valueContainer,R&&I.isEditing,oo&&I.vertical),children:[x(oo?d:v,{size:Number(I.arrowsSize),className:I.valueArrow}),x("div",{className:I.value,children:so($)}),x(oo?f:h,{size:Number(I.arrowsSize),className:I.valueArrow})]}),x(e,{value:$,isEditing:R,onEditEnd:ro,validate:io,isVertical:oo})]})]}):null};export{g as ChartAxisExtreme};
 //# sourceMappingURL=ChartAxisExtreme.js.map

package/componentsV2/ChartAxisExtreme/ChartAxisExtreme.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ChartAxisExtreme.js","sources":["../../../src/componentsV2/ChartAxisExtreme/ChartAxisExtreme.tsx"],"sourcesContent":["import { Axis } from 'highcharts';\nimport classNames from 'classnames';\nimport { MouseEventHandler, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { throttle } from 'lodash';\n\nimport { ChartAxisExtremeInput } from './ChartAxisExtremeInput';\nimport {\n AxisExtremeType,\n ChartAxisExtremeChangeHandler,\n ChartAxisExtremeValidator,\n defaultValueFormatter,\n defaultValueValidator,\n getDeltaDrag,\n usePositionStyles,\n} from './utils';\nimport { ChartAxisExtremeDragTracker } from './ChartAxisExtremeDragTracker';\n\nimport styles from './ChartAxisExtreme.scss';\n\nimport { DownIcon, LeftIcon, RightIcon, UpIcon } from '~/icons';\n\nexport type ChartAxisExtremeProps = {\n value: number;\n onChange?: ChartAxisExtremeChangeHandler;\n formatValue?: (value: number) => string \| number;\n\n axis: Axis;\n extremeType: AxisExtremeType;\n\n /*\n Validates possible value on both manual input & drag actions\n /\n validate?: ChartAxisExtremeValidator;\n\n /\n Governs \"sensitivity\" of drag.\n * A number indicates how many pixels should a user drag to change axis extreme by 1.\n * A function accepts dragged distance in pixels and returns how much value should change.\n * Generally, positive input should generate positive output. Can be used in conjunction with `validate` prop to force min/max value when dragging\n /\n dragDeltaValue?: number \| ((deltaPixels: number) => number);\n\n className?: string;\n testId?: string;\n};\n\n// When making ChartWrapper2 - this component needs to hook into Highcharts' render cycle to automatically reposition itself\nexport const ChartAxisExtreme = ({\n axis,\n testId,\n className,\n formatValue, // No default here because it puts default function's code in storybook for some reason\n value,\n dragDeltaValue = 5,\n onChange,\n extremeType,\n validate = defaultValueValidator,\n}: ChartAxisExtremeProps) => {\n const [isEditing, setIsEditing] = useState(false);\n const [dragStartValue, setDragStartValue] = useState<number>();\n const [dragValue, setDragValue] = useState<number>();\n const [isDragging, setIsDragging] = useState(false);\n const isMouseDownRef = useRef(false);\n const toggleRef = useRef<HTMLDivElement>(null);\n const togglePositionRef = useRef<DOMRect>();\n\n const shownValue = isDragging ? dragValue : value;\n\n const styleVars = usePositionStyles({\n axis,\n extremeType,\n });\n\n const isVertical = !axis.horiz;\n\n const actualFormatter = formatValue \|\| defaultValueFormatter;\n\n const deltaDragToDeltaValue = useCallback(\n (deltaDrag: number) =>\n typeof dragDeltaValue === 'number'\n ? Math.floor(deltaDrag / (dragDeltaValue \|\| 1))\n : dragDeltaValue(deltaDrag),\n [dragDeltaValue]\n );\n\n const actualValidate = useCallback(\n (value: number) => validate(value, { axis, extremeType }),\n [axis, extremeType, validate]\n );\n\n const startEditing = useCallback(() => {\n isMouseDownRef.current = false;\n setIsEditing(true);\n }, []);\n\n const stopEditing = useCallback(() => {\n isMouseDownRef.current = false;\n setIsEditing(false);\n }, []);\n\n const onInputEditEnd = useCallback(\n (newValue?: number) => {\n if (newValue !== undefined) {\n onChange?.(newValue, { axis, extremeType });\n }\n stopEditing();\n },\n [axis, extremeType, onChange, stopEditing]\n );\n\n const onMouseDown = useCallback<MouseEventHandler>(e => {\n e.preventDefault();\n togglePositionRef.current = undefined;\n isMouseDownRef.current = true;\n }, []);\n\n const onChangeWithOptions = useCallback(\n (newValue: number) => {\n onChange?.(newValue, { axis, extremeType });\n },\n [axis, extremeType, onChange]\n );\n\n const throttledOnChange = useMemo(\n () =>\n throttle((newValue: number) => {\n onChangeWithOptions(newValue);\n }, 300),\n [onChangeWithOptions]\n );\n\n const onDragEnd = useCallback(() => {\n isMouseDownRef.current = false;\n setDragValue(undefined);\n setDragStartValue(undefined);\n setIsDragging(false);\n throttledOnChange.flush();\n }, [throttledOnChange]);\n\n const onDragStart = useCallback(() => {\n if (isMouseDownRef.current && !isEditing && !isDragging) {\n setDragValue(shownValue);\n setDragStartValue(shownValue);\n setIsDragging(true);\n }\n }, [isDragging, isEditing, shownValue]);\n\n const onDrag = useCallback(\n (event: MouseEvent) => {\n if (!toggleRef.current \|\| !axis \|\| dragStartValue === undefined) {\n return;\n }\n\n if (!togglePositionRef.current) {\n togglePositionRef.current = toggleRef.current?.getBoundingClientRect();\n }\n\n // if (isVertical) {\n const { clientY, clientX } = event;\n const { y, height, x, width } = togglePositionRef.current;\n\n // Delta is counted from toggle's edge\n const deltaDrag = isVertical\n ? getDeltaDrag(clientY, y, height)\n : -getDeltaDrag(clientX, x, width);\n\n const newValue = dragStartValue + deltaDragToDeltaValue(deltaDrag);\n\n if (!actualValidate(newValue)) {\n return;\n }\n\n setDragValue(newValue);\n throttledOnChange(newValue);\n },\n [actualValidate, axis, deltaDragToDeltaValue, dragStartValue, isVertical, throttledOnChange]\n );\n\n // Cleanup of throttled onChange\n useEffect(() => () => throttledOnChange.cancel(), [throttledOnChange]);\n\n if (shownValue === undefined \|\| !axis) {\n return null;\n }\n\n return (\n <div className={classNames(styles.root, className)} style={styleVars} data-testid={testId}>\n {/ Can't put inside content element due to a bug with transform & position: fixed /}\n {/ Therefore, most of the drag logic is not in ChartAxisExtremeDragTracker but hoisted here */}\n <ChartAxisExtremeDragTracker\n isDragging={isDragging}\n onDragEnd={onDragEnd}\n onDrag={onDrag}\n isVertical={isVertical}\n />\n\n <div\n className={styles.content}\n onMouseDown={onMouseDown}\n onMouseLeave={onDragStart}\n onClick={startEditing}\n ref={toggleRef}\n >\n <div\n className={classNames(\n styles.valueContainer,\n isEditing && styles.isEditing,\n isVertical && styles.vertical\n )}\n >\n {isVertical ? (\n <UpIcon size={Number(styles.arrowsSize)} className={styles.valueArrow} />\n ) : (\n <LeftIcon size={Number(styles.arrowsSize)} className={styles.valueArrow} />\n )}\n <div className={styles.value}>{actualFormatter(shownValue)}</div>\n {isVertical ? (\n <DownIcon size={Number(styles.arrowsSize)} className={styles.valueArrow} />\n ) : (\n <RightIcon size={Number(styles.arrowsSize)} className={styles.valueArrow} />\n )}\n </div>\n\n <ChartAxisExtremeInput\n value={shownValue}\n isEditing={isEditing}\n onEditEnd={onInputEditEnd}\n validate={actualValidate}\n isVertical={isVertical}\n />\n </div>\n </div>\n );\n};\n"],"names":["ChartAxisExtreme","_ref","axis","testId","className","formatValue","value","_ref$dragDeltaValue","dragDeltaValue","onChange","extremeType","_ref$validate","validate","defaultValueValidator","useState","_useState2","_slicedToArray","_useState","isEditing","setIsEditing","_useState3","_useState4","dragStartValue","setDragStartValue","_useState5","_useState6","dragValue","setDragValue","_useState8","_useState7","isDragging","setIsDragging","isMouseDownRef","useRef","toggleRef","togglePositionRef","shownValue","styleVars","usePositionStyles","isVertical","horiz","actualFormatter","defaultValueFormatter","deltaDragToDeltaValue","useCallback","deltaDrag","Math","floor","actualValidate","startEditing","current","stopEditing","onInputEditEnd","newValue","undefined","onMouseDown","e","preventDefault","onChangeWithOptions","throttledOnChange","useMemo","throttle","onDragEnd","flush","onDragStart","onDrag","event","_toggleRef$current","getBoundingClientRect","clientY","clientX","y","height","x","width","getDeltaDrag","useEffect","cancel","_jsxs","classNames","styles","root","style","children","_jsx","ChartAxisExtremeDragTracker","content","onMouseLeave","onClick","ref","valueContainer","vertical","UpIcon","LeftIcon","size","Number","arrowsSize","valueArrow","DownIcon","RightIcon","ChartAxisExtremeInput","onEditEnd"],"mappings":"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"}
1	+ {"version":3,"file":"ChartAxisExtreme.js","sources":["../../../src/componentsV2/ChartAxisExtreme/ChartAxisExtreme.tsx"],"sourcesContent":["import { Axis } from 'highcharts';\nimport classNames from 'classnames';\nimport { MouseEventHandler, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { throttle } from 'lodash';\n\nimport { ChartAxisExtremeInput } from './ChartAxisExtremeInput';\nimport {\n AxisExtremeType,\n ChartAxisExtremeChangeHandler,\n ChartAxisExtremeValidator,\n defaultValueFormatter,\n defaultValueValidator,\n getDeltaDrag,\n usePositionStyles,\n} from './utils';\nimport { ChartAxisExtremeDragTracker } from './ChartAxisExtremeDragTracker';\n\nimport styles from './ChartAxisExtreme.scss';\n\nimport { DownIcon, LeftIcon, RightIcon, UpIcon } from '~/icons';\n\nexport type ChartAxisExtremeProps = {\n value: number;\n onChange?: ChartAxisExtremeChangeHandler;\n formatValue?: (value: number) => string \| number;\n\n axis: Axis;\n extremeType: AxisExtremeType;\n\n /*\n Validates possible value on both manual input & drag actions\n /\n validate?: ChartAxisExtremeValidator;\n\n /\n Governs \"sensitivity\" of drag.\n * A number indicates how many pixels should a user drag to change axis extreme by 1.\n * A function accepts dragged distance in pixels and returns how much value should change.\n * Generally, positive input should generate positive output. Can be used in conjunction with `validate` prop to force min/max value when dragging\n /\n dragDeltaValue?: number \| ((deltaPixels: number) => number);\n\n className?: string;\n testId?: string;\n};\n\n// When making ChartWrapper2 - this component needs to hook into Highcharts' render cycle to automatically reposition itself\nexport const ChartAxisExtreme = ({\n axis,\n testId,\n className,\n formatValue, // No default here because it puts default function's code in storybook for some reason\n value,\n dragDeltaValue = 5,\n onChange,\n extremeType,\n validate = defaultValueValidator,\n}: ChartAxisExtremeProps) => {\n const [isEditing, setIsEditing] = useState(false);\n const [dragStartValue, setDragStartValue] = useState<number>();\n const [dragValue, setDragValue] = useState<number>();\n const [isDragging, setIsDragging] = useState(false);\n const isMouseDownRef = useRef(false);\n const toggleRef = useRef<HTMLDivElement>(null);\n const togglePositionRef = useRef<DOMRect>();\n\n const shownValue = isDragging ? dragValue : value;\n\n const styleVars = usePositionStyles({\n axis,\n extremeType,\n });\n\n const isVertical = !axis.horiz;\n\n const actualFormatter = formatValue \|\| defaultValueFormatter;\n\n const deltaDragToDeltaValue = useCallback(\n (deltaDrag: number) =>\n typeof dragDeltaValue === 'number'\n ? Math.floor(deltaDrag / (dragDeltaValue \|\| 1))\n : dragDeltaValue(deltaDrag),\n [dragDeltaValue]\n );\n\n const actualValidate = useCallback(\n (value: number) => validate(value, { axis, extremeType }),\n [axis, extremeType, validate]\n );\n\n const startEditing = useCallback(() => {\n isMouseDownRef.current = false;\n setIsEditing(true);\n }, []);\n\n const stopEditing = useCallback(() => {\n isMouseDownRef.current = false;\n setIsEditing(false);\n }, []);\n\n const onInputEditEnd = useCallback(\n (newValue?: number) => {\n if (newValue !== undefined) {\n onChange?.(newValue, { axis, extremeType });\n }\n stopEditing();\n },\n [axis, extremeType, onChange, stopEditing]\n );\n\n const onMouseDown = useCallback<MouseEventHandler>(e => {\n e.preventDefault();\n togglePositionRef.current = undefined;\n isMouseDownRef.current = true;\n }, []);\n\n const onChangeWithOptions = useCallback(\n (newValue: number) => {\n onChange?.(newValue, { axis, extremeType });\n },\n [axis, extremeType, onChange]\n );\n\n const throttledOnChange = useMemo(\n () =>\n throttle((newValue: number) => {\n onChangeWithOptions(newValue);\n }, 300),\n [onChangeWithOptions]\n );\n\n const onDragEnd = useCallback(() => {\n isMouseDownRef.current = false;\n setDragValue(undefined);\n setDragStartValue(undefined);\n setIsDragging(false);\n throttledOnChange.flush();\n }, [throttledOnChange]);\n\n const onDragStart = useCallback(() => {\n if (isMouseDownRef.current && !isEditing && !isDragging) {\n setDragValue(shownValue);\n setDragStartValue(shownValue);\n setIsDragging(true);\n }\n }, [isDragging, isEditing, shownValue]);\n\n const onDrag = useCallback(\n (event: MouseEvent) => {\n if (!toggleRef.current \|\| !axis \|\| dragStartValue === undefined) {\n return;\n }\n\n if (!togglePositionRef.current) {\n togglePositionRef.current = toggleRef.current?.getBoundingClientRect();\n }\n\n // if (isVertical) {\n const { clientY, clientX } = event;\n const { y, height, x, width } = togglePositionRef.current;\n\n // Delta is counted from toggle's edge\n const deltaDrag = isVertical\n ? getDeltaDrag(clientY, y, height)\n : -getDeltaDrag(clientX, x, width);\n\n const newValue = dragStartValue + deltaDragToDeltaValue(deltaDrag);\n\n if (!actualValidate(newValue)) {\n return;\n }\n\n setDragValue(newValue);\n throttledOnChange(newValue);\n },\n [actualValidate, axis, deltaDragToDeltaValue, dragStartValue, isVertical, throttledOnChange]\n );\n\n // Cleanup of throttled onChange\n useEffect(() => () => throttledOnChange.cancel(), [throttledOnChange]);\n\n if (shownValue === undefined \|\| !axis) {\n return null;\n }\n\n return (\n <div className={classNames(styles.root, className)} style={styleVars} data-testid={testId}>\n {/ Can't put inside content element due to a bug with transform & position: fixed /}\n {/ Therefore, most of the drag logic is not in ChartAxisExtremeDragTracker but hoisted here */}\n <ChartAxisExtremeDragTracker\n isDragging={isDragging}\n onDragEnd={onDragEnd}\n onDrag={onDrag}\n isVertical={isVertical}\n />\n\n <div\n className={styles.content}\n onMouseDown={onMouseDown}\n onMouseLeave={onDragStart}\n onClick={startEditing}\n ref={toggleRef}\n >\n <div\n className={classNames(\n styles.valueContainer,\n isEditing && styles.isEditing,\n isVertical && styles.vertical\n )}\n >\n {isVertical ? (\n <UpIcon size={Number(styles.arrowsSize)} className={styles.valueArrow} />\n ) : (\n <LeftIcon size={Number(styles.arrowsSize)} className={styles.valueArrow} />\n )}\n <div className={styles.value}>{actualFormatter(shownValue)}</div>\n {isVertical ? (\n <DownIcon size={Number(styles.arrowsSize)} className={styles.valueArrow} />\n ) : (\n <RightIcon size={Number(styles.arrowsSize)} className={styles.valueArrow} />\n )}\n </div>\n\n <ChartAxisExtremeInput\n value={shownValue}\n isEditing={isEditing}\n onEditEnd={onInputEditEnd}\n validate={actualValidate}\n isVertical={isVertical}\n />\n </div>\n </div>\n );\n};\n"],"names":["ChartAxisExtreme","_ref","axis","testId","className","formatValue","value","_ref$dragDeltaValue","dragDeltaValue","onChange","extremeType","_ref$validate","validate","defaultValueValidator","useState","_useState2","_slicedToArray","_useState","isEditing","setIsEditing","_useState3","_useState4","dragStartValue","setDragStartValue","_useState5","_useState6","dragValue","setDragValue","_useState8","_useState7","isDragging","setIsDragging","isMouseDownRef","useRef","toggleRef","togglePositionRef","shownValue","styleVars","usePositionStyles","isVertical","horiz","actualFormatter","defaultValueFormatter","deltaDragToDeltaValue","useCallback","deltaDrag","Math","floor","actualValidate","startEditing","current","stopEditing","onInputEditEnd","newValue","undefined","onMouseDown","e","preventDefault","onChangeWithOptions","throttledOnChange","useMemo","throttle","onDragEnd","flush","onDragStart","onDrag","event","_toggleRef$current","getBoundingClientRect","clientY","clientX","y","height","x","width","getDeltaDrag","useEffect","cancel","_jsxs","classNames","styles","root","style","children","_jsx","ChartAxisExtremeDragTracker","content","onMouseLeave","onClick","ref","valueContainer","vertical","UpIcon","LeftIcon","size","Number","arrowsSize","valueArrow","DownIcon","RightIcon","ChartAxisExtremeInput","onEditEnd"],"mappings":"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"}

package/componentsV2/Chip/Chip.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import o from"@babel/runtime/helpers/defineProperty";import s from"@babel/runtime/helpers/objectWithoutProperties";import{forwardRef as c,useCallback as i,isValidElement as n,cloneElement as t}from"react";import r from"classnames";import{ChipIndicator as e}from"../ChipIndicator/ChipIndicator.js";import m from"./Chip.scss.js";import{CheckSmallIcon as p,CloseSmallIcon 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/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/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{Tooltip as a}from"../Tooltip/Tooltip.js";import{jsxs as l,jsx as d}from"react/jsx-runtime";var j=["disabled","prefix","suffix","testId","className","children","onClick","onDelete","size","type","state","shape","deleteButtonTooltip"];function I(o,s){var c=Object.keys(o);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(o);s&&(i=i.filter((function(s){return Object.getOwnPropertyDescriptor(o,s).enumerable}))),c.push.apply(c,i)}return c}function f(s){for(var c=1;c<arguments.length;c++){var i=null!=arguments[c]?arguments[c]:{};c%2?I(Object(i),!0).forEach((function(c){o(s,c,i[c])})):Object.getOwnPropertyDescriptors?Object.defineProperties(s,Object.getOwnPropertyDescriptors(i)):I(Object(i)).forEach((function(o){Object.defineProperty(s,o,Object.getOwnPropertyDescriptor(i,o))}))}return s}var h={default:m.filled,outlined:m.outlined},b={medium:m.medium,small:m.small,xs:m.xsmall},C={medium:24,small:16,xs:12},O={neutral:m.neutral,caution:m.caution,info:m.info,error:m.error,pending:m.pending,success:m.success,warning:m.warning},v={round:m.round,square:m.square},P=c((function(o,c){var e=o.disabled,p=o.prefix,I=o.suffix,P=o.testId,g=o.className,x=o.children,y=o.onClick,F=o.onDelete,k=o.size,A=void 0===k?"medium":k,D=o.type,N=void 0===D?"default":D,z=o.state,w=void 0===z?"neutral":z,M=o.shape,S=void 0===M?"round":M,T=o.deleteButtonTooltip,E=s(o,j),R=e?void 0:y,q=i((function(o){o.stopPropagation(),null==F||F(o)}),[F]),B=F&&d("div",{className:m.deleteIcon,children:d(u,{onClick:q,size:16})}),G=B&&T?d(a,{title:T,children:B}):B;return l("div",f(f({className:r(m.root,R&&m.hoverable,e&&m.disabled,p&&m.withPrefix,(F||I)&&m.withSuffix,b[A],h[N],O[w],v[S],g),onClick:R,"data-testid":P,ref:c},E),{},{children:[p&&n(p)?t(p,{size:C[A]}):p,d("div",{className:m.label,children:x}),I&&n(I)?t(I,{size:C[A]}):I,G]}))}));P.Affix={Check:function(o){var s=o.size,c=o.className;return d(p,{size:s,className:r(m.checkAffix,c)})},Dot:function(o){var s=o.className,c=o.color;return d("div",{className:r(m.dotAffix,s),style:{background:c}})},Indicator:function(o){var s=o.size===C.medium?"medium":"small";return d(e,{className:r(m.indicatorAffix,o.className),size:s,children:o.children})}};var g=P;export{g as Chip};
+import o from"@babel/runtime/helpers/defineProperty";import s from"@babel/runtime/helpers/objectWithoutProperties";import{forwardRef as c,useCallback as i,isValidElement as n,cloneElement as t}from"react";import r from"classnames";import{ChipIndicator as e}from"../ChipIndicator/ChipIndicator.js";import m from"./Chip.scss.js";import{CheckSmallIcon as p,CloseSmallIcon 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/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{Tooltip as a}from"../Tooltip/Tooltip.js";import{jsxs as l,jsx as d}from"react/jsx-runtime";var j=["disabled","prefix","suffix","testId","className","children","onClick","onDelete","size","type","state","shape","deleteButtonTooltip"];function I(o,s){var c=Object.keys(o);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(o);s&&(i=i.filter((function(s){return Object.getOwnPropertyDescriptor(o,s).enumerable}))),c.push.apply(c,i)}return c}function f(s){for(var c=1;c<arguments.length;c++){var i=null!=arguments[c]?arguments[c]:{};c%2?I(Object(i),!0).forEach((function(c){o(s,c,i[c])})):Object.getOwnPropertyDescriptors?Object.defineProperties(s,Object.getOwnPropertyDescriptors(i)):I(Object(i)).forEach((function(o){Object.defineProperty(s,o,Object.getOwnPropertyDescriptor(i,o))}))}return s}var h={default:m.filled,outlined:m.outlined},b={medium:m.medium,small:m.small,xs:m.xsmall},C={medium:24,small:16,xs:12},O={neutral:m.neutral,caution:m.caution,info:m.info,error:m.error,pending:m.pending,success:m.success,warning:m.warning},v={round:m.round,square:m.square},P=c((function(o,c){var e=o.disabled,p=o.prefix,I=o.suffix,P=o.testId,g=o.className,x=o.children,y=o.onClick,F=o.onDelete,k=o.size,A=void 0===k?"medium":k,D=o.type,N=void 0===D?"default":D,z=o.state,w=void 0===z?"neutral":z,M=o.shape,S=void 0===M?"round":M,T=o.deleteButtonTooltip,E=s(o,j),R=e?void 0:y,q=i((function(o){o.stopPropagation(),null==F||F(o)}),[F]),B=F&&d("div",{className:m.deleteIcon,children:d(u,{onClick:q,size:16})}),G=B&&T?d(a,{title:T,children:B}):B;return l("div",f(f({className:r(m.root,R&&m.hoverable,e&&m.disabled,p&&m.withPrefix,(F||I)&&m.withSuffix,b[A],h[N],O[w],v[S],g),onClick:R,"data-testid":P,ref:c},E),{},{children:[p&&n(p)?t(p,{size:C[A]}):p,d("div",{className:m.label,children:x}),I&&n(I)?t(I,{size:C[A]}):I,G]}))}));P.Affix={Check:function(o){var s=o.size,c=o.className;return d(p,{size:s,className:r(m.checkAffix,c)})},Dot:function(o){var s=o.className,c=o.color;return d("div",{className:r(m.dotAffix,s),style:{background:c}})},Indicator:function(o){var s=o.size===C.medium?"medium":"small";return d(e,{className:r(m.indicatorAffix,o.className),size:s,children:o.children})}};var g=P;export{g as Chip};
 //# sourceMappingURL=Chip.js.map

package/componentsV2/Chip/Chip.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Chip.js","sources":["../../../src/componentsV2/Chip/Chip.tsx"],"sourcesContent":["import {\n cloneElement,\n ComponentType,\n forwardRef,\n isValidElement,\n MouseEventHandler,\n ReactNode,\n useCallback,\n} from 'react';\nimport classNames from 'classnames';\n\nimport { ChipIndicator } from '../ChipIndicator';\n\nimport styles from './Chip.scss';\n\nimport { CheckSmallIcon, CloseSmallIcon } from '~/icons';\nimport { Tooltip } from '../Tooltip';\n\nexport type ChipProps = {\n /*\n Component contents\n */\n children?: ReactNode;\n prefix?: ReactNode;\n suffix?: ReactNode;\n onClick?: MouseEventHandler;\n onDelete?: MouseEventHandler;\n deleteButtonTooltip?: ReactNode;\n size?: 'xs' \| 'small' \| 'medium';\n type?: 'default' \| 'outlined';\n disabled?: boolean;\n state?: 'neutral' \| 'info' \| 'caution' \| 'warning' \| 'error' \| 'success' \| 'pending';\n shape?: 'round' \| 'square';\n\n className?: string;\n testId?: string;\n};\n\nconst TypeToClassMap: Record<Required<ChipProps>['type'], string> = {\n default: styles.filled,\n outlined: styles.outlined,\n};\n\nconst SizeToClassMap: Record<Required<ChipProps>['size'], string> = {\n medium: styles.medium,\n small: styles.small,\n xs: styles.xsmall,\n};\n\nconst SizeToAffixSizeMap: Record<Required<ChipProps>['size'], number> = {\n medium: 24,\n small: 16,\n xs: 12,\n};\n\nconst StateToClassMap: Record<Required<ChipProps>['state'], string> = {\n neutral: styles.neutral,\n caution: styles.caution,\n info: styles.info,\n error: styles.error,\n pending: styles.pending,\n success: styles.success,\n warning: styles.warning,\n};\n\nconst ShapeToClassMap: Record<Required<ChipProps>['shape'], string> = {\n round: styles.round,\n square: styles.square,\n};\n\nconst ChipBase = forwardRef<HTMLDivElement, ChipProps>(\n (\n {\n disabled,\n prefix,\n suffix,\n testId,\n className,\n children,\n onClick,\n onDelete,\n size = 'medium',\n type = 'default',\n state = 'neutral',\n shape = 'round',\n deleteButtonTooltip,\n // Needed for Tooltip to work\n ...rest\n },\n ref\n ) => {\n const onClickHandler = disabled ? undefined : onClick;\n const onDeleteHandler = useCallback<MouseEventHandler>(\n e => {\n e.stopPropagation();\n onDelete?.(e);\n },\n [onDelete]\n );\n\n const deleteIcon = onDelete && (\n <div className={styles.deleteIcon}>\n <CloseSmallIcon onClick={onDeleteHandler} size={16} />\n </div>\n );\n\n const deleteIconWithTooltip =\n deleteIcon && deleteButtonTooltip ? (\n <Tooltip title={deleteButtonTooltip}>{deleteIcon}</Tooltip>\n ) : (\n deleteIcon\n );\n\n return (\n <div\n className={classNames(\n styles.root,\n onClickHandler && styles.hoverable,\n disabled && styles.disabled,\n prefix && styles.withPrefix,\n (onDelete \|\| suffix) && styles.withSuffix,\n SizeToClassMap[size],\n TypeToClassMap[type],\n StateToClassMap[state],\n ShapeToClassMap[shape],\n className\n )}\n onClick={onClickHandler}\n data-testid={testId}\n ref={ref}\n {...rest}\n >\n {prefix && isValidElement(prefix)\n ? cloneElement(prefix, { size: SizeToAffixSizeMap[size] } as object)\n : prefix}\n\n <div className={styles.label}>{children}</div>\n\n {suffix && isValidElement(suffix)\n ? cloneElement(suffix, { size: SizeToAffixSizeMap[size] } as object)\n : suffix}\n\n {deleteIconWithTooltip}\n </div>\n );\n }\n);\n\ntype ChipType = typeof ChipBase & {\n Affix: {\n Check: ComponentType<{ className?: string }>;\n Indicator: ComponentType<{ className?: string; children?: ReactNode }>;\n Dot: ComponentType<{ className?: string; color?: string }>;\n };\n};\n\n(ChipBase as ChipType).Affix = {\n Check: ({ size, className }: { size?: number; className?: string }) => (\n <CheckSmallIcon size={size} className={classNames(styles.checkAffix, className)} />\n ),\n Dot: ({ className, color }) => (\n <div className={classNames(styles.dotAffix, className)} style={{ background: color }} />\n ),\n Indicator: (props: { size?: number; className?: string; children?: ReactNode }) => {\n const actualSize = props.size === SizeToAffixSizeMap.medium ? 'medium' : 'small';\n return (\n <ChipIndicator\n className={classNames(styles.indicatorAffix, props.className)}\n size={actualSize}\n >\n {props.children}\n </ChipIndicator>\n );\n },\n};\n\nexport const Chip = ChipBase as ChipType;\n"],"names":["TypeToClassMap","default","styles","filled","outlined","SizeToClassMap","medium","small","xs","xsmall","SizeToAffixSizeMap","StateToClassMap","neutral","caution","info","error","pending","success","warning","ShapeToClassMap","round","square","ChipBase","forwardRef","_ref","ref","disabled","prefix","suffix","testId","className","children","onClick","onDelete","_ref$size","size","_ref$type","type","_ref$state","state","_ref$shape","shape","deleteButtonTooltip","rest","_objectWithoutProperties","_excluded","onClickHandler","undefined","onDeleteHandler","useCallback","e","stopPropagation","deleteIcon","_jsx","CloseSmallIcon","deleteIconWithTooltip","Tooltip","title","_jsxs","_objectSpread","classNames","root","hoverable","withPrefix","withSuffix","isValidElement","cloneElement","label","Affix","Check","_ref2","CheckSmallIcon","checkAffix","Dot","_ref3","color","dotAffix","style","background","Indicator","props","actualSize","ChipIndicator","indicatorAffix","Chip"],"mappings":"~~yxJAsCA~~,IAAMA,EAA8D,CAClEC,QAASC,EAAOC,OAChBC,SAAUF,EAAOE,UAGbC,EAA8D,CAClEC,OAAQJ,EAAOI,OACfC,MAAOL,EAAOK,MACdC,GAAIN,EAAOO,QAGPC,EAAkE,CACtEJ,OAAQ,GACRC,MAAO,GACPC,GAAI,IAGAG,EAAgE,CACpEC,QAASV,EAAOU,QAChBC,QAASX,EAAOW,QAChBC,KAAMZ,EAAOY,KACbC,MAAOb,EAAOa,MACdC,QAASd,EAAOc,QAChBC,QAASf,EAAOe,QAChBC,QAAShB,EAAOgB,SAGZC,EAAgE,CACpEC,MAAOlB,EAAOkB,MACdC,OAAQnB,EAAOmB,QAGXC,EAAWC,GACf,SAAAC,EAkBEC,GACG,IAjBDC,IAAAA,SACAC,IAAAA,OACAC,IAAAA,OACAC,IAAAA,OACAC,IAAAA,UACAC,IAAAA,SACAC,IAAAA,QACAC,IAAAA,SAAQC,EAAAV,EACRW,KAAAA,aAAO,SAAQD,EAAAE,EAAAZ,EACfa,KAAAA,aAAO,UAASD,EAAAE,EAAAd,EAChBe,MAAAA,aAAQ,UAASD,EAAAE,EAAAhB,EACjBiB,MAAAA,aAAQ,QAAOD,EACfE,IAAAA,oBAEGC,EAAIC,EAAApB,EAAAqB,GAIHC,EAAiBpB,OAAWqB,EAAYf,EACxCgB,EAAkBC,GACtB,SAAAC,GACEA,EAAEC,kBACFlB,SAAAA,EAAWiB,EACb,GACA,CAACjB,IAGGmB,EAAanB,GACjBoB,EAAA,MAAA,CAAKvB,UAAW5B,EAAOkD,WAAWrB,SAChCsB,EAACC,EAAc,CAACtB,QAASgB,EAAiBb,KAAM,OAI9CoB,EACJH,GAAcV,EACZW,EAACG,EAAO,CAACC,MAAOf,EAAoBX,SAAEqB,IAEtCA,EAGJ,OACEM,EAAA,MAAAC,EAAAA,EAAA,CACE7B,UAAW8B,EACT1D,EAAO2D,KACPf,GAAkB5C,EAAO4D,UACzBpC,GAAYxB,EAAOwB,SACnBC,GAAUzB,EAAO6D,YAChB9B,GAAYL,IAAW1B,EAAO8D,WAC/B3D,EAAe8B,GACfnC,EAAeqC,GACf1B,EAAgB4B,GAChBpB,EAAgBsB,GAChBX,GAEFE,QAASc,EACT,cAAajB,EACbJ,IAAKA,GACDkB,GAAI,GAAA,CAAAZ,SAEPJ,CAAAA,GAAUsC,EAAetC,GACtBuC,EAAavC,EAAQ,CAAEQ,KAAMzB,EAAmByB,KAChDR,EAEJ0B,EAAA,MAAA,CAAKvB,UAAW5B,EAAOiE,MAAMpC,SAAEA,IAE9BH,GAAUqC,EAAerC,GACtBsC,EAAatC,EAAQ,CAAEO,KAAMzB,EAAmByB,KAChDP,EAEH2B,KAGP,IAWDjC,EAAsB8C,MAAQ,CAC7BC,MAAO,SAAAC,GAAA,IAAGnC,IAAAA,KAAML,IAAAA,UAAS,OACvBuB,EAACkB,EAAc,CAACpC,KAAMA,EAAML,UAAW8B,EAAW1D,EAAOsE,WAAY1C,IACtE,EACD2C,IAAK,SAAAC,GAAA,IAAG5C,IAAAA,UAAW6C,IAAAA,MAAK,OACtBtB,EAAA,MAAA,CAAKvB,UAAW8B,EAAW1D,EAAO0E,SAAU9C,GAAY+C,MAAO,CAAEC,WAAYH,IAC9E,EACDI,UAAW,SAACC,GACV,IAAMC,EAAaD,EAAM7C,OAASzB,EAAmBJ,OAAS,SAAW,QACzE,OACE+C,EAAC6B,EAAa,CACZpD,UAAW8B,EAAW1D,EAAOiF,eAAgBH,EAAMlD,WACnDK,KAAM8C,EAAWlD,SAEhBiD,EAAMjD,UAGb,GAGK,IAAMqD,EAAO9D"}
1	+ {"version":3,"file":"Chip.js","sources":["../../../src/componentsV2/Chip/Chip.tsx"],"sourcesContent":["import {\n cloneElement,\n ComponentType,\n forwardRef,\n isValidElement,\n MouseEventHandler,\n ReactNode,\n useCallback,\n} from 'react';\nimport classNames from 'classnames';\n\nimport { ChipIndicator } from '../ChipIndicator';\n\nimport styles from './Chip.scss';\n\nimport { CheckSmallIcon, CloseSmallIcon } from '~/icons';\nimport { Tooltip } from '../Tooltip';\n\nexport type ChipProps = {\n /*\n Component contents\n */\n children?: ReactNode;\n prefix?: ReactNode;\n suffix?: ReactNode;\n onClick?: MouseEventHandler;\n onDelete?: MouseEventHandler;\n deleteButtonTooltip?: ReactNode;\n size?: 'xs' \| 'small' \| 'medium';\n type?: 'default' \| 'outlined';\n disabled?: boolean;\n state?: 'neutral' \| 'info' \| 'caution' \| 'warning' \| 'error' \| 'success' \| 'pending';\n shape?: 'round' \| 'square';\n\n className?: string;\n testId?: string;\n};\n\nconst TypeToClassMap: Record<Required<ChipProps>['type'], string> = {\n default: styles.filled,\n outlined: styles.outlined,\n};\n\nconst SizeToClassMap: Record<Required<ChipProps>['size'], string> = {\n medium: styles.medium,\n small: styles.small,\n xs: styles.xsmall,\n};\n\nconst SizeToAffixSizeMap: Record<Required<ChipProps>['size'], number> = {\n medium: 24,\n small: 16,\n xs: 12,\n};\n\nconst StateToClassMap: Record<Required<ChipProps>['state'], string> = {\n neutral: styles.neutral,\n caution: styles.caution,\n info: styles.info,\n error: styles.error,\n pending: styles.pending,\n success: styles.success,\n warning: styles.warning,\n};\n\nconst ShapeToClassMap: Record<Required<ChipProps>['shape'], string> = {\n round: styles.round,\n square: styles.square,\n};\n\nconst ChipBase = forwardRef<HTMLDivElement, ChipProps>(\n (\n {\n disabled,\n prefix,\n suffix,\n testId,\n className,\n children,\n onClick,\n onDelete,\n size = 'medium',\n type = 'default',\n state = 'neutral',\n shape = 'round',\n deleteButtonTooltip,\n // Needed for Tooltip to work\n ...rest\n },\n ref\n ) => {\n const onClickHandler = disabled ? undefined : onClick;\n const onDeleteHandler = useCallback<MouseEventHandler>(\n e => {\n e.stopPropagation();\n onDelete?.(e);\n },\n [onDelete]\n );\n\n const deleteIcon = onDelete && (\n <div className={styles.deleteIcon}>\n <CloseSmallIcon onClick={onDeleteHandler} size={16} />\n </div>\n );\n\n const deleteIconWithTooltip =\n deleteIcon && deleteButtonTooltip ? (\n <Tooltip title={deleteButtonTooltip}>{deleteIcon}</Tooltip>\n ) : (\n deleteIcon\n );\n\n return (\n <div\n className={classNames(\n styles.root,\n onClickHandler && styles.hoverable,\n disabled && styles.disabled,\n prefix && styles.withPrefix,\n (onDelete \|\| suffix) && styles.withSuffix,\n SizeToClassMap[size],\n TypeToClassMap[type],\n StateToClassMap[state],\n ShapeToClassMap[shape],\n className\n )}\n onClick={onClickHandler}\n data-testid={testId}\n ref={ref}\n {...rest}\n >\n {prefix && isValidElement(prefix)\n ? cloneElement(prefix, { size: SizeToAffixSizeMap[size] } as object)\n : prefix}\n\n <div className={styles.label}>{children}</div>\n\n {suffix && isValidElement(suffix)\n ? cloneElement(suffix, { size: SizeToAffixSizeMap[size] } as object)\n : suffix}\n\n {deleteIconWithTooltip}\n </div>\n );\n }\n);\n\ntype ChipType = typeof ChipBase & {\n Affix: {\n Check: ComponentType<{ className?: string }>;\n Indicator: ComponentType<{ className?: string; children?: ReactNode }>;\n Dot: ComponentType<{ className?: string; color?: string }>;\n };\n};\n\n(ChipBase as ChipType).Affix = {\n Check: ({ size, className }: { size?: number; className?: string }) => (\n <CheckSmallIcon size={size} className={classNames(styles.checkAffix, className)} />\n ),\n Dot: ({ className, color }) => (\n <div className={classNames(styles.dotAffix, className)} style={{ background: color }} />\n ),\n Indicator: (props: { size?: number; className?: string; children?: ReactNode }) => {\n const actualSize = props.size === SizeToAffixSizeMap.medium ? 'medium' : 'small';\n return (\n <ChipIndicator\n className={classNames(styles.indicatorAffix, props.className)}\n size={actualSize}\n >\n {props.children}\n </ChipIndicator>\n );\n },\n};\n\nexport const Chip = ChipBase as ChipType;\n"],"names":["TypeToClassMap","default","styles","filled","outlined","SizeToClassMap","medium","small","xs","xsmall","SizeToAffixSizeMap","StateToClassMap","neutral","caution","info","error","pending","success","warning","ShapeToClassMap","round","square","ChipBase","forwardRef","_ref","ref","disabled","prefix","suffix","testId","className","children","onClick","onDelete","_ref$size","size","_ref$type","type","_ref$state","state","_ref$shape","shape","deleteButtonTooltip","rest","_objectWithoutProperties","_excluded","onClickHandler","undefined","onDeleteHandler","useCallback","e","stopPropagation","deleteIcon","_jsx","CloseSmallIcon","deleteIconWithTooltip","Tooltip","title","_jsxs","_objectSpread","classNames","root","hoverable","withPrefix","withSuffix","isValidElement","cloneElement","label","Affix","Check","_ref2","CheckSmallIcon","checkAffix","Dot","_ref3","color","dotAffix","style","background","Indicator","props","actualSize","ChipIndicator","indicatorAffix","Chip"],"mappings":"m4JAsCA,IAAMA,EAA8D,CAClEC,QAASC,EAAOC,OAChBC,SAAUF,EAAOE,UAGbC,EAA8D,CAClEC,OAAQJ,EAAOI,OACfC,MAAOL,EAAOK,MACdC,GAAIN,EAAOO,QAGPC,EAAkE,CACtEJ,OAAQ,GACRC,MAAO,GACPC,GAAI,IAGAG,EAAgE,CACpEC,QAASV,EAAOU,QAChBC,QAASX,EAAOW,QAChBC,KAAMZ,EAAOY,KACbC,MAAOb,EAAOa,MACdC,QAASd,EAAOc,QAChBC,QAASf,EAAOe,QAChBC,QAAShB,EAAOgB,SAGZC,EAAgE,CACpEC,MAAOlB,EAAOkB,MACdC,OAAQnB,EAAOmB,QAGXC,EAAWC,GACf,SAAAC,EAkBEC,GACG,IAjBDC,IAAAA,SACAC,IAAAA,OACAC,IAAAA,OACAC,IAAAA,OACAC,IAAAA,UACAC,IAAAA,SACAC,IAAAA,QACAC,IAAAA,SAAQC,EAAAV,EACRW,KAAAA,aAAO,SAAQD,EAAAE,EAAAZ,EACfa,KAAAA,aAAO,UAASD,EAAAE,EAAAd,EAChBe,MAAAA,aAAQ,UAASD,EAAAE,EAAAhB,EACjBiB,MAAAA,aAAQ,QAAOD,EACfE,IAAAA,oBAEGC,EAAIC,EAAApB,EAAAqB,GAIHC,EAAiBpB,OAAWqB,EAAYf,EACxCgB,EAAkBC,GACtB,SAAAC,GACEA,EAAEC,kBACFlB,SAAAA,EAAWiB,EACb,GACA,CAACjB,IAGGmB,EAAanB,GACjBoB,EAAA,MAAA,CAAKvB,UAAW5B,EAAOkD,WAAWrB,SAChCsB,EAACC,EAAc,CAACtB,QAASgB,EAAiBb,KAAM,OAI9CoB,EACJH,GAAcV,EACZW,EAACG,EAAO,CAACC,MAAOf,EAAoBX,SAAEqB,IAEtCA,EAGJ,OACEM,EAAA,MAAAC,EAAAA,EAAA,CACE7B,UAAW8B,EACT1D,EAAO2D,KACPf,GAAkB5C,EAAO4D,UACzBpC,GAAYxB,EAAOwB,SACnBC,GAAUzB,EAAO6D,YAChB9B,GAAYL,IAAW1B,EAAO8D,WAC/B3D,EAAe8B,GACfnC,EAAeqC,GACf1B,EAAgB4B,GAChBpB,EAAgBsB,GAChBX,GAEFE,QAASc,EACT,cAAajB,EACbJ,IAAKA,GACDkB,GAAI,GAAA,CAAAZ,SAEPJ,CAAAA,GAAUsC,EAAetC,GACtBuC,EAAavC,EAAQ,CAAEQ,KAAMzB,EAAmByB,KAChDR,EAEJ0B,EAAA,MAAA,CAAKvB,UAAW5B,EAAOiE,MAAMpC,SAAEA,IAE9BH,GAAUqC,EAAerC,GACtBsC,EAAatC,EAAQ,CAAEO,KAAMzB,EAAmByB,KAChDP,EAEH2B,KAGP,IAWDjC,EAAsB8C,MAAQ,CAC7BC,MAAO,SAAAC,GAAA,IAAGnC,IAAAA,KAAML,IAAAA,UAAS,OACvBuB,EAACkB,EAAc,CAACpC,KAAMA,EAAML,UAAW8B,EAAW1D,EAAOsE,WAAY1C,IACtE,EACD2C,IAAK,SAAAC,GAAA,IAAG5C,IAAAA,UAAW6C,IAAAA,MAAK,OACtBtB,EAAA,MAAA,CAAKvB,UAAW8B,EAAW1D,EAAO0E,SAAU9C,GAAY+C,MAAO,CAAEC,WAAYH,IAC9E,EACDI,UAAW,SAACC,GACV,IAAMC,EAAaD,EAAM7C,OAASzB,EAAmBJ,OAAS,SAAW,QACzE,OACE+C,EAAC6B,EAAa,CACZpD,UAAW8B,EAAW1D,EAAOiF,eAAgBH,EAAMlD,WACnDK,KAAM8C,EAAWlD,SAEhBiD,EAAMjD,UAGb,GAGK,IAAMqD,EAAO9D"}

package/componentsV2/ColorPicker/ColorPicker.js CHANGED Viewed

@@ -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 i,useState as c,useRef as t,useCallback as r,useEffect as e}from"react";import{ChromePicker as a}from"react-color";import{throttle as l}from"lodash";import{v4 as m}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 f}from"../Popper/Popper.js";import{Swatches as I}from"./Swatches/Swatches.js";import{parseColor as b,channelsToHex as h,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 k,PickerIcon as P}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/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/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 N,jsx as x}from"react/jsx-runtime";function A(o,n){var s=Object.keys(o);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(o);n&&(i=i.filter((function(n){return Object.getOwnPropertyDescriptor(o,n).enumerable}))),s.push.apply(s,i)}return s}function F(o){for(var s=1;s<arguments.length;s++){var i=null!=arguments[s]?arguments[s]:{};s%2?A(Object(i),!0).forEach((function(s){n(o,s,i[s])})):Object.getOwnPropertyDescriptors?Object.defineProperties(o,Object.getOwnPropertyDescriptors(i)):A(Object(i)).forEach((function(n){Object.defineProperty(o,n,Object.getOwnPropertyDescriptor(i,n))}))}return o}var S={small:O.small,medium:O.medium,large:O.large},w=function(n){var A=n.format,w=void 0===A?"hex":A,T=n.className,E=n.label,M=n.labelPlacement,B=void 0===M?"top":M,z=n.popoverPlacement,R=void 0===z?"bottom-start":z,W=n.testId,L=n.disabled,G=n.size,K=void 0===G?"small":G,U=n.onOpen,q=n.onClose,V=n.value,H=void 0===V?C:V,Z=n.onChange,J=n.disableOpacityDrag,Q=n.enableAlpha,X=void 0!==Q&&Q,Y=n.elementsClassNames,$=void 0===Y?{}:Y,_=i((function(){return{input:s(O.input,$.input),inputContainer:s(O.inputContainer,$.inputContainer),label:s(O.label,$.label),prefix:O.prefixContainer,suffix:O.suffixContainer,numberStepButtons:O.numberStepButtons}}),[$.input,$.inputContainer,$.label]),oo=i((function(){try{var o=b(H);return F(F({},o),{},{a:X?o.a:1})}catch(o){return b(C)}}),[H,X]),no=c(!1),so=o(no,2),io=so[0],co=so[1],to=t(null),ro=t(null),eo=c(!0),ao=o(eo,2),lo=ao[0],mo=ao[1],uo=c(null),po=o(uo,2),jo=po[0],fo=po[1],Io=c(oo),bo=o(Io,2),ho=bo[0],vo=bo[1],Co=t(null),yo=i((function(){return"corva-color-picker-".concat(m())}),[]),go="".concat(yo,"-opacity-input"),Oo="".concat(yo,"-label"),ko="".concat(yo,"-opacity-label"),Po=Boolean(E),Do=r((function(){co(!0),null==U||U()}),[U]),No=r((function(o){o.preventDefault(),fo(null),Do()}),[Do]),xo=r((function(){fo(null),Do()}),[Do]),Ao=r((function(o){L||"Enter"!==o.key&&" "!==o.key&&"ArrowDown"!==o.key||(o.preventDefault(),fo("palette"),Do())}),[L,Do]),Fo=r((function(){var o,n,s=!(null===(o=Co.current)||void 0===o||!o.contains(document.activeElement));(fo(null),co(!1),null==q||q(),s)&&(null===(n=ro.current)||void 0===n||n.focus({preventScroll:!0}))}),[q]),So=r((function(o){fo(0===o.detail?"palette":null),mo(!0)}),[]),wo=r((function(o){fo(0===o.detail?"picker":null),mo(!1)}),[]),To=r((function(){return fo(null)}),[]),Eo=r((function(o){return vo(o.rgb)}),[]),Mo=r((function(o){var n="hex"===w?h(o,X):v(o,X);null==Z||Z(n)}),[w,Z,X]),Bo=r((function(o){vo(o),Mo(o)}),[Mo]),zo=g({color:ho,enableAlpha:X,isActive:!lo,onChange:Bo}),Ro=zo.pickerRef,Wo=zo.onKeyDown;e((function(){var o;if("picker"===jo&&!lo){var n=null===(o=Ro.current)||void 0===o?void 0:o.querySelector('[data-color-picker-control="saturation"]');n&&(n.focus({preventScroll:!0}),To())}}),[To,jo,lo,Ro]);var Lo=r((function(o){var n=Number(o);if(!(Number.isNaN(n)||n<0||n>100)){var s=F(F({},oo),{},{a:n/100});Mo(s)}}),[oo,Mo]),Go=r((function(o){Mo(o.rgb)}),[Mo]),Ko=r((function(o){var n=oo.a||1,s=X&&0===o.a?0:n;Mo(F(F({},o),{},{a:s}))}),[Mo,oo.a,X]),Uo=r((function(){setTimeout((function(){var o,n;co(!1),null===(o=document.activeElement)||void 0===o||null===(n=o.blur)||void 0===n||n.call(o)}),0)}),[]),qo=i((function(){return l((function(o){var n=String(Math.round(o));Lo(n)}),100)}),[Lo]);e((function(){vo(oo)}),[oo]),e((function(){io&&mo(!0)}),[io]);var Vo=String(Math.round(100*ho.a)),Ho=(null==R?void 0:R.startsWith("top"))||(null==R?void 0:R.startsWith("bottom")),Zo=(null==R?void 0:R.startsWith("left"))||(null==R?void 0:R.startsWith("right")),Jo=Po?D(N,{children:[x("label",{id:Oo,htmlFor:go,children:"string"==typeof E?x(u.Label,{children:E}):E}),x("span",{id:ko,hidden:!0,children:"Opacity"})]}):void 0,Qo=i((function(){return Po?{id:go,"aria-labelledby":"".concat(Oo," ").concat(ko)}:{id:go,"aria-label":"Opacity"}}),[Po,go,Oo,ko]);return D(N,{children:[x(u,{label:Jo,labelPlacement:B,disabled:L,size:K,rootTagName:"div",prefix:D(N,{children:[D("div",{className:O.fakeValue,children:[Vo,x("span",{className:O.fakeValuePercent,children:"%"})]}),x("div",{ref:ro,className:s(O.indicator,0===ho.a&&O.transparent,$.indicator),style:{"--corvaui-colorpicker-indicatorcolor":h(ho,!1)},onClick:L?void 0:No,onKeyDown:Ao,role:"button","aria-label":Po?void 0:"Color picker","aria-labelledby":Po?Oo:void 0,"aria-expanded":io,"aria-disabled":L,tabIndex:L?-1:0})]}),suffix:!io&&X&&!J&&!L&&x(y,{value:Number(Vo),onDrag:qo,onDragEnd:Uo}),className:s(O.root,S[K],!X&&O.noAlpha,T),testId:W,inputContainerRef:to,value:Vo,onChange:Lo,onFocus:xo,inputType:"number",inputMode:"numeric",htmlAttributes:Qo,elementsClassNames:_}),D(p,{ref:Co,anchorEl:to.current,open:io,onClose:Fo,placement:R,className:s(O.popover,Ho&&O.marginVertical,Zo&&O.marginHorizontal,0===ho.a&&O.isTransparent,$.popover),children:[lo?x(I,{onChange:Ko,value:oo,addTransparent:X,autoFocus:"palette"===jo,onAutoFocus:To}):x("div",{ref:Ro,className:O.pickerContainer,onKeyDown:Wo,children:x(a,{color:ho,onChange:Eo,onChangeComplete:Go,disableAlpha:!X,className:O.picker})}),D("div",{className:O.switchButtons,children:[x(j,{title:"Palette",children:x(d,{ariaLabel:"Show color palette",size:"medium",type:lo?"secondary":"tertiary",onClick:So,children:x(k,{})})}),x(j,{title:"Pick your own",children:x(d,{ariaLabel:"Show custom color picker",size:"medium",type:lo?"tertiary":"secondary",onClick:wo,children:x(P,{})})})]})]}),io&&X&&!J&&x(f,{open:io,anchorEl:to.current,className:O.dragTrackerPopper,placement:"right",children:x(y,{onDrag:qo,onDragEnd:Uo})})]})};export{w as ColorPicker};
+import o from"@babel/runtime/helpers/slicedToArray";import n from"@babel/runtime/helpers/defineProperty";import s from"classnames";import{useMemo as i,useState as c,useRef as t,useCallback as r,useEffect as e}from"react";import{ChromePicker as a}from"react-color";import{throttle as l}from"lodash";import{v4 as m}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 f}from"../Popper/Popper.js";import{Swatches as I}from"./Swatches/Swatches.js";import{parseColor as b,channelsToHex as h,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 k,PickerIcon as P}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/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 i=Object.getOwnPropertySymbols(o);n&&(i=i.filter((function(n){return Object.getOwnPropertyDescriptor(o,n).enumerable}))),s.push.apply(s,i)}return s}function A(o){for(var s=1;s<arguments.length;s++){var i=null!=arguments[s]?arguments[s]:{};s%2?x(Object(i),!0).forEach((function(s){n(o,s,i[s])})):Object.getOwnPropertyDescriptors?Object.defineProperties(o,Object.getOwnPropertyDescriptors(i)):x(Object(i)).forEach((function(n){Object.defineProperty(o,n,Object.getOwnPropertyDescriptor(i,n))}))}return o}var S={small:O.small,medium:O.medium,large:O.large},w=function(n){var x=n.format,w=void 0===x?"hex":x,T=n.className,E=n.label,M=n.labelPlacement,B=void 0===M?"top":M,R=n.popoverPlacement,z=void 0===R?"bottom-start":R,W=n.testId,L=n.disabled,G=n.size,K=void 0===G?"small":G,U=n.onOpen,q=n.onClose,V=n.value,H=void 0===V?C:V,Z=n.onChange,J=n.disableOpacityDrag,Q=n.enableAlpha,X=void 0!==Q&&Q,Y=n.elementsClassNames,$=void 0===Y?{}:Y,_=i((function(){return{input:s(O.input,$.input),inputContainer:s(O.inputContainer,$.inputContainer),label:s(O.label,$.label),prefix:O.prefixContainer,suffix:O.suffixContainer,numberStepButtons:O.numberStepButtons}}),[$.input,$.inputContainer,$.label]),oo=i((function(){try{var o=b(H);return A(A({},o),{},{a:X?o.a:1})}catch(o){return b(C)}}),[H,X]),no=c(!1),so=o(no,2),io=so[0],co=so[1],to=t(null),ro=t(null),eo=c(!0),ao=o(eo,2),lo=ao[0],mo=ao[1],uo=c(null),po=o(uo,2),jo=po[0],fo=po[1],Io=c(oo),bo=o(Io,2),ho=bo[0],vo=bo[1],Co=t(null),yo=i((function(){return"corva-color-picker-".concat(m())}),[]),go="".concat(yo,"-opacity-input"),Oo="".concat(yo,"-label"),ko="".concat(yo,"-opacity-label"),Po=Boolean(E),Do=r((function(){co(!0),null==U||U()}),[U]),Fo=r((function(o){o.preventDefault(),fo(null),Do()}),[Do]),No=r((function(){fo(null),Do()}),[Do]),xo=r((function(o){L||"Enter"!==o.key&&" "!==o.key&&"ArrowDown"!==o.key||(o.preventDefault(),fo("palette"),Do())}),[L,Do]),Ao=r((function(){var o,n,s=!(null===(o=Co.current)||void 0===o||!o.contains(document.activeElement));(fo(null),co(!1),null==q||q(),s)&&(null===(n=ro.current)||void 0===n||n.focus({preventScroll:!0}))}),[q]),So=r((function(o){fo(0===o.detail?"palette":null),mo(!0)}),[]),wo=r((function(o){fo(0===o.detail?"picker":null),mo(!1)}),[]),To=r((function(){return fo(null)}),[]),Eo=r((function(o){return vo(o.rgb)}),[]),Mo=r((function(o){var n="hex"===w?h(o,X):v(o,X);null==Z||Z(n)}),[w,Z,X]),Bo=r((function(o){vo(o),Mo(o)}),[Mo]),Ro=g({color:ho,enableAlpha:X,isActive:!lo,onChange:Bo}),zo=Ro.pickerRef,Wo=Ro.onKeyDown;e((function(){var o;if("picker"===jo&&!lo){var n=null===(o=zo.current)||void 0===o?void 0:o.querySelector('[data-color-picker-control="saturation"]');n&&(n.focus({preventScroll:!0}),To())}}),[To,jo,lo,zo]);var Lo=r((function(o){var n=Number(o);if(!(Number.isNaN(n)||n<0||n>100)){var s=A(A({},oo),{},{a:n/100});Mo(s)}}),[oo,Mo]),Go=r((function(o){Mo(o.rgb)}),[Mo]),Ko=r((function(o){var n=oo.a||1,s=X&&0===o.a?0:n;Mo(A(A({},o),{},{a:s}))}),[Mo,oo.a,X]),Uo=r((function(){setTimeout((function(){var o,n;co(!1),null===(o=document.activeElement)||void 0===o||null===(n=o.blur)||void 0===n||n.call(o)}),0)}),[]),qo=i((function(){return l((function(o){var n=String(Math.round(o));Lo(n)}),100)}),[Lo]);e((function(){vo(oo)}),[oo]),e((function(){io&&mo(!0)}),[io]);var Vo=String(Math.round(100*ho.a)),Ho=(null==z?void 0:z.startsWith("top"))||(null==z?void 0:z.startsWith("bottom")),Zo=(null==z?void 0:z.startsWith("left"))||(null==z?void 0:z.startsWith("right")),Jo=Po?D(F,{children:[N("label",{id:Oo,htmlFor:go,children:"string"==typeof E?N(u.Label,{children:E}):E}),N("span",{id:ko,hidden:!0,children:"Opacity"})]}):void 0,Qo=i((function(){return Po?{id:go,"aria-labelledby":"".concat(Oo," ").concat(ko)}:{id:go,"aria-label":"Opacity"}}),[Po,go,Oo,ko]);return D(F,{children:[N(u,{label:Jo,labelPlacement:B,disabled:L,size:K,rootTagName:"div",prefix:D(F,{children:[D("div",{className:O.fakeValue,children:[Vo,N("span",{className:O.fakeValuePercent,children:"%"})]}),N("div",{ref:ro,className:s(O.indicator,0===ho.a&&O.transparent,$.indicator),style:{"--corvaui-colorpicker-indicatorcolor":h(ho,!1)},onClick:L?void 0:Fo,onKeyDown:xo,role:"button","aria-label":Po?void 0:"Color picker","aria-labelledby":Po?Oo:void 0,"aria-expanded":io,"aria-disabled":L,tabIndex:L?-1:0})]}),suffix:!io&&X&&!J&&!L&&N(y,{value:Number(Vo),onDrag:qo,onDragEnd:Uo}),className:s(O.root,S[K],!X&&O.noAlpha,T),testId:W,inputContainerRef:to,value:Vo,onChange:Lo,onFocus:No,inputType:"number",inputMode:"numeric",htmlAttributes:Qo,elementsClassNames:_}),D(p,{ref:Co,anchorEl:to.current,open:io,onClose:Ao,placement:z,className:s(O.popover,Ho&&O.marginVertical,Zo&&O.marginHorizontal,0===ho.a&&O.isTransparent,$.popover),children:[lo?N(I,{onChange:Ko,value:oo,addTransparent:X,autoFocus:"palette"===jo,onAutoFocus:To}):N("div",{ref:zo,className:O.pickerContainer,onKeyDown:Wo,children:N(a,{color:ho,onChange:Eo,onChangeComplete:Go,disableAlpha:!X,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:So,children:N(k,{})})}),N(j,{title:"Pick your own",children:N(d,{ariaLabel:"Show custom color picker",size:"medium",type:lo?"tertiary":"secondary",onClick:wo,children:N(P,{})})})]})]}),io&&X&&!J&&N(f,{open:io,anchorEl:to.current,className:O.dragTrackerPopper,placement:"right",children:N(y,{onDrag:qo,onDragEnd:Uo})})]})};export{w as ColorPicker};
 //# sourceMappingURL=ColorPicker.js.map

package/componentsV2/ColorPicker/ColorPicker.js.map CHANGED Viewed

	@@ -1 +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 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\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 inputElementsClassNames = useMemo<TextInputNextProps['elementsClassNames']>(\n () => ({\n input: classNames(styles.input, elementsClassNames.input),\n inputContainer: classNames(styles.inputContainer, elementsClassNames.inputContainer),\n label: classNames(styles.label, elementsClassNames.label),\n prefix: styles.prefixContainer,\n suffix: styles.suffixContainer,\n numberStepButtons: styles.numberStepButtons,\n }),\n [elementsClassNames.input, elementsClassNames.inputContainer, elementsClassNames.label]\n );\n\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 [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 elementsClassNames.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 htmlAttributes={inputHtmlAttributes}\n elementsClassNames={inputElementsClassNames}\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 elementsClassNames.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","ColorPicker","_ref","_ref$format","format","className","label","_ref$labelPlacement","labelPlacement","_ref$popoverPlacement","popoverPlacement","testId","disabled","_ref$size","size","onOpen","onClose","_ref$value","value","defaultColor","onChange","disableOpacityDrag","_ref$enableAlpha","enableAlpha","_ref$elementsClassNam","elementsClassNames","inputElementsClassNames","useMemo","input","classNames","inputContainer","prefix","prefixContainer","suffix","suffixContainer","numberStepButtons","valueChannels","channels","parseColor","_objectSpread","a","_","useState","_useState2","_slicedToArray","_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","key","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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"}
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 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\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 inputElementsClassNames = useMemo<TextInputNextProps['elementsClassNames']>(\n () => ({\n input: classNames(styles.input, elementsClassNames.input),\n inputContainer: classNames(styles.inputContainer, elementsClassNames.inputContainer),\n label: classNames(styles.label, elementsClassNames.label),\n prefix: styles.prefixContainer,\n suffix: styles.suffixContainer,\n numberStepButtons: styles.numberStepButtons,\n }),\n [elementsClassNames.input, elementsClassNames.inputContainer, elementsClassNames.label]\n );\n\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 [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 elementsClassNames.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 htmlAttributes={inputHtmlAttributes}\n elementsClassNames={inputElementsClassNames}\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 elementsClassNames.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","ColorPicker","_ref","_ref$format","format","className","label","_ref$labelPlacement","labelPlacement","_ref$popoverPlacement","popoverPlacement","testId","disabled","_ref$size","size","onOpen","onClose","_ref$value","value","defaultColor","onChange","disableOpacityDrag","_ref$enableAlpha","enableAlpha","_ref$elementsClassNam","elementsClassNames","inputElementsClassNames","useMemo","input","classNames","inputContainer","prefix","prefixContainer","suffix","suffixContainer","numberStepButtons","valueChannels","channels","parseColor","_objectSpread","a","_","useState","_useState2","_slicedToArray","_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","key","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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"}

package/componentsV2/ColorPicker/Swatches/Swatches.js CHANGED Viewed

@@ -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/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/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,v=i([]),O=I(I({},j),{},{a:1}),C=0===j.a,g=b?m.toSpliced(m.length-1,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(O,t)&&!e&&!C||C&&e},k=g.findIndex(F);t((function(){if(f){var o=-1===k?0:k,s=v.current[o];s&&(s.focus({preventScroll:!0}),null==h||h())}}),[f,h,k]);var y=function(o,s){var c;(d(r(g[o])),s)&&(null===(c=v.current[o])||void 0===c||c.focus({preventScroll:!0}))},P=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 y(c,!1);default:return}"number"==typeof s&&(o.preventDefault(),y(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){v.current[s]=o},className:c(p.swatch,m&&p.selected,t&&p.transparent,(i||t)&&p.darkAccent),onClick:function(){return d(n)},onKeyDown:P,style:t?void 0:{background:o},role:"radio","aria-checked":m,"aria-label":t?"Transparent":o.toUpperCase(),tabIndex:m||-1===k&&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{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/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,v=i([]),O=I(I({},j),{},{a:1}),C=0===j.a,g=b?m.toSpliced(m.length-1,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(O,t)&&!e&&!C||C&&e},k=g.findIndex(F);t((function(){if(f){var o=-1===k?0:k,s=v.current[o];s&&(s.focus({preventScroll:!0}),null==h||h())}}),[f,h,k]);var y=function(o,s){var c;(d(r(g[o])),s)&&(null===(c=v.current[o])||void 0===c||c.focus({preventScroll:!0}))},P=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 y(c,!1);default:return}"number"==typeof s&&(o.preventDefault(),y(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){v.current[s]=o},className:c(p.swatch,m&&p.selected,t&&p.transparent,(i||t)&&p.darkAccent),onClick:function(){return d(n)},onKeyDown:P,style:t?void 0:{background:o},role:"radio","aria-checked":m,"aria-label":t?"Transparent":o.toUpperCase(),tabIndex:m||-1===k&&0===s?0:-1,"data-index":s,children:a(u,{size:14,className:p.icon})},o)}))})};export{d as Swatches};
 //# sourceMappingURL=Swatches.js.map

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

	@@ -1 +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(paletteColors.length - 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","length","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","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":"~~k0JAuBA~~,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,UAAUD,EAAcE,OAAS,EAAG,EAAG,aACrDF,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,EAAOG,OACxC,MACF,IAAK,YACHuB,GAAaC,EAAe,EAAI3B,EAAOG,QAAUH,EAAOG,OACxD,MACF,IAAK,YACHuB,GAAaC,EAhEA,IAgE+B3B,EAAOG,OACnD,MACF,IAAK,UACHuB,GAAaC,EAnEA,GAmE8B3B,EAAOG,QAAUH,EAAOG,OACnE,MACF,IAAK,OACHuB,EAAY,EACZ,MACF,IAAK,MACHA,EAAY1B,EAAOG,OAAS,EAC5B,MACF,IAAK,QACL,IAAK,IAGH,OAFAsB,EAAMO,sBACNX,EAAYM,GAAc,GAE5B,QACE,OAGqB,iBAAdD,IACTD,EAAMO,iBACNX,EAAYK,GAAW,KAI3B,OACEO,EAAA,MAAA,CAAKC,UAAWC,EAAOC,KAAMC,KAAK,aAAa,aAAW,gBAAeC,SACtEtC,EAAOuC,KAAI,SAAClC,EAAOiB,GAClB,IAAMkB,EAAWlC,EAAWD,GACtBoC,EAAeC,EAAarC,GAAS,IACrCM,EAA+B,IAAf6B,EAAS1C,EACzB6C,EAAavC,EAAgBC,GAEnC,OACE4B,EAAA,MAAA,CAEEW,IAAK,SAAAC,GACHlD,EAAWuB,QAAQI,GAASuB,CAC5B,EACFX,UAAWY,EACTX,EAAOlB,OACP0B,GAAcR,EAAOY,SACrBpC,GAAiBwB,EAAOa,aACvBP,GAAgB9B,IAAkBwB,EAAOc,YAE5CC,QAAS,WAAA,OAAM3D,EAASiD,EAAU,EAClCW,UAAW3B,EACX4B,MAAOzC,OAAgB0C,EAAY,CAAEC,WAAYjD,GACjDgC,KAAK,QACL,eAAcM,EACd,aAAYhC,EAAgB,cAAgBN,EAAMkD,cAClDC,SAAUb,IAAkC,IAAnB9B,GAAkC,IAAVS,EAAe,GAAK,EACrE,aAAYA,EAAMgB,SAElBL,EAACwB,EAAc,CAACC,KAAM,GAAIxB,UAAWC,EAAOwB,QAnBvCtD,OAyBjB"}
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(paletteColors.length - 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","length","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","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":"k7JAuBA,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,UAAUD,EAAcE,OAAS,EAAG,EAAG,aACrDF,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,EAAOG,OACxC,MACF,IAAK,YACHuB,GAAaC,EAAe,EAAI3B,EAAOG,QAAUH,EAAOG,OACxD,MACF,IAAK,YACHuB,GAAaC,EAhEA,IAgE+B3B,EAAOG,OACnD,MACF,IAAK,UACHuB,GAAaC,EAnEA,GAmE8B3B,EAAOG,QAAUH,EAAOG,OACnE,MACF,IAAK,OACHuB,EAAY,EACZ,MACF,IAAK,MACHA,EAAY1B,EAAOG,OAAS,EAC5B,MACF,IAAK,QACL,IAAK,IAGH,OAFAsB,EAAMO,sBACNX,EAAYM,GAAc,GAE5B,QACE,OAGqB,iBAAdD,IACTD,EAAMO,iBACNX,EAAYK,GAAW,KAI3B,OACEO,EAAA,MAAA,CAAKC,UAAWC,EAAOC,KAAMC,KAAK,aAAa,aAAW,gBAAeC,SACtEtC,EAAOuC,KAAI,SAAClC,EAAOiB,GAClB,IAAMkB,EAAWlC,EAAWD,GACtBoC,EAAeC,EAAarC,GAAS,IACrCM,EAA+B,IAAf6B,EAAS1C,EACzB6C,EAAavC,EAAgBC,GAEnC,OACE4B,EAAA,MAAA,CAEEW,IAAK,SAAAC,GACHlD,EAAWuB,QAAQI,GAASuB,CAC5B,EACFX,UAAWY,EACTX,EAAOlB,OACP0B,GAAcR,EAAOY,SACrBpC,GAAiBwB,EAAOa,aACvBP,GAAgB9B,IAAkBwB,EAAOc,YAE5CC,QAAS,WAAA,OAAM3D,EAASiD,EAAU,EAClCW,UAAW3B,EACX4B,MAAOzC,OAAgB0C,EAAY,CAAEC,WAAYjD,GACjDgC,KAAK,QACL,eAAcM,EACd,aAAYhC,EAAgB,cAAgBN,EAAMkD,cAClDC,SAAUb,IAAkC,IAAnB9B,GAAkC,IAAVS,EAAe,GAAK,EACrE,aAAYA,EAAMgB,SAElBL,EAACwB,EAAc,CAACC,KAAM,GAAIxB,UAAWC,EAAOwB,QAnBvCtD,OAyBjB"}

package/componentsV2/CompletionsOffsetWellPicker/AssetSearchInput/AssetSearchInput.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{memo as o,useCallback as s}from"react";import{TextInput as c}from"../../TextInput/TextInput.js";import i from"./AssetSearchInput.scss.js";import"@babel/runtime/helpers/defineProperty";import"@babel/runtime/helpers/objectWithoutProperties";import"@icon-park/react/es/all";import{jsx as n}from"react/jsx-runtime";import"../../../icons/IconParkProvider.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{SearchOne as t}from"../../../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/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/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";var m=o((function(o){var m=o.searchText,r=o.onChange,e=s((function(){return r("")}),[r]);return n(c,{className:i.textInput,label:"Search",placeholder:"Search for Pads...",prefix:n(t,{}),onChange:r,value:m,onClear:e})}));export{m as default};
+import{memo as o,useCallback as s}from"react";import{TextInput as c}from"../../TextInput/TextInput.js";import i from"./AssetSearchInput.scss.js";import"@babel/runtime/helpers/defineProperty";import"@babel/runtime/helpers/objectWithoutProperties";import"@icon-park/react/es/all";import{jsx as n}from"react/jsx-runtime";import"../../../icons/IconParkProvider.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{SearchOne as t}from"../../../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/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";var m=o((function(o){var m=o.searchText,r=o.onChange,e=s((function(){return r("")}),[r]);return n(c,{className:i.textInput,label:"Search",placeholder:"Search for Pads...",prefix:n(t,{}),onChange:r,value:m,onClear:e})}));export{m as default};
 //# sourceMappingURL=AssetSearchInput.js.map

package/componentsV2/CompletionsOffsetWellPicker/AssetSearchInput/AssetSearchInput.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AssetSearchInput.js","sources":["../../../../src/componentsV2/CompletionsOffsetWellPicker/AssetSearchInput/AssetSearchInput.tsx"],"sourcesContent":["import { FC, memo, useCallback } from 'react';\n\nimport { TextInput } from '../../TextInput';\n\nimport styles from './AssetSearchInput.scss';\n\nimport { SearchOne } from '~/icons';\n\ntype Props = {\n searchText: string;\n onChange: (value: string) => void;\n};\n\nconst AssetSearchInput: FC<Props> = memo(({ searchText, onChange }) => {\n const clearSearch = useCallback(() => onChange(''), [onChange]);\n\n return (\n <TextInput\n className={styles.textInput}\n label=\"Search\"\n placeholder=\"Search for Pads...\"\n prefix={<SearchOne />}\n onChange={onChange}\n value={searchText}\n onClear={clearSearch}\n />\n );\n});\n\nexport default AssetSearchInput;\n"],"names":["AssetSearchInput","memo","_ref","searchText","onChange","clearSearch","useCallback","_jsx","TextInput","className","styles","textInput","label","placeholder","prefix","SearchOne","value","onClear"],"mappings":"~~mqIAaA~~,IAAMA,EAA8BC,GAAK,SAA8BC,GAAA,IAA3BC,IAAAA,WAAYC,IAAAA,SAChDC,EAAcC,GAAY,WAAA,OAAMF,EAAS,MAAK,CAACA,IAErD,OACEG,EAACC,EAAS,CACRC,UAAWC,EAAOC,UAClBC,MAAM,SACNC,YAAY,qBACZC,OAAQP,EAACQ,EAAa,IACtBX,SAAUA,EACVY,MAAOb,EACPc,QAASZ,GAGf"}
1	+ {"version":3,"file":"AssetSearchInput.js","sources":["../../../../src/componentsV2/CompletionsOffsetWellPicker/AssetSearchInput/AssetSearchInput.tsx"],"sourcesContent":["import { FC, memo, useCallback } from 'react';\n\nimport { TextInput } from '../../TextInput';\n\nimport styles from './AssetSearchInput.scss';\n\nimport { SearchOne } from '~/icons';\n\ntype Props = {\n searchText: string;\n onChange: (value: string) => void;\n};\n\nconst AssetSearchInput: FC<Props> = memo(({ searchText, onChange }) => {\n const clearSearch = useCallback(() => onChange(''), [onChange]);\n\n return (\n <TextInput\n className={styles.textInput}\n label=\"Search\"\n placeholder=\"Search for Pads...\"\n prefix={<SearchOne />}\n onChange={onChange}\n value={searchText}\n onClear={clearSearch}\n />\n );\n});\n\nexport default AssetSearchInput;\n"],"names":["AssetSearchInput","memo","_ref","searchText","onChange","clearSearch","useCallback","_jsx","TextInput","className","styles","textInput","label","placeholder","prefix","SearchOne","value","onClear"],"mappings":"mxIAaA,IAAMA,EAA8BC,GAAK,SAA8BC,GAAA,IAA3BC,IAAAA,WAAYC,IAAAA,SAChDC,EAAcC,GAAY,WAAA,OAAMF,EAAS,MAAK,CAACA,IAErD,OACEG,EAACC,EAAS,CACRC,UAAWC,EAAOC,UAClBC,MAAM,SACNC,YAAY,qBACZC,OAAQP,EAACQ,EAAa,IACtBX,SAAUA,EACVY,MAAOb,EACPc,QAASZ,GAGf"}