@anker-in/headless-ui 1.3.8 → 1.3.9

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.
Files changed (14) hide show
  1. package/dist/cjs/biz-components/AnchorNavigation/index.js +1 -1
  2. package/dist/cjs/biz-components/AnchorNavigation/index.js.map +2 -2
  3. package/dist/cjs/components/Countdown.js +1 -1
  4. package/dist/cjs/components/Countdown.js.map +3 -3
  5. package/dist/cjs/components/tabs.js +1 -1
  6. package/dist/cjs/components/tabs.js.map +3 -3
  7. package/dist/esm/biz-components/AnchorNavigation/index.js +1 -1
  8. package/dist/esm/biz-components/AnchorNavigation/index.js.map +2 -2
  9. package/dist/esm/components/Countdown.js +1 -1
  10. package/dist/esm/components/Countdown.js.map +3 -3
  11. package/dist/esm/components/tabs.js +1 -1
  12. package/dist/esm/components/tabs.js.map +3 -3
  13. package/package.json +1 -1
  14. package/style.css +4 -0
package/dist/cjs/biz-components/AnchorNavigation/index.js CHANGED
@@ -1,2 +1,2 @@
1
- "use strict";"use client";var B=Object.create;var d=Object.defineProperty;var V=Object.getOwnPropertyDescriptor;var z=Object.getOwnPropertyNames;var M=Object.getPrototypeOf,P=Object.prototype.hasOwnProperty;var q=(t,e)=>{for(var r in e)d(t,r,{get:e[r],enumerable:!0})},R=(t,e,r,c)=>{if(e&&typeof e=="object"||typeof e=="function")for(let l of z(e))!P.call(t,l)&&l!==r&&d(t,l,{get:()=>e[l],enumerable:!(c=V(e,l))||c.enumerable});return t};var x=(t,e,r)=>(r=t!=null?B(M(t)):{},R(e||!t||!t.__esModule?d(r,"default",{value:t,enumerable:!0}):r,t)),F=t=>R(d({},"__esModule",{value:!0}),t);var Y={};q(Y,{default:()=>K});module.exports=F(Y);var g=require("react/jsx-runtime"),i=x(require("react")),m=require("../../helpers/utils.js"),v=require("class-variance-authority"),w=x(require("./useAnchorPosition.js")),L=require("../../components/container.js"),S=require("../../shared/Styles.js");const j=(0,v.cva)("anchor-navigation-content flex items-center overflow-x-auto [&::-webkit-scrollbar]:hidden",{variants:{alignment:{start:"tablet:justify-start",center:"tablet:justify-center",end:"tablet:justify-end"},size:{small:"gap-3",large:"gap-6"}},defaultVariants:{alignment:"start",size:"small"}}),U=(0,v.cva)("anchor-navigation-item relative shrink-0 text-sm font-bold after:absolute after:bottom-0 after:left-0 after:h-1 after:w-0 after:opacity-0 after:transition-all after:duration-300",{variants:{size:{small:"py-3",large:"py-4"}},defaultVariants:{size:"small"}}),W=(0,v.cva)("!sticky top-0 !z-40 w-full",{variants:{theme:{light:"bg-white",dark:"bg-[#1E2024]"}},defaultVariants:{theme:"light"}}),_={defaultColor:"text-[#4A4C56]",activeColor:"text-[#080A0F]",activeIndicatorColor:"after:bg-brand-0"},G={defaultColor:"text-[#8A8D92]",activeColor:"text-white",activeIndicatorColor:"after:bg-brand-0"},T=i.forwardRef(({classNames:t={},data:e,onItemClick:r,buttonStyle:c,className:l,...D},E)=>{const{alignment:H="start",theme:b="light",size:y="small"}=e,f=(0,w.default)(e.sectionIds?.map(o=>o.targetId)||[]),u=i.useRef(null),h=i.useRef(null),N=i.useRef([]);i.useImperativeHandle(E,()=>u.current);const p=b==="dark"?G:_,I={defaultColor:c?.defaultColor??p.defaultColor,activeColor:c?.activeColor??p.activeColor,activeIndicatorColor:c?.activeIndicatorColor??p.activeIndicatorColor},C=i.useCallback(o=>{const n=N.current[o];if(n&&h.current){const s=h.current,a=n,A=a.offsetLeft-s.offsetWidth/2+a.offsetWidth/2;typeof s.scrollTo=="function"&&s.scrollTo({left:A,behavior:"smooth"})}},[]);return i.useEffect(()=>{if(!f)return;const o=e.sectionIds?.findIndex(n=>n.targetId===f);o!==void 0&&o!==-1&&C(o)},[f,e.sectionIds,C]),(0,g.jsx)(L.Container,{ref:u,className:(0,m.cn)(W({theme:b}),t?.root),...D,children:(0,g.jsx)("div",{ref:h,className:(0,m.cn)(j({alignment:H,size:y}),"relative",t?.content),children:e.sectionIds?.map((o,n)=>{const s=f===o.targetId;return(0,g.jsx)("button",{ref:a=>{a&&(N.current[n]=a)},"aria-current":s?!0:void 0,onClick:()=>{if(C(n),r){r(o,n);return}const a=document.getElementById(o.targetId);if(a&&u.current){const A=u.current.offsetHeight,k=a.getBoundingClientRect().top+window.scrollY-A;window.scrollTo({top:k,behavior:"smooth"})}},className:(0,m.cn)(U({size:y}),s?[I.activeColor,I.activeIndicatorColor,"after:w-full after:opacity-100"]:I.defaultColor,t?.item),children:o.label},o.targetId)})})})});T.displayName="AnchorNavigation";var K=(0,S.withLayout)(T);
1
+ "use strict";"use client";var B=Object.create;var d=Object.defineProperty;var V=Object.getOwnPropertyDescriptor;var z=Object.getOwnPropertyNames;var M=Object.getPrototypeOf,P=Object.prototype.hasOwnProperty;var q=(t,e)=>{for(var r in e)d(t,r,{get:e[r],enumerable:!0})},N=(t,e,r,l)=>{if(e&&typeof e=="object"||typeof e=="function")for(let i of z(e))!P.call(t,i)&&i!==r&&d(t,i,{get:()=>e[i],enumerable:!(l=V(e,i))||l.enumerable});return t};var x=(t,e,r)=>(r=t!=null?B(M(t)):{},N(e||!t||!t.__esModule?d(r,"default",{value:t,enumerable:!0}):r,t)),F=t=>N(d({},"__esModule",{value:!0}),t);var Y={};q(Y,{default:()=>K});module.exports=F(Y);var g=require("react/jsx-runtime"),c=x(require("react")),m=require("../../helpers/utils.js"),v=require("class-variance-authority"),w=x(require("./useAnchorPosition.js")),L=require("../../components/container.js"),S=require("../../shared/Styles.js");const j=(0,v.cva)("anchor-navigation-content flex items-center overflow-x-auto [&::-webkit-scrollbar]:hidden",{variants:{alignment:{start:"tablet:justify-start",center:"tablet:justify-center",end:"tablet:justify-end"},size:{small:"gap-3",large:"gap-6"}},defaultVariants:{alignment:"start",size:"small"}}),U=(0,v.cva)("anchor-navigation-item relative shrink-0 text-sm font-bold after:absolute after:bottom-0 after:left-0 after:h-1 after:w-0 after:opacity-0 after:transition-all after:duration-300",{variants:{size:{small:"py-3",large:"py-4"}},defaultVariants:{size:"small"}}),W=(0,v.cva)("!sticky top-0 !z-40 w-full",{variants:{theme:{light:"!bg-white",dark:"!bg-[#1E2024]"}},defaultVariants:{theme:"light"}}),_={defaultColor:"text-[#4A4C56]",activeColor:"text-[#080A0F]",activeIndicatorColor:"after:bg-brand-0"},G={defaultColor:"text-[#8A8D92]",activeColor:"text-white",activeIndicatorColor:"after:bg-brand-0"},T=c.forwardRef(({classNames:t={},data:e,onItemClick:r,buttonStyle:l,className:i,...D},E)=>{const{alignment:H="start",theme:b="light",size:y="small"}=e,f=(0,w.default)(e.sectionIds?.map(o=>o.targetId)||[]),u=c.useRef(null),h=c.useRef(null),R=c.useRef([]);c.useImperativeHandle(E,()=>u.current);const p=b==="dark"?G:_,I={defaultColor:l?.defaultColor??p.defaultColor,activeColor:l?.activeColor??p.activeColor,activeIndicatorColor:l?.activeIndicatorColor??p.activeIndicatorColor},C=c.useCallback(o=>{const n=R.current[o];if(n&&h.current){const s=h.current,a=n,A=a.offsetLeft-s.offsetWidth/2+a.offsetWidth/2;typeof s.scrollTo=="function"&&s.scrollTo({left:A,behavior:"smooth"})}},[]);return c.useEffect(()=>{if(!f)return;const o=e.sectionIds?.findIndex(n=>n.targetId===f);o!==void 0&&o!==-1&&C(o)},[f,e.sectionIds,C]),(0,g.jsx)(L.Container,{ref:u,className:(0,m.cn)(W({theme:b}),i,t?.root),...D,children:(0,g.jsx)("div",{ref:h,className:(0,m.cn)(j({alignment:H,size:y}),"relative",t?.content),children:e.sectionIds?.map((o,n)=>{const s=f===o.targetId;return(0,g.jsx)("button",{ref:a=>{a&&(R.current[n]=a)},"aria-current":s?!0:void 0,onClick:()=>{if(C(n),r){r(o,n);return}const a=document.getElementById(o.targetId);if(a&&u.current){const A=u.current.offsetHeight,k=a.getBoundingClientRect().top+window.scrollY-A;window.scrollTo({top:k,behavior:"smooth"})}},className:(0,m.cn)(U({size:y}),s?[I.activeColor,I.activeIndicatorColor,"after:w-full after:opacity-100"]:I.defaultColor,t?.item),children:o.label},o.targetId)})})})});T.displayName="AnchorNavigation";var K=(0,S.withLayout)(T);
2
2
  //# sourceMappingURL=index.js.map
package/dist/cjs/biz-components/AnchorNavigation/index.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/AnchorNavigation/index.tsx"],
4
- "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport useAnchorPosition from './useAnchorPosition.js'\nimport { Container } from '../../components/container.js'\nimport { withLayout } from '../../shared/Styles.js'\n\nexport interface AnchorNavigationSemanticName {\n root: 'root'\n content: 'content'\n item: 'item'\n}\n\n/**\n * \u5BFC\u822A\u9879\u5BF9\u9F50\u65B9\u5411\u6837\u5F0F\u53D8\u4F53\n */\nconst anchorNavigationVariants = cva(\n 'anchor-navigation-content flex items-center overflow-x-auto [&::-webkit-scrollbar]:hidden',\n {\n variants: {\n alignment: {\n start: 'tablet:justify-start',\n center: 'tablet:justify-center',\n end: 'tablet:justify-end',\n },\n size: {\n small: 'gap-3',\n large: 'gap-6',\n },\n },\n defaultVariants: {\n alignment: 'start',\n size: 'small',\n },\n }\n)\n\n/**\n * \u5BFC\u822A\u9879\u6837\u5F0F\u53D8\u4F53\uFF08\u4E0D\u542B\u989C\u8272\uFF0C\u989C\u8272\u7531 buttonStyle \u63A7\u5236\uFF09\n */\nconst anchorItemVariants = cva(\n 'anchor-navigation-item relative shrink-0 text-sm font-bold after:absolute after:bottom-0 after:left-0 after:h-1 after:w-0 after:opacity-0 after:transition-all after:duration-300',\n {\n variants: {\n size: {\n small: 'py-3',\n large: 'py-4',\n },\n },\n defaultVariants: {\n size: 'small',\n },\n }\n)\n\n/**\n * \u5BB9\u5668\u4E3B\u9898\u6837\u5F0F\u53D8\u4F53\n */\nconst containerVariants = cva('!sticky top-0 !z-40 w-full', {\n variants: {\n theme: {\n light: 'bg-white',\n dark: 'bg-[#1E2024]',\n },\n },\n defaultVariants: {\n theme: 'light',\n },\n})\n\n/**\n * \u6309\u94AE\u989C\u8272\u914D\u7F6E\uFF0C\u5141\u8BB8\u6309 theme \u5206\u522B\u8986\u76D6\u9ED8\u8BA4\u8272\u3001\u6FC0\u6D3B\u6587\u5B57\u8272\u3001\u6FC0\u6D3B\u6307\u793A\u5668\u8272\n */\nexport interface AnchorButtonStyle {\n /** \u9ED8\u8BA4\uFF08\u672A\u6FC0\u6D3B\uFF09\u6587\u5B57\u8272\uFF0CTailwind class\uFF0C\u5982 'text-info-secondary' */\n defaultColor?: string\n /** \u6FC0\u6D3B\u6587\u5B57\u8272\uFF0CTailwind class\uFF0C\u5982 'text-info-primary' */\n activeColor?: string\n /** \u6FC0\u6D3B\u6307\u793A\u5668\uFF08\u4E0B\u5212\u7EBF\uFF09\u80CC\u666F\u8272\uFF0CTailwind class\uFF0C\u5982 'after:bg-brand-0' */\n activeIndicatorColor?: string\n}\n\n/**\n * \u951A\u70B9\u9879\u63A5\u53E3\n */\nexport interface AnchorSectionItem {\n targetId: string\n label: string\n}\n\n/**\n * AnchorNavigation \u4E1A\u52A1\u7EC4\u4EF6\u6570\u636E\u63A5\u53E3\n */\nexport interface AnchorNavigationData {\n /** \u951A\u70B9\u5217\u8868 */\n sectionIds: AnchorSectionItem[]\n /** \u5BFC\u822A\u9879\u6C34\u5E73\u5BF9\u9F50\u65B9\u5F0F */\n alignment?: 'start' | 'center' | 'end'\n /** \u4E3B\u9898\u6A21\u5F0F */\n theme?: 'light' | 'dark'\n /** \u5BFC\u822A\u5927\u5C0F */\n size?: 'small' | 'large'\n}\n\nexport interface AnchorNavigationProps\n extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof anchorNavigationVariants> {\n /** \u4E1A\u52A1\u6570\u636E */\n data: AnchorNavigationData\n /** \u8BED\u4E49\u5316\u7C7B\u540D */\n classNames?: Partial<Record<keyof AnchorNavigationSemanticName, string>>\n /** \u81EA\u5B9A\u4E49\u70B9\u51FB\u4E8B\u4EF6\uFF0C\u4F20\u5165\u65F6\u4F1A\u66FF\u4EE3\u9ED8\u8BA4\u7684\u6EDA\u52A8\u884C\u4E3A */\n onItemClick?: (item: AnchorSectionItem, index: number) => void\n /**\n * \u6309\u94AE\u989C\u8272\u914D\u7F6E\uFF0C\u8986\u76D6 light/dark \u4E3B\u9898\u4E0B\u7684\u9ED8\u8BA4\u989C\u8272\u3002\n * \u672A\u4F20\u65F6\u6309\u4E3B\u9898\u4F7F\u7528\u5185\u7F6E\u9ED8\u8BA4\u503C\u3002\n *\n * @example\n * // \u81EA\u5B9A\u4E49\u989C\u8272\n * buttonStyle={{ defaultColor: 'text-info-secondary', activeColor: 'text-info-primary', activeIndicatorColor: 'after:bg-brand-3' }}\n */\n buttonStyle?: AnchorButtonStyle\n}\n\n/** light \u4E3B\u9898\u9ED8\u8BA4\u989C\u8272 */\nconst LIGHT_DEFAULTS: Required<AnchorButtonStyle> = {\n defaultColor: 'text-[#4A4C56]',\n activeColor: 'text-[#080A0F]',\n activeIndicatorColor: 'after:bg-brand-0',\n}\n\n/** dark \u4E3B\u9898\u9ED8\u8BA4\u989C\u8272 */\nconst DARK_DEFAULTS: Required<AnchorButtonStyle> = {\n defaultColor: 'text-[#8A8D92]',\n activeColor: 'text-white',\n activeIndicatorColor: 'after:bg-brand-0',\n}\n\n/**\n * AnchorNavigation - \u951A\u70B9\u5BFC\u822A\n *\n * @description \u951A\u70B9\u5BFC\u822A\n */\nconst AnchorNavigation = React.forwardRef<HTMLDivElement, AnchorNavigationProps>(\n ({ classNames = {}, data, onItemClick, buttonStyle, className, ...rest }, ref) => {\n const { alignment = 'start', theme = 'light', size = 'small' } = data\n const activeId = useAnchorPosition(data.sectionIds?.map(item => item.targetId) || [])\n const rootRef = React.useRef<HTMLDivElement>(null)\n const containerRef = React.useRef<HTMLDivElement>(null)\n const sectionRefs = React.useRef<HTMLButtonElement[]>([])\n\n // \u66B4\u9732 rootRef \u7ED9\u5916\u90E8 ref\n React.useImperativeHandle(ref, () => rootRef.current as HTMLDivElement)\n\n // \u5408\u5E76\u4E3B\u9898\u9ED8\u8BA4\u503C\u4E0E\u5916\u90E8\u4F20\u5165\u7684 buttonStyle\n const themeDefaults = theme === 'dark' ? DARK_DEFAULTS : LIGHT_DEFAULTS\n const resolvedButtonStyle: Required<AnchorButtonStyle> = {\n defaultColor: buttonStyle?.defaultColor ?? themeDefaults.defaultColor,\n activeColor: buttonStyle?.activeColor ?? themeDefaults.activeColor,\n activeIndicatorColor: buttonStyle?.activeIndicatorColor ?? themeDefaults.activeIndicatorColor,\n }\n\n const autoScrollToActiveItem = React.useCallback((activeIdIndex: number) => {\n const curRef = sectionRefs.current[activeIdIndex]\n\n if (curRef && containerRef.current) {\n const container = containerRef.current\n const button = curRef\n const scrollLeft = button.offsetLeft - container.offsetWidth / 2 + button.offsetWidth / 2\n\n // \u68C0\u67E5 scrollTo \u65B9\u6CD5\u662F\u5426\u5B58\u5728\uFF08\u517C\u5BB9\u6D4B\u8BD5\u73AF\u5883\u548C\u65E7\u6D4F\u89C8\u5668\uFF09\n if (typeof container.scrollTo === 'function') {\n container.scrollTo({\n left: scrollLeft,\n behavior: 'smooth',\n })\n }\n }\n }, [])\n\n // \u5F53\u5C4F\u5E55\u6EDA\u52A8\u5BFC\u81F4 activeId \u53D8\u5316\u65F6\uFF0C\u81EA\u52A8\u6EDA\u52A8\u5BFC\u822A\u680F\u5230\u5BF9\u5E94\u9879\n React.useEffect(() => {\n if (!activeId) return\n\n const activeIndex = data.sectionIds?.findIndex(item => item.targetId === activeId)\n if (activeIndex !== undefined && activeIndex !== -1) {\n autoScrollToActiveItem(activeIndex)\n }\n }, [activeId, data.sectionIds, autoScrollToActiveItem])\n\n return (\n <Container ref={rootRef} className={cn(containerVariants({ theme }), classNames?.root)} {...rest}>\n <div\n ref={containerRef}\n className={cn(anchorNavigationVariants({ alignment, size }), 'relative', classNames?.content)}\n >\n {data.sectionIds?.map((item, index) => {\n const isActive = activeId === item.targetId\n\n return (\n <button\n key={item.targetId}\n ref={el => {\n if (el) {\n sectionRefs.current[index] = el\n }\n }}\n aria-current={isActive ? true : undefined}\n onClick={() => {\n // \u9ED8\u8BA4\u884C\u4E3A\uFF1A\u6EDA\u52A8\u5230\u5BF9\u5E94\u951A\u70B9\n autoScrollToActiveItem(index)\n\n // \u5982\u679C\u6709\u81EA\u5B9A\u4E49\u70B9\u51FB\u4E8B\u4EF6\uFF0C\u4F7F\u7528\u81EA\u5B9A\u4E49\u4E8B\u4EF6\n if (onItemClick) {\n onItemClick(item, index)\n return\n }\n\n // \u624B\u52A8\u8BA1\u7B97\u6EDA\u52A8\u4F4D\u7F6E\uFF0C\u8003\u8651\u5BFC\u822A\u680F\u9AD8\u5EA6\n const targetElement = document.getElementById(item.targetId)\n if (targetElement && rootRef.current) {\n const navHeight = rootRef.current.offsetHeight\n const targetPosition = targetElement.getBoundingClientRect().top + window.scrollY - navHeight\n\n window.scrollTo({\n top: targetPosition,\n behavior: 'smooth',\n })\n }\n }}\n className={cn(\n anchorItemVariants({ size }),\n isActive\n ? [\n resolvedButtonStyle.activeColor,\n resolvedButtonStyle.activeIndicatorColor,\n 'after:w-full after:opacity-100',\n ]\n : resolvedButtonStyle.defaultColor,\n classNames?.item\n )}\n >\n {item.label}\n </button>\n )\n })}\n </div>\n </Container>\n )\n }\n)\n\nAnchorNavigation.displayName = 'AnchorNavigation'\nexport default withLayout(AnchorNavigation)\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport useAnchorPosition from './useAnchorPosition.js'\nimport { Container } from '../../components/container.js'\nimport { withLayout } from '../../shared/Styles.js'\n\nexport interface AnchorNavigationSemanticName {\n root: 'root'\n content: 'content'\n item: 'item'\n}\n\n/**\n * \u5BFC\u822A\u9879\u5BF9\u9F50\u65B9\u5411\u6837\u5F0F\u53D8\u4F53\n */\nconst anchorNavigationVariants = cva(\n 'anchor-navigation-content flex items-center overflow-x-auto [&::-webkit-scrollbar]:hidden',\n {\n variants: {\n alignment: {\n start: 'tablet:justify-start',\n center: 'tablet:justify-center',\n end: 'tablet:justify-end',\n },\n size: {\n small: 'gap-3',\n large: 'gap-6',\n },\n },\n defaultVariants: {\n alignment: 'start',\n size: 'small',\n },\n }\n)\n\n/**\n * \u5BFC\u822A\u9879\u6837\u5F0F\u53D8\u4F53\uFF08\u4E0D\u542B\u989C\u8272\uFF0C\u989C\u8272\u7531 buttonStyle \u63A7\u5236\uFF09\n */\nconst anchorItemVariants = cva(\n 'anchor-navigation-item relative shrink-0 text-sm font-bold after:absolute after:bottom-0 after:left-0 after:h-1 after:w-0 after:opacity-0 after:transition-all after:duration-300',\n {\n variants: {\n size: {\n small: 'py-3',\n large: 'py-4',\n },\n },\n defaultVariants: {\n size: 'small',\n },\n }\n)\n\n/**\n * \u5BB9\u5668\u4E3B\u9898\u6837\u5F0F\u53D8\u4F53\n */\nconst containerVariants = cva('!sticky top-0 !z-40 w-full', {\n variants: {\n theme: {\n light: '!bg-white',\n dark: '!bg-[#1E2024]',\n },\n },\n defaultVariants: {\n theme: 'light',\n },\n})\n\n/**\n * \u6309\u94AE\u989C\u8272\u914D\u7F6E\uFF0C\u5141\u8BB8\u6309 theme \u5206\u522B\u8986\u76D6\u9ED8\u8BA4\u8272\u3001\u6FC0\u6D3B\u6587\u5B57\u8272\u3001\u6FC0\u6D3B\u6307\u793A\u5668\u8272\n */\nexport interface AnchorButtonStyle {\n /** \u9ED8\u8BA4\uFF08\u672A\u6FC0\u6D3B\uFF09\u6587\u5B57\u8272\uFF0CTailwind class\uFF0C\u5982 'text-info-secondary' */\n defaultColor?: string\n /** \u6FC0\u6D3B\u6587\u5B57\u8272\uFF0CTailwind class\uFF0C\u5982 'text-info-primary' */\n activeColor?: string\n /** \u6FC0\u6D3B\u6307\u793A\u5668\uFF08\u4E0B\u5212\u7EBF\uFF09\u80CC\u666F\u8272\uFF0CTailwind class\uFF0C\u5982 'after:bg-brand-0' */\n activeIndicatorColor?: string\n}\n\n/**\n * \u951A\u70B9\u9879\u63A5\u53E3\n */\nexport interface AnchorSectionItem {\n targetId: string\n label: string\n}\n\n/**\n * AnchorNavigation \u4E1A\u52A1\u7EC4\u4EF6\u6570\u636E\u63A5\u53E3\n */\nexport interface AnchorNavigationData {\n /** \u951A\u70B9\u5217\u8868 */\n sectionIds: AnchorSectionItem[]\n /** \u5BFC\u822A\u9879\u6C34\u5E73\u5BF9\u9F50\u65B9\u5F0F */\n alignment?: 'start' | 'center' | 'end'\n /** \u4E3B\u9898\u6A21\u5F0F */\n theme?: 'light' | 'dark'\n /** \u5BFC\u822A\u5927\u5C0F */\n size?: 'small' | 'large'\n}\n\nexport interface AnchorNavigationProps\n extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof anchorNavigationVariants> {\n /** \u4E1A\u52A1\u6570\u636E */\n data: AnchorNavigationData\n /** \u8BED\u4E49\u5316\u7C7B\u540D */\n classNames?: Partial<Record<keyof AnchorNavigationSemanticName, string>>\n /** \u81EA\u5B9A\u4E49\u70B9\u51FB\u4E8B\u4EF6\uFF0C\u4F20\u5165\u65F6\u4F1A\u66FF\u4EE3\u9ED8\u8BA4\u7684\u6EDA\u52A8\u884C\u4E3A */\n onItemClick?: (item: AnchorSectionItem, index: number) => void\n /**\n * \u6309\u94AE\u989C\u8272\u914D\u7F6E\uFF0C\u8986\u76D6 light/dark \u4E3B\u9898\u4E0B\u7684\u9ED8\u8BA4\u989C\u8272\u3002\n * \u672A\u4F20\u65F6\u6309\u4E3B\u9898\u4F7F\u7528\u5185\u7F6E\u9ED8\u8BA4\u503C\u3002\n *\n * @example\n * // \u81EA\u5B9A\u4E49\u989C\u8272\n * buttonStyle={{ defaultColor: 'text-info-secondary', activeColor: 'text-info-primary', activeIndicatorColor: 'after:bg-brand-3' }}\n */\n buttonStyle?: AnchorButtonStyle\n}\n\n/** light \u4E3B\u9898\u9ED8\u8BA4\u989C\u8272 */\nconst LIGHT_DEFAULTS: Required<AnchorButtonStyle> = {\n defaultColor: 'text-[#4A4C56]',\n activeColor: 'text-[#080A0F]',\n activeIndicatorColor: 'after:bg-brand-0',\n}\n\n/** dark \u4E3B\u9898\u9ED8\u8BA4\u989C\u8272 */\nconst DARK_DEFAULTS: Required<AnchorButtonStyle> = {\n defaultColor: 'text-[#8A8D92]',\n activeColor: 'text-white',\n activeIndicatorColor: 'after:bg-brand-0',\n}\n\n/**\n * AnchorNavigation - \u951A\u70B9\u5BFC\u822A\n *\n * @description \u951A\u70B9\u5BFC\u822A\n */\nconst AnchorNavigation = React.forwardRef<HTMLDivElement, AnchorNavigationProps>(\n ({ classNames = {}, data, onItemClick, buttonStyle, className, ...rest }, ref) => {\n const { alignment = 'start', theme = 'light', size = 'small' } = data\n const activeId = useAnchorPosition(data.sectionIds?.map(item => item.targetId) || [])\n const rootRef = React.useRef<HTMLDivElement>(null)\n const containerRef = React.useRef<HTMLDivElement>(null)\n const sectionRefs = React.useRef<HTMLButtonElement[]>([])\n\n // \u66B4\u9732 rootRef \u7ED9\u5916\u90E8 ref\n React.useImperativeHandle(ref, () => rootRef.current as HTMLDivElement)\n\n // \u5408\u5E76\u4E3B\u9898\u9ED8\u8BA4\u503C\u4E0E\u5916\u90E8\u4F20\u5165\u7684 buttonStyle\n const themeDefaults = theme === 'dark' ? DARK_DEFAULTS : LIGHT_DEFAULTS\n const resolvedButtonStyle: Required<AnchorButtonStyle> = {\n defaultColor: buttonStyle?.defaultColor ?? themeDefaults.defaultColor,\n activeColor: buttonStyle?.activeColor ?? themeDefaults.activeColor,\n activeIndicatorColor: buttonStyle?.activeIndicatorColor ?? themeDefaults.activeIndicatorColor,\n }\n\n const autoScrollToActiveItem = React.useCallback((activeIdIndex: number) => {\n const curRef = sectionRefs.current[activeIdIndex]\n\n if (curRef && containerRef.current) {\n const container = containerRef.current\n const button = curRef\n const scrollLeft = button.offsetLeft - container.offsetWidth / 2 + button.offsetWidth / 2\n\n // \u68C0\u67E5 scrollTo \u65B9\u6CD5\u662F\u5426\u5B58\u5728\uFF08\u517C\u5BB9\u6D4B\u8BD5\u73AF\u5883\u548C\u65E7\u6D4F\u89C8\u5668\uFF09\n if (typeof container.scrollTo === 'function') {\n container.scrollTo({\n left: scrollLeft,\n behavior: 'smooth',\n })\n }\n }\n }, [])\n\n // \u5F53\u5C4F\u5E55\u6EDA\u52A8\u5BFC\u81F4 activeId \u53D8\u5316\u65F6\uFF0C\u81EA\u52A8\u6EDA\u52A8\u5BFC\u822A\u680F\u5230\u5BF9\u5E94\u9879\n React.useEffect(() => {\n if (!activeId) return\n\n const activeIndex = data.sectionIds?.findIndex(item => item.targetId === activeId)\n if (activeIndex !== undefined && activeIndex !== -1) {\n autoScrollToActiveItem(activeIndex)\n }\n }, [activeId, data.sectionIds, autoScrollToActiveItem])\n\n return (\n <Container ref={rootRef} className={cn(containerVariants({ theme }), className, classNames?.root)} {...rest}>\n <div\n ref={containerRef}\n className={cn(anchorNavigationVariants({ alignment, size }), 'relative', classNames?.content)}\n >\n {data.sectionIds?.map((item, index) => {\n const isActive = activeId === item.targetId\n\n return (\n <button\n key={item.targetId}\n ref={el => {\n if (el) {\n sectionRefs.current[index] = el\n }\n }}\n aria-current={isActive ? true : undefined}\n onClick={() => {\n // \u9ED8\u8BA4\u884C\u4E3A\uFF1A\u6EDA\u52A8\u5230\u5BF9\u5E94\u951A\u70B9\n autoScrollToActiveItem(index)\n\n // \u5982\u679C\u6709\u81EA\u5B9A\u4E49\u70B9\u51FB\u4E8B\u4EF6\uFF0C\u4F7F\u7528\u81EA\u5B9A\u4E49\u4E8B\u4EF6\n if (onItemClick) {\n onItemClick(item, index)\n return\n }\n\n // \u624B\u52A8\u8BA1\u7B97\u6EDA\u52A8\u4F4D\u7F6E\uFF0C\u8003\u8651\u5BFC\u822A\u680F\u9AD8\u5EA6\n const targetElement = document.getElementById(item.targetId)\n if (targetElement && rootRef.current) {\n const navHeight = rootRef.current.offsetHeight\n const targetPosition = targetElement.getBoundingClientRect().top + window.scrollY - navHeight\n\n window.scrollTo({\n top: targetPosition,\n behavior: 'smooth',\n })\n }\n }}\n className={cn(\n anchorItemVariants({ size }),\n isActive\n ? [\n resolvedButtonStyle.activeColor,\n resolvedButtonStyle.activeIndicatorColor,\n 'after:w-full after:opacity-100',\n ]\n : resolvedButtonStyle.defaultColor,\n classNames?.item\n )}\n >\n {item.label}\n </button>\n )\n })}\n </div>\n </Container>\n )\n }\n)\n\nAnchorNavigation.displayName = 'AnchorNavigation'\nexport default withLayout(AnchorNavigation)\n"],
5
+ "mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAyMc,IAAAI,EAAA,6BAvMdC,EAAuB,oBACvBC,EAAmB,kCACnBC,EAAuC,oCACvCC,EAA8B,qCAC9BC,EAA0B,yCAC1BC,EAA2B,kCAW3B,MAAMC,KAA2B,OAC/B,4FACA,CACE,SAAU,CACR,UAAW,CACT,MAAO,uBACP,OAAQ,wBACR,IAAK,oBACP,EACA,KAAM,CACJ,MAAO,QACP,MAAO,OACT,CACF,EACA,gBAAiB,CACf,UAAW,QACX,KAAM,OACR,CACF,CACF,EAKMC,KAAqB,OACzB,oLACA,CACE,SAAU,CACR,KAAM,CACJ,MAAO,OACP,MAAO,MACT,CACF,EACA,gBAAiB,CACf,KAAM,OACR,CACF,CACF,EAKMC,KAAoB,OAAI,6BAA8B,CAC1D,SAAU,CACR,MAAO,CACL,MAAO,YACP,KAAM,eACR,CACF,EACA,gBAAiB,CACf,MAAO,OACT,CACF,CAAC,EAwDKC,EAA8C,CAClD,aAAc,iBACd,YAAa,iBACb,qBAAsB,kBACxB,EAGMC,EAA6C,CACjD,aAAc,iBACd,YAAa,aACb,qBAAsB,kBACxB,EAOMC,EAAmBX,EAAM,WAC7B,CAAC,CAAE,WAAAY,EAAa,CAAC,EAAG,KAAAC,EAAM,YAAAC,EAAa,YAAAC,EAAa,UAAAC,EAAW,GAAGC,CAAK,EAAGC,IAAQ,CAChF,KAAM,CAAE,UAAAC,EAAY,QAAS,MAAAC,EAAQ,QAAS,KAAAC,EAAO,OAAQ,EAAIR,EAC3DS,KAAW,EAAAC,SAAkBV,EAAK,YAAY,IAAIW,GAAQA,EAAK,QAAQ,GAAK,CAAC,CAAC,EAC9EC,EAAUzB,EAAM,OAAuB,IAAI,EAC3C0B,EAAe1B,EAAM,OAAuB,IAAI,EAChD2B,EAAc3B,EAAM,OAA4B,CAAC,CAAC,EAGxDA,EAAM,oBAAoBkB,EAAK,IAAMO,EAAQ,OAAyB,EAGtE,MAAMG,EAAgBR,IAAU,OAASV,EAAgBD,EACnDoB,EAAmD,CACvD,aAAcd,GAAa,cAAgBa,EAAc,aACzD,YAAab,GAAa,aAAea,EAAc,YACvD,qBAAsBb,GAAa,sBAAwBa,EAAc,oBAC3E,EAEME,EAAyB9B,EAAM,YAAa+B,GAA0B,CAC1E,MAAMC,EAASL,EAAY,QAAQI,CAAa,EAEhD,GAAIC,GAAUN,EAAa,QAAS,CAClC,MAAMO,EAAYP,EAAa,QACzBQ,EAASF,EACTG,EAAaD,EAAO,WAAaD,EAAU,YAAc,EAAIC,EAAO,YAAc,EAGpF,OAAOD,EAAU,UAAa,YAChCA,EAAU,SAAS,CACjB,KAAME,EACN,SAAU,QACZ,CAAC,CAEL,CACF,EAAG,CAAC,CAAC,EAGL,OAAAnC,EAAM,UAAU,IAAM,CACpB,GAAI,CAACsB,EAAU,OAEf,MAAMc,EAAcvB,EAAK,YAAY,UAAUW,GAAQA,EAAK,WAAaF,CAAQ,EAC7Ec,IAAgB,QAAaA,IAAgB,IAC/CN,EAAuBM,CAAW,CAEtC,EAAG,CAACd,EAAUT,EAAK,WAAYiB,CAAsB,CAAC,KAGpD,OAAC,aAAU,IAAKL,EAAS,aAAW,MAAGjB,EAAkB,CAAE,MAAAY,CAAM,CAAC,EAAGJ,EAAWJ,GAAY,IAAI,EAAI,GAAGK,EACrG,mBAAC,OACC,IAAKS,EACL,aAAW,MAAGpB,EAAyB,CAAE,UAAAa,EAAW,KAAAE,CAAK,CAAC,EAAG,WAAYT,GAAY,OAAO,EAE3F,SAAAC,EAAK,YAAY,IAAI,CAACW,EAAMa,IAAU,CACrC,MAAMC,EAAWhB,IAAaE,EAAK,SAEnC,SACE,OAAC,UAEC,IAAKe,GAAM,CACLA,IACFZ,EAAY,QAAQU,CAAK,EAAIE,EAEjC,EACA,eAAcD,EAAW,GAAO,OAChC,QAAS,IAAM,CAKb,GAHAR,EAAuBO,CAAK,EAGxBvB,EAAa,CACfA,EAAYU,EAAMa,CAAK,EACvB,MACF,CAGA,MAAMG,EAAgB,SAAS,eAAehB,EAAK,QAAQ,EAC3D,GAAIgB,GAAiBf,EAAQ,QAAS,CACpC,MAAMgB,EAAYhB,EAAQ,QAAQ,aAC5BiB,EAAiBF,EAAc,sBAAsB,EAAE,IAAM,OAAO,QAAUC,EAEpF,OAAO,SAAS,CACd,IAAKC,EACL,SAAU,QACZ,CAAC,CACH,CACF,EACA,aAAW,MACTnC,EAAmB,CAAE,KAAAc,CAAK,CAAC,EAC3BiB,EACI,CACET,EAAoB,YACpBA,EAAoB,qBACpB,gCACF,EACAA,EAAoB,aACxBjB,GAAY,IACd,EAEC,SAAAY,EAAK,OAzCDA,EAAK,QA0CZ,CAEJ,CAAC,EACH,EACF,CAEJ,CACF,EAEAb,EAAiB,YAAc,mBAC/B,IAAOd,KAAQ,cAAWc,CAAgB",
6
6
  "names": ["AnchorNavigation_exports", "__export", "AnchorNavigation_default", "__toCommonJS", "import_jsx_runtime", "React", "import_utils", "import_class_variance_authority", "import_useAnchorPosition", "import_container", "import_Styles", "anchorNavigationVariants", "anchorItemVariants", "containerVariants", "LIGHT_DEFAULTS", "DARK_DEFAULTS", "AnchorNavigation", "classNames", "data", "onItemClick", "buttonStyle", "className", "rest", "ref", "alignment", "theme", "size", "activeId", "useAnchorPosition", "item", "rootRef", "containerRef", "sectionRefs", "themeDefaults", "resolvedButtonStyle", "autoScrollToActiveItem", "activeIdIndex", "curRef", "container", "button", "scrollLeft", "activeIndex", "index", "isActive", "el", "targetElement", "navHeight", "targetPosition"]
7
7
  }
package/dist/cjs/components/Countdown.js CHANGED
@@ -1,2 +1,2 @@
1
- "use strict";"use client";var X=Object.create;var f=Object.defineProperty;var Y=Object.getOwnPropertyDescriptor;var Z=Object.getOwnPropertyNames;var tt=Object.getPrototypeOf,et=Object.prototype.hasOwnProperty;var nt=(t,e)=>{for(var a in e)f(t,a,{get:e[a],enumerable:!0})},j=(t,e,a,x)=>{if(e&&typeof e=="object"||typeof e=="function")for(let o of Z(e))!et.call(t,o)&&o!==a&&f(t,o,{get:()=>e[o],enumerable:!(x=Y(e,o))||x.enumerable});return t};var st=(t,e,a)=>(a=t!=null?X(tt(t)):{},j(e||!t||!t.__esModule?f(a,"default",{value:t,enumerable:!0}):a,t)),rt=t=>j(f({},"__esModule",{value:!0}),t);var mt={};nt(mt,{default:()=>pt});module.exports=rt(mt);var r=require("react/jsx-runtime"),s=st(require("react")),d=require("class-variance-authority"),g=require("../helpers/index.js");const at=(0,d.cva)("countdown-container flex w-full items-center",{variants:{variant:{outline:"gap-1",spacious:"gap-1"},align:{left:"justify-start",center:"justify-center"}},defaultVariants:{variant:"outline",align:"left"}}),ot=(0,d.cva)("time-block border-box rounded-box-small flex flex-col items-center justify-center overflow-hidden text-center text-xs",{variants:{variant:{outline:"border-info-primary text-info-primary desktop:size-12 desktop:p-1 size-10 border bg-transparent p-[2px]",spacious:"bg-info-white text-info-primary desktop:size-12 desktop:p-1 size-10 p-[2px]"}},defaultVariants:{variant:"outline"}}),it=(0,d.cva)("time-number lg-desktop:text-[24px] translate-y-[2px] whitespace-nowrap text-center text-[20px] font-bold leading-none"),lt=(0,d.cva)("separator desktop:text-2xl text-xl font-bold",{variants:{variant:{outline:"text-info-primary",spacious:"text-info-primary"}},defaultVariants:{variant:"outline"}}),ut=t=>t?t==="light"?"bg-info-primary text-info-white border-transparent":"bg-container-secondary text-info-primary border-transparent":"",ct=t=>t?"text-info-primary":"",b=(t,e=2)=>String(Math.abs(t)).padStart(e,"0"),H=()=>({day:"Day",hour:"Hours",minute:"Mins",second:"Secs"}),B=t=>{const e=H();return{day:t.day??t.days??e.day,hour:t.hour??t.hours??e.hour,minute:t.minute??t.minutes??e.minute,second:t.second??t.seconds??e.second}},dt=t=>{try{let e=t?.trim?.();return!e?.startsWith?.("{")||!e?.endsWith?.("}")?{}:(e=e?.replace?.(/(\w+)\s*:/g,'"$1":'),JSON.parse(e))}catch{return{}}},O=s.default.forwardRef(({className:t,endDate:e,endDate_tz:a,locale:x,timeLabels:o,dateFormat:h,onExpire:w,separator:W=":",hideWhenExpired:A=!0,showDays:T=!0,showHours:N=!0,showMinutes:L=!0,showSeconds:M=!0,variant:v,align:_,theme:C,...F},J)=>{const p=(0,s.useMemo)(()=>o?B(o):h?B(dt(h)):H(),[o,h]),i=(0,s.useRef)(Date.parse(e)),[q,k]=(0,s.useState)(()=>{const n=i.current;return isNaN(n)?0:Math.max(0,n-Date.now())}),[m,D]=(0,s.useState)(()=>{const n=i.current;return!isNaN(n)&&n<=Date.now()});(0,s.useEffect)(()=>{i.current=Date.parse(e);const n=i.current,c=isNaN(n)?0:Math.max(0,n-Date.now()),y=!isNaN(n)&&n<=Date.now();k(c),D(y)},[e]),(0,s.useEffect)(()=>{if(m||isNaN(i.current))return;let n=!1;const c=()=>{const U=Date.now(),$=Math.max(0,i.current-U);k($),$<=0&&!n&&(n=!0,D(!0),w?.())};c();const y=window.setInterval(c,1e3);return()=>clearInterval(y)},[w,m,e]);const I=Math.floor(q/1e3),V=I%60,S=Math.floor(I/60),E=S%60,P=Math.floor(S/60),R=P%24,z=Math.floor(P/24),l=[];T&&l.push({value:z,label:p.day,cssClass:"time-days-box"}),N&&l.push({value:R,label:p.hour,cssClass:"time-hours-box"}),L&&l.push({value:E,label:p.minute,cssClass:"time-minutes-box"}),M&&l.push({value:V,label:p.second,cssClass:"time-seconds-box"});const u=[];T&&u.push(`${z} days`),N&&u.push(`${b(R)} hours`),L&&u.push(`${b(E)} minutes`),M&&u.push(`${b(V)} seconds`);const G=u.length>0?`${u.join(" ")} remaining`:"countdown timer";if(m&&A)return(0,r.jsx)("span",{role:"status","aria-live":"polite",className:"sr-only",children:"Countdown has ended"});const K=ut(C),Q=ct(C);return(0,r.jsxs)("div",{ref:J,className:(0,g.cn)(at({variant:v,align:_}),t),role:"timer","aria-label":G,...F,children:[l.map((n,c)=>(0,r.jsxs)(s.default.Fragment,{children:[(0,r.jsxs)("div",{className:(0,g.cn)(ot({variant:v}),K,n.cssClass),children:[(0,r.jsx)("div",{className:it(),children:b(n.value,2)}),(0,r.jsx)("div",{className:"truncate text-center text-[12px] font-bold",children:n.label})]}),c<l.length-1&&(0,r.jsx)("div",{className:(0,g.cn)(lt({variant:v}),Q),children:W})]},n.cssClass)),m&&(0,r.jsx)("span",{role:"status","aria-live":"polite",className:"sr-only",children:"Countdown has ended"})]})});O.displayName="Countdown";var pt=O;
1
+ "use strict";"use client";var Z=Object.create;var b=Object.defineProperty;var ee=Object.getOwnPropertyDescriptor;var te=Object.getOwnPropertyNames;var ne=Object.getPrototypeOf,se=Object.prototype.hasOwnProperty;var re=(e,t)=>{for(var a in t)b(e,a,{get:t[a],enumerable:!0})},H=(e,t,a,x)=>{if(t&&typeof t=="object"||typeof t=="function")for(let o of te(t))!se.call(e,o)&&o!==a&&b(e,o,{get:()=>t[o],enumerable:!(x=ee(t,o))||x.enumerable});return e};var ae=(e,t,a)=>(a=e!=null?Z(ne(e)):{},H(t||!e||!e.__esModule?b(a,"default",{value:e,enumerable:!0}):a,e)),oe=e=>H(b({},"__esModule",{value:!0}),e);var be={};re(be,{default:()=>fe});module.exports=oe(be);var r=require("react/jsx-runtime"),s=ae(require("react")),d=require("class-variance-authority"),h=require("../helpers/index.js");const ie=(0,d.cva)("countdown-container flex w-full items-center",{variants:{variant:{outline:"gap-1",spacious:"gap-1"},align:{left:"justify-start",center:"justify-center"}},defaultVariants:{variant:"outline",align:"left"}}),le=(0,d.cva)("time-block border-box rounded-box-small flex flex-col items-center justify-center overflow-hidden text-center text-xs",{variants:{variant:{outline:"border-info-primary text-info-primary desktop:size-12 desktop:p-1 size-10 border bg-transparent p-[2px]",spacious:"bg-info-white text-info-primary desktop:size-12 desktop:p-1 size-10 p-[2px]"}},defaultVariants:{variant:"outline"}}),ue=(0,d.cva)("time-number lg-desktop:text-[24px] translate-y-[2px] whitespace-nowrap text-center text-[20px] font-bold leading-none"),ce=(0,d.cva)("separator desktop:text-2xl text-xl font-bold",{variants:{variant:{outline:"text-info-primary",spacious:"text-info-primary"}},defaultVariants:{variant:"outline"}}),de=e=>e?e==="light"?"bg-info-primary text-info-white border-transparent":"bg-container-secondary text-info-primary border-transparent":"",me=e=>e?"text-info-primary":"",g=(e,t=2)=>String(Math.abs(e)).padStart(t,"0"),F=()=>({day:"Day",hour:"Hours",minute:"Mins",second:"Secs"}),B=e=>{const t=F();return{day:e.day??e.days??t.day,hour:e.hour??e.hours??t.hour,minute:e.minute??e.minutes??t.minute,second:e.second??e.seconds??t.second}},pe=e=>{try{let t=e?.trim?.();return!t?.startsWith?.("{")||!t?.endsWith?.("}")?{}:(t=t?.replace?.(/(\w+)\s*:/g,'"$1":'),JSON.parse(t))}catch{return{}}},O=s.default.forwardRef(({className:e,endDate:t,endDate_tz:a,locale:x,timeLabels:o,dateFormat:y,onExpire:T,separator:W=":",hideWhenExpired:q=!0,showDays:N=!0,showHours:L=!0,showMinutes:M=!0,showSeconds:C=!0,variant:v,align:_,theme:k,...J},G)=>{const m=(0,s.useMemo)(()=>o?B(o):y?B(pe(y)):F(),[o,y]),l=(0,s.useRef)(Date.parse(t)),[K,D]=(0,s.useState)(()=>{const n=l.current;return isNaN(n)?0:Math.max(0,n-Date.now())}),[p,S]=(0,s.useState)(()=>{const n=l.current;return!isNaN(n)&&n<=Date.now()});(0,s.useEffect)(()=>{l.current=Date.parse(t);const n=l.current,i=isNaN(n)?0:Math.max(0,n-Date.now()),f=!isNaN(n)&&n<=Date.now();D(i),S(f)},[t]),(0,s.useEffect)(()=>{if(p||isNaN(l.current))return;let n=!1,i=0,f=-1;const j=()=>{const Y=Date.now(),w=Math.max(0,l.current-Y),A=Math.floor(w/1e3);if(A!==f&&(f=A,D(w),w<=0&&!n)){n=!0,S(!0),T?.();return}i=requestAnimationFrame(j)};return i=requestAnimationFrame(j),()=>cancelAnimationFrame(i)},[T,p,t]);const V=Math.floor(K/1e3),E=V%60,I=Math.floor(V/60),P=I%60,R=Math.floor(I/60),z=R%24,$=Math.floor(R/24),u=[];N&&u.push({value:$,label:m.day,cssClass:"time-days-box"}),L&&u.push({value:z,label:m.hour,cssClass:"time-hours-box"}),M&&u.push({value:P,label:m.minute,cssClass:"time-minutes-box"}),C&&u.push({value:E,label:m.second,cssClass:"time-seconds-box"});const c=[];N&&c.push(`${$} days`),L&&c.push(`${g(z)} hours`),M&&c.push(`${g(P)} minutes`),C&&c.push(`${g(E)} seconds`);const Q=c.length>0?`${c.join(" ")} remaining`:"countdown timer";if(p&&q)return(0,r.jsx)("span",{role:"status","aria-live":"polite",className:"sr-only",children:"Countdown has ended"});const U=de(k),X=me(k);return(0,r.jsxs)("div",{ref:G,className:(0,h.cn)(ie({variant:v,align:_}),e),role:"timer","aria-label":Q,...J,children:[u.map((n,i)=>(0,r.jsxs)(s.default.Fragment,{children:[(0,r.jsxs)("div",{className:(0,h.cn)(le({variant:v}),U,n.cssClass),children:[(0,r.jsx)("div",{className:ue(),children:g(n.value,2)}),(0,r.jsx)("div",{className:"truncate text-center text-[12px] font-bold",children:n.label})]}),i<u.length-1&&(0,r.jsx)("div",{className:(0,h.cn)(ce({variant:v}),X),children:W})]},n.cssClass)),p&&(0,r.jsx)("span",{role:"status","aria-live":"polite",className:"sr-only",children:"Countdown has ended"})]})});O.displayName="Countdown";var fe=O;
2
2
  //# sourceMappingURL=Countdown.js.map
package/dist/cjs/components/Countdown.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/components/Countdown.tsx"],
4
- "sourcesContent": ["'use client'\n\nimport React, { useEffect, useRef, useState, useMemo } from 'react'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { cn } from '../helpers/index.js'\n\n// \u5B9A\u4E49\u6837\u5F0F\u53D8\u4F53\nconst countdownVariants = cva(\n // \u57FA\u7840\u6837\u5F0F\uFF1A\u5012\u8BA1\u65F6\u5BB9\u5668\n 'countdown-container flex w-full items-center',\n {\n variants: {\n variant: {\n outline: 'gap-1',\n spacious: 'gap-1',\n },\n align: {\n left: 'justify-start',\n center: 'justify-center',\n },\n },\n defaultVariants: {\n variant: 'outline',\n align: 'left',\n },\n }\n)\n\nconst timeBlockVariants = cva(\n // \u57FA\u7840\u6837\u5F0F\uFF1A\u65F6\u95F4\u5757\n 'time-block border-box rounded-box-small flex flex-col items-center justify-center overflow-hidden text-center text-xs',\n {\n variants: {\n variant: {\n outline:\n 'border-info-primary text-info-primary desktop:size-12 desktop:p-1 size-10 border bg-transparent p-[2px]',\n spacious: 'bg-info-white text-info-primary desktop:size-12 desktop:p-1 size-10 p-[2px]',\n },\n },\n defaultVariants: {\n variant: 'outline',\n },\n }\n)\n\nconst timeNumberVariants = cva(\n 'time-number lg-desktop:text-[24px] translate-y-[2px] whitespace-nowrap text-center text-[20px] font-bold leading-none'\n)\n\nconst separatorVariants = cva(\n // \u57FA\u7840\u6837\u5F0F\uFF1A\u5206\u9694\u7B26\n 'separator desktop:text-2xl text-xl font-bold',\n {\n variants: {\n variant: {\n outline: 'text-info-primary',\n spacious: 'text-info-primary',\n },\n },\n defaultVariants: {\n variant: 'outline',\n },\n }\n)\n\n/**\n * \u4E3B\u9898\u8272\u8986\u76D6\u7C7B - \u4EC5\u5F53 theme \u4F20\u5165\u65F6\u8986\u76D6 variant \u7684\u989C\u8272\u90E8\u5206\uFF0C\u4FDD\u7559\u5E03\u5C40/\u5C3A\u5BF8\n */\nconst getTimeBlockThemeClasses = (theme?: 'light' | 'dark'): string => {\n if (!theme) return ''\n return theme === 'light'\n ? 'bg-info-primary text-info-white border-transparent'\n : 'bg-container-secondary text-info-primary border-transparent'\n}\n\nconst getSeparatorThemeClasses = (theme?: 'light' | 'dark'): string => {\n if (!theme) return ''\n return 'text-info-primary'\n}\n\n/**\n * \u65F6\u95F4\u6807\u7B7E\u914D\u7F6E\u63A5\u53E3 (singular keys)\n */\nexport interface TimeLabels {\n /** \u5929\u7684\u6807\u7B7E */\n day: string\n /** \u5C0F\u65F6\u7684\u6807\u7B7E */\n hour: string\n /** \u5206\u949F\u7684\u6807\u7B7E */\n minute: string\n /** \u79D2\u7684\u6807\u7B7E */\n second: string\n}\n\n/**\n * \u65F6\u95F4\u6807\u7B7E\u914D\u7F6E\u63A5\u53E3 (plural keys, e.g. from Title component)\n */\nexport interface PluralTimeLabels {\n days: string\n hours: string\n minutes: string\n seconds: string\n}\n\n/**\n * \u65F6\u95F4\u6807\u7B7E\u8F93\u5165\u7C7B\u578B - \u652F\u6301 singular \u548C plural \u952E\u540D\uFF0C\u6240\u6709\u5B57\u6BB5\u53EF\u9009\n */\nexport type TimeLabelsInput = Partial<TimeLabels & PluralTimeLabels>\n\n/**\n * \u5012\u8BA1\u65F6\u7EC4\u4EF6Props\u63A5\u53E3\n */\nexport interface CountdownProps\n extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onExpire'>, VariantProps<typeof countdownVariants> {\n /** \u7ED3\u675F\u65F6\u95F4 - ISO\u683C\u5F0F\u5B57\u7B26\u4E32 */\n endDate: string\n /** \u7ED3\u675F\u65F6\u95F4\u65F6\u533A\uFF0C\u5982: America/Los_Angeles */\n endDate_tz?: string\n /** \u683C\u5F0F\u5316\u7528\u7684locale\uFF0C\u9ED8\u8BA4\u4F7F\u7528navigator.language */\n locale?: string\n /** \u65F6\u95F4\u6807\u7B7E\u914D\u7F6E\uFF0C\u652F\u6301 singular (day/hour/minute/second) \u548C plural (days/hours/minutes/seconds) \u952E\u540D */\n timeLabels?: TimeLabelsInput\n /** JSON\u5B57\u7B26\u4E32\u683C\u5F0F\u7684\u65F6\u95F4\u6807\u7B7E\uFF08\u5411\u540E\u517C\u5BB9\uFF09 */\n dateFormat?: string\n /** \u5012\u8BA1\u65F6\u7ED3\u675F\u56DE\u8C03 */\n onExpire?: () => void\n /** \u5206\u9694\u7B26\u5B57\u7B26\uFF0C\u9ED8\u8BA4\u4E3A ':' */\n separator?: string\n /** \u9690\u85CF\u5DF2\u8FC7\u671F\u7684\u5012\u8BA1\u65F6\uFF0C\u9ED8\u8BA4\u4E3A true */\n hideWhenExpired?: boolean\n /** \u662F\u5426\u663E\u793A\u5929\u6570\uFF0C\u9ED8\u8BA4\u4E3A true */\n showDays?: boolean\n /** \u662F\u5426\u663E\u793A\u5C0F\u65F6\uFF0C\u9ED8\u8BA4\u4E3A true */\n showHours?: boolean\n /** \u662F\u5426\u663E\u793A\u5206\u949F\uFF0C\u9ED8\u8BA4\u4E3A true */\n showMinutes?: boolean\n /** \u662F\u5426\u663E\u793A\u79D2\u6570\uFF0C\u9ED8\u8BA4\u4E3A true */\n showSeconds?: boolean\n /** \u989C\u8272\u4E3B\u9898 - \u8986\u76D6 variant \u7684\u989C\u8272\u90E8\u5206\uFF0C\u4FDD\u7559\u5E03\u5C40/\u5C3A\u5BF8\u3002\u4E0D\u4F20\u5219\u4FDD\u6301 variant \u539F\u6709\u989C\u8272 */\n theme?: 'light' | 'dark'\n}\n\n/**\n * \u6570\u5B57\u8865\u96F6\u51FD\u6570\n */\nconst pad = (n: number, len = 2) => String(Math.abs(n)).padStart(len, '0')\n\n/**\n * \u9ED8\u8BA4\u65F6\u95F4\u6807\u7B7E\n */\nconst getDefaultTimeLabels = (): TimeLabels => ({\n day: 'Day',\n hour: 'Hours',\n minute: 'Mins',\n second: 'Secs',\n})\n\n/**\n * \u5C06 plural/singular \u6DF7\u5408\u6807\u7B7E\u89C4\u8303\u5316\u4E3A singular \u683C\u5F0F\n * singular \u952E\u4F18\u5148\u4E8E plural \u952E\uFF0C\u7F3A\u5931\u65F6\u4F7F\u7528\u9ED8\u8BA4\u503C\n */\nconst resolveTimeLabels = (labels: TimeLabelsInput): TimeLabels => {\n const defaults = getDefaultTimeLabels()\n return {\n day: labels.day ?? labels.days ?? defaults.day,\n hour: labels.hour ?? labels.hours ?? defaults.hour,\n minute: labels.minute ?? labels.minutes ?? defaults.minute,\n second: labels.second ?? labels.seconds ?? defaults.second,\n }\n}\n\n/**\n * \u89E3\u6790dateFormat JSON\u5B57\u7B26\u4E32\uFF08\u5411\u540E\u517C\u5BB9\uFF09\n */\nconst safeStringToObject = (str: string): TimeLabelsInput => {\n try {\n let jsonStr = str?.trim?.()\n if (!jsonStr?.startsWith?.('{') || !jsonStr?.endsWith?.('}')) {\n return {}\n }\n jsonStr = jsonStr?.replace?.(/(\\w+)\\s*:/g, '\"$1\":')\n return JSON.parse(jsonStr) as TimeLabelsInput\n } catch (err) {\n return {}\n }\n}\n\n/**\n * Countdown - \u5012\u8BA1\u65F6\u539F\u5B50\u7EC4\u4EF6\n *\n * @description \u7528\u4E8E\u663E\u793A\u5012\u8BA1\u65F6\u7684\u7EC4\u4EF6\uFF0C\u652F\u6301\u5929\u3001\u65F6\u3001\u5206\u3001\u79D2\u663E\u793A\uFF0C\u652F\u6301\u591A\u79CD\u6837\u5F0F\u53D8\u4F53\u3001\u4E3B\u9898\u548C\u5355\u4F4D\u53EF\u89C1\u6027\u63A7\u5236\n */\nconst Countdown = React.forwardRef<HTMLDivElement, CountdownProps>(\n (\n {\n className,\n endDate,\n endDate_tz,\n locale,\n timeLabels,\n dateFormat,\n onExpire,\n separator = ':',\n hideWhenExpired = true,\n showDays = true,\n showHours = true,\n showMinutes = true,\n showSeconds = true,\n variant,\n align,\n theme,\n ...props\n },\n ref\n ) => {\n // \u786E\u5B9A\u6700\u7EC8\u4F7F\u7528\u7684\u65F6\u95F4\u6807\u7B7E (\u652F\u6301 plural \u548C singular \u952E)\n const finalTimeLabels = useMemo(() => {\n if (timeLabels) return resolveTimeLabels(timeLabels)\n if (dateFormat) return resolveTimeLabels(safeStringToObject(dateFormat))\n return getDefaultTimeLabels()\n }, [timeLabels, dateFormat])\n\n // \u89E3\u6790\u76EE\u6807\u65F6\u95F4\n const targetMsRef = useRef<number>(Date.parse(endDate))\n const [remainingMs, setRemainingMs] = useState<number>(() => {\n const t = targetMsRef.current\n return isNaN(t) ? 0 : Math.max(0, t - Date.now())\n })\n\n // \u5224\u65AD\u662F\u5426\u5DF2\u8FC7\u671F\n const [isExpired, setIsExpired] = useState<boolean>(() => {\n const t = targetMsRef.current\n return !isNaN(t) && t <= Date.now()\n })\n\n // \u5F53endDate\u6539\u53D8\u65F6\u66F4\u65B0\u76EE\u6807\u65F6\u95F4\n useEffect(() => {\n targetMsRef.current = Date.parse(endDate)\n const t = targetMsRef.current\n const newRemaining = isNaN(t) ? 0 : Math.max(0, t - Date.now())\n const newIsExpired = !isNaN(t) && t <= Date.now()\n\n setRemainingMs(newRemaining)\n setIsExpired(newIsExpired)\n }, [endDate])\n\n // \u542F\u52A8\u5012\u8BA1\u65F6\u5B9A\u65F6\u5668\n useEffect(() => {\n if (isExpired) return // \u5DF2\u8FC7\u671F\u5219\u4E0D\u542F\u52A8\n if (isNaN(targetMsRef.current)) return // \u65E0\u6548\u65E5\u671F\u4E0D\u542F\u52A8\n\n let expiredCalled = false\n const tick = () => {\n const now = Date.now()\n const remaining = Math.max(0, targetMsRef.current - now)\n setRemainingMs(remaining)\n\n if (remaining <= 0 && !expiredCalled) {\n expiredCalled = true\n setIsExpired(true)\n onExpire?.()\n }\n }\n\n tick() // \u7ACB\u5373\u6267\u884C\u4E00\u6B21\n const intervalId = window.setInterval(tick, 1000)\n\n return () => clearInterval(intervalId)\n }, [onExpire, isExpired, endDate])\n\n // \u8BA1\u7B97\u65F6\u95F4\u5355\u4F4D\n const totalSeconds = Math.floor(remainingMs / 1000)\n const seconds = totalSeconds % 60\n const totalMinutes = Math.floor(totalSeconds / 60)\n const minutes = totalMinutes % 60\n const totalHours = Math.floor(totalMinutes / 60)\n const hours = totalHours % 24\n const days = Math.floor(totalHours / 24)\n\n // \u6784\u5EFA\u53EF\u89C1\u7684\u65F6\u95F4\u5355\u4F4D\u6570\u7EC4\n const units: Array<{ value: number; label: string; cssClass: string }> = []\n if (showDays) units.push({ value: days, label: finalTimeLabels.day, cssClass: 'time-days-box' })\n if (showHours) units.push({ value: hours, label: finalTimeLabels.hour, cssClass: 'time-hours-box' })\n if (showMinutes) units.push({ value: minutes, label: finalTimeLabels.minute, cssClass: 'time-minutes-box' })\n if (showSeconds) units.push({ value: seconds, label: finalTimeLabels.second, cssClass: 'time-seconds-box' })\n\n // \u6784\u5EFA\u52A8\u6001 aria-label\n const ariaLabelParts: string[] = []\n if (showDays) ariaLabelParts.push(`${days} days`)\n if (showHours) ariaLabelParts.push(`${pad(hours)} hours`)\n if (showMinutes) ariaLabelParts.push(`${pad(minutes)} minutes`)\n if (showSeconds) ariaLabelParts.push(`${pad(seconds)} seconds`)\n const ariaLabel = ariaLabelParts.length > 0 ? `${ariaLabelParts.join(' ')} remaining` : 'countdown timer'\n\n // \u5982\u679C\u5DF2\u8FC7\u671F\u4E14\u9700\u8981\u9690\u85CF\uFF0C\u4EC5\u4FDD\u7559 screen reader \u901A\u77E5\n if (isExpired && hideWhenExpired) {\n return (\n <span role=\"status\" aria-live=\"polite\" className=\"sr-only\">\n Countdown has ended\n </span>\n )\n }\n\n const timeBlockTheme = getTimeBlockThemeClasses(theme)\n const separatorTheme = getSeparatorThemeClasses(theme)\n\n return (\n <div\n ref={ref}\n className={cn(countdownVariants({ variant, align }), className)}\n role=\"timer\"\n aria-label={ariaLabel}\n {...props}\n >\n {units.map((unit, index) => (\n <React.Fragment key={unit.cssClass}>\n <div className={cn(timeBlockVariants({ variant }), timeBlockTheme, unit.cssClass)}>\n <div className={timeNumberVariants()}>{pad(unit.value, 2)}</div>\n <div className=\"truncate text-center text-[12px] font-bold\">{unit.label}</div>\n </div>\n {index < units.length - 1 && (\n <div className={cn(separatorVariants({ variant }), separatorTheme)}>{separator}</div>\n )}\n </React.Fragment>\n ))}\n {/* Visually hidden status for screen readers - announces only on expiry */}\n {isExpired && (\n <span role=\"status\" aria-live=\"polite\" className=\"sr-only\">\n Countdown has ended\n </span>\n )}\n </div>\n )\n }\n)\n\nCountdown.displayName = 'Countdown'\n\nexport default Countdown\n"],
5
- "mappings": "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",
6
- "names": ["Countdown_exports", "__export", "Countdown_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_class_variance_authority", "import_helpers", "countdownVariants", "timeBlockVariants", "timeNumberVariants", "separatorVariants", "getTimeBlockThemeClasses", "theme", "getSeparatorThemeClasses", "pad", "n", "len", "getDefaultTimeLabels", "resolveTimeLabels", "labels", "defaults", "safeStringToObject", "str", "jsonStr", "Countdown", "React", "className", "endDate", "endDate_tz", "locale", "timeLabels", "dateFormat", "onExpire", "separator", "hideWhenExpired", "showDays", "showHours", "showMinutes", "showSeconds", "variant", "align", "props", "ref", "finalTimeLabels", "targetMsRef", "remainingMs", "setRemainingMs", "t", "isExpired", "setIsExpired", "newRemaining", "newIsExpired", "expiredCalled", "tick", "now", "remaining", "intervalId", "totalSeconds", "seconds", "totalMinutes", "minutes", "totalHours", "hours", "days", "units", "ariaLabelParts", "ariaLabel", "timeBlockTheme", "separatorTheme", "unit", "index"]
4
+ "sourcesContent": ["'use client'\n\nimport React, { useEffect, useRef, useState, useMemo } from 'react'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { cn } from '../helpers/index.js'\n\n// \u5B9A\u4E49\u6837\u5F0F\u53D8\u4F53\nconst countdownVariants = cva(\n // \u57FA\u7840\u6837\u5F0F\uFF1A\u5012\u8BA1\u65F6\u5BB9\u5668\n 'countdown-container flex w-full items-center',\n {\n variants: {\n variant: {\n outline: 'gap-1',\n spacious: 'gap-1',\n },\n align: {\n left: 'justify-start',\n center: 'justify-center',\n },\n },\n defaultVariants: {\n variant: 'outline',\n align: 'left',\n },\n }\n)\n\nconst timeBlockVariants = cva(\n // \u57FA\u7840\u6837\u5F0F\uFF1A\u65F6\u95F4\u5757\n 'time-block border-box rounded-box-small flex flex-col items-center justify-center overflow-hidden text-center text-xs',\n {\n variants: {\n variant: {\n outline:\n 'border-info-primary text-info-primary desktop:size-12 desktop:p-1 size-10 border bg-transparent p-[2px]',\n spacious: 'bg-info-white text-info-primary desktop:size-12 desktop:p-1 size-10 p-[2px]',\n },\n },\n defaultVariants: {\n variant: 'outline',\n },\n }\n)\n\nconst timeNumberVariants = cva(\n 'time-number lg-desktop:text-[24px] translate-y-[2px] whitespace-nowrap text-center text-[20px] font-bold leading-none'\n)\n\nconst separatorVariants = cva(\n // \u57FA\u7840\u6837\u5F0F\uFF1A\u5206\u9694\u7B26\n 'separator desktop:text-2xl text-xl font-bold',\n {\n variants: {\n variant: {\n outline: 'text-info-primary',\n spacious: 'text-info-primary',\n },\n },\n defaultVariants: {\n variant: 'outline',\n },\n }\n)\n\n/**\n * \u4E3B\u9898\u8272\u8986\u76D6\u7C7B - \u4EC5\u5F53 theme \u4F20\u5165\u65F6\u8986\u76D6 variant \u7684\u989C\u8272\u90E8\u5206\uFF0C\u4FDD\u7559\u5E03\u5C40/\u5C3A\u5BF8\n */\nconst getTimeBlockThemeClasses = (theme?: 'light' | 'dark'): string => {\n if (!theme) return ''\n return theme === 'light'\n ? 'bg-info-primary text-info-white border-transparent'\n : 'bg-container-secondary text-info-primary border-transparent'\n}\n\nconst getSeparatorThemeClasses = (theme?: 'light' | 'dark'): string => {\n if (!theme) return ''\n return 'text-info-primary'\n}\n\n/**\n * \u65F6\u95F4\u6807\u7B7E\u914D\u7F6E\u63A5\u53E3 (singular keys)\n */\nexport interface TimeLabels {\n /** \u5929\u7684\u6807\u7B7E */\n day: string\n /** \u5C0F\u65F6\u7684\u6807\u7B7E */\n hour: string\n /** \u5206\u949F\u7684\u6807\u7B7E */\n minute: string\n /** \u79D2\u7684\u6807\u7B7E */\n second: string\n}\n\n/**\n * \u65F6\u95F4\u6807\u7B7E\u914D\u7F6E\u63A5\u53E3 (plural keys, e.g. from Title component)\n */\nexport interface PluralTimeLabels {\n days: string\n hours: string\n minutes: string\n seconds: string\n}\n\n/**\n * \u65F6\u95F4\u6807\u7B7E\u8F93\u5165\u7C7B\u578B - \u652F\u6301 singular \u548C plural \u952E\u540D\uFF0C\u6240\u6709\u5B57\u6BB5\u53EF\u9009\n */\nexport type TimeLabelsInput = Partial<TimeLabels & PluralTimeLabels>\n\n/**\n * \u5012\u8BA1\u65F6\u7EC4\u4EF6Props\u63A5\u53E3\n */\nexport interface CountdownProps\n extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onExpire'>, VariantProps<typeof countdownVariants> {\n /** \u7ED3\u675F\u65F6\u95F4 - ISO\u683C\u5F0F\u5B57\u7B26\u4E32 */\n endDate: string\n /** \u7ED3\u675F\u65F6\u95F4\u65F6\u533A\uFF0C\u5982: America/Los_Angeles */\n endDate_tz?: string\n /** \u683C\u5F0F\u5316\u7528\u7684locale\uFF0C\u9ED8\u8BA4\u4F7F\u7528navigator.language */\n locale?: string\n /** \u65F6\u95F4\u6807\u7B7E\u914D\u7F6E\uFF0C\u652F\u6301 singular (day/hour/minute/second) \u548C plural (days/hours/minutes/seconds) \u952E\u540D */\n timeLabels?: TimeLabelsInput\n /** JSON\u5B57\u7B26\u4E32\u683C\u5F0F\u7684\u65F6\u95F4\u6807\u7B7E\uFF08\u5411\u540E\u517C\u5BB9\uFF09 */\n dateFormat?: string\n /** \u5012\u8BA1\u65F6\u7ED3\u675F\u56DE\u8C03 */\n onExpire?: () => void\n /** \u5206\u9694\u7B26\u5B57\u7B26\uFF0C\u9ED8\u8BA4\u4E3A ':' */\n separator?: string\n /** \u9690\u85CF\u5DF2\u8FC7\u671F\u7684\u5012\u8BA1\u65F6\uFF0C\u9ED8\u8BA4\u4E3A true */\n hideWhenExpired?: boolean\n /** \u662F\u5426\u663E\u793A\u5929\u6570\uFF0C\u9ED8\u8BA4\u4E3A true */\n showDays?: boolean\n /** \u662F\u5426\u663E\u793A\u5C0F\u65F6\uFF0C\u9ED8\u8BA4\u4E3A true */\n showHours?: boolean\n /** \u662F\u5426\u663E\u793A\u5206\u949F\uFF0C\u9ED8\u8BA4\u4E3A true */\n showMinutes?: boolean\n /** \u662F\u5426\u663E\u793A\u79D2\u6570\uFF0C\u9ED8\u8BA4\u4E3A true */\n showSeconds?: boolean\n /** \u989C\u8272\u4E3B\u9898 - \u8986\u76D6 variant \u7684\u989C\u8272\u90E8\u5206\uFF0C\u4FDD\u7559\u5E03\u5C40/\u5C3A\u5BF8\u3002\u4E0D\u4F20\u5219\u4FDD\u6301 variant \u539F\u6709\u989C\u8272 */\n theme?: 'light' | 'dark'\n}\n\n/**\n * \u6570\u5B57\u8865\u96F6\u51FD\u6570\n */\nconst pad = (n: number, len = 2) => String(Math.abs(n)).padStart(len, '0')\n\n/**\n * \u9ED8\u8BA4\u65F6\u95F4\u6807\u7B7E\n */\nconst getDefaultTimeLabels = (): TimeLabels => ({\n day: 'Day',\n hour: 'Hours',\n minute: 'Mins',\n second: 'Secs',\n})\n\n/**\n * \u5C06 plural/singular \u6DF7\u5408\u6807\u7B7E\u89C4\u8303\u5316\u4E3A singular \u683C\u5F0F\n * singular \u952E\u4F18\u5148\u4E8E plural \u952E\uFF0C\u7F3A\u5931\u65F6\u4F7F\u7528\u9ED8\u8BA4\u503C\n */\nconst resolveTimeLabels = (labels: TimeLabelsInput): TimeLabels => {\n const defaults = getDefaultTimeLabels()\n return {\n day: labels.day ?? labels.days ?? defaults.day,\n hour: labels.hour ?? labels.hours ?? defaults.hour,\n minute: labels.minute ?? labels.minutes ?? defaults.minute,\n second: labels.second ?? labels.seconds ?? defaults.second,\n }\n}\n\n/**\n * \u89E3\u6790dateFormat JSON\u5B57\u7B26\u4E32\uFF08\u5411\u540E\u517C\u5BB9\uFF09\n */\nconst safeStringToObject = (str: string): TimeLabelsInput => {\n try {\n let jsonStr = str?.trim?.()\n if (!jsonStr?.startsWith?.('{') || !jsonStr?.endsWith?.('}')) {\n return {}\n }\n jsonStr = jsonStr?.replace?.(/(\\w+)\\s*:/g, '\"$1\":')\n return JSON.parse(jsonStr) as TimeLabelsInput\n } catch (err) {\n return {}\n }\n}\n\n/**\n * Countdown - \u5012\u8BA1\u65F6\u539F\u5B50\u7EC4\u4EF6\n *\n * @description \u7528\u4E8E\u663E\u793A\u5012\u8BA1\u65F6\u7684\u7EC4\u4EF6\uFF0C\u652F\u6301\u5929\u3001\u65F6\u3001\u5206\u3001\u79D2\u663E\u793A\uFF0C\u652F\u6301\u591A\u79CD\u6837\u5F0F\u53D8\u4F53\u3001\u4E3B\u9898\u548C\u5355\u4F4D\u53EF\u89C1\u6027\u63A7\u5236\n */\nconst Countdown = React.forwardRef<HTMLDivElement, CountdownProps>(\n (\n {\n className,\n endDate,\n endDate_tz,\n locale,\n timeLabels,\n dateFormat,\n onExpire,\n separator = ':',\n hideWhenExpired = true,\n showDays = true,\n showHours = true,\n showMinutes = true,\n showSeconds = true,\n variant,\n align,\n theme,\n ...props\n },\n ref\n ) => {\n // \u786E\u5B9A\u6700\u7EC8\u4F7F\u7528\u7684\u65F6\u95F4\u6807\u7B7E (\u652F\u6301 plural \u548C singular \u952E)\n const finalTimeLabels = useMemo(() => {\n if (timeLabels) return resolveTimeLabels(timeLabels)\n if (dateFormat) return resolveTimeLabels(safeStringToObject(dateFormat))\n return getDefaultTimeLabels()\n }, [timeLabels, dateFormat])\n\n // \u89E3\u6790\u76EE\u6807\u65F6\u95F4\n const targetMsRef = useRef<number>(Date.parse(endDate))\n const [remainingMs, setRemainingMs] = useState<number>(() => {\n const t = targetMsRef.current\n return isNaN(t) ? 0 : Math.max(0, t - Date.now())\n })\n\n // \u5224\u65AD\u662F\u5426\u5DF2\u8FC7\u671F\n const [isExpired, setIsExpired] = useState<boolean>(() => {\n const t = targetMsRef.current\n return !isNaN(t) && t <= Date.now()\n })\n\n // \u5F53endDate\u6539\u53D8\u65F6\u66F4\u65B0\u76EE\u6807\u65F6\u95F4\n useEffect(() => {\n targetMsRef.current = Date.parse(endDate)\n const t = targetMsRef.current\n const newRemaining = isNaN(t) ? 0 : Math.max(0, t - Date.now())\n const newIsExpired = !isNaN(t) && t <= Date.now()\n\n setRemainingMs(newRemaining)\n setIsExpired(newIsExpired)\n }, [endDate])\n\n useEffect(() => {\n if (isExpired) return\n if (isNaN(targetMsRef.current)) return\n\n let expiredCalled = false\n let rafId: number = 0\n let lastSecond = -1\n\n const tick = () => {\n const now = Date.now()\n const remaining = Math.max(0, targetMsRef.current - now)\n const currentSecond = Math.floor(remaining / 1000)\n\n if (currentSecond !== lastSecond) {\n lastSecond = currentSecond\n setRemainingMs(remaining)\n\n if (remaining <= 0 && !expiredCalled) {\n expiredCalled = true\n setIsExpired(true)\n onExpire?.()\n return\n }\n }\n\n rafId = requestAnimationFrame(tick)\n }\n\n rafId = requestAnimationFrame(tick)\n return () => cancelAnimationFrame(rafId)\n }, [onExpire, isExpired, endDate])\n\n // \u8BA1\u7B97\u65F6\u95F4\u5355\u4F4D\n const totalSeconds = Math.floor(remainingMs / 1000)\n const seconds = totalSeconds % 60\n const totalMinutes = Math.floor(totalSeconds / 60)\n const minutes = totalMinutes % 60\n const totalHours = Math.floor(totalMinutes / 60)\n const hours = totalHours % 24\n const days = Math.floor(totalHours / 24)\n\n // \u6784\u5EFA\u53EF\u89C1\u7684\u65F6\u95F4\u5355\u4F4D\u6570\u7EC4\n const units: Array<{ value: number; label: string; cssClass: string }> = []\n if (showDays) units.push({ value: days, label: finalTimeLabels.day, cssClass: 'time-days-box' })\n if (showHours) units.push({ value: hours, label: finalTimeLabels.hour, cssClass: 'time-hours-box' })\n if (showMinutes) units.push({ value: minutes, label: finalTimeLabels.minute, cssClass: 'time-minutes-box' })\n if (showSeconds) units.push({ value: seconds, label: finalTimeLabels.second, cssClass: 'time-seconds-box' })\n\n // \u6784\u5EFA\u52A8\u6001 aria-label\n const ariaLabelParts: string[] = []\n if (showDays) ariaLabelParts.push(`${days} days`)\n if (showHours) ariaLabelParts.push(`${pad(hours)} hours`)\n if (showMinutes) ariaLabelParts.push(`${pad(minutes)} minutes`)\n if (showSeconds) ariaLabelParts.push(`${pad(seconds)} seconds`)\n const ariaLabel = ariaLabelParts.length > 0 ? `${ariaLabelParts.join(' ')} remaining` : 'countdown timer'\n\n // \u5982\u679C\u5DF2\u8FC7\u671F\u4E14\u9700\u8981\u9690\u85CF\uFF0C\u4EC5\u4FDD\u7559 screen reader \u901A\u77E5\n if (isExpired && hideWhenExpired) {\n return (\n <span role=\"status\" aria-live=\"polite\" className=\"sr-only\">\n Countdown has ended\n </span>\n )\n }\n\n const timeBlockTheme = getTimeBlockThemeClasses(theme)\n const separatorTheme = getSeparatorThemeClasses(theme)\n\n return (\n <div\n ref={ref}\n className={cn(countdownVariants({ variant, align }), className)}\n role=\"timer\"\n aria-label={ariaLabel}\n {...props}\n >\n {units.map((unit, index) => (\n <React.Fragment key={unit.cssClass}>\n <div className={cn(timeBlockVariants({ variant }), timeBlockTheme, unit.cssClass)}>\n <div className={timeNumberVariants()}>{pad(unit.value, 2)}</div>\n <div className=\"truncate text-center text-[12px] font-bold\">{unit.label}</div>\n </div>\n {index < units.length - 1 && (\n <div className={cn(separatorVariants({ variant }), separatorTheme)}>{separator}</div>\n )}\n </React.Fragment>\n ))}\n {/* Visually hidden status for screen readers - announces only on expiry */}\n {isExpired && (\n <span role=\"status\" aria-live=\"polite\" className=\"sr-only\">\n Countdown has ended\n </span>\n )}\n </div>\n )\n }\n)\n\nCountdown.displayName = 'Countdown'\n\nexport default Countdown\n"],
5
+ "mappings": "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",
6
+ "names": ["Countdown_exports", "__export", "Countdown_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_class_variance_authority", "import_helpers", "countdownVariants", "timeBlockVariants", "timeNumberVariants", "separatorVariants", "getTimeBlockThemeClasses", "theme", "getSeparatorThemeClasses", "pad", "n", "len", "getDefaultTimeLabels", "resolveTimeLabels", "labels", "defaults", "safeStringToObject", "str", "jsonStr", "Countdown", "React", "className", "endDate", "endDate_tz", "locale", "timeLabels", "dateFormat", "onExpire", "separator", "hideWhenExpired", "showDays", "showHours", "showMinutes", "showSeconds", "variant", "align", "props", "ref", "finalTimeLabels", "targetMsRef", "remainingMs", "setRemainingMs", "t", "isExpired", "setIsExpired", "newRemaining", "newIsExpired", "expiredCalled", "rafId", "lastSecond", "tick", "now", "remaining", "currentSecond", "totalSeconds", "seconds", "totalMinutes", "minutes", "totalHours", "hours", "days", "units", "ariaLabelParts", "ariaLabel", "timeBlockTheme", "separatorTheme", "unit", "index"]
7
7
  }
package/dist/cjs/components/tabs.js CHANGED
@@ -1,2 +1,2 @@
1
- "use strict";"use client";var N=Object.create;var p=Object.defineProperty;var w=Object.getOwnPropertyDescriptor;var W=Object.getOwnPropertyNames;var E=Object.getPrototypeOf,k=Object.prototype.hasOwnProperty;var S=(t,e)=>{for(var a in e)p(t,a,{get:e[a],enumerable:!0})},R=(t,e,a,s)=>{if(e&&typeof e=="object"||typeof e=="function")for(let o of W(e))!k.call(t,o)&&o!==a&&p(t,o,{get:()=>e[o],enumerable:!(s=w(e,o))||s.enumerable});return t};var y=(t,e,a)=>(a=t!=null?N(E(t)):{},R(e||!t||!t.__esModule?p(a,"default",{value:t,enumerable:!0}):a,t)),A=t=>R(p({},"__esModule",{value:!0}),t);var j={};S(j,{Tabs:()=>u,TabsContent:()=>T,TabsList:()=>g,TabsTrigger:()=>h});module.exports=A(j);var r=require("react/jsx-runtime"),i=y(require("react")),l=require("../helpers/index.js"),n=y(require("@radix-ui/react-tabs")),b=require("class-variance-authority");const c=i.createContext({align:"left",shape:"square"}),u=i.forwardRef(({children:t,align:e="left",shape:a="default",...s},o)=>(0,r.jsx)(n.Root,{ref:o,...s,children:(0,r.jsx)(c.Provider,{value:{align:e,shape:a},children:t})}));u.displayName="Tabs";const F=(0,b.cva)("rounded-tabs",{variants:{align:{left:"justify-left",center:"justify-center",right:"justify-end"},shape:{default:"",rounded:"rounded-[28px]",square:"rounded-none"}},defaultVariants:{align:"left",shape:"default"}}),V=(0,b.cva)("rounded-tabs",{variants:{shape:{default:"",rounded:"rounded-[28px]",square:"rounded-none"}},defaultVariants:{shape:"default"}}),g=i.forwardRef(({className:t,...e},a)=>{const{align:s,shape:o}=i.useContext(c);return(0,r.jsx)(n.List,{ref:a,className:(0,l.cn)("bg-tabs-list-bg flex w-fit max-w-full overflow-x-auto p-1",F({align:s,shape:o}),t),style:{scrollbarWidth:"none",msOverflowStyle:"none"},...e})});g.displayName=n.List.displayName;const h=i.forwardRef(({className:t,onClick:e,...a},s)=>{const{shape:o}=i.useContext(c),v=f=>{e?.(f);const d=f?.currentTarget,m=f?.currentTarget?.parentElement;if(d&&m){const x=d.offsetLeft,P=d.offsetWidth,C=m.offsetWidth,L=x-C/2+P/2;m.scrollTo({left:L,behavior:"smooth"})}};return(0,r.jsx)(n.Trigger,{ref:s,className:(0,l.cn)("text-info-primary lg-desktop:text-base disabled:text-btn-secondary-disabled lg-desktop:px-[28px] lg-desktop:pt-[15px] lg-desktop:pb-[14px] shrink-0 px-5 pb-2.5 pt-[11px] text-sm font-bold data-[state=active]:bg-white data-[state=active]:text-[#080A0F]",t,V({shape:o})),onClick:v,...a})});h.displayName=n.Trigger.displayName;const T=i.forwardRef(({className:t,...e},a)=>(0,r.jsx)(n.Content,{ref:a,className:(0,l.cn)(t),...e}));T.displayName=n.Content.displayName;
1
+ "use strict";"use client";var L=Object.create;var f=Object.defineProperty;var N=Object.getOwnPropertyDescriptor;var W=Object.getOwnPropertyNames;var E=Object.getPrototypeOf,k=Object.prototype.hasOwnProperty;var S=(t,e)=>{for(var a in e)f(t,a,{get:e[a],enumerable:!0})},v=(t,e,a,o)=>{if(e&&typeof e=="object"||typeof e=="function")for(let s of W(e))!k.call(t,s)&&s!==a&&f(t,s,{get:()=>e[s],enumerable:!(o=N(e,s))||o.enumerable});return t};var y=(t,e,a)=>(a=t!=null?L(E(t)):{},v(e||!t||!t.__esModule?f(a,"default",{value:t,enumerable:!0}):a,t)),A=t=>v(f({},"__esModule",{value:!0}),t);var q={};S(q,{Tabs:()=>h,TabsContent:()=>R,TabsList:()=>g,TabsTrigger:()=>T});module.exports=A(q);var i=require("react/jsx-runtime"),r=y(require("react")),d=require("../helpers/index.js"),n=y(require("@radix-ui/react-tabs")),u=require("class-variance-authority");const b=r.createContext({align:"left",shape:"square"}),h=r.forwardRef(({children:t,align:e="left",shape:a="default",...o},s)=>(0,i.jsx)(n.Root,{ref:s,...o,children:(0,i.jsx)(b.Provider,{value:{align:e,shape:a},children:t})}));h.displayName="Tabs";const F=(0,u.cva)("rounded-tabs",{variants:{shape:{default:"",rounded:"rounded-[28px]",square:"rounded-none"}},defaultVariants:{shape:"default"}}),V=(0,u.cva)("rounded-tabs",{variants:{shape:{default:"",rounded:"rounded-[28px]",square:"rounded-none"}},defaultVariants:{shape:"default"}}),g=r.forwardRef(({className:t,...e},a)=>{const{align:o,shape:s}=r.useContext(b),p=o==="center"?"flex w-full justify-center":o==="right"?"flex w-full justify-end":null,l=(0,i.jsx)(n.List,{ref:a,className:(0,d.cn)("bg-tabs-list-bg flex w-fit max-w-full overflow-x-auto p-1",F({shape:s}),t),style:{scrollbarWidth:"none",msOverflowStyle:"none"},...e});return p?(0,i.jsx)("div",{className:p,children:l}):l});g.displayName=n.List.displayName;const T=r.forwardRef(({className:t,onClick:e,...a},o)=>{const{shape:s}=r.useContext(b),p=l=>{e?.(l);const c=l?.currentTarget,m=l?.currentTarget?.parentElement;if(c&&m){const x=c.offsetLeft,P=c.offsetWidth,C=m.offsetWidth,w=x-C/2+P/2;m.scrollTo({left:w,behavior:"smooth"})}};return(0,i.jsx)(n.Trigger,{ref:o,className:(0,d.cn)("text-info-primary lg-desktop:text-base disabled:text-btn-secondary-disabled lg-desktop:px-[28px] lg-desktop:pt-[15px] lg-desktop:pb-[14px] shrink-0 px-5 pb-2.5 pt-[11px] text-sm font-bold data-[state=active]:bg-white data-[state=active]:text-[#080A0F]",t,V({shape:s})),onClick:p,...a})});T.displayName=n.Trigger.displayName;const R=r.forwardRef(({className:t,...e},a)=>(0,i.jsx)(n.Content,{ref:a,className:(0,d.cn)(t),...e}));R.displayName=n.Content.displayName;
2
2
  //# sourceMappingURL=tabs.js.map
package/dist/cjs/components/tabs.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/components/tabs.tsx"],
4
- "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../helpers/index.js'\n\nimport * as TabsPrimitive from '@radix-ui/react-tabs'\nimport { cva } from 'class-variance-authority'\nimport type { Align, Shape } from '../types/props.js'\n\ntype tabShape = Shape | 'default'\n\nconst TabListContext = React.createContext<{\n align?: Align\n shape: tabShape\n}>({\n align: 'left',\n shape: 'square',\n})\n\nconst Tabs = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.Root>,\n React.ComponentPropsWithoutRef<typeof TabsPrimitive.Root> & {\n align?: Align\n shape?: tabShape\n }\n>(({ children, align = 'left', shape = 'default', ...props }, ref) => (\n <TabsPrimitive.Root ref={ref} {...props}>\n <TabListContext.Provider value={{ align, shape }}>{children}</TabListContext.Provider>\n </TabsPrimitive.Root>\n))\nTabs.displayName = 'Tabs'\n\nconst tabsListVariants = cva('rounded-tabs', {\n variants: {\n align: {\n left: 'justify-left',\n center: 'justify-center',\n right: 'justify-end',\n },\n shape: {\n default: '',\n rounded: 'rounded-[28px]',\n square: 'rounded-none',\n },\n },\n defaultVariants: {\n align: 'left',\n shape: 'default',\n },\n})\n\nconst tabsTriggerVariants = cva('rounded-tabs', {\n variants: {\n shape: {\n default: '',\n rounded: 'rounded-[28px]',\n square: 'rounded-none',\n },\n },\n defaultVariants: {\n shape: 'default',\n },\n})\nconst TabsList = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.List>,\n React.ComponentPropsWithoutRef<typeof TabsPrimitive.List>\n>(({ className, ...props }, ref) => {\n const { align: alignFromParent, shape: shapeFromParent } = React.useContext(TabListContext)\n return (\n <TabsPrimitive.List\n ref={ref}\n className={cn(\n 'bg-tabs-list-bg flex w-fit max-w-full overflow-x-auto p-1',\n tabsListVariants({\n align: alignFromParent,\n shape: shapeFromParent,\n }),\n className\n )}\n style={{\n scrollbarWidth: 'none',\n msOverflowStyle: 'none',\n }}\n {...props}\n />\n )\n})\nTabsList.displayName = TabsPrimitive.List.displayName\n\nconst TabsTrigger = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.Trigger>,\n React.ComponentPropsWithoutRef<typeof TabsPrimitive.Trigger>\n>(({ className, onClick, ...props }, ref) => {\n const { shape: shapeFromParent } = React.useContext(TabListContext)\n const handleClick = (e: React.MouseEvent<HTMLButtonElement>) => {\n onClick?.(e)\n const tabElement = e?.currentTarget\n const container = e?.currentTarget?.parentElement\n if (tabElement && container) {\n const tabLeft = tabElement.offsetLeft\n const tabWidth = tabElement.offsetWidth\n const containerWidth = container.offsetWidth\n const scrollTo = tabLeft - containerWidth / 2 + tabWidth / 2\n container.scrollTo({\n left: scrollTo,\n behavior: 'smooth',\n })\n }\n }\n return (\n <TabsPrimitive.Trigger\n ref={ref}\n className={cn(\n 'text-info-primary lg-desktop:text-base disabled:text-btn-secondary-disabled lg-desktop:px-[28px] lg-desktop:pt-[15px] lg-desktop:pb-[14px] shrink-0 px-5 pb-2.5 pt-[11px] text-sm font-bold data-[state=active]:bg-white data-[state=active]:text-[#080A0F]',\n className,\n tabsTriggerVariants({\n shape: shapeFromParent,\n })\n )}\n onClick={handleClick}\n {...props}\n />\n )\n})\nTabsTrigger.displayName = TabsPrimitive.Trigger.displayName\n\nconst TabsContent = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.Content>,\n React.ComponentPropsWithoutRef<typeof TabsPrimitive.Content>\n>(({ className, ...props }, ref) => <TabsPrimitive.Content ref={ref} className={cn(className)} {...props} />)\nTabsContent.displayName = TabsPrimitive.Content.displayName\n\nexport { Tabs, TabsList, TabsTrigger, TabsContent }\n"],
5
- "mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,UAAAE,EAAA,gBAAAC,EAAA,aAAAC,EAAA,gBAAAC,IAAA,eAAAC,EAAAN,GA2BI,IAAAO,EAAA,6BAzBJC,EAAuB,oBACvBC,EAAmB,+BAEnBC,EAA+B,mCAC/BC,EAAoB,oCAKpB,MAAMC,EAAiBJ,EAAM,cAG1B,CACD,MAAO,OACP,MAAO,QACT,CAAC,EAEKN,EAAOM,EAAM,WAMjB,CAAC,CAAE,SAAAK,EAAU,MAAAC,EAAQ,OAAQ,MAAAC,EAAQ,UAAW,GAAGC,CAAM,EAAGC,OAC5D,OAACP,EAAc,KAAd,CAAmB,IAAKO,EAAM,GAAGD,EAChC,mBAACJ,EAAe,SAAf,CAAwB,MAAO,CAAE,MAAAE,EAAO,MAAAC,CAAM,EAAI,SAAAF,EAAS,EAC9D,CACD,EACDX,EAAK,YAAc,OAEnB,MAAMgB,KAAmB,OAAI,eAAgB,CAC3C,SAAU,CACR,MAAO,CACL,KAAM,eACN,OAAQ,iBACR,MAAO,aACT,EACA,MAAO,CACL,QAAS,GACT,QAAS,iBACT,OAAQ,cACV,CACF,EACA,gBAAiB,CACf,MAAO,OACP,MAAO,SACT,CACF,CAAC,EAEKC,KAAsB,OAAI,eAAgB,CAC9C,SAAU,CACR,MAAO,CACL,QAAS,GACT,QAAS,iBACT,OAAQ,cACV,CACF,EACA,gBAAiB,CACf,MAAO,SACT,CACF,CAAC,EACKf,EAAWI,EAAM,WAGrB,CAAC,CAAE,UAAAY,EAAW,GAAGJ,CAAM,EAAGC,IAAQ,CAClC,KAAM,CAAE,MAAOI,EAAiB,MAAOC,CAAgB,EAAId,EAAM,WAAWI,CAAc,EAC1F,SACE,OAACF,EAAc,KAAd,CACC,IAAKO,EACL,aAAW,MACT,4DACAC,EAAiB,CACf,MAAOG,EACP,MAAOC,CACT,CAAC,EACDF,CACF,EACA,MAAO,CACL,eAAgB,OAChB,gBAAiB,MACnB,EACC,GAAGJ,EACN,CAEJ,CAAC,EACDZ,EAAS,YAAcM,EAAc,KAAK,YAE1C,MAAML,EAAcG,EAAM,WAGxB,CAAC,CAAE,UAAAY,EAAW,QAAAG,EAAS,GAAGP,CAAM,EAAGC,IAAQ,CAC3C,KAAM,CAAE,MAAOK,CAAgB,EAAId,EAAM,WAAWI,CAAc,EAC5DY,EAAeC,GAA2C,CAC9DF,IAAUE,CAAC,EACX,MAAMC,EAAaD,GAAG,cAChBE,EAAYF,GAAG,eAAe,cACpC,GAAIC,GAAcC,EAAW,CAC3B,MAAMC,EAAUF,EAAW,WACrBG,EAAWH,EAAW,YACtBI,EAAiBH,EAAU,YAC3BI,EAAWH,EAAUE,EAAiB,EAAID,EAAW,EAC3DF,EAAU,SAAS,CACjB,KAAMI,EACN,SAAU,QACZ,CAAC,CACH,CACF,EACA,SACE,OAACrB,EAAc,QAAd,CACC,IAAKO,EACL,aAAW,MACT,8PACAG,EACAD,EAAoB,CAClB,MAAOG,CACT,CAAC,CACH,EACA,QAASE,EACR,GAAGR,EACN,CAEJ,CAAC,EACDX,EAAY,YAAcK,EAAc,QAAQ,YAEhD,MAAMP,EAAcK,EAAM,WAGxB,CAAC,CAAE,UAAAY,EAAW,GAAGJ,CAAM,EAAGC,OAAQ,OAACP,EAAc,QAAd,CAAsB,IAAKO,EAAK,aAAW,MAAGG,CAAS,EAAI,GAAGJ,EAAO,CAAE,EAC5Gb,EAAY,YAAcO,EAAc,QAAQ",
6
- "names": ["tabs_exports", "__export", "Tabs", "TabsContent", "TabsList", "TabsTrigger", "__toCommonJS", "import_jsx_runtime", "React", "import_helpers", "TabsPrimitive", "import_class_variance_authority", "TabListContext", "children", "align", "shape", "props", "ref", "tabsListVariants", "tabsTriggerVariants", "className", "alignFromParent", "shapeFromParent", "onClick", "handleClick", "e", "tabElement", "container", "tabLeft", "tabWidth", "containerWidth", "scrollTo"]
4
+ "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../helpers/index.js'\n\nimport * as TabsPrimitive from '@radix-ui/react-tabs'\nimport { cva } from 'class-variance-authority'\nimport type { Align, Shape } from '../types/props.js'\n\ntype tabShape = Shape | 'default'\n\nconst TabListContext = React.createContext<{\n align?: Align\n shape: tabShape\n}>({\n align: 'left',\n shape: 'square',\n})\n\nconst Tabs = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.Root>,\n React.ComponentPropsWithoutRef<typeof TabsPrimitive.Root> & {\n align?: Align\n shape?: tabShape\n }\n>(({ children, align = 'left', shape = 'default', ...props }, ref) => (\n <TabsPrimitive.Root ref={ref} {...props}>\n <TabListContext.Provider value={{ align, shape }}>{children}</TabListContext.Provider>\n </TabsPrimitive.Root>\n))\nTabs.displayName = 'Tabs'\n\nconst tabsListVariants = cva('rounded-tabs', {\n variants: {\n shape: {\n default: '',\n rounded: 'rounded-[28px]',\n square: 'rounded-none',\n },\n },\n defaultVariants: {\n shape: 'default',\n },\n})\n\nconst tabsTriggerVariants = cva('rounded-tabs', {\n variants: {\n shape: {\n default: '',\n rounded: 'rounded-[28px]',\n square: 'rounded-none',\n },\n },\n defaultVariants: {\n shape: 'default',\n },\n})\nconst TabsList = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.List>,\n React.ComponentPropsWithoutRef<typeof TabsPrimitive.List>\n>(({ className, ...props }, ref) => {\n const { align: alignFromParent, shape: shapeFromParent } = React.useContext(TabListContext)\n\n const wrapperClass =\n alignFromParent === 'center'\n ? 'flex w-full justify-center'\n : alignFromParent === 'right'\n ? 'flex w-full justify-end'\n : null\n\n const list = (\n <TabsPrimitive.List\n ref={ref}\n className={cn(\n 'bg-tabs-list-bg flex w-fit max-w-full overflow-x-auto p-1',\n tabsListVariants({ shape: shapeFromParent }),\n className\n )}\n style={{\n scrollbarWidth: 'none',\n msOverflowStyle: 'none',\n }}\n {...props}\n />\n )\n\n return wrapperClass ? <div className={wrapperClass}>{list}</div> : list\n})\nTabsList.displayName = TabsPrimitive.List.displayName\n\nconst TabsTrigger = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.Trigger>,\n React.ComponentPropsWithoutRef<typeof TabsPrimitive.Trigger>\n>(({ className, onClick, ...props }, ref) => {\n const { shape: shapeFromParent } = React.useContext(TabListContext)\n const handleClick = (e: React.MouseEvent<HTMLButtonElement>) => {\n onClick?.(e)\n const tabElement = e?.currentTarget\n const container = e?.currentTarget?.parentElement\n if (tabElement && container) {\n const tabLeft = tabElement.offsetLeft\n const tabWidth = tabElement.offsetWidth\n const containerWidth = container.offsetWidth\n const scrollTo = tabLeft - containerWidth / 2 + tabWidth / 2\n container.scrollTo({\n left: scrollTo,\n behavior: 'smooth',\n })\n }\n }\n return (\n <TabsPrimitive.Trigger\n ref={ref}\n className={cn(\n 'text-info-primary lg-desktop:text-base disabled:text-btn-secondary-disabled lg-desktop:px-[28px] lg-desktop:pt-[15px] lg-desktop:pb-[14px] shrink-0 px-5 pb-2.5 pt-[11px] text-sm font-bold data-[state=active]:bg-white data-[state=active]:text-[#080A0F]',\n className,\n tabsTriggerVariants({\n shape: shapeFromParent,\n })\n )}\n onClick={handleClick}\n {...props}\n />\n )\n})\nTabsTrigger.displayName = TabsPrimitive.Trigger.displayName\n\nconst TabsContent = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.Content>,\n React.ComponentPropsWithoutRef<typeof TabsPrimitive.Content>\n>(({ className, ...props }, ref) => <TabsPrimitive.Content ref={ref} className={cn(className)} {...props} />)\nTabsContent.displayName = TabsPrimitive.Content.displayName\n\nexport { Tabs, TabsList, TabsTrigger, TabsContent }\n"],
5
+ "mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,UAAAE,EAAA,gBAAAC,EAAA,aAAAC,EAAA,gBAAAC,IAAA,eAAAC,EAAAN,GA2BI,IAAAO,EAAA,6BAzBJC,EAAuB,oBACvBC,EAAmB,+BAEnBC,EAA+B,mCAC/BC,EAAoB,oCAKpB,MAAMC,EAAiBJ,EAAM,cAG1B,CACD,MAAO,OACP,MAAO,QACT,CAAC,EAEKN,EAAOM,EAAM,WAMjB,CAAC,CAAE,SAAAK,EAAU,MAAAC,EAAQ,OAAQ,MAAAC,EAAQ,UAAW,GAAGC,CAAM,EAAGC,OAC5D,OAACP,EAAc,KAAd,CAAmB,IAAKO,EAAM,GAAGD,EAChC,mBAACJ,EAAe,SAAf,CAAwB,MAAO,CAAE,MAAAE,EAAO,MAAAC,CAAM,EAAI,SAAAF,EAAS,EAC9D,CACD,EACDX,EAAK,YAAc,OAEnB,MAAMgB,KAAmB,OAAI,eAAgB,CAC3C,SAAU,CACR,MAAO,CACL,QAAS,GACT,QAAS,iBACT,OAAQ,cACV,CACF,EACA,gBAAiB,CACf,MAAO,SACT,CACF,CAAC,EAEKC,KAAsB,OAAI,eAAgB,CAC9C,SAAU,CACR,MAAO,CACL,QAAS,GACT,QAAS,iBACT,OAAQ,cACV,CACF,EACA,gBAAiB,CACf,MAAO,SACT,CACF,CAAC,EACKf,EAAWI,EAAM,WAGrB,CAAC,CAAE,UAAAY,EAAW,GAAGJ,CAAM,EAAGC,IAAQ,CAClC,KAAM,CAAE,MAAOI,EAAiB,MAAOC,CAAgB,EAAId,EAAM,WAAWI,CAAc,EAEpFW,EACJF,IAAoB,SAChB,6BACAA,IAAoB,QAClB,0BACA,KAEFG,KACJ,OAACd,EAAc,KAAd,CACC,IAAKO,EACL,aAAW,MACT,4DACAC,EAAiB,CAAE,MAAOI,CAAgB,CAAC,EAC3CF,CACF,EACA,MAAO,CACL,eAAgB,OAChB,gBAAiB,MACnB,EACC,GAAGJ,EACN,EAGF,OAAOO,KAAe,OAAC,OAAI,UAAWA,EAAe,SAAAC,EAAK,EAASA,CACrE,CAAC,EACDpB,EAAS,YAAcM,EAAc,KAAK,YAE1C,MAAML,EAAcG,EAAM,WAGxB,CAAC,CAAE,UAAAY,EAAW,QAAAK,EAAS,GAAGT,CAAM,EAAGC,IAAQ,CAC3C,KAAM,CAAE,MAAOK,CAAgB,EAAId,EAAM,WAAWI,CAAc,EAC5Dc,EAAeC,GAA2C,CAC9DF,IAAUE,CAAC,EACX,MAAMC,EAAaD,GAAG,cAChBE,EAAYF,GAAG,eAAe,cACpC,GAAIC,GAAcC,EAAW,CAC3B,MAAMC,EAAUF,EAAW,WACrBG,EAAWH,EAAW,YACtBI,EAAiBH,EAAU,YAC3BI,EAAWH,EAAUE,EAAiB,EAAID,EAAW,EAC3DF,EAAU,SAAS,CACjB,KAAMI,EACN,SAAU,QACZ,CAAC,CACH,CACF,EACA,SACE,OAACvB,EAAc,QAAd,CACC,IAAKO,EACL,aAAW,MACT,8PACAG,EACAD,EAAoB,CAClB,MAAOG,CACT,CAAC,CACH,EACA,QAASI,EACR,GAAGV,EACN,CAEJ,CAAC,EACDX,EAAY,YAAcK,EAAc,QAAQ,YAEhD,MAAMP,EAAcK,EAAM,WAGxB,CAAC,CAAE,UAAAY,EAAW,GAAGJ,CAAM,EAAGC,OAAQ,OAACP,EAAc,QAAd,CAAsB,IAAKO,EAAK,aAAW,MAAGG,CAAS,EAAI,GAAGJ,EAAO,CAAE,EAC5Gb,EAAY,YAAcO,EAAc,QAAQ",
6
+ "names": ["tabs_exports", "__export", "Tabs", "TabsContent", "TabsList", "TabsTrigger", "__toCommonJS", "import_jsx_runtime", "React", "import_helpers", "TabsPrimitive", "import_class_variance_authority", "TabListContext", "children", "align", "shape", "props", "ref", "tabsListVariants", "tabsTriggerVariants", "className", "alignFromParent", "shapeFromParent", "wrapperClass", "list", "onClick", "handleClick", "e", "tabElement", "container", "tabLeft", "tabWidth", "containerWidth", "scrollTo"]
7
7
  }
package/dist/esm/biz-components/AnchorNavigation/index.js CHANGED
@@ -1,2 +1,2 @@
1
- "use client";import{jsx as p}from"react/jsx-runtime";import*as r from"react";import{cn as g}from"../../helpers/utils.js";import{cva as h}from"class-variance-authority";import w from"./useAnchorPosition.js";import{Container as L}from"../../components/container.js";import{withLayout as S}from"../../shared/Styles.js";const D=h("anchor-navigation-content flex items-center overflow-x-auto [&::-webkit-scrollbar]:hidden",{variants:{alignment:{start:"tablet:justify-start",center:"tablet:justify-center",end:"tablet:justify-end"},size:{small:"gap-3",large:"gap-6"}},defaultVariants:{alignment:"start",size:"small"}}),E=h("anchor-navigation-item relative shrink-0 text-sm font-bold after:absolute after:bottom-0 after:left-0 after:h-1 after:w-0 after:opacity-0 after:transition-all after:duration-300",{variants:{size:{small:"py-3",large:"py-4"}},defaultVariants:{size:"small"}}),H=h("!sticky top-0 !z-40 w-full",{variants:{theme:{light:"bg-white",dark:"bg-[#1E2024]"}},defaultVariants:{theme:"light"}}),k={defaultColor:"text-[#4A4C56]",activeColor:"text-[#080A0F]",activeIndicatorColor:"after:bg-brand-0"},B={defaultColor:"text-[#8A8D92]",activeColor:"text-white",activeIndicatorColor:"after:bg-brand-0"},y=r.forwardRef(({classNames:l={},data:a,onItemClick:I,buttonStyle:s,className:V,...N},R)=>{const{alignment:x="start",theme:C="light",size:A="small"}=a,i=w(a.sectionIds?.map(t=>t.targetId)||[]),c=r.useRef(null),f=r.useRef(null),b=r.useRef([]);r.useImperativeHandle(R,()=>c.current);const u=C==="dark"?B:k,d={defaultColor:s?.defaultColor??u.defaultColor,activeColor:s?.activeColor??u.activeColor,activeIndicatorColor:s?.activeIndicatorColor??u.activeIndicatorColor},m=r.useCallback(t=>{const e=b.current[t];if(e&&f.current){const n=f.current,o=e,v=o.offsetLeft-n.offsetWidth/2+o.offsetWidth/2;typeof n.scrollTo=="function"&&n.scrollTo({left:v,behavior:"smooth"})}},[]);return r.useEffect(()=>{if(!i)return;const t=a.sectionIds?.findIndex(e=>e.targetId===i);t!==void 0&&t!==-1&&m(t)},[i,a.sectionIds,m]),p(L,{ref:c,className:g(H({theme:C}),l?.root),...N,children:p("div",{ref:f,className:g(D({alignment:x,size:A}),"relative",l?.content),children:a.sectionIds?.map((t,e)=>{const n=i===t.targetId;return p("button",{ref:o=>{o&&(b.current[e]=o)},"aria-current":n?!0:void 0,onClick:()=>{if(m(e),I){I(t,e);return}const o=document.getElementById(t.targetId);if(o&&c.current){const v=c.current.offsetHeight,T=o.getBoundingClientRect().top+window.scrollY-v;window.scrollTo({top:T,behavior:"smooth"})}},className:g(E({size:A}),n?[d.activeColor,d.activeIndicatorColor,"after:w-full after:opacity-100"]:d.defaultColor,l?.item),children:t.label},t.targetId)})})})});y.displayName="AnchorNavigation";var j=S(y);export{j as default};
1
+ "use client";import{jsx as p}from"react/jsx-runtime";import*as r from"react";import{cn as g}from"../../helpers/utils.js";import{cva as h}from"class-variance-authority";import L from"./useAnchorPosition.js";import{Container as S}from"../../components/container.js";import{withLayout as D}from"../../shared/Styles.js";const E=h("anchor-navigation-content flex items-center overflow-x-auto [&::-webkit-scrollbar]:hidden",{variants:{alignment:{start:"tablet:justify-start",center:"tablet:justify-center",end:"tablet:justify-end"},size:{small:"gap-3",large:"gap-6"}},defaultVariants:{alignment:"start",size:"small"}}),H=h("anchor-navigation-item relative shrink-0 text-sm font-bold after:absolute after:bottom-0 after:left-0 after:h-1 after:w-0 after:opacity-0 after:transition-all after:duration-300",{variants:{size:{small:"py-3",large:"py-4"}},defaultVariants:{size:"small"}}),k=h("!sticky top-0 !z-40 w-full",{variants:{theme:{light:"!bg-white",dark:"!bg-[#1E2024]"}},defaultVariants:{theme:"light"}}),B={defaultColor:"text-[#4A4C56]",activeColor:"text-[#080A0F]",activeIndicatorColor:"after:bg-brand-0"},V={defaultColor:"text-[#8A8D92]",activeColor:"text-white",activeIndicatorColor:"after:bg-brand-0"},y=r.forwardRef(({classNames:l={},data:a,onItemClick:I,buttonStyle:s,className:R,...N},x)=>{const{alignment:T="start",theme:C="light",size:A="small"}=a,i=L(a.sectionIds?.map(t=>t.targetId)||[]),c=r.useRef(null),f=r.useRef(null),b=r.useRef([]);r.useImperativeHandle(x,()=>c.current);const u=C==="dark"?V:B,d={defaultColor:s?.defaultColor??u.defaultColor,activeColor:s?.activeColor??u.activeColor,activeIndicatorColor:s?.activeIndicatorColor??u.activeIndicatorColor},m=r.useCallback(t=>{const e=b.current[t];if(e&&f.current){const n=f.current,o=e,v=o.offsetLeft-n.offsetWidth/2+o.offsetWidth/2;typeof n.scrollTo=="function"&&n.scrollTo({left:v,behavior:"smooth"})}},[]);return r.useEffect(()=>{if(!i)return;const t=a.sectionIds?.findIndex(e=>e.targetId===i);t!==void 0&&t!==-1&&m(t)},[i,a.sectionIds,m]),p(S,{ref:c,className:g(k({theme:C}),R,l?.root),...N,children:p("div",{ref:f,className:g(E({alignment:T,size:A}),"relative",l?.content),children:a.sectionIds?.map((t,e)=>{const n=i===t.targetId;return p("button",{ref:o=>{o&&(b.current[e]=o)},"aria-current":n?!0:void 0,onClick:()=>{if(m(e),I){I(t,e);return}const o=document.getElementById(t.targetId);if(o&&c.current){const v=c.current.offsetHeight,w=o.getBoundingClientRect().top+window.scrollY-v;window.scrollTo({top:w,behavior:"smooth"})}},className:g(H({size:A}),n?[d.activeColor,d.activeIndicatorColor,"after:w-full after:opacity-100"]:d.defaultColor,l?.item),children:t.label},t.targetId)})})})});y.displayName="AnchorNavigation";var j=D(y);export{j as default};
2
2
  //# sourceMappingURL=index.js.map
package/dist/esm/biz-components/AnchorNavigation/index.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/AnchorNavigation/index.tsx"],
4
- "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport useAnchorPosition from './useAnchorPosition.js'\nimport { Container } from '../../components/container.js'\nimport { withLayout } from '../../shared/Styles.js'\n\nexport interface AnchorNavigationSemanticName {\n root: 'root'\n content: 'content'\n item: 'item'\n}\n\n/**\n * \u5BFC\u822A\u9879\u5BF9\u9F50\u65B9\u5411\u6837\u5F0F\u53D8\u4F53\n */\nconst anchorNavigationVariants = cva(\n 'anchor-navigation-content flex items-center overflow-x-auto [&::-webkit-scrollbar]:hidden',\n {\n variants: {\n alignment: {\n start: 'tablet:justify-start',\n center: 'tablet:justify-center',\n end: 'tablet:justify-end',\n },\n size: {\n small: 'gap-3',\n large: 'gap-6',\n },\n },\n defaultVariants: {\n alignment: 'start',\n size: 'small',\n },\n }\n)\n\n/**\n * \u5BFC\u822A\u9879\u6837\u5F0F\u53D8\u4F53\uFF08\u4E0D\u542B\u989C\u8272\uFF0C\u989C\u8272\u7531 buttonStyle \u63A7\u5236\uFF09\n */\nconst anchorItemVariants = cva(\n 'anchor-navigation-item relative shrink-0 text-sm font-bold after:absolute after:bottom-0 after:left-0 after:h-1 after:w-0 after:opacity-0 after:transition-all after:duration-300',\n {\n variants: {\n size: {\n small: 'py-3',\n large: 'py-4',\n },\n },\n defaultVariants: {\n size: 'small',\n },\n }\n)\n\n/**\n * \u5BB9\u5668\u4E3B\u9898\u6837\u5F0F\u53D8\u4F53\n */\nconst containerVariants = cva('!sticky top-0 !z-40 w-full', {\n variants: {\n theme: {\n light: 'bg-white',\n dark: 'bg-[#1E2024]',\n },\n },\n defaultVariants: {\n theme: 'light',\n },\n})\n\n/**\n * \u6309\u94AE\u989C\u8272\u914D\u7F6E\uFF0C\u5141\u8BB8\u6309 theme \u5206\u522B\u8986\u76D6\u9ED8\u8BA4\u8272\u3001\u6FC0\u6D3B\u6587\u5B57\u8272\u3001\u6FC0\u6D3B\u6307\u793A\u5668\u8272\n */\nexport interface AnchorButtonStyle {\n /** \u9ED8\u8BA4\uFF08\u672A\u6FC0\u6D3B\uFF09\u6587\u5B57\u8272\uFF0CTailwind class\uFF0C\u5982 'text-info-secondary' */\n defaultColor?: string\n /** \u6FC0\u6D3B\u6587\u5B57\u8272\uFF0CTailwind class\uFF0C\u5982 'text-info-primary' */\n activeColor?: string\n /** \u6FC0\u6D3B\u6307\u793A\u5668\uFF08\u4E0B\u5212\u7EBF\uFF09\u80CC\u666F\u8272\uFF0CTailwind class\uFF0C\u5982 'after:bg-brand-0' */\n activeIndicatorColor?: string\n}\n\n/**\n * \u951A\u70B9\u9879\u63A5\u53E3\n */\nexport interface AnchorSectionItem {\n targetId: string\n label: string\n}\n\n/**\n * AnchorNavigation \u4E1A\u52A1\u7EC4\u4EF6\u6570\u636E\u63A5\u53E3\n */\nexport interface AnchorNavigationData {\n /** \u951A\u70B9\u5217\u8868 */\n sectionIds: AnchorSectionItem[]\n /** \u5BFC\u822A\u9879\u6C34\u5E73\u5BF9\u9F50\u65B9\u5F0F */\n alignment?: 'start' | 'center' | 'end'\n /** \u4E3B\u9898\u6A21\u5F0F */\n theme?: 'light' | 'dark'\n /** \u5BFC\u822A\u5927\u5C0F */\n size?: 'small' | 'large'\n}\n\nexport interface AnchorNavigationProps\n extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof anchorNavigationVariants> {\n /** \u4E1A\u52A1\u6570\u636E */\n data: AnchorNavigationData\n /** \u8BED\u4E49\u5316\u7C7B\u540D */\n classNames?: Partial<Record<keyof AnchorNavigationSemanticName, string>>\n /** \u81EA\u5B9A\u4E49\u70B9\u51FB\u4E8B\u4EF6\uFF0C\u4F20\u5165\u65F6\u4F1A\u66FF\u4EE3\u9ED8\u8BA4\u7684\u6EDA\u52A8\u884C\u4E3A */\n onItemClick?: (item: AnchorSectionItem, index: number) => void\n /**\n * \u6309\u94AE\u989C\u8272\u914D\u7F6E\uFF0C\u8986\u76D6 light/dark \u4E3B\u9898\u4E0B\u7684\u9ED8\u8BA4\u989C\u8272\u3002\n * \u672A\u4F20\u65F6\u6309\u4E3B\u9898\u4F7F\u7528\u5185\u7F6E\u9ED8\u8BA4\u503C\u3002\n *\n * @example\n * // \u81EA\u5B9A\u4E49\u989C\u8272\n * buttonStyle={{ defaultColor: 'text-info-secondary', activeColor: 'text-info-primary', activeIndicatorColor: 'after:bg-brand-3' }}\n */\n buttonStyle?: AnchorButtonStyle\n}\n\n/** light \u4E3B\u9898\u9ED8\u8BA4\u989C\u8272 */\nconst LIGHT_DEFAULTS: Required<AnchorButtonStyle> = {\n defaultColor: 'text-[#4A4C56]',\n activeColor: 'text-[#080A0F]',\n activeIndicatorColor: 'after:bg-brand-0',\n}\n\n/** dark \u4E3B\u9898\u9ED8\u8BA4\u989C\u8272 */\nconst DARK_DEFAULTS: Required<AnchorButtonStyle> = {\n defaultColor: 'text-[#8A8D92]',\n activeColor: 'text-white',\n activeIndicatorColor: 'after:bg-brand-0',\n}\n\n/**\n * AnchorNavigation - \u951A\u70B9\u5BFC\u822A\n *\n * @description \u951A\u70B9\u5BFC\u822A\n */\nconst AnchorNavigation = React.forwardRef<HTMLDivElement, AnchorNavigationProps>(\n ({ classNames = {}, data, onItemClick, buttonStyle, className, ...rest }, ref) => {\n const { alignment = 'start', theme = 'light', size = 'small' } = data\n const activeId = useAnchorPosition(data.sectionIds?.map(item => item.targetId) || [])\n const rootRef = React.useRef<HTMLDivElement>(null)\n const containerRef = React.useRef<HTMLDivElement>(null)\n const sectionRefs = React.useRef<HTMLButtonElement[]>([])\n\n // \u66B4\u9732 rootRef \u7ED9\u5916\u90E8 ref\n React.useImperativeHandle(ref, () => rootRef.current as HTMLDivElement)\n\n // \u5408\u5E76\u4E3B\u9898\u9ED8\u8BA4\u503C\u4E0E\u5916\u90E8\u4F20\u5165\u7684 buttonStyle\n const themeDefaults = theme === 'dark' ? DARK_DEFAULTS : LIGHT_DEFAULTS\n const resolvedButtonStyle: Required<AnchorButtonStyle> = {\n defaultColor: buttonStyle?.defaultColor ?? themeDefaults.defaultColor,\n activeColor: buttonStyle?.activeColor ?? themeDefaults.activeColor,\n activeIndicatorColor: buttonStyle?.activeIndicatorColor ?? themeDefaults.activeIndicatorColor,\n }\n\n const autoScrollToActiveItem = React.useCallback((activeIdIndex: number) => {\n const curRef = sectionRefs.current[activeIdIndex]\n\n if (curRef && containerRef.current) {\n const container = containerRef.current\n const button = curRef\n const scrollLeft = button.offsetLeft - container.offsetWidth / 2 + button.offsetWidth / 2\n\n // \u68C0\u67E5 scrollTo \u65B9\u6CD5\u662F\u5426\u5B58\u5728\uFF08\u517C\u5BB9\u6D4B\u8BD5\u73AF\u5883\u548C\u65E7\u6D4F\u89C8\u5668\uFF09\n if (typeof container.scrollTo === 'function') {\n container.scrollTo({\n left: scrollLeft,\n behavior: 'smooth',\n })\n }\n }\n }, [])\n\n // \u5F53\u5C4F\u5E55\u6EDA\u52A8\u5BFC\u81F4 activeId \u53D8\u5316\u65F6\uFF0C\u81EA\u52A8\u6EDA\u52A8\u5BFC\u822A\u680F\u5230\u5BF9\u5E94\u9879\n React.useEffect(() => {\n if (!activeId) return\n\n const activeIndex = data.sectionIds?.findIndex(item => item.targetId === activeId)\n if (activeIndex !== undefined && activeIndex !== -1) {\n autoScrollToActiveItem(activeIndex)\n }\n }, [activeId, data.sectionIds, autoScrollToActiveItem])\n\n return (\n <Container ref={rootRef} className={cn(containerVariants({ theme }), classNames?.root)} {...rest}>\n <div\n ref={containerRef}\n className={cn(anchorNavigationVariants({ alignment, size }), 'relative', classNames?.content)}\n >\n {data.sectionIds?.map((item, index) => {\n const isActive = activeId === item.targetId\n\n return (\n <button\n key={item.targetId}\n ref={el => {\n if (el) {\n sectionRefs.current[index] = el\n }\n }}\n aria-current={isActive ? true : undefined}\n onClick={() => {\n // \u9ED8\u8BA4\u884C\u4E3A\uFF1A\u6EDA\u52A8\u5230\u5BF9\u5E94\u951A\u70B9\n autoScrollToActiveItem(index)\n\n // \u5982\u679C\u6709\u81EA\u5B9A\u4E49\u70B9\u51FB\u4E8B\u4EF6\uFF0C\u4F7F\u7528\u81EA\u5B9A\u4E49\u4E8B\u4EF6\n if (onItemClick) {\n onItemClick(item, index)\n return\n }\n\n // \u624B\u52A8\u8BA1\u7B97\u6EDA\u52A8\u4F4D\u7F6E\uFF0C\u8003\u8651\u5BFC\u822A\u680F\u9AD8\u5EA6\n const targetElement = document.getElementById(item.targetId)\n if (targetElement && rootRef.current) {\n const navHeight = rootRef.current.offsetHeight\n const targetPosition = targetElement.getBoundingClientRect().top + window.scrollY - navHeight\n\n window.scrollTo({\n top: targetPosition,\n behavior: 'smooth',\n })\n }\n }}\n className={cn(\n anchorItemVariants({ size }),\n isActive\n ? [\n resolvedButtonStyle.activeColor,\n resolvedButtonStyle.activeIndicatorColor,\n 'after:w-full after:opacity-100',\n ]\n : resolvedButtonStyle.defaultColor,\n classNames?.item\n )}\n >\n {item.label}\n </button>\n )\n })}\n </div>\n </Container>\n )\n }\n)\n\nAnchorNavigation.displayName = 'AnchorNavigation'\nexport default withLayout(AnchorNavigation)\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../helpers/utils.js'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport useAnchorPosition from './useAnchorPosition.js'\nimport { Container } from '../../components/container.js'\nimport { withLayout } from '../../shared/Styles.js'\n\nexport interface AnchorNavigationSemanticName {\n root: 'root'\n content: 'content'\n item: 'item'\n}\n\n/**\n * \u5BFC\u822A\u9879\u5BF9\u9F50\u65B9\u5411\u6837\u5F0F\u53D8\u4F53\n */\nconst anchorNavigationVariants = cva(\n 'anchor-navigation-content flex items-center overflow-x-auto [&::-webkit-scrollbar]:hidden',\n {\n variants: {\n alignment: {\n start: 'tablet:justify-start',\n center: 'tablet:justify-center',\n end: 'tablet:justify-end',\n },\n size: {\n small: 'gap-3',\n large: 'gap-6',\n },\n },\n defaultVariants: {\n alignment: 'start',\n size: 'small',\n },\n }\n)\n\n/**\n * \u5BFC\u822A\u9879\u6837\u5F0F\u53D8\u4F53\uFF08\u4E0D\u542B\u989C\u8272\uFF0C\u989C\u8272\u7531 buttonStyle \u63A7\u5236\uFF09\n */\nconst anchorItemVariants = cva(\n 'anchor-navigation-item relative shrink-0 text-sm font-bold after:absolute after:bottom-0 after:left-0 after:h-1 after:w-0 after:opacity-0 after:transition-all after:duration-300',\n {\n variants: {\n size: {\n small: 'py-3',\n large: 'py-4',\n },\n },\n defaultVariants: {\n size: 'small',\n },\n }\n)\n\n/**\n * \u5BB9\u5668\u4E3B\u9898\u6837\u5F0F\u53D8\u4F53\n */\nconst containerVariants = cva('!sticky top-0 !z-40 w-full', {\n variants: {\n theme: {\n light: '!bg-white',\n dark: '!bg-[#1E2024]',\n },\n },\n defaultVariants: {\n theme: 'light',\n },\n})\n\n/**\n * \u6309\u94AE\u989C\u8272\u914D\u7F6E\uFF0C\u5141\u8BB8\u6309 theme \u5206\u522B\u8986\u76D6\u9ED8\u8BA4\u8272\u3001\u6FC0\u6D3B\u6587\u5B57\u8272\u3001\u6FC0\u6D3B\u6307\u793A\u5668\u8272\n */\nexport interface AnchorButtonStyle {\n /** \u9ED8\u8BA4\uFF08\u672A\u6FC0\u6D3B\uFF09\u6587\u5B57\u8272\uFF0CTailwind class\uFF0C\u5982 'text-info-secondary' */\n defaultColor?: string\n /** \u6FC0\u6D3B\u6587\u5B57\u8272\uFF0CTailwind class\uFF0C\u5982 'text-info-primary' */\n activeColor?: string\n /** \u6FC0\u6D3B\u6307\u793A\u5668\uFF08\u4E0B\u5212\u7EBF\uFF09\u80CC\u666F\u8272\uFF0CTailwind class\uFF0C\u5982 'after:bg-brand-0' */\n activeIndicatorColor?: string\n}\n\n/**\n * \u951A\u70B9\u9879\u63A5\u53E3\n */\nexport interface AnchorSectionItem {\n targetId: string\n label: string\n}\n\n/**\n * AnchorNavigation \u4E1A\u52A1\u7EC4\u4EF6\u6570\u636E\u63A5\u53E3\n */\nexport interface AnchorNavigationData {\n /** \u951A\u70B9\u5217\u8868 */\n sectionIds: AnchorSectionItem[]\n /** \u5BFC\u822A\u9879\u6C34\u5E73\u5BF9\u9F50\u65B9\u5F0F */\n alignment?: 'start' | 'center' | 'end'\n /** \u4E3B\u9898\u6A21\u5F0F */\n theme?: 'light' | 'dark'\n /** \u5BFC\u822A\u5927\u5C0F */\n size?: 'small' | 'large'\n}\n\nexport interface AnchorNavigationProps\n extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof anchorNavigationVariants> {\n /** \u4E1A\u52A1\u6570\u636E */\n data: AnchorNavigationData\n /** \u8BED\u4E49\u5316\u7C7B\u540D */\n classNames?: Partial<Record<keyof AnchorNavigationSemanticName, string>>\n /** \u81EA\u5B9A\u4E49\u70B9\u51FB\u4E8B\u4EF6\uFF0C\u4F20\u5165\u65F6\u4F1A\u66FF\u4EE3\u9ED8\u8BA4\u7684\u6EDA\u52A8\u884C\u4E3A */\n onItemClick?: (item: AnchorSectionItem, index: number) => void\n /**\n * \u6309\u94AE\u989C\u8272\u914D\u7F6E\uFF0C\u8986\u76D6 light/dark \u4E3B\u9898\u4E0B\u7684\u9ED8\u8BA4\u989C\u8272\u3002\n * \u672A\u4F20\u65F6\u6309\u4E3B\u9898\u4F7F\u7528\u5185\u7F6E\u9ED8\u8BA4\u503C\u3002\n *\n * @example\n * // \u81EA\u5B9A\u4E49\u989C\u8272\n * buttonStyle={{ defaultColor: 'text-info-secondary', activeColor: 'text-info-primary', activeIndicatorColor: 'after:bg-brand-3' }}\n */\n buttonStyle?: AnchorButtonStyle\n}\n\n/** light \u4E3B\u9898\u9ED8\u8BA4\u989C\u8272 */\nconst LIGHT_DEFAULTS: Required<AnchorButtonStyle> = {\n defaultColor: 'text-[#4A4C56]',\n activeColor: 'text-[#080A0F]',\n activeIndicatorColor: 'after:bg-brand-0',\n}\n\n/** dark \u4E3B\u9898\u9ED8\u8BA4\u989C\u8272 */\nconst DARK_DEFAULTS: Required<AnchorButtonStyle> = {\n defaultColor: 'text-[#8A8D92]',\n activeColor: 'text-white',\n activeIndicatorColor: 'after:bg-brand-0',\n}\n\n/**\n * AnchorNavigation - \u951A\u70B9\u5BFC\u822A\n *\n * @description \u951A\u70B9\u5BFC\u822A\n */\nconst AnchorNavigation = React.forwardRef<HTMLDivElement, AnchorNavigationProps>(\n ({ classNames = {}, data, onItemClick, buttonStyle, className, ...rest }, ref) => {\n const { alignment = 'start', theme = 'light', size = 'small' } = data\n const activeId = useAnchorPosition(data.sectionIds?.map(item => item.targetId) || [])\n const rootRef = React.useRef<HTMLDivElement>(null)\n const containerRef = React.useRef<HTMLDivElement>(null)\n const sectionRefs = React.useRef<HTMLButtonElement[]>([])\n\n // \u66B4\u9732 rootRef \u7ED9\u5916\u90E8 ref\n React.useImperativeHandle(ref, () => rootRef.current as HTMLDivElement)\n\n // \u5408\u5E76\u4E3B\u9898\u9ED8\u8BA4\u503C\u4E0E\u5916\u90E8\u4F20\u5165\u7684 buttonStyle\n const themeDefaults = theme === 'dark' ? DARK_DEFAULTS : LIGHT_DEFAULTS\n const resolvedButtonStyle: Required<AnchorButtonStyle> = {\n defaultColor: buttonStyle?.defaultColor ?? themeDefaults.defaultColor,\n activeColor: buttonStyle?.activeColor ?? themeDefaults.activeColor,\n activeIndicatorColor: buttonStyle?.activeIndicatorColor ?? themeDefaults.activeIndicatorColor,\n }\n\n const autoScrollToActiveItem = React.useCallback((activeIdIndex: number) => {\n const curRef = sectionRefs.current[activeIdIndex]\n\n if (curRef && containerRef.current) {\n const container = containerRef.current\n const button = curRef\n const scrollLeft = button.offsetLeft - container.offsetWidth / 2 + button.offsetWidth / 2\n\n // \u68C0\u67E5 scrollTo \u65B9\u6CD5\u662F\u5426\u5B58\u5728\uFF08\u517C\u5BB9\u6D4B\u8BD5\u73AF\u5883\u548C\u65E7\u6D4F\u89C8\u5668\uFF09\n if (typeof container.scrollTo === 'function') {\n container.scrollTo({\n left: scrollLeft,\n behavior: 'smooth',\n })\n }\n }\n }, [])\n\n // \u5F53\u5C4F\u5E55\u6EDA\u52A8\u5BFC\u81F4 activeId \u53D8\u5316\u65F6\uFF0C\u81EA\u52A8\u6EDA\u52A8\u5BFC\u822A\u680F\u5230\u5BF9\u5E94\u9879\n React.useEffect(() => {\n if (!activeId) return\n\n const activeIndex = data.sectionIds?.findIndex(item => item.targetId === activeId)\n if (activeIndex !== undefined && activeIndex !== -1) {\n autoScrollToActiveItem(activeIndex)\n }\n }, [activeId, data.sectionIds, autoScrollToActiveItem])\n\n return (\n <Container ref={rootRef} className={cn(containerVariants({ theme }), className, classNames?.root)} {...rest}>\n <div\n ref={containerRef}\n className={cn(anchorNavigationVariants({ alignment, size }), 'relative', classNames?.content)}\n >\n {data.sectionIds?.map((item, index) => {\n const isActive = activeId === item.targetId\n\n return (\n <button\n key={item.targetId}\n ref={el => {\n if (el) {\n sectionRefs.current[index] = el\n }\n }}\n aria-current={isActive ? true : undefined}\n onClick={() => {\n // \u9ED8\u8BA4\u884C\u4E3A\uFF1A\u6EDA\u52A8\u5230\u5BF9\u5E94\u951A\u70B9\n autoScrollToActiveItem(index)\n\n // \u5982\u679C\u6709\u81EA\u5B9A\u4E49\u70B9\u51FB\u4E8B\u4EF6\uFF0C\u4F7F\u7528\u81EA\u5B9A\u4E49\u4E8B\u4EF6\n if (onItemClick) {\n onItemClick(item, index)\n return\n }\n\n // \u624B\u52A8\u8BA1\u7B97\u6EDA\u52A8\u4F4D\u7F6E\uFF0C\u8003\u8651\u5BFC\u822A\u680F\u9AD8\u5EA6\n const targetElement = document.getElementById(item.targetId)\n if (targetElement && rootRef.current) {\n const navHeight = rootRef.current.offsetHeight\n const targetPosition = targetElement.getBoundingClientRect().top + window.scrollY - navHeight\n\n window.scrollTo({\n top: targetPosition,\n behavior: 'smooth',\n })\n }\n }}\n className={cn(\n anchorItemVariants({ size }),\n isActive\n ? [\n resolvedButtonStyle.activeColor,\n resolvedButtonStyle.activeIndicatorColor,\n 'after:w-full after:opacity-100',\n ]\n : resolvedButtonStyle.defaultColor,\n classNames?.item\n )}\n >\n {item.label}\n </button>\n )\n })}\n </div>\n </Container>\n )\n }\n)\n\nAnchorNavigation.displayName = 'AnchorNavigation'\nexport default withLayout(AnchorNavigation)\n"],
5
+ "mappings": "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",
6
6
  "names": ["jsx", "React", "cn", "cva", "useAnchorPosition", "Container", "withLayout", "anchorNavigationVariants", "anchorItemVariants", "containerVariants", "LIGHT_DEFAULTS", "DARK_DEFAULTS", "AnchorNavigation", "classNames", "data", "onItemClick", "buttonStyle", "className", "rest", "ref", "alignment", "theme", "size", "activeId", "item", "rootRef", "containerRef", "sectionRefs", "themeDefaults", "resolvedButtonStyle", "autoScrollToActiveItem", "activeIdIndex", "curRef", "container", "button", "scrollLeft", "activeIndex", "index", "isActive", "el", "targetElement", "navHeight", "targetPosition", "AnchorNavigation_default"]
7
7
  }
package/dist/esm/components/Countdown.js CHANGED
@@ -1,2 +1,2 @@
1
- "use client";import{jsx as i,jsxs as x}from"react/jsx-runtime";import R,{useEffect as z,useRef as U,useState as $,useMemo as X}from"react";import{cva as c}from"class-variance-authority";import{cn as g}from"../helpers/index.js";const Y=c("countdown-container flex w-full items-center",{variants:{variant:{outline:"gap-1",spacious:"gap-1"},align:{left:"justify-start",center:"justify-center"}},defaultVariants:{variant:"outline",align:"left"}}),Z=c("time-block border-box rounded-box-small flex flex-col items-center justify-center overflow-hidden text-center text-xs",{variants:{variant:{outline:"border-info-primary text-info-primary desktop:size-12 desktop:p-1 size-10 border bg-transparent p-[2px]",spacious:"bg-info-white text-info-primary desktop:size-12 desktop:p-1 size-10 p-[2px]"}},defaultVariants:{variant:"outline"}}),tt=c("time-number lg-desktop:text-[24px] translate-y-[2px] whitespace-nowrap text-center text-[20px] font-bold leading-none"),et=c("separator desktop:text-2xl text-xl font-bold",{variants:{variant:{outline:"text-info-primary",spacious:"text-info-primary"}},defaultVariants:{variant:"outline"}}),nt=t=>t?t==="light"?"bg-info-primary text-info-white border-transparent":"bg-container-secondary text-info-primary border-transparent":"",st=t=>t?"text-info-primary":"",d=(t,e=2)=>String(Math.abs(t)).padStart(e,"0"),j=()=>({day:"Day",hour:"Hours",minute:"Mins",second:"Secs"}),H=t=>{const e=j();return{day:t.day??t.days??e.day,hour:t.hour??t.hours??e.hour,minute:t.minute??t.minutes??e.minute,second:t.second??t.seconds??e.second}},rt=t=>{try{let e=t?.trim?.();return!e?.startsWith?.("{")||!e?.endsWith?.("}")?{}:(e=e?.replace?.(/(\w+)\s*:/g,'"$1":'),JSON.parse(e))}catch{return{}}},B=R.forwardRef(({className:t,endDate:e,endDate_tz:at,locale:ot,timeLabels:p,dateFormat:m,onExpire:h,separator:O=":",hideWhenExpired:W=!0,showDays:v=!0,showHours:y=!0,showMinutes:w=!0,showSeconds:T=!0,variant:f,align:A,theme:N,..._},F)=>{const l=X(()=>p?H(p):m?H(rt(m)):j(),[p,m]),s=U(Date.parse(e)),[J,L]=$(()=>{const n=s.current;return isNaN(n)?0:Math.max(0,n-Date.now())}),[u,M]=$(()=>{const n=s.current;return!isNaN(n)&&n<=Date.now()});z(()=>{s.current=Date.parse(e);const n=s.current,o=isNaN(n)?0:Math.max(0,n-Date.now()),b=!isNaN(n)&&n<=Date.now();L(o),M(b)},[e]),z(()=>{if(u||isNaN(s.current))return;let n=!1;const o=()=>{const Q=Date.now(),P=Math.max(0,s.current-Q);L(P),P<=0&&!n&&(n=!0,M(!0),h?.())};o();const b=window.setInterval(o,1e3);return()=>clearInterval(b)},[h,u,e]);const C=Math.floor(J/1e3),k=C%60,D=Math.floor(C/60),I=D%60,V=Math.floor(D/60),S=V%24,E=Math.floor(V/24),r=[];v&&r.push({value:E,label:l.day,cssClass:"time-days-box"}),y&&r.push({value:S,label:l.hour,cssClass:"time-hours-box"}),w&&r.push({value:I,label:l.minute,cssClass:"time-minutes-box"}),T&&r.push({value:k,label:l.second,cssClass:"time-seconds-box"});const a=[];v&&a.push(`${E} days`),y&&a.push(`${d(S)} hours`),w&&a.push(`${d(I)} minutes`),T&&a.push(`${d(k)} seconds`);const q=a.length>0?`${a.join(" ")} remaining`:"countdown timer";if(u&&W)return i("span",{role:"status","aria-live":"polite",className:"sr-only",children:"Countdown has ended"});const G=nt(N),K=st(N);return x("div",{ref:F,className:g(Y({variant:f,align:A}),t),role:"timer","aria-label":q,..._,children:[r.map((n,o)=>x(R.Fragment,{children:[x("div",{className:g(Z({variant:f}),G,n.cssClass),children:[i("div",{className:tt(),children:d(n.value,2)}),i("div",{className:"truncate text-center text-[12px] font-bold",children:n.label})]}),o<r.length-1&&i("div",{className:g(et({variant:f}),K),children:O})]},n.cssClass)),u&&i("span",{role:"status","aria-live":"polite",className:"sr-only",children:"Countdown has ended"})]})});B.displayName="Countdown";var ct=B;export{ct as default};
1
+ "use client";import{jsx as i,jsxs as x}from"react/jsx-runtime";import $,{useEffect as j,useRef as Y,useState as A,useMemo as Z}from"react";import{cva as d}from"class-variance-authority";import{cn as h}from"../helpers/index.js";const ee=d("countdown-container flex w-full items-center",{variants:{variant:{outline:"gap-1",spacious:"gap-1"},align:{left:"justify-start",center:"justify-center"}},defaultVariants:{variant:"outline",align:"left"}}),te=d("time-block border-box rounded-box-small flex flex-col items-center justify-center overflow-hidden text-center text-xs",{variants:{variant:{outline:"border-info-primary text-info-primary desktop:size-12 desktop:p-1 size-10 border bg-transparent p-[2px]",spacious:"bg-info-white text-info-primary desktop:size-12 desktop:p-1 size-10 p-[2px]"}},defaultVariants:{variant:"outline"}}),ne=d("time-number lg-desktop:text-[24px] translate-y-[2px] whitespace-nowrap text-center text-[20px] font-bold leading-none"),se=d("separator desktop:text-2xl text-xl font-bold",{variants:{variant:{outline:"text-info-primary",spacious:"text-info-primary"}},defaultVariants:{variant:"outline"}}),re=e=>e?e==="light"?"bg-info-primary text-info-white border-transparent":"bg-container-secondary text-info-primary border-transparent":"",ae=e=>e?"text-info-primary":"",m=(e,t=2)=>String(Math.abs(e)).padStart(t,"0"),H=()=>({day:"Day",hour:"Hours",minute:"Mins",second:"Secs"}),F=e=>{const t=H();return{day:e.day??e.days??t.day,hour:e.hour??e.hours??t.hour,minute:e.minute??e.minutes??t.minute,second:e.second??e.seconds??t.second}},oe=e=>{try{let t=e?.trim?.();return!t?.startsWith?.("{")||!t?.endsWith?.("}")?{}:(t=t?.replace?.(/(\w+)\s*:/g,'"$1":'),JSON.parse(t))}catch{return{}}},B=$.forwardRef(({className:e,endDate:t,endDate_tz:ie,locale:le,timeLabels:p,dateFormat:f,onExpire:y,separator:O=":",hideWhenExpired:W=!0,showDays:v=!0,showHours:w=!0,showMinutes:T=!0,showSeconds:N=!0,variant:b,align:q,theme:L,..._},J)=>{const l=Z(()=>p?F(p):f?F(oe(f)):H(),[p,f]),r=Y(Date.parse(t)),[G,M]=A(()=>{const n=r.current;return isNaN(n)?0:Math.max(0,n-Date.now())}),[u,C]=A(()=>{const n=r.current;return!isNaN(n)&&n<=Date.now()});j(()=>{r.current=Date.parse(t);const n=r.current,s=isNaN(n)?0:Math.max(0,n-Date.now()),c=!isNaN(n)&&n<=Date.now();M(s),C(c)},[t]),j(()=>{if(u||isNaN(r.current))return;let n=!1,s=0,c=-1;const R=()=>{const X=Date.now(),g=Math.max(0,r.current-X),z=Math.floor(g/1e3);if(z!==c&&(c=z,M(g),g<=0&&!n)){n=!0,C(!0),y?.();return}s=requestAnimationFrame(R)};return s=requestAnimationFrame(R),()=>cancelAnimationFrame(s)},[y,u,t]);const k=Math.floor(G/1e3),D=k%60,S=Math.floor(k/60),V=S%60,E=Math.floor(S/60),I=E%24,P=Math.floor(E/24),a=[];v&&a.push({value:P,label:l.day,cssClass:"time-days-box"}),w&&a.push({value:I,label:l.hour,cssClass:"time-hours-box"}),T&&a.push({value:V,label:l.minute,cssClass:"time-minutes-box"}),N&&a.push({value:D,label:l.second,cssClass:"time-seconds-box"});const o=[];v&&o.push(`${P} days`),w&&o.push(`${m(I)} hours`),T&&o.push(`${m(V)} minutes`),N&&o.push(`${m(D)} seconds`);const K=o.length>0?`${o.join(" ")} remaining`:"countdown timer";if(u&&W)return i("span",{role:"status","aria-live":"polite",className:"sr-only",children:"Countdown has ended"});const Q=re(L),U=ae(L);return x("div",{ref:J,className:h(ee({variant:b,align:q}),e),role:"timer","aria-label":K,..._,children:[a.map((n,s)=>x($.Fragment,{children:[x("div",{className:h(te({variant:b}),Q,n.cssClass),children:[i("div",{className:ne(),children:m(n.value,2)}),i("div",{className:"truncate text-center text-[12px] font-bold",children:n.label})]}),s<a.length-1&&i("div",{className:h(se({variant:b}),U),children:O})]},n.cssClass)),u&&i("span",{role:"status","aria-live":"polite",className:"sr-only",children:"Countdown has ended"})]})});B.displayName="Countdown";var me=B;export{me as default};
2
2
  //# sourceMappingURL=Countdown.js.map
package/dist/esm/components/Countdown.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/components/Countdown.tsx"],
4
- "sourcesContent": ["'use client'\n\nimport React, { useEffect, useRef, useState, useMemo } from 'react'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { cn } from '../helpers/index.js'\n\n// \u5B9A\u4E49\u6837\u5F0F\u53D8\u4F53\nconst countdownVariants = cva(\n // \u57FA\u7840\u6837\u5F0F\uFF1A\u5012\u8BA1\u65F6\u5BB9\u5668\n 'countdown-container flex w-full items-center',\n {\n variants: {\n variant: {\n outline: 'gap-1',\n spacious: 'gap-1',\n },\n align: {\n left: 'justify-start',\n center: 'justify-center',\n },\n },\n defaultVariants: {\n variant: 'outline',\n align: 'left',\n },\n }\n)\n\nconst timeBlockVariants = cva(\n // \u57FA\u7840\u6837\u5F0F\uFF1A\u65F6\u95F4\u5757\n 'time-block border-box rounded-box-small flex flex-col items-center justify-center overflow-hidden text-center text-xs',\n {\n variants: {\n variant: {\n outline:\n 'border-info-primary text-info-primary desktop:size-12 desktop:p-1 size-10 border bg-transparent p-[2px]',\n spacious: 'bg-info-white text-info-primary desktop:size-12 desktop:p-1 size-10 p-[2px]',\n },\n },\n defaultVariants: {\n variant: 'outline',\n },\n }\n)\n\nconst timeNumberVariants = cva(\n 'time-number lg-desktop:text-[24px] translate-y-[2px] whitespace-nowrap text-center text-[20px] font-bold leading-none'\n)\n\nconst separatorVariants = cva(\n // \u57FA\u7840\u6837\u5F0F\uFF1A\u5206\u9694\u7B26\n 'separator desktop:text-2xl text-xl font-bold',\n {\n variants: {\n variant: {\n outline: 'text-info-primary',\n spacious: 'text-info-primary',\n },\n },\n defaultVariants: {\n variant: 'outline',\n },\n }\n)\n\n/**\n * \u4E3B\u9898\u8272\u8986\u76D6\u7C7B - \u4EC5\u5F53 theme \u4F20\u5165\u65F6\u8986\u76D6 variant \u7684\u989C\u8272\u90E8\u5206\uFF0C\u4FDD\u7559\u5E03\u5C40/\u5C3A\u5BF8\n */\nconst getTimeBlockThemeClasses = (theme?: 'light' | 'dark'): string => {\n if (!theme) return ''\n return theme === 'light'\n ? 'bg-info-primary text-info-white border-transparent'\n : 'bg-container-secondary text-info-primary border-transparent'\n}\n\nconst getSeparatorThemeClasses = (theme?: 'light' | 'dark'): string => {\n if (!theme) return ''\n return 'text-info-primary'\n}\n\n/**\n * \u65F6\u95F4\u6807\u7B7E\u914D\u7F6E\u63A5\u53E3 (singular keys)\n */\nexport interface TimeLabels {\n /** \u5929\u7684\u6807\u7B7E */\n day: string\n /** \u5C0F\u65F6\u7684\u6807\u7B7E */\n hour: string\n /** \u5206\u949F\u7684\u6807\u7B7E */\n minute: string\n /** \u79D2\u7684\u6807\u7B7E */\n second: string\n}\n\n/**\n * \u65F6\u95F4\u6807\u7B7E\u914D\u7F6E\u63A5\u53E3 (plural keys, e.g. from Title component)\n */\nexport interface PluralTimeLabels {\n days: string\n hours: string\n minutes: string\n seconds: string\n}\n\n/**\n * \u65F6\u95F4\u6807\u7B7E\u8F93\u5165\u7C7B\u578B - \u652F\u6301 singular \u548C plural \u952E\u540D\uFF0C\u6240\u6709\u5B57\u6BB5\u53EF\u9009\n */\nexport type TimeLabelsInput = Partial<TimeLabels & PluralTimeLabels>\n\n/**\n * \u5012\u8BA1\u65F6\u7EC4\u4EF6Props\u63A5\u53E3\n */\nexport interface CountdownProps\n extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onExpire'>, VariantProps<typeof countdownVariants> {\n /** \u7ED3\u675F\u65F6\u95F4 - ISO\u683C\u5F0F\u5B57\u7B26\u4E32 */\n endDate: string\n /** \u7ED3\u675F\u65F6\u95F4\u65F6\u533A\uFF0C\u5982: America/Los_Angeles */\n endDate_tz?: string\n /** \u683C\u5F0F\u5316\u7528\u7684locale\uFF0C\u9ED8\u8BA4\u4F7F\u7528navigator.language */\n locale?: string\n /** \u65F6\u95F4\u6807\u7B7E\u914D\u7F6E\uFF0C\u652F\u6301 singular (day/hour/minute/second) \u548C plural (days/hours/minutes/seconds) \u952E\u540D */\n timeLabels?: TimeLabelsInput\n /** JSON\u5B57\u7B26\u4E32\u683C\u5F0F\u7684\u65F6\u95F4\u6807\u7B7E\uFF08\u5411\u540E\u517C\u5BB9\uFF09 */\n dateFormat?: string\n /** \u5012\u8BA1\u65F6\u7ED3\u675F\u56DE\u8C03 */\n onExpire?: () => void\n /** \u5206\u9694\u7B26\u5B57\u7B26\uFF0C\u9ED8\u8BA4\u4E3A ':' */\n separator?: string\n /** \u9690\u85CF\u5DF2\u8FC7\u671F\u7684\u5012\u8BA1\u65F6\uFF0C\u9ED8\u8BA4\u4E3A true */\n hideWhenExpired?: boolean\n /** \u662F\u5426\u663E\u793A\u5929\u6570\uFF0C\u9ED8\u8BA4\u4E3A true */\n showDays?: boolean\n /** \u662F\u5426\u663E\u793A\u5C0F\u65F6\uFF0C\u9ED8\u8BA4\u4E3A true */\n showHours?: boolean\n /** \u662F\u5426\u663E\u793A\u5206\u949F\uFF0C\u9ED8\u8BA4\u4E3A true */\n showMinutes?: boolean\n /** \u662F\u5426\u663E\u793A\u79D2\u6570\uFF0C\u9ED8\u8BA4\u4E3A true */\n showSeconds?: boolean\n /** \u989C\u8272\u4E3B\u9898 - \u8986\u76D6 variant \u7684\u989C\u8272\u90E8\u5206\uFF0C\u4FDD\u7559\u5E03\u5C40/\u5C3A\u5BF8\u3002\u4E0D\u4F20\u5219\u4FDD\u6301 variant \u539F\u6709\u989C\u8272 */\n theme?: 'light' | 'dark'\n}\n\n/**\n * \u6570\u5B57\u8865\u96F6\u51FD\u6570\n */\nconst pad = (n: number, len = 2) => String(Math.abs(n)).padStart(len, '0')\n\n/**\n * \u9ED8\u8BA4\u65F6\u95F4\u6807\u7B7E\n */\nconst getDefaultTimeLabels = (): TimeLabels => ({\n day: 'Day',\n hour: 'Hours',\n minute: 'Mins',\n second: 'Secs',\n})\n\n/**\n * \u5C06 plural/singular \u6DF7\u5408\u6807\u7B7E\u89C4\u8303\u5316\u4E3A singular \u683C\u5F0F\n * singular \u952E\u4F18\u5148\u4E8E plural \u952E\uFF0C\u7F3A\u5931\u65F6\u4F7F\u7528\u9ED8\u8BA4\u503C\n */\nconst resolveTimeLabels = (labels: TimeLabelsInput): TimeLabels => {\n const defaults = getDefaultTimeLabels()\n return {\n day: labels.day ?? labels.days ?? defaults.day,\n hour: labels.hour ?? labels.hours ?? defaults.hour,\n minute: labels.minute ?? labels.minutes ?? defaults.minute,\n second: labels.second ?? labels.seconds ?? defaults.second,\n }\n}\n\n/**\n * \u89E3\u6790dateFormat JSON\u5B57\u7B26\u4E32\uFF08\u5411\u540E\u517C\u5BB9\uFF09\n */\nconst safeStringToObject = (str: string): TimeLabelsInput => {\n try {\n let jsonStr = str?.trim?.()\n if (!jsonStr?.startsWith?.('{') || !jsonStr?.endsWith?.('}')) {\n return {}\n }\n jsonStr = jsonStr?.replace?.(/(\\w+)\\s*:/g, '\"$1\":')\n return JSON.parse(jsonStr) as TimeLabelsInput\n } catch (err) {\n return {}\n }\n}\n\n/**\n * Countdown - \u5012\u8BA1\u65F6\u539F\u5B50\u7EC4\u4EF6\n *\n * @description \u7528\u4E8E\u663E\u793A\u5012\u8BA1\u65F6\u7684\u7EC4\u4EF6\uFF0C\u652F\u6301\u5929\u3001\u65F6\u3001\u5206\u3001\u79D2\u663E\u793A\uFF0C\u652F\u6301\u591A\u79CD\u6837\u5F0F\u53D8\u4F53\u3001\u4E3B\u9898\u548C\u5355\u4F4D\u53EF\u89C1\u6027\u63A7\u5236\n */\nconst Countdown = React.forwardRef<HTMLDivElement, CountdownProps>(\n (\n {\n className,\n endDate,\n endDate_tz,\n locale,\n timeLabels,\n dateFormat,\n onExpire,\n separator = ':',\n hideWhenExpired = true,\n showDays = true,\n showHours = true,\n showMinutes = true,\n showSeconds = true,\n variant,\n align,\n theme,\n ...props\n },\n ref\n ) => {\n // \u786E\u5B9A\u6700\u7EC8\u4F7F\u7528\u7684\u65F6\u95F4\u6807\u7B7E (\u652F\u6301 plural \u548C singular \u952E)\n const finalTimeLabels = useMemo(() => {\n if (timeLabels) return resolveTimeLabels(timeLabels)\n if (dateFormat) return resolveTimeLabels(safeStringToObject(dateFormat))\n return getDefaultTimeLabels()\n }, [timeLabels, dateFormat])\n\n // \u89E3\u6790\u76EE\u6807\u65F6\u95F4\n const targetMsRef = useRef<number>(Date.parse(endDate))\n const [remainingMs, setRemainingMs] = useState<number>(() => {\n const t = targetMsRef.current\n return isNaN(t) ? 0 : Math.max(0, t - Date.now())\n })\n\n // \u5224\u65AD\u662F\u5426\u5DF2\u8FC7\u671F\n const [isExpired, setIsExpired] = useState<boolean>(() => {\n const t = targetMsRef.current\n return !isNaN(t) && t <= Date.now()\n })\n\n // \u5F53endDate\u6539\u53D8\u65F6\u66F4\u65B0\u76EE\u6807\u65F6\u95F4\n useEffect(() => {\n targetMsRef.current = Date.parse(endDate)\n const t = targetMsRef.current\n const newRemaining = isNaN(t) ? 0 : Math.max(0, t - Date.now())\n const newIsExpired = !isNaN(t) && t <= Date.now()\n\n setRemainingMs(newRemaining)\n setIsExpired(newIsExpired)\n }, [endDate])\n\n // \u542F\u52A8\u5012\u8BA1\u65F6\u5B9A\u65F6\u5668\n useEffect(() => {\n if (isExpired) return // \u5DF2\u8FC7\u671F\u5219\u4E0D\u542F\u52A8\n if (isNaN(targetMsRef.current)) return // \u65E0\u6548\u65E5\u671F\u4E0D\u542F\u52A8\n\n let expiredCalled = false\n const tick = () => {\n const now = Date.now()\n const remaining = Math.max(0, targetMsRef.current - now)\n setRemainingMs(remaining)\n\n if (remaining <= 0 && !expiredCalled) {\n expiredCalled = true\n setIsExpired(true)\n onExpire?.()\n }\n }\n\n tick() // \u7ACB\u5373\u6267\u884C\u4E00\u6B21\n const intervalId = window.setInterval(tick, 1000)\n\n return () => clearInterval(intervalId)\n }, [onExpire, isExpired, endDate])\n\n // \u8BA1\u7B97\u65F6\u95F4\u5355\u4F4D\n const totalSeconds = Math.floor(remainingMs / 1000)\n const seconds = totalSeconds % 60\n const totalMinutes = Math.floor(totalSeconds / 60)\n const minutes = totalMinutes % 60\n const totalHours = Math.floor(totalMinutes / 60)\n const hours = totalHours % 24\n const days = Math.floor(totalHours / 24)\n\n // \u6784\u5EFA\u53EF\u89C1\u7684\u65F6\u95F4\u5355\u4F4D\u6570\u7EC4\n const units: Array<{ value: number; label: string; cssClass: string }> = []\n if (showDays) units.push({ value: days, label: finalTimeLabels.day, cssClass: 'time-days-box' })\n if (showHours) units.push({ value: hours, label: finalTimeLabels.hour, cssClass: 'time-hours-box' })\n if (showMinutes) units.push({ value: minutes, label: finalTimeLabels.minute, cssClass: 'time-minutes-box' })\n if (showSeconds) units.push({ value: seconds, label: finalTimeLabels.second, cssClass: 'time-seconds-box' })\n\n // \u6784\u5EFA\u52A8\u6001 aria-label\n const ariaLabelParts: string[] = []\n if (showDays) ariaLabelParts.push(`${days} days`)\n if (showHours) ariaLabelParts.push(`${pad(hours)} hours`)\n if (showMinutes) ariaLabelParts.push(`${pad(minutes)} minutes`)\n if (showSeconds) ariaLabelParts.push(`${pad(seconds)} seconds`)\n const ariaLabel = ariaLabelParts.length > 0 ? `${ariaLabelParts.join(' ')} remaining` : 'countdown timer'\n\n // \u5982\u679C\u5DF2\u8FC7\u671F\u4E14\u9700\u8981\u9690\u85CF\uFF0C\u4EC5\u4FDD\u7559 screen reader \u901A\u77E5\n if (isExpired && hideWhenExpired) {\n return (\n <span role=\"status\" aria-live=\"polite\" className=\"sr-only\">\n Countdown has ended\n </span>\n )\n }\n\n const timeBlockTheme = getTimeBlockThemeClasses(theme)\n const separatorTheme = getSeparatorThemeClasses(theme)\n\n return (\n <div\n ref={ref}\n className={cn(countdownVariants({ variant, align }), className)}\n role=\"timer\"\n aria-label={ariaLabel}\n {...props}\n >\n {units.map((unit, index) => (\n <React.Fragment key={unit.cssClass}>\n <div className={cn(timeBlockVariants({ variant }), timeBlockTheme, unit.cssClass)}>\n <div className={timeNumberVariants()}>{pad(unit.value, 2)}</div>\n <div className=\"truncate text-center text-[12px] font-bold\">{unit.label}</div>\n </div>\n {index < units.length - 1 && (\n <div className={cn(separatorVariants({ variant }), separatorTheme)}>{separator}</div>\n )}\n </React.Fragment>\n ))}\n {/* Visually hidden status for screen readers - announces only on expiry */}\n {isExpired && (\n <span role=\"status\" aria-live=\"polite\" className=\"sr-only\">\n Countdown has ended\n </span>\n )}\n </div>\n )\n }\n)\n\nCountdown.displayName = 'Countdown'\n\nexport default Countdown\n"],
5
- "mappings": "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",
6
- "names": ["jsx", "jsxs", "React", "useEffect", "useRef", "useState", "useMemo", "cva", "cn", "countdownVariants", "timeBlockVariants", "timeNumberVariants", "separatorVariants", "getTimeBlockThemeClasses", "theme", "getSeparatorThemeClasses", "pad", "n", "len", "getDefaultTimeLabels", "resolveTimeLabels", "labels", "defaults", "safeStringToObject", "str", "jsonStr", "Countdown", "className", "endDate", "endDate_tz", "locale", "timeLabels", "dateFormat", "onExpire", "separator", "hideWhenExpired", "showDays", "showHours", "showMinutes", "showSeconds", "variant", "align", "props", "ref", "finalTimeLabels", "targetMsRef", "remainingMs", "setRemainingMs", "t", "isExpired", "setIsExpired", "newRemaining", "newIsExpired", "expiredCalled", "tick", "now", "remaining", "intervalId", "totalSeconds", "seconds", "totalMinutes", "minutes", "totalHours", "hours", "days", "units", "ariaLabelParts", "ariaLabel", "timeBlockTheme", "separatorTheme", "unit", "index", "Countdown_default"]
4
+ "sourcesContent": ["'use client'\n\nimport React, { useEffect, useRef, useState, useMemo } from 'react'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { cn } from '../helpers/index.js'\n\n// \u5B9A\u4E49\u6837\u5F0F\u53D8\u4F53\nconst countdownVariants = cva(\n // \u57FA\u7840\u6837\u5F0F\uFF1A\u5012\u8BA1\u65F6\u5BB9\u5668\n 'countdown-container flex w-full items-center',\n {\n variants: {\n variant: {\n outline: 'gap-1',\n spacious: 'gap-1',\n },\n align: {\n left: 'justify-start',\n center: 'justify-center',\n },\n },\n defaultVariants: {\n variant: 'outline',\n align: 'left',\n },\n }\n)\n\nconst timeBlockVariants = cva(\n // \u57FA\u7840\u6837\u5F0F\uFF1A\u65F6\u95F4\u5757\n 'time-block border-box rounded-box-small flex flex-col items-center justify-center overflow-hidden text-center text-xs',\n {\n variants: {\n variant: {\n outline:\n 'border-info-primary text-info-primary desktop:size-12 desktop:p-1 size-10 border bg-transparent p-[2px]',\n spacious: 'bg-info-white text-info-primary desktop:size-12 desktop:p-1 size-10 p-[2px]',\n },\n },\n defaultVariants: {\n variant: 'outline',\n },\n }\n)\n\nconst timeNumberVariants = cva(\n 'time-number lg-desktop:text-[24px] translate-y-[2px] whitespace-nowrap text-center text-[20px] font-bold leading-none'\n)\n\nconst separatorVariants = cva(\n // \u57FA\u7840\u6837\u5F0F\uFF1A\u5206\u9694\u7B26\n 'separator desktop:text-2xl text-xl font-bold',\n {\n variants: {\n variant: {\n outline: 'text-info-primary',\n spacious: 'text-info-primary',\n },\n },\n defaultVariants: {\n variant: 'outline',\n },\n }\n)\n\n/**\n * \u4E3B\u9898\u8272\u8986\u76D6\u7C7B - \u4EC5\u5F53 theme \u4F20\u5165\u65F6\u8986\u76D6 variant \u7684\u989C\u8272\u90E8\u5206\uFF0C\u4FDD\u7559\u5E03\u5C40/\u5C3A\u5BF8\n */\nconst getTimeBlockThemeClasses = (theme?: 'light' | 'dark'): string => {\n if (!theme) return ''\n return theme === 'light'\n ? 'bg-info-primary text-info-white border-transparent'\n : 'bg-container-secondary text-info-primary border-transparent'\n}\n\nconst getSeparatorThemeClasses = (theme?: 'light' | 'dark'): string => {\n if (!theme) return ''\n return 'text-info-primary'\n}\n\n/**\n * \u65F6\u95F4\u6807\u7B7E\u914D\u7F6E\u63A5\u53E3 (singular keys)\n */\nexport interface TimeLabels {\n /** \u5929\u7684\u6807\u7B7E */\n day: string\n /** \u5C0F\u65F6\u7684\u6807\u7B7E */\n hour: string\n /** \u5206\u949F\u7684\u6807\u7B7E */\n minute: string\n /** \u79D2\u7684\u6807\u7B7E */\n second: string\n}\n\n/**\n * \u65F6\u95F4\u6807\u7B7E\u914D\u7F6E\u63A5\u53E3 (plural keys, e.g. from Title component)\n */\nexport interface PluralTimeLabels {\n days: string\n hours: string\n minutes: string\n seconds: string\n}\n\n/**\n * \u65F6\u95F4\u6807\u7B7E\u8F93\u5165\u7C7B\u578B - \u652F\u6301 singular \u548C plural \u952E\u540D\uFF0C\u6240\u6709\u5B57\u6BB5\u53EF\u9009\n */\nexport type TimeLabelsInput = Partial<TimeLabels & PluralTimeLabels>\n\n/**\n * \u5012\u8BA1\u65F6\u7EC4\u4EF6Props\u63A5\u53E3\n */\nexport interface CountdownProps\n extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onExpire'>, VariantProps<typeof countdownVariants> {\n /** \u7ED3\u675F\u65F6\u95F4 - ISO\u683C\u5F0F\u5B57\u7B26\u4E32 */\n endDate: string\n /** \u7ED3\u675F\u65F6\u95F4\u65F6\u533A\uFF0C\u5982: America/Los_Angeles */\n endDate_tz?: string\n /** \u683C\u5F0F\u5316\u7528\u7684locale\uFF0C\u9ED8\u8BA4\u4F7F\u7528navigator.language */\n locale?: string\n /** \u65F6\u95F4\u6807\u7B7E\u914D\u7F6E\uFF0C\u652F\u6301 singular (day/hour/minute/second) \u548C plural (days/hours/minutes/seconds) \u952E\u540D */\n timeLabels?: TimeLabelsInput\n /** JSON\u5B57\u7B26\u4E32\u683C\u5F0F\u7684\u65F6\u95F4\u6807\u7B7E\uFF08\u5411\u540E\u517C\u5BB9\uFF09 */\n dateFormat?: string\n /** \u5012\u8BA1\u65F6\u7ED3\u675F\u56DE\u8C03 */\n onExpire?: () => void\n /** \u5206\u9694\u7B26\u5B57\u7B26\uFF0C\u9ED8\u8BA4\u4E3A ':' */\n separator?: string\n /** \u9690\u85CF\u5DF2\u8FC7\u671F\u7684\u5012\u8BA1\u65F6\uFF0C\u9ED8\u8BA4\u4E3A true */\n hideWhenExpired?: boolean\n /** \u662F\u5426\u663E\u793A\u5929\u6570\uFF0C\u9ED8\u8BA4\u4E3A true */\n showDays?: boolean\n /** \u662F\u5426\u663E\u793A\u5C0F\u65F6\uFF0C\u9ED8\u8BA4\u4E3A true */\n showHours?: boolean\n /** \u662F\u5426\u663E\u793A\u5206\u949F\uFF0C\u9ED8\u8BA4\u4E3A true */\n showMinutes?: boolean\n /** \u662F\u5426\u663E\u793A\u79D2\u6570\uFF0C\u9ED8\u8BA4\u4E3A true */\n showSeconds?: boolean\n /** \u989C\u8272\u4E3B\u9898 - \u8986\u76D6 variant \u7684\u989C\u8272\u90E8\u5206\uFF0C\u4FDD\u7559\u5E03\u5C40/\u5C3A\u5BF8\u3002\u4E0D\u4F20\u5219\u4FDD\u6301 variant \u539F\u6709\u989C\u8272 */\n theme?: 'light' | 'dark'\n}\n\n/**\n * \u6570\u5B57\u8865\u96F6\u51FD\u6570\n */\nconst pad = (n: number, len = 2) => String(Math.abs(n)).padStart(len, '0')\n\n/**\n * \u9ED8\u8BA4\u65F6\u95F4\u6807\u7B7E\n */\nconst getDefaultTimeLabels = (): TimeLabels => ({\n day: 'Day',\n hour: 'Hours',\n minute: 'Mins',\n second: 'Secs',\n})\n\n/**\n * \u5C06 plural/singular \u6DF7\u5408\u6807\u7B7E\u89C4\u8303\u5316\u4E3A singular \u683C\u5F0F\n * singular \u952E\u4F18\u5148\u4E8E plural \u952E\uFF0C\u7F3A\u5931\u65F6\u4F7F\u7528\u9ED8\u8BA4\u503C\n */\nconst resolveTimeLabels = (labels: TimeLabelsInput): TimeLabels => {\n const defaults = getDefaultTimeLabels()\n return {\n day: labels.day ?? labels.days ?? defaults.day,\n hour: labels.hour ?? labels.hours ?? defaults.hour,\n minute: labels.minute ?? labels.minutes ?? defaults.minute,\n second: labels.second ?? labels.seconds ?? defaults.second,\n }\n}\n\n/**\n * \u89E3\u6790dateFormat JSON\u5B57\u7B26\u4E32\uFF08\u5411\u540E\u517C\u5BB9\uFF09\n */\nconst safeStringToObject = (str: string): TimeLabelsInput => {\n try {\n let jsonStr = str?.trim?.()\n if (!jsonStr?.startsWith?.('{') || !jsonStr?.endsWith?.('}')) {\n return {}\n }\n jsonStr = jsonStr?.replace?.(/(\\w+)\\s*:/g, '\"$1\":')\n return JSON.parse(jsonStr) as TimeLabelsInput\n } catch (err) {\n return {}\n }\n}\n\n/**\n * Countdown - \u5012\u8BA1\u65F6\u539F\u5B50\u7EC4\u4EF6\n *\n * @description \u7528\u4E8E\u663E\u793A\u5012\u8BA1\u65F6\u7684\u7EC4\u4EF6\uFF0C\u652F\u6301\u5929\u3001\u65F6\u3001\u5206\u3001\u79D2\u663E\u793A\uFF0C\u652F\u6301\u591A\u79CD\u6837\u5F0F\u53D8\u4F53\u3001\u4E3B\u9898\u548C\u5355\u4F4D\u53EF\u89C1\u6027\u63A7\u5236\n */\nconst Countdown = React.forwardRef<HTMLDivElement, CountdownProps>(\n (\n {\n className,\n endDate,\n endDate_tz,\n locale,\n timeLabels,\n dateFormat,\n onExpire,\n separator = ':',\n hideWhenExpired = true,\n showDays = true,\n showHours = true,\n showMinutes = true,\n showSeconds = true,\n variant,\n align,\n theme,\n ...props\n },\n ref\n ) => {\n // \u786E\u5B9A\u6700\u7EC8\u4F7F\u7528\u7684\u65F6\u95F4\u6807\u7B7E (\u652F\u6301 plural \u548C singular \u952E)\n const finalTimeLabels = useMemo(() => {\n if (timeLabels) return resolveTimeLabels(timeLabels)\n if (dateFormat) return resolveTimeLabels(safeStringToObject(dateFormat))\n return getDefaultTimeLabels()\n }, [timeLabels, dateFormat])\n\n // \u89E3\u6790\u76EE\u6807\u65F6\u95F4\n const targetMsRef = useRef<number>(Date.parse(endDate))\n const [remainingMs, setRemainingMs] = useState<number>(() => {\n const t = targetMsRef.current\n return isNaN(t) ? 0 : Math.max(0, t - Date.now())\n })\n\n // \u5224\u65AD\u662F\u5426\u5DF2\u8FC7\u671F\n const [isExpired, setIsExpired] = useState<boolean>(() => {\n const t = targetMsRef.current\n return !isNaN(t) && t <= Date.now()\n })\n\n // \u5F53endDate\u6539\u53D8\u65F6\u66F4\u65B0\u76EE\u6807\u65F6\u95F4\n useEffect(() => {\n targetMsRef.current = Date.parse(endDate)\n const t = targetMsRef.current\n const newRemaining = isNaN(t) ? 0 : Math.max(0, t - Date.now())\n const newIsExpired = !isNaN(t) && t <= Date.now()\n\n setRemainingMs(newRemaining)\n setIsExpired(newIsExpired)\n }, [endDate])\n\n useEffect(() => {\n if (isExpired) return\n if (isNaN(targetMsRef.current)) return\n\n let expiredCalled = false\n let rafId: number = 0\n let lastSecond = -1\n\n const tick = () => {\n const now = Date.now()\n const remaining = Math.max(0, targetMsRef.current - now)\n const currentSecond = Math.floor(remaining / 1000)\n\n if (currentSecond !== lastSecond) {\n lastSecond = currentSecond\n setRemainingMs(remaining)\n\n if (remaining <= 0 && !expiredCalled) {\n expiredCalled = true\n setIsExpired(true)\n onExpire?.()\n return\n }\n }\n\n rafId = requestAnimationFrame(tick)\n }\n\n rafId = requestAnimationFrame(tick)\n return () => cancelAnimationFrame(rafId)\n }, [onExpire, isExpired, endDate])\n\n // \u8BA1\u7B97\u65F6\u95F4\u5355\u4F4D\n const totalSeconds = Math.floor(remainingMs / 1000)\n const seconds = totalSeconds % 60\n const totalMinutes = Math.floor(totalSeconds / 60)\n const minutes = totalMinutes % 60\n const totalHours = Math.floor(totalMinutes / 60)\n const hours = totalHours % 24\n const days = Math.floor(totalHours / 24)\n\n // \u6784\u5EFA\u53EF\u89C1\u7684\u65F6\u95F4\u5355\u4F4D\u6570\u7EC4\n const units: Array<{ value: number; label: string; cssClass: string }> = []\n if (showDays) units.push({ value: days, label: finalTimeLabels.day, cssClass: 'time-days-box' })\n if (showHours) units.push({ value: hours, label: finalTimeLabels.hour, cssClass: 'time-hours-box' })\n if (showMinutes) units.push({ value: minutes, label: finalTimeLabels.minute, cssClass: 'time-minutes-box' })\n if (showSeconds) units.push({ value: seconds, label: finalTimeLabels.second, cssClass: 'time-seconds-box' })\n\n // \u6784\u5EFA\u52A8\u6001 aria-label\n const ariaLabelParts: string[] = []\n if (showDays) ariaLabelParts.push(`${days} days`)\n if (showHours) ariaLabelParts.push(`${pad(hours)} hours`)\n if (showMinutes) ariaLabelParts.push(`${pad(minutes)} minutes`)\n if (showSeconds) ariaLabelParts.push(`${pad(seconds)} seconds`)\n const ariaLabel = ariaLabelParts.length > 0 ? `${ariaLabelParts.join(' ')} remaining` : 'countdown timer'\n\n // \u5982\u679C\u5DF2\u8FC7\u671F\u4E14\u9700\u8981\u9690\u85CF\uFF0C\u4EC5\u4FDD\u7559 screen reader \u901A\u77E5\n if (isExpired && hideWhenExpired) {\n return (\n <span role=\"status\" aria-live=\"polite\" className=\"sr-only\">\n Countdown has ended\n </span>\n )\n }\n\n const timeBlockTheme = getTimeBlockThemeClasses(theme)\n const separatorTheme = getSeparatorThemeClasses(theme)\n\n return (\n <div\n ref={ref}\n className={cn(countdownVariants({ variant, align }), className)}\n role=\"timer\"\n aria-label={ariaLabel}\n {...props}\n >\n {units.map((unit, index) => (\n <React.Fragment key={unit.cssClass}>\n <div className={cn(timeBlockVariants({ variant }), timeBlockTheme, unit.cssClass)}>\n <div className={timeNumberVariants()}>{pad(unit.value, 2)}</div>\n <div className=\"truncate text-center text-[12px] font-bold\">{unit.label}</div>\n </div>\n {index < units.length - 1 && (\n <div className={cn(separatorVariants({ variant }), separatorTheme)}>{separator}</div>\n )}\n </React.Fragment>\n ))}\n {/* Visually hidden status for screen readers - announces only on expiry */}\n {isExpired && (\n <span role=\"status\" aria-live=\"polite\" className=\"sr-only\">\n Countdown has ended\n </span>\n )}\n </div>\n )\n }\n)\n\nCountdown.displayName = 'Countdown'\n\nexport default Countdown\n"],
5
+ "mappings": "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",
6
+ "names": ["jsx", "jsxs", "React", "useEffect", "useRef", "useState", "useMemo", "cva", "cn", "countdownVariants", "timeBlockVariants", "timeNumberVariants", "separatorVariants", "getTimeBlockThemeClasses", "theme", "getSeparatorThemeClasses", "pad", "n", "len", "getDefaultTimeLabels", "resolveTimeLabels", "labels", "defaults", "safeStringToObject", "str", "jsonStr", "Countdown", "className", "endDate", "endDate_tz", "locale", "timeLabels", "dateFormat", "onExpire", "separator", "hideWhenExpired", "showDays", "showHours", "showMinutes", "showSeconds", "variant", "align", "props", "ref", "finalTimeLabels", "targetMsRef", "remainingMs", "setRemainingMs", "t", "isExpired", "setIsExpired", "newRemaining", "newIsExpired", "expiredCalled", "rafId", "lastSecond", "tick", "now", "remaining", "currentSecond", "totalSeconds", "seconds", "totalMinutes", "minutes", "totalHours", "hours", "days", "units", "ariaLabelParts", "ariaLabel", "timeBlockTheme", "separatorTheme", "unit", "index", "Countdown_default"]
7
7
  }
package/dist/esm/components/tabs.js CHANGED
@@ -1,2 +1,2 @@
1
- "use client";import{jsx as r}from"react/jsx-runtime";import*as o from"react";import{cn as d}from"../helpers/index.js";import*as s from"@radix-ui/react-tabs";import{cva as c}from"class-variance-authority";const m=o.createContext({align:"left",shape:"square"}),b=o.forwardRef(({children:t,align:e="left",shape:a="default",...i},n)=>r(s.Root,{ref:n,...i,children:r(m.Provider,{value:{align:e,shape:a},children:t})}));b.displayName="Tabs";const P=c("rounded-tabs",{variants:{align:{left:"justify-left",center:"justify-center",right:"justify-end"},shape:{default:"",rounded:"rounded-[28px]",square:"rounded-none"}},defaultVariants:{align:"left",shape:"default"}}),C=c("rounded-tabs",{variants:{shape:{default:"",rounded:"rounded-[28px]",square:"rounded-none"}},defaultVariants:{shape:"default"}}),u=o.forwardRef(({className:t,...e},a)=>{const{align:i,shape:n}=o.useContext(m);return r(s.List,{ref:a,className:d("bg-tabs-list-bg flex w-fit max-w-full overflow-x-auto p-1",P({align:i,shape:n}),t),style:{scrollbarWidth:"none",msOverflowStyle:"none"},...e})});u.displayName=s.List.displayName;const g=o.forwardRef(({className:t,onClick:e,...a},i)=>{const{shape:n}=o.useContext(m),T=p=>{e?.(p);const l=p?.currentTarget,f=p?.currentTarget?.parentElement;if(l&&f){const R=l.offsetLeft,y=l.offsetWidth,v=f.offsetWidth,x=R-v/2+y/2;f.scrollTo({left:x,behavior:"smooth"})}};return r(s.Trigger,{ref:i,className:d("text-info-primary lg-desktop:text-base disabled:text-btn-secondary-disabled lg-desktop:px-[28px] lg-desktop:pt-[15px] lg-desktop:pb-[14px] shrink-0 px-5 pb-2.5 pt-[11px] text-sm font-bold data-[state=active]:bg-white data-[state=active]:text-[#080A0F]",t,C({shape:n})),onClick:T,...a})});g.displayName=s.Trigger.displayName;const h=o.forwardRef(({className:t,...e},a)=>r(s.Content,{ref:a,className:d(t),...e}));h.displayName=s.Content.displayName;export{b as Tabs,h as TabsContent,u as TabsList,g as TabsTrigger};
1
+ "use client";import{jsx as i}from"react/jsx-runtime";import*as s from"react";import{cn as c}from"../helpers/index.js";import*as o from"@radix-ui/react-tabs";import{cva as b}from"class-variance-authority";const m=s.createContext({align:"left",shape:"square"}),u=s.forwardRef(({children:t,align:e="left",shape:a="default",...r},l)=>i(o.Root,{ref:l,...r,children:i(m.Provider,{value:{align:e,shape:a},children:t})}));u.displayName="Tabs";const P=b("rounded-tabs",{variants:{shape:{default:"",rounded:"rounded-[28px]",square:"rounded-none"}},defaultVariants:{shape:"default"}}),C=b("rounded-tabs",{variants:{shape:{default:"",rounded:"rounded-[28px]",square:"rounded-none"}},defaultVariants:{shape:"default"}}),h=s.forwardRef(({className:t,...e},a)=>{const{align:r,shape:l}=s.useContext(m),p=r==="center"?"flex w-full justify-center":r==="right"?"flex w-full justify-end":null,n=i(o.List,{ref:a,className:c("bg-tabs-list-bg flex w-fit max-w-full overflow-x-auto p-1",P({shape:l}),t),style:{scrollbarWidth:"none",msOverflowStyle:"none"},...e});return p?i("div",{className:p,children:n}):n});h.displayName=o.List.displayName;const g=s.forwardRef(({className:t,onClick:e,...a},r)=>{const{shape:l}=s.useContext(m),p=n=>{e?.(n);const f=n?.currentTarget,d=n?.currentTarget?.parentElement;if(f&&d){const R=f.offsetLeft,v=f.offsetWidth,y=d.offsetWidth,x=R-y/2+v/2;d.scrollTo({left:x,behavior:"smooth"})}};return i(o.Trigger,{ref:r,className:c("text-info-primary lg-desktop:text-base disabled:text-btn-secondary-disabled lg-desktop:px-[28px] lg-desktop:pt-[15px] lg-desktop:pb-[14px] shrink-0 px-5 pb-2.5 pt-[11px] text-sm font-bold data-[state=active]:bg-white data-[state=active]:text-[#080A0F]",t,C({shape:l})),onClick:p,...a})});g.displayName=o.Trigger.displayName;const T=s.forwardRef(({className:t,...e},a)=>i(o.Content,{ref:a,className:c(t),...e}));T.displayName=o.Content.displayName;export{u as Tabs,T as TabsContent,h as TabsList,g as TabsTrigger};
2
2
  //# sourceMappingURL=tabs.js.map
package/dist/esm/components/tabs.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/components/tabs.tsx"],
4
- "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../helpers/index.js'\n\nimport * as TabsPrimitive from '@radix-ui/react-tabs'\nimport { cva } from 'class-variance-authority'\nimport type { Align, Shape } from '../types/props.js'\n\ntype tabShape = Shape | 'default'\n\nconst TabListContext = React.createContext<{\n align?: Align\n shape: tabShape\n}>({\n align: 'left',\n shape: 'square',\n})\n\nconst Tabs = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.Root>,\n React.ComponentPropsWithoutRef<typeof TabsPrimitive.Root> & {\n align?: Align\n shape?: tabShape\n }\n>(({ children, align = 'left', shape = 'default', ...props }, ref) => (\n <TabsPrimitive.Root ref={ref} {...props}>\n <TabListContext.Provider value={{ align, shape }}>{children}</TabListContext.Provider>\n </TabsPrimitive.Root>\n))\nTabs.displayName = 'Tabs'\n\nconst tabsListVariants = cva('rounded-tabs', {\n variants: {\n align: {\n left: 'justify-left',\n center: 'justify-center',\n right: 'justify-end',\n },\n shape: {\n default: '',\n rounded: 'rounded-[28px]',\n square: 'rounded-none',\n },\n },\n defaultVariants: {\n align: 'left',\n shape: 'default',\n },\n})\n\nconst tabsTriggerVariants = cva('rounded-tabs', {\n variants: {\n shape: {\n default: '',\n rounded: 'rounded-[28px]',\n square: 'rounded-none',\n },\n },\n defaultVariants: {\n shape: 'default',\n },\n})\nconst TabsList = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.List>,\n React.ComponentPropsWithoutRef<typeof TabsPrimitive.List>\n>(({ className, ...props }, ref) => {\n const { align: alignFromParent, shape: shapeFromParent } = React.useContext(TabListContext)\n return (\n <TabsPrimitive.List\n ref={ref}\n className={cn(\n 'bg-tabs-list-bg flex w-fit max-w-full overflow-x-auto p-1',\n tabsListVariants({\n align: alignFromParent,\n shape: shapeFromParent,\n }),\n className\n )}\n style={{\n scrollbarWidth: 'none',\n msOverflowStyle: 'none',\n }}\n {...props}\n />\n )\n})\nTabsList.displayName = TabsPrimitive.List.displayName\n\nconst TabsTrigger = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.Trigger>,\n React.ComponentPropsWithoutRef<typeof TabsPrimitive.Trigger>\n>(({ className, onClick, ...props }, ref) => {\n const { shape: shapeFromParent } = React.useContext(TabListContext)\n const handleClick = (e: React.MouseEvent<HTMLButtonElement>) => {\n onClick?.(e)\n const tabElement = e?.currentTarget\n const container = e?.currentTarget?.parentElement\n if (tabElement && container) {\n const tabLeft = tabElement.offsetLeft\n const tabWidth = tabElement.offsetWidth\n const containerWidth = container.offsetWidth\n const scrollTo = tabLeft - containerWidth / 2 + tabWidth / 2\n container.scrollTo({\n left: scrollTo,\n behavior: 'smooth',\n })\n }\n }\n return (\n <TabsPrimitive.Trigger\n ref={ref}\n className={cn(\n 'text-info-primary lg-desktop:text-base disabled:text-btn-secondary-disabled lg-desktop:px-[28px] lg-desktop:pt-[15px] lg-desktop:pb-[14px] shrink-0 px-5 pb-2.5 pt-[11px] text-sm font-bold data-[state=active]:bg-white data-[state=active]:text-[#080A0F]',\n className,\n tabsTriggerVariants({\n shape: shapeFromParent,\n })\n )}\n onClick={handleClick}\n {...props}\n />\n )\n})\nTabsTrigger.displayName = TabsPrimitive.Trigger.displayName\n\nconst TabsContent = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.Content>,\n React.ComponentPropsWithoutRef<typeof TabsPrimitive.Content>\n>(({ className, ...props }, ref) => <TabsPrimitive.Content ref={ref} className={cn(className)} {...props} />)\nTabsContent.displayName = TabsPrimitive.Content.displayName\n\nexport { Tabs, TabsList, TabsTrigger, TabsContent }\n"],
5
- "mappings": "aA2BI,cAAAA,MAAA,oBAzBJ,UAAYC,MAAW,QACvB,OAAS,MAAAC,MAAU,sBAEnB,UAAYC,MAAmB,uBAC/B,OAAS,OAAAC,MAAW,2BAKpB,MAAMC,EAAiBJ,EAAM,cAG1B,CACD,MAAO,OACP,MAAO,QACT,CAAC,EAEKK,EAAOL,EAAM,WAMjB,CAAC,CAAE,SAAAM,EAAU,MAAAC,EAAQ,OAAQ,MAAAC,EAAQ,UAAW,GAAGC,CAAM,EAAGC,IAC5DX,EAACG,EAAc,KAAd,CAAmB,IAAKQ,EAAM,GAAGD,EAChC,SAAAV,EAACK,EAAe,SAAf,CAAwB,MAAO,CAAE,MAAAG,EAAO,MAAAC,CAAM,EAAI,SAAAF,EAAS,EAC9D,CACD,EACDD,EAAK,YAAc,OAEnB,MAAMM,EAAmBR,EAAI,eAAgB,CAC3C,SAAU,CACR,MAAO,CACL,KAAM,eACN,OAAQ,iBACR,MAAO,aACT,EACA,MAAO,CACL,QAAS,GACT,QAAS,iBACT,OAAQ,cACV,CACF,EACA,gBAAiB,CACf,MAAO,OACP,MAAO,SACT,CACF,CAAC,EAEKS,EAAsBT,EAAI,eAAgB,CAC9C,SAAU,CACR,MAAO,CACL,QAAS,GACT,QAAS,iBACT,OAAQ,cACV,CACF,EACA,gBAAiB,CACf,MAAO,SACT,CACF,CAAC,EACKU,EAAWb,EAAM,WAGrB,CAAC,CAAE,UAAAc,EAAW,GAAGL,CAAM,EAAGC,IAAQ,CAClC,KAAM,CAAE,MAAOK,EAAiB,MAAOC,CAAgB,EAAIhB,EAAM,WAAWI,CAAc,EAC1F,OACEL,EAACG,EAAc,KAAd,CACC,IAAKQ,EACL,UAAWT,EACT,4DACAU,EAAiB,CACf,MAAOI,EACP,MAAOC,CACT,CAAC,EACDF,CACF,EACA,MAAO,CACL,eAAgB,OAChB,gBAAiB,MACnB,EACC,GAAGL,EACN,CAEJ,CAAC,EACDI,EAAS,YAAcX,EAAc,KAAK,YAE1C,MAAMe,EAAcjB,EAAM,WAGxB,CAAC,CAAE,UAAAc,EAAW,QAAAI,EAAS,GAAGT,CAAM,EAAGC,IAAQ,CAC3C,KAAM,CAAE,MAAOM,CAAgB,EAAIhB,EAAM,WAAWI,CAAc,EAC5De,EAAeC,GAA2C,CAC9DF,IAAUE,CAAC,EACX,MAAMC,EAAaD,GAAG,cAChBE,EAAYF,GAAG,eAAe,cACpC,GAAIC,GAAcC,EAAW,CAC3B,MAAMC,EAAUF,EAAW,WACrBG,EAAWH,EAAW,YACtBI,EAAiBH,EAAU,YAC3BI,EAAWH,EAAUE,EAAiB,EAAID,EAAW,EAC3DF,EAAU,SAAS,CACjB,KAAMI,EACN,SAAU,QACZ,CAAC,CACH,CACF,EACA,OACE3B,EAACG,EAAc,QAAd,CACC,IAAKQ,EACL,UAAWT,EACT,8PACAa,EACAF,EAAoB,CAClB,MAAOI,CACT,CAAC,CACH,EACA,QAASG,EACR,GAAGV,EACN,CAEJ,CAAC,EACDQ,EAAY,YAAcf,EAAc,QAAQ,YAEhD,MAAMyB,EAAc3B,EAAM,WAGxB,CAAC,CAAE,UAAAc,EAAW,GAAGL,CAAM,EAAGC,IAAQX,EAACG,EAAc,QAAd,CAAsB,IAAKQ,EAAK,UAAWT,EAAGa,CAAS,EAAI,GAAGL,EAAO,CAAE,EAC5GkB,EAAY,YAAczB,EAAc,QAAQ",
6
- "names": ["jsx", "React", "cn", "TabsPrimitive", "cva", "TabListContext", "Tabs", "children", "align", "shape", "props", "ref", "tabsListVariants", "tabsTriggerVariants", "TabsList", "className", "alignFromParent", "shapeFromParent", "TabsTrigger", "onClick", "handleClick", "e", "tabElement", "container", "tabLeft", "tabWidth", "containerWidth", "scrollTo", "TabsContent"]
4
+ "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../helpers/index.js'\n\nimport * as TabsPrimitive from '@radix-ui/react-tabs'\nimport { cva } from 'class-variance-authority'\nimport type { Align, Shape } from '../types/props.js'\n\ntype tabShape = Shape | 'default'\n\nconst TabListContext = React.createContext<{\n align?: Align\n shape: tabShape\n}>({\n align: 'left',\n shape: 'square',\n})\n\nconst Tabs = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.Root>,\n React.ComponentPropsWithoutRef<typeof TabsPrimitive.Root> & {\n align?: Align\n shape?: tabShape\n }\n>(({ children, align = 'left', shape = 'default', ...props }, ref) => (\n <TabsPrimitive.Root ref={ref} {...props}>\n <TabListContext.Provider value={{ align, shape }}>{children}</TabListContext.Provider>\n </TabsPrimitive.Root>\n))\nTabs.displayName = 'Tabs'\n\nconst tabsListVariants = cva('rounded-tabs', {\n variants: {\n shape: {\n default: '',\n rounded: 'rounded-[28px]',\n square: 'rounded-none',\n },\n },\n defaultVariants: {\n shape: 'default',\n },\n})\n\nconst tabsTriggerVariants = cva('rounded-tabs', {\n variants: {\n shape: {\n default: '',\n rounded: 'rounded-[28px]',\n square: 'rounded-none',\n },\n },\n defaultVariants: {\n shape: 'default',\n },\n})\nconst TabsList = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.List>,\n React.ComponentPropsWithoutRef<typeof TabsPrimitive.List>\n>(({ className, ...props }, ref) => {\n const { align: alignFromParent, shape: shapeFromParent } = React.useContext(TabListContext)\n\n const wrapperClass =\n alignFromParent === 'center'\n ? 'flex w-full justify-center'\n : alignFromParent === 'right'\n ? 'flex w-full justify-end'\n : null\n\n const list = (\n <TabsPrimitive.List\n ref={ref}\n className={cn(\n 'bg-tabs-list-bg flex w-fit max-w-full overflow-x-auto p-1',\n tabsListVariants({ shape: shapeFromParent }),\n className\n )}\n style={{\n scrollbarWidth: 'none',\n msOverflowStyle: 'none',\n }}\n {...props}\n />\n )\n\n return wrapperClass ? <div className={wrapperClass}>{list}</div> : list\n})\nTabsList.displayName = TabsPrimitive.List.displayName\n\nconst TabsTrigger = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.Trigger>,\n React.ComponentPropsWithoutRef<typeof TabsPrimitive.Trigger>\n>(({ className, onClick, ...props }, ref) => {\n const { shape: shapeFromParent } = React.useContext(TabListContext)\n const handleClick = (e: React.MouseEvent<HTMLButtonElement>) => {\n onClick?.(e)\n const tabElement = e?.currentTarget\n const container = e?.currentTarget?.parentElement\n if (tabElement && container) {\n const tabLeft = tabElement.offsetLeft\n const tabWidth = tabElement.offsetWidth\n const containerWidth = container.offsetWidth\n const scrollTo = tabLeft - containerWidth / 2 + tabWidth / 2\n container.scrollTo({\n left: scrollTo,\n behavior: 'smooth',\n })\n }\n }\n return (\n <TabsPrimitive.Trigger\n ref={ref}\n className={cn(\n 'text-info-primary lg-desktop:text-base disabled:text-btn-secondary-disabled lg-desktop:px-[28px] lg-desktop:pt-[15px] lg-desktop:pb-[14px] shrink-0 px-5 pb-2.5 pt-[11px] text-sm font-bold data-[state=active]:bg-white data-[state=active]:text-[#080A0F]',\n className,\n tabsTriggerVariants({\n shape: shapeFromParent,\n })\n )}\n onClick={handleClick}\n {...props}\n />\n )\n})\nTabsTrigger.displayName = TabsPrimitive.Trigger.displayName\n\nconst TabsContent = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.Content>,\n React.ComponentPropsWithoutRef<typeof TabsPrimitive.Content>\n>(({ className, ...props }, ref) => <TabsPrimitive.Content ref={ref} className={cn(className)} {...props} />)\nTabsContent.displayName = TabsPrimitive.Content.displayName\n\nexport { Tabs, TabsList, TabsTrigger, TabsContent }\n"],
5
+ "mappings": "aA2BI,cAAAA,MAAA,oBAzBJ,UAAYC,MAAW,QACvB,OAAS,MAAAC,MAAU,sBAEnB,UAAYC,MAAmB,uBAC/B,OAAS,OAAAC,MAAW,2BAKpB,MAAMC,EAAiBJ,EAAM,cAG1B,CACD,MAAO,OACP,MAAO,QACT,CAAC,EAEKK,EAAOL,EAAM,WAMjB,CAAC,CAAE,SAAAM,EAAU,MAAAC,EAAQ,OAAQ,MAAAC,EAAQ,UAAW,GAAGC,CAAM,EAAGC,IAC5DX,EAACG,EAAc,KAAd,CAAmB,IAAKQ,EAAM,GAAGD,EAChC,SAAAV,EAACK,EAAe,SAAf,CAAwB,MAAO,CAAE,MAAAG,EAAO,MAAAC,CAAM,EAAI,SAAAF,EAAS,EAC9D,CACD,EACDD,EAAK,YAAc,OAEnB,MAAMM,EAAmBR,EAAI,eAAgB,CAC3C,SAAU,CACR,MAAO,CACL,QAAS,GACT,QAAS,iBACT,OAAQ,cACV,CACF,EACA,gBAAiB,CACf,MAAO,SACT,CACF,CAAC,EAEKS,EAAsBT,EAAI,eAAgB,CAC9C,SAAU,CACR,MAAO,CACL,QAAS,GACT,QAAS,iBACT,OAAQ,cACV,CACF,EACA,gBAAiB,CACf,MAAO,SACT,CACF,CAAC,EACKU,EAAWb,EAAM,WAGrB,CAAC,CAAE,UAAAc,EAAW,GAAGL,CAAM,EAAGC,IAAQ,CAClC,KAAM,CAAE,MAAOK,EAAiB,MAAOC,CAAgB,EAAIhB,EAAM,WAAWI,CAAc,EAEpFa,EACJF,IAAoB,SAChB,6BACAA,IAAoB,QAClB,0BACA,KAEFG,EACJnB,EAACG,EAAc,KAAd,CACC,IAAKQ,EACL,UAAWT,EACT,4DACAU,EAAiB,CAAE,MAAOK,CAAgB,CAAC,EAC3CF,CACF,EACA,MAAO,CACL,eAAgB,OAChB,gBAAiB,MACnB,EACC,GAAGL,EACN,EAGF,OAAOQ,EAAelB,EAAC,OAAI,UAAWkB,EAAe,SAAAC,EAAK,EAASA,CACrE,CAAC,EACDL,EAAS,YAAcX,EAAc,KAAK,YAE1C,MAAMiB,EAAcnB,EAAM,WAGxB,CAAC,CAAE,UAAAc,EAAW,QAAAM,EAAS,GAAGX,CAAM,EAAGC,IAAQ,CAC3C,KAAM,CAAE,MAAOM,CAAgB,EAAIhB,EAAM,WAAWI,CAAc,EAC5DiB,EAAeC,GAA2C,CAC9DF,IAAUE,CAAC,EACX,MAAMC,EAAaD,GAAG,cAChBE,EAAYF,GAAG,eAAe,cACpC,GAAIC,GAAcC,EAAW,CAC3B,MAAMC,EAAUF,EAAW,WACrBG,EAAWH,EAAW,YACtBI,EAAiBH,EAAU,YAC3BI,EAAWH,EAAUE,EAAiB,EAAID,EAAW,EAC3DF,EAAU,SAAS,CACjB,KAAMI,EACN,SAAU,QACZ,CAAC,CACH,CACF,EACA,OACE7B,EAACG,EAAc,QAAd,CACC,IAAKQ,EACL,UAAWT,EACT,8PACAa,EACAF,EAAoB,CAClB,MAAOI,CACT,CAAC,CACH,EACA,QAASK,EACR,GAAGZ,EACN,CAEJ,CAAC,EACDU,EAAY,YAAcjB,EAAc,QAAQ,YAEhD,MAAM2B,EAAc7B,EAAM,WAGxB,CAAC,CAAE,UAAAc,EAAW,GAAGL,CAAM,EAAGC,IAAQX,EAACG,EAAc,QAAd,CAAsB,IAAKQ,EAAK,UAAWT,EAAGa,CAAS,EAAI,GAAGL,EAAO,CAAE,EAC5GoB,EAAY,YAAc3B,EAAc,QAAQ",
6
+ "names": ["jsx", "React", "cn", "TabsPrimitive", "cva", "TabListContext", "Tabs", "children", "align", "shape", "props", "ref", "tabsListVariants", "tabsTriggerVariants", "TabsList", "className", "alignFromParent", "shapeFromParent", "wrapperClass", "list", "TabsTrigger", "onClick", "handleClick", "e", "tabElement", "container", "tabLeft", "tabWidth", "containerWidth", "scrollTo", "TabsContent"]
7
7
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@anker-in/headless-ui",
3
- "version": "1.3.8",
3
+ "version": "1.3.9",
4
4
  "type": "commonjs",
5
5
  "main": "./dist/cjs/index.js",
6
6
  "types": "./dist/cjs/index.d.ts",
package/style.css CHANGED
@@ -2722,6 +2722,10 @@ video {
2722
2722
  --tw-bg-opacity: 1 !important;
2723
2723
  background-color: rgb(8 10 15 / var(--tw-bg-opacity, 1)) !important;
2724
2724
  }
2725
+ .\!bg-\[\#1E2024\] {
2726
+ --tw-bg-opacity: 1 !important;
2727
+ background-color: rgb(30 32 36 / var(--tw-bg-opacity, 1)) !important;
2728
+ }
2725
2729
  .\!bg-\[\#E8E8E8\] {
2726
2730
  --tw-bg-opacity: 1 !important;
2727
2731
  background-color: rgb(232 232 232 / var(--tw-bg-opacity, 1)) !important;