@arcblock/react-hooks 2.13.70 → 3.0.0

package/lib/index.js

@@ -1,4 +1,10 @@
-export { default as useInterval } from "./useInterval.js";
-export { default as useStorage } from "./useStorage.js";
-export { default as useBrowser } from "./useBrowser.js";
-export { default as useLineClamp } from "./useLineClamp.js";
+import { default as a } from "./useInterval.js";
+import { default as t } from "./useStorage.js";
+import { default as f } from "./useBrowser.js";
+import { default as l } from "./useLineClamp.js";
+export {
+  f as useBrowser,
+  a as useInterval,
+  l as useLineClamp,
+  t as useStorage
+};

package/lib/useBrowser.js

@@ -1,63 +1,60 @@
-import { useState } from 'react';
-import isMobile from 'ismobilejs';
-
-const DID_WALLET_TAG = 'ABTWallet';
-const ARC_SPHERE_TAG = 'ArcSphere';
-
-function getUaVersion(userAgent, tag) {
-  const reg = new RegExp(`${tag}/(?<version>[0-9.]+)`, 'g');
-  const result = reg.exec(userAgent);
-  const version = result?.groups?.version;
-  return version;
+import { useState as f } from "react";
+import i from "ismobilejs";
+const n = "ABTWallet", r = "ArcSphere";
+function t(e, s) {
+  var l;
+  const o = new RegExp(`${s}/(?<version>[0-9.]+)`, "g").exec(e);
+  return (l = o == null ? void 0 : o.groups) == null ? void 0 : l.version;
 }
-
-export default function useBrowser() {
-  const userAgent = window?.navigator?.userAgent;
-  const [browser] = useState({
+function b() {
+  var a;
+  const e = (a = window == null ? void 0 : window.navigator) == null ? void 0 : a.userAgent, [s] = f({
     // FIXME: @zhanghan 待应用中相关代码兼容 arcSphere 的判断后，才能移除 arcSphere 的判断
     // https://github.com/search?q=org%3AArcBlock%20browser.wallet&type=code
     // https://github.com/search?q=org%3Ablocklet+browser.wallet&type=code
-    wallet: userAgent.indexOf(DID_WALLET_TAG) > -1 || userAgent.indexOf(ARC_SPHERE_TAG) > -1,
-    walletVersion: getUaVersion(userAgent, DID_WALLET_TAG),
-    arcSphere: userAgent.indexOf(ARC_SPHERE_TAG) > -1,
-    arcSphereVersion: getUaVersion(userAgent, ARC_SPHERE_TAG),
-    wechat: /MicroMessenger/i.test(userAgent),
+    wallet: e.indexOf(n) > -1 || e.indexOf(r) > -1,
+    walletVersion: t(e, n),
+    arcSphere: e.indexOf(r) > -1,
+    arcSphereVersion: t(e, r),
+    wechat: /MicroMessenger/i.test(e),
     mobile: {
       apple: {
-        phone: false,
-        ipod: false,
-        tablet: false,
-        device: false,
+        phone: !1,
+        ipod: !1,
+        tablet: !1,
+        device: !1
       },
       amazon: {
-        phone: false,
-        tablet: false,
-        device: false,
+        phone: !1,
+        tablet: !1,
+        device: !1
       },
       android: {
-        phone: false,
-        tablet: false,
-        device: false,
+        phone: !1,
+        tablet: !1,
+        device: !1
       },
       windows: {
-        phone: false,
-        tablet: false,
-        device: false,
+        phone: !1,
+        tablet: !1,
+        device: !1
       },
       other: {
-        blackberry: false,
-        blackberry10: false,
-        opera: false,
-        firefox: false,
-        chrome: false,
-        device: false,
+        blackberry: !1,
+        blackberry10: !1,
+        opera: !1,
+        firefox: !1,
+        chrome: !1,
+        device: !1
       },
-      phone: false,
-      tablet: false,
-      any: false,
-      ...isMobile(userAgent),
-    },
+      phone: !1,
+      tablet: !1,
+      any: !1,
+      ...i(e)
+    }
   });
-
-  return browser;
+  return s;
 }
+export {
+  b as default
+};

package/lib/useInterval.js

@@ -1,22 +1,18 @@
-/* eslint-disable consistent-return */
-import { useEffect, useRef } from 'react';
-
-export default function useInterval(callback, delay) {
-  const savedCallback = useRef();
-
-  // Remember the latest callback.
-  useEffect(() => {
-    savedCallback.current = callback;
-  }, [callback]);
-
-  // Set up the interval.
-  useEffect(() => {
-    function tick() {
-      savedCallback.current();
+import { useRef as f, useEffect as r } from "react";
+function o(e, t) {
+  const n = f();
+  r(() => {
+    n.current = e;
+  }, [e]), r(() => {
+    function u() {
+      n.current();
     }
-    if (delay !== null) {
-      const id = setInterval(tick, delay);
-      return () => clearInterval(id);
+    if (t !== null) {
+      const c = setInterval(u, t);
+      return () => clearInterval(c);
     }
-  }, [delay]);
+  }, [t]);
 }
+export {
+  o as default
+};

package/lib/useLineClamp.js

@@ -1,127 +1,95 @@
-import { useDebounceFn, useMemoizedFn, useMount, useReactive, useUpdateEffect } from "ahooks";
-import { useRef } from "react";
-const defaultEllipsis = "\u2026";
-let keyCount = 0;
-const getNewKey = () => `__clamp_text_key__${keyCount++}`;
-export default function useLineClamp({
-  text,
-  ellipsis = defaultEllipsis,
-  lines = 3,
-  expanded = false,
-  debounceTime = 300,
-  charWidth = 1.2,
-  offset = 1
+import { useReactive as z, useMemoizedFn as w, useDebounceFn as E, useMount as N, useUpdateEffect as F } from "ahooks";
+import { useRef as k } from "react";
+const B = "…";
+let D = 0;
+const f = () => `__clamp_text_key__${D++}`;
+function $({
+  text: o,
+  ellipsis: c = B,
+  lines: i = 3,
+  expanded: l = !1,
+  debounceTime: T = 300,
+  charWidth: u = 1.2,
+  offset: L = 1
 }) {
-  const currentState = useReactive({
-    needClamp: true,
-    noClamp: false,
-    clampedText: "\u2026",
-    key: getNewKey()
-  });
-  const textRef = useRef();
-  const buttonRef = useRef();
-  const lineHeightRef = useRef(0);
-  const clampLines = useMemoizedFn(({ lineHeight, originalText, expanded: expanded2, ellipsis: ellipsis2, lines: lines2 }) => {
-    if (!textRef.current) {
+  const e = z({
+    needClamp: !0,
+    noClamp: !1,
+    clampedText: "…",
+    key: f()
+  }), a = k(void 0), H = k(void 0), m = k(0), p = w(({ lineHeight: s, originalText: t, expanded: _, ellipsis: g, lines: x }) => {
+    if (!a.current)
       return;
-    }
-    const node = textRef.current;
-    const button = buttonRef.current;
-    if (!originalText || expanded2) {
-      currentState.noClamp = true;
-      currentState.clampedText = originalText;
-      currentState.key = getNewKey();
+    const n = a.current, d = H.current;
+    if (!t || _) {
+      e.noClamp = !0, e.clampedText = t, e.key = f();
       return;
     }
-    const maxHeight = lineHeight * lines2 + 1;
-    let start = 0;
-    let middle = 0;
-    let end = originalText.length;
-    if (!node.clientHeight) {
+    const M = s * x + 1;
+    let h = 0, r = 0, y = t.length;
+    if (!n.clientHeight)
       return;
+    function b() {
+      ((n == null ? void 0 : n.getBoundingClientRect().height) ?? 1) <= M ? h = r + 1 : y = r - 1;
     }
-    function moveMarkers() {
-      const clientHeight = node?.getBoundingClientRect().height ?? 1;
-      if (clientHeight <= maxHeight) {
-        start = middle + 1;
-      } else {
-        end = middle - 1;
-      }
-    }
-    while (start <= end) {
-      middle = Math.floor((start + end) / 2);
-      node.innerText = originalText.slice(0, middle) + ellipsis2;
-      if (button) {
-        node.appendChild(button.cloneNode(true));
-      }
-      if (middle === originalText.length) {
-        currentState.needClamp = false;
-        currentState.noClamp = true;
-        currentState.clampedText = originalText;
-        currentState.key = getNewKey();
+    for (; h <= y; ) {
+      if (r = Math.floor((h + y) / 2), n.innerText = t.slice(0, r) + g, d && n.appendChild(d.cloneNode(!0)), r === t.length) {
+        e.needClamp = !1, e.noClamp = !0, e.clampedText = t, e.key = f();
         return;
       }
-      moveMarkers();
+      b();
     }
-    const clampedText = originalText.slice(0, Math.max(middle - offset, 0)).trim() + (typeof ellipsis2 === "string" ? ellipsis2 : "");
-    node.innerText = clampedText;
-    if (button)
-      node.appendChild(button.cloneNode(true));
-    currentState.needClamp = true;
-    currentState.noClamp = false;
-    currentState.clampedText = clampedText;
-    currentState.key = getNewKey();
-  });
-  const { run: debouncedClampLines } = useDebounceFn(clampLines, {
-    wait: debounceTime
-  });
-  const resizeListener = useMemoizedFn(() => {
-    debouncedClampLines({
-      lineHeight: lineHeightRef.current,
-      originalText: text,
-      expanded,
-      ellipsis,
-      lines,
-      charWidth
+    const v = t.slice(0, Math.max(r - L, 0)).trim() + (typeof g == "string" ? g : "");
+    n.innerText = v, d && n.appendChild(d.cloneNode(!0)), e.needClamp = !0, e.noClamp = !1, e.clampedText = v, e.key = f();
+  }), { run: R } = E(p, {
+    wait: T
+  }), C = w(() => {
+    R({
+      lineHeight: m.current,
+      originalText: o,
+      expanded: l,
+      ellipsis: c,
+      lines: i,
+      charWidth: u
     });
   });
-  useMount(() => {
-    if (text && !lineHeightRef.current) {
-      const lineHeight = (textRef.current?.clientHeight ?? 1) + 1;
-      lineHeightRef.current = lineHeight;
-      setTimeout(() => {
-        clampLines({
-          lineHeight,
-          originalText: text,
-          expanded,
-          ellipsis,
-          lines,
-          charWidth
+  return N(() => {
+    var s;
+    if (o && !m.current) {
+      const t = (((s = a.current) == null ? void 0 : s.clientHeight) ?? 1) + 1;
+      m.current = t, setTimeout(() => {
+        p({
+          lineHeight: t,
+          originalText: o,
+          expanded: l,
+          ellipsis: c,
+          lines: i,
+          charWidth: u
         });
       });
     }
-    window.addEventListener("resize", resizeListener);
-    return () => {
-      window.removeEventListener("resize", resizeListener);
+    return window.addEventListener("resize", C), () => {
+      window.removeEventListener("resize", C);
     };
-  });
-  useUpdateEffect(() => {
-    clampLines({
-      lineHeight: lineHeightRef.current,
-      originalText: text,
-      expanded,
-      ellipsis,
-      lines,
-      charWidth
+  }), F(() => {
+    p({
+      lineHeight: m.current,
+      originalText: o,
+      expanded: l,
+      ellipsis: c,
+      lines: i,
+      charWidth: u
     });
-  }, [expanded, text, charWidth, ellipsis, lines]);
-  return {
-    textRef,
-    buttonRef,
-    needClamp: currentState.needClamp,
-    noClamp: currentState.noClamp,
-    clampedText: currentState.clampedText,
-    key: currentState.key,
-    run: resizeListener
+  }, [l, o, u, c, i]), {
+    textRef: a,
+    buttonRef: H,
+    needClamp: e.needClamp,
+    noClamp: e.noClamp,
+    clampedText: e.clampedText,
+    key: e.key,
+    run: C
   };
 }
+export {
+  $ as default
+};

package/lib/useStorage.js

@@ -1,39 +1,22 @@
-/* eslint-disable react-hooks/rules-of-hooks */
-import { useState, useEffect } from 'react';
-import { EventTarget } from 'event-target-shim';
-
-const evtTarget = new EventTarget();
-export default function useStorage(storage, keyPrefix) {
-  return (key, defaultValue) => {
-    const storeKey = `${keyPrefix}.${key}`;
-    const raw = storage.getItem(storeKey);
-    const [value, setValue] = useState(raw ? JSON.parse(raw) : defaultValue);
-
-    const updater = (updatedValue) => {
-      setValue(updatedValue);
-      storage.setItem(storeKey, JSON.stringify(updatedValue));
-      evtTarget.dispatchEvent(new CustomEvent('storage_change', { detail: { key } }));
+import { useState as u, useEffect as p } from "react";
+import { EventTarget as E } from "event-target-shim";
+const a = new E();
+function w(n, m) {
+  return (r, s) => {
+    const o = `${m}.${r}`, t = n.getItem(o), [f, c] = u(t ? JSON.parse(t) : s), i = (e) => {
+      c(e), n.setItem(o, JSON.stringify(e)), a.dispatchEvent(new CustomEvent("storage_change", { detail: { key: r } }));
     };
-
-    if (defaultValue != null && !raw) {
-      updater(defaultValue);
-    }
-
-    useEffect(() => {
-      const listener = ({ detail }) => {
-        if (detail.key === key) {
-          const _raw = storage.getItem(storeKey);
-
-          if (_raw !== raw) {
-            setValue(JSON.parse(_raw));
-          }
+    return s != null && !t && i(s), p(() => {
+      const e = ({ detail: v }) => {
+        if (v.key === r) {
+          const g = n.getItem(o);
+          g !== t && c(JSON.parse(g));
         }
       };
-
-      evtTarget.addEventListener('storage_change', listener);
-      return () => evtTarget.removeEventListener('storage_change', listener);
-    });
-
-    return [value, updater];
+      return a.addEventListener("storage_change", e), () => a.removeEventListener("storage_change", e);
+    }), [f, i];
   };
 }
+export {
+  w as default
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@arcblock/react-hooks",
-  "version": "2.13.70",
+  "version": "3.0.0",
   "description": "React hooks used by arcblock products",
   "keywords": [
     "react",
@@ -18,8 +18,8 @@
   "scripts": {
     "lint": "eslint src tests --ext js --ext jsx",
     "lint:fix": "npm run lint -- --fix",
-    "build": "unbuild",
-    "watch": "CONSOLA_LEVEL=1 nodemon -e .jsx,.js,.ts,.tsx -w src -x 'unbuild'",
+    "build": "vite build",
+    "watch": "vite build --watch",
     "precommit": "CI=1 npm run lint",
     "prepush": "CI=1 npm run lint",
     "prepublish": "npm run build",
@@ -30,7 +30,6 @@
     "url": "https://github.com/ArcBlock/ux/issues"
   },
   "dependencies": {
-    "core-js": "^3.25.5",
     "event-target-shim": "^5.0.1",
     "ismobilejs": "^1.1.1"
   },
@@ -38,13 +37,8 @@
     "access": "public"
   },
   "devDependencies": {
-    "@babel/cli": "^7.19.3",
-    "@babel/core": "^7.19.3",
-    "@babel/preset-env": "^7.19.3",
-    "@babel/preset-react": "^7.18.6",
-    "eslint-plugin-react-hooks": "^4.6.0",
-    "jest": "^29.7.0",
-    "unbuild": "^2.0.0"
+    "eslint-plugin-react-hooks": "^4.6.2",
+    "jest": "^29.7.0"
   },
-  "gitHead": "b38a83a2c7d9a22e90bab369d8f61340db2abbd0"
+  "gitHead": "b001c32ca85d40d8a0784ca581bfd54d90550b24"
 }

package/src/useLineClamp.ts

@@ -34,8 +34,8 @@ export default function useLineClamp({
     key: getNewKey(),
   });
 
-  const textRef = useRef<HTMLElement | null>();
-  const buttonRef = useRef<HTMLElement | null>();
+  const textRef = useRef<HTMLElement | null>(undefined);
+  const buttonRef = useRef<HTMLElement | null>(undefined);
   const lineHeightRef = useRef(0);
 
   const clampLines = useMemoizedFn(({ lineHeight, originalText, expanded, ellipsis, lines }) => {

package/vite.config.mjs

@@ -0,0 +1,25 @@
+import { defineConfig } from 'vite';
+import react from '@vitejs/plugin-react';
+import noBundlePlugin from 'vite-plugin-no-bundle';
+import fg from 'fast-glob';
+
+export default defineConfig({
+  plugins: [
+    react({ jsxRuntime: 'automatic' }),
+    noBundlePlugin({
+      root: 'src',
+      copy: ['**/*.png', '**/*.gif', '**/*.jpg', '**/*.jpeg', '**/*.d.ts'],
+    }),
+  ],
+  build: {
+    lib: {
+      entry: fg.sync('src/**/*.{tsx,ts,jsx,js}', {
+        ignore: ['**/stories/**', '**/demo/**', '**/*.d.ts', '**/*.stories.*'],
+      }),
+      formats: ['es'],
+      fileName: (format, entryName) => `${entryName}.js`,
+    },
+    outDir: 'lib',
+    emptyOutDir: true,
+  },
+});

package/lib/index.d.ts

@@ -1,4 +0,0 @@
-export { default as useInterval } from './useInterval';
-export { default as useStorage } from './useStorage';
-export { default as useBrowser } from './useBrowser';
-export { default as useLineClamp } from './useLineClamp';

package/lib/useBrowser.d.ts

@@ -1,42 +0,0 @@
-export default function useBrowser(): {
-    wallet: boolean;
-    walletVersion: string | undefined;
-    arcSphere: boolean;
-    arcSphereVersion: string | undefined;
-    wechat: boolean;
-    mobile: {
-        apple: {
-            phone: boolean;
-            ipod: boolean;
-            tablet: boolean;
-            universal: boolean;
-            device: boolean;
-        };
-        amazon: {
-            phone: boolean;
-            tablet: boolean;
-            device: boolean;
-        };
-        android: {
-            phone: boolean;
-            tablet: boolean;
-            device: boolean;
-        };
-        windows: {
-            phone: boolean;
-            tablet: boolean;
-            device: boolean;
-        };
-        other: {
-            blackberry: boolean;
-            blackberry10: boolean;
-            opera: boolean;
-            firefox: boolean;
-            chrome: boolean;
-            device: boolean;
-        };
-        phone: boolean;
-        tablet: boolean;
-        any: boolean;
-    };
-};

package/lib/useInterval.d.ts

@@ -1 +0,0 @@
-export default function useInterval(callback: any, delay: any): void;

package/lib/useLineClamp.d.ts

@@ -1,17 +0,0 @@
-export default function useLineClamp({ text, ellipsis, lines, expanded, debounceTime, charWidth, offset, }: {
-    text: string;
-    ellipsis?: string;
-    lines?: number;
-    expanded?: boolean;
-    debounceTime?: number;
-    charWidth?: number;
-    offset?: number;
-}): {
-    textRef: import("react").MutableRefObject<HTMLElement | null | undefined>;
-    buttonRef: import("react").MutableRefObject<HTMLElement | null | undefined>;
-    needClamp: boolean;
-    noClamp: boolean;
-    clampedText: string;
-    key: string;
-    run: (this: unknown) => void;
-};

package/lib/useStorage.d.ts

@@ -1 +0,0 @@
-export default function useStorage(storage: any, keyPrefix: any): (key: any, defaultValue: any) => any[];