@arcblock/ux 2.10.67 → 2.10.69

package/lib/NFTDisplay/svg-embedder/inline-svg.d.ts

@@ -1,14 +1,8 @@
-export default InlineSvg;
-/**
- * inline svg 的方式嵌入 svg, 使用 shadow DOM 避免样式污染
- */
-declare function InlineSvg({ svg, ...rest }: {
-    [x: string]: any;
-    svg: any;
-}): import("react/jsx-runtime").JSX.Element;
-declare namespace InlineSvg {
-    namespace propTypes {
-        let svg: PropTypes.Validator<string>;
-    }
+import { type SxProps } from '@mui/material';
+export interface InlineSvgProps extends React.HTMLAttributes<HTMLSpanElement> {
+    svg: string;
+    sx?: SxProps;
 }
-import PropTypes from 'prop-types';
+/** inline svg 的方式嵌入 svg, 使用 shadow DOM 避免样式污染 */
+declare function InlineSvg({ svg, ...rest }: InlineSvgProps): import("react/jsx-runtime").JSX.Element;
+export default InlineSvg;

package/lib/NFTDisplay/svg-embedder/inline-svg.js

@@ -1,11 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import PropTypes from 'prop-types';
 import root from 'react-shadow/emotion';
 import { styled } from '../../Theme';
-
-/**
- * inline svg 的方式嵌入 svg, 使用 shadow DOM 避免样式污染
- */
+/** inline svg 的方式嵌入 svg, 使用 shadow DOM 避免样式污染 */
 function InlineSvg({
   svg,
   ...rest
@@ -19,9 +15,6 @@ function InlineSvg({
     })
   });
 }
-InlineSvg.propTypes = {
-  svg: PropTypes.string.isRequired
-};
 const Root = styled(root.span)`
   display: block;
   width: 100%;

package/lib/NavMenu/nav-menu.d.ts

@@ -1,3 +1,4 @@
+import { type SxProps } from '@mui/material';
 export type ItemOptions = {
     id?: string;
     icon?: React.ReactNode;
@@ -14,6 +15,7 @@ export interface NavMenuProps extends React.HTMLAttributes<HTMLElement> {
     activeTextColor?: string;
     bgColor?: string;
     onSelected?: (id: string) => void;
+    sx?: SxProps;
 }
 /**
  * NavMenu, 导航组件, 可用于 header/footer/sidebar

package/lib/NavMenu/nav-menu.js

@@ -1,5 +1,4 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-/* eslint-disable no-unused-vars */
 import { Children, cloneElement, useEffect, createContext, useContext, useRef, forwardRef, useLayoutEffect, isValidElement } from 'react';
 import clsx from 'clsx';
 import { MoreHoriz as MoreHorizIcon, ExpandMore as ExpandMoreIcon, Menu as MenuIcon } from '@mui/icons-material';

package/lib/PageScroller/index.d.ts

@@ -1,14 +1,15 @@
-declare const _default: (props: {
-    animationTimer: any;
-    blockScrollDown: any;
-    blockScrollUp: any;
-    children: any;
-    height: any;
-    width: any;
-    customPageNumber: any;
-    onScrollUnavailable: any;
-    onChange: any;
-    renderAllPagesOnFirstRender: any;
-    transitionTimingFunction: any;
-}) => import("react/jsx-runtime").JSX.Element;
+export interface PageScrollerProps {
+    animationTimer?: number;
+    blockScrollDown?: false | true;
+    blockScrollUp?: false | true;
+    children?: React.ReactElement | React.ReactElement[];
+    height?: number | string;
+    width?: number | string;
+    customPageNumber?: number;
+    onScrollUnavailable?: () => void;
+    onChange?: (index: number) => void;
+    renderAllPagesOnFirstRender?: false | true;
+    transitionTimingFunction?: string;
+}
+declare const _default: (props: PageScrollerProps) => import("react/jsx-runtime").JSX.Element;
 export default _default;

package/lib/PageScroller/index.js

@@ -1,7 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 /* eslint-disable jsx-a11y/no-noninteractive-tabindex */
 import { Children, cloneElement, useCallback, useEffect, useRef, useState } from 'react';
-import PropTypes from 'prop-types';
 import isEqual from 'lodash/isEqual';
 import isNil from 'lodash/isNil';
 import isNull from 'lodash/isNull';
@@ -28,22 +27,23 @@ let isBodyScrollEnabled = true;
 let isTransitionAfterComponentsToRenderChanged = false;
 const containers = [];
 function PageScroller({
-  animationTimer,
-  blockScrollDown,
-  blockScrollUp,
-  children,
-  height,
-  width,
+  animationTimer = DEFAULT_ANIMATION_TIMER,
+  blockScrollDown = false,
+  blockScrollUp = false,
+  children: _children,
+  height = DEFAULT_CONTAINER_HEIGHT,
+  width = DEFAULT_CONTAINER_WIDTH,
   customPageNumber,
   onScrollUnavailable,
   onChange,
-  renderAllPagesOnFirstRender,
-  transitionTimingFunction
+  renderAllPagesOnFirstRender = false,
+  transitionTimingFunction = DEFAULT_ANIMATION
 }) {
   const [componentIndex, setComponentIndex] = useState(DEFAULT_COMPONENT_INDEX);
   const [componentsToRenderLength, setComponentsToRenderLength] = useState(DEFAULT_COMPONENTS_TO_RENDER_LENGTH);
   const prevComponentIndex = usePrevious(componentIndex);
   const pageContainer = useRef(null);
+  const children = Children.toArray(_children);
   const addNextComponent = useCallback(componentsToRenderOnMountLength => {
     let tempComponentsToRenderLength = 0;
     if (!isNil(componentsToRenderOnMountLength)) {
@@ -168,8 +168,8 @@ function PageScroller({
     }
   }, [scrollWindowDown, scrollWindowUp]);
   useEffect(() => {
-    pageContainer.current.addEventListener(Events.TOUCHMOVE, touchMove);
-    pageContainer.current.addEventListener(Events.KEYDOWN, keyPress);
+    pageContainer.current?.addEventListener(Events.TOUCHMOVE, touchMove);
+    pageContainer.current?.addEventListener(Events.KEYDOWN, keyPress);
     return () => {
       if (pageContainer.current?.removeEventListener) {
         pageContainer.current.removeEventListener(Events.TOUCHMOVE, touchMove);
@@ -189,7 +189,7 @@ function PageScroller({
   useEffect(() => {
     isScrolling = false;
     previousTouchMove = null;
-    if (componentIndex > prevComponentIndex) {
+    if (prevComponentIndex !== undefined && componentIndex > prevComponentIndex) {
       addNextComponent();
     }
   }, [addNextComponent, componentIndex, prevComponentIndex]);
@@ -256,31 +256,6 @@ function PageScroller({
     })
   });
 }
-PageScroller.propTypes = {
-  animationTimer: PropTypes.number,
-  blockScrollDown: PropTypes.bool,
-  blockScrollUp: PropTypes.bool,
-  children: PropTypes.any.isRequired,
-  height: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
-  width: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
-  customPageNumber: PropTypes.number,
-  onScrollUnavailable: PropTypes.func,
-  onChange: PropTypes.func,
-  renderAllPagesOnFirstRender: PropTypes.bool,
-  transitionTimingFunction: PropTypes.string
-};
-PageScroller.defaultProps = {
-  animationTimer: DEFAULT_ANIMATION_TIMER,
-  transitionTimingFunction: DEFAULT_ANIMATION,
-  height: DEFAULT_CONTAINER_HEIGHT,
-  width: DEFAULT_CONTAINER_WIDTH,
-  onChange: undefined,
-  onScrollUnavailable: undefined,
-  blockScrollUp: false,
-  blockScrollDown: false,
-  renderAllPagesOnFirstRender: false,
-  customPageNumber: undefined
-};
 export default withDeprecated(PageScroller, {
   name: 'PageScroller'
 });

package/lib/PageScroller/usePrevValue.d.ts

@@ -1 +1 @@
-export default function usePrevious(value: any): {};
+export default function usePrevious<T>(value: T): T | undefined;

package/lib/PageScroller/usePrevValue.js

@@ -1,7 +1,6 @@
-// eslint-disable-next-line no-unused-vars
 import { useEffect, useRef } from 'react';
 export default function usePrevious(value) {
-  const ref = useRef({});
+  const ref = useRef();
   useEffect(() => {
     ref.current = value;
   }, [value]);

package/lib/Passport/index.d.ts

@@ -1,2 +1,2 @@
-export default PassportItem;
 import PassportItem from './passport';
+export default PassportItem;

package/lib/Passport/passport.d.ts

@@ -1,31 +1,11 @@
-declare function Passport({ passport, user, color, width, icon, children, createPassportSvg, ...rest }: {
-    [x: string]: any;
-    passport: any;
-    user: any;
-    color: any;
-    width: any;
-    icon: any;
-    children: any;
-    createPassportSvg: any;
-}): import("react/jsx-runtime").JSX.Element;
-declare namespace Passport {
-    namespace propTypes {
-        let passport: PropTypes.Validator<any>;
-        let user: PropTypes.Validator<any>;
-        let color: PropTypes.Validator<string>;
-        let createPassportSvg: PropTypes.Validator<(...args: any[]) => any>;
-        let icon: PropTypes.Requireable<any>;
-        let children: PropTypes.Requireable<any>;
-        let width: PropTypes.Requireable<number>;
-    }
-    namespace defaultProps {
-        let icon_1: null;
-        export { icon_1 as icon };
-        let children_1: null;
-        export { children_1 as children };
-        let width_1: number;
-        export { width_1 as width };
-    }
+import { type BoxProps } from '@mui/material';
+import { Passport as PassportType, User } from '../type';
+export interface PassportProps extends BoxProps {
+    passport: PassportType;
+    user: User;
+    color: string;
+    width?: number;
+    icon?: React.ReactNode;
+    createPassportSvg: (props: any) => string;
 }
-export default Passport;
-import PropTypes from 'prop-types';
+export default function Passport({ passport, user, color, width, icon, createPassportSvg, children, ...rest }: PassportProps): import("react/jsx-runtime").JSX.Element;

package/lib/Passport/passport.js

@@ -1,5 +1,4 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import PropTypes from 'prop-types';
 import upperFirst from 'lodash/upperFirst';
 import { Box } from '@mui/material';
 import RevokeIcon from '@arcblock/icons/lib/RevokeIcon';
@@ -9,10 +8,11 @@ export default function Passport({
   passport,
   user,
   color,
-  width,
-  icon,
-  children,
+  width = 150,
+  icon = null,
   createPassportSvg,
+  // inherit props
+  children,
   ...rest
 }) {
   const {
@@ -102,18 +102,4 @@ export default function Passport({
       }), children]
     })]
   });
-}
-Passport.propTypes = {
-  passport: PropTypes.any.isRequired,
-  user: PropTypes.any.isRequired,
-  color: PropTypes.string.isRequired,
-  createPassportSvg: PropTypes.func.isRequired,
-  icon: PropTypes.any,
-  children: PropTypes.any,
-  width: PropTypes.number
-};
-Passport.defaultProps = {
-  icon: null,
-  children: null,
-  width: 150
-};
+}

package/lib/PoweredByArcBlock/index.d.ts

@@ -1,15 +1,5 @@
-declare function PoweredByArcBlock({ linkProps, ...props }: {
-    [x: string]: any;
-    linkProps: any;
-}): import("react/jsx-runtime").JSX.Element;
-declare namespace PoweredByArcBlock {
-    namespace propTypes {
-        let linkProps: PropTypes.Requireable<object>;
-    }
-    namespace defaultProps {
-        let linkProps_1: {};
-        export { linkProps_1 as linkProps };
-    }
+import { type TypographyProps, type LinkProps } from '@mui/material';
+export interface PoweredByArcBlockProps extends TypographyProps {
+    linkProps?: LinkProps;
 }
-export default PoweredByArcBlock;
-import PropTypes from 'prop-types';
+export default function PoweredByArcBlock({ linkProps, ...props }: PoweredByArcBlockProps): import("react/jsx-runtime").JSX.Element;

package/lib/PoweredByArcBlock/index.js

@@ -1,5 +1,4 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import PropTypes from 'prop-types';
 import { Link, Typography } from '@mui/material';
 export default function PoweredByArcBlock({
   linkProps,
@@ -21,10 +20,4 @@ export default function PoweredByArcBlock({
       children: "Blocklet Technology"
     }), ", the decentralized web engine."]
   });
-}
-PoweredByArcBlock.propTypes = {
-  linkProps: PropTypes.object
-};
-PoweredByArcBlock.defaultProps = {
-  linkProps: {}
-};
+}

package/lib/PricingTable/PricingPlan.d.ts

@@ -1,10 +1,12 @@
-export default PricingPlan;
-declare function PricingPlan({ plan }: {
-    plan: any;
-}): import("react/jsx-runtime").JSX.Element;
-declare namespace PricingPlan {
-    namespace propTypes {
-        let plan: PropTypes.Validator<object>;
-    }
+export interface PricingPlanProps {
+    plan: {
+        name: string;
+        price: string;
+        featureList: string[];
+        showButton: boolean;
+        buttonLink: string;
+        buttonText: string;
+    };
 }
-import PropTypes from 'prop-types';
+declare function PricingPlan({ plan }: PricingPlanProps): import("react/jsx-runtime").JSX.Element;
+export default PricingPlan;

package/lib/PricingTable/PricingPlan.js

@@ -1,5 +1,4 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import PropTypes from 'prop-types';
 import Card from '@mui/material/Card';
 import Button from '@mui/material/Button';
 import CardContent from '@mui/material/CardContent';
@@ -52,9 +51,6 @@ function PricingPlan({
   });
 }
 export default PricingPlan;
-PricingPlan.propTypes = {
-  plan: PropTypes.object.isRequired
-};
 const PlanCard = styled(Card)`
   height: 500px;
   display: flex;

package/lib/PricingTable/index.d.ts

@@ -1,4 +1,6 @@
-declare const _default: (props: {
-    plans: any;
-}) => import("react/jsx-runtime").JSX.Element;
+import { type PricingPlanProps } from './PricingPlan';
+export interface PricingTableProps {
+    plans?: Array<PricingPlanProps['plan']>;
+}
+declare const _default: (props: PricingTableProps) => import("react/jsx-runtime").JSX.Element;
 export default _default;

package/lib/PricingTable/index.js

@@ -1,11 +1,10 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import PropTypes from 'prop-types';
 import Grid from '@mui/material/Grid';
 import PricingPlan from './PricingPlan';
 import { styled } from '../Theme';
 import { withDeprecated } from '../Util/deprecate';
 function PricingTable({
-  plans
+  plans = []
 }) {
   if (plans && plans.length > 0) {
     return /*#__PURE__*/_jsx(Div, {
@@ -35,9 +34,6 @@ function PricingTable({
 export default withDeprecated(PricingTable, {
   name: 'PricingTable'
 });
-PricingTable.propTypes = {
-  plans: PropTypes.array.isRequired
-};
 const Div = styled('div')`
   padding: 100px 0;
   text-align: center;

package/lib/QRCode/index.d.ts

@@ -1,23 +1,12 @@
-export default QRCode;
-declare function QRCode({ data, size, image, config, ...rest }: {
-    [x: string]: any;
-    data: any;
-    size: any;
-    image: any;
-    config: any;
-}): import("react/jsx-runtime").JSX.Element;
-declare namespace QRCode {
-    namespace propTypes {
-        let data: PropTypes.Validator<string>;
-        let size: PropTypes.Validator<number>;
-        let image: PropTypes.Requireable<string>;
-        let config: PropTypes.Requireable<object>;
-    }
-    namespace defaultProps {
-        let image_1: null;
-        export { image_1 as image };
-        let config_1: {};
-        export { config_1 as config };
-    }
+import QRCodeStyling from '@solana/qr-code-styling';
+type QRCodeStylingOptions = NonNullable<ConstructorParameters<typeof QRCodeStyling>[0]>;
+export interface QRCodeProps {
+    /** 一般情况下仅使用 data/size/image 即可 */
+    data: string;
+    size: number;
+    image?: string;
+    /** 覆盖 qr-code-styling 配置 */
+    config?: QRCodeStylingOptions;
 }
-import PropTypes from 'prop-types';
+declare function QRCode({ data, size, image, config, ...rest }: QRCodeProps): import("react/jsx-runtime").JSX.Element;
+export default QRCode;

package/lib/QRCode/index.js

@@ -1,6 +1,5 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useRef, useEffect, useMemo, useState } from 'react';
-import PropTypes from 'prop-types';
 import QRCodeStyling from '@solana/qr-code-styling';
 import { Box } from '@mui/material';
 const defaults = {
@@ -15,14 +14,13 @@ const defaults = {
     type: 'dot'
   }
 };
-
 // 该组件用于生成与 android wallet 样式风格相似的 qrcode
 // 注意: 依赖的 @solana/qr-code-styling 是一份 fork 版本, 原版本的 margin 配置存在 bug
 function QRCode({
   data,
   size,
   image,
-  config,
+  config = {},
   ...rest
 }) {
   const ref = useRef(null);
@@ -51,23 +49,10 @@ function QRCode({
   useEffect(() => {
     if (!qrCode) return;
     qrCode.update(options);
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [data, size, image, config]);
+  }, [options, qrCode]);
   return /*#__PURE__*/_jsx(Box, {
     ref: ref,
     ...rest
   });
 }
-QRCode.propTypes = {
-  // 一般情况下仅使用 data/size/image 即可
-  data: PropTypes.string.isRequired,
-  size: PropTypes.number.isRequired,
-  image: PropTypes.string,
-  // 覆盖 qr-code-styling 配置
-  config: PropTypes.object
-};
-QRCode.defaultProps = {
-  image: null,
-  config: {}
-};
 export default QRCode;

package/lib/RelativeTime/index.d.ts

@@ -1,41 +1,13 @@
-declare function RelativeTime({ value, locale, withoutSuffix, from, to, type, tz, relativeRange, ...rest }: {
-    [x: string]: any;
-    value: any;
-    locale: any;
-    withoutSuffix: any;
-    from: any;
-    to: any;
-    type: any;
-    tz: any;
-    relativeRange: any;
-}): "-" | import("react/jsx-runtime").JSX.Element;
-declare namespace RelativeTime {
-    namespace propTypes {
-        let value: PropTypes.Validator<NonNullable<NonNullable<string | number | null | undefined>>>;
-        let locale: PropTypes.Requireable<string>;
-        let withoutSuffix: PropTypes.Requireable<boolean>;
-        let from: PropTypes.Requireable<NonNullable<string | number | null | undefined>>;
-        let to: PropTypes.Requireable<NonNullable<string | number | null | undefined>>;
-        let type: PropTypes.Requireable<string>;
-        let tz: PropTypes.Requireable<string>;
-        let relativeRange: PropTypes.Requireable<number>;
-    }
-    namespace defaultProps {
-        let locale_1: string;
-        export { locale_1 as locale };
-        let withoutSuffix_1: boolean;
-        export { withoutSuffix_1 as withoutSuffix };
-        let from_1: string;
-        export { from_1 as from };
-        let to_1: string;
-        export { to_1 as to };
-        let type_1: string;
-        export { type_1 as type };
-        let tz_1: undefined;
-        export { tz_1 as tz };
-        let relativeRange_1: undefined;
-        export { relativeRange_1 as relativeRange };
-    }
+import 'dayjs/locale/zh-cn';
+import type { Locale } from '../type';
+export interface RelativeTimeProps {
+    value: string | number;
+    locale?: Locale;
+    withoutSuffix?: false | true;
+    from?: string | number;
+    to?: string | number;
+    type?: 'relative' | 'absolute';
+    tz?: string;
+    relativeRange?: number;
 }
-export default RelativeTime;
-import PropTypes from 'prop-types';
+export default function RelativeTime({ value, locale, withoutSuffix, from, to, type, tz, relativeRange, ...rest }: RelativeTimeProps): "-" | import("react/jsx-runtime").JSX.Element;

package/lib/RelativeTime/index.js

@@ -1,5 +1,4 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import PropTypes from 'prop-types';
 import relativeTime from 'dayjs/plugin/relativeTime';
 import dayjs from 'dayjs';
 import 'dayjs/locale/zh-cn';
@@ -35,11 +34,11 @@ dayjs.updateLocale('zh-cn', {
 setDateTool(dayjs);
 export default function RelativeTime({
   value,
-  locale,
-  withoutSuffix,
-  from,
-  to,
-  type,
+  locale = 'en',
+  withoutSuffix = false,
+  from = '',
+  to = '',
+  type = 'relative',
   tz,
   relativeRange,
   ...rest
@@ -52,7 +51,7 @@ export default function RelativeTime({
   if (tz) {
     datetime.tz(tz);
   }
-  const absoluteString = formatToDatetime(value, {
+  const absoluteString = formatToDatetime(value.toString(), {
     locale: localeOption,
     tz
   });
@@ -85,23 +84,4 @@ export default function RelativeTime({
       children: innerContent
     })
   });
-}
-RelativeTime.propTypes = {
-  value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,
-  locale: PropTypes.string,
-  withoutSuffix: PropTypes.bool,
-  from: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-  to: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-  type: PropTypes.oneOf(['relative', 'absolute']),
-  tz: PropTypes.string,
-  relativeRange: PropTypes.number
-};
-RelativeTime.defaultProps = {
-  locale: 'en',
-  withoutSuffix: false,
-  from: '',
-  to: '',
-  type: 'relative',
-  tz: undefined,
-  relativeRange: undefined
-};
+}