🚀 Big News: Socket Acquires Coana to Bring Reachability Analysis to Every Appsec Team.Learn more
Socket
DemoInstallSign in
Socket

react-dialogic

Package Overview
Dependencies
Maintainers
1
Versions
32
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

react-dialogic - npm Package Compare versions

Comparing version

to
2.0.0

dist/utils/imagePreloader.d.ts

2

dist/components/ReactDialogic.d.ts

@@ -31,4 +31,4 @@ import React from 'react';

* React Dialogic 統一入口組件
* 將 DialogProvider 和 DialogSystem 封裝在一起,提供更簡單的使用方式
* 將 DialogContextProvider 和 DialogSystem 封裝在一起,提供更簡單的使用方式
*/
export declare const ReactDialogic: React.FC<ReactDialogicProps>;
import React, { ReactNode } from 'react';
import { SequenceItem, DialogueConfig, CharacterConfig, Scene } from '../types';
interface DialogContextType {
currentScene: string | null;
currentIndex: number;
dialogue: DialogueConfig;
characters: Record<string, CharacterConfig>;
setCurrentScene: (sceneId: string) => void;
scene: Scene | null;
item: SequenceItem | null;
character: CharacterConfig | null;
background: string | null;
handleNext: () => void;
handleChoiceSelect: (next?: string) => void;
getCurrentItem: () => SequenceItem | null;
getCurrentScene: () => Scene | null;
onMessageStart?: (item: SequenceItem) => void;
onMessage?: (item: SequenceItem) => void;
onMessageEnd?: (item: SequenceItem) => void;
handleTypingComplete: () => void;

@@ -17,0 +11,0 @@ }

@@ -168,3 +168,3 @@ import React from 'react';

* React Dialogic 統一入口組件
* 將 DialogProvider 和 DialogSystem 封裝在一起,提供更簡單的使用方式
* 將 DialogContextProvider 和 DialogSystem 封裝在一起,提供更簡單的使用方式
*/

@@ -171,0 +171,0 @@ declare const ReactDialogic: React.FC<ReactDialogicProps>;

@@ -1,1 +0,1 @@

import{jsx as e,jsxs as n,Fragment as t}from"react/jsx-runtime";import{createContext as r,useState as o,useCallback as a,useContext as i,useMemo as c,useEffect as l}from"react";var u=function(){return u=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},u.apply(this,arguments)};"function"==typeof SuppressedError&&SuppressedError;var s=r({currentScene:null,currentIndex:0,dialogue:{},characters:{},setCurrentScene:function(){},handleNext:function(){},handleChoiceSelect:function(){},getCurrentItem:function(){return null},getCurrentScene:function(){return null},handleTypingComplete:function(){}}),d=function(n){var t=n.children,r=n.dialogue,i=n.characters,c=n.startScene,l=n.onMessageStart,d=n.onMessage,g=n.onMessageEnd,m=o(c||null),h=m[0],f=m[1],v=o(0),p=v[0],x=v[1],_=o(!1),C=_[0],y=_[1],S=a((function(){return h&&r[h]?r[h]:null}),[h,r]),N=a((function(){var e=S();return!e||!e.sequence||p>=e.sequence.length?null:e.sequence[p]}),[S,p]),M=a((function(e,n){f(e),x(n),y(!1);var t=r[e];t&&t.sequence&&t.sequence[n]&&l&&l(t.sequence[n])}),[r,l]),b=a((function(){y(!0);var e=N();e&&d&&d(e)}),[N,d]),k=a((function(){var e=S();if(e){var n=N();n&&(C?n.choices||(p<e.sequence.length-1?M(h,p+1):(g&&g(n),n.next&&M(n.next,0))):b())}}),[h,p,S,N,C,b,M,g]),T=a((function(e){e?M(e,0):M(h,p+1)}),[M,h,p]);return e(s.Provider,u({value:{currentScene:h,currentIndex:p,dialogue:r,characters:i,setCurrentScene:function(e){return M(e,0)},handleNext:k,handleChoiceSelect:T,getCurrentItem:N,getCurrentScene:S,onMessageStart:l,onMessage:d,onMessageEnd:g,handleTypingComplete:b}},{children:t}))},g=function(n){var t=n.children,r=n.characters,o=n.dialogue,a=n.startScene,i=n.onMessageStart,c=n.onMessage,l=n.onMessageEnd;return e(d,u({characters:r,dialogue:o,startScene:a,onMessageStart:i,onMessage:c,onMessageEnd:l},{children:t}))},m="Character-module_character__WMx3-",h="Character-module_characterEnter__x7Q7O",f="Character-module_characterExit__yGDp3",v=function(n){var t=n.config,r=n.emotion,o=void 0===r?"default":r,a=n.position,i=void 0===a?"center":a,l=n.active,s=void 0===l||l,d=c((function(){return t.images[o]||t.images.default}),[t.images,o]),g=c((function(){switch(i){case"left":return{left:"var(--dialogic-character-side-margin, 1rem)",right:"auto",transform:"translateX(0)"};case"right":return{left:"auto",right:"var(--dialogic-character-side-margin, 1rem)",transform:"translateX(0)"};default:return{left:"0",right:"0",margin:"auto"}}}),[i]),v=s?"opacity-100":"opacity-50",p=s?h:f;return e("div",u({className:"".concat(m," ").concat(v," ").concat(p," pointer-events-auto"),style:u({position:"absolute",height:"center"===i?"auto":"100%",display:"flex",alignItems:"flex-end"},g)},{children:e("img",{src:d,alt:t.name,className:"center"===i?"w-full h-auto object-contain":void 0})}))};var p="DialogBox-module_dialogBox__--CNd",x="DialogBox-module_characterName__6UKbn",_="DialogBox-module_dialogText__APDO3",C="DialogBox-module_continueIndicator__ZJppK",y=function(t){var r=t.name,i=t.text,c=t.textColor,s=t.isTyping,d=void 0===s||s,g=t.typingSpeed,m=t.onTypingComplete,h=t.onNext,f=function(e,n){void 0===n&&(n={});var t=n.speed,r=void 0===t?30:t,i=n.startTyping,c=void 0===i||i,u=n.onComplete,s=n.punctuationDelay,d=void 0===s?{",":150,".":300,"!":300,"?":300,";":200,":":200}:s,g=o(""),m=g[0],h=g[1],f=o(!1),v=f[0],p=f[1],x=o(0),_=x[0],C=x[1],y=a((function(){h(e),C(e.length),p(!0),null==u||u()}),[e,u]);l((function(){if(c&&!v){if(0===e.length)return p(!0),void(null==u||u());if(_>=e.length)return p(!0),void(null==u||u());var n=e[_],t=d[n]||r,o=setTimeout((function(){h(e.substring(0,_+1)),C((function(e){return e+1}))}),t);return function(){return clearTimeout(o)}}}),[e,_,r,c,v,u,d]);var S=a((function(){h(""),C(0),p(!1)}),[]);return l((function(){S()}),[e,S]),{displayText:m,isComplete:v,complete:y,reset:S}}(i,{speed:g||40,startTyping:d,onComplete:m}),v=f.displayText,y=f.isComplete,S=f.complete;l((function(){d||S()}),[d,S]);var N=function(){y?null==h||h():S()};return n("div",u({className:p,onClick:N,onKeyDown:function(e){"Enter"!==e.key&&" "!==e.key||N()},tabIndex:0,role:"button","aria-label":"繼續對話"},{children:[r&&e("div",u({className:x,style:c?{color:c}:void 0},{children:r})),e("div",u({className:_},{children:v})),y&&e("div",u({className:C},{children:"▼"}))]}))},S="ChoiceMenu-module_choices__uaEql",N="ChoiceMenu-module_choiceItem__4I3Fk",M=function(t){var r=t.choices,o=t.onSelect;return e("div",u({className:S},{children:r.map((function(t,r){return n("button",u({className:N,onClick:function(){return o(t.next)}},{children:[t.icon&&e("span",u({className:"mr-2"},{children:t.icon})),e("span",{children:t.text})]}),"choice-".concat(r))}))}))},b="DialogicContainer-module_container__excEe",k="DialogicContainer-module_charactersContainer__JyNka",T="DialogicContainer-module_dialogArea__0hEYq",D="DialogicContainer-module_background__KDi75",E=function(r){var a=r.src,i=r.color,c=void 0===i?"transparent":i,s=r.transitionDuration,d=void 0===s?500:s,g=o(a),m=g[0],h=g[1],f=o(void 0),v=f[0],p=f[1],x=o(!1),_=x[0],C=x[1];l((function(){if(a!==m){p(m),h(a),C(!0);var e=setTimeout((function(){C(!1),p(void 0)}),d);return function(){return clearTimeout(e)}}}),[a,m,d]);var y=function(e){return{position:"absolute",inset:0,backgroundImage:e?"url(".concat(e,")"):"none",backgroundColor:e?void 0:c,backgroundSize:"cover",backgroundPosition:"center",transition:"opacity ".concat(d,"ms ease-in-out"),zIndex:-1}};return n(t,{children:[e("div",{className:D,style:u(u({},y(m)),{opacity:1})}),_&&v&&e("div",{className:D,style:u(u({},y(v)),{opacity:0})})]})},I=function(){var t=i(s),r=t.getCurrentItem,o=t.getCurrentScene,a=t.handleNext,c=t.handleChoiceSelect,l=t.characters,d=t.handleTypingComplete,g=o(),m=r();if(!g||!m)return null;var h=m.background||g.background,f=m.speaker?l[m.speaker]:null;return n("div",u({className:"".concat(b," flex flex-col"),style:{userSelect:"none"}},{children:[e(E,{src:h}),e("div",u({className:k},{children:f&&e(v,{config:f,emotion:m.emotion,position:m.position||f.defaultPosition,active:!0})})),m.choices&&e(M,{choices:m.choices,onSelect:c}),e("div",u({className:T},{children:e("div",u({className:"w-full max-w-5xl mx-auto px-4 mb-4"},{children:e(y,{name:null==f?void 0:f.name,text:m.text,textColor:null==f?void 0:f.textColor,onNext:function(){a()},onTypingComplete:d})}))}))]}))},q=function(n){var t=n.characters,r=n.dialogue,o=n.startScene,a=n.onMessageStart,i=n.onMessage,c=n.onMessageEnd;return e(g,u({characters:t,dialogue:r,startScene:o,onMessageStart:a,onMessage:i,onMessageEnd:c},{children:e(I,{})}))};export{q as ReactDialogic};
import{jsx as e,jsxs as n,Fragment as t}from"react/jsx-runtime";import{createContext as o,useState as r,useMemo as a,useCallback as i,useEffect as c,useContext as l}from"react";var u=function(){return u=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},u.apply(this,arguments)};"function"==typeof SuppressedError&&SuppressedError;var s=new(function(){function e(){this.loadedImages=new Set,this.loadingPromises=new Map}return e.prototype.preloadImage=function(e){var n=this;if(this.loadedImages.has(e))return Promise.resolve();if(this.loadingPromises.has(e))return this.loadingPromises.get(e);var t=function(e){return new Promise((function(n,t){if(e){var o=new Image;o.onload=function(){return n()},o.onerror=function(){return t(new Error("Failed to load image: ".concat(e)))},o.src=e}else n()}))}(e).then((function(){n.loadedImages.add(e),n.loadingPromises.delete(e)}));return this.loadingPromises.set(e,t),t},e.prototype.preloadImages=function(e){var n=this,t=e.filter((function(e){return!!e}));return Promise.all(t.map((function(e){return n.preloadImage(e)})))},e.prototype.isImageLoaded=function(e){return this.loadedImages.has(e)},e.prototype.clearCache=function(){this.loadedImages.clear()},e}()),d=o({scene:null,item:null,character:null,background:null,handleNext:function(){},handleChoiceSelect:function(){},handleTypingComplete:function(){}}),m=function(n){var t=n.children,o=n.dialogue,l=n.characters,m=n.startScene,f=n.onMessageStart,g=n.onMessage,h=n.onMessageEnd,p=r(null),v=p[0],x=p[1],_=r(0),y=_[0],b=_[1],k=r(!1),C=k[0],N=k[1],I=a((function(){return v&&o[v]?o[v]:null}),[v,o]),S=a((function(){return!I||!I.sequence||y>=I.sequence.length?null:I.sequence[y]}),[I,y]),E=a((function(){return S&&S.speaker&&l[S.speaker]?l[S.speaker]:null}),[S,l]),T=a((function(){return I&&(S&&S.background||I.background)||null}),[I,S]),D=i((function(e,n){!function(e,n,t){var o=n[e];if(o){var r=[];o.background&&r.push(o.background),o.sequence.forEach((function(e){if(e.background&&r.push(e.background),e.speaker&&t[e.speaker]){var n=t[e.speaker],o=e.emotion||"default";n.images[o]&&r.push(n.images[o]),"default"!==o&&n.images.default&&r.push(n.images.default)}})),o.sequence.forEach((function(e){if(e.next&&n[e.next]){var t=n[e.next];t.background&&r.push(t.background)}e.choices&&e.choices.forEach((function(e){if(e.next&&n[e.next]){var t=n[e.next];t.background&&r.push(t.background)}}))})),s.preloadImages(r).catch((function(e){return console.error("Failed to preload images:",e)}))}}(e,o,l),x(e),b(n),N(!1);var t=o[e];t&&t.sequence&&t.sequence[n]&&f&&f(t.sequence[n])}),[o,l,f]),M=i((function(){N(!0),S&&g&&g(S)}),[S,g]),P=i((function(){I&&S&&(C?S.choices||(y<I.sequence.length-1?D(v,y+1):(h&&h(S),S.next?D(S.next,0):(x(null),b(0),N(!1)))):M())}),[v,y,I,S,C,M,D,h]),w=i((function(e){e?D(e,0):D(v,y+1)}),[D,v,y]);return c((function(){m&&D(m,0)}),[m,o,D]),e(d.Provider,u({value:{scene:I,item:S,character:E,background:T,handleNext:P,handleChoiceSelect:w,handleTypingComplete:M}},{children:t}))},f="Character-module_character__WMx3-",g="Character-module_characterEnter__x7Q7O",h="Character-module_characterExit__yGDp3",p=function(n){var t=n.config,o=n.emotion,r=void 0===o?"default":o,i=n.position,c=void 0===i?"center":i,l=n.active,s=void 0===l||l,d=a((function(){return t.images[r]||t.images.default}),[t.images,r]),m=a((function(){switch(c){case"left":return{left:"var(--dialogic-character-side-margin, 1rem)",right:"auto",transform:"translateX(0)"};case"right":return{left:"auto",right:"var(--dialogic-character-side-margin, 1rem)",transform:"translateX(0)"};default:return{left:"0",right:"0",margin:"auto"}}}),[c]),p=s?"opacity-100":"opacity-50",v=s?g:h;return e("div",u({className:"".concat(f," ").concat(p," ").concat(v," pointer-events-auto"),style:u({position:"absolute",height:"center"===c?"auto":"100%",display:"flex",alignItems:"flex-end"},m)},{children:e("img",{src:d,alt:t.name,className:"center"===c?"w-full h-auto object-contain":void 0})}))};var v="DialogBox-module_dialogBox__--CNd",x="DialogBox-module_characterName__6UKbn",_="DialogBox-module_dialogText__APDO3",y="DialogBox-module_continueIndicator__ZJppK",b=function(t){var o=t.name,a=t.text,l=t.textColor,s=t.isTyping,d=void 0===s||s,m=t.typingSpeed,f=t.onTypingComplete,g=t.onNext,h=function(e,n){void 0===n&&(n={});var t=n.speed,o=void 0===t?30:t,a=n.startTyping,l=void 0===a||a,u=n.onComplete,s=n.punctuationDelay,d=void 0===s?{",":150,".":300,"!":300,"?":300,";":200,":":200}:s,m=r(""),f=m[0],g=m[1],h=r(!1),p=h[0],v=h[1],x=r(0),_=x[0],y=x[1],b=i((function(){g(e),y(e.length),v(!0),null==u||u()}),[e,u]);c((function(){if(l&&!p){if(0===e.length)return v(!0),void(null==u||u());if(_>=e.length)return v(!0),void(null==u||u());var n=e[_],t=d[n]||o,r=setTimeout((function(){g(e.substring(0,_+1)),y((function(e){return e+1}))}),t);return function(){return clearTimeout(r)}}}),[e,_,o,l,p,u,d]);var k=i((function(){g(""),y(0),v(!1)}),[]);return c((function(){k()}),[e,k]),{displayText:f,isComplete:p,complete:b,reset:k}}(a,{speed:m||40,startTyping:d,onComplete:f}),p=h.displayText,b=h.isComplete,k=h.complete;c((function(){d||k()}),[d,k]);var C=function(){b?null==g||g():k()};return n("div",u({className:v,onClick:C,onKeyDown:function(e){"Enter"!==e.key&&" "!==e.key||C()},tabIndex:0,role:"button","aria-label":"繼續對話"},{children:[o&&e("div",u({className:x,style:l?{color:l}:void 0},{children:o})),e("div",u({className:_},{children:p})),b&&e("div",u({className:y},{children:"▼"}))]}))},k="ChoiceMenu-module_choices__uaEql",C="ChoiceMenu-module_choiceItem__4I3Fk",N=function(t){var o=t.choices,r=t.onSelect;return e("div",u({className:k},{children:o.map((function(t,o){return n("button",u({className:C,onClick:function(){return r(t.next)}},{children:[t.icon&&e("span",u({className:"mr-2"},{children:t.icon})),e("span",{children:t.text})]}),"choice-".concat(o))}))}))},I="DialogicContainer-module_container__excEe",S="DialogicContainer-module_charactersContainer__JyNka",E="DialogicContainer-module_dialogArea__0hEYq",T="DialogicContainer-module_background__KDi75",D=function(o){var a=o.src,i=o.color,l=void 0===i?"transparent":i,s=o.transitionDuration,d=void 0===s?500:s,m=r(a),f=m[0],g=m[1],h=r(void 0),p=h[0],v=h[1],x=r(!1),_=x[0],y=x[1];c((function(){if(a!==f){v(f),g(a),y(!0);var e=setTimeout((function(){y(!1),v(void 0)}),d);return function(){return clearTimeout(e)}}}),[a,f,d]);var b=function(e){return{position:"absolute",inset:0,backgroundImage:e?"url(".concat(e,")"):"none",backgroundColor:e?void 0:l,backgroundSize:"cover",backgroundPosition:"center",transition:"opacity ".concat(d,"ms ease-in-out"),zIndex:-1}};return n(t,{children:[e("div",{className:T,style:u(u({},b(f)),{opacity:1})}),_&&p&&e("div",{className:T,style:u(u({},b(p)),{opacity:0})})]})},M=function(){var t=l(d),o=t.scene,r=t.item,a=t.character,i=t.background,c=t.handleNext,s=t.handleChoiceSelect,m=t.handleTypingComplete;if(!o||!r)return null;return n("div",u({className:"".concat(I," flex flex-col"),style:{userSelect:"none"}},{children:[e(D,{src:i||void 0}),e("div",u({className:S},{children:a&&e(p,{config:a,emotion:r.emotion,position:r.position||a.defaultPosition,active:!0})})),r.choices&&e(N,{choices:r.choices,onSelect:s}),e("div",u({className:E},{children:e("div",u({className:"w-full max-w-5xl mx-auto px-4 mb-4"},{children:e(b,{name:null==a?void 0:a.name,text:r.text,textColor:null==a?void 0:a.textColor,onNext:function(){c()},onTypingComplete:m})}))}))]}))},P=function(n){var t=n.characters,o=n.dialogue,r=n.startScene,a=n.onMessageStart,i=n.onMessage,c=n.onMessageEnd;return e(m,u({characters:t,dialogue:o,startScene:r,onMessageStart:a,onMessage:i,onMessageEnd:c},{children:e(M,{})}))};export{P as ReactDialogic};

@@ -1,1 +0,1 @@

"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),n=require("react"),t=function(){return t=Object.assign||function(e){for(var n,t=1,a=arguments.length;t<a;t++)for(var r in n=arguments[t])Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r]);return e},t.apply(this,arguments)};"function"==typeof SuppressedError&&SuppressedError;var a=n.createContext({currentScene:null,currentIndex:0,dialogue:{},characters:{},setCurrentScene:function(){},handleNext:function(){},handleChoiceSelect:function(){},getCurrentItem:function(){return null},getCurrentScene:function(){return null},handleTypingComplete:function(){}}),r=function(r){var o=r.children,c=r.dialogue,i=r.characters,s=r.startScene,u=r.onMessageStart,l=r.onMessage,d=r.onMessageEnd,g=n.useState(s||null),f=g[0],m=g[1],h=n.useState(0),x=h[0],v=h[1],p=n.useState(!1),C=p[0],_=p[1],S=n.useCallback((function(){return f&&c[f]?c[f]:null}),[f,c]),y=n.useCallback((function(){var e=S();return!e||!e.sequence||x>=e.sequence.length?null:e.sequence[x]}),[S,x]),j=n.useCallback((function(e,n){m(e),v(n),_(!1);var t=c[e];t&&t.sequence&&t.sequence[n]&&u&&u(t.sequence[n])}),[c,u]),b=n.useCallback((function(){_(!0);var e=y();e&&l&&l(e)}),[y,l]),M=n.useCallback((function(){var e=S();if(e){var n=y();n&&(C?n.choices||(x<e.sequence.length-1?j(f,x+1):(d&&d(n),n.next&&j(n.next,0))):b())}}),[f,x,S,y,C,b,j,d]),k=n.useCallback((function(e){e?j(e,0):j(f,x+1)}),[j,f,x]);return e.jsx(a.Provider,t({value:{currentScene:f,currentIndex:x,dialogue:c,characters:i,setCurrentScene:function(e){return j(e,0)},handleNext:M,handleChoiceSelect:k,getCurrentItem:y,getCurrentScene:S,onMessageStart:u,onMessage:l,onMessageEnd:d,handleTypingComplete:b}},{children:o}))},o=function(n){var a=n.children,o=n.characters,c=n.dialogue,i=n.startScene,s=n.onMessageStart,u=n.onMessage,l=n.onMessageEnd;return e.jsx(r,t({characters:o,dialogue:c,startScene:i,onMessageStart:s,onMessage:u,onMessageEnd:l},{children:a}))},c="Character-module_character__WMx3-",i="Character-module_characterEnter__x7Q7O",s="Character-module_characterExit__yGDp3",u=function(a){var r=a.config,o=a.emotion,u=void 0===o?"default":o,l=a.position,d=void 0===l?"center":l,g=a.active,f=void 0===g||g,m=n.useMemo((function(){return r.images[u]||r.images.default}),[r.images,u]),h=n.useMemo((function(){switch(d){case"left":return{left:"var(--dialogic-character-side-margin, 1rem)",right:"auto",transform:"translateX(0)"};case"right":return{left:"auto",right:"var(--dialogic-character-side-margin, 1rem)",transform:"translateX(0)"};default:return{left:"0",right:"0",margin:"auto"}}}),[d]),x=f?"opacity-100":"opacity-50",v=f?i:s;return e.jsx("div",t({className:"".concat(c," ").concat(x," ").concat(v," pointer-events-auto"),style:t({position:"absolute",height:"center"===d?"auto":"100%",display:"flex",alignItems:"flex-end"},h)},{children:e.jsx("img",{src:m,alt:r.name,className:"center"===d?"w-full h-auto object-contain":void 0})}))};var l="DialogBox-module_dialogBox__--CNd",d="DialogBox-module_characterName__6UKbn",g="DialogBox-module_dialogText__APDO3",f="DialogBox-module_continueIndicator__ZJppK",m=function(a){var r=a.name,o=a.text,c=a.textColor,i=a.isTyping,s=void 0===i||i,u=a.typingSpeed,m=a.onTypingComplete,h=a.onNext,x=function(e,t){void 0===t&&(t={});var a=t.speed,r=void 0===a?30:a,o=t.startTyping,c=void 0===o||o,i=t.onComplete,s=t.punctuationDelay,u=void 0===s?{",":150,".":300,"!":300,"?":300,";":200,":":200}:s,l=n.useState(""),d=l[0],g=l[1],f=n.useState(!1),m=f[0],h=f[1],x=n.useState(0),v=x[0],p=x[1],C=n.useCallback((function(){g(e),p(e.length),h(!0),null==i||i()}),[e,i]);n.useEffect((function(){if(c&&!m){if(0===e.length)return h(!0),void(null==i||i());if(v>=e.length)return h(!0),void(null==i||i());var n=e[v],t=u[n]||r,a=setTimeout((function(){g(e.substring(0,v+1)),p((function(e){return e+1}))}),t);return function(){return clearTimeout(a)}}}),[e,v,r,c,m,i,u]);var _=n.useCallback((function(){g(""),p(0),h(!1)}),[]);return n.useEffect((function(){_()}),[e,_]),{displayText:d,isComplete:m,complete:C,reset:_}}(o,{speed:u||40,startTyping:s,onComplete:m}),v=x.displayText,p=x.isComplete,C=x.complete;n.useEffect((function(){s||C()}),[s,C]);var _=function(){p?null==h||h():C()};return e.jsxs("div",t({className:l,onClick:_,onKeyDown:function(e){"Enter"!==e.key&&" "!==e.key||_()},tabIndex:0,role:"button","aria-label":"繼續對話"},{children:[r&&e.jsx("div",t({className:d,style:c?{color:c}:void 0},{children:r})),e.jsx("div",t({className:g},{children:v})),p&&e.jsx("div",t({className:f},{children:"▼"}))]}))},h="ChoiceMenu-module_choices__uaEql",x="ChoiceMenu-module_choiceItem__4I3Fk",v=function(n){var a=n.choices,r=n.onSelect;return e.jsx("div",t({className:h},{children:a.map((function(n,a){return e.jsxs("button",t({className:x,onClick:function(){return r(n.next)}},{children:[n.icon&&e.jsx("span",t({className:"mr-2"},{children:n.icon})),e.jsx("span",{children:n.text})]}),"choice-".concat(a))}))}))},p="DialogicContainer-module_container__excEe",C="DialogicContainer-module_charactersContainer__JyNka",_="DialogicContainer-module_dialogArea__0hEYq",S="DialogicContainer-module_background__KDi75",y=function(a){var r=a.src,o=a.color,c=void 0===o?"transparent":o,i=a.transitionDuration,s=void 0===i?500:i,u=n.useState(r),l=u[0],d=u[1],g=n.useState(void 0),f=g[0],m=g[1],h=n.useState(!1),x=h[0],v=h[1];n.useEffect((function(){if(r!==l){m(l),d(r),v(!0);var e=setTimeout((function(){v(!1),m(void 0)}),s);return function(){return clearTimeout(e)}}}),[r,l,s]);var p=function(e){return{position:"absolute",inset:0,backgroundImage:e?"url(".concat(e,")"):"none",backgroundColor:e?void 0:c,backgroundSize:"cover",backgroundPosition:"center",transition:"opacity ".concat(s,"ms ease-in-out"),zIndex:-1}};return e.jsxs(e.Fragment,{children:[e.jsx("div",{className:S,style:t(t({},p(l)),{opacity:1})}),x&&f&&e.jsx("div",{className:S,style:t(t({},p(f)),{opacity:0})})]})},j=function(){var r=n.useContext(a),o=r.getCurrentItem,c=r.getCurrentScene,i=r.handleNext,s=r.handleChoiceSelect,l=r.characters,d=r.handleTypingComplete,g=c(),f=o();if(!g||!f)return null;var h=f.background||g.background,x=f.speaker?l[f.speaker]:null;return e.jsxs("div",t({className:"".concat(p," flex flex-col"),style:{userSelect:"none"}},{children:[e.jsx(y,{src:h}),e.jsx("div",t({className:C},{children:x&&e.jsx(u,{config:x,emotion:f.emotion,position:f.position||x.defaultPosition,active:!0})})),f.choices&&e.jsx(v,{choices:f.choices,onSelect:s}),e.jsx("div",t({className:_},{children:e.jsx("div",t({className:"w-full max-w-5xl mx-auto px-4 mb-4"},{children:e.jsx(m,{name:null==x?void 0:x.name,text:f.text,textColor:null==x?void 0:x.textColor,onNext:function(){i()},onTypingComplete:d})}))}))]}))};exports.ReactDialogic=function(n){var a=n.characters,r=n.dialogue,c=n.startScene,i=n.onMessageStart,s=n.onMessage,u=n.onMessageEnd;return e.jsx(o,t({characters:a,dialogue:r,startScene:c,onMessageStart:i,onMessage:s,onMessageEnd:u},{children:e.jsx(j,{})}))};
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});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 a in n=arguments[t])Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a]);return e},t.apply(this,arguments)};"function"==typeof SuppressedError&&SuppressedError;var o=new(function(){function e(){this.loadedImages=new Set,this.loadingPromises=new Map}return e.prototype.preloadImage=function(e){var n=this;if(this.loadedImages.has(e))return Promise.resolve();if(this.loadingPromises.has(e))return this.loadingPromises.get(e);var t=function(e){return new Promise((function(n,t){if(e){var o=new Image;o.onload=function(){return n()},o.onerror=function(){return t(new Error("Failed to load image: ".concat(e)))},o.src=e}else n()}))}(e).then((function(){n.loadedImages.add(e),n.loadingPromises.delete(e)}));return this.loadingPromises.set(e,t),t},e.prototype.preloadImages=function(e){var n=this,t=e.filter((function(e){return!!e}));return Promise.all(t.map((function(e){return n.preloadImage(e)})))},e.prototype.isImageLoaded=function(e){return this.loadedImages.has(e)},e.prototype.clearCache=function(){this.loadedImages.clear()},e}()),a=n.createContext({scene:null,item:null,character:null,background:null,handleNext:function(){},handleChoiceSelect:function(){},handleTypingComplete:function(){}}),r=function(r){var i=r.children,c=r.dialogue,s=r.characters,u=r.startScene,l=r.onMessageStart,d=r.onMessage,f=r.onMessageEnd,m=n.useState(null),g=m[0],h=m[1],p=n.useState(0),x=p[0],v=p[1],_=n.useState(!1),C=_[0],b=_[1],y=n.useMemo((function(){return g&&c[g]?c[g]:null}),[g,c]),k=n.useMemo((function(){return!y||!y.sequence||x>=y.sequence.length?null:y.sequence[x]}),[y,x]),j=n.useMemo((function(){return k&&k.speaker&&s[k.speaker]?s[k.speaker]:null}),[k,s]),S=n.useMemo((function(){return y&&(k&&k.background||y.background)||null}),[y,k]),N=n.useCallback((function(e,n){!function(e,n,t){var a=n[e];if(a){var r=[];a.background&&r.push(a.background),a.sequence.forEach((function(e){if(e.background&&r.push(e.background),e.speaker&&t[e.speaker]){var n=t[e.speaker],o=e.emotion||"default";n.images[o]&&r.push(n.images[o]),"default"!==o&&n.images.default&&r.push(n.images.default)}})),a.sequence.forEach((function(e){if(e.next&&n[e.next]){var t=n[e.next];t.background&&r.push(t.background)}e.choices&&e.choices.forEach((function(e){if(e.next&&n[e.next]){var t=n[e.next];t.background&&r.push(t.background)}}))})),o.preloadImages(r).catch((function(e){return console.error("Failed to preload images:",e)}))}}(e,c,s),h(e),v(n),b(!1);var t=c[e];t&&t.sequence&&t.sequence[n]&&l&&l(t.sequence[n])}),[c,s,l]),E=n.useCallback((function(){b(!0),k&&d&&d(k)}),[k,d]),M=n.useCallback((function(){y&&k&&(C?k.choices||(x<y.sequence.length-1?N(g,x+1):(f&&f(k),k.next?N(k.next,0):(h(null),v(0),b(!1)))):E())}),[g,x,y,k,C,E,N,f]),I=n.useCallback((function(e){e?N(e,0):N(g,x+1)}),[N,g,x]);return n.useEffect((function(){u&&N(u,0)}),[u,c,N]),e.jsx(a.Provider,t({value:{scene:y,item:k,character:j,background:S,handleNext:M,handleChoiceSelect:I,handleTypingComplete:E}},{children:i}))},i="Character-module_character__WMx3-",c="Character-module_characterEnter__x7Q7O",s="Character-module_characterExit__yGDp3",u=function(o){var a=o.config,r=o.emotion,u=void 0===r?"default":r,l=o.position,d=void 0===l?"center":l,f=o.active,m=void 0===f||f,g=n.useMemo((function(){return a.images[u]||a.images.default}),[a.images,u]),h=n.useMemo((function(){switch(d){case"left":return{left:"var(--dialogic-character-side-margin, 1rem)",right:"auto",transform:"translateX(0)"};case"right":return{left:"auto",right:"var(--dialogic-character-side-margin, 1rem)",transform:"translateX(0)"};default:return{left:"0",right:"0",margin:"auto"}}}),[d]),p=m?"opacity-100":"opacity-50",x=m?c:s;return e.jsx("div",t({className:"".concat(i," ").concat(p," ").concat(x," pointer-events-auto"),style:t({position:"absolute",height:"center"===d?"auto":"100%",display:"flex",alignItems:"flex-end"},h)},{children:e.jsx("img",{src:g,alt:a.name,className:"center"===d?"w-full h-auto object-contain":void 0})}))};var l="DialogBox-module_dialogBox__--CNd",d="DialogBox-module_characterName__6UKbn",f="DialogBox-module_dialogText__APDO3",m="DialogBox-module_continueIndicator__ZJppK",g=function(o){var a=o.name,r=o.text,i=o.textColor,c=o.isTyping,s=void 0===c||c,u=o.typingSpeed,g=o.onTypingComplete,h=o.onNext,p=function(e,t){void 0===t&&(t={});var o=t.speed,a=void 0===o?30:o,r=t.startTyping,i=void 0===r||r,c=t.onComplete,s=t.punctuationDelay,u=void 0===s?{",":150,".":300,"!":300,"?":300,";":200,":":200}:s,l=n.useState(""),d=l[0],f=l[1],m=n.useState(!1),g=m[0],h=m[1],p=n.useState(0),x=p[0],v=p[1],_=n.useCallback((function(){f(e),v(e.length),h(!0),null==c||c()}),[e,c]);n.useEffect((function(){if(i&&!g){if(0===e.length)return h(!0),void(null==c||c());if(x>=e.length)return h(!0),void(null==c||c());var n=e[x],t=u[n]||a,o=setTimeout((function(){f(e.substring(0,x+1)),v((function(e){return e+1}))}),t);return function(){return clearTimeout(o)}}}),[e,x,a,i,g,c,u]);var C=n.useCallback((function(){f(""),v(0),h(!1)}),[]);return n.useEffect((function(){C()}),[e,C]),{displayText:d,isComplete:g,complete:_,reset:C}}(r,{speed:u||40,startTyping:s,onComplete:g}),x=p.displayText,v=p.isComplete,_=p.complete;n.useEffect((function(){s||_()}),[s,_]);var C=function(){v?null==h||h():_()};return e.jsxs("div",t({className:l,onClick:C,onKeyDown:function(e){"Enter"!==e.key&&" "!==e.key||C()},tabIndex:0,role:"button","aria-label":"繼續對話"},{children:[a&&e.jsx("div",t({className:d,style:i?{color:i}:void 0},{children:a})),e.jsx("div",t({className:f},{children:x})),v&&e.jsx("div",t({className:m},{children:"▼"}))]}))},h="ChoiceMenu-module_choices__uaEql",p="ChoiceMenu-module_choiceItem__4I3Fk",x=function(n){var o=n.choices,a=n.onSelect;return e.jsx("div",t({className:h},{children:o.map((function(n,o){return e.jsxs("button",t({className:p,onClick:function(){return a(n.next)}},{children:[n.icon&&e.jsx("span",t({className:"mr-2"},{children:n.icon})),e.jsx("span",{children:n.text})]}),"choice-".concat(o))}))}))},v="DialogicContainer-module_container__excEe",_="DialogicContainer-module_charactersContainer__JyNka",C="DialogicContainer-module_dialogArea__0hEYq",b="DialogicContainer-module_background__KDi75",y=function(o){var a=o.src,r=o.color,i=void 0===r?"transparent":r,c=o.transitionDuration,s=void 0===c?500:c,u=n.useState(a),l=u[0],d=u[1],f=n.useState(void 0),m=f[0],g=f[1],h=n.useState(!1),p=h[0],x=h[1];n.useEffect((function(){if(a!==l){g(l),d(a),x(!0);var e=setTimeout((function(){x(!1),g(void 0)}),s);return function(){return clearTimeout(e)}}}),[a,l,s]);var v=function(e){return{position:"absolute",inset:0,backgroundImage:e?"url(".concat(e,")"):"none",backgroundColor:e?void 0:i,backgroundSize:"cover",backgroundPosition:"center",transition:"opacity ".concat(s,"ms ease-in-out"),zIndex:-1}};return e.jsxs(e.Fragment,{children:[e.jsx("div",{className:b,style:t(t({},v(l)),{opacity:1})}),p&&m&&e.jsx("div",{className:b,style:t(t({},v(m)),{opacity:0})})]})},k=function(){var o=n.useContext(a),r=o.scene,i=o.item,c=o.character,s=o.background,l=o.handleNext,d=o.handleChoiceSelect,f=o.handleTypingComplete;if(!r||!i)return null;return e.jsxs("div",t({className:"".concat(v," flex flex-col"),style:{userSelect:"none"}},{children:[e.jsx(y,{src:s||void 0}),e.jsx("div",t({className:_},{children:c&&e.jsx(u,{config:c,emotion:i.emotion,position:i.position||c.defaultPosition,active:!0})})),i.choices&&e.jsx(x,{choices:i.choices,onSelect:d}),e.jsx("div",t({className:C},{children:e.jsx("div",t({className:"w-full max-w-5xl mx-auto px-4 mb-4"},{children:e.jsx(g,{name:null==c?void 0:c.name,text:i.text,textColor:null==c?void 0:c.textColor,onNext:function(){l()},onTypingComplete:f})}))}))]}))};exports.ReactDialogic=function(n){var o=n.characters,a=n.dialogue,i=n.startScene,c=n.onMessageStart,s=n.onMessage,u=n.onMessageEnd;return e.jsx(r,t({characters:o,dialogue:a,startScene:i,onMessageStart:c,onMessage:s,onMessageEnd:u},{children:e.jsx(k,{})}))};
{
"name": "react-dialogic",
"version": "1.6.0",
"version": "2.0.0",
"description": "A React UI library for creating dialogue systems with a game-like interface | 一個專為 React 應用開發的對話系統 UI 套件,提供類遊戲風格的對話介面",

@@ -5,0 +5,0 @@ "main": "dist/index.js",

Sorry, the diff of this file is not supported yet