@vibe/core 3.77.1-alpha-eb809.0 → 3.77.1-alpha-4a3fa.0

package/dist/mocked_classnames/src/components/Steps/StepsCommand.js.map

@@ -1 +1 @@
-{"version":3,"file":"StepsCommand.js","sources":["../../../../../src/components/Steps/StepsCommand.tsx"],"sourcesContent":["import React, { type FC, useCallback, useMemo } from \"react\";\nimport cx from \"classnames\";\nimport { NavigationChevronRight, NavigationChevronLeft } from \"@vibe/icons\";\nimport { Icon } from \"@vibe/icon\";\nimport { Button, type ButtonProps } from \"@vibe/button\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport { BACK_TEXT, NEXT_TEXT } from \"./StepsConstants\";\nimport { type StepsColor } from \"./Steps.types\";\nimport type VibeComponentProps from \"../../types/VibeComponentProps\";\nimport { ComponentDefaultTestId } from \"../../tests/constants\";\nimport styles from \"./StepsCommand.module.scss\";\nimport { camelCase } from \"es-toolkit\";\nimport { getStyle } from \"../..//helpers/typesciptCssModulesHelper\";\n\nexport interface StepsCommandProps extends VibeComponentProps {\n  /**\n   * If true, this button is for moving to the next step.\n   */\n  isNext?: boolean;\n  /**\n   * Callback fired when the active step changes.\n   */\n  onChangeActiveStep?: (e: React.MouseEvent, newStepIndex: number) => void;\n  /**\n   * The index of the currently active step.\n   */\n  activeStepIndex: number;\n  /**\n   * The total number of steps.\n   */\n  stepsCount: number;\n  /**\n   * If true, hides the navigation icon.\n   */\n  isIconHidden?: boolean;\n  /**\n   * Props applied to the button.\n   */\n  buttonProps?: Partial<ButtonProps>;\n  /**\n   * The color theme of the button.\n   */\n  color?: StepsColor;\n}\n\nexport const StepsCommand: FC<StepsCommandProps> = ({\n  isNext = false,\n  onChangeActiveStep = NOOP,\n  activeStepIndex,\n  stepsCount,\n  isIconHidden = false,\n  buttonProps = {},\n  color = \"primary\"\n}: StepsCommandProps) => {\n  const { children: buttonChildren, ...otherButtonProps } = buttonProps;\n  const description = useMemo(() => {\n    if (buttonChildren) return buttonChildren;\n    return isNext ? NEXT_TEXT : BACK_TEXT;\n  }, [isNext, buttonChildren]);\n  const newStepIndex = isNext ? activeStepIndex + 1 : activeStepIndex - 1;\n  const onClick = useCallback(\n    (e: React.MouseEvent) => onChangeActiveStep(e, newStepIndex),\n    [newStepIndex, onChangeActiveStep]\n  );\n  const isDisabled = (isNext && activeStepIndex === stepsCount - 1) || (!isNext && activeStepIndex === 0);\n\n  const icon = isNext ? NavigationChevronRight : NavigationChevronLeft;\n  return (\n    <Button\n      className={cx(styles.command, { [styles.backward]: !isNext })}\n      data-testid={\n        isNext ? ComponentDefaultTestId.STEPS_FORWARD_COMMAND : ComponentDefaultTestId.STEPS_BACKWARD_COMMAND\n      }\n      kind=\"tertiary\"\n      onClick={onClick}\n      disabled={isDisabled}\n      // @ts-ignore\n      color={color}\n      {...otherButtonProps}\n    >\n      {description}\n      {isIconHidden ? null : (\n        <Icon\n          icon={icon}\n          className={cx(styles.icon, getStyle(styles, camelCase(\"color-\" + color)), {\n            [styles.disabled]: isDisabled\n          })}\n        />\n      )}\n    </Button>\n  );\n};\n"],"names":["StepsCommand","_ref","_ref$isNext","isNext","_ref$onChangeActiveSt","onChangeActiveStep","NOOP","activeStepIndex","stepsCount","_ref$isIconHidden","isIconHidden","_ref$buttonProps","buttonProps","_ref$color","color","buttonChildren","children","otherButtonProps","__rest","description","useMemo","NEXT_TEXT","BACK_TEXT","newStepIndex","onClick","useCallback","e","isDisabled","icon","NavigationChevronRight","NavigationChevronLeft","React","Button","Object","assign","className","cx","styles","command","_defineProperty","backward","ComponentDefaultTestId","STEPS_FORWARD_COMMAND","STEPS_BACKWARD_COMMAND","kind","disabled","createElement","Icon","getStyle","camelCase"],"mappings":"kvBA6CaA,EAAsC,SAA1BC,GAQD,IAAAC,EAAAD,EAPtBE,OAAAA,OAAS,IAAHD,GAAQA,EAAAE,EAAAH,EACdI,mBAAAA,OAAqBC,IAAHF,EAAGE,EAAIF,EACzBG,EAAeN,EAAfM,gBACAC,EAAUP,EAAVO,WAAUC,EAAAR,EACVS,aAAAA,OAAe,IAAHD,GAAQA,EAAAE,EAAAV,EACpBW,YAAAA,OAAW,IAAAD,EAAG,CAAE,EAAAA,EAAAE,EAAAZ,EAChBa,MAAAA,OAAQ,IAAHD,EAAG,UAASA,EAECE,EAAwCH,EAAlDI,SAA6BC,EAAqBC,EAAAN,EAApD,CAAA,aACAO,EAAcC,GAAQ,WAC1B,OAAIL,IACGZ,EAASkB,EAAYC,EAC9B,GAAG,CAACnB,EAAQY,IACNQ,EAAepB,EAASI,EAAkB,EAAIA,EAAkB,EAChEiB,EAAUC,GACd,SAACC,GAAmB,OAAKrB,EAAmBqB,EAAGH,EAAa,GAC5D,CAACA,EAAclB,IAEXsB,EAAcxB,GAAUI,IAAoBC,EAAa,IAAQL,GAA8B,IAApBI,EAE3EqB,EAAOzB,EAAS0B,EAAyBC,EAC/C,OACEC,gBAACC,EAAMC,OAAAC,OAAA,CACLC,UAAWC,EAAGC,EAAOC,QAAOC,EAAKF,CAAAA,EAAAA,EAAOG,UAAYrC,IAAS,cAE3DA,EAASsC,EAAuBC,sBAAwBD,EAAuBE,uBAEjFC,KAAK,WACLpB,QAASA,EACTqB,SAAUlB,EAEVb,MAAOA,GACHG,GAEHE,EACAT,EAAe,KACdqB,EAAAe,cAACC,EACC,CAAAnB,KAAMA,EACNO,UAAWC,EAAGC,EAAOT,KAAMoB,EAASX,EAAQY,EAAU,SAAWnC,IAAOyB,EACrEF,CAAAA,EAAAA,EAAOQ,SAAWlB,MAM/B"}
+{"version":3,"file":"StepsCommand.js","sources":["../../../../../src/components/Steps/StepsCommand.tsx"],"sourcesContent":["import React, { type FC, useCallback, useMemo } from \"react\";\nimport cx from \"classnames\";\nimport { NavigationChevronRight, NavigationChevronLeft } from \"@vibe/icons\";\nimport { Icon } from \"@vibe/icon\";\nimport { Button, type ButtonProps } from \"@vibe/button\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport { BACK_TEXT, NEXT_TEXT } from \"./StepsConstants\";\nimport { type StepsColor } from \"./Steps.types\";\nimport type VibeComponentProps from \"../../types/VibeComponentProps\";\nimport { ComponentDefaultTestId } from \"../../tests/constants\";\nimport styles from \"./StepsCommand.module.scss\";\nimport { camelCase } from \"es-toolkit\";\nimport { getStyle } from \"../..//helpers/typesciptCssModulesHelper\";\n\nexport interface StepsCommandProps extends VibeComponentProps {\n  /**\n   * If true, this button is for moving to the next step.\n   */\n  isNext?: boolean;\n  /**\n   * Callback fired when the active step changes.\n   */\n  onChangeActiveStep?: (e: React.MouseEvent, newStepIndex: number) => void;\n  /**\n   * The index of the currently active step.\n   */\n  activeStepIndex: number;\n  /**\n   * The total number of steps.\n   */\n  stepsCount: number;\n  /**\n   * If true, hides the navigation icon.\n   */\n  isIconHidden?: boolean;\n  /**\n   * Props applied to the button.\n   */\n  buttonProps?: Partial<ButtonProps>;\n  /**\n   * The color theme of the button.\n   */\n  color?: StepsColor;\n}\n\nexport const StepsCommand: FC<StepsCommandProps> = ({\n  isNext = false,\n  onChangeActiveStep = NOOP,\n  activeStepIndex,\n  stepsCount,\n  isIconHidden = false,\n  buttonProps = {},\n  color = \"primary\"\n}: StepsCommandProps) => {\n  const { children: buttonChildren, ...otherButtonProps } = buttonProps;\n  const description = useMemo(() => {\n    if (buttonChildren) return buttonChildren;\n    return isNext ? NEXT_TEXT : BACK_TEXT;\n  }, [isNext, buttonChildren]);\n  const newStepIndex = isNext ? activeStepIndex + 1 : activeStepIndex - 1;\n  const onClick = useCallback(\n    (e: React.MouseEvent) => onChangeActiveStep(e, newStepIndex),\n    [newStepIndex, onChangeActiveStep]\n  );\n  const isDisabled = (isNext && activeStepIndex === stepsCount - 1) || (!isNext && activeStepIndex === 0);\n\n  const icon = isNext ? NavigationChevronRight : NavigationChevronLeft;\n  return (\n    <Button\n      className={cx(styles.command, { [styles.backward]: !isNext })}\n      data-testid={\n        isNext ? ComponentDefaultTestId.STEPS_FORWARD_COMMAND : ComponentDefaultTestId.STEPS_BACKWARD_COMMAND\n      }\n      kind=\"tertiary\"\n      onClick={onClick}\n      disabled={isDisabled}\n      // @ts-ignore\n      color={color}\n      {...otherButtonProps}\n    >\n      {description}\n      {isIconHidden ? null : (\n        <Icon\n          icon={icon}\n          className={cx(styles.icon, getStyle(styles, camelCase(\"color-\" + color)), {\n            [styles.disabled]: isDisabled\n          })}\n        />\n      )}\n    </Button>\n  );\n};\n"],"names":["StepsCommand","_ref","_ref$isNext","isNext","_ref$onChangeActiveSt","onChangeActiveStep","NOOP","activeStepIndex","stepsCount","_ref$isIconHidden","isIconHidden","_ref$buttonProps","buttonProps","_ref$color","color","buttonChildren","children","otherButtonProps","__rest","description","useMemo","NEXT_TEXT","BACK_TEXT","newStepIndex","onClick","useCallback","e","isDisabled","icon","NavigationChevronRight","NavigationChevronLeft","React","Button","Object","assign","className","cx","styles","command","_defineProperty","backward","ComponentDefaultTestId","STEPS_FORWARD_COMMAND","STEPS_BACKWARD_COMMAND","kind","disabled","createElement","Icon","getStyle","camelCase"],"mappings":"syBA6CaA,EAAsC,SAA1BC,GAQD,IAAAC,EAAAD,EAPtBE,OAAAA,OAAS,IAAHD,GAAQA,EAAAE,EAAAH,EACdI,mBAAAA,OAAqBC,IAAHF,EAAGE,EAAIF,EACzBG,EAAeN,EAAfM,gBACAC,EAAUP,EAAVO,WAAUC,EAAAR,EACVS,aAAAA,OAAe,IAAHD,GAAQA,EAAAE,EAAAV,EACpBW,YAAAA,OAAW,IAAAD,EAAG,CAAE,EAAAA,EAAAE,EAAAZ,EAChBa,MAAAA,OAAQ,IAAHD,EAAG,UAASA,EAECE,EAAwCH,EAAlDI,SAA6BC,EAAqBC,EAAAN,EAApD,CAAA,aACAO,EAAcC,GAAQ,WAC1B,OAAIL,IACGZ,EAASkB,EAAYC,EAC9B,GAAG,CAACnB,EAAQY,IACNQ,EAAepB,EAASI,EAAkB,EAAIA,EAAkB,EAChEiB,EAAUC,GACd,SAACC,GAAmB,OAAKrB,EAAmBqB,EAAGH,EAAa,GAC5D,CAACA,EAAclB,IAEXsB,EAAcxB,GAAUI,IAAoBC,EAAa,IAAQL,GAA8B,IAApBI,EAE3EqB,EAAOzB,EAAS0B,EAAyBC,EAC/C,OACEC,gBAACC,EAAMC,OAAAC,OAAA,CACLC,UAAWC,EAAGC,EAAOC,QAAOC,EAAKF,CAAAA,EAAAA,EAAOG,UAAYrC,IAAS,cAE3DA,EAASsC,EAAuBC,sBAAwBD,EAAuBE,uBAEjFC,KAAK,WACLpB,QAASA,EACTqB,SAAUlB,EAEVb,MAAOA,GACHG,GAEHE,EACAT,EAAe,KACdqB,EAAAe,cAACC,EACC,CAAAnB,KAAMA,EACNO,UAAWC,EAAGC,EAAOT,KAAMoB,EAASX,EAAQY,EAAU,SAAWnC,IAAOyB,EACrEF,CAAAA,EAAAA,EAAOQ,SAAWlB,MAM/B"}

package/dist/mocked_classnames/src/components/Steps/StepsHeader.js

@@ -1,2 +1,2 @@
-import e,{useMemo as t}from"react";import o from"classnames";import{StepsCommand as n}from"./StepsCommand.js";import{StepsGalleryHeader as r}from"./StepsGalleryHeader.js";import{StepsNumbersHeader as s}from"./StepsNumbersHeader.js";import{FINISH_TEXT as a}from"./StepsConstants.js";import{Button as i}from"@vibe/button/mockedClassNames";import c from"./StepsHeader.module.scss.js";var m=function(m){var p=m.activeStepIndex,l=m.onChangeActiveStep,d=m.stepsCount,u=m.areNavigationButtonsHidden,v=m.backButtonProps,S=m.nextButtonProps,f=m.finishButtonProps,C=m.areButtonsIconsHidden,g=m.color,h=void 0===g?"primary":g,x=m.onFinish,b=m.className,H="gallery"===m.type?r:s,I=t((function(){if(x)return p===d-1}),[p,x,d]);return e.createElement("div",{className:o(c.header,b)},u?null:e.createElement(n,{isNext:!1,isIconHidden:C,onChangeActiveStep:l,activeStepIndex:p,stepsCount:d,buttonProps:v,color:h}),e.createElement(H,{activeStepIndex:p,stepsCount:d,onChangeActiveStep:l,color:h}),u?null:e.createElement(e.Fragment,null,I?e.createElement(i,Object.assign({onClick:x,color:h},f),(null==f?void 0:f.children)||a):e.createElement(n,{isNext:!0,isIconHidden:C,activeStepIndex:p,onChangeActiveStep:l,stepsCount:d,buttonProps:S,color:h})))};export{m as StepsHeader};
+import e,{useMemo as t}from"react";import o from"classnames";import{StepsCommand as n}from"./StepsCommand.js";import{StepsGalleryHeader as r}from"./StepsGalleryHeader.js";import{StepsNumbersHeader as s}from"./StepsNumbersHeader.js";import{FINISH_TEXT as i}from"./StepsConstants.js";import a from"./StepsHeader.module.scss.js";import c from"../../../components/button/dist/Button/Button.js";var p=function(p){var m=p.activeStepIndex,l=p.onChangeActiveStep,u=p.stepsCount,d=p.areNavigationButtonsHidden,v=p.backButtonProps,S=p.nextButtonProps,f=p.finishButtonProps,C=p.areButtonsIconsHidden,g=p.color,h=void 0===g?"primary":g,x=p.onFinish,j=p.className,B="gallery"===p.type?r:s,H=t((function(){if(x)return m===u-1}),[m,x,u]);return e.createElement("div",{className:o(a.header,j)},d?null:e.createElement(n,{isNext:!1,isIconHidden:C,onChangeActiveStep:l,activeStepIndex:m,stepsCount:u,buttonProps:v,color:h}),e.createElement(B,{activeStepIndex:m,stepsCount:u,onChangeActiveStep:l,color:h}),d?null:e.createElement(e.Fragment,null,H?e.createElement(c,Object.assign({onClick:x,color:h},f),(null==f?void 0:f.children)||i):e.createElement(n,{isNext:!0,isIconHidden:C,activeStepIndex:m,onChangeActiveStep:l,stepsCount:u,buttonProps:S,color:h})))};export{p as StepsHeader};
 //# sourceMappingURL=StepsHeader.js.map

package/dist/mocked_classnames/src/components/Steps/StepsHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"StepsHeader.js","sources":["../../../../../src/components/Steps/StepsHeader.tsx"],"sourcesContent":["import React, { type FC, useMemo } from \"react\";\nimport cx from \"classnames\";\nimport { StepsCommand } from \"./StepsCommand\";\nimport { StepsGalleryHeader, type StepsGalleryHeaderProps } from \"./StepsGalleryHeader\";\nimport { StepsNumbersHeader, type StepsNumbersHeaderProps } from \"./StepsNumbersHeader\";\nimport { FINISH_TEXT } from \"./StepsConstants\";\nimport { type StepsType, type StepsColor } from \"./Steps.types\";\nimport type VibeComponentProps from \"../../types/VibeComponentProps\";\nimport { Button, type ButtonProps } from \"@vibe/button\";\nimport styles from \"./StepsHeader.module.scss\";\n\nexport interface StepsHeaderProps extends VibeComponentProps {\n  /**\n   * The type of steps header.\n   */\n  type: StepsType;\n  /**\n   * The index of the currently active step.\n   */\n  activeStepIndex: number;\n  /**\n   * Callback fired when the active step changes.\n   */\n  onChangeActiveStep: (e: React.MouseEvent, stepIndex: number) => void;\n  /**\n   * The total number of steps.\n   */\n  stepsCount: number;\n  /**\n   * If true, hides the navigation buttons.\n   */\n  areNavigationButtonsHidden: boolean;\n  /**\n   * Props applied to the back button.\n   */\n  backButtonProps: Partial<ButtonProps>;\n  /**\n   * Props applied to the next button.\n   */\n  nextButtonProps: Partial<ButtonProps>;\n  /**\n   * Props applied to the finish button.\n   */\n  finishButtonProps: Partial<ButtonProps>;\n  /**\n   * If true, hides the icons in the navigation buttons.\n   */\n  areButtonsIconsHidden: boolean;\n  /**\n   * The color theme of the steps header.\n   */\n  color?: StepsColor;\n  /**\n   * Callback fired when the finish button is clicked.\n   */\n  onFinish?: (e: React.MouseEvent) => void;\n}\n\nexport const StepsHeader: FC<StepsHeaderProps> = ({\n  type,\n  activeStepIndex,\n  onChangeActiveStep,\n  stepsCount,\n  areNavigationButtonsHidden,\n  backButtonProps,\n  nextButtonProps,\n  finishButtonProps,\n  areButtonsIconsHidden,\n  color = \"primary\",\n  onFinish,\n  className\n}: StepsHeaderProps) => {\n  const SubHeaderComponent: FC<StepsGalleryHeaderProps | StepsNumbersHeaderProps> =\n    type === \"gallery\" ? StepsGalleryHeader : StepsNumbersHeader;\n\n  // TODO: [breaking] make finish button as default in next major\n  const showFinishButton = useMemo(() => {\n    if (!onFinish) {\n      return;\n    }\n    return activeStepIndex === stepsCount - 1;\n  }, [activeStepIndex, onFinish, stepsCount]);\n\n  return (\n    <div className={cx(styles.header, className)}>\n      {areNavigationButtonsHidden ? null : (\n        <StepsCommand\n          isNext={false}\n          isIconHidden={areButtonsIconsHidden}\n          onChangeActiveStep={onChangeActiveStep}\n          activeStepIndex={activeStepIndex}\n          stepsCount={stepsCount}\n          buttonProps={backButtonProps}\n          color={color}\n        />\n      )}\n      <SubHeaderComponent\n        activeStepIndex={activeStepIndex}\n        stepsCount={stepsCount}\n        onChangeActiveStep={onChangeActiveStep}\n        color={color}\n      />\n      {areNavigationButtonsHidden ? null : (\n        <>\n          {showFinishButton ? (\n            <Button onClick={onFinish} color={color} {...finishButtonProps}>\n              {finishButtonProps?.children || FINISH_TEXT}\n            </Button>\n          ) : (\n            <StepsCommand\n              isNext\n              isIconHidden={areButtonsIconsHidden}\n              activeStepIndex={activeStepIndex}\n              onChangeActiveStep={onChangeActiveStep}\n              stepsCount={stepsCount}\n              buttonProps={nextButtonProps}\n              color={color}\n            />\n          )}\n        </>\n      )}\n    </div>\n  );\n};\n"],"names":["StepsHeader","_ref","activeStepIndex","onChangeActiveStep","stepsCount","areNavigationButtonsHidden","backButtonProps","nextButtonProps","finishButtonProps","areButtonsIconsHidden","_ref$color","color","onFinish","className","SubHeaderComponent","type","StepsGalleryHeader","StepsNumbersHeader","showFinishButton","useMemo","React","createElement","cx","styles","header","StepsCommand","isNext","isIconHidden","buttonProps","Fragment","Button","Object","assign","onClick","children","FINISH_TEXT"],"mappings":"iYA0DaA,EAAoC,SAAzBC,GAaD,IAXrBC,EAAeD,EAAfC,gBACAC,EAAkBF,EAAlBE,mBACAC,EAAUH,EAAVG,WACAC,EAA0BJ,EAA1BI,2BACAC,EAAeL,EAAfK,gBACAC,EAAeN,EAAfM,gBACAC,EAAiBP,EAAjBO,kBACAC,EAAqBR,EAArBQ,sBAAqBC,EAAAT,EACrBU,MAAAA,OAAQ,IAAHD,EAAG,UAASA,EACjBE,EAAQX,EAARW,SACAC,EAASZ,EAATY,UAEMC,EACK,YAdPb,EAAJc,KAcuBC,EAAqBC,EAGtCC,EAAmBC,GAAQ,WAC/B,GAAKP,EAGL,OAAOV,IAAoBE,EAAa,CACzC,GAAE,CAACF,EAAiBU,EAAUR,IAE/B,OACEgB,EAAKC,cAAA,MAAA,CAAAR,UAAWS,EAAGC,EAAOC,OAAQX,IAC/BR,EAA6B,KAC5Be,EAACC,cAAAI,GACCC,QAAQ,EACRC,aAAclB,EACdN,mBAAoBA,EACpBD,gBAAiBA,EACjBE,WAAYA,EACZwB,YAAatB,EACbK,MAAOA,IAGXS,EAAAC,cAACP,EACC,CAAAZ,gBAAiBA,EACjBE,WAAYA,EACZD,mBAAoBA,EACpBQ,MAAOA,IAERN,EAA6B,KAC5Be,EACGC,cAAAD,EAAAS,SAAA,KAAAX,EACCE,EAAAC,cAACS,EAAOC,OAAAC,OAAA,CAAAC,QAASrB,EAAUD,MAAOA,GAAWH,IAC1CA,aAAA,EAAAA,EAAmB0B,WAAYC,GAGlCf,EAACC,cAAAI,GACCC,QAAM,EACNC,aAAclB,EACdP,gBAAiBA,EACjBC,mBAAoBA,EACpBC,WAAYA,EACZwB,YAAarB,EACbI,MAAOA,KAOrB"}
+{"version":3,"file":"StepsHeader.js","sources":["../../../../../src/components/Steps/StepsHeader.tsx"],"sourcesContent":["import React, { type FC, useMemo } from \"react\";\nimport cx from \"classnames\";\nimport { StepsCommand } from \"./StepsCommand\";\nimport { StepsGalleryHeader, type StepsGalleryHeaderProps } from \"./StepsGalleryHeader\";\nimport { StepsNumbersHeader, type StepsNumbersHeaderProps } from \"./StepsNumbersHeader\";\nimport { FINISH_TEXT } from \"./StepsConstants\";\nimport { type StepsType, type StepsColor } from \"./Steps.types\";\nimport type VibeComponentProps from \"../../types/VibeComponentProps\";\nimport { Button, type ButtonProps } from \"@vibe/button\";\nimport styles from \"./StepsHeader.module.scss\";\n\nexport interface StepsHeaderProps extends VibeComponentProps {\n  /**\n   * The type of steps header.\n   */\n  type: StepsType;\n  /**\n   * The index of the currently active step.\n   */\n  activeStepIndex: number;\n  /**\n   * Callback fired when the active step changes.\n   */\n  onChangeActiveStep: (e: React.MouseEvent, stepIndex: number) => void;\n  /**\n   * The total number of steps.\n   */\n  stepsCount: number;\n  /**\n   * If true, hides the navigation buttons.\n   */\n  areNavigationButtonsHidden: boolean;\n  /**\n   * Props applied to the back button.\n   */\n  backButtonProps: Partial<ButtonProps>;\n  /**\n   * Props applied to the next button.\n   */\n  nextButtonProps: Partial<ButtonProps>;\n  /**\n   * Props applied to the finish button.\n   */\n  finishButtonProps: Partial<ButtonProps>;\n  /**\n   * If true, hides the icons in the navigation buttons.\n   */\n  areButtonsIconsHidden: boolean;\n  /**\n   * The color theme of the steps header.\n   */\n  color?: StepsColor;\n  /**\n   * Callback fired when the finish button is clicked.\n   */\n  onFinish?: (e: React.MouseEvent) => void;\n}\n\nexport const StepsHeader: FC<StepsHeaderProps> = ({\n  type,\n  activeStepIndex,\n  onChangeActiveStep,\n  stepsCount,\n  areNavigationButtonsHidden,\n  backButtonProps,\n  nextButtonProps,\n  finishButtonProps,\n  areButtonsIconsHidden,\n  color = \"primary\",\n  onFinish,\n  className\n}: StepsHeaderProps) => {\n  const SubHeaderComponent: FC<StepsGalleryHeaderProps | StepsNumbersHeaderProps> =\n    type === \"gallery\" ? StepsGalleryHeader : StepsNumbersHeader;\n\n  // TODO: [breaking] make finish button as default in next major\n  const showFinishButton = useMemo(() => {\n    if (!onFinish) {\n      return;\n    }\n    return activeStepIndex === stepsCount - 1;\n  }, [activeStepIndex, onFinish, stepsCount]);\n\n  return (\n    <div className={cx(styles.header, className)}>\n      {areNavigationButtonsHidden ? null : (\n        <StepsCommand\n          isNext={false}\n          isIconHidden={areButtonsIconsHidden}\n          onChangeActiveStep={onChangeActiveStep}\n          activeStepIndex={activeStepIndex}\n          stepsCount={stepsCount}\n          buttonProps={backButtonProps}\n          color={color}\n        />\n      )}\n      <SubHeaderComponent\n        activeStepIndex={activeStepIndex}\n        stepsCount={stepsCount}\n        onChangeActiveStep={onChangeActiveStep}\n        color={color}\n      />\n      {areNavigationButtonsHidden ? null : (\n        <>\n          {showFinishButton ? (\n            <Button onClick={onFinish} color={color} {...finishButtonProps}>\n              {finishButtonProps?.children || FINISH_TEXT}\n            </Button>\n          ) : (\n            <StepsCommand\n              isNext\n              isIconHidden={areButtonsIconsHidden}\n              activeStepIndex={activeStepIndex}\n              onChangeActiveStep={onChangeActiveStep}\n              stepsCount={stepsCount}\n              buttonProps={nextButtonProps}\n              color={color}\n            />\n          )}\n        </>\n      )}\n    </div>\n  );\n};\n"],"names":["StepsHeader","_ref","activeStepIndex","onChangeActiveStep","stepsCount","areNavigationButtonsHidden","backButtonProps","nextButtonProps","finishButtonProps","areButtonsIconsHidden","_ref$color","color","onFinish","className","SubHeaderComponent","type","StepsGalleryHeader","StepsNumbersHeader","showFinishButton","useMemo","React","createElement","cx","styles","header","StepsCommand","isNext","isIconHidden","buttonProps","Fragment","Button","Object","assign","onClick","children","FINISH_TEXT"],"mappings":"0YA0DaA,EAAoC,SAAzBC,GAaD,IAXrBC,EAAeD,EAAfC,gBACAC,EAAkBF,EAAlBE,mBACAC,EAAUH,EAAVG,WACAC,EAA0BJ,EAA1BI,2BACAC,EAAeL,EAAfK,gBACAC,EAAeN,EAAfM,gBACAC,EAAiBP,EAAjBO,kBACAC,EAAqBR,EAArBQ,sBAAqBC,EAAAT,EACrBU,MAAAA,OAAQ,IAAHD,EAAG,UAASA,EACjBE,EAAQX,EAARW,SACAC,EAASZ,EAATY,UAEMC,EACK,YAdPb,EAAJc,KAcuBC,EAAqBC,EAGtCC,EAAmBC,GAAQ,WAC/B,GAAKP,EAGL,OAAOV,IAAoBE,EAAa,CACzC,GAAE,CAACF,EAAiBU,EAAUR,IAE/B,OACEgB,EAAKC,cAAA,MAAA,CAAAR,UAAWS,EAAGC,EAAOC,OAAQX,IAC/BR,EAA6B,KAC5Be,EAACC,cAAAI,GACCC,QAAQ,EACRC,aAAclB,EACdN,mBAAoBA,EACpBD,gBAAiBA,EACjBE,WAAYA,EACZwB,YAAatB,EACbK,MAAOA,IAGXS,EAAAC,cAACP,EACC,CAAAZ,gBAAiBA,EACjBE,WAAYA,EACZD,mBAAoBA,EACpBQ,MAAOA,IAERN,EAA6B,KAC5Be,EACGC,cAAAD,EAAAS,SAAA,KAAAX,EACCE,EAAAC,cAACS,EAAOC,OAAAC,OAAA,CAAAC,QAASrB,EAAUD,MAAOA,GAAWH,IAC1CA,aAAA,EAAAA,EAAmB0B,WAAYC,GAGlCf,EAACC,cAAAI,GACCC,QAAM,EACNC,aAAclB,EACdP,gBAAiBA,EACjBC,mBAAoBA,EACpBC,WAAYA,EACZwB,YAAarB,EACbI,MAAOA,KAOrB"}

package/dist/mocked_classnames/src/components/Table/Table/tableHelpers.js

@@ -1,2 +1,2 @@
-import{SortAscending as n,SortDescending as t,Sort as e}from"@vibe/icons/mockedClassNames";import{SkeletonType as c}from"../../Skeleton/SkeletonConstants.js";function o(n){return"number"==typeof n?"".concat(n,"px"):"string"==typeof n?/%|px|fr$/.test(n)?n:"".concat(n,"px"):(null==n?void 0:n.min)&&(null==n?void 0:n.max)?"minmax(".concat(o(n.min),", ").concat(o(n.max),")"):"minmax(112px, 1fr)"}function i(n){return Object.assign(Object.assign({},arguments.length>1&&void 0!==arguments[1]?arguments[1]:{}),{display:"grid",gridTemplateColumns:n.map((function(n){return o(n.width)})).join(" ")})}function r(c){return"asc"===c?n:"desc"===c?t:e}function s(n){return"asc"===n?"desc":"desc"===n?"none":"asc"}function a(n){return"asc"===n?"ascending":"desc"===n?"descending":"none"}function u(n){return"circle"===n?c.CIRCLE:"rectangle"===n?c.RECTANGLE:c.TEXT}function m(n,t){return"long-text"===n?["long-text","medium-text"][t%2]:n}export{o as generateWidth,a as getAriaSort,m as getLoadingTypeForCell,s as getNextSortState,u as getSkeletonType,r as getSortIcon,i as getTableRowLayoutStyles};
+import{SkeletonType as n}from"../../Skeleton/SkeletonConstants.js";import t from"../../../../icons/dist/react/SortAscending.js";import e from"../../../../icons/dist/react/SortDescending.js";import o from"../../../../icons/dist/react/Sort.js";function c(n){return"number"==typeof n?"".concat(n,"px"):"string"==typeof n?/%|px|fr$/.test(n)?n:"".concat(n,"px"):(null==n?void 0:n.min)&&(null==n?void 0:n.max)?"minmax(".concat(c(n.min),", ").concat(c(n.max),")"):"minmax(112px, 1fr)"}function i(n){return Object.assign(Object.assign({},arguments.length>1&&void 0!==arguments[1]?arguments[1]:{}),{display:"grid",gridTemplateColumns:n.map((function(n){return c(n.width)})).join(" ")})}function r(n){return"asc"===n?t:"desc"===n?e:o}function s(n){return"asc"===n?"desc":"desc"===n?"none":"asc"}function a(n){return"asc"===n?"ascending":"desc"===n?"descending":"none"}function m(t){return"circle"===t?n.CIRCLE:"rectangle"===t?n.RECTANGLE:n.TEXT}function u(n,t){return"long-text"===n?["long-text","medium-text"][t%2]:n}export{c as generateWidth,a as getAriaSort,u as getLoadingTypeForCell,s as getNextSortState,m as getSkeletonType,r as getSortIcon,i as getTableRowLayoutStyles};
 //# sourceMappingURL=tableHelpers.js.map

package/dist/mocked_classnames/src/components/Table/Table/tableHelpers.js.map

@@ -1 +1 @@
-{"version":3,"file":"tableHelpers.js","sources":["../../../../../../src/components/Table/Table/tableHelpers.ts"],"sourcesContent":["import { type AriaAttributes } from \"react\";\nimport type React from \"react\";\nimport { type TableColumn, type TableLoadingStateType } from \"./Table\";\nimport { Sort } from \"@vibe/icons\";\nimport { type TableHeaderCellProps } from \"../TableHeaderCell/TableHeaderCell\";\nimport { SortAscending, SortDescending } from \"@vibe/icons\";\nimport { SkeletonType } from \"../../Skeleton/SkeletonConstants\";\n\nexport function generateWidth(width: TableColumn[\"width\"]): string {\n  if (typeof width === \"number\") {\n    return `${width}px`;\n  } else if (typeof width === \"string\") {\n    return /%|px|fr$/.test(width) ? width : `${width}px`;\n  } else if (width?.min && width?.max) {\n    return `minmax(${generateWidth(width.min)}, ${generateWidth(width.max)})`;\n  } else {\n    return \"minmax(112px, 1fr)\";\n  }\n}\n\nexport function getTableRowLayoutStyles(columns: TableColumn[], style: React.CSSProperties = {}): React.CSSProperties {\n  return {\n    ...style,\n    display: \"grid\",\n    gridTemplateColumns: columns.map(cell => generateWidth(cell.width)).join(\" \")\n  };\n}\n\nexport function getSortIcon(sortState: TableHeaderCellProps[\"sortState\"]) {\n  if (sortState === \"asc\") {\n    return SortAscending;\n  } else if (sortState === \"desc\") {\n    return SortDescending;\n  } else {\n    return Sort;\n  }\n}\n\nexport function getNextSortState(sortState: TableHeaderCellProps[\"sortState\"]): TableHeaderCellProps[\"sortState\"] {\n  if (sortState === \"asc\") {\n    return \"desc\";\n  } else if (sortState === \"desc\") {\n    return \"none\";\n  } else {\n    return \"asc\";\n  }\n}\n\nexport function getAriaSort(sortState: TableHeaderCellProps[\"sortState\"]): AriaAttributes[\"aria-sort\"] {\n  if (sortState === \"asc\") {\n    return \"ascending\";\n  }\n  if (sortState === \"desc\") {\n    return \"descending\";\n  }\n  return \"none\";\n}\n\nexport function getSkeletonType(loadingStateType: TableLoadingStateType): SkeletonType {\n  if (loadingStateType === \"circle\") {\n    return SkeletonType.CIRCLE;\n  }\n  if (loadingStateType === \"rectangle\") {\n    return SkeletonType.RECTANGLE;\n  }\n  return SkeletonType.TEXT;\n}\n\nexport function getLoadingTypeForCell(\n  loadingStateType: TableLoadingStateType,\n  rowIndex: number\n): TableLoadingStateType {\n  return loadingStateType === \"long-text\"\n    ? ([\"long-text\", \"medium-text\"] as TableLoadingStateType[])[rowIndex % 2]\n    : loadingStateType;\n}\n"],"names":["generateWidth","width","concat","test","min","max","getTableRowLayoutStyles","columns","Object","assign","display","gridTemplateColumns","map","cell","join","getSortIcon","sortState","SortAscending","SortDescending","Sort","getNextSortState","getAriaSort","getSkeletonType","loadingStateType","SkeletonType","CIRCLE","RECTANGLE","TEXT","getLoadingTypeForCell","rowIndex"],"mappings":"8JAQM,SAAUA,EAAcC,GAC5B,MAAqB,iBAAVA,EACTC,GAAAA,OAAUD,EAAK,MACW,iBAAVA,EACT,WAAWE,KAAKF,GAASA,EAAKC,GAAAA,OAAMD,EAAS,OAC3CA,aAAK,EAALA,EAAOG,OAAOH,aAAK,EAALA,EAAOI,KAC9B,UAAAH,OAAiBF,EAAcC,EAAMG,KAAIF,MAAAA,OAAKF,EAAcC,EAAMI,KAAI,KAE/D,oBAEX,UAEgBC,EAAwBC,GACtC,OAAAC,OAAAC,OAAAD,OAAAC,OAAA,CAAA,yDAD2F,CAAA,GAEjF,CACRC,QAAS,OACTC,oBAAqBJ,EAAQK,KAAI,SAAAC,GAAI,OAAIb,EAAca,EAAKZ,UAAQa,KAAK,MAE7E,CAEM,SAAUC,EAAYC,GAC1B,MAAkB,QAAdA,EACKC,EACgB,SAAdD,EACFE,EAEAC,CAEX,CAEM,SAAUC,EAAiBJ,GAC/B,MAAkB,QAAdA,EACK,OACgB,SAAdA,EACF,OAEA,KAEX,CAEM,SAAUK,EAAYL,GAC1B,MAAkB,QAAdA,EACK,YAES,SAAdA,EACK,aAEF,MACT,CAEM,SAAUM,EAAgBC,GAC9B,MAAyB,WAArBA,EACKC,EAAaC,OAEG,cAArBF,EACKC,EAAaE,UAEfF,EAAaG,IACtB,CAEgB,SAAAC,EACdL,EACAM,GAEA,MAA4B,cAArBN,EACF,CAAC,YAAa,eAA2CM,EAAW,GACrEN,CACN"}
+{"version":3,"file":"tableHelpers.js","sources":["../../../../../../src/components/Table/Table/tableHelpers.ts"],"sourcesContent":["import { type AriaAttributes } from \"react\";\nimport type React from \"react\";\nimport { type TableColumn, type TableLoadingStateType } from \"./Table\";\nimport { Sort } from \"@vibe/icons\";\nimport { type TableHeaderCellProps } from \"../TableHeaderCell/TableHeaderCell\";\nimport { SortAscending, SortDescending } from \"@vibe/icons\";\nimport { SkeletonType } from \"../../Skeleton/SkeletonConstants\";\n\nexport function generateWidth(width: TableColumn[\"width\"]): string {\n  if (typeof width === \"number\") {\n    return `${width}px`;\n  } else if (typeof width === \"string\") {\n    return /%|px|fr$/.test(width) ? width : `${width}px`;\n  } else if (width?.min && width?.max) {\n    return `minmax(${generateWidth(width.min)}, ${generateWidth(width.max)})`;\n  } else {\n    return \"minmax(112px, 1fr)\";\n  }\n}\n\nexport function getTableRowLayoutStyles(columns: TableColumn[], style: React.CSSProperties = {}): React.CSSProperties {\n  return {\n    ...style,\n    display: \"grid\",\n    gridTemplateColumns: columns.map(cell => generateWidth(cell.width)).join(\" \")\n  };\n}\n\nexport function getSortIcon(sortState: TableHeaderCellProps[\"sortState\"]) {\n  if (sortState === \"asc\") {\n    return SortAscending;\n  } else if (sortState === \"desc\") {\n    return SortDescending;\n  } else {\n    return Sort;\n  }\n}\n\nexport function getNextSortState(sortState: TableHeaderCellProps[\"sortState\"]): TableHeaderCellProps[\"sortState\"] {\n  if (sortState === \"asc\") {\n    return \"desc\";\n  } else if (sortState === \"desc\") {\n    return \"none\";\n  } else {\n    return \"asc\";\n  }\n}\n\nexport function getAriaSort(sortState: TableHeaderCellProps[\"sortState\"]): AriaAttributes[\"aria-sort\"] {\n  if (sortState === \"asc\") {\n    return \"ascending\";\n  }\n  if (sortState === \"desc\") {\n    return \"descending\";\n  }\n  return \"none\";\n}\n\nexport function getSkeletonType(loadingStateType: TableLoadingStateType): SkeletonType {\n  if (loadingStateType === \"circle\") {\n    return SkeletonType.CIRCLE;\n  }\n  if (loadingStateType === \"rectangle\") {\n    return SkeletonType.RECTANGLE;\n  }\n  return SkeletonType.TEXT;\n}\n\nexport function getLoadingTypeForCell(\n  loadingStateType: TableLoadingStateType,\n  rowIndex: number\n): TableLoadingStateType {\n  return loadingStateType === \"long-text\"\n    ? ([\"long-text\", \"medium-text\"] as TableLoadingStateType[])[rowIndex % 2]\n    : loadingStateType;\n}\n"],"names":["generateWidth","width","concat","test","min","max","getTableRowLayoutStyles","columns","Object","assign","display","gridTemplateColumns","map","cell","join","getSortIcon","sortState","SortAscending","SortDescending","Sort","getNextSortState","getAriaSort","getSkeletonType","loadingStateType","SkeletonType","CIRCLE","RECTANGLE","TEXT","getLoadingTypeForCell","rowIndex"],"mappings":"kPAQM,SAAUA,EAAcC,GAC5B,MAAqB,iBAAVA,EACTC,GAAAA,OAAUD,EAAK,MACW,iBAAVA,EACT,WAAWE,KAAKF,GAASA,EAAKC,GAAAA,OAAMD,EAAS,OAC3CA,aAAK,EAALA,EAAOG,OAAOH,aAAK,EAALA,EAAOI,KAC9B,UAAAH,OAAiBF,EAAcC,EAAMG,KAAIF,MAAAA,OAAKF,EAAcC,EAAMI,KAAI,KAE/D,oBAEX,UAEgBC,EAAwBC,GACtC,OAAAC,OAAAC,OAAAD,OAAAC,OAAA,CAAA,yDAD2F,CAAA,GAEjF,CACRC,QAAS,OACTC,oBAAqBJ,EAAQK,KAAI,SAAAC,GAAI,OAAIb,EAAca,EAAKZ,UAAQa,KAAK,MAE7E,CAEM,SAAUC,EAAYC,GAC1B,MAAkB,QAAdA,EACKC,EACgB,SAAdD,EACFE,EAEAC,CAEX,CAEM,SAAUC,EAAiBJ,GAC/B,MAAkB,QAAdA,EACK,OACgB,SAAdA,EACF,OAEA,KAEX,CAEM,SAAUK,EAAYL,GAC1B,MAAkB,QAAdA,EACK,YAES,SAAdA,EACK,aAEF,MACT,CAEM,SAAUM,EAAgBC,GAC9B,MAAyB,WAArBA,EACKC,EAAaC,OAEG,cAArBF,EACKC,EAAaE,UAEfF,EAAaG,IACtB,CAEgB,SAAAC,EACdL,EACAM,GAEA,MAA4B,cAArBN,EACF,CAAC,YAAa,eAA2CM,EAAW,GACrEN,CACN"}

package/dist/mocked_classnames/src/components/Table/TableHeaderCell/TableHeaderCell.js

@@ -1,2 +1,2 @@
-import{slicedToArray as e,defineProperty as t}from"../../../../_virtual/_rollupPluginBabelHelpers.js";import o,{forwardRef as r,useState as n}from"react";import s from"classnames";import a from"./TableHeaderCell.module.scss.js";import{Icon as i}from"@vibe/icon/mockedClassNames";import l from"../../IconButton/IconButton.js";import{Info as c}from"@vibe/icons/mockedClassNames";import m from"../../Text/Text.js";import d from"../../Flex/Flex.js";import{getSortIcon as p,getNextSortState as f,getAriaSort as u}from"../Table/tableHelpers.js";import b from"../../Tooltip/Tooltip.js";import{getTestId as v}from"../../../tests/testIds.js";import{ComponentDefaultTestId as C}from"../../../tests/constants.js";import{getStyle as E}from"../../../helpers/typesciptCssModulesHelper.js";var j=r((function(r,j){var x=r.id,y=r.className,N=r["data-testid"],T=r.title,H=r.onSortClicked,k=r.infoContent,L=r.icon,g=r.sortState,B=void 0===g?"none":g,h=r.sortButtonAriaLabel,A=void 0===h?"Sort":h,w=r.sticky,I=n(!1),S=e(I,2),_=S[0],F=S[1],M=u(B),P="none"!==M||_;return o.createElement("div",{ref:j,id:x,className:s(a.tableHeaderCell,t(t({},a.sortActive,H&&"none"!==M),a.sticky,w),y),"data-testid":N||v(C.TABLE_HEADER_CELL,x),role:"columnheader",onMouseOver:function(){return F(!0)},onMouseLeave:function(){return F(!1)},onFocus:function(){return F(!0)},onBlur:function(){return F(!1)},"aria-sort":H?M:void 0,tabIndex:H?0:void 0},o.createElement(d,{direction:"row",align:"center",className:a.tableHeaderCellContent,gap:"xs"},L&&o.createElement(i,{icon:L,className:a.icon}),"string"==typeof T?o.createElement(m,{type:"text2",weight:"medium",color:"secondary"},T):T,k&&o.createElement(b,{content:k,referenceWrapperClassName:a.infoTooltip},o.createElement(i,{icon:c,iconLabel:k}))),H&&o.createElement(d,{direction:"row",align:"center",className:a.tableHeaderCellSort},o.createElement(l,{icon:p(B),kind:"tertiary",size:"xs",ariaLabel:A,"aria-hidden":!P,className:s(a.sort,E(a,B),t({},a.show,P)),onClick:function(){return H(f(B))}})))}));export{j as default};
+import{slicedToArray as e,defineProperty as t}from"../../../../_virtual/_rollupPluginBabelHelpers.js";import o,{forwardRef as r,useState as n}from"react";import s from"classnames";import i from"./TableHeaderCell.module.scss.js";import a from"../../IconButton/IconButton.js";import l from"../../Text/Text.js";import c from"../../Flex/Flex.js";import{getSortIcon as m,getNextSortState as d,getAriaSort as p}from"../Table/tableHelpers.js";import f from"../../Tooltip/Tooltip.js";import{getTestId as u}from"../../../tests/testIds.js";import{ComponentDefaultTestId as j}from"../../../tests/constants.js";import{getStyle as E}from"../../../helpers/typesciptCssModulesHelper.js";import b from"../../../../components/icon/dist/Icon/Icon.js";import v from"../../../../icons/dist/react/Info.js";var C=r((function(r,C){var x=r.id,y=r.className,T=r["data-testid"],H=r.title,I=r.onSortClicked,L=r.infoContent,N=r.icon,g=r.sortState,B=void 0===g?"none":g,h=r.sortButtonAriaLabel,k=void 0===h?"Sort":h,A=r.sticky,w=n(!1),S=e(w,2),_=S[0],F=S[1],M=p(B),P="none"!==M||_;return o.createElement("div",{ref:C,id:x,className:s(i.tableHeaderCell,t(t({},i.sortActive,I&&"none"!==M),i.sticky,A),y),"data-testid":T||u(j.TABLE_HEADER_CELL,x),role:"columnheader",onMouseOver:function(){return F(!0)},onMouseLeave:function(){return F(!1)},onFocus:function(){return F(!0)},onBlur:function(){return F(!1)},"aria-sort":I?M:void 0,tabIndex:I?0:void 0},o.createElement(c,{direction:"row",align:"center",className:i.tableHeaderCellContent,gap:"xs"},N&&o.createElement(b,{icon:N,className:i.icon}),"string"==typeof H?o.createElement(l,{type:"text2",weight:"medium",color:"secondary"},H):H,L&&o.createElement(f,{content:L,referenceWrapperClassName:i.infoTooltip},o.createElement(b,{icon:v,iconLabel:L}))),I&&o.createElement(c,{direction:"row",align:"center",className:i.tableHeaderCellSort},o.createElement(a,{icon:m(B),kind:"tertiary",size:"xs",ariaLabel:k,"aria-hidden":!P,className:s(i.sort,E(i,B),t({},i.show,P)),onClick:function(){return I(d(B))}})))}));export{C as default};
 //# sourceMappingURL=TableHeaderCell.js.map

package/dist/mocked_classnames/src/components/Table/TableHeaderCell/TableHeaderCell.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableHeaderCell.js","sources":["../../../../../../src/components/Table/TableHeaderCell/TableHeaderCell.tsx"],"sourcesContent":["import React, { forwardRef, useState } from \"react\";\nimport cx from \"classnames\";\nimport { type VibeComponentProps } from \"../../../types\";\nimport styles from \"./TableHeaderCell.module.scss\";\nimport { Icon, type SubIcon } from \"@vibe/icon\";\nimport IconButton from \"../../IconButton/IconButton\";\nimport { Info } from \"@vibe/icons\";\nimport Text from \"../../Text/Text\";\nimport Flex from \"../../Flex/Flex\";\nimport { getAriaSort, getNextSortState, getSortIcon } from \"../Table/tableHelpers\";\nimport Tooltip from \"../../Tooltip/Tooltip\";\nimport { getTestId } from \"../../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../../tests/constants\";\nimport { getStyle } from \"../../../helpers/typesciptCssModulesHelper\";\n\nexport interface TableHeaderCellProps extends VibeComponentProps {\n  /**\n   * The title of the column, displayed inside the header cell.\n   */\n  title: string | React.ReactNode;\n  /**\n   * Icon displayed next to the column title.\n   */\n  icon?: SubIcon;\n  /**\n   * Tooltip content for additional information about the column.\n   */\n  infoContent?: string;\n  /**\n   * Current sorting state of the column.\n   */\n  sortState?: \"asc\" | \"desc\" | \"none\";\n  /**\n   * Callback fired when the column header is clicked to change sorting.\n   */\n  onSortClicked?: (direction: \"asc\" | \"desc\" | \"none\") => void;\n  /**\n   * ARIA label for the sort button.\n   */\n  sortButtonAriaLabel?: string;\n  /**\n   * If true, the header cell remains visible while scrolling horizontally.\n   */\n  sticky?: boolean;\n}\n\nconst TableHeaderCell = forwardRef(\n  (\n    {\n      id,\n      className,\n      \"data-testid\": dataTestId,\n      title,\n      onSortClicked,\n      infoContent,\n      icon,\n      sortState = \"none\",\n      sortButtonAriaLabel = \"Sort\",\n      sticky\n    }: TableHeaderCellProps,\n    ref: React.ForwardedRef<HTMLDivElement>\n  ) => {\n    const [isHovered, setIsHovered] = useState<boolean>(false);\n    const ariaSort = getAriaSort(sortState);\n    const isSortActive = onSortClicked && ariaSort !== \"none\";\n    const shouldShowSortIcon = ariaSort !== \"none\" || isHovered;\n\n    return (\n      <div\n        ref={ref}\n        id={id}\n        className={cx(\n          styles.tableHeaderCell,\n          { [styles.sortActive]: isSortActive, [styles.sticky]: sticky },\n          className\n        )}\n        data-testid={dataTestId || getTestId(ComponentDefaultTestId.TABLE_HEADER_CELL, id)}\n        role=\"columnheader\"\n        onMouseOver={() => setIsHovered(true)}\n        onMouseLeave={() => setIsHovered(false)}\n        onFocus={() => setIsHovered(true)}\n        onBlur={() => setIsHovered(false)}\n        aria-sort={onSortClicked ? ariaSort : undefined}\n        tabIndex={onSortClicked ? 0 : undefined}\n      >\n        <Flex direction=\"row\" align=\"center\" className={styles.tableHeaderCellContent} gap=\"xs\">\n          {icon && <Icon icon={icon} className={styles.icon} />}\n          {typeof title === \"string\" ? (\n            <Text type=\"text2\" weight=\"medium\" color=\"secondary\">\n              {title}\n            </Text>\n          ) : (\n            title\n          )}\n          {infoContent && (\n            <Tooltip content={infoContent} referenceWrapperClassName={styles.infoTooltip}>\n              <Icon icon={Info} iconLabel={infoContent} />\n            </Tooltip>\n          )}\n        </Flex>\n        {onSortClicked && (\n          <Flex direction=\"row\" align=\"center\" className={styles.tableHeaderCellSort}>\n            <IconButton\n              icon={getSortIcon(sortState)}\n              kind=\"tertiary\"\n              size=\"xs\"\n              ariaLabel={sortButtonAriaLabel}\n              aria-hidden={!shouldShowSortIcon}\n              className={cx(styles.sort, getStyle(styles, sortState), {\n                [styles.show]: shouldShowSortIcon\n              })}\n              onClick={() => onSortClicked(getNextSortState(sortState))}\n            />\n          </Flex>\n        )}\n      </div>\n    );\n  }\n);\n\nexport default TableHeaderCell;\n"],"names":["TableHeaderCell","forwardRef","_ref","ref","id","className","dataTestId","title","onSortClicked","infoContent","icon","_ref$sortState","sortState","_ref$sortButtonAriaLa","sortButtonAriaLabel","sticky","_useState","useState","_useState2","_slicedToArray","isHovered","setIsHovered","ariaSort","getAriaSort","shouldShowSortIcon","React","createElement","cx","styles","tableHeaderCell","_defineProperty","sortActive","getTestId","ComponentDefaultTestId","TABLE_HEADER_CELL","role","onMouseOver","onMouseLeave","onFocus","onBlur","undefined","tabIndex","Flex","direction","align","tableHeaderCellContent","gap","Icon","Text","type","weight","color","Tooltip","content","referenceWrapperClassName","infoTooltip","Info","iconLabel","tableHeaderCellSort","IconButton","getSortIcon","kind","size","ariaLabel","sort","getStyle","show","onClick","getNextSortState"],"mappings":"uwBA8CMA,IAAAA,EAAkBC,GACtB,SAAAC,EAaEC,GACE,IAZAC,EAAEF,EAAFE,GACAC,EAASH,EAATG,UACeC,EAAUJ,EAAzB,eACAK,EAAKL,EAALK,MACAC,EAAaN,EAAbM,cACAC,EAAWP,EAAXO,YACAC,EAAIR,EAAJQ,KAAIC,EAAAT,EACJU,UAAAA,OAAY,IAAHD,EAAG,OAAMA,EAAAE,EAAAX,EAClBY,oBAAAA,OAAsB,IAAHD,EAAG,OAAMA,EAC5BE,EAAMb,EAANa,OAIFC,EAAkCC,GAAkB,GAAMC,EAAAC,EAAAH,EAAA,GAAnDI,EAASF,EAAA,GAAEG,EAAYH,EAAA,GACxBI,EAAWC,EAAYX,GAEvBY,EAAkC,SAAbF,GAAuBF,EAElD,OACEK,EACEC,cAAA,MAAA,CAAAvB,IAAKA,EACLC,GAAIA,EACJC,UAAWsB,EACTC,EAAOC,gBAAeC,EAAAA,EACnBF,CAAAA,EAAAA,EAAOG,WATKvB,GAA8B,SAAbc,GASMM,EAAOb,OAASA,GACtDV,GAEW,cAAAC,GAAc0B,EAAUC,EAAuBC,kBAAmB9B,GAC/E+B,KAAK,eACLC,YAAa,WAAA,OAAMf,GAAa,EAAK,EACrCgB,aAAc,WAAA,OAAMhB,GAAa,EAAM,EACvCiB,QAAS,WAAA,OAAMjB,GAAa,EAAK,EACjCkB,OAAQ,WAAA,OAAMlB,GAAa,EAAM,EACtB,YAAAb,EAAgBc,OAAWkB,EACtCC,SAAUjC,EAAgB,OAAIgC,GAE9Bf,EAAAC,cAACgB,EAAK,CAAAC,UAAU,MAAMC,MAAM,SAASvC,UAAWuB,EAAOiB,uBAAwBC,IAAI,MAChFpC,GAAQe,EAAAC,cAACqB,EAAI,CAACrC,KAAMA,EAAML,UAAWuB,EAAOlB,OAC3B,iBAAVH,EACNkB,EAAAC,cAACsB,EAAI,CAACC,KAAK,QAAQC,OAAO,SAASC,MAAM,aACtC5C,GAGHA,EAEDE,GACCgB,EAACC,cAAA0B,EAAQ,CAAAC,QAAS5C,EAAa6C,0BAA2B1B,EAAO2B,aAC/D9B,EAAAC,cAACqB,EAAI,CAACrC,KAAM8C,EAAMC,UAAWhD,MAIlCD,GACCiB,EAAAC,cAACgB,EAAI,CAACC,UAAU,MAAMC,MAAM,SAASvC,UAAWuB,EAAO8B,qBACrDjC,EAAAC,cAACiC,EACC,CAAAjD,KAAMkD,EAAYhD,GAClBiD,KAAK,WACLC,KAAK,KACLC,UAAWjD,EAAmB,eAChBU,EACdnB,UAAWsB,EAAGC,EAAOoC,KAAMC,EAASrC,EAAQhB,GAAUkB,EACnDF,CAAAA,EAAAA,EAAOsC,KAAO1C,IAEjB2C,QAAS,WAAA,OAAM3D,EAAc4D,EAAiBxD,GAAW,KAMrE"}
+{"version":3,"file":"TableHeaderCell.js","sources":["../../../../../../src/components/Table/TableHeaderCell/TableHeaderCell.tsx"],"sourcesContent":["import React, { forwardRef, useState } from \"react\";\nimport cx from \"classnames\";\nimport { type VibeComponentProps } from \"../../../types\";\nimport styles from \"./TableHeaderCell.module.scss\";\nimport { Icon, type SubIcon } from \"@vibe/icon\";\nimport IconButton from \"../../IconButton/IconButton\";\nimport { Info } from \"@vibe/icons\";\nimport Text from \"../../Text/Text\";\nimport Flex from \"../../Flex/Flex\";\nimport { getAriaSort, getNextSortState, getSortIcon } from \"../Table/tableHelpers\";\nimport Tooltip from \"../../Tooltip/Tooltip\";\nimport { getTestId } from \"../../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../../tests/constants\";\nimport { getStyle } from \"../../../helpers/typesciptCssModulesHelper\";\n\nexport interface TableHeaderCellProps extends VibeComponentProps {\n  /**\n   * The title of the column, displayed inside the header cell.\n   */\n  title: string | React.ReactNode;\n  /**\n   * Icon displayed next to the column title.\n   */\n  icon?: SubIcon;\n  /**\n   * Tooltip content for additional information about the column.\n   */\n  infoContent?: string;\n  /**\n   * Current sorting state of the column.\n   */\n  sortState?: \"asc\" | \"desc\" | \"none\";\n  /**\n   * Callback fired when the column header is clicked to change sorting.\n   */\n  onSortClicked?: (direction: \"asc\" | \"desc\" | \"none\") => void;\n  /**\n   * ARIA label for the sort button.\n   */\n  sortButtonAriaLabel?: string;\n  /**\n   * If true, the header cell remains visible while scrolling horizontally.\n   */\n  sticky?: boolean;\n}\n\nconst TableHeaderCell = forwardRef(\n  (\n    {\n      id,\n      className,\n      \"data-testid\": dataTestId,\n      title,\n      onSortClicked,\n      infoContent,\n      icon,\n      sortState = \"none\",\n      sortButtonAriaLabel = \"Sort\",\n      sticky\n    }: TableHeaderCellProps,\n    ref: React.ForwardedRef<HTMLDivElement>\n  ) => {\n    const [isHovered, setIsHovered] = useState<boolean>(false);\n    const ariaSort = getAriaSort(sortState);\n    const isSortActive = onSortClicked && ariaSort !== \"none\";\n    const shouldShowSortIcon = ariaSort !== \"none\" || isHovered;\n\n    return (\n      <div\n        ref={ref}\n        id={id}\n        className={cx(\n          styles.tableHeaderCell,\n          { [styles.sortActive]: isSortActive, [styles.sticky]: sticky },\n          className\n        )}\n        data-testid={dataTestId || getTestId(ComponentDefaultTestId.TABLE_HEADER_CELL, id)}\n        role=\"columnheader\"\n        onMouseOver={() => setIsHovered(true)}\n        onMouseLeave={() => setIsHovered(false)}\n        onFocus={() => setIsHovered(true)}\n        onBlur={() => setIsHovered(false)}\n        aria-sort={onSortClicked ? ariaSort : undefined}\n        tabIndex={onSortClicked ? 0 : undefined}\n      >\n        <Flex direction=\"row\" align=\"center\" className={styles.tableHeaderCellContent} gap=\"xs\">\n          {icon && <Icon icon={icon} className={styles.icon} />}\n          {typeof title === \"string\" ? (\n            <Text type=\"text2\" weight=\"medium\" color=\"secondary\">\n              {title}\n            </Text>\n          ) : (\n            title\n          )}\n          {infoContent && (\n            <Tooltip content={infoContent} referenceWrapperClassName={styles.infoTooltip}>\n              <Icon icon={Info} iconLabel={infoContent} />\n            </Tooltip>\n          )}\n        </Flex>\n        {onSortClicked && (\n          <Flex direction=\"row\" align=\"center\" className={styles.tableHeaderCellSort}>\n            <IconButton\n              icon={getSortIcon(sortState)}\n              kind=\"tertiary\"\n              size=\"xs\"\n              ariaLabel={sortButtonAriaLabel}\n              aria-hidden={!shouldShowSortIcon}\n              className={cx(styles.sort, getStyle(styles, sortState), {\n                [styles.show]: shouldShowSortIcon\n              })}\n              onClick={() => onSortClicked(getNextSortState(sortState))}\n            />\n          </Flex>\n        )}\n      </div>\n    );\n  }\n);\n\nexport default TableHeaderCell;\n"],"names":["TableHeaderCell","forwardRef","_ref","ref","id","className","dataTestId","title","onSortClicked","infoContent","icon","_ref$sortState","sortState","_ref$sortButtonAriaLa","sortButtonAriaLabel","sticky","_useState","useState","_useState2","_slicedToArray","isHovered","setIsHovered","ariaSort","getAriaSort","shouldShowSortIcon","React","createElement","cx","styles","tableHeaderCell","_defineProperty","sortActive","getTestId","ComponentDefaultTestId","TABLE_HEADER_CELL","role","onMouseOver","onMouseLeave","onFocus","onBlur","undefined","tabIndex","Flex","direction","align","tableHeaderCellContent","gap","Icon","Text","type","weight","color","Tooltip","content","referenceWrapperClassName","infoTooltip","Info","iconLabel","tableHeaderCellSort","IconButton","getSortIcon","kind","size","ariaLabel","sort","getStyle","show","onClick","getNextSortState"],"mappings":"ixBA8CMA,IAAAA,EAAkBC,GACtB,SAAAC,EAaEC,GACE,IAZAC,EAAEF,EAAFE,GACAC,EAASH,EAATG,UACeC,EAAUJ,EAAzB,eACAK,EAAKL,EAALK,MACAC,EAAaN,EAAbM,cACAC,EAAWP,EAAXO,YACAC,EAAIR,EAAJQ,KAAIC,EAAAT,EACJU,UAAAA,OAAY,IAAHD,EAAG,OAAMA,EAAAE,EAAAX,EAClBY,oBAAAA,OAAsB,IAAHD,EAAG,OAAMA,EAC5BE,EAAMb,EAANa,OAIFC,EAAkCC,GAAkB,GAAMC,EAAAC,EAAAH,EAAA,GAAnDI,EAASF,EAAA,GAAEG,EAAYH,EAAA,GACxBI,EAAWC,EAAYX,GAEvBY,EAAkC,SAAbF,GAAuBF,EAElD,OACEK,EACEC,cAAA,MAAA,CAAAvB,IAAKA,EACLC,GAAIA,EACJC,UAAWsB,EACTC,EAAOC,gBAAeC,EAAAA,EACnBF,CAAAA,EAAAA,EAAOG,WATKvB,GAA8B,SAAbc,GASMM,EAAOb,OAASA,GACtDV,GAEW,cAAAC,GAAc0B,EAAUC,EAAuBC,kBAAmB9B,GAC/E+B,KAAK,eACLC,YAAa,WAAA,OAAMf,GAAa,EAAK,EACrCgB,aAAc,WAAA,OAAMhB,GAAa,EAAM,EACvCiB,QAAS,WAAA,OAAMjB,GAAa,EAAK,EACjCkB,OAAQ,WAAA,OAAMlB,GAAa,EAAM,EACtB,YAAAb,EAAgBc,OAAWkB,EACtCC,SAAUjC,EAAgB,OAAIgC,GAE9Bf,EAAAC,cAACgB,EAAK,CAAAC,UAAU,MAAMC,MAAM,SAASvC,UAAWuB,EAAOiB,uBAAwBC,IAAI,MAChFpC,GAAQe,EAAAC,cAACqB,EAAI,CAACrC,KAAMA,EAAML,UAAWuB,EAAOlB,OAC3B,iBAAVH,EACNkB,EAAAC,cAACsB,EAAI,CAACC,KAAK,QAAQC,OAAO,SAASC,MAAM,aACtC5C,GAGHA,EAEDE,GACCgB,EAACC,cAAA0B,EAAQ,CAAAC,QAAS5C,EAAa6C,0BAA2B1B,EAAO2B,aAC/D9B,EAAAC,cAACqB,EAAI,CAACrC,KAAM8C,EAAMC,UAAWhD,MAIlCD,GACCiB,EAAAC,cAACgB,EAAI,CAACC,UAAU,MAAMC,MAAM,SAASvC,UAAWuB,EAAO8B,qBACrDjC,EAAAC,cAACiC,EACC,CAAAjD,KAAMkD,EAAYhD,GAClBiD,KAAK,WACLC,KAAK,KACLC,UAAWjD,EAAmB,eAChBU,EACdnB,UAAWsB,EAAGC,EAAOoC,KAAMC,EAASrC,EAAQhB,GAAUkB,EACnDF,CAAAA,EAAAA,EAAOsC,KAAO1C,IAEjB2C,QAAS,WAAA,OAAM3D,EAAc4D,EAAiBxD,GAAW,KAMrE"}

package/dist/mocked_classnames/src/components/Tabs/Tab/Tab.js

@@ -1,2 +1,2 @@
-import{defineProperty as e,toConsumableArray as t}from"../../../../_virtual/_rollupPluginBabelHelpers.js";import o from"classnames";import r,{forwardRef as i,useRef as s}from"react";import{noop as a}from"es-toolkit";import n from"../../../hooks/useMergeRef.js";import{getStyle as l}from"../../../helpers/typesciptCssModulesHelper.js";import{Icon as c}from"@vibe/icon/mockedClassNames";import{getTestId as d,ComponentDefaultTestId as m}from"../../../tests/testIds.js";import p from"./Tab.module.scss.js";import f from"../../Tooltip/Tooltip.js";import{ComponentVibeId as u}from"../../../tests/constants.js";import{keyCodes as v}from"../../../constants/keyCodes.js";import"../../../constants/sizes.js";var b=i((function(i,b){var y=i.className,j=i.tabInnerClassName,C=i.id,k=i.value,T=void 0===k?0:k,E=i.disabled,I=void 0!==E&&E,N=i.active,h=void 0!==N&&N,A=i.focus,g=void 0!==A&&A,P=i.stretchedUnderline,S=void 0!==P&&P,x=i.onClick,B=void 0===x?a:x,H=i.tooltipProps,z=void 0===H?{}:H,D=i.icon,F=i.iconType,M=i.iconSide,R=void 0===M?"left":M,U=i.children,_=i["data-testid"],w=i.tabIndex,K=i.ariaControls,O=s(null),V=n(b,O);return r.createElement(f,Object.assign({},z,{content:z.content}),r.createElement("li",{ref:V,key:C,className:o(p.tabWrapper,y,e(e(e(e({},p.active,h),p.disabled,I),p.tabFocusVisibleInset,g),p.stretchedUnderline,S)),id:C,role:"tab","aria-selected":h,"aria-disabled":I,"aria-controls":K||void 0,tabIndex:w,"data-testid":_||d(m.TAB,C),"data-vibe":u.TAB,onClick:function(){return!I&&B(T)},onKeyDown:function(e){e.key!==v.ENTER&&e.key!==v.SPACE||(e.preventDefault(),!I&&B(T))}},r.createElement("div",{className:o(p.tabInner,j)},function(){if(!D)return U;var e=r.createElement(c,{ariaHidden:!0,iconType:F,icon:D,className:o(p.tabIcon,l(p,R)),iconSize:18,ignoreFocusStyle:!0}),i=r.Children.toArray(U);return"left"===R?[e].concat(t(i)):[].concat(t(i),[e])}())))}));export{b as default};
+import{defineProperty as e,toConsumableArray as t}from"../../../../_virtual/_rollupPluginBabelHelpers.js";import o from"classnames";import r,{forwardRef as i,useRef as s}from"react";import{noop as a}from"es-toolkit";import n from"../../../hooks/useMergeRef.js";import{getStyle as c}from"../../../helpers/typesciptCssModulesHelper.js";import{getTestId as l,ComponentDefaultTestId as d}from"../../../tests/testIds.js";import m from"./Tab.module.scss.js";import p from"../../Tooltip/Tooltip.js";import{ComponentVibeId as f}from"../../../tests/constants.js";import{keyCodes as u}from"../../../constants/keyCodes.js";import"../../../constants/sizes.js";import v from"../../../../components/icon/dist/Icon/Icon.js";var b=i((function(i,b){var y=i.className,j=i.tabInnerClassName,C=i.id,I=i.value,k=void 0===I?0:I,T=i.disabled,E=void 0!==T&&T,h=i.active,N=void 0!==h&&h,A=i.focus,g=void 0!==A&&A,P=i.stretchedUnderline,S=void 0!==P&&P,x=i.onClick,B=void 0===x?a:x,H=i.tooltipProps,z=void 0===H?{}:H,D=i.icon,F=i.iconType,M=i.iconSide,R=void 0===M?"left":M,U=i.children,_=i["data-testid"],w=i.tabIndex,K=i.ariaControls,O=s(null),V=n(b,O);return r.createElement(p,Object.assign({},z,{content:z.content}),r.createElement("li",{ref:V,key:C,className:o(m.tabWrapper,y,e(e(e(e({},m.active,N),m.disabled,E),m.tabFocusVisibleInset,g),m.stretchedUnderline,S)),id:C,role:"tab","aria-selected":N,"aria-disabled":E,"aria-controls":K||void 0,tabIndex:w,"data-testid":_||l(d.TAB,C),"data-vibe":f.TAB,onClick:function(){return!E&&B(k)},onKeyDown:function(e){e.key!==u.ENTER&&e.key!==u.SPACE||(e.preventDefault(),!E&&B(k))}},r.createElement("div",{className:o(m.tabInner,j)},function(){if(!D)return U;var e=r.createElement(v,{ariaHidden:!0,iconType:F,icon:D,className:o(m.tabIcon,c(m,R)),iconSize:18,ignoreFocusStyle:!0}),i=r.Children.toArray(U);return"left"===R?[e].concat(t(i)):[].concat(t(i),[e])}())))}));export{b as default};
 //# sourceMappingURL=Tab.js.map

package/dist/mocked_classnames/src/components/Tabs/Tab/Tab.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tab.js","sources":["../../../../../../src/components/Tabs/Tab/Tab.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { type FC, forwardRef, type ReactElement, useRef } from \"react\";\nimport { noop as NOOP } from \"es-toolkit\";\nimport useMergeRef from \"../../../hooks/useMergeRef\";\nimport { getStyle } from \"../../../helpers/typesciptCssModulesHelper\";\nimport { Icon, type IconType, type SubIcon } from \"@vibe/icon\";\nimport type VibeComponentProps from \"../../../types/VibeComponentProps\";\nimport { ComponentDefaultTestId, getTestId } from \"../../../tests/test-ids-utils\";\nimport styles from \"./Tab.module.scss\";\nimport Tooltip, { type TooltipProps } from \"../../Tooltip/Tooltip\";\nimport { ComponentVibeId } from \"../../../tests/constants\";\nimport { keyCodes } from \"../../../constants\";\n\nexport interface TabProps extends VibeComponentProps {\n  /**\n   * Class name applied to the inner tab content.\n   */\n  tabInnerClassName?: string;\n  /**\n   * The index value of the tab.\n   */\n  value?: number;\n  /**\n   * If true, disables the tab.\n   */\n  disabled?: boolean;\n  /**\n   * If true, marks the tab as active.\n   */\n  active?: boolean;\n  /**\n   * If true, applies focus styles to the tab.\n   */\n  focus?: boolean;\n  /**\n   * If true, hides the individual tab border when using stretched underline.\n   */\n  stretchedUnderline?: boolean;\n  /**\n   * The icon displayed in the tab.\n   */\n  icon?: SubIcon;\n  /**\n   * The type of icon.\n   */\n  iconType?: IconType;\n  /**\n   * The position of the icon relative to the text.\n   */\n  iconSide?: string;\n  /**\n   * Callback fired when the tab is clicked.\n   */\n  onClick?: (value: number) => void;\n  /**\n   * Props passed to the tab's tooltip.\n   */\n  tooltipProps?: Partial<TooltipProps>;\n  /**\n   * The content displayed inside the tab.\n   */\n  children?: string | ReactElement | ReactElement[];\n  /**\n   * Tab index for focus management.\n   */\n  tabIndex?: number;\n  /**\n   * The id of the associated TabPanel for aria-controls attribute.\n   */\n  ariaControls?: string;\n}\n\nconst Tab: FC<TabProps> = forwardRef(\n  (\n    {\n      className,\n      tabInnerClassName,\n      id,\n      value = 0,\n      disabled = false,\n      active = false,\n      focus = false,\n      stretchedUnderline = false,\n      onClick = NOOP,\n      tooltipProps = {} as TooltipProps,\n      icon,\n      iconType,\n      iconSide = \"left\",\n      children,\n      \"data-testid\": dataTestId,\n      tabIndex,\n      ariaControls\n    }: TabProps,\n    ref\n  ) => {\n    const componentRef = useRef(null);\n    const mergedRef = useMergeRef(ref, componentRef);\n\n    function renderIconAndChildren() {\n      if (!icon) return children;\n\n      const iconElement = (\n        <Icon\n          ariaHidden={true}\n          iconType={iconType}\n          icon={icon}\n          className={cx(styles.tabIcon, getStyle(styles, iconSide))}\n          iconSize={18}\n          ignoreFocusStyle\n        />\n      );\n\n      const childrenArray = React.Children.toArray(children);\n\n      if (iconSide === \"left\") {\n        return [iconElement, ...childrenArray];\n      }\n\n      return [...childrenArray, iconElement];\n    }\n\n    function handleKeyDown(event: React.KeyboardEvent) {\n      if (event.key === keyCodes.ENTER || event.key === keyCodes.SPACE) {\n        event.preventDefault();\n        !disabled && onClick(value);\n      }\n    }\n\n    return (\n      <Tooltip {...tooltipProps} content={tooltipProps.content}>\n        <li\n          ref={mergedRef}\n          key={id}\n          className={cx(styles.tabWrapper, className, {\n            [styles.active]: active,\n            [styles.disabled]: disabled,\n            [styles.tabFocusVisibleInset]: focus,\n            [styles.stretchedUnderline]: stretchedUnderline\n          })}\n          id={id}\n          role=\"tab\"\n          aria-selected={active}\n          aria-disabled={disabled}\n          aria-controls={ariaControls || undefined}\n          tabIndex={tabIndex}\n          data-testid={dataTestId || getTestId(ComponentDefaultTestId.TAB, id)}\n          data-vibe={ComponentVibeId.TAB}\n          onClick={() => !disabled && onClick(value)}\n          onKeyDown={handleKeyDown}\n        >\n          <div className={cx(styles.tabInner, tabInnerClassName)}>{renderIconAndChildren()}</div>\n        </li>\n      </Tooltip>\n    );\n  }\n);\n\nexport default Tab;\n"],"names":["Tab","forwardRef","_ref","ref","className","tabInnerClassName","id","_ref$value","value","_ref$disabled","disabled","_ref$active","active","_ref$focus","focus","_ref$stretchedUnderli","stretchedUnderline","_ref$onClick","onClick","NOOP","_ref$tooltipProps","tooltipProps","icon","iconType","_ref$iconSide","iconSide","children","dataTestId","tabIndex","ariaControls","componentRef","useRef","mergedRef","useMergeRef","React","createElement","Tooltip","Object","assign","content","key","cx","styles","tabWrapper","_defineProperty","tabFocusVisibleInset","role","undefined","getTestId","ComponentDefaultTestId","TAB","ComponentVibeId","onKeyDown","event","keyCodes","ENTER","SPACE","preventDefault","tabInner","iconElement","Icon","ariaHidden","tabIcon","getStyle","iconSize","ignoreFocusStyle","childrenArray","Children","toArray","concat","_toConsumableArray","renderIconAndChildren"],"mappings":"2rBAwEMA,IAAAA,EAAoBC,GACxB,SAAAC,EAoBEC,GACE,IAnBAC,EAASF,EAATE,UACAC,EAAiBH,EAAjBG,kBACAC,EAAEJ,EAAFI,GAAEC,EAAAL,EACFM,MAAAA,OAAQ,IAAHD,EAAG,EAACA,EAAAE,EAAAP,EACTQ,SAAAA,OAAW,IAAHD,GAAQA,EAAAE,EAAAT,EAChBU,OAAAA,OAAS,IAAHD,GAAQA,EAAAE,EAAAX,EACdY,MAAAA,OAAQ,IAAHD,GAAQA,EAAAE,EAAAb,EACbc,mBAAAA,OAAqB,IAAHD,GAAQA,EAAAE,EAAAf,EAC1BgB,QAAAA,OAAUC,IAAHF,EAAGE,EAAIF,EAAAG,EAAAlB,EACdmB,aAAAA,OAAY,IAAAD,EAAG,CAAkB,EAAAA,EACjCE,EAAIpB,EAAJoB,KACAC,EAAQrB,EAARqB,SAAQC,EAAAtB,EACRuB,SAAAA,OAAW,IAAHD,EAAG,OAAMA,EACjBE,EAAQxB,EAARwB,SACeC,EAAUzB,EAAzB,eACA0B,EAAQ1B,EAAR0B,SACAC,EAAY3B,EAAZ2B,aAIIC,EAAeC,EAAO,MACtBC,EAAYC,EAAY9B,EAAK2B,GAgCnC,OACEI,EAACC,cAAAC,EAAYC,OAAAC,OAAA,CAAA,EAAAjB,GAAckB,QAASlB,EAAakB,UAC/CL,EAAAC,cAAA,KAAA,CACEhC,IAAK6B,EACLQ,IAAKlC,EACLF,UAAWqC,EAAGC,EAAOC,WAAYvC,EAASwC,EAAAA,EAAAA,EAAAA,EAAA,CAAA,EACvCF,EAAO9B,OAASA,GAChB8B,EAAOhC,SAAWA,GAClBgC,EAAOG,qBAAuB/B,GAC9B4B,EAAO1B,mBAAqBA,IAE/BV,GAAIA,EACJwC,KAAK,MAAK,gBACKlC,EAAM,gBACNF,EACA,gBAAAmB,QAAgBkB,EAC/BnB,SAAUA,EAAQ,cACLD,GAAcqB,EAAUC,EAAuBC,IAAK5C,GAAG,YACzD6C,EAAgBD,IAC3BhC,QAAS,WAAA,OAAOR,GAAYQ,EAAQV,EAAM,EAC1C4C,UA3BN,SAAuBC,GACjBA,EAAMb,MAAQc,EAASC,OAASF,EAAMb,MAAQc,EAASE,QACzDH,EAAMI,kBACL/C,GAAYQ,EAAQV,GAEzB,GAwBM0B,EAAAC,cAAA,MAAA,CAAK/B,UAAWqC,EAAGC,EAAOgB,SAAUrD,IApD1C,WACE,IAAKiB,EAAM,OAAOI,EAElB,IAAMiC,EACJzB,gBAAC0B,EAAI,CACHC,YAAY,EACZtC,SAAUA,EACVD,KAAMA,EACNlB,UAAWqC,EAAGC,EAAOoB,QAASC,EAASrB,EAAQjB,IAC/CuC,SAAU,GACVC,kBAAgB,IAIdC,EAAgBhC,EAAMiC,SAASC,QAAQ1C,GAE7C,MAAiB,SAAbD,EACF,CAAQkC,GAAWU,OAAAC,EAAKJ,IAG1B,GAAAG,OAAAC,EAAWJ,IAAeP,GAC5B,CA+B+DY,KAIjE"}
+{"version":3,"file":"Tab.js","sources":["../../../../../../src/components/Tabs/Tab/Tab.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { type FC, forwardRef, type ReactElement, useRef } from \"react\";\nimport { noop as NOOP } from \"es-toolkit\";\nimport useMergeRef from \"../../../hooks/useMergeRef\";\nimport { getStyle } from \"../../../helpers/typesciptCssModulesHelper\";\nimport { Icon, type IconType, type SubIcon } from \"@vibe/icon\";\nimport type VibeComponentProps from \"../../../types/VibeComponentProps\";\nimport { ComponentDefaultTestId, getTestId } from \"../../../tests/test-ids-utils\";\nimport styles from \"./Tab.module.scss\";\nimport Tooltip, { type TooltipProps } from \"../../Tooltip/Tooltip\";\nimport { ComponentVibeId } from \"../../../tests/constants\";\nimport { keyCodes } from \"../../../constants\";\n\nexport interface TabProps extends VibeComponentProps {\n  /**\n   * Class name applied to the inner tab content.\n   */\n  tabInnerClassName?: string;\n  /**\n   * The index value of the tab.\n   */\n  value?: number;\n  /**\n   * If true, disables the tab.\n   */\n  disabled?: boolean;\n  /**\n   * If true, marks the tab as active.\n   */\n  active?: boolean;\n  /**\n   * If true, applies focus styles to the tab.\n   */\n  focus?: boolean;\n  /**\n   * If true, hides the individual tab border when using stretched underline.\n   */\n  stretchedUnderline?: boolean;\n  /**\n   * The icon displayed in the tab.\n   */\n  icon?: SubIcon;\n  /**\n   * The type of icon.\n   */\n  iconType?: IconType;\n  /**\n   * The position of the icon relative to the text.\n   */\n  iconSide?: string;\n  /**\n   * Callback fired when the tab is clicked.\n   */\n  onClick?: (value: number) => void;\n  /**\n   * Props passed to the tab's tooltip.\n   */\n  tooltipProps?: Partial<TooltipProps>;\n  /**\n   * The content displayed inside the tab.\n   */\n  children?: string | ReactElement | ReactElement[];\n  /**\n   * Tab index for focus management.\n   */\n  tabIndex?: number;\n  /**\n   * The id of the associated TabPanel for aria-controls attribute.\n   */\n  ariaControls?: string;\n}\n\nconst Tab: FC<TabProps> = forwardRef(\n  (\n    {\n      className,\n      tabInnerClassName,\n      id,\n      value = 0,\n      disabled = false,\n      active = false,\n      focus = false,\n      stretchedUnderline = false,\n      onClick = NOOP,\n      tooltipProps = {} as TooltipProps,\n      icon,\n      iconType,\n      iconSide = \"left\",\n      children,\n      \"data-testid\": dataTestId,\n      tabIndex,\n      ariaControls\n    }: TabProps,\n    ref\n  ) => {\n    const componentRef = useRef(null);\n    const mergedRef = useMergeRef(ref, componentRef);\n\n    function renderIconAndChildren() {\n      if (!icon) return children;\n\n      const iconElement = (\n        <Icon\n          ariaHidden={true}\n          iconType={iconType}\n          icon={icon}\n          className={cx(styles.tabIcon, getStyle(styles, iconSide))}\n          iconSize={18}\n          ignoreFocusStyle\n        />\n      );\n\n      const childrenArray = React.Children.toArray(children);\n\n      if (iconSide === \"left\") {\n        return [iconElement, ...childrenArray];\n      }\n\n      return [...childrenArray, iconElement];\n    }\n\n    function handleKeyDown(event: React.KeyboardEvent) {\n      if (event.key === keyCodes.ENTER || event.key === keyCodes.SPACE) {\n        event.preventDefault();\n        !disabled && onClick(value);\n      }\n    }\n\n    return (\n      <Tooltip {...tooltipProps} content={tooltipProps.content}>\n        <li\n          ref={mergedRef}\n          key={id}\n          className={cx(styles.tabWrapper, className, {\n            [styles.active]: active,\n            [styles.disabled]: disabled,\n            [styles.tabFocusVisibleInset]: focus,\n            [styles.stretchedUnderline]: stretchedUnderline\n          })}\n          id={id}\n          role=\"tab\"\n          aria-selected={active}\n          aria-disabled={disabled}\n          aria-controls={ariaControls || undefined}\n          tabIndex={tabIndex}\n          data-testid={dataTestId || getTestId(ComponentDefaultTestId.TAB, id)}\n          data-vibe={ComponentVibeId.TAB}\n          onClick={() => !disabled && onClick(value)}\n          onKeyDown={handleKeyDown}\n        >\n          <div className={cx(styles.tabInner, tabInnerClassName)}>{renderIconAndChildren()}</div>\n        </li>\n      </Tooltip>\n    );\n  }\n);\n\nexport default Tab;\n"],"names":["Tab","forwardRef","_ref","ref","className","tabInnerClassName","id","_ref$value","value","_ref$disabled","disabled","_ref$active","active","_ref$focus","focus","_ref$stretchedUnderli","stretchedUnderline","_ref$onClick","onClick","NOOP","_ref$tooltipProps","tooltipProps","icon","iconType","_ref$iconSide","iconSide","children","dataTestId","tabIndex","ariaControls","componentRef","useRef","mergedRef","useMergeRef","React","createElement","Tooltip","Object","assign","content","key","cx","styles","tabWrapper","_defineProperty","tabFocusVisibleInset","role","undefined","getTestId","ComponentDefaultTestId","TAB","ComponentVibeId","onKeyDown","event","keyCodes","ENTER","SPACE","preventDefault","tabInner","iconElement","Icon","ariaHidden","tabIcon","getStyle","iconSize","ignoreFocusStyle","childrenArray","Children","toArray","concat","_toConsumableArray","renderIconAndChildren"],"mappings":"qsBAwEMA,IAAAA,EAAoBC,GACxB,SAAAC,EAoBEC,GACE,IAnBAC,EAASF,EAATE,UACAC,EAAiBH,EAAjBG,kBACAC,EAAEJ,EAAFI,GAAEC,EAAAL,EACFM,MAAAA,OAAQ,IAAHD,EAAG,EAACA,EAAAE,EAAAP,EACTQ,SAAAA,OAAW,IAAHD,GAAQA,EAAAE,EAAAT,EAChBU,OAAAA,OAAS,IAAHD,GAAQA,EAAAE,EAAAX,EACdY,MAAAA,OAAQ,IAAHD,GAAQA,EAAAE,EAAAb,EACbc,mBAAAA,OAAqB,IAAHD,GAAQA,EAAAE,EAAAf,EAC1BgB,QAAAA,OAAUC,IAAHF,EAAGE,EAAIF,EAAAG,EAAAlB,EACdmB,aAAAA,OAAY,IAAAD,EAAG,CAAkB,EAAAA,EACjCE,EAAIpB,EAAJoB,KACAC,EAAQrB,EAARqB,SAAQC,EAAAtB,EACRuB,SAAAA,OAAW,IAAHD,EAAG,OAAMA,EACjBE,EAAQxB,EAARwB,SACeC,EAAUzB,EAAzB,eACA0B,EAAQ1B,EAAR0B,SACAC,EAAY3B,EAAZ2B,aAIIC,EAAeC,EAAO,MACtBC,EAAYC,EAAY9B,EAAK2B,GAgCnC,OACEI,EAACC,cAAAC,EAAYC,OAAAC,OAAA,CAAA,EAAAjB,GAAckB,QAASlB,EAAakB,UAC/CL,EAAAC,cAAA,KAAA,CACEhC,IAAK6B,EACLQ,IAAKlC,EACLF,UAAWqC,EAAGC,EAAOC,WAAYvC,EAASwC,EAAAA,EAAAA,EAAAA,EAAA,CAAA,EACvCF,EAAO9B,OAASA,GAChB8B,EAAOhC,SAAWA,GAClBgC,EAAOG,qBAAuB/B,GAC9B4B,EAAO1B,mBAAqBA,IAE/BV,GAAIA,EACJwC,KAAK,MAAK,gBACKlC,EAAM,gBACNF,EACA,gBAAAmB,QAAgBkB,EAC/BnB,SAAUA,EAAQ,cACLD,GAAcqB,EAAUC,EAAuBC,IAAK5C,GAAG,YACzD6C,EAAgBD,IAC3BhC,QAAS,WAAA,OAAOR,GAAYQ,EAAQV,EAAM,EAC1C4C,UA3BN,SAAuBC,GACjBA,EAAMb,MAAQc,EAASC,OAASF,EAAMb,MAAQc,EAASE,QACzDH,EAAMI,kBACL/C,GAAYQ,EAAQV,GAEzB,GAwBM0B,EAAAC,cAAA,MAAA,CAAK/B,UAAWqC,EAAGC,EAAOgB,SAAUrD,IApD1C,WACE,IAAKiB,EAAM,OAAOI,EAElB,IAAMiC,EACJzB,gBAAC0B,EAAI,CACHC,YAAY,EACZtC,SAAUA,EACVD,KAAMA,EACNlB,UAAWqC,EAAGC,EAAOoB,QAASC,EAASrB,EAAQjB,IAC/CuC,SAAU,GACVC,kBAAgB,IAIdC,EAAgBhC,EAAMiC,SAASC,QAAQ1C,GAE7C,MAAiB,SAAbD,EACF,CAAQkC,GAAWU,OAAAC,EAAKJ,IAG1B,GAAAG,OAAAC,EAAWJ,IAAeP,GAC5B,CA+B+DY,KAIjE"}

package/dist/mocked_classnames/src/components/TextField/TextField.js

@@ -1,2 +1,2 @@
-import{slicedToArray as e,defineProperty as t}from"../../../_virtual/_rollupPluginBabelHelpers.js";import o from"classnames";import a,{forwardRef as n,useState as r,useRef as i,useCallback as l,useMemo as s,useEffect as c}from"react";import d from"../../hooks/useDebounceEvent/index.js";import{Icon as m}from"@vibe/icon/mockedClassNames";import{Loader as u}from"@vibe/loader/mockedClassNames";import p from"../Text/Text.js";import v from"../FieldLabel/FieldLabel.js";import{TextFieldFeedbackState as f,TextFieldTextType as C,FEEDBACK_CLASSES as b,SIZE_MAPPER as x,TextFieldAriaLabel as y}from"./TextFieldConstants.js";import{BASE_SIZES as E}from"../../constants/sizes.js";import T from"../../hooks/useMergeRef.js";import N from"../Clickable/Clickable.js";import{getTestId as h}from"../../tests/testIds.js";import{NOOP as g}from"../../utils/function-utils.js";import{ComponentDefaultTestId as I,ComponentVibeId as j}from"../../tests/constants.js";import{withStaticProps as F}from"../../types/withStaticProps.js";import"../../utils/colors-vars-map.js";import k from"./TextField.module.scss.js";import L from"../Tooltip/Tooltip.js";import D from"../HiddenText/HiddenText.js";var w={primary:"",secondary:""},H=F(n((function(n,f){var C=n.className,E=void 0===C?"":C,F=n.placeholder,H=void 0===F?"":F,A=n.autoComplete,S=void 0===A?"off":A,_=n.value,q=n.onChange,R=void 0===q?g:q,W=n.onBlur,z=void 0===W?g:W,B=n.onFocus,O=void 0===B?g:B,K=n.onKeyDown,M=void 0===K?g:K,P=n.onWheel,V=void 0===P?g:P,X=n.debounceRate,U=void 0===X?0:X,Y=n.autoFocus,G=void 0!==Y&&Y,J=n.disabled,Q=void 0!==J&&J,Z=n.readonly,$=void 0!==Z&&Z,ee=n.setRef,te=void 0===ee?g:ee,oe=n.iconName,ae=n.secondaryIconName,ne=n.id,re=void 0===ne?"input":ne,ie=n.title,le=void 0===ie?"":ie,se=n.size,ce=void 0===se?"small":se,de=n.validation,me=void 0===de?null:de,ue=n.wrapperClassName,pe=void 0===ue?"":ue,ve=n.onIconClick,fe=void 0===ve?g:ve,Ce=n.clearOnIconClick,be=void 0!==Ce&&Ce,xe=n.labelIconName,ye=n.showCharCount,Ee=void 0!==ye&&ye,Te=n.inputAriaLabel,Ne=n.searchResultsContainerId,he=void 0===Ne?"":Ne,ge=n.activeDescendant,Ie=void 0===ge?"":ge,je=n.iconsNames,Fe=void 0===je?w:je,ke=n.type,Le=void 0===ke?"text":ke,De=n.maxLength,we=void 0===De?null:De,He=n.allowExceedingMaxLength,Ae=void 0!==He&&He,Se=n.trim,_e=void 0!==Se&&Se,qe=n.role,Re=void 0===qe?"":qe,We=n.required,ze=void 0!==We&&We,Be=n.requiredErrorText,Oe=void 0===Be?"":Be,Ke=n.loading,Me=void 0!==Ke&&Ke,Pe=n["data-testid"],Ve=n.secondaryDataTestId,Xe=n.tabIndex,Ue=n.underline,Ye=void 0!==Ue&&Ue,Ge=n.name,Je=n.controlled,Qe=void 0!==Je&&Je,Ze=n.iconTooltipContent,$e=n.secondaryTooltipContent,et=n.dir,tt=r(!1),ot=e(tt,2),at=ot[0],nt=ot[1],rt=i(null),it=T(f,rt,te),lt=l((function(e){ze&&!e.target.value&&nt(!0),z(e)}),[z,ze]),st=l((function(e,t){at&&e&&nt(!1),R(e,t||{target:rt.current})}),[R,at]),ct=d({delay:U,onChange:st,initialStateValue:_,trim:_e}),dt=ct.inputValue,mt=ct.onEventChanged,ut=ct.clearValue,pt=s((function(){return Qe?_:dt}),[Qe,_,dt]),vt=l((function(e){Qe?st(e.target.value,e):mt(e)}),[Qe,st,mt]),ft=s((function(){return ae&&pt?ae:oe}),[oe,ae,pt]),Ct=l((function(){Q||(be&&(rt.current&&rt.current.focus(),rt.current.value="",Qe?st(""):ut()),fe(ft))}),[Q,be,fe,ft,Qe,st,ut]),bt=s((function(){return"number"==typeof we&&pt&&pt.length>we?b.error:me&&me.status||at?b[at?"error":me.status]:""}),[we,me,at,pt]),xt=oe||ae,yt=Ee||me&&me.text||at&&Oe,Et=ae===ft,Tt=oe===ft,Nt=(fe!==g||Fe.primary||Ze)&&pt&&oe.length&&Tt,ht=(ae||$e)&&Et&&!!pt,gt=Ae?"".concat(re,"-allow-exceeding-max-length-text"):void 0;c((function(){if((null==rt?void 0:rt.current)&&G){var e=requestAnimationFrame((function(){return rt.current.focus()}));return function(){return cancelAnimationFrame(e)}}}),[rt,G]);var It=fe!==g||be,jt=Fe.primary||Ze,Ft=Fe.secondary||$e;return a.createElement("div",{className:o(k.textField,pe,t(t({},k.disabled,Q),k.onlyUnderline,Ye)),role:Re,"aria-busy":Me},a.createElement("div",{className:o(k.labelWrapper)},a.createElement(v,{labelText:le,icon:xe,labelFor:re,required:ze}),a.createElement("div",{className:o(k.inputWrapper,x[ce],bt)},a.createElement("input",{className:o(E,k.input,t(t({},k.inputHasIcon,!!xt),k.readOnly,$)),placeholder:H,autoComplete:S,value:pt,onChange:vt,disabled:Q,readOnly:$,ref:it,type:Le,id:re,"data-testid":Pe||h(I.TEXT_FIELD,re),"data-vibe":j.TEXT_FIELD,name:Ge,onBlur:lt,onFocus:O,onKeyDown:M,onWheel:V,maxLength:"number"!=typeof we||Ae?void 0:we,role:he&&"combobox","aria-label":Te||H,"aria-invalid":me&&"error"===me.status||at,"aria-owns":he,"aria-activedescendant":Ie,"aria-required":ze,"aria-describedby":gt,required:ze,tabIndex:Xe,dir:et}),Me&&a.createElement("div",{className:o(k.loaderContainer,t({},k.loaderContainerHasIcon,xt))},a.createElement("div",{className:o(k.loader)},a.createElement(u,{className:o(k.loaderSvg)}))),oe&&a.createElement(L,{content:Tt?Ze:void 0,referenceWrapperClassName:k.tooltipContainer},a.createElement(N,{className:o(k.iconContainer,t(t(t({},k.iconContainerHasIcon,xt),k.iconContainerActive,Tt),k.iconContainerClickable,It)),onClick:Ct,tabIndex:Nt?"0":"-1",ariaLabel:jt},a.createElement(m,{icon:oe,className:o(k.icon),iconType:"font",iconSize:"small"===ce?"16px":"18px"}))),ae&&a.createElement(L,{content:Et?$e:void 0,addKeyboardHideShowTriggersByDefault:!0,referenceWrapperClassName:k.tooltipContainer},a.createElement(N,{className:o(k.iconContainer,t(t(t({},k.iconContainerHasIcon,xt),k.iconContainerActive,Et),k.iconContainerClickable,It)),onClick:Ct,tabIndex:ht?"0":"-1","data-testid":Ve||h(I.TEXT_FIELD_SECONDARY_BUTTON,re),ariaLabel:Ft},a.createElement(m,{icon:ae,className:o(k.icon),iconType:"font",iconSize:"small"===ce?"16px":"18px"})))),yt&&a.createElement(p,{type:"text2",color:"secondary",className:o(k.subTextContainer)},(me&&me.text||at&&Oe)&&a.createElement("span",{className:o(k.subTextContainerStatus)},at?Oe:me.text),Ee&&a.createElement("span",{className:o(k.counter),"aria-label":y.CHAR},pt&&pt.length||0,"number"==typeof we&&"/".concat(we),a.createElement(D,{id:gt,text:"Maximum of ".concat(we," characters")})))))})),{sizes:E,feedbacks:f,types:C});export{H as default};
+import{slicedToArray as e,defineProperty as o}from"../../../_virtual/_rollupPluginBabelHelpers.js";import t from"classnames";import a,{forwardRef as n,useState as r,useRef as i,useCallback as l,useMemo as s,useEffect as c}from"react";import d from"../../hooks/useDebounceEvent/index.js";import m from"../Text/Text.js";import u from"../FieldLabel/FieldLabel.js";import{TextFieldFeedbackState as p,TextFieldTextType as v,FEEDBACK_CLASSES as f,SIZE_MAPPER as C,TextFieldAriaLabel as b}from"./TextFieldConstants.js";import{BASE_SIZES as x}from"../../constants/sizes.js";import y from"../../hooks/useMergeRef.js";import E from"../Clickable/Clickable.js";import{getTestId as T}from"../../tests/testIds.js";import{NOOP as N}from"../../utils/function-utils.js";import{ComponentDefaultTestId as h,ComponentVibeId as g}from"../../tests/constants.js";import{withStaticProps as I}from"../../types/withStaticProps.js";import"../../utils/colors-vars-map.js";import j from"./TextField.module.scss.js";import F from"../Tooltip/Tooltip.js";import L from"../HiddenText/HiddenText.js";import k from"../../../components/loader/dist/Loader/Loader.js";import D from"../../../components/icon/dist/Icon/Icon.js";var w={primary:"",secondary:""},H=I(n((function(n,p){var v=n.className,x=void 0===v?"":v,I=n.placeholder,H=void 0===I?"":I,A=n.autoComplete,S=void 0===A?"off":A,_=n.value,q=n.onChange,R=void 0===q?N:q,W=n.onBlur,z=void 0===W?N:W,B=n.onFocus,O=void 0===B?N:B,K=n.onKeyDown,M=void 0===K?N:K,P=n.onWheel,V=void 0===P?N:P,X=n.debounceRate,U=void 0===X?0:X,Y=n.autoFocus,G=void 0!==Y&&Y,J=n.disabled,Q=void 0!==J&&J,Z=n.readonly,$=void 0!==Z&&Z,ee=n.setRef,oe=void 0===ee?N:ee,te=n.iconName,ae=n.secondaryIconName,ne=n.id,re=void 0===ne?"input":ne,ie=n.title,le=void 0===ie?"":ie,se=n.size,ce=void 0===se?"small":se,de=n.validation,me=void 0===de?null:de,ue=n.wrapperClassName,pe=void 0===ue?"":ue,ve=n.onIconClick,fe=void 0===ve?N:ve,Ce=n.clearOnIconClick,be=void 0!==Ce&&Ce,xe=n.labelIconName,ye=n.showCharCount,Ee=void 0!==ye&&ye,Te=n.inputAriaLabel,Ne=n.searchResultsContainerId,he=void 0===Ne?"":Ne,ge=n.activeDescendant,Ie=void 0===ge?"":ge,je=n.iconsNames,Fe=void 0===je?w:je,Le=n.type,ke=void 0===Le?"text":Le,De=n.maxLength,we=void 0===De?null:De,He=n.allowExceedingMaxLength,Ae=void 0!==He&&He,Se=n.trim,_e=void 0!==Se&&Se,qe=n.role,Re=void 0===qe?"":qe,We=n.required,ze=void 0!==We&&We,Be=n.requiredErrorText,Oe=void 0===Be?"":Be,Ke=n.loading,Me=void 0!==Ke&&Ke,Pe=n["data-testid"],Ve=n.secondaryDataTestId,Xe=n.tabIndex,Ue=n.underline,Ye=void 0!==Ue&&Ue,Ge=n.name,Je=n.controlled,Qe=void 0!==Je&&Je,Ze=n.iconTooltipContent,$e=n.secondaryTooltipContent,eo=n.dir,oo=r(!1),to=e(oo,2),ao=to[0],no=to[1],ro=i(null),io=y(p,ro,oe),lo=l((function(e){ze&&!e.target.value&&no(!0),z(e)}),[z,ze]),so=l((function(e,o){ao&&e&&no(!1),R(e,o||{target:ro.current})}),[R,ao]),co=d({delay:U,onChange:so,initialStateValue:_,trim:_e}),mo=co.inputValue,uo=co.onEventChanged,po=co.clearValue,vo=s((function(){return Qe?_:mo}),[Qe,_,mo]),fo=l((function(e){Qe?so(e.target.value,e):uo(e)}),[Qe,so,uo]),Co=s((function(){return ae&&vo?ae:te}),[te,ae,vo]),bo=l((function(){Q||(be&&(ro.current&&ro.current.focus(),ro.current.value="",Qe?so(""):po()),fe(Co))}),[Q,be,fe,Co,Qe,so,po]),xo=s((function(){return"number"==typeof we&&vo&&vo.length>we?f.error:me&&me.status||ao?f[ao?"error":me.status]:""}),[we,me,ao,vo]),yo=te||ae,Eo=Ee||me&&me.text||ao&&Oe,To=ae===Co,No=te===Co,ho=(fe!==N||Fe.primary||Ze)&&vo&&te.length&&No,go=(ae||$e)&&To&&!!vo,Io=Ae?"".concat(re,"-allow-exceeding-max-length-text"):void 0;c((function(){if((null==ro?void 0:ro.current)&&G){var e=requestAnimationFrame((function(){return ro.current.focus()}));return function(){return cancelAnimationFrame(e)}}}),[ro,G]);var jo=fe!==N||be,Fo=Fe.primary||Ze,Lo=Fe.secondary||$e;return a.createElement("div",{className:t(j.textField,pe,o(o({},j.disabled,Q),j.onlyUnderline,Ye)),role:Re,"aria-busy":Me},a.createElement("div",{className:t(j.labelWrapper)},a.createElement(u,{labelText:le,icon:xe,labelFor:re,required:ze}),a.createElement("div",{className:t(j.inputWrapper,C[ce],xo)},a.createElement("input",{className:t(x,j.input,o(o({},j.inputHasIcon,!!yo),j.readOnly,$)),placeholder:H,autoComplete:S,value:vo,onChange:fo,disabled:Q,readOnly:$,ref:io,type:ke,id:re,"data-testid":Pe||T(h.TEXT_FIELD,re),"data-vibe":g.TEXT_FIELD,name:Ge,onBlur:lo,onFocus:O,onKeyDown:M,onWheel:V,maxLength:"number"!=typeof we||Ae?void 0:we,role:he&&"combobox","aria-label":Te||H,"aria-invalid":me&&"error"===me.status||ao,"aria-owns":he,"aria-activedescendant":Ie,"aria-required":ze,"aria-describedby":Io,required:ze,tabIndex:Xe,dir:eo}),Me&&a.createElement("div",{className:t(j.loaderContainer,o({},j.loaderContainerHasIcon,yo))},a.createElement("div",{className:t(j.loader)},a.createElement(k,{className:t(j.loaderSvg)}))),te&&a.createElement(F,{content:No?Ze:void 0,referenceWrapperClassName:j.tooltipContainer},a.createElement(E,{className:t(j.iconContainer,o(o(o({},j.iconContainerHasIcon,yo),j.iconContainerActive,No),j.iconContainerClickable,jo)),onClick:bo,tabIndex:ho?"0":"-1",ariaLabel:Fo},a.createElement(D,{icon:te,className:t(j.icon),iconType:"font",iconSize:"small"===ce?"16px":"18px"}))),ae&&a.createElement(F,{content:To?$e:void 0,addKeyboardHideShowTriggersByDefault:!0,referenceWrapperClassName:j.tooltipContainer},a.createElement(E,{className:t(j.iconContainer,o(o(o({},j.iconContainerHasIcon,yo),j.iconContainerActive,To),j.iconContainerClickable,jo)),onClick:bo,tabIndex:go?"0":"-1","data-testid":Ve||T(h.TEXT_FIELD_SECONDARY_BUTTON,re),ariaLabel:Lo},a.createElement(D,{icon:ae,className:t(j.icon),iconType:"font",iconSize:"small"===ce?"16px":"18px"})))),Eo&&a.createElement(m,{type:"text2",color:"secondary",className:t(j.subTextContainer)},(me&&me.text||ao&&Oe)&&a.createElement("span",{className:t(j.subTextContainerStatus)},ao?Oe:me.text),Ee&&a.createElement("span",{className:t(j.counter),"aria-label":b.CHAR},vo&&vo.length||0,"number"==typeof we&&"/".concat(we),a.createElement(L,{id:Io,text:"Maximum of ".concat(we," characters")})))))})),{sizes:x,feedbacks:p,types:v});export{H as default};
 //# sourceMappingURL=TextField.js.map

package/dist/mocked_classnames/src/components/TextField/TextField.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextField.js","sources":["../../../../../src/components/TextField/TextField.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, {\n  ChangeEvent,\n  type ChangeEventHandler,\n  forwardRef,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState\n} from \"react\";\nimport useDebounceEvent from \"../../hooks/useDebounceEvent\";\nimport { Icon } from \"@vibe/icon\";\nimport { Loader } from \"@vibe/loader\";\nimport Text from \"../Text/Text\";\nimport FieldLabel from \"../FieldLabel/FieldLabel\";\nimport {\n  FEEDBACK_CLASSES,\n  SIZE_MAPPER,\n  TextFieldAriaLabel,\n  TextFieldFeedbackState as TextFieldFeedbackStateEnum,\n  TextFieldTextType as TextFieldTextTypeEnum\n} from \"./TextFieldConstants\";\nimport { type TextFieldType, type TextFieldSize } from \"./TextField.types\";\nimport { BASE_SIZES } from \"../../constants/sizes\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport Clickable from \"../../components/Clickable/Clickable\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport { ComponentDefaultTestId, ComponentVibeId } from \"../../tests/constants\";\nimport { type VibeComponentProps, withStaticProps } from \"../../types\";\nimport styles from \"./TextField.module.scss\";\nimport { Tooltip } from \"../Tooltip\";\nimport { HiddenText } from \"../HiddenText\";\n\nconst EMPTY_OBJECT = { primary: \"\", secondary: \"\" };\n\nexport interface TextFieldProps extends VibeComponentProps {\n  /**\n   * The placeholder text displayed when the input is empty.\n   */\n  placeholder?: string;\n  /**\n   * Configures the browser's autocomplete behavior.\n   */\n  autoComplete?: string;\n  /**\n   * The current value of the text field.\n   */\n  value?: string;\n  /**\n   * Callback fired when the text field value changes.\n   */\n  onChange?: (\n    value: string,\n    event: React.ChangeEvent<HTMLInputElement> | Pick<React.ChangeEvent<HTMLInputElement>, \"target\">\n  ) => void;\n  /**\n   * Callback fired when the text field loses focus.\n   */\n  onBlur?: (event: React.FocusEvent) => void;\n  /**\n   * Callback fired when the text field gains focus.\n   */\n  onFocus?: (event: React.FocusEvent) => void;\n  /**\n   * Callback fired when a key is pressed inside the text field.\n   */\n  onKeyDown?: (event: React.KeyboardEvent) => void;\n  /**\n   * Callback fired when the mouse wheel is used inside the text field.\n   */\n  onWheel?: (event: React.WheelEvent) => void;\n  /**\n   * The debounce rate for input value changes.\n   */\n  debounceRate?: number;\n  /**\n   * If true, the input is automatically focused on mount.\n   */\n  autoFocus?: boolean;\n  /**\n   * If true, disables the text field.\n   */\n  disabled?: boolean;\n  /**\n   * If true, makes the text field read-only.\n   */\n  readonly?: boolean;\n  /**\n   * A function to set a reference to the input element.\n   */\n  setRef?: (node: HTMLElement) => void;\n  /**\n   * The primary icon displayed inside the text field.\n   */\n  iconName?: string | React.FunctionComponent | null;\n  /**\n   * The secondary icon displayed inside the text field.\n   */\n  secondaryIconName?: string | React.FunctionComponent | null;\n  /**\n   * The label displayed above the text field.\n   */\n  title?: string;\n  /**\n   * The size of the text field.\n   */\n  size?: TextFieldSize;\n  /**\n   * Validation state for the text field.\n   */\n  validation?: { status?: \"error\" | \"success\"; text?: string | React.ReactNode };\n  /**\n   * Class name applied to the text field wrapper.\n   */\n  wrapperClassName?: string;\n  /**\n   * Callback fired when the icon inside the text field is clicked.\n   */\n  onIconClick?: (icon: string | React.FunctionComponent | null) => void;\n  /**\n   * If true, clears the input when the icon is clicked.\n   */\n  clearOnIconClick?: boolean;\n  /**\n   * The icon displayed inside the label.\n   */\n  labelIconName?: string | React.FunctionComponent | null;\n  /**\n   * If true, displays the character count.\n   */\n  showCharCount?: boolean;\n  /**\n   * The ARIA label for the input field.\n   */\n  inputAriaLabel?: string;\n  /**\n   * The ID of the container where search results are displayed.\n   */\n  searchResultsContainerId?: string;\n  /**\n   * The ID of the currently active search result.\n   */\n  activeDescendant?: string;\n  /**\n   * Icon labels for accessibility.\n   */\n  iconsNames?: {\n    primary: string;\n    secondary: string;\n  };\n  /**\n   * The type of the text field.\n   */\n  type?: TextFieldType;\n  /**\n   * The maximum number of characters allowed.\n   */\n  maxLength?: number;\n  /**\n   * If true, allows the user to exceed the character limit set by `maxLength`.\n   */\n  allowExceedingMaxLength?: boolean;\n  /**\n   * If true, trims whitespace from the input value.\n   */\n  trim?: boolean;\n  /**\n   * The ARIA role of the text field.\n   */\n  role?: string;\n  /**\n   * If true, marks the input as required.\n   */\n  required?: boolean;\n  /**\n   * The error message displayed when a required field is left empty.\n   */\n  requiredErrorText?: string;\n  /**\n   * If true, displays a loading indicator inside the text field.\n   */\n  loading?: boolean;\n  /**\n   * Test ID for the secondary icon.\n   */\n  secondaryDataTestId?: string;\n  /**\n   * The tab order of the input field.\n   */\n  tabIndex?: number;\n  /**\n   * The name attribute for the input field.\n   */\n  name?: string;\n  /**\n   * If true, renders only an underline style for the text field.\n   */\n  underline?: boolean;\n  /**\n   * If true, the component is controlled by an external state.\n   */\n  controlled?: boolean;\n  /**\n   * Tooltip content for the primary icon.\n   */\n  iconTooltipContent?: string;\n  /**\n   * Tooltip content for the secondary icon.\n   */\n  secondaryTooltipContent?: string;\n  /**\n   * The text direction of the input.\n   */\n  dir?: \"ltr\" | \"rtl\" | \"auto\";\n}\n\nconst TextField = forwardRef(\n  (\n    {\n      className = \"\",\n      placeholder = \"\",\n      autoComplete = \"off\",\n      value,\n      onChange = NOOP,\n      onBlur = NOOP,\n      onFocus = NOOP,\n      onKeyDown = NOOP,\n      onWheel = NOOP,\n      debounceRate = 0,\n      autoFocus = false,\n      disabled = false,\n      readonly = false,\n      setRef = NOOP,\n      iconName,\n      secondaryIconName,\n      id = \"input\",\n      title = \"\",\n      size = \"small\",\n      validation = null,\n      wrapperClassName = \"\",\n      onIconClick = NOOP,\n      clearOnIconClick = false,\n      labelIconName,\n      showCharCount = false,\n      inputAriaLabel,\n      searchResultsContainerId = \"\",\n      activeDescendant = \"\",\n      iconsNames = EMPTY_OBJECT,\n      type = \"text\",\n      maxLength = null,\n      allowExceedingMaxLength = false,\n      trim = false,\n      role = \"\",\n      required = false,\n      requiredErrorText = \"\",\n      loading = false,\n      \"data-testid\": dataTestId,\n      secondaryDataTestId,\n      tabIndex,\n      underline = false,\n      name,\n      controlled = false,\n      iconTooltipContent,\n      secondaryTooltipContent,\n      dir\n    }: TextFieldProps,\n    ref: React.ForwardedRef<unknown>\n  ) => {\n    const [isRequiredAndEmpty, setIsRequiredAndEmpty] = useState(false);\n\n    const inputRef = useRef(null);\n    const mergedRef = useMergeRef(ref, inputRef, setRef);\n\n    const onBlurCallback = useCallback(\n      (e: React.FocusEvent<HTMLInputElement>) => {\n        if (required && !e.target.value) {\n          setIsRequiredAndEmpty(true);\n        }\n        onBlur(e);\n      },\n      [onBlur, required]\n    );\n\n    const onChangeCallback = useCallback(\n      (value: string, e?: React.ChangeEvent<HTMLInputElement>) => {\n        if (isRequiredAndEmpty && value) {\n          setIsRequiredAndEmpty(false);\n        }\n        const event = e || { target: inputRef.current };\n        onChange(value, event);\n      },\n      [onChange, isRequiredAndEmpty]\n    );\n\n    const {\n      inputValue: uncontrolledInput,\n      onEventChanged,\n      clearValue\n    } = useDebounceEvent({\n      delay: debounceRate,\n      onChange: onChangeCallback,\n      initialStateValue: value,\n      trim\n    });\n\n    const inputValue = useMemo(() => {\n      return controlled ? value : uncontrolledInput;\n    }, [controlled, value, uncontrolledInput]);\n\n    const handleChange = useCallback<ChangeEventHandler<HTMLInputElement>>(\n      event => {\n        controlled ? onChangeCallback(event.target.value, event) : onEventChanged(event);\n      },\n      [controlled, onChangeCallback, onEventChanged]\n    );\n\n    const currentStateIconName = useMemo(() => {\n      if (secondaryIconName) {\n        return inputValue ? secondaryIconName : iconName;\n      }\n      return iconName;\n    }, [iconName, secondaryIconName, inputValue]);\n\n    const onIconClickCallback = useCallback(() => {\n      if (disabled) {\n        return;\n      }\n\n      if (clearOnIconClick) {\n        if (inputRef.current) {\n          inputRef.current.focus();\n        }\n        // Do it cause otherwise the value is not cleared in target object\n        inputRef.current.value = \"\";\n        controlled ? onChangeCallback(\"\") : clearValue();\n      }\n      onIconClick(currentStateIconName);\n    }, [disabled, clearOnIconClick, onIconClick, currentStateIconName, controlled, onChangeCallback, clearValue]);\n\n    const validationClass = useMemo(() => {\n      if (typeof maxLength === \"number\" && inputValue && inputValue.length > maxLength) {\n        return FEEDBACK_CLASSES.error;\n      }\n\n      if ((!validation || !validation.status) && !isRequiredAndEmpty) {\n        return \"\";\n      }\n      const status = isRequiredAndEmpty ? \"error\" : validation.status;\n      return FEEDBACK_CLASSES[status];\n    }, [maxLength, validation, isRequiredAndEmpty, inputValue]);\n\n    const hasIcon = iconName || secondaryIconName;\n    const shouldShowExtraText =\n      showCharCount || (validation && validation.text) || (isRequiredAndEmpty && requiredErrorText);\n    const isSecondary = secondaryIconName === currentStateIconName;\n    const isPrimary = iconName === currentStateIconName;\n    const shouldFocusOnPrimaryIcon =\n      (onIconClick !== NOOP || iconsNames.primary || iconTooltipContent) && inputValue && iconName.length && isPrimary;\n    const shouldFocusOnSecondaryIcon = (secondaryIconName || secondaryTooltipContent) && isSecondary && !!inputValue;\n    const allowExceedingMaxLengthTextId = allowExceedingMaxLength ? `${id}-allow-exceeding-max-length-text` : undefined;\n\n    useEffect(() => {\n      if (!inputRef?.current || !autoFocus) {\n        return;\n      }\n\n      const animationFrame = requestAnimationFrame(() => inputRef.current.focus());\n      return () => cancelAnimationFrame(animationFrame);\n    }, [inputRef, autoFocus]);\n\n    const isIconContainerClickable = onIconClick !== NOOP || clearOnIconClick;\n\n    const primaryIconLabel = iconsNames.primary || iconTooltipContent;\n    const secondaryIconLabel = iconsNames.secondary || secondaryTooltipContent;\n\n    return (\n      <div\n        className={cx(styles.textField, wrapperClassName, {\n          [styles.disabled]: disabled,\n          [styles.onlyUnderline]: underline\n        })}\n        role={role}\n        aria-busy={loading}\n      >\n        <div className={cx(styles.labelWrapper)}>\n          <FieldLabel labelText={title} icon={labelIconName} labelFor={id} required={required} />\n          <div className={cx(styles.inputWrapper, SIZE_MAPPER[size], validationClass)}>\n            {/*Programatical input (tabIndex={-1}) is working fine with aria-activedescendant attribute despite the rule*/}\n            {/*eslint-disable-next-line jsx-a11y/aria-activedescendant-has-tabindex*/}\n            <input\n              className={cx(className, styles.input, {\n                [styles.inputHasIcon]: !!hasIcon,\n                [styles.readOnly]: readonly\n              })}\n              placeholder={placeholder}\n              autoComplete={autoComplete}\n              value={inputValue}\n              onChange={handleChange}\n              disabled={disabled}\n              readOnly={readonly}\n              ref={mergedRef}\n              type={type}\n              id={id}\n              data-testid={dataTestId || getTestId(ComponentDefaultTestId.TEXT_FIELD, id)}\n              data-vibe={ComponentVibeId.TEXT_FIELD}\n              name={name}\n              onBlur={onBlurCallback}\n              onFocus={onFocus}\n              onKeyDown={onKeyDown}\n              onWheel={onWheel}\n              maxLength={typeof maxLength === \"number\" && !allowExceedingMaxLength ? maxLength : undefined}\n              role={searchResultsContainerId && \"combobox\"} // For voice reader\n              aria-label={inputAriaLabel || placeholder}\n              aria-invalid={(validation && validation.status === \"error\") || isRequiredAndEmpty}\n              aria-owns={searchResultsContainerId}\n              aria-activedescendant={activeDescendant}\n              aria-required={required}\n              aria-describedby={allowExceedingMaxLengthTextId}\n              required={required}\n              tabIndex={tabIndex}\n              dir={dir}\n            />\n            {loading && (\n              <div\n                className={cx(styles.loaderContainer, {\n                  [styles.loaderContainerHasIcon]: hasIcon\n                })}\n              >\n                <div className={cx(styles.loader)}>\n                  <Loader className={cx(styles.loaderSvg)} />\n                </div>\n              </div>\n            )}\n            {iconName && (\n              <Tooltip\n                content={isPrimary ? iconTooltipContent : undefined}\n                referenceWrapperClassName={styles.tooltipContainer}\n              >\n                <Clickable\n                  className={cx(styles.iconContainer, {\n                    [styles.iconContainerHasIcon]: hasIcon,\n                    [styles.iconContainerActive]: isPrimary,\n                    [styles.iconContainerClickable]: isIconContainerClickable\n                  })}\n                  onClick={onIconClickCallback}\n                  tabIndex={shouldFocusOnPrimaryIcon ? \"0\" : \"-1\"}\n                  ariaLabel={primaryIconLabel}\n                >\n                  <Icon\n                    icon={iconName}\n                    className={cx(styles.icon)}\n                    iconType=\"font\"\n                    iconSize={size === \"small\" ? \"16px\" : \"18px\"}\n                  />\n                </Clickable>\n              </Tooltip>\n            )}\n            {secondaryIconName && (\n              <Tooltip\n                content={isSecondary ? secondaryTooltipContent : undefined}\n                addKeyboardHideShowTriggersByDefault\n                referenceWrapperClassName={styles.tooltipContainer}\n              >\n                <Clickable\n                  className={cx(styles.iconContainer, {\n                    [styles.iconContainerHasIcon]: hasIcon,\n                    [styles.iconContainerActive]: isSecondary,\n                    [styles.iconContainerClickable]: isIconContainerClickable\n                  })}\n                  onClick={onIconClickCallback}\n                  tabIndex={shouldFocusOnSecondaryIcon ? \"0\" : \"-1\"}\n                  data-testid={secondaryDataTestId || getTestId(ComponentDefaultTestId.TEXT_FIELD_SECONDARY_BUTTON, id)}\n                  ariaLabel={secondaryIconLabel}\n                >\n                  <Icon\n                    icon={secondaryIconName}\n                    className={cx(styles.icon)}\n                    iconType=\"font\"\n                    iconSize={size === \"small\" ? \"16px\" : \"18px\"}\n                  />\n                </Clickable>\n              </Tooltip>\n            )}\n          </div>\n          {shouldShowExtraText && (\n            <Text type=\"text2\" color=\"secondary\" className={cx(styles.subTextContainer)}>\n              {((validation && validation.text) || (isRequiredAndEmpty && requiredErrorText)) && (\n                <span className={cx(styles.subTextContainerStatus)}>\n                  {isRequiredAndEmpty ? requiredErrorText : validation.text}\n                </span>\n              )}\n              {showCharCount && (\n                <span className={cx(styles.counter)} aria-label={TextFieldAriaLabel.CHAR}>\n                  {(inputValue && inputValue.length) || 0}\n                  {typeof maxLength === \"number\" && `/${maxLength}`}\n                  <HiddenText id={allowExceedingMaxLengthTextId} text={`Maximum of ${maxLength} characters`} />\n                </span>\n              )}\n            </Text>\n          )}\n        </div>\n      </div>\n    );\n  }\n);\n\ninterface TextFieldStaticProps {\n  sizes: typeof BASE_SIZES;\n  types: typeof TextFieldTextTypeEnum;\n  feedbacks: typeof TextFieldFeedbackStateEnum;\n}\n\nexport default withStaticProps<TextFieldProps, TextFieldStaticProps, unknown>(TextField, {\n  sizes: BASE_SIZES,\n  feedbacks: TextFieldFeedbackStateEnum,\n  types: TextFieldTextTypeEnum\n});\n"],"names":["EMPTY_OBJECT","primary","secondary","withStaticProps","forwardRef","_ref","ref","_ref$className","className","_ref$placeholder","placeholder","_ref$autoComplete","autoComplete","value","_ref$onChange","onChange","NOOP","_ref$onBlur","onBlur","_ref$onFocus","onFocus","_ref$onKeyDown","onKeyDown","_ref$onWheel","onWheel","_ref$debounceRate","debounceRate","_ref$autoFocus","autoFocus","_ref$disabled","disabled","_ref$readonly","readonly","_ref$setRef","setRef","iconName","secondaryIconName","_ref$id","id","_ref$title","title","_ref$size","size","_ref$validation","validation","_ref$wrapperClassName","wrapperClassName","_ref$onIconClick","onIconClick","_ref$clearOnIconClick","clearOnIconClick","labelIconName","_ref$showCharCount","showCharCount","inputAriaLabel","_ref$searchResultsCon","searchResultsContainerId","_ref$activeDescendant","activeDescendant","_ref$iconsNames","iconsNames","_ref$type","type","_ref$maxLength","maxLength","_ref$allowExceedingMa","allowExceedingMaxLength","_ref$trim","trim","_ref$role","role","_ref$required","required","_ref$requiredErrorTex","requiredErrorText","_ref$loading","loading","dataTestId","secondaryDataTestId","tabIndex","_ref$underline","underline","name","_ref$controlled","controlled","iconTooltipContent","secondaryTooltipContent","dir","_useState","useState","_useState2","_slicedToArray","isRequiredAndEmpty","setIsRequiredAndEmpty","inputRef","useRef","mergedRef","useMergeRef","onBlurCallback","useCallback","e","target","onChangeCallback","current","_useDebounceEvent","useDebounceEvent","delay","initialStateValue","uncontrolledInput","inputValue","onEventChanged","clearValue","useMemo","handleChange","event","currentStateIconName","onIconClickCallback","focus","validationClass","length","FEEDBACK_CLASSES","error","status","hasIcon","shouldShowExtraText","text","isSecondary","isPrimary","shouldFocusOnPrimaryIcon","shouldFocusOnSecondaryIcon","allowExceedingMaxLengthTextId","concat","undefined","useEffect","animationFrame","requestAnimationFrame","cancelAnimationFrame","isIconContainerClickable","primaryIconLabel","secondaryIconLabel","React","createElement","cx","styles","textField","_defineProperty","onlyUnderline","labelWrapper","FieldLabel","labelText","icon","labelFor","inputWrapper","SIZE_MAPPER","input","inputHasIcon","readOnly","getTestId","ComponentDefaultTestId","TEXT_FIELD","ComponentVibeId","loaderContainer","loaderContainerHasIcon","loader","Loader","loaderSvg","Tooltip","content","referenceWrapperClassName","tooltipContainer","Clickable","iconContainer","iconContainerHasIcon","iconContainerActive","iconContainerClickable","onClick","ariaLabel","Icon","iconType","iconSize","addKeyboardHideShowTriggersByDefault","TEXT_FIELD_SECONDARY_BUTTON","Text","color","subTextContainer","subTextContainerStatus","counter","TextFieldAriaLabel","CHAR","HiddenText","sizes","BASE_SIZES","feedbacks","TextFieldFeedbackStateEnum","types","TextFieldTextTypeEnum"],"mappings":"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"}
+{"version":3,"file":"TextField.js","sources":["../../../../../src/components/TextField/TextField.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, {\n  ChangeEvent,\n  type ChangeEventHandler,\n  forwardRef,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState\n} from \"react\";\nimport useDebounceEvent from \"../../hooks/useDebounceEvent\";\nimport { Icon } from \"@vibe/icon\";\nimport { Loader } from \"@vibe/loader\";\nimport Text from \"../Text/Text\";\nimport FieldLabel from \"../FieldLabel/FieldLabel\";\nimport {\n  FEEDBACK_CLASSES,\n  SIZE_MAPPER,\n  TextFieldAriaLabel,\n  TextFieldFeedbackState as TextFieldFeedbackStateEnum,\n  TextFieldTextType as TextFieldTextTypeEnum\n} from \"./TextFieldConstants\";\nimport { type TextFieldType, type TextFieldSize } from \"./TextField.types\";\nimport { BASE_SIZES } from \"../../constants/sizes\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport Clickable from \"../../components/Clickable/Clickable\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport { ComponentDefaultTestId, ComponentVibeId } from \"../../tests/constants\";\nimport { type VibeComponentProps, withStaticProps } from \"../../types\";\nimport styles from \"./TextField.module.scss\";\nimport { Tooltip } from \"../Tooltip\";\nimport { HiddenText } from \"../HiddenText\";\n\nconst EMPTY_OBJECT = { primary: \"\", secondary: \"\" };\n\nexport interface TextFieldProps extends VibeComponentProps {\n  /**\n   * The placeholder text displayed when the input is empty.\n   */\n  placeholder?: string;\n  /**\n   * Configures the browser's autocomplete behavior.\n   */\n  autoComplete?: string;\n  /**\n   * The current value of the text field.\n   */\n  value?: string;\n  /**\n   * Callback fired when the text field value changes.\n   */\n  onChange?: (\n    value: string,\n    event: React.ChangeEvent<HTMLInputElement> | Pick<React.ChangeEvent<HTMLInputElement>, \"target\">\n  ) => void;\n  /**\n   * Callback fired when the text field loses focus.\n   */\n  onBlur?: (event: React.FocusEvent) => void;\n  /**\n   * Callback fired when the text field gains focus.\n   */\n  onFocus?: (event: React.FocusEvent) => void;\n  /**\n   * Callback fired when a key is pressed inside the text field.\n   */\n  onKeyDown?: (event: React.KeyboardEvent) => void;\n  /**\n   * Callback fired when the mouse wheel is used inside the text field.\n   */\n  onWheel?: (event: React.WheelEvent) => void;\n  /**\n   * The debounce rate for input value changes.\n   */\n  debounceRate?: number;\n  /**\n   * If true, the input is automatically focused on mount.\n   */\n  autoFocus?: boolean;\n  /**\n   * If true, disables the text field.\n   */\n  disabled?: boolean;\n  /**\n   * If true, makes the text field read-only.\n   */\n  readonly?: boolean;\n  /**\n   * A function to set a reference to the input element.\n   */\n  setRef?: (node: HTMLElement) => void;\n  /**\n   * The primary icon displayed inside the text field.\n   */\n  iconName?: string | React.FunctionComponent | null;\n  /**\n   * The secondary icon displayed inside the text field.\n   */\n  secondaryIconName?: string | React.FunctionComponent | null;\n  /**\n   * The label displayed above the text field.\n   */\n  title?: string;\n  /**\n   * The size of the text field.\n   */\n  size?: TextFieldSize;\n  /**\n   * Validation state for the text field.\n   */\n  validation?: { status?: \"error\" | \"success\"; text?: string | React.ReactNode };\n  /**\n   * Class name applied to the text field wrapper.\n   */\n  wrapperClassName?: string;\n  /**\n   * Callback fired when the icon inside the text field is clicked.\n   */\n  onIconClick?: (icon: string | React.FunctionComponent | null) => void;\n  /**\n   * If true, clears the input when the icon is clicked.\n   */\n  clearOnIconClick?: boolean;\n  /**\n   * The icon displayed inside the label.\n   */\n  labelIconName?: string | React.FunctionComponent | null;\n  /**\n   * If true, displays the character count.\n   */\n  showCharCount?: boolean;\n  /**\n   * The ARIA label for the input field.\n   */\n  inputAriaLabel?: string;\n  /**\n   * The ID of the container where search results are displayed.\n   */\n  searchResultsContainerId?: string;\n  /**\n   * The ID of the currently active search result.\n   */\n  activeDescendant?: string;\n  /**\n   * Icon labels for accessibility.\n   */\n  iconsNames?: {\n    primary: string;\n    secondary: string;\n  };\n  /**\n   * The type of the text field.\n   */\n  type?: TextFieldType;\n  /**\n   * The maximum number of characters allowed.\n   */\n  maxLength?: number;\n  /**\n   * If true, allows the user to exceed the character limit set by `maxLength`.\n   */\n  allowExceedingMaxLength?: boolean;\n  /**\n   * If true, trims whitespace from the input value.\n   */\n  trim?: boolean;\n  /**\n   * The ARIA role of the text field.\n   */\n  role?: string;\n  /**\n   * If true, marks the input as required.\n   */\n  required?: boolean;\n  /**\n   * The error message displayed when a required field is left empty.\n   */\n  requiredErrorText?: string;\n  /**\n   * If true, displays a loading indicator inside the text field.\n   */\n  loading?: boolean;\n  /**\n   * Test ID for the secondary icon.\n   */\n  secondaryDataTestId?: string;\n  /**\n   * The tab order of the input field.\n   */\n  tabIndex?: number;\n  /**\n   * The name attribute for the input field.\n   */\n  name?: string;\n  /**\n   * If true, renders only an underline style for the text field.\n   */\n  underline?: boolean;\n  /**\n   * If true, the component is controlled by an external state.\n   */\n  controlled?: boolean;\n  /**\n   * Tooltip content for the primary icon.\n   */\n  iconTooltipContent?: string;\n  /**\n   * Tooltip content for the secondary icon.\n   */\n  secondaryTooltipContent?: string;\n  /**\n   * The text direction of the input.\n   */\n  dir?: \"ltr\" | \"rtl\" | \"auto\";\n}\n\nconst TextField = forwardRef(\n  (\n    {\n      className = \"\",\n      placeholder = \"\",\n      autoComplete = \"off\",\n      value,\n      onChange = NOOP,\n      onBlur = NOOP,\n      onFocus = NOOP,\n      onKeyDown = NOOP,\n      onWheel = NOOP,\n      debounceRate = 0,\n      autoFocus = false,\n      disabled = false,\n      readonly = false,\n      setRef = NOOP,\n      iconName,\n      secondaryIconName,\n      id = \"input\",\n      title = \"\",\n      size = \"small\",\n      validation = null,\n      wrapperClassName = \"\",\n      onIconClick = NOOP,\n      clearOnIconClick = false,\n      labelIconName,\n      showCharCount = false,\n      inputAriaLabel,\n      searchResultsContainerId = \"\",\n      activeDescendant = \"\",\n      iconsNames = EMPTY_OBJECT,\n      type = \"text\",\n      maxLength = null,\n      allowExceedingMaxLength = false,\n      trim = false,\n      role = \"\",\n      required = false,\n      requiredErrorText = \"\",\n      loading = false,\n      \"data-testid\": dataTestId,\n      secondaryDataTestId,\n      tabIndex,\n      underline = false,\n      name,\n      controlled = false,\n      iconTooltipContent,\n      secondaryTooltipContent,\n      dir\n    }: TextFieldProps,\n    ref: React.ForwardedRef<unknown>\n  ) => {\n    const [isRequiredAndEmpty, setIsRequiredAndEmpty] = useState(false);\n\n    const inputRef = useRef(null);\n    const mergedRef = useMergeRef(ref, inputRef, setRef);\n\n    const onBlurCallback = useCallback(\n      (e: React.FocusEvent<HTMLInputElement>) => {\n        if (required && !e.target.value) {\n          setIsRequiredAndEmpty(true);\n        }\n        onBlur(e);\n      },\n      [onBlur, required]\n    );\n\n    const onChangeCallback = useCallback(\n      (value: string, e?: React.ChangeEvent<HTMLInputElement>) => {\n        if (isRequiredAndEmpty && value) {\n          setIsRequiredAndEmpty(false);\n        }\n        const event = e || { target: inputRef.current };\n        onChange(value, event);\n      },\n      [onChange, isRequiredAndEmpty]\n    );\n\n    const {\n      inputValue: uncontrolledInput,\n      onEventChanged,\n      clearValue\n    } = useDebounceEvent({\n      delay: debounceRate,\n      onChange: onChangeCallback,\n      initialStateValue: value,\n      trim\n    });\n\n    const inputValue = useMemo(() => {\n      return controlled ? value : uncontrolledInput;\n    }, [controlled, value, uncontrolledInput]);\n\n    const handleChange = useCallback<ChangeEventHandler<HTMLInputElement>>(\n      event => {\n        controlled ? onChangeCallback(event.target.value, event) : onEventChanged(event);\n      },\n      [controlled, onChangeCallback, onEventChanged]\n    );\n\n    const currentStateIconName = useMemo(() => {\n      if (secondaryIconName) {\n        return inputValue ? secondaryIconName : iconName;\n      }\n      return iconName;\n    }, [iconName, secondaryIconName, inputValue]);\n\n    const onIconClickCallback = useCallback(() => {\n      if (disabled) {\n        return;\n      }\n\n      if (clearOnIconClick) {\n        if (inputRef.current) {\n          inputRef.current.focus();\n        }\n        // Do it cause otherwise the value is not cleared in target object\n        inputRef.current.value = \"\";\n        controlled ? onChangeCallback(\"\") : clearValue();\n      }\n      onIconClick(currentStateIconName);\n    }, [disabled, clearOnIconClick, onIconClick, currentStateIconName, controlled, onChangeCallback, clearValue]);\n\n    const validationClass = useMemo(() => {\n      if (typeof maxLength === \"number\" && inputValue && inputValue.length > maxLength) {\n        return FEEDBACK_CLASSES.error;\n      }\n\n      if ((!validation || !validation.status) && !isRequiredAndEmpty) {\n        return \"\";\n      }\n      const status = isRequiredAndEmpty ? \"error\" : validation.status;\n      return FEEDBACK_CLASSES[status];\n    }, [maxLength, validation, isRequiredAndEmpty, inputValue]);\n\n    const hasIcon = iconName || secondaryIconName;\n    const shouldShowExtraText =\n      showCharCount || (validation && validation.text) || (isRequiredAndEmpty && requiredErrorText);\n    const isSecondary = secondaryIconName === currentStateIconName;\n    const isPrimary = iconName === currentStateIconName;\n    const shouldFocusOnPrimaryIcon =\n      (onIconClick !== NOOP || iconsNames.primary || iconTooltipContent) && inputValue && iconName.length && isPrimary;\n    const shouldFocusOnSecondaryIcon = (secondaryIconName || secondaryTooltipContent) && isSecondary && !!inputValue;\n    const allowExceedingMaxLengthTextId = allowExceedingMaxLength ? `${id}-allow-exceeding-max-length-text` : undefined;\n\n    useEffect(() => {\n      if (!inputRef?.current || !autoFocus) {\n        return;\n      }\n\n      const animationFrame = requestAnimationFrame(() => inputRef.current.focus());\n      return () => cancelAnimationFrame(animationFrame);\n    }, [inputRef, autoFocus]);\n\n    const isIconContainerClickable = onIconClick !== NOOP || clearOnIconClick;\n\n    const primaryIconLabel = iconsNames.primary || iconTooltipContent;\n    const secondaryIconLabel = iconsNames.secondary || secondaryTooltipContent;\n\n    return (\n      <div\n        className={cx(styles.textField, wrapperClassName, {\n          [styles.disabled]: disabled,\n          [styles.onlyUnderline]: underline\n        })}\n        role={role}\n        aria-busy={loading}\n      >\n        <div className={cx(styles.labelWrapper)}>\n          <FieldLabel labelText={title} icon={labelIconName} labelFor={id} required={required} />\n          <div className={cx(styles.inputWrapper, SIZE_MAPPER[size], validationClass)}>\n            {/*Programatical input (tabIndex={-1}) is working fine with aria-activedescendant attribute despite the rule*/}\n            {/*eslint-disable-next-line jsx-a11y/aria-activedescendant-has-tabindex*/}\n            <input\n              className={cx(className, styles.input, {\n                [styles.inputHasIcon]: !!hasIcon,\n                [styles.readOnly]: readonly\n              })}\n              placeholder={placeholder}\n              autoComplete={autoComplete}\n              value={inputValue}\n              onChange={handleChange}\n              disabled={disabled}\n              readOnly={readonly}\n              ref={mergedRef}\n              type={type}\n              id={id}\n              data-testid={dataTestId || getTestId(ComponentDefaultTestId.TEXT_FIELD, id)}\n              data-vibe={ComponentVibeId.TEXT_FIELD}\n              name={name}\n              onBlur={onBlurCallback}\n              onFocus={onFocus}\n              onKeyDown={onKeyDown}\n              onWheel={onWheel}\n              maxLength={typeof maxLength === \"number\" && !allowExceedingMaxLength ? maxLength : undefined}\n              role={searchResultsContainerId && \"combobox\"} // For voice reader\n              aria-label={inputAriaLabel || placeholder}\n              aria-invalid={(validation && validation.status === \"error\") || isRequiredAndEmpty}\n              aria-owns={searchResultsContainerId}\n              aria-activedescendant={activeDescendant}\n              aria-required={required}\n              aria-describedby={allowExceedingMaxLengthTextId}\n              required={required}\n              tabIndex={tabIndex}\n              dir={dir}\n            />\n            {loading && (\n              <div\n                className={cx(styles.loaderContainer, {\n                  [styles.loaderContainerHasIcon]: hasIcon\n                })}\n              >\n                <div className={cx(styles.loader)}>\n                  <Loader className={cx(styles.loaderSvg)} />\n                </div>\n              </div>\n            )}\n            {iconName && (\n              <Tooltip\n                content={isPrimary ? iconTooltipContent : undefined}\n                referenceWrapperClassName={styles.tooltipContainer}\n              >\n                <Clickable\n                  className={cx(styles.iconContainer, {\n                    [styles.iconContainerHasIcon]: hasIcon,\n                    [styles.iconContainerActive]: isPrimary,\n                    [styles.iconContainerClickable]: isIconContainerClickable\n                  })}\n                  onClick={onIconClickCallback}\n                  tabIndex={shouldFocusOnPrimaryIcon ? \"0\" : \"-1\"}\n                  ariaLabel={primaryIconLabel}\n                >\n                  <Icon\n                    icon={iconName}\n                    className={cx(styles.icon)}\n                    iconType=\"font\"\n                    iconSize={size === \"small\" ? \"16px\" : \"18px\"}\n                  />\n                </Clickable>\n              </Tooltip>\n            )}\n            {secondaryIconName && (\n              <Tooltip\n                content={isSecondary ? secondaryTooltipContent : undefined}\n                addKeyboardHideShowTriggersByDefault\n                referenceWrapperClassName={styles.tooltipContainer}\n              >\n                <Clickable\n                  className={cx(styles.iconContainer, {\n                    [styles.iconContainerHasIcon]: hasIcon,\n                    [styles.iconContainerActive]: isSecondary,\n                    [styles.iconContainerClickable]: isIconContainerClickable\n                  })}\n                  onClick={onIconClickCallback}\n                  tabIndex={shouldFocusOnSecondaryIcon ? \"0\" : \"-1\"}\n                  data-testid={secondaryDataTestId || getTestId(ComponentDefaultTestId.TEXT_FIELD_SECONDARY_BUTTON, id)}\n                  ariaLabel={secondaryIconLabel}\n                >\n                  <Icon\n                    icon={secondaryIconName}\n                    className={cx(styles.icon)}\n                    iconType=\"font\"\n                    iconSize={size === \"small\" ? \"16px\" : \"18px\"}\n                  />\n                </Clickable>\n              </Tooltip>\n            )}\n          </div>\n          {shouldShowExtraText && (\n            <Text type=\"text2\" color=\"secondary\" className={cx(styles.subTextContainer)}>\n              {((validation && validation.text) || (isRequiredAndEmpty && requiredErrorText)) && (\n                <span className={cx(styles.subTextContainerStatus)}>\n                  {isRequiredAndEmpty ? requiredErrorText : validation.text}\n                </span>\n              )}\n              {showCharCount && (\n                <span className={cx(styles.counter)} aria-label={TextFieldAriaLabel.CHAR}>\n                  {(inputValue && inputValue.length) || 0}\n                  {typeof maxLength === \"number\" && `/${maxLength}`}\n                  <HiddenText id={allowExceedingMaxLengthTextId} text={`Maximum of ${maxLength} characters`} />\n                </span>\n              )}\n            </Text>\n          )}\n        </div>\n      </div>\n    );\n  }\n);\n\ninterface TextFieldStaticProps {\n  sizes: typeof BASE_SIZES;\n  types: typeof TextFieldTextTypeEnum;\n  feedbacks: typeof TextFieldFeedbackStateEnum;\n}\n\nexport default withStaticProps<TextFieldProps, TextFieldStaticProps, unknown>(TextField, {\n  sizes: BASE_SIZES,\n  feedbacks: TextFieldFeedbackStateEnum,\n  types: TextFieldTextTypeEnum\n});\n"],"names":["EMPTY_OBJECT","primary","secondary","withStaticProps","forwardRef","_ref","ref","_ref$className","className","_ref$placeholder","placeholder","_ref$autoComplete","autoComplete","value","_ref$onChange","onChange","NOOP","_ref$onBlur","onBlur","_ref$onFocus","onFocus","_ref$onKeyDown","onKeyDown","_ref$onWheel","onWheel","_ref$debounceRate","debounceRate","_ref$autoFocus","autoFocus","_ref$disabled","disabled","_ref$readonly","readonly","_ref$setRef","setRef","iconName","secondaryIconName","_ref$id","id","_ref$title","title","_ref$size","size","_ref$validation","validation","_ref$wrapperClassName","wrapperClassName","_ref$onIconClick","onIconClick","_ref$clearOnIconClick","clearOnIconClick","labelIconName","_ref$showCharCount","showCharCount","inputAriaLabel","_ref$searchResultsCon","searchResultsContainerId","_ref$activeDescendant","activeDescendant","_ref$iconsNames","iconsNames","_ref$type","type","_ref$maxLength","maxLength","_ref$allowExceedingMa","allowExceedingMaxLength","_ref$trim","trim","_ref$role","role","_ref$required","required","_ref$requiredErrorTex","requiredErrorText","_ref$loading","loading","dataTestId","secondaryDataTestId","tabIndex","_ref$underline","underline","name","_ref$controlled","controlled","iconTooltipContent","secondaryTooltipContent","dir","_useState","useState","_useState2","_slicedToArray","isRequiredAndEmpty","setIsRequiredAndEmpty","inputRef","useRef","mergedRef","useMergeRef","onBlurCallback","useCallback","e","target","onChangeCallback","current","_useDebounceEvent","useDebounceEvent","delay","initialStateValue","uncontrolledInput","inputValue","onEventChanged","clearValue","useMemo","handleChange","event","currentStateIconName","onIconClickCallback","focus","validationClass","length","FEEDBACK_CLASSES","error","status","hasIcon","shouldShowExtraText","text","isSecondary","isPrimary","shouldFocusOnPrimaryIcon","shouldFocusOnSecondaryIcon","allowExceedingMaxLengthTextId","concat","undefined","useEffect","animationFrame","requestAnimationFrame","cancelAnimationFrame","isIconContainerClickable","primaryIconLabel","secondaryIconLabel","React","createElement","cx","styles","textField","_defineProperty","onlyUnderline","labelWrapper","FieldLabel","labelText","icon","labelFor","inputWrapper","SIZE_MAPPER","input","inputHasIcon","readOnly","getTestId","ComponentDefaultTestId","TEXT_FIELD","ComponentVibeId","loaderContainer","loaderContainerHasIcon","loader","Loader","loaderSvg","Tooltip","content","referenceWrapperClassName","tooltipContainer","Clickable","iconContainer","iconContainerHasIcon","iconContainerActive","iconContainerClickable","onClick","ariaLabel","Icon","iconType","iconSize","addKeyboardHideShowTriggersByDefault","TEXT_FIELD_SECONDARY_BUTTON","Text","color","subTextContainer","subTextContainerStatus","counter","TextFieldAriaLabel","CHAR","HiddenText","sizes","BASE_SIZES","feedbacks","TextFieldFeedbackStateEnum","types","TextFieldTextTypeEnum"],"mappings":"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"}

package/dist/mocked_classnames/src/components/Tipseen/Tipseen.js

@@ -1,2 +1,2 @@
-import{slicedToArray as e,defineProperty as t}from"../../../_virtual/_rollupPluginBabelHelpers.js";import o,{forwardRef as i,useRef as r,useState as s,useEffect as n,useMemo as a,Fragment as l}from"react";import m from"classnames";import{DialogAnimationTypeEnum as d,DialogTriggerEventEnum as p}from"@vibe/dialog/mockedClassNames";import c from"../../hooks/useMergeRef.js";import u from"../Tooltip/Tooltip.js";import v from"../IconButton/IconButton.js";import{CloseSmall as f}from"@vibe/icons/mockedClassNames";import h from"./TipseenTitle.js";import{TipseenCloseButtonTheme as T,TipseenColor as y,TIPSEEN_CLOSE_BUTTON_ARIA_LABEL as g}from"./TipseenConstants.js";import{withStaticProps as C}from"../../types/withStaticProps.js";import"../../utils/colors-vars-map.js";import{ComponentDefaultTestId as j}from"../../tests/constants.js";import{getTestId as N}from"../../tests/testIds.js";import w from"../Text/Text.js";import E from"./Tipseen.module.scss.js";import{TooltipPositions as k}from"../Tooltip/TooltipConstants.js";var x=o.createContext("primary"),W=C(i((function(i,d){var p=i.className,T=i.id,y=i.position,C=void 0===y?"bottom":y,k=i.animationType,W=void 0===k?"expand":k,b=i.hideDelay,B=void 0===b?0:b,A=i.showDelay,S=void 0===A?100:A,D=i.title,P=i.titleClassName,I=i.hideCloseButton,H=i.closeButtonTheme,R=void 0===H?"light":H,O=i.onClose,L=i.closeAriaLabel,M=i.children,_=void 0===M?null:M,z=i.content,q=i.containerSelector,F=i.hideTrigger,G=void 0===F?[]:F,J=i.showTrigger,K=void 0===J?[]:J,Q=i.width,U=i.moveBy,V=i.hideWhenReferenceHidden,X=void 0!==V&&V,Y=i.referenceWrapperClassName,Z=i.tip,$=void 0===Z||Z,ee=i.tooltipArrowClassName,te=i.modifiers,oe=void 0===te?[]:te,ie=i.floating,re=void 0!==ie&&ie,se=i.color,ne=i["data-testid"],ae=null!=se?se:"inverted",le=Array.isArray(K)&&Array.isArray(G)&&0===K.length&&S>0,me=r(null),de=c(d,me),pe=s(!le),ce=e(pe,2),ue=ce[0],ve=ce[1],fe=L||g;n((function(){var e;return S&&(e=setTimeout((function(){ve(!0)}),S)),function(){clearTimeout(e)}}),[S,ve]);var he=a((function(){return"inverted"===ae?"onInverted":"onPrimary"}),[ae]),Te=a((function(){return"light"===R?"inverted"===ae?"on-inverted-background":"on-primary-color":R}),[ae,R]),ye=d||T?"div":l,ge="div"===ye?{ref:de,id:T,"data-testid":ne||N(j.TIPSEEN,T)}:{},Ce=o.createElement("div",null,o.createElement("div",{className:m(E.tipseenHeader)},I?null:o.createElement(v,{hideTooltip:!0,className:m(E.tipseenCloseButton,t({},E.dark,"dark"===R||"fixed-dark"===R)),onClick:O,size:"xs",kind:"tertiary",color:Te,ariaLabel:fe,icon:f}),o.createElement(h,{text:D,className:m(E.tipseenTitle,P)})),o.createElement(w,{color:he,type:"text2",element:"div",ellipsis:!1,className:m(E.tipseenContent)},o.createElement(x.Provider,{value:ae},z)));return o.createElement(ye,Object.assign({},ge),o.createElement(u,{className:m(E.tipseenWrapper,p,t(t({},E.tipseenWrapperWithoutCustomWidth,!Q),E.floating,re)),maxWidth:Q,arrowClassName:ee,style:Q?{width:Q}:void 0,shouldShowOnMount:!le,position:C,animationType:W,hideDelay:B,showDelay:0,hideTrigger:G,showTrigger:K,showOnDialogEnter:!1,content:Ce,theme:"inverted"===ae?"dark":"primary",containerSelector:q,disableDialogSlide:!1,moveBy:U,hideWhenReferenceHidden:X,referenceWrapperClassName:Y,tip:$&&!re,modifiers:oe,open:le?ue:void 0,forceRenderWithoutChildren:re},_))})),{closeButtonThemes:T,animationTypes:d,hideShowTriggers:p,colors:y,positions:k});export{x as TipseenContext,W as default};
+import{slicedToArray as e,defineProperty as t}from"../../../_virtual/_rollupPluginBabelHelpers.js";import o,{forwardRef as i,useRef as r,useState as s,useEffect as n,useMemo as a,Fragment as l}from"react";import m from"classnames";import d from"../../hooks/useMergeRef.js";import p from"../Tooltip/Tooltip.js";import c from"../IconButton/IconButton.js";import u from"./TipseenTitle.js";import{TipseenCloseButtonTheme as f,TipseenColor as h,TIPSEEN_CLOSE_BUTTON_ARIA_LABEL as v}from"./TipseenConstants.js";import{withStaticProps as T}from"../../types/withStaticProps.js";import"../../utils/colors-vars-map.js";import{ComponentDefaultTestId as g}from"../../tests/constants.js";import{getTestId as y}from"../../tests/testIds.js";import C from"../Text/Text.js";import j from"./Tipseen.module.scss.js";import{TooltipPositions as w}from"../Tooltip/TooltipConstants.js";import{AnimationType as E,HideShowEvent as N}from"../../../components/dialog/dist/Dialog/DialogConstants.js";import x from"../../../icons/dist/react/CloseSmall.js";var W=o.createContext("primary"),B=T(i((function(i,f){var h=i.className,T=i.id,w=i.position,E=void 0===w?"bottom":w,N=i.animationType,B=void 0===N?"expand":N,S=i.hideDelay,k=void 0===S?0:S,A=i.showDelay,D=void 0===A?100:A,b=i.title,P=i.titleClassName,H=i.hideCloseButton,I=i.closeButtonTheme,R=void 0===I?"light":I,O=i.onClose,L=i.closeAriaLabel,M=i.children,_=void 0===M?null:M,z=i.content,q=i.containerSelector,F=i.hideTrigger,G=void 0===F?[]:F,J=i.showTrigger,K=void 0===J?[]:J,Q=i.width,U=i.moveBy,V=i.hideWhenReferenceHidden,X=void 0!==V&&V,Y=i.referenceWrapperClassName,Z=i.tip,$=void 0===Z||Z,ee=i.tooltipArrowClassName,te=i.modifiers,oe=void 0===te?[]:te,ie=i.floating,re=void 0!==ie&&ie,se=i.color,ne=i["data-testid"],ae=null!=se?se:"inverted",le=Array.isArray(K)&&Array.isArray(G)&&0===K.length&&D>0,me=r(null),de=d(f,me),pe=s(!le),ce=e(pe,2),ue=ce[0],fe=ce[1],he=L||v;n((function(){var e;return D&&(e=setTimeout((function(){fe(!0)}),D)),function(){clearTimeout(e)}}),[D,fe]);var ve=a((function(){return"inverted"===ae?"onInverted":"onPrimary"}),[ae]),Te=a((function(){return"light"===R?"inverted"===ae?"on-inverted-background":"on-primary-color":R}),[ae,R]),ge=f||T?"div":l,ye="div"===ge?{ref:de,id:T,"data-testid":ne||y(g.TIPSEEN,T)}:{},Ce=o.createElement("div",null,o.createElement("div",{className:m(j.tipseenHeader)},H?null:o.createElement(c,{hideTooltip:!0,className:m(j.tipseenCloseButton,t({},j.dark,"dark"===R||"fixed-dark"===R)),onClick:O,size:"xs",kind:"tertiary",color:Te,ariaLabel:he,icon:x}),o.createElement(u,{text:b,className:m(j.tipseenTitle,P)})),o.createElement(C,{color:ve,type:"text2",element:"div",ellipsis:!1,className:m(j.tipseenContent)},o.createElement(W.Provider,{value:ae},z)));return o.createElement(ge,Object.assign({},ye),o.createElement(p,{className:m(j.tipseenWrapper,h,t(t({},j.tipseenWrapperWithoutCustomWidth,!Q),j.floating,re)),maxWidth:Q,arrowClassName:ee,style:Q?{width:Q}:void 0,shouldShowOnMount:!le,position:E,animationType:B,hideDelay:k,showDelay:0,hideTrigger:G,showTrigger:K,showOnDialogEnter:!1,content:Ce,theme:"inverted"===ae?"dark":"primary",containerSelector:q,disableDialogSlide:!1,moveBy:U,hideWhenReferenceHidden:X,referenceWrapperClassName:Y,tip:$&&!re,modifiers:oe,open:le?ue:void 0,forceRenderWithoutChildren:re},_))})),{closeButtonThemes:f,animationTypes:E,hideShowTriggers:N,colors:h,positions:w});export{W as TipseenContext,B as default};
 //# sourceMappingURL=Tipseen.js.map

package/dist/mocked_classnames/src/components/Tipseen/Tipseen.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tipseen.js","sources":["../../../../../src/components/Tipseen/Tipseen.tsx"],"sourcesContent":["import { forwardRef, Fragment, type ReactElement, useEffect, useMemo, useRef, useState } from \"react\";\nimport cx from \"classnames\";\nimport { type DialogAnimationType, type DialogTriggerEvent } from \"@vibe/dialog\";\nimport {\n  DialogAnimationTypeEnum as AnimationTypeEnum,\n  DialogTriggerEventEnum as HideShowEventEnum\n} from \"@vibe/dialog\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport Tooltip from \"../../components/Tooltip/Tooltip\";\nimport IconButton from \"../../components/IconButton/IconButton\";\nimport { CloseSmall } from \"@vibe/icons\";\nimport TipseenTitle from \"./TipseenTitle\";\nimport {\n  TIPSEEN_CLOSE_BUTTON_ARIA_LABEL,\n  TipseenCloseButtonTheme as TipseenCloseButtonThemeEnum,\n  TipseenColor as TipseenColorEnum\n} from \"./TipseenConstants\";\nimport { type TipseenCloseButtonTheme, type TipseenColor } from \"./Tipseen.types\";\nimport { type ElementContent, type VibeComponentProps, withStaticProps } from \"../../types\";\nimport { type MoveBy } from \"../../types/MoveBy\";\nimport { type Modifier } from \"react-popper\";\nimport { ComponentDefaultTestId } from \"../../tests/constants\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport Text from \"../Text/Text\";\nimport styles from \"./Tipseen.module.scss\";\nimport React from \"react\";\nimport { type TooltipPositions } from \"../Tooltip/Tooltip.types\";\nimport { TooltipPositions as TooltipPositionsEnum } from \"../Tooltip/TooltipConstants\";\n\nexport interface TipseenProps extends VibeComponentProps {\n  /**\n   * Class name applied to the Tipseen title.\n   */\n  titleClassName?: string;\n  /**\n   * The position of the Tipseen relative to the target element.\n   */\n  position?: TooltipPositions;\n  /**\n   * The animation type used for showing/hiding the Tipseen.\n   */\n  animationType?: DialogAnimationType;\n  /**\n   * The delay in milliseconds before hiding the Tipseen.\n   */\n  hideDelay?: number;\n  /**\n   * The delay in milliseconds before showing the Tipseen.\n   */\n  showDelay?: number;\n  /**\n   * The title text of the Tipseen.\n   */\n  title?: string;\n  /**\n   * If true, hides the close button.\n   */\n  hideCloseButton?: boolean;\n  /**\n   * The child element that triggers the Tipseen.\n   */\n  children?: ReactElement;\n  /**\n   * The CSS selector of the container where the Tipseen should be rendered.\n   */\n  containerSelector?: string;\n  /**\n   * Events that trigger hiding the Tipseen.\n   */\n  hideTrigger?: DialogTriggerEvent | Array<DialogTriggerEvent>;\n  /**\n   * Events that trigger showing the Tipseen.\n   */\n  showTrigger?: DialogTriggerEvent | Array<DialogTriggerEvent>;\n  /**\n   * The width of the Tipseen.\n   */\n  width?: number;\n  /**\n   * Offset values for positioning adjustments.\n   */\n  moveBy?: MoveBy;\n  /**\n   * If true, hides the Tipseen when the reference element is hidden.\n   */\n  hideWhenReferenceHidden?: boolean;\n  /**\n   * Class name applied to the reference wrapper element.\n   */\n  referenceWrapperClassName?: string;\n  /**\n   * If false, hides the arrow of the Tipseen.\n   */\n  tip?: boolean;\n  /**\n   * Class name applied to the Tipseen arrow.\n   */\n  tooltipArrowClassName?: string;\n  /**\n   * Custom Popper.js modifiers.\n   * https://popper.js.org/docs/v2/modifiers/\n   */\n  modifiers?: Array<Modifier<unknown>>;\n  /**\n   * The aria-label for the close button.\n   */\n  closeAriaLabel?: string;\n  /**\n   * Callback fired when the Tipseen is closed.\n   */\n  onClose?: (event?: React.MouseEvent<HTMLButtonElement>) => void;\n  /**\n   * The content displayed inside the Tipseen.\n   */\n  content: ElementContent;\n  /**\n   * The theme of the Tipseen close button.\n   */\n  closeButtonTheme?: TipseenCloseButtonTheme;\n  /**\n   * If true, renders the Tipseen as a floating element without a reference.\n   */\n  floating?: boolean;\n  /**\n   * The color theme of the Tipseen.\n   */\n  color?: TipseenColor;\n}\n\nexport const TipseenContext = React.createContext<TipseenColor>(\"primary\");\n\nconst Tipseen = forwardRef(\n  (\n    {\n      className,\n      id,\n      position = \"bottom\",\n      animationType = \"expand\",\n      hideDelay = 0,\n      showDelay = 100,\n      title,\n      titleClassName,\n      hideCloseButton,\n      closeButtonTheme = \"light\",\n      onClose,\n      closeAriaLabel,\n      children = null,\n      content,\n      containerSelector,\n      hideTrigger = [],\n      showTrigger = [],\n      width,\n      moveBy,\n      hideWhenReferenceHidden = false,\n      referenceWrapperClassName,\n      tip = true,\n      tooltipArrowClassName,\n      modifiers = [],\n      floating = false,\n      color: colorProp,\n      \"data-testid\": dataTestId\n    }: TipseenProps,\n    ref: React.ForwardedRef<HTMLElement>\n  ) => {\n    const color = colorProp ?? \"inverted\";\n\n    const defaultDelayOpen =\n      Array.isArray(showTrigger) && Array.isArray(hideTrigger) && showTrigger.length === 0 && showDelay > 0;\n\n    const componentRef = useRef(null);\n    const mergedRef = useMergeRef(ref, componentRef);\n    const [delayedOpen, setDelayOpen] = useState(!defaultDelayOpen);\n    const overrideCloseAriaLabel = closeAriaLabel || TIPSEEN_CLOSE_BUTTON_ARIA_LABEL;\n\n    useEffect(() => {\n      let timeout: NodeJS.Timeout;\n      if (showDelay) {\n        timeout = setTimeout(() => {\n          setDelayOpen(true);\n        }, showDelay);\n      }\n      return () => {\n        clearTimeout(timeout);\n      };\n    }, [showDelay, setDelayOpen]);\n\n    const textColor = useMemo(() => {\n      return color === \"inverted\" ? \"onInverted\" : \"onPrimary\";\n    }, [color]);\n    const closeButtonColor = useMemo(() => {\n      if (closeButtonTheme === \"light\") {\n        return color === \"inverted\" ? \"on-inverted-background\" : \"on-primary-color\";\n      } else {\n        return closeButtonTheme;\n      }\n    }, [color, closeButtonTheme]);\n\n    const TipseenWrapper = ref || id ? \"div\" : Fragment;\n    const wrapperProps =\n      TipseenWrapper === \"div\"\n        ? { ref: mergedRef, id, \"data-testid\": dataTestId || getTestId(ComponentDefaultTestId.TIPSEEN, id) }\n        : {};\n\n    const tooltipContent = (\n      <div>\n        <div className={cx(styles.tipseenHeader)}>\n          {hideCloseButton ? null : (\n            <IconButton\n              hideTooltip\n              className={cx(styles.tipseenCloseButton, {\n                [styles.dark]: closeButtonTheme === \"dark\" || closeButtonTheme === \"fixed-dark\"\n              })}\n              onClick={onClose}\n              size=\"xs\"\n              kind=\"tertiary\"\n              // @ts-ignore\n              color={closeButtonColor}\n              ariaLabel={overrideCloseAriaLabel}\n              icon={CloseSmall}\n            />\n          )}\n          <TipseenTitle text={title} className={cx(styles.tipseenTitle, titleClassName)} />\n        </div>\n        <Text color={textColor} type=\"text2\" element=\"div\" ellipsis={false} className={cx(styles.tipseenContent)}>\n          <TipseenContext.Provider value={color}>{content}</TipseenContext.Provider>\n        </Text>\n      </div>\n    );\n\n    return (\n      <TipseenWrapper {...wrapperProps}>\n        <Tooltip\n          className={cx(styles.tipseenWrapper, className, {\n            [styles.tipseenWrapperWithoutCustomWidth]: !width,\n            [styles.floating]: floating\n          })}\n          maxWidth={width}\n          arrowClassName={tooltipArrowClassName}\n          style={width ? { width } : undefined}\n          shouldShowOnMount={!defaultDelayOpen}\n          position={position}\n          animationType={animationType}\n          hideDelay={hideDelay}\n          showDelay={0}\n          hideTrigger={hideTrigger}\n          showTrigger={showTrigger}\n          showOnDialogEnter={false}\n          content={tooltipContent}\n          theme={color === \"inverted\" ? \"dark\" : \"primary\"}\n          containerSelector={containerSelector}\n          disableDialogSlide={false}\n          moveBy={moveBy}\n          hideWhenReferenceHidden={hideWhenReferenceHidden}\n          referenceWrapperClassName={referenceWrapperClassName}\n          tip={tip && !floating}\n          modifiers={modifiers}\n          open={defaultDelayOpen ? delayedOpen : undefined}\n          forceRenderWithoutChildren={floating}\n        >\n          {children}\n        </Tooltip>\n      </TipseenWrapper>\n    );\n  }\n);\n\ninterface TipseenStaticProps {\n  closeButtonThemes: typeof TipseenCloseButtonThemeEnum;\n  animationTypes: typeof AnimationTypeEnum;\n  hideShowTriggers: typeof HideShowEventEnum;\n  colors: typeof TipseenColorEnum;\n  positions: typeof TooltipPositionsEnum;\n}\n\nexport default withStaticProps<TipseenProps, TipseenStaticProps>(Tipseen, {\n  closeButtonThemes: TipseenCloseButtonThemeEnum,\n  animationTypes: AnimationTypeEnum,\n  hideShowTriggers: HideShowEventEnum,\n  colors: TipseenColorEnum,\n  positions: TooltipPositionsEnum\n});\n"],"names":["TipseenContext","React","createContext","withStaticProps","forwardRef","_ref","ref","className","id","_ref$position","position","_ref$animationType","animationType","_ref$hideDelay","hideDelay","_ref$showDelay","showDelay","title","titleClassName","hideCloseButton","_ref$closeButtonTheme","closeButtonTheme","onClose","closeAriaLabel","_ref$children","children","content","containerSelector","_ref$hideTrigger","hideTrigger","_ref$showTrigger","showTrigger","width","moveBy","_ref$hideWhenReferenc","hideWhenReferenceHidden","referenceWrapperClassName","_ref$tip","tip","tooltipArrowClassName","_ref$modifiers","modifiers","_ref$floating","floating","colorProp","color","dataTestId","defaultDelayOpen","Array","isArray","length","componentRef","useRef","mergedRef","useMergeRef","_useState","useState","_useState2","_slicedToArray","delayedOpen","setDelayOpen","overrideCloseAriaLabel","TIPSEEN_CLOSE_BUTTON_ARIA_LABEL","useEffect","timeout","setTimeout","clearTimeout","textColor","useMemo","closeButtonColor","TipseenWrapper","Fragment","wrapperProps","getTestId","ComponentDefaultTestId","TIPSEEN","tooltipContent","createElement","cx","styles","tipseenHeader","IconButton","hideTooltip","tipseenCloseButton","_defineProperty","dark","onClick","size","kind","ariaLabel","icon","CloseSmall","TipseenTitle","text","tipseenTitle","Text","type","element","ellipsis","tipseenContent","Provider","value","Object","assign","Tooltip","tipseenWrapper","tipseenWrapperWithoutCustomWidth","maxWidth","arrowClassName","style","undefined","shouldShowOnMount","showOnDialogEnter","theme","disableDialogSlide","open","forceRenderWithoutChildren","closeButtonThemes","TipseenCloseButtonThemeEnum","animationTypes","AnimationTypeEnum","hideShowTriggers","HideShowEventEnum","colors","TipseenColorEnum","positions","TooltipPositionsEnum"],"mappings":"6/BAiIO,IAAMA,EAAiBC,EAAMC,cAA4B,WAiJjDC,EAAAA,EA/ICC,GACd,SAAAC,EA8BEC,GACE,IA7BAC,EAASF,EAATE,UACAC,EAAEH,EAAFG,GAAEC,EAAAJ,EACFK,SAAAA,OAAW,IAAHD,EAAG,SAAQA,EAAAE,EAAAN,EACnBO,cAAAA,OAAgB,IAAHD,EAAG,SAAQA,EAAAE,EAAAR,EACxBS,UAAAA,OAAY,IAAHD,EAAG,EAACA,EAAAE,EAAAV,EACbW,UAAAA,OAAY,IAAHD,EAAG,IAAGA,EACfE,EAAKZ,EAALY,MACAC,EAAcb,EAAda,eACAC,EAAed,EAAfc,gBAAeC,EAAAf,EACfgB,iBAAAA,OAAmB,IAAHD,EAAG,QAAOA,EAC1BE,EAAOjB,EAAPiB,QACAC,EAAclB,EAAdkB,eAAcC,EAAAnB,EACdoB,SAAAA,OAAW,IAAHD,EAAG,KAAIA,EACfE,EAAOrB,EAAPqB,QACAC,EAAiBtB,EAAjBsB,kBAAiBC,EAAAvB,EACjBwB,YAAAA,OAAc,IAAHD,EAAG,GAAEA,EAAAE,EAAAzB,EAChB0B,YAAAA,OAAc,IAAHD,EAAG,GAAEA,EAChBE,EAAK3B,EAAL2B,MACAC,EAAM5B,EAAN4B,OAAMC,EAAA7B,EACN8B,wBAAAA,OAA0B,IAAHD,GAAQA,EAC/BE,EAAyB/B,EAAzB+B,0BAAyBC,EAAAhC,EACzBiC,IAAAA,OAAM,IAAHD,GAAOA,EACVE,GAAqBlC,EAArBkC,sBAAqBC,GAAAnC,EACrBoC,UAAAA,QAAY,IAAHD,GAAG,GAAEA,GAAAE,GAAArC,EACdsC,SAAAA,QAAW,IAAHD,IAAQA,GACTE,GAASvC,EAAhBwC,MACeC,GAAUzC,EAAzB,eAIIwC,GAAQD,SAAAA,GAAa,WAErBG,GACJC,MAAMC,QAAQlB,IAAgBiB,MAAMC,QAAQpB,IAAuC,IAAvBE,EAAYmB,QAAgBlC,EAAY,EAEhGmC,GAAeC,EAAO,MACtBC,GAAYC,EAAYhD,EAAK6C,IACnCI,GAAoCC,GAAUT,IAAiBU,GAAAC,EAAAH,GAAA,GAAxDI,GAAWF,GAAA,GAAEG,GAAYH,GAAA,GAC1BI,GAAyBtC,GAAkBuC,EAEjDC,GAAU,WACR,IAAIC,EAMJ,OALIhD,IACFgD,EAAUC,YAAW,WACnBL,IAAa,EACd,GAAE5C,IAEE,WACLkD,aAAaF,GAEjB,GAAG,CAAChD,EAAW4C,KAEf,IAAMO,GAAYC,GAAQ,WACxB,MAAiB,aAAVvB,GAAuB,aAAe,WAC/C,GAAG,CAACA,KACEwB,GAAmBD,GAAQ,WAC/B,MAAyB,UAArB/C,EACe,aAAVwB,GAAuB,yBAA2B,mBAElDxB,CAEX,GAAG,CAACwB,GAAOxB,IAELiD,GAAiBhE,GAAOE,EAAK,MAAQ+D,EACrCC,GACe,QAAnBF,GACI,CAAEhE,IAAK+C,GAAW7C,GAAAA,EAAI,cAAesC,IAAc2B,EAAUC,EAAuBC,QAASnE,IAC7F,GAEAoE,GACJ3E,EAAA4E,cAAA,MAAA,KACE5E,EAAA4E,cAAA,MAAA,CAAKtE,UAAWuE,EAAGC,EAAOC,gBACvB7D,EAAkB,KACjBlB,EAAC4E,cAAAI,GACCC,aAAW,EACX3E,UAAWuE,EAAGC,EAAOI,mBAAkBC,EACpCL,CAAAA,EAAAA,EAAOM,KAA4B,SAArBhE,GAAoD,eAArBA,IAEhDiE,QAAShE,EACTiE,KAAK,KACLC,KAAK,WAEL3C,MAAOwB,GACPoB,UAAW5B,GACX6B,KAAMC,IAGV1F,EAAA4E,cAACe,EAAa,CAAAC,KAAM5E,EAAOV,UAAWuE,EAAGC,EAAOe,aAAc5E,MAEhEjB,EAAC4E,cAAAkB,EAAK,CAAAlD,MAAOsB,GAAW6B,KAAK,QAAQC,QAAQ,MAAMC,UAAU,EAAO3F,UAAWuE,EAAGC,EAAOoB,iBACvFlG,EAAA4E,cAAC7E,EAAeoG,SAAQ,CAACC,MAAOxD,IAAQnB,KAK9C,OACEzB,EAAA4E,cAACP,GAAcgC,OAAAC,OAAA,CAAA,EAAK/B,IAClBvE,EAAC4E,cAAA2B,EACC,CAAAjG,UAAWuE,EAAGC,EAAO0B,eAAgBlG,EAAS6E,EAAAA,EAAA,CAAA,EAC3CL,EAAO2B,kCAAoC1E,GAC3C+C,EAAOpC,SAAWA,KAErBgE,SAAU3E,EACV4E,eAAgBrE,GAChBsE,MAAO7E,EAAQ,CAAEA,MAAAA,QAAU8E,EAC3BC,mBAAoBhE,GACpBrC,SAAUA,EACVE,cAAeA,EACfE,UAAWA,EACXE,UAAW,EACXa,YAAaA,EACbE,YAAaA,EACbiF,mBAAmB,EACnBtF,QAASkD,GACTqC,MAAiB,aAAVpE,GAAuB,OAAS,UACvClB,kBAAmBA,EACnBuF,oBAAoB,EACpBjF,OAAQA,EACRE,wBAAyBA,EACzBC,0BAA2BA,EAC3BE,IAAKA,IAAQK,GACbF,UAAWA,GACX0E,KAAMpE,GAAmBY,QAAcmD,EACvCM,2BAA4BzE,IAE3BlB,GAIT,IAWwE,CACxE4F,kBAAmBC,EACnBC,eAAgBC,EAChBC,iBAAkBC,EAClBC,OAAQC,EACRC,UAAWC"}
+{"version":3,"file":"Tipseen.js","sources":["../../../../../src/components/Tipseen/Tipseen.tsx"],"sourcesContent":["import { forwardRef, Fragment, type ReactElement, useEffect, useMemo, useRef, useState } from \"react\";\nimport cx from \"classnames\";\nimport { type DialogAnimationType, type DialogTriggerEvent } from \"@vibe/dialog\";\nimport {\n  DialogAnimationTypeEnum as AnimationTypeEnum,\n  DialogTriggerEventEnum as HideShowEventEnum\n} from \"@vibe/dialog\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport Tooltip from \"../../components/Tooltip/Tooltip\";\nimport IconButton from \"../../components/IconButton/IconButton\";\nimport { CloseSmall } from \"@vibe/icons\";\nimport TipseenTitle from \"./TipseenTitle\";\nimport {\n  TIPSEEN_CLOSE_BUTTON_ARIA_LABEL,\n  TipseenCloseButtonTheme as TipseenCloseButtonThemeEnum,\n  TipseenColor as TipseenColorEnum\n} from \"./TipseenConstants\";\nimport { type TipseenCloseButtonTheme, type TipseenColor } from \"./Tipseen.types\";\nimport { type ElementContent, type VibeComponentProps, withStaticProps } from \"../../types\";\nimport { type MoveBy } from \"../../types/MoveBy\";\nimport { type Modifier } from \"react-popper\";\nimport { ComponentDefaultTestId } from \"../../tests/constants\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport Text from \"../Text/Text\";\nimport styles from \"./Tipseen.module.scss\";\nimport React from \"react\";\nimport { type TooltipPositions } from \"../Tooltip/Tooltip.types\";\nimport { TooltipPositions as TooltipPositionsEnum } from \"../Tooltip/TooltipConstants\";\n\nexport interface TipseenProps extends VibeComponentProps {\n  /**\n   * Class name applied to the Tipseen title.\n   */\n  titleClassName?: string;\n  /**\n   * The position of the Tipseen relative to the target element.\n   */\n  position?: TooltipPositions;\n  /**\n   * The animation type used for showing/hiding the Tipseen.\n   */\n  animationType?: DialogAnimationType;\n  /**\n   * The delay in milliseconds before hiding the Tipseen.\n   */\n  hideDelay?: number;\n  /**\n   * The delay in milliseconds before showing the Tipseen.\n   */\n  showDelay?: number;\n  /**\n   * The title text of the Tipseen.\n   */\n  title?: string;\n  /**\n   * If true, hides the close button.\n   */\n  hideCloseButton?: boolean;\n  /**\n   * The child element that triggers the Tipseen.\n   */\n  children?: ReactElement;\n  /**\n   * The CSS selector of the container where the Tipseen should be rendered.\n   */\n  containerSelector?: string;\n  /**\n   * Events that trigger hiding the Tipseen.\n   */\n  hideTrigger?: DialogTriggerEvent | Array<DialogTriggerEvent>;\n  /**\n   * Events that trigger showing the Tipseen.\n   */\n  showTrigger?: DialogTriggerEvent | Array<DialogTriggerEvent>;\n  /**\n   * The width of the Tipseen.\n   */\n  width?: number;\n  /**\n   * Offset values for positioning adjustments.\n   */\n  moveBy?: MoveBy;\n  /**\n   * If true, hides the Tipseen when the reference element is hidden.\n   */\n  hideWhenReferenceHidden?: boolean;\n  /**\n   * Class name applied to the reference wrapper element.\n   */\n  referenceWrapperClassName?: string;\n  /**\n   * If false, hides the arrow of the Tipseen.\n   */\n  tip?: boolean;\n  /**\n   * Class name applied to the Tipseen arrow.\n   */\n  tooltipArrowClassName?: string;\n  /**\n   * Custom Popper.js modifiers.\n   * https://popper.js.org/docs/v2/modifiers/\n   */\n  modifiers?: Array<Modifier<unknown>>;\n  /**\n   * The aria-label for the close button.\n   */\n  closeAriaLabel?: string;\n  /**\n   * Callback fired when the Tipseen is closed.\n   */\n  onClose?: (event?: React.MouseEvent<HTMLButtonElement>) => void;\n  /**\n   * The content displayed inside the Tipseen.\n   */\n  content: ElementContent;\n  /**\n   * The theme of the Tipseen close button.\n   */\n  closeButtonTheme?: TipseenCloseButtonTheme;\n  /**\n   * If true, renders the Tipseen as a floating element without a reference.\n   */\n  floating?: boolean;\n  /**\n   * The color theme of the Tipseen.\n   */\n  color?: TipseenColor;\n}\n\nexport const TipseenContext = React.createContext<TipseenColor>(\"primary\");\n\nconst Tipseen = forwardRef(\n  (\n    {\n      className,\n      id,\n      position = \"bottom\",\n      animationType = \"expand\",\n      hideDelay = 0,\n      showDelay = 100,\n      title,\n      titleClassName,\n      hideCloseButton,\n      closeButtonTheme = \"light\",\n      onClose,\n      closeAriaLabel,\n      children = null,\n      content,\n      containerSelector,\n      hideTrigger = [],\n      showTrigger = [],\n      width,\n      moveBy,\n      hideWhenReferenceHidden = false,\n      referenceWrapperClassName,\n      tip = true,\n      tooltipArrowClassName,\n      modifiers = [],\n      floating = false,\n      color: colorProp,\n      \"data-testid\": dataTestId\n    }: TipseenProps,\n    ref: React.ForwardedRef<HTMLElement>\n  ) => {\n    const color = colorProp ?? \"inverted\";\n\n    const defaultDelayOpen =\n      Array.isArray(showTrigger) && Array.isArray(hideTrigger) && showTrigger.length === 0 && showDelay > 0;\n\n    const componentRef = useRef(null);\n    const mergedRef = useMergeRef(ref, componentRef);\n    const [delayedOpen, setDelayOpen] = useState(!defaultDelayOpen);\n    const overrideCloseAriaLabel = closeAriaLabel || TIPSEEN_CLOSE_BUTTON_ARIA_LABEL;\n\n    useEffect(() => {\n      let timeout: NodeJS.Timeout;\n      if (showDelay) {\n        timeout = setTimeout(() => {\n          setDelayOpen(true);\n        }, showDelay);\n      }\n      return () => {\n        clearTimeout(timeout);\n      };\n    }, [showDelay, setDelayOpen]);\n\n    const textColor = useMemo(() => {\n      return color === \"inverted\" ? \"onInverted\" : \"onPrimary\";\n    }, [color]);\n    const closeButtonColor = useMemo(() => {\n      if (closeButtonTheme === \"light\") {\n        return color === \"inverted\" ? \"on-inverted-background\" : \"on-primary-color\";\n      } else {\n        return closeButtonTheme;\n      }\n    }, [color, closeButtonTheme]);\n\n    const TipseenWrapper = ref || id ? \"div\" : Fragment;\n    const wrapperProps =\n      TipseenWrapper === \"div\"\n        ? { ref: mergedRef, id, \"data-testid\": dataTestId || getTestId(ComponentDefaultTestId.TIPSEEN, id) }\n        : {};\n\n    const tooltipContent = (\n      <div>\n        <div className={cx(styles.tipseenHeader)}>\n          {hideCloseButton ? null : (\n            <IconButton\n              hideTooltip\n              className={cx(styles.tipseenCloseButton, {\n                [styles.dark]: closeButtonTheme === \"dark\" || closeButtonTheme === \"fixed-dark\"\n              })}\n              onClick={onClose}\n              size=\"xs\"\n              kind=\"tertiary\"\n              // @ts-ignore\n              color={closeButtonColor}\n              ariaLabel={overrideCloseAriaLabel}\n              icon={CloseSmall}\n            />\n          )}\n          <TipseenTitle text={title} className={cx(styles.tipseenTitle, titleClassName)} />\n        </div>\n        <Text color={textColor} type=\"text2\" element=\"div\" ellipsis={false} className={cx(styles.tipseenContent)}>\n          <TipseenContext.Provider value={color}>{content}</TipseenContext.Provider>\n        </Text>\n      </div>\n    );\n\n    return (\n      <TipseenWrapper {...wrapperProps}>\n        <Tooltip\n          className={cx(styles.tipseenWrapper, className, {\n            [styles.tipseenWrapperWithoutCustomWidth]: !width,\n            [styles.floating]: floating\n          })}\n          maxWidth={width}\n          arrowClassName={tooltipArrowClassName}\n          style={width ? { width } : undefined}\n          shouldShowOnMount={!defaultDelayOpen}\n          position={position}\n          animationType={animationType}\n          hideDelay={hideDelay}\n          showDelay={0}\n          hideTrigger={hideTrigger}\n          showTrigger={showTrigger}\n          showOnDialogEnter={false}\n          content={tooltipContent}\n          theme={color === \"inverted\" ? \"dark\" : \"primary\"}\n          containerSelector={containerSelector}\n          disableDialogSlide={false}\n          moveBy={moveBy}\n          hideWhenReferenceHidden={hideWhenReferenceHidden}\n          referenceWrapperClassName={referenceWrapperClassName}\n          tip={tip && !floating}\n          modifiers={modifiers}\n          open={defaultDelayOpen ? delayedOpen : undefined}\n          forceRenderWithoutChildren={floating}\n        >\n          {children}\n        </Tooltip>\n      </TipseenWrapper>\n    );\n  }\n);\n\ninterface TipseenStaticProps {\n  closeButtonThemes: typeof TipseenCloseButtonThemeEnum;\n  animationTypes: typeof AnimationTypeEnum;\n  hideShowTriggers: typeof HideShowEventEnum;\n  colors: typeof TipseenColorEnum;\n  positions: typeof TooltipPositionsEnum;\n}\n\nexport default withStaticProps<TipseenProps, TipseenStaticProps>(Tipseen, {\n  closeButtonThemes: TipseenCloseButtonThemeEnum,\n  animationTypes: AnimationTypeEnum,\n  hideShowTriggers: HideShowEventEnum,\n  colors: TipseenColorEnum,\n  positions: TooltipPositionsEnum\n});\n"],"names":["TipseenContext","React","createContext","withStaticProps","forwardRef","_ref","ref","className","id","_ref$position","position","_ref$animationType","animationType","_ref$hideDelay","hideDelay","_ref$showDelay","showDelay","title","titleClassName","hideCloseButton","_ref$closeButtonTheme","closeButtonTheme","onClose","closeAriaLabel","_ref$children","children","content","containerSelector","_ref$hideTrigger","hideTrigger","_ref$showTrigger","showTrigger","width","moveBy","_ref$hideWhenReferenc","hideWhenReferenceHidden","referenceWrapperClassName","_ref$tip","tip","tooltipArrowClassName","_ref$modifiers","modifiers","_ref$floating","floating","colorProp","color","dataTestId","defaultDelayOpen","Array","isArray","length","componentRef","useRef","mergedRef","useMergeRef","_useState","useState","_useState2","_slicedToArray","delayedOpen","setDelayOpen","overrideCloseAriaLabel","TIPSEEN_CLOSE_BUTTON_ARIA_LABEL","useEffect","timeout","setTimeout","clearTimeout","textColor","useMemo","closeButtonColor","TipseenWrapper","Fragment","wrapperProps","getTestId","ComponentDefaultTestId","TIPSEEN","tooltipContent","createElement","cx","styles","tipseenHeader","IconButton","hideTooltip","tipseenCloseButton","_defineProperty","dark","onClick","size","kind","ariaLabel","icon","CloseSmall","TipseenTitle","text","tipseenTitle","Text","type","element","ellipsis","tipseenContent","Provider","value","Object","assign","Tooltip","tipseenWrapper","tipseenWrapperWithoutCustomWidth","maxWidth","arrowClassName","style","undefined","shouldShowOnMount","showOnDialogEnter","theme","disableDialogSlide","open","forceRenderWithoutChildren","closeButtonThemes","TipseenCloseButtonThemeEnum","animationTypes","AnimationTypeEnum","hideShowTriggers","HideShowEventEnum","colors","TipseenColorEnum","positions","TooltipPositionsEnum"],"mappings":"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"}

package/dist/mocked_classnames/src/components/Tipseen/TipseenContent.js

@@ -1,2 +1,2 @@
-import t,{useContext as e,useMemo as s}from"react";import i from"classnames";import{TipseenColor as o,SUBMIT_BUTTON_TEXT as n,DISMISS_BUTTON_TEXT as m}from"./TipseenConstants.js";import r from"./TipseenBasicContent.js";import l from"./TipseenContent.module.scss.js";import{getTestId as a}from"../../tests/testIds.js";import{ComponentDefaultTestId as c}from"../../tests/constants.js";import{TipseenContext as d}from"./Tipseen.js";import{Button as u}from"@vibe/button/mockedClassNames";var p=function(p){var T=p.id,f=p.title,E=p.titleClassName,N=p.children,C=void 0===N?null:N,v=p.hideDismiss,I=void 0===v||v,b=p.hideSubmit,S=p.submitButtonText,j=void 0===S?n:S,k=p.submitButtonIcon,B=p.onSubmit,D=p.dismissButtonText,_=void 0===D?m:D,h=p.onDismiss,x=e(d),y=s((function(){return x===o.INVERTED?"on-inverted-background":"on-primary-color"}),[x]);return t.createElement(r,{title:f,titleClassName:E,id:T},C?t.createElement("span",null,C):null,t.createElement("div",{className:i(l.buttons)},I?null:t.createElement(u,{kind:"tertiary",color:y,className:l.dismiss,size:"small",onClick:h,"data-testid":a(c.TIPSEEN_CONTENT_DISMISS)},_),b?null:t.createElement(u,{kind:"primary",color:y,size:"small",onClick:B,"data-testid":a(c.TIPSEEN_CONTENT_SUBMIT),leftIcon:k},j)))};export{p as default};
+import t,{useContext as e,useMemo as s}from"react";import i from"classnames";import{TipseenColor as o,SUBMIT_BUTTON_TEXT as n,DISMISS_BUTTON_TEXT as r}from"./TipseenConstants.js";import m from"./TipseenBasicContent.js";import l from"./TipseenContent.module.scss.js";import{getTestId as a}from"../../tests/testIds.js";import{ComponentDefaultTestId as c}from"../../tests/constants.js";import{TipseenContext as d}from"./Tipseen.js";import u from"../../../components/button/dist/Button/Button.js";var p=function(p){var T=p.id,f=p.title,E=p.titleClassName,N=p.children,C=void 0===N?null:N,I=p.hideDismiss,v=void 0===I||I,S=p.hideSubmit,b=p.submitButtonText,j=void 0===b?n:b,B=p.submitButtonIcon,k=p.onSubmit,D=p.dismissButtonText,_=void 0===D?r:D,h=p.onDismiss,x=e(d),y=s((function(){return x===o.INVERTED?"on-inverted-background":"on-primary-color"}),[x]);return t.createElement(m,{title:f,titleClassName:E,id:T},C?t.createElement("span",null,C):null,t.createElement("div",{className:i(l.buttons)},v?null:t.createElement(u,{kind:"tertiary",color:y,className:l.dismiss,size:"small",onClick:h,"data-testid":a(c.TIPSEEN_CONTENT_DISMISS)},_),S?null:t.createElement(u,{kind:"primary",color:y,size:"small",onClick:k,"data-testid":a(c.TIPSEEN_CONTENT_SUBMIT),leftIcon:B},j)))};export{p as default};
 //# sourceMappingURL=TipseenContent.js.map

package/dist/mocked_classnames/src/components/Tipseen/TipseenContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"TipseenContent.js","sources":["../../../../../src/components/Tipseen/TipseenContent.tsx"],"sourcesContent":["import React, { type FC, useContext, useMemo } from \"react\";\nimport cx from \"classnames\";\nimport { DISMISS_BUTTON_TEXT, SUBMIT_BUTTON_TEXT, TipseenColor } from \"./TipseenConstants\";\nimport TipseenBasicContent from \"./TipseenBasicContent\";\nimport { type VibeComponentProps } from \"../../types\";\nimport { type ElementContent } from \"../../types/ElementContent\";\nimport styles from \"./TipseenContent.module.scss\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../tests/constants\";\nimport { TipseenContext } from \"./Tipseen\";\nimport { Button } from \"@vibe/button\";\nimport { type SubIcon } from \"@vibe/icon\";\n\nexport interface TipseenContentProps extends VibeComponentProps {\n  /**\n   * The title text displayed in the Tipseen content.\n   */\n  title?: string;\n  /**\n   * Class name applied to the Tipseen title.\n   */\n  titleClassName?: string;\n  /**\n   * If true, hides the dismiss button.\n   */\n  hideDismiss?: boolean;\n  /**\n   * The content inside the Tipseen.\n   */\n  children?: ElementContent;\n  /**\n   * If true, hides the submit button.\n   */\n  hideSubmit?: boolean;\n  /**\n   * The text displayed on the submit button.\n   */\n  submitButtonText?: string;\n  /**\n   * Icon to display in the submit button\n   */\n  submitButtonIcon?: SubIcon;\n  /**\n   * Callback fired when the submit button is clicked.\n   */\n  onSubmit?: (event: React.MouseEvent) => void;\n  /**\n   * The text displayed on the dismiss button.\n   */\n  dismissButtonText?: string;\n  /**\n   * Callback fired when the dismiss button is clicked.\n   */\n  onDismiss?: (event: React.MouseEvent) => void;\n}\n\nconst TipseenContent: FC<TipseenContentProps> = ({\n  id,\n  title,\n  titleClassName,\n  children = null,\n  hideDismiss = true,\n  hideSubmit,\n  submitButtonText = SUBMIT_BUTTON_TEXT,\n  submitButtonIcon,\n  onSubmit,\n  dismissButtonText = DISMISS_BUTTON_TEXT,\n  onDismiss\n}) => {\n  const color = useContext(TipseenContext);\n  const buttonColor = useMemo(() => {\n    return color === TipseenColor.INVERTED ? \"on-inverted-background\" : \"on-primary-color\";\n  }, [color]);\n\n  return (\n    <TipseenBasicContent title={title} titleClassName={titleClassName} id={id}>\n      {children ? <span>{children}</span> : null}\n      <div className={cx(styles.buttons)}>\n        {hideDismiss ? null : (\n          <Button\n            kind=\"tertiary\"\n            color={buttonColor}\n            className={styles.dismiss}\n            size=\"small\"\n            onClick={onDismiss}\n            data-testid={getTestId(ComponentDefaultTestId.TIPSEEN_CONTENT_DISMISS)}\n          >\n            {dismissButtonText}\n          </Button>\n        )}\n        {hideSubmit ? null : (\n          <Button\n            kind=\"primary\"\n            color={buttonColor}\n            size=\"small\"\n            onClick={onSubmit}\n            data-testid={getTestId(ComponentDefaultTestId.TIPSEEN_CONTENT_SUBMIT)}\n            leftIcon={submitButtonIcon}\n          >\n            {submitButtonText}\n          </Button>\n        )}\n      </div>\n    </TipseenBasicContent>\n  );\n};\n\nexport default TipseenContent;\n"],"names":["TipseenContent","_ref","id","title","titleClassName","_ref$children","children","_ref$hideDismiss","hideDismiss","hideSubmit","_ref$submitButtonText","submitButtonText","SUBMIT_BUTTON_TEXT","submitButtonIcon","onSubmit","_ref$dismissButtonTex","dismissButtonText","DISMISS_BUTTON_TEXT","onDismiss","color","useContext","TipseenContext","buttonColor","useMemo","TipseenColor","INVERTED","React","createElement","TipseenBasicContent","className","cx","styles","buttons","Button","kind","dismiss","size","onClick","getTestId","ComponentDefaultTestId","TIPSEEN_CONTENT_DISMISS","TIPSEEN_CONTENT_SUBMIT","leftIcon"],"mappings":"oeAwDA,IAAMA,EAA0C,SAA5BC,GAYf,IAXHC,EAAED,EAAFC,GACAC,EAAKF,EAALE,MACAC,EAAcH,EAAdG,eAAcC,EAAAJ,EACdK,SAAAA,OAAW,IAAHD,EAAG,KAAIA,EAAAE,EAAAN,EACfO,YAAAA,OAAc,IAAHD,GAAOA,EAClBE,EAAUR,EAAVQ,WAAUC,EAAAT,EACVU,iBAAAA,OAAmBC,IAAHF,EAAGE,EAAkBF,EACrCG,EAAgBZ,EAAhBY,iBACAC,EAAQb,EAARa,SAAQC,EAAAd,EACRe,kBAAAA,OAAoBC,IAAHF,EAAGE,EAAmBF,EACvCG,EAASjB,EAATiB,UAEMC,EAAQC,EAAWC,GACnBC,EAAcC,GAAQ,WAC1B,OAAOJ,IAAUK,EAAaC,SAAW,yBAA2B,kBACtE,GAAG,CAACN,IAEJ,OACEO,EAAAC,cAACC,EAAmB,CAACzB,MAAOA,EAAOC,eAAgBA,EAAgBF,GAAIA,GACpEI,EAAWoB,EAAAC,cAAA,OAAA,KAAOrB,GAAmB,KACtCoB,EAAAC,cAAA,MAAA,CAAKE,UAAWC,EAAGC,EAAOC,UACvBxB,EAAc,KACbkB,EAAAC,cAACM,EACC,CAAAC,KAAK,WACLf,MAAOG,EACPO,UAAWE,EAAOI,QAClBC,KAAK,QACLC,QAASnB,gBACIoB,EAAUC,EAAuBC,0BAE7CxB,GAGJP,EAAa,KACZiB,EAACC,cAAAM,GACCC,KAAK,UACLf,MAAOG,EACPc,KAAK,QACLC,QAASvB,EACI,cAAAwB,EAAUC,EAAuBE,wBAC9CC,SAAU7B,GAETF,IAMb"}
+{"version":3,"file":"TipseenContent.js","sources":["../../../../../src/components/Tipseen/TipseenContent.tsx"],"sourcesContent":["import React, { type FC, useContext, useMemo } from \"react\";\nimport cx from \"classnames\";\nimport { DISMISS_BUTTON_TEXT, SUBMIT_BUTTON_TEXT, TipseenColor } from \"./TipseenConstants\";\nimport TipseenBasicContent from \"./TipseenBasicContent\";\nimport { type VibeComponentProps } from \"../../types\";\nimport { type ElementContent } from \"../../types/ElementContent\";\nimport styles from \"./TipseenContent.module.scss\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../tests/constants\";\nimport { TipseenContext } from \"./Tipseen\";\nimport { Button } from \"@vibe/button\";\nimport { type SubIcon } from \"@vibe/icon\";\n\nexport interface TipseenContentProps extends VibeComponentProps {\n  /**\n   * The title text displayed in the Tipseen content.\n   */\n  title?: string;\n  /**\n   * Class name applied to the Tipseen title.\n   */\n  titleClassName?: string;\n  /**\n   * If true, hides the dismiss button.\n   */\n  hideDismiss?: boolean;\n  /**\n   * The content inside the Tipseen.\n   */\n  children?: ElementContent;\n  /**\n   * If true, hides the submit button.\n   */\n  hideSubmit?: boolean;\n  /**\n   * The text displayed on the submit button.\n   */\n  submitButtonText?: string;\n  /**\n   * Icon to display in the submit button\n   */\n  submitButtonIcon?: SubIcon;\n  /**\n   * Callback fired when the submit button is clicked.\n   */\n  onSubmit?: (event: React.MouseEvent) => void;\n  /**\n   * The text displayed on the dismiss button.\n   */\n  dismissButtonText?: string;\n  /**\n   * Callback fired when the dismiss button is clicked.\n   */\n  onDismiss?: (event: React.MouseEvent) => void;\n}\n\nconst TipseenContent: FC<TipseenContentProps> = ({\n  id,\n  title,\n  titleClassName,\n  children = null,\n  hideDismiss = true,\n  hideSubmit,\n  submitButtonText = SUBMIT_BUTTON_TEXT,\n  submitButtonIcon,\n  onSubmit,\n  dismissButtonText = DISMISS_BUTTON_TEXT,\n  onDismiss\n}) => {\n  const color = useContext(TipseenContext);\n  const buttonColor = useMemo(() => {\n    return color === TipseenColor.INVERTED ? \"on-inverted-background\" : \"on-primary-color\";\n  }, [color]);\n\n  return (\n    <TipseenBasicContent title={title} titleClassName={titleClassName} id={id}>\n      {children ? <span>{children}</span> : null}\n      <div className={cx(styles.buttons)}>\n        {hideDismiss ? null : (\n          <Button\n            kind=\"tertiary\"\n            color={buttonColor}\n            className={styles.dismiss}\n            size=\"small\"\n            onClick={onDismiss}\n            data-testid={getTestId(ComponentDefaultTestId.TIPSEEN_CONTENT_DISMISS)}\n          >\n            {dismissButtonText}\n          </Button>\n        )}\n        {hideSubmit ? null : (\n          <Button\n            kind=\"primary\"\n            color={buttonColor}\n            size=\"small\"\n            onClick={onSubmit}\n            data-testid={getTestId(ComponentDefaultTestId.TIPSEEN_CONTENT_SUBMIT)}\n            leftIcon={submitButtonIcon}\n          >\n            {submitButtonText}\n          </Button>\n        )}\n      </div>\n    </TipseenBasicContent>\n  );\n};\n\nexport default TipseenContent;\n"],"names":["TipseenContent","_ref","id","title","titleClassName","_ref$children","children","_ref$hideDismiss","hideDismiss","hideSubmit","_ref$submitButtonText","submitButtonText","SUBMIT_BUTTON_TEXT","submitButtonIcon","onSubmit","_ref$dismissButtonTex","dismissButtonText","DISMISS_BUTTON_TEXT","onDismiss","color","useContext","TipseenContext","buttonColor","useMemo","TipseenColor","INVERTED","React","createElement","TipseenBasicContent","className","cx","styles","buttons","Button","kind","dismiss","size","onClick","getTestId","ComponentDefaultTestId","TIPSEEN_CONTENT_DISMISS","TIPSEEN_CONTENT_SUBMIT","leftIcon"],"mappings":"6eAwDA,IAAMA,EAA0C,SAA5BC,GAYf,IAXHC,EAAED,EAAFC,GACAC,EAAKF,EAALE,MACAC,EAAcH,EAAdG,eAAcC,EAAAJ,EACdK,SAAAA,OAAW,IAAHD,EAAG,KAAIA,EAAAE,EAAAN,EACfO,YAAAA,OAAc,IAAHD,GAAOA,EAClBE,EAAUR,EAAVQ,WAAUC,EAAAT,EACVU,iBAAAA,OAAmBC,IAAHF,EAAGE,EAAkBF,EACrCG,EAAgBZ,EAAhBY,iBACAC,EAAQb,EAARa,SAAQC,EAAAd,EACRe,kBAAAA,OAAoBC,IAAHF,EAAGE,EAAmBF,EACvCG,EAASjB,EAATiB,UAEMC,EAAQC,EAAWC,GACnBC,EAAcC,GAAQ,WAC1B,OAAOJ,IAAUK,EAAaC,SAAW,yBAA2B,kBACtE,GAAG,CAACN,IAEJ,OACEO,EAAAC,cAACC,EAAmB,CAACzB,MAAOA,EAAOC,eAAgBA,EAAgBF,GAAIA,GACpEI,EAAWoB,EAAAC,cAAA,OAAA,KAAOrB,GAAmB,KACtCoB,EAAAC,cAAA,MAAA,CAAKE,UAAWC,EAAGC,EAAOC,UACvBxB,EAAc,KACbkB,EAAAC,cAACM,EACC,CAAAC,KAAK,WACLf,MAAOG,EACPO,UAAWE,EAAOI,QAClBC,KAAK,QACLC,QAASnB,gBACIoB,EAAUC,EAAuBC,0BAE7CxB,GAGJP,EAAa,KACZiB,EAACC,cAAAM,GACCC,KAAK,UACLf,MAAOG,EACPc,KAAK,QACLC,QAASvB,EACI,cAAAwB,EAAUC,EAAuBE,wBAC9CC,SAAU7B,GAETF,IAMb"}