@hsu-react/ui 1.0.0 → 2.0.0

package/src/components/Button/ChakraButton/index.module.scss

@@ -1,20 +0,0 @@
-.button {
-  display: inline-flex;
-  align-items: center;
-  column-gap: 4px;
-
-  height: 32px;
-  padding: 0px 12px;
-
-  font-size: 14px;
-  font-weight: normal;
-
-  .icon {
-    font-size: 16px;
-
-    svg {
-      width: max-content;
-      height: max-content;
-    }
-  }
-}

package/src/components/Button/ChakraButton/index.tsx

@@ -1,83 +0,0 @@
-import React, { ReactNode } from "react";
-import { Button, ButtonProps } from "@chakra-ui/react";
-import usePermissions from "../../../hooks/usePermissions";
-import styles from "./index.module.scss";
-import classNames from "classnames";
-import ChakraRoot from "../../ChakraRoot";
-
-export interface ChakraButtonProps extends ButtonProps {
-  hasPermi?: string[];
-  hidden?: boolean;
-  iconPosition?: "start" | "end";
-  icon?: ReactNode;
-  reRender?: (btn: React.ReactElement) => ReactNode;
-}
-
-const ChakraButton: React.FC<ChakraButtonProps> = (props) => {
-  const {
-    hasPermi,
-    hidden,
-    iconPosition = "start",
-    className,
-    children,
-    title,
-    icon,
-    reRender,
-    ...buttonConfig
-  } = props;
-  const { permitted } = usePermissions(hasPermi);
-
-  if (!permitted || hidden) {
-    return null;
-  }
-
-  if (reRender) {
-    return (
-      <ChakraRoot>
-        {reRender(
-          <Button
-            {...buttonConfig}
-            className={classNames(className, styles.button, {
-              [styles[iconPosition]]: iconPosition,
-            })}
-            children={
-              <>
-                {iconPosition === "start" && icon && (
-                  <span className={styles.icon}>{icon}</span>
-                )}
-                {children ?? title}
-                {iconPosition === "end" && icon && (
-                  <span className={styles.icon}>{icon}</span>
-                )}
-              </>
-            }
-          />,
-        )}
-      </ChakraRoot>
-    );
-  }
-
-  return (
-    <ChakraRoot>
-      <Button
-        {...buttonConfig}
-        className={classNames(className, styles.button, {
-          [styles[iconPosition]]: iconPosition,
-        })}
-        children={
-          <>
-            {iconPosition === "start" && icon && (
-              <span className={styles.icon}>{icon}</span>
-            )}
-            {children ?? title}
-            {iconPosition === "end" && icon && (
-              <span className={styles.icon}>{icon}</span>
-            )}
-          </>
-        }
-      />
-    </ChakraRoot>
-  );
-};
-
-export default ChakraButton;

package/src/components/ChakraRoot/index.tsx

@@ -1,43 +0,0 @@
-import React from "react";
-import { ChakraProvider, createSystem, defaultConfig } from "@chakra-ui/react";
-import createCache from "@emotion/cache";
-import { CacheProvider } from "@emotion/react";
-
-/**
- * Provider shell for chakra.
- *
- * These two providers used to be mounted by the consumer at the application entry, wrapping
- * the whole tree — which pulled `@chakra-ui/react` + `@emotion/*` + zag-js (about 570 KB in
- * total) into the initial bundle unconditionally, even though Button.Chakra is the only thing
- * that actually uses chakra.
- *
- * Changed to "whoever uses it wraps it": ChakraButton wraps itself (it is already a lazy chunk,
- * so chakra travels with it), and the consumer entry no longer needs a global provider, which
- * takes chakra out of the initial bundle entirely.
- *
- * Both system and cache are module-level singletons, so wrapping in several places does not
- * create duplicates; nested wrapping passes the very same instance and is idempotent. The cache
- * keeps `prepend: true` so chakra's style tags are inserted near the top of head — lower
- * priority than antd — matching the previous behaviour.
- */
-const cache = createCache({
-  key: "css",
-  prepend: true,
-});
-
-const system = createSystem(defaultConfig, {
-  disableLayers: true,
-  preflight: false,
-});
-
-export interface ChakraRootProps {
-  children?: React.ReactNode;
-}
-
-const ChakraRoot: React.FC<ChakraRootProps> = ({ children }) => (
-  <CacheProvider value={cache}>
-    <ChakraProvider value={system}>{children}</ChakraProvider>
-  </CacheProvider>
-);
-
-export default ChakraRoot;