@corva/ui 3.74.0-0 → 3.74.0-10

package/componentsV2/AppHeader/V3/AppHeaderV3.js.map

@@ -1 +1 @@
-{"version":3,"file":"AppHeaderV3.js","sources":["../../../../src/componentsV2/AppHeader/V3/AppHeaderV3.tsx"],"sourcesContent":["import { ReactElement, ReactNode, useRef, FC } from 'react';\nimport classNames from 'classnames';\nimport { isEmpty } from 'lodash';\n\nimport { SEGMENTS } from '../../../constants/segment';\nimport { getAppSegment } from '../../../utils/devcenter';\nimport { PadModeSelect } from '../../PadModeSelect';\nimport { AppHeaderTestIds, Asset, UseWellnessAlertsReturnType } from '../AppHeader.constants';\nimport { useAppCommonsInternal } from '../../AppCommonsProvider';\nimport { HideInNativeApp } from '../../HideInNativeApp';\nimport { AppHeaderFinderProps } from '../../utils';\n\nimport { VersionSelect } from './VersionSelect';\nimport { AssetChips } from './AssetChips';\nimport { AppTitle } from './AppTitle';\nimport { useResponsivity } from './useResponsivity';\nimport { AdditionalAction, TitleMenuAction } from './constants';\nimport { Actions } from './Actions';\n\nimport styles from './AppHeaderV3.scss';\n\nexport type AppHeaderV3Props = {\n  logo?: string | ReactElement;\n\n  additionalControls?: ReactNode;\n\n  /**\n   * Used to put some controls alongside title\n   */\n  titleControls?: ReactNode;\n  titleControlsPosition?: 'right' | 'left';\n\n  /**\n   * An escape hatch to tweak the styling of internal elements\n   *\n   * `buttons`, `titleControls` and `versionSelect` are for *V3 only*\n   */\n  elementsClassNames?: {\n    title?: string;\n    additionalControls?: string;\n    chips?: string;\n    actions?: string;\n    versionSelect?: string;\n    titleControls?: string;\n    logoContainer?: string;\n  };\n\n  title?: ReactNode;\n  padModeDisabled?: boolean;\n  padModeWells?: ReturnType<typeof useAppCommonsInternal>['wells'];\n\n  lastUpdate?: number | string | Date;\n  asset?: Asset | Asset[];\n  dqData?: UseWellnessAlertsReturnType;\n  showComments?: boolean;\n  additionalActions?: AdditionalAction[];\n  disableSettings?: boolean;\n  showAssetChips?: boolean;\n  disableAssetSelector?: boolean;\n  titleMenuActions?: TitleMenuAction[];\n\n  /**\n   * Configuration for responsive behavior of header elements\n   * - `hideSettingsUnderMore`: When true, settings button will be hidden under \"More\" menu at smaller screen sizes\n   */\n  responsivenessConfig?: {\n    hideSettingsUnderMore?: boolean;\n  };\n\n  className?: string;\n  testId?: string;\n};\n\nexport const AppHeaderV3: FC<AppHeaderV3Props> = ({\n  elementsClassNames,\n  className,\n  testId,\n  logo,\n  additionalControls,\n  title,\n  padModeDisabled,\n  padModeWells,\n  dqData,\n  asset,\n  lastUpdate,\n  additionalActions,\n  showComments,\n  titleControls,\n  disableSettings,\n  showAssetChips,\n  disableAssetSelector,\n  titleMenuActions,\n  titleControlsPosition = 'right',\n  responsivenessConfig,\n}) => {\n  const rootRef = useRef<HTMLDivElement>(null);\n  const {\n    app,\n    well,\n    wells: contextWells,\n    fracFleet,\n    isInsideNewMobileApp,\n    disableAppAssetSelection,\n    isMultiRig,\n  } = useAppCommonsInternal();\n\n  const segment = getAppSegment(app);\n  const wells = padModeWells || contextWells;\n  const isCompletionPadMode = segment === SEGMENTS.COMPLETION && !well;\n  const hasPadModeAssets = !isEmpty(wells) && !!fracFleet;\n  const shouldDisableAssetControls = disableAppAssetSelection || isMultiRig;\n  const canShowPadMode = !disableAppAssetSelection && !padModeDisabled && !isInsideNewMobileApp;\n  const hasPadMode = canShowPadMode && isCompletionPadMode && hasPadModeAssets;\n\n  const possiblyNarrowChips =\n    hasPadMode || !!additionalControls || !!titleControls ? 'narrow' : undefined;\n  const chipsWidth = logo ? 'ultranarrow' : possiblyNarrowChips;\n\n  const titleControlsLeft = titleControlsPosition === 'left' && !!titleControls;\n\n  const versionRef = useRef<HTMLDivElement>(null);\n  const padModeRef = useRef<HTMLDivElement>(null);\n  const additionalControlsRef = useRef<HTMLDivElement>(null);\n  const titleControlsRef = useRef<HTMLDivElement>(null);\n  const chipsRef = useRef<HTMLDivElement>(null);\n  const logoRef = useRef<HTMLDivElement>(null);\n  const actionsRef = useRef<HTMLDivElement>(null);\n\n  const responsivity = useResponsivity({\n    disabled: isInsideNewMobileApp,\n    titleControlsLeft,\n\n    rootRef,\n    versionRef,\n    additionalControlsRef,\n    titleControlsRef,\n    logoRef,\n    padModeRef,\n    chipsRef,\n    actionsRef,\n  });\n\n  return (\n    <div\n      className={classNames(styles.root, className)}\n      data-testid={testId}\n      ref={rootRef}\n      style={responsivity.root?.style}\n      {...AppHeaderFinderProps}\n    >\n      <div\n        className={classNames(styles.logoContainer, elementsClassNames?.logoContainer)}\n        ref={logoRef}\n      >\n        {logo && typeof logo === 'string' ? (\n          <img className={styles.logo} src={logo} alt=\"Logo\" />\n        ) : (\n          logo\n        )}\n      </div>\n\n      <AppTitle\n        title={title}\n        asset={asset}\n        dqData={dqData}\n        lastUpdate={lastUpdate}\n        className={classNames(\n          styles.title,\n          titleControlsLeft && styles.titleWithControlsLeft,\n          elementsClassNames?.title\n        )}\n        disableAssetSelector={disableAssetSelector}\n        titleMenuActions={titleMenuActions}\n        style={responsivity.title?.style}\n      />\n\n      {titleControls && (\n        <div\n          className={classNames(\n            styles.titleControls,\n            titleControlsLeft && styles.titleControlsLeft,\n            responsivity.titleControls?.lastInLine && styles.lastInLine,\n            elementsClassNames?.titleControls\n          )}\n          ref={titleControlsRef}\n          style={responsivity.titleControls?.style}\n        >\n          {titleControls}\n        </div>\n      )}\n\n      <HideInNativeApp>\n        <div className={styles.version} ref={versionRef}>\n          <VersionSelect className={elementsClassNames?.versionSelect} />\n        </div>\n      </HideInNativeApp>\n\n      {hasPadMode && (\n        <div\n          className={classNames(\n            styles.padMode,\n            responsivity.padMode?.lastInLine && styles.lastInLine\n          )}\n          ref={padModeRef}\n          style={responsivity.padMode?.style}\n        >\n          <PadModeSelect testId={AppHeaderTestIds.PadModeSelectTestId} />\n        </div>\n      )}\n\n      {additionalControls && (\n        <div\n          className={classNames(\n            styles.additionalControls,\n            responsivity.additionalControls?.lastInLine && styles.lastInLine,\n            elementsClassNames?.additionalControls\n          )}\n          ref={additionalControlsRef}\n          style={responsivity.additionalControls?.style}\n          data-testid={AppHeaderTestIds.AdditionalControlsTestId}\n        >\n          {additionalControls}\n        </div>\n      )}\n\n      {!shouldDisableAssetControls && showAssetChips && (\n        <HideInNativeApp>\n          <div\n            className={classNames(\n              styles.assetChips,\n              responsivity.chips?.lastInLine && styles.lastInLine,\n              elementsClassNames?.chips\n            )}\n            ref={chipsRef}\n            style={responsivity.chips?.style}\n          >\n            <AssetChips chipsWidth={chipsWidth} />\n          </div>\n        </HideInNativeApp>\n      )}\n\n      <div\n        className={classNames(\n          styles.actions,\n          responsivity.actions?.lastInLine && styles.lastInLine,\n          elementsClassNames?.actions\n        )}\n        ref={actionsRef}\n        style={responsivity.actions?.style}\n        data-testid={AppHeaderTestIds.ActionsRootTestId}\n      >\n        <Actions\n          additionalActions={additionalActions}\n          showComments={showComments}\n          disableSettings={disableSettings}\n          rootRef={rootRef}\n          hideSettingsUnderMore={responsivenessConfig?.hideSettingsUnderMore}\n        />\n      </div>\n\n      {responsivity.linebreaks?.map((css, index) => (\n        <div className={styles.responsivenessLineBreak} style={css} key={index} />\n      ))}\n    </div>\n  );\n};\n"],"names":["AppHeaderV3","_ref","_responsivity$root","_responsivity$title","_responsivity$titleCo","_responsivity$titleCo2","_responsivity$padMode","_responsivity$padMode2","_responsivity$additio","_responsivity$additio2","_responsivity$chips","_responsivity$chips2","_responsivity$actions","_responsivity$actions2","_responsivity$linebre","elementsClassNames","className","testId","logo","additionalControls","title","padModeDisabled","padModeWells","dqData","asset","lastUpdate","additionalActions","showComments","titleControls","disableSettings","showAssetChips","disableAssetSelector","titleMenuActions","_ref$titleControlsPos","titleControlsPosition","responsivenessConfig","rootRef","useRef","_useAppCommonsInterna","useAppCommonsInternal","app","well","contextWells","wells","fracFleet","isInsideNewMobileApp","disableAppAssetSelection","isMultiRig","isCompletionPadMode","getAppSegment","SEGMENTS","COMPLETION","hasPadModeAssets","isEmpty","shouldDisableAssetControls","hasPadMode","chipsWidth","undefined","titleControlsLeft","versionRef","padModeRef","additionalControlsRef","titleControlsRef","chipsRef","logoRef","actionsRef","responsivity","useResponsivity","disabled","_jsxs","_objectSpread","classNames","styles","root","ref","style","AppHeaderFinderProps","children","_jsx","logoContainer","src","alt","AppTitle","titleWithControlsLeft","lastInLine","HideInNativeApp","version","VersionSelect","versionSelect","padMode","PadModeSelect","AppHeaderTestIds","PadModeSelectTestId","AdditionalControlsTestId","assetChips","chips","AssetChips","actions","ActionsRootTestId","Actions","hideSettingsUnderMore","linebreaks","map","css","index","responsivenessLineBreak"],"mappings":"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"}
+{"version":3,"file":"AppHeaderV3.js","sources":["../../../../src/componentsV2/AppHeader/V3/AppHeaderV3.tsx"],"sourcesContent":["import { ReactElement, ReactNode, useEffect, useRef, FC } from 'react';\nimport classNames from 'classnames';\nimport { isEmpty } from 'lodash';\n\nimport { SEGMENTS } from '../../../constants/segment';\nimport { getAppSegment } from '../../../utils/devcenter';\nimport { PadModeSelect } from '../../PadModeSelect';\nimport { AppHeaderTestIds, Asset, UseWellnessAlertsReturnType } from '../AppHeader.constants';\nimport { useAppCommonsInternal } from '../../AppCommonsProvider';\nimport { HideInNativeApp } from '../../HideInNativeApp';\nimport { AppHeaderFinderProps } from '../../utils';\n\nimport { VersionSelect } from './VersionSelect';\nimport { AssetChips } from './AssetChips';\nimport { AppTitle } from './AppTitle';\nimport { useResponsivity } from './useResponsivity';\nimport { AdditionalAction, TitleMenuAction } from './constants';\nimport { Actions } from './Actions';\n\nimport styles from './AppHeaderV3.scss';\n\nexport type AppHeaderV3Props = {\n  logo?: string | ReactElement;\n\n  additionalControls?: ReactNode;\n\n  /**\n   * Used to put some controls alongside title\n   */\n  titleControls?: ReactNode;\n  titleControlsPosition?: 'right' | 'left';\n\n  /**\n   * An escape hatch to tweak the styling of internal elements\n   *\n   * `buttons`, `titleControls` and `versionSelect` are for *V3 only*\n   */\n  elementsClassNames?: {\n    title?: string;\n    additionalControls?: string;\n    chips?: string;\n    actions?: string;\n    versionSelect?: string;\n    titleControls?: string;\n    logoContainer?: string;\n  };\n\n  title?: ReactNode;\n  padModeDisabled?: boolean;\n  padModeWells?: ReturnType<typeof useAppCommonsInternal>['wells'];\n\n  lastUpdate?: number | string | Date;\n  asset?: Asset | Asset[];\n  dqData?: UseWellnessAlertsReturnType;\n  showComments?: boolean;\n  additionalActions?: AdditionalAction[];\n  disableSettings?: boolean;\n  showAssetChips?: boolean;\n  disableAssetSelector?: boolean;\n  titleMenuActions?: TitleMenuAction[];\n\n  /**\n   * Configuration for responsive behavior of header elements\n   * - `hideSettingsUnderMore`: When true, settings button will be hidden under \"More\" menu at smaller screen sizes\n   */\n  responsivenessConfig?: {\n    hideSettingsUnderMore?: boolean;\n  };\n\n  className?: string;\n  testId?: string;\n};\n\nexport const AppHeaderV3: FC<AppHeaderV3Props> = ({\n  elementsClassNames,\n  className,\n  testId,\n  logo,\n  additionalControls,\n  title,\n  padModeDisabled,\n  padModeWells,\n  dqData,\n  asset,\n  lastUpdate,\n  additionalActions,\n  showComments,\n  titleControls,\n  disableSettings,\n  showAssetChips,\n  disableAssetSelector,\n  titleMenuActions,\n  titleControlsPosition = 'right',\n  responsivenessConfig,\n}) => {\n  const rootRef = useRef<HTMLDivElement>(null);\n  const {\n    app,\n    appName,\n    well,\n    wells: contextWells,\n    rig,\n    fracFleet,\n    interventionUnit,\n    isExpanded,\n    setSeparateWindowTitle,\n    isInsideNewMobileApp,\n    disableAppAssetSelection,\n    isMultiRig,\n  } = useAppCommonsInternal();\n\n  const segment = getAppSegment(app);\n  const wells = padModeWells || contextWells;\n  const isCompletionPadMode = segment === SEGMENTS.COMPLETION && !well;\n  const hasPadModeAssets = !isEmpty(wells) && !!fracFleet;\n  const shouldDisableAssetControls = disableAppAssetSelection || isMultiRig;\n  const canShowPadMode = !disableAppAssetSelection && !padModeDisabled && !isInsideNewMobileApp;\n  const hasPadMode = canShowPadMode && isCompletionPadMode && hasPadModeAssets;\n\n  const possiblyNarrowChips =\n    hasPadMode || !!additionalControls || !!titleControls ? 'narrow' : undefined;\n  const chipsWidth = logo ? 'ultranarrow' : possiblyNarrowChips;\n\n  const titleControlsLeft = titleControlsPosition === 'left' && !!titleControls;\n\n  const versionRef = useRef<HTMLDivElement>(null);\n  const padModeRef = useRef<HTMLDivElement>(null);\n  const additionalControlsRef = useRef<HTMLDivElement>(null);\n  const titleControlsRef = useRef<HTMLDivElement>(null);\n  const chipsRef = useRef<HTMLDivElement>(null);\n  const logoRef = useRef<HTMLDivElement>(null);\n  const actionsRef = useRef<HTMLDivElement>(null);\n\n  const assetName = well?.name ?? rig?.name ?? fracFleet?.name ?? interventionUnit?.name;\n\n  useEffect(() => {\n    setSeparateWindowTitle?.([appName, assetName].filter(Boolean).join(' - '));\n  }, [setSeparateWindowTitle, appName, assetName]);\n\n  const responsivity = useResponsivity({\n    disabled: isInsideNewMobileApp,\n    titleControlsLeft,\n\n    rootRef,\n    versionRef,\n    additionalControlsRef,\n    titleControlsRef,\n    logoRef,\n    padModeRef,\n    chipsRef,\n    actionsRef,\n  });\n\n  return (\n    <div\n      className={classNames(styles.root, className)}\n      data-testid={testId}\n      ref={rootRef}\n      style={responsivity.root?.style}\n      {...AppHeaderFinderProps}\n    >\n      <div\n        className={classNames(styles.logoContainer, elementsClassNames?.logoContainer)}\n        ref={logoRef}\n      >\n        {logo && typeof logo === 'string' ? (\n          <img className={styles.logo} src={logo} alt=\"Logo\" />\n        ) : (\n          logo\n        )}\n      </div>\n\n      <AppTitle\n        title={isExpanded ? assetName ?? title : title}\n        asset={asset}\n        dqData={dqData}\n        lastUpdate={lastUpdate}\n        className={classNames(\n          styles.title,\n          titleControlsLeft && styles.titleWithControlsLeft,\n          elementsClassNames?.title\n        )}\n        disableAssetSelector={disableAssetSelector}\n        titleMenuActions={titleMenuActions}\n        style={responsivity.title?.style}\n      />\n\n      {titleControls && (\n        <div\n          className={classNames(\n            styles.titleControls,\n            titleControlsLeft && styles.titleControlsLeft,\n            responsivity.titleControls?.lastInLine && styles.lastInLine,\n            elementsClassNames?.titleControls\n          )}\n          ref={titleControlsRef}\n          style={responsivity.titleControls?.style}\n        >\n          {titleControls}\n        </div>\n      )}\n\n      <HideInNativeApp>\n        <div className={styles.version} ref={versionRef}>\n          <VersionSelect className={elementsClassNames?.versionSelect} />\n        </div>\n      </HideInNativeApp>\n\n      {hasPadMode && (\n        <div\n          className={classNames(\n            styles.padMode,\n            responsivity.padMode?.lastInLine && styles.lastInLine\n          )}\n          ref={padModeRef}\n          style={responsivity.padMode?.style}\n        >\n          <PadModeSelect testId={AppHeaderTestIds.PadModeSelectTestId} />\n        </div>\n      )}\n\n      {additionalControls && (\n        <div\n          className={classNames(\n            styles.additionalControls,\n            responsivity.additionalControls?.lastInLine && styles.lastInLine,\n            elementsClassNames?.additionalControls\n          )}\n          ref={additionalControlsRef}\n          style={responsivity.additionalControls?.style}\n          data-testid={AppHeaderTestIds.AdditionalControlsTestId}\n        >\n          {additionalControls}\n        </div>\n      )}\n\n      {!shouldDisableAssetControls && showAssetChips && (\n        <HideInNativeApp>\n          <div\n            className={classNames(\n              styles.assetChips,\n              responsivity.chips?.lastInLine && styles.lastInLine,\n              elementsClassNames?.chips\n            )}\n            ref={chipsRef}\n            style={responsivity.chips?.style}\n          >\n            <AssetChips chipsWidth={chipsWidth} />\n          </div>\n        </HideInNativeApp>\n      )}\n\n      <div\n        className={classNames(\n          styles.actions,\n          responsivity.actions?.lastInLine && styles.lastInLine,\n          elementsClassNames?.actions\n        )}\n        ref={actionsRef}\n        style={responsivity.actions?.style}\n        data-testid={AppHeaderTestIds.ActionsRootTestId}\n      >\n        <Actions\n          additionalActions={additionalActions}\n          showComments={showComments}\n          disableSettings={disableSettings}\n          rootRef={rootRef}\n          hideSettingsUnderMore={responsivenessConfig?.hideSettingsUnderMore}\n        />\n      </div>\n\n      {responsivity.linebreaks?.map((css, index) => (\n        <div className={styles.responsivenessLineBreak} style={css} key={index} />\n      ))}\n    </div>\n  );\n};\n"],"names":["AppHeaderV3","_ref","_ref2","_ref3","_well$name","_responsivity$root","_responsivity$title","_responsivity$titleCo","_responsivity$titleCo2","_responsivity$padMode","_responsivity$padMode2","_responsivity$additio","_responsivity$additio2","_responsivity$chips","_responsivity$chips2","_responsivity$actions","_responsivity$actions2","_responsivity$linebre","elementsClassNames","className","testId","logo","additionalControls","title","padModeDisabled","padModeWells","dqData","asset","lastUpdate","additionalActions","showComments","titleControls","disableSettings","showAssetChips","disableAssetSelector","titleMenuActions","_ref$titleControlsPos","titleControlsPosition","responsivenessConfig","rootRef","useRef","_useAppCommonsInterna","useAppCommonsInternal","app","appName","well","contextWells","wells","rig","fracFleet","interventionUnit","isExpanded","setSeparateWindowTitle","isInsideNewMobileApp","disableAppAssetSelection","isMultiRig","isCompletionPadMode","getAppSegment","SEGMENTS","COMPLETION","hasPadModeAssets","isEmpty","shouldDisableAssetControls","hasPadMode","chipsWidth","undefined","titleControlsLeft","versionRef","padModeRef","additionalControlsRef","titleControlsRef","chipsRef","logoRef","actionsRef","assetName","name","useEffect","filter","Boolean","join","responsivity","useResponsivity","disabled","_jsxs","_objectSpread","classNames","styles","root","ref","style","AppHeaderFinderProps","children","_jsx","logoContainer","src","alt","AppTitle","titleWithControlsLeft","lastInLine","HideInNativeApp","version","VersionSelect","versionSelect","padMode","PadModeSelect","AppHeaderTestIds","PadModeSelectTestId","AdditionalControlsTestId","assetChips","chips","AssetChips","actions","ActionsRootTestId","Actions","hideSettingsUnderMore","linebreaks","map","css","index","responsivenessLineBreak"],"mappings":"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"}

package/componentsV2/ButtonIcon/ButtonIcon.d.ts

@@ -14,6 +14,8 @@ export type ButtonIconProps = {
      */
     type?: 'primary' | 'secondary' | 'tertiary' | 'secondaryBg' | 'tertiaryBg';
     disabled?: boolean;
+    /** Holds the hover treatment while the menu or popover this opens is on screen. */
+    isActive?: boolean;
     disableFocusState?: boolean;
     onMouseEnter?: MouseEventHandler<HTMLButtonElement>;
     onMouseLeave?: MouseEventHandler<HTMLButtonElement>;

package/componentsV2/ButtonIcon/ButtonIcon.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ButtonIcon.d.ts","sourceRoot":"","sources":["../../../src/componentsV2/ButtonIcon/ButtonIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAc,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAMjF,MAAM,MAAM,eAAe,GAAG;IAC5B,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,gDAAgD;IAChD,SAAS,CAAC,EAAE,cAAc,CAAC,YAAY,CAAC,CAAC;IACzC,cAAc,CAAC,EAAE,cAAc,CAAC,iBAAiB,CAAC,CAAC;IACnD,eAAe,CAAC,EAAE,cAAc,CAAC,kBAAkB,CAAC,CAAC;IACrD,OAAO,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IAC/C,WAAW,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IACnD,SAAS,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IACjD,IAAI,CAAC,EAAE,IAAI,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IAC3C;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,aAAa,GAAG,YAAY,CAAC;IAC3E,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAE5B,YAAY,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IACpD,YAAY,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IAEpD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAmBF,eAAO,MAAM,UAAU,+GA8CtB,CAAC"}
+{"version":3,"file":"ButtonIcon.d.ts","sourceRoot":"","sources":["../../../src/componentsV2/ButtonIcon/ButtonIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAc,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAMjF,MAAM,MAAM,eAAe,GAAG;IAC5B,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,gDAAgD;IAChD,SAAS,CAAC,EAAE,cAAc,CAAC,YAAY,CAAC,CAAC;IACzC,cAAc,CAAC,EAAE,cAAc,CAAC,iBAAiB,CAAC,CAAC;IACnD,eAAe,CAAC,EAAE,cAAc,CAAC,kBAAkB,CAAC,CAAC;IACrD,OAAO,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IAC/C,WAAW,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IACnD,SAAS,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IACjD,IAAI,CAAC,EAAE,IAAI,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IAC3C;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,aAAa,GAAG,YAAY,CAAC;IAC3E,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,mFAAmF;IACnF,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAE5B,YAAY,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IACpD,YAAY,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IAEpD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAmBF,eAAO,MAAM,UAAU,+GAgDtB,CAAC"}

package/componentsV2/ButtonIcon/ButtonIcon.js

@@ -1,2 +1,2 @@
-import e from"@babel/runtime/helpers/defineProperty";import r from"@babel/runtime/helpers/toConsumableArray";import t from"@babel/runtime/helpers/objectWithoutProperties";import{forwardRef as a}from"react";import{IconButton as i}from"@material-ui/core";import o from"classnames";import s from"./ButtonIcon.scss.js";import{jsx as n}from"react/jsx-runtime";var l=["children","disabled","testId","className","onClick","type","size","disableFocusState","onMouseEnter","onMouseLeave","ariaLabel","ariaLabelledBy","ariaDescribedBy"];function c(e,r){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);r&&(a=a.filter((function(r){return Object.getOwnPropertyDescriptor(e,r).enumerable}))),t.push.apply(t,a)}return t}function b(r){for(var t=1;t<arguments.length;t++){var a=null!=arguments[t]?arguments[t]:{};t%2?c(Object(a),!0).forEach((function(t){e(r,t,a[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(r,Object.getOwnPropertyDescriptors(a)):c(Object(a)).forEach((function(e){Object.defineProperty(r,e,Object.getOwnPropertyDescriptor(a,e))}))}return r}var m={large:s.large,medium:s.medium,small:s.small,xs:s.xsmall},d={primary:[s.primary],secondary:[s.secondary],tertiary:[s.tertiary],secondaryBg:[s.secondary,s.withBg],tertiaryBg:[s.tertiary,s.withBg]},p={center:!1},u=a((function(e,a){var c=e.children,u=e.disabled,y=e.testId,f=e.className,O=e.onClick,h=e.type,j=void 0===h?"tertiary":h,v=e.size,g=void 0===v?"medium":v,P=e.disableFocusState,B=e.onMouseEnter,w=e.onMouseLeave,L=e.ariaLabel,D=e.ariaLabelledBy,M=e.ariaDescribedBy,E=t(e,l);return n("div",{className:o(s.root,f),children:n(i,b(b({ref:a,"aria-label":L,"aria-labelledby":D,"aria-describedby":M,className:o.apply(void 0,[s.button,m[g]].concat(r(d[j]),[u&&s.disabled])),onClick:O,disabled:u,"data-testid":y,disableRipple:P,TouchRippleProps:p,onMouseEnter:B,onMouseLeave:w},E),{},{children:c}))})}));export{u as ButtonIcon};
+import e from"@babel/runtime/helpers/defineProperty";import r from"@babel/runtime/helpers/toConsumableArray";import t from"@babel/runtime/helpers/objectWithoutProperties";import{forwardRef as a}from"react";import{IconButton as i}from"@material-ui/core";import o from"classnames";import s from"./ButtonIcon.scss.js";import{jsx as n}from"react/jsx-runtime";var c=["children","disabled","isActive","testId","className","onClick","type","size","disableFocusState","onMouseEnter","onMouseLeave","ariaLabel","ariaLabelledBy","ariaDescribedBy"];function l(e,r){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);r&&(a=a.filter((function(r){return Object.getOwnPropertyDescriptor(e,r).enumerable}))),t.push.apply(t,a)}return t}function b(r){for(var t=1;t<arguments.length;t++){var a=null!=arguments[t]?arguments[t]:{};t%2?l(Object(a),!0).forEach((function(t){e(r,t,a[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(r,Object.getOwnPropertyDescriptors(a)):l(Object(a)).forEach((function(e){Object.defineProperty(r,e,Object.getOwnPropertyDescriptor(a,e))}))}return r}var m={large:s.large,medium:s.medium,small:s.small,xs:s.xsmall},d={primary:[s.primary],secondary:[s.secondary],tertiary:[s.tertiary],secondaryBg:[s.secondary,s.withBg],tertiaryBg:[s.tertiary,s.withBg]},p={center:!1},u=a((function(e,a){var l=e.children,u=e.disabled,y=e.isActive,f=e.testId,v=e.className,O=e.onClick,h=e.type,j=void 0===h?"tertiary":h,g=e.size,P=void 0===g?"medium":g,B=e.disableFocusState,w=e.onMouseEnter,L=e.onMouseLeave,D=e.ariaLabel,M=e.ariaLabelledBy,E=e.ariaDescribedBy,k=t(e,c);return n("div",{className:o(s.root,v),children:n(i,b(b({ref:a,"aria-label":D,"aria-labelledby":M,"aria-describedby":E,className:o.apply(void 0,[s.button,m[P]].concat(r(d[j]),[y&&s.active,u&&s.disabled])),onClick:O,disabled:u,"data-testid":f,disableRipple:B,TouchRippleProps:p,onMouseEnter:w,onMouseLeave:L},k),{},{children:l}))})}));export{u as ButtonIcon};
 //# sourceMappingURL=ButtonIcon.js.map

package/componentsV2/ButtonIcon/ButtonIcon.js.map

@@ -1 +1 @@
-{"version":3,"file":"ButtonIcon.js","sources":["../../../src/componentsV2/ButtonIcon/ButtonIcon.tsx"],"sourcesContent":["import { AriaAttributes, forwardRef, MouseEventHandler, ReactNode } from 'react';\nimport { IconButton as MuiIconButton } from '@material-ui/core';\nimport classNames from 'classnames';\n\nimport styles from './ButtonIcon.scss';\n\nexport type ButtonIconProps = {\n  children?: ReactNode;\n  /** Accessible name for the icon-only button. */\n  ariaLabel?: AriaAttributes['aria-label'];\n  ariaLabelledBy?: AriaAttributes['aria-labelledby'];\n  ariaDescribedBy?: AriaAttributes['aria-describedby'];\n  onClick?: MouseEventHandler<HTMLButtonElement>;\n  onMouseDown?: MouseEventHandler<HTMLButtonElement>;\n  onMouseUp?: MouseEventHandler<HTMLButtonElement>;\n  size?: 'xs' | 'small' | 'medium' | 'large';\n  /**\n   * Button visual style\n   */\n  type?: 'primary' | 'secondary' | 'tertiary' | 'secondaryBg' | 'tertiaryBg';\n  disabled?: boolean;\n  disableFocusState?: boolean;\n\n  onMouseEnter?: MouseEventHandler<HTMLButtonElement>;\n  onMouseLeave?: MouseEventHandler<HTMLButtonElement>;\n\n  className?: string;\n  testId?: string;\n};\n\nconst SizeToClassMap: Record<Required<ButtonIconProps>['size'], string> = {\n  large: styles.large,\n  medium: styles.medium,\n  small: styles.small,\n  xs: styles.xsmall,\n};\n\nconst TypeToClassMap: Record<Required<ButtonIconProps>['type'], string[]> = {\n  primary: [styles.primary],\n  secondary: [styles.secondary],\n  tertiary: [styles.tertiary],\n  secondaryBg: [styles.secondary, styles.withBg],\n  tertiaryBg: [styles.tertiary, styles.withBg],\n};\n\nconst TouchRippleProps = { center: false };\n\nexport const ButtonIcon = forwardRef<HTMLButtonElement, ButtonIconProps>(\n  (\n    {\n      children,\n      disabled,\n      testId,\n      className,\n      onClick,\n      type = 'tertiary',\n      size = 'medium',\n      disableFocusState,\n      onMouseEnter,\n      onMouseLeave,\n      ariaLabel,\n      ariaLabelledBy,\n      ariaDescribedBy,\n      // Needed for Tooltip\n      ...rest\n    },\n    ref\n  ) => (\n    <div className={classNames(styles.root, className)}>\n      <MuiIconButton\n        ref={ref}\n        aria-label={ariaLabel}\n        aria-labelledby={ariaLabelledBy}\n        aria-describedby={ariaDescribedBy}\n        className={classNames(\n          styles.button,\n          SizeToClassMap[size],\n          ...TypeToClassMap[type],\n          disabled && styles.disabled\n        )}\n        onClick={onClick}\n        disabled={disabled}\n        data-testid={testId}\n        disableRipple={disableFocusState}\n        TouchRippleProps={TouchRippleProps}\n        onMouseEnter={onMouseEnter}\n        onMouseLeave={onMouseLeave}\n        {...rest}\n      >\n        {children}\n      </MuiIconButton>\n    </div>\n  )\n);\n"],"names":["SizeToClassMap","large","styles","medium","small","xs","xsmall","TypeToClassMap","primary","secondary","tertiary","secondaryBg","withBg","tertiaryBg","TouchRippleProps","center","ButtonIcon","forwardRef","ref","children","disabled","testId","className","onClick","_ref$type","_ref","type","_ref$size","size","disableFocusState","onMouseEnter","onMouseLeave","ariaLabel","ariaLabelledBy","ariaDescribedBy","rest","_objectWithoutProperties","_excluded","_jsx","classNames","root","MuiIconButton","_objectSpread","button","disableRipple"],"mappings":"8kCA8BA,IAAMA,EAAoE,CACxEC,MAAOC,EAAOD,MACdE,OAAQD,EAAOC,OACfC,MAAOF,EAAOE,MACdC,GAAIH,EAAOI,QAGPC,EAAsE,CAC1EC,QAAS,CAACN,EAAOM,SACjBC,UAAW,CAACP,EAAOO,WACnBC,SAAU,CAACR,EAAOQ,UAClBC,YAAa,CAACT,EAAOO,UAAWP,EAAOU,QACvCC,WAAY,CAACX,EAAOQ,SAAUR,EAAOU,SAGjCE,EAAmB,CAAEC,QAAQ,GAEtBC,EAAaC,GACxB,WAkBEC,GAAG,IAhBDC,IAAAA,SACAC,IAAAA,SACAC,IAAAA,OACAC,IAAAA,UACAC,IAAAA,QAAOC,EAAAC,EACPC,KAAAA,aAAO,WAAUF,EAAAG,EAAAF,EACjBG,KAAAA,aAAO,SAAQD,EACfE,IAAAA,kBACAC,IAAAA,aACAC,IAAAA,aACAC,IAAAA,UACAC,IAAAA,eACAC,IAAAA,gBAEGC,EAAIC,EAAAX,EAAAY,GAAA,OAITC,EAAA,MAAA,CAAKhB,UAAWiB,EAAWrC,EAAOsC,KAAMlB,GAAWH,SACjDmB,EAACG,EAAaC,EAAAA,EAAA,CACZxB,IAAKA,EACL,aAAYc,EACZ,kBAAiBC,EACjB,mBAAkBC,EAClBZ,UAAWiB,EACTrC,WAAAA,EAAAA,CAAAA,EAAOyC,OACP3C,EAAe4B,aACZrB,EAAemB,IAAK,CACvBN,GAAYlB,EAAOkB,YAErBG,QAASA,EACTH,SAAUA,EACV,cAAaC,EACbuB,cAAef,EACff,iBAAkBA,EAClBgB,aAAcA,EACdC,aAAcA,GACVI,GAAI,GAAA,CAAAhB,SAEPA,MAEC"}
+{"version":3,"file":"ButtonIcon.js","sources":["../../../src/componentsV2/ButtonIcon/ButtonIcon.tsx"],"sourcesContent":["import { AriaAttributes, forwardRef, MouseEventHandler, ReactNode } from 'react';\nimport { IconButton as MuiIconButton } from '@material-ui/core';\nimport classNames from 'classnames';\n\nimport styles from './ButtonIcon.scss';\n\nexport type ButtonIconProps = {\n  children?: ReactNode;\n  /** Accessible name for the icon-only button. */\n  ariaLabel?: AriaAttributes['aria-label'];\n  ariaLabelledBy?: AriaAttributes['aria-labelledby'];\n  ariaDescribedBy?: AriaAttributes['aria-describedby'];\n  onClick?: MouseEventHandler<HTMLButtonElement>;\n  onMouseDown?: MouseEventHandler<HTMLButtonElement>;\n  onMouseUp?: MouseEventHandler<HTMLButtonElement>;\n  size?: 'xs' | 'small' | 'medium' | 'large';\n  /**\n   * Button visual style\n   */\n  type?: 'primary' | 'secondary' | 'tertiary' | 'secondaryBg' | 'tertiaryBg';\n  disabled?: boolean;\n  /** Holds the hover treatment while the menu or popover this opens is on screen. */\n  isActive?: boolean;\n  disableFocusState?: boolean;\n\n  onMouseEnter?: MouseEventHandler<HTMLButtonElement>;\n  onMouseLeave?: MouseEventHandler<HTMLButtonElement>;\n\n  className?: string;\n  testId?: string;\n};\n\nconst SizeToClassMap: Record<Required<ButtonIconProps>['size'], string> = {\n  large: styles.large,\n  medium: styles.medium,\n  small: styles.small,\n  xs: styles.xsmall,\n};\n\nconst TypeToClassMap: Record<Required<ButtonIconProps>['type'], string[]> = {\n  primary: [styles.primary],\n  secondary: [styles.secondary],\n  tertiary: [styles.tertiary],\n  secondaryBg: [styles.secondary, styles.withBg],\n  tertiaryBg: [styles.tertiary, styles.withBg],\n};\n\nconst TouchRippleProps = { center: false };\n\nexport const ButtonIcon = forwardRef<HTMLButtonElement, ButtonIconProps>(\n  (\n    {\n      children,\n      disabled,\n      isActive,\n      testId,\n      className,\n      onClick,\n      type = 'tertiary',\n      size = 'medium',\n      disableFocusState,\n      onMouseEnter,\n      onMouseLeave,\n      ariaLabel,\n      ariaLabelledBy,\n      ariaDescribedBy,\n      // Needed for Tooltip\n      ...rest\n    },\n    ref\n  ) => (\n    <div className={classNames(styles.root, className)}>\n      <MuiIconButton\n        ref={ref}\n        aria-label={ariaLabel}\n        aria-labelledby={ariaLabelledBy}\n        aria-describedby={ariaDescribedBy}\n        className={classNames(\n          styles.button,\n          SizeToClassMap[size],\n          ...TypeToClassMap[type],\n          isActive && styles.active,\n          disabled && styles.disabled\n        )}\n        onClick={onClick}\n        disabled={disabled}\n        data-testid={testId}\n        disableRipple={disableFocusState}\n        TouchRippleProps={TouchRippleProps}\n        onMouseEnter={onMouseEnter}\n        onMouseLeave={onMouseLeave}\n        {...rest}\n      >\n        {children}\n      </MuiIconButton>\n    </div>\n  )\n);\n"],"names":["SizeToClassMap","large","styles","medium","small","xs","xsmall","TypeToClassMap","primary","secondary","tertiary","secondaryBg","withBg","tertiaryBg","TouchRippleProps","center","ButtonIcon","forwardRef","ref","children","disabled","isActive","testId","className","onClick","_ref$type","_ref","type","_ref$size","size","disableFocusState","onMouseEnter","onMouseLeave","ariaLabel","ariaLabelledBy","ariaDescribedBy","rest","_objectWithoutProperties","_excluded","_jsx","classNames","root","MuiIconButton","_objectSpread","button","concat","_toConsumableArray","active","disableRipple"],"mappings":"ylCAgCA,IAAMA,EAAoE,CACxEC,MAAOC,EAAOD,MACdE,OAAQD,EAAOC,OACfC,MAAOF,EAAOE,MACdC,GAAIH,EAAOI,QAGPC,EAAsE,CAC1EC,QAAS,CAACN,EAAOM,SACjBC,UAAW,CAACP,EAAOO,WACnBC,SAAU,CAACR,EAAOQ,UAClBC,YAAa,CAACT,EAAOO,UAAWP,EAAOU,QACvCC,WAAY,CAACX,EAAOQ,SAAUR,EAAOU,SAGjCE,EAAmB,CAAEC,QAAQ,GAEtBC,EAAaC,GACxB,WAmBEC,GAAG,IAjBDC,IAAAA,SACAC,IAAAA,SACAC,IAAAA,SACAC,IAAAA,OACAC,IAAAA,UACAC,IAAAA,QAAOC,EAAAC,EACPC,KAAAA,aAAO,WAAUF,EAAAG,EAAAF,EACjBG,KAAAA,aAAO,SAAQD,EACfE,IAAAA,kBACAC,IAAAA,aACAC,IAAAA,aACAC,IAAAA,UACAC,IAAAA,eACAC,IAAAA,gBAEGC,EAAIC,EAAAX,EAAAY,GAAA,OAITC,EAAA,MAAA,CAAKhB,UAAWiB,EAAWtC,EAAOuC,KAAMlB,GAAWJ,SACjDoB,EAACG,EAAaC,EAAAA,EAAA,CACZzB,IAAKA,EACL,aAAYe,EACZ,kBAAiBC,EACjB,mBAAkBC,EAClBZ,UAAWiB,EACTtC,WAAAA,EAAAA,CAAAA,EAAO0C,OACP5C,EAAe6B,IAAKgB,OAAAC,EACjBvC,EAAeoB,IAClBN,CAAAA,GAAYnB,EAAO6C,OACnB3B,GAAYlB,EAAOkB,YAErBI,QAASA,EACTJ,SAAUA,EACV,cAAaE,EACb0B,cAAelB,EACfhB,iBAAkBA,EAClBiB,aAAcA,EACdC,aAAcA,GACVI,GAAI,GAAA,CAAAjB,SAEPA,MAEC"}

package/componentsV2/ButtonIcon/ButtonIcon.scss.js

@@ -1,2 +1,2 @@
-import t from'./../../ext-esm/style-inject/dist/style-inject.es.js';var o={spacing:"8",root:"ButtonIcon_root__VO5jl",button:"ButtonIcon_button__gD83m",large:"ButtonIcon_large__2EddF",medium:"ButtonIcon_medium__-DRWs",small:"ButtonIcon_small__LVDfV",xsmall:"ButtonIcon_xsmall__-cDOa",primary:"ButtonIcon_primary__V4ya6",disabled:"ButtonIcon_disabled__mWUEz",secondary:"ButtonIcon_secondary__8ReYC",tertiary:"ButtonIcon_tertiary__JUuwo",withBg:"ButtonIcon_withBg__ODNab"};t(".ButtonIcon_root__VO5jl{display:inline-block;vertical-align:middle}.ButtonIcon_button__gD83m.MuiIconButton-root{border-radius:8px;transition:all .15s cubic-bezier(.4,0,.2,1)}.ButtonIcon_button__gD83m.MuiIconButton-root:hover{backdrop-filter:blur(4px);background:hsla(0,0%,100%,.16)}.ButtonIcon_button__gD83m.ButtonIcon_large__2EddF{padding:8px}.ButtonIcon_button__gD83m.ButtonIcon_medium__-DRWs{padding:6px}.ButtonIcon_button__gD83m.ButtonIcon_large__2EddF .MuiIcon-root,.ButtonIcon_button__gD83m.ButtonIcon_large__2EddF .i-icon,.ButtonIcon_button__gD83m.ButtonIcon_large__2EddF svg,.ButtonIcon_button__gD83m.ButtonIcon_medium__-DRWs .MuiIcon-root,.ButtonIcon_button__gD83m.ButtonIcon_medium__-DRWs .i-icon,.ButtonIcon_button__gD83m.ButtonIcon_medium__-DRWs svg{display:block;height:24px!important;width:24px!important}.ButtonIcon_button__gD83m.ButtonIcon_small__LVDfV{padding:6px}.ButtonIcon_button__gD83m.ButtonIcon_small__LVDfV .MuiIcon-root,.ButtonIcon_button__gD83m.ButtonIcon_small__LVDfV .i-icon,.ButtonIcon_button__gD83m.ButtonIcon_small__LVDfV svg{display:block;height:20px!important;width:20px!important}.ButtonIcon_button__gD83m.ButtonIcon_xsmall__-cDOa{padding:4px}.ButtonIcon_button__gD83m.ButtonIcon_xsmall__-cDOa .MuiIcon-root,.ButtonIcon_button__gD83m.ButtonIcon_xsmall__-cDOa .i-icon,.ButtonIcon_button__gD83m.ButtonIcon_xsmall__-cDOa svg{display:block;height:16px!important;width:16px!important}.ButtonIcon_button__gD83m.ButtonIcon_xsmall__-cDOa.MuiIconButton-root{border-radius:6px}.ButtonIcon_button__gD83m.ButtonIcon_primary__V4ya6{background:var(--palette-primary-main);color:var(--palette-background-b-2)}.ButtonIcon_button__gD83m.ButtonIcon_primary__V4ya6:active,.ButtonIcon_button__gD83m.ButtonIcon_primary__V4ya6:hover{background:var(--palette-primary-light)}.ButtonIcon_button__gD83m.ButtonIcon_primary__V4ya6.ButtonIcon_disabled__mWUEz{background:rgb(from var(--palette-primary-main) r g b/.4);color:var(--palette-background-b-2)}.ButtonIcon_button__gD83m.ButtonIcon_secondary__8ReYC{color:var(--palette-primary-main)}.ButtonIcon_button__gD83m.ButtonIcon_secondary__8ReYC:active,.ButtonIcon_button__gD83m.ButtonIcon_secondary__8ReYC:hover{color:var(--palette-primary-light)}.ButtonIcon_button__gD83m.ButtonIcon_secondary__8ReYC.ButtonIcon_disabled__mWUEz{color:rgb(from var(--palette-primary-main) r g b/.4)}.ButtonIcon_button__gD83m.ButtonIcon_tertiary__JUuwo{color:var(--palette-primary-text-6)}.ButtonIcon_button__gD83m.ButtonIcon_tertiary__JUuwo:active,.ButtonIcon_button__gD83m.ButtonIcon_tertiary__JUuwo:hover{color:var(--palette-primary-text-1)}.ButtonIcon_button__gD83m.ButtonIcon_tertiary__JUuwo.ButtonIcon_disabled__mWUEz{color:var(--palette-primary-text-9)}.ButtonIcon_button__gD83m.ButtonIcon_withBg__ODNab{background:hsla(0,0%,100%,.08)}.ButtonIcon_button__gD83m.ButtonIcon_withBg__ODNab.ButtonIcon_disabled__mWUEz{background:hsla(0,0%,100%,.03)}");export{o as default};
+import t from'./../../ext-esm/style-inject/dist/style-inject.es.js';var o={spacing:"8",root:"ButtonIcon_root__VO5jl",button:"ButtonIcon_button__gD83m",large:"ButtonIcon_large__2EddF",medium:"ButtonIcon_medium__-DRWs",small:"ButtonIcon_small__LVDfV",xsmall:"ButtonIcon_xsmall__-cDOa",primary:"ButtonIcon_primary__V4ya6",active:"ButtonIcon_active__432Fb",disabled:"ButtonIcon_disabled__mWUEz",secondary:"ButtonIcon_secondary__8ReYC",tertiary:"ButtonIcon_tertiary__JUuwo",withBg:"ButtonIcon_withBg__ODNab"};t(".ButtonIcon_root__VO5jl{display:inline-block;vertical-align:middle}.ButtonIcon_button__gD83m.MuiIconButton-root{border-radius:8px;transition:all .15s cubic-bezier(.4,0,.2,1)}.ButtonIcon_button__gD83m.MuiIconButton-root:hover{backdrop-filter:blur(4px);background:hsla(0,0%,100%,.16)}.ButtonIcon_button__gD83m.ButtonIcon_large__2EddF{padding:8px}.ButtonIcon_button__gD83m.ButtonIcon_medium__-DRWs{padding:6px}.ButtonIcon_button__gD83m.ButtonIcon_large__2EddF .MuiIcon-root,.ButtonIcon_button__gD83m.ButtonIcon_large__2EddF .i-icon,.ButtonIcon_button__gD83m.ButtonIcon_large__2EddF svg,.ButtonIcon_button__gD83m.ButtonIcon_medium__-DRWs .MuiIcon-root,.ButtonIcon_button__gD83m.ButtonIcon_medium__-DRWs .i-icon,.ButtonIcon_button__gD83m.ButtonIcon_medium__-DRWs svg{display:block;height:24px!important;width:24px!important}.ButtonIcon_button__gD83m.ButtonIcon_small__LVDfV{padding:6px}.ButtonIcon_button__gD83m.ButtonIcon_small__LVDfV .MuiIcon-root,.ButtonIcon_button__gD83m.ButtonIcon_small__LVDfV .i-icon,.ButtonIcon_button__gD83m.ButtonIcon_small__LVDfV svg{display:block;height:20px!important;width:20px!important}.ButtonIcon_button__gD83m.ButtonIcon_xsmall__-cDOa{padding:4px}.ButtonIcon_button__gD83m.ButtonIcon_xsmall__-cDOa .MuiIcon-root,.ButtonIcon_button__gD83m.ButtonIcon_xsmall__-cDOa .i-icon,.ButtonIcon_button__gD83m.ButtonIcon_xsmall__-cDOa svg{display:block;height:16px!important;width:16px!important}.ButtonIcon_button__gD83m.ButtonIcon_xsmall__-cDOa.MuiIconButton-root{border-radius:6px}.ButtonIcon_button__gD83m.ButtonIcon_primary__V4ya6{background:var(--palette-primary-main);color:var(--palette-background-b-2)}.ButtonIcon_button__gD83m.ButtonIcon_primary__V4ya6.ButtonIcon_active__432Fb,.ButtonIcon_button__gD83m.ButtonIcon_primary__V4ya6:active,.ButtonIcon_button__gD83m.ButtonIcon_primary__V4ya6:hover{background:var(--palette-primary-light)}.ButtonIcon_button__gD83m.ButtonIcon_primary__V4ya6.ButtonIcon_disabled__mWUEz{background:rgb(from var(--palette-primary-main) r g b/.4);color:var(--palette-background-b-2)}.ButtonIcon_button__gD83m.ButtonIcon_secondary__8ReYC{color:var(--palette-primary-main)}.ButtonIcon_button__gD83m.ButtonIcon_secondary__8ReYC.ButtonIcon_active__432Fb,.ButtonIcon_button__gD83m.ButtonIcon_secondary__8ReYC:active,.ButtonIcon_button__gD83m.ButtonIcon_secondary__8ReYC:hover{color:var(--palette-primary-light)}.ButtonIcon_button__gD83m.ButtonIcon_secondary__8ReYC.ButtonIcon_disabled__mWUEz{color:rgb(from var(--palette-primary-main) r g b/.4)}.ButtonIcon_button__gD83m.ButtonIcon_tertiary__JUuwo{color:var(--palette-primary-text-6)}.ButtonIcon_button__gD83m.ButtonIcon_tertiary__JUuwo.ButtonIcon_active__432Fb,.ButtonIcon_button__gD83m.ButtonIcon_tertiary__JUuwo:active,.ButtonIcon_button__gD83m.ButtonIcon_tertiary__JUuwo:hover{color:var(--palette-primary-text-1)}.ButtonIcon_button__gD83m.ButtonIcon_tertiary__JUuwo.ButtonIcon_disabled__mWUEz{color:var(--palette-primary-text-9)}.ButtonIcon_button__gD83m.ButtonIcon_withBg__ODNab{background:hsla(0,0%,100%,.08)}.ButtonIcon_button__gD83m.ButtonIcon_withBg__ODNab.ButtonIcon_disabled__mWUEz{background:hsla(0,0%,100%,.03)}");export{o as default};
 //# sourceMappingURL=ButtonIcon.scss.js.map

package/componentsV2/ButtonIcon/ButtonIcon.stories.d.ts

@@ -7,4 +7,5 @@ export default meta;
 export declare const Default: (props: Props) => import("react/jsx-runtime").JSX.Element;
 export declare const Sizes: () => import("react/jsx-runtime").JSX.Element;
 export declare const Type: () => import("react/jsx-runtime").JSX.Element;
+export declare const Active: () => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=ButtonIcon.stories.d.ts.map

package/componentsV2/ButtonIcon/ButtonIcon.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ButtonIcon.stories.d.ts","sourceRoot":"","sources":["../../../src/componentsV2/ButtonIcon/ButtonIcon.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAIvC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAI1C,KAAK,KAAK,GAAG,cAAc,CAAC,OAAO,UAAU,CAAC,CAAC;AAE/C,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,KAAK,CAGrB,CAAC;eAqBa,IAAI;AAEnB,eAAO,MAAM,OAAO,UAAW,KAAK,4CAInC,CAAC;AAOF,eAAO,MAAM,KAAK,+CAejB,CAAC;AAUF,eAAO,MAAM,IAAI,+CAkBhB,CAAC"}
+{"version":3,"file":"ButtonIcon.stories.d.ts","sourceRoot":"","sources":["../../../src/componentsV2/ButtonIcon/ButtonIcon.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAIvC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAI1C,KAAK,KAAK,GAAG,cAAc,CAAC,OAAO,UAAU,CAAC,CAAC;AAE/C,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,KAAK,CAGrB,CAAC;eAqBa,IAAI;AAEnB,eAAO,MAAM,OAAO,UAAW,KAAK,4CAInC,CAAC;AAOF,eAAO,MAAM,KAAK,+CAejB,CAAC;AAUF,eAAO,MAAM,IAAI,+CAkBhB,CAAC;AAWF,eAAO,MAAM,MAAM,+CASlB,CAAC"}

package/componentsV2/Chip/Chip.d.ts

@@ -8,6 +8,7 @@ export type ChipProps = {
     suffix?: ReactNode;
     onClick?: MouseEventHandler;
     onDelete?: MouseEventHandler;
+    deleteButtonTooltip?: ReactNode;
     size?: 'xs' | 'small' | 'medium';
     type?: 'default' | 'outlined';
     disabled?: boolean;

package/componentsV2/Chip/Chip.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Chip.d.ts","sourceRoot":"","sources":["../../../src/componentsV2/Chip/Chip.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,aAAa,EAGb,iBAAiB,EACjB,SAAS,EAEV,MAAM,OAAO,CAAC;AASf,MAAM,MAAM,SAAS,GAAG;IACtB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B,QAAQ,CAAC,EAAE,iBAAiB,CAAC;IAC7B,IAAI,CAAC,EAAE,IAAI,GAAG,OAAO,GAAG,QAAQ,CAAC;IACjC,IAAI,CAAC,EAAE,SAAS,GAAG,UAAU,CAAC;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,SAAS,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,GAAG,SAAS,CAAC;IACrF,KAAK,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;IAE3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAkCF,QAAA,MAAM,QAAQ,sGAkEb,CAAC;AAEF,KAAK,QAAQ,GAAG,OAAO,QAAQ,GAAG;IAChC,KAAK,EAAE;QACL,KAAK,EAAE,aAAa,CAAC;YAAE,SAAS,CAAC,EAAE,MAAM,CAAA;SAAE,CAAC,CAAC;QAC7C,SAAS,EAAE,aAAa,CAAC;YAAE,SAAS,CAAC,EAAE,MAAM,CAAC;YAAC,QAAQ,CAAC,EAAE,SAAS,CAAA;SAAE,CAAC,CAAC;QACvE,GAAG,EAAE,aAAa,CAAC;YAAE,SAAS,CAAC,EAAE,MAAM,CAAC;YAAC,KAAK,CAAC,EAAE,MAAM,CAAA;SAAE,CAAC,CAAC;KAC5D,CAAC;CACH,CAAC;AAsBF,eAAO,MAAM,IAAI,EAAe,QAAQ,CAAC"}
+{"version":3,"file":"Chip.d.ts","sourceRoot":"","sources":["../../../src/componentsV2/Chip/Chip.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,aAAa,EAGb,iBAAiB,EACjB,SAAS,EAEV,MAAM,OAAO,CAAC;AAUf,MAAM,MAAM,SAAS,GAAG;IACtB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B,QAAQ,CAAC,EAAE,iBAAiB,CAAC;IAC7B,mBAAmB,CAAC,EAAE,SAAS,CAAC;IAChC,IAAI,CAAC,EAAE,IAAI,GAAG,OAAO,GAAG,QAAQ,CAAC;IACjC,IAAI,CAAC,EAAE,SAAS,GAAG,UAAU,CAAC;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,SAAS,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,GAAG,SAAS,CAAC;IACrF,KAAK,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;IAE3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAkCF,QAAA,MAAM,QAAQ,sGA4Eb,CAAC;AAEF,KAAK,QAAQ,GAAG,OAAO,QAAQ,GAAG;IAChC,KAAK,EAAE;QACL,KAAK,EAAE,aAAa,CAAC;YAAE,SAAS,CAAC,EAAE,MAAM,CAAA;SAAE,CAAC,CAAC;QAC7C,SAAS,EAAE,aAAa,CAAC;YAAE,SAAS,CAAC,EAAE,MAAM,CAAC;YAAC,QAAQ,CAAC,EAAE,SAAS,CAAA;SAAE,CAAC,CAAC;QACvE,GAAG,EAAE,aAAa,CAAC;YAAE,SAAS,CAAC,EAAE,MAAM,CAAC;YAAC,KAAK,CAAC,EAAE,MAAM,CAAA;SAAE,CAAC,CAAC;KAC5D,CAAC;CACH,CAAC;AAsBF,eAAO,MAAM,IAAI,EAAe,QAAQ,CAAC"}

package/componentsV2/Chip/Chip.js

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

@@ -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';\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  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      // 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    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        {onDelete && (\n          <div className={styles.deleteIcon}>\n            <CloseSmallIcon onClick={onDeleteHandler} size={16} />\n          </div>\n        )}\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","rest","_objectWithoutProperties","_excluded","onClickHandler","undefined","onDeleteHandler","useCallback","e","stopPropagation","_jsxs","_objectSpread","classNames","root","hoverable","withPrefix","withSuffix","isValidElement","cloneElement","_jsx","label","deleteIcon","CloseSmallIcon","Affix","Check","_ref2","CheckSmallIcon","checkAffix","Dot","_ref3","color","dotAffix","style","background","Indicator","props","actualSize","ChipIndicator","indicatorAffix","Chip"],"mappings":"mtJAoCA,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,EAiBEC,GACG,IAhBDC,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,EAEZE,EAAIC,EAAAnB,EAAAoB,GAIHC,EAAiBnB,OAAWoB,EAAYd,EACxCe,EAAkBC,GACtB,SAAAC,GACEA,EAAEC,kBACFjB,SAAAA,EAAWgB,EACb,GACA,CAAChB,IAGH,OACEkB,EAAA,MAAAC,EAAAA,EAAA,CACEtB,UAAWuB,EACTnD,EAAOoD,KACPT,GAAkB3C,EAAOqD,UACzB7B,GAAYxB,EAAOwB,SACnBC,GAAUzB,EAAOsD,YAChBvB,GAAYL,IAAW1B,EAAOuD,WAC/BpD,EAAe8B,GACfnC,EAAeqC,GACf1B,EAAgB4B,GAChBpB,EAAgBsB,GAChBX,GAEFE,QAASa,EACT,cAAahB,EACbJ,IAAKA,GACDiB,GAAI,GAAA,CAAAX,SAEPJ,CAAAA,GAAU+B,EAAe/B,GACtBgC,EAAahC,EAAQ,CAAEQ,KAAMzB,EAAmByB,KAChDR,EAEJiC,EAAA,MAAA,CAAK9B,UAAW5B,EAAO2D,MAAM9B,SAAEA,IAE9BH,GAAU8B,EAAe9B,GACtB+B,EAAa/B,EAAQ,CAAEO,KAAMzB,EAAmByB,KAChDP,EAEHK,GACC2B,EAAA,MAAA,CAAK9B,UAAW5B,EAAO4D,WAAW/B,SAChC6B,EAACG,EAAc,CAAC/B,QAASe,EAAiBZ,KAAM,UAK1D,IAWDb,EAAsB0C,MAAQ,CAC7BC,MAAO,SAAAC,GAAA,IAAG/B,IAAAA,KAAML,IAAAA,UAAS,OACvB8B,EAACO,EAAc,CAAChC,KAAMA,EAAML,UAAWuB,EAAWnD,EAAOkE,WAAYtC,IACtE,EACDuC,IAAK,SAAAC,GAAA,IAAGxC,IAAAA,UAAWyC,IAAAA,MAAK,OACtBX,EAAA,MAAA,CAAK9B,UAAWuB,EAAWnD,EAAOsE,SAAU1C,GAAY2C,MAAO,CAAEC,WAAYH,IAC9E,EACDI,UAAW,SAACC,GACV,IAAMC,EAAaD,EAAMzC,OAASzB,EAAmBJ,OAAS,SAAW,QACzE,OACEsD,EAACkB,EAAa,CACZhD,UAAWuB,EAAWnD,EAAO6E,eAAgBH,EAAM9C,WACnDK,KAAM0C,EAAW9C,SAEhB6C,EAAM7C,UAGb,GAGK,IAAMiD,EAAO1D"}
+{"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"}

package/componentsV2/Chip/Chip.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Chip.stories.d.ts","sourceRoot":"","sources":["../../../src/componentsV2/Chip/Chip.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,cAAc,EAAY,MAAM,OAAO,CAAC;AAQjD,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAI9B,KAAK,KAAK,GAAG,cAAc,CAAC,OAAO,IAAI,CAAC,CAAC;AAOzC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,KAAK,CAGrB,CAAC;eAmBa,IAAI;AAEnB,eAAO,MAAM,OAAO,UAAW,KAAK,4CAAwB,CAAC;AAE7D,eAAO,MAAM,KAAK,+CAKjB,CAAC;AAQF,eAAO,MAAM,KAAK,+CAKjB,CAAC;AAQF,eAAO,MAAM,MAAM,+CA0ClB,CAAC;AAQF,eAAO,MAAM,eAAe,+CA2F3B,CAAC;AAQF,eAAO,MAAM,aAAa,+CAgBzB,CAAC;AASF,eAAO,MAAM,YAAY,+CAAwD,CAAC;AAoBlF,eAAO,MAAM,MAAM,+CA6BlB,CAAC;AAcF,eAAO,MAAM,iBAAiB,+CAS7B,CAAC"}
+{"version":3,"file":"Chip.stories.d.ts","sourceRoot":"","sources":["../../../src/componentsV2/Chip/Chip.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,cAAc,EAAY,MAAM,OAAO,CAAC;AAQjD,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAI9B,KAAK,KAAK,GAAG,cAAc,CAAC,OAAO,IAAI,CAAC,CAAC;AAOzC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,KAAK,CAGrB,CAAC;eAoBa,IAAI;AAEnB,eAAO,MAAM,OAAO,UAAW,KAAK,4CAAwB,CAAC;AAE7D,eAAO,MAAM,KAAK,+CAKjB,CAAC;AAQF,eAAO,MAAM,KAAK,+CAKjB,CAAC;AAQF,eAAO,MAAM,MAAM,+CA0ClB,CAAC;AAQF,eAAO,MAAM,eAAe,+CA2F3B,CAAC;AAQF,eAAO,MAAM,aAAa,+CAgBzB,CAAC;AASF,eAAO,MAAM,YAAY,+CAOxB,CAAC;AAuBF,eAAO,MAAM,MAAM,+CA6BlB,CAAC;AAcF,eAAO,MAAM,iBAAiB,+CAS7B,CAAC"}

package/componentsV2/ColorPicker/ColorPicker.d.ts

@@ -22,8 +22,9 @@ export type ColorPickerProps = {
     popoverPlacement?: PopoverProps['placement'];
     onOpen?: () => void;
     onClose?: () => void;
+    elementsClassNames?: Partial<Omit<Required<TextInputNextProps>['elementsClassNames'], 'message' | 'numberStepButtons' | 'prefix' | 'suffix'> & Record<'indicator' | 'popover', string>>;
     className?: string;
     testId?: string;
 };
-export declare const ColorPicker: ({ format, className, label, labelPlacement, popoverPlacement, testId, disabled, size, onOpen, onClose, value, onChange, disableOpacityDrag, enableAlpha, }: ColorPickerProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ColorPicker: ({ format, className, label, labelPlacement, popoverPlacement, testId, disabled, size, onOpen, onClose, value, onChange, disableOpacityDrag, enableAlpha, elementsClassNames, }: ColorPickerProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=ColorPicker.d.ts.map

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

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

package/componentsV2/ColorPicker/ColorPicker.js

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

package/componentsV2/ColorPicker/ColorPicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"ColorPicker.js","sources":["../../../src/componentsV2/ColorPicker/ColorPicker.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport {\n  CSSProperties,\n  KeyboardEventHandler,\n  MouseEventHandler,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { ChromePicker, ColorResult } from 'react-color';\nimport { throttle } from 'lodash';\nimport { v4 as uuidv4 } from 'uuid';\n\nimport { TextInputNext, TextInputNextProps } from '../TextInputNext';\nimport { Popover, PopoverProps } from '../Popover';\nimport { ButtonIcon } from '../ButtonIcon';\nimport { Tooltip } from '../Tooltip';\nimport useOutsideClick from '../../effects/useOutsideClick';\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  className?: string;\n  testId?: string;\n};\n\nconst SizeToClassMap: Record<Required<ColorPickerProps>['size'], string> = {\n  small: styles.small,\n  medium: styles.medium,\n  large: styles.large,\n};\n\nconst elementsClassNames: TextInputNextProps['elementsClassNames'] = {\n  inputContainer: styles.inputContainer,\n  numberStepButtons: styles.numberStepButtons,\n  prefix: styles.prefixContainer,\n  suffix: styles.suffixContainer,\n  input: styles.input,\n  label: styles.label,\n};\n\ntype FocusTarget = 'palette' | 'picker';\n\nexport const ColorPicker = ({\n  format = 'hex',\n  className,\n  label,\n  labelPlacement = 'top',\n  popoverPlacement = 'bottom-start',\n  testId,\n  disabled,\n  size = 'small',\n  onOpen,\n  onClose,\n  value = defaultColor,\n  onChange,\n  disableOpacityDrag,\n  enableAlpha = false,\n}: ColorPickerProps) => {\n  const valueChannels = useMemo(() => {\n    try {\n      const channels = parseColor(value);\n\n      return { ...channels, a: enableAlpha ? channels.a : 1 };\n    } catch (_) {\n      return parseColor(defaultColor);\n    }\n  }, [value, enableAlpha]);\n\n  const [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  useOutsideClick(popoverRef, closeMenu, [inputContainerRef.current]);\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(styles.indicator, internalValue.a === 0 && styles.transparent)}\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          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={elementsClassNames}\n      />\n\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        )}\n        backdrop={false}\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  );\n};\n"],"names":["SizeToClassMap","small","styles","medium","large","elementsClassNames","inputContainer","numberStepButtons","prefix","prefixContainer","suffix","suffixContainer","input","label","ColorPicker","_ref","_ref$format","format","className","_ref$labelPlacement","labelPlacement","_ref$popoverPlacement","popoverPlacement","testId","disabled","_ref$size","size","onOpen","onClose","_ref$value","value","defaultColor","onChange","disableOpacityDrag","_ref$enableAlpha","enableAlpha","valueChannels","useMemo","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","useOutsideClick","inputValue","hasVerticalMargin","startsWith","hasHorizontalMargin","accessibleLabel","_jsxs","_Fragment","children","_jsx","id","htmlFor","TextInputNext","Label","hidden","undefined","inputHtmlAttributes","rootTagName","fakeValue","fakeValuePercent","ref","classNames","indicator","transparent","style","onClick","role","tabIndex","OpacityDragTracker","onDrag","onDragEnd","root","noAlpha","onFocus","inputType","inputMode","htmlAttributes","Popover","anchorEl","open","placement","popover","marginVertical","marginHorizontal","isTransparent","backdrop","Swatches","addTransparent","autoFocus","onAutoFocus","pickerContainer","ChromePicker","onChangeComplete","disableAlpha","picker","switchButtons","Tooltip","title","ButtonIcon","ariaLabel","type","PaletteIcon","PickerIcon"],"mappings":"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"}
+{"version":3,"file":"ColorPicker.js","sources":["../../../src/componentsV2/ColorPicker/ColorPicker.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport {\n  CSSProperties,\n  KeyboardEventHandler,\n  MouseEventHandler,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { ChromePicker, ColorResult } from 'react-color';\nimport { throttle } from 'lodash';\nimport { v4 as uuidv4 } from 'uuid';\n\nimport { TextInputNext, TextInputNextProps } from '../TextInputNext';\nimport { Popover, PopoverProps } from '../Popover';\nimport { ButtonIcon } from '../ButtonIcon';\nimport { Tooltip } from '../Tooltip';\nimport { Popper } from '../Popper';\n\nimport { Swatches } from './Swatches';\nimport { 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/ColorPicker.scss.js

@@ -1,2 +1,2 @@
-import i from'./../../ext-esm/style-inject/dist/style-inject.es.js';var r={spacing:"8",root:"ColorPicker_root__cuK3O",inputContainer:"ColorPicker_inputContainer__m2fxo",label:"ColorPicker_label__c3tdQ",indicator:"ColorPicker_indicator__8cXCM",transparent:"ColorPicker_transparent__qdIVz",popover:"ColorPicker_popover__XC1n6",marginVertical:"ColorPicker_marginVertical__NvPrm",marginHorizontal:"ColorPicker_marginHorizontal__OU5sQ",switchButtons:"ColorPicker_switchButtons__XSdR3",numberStepButtons:"ColorPicker_numberStepButtons__8ed-p",prefixContainer:"ColorPicker_prefixContainer__XyJxU",suffixContainer:"ColorPicker_suffixContainer__KzygM",fakeValue:"ColorPicker_fakeValue__L1ty9",fakeValuePercent:"ColorPicker_fakeValuePercent__fBPcp",small:"ColorPicker_small__aZqd8",medium:"ColorPicker_medium__dMpzx",large:"ColorPicker_large__lyQRv",noAlpha:"ColorPicker_noAlpha__o9BSY",input:"ColorPicker_input__59TsK",pickerContainer:"ColorPicker_pickerContainer__ASGM6",picker:"ColorPicker_picker__GHZdT",active:"ColorPicker_active__DFLPz",isTransparent:"ColorPicker_isTransparent__TPLhY"};i('.ColorPicker_root__cuK3O{pointer-events:none}.ColorPicker_root__cuK3O .ColorPicker_inputContainer__m2fxo{flex:0 0 auto;pointer-events:auto;width:var(--corvaui-colorpicker-fieldwidth)}.ColorPicker_root__cuK3O .ColorPicker_label__c3tdQ{display:table;pointer-events:auto}.ColorPicker_indicator__8cXCM{background:#fff repeating-conic-gradient(#ccc 0 25%,transparent 0 50%) 50%;background-size:4px 4px;border-radius:6px;cursor:pointer;height:var(--corvaui-colorpicker-indicatorsize);margin:-1px;overflow:hidden;position:relative;width:var(--corvaui-colorpicker-indicatorsize)}.ColorPicker_indicator__8cXCM:before{border:1px solid red;border-radius:2px;content:"";left:50%;position:absolute;top:50%;transform:translate(-50%,-50%) rotate(-45deg);width:90%}.ColorPicker_indicator__8cXCM:focus-visible{box-shadow:0 0 0 1px var(--palette-primary-main),0 0 0 5px rgb(from var(--palette-primary-main) r g b/.12);outline:2px solid transparent}.ColorPicker_indicator__8cXCM:after{background:var(--corvaui-colorpicker-indicatorcolor);content:"";inset:0;position:absolute;transition:opacity .15s cubic-bezier(.4,0,.2,1)}.ColorPicker_transparent__qdIVz:after{opacity:0}.ColorPicker_popover__XC1n6{--corvaui-background:$palette_b8;background-color:var(--palette-background-b-8);overflow:hidden;width:230px!important}.ColorPicker_marginVertical__NvPrm{margin:8px 0}.ColorPicker_marginHorizontal__OU5sQ{margin:0 8px}.ColorPicker_switchButtons__XSdR3{display:flex;flex-flow:row nowrap;gap:4px;justify-content:center;padding:8px}.ColorPicker_numberStepButtons__8ed-p{display:none}.ColorPicker_prefixContainer__XyJxU,.ColorPicker_suffixContainer__KzygM{position:relative}.ColorPicker_fakeValue__L1ty9{color:transparent;left:calc(100% + 8px);pointer-events:none;position:absolute;top:50%;transform:translateY(-50%);user-select:none}.ColorPicker_fakeValuePercent__fBPcp{color:var(--palette-primary-text-1)}.ColorPicker_small__aZqd8{--corvaui-colorpicker-indicatorsize:20px;--corvaui-colorpicker-fieldwidth:78px}.ColorPicker_medium__dMpzx{--corvaui-colorpicker-indicatorsize:24px;--corvaui-colorpicker-fieldwidth:82px}.ColorPicker_large__lyQRv{--corvaui-colorpicker-indicatorsize:28px;--corvaui-colorpicker-fieldwidth:91px}.ColorPicker_noAlpha__o9BSY .ColorPicker_inputContainer__m2fxo{display:inline-block;vertical-align:top;width:auto}.ColorPicker_noAlpha__o9BSY .ColorPicker_fakeValue__L1ty9,.ColorPicker_noAlpha__o9BSY .ColorPicker_input__59TsK{display:none}.ColorPicker_pickerContainer__ASGM6 [data-color-picker-control]:focus-visible{border-radius:4px;box-shadow:0 0 0 1px var(--palette-primary-main),0 0 0 5px rgb(from var(--palette-primary-main) r g b/.12);outline:2px solid transparent}.ColorPicker_picker__GHZdT{background:transparent!important;border-radius:0!important;box-shadow:none!important;width:100%!important}.ColorPicker_picker__GHZdT .hue-horizontal{border-radius:5px}.ColorPicker_picker__GHZdT>div:first-child{height:135px;padding:0!important}.ColorPicker_picker__GHZdT>div:last-child{padding:0!important}.ColorPicker_picker__GHZdT>div:last-child>div:first-child{align-items:center!important;display:flex!important;flex-flow:row nowrap!important;gap:16px!important;overflow:hidden!important;padding:16px!important}.ColorPicker_picker__GHZdT>div:last-child>div:first-child>div:first-child{flex:0 0 auto!important;width:auto!important}.ColorPicker_picker__GHZdT>div:last-child>div:first-child>div:first-child>div{background-color:#fff!important;border-radius:4px!important;box-shadow:none!important;height:32px!important;margin:0!important;overflow:hidden!important;width:32px!important}.ColorPicker_picker__GHZdT>div:last-child>div:first-child>div:first-child>div>div:first-child{animation-name:ColorPicker_active__DFLPz;border-radius:0!important;box-shadow:none!important}.ColorPicker_picker__GHZdT>div:last-child>div:first-child>div:last-child{padding-left:6px!important}.ColorPicker_picker__GHZdT>div:last-child>div:first-child>div:last-child>div:first-child{margin:0!important}.ColorPicker_picker__GHZdT>div:last-child>div:first-child>div:last-child>div:last-child{margin-top:12px!important}.ColorPicker_picker__GHZdT>div:last-child>div:first-child>div:last-child>div:last-child>div>div:first-child{display:none}.ColorPicker_picker__GHZdT>div:last-child>div:first-child>div:last-child>div:last-child>div>div:nth-child(2){border-radius:5px!important}.ColorPicker_picker__GHZdT>div:last-child>div:first-child>div:last-child>div:last-child>div>div:last-child{margin:0!important}.ColorPicker_picker__GHZdT>div:last-child>div:last-child{display:none!important}.ColorPicker_isTransparent__TPLhY .ColorPicker_picker__GHZdT>div:last-child>div:first-child>div:first-child>div>div:last-child{position:relative}.ColorPicker_isTransparent__TPLhY .ColorPicker_picker__GHZdT>div:last-child>div:first-child>div:first-child>div>div:last-child:before{border:2px solid red;border-radius:2px;content:"";left:50%;position:absolute;top:50%;transform:translate(-50%,-50%) rotate(-45deg);width:90%}');export{r as default};
+import i from'./../../ext-esm/style-inject/dist/style-inject.es.js';var r={spacing:"8",root:"ColorPicker_root__cuK3O",inputContainer:"ColorPicker_inputContainer__m2fxo",label:"ColorPicker_label__c3tdQ",indicator:"ColorPicker_indicator__8cXCM",transparent:"ColorPicker_transparent__qdIVz",popover:"ColorPicker_popover__XC1n6",marginVertical:"ColorPicker_marginVertical__NvPrm",marginHorizontal:"ColorPicker_marginHorizontal__OU5sQ",switchButtons:"ColorPicker_switchButtons__XSdR3",numberStepButtons:"ColorPicker_numberStepButtons__8ed-p",prefixContainer:"ColorPicker_prefixContainer__XyJxU",suffixContainer:"ColorPicker_suffixContainer__KzygM",fakeValue:"ColorPicker_fakeValue__L1ty9",fakeValuePercent:"ColorPicker_fakeValuePercent__fBPcp",small:"ColorPicker_small__aZqd8",medium:"ColorPicker_medium__dMpzx",large:"ColorPicker_large__lyQRv",noAlpha:"ColorPicker_noAlpha__o9BSY",input:"ColorPicker_input__59TsK",dragTrackerPopper:"ColorPicker_dragTrackerPopper__zaNX-",pickerContainer:"ColorPicker_pickerContainer__ASGM6",picker:"ColorPicker_picker__GHZdT",active:"ColorPicker_active__DFLPz",isTransparent:"ColorPicker_isTransparent__TPLhY"};i('.ColorPicker_root__cuK3O{pointer-events:none}.ColorPicker_root__cuK3O .ColorPicker_inputContainer__m2fxo{flex:0 0 auto;pointer-events:auto;width:var(--corvaui-colorpicker-fieldwidth)}.ColorPicker_root__cuK3O .ColorPicker_label__c3tdQ{display:table;pointer-events:auto}.ColorPicker_indicator__8cXCM{background:#fff repeating-conic-gradient(#ccc 0 25%,transparent 0 50%) 50%;background-size:4px 4px;border-radius:6px;cursor:pointer;height:var(--corvaui-colorpicker-indicatorsize);margin:-1px;overflow:hidden;position:relative;width:var(--corvaui-colorpicker-indicatorsize)}.ColorPicker_indicator__8cXCM:before{border:1px solid red;border-radius:2px;content:"";left:50%;position:absolute;top:50%;transform:translate(-50%,-50%) rotate(-45deg);width:90%}.ColorPicker_indicator__8cXCM:focus-visible{box-shadow:0 0 0 1px var(--palette-primary-main),0 0 0 5px rgb(from var(--palette-primary-main) r g b/.12);outline:2px solid transparent}.ColorPicker_indicator__8cXCM:after{background:var(--corvaui-colorpicker-indicatorcolor);content:"";inset:0;position:absolute;transition:opacity .15s cubic-bezier(.4,0,.2,1)}.ColorPicker_transparent__qdIVz:after{opacity:0}.ColorPicker_popover__XC1n6{--corvaui-background:$palette_b8;background-color:var(--palette-background-b-8);overflow:hidden;width:230px!important}.ColorPicker_marginVertical__NvPrm{margin:8px 0}.ColorPicker_marginHorizontal__OU5sQ{margin:0 8px}.ColorPicker_switchButtons__XSdR3{display:flex;flex-flow:row nowrap;gap:4px;justify-content:center;padding:8px}.ColorPicker_numberStepButtons__8ed-p{display:none}.ColorPicker_prefixContainer__XyJxU,.ColorPicker_suffixContainer__KzygM{position:relative}.ColorPicker_fakeValue__L1ty9{color:transparent;left:calc(100% + 8px);pointer-events:none;position:absolute;top:50%;transform:translateY(-50%);user-select:none}.ColorPicker_fakeValuePercent__fBPcp{color:var(--palette-primary-text-1)}.ColorPicker_small__aZqd8{--corvaui-colorpicker-indicatorsize:20px;--corvaui-colorpicker-fieldwidth:78px}.ColorPicker_medium__dMpzx{--corvaui-colorpicker-indicatorsize:24px;--corvaui-colorpicker-fieldwidth:82px}.ColorPicker_large__lyQRv{--corvaui-colorpicker-indicatorsize:28px;--corvaui-colorpicker-fieldwidth:91px}.ColorPicker_noAlpha__o9BSY .ColorPicker_inputContainer__m2fxo{display:inline-block;vertical-align:top;width:auto}.ColorPicker_noAlpha__o9BSY .ColorPicker_fakeValue__L1ty9,.ColorPicker_noAlpha__o9BSY .ColorPicker_input__59TsK{display:none}.ColorPicker_dragTrackerPopper__zaNX-{margin-left:-8px;z-index:var(--z-index-modal)}.ColorPicker_pickerContainer__ASGM6 [data-color-picker-control]:focus-visible{border-radius:4px;box-shadow:0 0 0 1px var(--palette-primary-main),0 0 0 5px rgb(from var(--palette-primary-main) r g b/.12);outline:2px solid transparent}.ColorPicker_picker__GHZdT{background:transparent!important;border-radius:0!important;box-shadow:none!important;width:100%!important}.ColorPicker_picker__GHZdT .hue-horizontal{border-radius:5px}.ColorPicker_picker__GHZdT>div:first-child{height:135px;padding:0!important}.ColorPicker_picker__GHZdT>div:last-child{padding:0!important}.ColorPicker_picker__GHZdT>div:last-child>div:first-child{align-items:center!important;display:flex!important;flex-flow:row nowrap!important;gap:16px!important;overflow:hidden!important;padding:16px!important}.ColorPicker_picker__GHZdT>div:last-child>div:first-child>div:first-child{flex:0 0 auto!important;width:auto!important}.ColorPicker_picker__GHZdT>div:last-child>div:first-child>div:first-child>div{background-color:#fff!important;border-radius:4px!important;box-shadow:none!important;height:32px!important;margin:0!important;overflow:hidden!important;width:32px!important}.ColorPicker_picker__GHZdT>div:last-child>div:first-child>div:first-child>div>div:first-child{animation-name:ColorPicker_active__DFLPz;border-radius:0!important;box-shadow:none!important}.ColorPicker_picker__GHZdT>div:last-child>div:first-child>div:last-child{padding-left:6px!important}.ColorPicker_picker__GHZdT>div:last-child>div:first-child>div:last-child>div:first-child{margin:0!important}.ColorPicker_picker__GHZdT>div:last-child>div:first-child>div:last-child>div:last-child{margin-top:12px!important}.ColorPicker_picker__GHZdT>div:last-child>div:first-child>div:last-child>div:last-child>div>div:first-child{display:none}.ColorPicker_picker__GHZdT>div:last-child>div:first-child>div:last-child>div:last-child>div>div:nth-child(2){border-radius:5px!important}.ColorPicker_picker__GHZdT>div:last-child>div:first-child>div:last-child>div:last-child>div>div:last-child{margin:0!important}.ColorPicker_picker__GHZdT>div:last-child>div:last-child{display:none!important}.ColorPicker_isTransparent__TPLhY .ColorPicker_picker__GHZdT>div:last-child>div:first-child>div:first-child>div>div:last-child{position:relative}.ColorPicker_isTransparent__TPLhY .ColorPicker_picker__GHZdT>div:last-child>div:first-child>div:first-child>div>div:last-child:before{border:2px solid red;border-radius:2px;content:"";left:50%;position:absolute;top:50%;transform:translate(-50%,-50%) rotate(-45deg);width:90%}');export{r as default};
 //# sourceMappingURL=ColorPicker.scss.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"ColorPicker.stories.d.ts","sourceRoot":"","sources":["../../../src/componentsV2/ColorPicker/ColorPicker.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,cAAc,EAAY,MAAM,OAAO,CAAC;AAKjD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAE5C,KAAK,KAAK,GAAG,cAAc,CAAC,OAAO,WAAW,CAAC,CAAC;AAEhD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,KAAK,CAGrB,CAAC;eAea,IAAI;AAEnB,eAAO,MAAM,OAAO,UAAW,KAAK,4CAYnC,CAAC;AASF,eAAO,MAAM,KAAK,+CAqBjB,CAAC;AASF,eAAO,MAAM,cAAc,+CAM1B,CAAC;AAKF,eAAO,MAAM,mBAAmB,+CAU/B,CAAC;AAMF,eAAO,MAAM,YAAY,+CAyCxB,CAAC;AAOF,eAAO,MAAM,aAAa,+CAiBzB,CAAC"}
+{"version":3,"file":"ColorPicker.stories.d.ts","sourceRoot":"","sources":["../../../src/componentsV2/ColorPicker/ColorPicker.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,cAAc,EAAY,MAAM,OAAO,CAAC;AAKjD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAE5C,KAAK,KAAK,GAAG,cAAc,CAAC,OAAO,WAAW,CAAC,CAAC;AAEhD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,KAAK,CAGrB,CAAC;eAgBa,IAAI;AAEnB,eAAO,MAAM,OAAO,UAAW,KAAK,4CAYnC,CAAC;AASF,eAAO,MAAM,KAAK,+CAqBjB,CAAC;AASF,eAAO,MAAM,cAAc,+CAM1B,CAAC;AAKF,eAAO,MAAM,mBAAmB,+CAU/B,CAAC;AAMF,eAAO,MAAM,YAAY,+CAyCxB,CAAC;AAOF,eAAO,MAAM,aAAa,+CAiBzB,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"OpacityDragtracker.d.ts","sourceRoot":"","sources":["../../../../src/componentsV2/ColorPicker/OpacityDragtracker/OpacityDragtracker.tsx"],"names":[],"mappings":"AAcA,MAAM,MAAM,gBAAgB,GAAG;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;CACxB,CAAC;AAIF,eAAO,MAAM,kBAAkB,iCAAsC,gBAAgB,4CAsGpF,CAAC"}
+{"version":3,"file":"OpacityDragtracker.d.ts","sourceRoot":"","sources":["../../../../src/componentsV2/ColorPicker/OpacityDragtracker/OpacityDragtracker.tsx"],"names":[],"mappings":"AAcA,MAAM,MAAM,gBAAgB,GAAG;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;CACxB,CAAC;AAIF,eAAO,MAAM,kBAAkB,iCAAsC,gBAAgB,4CAuGpF,CAAC"}

package/componentsV2/ColorPicker/OpacityDragtracker/OpacityDragtracker.js

@@ -1,2 +1,2 @@
-import e from"@babel/runtime/helpers/slicedToArray";import{useRef as r,useState as a,useCallback as t,useEffect as n}from"react";import o from"classnames";import i from"./OpacityDragTracker.scss.js";import{jsx as u}from"react/jsx-runtime";var c=function(e){return Math.min(100,Math.max(0,e))},s=function(s){var m=s.value,l=void 0===m?0:m,v=s.onDrag,f=s.onDragEnd,d=r(null),p=a(!1),g=e(p,2),h=g[0],w=g[1],b=Math.round(l),D=t((function(e){e.preventDefault(),w(!1),null==f||f()}),[f]),k=t((function(e){e.preventDefault(),w(!0)}),[]),x=t((function(e){var r=e.currentTarget.getBoundingClientRect(),a=100*(e.clientX-r.left-5)/(r.width-10),t=Math.min(100,Math.max(0,a));null==v||v(t)}),[v]),y=t((function(e){var r,a=e.shiftKey?10:1;switch(e.key){case"ArrowRight":case"ArrowUp":r=c(b+a);break;case"ArrowLeft":case"ArrowDown":r=c(b-a);break;case"PageUp":r=c(b+10);break;case"PageDown":r=c(b-10);break;case"Home":r=0;break;case"End":r=100;break;default:return}e.preventDefault(),null==v||v(r)}),[v,b]);return n((function(){if(h&&d.current){var e=d.current;return document.addEventListener("mouseup",D),e.addEventListener("mousemove",x),function(){document.removeEventListener("mouseup",D),e.removeEventListener("mousemove",x)}}}),[h,D,x]),u("div",{onMouseDown:k,onKeyDown:y,ref:d,className:o(i.root,h&&i.dragging),role:"slider","aria-label":"Opacity","aria-valuemin":0,"aria-valuemax":100,"aria-valuenow":b,"aria-valuetext":"".concat(b,"% opacity"),"aria-orientation":"horizontal",tabIndex:0})};export{s as OpacityDragTracker};
+import e from"@babel/runtime/helpers/slicedToArray";import{useRef as r,useState as a,useCallback as t,useEffect as n}from"react";import o from"classnames";import i from"./OpacityDragTracker.scss.js";import{jsx as u}from"react/jsx-runtime";var c=function(e){return Math.min(100,Math.max(0,e))},s=function(s){var m=s.value,l=void 0===m?0:m,v=s.onDrag,f=s.onDragEnd,p=r(null),d=a(!1),g=e(d,2),h=g[0],w=g[1],b=Math.round(l),D=t((function(e){e.preventDefault(),e.stopPropagation(),w(!1),null==f||f()}),[f]),k=t((function(e){e.preventDefault(),w(!0)}),[]),x=t((function(e){var r=e.currentTarget.getBoundingClientRect(),a=100*(e.clientX-r.left-5)/(r.width-10),t=Math.min(100,Math.max(0,a));null==v||v(t)}),[v]),y=t((function(e){var r,a=e.shiftKey?10:1;switch(e.key){case"ArrowRight":case"ArrowUp":r=c(b+a);break;case"ArrowLeft":case"ArrowDown":r=c(b-a);break;case"PageUp":r=c(b+10);break;case"PageDown":r=c(b-10);break;case"Home":r=0;break;case"End":r=100;break;default:return}e.preventDefault(),null==v||v(r)}),[v,b]);return n((function(){if(h&&p.current){var e=p.current;return document.addEventListener("mouseup",D),e.addEventListener("mousemove",x),function(){document.removeEventListener("mouseup",D),e.removeEventListener("mousemove",x)}}}),[h,D,x]),u("div",{onMouseDown:k,onKeyDown:y,ref:p,className:o(i.root,h&&i.dragging),role:"slider","aria-label":"Opacity","aria-valuemin":0,"aria-valuemax":100,"aria-valuenow":b,"aria-valuetext":"".concat(b,"% opacity"),"aria-orientation":"horizontal",tabIndex:0})};export{s as OpacityDragTracker};
 //# sourceMappingURL=OpacityDragtracker.js.map