@consta/uikit 5.10.0 → 5.11.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.
- package/__internal__/src/components/Picture/Picture.js +1 -1
- package/__internal__/src/components/Picture/Picture.js.map +1 -1
- package/__internal__/src/components/ProgressStepBar/ProgressStepBar.js +1 -1
- package/__internal__/src/components/ProgressStepBar/ProgressStepBar.js.map +1 -1
- package/__internal__/src/components/ProgressStepBar/helpers.d.ts +1 -0
- package/__internal__/src/components/ProgressStepBar/helpers.js +1 -1
- package/__internal__/src/components/ProgressStepBar/helpers.js.map +1 -1
- package/__internal__/src/hooks/useScrollElements/useScrollElements.js +1 -1
- package/__internal__/src/hooks/useScrollElements/useScrollElements.js.map +1 -1
- package/package.json +1 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import _defineProperty from"@babel/runtime/helpers/defineProperty";import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["alt","src","getImageSettings","subscribeToRef"];function ownKeys(a,b){var c=Object.keys(a);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(a);b&&(d=d.filter(function(b){return Object.getOwnPropertyDescriptor(a,b).enumerable})),c.push.apply(c,d)}return c}function _objectSpread(a){for(var b,c=1;c<arguments.length;c++)b=null==arguments[c]?{}:arguments[c],c%2?ownKeys(Object(b),!0).forEach(function(c){_defineProperty(a,c,b[c])}):Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(b)):ownKeys(Object(b)).forEach(function(c){Object.defineProperty(a,c,Object.getOwnPropertyDescriptor(b,c))});return a}import React,{forwardRef,useMemo}from"react";import{getLastPoint,useBreakpoints}from"../../hooks/useBreakpoints";import{useTheme}from"../Theme";import{defaultGetImageSettings,getConvertedImages,getSrcHash}from"./helper";export var Picture=forwardRef(function(a,b){var c,d=a.alt,e=void 0===d?"":d,f=a.src,g=a.getImageSettings,h=void 0===g?defaultGetImageSettings:g,i=a.subscribeToRef,j=_objectWithoutProperties(a,_excluded),k=useTheme(),l=k.theme,m=useMemo(function(){var a=getConvertedImages(f,h);return[a,a.reduce(function(b,a){var c=a.size,d=void 0===c?0:c;return _objectSpread(_objectSpread({},b),{},_defineProperty({},d,d))},{})]},[getSrcHash(f)]),n=_slicedToArray(m,2),o=n[0],p=n[1]
|
|
1
|
+
import _defineProperty from"@babel/runtime/helpers/defineProperty";import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["alt","src","getImageSettings","subscribeToRef"];function ownKeys(a,b){var c=Object.keys(a);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(a);b&&(d=d.filter(function(b){return Object.getOwnPropertyDescriptor(a,b).enumerable})),c.push.apply(c,d)}return c}function _objectSpread(a){for(var b,c=1;c<arguments.length;c++)b=null==arguments[c]?{}:arguments[c],c%2?ownKeys(Object(b),!0).forEach(function(c){_defineProperty(a,c,b[c])}):Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(b)):ownKeys(Object(b)).forEach(function(c){Object.defineProperty(a,c,Object.getOwnPropertyDescriptor(b,c))});return a}import React,{forwardRef,useMemo}from"react";import{getLastPoint,useBreakpoints}from"../../hooks/useBreakpoints";import{useTheme}from"../Theme";import{defaultGetImageSettings,getConvertedImages,getSrcHash}from"./helper";export var Picture=forwardRef(function(a,b){var c,d=a.alt,e=void 0===d?"":d,f=a.src,g=a.getImageSettings,h=void 0===g?defaultGetImageSettings:g,i=a.subscribeToRef,j=_objectWithoutProperties(a,_excluded),k=useTheme(),l=k.theme,m=useMemo(function(){var a=getConvertedImages(f,h);return[a,a.reduce(function(b,a){var c=a.size,d=void 0===c?0:c;return _objectSpread(_objectSpread({},b),{},_defineProperty({},d,d))},{})]},[getSrcHash(f)]),n=_slicedToArray(m,2),o=n[0],p=n[1],q=+(null!==(c=getLastPoint(useBreakpoints({map:p,isActive:!0,ref:i})))&&void 0!==c?c:-1),r=useMemo(function(){return o.filter(function(a){var b=a.size,c=a.theme;return(!c||l.color.primary===c)&&("number"!=typeof b||q===b)}).sort(function(c,a){return c.descriptor&&a.descriptor?+c.descriptor.replace(/[^0-9.]+/g,"")<+a.descriptor.replace(/[^0-9.]+/g,"")?-1:1:0})},[q,l,o]),s=useMemo(function(){var a;if(0===r.length)return[];if(1<r.length){var b;return[encodeURI(null===(b=r[0])||void 0===b?void 0:b.src),r.map(function(a){var b=a.src,c=a.descriptor;return"".concat(encodeURI(b)," ").concat(c)}).join(",")]}return[null===(a=r[0])||void 0===a?void 0:a.src]},[r]),t=_slicedToArray(s,2),u=t[0],v=t[1];return u?React.createElement("img",Object.assign({},j,{ref:b,alt:e,src:u,srcSet:v})):null});
|
|
2
2
|
//# sourceMappingURL=Picture.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Picture.js","names":["React","forwardRef","useMemo","getLastPoint","useBreakpoints","useTheme","defaultGetImageSettings","getConvertedImages","getSrcHash","Picture","props","ref","alt","srcProp","src","getImageSettings","subscribeToRef","otherProps","theme","images","reduce","a","size","convertedImages","sizes","
|
|
1
|
+
{"version":3,"file":"Picture.js","names":["React","forwardRef","useMemo","getLastPoint","useBreakpoints","useTheme","defaultGetImageSettings","getConvertedImages","getSrcHash","Picture","props","ref","alt","srcProp","src","getImageSettings","subscribeToRef","otherProps","theme","images","reduce","a","size","convertedImages","sizes","activeImageSize","map","isActive","suitableImages","filter","targetTheme","color","primary","sort","b","descriptor","replace","length","encodeURI","join","srcSet"],"sources":["../../../../../src/components/Picture/Picture.tsx"],"sourcesContent":["import React, { forwardRef, useMemo } from 'react';\n\nimport { getLastPoint, useBreakpoints } from '##/hooks/useBreakpoints';\n\nimport { useTheme } from '../Theme';\nimport {\n defaultGetImageSettings,\n getConvertedImages,\n getSrcHash,\n} from './helper';\nimport { PictureProps } from './types';\n\nexport const Picture = forwardRef<HTMLImageElement, PictureProps>(\n (props, ref) => {\n const {\n alt = '',\n src: srcProp,\n getImageSettings = defaultGetImageSettings,\n subscribeToRef,\n ...otherProps\n } = props;\n\n const { theme } = useTheme();\n\n const [convertedImages, sizes]: [\n Array<{\n theme?: string;\n descriptor?: string;\n src: string;\n key: string;\n size?: number;\n }>,\n Record<string, number>,\n ] = useMemo(() => {\n const images = getConvertedImages(srcProp, getImageSettings);\n return [\n images,\n images.reduce((a, { size = 0 }) => ({ ...a, [size]: size }), {}),\n ];\n }, [getSrcHash(srcProp)]);\n\n const activeImageSize = Number(\n getLastPoint(\n useBreakpoints({\n map: sizes,\n isActive: true,\n ref: subscribeToRef,\n }),\n ) ?? -1,\n );\n\n const suitableImages = useMemo(() => {\n return convertedImages\n .filter(\n ({ size, theme: targetTheme }) =>\n (!targetTheme || theme.color.primary === targetTheme) &&\n (typeof size !== 'number' || activeImageSize === size),\n )\n .sort((a, b) => {\n if (a.descriptor && b.descriptor) {\n return Number(a.descriptor.replace(/[^0-9.]+/g, '')) <\n Number(b.descriptor.replace(/[^0-9.]+/g, ''))\n ? -1\n : 1;\n }\n return 0;\n });\n }, [activeImageSize, theme, convertedImages]);\n\n const [src, srcSet] = useMemo(() => {\n if (suitableImages.length === 0) {\n return [];\n }\n if (suitableImages.length > 1) {\n return [\n encodeURI(suitableImages[0]?.src),\n suitableImages\n .map(({ src, descriptor }) => `${encodeURI(src)} ${descriptor}`)\n .join(','),\n ];\n }\n return [suitableImages[0]?.src];\n }, [suitableImages]);\n\n return src ? (\n <img {...otherProps} ref={ref} alt={alt} src={src} srcSet={srcSet} />\n ) : null;\n },\n);\n"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["steps","direction","size","className","activeStepIndex","onItemClick","getItemContent","getItemLabel","getItemPoint","getItemProgress","getItemStatus","getItemTooltipContent","getItemLineStatus","getItemOnClick","style"];import"./ProgressStepBar.css";import{IconArrowLeft}from"@consta/icons/IconArrowLeft";import{IconArrowRight}from"@consta/icons/IconArrowRight";import React,{createRef,forwardRef,useEffect,useLayoutEffect,useMemo,useRef,useState}from"react";import{cnMixScrollBar}from"../../mixs/MixScrollBar";import{useComponentSize}from"../../hooks/useComponentSize/useComponentSize";import{useForkRef}from"../../hooks/useForkRef/useForkRef";import{useOverflow}from"../../hooks/useOverflow/useOverflow";import{useScrollElements}from"../../hooks/useScrollElements/useScrollElements";import{Button}from"../Button/Button";import{usePropsHandler}from"../EventInterceptor/usePropsHandler";import{calculateLines,cnProgressStepBar,getItemPosition,progressStepBarPropDirectionDefault,progressStepBarPropSizeDefault,withDefaultGetters}from"./helpers";import{ProgressStepBarItem}from"./ProgressStepBarItem/ProgressStepBarItem";import{ProgressStepBarLine}from"./ProgressStepBarLine/ProgressStepBarLine";export var COMPONENT_NAME="ProgressStepBar";function ProgressStepBarRender(a,b){var c=useRef(null),d=usePropsHandler(COMPONENT_NAME,withDefaultGetters(a),c),e=d.steps,f=void 0===e?[]:e,g=d.direction,h=void 0===g?progressStepBarPropDirectionDefault:g,i=d.size,j=void 0===i?progressStepBarPropSizeDefault:i,k=d.className,l=d.activeStepIndex,m=d.onItemClick,n=d.getItemContent,o=d.getItemLabel,p=d.getItemPoint,q=d.getItemProgress,r=d.getItemStatus,s=d.getItemTooltipContent,t=d.getItemLineStatus,u=d.getItemOnClick,v=d.style,w=_objectWithoutProperties(d,_excluded),x=useState(
|
|
1
|
+
import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["steps","direction","size","className","activeStepIndex","onItemClick","getItemContent","getItemLabel","getItemPoint","getItemProgress","getItemStatus","getItemTooltipContent","getItemLineStatus","getItemOnClick","style"];import"./ProgressStepBar.css";import{IconArrowLeft}from"@consta/icons/IconArrowLeft";import{IconArrowRight}from"@consta/icons/IconArrowRight";import React,{createRef,forwardRef,useEffect,useLayoutEffect,useMemo,useRef,useState}from"react";import{cnMixScrollBar}from"../../mixs/MixScrollBar";import{useComponentSize}from"../../hooks/useComponentSize/useComponentSize";import{useForkRef}from"../../hooks/useForkRef/useForkRef";import{useOverflow}from"../../hooks/useOverflow/useOverflow";import{useScrollElements}from"../../hooks/useScrollElements/useScrollElements";import{Button}from"../Button/Button";import{usePropsHandler}from"../EventInterceptor/usePropsHandler";import{calculateLines,cnProgressStepBar,getItemPosition,progressStepBarPropDirectionDefault,progressStepBarPropSizeDefault,validateVisibleIndex,withDefaultGetters}from"./helpers";import{ProgressStepBarItem}from"./ProgressStepBarItem/ProgressStepBarItem";import{ProgressStepBarLine}from"./ProgressStepBarLine/ProgressStepBarLine";export var COMPONENT_NAME="ProgressStepBar";function ProgressStepBarRender(a,b){var c=useRef(null),d=usePropsHandler(COMPONENT_NAME,withDefaultGetters(a),c),e=d.steps,f=void 0===e?[]:e,g=d.direction,h=void 0===g?progressStepBarPropDirectionDefault:g,i=d.size,j=void 0===i?progressStepBarPropSizeDefault:i,k=d.className,l=d.activeStepIndex,m=d.onItemClick,n=d.getItemContent,o=d.getItemLabel,p=d.getItemPoint,q=d.getItemProgress,r=d.getItemStatus,s=d.getItemTooltipContent,t=d.getItemLineStatus,u=d.getItemOnClick,v=d.style,w=_objectWithoutProperties(d,_excluded),x=validateVisibleIndex(f.length,l),y=useState(x||0),z=_slicedToArray(y,2),A=z[0],B=z[1],C=useState([]),D=_slicedToArray(C,2),E=D[0],F=D[1],G=useRef(null),H=useComponentSize(c),I=H.width,J=H.height,K=useScrollElements(f),L=K.refs,M=K.scrollTo,N=useMemo(function(){return Array(f.length).fill(null).map(function(){return createRef()})},[f.length]),O=useOverflow({currentRef:G});useLayoutEffect(function(){var a=[],b=calculateLines(L,h);f.forEach(function(c,d){var e;d!==f.length-1&&a.push({status:t(c)||"normal",size:null!==(e=b[d])&&void 0!==e?e:0})}),F(a)},[x,f,h,j,I,J,O]),useEffect(function(){B(x||0)},[x]),useEffect(function(){M(A)},[A]);var P=function(a){a&&0!==A&&B(A-1),a||A===f.length-1||B(A+1)},Q=function(a,b){var c=u(a),d=m?function(d){m(a,{e:d,index:b}),null===c||void 0===c?void 0:c(d)}:void 0;return{content:n(a),label:o(a),point:p(a),progress:q(a),status:"number"==typeof x&&x>=b?r(a)||"normal":"system",tooltipContent:s(a),size:j,position:getItemPosition(b,f.length),pointRef:N[b],direction:h,className:cnProgressStepBar("Item"),onClick:c||d,key:cnProgressStepBar({index:b}),tooltipZIndex:"number"==typeof(null===v||void 0===v?void 0:v.zIndex)?v.zIndex+1:void 0}};return React.createElement("div",Object.assign({},w,{style:v,className:cnProgressStepBar({isOverflow:O},[k,cnMixScrollBar()]),ref:useForkRef([b,c])}),O&&"vertical"!==h&&React.createElement(Button,{iconLeft:function iconLeft(){return React.createElement(IconArrowLeft,{size:"xs"})},view:"clear",onlyIcon:!0,type:"button",size:"xs",className:cnProgressStepBar("Button",{side:"left"}),onClick:function onClick(){return P(!0)}}),React.createElement("div",{ref:G,className:cnProgressStepBar("List",{direction:h,overflow:O})},React.createElement(ProgressStepBarLine,{lines:E,size:j,direction:h,activeStepIndex:x}),f.map(function(a,b){return React.createElement(ProgressStepBarItem,Object.assign({ref:L[b]},Q(a,b)))})),O&&"vertical"!==h&&React.createElement(Button,{iconLeft:function iconLeft(){return React.createElement(IconArrowRight,{size:"xs"})},view:"clear",onlyIcon:!0,size:"xs",type:"button",className:cnProgressStepBar("Button",{side:"right"}),onClick:function onClick(){return P(!1)}}))}export var ProgressStepBar=forwardRef(ProgressStepBarRender);
|
|
2
2
|
//# sourceMappingURL=ProgressStepBar.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ProgressStepBar.js","names":["IconArrowLeft","IconArrowRight","React","createRef","forwardRef","useEffect","useLayoutEffect","useMemo","useRef","useState","cnMixScrollBar","useComponentSize","useForkRef","useOverflow","useScrollElements","Button","usePropsHandler","calculateLines","cnProgressStepBar","getItemPosition","progressStepBarPropDirectionDefault","progressStepBarPropSizeDefault","withDefaultGetters","ProgressStepBarItem","ProgressStepBarLine","COMPONENT_NAME","ProgressStepBarRender","props","ref","containerRef","steps","direction","size","className","activeStepIndex","onItemClick","getItemContent","getItemLabel","getItemPoint","getItemProgress","getItemStatus","getItemTooltipContent","getItemLineStatus","getItemOnClick","style","otherProps","visibleIndex","setVisibleIndex","lines","setLines","listRef","width","height","refs","scrollTo","stepsRef","Array","length","fill","map","isOverflow","currentRef","linesArray","sizes","forEach","step","index","push","status","changePosition","prev","getStepItem","item","onClick","onItemClickHandler","e","content","label","point","progress","tooltipContent","position","pointRef","key","tooltipZIndex","zIndex","side","overflow","ProgressStepBar"],"sources":["../../../../../src/components/ProgressStepBar/ProgressStepBar.tsx"],"sourcesContent":["import './ProgressStepBar.css';\n\nimport { IconArrowLeft } from '@consta/icons/IconArrowLeft';\nimport { IconArrowRight } from '@consta/icons/IconArrowRight';\nimport React, {\n createRef,\n forwardRef,\n useEffect,\n useLayoutEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\n\nimport { cnMixScrollBar } from '##/mixs/MixScrollBar';\n\nimport { useComponentSize } from '../../hooks/useComponentSize/useComponentSize';\nimport { useForkRef } from '../../hooks/useForkRef/useForkRef';\nimport { useOverflow } from '../../hooks/useOverflow/useOverflow';\nimport { useScrollElements } from '../../hooks/useScrollElements/useScrollElements';\nimport { Button } from '../Button/Button';\nimport { usePropsHandler } from '../EventInterceptor/usePropsHandler';\nimport {\n calculateLines,\n cnProgressStepBar,\n getItemPosition,\n Line,\n ProgressStepBarComponent,\n ProgressStepBarItemDefault,\n ProgressStepBarItemProps,\n progressStepBarPropDirectionDefault,\n ProgressStepBarProps,\n progressStepBarPropSizeDefault,\n withDefaultGetters,\n} from './helpers';\nimport { ProgressStepBarItem } from './ProgressStepBarItem/ProgressStepBarItem';\nimport { ProgressStepBarLine } from './ProgressStepBarLine/ProgressStepBarLine';\n\nexport const COMPONENT_NAME = 'ProgressStepBar' as const;\n\nfunction ProgressStepBarRender<ITEM = ProgressStepBarItemDefault>(\n props: ProgressStepBarProps<ITEM>,\n ref: React.Ref<HTMLDivElement>,\n) {\n const containerRef = useRef<HTMLDivElement>(null);\n\n const {\n steps = [],\n direction = progressStepBarPropDirectionDefault,\n size = progressStepBarPropSizeDefault,\n className,\n activeStepIndex,\n onItemClick,\n getItemContent,\n getItemLabel,\n getItemPoint,\n getItemProgress,\n getItemStatus,\n getItemTooltipContent,\n getItemLineStatus,\n getItemOnClick,\n style,\n ...otherProps\n } = usePropsHandler(COMPONENT_NAME, withDefaultGetters(props), containerRef);\n\n const [visibleIndex, setVisibleIndex] = useState<number>(\n activeStepIndex || 0,\n );\n const [lines, setLines] = useState<Line[]>([]);\n\n const listRef = useRef<HTMLDivElement>(null);\n\n const { width, height } = useComponentSize(containerRef);\n\n const { refs, scrollTo } = useScrollElements(steps);\n\n const stepsRef = useMemo(\n () =>\n new Array(steps.length)\n .fill(null)\n .map(() => createRef<HTMLButtonElement>()),\n [steps.length],\n );\n const isOverflow = useOverflow({ currentRef: listRef });\n\n useLayoutEffect(() => {\n const linesArray: Line[] = [];\n const sizes = calculateLines(refs, direction);\n\n steps.forEach((step, index) => {\n if (index !== steps.length - 1)\n linesArray.push({\n status: getItemLineStatus(step) || 'normal',\n size: sizes[index] ?? 0,\n });\n });\n setLines(linesArray);\n }, [activeStepIndex, steps, direction, size, width, height, isOverflow]);\n\n useEffect(() => {\n setVisibleIndex(activeStepIndex || 0);\n }, [activeStepIndex]);\n\n useEffect(() => {\n scrollTo(visibleIndex);\n }, [visibleIndex]);\n\n const changePosition = (prev: boolean) => {\n if (prev && visibleIndex !== 0) {\n setVisibleIndex(visibleIndex - 1);\n }\n if (!prev && visibleIndex !== steps.length - 1) {\n setVisibleIndex(visibleIndex + 1);\n }\n };\n\n const getStepItem: (item: ITEM, index: number) => ProgressStepBarItemProps = (\n item,\n index,\n ) => {\n const onClick = getItemOnClick(item);\n\n const onItemClickHandler = onItemClick\n ? (e: React.MouseEvent<Element, MouseEvent>) => {\n onItemClick(item, { e, index });\n onClick?.(e);\n }\n : undefined;\n\n return {\n content: getItemContent(item),\n label: getItemLabel(item),\n point: getItemPoint(item),\n progress: getItemProgress(item),\n status:\n typeof activeStepIndex === 'number' && activeStepIndex >= index\n ? getItemStatus(item) || 'normal'\n : 'system',\n tooltipContent: getItemTooltipContent(item),\n size,\n position: getItemPosition(index, steps.length),\n pointRef: stepsRef[index] as React.RefObject<HTMLButtonElement>,\n direction,\n className: cnProgressStepBar('Item'),\n onClick: onClick || onItemClickHandler,\n key: cnProgressStepBar({ index }),\n tooltipZIndex:\n typeof style?.zIndex === 'number' ? style.zIndex + 1 : undefined,\n };\n };\n\n return (\n <div\n {...otherProps}\n style={style}\n className={cnProgressStepBar({ isOverflow }, [\n className,\n cnMixScrollBar(),\n ])}\n ref={useForkRef([ref, containerRef])}\n >\n {isOverflow && direction !== 'vertical' && (\n <Button\n iconLeft={() => <IconArrowLeft size=\"xs\" />}\n view=\"clear\"\n onlyIcon\n type=\"button\"\n size=\"xs\"\n className={cnProgressStepBar('Button', { side: 'left' })}\n onClick={() => changePosition(true)}\n />\n )}\n <div\n ref={listRef}\n className={cnProgressStepBar('List', {\n direction,\n overflow: isOverflow,\n })}\n >\n <ProgressStepBarLine\n lines={lines}\n size={size}\n direction={direction}\n activeStepIndex={activeStepIndex}\n />\n {steps.map((step, index) => (\n <ProgressStepBarItem\n ref={refs[index] as React.RefObject<HTMLDivElement>}\n {...getStepItem(step, index)}\n />\n ))}\n </div>\n {isOverflow && direction !== 'vertical' && (\n <Button\n iconLeft={() => <IconArrowRight size=\"xs\" />}\n view=\"clear\"\n onlyIcon\n size=\"xs\"\n type=\"button\"\n className={cnProgressStepBar('Button', { side: 'right' })}\n onClick={() => changePosition(false)}\n />\n )}\n </div>\n );\n}\n\nexport const ProgressStepBar = forwardRef(\n ProgressStepBarRender,\n) as ProgressStepBarComponent;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ProgressStepBar.js","names":["IconArrowLeft","IconArrowRight","React","createRef","forwardRef","useEffect","useLayoutEffect","useMemo","useRef","useState","cnMixScrollBar","useComponentSize","useForkRef","useOverflow","useScrollElements","Button","usePropsHandler","calculateLines","cnProgressStepBar","getItemPosition","progressStepBarPropDirectionDefault","progressStepBarPropSizeDefault","validateVisibleIndex","withDefaultGetters","ProgressStepBarItem","ProgressStepBarLine","COMPONENT_NAME","ProgressStepBarRender","props","ref","containerRef","steps","direction","size","className","activeStepIndexProp","activeStepIndex","onItemClick","getItemContent","getItemLabel","getItemPoint","getItemProgress","getItemStatus","getItemTooltipContent","getItemLineStatus","getItemOnClick","style","otherProps","length","visibleIndex","setVisibleIndex","lines","setLines","listRef","width","height","refs","scrollTo","stepsRef","Array","fill","map","isOverflow","currentRef","linesArray","sizes","forEach","step","index","push","status","changePosition","prev","getStepItem","item","onClick","onItemClickHandler","e","content","label","point","progress","tooltipContent","position","pointRef","key","tooltipZIndex","zIndex","side","overflow","ProgressStepBar"],"sources":["../../../../../src/components/ProgressStepBar/ProgressStepBar.tsx"],"sourcesContent":["import './ProgressStepBar.css';\n\nimport { IconArrowLeft } from '@consta/icons/IconArrowLeft';\nimport { IconArrowRight } from '@consta/icons/IconArrowRight';\nimport React, {\n createRef,\n forwardRef,\n useEffect,\n useLayoutEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\n\nimport { cnMixScrollBar } from '##/mixs/MixScrollBar';\n\nimport { useComponentSize } from '../../hooks/useComponentSize/useComponentSize';\nimport { useForkRef } from '../../hooks/useForkRef/useForkRef';\nimport { useOverflow } from '../../hooks/useOverflow/useOverflow';\nimport { useScrollElements } from '../../hooks/useScrollElements/useScrollElements';\nimport { Button } from '../Button/Button';\nimport { usePropsHandler } from '../EventInterceptor/usePropsHandler';\nimport {\n calculateLines,\n cnProgressStepBar,\n getItemPosition,\n Line,\n ProgressStepBarComponent,\n ProgressStepBarItemDefault,\n ProgressStepBarItemProps,\n progressStepBarPropDirectionDefault,\n ProgressStepBarProps,\n progressStepBarPropSizeDefault,\n validateVisibleIndex,\n withDefaultGetters,\n} from './helpers';\nimport { ProgressStepBarItem } from './ProgressStepBarItem/ProgressStepBarItem';\nimport { ProgressStepBarLine } from './ProgressStepBarLine/ProgressStepBarLine';\n\nexport const COMPONENT_NAME = 'ProgressStepBar' as const;\n\nfunction ProgressStepBarRender<ITEM = ProgressStepBarItemDefault>(\n props: ProgressStepBarProps<ITEM>,\n ref: React.Ref<HTMLDivElement>,\n) {\n const containerRef = useRef<HTMLDivElement>(null);\n\n const {\n steps = [],\n direction = progressStepBarPropDirectionDefault,\n size = progressStepBarPropSizeDefault,\n className,\n activeStepIndex: activeStepIndexProp,\n onItemClick,\n getItemContent,\n getItemLabel,\n getItemPoint,\n getItemProgress,\n getItemStatus,\n getItemTooltipContent,\n getItemLineStatus,\n getItemOnClick,\n style,\n ...otherProps\n } = usePropsHandler(COMPONENT_NAME, withDefaultGetters(props), containerRef);\n\n const activeStepIndex = validateVisibleIndex(\n steps.length,\n activeStepIndexProp,\n );\n\n const [visibleIndex, setVisibleIndex] = useState<number>(\n activeStepIndex || 0,\n );\n const [lines, setLines] = useState<Line[]>([]);\n\n const listRef = useRef<HTMLDivElement>(null);\n\n const { width, height } = useComponentSize(containerRef);\n\n const { refs, scrollTo } = useScrollElements(steps);\n\n const stepsRef = useMemo(\n () =>\n new Array(steps.length)\n .fill(null)\n .map(() => createRef<HTMLButtonElement>()),\n [steps.length],\n );\n const isOverflow = useOverflow({ currentRef: listRef });\n\n useLayoutEffect(() => {\n const linesArray: Line[] = [];\n const sizes = calculateLines(refs, direction);\n\n steps.forEach((step, index) => {\n if (index !== steps.length - 1)\n linesArray.push({\n status: getItemLineStatus(step) || 'normal',\n size: sizes[index] ?? 0,\n });\n });\n setLines(linesArray);\n }, [activeStepIndex, steps, direction, size, width, height, isOverflow]);\n\n useEffect(() => {\n setVisibleIndex(activeStepIndex || 0);\n }, [activeStepIndex]);\n\n useEffect(() => {\n scrollTo(visibleIndex);\n }, [visibleIndex]);\n\n const changePosition = (prev: boolean) => {\n if (prev && visibleIndex !== 0) {\n setVisibleIndex(visibleIndex - 1);\n }\n if (!prev && visibleIndex !== steps.length - 1) {\n setVisibleIndex(visibleIndex + 1);\n }\n };\n\n const getStepItem: (item: ITEM, index: number) => ProgressStepBarItemProps = (\n item,\n index,\n ) => {\n const onClick = getItemOnClick(item);\n\n const onItemClickHandler = onItemClick\n ? (e: React.MouseEvent<Element, MouseEvent>) => {\n onItemClick(item, { e, index });\n onClick?.(e);\n }\n : undefined;\n\n return {\n content: getItemContent(item),\n label: getItemLabel(item),\n point: getItemPoint(item),\n progress: getItemProgress(item),\n status:\n typeof activeStepIndex === 'number' && activeStepIndex >= index\n ? getItemStatus(item) || 'normal'\n : 'system',\n tooltipContent: getItemTooltipContent(item),\n size,\n position: getItemPosition(index, steps.length),\n pointRef: stepsRef[index] as React.RefObject<HTMLButtonElement>,\n direction,\n className: cnProgressStepBar('Item'),\n onClick: onClick || onItemClickHandler,\n key: cnProgressStepBar({ index }),\n tooltipZIndex:\n typeof style?.zIndex === 'number' ? style.zIndex + 1 : undefined,\n };\n };\n\n return (\n <div\n {...otherProps}\n style={style}\n className={cnProgressStepBar({ isOverflow }, [\n className,\n cnMixScrollBar(),\n ])}\n ref={useForkRef([ref, containerRef])}\n >\n {isOverflow && direction !== 'vertical' && (\n <Button\n iconLeft={() => <IconArrowLeft size=\"xs\" />}\n view=\"clear\"\n onlyIcon\n type=\"button\"\n size=\"xs\"\n className={cnProgressStepBar('Button', { side: 'left' })}\n onClick={() => changePosition(true)}\n />\n )}\n <div\n ref={listRef}\n className={cnProgressStepBar('List', {\n direction,\n overflow: isOverflow,\n })}\n >\n <ProgressStepBarLine\n lines={lines}\n size={size}\n direction={direction}\n activeStepIndex={activeStepIndex}\n />\n {steps.map((step, index) => (\n <ProgressStepBarItem\n ref={refs[index] as React.RefObject<HTMLDivElement>}\n {...getStepItem(step, index)}\n />\n ))}\n </div>\n {isOverflow && direction !== 'vertical' && (\n <Button\n iconLeft={() => <IconArrowRight size=\"xs\" />}\n view=\"clear\"\n onlyIcon\n size=\"xs\"\n type=\"button\"\n className={cnProgressStepBar('Button', { side: 'right' })}\n onClick={() => changePosition(false)}\n />\n )}\n </div>\n );\n}\n\nexport const ProgressStepBar = forwardRef(\n ProgressStepBarRender,\n) as ProgressStepBarComponent;\n"],"mappings":"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"}
|
|
@@ -118,3 +118,4 @@ export declare function withDefaultGetters<ITEM>(props: ProgressStepBarProps<ITE
|
|
|
118
118
|
export declare const getItemPosition: (index: number, lendth: number) => "start" | "center" | "end";
|
|
119
119
|
export declare const getLineSize: (container: React.RefObject<HTMLElement>, activeElement: React.RefObject<HTMLElement>, direction: ProgressStepBarPropDirection) => number;
|
|
120
120
|
export declare const calculateLines: (refs: React.RefObject<HTMLElement>[], direction: ProgressStepBarPropDirection) => number[];
|
|
121
|
+
export declare const validateVisibleIndex: (lenght: number, index: number | undefined) => number | undefined;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import _defineProperty from"@babel/runtime/helpers/defineProperty";function ownKeys(a,b){var c=Object.keys(a);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(a);b&&(d=d.filter(function(b){return Object.getOwnPropertyDescriptor(a,b).enumerable})),c.push.apply(c,d)}return c}function _objectSpread(a){for(var b,c=1;c<arguments.length;c++)b=null==arguments[c]?{}:arguments[c],c%2?ownKeys(Object(b),!0).forEach(function(c){_defineProperty(a,c,b[c])}):Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(b)):ownKeys(Object(b)).forEach(function(c){Object.defineProperty(a,c,Object.getOwnPropertyDescriptor(b,c))});return a}import{cn}from"../../utils/bem";export var progressStepBarPropSize=["s","xs","m"];export var progressStepBarPropSizeDefault=progressStepBarPropSize[0];export var progressStepBarPropDirection=["horizontal","vertical"];export var progressStepBarPropDirectionDefault=progressStepBarPropDirection[0];export var progressStepBarPropStatus=["normal","success","warning","alert"];export var progressStepBarPropStatusDefault=progressStepBarPropStatus[0];export var progressStepBarPointNumbersMap=[0,1,2,3,4,5,6,7,8,9];export var progressStepBarPropPosition=["center","start","end"];export var progressStepBarPropPositionDefault=progressStepBarPropPosition[0];export var cnProgressStepBar=cn("ProgressStepBar");export var defaultGetItemLabel=function(a){return a.label};export var defaultGetItemTooltipContent=function(a){return a.tooltipContent};export var defaultGetItemPoint=function(a){return a.point};export var defaultGetItemLineStatus=function(a){return a.lineStatus};export var defaultGetItemProgress=function(a){return a.progress};export var defaultGetItemContent=function(a){return a.content};export var defaultGetItemStatus=function(a){return a.status};export var defaultGetItemOnClick=function(a){return a.onClick};export function withDefaultGetters(a){return _objectSpread(_objectSpread({},a),{},{getItemLabel:a.getItemLabel||defaultGetItemLabel,getItemTooltipContent:a.getItemTooltipContent||defaultGetItemTooltipContent,getItemPoint:a.getItemPoint||defaultGetItemPoint,getItemProgress:a.getItemProgress||defaultGetItemProgress,getItemContent:a.getItemContent||defaultGetItemContent,getItemStatus:a.getItemStatus||defaultGetItemStatus,getItemLineStatus:a.getItemLineStatus||defaultGetItemLineStatus,getItemOnClick:a.getItemOnClick||defaultGetItemOnClick})}export var getItemPosition=function(a,b){var c="center";return a===b-1&&(c="end"),0===a&&(c="start"),c};export var getLineSize=function(a,b,c){var d=0;if(a&&a.current&&b&&b.current){var e=a.current.getBoundingClientRect(),f=b.current.getBoundingClientRect();d="vertical"===c?f.y-e.y+f.height:f.x-e.x}return d};var getRefSize=function(a){if(a.current){var b=a.current.getBoundingClientRect(),c=b.width,d=b.height;return[c,d]}return[0,0]};export var calculateLines=function(a,b){for(var c=[],d=0;d<a.length-1;d++){var e=a[d],f=getRefSize(e),g=getRefSize(a[d+1]),h=0;h=0==d?"horizontal"===b?f[0]+g[0]/2:f[1]:d===a.length-2?"horizontal"===b?f[0]/2+g[0]:f[1]+2:"horizontal"===b?f[0]/2+g[0]/2:f[1],c.push(h)}return c};
|
|
1
|
+
import _defineProperty from"@babel/runtime/helpers/defineProperty";function ownKeys(a,b){var c=Object.keys(a);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(a);b&&(d=d.filter(function(b){return Object.getOwnPropertyDescriptor(a,b).enumerable})),c.push.apply(c,d)}return c}function _objectSpread(a){for(var b,c=1;c<arguments.length;c++)b=null==arguments[c]?{}:arguments[c],c%2?ownKeys(Object(b),!0).forEach(function(c){_defineProperty(a,c,b[c])}):Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(b)):ownKeys(Object(b)).forEach(function(c){Object.defineProperty(a,c,Object.getOwnPropertyDescriptor(b,c))});return a}import{cn}from"../../utils/bem";export var progressStepBarPropSize=["s","xs","m"];export var progressStepBarPropSizeDefault=progressStepBarPropSize[0];export var progressStepBarPropDirection=["horizontal","vertical"];export var progressStepBarPropDirectionDefault=progressStepBarPropDirection[0];export var progressStepBarPropStatus=["normal","success","warning","alert"];export var progressStepBarPropStatusDefault=progressStepBarPropStatus[0];export var progressStepBarPointNumbersMap=[0,1,2,3,4,5,6,7,8,9];export var progressStepBarPropPosition=["center","start","end"];export var progressStepBarPropPositionDefault=progressStepBarPropPosition[0];export var cnProgressStepBar=cn("ProgressStepBar");export var defaultGetItemLabel=function(a){return a.label};export var defaultGetItemTooltipContent=function(a){return a.tooltipContent};export var defaultGetItemPoint=function(a){return a.point};export var defaultGetItemLineStatus=function(a){return a.lineStatus};export var defaultGetItemProgress=function(a){return a.progress};export var defaultGetItemContent=function(a){return a.content};export var defaultGetItemStatus=function(a){return a.status};export var defaultGetItemOnClick=function(a){return a.onClick};export function withDefaultGetters(a){return _objectSpread(_objectSpread({},a),{},{getItemLabel:a.getItemLabel||defaultGetItemLabel,getItemTooltipContent:a.getItemTooltipContent||defaultGetItemTooltipContent,getItemPoint:a.getItemPoint||defaultGetItemPoint,getItemProgress:a.getItemProgress||defaultGetItemProgress,getItemContent:a.getItemContent||defaultGetItemContent,getItemStatus:a.getItemStatus||defaultGetItemStatus,getItemLineStatus:a.getItemLineStatus||defaultGetItemLineStatus,getItemOnClick:a.getItemOnClick||defaultGetItemOnClick})}export var getItemPosition=function(a,b){var c="center";return a===b-1&&(c="end"),0===a&&(c="start"),c};export var getLineSize=function(a,b,c){var d=0;if(a&&a.current&&b&&b.current){var e=a.current.getBoundingClientRect(),f=b.current.getBoundingClientRect();d="vertical"===c?f.y-e.y+f.height:f.x-e.x}return d};var getRefSize=function(a){if(a.current){var b=a.current.getBoundingClientRect(),c=b.width,d=b.height;return[c,d]}return[0,0]};export var calculateLines=function(a,b){for(var c=[],d=0;d<a.length-1;d++){var e=a[d],f=getRefSize(e),g=getRefSize(a[d+1]),h=0;h=0==d?"horizontal"===b?f[0]+g[0]/2:f[1]:d===a.length-2?"horizontal"===b?f[0]/2+g[0]:f[1]+2:"horizontal"===b?f[0]/2+g[0]/2:f[1],c.push(h)}return c};export var validateVisibleIndex=function(a,b){return b?0>b?void 0:Math.min(b,a-1):b};
|
|
2
2
|
//# sourceMappingURL=helpers.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"helpers.js","names":["cn","progressStepBarPropSize","progressStepBarPropSizeDefault","progressStepBarPropDirection","progressStepBarPropDirectionDefault","progressStepBarPropStatus","progressStepBarPropStatusDefault","progressStepBarPointNumbersMap","progressStepBarPropPosition","progressStepBarPropPositionDefault","cnProgressStepBar","defaultGetItemLabel","item","label","defaultGetItemTooltipContent","tooltipContent","defaultGetItemPoint","point","defaultGetItemLineStatus","lineStatus","defaultGetItemProgress","progress","defaultGetItemContent","content","defaultGetItemStatus","status","defaultGetItemOnClick","onClick","withDefaultGetters","props","getItemLabel","getItemTooltipContent","getItemPoint","getItemProgress","getItemContent","getItemStatus","getItemLineStatus","getItemOnClick","getItemPosition","index","lendth","position","getLineSize","container","activeElement","direction","size","current","containerPosition","getBoundingClientRect","activeElementPosition","y","height","x","getRefSize","ref","width","calculateLines","refs","sizes","i","length","firstSize","secondSize","push"],"sources":["../../../../../src/components/ProgressStepBar/helpers.ts"],"sourcesContent":["import { IconComponent } from '@consta/icons/Icon';\nimport React from 'react';\n\nimport { cn } from '../../utils/bem';\nimport { PropsWithHTMLAttributesAndRef } from '../../utils/types/PropsWithHTMLAttributes';\n\nexport const progressStepBarPropSize = ['s', 'xs', 'm'] as const;\nexport type ProgressStepBarPropSize = typeof progressStepBarPropSize[number];\nexport const progressStepBarPropSizeDefault = progressStepBarPropSize[0];\n\nexport const progressStepBarPropDirection = ['horizontal', 'vertical'] as const;\nexport type ProgressStepBarPropDirection =\n typeof progressStepBarPropDirection[number];\nexport const progressStepBarPropDirectionDefault =\n progressStepBarPropDirection[0];\n\nexport const progressStepBarPropStatus = [\n 'normal',\n 'success',\n 'warning',\n 'alert',\n] as const;\nexport type ProgressStepBarPropStatus =\n typeof progressStepBarPropStatus[number];\nexport const progressStepBarPropStatusDefault = progressStepBarPropStatus[0];\n\nexport const progressStepBarPointNumbersMap = [\n 0, 1, 2, 3, 4, 5, 6, 7, 8, 9,\n] as const;\nexport type ProgressStepBarPointNumbersMap =\n typeof progressStepBarPointNumbersMap[number];\n\nexport const progressStepBarPropPosition = ['center', 'start', 'end'] as const;\nexport type ProgressStepBarPropPosition =\n typeof progressStepBarPropPosition[number];\nexport const progressStepBarPropPositionDefault: ProgressStepBarPropPosition =\n progressStepBarPropPosition[0];\n\nexport type ProgressStepBarPropGetItemLabel<ITEM> = (\n item: ITEM,\n) => string | undefined;\nexport type ProgressStepBarPropGetItemKey<ITEM> = (\n item: ITEM,\n) => string | number;\nexport type ProgressStepBarPropGetItemTooltipContent<ITEM> = (\n item: ITEM,\n) => string | undefined;\nexport type ProgressStepBarPropGetItemLineStatus<ITEM> = (\n item: ITEM,\n) => ProgressStepBarPropStatus | undefined;\nexport type ProgressStepBarPropGetItemPoint<ITEM> = (\n item: ITEM,\n) => ProgressStepBarPointNumbersMap | IconComponent | undefined;\nexport type ProgressStepBarPropGetItemProgress<ITEM> = (\n item: ITEM,\n) => boolean | undefined;\nexport type ProgressStepBarPropGetItemContent<ITEM> = (\n item: ITEM,\n) => React.ReactNode | undefined;\nexport type ProgressStepBarPropGetItemStatus<ITEM> = (\n item: ITEM,\n) => ProgressStepBarPropStatus | undefined;\nexport type ProgressStepBarPropGetItemOnClick<ITEM> = (\n item: ITEM,\n) => React.EventHandler<React.MouseEvent> | undefined;\n\nexport type ProgressStepBarItemDefault = {\n label?: string;\n tooltipContent?: string;\n lineStatus?: ProgressStepBarPropStatus;\n point?: ProgressStepBarPointNumbersMap | IconComponent;\n status?: ProgressStepBarPropStatus;\n progress?: boolean;\n content?: React.ReactNode;\n onClick?: React.EventHandler<React.MouseEvent>;\n};\n\nexport type Line = {\n status: ProgressStepBarPropStatus;\n size: number;\n};\n\nexport type ProgressStepBarPropOnItemClick<ITEM> = (\n item: ITEM,\n props: {\n e: React.MouseEvent;\n index: number;\n },\n) => void;\n\nexport type ProgressStepBarProps<ITEM = ProgressStepBarItemDefault> =\n PropsWithHTMLAttributesAndRef<\n {\n steps: ITEM[];\n direction?: ProgressStepBarPropDirection;\n size?: ProgressStepBarPropSize;\n activeStepIndex?: number;\n onItemClick?: ProgressStepBarPropOnItemClick<ITEM>;\n getItemLabel?: ProgressStepBarPropGetItemLabel<ITEM>;\n getItemLineStatus?: ProgressStepBarPropGetItemLineStatus<ITEM>;\n getItemTooltipContent?: ProgressStepBarPropGetItemTooltipContent<ITEM>;\n getItemPoint?: ProgressStepBarPropGetItemPoint<ITEM>;\n getItemProgress?: ProgressStepBarPropGetItemProgress<ITEM>;\n getItemContent?: ProgressStepBarPropGetItemContent<ITEM>;\n getItemStatus?: ProgressStepBarPropGetItemStatus<ITEM>;\n getItemOnClick?: ProgressStepBarPropGetItemOnClick<ITEM>;\n },\n HTMLDivElement\n > &\n (ITEM extends { label: ProgressStepBarItemDefault['label'] }\n ? {}\n : { getItemLabel: ProgressStepBarPropGetItemLabel<ITEM> });\n\nexport type ProgressStepBarItemProps = {\n content?: React.ReactNode;\n label?: string;\n point?: ProgressStepBarPointNumbersMap | IconComponent;\n progress?: boolean;\n status?: ProgressStepBarPropStatus | 'system';\n tooltipContent?: string;\n tooltipZIndex?: number;\n position?: ProgressStepBarPropPosition;\n direction: ProgressStepBarPropDirection;\n size: ProgressStepBarPropSize;\n onClick?: (e: React.MouseEvent) => void;\n pointRef?: React.RefObject<HTMLButtonElement>;\n className?: string;\n};\n\nexport const cnProgressStepBar = cn('ProgressStepBar');\n\nexport const defaultGetItemLabel: ProgressStepBarPropGetItemLabel<\n ProgressStepBarItemDefault\n> = (item) => item.label;\nexport const defaultGetItemTooltipContent: ProgressStepBarPropGetItemTooltipContent<\n ProgressStepBarItemDefault\n> = (item) => item.tooltipContent;\nexport const defaultGetItemPoint: ProgressStepBarPropGetItemPoint<\n ProgressStepBarItemDefault\n> = (item) => item.point;\nexport const defaultGetItemLineStatus: ProgressStepBarPropGetItemLineStatus<\n ProgressStepBarItemDefault\n> = (item) => item.lineStatus;\nexport const defaultGetItemProgress: ProgressStepBarPropGetItemProgress<\n ProgressStepBarItemDefault\n> = (item) => item.progress;\nexport const defaultGetItemContent: ProgressStepBarPropGetItemContent<\n ProgressStepBarItemDefault\n> = (item) => item.content;\nexport const defaultGetItemStatus: ProgressStepBarPropGetItemStatus<\n ProgressStepBarItemDefault\n> = (item) => item.status;\nexport const defaultGetItemOnClick: ProgressStepBarPropGetItemOnClick<\n ProgressStepBarItemDefault\n> = (item) => item.onClick;\n\nexport type ProgressStepBarComponent = <ITEM = ProgressStepBarItemDefault>(\n props: ProgressStepBarProps<ITEM>,\n) => React.ReactElement | null;\n\nexport type ProgressStepBarItemComponent = (\n props: PropsWithHTMLAttributesAndRef<\n ProgressStepBarItemProps,\n HTMLDivElement\n >,\n) => React.ReactElement | null;\n\nexport function withDefaultGetters<ITEM>(props: ProgressStepBarProps<ITEM>) {\n return {\n ...props,\n getItemLabel: props.getItemLabel || defaultGetItemLabel,\n getItemTooltipContent:\n props.getItemTooltipContent || defaultGetItemTooltipContent,\n getItemPoint: props.getItemPoint || defaultGetItemPoint,\n getItemProgress: props.getItemProgress || defaultGetItemProgress,\n getItemContent: props.getItemContent || defaultGetItemContent,\n getItemStatus: props.getItemStatus || defaultGetItemStatus,\n getItemLineStatus: props.getItemLineStatus || defaultGetItemLineStatus,\n getItemOnClick: props.getItemOnClick || defaultGetItemOnClick,\n };\n}\n\nexport const getItemPosition = (index: number, lendth: number) => {\n let position: ProgressStepBarPropPosition = 'center';\n if (index === lendth - 1) position = 'end';\n if (index === 0) position = 'start';\n\n return position;\n};\n\nexport const getLineSize: (\n container: React.RefObject<HTMLElement>,\n activeElement: React.RefObject<HTMLElement>,\n direction: ProgressStepBarPropDirection,\n) => number = (container, activeElement, direction) => {\n let size = 0;\n if (\n container &&\n container.current &&\n activeElement &&\n activeElement.current\n ) {\n const containerPosition = container.current.getBoundingClientRect();\n const activeElementPosition = activeElement.current.getBoundingClientRect();\n if (direction === 'vertical')\n size =\n activeElementPosition.y -\n containerPosition.y +\n activeElementPosition.height;\n else size = activeElementPosition.x - containerPosition.x;\n }\n return size;\n};\n\nconst getRefSize = (ref: React.RefObject<HTMLElement>) => {\n if (ref.current) {\n const { width, height } = ref.current.getBoundingClientRect();\n return [width, height];\n }\n return [0, 0];\n};\n\nexport const calculateLines = (\n refs: React.RefObject<HTMLElement>[],\n direction: ProgressStepBarPropDirection,\n) => {\n const sizes: number[] = [];\n for (let i = 0; i < refs.length - 1; i++) {\n const ref = refs[i];\n const firstSize = getRefSize(ref);\n const secondSize = getRefSize(refs[i + 1]);\n let size = 0;\n if (i === 0) {\n size =\n direction === 'horizontal'\n ? firstSize[0] + secondSize[0] / 2\n : firstSize[1];\n } else if (i === refs.length - 2) {\n size =\n direction === 'horizontal'\n ? firstSize[0] / 2 + secondSize[0]\n : firstSize[1] + 2;\n } else {\n size =\n direction === 'horizontal'\n ? firstSize[0] / 2 + secondSize[0] / 2\n : firstSize[1];\n }\n sizes.push(size);\n }\n\n return sizes;\n};\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"helpers.js","names":["cn","progressStepBarPropSize","progressStepBarPropSizeDefault","progressStepBarPropDirection","progressStepBarPropDirectionDefault","progressStepBarPropStatus","progressStepBarPropStatusDefault","progressStepBarPointNumbersMap","progressStepBarPropPosition","progressStepBarPropPositionDefault","cnProgressStepBar","defaultGetItemLabel","item","label","defaultGetItemTooltipContent","tooltipContent","defaultGetItemPoint","point","defaultGetItemLineStatus","lineStatus","defaultGetItemProgress","progress","defaultGetItemContent","content","defaultGetItemStatus","status","defaultGetItemOnClick","onClick","withDefaultGetters","props","getItemLabel","getItemTooltipContent","getItemPoint","getItemProgress","getItemContent","getItemStatus","getItemLineStatus","getItemOnClick","getItemPosition","index","lendth","position","getLineSize","container","activeElement","direction","size","current","containerPosition","getBoundingClientRect","activeElementPosition","y","height","x","getRefSize","ref","width","calculateLines","refs","sizes","i","length","firstSize","secondSize","push","validateVisibleIndex","lenght","Math","min"],"sources":["../../../../../src/components/ProgressStepBar/helpers.ts"],"sourcesContent":["import { IconComponent } from '@consta/icons/Icon';\nimport React from 'react';\n\nimport { cn } from '../../utils/bem';\nimport { PropsWithHTMLAttributesAndRef } from '../../utils/types/PropsWithHTMLAttributes';\n\nexport const progressStepBarPropSize = ['s', 'xs', 'm'] as const;\nexport type ProgressStepBarPropSize = typeof progressStepBarPropSize[number];\nexport const progressStepBarPropSizeDefault = progressStepBarPropSize[0];\n\nexport const progressStepBarPropDirection = ['horizontal', 'vertical'] as const;\nexport type ProgressStepBarPropDirection =\n typeof progressStepBarPropDirection[number];\nexport const progressStepBarPropDirectionDefault =\n progressStepBarPropDirection[0];\n\nexport const progressStepBarPropStatus = [\n 'normal',\n 'success',\n 'warning',\n 'alert',\n] as const;\nexport type ProgressStepBarPropStatus =\n typeof progressStepBarPropStatus[number];\nexport const progressStepBarPropStatusDefault = progressStepBarPropStatus[0];\n\nexport const progressStepBarPointNumbersMap = [\n 0, 1, 2, 3, 4, 5, 6, 7, 8, 9,\n] as const;\nexport type ProgressStepBarPointNumbersMap =\n typeof progressStepBarPointNumbersMap[number];\n\nexport const progressStepBarPropPosition = ['center', 'start', 'end'] as const;\nexport type ProgressStepBarPropPosition =\n typeof progressStepBarPropPosition[number];\nexport const progressStepBarPropPositionDefault: ProgressStepBarPropPosition =\n progressStepBarPropPosition[0];\n\nexport type ProgressStepBarPropGetItemLabel<ITEM> = (\n item: ITEM,\n) => string | undefined;\nexport type ProgressStepBarPropGetItemKey<ITEM> = (\n item: ITEM,\n) => string | number;\nexport type ProgressStepBarPropGetItemTooltipContent<ITEM> = (\n item: ITEM,\n) => string | undefined;\nexport type ProgressStepBarPropGetItemLineStatus<ITEM> = (\n item: ITEM,\n) => ProgressStepBarPropStatus | undefined;\nexport type ProgressStepBarPropGetItemPoint<ITEM> = (\n item: ITEM,\n) => ProgressStepBarPointNumbersMap | IconComponent | undefined;\nexport type ProgressStepBarPropGetItemProgress<ITEM> = (\n item: ITEM,\n) => boolean | undefined;\nexport type ProgressStepBarPropGetItemContent<ITEM> = (\n item: ITEM,\n) => React.ReactNode | undefined;\nexport type ProgressStepBarPropGetItemStatus<ITEM> = (\n item: ITEM,\n) => ProgressStepBarPropStatus | undefined;\nexport type ProgressStepBarPropGetItemOnClick<ITEM> = (\n item: ITEM,\n) => React.EventHandler<React.MouseEvent> | undefined;\n\nexport type ProgressStepBarItemDefault = {\n label?: string;\n tooltipContent?: string;\n lineStatus?: ProgressStepBarPropStatus;\n point?: ProgressStepBarPointNumbersMap | IconComponent;\n status?: ProgressStepBarPropStatus;\n progress?: boolean;\n content?: React.ReactNode;\n onClick?: React.EventHandler<React.MouseEvent>;\n};\n\nexport type Line = {\n status: ProgressStepBarPropStatus;\n size: number;\n};\n\nexport type ProgressStepBarPropOnItemClick<ITEM> = (\n item: ITEM,\n props: {\n e: React.MouseEvent;\n index: number;\n },\n) => void;\n\nexport type ProgressStepBarProps<ITEM = ProgressStepBarItemDefault> =\n PropsWithHTMLAttributesAndRef<\n {\n steps: ITEM[];\n direction?: ProgressStepBarPropDirection;\n size?: ProgressStepBarPropSize;\n activeStepIndex?: number;\n onItemClick?: ProgressStepBarPropOnItemClick<ITEM>;\n getItemLabel?: ProgressStepBarPropGetItemLabel<ITEM>;\n getItemLineStatus?: ProgressStepBarPropGetItemLineStatus<ITEM>;\n getItemTooltipContent?: ProgressStepBarPropGetItemTooltipContent<ITEM>;\n getItemPoint?: ProgressStepBarPropGetItemPoint<ITEM>;\n getItemProgress?: ProgressStepBarPropGetItemProgress<ITEM>;\n getItemContent?: ProgressStepBarPropGetItemContent<ITEM>;\n getItemStatus?: ProgressStepBarPropGetItemStatus<ITEM>;\n getItemOnClick?: ProgressStepBarPropGetItemOnClick<ITEM>;\n },\n HTMLDivElement\n > &\n (ITEM extends { label: ProgressStepBarItemDefault['label'] }\n ? {}\n : { getItemLabel: ProgressStepBarPropGetItemLabel<ITEM> });\n\nexport type ProgressStepBarItemProps = {\n content?: React.ReactNode;\n label?: string;\n point?: ProgressStepBarPointNumbersMap | IconComponent;\n progress?: boolean;\n status?: ProgressStepBarPropStatus | 'system';\n tooltipContent?: string;\n tooltipZIndex?: number;\n position?: ProgressStepBarPropPosition;\n direction: ProgressStepBarPropDirection;\n size: ProgressStepBarPropSize;\n onClick?: (e: React.MouseEvent) => void;\n pointRef?: React.RefObject<HTMLButtonElement>;\n className?: string;\n};\n\nexport const cnProgressStepBar = cn('ProgressStepBar');\n\nexport const defaultGetItemLabel: ProgressStepBarPropGetItemLabel<\n ProgressStepBarItemDefault\n> = (item) => item.label;\nexport const defaultGetItemTooltipContent: ProgressStepBarPropGetItemTooltipContent<\n ProgressStepBarItemDefault\n> = (item) => item.tooltipContent;\nexport const defaultGetItemPoint: ProgressStepBarPropGetItemPoint<\n ProgressStepBarItemDefault\n> = (item) => item.point;\nexport const defaultGetItemLineStatus: ProgressStepBarPropGetItemLineStatus<\n ProgressStepBarItemDefault\n> = (item) => item.lineStatus;\nexport const defaultGetItemProgress: ProgressStepBarPropGetItemProgress<\n ProgressStepBarItemDefault\n> = (item) => item.progress;\nexport const defaultGetItemContent: ProgressStepBarPropGetItemContent<\n ProgressStepBarItemDefault\n> = (item) => item.content;\nexport const defaultGetItemStatus: ProgressStepBarPropGetItemStatus<\n ProgressStepBarItemDefault\n> = (item) => item.status;\nexport const defaultGetItemOnClick: ProgressStepBarPropGetItemOnClick<\n ProgressStepBarItemDefault\n> = (item) => item.onClick;\n\nexport type ProgressStepBarComponent = <ITEM = ProgressStepBarItemDefault>(\n props: ProgressStepBarProps<ITEM>,\n) => React.ReactElement | null;\n\nexport type ProgressStepBarItemComponent = (\n props: PropsWithHTMLAttributesAndRef<\n ProgressStepBarItemProps,\n HTMLDivElement\n >,\n) => React.ReactElement | null;\n\nexport function withDefaultGetters<ITEM>(props: ProgressStepBarProps<ITEM>) {\n return {\n ...props,\n getItemLabel: props.getItemLabel || defaultGetItemLabel,\n getItemTooltipContent:\n props.getItemTooltipContent || defaultGetItemTooltipContent,\n getItemPoint: props.getItemPoint || defaultGetItemPoint,\n getItemProgress: props.getItemProgress || defaultGetItemProgress,\n getItemContent: props.getItemContent || defaultGetItemContent,\n getItemStatus: props.getItemStatus || defaultGetItemStatus,\n getItemLineStatus: props.getItemLineStatus || defaultGetItemLineStatus,\n getItemOnClick: props.getItemOnClick || defaultGetItemOnClick,\n };\n}\n\nexport const getItemPosition = (index: number, lendth: number) => {\n let position: ProgressStepBarPropPosition = 'center';\n if (index === lendth - 1) position = 'end';\n if (index === 0) position = 'start';\n\n return position;\n};\n\nexport const getLineSize: (\n container: React.RefObject<HTMLElement>,\n activeElement: React.RefObject<HTMLElement>,\n direction: ProgressStepBarPropDirection,\n) => number = (container, activeElement, direction) => {\n let size = 0;\n if (\n container &&\n container.current &&\n activeElement &&\n activeElement.current\n ) {\n const containerPosition = container.current.getBoundingClientRect();\n const activeElementPosition = activeElement.current.getBoundingClientRect();\n if (direction === 'vertical')\n size =\n activeElementPosition.y -\n containerPosition.y +\n activeElementPosition.height;\n else size = activeElementPosition.x - containerPosition.x;\n }\n return size;\n};\n\nconst getRefSize = (ref: React.RefObject<HTMLElement>) => {\n if (ref.current) {\n const { width, height } = ref.current.getBoundingClientRect();\n return [width, height];\n }\n return [0, 0];\n};\n\nexport const calculateLines = (\n refs: React.RefObject<HTMLElement>[],\n direction: ProgressStepBarPropDirection,\n) => {\n const sizes: number[] = [];\n for (let i = 0; i < refs.length - 1; i++) {\n const ref = refs[i];\n const firstSize = getRefSize(ref);\n const secondSize = getRefSize(refs[i + 1]);\n let size = 0;\n if (i === 0) {\n size =\n direction === 'horizontal'\n ? firstSize[0] + secondSize[0] / 2\n : firstSize[1];\n } else if (i === refs.length - 2) {\n size =\n direction === 'horizontal'\n ? firstSize[0] / 2 + secondSize[0]\n : firstSize[1] + 2;\n } else {\n size =\n direction === 'horizontal'\n ? firstSize[0] / 2 + secondSize[0] / 2\n : firstSize[1];\n }\n sizes.push(size);\n }\n\n return sizes;\n};\n\nexport const validateVisibleIndex = (\n lenght: number,\n index: number | undefined,\n) => {\n if (!index) {\n return index;\n }\n\n if (index < 0) {\n return undefined;\n }\n\n return Math.min(index, lenght - 1);\n};\n"],"mappings":"qqBAGA,OAASA,EAAT,uBAGA,MAAO,IAAMC,wBAAuB,CAAG,CAAC,GAAD,CAAM,IAAN,CAAY,GAAZ,CAAhC,CAEP,MAAO,IAAMC,+BAA8B,CAAGD,uBAAuB,CAAC,CAAD,CAA9D,CAEP,MAAO,IAAME,6BAA4B,CAAG,CAAC,YAAD,CAAe,UAAf,CAArC,CAGP,MAAO,IAAMC,oCAAmC,CAC9CD,4BAA4B,CAAC,CAAD,CADvB,CAGP,MAAO,IAAME,0BAAyB,CAAG,CACvC,QADuC,CAEvC,SAFuC,CAGvC,SAHuC,CAIvC,OAJuC,CAAlC,CAQP,MAAO,IAAMC,iCAAgC,CAAGD,yBAAyB,CAAC,CAAD,CAAlE,CAEP,MAAO,IAAME,+BAA8B,CAAG,CAC5C,CAD4C,CACzC,CADyC,CACtC,CADsC,CACnC,CADmC,CAChC,CADgC,CAC7B,CAD6B,CAC1B,CAD0B,CACvB,CADuB,CACpB,CADoB,CACjB,CADiB,CAAvC,CAMP,MAAO,IAAMC,4BAA2B,CAAG,CAAC,QAAD,CAAW,OAAX,CAAoB,KAApB,CAApC,CAGP,MAAO,IAAMC,mCAA+D,CAC1ED,2BAA2B,CAAC,CAAD,CADtB,CA8FP,MAAO,IAAME,kBAAiB,CAAGV,EAAE,CAAC,iBAAD,CAA5B,CAEP,MAAO,IAAMW,oBAEZ,CAAG,SAACC,CAAD,QAAUA,EAAI,CAACC,KAAf,CAFG,CAGP,MAAO,IAAMC,6BAEZ,CAAG,SAACF,CAAD,QAAUA,EAAI,CAACG,cAAf,CAFG,CAGP,MAAO,IAAMC,oBAEZ,CAAG,SAACJ,CAAD,QAAUA,EAAI,CAACK,KAAf,CAFG,CAGP,MAAO,IAAMC,yBAEZ,CAAG,SAACN,CAAD,QAAUA,EAAI,CAACO,UAAf,CAFG,CAGP,MAAO,IAAMC,uBAEZ,CAAG,SAACR,CAAD,QAAUA,EAAI,CAACS,QAAf,CAFG,CAGP,MAAO,IAAMC,sBAEZ,CAAG,SAACV,CAAD,QAAUA,EAAI,CAACW,OAAf,CAFG,CAGP,MAAO,IAAMC,qBAEZ,CAAG,SAACZ,CAAD,QAAUA,EAAI,CAACa,MAAf,CAFG,CAGP,MAAO,IAAMC,sBAEZ,CAAG,SAACd,CAAD,QAAUA,EAAI,CAACe,OAAf,CAFG,CAeP,MAAO,SAASC,mBAAT,CAAkCC,CAAlC,CAAqE,CAC1E,sCACKA,CADL,MAEEC,YAAY,CAAED,CAAK,CAACC,YAAN,EAAsBnB,mBAFtC,CAGEoB,qBAAqB,CACnBF,CAAK,CAACE,qBAAN,EAA+BjB,4BAJnC,CAKEkB,YAAY,CAAEH,CAAK,CAACG,YAAN,EAAsBhB,mBALtC,CAMEiB,eAAe,CAAEJ,CAAK,CAACI,eAAN,EAAyBb,sBAN5C,CAOEc,cAAc,CAAEL,CAAK,CAACK,cAAN,EAAwBZ,qBAP1C,CAQEa,aAAa,CAAEN,CAAK,CAACM,aAAN,EAAuBX,oBARxC,CASEY,iBAAiB,CAAEP,CAAK,CAACO,iBAAN,EAA2BlB,wBAThD,CAUEmB,cAAc,CAAER,CAAK,CAACQ,cAAN,EAAwBX,qBAV1C,EAYD,CAED,MAAO,IAAMY,gBAAe,CAAG,SAACC,CAAD,CAAgBC,CAAhB,CAAmC,CAChE,GAAIC,EAAqC,CAAG,QAA5C,CAIA,MAHIF,EAAK,GAAKC,CAAM,CAAG,CAGvB,GAH0BC,CAAQ,CAAG,KAGrC,EAFc,CAAV,GAAAF,CAEJ,GAFiBE,CAAQ,CAAG,OAE5B,EAAOA,CACR,CANM,CAQP,MAAO,IAAMC,YAIF,CAAG,SAACC,CAAD,CAAYC,CAAZ,CAA2BC,CAA3B,CAAyC,CACrD,GAAIC,EAAI,CAAG,CAAX,CACA,GACEH,CAAS,EACTA,CAAS,CAACI,OADV,EAEAH,CAFA,EAGAA,CAAa,CAACG,OAJhB,CAKE,IACMC,EAAiB,CAAGL,CAAS,CAACI,OAAV,CAAkBE,qBAAlB,EAD1B,CAEMC,CAAqB,CAAGN,CAAa,CAACG,OAAd,CAAsBE,qBAAtB,EAF9B,CAIEH,CAJF,CAGkB,UAAd,GAAAD,CAHJ,CAKIK,CAAqB,CAACC,CAAtB,CACAH,CAAiB,CAACG,CADlB,CAEAD,CAAqB,CAACE,MAP1B,CAQYF,CAAqB,CAACG,CAAtB,CAA0BL,CAAiB,CAACK,CACzD,CACD,MAAOP,EACR,CAtBM,CAwBP,GAAMQ,WAAU,CAAG,SAACC,CAAD,CAAuC,CACxD,GAAIA,CAAG,CAACR,OAAR,CAAiB,CACf,MAA0BQ,CAAG,CAACR,OAAJ,CAAYE,qBAAZ,EAA1B,CAAQO,CAAR,GAAQA,KAAR,CAAeJ,CAAf,GAAeA,MAAf,CACA,MAAO,CAACI,CAAD,CAAQJ,CAAR,CACR,CACD,MAAO,CAAC,CAAD,CAAI,CAAJ,CACR,CAND,CAQA,MAAO,IAAMK,eAAc,CAAG,SAC5BC,CAD4B,CAE5Bb,CAF4B,CAGzB,CAEH,OADMc,EAAe,CAAG,EACxB,CAASC,CAAC,CAAG,CAAb,CAAgBA,CAAC,CAAGF,CAAI,CAACG,MAAL,CAAc,CAAlC,CAAqCD,CAAC,EAAtC,CAA0C,IAClCL,EAAG,CAAGG,CAAI,CAACE,CAAD,CADwB,CAElCE,CAAS,CAAGR,UAAU,CAACC,CAAD,CAFY,CAGlCQ,CAAU,CAAGT,UAAU,CAACI,CAAI,CAACE,CAAC,CAAG,CAAL,CAAL,CAHW,CAIpCd,CAAI,CAAG,CAJ6B,CAMtCA,CANsC,CAK9B,CAAN,EAAAc,CALoC,CAOtB,YAAd,GAAAf,CAAS,CACLiB,CAAS,CAAC,CAAD,CAAT,CAAeC,CAAU,CAAC,CAAD,CAAV,CAAgB,CAD1B,CAELD,CAAS,CAAC,CAAD,CATuB,CAU7BF,CAAC,GAAKF,CAAI,CAACG,MAAL,CAAc,CAVS,CAYtB,YAAd,GAAAhB,CAAS,CACLiB,CAAS,CAAC,CAAD,CAAT,CAAe,CAAf,CAAmBC,CAAU,CAAC,CAAD,CADxB,CAELD,CAAS,CAAC,CAAD,CAAT,CAAe,CAdiB,CAiBtB,YAAd,GAAAjB,CAAS,CACLiB,CAAS,CAAC,CAAD,CAAT,CAAe,CAAf,CAAmBC,CAAU,CAAC,CAAD,CAAV,CAAgB,CAD9B,CAELD,CAAS,CAAC,CAAD,CAnBuB,CAqBxCH,CAAK,CAACK,IAAN,CAAWlB,CAAX,CACD,CAED,MAAOa,EACR,CA9BM,CAgCP,MAAO,IAAMM,qBAAoB,CAAG,SAClCC,CADkC,CAElC3B,CAFkC,CAG/B,OACEA,EADF,CAKS,CAAR,CAAAA,CALD,QASI4B,IAAI,CAACC,GAAL,CAAS7B,CAAT,CAAgB2B,CAAM,CAAG,CAAzB,CATJ,CAEM3B,CAQV,CAbM"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{createRef,useMemo}from"react";export function useScrollElements(a){var b=useMemo(function(){for(var b=[],c=0;c<a.length;c++)b[c]=createRef();return b},[a])
|
|
1
|
+
import{createRef,useMemo}from"react";import{useDebounce}from"../useDebounce";export function useScrollElements(a){var b=useMemo(function(){for(var b=[],c=0;c<a.length;c++)b[c]=createRef();return b},[a]),c=useDebounce(function(a){var c,d=b[Math.max(a,0)],e=null===d||void 0===d||null===(c=d.current)||void 0===c?void 0:c.parentElement;if(null!==d&&void 0!==d&&d.current&&e){var f="relative"===getComputedStyle(e).position?0:e.offsetLeft,g=d.current.offsetLeft-f;0>=a?g=0:a==b.length-1&&(g=e.scrollWidth),e.scrollTo({left:g,behavior:"smooth"})}},20);return{refs:b,scrollTo:c}}
|
|
2
2
|
//# sourceMappingURL=useScrollElements.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useScrollElements.js","names":["createRef","useMemo","useScrollElements","items","refs","refArray","i","length","scrollTo","index","currentRef","Math","max","container","current","parentElement","defaultPadding","getComputedStyle","position","offsetLeft","scrollLeft","scrollWidth"],"sources":["../../../../../src/hooks/useScrollElements/useScrollElements.tsx"],"sourcesContent":["import React, { createRef, useMemo } from 'react';\n\ntype UseScrollElementsResult = {\n refs: React.RefObject<HTMLElement>[];\n scrollTo: (index: number) => void;\n};\n\nexport function useScrollElements<ITEM>(\n items: ITEM[],\n): UseScrollElementsResult {\n const refs = useMemo(() => {\n const refArray: React.RefObject<HTMLElement>[] = [];\n\n for (let i = 0; i < items.length; i++) {\n refArray[i] = createRef<HTMLElement>();\n }\n\n return refArray;\n }, [items]);\n\n const scrollTo = (index: number) => {\n const currentRef = refs[Math.max(index, 0)];\n const container = currentRef
|
|
1
|
+
{"version":3,"file":"useScrollElements.js","names":["createRef","useMemo","useDebounce","useScrollElements","items","refs","refArray","i","length","scrollTo","index","currentRef","Math","max","container","current","parentElement","defaultPadding","getComputedStyle","position","offsetLeft","scrollLeft","scrollWidth","left","behavior"],"sources":["../../../../../src/hooks/useScrollElements/useScrollElements.tsx"],"sourcesContent":["import React, { createRef, useMemo } from 'react';\n\nimport { useDebounce } from '##/hooks/useDebounce';\n\ntype UseScrollElementsResult = {\n refs: React.RefObject<HTMLElement>[];\n scrollTo: (index: number) => void;\n};\n\nexport function useScrollElements<ITEM>(\n items: ITEM[],\n): UseScrollElementsResult {\n const refs = useMemo(() => {\n const refArray: React.RefObject<HTMLElement>[] = [];\n\n for (let i = 0; i < items.length; i++) {\n refArray[i] = createRef<HTMLElement>();\n }\n\n return refArray;\n }, [items]);\n\n const scrollTo = useDebounce((index: number) => {\n const currentRef = refs[Math.max(index, 0)];\n const container = currentRef?.current?.parentElement;\n if (currentRef?.current && container) {\n const defaultPadding =\n getComputedStyle(container).position !== 'relative'\n ? container.offsetLeft\n : 0;\n\n let scrollLeft = currentRef.current.offsetLeft - defaultPadding;\n\n if (index <= 0) {\n scrollLeft = 0;\n } else if (index === refs.length - 1) {\n scrollLeft = container.scrollWidth;\n }\n\n container.scrollTo({\n left: scrollLeft,\n behavior: 'smooth',\n });\n }\n }, 20);\n\n return {\n refs,\n scrollTo,\n };\n}\n"],"mappings":"AAAA,OAAgBA,SAAhB,CAA2BC,OAA3B,KAA0C,OAA1C,CAEA,OAASC,WAAT,sBAOA,MAAO,SAASC,kBAAT,CACLC,CADK,CAEoB,IACnBC,EAAI,CAAGJ,OAAO,CAAC,UAAM,CAGzB,OAFMK,EAAwC,CAAG,EAEjD,CAASC,CAAC,CAAG,CAAb,CAAgBA,CAAC,CAAGH,CAAK,CAACI,MAA1B,CAAkCD,CAAC,EAAnC,CACED,CAAQ,CAACC,CAAD,CAAR,CAAcP,SAAS,EAAvB,CAGF,MAAOM,EACR,CARmB,CAQjB,CAACF,CAAD,CARiB,CADK,CAWnBK,CAAQ,CAAGP,WAAW,CAAC,SAACQ,CAAD,CAAmB,OACxCC,CAAU,CAAGN,CAAI,CAACO,IAAI,CAACC,GAAL,CAASH,CAAT,CAAgB,CAAhB,CAAD,CADuB,CAExCI,CAAS,QAAGH,CAAH,WAAGA,CAAH,YAAGA,CAAU,CAAEI,OAAf,qBAAG,EAAqBC,aAFO,CAG9C,GAAI,OAAAL,CAAU,WAAVA,CAAA,EAAAA,CAAU,CAAEI,OAAZ,EAAuBD,CAA3B,CAAsC,IAC9BG,EAAc,CACuB,UAAzC,GAAAC,gBAAgB,CAACJ,CAAD,CAAhB,CAA4BK,QAA5B,CAEI,CAFJ,CACIL,CAAS,CAACM,UAHoB,CAMhCC,CAAU,CAAGV,CAAU,CAACI,OAAX,CAAmBK,UAAnB,CAAgCH,CANb,CAQvB,CAAT,EAAAP,CARgC,CASlCW,CAAU,CAAG,CATqB,CAUzBX,CAAK,EAAKL,CAAI,CAACG,MAAL,CAAc,CAVC,GAWlCa,CAAU,CAAGP,CAAS,CAACQ,WAXW,EAcpCR,CAAS,CAACL,QAAV,CAAmB,CACjBc,IAAI,CAAEF,CADW,CAEjBG,QAAQ,CAAE,QAFO,CAAnB,CAID,CACF,CAtB2B,CAsBzB,EAtByB,CAXH,CAmCzB,MAAO,CACLnB,IAAI,CAAJA,CADK,CAELI,QAAQ,CAARA,CAFK,CAIR"}
|