stories-react - npm Package Compare versions

Comparing version 1.0.18 to 1.1.0

dist/Components/Actions/Actions.component.d.ts

@@ -1,2 +0,1 @@
-/// <reference types="react" />
 interface IActionsProps {
@@ -3,0 +2,0 @@ onNextClick: () => void;

dist/Components/Actions/Actions.constants.d.ts

 export declare const EVENT_TYPE: Readonly<{
-    MOUSE_DOWN: string;
-    MOUSE_UP: string;
-    TOUCH_START: string;
-    TOUCH_END: string;
+    MOUSE_DOWN: "mouseDown";
+    MOUSE_UP: "mouseUp";
+    TOUCH_START: "touchStart";
+    TOUCH_END: "touchEnd";
 }>;
 export declare const EVENT_REGION: Readonly<{
-    LEFT: string;
-    RIGHT: string;
+    LEFT: "left";
+    RIGHT: "right";
 }>;
 //# sourceMappingURL=Actions.constants.d.ts.map

dist/Components/CustomComponent/CustomComponents.component.d.ts

@@ -1,4 +0,3 @@
-/// <reference types="react" />
 import { IStoryComponentProps } from '../../types';
 export declare function CustomComponent(props: IStoryComponentProps): JSX.Element;
 //# sourceMappingURL=CustomComponents.component.d.ts.map

dist/Components/Image/Image.component.d.ts

@@ -1,4 +0,3 @@
-/// <reference types="react" />
 import { IStoryComponentProps } from '../../types';
 export declare function Image(props: IStoryComponentProps): JSX.Element;
 //# sourceMappingURL=Image.component.d.ts.map

dist/Components/Progress/Progress.component.d.ts

@@ -1,2 +0,1 @@
-/// <reference types="react" />
 interface IProgressProps {
@@ -3,0 +2,0 @@ activeStoryIndex: number;

dist/Components/ProgressBar/ProgressBar.component.d.ts

@@ -1,2 +0,1 @@
-/// <reference types="react" />
 import { IStoryIndexedObject } from '../../types';
@@ -3,0 +2,0 @@ interface IProgressBarProps {

dist/Components/SeeMore/SeeMore.component.d.ts

@@ -1,2 +0,1 @@
-/// <reference types="react" />
 import { IStoryIndexedObject } from '../../types';
@@ -3,0 +2,0 @@ interface Iprops {

dist/Components/SeeMoreComponent/SeeMoreComponent.component.d.ts

@@ -1,2 +0,1 @@
-/// <reference types="react" />
 import { IStoryIndexedObject } from '../../types';
@@ -3,0 +2,0 @@ interface IProps {

dist/Components/SoundIcon/SoundIcon.component.d.ts

@@ -1,2 +0,1 @@
-/// <reference types="react" />
 interface IProps {
@@ -3,0 +2,0 @@ type: string;

dist/Components/Story/Story.component.d.ts

@@ -1,4 +0,3 @@
-/// <reference types="react" />
 import { IStoryComponentProps } from '../../types';
 export declare function Story(props: IStoryComponentProps): JSX.Element;
 //# sourceMappingURL=Story.component.d.ts.map

dist/Components/Story/Story.constants.d.ts

 export declare const STORY_TYPES: Readonly<{
-    IMAGE: string;
-    VIDEO: string;
-    COMPONENT: string;
+    IMAGE: "image";
+    VIDEO: "video";
+    COMPONENT: "component";
 }>;
 //# sourceMappingURL=Story.constants.d.ts.map

dist/Components/Video/Video.component.d.ts

@@ -1,4 +0,3 @@
-/// <reference types="react" />
 import { IStoryComponentProps } from '../../types';
 export declare function Video(props: IStoryComponentProps): JSX.Element;
 //# sourceMappingURL=Video.component.d.ts.map

dist/index.d.ts

@@ -1,4 +0,3 @@
-/// <reference types="react" />
 import { IStoryProps } from './types';
 export default function Stories({ stories, width, height, onStoryChange, currentIndex, defaultDuration, onAllStoriesEnd, onStoriesStart, classNames, pauseStoryWhenInActiveWindow, }: IStoryProps): JSX.Element | null;
 //# sourceMappingURL=index.d.ts.map

dist/index.esm.js

@@ -1,2 +0,2 @@
-import{jsxs as e,jsx as n}from"react/jsx-runtime";import{createContext as t,useState as o,useRef as r,Fragment as i,useEffect as u,useContext as s,useMemo as c}from"react";var a=function(){return a=Object.assign||function(e){for(var n,t=1,o=arguments.length;t<o;t++)for(var r in n=arguments[t])Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r]);return e},a.apply(this,arguments)},l=t({stories:[],width:"100%",height:"100%",defaultDuration:1e4,isPaused:!1});Object.freeze({MOUSE_DOWN:"mouseDown",MOUSE_UP:"mouseUp",TOUCH_START:"touchStart",TOUCH_END:"touchEnd"});var d=Object.freeze({LEFT:"left",RIGHT:"right"}),v="Actions-styles_left__eky50",f="Actions-styles_right__zguoH";function y(t){var u=t.onNextClick,s=t.onPrevClick,c=t.onPause,l=t.onResume,y=o(!1),m=y[0],h=y[1],p=r(null);function _(e){e.stopPropagation(),e.preventDefault(),clearTimeout(p.current),p.current=setTimeout((function(){c(),h(!0)}),200)}function w(e,n){if(n.stopPropagation(),n.preventDefault(),clearTimeout(p.current),m)return l(),void h(!1);l(),e!=d.LEFT?u():s()}function g(e){return{onMouseUp:function(n){return w(e,n)},onTouchEnd:function(n){return w(e,n)},onTouchStart:function(e){return _(e)},onMouseDown:function(e){return _(e)}}}return e(i,{children:[n("div",a({className:v},g(d.LEFT)),void 0),n("div",a({className:f},g(d.RIGHT)),void 0)]},void 0)}function m(){return s(l)}var h="ProgressBar-styles_wrapper__oqUCo",p="ProgressBar-styles_bar__x0O50",_=0,w=.1;function g(e){var t,i,s,c,l,d=m(),v=d.defaultDuration,f=d.classNames,y=r(null),g=r(null),x=o(!1),P=x[0],S=x[1];return u((function(){!e.isPaused&&e.isActive&&e.isActive?S(!0):S(!1)}),[e.isActive,e.isPaused]),u((function(){var n;y.current&&(e.hasStoryPassed?y.current.style.width="".concat(null===(n=null==g?void 0:g.current)||void 0===n?void 0:n.offsetWidth,"px"):y.current.style.width="0px")}),[e.hasStoryPassed,e.isActive]),t=function(n){var t;y.current&&g.current&&((_=Number((y.current.style.width||"1px").slice(0,y.current.style.width.length-2))||0)>g.current.offsetWidth?S(!1):(w=(null===(t=null==g?void 0:g.current)||void 0===t?void 0:t.offsetWidth)/((e.story.duration||v)/n),y.current.style.width="".concat(_+w,"px")))},i=P,s=r(),c=r(),l=r(t),u((function(){l.current=t}),[t]),u((function(){return!1!==i?(s.current=requestAnimationFrame((function e(n){if(null!=c.current){var t=n-c.current;l.current(t)}c.current=n,s.current=requestAnimationFrame(e)})),function(){cancelAnimationFrame(s.current),s.current=null,c.current=null}):function(){s.current&&(s.current=null),cancelAnimationFrame(s.current),c.current=null}}),[i]),n("div",a({className:"".concat(h," ").concat((null==f?void 0:f.progressBarContainer)||""),ref:g},{children:n("div",{className:"".concat(p," ").concat((null==f?void 0:f.progressBar)||""),ref:y},void 0)}),void 0)}var x="progress-styles_wrapper__qQPyW";function P(e){var t=m(),o=t.stories,r=t.classNames;return n("div",a({className:"".concat(x," ").concat((null==r?void 0:r.progressContainer)||""),style:{gridTemplateColumns:"repeat(".concat(o.length,",1fr)")}},{children:o.map((function(t){return n(g,{hasStoryPassed:t.index<e.activeStoryIndex,isActive:t.index===e.activeStoryIndex,story:t,isPaused:t.index===e.activeStoryIndex&&e.isPaused},t.index)}))}),void 0)}var S=Object.freeze({IMAGE:"image",VIDEO:"video",COMPONENT:"component"}),M="Story-styles_wrapper__oJP7j",N="Story-styles_header__-rnWL",C="Image-styles_image__gnfW1";function T(e){return u((function(){e.onPause()}),[]),n("img",{className:C,src:e.story.url,alt:"story",onLoad:function(){setTimeout((function(){e.onResume()}),4)}},void 0)}var E,I="Video-styles_video__BykuO",O="Video-styles_loaderWrapper__TqVWk",D="Video-styles_loader__FxxSV",b="Video-styles_soundIcon__ZvYXE";function A(e){return"off"===e.type?n("svg",a({xmlns:"http://www.w3.org/2000/svg",width:"16",height:"16",viewBox:"0 0 24 24",fill:"white"},{children:n("path",{d:"M3 9v6h-1v-6h1zm13-7l-9 5v2.288l7-3.889v13.202l-7-3.889v2.288l9 5v-20zm-11 5h-5v10h5v-10zm17.324 4.993l1.646-1.659-1.324-1.324-1.651 1.67-1.665-1.648-1.316 1.318 1.67 1.657-1.65 1.669 1.318 1.317 1.658-1.672 1.666 1.653 1.324-1.325-1.676-1.656z"},void 0)}),void 0):n("svg",a({xmlns:"http://www.w3.org/2000/svg",width:"16",height:"16",viewBox:"0 0 24 24",fill:"white"},{children:n("path",{d:"M22 0v24l-11-6v-2.278l9 4.909v-17.262l-9 4.91v-2.279l11-6zm-13 6v12h-7v-12h7zm-2 2h-3v8h3v-8z"},void 0)}),void 0)}var k="RSIsMute",W="undefined"==typeof window?{}:window;function z(t){var s,c=m().isPaused,l=o("true"===(null===(s=null==W?void 0:W.localStorage)||void 0===s?void 0:s.getItem(k))),d=l[0],v=l[1],f=o(!1),y=f[0],h=f[1],p=r(null);function _(e){var n;null===(n=null==W?void 0:W.localStorage)||void 0===n||n.setItem(k,String(e)),v(e)}return u((function(){t.onPause(),h(!0)}),[]),u((function(){p.current&&(!c||p.current.paused?p.current.play().catch((function(){var e;_(!0),null===(e=p.current)||void 0===e||e.play()})):p.current.pause())}),[c]),e(i,{children:[e("video",a({className:I,ref:p,playsInline:!0,"webkit-playsinline":"",controls:!1,src:t.story.url,onLoadedData:function(){setTimeout((function(){t.onResume(),h(!1)}),4)},muted:d},{children:[n("source",{src:t.story.url,type:"video/mp4"},void 0),n("source",{src:t.story.url,type:"video/webm"},void 0),n("source",{src:t.story.url,type:"video/ogg"},void 0),n("p",{children:"Video not supported"},void 0)]}),void 0),n("div",a({className:b,onClick:function(){return _(!d)}},{children:n(A,{type:d?"off":"on"},void 0)}),void 0),y&&n("div",a({className:O},{children:n("div",{className:D},void 0)}),void 0)]},void 0)}null===(E=null==W?void 0:W.localStorage)||void 0===E||E.setItem(k,"true");var L="CustomComponents-styles_component__w87Wx";function R(e){return n("div",a({className:L},{children:n(e.story.component,{pause:e.onPause,resume:e.onResume,story:e.story,isPaused:e.isPaused},void 0)}),void 0)}var F="SeeMore-styles_seeMoreWrapper__kwjif",V="SeeMore-styles_defaultSeeMore__-B1QW";function j(t){return t.story.seeMore?n("button",a({type:"button",onClick:function(){t.onSeeMoreClick()},className:F},{children:function(){var o=t.story.seeMore,r=typeof o;if(["string","boolean"].includes(r)){var i="string"===r?o:"See More";return e("div",a({className:V},{children:[n("span",{children:"^"},void 0),n("p",{children:i},void 0)]}),void 0)}return"function"===r?n(t.story.seeMore,{},void 0):t.story.seeMore}()}),void 0):null}var B="SeeMoreComponent-styles_seeMoreComponentWrapper__0T6Ap",U="SeeMoreComponent-styles_closeIcon__LMm3b";function q(t){return t.story.seeMore&&t.story.seeMoreComponent?e("div",a({className:B},{children:[n("button",a({className:U,onClick:t.onClose},{children:"✕"}),void 0),"function"==typeof t.story.seeMoreComponent?n(t.story.seeMoreComponent,{},void 0):t.story.seeMoreComponent]}),void 0):null}function H(t){var r=o(!1),i=r[0],s=r[1],c=m().classNames;return u((function(){s(!1)}),[t.story]),e("div",a({className:"".concat(M," ").concat((null==c?void 0:c.storyContainer)||"")},{children:[t.story.type===S.IMAGE?n(T,a({},t),void 0):t.story.type===S.VIDEO?n(z,a({},t),void 0):t.story.type===S.COMPONENT?n(R,a({},t),void 0):null,t.story.header&&n("div",a({className:N},{children:"function"==typeof t.story.header?n(t.story.header,{},void 0):t.story.header}),void 0),n(j,{onSeeMoreClick:function(){var e,n;t.onPause(),s(!0),null===(n=(e=t.story).onSeeMoreClick)||void 0===n||n.call(e,t.story.index)},story:t.story},void 0),i&&n(q,{story:t.story,onClose:function(){t.onResume(),s(!1)}},void 0)]}),void 0)}var G="styles_main__-0FEu";function Q(e){return void 0===e&&(e=4),Number(Math.random().toFixed(e))}function J(t){var i,s,d,v,f,m,h,p=t.stories,_=void 0===p?[]:p,w=t.width,g=void 0===w?"100%":w,x=t.height,S=void 0===x?"100%":x,M=t.onStoryChange,N=void 0===M?function(){}:M,C=t.currentIndex,T=void 0===C?0:C,E=t.defaultDuration,I=void 0===E?1e4:E,O=t.onAllStoriesEnd,D=void 0===O?function(){}:O,b=t.onStoriesStart,A=void 0===b?function(){}:b,k=t.classNames,W=void 0===k?{}:k,z=t.pauseStoryWhenInActiveWindow,L=void 0===z||z,R=c((function(){return function(e,n){var t=0;return e.map((function(e,o){var r=e.duration||n,i=r+Q();return i===t&&(i=r+Q(6)),t=i,a(a({},e),{index:o,calculatedDuration:i})}))}(_,I)}),[_,I]),F=o(),V=F[0],j=F[1],B=_.length-1,U=o(!1),q=U[0],J=U[1],X=r(!1),Y=r(!1);function Z(){X.current||(null==V?void 0:V.index)!==B||(D(),X.current=!0),(null==V?void 0:V.index)!==B&&j((function(e){if(!e)return R[0];var n=(null==e?void 0:e.index)+1;return R[n]}))}function K(){J(!0)}function $(){J(!1)}u((function(){Y.current||(Y.current=!0,A())}),[A]),u((function(){var e=R[T];e&&j(e)}),[T,_]),u((function(){V&&N(V.index)}),[V]),s=function(){Z()},d=null!==(i=null==V?void 0:V.calculatedDuration)&&void 0!==i?i:null,v=q,f=r(),m=r(d),h=r(Date.now()),u((function(){f.current=s}),[s]),u((function(){m.current=d}),[d]),u((function(){if(null!==d&&!1===v){h.current=Date.now();var e=setTimeout((function(){f.current()}),m.current);return function(){clearTimeout(e)}}return function(){}}),[d,v]),u((function(){v&&(m.current=m.current-(Date.now()-h.current))}),[v]),function(e){var n=r(e);u((function(){n.current=e}),[e]),u((function(){function e(){n.current(!0)}function t(){n.current(!1)}return window.addEventListener("focus",e),window.addEventListener("blur",t),function(){window.removeEventListener("focus",e),window.removeEventListener("blur",t)}}),[])}((function(e){L&&J(!e)}));var ee={stories:R,width:g,height:S,defaultDuration:I,isPaused:q,classNames:W};return V?n(l.Provider,a({value:ee},{children:e("div",a({className:"".concat(G," ").concat(W.main||""),style:{width:g,height:S}},{children:[n(P,{activeStoryIndex:V.index,isPaused:q},void 0),n(H,{onPause:K,onResume:$,story:V,isPaused:q},V.index),n(y,{onNextClick:Z,onPrevClick:function(){0!==(null==V?void 0:V.index)&&j((function(e){if(!e)return R[0];var n=(null==e?void 0:e.index)-1;return R[n]}))},onPause:K,onResume:$},void 0)]}),void 0)}),void 0):null}export{J as default};
+import{jsxs as e,jsx as n}from"react/jsx-runtime";import{createContext as t,useState as r,useRef as o,Fragment as i,useEffect as u,useContext as s,useMemo as c}from"react";var l=function(){return l=Object.assign||function(e){for(var n,t=1,r=arguments.length;t<r;t++)for(var o in n=arguments[t])Object.prototype.hasOwnProperty.call(n,o)&&(e[o]=n[o]);return e},l.apply(this,arguments)},a=t({stories:[],width:"100%",height:"100%",defaultDuration:1e4,isPaused:!1}),d=Object.freeze({LEFT:"left",RIGHT:"right"}),v="Actions-styles_left__eky50",f="Actions-styles_right__zguoH";function y(t){var u=t.onNextClick,s=t.onPrevClick,c=t.onPause,a=t.onResume,y=r(!1),m=y[0],h=y[1],p=o(null);function _(e){e.stopPropagation(),e.preventDefault(),clearTimeout(p.current),p.current=setTimeout((function(){c(),h(!0)}),200)}function w(e,n){if(n.stopPropagation(),n.preventDefault(),clearTimeout(p.current),m)return a(),void h(!1);a(),e!=d.LEFT?u():s()}function g(e){return{onMouseUp:function(n){return w(e,n)},onTouchEnd:function(n){return w(e,n)},onTouchStart:function(e){return _(e)},onMouseDown:function(e){return _(e)}}}return e(i,{children:[n("div",l({className:v},g(d.LEFT))),n("div",l({className:f},g(d.RIGHT)))]})}function m(){return s(a)}var h="ProgressBar-styles_wrapper__oqUCo",p="ProgressBar-styles_bar__x0O50",_=0,w=.1;function g(e){var t,i,s,c,a,d=m(),v=d.defaultDuration,f=d.classNames,y=o(null),g=o(null),x=r(!1),P=x[0],M=x[1];return u((function(){!e.isPaused&&e.isActive&&e.isActive?M(!0):M(!1)}),[e.isActive,e.isPaused]),u((function(){var n;y.current&&(e.hasStoryPassed?y.current.style.width="".concat(null===(n=null==g?void 0:g.current)||void 0===n?void 0:n.offsetWidth,"px"):y.current.style.width="0px")}),[e.hasStoryPassed,e.isActive]),t=function(n){var t;y.current&&g.current&&((_=Number((y.current.style.width||"1px").slice(0,y.current.style.width.length-2))||0)>g.current.offsetWidth?M(!1):(w=(null===(t=null==g?void 0:g.current)||void 0===t?void 0:t.offsetWidth)/((e.story.duration||v)/n),y.current.style.width="".concat(_+w,"px")))},i=P,s=o(),c=o(),a=o(t),u((function(){a.current=t}),[t]),u((function(){return!1!==i?(s.current=requestAnimationFrame((function e(n){if(null!=c.current){var t=n-c.current;a.current(t)}c.current=n,s.current=requestAnimationFrame(e)})),function(){cancelAnimationFrame(s.current),s.current=null,c.current=null}):function(){s.current&&(s.current=null),cancelAnimationFrame(s.current),c.current=null}}),[i]),n("div",l({className:"".concat(h," ").concat((null==f?void 0:f.progressBarContainer)||""),ref:g},{children:n("div",{className:"".concat(p," ").concat((null==f?void 0:f.progressBar)||""),ref:y})}))}var x="progress-styles_wrapper__qQPyW";function P(e){var t=m(),r=t.stories,o=t.classNames;return n("div",l({className:"".concat(x," ").concat((null==o?void 0:o.progressContainer)||""),style:{gridTemplateColumns:"repeat(".concat(r.length,",1fr)")}},{children:r.map((function(t){return n(g,{hasStoryPassed:t.index<e.activeStoryIndex,isActive:t.index===e.activeStoryIndex,story:t,isPaused:t.index===e.activeStoryIndex&&e.isPaused},t.index)}))}))}var M=Object.freeze({IMAGE:"image",VIDEO:"video",COMPONENT:"component"}),N="Story-styles_wrapper__oJP7j",S="Story-styles_header__-rnWL",C="Image-styles_image__gnfW1";function I(e){return u((function(){e.onPause()}),[]),n("img",{className:C,src:e.story.url,alt:"story",onLoad:function(){setTimeout((function(){e.onResume()}),4)}})}var T,E="Video-styles_video__BykuO",b="Video-styles_loaderWrapper__TqVWk",A="Video-styles_loader__FxxSV",k="Video-styles_soundIcon__ZvYXE";function D(e){return"off"===e.type?n("svg",l({xmlns:"http://www.w3.org/2000/svg",width:"16",height:"16",viewBox:"0 0 24 24",fill:"white"},{children:n("path",{d:"M3 9v6h-1v-6h1zm13-7l-9 5v2.288l7-3.889v13.202l-7-3.889v2.288l9 5v-20zm-11 5h-5v10h5v-10zm17.324 4.993l1.646-1.659-1.324-1.324-1.651 1.67-1.665-1.648-1.316 1.318 1.67 1.657-1.65 1.669 1.318 1.317 1.658-1.672 1.666 1.653 1.324-1.325-1.676-1.656z"})})):n("svg",l({xmlns:"http://www.w3.org/2000/svg",width:"16",height:"16",viewBox:"0 0 24 24",fill:"white"},{children:n("path",{d:"M22 0v24l-11-6v-2.278l9 4.909v-17.262l-9 4.91v-2.279l11-6zm-13 6v12h-7v-12h7zm-2 2h-3v8h3v-8z"})}))}var W="RSIsMute",O="undefined"==typeof window?{}:window;function L(t){var s,c=m().isPaused,a=r("true"===(null===(s=null==O?void 0:O.localStorage)||void 0===s?void 0:s.getItem(W))),d=a[0],v=a[1],f=r(!1),y=f[0],h=f[1],p=o(null);function _(e){var n;null===(n=null==O?void 0:O.localStorage)||void 0===n||n.setItem(W,String(e)),v(e)}return u((function(){t.onPause(),h(!0)}),[]),u((function(){p.current&&(!c||p.current.paused?p.current.play().catch((function(){var e;_(!0),null===(e=p.current)||void 0===e||e.play()})):p.current.pause())}),[c]),e(i,{children:[e("video",l({className:E,ref:p,playsInline:!0,"webkit-playsinline":"",controls:!1,src:t.story.url,onLoadedData:function(){setTimeout((function(){t.onResume(),h(!1)}),4)},muted:d},{children:[n("source",{src:t.story.url,type:"video/mp4"}),n("source",{src:t.story.url,type:"video/webm"}),n("source",{src:t.story.url,type:"video/ogg"}),n("p",{children:"Video not supported"})]})),n("div",l({className:k,onClick:function(){return _(!d)}},{children:n(D,{type:d?"off":"on"})})),y&&n("div",l({className:b},{children:n("div",{className:A})}))]})}null===(T=null==O?void 0:O.localStorage)||void 0===T||T.setItem(W,"true");var z="CustomComponents-styles_component__w87Wx";function F(e){return n("div",l({className:z},{children:n(e.story.component,{pause:e.onPause,resume:e.onResume,story:e.story,isPaused:e.isPaused})}))}var R="SeeMore-styles_seeMoreWrapper__kwjif",V="SeeMore-styles_defaultSeeMore__-B1QW";function B(t){return t.story.seeMore?n("button",l({type:"button",onClick:function(){t.onSeeMoreClick()},className:R},{children:function(){var r=t.story.seeMore,o=typeof r;if(["string","boolean"].includes(o)){var i="string"===o?r:"See More";return e("div",l({className:V},{children:[n("span",{children:"^"}),n("p",{children:i})]}))}return"function"===o?n(t.story.seeMore,{}):t.story.seeMore}()})):null}var j="SeeMoreComponent-styles_seeMoreComponentWrapper__0T6Ap",q="SeeMoreComponent-styles_closeIcon__LMm3b";function G(t){return t.story.seeMore&&t.story.seeMoreComponent?e("div",l({className:j},{children:[n("button",l({className:q,onClick:t.onClose},{children:"✕"})),"function"==typeof t.story.seeMoreComponent?n(t.story.seeMoreComponent,{}):t.story.seeMoreComponent]})):null}function H(t){var o=r(!1),i=o[0],s=o[1],c=m().classNames;return u((function(){s(!1)}),[t.story]),e("div",l({className:"".concat(N," ").concat((null==c?void 0:c.storyContainer)||"")},{children:[t.story.type===M.IMAGE?n(I,l({},t)):t.story.type===M.VIDEO?n(L,l({},t)):t.story.type===M.COMPONENT?n(F,l({},t)):null,t.story.header&&n("div",l({className:S},{children:"function"==typeof t.story.header?n(t.story.header,{}):t.story.header})),n(B,{onSeeMoreClick:function(){var e,n;t.onPause(),s(!0),null===(n=(e=t.story).onSeeMoreClick)||void 0===n||n.call(e,t.story.index)},story:t.story}),i&&n(G,{story:t.story,onClose:function(){t.onResume(),s(!1)}})]}))}var Q="styles_main__-0FEu";function U(e){return void 0===e&&(e=4),Number(Math.random().toFixed(e))}function J(t){var i,s,d,v,f,m,h,p=t.stories,_=void 0===p?[]:p,w=t.width,g=void 0===w?"100%":w,x=t.height,M=void 0===x?"100%":x,N=t.onStoryChange,S=void 0===N?function(){}:N,C=t.currentIndex,I=void 0===C?0:C,T=t.defaultDuration,E=void 0===T?1e4:T,b=t.onAllStoriesEnd,A=void 0===b?function(){}:b,k=t.onStoriesStart,D=void 0===k?function(){}:k,W=t.classNames,O=void 0===W?{}:W,L=t.pauseStoryWhenInActiveWindow,z=void 0===L||L,F=c((function(){return function(e,n){var t=0;return e.map((function(e,r){var o=e.duration||n,i=o+U();return i===t&&(i=o+U(6)),t=i,l(l({},e),{index:r,calculatedDuration:i})}))}(_,E)}),[_,E]),R=r(),V=R[0],B=R[1],j=_.length-1,q=r(!1),G=q[0],J=q[1],X=o(!1),Y=o(!1);function Z(){X.current||(null==V?void 0:V.index)!==j||(A(),X.current=!0),(null==V?void 0:V.index)!==j&&B((function(e){if(!e)return F[0];var n=(null==e?void 0:e.index)+1;return F[n]}))}function K(){J(!0)}function $(){J(!1)}u((function(){Y.current||(Y.current=!0,D())}),[D]),u((function(){var e=F[I];e&&B(e)}),[I,_]),u((function(){V&&S(V.index)}),[V]),s=function(){Z()},d=null!==(i=null==V?void 0:V.calculatedDuration)&&void 0!==i?i:null,v=G,f=o(),m=o(d),h=o(Date.now()),u((function(){f.current=s}),[s]),u((function(){m.current=d}),[d]),u((function(){if(null!==d&&!1===v){h.current=Date.now();var e=setTimeout((function(){f.current()}),m.current);return function(){clearTimeout(e)}}return function(){}}),[d,v]),u((function(){v&&(m.current=m.current-(Date.now()-h.current))}),[v]),function(e){var n=o(e);u((function(){n.current=e}),[e]),u((function(){function e(){n.current(!0)}function t(){n.current(!1)}return window.addEventListener("focus",e),window.addEventListener("blur",t),function(){window.removeEventListener("focus",e),window.removeEventListener("blur",t)}}),[])}((function(e){z&&J(!e)}));var ee={stories:F,width:g,height:M,defaultDuration:E,isPaused:G,classNames:O};return V?n(a.Provider,l({value:ee},{children:e("div",l({className:"".concat(Q," ").concat(O.main||""),style:{width:g,height:M}},{children:[n(P,{activeStoryIndex:V.index,isPaused:G}),n(H,{onPause:K,onResume:$,story:V,isPaused:G},V.index),n(y,{onNextClick:Z,onPrevClick:function(){0!==(null==V?void 0:V.index)&&B((function(e){if(!e)return F[0];var n=(null==e?void 0:e.index)-1;return F[n]}))},onPause:K,onResume:$})]}))})):null}export{J as default};
 //# sourceMappingURL=index.esm.js.map

dist/index.js

@@ -1,2 +0,2 @@
-"use strict";var e=require("react/jsx-runtime"),n=require("react"),t=function(){return t=Object.assign||function(e){for(var n,t=1,o=arguments.length;t<o;t++)for(var r in n=arguments[t])Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r]);return e},t.apply(this,arguments)},o=n.createContext({stories:[],width:"100%",height:"100%",defaultDuration:1e4,isPaused:!1});Object.freeze({MOUSE_DOWN:"mouseDown",MOUSE_UP:"mouseUp",TOUCH_START:"touchStart",TOUCH_END:"touchEnd"});var r=Object.freeze({LEFT:"left",RIGHT:"right"}),s="Actions-styles_left__eky50",i="Actions-styles_right__zguoH";function u(o){var u=o.onNextClick,c=o.onPrevClick,a=o.onPause,l=o.onResume,d=n.useState(!1),v=d[0],f=d[1],y=n.useRef(null);function m(e){e.stopPropagation(),e.preventDefault(),clearTimeout(y.current),y.current=setTimeout((function(){a(),f(!0)}),200)}function h(e,n){if(n.stopPropagation(),n.preventDefault(),clearTimeout(y.current),v)return l(),void f(!1);l(),e!=r.LEFT?u():c()}function x(e){return{onMouseUp:function(n){return h(e,n)},onTouchEnd:function(n){return h(e,n)},onTouchStart:function(e){return m(e)},onMouseDown:function(e){return m(e)}}}return e.jsxs(n.Fragment,{children:[e.jsx("div",t({className:s},x(r.LEFT)),void 0),e.jsx("div",t({className:i},x(r.RIGHT)),void 0)]},void 0)}function c(){return n.useContext(o)}var a="ProgressBar-styles_wrapper__oqUCo",l="ProgressBar-styles_bar__x0O50",d=0,v=.1;function f(o){var r,s,i,u,f,y=c(),m=y.defaultDuration,h=y.classNames,x=n.useRef(null),p=n.useRef(null),_=n.useState(!1),j=_[0],w=_[1];return n.useEffect((function(){!o.isPaused&&o.isActive&&o.isActive?w(!0):w(!1)}),[o.isActive,o.isPaused]),n.useEffect((function(){var e;x.current&&(o.hasStoryPassed?x.current.style.width="".concat(null===(e=null==p?void 0:p.current)||void 0===e?void 0:e.offsetWidth,"px"):x.current.style.width="0px")}),[o.hasStoryPassed,o.isActive]),r=function(e){var n;x.current&&p.current&&((d=Number((x.current.style.width||"1px").slice(0,x.current.style.width.length-2))||0)>p.current.offsetWidth?w(!1):(v=(null===(n=null==p?void 0:p.current)||void 0===n?void 0:n.offsetWidth)/((o.story.duration||m)/e),x.current.style.width="".concat(d+v,"px")))},s=j,i=n.useRef(),u=n.useRef(),f=n.useRef(r),n.useEffect((function(){f.current=r}),[r]),n.useEffect((function(){return!1!==s?(i.current=requestAnimationFrame((function e(n){if(null!=u.current){var t=n-u.current;f.current(t)}u.current=n,i.current=requestAnimationFrame(e)})),function(){cancelAnimationFrame(i.current),i.current=null,u.current=null}):function(){i.current&&(i.current=null),cancelAnimationFrame(i.current),u.current=null}}),[s]),e.jsx("div",t({className:"".concat(a," ").concat((null==h?void 0:h.progressBarContainer)||""),ref:p},{children:e.jsx("div",{className:"".concat(l," ").concat((null==h?void 0:h.progressBar)||""),ref:x},void 0)}),void 0)}var y="progress-styles_wrapper__qQPyW";function m(n){var o=c(),r=o.stories,s=o.classNames;return e.jsx("div",t({className:"".concat(y," ").concat((null==s?void 0:s.progressContainer)||""),style:{gridTemplateColumns:"repeat(".concat(r.length,",1fr)")}},{children:r.map((function(t){return e.jsx(f,{hasStoryPassed:t.index<n.activeStoryIndex,isActive:t.index===n.activeStoryIndex,story:t,isPaused:t.index===n.activeStoryIndex&&n.isPaused},t.index)}))}),void 0)}var h=Object.freeze({IMAGE:"image",VIDEO:"video",COMPONENT:"component"}),x="Story-styles_wrapper__oJP7j",p="Story-styles_header__-rnWL",_="Image-styles_image__gnfW1";function j(t){return n.useEffect((function(){t.onPause()}),[]),e.jsx("img",{className:_,src:t.story.url,alt:"story",onLoad:function(){setTimeout((function(){t.onResume()}),4)}},void 0)}var w,g="Video-styles_video__BykuO",S="Video-styles_loaderWrapper__TqVWk",E="Video-styles_loader__FxxSV",M="Video-styles_soundIcon__ZvYXE";function P(n){return"off"===n.type?e.jsx("svg",t({xmlns:"http://www.w3.org/2000/svg",width:"16",height:"16",viewBox:"0 0 24 24",fill:"white"},{children:e.jsx("path",{d:"M3 9v6h-1v-6h1zm13-7l-9 5v2.288l7-3.889v13.202l-7-3.889v2.288l9 5v-20zm-11 5h-5v10h5v-10zm17.324 4.993l1.646-1.659-1.324-1.324-1.651 1.67-1.665-1.648-1.316 1.318 1.67 1.657-1.65 1.669 1.318 1.317 1.658-1.672 1.666 1.653 1.324-1.325-1.676-1.656z"},void 0)}),void 0):e.jsx("svg",t({xmlns:"http://www.w3.org/2000/svg",width:"16",height:"16",viewBox:"0 0 24 24",fill:"white"},{children:e.jsx("path",{d:"M22 0v24l-11-6v-2.278l9 4.909v-17.262l-9 4.91v-2.279l11-6zm-13 6v12h-7v-12h7zm-2 2h-3v8h3v-8z"},void 0)}),void 0)}var C="RSIsMute",N="undefined"==typeof window?{}:window;function R(o){var r,s=c().isPaused,i=n.useState("true"===(null===(r=null==N?void 0:N.localStorage)||void 0===r?void 0:r.getItem(C))),u=i[0],a=i[1],l=n.useState(!1),d=l[0],v=l[1],f=n.useRef(null);function y(e){var n;null===(n=null==N?void 0:N.localStorage)||void 0===n||n.setItem(C,String(e)),a(e)}return n.useEffect((function(){o.onPause(),v(!0)}),[]),n.useEffect((function(){f.current&&(!s||f.current.paused?f.current.play().catch((function(){var e;y(!0),null===(e=f.current)||void 0===e||e.play()})):f.current.pause())}),[s]),e.jsxs(n.Fragment,{children:[e.jsxs("video",t({className:g,ref:f,playsInline:!0,"webkit-playsinline":"",controls:!1,src:o.story.url,onLoadedData:function(){setTimeout((function(){o.onResume(),v(!1)}),4)},muted:u},{children:[e.jsx("source",{src:o.story.url,type:"video/mp4"},void 0),e.jsx("source",{src:o.story.url,type:"video/webm"},void 0),e.jsx("source",{src:o.story.url,type:"video/ogg"},void 0),e.jsx("p",{children:"Video not supported"},void 0)]}),void 0),e.jsx("div",t({className:M,onClick:function(){return y(!u)}},{children:e.jsx(P,{type:u?"off":"on"},void 0)}),void 0),d&&e.jsx("div",t({className:S},{children:e.jsx("div",{className:E},void 0)}),void 0)]},void 0)}null===(w=null==N?void 0:N.localStorage)||void 0===w||w.setItem(C,"true");var T="CustomComponents-styles_component__w87Wx";function I(n){return e.jsx("div",t({className:T},{children:e.jsx(n.story.component,{pause:n.onPause,resume:n.onResume,story:n.story,isPaused:n.isPaused},void 0)}),void 0)}var O="SeeMore-styles_seeMoreWrapper__kwjif",D="SeeMore-styles_defaultSeeMore__-B1QW";function b(n){return n.story.seeMore?e.jsx("button",t({type:"button",onClick:function(){n.onSeeMoreClick()},className:O},{children:function(){var o=n.story.seeMore,r=typeof o;if(["string","boolean"].includes(r)){var s="string"===r?o:"See More";return e.jsxs("div",t({className:D},{children:[e.jsx("span",{children:"^"},void 0),e.jsx("p",{children:s},void 0)]}),void 0)}return"function"===r?e.jsx(n.story.seeMore,{},void 0):n.story.seeMore}()}),void 0):null}var A="SeeMoreComponent-styles_seeMoreComponentWrapper__0T6Ap",k="SeeMoreComponent-styles_closeIcon__LMm3b";function W(n){return n.story.seeMore&&n.story.seeMoreComponent?e.jsxs("div",t({className:A},{children:[e.jsx("button",t({className:k,onClick:n.onClose},{children:"✕"}),void 0),"function"==typeof n.story.seeMoreComponent?e.jsx(n.story.seeMoreComponent,{},void 0):n.story.seeMoreComponent]}),void 0):null}function F(o){var r=n.useState(!1),s=r[0],i=r[1],u=c().classNames;return n.useEffect((function(){i(!1)}),[o.story]),e.jsxs("div",t({className:"".concat(x," ").concat((null==u?void 0:u.storyContainer)||"")},{children:[o.story.type===h.IMAGE?e.jsx(j,t({},o),void 0):o.story.type===h.VIDEO?e.jsx(R,t({},o),void 0):o.story.type===h.COMPONENT?e.jsx(I,t({},o),void 0):null,o.story.header&&e.jsx("div",t({className:p},{children:"function"==typeof o.story.header?e.jsx(o.story.header,{},void 0):o.story.header}),void 0),e.jsx(b,{onSeeMoreClick:function(){var e,n;o.onPause(),i(!0),null===(n=(e=o.story).onSeeMoreClick)||void 0===n||n.call(e,o.story.index)},story:o.story},void 0),s&&e.jsx(W,{story:o.story,onClose:function(){o.onResume(),i(!1)}},void 0)]}),void 0)}var z="styles_main__-0FEu";function L(e){return void 0===e&&(e=4),Number(Math.random().toFixed(e))}module.exports=function(r){var s,i,c,a,l,d,v,f=r.stories,y=void 0===f?[]:f,h=r.width,x=void 0===h?"100%":h,p=r.height,_=void 0===p?"100%":p,j=r.onStoryChange,w=void 0===j?function(){}:j,g=r.currentIndex,S=void 0===g?0:g,E=r.defaultDuration,M=void 0===E?1e4:E,P=r.onAllStoriesEnd,C=void 0===P?function(){}:P,N=r.onStoriesStart,R=void 0===N?function(){}:N,T=r.classNames,I=void 0===T?{}:T,O=r.pauseStoryWhenInActiveWindow,D=void 0===O||O,b=n.useMemo((function(){return function(e,n){var o=0;return e.map((function(e,r){var s=e.duration||n,i=s+L();return i===o&&(i=s+L(6)),o=i,t(t({},e),{index:r,calculatedDuration:i})}))}(y,M)}),[y,M]),A=n.useState(),k=A[0],W=A[1],V=y.length-1,B=n.useState(!1),U=B[0],q=B[1],H=n.useRef(!1),G=n.useRef(!1);function Q(){H.current||(null==k?void 0:k.index)!==V||(C(),H.current=!0),(null==k?void 0:k.index)!==V&&W((function(e){if(!e)return b[0];var n=(null==e?void 0:e.index)+1;return b[n]}))}function J(){q(!0)}function X(){q(!1)}n.useEffect((function(){G.current||(G.current=!0,R())}),[R]),n.useEffect((function(){var e=b[S];e&&W(e)}),[S,y]),n.useEffect((function(){k&&w(k.index)}),[k]),i=function(){Q()},c=null!==(s=null==k?void 0:k.calculatedDuration)&&void 0!==s?s:null,a=U,l=n.useRef(),d=n.useRef(c),v=n.useRef(Date.now()),n.useEffect((function(){l.current=i}),[i]),n.useEffect((function(){d.current=c}),[c]),n.useEffect((function(){if(null!==c&&!1===a){v.current=Date.now();var e=setTimeout((function(){l.current()}),d.current);return function(){clearTimeout(e)}}return function(){}}),[c,a]),n.useEffect((function(){a&&(d.current=d.current-(Date.now()-v.current))}),[a]),function(e){var t=n.useRef(e);n.useEffect((function(){t.current=e}),[e]),n.useEffect((function(){function e(){t.current(!0)}function n(){t.current(!1)}return window.addEventListener("focus",e),window.addEventListener("blur",n),function(){window.removeEventListener("focus",e),window.removeEventListener("blur",n)}}),[])}((function(e){D&&q(!e)}));var Y={stories:b,width:x,height:_,defaultDuration:M,isPaused:U,classNames:I};return k?e.jsx(o.Provider,t({value:Y},{children:e.jsxs("div",t({className:"".concat(z," ").concat(I.main||""),style:{width:x,height:_}},{children:[e.jsx(m,{activeStoryIndex:k.index,isPaused:U},void 0),e.jsx(F,{onPause:J,onResume:X,story:k,isPaused:U},k.index),e.jsx(u,{onNextClick:Q,onPrevClick:function(){0!==(null==k?void 0:k.index)&&W((function(e){if(!e)return b[0];var n=(null==e?void 0:e.index)-1;return b[n]}))},onPause:J,onResume:X},void 0)]}),void 0)}),void 0):null};
+"use strict";var e=require("react/jsx-runtime"),n=require("react"),t=function(){return t=Object.assign||function(e){for(var n,t=1,r=arguments.length;t<r;t++)for(var o in n=arguments[t])Object.prototype.hasOwnProperty.call(n,o)&&(e[o]=n[o]);return e},t.apply(this,arguments)},r=n.createContext({stories:[],width:"100%",height:"100%",defaultDuration:1e4,isPaused:!1}),o=Object.freeze({LEFT:"left",RIGHT:"right"}),s="Actions-styles_left__eky50",u="Actions-styles_right__zguoH";function i(r){var i=r.onNextClick,c=r.onPrevClick,a=r.onPause,l=r.onResume,d=n.useState(!1),f=d[0],v=d[1],y=n.useRef(null);function m(e){e.stopPropagation(),e.preventDefault(),clearTimeout(y.current),y.current=setTimeout((function(){a(),v(!0)}),200)}function h(e,n){if(n.stopPropagation(),n.preventDefault(),clearTimeout(y.current),f)return l(),void v(!1);l(),e!=o.LEFT?i():c()}function x(e){return{onMouseUp:function(n){return h(e,n)},onTouchEnd:function(n){return h(e,n)},onTouchStart:function(e){return m(e)},onMouseDown:function(e){return m(e)}}}return e.jsxs(n.Fragment,{children:[e.jsx("div",t({className:s},x(o.LEFT))),e.jsx("div",t({className:u},x(o.RIGHT)))]})}function c(){return n.useContext(r)}var a="ProgressBar-styles_wrapper__oqUCo",l="ProgressBar-styles_bar__x0O50",d=0,f=.1;function v(r){var o,s,u,i,v,y=c(),m=y.defaultDuration,h=y.classNames,x=n.useRef(null),p=n.useRef(null),_=n.useState(!1),j=_[0],w=_[1];return n.useEffect((function(){!r.isPaused&&r.isActive&&r.isActive?w(!0):w(!1)}),[r.isActive,r.isPaused]),n.useEffect((function(){var e;x.current&&(r.hasStoryPassed?x.current.style.width="".concat(null===(e=null==p?void 0:p.current)||void 0===e?void 0:e.offsetWidth,"px"):x.current.style.width="0px")}),[r.hasStoryPassed,r.isActive]),o=function(e){var n;x.current&&p.current&&((d=Number((x.current.style.width||"1px").slice(0,x.current.style.width.length-2))||0)>p.current.offsetWidth?w(!1):(f=(null===(n=null==p?void 0:p.current)||void 0===n?void 0:n.offsetWidth)/((r.story.duration||m)/e),x.current.style.width="".concat(d+f,"px")))},s=j,u=n.useRef(),i=n.useRef(),v=n.useRef(o),n.useEffect((function(){v.current=o}),[o]),n.useEffect((function(){return!1!==s?(u.current=requestAnimationFrame((function e(n){if(null!=i.current){var t=n-i.current;v.current(t)}i.current=n,u.current=requestAnimationFrame(e)})),function(){cancelAnimationFrame(u.current),u.current=null,i.current=null}):function(){u.current&&(u.current=null),cancelAnimationFrame(u.current),i.current=null}}),[s]),e.jsx("div",t({className:"".concat(a," ").concat((null==h?void 0:h.progressBarContainer)||""),ref:p},{children:e.jsx("div",{className:"".concat(l," ").concat((null==h?void 0:h.progressBar)||""),ref:x})}))}var y="progress-styles_wrapper__qQPyW";function m(n){var r=c(),o=r.stories,s=r.classNames;return e.jsx("div",t({className:"".concat(y," ").concat((null==s?void 0:s.progressContainer)||""),style:{gridTemplateColumns:"repeat(".concat(o.length,",1fr)")}},{children:o.map((function(t){return e.jsx(v,{hasStoryPassed:t.index<n.activeStoryIndex,isActive:t.index===n.activeStoryIndex,story:t,isPaused:t.index===n.activeStoryIndex&&n.isPaused},t.index)}))}))}var h=Object.freeze({IMAGE:"image",VIDEO:"video",COMPONENT:"component"}),x="Story-styles_wrapper__oJP7j",p="Story-styles_header__-rnWL",_="Image-styles_image__gnfW1";function j(t){return n.useEffect((function(){t.onPause()}),[]),e.jsx("img",{className:_,src:t.story.url,alt:"story",onLoad:function(){setTimeout((function(){t.onResume()}),4)}})}var w,g="Video-styles_video__BykuO",S="Video-styles_loaderWrapper__TqVWk",E="Video-styles_loader__FxxSV",P="Video-styles_soundIcon__ZvYXE";function M(n){return"off"===n.type?e.jsx("svg",t({xmlns:"http://www.w3.org/2000/svg",width:"16",height:"16",viewBox:"0 0 24 24",fill:"white"},{children:e.jsx("path",{d:"M3 9v6h-1v-6h1zm13-7l-9 5v2.288l7-3.889v13.202l-7-3.889v2.288l9 5v-20zm-11 5h-5v10h5v-10zm17.324 4.993l1.646-1.659-1.324-1.324-1.651 1.67-1.665-1.648-1.316 1.318 1.67 1.657-1.65 1.669 1.318 1.317 1.658-1.672 1.666 1.653 1.324-1.325-1.676-1.656z"})})):e.jsx("svg",t({xmlns:"http://www.w3.org/2000/svg",width:"16",height:"16",viewBox:"0 0 24 24",fill:"white"},{children:e.jsx("path",{d:"M22 0v24l-11-6v-2.278l9 4.909v-17.262l-9 4.91v-2.279l11-6zm-13 6v12h-7v-12h7zm-2 2h-3v8h3v-8z"})}))}var C="RSIsMute",N="undefined"==typeof window?{}:window;function R(r){var o,s=c().isPaused,u=n.useState("true"===(null===(o=null==N?void 0:N.localStorage)||void 0===o?void 0:o.getItem(C))),i=u[0],a=u[1],l=n.useState(!1),d=l[0],f=l[1],v=n.useRef(null);function y(e){var n;null===(n=null==N?void 0:N.localStorage)||void 0===n||n.setItem(C,String(e)),a(e)}return n.useEffect((function(){r.onPause(),f(!0)}),[]),n.useEffect((function(){v.current&&(!s||v.current.paused?v.current.play().catch((function(){var e;y(!0),null===(e=v.current)||void 0===e||e.play()})):v.current.pause())}),[s]),e.jsxs(n.Fragment,{children:[e.jsxs("video",t({className:g,ref:v,playsInline:!0,"webkit-playsinline":"",controls:!1,src:r.story.url,onLoadedData:function(){setTimeout((function(){r.onResume(),f(!1)}),4)},muted:i},{children:[e.jsx("source",{src:r.story.url,type:"video/mp4"}),e.jsx("source",{src:r.story.url,type:"video/webm"}),e.jsx("source",{src:r.story.url,type:"video/ogg"}),e.jsx("p",{children:"Video not supported"})]})),e.jsx("div",t({className:P,onClick:function(){return y(!i)}},{children:e.jsx(M,{type:i?"off":"on"})})),d&&e.jsx("div",t({className:S},{children:e.jsx("div",{className:E})}))]})}null===(w=null==N?void 0:N.localStorage)||void 0===w||w.setItem(C,"true");var I="CustomComponents-styles_component__w87Wx";function T(n){return e.jsx("div",t({className:I},{children:e.jsx(n.story.component,{pause:n.onPause,resume:n.onResume,story:n.story,isPaused:n.isPaused})}))}var b="SeeMore-styles_seeMoreWrapper__kwjif",A="SeeMore-styles_defaultSeeMore__-B1QW";function k(n){return n.story.seeMore?e.jsx("button",t({type:"button",onClick:function(){n.onSeeMoreClick()},className:b},{children:function(){var r=n.story.seeMore,o=typeof r;if(["string","boolean"].includes(o)){var s="string"===o?r:"See More";return e.jsxs("div",t({className:A},{children:[e.jsx("span",{children:"^"}),e.jsx("p",{children:s})]}))}return"function"===o?e.jsx(n.story.seeMore,{}):n.story.seeMore}()})):null}var D="SeeMoreComponent-styles_seeMoreComponentWrapper__0T6Ap",W="SeeMoreComponent-styles_closeIcon__LMm3b";function O(n){return n.story.seeMore&&n.story.seeMoreComponent?e.jsxs("div",t({className:D},{children:[e.jsx("button",t({className:W,onClick:n.onClose},{children:"✕"})),"function"==typeof n.story.seeMoreComponent?e.jsx(n.story.seeMoreComponent,{}):n.story.seeMoreComponent]})):null}function F(r){var o=n.useState(!1),s=o[0],u=o[1],i=c().classNames;return n.useEffect((function(){u(!1)}),[r.story]),e.jsxs("div",t({className:"".concat(x," ").concat((null==i?void 0:i.storyContainer)||"")},{children:[r.story.type===h.IMAGE?e.jsx(j,t({},r)):r.story.type===h.VIDEO?e.jsx(R,t({},r)):r.story.type===h.COMPONENT?e.jsx(T,t({},r)):null,r.story.header&&e.jsx("div",t({className:p},{children:"function"==typeof r.story.header?e.jsx(r.story.header,{}):r.story.header})),e.jsx(k,{onSeeMoreClick:function(){var e,n;r.onPause(),u(!0),null===(n=(e=r.story).onSeeMoreClick)||void 0===n||n.call(e,r.story.index)},story:r.story}),s&&e.jsx(O,{story:r.story,onClose:function(){r.onResume(),u(!1)}})]}))}var L="styles_main__-0FEu";function z(e){return void 0===e&&(e=4),Number(Math.random().toFixed(e))}module.exports=function(o){var s,u,c,a,l,d,f,v=o.stories,y=void 0===v?[]:v,h=o.width,x=void 0===h?"100%":h,p=o.height,_=void 0===p?"100%":p,j=o.onStoryChange,w=void 0===j?function(){}:j,g=o.currentIndex,S=void 0===g?0:g,E=o.defaultDuration,P=void 0===E?1e4:E,M=o.onAllStoriesEnd,C=void 0===M?function(){}:M,N=o.onStoriesStart,R=void 0===N?function(){}:N,I=o.classNames,T=void 0===I?{}:I,b=o.pauseStoryWhenInActiveWindow,A=void 0===b||b,k=n.useMemo((function(){return function(e,n){var r=0;return e.map((function(e,o){var s=e.duration||n,u=s+z();return u===r&&(u=s+z(6)),r=u,t(t({},e),{index:o,calculatedDuration:u})}))}(y,P)}),[y,P]),D=n.useState(),W=D[0],O=D[1],V=y.length-1,B=n.useState(!1),q=B[0],G=B[1],H=n.useRef(!1),Q=n.useRef(!1);function U(){H.current||(null==W?void 0:W.index)!==V||(C(),H.current=!0),(null==W?void 0:W.index)!==V&&O((function(e){if(!e)return k[0];var n=(null==e?void 0:e.index)+1;return k[n]}))}function J(){G(!0)}function X(){G(!1)}n.useEffect((function(){Q.current||(Q.current=!0,R())}),[R]),n.useEffect((function(){var e=k[S];e&&O(e)}),[S,y]),n.useEffect((function(){W&&w(W.index)}),[W]),u=function(){U()},c=null!==(s=null==W?void 0:W.calculatedDuration)&&void 0!==s?s:null,a=q,l=n.useRef(),d=n.useRef(c),f=n.useRef(Date.now()),n.useEffect((function(){l.current=u}),[u]),n.useEffect((function(){d.current=c}),[c]),n.useEffect((function(){if(null!==c&&!1===a){f.current=Date.now();var e=setTimeout((function(){l.current()}),d.current);return function(){clearTimeout(e)}}return function(){}}),[c,a]),n.useEffect((function(){a&&(d.current=d.current-(Date.now()-f.current))}),[a]),function(e){var t=n.useRef(e);n.useEffect((function(){t.current=e}),[e]),n.useEffect((function(){function e(){t.current(!0)}function n(){t.current(!1)}return window.addEventListener("focus",e),window.addEventListener("blur",n),function(){window.removeEventListener("focus",e),window.removeEventListener("blur",n)}}),[])}((function(e){A&&G(!e)}));var Y={stories:k,width:x,height:_,defaultDuration:P,isPaused:q,classNames:T};return W?e.jsx(r.Provider,t({value:Y},{children:e.jsxs("div",t({className:"".concat(L," ").concat(T.main||""),style:{width:x,height:_}},{children:[e.jsx(m,{activeStoryIndex:W.index,isPaused:q}),e.jsx(F,{onPause:J,onResume:X,story:W,isPaused:q},W.index),e.jsx(i,{onNextClick:U,onPrevClick:function(){0!==(null==W?void 0:W.index)&&O((function(e){if(!e)return k[0];var n=(null==e?void 0:e.index)-1;return k[n]}))},onPause:J,onResume:X})]}))})):null};
 //# sourceMappingURL=index.js.map

package.json

 {
   "name": "stories-react",
-  "version": "1.0.18",
+  "version": "1.1.0",
   "description": "instagram style stories in react js",
@@ -33,20 +33,20 @@ "main": "dist/index.js",
   "devDependencies": {
-    "@babel/preset-typescript": "^7.16.7",
-    "@rollup/plugin-commonjs": "^21.0.1",
-    "@types/jest": "^27.4.0",
-    "@types/node": "^17.0.10",
-    "@types/react": "^17.0.38",
-    "@types/react-dom": "^17.0.11",
-    "cssnano": "^5.0.16",
-    "postcss-preset-env": "^7.2.3",
-    "rollup": "^2.64.0",
+    "@babel/preset-typescript": "^7.21.0",
+    "@rollup/plugin-commonjs": "^24.0.1",
+    "@rollup/plugin-node-resolve": "^15.0.1",
+    "@types/jest": "^29.4.0",
+    "@types/node": "^18.14.6",
+    "@types/react": "^18.0.28",
+    "@types/react-dom": "^18.0.11",
+    "cssnano": "^5.1.15",
+    "postcss-preset-env": "^8.0.1",
+    "rollup": "^3.18.0",
+    "rollup-plugin-css-only": "^4.3.0",
     "rollup-plugin-peer-deps-external": "^2.2.4",
+    "rollup-plugin-postcss": "^4.0.2",
     "rollup-plugin-terser": "^7.0.2",
-    "rollup-plugin-typescript2": "^0.31.1",
-    "@rollup/plugin-node-resolve": "^13.1.3",
-    "rollup-plugin-css-only": "^3.1.0",
-    "rollup-plugin-postcss": "^4.0.2",
-    "typescript": "^4.5.4"
+    "rollup-plugin-typescript2": "^0.34.1",
+    "typescript": "^4.9.5"
   },
   "dependencies": {}
 }

rollup.config.js

@@ -1,13 +0,12 @@
-import peerDepsExternal from 'rollup-plugin-peer-deps-external';
-import resolve from '@rollup/plugin-node-resolve';
-import commonjs from '@rollup/plugin-commonjs';
-import typescript from 'rollup-plugin-typescript2';
-import { terser } from 'rollup-plugin-terser';
-import postcss from 'rollup-plugin-postcss';
-import postcssPresetEnv from 'postcss-preset-env';
-import cssnano from 'cssnano';
-
+const peerDepsExternal = require('rollup-plugin-peer-deps-external');
+const resolve = require('@rollup/plugin-node-resolve');
+const commonjs = require('@rollup/plugin-commonjs');
+const typescript = require('rollup-plugin-typescript2');
+const { terser } = require('rollup-plugin-terser');
+const postcss = require('rollup-plugin-postcss');
+const postcssPresetEnv = require('postcss-preset-env');
+const cssnano = require('cssnano');
 const packageJson = require('./package.json');
 
-export default {
+module.exports = {
   input: 'src/index.tsx',
@@ -14,0 +13,0 @@ output: [

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Worsened metrics

Total package byte prevSize

72961

decreased by-86.58%

Number of package files

103

decreased by-10.43%

Lines of code

1205

decreased by-3.6%

No dependency changes