npm - @vibe/core - Versions diffs - 3.62.0 → 3.62.1-alpha-ab54f.0 - Mend

@vibe/core 3.62.0 → 3.62.1-alpha-ab54f.0

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

Files changed (604) hide show

package/dist/src/components/MultiStepIndicator/components/StepIndicator/StepIndicator.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"StepIndicator.js","sources":["../../../../../../src/components/MultiStepIndicator/components/StepIndicator/StepIndicator.tsx"],"sourcesContent":["import { camelCase } from \"lodash-es\";\nimport { getStyle } from \"../../../../helpers/typesciptCssModulesHelper\";\nimport { ComponentDefaultTestId, getTestId } from \"../../../../tests/test-ids-utils\";\nimport cx from \"classnames\";\nimport { keyCodes } from \"../../../../constants/keyCodes\";\nimport React, { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { CSSTransition, SwitchTransition } from \"react-transition-group\";\nimport useEventListener from \"../../../../hooks/useEventListener\";\nimport useKeyEvent from \"../../../../hooks/useKeyEvent\";\nimport Icon from \"../../../../components/Icon/Icon\";\nimport { Check } from \"@vibe/icons\";\nimport Divider from \"../../../../components/Divider/Divider\";\nimport { NOOP } from \"../../../../utils/function-utils\";\nimport HiddenText from \"../../../../components/HiddenText/HiddenText\";\nimport Clickable from \"../../../../components/Clickable/Clickable\";\nimport { type MultiStepSize, type MultiStepType, type StepStatus } from \"../../MultiStep.types\";\nimport styles from \"./StepIndicator.module.scss\";\nimport classNames from \"classnames\";\nimport { type SubIcon, type VibeComponentProps } from \"../../../../types\";\n\nconst KEYS = [keyCodes.ENTER, keyCodes.SPACE];\n\nexport interface StepCircleDisplayProps {\n /*\n The status of the step.\n /\n status: StepStatus;\n /\n If true, displays the step number instead of the fulfilled step icon.\n /\n isFulfilledStepDisplayNumber: boolean;\n /\n The icon displayed when the step is fulfilled.\n /\n fulfilledStepIcon: SubIcon;\n /\n The type of icon used.\n /\n fulfilledStepIconType: \"svg\" \| \"font\";\n /\n The step number in the sequence.\n /\n stepNumber: number;\n}\n\nconst StepCircleDisplay: React.FC<StepCircleDisplayProps> = ({\n status,\n isFulfilledStepDisplayNumber,\n fulfilledStepIcon,\n fulfilledStepIconType,\n stepNumber\n}) => {\n return status === \"fulfilled\" && !isFulfilledStepDisplayNumber ? (\n <Icon\n icon={fulfilledStepIcon}\n className={classNames(styles.numberContainerTextCheckIcon)}\n iconType={fulfilledStepIconType}\n ignoreFocusStyle\n ariaHidden={true}\n />\n ) : (\n <>{stepNumber}</>\n );\n};\n\nexport interface StepIndicatorProps extends VibeComponentProps {\n /\n The status of the step.\n /\n status: StepStatus;\n /\n The main title text for the step.\n /\n titleText: string;\n /\n The subtitle text for the step.\n /\n subtitleText?: string;\n /\n The number of the step in the sequence.\n /\n stepNumber?: number;\n /\n Class name applied to the step component.\n /\n stepComponentClassName?: string;\n /\n The visual style of the step indicator.\n /\n type?: MultiStepType;\n /\n The icon used for a fulfilled step.\n /\n fulfilledStepIcon?: SubIcon;\n /\n The type of icon used.\n /\n fulfilledStepIconType?: \"svg\" \| \"font\";\n /\n If true, displays the step number instead of the fulfilled step icon.\n /\n isFulfilledStepDisplayNumber?: boolean;\n /\n Callback fired when the step is clicked.\n /\n onClick?: (stepNumber: number) => void;\n /\n If true, adds a divider after the step.\n /\n isFollowedByDivider?: boolean;\n /\n Class name applied to the step divider.\n /\n stepDividerClassName?: string;\n /\n If true, the step indicator is displayed vertically.\n /\n isVertical?: boolean;\n /\n The size of the step indicator.\n /\n size?: MultiStepSize;\n}\n\nconst StepIndicator: React.FC<StepIndicatorProps> = ({\n stepComponentClassName,\n stepNumber = 1,\n status = \"pending\",\n titleText = \"Heading text\",\n subtitleText = \"Subtitle text\",\n type = \"primary\",\n fulfilledStepIcon = Check,\n fulfilledStepIconType = \"svg\",\n isFulfilledStepDisplayNumber = false,\n onClick = NOOP,\n isFollowedByDivider = false,\n stepDividerClassName,\n isVertical = false,\n id,\n size = \"regular\",\n \"data-testid\": dataTestId\n}: StepIndicatorProps) => {\n // Animations state\n const [statusChangeAnimationState, setStatusChangeAnimationState] = useState(false);\n\n // Refs\n const componentRef = useRef(null);\n const prevStatusRef = useRef(status);\n\n // Callbacks for modifying animation state\n const enableStatusChangeAnimation = useCallback(() => {\n setStatusChangeAnimationState(true);\n }, [setStatusChangeAnimationState]);\n\n const disableStatusChangeAnimation = useCallback(() => {\n setStatusChangeAnimationState(false);\n }, [setStatusChangeAnimationState]);\n\n const isStatusTransition = useCallback(() => prevStatusRef.current !== status, [prevStatusRef, status]);\n\n const handleClick = useCallback(() => {\n if (onClick) onClick(stepNumber);\n }, [onClick, stepNumber]);\n\n // Event listeners for removing animation.\n useEventListener({\n eventName: \"animationend\",\n callback: disableStatusChangeAnimation,\n ref: componentRef\n });\n\n useKeyEvent({\n keys: KEYS,\n callback: handleClick,\n ref: componentRef\n });\n\n // Effect - triggering animation when necessary.\n useEffect(() => {\n if (isStatusTransition()) {\n enableStatusChangeAnimation();\n }\n }, [status, isStatusTransition, enableStatusChangeAnimation]);\n\n // Effect - updating previous status ref value (for animation) after component update.\n useEffect(() => {\n prevStatusRef.current = status;\n }, [status]);\n\n const ariaLabel = useMemo(() => {\n return `Step ${stepNumber}: ${titleText} - ${subtitleText}, status: ${status}`;\n }, [status, titleText, stepNumber, subtitleText]);\n\n const getClassNamesWithSuffix = (suffix: string) => {\n return [\n getStyle(styles, camelCase(suffix \|\| \"indicator\")),\n getStyle(styles, camelCase(`type-${type}${suffix}`)),\n getStyle(styles, camelCase(`status-${status}${suffix}`)),\n getStyle(styles, camelCase(`size-${size}${suffix}`))\n ];\n };\n\n return (\n <Clickable\n tabIndex=\"-1\"\n elementType=\"li\"\n className={cx(...getClassNamesWithSuffix(\"\"), stepComponentClassName, {\n [styles.withAnimation]: statusChangeAnimationState,\n [styles.clickable]: onClick,\n [styles.textPlacementVertical]: isVertical\n })}\n aria-label={ariaLabel}\n onClick={handleClick}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.STEP_INDICATOR, id)}\n >\n <div className={cx(...getClassNamesWithSuffix(\"__number-divider-container\"))}>\n <div\n className={cx(...getClassNamesWithSuffix(\"__number-container\"))}\n ref={componentRef}\n tabIndex={0}\n role=\"button\"\n >\n <SwitchTransition mode=\"out-in\">\n <CSSTransition<undefined>\n // CSSTransition needs to be specified with the generic parameter to decide type for addEndListener's callback\n // otherwise, addEndListener cb has only `done` param (ts error)\n classNames={{\n enter: styles.swapEnter,\n enterActive: styles.swapEnterActive,\n exit: styles.swapExit,\n exitActive: styles.swapExitActive\n }}\n addEndListener={(node: HTMLElement, done: () => void) => {\n node.addEventListener(\"transitionend\", done, false);\n }}\n key={status}\n >\n <span className={cx(...getClassNamesWithSuffix(\"__number-container__text\"))}>\n <StepCircleDisplay\n fulfilledStepIcon={fulfilledStepIcon}\n fulfilledStepIconType={fulfilledStepIconType}\n isFulfilledStepDisplayNumber={isFulfilledStepDisplayNumber}\n stepNumber={stepNumber}\n status={status}\n />\n </span>\n </CSSTransition>\n </SwitchTransition>\n </div>\n {isFollowedByDivider && isVertical && <Divider className={cx(styles.divider, stepDividerClassName)} />}\n </div>\n <div className={cx(...getClassNamesWithSuffix(\"__text-container\"))}>\n <div className={cx(...getClassNamesWithSuffix(\"__text-container__title\"))}>\n <HiddenText text={status} /> {/ for accessibility */}\n <span className={cx(...getClassNamesWithSuffix(\"__text-container__title__text\"))}>{titleText}</span>\n </div>\n {size !== \"compact\" ? (\n <span className={cx(...getClassNamesWithSuffix(\"__text-container__subtitle__text\"))}>{subtitleText}</span>\n ) : null}\n </div>\n </Clickable>\n );\n};\n\nexport default StepIndicator;\n"],"names":["KEYS","keyCodes","ENTER","SPACE","StepCircleDisplay","_ref","fulfilledStepIcon","fulfilledStepIconType","status","isFulfilledStepDisplayNumber","React","createElement","Fragment","stepNumber","Icon","icon","className","classNames","styles","numberContainerTextCheckIcon","iconType","ignoreFocusStyle","ariaHidden","StepIndicator","_ref2","stepComponentClassName","_ref2$stepNumber","_ref2$status","_ref2$titleText","titleText","_ref2$subtitleText","subtitleText","_ref2$type","type","_ref2$fulfilledStepIc","Check","_ref2$fulfilledStepIc2","_ref2$isFulfilledStep","_ref2$onClick","onClick","NOOP","_ref2$isFollowedByDiv","isFollowedByDivider","stepDividerClassName","_ref2$isVertical","isVertical","id","_ref2$size","size","dataTestId","_useState","useState","_useState2","_slicedToArray","statusChangeAnimationState","setStatusChangeAnimationState","componentRef","useRef","prevStatusRef","enableStatusChangeAnimation","useCallback","disableStatusChangeAnimation","isStatusTransition","current","handleClick","useEventListener","eventName","callback","ref","useKeyEvent","keys","useEffect","ariaLabel","useMemo","concat","getClassNamesWithSuffix","suffix","getStyle","camelCase","Clickable","tabIndex","elementType","cx","apply","_toConsumableArray","_defineProperty","withAnimation","clickable","textPlacementVertical","getTestId","ComponentDefaultTestId","STEP_INDICATOR","role","SwitchTransition","mode","CSSTransition","enter","swapEnter","enterActive","swapEnterActive","exit","swapExit","exitActive","swapExitActive","addEndListener","node","done","addEventListener","key","Divider","divider","HiddenText","text"],"mappings":"0gCAoBA,IAAMA,EAAO,CAACC,EAASC,MAAOD,EAASE,OAyBjCC,EAAsD,SAArCC,GAMlB,IAHHC,EAAiBD,EAAjBC,kBACAC,EAAqBF,EAArBE,sBAGA,MAAkB,cANZF,EAANG,QAC4BH,EAA5BI,6BAcEC,EAAGC,cAAAD,EAAAE,SAAA,KAXKP,EAAVQ,YAGEH,gBAACI,EAAI,CACHC,KAAMT,EACNU,UAAWC,EAAWC,EAAOC,8BAC7BC,SAAUb,EACVc,oBACAC,YAAY,GAKlB,EA6DMC,EAA8C,SAAjCC,GAiBM,IAhBvBC,EAAsBD,EAAtBC,uBAAsBC,EAAAF,EACtBX,WAAAA,OAAa,IAAHa,EAAG,EAACA,EAAAC,EAAAH,EACdhB,OAAAA,OAAS,IAAHmB,EAAG,UAASA,EAAAC,EAAAJ,EAClBK,UAAAA,OAAY,IAAHD,EAAG,eAAcA,EAAAE,EAAAN,EAC1BO,aAAAA,OAAe,IAAHD,EAAG,gBAAeA,EAAAE,EAAAR,EAC9BS,KAAAA,OAAO,IAAHD,EAAG,UAASA,EAAAE,EAAAV,EAChBlB,kBAAAA,OAAoB6B,IAAHD,EAAGC,EAAKD,EAAAE,EAAAZ,EACzBjB,sBAAAA,OAAwB,IAAH6B,EAAG,MAAKA,EAAAC,EAAAb,EAC7Bf,6BAAAA,OAA+B,IAAH4B,GAAQA,EAAAC,EAAAd,EACpCe,QAAAA,OAAUC,IAAHF,EAAGE,EAAIF,EAAAG,EAAAjB,EACdkB,oBAAAA,OAAsB,IAAHD,GAAQA,EAC3BE,EAAoBnB,EAApBmB,qBAAoBC,EAAApB,EACpBqB,WAAAA,OAAa,IAAHD,GAAQA,EAClBE,EAAEtB,EAAFsB,GAAEC,EAAAvB,EACFwB,KAAAA,OAAO,IAAHD,EAAG,UAASA,EACDE,GAAUzB,EAAzB,eAGA0B,GAAoEC,GAAS,GAAMC,GAAAC,EAAAH,GAAA,GAA5EI,GAA0BF,GAAA,GAAEG,GAA6BH,GAAA,GAG1DI,GAAeC,EAAO,MACtBC,GAAgBD,EAAOjD,GAGvBmD,GAA8BC,GAAY,WAC9CL,IAA8B,EAChC,GAAG,CAACA,KAEEM,GAA+BD,GAAY,WAC/CL,IAA8B,EAChC,GAAG,CAACA,KAEEO,GAAqBF,GAAY,WAAA,OAAMF,GAAcK,UAAYvD,CAAM,GAAE,CAACkD,GAAelD,IAEzFwD,GAAcJ,GAAY,WAC1BrB,GAASA,EAAQ1B,EACvB,GAAG,CAAC0B,EAAS1B,IAGboD,EAAiB,CACfC,UAAW,eACXC,SAAUN,GACVO,IAAKZ,KAGPa,EAAY,CACVC,KAAMtE,EACNmE,SAAUH,GACVI,IAAKZ,KAIPe,GAAU,WACJT,MACFH,IAEH,GAAE,CAACnD,EAAQsD,GAAoBH,KAGhCY,GAAU,WACRb,GAAcK,QAAUvD,CAC1B,GAAG,CAACA,IAEJ,IAAMgE,GAAYC,GAAQ,WACxB,MAAA,QAAAC,OAAe7D,EAAU,MAAA6D,OAAK7C,EAAS6C,OAAAA,OAAM3C,EAAY2C,cAAAA,OAAalE,EACvE,GAAE,CAACA,EAAQqB,EAAWhB,EAAYkB,IAE7B4C,GAA0B,SAACC,GAC/B,MAAO,CACLC,EAAS3D,EAAQ4D,EAAUF,GAAU,cACrCC,EAAS3D,EAAQ4D,EAASJ,QAAAA,OAASzC,GAAIyC,OAAGE,KAC1CC,EAAS3D,EAAQ4D,EAASJ,UAAAA,OAAWlE,GAAMkE,OAAGE,KAC9CC,EAAS3D,EAAQ4D,EAASJ,QAAAA,OAAS1B,GAAI0B,OAAGE,OAI9C,OACElE,gBAACqE,EAAS,CACRC,SAAS,KACTC,YAAY,KACZjE,UAAWkE,EAAEC,WAAAC,EAAAA,EAAIT,GAAwB,KAAGD,OAAA,CAAEjD,EAAsB4D,EAAAA,EAAAA,EAAA,CAAA,EACjEnE,EAAOoE,cAAgBhC,IACvBpC,EAAOqE,UAAYhD,GACnBrB,EAAOsE,sBAAwB3C,mBAEtB2B,GACZjC,QAASyB,GACI,cAAAf,IAAcwC,EAAUC,EAAuBC,eAAgB7C,IAE5EpC,EAAKC,cAAA,MAAA,CAAAK,UAAWkE,EAAEC,WAAA,EAAAC,EAAIT,GAAwB,iCAC5CjE,EACEC,cAAA,MAAA,CAAAK,UAAWkE,EAAEC,WAAA,EAAAC,EAAIT,GAAwB,wBACzCP,IAAKZ,GACLwB,SAAU,EACVY,KAAK,UAELlF,EAAAC,cAACkF,EAAgB,CAACC,KAAK,UACrBpF,EAAAC,cAACoF,EAAa,CAGZ9E,WAAY,CACV+E,MAAO9E,EAAO+E,UACdC,YAAahF,EAAOiF,gBACpBC,KAAMlF,EAAOmF,SACbC,WAAYpF,EAAOqF,gBAErBC,eAAgB,SAACC,EAAmBC,GAClCD,EAAKE,iBAAiB,gBAAiBD,GAAM,EAC9C,EACDE,IAAKpG,GAELE,EAAMC,cAAA,OAAA,CAAAK,UAAWkE,EAAEC,WAAA,EAAAC,EAAIT,GAAwB,+BAC7CjE,EAACC,cAAAP,EACC,CAAAE,kBAAmBA,EACnBC,sBAAuBA,EACvBE,6BAA8BA,EAC9BI,WAAYA,EACZL,OAAQA,QAMjBkC,GAAuBG,GAAcnC,EAACC,cAAAkG,GAAQ7F,UAAWkE,EAAGhE,EAAO4F,QAASnE,MAE/EjC,EAAKC,cAAA,MAAA,CAAAK,UAAWkE,EAAEC,WAAA,EAAAC,EAAIT,GAAwB,uBAC5CjE,EAAKC,cAAA,MAAA,CAAAK,UAAWkE,EAAEC,WAAA,EAAAC,EAAIT,GAAwB,8BAC5CjE,EAAAC,cAACoG,EAAU,CAACC,KAAMxG,QAClBE,EAAAC,cAAA,OAAA,CAAMK,UAAWkE,EAAEC,WAAA,EAAAC,EAAIT,GAAwB,oCAAoC9C,IAE3E,YAATmB,EACCtC,EAAMC,cAAA,OAAA,CAAAK,UAAWkE,EAAEC,WAAA,EAAAC,EAAIT,GAAwB,uCAAuC5C,GACpF,MAIZ"}
1	+ {"version":3,"file":"StepIndicator.js","sources":["../../../../../../src/components/MultiStepIndicator/components/StepIndicator/StepIndicator.tsx"],"sourcesContent":["import { camelCase } from \"es-toolkit\";\nimport { getStyle } from \"../../../../helpers/typesciptCssModulesHelper\";\nimport { ComponentDefaultTestId, getTestId } from \"../../../../tests/test-ids-utils\";\nimport cx from \"classnames\";\nimport { keyCodes } from \"../../../../constants/keyCodes\";\nimport React, { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { CSSTransition, SwitchTransition } from \"react-transition-group\";\nimport useEventListener from \"../../../../hooks/useEventListener\";\nimport useKeyEvent from \"../../../../hooks/useKeyEvent\";\nimport Icon from \"../../../../components/Icon/Icon\";\nimport { Check } from \"@vibe/icons\";\nimport Divider from \"../../../../components/Divider/Divider\";\nimport { NOOP } from \"../../../../utils/function-utils\";\nimport HiddenText from \"../../../../components/HiddenText/HiddenText\";\nimport Clickable from \"../../../../components/Clickable/Clickable\";\nimport { type MultiStepSize, type MultiStepType, type StepStatus } from \"../../MultiStep.types\";\nimport styles from \"./StepIndicator.module.scss\";\nimport classNames from \"classnames\";\nimport { type SubIcon, type VibeComponentProps } from \"../../../../types\";\n\nconst KEYS = [keyCodes.ENTER, keyCodes.SPACE];\n\nexport interface StepCircleDisplayProps {\n /*\n The status of the step.\n /\n status: StepStatus;\n /\n If true, displays the step number instead of the fulfilled step icon.\n /\n isFulfilledStepDisplayNumber: boolean;\n /\n The icon displayed when the step is fulfilled.\n /\n fulfilledStepIcon: SubIcon;\n /\n The type of icon used.\n /\n fulfilledStepIconType: \"svg\" \| \"font\";\n /\n The step number in the sequence.\n /\n stepNumber: number;\n}\n\nconst StepCircleDisplay: React.FC<StepCircleDisplayProps> = ({\n status,\n isFulfilledStepDisplayNumber,\n fulfilledStepIcon,\n fulfilledStepIconType,\n stepNumber\n}) => {\n return status === \"fulfilled\" && !isFulfilledStepDisplayNumber ? (\n <Icon\n icon={fulfilledStepIcon}\n className={classNames(styles.numberContainerTextCheckIcon)}\n iconType={fulfilledStepIconType}\n ignoreFocusStyle\n ariaHidden={true}\n />\n ) : (\n <>{stepNumber}</>\n );\n};\n\nexport interface StepIndicatorProps extends VibeComponentProps {\n /\n The status of the step.\n /\n status: StepStatus;\n /\n The main title text for the step.\n /\n titleText: string;\n /\n The subtitle text for the step.\n /\n subtitleText?: string;\n /\n The number of the step in the sequence.\n /\n stepNumber?: number;\n /\n Class name applied to the step component.\n /\n stepComponentClassName?: string;\n /\n The visual style of the step indicator.\n /\n type?: MultiStepType;\n /\n The icon used for a fulfilled step.\n /\n fulfilledStepIcon?: SubIcon;\n /\n The type of icon used.\n /\n fulfilledStepIconType?: \"svg\" \| \"font\";\n /\n If true, displays the step number instead of the fulfilled step icon.\n /\n isFulfilledStepDisplayNumber?: boolean;\n /\n Callback fired when the step is clicked.\n /\n onClick?: (stepNumber: number) => void;\n /\n If true, adds a divider after the step.\n /\n isFollowedByDivider?: boolean;\n /\n Class name applied to the step divider.\n /\n stepDividerClassName?: string;\n /\n If true, the step indicator is displayed vertically.\n /\n isVertical?: boolean;\n /\n The size of the step indicator.\n /\n size?: MultiStepSize;\n}\n\nconst StepIndicator: React.FC<StepIndicatorProps> = ({\n stepComponentClassName,\n stepNumber = 1,\n status = \"pending\",\n titleText = \"Heading text\",\n subtitleText = \"Subtitle text\",\n type = \"primary\",\n fulfilledStepIcon = Check,\n fulfilledStepIconType = \"svg\",\n isFulfilledStepDisplayNumber = false,\n onClick = NOOP,\n isFollowedByDivider = false,\n stepDividerClassName,\n isVertical = false,\n id,\n size = \"regular\",\n \"data-testid\": dataTestId\n}: StepIndicatorProps) => {\n // Animations state\n const [statusChangeAnimationState, setStatusChangeAnimationState] = useState(false);\n\n // Refs\n const componentRef = useRef(null);\n const prevStatusRef = useRef(status);\n\n // Callbacks for modifying animation state\n const enableStatusChangeAnimation = useCallback(() => {\n setStatusChangeAnimationState(true);\n }, [setStatusChangeAnimationState]);\n\n const disableStatusChangeAnimation = useCallback(() => {\n setStatusChangeAnimationState(false);\n }, [setStatusChangeAnimationState]);\n\n const isStatusTransition = useCallback(() => prevStatusRef.current !== status, [prevStatusRef, status]);\n\n const handleClick = useCallback(() => {\n if (onClick) onClick(stepNumber);\n }, [onClick, stepNumber]);\n\n // Event listeners for removing animation.\n useEventListener({\n eventName: \"animationend\",\n callback: disableStatusChangeAnimation,\n ref: componentRef\n });\n\n useKeyEvent({\n keys: KEYS,\n callback: handleClick,\n ref: componentRef\n });\n\n // Effect - triggering animation when necessary.\n useEffect(() => {\n if (isStatusTransition()) {\n enableStatusChangeAnimation();\n }\n }, [status, isStatusTransition, enableStatusChangeAnimation]);\n\n // Effect - updating previous status ref value (for animation) after component update.\n useEffect(() => {\n prevStatusRef.current = status;\n }, [status]);\n\n const ariaLabel = useMemo(() => {\n return `Step ${stepNumber}: ${titleText} - ${subtitleText}, status: ${status}`;\n }, [status, titleText, stepNumber, subtitleText]);\n\n const getClassNamesWithSuffix = (suffix: string) => {\n return [\n getStyle(styles, camelCase(suffix \|\| \"indicator\")),\n getStyle(styles, camelCase(`type-${type}${suffix}`)),\n getStyle(styles, camelCase(`status-${status}${suffix}`)),\n getStyle(styles, camelCase(`size-${size}${suffix}`))\n ];\n };\n\n return (\n <Clickable\n tabIndex=\"-1\"\n elementType=\"li\"\n className={cx(...getClassNamesWithSuffix(\"\"), stepComponentClassName, {\n [styles.withAnimation]: statusChangeAnimationState,\n [styles.clickable]: onClick,\n [styles.textPlacementVertical]: isVertical\n })}\n aria-label={ariaLabel}\n onClick={handleClick}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.STEP_INDICATOR, id)}\n >\n <div className={cx(...getClassNamesWithSuffix(\"__number-divider-container\"))}>\n <div\n className={cx(...getClassNamesWithSuffix(\"__number-container\"))}\n ref={componentRef}\n tabIndex={0}\n role=\"button\"\n >\n <SwitchTransition mode=\"out-in\">\n <CSSTransition<undefined>\n // CSSTransition needs to be specified with the generic parameter to decide type for addEndListener's callback\n // otherwise, addEndListener cb has only `done` param (ts error)\n classNames={{\n enter: styles.swapEnter,\n enterActive: styles.swapEnterActive,\n exit: styles.swapExit,\n exitActive: styles.swapExitActive\n }}\n addEndListener={(node: HTMLElement, done: () => void) => {\n node.addEventListener(\"transitionend\", done, false);\n }}\n key={status}\n >\n <span className={cx(...getClassNamesWithSuffix(\"__number-container__text\"))}>\n <StepCircleDisplay\n fulfilledStepIcon={fulfilledStepIcon}\n fulfilledStepIconType={fulfilledStepIconType}\n isFulfilledStepDisplayNumber={isFulfilledStepDisplayNumber}\n stepNumber={stepNumber}\n status={status}\n />\n </span>\n </CSSTransition>\n </SwitchTransition>\n </div>\n {isFollowedByDivider && isVertical && <Divider className={cx(styles.divider, stepDividerClassName)} />}\n </div>\n <div className={cx(...getClassNamesWithSuffix(\"__text-container\"))}>\n <div className={cx(...getClassNamesWithSuffix(\"__text-container__title\"))}>\n <HiddenText text={status} /> {/ for accessibility */}\n <span className={cx(...getClassNamesWithSuffix(\"__text-container__title__text\"))}>{titleText}</span>\n </div>\n {size !== \"compact\" ? (\n <span className={cx(...getClassNamesWithSuffix(\"__text-container__subtitle__text\"))}>{subtitleText}</span>\n ) : null}\n </div>\n </Clickable>\n );\n};\n\nexport default StepIndicator;\n"],"names":["KEYS","keyCodes","ENTER","SPACE","StepCircleDisplay","_ref","fulfilledStepIcon","fulfilledStepIconType","status","isFulfilledStepDisplayNumber","React","createElement","Fragment","stepNumber","Icon","icon","className","classNames","styles","numberContainerTextCheckIcon","iconType","ignoreFocusStyle","ariaHidden","StepIndicator","_ref2","stepComponentClassName","_ref2$stepNumber","_ref2$status","_ref2$titleText","titleText","_ref2$subtitleText","subtitleText","_ref2$type","type","_ref2$fulfilledStepIc","Check","_ref2$fulfilledStepIc2","_ref2$isFulfilledStep","_ref2$onClick","onClick","NOOP","_ref2$isFollowedByDiv","isFollowedByDivider","stepDividerClassName","_ref2$isVertical","isVertical","id","_ref2$size","size","dataTestId","_useState","useState","_useState2","_slicedToArray","statusChangeAnimationState","setStatusChangeAnimationState","componentRef","useRef","prevStatusRef","enableStatusChangeAnimation","useCallback","disableStatusChangeAnimation","isStatusTransition","current","handleClick","useEventListener","eventName","callback","ref","useKeyEvent","keys","useEffect","ariaLabel","useMemo","concat","getClassNamesWithSuffix","suffix","getStyle","camelCase","Clickable","tabIndex","elementType","cx","apply","_toConsumableArray","_defineProperty","withAnimation","clickable","textPlacementVertical","getTestId","ComponentDefaultTestId","STEP_INDICATOR","role","SwitchTransition","mode","CSSTransition","enter","swapEnter","enterActive","swapEnterActive","exit","swapExit","exitActive","swapExitActive","addEndListener","node","done","addEventListener","key","Divider","divider","HiddenText","text"],"mappings":"2gCAoBA,IAAMA,EAAO,CAACC,EAASC,MAAOD,EAASE,OAyBjCC,EAAsD,SAArCC,GAMlB,IAHHC,EAAiBD,EAAjBC,kBACAC,EAAqBF,EAArBE,sBAGA,MAAkB,cANZF,EAANG,QAC4BH,EAA5BI,6BAcEC,EAAGC,cAAAD,EAAAE,SAAA,KAXKP,EAAVQ,YAGEH,gBAACI,EAAI,CACHC,KAAMT,EACNU,UAAWC,EAAWC,EAAOC,8BAC7BC,SAAUb,EACVc,oBACAC,YAAY,GAKlB,EA6DMC,EAA8C,SAAjCC,GAiBM,IAhBvBC,EAAsBD,EAAtBC,uBAAsBC,EAAAF,EACtBX,WAAAA,OAAa,IAAHa,EAAG,EAACA,EAAAC,EAAAH,EACdhB,OAAAA,OAAS,IAAHmB,EAAG,UAASA,EAAAC,EAAAJ,EAClBK,UAAAA,OAAY,IAAHD,EAAG,eAAcA,EAAAE,EAAAN,EAC1BO,aAAAA,OAAe,IAAHD,EAAG,gBAAeA,EAAAE,EAAAR,EAC9BS,KAAAA,OAAO,IAAHD,EAAG,UAASA,EAAAE,EAAAV,EAChBlB,kBAAAA,OAAoB6B,IAAHD,EAAGC,EAAKD,EAAAE,EAAAZ,EACzBjB,sBAAAA,OAAwB,IAAH6B,EAAG,MAAKA,EAAAC,EAAAb,EAC7Bf,6BAAAA,OAA+B,IAAH4B,GAAQA,EAAAC,EAAAd,EACpCe,QAAAA,OAAUC,IAAHF,EAAGE,EAAIF,EAAAG,EAAAjB,EACdkB,oBAAAA,OAAsB,IAAHD,GAAQA,EAC3BE,EAAoBnB,EAApBmB,qBAAoBC,EAAApB,EACpBqB,WAAAA,OAAa,IAAHD,GAAQA,EAClBE,EAAEtB,EAAFsB,GAAEC,EAAAvB,EACFwB,KAAAA,OAAO,IAAHD,EAAG,UAASA,EACDE,GAAUzB,EAAzB,eAGA0B,GAAoEC,GAAS,GAAMC,GAAAC,EAAAH,GAAA,GAA5EI,GAA0BF,GAAA,GAAEG,GAA6BH,GAAA,GAG1DI,GAAeC,EAAO,MACtBC,GAAgBD,EAAOjD,GAGvBmD,GAA8BC,GAAY,WAC9CL,IAA8B,EAChC,GAAG,CAACA,KAEEM,GAA+BD,GAAY,WAC/CL,IAA8B,EAChC,GAAG,CAACA,KAEEO,GAAqBF,GAAY,WAAA,OAAMF,GAAcK,UAAYvD,CAAM,GAAE,CAACkD,GAAelD,IAEzFwD,GAAcJ,GAAY,WAC1BrB,GAASA,EAAQ1B,EACvB,GAAG,CAAC0B,EAAS1B,IAGboD,EAAiB,CACfC,UAAW,eACXC,SAAUN,GACVO,IAAKZ,KAGPa,EAAY,CACVC,KAAMtE,EACNmE,SAAUH,GACVI,IAAKZ,KAIPe,GAAU,WACJT,MACFH,IAEH,GAAE,CAACnD,EAAQsD,GAAoBH,KAGhCY,GAAU,WACRb,GAAcK,QAAUvD,CAC1B,GAAG,CAACA,IAEJ,IAAMgE,GAAYC,GAAQ,WACxB,MAAA,QAAAC,OAAe7D,EAAU,MAAA6D,OAAK7C,EAAS6C,OAAAA,OAAM3C,EAAY2C,cAAAA,OAAalE,EACvE,GAAE,CAACA,EAAQqB,EAAWhB,EAAYkB,IAE7B4C,GAA0B,SAACC,GAC/B,MAAO,CACLC,EAAS3D,EAAQ4D,EAAUF,GAAU,cACrCC,EAAS3D,EAAQ4D,EAASJ,QAAAA,OAASzC,GAAIyC,OAAGE,KAC1CC,EAAS3D,EAAQ4D,EAASJ,UAAAA,OAAWlE,GAAMkE,OAAGE,KAC9CC,EAAS3D,EAAQ4D,EAASJ,QAAAA,OAAS1B,GAAI0B,OAAGE,OAI9C,OACElE,gBAACqE,EAAS,CACRC,SAAS,KACTC,YAAY,KACZjE,UAAWkE,EAAEC,WAAAC,EAAAA,EAAIT,GAAwB,KAAGD,OAAA,CAAEjD,EAAsB4D,EAAAA,EAAAA,EAAA,CAAA,EACjEnE,EAAOoE,cAAgBhC,IACvBpC,EAAOqE,UAAYhD,GACnBrB,EAAOsE,sBAAwB3C,mBAEtB2B,GACZjC,QAASyB,GACI,cAAAf,IAAcwC,EAAUC,EAAuBC,eAAgB7C,IAE5EpC,EAAKC,cAAA,MAAA,CAAAK,UAAWkE,EAAEC,WAAA,EAAAC,EAAIT,GAAwB,iCAC5CjE,EACEC,cAAA,MAAA,CAAAK,UAAWkE,EAAEC,WAAA,EAAAC,EAAIT,GAAwB,wBACzCP,IAAKZ,GACLwB,SAAU,EACVY,KAAK,UAELlF,EAAAC,cAACkF,EAAgB,CAACC,KAAK,UACrBpF,EAAAC,cAACoF,EAAa,CAGZ9E,WAAY,CACV+E,MAAO9E,EAAO+E,UACdC,YAAahF,EAAOiF,gBACpBC,KAAMlF,EAAOmF,SACbC,WAAYpF,EAAOqF,gBAErBC,eAAgB,SAACC,EAAmBC,GAClCD,EAAKE,iBAAiB,gBAAiBD,GAAM,EAC9C,EACDE,IAAKpG,GAELE,EAAMC,cAAA,OAAA,CAAAK,UAAWkE,EAAEC,WAAA,EAAAC,EAAIT,GAAwB,+BAC7CjE,EAACC,cAAAP,EACC,CAAAE,kBAAmBA,EACnBC,sBAAuBA,EACvBE,6BAA8BA,EAC9BI,WAAYA,EACZL,OAAQA,QAMjBkC,GAAuBG,GAAcnC,EAACC,cAAAkG,GAAQ7F,UAAWkE,EAAGhE,EAAO4F,QAASnE,MAE/EjC,EAAKC,cAAA,MAAA,CAAAK,UAAWkE,EAAEC,WAAA,EAAAC,EAAIT,GAAwB,uBAC5CjE,EAAKC,cAAA,MAAA,CAAAK,UAAWkE,EAAEC,WAAA,EAAAC,EAAIT,GAAwB,8BAC5CjE,EAAAC,cAACoG,EAAU,CAACC,KAAMxG,QAClBE,EAAAC,cAAA,OAAA,CAAMK,UAAWkE,EAAEC,WAAA,EAAAC,EAAIT,GAAwB,oCAAoC9C,IAE3E,YAATmB,EACCtC,EAAMC,cAAA,OAAA,CAAAK,UAAWkE,EAAEC,WAAA,EAAAC,EAAIT,GAAwB,uCAAuC5C,GACpF,MAIZ"}

package/dist/src/components/MultiStepIndicator/components/StepIndicator/StepIndicator.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var n={indicator:"indicator_4091cb466e",textContainer:"textContainer_0f9a3f2666",sizeCompactTextContainer:"sizeCompactTextContainer_1949777b9d",textContainerTitle:"textContainerTitle_c9858a42cc",visuallyHidden:"visuallyHidden_31da10edc6",textContainerTitleText:"textContainerTitleText_b937394bb8",textContainerSubtitleText:"textContainerSubtitleText_da0f01a8f6",sizeCompactTextContainerTitle:"sizeCompactTextContainerTitle_c06b69b9d8",textPlacementVertical:"textPlacementVertical_0be16e3760",numberDividerContainer:"numberDividerContainer_d1497f413b",sizeCompactTextContainerTitleText:"sizeCompactTextContainerTitleText_fd5a2794d4",divider:"divider_b32130432e",sizeCompactNumberDividerContainer:"sizeCompactNumberDividerContainer_3b728d22c0",statusActiveNumberDividerContainer:"statusActiveNumberDividerContainer_a5a8fef5cb",clickable:"clickable_4c19f0c00b",withAnimation:"withAnimation_9e245ee501",stepIndicatiorCirclePopElastic:"stepIndicatiorCirclePopElastic_5f8590c2e2",swapEnter:"swapEnter_2fea20c117",swapEnterActive:"swapEnterActive_6547dc15bb",swapExit:"swapExit_c1f50bf5c9",swapExitActive:"swapExitActive_f7864b014e",numberContainer:"numberContainer_19be383d62",numberContainerText:"numberContainerText_9dae17e2d4",numberContainerTextCheckIcon:"numberContainerTextCheckIcon_1b5474ac72",typePrimaryNumberContainer:"typePrimaryNumberContainer_005e57c6f8",typeDangerNumberContainer:"typeDangerNumberContainer_ece14c83f1",typeSuccessNumberContainer:"typeSuccessNumberContainer_b8a259dbbc",typeDarkNumberContainer:"typeDarkNumberContainer_21f25e42b5",statusActiveNumberContainer:"statusActiveNumberContainer_d49e81d00f",sizeCompactNumberContainer:"sizeCompactNumberContainer_e7ab442e43",statusPendingNumberContainer:"statusPendingNumberContainer_c04ea9d845","step-indicatior-circle-pop-elastic":"step-indicatior-circle-pop-elastic_1e729317c4"};!function(n){const e="s_id-f9249b867669_3_61_1";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+e))return;const r=document.createElement("style");r.id=e,t.firstChild?t.insertBefore(r,t.firstChild):t.appendChild(r),r.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}(".indicator_4091cb466e {\n  font: var(--font-text2-normal);\n  color: var(--text-color-on-primary);\n  display: flex;\n  margin: 0;\n  padding: 0;\n  text-indent: 0;\n  list-style-type: none;\n}\n\n.textContainer_0f9a3f2666 {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  margin-left: 16px;\n}\n\n.sizeCompactTextContainer_1949777b9d {\n  margin-left: var(--spacing-small);\n  justify-content: center;\n  align-content: center;\n}\n\n.textContainerTitle_c9858a42cc {\n  width: 100%;\n  margin-bottom: var(--spacing-xs);\n}\n\n.textContainerTitle_c9858a42cc .visuallyHidden_31da10edc6 {\n  display: none;\n}\n\n.textContainerTitleText_b937394bb8 {\n  font: var(--font-text2-medium);\n  color: var(--primary-text-color);\n  margin-bottom: 2px;\n}\n\n.textContainerSubtitleText_da0f01a8f6 {\n  width: 100%;\n  font: var(--font-text2-normal);\n  color: var(--primary-text-color);\n}\n\n.sizeCompactTextContainerTitle_c06b69b9d8 {\n  margin-bottom: 0px;\n}\n\n.textPlacementVertical_0be16e3760 {\n  margin: 8px;\n  flex-direction: column;\n  flex: 1 1 0px;\n}\n\n.textPlacementVertical_0be16e3760 .textContainer_0f9a3f2666 {\n  margin-left: 0;\n  margin-top: var(--spacing-medium);\n}\n\n.textPlacementVertical_0be16e3760 .numberDividerContainer_d1497f413b {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  width: 100%;\n}\n\n.sizeCompactTextContainerTitleText_fd5a2794d4 {\n  display: block;\n  font: var(--font-text2-normal);\n  max-width: 150px;\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  margin-bottom: 0;\n}\n\n.textPlacementVertical_0be16e3760 .numberDividerContainer_d1497f413b .divider_b32130432e {\n  background-color: var(--ui-border-color);\n  margin: 16px 0 16px 16px;\n  height: 1px;\n  flex: 1 1 0;\n}\n\n.sizeCompactNumberDividerContainer_3b728d22c0 {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.sizeCompactNumberDividerContainer_3b728d22c0.statusActiveNumberDividerContainer_a5a8fef5cb {\n  width: 40px;\n}\n\n.indicator_4091cb466e.clickable_4c19f0c00b {\n  cursor: pointer;\n}\n\n.withAnimation_9e245ee501 {\n  animation: stepIndicatiorCirclePopElastic_5f8590c2e2 var(--motion-expressive-short);\n}\n\n/* New state enters */\n\n.swapEnter_2fea20c117 {\n  opacity: 0;\n  transform: translateY(15px);\n}\n\n.swapEnterActive_6547dc15bb {\n  position: relative;\n  opacity: 1;\n  transition: transform var(--motion-productive-long) var(--motion-timing-enter), opacity var(--motion-productive-short);\n  transform: translateY(0);\n}\n\n/* Old state leaves */\n\n.swapExit_c1f50bf5c9 {\n  position: relative;\n  opacity: 1;\n  transform: translateY(0);\n}\n\n.swapExitActive_f7864b014e {\n  position: relative;\n  opacity: 0;\n  transform: translateY(-15px);\n  transition: transform var(--motion-productive-long) var(--motion-timing-enter), opacity var(--motion-productive-short);\n}\n\n.numberContainer_19be383d62 {\n  width: 36px;\n  height: 36px;\n  border-radius: 50%;\n  display: flex;\n}\n\n.numberContainerText_9dae17e2d4 {\n  margin: auto;\n  display: flex;\n  align-items: center;\n}\n\n.numberContainerTextCheckIcon_1b5474ac72 {\n  width: 20px;\n  height: 20px;\n  margin-top: 2px;\n}\n\n.typePrimaryNumberContainer_005e57c6f8 {\n  background-color: var(--primary-color);\n}\n\n.typePrimaryNumberContainer_005e57c6f8:hover {\n  background-color: var(--primary-hover-color);\n}\n\n.typeDangerNumberContainer_ece14c83f1 {\n  background-color: var(--negative-color);\n}\n\n.typeDangerNumberContainer_ece14c83f1:hover {\n  background-color: var(--negative-color-hover);\n}\n\n.typeSuccessNumberContainer_b8a259dbbc {\n  background-color: var(--positive-color);\n}\n\n.typeSuccessNumberContainer_b8a259dbbc:hover {\n  background-color: var(--positive-color-hover);\n}\n\n.typeDarkNumberContainer_21f25e42b5 {\n  background-color: var(--inverted-color-background);\n  color: var(--text-color-on-inverted);\n}\n\n.typeDarkNumberContainer_21f25e42b5:hover {\n  background-color: var(--secondary-text-color);\n}\n\n.statusActiveNumberContainer_d49e81d00f {\n  box-shadow: 0 0 0 4px var(--primary-background-color), 0 0 0 6px var(--primary-color);\n}\n\n.statusActiveNumberContainer_d49e81d00f.typeDangerNumberContainer_ece14c83f1 {\n  box-shadow: 0 0 0 4px var(--primary-background-color), 0 0 0 6px var(--negative-color);\n}\n\n.statusActiveNumberContainer_d49e81d00f.typeSuccessNumberContainer_b8a259dbbc {\n  box-shadow: 0 0 0 4px var(--primary-background-color), 0 0 0 6px var(--positive-color);\n}\n\n.statusActiveNumberContainer_d49e81d00f.typeDarkNumberContainer_21f25e42b5 {\n  box-shadow: 0 0 0 4px var(--primary-background-color), 0 0 0 6px var(--primary-text-color);\n}\n\n.sizeCompactNumberContainer_e7ab442e43 {\n  width: 28px;\n  height: 28px;\n}\n\n.statusPendingNumberContainer_c04ea9d845 {\n  background-color: var(--primary-background-color);\n  color: var(--primary-text-color);\n  border-color: var(--ui-border-color) !important;\n  border: 1px solid;\n}\n\n.statusPendingNumberContainer_c04ea9d845:hover {\n  background-color: var(--primary-color);\n  color: var(--text-color-on-primary);\n  border: none;\n}\n\n.statusPendingNumberContainer_c04ea9d845.typeDangerNumberContainer_ece14c83f1:hover {\n  background-color: var(--negative-color);\n}\n\n.statusPendingNumberContainer_c04ea9d845.typeSuccessNumberContainer_b8a259dbbc:hover {\n  background-color: var(--positive-color);\n}\n\n.statusPendingNumberContainer_c04ea9d845.typeDarkNumberContainer_21f25e42b5:hover {\n  background-color: var(--text-color-on-inverted);\n}\n\n@keyframes step-indicatior-circle-pop-elastic_1e729317c4 {\n  0% {\n    transform: scale(1);\n  }\n  33% {\n    transform: scale(1.2);\n  }\n  66% {\n    transform: scale(0.9);\n  }\n  100% {\n    transform: scale(1);\n  }\n}");export{n as default};
+var n={indicator:"indicator_8612f0911e",textContainer:"textContainer_e4484932bb",sizeCompactTextContainer:"sizeCompactTextContainer_914b5d5229",textContainerTitle:"textContainerTitle_57597a1fed",visuallyHidden:"visuallyHidden_62af87d672",textContainerTitleText:"textContainerTitleText_38f6620cdd",textContainerSubtitleText:"textContainerSubtitleText_19c191cc27",sizeCompactTextContainerTitle:"sizeCompactTextContainerTitle_c97cf1fe7a",textPlacementVertical:"textPlacementVertical_983195287b",numberDividerContainer:"numberDividerContainer_80b80d134a",sizeCompactTextContainerTitleText:"sizeCompactTextContainerTitleText_114bd587a4",divider:"divider_4dd91aac29",sizeCompactNumberDividerContainer:"sizeCompactNumberDividerContainer_4295fd7293",statusActiveNumberDividerContainer:"statusActiveNumberDividerContainer_89a4d6620e",clickable:"clickable_e61ebbf60e",withAnimation:"withAnimation_29e78e8bd8",stepIndicatiorCirclePopElastic:"stepIndicatiorCirclePopElastic_12dd96d55c",swapEnter:"swapEnter_c024f517c3",swapEnterActive:"swapEnterActive_9ed2746812",swapExit:"swapExit_93105273e6",swapExitActive:"swapExitActive_52cb988199",numberContainer:"numberContainer_b33de70d2a",numberContainerText:"numberContainerText_6f59f7ce44",numberContainerTextCheckIcon:"numberContainerTextCheckIcon_018d16115a",typePrimaryNumberContainer:"typePrimaryNumberContainer_baa499d882",typeDangerNumberContainer:"typeDangerNumberContainer_3a4ae8b4dd",typeSuccessNumberContainer:"typeSuccessNumberContainer_b40ba5db9e",typeDarkNumberContainer:"typeDarkNumberContainer_1045dd5faa",statusActiveNumberContainer:"statusActiveNumberContainer_47669c73c1",sizeCompactNumberContainer:"sizeCompactNumberContainer_b5cfb39002",statusPendingNumberContainer:"statusPendingNumberContainer_b3dd2b5b6b","step-indicatior-circle-pop-elastic":"step-indicatior-circle-pop-elastic_950c2823d3"};!function(n){const e="s_id-f9249b867669_3_62_0";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+e))return;const r=document.createElement("style");r.id=e,t.firstChild?t.insertBefore(r,t.firstChild):t.appendChild(r),r.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}(".indicator_8612f0911e {\n  font: var(--font-text2-normal);\n  color: var(--text-color-on-primary);\n  display: flex;\n  margin: 0;\n  padding: 0;\n  text-indent: 0;\n  list-style-type: none;\n}\n\n.textContainer_e4484932bb {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  margin-left: 16px;\n}\n\n.sizeCompactTextContainer_914b5d5229 {\n  margin-left: var(--spacing-small);\n  justify-content: center;\n  align-content: center;\n}\n\n.textContainerTitle_57597a1fed {\n  width: 100%;\n  margin-bottom: var(--spacing-xs);\n}\n\n.textContainerTitle_57597a1fed .visuallyHidden_62af87d672 {\n  display: none;\n}\n\n.textContainerTitleText_38f6620cdd {\n  font: var(--font-text2-medium);\n  color: var(--primary-text-color);\n  margin-bottom: 2px;\n}\n\n.textContainerSubtitleText_19c191cc27 {\n  width: 100%;\n  font: var(--font-text2-normal);\n  color: var(--primary-text-color);\n}\n\n.sizeCompactTextContainerTitle_c97cf1fe7a {\n  margin-bottom: 0px;\n}\n\n.textPlacementVertical_983195287b {\n  margin: 8px;\n  flex-direction: column;\n  flex: 1 1 0px;\n}\n\n.textPlacementVertical_983195287b .textContainer_e4484932bb {\n  margin-left: 0;\n  margin-top: var(--spacing-medium);\n}\n\n.textPlacementVertical_983195287b .numberDividerContainer_80b80d134a {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  width: 100%;\n}\n\n.sizeCompactTextContainerTitleText_114bd587a4 {\n  display: block;\n  font: var(--font-text2-normal);\n  max-width: 150px;\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  margin-bottom: 0;\n}\n\n.textPlacementVertical_983195287b .numberDividerContainer_80b80d134a .divider_4dd91aac29 {\n  background-color: var(--ui-border-color);\n  margin: 16px 0 16px 16px;\n  height: 1px;\n  flex: 1 1 0;\n}\n\n.sizeCompactNumberDividerContainer_4295fd7293 {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.sizeCompactNumberDividerContainer_4295fd7293.statusActiveNumberDividerContainer_89a4d6620e {\n  width: 40px;\n}\n\n.indicator_8612f0911e.clickable_e61ebbf60e {\n  cursor: pointer;\n}\n\n.withAnimation_29e78e8bd8 {\n  animation: stepIndicatiorCirclePopElastic_12dd96d55c var(--motion-expressive-short);\n}\n\n/* New state enters */\n\n.swapEnter_c024f517c3 {\n  opacity: 0;\n  transform: translateY(15px);\n}\n\n.swapEnterActive_9ed2746812 {\n  position: relative;\n  opacity: 1;\n  transition: transform var(--motion-productive-long) var(--motion-timing-enter), opacity var(--motion-productive-short);\n  transform: translateY(0);\n}\n\n/* Old state leaves */\n\n.swapExit_93105273e6 {\n  position: relative;\n  opacity: 1;\n  transform: translateY(0);\n}\n\n.swapExitActive_52cb988199 {\n  position: relative;\n  opacity: 0;\n  transform: translateY(-15px);\n  transition: transform var(--motion-productive-long) var(--motion-timing-enter), opacity var(--motion-productive-short);\n}\n\n.numberContainer_b33de70d2a {\n  width: 36px;\n  height: 36px;\n  border-radius: 50%;\n  display: flex;\n}\n\n.numberContainerText_6f59f7ce44 {\n  margin: auto;\n  display: flex;\n  align-items: center;\n}\n\n.numberContainerTextCheckIcon_018d16115a {\n  width: 20px;\n  height: 20px;\n  margin-top: 2px;\n}\n\n.typePrimaryNumberContainer_baa499d882 {\n  background-color: var(--primary-color);\n}\n\n.typePrimaryNumberContainer_baa499d882:hover {\n  background-color: var(--primary-hover-color);\n}\n\n.typeDangerNumberContainer_3a4ae8b4dd {\n  background-color: var(--negative-color);\n}\n\n.typeDangerNumberContainer_3a4ae8b4dd:hover {\n  background-color: var(--negative-color-hover);\n}\n\n.typeSuccessNumberContainer_b40ba5db9e {\n  background-color: var(--positive-color);\n}\n\n.typeSuccessNumberContainer_b40ba5db9e:hover {\n  background-color: var(--positive-color-hover);\n}\n\n.typeDarkNumberContainer_1045dd5faa {\n  background-color: var(--inverted-color-background);\n  color: var(--text-color-on-inverted);\n}\n\n.typeDarkNumberContainer_1045dd5faa:hover {\n  background-color: var(--secondary-text-color);\n}\n\n.statusActiveNumberContainer_47669c73c1 {\n  box-shadow: 0 0 0 4px var(--primary-background-color), 0 0 0 6px var(--primary-color);\n}\n\n.statusActiveNumberContainer_47669c73c1.typeDangerNumberContainer_3a4ae8b4dd {\n  box-shadow: 0 0 0 4px var(--primary-background-color), 0 0 0 6px var(--negative-color);\n}\n\n.statusActiveNumberContainer_47669c73c1.typeSuccessNumberContainer_b40ba5db9e {\n  box-shadow: 0 0 0 4px var(--primary-background-color), 0 0 0 6px var(--positive-color);\n}\n\n.statusActiveNumberContainer_47669c73c1.typeDarkNumberContainer_1045dd5faa {\n  box-shadow: 0 0 0 4px var(--primary-background-color), 0 0 0 6px var(--primary-text-color);\n}\n\n.sizeCompactNumberContainer_b5cfb39002 {\n  width: 28px;\n  height: 28px;\n}\n\n.statusPendingNumberContainer_b3dd2b5b6b {\n  background-color: var(--primary-background-color);\n  color: var(--primary-text-color);\n  border-color: var(--ui-border-color) !important;\n  border: 1px solid;\n}\n\n.statusPendingNumberContainer_b3dd2b5b6b:hover {\n  background-color: var(--primary-color);\n  color: var(--text-color-on-primary);\n  border: none;\n}\n\n.statusPendingNumberContainer_b3dd2b5b6b.typeDangerNumberContainer_3a4ae8b4dd:hover {\n  background-color: var(--negative-color);\n}\n\n.statusPendingNumberContainer_b3dd2b5b6b.typeSuccessNumberContainer_b40ba5db9e:hover {\n  background-color: var(--positive-color);\n}\n\n.statusPendingNumberContainer_b3dd2b5b6b.typeDarkNumberContainer_1045dd5faa:hover {\n  background-color: var(--text-color-on-inverted);\n}\n\n@keyframes step-indicatior-circle-pop-elastic_950c2823d3 {\n  0% {\n    transform: scale(1);\n  }\n  33% {\n    transform: scale(1.2);\n  }\n  66% {\n    transform: scale(0.9);\n  }\n  100% {\n    transform: scale(1);\n  }\n}");export{n as default};
 //# sourceMappingURL=StepIndicator.module.scss.js.map

package/dist/src/components/NumberField/NumberField.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={numberField:"numberField_70f68e883c",label:"label_1ab2e27051",leftIcon:"leftIcon_7d2cda9567"};!function(e){const n="s_id-043e6276934a_3_61_1";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const d=document.createElement("style");d.id=n,t.firstChild?t.insertBefore(d,t.firstChild):t.appendChild(d),d.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".numberField_70f68e883c {\n  width: 100%;\n}\n.numberField_70f68e883c .label_1ab2e27051 {\n  padding-bottom: 0;\n}\n.numberField_70f68e883c .leftIcon_7d2cda9567 {\n  color: var(--icon-color);\n}");export{e as default};
+var e={numberField:"numberField_dd3453da2b",label:"label_f173b42b54",leftIcon:"leftIcon_d0e0d8da20"};!function(e){const d="s_id-043e6276934a_3_62_0";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+d))return;const t=document.createElement("style");t.id=d,n.firstChild?n.insertBefore(t,n.firstChild):n.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[d]=e)}(".numberField_dd3453da2b {\n  width: 100%;\n}\n.numberField_dd3453da2b .label_f173b42b54 {\n  padding-bottom: 0;\n}\n.numberField_dd3453da2b .leftIcon_d0e0d8da20 {\n  color: var(--icon-color);\n}");export{e as default};
 //# sourceMappingURL=NumberField.module.scss.js.map

package/dist/src/components/NumberField/components/NumberFieldSpinButton/NumberFieldSpinButton.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={spinButton:"spinButton_c14d297481",large:"large_69126a4a9b",icon:"icon_de5c99fec2",medium:"medium_77cba96516",small:"small_e2cda9b747"};!function(e){const n="s_id-eb36452422c9_3_61_1";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const i=document.createElement("style");i.id=n,t.firstChild?t.insertBefore(i,t.firstChild):t.appendChild(i),i.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".spinButton_c14d297481.large_69126a4a9b {\n  width: 28px;\n  height: 20px;\n}\n.spinButton_c14d297481.large_69126a4a9b .icon_de5c99fec2 {\n  width: 16px;\n  height: 16px;\n}\n.spinButton_c14d297481.medium_77cba96516 {\n  width: 24px;\n  height: 16px;\n}\n.spinButton_c14d297481.medium_77cba96516 .icon_de5c99fec2 {\n  width: 16px;\n  height: 16px;\n}\n.spinButton_c14d297481.small_e2cda9b747 {\n  width: 22px;\n  height: 14px;\n}\n.spinButton_c14d297481.small_e2cda9b747 .icon_de5c99fec2 {\n  width: 14px;\n  height: 14px;\n}");export{e as default};
+var n={spinButton:"spinButton_3f4b143246",large:"large_90b2d988b7",icon:"icon_7a1b5c6d1a",medium:"medium_c0c1a0ea63",small:"small_dbe902243c"};!function(n){const e="s_id-eb36452422c9_3_62_0";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+e))return;const i=document.createElement("style");i.id=e,t.firstChild?t.insertBefore(i,t.firstChild):t.appendChild(i),i.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}(".spinButton_3f4b143246.large_90b2d988b7 {\n  width: 28px;\n  height: 20px;\n}\n.spinButton_3f4b143246.large_90b2d988b7 .icon_7a1b5c6d1a {\n  width: 16px;\n  height: 16px;\n}\n.spinButton_3f4b143246.medium_c0c1a0ea63 {\n  width: 24px;\n  height: 16px;\n}\n.spinButton_3f4b143246.medium_c0c1a0ea63 .icon_7a1b5c6d1a {\n  width: 16px;\n  height: 16px;\n}\n.spinButton_3f4b143246.small_dbe902243c {\n  width: 22px;\n  height: 14px;\n}\n.spinButton_3f4b143246.small_dbe902243c .icon_7a1b5c6d1a {\n  width: 14px;\n  height: 14px;\n}");export{n as default};
 //# sourceMappingURL=NumberFieldSpinButton.module.scss.js.map

package/dist/src/components/ProgressBars/LinearProgressBar/Bar/Bar.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{defineProperty as r}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import a,{useMemo as e}from"react";import{camelCase as t}from"lodash-es";import{getStyle as s}from"../../../../helpers/typesciptCssModulesHelper.js";import{getTestId as o,ComponentDefaultTestId as l}from"../../../../tests/testIds.js";import i from"classnames";import{calculatePercentage as m}from"../LinearProgressBarHelpers.js";import n from"./Bar.module.scss.js";var p=function(p){var u=p.value,d=p.type,c=p.barStyle,f=p.animated,b=p.min,v=p.max,j=p.color,y=p.barLabelName,g=p.id,B=p["data-testid"],_=p.className,h=e((function(){return i(n.bar,s(n,t("type__"+d+"--"+c)),_,r({},n.animate,f))}),[d,c,f,_]),x=e((function(){return null==u?0:m(u,b,v)}),[u,b,v]);return u?a.createElement("div",{role:"progressbar","aria-label":y,"aria-valuenow":x,"aria-valuemin":0,"aria-valuemax":100,className:h,style:Object.assign({width:"".concat(x,"%")},j&&{backgroundColor:j}),id:g,"data-testid":B||o(l.BAR,g)}):null};export{p as default};
+import{defineProperty as r}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import e,{useMemo as a}from"react";import{camelCase as t}from"es-toolkit";import{getStyle as s}from"../../../../helpers/typesciptCssModulesHelper.js";import{getTestId as o,ComponentDefaultTestId as l}from"../../../../tests/testIds.js";import i from"classnames";import{calculatePercentage as m}from"../LinearProgressBarHelpers.js";import n from"./Bar.module.scss.js";var p=function(p){var u=p.value,c=p.type,d=p.barStyle,f=p.animated,b=p.min,v=p.max,j=p.color,y=p.barLabelName,g=p.id,B=p["data-testid"],_=p.className,x=a((function(){return i(n.bar,s(n,t("type__"+c+"--"+d)),_,r({},n.animate,f))}),[c,d,f,_]),H=a((function(){return null==u?0:m(u,b,v)}),[u,b,v]);return u?e.createElement("div",{role:"progressbar","aria-label":y,"aria-valuenow":H,"aria-valuemin":0,"aria-valuemax":100,className:x,style:Object.assign({width:"".concat(H,"%")},j&&{backgroundColor:j}),id:g,"data-testid":B||o(l.BAR,g)}):null};export{p as default};
 //# sourceMappingURL=Bar.js.map

package/dist/src/components/ProgressBars/LinearProgressBar/Bar/Bar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Bar.js","sources":["../../../../../../src/components/ProgressBars/LinearProgressBar/Bar/Bar.tsx"],"sourcesContent":["import React, { type FC, useMemo } from \"react\";\nimport { camelCase } from \"~~lodash~~-es\";\nimport { getStyle } from \"../../../../helpers/typesciptCssModulesHelper\";\nimport { ComponentDefaultTestId, getTestId } from \"../../../../tests/test-ids-utils\";\nimport cx from \"classnames\";\nimport { calculatePercentage } from \"../LinearProgressBarHelpers\";\nimport { type VibeComponentProps } from \"../../../../types\";\nimport { type LinearProgressBarStyle } from \"../LinearProgressBar.types\";\nimport styles from \"./Bar.module.scss\";\n\nexport type BarType = \"primary\" \| \"secondary\";\n\nexport interface BarProps extends VibeComponentProps {\n /*\n Determines the visual style of the progress bar.\n /\n barStyle?: LinearProgressBarStyle;\n /\n The minimum value of the progress bar.\n /\n min?: number;\n /\n The maximum value of the progress bar.\n /\n max?: number;\n /\n The current progress value.\n /\n value?: number;\n /\n If true, enables animation effects.\n /\n animated?: boolean;\n /\n Base class name for the bar.\n /\n baseClass?: string;\n /\n The ARIA label describing the progress bar.\n /\n barLabelName?: string;\n /\n Custom color for the progress bar.\n /\n color?: string;\n /\n The type of the bar.\n */\n type?: BarType;\n}\n\nconst Bar: FC<BarProps> = ({\n value,\n type,\n barStyle,\n animated,\n min,\n max,\n color,\n barLabelName,\n id,\n \"data-testid\": dataTestId,\n className\n}) => {\n const classNames = useMemo(() => {\n return cx(styles.bar, getStyle(styles, camelCase(\"type__\" + type + \"--\" + barStyle)), className, {\n [styles.animate]: animated\n });\n }, [type, barStyle, animated, className]);\n\n const valuePercentage = useMemo(() => {\n if (value === null \|\| value === undefined) return 0;\n return calculatePercentage(value, min, max);\n }, [value, min, max]);\n\n if (!value) return null;\n\n return (\n <div\n role=\"progressbar\"\n aria-label={barLabelName}\n aria-valuenow={valuePercentage}\n aria-valuemin={0}\n aria-valuemax={100}\n className={classNames}\n style={{\n width: `${valuePercentage}%`,\n ...(color && { backgroundColor: color })\n }}\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.BAR, id)}\n />\n );\n};\n\nexport default Bar;\n"],"names":["Bar","_ref","value","type","barStyle","animated","min","max","color","barLabelName","id","dataTestId","className","classNames","useMemo","cx","styles","bar","getStyle","camelCase","_defineProperty","animate","valuePercentage","calculatePercentage","React","createElement","role","style","width","concat","backgroundColor","getTestId","ComponentDefaultTestId","BAR"],"mappings":"~~mcAmDA~~,IAAMA,EAAoB,SAAjBC,GAYJ,IAXHC,EAAKD,EAALC,MACAC,EAAIF,EAAJE,KACAC,EAAQH,EAARG,SACAC,EAAQJ,EAARI,SACAC,EAAGL,EAAHK,IACAC,EAAGN,EAAHM,IACAC,EAAKP,EAALO,MACAC,EAAYR,EAAZQ,aACAC,EAAET,EAAFS,GACeC,EAAUV,EAAzB,eACAW,EAASX,EAATW,UAEMC,EAAaC,GAAQ,WACzB,OAAOC,EAAGC,EAAOC,IAAKC,EAASF,EAAQG,EAAU,SAAWhB,EAAO,KAAOC,IAAYQ,EAASQ,EAC5FJ,CAAAA,EAAAA,EAAOK,QAAUhB,GAErB,GAAE,CAACF,EAAMC,EAAUC,EAAUO,IAExBU,EAAkBR,GAAQ,WAC9B,OAAIZ,QAA8C,EAC3CqB,EAAoBrB,EAAOI,EAAKC,EACxC,GAAE,CAACL,EAAOI,EAAKC,IAEhB,OAAKL,EAGHsB,EACEC,cAAA,MAAA,CAAAC,KAAK,2BACOjB,EAAY,gBACTa,EAAe,gBACf,EAAC,gBACD,IACfV,UAAWC,EACXc,qBACEC,MAAK,GAAAC,OAAKP,EAAe,MACrBd,GAAS,CAAEsB,gBAAiBtB,IAElCE,GAAIA,EAAE,cACOC,GAAcoB,EAAUC,EAAuBC,IAAKvB,KAflD,IAkBrB"}
1	+ {"version":3,"file":"Bar.js","sources":["../../../../../../src/components/ProgressBars/LinearProgressBar/Bar/Bar.tsx"],"sourcesContent":["import React, { type FC, useMemo } from \"react\";\nimport { camelCase } from \"es-toolkit\";\nimport { getStyle } from \"../../../../helpers/typesciptCssModulesHelper\";\nimport { ComponentDefaultTestId, getTestId } from \"../../../../tests/test-ids-utils\";\nimport cx from \"classnames\";\nimport { calculatePercentage } from \"../LinearProgressBarHelpers\";\nimport { type VibeComponentProps } from \"../../../../types\";\nimport { type LinearProgressBarStyle } from \"../LinearProgressBar.types\";\nimport styles from \"./Bar.module.scss\";\n\nexport type BarType = \"primary\" \| \"secondary\";\n\nexport interface BarProps extends VibeComponentProps {\n /*\n Determines the visual style of the progress bar.\n /\n barStyle?: LinearProgressBarStyle;\n /\n The minimum value of the progress bar.\n /\n min?: number;\n /\n The maximum value of the progress bar.\n /\n max?: number;\n /\n The current progress value.\n /\n value?: number;\n /\n If true, enables animation effects.\n /\n animated?: boolean;\n /\n Base class name for the bar.\n /\n baseClass?: string;\n /\n The ARIA label describing the progress bar.\n /\n barLabelName?: string;\n /\n Custom color for the progress bar.\n /\n color?: string;\n /\n The type of the bar.\n */\n type?: BarType;\n}\n\nconst Bar: FC<BarProps> = ({\n value,\n type,\n barStyle,\n animated,\n min,\n max,\n color,\n barLabelName,\n id,\n \"data-testid\": dataTestId,\n className\n}) => {\n const classNames = useMemo(() => {\n return cx(styles.bar, getStyle(styles, camelCase(\"type__\" + type + \"--\" + barStyle)), className, {\n [styles.animate]: animated\n });\n }, [type, barStyle, animated, className]);\n\n const valuePercentage = useMemo(() => {\n if (value === null \|\| value === undefined) return 0;\n return calculatePercentage(value, min, max);\n }, [value, min, max]);\n\n if (!value) return null;\n\n return (\n <div\n role=\"progressbar\"\n aria-label={barLabelName}\n aria-valuenow={valuePercentage}\n aria-valuemin={0}\n aria-valuemax={100}\n className={classNames}\n style={{\n width: `${valuePercentage}%`,\n ...(color && { backgroundColor: color })\n }}\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.BAR, id)}\n />\n );\n};\n\nexport default Bar;\n"],"names":["Bar","_ref","value","type","barStyle","animated","min","max","color","barLabelName","id","dataTestId","className","classNames","useMemo","cx","styles","bar","getStyle","camelCase","_defineProperty","animate","valuePercentage","calculatePercentage","React","createElement","role","style","width","concat","backgroundColor","getTestId","ComponentDefaultTestId","BAR"],"mappings":"ocAmDA,IAAMA,EAAoB,SAAjBC,GAYJ,IAXHC,EAAKD,EAALC,MACAC,EAAIF,EAAJE,KACAC,EAAQH,EAARG,SACAC,EAAQJ,EAARI,SACAC,EAAGL,EAAHK,IACAC,EAAGN,EAAHM,IACAC,EAAKP,EAALO,MACAC,EAAYR,EAAZQ,aACAC,EAAET,EAAFS,GACeC,EAAUV,EAAzB,eACAW,EAASX,EAATW,UAEMC,EAAaC,GAAQ,WACzB,OAAOC,EAAGC,EAAOC,IAAKC,EAASF,EAAQG,EAAU,SAAWhB,EAAO,KAAOC,IAAYQ,EAASQ,EAC5FJ,CAAAA,EAAAA,EAAOK,QAAUhB,GAErB,GAAE,CAACF,EAAMC,EAAUC,EAAUO,IAExBU,EAAkBR,GAAQ,WAC9B,OAAIZ,QAA8C,EAC3CqB,EAAoBrB,EAAOI,EAAKC,EACxC,GAAE,CAACL,EAAOI,EAAKC,IAEhB,OAAKL,EAGHsB,EACEC,cAAA,MAAA,CAAAC,KAAK,2BACOjB,EAAY,gBACTa,EAAe,gBACf,EAAC,gBACD,IACfV,UAAWC,EACXc,qBACEC,MAAK,GAAAC,OAAKP,EAAe,MACrBd,GAAS,CAAEsB,gBAAiBtB,IAElCE,GAAIA,EAAE,cACOC,GAAcoB,EAAUC,EAAuBC,IAAKvB,KAflD,IAkBrB"}

package/dist/src/components/ProgressBars/LinearProgressBar/Bar/Bar.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={bar:"bar_4e88a27aca",typePrimaryPrimary:"typePrimaryPrimary_005e57c6f8",typePrimarySecondary:"typePrimarySecondary_c85623e1e4",typePrimaryPositive:"typePrimaryPositive_b8a259dbbc",typePrimaryNegative:"typePrimaryNegative_ece14c83f1",typePrimaryWarning:"typePrimaryWarning_6a27bf86f9",typeSecondaryPrimary:"typeSecondaryPrimary_7c15445f69",typeSecondarySecondary:"typeSecondarySecondary_0ab66186bf",typeSecondaryPositive:"typeSecondaryPositive_b5f0bff56a",typeSecondaryNegative:"typeSecondaryNegative_3a3dea22e9",typeSecondaryWarning:"typeSecondaryWarning_1c95d18b5c",animate:"animate_f5d5863521"};!function(e){const r="s_id-47cfcfa6b681_3_61_1";if("undefined"!=typeof document){const a=document.head||document.getElementsByTagName("head")[0];if(a.querySelector("#"+r))return;const n=document.createElement("style");n.id=r,a.firstChild?a.insertBefore(n,a.firstChild):a.appendChild(n),n.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[r]=e)}(".bar_4e88a27aca {\n  left: 0;\n  height: 100%;\n  position: absolute;\n  border-radius: var(--border-radius-small);\n}\n\n.typePrimaryPrimary_005e57c6f8 {\n  background-color: var(--primary-color);\n}\n\n.typePrimarySecondary_c85623e1e4 {\n  background-color: var(--inverted-color-background);\n}\n\n.typePrimaryPositive_b8a259dbbc {\n  background-color: var(--positive-color);\n}\n\n.typePrimaryNegative_ece14c83f1 {\n  background-color: var(--negative-color);\n}\n\n.typePrimaryWarning_6a27bf86f9 {\n  background-color: var(--warning-color);\n}\n\n.typeSecondaryPrimary_7c15445f69 {\n  background-color: var(--primary-selected-color);\n}\n\n.typeSecondarySecondary_0ab66186bf {\n  background-color: var(--ui-border-color);\n}\n\n.typeSecondaryPositive_b5f0bff56a {\n  background-color: var(--positive-color-selected);\n}\n\n.typeSecondaryNegative_3a3dea22e9 {\n  background-color: var(--negative-color-selected);\n}\n\n.typeSecondaryWarning_1c95d18b5c {\n  background-color: var(--warning-color-selected);\n}\n\n.animate_f5d5863521 {\n  transition: width 300ms var(--motion-timing-transition);\n}");export{e as default};
+var e={bar:"bar_7451d32599",typePrimaryPrimary:"typePrimaryPrimary_baa499d882",typePrimarySecondary:"typePrimarySecondary_24e992e3ba",typePrimaryPositive:"typePrimaryPositive_b40ba5db9e",typePrimaryNegative:"typePrimaryNegative_3a4ae8b4dd",typePrimaryWarning:"typePrimaryWarning_374def0cb7",typeSecondaryPrimary:"typeSecondaryPrimary_95058f86c4",typeSecondarySecondary:"typeSecondarySecondary_52e151df63",typeSecondaryPositive:"typeSecondaryPositive_e3cd43fd5c",typeSecondaryNegative:"typeSecondaryNegative_61b4a8e070",typeSecondaryWarning:"typeSecondaryWarning_be389a1c83",animate:"animate_02f35448fa"};!function(e){const r="s_id-47cfcfa6b681_3_62_0";if("undefined"!=typeof document){const a=document.head||document.getElementsByTagName("head")[0];if(a.querySelector("#"+r))return;const n=document.createElement("style");n.id=r,a.firstChild?a.insertBefore(n,a.firstChild):a.appendChild(n),n.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[r]=e)}(".bar_7451d32599 {\n  left: 0;\n  height: 100%;\n  position: absolute;\n  border-radius: var(--border-radius-small);\n}\n\n.typePrimaryPrimary_baa499d882 {\n  background-color: var(--primary-color);\n}\n\n.typePrimarySecondary_24e992e3ba {\n  background-color: var(--inverted-color-background);\n}\n\n.typePrimaryPositive_b40ba5db9e {\n  background-color: var(--positive-color);\n}\n\n.typePrimaryNegative_3a4ae8b4dd {\n  background-color: var(--negative-color);\n}\n\n.typePrimaryWarning_374def0cb7 {\n  background-color: var(--warning-color);\n}\n\n.typeSecondaryPrimary_95058f86c4 {\n  background-color: var(--primary-selected-color);\n}\n\n.typeSecondarySecondary_52e151df63 {\n  background-color: var(--ui-border-color);\n}\n\n.typeSecondaryPositive_e3cd43fd5c {\n  background-color: var(--positive-color-selected);\n}\n\n.typeSecondaryNegative_61b4a8e070 {\n  background-color: var(--negative-color-selected);\n}\n\n.typeSecondaryWarning_be389a1c83 {\n  background-color: var(--warning-color-selected);\n}\n\n.animate_02f35448fa {\n  transition: width 300ms var(--motion-timing-transition);\n}");export{e as default};
 //# sourceMappingURL=Bar.module.scss.js.map

package/dist/src/components/ProgressBars/LinearProgressBar/LinearProgressBar.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={wrapper:"wrapper_996899713f",fullWidth:"fullWidth_70f68e883c",container:"container_d8809ef2bc",progressBar:"progressBar_8e2db18b58",completed:"completed_d8809ef2bc",label:"label_f751376c2e",large:"large_b639c3006c",medium:"medium_785095904c",small:"small_23d2827b1b"};!function(e){const n="s_id-5855608df299_3_61_1";if("undefined"!=typeof document){const r=document.head||document.getElementsByTagName("head")[0];if(r.querySelector("#"+n))return;const d=document.createElement("style");d.id=n,r.firstChild?r.insertBefore(d,r.firstChild):r.appendChild(d),d.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".wrapper_996899713f {\n  display: flex;\n  flex-direction: row;\n  justify-content: center;\n  width: 100%;\n  font: var(--font-text2-normal);\n  line-height: 8px !important;\n}\n.wrapper_996899713f.fullWidth_70f68e883c {\n  width: 100%;\n}\n.wrapper_996899713f.fullWidth_70f68e883c .container_d8809ef2bc {\n  border-radius: 0;\n}\n.wrapper_996899713f.fullWidth_70f68e883c .container_d8809ef2bc .progressBar_8e2db18b58 {\n  border-radius: 0 var(--border-radius-small) var(--border-radius-small) 0;\n}\n.wrapper_996899713f.fullWidth_70f68e883c .container_d8809ef2bc .progressBar_8e2db18b58.completed_d8809ef2bc {\n  border-radius: 0;\n}\n.label_f751376c2e {\n  padding-left: var(--spacing-xs);\n}\n.large_b639c3006c {\n  height: 8px;\n  line-height: 8px;\n}\n.medium_785095904c {\n  height: 6px;\n  line-height: 6px;\n}\n.small_23d2827b1b {\n  height: 4px;\n  line-height: 4px;\n}\n.container_d8809ef2bc {\n  position: relative;\n  width: 100%;\n  background-color: var(--ui-background-color);\n  border-radius: var(--border-radius-small);\n}");export{e as default};
+var e={wrapper:"wrapper_c6dee2b603",fullWidth:"fullWidth_dd3453da2b",container:"container_b0759f6ae7",progressBar:"progressBar_96e8dbe99f",completed:"completed_b0759f6ae7",label:"label_a5ab9c786b",large:"large_6808a7bb72",medium:"medium_2d7056c23a",small:"small_b28e6e1665"};!function(e){const n="s_id-5855608df299_3_62_0";if("undefined"!=typeof document){const r=document.head||document.getElementsByTagName("head")[0];if(r.querySelector("#"+n))return;const a=document.createElement("style");a.id=n,r.firstChild?r.insertBefore(a,r.firstChild):r.appendChild(a),a.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".wrapper_c6dee2b603 {\n  display: flex;\n  flex-direction: row;\n  justify-content: center;\n  width: 100%;\n  font: var(--font-text2-normal);\n  line-height: 8px !important;\n}\n.wrapper_c6dee2b603.fullWidth_dd3453da2b {\n  width: 100%;\n}\n.wrapper_c6dee2b603.fullWidth_dd3453da2b .container_b0759f6ae7 {\n  border-radius: 0;\n}\n.wrapper_c6dee2b603.fullWidth_dd3453da2b .container_b0759f6ae7 .progressBar_96e8dbe99f {\n  border-radius: 0 var(--border-radius-small) var(--border-radius-small) 0;\n}\n.wrapper_c6dee2b603.fullWidth_dd3453da2b .container_b0759f6ae7 .progressBar_96e8dbe99f.completed_b0759f6ae7 {\n  border-radius: 0;\n}\n.label_a5ab9c786b {\n  padding-left: var(--spacing-xs);\n}\n.large_6808a7bb72 {\n  height: 8px;\n  line-height: 8px;\n}\n.medium_2d7056c23a {\n  height: 6px;\n  line-height: 6px;\n}\n.small_b28e6e1665 {\n  height: 4px;\n  line-height: 4px;\n}\n.container_b0759f6ae7 {\n  position: relative;\n  width: 100%;\n  background-color: var(--ui-background-color);\n  border-radius: var(--border-radius-small);\n}");export{e as default};
 //# sourceMappingURL=LinearProgressBar.module.scss.js.map

package/dist/src/components/ProgressBars/LinearProgressBar/LinearProgressBarHelpers.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{defineProperty as r}from"../../../../_virtual/_rollupPluginBabelHelpers.js";import{toNumber as o}from"lodash-es";import e from"classnames";import s from"./LinearProgressBar.module.scss.js";var t=function(r,e,s){var t=o(r-e)/o(s-e)*100;return t>100?100:t},a=function(o){return e(s.progressBar,r({},s.completed,o>=100))};export{t as calculatePercentage,a as getProgressBarClassNames};
+import{defineProperty as r}from"../../../../_virtual/_rollupPluginBabelHelpers.js";import{toNumber as o}from"es-toolkit/compat";import e from"classnames";import s from"./LinearProgressBar.module.scss.js";var t=function(r,e,s){var t=o(r-e)/o(s-e)*100;return t>100?100:t},m=function(o){return e(s.progressBar,r({},s.completed,o>=100))};export{t as calculatePercentage,m as getProgressBarClassNames};
 //# sourceMappingURL=LinearProgressBarHelpers.js.map

package/dist/src/components/ProgressBars/LinearProgressBar/LinearProgressBarHelpers.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"LinearProgressBarHelpers.js","sources":["../../../../../src/components/ProgressBars/LinearProgressBar/LinearProgressBarHelpers.ts"],"sourcesContent":["import { toNumber } from \"~~lodash~~-es\";\nimport { type SIZES } from \"./../../../constants/sizes\";\nimport cx from \"classnames\";\nimport styles from \"./LinearProgressBar.module.scss\";\n\nexport type Size = (typeof SIZES)[keyof typeof SIZES];\n\nexport const calculatePercentage = (value: number, min: number, max: number) => {\n const valuePercentage = (toNumber(value - min) / toNumber(max - min)) * 100;\n return valuePercentage > 100 ? 100 : valuePercentage;\n};\n\nexport const getProgressBarClassNames = (value: number) => {\n return cx(styles.progressBar, { [styles.completed]: value >= 100 });\n};\n"],"names":["calculatePercentage","value","min","max","valuePercentage","toNumber","getProgressBarClassNames","cx","styles","progressBar","_defineProperty","completed"],"mappings":"~~oMAOO~~,IAAMA,EAAsB,SAACC,EAAeC,EAAaC,GAC9D,IAAMC,EAAmBC,EAASJ,EAAQC,GAAOG,EAASF,EAAMD,GAAQ,IACxE,OAAOE,EAAkB,IAAM,IAAMA,CACvC,EAEaE,EAA2B,SAACL,GACvC,OAAOM,EAAGC,EAAOC,YAAWC,EAAA,CAAA,EAAKF,EAAOG,UAAYV,GAAS,KAC/D"}
1	+ {"version":3,"file":"LinearProgressBarHelpers.js","sources":["../../../../../src/components/ProgressBars/LinearProgressBar/LinearProgressBarHelpers.ts"],"sourcesContent":["import { toNumber } from \"es-toolkit/compat\";\nimport { type SIZES } from \"./../../../constants/sizes\";\nimport cx from \"classnames\";\nimport styles from \"./LinearProgressBar.module.scss\";\n\nexport type Size = (typeof SIZES)[keyof typeof SIZES];\n\nexport const calculatePercentage = (value: number, min: number, max: number) => {\n const valuePercentage = (toNumber(value - min) / toNumber(max - min)) * 100;\n return valuePercentage > 100 ? 100 : valuePercentage;\n};\n\nexport const getProgressBarClassNames = (value: number) => {\n return cx(styles.progressBar, { [styles.completed]: value >= 100 });\n};\n"],"names":["calculatePercentage","value","min","max","valuePercentage","toNumber","getProgressBarClassNames","cx","styles","progressBar","_defineProperty","completed"],"mappings":"4MAOO,IAAMA,EAAsB,SAACC,EAAeC,EAAaC,GAC9D,IAAMC,EAAmBC,EAASJ,EAAQC,GAAOG,EAASF,EAAMD,GAAQ,IACxE,OAAOE,EAAkB,IAAM,IAAMA,CACvC,EAEaE,EAA2B,SAACL,GACvC,OAAOM,EAAGC,EAAOC,YAAWC,EAAA,CAAA,EAAKF,EAAOG,UAAYV,GAAS,KAC/D"}

package/dist/src/components/ProgressBars/PercentageLabel/PercentageLabel.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={label:"label_f751376c2e"};!function(e){const t="s_id-de8a28d20526_3_61_1";if("undefined"!=typeof document){const d=document.head||document.getElementsByTagName("head")[0];if(d.querySelector("#"+t))return;const n=document.createElement("style");n.id=t,d.firstChild?d.insertBefore(n,d.firstChild):d.appendChild(n),n.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".label_f751376c2e {\n  padding-left: var(--spacing-xs);\n}");export{e as default};
+var e={label:"label_a5ab9c786b"};!function(e){const t="s_id-de8a28d20526_3_62_0";if("undefined"!=typeof document){const d=document.head||document.getElementsByTagName("head")[0];if(d.querySelector("#"+t))return;const a=document.createElement("style");a.id=t,d.firstChild?d.insertBefore(a,d.firstChild):d.appendChild(a),a.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".label_a5ab9c786b {\n  padding-left: var(--spacing-xs);\n}");export{e as default};
 //# sourceMappingURL=PercentageLabel.module.scss.js.map

package/dist/src/components/RadioButton/RadioButton.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var n={radioButton:"radioButton_2bfd7a7098",inputContainer:"inputContainer_3b728d22c0",input:"input_7dc2fdd25f",control:"control_421abf3a65",labelAnimation:"labelAnimation_ee488cf8ad",radioCheckedAnimation:"radioCheckedAnimation_045f508ca7",disabled:"disabled_91054f0f14",label:"label_4388d11e48"};!function(n){const o="s_id-f0fb17b54d8d_3_61_1";if("undefined"!=typeof document){const e=document.head||document.getElementsByTagName("head")[0];if(e.querySelector("#"+o))return;const i=document.createElement("style");i.id=o,e.firstChild?e.insertBefore(i,e.firstChild):e.appendChild(i),i.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[o]=n)}("/* stylelint-disable unit-disallowed-list */\n.radioButton_2bfd7a7098 {\n  display: grid;\n  grid-template-columns: 1.5em auto;\n  grid-gap: 0.5em;\n  cursor: pointer;\n}\n.inputContainer_3b728d22c0 {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.input_7dc2fdd25f {\n  opacity: 0;\n  width: 0;\n  height: 0;\n  margin: 0;\n}\n.control_421abf3a65 {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 1em;\n  height: 1em;\n  border: 0.1em solid;\n  box-sizing: border-box;\n  border-color: var(--ui-border-color);\n  border-radius: 50%;\n  transition: border-width var(--motion-productive-medium) var(--motion-timing-enter);\n  background-color: var(--secondary-background-color);\n}\ninput:checked + .control_421abf3a65 {\n  border-color: var(--primary-color);\n  border-width: 0.3em;\n}\ninput:checked + .labelAnimation_ee488cf8ad {\n  animation-name: radioCheckedAnimation_045f508ca7;\n  animation-duration: var(--motion-productive-medium);\n  animation-timing-function: var(--motion-timing-enter);\n  animation-fill-mode: forwards;\n}\ninput:disabled + .control_421abf3a65 {\n  border: 0.5em solid;\n  border-color: var(--disabled-background-color);\n  border-radius: 50%;\n}\ninput:checked:disabled + .control_421abf3a65 {\n  border: 0.3em solid;\n  border-color: var(--disabled-background-color);\n  background-color: var(--secondary-text-color);\n}\n.radioButton_2bfd7a7098.disabled_91054f0f14 {\n  cursor: not-allowed;\n}\n.radioButton_2bfd7a7098.disabled_91054f0f14 .label_4388d11e48 {\n  color: var(--disabled-text-color);\n}\n.inputContainer_3b728d22c0 input:focus-visible + .control_421abf3a65 {\n  outline: none;\n  border-color: var(--primary-color);\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5);\n  border-radius: 50%;\n}\n.radioButton_2bfd7a7098:hover .inputContainer_3b728d22c0 input:enabled:checked + .control_421abf3a65 {\n  border-color: var(--primary-hover-color);\n}\n.radioButton_2bfd7a7098:hover .inputContainer_3b728d22c0 input:enabled:not(:checked) + .control_421abf3a65,\n.radioButton_2bfd7a7098:focus-within .inputContainer_3b728d22c0 input:enabled:not(:checked) + .control_421abf3a65 {\n  border-color: var(--primary-text-color);\n}\n@keyframes radioCheckedAnimation_045f508ca7 {\n  0% {\n    height: 1em;\n    width: 1em;\n  }\n  50% {\n    height: 0.8em;\n    width: 0.8em;\n  }\n  100% {\n    height: 1em;\n    width: 1em;\n  }\n}");export{n as default};
+var n={radioButton:"radioButton_dd046c5373",inputContainer:"inputContainer_4295fd7293",input:"input_4271fed4ac",control:"control_6053900d55",labelAnimation:"labelAnimation_f400feb0b2",radioCheckedAnimation:"radioCheckedAnimation_4c58582836",disabled:"disabled_5a4cc9ab19",label:"label_3a67681e59"};!function(n){const o="s_id-f0fb17b54d8d_3_62_0";if("undefined"!=typeof document){const e=document.head||document.getElementsByTagName("head")[0];if(e.querySelector("#"+o))return;const i=document.createElement("style");i.id=o,e.firstChild?e.insertBefore(i,e.firstChild):e.appendChild(i),i.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[o]=n)}("/* stylelint-disable unit-disallowed-list */\n.radioButton_dd046c5373 {\n  display: grid;\n  grid-template-columns: 1.5em auto;\n  grid-gap: 0.5em;\n  cursor: pointer;\n}\n.inputContainer_4295fd7293 {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.input_4271fed4ac {\n  opacity: 0;\n  width: 0;\n  height: 0;\n  margin: 0;\n}\n.control_6053900d55 {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 1em;\n  height: 1em;\n  border: 0.1em solid;\n  box-sizing: border-box;\n  border-color: var(--ui-border-color);\n  border-radius: 50%;\n  transition: border-width var(--motion-productive-medium) var(--motion-timing-enter);\n  background-color: var(--secondary-background-color);\n}\ninput:checked + .control_6053900d55 {\n  border-color: var(--primary-color);\n  border-width: 0.3em;\n}\ninput:checked + .labelAnimation_f400feb0b2 {\n  animation-name: radioCheckedAnimation_4c58582836;\n  animation-duration: var(--motion-productive-medium);\n  animation-timing-function: var(--motion-timing-enter);\n  animation-fill-mode: forwards;\n}\ninput:disabled + .control_6053900d55 {\n  border: 0.5em solid;\n  border-color: var(--disabled-background-color);\n  border-radius: 50%;\n}\ninput:checked:disabled + .control_6053900d55 {\n  border: 0.3em solid;\n  border-color: var(--disabled-background-color);\n  background-color: var(--secondary-text-color);\n}\n.radioButton_dd046c5373.disabled_5a4cc9ab19 {\n  cursor: not-allowed;\n}\n.radioButton_dd046c5373.disabled_5a4cc9ab19 .label_3a67681e59 {\n  color: var(--disabled-text-color);\n}\n.inputContainer_4295fd7293 input:focus-visible + .control_6053900d55 {\n  outline: none;\n  border-color: var(--primary-color);\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5);\n  border-radius: 50%;\n}\n.radioButton_dd046c5373:hover .inputContainer_4295fd7293 input:enabled:checked + .control_6053900d55 {\n  border-color: var(--primary-hover-color);\n}\n.radioButton_dd046c5373:hover .inputContainer_4295fd7293 input:enabled:not(:checked) + .control_6053900d55,\n.radioButton_dd046c5373:focus-within .inputContainer_4295fd7293 input:enabled:not(:checked) + .control_6053900d55 {\n  border-color: var(--primary-text-color);\n}\n@keyframes radioCheckedAnimation_4c58582836 {\n  0% {\n    height: 1em;\n    width: 1em;\n  }\n  50% {\n    height: 0.8em;\n    width: 0.8em;\n  }\n  100% {\n    height: 1em;\n    width: 1em;\n  }\n}");export{n as default};
 //# sourceMappingURL=RadioButton.module.scss.js.map

package/dist/src/components/Search/Search.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={searchWrapper:"searchWrapper_580576fd10",search:"search_4b6810d09c",loader:"loader_0744be4a74",icon:"icon_3dfe06dc46",empty:"empty_9c1680f620"};!function(e){const r="s_id-4e5e4eb516f6_3_61_1";if("undefined"!=typeof document){const a=document.head||document.getElementsByTagName("head")[0];if(a.querySelector("#"+r))return;const c=document.createElement("style");c.id=r,a.firstChild?a.insertBefore(c,a.firstChild):a.appendChild(c),c.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[r]=e)}(".searchWrapper_580576fd10 .search_4b6810d09c {\n  appearance: textfield;\n}\n.searchWrapper_580576fd10 .search_4b6810d09c::-webkit-search-cancel-button, .searchWrapper_580576fd10 .search_4b6810d09c::-webkit-search-results-button {\n  appearance: none;\n}\n.searchWrapper_580576fd10 .loader_0744be4a74 {\n  margin-right: var(--spacing-xs);\n}\n.searchWrapper_580576fd10 .icon_3dfe06dc46 {\n  opacity: 1;\n  color: var(--icon-color);\n  transition: opacity var(--motion-productive-short);\n}\n.searchWrapper_580576fd10 .icon_3dfe06dc46.empty_9c1680f620 {\n  opacity: 0;\n}");export{e as default};
+var e={searchWrapper:"searchWrapper_903f796c3e",search:"search_ca557b3f7c",loader:"loader_68b7ea130f",icon:"icon_16f0c8936b",empty:"empty_34e1cf5833"};!function(e){const c="s_id-4e5e4eb516f6_3_62_0";if("undefined"!=typeof document){const a=document.head||document.getElementsByTagName("head")[0];if(a.querySelector("#"+c))return;const r=document.createElement("style");r.id=c,a.firstChild?a.insertBefore(r,a.firstChild):a.appendChild(r),r.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[c]=e)}(".searchWrapper_903f796c3e .search_ca557b3f7c {\n  appearance: textfield;\n}\n.searchWrapper_903f796c3e .search_ca557b3f7c::-webkit-search-cancel-button, .searchWrapper_903f796c3e .search_ca557b3f7c::-webkit-search-results-button {\n  appearance: none;\n}\n.searchWrapper_903f796c3e .loader_68b7ea130f {\n  margin-right: var(--spacing-xs);\n}\n.searchWrapper_903f796c3e .icon_16f0c8936b {\n  opacity: 1;\n  color: var(--icon-color);\n  transition: opacity var(--motion-productive-short);\n}\n.searchWrapper_903f796c3e .icon_16f0c8936b.empty_34e1cf5833 {\n  opacity: 0;\n}");export{e as default};
 //# sourceMappingURL=Search.module.scss.js.map

package/dist/src/components/Skeleton/Skeleton.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{defineProperty as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import t from"react";import{camelCase as s}from"lodash-es";import{getTestId as r,ComponentDefaultTestId as i}from"../../tests/testIds.js";import l from"classnames";import{SkeletonType as o,SKELETON_SIZES as a,TextSkeletonSize as m,SKELETON_CUSTOM_SIZE as p}from"./SkeletonConstants.js";import{getStyle as d}from"../../helpers/typesciptCssModulesHelper.js";import{withStaticPropsWithoutForwardRef as c}from"../../types/withStaticProps.js";import"../../utils/colors-vars-map.js";import n from"./Skeleton.module.scss.js";var u=c((function(a){var c=a.type,u=void 0===c?"rectangle":c,f=a.size,h=void 0===f?"custom":f,v=a.className,j=a.wrapperClassName,y=a.width,g=a.height,N=a.fullWidth,w=void 0!==N&&N,E=a.id,S=a["data-testid"],b=Object.values(o).includes(u)?u:"rectangle",k=Object.values(m).includes(h)?h:p;return t.createElement("div",{id:E,className:l(n.skeleton,j,e({},n.fullWidth,w)),"data-testid":S||r(i.SKELETON,E)},t.createElement("div",{className:l(n[b],d(n,s(b+"-"+k)),v,e({},n.fullWidth,w)),style:{width:y,height:g}}))}),{types:o,sizes:a});export{u as default};
+import{defineProperty as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import t from"react";import{camelCase as s}from"es-toolkit";import{getTestId as r,ComponentDefaultTestId as i}from"../../tests/testIds.js";import o from"classnames";import{SkeletonType as l,SKELETON_SIZES as a,TextSkeletonSize as m,SKELETON_CUSTOM_SIZE as p}from"./SkeletonConstants.js";import{getStyle as d}from"../../helpers/typesciptCssModulesHelper.js";import{withStaticPropsWithoutForwardRef as c}from"../../types/withStaticProps.js";import"../../utils/colors-vars-map.js";import n from"./Skeleton.module.scss.js";var u=c((function(a){var c=a.type,u=void 0===c?"rectangle":c,f=a.size,h=void 0===f?"custom":f,v=a.className,j=a.wrapperClassName,y=a.width,g=a.height,N=a.fullWidth,k=void 0!==N&&N,w=a.id,E=a["data-testid"],S=Object.values(l).includes(u)?u:"rectangle",b=Object.values(m).includes(h)?h:p;return t.createElement("div",{id:w,className:o(n.skeleton,j,e({},n.fullWidth,k)),"data-testid":E||r(i.SKELETON,w)},t.createElement("div",{className:o(n[S],d(n,s(S+"-"+b)),v,e({},n.fullWidth,k)),style:{width:y,height:g}}))}),{types:l,sizes:a});export{u as default};
 //# sourceMappingURL=Skeleton.js.map

package/dist/src/components/Skeleton/Skeleton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Skeleton.js","sources":["../../../../src/components/Skeleton/Skeleton.tsx"],"sourcesContent":["import React from \"react\";\nimport { camelCase } from \"~~lodash~~-es\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport cx from \"classnames\";\nimport {\n SKELETON_SIZES,\n SkeletonType as SkeletonTypeEnum,\n SKELETON_CUSTOM_SIZE,\n TextSkeletonSize as TextSkeletonSizeEnum\n} from \"./SkeletonConstants\";\n\nimport { type SkeletonType, type SkeletonSizeType } from \"./Skelton.types\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport { type VibeComponentProps, withStaticPropsWithoutForwardRef } from \"../../types\";\nimport styles from \"./Skeleton.module.scss\";\n\nexport interface SkeletonProps extends VibeComponentProps {\n /*\n The type of skeleton.\n /\n type?: SkeletonType;\n /\n The predefined size of the skeleton.\n /\n size?: SkeletonSizeType;\n /\n The width of the skeleton in pixels.\n /\n width?: number;\n /\n The height of the skeleton in pixels.\n /\n height?: number;\n /\n Class name applied to the wrapper element.\n /\n wrapperClassName?: string;\n /\n If true, the skeleton will take up the full width of its container.\n */\n fullWidth?: boolean;\n}\n\nconst Skeleton = ({\n type = \"rectangle\",\n size = \"custom\",\n className,\n wrapperClassName,\n width,\n height,\n fullWidth = false,\n id,\n \"data-testid\": dataTestId\n}: SkeletonProps) => {\n const skeletonType = (Object.values(SkeletonTypeEnum) as string[]).includes(type) ? type : \"rectangle\";\n\n // Skeleton has sizes only for text type, other types support only custom size\n const skeletonSize = (Object.values(TextSkeletonSizeEnum) as string[]).includes(size) ? size : SKELETON_CUSTOM_SIZE;\n\n return (\n <div\n id={id}\n className={cx(styles.skeleton, wrapperClassName, { [styles.fullWidth]: fullWidth })}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.SKELETON, id)}\n >\n <div\n className={cx(styles[skeletonType], getStyle(styles, camelCase(skeletonType + \"-\" + skeletonSize)), className, {\n [styles.fullWidth]: fullWidth\n })}\n style={{ width, height }}\n />\n </div>\n );\n};\n\ninterface SkeletonStaticProps {\n types: typeof SkeletonTypeEnum;\n sizes: typeof SKELETON_SIZES;\n}\n\nexport default withStaticPropsWithoutForwardRef<SkeletonProps, SkeletonStaticProps>(Skeleton, {\n types: SkeletonTypeEnum,\n sizes: SKELETON_SIZES\n});\n"],"names":["withStaticPropsWithoutForwardRef","_ref","_ref$type","type","_ref$size","size","className","wrapperClassName","width","height","_ref$fullWidth","fullWidth","id","dataTestId","skeletonType","Object","values","SkeletonTypeEnum","includes","skeletonSize","TextSkeletonSizeEnum","SKELETON_CUSTOM_SIZE","React","createElement","cx","styles","skeleton","_defineProperty","getTestId","ComponentDefaultTestId","SKELETON","getStyle","camelCase","style","types","sizes","SKELETON_SIZES"],"mappings":"~~slBA2CA~~,IAqCeA,EAAAA,GArCE,SAAHC,GAUM,IAAAC,EAAAD,EATlBE,KAAAA,OAAO,IAAHD,EAAG,YAAWA,EAAAE,EAAAH,EAClBI,KAAAA,OAAO,IAAHD,EAAG,SAAQA,EACfE,EAASL,EAATK,UACAC,EAAgBN,EAAhBM,iBACAC,EAAKP,EAALO,MACAC,EAAMR,EAANQ,OAAMC,EAAAT,EACNU,UAAAA,OAAY,IAAHD,GAAQA,EACjBE,EAAEX,EAAFW,GACeC,EAAUZ,EAAzB,eAEMa,EAAgBC,OAAOC,OAAOC,GAA+BC,SAASf,GAAQA,EAAO,YAGrFgB,EAAgBJ,OAAOC,OAAOI,GAAmCF,SAASb,GAAQA,EAAOgB,EAE/F,OACEC,EACEC,cAAA,MAAA,CAAAX,GAAIA,EACJN,UAAWkB,EAAGC,EAAOC,SAAUnB,EAAgBoB,KAAKF,EAAOd,UAAYA,IAC1D,cAAAE,GAAce,EAAUC,EAAuBC,SAAUlB,IAEtEU,EACEC,cAAA,MAAA,CAAAjB,UAAWkB,EAAGC,EAAOX,GAAeiB,EAASN,EAAQO,EAAUlB,EAAe,IAAMK,IAAgBb,EAASqB,EAC1GF,CAAAA,EAAAA,EAAOd,UAAYA,IAEtBsB,MAAO,CAAEzB,MAAAA,EAAOC,OAAAA,KAIxB,GAO8F,CAC5FyB,MAAOjB,EACPkB,MAAOC"}
1	+ {"version":3,"file":"Skeleton.js","sources":["../../../../src/components/Skeleton/Skeleton.tsx"],"sourcesContent":["import React from \"react\";\nimport { camelCase } from \"es-toolkit\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport cx from \"classnames\";\nimport {\n SKELETON_SIZES,\n SkeletonType as SkeletonTypeEnum,\n SKELETON_CUSTOM_SIZE,\n TextSkeletonSize as TextSkeletonSizeEnum\n} from \"./SkeletonConstants\";\n\nimport { type SkeletonType, type SkeletonSizeType } from \"./Skelton.types\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport { type VibeComponentProps, withStaticPropsWithoutForwardRef } from \"../../types\";\nimport styles from \"./Skeleton.module.scss\";\n\nexport interface SkeletonProps extends VibeComponentProps {\n /*\n The type of skeleton.\n /\n type?: SkeletonType;\n /\n The predefined size of the skeleton.\n /\n size?: SkeletonSizeType;\n /\n The width of the skeleton in pixels.\n /\n width?: number;\n /\n The height of the skeleton in pixels.\n /\n height?: number;\n /\n Class name applied to the wrapper element.\n /\n wrapperClassName?: string;\n /\n If true, the skeleton will take up the full width of its container.\n */\n fullWidth?: boolean;\n}\n\nconst Skeleton = ({\n type = \"rectangle\",\n size = \"custom\",\n className,\n wrapperClassName,\n width,\n height,\n fullWidth = false,\n id,\n \"data-testid\": dataTestId\n}: SkeletonProps) => {\n const skeletonType = (Object.values(SkeletonTypeEnum) as string[]).includes(type) ? type : \"rectangle\";\n\n // Skeleton has sizes only for text type, other types support only custom size\n const skeletonSize = (Object.values(TextSkeletonSizeEnum) as string[]).includes(size) ? size : SKELETON_CUSTOM_SIZE;\n\n return (\n <div\n id={id}\n className={cx(styles.skeleton, wrapperClassName, { [styles.fullWidth]: fullWidth })}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.SKELETON, id)}\n >\n <div\n className={cx(styles[skeletonType], getStyle(styles, camelCase(skeletonType + \"-\" + skeletonSize)), className, {\n [styles.fullWidth]: fullWidth\n })}\n style={{ width, height }}\n />\n </div>\n );\n};\n\ninterface SkeletonStaticProps {\n types: typeof SkeletonTypeEnum;\n sizes: typeof SKELETON_SIZES;\n}\n\nexport default withStaticPropsWithoutForwardRef<SkeletonProps, SkeletonStaticProps>(Skeleton, {\n types: SkeletonTypeEnum,\n sizes: SKELETON_SIZES\n});\n"],"names":["withStaticPropsWithoutForwardRef","_ref","_ref$type","type","_ref$size","size","className","wrapperClassName","width","height","_ref$fullWidth","fullWidth","id","dataTestId","skeletonType","Object","values","SkeletonTypeEnum","includes","skeletonSize","TextSkeletonSizeEnum","SKELETON_CUSTOM_SIZE","React","createElement","cx","styles","skeleton","_defineProperty","getTestId","ComponentDefaultTestId","SKELETON","getStyle","camelCase","style","types","sizes","SKELETON_SIZES"],"mappings":"ulBA2CA,IAqCeA,EAAAA,GArCE,SAAHC,GAUM,IAAAC,EAAAD,EATlBE,KAAAA,OAAO,IAAHD,EAAG,YAAWA,EAAAE,EAAAH,EAClBI,KAAAA,OAAO,IAAHD,EAAG,SAAQA,EACfE,EAASL,EAATK,UACAC,EAAgBN,EAAhBM,iBACAC,EAAKP,EAALO,MACAC,EAAMR,EAANQ,OAAMC,EAAAT,EACNU,UAAAA,OAAY,IAAHD,GAAQA,EACjBE,EAAEX,EAAFW,GACeC,EAAUZ,EAAzB,eAEMa,EAAgBC,OAAOC,OAAOC,GAA+BC,SAASf,GAAQA,EAAO,YAGrFgB,EAAgBJ,OAAOC,OAAOI,GAAmCF,SAASb,GAAQA,EAAOgB,EAE/F,OACEC,EACEC,cAAA,MAAA,CAAAX,GAAIA,EACJN,UAAWkB,EAAGC,EAAOC,SAAUnB,EAAgBoB,KAAKF,EAAOd,UAAYA,IAC1D,cAAAE,GAAce,EAAUC,EAAuBC,SAAUlB,IAEtEU,EACEC,cAAA,MAAA,CAAAjB,UAAWkB,EAAGC,EAAOX,GAAeiB,EAASN,EAAQO,EAAUlB,EAAe,IAAMK,IAAgBb,EAASqB,EAC1GF,CAAAA,EAAAA,EAAOd,UAAYA,IAEtBsB,MAAO,CAAEzB,MAAAA,EAAOC,OAAAA,KAIxB,GAO8F,CAC5FyB,MAAOjB,EACPkB,MAAOC"}

package/dist/src/components/Skeleton/Skeleton.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var n={skeleton:"skeleton_b7ce09f313",rectangle:"rectangle_c41dbfebbd",shine:"shine_6fbbd6e447",circle:"circle_4e5db12943",text:"text_78713734c1",textH1:"textH1_5c53893c42",textH2:"textH2_76a50c7fc4",textH3:"textH3_76a50c7fc4",textH4:"textH4_f27916a0e0",textH5:"textH5_c5b130dca4",textH6:"textH6_0cb4a3145f",textSmall:"textSmall_6b2c1d5903",textCustom:"textCustom_0cb4a3145f",fullWidth:"fullWidth_70f68e883c"};!function(n){const e="s_id-41cda04b2bc0_3_61_1";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+e))return;const i=document.createElement("style");i.id=e,t.firstChild?t.insertBefore(i,t.firstChild):t.appendChild(i),i.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}(".skeleton_b7ce09f313 {\n  display: flex;\n}\n\n.rectangle_c41dbfebbd {\n  height: 160px;\n  background: var(--ui-background-color);\n  border-radius: var(--border-radius-small);\n  overflow: hidden;\n  animation-duration: 0.8s;\n  animation-direction: alternate;\n  animation-iteration-count: infinite;\n  animation-name: shine_6fbbd6e447;\n  animation-timing-function: steps(10, end);\n}\n\n@keyframes shine_6fbbd6e447 {\n  0% {\n    opacity: 0.4;\n  }\n  100% {\n    opacity: 1;\n  }\n}\n\n.circle_4e5db12943 {\n  height: 40px;\n  background: var(--ui-background-color);\n  border-radius: 50%;\n  overflow: hidden;\n  animation-duration: 0.8s;\n  animation-direction: alternate;\n  animation-iteration-count: infinite;\n  animation-name: shine_6fbbd6e447;\n  animation-timing-function: steps(10, end);\n}\n\n@keyframes shine_6fbbd6e447 {\n  0% {\n    opacity: 0.4;\n  }\n  100% {\n    opacity: 1;\n  }\n}\n\n.text_78713734c1 {\n  background: var(--ui-background-color);\n  border-radius: var(--border-radius-small);\n  overflow: hidden;\n  animation-duration: 0.8s;\n  animation-direction: alternate;\n  animation-iteration-count: infinite;\n  animation-name: shine_6fbbd6e447;\n  animation-timing-function: steps(10, end);\n}\n\n@keyframes shine_6fbbd6e447 {\n  0% {\n    opacity: 0.4;\n  }\n  100% {\n    opacity: 1;\n  }\n}\n\n.textH1_5c53893c42 {\n  height: 32px;\n}\n\n.textH2_76a50c7fc4 {\n  height: 24px;\n}\n\n.textH3_76a50c7fc4 {\n  height: 24px;\n}\n\n.textH4_f27916a0e0 {\n  height: 21px;\n}\n\n.textH5_c5b130dca4 {\n  height: 16px;\n}\n\n.textH6_0cb4a3145f {\n  height: 12px;\n}\n\n.textSmall_6b2c1d5903,\n.textCustom_0cb4a3145f {\n  height: 12px;\n}\n\n.fullWidth_70f68e883c {\n  width: 100%;\n}\n\n.skeleton_b7ce09f313:not(.fullWidth_70f68e883c) .text_78713734c1 {\n  width: 162px;\n}\n\n.skeleton_b7ce09f313:not(.fullWidth_70f68e883c) .circle_4e5db12943 {\n  width: 40px;\n}\n\n.skeleton_b7ce09f313:not(.fullWidth_70f68e883c) .rectangle_c41dbfebbd {\n  width: 160px;\n}");export{n as default};
+var n={skeleton:"skeleton_cbd2e3a4c5",rectangle:"rectangle_407e964166",shine:"shine_427385ae62",circle:"circle_464e5311a9",text:"text_83426854fa",textH1:"textH1_aae92b9c72",textH2:"textH2_86c38e27c2",textH3:"textH3_86c38e27c2",textH4:"textH4_3573bdc329",textH5:"textH5_1f00f44fae",textH6:"textH6_8d3be19365",textSmall:"textSmall_4b906a5387",textCustom:"textCustom_8d3be19365",fullWidth:"fullWidth_dd3453da2b"};!function(n){const e="s_id-41cda04b2bc0_3_62_0";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+e))return;const i=document.createElement("style");i.id=e,t.firstChild?t.insertBefore(i,t.firstChild):t.appendChild(i),i.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}(".skeleton_cbd2e3a4c5 {\n  display: flex;\n}\n\n.rectangle_407e964166 {\n  height: 160px;\n  background: var(--ui-background-color);\n  border-radius: var(--border-radius-small);\n  overflow: hidden;\n  animation-duration: 0.8s;\n  animation-direction: alternate;\n  animation-iteration-count: infinite;\n  animation-name: shine_427385ae62;\n  animation-timing-function: steps(10, end);\n}\n\n@keyframes shine_427385ae62 {\n  0% {\n    opacity: 0.4;\n  }\n  100% {\n    opacity: 1;\n  }\n}\n\n.circle_464e5311a9 {\n  height: 40px;\n  background: var(--ui-background-color);\n  border-radius: 50%;\n  overflow: hidden;\n  animation-duration: 0.8s;\n  animation-direction: alternate;\n  animation-iteration-count: infinite;\n  animation-name: shine_427385ae62;\n  animation-timing-function: steps(10, end);\n}\n\n@keyframes shine_427385ae62 {\n  0% {\n    opacity: 0.4;\n  }\n  100% {\n    opacity: 1;\n  }\n}\n\n.text_83426854fa {\n  background: var(--ui-background-color);\n  border-radius: var(--border-radius-small);\n  overflow: hidden;\n  animation-duration: 0.8s;\n  animation-direction: alternate;\n  animation-iteration-count: infinite;\n  animation-name: shine_427385ae62;\n  animation-timing-function: steps(10, end);\n}\n\n@keyframes shine_427385ae62 {\n  0% {\n    opacity: 0.4;\n  }\n  100% {\n    opacity: 1;\n  }\n}\n\n.textH1_aae92b9c72 {\n  height: 32px;\n}\n\n.textH2_86c38e27c2 {\n  height: 24px;\n}\n\n.textH3_86c38e27c2 {\n  height: 24px;\n}\n\n.textH4_3573bdc329 {\n  height: 21px;\n}\n\n.textH5_1f00f44fae {\n  height: 16px;\n}\n\n.textH6_8d3be19365 {\n  height: 12px;\n}\n\n.textSmall_4b906a5387,\n.textCustom_8d3be19365 {\n  height: 12px;\n}\n\n.fullWidth_dd3453da2b {\n  width: 100%;\n}\n\n.skeleton_cbd2e3a4c5:not(.fullWidth_dd3453da2b) .text_83426854fa {\n  width: 162px;\n}\n\n.skeleton_cbd2e3a4c5:not(.fullWidth_dd3453da2b) .circle_464e5311a9 {\n  width: 40px;\n}\n\n.skeleton_cbd2e3a4c5:not(.fullWidth_dd3453da2b) .rectangle_407e964166 {\n  width: 160px;\n}");export{n as default};
 //# sourceMappingURL=Skeleton.module.scss.js.map

package/dist/src/components/SlideTransition/SlideTransition.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={slide:"slide_a1b9ee239a"};!function(e){const t="s_id-096ffa3ec029_3_61_1";if("undefined"!=typeof document){const d=document.head||document.getElementsByTagName("head")[0];if(d.querySelector("#"+t))return;const n=document.createElement("style");n.id=t,d.firstChild?d.insertBefore(n,d.firstChild):d.appendChild(n),n.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".slide_a1b9ee239a {\n  height: 100%;\n  width: 100%;\n}");export{e as default};
+var e={slide:"slide_41291ce4dd"};!function(e){const t="s_id-096ffa3ec029_3_62_0";if("undefined"!=typeof document){const d=document.head||document.getElementsByTagName("head")[0];if(d.querySelector("#"+t))return;const n=document.createElement("style");n.id=t,d.firstChild?d.insertBefore(n,d.firstChild):d.appendChild(n),n.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".slide_41291ce4dd {\n  height: 100%;\n  width: 100%;\n}");export{e as default};
 //# sourceMappingURL=SlideTransition.module.scss.js.map

package/dist/src/components/Slider/SelectionIndicator.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{slicedToArray as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import r,{useMemo as t}from"react";import{debounce as o}from"lodash-es";import n from"../TextField/TextField.js";import{useSliderSelection as i,useSliderActions as a}from"./SliderContext.js";import l from"./SelectionIndicator.module.scss.js";var u=function(u){var s=u.kind,c="postfix"===(void 0===s?"prefix":s),m=i(),f=function(e,r,t,o){return r?e?[t[1],o[1]]:[t[0],o[0]]:[t,o]}(c,m.ranged,m.value,m.valueText),d=e(f,2)[1],p=a().changeThumbValue,v=t((function(){return o((function(e){var r=function(e){return e.replace(/\D/g,"")}(e);p(r,c?1:0,!0)}),300)}),[p,c]);return r.createElement(n,{onChange:v,value:d+"",className:l.selectionIndicator})};export{u as default};
+import{slicedToArray as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import r,{useMemo as t}from"react";import{debounce as o}from"es-toolkit/compat";import i from"../TextField/TextField.js";import{useSliderSelection as n,useSliderActions as a}from"./SliderContext.js";import l from"./SelectionIndicator.module.scss.js";var u=function(u){var c=u.kind,m="postfix"===(void 0===c?"prefix":c),s=n(),f=function(e,r,t,o){return r?e?[t[1],o[1]]:[t[0],o[0]]:[t,o]}(m,s.ranged,s.value,s.valueText),p=e(f,2)[1],d=a().changeThumbValue,v=t((function(){return o((function(e){var r=function(e){return e.replace(/\D/g,"")}(e);d(r,m?1:0,!0)}),300)}),[d,m]);return r.createElement(i,{onChange:v,value:p+"",className:l.selectionIndicator})};export{u as default};
 //# sourceMappingURL=SelectionIndicator.js.map

package/dist/src/components/Slider/SelectionIndicator.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SelectionIndicator.js","sources":["../../../../src/components/Slider/SelectionIndicator.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport { debounce } from \"~~lodash~~-es\";\nimport TextField from \"../TextField/TextField\";\nimport { useSliderActions, useSliderSelection } from \"./SliderContext\";\nimport { type InfixKind } from \"./Slider.types\";\nimport type VibeComponentProps from \"../../types/VibeComponentProps\";\nimport styles from \"./SelectionIndicator.module.scss\";\n\nconst VALUE_UPDATE_DELAY = 300;\n\nfunction getCurrentLabel(isPostfix: boolean, ranged: boolean, value: number \| number[], valueText: string \| string[]) {\n if (!ranged) {\n return [value as number, valueText as string];\n }\n if (isPostfix) {\n return [(value as number[])[1], (valueText as string[])[1]];\n }\n return [(value as number[])[0], (valueText as string[])[0]];\n}\n\nfunction parseValue(valueText: string) {\n return valueText.replace(/\\D/g, \"\");\n}\n\nexport interface SelectionIndicatorProps extends VibeComponentProps {\n /*\n Determines whether the selection indicator is a prefix or postfix.\n /\n kind?: InfixKind;\n /\n The key for the selection indicator (used for React key uniqueness).\n */\n key?: InfixKind;\n}\n\nconst SelectionIndicator: React.FC<SelectionIndicatorProps> = ({ kind = \"prefix\" }) => {\n const isPostfix = kind === \"postfix\";\n const { ranged, value, valueText } = useSliderSelection();\n const [, currentTextValue] = getCurrentLabel(isPostfix, ranged, value, valueText);\n const { changeThumbValue } = useSliderActions();\n const handleChange = useMemo(\n () =>\n debounce(newValueText => {\n const newValue = parseValue(newValueText);\n const thumbIndex = isPostfix ? 1 : 0;\n changeThumbValue(newValue, thumbIndex, true);\n }, VALUE_UPDATE_DELAY),\n [changeThumbValue, isPostfix]\n );\n return <TextField onChange={handleChange} value={String(currentTextValue)} className={styles.selectionIndicator} />;\n};\n\nexport default SelectionIndicator;\n"],"names":["SelectionIndicator","_ref","_ref$kind","kind","isPostfix","_useSliderSelection","useSliderSelection","_getCurrentLabel","ranged","value","valueText","getCurrentLabel","currentTextValue","_slicedToArray","changeThumbValue","useSliderActions","handleChange","useMemo","debounce","newValueText","newValue","replace","parseValue","React","createElement","TextField","onChange","String","className","styles","selectionIndicator"],"mappings":"~~iUAmCA~~,IAAMA,EAAwD,SAAtCC,GAA8D,IAAAC,EAAAD,EAArBE,KACzDC,EAAqB,kBAD2C,IAAHF,EAAG,SAAQA,GAE9EG,EAAqCC,IACrCC,EA5BF,SAAyBH,EAAoBI,EAAiBC,EAA0BC,GACtF,OAAKF,EAGDJ,EACK,CAAEK,EAAmB,GAAKC,EAAuB,IAEnD,CAAED,EAAmB,GAAKC,EAAuB,IAL/C,CAACD,EAAiBC,EAM7B,CAoB+BC,CAAgBP,EAD/BC,EAANG,OAAaH,EAALI,MAAgBJ,EAATK,WACdE,EAAwEC,EAAAN,EAAA,GAAxD,GACjBO,EAAqBC,IAArBD,iBACFE,EAAeC,GACnB,WAAA,OACEC,GAAS,SAAAC,GACP,IAAMC,EAvBd,SAAoBV,GAClB,OAAOA,EAAUW,QAAQ,MAAO,GAClC,CAqByBC,CAAWH,GAE5BL,EAAiBM,EADEhB,EAAY,EAAI,GACI,EACxC,GAtCoB,IAsCC,GACxB,CAACU,EAAkBV,IAErB,OAAOmB,EAAAC,cAACC,EAAU,CAAAC,SAAUV,EAAcP,MAAcG,EAAPe,GAA0BC,UAAWC,EAAOC,oBAC/F"}
1	+ {"version":3,"file":"SelectionIndicator.js","sources":["../../../../src/components/Slider/SelectionIndicator.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport { debounce } from \"es-toolkit/compat\";\nimport TextField from \"../TextField/TextField\";\nimport { useSliderActions, useSliderSelection } from \"./SliderContext\";\nimport { type InfixKind } from \"./Slider.types\";\nimport type VibeComponentProps from \"../../types/VibeComponentProps\";\nimport styles from \"./SelectionIndicator.module.scss\";\n\nconst VALUE_UPDATE_DELAY = 300;\n\nfunction getCurrentLabel(isPostfix: boolean, ranged: boolean, value: number \| number[], valueText: string \| string[]) {\n if (!ranged) {\n return [value as number, valueText as string];\n }\n if (isPostfix) {\n return [(value as number[])[1], (valueText as string[])[1]];\n }\n return [(value as number[])[0], (valueText as string[])[0]];\n}\n\nfunction parseValue(valueText: string) {\n return valueText.replace(/\\D/g, \"\");\n}\n\nexport interface SelectionIndicatorProps extends VibeComponentProps {\n /*\n Determines whether the selection indicator is a prefix or postfix.\n /\n kind?: InfixKind;\n /\n The key for the selection indicator (used for React key uniqueness).\n */\n key?: InfixKind;\n}\n\nconst SelectionIndicator: React.FC<SelectionIndicatorProps> = ({ kind = \"prefix\" }) => {\n const isPostfix = kind === \"postfix\";\n const { ranged, value, valueText } = useSliderSelection();\n const [, currentTextValue] = getCurrentLabel(isPostfix, ranged, value, valueText);\n const { changeThumbValue } = useSliderActions();\n const handleChange = useMemo(\n () =>\n debounce(newValueText => {\n const newValue = parseValue(newValueText);\n const thumbIndex = isPostfix ? 1 : 0;\n changeThumbValue(newValue, thumbIndex, true);\n }, VALUE_UPDATE_DELAY),\n [changeThumbValue, isPostfix]\n );\n return <TextField onChange={handleChange} value={String(currentTextValue)} className={styles.selectionIndicator} />;\n};\n\nexport default SelectionIndicator;\n"],"names":["SelectionIndicator","_ref","_ref$kind","kind","isPostfix","_useSliderSelection","useSliderSelection","_getCurrentLabel","ranged","value","valueText","getCurrentLabel","currentTextValue","_slicedToArray","changeThumbValue","useSliderActions","handleChange","useMemo","debounce","newValueText","newValue","replace","parseValue","React","createElement","TextField","onChange","String","className","styles","selectionIndicator"],"mappings":"yUAmCA,IAAMA,EAAwD,SAAtCC,GAA8D,IAAAC,EAAAD,EAArBE,KACzDC,EAAqB,kBAD2C,IAAHF,EAAG,SAAQA,GAE9EG,EAAqCC,IACrCC,EA5BF,SAAyBH,EAAoBI,EAAiBC,EAA0BC,GACtF,OAAKF,EAGDJ,EACK,CAAEK,EAAmB,GAAKC,EAAuB,IAEnD,CAAED,EAAmB,GAAKC,EAAuB,IAL/C,CAACD,EAAiBC,EAM7B,CAoB+BC,CAAgBP,EAD/BC,EAANG,OAAaH,EAALI,MAAgBJ,EAATK,WACdE,EAAwEC,EAAAN,EAAA,GAAxD,GACjBO,EAAqBC,IAArBD,iBACFE,EAAeC,GACnB,WAAA,OACEC,GAAS,SAAAC,GACP,IAAMC,EAvBd,SAAoBV,GAClB,OAAOA,EAAUW,QAAQ,MAAO,GAClC,CAqByBC,CAAWH,GAE5BL,EAAiBM,EADEhB,EAAY,EAAI,GACI,EACxC,GAtCoB,IAsCC,GACxB,CAACU,EAAkBV,IAErB,OAAOmB,EAAAC,cAACC,EAAU,CAAAC,SAAUV,EAAcP,MAAcG,EAAPe,GAA0BC,UAAWC,EAAOC,oBAC/F"}

package/dist/src/components/Slider/SelectionIndicator.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={selectionIndicator:"selectionIndicator_429ea55e23"};!function(e){const t="s_id-a25847c4cc71_3_61_1";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const i=document.createElement("style");i.id=t,n.firstChild?n.insertBefore(i,n.firstChild):n.appendChild(i),i.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".selectionIndicator_429ea55e23.selectionIndicator_429ea55e23.selectionIndicator_429ea55e23 {\n  text-align: center;\n  padding: var(--spacing-small);\n}");export{e as default};
+var e={selectionIndicator:"selectionIndicator_baeaa56c65"};!function(e){const t="s_id-a25847c4cc71_3_62_0";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const a=document.createElement("style");a.id=t,n.firstChild?n.insertBefore(a,n.firstChild):n.appendChild(a),a.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".selectionIndicator_baeaa56c65.selectionIndicator_baeaa56c65.selectionIndicator_baeaa56c65 {\n  text-align: center;\n  padding: var(--spacing-small);\n}");export{e as default};
 //# sourceMappingURL=SelectionIndicator.module.scss.js.map

package/dist/src/components/Slider/Slider.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{defineProperty as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import i,{forwardRef as o,useRef as t,useMemo as r}from"react";import{BASE_SIZES as a}from"../../constants/sizes.js";import l from"../../hooks/useMergeRef.js";import{NOOP as s}from"../../utils/function-utils.js";import{ensureDefaultValue as d}from"./SliderHelpers.js";import{SliderProvider as n}from"./SliderContext.js";import m from"./SliderBase/SliderBase.js";import p from"./SliderInfix.js";import{SliderColor as u}from"./SliderConstants.js";import c from"classnames";import{withStaticProps as f}from"../../types/withStaticProps.js";import"../../utils/colors-vars-map.js";import v from"./Slider.module.scss.js";import{getStyle as b}from"../../helpers/typesciptCssModulesHelper.js";import{camelCase as j}from"lodash-es";var x=f(o((function(o,a){var u=o.ariaLabel,f=o.ariaLabelledby,x=o.className,S=o.color,h=o["data-testid"],L=void 0===h?"monday-slider":h,y=o.disabled,C=void 0!==y&&y,P=o.id,g=o.max,E=void 0===g?100:g,k=o.min,I=void 0===k?0:k,w=o.onChange,z=void 0===w?s:w,F=o.ranged,V=void 0!==F&&F,B=o.step,H=void 0===B?1:B,T=o.showValue,M=void 0!==T&&T,N=o.valueLabelPosition,O=void 0===N?"top":N,R=o.valueLabelColor,W=void 0===R?"primary":R,X=o.size,_=void 0===X?"small":X,q=o.value,A=o.defaultValue,D=void 0===A?0:A,G=o.valueFormatter,J=void 0===G?function(e){return"".concat(e,"%")}:G,K=o.valueText,Q=o.indicateSelection,U=void 0!==Q&&Q,Y=o.prefix,Z=o.postfix,$=o.selectionIndicatorWidth,ee=void 0===$?"60px":$,ie=t(null),oe=l(a,ie),te=r((function(){return{prefix:Y,postfix:Z,indicateSelection:U,selectionIndicatorWidth:ee}}),[Y,Z,U,ee]);return i.createElement(n,{ariaLabel:u,ariaLabelledby:f,color:S,"data-testid":L,disabled:C,infixOptions:te,max:E,min:I,onChange:z,ranged:V,showValue:M,valueLabelPosition:O,valueLabelColor:W,size:_,step:H,value:q,defaultValue:d(D,I,E,V),valueFormatter:J,valueText:K},i.createElement("div",{className:c(v.slider,e({},v.valueShown,M),b(v,j("position-"+O)),x),"data-testid":L,id:P,ref:oe},i.createElement(p,{kind:p.kinds.PREFIX}),i.createElement(m,null),i.createElement(p,{kind:p.kinds.POSTFIX})))})),{sizes:a,colors:u});export{x as default};
+import{defineProperty as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import i,{forwardRef as o,useRef as t,useMemo as r}from"react";import{BASE_SIZES as a}from"../../constants/sizes.js";import l from"../../hooks/useMergeRef.js";import{NOOP as s}from"../../utils/function-utils.js";import{ensureDefaultValue as d}from"./SliderHelpers.js";import{SliderProvider as n}from"./SliderContext.js";import m from"./SliderBase/SliderBase.js";import p from"./SliderInfix.js";import{SliderColor as u}from"./SliderConstants.js";import c from"classnames";import{withStaticProps as f}from"../../types/withStaticProps.js";import"../../utils/colors-vars-map.js";import v from"./Slider.module.scss.js";import{getStyle as b}from"../../helpers/typesciptCssModulesHelper.js";import{camelCase as j}from"es-toolkit";var x=f(o((function(o,a){var u=o.ariaLabel,f=o.ariaLabelledby,x=o.className,S=o.color,h=o["data-testid"],L=void 0===h?"monday-slider":h,y=o.disabled,C=void 0!==y&&y,P=o.id,g=o.max,k=void 0===g?100:g,E=o.min,I=void 0===E?0:E,w=o.onChange,z=void 0===w?s:w,F=o.ranged,V=void 0!==F&&F,B=o.step,H=void 0===B?1:B,T=o.showValue,M=void 0!==T&&T,N=o.valueLabelPosition,O=void 0===N?"top":N,R=o.valueLabelColor,W=void 0===R?"primary":R,X=o.size,_=void 0===X?"small":X,q=o.value,A=o.defaultValue,D=void 0===A?0:A,G=o.valueFormatter,J=void 0===G?function(e){return"".concat(e,"%")}:G,K=o.valueText,Q=o.indicateSelection,U=void 0!==Q&&Q,Y=o.prefix,Z=o.postfix,$=o.selectionIndicatorWidth,ee=void 0===$?"60px":$,ie=t(null),oe=l(a,ie),te=r((function(){return{prefix:Y,postfix:Z,indicateSelection:U,selectionIndicatorWidth:ee}}),[Y,Z,U,ee]);return i.createElement(n,{ariaLabel:u,ariaLabelledby:f,color:S,"data-testid":L,disabled:C,infixOptions:te,max:k,min:I,onChange:z,ranged:V,showValue:M,valueLabelPosition:O,valueLabelColor:W,size:_,step:H,value:q,defaultValue:d(D,I,k,V),valueFormatter:J,valueText:K},i.createElement("div",{className:c(v.slider,e({},v.valueShown,M),b(v,j("position-"+O)),x),"data-testid":L,id:P,ref:oe},i.createElement(p,{kind:p.kinds.PREFIX}),i.createElement(m,null),i.createElement(p,{kind:p.kinds.POSTFIX})))})),{sizes:a,colors:u});export{x as default};
 //# sourceMappingURL=Slider.js.map

package/dist/src/components/Slider/Slider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Slider.js","sources":["../../../../src/components/Slider/Slider.tsx"],"sourcesContent":["import React, { forwardRef, type ReactElement, useMemo, useRef } from \"react\";\nimport { BASE_SIZES } from \"../../constants\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport { ensureDefaultValue } from \"./SliderHelpers\";\nimport { SliderProvider } from \"./SliderContext\";\nimport SliderBase from \"./SliderBase/SliderBase\";\nimport SliderInfix from \"./SliderInfix\";\nimport { type IconType } from \"../Icon\";\nimport { SliderColor as SliderColorEnum } from \"./SliderConstants\";\nimport cx from \"classnames\";\nimport { withStaticProps } from \"../../types\";\nimport styles from \"./Slider.module.scss\";\nimport { type SliderColor, type SliderLabelColor, type SliderLabelPosition, type SliderSize } from \"./Slider.types\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport { camelCase } from \"~~lodash~~-es\";\n\nexport type SliderProps = {\n /*\n Define a string that labels the current element (Slider)\n /\n ariaLabel?: string;\n /\n ElementId of Node that have the text needed for labeling the current element (Slider)\n /\n ariaLabelledby?: string;\n /\n Custom `class name` to be added to the component-root-node\n /\n className?: string;\n /\n Color Mode (primary/positive/negative) of the component (Slider)\n /\n color?: SliderColor;\n /\n Unique TestId - can be used as Selector for integration tests and other needs (tracking, etc)\n /\n \"data-testid\"?: string;\n defaultValue?: number \| number[];\n /\n Formatter function `value => formattedValue`\n * default formatter return `${value}%`\n /\n /\n If set to true, Component (Slider) will be disabled\n * - impossible to change value of component (Slider)\n * - visual changes (opacity)\n /\n disabled?: boolean;\n /\n Attribute `id` to be added to the component-root-node\n /\n id?: string;\n /\n Max range value of the component (Slider)\n /\n max?: number;\n /\n Min range value of the component (Slider)\n /\n min?: number;\n /\n Optional onChange callback (for outer trigger or Controlled mode)\n * - required in Controlled Mode\n /\n onChange?: (value: number \| number[]) => void;\n /\n If true switch slider to RRange mode (two Thumbs)\n /\n ranged?: boolean;\n /\n The granularity with which the slider can step through values.\n * (A \"discrete\" slider.) The min prop serves as the origin for the valid values.\n * We recommend (max - min) to be evenly divisible by the step.\n /\n step?: number;\n /\n Always show `value` instead of Tooltip\n /\n showValue?: boolean;\n /\n Position of the `value` when `showValue` is true\n /\n valueLabelPosition?: SliderLabelPosition;\n /\n Color of the `value` when `showValue` is true\n /\n valueLabelColor?: SliderLabelColor;\n /\n Size small/medium/large of the component (Slider)\n /\n size?: SliderSize;\n /\n Current/selected value of the range of the Component (Slider)\n * - should be used in Controlled Mode only\n * - in ranged mode should be an array of two numbers\n /\n value?: number \| number[];\n /\n Function to format the value, e.g. add %. By default, returns `${value}%`\n /\n valueFormatter?: (value: number) => string;\n /\n Text/presentation of current/selected value\n * - should be used in Controlled Mode only\n /\n valueText?: string;\n /\n Show selected from Slider range value\n /\n indicateSelection?: boolean;\n /\n Options for initial/start/prefix element, it can be one of:\n * - Any Component (react component, node, text, number etc.)\n * - Or it can be an object of options for Icons component (see Icon components props)\n * - Or it can be an object for Label (Icon, Heading - and other components)\n * - Or it can be Render Props Function witch are getting value and valueText\n /\n prefix?: { icon: IconType } \| string \| ((value: number, valueText: string) => void) \| ReactElement;\n /\n Options for postfix/end/finishing element. Same as prefix element.\n /\n postfix?: { icon: IconType } \| string \| ((value: number, valueText: string) => void) \| ReactElement;\n /\n Width of SelectionIndicator (i.e. TextField)\n */\n selectionIndicatorWidth?: string;\n};\n\nconst Slider = forwardRef(\n (\n {\n ariaLabel,\n ariaLabelledby,\n className,\n color,\n \"data-testid\": dataTestId = \"monday-slider\",\n disabled = false,\n id,\n max = 100,\n min = 0,\n onChange = NOOP,\n ranged = false,\n step = 1,\n showValue = false,\n valueLabelPosition = \"top\",\n valueLabelColor = \"primary\",\n size = \"small\",\n value,\n defaultValue = 0,\n valueFormatter = (value: number) => `${value}%`,\n valueText,\n indicateSelection = false,\n prefix,\n postfix,\n selectionIndicatorWidth = \"60px\"\n }: SliderProps,\n ref: React.ForwardedRef<HTMLElement>\n ) => {\n const componentRef = useRef(null);\n const mergedRef = useMergeRef(ref, componentRef);\n const infixOptions = useMemo(\n () => ({ prefix, postfix, indicateSelection, selectionIndicatorWidth }),\n [prefix, postfix, indicateSelection, selectionIndicatorWidth]\n );\n return (\n <SliderProvider\n ariaLabel={ariaLabel}\n ariaLabelledby={ariaLabelledby}\n color={color}\n data-testid={dataTestId}\n disabled={disabled}\n infixOptions={infixOptions}\n max={max}\n min={min}\n onChange={onChange}\n ranged={ranged}\n showValue={showValue}\n valueLabelPosition={valueLabelPosition}\n valueLabelColor={valueLabelColor}\n size={size}\n step={step}\n value={value}\n defaultValue={ensureDefaultValue(defaultValue, min, max, ranged)}\n valueFormatter={valueFormatter}\n valueText={valueText}\n >\n <div\n className={cx(\n styles.slider,\n { [styles.valueShown]: showValue },\n getStyle(styles, camelCase(\"position-\" + valueLabelPosition)),\n className\n )}\n data-testid={dataTestId}\n id={id}\n ref={mergedRef}\n >\n <SliderInfix kind={SliderInfix.kinds.PREFIX} />\n <SliderBase />\n <SliderInfix kind={SliderInfix.kinds.POSTFIX} />\n </div>\n </SliderProvider>\n );\n }\n);\n\ninterface SliderStaticProps {\n sizes: typeof BASE_SIZES;\n colors: typeof SliderColorEnum;\n}\n\nexport default withStaticProps<SliderProps, SliderStaticProps>(Slider, {\n sizes: BASE_SIZES,\n colors: SliderColorEnum\n});\n"],"names":["withStaticProps","forwardRef","_ref","ref","ariaLabel","ariaLabelledby","className","color","_ref$dataTestid","dataTestId","_ref$disabled","disabled","id","_ref$max","max","_ref$min","min","_ref$onChange","onChange","NOOP","_ref$ranged","ranged","_ref$step","step","_ref$showValue","showValue","_ref$valueLabelPositi","valueLabelPosition","_ref$valueLabelColor","valueLabelColor","_ref$size","size","value","_ref$defaultValue","defaultValue","_ref$valueFormatter","valueFormatter","concat","valueText","_ref$indicateSelectio","indicateSelection","prefix","postfix","_ref$selectionIndicat","selectionIndicatorWidth","componentRef","useRef","mergedRef","useMergeRef","infixOptions","useMemo","React","createElement","SliderProvider","ensureDefaultValue","cx","styles","slider","_defineProperty","valueShown","getStyle","camelCase","SliderInfix","kind","kinds","PREFIX","SliderBase","POSTFIX","sizes","BASE_SIZES","colors","SliderColorEnum"],"mappings":"~~kyBAiIA~~,IAmFeA,EAAAA,EAnFAC,GACb,SAAAC,EA2BEC,GACE,IA1BAC,EAASF,EAATE,UACAC,EAAcH,EAAdG,eACAC,EAASJ,EAATI,UACAC,EAAKL,EAALK,MAAKC,EAAAN,EACL,eAAeO,OAAa,IAAHD,EAAG,gBAAeA,EAAAE,EAAAR,EAC3CS,SAAAA,OAAW,IAAHD,GAAQA,EAChBE,EAAEV,EAAFU,GAAEC,EAAAX,EACFY,IAAAA,OAAM,IAAHD,EAAG,IAAGA,EAAAE,EAAAb,EACTc,IAAAA,OAAM,IAAHD,EAAG,EAACA,EAAAE,EAAAf,EACPgB,SAAAA,OAAWC,IAAHF,EAAGE,EAAIF,EAAAG,EAAAlB,EACfmB,OAAAA,OAAS,IAAHD,GAAQA,EAAAE,EAAApB,EACdqB,KAAAA,OAAO,IAAHD,EAAG,EAACA,EAAAE,EAAAtB,EACRuB,UAAAA,OAAY,IAAHD,GAAQA,EAAAE,EAAAxB,EACjByB,mBAAAA,OAAqB,IAAHD,EAAG,MAAKA,EAAAE,EAAA1B,EAC1B2B,gBAAAA,OAAkB,IAAHD,EAAG,UAASA,EAAAE,EAAA5B,EAC3B6B,KAAAA,OAAO,IAAHD,EAAG,QAAOA,EACdE,EAAK9B,EAAL8B,MAAKC,EAAA/B,EACLgC,aAAAA,OAAe,IAAHD,EAAG,EAACA,EAAAE,EAAAjC,EAChBkC,eAAAA,OAAiB,IAAHD,EAAG,SAACH,GAAa,MAAAK,GAAAA,OAAQL,EAAK,IAAA,EAAGG,EAC/CG,EAASpC,EAAToC,UAASC,EAAArC,EACTsC,kBAAAA,OAAoB,IAAHD,GAAQA,EACzBE,EAAMvC,EAANuC,OACAC,EAAOxC,EAAPwC,QAAOC,EAAAzC,EACP0C,wBAAAA,QAA0B,IAAHD,EAAG,OAAMA,EAI5BE,GAAeC,EAAO,MACtBC,GAAYC,EAAY7C,EAAK0C,IAC7BI,GAAeC,GACnB,WAAA,MAAO,CAAET,OAAAA,EAAQC,QAAAA,EAASF,kBAAAA,EAAmBI,wBAAAA,GAA0B,GACvE,CAACH,EAAQC,EAASF,EAAmBI,KAEvC,OACEO,EAACC,cAAAC,GACCjD,UAAWA,EACXC,eAAgBA,EAChBE,MAAOA,EACM,cAAAE,EACbE,SAAUA,EACVsC,aAAcA,GACdnC,IAAKA,EACLE,IAAKA,EACLE,SAAUA,EACVG,OAAQA,EACRI,UAAWA,EACXE,mBAAoBA,EACpBE,gBAAiBA,EACjBE,KAAMA,EACNR,KAAMA,EACNS,MAAOA,EACPE,aAAcoB,EAAmBpB,EAAclB,EAAKF,EAAKO,GACzDe,eAAgBA,EAChBE,UAAWA,GAEXa,EAAAC,cAAA,MAAA,CACE9C,UAAWiD,EACTC,EAAOC,OAAMC,EACVF,CAAAA,EAAAA,EAAOG,WAAalC,GACvBmC,EAASJ,EAAQK,EAAU,YAAclC,IACzCrB,GAEW,cAAAG,EACbG,GAAIA,EACJT,IAAK4C,IAELI,EAACC,cAAAU,GAAYC,KAAMD,EAAYE,MAAMC,SACrCd,EAAAC,cAACc,EAAa,MACdf,EAAAC,cAACU,EAAW,CAACC,KAAMD,EAAYE,MAAMG,WAI7C,IAQqE,CACrEC,MAAOC,EACPC,OAAQC"}
1	+ {"version":3,"file":"Slider.js","sources":["../../../../src/components/Slider/Slider.tsx"],"sourcesContent":["import React, { forwardRef, type ReactElement, useMemo, useRef } from \"react\";\nimport { BASE_SIZES } from \"../../constants\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport { ensureDefaultValue } from \"./SliderHelpers\";\nimport { SliderProvider } from \"./SliderContext\";\nimport SliderBase from \"./SliderBase/SliderBase\";\nimport SliderInfix from \"./SliderInfix\";\nimport { type IconType } from \"../Icon\";\nimport { SliderColor as SliderColorEnum } from \"./SliderConstants\";\nimport cx from \"classnames\";\nimport { withStaticProps } from \"../../types\";\nimport styles from \"./Slider.module.scss\";\nimport { type SliderColor, type SliderLabelColor, type SliderLabelPosition, type SliderSize } from \"./Slider.types\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport { camelCase } from \"es-toolkit\";\n\nexport type SliderProps = {\n /*\n Define a string that labels the current element (Slider)\n /\n ariaLabel?: string;\n /\n ElementId of Node that have the text needed for labeling the current element (Slider)\n /\n ariaLabelledby?: string;\n /\n Custom `class name` to be added to the component-root-node\n /\n className?: string;\n /\n Color Mode (primary/positive/negative) of the component (Slider)\n /\n color?: SliderColor;\n /\n Unique TestId - can be used as Selector for integration tests and other needs (tracking, etc)\n /\n \"data-testid\"?: string;\n defaultValue?: number \| number[];\n /\n Formatter function `value => formattedValue`\n * default formatter return `${value}%`\n /\n /\n If set to true, Component (Slider) will be disabled\n * - impossible to change value of component (Slider)\n * - visual changes (opacity)\n /\n disabled?: boolean;\n /\n Attribute `id` to be added to the component-root-node\n /\n id?: string;\n /\n Max range value of the component (Slider)\n /\n max?: number;\n /\n Min range value of the component (Slider)\n /\n min?: number;\n /\n Optional onChange callback (for outer trigger or Controlled mode)\n * - required in Controlled Mode\n /\n onChange?: (value: number \| number[]) => void;\n /\n If true switch slider to RRange mode (two Thumbs)\n /\n ranged?: boolean;\n /\n The granularity with which the slider can step through values.\n * (A \"discrete\" slider.) The min prop serves as the origin for the valid values.\n * We recommend (max - min) to be evenly divisible by the step.\n /\n step?: number;\n /\n Always show `value` instead of Tooltip\n /\n showValue?: boolean;\n /\n Position of the `value` when `showValue` is true\n /\n valueLabelPosition?: SliderLabelPosition;\n /\n Color of the `value` when `showValue` is true\n /\n valueLabelColor?: SliderLabelColor;\n /\n Size small/medium/large of the component (Slider)\n /\n size?: SliderSize;\n /\n Current/selected value of the range of the Component (Slider)\n * - should be used in Controlled Mode only\n * - in ranged mode should be an array of two numbers\n /\n value?: number \| number[];\n /\n Function to format the value, e.g. add %. By default, returns `${value}%`\n /\n valueFormatter?: (value: number) => string;\n /\n Text/presentation of current/selected value\n * - should be used in Controlled Mode only\n /\n valueText?: string;\n /\n Show selected from Slider range value\n /\n indicateSelection?: boolean;\n /\n Options for initial/start/prefix element, it can be one of:\n * - Any Component (react component, node, text, number etc.)\n * - Or it can be an object of options for Icons component (see Icon components props)\n * - Or it can be an object for Label (Icon, Heading - and other components)\n * - Or it can be Render Props Function witch are getting value and valueText\n /\n prefix?: { icon: IconType } \| string \| ((value: number, valueText: string) => void) \| ReactElement;\n /\n Options for postfix/end/finishing element. Same as prefix element.\n /\n postfix?: { icon: IconType } \| string \| ((value: number, valueText: string) => void) \| ReactElement;\n /\n Width of SelectionIndicator (i.e. TextField)\n */\n selectionIndicatorWidth?: string;\n};\n\nconst Slider = forwardRef(\n (\n {\n ariaLabel,\n ariaLabelledby,\n className,\n color,\n \"data-testid\": dataTestId = \"monday-slider\",\n disabled = false,\n id,\n max = 100,\n min = 0,\n onChange = NOOP,\n ranged = false,\n step = 1,\n showValue = false,\n valueLabelPosition = \"top\",\n valueLabelColor = \"primary\",\n size = \"small\",\n value,\n defaultValue = 0,\n valueFormatter = (value: number) => `${value}%`,\n valueText,\n indicateSelection = false,\n prefix,\n postfix,\n selectionIndicatorWidth = \"60px\"\n }: SliderProps,\n ref: React.ForwardedRef<HTMLElement>\n ) => {\n const componentRef = useRef(null);\n const mergedRef = useMergeRef(ref, componentRef);\n const infixOptions = useMemo(\n () => ({ prefix, postfix, indicateSelection, selectionIndicatorWidth }),\n [prefix, postfix, indicateSelection, selectionIndicatorWidth]\n );\n return (\n <SliderProvider\n ariaLabel={ariaLabel}\n ariaLabelledby={ariaLabelledby}\n color={color}\n data-testid={dataTestId}\n disabled={disabled}\n infixOptions={infixOptions}\n max={max}\n min={min}\n onChange={onChange}\n ranged={ranged}\n showValue={showValue}\n valueLabelPosition={valueLabelPosition}\n valueLabelColor={valueLabelColor}\n size={size}\n step={step}\n value={value}\n defaultValue={ensureDefaultValue(defaultValue, min, max, ranged)}\n valueFormatter={valueFormatter}\n valueText={valueText}\n >\n <div\n className={cx(\n styles.slider,\n { [styles.valueShown]: showValue },\n getStyle(styles, camelCase(\"position-\" + valueLabelPosition)),\n className\n )}\n data-testid={dataTestId}\n id={id}\n ref={mergedRef}\n >\n <SliderInfix kind={SliderInfix.kinds.PREFIX} />\n <SliderBase />\n <SliderInfix kind={SliderInfix.kinds.POSTFIX} />\n </div>\n </SliderProvider>\n );\n }\n);\n\ninterface SliderStaticProps {\n sizes: typeof BASE_SIZES;\n colors: typeof SliderColorEnum;\n}\n\nexport default withStaticProps<SliderProps, SliderStaticProps>(Slider, {\n sizes: BASE_SIZES,\n colors: SliderColorEnum\n});\n"],"names":["withStaticProps","forwardRef","_ref","ref","ariaLabel","ariaLabelledby","className","color","_ref$dataTestid","dataTestId","_ref$disabled","disabled","id","_ref$max","max","_ref$min","min","_ref$onChange","onChange","NOOP","_ref$ranged","ranged","_ref$step","step","_ref$showValue","showValue","_ref$valueLabelPositi","valueLabelPosition","_ref$valueLabelColor","valueLabelColor","_ref$size","size","value","_ref$defaultValue","defaultValue","_ref$valueFormatter","valueFormatter","concat","valueText","_ref$indicateSelectio","indicateSelection","prefix","postfix","_ref$selectionIndicat","selectionIndicatorWidth","componentRef","useRef","mergedRef","useMergeRef","infixOptions","useMemo","React","createElement","SliderProvider","ensureDefaultValue","cx","styles","slider","_defineProperty","valueShown","getStyle","camelCase","SliderInfix","kind","kinds","PREFIX","SliderBase","POSTFIX","sizes","BASE_SIZES","colors","SliderColorEnum"],"mappings":"myBAiIA,IAmFeA,EAAAA,EAnFAC,GACb,SAAAC,EA2BEC,GACE,IA1BAC,EAASF,EAATE,UACAC,EAAcH,EAAdG,eACAC,EAASJ,EAATI,UACAC,EAAKL,EAALK,MAAKC,EAAAN,EACL,eAAeO,OAAa,IAAHD,EAAG,gBAAeA,EAAAE,EAAAR,EAC3CS,SAAAA,OAAW,IAAHD,GAAQA,EAChBE,EAAEV,EAAFU,GAAEC,EAAAX,EACFY,IAAAA,OAAM,IAAHD,EAAG,IAAGA,EAAAE,EAAAb,EACTc,IAAAA,OAAM,IAAHD,EAAG,EAACA,EAAAE,EAAAf,EACPgB,SAAAA,OAAWC,IAAHF,EAAGE,EAAIF,EAAAG,EAAAlB,EACfmB,OAAAA,OAAS,IAAHD,GAAQA,EAAAE,EAAApB,EACdqB,KAAAA,OAAO,IAAHD,EAAG,EAACA,EAAAE,EAAAtB,EACRuB,UAAAA,OAAY,IAAHD,GAAQA,EAAAE,EAAAxB,EACjByB,mBAAAA,OAAqB,IAAHD,EAAG,MAAKA,EAAAE,EAAA1B,EAC1B2B,gBAAAA,OAAkB,IAAHD,EAAG,UAASA,EAAAE,EAAA5B,EAC3B6B,KAAAA,OAAO,IAAHD,EAAG,QAAOA,EACdE,EAAK9B,EAAL8B,MAAKC,EAAA/B,EACLgC,aAAAA,OAAe,IAAHD,EAAG,EAACA,EAAAE,EAAAjC,EAChBkC,eAAAA,OAAiB,IAAHD,EAAG,SAACH,GAAa,MAAAK,GAAAA,OAAQL,EAAK,IAAA,EAAGG,EAC/CG,EAASpC,EAAToC,UAASC,EAAArC,EACTsC,kBAAAA,OAAoB,IAAHD,GAAQA,EACzBE,EAAMvC,EAANuC,OACAC,EAAOxC,EAAPwC,QAAOC,EAAAzC,EACP0C,wBAAAA,QAA0B,IAAHD,EAAG,OAAMA,EAI5BE,GAAeC,EAAO,MACtBC,GAAYC,EAAY7C,EAAK0C,IAC7BI,GAAeC,GACnB,WAAA,MAAO,CAAET,OAAAA,EAAQC,QAAAA,EAASF,kBAAAA,EAAmBI,wBAAAA,GAA0B,GACvE,CAACH,EAAQC,EAASF,EAAmBI,KAEvC,OACEO,EAACC,cAAAC,GACCjD,UAAWA,EACXC,eAAgBA,EAChBE,MAAOA,EACM,cAAAE,EACbE,SAAUA,EACVsC,aAAcA,GACdnC,IAAKA,EACLE,IAAKA,EACLE,SAAUA,EACVG,OAAQA,EACRI,UAAWA,EACXE,mBAAoBA,EACpBE,gBAAiBA,EACjBE,KAAMA,EACNR,KAAMA,EACNS,MAAOA,EACPE,aAAcoB,EAAmBpB,EAAclB,EAAKF,EAAKO,GACzDe,eAAgBA,EAChBE,UAAWA,GAEXa,EAAAC,cAAA,MAAA,CACE9C,UAAWiD,EACTC,EAAOC,OAAMC,EACVF,CAAAA,EAAAA,EAAOG,WAAalC,GACvBmC,EAASJ,EAAQK,EAAU,YAAclC,IACzCrB,GAEW,cAAAG,EACbG,GAAIA,EACJT,IAAK4C,IAELI,EAACC,cAAAU,GAAYC,KAAMD,EAAYE,MAAMC,SACrCd,EAAAC,cAACc,EAAa,MACdf,EAAAC,cAACU,EAAW,CAACC,KAAMD,EAAYE,MAAMG,WAI7C,IAQqE,CACrEC,MAAOC,EACPC,OAAQC"}

package/dist/src/components/Slider/Slider.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={slider:"slider_0e2eaeae89",valueShown:"valueShown_ada1eaee65",positionTop:"positionTop_e92e8fb599",positionBottom:"positionBottom_3420cbfa62"};!function(e){const n="s_id-4e41ea5b2e41_3_61_1";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const o=document.createElement("style");o.id=n,t.firstChild?t.insertBefore(o,t.firstChild):t.appendChild(o),o.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".slider_0e2eaeae89 {\n  align-items: center;\n  display: flex;\n  max-width: 500px;\n  min-width: 200px;\n  width: 100%;\n}\n\n.valueShown_ada1eaee65.positionTop_e92e8fb599 {\n  margin-top: 10px;\n}\n\n.valueShown_ada1eaee65.positionBottom_3420cbfa62 {\n  margin-bottom: 10px;\n}");export{e as default};
+var e={slider:"slider_e51786ebd3",valueShown:"valueShown_0c8758fe66",positionTop:"positionTop_9ad5ed5e83",positionBottom:"positionBottom_9efdbbd1c3"};!function(e){const n="s_id-4e41ea5b2e41_3_62_0";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const o=document.createElement("style");o.id=n,t.firstChild?t.insertBefore(o,t.firstChild):t.appendChild(o),o.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".slider_e51786ebd3 {\n  align-items: center;\n  display: flex;\n  max-width: 500px;\n  min-width: 200px;\n  width: 100%;\n}\n\n.valueShown_0c8758fe66.positionTop_9ad5ed5e83 {\n  margin-top: 10px;\n}\n\n.valueShown_0c8758fe66.positionBottom_9efdbbd1c3 {\n  margin-bottom: 10px;\n}");export{e as default};
 //# sourceMappingURL=Slider.module.scss.js.map

package/dist/src/components/Slider/SliderBase/SliderBase.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={base:"base_0d0fbf287c",disabled:"disabled_38353d4d72",small:"small_226762bc9e",medium:"medium_2b9037c9b2",large:"large_2b9037c9b2"};!function(e){const n="s_id-0abb9e445f96_3_61_1";if("undefined"!=typeof document){const d=document.head||document.getElementsByTagName("head")[0];if(d.querySelector("#"+n))return;const a=document.createElement("style");a.id=n,d.firstChild?d.insertBefore(a,d.firstChild):d.appendChild(a),a.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".base_0d0fbf287c {\n  display: flex;\n  touch-action: none;\n  -webkit-tap-highlight-color: transparent;\n  width: 100%;\n}\n\n.disabled_38353d4d72 {\n  cursor: not-allowed !important;\n  opacity: var(--disabled-component-opacity);\n}\n\n.disabled_38353d4d72 * {\n  pointer-events: none;\n}\n\n.small_226762bc9e {\n  padding: 0 var(--spacing-small);\n}\n\n.medium_2b9037c9b2 {\n  padding: 0 12px;\n}\n\n.large_2b9037c9b2 {\n  padding: 0 12px;\n}");export{e as default};
+var e={base:"base_7270303e6d",disabled:"disabled_58d0357753",small:"small_004c4d971b",medium:"medium_25a687ceb0",large:"large_25a687ceb0"};!function(e){const n="s_id-0abb9e445f96_3_62_0";if("undefined"!=typeof document){const d=document.head||document.getElementsByTagName("head")[0];if(d.querySelector("#"+n))return;const a=document.createElement("style");a.id=n,d.firstChild?d.insertBefore(a,d.firstChild):d.appendChild(a),a.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".base_7270303e6d {\n  display: flex;\n  touch-action: none;\n  -webkit-tap-highlight-color: transparent;\n  width: 100%;\n}\n\n.disabled_58d0357753 {\n  cursor: not-allowed !important;\n  opacity: var(--disabled-component-opacity);\n}\n\n.disabled_58d0357753 * {\n  pointer-events: none;\n}\n\n.small_004c4d971b {\n  padding: 0 var(--spacing-small);\n}\n\n.medium_25a687ceb0 {\n  padding: 0 12px;\n}\n\n.large_25a687ceb0 {\n  padding: 0 12px;\n}");export{e as default};
 //# sourceMappingURL=SliderBase.module.scss.js.map

package/dist/src/components/Slider/SliderBase/SliderFilledTrack.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={filledTrack:"filledTrack_b71d24c685",positive:"positive_b8a259dbbc",negative:"negative_ece14c83f1"};!function(e){const n="s_id-bb386829c5aa_3_61_1";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const i=document.createElement("style");i.id=n,t.firstChild?t.insertBefore(i,t.firstChild):t.appendChild(i),i.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".filledTrack_b71d24c685 {\n  position: absolute;\n  border-radius: inherit;\n  background-color: var(--primary-color);\n  height: inherit;\n  top: 50%;\n  transform: translateY(-50%);\n  width: 100%;\n}\n\n.positive_b8a259dbbc {\n  background-color: var(--positive-color);\n}\n\n.negative_ece14c83f1 {\n  background-color: var(--negative-color);\n}");export{e as default};
+var e={filledTrack:"filledTrack_ae8b9101b8",positive:"positive_b40ba5db9e",negative:"negative_3a4ae8b4dd"};!function(e){const n="s_id-bb386829c5aa_3_62_0";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const a=document.createElement("style");a.id=n,t.firstChild?t.insertBefore(a,t.firstChild):t.appendChild(a),a.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".filledTrack_ae8b9101b8 {\n  position: absolute;\n  border-radius: inherit;\n  background-color: var(--primary-color);\n  height: inherit;\n  top: 50%;\n  transform: translateY(-50%);\n  width: 100%;\n}\n\n.positive_b40ba5db9e {\n  background-color: var(--positive-color);\n}\n\n.negative_3a4ae8b4dd {\n  background-color: var(--negative-color);\n}");export{e as default};
 //# sourceMappingURL=SliderFilledTrack.module.scss.js.map

package/dist/src/components/Slider/SliderBase/SliderRail.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={rail:"rail_5d0afcfa9b",small:"small_21f8241d2e",medium:"medium_63685fb395",large:"large_0a3eecff36"};!function(e){const n="s_id-c66a4285003d_3_61_1";if("undefined"!=typeof document){const i=document.head||document.getElementsByTagName("head")[0];if(i.querySelector("#"+n))return;const d=document.createElement("style");d.id=n,i.firstChild?i.insertBefore(d,i.firstChild):i.appendChild(d),d.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".rail_5d0afcfa9b {\n  cursor: pointer;\n  display: inline-block;\n  position: relative;\n  touch-action: none;\n  -webkit-tap-highlight-color: transparent;\n  width: 100%;\n}\n\n.small_21f8241d2e {\n  border-radius: 2px;\n  height: 2px;\n  padding: 8px 0;\n}\n\n.medium_63685fb395 {\n  border-radius: 2px;\n  height: 4px;\n  padding: 12px 0;\n}\n\n.large_0a3eecff36 {\n  border-radius: 8px;\n  height: 8px;\n  padding: 10px 0;\n}");export{e as default};
+var e={rail:"rail_47e1e663a5",small:"small_2e2d344b31",medium:"medium_425b2e39a1",large:"large_337bff47df"};!function(e){const n="s_id-c66a4285003d_3_62_0";if("undefined"!=typeof document){const i=document.head||document.getElementsByTagName("head")[0];if(i.querySelector("#"+n))return;const d=document.createElement("style");d.id=n,i.firstChild?i.insertBefore(d,i.firstChild):i.appendChild(d),d.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".rail_47e1e663a5 {\n  cursor: pointer;\n  display: inline-block;\n  position: relative;\n  touch-action: none;\n  -webkit-tap-highlight-color: transparent;\n  width: 100%;\n}\n\n.small_2e2d344b31 {\n  border-radius: 2px;\n  height: 2px;\n  padding: 8px 0;\n}\n\n.medium_425b2e39a1 {\n  border-radius: 2px;\n  height: 4px;\n  padding: 12px 0;\n}\n\n.large_337bff47df {\n  border-radius: 8px;\n  height: 8px;\n  padding: 10px 0;\n}");export{e as default};
 //# sourceMappingURL=SliderRail.module.scss.js.map

package/dist/src/components/Slider/SliderBase/SliderThumb.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{defineProperty as e}from"../../../../_virtual/_rollupPluginBabelHelpers.js";import o,{useRef as t,useEffect as a}from"react";import{NOOP as r}from"../../../utils/function-utils.js";import n from"../../Tooltip/Tooltip.js";import{TOOLTIP_SHOW_DELAY as i}from"../SliderConstants.js";import{useSliderSelection as l,useSliderUi as s,useSliderActions as u}from"../SliderContext.js";import m from"classnames";import d from"./SliderThumb.module.scss.js";import{getStyle as c}from"../../../helpers/typesciptCssModulesHelper.js";import{camelCase as p}from"lodash-es";var v=function(v){var f=v.className,b=v.index,g=void 0===b?0:b,h=v.onMove,L=void 0===h?r:h,x=v.position,y=void 0===x?0:x,j=v.size,E=v.color,T=l(),P=T.max,w=T.min,D=T.ranged,C=T.value,S=T.valueText,B=D?C[g]:C,H=D?S[g]:S,N=s(),F=N.active,I=N.ariaLabel,M=N.ariaLabelledby,_=N.disabled,z=N.dragging,A=N.focused,K=N.shapeTestId,V=N.showValue,k=N.valueLabelPosition,q=N.valueLabelColor,G=u(),J=G.setActive,O=G.setFocused,Q=G.setDragging,R=t(null);function U(){Q(null),document.removeEventListener("pointermove",L),document.removeEventListener("pointerup",U)}return a((function(){A===g&&R&&R.current&&R.current.focus()}),[A,g]),o.createElement(n,{open:F===g||z===g,content:V?null:H,position:"top",showDelay:i,addKeyboardHideShowTriggersByDefault:!1},o.createElement("div",{"aria-label":I,"aria-labelledby":M,"aria-valuemax":P,"aria-valuemin":w,"aria-valuenow":B,"aria-valuetext":H,"aria-disabled":_,className:m(d.thumb,c(d,E),c(d,j),e(e(e({},d.dragging,z===g),d.focused,A),d.notDisabledThumb,!_),f),"data-testid":K("thumb-".concat(g)),onFocus:function(){O(g),J(g)},onBlur:function(){O(null),J(null)},onPointerDown:function(e){e.stopPropagation(),Q(g),document.addEventListener("pointermove",L),document.addEventListener("pointerup",U)},onPointerLeave:function(){J(null)},ref:R,role:"slider",style:{left:"".concat(y,"%")},tabIndex:_?-1:0},V&&o.createElement("label",{className:m(d.label,c(d,p("color-"+q)),c(d,p("position-"+k)))},H)))};export{v as default};
+import{defineProperty as e}from"../../../../_virtual/_rollupPluginBabelHelpers.js";import o,{useRef as t,useEffect as a}from"react";import{NOOP as r}from"../../../utils/function-utils.js";import i from"../../Tooltip/Tooltip.js";import{TOOLTIP_SHOW_DELAY as n}from"../SliderConstants.js";import{useSliderSelection as l,useSliderUi as s,useSliderActions as u}from"../SliderContext.js";import m from"classnames";import d from"./SliderThumb.module.scss.js";import{getStyle as c}from"../../../helpers/typesciptCssModulesHelper.js";import{camelCase as p}from"es-toolkit";var v=function(v){var f=v.className,b=v.index,g=void 0===b?0:b,h=v.onMove,L=void 0===h?r:h,x=v.position,y=void 0===x?0:x,j=v.size,E=v.color,T=l(),P=T.max,w=T.min,D=T.ranged,C=T.value,S=T.valueText,B=D?C[g]:C,H=D?S[g]:S,N=s(),F=N.active,I=N.ariaLabel,M=N.ariaLabelledby,_=N.disabled,k=N.dragging,z=N.focused,A=N.shapeTestId,K=N.showValue,V=N.valueLabelPosition,q=N.valueLabelColor,G=u(),J=G.setActive,O=G.setFocused,Q=G.setDragging,R=t(null);function U(){Q(null),document.removeEventListener("pointermove",L),document.removeEventListener("pointerup",U)}return a((function(){z===g&&R&&R.current&&R.current.focus()}),[z,g]),o.createElement(i,{open:F===g||k===g,content:K?null:H,position:"top",showDelay:n,addKeyboardHideShowTriggersByDefault:!1},o.createElement("div",{"aria-label":I,"aria-labelledby":M,"aria-valuemax":P,"aria-valuemin":w,"aria-valuenow":B,"aria-valuetext":H,"aria-disabled":_,className:m(d.thumb,c(d,E),c(d,j),e(e(e({},d.dragging,k===g),d.focused,z),d.notDisabledThumb,!_),f),"data-testid":A("thumb-".concat(g)),onFocus:function(){O(g),J(g)},onBlur:function(){O(null),J(null)},onPointerDown:function(e){e.stopPropagation(),Q(g),document.addEventListener("pointermove",L),document.addEventListener("pointerup",U)},onPointerLeave:function(){J(null)},ref:R,role:"slider",style:{left:"".concat(y,"%")},tabIndex:_?-1:0},K&&o.createElement("label",{className:m(d.label,c(d,p("color-"+q)),c(d,p("position-"+V)))},H)))};export{v as default};
 //# sourceMappingURL=SliderThumb.js.map

package/dist/src/components/Slider/SliderBase/SliderThumb.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SliderThumb.js","sources":["../../../../../src/components/Slider/SliderBase/SliderThumb.tsx"],"sourcesContent":["import React, { type FC, useEffect, useRef } from \"react\";\nimport { NOOP } from \"../../../utils/function-utils\";\nimport Tooltip from \"../../Tooltip/Tooltip\";\nimport { TOOLTIP_SHOW_DELAY } from \"../SliderConstants\";\nimport { useSliderActions, useSliderSelection, useSliderUi } from \"../SliderContext\";\nimport type VibeComponentProps from \"../../../types/VibeComponentProps\";\nimport cx from \"classnames\";\nimport styles from \"./SliderThumb.module.scss\";\nimport { getStyle } from \"../../../helpers/typesciptCssModulesHelper\";\nimport { type SliderColor, type SliderSize } from \"../Slider.types\";\nimport { camelCase } from \"~~lodash~~-es\";\n\nexport interface SliderThumbProps extends VibeComponentProps {\n /*\n The index of the thumb (used in range sliders).\n /\n index?: number;\n /\n Callback fired when the thumb is moved.\n /\n onMove?: (event: PointerEvent) => void;\n /\n The position of the thumb, represented as an offset percentage from the start of the track.\n /\n position?: number;\n /\n The size of the slider thumb.\n /\n size: SliderSize;\n /\n The color theme of the slider thumb.\n */\n color: SliderColor;\n}\n\nconst SliderThumb: FC<SliderThumbProps> = ({ className, index = 0, onMove = NOOP, position = 0, size, color }) => {\n const { max, min, ranged, value: valueOrValues, valueText: valueOrValuesText } = useSliderSelection();\n const value = ranged ? (valueOrValues as unknown as number[])[index] : (valueOrValues as number);\n const valueText = ranged ? (valueOrValuesText as unknown as string[])[index] : (valueOrValuesText as string);\n const {\n active,\n ariaLabel,\n ariaLabelledby,\n disabled,\n dragging,\n focused,\n shapeTestId,\n showValue,\n valueLabelPosition,\n valueLabelColor\n } = useSliderUi();\n const { setActive, setFocused, setDragging } = useSliderActions();\n const ref = useRef(null);\n\n function handleBlur() {\n setFocused(null);\n setActive(null);\n }\n\n function handleFocus() {\n setFocused(index);\n setActive(index);\n }\n\n function handlePointerLeave() {\n setActive(null);\n }\n\n function handlePointerDown(e: React.PointerEvent) {\n e.stopPropagation();\n setDragging(index);\n document.addEventListener(\"pointermove\", onMove);\n document.addEventListener(\"pointerup\", stopMove);\n }\n\n function stopMove() {\n setDragging(null);\n document.removeEventListener(\"pointermove\", onMove);\n document.removeEventListener(\"pointerup\", stopMove);\n }\n\n useEffect(() => {\n if (focused === index && ref && ref.current) {\n ref.current.focus();\n }\n }, [focused, index]);\n\n return (\n <Tooltip\n open={active === index \|\| dragging === index}\n content={showValue ? null : valueText}\n position=\"top\"\n showDelay={TOOLTIP_SHOW_DELAY}\n addKeyboardHideShowTriggersByDefault={false}\n >\n <div\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledby}\n aria-valuemax={max}\n aria-valuemin={min}\n aria-valuenow={value}\n aria-valuetext={valueText}\n aria-disabled={disabled}\n className={cx(\n styles.thumb,\n getStyle(styles, color),\n getStyle(styles, size),\n {\n [styles.dragging]: dragging === index,\n [styles.focused]: focused,\n [styles.notDisabledThumb]: !disabled\n },\n className\n )}\n data-testid={shapeTestId(`thumb-${index}`)}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onPointerDown={handlePointerDown}\n onPointerLeave={handlePointerLeave}\n ref={ref}\n role=\"slider\"\n style={{ left: `${position}%` }}\n tabIndex={disabled ? -1 : 0}\n >\n {showValue && (\n <label\n className={cx(\n styles.label,\n getStyle(styles, camelCase(\"color-\" + valueLabelColor)),\n getStyle(styles, camelCase(\"position-\" + valueLabelPosition))\n )}\n >\n {valueText}\n </label>\n )}\n </div>\n </Tooltip>\n );\n};\n\nexport default SliderThumb;\n"],"names":["SliderThumb","_ref","className","_ref$index","index","_ref$onMove","onMove","NOOP","_ref$position","position","size","color","_useSliderSelection","useSliderSelection","max","min","ranged","valueOrValues","value","valueOrValuesText","valueText","_useSliderUi","useSliderUi","active","ariaLabel","ariaLabelledby","disabled","dragging","focused","shapeTestId","showValue","valueLabelPosition","valueLabelColor","_useSliderActions","useSliderActions","setActive","setFocused","setDragging","ref","useRef","stopMove","document","removeEventListener","useEffect","current","focus","React","createElement","Tooltip","open","content","showDelay","TOOLTIP_SHOW_DELAY","addKeyboardHideShowTriggersByDefault","cx","styles","thumb","getStyle","_defineProperty","notDisabledThumb","concat","onFocus","onBlur","onPointerDown","e","stopPropagation","addEventListener","onPointerLeave","role","style","left","tabIndex","label","camelCase"],"mappings":"~~ojBAmCA~~,IAAMA,EAAoC,SAAzBC,GAAgG,IAApEC,EAASD,EAATC,UAASC,EAAAF,EAAEG,MAAAA,OAAQ,IAAHD,EAAG,EAACA,EAAAE,EAAAJ,EAAEK,OAAAA,OAASC,IAAHF,EAAGE,EAAIF,EAAAG,EAAAP,EAAEQ,SAAAA,OAAW,IAAHD,EAAG,EAACA,EAAEE,EAAIT,EAAJS,KAAMC,EAAKV,EAALU,MACpGC,EAAiFC,IAAzEC,EAAGF,EAAHE,IAAKC,EAAGH,EAAHG,IAAKC,EAAMJ,EAANI,OAAeC,EAAaL,EAApBM,MAAiCC,EAAiBP,EAA5BQ,UAC1CF,EAAQF,EAAUC,EAAsCb,GAAUa,EAClEG,EAAYJ,EAAUG,EAA0Cf,GAAUe,EAChFE,EAWIC,IAVFC,EAAMF,EAANE,OACAC,EAASH,EAATG,UACAC,EAAcJ,EAAdI,eACAC,EAAQL,EAARK,SACAC,EAAQN,EAARM,SACAC,EAAOP,EAAPO,QACAC,EAAWR,EAAXQ,YACAC,EAAST,EAATS,UACAC,EAAkBV,EAAlBU,mBACAC,EAAeX,EAAfW,gBAEFC,EAA+CC,IAAvCC,EAASF,EAATE,UAAWC,EAAUH,EAAVG,WAAYC,EAAWJ,EAAXI,YACzBC,EAAMC,EAAO,MAuBnB,SAASC,IACPH,EAAY,MACZI,SAASC,oBAAoB,cAAepC,GAC5CmC,SAASC,oBAAoB,YAAaF,EAC5C,CAQA,OANAG,GAAU,WACJf,IAAYxB,GAASkC,GAAOA,EAAIM,SAClCN,EAAIM,QAAQC,OAEhB,GAAG,CAACjB,EAASxB,IAGX0C,EAACC,cAAAC,EACC,CAAAC,KAAM1B,IAAWnB,GAASuB,IAAavB,EACvC8C,QAASpB,EAAY,KAAOV,EAC5BX,SAAS,MACT0C,UAAWC,EACXC,sCAAsC,GAEtCP,EAAAC,cAAA,MAAA,CAAA,aACcvB,EAAS,kBACJC,EAAc,gBAChBX,EACA,gBAAAC,EACA,gBAAAG,mBACCE,EAAS,gBACVM,EACfxB,UAAWoD,EACTC,EAAOC,MACPC,EAASF,EAAQ5C,GACjB8C,EAASF,EAAQ7C,GAAKgD,EAAAA,EAAAA,EAAA,CAAA,EAEnBH,EAAO5B,SAAWA,IAAavB,GAC/BmD,EAAO3B,QAAUA,GACjB2B,EAAOI,kBAAoBjC,GAE9BxB,GAEW,cAAA2B,EAAW,SAAA+B,OAAUxD,IAClCyD,QAxDN,WACEzB,EAAWhC,GACX+B,EAAU/B,EACZ,EAsDM0D,OA9DN,WACE1B,EAAW,MACXD,EAAU,KACZ,EA4DM4B,cAjDN,SAA2BC,GACzBA,EAAEC,kBACF5B,EAAYjC,GACZqC,SAASyB,iBAAiB,cAAe5D,GACzCmC,SAASyB,iBAAiB,YAAa1B,EACzC,EA6CM2B,eAtDN,WACEhC,EAAU,KACZ,EAqDMG,IAAKA,EACL8B,KAAK,SACLC,MAAO,CAAEC,KAAI,GAAAV,OAAKnD,EAAQ,MAC1B8D,SAAU7C,GAAY,EAAI,GAEzBI,GACCgB,EAAAC,cAAA,QAAA,CACE7C,UAAWoD,EACTC,EAAOiB,MACPf,EAASF,EAAQkB,EAAU,SAAWzC,IACtCyB,EAASF,EAAQkB,EAAU,YAAc1C,MAG1CX,IAMb"}
1	+ {"version":3,"file":"SliderThumb.js","sources":["../../../../../src/components/Slider/SliderBase/SliderThumb.tsx"],"sourcesContent":["import React, { type FC, useEffect, useRef } from \"react\";\nimport { NOOP } from \"../../../utils/function-utils\";\nimport Tooltip from \"../../Tooltip/Tooltip\";\nimport { TOOLTIP_SHOW_DELAY } from \"../SliderConstants\";\nimport { useSliderActions, useSliderSelection, useSliderUi } from \"../SliderContext\";\nimport type VibeComponentProps from \"../../../types/VibeComponentProps\";\nimport cx from \"classnames\";\nimport styles from \"./SliderThumb.module.scss\";\nimport { getStyle } from \"../../../helpers/typesciptCssModulesHelper\";\nimport { type SliderColor, type SliderSize } from \"../Slider.types\";\nimport { camelCase } from \"es-toolkit\";\n\nexport interface SliderThumbProps extends VibeComponentProps {\n /*\n The index of the thumb (used in range sliders).\n /\n index?: number;\n /\n Callback fired when the thumb is moved.\n /\n onMove?: (event: PointerEvent) => void;\n /\n The position of the thumb, represented as an offset percentage from the start of the track.\n /\n position?: number;\n /\n The size of the slider thumb.\n /\n size: SliderSize;\n /\n The color theme of the slider thumb.\n */\n color: SliderColor;\n}\n\nconst SliderThumb: FC<SliderThumbProps> = ({ className, index = 0, onMove = NOOP, position = 0, size, color }) => {\n const { max, min, ranged, value: valueOrValues, valueText: valueOrValuesText } = useSliderSelection();\n const value = ranged ? (valueOrValues as unknown as number[])[index] : (valueOrValues as number);\n const valueText = ranged ? (valueOrValuesText as unknown as string[])[index] : (valueOrValuesText as string);\n const {\n active,\n ariaLabel,\n ariaLabelledby,\n disabled,\n dragging,\n focused,\n shapeTestId,\n showValue,\n valueLabelPosition,\n valueLabelColor\n } = useSliderUi();\n const { setActive, setFocused, setDragging } = useSliderActions();\n const ref = useRef(null);\n\n function handleBlur() {\n setFocused(null);\n setActive(null);\n }\n\n function handleFocus() {\n setFocused(index);\n setActive(index);\n }\n\n function handlePointerLeave() {\n setActive(null);\n }\n\n function handlePointerDown(e: React.PointerEvent) {\n e.stopPropagation();\n setDragging(index);\n document.addEventListener(\"pointermove\", onMove);\n document.addEventListener(\"pointerup\", stopMove);\n }\n\n function stopMove() {\n setDragging(null);\n document.removeEventListener(\"pointermove\", onMove);\n document.removeEventListener(\"pointerup\", stopMove);\n }\n\n useEffect(() => {\n if (focused === index && ref && ref.current) {\n ref.current.focus();\n }\n }, [focused, index]);\n\n return (\n <Tooltip\n open={active === index \|\| dragging === index}\n content={showValue ? null : valueText}\n position=\"top\"\n showDelay={TOOLTIP_SHOW_DELAY}\n addKeyboardHideShowTriggersByDefault={false}\n >\n <div\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledby}\n aria-valuemax={max}\n aria-valuemin={min}\n aria-valuenow={value}\n aria-valuetext={valueText}\n aria-disabled={disabled}\n className={cx(\n styles.thumb,\n getStyle(styles, color),\n getStyle(styles, size),\n {\n [styles.dragging]: dragging === index,\n [styles.focused]: focused,\n [styles.notDisabledThumb]: !disabled\n },\n className\n )}\n data-testid={shapeTestId(`thumb-${index}`)}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onPointerDown={handlePointerDown}\n onPointerLeave={handlePointerLeave}\n ref={ref}\n role=\"slider\"\n style={{ left: `${position}%` }}\n tabIndex={disabled ? -1 : 0}\n >\n {showValue && (\n <label\n className={cx(\n styles.label,\n getStyle(styles, camelCase(\"color-\" + valueLabelColor)),\n getStyle(styles, camelCase(\"position-\" + valueLabelPosition))\n )}\n >\n {valueText}\n </label>\n )}\n </div>\n </Tooltip>\n );\n};\n\nexport default SliderThumb;\n"],"names":["SliderThumb","_ref","className","_ref$index","index","_ref$onMove","onMove","NOOP","_ref$position","position","size","color","_useSliderSelection","useSliderSelection","max","min","ranged","valueOrValues","value","valueOrValuesText","valueText","_useSliderUi","useSliderUi","active","ariaLabel","ariaLabelledby","disabled","dragging","focused","shapeTestId","showValue","valueLabelPosition","valueLabelColor","_useSliderActions","useSliderActions","setActive","setFocused","setDragging","ref","useRef","stopMove","document","removeEventListener","useEffect","current","focus","React","createElement","Tooltip","open","content","showDelay","TOOLTIP_SHOW_DELAY","addKeyboardHideShowTriggersByDefault","cx","styles","thumb","getStyle","_defineProperty","notDisabledThumb","concat","onFocus","onBlur","onPointerDown","e","stopPropagation","addEventListener","onPointerLeave","role","style","left","tabIndex","label","camelCase"],"mappings":"qjBAmCA,IAAMA,EAAoC,SAAzBC,GAAgG,IAApEC,EAASD,EAATC,UAASC,EAAAF,EAAEG,MAAAA,OAAQ,IAAHD,EAAG,EAACA,EAAAE,EAAAJ,EAAEK,OAAAA,OAASC,IAAHF,EAAGE,EAAIF,EAAAG,EAAAP,EAAEQ,SAAAA,OAAW,IAAHD,EAAG,EAACA,EAAEE,EAAIT,EAAJS,KAAMC,EAAKV,EAALU,MACpGC,EAAiFC,IAAzEC,EAAGF,EAAHE,IAAKC,EAAGH,EAAHG,IAAKC,EAAMJ,EAANI,OAAeC,EAAaL,EAApBM,MAAiCC,EAAiBP,EAA5BQ,UAC1CF,EAAQF,EAAUC,EAAsCb,GAAUa,EAClEG,EAAYJ,EAAUG,EAA0Cf,GAAUe,EAChFE,EAWIC,IAVFC,EAAMF,EAANE,OACAC,EAASH,EAATG,UACAC,EAAcJ,EAAdI,eACAC,EAAQL,EAARK,SACAC,EAAQN,EAARM,SACAC,EAAOP,EAAPO,QACAC,EAAWR,EAAXQ,YACAC,EAAST,EAATS,UACAC,EAAkBV,EAAlBU,mBACAC,EAAeX,EAAfW,gBAEFC,EAA+CC,IAAvCC,EAASF,EAATE,UAAWC,EAAUH,EAAVG,WAAYC,EAAWJ,EAAXI,YACzBC,EAAMC,EAAO,MAuBnB,SAASC,IACPH,EAAY,MACZI,SAASC,oBAAoB,cAAepC,GAC5CmC,SAASC,oBAAoB,YAAaF,EAC5C,CAQA,OANAG,GAAU,WACJf,IAAYxB,GAASkC,GAAOA,EAAIM,SAClCN,EAAIM,QAAQC,OAEhB,GAAG,CAACjB,EAASxB,IAGX0C,EAACC,cAAAC,EACC,CAAAC,KAAM1B,IAAWnB,GAASuB,IAAavB,EACvC8C,QAASpB,EAAY,KAAOV,EAC5BX,SAAS,MACT0C,UAAWC,EACXC,sCAAsC,GAEtCP,EAAAC,cAAA,MAAA,CAAA,aACcvB,EAAS,kBACJC,EAAc,gBAChBX,EACA,gBAAAC,EACA,gBAAAG,mBACCE,EAAS,gBACVM,EACfxB,UAAWoD,EACTC,EAAOC,MACPC,EAASF,EAAQ5C,GACjB8C,EAASF,EAAQ7C,GAAKgD,EAAAA,EAAAA,EAAA,CAAA,EAEnBH,EAAO5B,SAAWA,IAAavB,GAC/BmD,EAAO3B,QAAUA,GACjB2B,EAAOI,kBAAoBjC,GAE9BxB,GAEW,cAAA2B,EAAW,SAAA+B,OAAUxD,IAClCyD,QAxDN,WACEzB,EAAWhC,GACX+B,EAAU/B,EACZ,EAsDM0D,OA9DN,WACE1B,EAAW,MACXD,EAAU,KACZ,EA4DM4B,cAjDN,SAA2BC,GACzBA,EAAEC,kBACF5B,EAAYjC,GACZqC,SAASyB,iBAAiB,cAAe5D,GACzCmC,SAASyB,iBAAiB,YAAa1B,EACzC,EA6CM2B,eAtDN,WACEhC,EAAU,KACZ,EAqDMG,IAAKA,EACL8B,KAAK,SACLC,MAAO,CAAEC,KAAI,GAAAV,OAAKnD,EAAQ,MAC1B8D,SAAU7C,GAAY,EAAI,GAEzBI,GACCgB,EAAAC,cAAA,QAAA,CACE7C,UAAWoD,EACTC,EAAOiB,MACPf,EAASF,EAAQkB,EAAU,SAAWzC,IACtCyB,EAASF,EAAQkB,EAAU,YAAc1C,MAG1CX,IAMb"}

package/dist/src/components/Slider/SliderBase/SliderThumb.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var o={thumb:"thumb_2a19036ba9",dragging:"dragging_c36e9a21a2",focused:"focused_7bc13b301f",notDisabledThumb:"notDisabledThumb_81ff857671","focus-visible":"focus-visible_b2227d2d7c",positive:"positive_fd6c8a9e87",negative:"negative_33b455f9a9",small:"small_e781959f11",medium:"medium_d0e00b3fe8",large:"large_1b4cc700b1",label:"label_5ebd335dab",positionTop:"positionTop_7e7b77d83b",positionBottom:"positionBottom_719172e807",colorPrimary:"colorPrimary_ebcac49cdb",colorSecondary:"colorSecondary_ec973632a6"};!function(o){const n="s_id-9ef20defa923_3_61_1";if("undefined"!=typeof document){const e=document.head||document.getElementsByTagName("head")[0];if(e.querySelector("#"+n))return;const r=document.createElement("style");r.id=n,e.firstChild?e.insertBefore(r,e.firstChild):e.appendChild(r),r.appendChild(document.createTextNode(o))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=o)}(".thumb_2a19036ba9 {\n  position: absolute;\n  border: 3px solid;\n  border-radius: 50%;\n  border-color: var(--primary-color);\n  background-color: var(--primary-background-color);\n  font-size: 14px;\n  top: 50%;\n  transform: translate(-50%, -50%);\n  transition: transform var(--motion-productive-long) var(--motion-timing-enter);\n  font-family: var(--font-family);\n}\n\n.dragging_c36e9a21a2 {\n  cursor: grabbing !important;\n  transform: translate(-50%, -50%) scale(1.15, 1.15);\n  transform-origin: center center;\n  transition: transform var(--motion-productive-long) var(--motion-timing-enter);\n  box-shadow: var(--box-shadow-small);\n}\n\n.focused_7bc13b301f {\n  border-color: var(--primary-hover-color);\n  cursor: grab;\n  box-shadow: var(--box-shadow-small);\n}\n\n.notDisabledThumb_81ff857671:focus-visible, .notDisabledThumb_81ff857671.focus-visible_b2227d2d7c {\n  outline: none;\n  z-index: 11;\n  border-radius: 50%;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n\n.notDisabledThumb_81ff857671:focus:not(.focus-visible_b2227d2d7c) {\n  outline: none;\n}\n\n.notDisabledThumb_81ff857671:hover {\n  border-color: var(--primary-hover-color);\n  cursor: grab;\n  box-shadow: var(--box-shadow-small);\n}\n\n.positive_fd6c8a9e87 {\n  border-color: var(--positive-color);\n}\n\n.positive_fd6c8a9e87.notDisabledThumb_81ff857671:hover {\n  border-color: var(--positive-color-hover);\n}\n\n.negative_33b455f9a9 {\n  border-color: var(--negative-color);\n}\n\n.negative_33b455f9a9.notDisabledThumb_81ff857671:hover {\n  border-color: var(--negative-color-hover);\n}\n\n.small_e781959f11 {\n  height: 16px;\n  width: 16px;\n}\n\n.medium_d0e00b3fe8 {\n  height: 20px;\n  width: 20px;\n}\n\n.large_1b4cc700b1 {\n  height: 24px;\n  width: 24px;\n}\n\n.label_5ebd335dab {\n  left: 50%;\n  max-width: 64px;\n  overflow: hidden;\n  position: absolute;\n  text-overflow: ellipsis;\n  transform: translate(-50%, 0);\n  white-space: nowrap;\n}\n\n.label_5ebd335dab.positionTop_7e7b77d83b {\n  bottom: calc(100% + 8px);\n}\n\n.label_5ebd335dab.positionBottom_719172e807 {\n  top: calc(100% + 8px);\n}\n\n.label_5ebd335dab.colorPrimary_ebcac49cdb {\n  color: var(--primary-text-color);\n}\n\n.label_5ebd335dab.colorSecondary_ec973632a6 {\n  color: var(--secondary-text-color);\n}");export{o as default};
+var o={thumb:"thumb_6e3b327c2c",dragging:"dragging_e45a8270a4",focused:"focused_a2f3dd4508",notDisabledThumb:"notDisabledThumb_80257fba2a","focus-visible":"focus-visible_91b0885215",positive:"positive_8fb8280a73",negative:"negative_52145e8186",small:"small_e7500c6460",medium:"medium_5f50d80a08",large:"large_90d82c860a",label:"label_d403488014",positionTop:"positionTop_d9d4a74bc9",positionBottom:"positionBottom_9518b21246",colorPrimary:"colorPrimary_26d0db93e3",colorSecondary:"colorSecondary_2643633957"};!function(o){const n="s_id-9ef20defa923_3_62_0";if("undefined"!=typeof document){const e=document.head||document.getElementsByTagName("head")[0];if(e.querySelector("#"+n))return;const r=document.createElement("style");r.id=n,e.firstChild?e.insertBefore(r,e.firstChild):e.appendChild(r),r.appendChild(document.createTextNode(o))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=o)}(".thumb_6e3b327c2c {\n  position: absolute;\n  border: 3px solid;\n  border-radius: 50%;\n  border-color: var(--primary-color);\n  background-color: var(--primary-background-color);\n  font-size: 14px;\n  top: 50%;\n  transform: translate(-50%, -50%);\n  transition: transform var(--motion-productive-long) var(--motion-timing-enter);\n  font-family: var(--font-family);\n}\n\n.dragging_e45a8270a4 {\n  cursor: grabbing !important;\n  transform: translate(-50%, -50%) scale(1.15, 1.15);\n  transform-origin: center center;\n  transition: transform var(--motion-productive-long) var(--motion-timing-enter);\n  box-shadow: var(--box-shadow-small);\n}\n\n.focused_a2f3dd4508 {\n  border-color: var(--primary-hover-color);\n  cursor: grab;\n  box-shadow: var(--box-shadow-small);\n}\n\n.notDisabledThumb_80257fba2a:focus-visible, .notDisabledThumb_80257fba2a.focus-visible_91b0885215 {\n  outline: none;\n  z-index: 11;\n  border-radius: 50%;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n\n.notDisabledThumb_80257fba2a:focus:not(.focus-visible_91b0885215) {\n  outline: none;\n}\n\n.notDisabledThumb_80257fba2a:hover {\n  border-color: var(--primary-hover-color);\n  cursor: grab;\n  box-shadow: var(--box-shadow-small);\n}\n\n.positive_8fb8280a73 {\n  border-color: var(--positive-color);\n}\n\n.positive_8fb8280a73.notDisabledThumb_80257fba2a:hover {\n  border-color: var(--positive-color-hover);\n}\n\n.negative_52145e8186 {\n  border-color: var(--negative-color);\n}\n\n.negative_52145e8186.notDisabledThumb_80257fba2a:hover {\n  border-color: var(--negative-color-hover);\n}\n\n.small_e7500c6460 {\n  height: 16px;\n  width: 16px;\n}\n\n.medium_5f50d80a08 {\n  height: 20px;\n  width: 20px;\n}\n\n.large_90d82c860a {\n  height: 24px;\n  width: 24px;\n}\n\n.label_d403488014 {\n  left: 50%;\n  max-width: 64px;\n  overflow: hidden;\n  position: absolute;\n  text-overflow: ellipsis;\n  transform: translate(-50%, 0);\n  white-space: nowrap;\n}\n\n.label_d403488014.positionTop_d9d4a74bc9 {\n  bottom: calc(100% + 8px);\n}\n\n.label_d403488014.positionBottom_9518b21246 {\n  top: calc(100% + 8px);\n}\n\n.label_d403488014.colorPrimary_26d0db93e3 {\n  color: var(--primary-text-color);\n}\n\n.label_d403488014.colorSecondary_2643633957 {\n  color: var(--secondary-text-color);\n}");export{o as default};
 //# sourceMappingURL=SliderThumb.module.scss.js.map