@tramo-digital/react-ui 0.0.0-alpha → 0.0.2

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.
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tramo-digital/react-ui",
3
- "version": "0.0.0-alpha",
3
+ "version": "0.0.2",
4
4
  "description": "tramo.digital - react-ui",
5
5
  "type": "module",
6
6
  "author": "carlosp0veda",
@@ -1 +1 @@
1
- {"version":3,"file":"Hero.cjs","sources":["../../../../../src/ui/compositions/Hero/Hero.tsx"],"sourcesContent":["import type { HeroModel, IconData } from '@tramo-digital/types';\nimport Frame from '../../primitives/Frame/Frame';\nimport InterfaceIcon from '../../primitives/InterfaceIcon/InterfaceIcon';\nimport Overlay from '../../primitives/Overlay/Overlay';\nimport Video from '../../primitives/Video/Video';\nimport Content from '../../patterns/Content/Content';\nimport styles from './Hero.module.css';\nimport Image from '../../primitives/Image';\n\nexport interface HeroProps extends HeroModel {\n children?: React.ReactNode;\n}\n\nconst Hero: React.FC<HeroProps> = ({\n className,\n data,\n tokens,\n events,\n colorPalette,\n colorSource,\n customColor,\n}) => {\n if (!data) return null;\n const _fingerprint = '4362ae16c10259c414d558586b9fda40';\n\n const tokenStyles = {\n ...(tokens?.dimension?.minHeight && {\n '--hero-min-height': tokens.dimension.minHeight.default,\n }),\n ...(tokens?.color?.background && {\n '--hero-background': tokens.color.background.default,\n }),\n ...(tokens?.color?.overlay && {\n '--hero-overlay-color': tokens.color.overlay.default,\n }),\n ...(tokens?.spacing?.padding && {\n '--hero-padding': tokens.spacing.padding.default,\n }),\n ...(tokens?.border?.borderRadius && {\n '--hero-border-radius': tokens.border.borderRadius.default,\n }),\n ...(tokens?.effect?.opacity && {\n '--hero-overlay-opacity': tokens.effect.opacity.default,\n }),\n ...(tokens?.layout?.mediaPosition && {\n '--hero-media-position': tokens.layout.mediaPosition.default,\n }),\n };\n\n /**\n * Renders the appropriate media element based on backgroundType\n */\n const renderMedia = (mediaData: typeof media) => {\n if (mediaData.backgroundType === 'video') {\n return (\n <Video\n data={{\n src: mediaData.src,\n poster: mediaData.backgroundVideoPoster,\n alt: mediaData.alt,\n type: mediaData.backgroundVideoType,\n autoPlay: true,\n loop: true,\n muted: true,\n playsInline: true,\n }}\n className={styles.backgroundVideo}\n />\n );\n }\n\n if (mediaData.src) {\n return (\n <div className={styles.imageWrapper}>\n <Image\n data={{\n src: mediaData.src,\n alt: mediaData.alt,\n loading: 'eager',\n objectFit: 'cover',\n fluid: true,\n }}\n tokens={{\n border: {\n borderRadius: {\n default: '0px',\n },\n },\n }}\n />\n </div>\n );\n }\n\n return null;\n };\n\n const {\n content,\n media = {\n src: undefined,\n alt: undefined,\n backgroundType: 'image',\n backgroundVideoSrc: undefined,\n backgroundVideoPoster: undefined,\n backgroundVideoType: 'video/mp4',\n },\n align = 'center',\n justify = 'center',\n overlay,\n } = data || {};\n\n const hasMedia = media.backgroundType === 'video' ? media.src : media.src;\n const heroClassName = [\n styles.tuiHero,\n content?.contentAlignment ? `${content.contentAlignment}` : '',\n align ? styles[`align-${align}`] : '',\n justify ? styles[`justify-${justify}`] : '',\n !hasMedia ? styles.heroNoImage : '',\n className ?? '',\n ]\n .filter(Boolean)\n .join(' ');\n\n return (\n <Frame\n data-tui-composition=\"base\"\n data={{ as: 'div' }}\n colorPalette={colorPalette}\n colorSource={colorSource}\n customColor={customColor}\n className={heroClassName}\n style={tokenStyles as React.CSSProperties}\n >\n {/* Media container (image or video) */}\n {hasMedia && (\n <div className={styles.mediaContainer}>\n {/* Overlay */}\n <Overlay data={{ ...overlay, isOpen: true }} />\n {renderMedia(media)}\n </div>\n )}\n {/* Main content */}\n <div className={styles.heroContent}>\n <Content\n data={{ ...content }}\n events={events}\n className={styles.leftContentPanel}\n />\n {content?.icons && content.icons.length > 0 && (\n <div className={styles.rightContentPanel}>\n <div className={styles.interactiveIconsContainer}>\n <div className={styles.objectIconsWrapper}>\n {content.icons.map((icon: IconData) => (\n <InterfaceIcon key={icon.type} data={icon} />\n ))}\n </div>\n </div>\n </div>\n )}\n </div>\n </Frame>\n );\n};\n\nexport default Hero;\n"],"names":["Hero","className","data","tokens","events","colorPalette","colorSource","customColor","tokenStyles","renderMedia","mediaData","jsx","Video","styles","Image","content","media","align","justify","overlay","hasMedia","heroClassName","jsxs","Frame","Overlay","Content","icon","InterfaceIcon"],"mappings":"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"}
1
+ {"version":3,"file":"Hero.cjs","sources":["../../../../../src/ui/compositions/Hero/Hero.tsx"],"sourcesContent":["import type { HeroModel, IconData } from '@tramo-digital/types';\nimport Frame from '../../primitives/Frame/Frame';\nimport InterfaceIcon from '../../primitives/InterfaceIcon/InterfaceIcon';\nimport Overlay from '../../primitives/Overlay/Overlay';\nimport Video from '../../primitives/Video/Video';\nimport Content from '../../patterns/Content/Content';\nimport styles from './Hero.module.css';\nimport Image from '../../primitives/Image';\n\nexport interface HeroProps extends HeroModel {\n children?: React.ReactNode;\n}\n\nconst Hero: React.FC<HeroProps> = ({\n className,\n data,\n tokens,\n events,\n colorPalette,\n colorSource,\n customColor,\n}) => {\n if (!data) return null;\n const _fingerprint = 'bcaa16267faa143fd94db35437089ce8';\n\n const tokenStyles = {\n ...(tokens?.dimension?.minHeight && {\n '--hero-min-height': tokens.dimension.minHeight.default,\n }),\n ...(tokens?.color?.background && {\n '--hero-background': tokens.color.background.default,\n }),\n ...(tokens?.color?.overlay && {\n '--hero-overlay-color': tokens.color.overlay.default,\n }),\n ...(tokens?.spacing?.padding && {\n '--hero-padding': tokens.spacing.padding.default,\n }),\n ...(tokens?.border?.borderRadius && {\n '--hero-border-radius': tokens.border.borderRadius.default,\n }),\n ...(tokens?.effect?.opacity && {\n '--hero-overlay-opacity': tokens.effect.opacity.default,\n }),\n ...(tokens?.layout?.mediaPosition && {\n '--hero-media-position': tokens.layout.mediaPosition.default,\n }),\n };\n\n /**\n * Renders the appropriate media element based on backgroundType\n */\n const renderMedia = (mediaData: typeof media) => {\n if (mediaData.backgroundType === 'video') {\n return (\n <Video\n data={{\n src: mediaData.src,\n poster: mediaData.backgroundVideoPoster,\n alt: mediaData.alt,\n type: mediaData.backgroundVideoType,\n autoPlay: true,\n loop: true,\n muted: true,\n playsInline: true,\n }}\n className={styles.backgroundVideo}\n />\n );\n }\n\n if (mediaData.src) {\n return (\n <div className={styles.imageWrapper}>\n <Image\n data={{\n src: mediaData.src,\n alt: mediaData.alt,\n loading: 'eager',\n objectFit: 'cover',\n fluid: true,\n }}\n tokens={{\n border: {\n borderRadius: {\n default: '0px',\n },\n },\n }}\n />\n </div>\n );\n }\n\n return null;\n };\n\n const {\n content,\n media = {\n src: undefined,\n alt: undefined,\n backgroundType: 'image',\n backgroundVideoSrc: undefined,\n backgroundVideoPoster: undefined,\n backgroundVideoType: 'video/mp4',\n },\n align = 'center',\n justify = 'center',\n overlay,\n } = data || {};\n\n const hasMedia = media.backgroundType === 'video' ? media.src : media.src;\n const heroClassName = [\n styles.tuiHero,\n content?.contentAlignment ? `${content.contentAlignment}` : '',\n align ? styles[`align-${align}`] : '',\n justify ? styles[`justify-${justify}`] : '',\n !hasMedia ? styles.heroNoImage : '',\n className ?? '',\n ]\n .filter(Boolean)\n .join(' ');\n\n return (\n <Frame\n data-tui-composition=\"base\"\n data={{ as: 'div' }}\n colorPalette={colorPalette}\n colorSource={colorSource}\n customColor={customColor}\n className={heroClassName}\n style={tokenStyles as React.CSSProperties}\n >\n {/* Media container (image or video) */}\n {hasMedia && (\n <div className={styles.mediaContainer}>\n {/* Overlay */}\n <Overlay data={{ ...overlay, isOpen: true }} />\n {renderMedia(media)}\n </div>\n )}\n {/* Main content */}\n <div className={styles.heroContent}>\n <Content\n data={{ ...content }}\n events={events}\n className={styles.leftContentPanel}\n />\n {content?.icons && content.icons.length > 0 && (\n <div className={styles.rightContentPanel}>\n <div className={styles.interactiveIconsContainer}>\n <div className={styles.objectIconsWrapper}>\n {content.icons.map((icon: IconData) => (\n <InterfaceIcon key={icon.type} data={icon} />\n ))}\n </div>\n </div>\n </div>\n )}\n </div>\n </Frame>\n );\n};\n\nexport default Hero;\n"],"names":["Hero","className","data","tokens","events","colorPalette","colorSource","customColor","tokenStyles","renderMedia","mediaData","jsx","Video","styles","Image","content","media","align","justify","overlay","hasMedia","heroClassName","jsxs","Frame","Overlay","Content","icon","InterfaceIcon"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- "use strict";const i=require("react/jsx-runtime"),h=require("react"),y=require("../../primitives/Frame/Frame.cjs"),n=require("./Tabs.module.css.cjs"),N=r=>{if(r.render){if(typeof r.render=="function"){const s=r.render;return i.jsx(s,{})}return r.render}return null},C=({data:r,events:s,tokens:a,className:f,colorPalette:p,colorSource:g,customColor:v})=>{if(!r)return null;const c=r.tabs||r.items||[],{defaultActiveId:o,variant:m="underline"}=r,[u,x]=h.useState(()=>{if(o&&c.some((l,t)=>(l.key||l.id||String(t))===o))return o;const e=c[0];return e?e.key||e.id||"0":""}),T=(e,l)=>{if(e.disabled)return;const t=e.key||e.id||String(l);x(t),s?.onTabChange?.(t,l)},j={...a?.color?.background&&{"--tabs-bg":a.color.background.default},...a?.color?.tabBar&&{"--tabs-bar":a.color.tabBar.default},...a?.color?.activeTab&&{"--tabs-active-tab":a.color.activeTab.default},...a?.color?.activeIndicator&&{"--tabs-indicator":a.color.activeIndicator.default},...a?.color?.tabText&&{"--tabs-text":a.color.tabText.default},...a?.color?.activeTabText&&{"--tabs-text-active":a.color.activeTabText.default},...a?.color?.panelBackground&&{"--tabs-panel-bg":a.color.panelBackground.default},...a?.spacing?.gap&&{"--tabs-gap":a.spacing.gap.default},...a?.spacing?.tabPadding&&{"--tabs-padding":a.spacing.tabPadding.default},...a?.spacing?.panelPadding&&{"--tabs-panel-padding":a.spacing.panelPadding.default}};return i.jsxs(y,{"data-tui-composition":"base",data:{as:"div"},colorPalette:p,colorSource:g,customColor:v,className:[n.default.tabsContainer,n.default[`variant-${m}`],f??""].filter(Boolean).join(" "),style:j,children:[i.jsx("div",{className:n.default.tabListWrapper,children:i.jsx("div",{className:n.default.tabList,role:"tablist",children:c.map((e,l)=>{const t=e.key||e.id||String(l),d=t===u;return i.jsxs("button",{role:"tab",type:"button",id:`tab-${t}`,"aria-selected":d,"aria-controls":`panel-${t}`,disabled:e.disabled,className:[n.default.tabButton,d?n.default.active:"",e.disabled?n.default.disabled:""].filter(Boolean).join(" "),onClick:()=>T(e,l),children:[e.icon&&i.jsx("span",{className:n.default.icon,"aria-hidden":"true",children:e.icon}),i.jsx("span",{className:n.default.label,children:e.label})]},t)})})}),i.jsx("div",{className:n.default.panelsContainer,children:c.map((e,l)=>{const t=e.key||e.id||String(l),d=t===u,b=N(e);return!d&&!b?null:i.jsx("div",{id:`panel-${t}`,role:"tabpanel","aria-labelledby":`tab-${t}`,hidden:!d,className:[n.default.tabPanel,d?n.default.panelActive:""].join(" "),children:d&&i.jsx("div",{className:n.default.panelContent,children:b})},t)})})]})};module.exports=C;
1
+ "use strict";const l=require("react/jsx-runtime"),h=require("react"),y=require("../../primitives/Frame/Frame.cjs"),i=require("./Tabs.module.css.cjs"),N=r=>{if(r.render){if(typeof r.render=="function"){const s=r.render;return l.jsx(s,{})}return r.render}return null},C=({data:r,events:s,tokens:a,className:p,colorPalette:f,colorSource:g,customColor:v})=>{if(!r)return null;const c=r.tabs||r.items||[],{defaultActiveId:o,variant:m="underline"}=r,[u,x]=h.useState(()=>{if(o&&c.some((n,t)=>(n.key||n.id||String(t))===o))return o;const e=c[0];return e?e.key||e.id||"0":""}),T=(e,n)=>{if(e.disabled)return;const t=e.key||e.id||String(n);x(t),s?.onTabChange?.(t,n)},j={...a?.color?.background&&{"--tabs-bg":a.color.background.default},...a?.color?.tabBar&&{"--tabs-bar":a.color.tabBar.default},...a?.color?.activeTab&&{"--tabs-active-tab":a.color.activeTab.default},...a?.color?.activeIndicator&&{"--tabs-indicator":a.color.activeIndicator.default},...a?.color?.tabText&&{"--tabs-text":a.color.tabText.default},...a?.color?.activeTabText&&{"--tabs-text-active":a.color.activeTabText.default},...a?.color?.panelBackground&&{"--tabs-panel-bg":a.color.panelBackground.default},...a?.spacing?.gap&&{"--tabs-gap":a.spacing.gap.default},...a?.spacing?.tabPadding&&{"--tabs-padding":a.spacing.tabPadding.default},...a?.spacing?.panelPadding&&{"--tabs-panel-padding":a.spacing.panelPadding.default}};return l.jsxs(y,{"data-tui-composition":"base",data:{as:"div"},colorPalette:f,colorSource:g,customColor:v,className:[i.default.tabsContainer,i.default[`variant-${m}`],p??""].filter(Boolean).join(" "),style:j,children:[l.jsx("div",{className:i.default.tabListWrapper,children:l.jsx("div",{className:i.default.tabList,role:"tablist",children:c.map((e,n)=>{const t=e.key||e.id||String(n),d=t===u;return l.jsxs("button",{"data-tui-primitive":"base","data-tui-dynamic-states":"default","data-tui-appearance-buttons":"primary",role:"tab",type:"button",id:`tab-${t}`,"aria-selected":d,"aria-controls":`panel-${t}`,disabled:e.disabled,className:[i.default.tabButton,d?i.default.active:"",e.disabled?i.default.disabled:""].filter(Boolean).join(" "),onClick:()=>T(e,n),children:[e.icon&&l.jsx("span",{className:i.default.icon,"aria-hidden":"true",children:e.icon}),l.jsx("span",{className:i.default.label,children:e.label})]},t)})})}),l.jsx("div",{className:i.default.panelsContainer,children:c.map((e,n)=>{const t=e.key||e.id||String(n),d=t===u,b=N(e);return!d&&!b?null:l.jsx("div",{id:`panel-${t}`,role:"tabpanel","aria-labelledby":`tab-${t}`,hidden:!d,className:[i.default.tabPanel,d?i.default.panelActive:""].join(" "),children:d&&l.jsx("div",{className:i.default.panelContent,children:b})},t)})})]})};module.exports=C;
2
2
  //# sourceMappingURL=Tabs.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"Tabs.cjs","sources":["../../../../../src/ui/compositions/Tabs/Tabs.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport type { TabsModel, TabItemData } from \"@tramo-digital/types\";\nimport Frame from \"../../primitives/Frame/Frame\";\nimport styles from \"./Tabs.module.css\";\n\nexport interface TabsProps {\n id?: TabsModel[\"id\"];\n data: TabsModel[\"data\"];\n events?: TabsModel[\"events\"];\n tokens?: TabsModel[\"tokens\"];\n className?: TabsModel[\"className\"];\n colorPalette?: TabsModel[\"colorPalette\"];\n colorSource?: TabsModel[\"colorSource\"];\n customColor?: TabsModel[\"customColor\"];\n}\n\nconst renderTabPanelContent = (tab: TabItemData) => {\n if (tab.render) {\n if (typeof tab.render === \"function\") {\n const RenderFunc = tab.render as React.ElementType;\n return <RenderFunc />;\n }\n return tab.render as React.ReactNode;\n }\n return null;\n};\n\nconst Tabs: React.FC<TabsProps> = ({\n data,\n events,\n tokens,\n className,\n colorPalette,\n colorSource,\n customColor,\n}) => {\n if (!data) return null;\n const _fingerprint = \"a611a92ed820032fd958f7c66cc45542\";\n\n const tabList = data.tabs || data.items || [];\n const { defaultActiveId, variant = \"underline\" } = data;\n\n const [activeTabId, setActiveTabId] = useState<string>(() => {\n if (\n defaultActiveId &&\n tabList.some(\n (t: TabItemData, idx: number) =>\n (t.key || t.id || String(idx)) === defaultActiveId,\n )\n ) {\n return defaultActiveId;\n }\n const firstTab = tabList[0];\n return firstTab ? firstTab.key || firstTab.id || \"0\" : \"\";\n });\n\n const handleTabClick = (tab: TabItemData, idx: number) => {\n if (tab.disabled) return;\n const tabId = tab.key || tab.id || String(idx);\n setActiveTabId(tabId);\n events?.onTabChange?.(tabId, idx);\n };\n\n const tokenStyles = {\n ...(tokens?.color?.background && {\n \"--tabs-bg\": tokens.color.background.default,\n }),\n ...(tokens?.color?.tabBar && { \"--tabs-bar\": tokens.color.tabBar.default }),\n ...(tokens?.color?.activeTab && {\n \"--tabs-active-tab\": tokens.color.activeTab.default,\n }),\n ...(tokens?.color?.activeIndicator && {\n \"--tabs-indicator\": tokens.color.activeIndicator.default,\n }),\n ...(tokens?.color?.tabText && {\n \"--tabs-text\": tokens.color.tabText.default,\n }),\n ...(tokens?.color?.activeTabText && {\n \"--tabs-text-active\": tokens.color.activeTabText.default,\n }),\n ...(tokens?.color?.panelBackground && {\n \"--tabs-panel-bg\": tokens.color.panelBackground.default,\n }),\n ...(tokens?.spacing?.gap && { \"--tabs-gap\": tokens.spacing.gap.default }),\n ...(tokens?.spacing?.tabPadding && {\n \"--tabs-padding\": tokens.spacing.tabPadding.default,\n }),\n ...(tokens?.spacing?.panelPadding && {\n \"--tabs-panel-padding\": tokens.spacing.panelPadding.default,\n }),\n };\n\n return (\n <Frame\n data-tui-composition=\"base\"\n data={{ as: \"div\" }}\n colorPalette={colorPalette}\n colorSource={colorSource}\n customColor={customColor}\n className={[\n styles.tabsContainer,\n styles[`variant-${variant}`],\n className ?? \"\",\n ]\n .filter(Boolean)\n .join(\" \")}\n style={tokenStyles as React.CSSProperties}\n >\n <div className={styles.tabListWrapper}>\n <div className={styles.tabList} role=\"tablist\">\n {tabList.map((tab: TabItemData, idx: number) => {\n const tabId = tab.key || tab.id || String(idx);\n const isActive = tabId === activeTabId;\n return (\n <button\n key={tabId}\n role=\"tab\"\n type=\"button\"\n id={`tab-${tabId}`}\n aria-selected={isActive}\n aria-controls={`panel-${tabId}`}\n disabled={tab.disabled}\n className={[\n styles.tabButton,\n isActive ? styles.active : \"\",\n tab.disabled ? styles.disabled : \"\",\n ]\n .filter(Boolean)\n .join(\" \")}\n onClick={() => handleTabClick(tab, idx)}\n >\n {tab.icon && (\n <span className={styles.icon} aria-hidden=\"true\">\n {tab.icon}\n </span>\n )}\n <span className={styles.label}>{tab.label}</span>\n </button>\n );\n })}\n </div>\n </div>\n\n <div className={styles.panelsContainer}>\n {tabList.map((tab: TabItemData, idx: number) => {\n const tabId = tab.key || tab.id || String(idx);\n const isActive = tabId === activeTabId;\n const panelContentNode = renderTabPanelContent(tab);\n if (!isActive && !panelContentNode) return null;\n\n return (\n <div\n key={tabId}\n id={`panel-${tabId}`}\n role=\"tabpanel\"\n aria-labelledby={`tab-${tabId}`}\n hidden={!isActive}\n className={[\n styles.tabPanel,\n isActive ? styles.panelActive : \"\",\n ].join(\" \")}\n >\n {isActive && (\n <div className={styles.panelContent}>{panelContentNode}</div>\n )}\n </div>\n );\n })}\n </div>\n </Frame>\n );\n};\n\nexport default Tabs;\n"],"names":["renderTabPanelContent","tab","RenderFunc","Tabs","data","events","tokens","className","colorPalette","colorSource","customColor","tabList","defaultActiveId","variant","activeTabId","setActiveTabId","useState","t","idx","firstTab","handleTabClick","tabId","tokenStyles","jsxs","Frame","styles","jsx","isActive","panelContentNode"],"mappings":"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"}
1
+ {"version":3,"file":"Tabs.cjs","sources":["../../../../../src/ui/compositions/Tabs/Tabs.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport type { TabsModel, TabItemData } from \"@tramo-digital/types\";\nimport Frame from \"../../primitives/Frame/Frame\";\nimport styles from \"./Tabs.module.css\";\n\nexport interface TabsProps {\n id?: TabsModel[\"id\"];\n data: TabsModel[\"data\"];\n events?: TabsModel[\"events\"];\n tokens?: TabsModel[\"tokens\"];\n className?: TabsModel[\"className\"];\n colorPalette?: TabsModel[\"colorPalette\"];\n colorSource?: TabsModel[\"colorSource\"];\n customColor?: TabsModel[\"customColor\"];\n}\n\nconst renderTabPanelContent = (tab: TabItemData) => {\n if (tab.render) {\n if (typeof tab.render === \"function\") {\n const RenderFunc = tab.render as React.ElementType;\n return <RenderFunc />;\n }\n return tab.render as React.ReactNode;\n }\n return null;\n};\n\nconst Tabs: React.FC<TabsProps> = ({\n data,\n events,\n tokens,\n className,\n colorPalette,\n colorSource,\n customColor,\n}) => {\n if (!data) return null;\n const _fingerprint = \"7d8ccd3c8de40a13ec15b1fa0d8db35b\";\n\n const tabList = data.tabs || data.items || [];\n const { defaultActiveId, variant = \"underline\" } = data;\n\n const [activeTabId, setActiveTabId] = useState<string>(() => {\n if (\n defaultActiveId &&\n tabList.some(\n (t: TabItemData, idx: number) =>\n (t.key || t.id || String(idx)) === defaultActiveId,\n )\n ) {\n return defaultActiveId;\n }\n const firstTab = tabList[0];\n return firstTab ? firstTab.key || firstTab.id || \"0\" : \"\";\n });\n\n const handleTabClick = (tab: TabItemData, idx: number) => {\n if (tab.disabled) return;\n const tabId = tab.key || tab.id || String(idx);\n setActiveTabId(tabId);\n events?.onTabChange?.(tabId, idx);\n };\n\n const tokenStyles = {\n ...(tokens?.color?.background && {\n \"--tabs-bg\": tokens.color.background.default,\n }),\n ...(tokens?.color?.tabBar && { \"--tabs-bar\": tokens.color.tabBar.default }),\n ...(tokens?.color?.activeTab && {\n \"--tabs-active-tab\": tokens.color.activeTab.default,\n }),\n ...(tokens?.color?.activeIndicator && {\n \"--tabs-indicator\": tokens.color.activeIndicator.default,\n }),\n ...(tokens?.color?.tabText && {\n \"--tabs-text\": tokens.color.tabText.default,\n }),\n ...(tokens?.color?.activeTabText && {\n \"--tabs-text-active\": tokens.color.activeTabText.default,\n }),\n ...(tokens?.color?.panelBackground && {\n \"--tabs-panel-bg\": tokens.color.panelBackground.default,\n }),\n ...(tokens?.spacing?.gap && { \"--tabs-gap\": tokens.spacing.gap.default }),\n ...(tokens?.spacing?.tabPadding && {\n \"--tabs-padding\": tokens.spacing.tabPadding.default,\n }),\n ...(tokens?.spacing?.panelPadding && {\n \"--tabs-panel-padding\": tokens.spacing.panelPadding.default,\n }),\n };\n\n return (\n <Frame\n data-tui-composition=\"base\"\n data={{ as: \"div\" }}\n colorPalette={colorPalette}\n colorSource={colorSource}\n customColor={customColor}\n className={[\n styles.tabsContainer,\n styles[`variant-${variant}`],\n className ?? \"\",\n ]\n .filter(Boolean)\n .join(\" \")}\n style={tokenStyles as React.CSSProperties}\n >\n <div className={styles.tabListWrapper}>\n <div className={styles.tabList} role=\"tablist\">\n {tabList.map((tab: TabItemData, idx: number) => {\n const tabId = tab.key || tab.id || String(idx);\n const isActive = tabId === activeTabId;\n return (\n <button\n data-tui-primitive=\"base\"\n data-tui-dynamic-states=\"default\"\n data-tui-appearance-buttons=\"primary\"\n key={tabId}\n role=\"tab\"\n type=\"button\"\n id={`tab-${tabId}`}\n aria-selected={isActive}\n aria-controls={`panel-${tabId}`}\n disabled={tab.disabled}\n className={[\n styles.tabButton,\n isActive ? styles.active : \"\",\n tab.disabled ? styles.disabled : \"\",\n ]\n .filter(Boolean)\n .join(\" \")}\n onClick={() => handleTabClick(tab, idx)}\n >\n {tab.icon && (\n <span className={styles.icon} aria-hidden=\"true\">\n {tab.icon}\n </span>\n )}\n <span className={styles.label}>{tab.label}</span>\n </button>\n );\n })}\n </div>\n </div>\n\n <div className={styles.panelsContainer}>\n {tabList.map((tab: TabItemData, idx: number) => {\n const tabId = tab.key || tab.id || String(idx);\n const isActive = tabId === activeTabId;\n const panelContentNode = renderTabPanelContent(tab);\n if (!isActive && !panelContentNode) return null;\n\n return (\n <div\n key={tabId}\n id={`panel-${tabId}`}\n role=\"tabpanel\"\n aria-labelledby={`tab-${tabId}`}\n hidden={!isActive}\n className={[\n styles.tabPanel,\n isActive ? styles.panelActive : \"\",\n ].join(\" \")}\n >\n {isActive && (\n <div className={styles.panelContent}>{panelContentNode}</div>\n )}\n </div>\n );\n })}\n </div>\n </Frame>\n );\n};\n\nexport default Tabs;\n"],"names":["renderTabPanelContent","tab","RenderFunc","Tabs","data","events","tokens","className","colorPalette","colorSource","customColor","tabList","defaultActiveId","variant","activeTabId","setActiveTabId","useState","t","idx","firstTab","handleTabClick","tabId","tokenStyles","jsxs","Frame","styles","jsx","isActive","panelContentNode"],"mappings":"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"}