@anker-in/headless-ui 1.1.34-alpha.1768461697532 → 1.1.34-alpha.1768472366452
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/biz-components/EventSchedule/index.js +1 -1
- package/dist/cjs/biz-components/EventSchedule/index.js.map +3 -3
- package/dist/cjs/biz-components/HeaderNavigation/MobileMenuComponents.js +1 -1
- package/dist/cjs/biz-components/HeaderNavigation/MobileMenuComponents.js.map +2 -2
- package/dist/cjs/biz-components/HeaderNavigation/SidebarDropdown.js +1 -1
- package/dist/cjs/biz-components/HeaderNavigation/SidebarDropdown.js.map +2 -2
- package/dist/cjs/biz-components/PromotionalBar/index.js +1 -1
- package/dist/cjs/biz-components/PromotionalBar/index.js.map +2 -2
- package/dist/cjs/biz-components/Title/Countdown.js +1 -1
- package/dist/cjs/biz-components/Title/Countdown.js.map +2 -2
- package/dist/cjs/biz-components/Title/index.js +1 -1
- package/dist/cjs/biz-components/Title/index.js.map +2 -2
- package/dist/esm/biz-components/EventSchedule/index.js +1 -1
- package/dist/esm/biz-components/EventSchedule/index.js.map +3 -3
- package/dist/esm/biz-components/HeaderNavigation/MobileMenuComponents.js +1 -1
- package/dist/esm/biz-components/HeaderNavigation/MobileMenuComponents.js.map +2 -2
- package/dist/esm/biz-components/HeaderNavigation/SidebarDropdown.js +1 -1
- package/dist/esm/biz-components/HeaderNavigation/SidebarDropdown.js.map +2 -2
- package/dist/esm/biz-components/PromotionalBar/index.js +1 -1
- package/dist/esm/biz-components/PromotionalBar/index.js.map +2 -2
- package/dist/esm/biz-components/Title/Countdown.js +1 -1
- package/dist/esm/biz-components/Title/Countdown.js.map +2 -2
- package/dist/esm/biz-components/Title/index.js +1 -1
- package/dist/esm/biz-components/Title/index.js.map +2 -2
- package/dist/tokens/anker.css +1 -0
- package/dist/tokens/base.css +8 -0
- package/dist/tokens/solix.css +1 -0
- package/package.json +1 -1
- package/style.css +19 -0
- package/tailwind.config.js +1 -0
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use client";import{jsx as a,jsxs as T}from"react/jsx-runtime";import g,{useState as N,useEffect as M}from"react";import x from"dayjs";import{cn as h}from"../../helpers/utils.js";import{cva as b}from"class-variance-authority";const y=r=>{const i=x(),t=x(r).diff(i,"second");if(t<=0)return{days:0,hours:0,minutes:0,seconds:0};const
|
|
1
|
+
"use client";import{jsx as a,jsxs as T}from"react/jsx-runtime";import g,{useState as N,useEffect as M}from"react";import x from"dayjs";import{cn as h}from"../../helpers/utils.js";import{cva as b}from"class-variance-authority";const y=r=>{const i=x(),t=x(r).diff(i,"second");if(t<=0)return{days:0,hours:0,minutes:0,seconds:0};const d=Math.floor(t/(24*60*60)),l=Math.floor(t%(24*60*60)/(60*60)),f=Math.floor(t%(60*60)/60),p=t%60;return{days:d,hours:l,minutes:f,seconds:p}},S=b("lg-desktop:size-12 lg-desktop:px-1 flex size-10 flex-col items-center justify-center px-[2px] text-center",{variants:{theme:{light:"bg-info-primary",dark:"bg-[#f5f6f7]"}},defaultVariants:{theme:"light"}}),v=b("",{variants:{theme:{light:"text-white",dark:"text-[#080A0F]"}},defaultVariants:{theme:"light"}}),D=({value:r,label:i,theme:e="light"})=>T("div",{className:S({theme:e}),children:[a("p",{className:h("lg-desktop:text-2xl text-[20px] font-bold leading-[1.2] tracking-[-0.96px]",v({theme:e})),children:String(r).padStart(2,"0")}),a("p",{className:h("mt-[-6px] text-[12px] font-bold leading-[1.4] tracking-[-0.24px]",v({theme:e})),children:i})]}),V=()=>a("p",{className:"lg-desktop:text-2xl text-info-primary text-center text-xl font-bold leading-[1.2] tracking-[-0.96px]",children:":"}),w=g.forwardRef(({config:r,className:i,onCountdownEnd:e,theme:t="light"},d)=>{const{targetDate:l,showDays:f=!0,showHours:p=!0,showMinutes:k=!0,showSeconds:C=!0,labels:u={}}=r,[c,L]=N(()=>y(l));M(()=>{const o=setInterval(()=>{const s=y(l);L(s),s.days===0&&s.hours===0&&s.minutes===0&&s.seconds===0&&(e?.(),clearInterval(o))},1e3);return()=>clearInterval(o)},[l,e]);const m={days:u.days||"Day",hours:u.hours||"Hours",minutes:u.minutes||"Mins",seconds:u.seconds||"Secs"},n=[];return f&&n.push({value:c.days,label:m.days}),p&&n.push({value:c.hours,label:m.hours}),k&&n.push({value:c.minutes,label:m.minutes}),C&&n.push({value:c.seconds,label:m.seconds}),a("div",{ref:d,className:h("flex items-center gap-1",i),children:n.map((o,s)=>T(g.Fragment,{children:[a(D,{value:o.value,label:o.label,theme:t}),s<n.length-1&&a(V,{})]},o.label))})});w.displayName="Countdown";var R=w;export{R as default};
|
|
2
2
|
//# sourceMappingURL=Countdown.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/Title/Countdown.tsx"],
|
|
4
|
-
"sourcesContent": ["'use client'\nimport React, { useState, useEffect } from 'react'\nimport dayjs from 'dayjs'\nimport { cn } from '../../helpers/utils.js'\nimport { cva } from 'class-variance-authority'\nimport type { CountdownConfig } from './types.js'\nimport type { Theme } from '../../types/props.js'\n\ninterface CountdownProps {\n config: CountdownConfig\n className?: string\n onCountdownEnd?: () => void\n theme?: Theme\n}\n\ninterface TimeLeft {\n days: number\n hours: number\n minutes: number\n seconds: number\n}\n\n/**\n * \u8BA1\u7B97\u5269\u4F59\u65F6\u95F4\n */\nconst calculateTimeLeft = (targetDate: string): TimeLeft => {\n const now = dayjs()\n const target = dayjs(targetDate)\n const diff = target.diff(now, 'second')\n\n if (diff <= 0) {\n return { days: 0, hours: 0, minutes: 0, seconds: 0 }\n }\n\n const days = Math.floor(diff / (24 * 60 * 60))\n const hours = Math.floor((diff % (24 * 60 * 60)) / (60 * 60))\n const minutes = Math.floor((diff % (60 * 60)) / 60)\n const seconds = diff % 60\n\n return { days, hours, minutes, seconds }\n}\n\n/**\n * \u5012\u8BA1\u65F6\u6570\u5B57\u5757\u80CC\u666F\u8272\u6837\u5F0F\u53D8\u4F53\n */\nconst countdownUnitVariants = cva(\n 'lg-desktop:size-12 lg-desktop:px-1 flex size-10 flex-col items-center justify-center px-[2px] text-center',\n {\n variants: {\n theme: {\n light: 'bg-info-primary',\n dark: 'bg-[#f5f6f7]',\n },\n },\n defaultVariants: {\n theme: 'light',\n },\n }\n)\n\n/**\n * \u5012\u8BA1\u65F6\u6587\u5B57\u989C\u8272\u6837\u5F0F\u53D8\u4F53\n */\nconst countdownTextVariants = cva('', {\n variants: {\n theme: {\n light: 'text-white',\n dark: 'text-[#080A0F]',\n },\n },\n defaultVariants: {\n theme: 'light',\n },\n})\n\n/**\n * \u5012\u8BA1\u65F6\u6570\u5B57\u5757\u7EC4\u4EF6\n */\nconst CountdownUnit = ({ value, label, theme = 'light' }: { value: number; label: string; theme?: Theme }) => {\n return (\n <div className={countdownUnitVariants({ theme })}>\n <p\n className={cn(\n 'lg-desktop:text-2xl text-[20px] font-bold leading-[1.2] tracking-[-0.96px]',\n countdownTextVariants({ theme })\n )}\n >\n {String(value).padStart(2, '0')}\n </p>\n <p
|
|
5
|
-
"mappings": "aAgFI,OACE,OAAAA,EADF,QAAAC,MAAA,oBA/EJ,OAAOC,GAAS,YAAAC,EAAU,aAAAC,MAAiB,QAC3C,OAAOC,MAAW,QAClB,OAAS,MAAAC,MAAU,yBACnB,OAAS,OAAAC,MAAW,2BAqBpB,MAAMC,EAAqBC,GAAiC,CAC1D,MAAMC,EAAML,EAAM,EAEZM,EADSN,EAAMI,CAAU,EACX,KAAKC,EAAK,QAAQ,EAEtC,GAAIC,GAAQ,EACV,MAAO,CAAE,KAAM,EAAG,MAAO,EAAG,QAAS,EAAG,QAAS,CAAE,EAGrD,MAAMC,EAAO,KAAK,MAAMD,GAAQ,GAAK,GAAK,GAAG,EACvCE,EAAQ,KAAK,MAAOF,GAAQ,GAAK,GAAK,KAAQ,GAAK,GAAG,EACtDG,EAAU,KAAK,MAAOH,GAAQ,GAAK,IAAO,EAAE,EAC5CI,EAAUJ,EAAO,GAEvB,MAAO,CAAE,KAAAC,EAAM,MAAAC,EAAO,QAAAC,EAAS,QAAAC,CAAQ,CACzC,EAKMC,EAAwBT,EAC5B,4GACA,CACE,SAAU,CACR,MAAO,CACL,MAAO,kBACP,KAAM,cACR,CACF,EACA,gBAAiB,CACf,MAAO,OACT,CACF,CACF,EAKMU,EAAwBV,EAAI,GAAI,CACpC,SAAU,CACR,MAAO,CACL,MAAO,aACP,KAAM,gBACR,CACF,EACA,gBAAiB,CACf,MAAO,OACT,CACF,CAAC,EAKKW,EAAgB,CAAC,CAAE,MAAAC,EAAO,MAAAC,EAAO,MAAAC,EAAQ,OAAQ,IAEnDpB,EAAC,OAAI,UAAWe,EAAsB,CAAE,MAAAK,CAAM,CAAC,EAC7C,UAAArB,EAAC,KACC,UAAWM,EACT,6EACAW,EAAsB,CAAE,MAAAI,CAAM,CAAC,CACjC,EAEC,gBAAOF,CAAK,EAAE,SAAS,EAAG,GAAG,EAChC,EACAnB,EAAC,
|
|
4
|
+
"sourcesContent": ["'use client'\nimport React, { useState, useEffect } from 'react'\nimport dayjs from 'dayjs'\nimport { cn } from '../../helpers/utils.js'\nimport { cva } from 'class-variance-authority'\nimport type { CountdownConfig } from './types.js'\nimport type { Theme } from '../../types/props.js'\n\ninterface CountdownProps {\n config: CountdownConfig\n className?: string\n onCountdownEnd?: () => void\n theme?: Theme\n}\n\ninterface TimeLeft {\n days: number\n hours: number\n minutes: number\n seconds: number\n}\n\n/**\n * \u8BA1\u7B97\u5269\u4F59\u65F6\u95F4\n */\nconst calculateTimeLeft = (targetDate: string): TimeLeft => {\n const now = dayjs()\n const target = dayjs(targetDate)\n const diff = target.diff(now, 'second')\n\n if (diff <= 0) {\n return { days: 0, hours: 0, minutes: 0, seconds: 0 }\n }\n\n const days = Math.floor(diff / (24 * 60 * 60))\n const hours = Math.floor((diff % (24 * 60 * 60)) / (60 * 60))\n const minutes = Math.floor((diff % (60 * 60)) / 60)\n const seconds = diff % 60\n\n return { days, hours, minutes, seconds }\n}\n\n/**\n * \u5012\u8BA1\u65F6\u6570\u5B57\u5757\u80CC\u666F\u8272\u6837\u5F0F\u53D8\u4F53\n */\nconst countdownUnitVariants = cva(\n 'lg-desktop:size-12 lg-desktop:px-1 flex size-10 flex-col items-center justify-center px-[2px] text-center',\n {\n variants: {\n theme: {\n light: 'bg-info-primary',\n dark: 'bg-[#f5f6f7]',\n },\n },\n defaultVariants: {\n theme: 'light',\n },\n }\n)\n\n/**\n * \u5012\u8BA1\u65F6\u6587\u5B57\u989C\u8272\u6837\u5F0F\u53D8\u4F53\n */\nconst countdownTextVariants = cva('', {\n variants: {\n theme: {\n light: 'text-white',\n dark: 'text-[#080A0F]',\n },\n },\n defaultVariants: {\n theme: 'light',\n },\n})\n\n/**\n * \u5012\u8BA1\u65F6\u6570\u5B57\u5757\u7EC4\u4EF6\n */\nconst CountdownUnit = ({ value, label, theme = 'light' }: { value: number; label: string; theme?: Theme }) => {\n return (\n <div className={countdownUnitVariants({ theme })}>\n <p\n className={cn(\n 'lg-desktop:text-2xl text-[20px] font-bold leading-[1.2] tracking-[-0.96px]',\n countdownTextVariants({ theme })\n )}\n >\n {String(value).padStart(2, '0')}\n </p>\n <p\n className={cn(\n 'mt-[-6px] text-[12px] font-bold leading-[1.4] tracking-[-0.24px]',\n countdownTextVariants({ theme })\n )}\n >\n {label}\n </p>\n </div>\n )\n}\n\n/**\n * \u5012\u8BA1\u65F6\u5206\u9694\u7B26\n */\nconst CountdownSeparator = () => {\n return (\n <p className=\"lg-desktop:text-2xl text-info-primary text-center text-xl font-bold leading-[1.2] tracking-[-0.96px]\">\n :\n </p>\n )\n}\n\n/**\n * Countdown - \u5012\u8BA1\u65F6\u7EC4\u4EF6\n */\nconst Countdown = React.forwardRef<HTMLDivElement, CountdownProps>(\n ({ config, className, onCountdownEnd, theme = 'light' }, ref) => {\n const {\n targetDate,\n showDays = true,\n showHours = true,\n showMinutes = true,\n showSeconds = true,\n labels = {},\n } = config\n\n const [timeLeft, setTimeLeft] = useState<TimeLeft>(() => calculateTimeLeft(targetDate))\n\n useEffect(() => {\n const timer = setInterval(() => {\n const newTimeLeft = calculateTimeLeft(targetDate)\n setTimeLeft(newTimeLeft)\n\n // \u68C0\u67E5\u5012\u8BA1\u65F6\u662F\u5426\u7ED3\u675F\n if (\n newTimeLeft.days === 0 &&\n newTimeLeft.hours === 0 &&\n newTimeLeft.minutes === 0 &&\n newTimeLeft.seconds === 0\n ) {\n onCountdownEnd?.()\n clearInterval(timer)\n }\n }, 1000)\n\n return () => clearInterval(timer)\n }, [targetDate, onCountdownEnd])\n\n const defaultLabels = {\n days: labels.days || 'Day',\n hours: labels.hours || 'Hours',\n minutes: labels.minutes || 'Mins',\n seconds: labels.seconds || 'Secs',\n }\n\n const units = []\n if (showDays) units.push({ value: timeLeft.days, label: defaultLabels.days })\n if (showHours) units.push({ value: timeLeft.hours, label: defaultLabels.hours })\n if (showMinutes) units.push({ value: timeLeft.minutes, label: defaultLabels.minutes })\n if (showSeconds) units.push({ value: timeLeft.seconds, label: defaultLabels.seconds })\n\n return (\n <div ref={ref} className={cn('flex items-center gap-1', className)}>\n {units.map((unit, index) => (\n <React.Fragment key={unit.label}>\n <CountdownUnit value={unit.value} label={unit.label} theme={theme} />\n {index < units.length - 1 && <CountdownSeparator />}\n </React.Fragment>\n ))}\n </div>\n )\n }\n)\n\nCountdown.displayName = 'Countdown'\n\nexport default Countdown\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["jsx", "jsxs", "React", "useState", "useEffect", "dayjs", "cn", "cva", "calculateTimeLeft", "targetDate", "now", "diff", "days", "hours", "minutes", "seconds", "countdownUnitVariants", "countdownTextVariants", "CountdownUnit", "value", "label", "theme", "CountdownSeparator", "Countdown", "config", "className", "onCountdownEnd", "ref", "showDays", "showHours", "showMinutes", "showSeconds", "labels", "timeLeft", "setTimeLeft", "timer", "newTimeLeft", "defaultLabels", "units", "unit", "index", "Countdown_default"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use client";import{jsx as t,jsxs as v}from"react/jsx-runtime";import Q,{useEffect as
|
|
1
|
+
"use client";import{jsx as t,jsxs as v}from"react/jsx-runtime";import Q,{useEffect as W,useRef as u,useImperativeHandle as X,useState as Y}from"react";import{gsap as w}from"gsap";import{SplitText as L}from"gsap/dist/SplitText";import{ScrollTrigger as R}from"gsap/dist/ScrollTrigger";import{cn as r}from"../../helpers/utils.js";import{cva as E}from"class-variance-authority";import{Heading as tt,Text as et}from"../../components/index.js";import{withLayout as nt}from"../../shared/Styles.js";import{trackUrlRef as rt}from"../../shared/trackUrlRef.js";import{useInView as st}from"react-intersection-observer";import it from"./Countdown.js";const H="link",V="title",ot=E("",{variants:{theme:{light:"text-[#080A0F]",dark:"text-[#F5F6F7]"}},defaultVariants:{theme:"light"}}),at=E("desktop:text-base desktop:mt-2 lg-desktop:text-[18px] mt-1 text-[14px] font-bold leading-[1.4] tracking-[-0.36px]",{variants:{theme:{light:"text-[#080A0F]",dark:"text-[#F5F6F7]"}},defaultVariants:{theme:"light"}}),M=({data:s,className:f})=>{const{theme:e="light",extensions:i,title:p,caption:d,align:o}=s;return i?.textLink?v("a",{className:r({"aiui-dark":e==="dark"},"hover:text-brand-0 [&_svg_path]:hover:stroke-brand-0 lg-desktop:text-base flex items-center overflow-hidden text-sm font-[700] leading-[1.4] transition-all duration-[0.4s]",{"text-[#080A0F]":e==="light"},{"text-[#F5F6F7]":e==="dark"},{"justify-center mt-4":o==="center"},f),href:rt(i?.link,`${H}_${V}`),"data-headless-type-name":`${H}#${V}`,"data-headless-title-desc-button":`${p}#${d}`,children:[t("div",{className:r("flex-1 truncate whitespace-nowrap",{"flex-none":o==="center"}),children:i?.textLink}),t("div",{className:"lg-desktop:size-5 size-4",children:t("svg",{xmlns:"http://www.w3.org/2000/svg",width:"100%",height:"100%",viewBox:"0 0 16 16",fill:"none",children:t("path",{d:"M5.52876 3.52876C5.78911 3.26841 6.21112 3.26841 6.47147 3.52876L10.4715 7.52876C10.7318 7.78911 10.7318 8.21112 10.4715 8.47147L6.47147 12.4715C6.21112 12.7318 5.78911 12.7318 5.52876 12.4715C5.26841 12.2111 5.26841 11.7891 5.52876 11.5288L9.0574 8.00011L5.52876 4.47147C5.26841 4.21112 5.26841 3.78911 5.52876 3.52876Z",stroke:e==="dark"?"#F5F6F7":"#080A0F"})})})]}):null},$=Q.forwardRef(({data:s,className:f,as:e="h2",weight:i="bold"},p)=>{const{title:d,caption:o,subtitle:k,countdown:b,showCountdown:z=!1,theme:m="light",extensions:P,align:a="left"}=s,T=u(null),l=u(null),n=u(null),c=u(null),[S,j]=Y(!0),{ref:A,inView:F}=st();X(p,()=>T.current);const I=()=>{j(!1)};return W(()=>{w.registerPlugin(L,R);function B(){if(!l.current)return;const D=l.current?.clientHeight||80;n.current&&n.current.revert(),c.current&&c.current.kill(),n.current=new L(l.current,{type:"words",wordsClass:"word"});const g=n.current.words;w.set(g,{opacity:0}),c.current=R.create({trigger:l.current,start:"bottom bottom-=4%",end:`bottom+=${D*1.5+60}px bottom-=4%`,scrub:!0,invalidateOnRefresh:!0,onUpdate:_=>{const U=_.progress,y=g.length||1,O=.5,h=1/y,N=h*(1-O),C=(y-1)*N+h,Z=Math.min(1,C>0?U/C:0);g.forEach((q,G)=>{const J=G*N,K=h;let x=(Z-J)/K;x=Math.max(0,Math.min(1,x)),w.set(q,{opacity:x})})}})}return F&&B(),()=>{n.current&&n.current.revert(),c.current&&c.current.kill()}},[F]),(d||o)&&v("div",{id:P?.id,className:"titleBottom title-box mb-6 flex items-end justify-between gap-2",ref:T,children:[v("div",{ref:A,className:r("flex-1",f,{"aiui-dark":m==="dark","text-center":a==="center","text-left":a==="left"}),children:[t(tt,{ref:l,as:e,size:4,html:o||d,weight:i,className:ot({theme:m})}),k&&t(et,{html:k,as:"p",className:at({theme:m})}),t(M,{data:s,className:r({hidden:a==="left"})}),z&&b&&S&&t(it,{className:r("mt-4 justify-start",{"justify-center":a==="center"}),config:b,onCountdownEnd:I,theme:m})]}),t(M,{data:s,className:r({hidden:a==="center"})})]})});$.displayName="Title";var vt=nt($);export{vt as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/Title/index.tsx"],
|
|
4
|
-
"sourcesContent": ["'use client'\nimport React, { useEffect, useRef, useImperativeHandle, useState } from 'react'\nimport { gsap } from 'gsap'\nimport { SplitText } from 'gsap/dist/SplitText'\nimport { ScrollTrigger } from 'gsap/dist/ScrollTrigger'\nimport { cn } from '../../helpers/utils.js'\nimport { cva } from 'class-variance-authority'\nimport { Heading, Text } from '../../components/index.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport type { TitleProps } from './types.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport { useInView } from 'react-intersection-observer'\nimport Countdown from './Countdown.js'\n\nconst componentType = 'link'\nconst componentName = 'title'\n\n/**\n * \u6807\u9898\u6837\u5F0F\u53D8\u4F53\n */\nconst titleHeadingVariants = cva('', {\n variants: {\n theme: {\n light: 'text-[#080A0F]',\n dark: 'text-[#F5F6F7]',\n },\n },\n defaultVariants: {\n theme: 'light',\n },\n})\n\n/**\n * \u526F\u6807\u9898\u6837\u5F0F\u53D8\u4F53\n */\nconst subtitleVariants = cva(\n 'desktop:text-base desktop:mt-2 lg-desktop:text-[18px] mt-1 text-[14px] font-bold leading-[1.4] tracking-[-0.36px]',\n {\n variants: {\n theme: {\n light: 'text-[#080A0F]',\n dark: 'text-[#F5F6F7]',\n },\n },\n defaultVariants: {\n theme: 'light',\n },\n }\n)\n\nconst TitleButton = ({ data, className }: { data: TitleProps['data']; className?: string }) => {\n const { theme = 'light', extensions, title, caption, align } = data\n if (!extensions?.textLink) return null\n return (\n <a\n className={cn(\n { 'aiui-dark': theme === 'dark' },\n 'hover:text-brand-0 [&_svg_path]:hover:stroke-brand-0 flex items-center overflow-hidden text-
|
|
5
|
-
"mappings": "aAsDI,OAaE,OAAAA,EAbF,QAAAC,MAAA,oBArDJ,OAAOC,GAAS,aAAAC,EAAW,UAAAC,EAAQ,uBAAAC,EAAqB,YAAAC,MAAgB,QACxE,OAAS,QAAAC,MAAY,OACrB,OAAS,aAAAC,MAAiB,sBAC1B,OAAS,iBAAAC,MAAqB,0BAC9B,OAAS,MAAAC,MAAU,yBACnB,OAAS,OAAAC,MAAW,2BACpB,OAAS,WAAAC,GAAS,QAAAC,OAAY,4BAC9B,OAAS,cAAAC,OAAkB,yBAE3B,OAAS,eAAAC,OAAmB,8BAC5B,OAAS,aAAAC,OAAiB,8BAC1B,OAAOC,OAAe,iBAEtB,MAAMC,EAAgB,OAChBC,EAAgB,QAKhBC,GAAuBT,EAAI,GAAI,CACnC,SAAU,CACR,MAAO,CACL,MAAO,iBACP,KAAM,gBACR,CACF,EACA,gBAAiB,CACf,MAAO,OACT,CACF,CAAC,EAKKU,GAAmBV,EACvB,oHACA,CACE,SAAU,CACR,MAAO,CACL,MAAO,iBACP,KAAM,gBACR,CACF,EACA,gBAAiB,CACf,MAAO,OACT,CACF,CACF,EAEMW,EAAc,CAAC,CAAE,KAAAC,EAAM,UAAAC,CAAU,IAAwD,CAC7F,KAAM,CAAE,MAAAC,EAAQ,QAAS,WAAAC,EAAY,MAAAC,EAAO,QAAAC,EAAS,MAAAC,CAAM,EAAIN,EAC/D,OAAKG,GAAY,SAEfzB,EAAC,KACC,UAAWS,EACT,CAAE,YAAae,IAAU,MAAO,EAChC,
|
|
4
|
+
"sourcesContent": ["'use client'\nimport React, { useEffect, useRef, useImperativeHandle, useState } from 'react'\nimport { gsap } from 'gsap'\nimport { SplitText } from 'gsap/dist/SplitText'\nimport { ScrollTrigger } from 'gsap/dist/ScrollTrigger'\nimport { cn } from '../../helpers/utils.js'\nimport { cva } from 'class-variance-authority'\nimport { Heading, Text } from '../../components/index.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport type { TitleProps } from './types.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport { useInView } from 'react-intersection-observer'\nimport Countdown from './Countdown.js'\n\nconst componentType = 'link'\nconst componentName = 'title'\n\n/**\n * \u6807\u9898\u6837\u5F0F\u53D8\u4F53\n */\nconst titleHeadingVariants = cva('', {\n variants: {\n theme: {\n light: 'text-[#080A0F]',\n dark: 'text-[#F5F6F7]',\n },\n },\n defaultVariants: {\n theme: 'light',\n },\n})\n\n/**\n * \u526F\u6807\u9898\u6837\u5F0F\u53D8\u4F53\n */\nconst subtitleVariants = cva(\n 'desktop:text-base desktop:mt-2 lg-desktop:text-[18px] mt-1 text-[14px] font-bold leading-[1.4] tracking-[-0.36px]',\n {\n variants: {\n theme: {\n light: 'text-[#080A0F]',\n dark: 'text-[#F5F6F7]',\n },\n },\n defaultVariants: {\n theme: 'light',\n },\n }\n)\n\nconst TitleButton = ({ data, className }: { data: TitleProps['data']; className?: string }) => {\n const { theme = 'light', extensions, title, caption, align } = data\n if (!extensions?.textLink) return null\n return (\n <a\n className={cn(\n { 'aiui-dark': theme === 'dark' },\n 'hover:text-brand-0 [&_svg_path]:hover:stroke-brand-0 lg-desktop:text-base flex items-center overflow-hidden text-sm font-[700] leading-[1.4] transition-all duration-[0.4s]',\n { 'text-[#080A0F]': theme === 'light' },\n { 'text-[#F5F6F7]': theme === 'dark' },\n { 'justify-center mt-4': align === 'center' },\n className\n )}\n href={trackUrlRef(extensions?.link, `${componentType}_${componentName}`)}\n data-headless-type-name={`${componentType}#${componentName}`}\n data-headless-title-desc-button={`${title}#${caption}`}\n >\n <div\n className={cn('flex-1 truncate whitespace-nowrap', {\n 'flex-none': align === 'center',\n })}\n >\n {extensions?.textLink}\n </div>\n <div className=\"lg-desktop:size-5 size-4\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"100%\" height=\"100%\" viewBox=\"0 0 16 16\" fill=\"none\">\n <path\n d=\"M5.52876 3.52876C5.78911 3.26841 6.21112 3.26841 6.47147 3.52876L10.4715 7.52876C10.7318 7.78911 10.7318 8.21112 10.4715 8.47147L6.47147 12.4715C6.21112 12.7318 5.78911 12.7318 5.52876 12.4715C5.26841 12.2111 5.26841 11.7891 5.52876 11.5288L9.0574 8.00011L5.52876 4.47147C5.26841 4.21112 5.26841 3.78911 5.52876 3.52876Z\"\n stroke={theme === 'dark' ? '#F5F6F7' : '#080A0F'}\n />\n </svg>\n </div>\n </a>\n )\n}\n\nconst Title = React.forwardRef<HTMLDivElement, TitleProps>(({ data, className, as = 'h2', weight = 'bold' }, ref) => {\n const {\n title,\n caption,\n subtitle,\n countdown,\n showCountdown = false,\n theme = 'light',\n extensions,\n align = 'left',\n } = data\n const innerRef = useRef<HTMLDivElement>(null)\n const titleRef = useRef<HTMLHeadingElement>(null)\n const splitTextInstance = useRef<SplitText | null>(null)\n const scrollTriggerRef = useRef<ScrollTrigger | null>(null)\n\n // \u63A7\u5236\u5012\u8BA1\u65F6\u663E\u793A\u72B6\u6001\n const [isCountdownVisible, setIsCountdownVisible] = useState(true)\n\n const { ref: inViewRef, inView } = useInView()\n\n useImperativeHandle(ref, () => innerRef.current as HTMLDivElement)\n\n // \u5012\u8BA1\u65F6\u7ED3\u675F\u56DE\u8C03\n const handleCountdownEnd = () => {\n setIsCountdownVisible(false)\n }\n\n useEffect(() => {\n gsap.registerPlugin(SplitText, ScrollTrigger)\n function gsapResize() {\n if (!titleRef.current) return\n const height = titleRef.current?.clientHeight || 80\n if (splitTextInstance.current) {\n splitTextInstance.current.revert()\n }\n if (scrollTriggerRef.current) {\n scrollTriggerRef.current.kill()\n }\n splitTextInstance.current = new SplitText(titleRef.current, {\n type: 'words',\n wordsClass: 'word',\n })\n const words = splitTextInstance.current.words\n gsap.set(words, { opacity: 0 })\n scrollTriggerRef.current = ScrollTrigger.create({\n trigger: titleRef.current,\n start: 'bottom bottom-=4%',\n end: `bottom+=${height * 1.5 + 60}px bottom-=4%`,\n scrub: true,\n invalidateOnRefresh: true,\n onUpdate: (self: any) => {\n const progress = self.progress\n const total = words.length || 1\n const overlap = 0.5\n const interval = 1 / total\n const step = interval * (1 - overlap)\n const lastEnd = (total - 1) * step + interval\n const normalizedProgress = Math.min(1, lastEnd > 0 ? progress / lastEnd : 0)\n words.forEach((word: any, i: number) => {\n const start = i * step\n const width = interval\n let opacity = (normalizedProgress - start) / width\n opacity = Math.max(0, Math.min(1, opacity))\n gsap.set(word, { opacity })\n })\n },\n })\n }\n\n if (inView) {\n gsapResize()\n }\n\n return () => {\n splitTextInstance.current && splitTextInstance.current.revert()\n // ScrollTrigger.getAll().forEach((t: { kill: () => any }) => t.kill())\n scrollTriggerRef.current && scrollTriggerRef.current.kill()\n }\n }, [inView])\n\n return (\n (title || caption) && (\n <div\n id={extensions?.id}\n className=\"titleBottom title-box mb-6 flex items-end justify-between gap-2\"\n ref={innerRef}\n >\n <div\n ref={inViewRef}\n className={cn('flex-1', className, {\n 'aiui-dark': theme === 'dark',\n 'text-center': align === 'center',\n 'text-left': align === 'left',\n })}\n >\n <Heading\n ref={titleRef}\n as={as}\n size={4}\n html={caption || title}\n weight={weight}\n className={titleHeadingVariants({ theme })}\n />\n {subtitle && <Text html={subtitle} as=\"p\" className={subtitleVariants({ theme })} />}\n <TitleButton data={data} className={cn({ hidden: align === 'left' })} />\n {showCountdown && countdown && isCountdownVisible && (\n <Countdown\n className={cn('mt-4 justify-start', {\n 'justify-center': align === 'center',\n })}\n config={countdown}\n onCountdownEnd={handleCountdownEnd}\n theme={theme}\n />\n )}\n </div>\n <TitleButton data={data} className={cn({ hidden: align === 'center' })} />\n </div>\n )\n )\n})\n\nTitle.displayName = 'Title'\n\nexport default withLayout(Title)\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["jsx", "jsxs", "React", "useEffect", "useRef", "useImperativeHandle", "useState", "gsap", "SplitText", "ScrollTrigger", "cn", "cva", "Heading", "Text", "withLayout", "trackUrlRef", "useInView", "Countdown", "componentType", "componentName", "titleHeadingVariants", "subtitleVariants", "TitleButton", "data", "className", "theme", "extensions", "title", "caption", "align", "Title", "as", "weight", "ref", "subtitle", "countdown", "showCountdown", "innerRef", "titleRef", "splitTextInstance", "scrollTriggerRef", "isCountdownVisible", "setIsCountdownVisible", "inViewRef", "inView", "handleCountdownEnd", "gsapResize", "height", "words", "self", "progress", "total", "overlap", "interval", "step", "lastEnd", "normalizedProgress", "word", "i", "start", "width", "opacity", "Title_default"]
|
|
7
7
|
}
|
package/dist/tokens/anker.css
CHANGED
package/dist/tokens/base.css
CHANGED
|
@@ -59,6 +59,7 @@
|
|
|
59
59
|
--tabs-list-bg-color: var(--container-primary-color);
|
|
60
60
|
|
|
61
61
|
--box-radius: 12px;
|
|
62
|
+
--card-radius: 12px;
|
|
62
63
|
--tabs-radius: 0px;
|
|
63
64
|
}
|
|
64
65
|
|
|
@@ -107,9 +108,16 @@
|
|
|
107
108
|
--masks-color-1: rgba(255, 255, 255, 0.6);
|
|
108
109
|
|
|
109
110
|
--box-radius: 12px;
|
|
111
|
+
--card-radius: 12px;
|
|
110
112
|
}
|
|
111
113
|
|
|
112
114
|
|
|
115
|
+
@media (min-width: 1024px) {
|
|
116
|
+
:root {
|
|
117
|
+
--card-radius: 16px;
|
|
118
|
+
}
|
|
119
|
+
}
|
|
120
|
+
|
|
113
121
|
@media (min-width: 1441px) {
|
|
114
122
|
:root {
|
|
115
123
|
--box-radius: 16px;
|
package/dist/tokens/solix.css
CHANGED
package/package.json
CHANGED
package/style.css
CHANGED
|
@@ -965,6 +965,9 @@ video {
|
|
|
965
965
|
.mt-\[-2px\] {
|
|
966
966
|
margin-top: -2px;
|
|
967
967
|
}
|
|
968
|
+
.mt-\[-6px\] {
|
|
969
|
+
margin-top: -6px;
|
|
970
|
+
}
|
|
968
971
|
.mt-\[12px\] {
|
|
969
972
|
margin-top: 12px;
|
|
970
973
|
}
|
|
@@ -1253,6 +1256,9 @@ video {
|
|
|
1253
1256
|
.\!h-full {
|
|
1254
1257
|
height: 100% !important;
|
|
1255
1258
|
}
|
|
1259
|
+
.h-1 {
|
|
1260
|
+
height: 0.25rem;
|
|
1261
|
+
}
|
|
1256
1262
|
.h-10 {
|
|
1257
1263
|
height: 2.5rem;
|
|
1258
1264
|
}
|
|
@@ -2215,6 +2221,9 @@ video {
|
|
|
2215
2221
|
.rounded-btn {
|
|
2216
2222
|
border-radius: var(--btn-radius);
|
|
2217
2223
|
}
|
|
2224
|
+
.rounded-card {
|
|
2225
|
+
border-radius: var(--card-radius);
|
|
2226
|
+
}
|
|
2218
2227
|
.rounded-full {
|
|
2219
2228
|
border-radius: 9999px;
|
|
2220
2229
|
}
|
|
@@ -6049,6 +6058,12 @@ video {
|
|
|
6049
6058
|
.desktop\:pb-\[24px\] {
|
|
6050
6059
|
padding-bottom: 24px;
|
|
6051
6060
|
}
|
|
6061
|
+
.desktop\:pl-6 {
|
|
6062
|
+
padding-left: 1.5rem;
|
|
6063
|
+
}
|
|
6064
|
+
.desktop\:pr-16 {
|
|
6065
|
+
padding-right: 4rem;
|
|
6066
|
+
}
|
|
6052
6067
|
.desktop\:pt-0 {
|
|
6053
6068
|
padding-top: 0px;
|
|
6054
6069
|
}
|
|
@@ -6206,6 +6221,10 @@ video {
|
|
|
6206
6221
|
width: 4rem;
|
|
6207
6222
|
height: 4rem;
|
|
6208
6223
|
}
|
|
6224
|
+
.lg-desktop\:size-5 {
|
|
6225
|
+
width: 1.25rem;
|
|
6226
|
+
height: 1.25rem;
|
|
6227
|
+
}
|
|
6209
6228
|
.lg-desktop\:size-\[108px\] {
|
|
6210
6229
|
width: 108px;
|
|
6211
6230
|
height: 108px;
|