rox-react-components 0.0.21 → 0.0.23
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +2 -4
- package/dist/es/Menu/Menu.d.ts +2 -0
- package/dist/es/Menu/Menu.js +1 -1
- package/dist/index.d.ts +2 -0
- package/dist/lib/Menu/Menu.d.ts +2 -0
- package/dist/lib/Menu/Menu.js +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,11 +1,9 @@
|
|
|
1
|
-
# Components
|
|
1
|
+
# <strong>Components List</strong>
|
|
2
2
|
|
|
3
|
-
## Swiper [Swiper](https://stackblitz.com/edit/stackblitz-starters-fkphwj?file=src%2FApp.tsx)
|
|
3
|
+
## Swiper [Swiper](https://stackblitz.com/edit/stackblitz-starters-fkphwj?file=src%2FApp.tsx) <small><i>Swiper (suppoert <strong>PC</strong> & <strong>Mobile</strong> Platform)</i></small>
|
|
4
4
|
|
|
5
5
|
## Loading & Container [Loading & Container](https://stackblitz.com/edit/stackblitz-starters-qs4mnf?file=src%2FApp.tsx)
|
|
6
6
|
|
|
7
7
|
## ScrollView [ScrollView](https://stackblitz.com/edit/stackblitz-starters-rtdcia?file=src%2FApp.tsx)
|
|
8
8
|
|
|
9
9
|
## Card [Card](https://stackblitz.com/edit/stackblitz-starters-hjyeni?file=src%2FApp.tsx)
|
|
10
|
-
|
|
11
|
-
#### Swiper (suppoert <strong>PC</strong> & <strong>Mobile</strong> Platform)
|
package/dist/es/Menu/Menu.d.ts
CHANGED
|
@@ -23,10 +23,12 @@ interface MenuProps<T> extends IconProps {
|
|
|
23
23
|
icon?: ReactNode;
|
|
24
24
|
activeIcon?: ReactNode;
|
|
25
25
|
subStyle?: CSSProperties;
|
|
26
|
+
subStyleWithNoChildren?: CSSProperties;
|
|
26
27
|
itemStyle?: CSSProperties;
|
|
27
28
|
activeItemStyle?: CSSProperties;
|
|
28
29
|
itemClassName?: string;
|
|
29
30
|
activeItemClassName?: string;
|
|
31
|
+
itemClassNameWithNoChildren?: string;
|
|
30
32
|
}
|
|
31
33
|
declare function Menu<T extends unknown>(_props: MenuProps<T>): React.JSX.Element;
|
|
32
34
|
export default Menu;
|
package/dist/es/Menu/Menu.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{__assign as e}from"tslib";import{css as t}from"aphrodite/no-important";import n,{createContext as
|
|
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],C=i.item,g=i.index,y=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,z=k.childrenField,D=k.changeData,j=Array.isArray(C[z])&&C[z].length?C[z]:null,A=r((function(){return j?b:F===g?e(e(e({},b),x),W):e(e({},b),x)}),[b,W,x,j,F,g]),L=r((function(){return j?w:F===g?w+" "+_+" "+I:w+" "+_}),[w,I,j,F,g,_]),P=l((function(e){e.stopPropagation(),j||F===g||D({active:g,item:C}),p((function(e){return!e}))}),[j,D,C,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:A},n.createElement("div",{className:"".concat(t(u.flex_1)," ").concat(L)},y(C)),n.createElement(n.Fragment,null,j?v?N||n.createElement(h,e({},i,{down:!0})):S||n.createElement(h,e({},i)):null)),j?j.map((function(r,a){return n.createElement("div",{key:a,className:t(u.w_full,u.border_box),style:E},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};
|
package/dist/index.d.ts
CHANGED
|
@@ -90,10 +90,12 @@ interface MenuProps<T> extends IconProps {
|
|
|
90
90
|
icon?: ReactNode;
|
|
91
91
|
activeIcon?: ReactNode;
|
|
92
92
|
subStyle?: CSSProperties;
|
|
93
|
+
subStyleWithNoChildren?: CSSProperties;
|
|
93
94
|
itemStyle?: CSSProperties;
|
|
94
95
|
activeItemStyle?: CSSProperties;
|
|
95
96
|
itemClassName?: string;
|
|
96
97
|
activeItemClassName?: string;
|
|
98
|
+
itemClassNameWithNoChildren?: string;
|
|
97
99
|
}
|
|
98
100
|
declare function Menu<T extends unknown>(_props: MenuProps<T>): React.JSX.Element;
|
|
99
101
|
|
package/dist/lib/Menu/Menu.d.ts
CHANGED
|
@@ -23,10 +23,12 @@ interface MenuProps<T> extends IconProps {
|
|
|
23
23
|
icon?: ReactNode;
|
|
24
24
|
activeIcon?: ReactNode;
|
|
25
25
|
subStyle?: CSSProperties;
|
|
26
|
+
subStyleWithNoChildren?: CSSProperties;
|
|
26
27
|
itemStyle?: CSSProperties;
|
|
27
28
|
activeItemStyle?: CSSProperties;
|
|
28
29
|
itemClassName?: string;
|
|
29
30
|
activeItemClassName?: string;
|
|
31
|
+
itemClassNameWithNoChildren?: string;
|
|
30
32
|
}
|
|
31
33
|
declare function Menu<T extends unknown>(_props: MenuProps<T>): React.JSX.Element;
|
|
32
34
|
export default Menu;
|
package/dist/lib/Menu/Menu.js
CHANGED
|
@@ -1 +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"),
|
|
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"),l={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:""},r=n.createContext({active:"",item:null,childrenField:"",changeData:function(){return null}});function s(e){var a=e.iconSize,l=e.iconStrokeWidth,r=e.iconColor,s=e.down;return n.createElement("div",{style:{"--size":a,"--strokeWidth":l,"--color":r},className:"".concat(t.css(i.default.arrow_right)," ").concat(s?t.css(i.default.arrow_down):"")})}function c(l){var u=n.useState(!1),o=u[0],d=u[1],m=l.item,f=l.index,_=l.renderItem,h=l.activeIcon,g=l.icon,v=l.subStyle,C=l.subStyleWithNoChildren,p=l.itemStyle,y=l.activeItemStyle,N=l.itemClassName,S=l.activeItemClassName,x=l.itemClassNameWithNoChildren,E=n.useContext(r),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?p:b===f?e.__assign(e.__assign(e.__assign({},p),C),y):e.__assign(e.__assign({},p),C)}),[p,y,C,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({},l,{down:!0})):g||n.createElement(s,e.__assign({},l)):null)),w?w.map((function(r,s){return n.createElement("div",{key:s,className:t.css(i.default.w_full,i.default.border_box),style:v},n.createElement(a.default,{expand:o},n.createElement(c,e.__assign({},l,{index:f+"-"+s,item:r}))))})):null)}exports.default=function(t){var a=n.useMemo((function(){return e.__assign(e.__assign({},l),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(r.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}))})))};
|