npm - @consta/uikit - Versions diffs - 4.6.2 → 4.6.4 - Mend

@consta/uikit 4.6.2 → 4.6.4

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

Files changed (1118) hide show

package/__internal__/src/components/Tabs/helpers.d.ts CHANGED Viewed

@@ -6,10 +6,10 @@ export declare const getTabsWrapper: (tabsDirection: TabsDirection, fitMode: Tab
 export declare const withDefaultGetters: (props: TabsProps) => {
     getItemLabel: TabsPropGetItemLabel<TabsItemDefault>;
     getItemIcon: TabsPropGetItemIcon<TabsItemDefault>;
-    size?: "m" | "s" | "xs" | undefined;
+    size?: "s" | "m" | "xs" | undefined;
     onlyIcon?: boolean | undefined;
     view?: "clear" | "bordered" | undefined;
-    iconSize?: "m" | "s" | "xs" | "l" | undefined;
+    iconSize?: "s" | "m" | "xs" | "l" | undefined;
     items: TabsItemDefault[];
     value?: TabsItemDefault | null | undefined;
     children?: undefined;
@@ -17,50 +17,15 @@ export declare const withDefaultGetters: (props: TabsProps) => {
     renderItem?: import("./types").RenderItem<TabsItemDefault> | undefined;
     linePosition?: "top" | "bottom" | undefined;
     fitMode?: "scroll" | "dropdown" | undefined;
-    defaultChecked?: boolean | undefined;
-    defaultValue?: string | number | readonly string[] | undefined;
-    suppressContentEditableWarning?: boolean | undefined;
-    suppressHydrationWarning?: boolean | undefined;
-    accessKey?: string | undefined;
-    className?: string | undefined;
-    contentEditable?: (boolean | "true" | "false") | "inherit" | undefined;
-    contextMenu?: string | undefined;
-    dir?: string | undefined;
-    draggable?: (boolean | "true" | "false") | undefined;
-    hidden?: boolean | undefined;
-    id?: string | undefined;
-    lang?: string | undefined;
-    placeholder?: string | undefined;
     slot?: string | undefined;
-    spellCheck?: (boolean | "true" | "false") | undefined;
     style?: React.CSSProperties | undefined;
-    tabIndex?: number | undefined;
     title?: string | undefined;
-    translate?: "yes" | "no" | undefined;
-    radioGroup?: string | undefined;
-    role?: React.AriaRole | undefined;
-    about?: string | undefined;
-    datatype?: string | undefined;
-    inlist?: any;
-    prefix?: string | undefined;
-    property?: string | undefined;
-    resource?: string | undefined;
-    typeof?: string | undefined;
-    vocab?: string | undefined;
-    autoCapitalize?: string | undefined;
-    autoCorrect?: string | undefined;
-    autoSave?: string | undefined;
+    className?: string | undefined;
     color?: string | undefined;
-    itemProp?: string | undefined;
-    itemScope?: boolean | undefined;
-    itemType?: string | undefined;
-    itemID?: string | undefined;
-    itemRef?: string | undefined;
-    results?: number | undefined;
-    security?: string | undefined;
-    unselectable?: "on" | "off" | undefined;
-    inputMode?: "none" | "search" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
-    is?: string | undefined;
+    id?: string | undefined;
+    lang?: string | undefined;
+    role?: React.AriaRole | undefined;
+    tabIndex?: number | undefined;
     'aria-activedescendant'?: string | undefined;
     'aria-atomic'?: (boolean | "true" | "false") | undefined;
     'aria-autocomplete'?: "list" | "none" | "inline" | "both" | undefined;
@@ -70,7 +35,7 @@ export declare const withDefaultGetters: (props: TabsProps) => {
     'aria-colindex'?: number | undefined;
     'aria-colspan'?: number | undefined;
     'aria-controls'?: string | undefined;
-    'aria-current'?: boolean | "true" | "false" | "page" | "step" | "location" | "date" | "time" | undefined;
+    'aria-current'?: boolean | "time" | "step" | "date" | "true" | "false" | "page" | "location" | undefined;
     'aria-describedby'?: string | undefined;
     'aria-details'?: string | undefined;
     'aria-disabled'?: (boolean | "true" | "false") | undefined;
@@ -79,7 +44,7 @@ export declare const withDefaultGetters: (props: TabsProps) => {
     'aria-expanded'?: (boolean | "true" | "false") | undefined;
     'aria-flowto'?: string | undefined;
     'aria-grabbed'?: (boolean | "true" | "false") | undefined;
-    'aria-haspopup'?: boolean | "true" | "false" | "dialog" | "grid" | "listbox" | "menu" | "tree" | undefined;
+    'aria-haspopup'?: boolean | "dialog" | "menu" | "grid" | "listbox" | "tree" | "true" | "false" | undefined;
     'aria-hidden'?: (boolean | "true" | "false") | undefined;
     'aria-invalid'?: boolean | "true" | "false" | "grammar" | "spelling" | undefined;
     'aria-keyshortcuts'?: string | undefined;
@@ -271,44 +236,20 @@ export declare const withDefaultGetters: (props: TabsProps) => {
     onAnimationIterationCapture?: React.AnimationEventHandler<HTMLDivElement> | undefined;
     onTransitionEnd?: React.TransitionEventHandler<HTMLDivElement> | undefined;
     onTransitionEndCapture?: React.TransitionEventHandler<HTMLDivElement> | undefined;
-    ref?: React.Ref<HTMLDivElement> | undefined;
-    key?: React.Key | null | undefined;
-} | {
-    getItemLabel: TabsPropGetItemLabel<TabsItemDefault>;
-    getItemIcon: TabsPropGetItemIcon<TabsItemDefault>;
-    size?: "m" | "s" | "xs" | undefined;
-    onlyIcon?: boolean | undefined;
-    view?: "clear" | "bordered" | undefined;
-    iconSize?: "m" | "s" | "xs" | "l" | undefined;
-    items: TabsItemDefault[];
-    value?: TabsItemDefault | null | undefined;
-    children?: undefined;
-    onChange: import("./types").TabsPropOnChange<TabsItemDefault>;
-    renderItem?: import("./types").RenderItem<TabsItemDefault> | undefined;
-    linePosition: "left" | "right";
-    fitMode?: undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
     suppressContentEditableWarning?: boolean | undefined;
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
-    className?: string | undefined;
-    contentEditable?: (boolean | "true" | "false") | "inherit" | undefined;
+    contentEditable?: "inherit" | (boolean | "true" | "false") | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;
     draggable?: (boolean | "true" | "false") | undefined;
     hidden?: boolean | undefined;
-    id?: string | undefined;
-    lang?: string | undefined;
     placeholder?: string | undefined;
-    slot?: string | undefined;
     spellCheck?: (boolean | "true" | "false") | undefined;
-    style?: React.CSSProperties | undefined;
-    tabIndex?: number | undefined;
-    title?: string | undefined;
-    translate?: "yes" | "no" | undefined;
+    translate?: "no" | "yes" | undefined;
     radioGroup?: string | undefined;
-    role?: React.AriaRole | undefined;
     about?: string | undefined;
     datatype?: string | undefined;
     inlist?: any;
@@ -320,7 +261,6 @@ export declare const withDefaultGetters: (props: TabsProps) => {
     autoCapitalize?: string | undefined;
     autoCorrect?: string | undefined;
     autoSave?: string | undefined;
-    color?: string | undefined;
     itemProp?: string | undefined;
     itemScope?: boolean | undefined;
     itemType?: string | undefined;
@@ -329,8 +269,33 @@ export declare const withDefaultGetters: (props: TabsProps) => {
     results?: number | undefined;
     security?: string | undefined;
     unselectable?: "on" | "off" | undefined;
-    inputMode?: "none" | "search" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
+    inputMode?: "text" | "email" | "search" | "tel" | "url" | "none" | "numeric" | "decimal" | undefined;
     is?: string | undefined;
+    ref?: React.Ref<HTMLDivElement> | undefined;
+    key?: React.Key | null | undefined;
+} | {
+    getItemLabel: TabsPropGetItemLabel<TabsItemDefault>;
+    getItemIcon: TabsPropGetItemIcon<TabsItemDefault>;
+    size?: "s" | "m" | "xs" | undefined;
+    onlyIcon?: boolean | undefined;
+    view?: "clear" | "bordered" | undefined;
+    iconSize?: "s" | "m" | "xs" | "l" | undefined;
+    items: TabsItemDefault[];
+    value?: TabsItemDefault | null | undefined;
+    children?: undefined;
+    onChange: import("./types").TabsPropOnChange<TabsItemDefault>;
+    renderItem?: import("./types").RenderItem<TabsItemDefault> | undefined;
+    linePosition: "left" | "right";
+    fitMode?: undefined;
+    slot?: string | undefined;
+    style?: React.CSSProperties | undefined;
+    title?: string | undefined;
+    className?: string | undefined;
+    color?: string | undefined;
+    id?: string | undefined;
+    lang?: string | undefined;
+    role?: React.AriaRole | undefined;
+    tabIndex?: number | undefined;
     'aria-activedescendant'?: string | undefined;
     'aria-atomic'?: (boolean | "true" | "false") | undefined;
     'aria-autocomplete'?: "list" | "none" | "inline" | "both" | undefined;
@@ -340,7 +305,7 @@ export declare const withDefaultGetters: (props: TabsProps) => {
     'aria-colindex'?: number | undefined;
     'aria-colspan'?: number | undefined;
     'aria-controls'?: string | undefined;
-    'aria-current'?: boolean | "true" | "false" | "page" | "step" | "location" | "date" | "time" | undefined;
+    'aria-current'?: boolean | "time" | "step" | "date" | "true" | "false" | "page" | "location" | undefined;
     'aria-describedby'?: string | undefined;
     'aria-details'?: string | undefined;
     'aria-disabled'?: (boolean | "true" | "false") | undefined;
@@ -349,7 +314,7 @@ export declare const withDefaultGetters: (props: TabsProps) => {
     'aria-expanded'?: (boolean | "true" | "false") | undefined;
     'aria-flowto'?: string | undefined;
     'aria-grabbed'?: (boolean | "true" | "false") | undefined;
-    'aria-haspopup'?: boolean | "true" | "false" | "dialog" | "grid" | "listbox" | "menu" | "tree" | undefined;
+    'aria-haspopup'?: boolean | "dialog" | "menu" | "grid" | "listbox" | "tree" | "true" | "false" | undefined;
     'aria-hidden'?: (boolean | "true" | "false") | undefined;
     'aria-invalid'?: boolean | "true" | "false" | "grammar" | "spelling" | undefined;
     'aria-keyshortcuts'?: string | undefined;
@@ -541,6 +506,41 @@ export declare const withDefaultGetters: (props: TabsProps) => {
     onAnimationIterationCapture?: React.AnimationEventHandler<HTMLDivElement> | undefined;
     onTransitionEnd?: React.TransitionEventHandler<HTMLDivElement> | undefined;
     onTransitionEndCapture?: React.TransitionEventHandler<HTMLDivElement> | undefined;
+    defaultChecked?: boolean | undefined;
+    defaultValue?: string | number | readonly string[] | undefined;
+    suppressContentEditableWarning?: boolean | undefined;
+    suppressHydrationWarning?: boolean | undefined;
+    accessKey?: string | undefined;
+    contentEditable?: "inherit" | (boolean | "true" | "false") | undefined;
+    contextMenu?: string | undefined;
+    dir?: string | undefined;
+    draggable?: (boolean | "true" | "false") | undefined;
+    hidden?: boolean | undefined;
+    placeholder?: string | undefined;
+    spellCheck?: (boolean | "true" | "false") | undefined;
+    translate?: "no" | "yes" | undefined;
+    radioGroup?: string | undefined;
+    about?: string | undefined;
+    datatype?: string | undefined;
+    inlist?: any;
+    prefix?: string | undefined;
+    property?: string | undefined;
+    resource?: string | undefined;
+    typeof?: string | undefined;
+    vocab?: string | undefined;
+    autoCapitalize?: string | undefined;
+    autoCorrect?: string | undefined;
+    autoSave?: string | undefined;
+    itemProp?: string | undefined;
+    itemScope?: boolean | undefined;
+    itemType?: string | undefined;
+    itemID?: string | undefined;
+    itemRef?: string | undefined;
+    results?: number | undefined;
+    security?: string | undefined;
+    unselectable?: "on" | "off" | undefined;
+    inputMode?: "text" | "email" | "search" | "tel" | "url" | "none" | "numeric" | "decimal" | undefined;
+    is?: string | undefined;
     ref?: React.Ref<HTMLDivElement> | undefined;
     key?: React.Key | null | undefined;
 };

package/__internal__/src/components/Tabs/types.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
+import { IconComponent, IconPropSize } from '@consta/icons/Icon';
 import React from 'react';
-import { IconComponent, IconPropSize } from '../../icons/Icon/Icon';
 import { PropsWithHTMLAttributesAndRef } from '../../utils/types/PropsWithHTMLAttributes';
 export declare type TabDimensions = {
     size: number;

package/__internal__/src/components/Tabs/types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"types.js","names":["tabsSizes","tabsDefaultSize","tabsViews","tabsDefaultView","tabsLinePositions","tabsDefaultLinePosition","tabsFitModes","tabsDefaultFitMode"],"sources":["../../../../../src/components/Tabs/types.ts"],"sourcesContent":["import ~~React from 'react';\n\nimport~~ { IconComponent, IconPropSize } from '~~../../~~icons/Icon~~/Icon~~';\nimport { PropsWithHTMLAttributesAndRef } from '../../utils/types/PropsWithHTMLAttributes';\n\nexport type TabDimensions = {\n size: number;\n gap: number;\n};\n\nexport type TabsItemDefault = {\n label: string \| number;\n icon?: IconComponent;\n};\n\nexport const tabsSizes = ['m', 's', 'xs'] as const;\nexport type TabsPropSize = typeof tabsSizes[number];\nexport const tabsDefaultSize: TabsPropSize = tabsSizes[0];\n\nexport const tabsViews = ['bordered', 'clear'] as const;\nexport type TabsPropView = typeof tabsViews[number];\nexport const tabsDefaultView: TabsPropView = tabsViews[0];\n\nexport const tabsLinePositions = ['bottom', 'top', 'left', 'right'] as const;\nexport type TabsPropLinePosition = typeof tabsLinePositions[number];\nexport const tabsDefaultLinePosition: TabsPropLinePosition = 'bottom';\n\nexport const tabsFitModes = ['scroll', 'dropdown'] as const;\nexport type TabsPropFitMode = typeof tabsFitModes[number];\nexport const tabsDefaultFitMode: TabsPropFitMode = 'dropdown';\n\nexport type TabsPropGetItemLabel<ITEM> = (item: ITEM) => string \| number;\nexport type TabsPropGetItemChecked<ITEM> = (item: ITEM) => boolean \| undefined;\nexport type TabsPropGetItemIcon<ITEM> = (\n item: ITEM,\n) => IconComponent \| undefined;\n\nexport type TabsPropOnChange<ITEM> = (props: {\n e: React.MouseEvent;\n value: ITEM;\n}) => void;\n\nexport type RenderItemProps<ITEM> = {\n item: ITEM;\n onChange: React.MouseEventHandler;\n checked: boolean;\n label: string;\n icon?: IconComponent;\n size: TabsPropSize;\n iconSize?: IconPropSize;\n onlyIcon?: boolean;\n};\n\nexport type RenderItem<ITEM> = (\n props: RenderItemProps<ITEM>,\n) => React.ReactElement \| null;\n\nexport type TabsFitModeWrapperProps<ITEM> = {\n items: ITEM[];\n tabsDimensions: TabDimensions[];\n getItemLabel: TabsPropGetItemLabel<ITEM>;\n getItemChecked: TabsPropGetItemChecked<ITEM>;\n renderItem: (item: ITEM) => React.ReactNode;\n renderItemsList: RenderItemsListProp;\n tabRefs: Array<React.RefObject<HTMLElement>>;\n};\n\nexport type TabsProps<ITEM = TabsItemDefault> = PropsWithHTMLAttributesAndRef<\n {\n size?: TabsPropSize;\n onlyIcon?: boolean;\n view?: TabsPropView;\n iconSize?: IconPropSize;\n items: ITEM[];\n value?: ITEM \| null;\n getItemIcon?: TabsPropGetItemIcon<ITEM>;\n getItemLabel?: TabsPropGetItemLabel<ITEM>;\n children?: never;\n onChange: TabsPropOnChange<ITEM>;\n renderItem?: RenderItem<ITEM>;\n } & (\n \| {\n linePosition?: Extract<TabsPropLinePosition, 'bottom' \| 'top'>;\n fitMode?: 'dropdown' \| 'scroll';\n }\n \| {\n linePosition: Extract<TabsPropLinePosition, 'left' \| 'right'>;\n fitMode?: never;\n }\n ),\n HTMLDivElement\n> &\n (ITEM extends { label: TabsItemDefault['label'] }\n ? {}\n : {\n getItemLabel: TabsPropGetItemLabel<ITEM>;\n });\n\nexport type TabsComponent = <ITEM>(\n props: TabsProps<ITEM>,\n) => React.ReactElement \| null;\n\nexport type TabsTabProps = {\n size: TabsPropSize;\n onlyIcon?: boolean;\n icon?: IconComponent;\n iconSize?: IconPropSize;\n label: string;\n checked: boolean;\n onChange: React.MouseEventHandler<HTMLButtonElement>;\n className?: string;\n};\n\nexport type TabsMoreItemsProps<ITEM = TabsItemDefault> =\n PropsWithHTMLAttributesAndRef<\n {\n items: ITEM[];\n renderItem: (item: ITEM, onClick: () => void) => React.ReactNode;\n getItemLabel: TabsPropGetItemLabel<ITEM>;\n getItemChecked: TabsPropGetItemChecked<ITEM>;\n height: number;\n } & React.RefAttributes<HTMLDivElement>,\n HTMLDivElement\n >;\n\nexport type TabsMoreItemsComponent = <ITEM>(\n props: TabsMoreItemsProps<ITEM>,\n) => React.ReactElement \| null;\n\nexport type RenderItemsListProp = (props: {\n withRunningLine?: boolean;\n getTabClassName?: (idx: number) => string \| undefined;\n}) => React.ReactNode;\n\nexport type TabsDirection = 'horizontal' \| 'vertical';\n"],"mappings":"AAeA,MAAO,IAAMA,UAAS,CAAG,CAAC,GAAD,CAAM,GAAN,CAAW,IAAX,CAAlB,CAEP,MAAO,IAAMC,gBAA6B,CAAGD,SAAS,CAAC,CAAD,CAA/C,CAEP,MAAO,IAAME,UAAS,CAAG,CAAC,UAAD,CAAa,OAAb,CAAlB,CAEP,MAAO,IAAMC,gBAA6B,CAAGD,SAAS,CAAC,CAAD,CAA/C,CAEP,MAAO,IAAME,kBAAiB,CAAG,CAAC,QAAD,CAAW,KAAX,CAAkB,MAAlB,CAA0B,OAA1B,CAA1B,CAEP,MAAO,IAAMC,wBAA6C,CAAG,QAAtD,CAEP,MAAO,IAAMC,aAAY,CAAG,CAAC,QAAD,CAAW,UAAX,CAArB,CAEP,MAAO,IAAMC,mBAAmC,CAAG,UAA5C"}
1	+ {"version":3,"file":"types.js","names":["tabsSizes","tabsDefaultSize","tabsViews","tabsDefaultView","tabsLinePositions","tabsDefaultLinePosition","tabsFitModes","tabsDefaultFitMode"],"sources":["../../../../../src/components/Tabs/types.ts"],"sourcesContent":["import { IconComponent, IconPropSize } from '@consta/icons/Icon';\nimport React from 'react';\n\nimport { PropsWithHTMLAttributesAndRef } from '../../utils/types/PropsWithHTMLAttributes';\n\nexport type TabDimensions = {\n size: number;\n gap: number;\n};\n\nexport type TabsItemDefault = {\n label: string \| number;\n icon?: IconComponent;\n};\n\nexport const tabsSizes = ['m', 's', 'xs'] as const;\nexport type TabsPropSize = typeof tabsSizes[number];\nexport const tabsDefaultSize: TabsPropSize = tabsSizes[0];\n\nexport const tabsViews = ['bordered', 'clear'] as const;\nexport type TabsPropView = typeof tabsViews[number];\nexport const tabsDefaultView: TabsPropView = tabsViews[0];\n\nexport const tabsLinePositions = ['bottom', 'top', 'left', 'right'] as const;\nexport type TabsPropLinePosition = typeof tabsLinePositions[number];\nexport const tabsDefaultLinePosition: TabsPropLinePosition = 'bottom';\n\nexport const tabsFitModes = ['scroll', 'dropdown'] as const;\nexport type TabsPropFitMode = typeof tabsFitModes[number];\nexport const tabsDefaultFitMode: TabsPropFitMode = 'dropdown';\n\nexport type TabsPropGetItemLabel<ITEM> = (item: ITEM) => string \| number;\nexport type TabsPropGetItemChecked<ITEM> = (item: ITEM) => boolean \| undefined;\nexport type TabsPropGetItemIcon<ITEM> = (\n item: ITEM,\n) => IconComponent \| undefined;\n\nexport type TabsPropOnChange<ITEM> = (props: {\n e: React.MouseEvent;\n value: ITEM;\n}) => void;\n\nexport type RenderItemProps<ITEM> = {\n item: ITEM;\n onChange: React.MouseEventHandler;\n checked: boolean;\n label: string;\n icon?: IconComponent;\n size: TabsPropSize;\n iconSize?: IconPropSize;\n onlyIcon?: boolean;\n};\n\nexport type RenderItem<ITEM> = (\n props: RenderItemProps<ITEM>,\n) => React.ReactElement \| null;\n\nexport type TabsFitModeWrapperProps<ITEM> = {\n items: ITEM[];\n tabsDimensions: TabDimensions[];\n getItemLabel: TabsPropGetItemLabel<ITEM>;\n getItemChecked: TabsPropGetItemChecked<ITEM>;\n renderItem: (item: ITEM) => React.ReactNode;\n renderItemsList: RenderItemsListProp;\n tabRefs: Array<React.RefObject<HTMLElement>>;\n};\n\nexport type TabsProps<ITEM = TabsItemDefault> = PropsWithHTMLAttributesAndRef<\n {\n size?: TabsPropSize;\n onlyIcon?: boolean;\n view?: TabsPropView;\n iconSize?: IconPropSize;\n items: ITEM[];\n value?: ITEM \| null;\n getItemIcon?: TabsPropGetItemIcon<ITEM>;\n getItemLabel?: TabsPropGetItemLabel<ITEM>;\n children?: never;\n onChange: TabsPropOnChange<ITEM>;\n renderItem?: RenderItem<ITEM>;\n } & (\n \| {\n linePosition?: Extract<TabsPropLinePosition, 'bottom' \| 'top'>;\n fitMode?: 'dropdown' \| 'scroll';\n }\n \| {\n linePosition: Extract<TabsPropLinePosition, 'left' \| 'right'>;\n fitMode?: never;\n }\n ),\n HTMLDivElement\n> &\n (ITEM extends { label: TabsItemDefault['label'] }\n ? {}\n : {\n getItemLabel: TabsPropGetItemLabel<ITEM>;\n });\n\nexport type TabsComponent = <ITEM>(\n props: TabsProps<ITEM>,\n) => React.ReactElement \| null;\n\nexport type TabsTabProps = {\n size: TabsPropSize;\n onlyIcon?: boolean;\n icon?: IconComponent;\n iconSize?: IconPropSize;\n label: string;\n checked: boolean;\n onChange: React.MouseEventHandler<HTMLButtonElement>;\n className?: string;\n};\n\nexport type TabsMoreItemsProps<ITEM = TabsItemDefault> =\n PropsWithHTMLAttributesAndRef<\n {\n items: ITEM[];\n renderItem: (item: ITEM, onClick: () => void) => React.ReactNode;\n getItemLabel: TabsPropGetItemLabel<ITEM>;\n getItemChecked: TabsPropGetItemChecked<ITEM>;\n height: number;\n } & React.RefAttributes<HTMLDivElement>,\n HTMLDivElement\n >;\n\nexport type TabsMoreItemsComponent = <ITEM>(\n props: TabsMoreItemsProps<ITEM>,\n) => React.ReactElement \| null;\n\nexport type RenderItemsListProp = (props: {\n withRunningLine?: boolean;\n getTabClassName?: (idx: number) => string \| undefined;\n}) => React.ReactNode;\n\nexport type TabsDirection = 'horizontal' \| 'vertical';\n"],"mappings":"AAeA,MAAO,IAAMA,UAAS,CAAG,CAAC,GAAD,CAAM,GAAN,CAAW,IAAX,CAAlB,CAEP,MAAO,IAAMC,gBAA6B,CAAGD,SAAS,CAAC,CAAD,CAA/C,CAEP,MAAO,IAAME,UAAS,CAAG,CAAC,UAAD,CAAa,OAAb,CAAlB,CAEP,MAAO,IAAMC,gBAA6B,CAAGD,SAAS,CAAC,CAAD,CAA/C,CAEP,MAAO,IAAME,kBAAiB,CAAG,CAAC,QAAD,CAAW,KAAX,CAAkB,MAAlB,CAA0B,OAA1B,CAA1B,CAEP,MAAO,IAAMC,wBAA6C,CAAG,QAAtD,CAEP,MAAO,IAAMC,aAAY,CAAG,CAAC,QAAD,CAAW,UAAX,CAArB,CAEP,MAAO,IAAMC,mBAAmC,CAAG,UAA5C"}

package/__internal__/src/components/TabsDeprecated/FitModeScrollWrapper/TabsFitModeScrollWrapper.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import"./TabsFitModeScrollWrapper.css";import React from"react";import{useResizeObserved}from"../../../hooks/useResizeObserved/useResizeObserved";import{useScrollPosition}from"../../../hooks/useScrollPosition/useScrollPosition";import{IconArrowLeft}from"../../../icons/IconArrowLeft/IconArrowLeft";import{IconArrowRight}from"../../../icons/IconArrowRight/IconArrowRight";import{cn}from"../../../utils/bem";import{Button}from"../../Button/Button";import{getTabsWidth}from"../helpers";import{getVisibleTabsRange}from"./helpers";var cnTabsFitModeScrollWrapper=cn("TabsFitModeScrollWrapper");export var TabsFitModeScrollWrapper=function(a){var b=a.tabsDimensions,c=a.items,d=a.renderItemsList,e=a.getChecked,f=React.useRef(null),g=useResizeObserved(React.useMemo(function(){return[f]},[f]),function(a){var b;return{isScrollable:a&&a.scrollWidth>a.offsetWidth,width:null!==(b=null===a||void 0===a?void 0:a.offsetWidth)&&void 0!==b?b:0,paddingLeft:a?parseInt(getComputedStyle(a).paddingLeft,10):0}}),h=_slicedToArray(g,1),i=h[0],j=i.isScrollable,k=i.width,l=i.paddingLeft,m=useScrollPosition(f.current),n=m.scrollLeft,o=getVisibleTabsRange({tabsDimensions:b,containerWidth:k,containerPaddingLeft:l,scrollLeft:n}),p=_slicedToArray(o,2),q=p[0],r=p[1],s=function(a){if(!(a>=q&&a<=r)){var c,d=getTabsWidth(b.slice(0,a));null===(c=f.current)||void 0===c?void 0:c.scrollTo({left:d,behavior:"smooth"})}},t=function(){s(q-1)},u=function(){s(r+1)},v=c.findIndex(e);return React.useEffect(function(){j&&s(v)},[v,j]),React.createElement("div",{className:cnTabsFitModeScrollWrapper()},j&&React.createElement(React.Fragment,null,["prev","next"].map(function(a){return React.createElement(Button,{key:a,view:"clear",size:"xs",onlyIcon:!0,disabled:"prev"===a?0===q:r===c.length-1,iconLeft:"prev"===a?IconArrowLeft:IconArrowRight,className:cnTabsFitModeScrollWrapper("Button",{to:a}),onClick:"prev"===a?t:u})})),React.createElement("div",{className:cnTabsFitModeScrollWrapper("Content"),ref:f},d({getTabClassName:function getTabClassName(a){return cnTabsFitModeScrollWrapper("Tab",{noMargin:a===c.length-1})}})))};
+import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import"./TabsFitModeScrollWrapper.css";import{IconArrowLeft}from"@consta/icons/IconArrowLeft";import{IconArrowRight}from"@consta/icons/IconArrowRight";import React from"react";import{useResizeObserved}from"../../../hooks/useResizeObserved/useResizeObserved";import{useScrollPosition}from"../../../hooks/useScrollPosition/useScrollPosition";import{cn}from"../../../utils/bem";import{Button}from"../../Button/Button";import{getTabsWidth}from"../helpers";import{getVisibleTabsRange}from"./helpers";var cnTabsFitModeScrollWrapper=cn("TabsFitModeScrollWrapper");export var TabsFitModeScrollWrapper=function(a){var b=a.tabsDimensions,c=a.items,d=a.renderItemsList,e=a.getChecked,f=React.useRef(null),g=useResizeObserved(React.useMemo(function(){return[f]},[f]),function(a){var b;return{isScrollable:a&&a.scrollWidth>a.offsetWidth,width:null!==(b=null===a||void 0===a?void 0:a.offsetWidth)&&void 0!==b?b:0,paddingLeft:a?parseInt(getComputedStyle(a).paddingLeft,10):0}}),h=_slicedToArray(g,1),i=h[0],j=i.isScrollable,k=i.width,l=i.paddingLeft,m=useScrollPosition(f.current),n=m.scrollLeft,o=getVisibleTabsRange({tabsDimensions:b,containerWidth:k,containerPaddingLeft:l,scrollLeft:n}),p=_slicedToArray(o,2),q=p[0],r=p[1],s=function(a){if(!(a>=q&&a<=r)){var c,d=getTabsWidth(b.slice(0,a));null===(c=f.current)||void 0===c?void 0:c.scrollTo({left:d,behavior:"smooth"})}},t=function(){s(q-1)},u=function(){s(r+1)},v=c.findIndex(e);return React.useEffect(function(){j&&s(v)},[v,j]),React.createElement("div",{className:cnTabsFitModeScrollWrapper()},j&&React.createElement(React.Fragment,null,["prev","next"].map(function(a){return React.createElement(Button,{key:a,view:"clear",size:"xs",onlyIcon:!0,disabled:"prev"===a?0===q:r===c.length-1,iconLeft:"prev"===a?IconArrowLeft:IconArrowRight,className:cnTabsFitModeScrollWrapper("Button",{to:a}),onClick:"prev"===a?t:u})})),React.createElement("div",{className:cnTabsFitModeScrollWrapper("Content"),ref:f},d({getTabClassName:function getTabClassName(a){return cnTabsFitModeScrollWrapper("Tab",{noMargin:a===c.length-1})}})))};
 //# sourceMappingURL=TabsFitModeScrollWrapper.js.map

package/__internal__/src/components/TabsDeprecated/FitModeScrollWrapper/TabsFitModeScrollWrapper.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TabsFitModeScrollWrapper.js","names":["~~React~~","~~useResizeObserved~~","~~useScrollPosition~~","~~IconArrowLeft~~","~~IconArrowRight~~","cn","Button","getTabsWidth","getVisibleTabsRange","cnTabsFitModeScrollWrapper","TabsFitModeScrollWrapper","tabsDimensions","items","renderItemsList","getChecked","scrollContainerRef","useRef","useMemo","el","isScrollable","scrollWidth","offsetWidth","width","paddingLeft","parseInt","getComputedStyle","containerWidth","containerPaddingLeft","current","scrollLeft","firstVisibleTabIdx","lastVisibleTabIdx","scrollTabIntoView","idx","previousTabsWidth","slice","scrollTo","left","behavior","scrollPrev","scrollNext","checkedTabIdx","findIndex","useEffect","map","buttonTo","length","to","getTabClassName","noMargin"],"sources":["../../../../../../src/components/TabsDeprecated/FitModeScrollWrapper/TabsFitModeScrollWrapper.tsx"],"sourcesContent":["import './TabsFitModeScrollWrapper.css';\n\nimport ~~React~~ from '~~react~~';\n\nimport { ~~useResizeObserved~~ } from '~~../../../hooks~~/~~useResizeObserved~~/~~useResizeObserved~~';\nimport { ~~useScrollPosition }~~ from '~~../../../hooks/useScrollPosition/useScrollPosition~~';\nimport { ~~IconArrowLeft~~ } from '../../../~~icons~~/~~IconArrowLeft~~/~~IconArrowLeft~~';\nimport { ~~IconArrowRight~~ } from '../../../~~icons~~/~~IconArrowRight~~/~~IconArrowRight~~';\nimport { cn } from '../../../utils/bem';\nimport { Button } from '../../Button/Button';\nimport { getTabsWidth, TabsFitModeWrapperProps } from '../helpers';\nimport { getVisibleTabsRange } from './helpers';\n\nconst cnTabsFitModeScrollWrapper = cn('TabsFitModeScrollWrapper');\n\nexport const TabsFitModeScrollWrapper = <ITEM,>({\n tabsDimensions,\n items,\n renderItemsList,\n getChecked,\n}: TabsFitModeWrapperProps<ITEM>): React.ReactElement \| null => {\n const scrollContainerRef = React.useRef<HTMLDivElement>(null);\n const [\n { isScrollable, width: containerWidth, paddingLeft: containerPaddingLeft },\n ] = useResizeObserved(\n React.useMemo(() => [scrollContainerRef], [scrollContainerRef]),\n (el) => ({\n isScrollable: el && el.scrollWidth > el.offsetWidth,\n width: el?.offsetWidth ?? 0,\n paddingLeft: el ? parseInt(getComputedStyle(el).paddingLeft, 10) : 0,\n }),\n );\n const { scrollLeft } = useScrollPosition(scrollContainerRef.current);\n\n const [firstVisibleTabIdx, lastVisibleTabIdx] = getVisibleTabsRange({\n tabsDimensions,\n containerWidth,\n containerPaddingLeft,\n scrollLeft,\n });\n\n const scrollTabIntoView = (idx: number) => {\n const tabIsVisible = idx >= firstVisibleTabIdx && idx <= lastVisibleTabIdx;\n\n if (!tabIsVisible) {\n const previousTabsWidth = getTabsWidth(tabsDimensions.slice(0, idx));\n scrollContainerRef.current?.scrollTo({\n left: previousTabsWidth,\n behavior: 'smooth',\n });\n }\n };\n\n const scrollPrev = () => {\n scrollTabIntoView(firstVisibleTabIdx - 1);\n };\n\n const scrollNext = () => {\n scrollTabIntoView(lastVisibleTabIdx + 1);\n };\n\n // Подскролливаем к выбранному табу\n const checkedTabIdx = items.findIndex(getChecked);\n React.useEffect(() => {\n if (isScrollable) {\n scrollTabIntoView(checkedTabIdx);\n }\n }, [checkedTabIdx, isScrollable]);\n\n return (\n <div className={cnTabsFitModeScrollWrapper()}>\n {isScrollable && (\n <>\n {(['prev', 'next'] as const).map((buttonTo) => (\n <Button\n key={buttonTo}\n view=\"clear\"\n size=\"xs\"\n onlyIcon\n disabled={\n buttonTo === 'prev'\n ? firstVisibleTabIdx === 0\n : lastVisibleTabIdx === items.length - 1\n }\n iconLeft={buttonTo === 'prev' ? IconArrowLeft : IconArrowRight}\n className={cnTabsFitModeScrollWrapper('Button', { to: buttonTo })}\n onClick={buttonTo === 'prev' ? scrollPrev : scrollNext}\n />\n ))}\n </>\n )}\n <div\n className={cnTabsFitModeScrollWrapper('Content')}\n ref={scrollContainerRef}\n >\n {renderItemsList({\n getTabClassName: (idx) =>\n cnTabsFitModeScrollWrapper('Tab', {\n noMargin: idx === items.length - 1,\n }),\n })}\n </div>\n </div>\n );\n};\n"],"mappings":"iEAAA,uCAEA,~~MAAOA~~,MAAP,KAAkB,OAAlB,CAEA,OAASC,iBAAT,0DACA,OAASC,iBAAT,0DACA,OAASC,~~aAAT,kDACA,OAASC,cAAT,oDACA,OAASC,~~EAAT,0BACA,OAASC,MAAT,2BACA,OAASC,YAAT,kBACA,OAASC,mBAAT,iBAEA,GAAMC,2BAA0B,CAAGJ,EAAE,CAAC,0BAAD,CAArC,CAEA,MAAO,IAAMK,yBAAwB,CAAG,WAKwB,IAJ9DC,EAI8D,GAJ9DA,cAI8D,CAH9DC,CAG8D,GAH9DA,KAG8D,CAF9DC,CAE8D,GAF9DA,eAE8D,CAD9DC,CAC8D,GAD9DA,UAC8D,CACxDC,CAAkB,~~CAAGf~~,KAAK,~~CAACgB~~,MAAN,CAA6B,IAA7B,CADmC,~~GAI1Df~~,iBAAiB,CACnBD,KAAK,~~CAACiB~~,OAAN,CAAc,iBAAM,CAACF,CAAD,CAAN,CAAd,CAA0C,CAACA,CAAD,CAA1C,CADmB,CAEnB,SAACG,CAAD,cAAS,CACPC,YAAY,CAAED,CAAE,EAAIA,CAAE,CAACE,WAAH,CAAiBF,CAAE,CAACG,WADjC,CAEPC,KAAK,kBAAEJ,CAAF,WAAEA,CAAF,QAAEA,CAAE,CAAEG,WAAN,gBAAqB,CAFnB,CAGPE,WAAW,CAAEL,CAAE,CAAGM,QAAQ,CAACC,gBAAgB,CAACP,CAAD,CAAhB,CAAqBK,WAAtB,CAAmC,EAAnC,CAAX,CAAoD,CAH5D,CAAT,CAFmB,CAJyC,8BAG1DJ,CAH0D,GAG1DA,YAH0D,CAGrCO,CAHqC,GAG5CJ,KAH4C,CAGRK,CAHQ,GAGrBJ,WAHqB,~~GAYvCrB~~,iBAAiB,~~CAACa~~,CAAkB,CAACa,OAApB,CAZsB,CAYtDC,CAZsD,GAYtDA,UAZsD,GAcdrB,mBAAmB,CAAC,CAClEG,cAAc,CAAdA,CADkE,CAElEe,cAAc,CAAdA,CAFkE,CAGlEC,oBAAoB,CAApBA,CAHkE,CAIlEE,UAAU,CAAVA,CAJkE,CAAD,CAdL,uBAcvDC,CAduD,MAcnCC,CAdmC,MAqBxDC,CAAiB,CAAG,SAACC,CAAD,CAAiB,CAGzC,GAAI,EAFiBA,CAAG,EAAIH,CAAP,EAA6BG,CAAG,EAAIF,CAErD,CAAJ,CAAmB,OACXG,CAAiB,CAAG3B,YAAY,CAACI,CAAc,CAACwB,KAAf,CAAqB,CAArB,CAAwBF,CAAxB,CAAD,CADrB,WAEjBlB,CAAkB,CAACa,OAFF,qBAEjB,EAA4BQ,QAA5B,CAAqC,CACnCC,IAAI,CAAEH,CAD6B,CAEnCI,QAAQ,CAAE,QAFyB,CAArC,CAID,CACF,CA/B6D,CAiCxDC,CAAU,CAAG,UAAM,CACvBP,CAAiB,CAACF,CAAkB,CAAG,CAAtB,CAClB,CAnC6D,CAqCxDU,CAAU,CAAG,UAAM,CACvBR,CAAiB,CAACD,CAAiB,CAAG,CAArB,CAClB,CAvC6D,CA0CxDU,CAAa,CAAG7B,CAAK,CAAC8B,SAAN,CAAgB5B,CAAhB,CA1CwC,CAiD9D,~~MANAd~~,MAAK,~~CAAC2C~~,SAAN,CAAgB,UAAM,CAChBxB,CADgB,EAElBa,CAAiB,CAACS,CAAD,CAEpB,CAJD,CAIG,CAACA,CAAD,CAAgBtB,CAAhB,CAJH,CAMA,CACE,2BAAK,SAAS,CAAEV,0BAA0B,EAA1C,EACGU,CAAY,EACX,wCACI,CAAC,MAAD,CAAS,MAAT,CAAD,CAA4ByB,GAA5B,CAAgC,SAACC,CAAD,QAC/B,qBAAC,MAAD,EACE,GAAG,CAAEA,CADP,CAEE,IAAI,CAAC,OAFP,CAGE,IAAI,CAAC,IAHP,CAIE,QAAQ,GAJV,CAKE,QAAQ,CACO,MAAb,GAAAA,CAAQ,CACmB,CAAvB,GAAAf,CADI,CAEJC,CAAiB,GAAKnB,CAAK,CAACkC,MAAN,CAAe,CAR7C,CAUE,QAAQ,CAAe,MAAb,GAAAD,CAAQ,~~CAAc1C~~,aAAd,CAA8BC,cAVlD,CAWE,SAAS,~~CAAEK~~,0BAA0B,CAAC,QAAD,CAAW,CAAEsC,EAAE,CAAEF,CAAN,CAAX,CAXvC,CAYE,OAAO,CAAe,MAAb,GAAAA,CAAQ,CAAcN,CAAd,CAA2BC,CAZ9C,EAD+B,CAAhC,CADH,CAFJ,CAqBE,2BACE,SAAS,CAAE/B,0BAA0B,CAAC,SAAD,CADvC,CAEE,GAAG,CAAEM,CAFP,EAIGF,CAAe,CAAC,CACfmC,eAAe,CAAE,yBAACf,CAAD,QACfxB,2BAA0B,CAAC,KAAD,CAAQ,CAChCwC,QAAQ,CAAEhB,CAAG,GAAKrB,CAAK,CAACkC,MAAN,CAAe,CADD,CAAR,CADX,CADF,CAAD,CAJlB,CArBF,CAkCH,CAzFM"}
1	+ {"version":3,"file":"TabsFitModeScrollWrapper.js","names":["IconArrowLeft","IconArrowRight","React","useResizeObserved","useScrollPosition","cn","Button","getTabsWidth","getVisibleTabsRange","cnTabsFitModeScrollWrapper","TabsFitModeScrollWrapper","tabsDimensions","items","renderItemsList","getChecked","scrollContainerRef","useRef","useMemo","el","isScrollable","scrollWidth","offsetWidth","width","paddingLeft","parseInt","getComputedStyle","containerWidth","containerPaddingLeft","current","scrollLeft","firstVisibleTabIdx","lastVisibleTabIdx","scrollTabIntoView","idx","previousTabsWidth","slice","scrollTo","left","behavior","scrollPrev","scrollNext","checkedTabIdx","findIndex","useEffect","map","buttonTo","length","to","getTabClassName","noMargin"],"sources":["../../../../../../src/components/TabsDeprecated/FitModeScrollWrapper/TabsFitModeScrollWrapper.tsx"],"sourcesContent":["import './TabsFitModeScrollWrapper.css';\n\nimport { IconArrowLeft } from '@consta/icons/IconArrowLeft';\nimport { IconArrowRight } from '@consta/icons/IconArrowRight';\nimport React from 'react';\n\nimport { useResizeObserved } from '../../../hooks/useResizeObserved/useResizeObserved';\nimport { useScrollPosition } from '../../../hooks/useScrollPosition/useScrollPosition';\nimport { cn } from '../../../utils/bem';\nimport { Button } from '../../Button/Button';\nimport { getTabsWidth, TabsFitModeWrapperProps } from '../helpers';\nimport { getVisibleTabsRange } from './helpers';\n\nconst cnTabsFitModeScrollWrapper = cn('TabsFitModeScrollWrapper');\n\nexport const TabsFitModeScrollWrapper = <ITEM,>({\n tabsDimensions,\n items,\n renderItemsList,\n getChecked,\n}: TabsFitModeWrapperProps<ITEM>): React.ReactElement \| null => {\n const scrollContainerRef = React.useRef<HTMLDivElement>(null);\n const [\n { isScrollable, width: containerWidth, paddingLeft: containerPaddingLeft },\n ] = useResizeObserved(\n React.useMemo(() => [scrollContainerRef], [scrollContainerRef]),\n (el) => ({\n isScrollable: el && el.scrollWidth > el.offsetWidth,\n width: el?.offsetWidth ?? 0,\n paddingLeft: el ? parseInt(getComputedStyle(el).paddingLeft, 10) : 0,\n }),\n );\n const { scrollLeft } = useScrollPosition(scrollContainerRef.current);\n\n const [firstVisibleTabIdx, lastVisibleTabIdx] = getVisibleTabsRange({\n tabsDimensions,\n containerWidth,\n containerPaddingLeft,\n scrollLeft,\n });\n\n const scrollTabIntoView = (idx: number) => {\n const tabIsVisible = idx >= firstVisibleTabIdx && idx <= lastVisibleTabIdx;\n\n if (!tabIsVisible) {\n const previousTabsWidth = getTabsWidth(tabsDimensions.slice(0, idx));\n scrollContainerRef.current?.scrollTo({\n left: previousTabsWidth,\n behavior: 'smooth',\n });\n }\n };\n\n const scrollPrev = () => {\n scrollTabIntoView(firstVisibleTabIdx - 1);\n };\n\n const scrollNext = () => {\n scrollTabIntoView(lastVisibleTabIdx + 1);\n };\n\n // Подскролливаем к выбранному табу\n const checkedTabIdx = items.findIndex(getChecked);\n React.useEffect(() => {\n if (isScrollable) {\n scrollTabIntoView(checkedTabIdx);\n }\n }, [checkedTabIdx, isScrollable]);\n\n return (\n <div className={cnTabsFitModeScrollWrapper()}>\n {isScrollable && (\n <>\n {(['prev', 'next'] as const).map((buttonTo) => (\n <Button\n key={buttonTo}\n view=\"clear\"\n size=\"xs\"\n onlyIcon\n disabled={\n buttonTo === 'prev'\n ? firstVisibleTabIdx === 0\n : lastVisibleTabIdx === items.length - 1\n }\n iconLeft={buttonTo === 'prev' ? IconArrowLeft : IconArrowRight}\n className={cnTabsFitModeScrollWrapper('Button', { to: buttonTo })}\n onClick={buttonTo === 'prev' ? scrollPrev : scrollNext}\n />\n ))}\n </>\n )}\n <div\n className={cnTabsFitModeScrollWrapper('Content')}\n ref={scrollContainerRef}\n >\n {renderItemsList({\n getTabClassName: (idx) =>\n cnTabsFitModeScrollWrapper('Tab', {\n noMargin: idx === items.length - 1,\n }),\n })}\n </div>\n </div>\n );\n};\n"],"mappings":"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"}

package/__internal__/src/components/TabsDeprecated/MoreItems/TabsMoreItems.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import"./TabsMoreItems.css";import FocusTrap from"focus-trap-react";import React,{useEffect,useRef,useState}from"react";import{Transition}from"react-transition-group";import{useFlag}from"../../../hooks/useFlag/useFlag";import{useForkRef}from"../../../hooks/useForkRef/useForkRef";import{IconMeatball}from"../../../icons/IconMeatball/IconMeatball";import{animateTimeout,cnMixPopoverAnimate}from"../../../mixs/MixPopoverAnimate/MixPopoverAnimate";import{cn}from"../../../utils/bem";import{Button}from"../../Button/Button";import{Popover}from"../../Popover/Popover";var cnTabsMoreItems=cn("TabsMoreItems");export var TabsMoreItems=React.forwardRef(function(a,b){var c=a.items,d=a.renderItem,e=a.getLabel,f=a.getChecked,g=a.height,h=useFlag(!1),i=_slicedToArray(h,2),j=i[0],k=i[1],l=k.off,m=k.toogle,n=useRef(null),o=useRef(null),p=useState("downStartLeft"),q=_slicedToArray(p,2),r=q[0],s=q[1];return useEffect(function(){0===c.length&&l()},[c]),React.createElement(React.Fragment,null,React.createElement("div",{ref:useForkRef([b,n]),className:cnTabsMoreItems("Button"),style:{height:g}},React.createElement(Button,{size:"xs",view:"ghost",onlyIcon:!0,iconLeft:IconMeatball,onClick:m})),React.createElement(Transition,{in:j,unmountOnExit:!0,nodeRef:o,timeout:animateTimeout},function(a){var b;return React.createElement(Popover,{anchorRef:n,offset:-1,ref:o,direction:"downStartRight",spareDirection:"downStartLeft",className:cnTabsMoreItems("Popover",[cnMixPopoverAnimate({animate:a,direction:r})]),onSetDirection:s,possibleDirections:["downStartRight","downStartLeft","upStartRight","upStartLeft","downCenter","upCenter"]},React.createElement(FocusTrap,{focusTrapOptions:{fallbackFocus:null!==(b=n.current)&&void 0!==b?b:void 0,clickOutsideDeactivates:function clickOutsideDeactivates(a){var b,c=null===(b=n.current)||void 0===b?void 0:b.contains(a.target);return!c},allowOutsideClick:!0,onDeactivate:l}},React.createElement("div",{className:cnTabsMoreItems("Content")},c.map(function(a){return React.createElement("div",{key:e(a),className:cnTabsMoreItems("Item",{active:f(a)})},d(a,l))}))))}))});
+import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import"./TabsMoreItems.css";import{IconMeatball}from"@consta/icons/IconMeatball";import FocusTrap from"focus-trap-react";import React,{useEffect,useRef,useState}from"react";import{Transition}from"react-transition-group";import{useFlag}from"../../../hooks/useFlag/useFlag";import{useForkRef}from"../../../hooks/useForkRef/useForkRef";import{animateTimeout,cnMixPopoverAnimate}from"../../../mixs/MixPopoverAnimate/MixPopoverAnimate";import{cn}from"../../../utils/bem";import{Button}from"../../Button/Button";import{Popover}from"../../Popover/Popover";var cnTabsMoreItems=cn("TabsMoreItems");export var TabsMoreItems=React.forwardRef(function(a,b){var c=a.items,d=a.renderItem,e=a.getLabel,f=a.getChecked,g=a.height,h=useFlag(!1),i=_slicedToArray(h,2),j=i[0],k=i[1],l=k.off,m=k.toggle,n=useRef(null),o=useRef(null),p=useState("downStartLeft"),q=_slicedToArray(p,2),r=q[0],s=q[1];return useEffect(function(){0===c.length&&l()},[c]),React.createElement(React.Fragment,null,React.createElement("div",{ref:useForkRef([b,n]),className:cnTabsMoreItems("Button"),style:{height:g}},React.createElement(Button,{size:"xs",view:"ghost",onlyIcon:!0,iconLeft:IconMeatball,onClick:m})),React.createElement(Transition,{in:j,unmountOnExit:!0,nodeRef:o,timeout:animateTimeout},function(a){var b;return React.createElement(Popover,{anchorRef:n,offset:-1,ref:o,direction:"downStartRight",spareDirection:"downStartLeft",className:cnTabsMoreItems("Popover",[cnMixPopoverAnimate({animate:a,direction:r})]),onSetDirection:s,possibleDirections:["downStartRight","downStartLeft","upStartRight","upStartLeft","downCenter","upCenter"]},React.createElement(FocusTrap,{focusTrapOptions:{fallbackFocus:null!==(b=n.current)&&void 0!==b?b:void 0,clickOutsideDeactivates:function clickOutsideDeactivates(a){var b,c=null===(b=n.current)||void 0===b?void 0:b.contains(a.target);return!c},allowOutsideClick:!0,onDeactivate:l}},React.createElement("div",{className:cnTabsMoreItems("Content")},c.map(function(a){return React.createElement("div",{key:e(a),className:cnTabsMoreItems("Item",{active:f(a)})},d(a,l))}))))}))});
 //# sourceMappingURL=TabsMoreItems.js.map

package/__internal__/src/components/TabsDeprecated/MoreItems/TabsMoreItems.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TabsMoreItems.js","names":["FocusTrap","React","useEffect","useRef","useState","Transition","useFlag","useForkRef","~~IconMeatball","~~animateTimeout","cnMixPopoverAnimate","cn","Button","Popover","cnTabsMoreItems","TabsMoreItems","forwardRef","ref","items","renderItem","getLabel","getChecked","height","isOpen","off","~~toogle~~","buttonRef","popoverRef","direction","setDirection","length","animate","fallbackFocus","current","clickOutsideDeactivates","e","isClickInsideButton","contains","target","allowOutsideClick","onDeactivate","map","item","active"],"sources":["../../../../../../src/components/TabsDeprecated/MoreItems/TabsMoreItems.tsx"],"sourcesContent":["import './TabsMoreItems.css';\n\nimport FocusTrap from 'focus-trap-react';\nimport React, { useEffect, useRef, useState } from 'react';\nimport { Transition } from 'react-transition-group';\n\nimport { useFlag } from '../../../hooks/useFlag/useFlag';\nimport { useForkRef } from '../../../hooks/useForkRef/useForkRef';\nimport { ~~IconMeatball } from '../../../icons/IconMeatball/IconMeatball';\nimport {~~\n animateTimeout,\n cnMixPopoverAnimate,\n} from '../../../mixs/MixPopoverAnimate/MixPopoverAnimate';\nimport { cn } from '../../../utils/bem';\nimport { Button } from '../../Button/Button';\nimport { Direction, Popover } from '../../Popover/Popover';\nimport { TabsPropGetLabel } from '../TabsDeprecated';\n\nconst cnTabsMoreItems = cn('TabsMoreItems');\n\ntype TabsMoreItems = <ITEM>(\n props: {\n items: ITEM[];\n renderItem: (item: ITEM, onClick: () => void) => React.ReactNode;\n getLabel: TabsPropGetLabel<ITEM>;\n getChecked: (item: ITEM) => boolean;\n height: number;\n } & React.RefAttributes<HTMLDivElement>,\n ref: React.Ref<HTMLDivElement>,\n) => React.ReactElement \| null;\n\nexport const TabsMoreItems: TabsMoreItems = React.forwardRef(\n ({ items, renderItem, getLabel, getChecked, height }, ref) => {\n const [isOpen, { off, ~~toogle~~ }] = useFlag(false);\n const buttonRef = useRef<HTMLDivElement>(null);\n const popoverRef = useRef<HTMLDivElement>(null);\n const [direction, setDirection] = useState<Direction>('downStartLeft');\n\n useEffect(() => {\n items.length === 0 && off();\n }, [items]);\n\n return (\n <>\n <div\n ref={useForkRef([ref, buttonRef])}\n className={cnTabsMoreItems('Button')}\n style={{ height }}\n >\n <Button\n size=\"xs\"\n view=\"ghost\"\n onlyIcon\n iconLeft={IconMeatball}\n onClick={~~toogle~~}\n />\n </div>\n <Transition\n in={isOpen}\n unmountOnExit\n nodeRef={popoverRef}\n timeout={animateTimeout}\n >\n {(animate) => (\n <Popover\n anchorRef={buttonRef}\n offset={-1}\n ref={popoverRef}\n direction=\"downStartRight\"\n spareDirection=\"downStartLeft\"\n className={cnTabsMoreItems('Popover', [\n cnMixPopoverAnimate({ animate, direction }),\n ])}\n onSetDirection={setDirection}\n possibleDirections={[\n 'downStartRight',\n 'downStartLeft',\n 'upStartRight',\n 'upStartLeft',\n 'downCenter',\n 'upCenter',\n ]}\n >\n <FocusTrap\n focusTrapOptions={{\n fallbackFocus: buttonRef.current ?? undefined,\n clickOutsideDeactivates: (e) => {\n const isClickInsideButton = buttonRef.current?.contains(\n e.target as Node,\n );\n return !isClickInsideButton;\n },\n allowOutsideClick: true,\n onDeactivate: off,\n }}\n >\n <div className={cnTabsMoreItems('Content')}>\n {items.map((item) => (\n <div\n key={getLabel(item)}\n className={cnTabsMoreItems('Item', {\n active: getChecked(item),\n })}\n >\n {renderItem(item, off)}\n </div>\n ))}\n </div>\n </FocusTrap>\n </Popover>\n )}\n </Transition>\n </>\n );\n },\n);\n"],"mappings":"iEAAA,4BAEA,~~MAAOA~~,UAAP,KAAsB,kBAAtB,CACA,MAAOC,MAAP,EAAgBC,SAAhB,CAA2BC,MAA3B,CAAmCC,QAAnC,KAAmD,OAAnD,CACA,OAASC,UAAT,KAA2B,wBAA3B,CAEA,OAASC,OAAT,sCACA,OAASC,UAAT,4CACA,~~OAASC,YAAT,gDACA,~~OACEC,cADF,CAEEC,mBAFF,yDAIA,OAASC,EAAT,0BACA,OAASC,MAAT,2BACA,OAAoBC,OAApB,6BAGA,GAAMC,gBAAe,CAAGH,EAAE,CAAC,eAAD,CAA1B,CAaA,MAAO,IAAMI,cAA4B,~~CAAGd~~,KAAK,~~CAACe~~,UAAN,CAC1C,WAAsDC,CAAtD,CAA8D,IAA3DC,EAA2D,GAA3DA,KAA2D,CAApDC,CAAoD,GAApDA,UAAoD,CAAxCC,CAAwC,GAAxCA,QAAwC,CAA9BC,CAA8B,GAA9BA,UAA8B,CAAlBC,CAAkB,GAAlBA,MAAkB,~~GAC1BhB~~,OAAO,IADmB,~~uBACrDiB~~,CADqD,aAC3CC,CAD2C,GAC3CA,GAD2C,CACtCC,CADsC,GACtCA,MADsC,CAEtDC,CAAS,~~CAAGvB~~,MAAM,CAAiB,IAAjB,CAFoC,~~CAGtDwB~~,CAAU,~~CAAGxB~~,MAAM,CAAiB,IAAjB,CAHmC,GAI1BC,QAAQ,CAAY,eAAZ,CAJkB,~~uBAIrDwB~~,CAJqD,MAI1CC,CAJ0C,MAU5D,~~MAJA3B~~,UAAS,CAAC,UAAM,CACG,CAAjB,~~GAAAgB~~,CAAK,CAACY,MAAN,EAAsBN,CAAG,EAC1B,CAFQ,CAEN,CAACN,CAAD,CAFM,CAIT,CACE,wCACE,2BACE,GAAG,~~CAAEX~~,UAAU,CAAC,~~CAACU~~,CAAD,CAAMS,CAAN,CAAD,CADjB,CAEE,SAAS,CAAEZ,eAAe,CAAC,QAAD,CAF5B,CAGE,KAAK,CAAE,CAAEQ,MAAM,CAANA,CAAF,CAHT,EAKE,oBAAC,MAAD,EACE,IAAI,CAAC,IADP,CAEE,IAAI,CAAC,OAFP,CAGE,QAAQ,GAHV,CAIE,QAAQ,~~CAAEd~~,YAJZ,CAKE,OAAO,~~CAAEiB~~,CALX,EALF,CADF,CAcE,oBAAC,UAAD,EACE,GAAIF,CADN,CAEE,aAAa,GAFf,CAGE,OAAO,CAAEI,CAHX,CAIE,OAAO,CAAElB,cAJX,EAMG,SAACsB,CAAD,cACC,qBAAC,OAAD,EACE,SAAS,CAAEL,CADb,CAEE,MAAM,CAAE,CAAC,CAFX,CAGE,GAAG,CAAEC,CAHP,CAIE,SAAS,CAAC,gBAJZ,CAKE,cAAc,CAAC,eALjB,CAME,SAAS,CAAEb,eAAe,CAAC,SAAD,CAAY,CACpCJ,mBAAmB,CAAC,CAAEqB,OAAO,CAAPA,CAAF,CAAWH,SAAS,CAATA,CAAX,CAAD,CADiB,CAAZ,CAN5B,CASE,cAAc,CAAEC,CATlB,CAUE,kBAAkB,CAAE,CAClB,gBADkB,CAElB,eAFkB,CAGlB,cAHkB,CAIlB,aAJkB,CAKlB,YALkB,CAMlB,UANkB,CAVtB,EAmBE,oBAAC,SAAD,EACE,gBAAgB,CAAE,CAChBG,aAAa,WAAEN,CAAS,CAACO,OAAZ,sBADG,CAEhBC,uBAAuB,CAAE,iCAACC,CAAD,CAAO,OACxBC,CAAmB,WAAGV,CAAS,CAACO,OAAb,qBAAG,EAAmBI,QAAnB,CAC1BF,CAAC,CAACG,MADwB,CADE,CAI9B,MAAO,CAACF,CACT,CAPe,CAQhBG,iBAAiB,GARD,CAShBC,YAAY,CAAEhB,CATE,CADpB,EAaE,2BAAK,SAAS,CAAEV,eAAe,CAAC,SAAD,CAA/B,EACGI,CAAK,CAACuB,GAAN,CAAU,SAACC,CAAD,QACT,4BACE,GAAG,CAAEtB,CAAQ,CAACsB,CAAD,CADf,CAEE,SAAS,CAAE5B,eAAe,CAAC,MAAD,CAAS,CACjC6B,MAAM,CAAEtB,CAAU,CAACqB,CAAD,CADe,CAAT,CAF5B,EAMGvB,CAAU,CAACuB,CAAD,CAAOlB,CAAP,CANb,CADS,CAAV,CADH,CAbF,CAnBF,CADD,CANH,CAdF,CAuEH,CAnFyC,CAArC"}
1	+ {"version":3,"file":"TabsMoreItems.js","names":["IconMeatball","FocusTrap","React","useEffect","useRef","useState","Transition","useFlag","useForkRef","animateTimeout","cnMixPopoverAnimate","cn","Button","Popover","cnTabsMoreItems","TabsMoreItems","forwardRef","ref","items","renderItem","getLabel","getChecked","height","isOpen","off","toggle","buttonRef","popoverRef","direction","setDirection","length","animate","fallbackFocus","current","clickOutsideDeactivates","e","isClickInsideButton","contains","target","allowOutsideClick","onDeactivate","map","item","active"],"sources":["../../../../../../src/components/TabsDeprecated/MoreItems/TabsMoreItems.tsx"],"sourcesContent":["import './TabsMoreItems.css';\n\nimport { IconMeatball } from '@consta/icons/IconMeatball';\nimport FocusTrap from 'focus-trap-react';\nimport React, { useEffect, useRef, useState } from 'react';\nimport { Transition } from 'react-transition-group';\n\nimport { useFlag } from '../../../hooks/useFlag/useFlag';\nimport { useForkRef } from '../../../hooks/useForkRef/useForkRef';\nimport {\n animateTimeout,\n cnMixPopoverAnimate,\n} from '../../../mixs/MixPopoverAnimate/MixPopoverAnimate';\nimport { cn } from '../../../utils/bem';\nimport { Button } from '../../Button/Button';\nimport { Direction, Popover } from '../../Popover/Popover';\nimport { TabsPropGetLabel } from '../TabsDeprecated';\n\nconst cnTabsMoreItems = cn('TabsMoreItems');\n\ntype TabsMoreItems = <ITEM>(\n props: {\n items: ITEM[];\n renderItem: (item: ITEM, onClick: () => void) => React.ReactNode;\n getLabel: TabsPropGetLabel<ITEM>;\n getChecked: (item: ITEM) => boolean;\n height: number;\n } & React.RefAttributes<HTMLDivElement>,\n ref: React.Ref<HTMLDivElement>,\n) => React.ReactElement \| null;\n\nexport const TabsMoreItems: TabsMoreItems = React.forwardRef(\n ({ items, renderItem, getLabel, getChecked, height }, ref) => {\n const [isOpen, { off, toggle }] = useFlag(false);\n const buttonRef = useRef<HTMLDivElement>(null);\n const popoverRef = useRef<HTMLDivElement>(null);\n const [direction, setDirection] = useState<Direction>('downStartLeft');\n\n useEffect(() => {\n items.length === 0 && off();\n }, [items]);\n\n return (\n <>\n <div\n ref={useForkRef([ref, buttonRef])}\n className={cnTabsMoreItems('Button')}\n style={{ height }}\n >\n <Button\n size=\"xs\"\n view=\"ghost\"\n onlyIcon\n iconLeft={IconMeatball}\n onClick={toggle}\n />\n </div>\n <Transition\n in={isOpen}\n unmountOnExit\n nodeRef={popoverRef}\n timeout={animateTimeout}\n >\n {(animate) => (\n <Popover\n anchorRef={buttonRef}\n offset={-1}\n ref={popoverRef}\n direction=\"downStartRight\"\n spareDirection=\"downStartLeft\"\n className={cnTabsMoreItems('Popover', [\n cnMixPopoverAnimate({ animate, direction }),\n ])}\n onSetDirection={setDirection}\n possibleDirections={[\n 'downStartRight',\n 'downStartLeft',\n 'upStartRight',\n 'upStartLeft',\n 'downCenter',\n 'upCenter',\n ]}\n >\n <FocusTrap\n focusTrapOptions={{\n fallbackFocus: buttonRef.current ?? undefined,\n clickOutsideDeactivates: (e) => {\n const isClickInsideButton = buttonRef.current?.contains(\n e.target as Node,\n );\n return !isClickInsideButton;\n },\n allowOutsideClick: true,\n onDeactivate: off,\n }}\n >\n <div className={cnTabsMoreItems('Content')}>\n {items.map((item) => (\n <div\n key={getLabel(item)}\n className={cnTabsMoreItems('Item', {\n active: getChecked(item),\n })}\n >\n {renderItem(item, off)}\n </div>\n ))}\n </div>\n </FocusTrap>\n </Popover>\n )}\n </Transition>\n </>\n );\n },\n);\n"],"mappings":"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"}

package/__internal__/src/components/TabsDeprecated/Tab/TabsTab.d.ts CHANGED Viewed

@@ -1,6 +1,6 @@
 import './TabsTab.css';
+import { IconComponent, IconPropSize } from '@consta/icons/Icon';
 import React from 'react';
-import { IconComponent, IconPropSize } from '../../../icons/Icon/Icon';
 import { TabsPropSize } from '../TabsDeprecated';
 export declare const cnTabsTab: import("@bem-react/classname").ClassNameFormatter;
 declare type Props = {

package/__internal__/src/components/TabsDeprecated/Tab/TabsTab.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TabsTab.js","names":["React","forwardRef","cnMixFocus","cn","getByMap","cnTabsTab","sizeMap","s","m","xs","TabsTab","props","ref","label","onChange","checked","size","onlyIcon","Icon","icon","iconSizeProp","iconSize","className","before"],"sources":["../../../../../../src/components/TabsDeprecated/Tab/TabsTab.tsx"],"sourcesContent":["import './TabsTab.css';\n\nimport ~~React~~, { ~~forwardRef~~ } from '~~react~~';\n\nimport { ~~IconComponent,~~ ~~IconPropSize~~ } from '~~../../../icons/Icon/Icon~~';\nimport { cnMixFocus } from '../../../mixs/MixFocus/MixFocus';\nimport { cn } from '../../../utils/bem';\nimport { getByMap } from '../../../utils/getByMap';\nimport { TabsPropSize } from '../TabsDeprecated';\n\nexport const cnTabsTab = cn('TabsTab');\n\ntype Props = {\n size: TabsPropSize;\n onlyIcon?: boolean;\n icon?: IconComponent;\n iconSize?: IconPropSize;\n label: string;\n checked: boolean;\n onChange: React.MouseEventHandler<HTMLButtonElement>;\n className?: string;\n};\n\nconst sizeMap: Record<TabsPropSize, IconPropSize> = {\n s: 'xs',\n m: 's',\n xs: 'xs',\n};\n\nexport const TabsTab = forwardRef<HTMLButtonElement, Props>((props, ref) => {\n const {\n label,\n onChange,\n checked,\n size,\n onlyIcon,\n icon: Icon,\n iconSize: iconSizeProp,\n className,\n } = props;\n const iconSize = getByMap(sizeMap, size, iconSizeProp);\n\n return (\n <button\n className={cnTabsTab({ size, checked, onlyIcon }, [\n cnMixFocus({ before: true }),\n className,\n ])}\n onClick={checked ? undefined : onChange}\n ref={ref}\n role=\"tab\"\n type=\"button\"\n title={onlyIcon ? label : undefined}\n >\n {Icon && <Icon className={cnTabsTab('Icon')} size={iconSize} />}\n {!onlyIcon && label}\n </button>\n );\n});\n"],"mappings":"AAAA,~~sBAEA~~,MAAOA,MAAP,EAAgBC,UAAhB,KAAkC,OAAlC,~~CAGA~~,OAASC,UAAT,uCACA,OAASC,EAAT,0BACA,OAASC,QAAT,+BAGA,MAAO,IAAMC,UAAS,CAAGF,EAAE,CAAC,SAAD,CAApB,CAaP,GAAMG,QAA2C,CAAG,CAClDC,CAAC,CAAE,IAD+C,CAElDC,CAAC,CAAE,GAF+C,CAGlDC,EAAE,CAAE,IAH8C,CAApD,CAMA,MAAO,IAAMC,QAAO,CAAGT,UAAU,CAA2B,SAACU,CAAD,CAAQC,CAAR,CAAgB,IAExEC,EAFwE,CAUtEF,CAVsE,CAExEE,KAFwE,CAGxEC,CAHwE,CAUtEH,CAVsE,CAGxEG,QAHwE,CAIxEC,CAJwE,CAUtEJ,CAVsE,CAIxEI,OAJwE,CAKxEC,CALwE,CAUtEL,CAVsE,CAKxEK,IALwE,CAMxEC,CANwE,CAUtEN,CAVsE,CAMxEM,QANwE,CAOlEC,CAPkE,CAUtEP,CAVsE,CAOxEQ,IAPwE,CAQ9DC,CAR8D,CAUtET,CAVsE,CAQxEU,QARwE,CASxEC,CATwE,CAUtEX,CAVsE,CASxEW,SATwE,CAWpED,CAAQ,CAAGjB,QAAQ,CAACE,OAAD,CAAUU,CAAV,CAAgBI,CAAhB,CAXiD,CAa1E,MACE,+BACE,SAAS,CAAEf,SAAS,CAAC,CAAEW,IAAI,CAAJA,CAAF,CAAQD,OAAO,CAAPA,CAAR,CAAiBE,QAAQ,CAARA,CAAjB,CAAD,CAA8B,CAChDf,UAAU,CAAC,CAAEqB,MAAM,GAAR,CAAD,CADsC,CAEhDD,CAFgD,CAA9B,CADtB,CAKE,OAAO,CAAEP,CAAO,QAAeD,CALjC,CAME,GAAG,CAAEF,CANP,CAOE,IAAI,CAAC,KAPP,CAQE,IAAI,CAAC,QARP,CASE,KAAK,CAAEK,CAAQ,CAAGJ,CAAH,OATjB,EAWGK,CAAI,EAAI,oBAAC,CAAD,EAAM,SAAS,CAAEb,SAAS,CAAC,MAAD,CAA1B,CAAoC,IAAI,CAAEgB,CAA1C,EAXX,CAYG,CAACJ,CAAD,EAAaJ,CAZhB,CAeH,CA7BgC,CAA1B"}
1	+ {"version":3,"file":"TabsTab.js","names":["React","forwardRef","cnMixFocus","cn","getByMap","cnTabsTab","sizeMap","s","m","xs","TabsTab","props","ref","label","onChange","checked","size","onlyIcon","Icon","icon","iconSizeProp","iconSize","className","before"],"sources":["../../../../../../src/components/TabsDeprecated/Tab/TabsTab.tsx"],"sourcesContent":["import './TabsTab.css';\n\nimport { IconComponent, IconPropSize } from '@consta/icons/Icon';\nimport React, { forwardRef } from 'react';\n\nimport { cnMixFocus } from '../../../mixs/MixFocus/MixFocus';\nimport { cn } from '../../../utils/bem';\nimport { getByMap } from '../../../utils/getByMap';\nimport { TabsPropSize } from '../TabsDeprecated';\n\nexport const cnTabsTab = cn('TabsTab');\n\ntype Props = {\n size: TabsPropSize;\n onlyIcon?: boolean;\n icon?: IconComponent;\n iconSize?: IconPropSize;\n label: string;\n checked: boolean;\n onChange: React.MouseEventHandler<HTMLButtonElement>;\n className?: string;\n};\n\nconst sizeMap: Record<TabsPropSize, IconPropSize> = {\n s: 'xs',\n m: 's',\n xs: 'xs',\n};\n\nexport const TabsTab = forwardRef<HTMLButtonElement, Props>((props, ref) => {\n const {\n label,\n onChange,\n checked,\n size,\n onlyIcon,\n icon: Icon,\n iconSize: iconSizeProp,\n className,\n } = props;\n const iconSize = getByMap(sizeMap, size, iconSizeProp);\n\n return (\n <button\n className={cnTabsTab({ size, checked, onlyIcon }, [\n cnMixFocus({ before: true }),\n className,\n ])}\n onClick={checked ? undefined : onChange}\n ref={ref}\n role=\"tab\"\n type=\"button\"\n title={onlyIcon ? label : undefined}\n >\n {Icon && <Icon className={cnTabsTab('Icon')} size={iconSize} />}\n {!onlyIcon && label}\n </button>\n );\n});\n"],"mappings":"AAAA,sBAGA,MAAOA,MAAP,EAAgBC,UAAhB,KAAkC,OAAlC,CAEA,OAASC,UAAT,uCACA,OAASC,EAAT,0BACA,OAASC,QAAT,+BAGA,MAAO,IAAMC,UAAS,CAAGF,EAAE,CAAC,SAAD,CAApB,CAaP,GAAMG,QAA2C,CAAG,CAClDC,CAAC,CAAE,IAD+C,CAElDC,CAAC,CAAE,GAF+C,CAGlDC,EAAE,CAAE,IAH8C,CAApD,CAMA,MAAO,IAAMC,QAAO,CAAGT,UAAU,CAA2B,SAACU,CAAD,CAAQC,CAAR,CAAgB,IAExEC,EAFwE,CAUtEF,CAVsE,CAExEE,KAFwE,CAGxEC,CAHwE,CAUtEH,CAVsE,CAGxEG,QAHwE,CAIxEC,CAJwE,CAUtEJ,CAVsE,CAIxEI,OAJwE,CAKxEC,CALwE,CAUtEL,CAVsE,CAKxEK,IALwE,CAMxEC,CANwE,CAUtEN,CAVsE,CAMxEM,QANwE,CAOlEC,CAPkE,CAUtEP,CAVsE,CAOxEQ,IAPwE,CAQ9DC,CAR8D,CAUtET,CAVsE,CAQxEU,QARwE,CASxEC,CATwE,CAUtEX,CAVsE,CASxEW,SATwE,CAWpED,CAAQ,CAAGjB,QAAQ,CAACE,OAAD,CAAUU,CAAV,CAAgBI,CAAhB,CAXiD,CAa1E,MACE,+BACE,SAAS,CAAEf,SAAS,CAAC,CAAEW,IAAI,CAAJA,CAAF,CAAQD,OAAO,CAAPA,CAAR,CAAiBE,QAAQ,CAARA,CAAjB,CAAD,CAA8B,CAChDf,UAAU,CAAC,CAAEqB,MAAM,GAAR,CAAD,CADsC,CAEhDD,CAFgD,CAA9B,CADtB,CAKE,OAAO,CAAEP,CAAO,QAAeD,CALjC,CAME,GAAG,CAAEF,CANP,CAOE,IAAI,CAAC,KAPP,CAQE,IAAI,CAAC,QARP,CASE,KAAK,CAAEK,CAAQ,CAAGJ,CAAH,OATjB,EAWGK,CAAI,EAAI,oBAAC,CAAD,EAAM,SAAS,CAAEb,SAAS,CAAC,MAAD,CAA1B,CAAoC,IAAI,CAAEgB,CAA1C,EAXX,CAYG,CAACJ,CAAD,EAAaJ,CAZhB,CAeH,CA7BgC,CAA1B"}

package/__internal__/src/components/TabsDeprecated/TabsDeprecated.d.ts CHANGED Viewed

@@ -1,6 +1,6 @@
 import './Tabs.css';
+import { IconComponent, IconPropSize } from '@consta/icons/Icon';
 import React from 'react';
-import { IconComponent, IconPropSize } from '../../icons/Icon/Icon';
 import { PropsWithHTMLAttributesAndRef } from '../../utils/types/PropsWithHTMLAttributes';
 import { cnTabsTab, TabsTab } from './Tab/TabsTab';
 export declare const tabsSizes: readonly ["m", "s", "xs"];

package/__internal__/src/components/TabsDeprecated/TabsDeprecated.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TabsDeprecated.js","names":["React","createRef","useMemo","useChoiceGroup","useResizeObserved","cn","TabsFitModeDropdownWrapper","TabsFitModeScrollWrapper","getTabsDirection","TabsBorderLine","TabsRunningLine","cnTabsTab","TabsTab","tabsSizes","tabsDefaultSize","tabsViews","tabsDefaultView","tabsLinePositions","tabsDefaultLinePosition","tabsFitModes","tabsDefaultFitMode","cnTabs","renderItemDefault","props","onChange","otherProps","Tabs","forwardRef","ref","size","className","items","view","value","linePosition","fitMode","onlyIcon","getIcon","getLabel","iconSize","renderItem","renderItemProp","getKey","callBack","multiple","getOnChange","getChecked","tabsDirection","isVertical","tabRefs","Array","length","fill","map","tabsDimensions","el","gap","parseInt","getComputedStyle","activeTabIdx","findIndex","item","onClick","checked","label","toString","icon","Wrapper","getTabsWrapper","direction","renderItemsList","withRunningLine","getTabClassName","idx","OnlyListWrapper"],"sources":["../../../../../src/components/TabsDeprecated/TabsDeprecated.tsx"],"sourcesContent":["import './Tabs.css';\n\nimport React, { createRef, useMemo } from 'react';\n\nimport { useChoiceGroup } from '../../hooks/useChoiceGroup/useChoiceGroup';\nimport { useResizeObserved } from '../../hooks/useResizeObserved/useResizeObserved';\nimport { IconComponent, IconPropSize } from '../../icons/Icon/Icon';\nimport { cn } from '../../utils/bem';\nimport { PropsWithHTMLAttributesAndRef } from '../../utils/types/PropsWithHTMLAttributes';\nimport { TabsFitModeDropdownWrapper } from './FitModeDropdownWrapper/TabsFitModeDropdownWrapper';\nimport { TabsFitModeScrollWrapper } from './FitModeScrollWrapper/TabsFitModeScrollWrapper';\nimport {\n getTabsDirection,\n RenderItemsListProp,\n TabDimensions,\n TabsDirection,\n TabsFitModeWrapperProps,\n} from './helpers';\nimport { TabsBorderLine, TabsRunningLine } from './Line/TabsLine';\nimport { cnTabsTab, TabsTab } from './Tab/TabsTab';\n\nexport const tabsSizes = ['m', 's', 'xs'] as const;\nexport type TabsPropSize = typeof tabsSizes[number];\nexport const tabsDefaultSize: TabsPropSize = tabsSizes[0];\n\nexport const tabsViews = ['bordered', 'clear'] as const;\nexport type TabsPropView = typeof tabsViews[number];\nexport const tabsDefaultView: TabsPropView = tabsViews[0];\n\nexport const tabsLinePositions = ['bottom', 'top', 'left', 'right'] as const;\nexport type TabsPropLinePosition = typeof tabsLinePositions[number];\nexport const tabsDefaultLinePosition: TabsPropLinePosition = 'bottom';\n\nexport const tabsFitModes = ['scroll', 'dropdown'] as const;\nexport type TabsPropFitMode = typeof tabsFitModes[number];\nexport const tabsDefaultFitMode: TabsPropFitMode = 'dropdown';\n\nexport type TabsPropGetLabel<ITEM> = (item: ITEM) => string \| number;\nexport type TabsPropGetIcon<ITEM> = (item: ITEM) => IconComponent \| undefined;\nexport type TabsPropOnChange<ITEM, ITEM_ELEMENT> = (props: {\n e: React.MouseEvent<ITEM_ELEMENT>;\n value: ITEM;\n}) => void;\n\ntype RenderItemProps<ITEM, ELEMENT extends HTMLElement> = {\n item: ITEM;\n onChange: React.MouseEventHandler<ELEMENT>;\n checked: boolean;\n label: string;\n icon?: IconComponent;\n size: TabsPropSize;\n iconSize?: IconPropSize;\n onlyIcon?: boolean;\n};\n\ntype RenderItem<ITEM, ELEMENT extends HTMLElement> = (\n props: RenderItemProps<ITEM, ELEMENT>,\n) => React.ReactElement \| null;\n\nexport type TabsProps<\n ITEM,\n ITEM_ELEMENT extends HTMLElement = HTMLButtonElement,\n> = PropsWithHTMLAttributesAndRef<\n {\n size?: TabsPropSize;\n onlyIcon?: boolean;\n view?: TabsPropView;\n iconSize?: IconPropSize;\n items: ITEM[];\n value?: ITEM \| null;\n getIcon?: TabsPropGetIcon<ITEM>;\n getLabel: TabsPropGetLabel<ITEM>;\n children?: never;\n onChange: TabsPropOnChange<ITEM, ITEM_ELEMENT>;\n renderItem?: RenderItem<ITEM, ITEM_ELEMENT>;\n } & (\n \| {\n linePosition?: Extract<TabsPropLinePosition, 'bottom' \| 'top'>;\n fitMode?: 'dropdown' \| 'scroll';\n }\n \| {\n linePosition: Extract<TabsPropLinePosition, 'left' \| 'right'>;\n fitMode?: never;\n }\n ),\n HTMLDivElement\n>;\n\ntype Tabs = <ITEM, ITEMELEMENT extends HTMLElement = HTMLButtonElement>(\n props: TabsProps<ITEM, ITEMELEMENT>,\n ref: React.Ref<HTMLDivElement>,\n) => React.ReactElement \| null;\n\nexport const cnTabs = cn('Tabs');\n\nfunction renderItemDefault<ITEM, ITEMELEMENT extends HTMLElement>(\n props: RenderItemProps<ITEM, ITEMELEMENT>,\n): React.ReactElement {\n const { onChange, ...otherProps } = props;\n return (\n <TabsTab\n {...otherProps}\n onChange={\n onChange as unknown as React.MouseEventHandler<HTMLButtonElement>\n }\n />\n );\n}\n\nexport const Tabs: Tabs = React.forwardRef((props, ref) => {\n const {\n size = tabsDefaultSize,\n className,\n items,\n view = tabsDefaultView,\n value,\n linePosition = tabsDefaultLinePosition,\n fitMode = tabsDefaultFitMode,\n onlyIcon,\n getIcon,\n getLabel,\n onChange,\n iconSize,\n renderItem: renderItemProp = renderItemDefault,\n ...otherProps\n } = props;\n\n const { getOnChange, getChecked } = useChoiceGroup({\n value: value \|\| null,\n getKey: getLabel,\n callBack: onChange,\n multiple: false,\n });\n\n const tabsDirection = getTabsDirection(linePosition);\n const isVertical = tabsDirection === 'vertical';\n const tabRefs = useMemo(\n () =>\n new Array(items.length).fill(null).map(() => createRef<HTMLDivElement>()),\n [items, fitMode, isVertical],\n );\n const tabsDimensions = useResizeObserved(\n tabRefs,\n (el): TabDimensions => ({\n size: el?.[isVertical ? 'offsetHeight' : 'offsetWidth'] ?? 0,\n gap: el\n ? parseInt(\n getComputedStyle(el)[isVertical ? 'marginBottom' : 'marginRight'],\n 10,\n )\n : 0,\n }),\n );\n\n const activeTabIdx = items.findIndex((item) => getChecked(item));\n\n const renderItem = (item: typeof items[number], onClick?: () => void) =>\n renderItemProp({\n item,\n onChange: (...args) => {\n onClick?.();\n getOnChange(item)(...args);\n },\n checked: getChecked(item),\n label: getLabel(item).toString(),\n icon: getIcon && getIcon(item),\n onlyIcon,\n size,\n iconSize,\n });\n\n const renderItemsList: RenderItemsListProp = ({\n withRunningLine = true,\n getTabClassName,\n }) => (\n <div className={cnTabs('List', { direction: tabsDirection, linePosition })}>\n {items.map((item, idx) => (\n <div\n ref={tabRefs[idx]}\n key={getLabel(item)}\n className={cnTabs('Tab', { direction: tabsDirection }, [\n getTabClassName?.(idx),\n ])}\n >\n {renderItem(item)}\n </div>\n ))}\n {withRunningLine && (\n <TabsRunningLine\n linePosition={linePosition}\n tabsDimensions={tabsDimensions}\n activeTabIdx={activeTabIdx}\n />\n )}\n </div>\n );\n\n const Wrapper = getTabsWrapper(tabsDirection, fitMode);\n\n return (\n <div\n className={cnTabs({ size, view, direction: tabsDirection }, [className])}\n ref={ref}\n {...otherProps}\n >\n <Wrapper\n tabRefs={tabRefs}\n tabsDimensions={tabsDimensions}\n renderItem={renderItem}\n renderItemsList={renderItemsList}\n getLabel={getLabel}\n getChecked={getChecked}\n items={items}\n />\n {view === 'bordered' && <TabsBorderLine linePosition={linePosition} />}\n </div>\n );\n});\n\nconst getTabsWrapper = (\n tabsDirection: TabsDirection,\n fitMode: TabsPropFitMode,\n) => {\n if (tabsDirection === 'vertical') {\n return OnlyListWrapper;\n }\n\n return fitMode === 'scroll'\n ? TabsFitModeScrollWrapper\n : TabsFitModeDropdownWrapper;\n};\n\nconst OnlyListWrapper = <ITEM,>({\n renderItemsList,\n}: TabsFitModeWrapperProps<ITEM>): React.ReactElement \| null => (\n <>{renderItemsList({})}</>\n);\n\nexport { TabsTab, cnTabsTab };\n"],"mappings":"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"}
1	+ {"version":3,"file":"TabsDeprecated.js","names":["React","createRef","useMemo","useChoiceGroup","useResizeObserved","cn","TabsFitModeDropdownWrapper","TabsFitModeScrollWrapper","getTabsDirection","TabsBorderLine","TabsRunningLine","cnTabsTab","TabsTab","tabsSizes","tabsDefaultSize","tabsViews","tabsDefaultView","tabsLinePositions","tabsDefaultLinePosition","tabsFitModes","tabsDefaultFitMode","cnTabs","renderItemDefault","props","onChange","otherProps","Tabs","forwardRef","ref","size","className","items","view","value","linePosition","fitMode","onlyIcon","getIcon","getLabel","iconSize","renderItem","renderItemProp","getKey","callBack","multiple","getOnChange","getChecked","tabsDirection","isVertical","tabRefs","Array","length","fill","map","tabsDimensions","el","gap","parseInt","getComputedStyle","activeTabIdx","findIndex","item","onClick","checked","label","toString","icon","Wrapper","getTabsWrapper","direction","renderItemsList","withRunningLine","getTabClassName","idx","OnlyListWrapper"],"sources":["../../../../../src/components/TabsDeprecated/TabsDeprecated.tsx"],"sourcesContent":["import './Tabs.css';\n\nimport { IconComponent, IconPropSize } from '@consta/icons/Icon';\nimport React, { createRef, useMemo } from 'react';\n\nimport { useChoiceGroup } from '../../hooks/useChoiceGroup/useChoiceGroup';\nimport { useResizeObserved } from '../../hooks/useResizeObserved/useResizeObserved';\nimport { cn } from '../../utils/bem';\nimport { PropsWithHTMLAttributesAndRef } from '../../utils/types/PropsWithHTMLAttributes';\nimport { TabsFitModeDropdownWrapper } from './FitModeDropdownWrapper/TabsFitModeDropdownWrapper';\nimport { TabsFitModeScrollWrapper } from './FitModeScrollWrapper/TabsFitModeScrollWrapper';\nimport {\n getTabsDirection,\n RenderItemsListProp,\n TabDimensions,\n TabsDirection,\n TabsFitModeWrapperProps,\n} from './helpers';\nimport { TabsBorderLine, TabsRunningLine } from './Line/TabsLine';\nimport { cnTabsTab, TabsTab } from './Tab/TabsTab';\n\nexport const tabsSizes = ['m', 's', 'xs'] as const;\nexport type TabsPropSize = typeof tabsSizes[number];\nexport const tabsDefaultSize: TabsPropSize = tabsSizes[0];\n\nexport const tabsViews = ['bordered', 'clear'] as const;\nexport type TabsPropView = typeof tabsViews[number];\nexport const tabsDefaultView: TabsPropView = tabsViews[0];\n\nexport const tabsLinePositions = ['bottom', 'top', 'left', 'right'] as const;\nexport type TabsPropLinePosition = typeof tabsLinePositions[number];\nexport const tabsDefaultLinePosition: TabsPropLinePosition = 'bottom';\n\nexport const tabsFitModes = ['scroll', 'dropdown'] as const;\nexport type TabsPropFitMode = typeof tabsFitModes[number];\nexport const tabsDefaultFitMode: TabsPropFitMode = 'dropdown';\n\nexport type TabsPropGetLabel<ITEM> = (item: ITEM) => string \| number;\nexport type TabsPropGetIcon<ITEM> = (item: ITEM) => IconComponent \| undefined;\nexport type TabsPropOnChange<ITEM, ITEM_ELEMENT> = (props: {\n e: React.MouseEvent<ITEM_ELEMENT>;\n value: ITEM;\n}) => void;\n\ntype RenderItemProps<ITEM, ELEMENT extends HTMLElement> = {\n item: ITEM;\n onChange: React.MouseEventHandler<ELEMENT>;\n checked: boolean;\n label: string;\n icon?: IconComponent;\n size: TabsPropSize;\n iconSize?: IconPropSize;\n onlyIcon?: boolean;\n};\n\ntype RenderItem<ITEM, ELEMENT extends HTMLElement> = (\n props: RenderItemProps<ITEM, ELEMENT>,\n) => React.ReactElement \| null;\n\nexport type TabsProps<\n ITEM,\n ITEM_ELEMENT extends HTMLElement = HTMLButtonElement,\n> = PropsWithHTMLAttributesAndRef<\n {\n size?: TabsPropSize;\n onlyIcon?: boolean;\n view?: TabsPropView;\n iconSize?: IconPropSize;\n items: ITEM[];\n value?: ITEM \| null;\n getIcon?: TabsPropGetIcon<ITEM>;\n getLabel: TabsPropGetLabel<ITEM>;\n children?: never;\n onChange: TabsPropOnChange<ITEM, ITEM_ELEMENT>;\n renderItem?: RenderItem<ITEM, ITEM_ELEMENT>;\n } & (\n \| {\n linePosition?: Extract<TabsPropLinePosition, 'bottom' \| 'top'>;\n fitMode?: 'dropdown' \| 'scroll';\n }\n \| {\n linePosition: Extract<TabsPropLinePosition, 'left' \| 'right'>;\n fitMode?: never;\n }\n ),\n HTMLDivElement\n>;\n\ntype Tabs = <ITEM, ITEMELEMENT extends HTMLElement = HTMLButtonElement>(\n props: TabsProps<ITEM, ITEMELEMENT>,\n ref: React.Ref<HTMLDivElement>,\n) => React.ReactElement \| null;\n\nexport const cnTabs = cn('Tabs');\n\nfunction renderItemDefault<ITEM, ITEMELEMENT extends HTMLElement>(\n props: RenderItemProps<ITEM, ITEMELEMENT>,\n): React.ReactElement {\n const { onChange, ...otherProps } = props;\n return (\n <TabsTab\n {...otherProps}\n onChange={\n onChange as unknown as React.MouseEventHandler<HTMLButtonElement>\n }\n />\n );\n}\n\nexport const Tabs: Tabs = React.forwardRef((props, ref) => {\n const {\n size = tabsDefaultSize,\n className,\n items,\n view = tabsDefaultView,\n value,\n linePosition = tabsDefaultLinePosition,\n fitMode = tabsDefaultFitMode,\n onlyIcon,\n getIcon,\n getLabel,\n onChange,\n iconSize,\n renderItem: renderItemProp = renderItemDefault,\n ...otherProps\n } = props;\n\n const { getOnChange, getChecked } = useChoiceGroup({\n value: value \|\| null,\n getKey: getLabel,\n callBack: onChange,\n multiple: false,\n });\n\n const tabsDirection = getTabsDirection(linePosition);\n const isVertical = tabsDirection === 'vertical';\n const tabRefs = useMemo(\n () =>\n new Array(items.length).fill(null).map(() => createRef<HTMLDivElement>()),\n [items, fitMode, isVertical],\n );\n const tabsDimensions = useResizeObserved(\n tabRefs,\n (el): TabDimensions => ({\n size: el?.[isVertical ? 'offsetHeight' : 'offsetWidth'] ?? 0,\n gap: el\n ? parseInt(\n getComputedStyle(el)[isVertical ? 'marginBottom' : 'marginRight'],\n 10,\n )\n : 0,\n }),\n );\n\n const activeTabIdx = items.findIndex((item) => getChecked(item));\n\n const renderItem = (item: typeof items[number], onClick?: () => void) =>\n renderItemProp({\n item,\n onChange: (...args) => {\n onClick?.();\n getOnChange(item)(...args);\n },\n checked: getChecked(item),\n label: getLabel(item).toString(),\n icon: getIcon && getIcon(item),\n onlyIcon,\n size,\n iconSize,\n });\n\n const renderItemsList: RenderItemsListProp = ({\n withRunningLine = true,\n getTabClassName,\n }) => (\n <div className={cnTabs('List', { direction: tabsDirection, linePosition })}>\n {items.map((item, idx) => (\n <div\n ref={tabRefs[idx]}\n key={getLabel(item)}\n className={cnTabs('Tab', { direction: tabsDirection }, [\n getTabClassName?.(idx),\n ])}\n >\n {renderItem(item)}\n </div>\n ))}\n {withRunningLine && (\n <TabsRunningLine\n linePosition={linePosition}\n tabsDimensions={tabsDimensions}\n activeTabIdx={activeTabIdx}\n />\n )}\n </div>\n );\n\n const Wrapper = getTabsWrapper(tabsDirection, fitMode);\n\n return (\n <div\n className={cnTabs({ size, view, direction: tabsDirection }, [className])}\n ref={ref}\n {...otherProps}\n >\n <Wrapper\n tabRefs={tabRefs}\n tabsDimensions={tabsDimensions}\n renderItem={renderItem}\n renderItemsList={renderItemsList}\n getLabel={getLabel}\n getChecked={getChecked}\n items={items}\n />\n {view === 'bordered' && <TabsBorderLine linePosition={linePosition} />}\n </div>\n );\n});\n\nconst getTabsWrapper = (\n tabsDirection: TabsDirection,\n fitMode: TabsPropFitMode,\n) => {\n if (tabsDirection === 'vertical') {\n return OnlyListWrapper;\n }\n\n return fitMode === 'scroll'\n ? TabsFitModeScrollWrapper\n : TabsFitModeDropdownWrapper;\n};\n\nconst OnlyListWrapper = <ITEM,>({\n renderItemsList,\n}: TabsFitModeWrapperProps<ITEM>): React.ReactElement \| null => (\n <>{renderItemsList({})}</>\n);\n\nexport { TabsTab, cnTabsTab };\n"],"mappings":"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"}

package/__internal__/src/components/Tag/Tag.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
+import { IconComponent, IconProps } from '@consta/icons/Icon';
 import React from 'react';
-import { IconComponent, IconProps } from '../../icons/Icon/Icon';
 import { TagBase } from '../TagBase/TagBase';
 declare type TagBaseProps = React.ComponentProps<typeof TagBase>;
 export declare const tagPropMode: readonly ["button", "check", "cancel", "link", "info"];

package/__internal__/src/components/Tag/Tag.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Tag.js","names":["React","forwardRef","useRef","useForkRef","usePropsHandler","TagBase","tagPropMode","tagPropModeDefault","getParams","mode","checked","onClick","onChange","onCancel","view","as","withAction","e","COMPONENT_NAME","TagRenter","props","ref","tagRef","otherProps","params","Tag"],"sources":["../../../../../src/components/Tag/Tag.tsx"],"sourcesContent":["import React, { forwardRef, useRef } from 'react';\n\nimport { useForkRef } from '../../hooks/useForkRef/useForkRef';\nimport { ~~IconComponent, IconProps } from '../../icons/Icon/Icon';\nimport {~~ usePropsHandler } from '../EventInterceptor/usePropsHandler';\nimport { TagBase } from '../TagBase/TagBase';\n\ntype TagBaseProps = React.ComponentProps<typeof TagBase>;\n\nexport const tagPropMode = [\n 'button',\n 'check',\n 'cancel',\n 'link',\n 'info',\n] as const;\nexport const tagPropModeDefault = tagPropMode[0];\ntype TagPropMode = typeof tagPropMode[number];\n\ntype CommonProps = {\n size?: TagBaseProps['size'];\n label: TagBaseProps['label'];\n group?: TagBaseProps['group'];\n icon?: IconComponent;\n iconSize?: IconProps['size'];\n children?: never;\n};\n\ntype PropsWithModeButton = CommonProps & {\n mode?: 'button';\n onClick: React.MouseEventHandler<HTMLButtonElement>;\n checked?: never;\n onChange?: never;\n onCancel?: never;\n};\n\ntype PropsWithModeLink = CommonProps & {\n mode: 'link';\n checked?: never;\n onChange?: never;\n onCancel?: never;\n};\n\ntype PropsWithModeCheck = CommonProps & {\n mode: 'check';\n onChange: ({\n e,\n checked,\n }: {\n e?: React.MouseEvent;\n checked: boolean;\n }) => void;\n checked: boolean;\n onClick?: never;\n onCancel?: never;\n};\n\ntype PropsWithModeCancel = CommonProps & {\n mode: 'cancel';\n onCancel: React.MouseEventHandler<HTMLButtonElement>;\n onClick?: never;\n onChange?: never;\n checked?: never;\n};\n\ntype PropsWithModeInfo = CommonProps & {\n mode: 'info';\n onCancel?: never;\n onClick?: never;\n onChange?: never;\n checked?: never;\n};\n\ntype Props<ROLE extends TagPropMode = 'button'> = ROLE extends 'button'\n ? PropsWithModeButton &\n Omit<JSX.IntrinsicElements['button'], keyof PropsWithModeButton>\n : {} & ROLE extends 'check'\n ? PropsWithModeCheck &\n Omit<JSX.IntrinsicElements['button'], keyof PropsWithModeCheck>\n : {} & ROLE extends 'cancel'\n ? PropsWithModeCancel &\n Omit<JSX.IntrinsicElements['span'], keyof PropsWithModeCancel>\n : {} & ROLE extends 'link'\n ? PropsWithModeLink &\n Omit<JSX.IntrinsicElements['a'], keyof PropsWithModeLink>\n : {} & ROLE extends 'info'\n ? PropsWithModeInfo &\n Omit<JSX.IntrinsicElements['span'], keyof PropsWithModeInfo>\n : {};\n\ntype TagRender = <ROLE extends TagPropMode>(\n props: Props<ROLE>,\n ref: React.Ref<HTMLElement>,\n) => React.ReactElement \| null;\n\ntype TagComponent = <ROLE extends TagPropMode>(\n props: Props<ROLE> & React.RefAttributes<HTMLElement>,\n) => React.ReactElement \| null;\n\nexport function getParams(\n mode: TagPropMode,\n checked?: PropsWithModeCheck['checked'],\n onClick?: React.MouseEventHandler,\n onChange?: PropsWithModeCheck['onChange'],\n onCancel?: PropsWithModeCancel['onCancel'],\n): {\n view?: TagBaseProps['view'];\n onClick?: TagBaseProps['onClick'];\n onCancel?: TagBaseProps['onCancel'];\n withAction?: TagBaseProps['withAction'];\n as: keyof JSX.IntrinsicElements;\n} {\n switch (mode) {\n case 'button':\n return {\n view: 'filled',\n onClick,\n as: 'button',\n withAction: true,\n };\n case 'link':\n return {\n view: 'filled',\n onClick,\n as: 'a',\n withAction: true,\n };\n case 'check':\n return {\n view: checked ? 'filled' : 'stroked',\n onClick:\n typeof onChange === 'function'\n ? (e: React.MouseEvent) => onChange({ e, checked: !checked })\n : undefined,\n as: 'button',\n withAction: true,\n };\n case 'cancel':\n return {\n view: 'filled',\n onCancel,\n as: 'span',\n };\n case 'info':\n return {\n view: 'filled',\n as: 'span',\n };\n }\n}\n\nexport const COMPONENT_NAME = 'Tag' as const;\n\nconst TagRenter: TagRender = (props, ref) => {\n const tagRef = useRef<HTMLDivElement>(null);\n const {\n mode = tagPropModeDefault,\n onChange,\n checked,\n onCancel,\n onClick,\n ...otherProps\n } = usePropsHandler(COMPONENT_NAME, props, tagRef);\n const params = getParams(mode, checked, onClick, onChange, onCancel);\n\n return (\n <TagBase {...otherProps} {...params} ref={useForkRef([ref, tagRef])} />\n );\n};\n\nexport const Tag = forwardRef(TagRenter) as TagComponent;\n"],"mappings":"~~sJAAA~~,MAAOA,MAAP,EAAgBC,UAAhB,CAA4BC,MAA5B,KAA0C,OAA1C,CAEA,OAASC,UAAT,~~yCAEA~~,OAASC,eAAT,2CACA,OAASC,OAAT,0BAIA,MAAO,IAAMC,YAAW,CAAG,CACzB,QADyB,CAEzB,OAFyB,CAGzB,QAHyB,CAIzB,MAJyB,CAKzB,MALyB,CAApB,CAOP,MAAO,IAAMC,mBAAkB,CAAGD,WAAW,CAAC,CAAD,CAAtC,CAmFP,MAAO,SAASE,UAAT,CACLC,CADK,CAELC,CAFK,CAGLC,CAHK,CAILC,CAJK,CAKLC,CALK,CAYL,OAEO,QAFP,GACQJ,CADR,CAGW,CACLK,IAAI,CAAE,QADD,CAELH,OAAO,CAAPA,CAFK,CAGLI,EAAE,CAAE,QAHC,CAILC,UAAU,GAJL,CAHX,CASO,MATP,GACQP,CADR,CAUW,CACLK,IAAI,CAAE,QADD,CAELH,OAAO,CAAPA,CAFK,CAGLI,EAAE,CAAE,GAHC,CAILC,UAAU,GAJL,CAVX,CAgBO,OAhBP,GACQP,CADR,CAiBW,CACLK,IAAI,CAAEJ,CAAO,CAAG,QAAH,CAAc,SADtB,CAELC,OAAO,CACe,UAApB,QAAOC,EAAP,CACI,SAACK,CAAD,QAAyBL,EAAQ,CAAC,CAAEK,CAAC,CAADA,CAAF,CAAKP,OAAO,CAAE,CAACA,CAAf,CAAD,CAAjC,CADJ,OAHG,CAMLK,EAAE,CAAE,QANC,CAOLC,UAAU,GAPL,CAjBX,CA0BO,QA1BP,GACQP,CADR,CA2BW,CACLK,IAAI,CAAE,QADD,CAELD,QAAQ,CAARA,CAFK,CAGLE,EAAE,CAAE,MAHC,CA3BX,CAgCO,MAhCP,GACQN,CADR,CAiCW,CACLK,IAAI,CAAE,QADD,CAELC,EAAE,CAAE,MAFC,CAjCX,OAsCD,CAED,MAAO,IAAMG,eAAc,CAAG,KAAvB,CAEP,GAAMC,UAAoB,CAAG,SAACC,CAAD,CAAQC,CAAR,CAAgB,IACrCC,EAAM,CAAGpB,MAAM,CAAiB,IAAjB,CADsB,GASvCE,eAAe,CAACc,cAAD,CAAiBE,CAAjB,CAAwBE,CAAxB,CATwB,KAGzCb,IAHyC,CAGzCA,CAHyC,YAGlCF,kBAHkC,GAIzCK,CAJyC,GAIzCA,QAJyC,CAKzCF,CALyC,GAKzCA,OALyC,CAMzCG,CANyC,GAMzCA,QANyC,CAOzCF,CAPyC,GAOzCA,OAPyC,CAQtCY,CARsC,uCAUrCC,CAAM,CAAGhB,SAAS,CAACC,CAAD,CAAOC,CAAP,CAAgBC,CAAhB,CAAyBC,CAAzB,CAAmCC,CAAnC,CAVmB,CAY3C,MACE,qBAAC,OAAD,kBAAaU,CAAb,CAA6BC,CAA7B,EAAqC,GAAG,CAAErB,UAAU,CAAC,CAACkB,CAAD,CAAMC,CAAN,CAAD,CAApD,GAEH,CAfD,CAiBA,MAAO,IAAMG,IAAG,CAAGxB,UAAU,CAACkB,SAAD,CAAtB"}
1	+ {"version":3,"file":"Tag.js","names":["React","forwardRef","useRef","useForkRef","usePropsHandler","TagBase","tagPropMode","tagPropModeDefault","getParams","mode","checked","onClick","onChange","onCancel","view","as","withAction","e","COMPONENT_NAME","TagRenter","props","ref","tagRef","otherProps","params","Tag"],"sources":["../../../../../src/components/Tag/Tag.tsx"],"sourcesContent":["import { IconComponent, IconProps } from '@consta/icons/Icon';\nimport React, { forwardRef, useRef } from 'react';\n\nimport { useForkRef } from '../../hooks/useForkRef/useForkRef';\nimport { usePropsHandler } from '../EventInterceptor/usePropsHandler';\nimport { TagBase } from '../TagBase/TagBase';\n\ntype TagBaseProps = React.ComponentProps<typeof TagBase>;\n\nexport const tagPropMode = [\n 'button',\n 'check',\n 'cancel',\n 'link',\n 'info',\n] as const;\nexport const tagPropModeDefault = tagPropMode[0];\ntype TagPropMode = typeof tagPropMode[number];\n\ntype CommonProps = {\n size?: TagBaseProps['size'];\n label: TagBaseProps['label'];\n group?: TagBaseProps['group'];\n icon?: IconComponent;\n iconSize?: IconProps['size'];\n children?: never;\n};\n\ntype PropsWithModeButton = CommonProps & {\n mode?: 'button';\n onClick: React.MouseEventHandler<HTMLButtonElement>;\n checked?: never;\n onChange?: never;\n onCancel?: never;\n};\n\ntype PropsWithModeLink = CommonProps & {\n mode: 'link';\n checked?: never;\n onChange?: never;\n onCancel?: never;\n};\n\ntype PropsWithModeCheck = CommonProps & {\n mode: 'check';\n onChange: ({\n e,\n checked,\n }: {\n e?: React.MouseEvent;\n checked: boolean;\n }) => void;\n checked: boolean;\n onClick?: never;\n onCancel?: never;\n};\n\ntype PropsWithModeCancel = CommonProps & {\n mode: 'cancel';\n onCancel: React.MouseEventHandler<HTMLButtonElement>;\n onClick?: never;\n onChange?: never;\n checked?: never;\n};\n\ntype PropsWithModeInfo = CommonProps & {\n mode: 'info';\n onCancel?: never;\n onClick?: never;\n onChange?: never;\n checked?: never;\n};\n\ntype Props<ROLE extends TagPropMode = 'button'> = ROLE extends 'button'\n ? PropsWithModeButton &\n Omit<JSX.IntrinsicElements['button'], keyof PropsWithModeButton>\n : {} & ROLE extends 'check'\n ? PropsWithModeCheck &\n Omit<JSX.IntrinsicElements['button'], keyof PropsWithModeCheck>\n : {} & ROLE extends 'cancel'\n ? PropsWithModeCancel &\n Omit<JSX.IntrinsicElements['span'], keyof PropsWithModeCancel>\n : {} & ROLE extends 'link'\n ? PropsWithModeLink &\n Omit<JSX.IntrinsicElements['a'], keyof PropsWithModeLink>\n : {} & ROLE extends 'info'\n ? PropsWithModeInfo &\n Omit<JSX.IntrinsicElements['span'], keyof PropsWithModeInfo>\n : {};\n\ntype TagRender = <ROLE extends TagPropMode>(\n props: Props<ROLE>,\n ref: React.Ref<HTMLElement>,\n) => React.ReactElement \| null;\n\ntype TagComponent = <ROLE extends TagPropMode>(\n props: Props<ROLE> & React.RefAttributes<HTMLElement>,\n) => React.ReactElement \| null;\n\nexport function getParams(\n mode: TagPropMode,\n checked?: PropsWithModeCheck['checked'],\n onClick?: React.MouseEventHandler,\n onChange?: PropsWithModeCheck['onChange'],\n onCancel?: PropsWithModeCancel['onCancel'],\n): {\n view?: TagBaseProps['view'];\n onClick?: TagBaseProps['onClick'];\n onCancel?: TagBaseProps['onCancel'];\n withAction?: TagBaseProps['withAction'];\n as: keyof JSX.IntrinsicElements;\n} {\n switch (mode) {\n case 'button':\n return {\n view: 'filled',\n onClick,\n as: 'button',\n withAction: true,\n };\n case 'link':\n return {\n view: 'filled',\n onClick,\n as: 'a',\n withAction: true,\n };\n case 'check':\n return {\n view: checked ? 'filled' : 'stroked',\n onClick:\n typeof onChange === 'function'\n ? (e: React.MouseEvent) => onChange({ e, checked: !checked })\n : undefined,\n as: 'button',\n withAction: true,\n };\n case 'cancel':\n return {\n view: 'filled',\n onCancel,\n as: 'span',\n };\n case 'info':\n return {\n view: 'filled',\n as: 'span',\n };\n }\n}\n\nexport const COMPONENT_NAME = 'Tag' as const;\n\nconst TagRenter: TagRender = (props, ref) => {\n const tagRef = useRef<HTMLDivElement>(null);\n const {\n mode = tagPropModeDefault,\n onChange,\n checked,\n onCancel,\n onClick,\n ...otherProps\n } = usePropsHandler(COMPONENT_NAME, props, tagRef);\n const params = getParams(mode, checked, onClick, onChange, onCancel);\n\n return (\n <TagBase {...otherProps} {...params} ref={useForkRef([ref, tagRef])} />\n );\n};\n\nexport const Tag = forwardRef(TagRenter) as TagComponent;\n"],"mappings":"sJACA,MAAOA,MAAP,EAAgBC,UAAhB,CAA4BC,MAA5B,KAA0C,OAA1C,CAEA,OAASC,UAAT,yCACA,OAASC,eAAT,2CACA,OAASC,OAAT,0BAIA,MAAO,IAAMC,YAAW,CAAG,CACzB,QADyB,CAEzB,OAFyB,CAGzB,QAHyB,CAIzB,MAJyB,CAKzB,MALyB,CAApB,CAOP,MAAO,IAAMC,mBAAkB,CAAGD,WAAW,CAAC,CAAD,CAAtC,CAmFP,MAAO,SAASE,UAAT,CACLC,CADK,CAELC,CAFK,CAGLC,CAHK,CAILC,CAJK,CAKLC,CALK,CAYL,OAEO,QAFP,GACQJ,CADR,CAGW,CACLK,IAAI,CAAE,QADD,CAELH,OAAO,CAAPA,CAFK,CAGLI,EAAE,CAAE,QAHC,CAILC,UAAU,GAJL,CAHX,CASO,MATP,GACQP,CADR,CAUW,CACLK,IAAI,CAAE,QADD,CAELH,OAAO,CAAPA,CAFK,CAGLI,EAAE,CAAE,GAHC,CAILC,UAAU,GAJL,CAVX,CAgBO,OAhBP,GACQP,CADR,CAiBW,CACLK,IAAI,CAAEJ,CAAO,CAAG,QAAH,CAAc,SADtB,CAELC,OAAO,CACe,UAApB,QAAOC,EAAP,CACI,SAACK,CAAD,QAAyBL,EAAQ,CAAC,CAAEK,CAAC,CAADA,CAAF,CAAKP,OAAO,CAAE,CAACA,CAAf,CAAD,CAAjC,CADJ,OAHG,CAMLK,EAAE,CAAE,QANC,CAOLC,UAAU,GAPL,CAjBX,CA0BO,QA1BP,GACQP,CADR,CA2BW,CACLK,IAAI,CAAE,QADD,CAELD,QAAQ,CAARA,CAFK,CAGLE,EAAE,CAAE,MAHC,CA3BX,CAgCO,MAhCP,GACQN,CADR,CAiCW,CACLK,IAAI,CAAE,QADD,CAELC,EAAE,CAAE,MAFC,CAjCX,OAsCD,CAED,MAAO,IAAMG,eAAc,CAAG,KAAvB,CAEP,GAAMC,UAAoB,CAAG,SAACC,CAAD,CAAQC,CAAR,CAAgB,IACrCC,EAAM,CAAGpB,MAAM,CAAiB,IAAjB,CADsB,GASvCE,eAAe,CAACc,cAAD,CAAiBE,CAAjB,CAAwBE,CAAxB,CATwB,KAGzCb,IAHyC,CAGzCA,CAHyC,YAGlCF,kBAHkC,GAIzCK,CAJyC,GAIzCA,QAJyC,CAKzCF,CALyC,GAKzCA,OALyC,CAMzCG,CANyC,GAMzCA,QANyC,CAOzCF,CAPyC,GAOzCA,OAPyC,CAQtCY,CARsC,uCAUrCC,CAAM,CAAGhB,SAAS,CAACC,CAAD,CAAOC,CAAP,CAAgBC,CAAhB,CAAyBC,CAAzB,CAAmCC,CAAnC,CAVmB,CAY3C,MACE,qBAAC,OAAD,kBAAaU,CAAb,CAA6BC,CAA7B,EAAqC,GAAG,CAAErB,UAAU,CAAC,CAACkB,CAAD,CAAMC,CAAN,CAAD,CAApD,GAEH,CAfD,CAiBA,MAAO,IAAMG,IAAG,CAAGxB,UAAU,CAACkB,SAAD,CAAtB"}

package/__internal__/src/components/TagBase/TagBase.d.ts CHANGED Viewed

@@ -1,12 +1,12 @@
 import './TagBase.css';
+import { IconComponent, IconPropSize } from '@consta/icons/Icon';
 import React from 'react';
-import { IconComponent, IconPropSize } from '../../icons/Icon/Icon';
 export declare const tagBasePropSize: readonly ["m", "xs", "s", "l"];
 export declare const tagBasePropSizeDefault: "m";
 export declare type TagBasePropSize = typeof tagBasePropSize[number];
 export declare const tagBasePropGroupNumberValue: readonly [1, 2, 3, 4, 5, 6, 7, 8, 9];
 export declare const tagBasePropGroupStringValue: readonly ["1", "2", "3", "4", "5", "6", "7", "8", "9"];
-export declare const tagBasePropGroup: (4 | 9 | 1 | "1" | 2 | 3 | 5 | "2" | 7 | "3" | "4" | "5" | 8 | 6 | "6" | "7" | "8" | "9")[];
+export declare const tagBasePropGroup: ("1" | 1 | 4 | 2 | 3 | 5 | "2" | 7 | "3" | "4" | "5" | 8 | 9 | 6 | "6" | "7" | "8" | "9")[];
 export declare type TagBasePropGroup = typeof tagBasePropGroup[number];
 export declare const tagBasePropView: readonly ["stroked", "filled"];
 export declare const tagBasePropViewDefault: "stroked";

package/__internal__/src/components/TagBase/TagBase.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["size","as","label","className","group","view","onCancel","icon","iconSize","withAction"];import"./TagBase.css";import React from"react";import{IconClose}from"../../icons/IconClose/IconClose";import{cn}from"../../utils/bem";import{getByMap}from"../../utils/getByMap";import{forwardRefWithAs}from"../../utils/types/PropsWithAsAttributes";export var tagBasePropSize=["m","xs","s","l"];export var tagBasePropSizeDefault=tagBasePropSize[0];export var tagBasePropGroupNumberValue=[1,2,3,4,5,6,7,8,9];export var tagBasePropGroupStringValue=["1","2","3","4","5","6","7","8","9"];export var tagBasePropGroup=[].concat(tagBasePropGroupNumberValue,tagBasePropGroupStringValue);export var tagBasePropView=["stroked","filled"];export var tagBasePropViewDefault=tagBasePropView[0];export var cnTagBase=cn("TagBase");var sizeMap={xs:"xs",s:"xs",m:"s",l:"s"};export var TagBase=forwardRefWithAs(function(a,b){var c=a.size,d=void 0===c?tagBasePropSizeDefault:c,e=a.as,f=void 0===e?"div":e,g=a.label,h=a.className,i=a.group,j=a.view,k=void 0===j?tagBasePropViewDefault:j,l=a.onCancel,m=a.icon,n=a.iconSize,o=a.withAction,p=_objectWithoutProperties(a,_excluded),q="function"==typeof l,r=getByMap(sizeMap,d),s=getByMap(sizeMap,d,n);return React.createElement(f,Object.assign({},p,{className:cnTagBase({size:d,view:k,withCancel:q,withIcon:!!m,group:i,withAction:o},[h]),ref:b}),q||m?React.createElement(React.Fragment,null,m&&React.createElement("span",{className:cnTagBase("IconWrapper")},React.createElement(m,{size:s,className:cnTagBase("Icon")})),React.createElement("span",{className:cnTagBase("Label")},g),q&&React.createElement("button",{className:cnTagBase("CancelButton"),type:"button",onClick:l},React.createElement(IconClose,{className:cnTagBase("CancelIcon"),size:r}))):g)});
+import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["size","as","label","className","group","view","onCancel","icon","iconSize","withAction"];import"./TagBase.css";import{IconClose}from"@consta/icons/IconClose";import React from"react";import{cn}from"../../utils/bem";import{getByMap}from"../../utils/getByMap";import{forwardRefWithAs}from"../../utils/types/PropsWithAsAttributes";export var tagBasePropSize=["m","xs","s","l"];export var tagBasePropSizeDefault=tagBasePropSize[0];export var tagBasePropGroupNumberValue=[1,2,3,4,5,6,7,8,9];export var tagBasePropGroupStringValue=["1","2","3","4","5","6","7","8","9"];export var tagBasePropGroup=[].concat(tagBasePropGroupNumberValue,tagBasePropGroupStringValue);export var tagBasePropView=["stroked","filled"];export var tagBasePropViewDefault=tagBasePropView[0];export var cnTagBase=cn("TagBase");var sizeMap={xs:"xs",s:"xs",m:"s",l:"s"};export var TagBase=forwardRefWithAs(function(a,b){var c=a.size,d=void 0===c?tagBasePropSizeDefault:c,e=a.as,f=void 0===e?"div":e,g=a.label,h=a.className,i=a.group,j=a.view,k=void 0===j?tagBasePropViewDefault:j,l=a.onCancel,m=a.icon,n=a.iconSize,o=a.withAction,p=_objectWithoutProperties(a,_excluded),q="function"==typeof l,r=getByMap(sizeMap,d),s=getByMap(sizeMap,d,n);return React.createElement(f,Object.assign({},p,{className:cnTagBase({size:d,view:k,withCancel:q,withIcon:!!m,group:i,withAction:o},[h]),ref:b}),q||m?React.createElement(React.Fragment,null,m&&React.createElement("span",{className:cnTagBase("IconWrapper")},React.createElement(m,{size:s,className:cnTagBase("Icon")})),React.createElement("span",{className:cnTagBase("Label")},g),q&&React.createElement("button",{className:cnTagBase("CancelButton"),type:"button",onClick:l},React.createElement(IconClose,{className:cnTagBase("CancelIcon"),size:r}))):g)});
 //# sourceMappingURL=TagBase.js.map

package/__internal__/src/components/TagBase/TagBase.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TagBase.js","names":["~~React~~","~~IconClose~~","cn","getByMap","forwardRefWithAs","tagBasePropSize","tagBasePropSizeDefault","tagBasePropGroupNumberValue","tagBasePropGroupStringValue","tagBasePropGroup","tagBasePropView","tagBasePropViewDefault","cnTagBase","sizeMap","xs","s","m","l","TagBase","props","ref","size","as","label","className","group","view","onCancel","Icon","icon","iconSize","withAction","otherProps","withCancel","IconCloseSize","IconSize","withIcon"],"sources":["../../../../../src/components/TagBase/TagBase.tsx"],"sourcesContent":["import './TagBase.css';\n\nimport ~~React from 'react';\n\nimport~~ { IconComponent, IconPropSize } from '~~../../~~icons/Icon~~/Icon~~';\nimport { IconClose } from '~~../../~~icons/IconClose~~/IconClose~~';\nimport { cn } from '../../utils/bem';\nimport { getByMap } from '../../utils/getByMap';\nimport { forwardRefWithAs } from '../../utils/types/PropsWithAsAttributes';\n\nexport const tagBasePropSize = ['m', 'xs', 's', 'l'] as const;\nexport const tagBasePropSizeDefault = tagBasePropSize[0];\nexport type TagBasePropSize = typeof tagBasePropSize[number];\n\nexport const tagBasePropGroupNumberValue = [1, 2, 3, 4, 5, 6, 7, 8, 9] as const;\nexport const tagBasePropGroupStringValue = [\n '1',\n '2',\n '3',\n '4',\n '5',\n '6',\n '7',\n '8',\n '9',\n] as const;\nexport const tagBasePropGroup = [\n ...tagBasePropGroupNumberValue,\n ...tagBasePropGroupStringValue,\n];\n\nexport type TagBasePropGroup = typeof tagBasePropGroup[number];\n\nexport const tagBasePropView = ['stroked', 'filled'] as const;\nexport const tagBasePropViewDefault = tagBasePropView[0];\nexport type TagBasePropView = typeof tagBasePropView[number];\n\nexport type Props = {\n size?: TagBasePropSize;\n label: string;\n children?: never;\n view?: TagBasePropView;\n group?: TagBasePropGroup;\n onCancel?: React.MouseEventHandler<HTMLButtonElement>;\n icon?: IconComponent;\n iconSize?: IconPropSize;\n withAction?: boolean;\n};\n\nexport const cnTagBase = cn('TagBase');\n\nconst sizeMap: Record<TagBasePropSize, IconPropSize> = {\n xs: 'xs',\n s: 'xs',\n m: 's',\n l: 's',\n};\n\nexport const TagBase = forwardRefWithAs<Props>((props, ref) => {\n const {\n size = tagBasePropSizeDefault,\n as = 'div',\n label,\n className,\n group,\n view = tagBasePropViewDefault,\n onCancel,\n icon: Icon,\n iconSize,\n withAction,\n ...otherProps\n } = props;\n\n const Tag = as as string;\n const withCancel = typeof onCancel === 'function';\n const withIcon = !!Icon;\n const IconCloseSize = getByMap(sizeMap, size);\n const IconSize = getByMap(sizeMap, size, iconSize);\n\n return (\n <Tag\n {...otherProps}\n className={cnTagBase(\n {\n size,\n view,\n withCancel,\n withIcon,\n group,\n withAction,\n },\n [className],\n )}\n ref={ref}\n >\n {withCancel \|\| Icon ? (\n <>\n {Icon && (\n <span className={cnTagBase('IconWrapper')}>\n <Icon size={IconSize} className={cnTagBase('Icon')} />\n </span>\n )}\n <span className={cnTagBase('Label')}>{label}</span>\n {withCancel && (\n <button\n className={cnTagBase('CancelButton')}\n type=\"button\"\n onClick={onCancel}\n >\n <IconClose\n className={cnTagBase('CancelIcon')}\n size={IconCloseSize}\n />\n </button>\n )}\n </>\n ) : (\n label\n )}\n </Tag>\n );\n});\n"],"mappings":"8LAAA,~~sBAEA~~,~~MAAOA~~,MAAP,KAAkB,OAAlB,~~CAGA~~,OAASC,~~SAAT,uCACA,OAASC,~~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"}
1	+ {"version":3,"file":"TagBase.js","names":["IconClose","React","cn","getByMap","forwardRefWithAs","tagBasePropSize","tagBasePropSizeDefault","tagBasePropGroupNumberValue","tagBasePropGroupStringValue","tagBasePropGroup","tagBasePropView","tagBasePropViewDefault","cnTagBase","sizeMap","xs","s","m","l","TagBase","props","ref","size","as","label","className","group","view","onCancel","Icon","icon","iconSize","withAction","otherProps","withCancel","IconCloseSize","IconSize","withIcon"],"sources":["../../../../../src/components/TagBase/TagBase.tsx"],"sourcesContent":["import './TagBase.css';\n\nimport { IconComponent, IconPropSize } from '@consta/icons/Icon';\nimport { IconClose } from '@consta/icons/IconClose';\nimport React from 'react';\n\nimport { cn } from '../../utils/bem';\nimport { getByMap } from '../../utils/getByMap';\nimport { forwardRefWithAs } from '../../utils/types/PropsWithAsAttributes';\n\nexport const tagBasePropSize = ['m', 'xs', 's', 'l'] as const;\nexport const tagBasePropSizeDefault = tagBasePropSize[0];\nexport type TagBasePropSize = typeof tagBasePropSize[number];\n\nexport const tagBasePropGroupNumberValue = [1, 2, 3, 4, 5, 6, 7, 8, 9] as const;\nexport const tagBasePropGroupStringValue = [\n '1',\n '2',\n '3',\n '4',\n '5',\n '6',\n '7',\n '8',\n '9',\n] as const;\nexport const tagBasePropGroup = [\n ...tagBasePropGroupNumberValue,\n ...tagBasePropGroupStringValue,\n];\n\nexport type TagBasePropGroup = typeof tagBasePropGroup[number];\n\nexport const tagBasePropView = ['stroked', 'filled'] as const;\nexport const tagBasePropViewDefault = tagBasePropView[0];\nexport type TagBasePropView = typeof tagBasePropView[number];\n\nexport type Props = {\n size?: TagBasePropSize;\n label: string;\n children?: never;\n view?: TagBasePropView;\n group?: TagBasePropGroup;\n onCancel?: React.MouseEventHandler<HTMLButtonElement>;\n icon?: IconComponent;\n iconSize?: IconPropSize;\n withAction?: boolean;\n};\n\nexport const cnTagBase = cn('TagBase');\n\nconst sizeMap: Record<TagBasePropSize, IconPropSize> = {\n xs: 'xs',\n s: 'xs',\n m: 's',\n l: 's',\n};\n\nexport const TagBase = forwardRefWithAs<Props>((props, ref) => {\n const {\n size = tagBasePropSizeDefault,\n as = 'div',\n label,\n className,\n group,\n view = tagBasePropViewDefault,\n onCancel,\n icon: Icon,\n iconSize,\n withAction,\n ...otherProps\n } = props;\n\n const Tag = as as string;\n const withCancel = typeof onCancel === 'function';\n const withIcon = !!Icon;\n const IconCloseSize = getByMap(sizeMap, size);\n const IconSize = getByMap(sizeMap, size, iconSize);\n\n return (\n <Tag\n {...otherProps}\n className={cnTagBase(\n {\n size,\n view,\n withCancel,\n withIcon,\n group,\n withAction,\n },\n [className],\n )}\n ref={ref}\n >\n {withCancel \|\| Icon ? (\n <>\n {Icon && (\n <span className={cnTagBase('IconWrapper')}>\n <Icon size={IconSize} className={cnTagBase('Icon')} />\n </span>\n )}\n <span className={cnTagBase('Label')}>{label}</span>\n {withCancel && (\n <button\n className={cnTagBase('CancelButton')}\n type=\"button\"\n onClick={onCancel}\n >\n <IconClose\n className={cnTagBase('CancelIcon')}\n size={IconCloseSize}\n />\n </button>\n )}\n </>\n ) : (\n label\n )}\n </Tag>\n );\n});\n"],"mappings":"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"}