@anker-in/headless-ui 1.1.9-alpha.1764158070527 → 1.1.9-alpha.1764216664003
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 +3 -3
- package/dist/cjs/biz-components/Title/types.d.ts +1 -0
- package/dist/cjs/biz-components/Title/types.js +1 -1
- package/dist/cjs/biz-components/Title/types.js.map +1 -1
- package/dist/esm/biz-components/Title/index.js +1 -1
- package/dist/esm/biz-components/Title/index.js.map +3 -3
- package/dist/esm/biz-components/Title/types.d.ts +1 -0
- package/package.json +1 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";"use client";var
|
|
1
|
+
"use strict";"use client";var J=Object.create;var d=Object.defineProperty;var K=Object.getOwnPropertyDescriptor;var Q=Object.getOwnPropertyNames;var X=Object.getPrototypeOf,Y=Object.prototype.hasOwnProperty;var Z=(t,e)=>{for(var n in e)d(t,n,{get:e[n],enumerable:!0})},M=(t,e,n,c)=>{if(e&&typeof e=="object"||typeof e=="function")for(let s of Q(e))!Y.call(t,s)&&s!==n&&d(t,s,{get:()=>e[s],enumerable:!(c=K(e,s))||c.enumerable});return t};var tt=(t,e,n)=>(n=t!=null?J(X(t)):{},M(e||!t||!t.__esModule?d(n,"default",{value:t,enumerable:!0}):n,t)),et=t=>M(d({},"__esModule",{value:!0}),t);var nt={};Z(nt,{default:()=>rt});module.exports=et(nt);var i=require("react/jsx-runtime"),r=tt(require("react")),f=require("gsap"),b=require("gsap/dist/SplitText"),T=require("gsap/dist/ScrollTrigger"),p=require("../../helpers/utils.js"),z=require("../../components/index.js"),P=require("../../shared/Styles.js"),S=require("../../shared/trackUrlRef.js"),I=require("react-intersection-observer");const E="link",$="title",D=r.default.forwardRef(({data:t,className:e,as:n="h2",weight:c="bold",mobFlexCol:s=!1},V)=>{const{title:u,caption:g,theme:k,extensions:m,align:h="left"}=t,y=(0,r.useRef)(null),l=(0,r.useRef)(null),o=(0,r.useRef)(null),a=(0,r.useRef)(null),{ref:B,inView:L}=(0,I.useInView)();return(0,r.useImperativeHandle)(V,()=>y.current),(0,r.useEffect)(()=>{f.gsap.registerPlugin(b.SplitText,T.ScrollTrigger);function U(){if(!l.current)return;const j=l.current?.clientHeight||80;o.current&&o.current.revert(),a.current&&a.current.kill(),o.current=new b.SplitText(l.current,{type:"words",wordsClass:"word"});const v=o.current.words;f.gsap.set(v,{opacity:0}),a.current=T.ScrollTrigger.create({trigger:l.current,start:"bottom bottom-=4%",end:`bottom+=${j*1.5+60}px bottom-=4%`,scrub:!0,invalidateOnRefresh:!0,onUpdate:C=>{const F=C.progress,R=v.length||1,O=.5,w=1/R,N=w*(1-O),H=(R-1)*N+w,W=Math.min(1,H>0?F/H:0);v.forEach((_,q)=>{const A=q*N,G=w;let x=(W-A)/G;x=Math.max(0,Math.min(1,x)),f.gsap.set(_,{opacity:x})})}})}return L&&U(),()=>{o.current&&o.current.revert(),a.current&&a.current.kill()}},[L]),(u||g)&&(0,i.jsxs)("div",{ref:y,id:m?.id,className:(0,p.cn)("titleBottom title-box mb-6 flex items-end justify-between gap-2",{"md-tablet:flex-col md-tablet:items-start":s}),children:[(0,i.jsx)("div",{ref:B,className:(0,p.cn)("flex-1 space-y-4",e,{"aiui-dark":k==="dark","text-center":h==="center","text-right":h==="right","text-left":h==="left"}),children:(0,i.jsx)(z.Heading,{ref:l,as:n,size:4,html:g||u,weight:c})}),m?.textLink&&(0,i.jsxs)("a",{className:(0,p.cn)({"aiui-dark":k==="dark"},"flex items-center overflow-hidden text-base font-[700] leading-[1.4] text-[#777] transition-all duration-[0.4s] hover:text-[#1D1D1F]"),href:(0,S.trackUrlRef)(m?.link,`${E}_${$}`),"data-headless-type-name":`${E}#${$}`,"data-headless-title-desc-button":`${u}#${g}`,children:[(0,i.jsx)("div",{className:"flex-1 truncate whitespace-nowrap",children:m?.textLink}),(0,i.jsx)("div",{className:"size-6",children:(0,i.jsx)("svg",{width:"24",height:"24",className:"mb-[3px]",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"none",children:(0,i.jsx)("path",{className:"transition-all duration-[0.4s]",d:"M10.5 8L14.5 12L10.5 16",stroke:"#777",strokeWidth:"1.5",strokeLinecap:"round"})})})]})]})});D.displayName="Title";var rt=(0,P.withLayout)(D);
|
|
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 } 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, as = 'h2', weight = 'bold' }, ref) => {\n
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": ["Title_exports", "__export", "Title_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_gsap", "import_SplitText", "import_ScrollTrigger", "import_utils", "import_components", "import_Styles", "import_trackUrlRef", "import_react_intersection_observer", "componentType", "componentName", "Title", "React", "data", "className", "as", "weight", "ref", "title", "caption", "theme", "extensions", "align", "innerRef", "titleRef", "splitTextInstance", "scrollTriggerRef", "inViewRef", "inView", "gsapResize", "height", "words", "self", "progress", "total", "overlap", "interval", "step", "lastEnd", "normalizedProgress", "word", "i", "start", "width", "opacity"]
|
|
4
|
+
"sourcesContent": ["'use client'\nimport React, { useEffect, useRef, useImperativeHandle } 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>(\n ({ data, className, as = 'h2', weight = 'bold', mobFlexCol = false }, ref) => {\n const { title, caption, theme, extensions, align = 'left' } = 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 const { ref: inViewRef, inView } = useInView()\n\n useImperativeHandle(ref, () => innerRef.current as HTMLDivElement)\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 ref={innerRef}\n id={extensions?.id}\n className={cn('titleBottom title-box mb-6 flex items-end justify-between gap-2', {\n 'md-tablet:flex-col md-tablet:items-start': mobFlexCol,\n })}\n >\n <div\n ref={inViewRef}\n className={cn('flex-1 space-y-4', className, {\n 'aiui-dark': theme === 'dark',\n 'text-center': align === 'center',\n 'text-right': align === 'right',\n 'text-left': align === 'left',\n })}\n >\n <Heading ref={titleRef} as={as} size={4} html={caption || title} weight={weight} />\n </div>\n {extensions?.textLink && (\n <a\n className={cn(\n { 'aiui-dark': theme === 'dark' },\n 'flex items-center overflow-hidden text-base font-[700] leading-[1.4] text-[#777] transition-all duration-[0.4s] hover:text-[#1D1D1F]'\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 className=\"flex-1 truncate whitespace-nowrap\">{extensions?.textLink}</div>\n <div className=\"size-6\">\n <svg\n width=\"24\"\n height=\"24\"\n className=\"mb-[3px]\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n >\n <path\n className=\"transition-all duration-[0.4s]\"\n d=\"M10.5 8L14.5 12L10.5 16\"\n stroke=\"#777\"\n strokeWidth=\"1.5\"\n strokeLinecap=\"round\"\n ></path>\n </svg>\n </div>\n </a>\n )}\n </div>\n )\n )\n }\n)\n\nTitle.displayName = 'Title'\n\nexport default withLayout(Title)\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["Title_exports", "__export", "Title_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_gsap", "import_SplitText", "import_ScrollTrigger", "import_utils", "import_components", "import_Styles", "import_trackUrlRef", "import_react_intersection_observer", "componentType", "componentName", "Title", "React", "data", "className", "as", "weight", "mobFlexCol", "ref", "title", "caption", "theme", "extensions", "align", "innerRef", "titleRef", "splitTextInstance", "scrollTriggerRef", "inViewRef", "inView", "gsapResize", "height", "words", "self", "progress", "total", "overlap", "interval", "step", "lastEnd", "normalizedProgress", "word", "i", "start", "width", "opacity"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var a=Object.defineProperty;var
|
|
1
|
+
"use strict";var a=Object.defineProperty;var s=Object.getOwnPropertyDescriptor;var l=Object.getOwnPropertyNames;var n=Object.prototype.hasOwnProperty;var h=(t,e,o,r)=>{if(e&&typeof e=="object"||typeof e=="function")for(let i of l(e))!n.call(t,i)&&i!==o&&a(t,i,{get:()=>e[i],enumerable:!(r=s(e,i))||r.enumerable});return t};var m=t=>h(a({},"__esModule",{value:!0}),t);var p={};module.exports=m(p);
|
|
2
2
|
//# sourceMappingURL=types.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/Title/types.ts"],
|
|
4
|
-
"sourcesContent": ["import type { Align, Theme } from '../../types/props.js'\n\nexport interface Feature {\n /**\n * \u7279\u6027\u6807\u9898\n */\n title: string\n}\n\nexport interface TitleProps {\n data: {\n /**\n * \u4E3B\u6807\u9898\n */\n title?: string\n caption?: string\n /**\n * \u7279\u6027\u5217\u8868\uFF0C\u6700\u591A\u652F\u63013\u4E2A\n */\n features?: Feature[]\n /**\n * \u4E3B\u9898\u8272\n */\n theme?: Theme\n /**\n * \u6269\u5C55\u6570\u636E\n */\n extensions?: any\n align?: 'left' | 'center' | 'right'\n }\n weight?: 'medium' | 'semibold' | 'bold' | 'extraBold' | 'black'\n /**\n * \u81EA\u5B9A\u4E49\u7C7B\u540D\n */\n className?: string\n as?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'\n}\n"],
|
|
4
|
+
"sourcesContent": ["import type { Align, Theme } from '../../types/props.js'\n\nexport interface Feature {\n /**\n * \u7279\u6027\u6807\u9898\n */\n title: string\n}\n\nexport interface TitleProps {\n mobFlexCol?: boolean // \u662F\u5426\u5728\u79FB\u52A8\u7AEF\u663E\u793A\u4E3A flex-col\n data: {\n /**\n * \u4E3B\u6807\u9898\n */\n title?: string\n caption?: string\n /**\n * \u7279\u6027\u5217\u8868\uFF0C\u6700\u591A\u652F\u63013\u4E2A\n */\n features?: Feature[]\n /**\n * \u4E3B\u9898\u8272\n */\n theme?: Theme\n /**\n * \u6269\u5C55\u6570\u636E\n */\n extensions?: any\n align?: 'left' | 'center' | 'right'\n }\n weight?: 'medium' | 'semibold' | 'bold' | 'extraBold' | 'black'\n /**\n * \u81EA\u5B9A\u4E49\u7C7B\u540D\n */\n className?: string\n as?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'\n}\n"],
|
|
5
5
|
"mappings": "+WAAA,IAAAA,EAAA,kBAAAC,EAAAD",
|
|
6
6
|
"names": ["types_exports", "__toCommonJS"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as R}from"react/jsx-runtime";import
|
|
1
|
+
"use client";import{jsx as e,jsxs as R}from"react/jsx-runtime";import W,{useEffect as _,useRef as s,useImperativeHandle as q}from"react";import{gsap as f}from"gsap";import{SplitText as b}from"gsap/dist/SplitText";import{ScrollTrigger as T}from"gsap/dist/ScrollTrigger";import{cn as p}from"../../helpers/utils.js";import{Heading as A}from"../../components/index.js";import{withLayout as G}from"../../shared/Styles.js";import{trackUrlRef as J}from"../../shared/trackUrlRef.js";import{useInView as K}from"react-intersection-observer";const k="link",y="title",L=W.forwardRef(({data:N,className:H,as:M="h2",weight:E="bold",mobFlexCol:$=!1},D)=>{const{title:o,caption:l,theme:u,extensions:i,align:a="left"}=N,g=s(null),r=s(null),t=s(null),n=s(null),{ref:z,inView:h}=K();return q(D,()=>g.current),_(()=>{f.registerPlugin(b,T);function P(){if(!r.current)return;const S=r.current?.clientHeight||80;t.current&&t.current.revert(),n.current&&n.current.kill(),t.current=new b(r.current,{type:"words",wordsClass:"word"});const c=t.current.words;f.set(c,{opacity:0}),n.current=T.create({trigger:r.current,start:"bottom bottom-=4%",end:`bottom+=${S*1.5+60}px bottom-=4%`,scrub:!0,invalidateOnRefresh:!0,onUpdate:I=>{const V=I.progress,v=c.length||1,B=.5,m=1/v,w=m*(1-B),x=(v-1)*w+m,U=Math.min(1,x>0?V/x:0);c.forEach((j,C)=>{const F=C*w,O=m;let d=(U-F)/O;d=Math.max(0,Math.min(1,d)),f.set(j,{opacity:d})})}})}return h&&P(),()=>{t.current&&t.current.revert(),n.current&&n.current.kill()}},[h]),(o||l)&&R("div",{ref:g,id:i?.id,className:p("titleBottom title-box mb-6 flex items-end justify-between gap-2",{"md-tablet:flex-col md-tablet:items-start":$}),children:[e("div",{ref:z,className:p("flex-1 space-y-4",H,{"aiui-dark":u==="dark","text-center":a==="center","text-right":a==="right","text-left":a==="left"}),children:e(A,{ref:r,as:M,size:4,html:l||o,weight:E})}),i?.textLink&&R("a",{className:p({"aiui-dark":u==="dark"},"flex items-center overflow-hidden text-base font-[700] leading-[1.4] text-[#777] transition-all duration-[0.4s] hover:text-[#1D1D1F]"),href:J(i?.link,`${k}_${y}`),"data-headless-type-name":`${k}#${y}`,"data-headless-title-desc-button":`${o}#${l}`,children:[e("div",{className:"flex-1 truncate whitespace-nowrap",children:i?.textLink}),e("div",{className:"size-6",children:e("svg",{width:"24",height:"24",className:"mb-[3px]",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"none",children:e("path",{className:"transition-all duration-[0.4s]",d:"M10.5 8L14.5 12L10.5 16",stroke:"#777",strokeWidth:"1.5",strokeLinecap:"round"})})})]})]})});L.displayName="Title";var st=G(L);export{st 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 } 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, as = 'h2', weight = 'bold' }, ref) => {\n
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": ["jsx", "jsxs", "React", "useEffect", "useRef", "useImperativeHandle", "gsap", "SplitText", "ScrollTrigger", "cn", "Heading", "withLayout", "trackUrlRef", "useInView", "componentType", "componentName", "Title", "data", "className", "as", "weight", "ref", "title", "caption", "theme", "extensions", "align", "innerRef", "titleRef", "splitTextInstance", "scrollTriggerRef", "inViewRef", "inView", "gsapResize", "height", "words", "self", "progress", "total", "overlap", "interval", "step", "lastEnd", "normalizedProgress", "word", "i", "start", "width", "opacity", "Title_default"]
|
|
4
|
+
"sourcesContent": ["'use client'\nimport React, { useEffect, useRef, useImperativeHandle } 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>(\n ({ data, className, as = 'h2', weight = 'bold', mobFlexCol = false }, ref) => {\n const { title, caption, theme, extensions, align = 'left' } = 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 const { ref: inViewRef, inView } = useInView()\n\n useImperativeHandle(ref, () => innerRef.current as HTMLDivElement)\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 ref={innerRef}\n id={extensions?.id}\n className={cn('titleBottom title-box mb-6 flex items-end justify-between gap-2', {\n 'md-tablet:flex-col md-tablet:items-start': mobFlexCol,\n })}\n >\n <div\n ref={inViewRef}\n className={cn('flex-1 space-y-4', className, {\n 'aiui-dark': theme === 'dark',\n 'text-center': align === 'center',\n 'text-right': align === 'right',\n 'text-left': align === 'left',\n })}\n >\n <Heading ref={titleRef} as={as} size={4} html={caption || title} weight={weight} />\n </div>\n {extensions?.textLink && (\n <a\n className={cn(\n { 'aiui-dark': theme === 'dark' },\n 'flex items-center overflow-hidden text-base font-[700] leading-[1.4] text-[#777] transition-all duration-[0.4s] hover:text-[#1D1D1F]'\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 className=\"flex-1 truncate whitespace-nowrap\">{extensions?.textLink}</div>\n <div className=\"size-6\">\n <svg\n width=\"24\"\n height=\"24\"\n className=\"mb-[3px]\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n >\n <path\n className=\"transition-all duration-[0.4s]\"\n d=\"M10.5 8L14.5 12L10.5 16\"\n stroke=\"#777\"\n strokeWidth=\"1.5\"\n strokeLinecap=\"round\"\n ></path>\n </svg>\n </div>\n </a>\n )}\n </div>\n )\n )\n }\n)\n\nTitle.displayName = 'Title'\n\nexport default withLayout(Title)\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["jsx", "jsxs", "React", "useEffect", "useRef", "useImperativeHandle", "gsap", "SplitText", "ScrollTrigger", "cn", "Heading", "withLayout", "trackUrlRef", "useInView", "componentType", "componentName", "Title", "data", "className", "as", "weight", "mobFlexCol", "ref", "title", "caption", "theme", "extensions", "align", "innerRef", "titleRef", "splitTextInstance", "scrollTriggerRef", "inViewRef", "inView", "gsapResize", "height", "words", "self", "progress", "total", "overlap", "interval", "step", "lastEnd", "normalizedProgress", "word", "i", "start", "width", "opacity", "Title_default"]
|
|
7
7
|
}
|