@arcblock/ux 2.13.69 → 3.0.0

package/lib/ClickToCopy/copy-button.js

@@ -1,59 +1,20 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import Tooltip from '@mui/material/Tooltip';
-import { green } from '@mui/material/colors';
-import CopyIcon from '@mui/icons-material/ContentCopy';
-import CheckIcon from '@mui/icons-material/Check';
-import useCopy from './hook';
-export default function CopyButton({
-  content = '',
-  locale = 'en',
-  render,
-  showTooltip = true,
-  ...rest
+import { jsx as o } from "react/jsx-runtime";
+import { Tooltip as u } from "@mui/material";
+import { green as y } from "@mui/material/colors";
+import { Check as a, ContentCopy as C } from "@mui/icons-material";
+import h from "./hook.js";
+function S({
+  content: c = "",
+  locale: m = "en",
+  render: e,
+  showTooltip: l = !0,
+  ...r
 }) {
-  const {
-    containerRef,
-    copied,
-    copy,
-    texts
-  } = useCopy({
-    content,
-    locale
-  });
-  const iconStyle = {
-    fontSize: '1em'
-  };
-  const copyButton = /*#__PURE__*/_jsx("span", {
-    title: copied ? '' : texts.copy,
-    ...rest,
-    style: {
-      height: '1em',
-      ...rest.style
-    },
-    children: copied ? /*#__PURE__*/_jsx(Tooltip, {
-      title: texts.copied,
-      placement: "bottom",
-      arrow: true,
-      open: copied && showTooltip,
-      children: /*#__PURE__*/_jsx(CheckIcon, {
-        sx: {
-          ...iconStyle,
-          color: green[500]
-        }
-      })
-    }) : /*#__PURE__*/_jsx(CopyIcon, {
-      onClick: copy,
-      sx: {
-        ...iconStyle,
-        cursor: 'pointer'
-      }
-    })
-  });
-  if (render) {
-    return render({
-      copyButton,
-      containerRef
-    });
-  }
-  return copyButton;
-}
+  const { containerRef: s, copied: t, copy: f, texts: n } = h({ content: c, locale: m }), i = {
+    fontSize: "1em"
+  }, p = /* @__PURE__ */ o("span", { title: t ? "" : n.copy, ...r, style: { height: "1em", ...r.style }, children: t ? /* @__PURE__ */ o(u, { title: n.copied, placement: "bottom", arrow: !0, open: t && l, children: /* @__PURE__ */ o(a, { sx: { ...i, color: y[500] } }) }) : /* @__PURE__ */ o(C, { onClick: f, sx: { ...i, cursor: "pointer" } }) });
+  return e ? e({ copyButton: p, containerRef: s }) : p;
+}
+export {
+  S as default
+};

package/lib/ClickToCopy/hook.d.ts

@@ -1,9 +1,9 @@
-import type { Locale } from '../type';
+import { Locale } from '../type';
 export default function useCopy({ content, locale }: {
     content?: string;
     locale?: Locale;
 }): {
-    containerRef: import("react").MutableRefObject<HTMLElement | null>;
+    containerRef: import('react').RefObject<HTMLElement | null>;
     copied: boolean;
     copy: (e: React.MouseEvent) => void;
     texts: Record<string, any>;

package/lib/ClickToCopy/hook.js

@@ -1,39 +1,30 @@
-import { useState, useEffect, useRef } from 'react';
-import Copy from 'copy-to-clipboard';
-const translations = {
+import { useState as u, useRef as f, useEffect as a } from "react";
+import l from "copy-to-clipboard";
+const r = {
   en: {
-    copy: 'Click To Copy',
-    copied: 'Copied!'
+    copy: "Click To Copy",
+    copied: "Copied!"
   },
   zh: {
-    copy: '点击复制',
-    copied: '已复制!'
+    copy: "点击复制",
+    copied: "已复制!"
   }
 };
-export default function useCopy({
-  content,
-  locale = 'en'
-}) {
-  const [copied, setCopied] = useState(false);
-  const containerRef = useRef(null);
-  const copy = e => {
-    if (e) {
-      e.stopPropagation();
-    }
-    Copy(content || (containerRef.current?.textContent ?? ''));
-    setCopied(true);
+function d({ content: s, locale: c = "en" }) {
+  const [t, o] = u(!1), n = f(null), p = (e) => {
+    var i;
+    e && e.stopPropagation(), l(s || (((i = n.current) == null ? void 0 : i.textContent) ?? "")), o(!0);
   };
-  useEffect(() => {
-    let timer;
-    if (copied) {
-      timer = setTimeout(() => setCopied(false), 2000);
-    }
-    return () => clearTimeout(timer);
-  }, [copied]);
-  return {
-    containerRef,
-    copied,
-    copy,
-    texts: translations[locale] || translations.en
+  return a(() => {
+    let e;
+    return t && (e = setTimeout(() => o(!1), 2e3)), () => clearTimeout(e);
+  }, [t]), {
+    containerRef: n,
+    copied: t,
+    copy: p,
+    texts: r[c] || r.en
   };
-}
+}
+export {
+  d as default
+};

package/lib/ClickToCopy/index.d.ts

@@ -1,5 +1,5 @@
-import { type TooltipProps } from '@mui/material/Tooltip';
-import type { Locale } from '../type';
+import { TooltipProps } from '@mui/material';
+import { Locale } from '../type';
 export { default as CopyButton } from './copy-button';
 export interface ClickToCopyProps extends TooltipProps {
     content?: string;
@@ -9,15 +9,4 @@ export interface ClickToCopyProps extends TooltipProps {
     copiedTip?: string;
     unstyled?: false | true;
 }
-declare function ClickToCopy(props: ClickToCopyProps): import("react/jsx-runtime").JSX.Element;
-declare namespace ClickToCopy {
-    var defaultProps: {
-        content: string;
-        tip: string;
-        copiedTip: string;
-        tipPlacement: string;
-        locale: string;
-        unstyled: boolean;
-    };
-}
-export default ClickToCopy;
+export default function ClickToCopy(rawProps: ClickToCopyProps): import("react/jsx-runtime").JSX.Element;

package/lib/ClickToCopy/index.js

@@ -1,13 +1,14 @@
-import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
-import { useSize } from 'ahooks';
-import Tooltip from '@mui/material/Tooltip';
-import { useSnackbar } from 'notistack';
-import useCopy from './hook';
-import Toast, { ToastProvider } from '../Toast';
-import { mergeProps } from '../Util';
-import { styled } from '../Theme';
-export { default as CopyButton } from './copy-button';
-const Container = styled('span')`
+import { jsx as e, Fragment as v } from "react/jsx-runtime";
+import { useSize as F } from "ahooks";
+import { Tooltip as S } from "@mui/material";
+import t from "lodash/isUndefined";
+import { useSnackbar as U } from "notistack";
+import _ from "./hook.js";
+import B, { ToastProvider as L } from "../Toast/index.js";
+import { mergeProps as O } from "../Util/index.js";
+import { styled as s } from "../Theme/index.js";
+import { default as X } from "./copy-button.js";
+const R = s("span")`
   display: inline;
   white-space: pre-wrap;
   word-wrap: break-word;
@@ -18,71 +19,18 @@ const Container = styled('span')`
   padding: 1px 12px;
   background-color: rgba(0, 0, 0, 0.08);
   cursor: pointer;
-`;
-const UnstyledContainer = styled('span')`
+`, q = s("span")`
   cursor: pointer;
 `;
-export default function ClickToCopy(props) {
-  const newProps = mergeProps(props, ClickToCopy, ['style']);
-  const {
-    children,
-    content,
-    tip,
-    copiedTip,
-    tipPlacement,
-    locale,
-    style,
-    unstyled,
-    ...rest
-  } = newProps;
-  const {
-    containerRef,
-    copied,
-    copy,
-    texts
-  } = useCopy({
-    content,
-    locale
-  });
-  const _tip = tip || texts.copy;
-  const _copiedTip = copiedTip || texts.copied;
-  const snackbarContext = useSnackbar();
-  const size = useSize(document.body);
-  const width = size?.width || 0;
-  const onCopy = e => {
-    copy(e);
-    if (width < 600) {
-      Toast.success(_copiedTip);
-    }
-  };
-  const ContainerComponent = unstyled ? UnstyledContainer : Container;
-  const contentChild = /*#__PURE__*/_jsx(Tooltip, {
-    title: copied ? _copiedTip : _tip,
-    ...rest,
-    placement: tipPlacement,
-    disableFocusListener: true,
-    children: /*#__PURE__*/_jsx(ContainerComponent, {
-      ref: containerRef,
-      style: style,
-      onClick: onCopy,
-      children: children || content
-    })
-  });
-  if (!snackbarContext) {
-    return /*#__PURE__*/_jsx(ToastProvider, {
-      children: contentChild
-    });
-  }
-  // eslint-disable-next-line react/jsx-no-useless-fragment
-  return /*#__PURE__*/_jsx(_Fragment, {
-    children: contentChild
-  });
+function z(a) {
+  const o = Object.assign({}, a);
+  t(o.content) && (o.content = ""), t(o.tip) && (o.tip = ""), t(o.copiedTip) && (o.copiedTip = ""), t(o.tipPlacement) && (o.tipPlacement = "right"), t(o.locale) && (o.locale = "en"), t(o.unstyled) && (o.unstyled = !1);
+  const d = O(o, z, ["style"]), { children: l, content: r, tip: m, copiedTip: f, tipPlacement: u, locale: y, style: C, unstyled: w, ...b } = d, { containerRef: h, copied: g, copy: x, texts: i } = _({ content: r, locale: y }), T = m || i.copy, p = f || i.copied, k = U(), n = F(document.body), P = (n == null ? void 0 : n.width) || 0, c = /* @__PURE__ */ e(S, { title: g ? p : T, ...b, placement: u, disableFocusListener: !0, children: /* @__PURE__ */ e(w ? q : R, { ref: h, style: C, onClick: (j) => {
+    x(j), P < 600 && B.success(p);
+  }, children: l || r }) });
+  return k ? /* @__PURE__ */ e(v, { children: c }) : /* @__PURE__ */ e(L, { children: c });
 }
-ClickToCopy.defaultProps = {
-  content: '',
-  tip: '',
-  copiedTip: '',
-  tipPlacement: 'right',
-  locale: 'en',
-  unstyled: false
-};
+export {
+  X as CopyButton,
+  z as default
+};

package/lib/CloseButton/index.d.ts

@@ -1,4 +1,4 @@
-import type { SxProps } from '@mui/material';
+import { SxProps } from '@mui/material';
 export default function CloseButton({ onClose, sx, size, }: {
     onClose?: () => void;
     sx?: SxProps;

package/lib/CloseButton/index.js

@@ -1,29 +1,35 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Box } from '@mui/material';
-import { Icon } from '@iconify/react';
-import CloseRoundedIcon from '@iconify-icons/material-symbols/close-rounded';
-import noop from 'lodash/noop';
-import { mergeSx } from '../Util/style';
-export default function CloseButton({
-  onClose = noop,
-  sx,
-  size = 20
+import { jsx as o } from "react/jsx-runtime";
+import { Box as e } from "@mui/material";
+import { Icon as i } from "@iconify/react";
+import m from "@iconify-icons/material-symbols/close-rounded";
+import s from "lodash/noop";
+import { mergeSx as f } from "../Util/style.js";
+function x({
+  onClose: r = s,
+  sx: t,
+  size: n = 20
 }) {
-  return /*#__PURE__*/_jsx(Box, {
-    onClick: onClose,
-    sx: mergeSx({
-      fontSize: 0,
-      cursor: 'pointer',
-      color: 'text.secondary',
-      transition: 'transform 0.25s ease-in-out 0s',
-      transformOrigin: 'center',
-      '&:hover': {
-        transform: 'rotate(90deg)'
-      }
-    }, sx),
-    children: /*#__PURE__*/_jsx(Icon, {
-      icon: CloseRoundedIcon,
-      fontSize: size
-    })
-  });
-}
+  return /* @__PURE__ */ o(
+    e,
+    {
+      onClick: r,
+      sx: f(
+        {
+          fontSize: 0,
+          cursor: "pointer",
+          color: "text.secondary",
+          transition: "transform 0.25s ease-in-out 0s",
+          transformOrigin: "center",
+          "&:hover": {
+            transform: "rotate(90deg)"
+          }
+        },
+        t
+      ),
+      children: /* @__PURE__ */ o(i, { icon: m, fontSize: n })
+    }
+  );
+}
+export {
+  x as default
+};

package/lib/CodeBlock/CodeBlock.stories.d.ts

@@ -0,0 +1,20 @@
+import { default as CodeBlock } from '.';
+export { default as Protobuf } from './demo/protobuf';
+export { default as Javascript } from './demo/javascript';
+export { default as Json } from './demo/json';
+export { default as SingleLineOfCode } from './demo/single-line-of-code';
+export { default as Typescript } from './demo/typescript';
+export { default as Markdown } from './demo/markdown';
+export { default as lightMode } from './demo/light-mode';
+declare namespace _default {
+    export let title: string;
+    export { CodeBlock as component };
+    export namespace parameters {
+        namespace docs {
+            namespace description {
+                let component: string;
+            }
+        }
+    }
+}
+export default _default;

package/lib/CodeBlock/LightBox.d.ts

@@ -1,5 +1,5 @@
-declare const LightBox: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+declare const LightBox: import('@emotion/styled').StyledComponent<{
+    theme?: import('@emotion/react').Theme;
+    as?: React.ElementType;
+}, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export default LightBox;

package/lib/CodeBlock/LightBox.js

@@ -1,6 +1,5 @@
-// highlight.js/styles/atom-one-light.css
-import styled from '@emotion/styled';
-const LightBox = styled('div')`
+import l from "@emotion/styled";
+const t = l("div")`
   display: block;
   pre code.hljs {
     display: block;
@@ -82,4 +81,6 @@ const LightBox = styled('div')`
     }
   }
 `;
-export default LightBox;
+export {
+  t as default
+};

package/lib/CodeBlock/index.d.ts

@@ -1,5 +1,4 @@
-import { type SxProps } from '@mui/material';
-import 'highlight.js/styles/atom-one-dark.css';
+import { SxProps } from '@mui/material';
 export interface CodeBlockProps extends React.HTMLAttributes<HTMLPreElement> {
     code?: string;
     language?: string;