@arcblock/ux 2.13.70 → 3.0.1

package/lib/Tabs/Tabs.stories.d.ts

@@ -0,0 +1,14 @@
+import { default as Basic } from './demo/basic';
+import { default as IconPosition } from './demo/iconPosition';
+declare namespace _default {
+    let title: string;
+    namespace parameters {
+        namespace docs {
+            namespace description {
+                let component: string;
+            }
+        }
+    }
+}
+export default _default;
+export { Basic, IconPosition };

package/lib/Tabs/index.d.ts

@@ -1,9 +1,9 @@
-import { type TabsProps as MuiTabsProps, type TabProps } from '@mui/material';
+import { TabsProps as MuiTabsProps, TabProps } from '@mui/material';
 interface TabsProps extends Omit<MuiTabsProps, 'variant' | 'onChange'> {
     tabs: {
         value: any;
         label: React.ReactNode;
-        icon?: string | React.ReactElement;
+        icon?: string | React.ReactElement<any>;
     }[];
     current: any;
     onChange: (value: string) => void;

package/lib/Tabs/index.js

@@ -1,193 +1,176 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Tabs as MuiTabs, Tab as MuiTab } from '@mui/material';
-import { styled } from '../Theme';
-const PREFIX = 'index';
-const classes = {
-  tabs: `${PREFIX}-tabs`,
-  tab: `${PREFIX}-tab`
-};
-const StyledMuiTabs = styled(MuiTabs)(({
-  theme
-}) => ({
-  [`& .${classes.tabs}`]: {},
-  [`& .${classes.tab}`]: {
-    fontSize: '0.875rem',
-    [theme.breakpoints.up('md')]: {
-      fontSize: '1rem'
+import { jsx as l } from "react/jsx-runtime";
+import { Tabs as u, Tab as c } from "@mui/material";
+import { styled as p } from "../Theme/index.js";
+const b = "index", s = {
+  tabs: `${b}-tabs`,
+  tab: `${b}-tab`
+}, m = p(u)(({ theme: e }) => ({
+  [`& .${s.tabs}`]: {},
+  [`& .${s.tab}`]: {
+    fontSize: "0.875rem",
+    [e.breakpoints.up("md")]: {
+      fontSize: "1rem"
     }
   }
 }));
-function CardTabs({
-  tabs,
-  current,
-  onChange,
-  iconPosition,
-  ...rest
-}) {
-  return /*#__PURE__*/_jsx(MuiTabs, {
-    scrollButtons: "auto",
-    value: current,
-    onChange: (_, newValue) => onChange(newValue),
-    ...rest,
-    variant: "scrollable",
-    sx: {
-      minHeight: 'auto',
-      '.MuiTabs-scrollButtons.Mui-disabled': {
-        opacity: 0.3,
-        cursor: 'not-allowed',
-        pointerEvents: 'auto'
-      },
-      '.MuiTabs-scroller': {
-        borderRadius: '100vw'
-      },
-      '.MuiTabs-flexContainer': {
-        borderRadius: '100vw',
-        backgroundColor: 'grey.100',
-        padding: 0.5,
-        display: 'inline-flex',
-        columnGap: 0.25,
-        maxWidth: '100%',
-        overflowX: 'auto'
-      },
-      '.MuiTab-root': {
-        borderRadius: '100vw',
-        border: '1px solid transparent',
-        minHeight: 'auto',
-        lineHeight: 1,
-        py: 1,
-        color: 'text.secondary',
-        fontSize: '13px',
-        fontWeight: 'normal',
-        textTransform: 'capitalize',
-        transition: 'background-color 0.2s ease',
-        '&.Mui-selected, &:hover': {
-          backgroundColor: 'action.selected',
-          borderColor: 'grey.100',
-          color: 'grey.A700'
-        }
+function f({ tabs: e, current: t, onChange: r, iconPosition: n, ...o }) {
+  return /* @__PURE__ */ l(
+    u,
+    {
+      scrollButtons: "auto",
+      value: t,
+      onChange: (a, i) => r(i),
+      ...o,
+      variant: "scrollable",
+      sx: {
+        minHeight: "auto",
+        ".MuiTabs-scrollButtons.Mui-disabled": {
+          opacity: 0.3,
+          cursor: "not-allowed",
+          pointerEvents: "auto"
+        },
+        ".MuiTabs-scroller": {
+          borderRadius: "100vw"
+        },
+        ".MuiTabs-flexContainer": {
+          borderRadius: "100vw",
+          backgroundColor: "grey.100",
+          padding: 0.5,
+          display: "inline-flex",
+          columnGap: 0.25,
+          maxWidth: "100%",
+          overflowX: "auto"
+        },
+        ".MuiTab-root": {
+          borderRadius: "100vw",
+          border: "1px solid transparent",
+          minHeight: "auto",
+          lineHeight: 1,
+          py: 1,
+          color: "text.secondary",
+          fontSize: "13px",
+          fontWeight: "normal",
+          textTransform: "capitalize",
+          transition: "background-color 0.2s ease",
+          "&.Mui-selected, &:hover": {
+            backgroundColor: "action.selected",
+            borderColor: "grey.100",
+            color: "grey.A700"
+          }
+        },
+        ".MuiTabs-indicator": {
+          display: "none"
+        },
+        ...o.sx
       },
-      '.MuiTabs-indicator': {
-        display: 'none'
-      },
-      ...rest.sx
-    },
-    children: tabs.map(x => /*#__PURE__*/_jsx(MuiTab, {
-      className: classes.tab,
-      value: x.value,
-      label: x.label,
-      icon: x.icon,
-      iconPosition: iconPosition
-    }, x.value))
-  });
+      children: e.map((a) => /* @__PURE__ */ l(
+        c,
+        {
+          className: s.tab,
+          value: a.value,
+          label: a.label,
+          icon: a.icon,
+          iconPosition: n
+        },
+        a.value
+      ))
+    }
+  );
 }
-function LineTabs({
-  tabs,
-  current,
-  onChange,
-  iconPosition,
-  ...rest
-}) {
-  return /*#__PURE__*/_jsx(MuiTabs, {
-    scrollButtons: "auto",
-    value: current,
-    onChange: (_, newValue) => onChange(newValue),
-    ...rest,
-    variant: "scrollable",
-    sx: {
-      minHeight: 'auto',
-      '.MuiTabs-scrollButtons.Mui-disabled': {
-        opacity: 0.3,
-        cursor: 'not-allowed',
-        pointerEvents: 'auto'
-      },
-      '.MuiTabs-scroller': rest.orientation !== 'vertical' ? {
-        '&::after': {
-          content: '""',
-          display: 'block',
-          position: 'sticky',
-          left: 0,
-          zIndex: -1,
-          width: '100%',
-          height: '1px',
-          backgroundColor: 'grey.300'
-        }
-      } : {},
-      '.MuiTabs-flexContainer': {
-        display: 'inline-flex',
-        columnGap: 2.5,
-        px: 0,
-        pb: 0.5
-      },
-      '.MuiTab-root': {
-        border: '1px solid transparent',
-        minHeight: 'auto',
-        lineHeight: 1,
-        py: 1,
-        px: 0,
-        color: 'text.secondary',
-        fontSize: '14px',
-        fontWeight: 500,
-        textTransform: 'capitalize',
-        minWidth: 'auto',
-        '&.Mui-selected, &:hover': {
-          color: 'primary.main'
-        }
+function v({ tabs: e, current: t, onChange: r, iconPosition: n, ...o }) {
+  return /* @__PURE__ */ l(
+    u,
+    {
+      scrollButtons: "auto",
+      value: t,
+      onChange: (a, i) => r(i),
+      ...o,
+      variant: "scrollable",
+      sx: {
+        minHeight: "auto",
+        ".MuiTabs-scrollButtons.Mui-disabled": {
+          opacity: 0.3,
+          cursor: "not-allowed",
+          pointerEvents: "auto"
+        },
+        ".MuiTabs-scroller": o.orientation !== "vertical" ? {
+          "&::after": {
+            content: '""',
+            display: "block",
+            position: "sticky",
+            left: 0,
+            zIndex: -1,
+            width: "100%",
+            height: "1px",
+            backgroundColor: "grey.300"
+          }
+        } : {},
+        ".MuiTabs-flexContainer": {
+          display: "inline-flex",
+          columnGap: 2.5,
+          px: 0,
+          pb: 0.5
+        },
+        ".MuiTab-root": {
+          border: "1px solid transparent",
+          minHeight: "auto",
+          lineHeight: 1,
+          py: 1,
+          px: 0,
+          color: "text.secondary",
+          fontSize: "14px",
+          fontWeight: 500,
+          textTransform: "capitalize",
+          minWidth: "auto",
+          "&.Mui-selected, &:hover": {
+            color: "primary.main"
+          }
+        },
+        ".MuiTabs-indicator": {
+          height: "1px",
+          backgroundColor: "primary.main"
+        },
+        ...o.sx
       },
-      '.MuiTabs-indicator': {
-        height: '1px',
-        backgroundColor: 'primary.main'
-      },
-      ...rest.sx
-    },
-    children: tabs.map(x => /*#__PURE__*/_jsx(MuiTab, {
-      className: classes.tab,
-      value: x.value,
-      label: x.label,
-      icon: x.icon,
-      iconPosition: iconPosition
-    }, x.value))
-  });
+      children: e.map((a) => /* @__PURE__ */ l(
+        c,
+        {
+          className: s.tab,
+          value: a.value,
+          label: a.label,
+          icon: a.icon,
+          iconPosition: n
+        },
+        a.value
+      ))
+    }
+  );
 }
-export default function Tabs({
-  tabs,
-  current,
-  onChange,
-  variant,
-  iconPosition,
-  ...rest
-}) {
-  if (variant === 'card') {
-    return /*#__PURE__*/_jsx(CardTabs, {
-      ...rest,
-      tabs: tabs,
-      current: current,
-      onChange: onChange,
-      iconPosition: iconPosition
-    });
-  }
-  if (variant === 'line') {
-    return /*#__PURE__*/_jsx(LineTabs, {
-      ...rest,
-      tabs: tabs,
-      current: current,
-      onChange: onChange,
-      iconPosition: iconPosition
-    });
-  }
-  return /*#__PURE__*/_jsx(StyledMuiTabs, {
-    scrollButtons: "auto",
-    variant: "scrollable",
-    value: current,
-    onChange: (_, newValue) => onChange(newValue),
-    indicatorColor: "primary",
-    ...rest,
-    className: [classes.tabs, rest.className || ''].join(' '),
-    children: tabs.map(x => /*#__PURE__*/_jsx(MuiTab, {
-      className: classes.tab,
-      value: x.value,
-      label: x.label,
-      icon: x.icon,
-      iconPosition: iconPosition
-    }, x.value))
-  });
-}
+function T({ tabs: e, current: t, onChange: r, variant: n, iconPosition: o, ...a }) {
+  return n === "card" ? /* @__PURE__ */ l(f, { ...a, tabs: e, current: t, onChange: r, iconPosition: o }) : n === "line" ? /* @__PURE__ */ l(v, { ...a, tabs: e, current: t, onChange: r, iconPosition: o }) : /* @__PURE__ */ l(
+    m,
+    {
+      scrollButtons: "auto",
+      variant: "scrollable",
+      value: t,
+      onChange: (i, d) => r(d),
+      indicatorColor: "primary",
+      ...a,
+      className: [s.tabs, a.className || ""].join(" "),
+      children: e.map((i) => /* @__PURE__ */ l(
+        c,
+        {
+          className: s.tab,
+          value: i.value,
+          label: i.label,
+          icon: i.icon,
+          iconPosition: o
+        },
+        i.value
+      ))
+    }
+  );
+}
+export {
+  T as default
+};

package/lib/Tag/Tag.stories.d.ts

@@ -0,0 +1,13 @@
+import { default as Basic } from './demo/basic';
+declare namespace _default {
+    let title: string;
+    namespace parameters {
+        namespace docs {
+            namespace description {
+                let component: string;
+            }
+        }
+    }
+}
+export default _default;
+export { Basic };

package/lib/Tag/index.d.ts

@@ -1,14 +1,17 @@
 export default TagComponent;
-export type TypographyProps = import("@mui/material/Typography").TypographyProps;
+export type TypographyProps = import('@mui/material/Typography').TypographyProps;
 export type TagOwnProps = {
     type?: "error" | "warning" | "success" | "primary" | "reverse";
     content?: string;
     className?: string;
-    children: import("react").ReactNode;
-    style?: import("react").CSSProperties;
+    children: import('react').ReactNode;
+    style?: import('react').CSSProperties;
 };
 export type TagProps = TypographyProps & TagOwnProps;
 /**
  * @type {React.ForwardRefExoticComponent<React.PropsWithoutRef<TagProps> & React.RefAttributes<HTMLSpanElement>>}
  */
-declare const TagComponent: React.ForwardRefExoticComponent<React.PropsWithoutRef<TagProps> & React.RefAttributes<HTMLSpanElement>>;
+declare function TagComponent({ ref, ...props }: {
+    [x: string]: any;
+    ref: any;
+}): import("react/jsx-runtime").JSX.Element;

package/lib/Tag/index.js

@@ -1,103 +1,52 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef } from 'react';
-import PropTypes from 'prop-types';
-import Typography from '@mui/material/Typography';
-import { mergeProps } from '../Util';
-import colors from '../Colors';
-import { useTheme, styled } from '../Theme';
-const types = {
+import { jsx as p } from "react/jsx-runtime";
+import r from "prop-types";
+import { Typography as b, useTheme as w } from "@mui/material";
+import t from "lodash/isUndefined";
+import { mergeProps as x } from "../Util/index.js";
+import e from "../Colors/themes/default.js";
+import { styled as T } from "../Theme/index.js";
+const c = {
   error: {
-    color: colors.common.white,
-    backgroundColor: colors.error.main
+    color: e.common.white,
+    backgroundColor: e.error.main
   },
   warning: {
-    color: colors.common.white,
-    backgroundColor: colors.warning.main
+    color: e.common.white,
+    backgroundColor: e.warning.main
   },
   success: {
-    color: colors.common.white,
-    backgroundColor: colors.success.main
+    color: e.common.white,
+    backgroundColor: e.success.main
   },
   primary: {
-    color: colors.common.white,
-    backgroundColor: colors.primary.main
+    color: e.common.white,
+    backgroundColor: e.primary.main
   },
   reverse: {
-    color: '#fff',
-    backgroundColor: '#222'
+    color: "#fff",
+    backgroundColor: "#222"
   }
 };
-
-/**
- * @typedef {import('@mui/material/Typography').TypographyProps} TypographyProps
- * @typedef {{
- *  type?: 'error' | 'warning' | 'success' | 'primary' | 'reverse',
- *  content?: string,
- *  className?: string;
- *  children: import('react').ReactNode,
- *  style?: import('react').CSSProperties
- * }} TagOwnProps
- * @typedef { TypographyProps & TagOwnProps} TagProps
- */
-
-/**
- * @description
- * @param {TagProps} props
- * @return {import('react').ReactNode}
- */
-function Tag(props) {
-  const newProps = mergeProps(props, Tag, ['style']);
-  const {
-    type,
-    content,
-    children,
-    style,
-    className,
-    forwardedRef,
-    ...rest
-  } = newProps;
-  const {
-    palette
-  } = useTheme();
-  const styles = Object.assign({}, types[type] || types.primary, style);
-  if (palette[type]) {
-    Object.assign(styles, {
-      color: palette[type].contrastText || colors.common.white,
-      backgroundColor: palette[type].main
-    });
-  }
-  return /*#__PURE__*/_jsx(Span, {
-    ref: forwardedRef,
-    component: "span",
-    className: className,
-    style: styles,
-    ...rest,
-    children: content || children
-  });
+function a(s) {
+  const o = Object.assign({}, s);
+  t(o.type) && (o.type = "primary"), t(o.content) && (o.content = ""), t(o.style) && (o.style = {}), t(o.className) && (o.className = "");
+  const l = x(o, a, ["style"]), { type: n, content: f, children: y, style: d, className: g, forwardedRef: u, ...h } = l, { palette: i } = w(), m = Object.assign({}, c[n] || c.primary, d);
+  return i[n] && Object.assign(m, {
+    color: i[n].contrastText || e.common.white,
+    backgroundColor: i[n].main
+  }), /* @__PURE__ */ p(j, { ref: u, component: "span", className: g, style: m, ...h, children: f || y });
 }
-Tag.propTypes = {
-  children: PropTypes.any.isRequired,
-  type: PropTypes.oneOf(Object.keys(types)),
-  content: PropTypes.string,
-  className: PropTypes.string,
-  style: PropTypes.oneOfType([PropTypes.object, PropTypes.string])
-};
-Tag.defaultProps = {
-  type: 'primary',
-  content: '',
-  className: '',
-  style: {}
+a.propTypes = {
+  children: r.any.isRequired,
+  type: r.oneOf(Object.keys(c)),
+  content: r.string,
+  className: r.string,
+  style: r.oneOfType([r.object, r.string])
 };
-
-/**
- * @type {React.ForwardRefExoticComponent<React.PropsWithoutRef<TagProps> & React.RefAttributes<HTMLSpanElement>>}
- */
-const TagComponent = /*#__PURE__*/forwardRef((props, ref) => /*#__PURE__*/_jsx(Tag, {
-  ...props,
-  forwardedRef: ref
-}));
-export default TagComponent;
-const Span = styled(Typography)`
+function v({ ref: s, ...o }) {
+  return /* @__PURE__ */ p(a, { ...o, forwardedRef: s });
+}
+const j = T(b)`
   && {
     display: inline-flex;
     justify-content: center;
@@ -109,4 +58,7 @@ const Span = styled(Typography)`
     font-weight: 500;
     border-radius: 4px;
   }
-`;
+`;
+export {
+  v as default
+};

package/lib/TextCollapse/TextCollapse.stories.d.ts

@@ -0,0 +1,28 @@
+export function WithDefaultOptions(): import("react/jsx-runtime").JSX.Element;
+export namespace WithDefaultOptions {
+    let storyName: string;
+}
+export function WithSmallerEndChars(): import("react/jsx-runtime").JSX.Element;
+export namespace WithSmallerEndChars {
+    let storyName_1: string;
+    export { storyName_1 as storyName };
+}
+export function WithLargerStartChars(): import("react/jsx-runtime").JSX.Element;
+export namespace WithLargerStartChars {
+    let storyName_2: string;
+    export { storyName_2 as storyName };
+}
+export function WithLargerFontSize(): import("react/jsx-runtime").JSX.Element;
+export namespace WithLargerFontSize {
+    let storyName_3: string;
+    export { storyName_3 as storyName };
+}
+declare namespace _default {
+    let title: string;
+    namespace parameters {
+        namespace readme {
+            let sidebar: string;
+        }
+    }
+}
+export default _default;