UNPKG

cupertino-text

Version:

A beautiful Cupertino-style slide-down fade-in text animation effect for React applications, with Apple-style staggered animations

3 lines (2 loc) 3.63 kB
"use strict";var t=require("react");function e(t,e){(null==e||e>t.length)&&(e=t.length);for(var r=0,n=Array(e);r<e;r++)n[r]=t[r];return n}function r(t,e,r){return(e=function(t){var e=function(t,e){if("object"!=typeof t||!t)return t;var r=t[Symbol.toPrimitive];if(void 0!==r){var n=r.call(t,e);if("object"!=typeof n)return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===e?String:Number)(t)}(t,"string");return"symbol"==typeof e?e:e+""}(e))in t?Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}):t[e]=r,t}function n(t,e){var r=Object.keys(t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(t);e&&(n=n.filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),r.push.apply(r,n)}return r}function i(t){for(var e=1;e<arguments.length;e++){var i=null!=arguments[e]?arguments[e]:{};e%2?n(Object(i),!0).forEach((function(e){r(t,e,i[e])})):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(i)):n(Object(i)).forEach((function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(i,e))}))}return t}function o(t,r){return function(t){if(Array.isArray(t))return t}(t)||function(t,e){var r=null==t?null:"undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(null!=r){var n,i,o,c,a=[],l=!0,u=!1;try{if(o=(r=r.call(t)).next,0===e){if(Object(r)!==r)return;l=!1}else for(;!(l=(n=o.call(r)).done)&&(a.push(n.value),a.length!==e);l=!0);}catch(t){u=!0,i=t}finally{try{if(!l&&null!=r.return&&(c=r.return(),Object(c)!==c))return}finally{if(u)throw i}}return a}}(t,r)||function(t,r){if(t){if("string"==typeof t)return e(t,r);var n={}.toString.call(t).slice(8,-1);return"Object"===n&&t.constructor&&(n=t.constructor.name),"Map"===n||"Set"===n?Array.from(t):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?e(t,r):void 0}}(t,r)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}module.exports=function(e){var r=e.children,n=e.delay,c=void 0===n?0:n,a=e.duration,l=void 0===a?800:a,u=e.stagger,s=void 0===u?80:u,f=e.distance,y=void 0===f?60:f,b=e.className,p=void 0===b?"":b,m=e.style,v=void 0===m?{}:m,d=e.lines,g=void 0!==d&&d,O=e.triggerOnce,h=void 0===O||O,j=o(t.useState(!1),2),w=j[0],P=j[1],S=o(t.useState(!1),2),E=S[0],x=S[1],A=t.useRef(null);t.useEffect((function(){var t=new IntersectionObserver((function(t){var e=o(t,1)[0];!e.isIntersecting||h&&E?h||e.isIntersecting||P(!1):setTimeout((function(){P(!0),h&&x(!0)}),c)}),{threshold:.1});return A.current&&t.observe(A.current),function(){return t.disconnect()}}),[c,h,E]);return t.createElement("div",{ref:A,className:p,style:i({overflow:"hidden"},v)},function(){if("string"!=typeof r)return t.createElement("span",{style:{display:"inline-block",transform:w?"translateY(0)":"translateY(".concat(y,"px)"),opacity:w?1:0,transition:"all ".concat(l,"ms cubic-bezier(0.25, 0.46, 0.45, 0.94)"),transitionDelay:"".concat(c,"ms")}},r);var e,n=(e=r,g?e.split("\n").map((function(t,e){return{content:t,index:e}})):e.split(" ").map((function(t,e){return{content:t,index:e}})));return n.map((function(e,r){return t.createElement("span",{key:r,style:{display:g?"block":"inline-block",transform:w?"translateY(0)":"translateY(".concat(y,"px)"),opacity:w?1:0,transition:"all ".concat(l,"ms cubic-bezier(0.25, 0.46, 0.45, 0.94)"),transitionDelay:"".concat(r*s+c,"ms"),marginRight:g?"0":"0.25em"}},e.content,g&&r<n.length-1&&t.createElement("br",null))}))}())}; //# sourceMappingURL=index.js.map