@cleartrip/ct-design-vertical-ticker 5.17.0 → 5.18.0-SNAPSHOT-native-main.0

package/dist/VerticalTicker.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"VerticalTicker.d.ts","sourceRoot":"","sources":["../packages/components/VerticalTicker/src/VerticalTicker.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAMjD,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAAC;AAa9C,QAAA,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CA2DlD,CAAC;AAEF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"VerticalTicker.d.ts","sourceRoot":"","sources":["../packages/components/VerticalTicker/src/VerticalTicker.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAMjD,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAAC;AAa9C,QAAA,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CA8DlD,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/dist/VerticalTicker.native.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"VerticalTicker.native.d.ts","sourceRoot":"","sources":["../packages/components/VerticalTicker/src/VerticalTicker.native.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAyC,MAAM,OAAO,CAAC;AAO9D,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAAC;AAE9C,QAAA,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CA6DlD,CAAC;AAEF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"VerticalTicker.native.d.ts","sourceRoot":"","sources":["../packages/components/VerticalTicker/src/VerticalTicker.native.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAyC,MAAM,OAAO,CAAC;AAO9D,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAAC;AAE9C,QAAA,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAgElD,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/dist/ct-design-vertical-ticker.browser.cjs.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("react/jsx-runtime"),r=require("react"),t=require("@cleartrip/ct-design-container"),n=require("@cleartrip/ct-design-style-manager");const i=n.makeStyles(()=>({root:{overflow:"hidden"}}));exports.VerticalTicker=({elements:s,delay:u=3e3,height:o,loop:c=!0})=>{const a=[...s,s[0]],l=r.useRef(0),f=r.useRef(null),d=r.useRef(0),m=r.useRef(0),y=n.useStyles(()=>({root:{height:o}}),[o]);return r.useEffect(()=>{const e=r=>{var t,n;if((()=>{if("undefined"==typeof navigator)return!1;const e=navigator.scheduling;return"function"==typeof(null==e?void 0:e.isInputPending)&&e.isInputPending()})())m.current=window.requestAnimationFrame(e);else{if(l.current>=a.length-1){if(r-d.current>=500&&(d.current=r,(null===(t=f.current)||void 0===t?void 0:t.style)&&(f.current.style.transition="none",f.current.style.transform="translateY(0)"),l.current=0,!c))return}else if(r-d.current>=u){d.current=r;const e=++l.current*o;(null===(n=f.current)||void 0===n?void 0:n.style)&&(f.current.style.transition="transform 0.5s ease 0s",f.current.style.transform=`translateY(-${e}px)`)}m.current=requestAnimationFrame(e)}};return m.current=requestAnimationFrame(e),()=>{cancelAnimationFrame(m.current)}},[]),e.jsx(t.Container,{styleConfig:{root:[i.root,y.root]},children:e.jsx("div",{ref:f,children:a.map(e=>e)})})};
+"use strict";var e=require("react/jsx-runtime"),r=require("react"),t=require("@cleartrip/ct-design-container"),n=require("@cleartrip/ct-design-style-manager");function i(e){return e&&e.__esModule?e:{default:e}}var u=i(r);const s=n.makeStyles(()=>({root:{overflow:"hidden"}}));exports.VerticalTicker=({elements:i,delay:o=3e3,height:c,loop:l=!0})=>{const a=u.default.cloneElement(i[0],{key:"clone-fist-elem"}),f=[...i,a],d=r.useRef(0),m=r.useRef(null),y=r.useRef(0),g=r.useRef(0),v=n.useStyles(()=>({root:{height:c}}),[c]);return r.useEffect(()=>{const e=r=>{var t,n;if((()=>{if("undefined"==typeof navigator)return!1;const e=navigator.scheduling;return"function"==typeof(null==e?void 0:e.isInputPending)&&e.isInputPending()})())g.current=window.requestAnimationFrame(e);else{if(d.current>=f.length-1){if(r-y.current>=500&&(y.current=r,(null===(t=m.current)||void 0===t?void 0:t.style)&&(m.current.style.transition="none",m.current.style.transform="translateY(0)"),d.current=0,!l))return}else if(r-y.current>=o){y.current=r;const e=++d.current*c;(null===(n=m.current)||void 0===n?void 0:n.style)&&(m.current.style.transition="transform 0.5s ease 0s",m.current.style.transform=`translateY(-${e}px)`)}g.current=requestAnimationFrame(e)}};return g.current=requestAnimationFrame(e),()=>{cancelAnimationFrame(g.current)}},[]),e.jsx(t.Container,{styleConfig:{root:[s.root,v.root]},children:e.jsx("div",{ref:m,children:f.map(e=>e)})})};
 //# sourceMappingURL=ct-design-vertical-ticker.browser.cjs.js.map

package/dist/ct-design-vertical-ticker.browser.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"ct-design-vertical-ticker.browser.cjs.js","sources":["../packages/components/VerticalTicker/src/style.ts","../packages/components/VerticalTicker/src/VerticalTicker.tsx"],"sourcesContent":[null,null],"names":["staticTickerStyles","makeStyles","root","overflow","elements","delay","height","loop","elementList","currentTranslatedIndex","useRef","containerRef","lastTickTime","animationFrameId","containerStyles","useStyles","useEffect","textTickerAnimation","time","navigator","scheduling","isInputPending","current","window","requestAnimationFrame","length","_a","style","transition","transform","translateY","_b","cancelAnimationFrame","_jsx","Container","styleConfig","children","ref","map","element"],"mappings":"+JAEO,MAAMA,EAAqBC,EAAUA,WAAC,KAAO,CAClDC,KAAM,CACJC,SAAU,oCCeyC,EAAGC,WAAUC,QAAQ,IAAMC,SAAQC,QAAO,MAC/F,MAAMC,EAAc,IAAIJ,EAAUA,EAAS,IACrCK,EAAyBC,SAAO,GAChCC,EAAeD,SAAuB,MACtCE,EAAeF,SAAO,GACtBG,EAAmBH,SAAO,GAE1BI,EAAkBC,EAAAA,UACtB,KAAO,CACLb,KAAM,CACJI,YAGJ,CAACA,IAyCH,OAtCAU,EAAAA,UAAU,KACR,MAAMC,EAAuBC,YAC3B,GA3BiB,MACrB,GAAyB,oBAAdC,UAA2B,OAAO,EAC7C,MAAMC,EAAcD,UAA6EC,WACjG,MAA0C,mBAA/BA,aAAU,EAAVA,EAAYC,iBACdD,EAAWC,kBAuBZA,GACFR,EAAiBS,QAAUC,OAAOC,sBAAsBP,OAD1D,CAKA,GAAIR,EAAuBa,SAAWd,EAAYiB,OAAS,GACzD,GAAIP,EAAON,EAAaU,SAAW,MACjCV,EAAaU,QAAUJ,GACG,UAAtBP,EAAaW,eAAS,IAAAI,OAAA,EAAAA,EAAAC,SACxBhB,EAAaW,QAAQK,MAAMC,WAAa,OACxCjB,EAAaW,QAAQK,MAAME,UAAY,iBAGzCpB,EAAuBa,QAAU,GAC5Bf,GAAM,YAER,GAAIW,EAAON,EAAaU,SAAWjB,EAAO,CAC/CO,EAAaU,QAAUJ,EACvB,MAAMY,IAAerB,EAAuBa,QAAUhB,GAC5B,UAAtBK,EAAaW,eAAS,IAAAS,OAAA,EAAAA,EAAAJ,SACxBhB,EAAaW,QAAQK,MAAMC,WAAa,yBACxCjB,EAAaW,QAAQK,MAAME,UAAY,eAAeC,OAEzD,CAEDjB,EAAiBS,QAAUE,sBAAsBP,EAtBhD,GA2BH,OAFAJ,EAAiBS,QAAUE,sBAAsBP,GAE1C,KACLe,qBAAqBnB,EAAiBS,WAGvC,IAGDW,MAACC,EAAAA,UAAU,CAAAC,YAAa,CAAEjC,KAAM,CAACF,EAAmBE,KAAMY,EAAgBZ,OACxEkC,SAAAH,MAAA,MAAA,CAAKI,IAAK1B,WAAeH,EAAY8B,IAAKC,GAAYA"}
+{"version":3,"file":"ct-design-vertical-ticker.browser.cjs.js","sources":["../packages/components/VerticalTicker/src/style.ts","../packages/components/VerticalTicker/src/VerticalTicker.tsx"],"sourcesContent":[null,null],"names":["staticTickerStyles","makeStyles","root","overflow","elements","delay","height","loop","clonedFirstElem","React","default","cloneElement","key","elementList","currentTranslatedIndex","useRef","containerRef","lastTickTime","animationFrameId","containerStyles","useStyles","useEffect","textTickerAnimation","time","navigator","scheduling","isInputPending","current","window","requestAnimationFrame","length","_a","style","transition","transform","translateY","_b","cancelAnimationFrame","_jsx","Container","styleConfig","children","ref","map","element"],"mappings":"6NAEO,MAAMA,EAAqBC,EAAUA,WAAC,KAAO,CAClDC,KAAM,CACJC,SAAU,oCCeyC,EAAGC,WAAUC,QAAQ,IAAMC,SAAQC,QAAO,MAC/F,MAAMC,EAAkBC,EAAKC,QAACC,aAAaP,EAAS,GAA0B,CAC5EQ,IAAK,oBAEDC,EAAc,IAAIT,EAAUI,GAC5BM,EAAyBC,SAAO,GAChCC,EAAeD,SAAuB,MACtCE,EAAeF,SAAO,GACtBG,EAAmBH,SAAO,GAE1BI,EAAkBC,EAAAA,UACtB,KAAO,CACLlB,KAAM,CACJI,YAGJ,CAACA,IAyCH,OAtCAe,EAAAA,UAAU,KACR,MAAMC,EAAuBC,YAC3B,GA9BiB,MACrB,GAAyB,oBAAdC,UAA2B,OAAO,EAC7C,MAAMC,EAAcD,UAA6EC,WACjG,MAA0C,mBAA/BA,aAAU,EAAVA,EAAYC,iBACdD,EAAWC,kBA0BZA,GACFR,EAAiBS,QAAUC,OAAOC,sBAAsBP,OAD1D,CAKA,GAAIR,EAAuBa,SAAWd,EAAYiB,OAAS,GACzD,GAAIP,EAAON,EAAaU,SAAW,MACjCV,EAAaU,QAAUJ,GACG,UAAtBP,EAAaW,eAAS,IAAAI,OAAA,EAAAA,EAAAC,SACxBhB,EAAaW,QAAQK,MAAMC,WAAa,OACxCjB,EAAaW,QAAQK,MAAME,UAAY,iBAGzCpB,EAAuBa,QAAU,GAC5BpB,GAAM,YAER,GAAIgB,EAAON,EAAaU,SAAWtB,EAAO,CAC/CY,EAAaU,QAAUJ,EACvB,MAAMY,IAAerB,EAAuBa,QAAUrB,GAC5B,UAAtBU,EAAaW,eAAS,IAAAS,OAAA,EAAAA,EAAAJ,SACxBhB,EAAaW,QAAQK,MAAMC,WAAa,yBACxCjB,EAAaW,QAAQK,MAAME,UAAY,eAAeC,OAEzD,CAEDjB,EAAiBS,QAAUE,sBAAsBP,EAtBhD,GA2BH,OAFAJ,EAAiBS,QAAUE,sBAAsBP,GAE1C,KACLe,qBAAqBnB,EAAiBS,WAGvC,IAGDW,MAACC,EAAAA,UAAU,CAAAC,YAAa,CAAEtC,KAAM,CAACF,EAAmBE,KAAMiB,EAAgBjB,OACxEuC,SAAAH,MAAA,MAAA,CAAKI,IAAK1B,WAAeH,EAAY8B,IAAKC,GAAYA"}

package/dist/ct-design-vertical-ticker.browser.esm.js

@@ -1,2 +1,2 @@
-import{jsx as r}from"react/jsx-runtime";import{useRef as t,useEffect as e}from"react";import{Container as n}from"@cleartrip/ct-design-container";import{makeStyles as o,useStyles as i}from"@cleartrip/ct-design-style-manager";const c=o(()=>({root:{overflow:"hidden"}})),s=({elements:o,delay:s=3e3,height:u,loop:a=!0})=>{const l=[...o,o[0]],m=t(0),d=t(null),f=t(0),p=t(0),g=i(()=>({root:{height:u}}),[u]);return e(()=>{const r=t=>{var e,n;if((()=>{if("undefined"==typeof navigator)return!1;const r=navigator.scheduling;return"function"==typeof(null==r?void 0:r.isInputPending)&&r.isInputPending()})())p.current=window.requestAnimationFrame(r);else{if(m.current>=l.length-1){if(t-f.current>=500&&(f.current=t,(null===(e=d.current)||void 0===e?void 0:e.style)&&(d.current.style.transition="none",d.current.style.transform="translateY(0)"),m.current=0,!a))return}else if(t-f.current>=s){f.current=t;const r=++m.current*u;(null===(n=d.current)||void 0===n?void 0:n.style)&&(d.current.style.transition="transform 0.5s ease 0s",d.current.style.transform=`translateY(-${r}px)`)}p.current=requestAnimationFrame(r)}};return p.current=requestAnimationFrame(r),()=>{cancelAnimationFrame(p.current)}},[]),r(n,{styleConfig:{root:[c.root,g.root]},children:r("div",{ref:d,children:l.map(r=>r)})})};export{s as VerticalTicker};
+import{jsx as r}from"react/jsx-runtime";import e,{useRef as t,useEffect as n}from"react";import{Container as o}from"@cleartrip/ct-design-container";import{makeStyles as i,useStyles as c}from"@cleartrip/ct-design-style-manager";const s=i(()=>({root:{overflow:"hidden"}})),l=({elements:i,delay:l=3e3,height:u,loop:a=!0})=>{const m=e.cloneElement(i[0],{key:"clone-fist-elem"}),f=[...i,m],d=t(0),p=t(null),g=t(0),y=t(0),v=c(()=>({root:{height:u}}),[u]);return n(()=>{const r=e=>{var t,n;if((()=>{if("undefined"==typeof navigator)return!1;const r=navigator.scheduling;return"function"==typeof(null==r?void 0:r.isInputPending)&&r.isInputPending()})())y.current=window.requestAnimationFrame(r);else{if(d.current>=f.length-1){if(e-g.current>=500&&(g.current=e,(null===(t=p.current)||void 0===t?void 0:t.style)&&(p.current.style.transition="none",p.current.style.transform="translateY(0)"),d.current=0,!a))return}else if(e-g.current>=l){g.current=e;const r=++d.current*u;(null===(n=p.current)||void 0===n?void 0:n.style)&&(p.current.style.transition="transform 0.5s ease 0s",p.current.style.transform=`translateY(-${r}px)`)}y.current=requestAnimationFrame(r)}};return y.current=requestAnimationFrame(r),()=>{cancelAnimationFrame(y.current)}},[]),r(o,{styleConfig:{root:[s.root,v.root]},children:r("div",{ref:p,children:f.map(r=>r)})})};export{l as VerticalTicker};
 //# sourceMappingURL=ct-design-vertical-ticker.browser.esm.js.map

package/dist/ct-design-vertical-ticker.browser.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ct-design-vertical-ticker.browser.esm.js","sources":["../packages/components/VerticalTicker/src/style.ts","../packages/components/VerticalTicker/src/VerticalTicker.tsx"],"sourcesContent":[null,null],"names":["staticTickerStyles","makeStyles","root","overflow","VerticalTicker","elements","delay","height","loop","elementList","currentTranslatedIndex","useRef","containerRef","lastTickTime","animationFrameId","containerStyles","useStyles","useEffect","textTickerAnimation","time","navigator","scheduling","isInputPending","current","window","requestAnimationFrame","length","_a","style","transition","transform","translateY","_b","cancelAnimationFrame","_jsx","Container","styleConfig","children","ref","map","element"],"mappings":"gOAEO,MAAMA,EAAqBC,EAAW,KAAO,CAClDC,KAAM,CACJC,SAAU,aCeRC,EAAiD,EAAGC,WAAUC,QAAQ,IAAMC,SAAQC,QAAO,MAC/F,MAAMC,EAAc,IAAIJ,EAAUA,EAAS,IACrCK,EAAyBC,EAAO,GAChCC,EAAeD,EAAuB,MACtCE,EAAeF,EAAO,GACtBG,EAAmBH,EAAO,GAE1BI,EAAkBC,EACtB,KAAO,CACLd,KAAM,CACJK,YAGJ,CAACA,IAyCH,OAtCAU,EAAU,KACR,MAAMC,EAAuBC,YAC3B,GA3BiB,MACrB,GAAyB,oBAAdC,UAA2B,OAAO,EAC7C,MAAMC,EAAcD,UAA6EC,WACjG,MAA0C,mBAA/BA,aAAU,EAAVA,EAAYC,iBACdD,EAAWC,kBAuBZA,GACFR,EAAiBS,QAAUC,OAAOC,sBAAsBP,OAD1D,CAKA,GAAIR,EAAuBa,SAAWd,EAAYiB,OAAS,GACzD,GAAIP,EAAON,EAAaU,SAAW,MACjCV,EAAaU,QAAUJ,GACG,UAAtBP,EAAaW,eAAS,IAAAI,OAAA,EAAAA,EAAAC,SACxBhB,EAAaW,QAAQK,MAAMC,WAAa,OACxCjB,EAAaW,QAAQK,MAAME,UAAY,iBAGzCpB,EAAuBa,QAAU,GAC5Bf,GAAM,YAER,GAAIW,EAAON,EAAaU,SAAWjB,EAAO,CAC/CO,EAAaU,QAAUJ,EACvB,MAAMY,IAAerB,EAAuBa,QAAUhB,GAC5B,UAAtBK,EAAaW,eAAS,IAAAS,OAAA,EAAAA,EAAAJ,SACxBhB,EAAaW,QAAQK,MAAMC,WAAa,yBACxCjB,EAAaW,QAAQK,MAAME,UAAY,eAAeC,OAEzD,CAEDjB,EAAiBS,QAAUE,sBAAsBP,EAtBhD,GA2BH,OAFAJ,EAAiBS,QAAUE,sBAAsBP,GAE1C,KACLe,qBAAqBnB,EAAiBS,WAGvC,IAGDW,EAACC,EAAU,CAAAC,YAAa,CAAElC,KAAM,CAACF,EAAmBE,KAAMa,EAAgBb,OACxEmC,SAAAH,EAAA,MAAA,CAAKI,IAAK1B,WAAeH,EAAY8B,IAAKC,GAAYA"}
+{"version":3,"file":"ct-design-vertical-ticker.browser.esm.js","sources":["../packages/components/VerticalTicker/src/style.ts","../packages/components/VerticalTicker/src/VerticalTicker.tsx"],"sourcesContent":[null,null],"names":["staticTickerStyles","makeStyles","root","overflow","VerticalTicker","elements","delay","height","loop","clonedFirstElem","React","cloneElement","key","elementList","currentTranslatedIndex","useRef","containerRef","lastTickTime","animationFrameId","containerStyles","useStyles","useEffect","textTickerAnimation","time","navigator","scheduling","isInputPending","current","window","requestAnimationFrame","length","_a","style","transition","transform","translateY","_b","cancelAnimationFrame","_jsx","Container","styleConfig","children","ref","map","element"],"mappings":"mOAEO,MAAMA,EAAqBC,EAAW,KAAO,CAClDC,KAAM,CACJC,SAAU,aCeRC,EAAiD,EAAGC,WAAUC,QAAQ,IAAMC,SAAQC,QAAO,MAC/F,MAAMC,EAAkBC,EAAMC,aAAaN,EAAS,GAA0B,CAC5EO,IAAK,oBAEDC,EAAc,IAAIR,EAAUI,GAC5BK,EAAyBC,EAAO,GAChCC,EAAeD,EAAuB,MACtCE,EAAeF,EAAO,GACtBG,EAAmBH,EAAO,GAE1BI,EAAkBC,EACtB,KAAO,CACLlB,KAAM,CACJK,YAGJ,CAACA,IAyCH,OAtCAc,EAAU,KACR,MAAMC,EAAuBC,YAC3B,GA9BiB,MACrB,GAAyB,oBAAdC,UAA2B,OAAO,EAC7C,MAAMC,EAAcD,UAA6EC,WACjG,MAA0C,mBAA/BA,aAAU,EAAVA,EAAYC,iBACdD,EAAWC,kBA0BZA,GACFR,EAAiBS,QAAUC,OAAOC,sBAAsBP,OAD1D,CAKA,GAAIR,EAAuBa,SAAWd,EAAYiB,OAAS,GACzD,GAAIP,EAAON,EAAaU,SAAW,MACjCV,EAAaU,QAAUJ,GACG,UAAtBP,EAAaW,eAAS,IAAAI,OAAA,EAAAA,EAAAC,SACxBhB,EAAaW,QAAQK,MAAMC,WAAa,OACxCjB,EAAaW,QAAQK,MAAME,UAAY,iBAGzCpB,EAAuBa,QAAU,GAC5BnB,GAAM,YAER,GAAIe,EAAON,EAAaU,SAAWrB,EAAO,CAC/CW,EAAaU,QAAUJ,EACvB,MAAMY,IAAerB,EAAuBa,QAAUpB,GAC5B,UAAtBS,EAAaW,eAAS,IAAAS,OAAA,EAAAA,EAAAJ,SACxBhB,EAAaW,QAAQK,MAAMC,WAAa,yBACxCjB,EAAaW,QAAQK,MAAME,UAAY,eAAeC,OAEzD,CAEDjB,EAAiBS,QAAUE,sBAAsBP,EAtBhD,GA2BH,OAFAJ,EAAiBS,QAAUE,sBAAsBP,GAE1C,KACLe,qBAAqBnB,EAAiBS,WAGvC,IAGDW,EAACC,EAAU,CAAAC,YAAa,CAAEtC,KAAM,CAACF,EAAmBE,KAAMiB,EAAgBjB,OACxEuC,SAAAH,EAAA,MAAA,CAAKI,IAAK1B,WAAeH,EAAY8B,IAAKC,GAAYA"}

package/dist/ct-design-vertical-ticker.cjs.js

@@ -1,10 +1,14 @@
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');
-var react = require('react');
+var React = require('react');
 var ctDesignContainer = require('@cleartrip/ct-design-container');
 var ctDesignStyleManager = require('@cleartrip/ct-design-style-manager');
 
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefault(React);
+
 const staticTickerStyles = ctDesignStyleManager.makeStyles(() => ({
     root: {
         overflow: 'hidden',
@@ -21,17 +25,20 @@ const isInputPending = () => {
     return false;
 };
 const VerticalTicker = ({ elements, delay = 3000, height, loop = true }) => {
-    const elementList = [...elements, elements[0]];
-    const currentTranslatedIndex = react.useRef(0);
-    const containerRef = react.useRef(null);
-    const lastTickTime = react.useRef(0);
-    const animationFrameId = react.useRef(0);
+    const clonedFirstElem = React__default.default.cloneElement(elements[0], {
+        key: 'clone-fist-elem',
+    });
+    const elementList = [...elements, clonedFirstElem];
+    const currentTranslatedIndex = React.useRef(0);
+    const containerRef = React.useRef(null);
+    const lastTickTime = React.useRef(0);
+    const animationFrameId = React.useRef(0);
     const containerStyles = ctDesignStyleManager.useStyles(() => ({
         root: {
             height,
         },
     }), [height]);
-    react.useEffect(() => {
+    React.useEffect(() => {
         const textTickerAnimation = (time) => {
             var _a, _b;
             if (isInputPending()) {

package/dist/ct-design-vertical-ticker.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"ct-design-vertical-ticker.cjs.js","sources":["../packages/components/VerticalTicker/src/style.ts","../packages/components/VerticalTicker/src/VerticalTicker.tsx"],"sourcesContent":[null,null],"names":["makeStyles","useRef","useStyles","useEffect","_jsx","Container"],"mappings":"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"}
+{"version":3,"file":"ct-design-vertical-ticker.cjs.js","sources":["../packages/components/VerticalTicker/src/style.ts","../packages/components/VerticalTicker/src/VerticalTicker.tsx"],"sourcesContent":[null,null],"names":["makeStyles","React","useRef","useStyles","useEffect","_jsx","Container"],"mappings":"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"}

package/dist/ct-design-vertical-ticker.esm.js

@@ -1,5 +1,5 @@
 import { jsx } from 'react/jsx-runtime';
-import { useRef, useEffect } from 'react';
+import React, { useRef, useEffect } from 'react';
 import { Container } from '@cleartrip/ct-design-container';
 import { makeStyles, useStyles } from '@cleartrip/ct-design-style-manager';
 
@@ -19,7 +19,10 @@ const isInputPending = () => {
     return false;
 };
 const VerticalTicker = ({ elements, delay = 3000, height, loop = true }) => {
-    const elementList = [...elements, elements[0]];
+    const clonedFirstElem = React.cloneElement(elements[0], {
+        key: 'clone-fist-elem',
+    });
+    const elementList = [...elements, clonedFirstElem];
     const currentTranslatedIndex = useRef(0);
     const containerRef = useRef(null);
     const lastTickTime = useRef(0);

package/dist/ct-design-vertical-ticker.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ct-design-vertical-ticker.esm.js","sources":["../packages/components/VerticalTicker/src/style.ts","../packages/components/VerticalTicker/src/VerticalTicker.tsx"],"sourcesContent":[null,null],"names":["_jsx"],"mappings":"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"}
+{"version":3,"file":"ct-design-vertical-ticker.esm.js","sources":["../packages/components/VerticalTicker/src/style.ts","../packages/components/VerticalTicker/src/VerticalTicker.tsx"],"sourcesContent":[null,null],"names":["_jsx"],"mappings":"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"}

package/dist/ct-design-vertical-ticker.umd.js

@@ -2,7 +2,11 @@
     typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react/jsx-runtime'), require('react'), require('@cleartrip/ct-design-container'), require('@cleartrip/ct-design-style-manager')) :
     typeof define === 'function' && define.amd ? define(['exports', 'react/jsx-runtime', 'react', '@cleartrip/ct-design-container', '@cleartrip/ct-design-style-manager'], factory) :
     (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.CTDesignSystemVerticalTicker = {}, global.jsxRuntime, global.React, global.ctDesignContainer, global.ctDesignStyleManager));
-})(this, (function (exports, jsxRuntime, react, ctDesignContainer, ctDesignStyleManager) { 'use strict';
+})(this, (function (exports, jsxRuntime, React, ctDesignContainer, ctDesignStyleManager) { 'use strict';
+
+    function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+    var React__default = /*#__PURE__*/_interopDefault(React);
 
     const staticTickerStyles = ctDesignStyleManager.makeStyles(() => ({
         root: {
@@ -20,17 +24,20 @@
         return false;
     };
     const VerticalTicker = ({ elements, delay = 3000, height, loop = true }) => {
-        const elementList = [...elements, elements[0]];
-        const currentTranslatedIndex = react.useRef(0);
-        const containerRef = react.useRef(null);
-        const lastTickTime = react.useRef(0);
-        const animationFrameId = react.useRef(0);
+        const clonedFirstElem = React__default.default.cloneElement(elements[0], {
+            key: 'clone-fist-elem',
+        });
+        const elementList = [...elements, clonedFirstElem];
+        const currentTranslatedIndex = React.useRef(0);
+        const containerRef = React.useRef(null);
+        const lastTickTime = React.useRef(0);
+        const animationFrameId = React.useRef(0);
         const containerStyles = ctDesignStyleManager.useStyles(() => ({
             root: {
                 height,
             },
         }), [height]);
-        react.useEffect(() => {
+        React.useEffect(() => {
             const textTickerAnimation = (time) => {
                 var _a, _b;
                 if (isInputPending()) {

package/dist/ct-design-vertical-ticker.umd.js.map

@@ -1 +1 @@
-{"version":3,"file":"ct-design-vertical-ticker.umd.js","sources":["../packages/components/VerticalTicker/src/style.ts","../packages/components/VerticalTicker/src/VerticalTicker.tsx"],"sourcesContent":[null,null],"names":["makeStyles","useRef","useStyles","useEffect","_jsx","Container"],"mappings":"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"}
+{"version":3,"file":"ct-design-vertical-ticker.umd.js","sources":["../packages/components/VerticalTicker/src/style.ts","../packages/components/VerticalTicker/src/VerticalTicker.tsx"],"sourcesContent":[null,null],"names":["makeStyles","React","useRef","useStyles","useEffect","_jsx","Container"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cleartrip/ct-design-vertical-ticker",
-  "version": "5.17.0",
+  "version": "5.18.0-SNAPSHOT-native-main.0",
   "description": "VerticalTicker Component",
   "types": "dist/index.d.ts",
   "react-native": "src/index.native.ts",
@@ -17,9 +17,9 @@
     "src"
   ],
   "dependencies": {
-    "@cleartrip/ct-design-container": "5.18.0",
-    "@cleartrip/ct-design-theme": "5.17.0",
-    "@cleartrip/ct-design-style-manager": "5.17.0"
+    "@cleartrip/ct-design-container": "5.19.0-SNAPSHOT-native-main.0",
+    "@cleartrip/ct-design-style-manager": "5.17.1-SNAPSHOT-native-main.0",
+    "@cleartrip/ct-design-theme": "5.18.0-SNAPSHOT-native-main.0"
   },
   "peerDependencies": {
     "react": ">=16.8.0",

package/src/VerticalTicker.native.tsx

@@ -8,7 +8,10 @@ import { staticTickerStyles } from './style';
 import { IVerticalTickerProps } from './type';
 
 const VerticalTicker: React.FC<IVerticalTickerProps> = ({ elements, delay = 3000, height, loop = true }) => {
-  const elementList = [...elements, elements[0]];
+  const clonedFirstElem = React.cloneElement(elements[0] as React.ReactElement, {
+    key: 'clone-fist-elem',
+  });
+  const elementList = [...elements, clonedFirstElem];
   const currentTranslatedIndex = useRef(0);
   const lastTickTime = useRef(0);
   const animationFrameId = useRef(0);

package/src/VerticalTicker.tsx

@@ -18,7 +18,10 @@ const isInputPending = (): boolean => {
 };
 
 const VerticalTicker: React.FC<IVerticalTickerProps> = ({ elements, delay = 3000, height, loop = true }) => {
-  const elementList = [...elements, elements[0]];
+  const clonedFirstElem = React.cloneElement(elements[0] as React.ReactElement, {
+    key: 'clone-fist-elem',
+  });
+  const elementList = [...elements, clonedFirstElem];
   const currentTranslatedIndex = useRef(0);
   const containerRef = useRef<HTMLDivElement>(null);
   const lastTickTime = useRef(0);