rox-react-components 0.0.24 → 0.0.25

package/README.md

@@ -7,3 +7,5 @@
 ## ScrollView [ScrollView Demo](https://stackblitz.com/edit/stackblitz-starters-rtdcia?file=src%2FApp.tsx)
 
 ## Card [Card Demo](https://stackblitz.com/edit/stackblitz-starters-hjyeni?file=src%2FApp.tsx)
+
+## Popup -> Designing

package/dist/es/Loading/Loading.js

@@ -1 +1 @@
-import{__extends as e,__assign as t}from"tslib";import{css as l}from"aphrodite/no-important";import o,{Component as r}from"react";import{createRoot as n}from"react-dom/client";import i from"./Inner.js";import u from"./dom.js";import a from"./styles.js";var d=function(r){function d(){var e=null!==r&&r.apply(this,arguments)||this;return e.state={},e}return e(d,r),d.show=function(e){d.el||(d.el=document.createElement("div"),u.addClass(d.el,l(a.fixed)),document.body.appendChild(d.el),n(d.el).render(o.createElement(d,t({},e,{children:null,visible:!0}))))},d.hide=function(){try{if(!d.el)return;document.body.removeChild(d.el),d.el=null}catch(e){d.el=null}},d.prototype.render=function(){var e=this.props,t=e.visible,r=e.bg,n=e.customLoading,u=e.loadingStyle,d=e.children;return o.createElement("div",{className:l(a.relative,a.w_full,a.h_full,a.border_box)},d,t?o.createElement("div",{className:l(a.absolute,a.top_0,a.left_0,a.w_full,a.h_full,a.z_99,a.center),style:{backgroundColor:r}},n||o.createElement(i,{style:u})):null)},d.getDerivedStateFromProps=function(e,t){return null},d.prototype.getSnapshotBeforeUpdate=function(e,t){return null},d.prototype.componentDidUpdate=function(e,t,l){},d.prototype.componentWillUnmount=function(){d.hide()},d.defaultProps={visible:!0,bg:"rgba(0,0,0,.7)",customLoading:null,loadingStyle:{}},d.el=null,d}(r);export{d as default};
+import{__extends as e,__assign as t}from"tslib";import{css as o}from"aphrodite/no-important";import l,{Component as n}from"react";import{createRoot as r}from"react-dom/client";import i from"./Inner.js";import d from"./dom.js";import a from"./styles.js";var u=function(n){function u(){var e=null!==n&&n.apply(this,arguments)||this;return e.state={},e}return e(u,n),u.show=function(e){u.el||(u.el=document.createElement("div"),d.addClass(u.el,o(a.fixed)),d.addClass(document.body,o(a.page_hide)),document.body.appendChild(u.el),r(u.el).render(l.createElement(u,t({},e,{children:null,visible:!0}))))},u.hide=function(){try{if(d.removeClass(document.body,o(a.page_hide)),!u.el)return;document.body.removeChild(u.el),u.el=null}catch(e){d.removeClass(document.body,o(a.page_hide)),u.el=null}},u.prototype.render=function(){var e=this.props,t=e.visible,n=e.bg,r=e.customLoading,d=e.loadingStyle,u=e.children;return l.createElement("div",{className:o(a.relative,a.w_full,a.h_full,a.border_box)},u,t?l.createElement("div",{className:o(a.absolute,a.top_0,a.left_0,a.w_full,a.h_full,a.z_99,a.center),style:{backgroundColor:n}},r||l.createElement(i,{style:d})):null)},u.getDerivedStateFromProps=function(e,t){return null},u.prototype.getSnapshotBeforeUpdate=function(e,t){return null},u.prototype.componentDidUpdate=function(e,t,o){},u.prototype.componentWillUnmount=function(){u.hide()},u.defaultProps={visible:!0,bg:"rgba(0,0,0,.7)",customLoading:null,loadingStyle:{}},u.el=null,u}(n);export{u as default};

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

@@ -11,5 +11,6 @@ declare const styles: {
     inner_box: object;
     inner_box_item: object;
     fixed: object;
+    page_hide: object;
 };
 export default styles;

package/dist/es/Loading/styles.js

@@ -1 +1 @@
-import{StyleSheet as t}from"aphrodite/no-important";var e=t.create({relative:{position:"relative"},center:{display:"flex",alignItems:"center",justifyContent:"center"},absolute:{position:"absolute"},top_0:{top:"0px"},left_0:{left:"0px"},w_full:{width:"100%"},h_full:{height:"100%"},border_box:{boxSizing:"border-box"},z_99:{zIndex:99},inner_box:{display:"flex",width:"100%",height:"100%",textAlign:"center",fontSize:"10px",alignItems:"center",justifyContent:"center"},inner_box_item:{height:"var(--height)",width:"var(--width)",margin:"var(--margin)",backgroundColor:"var(--bg)",animationName:[{"0%, 40%, 100%":{transform:"scaleY(0.4)","-webkit-transform":"scaleY(0.4)"},"20%":{transform:"scaleY(1.0)","-webkit-transform":"scaleY(1.0)"}}],animationDelay:"var(--delay)",animationDuration:"1.2s",animationIterationCount:"infinite"},fixed:{position:"fixed",display:"flex",alignItems:"center",justifyContent:"center",top:"0",left:"0",width:"100%",height:"100%",zIndex:99}});export{e as default};
+import{StyleSheet as e}from"aphrodite/no-important";var t=e.create({relative:{position:"relative"},center:{display:"flex",alignItems:"center",justifyContent:"center"},absolute:{position:"absolute"},top_0:{top:"0px"},left_0:{left:"0px"},w_full:{width:"100%"},h_full:{height:"100%"},border_box:{boxSizing:"border-box"},z_99:{zIndex:99},inner_box:{display:"flex",width:"100%",height:"100%",textAlign:"center",fontSize:"10px",alignItems:"center",justifyContent:"center"},inner_box_item:{height:"var(--height)",width:"var(--width)",margin:"var(--margin)",backgroundColor:"var(--bg)",animationName:[{"0%, 40%, 100%":{transform:"scaleY(0.4)","-webkit-transform":"scaleY(0.4)"},"20%":{transform:"scaleY(1.0)","-webkit-transform":"scaleY(1.0)"}}],animationDelay:"var(--delay)",animationDuration:"1.2s",animationIterationCount:"infinite"},fixed:{position:"fixed",display:"flex",alignItems:"center",justifyContent:"center",top:"0",left:"0",width:"100%",height:"100%",zIndex:99},page_hide:{width:"100%",height:"100%",overflow:"hidden"}});export{t as default};

package/dist/es/Menu/Menu.js

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

package/dist/es/Popup/Popup.d.ts

@@ -0,0 +1,17 @@
+import React, { PropsWithChildren } from 'react';
+import { PopupPosition, PopupType } from './type';
+declare module 'react' {
+    interface CSSProperties {
+        '--bg'?: string;
+    }
+}
+interface PopupProps extends PropsWithChildren {
+    visible?: boolean;
+    position?: PopupPosition;
+    duration?: number;
+    bg?: string;
+    maskClosable?: boolean;
+    popupType?: PopupType;
+}
+declare function PopupContainer(_props: PopupProps): React.ReactPortal | null;
+export default PopupContainer;

package/dist/es/Popup/Popup.js

@@ -0,0 +1 @@
+import{__assign as t}from"tslib";import{css as e}from"aphrodite/no-important";import r,{useRef as o,useEffect as n}from"react";import{createPortal as i}from"react-dom";import m from"./styles.js";var a={visible:!1,position:"bottom",duration:300,bg:"rgba(0,0,0,.3)",maskClosable:!0,popupType:"slide"};function c(t){var o=t.bg;return r.createElement("div",{style:{"--bg":o},className:e(m.container)})}function l(e){var m=t(t({},a),e),l=o();return n((function(){var t=document.createElement("div");return document.body.appendChild(t),function(){document.body.removeChild(t)}}),[]),l.current?i(r.createElement(c,t({},m)),l.current):null}export{l as default};

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

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

package/dist/es/Popup/index.js

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

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

@@ -0,0 +1,4 @@
+declare const styles: {
+    container: object;
+};
+export default styles;

package/dist/es/Popup/styles.js

@@ -0,0 +1 @@
+import{StyleSheet as o}from"aphrodite/no-important";var t=o.create({container:{position:"fixed",width:"100%",height:"100%",top:0,left:0,zIndex:99,backgroundColor:"var(--bg)"}});export{t as default};

package/dist/es/Popup/type.d.ts

@@ -0,0 +1,2 @@
+export type PopupPosition = 'left' | 'top' | 'right' | 'bottom' | 'center';
+export type PopupType = 'slide' | 'fade' | 'scale';

package/dist/es/index.d.ts

@@ -4,5 +4,6 @@ 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 Popup } from './Popup';
 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 ScrollView}from"./ScrollView/ScrollView.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 Popup}from"./Popup/Popup.js";export{default as ScrollView}from"./ScrollView/ScrollView.js";export{default as Swiper}from"./Swiper/Swiper.js";

package/dist/es/types.d.ts

@@ -1 +1,2 @@
+export * from './Popup/type';
 export * from './Swiper/type';

package/dist/index.d.ts

@@ -1,5 +1,8 @@
 import React, { PropsWithChildren, ReactNode, CSSProperties, FC, Component } from 'react';
 
+type PopupPosition = 'left' | 'top' | 'right' | 'bottom' | 'center';
+type PopupType = 'slide' | 'fade' | 'scale';
+
 interface SwiperProps<T> extends PropsWithChildren {
     data: T[];
     renderItem: (item: T) => ReactNode;
@@ -99,6 +102,21 @@ interface MenuProps<T> extends IconProps {
 }
 declare function Menu<T extends unknown>(_props: MenuProps<T>): React.JSX.Element;
 
+declare module 'react' {
+    interface CSSProperties {
+        '--bg'?: string;
+    }
+}
+interface PopupProps extends PropsWithChildren {
+    visible?: boolean;
+    position?: PopupPosition;
+    duration?: number;
+    bg?: string;
+    maskClosable?: boolean;
+    popupType?: PopupType;
+}
+declare function PopupContainer(_props: PopupProps): React.ReactPortal | null;
+
 interface OnScrollParameters {
     x?: number;
     y?: number;
@@ -121,4 +139,4 @@ declare module 'react' {
 }
 declare const _default: <T extends unknown>(props: SwiperProps<T> & React.RefAttributes<SwiperExposeMethods>) => React.ReactNode;
 
-export { Card, Container, Loading, Menu, ScrollView, _default as Swiper, type SwiperExposeMethods, type SwiperProps, _default$1 as utils };
+export { Card, Container, Loading, Menu, PopupContainer as Popup, type PopupPosition, type PopupType, ScrollView, _default as Swiper, type SwiperExposeMethods, type SwiperProps, _default$1 as utils };

package/dist/lib/Loading/Loading.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("tslib"),t=require("aphrodite/no-important"),l=require("react"),r=require("react-dom/client"),n=require("./Inner.js"),u=require("./dom.js"),o=require("./styles.js"),a=function(a){function d(){var e=null!==a&&a.apply(this,arguments)||this;return e.state={},e}return e.__extends(d,a),d.show=function(n){d.el||(d.el=document.createElement("div"),u.default.addClass(d.el,t.css(o.default.fixed)),document.body.appendChild(d.el),r.createRoot(d.el).render(l.createElement(d,e.__assign({},n,{children:null,visible:!0}))))},d.hide=function(){try{if(!d.el)return;document.body.removeChild(d.el),d.el=null}catch(e){d.el=null}},d.prototype.render=function(){var e=this.props,r=e.visible,u=e.bg,a=e.customLoading,d=e.loadingStyle,i=e.children;return l.createElement("div",{className:t.css(o.default.relative,o.default.w_full,o.default.h_full,o.default.border_box)},i,r?l.createElement("div",{className:t.css(o.default.absolute,o.default.top_0,o.default.left_0,o.default.w_full,o.default.h_full,o.default.z_99,o.default.center),style:{backgroundColor:u}},a||l.createElement(n.default,{style:d})):null)},d.getDerivedStateFromProps=function(e,t){return null},d.prototype.getSnapshotBeforeUpdate=function(e,t){return null},d.prototype.componentDidUpdate=function(e,t,l){},d.prototype.componentWillUnmount=function(){d.hide()},d.defaultProps={visible:!0,bg:"rgba(0,0,0,.7)",customLoading:null,loadingStyle:{}},d.el=null,d}(l.Component);exports.default=a;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("tslib"),t=require("aphrodite/no-important"),l=require("react"),n=require("react-dom/client"),r=require("./Inner.js"),u=require("./dom.js"),d=require("./styles.js"),o=function(o){function a(){var e=null!==o&&o.apply(this,arguments)||this;return e.state={},e}return e.__extends(a,o),a.show=function(r){a.el||(a.el=document.createElement("div"),u.default.addClass(a.el,t.css(d.default.fixed)),u.default.addClass(document.body,t.css(d.default.page_hide)),document.body.appendChild(a.el),n.createRoot(a.el).render(l.createElement(a,e.__assign({},r,{children:null,visible:!0}))))},a.hide=function(){try{if(u.default.removeClass(document.body,t.css(d.default.page_hide)),!a.el)return;document.body.removeChild(a.el),a.el=null}catch(e){u.default.removeClass(document.body,t.css(d.default.page_hide)),a.el=null}},a.prototype.render=function(){var e=this.props,n=e.visible,u=e.bg,o=e.customLoading,a=e.loadingStyle,s=e.children;return l.createElement("div",{className:t.css(d.default.relative,d.default.w_full,d.default.h_full,d.default.border_box)},s,n?l.createElement("div",{className:t.css(d.default.absolute,d.default.top_0,d.default.left_0,d.default.w_full,d.default.h_full,d.default.z_99,d.default.center),style:{backgroundColor:u}},o||l.createElement(r.default,{style:a})):null)},a.getDerivedStateFromProps=function(e,t){return null},a.prototype.getSnapshotBeforeUpdate=function(e,t){return null},a.prototype.componentDidUpdate=function(e,t,l){},a.prototype.componentWillUnmount=function(){a.hide()},a.defaultProps={visible:!0,bg:"rgba(0,0,0,.7)",customLoading:null,loadingStyle:{}},a.el=null,a}(l.Component);exports.default=o;

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

@@ -11,5 +11,6 @@ declare const styles: {
     inner_box: object;
     inner_box_item: object;
     fixed: object;
+    page_hide: object;
 };
 export default styles;

package/dist/lib/Loading/styles.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("aphrodite/no-important").StyleSheet.create({relative:{position:"relative"},center:{display:"flex",alignItems:"center",justifyContent:"center"},absolute:{position:"absolute"},top_0:{top:"0px"},left_0:{left:"0px"},w_full:{width:"100%"},h_full:{height:"100%"},border_box:{boxSizing:"border-box"},z_99:{zIndex:99},inner_box:{display:"flex",width:"100%",height:"100%",textAlign:"center",fontSize:"10px",alignItems:"center",justifyContent:"center"},inner_box_item:{height:"var(--height)",width:"var(--width)",margin:"var(--margin)",backgroundColor:"var(--bg)",animationName:[{"0%, 40%, 100%":{transform:"scaleY(0.4)","-webkit-transform":"scaleY(0.4)"},"20%":{transform:"scaleY(1.0)","-webkit-transform":"scaleY(1.0)"}}],animationDelay:"var(--delay)",animationDuration:"1.2s",animationIterationCount:"infinite"},fixed:{position:"fixed",display:"flex",alignItems:"center",justifyContent:"center",top:"0",left:"0",width:"100%",height:"100%",zIndex:99}});exports.default=e;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("aphrodite/no-important").StyleSheet.create({relative:{position:"relative"},center:{display:"flex",alignItems:"center",justifyContent:"center"},absolute:{position:"absolute"},top_0:{top:"0px"},left_0:{left:"0px"},w_full:{width:"100%"},h_full:{height:"100%"},border_box:{boxSizing:"border-box"},z_99:{zIndex:99},inner_box:{display:"flex",width:"100%",height:"100%",textAlign:"center",fontSize:"10px",alignItems:"center",justifyContent:"center"},inner_box_item:{height:"var(--height)",width:"var(--width)",margin:"var(--margin)",backgroundColor:"var(--bg)",animationName:[{"0%, 40%, 100%":{transform:"scaleY(0.4)","-webkit-transform":"scaleY(0.4)"},"20%":{transform:"scaleY(1.0)","-webkit-transform":"scaleY(1.0)"}}],animationDelay:"var(--delay)",animationDuration:"1.2s",animationIterationCount:"infinite"},fixed:{position:"fixed",display:"flex",alignItems:"center",justifyContent:"center",top:"0",left:"0",width:"100%",height:"100%",zIndex:99},page_hide:{width:"100%",height:"100%",overflow:"hidden"}});exports.default=e;

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"),i=require("./styles.js"),r={data:[],renderItem:function(){return null},onChange:function(){return null},active:"",childrenField:"children",iconSize:"10px",iconColor:"#333",iconStrokeWidth:"2px",subStyle:{paddingLeft:"25px"},subStyleWithNoChildren:{paddingLeft:"0"},itemStyle:{},activeItemStyle:{},itemClassName:"",activeItemClassName:"",itemClassNameWithNoChildren:""},l=n.createContext({active:"",item:null,childrenField:"",changeData:function(){return null}});function s(e){var a=e.iconSize,r=e.iconStrokeWidth,l=e.iconColor,s=e.down;return n.createElement("div",{style:{"--size":a,"--strokeWidth":r,"--color":l},className:"".concat(t.css(i.default.arrow_right)," ").concat(s?t.css(i.default.arrow_down):"")})}function c(r){var u=n.useState(!1),o=u[0],d=u[1],m=r.item,f=r.index,_=r.renderItem,h=r.activeIcon,g=r.icon,v=r.subStyle,C=r.subStyleWithNoChildren,y=r.itemStyle,p=r.activeItemStyle,N=r.itemClassName,S=r.activeItemClassName,x=r.itemClassNameWithNoChildren,E=n.useContext(l),b=E.active,k=E.childrenField,W=E.changeData,w=Array.isArray(m[k])&&m[k].length?m[k]:null,I=n.useMemo((function(){return w?y:b===f?e.__assign(e.__assign({},y),p):e.__assign({},y)}),[y,p,w,b,f]),F=n.useMemo((function(){return w?N:b===f?N+" "+x+" "+S:N+" "+x}),[N,S,w,b,f,x]),q=n.useCallback((function(e){e.stopPropagation(),w||b===f||W({active:f,item:m}),d((function(e){return!e}))}),[w,W,m,f]);return n.useEffect((function(){if(void 0!==b){var e=b.split("-"),t=f.split("-");b.startsWith(f)&&e.length>t.length&&f.length<b.length&&d(!0)}}),[b,f]),n.createElement("div",{className:t.css(i.default.w_full,i.default.border_box),onClick:q},n.createElement("div",{className:t.css(i.default.item),style:I},n.createElement("div",{className:"".concat(t.css(i.default.flex_1)," ").concat(F)},_(m)),n.createElement(n.Fragment,null,w?o?h||n.createElement(s,e.__assign({},r,{down:!0})):g||n.createElement(s,e.__assign({},r)):null)),w?w.map((function(l,s){var u=Array.isArray(l[k])&&l[k].length;return n.createElement("div",{key:s,className:t.css(i.default.w_full,i.default.border_box),style:e.__assign(e.__assign({},v),u?{}:C)},n.createElement(a.default,{expand:o},n.createElement(c,e.__assign({},r,{index:f+"-"+s,item:l}))))})):null)}exports.default=function(t){var a=n.useMemo((function(){return e.__assign(e.__assign({},r),t)}),[t]),i=n.useState({active:"",item:null}),s=i[0],u=i[1],o=n.useCallback((function(t){return u((function(n){return e.__assign(e.__assign({},n),t)}))}),[]);return n.useEffect((function(){var e;null===(e=a.onChange)||void 0===e||e.call(a,s)}),[s.active]),n.createElement(l.Provider,{value:{active:s.active,item:s.item,childrenField:a.childrenField,changeData:o}},a.data.map((function(t,i){return n.createElement(c,e.__assign({key:i},a,{index:i.toString(),item:t}))})))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("tslib"),t=require("aphrodite/no-important"),n=require("react"),i=require("../Card/Card.js"),a=require("./styles.js"),r={data:[],renderItem:function(){return null},onChange:function(){return null},active:"",childrenField:"children",iconSize:"10px",iconColor:"#333",iconStrokeWidth:"2px",subStyle:{paddingLeft:"25px"},subStyleWithNoChildren:{paddingLeft:"0"},itemStyle:{},activeItemStyle:{},itemClassName:"",activeItemClassName:"",itemClassNameWithNoChildren:""},l=n.createContext({active:"",item:null,childrenField:"",changeData:function(){return null}});function c(e){var i=e.iconSize,r=e.iconStrokeWidth,l=e.iconColor,c=e.down;return n.createElement("div",{style:{"--size":i,"--strokeWidth":r,"--color":l},className:"".concat(t.css(a.default.arrow_right)," ").concat(c?t.css(a.default.arrow_down):"")})}function s(r){var u=n.useState(!1),o=u[0],d=u[1],m=r.item,f=r.index,v=r.renderItem,h=r.activeIcon,_=r.icon,g=r.subStyle,C=r.subStyleWithNoChildren,y=r.itemStyle,p=r.activeItemStyle,E=r.itemClassName,N=r.activeItemClassName,S=r.itemClassNameWithNoChildren,x=n.useContext(l),b=x.active,F=x.childrenField,k=x.changeData,W=Array.isArray(m[F])&&m[F].length?m[F]:null,w=n.useMemo((function(){return W?y:b===f?e.__assign(e.__assign({},y),p):e.__assign({},y)}),[y,p,W,b,f]),I=n.useMemo((function(){return W?E:b===f?E+" "+S+" "+N:E+" "+S}),[E,N,W,b,f,S]),q=n.useCallback((function(e){e.stopPropagation(),W||b===f||k({active:f,item:m}),d((function(e){return!e}))}),[W,k,m,f]);return n.useEffect((function(){if(void 0!==b){var e=b.split("-"),t=f.split("-");b.startsWith(f)&&e.length>t.length&&f.length<b.length&&d(!0)}}),[b,f]),n.createElement("div",{className:t.css(a.default.w_full,a.default.border_box),onClick:q},n.createElement("div",{className:t.css(a.default.item),style:w},n.createElement("div",{className:"".concat(t.css(a.default.flex_1)," ").concat(I)},v(m)),n.createElement(n.Fragment,null,W?o?h||n.createElement(c,e.__assign({},r,{down:!0})):_||n.createElement(c,e.__assign({},r)):null)),W?W.map((function(l,c){var u=Array.isArray(l[F])&&l[F].length;return n.createElement("div",{key:c,className:t.css(a.default.w_full,a.default.border_box),style:e.__assign(e.__assign({},g),u?{}:C)},n.createElement(i.default,{expand:o},n.createElement(s,e.__assign({},r,{index:f+"-"+c,item:l}))))})):null)}exports.default=function(t){var i=n.useMemo((function(){return e.__assign(e.__assign({},r),t)}),[t]),a=n.useState({active:i.active,item:null}),c=a[0],u=a[1],o=n.useCallback((function(t){return u((function(n){return e.__assign(e.__assign({},n),t)}))}),[]);return n.useEffect((function(){if(i.active&&i.data&&i.data.length&&i.childrenField){var e=function e(t,n,a){if(void 0===a&&(a=null),!t.length)return a;var r=n[+t.shift()];return e(t,r[i.childrenField],r)}(i.active.split("-"),i.data);o({active:i.active,item:e})}}),[i.active,i.data,i.childrenField]),n.useEffect((function(){var e;null===(e=i.onChange)||void 0===e||e.call(i,c)}),[c.active]),n.createElement(l.Provider,{value:{active:c.active,item:c.item,childrenField:i.childrenField,changeData:o}},i.data.map((function(t,a){return n.createElement(s,e.__assign({key:a},i,{index:a.toString(),item:t}))})))};

package/dist/lib/Popup/Popup.d.ts

@@ -0,0 +1,17 @@
+import React, { PropsWithChildren } from 'react';
+import { PopupPosition, PopupType } from './type';
+declare module 'react' {
+    interface CSSProperties {
+        '--bg'?: string;
+    }
+}
+interface PopupProps extends PropsWithChildren {
+    visible?: boolean;
+    position?: PopupPosition;
+    duration?: number;
+    bg?: string;
+    maskClosable?: boolean;
+    popupType?: PopupType;
+}
+declare function PopupContainer(_props: PopupProps): React.ReactPortal | null;
+export default PopupContainer;

package/dist/lib/Popup/Popup.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("react-dom"),i=require("./styles.js"),a={visible:!1,position:"bottom",duration:300,bg:"rgba(0,0,0,.3)",maskClosable:!0,popupType:"slide"};function o(e){var n=e.bg;return t.createElement("div",{style:{"--bg":n},className:r.css(i.default.container)})}exports.default=function(r){var i=e.__assign(e.__assign({},a),r),s=t.useRef();return t.useEffect((function(){var e=document.createElement("div");return document.body.appendChild(e),function(){document.body.removeChild(e)}}),[]),s.current?n.createPortal(t.createElement(o,e.__assign({},i)),s.current):null};

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

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

package/dist/lib/Popup/index.js

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

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

@@ -0,0 +1,4 @@
+declare const styles: {
+    container: object;
+};
+export default styles;

package/dist/lib/Popup/styles.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("aphrodite/no-important").StyleSheet.create({container:{position:"fixed",width:"100%",height:"100%",top:0,left:0,zIndex:99,backgroundColor:"var(--bg)"}});exports.default=e;

package/dist/lib/Popup/type.d.ts

@@ -0,0 +1,2 @@
+export type PopupPosition = 'left' | 'top' | 'right' | 'bottom' | 'center';
+export type PopupType = 'slide' | 'fade' | 'scale';

package/dist/lib/index.d.ts

@@ -4,5 +4,6 @@ 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 Popup } from './Popup';
 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"),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;
+"use strict";var e=require("./utils.js"),r=require("./Card/Card.js"),u=require("./Container/Container.js"),i=require("./Loading/Loading.js"),t=require("./Menu/Menu.js"),o=require("./Popup/Popup.js"),s=require("./ScrollView/ScrollView.js"),a=require("./Swiper/Swiper.js");exports.utils=e.default,exports.Card=r.default,exports.Container=u.default,exports.Loading=i.default,exports.Menu=t.default,exports.Popup=o.default,exports.ScrollView=s.default,exports.Swiper=a.default;

package/dist/lib/types.d.ts

@@ -1 +1,2 @@
+export * from './Popup/type';
 export * from './Swiper/type';

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "rox-react-components",
-	"version": "0.0.24",
+	"version": "0.0.25",
 	"main": "dist/lib/index.js",
 	"module": "dist/es/index.js",
 	"types": "dist/index.d.ts",