rte repro

r1nzai · Aug 1, 2024 · f2831ff · f2831ff
1 parent b0a5bfe
commit f2831ff
Show file tree

Hide file tree

Showing 9 changed files with 3,667 additions and 1,064 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -28,39 +28,42 @@
     "build-storybook": "storybook build"
   },
   "dependencies": {
-    "@floating-ui/react-dom": "^2.1.0",
-    "@tanstack/react-virtual": "^3.5.1",
+    "@floating-ui/react-dom": "^2.1.1",
+    "@remirror/pm": "^3.0.0",
+    "@remirror/react": "^3.0.0",
+    "@tanstack/react-virtual": "^3.8.1",
     "react": "^18.3.1",
-    "react-dom": "^18.3.1"
+    "react-dom": "^18.3.1",
+    "remirror": "^3.0.0"
   },
   "devDependencies": {
-    "@storybook/addon-essentials": "^8.1.10",
-    "@storybook/addon-interactions": "^8.1.10",
-    "@storybook/addon-links": "^8.1.10",
-    "@storybook/addon-themes": "^8.1.10",
+    "@storybook/addon-essentials": "^8.1.11",
+    "@storybook/addon-interactions": "^8.1.11",
+    "@storybook/addon-links": "^8.1.11",
+    "@storybook/addon-themes": "^8.1.11",
     "@storybook/blocks": "^8.1.10",
     "@storybook/react": "^8.1.10",
-    "@storybook/react-vite": "^8.1.10",
+    "@storybook/react-vite": "^8.1.11",
     "@types/react": "^18.3.3",
     "@types/react-dom": "^18.3.0",
-    "@typescript-eslint/eslint-plugin": "^7.13.1",
-    "@typescript-eslint/parser": "^7.13.1",
+    "@typescript-eslint/eslint-plugin": "^7.15.0",
+    "@typescript-eslint/parser": "^7.15.0",
     "@vitejs/plugin-react-swc": "^3.7.0",
     "autoprefixer": "^10.4.19",
     "eslint": "^8.57.0",
     "eslint-config-prettier": "^9.1.0",
     "eslint-plugin-prettier": "^5.1.3",
-    "eslint-plugin-react": "^7.34.2",
-    "eslint-plugin-simple-import-sort": "^12.1.0",
+    "eslint-plugin-react": "^7.34.3",
+    "eslint-plugin-simple-import-sort": "^12.1.1",
     "eslint-plugin-storybook": "^0.8.0",
     "husky": "^9.0.11",
-    "postcss": "^8.4.38",
+    "postcss": "^8.4.39",
     "prettier": "^3.3.2",
     "prettier-plugin-tailwindcss": "^0.6.5",
-    "storybook": "^8.1.10",
+    "storybook": "^8.1.11",
     "tailwindcss": "^3.4.4",
-    "typescript": "^5.4.5",
-    "vite": "^5.3.1",
+    "typescript": "^5.5.3",
+    "vite": "^5.3.3",
     "vite-plugin-css-injected-by-js": "^3.5.1",
     "vite-plugin-dts": "^3.9.1",
     "vite-tsconfig-paths": "^4.3.2"

diff --git a/packages/collapse/index.stories.tsx b/packages/collapse/index.stories.tsx
@@ -1,9 +1,8 @@
 import { Meta, StoryFn } from '@storybook/react';
 import React, { useRef } from 'react';
-
+import zen from '@zen/zen';
 import Collapse from './index';
 import Badge from '@zen/badge';
-import Container from '@zen/container';
 // More on default export: https://storybook.js.org/docs/react/writing-stories/introduction#default-export
 export default {
     title: 'Collapse',
@@ -15,15 +14,15 @@ const items = Array.from({ length: 100 }, (_, i) => `testItem${i}`);
 const Template: StoryFn<typeof Collapse> = (args) => {
     const ref = useRef<HTMLDivElement>(null);
     return (
-        <Container ref={ref} className="flex w-full items-center gap-1">
+        <zen.div ref={ref} className="flex w-full items-center gap-1">
             <Collapse items={items} parentRef={ref} badgeStyles="h-6">
                 {(item, index) => (
                     <Badge key={index} className="h-6" variant={'secondary'}>
                         {item}
                     </Badge>
                 )}
             </Collapse>
-        </Container>
+        </zen.div>
     );
 };
 

diff --git a/packages/popover/index.tsx b/packages/popover/index.tsx
@@ -20,14 +20,10 @@ const Popover = (props: PopoverProps): JSX.Element => {
         role = 'tooltip',
     } = props;
     const [__internalShow, __setInternalShow] = useState(show);
-    const getShow = () => {
-        return setShow !== undefined && show !== undefined ? show : __internalShow;
-    };
-    const getShowSetter = () => {
-        return setShow !== undefined && show !== undefined ? setShow : __setInternalShow;
-    };
+    const actualShow = setShow !== undefined && show !== undefined ? show : __internalShow;
+    const actualSetShow = setShow !== undefined && show !== undefined ? setShow : __setInternalShow;
     const { x, y, strategy, refs } = useFloating({
-        open: getShow(),
+        open: actualShow,
         middleware: [offset(4), flip(), shift()],
         whileElementsMounted: autoUpdate,
         placement,
@@ -36,7 +32,7 @@ const Popover = (props: PopoverProps): JSX.Element => {
     useEffect(() => {
         return useClickOutside(refs.floating, (outside) => {
             if (outside) {
-                getShowSetter()(false);
+                actualSetShow(false);
             }
         });
     }, []);
@@ -51,11 +47,11 @@ const Popover = (props: PopoverProps): JSX.Element => {
                         if (disabled) {
                             return;
                         }
-                        if (getShow()) {
-                            getShowSetter()(false);
+                        if (actualShow) {
+                            actualSetShow(false);
                             onClose?.();
                         } else {
-                            getShowSetter()(true);
+                            actualSetShow(true);
                             onOpen?.();
                         }
                     }
@@ -66,11 +62,11 @@ const Popover = (props: PopoverProps): JSX.Element => {
             >
                 {children}
             </zen.div>
-            {getShow() &&
+            {actualShow &&
                 createPortal(
                     <zen.div
                         onClick={(e) => e.stopPropagation()}
-                        visible={getShow()}
+                        visible={actualShow}
                         role="tooltip"
                         className={cx(
                             'zen__popover z-50 w-fit rounded border border-border bg-background shadow-secondary',