@consta/uikit 5.0.2 → 5.1.0

package/__internal__/src/components/Pagination/helpers.js.map

@@ -1 +1 @@
-{"version":3,"file":"helpers.js","names":["IconArrowFirst","IconArrowLast","IconArrowLeft","IconArrowRight","defaultGetItemLabel","item","label","defaultGetItemKey","key","defaultGetItemClickable","clickable","defaultGetItemAs","as","defaultGetItemAttributes","attributes","defaultGetItemRef","ref","defaultGetItemOnClick","onClick","withDefaultGetters","props","getItemLabel","getItemKey","getItemClickable","getItemOnClick","getItemAs","getItemAttributes","getItemRef","getMinVisibleCount","showFirstPage","showLastPage","range","start","end","Array","from","length","Math","abs","map","_el","i","floor","generateArr","params","count","page","visibleCountProp","visibleCount","minVisibleCount","min","max","boundaryStart","boundaryEnd","res","siblingsStart","siblingsEnd","push","getPagesArray","totalPages","currentPage","rest","el","toString","active","paginationArrowIconsMap","first","previous","next","last","getListValue"],"sources":["../../../../../src/components/Pagination/helpers.ts"],"sourcesContent":["import { IconComponent } from '@consta/icons/Icon';\nimport { IconArrowFirst } from '@consta/icons/IconArrowFirst';\nimport { IconArrowLast } from '@consta/icons/IconArrowLast';\nimport { IconArrowLeft } from '@consta/icons/IconArrowLeft';\nimport { IconArrowRight } from '@consta/icons/IconArrowRight';\n\nimport {\n  PaginationArrowTypes,\n  PaginationBaseItemDefault,\n  PaginationBaseProps,\n  PaginationItem,\n  PaginationPropGetItemAs,\n  PaginationPropGetItemAttributes,\n  PaginationPropGetItemClickable,\n  PaginationPropGetItemKey,\n  PaginationPropGetItemLabel,\n  PaginationPropGetItemOnClick,\n  PaginationPropGetItemRef,\n} from './types';\n\nexport const defaultGetItemLabel: PaginationPropGetItemLabel<\n  PaginationBaseItemDefault\n> = (item) => item.label;\nexport const defaultGetItemKey: PaginationPropGetItemKey<\n  PaginationBaseItemDefault\n> = (item) => item.key;\nexport const defaultGetItemClickable: PaginationPropGetItemClickable<\n  PaginationBaseItemDefault\n> = (item) => item.clickable;\nconst defaultGetItemAs: PaginationPropGetItemAs<PaginationBaseItemDefault> = (\n  item,\n) => item.as;\nconst defaultGetItemAttributes: PaginationPropGetItemAttributes<\n  PaginationBaseItemDefault\n> = (item) => item.attributes;\nconst defaultGetItemRef: PaginationPropGetItemRef<PaginationBaseItemDefault> = (\n  item,\n) => item.ref;\nconst defaultGetItemOnClick: PaginationPropGetItemOnClick<\n  PaginationBaseItemDefault\n> = (item) => item.onClick;\n\nexport const withDefaultGetters = (props: PaginationBaseProps) => ({\n  ...props,\n  getItemLabel: props.getItemLabel ?? defaultGetItemLabel,\n  getItemKey: props.getItemKey ?? defaultGetItemKey,\n  getItemClickable: props.getItemClickable ?? defaultGetItemClickable,\n  getItemOnClick: props.getItemOnClick ?? defaultGetItemOnClick,\n  getItemAs: props.getItemAs ?? defaultGetItemAs,\n  getItemAttributes: props.getItemAttributes ?? defaultGetItemAttributes,\n  getItemRef: props.getItemRef ?? defaultGetItemRef,\n});\n\nconst getMinVisibleCount = (showFirstPage: boolean, showLastPage: boolean) => {\n  if (showFirstPage || showLastPage) {\n    return 5;\n  }\n  if (showFirstPage && showLastPage) {\n    return 7;\n  }\n\n  return 3;\n};\n\nconst range = (start: number, end: number) =>\n  Array.from({ length: Math.abs(end - start + 1) }).map((_el, i) =>\n    Math.floor(start + i),\n  );\n\nconst generateArr = (params: {\n  page: number;\n  count: number;\n  visibleCount: number;\n  showFirstPage?: boolean;\n  showLastPage?: boolean;\n}) => {\n  const {\n    count,\n    page,\n    showFirstPage = false,\n    showLastPage = false,\n    visibleCount: visibleCountProp,\n  } = params;\n\n  let visibleCount = visibleCountProp;\n\n  const minVisibleCount = getMinVisibleCount(showFirstPage, showLastPage);\n\n  if (minVisibleCount >= count) {\n    visibleCount = count;\n  } else {\n    visibleCount = Math.min(count, Math.max(visibleCountProp, minVisibleCount));\n  }\n\n  const boundaryStart = showFirstPage ? 2 : 0;\n  const boundaryEnd = showLastPage ? 2 : 0;\n\n  const res = [];\n\n  const siblingsStart =\n    Math.floor((visibleCount - boundaryEnd - boundaryStart) / 2) || 0;\n  const siblingsEnd =\n    Math.floor((visibleCount - boundaryEnd - boundaryStart - 1) / 2) || 0;\n\n  let start = 1;\n  let end = count;\n\n  if (visibleCount - boundaryEnd >= page + siblingsEnd) {\n    end = visibleCount - (showLastPage ? 2 : 0);\n  } else if (page - siblingsStart > count - visibleCount + boundaryStart) {\n    start = count - visibleCount + (showFirstPage ? 3 : 1);\n  } else {\n    start = page - siblingsStart;\n    end = page + siblingsEnd;\n  }\n\n  if (showFirstPage && start !== 1) {\n    res.push(1, '...');\n  }\n  res.push(...range(Math.floor(start), Math.floor(end)));\n\n  if (showLastPage && end !== count) {\n    res.push('...', count);\n  }\n\n  return res;\n};\n\nexport const getPagesArray = (params: {\n  currentPage: number;\n  totalPages: number;\n  visibleCount: number;\n  showFirstPage?: boolean;\n  showLastPage?: boolean;\n}): PaginationItem[] => {\n  const { totalPages, currentPage, ...rest } = params;\n\n  const count = Math.max(totalPages, 1);\n  const page = Math.min(count, Math.max(1, currentPage));\n\n  return generateArr({ page, count, ...rest }).map((el, i) => {\n    return {\n      key: typeof el === 'string' ? totalPages + i : el,\n      label: el.toString(),\n      page: typeof el === 'string' ? i : el,\n      active: typeof el === 'number' ? el === page : false,\n      clickable: typeof el !== 'number',\n    };\n  });\n};\n\nexport const paginationArrowIconsMap: Record<\n  PaginationArrowTypes,\n  IconComponent\n> = {\n  first: IconArrowFirst,\n  previous: IconArrowLeft,\n  next: IconArrowRight,\n  last: IconArrowLast,\n};\n\nexport const getListValue = (page: number): PaginationItem => ({\n  key: page,\n  page,\n  label: page.toString(),\n});\n"],"mappings":"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"}
+{"version":3,"file":"helpers.js","names":["IconArrowFirst","IconArrowLast","IconArrowLeft","IconArrowRight","range","defaultGetItemLabel","item","label","defaultGetItemKey","key","defaultGetItemClickable","clickable","firstPageSeparator","lastPageSeparator","pageSeparatorLabel","guardCurrentPage","currentPage","totalPages","Math","floor","max","min","getPagesArrayByVisibleCount","visibleCountProp","showFirstPage","showLastPage","visibleCount","page","visibleSegmentStartToCenter","ceil","visibleSegmentEndToCenter","slideStart","map","i","el","toString","getPagesArrayByWidth","currentPageArg","gap","buttonPadding","buttonMinWidth","maxSymbolSize","totalWidth","w","direction","leftIndex","rightIndex","pages","getButtonWidth","withGap","length","add","buttonWidth","push","unshift","moreButtonWidth","firstButtonWidth","lastButtonWidth","isAddFirstPage","isAddlastPage","slicedArray","array","slice","reduce","previous","currentValue","returned","getPagesArray","paginationArrowIconsMap","first","next","last"],"sources":["../../../../../src/components/Pagination/helpers.ts"],"sourcesContent":["import { IconComponent } from '@consta/icons/Icon';\nimport { IconArrowFirst } from '@consta/icons/IconArrowFirst';\nimport { IconArrowLast } from '@consta/icons/IconArrowLast';\nimport { IconArrowLeft } from '@consta/icons/IconArrowLeft';\nimport { IconArrowRight } from '@consta/icons/IconArrowRight';\n\nimport { range } from '##/utils/array';\n\nimport {\n  PaginationArrowTypes,\n  PaginationBaseItemDefault,\n  PaginationItem,\n  PaginationPropGetItemClickable,\n  PaginationPropGetItemKey,\n  PaginationPropGetItemLabel,\n} from './types';\n\nexport const defaultGetItemLabel: PaginationPropGetItemLabel<\n  PaginationBaseItemDefault\n> = (item) => item.label;\nexport const defaultGetItemKey: PaginationPropGetItemKey<\n  PaginationBaseItemDefault\n> = (item) => item.key;\nexport const defaultGetItemClickable: PaginationPropGetItemClickable<\n  PaginationBaseItemDefault\n> = (item) => item.clickable ?? true;\n\nexport const firstPageSeparator = '<_';\nexport const lastPageSeparator = '_>';\nexport const pageSeparatorLabel = '...';\nexport const guardCurrentPage = (\n  currentPage: number | undefined,\n  totalPages: number,\n) => Math.floor(Math.max(1, Math.min(currentPage || 0, totalPages)));\n\nexport const getPagesArrayByVisibleCount = (\n  currentPage: number,\n  totalPages: number,\n  visibleCountProp: number,\n  showFirstPage?: boolean,\n  showLastPage?: boolean,\n): PaginationItem[] => {\n  const visibleCount = Math.floor(Math.min(visibleCountProp, totalPages));\n  const page = guardCurrentPage(currentPage, totalPages);\n  const visibleSegmentStartToCenter = Math.ceil(visibleCount / 2);\n  const visibleSegmentEndToCenter = visibleCount - visibleSegmentStartToCenter;\n  const slideStart = Math.max(0, page - visibleSegmentStartToCenter);\n\n  return range(visibleCount).map((i) => {\n    const el =\n      i +\n      slideStart +\n      1 -\n      Math.max(0, page + visibleSegmentEndToCenter - totalPages);\n\n    if (visibleCount >= 5 && visibleCount < totalPages) {\n      if (showFirstPage && i === 0 && page - visibleSegmentStartToCenter > 0) {\n        return {\n          key: 1,\n          label: '1',\n          clickable: true,\n        };\n      }\n      if (showFirstPage && i === 1 && page - visibleSegmentStartToCenter > 0) {\n        return {\n          key: firstPageSeparator,\n          label: pageSeparatorLabel,\n          clickable: false,\n        };\n      }\n      if (\n        showLastPage &&\n        i === visibleCount - 1 &&\n        page + visibleSegmentEndToCenter < totalPages\n      ) {\n        return {\n          key: totalPages,\n          label: totalPages.toString(),\n          clickable: true,\n        };\n      }\n      if (\n        showLastPage &&\n        i === visibleCount - 2 &&\n        page + visibleSegmentEndToCenter < totalPages\n      ) {\n        return {\n          key: lastPageSeparator,\n          label: pageSeparatorLabel,\n          clickable: false,\n        };\n      }\n    }\n\n    return {\n      key: el,\n      label: el.toString(),\n      clickable: true,\n    };\n  });\n};\n\ntype GetPagesArray = (\n  currentPage: number,\n  totalPages: number,\n  visibleCount: number,\n  showFirstPage: boolean,\n  showLastPage: boolean,\n  gap: number,\n  buttonPadding: number,\n  buttonMinWidth: number,\n  maxSymbolSize: number,\n  totalWidth: number,\n) => PaginationItem[];\n\ntype GetPagesArrayByWidth = (\n  currentPage: number,\n  totalPages: number,\n  showFirstPage: boolean,\n  showLastPage: boolean,\n  gap: number,\n  buttonPadding: number,\n  buttonMinWidth: number,\n  maxSymbolSize: number,\n  totalWidth: number,\n) => PaginationItem[];\n\nexport const getPagesArrayByWidth: GetPagesArrayByWidth = (\n  currentPageArg,\n  totalPages,\n  showFirstPage,\n  showLastPage,\n  gap: number,\n  buttonPadding: number,\n  buttonMinWidth: number,\n  maxSymbolSize: number,\n  totalWidth: number,\n) => {\n  const currentPage = guardCurrentPage(currentPageArg, totalPages);\n\n  let w = totalWidth;\n  // направлеине добавления кнопки, true - влево, false - вправо\n  let direction = false;\n  // индекс добавляемой кнопки относительно от выбранной\n  let leftIndex = 0;\n  let rightIndex = 1;\n  let pages: (PaginationItem & { buttonWidth: number })[] = [];\n\n  const getButtonWidth = (label: number, withGap: boolean) => {\n    return (\n      Math.max(\n        label.toString().length * maxSymbolSize + buttonPadding,\n        buttonMinWidth,\n      ) + (withGap ? gap : 0)\n    );\n  };\n\n  while (w > 0 && pages.length < totalPages) {\n    const add = direction ? currentPage + rightIndex : currentPage - leftIndex;\n\n    const buttonWidth: number = getButtonWidth(add, Boolean(pages.length));\n\n    if (w - buttonWidth >= 0 && add <= totalPages && add >= 1) {\n      const el = {\n        key: add,\n        label: add.toString(),\n        clickable: true,\n        buttonWidth,\n      };\n\n      if (direction) {\n        pages.push(el);\n        rightIndex += 1;\n      } else {\n        pages.unshift(el);\n        leftIndex += 1;\n      }\n    }\n    direction = !direction;\n\n    w -= add <= totalPages && add >= 1 ? buttonWidth : 0;\n  }\n\n  if ((showFirstPage || showLastPage) && pages.length >= 5) {\n    const moreButtonWidth = getButtonWidth(1, true);\n    const firstButtonWidth = getButtonWidth(1, true);\n    const lastButtonWidth = getButtonWidth(totalPages, true);\n\n    let isAddFirstPage = false;\n    let isAddlastPage = false;\n\n    if (showFirstPage && pages[0].key !== 1) {\n      let array = [...pages];\n\n      while (array.length > 3) {\n        if (array[0].key === currentPage) {\n          break;\n        }\n\n        const slicedArray = array.slice(1);\n\n        if (\n          slicedArray\n            .map((el) => el.buttonWidth)\n            .reduce((previous, currentValue) => previous + currentValue) +\n            firstButtonWidth +\n            moreButtonWidth <=\n          totalWidth\n        ) {\n          isAddFirstPage = true;\n          pages = [...slicedArray];\n          break;\n        }\n\n        array = slicedArray;\n      }\n    }\n\n    if (showLastPage && pages[pages.length - 1].key !== totalPages) {\n      let array = [...pages];\n\n      while (array.length > 3) {\n        if (array[array.length - 1].key === totalPages) {\n          break;\n        }\n\n        const slicedArray = array.slice(0, -1);\n\n        if (\n          slicedArray\n            .map((el) => el.buttonWidth)\n            .reduce((previous, currentValue) => previous + currentValue) +\n            lastButtonWidth +\n            moreButtonWidth +\n            (isAddFirstPage ? firstButtonWidth + moreButtonWidth : 0) <=\n          totalWidth\n        ) {\n          isAddlastPage = true;\n          pages = [...slicedArray];\n          break;\n        }\n\n        array = slicedArray;\n      }\n    }\n\n    pages = [\n      ...(isAddFirstPage\n        ? [\n            {\n              key: 1,\n              label: '1',\n              clickable: true,\n              buttonWidth: firstButtonWidth,\n            },\n            {\n              key: firstPageSeparator,\n              label: pageSeparatorLabel,\n              buttonWidth: moreButtonWidth,\n              clickable: false,\n            },\n          ]\n        : []),\n      ...pages,\n      ...(isAddlastPage\n        ? [\n            {\n              key: lastPageSeparator,\n              label: pageSeparatorLabel,\n              buttonWidth: moreButtonWidth,\n              clickable: false,\n            },\n            {\n              key: totalPages,\n              label: totalPages.toString(),\n              clickable: true,\n              buttonWidth: firstButtonWidth,\n            },\n          ]\n        : []),\n    ];\n  }\n\n  const returned: PaginationItem[] = pages.map(({ key, label, clickable }) => ({\n    key,\n    label,\n    clickable,\n  }));\n\n  return returned;\n};\n\nexport const getPagesArray: GetPagesArray = (\n  currentPage,\n  totalPages = 1,\n  visibleCount,\n  showFirstPage,\n  showLastPage,\n  gap,\n  buttonPadding,\n  buttonMinWidth,\n  maxSymbolSize,\n  totalWidth,\n) => {\n  return visibleCount\n    ? getPagesArrayByVisibleCount(\n        currentPage,\n        totalPages,\n        visibleCount,\n        showFirstPage,\n        showLastPage,\n      )\n    : getPagesArrayByWidth(\n        currentPage,\n        totalPages,\n        showFirstPage,\n        showLastPage,\n        gap,\n        buttonPadding,\n        buttonMinWidth,\n        maxSymbolSize,\n        totalWidth,\n      );\n};\n\nexport const paginationArrowIconsMap: Record<\n  PaginationArrowTypes,\n  IconComponent\n> = {\n  first: IconArrowFirst,\n  previous: IconArrowLeft,\n  next: IconArrowRight,\n  last: IconArrowLast,\n};\n"],"mappings":"yEACA,OAASA,cAAT,KAA+B,8BAA/B,CACA,OAASC,aAAT,KAA8B,6BAA9B,CACA,OAASC,aAAT,KAA8B,6BAA9B,CACA,OAASC,cAAT,KAA+B,8BAA/B,CAEA,OAASC,KAAT,yBAWA,MAAO,IAAMC,oBAEZ,CAAG,SAACC,CAAD,QAAUA,EAAI,CAACC,KAAf,CAFG,CAGP,MAAO,IAAMC,kBAEZ,CAAG,SAACF,CAAD,QAAUA,EAAI,CAACG,GAAf,CAFG,CAGP,MAAO,IAAMC,wBAEZ,CAAG,SAACJ,CAAD,yBAAUA,CAAI,CAACK,SAAf,iBAFG,CAIP,MAAO,IAAMC,mBAAkB,CAAG,IAA3B,CACP,MAAO,IAAMC,kBAAiB,CAAG,IAA1B,CACP,MAAO,IAAMC,mBAAkB,CAAG,KAA3B,CACP,MAAO,IAAMC,iBAAgB,CAAG,SAC9BC,CAD8B,CAE9BC,CAF8B,QAG3BC,KAAI,CAACC,KAAL,CAAWD,IAAI,CAACE,GAAL,CAAS,CAAT,CAAYF,IAAI,CAACG,GAAL,CAASL,CAAW,EAAI,CAAxB,CAA2BC,CAA3B,CAAZ,CAAX,CAH2B,CAAzB,CAKP,MAAO,IAAMK,4BAA2B,CAAG,SACzCN,CADyC,CAEzCC,CAFyC,CAGzCM,CAHyC,CAIzCC,CAJyC,CAKzCC,CALyC,CAMpB,IACfC,EAAY,CAAGR,IAAI,CAACC,KAAL,CAAWD,IAAI,CAACG,GAAL,CAASE,CAAT,CAA2BN,CAA3B,CAAX,CADA,CAEfU,CAAI,CAAGZ,gBAAgB,CAACC,CAAD,CAAcC,CAAd,CAFR,CAGfW,CAA2B,CAAGV,IAAI,CAACW,IAAL,CAAUH,CAAY,CAAG,CAAzB,CAHf,CAIfI,CAAyB,CAAGJ,CAAY,CAAGE,CAJ5B,CAKfG,CAAU,CAAGb,IAAI,CAACE,GAAL,CAAS,CAAT,CAAYO,CAAI,CAAGC,CAAnB,CALE,CAOrB,MAAOxB,MAAK,CAACsB,CAAD,CAAL,CAAoBM,GAApB,CAAwB,SAACC,CAAD,CAAO,CACpC,GAAMC,EAAE,CACND,CAAC,CACDF,CADA,CAEA,CAFA,CAGAb,IAAI,CAACE,GAAL,CAAS,CAAT,CAAYO,CAAI,CAAGG,CAAP,CAAmCb,CAA/C,CAJF,CAMA,GAAoB,CAAhB,EAAAS,CAAY,EAASA,CAAY,CAAGT,CAAxC,CAAoD,CAClD,GAAIO,CAAa,EAAU,CAAN,GAAAS,CAAjB,EAAiE,CAArC,CAAAN,CAAI,CAAGC,CAAvC,CACE,MAAO,CACLnB,GAAG,CAAE,CADA,CAELF,KAAK,CAAE,GAFF,CAGLI,SAAS,GAHJ,CAAP,CAMF,GAAIa,CAAa,EAAU,CAAN,GAAAS,CAAjB,EAAiE,CAArC,CAAAN,CAAI,CAAGC,CAAvC,CACE,MAAO,CACLnB,GAAG,CAAEG,kBADA,CAELL,KAAK,CAAEO,kBAFF,CAGLH,SAAS,GAHJ,CAAP,CAMF,GACEc,CAAY,EACZQ,CAAC,GAAKP,CAAY,CAAG,CADrB,EAEAC,CAAI,CAAGG,CAAP,CAAmCb,CAHrC,CAKE,MAAO,CACLR,GAAG,CAAEQ,CADA,CAELV,KAAK,CAAEU,CAAU,CAACkB,QAAX,EAFF,CAGLxB,SAAS,GAHJ,CAAP,CAMF,GACEc,CAAY,EACZQ,CAAC,GAAKP,CAAY,CAAG,CADrB,EAEAC,CAAI,CAAGG,CAAP,CAAmCb,CAHrC,CAKE,MAAO,CACLR,GAAG,CAAEI,iBADA,CAELN,KAAK,CAAEO,kBAFF,CAGLH,SAAS,GAHJ,CAMV,CAED,MAAO,CACLF,GAAG,CAAEyB,CADA,CAEL3B,KAAK,CAAE2B,CAAE,CAACC,QAAH,EAFF,CAGLxB,SAAS,GAHJ,CAKR,CAnDM,CAoDR,CAjEM,CA4FP,MAAO,IAAMyB,qBAA0C,CAAG,SACxDC,CADwD,CAExDpB,CAFwD,CAGxDO,CAHwD,CAIxDC,CAJwD,CAKxDa,CALwD,CAMxDC,CANwD,CAOxDC,CAPwD,CAQxDC,CARwD,CASxDC,CATwD,CAUrD,QACG1B,EAAW,CAAGD,gBAAgB,CAACsB,CAAD,CAAiBpB,CAAjB,CADjC,CAGC0B,CAAC,CAAGD,CAHL,CAKCE,CAAS,GALV,CAOCC,CAAS,CAAG,CAPb,CAQCC,CAAU,CAAG,CARd,CASCC,CAAmD,CAAG,EATvD,CAWGC,CAAc,CAAG,SAACzC,CAAD,CAAgB0C,CAAhB,CAAqC,CAC1D,MACE/B,KAAI,CAACE,GAAL,CACEb,CAAK,CAAC4B,QAAN,GAAiBe,MAAjB,CAA0BT,CAA1B,CAA0CF,CAD5C,CAEEC,CAFF,GAGKS,CAAO,CAAGX,CAAH,CAAS,CAHrB,CAKH,CAlBE,CAoBQ,CAAJ,CAAAK,CAAC,EAAQI,CAAK,CAACG,MAAN,CAAejC,CApB5B,EAoBwC,IACnCkC,EAAG,CAAGP,CAAS,CAAG5B,CAAW,CAAG8B,CAAjB,CAA8B9B,CAAW,CAAG6B,CADxB,CAGnCO,CAAmB,CAAGJ,CAAc,CAACG,CAAD,GAAcJ,CAAK,CAACG,MAApB,CAHD,CAKzC,GAAuB,CAAnB,EAAAP,CAAC,CAAGS,CAAJ,EAAwBD,CAAG,EAAIlC,CAA/B,EAAoD,CAAP,EAAAkC,CAAjD,CAA2D,CACzD,GAAMjB,EAAE,CAAG,CACTzB,GAAG,CAAE0C,CADI,CAET5C,KAAK,CAAE4C,CAAG,CAAChB,QAAJ,EAFE,CAGTxB,SAAS,GAHA,CAITyC,WAAW,CAAXA,CAJS,CAAX,CAOIR,CARqD,EASvDG,CAAK,CAACM,IAAN,CAAWnB,CAAX,CATuD,CAUvDY,CAAU,EAAI,CAVyC,GAYvDC,CAAK,CAACO,OAAN,CAAcpB,CAAd,CAZuD,CAavDW,CAAS,EAAI,CAb0C,CAe1D,CACDD,CAAS,CAAG,CAACA,CArB4B,CAuBzCD,CAAC,EAAIQ,CAAG,EAAIlC,CAAP,EAA4B,CAAP,EAAAkC,CAArB,CAAgCC,CAAhC,CAA8C,CACpD,CAED,GAAI,CAAC5B,CAAa,EAAIC,CAAlB,GAAmD,CAAhB,EAAAsB,CAAK,CAACG,MAA7C,CAA0D,IAClDK,EAAe,CAAGP,CAAc,CAAC,CAAD,IADkB,CAElDQ,CAAgB,CAAGR,CAAc,CAAC,CAAD,IAFiB,CAGlDS,CAAe,CAAGT,CAAc,CAAC/B,CAAD,IAHkB,CAKpDyC,CAAc,GALsC,CAMpDC,CAAa,GANuC,CAQxD,GAAInC,CAAa,EAAqB,CAAjB,GAAAuB,CAAK,CAAC,CAAD,CAAL,CAAStC,GAA9B,KACE,GAOQmD,EAPR,CAAIC,CAAK,oBAAOd,CAAP,CADX,CAGwB,CAAf,CAAAc,CAAK,CAACX,MAHf,EAIQW,CAAK,CAAC,CAAD,CAAL,CAASpD,GAAT,GAAiBO,CAJzB,GAUI,GAFM4C,CAEN,CAFoBC,CAAK,CAACC,KAAN,CAAY,CAAZ,CAEpB,CACEF,CAAW,CACR5B,GADH,CACO,SAACE,CAAD,QAAQA,EAAE,CAACkB,WAAX,CADP,EAEGW,MAFH,CAEU,SAACC,CAAD,CAAWC,CAAX,QAA4BD,EAAQ,CAAGC,CAAvC,CAFV,EAGET,CAHF,CAIED,CAJF,EAKAb,CANF,CAOE,CACAgB,CAAc,GADd,CAEAX,CAAK,oBAAOa,CAAP,CAFL,CAGA,KACD,CAEDC,CAAK,CAAGD,CAvBZ,CA2BA,GAAInC,CAAY,EAAIsB,CAAK,CAACA,CAAK,CAACG,MAAN,CAAe,CAAhB,CAAL,CAAwBzC,GAAxB,GAAgCQ,CAApD,KACE,GAOQ2C,EAPR,CAAIC,CAAK,oBAAOd,CAAP,CADX,CAGwB,CAAf,CAAAc,CAAK,CAACX,MAHf,EAIQW,CAAK,CAACA,CAAK,CAACX,MAAN,CAAe,CAAhB,CAAL,CAAwBzC,GAAxB,GAAgCQ,CAJxC,GAUI,GAFM2C,CAEN,CAFoBC,CAAK,CAACC,KAAN,CAAY,CAAZ,CAAe,CAAC,CAAhB,CAEpB,CACEF,CAAW,CACR5B,GADH,CACO,SAACE,CAAD,QAAQA,EAAE,CAACkB,WAAX,CADP,EAEGW,MAFH,CAEU,SAACC,CAAD,CAAWC,CAAX,QAA4BD,EAAQ,CAAGC,CAAvC,CAFV,EAGER,CAHF,CAIEF,CAJF,EAKGG,CAAc,CAAGF,CAAgB,CAAGD,CAAtB,CAAwC,CALzD,GAMAb,CAPF,CAQE,CACAiB,CAAa,GADb,CAEAZ,CAAK,oBAAOa,CAAP,CAFL,CAGA,KACD,CAEDC,CAAK,CAAGD,CAxBZ,CA4BAb,CAAK,8BACCW,CAAc,CACd,CACE,CACEjD,GAAG,CAAE,CADP,CAEEF,KAAK,CAAE,GAFT,CAGEI,SAAS,GAHX,CAIEyC,WAAW,CAAEI,CAJf,CADF,CAOE,CACE/C,GAAG,CAAEG,kBADP,CAEEL,KAAK,CAAEO,kBAFT,CAGEsC,WAAW,CAAEG,CAHf,CAIE5C,SAAS,GAJX,CAPF,CADc,CAed,EAhBD,qBAiBAoC,CAjBA,qBAkBCY,CAAa,CACb,CACE,CACElD,GAAG,CAAEI,iBADP,CAEEN,KAAK,CAAEO,kBAFT,CAGEsC,WAAW,CAAEG,CAHf,CAIE5C,SAAS,GAJX,CADF,CAOE,CACEF,GAAG,CAAEQ,CADP,CAEEV,KAAK,CAAEU,CAAU,CAACkB,QAAX,EAFT,CAGExB,SAAS,GAHX,CAIEyC,WAAW,CAAEI,CAJf,CAPF,CADa,CAeb,EAjCD,EAmCN,CAED,GAAMU,EAA0B,CAAGnB,CAAK,CAACf,GAAN,CAAU,eAAGvB,EAAH,GAAGA,GAAH,CAAQF,CAAR,GAAQA,KAAR,CAAeI,CAAf,GAAeA,SAAf,OAAgC,CAC3EF,GAAG,CAAHA,CAD2E,CAE3EF,KAAK,CAALA,CAF2E,CAG3EI,SAAS,CAATA,CAH2E,CAAhC,CAAV,CAAnC,CAMA,MAAOuD,EACR,CAnKM,CAqKP,MAAO,IAAMC,cAA4B,CAAG,SAC1CnD,CAD0C,CAWvC,IATHC,EASG,wDATU,CASV,CARHS,CAQG,wCAPHF,CAOG,wCANHC,CAMG,wCALHa,CAKG,wCAJHC,CAIG,wCAHHC,CAGG,wCAFHC,CAEG,wCADHC,CACG,wCACH,MAAOhB,EAAY,CACfJ,2BAA2B,CACzBN,CADyB,CAEzBC,CAFyB,CAGzBS,CAHyB,CAIzBF,CAJyB,CAKzBC,CALyB,CADZ,CAQfW,oBAAoB,CAClBpB,CADkB,CAElBC,CAFkB,CAGlBO,CAHkB,CAIlBC,CAJkB,CAKlBa,CALkB,CAMlBC,CANkB,CAOlBC,CAPkB,CAQlBC,CARkB,CASlBC,CATkB,CAWzB,CA/BM,CAiCP,MAAO,IAAM0B,wBAGZ,CAAG,CACFC,KAAK,CAAErE,cADL,CAEFgE,QAAQ,CAAE9D,aAFR,CAGFoE,IAAI,CAAEnE,cAHJ,CAIFoE,IAAI,CAAEtE,aAJJ,CAHG"}

package/__internal__/src/components/Pagination/index.d.ts

@@ -1,2 +1 @@
 export * from './Pagination';
-export * from './PaginationBase';

package/__internal__/src/components/Pagination/index.js

@@ -1,2 +1,2 @@
-export*from"./Pagination";export*from"./PaginationBase";
+export*from"./Pagination";
 //# sourceMappingURL=index.js.map

package/__internal__/src/components/Pagination/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/Pagination/index.ts"],"sourcesContent":["export * from './Pagination';\nexport * from './PaginationBase';\n"],"mappings":"AAAA,0BACA"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/Pagination/index.ts"],"sourcesContent":["export * from './Pagination';\n"],"mappings":"AAAA"}

package/__internal__/src/components/Pagination/types.d.ts

@@ -21,7 +21,7 @@ export declare type PaginationPropOnItemClick<ITEM> = (item: ITEM, params: {
     e: React.MouseEvent;
 }) => void;
 export declare type PaginationPropOnChange<ITEM> = (value: ITEM, params: {
-    e: React.MouseEvent | React.KeyboardEvent;
+    e: React.MouseEvent | KeyboardEvent;
 }) => void;
 export declare type PaginationPropArrow = boolean | IconComponent | {
     label?: string;
@@ -42,41 +42,31 @@ declare type PaginationArrowsProps = {
     arrows?: never;
     hotKeys?: never;
 });
-declare type PaginationBaseArrowsProps = {
-    outerMostArrows?: [PaginationBasePropArrow?, PaginationBasePropArrow?];
-} & ({
-    arrows: [PaginationBasePropArrow?, PaginationBasePropArrow?];
-    hotKeys?: [PaginationPropHotKey?, PaginationPropHotKey?];
-} | {
-    arrows?: never;
-    hotKeys?: never;
-});
-declare type Props<ITEM> = {
-    form?: PaginationPropForm;
-    size?: PaginationPropSize;
-    containerEventListener?: HTMLElement | Window;
-    value?: ITEM;
-    items?: ITEM extends number ? number : ITEM[];
-    onChange?: PaginationPropOnChange<ITEM>;
+export declare type PaginationItem = {
+    key: string | number;
+    label: string;
+    clickable: boolean;
 };
 export declare type PaginationProps<TYPE extends PaginationPropType> = PropsWithHTMLAttributes<{
     type?: TYPE;
     showFirstPage?: boolean;
     showLastPage?: boolean;
     visibleCount?: number;
-} & Props<number>, HTMLDivElement> & PaginationArrowsProps & (TYPE extends 'input' ? {
+    form?: PaginationPropForm;
+    size?: PaginationPropSize;
+    containerEventListener?: HTMLElement | Window;
+    value?: number;
+    items?: number;
+    onChange?: PaginationPropOnChange<number>;
+    getItemAs?: PaginationPropGetItemAs<PaginationItem>;
+    getItemAttributes?: PaginationPropGetItemAttributes<PaginationItem>;
+    getItemRef?: PaginationPropGetItemRef<PaginationItem>;
+}, HTMLDivElement> & PaginationArrowsProps & (TYPE extends 'input' ? {
     getTotalLabel?: (pages: number) => string | number;
 } : {
     getTotalLabel?: never;
 });
 export declare type PaginationComponent = <TYPE extends PaginationPropType>(props: PaginationProps<TYPE>) => React.ReactElement | null;
-export declare type PaginationItem = {
-    key: number;
-    label: string;
-    active?: boolean;
-    clickable?: boolean;
-    page: number;
-};
 export declare type PaginationBaseItemDefault = {
     key: string | number;
     label?: string;
@@ -95,19 +85,13 @@ export declare type PaginationPropGetItemRef<ITEM> = (item: ITEM) => PaginationB
 export declare type PaginationPropGetItemOnClick<ITEM> = (item: ITEM) => PaginationBaseItemDefault['onClick'];
 declare type Mappers<ITEM = PaginationBaseItemDefault> = {
     getItemLabel?: PaginationPropGetItemLabel<ITEM>;
-    getItemKey?: PaginationPropGetItemKey<ITEM>;
+    getItemKey: PaginationPropGetItemKey<ITEM>;
     getItemAs?: PaginationPropGetItemAs<ITEM>;
     getItemAttributes?: PaginationPropGetItemAttributes<ITEM>;
     getItemRef?: PaginationPropGetItemRef<ITEM>;
     getItemClickable?: PaginationPropGetItemClickable<ITEM>;
     getItemOnClick?: PaginationPropGetItemOnClick<ITEM>;
 };
-export declare type PaginationBaseProps<ITEM = PaginationBaseItemDefault> = PropsWithHTMLAttributes<Mappers<ITEM> & Props<ITEM> & PaginationBaseArrowsProps & (ITEM extends {
-    key: PaginationBaseItemDefault['key'];
-} ? {} : {
-    getItemKey: PaginationPropGetItemKey<ITEM>;
-}), HTMLDivElement>;
-export declare type PaginationBaseComponent = <ITEM = PaginationBaseItemDefault>(props: PaginationBaseProps<ITEM>) => React.ReactElement | null;
 export declare type PaginationArrowProps = PropsWithHTMLAttributes<{
     icon?: IconComponent;
     form?: PaginationPropForm;
@@ -139,10 +123,6 @@ export declare type PaginationListProps<ITEM> = PropsWithHTMLAttributesAndRef<{
     items: ITEM[];
     value?: ITEM;
     onItemClick?: PaginationPropOnItemClick<ITEM>;
-}, HTMLDivElement> & Mappers<ITEM> & (ITEM extends {
-    label: string;
-} ? {} : {
-    getItemKey: PaginationPropGetItemKey<ITEM>;
-});
+}, HTMLDivElement> & Mappers<ITEM>;
 export declare type PaginationListComponent = <ITEM extends PaginationBaseItemDefault>(props: PaginationListProps<ITEM>) => React.ReactElement | null;
 export {};

package/__internal__/src/components/Pagination/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","names":["paginationPropForm","paginationPropFormDefault","paginationPropSize","paginationPropSizeDefault","paginationPropType","paginationPropTypeDefault"],"sources":["../../../../../src/components/Pagination/types.ts"],"sourcesContent":["import { IconComponent } from '@consta/icons/Icon';\nimport React from 'react';\n\nimport { AsAttributes, AsTags } from '##/utils/types/AsTags';\nimport { PropsWithAsAttributes } from '##/utils/types/PropsWithAsAttributes';\nimport {\n  PropsWithHTMLAttributes,\n  PropsWithHTMLAttributesAndRef,\n} from '##/utils/types/PropsWithHTMLAttributes';\n\nexport const paginationPropForm = ['default', 'brick', 'round'] as const;\nexport type PaginationPropForm = typeof paginationPropForm[number];\nexport const paginationPropFormDefault: PaginationPropForm =\n  paginationPropForm[0];\n\nexport const paginationPropSize = ['m', 'xs', 's', 'l'] as const;\nexport type PaginationPropSize = typeof paginationPropSize[number];\nexport const paginationPropSizeDefault: PaginationPropSize =\n  paginationPropSize[0];\n\nexport const paginationPropType = ['default', 'input'] as const;\nexport type PaginationPropType = typeof paginationPropType[number];\nexport const paginationPropTypeDefault: PaginationPropType =\n  paginationPropType[0];\n\nexport type PaginationArrowTypes = 'first' | 'previous' | 'next' | 'last';\n\nexport type PaginationPropHotKey = { label: string; keys: string[] };\n\nexport type PaginationPropOnItemClick<ITEM> = (\n  item: ITEM,\n  params: { e: React.MouseEvent },\n) => void;\n\nexport type PaginationPropOnChange<ITEM> = (\n  value: ITEM,\n  params: { e: React.MouseEvent | React.KeyboardEvent },\n) => void;\n\n// ARROWS\n\nexport type PaginationPropArrow =\n  | boolean\n  | IconComponent\n  | {\n      label?: string;\n      icon?: IconComponent;\n    };\n\nexport type PaginationBasePropArrow =\n  | false\n  | {\n      label?: string;\n      disabled?: boolean;\n      icon?: IconComponent;\n      onClick?: React.MouseEventHandler;\n    };\n\ntype PaginationArrowsProps = {\n  outerMostArrows?: [PaginationPropArrow?, PaginationPropArrow?];\n} & (\n  | {\n      arrows: [PaginationPropArrow?, PaginationPropArrow?];\n      hotKeys?: [PaginationPropHotKey?, PaginationPropHotKey?];\n    }\n  | {\n      arrows?: never;\n      hotKeys?: never;\n    }\n);\n\ntype PaginationBaseArrowsProps = {\n  outerMostArrows?: [PaginationBasePropArrow?, PaginationBasePropArrow?];\n} & (\n  | {\n      arrows: [PaginationBasePropArrow?, PaginationBasePropArrow?];\n      hotKeys?: [PaginationPropHotKey?, PaginationPropHotKey?];\n    }\n  | {\n      arrows?: never;\n      hotKeys?: never;\n    }\n);\n\ntype Props<ITEM> = {\n  form?: PaginationPropForm;\n  size?: PaginationPropSize;\n  containerEventListener?: HTMLElement | Window;\n  value?: ITEM;\n  items?: ITEM extends number ? number : ITEM[];\n  onChange?: PaginationPropOnChange<ITEM>;\n};\n\nexport type PaginationProps<TYPE extends PaginationPropType> =\n  PropsWithHTMLAttributes<\n    {\n      type?: TYPE;\n      showFirstPage?: boolean;\n      showLastPage?: boolean;\n      visibleCount?: number;\n    } & Props<number>,\n    HTMLDivElement\n  > &\n    PaginationArrowsProps &\n    (TYPE extends 'input'\n      ? { getTotalLabel?: (pages: number) => string | number }\n      : {\n          getTotalLabel?: never;\n        });\n\nexport type PaginationComponent = <TYPE extends PaginationPropType>(\n  props: PaginationProps<TYPE>,\n) => React.ReactElement | null;\n\nexport type PaginationItem = {\n  key: number;\n  label: string;\n  active?: boolean;\n  clickable?: boolean;\n  page: number;\n};\n\nexport type PaginationBaseItemDefault = {\n  key: string | number;\n  label?: string;\n  as?: AsTags;\n  ref?: React.RefObject<HTMLElement>;\n  clickable?: boolean;\n  attributes?: AsAttributes;\n  onClick?: React.MouseEventHandler;\n};\n\nexport type PaginationPropGetItemKey<ITEM> = (\n  item: ITEM,\n) => PaginationBaseItemDefault['key'];\nexport type PaginationPropGetItemLabel<ITEM> = (\n  item: ITEM,\n) => PaginationBaseItemDefault['label'];\nexport type PaginationPropGetItemClickable<ITEM> = (\n  item: ITEM,\n) => PaginationBaseItemDefault['clickable'];\nexport type PaginationPropGetItemAs<ITEM> = (\n  item: ITEM,\n) => PaginationBaseItemDefault['as'];\nexport type PaginationPropGetItemAttributes<ITEM> = (\n  item: ITEM,\n) => PaginationBaseItemDefault['attributes'];\nexport type PaginationPropGetItemRef<ITEM> = (\n  item: ITEM,\n) => PaginationBaseItemDefault['ref'];\nexport type PaginationPropGetItemOnClick<ITEM> = (\n  item: ITEM,\n) => PaginationBaseItemDefault['onClick'];\n\ntype Mappers<ITEM = PaginationBaseItemDefault> = {\n  getItemLabel?: PaginationPropGetItemLabel<ITEM>;\n  getItemKey?: PaginationPropGetItemKey<ITEM>;\n  getItemAs?: PaginationPropGetItemAs<ITEM>;\n  getItemAttributes?: PaginationPropGetItemAttributes<ITEM>;\n  getItemRef?: PaginationPropGetItemRef<ITEM>;\n  getItemClickable?: PaginationPropGetItemClickable<ITEM>;\n  getItemOnClick?: PaginationPropGetItemOnClick<ITEM>;\n};\n\nexport type PaginationBaseProps<ITEM = PaginationBaseItemDefault> =\n  PropsWithHTMLAttributes<\n    Mappers<ITEM> &\n      Props<ITEM> &\n      PaginationBaseArrowsProps &\n      (ITEM extends { key: PaginationBaseItemDefault['key'] }\n        ? {}\n        : {\n            getItemKey: PaginationPropGetItemKey<ITEM>;\n          }),\n    HTMLDivElement\n  >;\n\nexport type PaginationBaseComponent = <ITEM = PaginationBaseItemDefault>(\n  props: PaginationBaseProps<ITEM>,\n) => React.ReactElement | null;\n\nexport type PaginationArrowProps = PropsWithHTMLAttributes<\n  {\n    icon?: IconComponent;\n    form?: PaginationPropForm;\n    size?: PaginationPropSize;\n    disabled?: boolean;\n    orientation?: 'start' | 'end';\n    label?: string;\n    caption?: string;\n  },\n  HTMLButtonElement\n>;\n\nexport type PaginationItemProps<AS extends AsTags = 'button'> =\n  PropsWithAsAttributes<\n    {\n      form?: PaginationPropForm;\n      size?: PaginationPropSize;\n      label?: string;\n      active?: boolean;\n      clickable?: boolean;\n    },\n    AS\n  >;\n\nexport type PaginationItemComponent = <AS extends AsTags = 'button'>(\n  props: PaginationItemProps<AS>,\n) => React.ReactElement | null;\n\nexport type PaginationNumberInputProps = PropsWithHTMLAttributes<\n  {\n    value?: number;\n    onChange?: PaginationPropOnChange<number>;\n    form?: PaginationPropForm;\n    size?: PaginationPropSize;\n    total: number;\n    getTotalLabel?: (pages: number) => string | number;\n  },\n  HTMLDivElement\n>;\n\nexport type PaginationListProps<ITEM> = PropsWithHTMLAttributesAndRef<\n  {\n    form?: PaginationPropForm;\n    size?: PaginationPropSize;\n    items: ITEM[];\n    value?: ITEM;\n    onItemClick?: PaginationPropOnItemClick<ITEM>;\n  },\n  HTMLDivElement\n> &\n  Mappers<ITEM> &\n  (ITEM extends { label: string }\n    ? {}\n    : {\n        getItemKey: PaginationPropGetItemKey<ITEM>;\n      });\n\nexport type PaginationListComponent = <ITEM extends PaginationBaseItemDefault>(\n  props: PaginationListProps<ITEM>,\n) => React.ReactElement | null;\n"],"mappings":"AAUA,MAAO,IAAMA,mBAAkB,CAAG,CAAC,SAAD,CAAY,OAAZ,CAAqB,OAArB,CAA3B,CAEP,MAAO,IAAMC,0BAA6C,CACxDD,kBAAkB,CAAC,CAAD,CADb,CAGP,MAAO,IAAME,mBAAkB,CAAG,CAAC,GAAD,CAAM,IAAN,CAAY,GAAZ,CAAiB,GAAjB,CAA3B,CAEP,MAAO,IAAMC,0BAA6C,CACxDD,kBAAkB,CAAC,CAAD,CADb,CAGP,MAAO,IAAME,mBAAkB,CAAG,CAAC,SAAD,CAAY,OAAZ,CAA3B,CAEP,MAAO,IAAMC,0BAA6C,CACxDD,kBAAkB,CAAC,CAAD,CADb"}
+{"version":3,"file":"types.js","names":["paginationPropForm","paginationPropFormDefault","paginationPropSize","paginationPropSizeDefault","paginationPropType","paginationPropTypeDefault"],"sources":["../../../../../src/components/Pagination/types.ts"],"sourcesContent":["import { IconComponent } from '@consta/icons/Icon';\nimport React from 'react';\n\nimport { AsAttributes, AsTags } from '##/utils/types/AsTags';\nimport { PropsWithAsAttributes } from '##/utils/types/PropsWithAsAttributes';\nimport {\n  PropsWithHTMLAttributes,\n  PropsWithHTMLAttributesAndRef,\n} from '##/utils/types/PropsWithHTMLAttributes';\n\nexport const paginationPropForm = ['default', 'brick', 'round'] as const;\nexport type PaginationPropForm = typeof paginationPropForm[number];\nexport const paginationPropFormDefault: PaginationPropForm =\n  paginationPropForm[0];\n\nexport const paginationPropSize = ['m', 'xs', 's', 'l'] as const;\nexport type PaginationPropSize = typeof paginationPropSize[number];\nexport const paginationPropSizeDefault: PaginationPropSize =\n  paginationPropSize[0];\n\nexport const paginationPropType = ['default', 'input'] as const;\nexport type PaginationPropType = typeof paginationPropType[number];\nexport const paginationPropTypeDefault: PaginationPropType =\n  paginationPropType[0];\n\nexport type PaginationArrowTypes = 'first' | 'previous' | 'next' | 'last';\n\nexport type PaginationPropHotKey = { label: string; keys: string[] };\n\nexport type PaginationPropOnItemClick<ITEM> = (\n  item: ITEM,\n  params: { e: React.MouseEvent },\n) => void;\n\nexport type PaginationPropOnChange<ITEM> = (\n  value: ITEM,\n  params: { e: React.MouseEvent | KeyboardEvent },\n) => void;\n\n// ARROWS\n\nexport type PaginationPropArrow =\n  | boolean\n  | IconComponent\n  | {\n      label?: string;\n      icon?: IconComponent;\n    };\n\nexport type PaginationBasePropArrow =\n  | false\n  | {\n      label?: string;\n      disabled?: boolean;\n      icon?: IconComponent;\n      onClick?: React.MouseEventHandler;\n    };\n\ntype PaginationArrowsProps = {\n  outerMostArrows?: [PaginationPropArrow?, PaginationPropArrow?];\n} & (\n  | {\n      arrows: [PaginationPropArrow?, PaginationPropArrow?];\n      hotKeys?: [PaginationPropHotKey?, PaginationPropHotKey?];\n    }\n  | {\n      arrows?: never;\n      hotKeys?: never;\n    }\n);\n\nexport type PaginationItem = {\n  key: string | number;\n  label: string;\n  clickable: boolean;\n};\n\nexport type PaginationProps<TYPE extends PaginationPropType> =\n  PropsWithHTMLAttributes<\n    {\n      type?: TYPE;\n      showFirstPage?: boolean;\n      showLastPage?: boolean;\n      visibleCount?: number;\n      form?: PaginationPropForm;\n      size?: PaginationPropSize;\n      containerEventListener?: HTMLElement | Window;\n      value?: number;\n      items?: number;\n      onChange?: PaginationPropOnChange<number>;\n      getItemAs?: PaginationPropGetItemAs<PaginationItem>;\n      getItemAttributes?: PaginationPropGetItemAttributes<PaginationItem>;\n      getItemRef?: PaginationPropGetItemRef<PaginationItem>;\n    },\n    HTMLDivElement\n  > &\n    PaginationArrowsProps &\n    (TYPE extends 'input'\n      ? { getTotalLabel?: (pages: number) => string | number }\n      : {\n          getTotalLabel?: never;\n        });\n\nexport type PaginationComponent = <TYPE extends PaginationPropType>(\n  props: PaginationProps<TYPE>,\n) => React.ReactElement | null;\n\nexport type PaginationBaseItemDefault = {\n  key: string | number;\n  label?: string;\n  as?: AsTags;\n  ref?: React.RefObject<HTMLElement>;\n  clickable?: boolean;\n  attributes?: AsAttributes;\n  onClick?: React.MouseEventHandler;\n};\n\nexport type PaginationPropGetItemKey<ITEM> = (\n  item: ITEM,\n) => PaginationBaseItemDefault['key'];\nexport type PaginationPropGetItemLabel<ITEM> = (\n  item: ITEM,\n) => PaginationBaseItemDefault['label'];\nexport type PaginationPropGetItemClickable<ITEM> = (\n  item: ITEM,\n) => PaginationBaseItemDefault['clickable'];\nexport type PaginationPropGetItemAs<ITEM> = (\n  item: ITEM,\n) => PaginationBaseItemDefault['as'];\nexport type PaginationPropGetItemAttributes<ITEM> = (\n  item: ITEM,\n) => PaginationBaseItemDefault['attributes'];\nexport type PaginationPropGetItemRef<ITEM> = (\n  item: ITEM,\n) => PaginationBaseItemDefault['ref'];\nexport type PaginationPropGetItemOnClick<ITEM> = (\n  item: ITEM,\n) => PaginationBaseItemDefault['onClick'];\n\ntype Mappers<ITEM = PaginationBaseItemDefault> = {\n  getItemLabel?: PaginationPropGetItemLabel<ITEM>;\n  getItemKey: PaginationPropGetItemKey<ITEM>;\n  getItemAs?: PaginationPropGetItemAs<ITEM>;\n  getItemAttributes?: PaginationPropGetItemAttributes<ITEM>;\n  getItemRef?: PaginationPropGetItemRef<ITEM>;\n  getItemClickable?: PaginationPropGetItemClickable<ITEM>;\n  getItemOnClick?: PaginationPropGetItemOnClick<ITEM>;\n};\n\nexport type PaginationArrowProps = PropsWithHTMLAttributes<\n  {\n    icon?: IconComponent;\n    form?: PaginationPropForm;\n    size?: PaginationPropSize;\n    disabled?: boolean;\n    orientation?: 'start' | 'end';\n    label?: string;\n    caption?: string;\n  },\n  HTMLButtonElement\n>;\n\nexport type PaginationItemProps<AS extends AsTags = 'button'> =\n  PropsWithAsAttributes<\n    {\n      form?: PaginationPropForm;\n      size?: PaginationPropSize;\n      label?: string;\n      active?: boolean;\n      clickable?: boolean;\n    },\n    AS\n  >;\n\nexport type PaginationItemComponent = <AS extends AsTags = 'button'>(\n  props: PaginationItemProps<AS>,\n) => React.ReactElement | null;\n\nexport type PaginationNumberInputProps = PropsWithHTMLAttributes<\n  {\n    value?: number;\n    onChange?: PaginationPropOnChange<number>;\n    form?: PaginationPropForm;\n    size?: PaginationPropSize;\n    total: number;\n    getTotalLabel?: (pages: number) => string | number;\n  },\n  HTMLDivElement\n>;\n\nexport type PaginationListProps<ITEM> = PropsWithHTMLAttributesAndRef<\n  {\n    form?: PaginationPropForm;\n    size?: PaginationPropSize;\n    items: ITEM[];\n    value?: ITEM;\n    onItemClick?: PaginationPropOnItemClick<ITEM>;\n  },\n  HTMLDivElement\n> &\n  Mappers<ITEM>;\n\nexport type PaginationListComponent = <ITEM extends PaginationBaseItemDefault>(\n  props: PaginationListProps<ITEM>,\n) => React.ReactElement | null;\n"],"mappings":"AAUA,MAAO,IAAMA,mBAAkB,CAAG,CAAC,SAAD,CAAY,OAAZ,CAAqB,OAArB,CAA3B,CAEP,MAAO,IAAMC,0BAA6C,CACxDD,kBAAkB,CAAC,CAAD,CADb,CAGP,MAAO,IAAME,mBAAkB,CAAG,CAAC,GAAD,CAAM,IAAN,CAAY,GAAZ,CAAiB,GAAjB,CAA3B,CAEP,MAAO,IAAMC,0BAA6C,CACxDD,kBAAkB,CAAC,CAAD,CADb,CAGP,MAAO,IAAME,mBAAkB,CAAG,CAAC,SAAD,CAAY,OAAZ,CAA3B,CAEP,MAAO,IAAMC,0BAA6C,CACxDD,kBAAkB,CAAC,CAAD,CADb"}

package/__internal__/src/components/Pagination/usePaginationItems.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { PaginationItem, PaginationPropHotKey, PaginationPropSize } from './types';
+import { PaginationPropArrow, PaginationPropHotKey, PaginationPropSize, PaginationPropType } from './types';
 declare type UsePaginationItemsProps = {
     visibleCount?: number;
     value: number;
@@ -9,11 +9,12 @@ declare type UsePaginationItemsProps = {
     containerEventListener?: HTMLElement | Window;
     size: PaginationPropSize;
     hotKeys?: [PaginationPropHotKey?, PaginationPropHotKey?];
+    arrows?: [PaginationPropArrow?, PaginationPropArrow?];
+    outerMostArrows?: [PaginationPropArrow?, PaginationPropArrow?];
+    type?: PaginationPropType;
+    handleNext: (e: React.MouseEvent | KeyboardEvent) => void;
+    handlePrevious: (e: React.MouseEvent | KeyboardEvent) => void;
 };
 export declare const itemSizeMap: Record<PaginationPropSize, number>;
-export declare const usePaginationItems: (props: UsePaginationItemsProps) => {
-    buttonRefs: import("react").RefObject<HTMLButtonElement>[];
-    wrapperRef: import("react").RefObject<HTMLDivElement>;
-    pages: PaginationItem[];
-};
+export declare const usePaginationItems: (props: UsePaginationItemsProps) => readonly [import("./types").PaginationItem[], import("react").RefObject<HTMLDivElement>[], number];
 export {};

package/__internal__/src/components/Pagination/usePaginationItems.js

@@ -1,2 +1,2 @@
-import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import{useEffect,useRef,useState}from"react";import{useComponentSize}from"../../hooks/useComponentSize";import{useRefs}from"../../hooks/useRefs";import{useResizeObserved}from"../../hooks/useResizeObserved";import{getPagesArray}from"./helpers";import{usePaginationKeys}from"./usePaginationKeys";export var itemSizeMap={l:48,m:40,s:32,xs:24};var getElementSize=function(a){var b;return null!==(b=null===a||void 0===a?void 0:a.offsetWidth)&&void 0!==b?b:0};export var usePaginationItems=function(a){var b=a.visibleCount,c=a.value,d=a.items,e=a.showFirstPage,f=a.showLastPage,g=a.containerEventListener,h=a.size,i=a.hotKeys,j=useState([]),k=_slicedToArray(j,2),l=k[0],m=k[1],n=useState(7),o=_slicedToArray(n,2),p=o[0],q=o[1],r=useRef(null),s=useRefs(4),t=useResizeObserved(s,getElementSize),u=_slicedToArray(t,4),v=u[0],w=u[1],x=u[2],y=u[3];usePaginationKeys({containerEventListener:g,hotKeys:i,prevButtonRef:s[1],nextButtonRef:s[2]});var z=useComponentSize(r),A=z.width;return useEffect(function(){q(Math.max(Math.floor((A-v-w-x-y)/(itemSizeMap[h]+2)),3+(e?2:0)+(f?2:0)))},[l,v,w,x,y,A,h]),useEffect(function(){m(getPagesArray({currentPage:c,totalPages:d,visibleCount:null!==b&&void 0!==b?b:p,showFirstPage:e,showLastPage:f}))},[b,e,f,c,d,p]),{buttonRefs:s,wrapperRef:r,pages:l}};
+import{useMemo}from"react";import{useRefs}from"../../hooks/useRefs";import{useResizeObserved}from"../../hooks/useResizeObserved";import{getPagesArray}from"./helpers";import{usePaginationKeys}from"./usePaginationKeys";export var itemSizeMap={l:48,m:40,s:32,xs:24};var getElementWidth=function(a){var b;return null!==(b=null===a||void 0===a?void 0:a.getBoundingClientRect().width)&&void 0!==b?b:0},hashArrows=function(a){return(null===a||void 0===a?void 0:a.map(Boolean).join("-"))||"false-false"};export var usePaginationItems=function(a){var b=a.visibleCount,c=a.value,d=a.items,e=a.showFirstPage,f=a.showLastPage,g=a.containerEventListener,h=a.hotKeys,i=a.outerMostArrows,j=a.type,k=a.arrows,l=a.handleNext,m=a.handlePrevious,n=useRefs(20,[d,j,hashArrows(i),hashArrows(k)]),o=useResizeObserved(n,getElementWidth),p=o[7]-o[5]-o[6],q=o[18]-o[19],r=o[5],s=Math.max(o[8],o[9],o[10],o[11],o[12],o[13],o[14],o[15],o[16],o[17]),t=o[4]-(o[0]?o[0]+p:0)-(o[1]?o[1]+p:0)-(o[2]?o[2]+p:0)-(o[3]?o[3]+p:0),u=useMemo(function(){return"default"===j&&r?getPagesArray(c,d,b||0,e||!1,f||!1,p,q,r,s,t):[]},[j,c,d,b,e,f,p,q,r,s,t]);return usePaginationKeys({containerEventListener:g,hotKeys:h,handleNext:l,handlePrevious:m}),[u,n,s]};
 //# sourceMappingURL=usePaginationItems.js.map

package/__internal__/src/components/Pagination/usePaginationItems.js.map

@@ -1 +1 @@
-{"version":3,"file":"usePaginationItems.js","names":["useEffect","useRef","useState","useComponentSize","useRefs","useResizeObserved","getPagesArray","usePaginationKeys","itemSizeMap","l","m","s","xs","getElementSize","el","offsetWidth","usePaginationItems","props","visibleCount","value","items","showFirstPage","showLastPage","containerEventListener","size","hotKeys","pages","setPages","maxVisiblePages","setMaxVisiblePages","wrapperRef","refs","firstWidth","prevWidth","nextWidth","lastWidth","prevButtonRef","nextButtonRef","width","Math","max","floor","currentPage","totalPages","buttonRefs"],"sources":["../../../../../src/components/Pagination/usePaginationItems.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\n\nimport { useComponentSize } from '##/hooks/useComponentSize';\nimport { useRefs } from '##/hooks/useRefs';\nimport { useResizeObserved } from '##/hooks/useResizeObserved';\n\nimport { getPagesArray } from './helpers';\nimport {\n  PaginationItem,\n  PaginationPropHotKey,\n  PaginationPropSize,\n} from './types';\nimport { usePaginationKeys } from './usePaginationKeys';\n\ntype UsePaginationItemsProps = {\n  visibleCount?: number;\n  value: number;\n  items: number;\n  showFirstPage?: boolean;\n  showLastPage?: boolean;\n  containerEventListener?: HTMLElement | Window;\n  size: PaginationPropSize;\n  hotKeys?: [PaginationPropHotKey?, PaginationPropHotKey?];\n};\n\nexport const itemSizeMap: Record<PaginationPropSize, number> = {\n  l: 48,\n  m: 40,\n  s: 32,\n  xs: 24,\n};\n\nconst getElementSize = (el: HTMLElement | null) => el?.offsetWidth ?? 0;\n\nexport const usePaginationItems = (props: UsePaginationItemsProps) => {\n  const {\n    visibleCount,\n    value,\n    items,\n    showFirstPage,\n    showLastPage,\n    containerEventListener,\n    size,\n    hotKeys,\n  } = props;\n  const [pages, setPages] = useState<PaginationItem[]>([]);\n  const [maxVisiblePages, setMaxVisiblePages] = useState(7);\n\n  const wrapperRef = useRef<HTMLDivElement>(null);\n  const refs = useRefs<HTMLButtonElement>(4);\n\n  const [firstWidth, prevWidth, nextWidth, lastWidth] = useResizeObserved(\n    refs,\n    getElementSize,\n  );\n\n  usePaginationKeys({\n    containerEventListener,\n    hotKeys,\n    prevButtonRef: refs[1],\n    nextButtonRef: refs[2],\n  });\n\n  const { width } = useComponentSize(wrapperRef);\n\n  useEffect(() => {\n    setMaxVisiblePages(\n      Math.max(\n        Math.floor(\n          (width - firstWidth - prevWidth - nextWidth - lastWidth) /\n            (itemSizeMap[size] + 2),\n        ),\n        3 + (showFirstPage ? 2 : 0) + (showLastPage ? 2 : 0),\n      ),\n    );\n  }, [pages, firstWidth, prevWidth, nextWidth, lastWidth, width, size]);\n\n  useEffect(() => {\n    setPages(\n      getPagesArray({\n        currentPage: value,\n        totalPages: items,\n        visibleCount: visibleCount ?? maxVisiblePages,\n        showFirstPage,\n        showLastPage,\n      }),\n    );\n  }, [\n    visibleCount,\n    showFirstPage,\n    showLastPage,\n    value,\n    items,\n    maxVisiblePages,\n  ]);\n\n  return {\n    buttonRefs: refs,\n    wrapperRef,\n    pages,\n  };\n};\n"],"mappings":"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"}
+{"version":3,"file":"usePaginationItems.js","names":["useMemo","useRefs","useResizeObserved","getPagesArray","usePaginationKeys","itemSizeMap","l","m","s","xs","getElementWidth","el","getBoundingClientRect","width","hashArrows","arrows","map","Boolean","join","usePaginationItems","props","visibleCount","value","items","showFirstPage","showLastPage","containerEventListener","hotKeys","outerMostArrows","type","handleNext","handlePrevious","refs","gap","buttonPadding","buttonMinWidth","maxSymbolSize","Math","max","totalWidth","pages"],"sources":["../../../../../src/components/Pagination/usePaginationItems.tsx"],"sourcesContent":["import { useMemo } from 'react';\n\nimport { useRefs } from '##/hooks/useRefs';\nimport { useResizeObserved } from '##/hooks/useResizeObserved';\n\nimport { getPagesArray } from './helpers';\nimport {\n  PaginationPropArrow,\n  PaginationPropHotKey,\n  PaginationPropSize,\n  PaginationPropType,\n} from './types';\nimport { usePaginationKeys } from './usePaginationKeys';\n\ntype UsePaginationItemsProps = {\n  visibleCount?: number;\n  value: number;\n  items: number;\n  showFirstPage?: boolean;\n  showLastPage?: boolean;\n  containerEventListener?: HTMLElement | Window;\n  size: PaginationPropSize;\n  hotKeys?: [PaginationPropHotKey?, PaginationPropHotKey?];\n  arrows?: [PaginationPropArrow?, PaginationPropArrow?];\n  outerMostArrows?: [PaginationPropArrow?, PaginationPropArrow?];\n  type?: PaginationPropType;\n  handleNext: (e: React.MouseEvent | KeyboardEvent) => void;\n  handlePrevious: (e: React.MouseEvent | KeyboardEvent) => void;\n};\n\nexport const itemSizeMap: Record<PaginationPropSize, number> = {\n  l: 48,\n  m: 40,\n  s: 32,\n  xs: 24,\n};\n\nconst getElementWidth = (el: HTMLElement | null) =>\n  el?.getBoundingClientRect().width ?? 0;\n\nconst hashArrows = (\n  arrows: [PaginationPropArrow?, PaginationPropArrow?] | undefined,\n) => arrows?.map(Boolean).join('-') || 'false-false';\n\nexport const usePaginationItems = (props: UsePaginationItemsProps) => {\n  const {\n    visibleCount,\n    value,\n    items,\n    showFirstPage,\n    showLastPage,\n    containerEventListener,\n    hotKeys,\n    outerMostArrows,\n    type,\n    arrows,\n    handleNext,\n    handlePrevious,\n  } = props;\n\n  const refs = useRefs<HTMLDivElement>(20, [\n    items,\n    type,\n    hashArrows(outerMostArrows),\n    hashArrows(arrows),\n  ]);\n\n  const width = useResizeObserved(refs, getElementWidth);\n\n  // расстояние между кнопками\n  const gap = width[7] - width[5] - width[6];\n  // внутренний отступ кнопки\n  const buttonPadding = width[18] - width[19];\n  // минимальная ширина кнопки\n  const buttonMinWidth = width[5];\n  // Максималяная ширина символа\n  const maxSymbolSize = Math.max(\n    width[8],\n    width[9],\n    width[10],\n    width[11],\n    width[12],\n    width[13],\n    width[14],\n    width[15],\n    width[16],\n    width[17],\n  );\n  // разрешенная ширина\n  const totalWidth =\n    width[4] -\n    (width[0] ? width[0] + gap : 0) -\n    (width[1] ? width[1] + gap : 0) -\n    (width[2] ? width[2] + gap : 0) -\n    (width[3] ? width[3] + gap : 0);\n\n  const pages = useMemo(\n    () =>\n      type === 'default' && buttonMinWidth\n        ? getPagesArray(\n            value,\n            items,\n            visibleCount || 0,\n            showFirstPage || false,\n            showLastPage || false,\n            gap,\n            buttonPadding,\n            buttonMinWidth,\n            maxSymbolSize,\n            totalWidth,\n          )\n        : [],\n    [\n      type,\n      value,\n      items,\n      visibleCount,\n      showFirstPage,\n      showLastPage,\n      gap,\n      buttonPadding,\n      buttonMinWidth,\n      maxSymbolSize,\n      totalWidth,\n    ],\n  );\n\n  usePaginationKeys({\n    containerEventListener,\n    hotKeys,\n    handleNext,\n    handlePrevious,\n  });\n\n  return [pages, refs, maxSymbolSize] as const;\n};\n"],"mappings":"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"}

package/__internal__/src/components/Pagination/usePaginationKeys.d.ts

@@ -3,8 +3,8 @@ import { PaginationPropHotKey } from './types';
 declare type UsePaginationKeysParams = {
     containerEventListener?: HTMLElement | Window;
     hotKeys?: [PaginationPropHotKey?, PaginationPropHotKey?];
-    nextButtonRef?: React.RefObject<HTMLElement>;
-    prevButtonRef?: React.RefObject<HTMLElement>;
+    handleNext: (e: React.MouseEvent | KeyboardEvent) => void;
+    handlePrevious: (e: React.MouseEvent | KeyboardEvent) => void;
 };
 export declare const usePaginationKeys: (params: UsePaginationKeysParams) => void;
 export {};

package/__internal__/src/components/Pagination/usePaginationKeys.js

@@ -1,2 +1,2 @@
-import _toConsumableArray from"@babel/runtime/helpers/toConsumableArray";import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import{useCallback,useEffect,useLayoutEffect,useRef}from"react";export var usePaginationKeys=function(a){var b=a.containerEventListener,c=void 0===b?window:b,d=a.hotKeys,e=a.nextButtonRef,f=a.prevButtonRef,g=useRef([]),h=useRef(null!==d&&void 0!==d?d:[]),i=function(a){var b=a.key;g.current=g.current.filter(function(a){return a!==b})},j=useCallback(function(a){var b=a.key,c=_slicedToArray(h.current,2),d=c[0],i=c[1];if(null!==d&&void 0!==d&&d.keys.includes(b)||null!==i&&void 0!==i&&i.keys.includes(b)){var l=[].concat(_toConsumableArray(g.current),[b]);if(null!==i&&void 0!==i&&i.keys.every(function(a){return l.includes(a)})){var j;null===e||void 0===e||null===(j=e.current)||void 0===j?void 0:j.click()}else if(null!==d&&void 0!==d&&d.keys.every(function(a){return l.includes(a)})){var k;null===f||void 0===f||null===(k=f.current)||void 0===k?void 0:k.click()}g.current=l}},[d]);useLayoutEffect(function(){return c.addEventListener("keydown",j),c.addEventListener("keyup",i),function(){c.removeEventListener("keydown",j),c.removeEventListener("keyup",i)}},[e,f,c]),useEffect(function(){d&&(h.current=d)},[d])};
+import _toConsumableArray from"@babel/runtime/helpers/toConsumableArray";import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import{useCallback,useLayoutEffect,useRef}from"react";import{useMutableRef}from"../../hooks/useMutableRef";export var usePaginationKeys=function(a){var b=a.containerEventListener,c=void 0===b?window:b,d=a.hotKeys,e=a.handleNext,f=a.handlePrevious,g=useRef([]),h=useMutableRef([d||[],e,f]),i=useCallback(function(a){var b=a.key;g.current=g.current.filter(function(a){return a!==b})},[]),j=useCallback(function(a){var b=a.key,c=_slicedToArray(h.current[0],2),d=c[0],e=c[1];if(null!==d&&void 0!==d&&d.keys.includes(b)||null!==e&&void 0!==e&&e.keys.includes(b)){var f=[].concat(_toConsumableArray(g.current),[b]);null!==e&&void 0!==e&&e.keys.every(function(a){return f.includes(a)})?h.current[1](a):null!==d&&void 0!==d&&d.keys.every(function(a){return f.includes(a)})&&h.current[2](a),g.current=f}},[]);useLayoutEffect(function(){return c.addEventListener("keydown",j),c.addEventListener("keyup",i),function(){c.removeEventListener("keydown",j),c.removeEventListener("keyup",i)}},[c])};
 //# sourceMappingURL=usePaginationKeys.js.map

package/__internal__/src/components/Pagination/usePaginationKeys.js.map

@@ -1 +1 @@
-{"version":3,"file":"usePaginationKeys.js","names":["useCallback","useEffect","useLayoutEffect","useRef","usePaginationKeys","params","containerEventListener","window","hotKeys","nextButtonRef","prevButtonRef","keys","hotKeysRef","keyUpListener","event","key","current","filter","hotKey","keyDownListener","start","end","includes","newKeys","every","click","addEventListener","removeEventListener"],"sources":["../../../../../src/components/Pagination/usePaginationKeys.tsx"],"sourcesContent":["import { useCallback, useEffect, useLayoutEffect, useRef } from 'react';\n\nimport { PaginationPropHotKey } from './types';\n\ntype UsePaginationKeysParams = {\n  containerEventListener?: HTMLElement | Window;\n  hotKeys?: [PaginationPropHotKey?, PaginationPropHotKey?];\n  nextButtonRef?: React.RefObject<HTMLElement>;\n  prevButtonRef?: React.RefObject<HTMLElement>;\n};\n\nexport const usePaginationKeys = (params: UsePaginationKeysParams) => {\n  const {\n    containerEventListener = window,\n    hotKeys,\n    nextButtonRef,\n    prevButtonRef,\n  } = params;\n  const keys: React.MutableRefObject<string[]> = useRef([]);\n  const hotKeysRef = useRef(hotKeys ?? []);\n\n  const keyUpListener: EventListener = (event) => {\n    const { key } = event as KeyboardEvent;\n    keys.current = keys.current.filter((hotKey) => hotKey !== key);\n  };\n\n  const keyDownListener: EventListener = useCallback(\n    (event) => {\n      const { key } = event as KeyboardEvent;\n\n      const [start, end] = hotKeysRef.current;\n\n      if (start?.keys.includes(key) || end?.keys.includes(key)) {\n        const newKeys = [...keys.current, key];\n        if (end?.keys.every((hotKey) => newKeys.includes(hotKey))) {\n          nextButtonRef?.current?.click();\n        } else if (start?.keys.every((hotKey) => newKeys.includes(hotKey))) {\n          prevButtonRef?.current?.click();\n        }\n        keys.current = newKeys;\n      }\n    },\n    [hotKeys],\n  );\n\n  useLayoutEffect(() => {\n    containerEventListener.addEventListener('keydown', keyDownListener);\n    containerEventListener.addEventListener('keyup', keyUpListener);\n    return () => {\n      containerEventListener.removeEventListener('keydown', keyDownListener);\n      containerEventListener.removeEventListener('keyup', keyUpListener);\n    };\n  }, [nextButtonRef, prevButtonRef, containerEventListener]);\n\n  useEffect(() => {\n    if (hotKeys) {\n      hotKeysRef.current = hotKeys;\n    }\n  }, [hotKeys]);\n};\n"],"mappings":"0IAAA,OAASA,WAAT,CAAsBC,SAAtB,CAAiCC,eAAjC,CAAkDC,MAAlD,KAAgE,OAAhE,CAWA,MAAO,IAAMC,kBAAiB,CAAG,SAACC,CAAD,CAAqC,OAMhEA,CANgE,CAElEC,sBAFkE,CAElEA,CAFkE,YAEzCC,MAFyC,GAGlEC,CAHkE,CAMhEH,CANgE,CAGlEG,OAHkE,CAIlEC,CAJkE,CAMhEJ,CANgE,CAIlEI,aAJkE,CAKlEC,CALkE,CAMhEL,CANgE,CAKlEK,aALkE,CAO9DC,CAAsC,CAAGR,MAAM,CAAC,EAAD,CAPe,CAQ9DS,CAAU,CAAGT,MAAM,QAACK,CAAD,WAACA,CAAD,CAACA,CAAD,CAAY,EAAZ,CAR2C,CAU9DK,CAA4B,CAAG,SAACC,CAAD,CAAW,CAC9C,GAAQC,EAAR,CAAgBD,CAAhB,CAAQC,GAAR,CACAJ,CAAI,CAACK,OAAL,CAAeL,CAAI,CAACK,OAAL,CAAaC,MAAb,CAAoB,SAACC,CAAD,QAAYA,EAAM,GAAKH,CAAvB,CAApB,CAChB,CAbmE,CAe9DI,CAA8B,CAAGnB,WAAW,CAChD,SAACc,CAAD,CAAW,IACDC,EADC,CACOD,CADP,CACDC,GADC,kBAGYH,CAAU,CAACI,OAHvB,IAGFI,CAHE,MAGKC,CAHL,MAKT,GAAI,OAAAD,CAAK,WAALA,CAAA,EAAAA,CAAK,CAAET,IAAP,CAAYW,QAAZ,CAAqBP,CAArB,UAA6BM,CAA7B,WAA6BA,CAA7B,EAA6BA,CAAG,CAAEV,IAAL,CAAUW,QAAV,CAAmBP,CAAnB,CAAjC,CAA0D,CACxD,GAAMQ,EAAO,8BAAOZ,CAAI,CAACK,OAAZ,GAAqBD,CAArB,EAAb,CACA,UAAIM,CAAJ,WAAIA,CAAJ,EAAIA,CAAG,CAAEV,IAAL,CAAUa,KAAV,CAAgB,SAACN,CAAD,QAAYK,EAAO,CAACD,QAAR,CAAiBJ,CAAjB,CAAZ,CAAhB,CAAJ,CAA2D,cACzDT,CADyD,WACzDA,CADyD,YACzDA,CAAa,CAAEO,OAD0C,qBACzD,EAAwBS,KAAxB,EACD,CAFD,IAEO,WAAIL,CAAJ,WAAIA,CAAJ,EAAIA,CAAK,CAAET,IAAP,CAAYa,KAAZ,CAAkB,SAACN,CAAD,QAAYK,EAAO,CAACD,QAAR,CAAiBJ,CAAjB,CAAZ,CAAlB,CAAJ,CAA6D,cAClER,CADkE,WAClEA,CADkE,YAClEA,CAAa,CAAEM,OADmD,qBAClE,EAAwBS,KAAxB,EACD,CACDd,CAAI,CAACK,OAAL,CAAeO,CAChB,CACF,CAf+C,CAgBhD,CAACf,CAAD,CAhBgD,CAfkB,CAkCpEN,eAAe,CAAC,UAAM,CAGpB,MAFAI,EAAsB,CAACoB,gBAAvB,CAAwC,SAAxC,CAAmDP,CAAnD,CAEA,CADAb,CAAsB,CAACoB,gBAAvB,CAAwC,OAAxC,CAAiDb,CAAjD,CACA,CAAO,UAAM,CACXP,CAAsB,CAACqB,mBAAvB,CAA2C,SAA3C,CAAsDR,CAAtD,CADW,CAEXb,CAAsB,CAACqB,mBAAvB,CAA2C,OAA3C,CAAoDd,CAApD,CACD,CACF,CAPc,CAOZ,CAACJ,CAAD,CAAgBC,CAAhB,CAA+BJ,CAA/B,CAPY,CAlCqD,CA2CpEL,SAAS,CAAC,UAAM,CACVO,CADU,GAEZI,CAAU,CAACI,OAAX,CAAqBR,CAFT,CAIf,CAJQ,CAIN,CAACA,CAAD,CAJM,CAKV,CAhDM"}
+{"version":3,"file":"usePaginationKeys.js","names":["useCallback","useLayoutEffect","useRef","useMutableRef","usePaginationKeys","params","containerEventListener","window","hotKeys","handleNext","handlePrevious","keys","mutableRefs","keyUpListener","event","key","current","filter","hotKey","keyDownListener","start","end","includes","newKeys","every","addEventListener","removeEventListener"],"sources":["../../../../../src/components/Pagination/usePaginationKeys.tsx"],"sourcesContent":["import { useCallback, useLayoutEffect, useRef } from 'react';\n\nimport { useMutableRef } from '##/hooks/useMutableRef';\n\nimport { PaginationPropHotKey } from './types';\n\ntype UsePaginationKeysParams = {\n  containerEventListener?: HTMLElement | Window;\n  hotKeys?: [PaginationPropHotKey?, PaginationPropHotKey?];\n  handleNext: (e: React.MouseEvent | KeyboardEvent) => void;\n  handlePrevious: (e: React.MouseEvent | KeyboardEvent) => void;\n};\n\nexport const usePaginationKeys = (params: UsePaginationKeysParams) => {\n  const {\n    containerEventListener = window,\n    hotKeys,\n    handleNext,\n    handlePrevious,\n  } = params;\n  const keys: React.MutableRefObject<string[]> = useRef([]);\n  const mutableRefs = useMutableRef([\n    hotKeys || [],\n    handleNext,\n    handlePrevious,\n  ] as const);\n\n  const keyUpListener: EventListener = useCallback((event) => {\n    const { key } = event as KeyboardEvent;\n    keys.current = keys.current.filter((hotKey) => hotKey !== key);\n  }, []);\n\n  const keyDownListener = useCallback((event: KeyboardEvent) => {\n    const { key } = event;\n    const [start, end] = mutableRefs.current[0];\n\n    if (start?.keys.includes(key) || end?.keys.includes(key)) {\n      const newKeys = [...keys.current, key];\n      if (end?.keys.every((hotKey) => newKeys.includes(hotKey))) {\n        mutableRefs.current[1](event);\n      } else if (start?.keys.every((hotKey) => newKeys.includes(hotKey))) {\n        mutableRefs.current[2](event);\n      }\n      keys.current = newKeys;\n    }\n  }, []);\n\n  useLayoutEffect(() => {\n    containerEventListener.addEventListener(\n      'keydown',\n      keyDownListener as EventListener,\n    );\n    containerEventListener.addEventListener('keyup', keyUpListener);\n    return () => {\n      containerEventListener.removeEventListener(\n        'keydown',\n        keyDownListener as EventListener,\n      );\n      containerEventListener.removeEventListener('keyup', keyUpListener);\n    };\n  }, [containerEventListener]);\n};\n"],"mappings":"0IAAA,OAASA,WAAT,CAAsBC,eAAtB,CAAuCC,MAAvC,KAAqD,OAArD,CAEA,OAASC,aAAT,iCAWA,MAAO,IAAMC,kBAAiB,CAAG,SAACC,CAAD,CAAqC,OAMhEA,CANgE,CAElEC,sBAFkE,CAElEA,CAFkE,YAEzCC,MAFyC,GAGlEC,CAHkE,CAMhEH,CANgE,CAGlEG,OAHkE,CAIlEC,CAJkE,CAMhEJ,CANgE,CAIlEI,UAJkE,CAKlEC,CALkE,CAMhEL,CANgE,CAKlEK,cALkE,CAO9DC,CAAsC,CAAGT,MAAM,CAAC,EAAD,CAPe,CAQ9DU,CAAW,CAAGT,aAAa,CAAC,CAChCK,CAAO,EAAI,EADqB,CAEhCC,CAFgC,CAGhCC,CAHgC,CAAD,CARmC,CAc9DG,CAA4B,CAAGb,WAAW,CAAC,SAACc,CAAD,CAAW,CAC1D,GAAQC,EAAR,CAAgBD,CAAhB,CAAQC,GAAR,CACAJ,CAAI,CAACK,OAAL,CAAeL,CAAI,CAACK,OAAL,CAAaC,MAAb,CAAoB,SAACC,CAAD,QAAYA,EAAM,GAAKH,CAAvB,CAApB,CAChB,CAH+C,CAG7C,EAH6C,CAdoB,CAmB9DI,CAAe,CAAGnB,WAAW,CAAC,SAACc,CAAD,CAA0B,IACpDC,EADoD,CAC5CD,CAD4C,CACpDC,GADoD,kBAEvCH,CAAW,CAACI,OAAZ,CAAoB,CAApB,CAFuC,IAErDI,CAFqD,MAE9CC,CAF8C,MAI5D,GAAI,OAAAD,CAAK,WAALA,CAAA,EAAAA,CAAK,CAAET,IAAP,CAAYW,QAAZ,CAAqBP,CAArB,UAA6BM,CAA7B,WAA6BA,CAA7B,EAA6BA,CAAG,CAAEV,IAAL,CAAUW,QAAV,CAAmBP,CAAnB,CAAjC,CAA0D,CACxD,GAAMQ,EAAO,8BAAOZ,CAAI,CAACK,OAAZ,GAAqBD,CAArB,EAAb,CADwD,OAEpDM,CAFoD,WAEpDA,CAFoD,EAEpDA,CAAG,CAAEV,IAAL,CAAUa,KAAV,CAAgB,SAACN,CAAD,QAAYK,EAAO,CAACD,QAAR,CAAiBJ,CAAjB,CAAZ,CAAhB,CAFoD,CAGtDN,CAAW,CAACI,OAAZ,CAAoB,CAApB,EAAuBF,CAAvB,CAHsD,QAI7CM,CAJ6C,WAI7CA,CAJ6C,EAI7CA,CAAK,CAAET,IAAP,CAAYa,KAAZ,CAAkB,SAACN,CAAD,QAAYK,EAAO,CAACD,QAAR,CAAiBJ,CAAjB,CAAZ,CAAlB,CAJ6C,EAKtDN,CAAW,CAACI,OAAZ,CAAoB,CAApB,EAAuBF,CAAvB,CALsD,CAOxDH,CAAI,CAACK,OAAL,CAAeO,CAChB,CACF,CAbkC,CAahC,EAbgC,CAnBiC,CAkCpEtB,eAAe,CAAC,UAAM,CAMpB,MALAK,EAAsB,CAACmB,gBAAvB,CACE,SADF,CAEEN,CAFF,CAKA,CADAb,CAAsB,CAACmB,gBAAvB,CAAwC,OAAxC,CAAiDZ,CAAjD,CACA,CAAO,UAAM,CACXP,CAAsB,CAACoB,mBAAvB,CACE,SADF,CAEEP,CAFF,CADW,CAKXb,CAAsB,CAACoB,mBAAvB,CAA2C,OAA3C,CAAoDb,CAApD,CACD,CACF,CAbc,CAaZ,CAACP,CAAD,CAbY,CAchB,CAhDM"}

package/__internal__/src/components/ProgressStepBar/ProgressStepBar.js

@@ -1,2 +1,2 @@
-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(l||0),y=_slicedToArray(x,2),z=y[0],A=y[1],B=useState([]),C=_slicedToArray(B,2),D=C[0],E=C[1],F=useRef(null),G=useComponentSize(c),H=G.width,I=G.height,J=useScrollElements(f),K=J.refs,L=J.scrollTo,M=useMemo(function(){return Array(f.length).fill(null).map(function(){return createRef()})},[f.length]);useLayoutEffect(function(){var a=[],b=calculateLines(K,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})}),E(a)},[l,f,h,j,H,I]),useEffect(function(){A(l||0)},[l]),useEffect(function(){L(z)},[z]);var N=function(a){a&&0!==z&&A(z-1),a||z===f.length-1||A(z+1)},O=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 l&&l>=b?r(a)||"normal":"system",tooltipContent:s(a),size:j,position:getItemPosition(b,f.length),pointRef:M[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}},P=useOverflow({currentRef:F});return React.createElement("div",Object.assign({},w,{style:v,className:cnProgressStepBar({isOverflow:P},[k,cnMixScrollBar()]),ref:useForkRef([b,c])}),P&&"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 N(!0)}}),React.createElement("div",{ref:F,className:cnProgressStepBar("List",{direction:h,overflow:P})},React.createElement(ProgressStepBarLine,{lines:D,size:j,direction:h,activeStepIndex:l}),f.map(function(a,b){return React.createElement(ProgressStepBarItem,Object.assign({ref:K[b]},O(a,b)))})),P&&"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 N(!1)}}))}export var ProgressStepBar=forwardRef(ProgressStepBarRender);
+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(l||0),y=_slicedToArray(x,2),z=y[0],A=y[1],B=useState([]),C=_slicedToArray(B,2),D=C[0],E=C[1],F=useRef(null),G=useComponentSize(c),H=G.width,I=G.height,J=useScrollElements(f),K=J.refs,L=J.scrollTo,M=useMemo(function(){return Array(f.length).fill(null).map(function(){return createRef()})},[f.length]),N=useOverflow({currentRef:F});useLayoutEffect(function(){var a=[],b=calculateLines(K,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})}),E(a)},[l,f,h,j,H,I,N]),useEffect(function(){A(l||0)},[l]),useEffect(function(){L(z)},[z]);var O=function(a){a&&0!==z&&A(z-1),a||z===f.length-1||A(z+1)},P=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 l&&l>=b?r(a)||"normal":"system",tooltipContent:s(a),size:j,position:getItemPosition(b,f.length),pointRef:M[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:N},[k,cnMixScrollBar()]),ref:useForkRef([b,c])}),N&&"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 O(!0)}}),React.createElement("div",{ref:F,className:cnProgressStepBar("List",{direction:h,overflow:N})},React.createElement(ProgressStepBarLine,{lines:D,size:j,direction:h,activeStepIndex:l}),f.map(function(a,b){return React.createElement(ProgressStepBarItem,Object.assign({ref:K[b]},P(a,b)))})),N&&"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 O(!1)}}))}export var ProgressStepBar=forwardRef(ProgressStepBarRender);
 //# sourceMappingURL=ProgressStepBar.js.map

package/__internal__/src/components/ProgressStepBar/ProgressStepBar.js.map

@@ -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","linesArray","sizes","forEach","step","index","push","status","changePosition","prev","getStepItem","item","onClick","onItemClickHandler","e","content","label","point","progress","tooltipContent","position","pointRef","key","tooltipZIndex","zIndex","isOverflow","currentRef","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\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]);\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  const isOverflow = useOverflow({ currentRef: listRef });\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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"}
+{"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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"}

package/__internal__/src/components/SelectComponents/Select.css

@@ -1 +1 @@
-.Select{--caption-margin-left:calc(var(--input-space) + var(--control-border-width));--clear-button-color:var(--color-control-typo-clear);align-items:flex-start;display:flex;justify-content:flex-start;position:relative;width:100%}.Select_type_userselect.Select_size_s{--select-element-height:var(--space-xl)}.Select_type_userselect.Select_size_m{--select-element-height:calc(var(--space-2xl) - var(--space-3xs))}.Select_type_userselect.Select_size_l{--select-element-height:calc(var(--space-3xl) - var(--space-2xs))}.Select_type_combobox.Select_size_xs{--select-element-height:calc(var(--space-m) + var(--space-3xs))}.Select_type_combobox.Select_size_s{--select-element-height:var(--space-xl)}.Select_type_combobox.Select_size_m{--select-element-height:calc(var(--space-2xl) - var(--space-2xs))}.Select_type_combobox.Select_size_l{--select-element-height:var(--space-2xl)}.Select_type_select.Select_size_xs{--select-element-height:calc(var(--space-m) + var(--space-3xs))}.Select_type_select.Select_size_s{--select-element-height:var(--space-xl)}.Select_type_select.Select_size_m{--select-element-height:calc(var(--space-2xl) - var(--space-2xs))}.Select_type_select.Select_size_l{--select-element-height:var(--space-2xl)}.Select_size_xs{--label-offset:var(--space-2xs);--caption-offset:var(--space-2xs);--round-offset:calc(var(--space-3xs) + var(--space-2xs));--input-height:var(--control-height-xs);--input-space:calc(var(--control-space-xs)*0.5);--input-font-size:var(--control-text-size-xs);--tag-space:calc((var(--space-xs) - 1px)/2 - var(--control-border-width));--input-max-height:calc(var(--tag-space)*4 + var(--select-element-height)*4.5)}.Select_size_s{--label-offset:var(--space-2xs);--caption-offset:var(--space-2xs);--round-offset:calc(var(--space-2xs));--input-height:var(--control-height-s);--input-space:calc(var(--control-space-s)*0.5);--input-font-size:var(--control-text-size-s);--tag-space:calc(var(--space-xs)/2 - var(--control-border-width));--input-max-height:calc(var(--tag-space)*4 + var(--select-element-height)*4.5)}.Select_size_m{--label-offset:var(--space-xs);--caption-offset:var(--space-xs);--round-offset:calc(var(--space-3xs) + var(--space-2xs));--input-height:var(--control-height-m);--input-space:calc(var(--control-space-m)*0.5);--input-font-size:var(--control-text-size-m);--tag-space:calc(var(--space-s)/2 - var(--control-border-width));--input-max-height:calc(var(--tag-space)*4 + var(--space-2xl)*4.5 - var(--space-2xs)*4.5)}.Select_size_l{--label-offset:var(--space-xs);--caption-offset:var(--space-xs);--round-offset:calc(var(--space-xs));--input-height:var(--control-height-l);--input-space:calc(var(--control-space-l)*0.5);--input-font-size:var(--control-text-size-l);--tag-space:calc(var(--space-m)/2 - var(--control-border-width));--input-max-height:calc(var(--tag-space)*4 + var(--space-2xl)*4.5)}.Select_labelPosition_top{flex-direction:column}.Select_labelPosition_top>:not(:last-child){margin-bottom:var(--label-offset)}.Select_labelPosition_left{flex-direction:row}.Select_labelPosition_left .Select-Label{align-items:center;display:inline-flex;height:var(--input-height)}.Select_labelPosition_left>:not(:last-child){margin-right:var(--space-s)}.Select-Body{display:inline-flex;flex-direction:column;width:100%}.Select-Body .Select-Caption{margin-left:var(--caption-margin-left);margin-top:var(--caption-offset)}.Select-SelectContainer{--container-border-color:var(--color-control-bg-border-default);display:flex;position:relative;width:100%}.Select-SelectContainer_status_alert{--container-border-color:var(--color-bg-alert)}.Select-SelectContainer_status_success{--container-border-color:var(--color-bg-success)}.Select-SelectContainer_status_warning{--container-border-color:var(--color-bg-warning)}.Select-SelectContainer_view_default .Select-Control{background:var(--color-control-bg-default);border:var(--control-border-width) solid var(--container-border-color);border-radius:var(--control-radius);color:var(--color-control-typo-default);padding:0}.Select-SelectContainer_view_default .Select-Control:hover{border-color:var(--color-control-bg-border-default-hover)}.Select-SelectContainer_view_default.Select-SelectContainer_focused .Select-Control{border-color:var(--color-control-bg-border-focus);outline:none}.Select-SelectContainer_multiple .Select-Control{height:auto;min-height:var(--input-height)}.Select-SelectContainer_form_round .Select-Control{border-radius:calc(var(--input-height)/2);padding-left:var(--round-offset)}.Select-SelectContainer_form_brick .Select-Control{border-radius:0}.Select-SelectContainer_form_clear .Select-Control{border-width:0;border-bottom-width:var(--control-border-width);border-radius:0}.Select-SelectContainer_form_defaultClear .Select-Control{border-radius:var(--control-radius) 0 0 var(--control-radius);border-right-width:0}.Select-SelectContainer_form_clearDefault .Select-Control{border-left-width:0;border-radius:0 var(--control-radius) var(--control-radius) 0}.Select-SelectContainer_form_defaultBrick .Select-Control{border-radius:var(--control-radius) 0 0 var(--control-radius)}.Select-SelectContainer_form_brickDefault .Select-Control{border-radius:0 var(--control-radius) var(--control-radius) 0}.Select-SelectContainer_form_roundBrick .Select-Control{border-radius:calc(var(--input-height)/2) 0 0 calc(var(--input-height)/2);padding-left:var(--round-offset)}.Select-SelectContainer_form_brickRound .Select-Control{border-radius:0 calc(var(--input-height)/2) calc(var(--input-height)/2) 0}.Select-SelectContainer_form_brickClear .Select-Control{border-radius:0;border-right-width:0}.Select-SelectContainer_form_clearBrick .Select-Control{border-left-width:0;border-radius:0}.Select-SelectContainer_form_clearRound .Select-Control{border-left-width:0;border-radius:0 calc(var(--input-height)/2) calc(var(--input-height)/2) 0}.Select-SelectContainer_form_roundClear .Select-Control{border-radius:calc(var(--input-height)/2) 0 0 calc(var(--input-height)/2);border-right-width:0;padding-left:var(--round-offset)}.Select-SelectContainer_form_clearClear .Select-Control{border-width:0;border-bottom-width:var(--control-border-width);border-radius:0;border-top-width:var(--control-border-width)}.Select-SelectContainer_view_default.Select-SelectContainer_form_clear.Select-SelectContainer_focused .Select-Control,.Select-SelectContainer_view_default.Select-SelectContainer_form_clearClear.Select-SelectContainer_focused .Select-Control{box-shadow:var(--control-border-width) 0 var(--color-control-bg-border-focus),calc(var(--control-border-width)*-1) 0 var(--color-control-bg-border-focus)}.Select-SelectContainer_view_default.Select-SelectContainer_form_brickClear.Select-SelectContainer_focused .Select-Control,.Select-SelectContainer_view_default.Select-SelectContainer_form_defaultClear.Select-SelectContainer_focused .Select-Control,.Select-SelectContainer_view_default.Select-SelectContainer_form_roundClear.Select-SelectContainer_focused .Select-Control{box-shadow:var(--control-border-width) 0 var(--color-control-bg-border-focus)}.Select-SelectContainer_view_default.Select-SelectContainer_form_clearBrick.Select-SelectContainer_focused .Select-Control,.Select-SelectContainer_view_default.Select-SelectContainer_form_clearDefault.Select-SelectContainer_focused .Select-Control,.Select-SelectContainer_view_default.Select-SelectContainer_form_clearRound.Select-SelectContainer_focused .Select-Control{box-shadow:calc(var(--control-border-width)*-1) 0 var(--color-control-bg-border-focus)}.Select-SelectContainer_view_default.Select-SelectContainer_disabled .Select-Control{--clear-button-color:var(--color-control-typo-disable);background:var(--color-control-bg-disable);border-color:var(--color-control-bg-border-disable);color:var(--color-control-typo-disable);pointer-events:none}.Select-SelectContainer_view_clear .Select-Control,.Select-SelectContainer_view_clear .Select-Control:focus,.Select-SelectContainer_view_clear .Select-Control:hover{color:var(--color-control-typo-default);padding:0}.Select-SelectContainer_view_clear .Select-Control.Select-SelectContainer_disabled,.Select-SelectContainer_view_clear .Select-Control:focus.Select-SelectContainer_disabled,.Select-SelectContainer_view_clear .Select-Control:hover.Select-SelectContainer_disabled{pointer-events:none}.Select-SelectContainer_view_clear .Select-Control.Select-SelectContainer_disabled .Select-Control,.Select-SelectContainer_view_clear .Select-Control:focus.Select-SelectContainer_disabled .Select-Control,.Select-SelectContainer_view_clear .Select-Control:hover.Select-SelectContainer_disabled .Select-Control{color:var(--color-control-typo-disable)}.Select-SelectContainer_view_clear.Select-SelectContainer_disabled .Select-Control{pointer-events:none}.Select-SelectContainer_view_default .Select-ControlValueContainer{padding:0 0 0 var(--input-space)}.Select-SelectContainer_form_round .Select-SelectContainer-IndicatorsDropdown{border-radius:0 calc(var(--input-height)/2) calc(var(--input-height)/2) 0}.Select-SelectContainer_multiple .Select-ControlValueContainer{box-sizing:border-box;display:flex;line-height:1;padding-bottom:0;padding-top:0;position:relative}.Select-SelectContainer_multiple .Select-ControlValue{-ms-overflow-style:none;max-height:calc(var(--tag-space)*4 + var(--select-element-height)*4.5);overflow-x:visible;overflow-y:auto;padding-top:calc(var(--tag-space) - var(--control-border-width));scrollbar-width:none;white-space:normal}.Select-SelectContainer_multiple .Select-ControlValue::-webkit-scrollbar{display:none}.Select-SelectContainer_multiple .Select-ControlValue_isUserSelect{display:flex;flex-wrap:wrap;padding-top:calc(var(--space-s)/4)}.Select_view_clear{--caption-margin-left:0}.Select-Delimiter{background-color:var(--color-control-bg-border-default);width:1px}.Select-Control{background:transparent;border:none;box-sizing:border-box;color:currentColor;cursor:pointer;display:inline-flex;font-family:var(--font-primary);font-weight:var(--font-weight-text-regular);height:var(--input-height);line-height:calc(var(--input-height) - var(--control-border-width));outline:none;padding:0;transition:border-color .15s,box-shadow .15s,background-color .15s;width:100%}.Select-Control:focus{outline:none}.Select-SelectAll.Text{line-height:calc(var(--input-height) - var(--space-3xs))}.Select-Indicators{display:flex;height:100%}.Select-IndicatorsDropdown{background-color:transparent;border:none;color:var(--color-control-typo-placeholder);cursor:pointer;display:block;margin:0;padding:0;text-align:center;width:var(--input-height)}.Select-IndicatorsDropdown:focus{outline:none}.Select-ControlInner{position:relative;width:100%}.Select-ControlValueContainer{background-color:transparent;border:none;bottom:0;color:inherit;font-size:var(--input-font-size);left:0;line-height:calc(var(--input-height) - 2px);margin:0;min-height:calc(var(--input-height) - 2px);padding:0;position:absolute;right:0;text-align:left;top:0}.Select-ControlValueContainer:focus{outline:none}.Select-Control[aria-expanded=true] .Select-IndicatorsDropdown{transform:rotate(180deg)}.Select-ControlValue,.Select-Placeholder{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.Select-Placeholder{color:var(--color-control-typo-placeholder);font-size:var(--input-font-size);padding-right:var(--input-space);pointer-events:none;text-align:left}.Select-Placeholder_isHidden{opacity:0;visibility:hidden}.Select-Control_hasInput .Select-Placeholder{background-color:transparent;line-height:calc(var(--input-height) - 2px);position:absolute;top:0;width:calc(100% - var(--input-space))}.Select-DropdownIndicatorIcon{position:relative;top:1px}.Select-ClearIndicator{background-color:transparent;border:none;color:var(--clear-button-color);cursor:pointer;display:flex;flex-direction:column;height:calc(var(--input-height) - var(--control-border-width)*2);justify-content:center;margin:0;padding:0 var(--space-xs)}.Select-ClearIndicator:hover{--clear-button-color:var(--color-control-typo-clear-hover)}.Select-ClearIndicatorIcon{color:var(--color-control-typo-placeholder);position:relative;top:1px}.Select-Input{background-color:transparent;border:none;color:inherit;font-family:inherit;font-size:inherit;line-height:calc(var(--input-height) - 2px);margin:0;outline:none;padding:0;position:relative;width:100%}.Select-Input_hide{bottom:0;left:0;opacity:0;position:absolute;top:0;width:100%}.Select-Input_multiple{display:inline-flex;height:calc(var(--input-height) - var(--control-border-width)*2);line-height:1;line-height:calc(var(--input-height) - var(--control-border-width)*2);margin-top:calc(var(--tag-space)*-1);min-width:10px}.Select-Input_multiple.Select-Input_isUserSelect{margin-top:calc(var(--space-s)/4*-1)}.Select-FakeField{bottom:0;left:0;opacity:0;position:absolute;top:0;width:100%}.Select-HelperInputFakeElement{display:inline-block;font-size:var(--input-font-size);height:0;overflow:hidden;position:absolute;top:0;visibility:hidden;white-space:nowrap}
+.Select{--caption-margin-left:calc(var(--input-space) + var(--control-border-width));--clear-button-color:var(--color-control-typo-clear);align-items:flex-start;display:flex;justify-content:flex-start;position:relative;width:100%}.Select_type_userselect.Select_size_s{--select-element-height:var(--space-xl)}.Select_type_userselect.Select_size_m{--select-element-height:calc(var(--space-2xl) - var(--space-3xs))}.Select_type_userselect.Select_size_l{--select-element-height:calc(var(--space-3xl) - var(--space-2xs))}.Select_type_combobox.Select_size_xs{--select-element-height:calc(var(--space-m) + var(--space-3xs))}.Select_type_combobox.Select_size_s{--select-element-height:var(--space-xl)}.Select_type_combobox.Select_size_m{--select-element-height:calc(var(--space-2xl) - var(--space-2xs))}.Select_type_combobox.Select_size_l{--select-element-height:var(--space-2xl)}.Select_type_select.Select_size_xs{--select-element-height:calc(var(--space-m) + var(--space-3xs))}.Select_type_select.Select_size_s{--select-element-height:var(--space-xl)}.Select_type_select.Select_size_m{--select-element-height:calc(var(--space-2xl) - var(--space-2xs))}.Select_type_select.Select_size_l{--select-element-height:var(--space-2xl)}.Select_size_xs{--label-offset:var(--space-2xs);--caption-offset:var(--space-2xs);--round-offset:calc(var(--space-3xs) + var(--space-2xs));--input-height:var(--control-height-xs);--input-space:calc(var(--control-space-xs)*0.5);--input-font-size:var(--control-text-size-xs);--tag-space:calc((var(--space-xs) - 1px)/2 - var(--control-border-width));--input-max-height:calc(var(--tag-space)*4 + var(--select-element-height)*4.5)}.Select_size_s{--label-offset:var(--space-2xs);--caption-offset:var(--space-2xs);--round-offset:calc(var(--space-2xs));--input-height:var(--control-height-s);--input-space:calc(var(--control-space-s)*0.5);--input-font-size:var(--control-text-size-s);--tag-space:calc(var(--space-xs)/2 - var(--control-border-width));--input-max-height:calc(var(--tag-space)*4 + var(--select-element-height)*4.5)}.Select_size_m{--label-offset:var(--space-xs);--caption-offset:var(--space-xs);--round-offset:calc(var(--space-3xs) + var(--space-2xs));--input-height:var(--control-height-m);--input-space:calc(var(--control-space-m)*0.5);--input-font-size:var(--control-text-size-m);--tag-space:calc(var(--space-s)/2 - var(--control-border-width));--input-max-height:calc(var(--tag-space)*4 + var(--space-2xl)*4.5 - var(--space-2xs)*4.5)}.Select_size_l{--label-offset:var(--space-xs);--caption-offset:var(--space-xs);--round-offset:calc(var(--space-xs));--input-height:var(--control-height-l);--input-space:calc(var(--control-space-l)*0.5);--input-font-size:var(--control-text-size-l);--tag-space:calc(var(--space-m)/2 - var(--control-border-width));--input-max-height:calc(var(--tag-space)*4 + var(--space-2xl)*4.5)}.Select_labelPosition_top{flex-direction:column}.Select_labelPosition_top>:not(:last-child){margin-bottom:var(--label-offset)}.Select_labelPosition_left{flex-direction:row}.Select_labelPosition_left .Select-Label{align-items:center;display:inline-flex;height:var(--input-height)}.Select_labelPosition_left>:not(:last-child){margin-right:var(--space-s)}.Select-Body{display:inline-flex;flex-direction:column;width:100%}.Select-Body .Select-Caption{margin-left:var(--caption-margin-left);margin-top:var(--caption-offset)}.Select-SelectContainer{--container-border-color:var(--color-control-bg-border-default);display:flex;position:relative;width:100%}.Select-SelectContainer_status_alert{--container-border-color:var(--color-bg-alert)}.Select-SelectContainer_status_success{--container-border-color:var(--color-bg-success)}.Select-SelectContainer_status_warning{--container-border-color:var(--color-bg-warning)}.Select-SelectContainer_view_default .Select-Control{background:var(--color-control-bg-default);border:var(--control-border-width) solid var(--container-border-color);border-radius:var(--control-radius);color:var(--color-control-typo-default);padding:0}.Select-SelectContainer_view_default .Select-Control:hover{border-color:var(--color-control-bg-border-default-hover)}.Select-SelectContainer_view_default.Select-SelectContainer_focused .Select-Control{border-color:var(--color-control-bg-border-focus);outline:none}.Select-SelectContainer_multiple .Select-Control{height:auto;min-height:var(--input-height)}.Select-SelectContainer_form_round .Select-Control{border-radius:calc(var(--input-height)/2);padding-left:var(--round-offset)}.Select-SelectContainer_form_brick .Select-Control{border-radius:0}.Select-SelectContainer_form_clear .Select-Control{border-width:0;border-bottom-width:var(--control-border-width);border-radius:0}.Select-SelectContainer_form_defaultClear .Select-Control{border-radius:var(--control-radius) 0 0 var(--control-radius);border-right-width:0}.Select-SelectContainer_form_clearDefault .Select-Control{border-left-width:0;border-radius:0 var(--control-radius) var(--control-radius) 0}.Select-SelectContainer_form_defaultBrick .Select-Control{border-radius:var(--control-radius) 0 0 var(--control-radius)}.Select-SelectContainer_form_brickDefault .Select-Control{border-radius:0 var(--control-radius) var(--control-radius) 0}.Select-SelectContainer_form_roundBrick .Select-Control{border-radius:calc(var(--input-height)/2) 0 0 calc(var(--input-height)/2);padding-left:var(--round-offset)}.Select-SelectContainer_form_brickRound .Select-Control{border-radius:0 calc(var(--input-height)/2) calc(var(--input-height)/2) 0}.Select-SelectContainer_form_brickClear .Select-Control{border-radius:0;border-right-width:0}.Select-SelectContainer_form_clearBrick .Select-Control{border-left-width:0;border-radius:0}.Select-SelectContainer_form_clearRound .Select-Control{border-left-width:0;border-radius:0 calc(var(--input-height)/2) calc(var(--input-height)/2) 0}.Select-SelectContainer_form_roundClear .Select-Control{border-radius:calc(var(--input-height)/2) 0 0 calc(var(--input-height)/2);border-right-width:0;padding-left:var(--round-offset)}.Select-SelectContainer_form_clearClear .Select-Control{border-width:0;border-bottom-width:var(--control-border-width);border-radius:0;border-top-width:var(--control-border-width)}.Select-SelectContainer_view_default.Select-SelectContainer_form_clear.Select-SelectContainer_focused .Select-Control,.Select-SelectContainer_view_default.Select-SelectContainer_form_clearClear.Select-SelectContainer_focused .Select-Control{box-shadow:var(--control-border-width) 0 var(--color-control-bg-border-focus),calc(var(--control-border-width)*-1) 0 var(--color-control-bg-border-focus)}.Select-SelectContainer_view_default.Select-SelectContainer_form_brickClear.Select-SelectContainer_focused .Select-Control,.Select-SelectContainer_view_default.Select-SelectContainer_form_defaultClear.Select-SelectContainer_focused .Select-Control,.Select-SelectContainer_view_default.Select-SelectContainer_form_roundClear.Select-SelectContainer_focused .Select-Control{box-shadow:var(--control-border-width) 0 var(--color-control-bg-border-focus)}.Select-SelectContainer_view_default.Select-SelectContainer_form_clearBrick.Select-SelectContainer_focused .Select-Control,.Select-SelectContainer_view_default.Select-SelectContainer_form_clearDefault.Select-SelectContainer_focused .Select-Control,.Select-SelectContainer_view_default.Select-SelectContainer_form_clearRound.Select-SelectContainer_focused .Select-Control{box-shadow:calc(var(--control-border-width)*-1) 0 var(--color-control-bg-border-focus)}.Select-SelectContainer_view_default.Select-SelectContainer_disabled .Select-Control{--clear-button-color:var(--color-control-typo-disable);background:var(--color-control-bg-disable);border-color:var(--color-control-bg-border-disable);color:var(--color-control-typo-disable);pointer-events:none}.Select-SelectContainer_view_clear .Select-Control,.Select-SelectContainer_view_clear .Select-Control:focus,.Select-SelectContainer_view_clear .Select-Control:hover{color:var(--color-control-typo-default);padding:0}.Select-SelectContainer_view_clear .Select-Control.Select-SelectContainer_disabled,.Select-SelectContainer_view_clear .Select-Control:focus.Select-SelectContainer_disabled,.Select-SelectContainer_view_clear .Select-Control:hover.Select-SelectContainer_disabled{pointer-events:none}.Select-SelectContainer_view_clear .Select-Control.Select-SelectContainer_disabled .Select-Control,.Select-SelectContainer_view_clear .Select-Control:focus.Select-SelectContainer_disabled .Select-Control,.Select-SelectContainer_view_clear .Select-Control:hover.Select-SelectContainer_disabled .Select-Control{color:var(--color-control-typo-disable)}.Select-SelectContainer_view_clear.Select-SelectContainer_disabled .Select-Control{pointer-events:none}.Select-SelectContainer_view_default .Select-ControlValueContainer{padding:0 0 0 var(--input-space)}.Select-SelectContainer_form_round .Select-SelectContainer-IndicatorsDropdown{border-radius:0 calc(var(--input-height)/2) calc(var(--input-height)/2) 0}.Select-SelectContainer_multiple .Select-ControlValueContainer{box-sizing:border-box;display:flex;line-height:1;padding-bottom:0;padding-top:0;position:relative}.Select-SelectContainer_multiple .Select-ControlValue{-ms-overflow-style:none;max-height:calc(var(--tag-space)*4 + var(--select-element-height)*4.5);overflow-x:visible;overflow-y:auto;padding-top:calc(var(--tag-space) - var(--control-border-width));scrollbar-width:none;white-space:normal}.Select-SelectContainer_multiple .Select-ControlValue::-webkit-scrollbar{display:none}.Select-SelectContainer_multiple .Select-ControlValue_isUserSelect{display:flex;flex-wrap:wrap;padding-top:calc(var(--space-s)/4)}.Select_view_clear{--caption-margin-left:0}.Select-Delimiter{background-color:var(--color-control-bg-border-default);width:1px}.Select-Control{background:transparent;border:none;box-sizing:border-box;color:currentColor;cursor:pointer;display:inline-flex;font-family:var(--font-primary);font-weight:var(--font-weight-text-regular);height:var(--input-height);line-height:calc(var(--input-height) - var(--control-border-width));outline:none;padding:0;transition:border-color .15s,box-shadow .15s,background-color .15s;width:100%}.Select-Control:focus{outline:none}.Select-SelectAll.Text{line-height:calc(var(--input-height) - var(--space-3xs))}.Select-Indicators{display:flex;height:100%}.Select-IndicatorsDropdown{background-color:transparent;border:none;color:var(--color-control-typo-placeholder);cursor:pointer;display:block;margin:0;padding:0;text-align:center;width:var(--input-height)}.Select-IndicatorsDropdown:focus{outline:none}.Select-ControlInner{position:relative;width:100%}.Select-ControlValueContainer{background-color:transparent;border:none;bottom:0;color:inherit;font-size:var(--input-font-size);left:0;line-height:calc(var(--input-height) - 2px);margin:0;min-height:calc(var(--input-height) - 2px);padding:0;position:absolute;right:0;text-align:left;top:0}.Select-ControlValueContainer:focus{outline:none}.Select-Control[aria-expanded=true] .Select-IndicatorsDropdown{transform:rotate(180deg)}.Select-ControlValue,.Select-Placeholder{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.Select-Placeholder{color:var(--color-control-typo-placeholder);font-size:var(--input-font-size);padding-right:var(--input-space);pointer-events:none;text-align:left}.Select-Placeholder_isHidden{opacity:0;visibility:hidden}.Select-Control_hasInput .Select-Placeholder{background-color:transparent;line-height:calc(var(--input-height) - 2px);position:absolute;top:0;width:calc(100% - var(--input-space))}.Select-DropdownIndicatorIcon{position:relative;top:1px}.Select-ClearIndicator{background-color:transparent;border:none;color:var(--clear-button-color);cursor:pointer;display:flex;flex-direction:column;height:100%;justify-content:center;margin:0;min-height:calc(var(--input-height) - var(--control-border-width)*2);padding:0 var(--space-xs)}.Select-ClearIndicator:hover{--clear-button-color:var(--color-control-typo-clear-hover)}.Select-ClearIndicatorIcon{color:var(--color-control-typo-placeholder);position:relative;top:1px}.Select-Input{background-color:transparent;border:none;color:inherit;font-family:inherit;font-size:inherit;line-height:calc(var(--input-height) - 2px);margin:0;outline:none;padding:0;position:relative;width:100%}.Select-Input_hide{bottom:0;left:0;opacity:0;position:absolute;top:0;width:100%}.Select-Input_multiple{display:inline-flex;height:calc(var(--input-height) - var(--control-border-width)*2);line-height:1;line-height:calc(var(--input-height) - var(--control-border-width)*2);margin-top:calc(var(--tag-space)*-1);min-width:10px}.Select-Input_multiple.Select-Input_isUserSelect{margin-top:calc(var(--space-s)/4*-1)}.Select-FakeField{bottom:0;left:0;opacity:0;position:absolute;top:0;width:100%}.Select-HelperInputFakeElement{display:inline-block;font-size:var(--input-font-size);height:0;overflow:hidden;position:absolute;top:0;visibility:hidden;white-space:nowrap}

package/__internal__/src/components/SelectComponentsDeprecated/SelectCreateButton/SelectCreateButton.js

@@ -1,2 +1,2 @@
-import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["className","labelForCreate","inputValue","active","hovered","size","indent"];import"./SelectCreateButton.css";import React from"react";import{ListAddItem}from"../../ListCanary";import{cn}from"../../../utils/bem";export var cnSelectCreateButton=cn("SelectCreateButton");export var SelectCreateButton=function(a){var b=a.className,c=a.labelForCreate,d=a.inputValue,e=a.active,f=a.hovered,g=a.size,h=a.indent,i=_objectWithoutProperties(a,_excluded);return React.createElement(ListAddItem,Object.assign({},i,{className:cnSelectCreateButton(null,[b]),"aria-selected":e,role:"option",active:f,size:g,innerOffset:h,label:React.createElement(React.Fragment,null,c," \xAB",React.createElement("b",null,d),"\xBB")}))};
+import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["className","labelForCreate","inputValue","active","hovered","size","indent"];import"./SelectCreateButton.css";import React from"react";import{ListAddItem}from"../../ListCanary";import{cnDeprecated}from"../../../utils/bem";export var cnSelectCreateButton=cnDeprecated("SelectCreateButton");export var SelectCreateButton=function(a){var b=a.className,c=a.labelForCreate,d=a.inputValue,e=a.active,f=a.hovered,g=a.size,h=a.indent,i=_objectWithoutProperties(a,_excluded);return React.createElement(ListAddItem,Object.assign({},i,{className:cnSelectCreateButton(null,[b]),"aria-selected":e,role:"option",active:f,size:g,innerOffset:h,label:React.createElement(React.Fragment,null,c," \xAB",React.createElement("b",null,d),"\xBB")}))};
 //# sourceMappingURL=SelectCreateButton.js.map

package/__internal__/src/components/SelectComponentsDeprecated/SelectCreateButton/SelectCreateButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectCreateButton.js","names":["React","ListAddItem","cn","cnSelectCreateButton","SelectCreateButton","props","className","labelForCreate","inputValue","active","hovered","size","indent","otherProps"],"sources":["../../../../../../src/components/SelectComponentsDeprecated/SelectCreateButton/SelectCreateButton.tsx"],"sourcesContent":["import './SelectCreateButton.css';\n\nimport React from 'react';\n\nimport { ListAddItem } from '##/components/ListCanary';\nimport { cn } from '##/utils/bem';\nimport { PropsWithHTMLAttributes } from '##/utils/types/PropsWithHTMLAttributes';\n\nimport { PropSize } from '../types';\n\ntype SelectCreateButtonProps = PropsWithHTMLAttributes<\n  {\n    labelForCreate?: string;\n    inputValue?: string;\n    active: boolean;\n    hovered: boolean;\n    size: PropSize;\n    indent: 'normal' | 'increased';\n  },\n  HTMLDivElement\n>;\n\nexport const cnSelectCreateButton = cn('SelectCreateButton');\n\nexport const SelectCreateButton: React.FC<SelectCreateButtonProps> = (\n  props,\n) => {\n  const {\n    className,\n    labelForCreate,\n    inputValue,\n    active,\n    hovered,\n    size,\n    indent,\n    ...otherProps\n  } = props;\n\n  return (\n    <ListAddItem\n      {...otherProps}\n      className={cnSelectCreateButton(null, [className])}\n      aria-selected={active}\n      role=\"option\"\n      active={hovered}\n      size={size}\n      innerOffset={indent}\n      label={\n        <>\n          {labelForCreate} «<b>{inputValue}</b>»\n        </>\n      }\n    />\n  );\n};\n"],"mappings":"kLAAA,iCAEA,MAAOA,MAAP,KAAkB,OAAlB,CAEA,OAASC,WAAT,wBACA,OAASC,EAAT,0BAiBA,MAAO,IAAMC,qBAAoB,CAAGD,EAAE,CAAC,oBAAD,CAA/B,CAEP,MAAO,IAAME,mBAAqD,CAAG,SACnEC,CADmE,CAEhE,CACH,GACEC,EADF,CASID,CATJ,CACEC,SADF,CAEEC,CAFF,CASIF,CATJ,CAEEE,cAFF,CAGEC,CAHF,CASIH,CATJ,CAGEG,UAHF,CAIEC,CAJF,CASIJ,CATJ,CAIEI,MAJF,CAKEC,CALF,CASIL,CATJ,CAKEK,OALF,CAMEC,CANF,CASIN,CATJ,CAMEM,IANF,CAOEC,CAPF,CASIP,CATJ,CAOEO,MAPF,CAQKC,CARL,0BASIR,CATJ,YAWA,MACE,qBAAC,WAAD,kBACMQ,CADN,EAEE,SAAS,CAAEV,oBAAoB,CAAC,IAAD,CAAO,CAACG,CAAD,CAAP,CAFjC,CAGE,gBAAeG,CAHjB,CAIE,IAAI,CAAC,QAJP,CAKE,MAAM,CAAEC,CALV,CAME,IAAI,CAAEC,CANR,CAOE,WAAW,CAAEC,CAPf,CAQE,KAAK,CACH,wCACGL,CADH,SACoB,6BAAIC,CAAJ,CADpB,QATJ,GAeH,CA9BM"}
+{"version":3,"file":"SelectCreateButton.js","names":["React","ListAddItem","cnDeprecated","cnSelectCreateButton","SelectCreateButton","props","className","labelForCreate","inputValue","active","hovered","size","indent","otherProps"],"sources":["../../../../../../src/components/SelectComponentsDeprecated/SelectCreateButton/SelectCreateButton.tsx"],"sourcesContent":["import './SelectCreateButton.css';\n\nimport React from 'react';\n\nimport { ListAddItem } from '##/components/ListCanary';\nimport { cnDeprecated } from '##/utils/bem';\nimport { PropsWithHTMLAttributes } from '##/utils/types/PropsWithHTMLAttributes';\n\nimport { PropSize } from '../types';\n\ntype SelectCreateButtonProps = PropsWithHTMLAttributes<\n  {\n    labelForCreate?: string;\n    inputValue?: string;\n    active: boolean;\n    hovered: boolean;\n    size: PropSize;\n    indent: 'normal' | 'increased';\n  },\n  HTMLDivElement\n>;\n\nexport const cnSelectCreateButton = cnDeprecated('SelectCreateButton');\n\nexport const SelectCreateButton: React.FC<SelectCreateButtonProps> = (\n  props,\n) => {\n  const {\n    className,\n    labelForCreate,\n    inputValue,\n    active,\n    hovered,\n    size,\n    indent,\n    ...otherProps\n  } = props;\n\n  return (\n    <ListAddItem\n      {...otherProps}\n      className={cnSelectCreateButton(null, [className])}\n      aria-selected={active}\n      role=\"option\"\n      active={hovered}\n      size={size}\n      innerOffset={indent}\n      label={\n        <>\n          {labelForCreate} «<b>{inputValue}</b>»\n        </>\n      }\n    />\n  );\n};\n"],"mappings":"kLAAA,iCAEA,MAAOA,MAAP,KAAkB,OAAlB,CAEA,OAASC,WAAT,wBACA,OAASC,YAAT,0BAiBA,MAAO,IAAMC,qBAAoB,CAAGD,YAAY,CAAC,oBAAD,CAAzC,CAEP,MAAO,IAAME,mBAAqD,CAAG,SACnEC,CADmE,CAEhE,CACH,GACEC,EADF,CASID,CATJ,CACEC,SADF,CAEEC,CAFF,CASIF,CATJ,CAEEE,cAFF,CAGEC,CAHF,CASIH,CATJ,CAGEG,UAHF,CAIEC,CAJF,CASIJ,CATJ,CAIEI,MAJF,CAKEC,CALF,CASIL,CATJ,CAKEK,OALF,CAMEC,CANF,CASIN,CATJ,CAMEM,IANF,CAOEC,CAPF,CASIP,CATJ,CAOEO,MAPF,CAQKC,CARL,0BASIR,CATJ,YAWA,MACE,qBAAC,WAAD,kBACMQ,CADN,EAEE,SAAS,CAAEV,oBAAoB,CAAC,IAAD,CAAO,CAACG,CAAD,CAAP,CAFjC,CAGE,gBAAeG,CAHjB,CAIE,IAAI,CAAC,QAJP,CAKE,MAAM,CAAEC,CALV,CAME,IAAI,CAAEC,CANR,CAOE,WAAW,CAAEC,CAPf,CAQE,KAAK,CACH,wCACGL,CADH,SACoB,6BAAIC,CAAJ,CADpB,QATJ,GAeH,CA9BM"}

package/__internal__/src/components/SelectComponentsDeprecated/SelectDropdown/SelectDropdown.js

@@ -1,2 +1,2 @@
-import _defineProperty from"@babel/runtime/helpers/defineProperty";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["controlRef","size","getOptionProps","dropdownRef","labelForCreate","className","labelForNotFound","labelForEmptyItems","hasItems","form","isOpen","offset","renderItem","visibleItems","isLoading","getGroupLabel","notFound"];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"./SelectDropdown.css";import React,{Fragment,useMemo,useRef}from"react";import{Transition}from"react-transition-group";import{cnListBox,ListItem,mapVerticalSpase}from"../../ListCanary";import{cnMixScrollBar}from"../../../mixs/MixScrollBar";import{cnMixSpace}from"../../../mixs/MixSpace";import{isOptionForCreate,isOptionForSelectAll}from"../../../hooks/useSelect/useSelect";import{animateTimeout,cnMixPopoverAnimate}from"../../../mixs/MixPopoverAnimate/MixPopoverAnimate";import{cn}from"../../../utils/bem";import{fabricIndex}from"../../../utils/fabricIndex";import{Popover}from"../../Popover/Popover";import{SelectCreateButton}from"../SelectCreateButton/SelectCreateButton";import{SelectGroupLabel}from"../SelectGroupLabel/SelectGroupLabel";import{SelectItemAll}from"../SelectItemAll/SelectSelectAll";import{SelectLoader}from"../SelectLoader/SelectLoader";export var selectDropdownform=["default","brick","round"];export var defaultSelectDropdownPropForm=selectDropdownform[0];var cnSelectDropdown=cn("SelectDropdown");export var SelectDropdown=function(a){var b=a.controlRef,c=a.size,d=a.getOptionProps,e=a.dropdownRef,f=a.labelForCreate,g=a.className,h=a.labelForNotFound,i=a.labelForEmptyItems,j=a.hasItems,k=!(void 0!==j)||j,l=a.form,m=a.isOpen,n=a.offset,o=void 0===n?"none":n,p=a.renderItem,q=a.visibleItems,r=a.isLoading,s=a.getGroupLabel,t=a.notFound,u=_objectWithoutProperties(a,_excluded),v="round"===l?"increased":"normal",w=useRef(null),x=useMemo(function(){return 0<q.filter(function(a){return isOptionForCreate(a)||Array.isArray(a.items)&&0<a.items.length}).length},[q]),y="none"===o?void 0:o;return React.createElement(Transition,{in:m,unmountOnExit:!0,nodeRef:w,timeout:animateTimeout},function(a){var j=fabricIndex();return React.createElement(Popover,Object.assign({},u,{anchorRef:b,direction:"downStartLeft",possibleDirections:["downStartLeft","upStartLeft","downStartRight","upStartRight"],offset:y,ref:w,role:"listbox",className:cnSelectDropdown(null,[cnListBox({size:c,form:l,border:!0,shadow:!0}),cnMixPopoverAnimate({animate:a}),g]),equalAnchorWidth:!0}),React.createElement("div",{className:cnSelectDropdown("List",[cnMixSpace({pV:mapVerticalSpase[c]}),cnMixScrollBar()]),ref:e},r&&React.createElement(SelectLoader,{mode:x?"blur":"empty"}),q.map(function(a){return isOptionForCreate(a)?React.createElement(SelectCreateButton,Object.assign({size:c,labelForCreate:f,inputValue:a.label,indent:v},d({index:j(),item:a}))):React.createElement(Fragment,{key:a.key},a.group&&s&&React.createElement(SelectGroupLabel,{label:s(a.group),size:c,indent:v}),a.items.map(function(b,e){return isOptionForSelectAll(b)?React.createElement(SelectItemAll,Object.assign({indent:v,size:c},d({index:j(),item:b}),{intermediate:!!(b.checkedCount&&b.totalCount)&&b.checkedCount!==b.totalCount,checked:b.checkedCount===b.totalCount,countItems:b.checkedCount,total:b.totalCount})):React.createElement(Fragment,{key:"".concat(a.key,"-").concat(e)},p(_objectSpread({item:b},d({index:j(),item:b}))))}))}),!r&&k&&t&&h&&React.createElement(ListItem,{size:c,label:h,innerOffset:v},h),!r&&!k&&i&&React.createElement(ListItem,{size:c,label:i,innerOffset:v},i)))})};
+import _defineProperty from"@babel/runtime/helpers/defineProperty";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["controlRef","size","getOptionProps","dropdownRef","labelForCreate","className","labelForNotFound","labelForEmptyItems","hasItems","form","isOpen","offset","renderItem","visibleItems","isLoading","getGroupLabel","notFound"];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"./SelectDropdown.css";import React,{Fragment,useMemo,useRef}from"react";import{Transition}from"react-transition-group";import{cnListBox,ListItem,mapVerticalSpase}from"../../ListCanary";import{cnMixScrollBar}from"../../../mixs/MixScrollBar";import{cnMixSpace}from"../../../mixs/MixSpace";import{isOptionForCreate,isOptionForSelectAll}from"../../../hooks/useSelect/useSelect";import{animateTimeout,cnMixPopoverAnimate}from"../../../mixs/MixPopoverAnimate/MixPopoverAnimate";import{cnDeprecated}from"../../../utils/bem";import{fabricIndex}from"../../../utils/fabricIndex";import{Popover}from"../../Popover/Popover";import{SelectCreateButton}from"../SelectCreateButton/SelectCreateButton";import{SelectGroupLabel}from"../SelectGroupLabel/SelectGroupLabel";import{SelectItemAll}from"../SelectItemAll/SelectSelectAll";import{SelectLoader}from"../SelectLoader/SelectLoader";export var selectDropdownform=["default","brick","round"];export var defaultSelectDropdownPropForm=selectDropdownform[0];var cnSelectDropdown=cnDeprecated("SelectDropdown");export var SelectDropdown=function(a){var b=a.controlRef,c=a.size,d=a.getOptionProps,e=a.dropdownRef,f=a.labelForCreate,g=a.className,h=a.labelForNotFound,i=a.labelForEmptyItems,j=a.hasItems,k=!(void 0!==j)||j,l=a.form,m=a.isOpen,n=a.offset,o=void 0===n?"none":n,p=a.renderItem,q=a.visibleItems,r=a.isLoading,s=a.getGroupLabel,t=a.notFound,u=_objectWithoutProperties(a,_excluded),v="round"===l?"increased":"normal",w=useRef(null),x=useMemo(function(){return 0<q.filter(function(a){return isOptionForCreate(a)||Array.isArray(a.items)&&0<a.items.length}).length},[q]),y="none"===o?void 0:o;return React.createElement(Transition,{in:m,unmountOnExit:!0,nodeRef:w,timeout:animateTimeout},function(a){var j=fabricIndex();return React.createElement(Popover,Object.assign({},u,{anchorRef:b,direction:"downStartLeft",possibleDirections:["downStartLeft","upStartLeft","downStartRight","upStartRight"],offset:y,ref:w,role:"listbox",className:cnSelectDropdown(null,[cnListBox({size:c,form:l,border:!0,shadow:!0}),cnMixPopoverAnimate({animate:a}),g]),equalAnchorWidth:!0}),React.createElement("div",{className:cnSelectDropdown("List",[cnMixSpace({pV:mapVerticalSpase[c]}),cnMixScrollBar()]),ref:e},r&&React.createElement(SelectLoader,{mode:x?"blur":"empty"}),q.map(function(a){return isOptionForCreate(a)?React.createElement(SelectCreateButton,Object.assign({size:c,labelForCreate:f,inputValue:a.label,indent:v},d({index:j(),item:a}))):React.createElement(Fragment,{key:a.key},a.group&&s&&React.createElement(SelectGroupLabel,{label:s(a.group),size:c,indent:v}),a.items.map(function(b,e){return isOptionForSelectAll(b)?React.createElement(SelectItemAll,Object.assign({indent:v,size:c},d({index:j(),item:b}),{intermediate:!!(b.checkedCount&&b.totalCount)&&b.checkedCount!==b.totalCount,checked:b.checkedCount===b.totalCount,countItems:b.checkedCount,total:b.totalCount})):React.createElement(Fragment,{key:"".concat(a.key,"-").concat(e)},p(_objectSpread({item:b},d({index:j(),item:b}))))}))}),!r&&k&&t&&h&&React.createElement(ListItem,{size:c,label:h,innerOffset:v},h),!r&&!k&&i&&React.createElement(ListItem,{size:c,label:i,innerOffset:v},i)))})};
 //# sourceMappingURL=SelectDropdown.js.map