@anker-in/headless-ui 1.0.9-temp-11 → 1.0.9-temp-13
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/Title/index.js +1 -1
- package/dist/cjs/biz-components/Title/index.js.map +2 -2
- package/dist/cjs/tsconfig.tsbuildinfo +1 -1
- package/dist/esm/biz-components/Title/index.js +1 -1
- package/dist/esm/biz-components/Title/index.js.map +2 -2
- package/dist/esm/stories/tabs.stories.d.ts +1 -1
- package/dist/esm/tsconfig.tsbuildinfo +1 -1
- package/package.json +1 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use client";import{jsx as a,jsxs as j}from"react/jsx-runtime";import
|
|
1
|
+
"use client";import{jsx as a,jsxs as j}from"react/jsx-runtime";import M,{useEffect as D,useRef as s}from"react";import{gsap as l}from"gsap";import{SplitText as d}from"gsap/dist/SplitText";import{ScrollTrigger as g}from"gsap/dist/ScrollTrigger";import{cn as h}from"../../helpers/utils.js";import{Heading as P}from"../../components/index.js";import{withLayout as V}from"../../shared/Styles.js";import{trackUrlRef as $}from"../../shared/trackUrlRef.js";import{useInView as z}from"react-intersection-observer";const I="link",U="title",w=M.forwardRef(({data:T,className:x})=>{const{title:c,theme:m,extension:r}=T,t=s(null),e=s(null),n=s(null),{ref:y,inView:p}=z();return D(()=>{l.registerPlugin(d,g);function k(){if(!t.current)return;const b=t.current?.clientHeight||80;e.current=new d(t.current,{type:"words",wordsClass:"word"});const o=e.current.words;l.set(o,{opacity:0}),n.current=g.create({trigger:t.current,start:"bottom bottom-=4%",end:`bottom+=${b*1.5+60}px bottom-=4%`,scrub:!0,onUpdate:v=>{const R=v.progress,u=o.length,S=1/u,f=.5;o.forEach((H,L)=>{const N=L/u*(1-f),E=S*(1+f);let i=(R-N)/E;i=Math.max(0,Math.min(i,1)),l.set(H,{opacity:i})})}})}return p&&k(),()=>{e.current&&e.current.revert(),n.current&&n.current.kill()}},[p]),c&&j("div",{className:"mb-6 flex items-end justify-between",ref:y,children:[a("div",{className:h("space-y-4",x,{"aiui-dark":m==="dark"}),children:a(P,{ref:t,as:"h2",size:4,html:c})}),r?.textLink&&a("a",{className:h({"aiui-dark":m==="dark"},"text-base font-[700] leading-[1.4] text-[#777] transition-all duration-[0.4s] hover:text-[#1D1D1F]"),href:$(r?.link,`${I}_${U}`),children:r?.textLink})]})});w.displayName="Title";var O=V(w,{container:{desktopSpan:12,mobileSpan:12}});export{O 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 } 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 { Heading } 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'\n\nconst componentType = 'link'\nconst componentName = 'title'\n\nconst Title = React.forwardRef<HTMLDivElement, TitleProps>(({ data, className }) => {\n const { title, theme, extension } = data\n const titleRef = useRef<HTMLHeadingElement>(null)\n const splitTextInstance = useRef<SplitText | null>(null)\n const scrollTriggerRef = useRef<ScrollTrigger | null>(null)\n\n const { ref: inViewRef, inView } = useInView()\n\n useEffect(() => {\n gsap.registerPlugin(SplitText, ScrollTrigger)\n function gsapResize() {\n if (!titleRef.current) return\n const height = titleRef.current?.clientHeight || 80\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 onUpdate: (self: any) => {\n const progress = self.progress\n const total = words.length\n const interval = 1 / total\n const overlap = 0.5\n words.forEach((word: any, i: number) => {\n const start = (i / total) * (1 - overlap)\n const width = interval * (1 + overlap)\n let opacity = (progress - start) / width\n opacity = Math.max(0, Math.min(opacity, 1))\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 && (\n <div className=\"mb-6 flex items-end justify-between\"
|
|
5
|
-
"mappings": "aAoEM,OAEI,OAAAA,EAFJ,QAAAC,MAAA,oBAnEN,OAAOC,GAAS,aAAAC,EAAW,UAAAC,MAAc,QACzC,OAAS,QAAAC,MAAY,OACrB,OAAS,aAAAC,MAAiB,sBAC1B,OAAS,iBAAAC,MAAqB,0BAC9B,OAAS,MAAAC,MAAU,yBACnB,OAAS,WAAAC,MAAe,4BACxB,OAAS,cAAAC,MAAkB,yBAE3B,OAAS,eAAAC,MAAmB,8BAC5B,OAAS,aAAAC,MAAiB,8BAE1B,MAAMC,EAAgB,OAChBC,EAAgB,QAEhBC,EAAQb,EAAM,WAAuC,CAAC,CAAE,KAAAc,EAAM,UAAAC,CAAU,IAAM,CAClF,KAAM,CAAE,MAAAC,EAAO,MAAAC,EAAO,UAAAC,CAAU,EAAIJ,EAC9BK,EAAWjB,EAA2B,IAAI,EAC1CkB,EAAoBlB,EAAyB,IAAI,EACjDmB,EAAmBnB,EAA6B,IAAI,EAEpD,CAAE,IAAKoB,EAAW,OAAAC,CAAO,EAAIb,EAAU,EAE7C,OAAAT,EAAU,IAAM,CACdE,EAAK,eAAeC,EAAWC,CAAa,EAC5C,SAASmB,GAAa,CACpB,GAAI,CAACL,EAAS,QAAS,OACvB,MAAMM,EAASN,EAAS,SAAS,cAAgB,GACjDC,EAAkB,QAAU,IAAIhB,EAAUe,EAAS,QAAS,CAC1D,KAAM,QACN,WAAY,MACd,CAAC,EACD,MAAMO,EAAQN,EAAkB,QAAQ,MACxCjB,EAAK,IAAIuB,EAAO,CAAE,QAAS,CAAE,CAAC,EAC9BL,EAAiB,QAAUhB,EAAc,OAAO,CAC9C,QAASc,EAAS,QAClB,MAAO,oBACP,IAAK,WAAWM,EAAS,IAAM,EAAE,gBACjC,MAAO,GACP,SAAWE,GAAc,CACvB,MAAMC,EAAWD,EAAK,SAChBE,EAAQH,EAAM,OACdI,EAAW,EAAID,EACfE,EAAU,GAChBL,EAAM,QAAQ,CAACM,EAAWC,IAAc,CACtC,MAAMC,EAASD,EAAIJ,GAAU,EAAIE,GAC3BI,EAAQL,GAAY,EAAIC,GAC9B,IAAIK,GAAWR,EAAWM,GAASC,EACnCC,EAAU,KAAK,IAAI,EAAG,KAAK,IAAIA,EAAS,CAAC,CAAC,EAC1CjC,EAAK,IAAI6B,EAAM,CAAE,QAAAI,CAAQ,CAAC,CAC5B,CAAC,CACH,CACF,CAAC,CACH,CAEA,OAAIb,GACFC,EAAW,EAGN,IAAM,CACXJ,EAAkB,SAAWA,EAAkB,QAAQ,OAAO,EAE9DC,EAAiB,SAAWA,EAAiB,QAAQ,KAAK,CAC5D,CACF,EAAG,CAACE,CAAM,CAAC,EAGTP,GACEjB,EAAC,OAAI,UAAU,
|
|
4
|
+
"sourcesContent": ["'use client'\nimport React, { useEffect, useRef } 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 { Heading } 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'\n\nconst componentType = 'link'\nconst componentName = 'title'\n\nconst Title = React.forwardRef<HTMLDivElement, TitleProps>(({ data, className }) => {\n const { title, theme, extension } = data\n const titleRef = useRef<HTMLHeadingElement>(null)\n const splitTextInstance = useRef<SplitText | null>(null)\n const scrollTriggerRef = useRef<ScrollTrigger | null>(null)\n\n const { ref: inViewRef, inView } = useInView()\n\n useEffect(() => {\n gsap.registerPlugin(SplitText, ScrollTrigger)\n function gsapResize() {\n if (!titleRef.current) return\n const height = titleRef.current?.clientHeight || 80\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 onUpdate: (self: any) => {\n const progress = self.progress\n const total = words.length\n const interval = 1 / total\n const overlap = 0.5\n words.forEach((word: any, i: number) => {\n const start = (i / total) * (1 - overlap)\n const width = interval * (1 + overlap)\n let opacity = (progress - start) / width\n opacity = Math.max(0, Math.min(opacity, 1))\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 && (\n <div className=\"mb-6 flex items-end justify-between\" ref={inViewRef}>\n <div className={cn('space-y-4', className, { 'aiui-dark': theme === 'dark' })}>\n <Heading ref={titleRef} as=\"h2\" size={4} html={title} />\n </div>\n {extension?.textLink && (\n <a\n className={cn(\n { 'aiui-dark': theme === 'dark' },\n 'text-base font-[700] leading-[1.4] text-[#777] transition-all duration-[0.4s] hover:text-[#1D1D1F]'\n )}\n href={trackUrlRef(extension?.link, `${componentType}_${componentName}`)}\n >\n {extension?.textLink}\n </a>\n )}\n </div>\n )\n )\n})\n\nTitle.displayName = 'Title'\n\nexport default withLayout(Title, {\n container: {\n desktopSpan: 12,\n mobileSpan: 12,\n },\n})\n"],
|
|
5
|
+
"mappings": "aAoEM,OAEI,OAAAA,EAFJ,QAAAC,MAAA,oBAnEN,OAAOC,GAAS,aAAAC,EAAW,UAAAC,MAAc,QACzC,OAAS,QAAAC,MAAY,OACrB,OAAS,aAAAC,MAAiB,sBAC1B,OAAS,iBAAAC,MAAqB,0BAC9B,OAAS,MAAAC,MAAU,yBACnB,OAAS,WAAAC,MAAe,4BACxB,OAAS,cAAAC,MAAkB,yBAE3B,OAAS,eAAAC,MAAmB,8BAC5B,OAAS,aAAAC,MAAiB,8BAE1B,MAAMC,EAAgB,OAChBC,EAAgB,QAEhBC,EAAQb,EAAM,WAAuC,CAAC,CAAE,KAAAc,EAAM,UAAAC,CAAU,IAAM,CAClF,KAAM,CAAE,MAAAC,EAAO,MAAAC,EAAO,UAAAC,CAAU,EAAIJ,EAC9BK,EAAWjB,EAA2B,IAAI,EAC1CkB,EAAoBlB,EAAyB,IAAI,EACjDmB,EAAmBnB,EAA6B,IAAI,EAEpD,CAAE,IAAKoB,EAAW,OAAAC,CAAO,EAAIb,EAAU,EAE7C,OAAAT,EAAU,IAAM,CACdE,EAAK,eAAeC,EAAWC,CAAa,EAC5C,SAASmB,GAAa,CACpB,GAAI,CAACL,EAAS,QAAS,OACvB,MAAMM,EAASN,EAAS,SAAS,cAAgB,GACjDC,EAAkB,QAAU,IAAIhB,EAAUe,EAAS,QAAS,CAC1D,KAAM,QACN,WAAY,MACd,CAAC,EACD,MAAMO,EAAQN,EAAkB,QAAQ,MACxCjB,EAAK,IAAIuB,EAAO,CAAE,QAAS,CAAE,CAAC,EAC9BL,EAAiB,QAAUhB,EAAc,OAAO,CAC9C,QAASc,EAAS,QAClB,MAAO,oBACP,IAAK,WAAWM,EAAS,IAAM,EAAE,gBACjC,MAAO,GACP,SAAWE,GAAc,CACvB,MAAMC,EAAWD,EAAK,SAChBE,EAAQH,EAAM,OACdI,EAAW,EAAID,EACfE,EAAU,GAChBL,EAAM,QAAQ,CAACM,EAAWC,IAAc,CACtC,MAAMC,EAASD,EAAIJ,GAAU,EAAIE,GAC3BI,EAAQL,GAAY,EAAIC,GAC9B,IAAIK,GAAWR,EAAWM,GAASC,EACnCC,EAAU,KAAK,IAAI,EAAG,KAAK,IAAIA,EAAS,CAAC,CAAC,EAC1CjC,EAAK,IAAI6B,EAAM,CAAE,QAAAI,CAAQ,CAAC,CAC5B,CAAC,CACH,CACF,CAAC,CACH,CAEA,OAAIb,GACFC,EAAW,EAGN,IAAM,CACXJ,EAAkB,SAAWA,EAAkB,QAAQ,OAAO,EAE9DC,EAAiB,SAAWA,EAAiB,QAAQ,KAAK,CAC5D,CACF,EAAG,CAACE,CAAM,CAAC,EAGTP,GACEjB,EAAC,OAAI,UAAU,sCAAsC,IAAKuB,EACxD,UAAAxB,EAAC,OAAI,UAAWQ,EAAG,YAAaS,EAAW,CAAE,YAAaE,IAAU,MAAO,CAAC,EAC1E,SAAAnB,EAACS,EAAA,CAAQ,IAAKY,EAAU,GAAG,KAAK,KAAM,EAAG,KAAMH,EAAO,EACxD,EACCE,GAAW,UACVpB,EAAC,KACC,UAAWQ,EACT,CAAE,YAAaW,IAAU,MAAO,EAChC,oGACF,EACA,KAAMR,EAAYS,GAAW,KAAM,GAAGP,CAAa,IAAIC,CAAa,EAAE,EAErE,SAAAM,GAAW,SACd,GAEJ,CAGN,CAAC,EAEDL,EAAM,YAAc,QAEpB,IAAOwB,EAAQ7B,EAAWK,EAAO,CAC/B,UAAW,CACT,YAAa,GACb,WAAY,EACd,CACF,CAAC",
|
|
6
6
|
"names": ["jsx", "jsxs", "React", "useEffect", "useRef", "gsap", "SplitText", "ScrollTrigger", "cn", "Heading", "withLayout", "trackUrlRef", "useInView", "componentType", "componentName", "Title", "data", "className", "title", "theme", "extension", "titleRef", "splitTextInstance", "scrollTriggerRef", "inViewRef", "inView", "gsapResize", "height", "words", "self", "progress", "total", "interval", "overlap", "word", "i", "start", "width", "opacity", "Title_default"]
|
|
7
7
|
}
|
|
@@ -26,7 +26,7 @@ declare const meta: {
|
|
|
26
26
|
accessKey?: string | undefined | undefined;
|
|
27
27
|
autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined | (string & {}) | undefined;
|
|
28
28
|
autoFocus?: boolean | undefined | undefined;
|
|
29
|
-
contentEditable?: (boolean | "true" | "false") | "
|
|
29
|
+
contentEditable?: "inherit" | (boolean | "true" | "false") | "plaintext-only" | undefined;
|
|
30
30
|
contextMenu?: string | undefined | undefined;
|
|
31
31
|
dir?: ("ltr" | "rtl") | undefined;
|
|
32
32
|
draggable?: (boolean | "true" | "false") | undefined;
|