@redneckz/wildless-cms-uni-blocks 0.4.2 → 0.4.3

package/mobile/dist/ui-kit/BlockWrapper.js.map

@@ -1 +1 @@
-{"version":3,"file":"BlockWrapper.js","sourceRoot":"","sources":["../../src/ui-kit/BlockWrapper.tsx"],"names":[],"mappings":";;;AAAA,+CAAwC;AACxC,uDAAkE;AAElE,mDAAgD;AAEhD,sEAAmE;AAStD,QAAA,YAAY,GAAG,IAAA,aAAG,EAC7B,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,GAAG,SAAS,EAAE,MAAM,EAAE,EAAE,EAAE;IACpE,MAAM,GAAG,GAAQ,GAAG,CAAC;IAErB,MAAM,EAAE,uBAAuB,EAAE,GAAG,OAAO,CAAC;IAC5C,MAAM,CAAC,iBAAiB,EAAE,oBAAoB,CAAC,GAAG,IAAA,gBAAQ,EAAC,IAAI,CAAC,CAAC;IAEjE,IAAA,iBAAS,EACP,GAAG,EAAE,CACH,mBAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,EAAE,CAAC,KAAK,EAAE,EAAE;QACvC,oBAAoB,CAAC,CAAC,MAAM,EAAE,MAAM,IAAI,CAAC,KAAK,CAAC,KAAK,IAAI,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC;IACxF,CAAC,CAAC,EACJ,CAAC,MAAM,CAAC,CACT,CAAC;IAEF,IAAI,CAAC,iBAAiB,EAAE;QACtB,OAAO,IAAI,CAAC;KACb;IAED,OAAO,MAAM,CAAC,CAAC,CAAC,CACd,uBAAC,uBAAuB,IACtB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,SAAS,EACpB,gBAAgB,EAAE,yCAAmB,EACrC,eAAe,EAAE,EAAE,SAAS,EAAE,CAAC,EAAE,EACjC,MAAM,EAAE,MAAM,YAEb,QAAQ,GACe,CAC3B,CAAC,CAAC,CAAC,CACF,uBAAC,GAAG,IAAC,SAAS,EAAE,SAAS,YAAG,QAAQ,GAAO,CAC5C,CAAC;AACJ,CAAC,CACF,CAAC"}
+{"version":3,"file":"BlockWrapper.js","sourceRoot":"","sources":["../../src/ui-kit/BlockWrapper.tsx"],"names":[],"mappings":";;;AAAA,+CAAwC;AACxC,uDAAkE;AAElE,mDAAgD;AAEhD,sEAAmE;AAStD,QAAA,YAAY,GAAG,IAAA,aAAG,EAC7B,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,GAAG,SAAS,EAAE,MAAM,EAAE,EAAE,EAAE;IACpE,MAAM,GAAG,GAAQ,GAAG,CAAC;IAErB,MAAM,EAAE,uBAAuB,EAAE,GAAG,OAAO,CAAC;IAC5C,MAAM,CAAC,iBAAiB,EAAE,oBAAoB,CAAC,GAAG,IAAA,gBAAQ,EAAC,IAAI,CAAC,CAAC;IAEjE,IAAA,iBAAS,EACP,GAAG,EAAE,CACH,mBAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,EAAE,CAAC,KAAK,EAAE,EAAE;QACvC,IAAI,KAAK,CAAC,IAAI,KAAK,OAAO,EAAE;YAC1B,oBAAoB,CAAC,CAAC,MAAM,EAAE,MAAM,IAAI,CAAC,KAAK,CAAC,KAAK,IAAI,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC;SACvF;aAAM;YACL,oBAAoB,CAAC,IAAI,CAAC,CAAC;YAC3B,aAAa,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;SAC5B;IACH,CAAC,CAAC,EACJ,CAAC,MAAM,CAAC,CACT,CAAC;IAEF,IAAI,CAAC,iBAAiB,EAAE;QACtB,OAAO,IAAI,CAAC;KACb;IAED,OAAO,MAAM,CAAC,CAAC,CAAC,CACd,uBAAC,uBAAuB,IACtB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,SAAS,EACpB,gBAAgB,EAAE,yCAAmB,EACrC,eAAe,EAAE,EAAE,SAAS,EAAE,CAAC,EAAE,EACjC,MAAM,EAAE,MAAM,YAEb,QAAQ,GACe,CAC3B,CAAC,CAAC,CAAC,CACF,uBAAC,GAAG,IAAC,SAAS,EAAE,SAAS,YAAG,QAAQ,GAAO,CAC5C,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,SAAS,aAAa,CAAC,KAAc;IACnC,UAAU,CAAC,GAAG,EAAE,CACd,UAAU,CAAC,QAAQ,CAAC,cAAc,CAAC,IAAI,KAAK,EAAE,CAAC,EAAE,cAAc,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC,CACxF,CAAC;AACJ,CAAC"}

package/mobile/lib/components/Tabs/Tabs.d.ts

@@ -1,6 +1,7 @@
 import type { UniBlockProps } from '../../types';
-import type { TabsContent } from './TabsContent';
+import type { TabsContent, TabType } from './TabsContent';
 export interface TabActivationEvent {
+    type?: TabType;
     label?: string;
 }
 export interface TabsProps extends TabsContent, UniBlockProps {

package/mobile/lib/components/Tabs/Tabs.js

@@ -7,11 +7,11 @@ import { renderTab } from './renderTab.js';
 export const Tabs = JSX((props) => {
     const { context, className, tabs, page, showCounter } = props;
     const [currentTab, setCurrentTab] = useState(tabs ? tabs[0] : undefined);
-    useEffect(() => EventBus.inst.subject('tab', { label: currentTab?.id }), [currentTab]);
+    useEffect(() => EventBus.inst.subject('tab', { label: currentTab?.ref }), [currentTab]);
     const handleClick = (selectedTab) => {
-        EventBus.inst.fire('tab', { label: selectedTab.id });
+        EventBus.inst.fire('tab', { type: selectedTab.type, label: selectedTab.ref });
         setCurrentTab(selectedTab);
     };
-    return (_jsx(BlockWrapper, { context: context, className: `mb-2 box-border flex gap-x-1 ${className}`, role: "tablist", children: tabs?.map(renderTab({ onClick: handleClick, currentTab, page, showCounter })) }));
+    return (_jsx(BlockWrapper, { context: context, className: `mb-2 box-border flex gap-x-1 ${className}`, role: "tablist", children: tabs?.map(renderTab({ onClick: handleClick, currentTab, page, showCounter, context })) }));
 });
 //# sourceMappingURL=Tabs.js.map

package/mobile/lib/components/Tabs/Tabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs.js","sourceRoot":"","sources":["../../../src/components/Tabs/Tabs.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AACxC,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAClE,OAAO,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AAEnD,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AASxC,MAAM,CAAC,MAAM,IAAI,GAAG,GAAG,CAAY,CAAC,KAAK,EAAE,EAAE;IAC3C,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,WAAW,EAAE,GAAG,KAAK,CAAC;IAE9D,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC;IAEzE,SAAS,CAAC,GAAG,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,UAAU,EAAE,EAAE,EAAE,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC;IAEvF,MAAM,WAAW,GAAG,CAAC,WAAgB,EAAE,EAAE;QACvC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,WAAW,CAAC,EAAE,EAAE,CAAC,CAAC;QACrD,aAAa,CAAC,WAAW,CAAC,CAAC;IAC7B,CAAC,CAAC;IAEF,OAAO,CACL,KAAC,YAAY,IACX,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,gCAAgC,SAAS,EAAE,EACtD,IAAI,EAAC,SAAS,YAEb,IAAI,EAAE,GAAG,CAAC,SAAS,CAAC,EAAE,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,IAAI,EAAE,WAAW,EAAE,CAAC,CAAC,GACjE,CAChB,CAAC;AACJ,CAAC,CAAC,CAAC"}
+{"version":3,"file":"Tabs.js","sourceRoot":"","sources":["../../../src/components/Tabs/Tabs.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AACxC,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAClE,OAAO,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AAEnD,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAUxC,MAAM,CAAC,MAAM,IAAI,GAAG,GAAG,CAAY,CAAC,KAAK,EAAE,EAAE;IAC3C,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,WAAW,EAAE,GAAG,KAAK,CAAC;IAE9D,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC;IAEzE,SAAS,CAAC,GAAG,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,UAAU,EAAE,GAAG,EAAE,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC;IAExF,MAAM,WAAW,GAAG,CAAC,WAAgB,EAAE,EAAE;QACvC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE,EAAE,IAAI,EAAE,WAAW,CAAC,IAAI,EAAE,KAAK,EAAE,WAAW,CAAC,GAAG,EAAE,CAAC,CAAC;QAC9E,aAAa,CAAC,WAAW,CAAC,CAAC;IAC7B,CAAC,CAAC;IAEF,OAAO,CACL,KAAC,YAAY,IACX,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,gCAAgC,SAAS,EAAE,EACtD,IAAI,EAAC,SAAS,YAEb,IAAI,EAAE,GAAG,CAAC,SAAS,CAAC,EAAE,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,IAAI,EAAE,WAAW,EAAE,OAAO,EAAE,CAAC,CAAC,GAC1E,CAChB,CAAC;AACJ,CAAC,CAAC,CAAC"}

package/mobile/lib/components/Tabs/TabsContent.d.ts

@@ -1,9 +1,15 @@
+export declare type TabType = 'group' | 'link';
 /**
  *  @title Таб
  */
 export interface Tab {
-    /** @title Tег */
-    id?: string;
+    /** @title Тег или ссылка */
+    ref?: string;
+    /**
+     * @title Тип
+     * @enumNames ['Группирующий', 'Ссылочный']
+     */
+    type?: TabType;
     /** @title Название */
     title?: string;
 }

package/mobile/lib/components/Tabs/renderGroupTab.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { RenderTabProps } from './renderTab';
+import { Tab } from './TabsContent';
+export declare const renderGroupTab: ({ onClick, currentTab, showCounter, page }: RenderTabProps) => (tab: Tab, i: number) => JSX.Element;

package/mobile/lib/components/Tabs/renderGroupTab.js

@@ -0,0 +1,15 @@
+import { jsxs as _jsxs, jsx as _jsx } from "@redneckz/uni-jsx/jsx-runtime";
+import { ACTIVE_LINK_CLASSES, ACTIVE_TEXT_CLASSES, INACTIVE_LINK_CLASSES, INACTIVE_TEXT_CLASSES, LINK_CLASSES, TEXT_CLASSES, } from './tabItemClasses.js';
+const BADGE_CLASSES = 'min-w-[22px] w-[22px] h-[22px] rounded-full text-xs ml-2';
+const ACTIVE_BADGE_CLASSES = 'bg-white/30 text-white';
+const INACTIVE_BADGE_CLASSES = 'bg-main-divider text-secondary-text group-hover:text-primary-main';
+export const renderGroupTab = ({ onClick, currentTab, showCounter, page }) => (tab, i) => {
+    const active = currentTab === tab;
+    const count = tab.ref
+        ? page?.blocks?.filter((block) => block?.labels?.includes(tab.ref)).length
+        : page?.blocks?.length;
+    return (_jsx("div", { className: `${LINK_CLASSES} ${active ? ACTIVE_LINK_CLASSES : INACTIVE_LINK_CLASSES}`, role: "tab", "aria-selected": active, onClick: () => onClick(tab), children: _jsxs("div", { className: "flex flex-1 items-center justify-center", children: [tab?.title ? renderTitle(tab.title, active) : null, showCounter && count ? renderCount(count, active) : null] }) }, String(i)));
+};
+const renderTitle = (title, active) => (_jsx("h3", { className: `${TEXT_CLASSES} ${active ? ACTIVE_TEXT_CLASSES : INACTIVE_TEXT_CLASSES}`, children: title }));
+const renderCount = (count, active) => (_jsx("div", { className: `${BADGE_CLASSES} ${active ? ACTIVE_BADGE_CLASSES : INACTIVE_BADGE_CLASSES}`, children: count }));
+//# sourceMappingURL=renderGroupTab.js.map

package/mobile/lib/components/Tabs/renderGroupTab.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"renderGroupTab.js","sourceRoot":"","sources":["../../../src/components/Tabs/renderGroupTab.tsx"],"names":[],"mappings":";AACA,OAAO,EACL,mBAAmB,EACnB,mBAAmB,EACnB,qBAAqB,EACrB,qBAAqB,EACrB,YAAY,EACZ,YAAY,GACb,MAAM,kBAAkB,CAAC;AAG1B,MAAM,aAAa,GAAG,0DAA0D,CAAC;AACjF,MAAM,oBAAoB,GAAG,wBAAwB,CAAC;AACtD,MAAM,sBAAsB,GAAG,mEAAmE,CAAC;AAEnG,MAAM,CAAC,MAAM,cAAc,GACzB,CAAC,EAAE,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,IAAI,EAAkB,EAAE,EAAE,CAC/D,CAAC,GAAQ,EAAE,CAAS,EAAE,EAAE;IACtB,MAAM,MAAM,GAAG,UAAU,KAAK,GAAG,CAAC;IAElC,MAAM,KAAK,GAAG,GAAG,CAAC,GAAG;QACnB,CAAC,CAAC,IAAI,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,QAAQ,CAAC,GAAG,CAAC,GAAa,CAAC,CAAC,CAAC,MAAM;QACpF,CAAC,CAAC,IAAI,EAAE,MAAM,EAAE,MAAM,CAAC;IAEzB,OAAO,CACL,cAEE,SAAS,EAAE,GAAG,YAAY,IAAI,MAAM,CAAC,CAAC,CAAC,mBAAmB,CAAC,CAAC,CAAC,qBAAqB,EAAE,EACpF,IAAI,EAAC,KAAK,mBACK,MAAM,EACrB,OAAO,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,GAAG,CAAC,YAE3B,eAAK,SAAS,EAAC,yCAAyC,aACrD,GAAG,EAAE,KAAK,CAAC,CAAC,CAAC,WAAW,CAAC,GAAG,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC,IAAI,EAClD,WAAW,IAAI,KAAK,CAAC,CAAC,CAAC,WAAW,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC,IAAI,IACrD,IATD,MAAM,CAAC,CAAC,CAAC,CAUV,CACP,CAAC;AACJ,CAAC,CAAC;AAEJ,MAAM,WAAW,GAAG,CAAC,KAAa,EAAE,MAAe,EAAE,EAAE,CAAC,CACtD,aAAI,SAAS,EAAE,GAAG,YAAY,IAAI,MAAM,CAAC,CAAC,CAAC,mBAAmB,CAAC,CAAC,CAAC,qBAAqB,EAAE,YACrF,KAAK,GACH,CACN,CAAC;AAEF,MAAM,WAAW,GAAG,CAAC,KAAa,EAAE,MAAe,EAAE,EAAE,CAAC,CACtD,cAAK,SAAS,EAAE,GAAG,aAAa,IAAI,MAAM,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,sBAAsB,EAAE,YACzF,KAAK,GACF,CACP,CAAC"}

package/mobile/lib/components/Tabs/renderLinkTab.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import type { LinkProps } from '../../model/LinkProps';
+export interface RenderLinkTabProps extends LinkProps {
+    active?: boolean;
+    onClick?: () => void;
+    i: number;
+}
+export declare const renderLinkTab: ({ text, onClick, href, target, i }: RenderLinkTabProps) => JSX.Element;

package/mobile/lib/components/Tabs/renderLinkTab.js

@@ -0,0 +1,4 @@
+import { jsx as _jsx } from "@redneckz/uni-jsx/jsx-runtime";
+import { INACTIVE_LINK_CLASSES, INACTIVE_TEXT_CLASSES, LINK_CLASSES, TEXT_CLASSES, } from './tabItemClasses.js';
+export const renderLinkTab = ({ text, onClick, href, target = '_self', i }) => (_jsx("a", { className: `${LINK_CLASSES} ${INACTIVE_LINK_CLASSES}`, target: target, href: href, onClick: onClick, children: _jsx("span", { className: `${TEXT_CLASSES} ${INACTIVE_TEXT_CLASSES}`, children: text }) }, String(i)));
+//# sourceMappingURL=renderLinkTab.js.map

package/mobile/lib/components/Tabs/renderLinkTab.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"renderLinkTab.js","sourceRoot":"","sources":["../../../src/components/Tabs/renderLinkTab.tsx"],"names":[],"mappings":";AACA,OAAO,EACL,qBAAqB,EACrB,qBAAqB,EACrB,YAAY,EACZ,YAAY,GACb,MAAM,kBAAkB,CAAC;AAQ1B,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,GAAG,OAAO,EAAE,CAAC,EAAsB,EAAE,EAAE,CAAC,CACjG,YAEE,SAAS,EAAE,GAAG,YAAY,IAAI,qBAAqB,EAAE,EACrD,MAAM,EAAE,MAAM,EACd,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,OAAO,YAEhB,eAAM,SAAS,EAAE,GAAG,YAAY,IAAI,qBAAqB,EAAE,YAAG,IAAI,GAAQ,IANrE,MAAM,CAAC,CAAC,CAAC,CAOZ,CACL,CAAC"}

package/mobile/lib/components/Tabs/renderTab.d.ts

@@ -1,12 +1,12 @@
 /// <reference types="react" />
 import type { ContentPageDef } from '../../types';
+import type { ContentPageContext } from '../ContentPage/ContentPageContext';
 import type { Tab } from './TabsContent';
-interface RenderTabProps {
-    onClick: OnTabClick;
+export interface RenderTabProps {
+    onClick: (tab: Tab) => void;
     currentTab?: Tab;
     page?: ContentPageDef;
     showCounter?: boolean;
+    context: ContentPageContext;
 }
-declare type OnTabClick = (tab: Tab) => void;
-export declare const renderTab: ({ onClick, currentTab, showCounter, page }: RenderTabProps) => (tab: Tab, i: number) => JSX.Element;
-export {};
+export declare const renderTab: ({ onClick, currentTab, showCounter, page, context }: RenderTabProps) => (tab: Tab, i: number) => JSX.Element;

package/mobile/lib/components/Tabs/renderTab.js

@@ -1,16 +1,16 @@
-import { jsx as _jsx, jsxs as _jsxs } from "@redneckz/uni-jsx/jsx-runtime";
-const badgeStyle = 'min-w-[22px] w-[22px] h-[22px] rounded-full text-xs-light ml-2';
-export const renderTab = ({ onClick, currentTab, showCounter, page }) => (tab, i) => {
-    const isActive = currentTab === tab;
-    const tabBg = isActive ? 'bg-primary-main' : 'group bg-white';
-    const tabText = `text-m-light ${isActive ? 'text-white' : 'text-secondary-text group-hover:text-primary-main'}`;
-    const counterBlockStyle = `${badgeStyle}
-      ${isActive
-        ? 'bg-white/30 text-white'
-        : 'bg-main-divider text-secondary-text group-hover:text-primary-main'}`;
-    const count = tab.id
-        ? page?.blocks?.filter((block) => block?.labels?.includes(tab.id)).length
-        : page?.blocks?.length;
-    return (_jsx("div", { className: `flex h-12 w-full flex-1 cursor-pointer mr-2 last:mr-0 box-content ${tabBg}`, role: "tab", "aria-selected": isActive, onClick: () => onClick(tab), children: _jsxs("div", { className: "flex flex-1 items-center justify-center", children: [tab?.title ? _jsx("h3", { className: tabText, children: tab?.title }) : null, showCounter ? (_jsx("div", { className: `flex items-center justify-center ${counterBlockStyle}`, children: count })) : null] }) }, String(i)));
+import { useLink } from '../../hooks/useLink.js';
+import { isURL } from '../../utils/url.js';
+import { renderGroupTab } from './renderGroupTab.js';
+import { renderLinkTab } from './renderLinkTab.js';
+export const renderTab = ({ onClick, currentTab, showCounter, page, context }) => (tab, i) => {
+    const { useRouter, handlerDecorator } = context;
+    const router = useRouter();
+    if (isURL(tab?.ref)) {
+        return renderLinkTab({
+            ...useLink({ router, handlerDecorator }, { href: tab.ref, text: tab.title }),
+            i,
+        });
+    }
+    return renderGroupTab({ onClick, currentTab, showCounter, page, context })(tab, i);
 };
 //# sourceMappingURL=renderTab.js.map

package/mobile/lib/components/Tabs/renderTab.js.map

@@ -1 +1 @@
-{"version":3,"file":"renderTab.js","sourceRoot":"","sources":["../../../src/components/Tabs/renderTab.tsx"],"names":[],"mappings":";AAYA,MAAM,UAAU,GAAG,gEAAgE,CAAC;AAEpF,MAAM,CAAC,MAAM,SAAS,GACpB,CAAC,EAAE,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,IAAI,EAAkB,EAAE,EAAE,CAC/D,CAAC,GAAQ,EAAE,CAAS,EAAE,EAAE;IACtB,MAAM,QAAQ,GAAG,UAAU,KAAK,GAAG,CAAC;IAEpC,MAAM,KAAK,GAAG,QAAQ,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,gBAAgB,CAAC;IAC9D,MAAM,OAAO,GAAG,gBACd,QAAQ,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,mDAC5B,EAAE,CAAC;IACH,MAAM,iBAAiB,GAAG,GAAG,UAAU;QAEnC,QAAQ;QACN,CAAC,CAAC,wBAAwB;QAC1B,CAAC,CAAC,mEACN,EAAE,CAAC;IAEL,MAAM,KAAK,GAAG,GAAG,CAAC,EAAE;QAClB,CAAC,CAAC,IAAI,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,QAAQ,CAAC,GAAG,CAAC,EAAY,CAAC,CAAC,CAAC,MAAM;QACnF,CAAC,CAAC,IAAI,EAAE,MAAM,EAAE,MAAM,CAAC;IAEzB,OAAO,CACL,cAEE,SAAS,EAAE,qEAAqE,KAAK,EAAE,EACvF,IAAI,EAAC,KAAK,mBACK,QAAQ,EACvB,OAAO,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,GAAG,CAAC,YAE3B,eAAK,SAAS,EAAC,yCAAyC,aACrD,GAAG,EAAE,KAAK,CAAC,CAAC,CAAC,aAAI,SAAS,EAAE,OAAO,YAAG,GAAG,EAAE,KAAK,GAAM,CAAC,CAAC,CAAC,IAAI,EAC7D,WAAW,CAAC,CAAC,CAAC,CACb,cAAK,SAAS,EAAE,oCAAoC,iBAAiB,EAAE,YAAG,KAAK,GAAO,CACvF,CAAC,CAAC,CAAC,IAAI,IACJ,IAXD,MAAM,CAAC,CAAC,CAAC,CAYV,CACP,CAAC;AACJ,CAAC,CAAC"}
+{"version":3,"file":"renderTab.js","sourceRoot":"","sources":["../../../src/components/Tabs/renderTab.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAE9C,OAAO,EAAE,KAAK,EAAE,MAAM,iBAAiB,CAAC;AAExC,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAWhD,MAAM,CAAC,MAAM,SAAS,GACpB,CAAC,EAAE,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,IAAI,EAAE,OAAO,EAAkB,EAAE,EAAE,CACxE,CAAC,GAAQ,EAAE,CAAS,EAAE,EAAE;IACtB,MAAM,EAAE,SAAS,EAAE,gBAAgB,EAAE,GAAG,OAAO,CAAC;IAChD,MAAM,MAAM,GAAG,SAAS,EAAE,CAAC;IAE3B,IAAI,KAAK,CAAC,GAAG,EAAE,GAAG,CAAC,EAAE;QACnB,OAAO,aAAa,CAAC;YACnB,GAAG,OAAO,CAAC,EAAE,MAAM,EAAE,gBAAgB,EAAE,EAAE,EAAE,IAAI,EAAE,GAAG,CAAC,GAAG,EAAE,IAAI,EAAE,GAAG,CAAC,KAAK,EAAE,CAAC;YAC5E,CAAC;SACF,CAAC,CAAC;KACJ;IAED,OAAO,cAAc,CAAC,EAAE,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC;AACrF,CAAC,CAAC"}

package/mobile/lib/components/Tabs/tabItemClasses.d.ts

@@ -0,0 +1,6 @@
+export declare const LINK_CLASSES = "h-12 flex-1 flex items-center justify-center cursor-pointer";
+export declare const ACTIVE_LINK_CLASSES = "bg-primary-main";
+export declare const INACTIVE_LINK_CLASSES = "group bg-white";
+export declare const TEXT_CLASSES = "font-sans text-m";
+export declare const ACTIVE_TEXT_CLASSES = "text-white";
+export declare const INACTIVE_TEXT_CLASSES = "text-secondary-text group-hover:text-primary-main";

package/mobile/lib/components/Tabs/tabItemClasses.js

@@ -0,0 +1,7 @@
+export const LINK_CLASSES = 'h-12 flex-1 flex items-center justify-center cursor-pointer';
+export const ACTIVE_LINK_CLASSES = 'bg-primary-main';
+export const INACTIVE_LINK_CLASSES = 'group bg-white';
+export const TEXT_CLASSES = 'font-sans text-m';
+export const ACTIVE_TEXT_CLASSES = 'text-white';
+export const INACTIVE_TEXT_CLASSES = 'text-secondary-text group-hover:text-primary-main';
+//# sourceMappingURL=tabItemClasses.js.map

package/mobile/lib/components/Tabs/tabItemClasses.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tabItemClasses.js","sourceRoot":"","sources":["../../../src/components/Tabs/tabItemClasses.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,YAAY,GAAG,6DAA6D,CAAC;AAC1F,MAAM,CAAC,MAAM,mBAAmB,GAAG,iBAAiB,CAAC;AACrD,MAAM,CAAC,MAAM,qBAAqB,GAAG,gBAAgB,CAAC;AAEtD,MAAM,CAAC,MAAM,YAAY,GAAG,kBAAkB,CAAC;AAC/C,MAAM,CAAC,MAAM,mBAAmB,GAAG,YAAY,CAAC;AAChD,MAAM,CAAC,MAAM,qBAAqB,GAAG,mDAAmD,CAAC"}

package/mobile/lib/ui-kit/BlockWrapper.js

@@ -8,11 +8,20 @@ export const BlockWrapper = JSX(({ anchor, className, context, children, tag = '
     const { IntersectionObserverTag } = context;
     const [shouldRenderBlock, setShouldRenderBlock] = useState(true);
     useEffect(() => EventBus.inst.subscribe('tab', (event) => {
-        setShouldRenderBlock(!labels?.length || !event.label || labels.includes(event.label));
+        if (event.type === 'group') {
+            setShouldRenderBlock(!labels?.length || !event.label || labels.includes(event.label));
+        }
+        else {
+            setShouldRenderBlock(true);
+            scrollToBlock(event.label);
+        }
     }), [labels]);
     if (!shouldRenderBlock) {
         return null;
     }
     return anchor ? (_jsx(IntersectionObserverTag, { tag: tag, className: className, observerCallback: changeHashOnObserve, observerOptions: { threshold: 1 }, anchor: anchor, children: children })) : (_jsx(Tag, { className: className, children: children }));
 });
+function scrollToBlock(label) {
+    setTimeout(() => globalThis.document.getElementById(`#${label}`)?.scrollIntoView({ behavior: 'smooth' }));
+}
 //# sourceMappingURL=BlockWrapper.js.map

package/mobile/lib/ui-kit/BlockWrapper.js.map

@@ -1 +1 @@
-{"version":3,"file":"BlockWrapper.js","sourceRoot":"","sources":["../../src/ui-kit/BlockWrapper.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AACxC,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAElE,OAAO,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAEhD,OAAO,EAAE,mBAAmB,EAAE,MAAM,8BAA8B,CAAC;AASnE,MAAM,CAAC,MAAM,YAAY,GAAG,GAAG,CAC7B,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,GAAG,SAAS,EAAE,MAAM,EAAE,EAAE,EAAE;IACpE,MAAM,GAAG,GAAQ,GAAG,CAAC;IAErB,MAAM,EAAE,uBAAuB,EAAE,GAAG,OAAO,CAAC;IAC5C,MAAM,CAAC,iBAAiB,EAAE,oBAAoB,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;IAEjE,SAAS,CACP,GAAG,EAAE,CACH,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,EAAE,CAAC,KAAK,EAAE,EAAE;QACvC,oBAAoB,CAAC,CAAC,MAAM,EAAE,MAAM,IAAI,CAAC,KAAK,CAAC,KAAK,IAAI,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC;IACxF,CAAC,CAAC,EACJ,CAAC,MAAM,CAAC,CACT,CAAC;IAEF,IAAI,CAAC,iBAAiB,EAAE;QACtB,OAAO,IAAI,CAAC;KACb;IAED,OAAO,MAAM,CAAC,CAAC,CAAC,CACd,KAAC,uBAAuB,IACtB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,SAAS,EACpB,gBAAgB,EAAE,mBAAmB,EACrC,eAAe,EAAE,EAAE,SAAS,EAAE,CAAC,EAAE,EACjC,MAAM,EAAE,MAAM,YAEb,QAAQ,GACe,CAC3B,CAAC,CAAC,CAAC,CACF,KAAC,GAAG,IAAC,SAAS,EAAE,SAAS,YAAG,QAAQ,GAAO,CAC5C,CAAC;AACJ,CAAC,CACF,CAAC"}
+{"version":3,"file":"BlockWrapper.js","sourceRoot":"","sources":["../../src/ui-kit/BlockWrapper.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AACxC,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAElE,OAAO,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAEhD,OAAO,EAAE,mBAAmB,EAAE,MAAM,8BAA8B,CAAC;AASnE,MAAM,CAAC,MAAM,YAAY,GAAG,GAAG,CAC7B,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,GAAG,SAAS,EAAE,MAAM,EAAE,EAAE,EAAE;IACpE,MAAM,GAAG,GAAQ,GAAG,CAAC;IAErB,MAAM,EAAE,uBAAuB,EAAE,GAAG,OAAO,CAAC;IAC5C,MAAM,CAAC,iBAAiB,EAAE,oBAAoB,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;IAEjE,SAAS,CACP,GAAG,EAAE,CACH,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,EAAE,CAAC,KAAK,EAAE,EAAE;QACvC,IAAI,KAAK,CAAC,IAAI,KAAK,OAAO,EAAE;YAC1B,oBAAoB,CAAC,CAAC,MAAM,EAAE,MAAM,IAAI,CAAC,KAAK,CAAC,KAAK,IAAI,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC;SACvF;aAAM;YACL,oBAAoB,CAAC,IAAI,CAAC,CAAC;YAC3B,aAAa,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;SAC5B;IACH,CAAC,CAAC,EACJ,CAAC,MAAM,CAAC,CACT,CAAC;IAEF,IAAI,CAAC,iBAAiB,EAAE;QACtB,OAAO,IAAI,CAAC;KACb;IAED,OAAO,MAAM,CAAC,CAAC,CAAC,CACd,KAAC,uBAAuB,IACtB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,SAAS,EACpB,gBAAgB,EAAE,mBAAmB,EACrC,eAAe,EAAE,EAAE,SAAS,EAAE,CAAC,EAAE,EACjC,MAAM,EAAE,MAAM,YAEb,QAAQ,GACe,CAC3B,CAAC,CAAC,CAAC,CACF,KAAC,GAAG,IAAC,SAAS,EAAE,SAAS,YAAG,QAAQ,GAAO,CAC5C,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,SAAS,aAAa,CAAC,KAAc;IACnC,UAAU,CAAC,GAAG,EAAE,CACd,UAAU,CAAC,QAAQ,CAAC,cAAc,CAAC,IAAI,KAAK,EAAE,CAAC,EAAE,cAAc,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC,CACxF,CAAC;AACJ,CAAC"}

package/mobile/src/components/Tabs/Tabs.example.json

@@ -2,15 +2,15 @@
   "showCounter": true,
   "tabs": [
     {
-      "id": "tab1",
+      "ref": "tab1",
       "title": "Вкладка 1"
     },
     {
-      "id": "tab2",
+      "ref": "tab2",
       "title": "Вкладка 2"
     },
     {
-      "id": "tab3",
+      "ref": "tab3",
       "title": "Вкладка 3"
     }
   ]

package/mobile/src/components/Tabs/Tabs.tsx

@@ -4,9 +4,10 @@ import { EventBus } from '../../EventBus/EventBus';
 import type { UniBlockProps } from '../../types';
 import { BlockWrapper } from '../../ui-kit/BlockWrapper';
 import { renderTab } from './renderTab';
-import type { Tab, TabsContent } from './TabsContent';
+import type { Tab, TabsContent, TabType } from './TabsContent';
 
 export interface TabActivationEvent {
+  type?: TabType;
   label?: string;
 }
 
@@ -17,10 +18,10 @@ export const Tabs = JSX<TabsProps>((props) => {
 
   const [currentTab, setCurrentTab] = useState(tabs ? tabs[0] : undefined);
 
-  useEffect(() => EventBus.inst.subject('tab', { label: currentTab?.id }), [currentTab]);
+  useEffect(() => EventBus.inst.subject('tab', { label: currentTab?.ref }), [currentTab]);
 
   const handleClick = (selectedTab: Tab) => {
-    EventBus.inst.fire('tab', { label: selectedTab.id });
+    EventBus.inst.fire('tab', { type: selectedTab.type, label: selectedTab.ref });
     setCurrentTab(selectedTab);
   };
 
@@ -30,7 +31,7 @@ export const Tabs = JSX<TabsProps>((props) => {
       className={`mb-2 box-border flex gap-x-1 ${className}`}
       role="tablist"
     >
-      {tabs?.map(renderTab({ onClick: handleClick, currentTab, page, showCounter }))}
+      {tabs?.map(renderTab({ onClick: handleClick, currentTab, page, showCounter, context }))}
     </BlockWrapper>
   );
 });

package/mobile/src/components/Tabs/TabsContent.ts

@@ -1,9 +1,16 @@
+export type TabType = 'group' | 'link';
+
 /**
  *  @title Таб
  */
 export interface Tab {
-  /** @title Tег */
-  id?: string;
+  /** @title Тег или ссылка */
+  ref?: string;
+  /**
+   * @title Тип
+   * @enumNames ['Группирующий', 'Ссылочный']
+   */
+  type?: TabType;
   /** @title Название */
   title?: string;
 }

package/mobile/src/components/Tabs/renderGroupTab.tsx

@@ -0,0 +1,51 @@
+import { RenderTabProps } from './renderTab';
+import {
+  ACTIVE_LINK_CLASSES,
+  ACTIVE_TEXT_CLASSES,
+  INACTIVE_LINK_CLASSES,
+  INACTIVE_TEXT_CLASSES,
+  LINK_CLASSES,
+  TEXT_CLASSES,
+} from './tabItemClasses';
+import { Tab } from './TabsContent';
+
+const BADGE_CLASSES = 'min-w-[22px] w-[22px] h-[22px] rounded-full text-xs ml-2';
+const ACTIVE_BADGE_CLASSES = 'bg-white/30 text-white';
+const INACTIVE_BADGE_CLASSES = 'bg-main-divider text-secondary-text group-hover:text-primary-main';
+
+export const renderGroupTab =
+  ({ onClick, currentTab, showCounter, page }: RenderTabProps) =>
+  (tab: Tab, i: number) => {
+    const active = currentTab === tab;
+
+    const count = tab.ref
+      ? page?.blocks?.filter((block) => block?.labels?.includes(tab.ref as string)).length
+      : page?.blocks?.length;
+
+    return (
+      <div
+        key={String(i)}
+        className={`${LINK_CLASSES} ${active ? ACTIVE_LINK_CLASSES : INACTIVE_LINK_CLASSES}`}
+        role="tab"
+        aria-selected={active}
+        onClick={() => onClick(tab)}
+      >
+        <div className="flex flex-1 items-center justify-center">
+          {tab?.title ? renderTitle(tab.title, active) : null}
+          {showCounter && count ? renderCount(count, active) : null}
+        </div>
+      </div>
+    );
+  };
+
+const renderTitle = (title: string, active: boolean) => (
+  <h3 className={`${TEXT_CLASSES} ${active ? ACTIVE_TEXT_CLASSES : INACTIVE_TEXT_CLASSES}`}>
+    {title}
+  </h3>
+);
+
+const renderCount = (count: number, active: boolean) => (
+  <div className={`${BADGE_CLASSES} ${active ? ACTIVE_BADGE_CLASSES : INACTIVE_BADGE_CLASSES}`}>
+    {count}
+  </div>
+);

package/mobile/src/components/Tabs/renderLinkTab.tsx

@@ -0,0 +1,25 @@
+import type { LinkProps } from '../../model/LinkProps';
+import {
+  INACTIVE_LINK_CLASSES,
+  INACTIVE_TEXT_CLASSES,
+  LINK_CLASSES,
+  TEXT_CLASSES,
+} from './tabItemClasses';
+
+export interface RenderLinkTabProps extends LinkProps {
+  active?: boolean;
+  onClick?: () => void;
+  i: number;
+}
+
+export const renderLinkTab = ({ text, onClick, href, target = '_self', i }: RenderLinkTabProps) => (
+  <a
+    key={String(i)}
+    className={`${LINK_CLASSES} ${INACTIVE_LINK_CLASSES}`}
+    target={target}
+    href={href}
+    onClick={onClick}
+  >
+    <span className={`${TEXT_CLASSES} ${INACTIVE_TEXT_CLASSES}`}>{text}</span>
+  </a>
+);

package/mobile/src/components/Tabs/renderTab.tsx

@@ -1,51 +1,31 @@
+import { useLink } from '../../hooks/useLink';
 import type { ContentPageDef } from '../../types';
+import { isURL } from '../../utils/url';
+import type { ContentPageContext } from '../ContentPage/ContentPageContext';
+import { renderGroupTab } from './renderGroupTab';
+import { renderLinkTab } from './renderLinkTab';
 import type { Tab } from './TabsContent';
 
-interface RenderTabProps {
-  onClick: OnTabClick;
+export interface RenderTabProps {
+  onClick: (tab: Tab) => void;
   currentTab?: Tab;
   page?: ContentPageDef;
   showCounter?: boolean;
+  context: ContentPageContext;
 }
 
-type OnTabClick = (tab: Tab) => void;
-
-const badgeStyle = 'min-w-[22px] w-[22px] h-[22px] rounded-full text-xs-light ml-2';
-
 export const renderTab =
-  ({ onClick, currentTab, showCounter, page }: RenderTabProps) =>
+  ({ onClick, currentTab, showCounter, page, context }: RenderTabProps) =>
   (tab: Tab, i: number) => {
-    const isActive = currentTab === tab;
-
-    const tabBg = isActive ? 'bg-primary-main' : 'group bg-white';
-    const tabText = `text-m-light ${
-      isActive ? 'text-white' : 'text-secondary-text group-hover:text-primary-main'
-    }`;
-    const counterBlockStyle = `${badgeStyle}
-      ${
-        isActive
-          ? 'bg-white/30 text-white'
-          : 'bg-main-divider text-secondary-text group-hover:text-primary-main'
-      }`;
+    const { useRouter, handlerDecorator } = context;
+    const router = useRouter();
 
-    const count = tab.id
-      ? page?.blocks?.filter((block) => block?.labels?.includes(tab.id as string)).length
-      : page?.blocks?.length;
+    if (isURL(tab?.ref)) {
+      return renderLinkTab({
+        ...useLink({ router, handlerDecorator }, { href: tab.ref, text: tab.title }),
+        i,
+      });
+    }
 
-    return (
-      <div
-        key={String(i)}
-        className={`flex h-12 w-full flex-1 cursor-pointer mr-2 last:mr-0 box-content ${tabBg}`}
-        role="tab"
-        aria-selected={isActive}
-        onClick={() => onClick(tab)}
-      >
-        <div className="flex flex-1 items-center justify-center">
-          {tab?.title ? <h3 className={tabText}>{tab?.title}</h3> : null}
-          {showCounter ? (
-            <div className={`flex items-center justify-center ${counterBlockStyle}`}>{count}</div>
-          ) : null}
-        </div>
-      </div>
-    );
+    return renderGroupTab({ onClick, currentTab, showCounter, page, context })(tab, i);
   };

package/mobile/src/components/Tabs/tabItemClasses.ts

@@ -0,0 +1,7 @@
+export const LINK_CLASSES = 'h-12 flex-1 flex items-center justify-center cursor-pointer';
+export const ACTIVE_LINK_CLASSES = 'bg-primary-main';
+export const INACTIVE_LINK_CLASSES = 'group bg-white';
+
+export const TEXT_CLASSES = 'font-sans text-m';
+export const ACTIVE_TEXT_CLASSES = 'text-white';
+export const INACTIVE_TEXT_CLASSES = 'text-secondary-text group-hover:text-primary-main';

package/mobile/src/ui-kit/BlockWrapper.tsx

@@ -22,7 +22,12 @@ export const BlockWrapper = JSX<BlockWrapperProps>(
     useEffect(
       () =>
         EventBus.inst.subscribe('tab', (event) => {
-          setShouldRenderBlock(!labels?.length || !event.label || labels.includes(event.label));
+          if (event.type === 'group') {
+            setShouldRenderBlock(!labels?.length || !event.label || labels.includes(event.label));
+          } else {
+            setShouldRenderBlock(true);
+            scrollToBlock(event.label);
+          }
         }),
       [labels],
     );
@@ -46,3 +51,9 @@ export const BlockWrapper = JSX<BlockWrapperProps>(
     );
   },
 );
+
+function scrollToBlock(label?: string) {
+  setTimeout(() =>
+    globalThis.document.getElementById(`#${label}`)?.scrollIntoView({ behavior: 'smooth' }),
+  );
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@redneckz/wildless-cms-uni-blocks",
-  "version": "0.4.2",
+  "version": "0.4.3",
   "private": false,
   "license": "MIT",
   "author": "ЦК",

package/src/components/Tabs/Tabs.example.json

@@ -2,15 +2,15 @@
   "showCounter": true,
   "tabs": [
     {
-      "id": "tab1",
+      "ref": "tab1",
       "title": "Вкладка 1"
     },
     {
-      "id": "tab2",
+      "ref": "tab2",
       "title": "Вкладка 2"
     },
     {
-      "id": "tab3",
+      "ref": "tab3",
       "title": "Вкладка 3"
     }
   ]

package/src/components/Tabs/Tabs.fixture.tsx

@@ -8,9 +8,9 @@ export default {
         context={context}
         className="col-span-12"
         tabs={[
-          { id: 'tab1', title: 'Вкладка 1' },
-          { id: 'tab2', title: 'Вкладка 2' },
-          { id: 'tab3', title: 'Вкладка 3' },
+          { ref: 'tab1', title: 'Вкладка 1' },
+          { ref: 'tab2', title: 'Вкладка 2' },
+          { ref: 'https://google.com', title: 'Вкладка 3' },
         ]}
       />
     </div>

package/src/components/Tabs/Tabs.tsx

@@ -4,9 +4,10 @@ import { EventBus } from '../../EventBus/EventBus';
 import type { UniBlockProps } from '../../types';
 import { BlockWrapper } from '../../ui-kit/BlockWrapper';
 import { renderTab } from './renderTab';
-import type { Tab, TabsContent } from './TabsContent';
+import type { Tab, TabsContent, TabType } from './TabsContent';
 
 export interface TabActivationEvent {
+  type?: TabType;
   label?: string;
 }
 
@@ -17,10 +18,10 @@ export const Tabs = JSX<TabsProps>((props) => {
 
   const [currentTab, setCurrentTab] = useState(tabs ? tabs[0] : undefined);
 
-  useEffect(() => EventBus.inst.subject('tab', { label: currentTab?.id }), [currentTab]);
+  useEffect(() => EventBus.inst.subject('tab', { label: currentTab?.ref }), [currentTab]);
 
   const handleClick = (selectedTab: Tab) => {
-    EventBus.inst.fire('tab', { label: selectedTab.id });
+    EventBus.inst.fire('tab', { type: selectedTab.type, label: selectedTab.ref });
     setCurrentTab(selectedTab);
   };
 
@@ -30,7 +31,7 @@ export const Tabs = JSX<TabsProps>((props) => {
       className={`mb-2 box-border flex gap-x-1 ${className}`}
       role="tablist"
     >
-      {tabs?.map(renderTab({ onClick: handleClick, currentTab, page, showCounter }))}
+      {tabs?.map(renderTab({ onClick: handleClick, currentTab, page, showCounter, context }))}
     </BlockWrapper>
   );
 });

package/src/components/Tabs/TabsContent.ts

@@ -1,9 +1,16 @@
+export type TabType = 'group' | 'link';
+
 /**
  *  @title Таб
  */
 export interface Tab {
-  /** @title Tег */
-  id?: string;
+  /** @title Тег или ссылка */
+  ref?: string;
+  /**
+   * @title Тип
+   * @enumNames ['Группирующий', 'Ссылочный']
+   */
+  type?: TabType;
   /** @title Название */
   title?: string;
 }