rox-react-components 0.0.14 → 0.0.16

package/README.md

@@ -6,6 +6,6 @@
 
 # Components
 
-## Swiper、Loading、 Card、Container、Menu
+## Swiper、Loading、 Card、Container、Menu、ScrollView
 
 ## Swiper (suppoert <strong>PC</strong> & <strong>Mobile</strong> Platform)

package/dist/es/Menu/Menu.d.ts

@@ -15,14 +15,14 @@ interface MenuProps<T> extends IconProps {
     data: T[];
     renderItem: (item: T) => ReactNode;
     onChange?: (item: T, index: string) => void;
-    subItemStyle?: CSSProperties;
+    labelStyle?: CSSProperties;
+    subBoxStyle?: CSSProperties;
     activeStyle?: CSSProperties;
     active?: string;
     isMultipleExpand?: boolean;
     icon?: ReactNode;
     activeIcon?: ReactNode;
+    childrenField?: string;
 }
-declare const Menu: <T extends {
-    children?: unknown[] | undefined;
-}>(_props: MenuProps<T>) => React.JSX.Element;
+declare const Menu: <T extends unknown>(_props: MenuProps<T>) => React.JSX.Element;
 export default Menu;

package/dist/es/Menu/Menu.js

@@ -1 +1 @@
-import{__assign as e}from"tslib";import{css as t}from"aphrodite/no-important";import r,{createContext as n,useState as i,useEffect as a,useContext as c,useCallback as o}from"react";import l from"../Card/Card.js";import d from"./styles.js";var u={data:[],renderItem:function(){return null},onChange:function(){return null},subItemStyle:{paddingLeft:"25px"},activeStyle:{color:"skyblue"},active:"",isMultipleExpand:!1,iconSize:"10px",iconStrokeWidth:"2px",iconColor:"#333"};function s(n){var i=e(e({},u),n),a=i.iconSize,c=i.iconStrokeWidth,o=i.iconColor,l=i.down;return r.createElement("div",{style:{"--size":a,"--strokeWidth":c,"--color":o},className:"".concat(t(d.arrow_right)," ").concat(l?t(d.arrow_down):"")})}var m=n({active:"0",changeActive:function(){return null}}),v=function(n){var h=e(e({},u),n),f=h.renderItem,p=h.item,y=h.subItemStyle,g=h.activeStyle,E=h.index,x=h.isMultipleExpand,A=h.icon,b=h.activeIcon,S=i(!1),C=S[0],k=S[1],w=c(m),I=w.active,W=w.changeActive,_=o((function(e){e.stopPropagation(),W(E),h.onChange(p,E),p.children&&Array.isArray(p.children)&&k((function(e){return!e}))}),[W,E,p]);return a((function(){if(void 0!==I){var e=I.split("-"),t=E.split("-");I.startsWith(E)&&e.length>t.length&&E.length<I.length?k(!0):I.startsWith(E)&&E.startsWith(I)||x||k(!1)}}),[I,E]),r.createElement("div",{className:t(d.w_full,d.border_box),onClick:_},r.createElement("div",{className:t(d.item),style:I===E?g:{}},f(p)," ",Array.isArray(p.children)&&p.children.length?C?b||r.createElement(s,e({},h,{down:!0})):A||r.createElement(s,e({},h)):null),Array.isArray(p.children)?p.children.map((function(n,i){return r.createElement("div",{key:i,className:t(d.w_full,d.border_box),style:e(e({},u.subItemStyle),y)},r.createElement(l,{expand:C},r.createElement(v,e({},h,{index:E+"-"+i,item:n}))))})):null)},h=function(t){var n=e(e({},u),t),c=i(n.active),o=c[0],l=c[1];return a((function(){if(n.data.length&&void 0!==n.active){var e=n.active.split("-").map((function(e){return Number(e)})),t=n.data,r={};e.forEach((function(e){Array.isArray(t)&&(r=t[e]||{},t=r.children)})),n.onChange(r,n.active)}l(n.active)}),[n.active,n.data]),r.createElement(m.Provider,{value:{active:o,changeActive:l}},n.data.map((function(t,i){return r.createElement(v,e({key:i,index:i.toString()},n,{item:t}))})))};export{h as default};
+import{__assign as e}from"tslib";import{css as t}from"aphrodite/no-important";import r,{createContext as n,useState as i,useEffect as a,useContext as l,useCallback as o}from"react";import c from"../Card/Card.js";import d from"./styles.js";var s={data:[],renderItem:function(){return null},onChange:function(){return null},labelStyle:{width:"100%"},subBoxStyle:{paddingLeft:"25px"},activeStyle:{color:"skyblue"},active:"",isMultipleExpand:!1,iconSize:"10px",iconStrokeWidth:"2px",iconColor:"#333",childrenField:"children"};function u(n){var i=e(e({},s),n),a=i.iconSize,l=i.iconStrokeWidth,o=i.iconColor,c=i.down;return r.createElement("div",{style:{"--size":a,"--strokeWidth":l,"--color":o},className:"".concat(t(d.arrow_right)," ").concat(c?t(d.arrow_down):"")})}var m=n({active:"0",changeActive:function(){return null}}),v=function(n){var f=e(e({},s),n),h=f.renderItem,p=f.item,y=f.subBoxStyle,g=f.activeStyle,x=f.index,b=f.isMultipleExpand,E=f.icon,S=f.activeIcon,A=f.labelStyle,w=f.childrenField,C=i(!1),k=C[0],_=C[1],N=l(m),W=N.active,F=N.changeActive,z=o((function(e){e.stopPropagation(),F(x),f.onChange(p,x),p[w]&&Array.isArray(p[w])&&_((function(e){return!e}))}),[F,x,p,w]);return a((function(){if(void 0!==W){var e=W.split("-"),t=x.split("-");W.startsWith(x)&&e.length>t.length&&x.length<W.length?_(!0):W.startsWith(x)&&x.startsWith(W)||b||_(!1)}}),[W,x]),r.createElement("div",{className:t(d.w_full,d.border_box),onClick:z},r.createElement("div",{className:t(d.item),style:W===x?e(e(e({},s.labelStyle),A),g):e(e({},s.labelStyle),A)},r.createElement("div",{className:t(d.flex_1)},h(p))," ",Array.isArray(p[w])&&p[w].length?k?S||r.createElement(u,e({},f,{down:!0})):E||r.createElement(u,e({},f)):null),Array.isArray(p[w])?p[w].map((function(n,i){return r.createElement("div",{key:i,className:t(d.w_full,d.border_box),style:e(e({},s.subBoxStyle),y)},r.createElement(c,{expand:k},r.createElement(v,e({},f,{index:x+"-"+i,item:n}))))})):null)},f=function(t){var n=e(e({},s),t),l=i(n.active),o=l[0],c=l[1];return a((function(){if(n.data.length&&void 0!==n.active){var e=n.active.split("-").map((function(e){return Number(e)})),t=n.data,r={};e.forEach((function(e){if(Array.isArray(t)){r=t[e]||{};var i=n.childrenField;t=r[i]}})),n.onChange(r,n.active)}c(n.active)}),[n.active,n.data,n.childrenField]),r.createElement(m.Provider,{value:{active:o,changeActive:c}},n.data.map((function(t,i){return r.createElement(v,e({key:i,index:i.toString()},n,{item:t}))})))};export{f as default};

package/dist/es/Menu/styles.d.ts

@@ -2,6 +2,7 @@ declare const styles: {
     w_full: object;
     item: object;
     border_box: object;
+    flex_1: object;
     arrow_right: object;
     arrow_down: object;
 };

package/dist/es/Menu/styles.js

@@ -1 +1 @@
-import{StyleSheet as r}from"aphrodite/no-important";var o=r.create({w_full:{width:"100%"},item:{display:"flex",width:"100%",paddingRight:"10px",alignItems:"center",justifyContent:"space-between",boxSizing:"border-box"},border_box:{boxSizing:"border-box"},arrow_right:{position:"relative",width:"var(--size)",height:"var(--size)",borderTop:"var(--strokeWidth) solid var(--color)",borderRight:"var(--strokeWidth) solid var(--color)",transform:"rotate(45deg)",transformOrigin:"center",transition:"all 100ms linear"},arrow_down:{transform:"rotate(135deg)"}});export{o as default};
+import{StyleSheet as r}from"aphrodite/no-important";var o=r.create({w_full:{width:"100%"},item:{display:"flex",width:"100%",paddingRight:"10px",alignItems:"center",justifyContent:"space-between",boxSizing:"border-box"},border_box:{boxSizing:"border-box"},flex_1:{flex:1},arrow_right:{position:"relative",width:"var(--size)",height:"var(--size)",borderTop:"var(--strokeWidth) solid var(--color)",borderRight:"var(--strokeWidth) solid var(--color)",transform:"rotate(45deg)",transformOrigin:"center",transition:"all 100ms linear"},arrow_down:{transform:"rotate(135deg)"}});export{o as default};

package/dist/es/ScrollView/ScrollView.d.ts

@@ -0,0 +1,18 @@
+import React, { CSSProperties, PropsWithChildren } from 'react';
+interface OnScrollParameters {
+    x?: number;
+    y?: number;
+}
+interface ScrollViewProps extends PropsWithChildren {
+    style?: CSSProperties;
+    horizontal?: boolean;
+    vertical?: boolean;
+    onScroll?: (position: OnScrollParameters) => void;
+    threshold?: number;
+    onReachTop?: (done: Function) => void;
+    onReachBottom?: (done: Function) => void;
+    onReachLeft?: (done: Function) => void;
+    onReachRight?: (done: Function) => void;
+}
+declare function ScrollView(props?: ScrollViewProps): React.JSX.Element;
+export default ScrollView;

package/dist/es/ScrollView/ScrollView.js

@@ -0,0 +1 @@
+import{__assign as r}from"tslib";import{css as t}from"aphrodite/no-important";import e,{useRef as n,useMemo as o,useCallback as c}from"react";import l from"../utils.js";import u from"./styles.js";var i={style:{width:"100%",height:"100%"},horizontal:!1,vertical:!0,onScroll:function(){return null},threshold:50,onReachTop:function(r){return r()},onReachBottom:function(r){return r()},onReachLeft:function(r){return r()},onReachRight:function(r){return r()}};function f(f){void 0===f&&(f=i);var a=r(r({},i),f),h=a.style,s=a.children,d=a.horizontal,m=a.vertical,p=a.onScroll,v=a.threshold,R=a.onReachTop,b=a.onReachBottom,_=a.onReachLeft,g=a.onReachRight,y=n(0),T=n(0),w=n(!1),x=n(!1),L=n(!1),S=n(!1),E=o((function(){return r(r({},i.style),h)}),[h]),N=o((function(){return{overflowX:d?"scroll":"hidden",overflowY:m?"scroll":"hidden",scrollbarWidth:"none",msOverflowStyle:"none"}}),[d,m]),W=c((function(r){var t=r.currentTarget,e=t.scrollTop,n=t.scrollHeight,o=t.clientHeight;e>y.current?e+o>=n-v&&!x.current&&(x.current=!0,b((function(){return l.sleep(60).then((function(){return x.current=!1}))}))):e<y.current&&e<=0&&!w.current&&(w.current=!0,R((function(){return l.sleep(60).then((function(){return w.current=!1}))}))),y.current=e}),[v,b,R]),j=c((function(r){var t=r.currentTarget,e=t.scrollLeft,n=t.scrollWidth,o=t.clientWidth;e>T.current?e+o>=n-v&&!S.current&&(S.current=!0,g((function(){return l.sleep(60).then((function(){return S.current=!1}))}))):e<T.current&&e<=0&&!L.current&&(L.current=!0,_((function(){return l.sleep(60).then((function(){return L.current=!1}))}))),T.current=e}),[v,_,g]),z=c((function(r){j(r),W(r)}),[j,W]),B=c((function(r){var t=r.currentTarget,e=t.scrollTop,n=t.scrollLeft;p({x:n,y:e}),d&&m?z(r):d?j(r):m&&W(r)}),[d,m,p,j,W,z]);return e.createElement("div",{style:E,className:t(u.border_box)},e.createElement("div",{className:t(u.w_full,u.h_full,u.border_box)},e.createElement("div",{onScroll:B,style:N,className:t(u.border_box,u.w_full,u.h_full,u.scroll_bar_hide)},s)))}export{f as default};

package/dist/es/ScrollView/index.d.ts

@@ -0,0 +1,2 @@
+import ScrollView from './ScrollView';
+export default ScrollView;

package/dist/es/ScrollView/index.js

@@ -0,0 +1 @@
+import o from"./ScrollView.js";export{o as default};

package/dist/es/ScrollView/styles.d.ts

@@ -0,0 +1,7 @@
+declare const styles: {
+    border_box: object;
+    w_full: object;
+    h_full: object;
+    scroll_bar_hide: object;
+};
+export default styles;

package/dist/es/ScrollView/styles.js

@@ -0,0 +1 @@
+import{StyleSheet as o}from"aphrodite/no-important";var r=o.create({border_box:{boxSizing:"border-box"},w_full:{width:"100%"},h_full:{height:"100%"},scroll_bar_hide:{"scrollbar-width":"none","-ms-overflow-style":"none","::-webkit-scrollbar":{display:"none"}}});export{r as default};

package/dist/es/Swiper/Swiper.js

@@ -1 +1 @@
-import{__assign as e,__awaiter as t,__generator as n}from"tslib";import{css as r}from"aphrodite/no-important";import u,{forwardRef as o,useMemo as i,useRef as a,useState as c,useCallback as l,useEffect as s,useImperativeHandle as d}from"react";import f from"../utils.js";import v from"./styles.js";var m={width:"10px",height:"10px",borderRadius:"50%",backgroundColor:"rgba(0,0,0,.3)",transition:"all 200ms linear"},h=e(e({},m),{backgroundColor:"rgba(255,255,255,.7)"}),p={data:[],renderItem:function(){return null},onChange:function(){return null},boundary:1/3,duration:500,delay:2e3,autoPlay:!0,active:0,dotVisible:!0,dotBoxStyle:{},dotStyle:m,activeDotStyle:h};var b=o((function(o,b){var y=e(e({},p),o),g=y.boundary,w=y.data,E=y.renderItem,x=y.children,_=y.dotVisible,L=y.renderDots,T=y.dotBoxStyle,k=y.activeDotStyle,N=y.dotStyle,S=w.length>=2,z=function(){var e=a(null),t=c(0),n=t[0],r=t[1],u=l((function(){var t,n;return r(Math.max((null===(t=e.current)||void 0===t?void 0:t.clientWidth)||0,(null===(n=e.current)||void 0===n?void 0:n.offsetWidth)||0))}),[]);return s((function(){return u(),window.addEventListener("resize",u),function(){return window.removeEventListener("resize",u)}}),[u]),[e,n]}(),C=z[0],W=z[1],X=function(e){var r=this,u=e.active,o=e.data,v=e.width,m=e.duration,h=e.boundary,p=e.delay,b=e.ref,y=e.onChange,g=o.length>=2,w=a(),E=a(!0),x=a(u),_=a(!1),L=a(!1),T=c(!1),k=T[0],N=T[1],S=c(u),z=S[0],C=S[1],W=a(null),X=i((function(){return v*h}),[v,h]),V=l((function(e){if(!W.current)return 0;var t=getComputedStyle(W.current);try{var n=new WebKitCSSMatrix(t.transform);return{x:n.m41,y:n.m42,z:n.m43}[e]}catch(n){var r=t.transform.split(/\(|\)/),u=r[0],o=r[1];if(u.includes("3d")){var i=o.split(",").slice(-4),a=i[0],c=i[1],l=i[2];return Number({x:a,y:c,z:l}[e])}var s=o.split(",").slice(-2);return a=s[0],c=s[1],Number({x:a,y:c,z:0}[e])}}),[]),j=l((function(e){void 0===e&&(e=!1),W.current&&(W.current.style.transition=e?"none":"all ".concat(m,"ms linear"),W.current.style.webkitTransition=e?"none":"all ".concat(m,"ms linear"))}),[m]),B=l((function(e){if(W.current){var t=e;null==t&&(t=g?-v*x.current+"px":"0px"),W.current.style.transform="translate3d(".concat(t,", 0, 0)"),W.current.style.webkitTransform="translate3d(".concat(t,", 0, 0)")}}),[g,v]),D=l((function(){return t(r,void 0,void 0,(function(){var e;return n(this,(function(t){switch(t.label){case 0:return _.current||!g?[2]:(_.current=!0,N(!0),x.current>=o.length+1?(_.current=!1,j(!0),x.current=1,B(),[4,f.sleep(5)]):[3,2]);case 1:return t.sent(),D(),[2];case 2:return j(),x.current++,(e=x.current-1)>=o.length&&(e=0),C(e),B(),[4,f.sleep(m)];case 3:return t.sent(),_.current=!1,N(!1),[2]}}))}))}),[g,o.length,j,B]),P=l((function(){return t(r,void 0,void 0,(function(){var e;return n(this,(function(t){switch(t.label){case 0:return _.current||!g?[2]:(_.current=!0,N(!0),x.current<=0?(_.current=!1,j(!0),x.current=o.length,B(),[4,f.sleep(5)]):[3,2]);case 1:return t.sent(),P(),[2];case 2:return j(),x.current--,(e=x.current-1)<0&&(e=o.length-1),C(e),B(),[4,f.sleep(m)];case 3:return t.sent(),_.current=!1,N(!1),[2]}}))}))}),[g,o.length,j,B]),M=l((function(e){return t(r,void 0,void 0,(function(){return n(this,(function(t){switch(t.label){case 0:return _.current||!g?[2]:(_.current=!0,N(!0),x.current<=0?(j(!0),x.current=o.length,B(),[4,f.sleep(5)]):[3,2]);case 1:t.sent(),t.label=2;case 2:return x.current>=o.length+1?(j(!0),x.current=1,B(),[4,f.sleep(5)]):[3,4];case 3:t.sent(),t.label=4;case 4:return j(),x.current=e+1,B(),C(e),[4,f.sleep(m)];case 5:return t.sent(),_.current=!1,N(!1),[2]}}))}))}),[g,j,o.length,B,m]);return d(b,(function(){return{next:function(){return D()},pre:function(){return P()}}}),[D,P]),s((function(){E.current=!0}),[v,o.length]),s((function(){E.current?(N(!0),x.current=g?u+1:u,j(!0),B(),C(u),E.current=!1,f.sleep(5).then((function(){N(!1)}))):(E.current=!1,M(u))}),[u,g,o,j,B,M]),s((function(){y(z)}),[z]),s((function(){g&&e.autoPlay&&!k?w.current=setTimeout((function(){return D()}),p):clearTimeout(w.current)}),[g,e.autoPlay,k,p,D]),s((function(){var e=W.current,r=0,u=0;function i(e){_.current||(L.current=!0,N(!0),j(!0),x.current<=0&&(x.current=o.length,B()),x.current>=o.length+1&&(x.current=1,B()),r=e,u=V("x"))}function a(e){L.current&&B(u+(e-r)+"px")}function c(e){return t(this,void 0,void 0,(function(){var t,u;return n(this,(function(n){switch(n.label){case 0:return L.current?(j(),(t=e-r)>=X&&x.current--,t<=-X&&x.current++,(u=x.current-1)>=o.length&&(u=0),C(u),L.current=!1,_.current=!0,B(),[4,f.sleep(m)]):[2];case 1:return n.sent(),N(!1),_.current=!1,[2]}}))}))}function l(e){e.preventDefault(),e.stopPropagation()}function s(e){l(e),i(e.targetTouches[0].pageX)}function d(e){l(e),i(e.pageX)}function v(e){l(e),a(e.targetTouches[0].pageX)}function h(e){l(e),a(e.pageX)}function p(e){l(e),c(e.changedTouches[0].pageX)}function b(e){l(e),c(e.pageX)}function y(e){l(e),c(e.changedTouches[0].pageX)}return e&&g&&(e.addEventListener("touchstart",s,{passive:!1}),e.addEventListener("touchmove",v,{passive:!1}),e.addEventListener("touchend",p,{passive:!1}),e.addEventListener("touchcancel",y,{passive:!1}),e.addEventListener("mousedown",d,{passive:!1}),e.addEventListener("mousemove",h,{passive:!1}),e.addEventListener("mouseup",b,{passive:!1}),e.addEventListener("mouseout",b,{passive:!1})),function(){null==e||e.removeEventListener("touchstart",s),null==e||e.removeEventListener("touchmove",v),null==e||e.removeEventListener("touchend",p),null==e||e.removeEventListener("touchcancel",y),null==e||e.removeEventListener("mousedown",d),null==e||e.removeEventListener("mousemove",h),null==e||e.removeEventListener("mouseup",b),null==e||e.removeEventListener("mouseout",b)}}),[g,j,V,B,X,m,o.length]),s((function(){var e;function t(){clearTimeout(e),N(!0),j(!0),B(),e=setTimeout((function(){N(!1)}),60)}return window.addEventListener("resize",t),function(){return window.removeEventListener("resize",t)}}),[j,B]),s((function(){var e=w.current;return function(){return clearTimeout(e)}}),[]),[W,z,M]}(e(e(e({},p),o),{width:W,ref:b})),V=X[0],j=X[1],B=X[2],D=i((function(){return W&&S?W*(w.length+2)+"px":"100%"}),[W,S,w.length]);if("number"!=typeof g||g<=0||g>=1)throw new Error("property boundary must be number, and between 0 and 1, exclude 0 and 1");return u.createElement("div",{className:r(v.relative,v.w_full,v.border_box,v.overflow_hidden)},u.createElement("div",{ref:C,className:r(v.relative,v.w_full,v.border_box,v.overflow_hidden)},u.createElement("div",{ref:V,style:{width:D,backfaceVisibility:"hidden",MozBackfaceVisibility:"hidden",WebkitBackfaceVisibility:"hidden"},className:r(v.relative,v.w_full,v.flex,v.nowrap,v.border_box,v.item_center,v.justify_center)},S&&u.createElement("div",{style:{WebkitTransform:"translate3d(0,0,0)",msTransform:"translate3d(0,0,0)",transform:"translate3d(0,0,0)"},className:r(v.relative,v.flex_1,v.overflow_hidden,v.border_box)},E(w[w.length-1])),w.map((function(e,t){return u.createElement("div",{key:t,style:{WebkitTransform:"translate3d(0,0,0)",msTransform:"translate3d(0,0,0)",transform:"translate3d(0,0,0)"},className:r(v.relative,v.flex_1,v.overflow_hidden,v.border_box)},E(e))})),S&&u.createElement("div",{style:{WebkitTransform:"translate3d(0,0,0)",msTransform:"translate3d(0,0,0)",transform:"translate3d(0,0,0)"},className:r(v.relative,v.flex_1,v.overflow_hidden,v.border_box)},E(w[0])))),x,L||_&&u.createElement("ul",{style:T,className:r(v.absolute,v.w_full,v.left_0,v.flex,v.justify_center,v.item_center,v.bottom_20,v.style_none,v.gap)},w.map((function(t,n){return u.createElement("li",{key:n,onClick:function(){return B(n)},style:n===j?e(e({},h),k):e(e({},m),N)})}))))}));export{b as default};
+import{__assign as e,__awaiter as t,__generator as n}from"tslib";import{css as r}from"aphrodite/no-important";import u,{forwardRef as o,useMemo as a,useRef as i,useState as c,useCallback as s,useEffect as l,useImperativeHandle as d}from"react";import f from"../utils.js";import v from"./styles.js";var m=60,h={width:"10px",height:"10px",borderRadius:"50%",backgroundColor:"rgba(0,0,0,.3)",transition:"all 200ms linear"},p=e(e({},h),{backgroundColor:"rgba(255,255,255,.7)"}),b={data:[],renderItem:function(){return null},onChange:function(){return null},boundary:1/3,duration:500,delay:2e3,autoPlay:!0,active:0,dotVisible:!0,dotBoxStyle:{},dotStyle:h,activeDotStyle:p};var y=o((function(o,y){var g=e(e({},b),o),w=g.boundary,E=g.data,x=g.renderItem,_=g.children,L=g.dotVisible,T=g.renderDots,k=g.dotBoxStyle,N=g.activeDotStyle,S=g.dotStyle,z=E.length>=2,C=function(){var e=i(null),t=c(0),n=t[0],r=t[1],u=s((function(){var t,n;return r(Math.max((null===(t=e.current)||void 0===t?void 0:t.clientWidth)||0,(null===(n=e.current)||void 0===n?void 0:n.offsetWidth)||0))}),[]);return l((function(){return u(),window.addEventListener("resize",u),function(){return window.removeEventListener("resize",u)}}),[u]),[e,n]}(),W=C[0],X=C[1],M=function(e){var r=this,u=e.active,o=e.data,v=e.width,h=e.duration,p=e.boundary,b=e.delay,y=e.ref,g=e.onChange,w=o.length>=2,E=i(),x=i(!0),_=i(u),L=i(!1),T=i(!1),k=c(!1),N=k[0],S=k[1],z=c(u),C=z[0],W=z[1],X=i(null),M=a((function(){return v*p}),[v,p]),V=s((function(e){if(!X.current)return 0;var t=getComputedStyle(X.current);try{var n=new WebKitCSSMatrix(t.transform);return{x:n.m41,y:n.m42,z:n.m43}[e]}catch(n){var r=t.transform.split(/\(|\)/),u=r[0],o=r[1];if(u.includes("3d")){var a=o.split(",").slice(-4),i=a[0],c=a[1],s=a[2];return Number({x:i,y:c,z:s}[e])}var l=o.split(",").slice(-2);return i=l[0],c=l[1],Number({x:i,y:c,z:0}[e])}}),[]),j=s((function(e,t){void 0===e&&(e=!1),void 0===t&&(t=h),X.current&&(X.current.style.transition=e?"none":"all ".concat(t,"ms linear"),X.current.style.webkitTransition=e?"none":"all ".concat(t,"ms linear"))}),[h]),B=s((function(e){if(X.current){var t=e;null==t&&(t=w?-v*_.current+"px":"0px"),X.current.style.transform="translate3d(".concat(t,", 0, 0)"),X.current.style.webkitTransform="translate3d(".concat(t,", 0, 0)")}}),[w,v]),D=s((function(){return t(r,void 0,void 0,(function(){var e;return n(this,(function(t){switch(t.label){case 0:return L.current||!w?[2]:(L.current=!0,S(!0),_.current>=o.length+1?(L.current=!1,j(!0),_.current=1,B(),[4,f.sleep(m)]):[3,2]);case 1:return t.sent(),D(),[2];case 2:return j(),_.current++,(e=_.current-1)>=o.length&&(e=0),W(e),B(),[4,f.sleep(h)];case 3:return t.sent(),L.current=!1,S(!1),[2]}}))}))}),[w,o.length,j,B]),P=s((function(){return t(r,void 0,void 0,(function(){var e;return n(this,(function(t){switch(t.label){case 0:return L.current||!w?[2]:(L.current=!0,S(!0),_.current<=0?(L.current=!1,j(!0),_.current=o.length,B(),[4,f.sleep(m)]):[3,2]);case 1:return t.sent(),P(),[2];case 2:return j(),_.current--,(e=_.current-1)<0&&(e=o.length-1),W(e),B(),[4,f.sleep(h)];case 3:return t.sent(),L.current=!1,S(!1),[2]}}))}))}),[w,o.length,j,B]),I=s((function(e){return t(r,void 0,void 0,(function(){return n(this,(function(t){switch(t.label){case 0:return L.current||!w?[2]:(L.current=!0,S(!0),_.current<=0?(j(!0),_.current=o.length,B(),[4,f.sleep(m)]):[3,2]);case 1:t.sent(),t.label=2;case 2:return _.current>=o.length+1?(j(!0),_.current=1,B(),[4,f.sleep(m)]):[3,4];case 3:t.sent(),t.label=4;case 4:return j(),_.current=e+1,B(),W(e),[4,f.sleep(h)];case 5:return t.sent(),L.current=!1,S(!1),[2]}}))}))}),[w,j,o.length,B,h]);return d(y,(function(){return{next:function(){return D()},pre:function(){return P()}}}),[D,P]),l((function(){x.current=!0}),[v,o.length]),l((function(){x.current?(S(!0),_.current=w?u+1:u,j(!0),B(),W(u),x.current=!1,f.sleep(m).then((function(){S(!1)}))):(x.current=!1,I(u))}),[u,w,o,j,B,I]),l((function(){g(C)}),[C]),l((function(){w&&e.autoPlay&&!N?E.current=setTimeout((function(){return D()}),b):clearTimeout(E.current)}),[w,e.autoPlay,N,b,D]),l((function(){var e=X.current,r=0,u=0;function a(e){L.current||(T.current=!0,S(!0),j(!0),_.current<=0&&(_.current=o.length,B()),_.current>=o.length+1&&(_.current=1,B()),r=e,u=V("x"))}function i(e){T.current&&B(u+(e-r)+"px")}function c(e){return t(this,void 0,void 0,(function(){var t,u,a;return n(this,(function(n){switch(n.label){case 0:return T.current?((t=e-r)>=M?(_.current--,u=(v-Math.abs(t))*h/v,j(!1,u)):t<=-M?(_.current++,u=(v-Math.abs(t))*h/v,j(!1,u)):(u=Math.abs(t)*h/v,j(!1,u)),(a=_.current-1)>=o.length&&(a=0),W(a),T.current=!1,L.current=!0,B(),[4,f.sleep(h)]):[2];case 1:return n.sent(),S(!1),L.current=!1,[2]}}))}))}function s(e){e.preventDefault(),e.stopPropagation()}function l(e){s(e),a(e.targetTouches[0].pageX)}function d(e){s(e),a(e.pageX)}function m(e){s(e),i(e.targetTouches[0].pageX)}function p(e){s(e),i(e.pageX)}function b(e){s(e),c(e.changedTouches[0].pageX)}function y(e){s(e),c(e.pageX)}function g(e){s(e),c(e.changedTouches[0].pageX)}return e&&w&&(e.addEventListener("touchstart",l,{passive:!1}),e.addEventListener("touchmove",m,{passive:!1}),e.addEventListener("touchend",b,{passive:!1}),e.addEventListener("touchcancel",g,{passive:!1}),e.addEventListener("mousedown",d,{passive:!1}),e.addEventListener("mousemove",p,{passive:!1}),e.addEventListener("mouseup",y,{passive:!1}),e.addEventListener("mouseout",y,{passive:!1})),function(){null==e||e.removeEventListener("touchstart",l),null==e||e.removeEventListener("touchmove",m),null==e||e.removeEventListener("touchend",b),null==e||e.removeEventListener("touchcancel",g),null==e||e.removeEventListener("mousedown",d),null==e||e.removeEventListener("mousemove",p),null==e||e.removeEventListener("mouseup",y),null==e||e.removeEventListener("mouseout",y)}}),[w,j,V,B,M,h,o.length,v]),l((function(){var e;function t(){clearTimeout(e),S(!0),j(!0),B(),e=setTimeout((function(){S(!1)}),60)}return window.addEventListener("resize",t),function(){return window.removeEventListener("resize",t)}}),[j,B]),l((function(){var e=E.current;return function(){return clearTimeout(e)}}),[]),[X,C,I]}(e(e(e({},b),o),{width:X,ref:y})),V=M[0],j=M[1],B=M[2],D=a((function(){return X&&z?X*(E.length+2)+"px":"100%"}),[X,z,E.length]);if("number"!=typeof w||w<=0||w>=1)throw new Error("property boundary must be number, and between 0 and 1, exclude 0 and 1");return u.createElement("div",{className:r(v.relative,v.w_full,v.border_box,v.overflow_hidden)},u.createElement("div",{ref:W,className:r(v.relative,v.w_full,v.border_box,v.overflow_hidden)},u.createElement("div",{ref:V,style:{width:D,backfaceVisibility:"hidden",MozBackfaceVisibility:"hidden",WebkitBackfaceVisibility:"hidden"},className:r(v.relative,v.w_full,v.flex,v.nowrap,v.border_box,v.item_center,v.justify_center)},z&&u.createElement("div",{style:{WebkitTransform:"translate3d(0,0,0)",msTransform:"translate3d(0,0,0)",transform:"translate3d(0,0,0)"},className:r(v.relative,v.flex_1,v.overflow_hidden,v.border_box)},x(E[E.length-1])),E.map((function(e,t){return u.createElement("div",{key:t,style:{WebkitTransform:"translate3d(0,0,0)",msTransform:"translate3d(0,0,0)",transform:"translate3d(0,0,0)"},className:r(v.relative,v.flex_1,v.overflow_hidden,v.border_box)},x(e))})),z&&u.createElement("div",{style:{WebkitTransform:"translate3d(0,0,0)",msTransform:"translate3d(0,0,0)",transform:"translate3d(0,0,0)"},className:r(v.relative,v.flex_1,v.overflow_hidden,v.border_box)},x(E[0])))),_,T||L&&u.createElement("ul",{style:k,className:r(v.absolute,v.w_full,v.left_0,v.flex,v.justify_center,v.item_center,v.bottom_20,v.style_none,v.gap)},E.map((function(t,n){return u.createElement("li",{key:n,onClick:function(){return B(n)},style:n===j?e(e({},p),N):e(e({},h),S)})}))))}));export{y as default};

package/dist/es/index.d.ts

@@ -4,4 +4,5 @@ export { default as Card } from './Card';
 export { default as Container } from './Container';
 export { default as Loading } from './Loading';
 export { default as Menu } from './Menu';
+export { default as ScrollView } from './ScrollView';
 export { default as Swiper } from './Swiper';

package/dist/es/index.js

@@ -1 +1 @@
-export{default as utils}from"./utils.js";export{default as Card}from"./Card/Card.js";export{default as Container}from"./Container/Container.js";export{default as Loading}from"./Loading/Loading.js";export{default as Menu}from"./Menu/Menu.js";export{default as Swiper}from"./Swiper/Swiper.js";
+export{default as utils}from"./utils.js";export{default as Card}from"./Card/Card.js";export{default as Container}from"./Container/Container.js";export{default as Loading}from"./Loading/Loading.js";export{default as Menu}from"./Menu/Menu.js";export{default as ScrollView}from"./ScrollView/ScrollView.js";export{default as Swiper}from"./Swiper/Swiper.js";

package/dist/index.d.ts

@@ -82,20 +82,37 @@ interface MenuProps<T> extends IconProps {
     data: T[];
     renderItem: (item: T) => ReactNode;
     onChange?: (item: T, index: string) => void;
-    subItemStyle?: CSSProperties;
+    labelStyle?: CSSProperties;
+    subBoxStyle?: CSSProperties;
     activeStyle?: CSSProperties;
     active?: string;
     isMultipleExpand?: boolean;
     icon?: ReactNode;
     activeIcon?: ReactNode;
+    childrenField?: string;
 }
-declare const Menu: <T extends {
-    children?: unknown[] | undefined;
-}>(_props: MenuProps<T>) => React.JSX.Element;
+declare const Menu: <T extends unknown>(_props: MenuProps<T>) => React.JSX.Element;
+
+interface OnScrollParameters {
+    x?: number;
+    y?: number;
+}
+interface ScrollViewProps extends PropsWithChildren {
+    style?: CSSProperties;
+    horizontal?: boolean;
+    vertical?: boolean;
+    onScroll?: (position: OnScrollParameters) => void;
+    threshold?: number;
+    onReachTop?: (done: Function) => void;
+    onReachBottom?: (done: Function) => void;
+    onReachLeft?: (done: Function) => void;
+    onReachRight?: (done: Function) => void;
+}
+declare function ScrollView(props?: ScrollViewProps): React.JSX.Element;
 
 declare module 'react' {
     function forwardRef<T, P = {}>(render: (props: P, ref: React.Ref<T>) => React.ReactNode | null): (props: P & React.RefAttributes<T>) => React.ReactNode | null;
 }
 declare const _default: <T extends unknown>(props: SwiperProps<T> & React.RefAttributes<SwiperExposeMethods>) => React.ReactNode;
 
-export { Card, Container, Loading, Menu, _default as Swiper, type SwiperExposeMethods, type SwiperProps, _default$1 as utils };
+export { Card, Container, Loading, Menu, ScrollView, _default as Swiper, type SwiperExposeMethods, type SwiperProps, _default$1 as utils };

package/dist/lib/Menu/Menu.d.ts

@@ -15,14 +15,14 @@ interface MenuProps<T> extends IconProps {
     data: T[];
     renderItem: (item: T) => ReactNode;
     onChange?: (item: T, index: string) => void;
-    subItemStyle?: CSSProperties;
+    labelStyle?: CSSProperties;
+    subBoxStyle?: CSSProperties;
     activeStyle?: CSSProperties;
     active?: string;
     isMultipleExpand?: boolean;
     icon?: ReactNode;
     activeIcon?: ReactNode;
+    childrenField?: string;
 }
-declare const Menu: <T extends {
-    children?: unknown[] | undefined;
-}>(_props: MenuProps<T>) => React.JSX.Element;
+declare const Menu: <T extends unknown>(_props: MenuProps<T>) => React.JSX.Element;
 export default Menu;

package/dist/lib/Menu/Menu.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("tslib"),t=require("aphrodite/no-important"),n=require("react"),a=require("../Card/Card.js"),r=require("./styles.js"),i={data:[],renderItem:function(){return null},onChange:function(){return null},subItemStyle:{paddingLeft:"25px"},activeStyle:{color:"skyblue"},active:"",isMultipleExpand:!1,iconSize:"10px",iconStrokeWidth:"2px",iconColor:"#333"};function s(a){var s=e.__assign(e.__assign({},i),a),c=s.iconSize,l=s.iconStrokeWidth,o=s.iconColor,u=s.down;return n.createElement("div",{style:{"--size":c,"--strokeWidth":l,"--color":o},className:"".concat(t.css(r.default.arrow_right)," ").concat(u?t.css(r.default.arrow_down):"")})}var c=n.createContext({active:"0",changeActive:function(){return null}}),l=function(o){var u=e.__assign(e.__assign({},i),o),d=u.renderItem,f=u.item,v=u.subItemStyle,_=u.activeStyle,g=u.index,h=u.isMultipleExpand,m=u.icon,p=u.activeIcon,y=n.useState(!1),x=y[0],E=y[1],b=n.useContext(c),S=b.active,A=b.changeActive,C=n.useCallback((function(e){e.stopPropagation(),A(g),u.onChange(f,g),f.children&&Array.isArray(f.children)&&E((function(e){return!e}))}),[A,g,f]);return n.useEffect((function(){if(void 0!==S){var e=S.split("-"),t=g.split("-");S.startsWith(g)&&e.length>t.length&&g.length<S.length?E(!0):S.startsWith(g)&&g.startsWith(S)||h||E(!1)}}),[S,g]),n.createElement("div",{className:t.css(r.default.w_full,r.default.border_box),onClick:C},n.createElement("div",{className:t.css(r.default.item),style:S===g?_:{}},d(f)," ",Array.isArray(f.children)&&f.children.length?x?p||n.createElement(s,e.__assign({},u,{down:!0})):m||n.createElement(s,e.__assign({},u)):null),Array.isArray(f.children)?f.children.map((function(s,c){return n.createElement("div",{key:c,className:t.css(r.default.w_full,r.default.border_box),style:e.__assign(e.__assign({},i.subItemStyle),v)},n.createElement(a.default,{expand:x},n.createElement(l,e.__assign({},u,{index:g+"-"+c,item:s}))))})):null)};exports.default=function(t){var a=e.__assign(e.__assign({},i),t),r=n.useState(a.active),s=r[0],o=r[1];return n.useEffect((function(){if(a.data.length&&void 0!==a.active){var e=a.active.split("-").map((function(e){return Number(e)})),t=a.data,n={};e.forEach((function(e){Array.isArray(t)&&(n=t[e]||{},t=n.children)})),a.onChange(n,a.active)}o(a.active)}),[a.active,a.data]),n.createElement(c.Provider,{value:{active:s,changeActive:o}},a.data.map((function(t,r){return n.createElement(l,e.__assign({key:r,index:r.toString()},a,{item:t}))})))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("tslib"),t=require("aphrodite/no-important"),a=require("react"),n=require("../Card/Card.js"),i=require("./styles.js"),r={data:[],renderItem:function(){return null},onChange:function(){return null},labelStyle:{width:"100%"},subBoxStyle:{paddingLeft:"25px"},activeStyle:{color:"skyblue"},active:"",isMultipleExpand:!1,iconSize:"10px",iconStrokeWidth:"2px",iconColor:"#333",childrenField:"children"};function s(n){var s=e.__assign(e.__assign({},r),n),l=s.iconSize,c=s.iconStrokeWidth,o=s.iconColor,u=s.down;return a.createElement("div",{style:{"--size":l,"--strokeWidth":c,"--color":o},className:"".concat(t.css(i.default.arrow_right)," ").concat(u?t.css(i.default.arrow_down):"")})}var l=a.createContext({active:"0",changeActive:function(){return null}}),c=function(o){var u=e.__assign(e.__assign({},r),o),d=u.renderItem,_=u.item,f=u.subBoxStyle,v=u.activeStyle,g=u.index,h=u.isMultipleExpand,m=u.icon,y=u.activeIcon,p=u.labelStyle,x=u.childrenField,b=a.useState(!1),E=b[0],S=b[1],A=a.useContext(l),C=A.active,k=A.changeActive,w=a.useCallback((function(e){e.stopPropagation(),k(g),u.onChange(_,g),_[x]&&Array.isArray(_[x])&&S((function(e){return!e}))}),[k,g,_,x]);return a.useEffect((function(){if(void 0!==C){var e=C.split("-"),t=g.split("-");C.startsWith(g)&&e.length>t.length&&g.length<C.length?S(!0):C.startsWith(g)&&g.startsWith(C)||h||S(!1)}}),[C,g]),a.createElement("div",{className:t.css(i.default.w_full,i.default.border_box),onClick:w},a.createElement("div",{className:t.css(i.default.item),style:C===g?e.__assign(e.__assign(e.__assign({},r.labelStyle),p),v):e.__assign(e.__assign({},r.labelStyle),p)},a.createElement("div",{className:t.css(i.default.flex_1)},d(_))," ",Array.isArray(_[x])&&_[x].length?E?y||a.createElement(s,e.__assign({},u,{down:!0})):m||a.createElement(s,e.__assign({},u)):null),Array.isArray(_[x])?_[x].map((function(s,l){return a.createElement("div",{key:l,className:t.css(i.default.w_full,i.default.border_box),style:e.__assign(e.__assign({},r.subBoxStyle),f)},a.createElement(n.default,{expand:E},a.createElement(c,e.__assign({},u,{index:g+"-"+l,item:s}))))})):null)};exports.default=function(t){var n=e.__assign(e.__assign({},r),t),i=a.useState(n.active),s=i[0],o=i[1];return a.useEffect((function(){if(n.data.length&&void 0!==n.active){var e=n.active.split("-").map((function(e){return Number(e)})),t=n.data,a={};e.forEach((function(e){if(Array.isArray(t)){a=t[e]||{};var i=n.childrenField;t=a[i]}})),n.onChange(a,n.active)}o(n.active)}),[n.active,n.data,n.childrenField]),a.createElement(l.Provider,{value:{active:s,changeActive:o}},n.data.map((function(t,i){return a.createElement(c,e.__assign({key:i,index:i.toString()},n,{item:t}))})))};

package/dist/lib/Menu/styles.d.ts

@@ -2,6 +2,7 @@ declare const styles: {
     w_full: object;
     item: object;
     border_box: object;
+    flex_1: object;
     arrow_right: object;
     arrow_down: object;
 };

package/dist/lib/Menu/styles.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var r=require("aphrodite/no-important").StyleSheet.create({w_full:{width:"100%"},item:{display:"flex",width:"100%",paddingRight:"10px",alignItems:"center",justifyContent:"space-between",boxSizing:"border-box"},border_box:{boxSizing:"border-box"},arrow_right:{position:"relative",width:"var(--size)",height:"var(--size)",borderTop:"var(--strokeWidth) solid var(--color)",borderRight:"var(--strokeWidth) solid var(--color)",transform:"rotate(45deg)",transformOrigin:"center",transition:"all 100ms linear"},arrow_down:{transform:"rotate(135deg)"}});exports.default=r;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("aphrodite/no-important").StyleSheet.create({w_full:{width:"100%"},item:{display:"flex",width:"100%",paddingRight:"10px",alignItems:"center",justifyContent:"space-between",boxSizing:"border-box"},border_box:{boxSizing:"border-box"},flex_1:{flex:1},arrow_right:{position:"relative",width:"var(--size)",height:"var(--size)",borderTop:"var(--strokeWidth) solid var(--color)",borderRight:"var(--strokeWidth) solid var(--color)",transform:"rotate(45deg)",transformOrigin:"center",transition:"all 100ms linear"},arrow_down:{transform:"rotate(135deg)"}});exports.default=e;

package/dist/lib/ScrollView/ScrollView.d.ts

@@ -0,0 +1,18 @@
+import React, { CSSProperties, PropsWithChildren } from 'react';
+interface OnScrollParameters {
+    x?: number;
+    y?: number;
+}
+interface ScrollViewProps extends PropsWithChildren {
+    style?: CSSProperties;
+    horizontal?: boolean;
+    vertical?: boolean;
+    onScroll?: (position: OnScrollParameters) => void;
+    threshold?: number;
+    onReachTop?: (done: Function) => void;
+    onReachBottom?: (done: Function) => void;
+    onReachLeft?: (done: Function) => void;
+    onReachRight?: (done: Function) => void;
+}
+declare function ScrollView(props?: ScrollViewProps): React.JSX.Element;
+export default ScrollView;

package/dist/lib/ScrollView/ScrollView.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("tslib"),r=require("aphrodite/no-important"),t=require("react"),n=require("../utils.js"),u=require("./styles.js"),l={style:{width:"100%",height:"100%"},horizontal:!1,vertical:!0,onScroll:function(){return null},threshold:50,onReachTop:function(e){return e()},onReachBottom:function(e){return e()},onReachLeft:function(e){return e()},onReachRight:function(e){return e()}};exports.default=function(c){void 0===c&&(c=l);var o=e.__assign(e.__assign({},l),c),s=o.style,a=o.children,i=o.horizontal,f=o.vertical,d=o.onScroll,h=o.threshold,_=o.onReachTop,R=o.onReachBottom,v=o.onReachLeft,b=o.onReachRight,p=t.useRef(0),g=t.useRef(0),m=t.useRef(!1),y=t.useRef(!1),T=t.useRef(!1),w=t.useRef(!1),x=t.useMemo((function(){return e.__assign(e.__assign({},l.style),s)}),[s]),q=t.useMemo((function(){return{overflowX:i?"scroll":"hidden",overflowY:f?"scroll":"hidden",scrollbarWidth:"none",msOverflowStyle:"none"}}),[i,f]),k=t.useCallback((function(e){var r=e.currentTarget,t=r.scrollTop,u=r.scrollHeight,l=r.clientHeight;t>p.current?t+l>=u-h&&!y.current&&(y.current=!0,R((function(){return n.default.sleep(60).then((function(){return y.current=!1}))}))):t<p.current&&t<=0&&!m.current&&(m.current=!0,_((function(){return n.default.sleep(60).then((function(){return m.current=!1}))}))),p.current=t}),[h,R,_]),C=t.useCallback((function(e){var r=e.currentTarget,t=r.scrollLeft,u=r.scrollWidth,l=r.clientWidth;t>g.current?t+l>=u-h&&!w.current&&(w.current=!0,b((function(){return n.default.sleep(60).then((function(){return w.current=!1}))}))):t<g.current&&t<=0&&!T.current&&(T.current=!0,v((function(){return n.default.sleep(60).then((function(){return T.current=!1}))}))),g.current=t}),[h,v,b]),L=t.useCallback((function(e){C(e),k(e)}),[C,k]),S=t.useCallback((function(e){var r=e.currentTarget,t=r.scrollTop,n=r.scrollLeft;d({x:n,y:t}),i&&f?L(e):i?C(e):f&&k(e)}),[i,f,d,C,k,L]);return t.createElement("div",{style:x,className:r.css(u.default.border_box)},t.createElement("div",{className:r.css(u.default.w_full,u.default.h_full,u.default.border_box)},t.createElement("div",{onScroll:S,style:q,className:r.css(u.default.border_box,u.default.w_full,u.default.h_full,u.default.scroll_bar_hide)},a)))};

package/dist/lib/ScrollView/index.d.ts

@@ -0,0 +1,2 @@
+import ScrollView from './ScrollView';
+export default ScrollView;

package/dist/lib/ScrollView/index.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./ScrollView.js");exports.default=e.default;

package/dist/lib/ScrollView/styles.d.ts

@@ -0,0 +1,7 @@
+declare const styles: {
+    border_box: object;
+    w_full: object;
+    h_full: object;
+    scroll_bar_hide: object;
+};
+export default styles;

package/dist/lib/ScrollView/styles.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("aphrodite/no-important").StyleSheet.create({border_box:{boxSizing:"border-box"},w_full:{width:"100%"},h_full:{height:"100%"},scroll_bar_hide:{"scrollbar-width":"none","-ms-overflow-style":"none","::-webkit-scrollbar":{display:"none"}}});exports.default=e;

package/dist/lib/Swiper/Swiper.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("tslib"),t=require("aphrodite/no-important"),n=require("react"),r=require("../utils.js"),u=require("./styles.js"),a={width:"10px",height:"10px",borderRadius:"50%",backgroundColor:"rgba(0,0,0,.3)",transition:"all 200ms linear"},s=e.__assign(e.__assign({},a),{backgroundColor:"rgba(255,255,255,.7)"}),l={data:[],renderItem:function(){return null},onChange:function(){return null},boundary:1/3,duration:500,delay:2e3,autoPlay:!0,active:0,dotVisible:!0,dotBoxStyle:{},dotStyle:a,activeDotStyle:s};var i=n.forwardRef((function(i,c){var o=e.__assign(e.__assign({},l),i),f=o.boundary,d=o.data,v=o.renderItem,m=o.children,h=o.dotVisible,_=o.renderDots,b=o.dotBoxStyle,g=o.activeDotStyle,p=o.dotStyle,y=d.length>=2,w=function(){var e=n.useRef(null),t=n.useState(0),r=t[0],u=t[1],a=n.useCallback((function(){var t,n;return u(Math.max((null===(t=e.current)||void 0===t?void 0:t.clientWidth)||0,(null===(n=e.current)||void 0===n?void 0:n.offsetWidth)||0))}),[]);return n.useEffect((function(){return a(),window.addEventListener("resize",a),function(){return window.removeEventListener("resize",a)}}),[a]),[e,r]}(),E=w[0],x=w[1],k=function(t){var u=this,a=t.active,s=t.data,l=t.width,i=t.duration,c=t.boundary,o=t.delay,f=t.ref,d=t.onChange,v=s.length>=2,m=n.useRef(),h=n.useRef(!0),_=n.useRef(a),b=n.useRef(!1),g=n.useRef(!1),p=n.useState(!1),y=p[0],w=p[1],E=n.useState(a),x=E[0],k=E[1],L=n.useRef(null),T=n.useMemo((function(){return l*c}),[l,c]),C=n.useCallback((function(e){if(!L.current)return 0;var t=getComputedStyle(L.current);try{var n=new WebKitCSSMatrix(t.transform);return{x:n.m41,y:n.m42,z:n.m43}[e]}catch(n){var r=t.transform.split(/\(|\)/),u=r[0],a=r[1];if(u.includes("3d")){var s=a.split(",").slice(-4),l=s[0],i=s[1],c=s[2];return Number({x:l,y:i,z:c}[e])}var o=a.split(",").slice(-2);return l=o[0],i=o[1],Number({x:l,y:i,z:0}[e])}}),[]),S=n.useCallback((function(e){void 0===e&&(e=!1),L.current&&(L.current.style.transition=e?"none":"all ".concat(i,"ms linear"),L.current.style.webkitTransition=e?"none":"all ".concat(i,"ms linear"))}),[i]),N=n.useCallback((function(e){if(L.current){var t=e;null==t&&(t=v?-l*_.current+"px":"0px"),L.current.style.transform="translate3d(".concat(t,", 0, 0)"),L.current.style.webkitTransform="translate3d(".concat(t,", 0, 0)")}}),[v,l]),R=n.useCallback((function(){return e.__awaiter(u,void 0,void 0,(function(){var t;return e.__generator(this,(function(e){switch(e.label){case 0:return b.current||!v?[2]:(b.current=!0,w(!0),_.current>=s.length+1?(b.current=!1,S(!0),_.current=1,N(),[4,r.default.sleep(5)]):[3,2]);case 1:return e.sent(),R(),[2];case 2:return S(),_.current++,(t=_.current-1)>=s.length&&(t=0),k(t),N(),[4,r.default.sleep(i)];case 3:return e.sent(),b.current=!1,w(!1),[2]}}))}))}),[v,s.length,S,N]),z=n.useCallback((function(){return e.__awaiter(u,void 0,void 0,(function(){var t;return e.__generator(this,(function(e){switch(e.label){case 0:return b.current||!v?[2]:(b.current=!0,w(!0),_.current<=0?(b.current=!1,S(!0),_.current=s.length,N(),[4,r.default.sleep(5)]):[3,2]);case 1:return e.sent(),z(),[2];case 2:return S(),_.current--,(t=_.current-1)<0&&(t=s.length-1),k(t),N(),[4,r.default.sleep(i)];case 3:return e.sent(),b.current=!1,w(!1),[2]}}))}))}),[v,s.length,S,N]),W=n.useCallback((function(t){return e.__awaiter(u,void 0,void 0,(function(){return e.__generator(this,(function(e){switch(e.label){case 0:return b.current||!v?[2]:(b.current=!0,w(!0),_.current<=0?(S(!0),_.current=s.length,N(),[4,r.default.sleep(5)]):[3,2]);case 1:e.sent(),e.label=2;case 2:return _.current>=s.length+1?(S(!0),_.current=1,N(),[4,r.default.sleep(5)]):[3,4];case 3:e.sent(),e.label=4;case 4:return S(),_.current=t+1,N(),k(t),[4,r.default.sleep(i)];case 5:return e.sent(),b.current=!1,w(!1),[2]}}))}))}),[v,S,s.length,N,i]);return n.useImperativeHandle(f,(function(){return{next:function(){return R()},pre:function(){return z()}}}),[R,z]),n.useEffect((function(){h.current=!0}),[l,s.length]),n.useEffect((function(){h.current?(w(!0),_.current=v?a+1:a,S(!0),N(),k(a),h.current=!1,r.default.sleep(5).then((function(){w(!1)}))):(h.current=!1,W(a))}),[a,v,s,S,N,W]),n.useEffect((function(){d(x)}),[x]),n.useEffect((function(){v&&t.autoPlay&&!y?m.current=setTimeout((function(){return R()}),o):clearTimeout(m.current)}),[v,t.autoPlay,y,o,R]),n.useEffect((function(){var t=L.current,n=0,u=0;function a(e){b.current||(g.current=!0,w(!0),S(!0),_.current<=0&&(_.current=s.length,N()),_.current>=s.length+1&&(_.current=1,N()),n=e,u=C("x"))}function l(e){g.current&&N(u+(e-n)+"px")}function c(t){return e.__awaiter(this,void 0,void 0,(function(){var u,a;return e.__generator(this,(function(e){switch(e.label){case 0:return g.current?(S(),(u=t-n)>=T&&_.current--,u<=-T&&_.current++,(a=_.current-1)>=s.length&&(a=0),k(a),g.current=!1,b.current=!0,N(),[4,r.default.sleep(i)]):[2];case 1:return e.sent(),w(!1),b.current=!1,[2]}}))}))}function o(e){e.preventDefault(),e.stopPropagation()}function f(e){o(e),a(e.targetTouches[0].pageX)}function d(e){o(e),a(e.pageX)}function m(e){o(e),l(e.targetTouches[0].pageX)}function h(e){o(e),l(e.pageX)}function p(e){o(e),c(e.changedTouches[0].pageX)}function y(e){o(e),c(e.pageX)}function E(e){o(e),c(e.changedTouches[0].pageX)}return t&&v&&(t.addEventListener("touchstart",f,{passive:!1}),t.addEventListener("touchmove",m,{passive:!1}),t.addEventListener("touchend",p,{passive:!1}),t.addEventListener("touchcancel",E,{passive:!1}),t.addEventListener("mousedown",d,{passive:!1}),t.addEventListener("mousemove",h,{passive:!1}),t.addEventListener("mouseup",y,{passive:!1}),t.addEventListener("mouseout",y,{passive:!1})),function(){null==t||t.removeEventListener("touchstart",f),null==t||t.removeEventListener("touchmove",m),null==t||t.removeEventListener("touchend",p),null==t||t.removeEventListener("touchcancel",E),null==t||t.removeEventListener("mousedown",d),null==t||t.removeEventListener("mousemove",h),null==t||t.removeEventListener("mouseup",y),null==t||t.removeEventListener("mouseout",y)}}),[v,S,C,N,T,i,s.length]),n.useEffect((function(){var e;function t(){clearTimeout(e),w(!0),S(!0),N(),e=setTimeout((function(){w(!1)}),60)}return window.addEventListener("resize",t),function(){return window.removeEventListener("resize",t)}}),[S,N]),n.useEffect((function(){var e=m.current;return function(){return clearTimeout(e)}}),[]),[L,x,W]}(e.__assign(e.__assign(e.__assign({},l),i),{width:x,ref:c})),L=k[0],T=k[1],C=k[2],S=n.useMemo((function(){return x&&y?x*(d.length+2)+"px":"100%"}),[x,y,d.length]);if("number"!=typeof f||f<=0||f>=1)throw new Error("property boundary must be number, and between 0 and 1, exclude 0 and 1");return n.createElement("div",{className:t.css(u.default.relative,u.default.w_full,u.default.border_box,u.default.overflow_hidden)},n.createElement("div",{ref:E,className:t.css(u.default.relative,u.default.w_full,u.default.border_box,u.default.overflow_hidden)},n.createElement("div",{ref:L,style:{width:S,backfaceVisibility:"hidden",MozBackfaceVisibility:"hidden",WebkitBackfaceVisibility:"hidden"},className:t.css(u.default.relative,u.default.w_full,u.default.flex,u.default.nowrap,u.default.border_box,u.default.item_center,u.default.justify_center)},y&&n.createElement("div",{style:{WebkitTransform:"translate3d(0,0,0)",msTransform:"translate3d(0,0,0)",transform:"translate3d(0,0,0)"},className:t.css(u.default.relative,u.default.flex_1,u.default.overflow_hidden,u.default.border_box)},v(d[d.length-1])),d.map((function(e,r){return n.createElement("div",{key:r,style:{WebkitTransform:"translate3d(0,0,0)",msTransform:"translate3d(0,0,0)",transform:"translate3d(0,0,0)"},className:t.css(u.default.relative,u.default.flex_1,u.default.overflow_hidden,u.default.border_box)},v(e))})),y&&n.createElement("div",{style:{WebkitTransform:"translate3d(0,0,0)",msTransform:"translate3d(0,0,0)",transform:"translate3d(0,0,0)"},className:t.css(u.default.relative,u.default.flex_1,u.default.overflow_hidden,u.default.border_box)},v(d[0])))),m,_||h&&n.createElement("ul",{style:b,className:t.css(u.default.absolute,u.default.w_full,u.default.left_0,u.default.flex,u.default.justify_center,u.default.item_center,u.default.bottom_20,u.default.style_none,u.default.gap)},d.map((function(t,r){return n.createElement("li",{key:r,onClick:function(){return C(r)},style:r===T?e.__assign(e.__assign({},s),g):e.__assign(e.__assign({},a),p)})}))))}));exports.default=i;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("tslib"),t=require("aphrodite/no-important"),n=require("react"),r=require("../utils.js"),u=require("./styles.js"),a=60,s={width:"10px",height:"10px",borderRadius:"50%",backgroundColor:"rgba(0,0,0,.3)",transition:"all 200ms linear"},l=e.__assign(e.__assign({},s),{backgroundColor:"rgba(255,255,255,.7)"}),i={data:[],renderItem:function(){return null},onChange:function(){return null},boundary:1/3,duration:500,delay:2e3,autoPlay:!0,active:0,dotVisible:!0,dotBoxStyle:{},dotStyle:s,activeDotStyle:l};var c=n.forwardRef((function(c,o){var d=e.__assign(e.__assign({},i),c),f=d.boundary,v=d.data,m=d.renderItem,h=d.children,_=d.dotVisible,b=d.renderDots,g=d.dotBoxStyle,p=d.activeDotStyle,y=d.dotStyle,w=v.length>=2,E=function(){var e=n.useRef(null),t=n.useState(0),r=t[0],u=t[1],a=n.useCallback((function(){var t,n;return u(Math.max((null===(t=e.current)||void 0===t?void 0:t.clientWidth)||0,(null===(n=e.current)||void 0===n?void 0:n.offsetWidth)||0))}),[]);return n.useEffect((function(){return a(),window.addEventListener("resize",a),function(){return window.removeEventListener("resize",a)}}),[a]),[e,r]}(),x=E[0],k=E[1],L=function(t){var u=this,s=t.active,l=t.data,i=t.width,c=t.duration,o=t.boundary,d=t.delay,f=t.ref,v=t.onChange,m=l.length>=2,h=n.useRef(),_=n.useRef(!0),b=n.useRef(s),g=n.useRef(!1),p=n.useRef(!1),y=n.useState(!1),w=y[0],E=y[1],x=n.useState(s),k=x[0],L=x[1],T=n.useRef(null),C=n.useMemo((function(){return i*o}),[i,o]),S=n.useCallback((function(e){if(!T.current)return 0;var t=getComputedStyle(T.current);try{var n=new WebKitCSSMatrix(t.transform);return{x:n.m41,y:n.m42,z:n.m43}[e]}catch(n){var r=t.transform.split(/\(|\)/),u=r[0],a=r[1];if(u.includes("3d")){var s=a.split(",").slice(-4),l=s[0],i=s[1],c=s[2];return Number({x:l,y:i,z:c}[e])}var o=a.split(",").slice(-2);return l=o[0],i=o[1],Number({x:l,y:i,z:0}[e])}}),[]),M=n.useCallback((function(e,t){void 0===e&&(e=!1),void 0===t&&(t=c),T.current&&(T.current.style.transition=e?"none":"all ".concat(t,"ms linear"),T.current.style.webkitTransition=e?"none":"all ".concat(t,"ms linear"))}),[c]),N=n.useCallback((function(e){if(T.current){var t=e;null==t&&(t=m?-i*b.current+"px":"0px"),T.current.style.transform="translate3d(".concat(t,", 0, 0)"),T.current.style.webkitTransform="translate3d(".concat(t,", 0, 0)")}}),[m,i]),R=n.useCallback((function(){return e.__awaiter(u,void 0,void 0,(function(){var t;return e.__generator(this,(function(e){switch(e.label){case 0:return g.current||!m?[2]:(g.current=!0,E(!0),b.current>=l.length+1?(g.current=!1,M(!0),b.current=1,N(),[4,r.default.sleep(a)]):[3,2]);case 1:return e.sent(),R(),[2];case 2:return M(),b.current++,(t=b.current-1)>=l.length&&(t=0),L(t),N(),[4,r.default.sleep(c)];case 3:return e.sent(),g.current=!1,E(!1),[2]}}))}))}),[m,l.length,M,N]),z=n.useCallback((function(){return e.__awaiter(u,void 0,void 0,(function(){var t;return e.__generator(this,(function(e){switch(e.label){case 0:return g.current||!m?[2]:(g.current=!0,E(!0),b.current<=0?(g.current=!1,M(!0),b.current=l.length,N(),[4,r.default.sleep(a)]):[3,2]);case 1:return e.sent(),z(),[2];case 2:return M(),b.current--,(t=b.current-1)<0&&(t=l.length-1),L(t),N(),[4,r.default.sleep(c)];case 3:return e.sent(),g.current=!1,E(!1),[2]}}))}))}),[m,l.length,M,N]),W=n.useCallback((function(t){return e.__awaiter(u,void 0,void 0,(function(){return e.__generator(this,(function(e){switch(e.label){case 0:return g.current||!m?[2]:(g.current=!0,E(!0),b.current<=0?(M(!0),b.current=l.length,N(),[4,r.default.sleep(a)]):[3,2]);case 1:e.sent(),e.label=2;case 2:return b.current>=l.length+1?(M(!0),b.current=1,N(),[4,r.default.sleep(a)]):[3,4];case 3:e.sent(),e.label=4;case 4:return M(),b.current=t+1,N(),L(t),[4,r.default.sleep(c)];case 5:return e.sent(),g.current=!1,E(!1),[2]}}))}))}),[m,M,l.length,N,c]);return n.useImperativeHandle(f,(function(){return{next:function(){return R()},pre:function(){return z()}}}),[R,z]),n.useEffect((function(){_.current=!0}),[i,l.length]),n.useEffect((function(){_.current?(E(!0),b.current=m?s+1:s,M(!0),N(),L(s),_.current=!1,r.default.sleep(a).then((function(){E(!1)}))):(_.current=!1,W(s))}),[s,m,l,M,N,W]),n.useEffect((function(){v(k)}),[k]),n.useEffect((function(){m&&t.autoPlay&&!w?h.current=setTimeout((function(){return R()}),d):clearTimeout(h.current)}),[m,t.autoPlay,w,d,R]),n.useEffect((function(){var t=T.current,n=0,u=0;function a(e){g.current||(p.current=!0,E(!0),M(!0),b.current<=0&&(b.current=l.length,N()),b.current>=l.length+1&&(b.current=1,N()),n=e,u=S("x"))}function s(e){p.current&&N(u+(e-n)+"px")}function o(t){return e.__awaiter(this,void 0,void 0,(function(){var u,a,s;return e.__generator(this,(function(e){switch(e.label){case 0:return p.current?((u=t-n)>=C?(b.current--,a=(i-Math.abs(u))*c/i,M(!1,a)):u<=-C?(b.current++,a=(i-Math.abs(u))*c/i,M(!1,a)):(a=Math.abs(u)*c/i,M(!1,a)),(s=b.current-1)>=l.length&&(s=0),L(s),p.current=!1,g.current=!0,N(),[4,r.default.sleep(c)]):[2];case 1:return e.sent(),E(!1),g.current=!1,[2]}}))}))}function d(e){e.preventDefault(),e.stopPropagation()}function f(e){d(e),a(e.targetTouches[0].pageX)}function v(e){d(e),a(e.pageX)}function h(e){d(e),s(e.targetTouches[0].pageX)}function _(e){d(e),s(e.pageX)}function y(e){d(e),o(e.changedTouches[0].pageX)}function w(e){d(e),o(e.pageX)}function x(e){d(e),o(e.changedTouches[0].pageX)}return t&&m&&(t.addEventListener("touchstart",f,{passive:!1}),t.addEventListener("touchmove",h,{passive:!1}),t.addEventListener("touchend",y,{passive:!1}),t.addEventListener("touchcancel",x,{passive:!1}),t.addEventListener("mousedown",v,{passive:!1}),t.addEventListener("mousemove",_,{passive:!1}),t.addEventListener("mouseup",w,{passive:!1}),t.addEventListener("mouseout",w,{passive:!1})),function(){null==t||t.removeEventListener("touchstart",f),null==t||t.removeEventListener("touchmove",h),null==t||t.removeEventListener("touchend",y),null==t||t.removeEventListener("touchcancel",x),null==t||t.removeEventListener("mousedown",v),null==t||t.removeEventListener("mousemove",_),null==t||t.removeEventListener("mouseup",w),null==t||t.removeEventListener("mouseout",w)}}),[m,M,S,N,C,c,l.length,i]),n.useEffect((function(){var e;function t(){clearTimeout(e),E(!0),M(!0),N(),e=setTimeout((function(){E(!1)}),60)}return window.addEventListener("resize",t),function(){return window.removeEventListener("resize",t)}}),[M,N]),n.useEffect((function(){var e=h.current;return function(){return clearTimeout(e)}}),[]),[T,k,W]}(e.__assign(e.__assign(e.__assign({},i),c),{width:k,ref:o})),T=L[0],C=L[1],S=L[2],M=n.useMemo((function(){return k&&w?k*(v.length+2)+"px":"100%"}),[k,w,v.length]);if("number"!=typeof f||f<=0||f>=1)throw new Error("property boundary must be number, and between 0 and 1, exclude 0 and 1");return n.createElement("div",{className:t.css(u.default.relative,u.default.w_full,u.default.border_box,u.default.overflow_hidden)},n.createElement("div",{ref:x,className:t.css(u.default.relative,u.default.w_full,u.default.border_box,u.default.overflow_hidden)},n.createElement("div",{ref:T,style:{width:M,backfaceVisibility:"hidden",MozBackfaceVisibility:"hidden",WebkitBackfaceVisibility:"hidden"},className:t.css(u.default.relative,u.default.w_full,u.default.flex,u.default.nowrap,u.default.border_box,u.default.item_center,u.default.justify_center)},w&&n.createElement("div",{style:{WebkitTransform:"translate3d(0,0,0)",msTransform:"translate3d(0,0,0)",transform:"translate3d(0,0,0)"},className:t.css(u.default.relative,u.default.flex_1,u.default.overflow_hidden,u.default.border_box)},m(v[v.length-1])),v.map((function(e,r){return n.createElement("div",{key:r,style:{WebkitTransform:"translate3d(0,0,0)",msTransform:"translate3d(0,0,0)",transform:"translate3d(0,0,0)"},className:t.css(u.default.relative,u.default.flex_1,u.default.overflow_hidden,u.default.border_box)},m(e))})),w&&n.createElement("div",{style:{WebkitTransform:"translate3d(0,0,0)",msTransform:"translate3d(0,0,0)",transform:"translate3d(0,0,0)"},className:t.css(u.default.relative,u.default.flex_1,u.default.overflow_hidden,u.default.border_box)},m(v[0])))),h,b||_&&n.createElement("ul",{style:g,className:t.css(u.default.absolute,u.default.w_full,u.default.left_0,u.default.flex,u.default.justify_center,u.default.item_center,u.default.bottom_20,u.default.style_none,u.default.gap)},v.map((function(t,r){return n.createElement("li",{key:r,onClick:function(){return S(r)},style:r===C?e.__assign(e.__assign({},l),p):e.__assign(e.__assign({},s),y)})}))))}));exports.default=c;

package/dist/lib/index.d.ts

@@ -4,4 +4,5 @@ export { default as Card } from './Card';
 export { default as Container } from './Container';
 export { default as Loading } from './Loading';
 export { default as Menu } from './Menu';
+export { default as ScrollView } from './ScrollView';
 export { default as Swiper } from './Swiper';

package/dist/lib/index.js

@@ -1 +1 @@
-"use strict";var e=require("./utils.js"),r=require("./Card/Card.js"),t=require("./Container/Container.js"),i=require("./Loading/Loading.js"),u=require("./Menu/Menu.js"),a=require("./Swiper/Swiper.js");exports.utils=e.default,exports.Card=r.default,exports.Container=t.default,exports.Loading=i.default,exports.Menu=u.default,exports.Swiper=a.default;
+"use strict";var e=require("./utils.js"),r=require("./Card/Card.js"),i=require("./Container/Container.js"),t=require("./Loading/Loading.js"),u=require("./Menu/Menu.js"),s=require("./ScrollView/ScrollView.js"),a=require("./Swiper/Swiper.js");exports.utils=e.default,exports.Card=r.default,exports.Container=i.default,exports.Loading=t.default,exports.Menu=u.default,exports.ScrollView=s.default,exports.Swiper=a.default;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "rox-react-components",
-	"version": "0.0.14",
+	"version": "0.0.16",
 	"main": "dist/lib/index.js",
 	"module": "dist/es/index.js",
 	"types": "dist/index.d.ts",
@@ -20,7 +20,8 @@
 		"container with ratio",
 		"react swiper carousel pc mobile touch mouse",
 		"touch events swiper",
-		"touch events carousel"
+		"touch events carousel",
+		"scrollview reachTop reachBottom reachLeft reachRight"
 	],
 	"files": [
 		"dist",