@alfalab/core-components-tabs 9.1.0 → 9.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/primary-tablist/Component.collapsible.d.ts +1 -1
- package/components/primary-tablist/Component.collapsible.js.map +1 -1
- package/components/primary-tablist/Component.d.ts +1 -1
- package/components/primary-tablist/Component.desktop.d.ts +1 -1
- package/components/primary-tablist/Component.desktop.js.map +1 -1
- package/components/primary-tablist/Component.js.map +1 -1
- package/components/primary-tablist/Component.mobile.d.ts +1 -1
- package/components/primary-tablist/Component.mobile.js.map +1 -1
- package/components/primary-tablist/Component.responsive.d.ts +1 -1
- package/components/primary-tablist/Component.responsive.js.map +1 -1
- package/components/primary-tablist/index.css +138 -135
- package/components/primary-tablist/index.module.css.js +1 -1
- package/components/primary-tablist/index.module.css.js.map +1 -1
- package/components/primary-tablist/mobile.css +230 -226
- package/components/primary-tablist/mobile.module.css.js +1 -1
- package/components/scroll-controls/Component.d.ts +2 -2
- package/components/scroll-controls/Component.js.map +1 -1
- package/components/scroll-controls/index.css +11 -11
- package/components/scroll-controls/index.module.css.js +1 -1
- package/components/scroll-controls/utils.js.map +1 -1
- package/components/scrollable-container/Component.d.ts +2 -2
- package/components/scrollable-container/Component.js.map +1 -1
- package/components/scrollable-container/index.css +5 -5
- package/components/scrollable-container/index.module.css.js +1 -1
- package/components/secondary-tablist/Component.d.ts +1 -1
- package/components/secondary-tablist/Component.desktop.d.ts +1 -1
- package/components/secondary-tablist/Component.desktop.js.map +1 -1
- package/components/secondary-tablist/Component.js.map +1 -1
- package/components/secondary-tablist/Component.mobile.d.ts +1 -1
- package/components/secondary-tablist/Component.mobile.js.map +1 -1
- package/components/secondary-tablist/Component.responsive.d.ts +1 -1
- package/components/secondary-tablist/Component.responsive.js.map +1 -1
- package/components/secondary-tablist/index.css +18 -18
- package/components/secondary-tablist/index.module.css.js +1 -1
- package/components/secondary-tablist/mobile.css +22 -22
- package/components/secondary-tablist/mobile.module.css.js +1 -1
- package/components/tab/Component.d.ts +1 -1
- package/components/tab/Component.js.map +1 -1
- package/components/tab/index.css +2 -2
- package/components/tab/index.module.css.js +1 -1
- package/components/tabs/Component.collapsible.d.ts +1 -1
- package/components/tabs/Component.collapsible.js.map +1 -1
- package/components/tabs/Component.d.ts +2 -2
- package/components/tabs/Component.desktop.d.ts +1 -1
- package/components/tabs/Component.desktop.js.map +1 -1
- package/components/tabs/Component.js +2 -11
- package/components/tabs/Component.js.map +1 -1
- package/components/tabs/Component.mobile.d.ts +1 -1
- package/components/tabs/Component.mobile.js.map +1 -1
- package/components/tabs/Component.responsive.d.ts +1 -1
- package/components/tabs/Component.responsive.js.map +1 -1
- package/components/title/Component.d.ts +2 -2
- package/components/title/Component.js.map +1 -1
- package/cssm/components/primary-tablist/Component.collapsible.d.ts +1 -1
- package/cssm/components/primary-tablist/Component.collapsible.js.map +1 -1
- package/cssm/components/primary-tablist/Component.d.ts +1 -1
- package/cssm/components/primary-tablist/Component.desktop.d.ts +1 -1
- package/cssm/components/primary-tablist/Component.desktop.js.map +1 -1
- package/cssm/components/primary-tablist/Component.js.map +1 -1
- package/cssm/components/primary-tablist/Component.mobile.d.ts +1 -1
- package/cssm/components/primary-tablist/Component.mobile.js.map +1 -1
- package/cssm/components/primary-tablist/Component.responsive.d.ts +1 -1
- package/cssm/components/primary-tablist/Component.responsive.js.map +1 -1
- package/cssm/components/primary-tablist/index.module.css +7 -4
- package/cssm/components/primary-tablist/mobile.module.css +4 -3
- package/cssm/components/scroll-controls/Component.d.ts +2 -2
- package/cssm/components/scroll-controls/Component.js.map +1 -1
- package/cssm/components/scroll-controls/utils.js.map +1 -1
- package/cssm/components/scrollable-container/Component.d.ts +2 -2
- package/cssm/components/scrollable-container/Component.js.map +1 -1
- package/cssm/components/secondary-tablist/Component.d.ts +1 -1
- package/cssm/components/secondary-tablist/Component.desktop.d.ts +1 -1
- package/cssm/components/secondary-tablist/Component.desktop.js.map +1 -1
- package/cssm/components/secondary-tablist/Component.js.map +1 -1
- package/cssm/components/secondary-tablist/Component.mobile.d.ts +1 -1
- package/cssm/components/secondary-tablist/Component.mobile.js.map +1 -1
- package/cssm/components/secondary-tablist/Component.responsive.d.ts +1 -1
- package/cssm/components/secondary-tablist/Component.responsive.js.map +1 -1
- package/cssm/components/tab/Component.d.ts +1 -1
- package/cssm/components/tab/Component.js.map +1 -1
- package/cssm/components/tabs/Component.collapsible.d.ts +1 -1
- package/cssm/components/tabs/Component.collapsible.js.map +1 -1
- package/cssm/components/tabs/Component.d.ts +2 -2
- package/cssm/components/tabs/Component.desktop.d.ts +1 -1
- package/cssm/components/tabs/Component.desktop.js.map +1 -1
- package/cssm/components/tabs/Component.js +2 -11
- package/cssm/components/tabs/Component.js.map +1 -1
- package/cssm/components/tabs/Component.mobile.d.ts +1 -1
- package/cssm/components/tabs/Component.mobile.js.map +1 -1
- package/cssm/components/tabs/Component.responsive.d.ts +1 -1
- package/cssm/components/tabs/Component.responsive.js.map +1 -1
- package/cssm/components/title/Component.d.ts +2 -2
- package/cssm/components/title/Component.js.map +1 -1
- package/cssm/hooks/use-collapsible-elements.d.ts +1 -1
- package/cssm/hooks/use-collapsible-elements.js.map +1 -1
- package/cssm/hooks/use-tablist-titles.d.ts +50 -1
- package/cssm/hooks/use-tablist-titles.js.map +1 -1
- package/cssm/hooks/use-tabs.d.ts +2 -2
- package/cssm/hooks/use-tabs.js.map +1 -1
- package/cssm/synthetic-events.d.ts +1 -1
- package/cssm/synthetic-events.js.map +1 -1
- package/cssm/typings.d.ts +14 -4
- package/esm/components/primary-tablist/Component.collapsible.d.ts +1 -1
- package/esm/components/primary-tablist/Component.collapsible.js.map +1 -1
- package/esm/components/primary-tablist/Component.d.ts +1 -1
- package/esm/components/primary-tablist/Component.desktop.d.ts +1 -1
- package/esm/components/primary-tablist/Component.desktop.js.map +1 -1
- package/esm/components/primary-tablist/Component.js.map +1 -1
- package/esm/components/primary-tablist/Component.mobile.d.ts +1 -1
- package/esm/components/primary-tablist/Component.mobile.js.map +1 -1
- package/esm/components/primary-tablist/Component.responsive.d.ts +1 -1
- package/esm/components/primary-tablist/Component.responsive.js.map +1 -1
- package/esm/components/primary-tablist/index.css +138 -135
- package/esm/components/primary-tablist/index.module.css.js +1 -1
- package/esm/components/primary-tablist/index.module.css.js.map +1 -1
- package/esm/components/primary-tablist/mobile.css +230 -226
- package/esm/components/primary-tablist/mobile.module.css.js +1 -1
- package/esm/components/scroll-controls/Component.d.ts +2 -2
- package/esm/components/scroll-controls/Component.js.map +1 -1
- package/esm/components/scroll-controls/index.css +11 -11
- package/esm/components/scroll-controls/index.module.css.js +1 -1
- package/esm/components/scroll-controls/utils.js.map +1 -1
- package/esm/components/scrollable-container/Component.d.ts +2 -2
- package/esm/components/scrollable-container/Component.js.map +1 -1
- package/esm/components/scrollable-container/index.css +5 -5
- package/esm/components/scrollable-container/index.module.css.js +1 -1
- package/esm/components/secondary-tablist/Component.d.ts +1 -1
- package/esm/components/secondary-tablist/Component.desktop.d.ts +1 -1
- package/esm/components/secondary-tablist/Component.desktop.js.map +1 -1
- package/esm/components/secondary-tablist/Component.js.map +1 -1
- package/esm/components/secondary-tablist/Component.mobile.d.ts +1 -1
- package/esm/components/secondary-tablist/Component.mobile.js.map +1 -1
- package/esm/components/secondary-tablist/Component.responsive.d.ts +1 -1
- package/esm/components/secondary-tablist/Component.responsive.js.map +1 -1
- package/esm/components/secondary-tablist/index.css +18 -18
- package/esm/components/secondary-tablist/index.module.css.js +1 -1
- package/esm/components/secondary-tablist/mobile.css +22 -22
- package/esm/components/secondary-tablist/mobile.module.css.js +1 -1
- package/esm/components/tab/Component.d.ts +1 -1
- package/esm/components/tab/Component.js.map +1 -1
- package/esm/components/tab/index.css +2 -2
- package/esm/components/tab/index.module.css.js +1 -1
- package/esm/components/tabs/Component.collapsible.d.ts +1 -1
- package/esm/components/tabs/Component.collapsible.js.map +1 -1
- package/esm/components/tabs/Component.d.ts +2 -2
- package/esm/components/tabs/Component.desktop.d.ts +1 -1
- package/esm/components/tabs/Component.desktop.js.map +1 -1
- package/esm/components/tabs/Component.js +2 -11
- package/esm/components/tabs/Component.js.map +1 -1
- package/esm/components/tabs/Component.mobile.d.ts +1 -1
- package/esm/components/tabs/Component.mobile.js.map +1 -1
- package/esm/components/tabs/Component.responsive.d.ts +1 -1
- package/esm/components/tabs/Component.responsive.js.map +1 -1
- package/esm/components/title/Component.d.ts +2 -2
- package/esm/components/title/Component.js.map +1 -1
- package/esm/hooks/use-collapsible-elements.d.ts +1 -1
- package/esm/hooks/use-collapsible-elements.js.map +1 -1
- package/esm/hooks/use-tablist-titles.d.ts +50 -1
- package/esm/hooks/use-tablist-titles.js.map +1 -1
- package/esm/hooks/use-tabs.d.ts +2 -2
- package/esm/hooks/use-tabs.js.map +1 -1
- package/esm/synthetic-events.d.ts +1 -1
- package/esm/synthetic-events.js.map +1 -1
- package/esm/typings.d.ts +14 -4
- package/hooks/use-collapsible-elements.d.ts +1 -1
- package/hooks/use-collapsible-elements.js.map +1 -1
- package/hooks/use-tablist-titles.d.ts +50 -1
- package/hooks/use-tablist-titles.js.map +1 -1
- package/hooks/use-tabs.d.ts +2 -2
- package/hooks/use-tabs.js.map +1 -1
- package/modern/components/primary-tablist/Component.collapsible.d.ts +1 -1
- package/modern/components/primary-tablist/Component.collapsible.js.map +1 -1
- package/modern/components/primary-tablist/Component.d.ts +1 -1
- package/modern/components/primary-tablist/Component.desktop.d.ts +1 -1
- package/modern/components/primary-tablist/Component.desktop.js.map +1 -1
- package/modern/components/primary-tablist/Component.js.map +1 -1
- package/modern/components/primary-tablist/Component.mobile.d.ts +1 -1
- package/modern/components/primary-tablist/Component.mobile.js.map +1 -1
- package/modern/components/primary-tablist/Component.responsive.d.ts +1 -1
- package/modern/components/primary-tablist/Component.responsive.js.map +1 -1
- package/modern/components/primary-tablist/index.css +138 -135
- package/modern/components/primary-tablist/index.module.css.js +1 -1
- package/modern/components/primary-tablist/index.module.css.js.map +1 -1
- package/modern/components/primary-tablist/mobile.css +230 -226
- package/modern/components/primary-tablist/mobile.module.css.js +1 -1
- package/modern/components/scroll-controls/Component.d.ts +2 -2
- package/modern/components/scroll-controls/Component.js.map +1 -1
- package/modern/components/scroll-controls/index.css +11 -11
- package/modern/components/scroll-controls/index.module.css.js +1 -1
- package/modern/components/scroll-controls/utils.js.map +1 -1
- package/modern/components/scrollable-container/Component.d.ts +2 -2
- package/modern/components/scrollable-container/Component.js.map +1 -1
- package/modern/components/scrollable-container/index.css +5 -5
- package/modern/components/scrollable-container/index.module.css.js +1 -1
- package/modern/components/secondary-tablist/Component.d.ts +1 -1
- package/modern/components/secondary-tablist/Component.desktop.d.ts +1 -1
- package/modern/components/secondary-tablist/Component.desktop.js.map +1 -1
- package/modern/components/secondary-tablist/Component.js.map +1 -1
- package/modern/components/secondary-tablist/Component.mobile.d.ts +1 -1
- package/modern/components/secondary-tablist/Component.mobile.js.map +1 -1
- package/modern/components/secondary-tablist/Component.responsive.d.ts +1 -1
- package/modern/components/secondary-tablist/Component.responsive.js.map +1 -1
- package/modern/components/secondary-tablist/index.css +18 -18
- package/modern/components/secondary-tablist/index.module.css.js +1 -1
- package/modern/components/secondary-tablist/mobile.css +22 -22
- package/modern/components/secondary-tablist/mobile.module.css.js +1 -1
- package/modern/components/tab/Component.d.ts +1 -1
- package/modern/components/tab/Component.js.map +1 -1
- package/modern/components/tab/index.css +2 -2
- package/modern/components/tab/index.module.css.js +1 -1
- package/modern/components/tabs/Component.collapsible.d.ts +1 -1
- package/modern/components/tabs/Component.collapsible.js.map +1 -1
- package/modern/components/tabs/Component.d.ts +2 -2
- package/modern/components/tabs/Component.desktop.d.ts +1 -1
- package/modern/components/tabs/Component.desktop.js.map +1 -1
- package/modern/components/tabs/Component.js +2 -1
- package/modern/components/tabs/Component.js.map +1 -1
- package/modern/components/tabs/Component.mobile.d.ts +1 -1
- package/modern/components/tabs/Component.mobile.js.map +1 -1
- package/modern/components/tabs/Component.responsive.d.ts +1 -1
- package/modern/components/tabs/Component.responsive.js.map +1 -1
- package/modern/components/title/Component.d.ts +2 -2
- package/modern/components/title/Component.js.map +1 -1
- package/modern/hooks/use-collapsible-elements.d.ts +1 -1
- package/modern/hooks/use-collapsible-elements.js.map +1 -1
- package/modern/hooks/use-tablist-titles.d.ts +50 -1
- package/modern/hooks/use-tablist-titles.js.map +1 -1
- package/modern/hooks/use-tabs.d.ts +2 -2
- package/modern/hooks/use-tabs.js.map +1 -1
- package/modern/synthetic-events.d.ts +1 -1
- package/modern/synthetic-events.js.map +1 -1
- package/modern/typings.d.ts +14 -4
- package/moderncssm/components/primary-tablist/Component.collapsible.d.ts +1 -1
- package/moderncssm/components/primary-tablist/Component.collapsible.js.map +1 -1
- package/moderncssm/components/primary-tablist/Component.d.ts +1 -1
- package/moderncssm/components/primary-tablist/Component.desktop.d.ts +1 -1
- package/moderncssm/components/primary-tablist/Component.desktop.js.map +1 -1
- package/moderncssm/components/primary-tablist/Component.js.map +1 -1
- package/moderncssm/components/primary-tablist/Component.mobile.d.ts +1 -1
- package/moderncssm/components/primary-tablist/Component.mobile.js.map +1 -1
- package/moderncssm/components/primary-tablist/Component.responsive.d.ts +1 -1
- package/moderncssm/components/primary-tablist/Component.responsive.js.map +1 -1
- package/moderncssm/components/primary-tablist/index.module.css +3 -1
- package/moderncssm/components/scroll-controls/Component.d.ts +2 -2
- package/moderncssm/components/scroll-controls/Component.js.map +1 -1
- package/moderncssm/components/scroll-controls/utils.js.map +1 -1
- package/moderncssm/components/scrollable-container/Component.d.ts +2 -2
- package/moderncssm/components/scrollable-container/Component.js.map +1 -1
- package/moderncssm/components/secondary-tablist/Component.d.ts +1 -1
- package/moderncssm/components/secondary-tablist/Component.desktop.d.ts +1 -1
- package/moderncssm/components/secondary-tablist/Component.desktop.js.map +1 -1
- package/moderncssm/components/secondary-tablist/Component.js.map +1 -1
- package/moderncssm/components/secondary-tablist/Component.mobile.d.ts +1 -1
- package/moderncssm/components/secondary-tablist/Component.mobile.js.map +1 -1
- package/moderncssm/components/secondary-tablist/Component.responsive.d.ts +1 -1
- package/moderncssm/components/secondary-tablist/Component.responsive.js.map +1 -1
- package/moderncssm/components/tab/Component.d.ts +1 -1
- package/moderncssm/components/tab/Component.js.map +1 -1
- package/moderncssm/components/tabs/Component.collapsible.d.ts +1 -1
- package/moderncssm/components/tabs/Component.collapsible.js.map +1 -1
- package/moderncssm/components/tabs/Component.d.ts +2 -2
- package/moderncssm/components/tabs/Component.desktop.d.ts +1 -1
- package/moderncssm/components/tabs/Component.desktop.js.map +1 -1
- package/moderncssm/components/tabs/Component.js +2 -1
- package/moderncssm/components/tabs/Component.js.map +1 -1
- package/moderncssm/components/tabs/Component.mobile.d.ts +1 -1
- package/moderncssm/components/tabs/Component.mobile.js.map +1 -1
- package/moderncssm/components/tabs/Component.responsive.d.ts +1 -1
- package/moderncssm/components/tabs/Component.responsive.js.map +1 -1
- package/moderncssm/components/title/Component.d.ts +2 -2
- package/moderncssm/components/title/Component.js.map +1 -1
- package/moderncssm/hooks/use-collapsible-elements.d.ts +1 -1
- package/moderncssm/hooks/use-collapsible-elements.js.map +1 -1
- package/moderncssm/hooks/use-tablist-titles.d.ts +50 -1
- package/moderncssm/hooks/use-tablist-titles.js.map +1 -1
- package/moderncssm/hooks/use-tabs.d.ts +2 -2
- package/moderncssm/hooks/use-tabs.js.map +1 -1
- package/moderncssm/synthetic-events.d.ts +1 -1
- package/moderncssm/synthetic-events.js.map +1 -1
- package/moderncssm/typings.d.ts +14 -4
- package/package.json +3 -3
- package/src/components/primary-tablist/Component.collapsible.tsx +3 -3
- package/src/components/primary-tablist/Component.desktop.tsx +1 -1
- package/src/components/primary-tablist/Component.mobile.tsx +1 -1
- package/src/components/primary-tablist/Component.responsive.tsx +1 -1
- package/src/components/primary-tablist/Component.tsx +1 -1
- package/src/components/primary-tablist/index.module.css +3 -1
- package/src/components/scroll-controls/Component.tsx +2 -2
- package/src/components/scroll-controls/utils.ts +10 -7
- package/src/components/scrollable-container/Component.tsx +2 -2
- package/src/components/secondary-tablist/Component.desktop.tsx +1 -1
- package/src/components/secondary-tablist/Component.mobile.tsx +1 -1
- package/src/components/secondary-tablist/Component.responsive.tsx +1 -1
- package/src/components/secondary-tablist/Component.tsx +1 -1
- package/src/components/tab/Component.tsx +2 -3
- package/src/components/tabs/Component.collapsible.tsx +1 -1
- package/src/components/tabs/Component.desktop.tsx +1 -1
- package/src/components/tabs/Component.mobile.tsx +1 -1
- package/src/components/tabs/Component.responsive.tsx +1 -1
- package/src/components/tabs/Component.tsx +4 -1
- package/src/components/title/Component.tsx +3 -3
- package/src/hooks/use-collapsible-elements.ts +2 -2
- package/src/hooks/use-tablist-titles.ts +1 -1
- package/src/hooks/{use-tabs.tsx → use-tabs.ts} +5 -5
- package/src/synthetic-events.ts +1 -1
- package/src/typings.ts +78 -47
- package/synthetic-events.d.ts +1 -1
- package/synthetic-events.js.map +1 -1
- package/typings.d.ts +14 -4
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { TabsProps } from '../../typings';
|
|
2
|
+
import { type TabsProps } from '../../typings';
|
|
3
3
|
export declare type TabsCollapsibleProps = Omit<TabsProps, 'TabList' | 'fullWidthScroll' | 'scrollable' | 'view'>;
|
|
4
4
|
export declare const TabsCollapsible: ({ ...restProps }: TabsCollapsibleProps) => React.JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Component.collapsible.js","sources":["../../../src/components/tabs/Component.collapsible.tsx"],"sourcesContent":["import React from 'react';\n\nimport { TabsProps } from '../../typings';\nimport { CollapsiblePrimaryTabList } from '../primary-tablist/Component.collapsible';\n\nimport { Tabs } from './Component';\n\nexport type TabsCollapsibleProps = Omit<\n TabsProps,\n 'TabList' | 'fullWidthScroll' | 'scrollable' | 'view'\n>;\n\nexport const TabsCollapsible = ({ ...restProps }: TabsCollapsibleProps) => (\n <Tabs TabList={CollapsiblePrimaryTabList} {...restProps} />\n);\n"],"names":["__rest","React","Tabs","__assign","CollapsiblePrimaryTabList"],"mappings":";;;;;;;;;;;;;AAYO,IAAM,eAAe,GAAG,UAAC,EAAsC,EAAA;QAAjC,SAAS,GAAAA,YAAA,CAAA,EAAA,EAAd,EAAgB,CAAF;IAA6B,QACvEC,sBAAC,CAAA,aAAA,CAAAC,cAAI,EAACC,cAAA,CAAA,EAAA,OAAO,EAAEC,+CAAyB,EAAM,EAAA,SAAS,CAAI,CAAA;;;;;"}
|
|
1
|
+
{"version":3,"file":"Component.collapsible.js","sources":["../../../src/components/tabs/Component.collapsible.tsx"],"sourcesContent":["import React from 'react';\n\nimport { type TabsProps } from '../../typings';\nimport { CollapsiblePrimaryTabList } from '../primary-tablist/Component.collapsible';\n\nimport { Tabs } from './Component';\n\nexport type TabsCollapsibleProps = Omit<\n TabsProps,\n 'TabList' | 'fullWidthScroll' | 'scrollable' | 'view'\n>;\n\nexport const TabsCollapsible = ({ ...restProps }: TabsCollapsibleProps) => (\n <Tabs TabList={CollapsiblePrimaryTabList} {...restProps} />\n);\n"],"names":["__rest","React","Tabs","__assign","CollapsiblePrimaryTabList"],"mappings":";;;;;;;;;;;;;AAYO,IAAM,eAAe,GAAG,UAAC,EAAsC,EAAA;QAAjC,SAAS,GAAAA,YAAA,CAAA,EAAA,EAAd,EAAgB,CAAF;IAA6B,QACvEC,sBAAC,CAAA,aAAA,CAAAC,cAAI,EAACC,cAAA,CAAA,EAAA,OAAO,EAAEC,+CAAyB,EAAM,EAAA,SAAS,CAAI,CAAA;;;;;"}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { TabsProps } from '../../typings';
|
|
3
|
-
export declare const Tabs: ({ TabList, className, containerClassName, size, children, selectedId, scrollable, collapsedTabsIds, fullWidthScroll, keepMounted, dataTestId, onChange, breakpoint, client, defaultMatchMediaValue, tagShape, tagView, showSkeleton, skeletonProps, textStyle, style, ...restProps }: Omit<TabsProps, 'view'>) => React.JSX.Element;
|
|
2
|
+
import { type TabsProps } from '../../typings';
|
|
3
|
+
export declare const Tabs: ({ TabList, className, containerClassName, size, children, selectedId, scrollable, collapsedTabsIds, fullWidthScroll, keepMounted, dataTestId, onChange, breakpoint, client, defaultMatchMediaValue, tagShape, tagView, showSkeleton, skeletonProps, textStyle, style, titleProps, ...restProps }: Omit<TabsProps, 'view'>) => React.JSX.Element;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { TabsProps } from '../../typings';
|
|
2
|
+
import { type TabsProps } from '../../typings';
|
|
3
3
|
export declare type TabsDesktopProps = Omit<TabsProps, 'TabList' | 'fullWidthScroll' | 'breakpoint' | 'collapsedTabsIds'>;
|
|
4
4
|
export declare const TabsDesktop: ({ view, scrollable, size, ...restProps }: TabsDesktopProps) => React.JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Component.desktop.js","sources":["../../../src/components/tabs/Component.desktop.tsx"],"sourcesContent":["import React from 'react';\n\nimport { TabsProps } from '../../typings';\nimport { PrimaryTabListDesktop } from '../primary-tablist/Component.desktop';\nimport { SecondaryTabListDesktop } from '../secondary-tablist/Component.desktop';\n\nimport { Tabs } from './Component';\n\nconst views = {\n primary: PrimaryTabListDesktop,\n secondary: SecondaryTabListDesktop,\n};\n\nexport type TabsDesktopProps = Omit<\n TabsProps,\n 'TabList' | 'fullWidthScroll' | 'breakpoint' | 'collapsedTabsIds'\n>;\n\nexport const TabsDesktop = ({\n view = 'primary',\n scrollable = false,\n size = view === 'primary' ? 'm' : 's',\n ...restProps\n}: TabsDesktopProps) => (\n <Tabs TabList={views[view]} scrollable={scrollable} size={size} {...restProps} />\n);\n"],"names":["PrimaryTabListDesktop","SecondaryTabListDesktop","__rest","React","Tabs","__assign"],"mappings":";;;;;;;;;;;;;;AAQA,IAAM,KAAK,GAAG;AACV,IAAA,OAAO,EAAEA,yCAAqB;AAC9B,IAAA,SAAS,EAAEC,yCAAuB;CACrC;AAOM,IAAM,WAAW,GAAG,UAAC,EAKT,EAAA;AAJf,IAAA,IAAA,EAAgB,GAAA,EAAA,CAAA,IAAA,EAAhB,IAAI,GAAA,EAAA,KAAA,MAAA,GAAG,SAAS,GAAA,EAAA,EAChB,EAAkB,GAAA,EAAA,CAAA,UAAA,EAAlB,UAAU,GAAG,EAAA,KAAA,MAAA,GAAA,KAAK,GAAA,EAAA,EAClB,YAAqC,EAArC,IAAI,GAAG,EAAA,KAAA,MAAA,GAAA,IAAI,KAAK,SAAS,GAAG,GAAG,GAAG,GAAG,GAAA,EAAA,EAClC,SAAS,GAAAC,YAAA,CAAA,EAAA,EAJY,8BAK3B,CADe;IACQ,QACpBC,qCAACC,cAAI,EAAAC,cAAA,CAAA,EAAC,OAAO,EAAE,KAAK,CAAC,IAAI,CAAC,EAAE,UAAU,EAAE,UAAU,EAAE,IAAI,EAAE,IAAI,EAAM,EAAA,SAAS,CAAI,CAAA;;;;;"}
|
|
1
|
+
{"version":3,"file":"Component.desktop.js","sources":["../../../src/components/tabs/Component.desktop.tsx"],"sourcesContent":["import React from 'react';\n\nimport { type TabsProps } from '../../typings';\nimport { PrimaryTabListDesktop } from '../primary-tablist/Component.desktop';\nimport { SecondaryTabListDesktop } from '../secondary-tablist/Component.desktop';\n\nimport { Tabs } from './Component';\n\nconst views = {\n primary: PrimaryTabListDesktop,\n secondary: SecondaryTabListDesktop,\n};\n\nexport type TabsDesktopProps = Omit<\n TabsProps,\n 'TabList' | 'fullWidthScroll' | 'breakpoint' | 'collapsedTabsIds'\n>;\n\nexport const TabsDesktop = ({\n view = 'primary',\n scrollable = false,\n size = view === 'primary' ? 'm' : 's',\n ...restProps\n}: TabsDesktopProps) => (\n <Tabs TabList={views[view]} scrollable={scrollable} size={size} {...restProps} />\n);\n"],"names":["PrimaryTabListDesktop","SecondaryTabListDesktop","__rest","React","Tabs","__assign"],"mappings":";;;;;;;;;;;;;;AAQA,IAAM,KAAK,GAAG;AACV,IAAA,OAAO,EAAEA,yCAAqB;AAC9B,IAAA,SAAS,EAAEC,yCAAuB;CACrC;AAOM,IAAM,WAAW,GAAG,UAAC,EAKT,EAAA;AAJf,IAAA,IAAA,EAAgB,GAAA,EAAA,CAAA,IAAA,EAAhB,IAAI,GAAA,EAAA,KAAA,MAAA,GAAG,SAAS,GAAA,EAAA,EAChB,EAAkB,GAAA,EAAA,CAAA,UAAA,EAAlB,UAAU,GAAG,EAAA,KAAA,MAAA,GAAA,KAAK,GAAA,EAAA,EAClB,YAAqC,EAArC,IAAI,GAAG,EAAA,KAAA,MAAA,GAAA,IAAI,KAAK,SAAS,GAAG,GAAG,GAAG,GAAG,GAAA,EAAA,EAClC,SAAS,GAAAC,YAAA,CAAA,EAAA,EAJY,8BAK3B,CADe;IACQ,QACpBC,qCAACC,cAAI,EAAAC,cAAA,CAAA,EAAC,OAAO,EAAE,KAAK,CAAC,IAAI,CAAC,EAAE,UAAU,EAAE,UAAU,EAAE,IAAI,EAAE,IAAI,EAAM,EAAA,SAAS,CAAI,CAAA;;;;;"}
|
|
@@ -10,20 +10,11 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
|
|
|
10
10
|
var React__default = /*#__PURE__*/_interopDefaultCompat(React);
|
|
11
11
|
|
|
12
12
|
var Tabs = function (_a) {
|
|
13
|
-
var TabList = _a.TabList, className = _a.className, containerClassName = _a.containerClassName, size = _a.size, children = _a.children, selectedId = _a.selectedId, scrollable = _a.scrollable, collapsedTabsIds = _a.collapsedTabsIds, _b = _a.fullWidthScroll, fullWidthScroll = _b === void 0 ? false : _b, _c = _a.keepMounted, keepMounted = _c === void 0 ? false : _c, dataTestId = _a.dataTestId, onChange = _a.onChange, breakpoint = _a.breakpoint, client = _a.client, defaultMatchMediaValue = _a.defaultMatchMediaValue, tagShape = _a.tagShape, tagView = _a.tagView, _d = _a.showSkeleton, showSkeleton = _d === void 0 ? false : _d, skeletonProps = _a.skeletonProps, textStyle = _a.textStyle, style = _a.style, restProps = tslib.__rest(_a, ["TabList", "className", "containerClassName", "size", "children", "selectedId", "scrollable", "collapsedTabsIds", "fullWidthScroll", "keepMounted", "dataTestId", "onChange", "breakpoint", "client", "defaultMatchMediaValue", "tagShape", "tagView", "showSkeleton", "skeletonProps", "textStyle", "style"]);
|
|
13
|
+
var TabList = _a.TabList, className = _a.className, containerClassName = _a.containerClassName, size = _a.size, children = _a.children, selectedId = _a.selectedId, scrollable = _a.scrollable, collapsedTabsIds = _a.collapsedTabsIds, _b = _a.fullWidthScroll, fullWidthScroll = _b === void 0 ? false : _b, _c = _a.keepMounted, keepMounted = _c === void 0 ? false : _c, dataTestId = _a.dataTestId, onChange = _a.onChange, breakpoint = _a.breakpoint, client = _a.client, defaultMatchMediaValue = _a.defaultMatchMediaValue, tagShape = _a.tagShape, tagView = _a.tagView, _d = _a.showSkeleton, showSkeleton = _d === void 0 ? false : _d, skeletonProps = _a.skeletonProps, textStyle = _a.textStyle, style = _a.style, titleProps = _a.titleProps, restProps = tslib.__rest(_a, ["TabList", "className", "containerClassName", "size", "children", "selectedId", "scrollable", "collapsedTabsIds", "fullWidthScroll", "keepMounted", "dataTestId", "onChange", "breakpoint", "client", "defaultMatchMediaValue", "tagShape", "tagView", "showSkeleton", "skeletonProps", "textStyle", "style", "titleProps"]);
|
|
14
14
|
var tabsArray = React__default.default.Children.toArray(children);
|
|
15
15
|
var titles = tabsArray.map(function (_a) {
|
|
16
16
|
var _b = _a.props, title = _b.title, id = _b.id, rightAddons = _b.rightAddons, disabled = _b.disabled, hidden = _b.hidden, toggleClassName = _b.toggleClassName, toggleTestId = _b.dataTestId, toggleRef = _b.toggleRef;
|
|
17
|
-
return ({
|
|
18
|
-
title: title,
|
|
19
|
-
id: id,
|
|
20
|
-
disabled: disabled,
|
|
21
|
-
rightAddons: rightAddons,
|
|
22
|
-
hidden: hidden,
|
|
23
|
-
toggleClassName: toggleClassName,
|
|
24
|
-
dataTestId: toggleTestId,
|
|
25
|
-
toggleRef: toggleRef,
|
|
26
|
-
});
|
|
17
|
+
return (tslib.__assign({ title: title, id: id, disabled: disabled, rightAddons: rightAddons, hidden: hidden, toggleClassName: toggleClassName, dataTestId: toggleTestId, toggleRef: toggleRef }, titleProps));
|
|
27
18
|
});
|
|
28
19
|
var tabs = tabsArray.filter(function (tab) { return tab.props.id === selectedId || tab.props.keepMounted || keepMounted; });
|
|
29
20
|
return (React__default.default.createElement("div", tslib.__assign({ className: className }, restProps),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Component.js","sources":["../../../src/components/tabs/Component.tsx"],"sourcesContent":["import React, { cloneElement } from 'react';\n\nimport { TabsProps } from '../../typings';\n\nexport const Tabs = ({\n TabList,\n className,\n containerClassName,\n size,\n children,\n selectedId,\n scrollable,\n collapsedTabsIds,\n fullWidthScroll = false,\n keepMounted = false,\n dataTestId,\n onChange,\n breakpoint,\n client,\n defaultMatchMediaValue,\n tagShape,\n tagView,\n showSkeleton = false,\n skeletonProps,\n textStyle,\n style,\n ...restProps\n}: Omit<TabsProps, 'view'>) => {\n const tabsArray = React.Children.toArray(children) as TabsProps['children'];\n const titles = tabsArray.map(\n ({\n props: {\n title,\n id,\n rightAddons,\n disabled,\n hidden,\n toggleClassName,\n dataTestId: toggleTestId,\n toggleRef,\n },\n }) => ({\n title,\n id,\n disabled,\n rightAddons,\n hidden,\n toggleClassName,\n dataTestId: toggleTestId,\n toggleRef,\n }),\n );\n\n const tabs = tabsArray.filter(\n (tab) => tab.props.id === selectedId || tab.props.keepMounted || keepMounted,\n );\n\n return (\n <div className={className} {...restProps}>\n <TabList\n containerClassName={containerClassName}\n size={size}\n titles={titles}\n selectedId={selectedId}\n scrollable={scrollable}\n collapsedTabsIds={collapsedTabsIds}\n onChange={onChange}\n dataTestId={dataTestId}\n defaultMatchMediaValue={defaultMatchMediaValue}\n breakpoint={breakpoint}\n client={client}\n fullWidthScroll={fullWidthScroll}\n tagShape={tagShape}\n tagView={tagView}\n textStyle={textStyle}\n inlineStyle={style}\n showSkeleton={showSkeleton}\n skeletonProps={skeletonProps}\n />\n\n {tabs.map((tab) => cloneElement(tab, { hidden: tab.props.id !== selectedId }))}\n </div>\n );\n};\n"],"names":["__rest","React","__assign","cloneElement"],"mappings":";;;;;;;;;;;AAIO,IAAM,IAAI,GAAG,UAAC,
|
|
1
|
+
{"version":3,"file":"Component.js","sources":["../../../src/components/tabs/Component.tsx"],"sourcesContent":["import React, { cloneElement } from 'react';\n\nimport { type TabsProps } from '../../typings';\n\nexport const Tabs = ({\n TabList,\n className,\n containerClassName,\n size,\n children,\n selectedId,\n scrollable,\n collapsedTabsIds,\n fullWidthScroll = false,\n keepMounted = false,\n dataTestId,\n onChange,\n breakpoint,\n client,\n defaultMatchMediaValue,\n tagShape,\n tagView,\n showSkeleton = false,\n skeletonProps,\n textStyle,\n style,\n titleProps,\n ...restProps\n}: Omit<TabsProps, 'view'>) => {\n const tabsArray = React.Children.toArray(children) as TabsProps['children'];\n\n const titles = tabsArray.map(\n ({\n props: {\n title,\n id,\n rightAddons,\n disabled,\n hidden,\n toggleClassName,\n dataTestId: toggleTestId,\n toggleRef,\n },\n }) => ({\n title,\n id,\n disabled,\n rightAddons,\n hidden,\n toggleClassName,\n dataTestId: toggleTestId,\n toggleRef,\n ...titleProps,\n }),\n );\n\n const tabs = tabsArray.filter(\n (tab) => tab.props.id === selectedId || tab.props.keepMounted || keepMounted,\n );\n\n return (\n <div className={className} {...restProps}>\n <TabList\n containerClassName={containerClassName}\n size={size}\n titles={titles}\n selectedId={selectedId}\n scrollable={scrollable}\n collapsedTabsIds={collapsedTabsIds}\n onChange={onChange}\n dataTestId={dataTestId}\n defaultMatchMediaValue={defaultMatchMediaValue}\n breakpoint={breakpoint}\n client={client}\n fullWidthScroll={fullWidthScroll}\n tagShape={tagShape}\n tagView={tagView}\n textStyle={textStyle}\n inlineStyle={style}\n showSkeleton={showSkeleton}\n skeletonProps={skeletonProps}\n />\n\n {tabs.map((tab) => cloneElement(tab, { hidden: tab.props.id !== selectedId }))}\n </div>\n );\n};\n"],"names":["__rest","React","__assign","cloneElement"],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { TabsProps } from '../../typings';
|
|
2
|
+
import { type TabsProps } from '../../typings';
|
|
3
3
|
export declare type TabsMobileProps = Omit<TabsProps, 'TabList' | 'collapsedTabsIds'>;
|
|
4
4
|
export declare const TabsMobile: ({ view, scrollable, ...restProps }: TabsMobileProps) => React.JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Component.mobile.js","sources":["../../../src/components/tabs/Component.mobile.tsx"],"sourcesContent":["import React from 'react';\n\nimport { TabsProps } from '../../typings';\nimport { PrimaryTabListMobile } from '../primary-tablist/Component.mobile';\nimport { SecondaryTabListMobile } from '../secondary-tablist/Component.mobile';\n\nimport { Tabs } from './Component';\n\nconst views = {\n primary: PrimaryTabListMobile,\n secondary: SecondaryTabListMobile,\n};\n\nexport type TabsMobileProps = Omit<TabsProps, 'TabList' | 'collapsedTabsIds'>;\n\nexport const TabsMobile = ({\n view = 'primary',\n scrollable = true,\n ...restProps\n}: TabsMobileProps) => <Tabs TabList={views[view]} scrollable={scrollable} {...restProps} />;\n"],"names":["PrimaryTabListMobile","SecondaryTabListMobile","__rest","React","Tabs","__assign"],"mappings":";;;;;;;;;;;;;;AAQA,IAAM,KAAK,GAAG;AACV,IAAA,OAAO,EAAEA,uCAAoB;AAC7B,IAAA,SAAS,EAAEC,uCAAsB;CACpC;AAIM,IAAM,UAAU,GAAG,UAAC,EAIT,EAAA;AAHd,IAAA,IAAA,YAAgB,EAAhB,IAAI,GAAG,EAAA,KAAA,MAAA,GAAA,SAAS,KAAA,EAChB,EAAA,GAAA,EAAA,CAAA,UAAiB,EAAjB,UAAU,mBAAG,IAAI,GAAA,EAAA,EACd,SAAS,GAAAC,YAAA,CAAA,EAAA,EAHW,sBAI1B,CADe;AACO,IAAA,OAAAC,qCAACC,cAAI,EAAAC,cAAA,CAAA,EAAC,OAAO,EAAE,KAAK,CAAC,IAAI,CAAC,EAAE,UAAU,EAAE,UAAU,EAAM,EAAA,SAAS,EAAI;;;;;"}
|
|
1
|
+
{"version":3,"file":"Component.mobile.js","sources":["../../../src/components/tabs/Component.mobile.tsx"],"sourcesContent":["import React from 'react';\n\nimport { type TabsProps } from '../../typings';\nimport { PrimaryTabListMobile } from '../primary-tablist/Component.mobile';\nimport { SecondaryTabListMobile } from '../secondary-tablist/Component.mobile';\n\nimport { Tabs } from './Component';\n\nconst views = {\n primary: PrimaryTabListMobile,\n secondary: SecondaryTabListMobile,\n};\n\nexport type TabsMobileProps = Omit<TabsProps, 'TabList' | 'collapsedTabsIds'>;\n\nexport const TabsMobile = ({\n view = 'primary',\n scrollable = true,\n ...restProps\n}: TabsMobileProps) => <Tabs TabList={views[view]} scrollable={scrollable} {...restProps} />;\n"],"names":["PrimaryTabListMobile","SecondaryTabListMobile","__rest","React","Tabs","__assign"],"mappings":";;;;;;;;;;;;;;AAQA,IAAM,KAAK,GAAG;AACV,IAAA,OAAO,EAAEA,uCAAoB;AAC7B,IAAA,SAAS,EAAEC,uCAAsB;CACpC;AAIM,IAAM,UAAU,GAAG,UAAC,EAIT,EAAA;AAHd,IAAA,IAAA,YAAgB,EAAhB,IAAI,GAAG,EAAA,KAAA,MAAA,GAAA,SAAS,KAAA,EAChB,EAAA,GAAA,EAAA,CAAA,UAAiB,EAAjB,UAAU,mBAAG,IAAI,GAAA,EAAA,EACd,SAAS,GAAAC,YAAA,CAAA,EAAA,EAHW,sBAI1B,CADe;AACO,IAAA,OAAAC,qCAACC,cAAI,EAAAC,cAAA,CAAA,EAAC,OAAO,EAAE,KAAK,CAAC,IAAI,CAAC,EAAE,UAAU,EAAE,UAAU,EAAM,EAAA,SAAS,EAAI;;;;;"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { TabsProps } from '../../typings';
|
|
2
|
+
import { type TabsProps } from '../../typings';
|
|
3
3
|
export declare type TabsResponsiveProps = Omit<TabsProps, 'TabList' | 'collapsedTabsIds'>;
|
|
4
4
|
export declare const TabsResponsive: ({ view, scrollable, breakpoint, client, defaultMatchMediaValue, ...restProps }: TabsResponsiveProps) => React.JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Component.responsive.js","sources":["../../../src/components/tabs/Component.responsive.tsx"],"sourcesContent":["import React from 'react';\n\nimport { TabsProps } from '../../typings';\nimport { PrimaryTabListResponsive } from '../primary-tablist/Component.responsive';\nimport { SecondaryTabListResponsive } from '../secondary-tablist/Component.responsive';\n\nimport { Tabs } from './Component';\n\nconst views = {\n primary: PrimaryTabListResponsive,\n secondary: SecondaryTabListResponsive,\n};\n\nexport type TabsResponsiveProps = Omit<TabsProps, 'TabList' | 'collapsedTabsIds'>;\n\nexport const TabsResponsive = ({\n view = 'primary',\n scrollable = false,\n breakpoint,\n client,\n defaultMatchMediaValue = client === undefined ? undefined : client === 'desktop',\n ...restProps\n}: TabsResponsiveProps) => (\n <Tabs\n TabList={views[view]}\n scrollable={scrollable}\n defaultMatchMediaValue={defaultMatchMediaValue}\n breakpoint={breakpoint}\n client={client}\n {...restProps}\n />\n);\n"],"names":["PrimaryTabListResponsive","SecondaryTabListResponsive","__rest","React","Tabs","__assign"],"mappings":";;;;;;;;;;;;;;AAQA,IAAM,KAAK,GAAG;AACV,IAAA,OAAO,EAAEA,+CAAwB;AACjC,IAAA,SAAS,EAAEC,+CAA0B;CACxC;AAIM,IAAM,cAAc,GAAG,UAAC,EAOT,EAAA;AANlB,IAAA,IAAA,YAAgB,EAAhB,IAAI,mBAAG,SAAS,GAAA,EAAA,EAChB,EAAkB,GAAA,EAAA,CAAA,UAAA,EAAlB,UAAU,GAAG,EAAA,KAAA,MAAA,GAAA,KAAK,KAAA,EAClB,UAAU,gBAAA,EACV,MAAM,YAAA,EACN,EAAA,GAAA,EAAA,CAAA,sBAAgF,EAAhF,sBAAsB,mBAAG,MAAM,KAAK,SAAS,GAAG,SAAS,GAAG,MAAM,KAAK,SAAS,GAAA,EAAA,EAC7E,SAAS,GAAAC,YAAA,CAAA,EAAA,EANe,wEAO9B,CADe;AACW,IAAA,QACvBC,sBAAA,CAAA,aAAA,CAACC,cAAI,EAAAC,cAAA,CAAA,EACD,OAAO,EAAE,KAAK,CAAC,IAAI,CAAC,EACpB,UAAU,EAAE,UAAU,EACtB,sBAAsB,EAAE,sBAAsB,EAC9C,UAAU,EAAE,UAAU,EACtB,MAAM,EAAE,MAAM,EAAA,EACV,SAAS,CAAA,CACf;;;;;"}
|
|
1
|
+
{"version":3,"file":"Component.responsive.js","sources":["../../../src/components/tabs/Component.responsive.tsx"],"sourcesContent":["import React from 'react';\n\nimport { type TabsProps } from '../../typings';\nimport { PrimaryTabListResponsive } from '../primary-tablist/Component.responsive';\nimport { SecondaryTabListResponsive } from '../secondary-tablist/Component.responsive';\n\nimport { Tabs } from './Component';\n\nconst views = {\n primary: PrimaryTabListResponsive,\n secondary: SecondaryTabListResponsive,\n};\n\nexport type TabsResponsiveProps = Omit<TabsProps, 'TabList' | 'collapsedTabsIds'>;\n\nexport const TabsResponsive = ({\n view = 'primary',\n scrollable = false,\n breakpoint,\n client,\n defaultMatchMediaValue = client === undefined ? undefined : client === 'desktop',\n ...restProps\n}: TabsResponsiveProps) => (\n <Tabs\n TabList={views[view]}\n scrollable={scrollable}\n defaultMatchMediaValue={defaultMatchMediaValue}\n breakpoint={breakpoint}\n client={client}\n {...restProps}\n />\n);\n"],"names":["PrimaryTabListResponsive","SecondaryTabListResponsive","__rest","React","Tabs","__assign"],"mappings":";;;;;;;;;;;;;;AAQA,IAAM,KAAK,GAAG;AACV,IAAA,OAAO,EAAEA,+CAAwB;AACjC,IAAA,SAAS,EAAEC,+CAA0B;CACxC;AAIM,IAAM,cAAc,GAAG,UAAC,EAOT,EAAA;AANlB,IAAA,IAAA,YAAgB,EAAhB,IAAI,mBAAG,SAAS,GAAA,EAAA,EAChB,EAAkB,GAAA,EAAA,CAAA,UAAA,EAAlB,UAAU,GAAG,EAAA,KAAA,MAAA,GAAA,KAAK,KAAA,EAClB,UAAU,gBAAA,EACV,MAAM,YAAA,EACN,EAAA,GAAA,EAAA,CAAA,sBAAgF,EAAhF,sBAAsB,mBAAG,MAAM,KAAK,SAAS,GAAG,SAAS,GAAG,MAAM,KAAK,SAAS,GAAA,EAAA,EAC7E,SAAS,GAAAC,YAAA,CAAA,EAAA,EANe,wEAO9B,CADe;AACW,IAAA,QACvBC,sBAAA,CAAA,aAAA,CAACC,cAAI,EAAAC,cAAA,CAAA,EACD,OAAO,EAAE,KAAK,CAAC,IAAI,CAAC,EACpB,UAAU,EAAE,UAAU,EACtB,sBAAsB,EAAE,sBAAsB,EAC9C,UAAU,EAAE,UAAU,EACtB,MAAM,EAAE,MAAM,EAAA,EACV,SAAS,CAAA,CACf;;;;;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { SkeletonProps } from '@alfalab/core-components-skeleton/cssm';
|
|
3
|
-
import { Styles, TabListTitle } from '../../typings';
|
|
2
|
+
import { type SkeletonProps } from '@alfalab/core-components-skeleton/cssm';
|
|
3
|
+
import { type Styles, type TabListTitle } from '../../typings';
|
|
4
4
|
export declare const Title: React.ForwardRefExoticComponent<TabListTitle & Styles & Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "id" | "title"> & {
|
|
5
5
|
focused?: boolean | undefined;
|
|
6
6
|
isOption?: boolean | undefined;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Component.js","sources":["../../../src/components/title/Component.tsx"],"sourcesContent":["import React, { ButtonHTMLAttributes, forwardRef, useEffect, useRef } from 'react';\nimport mergeRefs from 'react-merge-refs';\nimport cn from 'classnames';\n\nimport { Skeleton, SkeletonProps } from '@alfalab/core-components-skeleton';\n\nimport { Styles, TabListTitle } from '../../typings';\n\ntype Props = TabListTitle &\n Styles &\n Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'id' | 'title'> & {\n focused?: boolean;\n isOption?: boolean;\n showSkeleton?: boolean;\n skeletonProps?: Omit<SkeletonProps, 'visible'>;\n onResize?: () => void;\n };\n\nexport const Title = forwardRef<HTMLButtonElement, Props>(\n (\n {\n id,\n toggleClassName,\n title,\n styles = {},\n rightAddons = null,\n hidden = false,\n selected = false,\n disabled = false,\n collapsed = false,\n focused = false,\n isOption = false,\n showSkeleton = false,\n skeletonProps,\n onResize,\n dataTestId,\n ...restProps\n },\n ref,\n ) => {\n const buttonRef = useRef<HTMLButtonElement | null>(null);\n\n const titleClassName = cn(styles.content, {\n [styles.focused]: focused,\n });\n\n useEffect(() => {\n const resizeObserver = new ResizeObserver(() => {\n if (onResize) {\n onResize();\n }\n });\n\n const button = buttonRef.current;\n\n if (button) {\n resizeObserver.observe(button);\n }\n\n return () => {\n if (button) {\n resizeObserver.unobserve(button);\n }\n };\n }, [onResize]);\n\n return hidden ? null : (\n <button\n {...restProps}\n data-test-id={dataTestId}\n ref={mergeRefs([ref, buttonRef])}\n disabled={disabled || showSkeleton}\n type='button'\n id={String(id)}\n className={cn(\n styles.title,\n {\n [styles.selected]: selected,\n [styles.disabled]: disabled,\n [styles.collapsed]: collapsed && !isOption,\n [styles.option]: isOption,\n },\n toggleClassName,\n )}\n >\n {showSkeleton ? (\n <Skeleton\n {...skeletonProps}\n className={cn(titleClassName, skeletonProps?.className)}\n visible={true}\n >\n {title}\n </Skeleton>\n ) : (\n <span className={titleClassName}>{title}</span>\n )}\n\n {rightAddons && (\n <span\n className={cn(styles.rightAddons, {\n [styles.rightAddonsMarginZero]: !title,\n })}\n >\n {rightAddons}\n </span>\n )}\n </button>\n );\n },\n);\n"],"names":["forwardRef","__rest","useRef","cn","useEffect","React","__assign","mergeRefs","Skeleton"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Component.js","sources":["../../../src/components/title/Component.tsx"],"sourcesContent":["import React, { type ButtonHTMLAttributes, forwardRef, useEffect, useRef } from 'react';\nimport mergeRefs from 'react-merge-refs';\nimport cn from 'classnames';\n\nimport { Skeleton, type SkeletonProps } from '@alfalab/core-components-skeleton';\n\nimport { type Styles, type TabListTitle } from '../../typings';\n\ntype Props = TabListTitle &\n Styles &\n Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'id' | 'title'> & {\n focused?: boolean;\n isOption?: boolean;\n showSkeleton?: boolean;\n skeletonProps?: Omit<SkeletonProps, 'visible'>;\n onResize?: () => void;\n };\n\nexport const Title = forwardRef<HTMLButtonElement, Props>(\n (\n {\n id,\n toggleClassName,\n title,\n styles = {},\n rightAddons = null,\n hidden = false,\n selected = false,\n disabled = false,\n collapsed = false,\n focused = false,\n isOption = false,\n showSkeleton = false,\n skeletonProps,\n onResize,\n dataTestId,\n ...restProps\n },\n ref,\n ) => {\n const buttonRef = useRef<HTMLButtonElement | null>(null);\n\n const titleClassName = cn(styles.content, {\n [styles.focused]: focused,\n });\n\n useEffect(() => {\n const resizeObserver = new ResizeObserver(() => {\n if (onResize) {\n onResize();\n }\n });\n\n const button = buttonRef.current;\n\n if (button) {\n resizeObserver.observe(button);\n }\n\n return () => {\n if (button) {\n resizeObserver.unobserve(button);\n }\n };\n }, [onResize]);\n\n return hidden ? null : (\n <button\n {...restProps}\n data-test-id={dataTestId}\n ref={mergeRefs([ref, buttonRef])}\n disabled={disabled || showSkeleton}\n type='button'\n id={String(id)}\n className={cn(\n styles.title,\n {\n [styles.selected]: selected,\n [styles.disabled]: disabled,\n [styles.collapsed]: collapsed && !isOption,\n [styles.option]: isOption,\n },\n toggleClassName,\n )}\n >\n {showSkeleton ? (\n <Skeleton\n {...skeletonProps}\n className={cn(titleClassName, skeletonProps?.className)}\n visible={true}\n >\n {title}\n </Skeleton>\n ) : (\n <span className={titleClassName}>{title}</span>\n )}\n\n {rightAddons && (\n <span\n className={cn(styles.rightAddons, {\n [styles.rightAddonsMarginZero]: !title,\n })}\n >\n {rightAddons}\n </span>\n )}\n </button>\n );\n },\n);\n"],"names":["forwardRef","__rest","useRef","cn","useEffect","React","__assign","mergeRefs","Skeleton"],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { DependencyList } from 'react';
|
|
1
|
+
import { type DependencyList } from 'react';
|
|
2
2
|
export declare const useCollapsibleElements: <ContainerType extends HTMLElement, AddonType extends HTMLElement>(selectors: string, deps?: DependencyList) => {
|
|
3
3
|
containerRef: import("react").RefObject<ContainerType>;
|
|
4
4
|
addonRef: import("react").RefObject<AddonType>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-collapsible-elements.js","sources":["../../src/hooks/use-collapsible-elements.ts"],"sourcesContent":["import { DependencyList, useRef, useState } from 'react';\nimport { ResizeObserver as ResizeObserverPolyfill } from '@juggle/resize-observer';\n\nimport { useLayoutEffect_SAFE_FOR_SSR } from '@alfalab/hooks';\n\nexport const useCollapsibleElements = <\n ContainerType extends HTMLElement,\n AddonType extends HTMLElement,\n>(\n selectors: string,\n deps: DependencyList = [],\n) => {\n const [idsCollapsedElements, setIdsCollapsedElements] = useState<string[]>([]);\n\n const containerRef = useRef<ContainerType>(null);\n const addonRef = useRef<AddonType>(null);\n\n useLayoutEffect_SAFE_FOR_SSR(() => {\n const collapseElements = (inlineSize?: number) => {\n const container = containerRef.current;\n\n if (!container) return;\n\n const addon = addonRef.current;\n const containerWidth =\n (inlineSize || container.clientWidth) - (addon?.scrollWidth || 0) * 1.5; // при расчётах, даём кнопке \"Ещё\" чуть больше места, чтобы точно влезла\n const elements = Array.from(container.querySelectorAll(selectors))
|
|
1
|
+
{"version":3,"file":"use-collapsible-elements.js","sources":["../../src/hooks/use-collapsible-elements.ts"],"sourcesContent":["import { type DependencyList, useRef, useState } from 'react';\nimport { ResizeObserver as ResizeObserverPolyfill } from '@juggle/resize-observer';\n\nimport { useLayoutEffect_SAFE_FOR_SSR } from '@alfalab/hooks';\n\nexport const useCollapsibleElements = <\n ContainerType extends HTMLElement,\n AddonType extends HTMLElement,\n>(\n selectors: string,\n deps: DependencyList = [],\n) => {\n const [idsCollapsedElements, setIdsCollapsedElements] = useState<string[]>([]);\n\n const containerRef = useRef<ContainerType>(null);\n const addonRef = useRef<AddonType>(null);\n\n useLayoutEffect_SAFE_FOR_SSR(() => {\n const collapseElements = (inlineSize?: number) => {\n const container = containerRef.current;\n\n if (!container) return;\n\n const addon = addonRef.current;\n const containerWidth =\n (inlineSize || container.clientWidth) - (addon?.scrollWidth || 0) * 1.5; // при расчётах, даём кнопке \"Ещё\" чуть больше места, чтобы точно влезла\n const elements = Array.from(container.querySelectorAll<HTMLElement>(selectors));\n\n const collapsedIds = elements.reduce<string[]>((acc, element) => {\n const { offsetLeft, scrollWidth, id } = element;\n const elementOffset = offsetLeft + scrollWidth;\n const isCollapsedElement = getComputedStyle(element).visibility === 'collapse';\n const maxWidth =\n addon && !isCollapsedElement\n ? containerWidth -\n (addon.scrollWidth + parseFloat(getComputedStyle(addon).marginLeft))\n : containerWidth;\n\n if (elementOffset >= maxWidth) acc.push(id);\n\n return acc;\n }, []);\n\n setIdsCollapsedElements(collapsedIds);\n };\n\n const handleElementsResize = (entries: ResizeObserverEntry[]) => {\n if (Array.isArray(entries[0].contentBoxSize)) {\n const [{ inlineSize }] = entries[0].contentBoxSize;\n\n collapseElements(inlineSize);\n } else {\n // old browser compatibility. See https://caniuse.com/mdn-api_resizeobserverentry_contentboxsize\n collapseElements(entries[0].contentRect.width);\n }\n };\n\n const ResizeObserver = window.ResizeObserver || ResizeObserverPolyfill;\n const observer = new ResizeObserver(handleElementsResize);\n\n if (containerRef.current) {\n collapseElements();\n observer.observe(containerRef.current);\n }\n\n return () => observer.disconnect();\n }, [selectors, ...deps]);\n\n return {\n containerRef,\n addonRef,\n idsCollapsedElements,\n };\n};\n"],"names":["useState","useRef","useLayoutEffect_SAFE_FOR_SSR","ResizeObserverPolyfill","__spreadArray"],"mappings":"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"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import { TabListProps } from '../typings';
|
|
2
|
+
import { type TabListProps } from '../typings';
|
|
3
3
|
export declare const useTablistTitles: ({ titles, selectedId, collapsedTabsIds, onChange, breakpoint, client, defaultMatchMediaValue, }: Pick<TabListProps, 'titles' | 'selectedId' | 'collapsedTabsIds' | 'onChange' | 'defaultMatchMediaValue' | 'breakpoint' | 'client'>) => {
|
|
4
4
|
containerRef: import("react").RefObject<HTMLDivElement>;
|
|
5
5
|
addonRef: import("react").RefObject<HTMLInputElement>;
|
|
@@ -14,6 +14,55 @@ export declare const useTablistTitles: ({ titles, selectedId, collapsedTabsIds,
|
|
|
14
14
|
toggleClassName?: string | undefined;
|
|
15
15
|
dataTestId?: string | undefined;
|
|
16
16
|
toggleRef?: import("react").Ref<HTMLDivElement> | undefined;
|
|
17
|
+
titleProps?: import("../typings").TitleProps | undefined;
|
|
18
|
+
'aria-activedescendant'?: string | undefined;
|
|
19
|
+
'aria-atomic'?: (boolean | "true" | "false") | undefined;
|
|
20
|
+
'aria-autocomplete'?: "none" | "inline" | "list" | "both" | undefined;
|
|
21
|
+
'aria-busy'?: (boolean | "true" | "false") | undefined;
|
|
22
|
+
'aria-checked'?: boolean | "true" | "false" | "mixed" | undefined;
|
|
23
|
+
'aria-colcount'?: number | undefined;
|
|
24
|
+
'aria-colindex'?: number | undefined;
|
|
25
|
+
'aria-colspan'?: number | undefined;
|
|
26
|
+
'aria-controls'?: string | undefined;
|
|
27
|
+
'aria-current'?: boolean | "true" | "false" | "page" | "step" | "location" | "date" | "time" | undefined;
|
|
28
|
+
'aria-describedby'?: string | undefined;
|
|
29
|
+
'aria-details'?: string | undefined;
|
|
30
|
+
'aria-disabled'?: (boolean | "true" | "false") | undefined;
|
|
31
|
+
'aria-dropeffect'?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined;
|
|
32
|
+
'aria-errormessage'?: string | undefined;
|
|
33
|
+
'aria-expanded'?: (boolean | "true" | "false") | undefined;
|
|
34
|
+
'aria-flowto'?: string | undefined;
|
|
35
|
+
'aria-grabbed'?: (boolean | "true" | "false") | undefined;
|
|
36
|
+
'aria-haspopup'?: boolean | "true" | "false" | "menu" | "listbox" | "tree" | "grid" | "dialog" | undefined;
|
|
37
|
+
'aria-hidden'?: (boolean | "true" | "false") | undefined;
|
|
38
|
+
'aria-invalid'?: boolean | "true" | "false" | "grammar" | "spelling" | undefined;
|
|
39
|
+
'aria-keyshortcuts'?: string | undefined;
|
|
40
|
+
'aria-label'?: string | undefined;
|
|
41
|
+
'aria-labelledby'?: string | undefined;
|
|
42
|
+
'aria-level'?: number | undefined;
|
|
43
|
+
'aria-live'?: "off" | "assertive" | "polite" | undefined;
|
|
44
|
+
'aria-modal'?: (boolean | "true" | "false") | undefined;
|
|
45
|
+
'aria-multiline'?: (boolean | "true" | "false") | undefined;
|
|
46
|
+
'aria-multiselectable'?: (boolean | "true" | "false") | undefined;
|
|
47
|
+
'aria-orientation'?: "horizontal" | "vertical" | undefined;
|
|
48
|
+
'aria-owns'?: string | undefined;
|
|
49
|
+
'aria-placeholder'?: string | undefined;
|
|
50
|
+
'aria-posinset'?: number | undefined;
|
|
51
|
+
'aria-pressed'?: boolean | "true" | "false" | "mixed" | undefined;
|
|
52
|
+
'aria-readonly'?: (boolean | "true" | "false") | undefined;
|
|
53
|
+
'aria-relevant'?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined;
|
|
54
|
+
'aria-required'?: (boolean | "true" | "false") | undefined;
|
|
55
|
+
'aria-roledescription'?: string | undefined;
|
|
56
|
+
'aria-rowcount'?: number | undefined;
|
|
57
|
+
'aria-rowindex'?: number | undefined;
|
|
58
|
+
'aria-rowspan'?: number | undefined;
|
|
59
|
+
'aria-selected'?: (boolean | "true" | "false") | undefined;
|
|
60
|
+
'aria-setsize'?: number | undefined;
|
|
61
|
+
'aria-sort'?: "none" | "ascending" | "descending" | "other" | undefined;
|
|
62
|
+
'aria-valuemax'?: number | undefined;
|
|
63
|
+
'aria-valuemin'?: number | undefined;
|
|
64
|
+
'aria-valuenow'?: number | undefined;
|
|
65
|
+
'aria-valuetext'?: string | undefined;
|
|
17
66
|
}[];
|
|
18
67
|
selectedTab: HTMLButtonElement | null;
|
|
19
68
|
focusedTab: HTMLButtonElement | null;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-tablist-titles.js","sources":["../../src/hooks/use-tablist-titles.ts"],"sourcesContent":["import { useMemo } from 'react';\n\nimport { useIsDesktop } from '@alfalab/core-components-mq';\n\nimport { TabListProps } from '../typings';\n\nimport { useCollapsibleElements } from './use-collapsible-elements';\nimport { useTabs } from './use-tabs';\n\nexport const useTablistTitles = ({\n titles = [],\n selectedId,\n collapsedTabsIds,\n onChange,\n breakpoint,\n client,\n defaultMatchMediaValue = client === undefined ? undefined : client === 'desktop',\n}: Pick<\n TabListProps,\n | 'titles'\n | 'selectedId'\n | 'collapsedTabsIds'\n | 'onChange'\n | 'defaultMatchMediaValue'\n | 'breakpoint'\n | 'client'\n>) => {\n const { containerRef, addonRef, idsCollapsedElements } = useCollapsibleElements<\n HTMLDivElement,\n HTMLInputElement\n >('[role=tab]', [titles, collapsedTabsIds]);\n\n const isDesktop = useIsDesktop(breakpoint, defaultMatchMediaValue);\n\n const tablistTitles = useMemo(() => {\n const idsCollapsedTitles: string[] = [];\n const idsCollapsed = idsCollapsedElements.concat(collapsedTabsIds || []);\n\n if (isDesktop) {\n const visibleTitles = titles.filter(({ id }) => !idsCollapsed.includes(String(id)));\n const lastVisibleTitle = collapsedTabsIds\n ? null\n : visibleTitles[visibleTitles.length - 1];\n\n idsCollapsed.forEach((id) => {\n if (selectedId === id && lastVisibleTitle) {\n idsCollapsedTitles.push(String(lastVisibleTitle.id));\n }\n if (selectedId !== id) {\n idsCollapsedTitles.push(id);\n }\n });\n }\n\n const titlesMapped = titles.map((title) => ({\n ...title,\n collapsed: idsCollapsedTitles.includes(String(title.id)),\n selected: title.id === selectedId,\n }));\n\n if (collapsedTabsIds?.length) {\n titlesMapped.sort((a, b) => {\n const hasA = collapsedTabsIds.includes(String(a.id));\n const hasB = collapsedTabsIds.includes(String(b.id));\n\n if (hasA === hasB) {\n return 0;\n }\n\n return hasA ? 1 : -1;\n });\n }\n\n return titlesMapped.sort((a, b) => {\n if (a.collapsed === b.collapsed) {\n return 0;\n }\n\n return a.collapsed ? 1 : -1;\n });\n }, [collapsedTabsIds, idsCollapsedElements, isDesktop, titles, selectedId]);\n\n const { selectedTab, focusedTab, getTabListItemProps } = useTabs({\n titles: tablistTitles,\n selectedId,\n onChange,\n });\n\n return {\n containerRef,\n addonRef,\n tablistTitles,\n selectedTab,\n focusedTab,\n getTabListItemProps,\n };\n};\n"],"names":["useCollapsibleElements","useIsDesktop","useMemo","useTabs"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"use-tablist-titles.js","sources":["../../src/hooks/use-tablist-titles.ts"],"sourcesContent":["import { useMemo } from 'react';\n\nimport { useIsDesktop } from '@alfalab/core-components-mq';\n\nimport { type TabListProps } from '../typings';\n\nimport { useCollapsibleElements } from './use-collapsible-elements';\nimport { useTabs } from './use-tabs';\n\nexport const useTablistTitles = ({\n titles = [],\n selectedId,\n collapsedTabsIds,\n onChange,\n breakpoint,\n client,\n defaultMatchMediaValue = client === undefined ? undefined : client === 'desktop',\n}: Pick<\n TabListProps,\n | 'titles'\n | 'selectedId'\n | 'collapsedTabsIds'\n | 'onChange'\n | 'defaultMatchMediaValue'\n | 'breakpoint'\n | 'client'\n>) => {\n const { containerRef, addonRef, idsCollapsedElements } = useCollapsibleElements<\n HTMLDivElement,\n HTMLInputElement\n >('[role=tab]', [titles, collapsedTabsIds]);\n\n const isDesktop = useIsDesktop(breakpoint, defaultMatchMediaValue);\n\n const tablistTitles = useMemo(() => {\n const idsCollapsedTitles: string[] = [];\n const idsCollapsed = idsCollapsedElements.concat(collapsedTabsIds || []);\n\n if (isDesktop) {\n const visibleTitles = titles.filter(({ id }) => !idsCollapsed.includes(String(id)));\n const lastVisibleTitle = collapsedTabsIds\n ? null\n : visibleTitles[visibleTitles.length - 1];\n\n idsCollapsed.forEach((id) => {\n if (selectedId === id && lastVisibleTitle) {\n idsCollapsedTitles.push(String(lastVisibleTitle.id));\n }\n if (selectedId !== id) {\n idsCollapsedTitles.push(id);\n }\n });\n }\n\n const titlesMapped = titles.map((title) => ({\n ...title,\n collapsed: idsCollapsedTitles.includes(String(title.id)),\n selected: title.id === selectedId,\n }));\n\n if (collapsedTabsIds?.length) {\n titlesMapped.sort((a, b) => {\n const hasA = collapsedTabsIds.includes(String(a.id));\n const hasB = collapsedTabsIds.includes(String(b.id));\n\n if (hasA === hasB) {\n return 0;\n }\n\n return hasA ? 1 : -1;\n });\n }\n\n return titlesMapped.sort((a, b) => {\n if (a.collapsed === b.collapsed) {\n return 0;\n }\n\n return a.collapsed ? 1 : -1;\n });\n }, [collapsedTabsIds, idsCollapsedElements, isDesktop, titles, selectedId]);\n\n const { selectedTab, focusedTab, getTabListItemProps } = useTabs({\n titles: tablistTitles,\n selectedId,\n onChange,\n });\n\n return {\n containerRef,\n addonRef,\n tablistTitles,\n selectedTab,\n focusedTab,\n getTabListItemProps,\n };\n};\n"],"names":["useCollapsibleElements","useIsDesktop","useMemo","useTabs"],"mappings":"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"}
|
package/cssm/hooks/use-tabs.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { KeyboardEvent, MouseEvent, MutableRefObject } from 'react';
|
|
2
|
-
import { UseTabsProps } from '../typings';
|
|
1
|
+
import { type KeyboardEvent, type MouseEvent, type MutableRefObject } from 'react';
|
|
2
|
+
import { type UseTabsProps } from '../typings';
|
|
3
3
|
export declare function useTabs({ titles, selectedId, onChange }: UseTabsProps): {
|
|
4
4
|
getTabListItemProps: (index: number, outerRef?: MutableRefObject<HTMLElement>) => {
|
|
5
5
|
role: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-tabs.js","sources":["../../src/hooks/use-tabs.
|
|
1
|
+
{"version":3,"file":"use-tabs.js","sources":["../../src/hooks/use-tabs.ts"],"sourcesContent":["import {\n type KeyboardEvent,\n type MouseEvent,\n type MutableRefObject,\n type Ref,\n useCallback,\n useRef,\n useState,\n} from 'react';\nimport mergeRefs from 'react-merge-refs';\n\nimport { getDataTestId } from '@alfalab/core-components-shared';\n\nimport { type TabListTitle, type UseTabsProps } from '../typings';\n\nexport function useTabs({ titles = [], selectedId, onChange }: UseTabsProps) {\n const [selectedTab, setSelectedTab] = useState<HTMLButtonElement | null>(null);\n const [focusedTab, setFocusedTab] = useState<HTMLButtonElement | null>(null);\n const itemRefs = useRef<HTMLButtonElement[]>([]);\n\n const handleItemRef = useCallback(\n (node: HTMLButtonElement, item: TabListTitle, index: number) => {\n if (node && item.id === selectedId) setSelectedTab(node);\n itemRefs.current[index] = node;\n },\n [selectedId],\n );\n\n const handleItemClick = useCallback(\n (event: MouseEvent, item: TabListTitle) => {\n if (onChange && item.id !== selectedId) {\n onChange(event, { selectedId: item.id });\n }\n },\n [onChange, selectedId],\n );\n\n const focusTab = useCallback(\n (position: 'prev' | 'next' | 'start' | 'end') => {\n const refs = itemRefs.current;\n\n const tabAvailable = (ref: HTMLButtonElement) => ref && !ref.disabled;\n\n if (refs.every((ref) => !tabAvailable(ref))) return;\n\n let focusedTabIndex = refs.findIndex((node) => document.activeElement === node);\n\n if (focusedTabIndex === -1) {\n focusedTabIndex = refs.findIndex((node) => node === selectedTab);\n }\n\n let newFocusIndex;\n\n switch (position) {\n case 'prev':\n newFocusIndex = focusedTabIndex === 0 ? refs.length - 1 : focusedTabIndex - 1;\n break;\n case 'next':\n newFocusIndex = focusedTabIndex === refs.length - 1 ? 0 : focusedTabIndex + 1;\n break;\n case 'start':\n newFocusIndex = 0;\n break;\n case 'end':\n newFocusIndex = refs.length - 1;\n break;\n }\n\n const shift = ['prev', 'end'].includes(position) ? -1 : 1;\n\n while (!tabAvailable(refs[newFocusIndex])) {\n newFocusIndex = (refs.length + newFocusIndex + shift) % refs.length;\n }\n\n refs[newFocusIndex].focus();\n\n setFocusedTab(refs[newFocusIndex]);\n },\n [selectedTab, itemRefs],\n );\n\n const handleKeyDown = useCallback(\n (event: KeyboardEvent<HTMLButtonElement>) => {\n switch (event.key) {\n case 'ArrowLeft':\n focusTab('prev');\n\n event.preventDefault();\n break;\n case 'ArrowRight':\n focusTab('next');\n\n event.preventDefault();\n break;\n case 'Home':\n focusTab('start');\n\n event.preventDefault();\n break;\n case 'End':\n focusTab('end');\n\n event.preventDefault();\n break;\n default:\n break;\n }\n },\n [focusTab],\n );\n\n const getTabListItemProps = (index: number, outerRef?: MutableRefObject<HTMLElement>) => {\n const item = titles[index];\n const itemSelected = item.id === selectedId;\n\n const refs: Array<Ref<HTMLElement>> = [\n (node: HTMLButtonElement) => {\n // eslint-disable-next-line no-param-reassign\n if (outerRef) outerRef.current = node;\n handleItemRef(node, item, index);\n },\n ];\n\n if (item.toggleRef) {\n refs.push(item.toggleRef);\n }\n\n return {\n role: 'tab',\n tabIndex: itemSelected ? 0 : -1,\n 'aria-selected': itemSelected,\n selected: itemSelected,\n dataTestId: getDataTestId(item.dataTestId, 'toggle'),\n disabled: item.disabled,\n ref: mergeRefs(refs),\n onKeyDown: handleKeyDown,\n onClick: (event?: MouseEvent) => handleItemClick(event as MouseEvent, item),\n };\n };\n\n return {\n getTabListItemProps,\n selectedTab,\n focusedTab,\n };\n}\n"],"names":["useState","useRef","useCallback","getDataTestId","mergeRefs"],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React from 'react';
|
|
1
|
+
import type React from 'react';
|
|
2
2
|
export declare const createSyntheticEvent: <T extends Element, E extends Event>(event: E) => React.SyntheticEvent<T, E>;
|
|
3
3
|
export declare const createUIEvent: <T extends Element, E extends Event>(event: E) => React.UIEvent<T, E>;
|
|
4
4
|
export declare const createSyntheticMouseEvent: <T extends Element>(event: MouseEvent) => React.MouseEvent<T, MouseEvent>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"synthetic-events.js","sources":["../src/synthetic-events.ts"],"sourcesContent":["import React from 'react';\n\nexport const createSyntheticEvent = <T extends Element, E extends Event>(\n event: E,\n): React.SyntheticEvent<T, E> => {\n let isDefaultPrevented = false;\n let isPropagationStopped = false;\n const preventDefault = () => {\n isDefaultPrevented = true;\n event.preventDefault();\n };\n const stopPropagation = () => {\n isPropagationStopped = true;\n event.stopPropagation();\n };\n\n return {\n nativeEvent: event,\n currentTarget: event.currentTarget as EventTarget & T,\n target: event.target as EventTarget & T,\n bubbles: event.bubbles,\n cancelable: event.cancelable,\n defaultPrevented: event.defaultPrevented,\n eventPhase: event.eventPhase,\n isTrusted: event.isTrusted,\n preventDefault,\n isDefaultPrevented: () => isDefaultPrevented,\n stopPropagation,\n isPropagationStopped: () => isPropagationStopped,\n persist: () => {},\n timeStamp: event.timeStamp,\n type: event.type,\n };\n};\n\nexport const createUIEvent = <T extends Element, E extends Event>(\n event: E,\n): React.UIEvent<T, E> => ({\n ...createSyntheticEvent(event),\n detail: 0,\n view: {\n styleMedia: {\n type: '',\n matchMedium: () => false,\n },\n document,\n },\n});\n\nexport const createSyntheticMouseEvent = <T extends Element>(\n event: MouseEvent,\n): React.MouseEvent<T, MouseEvent> => ({\n ...createUIEvent<T, MouseEvent>(event),\n altKey: event.altKey,\n button: event.button,\n buttons: event.buttons,\n clientX: event.clientX,\n clientY: event.clientY,\n ctrlKey: event.ctrlKey,\n getModifierState: event.getModifierState,\n metaKey: event.metaKey,\n movementX: event.movementX,\n movementY: event.movementY,\n pageX: event.pageX,\n pageY: event.pageY,\n relatedTarget: event.relatedTarget,\n screenX: event.screenX,\n screenY: event.screenY,\n shiftKey: event.shiftKey,\n});\n"],"names":["__assign"],"mappings":";;;;;;AAEO,IAAM,oBAAoB,GAAG,UAChC,KAAQ,EAAA;IAER,IAAI,kBAAkB,GAAG,KAAK;IAC9B,IAAI,oBAAoB,GAAG,KAAK;AAChC,IAAA,IAAM,cAAc,GAAG,YAAA;QACnB,kBAAkB,GAAG,IAAI;QACzB,KAAK,CAAC,cAAc,EAAE;AAC1B,KAAC;AACD,IAAA,IAAM,eAAe,GAAG,YAAA;QACpB,oBAAoB,GAAG,IAAI;QAC3B,KAAK,CAAC,eAAe,EAAE;AAC3B,KAAC;IAED,OAAO;AACH,QAAA,WAAW,EAAE,KAAK;QAClB,aAAa,EAAE,KAAK,CAAC,aAAgC;QACrD,MAAM,EAAE,KAAK,CAAC,MAAyB;QACvC,OAAO,EAAE,KAAK,CAAC,OAAO;QACtB,UAAU,EAAE,KAAK,CAAC,UAAU;QAC5B,gBAAgB,EAAE,KAAK,CAAC,gBAAgB;QACxC,UAAU,EAAE,KAAK,CAAC,UAAU;QAC5B,SAAS,EAAE,KAAK,CAAC,SAAS;AAC1B,QAAA,cAAc,EAAA,cAAA;AACd,QAAA,kBAAkB,EAAE,YAAA,EAAM,OAAA,kBAAkB,GAAA;AAC5C,QAAA,eAAe,EAAA,eAAA;AACf,QAAA,oBAAoB,EAAE,YAAA,EAAM,OAAA,oBAAoB,GAAA;QAChD,OAAO,EAAE,eAAQ;QACjB,SAAS,EAAE,KAAK,CAAC,SAAS;QAC1B,IAAI,EAAE,KAAK,CAAC,IAAI;KACnB;AACL;AAEa,IAAA,aAAa,GAAG,UACzB,KAAQ,IACc,QAAAA,cAAA,CAAAA,cAAA,CAAA,EAAA,EACnB,oBAAoB,CAAC,KAAK,CAAC,CAC9B,EAAA,EAAA,MAAM,EAAE,CAAC,EACT,IAAI,EAAE;AACF,QAAA,UAAU,EAAE;AACR,YAAA,IAAI,EAAE,EAAE;AACR,YAAA,WAAW,EAAE,YAAA,EAAM,OAAA,KAAK,GAAA;AAC3B,SAAA;AACD,QAAA,QAAQ,EAAA,QAAA;KACX,EACH,CAAA,EAAA;AAEW,IAAA,yBAAyB,GAAG,UACrC,KAAiB,EACiB,EAAA,QAC/BA,cAAA,CAAAA,cAAA,CAAA,EAAA,EAAA,aAAa,CAAgB,KAAK,CAAC,CACtC,EAAA,EAAA,MAAM,EAAE,KAAK,CAAC,MAAM,EACpB,MAAM,EAAE,KAAK,CAAC,MAAM,EACpB,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,gBAAgB,EAAE,KAAK,CAAC,gBAAgB,EACxC,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,SAAS,EAAE,KAAK,CAAC,SAAS,EAC1B,SAAS,EAAE,KAAK,CAAC,SAAS,EAC1B,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,aAAa,EAAE,KAAK,CAAC,aAAa,EAClC,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAA,CAAA,EAjBU;;;;;;"}
|
|
1
|
+
{"version":3,"file":"synthetic-events.js","sources":["../src/synthetic-events.ts"],"sourcesContent":["import type React from 'react';\n\nexport const createSyntheticEvent = <T extends Element, E extends Event>(\n event: E,\n): React.SyntheticEvent<T, E> => {\n let isDefaultPrevented = false;\n let isPropagationStopped = false;\n const preventDefault = () => {\n isDefaultPrevented = true;\n event.preventDefault();\n };\n const stopPropagation = () => {\n isPropagationStopped = true;\n event.stopPropagation();\n };\n\n return {\n nativeEvent: event,\n currentTarget: event.currentTarget as EventTarget & T,\n target: event.target as EventTarget & T,\n bubbles: event.bubbles,\n cancelable: event.cancelable,\n defaultPrevented: event.defaultPrevented,\n eventPhase: event.eventPhase,\n isTrusted: event.isTrusted,\n preventDefault,\n isDefaultPrevented: () => isDefaultPrevented,\n stopPropagation,\n isPropagationStopped: () => isPropagationStopped,\n persist: () => {},\n timeStamp: event.timeStamp,\n type: event.type,\n };\n};\n\nexport const createUIEvent = <T extends Element, E extends Event>(\n event: E,\n): React.UIEvent<T, E> => ({\n ...createSyntheticEvent(event),\n detail: 0,\n view: {\n styleMedia: {\n type: '',\n matchMedium: () => false,\n },\n document,\n },\n});\n\nexport const createSyntheticMouseEvent = <T extends Element>(\n event: MouseEvent,\n): React.MouseEvent<T, MouseEvent> => ({\n ...createUIEvent<T, MouseEvent>(event),\n altKey: event.altKey,\n button: event.button,\n buttons: event.buttons,\n clientX: event.clientX,\n clientY: event.clientY,\n ctrlKey: event.ctrlKey,\n getModifierState: event.getModifierState,\n metaKey: event.metaKey,\n movementX: event.movementX,\n movementY: event.movementY,\n pageX: event.pageX,\n pageY: event.pageY,\n relatedTarget: event.relatedTarget,\n screenX: event.screenX,\n screenY: event.screenY,\n shiftKey: event.shiftKey,\n});\n"],"names":["__assign"],"mappings":";;;;;;AAEO,IAAM,oBAAoB,GAAG,UAChC,KAAQ,EAAA;IAER,IAAI,kBAAkB,GAAG,KAAK;IAC9B,IAAI,oBAAoB,GAAG,KAAK;AAChC,IAAA,IAAM,cAAc,GAAG,YAAA;QACnB,kBAAkB,GAAG,IAAI;QACzB,KAAK,CAAC,cAAc,EAAE;AAC1B,KAAC;AACD,IAAA,IAAM,eAAe,GAAG,YAAA;QACpB,oBAAoB,GAAG,IAAI;QAC3B,KAAK,CAAC,eAAe,EAAE;AAC3B,KAAC;IAED,OAAO;AACH,QAAA,WAAW,EAAE,KAAK;QAClB,aAAa,EAAE,KAAK,CAAC,aAAgC;QACrD,MAAM,EAAE,KAAK,CAAC,MAAyB;QACvC,OAAO,EAAE,KAAK,CAAC,OAAO;QACtB,UAAU,EAAE,KAAK,CAAC,UAAU;QAC5B,gBAAgB,EAAE,KAAK,CAAC,gBAAgB;QACxC,UAAU,EAAE,KAAK,CAAC,UAAU;QAC5B,SAAS,EAAE,KAAK,CAAC,SAAS;AAC1B,QAAA,cAAc,EAAA,cAAA;AACd,QAAA,kBAAkB,EAAE,YAAA,EAAM,OAAA,kBAAkB,GAAA;AAC5C,QAAA,eAAe,EAAA,eAAA;AACf,QAAA,oBAAoB,EAAE,YAAA,EAAM,OAAA,oBAAoB,GAAA;QAChD,OAAO,EAAE,eAAQ;QACjB,SAAS,EAAE,KAAK,CAAC,SAAS;QAC1B,IAAI,EAAE,KAAK,CAAC,IAAI;KACnB;AACL;AAEa,IAAA,aAAa,GAAG,UACzB,KAAQ,IACc,QAAAA,cAAA,CAAAA,cAAA,CAAA,EAAA,EACnB,oBAAoB,CAAC,KAAK,CAAC,CAC9B,EAAA,EAAA,MAAM,EAAE,CAAC,EACT,IAAI,EAAE;AACF,QAAA,UAAU,EAAE;AACR,YAAA,IAAI,EAAE,EAAE;AACR,YAAA,WAAW,EAAE,YAAA,EAAM,OAAA,KAAK,GAAA;AAC3B,SAAA;AACD,QAAA,QAAQ,EAAA,QAAA;KACX,EACH,CAAA,EAAA;AAEW,IAAA,yBAAyB,GAAG,UACrC,KAAiB,EACiB,EAAA,QAC/BA,cAAA,CAAAA,cAAA,CAAA,EAAA,EAAA,aAAa,CAAgB,KAAK,CAAC,CACtC,EAAA,EAAA,MAAM,EAAE,KAAK,CAAC,MAAM,EACpB,MAAM,EAAE,KAAK,CAAC,MAAM,EACpB,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,gBAAgB,EAAE,KAAK,CAAC,gBAAgB,EACxC,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,SAAS,EAAE,KAAK,CAAC,SAAS,EAC1B,SAAS,EAAE,KAAK,CAAC,SAAS,EAC1B,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,aAAa,EAAE,KAAK,CAAC,aAAa,EAClC,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAA,CAAA,EAjBU;;;;;;"}
|
package/cssm/typings.d.ts
CHANGED
|
@@ -1,7 +1,8 @@
|
|
|
1
|
-
import { AriaAttributes, FC, HTMLAttributes, MouseEvent, ReactElement, ReactNode, Ref } from 'react';
|
|
2
|
-
import { SkeletonProps } from '@alfalab/core-components-skeleton/cssm';
|
|
3
|
-
import { TagProps } from '@alfalab/core-components-tag/cssm';
|
|
1
|
+
import { type AriaAttributes, type FC, type HTMLAttributes, type MouseEvent, type ReactElement, type ReactNode, type Ref } from 'react';
|
|
2
|
+
import { type SkeletonProps } from '@alfalab/core-components-skeleton/cssm';
|
|
3
|
+
import { type TagProps } from '@alfalab/core-components-tag/cssm';
|
|
4
4
|
export declare type SelectedId = string | number;
|
|
5
|
+
export declare type TitleProps = Omit<HTMLAttributes<HTMLButtonElement>, 'onClick' | 'onKeyDown' | 'className' | 'disabled' | 'id' | 'role' | 'tabIndex' | 'aria-selected'> & AriaAttributes;
|
|
5
6
|
export interface TabsProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange' | 'children' | 'className'>, AriaAttributes {
|
|
6
7
|
/**
|
|
7
8
|
* Дополнительный класс
|
|
@@ -99,6 +100,10 @@ export interface TabsProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChang
|
|
|
99
100
|
* Доп. пропсы для скелетона
|
|
100
101
|
*/
|
|
101
102
|
skeletonProps?: Omit<SkeletonProps, 'visible'>;
|
|
103
|
+
/**
|
|
104
|
+
* Доп. пропсы для заголовка таба
|
|
105
|
+
*/
|
|
106
|
+
titleProps?: TitleProps;
|
|
102
107
|
}
|
|
103
108
|
export interface TabProps extends AriaAttributes {
|
|
104
109
|
/**
|
|
@@ -145,8 +150,12 @@ export interface TabProps extends AriaAttributes {
|
|
|
145
150
|
* Реф для кнопки переключения таба
|
|
146
151
|
*/
|
|
147
152
|
toggleRef?: Ref<HTMLDivElement>;
|
|
153
|
+
/**
|
|
154
|
+
* Доп. пропсы для заголовка таба
|
|
155
|
+
*/
|
|
156
|
+
titleProps?: TitleProps;
|
|
148
157
|
}
|
|
149
|
-
export interface TabListTitle {
|
|
158
|
+
export interface TabListTitle extends AriaAttributes {
|
|
150
159
|
title: NonNullable<ReactNode>;
|
|
151
160
|
id: SelectedId;
|
|
152
161
|
disabled?: boolean;
|
|
@@ -157,6 +166,7 @@ export interface TabListTitle {
|
|
|
157
166
|
collapsed?: boolean;
|
|
158
167
|
dataTestId?: string;
|
|
159
168
|
toggleRef?: Ref<HTMLDivElement>;
|
|
169
|
+
titleProps?: TitleProps;
|
|
160
170
|
}
|
|
161
171
|
export interface TabListProps extends Pick<TabsProps, 'className' | 'containerClassName' | 'size' | 'defaultMatchMediaValue' | 'selectedId' | 'scrollable' | 'collapsedTabsIds' | 'onChange' | 'dataTestId' | 'fullWidthScroll' | 'tagShape' | 'tagView' | 'textStyle' | 'showSkeleton' | 'skeletonProps'> {
|
|
162
172
|
/**
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { TabListProps } from '../../typings';
|
|
2
|
+
import { type TabListProps } from '../../typings';
|
|
3
3
|
export declare const CollapsiblePrimaryTabList: ({ size, className, containerClassName, titles, selectedId, collapsedTabsIds, fullWidthScroll, onChange, dataTestId, breakpoint, client, defaultMatchMediaValue, textStyle, showSkeleton, skeletonProps, }: TabListProps) => React.JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Component.collapsible.js","sources":["../../../src/components/primary-tablist/Component.collapsible.tsx"],"sourcesContent":["import React, { Ref, useEffect, useMemo, useRef } from 'react';\nimport cn from 'classnames';\n\nimport { Badge } from '@alfalab/core-components-badge';\nimport { KeyboardFocusable } from '@alfalab/core-components-keyboard-focusable';\nimport {\n PickerButtonDesktop,\n PickerButtonDesktopProps,\n} from '@alfalab/core-components-picker-button/desktop';\n\nimport { useTablistTitles } from '../../hooks/use-tablist-titles';\nimport { createSyntheticMouseEvent } from '../../synthetic-events';\nimport { TabListProps } from '../../typings';\nimport { Title } from '../title';\n\nimport styles from './index.module.css';\n\nexport const CollapsiblePrimaryTabList = ({\n size = 'm',\n className,\n containerClassName,\n titles = [],\n selectedId = titles.length ? titles[0].id : undefined,\n collapsedTabsIds,\n fullWidthScroll,\n onChange,\n dataTestId,\n breakpoint,\n client,\n defaultMatchMediaValue,\n textStyle,\n showSkeleton,\n skeletonProps,\n}: TabListProps) => {\n const lineRef = useRef<HTMLDivElement>(null);\n\n const { containerRef, addonRef, tablistTitles, selectedTab, getTabListItemProps } =\n useTablistTitles({\n titles,\n selectedId,\n collapsedTabsIds,\n onChange,\n breakpoint,\n client,\n defaultMatchMediaValue,\n });\n\n useEffect(() => {\n if (selectedTab && lineRef.current) {\n lineRef.current.style.width = `${selectedTab.offsetWidth}px`;\n lineRef.current.style.transform = `translateX(${selectedTab.offsetLeft}px)`;\n }\n }, [selectedTab, tablistTitles]);\n\n const collapsedOptions = useMemo(\n () =>\n tablistTitles.reduce<PickerButtonDesktopProps['options']>(\n (options, { toggleRef, ...title }) => {\n if (title.collapsed) {\n options.push({\n key: String(title.id),\n value: title.id,\n content: (\n <Title\n {...title}\n ref={toggleRef as Ref<HTMLButtonElement>}\n styles={styles}\n isOption={true}\n />\n ),\n });\n }\n\n return options;\n },\n [],\n ),\n [tablistTitles],\n );\n\n const collapsedAddonsLength = tablistTitles.filter(\n (title) => title.collapsed && title.rightAddons,\n ).length;\n\n const handleOptionsChange = (\n payload: Parameters<Required<PickerButtonDesktopProps>['onChange']>[0],\n ) => {\n if (payload.selected?.value && onChange) {\n const nativeMouseEvent = new MouseEvent('change');\n const syntheticMouseEvent = createSyntheticMouseEvent(nativeMouseEvent);\n\n onChange(syntheticMouseEvent, { selectedId: payload.selected.value });\n }\n };\n\n const renderContent = () => (\n <div\n role='tablist'\n data-test-id={dataTestId}\n className={cn(styles.component, className, !textStyle && size && styles[size], {\n [styles.fullWidthScroll]: fullWidthScroll,\n })}\n >\n {tablistTitles.map(({ dataTestId: _, toggleRef: __, ...restTitleProps }, index) => (\n <KeyboardFocusable key={restTitleProps.id}>\n {(ref, focused) => (\n <Title\n {...getTabListItemProps(index, ref)}\n {...restTitleProps}\n focused={focused}\n styles={styles}\n showSkeleton={showSkeleton}\n skeletonProps={skeletonProps}\n />\n )}\n </KeyboardFocusable>\n ))}\n\n {collapsedOptions.length ? (\n <span ref={addonRef} role='menu' className={styles.pickerWrapper}>\n <PickerButtonDesktop\n fieldClassName={styles.title}\n optionClassName={cn(size && styles[size])}\n options={collapsedOptions}\n onChange={handleOptionsChange}\n rightAddons={\n collapsedAddonsLength ? (\n <Badge view='count' content={collapsedAddonsLength} />\n ) : null\n }\n size='m'\n view='text'\n label='Ещё'\n popoverPosition='bottom-end'\n disabled={showSkeleton}\n />\n </span>\n ) : null}\n\n <div className={styles.line} ref={lineRef} />\n </div>\n );\n\n return (\n <div\n ref={containerRef}\n className={cn(\n styles.container,\n textStyle && styles[textStyle],\n styles.desktop,\n containerClassName,\n )}\n >\n {renderContent()}\n </div>\n );\n};\n"],"names":["styles"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Component.collapsible.js","sources":["../../../src/components/primary-tablist/Component.collapsible.tsx"],"sourcesContent":["import React, { type Ref, useEffect, useMemo, useRef } from 'react';\nimport cn from 'classnames';\n\nimport { Badge } from '@alfalab/core-components-badge';\nimport { KeyboardFocusable } from '@alfalab/core-components-keyboard-focusable';\nimport {\n PickerButtonDesktop,\n type PickerButtonDesktopProps,\n} from '@alfalab/core-components-picker-button/desktop';\n\nimport { useTablistTitles } from '../../hooks/use-tablist-titles';\nimport { createSyntheticMouseEvent } from '../../synthetic-events';\nimport { type TabListProps } from '../../typings';\nimport { Title } from '../title';\n\nimport styles from './index.module.css';\n\nexport const CollapsiblePrimaryTabList = ({\n size = 'm',\n className,\n containerClassName,\n titles = [],\n selectedId = titles.length ? titles[0].id : undefined,\n collapsedTabsIds,\n fullWidthScroll,\n onChange,\n dataTestId,\n breakpoint,\n client,\n defaultMatchMediaValue,\n textStyle,\n showSkeleton,\n skeletonProps,\n}: TabListProps) => {\n const lineRef = useRef<HTMLDivElement>(null);\n\n const { containerRef, addonRef, tablistTitles, selectedTab, getTabListItemProps } =\n useTablistTitles({\n titles,\n selectedId,\n collapsedTabsIds,\n onChange,\n breakpoint,\n client,\n defaultMatchMediaValue,\n });\n\n useEffect(() => {\n if (selectedTab && lineRef.current) {\n lineRef.current.style.width = `${selectedTab.offsetWidth}px`;\n lineRef.current.style.transform = `translateX(${selectedTab.offsetLeft}px)`;\n }\n }, [selectedTab, tablistTitles]);\n\n const collapsedOptions = useMemo(\n () =>\n tablistTitles.reduce<PickerButtonDesktopProps['options']>(\n (options, { toggleRef, ...title }) => {\n if (title.collapsed) {\n options.push({\n key: String(title.id),\n value: title.id,\n content: (\n <Title\n {...title}\n ref={toggleRef as Ref<HTMLButtonElement>}\n styles={styles}\n isOption={true}\n />\n ),\n });\n }\n\n return options;\n },\n [],\n ),\n [tablistTitles],\n );\n\n const collapsedAddonsLength = tablistTitles.filter(\n (title) => title.collapsed && title.rightAddons,\n ).length;\n\n const handleOptionsChange = (\n payload: Parameters<Required<PickerButtonDesktopProps>['onChange']>[0],\n ) => {\n if (payload.selected?.value && onChange) {\n const nativeMouseEvent = new MouseEvent('change');\n const syntheticMouseEvent = createSyntheticMouseEvent(nativeMouseEvent);\n\n onChange(syntheticMouseEvent, { selectedId: payload.selected.value });\n }\n };\n\n const renderContent = () => (\n <div\n role='tablist'\n data-test-id={dataTestId}\n className={cn(styles.component, className, !textStyle && size && styles[size], {\n [styles.fullWidthScroll]: fullWidthScroll,\n })}\n >\n {tablistTitles.map(({ dataTestId: _, toggleRef: __, ...restTitleProps }, index) => (\n <KeyboardFocusable key={restTitleProps.id}>\n {(ref, focused) => (\n <Title\n {...getTabListItemProps(index, ref)}\n {...restTitleProps}\n focused={focused}\n styles={styles}\n showSkeleton={showSkeleton}\n skeletonProps={skeletonProps}\n />\n )}\n </KeyboardFocusable>\n ))}\n\n {collapsedOptions.length ? (\n <span ref={addonRef} role='menu' className={styles.pickerWrapper}>\n <PickerButtonDesktop\n fieldClassName={styles.title}\n optionClassName={cn(size && styles[size])}\n options={collapsedOptions}\n onChange={handleOptionsChange}\n rightAddons={\n collapsedAddonsLength ? (\n <Badge view='count' content={collapsedAddonsLength} />\n ) : null\n }\n size='m'\n view='text'\n label='Ещё'\n popoverPosition='bottom-end'\n disabled={showSkeleton}\n />\n </span>\n ) : null}\n\n <div className={styles.line} ref={lineRef} />\n </div>\n );\n\n return (\n <div\n ref={containerRef}\n className={cn(\n styles.container,\n textStyle && styles[textStyle],\n styles.desktop,\n containerClassName,\n )}\n >\n {renderContent()}\n </div>\n );\n};\n"],"names":["styles"],"mappings":"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"}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { PlatformProps, Styles, TabListProps } from '../../typings';
|
|
2
|
+
import { type PlatformProps, type Styles, type TabListProps } from '../../typings';
|
|
3
3
|
export declare const PrimaryTabList: ({ size, styles, className, containerClassName, titles, selectedId, scrollable, fullWidthScroll, onChange, dataTestId, platform, textStyle, inlineStyle, showSkeleton, skeletonProps, }: TabListProps & Styles & PlatformProps) => React.JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Component.desktop.js","sources":["../../../src/components/primary-tablist/Component.desktop.tsx"],"sourcesContent":["import React from 'react';\n\nimport { TabListProps } from '../../typings';\n\nimport { PrimaryTabList } from './Component';\n\nimport styles from './index.module.css';\n\nexport const PrimaryTabListDesktop = ({ size = 'm', ...restProps }: TabListProps) => (\n <PrimaryTabList {...restProps} size={size} styles={styles} platform='desktop' />\n);\n"],"names":["styles"],"mappings":";;;;;AAQO,IAAM,qBAAqB,GAAG,UAAC,EAA0C,EAAA;IAAxC,IAAA,EAAA,GAAA,EAAA,CAAA,IAAU,EAAV,IAAI,GAAG,EAAA,KAAA,MAAA,GAAA,GAAG,KAAA,EAAK,SAAS,GAA1B,MAAA,CAAA,EAAA,EAAA,CAAA,MAAA,CAA4B,CAAF;AAAqB,IAAA,QACjF,KAAC,CAAA,aAAA,CAAA,cAAc,eAAK,SAAS,EAAA,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,EAAEA,YAAM,EAAE,QAAQ,EAAC,SAAS,EAAA,CAAA,CAAG;;;;;"}
|
|
1
|
+
{"version":3,"file":"Component.desktop.js","sources":["../../../src/components/primary-tablist/Component.desktop.tsx"],"sourcesContent":["import React from 'react';\n\nimport { type TabListProps } from '../../typings';\n\nimport { PrimaryTabList } from './Component';\n\nimport styles from './index.module.css';\n\nexport const PrimaryTabListDesktop = ({ size = 'm', ...restProps }: TabListProps) => (\n <PrimaryTabList {...restProps} size={size} styles={styles} platform='desktop' />\n);\n"],"names":["styles"],"mappings":";;;;;AAQO,IAAM,qBAAqB,GAAG,UAAC,EAA0C,EAAA;IAAxC,IAAA,EAAA,GAAA,EAAA,CAAA,IAAU,EAAV,IAAI,GAAG,EAAA,KAAA,MAAA,GAAA,GAAG,KAAA,EAAK,SAAS,GAA1B,MAAA,CAAA,EAAA,EAAA,CAAA,MAAA,CAA4B,CAAF;AAAqB,IAAA,QACjF,KAAC,CAAA,aAAA,CAAA,cAAc,eAAK,SAAS,EAAA,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,EAAEA,YAAM,EAAE,QAAQ,EAAC,SAAS,EAAA,CAAA,CAAG;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Component.js","sources":["../../../src/components/primary-tablist/Component.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useRef } from 'react';\nimport { ResizeObserver as ResizeObserverPolyfill } from '@juggle/resize-observer';\nimport cn from 'classnames';\n\nimport { KeyboardFocusable } from '@alfalab/core-components-keyboard-focusable';\nimport { fnUtils } from '@alfalab/core-components-shared';\n\nimport { useTabs } from '../../hooks/use-tabs';\nimport { PlatformProps, Styles, TabListProps } from '../../typings';\nimport { ScrollableContainer } from '../scrollable-container';\nimport { Title } from '../title';\n\nexport const PrimaryTabList = ({\n size,\n styles = {},\n className,\n containerClassName,\n titles = [],\n selectedId = titles.length ? titles[0].id : undefined,\n scrollable = true,\n fullWidthScroll,\n onChange,\n dataTestId,\n platform,\n textStyle,\n inlineStyle,\n showSkeleton,\n skeletonProps,\n}: TabListProps & Styles & PlatformProps) => {\n const lineRef = useRef<HTMLDivElement>(null);\n\n const { selectedTab, focusedTab, getTabListItemProps } = useTabs({\n titles,\n selectedId,\n onChange,\n });\n\n // расчет размера и положения нижней полосы\n useEffect(() => {\n if (selectedTab) {\n const updateLineWidth = () => {\n if (lineRef.current) {\n lineRef.current.style.width = `${selectedTab.offsetWidth}px`;\n lineRef.current.style.transform = `translateX(${selectedTab.offsetLeft}px)`;\n }\n };\n\n const ResizeObserver = window.ResizeObserver || ResizeObserverPolyfill;\n const observer = new ResizeObserver(updateLineWidth);\n\n observer.observe(selectedTab);\n\n return () => observer.disconnect();\n }\n\n return fnUtils.noop;\n }, [selectedTab, titles]);\n\n const handleTitleResize = useCallback(() => {\n if (selectedTab && lineRef.current) {\n lineRef.current.style.width = `${selectedTab.offsetWidth}px`;\n lineRef.current.style.transform = `translateX(${selectedTab.offsetLeft}px)`;\n }\n }, [selectedTab]);\n\n const renderContent = () => (\n <div\n role='tablist'\n data-test-id={dataTestId}\n className={cn(styles.component, className, !textStyle && size && styles[size], {\n [styles.fullWidthScroll]: fullWidthScroll,\n })}\n >\n {titles.map(({ dataTestId: _, toggleRef: __, ...restTitleProps }, index) => (\n <KeyboardFocusable key={restTitleProps.id}>\n {(ref, focused) => (\n <Title\n {...getTabListItemProps(index, ref)}\n {...restTitleProps}\n focused={focused}\n styles={styles}\n showSkeleton={showSkeleton}\n skeletonProps={skeletonProps}\n onResize={handleTitleResize}\n />\n )}\n </KeyboardFocusable>\n ))}\n\n <div className={styles.line} ref={lineRef} />\n </div>\n );\n\n const wrapperClassName = cn(textStyle && styles[textStyle], styles[platform]);\n\n return scrollable ? (\n <ScrollableContainer\n containerWrapperClassName={wrapperClassName}\n activeChild={focusedTab || selectedTab}\n containerClassName={containerClassName}\n scrollControlsClassName={cn(textStyle && styles.scrollControls)}\n fullWidthScroll={fullWidthScroll}\n view='primary'\n size={textStyle ? undefined : size}\n platform={platform}\n inlineStyle={inlineStyle}\n showSkeleton={showSkeleton}\n >\n {renderContent()}\n </ScrollableContainer>\n ) : (\n <div\n className={cn(styles.container, wrapperClassName, containerClassName)}\n style={inlineStyle}\n >\n {renderContent()}\n </div>\n );\n};\n"],"names":["ResizeObserverPolyfill"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Component.js","sources":["../../../src/components/primary-tablist/Component.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useRef } from 'react';\nimport { ResizeObserver as ResizeObserverPolyfill } from '@juggle/resize-observer';\nimport cn from 'classnames';\n\nimport { KeyboardFocusable } from '@alfalab/core-components-keyboard-focusable';\nimport { fnUtils } from '@alfalab/core-components-shared';\n\nimport { useTabs } from '../../hooks/use-tabs';\nimport { type PlatformProps, type Styles, type TabListProps } from '../../typings';\nimport { ScrollableContainer } from '../scrollable-container';\nimport { Title } from '../title';\n\nexport const PrimaryTabList = ({\n size,\n styles = {},\n className,\n containerClassName,\n titles = [],\n selectedId = titles.length ? titles[0].id : undefined,\n scrollable = true,\n fullWidthScroll,\n onChange,\n dataTestId,\n platform,\n textStyle,\n inlineStyle,\n showSkeleton,\n skeletonProps,\n}: TabListProps & Styles & PlatformProps) => {\n const lineRef = useRef<HTMLDivElement>(null);\n\n const { selectedTab, focusedTab, getTabListItemProps } = useTabs({\n titles,\n selectedId,\n onChange,\n });\n\n // расчет размера и положения нижней полосы\n useEffect(() => {\n if (selectedTab) {\n const updateLineWidth = () => {\n if (lineRef.current) {\n lineRef.current.style.width = `${selectedTab.offsetWidth}px`;\n lineRef.current.style.transform = `translateX(${selectedTab.offsetLeft}px)`;\n }\n };\n\n const ResizeObserver = window.ResizeObserver || ResizeObserverPolyfill;\n const observer = new ResizeObserver(updateLineWidth);\n\n observer.observe(selectedTab);\n\n return () => observer.disconnect();\n }\n\n return fnUtils.noop;\n }, [selectedTab, titles]);\n\n const handleTitleResize = useCallback(() => {\n if (selectedTab && lineRef.current) {\n lineRef.current.style.width = `${selectedTab.offsetWidth}px`;\n lineRef.current.style.transform = `translateX(${selectedTab.offsetLeft}px)`;\n }\n }, [selectedTab]);\n\n const renderContent = () => (\n <div\n role='tablist'\n data-test-id={dataTestId}\n className={cn(styles.component, className, !textStyle && size && styles[size], {\n [styles.fullWidthScroll]: fullWidthScroll,\n })}\n >\n {titles.map(({ dataTestId: _, toggleRef: __, ...restTitleProps }, index) => (\n <KeyboardFocusable key={restTitleProps.id}>\n {(ref, focused) => (\n <Title\n {...getTabListItemProps(index, ref)}\n {...restTitleProps}\n focused={focused}\n styles={styles}\n showSkeleton={showSkeleton}\n skeletonProps={skeletonProps}\n onResize={handleTitleResize}\n />\n )}\n </KeyboardFocusable>\n ))}\n\n <div className={styles.line} ref={lineRef} />\n </div>\n );\n\n const wrapperClassName = cn(textStyle && styles[textStyle], styles[platform]);\n\n return scrollable ? (\n <ScrollableContainer\n containerWrapperClassName={wrapperClassName}\n activeChild={focusedTab || selectedTab}\n containerClassName={containerClassName}\n scrollControlsClassName={cn(textStyle && styles.scrollControls)}\n fullWidthScroll={fullWidthScroll}\n view='primary'\n size={textStyle ? undefined : size}\n platform={platform}\n inlineStyle={inlineStyle}\n showSkeleton={showSkeleton}\n >\n {renderContent()}\n </ScrollableContainer>\n ) : (\n <div\n className={cn(styles.container, wrapperClassName, containerClassName)}\n style={inlineStyle}\n >\n {renderContent()}\n </div>\n );\n};\n"],"names":["ResizeObserverPolyfill"],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { TabListProps } from '../../typings';
|
|
2
|
+
import { type TabListProps } from '../../typings';
|
|
3
3
|
export declare type PrimaryTabListMobileProps = Omit<TabListProps, 'size' | 'collapsedTabsIds'>;
|
|
4
4
|
export declare const PrimaryTabListMobile: (props: PrimaryTabListMobileProps) => React.JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Component.mobile.js","sources":["../../../src/components/primary-tablist/Component.mobile.tsx"],"sourcesContent":["import React from 'react';\n\nimport { TabListProps } from '../../typings';\n\nimport { PrimaryTabList } from './Component';\n\nimport commonStyles from './index.module.css';\nimport mobileStyles from './mobile.module.css';\n\nconst styles = {\n ...commonStyles,\n ...mobileStyles,\n};\n\nexport type PrimaryTabListMobileProps = Omit<TabListProps, 'size' | 'collapsedTabsIds'>;\n\nexport const PrimaryTabListMobile = (props: PrimaryTabListMobileProps) => (\n <PrimaryTabList {...props} styles={styles} platform='mobile' />\n);\n"],"names":[],"mappings":";;;;;;AASA,IAAM,MAAM,GACL,QAAA,CAAA,QAAA,CAAA,EAAA,EAAA,YAAY,CACZ,EAAA,YAAY,CAClB;AAIY,IAAA,oBAAoB,GAAG,UAAC,KAAgC,EAAK,EAAA,QACtE,KAAA,CAAA,aAAA,CAAC,cAAc,EAAA,QAAA,CAAA,EAAA,EAAK,KAAK,EAAE,EAAA,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAC,QAAQ,EAAG,CAAA,CAAA,EADO;;;;"}
|
|
1
|
+
{"version":3,"file":"Component.mobile.js","sources":["../../../src/components/primary-tablist/Component.mobile.tsx"],"sourcesContent":["import React from 'react';\n\nimport { type TabListProps } from '../../typings';\n\nimport { PrimaryTabList } from './Component';\n\nimport commonStyles from './index.module.css';\nimport mobileStyles from './mobile.module.css';\n\nconst styles = {\n ...commonStyles,\n ...mobileStyles,\n};\n\nexport type PrimaryTabListMobileProps = Omit<TabListProps, 'size' | 'collapsedTabsIds'>;\n\nexport const PrimaryTabListMobile = (props: PrimaryTabListMobileProps) => (\n <PrimaryTabList {...props} styles={styles} platform='mobile' />\n);\n"],"names":[],"mappings":";;;;;;AASA,IAAM,MAAM,GACL,QAAA,CAAA,QAAA,CAAA,EAAA,EAAA,YAAY,CACZ,EAAA,YAAY,CAClB;AAIY,IAAA,oBAAoB,GAAG,UAAC,KAAgC,EAAK,EAAA,QACtE,KAAA,CAAA,aAAA,CAAC,cAAc,EAAA,QAAA,CAAA,EAAA,EAAK,KAAK,EAAE,EAAA,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAC,QAAQ,EAAG,CAAA,CAAA,EADO;;;;"}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { TabListProps } from '../../typings';
|
|
2
|
+
import { type TabListProps } from '../../typings';
|
|
3
3
|
export declare const PrimaryTabListResponsive: ({ size, breakpoint, client, fullWidthScroll, defaultMatchMediaValue, ...restProps }: TabListProps) => React.JSX.Element;
|