@actbase/react-absolute - npm Package Compare versions

Comparing version 0.0.1 to 0.8.0

lib/absolute/context.d.ts

 import * as React from 'react';
-import { AbsoluteProps } from '../utils/elements';
-export declare type PropData = React.PropsWithChildren<AbsoluteProps> | undefined;
 export interface ContextArgs {
-    attach?: (id: string, props: PropData) => string;
+    attach?: (id: string, elem: React.Component | undefined) => string;
 }
 export declare const AbsoluteContext: React.Context<ContextArgs>;

lib/absolute/index.d.ts

 import React from 'react';
-import { AbsoluteProps, Props } from '../utils/elements';
-interface AbsoluteElement extends React.FC<AbsoluteProps> {
-    Provider: React.FC<Props>;
+export interface AbsoluteElement extends React.FC<any> {
+    Provider: React.FC<any>;
+    add: (elem: React.Component) => () => void;
 }
 declare const Absolute: AbsoluteElement;
 export default Absolute;

lib/absolute/index.js

 import { useContext, useEffect, useRef } from 'react';
 import { AbsoluteContext } from './context';
-import AbsoluteProvider from './provider';
+import AbsoluteProvider, { attachMethod } from './provider';
 
@@ -11,4 +11,4 @@ var Absolute = function (props) {
   useEffect(function () {
-    if (attach && props.isVisible) {
-      serial.current.ix = attach(serial.current.ix, props);
+    if (attach) {
+      serial.current.ix = attach(serial.current.ix, props.children);
       return function () {
@@ -26,6 +26,12 @@ attach(serial.current.ix, undefined);
 
-Absolute.defaultProps = {
-  isVisible: true
+Absolute.defaultProps = {};
+Absolute.Provider = AbsoluteProvider;
+
+Absolute.add = function (elem) {
+  var ix = attachMethod(undefined, elem);
+  return function () {
+    return attachMethod(ix, undefined);
+  };
 };
-Absolute.Provider = AbsoluteProvider;
+
 export default Absolute;

lib/absolute/provider.d.ts

 import * as React from 'react';
-import { Props } from '../utils/elements';
-declare const AbsoluteProvider: React.FC<Props>;
+export declare let attachMethod: any;
+declare const AbsoluteProvider: React.FC<any>;
 export default AbsoluteProvider;

lib/absolute/provider.js

 import { __assign } from "tslib";
 import * as React from 'react';
+import { useEffect } from 'react';
 import { AbsoluteContext } from './context';
-import { Container, ViewItem } from '../utils/elements';
+export var attachMethod = undefined;
 
@@ -15,3 +16,3 @@ var AbsoluteProvider = function (props) {
 
-  var attach = React.useCallback(function (_ix, props) {
+  var attach = React.useCallback(function (_ix, component) {
     var ix = _ix ? _ix : config.current.ix + 1;
@@ -21,3 +22,3 @@ setScreens(function (screens) {
 
-      return __assign(__assign({}, screens), (_a = {}, _a[String(ix)] = props, _a));
+      return __assign(__assign({}, screens), (_a = {}, _a[String(ix)] = component, _a));
     });
@@ -31,5 +32,6 @@
   }, []);
-  return React.createElement(Container, {
-    style: props.style
-  }, React.createElement(AbsoluteContext.Provider, {
+  useEffect(function () {
+    attachMethod = attach;
+  }, [attach]);
+  return React.createElement(React.Fragment, null, React.createElement(AbsoluteContext.Provider, {
     value: {
@@ -41,5 +43,3 @@ attach: attach
   }).map(function (key) {
-    return React.createElement(ViewItem, __assign({
-      key: "ab" + key
-    }, screens[key]));
+    return screens[key];
   }));
@@ -46,0 +46,0 @@ };

lib/index.js

@@ -1,1 +0,4 @@
-"use strict";
+import Lib from './absolute';
+export { default as AbsoluteProvider } from './absolute/provider';
+export var Absolute = Lib;
+export default Absolute;

package.json

 {
   "name": "@actbase/react-absolute",
-  "version": "0.0.1",
+  "version": "0.8.0",
   "description": "React or React native Absolute provider",
@@ -15,3 +15,4 @@ "main": "lib/index.js",
     "build": "npm run build:src",
-    "prepublish": "npm run build"
+    "prepublish": "npm run build",
+    "localinstall": "npm run build && cp -r ./lib ./example/rn/node_modules/@actbase/react-absolute/"
   },
@@ -18,0 +19,0 @@ "license": "ISC",

README.md

@@ -5,8 +5,18 @@ # react-absolute
 - [What is react-absolute](#what-is-react-absolute)
-- [install](#install)
-- [Getting Started / Useage](#getting-started--useage)
-  - [preconfig for using.](#preconfig-for-using)
-  - [useage](#useage)
+- [Install](#install)
+  - [Getting Started / Usage](#getting-started--usage)
+    - [Preconfig for using.](#preconfig-for-using)
 - [Interfaces & methods](#interfaces--methods)
+- [Contact us](#contact-us)
 
+![platforms](https://img.shields.io/badge/platforms-Android%20%7C%20iOS%20%7C%20web-brightgreen.svg?style=flat-square&colorB=191A17)
+[![npm](https://img.shields.io/npm/v/@actbase/react-absolute.svg?style=flat-square)](https://www.npmjs.com/package/@actbase/react-absolute)
+[![npm](https://img.shields.io/npm/dm/@actbase/react-absolute.svg?style=flat-square&colorB=007ec6)](https://www.npmjs.com/package/@actbase/react-absolute)
+
+
+[![github issues](https://img.shields.io/github/issues/actbase/react-absolute.svg?style=flat-square)](https://github.com/actbase/react-absolute/issues)
+[![github closed issues](https://img.shields.io/github/issues-closed/actbase/react-absolute.svg?style=flat-square&colorB=44cc11)](https://github.com/actbase/react-absolute/issues?q=is%3Aissue+is%3Aclosed)
+[![Issue Stats](https://img.shields.io/issuestats/i/github/actbase/react-absolute.svg?style=flat-square&colorB=44cc11)](https://github.com/actbase/react-absolute/issues)
+
+
 # What is react-absolute
@@ -19,5 +29,5 @@
 
-# install
+# Install
 
-- using npm
+- Using npm
 ``` 
@@ -27,3 +37,3 @@ npm install @actbase/react-absolute;
 
-- u sing yarn
+- Using yarn
 ```
@@ -33,5 +43,5 @@ yarn add @actbase/react-absolute;
 
-# Getting Started / Useage
+## Getting Started / Usage
 
-## preconfig for using.
+### Preconfig for using.
 - On very first entry point. index.js or app.js 
@@ -45,13 +55,12 @@ - Make sure wrapping with Absolute
   return (
-    <Absolute>
+    <Absolute.Provider style={{flex:1}}>
       {/* rendered components before. */}
-    </Absolute>
+    </Absolute.Provider>
   )
 }
 export App;
-```
+```∏
+### Usage 
 
-## useage 
-
-- using with render block
+- Using with render block
 ```
@@ -62,5 +71,5 @@ import Absolute from '@actbase/react-absolute';
   return (
-    <Absolute.Children style={{}}>
+    <Absolute style={{}} isVisible>
 
-    </Absolute.Children>
+    </Absolute>
   )
@@ -70,3 +79,3 @@ }
 
-- using with event function.
+- Using with event function.
 
@@ -77,4 +86,3 @@ ```
   const handler = Absolute.add(
-    <ToBeGlobalComponentYouHave 
-    />
+    <ToBeAboluteComponentYouHave />
   );
@@ -89,6 +97,11 @@
 
-- Methods.
+- props of Absolute.Provider
+- - Methods 
+  - add
+  - remove
 
-- add
+# Contact us
 
-blahblah
+If you consider make service with react. 
+
+Call us

No alert changes

Improved metrics

Number of lines in readme file

99

increased by15.12%

Worsened metrics

Total package byte prevSize

11911

decreased by-5.81%

Number of package files

16

decreased by-27.27%

Lines of code

144

decreased by-22.58%

No dependency changes