@finam/web-ui-kit-components 3.30.1 → 3.32.0

package/dist/Tab/Tab.js

@@ -1,22 +1,44 @@
-import { __rest } from "tslib";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, memo, useCallback } from 'react';
-import { tab, tabContentWrapper, tabCounterSpacing } from '@finam/web-ui-kit-core/styles/tab';
-import classnames from 'clsx';
-import Counter from '../Counter/index.js';
-const Tab = forwardRef((_a, ref) => {
-    var { selected, fullWidth, buttonVariant = 'primary', lineVariant = 'primary', size = 'm', tabType = 'line', value, onChange, icon = null, vertical: verticalProp, count, as: TabComponent = 'button', preventDefaultOnClick = TabComponent === 'button' } = _a, tabProps = __rest(_a, ["selected", "fullWidth", "buttonVariant", "lineVariant", "size", "tabType", "value", "onChange", "icon", "vertical", "count", "as", "preventDefaultOnClick"]);
-    const vertical = verticalProp && tabType === 'line';
+import { _ } from "@swc/helpers/_/_object_spread";
+import { _ as _object_spread_props__ } from "@swc/helpers/_/_object_spread_props";
+import { _ as _object_without_properties__ } from "@swc/helpers/_/_object_without_properties";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { forwardRef, memo, useCallback } from "react";
+import { tab, tabContentWrapper, tabCounterSpacing } from "@finam/web-ui-kit-core/styles/tab";
+import clsx from "clsx";
+import Counter from "../Counter/index.js";
+const Tab = /*#__PURE__*/ forwardRef((_0, _1)=>{
+    let _ref = [
+        _0,
+        _1
+    ], [_ref1, ..._rest] = _ref, { selected, fullWidth, buttonVariant = 'primary', lineVariant = 'primary', size = 'm', tabType = 'line', value, onChange, icon = null, vertical: verticalProp, count, as: TabComponent = 'button', preventDefaultOnClick = 'button' === TabComponent } = _ref1, tabProps = _object_without_properties__(_ref1, [
+        "selected",
+        "fullWidth",
+        "buttonVariant",
+        "lineVariant",
+        "size",
+        "tabType",
+        "value",
+        "onChange",
+        "icon",
+        "vertical",
+        "count",
+        "as",
+        "preventDefaultOnClick"
+    ]), [ref] = _rest;
+    const vertical = verticalProp && 'line' === tabType;
     const { className, disabled, onClick, children } = tabProps;
-    const handleClick = useCallback((event) => {
-        if (preventDefaultOnClick) {
-            event.preventDefault();
-        }
-        onChange === null || onChange === void 0 ? void 0 : onChange(value);
-        onClick === null || onClick === void 0 ? void 0 : onClick(event);
-    }, [value, onChange, onClick, preventDefaultOnClick]);
+    const handleClick = useCallback((event)=>{
+        if (preventDefaultOnClick) event.preventDefault();
+        null == onChange || onChange(value);
+        null == onClick || onClick(event);
+    }, [
+        value,
+        onChange,
+        onClick,
+        preventDefaultOnClick
+    ]);
     const iconOnly = Boolean(!children && !count && icon);
-    const buttonClassName = classnames(tab({
+    const buttonClassName = clsx(tab({
         size,
         tabType,
         fullWidth,
@@ -25,9 +47,32 @@ const Tab = forwardRef((_a, ref) => {
         buttonVariant,
         lineVariant,
         iconOnly,
-        selected,
+        selected
     }), className);
-    return (_jsxs(TabComponent, Object.assign({ type: "button", role: "tab", value: value }, tabProps, { ref: ref, className: buttonClassName, onClick: handleClick, children: [icon, tabType === 'buttons' && children ? (_jsx("span", { className: tabContentWrapper[size], children: children })) : children, count ? (_jsx(Counter, { color: tabType === 'buttons' && selected && buttonVariant != 'alternative' ? 'onbrand' : 'default', size: size === 'xs' ? 's' : size, className: tabCounterSpacing[tabType], children: count })) : null] })));
+    return /*#__PURE__*/ jsxs(TabComponent, _object_spread_props__(_({
+        type: "button",
+        role: "tab",
+        value: value
+    }, tabProps), {
+        ref: ref,
+        className: buttonClassName,
+        onClick: handleClick,
+        children: [
+            icon,
+            'buttons' === tabType && children ? /*#__PURE__*/ jsx("span", {
+                className: tabContentWrapper[size],
+                children: children
+            }) : children,
+            count ? /*#__PURE__*/ jsx(Counter, {
+                color: 'buttons' === tabType && selected && 'alternative' != buttonVariant ? 'onbrand' : 'default',
+                size: 'xs' === size ? 's' : size,
+                className: tabCounterSpacing[tabType],
+                children: count
+            }) : null
+        ]
+    }));
 });
-export default memo(Tab);
+const Tab_Tab = /*#__PURE__*/ memo(Tab);
+export default Tab_Tab;
+
 //# sourceMappingURL=Tab.js.map

package/dist/Tab/Tab.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tab.js","sourceRoot":"","sources":["../../src/Tab/Tab.tsx"],"names":[],"mappings":";;AAUA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AACtD,OAAO,EAAE,GAAG,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,MAAM,mCAAmC,CAAC;AAC9F,OAAO,UAAU,MAAM,MAAM,CAAC;AAE9B,OAAO,OAAO,MAAM,qBAAqB,CAAC;AA+B1C,MAAM,GAAG,GAAG,UAAU,CAA2B,CAAC,EAejD,EAAE,GAAG,EAAE,EAAE;QAfwC,EAChD,QAAQ,EACR,SAAS,EACT,aAAa,GAAG,SAAS,EACzB,WAAW,GAAG,SAAS,EACvB,IAAI,GAAG,GAAG,EACV,OAAO,GAAG,MAAM,EAChB,KAAK,EACL,QAAQ,EACR,IAAI,GAAG,IAAI,EACX,QAAQ,EAAE,YAAY,EACtB,KAAK,EACL,EAAE,EAAE,YAAY,GAAG,QAAQ,EAC3B,qBAAqB,GAAG,YAAY,KAAK,QAAQ,OAElD,EADI,QAAQ,cAdqC,6JAejD,CADY;IAEX,MAAM,QAAQ,GAAG,YAAY,IAAI,OAAO,KAAK,MAAM,CAAC;IACpD,MAAM,EAAE,SAAS,EAAE,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,QAAQ,CAAC;IAE5D,MAAM,WAAW,GAAG,WAAW,CAAC,CAAC,KAAoC,EAAE,EAAE;QACvE,IAAI,qBAAqB,EAAE,CAAC;YAC1B,KAAK,CAAC,cAAc,EAAE,CAAC;QACzB,CAAC;QACD,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,KAAK,CAAC,CAAC;QAClB,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAG,KAAK,CAAC,CAAC;IACnB,CAAC,EAAE,CAAC,KAAK,EAAE,QAAQ,EAAE,OAAO,EAAE,qBAAqB,CAAC,CAAC,CAAC;IAEtD,MAAM,QAAQ,GAAG,OAAO,CAAC,CAAC,QAAQ,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,CAAC;IAEtD,MAAM,eAAe,GAAG,UAAU,CAChC,GAAG,CAAC;QACF,IAAI;QACJ,OAAO;QACP,SAAS;QACT,QAAQ;QACR,QAAQ;QACR,aAAa;QACb,WAAW;QACX,QAAQ;QACR,QAAQ;KACT,CAAC,EACF,SAAS,CACV,CAAC;IAEF,OAAO,CACL,MAAC,YAAY,kBACX,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,KAAK,EACV,KAAK,EAAE,KAAK,IACR,QAAQ,IACZ,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,eAAe,EAC1B,OAAO,EAAE,WAAW,aAEnB,IAAI,EACJ,OAAO,KAAK,SAAS,IAAI,QAAQ,CAAC,CAAC,CAAC,CACnC,eAAM,SAAS,EAAE,iBAAiB,CAAC,IAAI,CAAC,YACrC,QAAQ,GACJ,CACR,CAAC,CAAC,CAAC,QAAQ,EACX,KAAK,CAAC,CAAC,CAAC,CACP,KAAC,OAAO,IACN,KAAK,EAAE,OAAO,KAAK,SAAS,IAAI,QAAQ,IAAI,aAAa,IAAI,aAAa,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,EAClG,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,EAChC,SAAS,EAAE,iBAAiB,CAAC,OAAO,CAAC,YAEpC,KAAK,GACE,CACX,CAAC,CAAC,CAAC,IAAI,KACK,CAChB,CAAC;AACJ,CAAC,CAAC,CAAC;AAOH,eAAe,IAAI,CAAC,GAAG,CAE4B,CAAC"}
+{"version":3,"file":"Tab/Tab.js","sources":["../../src/Tab/Tab.tsx"],"sourcesContent":["import type {\n  ButtonHTMLAttributes,\n  ReactNode,\n  MouseEvent,\n  JSX,\n  ElementType,\n  Ref,\n  ComponentPropsWithoutRef,\n  MemoExoticComponent,\n} from 'react';\nimport { forwardRef, memo, useCallback } from 'react';\nimport { tab, tabContentWrapper, tabCounterSpacing } from '@finam/web-ui-kit-core/styles/tab';\nimport classnames from 'clsx';\nimport type { Size, TabType, ButtonVariant, LineVariant } from './types.js';\nimport Counter from '../Counter/index.js';\n\nexport interface Props extends ButtonHTMLAttributes<HTMLButtonElement> {\n  /** Активное состояние компонента */\n  selected?: boolean;\n  /** Растяжение компонента по ширине контейнера */\n  fullWidth?: boolean;\n  /** Варианты отображения кнопочного Tab */\n  buttonVariant?: ButtonVariant;\n  /** Варианты отображения линейного Tab */\n  lineVariant?: LineVariant;\n  /** Размер Tab */\n  size?: Size;\n  /** Линейный или кнопочный Tab */\n  tabType?: TabType;\n  /** Значение вкладки */\n  value?: any;\n  /** Обработчик выбора вкладки */\n  onChange?(value?: any): void;\n  /** Иконка, отображаемая слева от текста */\n  icon?: ReactNode;\n  /** Счетчик, отображаемый справа от текста */\n  count?: number;\n  /** Направление линейных вкладок */\n  vertical?: boolean;\n  /** Отключение действия по клику, по-умолчанию true для типа компонента \"button\" */\n  preventDefaultOnClick?: boolean;\n\n  as?: ElementType;\n}\n\nconst Tab = forwardRef<HTMLButtonElement, Props>(({\n  selected,\n  fullWidth,\n  buttonVariant = 'primary',\n  lineVariant = 'primary',\n  size = 'm',\n  tabType = 'line',\n  value,\n  onChange,\n  icon = null,\n  vertical: verticalProp,\n  count,\n  as: TabComponent = 'button',\n  preventDefaultOnClick = TabComponent === 'button',\n  ...tabProps\n}, ref) => {\n  const vertical = verticalProp && tabType === 'line';\n  const { className, disabled, onClick, children } = tabProps;\n\n  const handleClick = useCallback((event: MouseEvent<HTMLButtonElement>) => {\n    if (preventDefaultOnClick) {\n      event.preventDefault();\n    }\n    onChange?.(value);\n    onClick?.(event);\n  }, [value, onChange, onClick, preventDefaultOnClick]);\n\n  const iconOnly = Boolean(!children && !count && icon);\n\n  const buttonClassName = classnames(\n    tab({\n      size,\n      tabType,\n      fullWidth,\n      vertical,\n      disabled,\n      buttonVariant,\n      lineVariant,\n      iconOnly,\n      selected,\n    }),\n    className,\n  );\n\n  return (\n    <TabComponent\n      type=\"button\"\n      role=\"tab\"\n      value={value}\n      {...tabProps}\n      ref={ref}\n      className={buttonClassName}\n      onClick={handleClick}\n    >\n      {icon}\n      {tabType === 'buttons' && children ? (\n        <span className={tabContentWrapper[size]}>\n          {children}\n        </span>\n      ) : children}\n      {count ? (\n        <Counter\n          color={tabType === 'buttons' && selected && buttonVariant != 'alternative' ? 'onbrand' : 'default'}\n          size={size === 'xs' ? 's' : size}\n          className={tabCounterSpacing[tabType]}\n        >\n          {count}\n        </Counter>\n      ) : null}\n    </TabComponent>\n  );\n});\n\ntype ExportProps<T extends ElementType> =\n    & { as?: T; ref?: Ref<T>; }\n    & Omit<Props, keyof ComponentPropsWithoutRef<T> | 'as'>\n    & Omit<ComponentPropsWithoutRef<T>, 'as'>;\n\nexport default memo(Tab) as (<T extends ElementType = 'button'>(\n  props: ExportProps<T>\n) => JSX.Element) & MemoExoticComponent<typeof Tab>;\n"],"names":["Tab","forwardRef","selected","fullWidth","buttonVariant","lineVariant","size","tabType","value","onChange","icon","verticalProp","count","TabComponent","preventDefaultOnClick","tabProps","ref","vertical","className","disabled","onClick","children","handleClick","useCallback","event","iconOnly","Boolean","buttonClassName","classnames","tab","tabContentWrapper","Counter","tabCounterSpacing","memo"],"mappings":";;;;;;;;AA6CA,MAAMA,MAAM,WAAHA,GAAGC,WAAqC,CAAC,IAAD;;;;iCAAC,EAChDC,QAAQ,EACRC,SAAS,EACTC,gBAAgB,SAAS,EACzBC,cAAc,SAAS,EACvBC,OAAO,GAAG,EACVC,UAAU,MAAM,EAChBC,KAAK,EACLC,QAAQ,EACRC,OAAO,IAAI,EACX,UAAUC,YAAY,EACtBC,KAAK,EACL,IAAIC,eAAe,QAAQ,EAC3BC,wBAAwBD,AAAiB,aAAjBA,YAAyB,EAElD,UADIE,WAAAA,6BAAAA,OAAAA;;;;;;;;;;;;;;SACFC,IAAAA,GAAAA;IACD,MAAMC,WAAWN,gBAAgBJ,AAAY,WAAZA;IACjC,MAAM,EAAEW,SAAS,EAAEC,QAAQ,EAAEC,OAAO,EAAEC,QAAQ,EAAE,GAAGN;IAEnD,MAAMO,cAAcC,YAAY,CAACC;QAC/B,IAAIV,uBACFU,MAAM,cAAc;QAEtBf,QAAAA,YAAAA,SAAWD;QACXY,QAAAA,WAAAA,QAAUI;IACZ,GAAG;QAAChB;QAAOC;QAAUW;QAASN;KAAsB;IAEpD,MAAMW,WAAWC,QAAQ,CAACL,YAAY,CAACT,SAASF;IAEhD,MAAMiB,kBAAkBC,KACtBC,IAAI;QACFvB;QACAC;QACAJ;QACAc;QACAE;QACAf;QACAC;QACAoB;QACAvB;IACF,IACAgB;IAGF,OAAO,WAAP,GACE,KAACL,cAAAA,uBAAAA,EAAAA;QACC,MAAK;QACL,MAAK;QACL,OAAOL;OACHO,WAAAA;QACJ,KAAKC;QACL,WAAWW;QACX,SAASL;;YAERZ;YACY,cAAZH,WAAyBc,WAAW,WAAXA,GACxB,IAAC;gBAAK,WAAWS,iBAAiB,CAACxB,KAAK;0BACrCe;iBAEDA;YACHT,QAAQ,WAARA,GACC,IAACmB,SAAOA;gBACN,OAAOxB,AAAY,cAAZA,WAAyBL,YAAYE,AAAiB,iBAAjBA,gBAAiC,YAAY;gBACzF,MAAME,AAAS,SAATA,OAAgB,MAAMA;gBAC5B,WAAW0B,iBAAiB,CAACzB,QAAQ;0BAEpCK;iBAED;;;AAGV;AAOA,8BAAeqB,KAAKjC"}

package/dist/Tab/index.js

@@ -1,3 +1,5 @@
-import Tab from './Tab.js';
-export default Tab;
+import Tab from "./Tab.js";
+const src_Tab = Tab;
+export default src_Tab;
+
 //# sourceMappingURL=index.js.map

package/dist/Tab/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/Tab/index.ts"],"names":[],"mappings":"AAAA,OAAO,GAAc,MAAM,UAAU,CAAC;AAGtC,eAAe,GAAG,CAAC"}
+{"version":3,"file":"Tab/index.js","sources":["../../src/Tab/index.ts"],"sourcesContent":["import Tab, { Props } from './Tab.js';\n\nexport type { Props as TabProps };\nexport default Tab;\n"],"names":["Tab"],"mappings":";AAGA,gBAAeA"}

package/dist/Tab/types.js

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=types.js.map

package/dist/Tabs/Tabs.js

@@ -1,105 +1,148 @@
-import { __rest } from "tslib";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { memo, useRef, useState, Children, isValidElement, useCallback, } from 'react';
-import classnames from 'clsx';
-import debounce from 'lodash/debounce.js';
-import { classNameSize } from './utils.js';
-import { Root, FlexContainer, Divider, TabIndicator, VerticalWrap, INITIAL_STYLE, } from './Tabs.styles.js';
-import { useIsomorphicEffect } from '../utils/useIsomorphicEffect.js';
-const Tabs = (_a) => {
-    var { size = 'm', tabType = 'line', fullWidth, value: valueProp, onChange, disabled, withDivider, children: childrenProp, tabIndicatorProps = {}, vertical: verticalProp, lineVariant, buttonVariant } = _a, rootProps = __rest(_a, ["size", "tabType", "fullWidth", "value", "onChange", "disabled", "withDivider", "children", "tabIndicatorProps", "vertical", "lineVariant", "buttonVariant"]);
-    const vertical = verticalProp && tabType === 'line';
+import { _ } from "@swc/helpers/_/_object_spread";
+import { _ as _object_spread_props__ } from "@swc/helpers/_/_object_spread_props";
+import { _ as _object_without_properties__ } from "@swc/helpers/_/_object_without_properties";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Children, isValidElement, memo, useCallback, useRef, useState } from "react";
+import clsx from "clsx";
+import debounce from "lodash/debounce.js";
+import { classNameSize } from "./utils.js";
+import { Divider, FlexContainer, INITIAL_STYLE, Root, TabIndicator, VerticalWrap } from "./Tabs.styles.js";
+import { useIsomorphicEffect } from "../utils/useIsomorphicEffect.js";
+const Tabs = (_0)=>{
+    let { size = 'm', tabType = 'line', fullWidth, value: valueProp, onChange, disabled, withDivider, children: childrenProp, tabIndicatorProps = {}, vertical: verticalProp, lineVariant, buttonVariant } = _0, rootProps = _object_without_properties__(_0, [
+        "size",
+        "tabType",
+        "fullWidth",
+        "value",
+        "onChange",
+        "disabled",
+        "withDivider",
+        "children",
+        "tabIndicatorProps",
+        "vertical",
+        "lineVariant",
+        "buttonVariant"
+    ]);
+    const vertical = verticalProp && 'line' === tabType;
     const valueToIndexRef = useRef(new Map());
     const containerRef = useRef(null);
     const [indicatorStyle, setIndicatorStyle] = useState(INITIAL_STYLE);
     const valueRef = useRef(valueProp);
-    if (valueProp !== valueRef.current) {
-        valueRef.current = valueProp;
-    }
-    const updateIndicatorState = useCallback((value) => {
+    if (valueProp !== valueRef.current) valueRef.current = valueProp;
+    const updateIndicatorState = useCallback((value)=>{
         const container = containerRef.current;
-        if (!container) {
-            return;
-        }
+        if (!container) return;
         const containerRect = container.getBoundingClientRect();
         const tabIndex = valueToIndexRef.current.get(value);
-        const tab = tabIndex !== undefined && container.children[tabIndex];
-        if (!tab) {
-            return;
-        }
+        const tab = void 0 !== tabIndex && container.children[tabIndex];
+        if (!tab) return;
         const tabRect = tab.getBoundingClientRect();
         if (vertical) {
             const style = {
                 top: Math.round(tabRect.top - containerRect.top + container.scrollTop),
-                height: Math.round(tabRect.height),
+                height: Math.round(tabRect.height)
             };
-            setIndicatorStyle((prevStyle) => {
+            setIndicatorStyle((prevStyle)=>{
                 const prevComparison = !prevStyle || style.top !== prevStyle.top || style.height !== prevStyle.height;
-                return prevComparison && !Number.isNaN(style.top) && !Number.isNaN(style.height)
-                    ? style
-                    : prevStyle;
+                return !prevComparison || Number.isNaN(style.top) || Number.isNaN(style.height) ? prevStyle : style;
             });
-        }
-        else {
+        } else {
             const style = {
                 left: Math.round(tabRect.left - containerRect.left + container.scrollLeft),
-                width: Math.round(tabRect.width),
+                width: Math.round(tabRect.width)
             };
-            setIndicatorStyle((prevStyle) => {
+            setIndicatorStyle((prevStyle)=>{
                 const prevComparison = !prevStyle || style.left !== prevStyle.left || style.width !== prevStyle.width;
-                return prevComparison && !Number.isNaN(style.left) && !Number.isNaN(style.width)
-                    ? style
-                    : prevStyle;
+                return !prevComparison || Number.isNaN(style.left) || Number.isNaN(style.width) ? prevStyle : style;
             });
         }
-    }, [vertical]);
-    useIsomorphicEffect(() => {
-        const handleResize = debounce(() => updateIndicatorState(valueRef.current), 166);
+    }, [
+        vertical
+    ]);
+    useIsomorphicEffect(()=>{
+        const handleResize = debounce(()=>updateIndicatorState(valueRef.current), 166);
         const container = containerRef.current;
         if ('ResizeObserver' in window && container) {
-            const resizeObserver = new window.ResizeObserver(() => {
+            const resizeObserver = new window.ResizeObserver(()=>{
                 handleResize();
             });
             resizeObserver.observe(container);
-            return () => {
+            return ()=>{
                 handleResize.cancel();
                 resizeObserver.disconnect();
             };
         }
         window.addEventListener('resize', handleResize);
-        return () => {
+        return ()=>{
             handleResize.cancel();
             window.removeEventListener('resize', handleResize);
         };
-    }, [updateIndicatorState]);
-    const additionalClassNames = classnames(classNameSize(size), { withDivider, vertical, fullWidth });
+    }, [
+        updateIndicatorState
+    ]);
+    const additionalClassNames = clsx(classNameSize(size), {
+        withDivider,
+        vertical,
+        fullWidth
+    });
     valueToIndexRef.current.clear();
     let childrenStr = '';
     let childIndex = 0;
-    const children = Children.map(childrenProp, (child) => {
-        if (!isValidElement(child)) {
-            return null;
-        }
-        const childValue = child.props.value === undefined ? childIndex : child.props.value;
+    const children = Children.map(childrenProp, (child)=>{
+        if (!/*#__PURE__*/ isValidElement(child)) return null;
+        const childValue = void 0 === child.props.value ? childIndex : child.props.value;
         valueToIndexRef.current.set(childValue, childIndex);
-        const childProps = Object.assign(Object.assign({ fullWidth,
+        const childProps = _object_spread_props__(_({
+            fullWidth,
             size,
             tabType,
             lineVariant,
             buttonVariant,
             onChange,
-            disabled, selected: childValue === valueProp, vertical }, child.props), { value: childValue });
-        childrenStr += typeof child.props.children === 'string' ? child.props.children : '';
+            disabled,
+            selected: childValue === valueProp,
+            vertical
+        }, child.props), {
+            value: childValue
+        });
+        childrenStr += 'string' == typeof child.props.children ? child.props.children : '';
         childIndex += 1;
-        if (vertical) {
-            return (_jsx(VerticalWrap, { className: additionalClassNames, children: _jsx(child.type, Object.assign({}, childProps)) }));
-        }
-        return _jsx(child.type, Object.assign({}, childProps));
+        if (vertical) return /*#__PURE__*/ jsx(VerticalWrap, {
+            className: additionalClassNames,
+            children: /*#__PURE__*/ jsx(child.type, _({}, childProps))
+        });
+        return /*#__PURE__*/ jsx(child.type, _({}, childProps));
     });
-    useIsomorphicEffect(() => {
+    useIsomorphicEffect(()=>{
         updateIndicatorState(valueProp);
-    }, [updateIndicatorState, valueProp, fullWidth, vertical, childrenStr]);
-    return (_jsxs(Root, Object.assign({ role: "tablist" }, rootProps, { className: classnames(additionalClassNames, rootProps.className), children: [_jsx(FlexContainer, { ref: containerRef, className: additionalClassNames, children: children }), tabType === 'line' && (_jsx(Divider, { className: additionalClassNames, children: _jsx(TabIndicator, Object.assign({}, tabIndicatorProps, { className: classnames(tabIndicatorProps.className, additionalClassNames, lineVariant), style: Object.assign(Object.assign({}, indicatorStyle), tabIndicatorProps.style) })) }))] })));
+    }, [
+        updateIndicatorState,
+        valueProp,
+        fullWidth,
+        vertical,
+        childrenStr
+    ]);
+    return /*#__PURE__*/ jsxs(Root, _object_spread_props__(_({
+        role: "tablist"
+    }, rootProps), {
+        className: clsx(additionalClassNames, rootProps.className),
+        children: [
+            /*#__PURE__*/ jsx(FlexContainer, {
+                ref: containerRef,
+                className: additionalClassNames,
+                children: children
+            }),
+            'line' === tabType && /*#__PURE__*/ jsx(Divider, {
+                className: additionalClassNames,
+                children: /*#__PURE__*/ jsx(TabIndicator, _object_spread_props__(_({}, tabIndicatorProps), {
+                    className: clsx(tabIndicatorProps.className, additionalClassNames, lineVariant),
+                    style: _({}, indicatorStyle, tabIndicatorProps.style)
+                }))
+            })
+        ]
+    }));
 };
-export default memo(Tabs);
+const Tabs_Tabs = /*#__PURE__*/ memo(Tabs);
+export default Tabs_Tabs;
+
 //# sourceMappingURL=Tabs.js.map

package/dist/Tabs/Tabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs.js","sourceRoot":"","sources":["../../src/Tabs/Tabs.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Tabs/Tabs.js","sources":["../../src/Tabs/Tabs.tsx"],"sourcesContent":["import {\n  memo,\n  ComponentPropsWithoutRef,\n  useRef,\n  useState,\n  ReactElement,\n  ComponentProps,\n  CSSProperties,\n  Children,\n  isValidElement,\n  useCallback,\n} from 'react';\nimport classnames from 'clsx';\nimport debounce from 'lodash/debounce.js';\nimport type { TabProps } from '../Tab/index.js';\nimport { classNameSize } from './utils.js';\nimport {\n  Root,\n  FlexContainer,\n  Divider,\n  TabIndicator,\n  VerticalWrap,\n  INITIAL_STYLE,\n} from './Tabs.styles.js';\nimport { ButtonVariant, LineVariant } from '../Tab/types.js';\nimport { useIsomorphicEffect } from '../utils/useIsomorphicEffect.js';\n\nexport interface Props extends ComponentPropsWithoutRef<typeof Root> {\n  /** Размер Tab */\n  size?: TabProps['size'];\n  /** Линейный или кнопочный Tab */\n  tabType?: TabProps['tabType'];\n  /** Варианты отображения кнопочного Tab */\n  buttonVariant?: ButtonVariant;\n  /** Варианты отображения линейного Tab */\n  lineVariant?: LineVariant;\n  /** Растяжение компонента по ширине контейнера */\n  fullWidth?: boolean;\n  /** Выбранный Tab */\n  value?: any;\n  /** Обработчик выбора Tab */\n  onChange?: TabProps['onChange'];\n  /** from HTMLButtonElement */\n  disabled?: boolean;\n  /** Отображать ли полосу для линейных Tab */\n  withDivider?: boolean;\n  /** Дочерние Tab элементы */\n  children: ReactElement<TabProps>[];\n  /** Параметры для полосы активного Tab */\n  tabIndicatorProps?: Partial<ComponentProps<typeof TabIndicator>>;\n  /** Направление элементов */\n  vertical?: boolean;\n}\n\nconst Tabs = ({\n  size = 'm',\n  tabType = 'line',\n  fullWidth,\n  value: valueProp,\n  onChange,\n  disabled,\n  withDivider,\n  children: childrenProp,\n  tabIndicatorProps = {},\n  vertical: verticalProp,\n  lineVariant,\n  buttonVariant,\n  ...rootProps\n}: Props) => {\n  const vertical = verticalProp && tabType === 'line';\n  const valueToIndexRef = useRef(new Map<any, number>());\n  const containerRef = useRef<HTMLDivElement | null>(null);\n\n  const [indicatorStyle, setIndicatorStyle] = useState<CSSProperties>(INITIAL_STYLE);\n\n  const valueRef = useRef(valueProp);\n  if (valueProp !== valueRef.current) {\n    valueRef.current = valueProp;\n  }\n\n  const updateIndicatorState = useCallback((value?: any) => {\n    const container = containerRef.current;\n    if (!container) {\n      return;\n    }\n\n    const containerRect = container.getBoundingClientRect();\n    const tabIndex = valueToIndexRef.current.get(value);\n    const tab = tabIndex !== undefined && container.children[tabIndex];\n    if (!tab) {\n      return;\n    }\n\n    const tabRect = tab.getBoundingClientRect();\n\n    if (vertical) {\n      const style = {\n        top: Math.round(tabRect.top - containerRect.top + container.scrollTop),\n        height: Math.round(tabRect.height),\n      };\n\n      setIndicatorStyle((prevStyle) => {\n        const prevComparison =\n          !prevStyle || style.top !== prevStyle.top || style.height !== prevStyle.height;\n        return prevComparison && !Number.isNaN(style.top) && !Number.isNaN(style.height)\n          ? style\n          : prevStyle;\n      });\n    } else {\n      const style = {\n        left: Math.round(tabRect.left - containerRect.left + container.scrollLeft),\n        width: Math.round(tabRect.width),\n      };\n\n      setIndicatorStyle((prevStyle) => {\n        const prevComparison =\n          !prevStyle || style.left !== prevStyle.left || style.width !== prevStyle.width;\n        return prevComparison && !Number.isNaN(style.left) && !Number.isNaN(style.width)\n          ? style\n          : prevStyle;\n      });\n    }\n  }, [vertical]);\n\n  useIsomorphicEffect(() => {\n    const handleResize = debounce(() => updateIndicatorState(valueRef.current), 166);\n\n    const container = containerRef.current;\n    if ('ResizeObserver' in window && container) {\n      const resizeObserver = new window.ResizeObserver(() => {\n        handleResize();\n      });\n      resizeObserver.observe(container);\n\n      return () => {\n        handleResize.cancel();\n        resizeObserver.disconnect();\n      };\n    }\n\n    window.addEventListener('resize', handleResize);\n    return () => {\n      handleResize.cancel();\n      window.removeEventListener('resize', handleResize);\n    };\n  }, [updateIndicatorState]);\n\n  const additionalClassNames = classnames(\n    classNameSize(size),\n    { withDivider, vertical, fullWidth },\n  );\n  valueToIndexRef.current.clear();\n  let childrenStr = '';\n  let childIndex = 0;\n  const children = Children.map(childrenProp, (child) => {\n    if (!isValidElement(child)) {\n      return null;\n    }\n\n    const childValue = child.props.value === undefined ? childIndex : child.props.value;\n    valueToIndexRef.current.set(childValue, childIndex);\n\n    const childProps = {\n      fullWidth,\n      size,\n      tabType,\n      lineVariant,\n      buttonVariant,\n      onChange,\n      disabled,\n      selected: childValue === valueProp,\n      vertical,\n      ...child.props,\n      value: childValue,\n    };\n\n    childrenStr += typeof child.props.children === 'string' ? child.props.children : '';\n    childIndex += 1;\n    if (vertical) {\n      return (\n        <VerticalWrap className={additionalClassNames}>\n          <child.type {...childProps} />\n        </VerticalWrap>\n      );\n    }\n\n    return <child.type {...childProps} />;\n  });\n\n  useIsomorphicEffect(() => {\n    updateIndicatorState(valueProp);\n  }, [updateIndicatorState, valueProp, fullWidth, vertical, childrenStr]);\n\n  return (\n    <Root\n      role=\"tablist\"\n      {...rootProps}\n      className={classnames(additionalClassNames, rootProps.className)}\n    >\n      <FlexContainer ref={containerRef} className={additionalClassNames}>\n        {children}\n      </FlexContainer>\n      {tabType === 'line' && (\n        <Divider className={additionalClassNames}>\n          <TabIndicator\n            {...tabIndicatorProps}\n            className={\n              classnames(\n                tabIndicatorProps.className,\n                additionalClassNames,\n                lineVariant,\n              )\n            }\n            style={{ ...indicatorStyle, ...tabIndicatorProps.style }}\n          />\n        </Divider>\n      )}\n    </Root>\n  );\n};\n\nexport default memo(Tabs);\n"],"names":["Tabs","size","tabType","fullWidth","valueProp","onChange","disabled","withDivider","childrenProp","tabIndicatorProps","verticalProp","lineVariant","buttonVariant","rootProps","vertical","valueToIndexRef","useRef","Map","containerRef","indicatorStyle","setIndicatorStyle","useState","INITIAL_STYLE","valueRef","updateIndicatorState","useCallback","value","container","containerRect","tabIndex","tab","undefined","tabRect","style","Math","prevStyle","prevComparison","Number","useIsomorphicEffect","handleResize","debounce","window","resizeObserver","additionalClassNames","classnames","classNameSize","childrenStr","childIndex","children","Children","child","isValidElement","childValue","childProps","VerticalWrap","Root","FlexContainer","Divider","TabIndicator","memo"],"mappings":"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"}

package/dist/Tabs/Tabs.styles.js

@@ -1,30 +1,36 @@
-import { styled } from '@linaria/react';
-export const INITIAL_STYLE = { width: 0, height: 0, left: 0, top: 0 };
-export const Root = /*#__PURE__*/styled('div')({
+import { styled } from "@linaria/react";
+const INITIAL_STYLE = {
+    width: 0,
+    height: 0,
+    left: 0,
+    top: 0
+};
+const Root = /*#__PURE__*/styled('div')({
   name: "Root",
   class: "ui_components_rzizmhz",
   propsAsIs: false
 });
-export const FlexContainer = /*#__PURE__*/styled('div')({
+const FlexContainer = /*#__PURE__*/styled('div')({
   name: "FlexContainer",
   class: "ui_components_f12h90sh",
   propsAsIs: false
 });
-export const VerticalWrap = /*#__PURE__*/styled('div')({
+const VerticalWrap = /*#__PURE__*/styled('div')({
   name: "VerticalWrap",
   class: "ui_components_v10d48ii",
   propsAsIs: false
 });
-export const Divider = /*#__PURE__*/styled('div')({
+const Divider = /*#__PURE__*/styled('div')({
   name: "Divider",
   class: "ui_components_dxjleo3",
   propsAsIs: false
 });
-export const TabIndicator = /*#__PURE__*/styled('span')({
+const TabIndicator = /*#__PURE__*/styled('span')({
   name: "TabIndicator",
   class: "ui_components_t15t8a4t",
   propsAsIs: false
 });
+export { Divider, FlexContainer, INITIAL_STYLE, Root, TabIndicator, VerticalWrap };
 //# sourceMappingURL=Tabs.styles.js.map
 
 import "./Tabs.styles.css";

package/dist/Tabs/Tabs.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs.styles.js","sourceRoot":"","sources":["../../src/Tabs/Tabs.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAC;AACxC,OAAO,EAAE,MAAM,EAAE,MAAM,uCAAuC,CAAC;AAC/D,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAE3C,MAAM,CAAC,MAAM,aAAa,GAAG,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,CAAC;AAEtE,MAAM,CAAC,MAAM,IAAI,GAAG,MAAM,CAAC,GAAG,CAAA;;;;CAI7B,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;;;CAYtC,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG,MAAM,CAAC,GAAG,CAAA;gBACtB,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC;;;;;kBAKnB,MAAM,CAAC,OAAO,CAAC,EAAE;;;MAG7B,aAAa,CAAC,GAAG,CAAC,OAAO,aAAa,CAAC,IAAI,CAAC;kBAChC,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC;;;MAGjC,aAAa,CAAC,GAAG,CAAC;uBACD,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC;;;MAGjE,aAAa,CAAC,IAAI,CAAC;kBACP,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC;;;oBAGnB,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC;;;CAGxC,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;+BAKF,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,OAAO;;;;6BAI3C,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,OAAO;;;;;;;;;;;CAWrE,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG,MAAM,CAAC,IAAI,CAAA;;;;sBAIjB,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,OAAO,CAAC,MAAM;;;wBAGvC,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,OAAO;;;;wBAI3C,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO;;;;aAIjD,aAAa,CAAC,KAAK;;;YAGpB,aAAa,CAAC,IAAI;;;;;cAKhB,aAAa,CAAC,MAAM;WACvB,aAAa,CAAC,GAAG;;;CAG3B,CAAC"}
+{"version":3,"file":"Tabs/Tabs.styles.js","sources":["../../src/Tabs/Tabs.styles.ts"],"sourcesContent":["import { styled } from '@linaria/react';\nimport { tokens } from '@finam/web-ui-kit-core/theme/contract';\nimport { classNameSize } from './utils.js';\n\nexport const INITIAL_STYLE = { width: 0, height: 0, left: 0, top: 0 };\n\nexport const Root = styled.div`\n  &.vertical {\n    display: flex;\n  }\n`;\n\nexport const FlexContainer = styled.div`\n  &.fullWidth {\n    flex: 1;\n  }\n\n  &:not(.vertical) {\n    display: flex;\n  }\n\n  &.vertical {\n    order: 2;\n  }\n`;\n\nexport const VerticalWrap = styled.div`\n  min-height: ${tokens.spacing['4xl']};\n  display: flex;\n  align-items: center;\n\n  & + & {\n    margin-top: ${tokens.spacing.xs};\n  }\n\n  &.${classNameSize('l')}, &.${classNameSize('xl')} {\n    min-height: ${tokens.spacing['5xl']};\n  }\n\n  &.${classNameSize('s')} {\n    min-height: calc(${tokens.spacing['3xl']} + ${tokens.spacing['2xs']});\n  }\n\n  &.${classNameSize('xs')} {\n    min-height: ${tokens.spacing['3xl']};\n\n    & + & {\n      margin-top: ${tokens.spacing['2xs']};\n    }\n  }\n`;\n\nexport const Divider = styled.div`\n  flex-shrink: 0;\n  position: relative;\n\n  &.withDivider:not(.vertical) {\n    border-bottom: 1px solid ${tokens.colors.border.base.default.default};\n  }\n\n  &.withDivider.vertical {\n    border-left: 1px solid ${tokens.colors.border.base.default.default};\n  }\n\n  &:not(.vertical) {\n    height: 4px;\n  }\n\n  &.vertical {\n    order: 1;\n    width: 4px;\n  }\n`;\n\nexport const TabIndicator = styled.span`\n  position: absolute;\n  transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n  border-radius: inherit;\n  background-color: ${tokens.colors.border.brand.default.active};\n\n  &.ondarkSecondary {\n    background-color: ${tokens.colors.border.ondark.default.default};\n  }\n\n  &.alternative {\n    background-color: ${tokens.colors.border.base.bold.default};\n  }\n\n  &:not(.vertical) {\n    width: ${INITIAL_STYLE.width}px;\n    height: 100%;\n    top: 1px;\n    left: ${INITIAL_STYLE.left}px;\n  }\n\n  &.vertical {\n    width: 100%;\n    height: ${INITIAL_STYLE.height}px;\n    top: ${INITIAL_STYLE.top}px;\n    left: -1px;\n  }\n`;\n"],"names":["INITIAL_STYLE","Root","styled","FlexContainer","VerticalWrap","tokens","classNameSize","Divider","TabIndicator"],"mappings":";;;AAIO,MAAMA,gBAAgB;IAAE,OAAO;IAAG,QAAQ;IAAG,MAAM;IAAG,KAAK;AAAE;AAE7D,MAAMC,OAAOC,OAAO,GAAG,CAAC;;;;AAI/B,CAAC;AAEM,MAAMC,gBAAgBD,OAAO,GAAG,CAAC;;;;;;;;;;;;AAYxC,CAAC;AAEM,MAAME,eAAeF,OAAO,GAAG,CAAC;cACzB,EAAEG,OAAO,OAAO,CAAC,MAAM,CAAC;;;;;gBAKtB,EAAEA,OAAO,OAAO,CAAC,EAAE,CAAC;;;IAGhC,EAAEC,cAAc,KAAK,IAAI,EAAEA,cAAc,MAAM;gBACnC,EAAED,OAAO,OAAO,CAAC,MAAM,CAAC;;;IAGpC,EAAEC,cAAc,KAAK;qBACJ,EAAED,OAAO,OAAO,CAAC,MAAM,CAAC,GAAG,EAAEA,OAAO,OAAO,CAAC,MAAM,CAAC;;;IAGpE,EAAEC,cAAc,MAAM;gBACV,EAAED,OAAO,OAAO,CAAC,MAAM,CAAC;;;kBAGtB,EAAEA,OAAO,OAAO,CAAC,MAAM,CAAC;;;AAG1C,CAAC;AAEM,MAAME,UAAUL,OAAO,GAAG,CAAC;;;;;6BAKL,EAAEG,OAAO,MAAM,CAAC,MAAM,CAAC,IAAI,CAAzBA,UAAAA,CAAAA,UAAyC,CAAC;;;;2BAI9C,EAAEA,OAAO,MAAM,CAAC,MAAM,CAAC,IAAI,CAAzBA,UAAAA,CAAAA,UAAyC,CAAC;;;;;;;;;;;AAWvE,CAAC;AAEM,MAAMG,eAAeN,OAAO,IAAI,CAAC;;;;oBAIpB,EAAEG,OAAO,MAAM,CAAC,MAAM,CAAC,KAAK,CAA1BA,UAAAA,CAAAA,MAAyC,CAAC;;;sBAG1C,EAAEA,OAAO,MAAM,CAAC,MAAM,CAAC,MAAM,CAA3BA,UAAAA,CAAAA,UAA2C,CAAC;;;;sBAI9C,EAAEA,OAAO,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAA9BA,UAAsC,CAAC;;;;WAIpD,EAAEL,cAAc,KAAK,CAAC;;;UAGvB,EAAEA,cAAc,IAAI,CAAC;;;;;YAKnB,EAAEA,cAAc,MAAM,CAAC;SAC1B,EAAEA,cAAc,GAAG,CAAC;;;AAG7B,CAAC"}

package/dist/Tabs/index.js

@@ -1,3 +1,5 @@
-import Tabs from './Tabs.js';
-export default Tabs;
+import Tabs from "./Tabs.js";
+const src_Tabs = Tabs;
+export default src_Tabs;
+
 //# sourceMappingURL=index.js.map

package/dist/Tabs/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/Tabs/index.ts"],"names":[],"mappings":"AAAA,OAAO,IAAe,MAAM,WAAW,CAAC;AAGxC,eAAe,IAAI,CAAC"}
+{"version":3,"file":"Tabs/index.js","sources":["../../src/Tabs/index.ts"],"sourcesContent":["import Tabs, { Props } from './Tabs.js';\n\nexport type { Props as TabsProps };\nexport default Tabs;\n"],"names":["Tabs"],"mappings":";AAGA,iBAAeA"}

package/dist/Tabs/utils.js

@@ -1,3 +1,5 @@
-import { mapPropClassName } from '../utils/className.js';
-export const classNameSize = (size) => mapPropClassName('size', size);
+import { mapPropClassName } from "../utils/className.js";
+const classNameSize = (size)=>mapPropClassName('size', size);
+export { classNameSize };
+
 //# sourceMappingURL=utils.js.map

package/dist/Tabs/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../src/Tabs/utils.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAEzD,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,IAAU,EAAE,EAAE,CAAC,gBAAgB,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC"}
+{"version":3,"file":"Tabs/utils.js","sources":["../../src/Tabs/utils.ts"],"sourcesContent":["import { Size } from '../Tab/types.js';\nimport { mapPropClassName } from '../utils/className.js';\n\nexport const classNameSize = (size: Size) => mapPropClassName('size', size);\n"],"names":["classNameSize","size","mapPropClassName"],"mappings":";AAGO,MAAMA,gBAAgB,CAACC,OAAeC,iBAAiB,QAAQD"}

package/dist/Tag/Tag.js

@@ -1,41 +1,80 @@
-import { __rest } from "tslib";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, useCallback } from 'react';
-import classnames from 'clsx';
-import { tag, tagIconWrapper } from '@finam/web-ui-kit-core/styles/tag';
-import { iconButton } from './Tag.styles.js';
-import { KeyboardEventKey } from '../types.js';
-const Tag = forwardRef((_a, ref) => {
-    var { children, color = 'info', colorType = 'default', priority = 'high', variant = 'fill', size = 'm', icon, iconPlacement = 'left', className, onClick, onIconClick } = _a, props = __rest(_a, ["children", "color", "colorType", "priority", "variant", "size", "icon", "iconPlacement", "className", "onClick", "onIconClick"]);
+import { _ } from "@swc/helpers/_/_object_spread";
+import { _ as _object_spread_props__ } from "@swc/helpers/_/_object_spread_props";
+import { _ as _object_without_properties__ } from "@swc/helpers/_/_object_without_properties";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { forwardRef, useCallback } from "react";
+import clsx from "clsx";
+import { tag, tagIconWrapper } from "@finam/web-ui-kit-core/styles/tag";
+import { iconButton } from "./Tag.styles.js";
+import { KeyboardEventKey } from "../types.js";
+const Tag = /*#__PURE__*/ forwardRef((_0, _1)=>{
+    let _ref = [
+        _0,
+        _1
+    ], [_ref1, ..._rest] = _ref, { children, color = 'info', colorType = 'default', priority = 'high', variant = 'fill', size = 'm', icon, iconPlacement = 'left', className, onClick, onIconClick } = _ref1, props = _object_without_properties__(_ref1, [
+        "children",
+        "color",
+        "colorType",
+        "priority",
+        "variant",
+        "size",
+        "icon",
+        "iconPlacement",
+        "className",
+        "onClick",
+        "onIconClick"
+    ]), [ref] = _rest;
     const iconOnly = Boolean(icon && !children);
-    const tagClassName = classnames(className, tag({
+    const tagClassName = clsx(className, tag({
         color,
         colorType,
         priority,
         variant,
         size,
         iconOnly,
-        clickable: Boolean(onClick),
+        clickable: Boolean(onClick)
     }));
-    const handleIconClick = useCallback((event) => {
+    const handleIconClick = useCallback((event)=>{
         event.stopPropagation();
-        onIconClick === null || onIconClick === void 0 ? void 0 : onIconClick();
-    }, [onIconClick]);
-    const handleIconKeyDown = useCallback((event) => {
+        null == onIconClick || onIconClick();
+    }, [
+        onIconClick
+    ]);
+    const handleIconKeyDown = useCallback((event)=>{
         if (event.key === KeyboardEventKey.ENTER || event.key === KeyboardEventKey.SPACE) {
             event.stopPropagation();
-            onIconClick === null || onIconClick === void 0 ? void 0 : onIconClick();
+            null == onIconClick || onIconClick();
         }
-    }, [onIconClick]);
-    const renderIcon = (wrapperClassName) => {
-        if (onIconClick) {
-            return (_jsx("span", { role: "button", tabIndex: 0, onKeyDown: handleIconKeyDown, className: classnames(wrapperClassName, iconButton), onClick: handleIconClick, children: icon }));
-        }
-        return _jsx("span", { className: wrapperClassName, children: icon });
+    }, [
+        onIconClick
+    ]);
+    const renderIcon = (wrapperClassName)=>{
+        if (onIconClick) return /*#__PURE__*/ jsx("span", {
+            role: "button",
+            tabIndex: 0,
+            onKeyDown: handleIconKeyDown,
+            className: clsx(wrapperClassName, iconButton),
+            onClick: handleIconClick,
+            children: icon
+        });
+        return /*#__PURE__*/ jsx("span", {
+            className: wrapperClassName,
+            children: icon
+        });
     };
-    return (
-    // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions
-    _jsxs("span", Object.assign({ className: tagClassName, ref: ref, onClick: onClick }, props, { children: [iconPlacement === 'left' && icon && children && renderIcon(tagIconWrapper.left), iconOnly ? renderIcon(tagIconWrapper.center) : children, iconPlacement === 'right' && icon && children && renderIcon(tagIconWrapper.right)] })));
+    return /*#__PURE__*/ jsxs("span", _object_spread_props__(_({
+        className: tagClassName,
+        ref: ref,
+        onClick: onClick
+    }, props), {
+        children: [
+            'left' === iconPlacement && icon && children && renderIcon(tagIconWrapper.left),
+            iconOnly ? renderIcon(tagIconWrapper.center) : children,
+            'right' === iconPlacement && icon && children && renderIcon(tagIconWrapper.right)
+        ]
+    }));
 });
-export default Tag;
+const Tag_Tag = Tag;
+export default Tag_Tag;
+
 //# sourceMappingURL=Tag.js.map