@anker-in/headless-ui 0.0.27-alpha.146 → 0.0.27-alpha.147

package/dist/esm/biz-components/ShelfDisplay/tabSwitch.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/biz-components/ShelfDisplay/tabSwitch.tsx"],
+  "sourcesContent": ["'use client'\nimport React, { useRef } from 'react'\nimport { cn } from '../../helpers/utils.js'\n\ninterface TabsProps {\n  tabs: any[]\n  value: string\n  tabShape?: 'rounded' | 'square'\n  onTabClick?: (value: any) => void\n}\n\nconst TabSwitch: React.FC<TabsProps> = ({ tabs, value, onTabClick, tabShape = 'square' }) => {\n  const tabRef = useRef<HTMLDivElement>(null)\n\n  const handleTabClick = (item: any) => {\n    onTabClick?.(item)\n    // \u83B7\u53D6\u5F53\u524D\u9009\u4E2D\u7684 tab \u5E76\u8BA1\u7B97\u4E0B\u5212\u7EBF\u4F4D\u7F6E\n    const tabElement = document.getElementById(`tab-${item?.tab}`)\n    // **\u8BA1\u7B97\u6EDA\u52A8\u4F4D\u7F6E**\n    const container = tabRef.current\n    if (tabElement && container) {\n      const tabLeft = tabElement.offsetLeft // \u9009\u4E2D tab \u7684\u5DE6\u4FA7\u504F\u79FB\u91CF\n      const tabWidth = tabElement.offsetWidth\n      const containerWidth = container.offsetWidth\n      // \u8BA1\u7B97\u76EE\u6807\u6EDA\u52A8\u4F4D\u7F6E\uFF0C\u4F7F tab \u5C45\u4E2D\n      const scrollTo = tabLeft - containerWidth / 2 + tabWidth / 2\n      container.scrollTo({\n        left: scrollTo,\n        behavior: 'smooth',\n      })\n    }\n  }\n\n  return tabs?.length > 0 ? (\n    <div\n      ref={tabRef}\n      className={cn(\n        'tab-switch-wrap bg-tabs-list-bg relative flex w-fit max-w-full overflow-x-auto overflow-y-hidden p-1',\n        tabShape === 'rounded' ? 'rounded-[28px]' : ''\n      )}\n    >\n      {tabs?.map(item => (\n        <button\n          key={item?.id || item?.tab}\n          id={`tab-${item?.tab}`}\n          onClick={() => handleTabClick(item)}\n          className={cn(\n            'text-info-primary px-5 py-2.5 text-sm font-bold',\n            'relative flex-1 shrink-0 whitespace-nowrap transition-all',\n            'lg-desktop:text-base lg-desktop:px-7 lg-desktop:py-3.5',\n            item?.tab === value ? 'bg-btn-primary-disabled-foreground' : '',\n            tabShape === 'rounded' ? 'rounded-[28px]' : ''\n          )}\n        >\n          {item?.tab || ''}\n        </button>\n      ))}\n    </div>\n  ) : null\n}\n\nexport default TabSwitch\n"],
+  "mappings": "aA0CQ,cAAAA,MAAA,oBAzCR,OAAgB,UAAAC,MAAc,QAC9B,OAAS,MAAAC,MAAU,yBASnB,MAAMC,EAAiC,CAAC,CAAE,KAAAC,EAAM,MAAAC,EAAO,WAAAC,EAAY,SAAAC,EAAW,QAAS,IAAM,CAC3F,MAAMC,EAASP,EAAuB,IAAI,EAEpCQ,EAAkBC,GAAc,CACpCJ,IAAaI,CAAI,EAEjB,MAAMC,EAAa,SAAS,eAAe,OAAOD,GAAM,GAAG,EAAE,EAEvDE,EAAYJ,EAAO,QACzB,GAAIG,GAAcC,EAAW,CAC3B,MAAMC,EAAUF,EAAW,WACrBG,EAAWH,EAAW,YACtBI,EAAiBH,EAAU,YAE3BI,EAAWH,EAAUE,EAAiB,EAAID,EAAW,EAC3DF,EAAU,SAAS,CACjB,KAAMI,EACN,SAAU,QACZ,CAAC,CACH,CACF,EAEA,OAAOZ,GAAM,OAAS,EACpBJ,EAAC,OACC,IAAKQ,EACL,UAAWN,EACT,uGACAK,IAAa,UAAY,iBAAmB,EAC9C,EAEC,SAAAH,GAAM,IAAIM,GACTV,EAAC,UAEC,GAAI,OAAOU,GAAM,GAAG,GACpB,QAAS,IAAMD,EAAeC,CAAI,EAClC,UAAWR,EACT,kDACA,4DACA,yDACAQ,GAAM,MAAQL,EAAQ,qCAAuC,GAC7DE,IAAa,UAAY,iBAAmB,EAC9C,EAEC,SAAAG,GAAM,KAAO,IAXTA,GAAM,IAAMA,GAAM,GAYzB,CACD,EACH,EACE,IACN,EAEA,IAAOO,EAAQd",
+  "names": ["jsx", "useRef", "cn", "TabSwitch", "tabs", "value", "onTabClick", "tabShape", "tabRef", "handleTabClick", "item", "tabElement", "container", "tabLeft", "tabWidth", "containerWidth", "scrollTo", "tabSwitch_default"]
+}

package/dist/tokens/base.css

@@ -161,4 +161,10 @@
 
 .swiper-pagination-bullet-active {
   background-color: #000000!important;
+}
+
+.tab-switch-wrap {
+  &::-webkit-scrollbar {
+    display: none;
+  }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@anker-in/headless-ui",
-  "version": "0.0.27-alpha.146",
+  "version": "0.0.27-alpha.147",
   "type": "commonjs",
   "main": "./dist/cjs/index.js",
   "types": "./dist/cjs/index.d.ts",