@mbrain/epic-react-native-lib 0.0.7 → 0.0.9
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/dist/index.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var
|
|
1
|
+
"use strict";var se=Object.create;var T=Object.defineProperty;var ce=Object.getOwnPropertyDescriptor;var le=Object.getOwnPropertyNames;var de=Object.getPrototypeOf,me=Object.prototype.hasOwnProperty;var ue=(e,t)=>{for(var r in t)T(e,r,{get:t[r],enumerable:!0})},B=(e,t,r,o)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of le(t))!me.call(e,n)&&n!==r&&T(e,n,{get:()=>t[n],enumerable:!(o=ce(t,n))||o.enumerable});return e};var d=(e,t,r)=>(r=e!=null?se(de(e)):{},B(t||!e||!e.__esModule?T(r,"default",{value:e,enumerable:!0}):r,e)),Se=e=>B(T({},"__esModule",{value:!0}),e);var he={};ue(he,{Box1:()=>E,ScreenContent:()=>Y,createLocalStorage:()=>j,useAndroidNavigationBar:()=>F,useLogRouteChange:()=>_,useOrientation:()=>M,useThemeNativewind4:()=>oe});module.exports=Se(he);var h=d(require("react"),1),p=require("react-native");function E({style:e,children:t}){let[r,o]=(0,h.useState)(0);return h.default.createElement(p.View,{style:e},h.default.createElement(p.Text,{style:pe.text,onPress:()=>{o(n=>n+1)}},"Box1 ",r),t)}var pe=p.StyleSheet.create({text:{fontSize:20,padding:15,borderRadius:10,color:"#ffffff",backgroundColor:"#0a234a"}});var k=require("react"),y=d(require("expo-screen-orientation"),1);function M(){let[e,t]=(0,k.useState)({orientation:void 0,orientationLock:void 0});return(0,k.useEffect)(()=>{Promise.all([y.getOrientationAsync(),y.getOrientationLockAsync()]).then(([o,n])=>{t({orientation:o,orientationLock:n})});let r=y.addOrientationChangeListener(o=>{t({orientation:o.orientationInfo.orientation,orientationLock:o.orientationLock})});return()=>r.remove()},[]),e}var H=d(require("react"),1),C=require("react-native"),m=d(require("expo-navigation-bar"),1);function F(e){let t=(0,C.useColorScheme)();H.default.useEffect(()=>{if(C.Platform.OS!=="android")return;m.setStyle(t==="dark"?"dark":"light");let r=t==="dark"?e==null?void 0:e.dark:e==null?void 0:e.light;if(!r)return;(async()=>{let n=[];r.backgroundColor&&(m.setBackgroundColorAsync(r.backgroundColor),n.push(m.setBackgroundColorAsync(r.backgroundColor))),r.borderColor&&n.push(m.setBorderColorAsync(r.borderColor)),n.length&&await Promise.all(n)})()},[t,e==null?void 0:e.dark,e==null?void 0:e.light])}var $=require("react"),x=require("react-native-mmkv");function j({defaults:e,storage:t=(0,x.createMMKV)()}){let r=a=>{try{let i=t.getString(String(a));return i!==void 0?JSON.parse(i):e[a]}catch(i){return console.warn(i),e[a]}};return{useLocalStorage:a=>{let[i,l]=(0,$.useState)(()=>r(a));return(0,x.useMMKVListener)(K=>{String(a)===K&&l(r(a))},t),i},setLocalStorage:(a,i)=>{try{let l=JSON.stringify(i);t.set(String(a),l)}catch(l){console.warn(l)}},getLocalStorage:a=>r(a),removeLocalStorage:a=>{try{t.remove(String(a))}catch(i){console.warn(i)}},clearAllLocalStorage:()=>{try{t.clearAll()}catch(a){console.warn(a)}},storage:t}}var D=d(require("react"),1),I=require("expo-router"),G=d(require("lodash/isEmpty"),1);function _(){let e=(0,I.useNavigationContainerRef)();D.default.useEffect(()=>{if(__DEV__)return e.addListener("state",()=>{let r=e.getState(),o=J(r);o&&((0,G.default)(o.params)?console.log(`ROUTE CHANGED : ${o.name}`):console.log(`ROUTE CHANGED : ${o.name}`,o.params))})},[e])}function J(e){var t;if(!e)return null;if(e.routes&&e.routes.length>0){let r=(t=e.index)!=null?t:0,o=e.routes[r];if(!o)return null;if(o.state){let n=J(o.state);if(n)return n}return{name:o.name,params:o.params}}return null}var u=d(require("react"),1),S=require("react-native"),q=require("nativewind"),Q=require("react-native-safe-area-context"),X=require("react-native-keyboard-controller");var g=d(require("react"),1),b=require("react-native"),P=require("@react-navigation/elements");function V(e){return(0,g.useMemo)(()=>e?typeof e=="function"?g.default.createElement(e,null):e:null,[e])}function U(e,t){let r=(0,P.useHeaderHeight)();return(0,g.useMemo)(()=>{let o=b.StyleSheet.flatten(e),n=o==null?void 0:o.padding,c=o==null?void 0:o.paddingTop,s=typeof c=="number"?c:typeof n=="number"?n:0;return t&&(s+=r),[W.flex,e,{paddingTop:s}]},[r,t,e])}function z(e,t){let r=(0,P.useHeaderHeight)();return(0,g.useMemo)(()=>{let o=b.StyleSheet.flatten(e),n=o==null?void 0:o.padding,c=o==null?void 0:o.paddingTop,s=typeof c=="number"?c:typeof n=="number"?n:0;return t&&(s+=r),[W.scrollContentStyle,e,{paddingTop:s}]},[e,r,t])}var W=b.StyleSheet.create({flex:{flex:1},scrollContentStyle:{flexGrow:1}});var ye=u.default.memo(function({scroll:t=!1,edges:r=[],headerTransparent:o=!1,scrollViewProps:n,scrollRef:c,style:s={},contentContainerStyle:f={},backgroundStyle:a={},HeaderComponent:i,FooterComponent:l,BackgroundComponent:K,children:O}){let re=U(s,o),ne=z(f,o),ae=V(i),ie=V(l),A=V(K);return u.default.createElement(S.View,{style:[w.flex,a]},A&&u.default.createElement(S.View,{style:w.background},A),u.default.createElement(Q.SafeAreaView,{edges:r,style:w.flex},ae,t&&u.default.createElement(X.KeyboardAwareScrollView,{ref:c,enabled:!0,scrollEnabled:!0,style:[w.flex,s],contentContainerStyle:ne,bottomOffset:40,disableScrollOnKeyboardHide:!0,keyboardShouldPersistTaps:"handled",showsVerticalScrollIndicator:!1,...n},O),!t&&u.default.createElement(S.View,{style:[{overflow:"hidden"},re]},O),ie))}),w=S.StyleSheet.create({flex:{flex:1},background:{alignItems:"stretch",pointerEvents:"none",...S.StyleSheet.absoluteFill}}),Y=(0,q.cssInterop)(ye,{className:"style",contentContainerClassName:"contentContainerStyle",backgroundClassName:"backgroundStyle"});var L=d(require("react"),1),N=require("colord"),R=require("nativewind"),v=require("@react-navigation/native");function oe({themeTokens:e,themeColors:t}){let{colorScheme:r,setColorScheme:o}=(0,R.useColorScheme)(),n=r==="light"?"light":"dark",{formattedColors:c,globalStyle:s,navTheme:f}=L.default.useMemo(()=>{let a={light:Z(t.light),dark:Z(t.dark)},i={light:te("light",e,t),dark:te("dark",e,t)},l={light:ee(v.DefaultTheme,a.light),dark:ee(v.DarkTheme,a.dark)};return{formattedColors:a,globalStyle:i,navTheme:l}},[t,e]);return L.default.useMemo(()=>({theme:{...e,colors:c[n]},navTheme:f[n],globalStyle:s[n],setColorScheme:o}),[c,s,f,n,o,e])}function ge(e){let t=e.includes(" ")&&!e.startsWith("hsl")?`hsl(${e})`:e;return(0,N.colord)(t).toHex()}function Z(e){return Object.fromEntries(Object.entries(e).map(([t,r])=>[t,ge(r)]))}function ee(e,t){return{...e,colors:{background:t.background,border:t.border,card:t.card,notification:t.destructive,primary:t.primary,text:t.foreground}}}function fe(e){let{h:t,s:r,l:o}=(0,N.colord)(e).toHsl();return`${t} ${r}% ${o}%`}function te(e,t,r){return(0,R.vars)(Object.fromEntries([...Object.entries(t).map(([o,n])=>[`--${o}`,n]),...Object.entries(r[e]).map(([o,n])=>[`--${o}`,fe(n)])]))}
|
package/dist/index.mjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import x,{useState as
|
|
1
|
+
import x,{useState as F}from"react";import{View as $,Text as j,StyleSheet as D}from"react-native";function I({style:e,children:t}){let[r,o]=F(0);return x.createElement($,{style:e},x.createElement(j,{style:G.text,onPress:()=>{o(n=>n+1)}},"Box1 ",r),t)}var G=D.create({text:{fontSize:20,padding:15,borderRadius:10,color:"#ffffff",backgroundColor:"#0a234a"}});import{useEffect as _,useState as J}from"react";import*as m from"expo-screen-orientation";function U(){let[e,t]=J({orientation:void 0,orientationLock:void 0});return _(()=>{Promise.all([m.getOrientationAsync(),m.getOrientationLockAsync()]).then(([o,n])=>{t({orientation:o,orientationLock:n})});let r=m.addOrientationChangeListener(o=>{t({orientation:o.orientationInfo.orientation,orientationLock:o.orientationLock})});return()=>r.remove()},[]),e}import z from"react";import{Platform as W,useColorScheme as q}from"react-native";import*as d from"expo-navigation-bar";function Q(e){let t=q();z.useEffect(()=>{if(W.OS!=="android")return;d.setStyle(t==="dark"?"dark":"light");let r=t==="dark"?e==null?void 0:e.dark:e==null?void 0:e.light;if(!r)return;(async()=>{let n=[];r.backgroundColor&&(d.setBackgroundColorAsync(r.backgroundColor),n.push(d.setBackgroundColorAsync(r.backgroundColor))),r.borderColor&&n.push(d.setBorderColorAsync(r.borderColor)),n.length&&await Promise.all(n)})()},[t,e==null?void 0:e.dark,e==null?void 0:e.light])}import{useState as X}from"react";import{createMMKV as Y,useMMKVListener as Z}from"react-native-mmkv";function ee({defaults:e,storage:t=Y()}){let r=a=>{try{let i=t.getString(String(a));return i!==void 0?JSON.parse(i):e[a]}catch(i){return console.warn(i),e[a]}};return{useLocalStorage:a=>{let[i,l]=X(()=>r(a));return Z(g=>{String(a)===g&&l(r(a))},t),i},setLocalStorage:(a,i)=>{try{let l=JSON.stringify(i);t.set(String(a),l)}catch(l){console.warn(l)}},getLocalStorage:a=>r(a),removeLocalStorage:a=>{try{t.remove(String(a))}catch(i){console.warn(i)}},clearAllLocalStorage:()=>{try{t.clearAll()}catch(a){console.warn(a)}},storage:t}}import te from"react";import{useNavigationContainerRef as oe}from"expo-router";import re from"lodash/isEmpty";function ne(){let e=oe();te.useEffect(()=>{if(__DEV__)return e.addListener("state",()=>{let r=e.getState(),o=b(r);o&&(re(o.params)?console.log(`ROUTE CHANGED : ${o.name}`):console.log(`ROUTE CHANGED : ${o.name}`,o.params))})},[e])}function b(e){var t;if(!e)return null;if(e.routes&&e.routes.length>0){let r=(t=e.index)!=null?t:0,o=e.routes[r];if(!o)return null;if(o.state){let n=b(o.state);if(n)return n}return{name:o.name,params:o.params}}return null}import u from"react";import{StyleSheet as K,View as T}from"react-native";import{cssInterop as ie}from"nativewind";import{SafeAreaView as se}from"react-native-safe-area-context";import{KeyboardAwareScrollView as ce}from"react-native-keyboard-controller";import ae,{useMemo as f}from"react";import{StyleSheet as h}from"react-native";import{useHeaderHeight as V}from"@react-navigation/elements";function p(e){return f(()=>e?typeof e=="function"?ae.createElement(e,null):e:null,[e])}function w(e,t){let r=V();return f(()=>{let o=h.flatten(e),n=o==null?void 0:o.padding,c=o==null?void 0:o.paddingTop,s=typeof c=="number"?c:typeof n=="number"?n:0;return t&&(s+=r),[v.flex,e,{paddingTop:s}]},[r,t,e])}function R(e,t){let r=V();return f(()=>{let o=h.flatten(e),n=o==null?void 0:o.padding,c=o==null?void 0:o.paddingTop,s=typeof c=="number"?c:typeof n=="number"?n:0;return t&&(s+=r),[v.scrollContentStyle,e,{paddingTop:s}]},[e,r,t])}var v=h.create({flex:{flex:1},scrollContentStyle:{flexGrow:1}});var le=u.memo(function({scroll:t=!1,edges:r=[],headerTransparent:o=!1,scrollViewProps:n,scrollRef:c,style:s={},contentContainerStyle:S={},backgroundStyle:a={},HeaderComponent:i,FooterComponent:l,BackgroundComponent:g,children:k}){let B=w(s,o),E=R(S,o),M=p(i),H=p(l),C=p(g);return u.createElement(T,{style:[y.flex,a]},C&&u.createElement(T,{style:y.background},C),u.createElement(se,{edges:r,style:y.flex},M,t&&u.createElement(ce,{ref:c,enabled:!0,scrollEnabled:!0,style:[y.flex,s],contentContainerStyle:E,bottomOffset:40,disableScrollOnKeyboardHide:!0,keyboardShouldPersistTaps:"handled",showsVerticalScrollIndicator:!1,...n},k),!t&&u.createElement(T,{style:[{overflow:"hidden"},B]},k),H))}),y=K.create({flex:{flex:1},background:{alignItems:"stretch",pointerEvents:"none",...K.absoluteFill}}),de=ie(le,{className:"style",contentContainerClassName:"contentContainerStyle",backgroundClassName:"backgroundStyle"});import P from"react";import{colord as A}from"colord";import{useColorScheme as me,vars as ue}from"nativewind";import{DarkTheme as Se,DefaultTheme as pe}from"@react-navigation/native";function ye({themeTokens:e,themeColors:t}){let{colorScheme:r,setColorScheme:o}=me(),n=r==="light"?"light":"dark",{formattedColors:c,globalStyle:s,navTheme:S}=P.useMemo(()=>{let a={light:L(t.light),dark:L(t.dark)},i={light:O("light",e,t),dark:O("dark",e,t)},l={light:N(pe,a.light),dark:N(Se,a.dark)};return{formattedColors:a,globalStyle:i,navTheme:l}},[t,e]);return P.useMemo(()=>({theme:{...e,colors:c[n]},navTheme:S[n],globalStyle:s[n],setColorScheme:o}),[c,s,S,n,o,e])}function ge(e){let t=e.includes(" ")&&!e.startsWith("hsl")?`hsl(${e})`:e;return A(t).toHex()}function L(e){return Object.fromEntries(Object.entries(e).map(([t,r])=>[t,ge(r)]))}function N(e,t){return{...e,colors:{background:t.background,border:t.border,card:t.card,notification:t.destructive,primary:t.primary,text:t.foreground}}}function fe(e){let{h:t,s:r,l:o}=A(e).toHsl();return`${t} ${r}% ${o}%`}function O(e,t,r){return ue(Object.fromEntries([...Object.entries(t).map(([o,n])=>[`--${o}`,n]),...Object.entries(r[e]).map(([o,n])=>[`--${o}`,fe(n)])]))}export{I as Box1,de as ScreenContent,ee as createLocalStorage,Q as useAndroidNavigationBar,ne as useLogRouteChange,U as useOrientation,ye as useThemeNativewind4};
|
|
@@ -57,6 +57,7 @@ type BaseScreenContentProps = {
|
|
|
57
57
|
* Style applied to KeyboardAwareScrollView contentContainerStyle. Only used when scroll = true.
|
|
58
58
|
*/
|
|
59
59
|
contentContainerStyle?: StyleProp<ViewStyle>;
|
|
60
|
+
backgroundStyle?: StyleProp<ViewStyle>;
|
|
60
61
|
/**
|
|
61
62
|
* Optional header component.
|
|
62
63
|
*/
|
|
@@ -132,6 +133,7 @@ type BaseScreenContentProps = {
|
|
|
132
133
|
export declare const ScreenContent: React.ComponentType<BaseScreenContentProps & {
|
|
133
134
|
readonly className?: string | undefined;
|
|
134
135
|
readonly contentContainerClassName?: string | undefined;
|
|
136
|
+
readonly backgroundClassName?: string | undefined;
|
|
135
137
|
}>;
|
|
136
138
|
export type ScreenContentProps = React.ComponentProps<typeof ScreenContent>;
|
|
137
139
|
export {};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mbrain/epic-react-native-lib",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.9",
|
|
4
4
|
"description": "A set of helpful, battle-tested utilities that simplify common React Native workflows and speed up app development",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"sideEffects": false,
|
|
@@ -34,17 +34,17 @@
|
|
|
34
34
|
}
|
|
35
35
|
},
|
|
36
36
|
"dependencies": {
|
|
37
|
-
"@react-navigation/elements": "^2
|
|
38
|
-
"@react-navigation/native": "^7
|
|
39
|
-
"colord": "^2
|
|
40
|
-
"expo-navigation-bar": "^5
|
|
41
|
-
"expo-router": "^6
|
|
42
|
-
"expo-screen-orientation": "^9
|
|
43
|
-
"lodash": "^4
|
|
44
|
-
"nativewind": "^4
|
|
37
|
+
"@react-navigation/elements": "^2",
|
|
38
|
+
"@react-navigation/native": "^7",
|
|
39
|
+
"colord": "^2",
|
|
40
|
+
"expo-navigation-bar": "^5",
|
|
41
|
+
"expo-router": "^6",
|
|
42
|
+
"expo-screen-orientation": "^9",
|
|
43
|
+
"lodash": "^4",
|
|
44
|
+
"nativewind": "^4",
|
|
45
45
|
"react-native-keyboard-controller": "^1",
|
|
46
|
-
"react-native-mmkv": "^4
|
|
47
|
-
"react-native-safe-area-context": "^5
|
|
46
|
+
"react-native-mmkv": "^4",
|
|
47
|
+
"react-native-safe-area-context": "^5"
|
|
48
48
|
},
|
|
49
49
|
"peerDependencies": {
|
|
50
50
|
"react": ">=18.0.0",
|