@lofter-common-shared/react-components 0.2.0 → 0.2.2

package/dist/sync-size-space/index.js

@@ -0,0 +1,102 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SyncSizeSpace = void 0;
+var react_1 = __importStar(require("react"));
+var throttle_1 = require("@lofter-common-shared/utils/throttle");
+exports.SyncSizeSpace = (0, react_1.forwardRef)(function (_a, syncSizeSpaceRef) {
+    var className = _a.className, width = _a.width, height = _a.height;
+    var removedRef = (0, react_1.useRef)(false);
+    var resizeObserverRef = (0, react_1.useRef)(null);
+    var _b = (0, react_1.useState)({
+        width: 0,
+        height: 0,
+    }), size = _b[0], setSize = _b[1];
+    (0, react_1.useImperativeHandle)(syncSizeSpaceRef, function () {
+        var targetElement = null;
+        var resizeSize = function () {
+            if (targetElement) {
+                var boxRect = targetElement.getBoundingClientRect();
+                setSize({
+                    width: Math.round(boxRect.width),
+                    height: Math.round(boxRect.height),
+                });
+            }
+            else {
+                setSize({
+                    width: 0,
+                    height: 0,
+                });
+            }
+        };
+        return {
+            updateTargetElement: function (newTargetElement) {
+                var _a;
+                targetElement = newTargetElement;
+                (_a = resizeObserverRef.current) === null || _a === void 0 ? void 0 : _a.disconnect();
+                resizeObserverRef.current = null;
+                var ro;
+                if (targetElement) {
+                    ro = new ResizeObserver((0, throttle_1.throttle)(function (entries) {
+                        if (!removedRef.current
+                            && entries.some(function (resizeObserverEntry) { return resizeObserverEntry.target === targetElement; })) {
+                            resizeSize();
+                        }
+                    }).run);
+                    ro.observe(targetElement);
+                    resizeObserverRef.current = ro;
+                    resizeSize();
+                }
+            },
+            getTargetElement: function () {
+                return targetElement;
+            },
+            resizeSize: resizeSize,
+        };
+    }, []);
+    (0, react_1.useEffect)(function () {
+        return function () {
+            var _a;
+            removedRef.current = true;
+            (_a = resizeObserverRef.current) === null || _a === void 0 ? void 0 : _a.disconnect();
+            resizeObserverRef.current = null;
+        };
+    }, []);
+    return (react_1.default.createElement("div", { className: className, style: {
+            width: width || size.width,
+            height: height || size.height,
+        } }));
+});
+//# sourceMappingURL=index.js.map

package/dist/sync-size-space/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/sync-size-space/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAA4F;AAE5F,iEAAgE;AAcnD,QAAA,aAAa,GAAG,IAAA,kBAAU,EACrC,UAAC,EAA4B,EAAE,gBAAgB;QAA5C,SAAS,eAAA,EAAE,KAAK,WAAA,EAAE,MAAM,YAAA;IACzB,IAAM,UAAU,GAAG,IAAA,cAAM,EAAC,KAAK,CAAC,CAAC;IACjC,IAAM,iBAAiB,GAAG,IAAA,cAAM,EAAwB,IAAI,CAAC,CAAC;IACxD,IAAA,KAAkB,IAAA,gBAAQ,EAAC;QAC/B,KAAK,EAAE,CAAC;QACR,MAAM,EAAE,CAAC;KACV,CAAC,EAHK,IAAI,QAAA,EAAE,OAAO,QAGlB,CAAC;IAEH,IAAA,2BAAmB,EAAC,gBAAgB,EAAE;QACpC,IAAI,aAAa,GAAuB,IAAI,CAAC;QAC7C,IAAM,UAAU,GAAG;YACjB,IAAI,aAAa,EAAE,CAAC;gBAClB,IAAM,OAAO,GAAG,aAAa,CAAC,qBAAqB,EAAE,CAAC;gBAEtD,OAAO,CAAC;oBACN,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC;oBAChC,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC;iBACnC,CAAC,CAAC;YACL,CAAC;iBAAM,CAAC;gBACN,OAAO,CAAC;oBACN,KAAK,EAAE,CAAC;oBACR,MAAM,EAAE,CAAC;iBACV,CAAC,CAAC;YACL,CAAC;QACH,CAAC,CAAC;QAEF,OAAO;YACL,mBAAmB,YAAC,gBAAgB;;gBAClC,aAAa,GAAG,gBAAgB,CAAC;gBAEjC,MAAA,iBAAiB,CAAC,OAAO,0CAAE,UAAU,EAAE,CAAC;gBACxC,iBAAiB,CAAC,OAAO,GAAG,IAAI,CAAC;gBAEjC,IAAI,EAAkB,CAAC;gBACvB,IAAI,aAAa,EAAE,CAAC;oBAClB,EAAE,GAAG,IAAI,cAAc,CACrB,IAAA,mBAAQ,EAAyB,UAAC,OAAO;wBACvC,IACE,CAAC,UAAU,CAAC,OAAO;+BAChB,OAAO,CAAC,IAAI,CAAC,UAAC,mBAAmB,IAAK,OAAA,mBAAmB,CAAC,MAAM,KAAK,aAAa,EAA5C,CAA4C,CAAC,EACtF,CAAC;4BACD,UAAU,EAAE,CAAC;wBACf,CAAC;oBACH,CAAC,CAAC,CAAC,GAAG,CACP,CAAC;oBACF,EAAE,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;oBAC1B,iBAAiB,CAAC,OAAO,GAAG,EAAE,CAAC;oBAC/B,UAAU,EAAE,CAAC;gBACf,CAAC;YACH,CAAC;YACD,gBAAgB;gBACd,OAAO,aAAa,CAAC;YACvB,CAAC;YACD,UAAU,YAAA;SACX,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,IAAA,iBAAS,EAAC;QACR,OAAO;;YACL,UAAU,CAAC,OAAO,GAAG,IAAI,CAAC;YAC1B,MAAA,iBAAiB,CAAC,OAAO,0CAAE,UAAU,EAAE,CAAC;YACxC,iBAAiB,CAAC,OAAO,GAAG,IAAI,CAAC;QACnC,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACL,uCACE,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE;YACL,KAAK,EAAE,KAAK,IAAI,IAAI,CAAC,KAAK;YAC1B,MAAM,EAAE,MAAM,IAAI,IAAI,CAAC,MAAM;SAC9B,GACD,CACH,CAAC;AACJ,CAAC,CACF,CAAC"}

package/dist/waterfall/index.style.d.ts

@@ -1,3 +1,4 @@
+export declare const waterfallItemNewKeyFrames: string;
 declare const _default: {
     waterfallContainer: string;
     waterfallMasonry: string;
@@ -7,5 +8,4 @@ declare const _default: {
     waterfallItemPlaceholder: string;
 };
 export default _default;
-export declare const waterfallItemNewKeyFrames: string;
 //# sourceMappingURL=index.style.d.ts.map

package/dist/waterfall/index.style.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.style.d.ts","sourceRoot":"","sources":["../../src/waterfall/index.style.ts"],"names":[],"mappings":";;;;;;;;AAOA,wBAgCuB;AAEvB,eAAO,MAAM,yBAAyB,QAOpC,CAAC"}
+{"version":3,"file":"index.style.d.ts","sourceRoot":"","sources":["../../src/waterfall/index.style.ts"],"names":[],"mappings":"AAOA,eAAO,MAAM,yBAAyB,QAOpC,CAAC;;;;;;;;;AAEH,wBAgCuB"}

package/dist/waterfall/index.style.js

@@ -6,6 +6,14 @@ var theme = new css_in_js_1.Theme({
     name: 'waterfall',
     namespace: 'lofter-waterfall',
 });
+exports.waterfallItemNewKeyFrames = (0, css_in_js_1.createKeyFrames)({
+    from: {
+        opacity: 0,
+    },
+    to: {
+        opacity: 1,
+    },
+});
 exports.default = (0, css_in_js_1.createThemStyle)(theme)(function () { return ({
     waterfallContainer: {
         width: '100%',
@@ -39,12 +47,4 @@ exports.default = (0, css_in_js_1.createThemStyle)(theme)(function () { return (
         width: '100%',
     },
 }); }).createClassNames();
-exports.waterfallItemNewKeyFrames = (0, css_in_js_1.createKeyFrames)({
-    from: {
-        opacity: 0,
-    },
-    to: {
-        opacity: 1,
-    },
-});
 //# sourceMappingURL=index.style.js.map

package/dist/waterfall/index.style.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.style.js","sourceRoot":"","sources":["../../src/waterfall/index.style.ts"],"names":[],"mappings":";;;AAAA,6DAA0F;AAE1F,IAAM,KAAK,GAAG,IAAI,iBAAK,CAAC;IACtB,IAAI,EAAE,WAAW;IACjB,SAAS,EAAE,kBAAkB;CAC9B,CAAC,CAAC;AAEH,kBAAe,IAAA,2BAAe,EAAC,KAAK,CAAC,CAAC,cAAM,OAAA,CAAC;IAC3C,kBAAkB,EAAE;QAClB,KAAK,EAAE,MAAM;QACb,QAAQ,EAAE,UAAU;QACpB,OAAO,EAAE,SAAS;KACnB;IACD,gBAAgB,EAAE;QAChB,OAAO,EAAE,MAAM;QACf,KAAK,EAAE,MAAM;KACd;IACD,sBAAsB,EAAE;QACtB,IAAI,EAAE,CAAC;QACP,OAAO,EAAE,MAAM;QACf,aAAa,EAAE,QAAQ;QACvB,cAAc,EAAE,aAAa;QAC7B,YAAY,EAAE,yBAAyB;QACvC,cAAc,EAAE;YACd,YAAY,EAAE,CAAC;SAChB;KACF;IACD,aAAa,EAAE;QACb,KAAK,EAAE,MAAM;QACb,WAAW,EAAE,OAAO;QACpB,eAAe,EAAE,OAAO;QACxB,QAAQ,EAAE,UAAU;KACrB;IACD,gBAAgB,EAAE;QAChB,SAAS,EAAE,UAAG,iCAAyB,sBAAmB;KAC3D;IACD,wBAAwB,EAAE;QACxB,KAAK,EAAE,MAAM;KACd;CACF,CAAC,EAhC0C,CAgC1C,CAAC,CAAC,gBAAgB,EAAE,CAAC;AAEV,QAAA,yBAAyB,GAAG,IAAA,2BAAe,EAAC;IACvD,IAAI,EAAE;QACJ,OAAO,EAAE,CAAC;KACX;IACD,EAAE,EAAE;QACF,OAAO,EAAE,CAAC;KACX;CACF,CAAC,CAAC"}
+{"version":3,"file":"index.style.js","sourceRoot":"","sources":["../../src/waterfall/index.style.ts"],"names":[],"mappings":";;;AAAA,6DAA0F;AAE1F,IAAM,KAAK,GAAG,IAAI,iBAAK,CAAC;IACtB,IAAI,EAAE,WAAW;IACjB,SAAS,EAAE,kBAAkB;CAC9B,CAAC,CAAC;AAEU,QAAA,yBAAyB,GAAG,IAAA,2BAAe,EAAC;IACvD,IAAI,EAAE;QACJ,OAAO,EAAE,CAAC;KACX;IACD,EAAE,EAAE;QACF,OAAO,EAAE,CAAC;KACX;CACF,CAAC,CAAC;AAEH,kBAAe,IAAA,2BAAe,EAAC,KAAK,CAAC,CAAC,cAAM,OAAA,CAAC;IAC3C,kBAAkB,EAAE;QAClB,KAAK,EAAE,MAAM;QACb,QAAQ,EAAE,UAAU;QACpB,OAAO,EAAE,SAAS;KACnB;IACD,gBAAgB,EAAE;QAChB,OAAO,EAAE,MAAM;QACf,KAAK,EAAE,MAAM;KACd;IACD,sBAAsB,EAAE;QACtB,IAAI,EAAE,CAAC;QACP,OAAO,EAAE,MAAM;QACf,aAAa,EAAE,QAAQ;QACvB,cAAc,EAAE,aAAa;QAC7B,YAAY,EAAE,yBAAyB;QACvC,cAAc,EAAE;YACd,YAAY,EAAE,CAAC;SAChB;KACF;IACD,aAAa,EAAE;QACb,KAAK,EAAE,MAAM;QACb,WAAW,EAAE,OAAO;QACpB,eAAe,EAAE,OAAO;QACxB,QAAQ,EAAE,UAAU;KACrB;IACD,gBAAgB,EAAE;QAChB,SAAS,EAAE,UAAG,iCAAyB,sBAAmB;KAC3D;IACD,wBAAwB,EAAE;QACxB,KAAK,EAAE,MAAM;KACd;CACF,CAAC,EAhC0C,CAgC1C,CAAC,CAAC,gBAAgB,EAAE,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lofter-common-shared/react-components",
-  "version": "0.2.0",
+  "version": "0.2.2",
   "description": "",
   "files": [
     "dist",
@@ -10,7 +10,14 @@
   "exports": {
     "./create-render-to-body": "./dist/create-render-to-body/index.js",
     "./loading": "./dist/loading/index.js",
-    "./waterfall": "./dist/waterfall/index.js"
+    "./waterfall": "./dist/waterfall/index.js",
+    "./animation-size-view": "./dist/animation-size-view/index.js",
+    "./appear-in-viewport": "./dist/appear-in-viewport/index.js",
+    "./click-away-listener": "./dist/click-away-listener/index.js",
+    "./lazy": "./dist/lazy/index.js",
+    "./sync-size-space": "./dist/sync-size-space/index.js",
+    "./pull-down-able": "./dist/pull-down-able/index.js",
+    "./pull-down-able/container": "./dist/pull-down-able/container.js"
   },
   "publishConfig": {
     "access": "public",
@@ -25,6 +32,7 @@
   "dependencies": {
     "@lofter-common-shared/utils": "0.1.7",
     "@lofter-common-shared/css-in-js": "0.1.3",
+    "@lofter-common-shared/gesture": "0.1.0",
     "react": "^16.12.0",
     "react-dom": "^16.12.0"
   },