chore: fix build

Author: huccct

.circleci/config.yml

@@ -16,7 +16,7 @@ jobs:
             source $BASH_ENV
       - run:
           name: Build package
-          command: cd packages/react-drager && bun install && bun run build
+          command: bun install && bun run build
       - persist_to_workspace:
           root: .
           paths:

.gitignore

@@ -38,4 +38,7 @@ yarn-error.log*
 *.pem
 
 # idea
-.idea
+.idea
+
+# meta
+meta.json

bun.lockb

@@ -1 +1 @@
-{"inputs":{"packages/react-drager/src/components/anchor/index.css":{"bytes":480,"imports":[]},"packages/react-drager/src/components/anchor/index.tsx":{"bytes":2051,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"packages/react-drager/src/components/anchor/index.css","kind":"import-statement","original":"./index.css"},{"path":"react/jsx-runtime","kind":"import-statement","external":true}],"format":"esm"},"packages/react-drager/src/components/resize-handle/index.css":{"bytes":966,"imports":[]},"packages/react-drager/src/components/resize-handle/index.tsx":{"bytes":315,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"packages/react-drager/src/components/resize-handle/index.css","kind":"import-statement","original":"./index.css"},{"path":"react/jsx-runtime","kind":"import-statement","external":true}],"format":"esm"},"packages/react-drager/src/icons/rotate.svg":{"bytes":265,"imports":[]},"packages/react-drager/src/utils/connection.ts":{"bytes":1831,"imports":[],"format":"esm"},"packages/react-drager/src/utils/utils.ts":{"bytes":626,"imports":[],"format":"esm"},"packages/react-drager/src/utils/connection-manager.ts":{"bytes":13202,"imports":[{"path":"packages/react-drager/src/utils/utils.ts","kind":"import-statement","original":"./utils"}],"format":"esm"},"packages/react-drager/src/utils/dom.ts":{"bytes":174,"imports":[],"format":"esm"},"packages/react-drager/src/utils/guideline-manager.ts":{"bytes":2491,"imports":[],"format":"esm"},"packages/react-drager/src/utils/snap.ts":{"bytes":1918,"imports":[],"format":"esm"},"packages/react-drager/src/utils/index.ts":{"bytes":171,"imports":[{"path":"packages/react-drager/src/utils/connection.ts","kind":"import-statement","original":"./connection"},{"path":"packages/react-drager/src/utils/connection-manager.ts","kind":"import-statement","original":"./connection-manager"},{"path":"packages/react-drager/src/utils/dom.ts","kind":"import-statement","original":"./dom"},{"path":"packages/react-drager/src/utils/guideline-manager.ts","kind":"import-statement","original":"./guideline-manager"},{"path":"packages/react-drager/src/utils/snap.ts","kind":"import-statement","original":"./snap"},{"path":"packages/react-drager/src/utils/utils.ts","kind":"import-statement","original":"./utils"}],"format":"esm"},"packages/react-drager/src/Drager.tsx":{"bytes":20417,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"packages/react-drager/src/components/anchor/index.tsx","kind":"import-statement","original":"./components/anchor"},{"path":"packages/react-drager/src/components/resize-handle/index.tsx","kind":"import-statement","original":"./components/resize-handle"},{"path":"packages/react-drager/src/icons/rotate.svg","kind":"import-statement","original":"./icons/rotate.svg"},{"path":"packages/react-drager/src/utils/index.ts","kind":"import-statement","original":"./utils"},{"path":"react/jsx-runtime","kind":"import-statement","external":true}],"format":"esm"},"packages/react-drager/src/index.ts":{"bytes":25,"imports":[{"path":"packages/react-drager/src/Drager.tsx","kind":"import-statement","original":"./Drager"}],"format":"esm"}},"outputs":{"packages/react-drager/dist/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":69029},"packages/react-drager/dist/index.mjs":{"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react/jsx-runtime","kind":"import-statement","external":true},{"path":"react/jsx-runtime","kind":"import-statement","external":true},{"path":"react/jsx-runtime","kind":"import-statement","external":true}],"exports":["Drager"],"entryPoint":"packages/react-drager/src/index.ts","cssBundle":"packages/react-drager/dist/index.css","inputs":{"packages/react-drager/src/Drager.tsx":{"bytesInOutput":8230},"packages/react-drager/src/components/anchor/index.tsx":{"bytesInOutput":956},"packages/react-drager/src/components/anchor/index.css":{"bytesInOutput":0},"packages/react-drager/src/components/resize-handle/index.css":{"bytesInOutput":0},"packages/react-drager/src/components/resize-handle/index.tsx":{"bytesInOutput":134},"packages/react-drager/src/icons/rotate.svg":{"bytesInOutput":296},"packages/react-drager/src/utils/connection.ts":{"bytesInOutput":388},"packages/react-drager/src/utils/index.ts":{"bytesInOutput":0},"packages/react-drager/src/utils/utils.ts":{"bytesInOutput":118},"packages/react-drager/src/utils/connection-manager.ts":{"bytesInOutput":6355},"packages/react-drager/src/utils/dom.ts":{"bytesInOutput":76},"packages/react-drager/src/utils/guideline-manager.ts":{"bytesInOutput":1328},"packages/react-drager/src/utils/snap.ts":{"bytesInOutput":617},"packages/react-drager/src/index.ts":{"bytesInOutput":0}},"bytes":18555},"packages/react-drager/dist/index.css.map":{"imports":[],"exports":[],"inputs":{},"bytes":2623},"packages/react-drager/dist/index.css":{"imports":[],"inputs":{"packages/react-drager/src/components/anchor/index.css":{"bytesInOutput":305},"packages/react-drager/src/components/resize-handle/index.css":{"bytesInOutput":769}},"bytes":1113}}}
+{"inputs":{"packages/react-drager/src/components/anchor/index.css":{"bytes":480,"imports":[]},"packages/react-drager/src/components/anchor/index.tsx":{"bytes":2051,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"packages/react-drager/src/components/anchor/index.css","kind":"import-statement","original":"./index.css"},{"path":"react/jsx-runtime","kind":"import-statement","external":true}],"format":"esm"},"packages/react-drager/src/components/resize-handle/index.css":{"bytes":966,"imports":[]},"packages/react-drager/src/components/resize-handle/index.tsx":{"bytes":316,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"packages/react-drager/src/components/resize-handle/index.css","kind":"import-statement","original":"./index.css"},{"path":"react/jsx-runtime","kind":"import-statement","external":true}],"format":"esm"},"packages/react-drager/src/icons/rotate.svg":{"bytes":265,"imports":[]},"packages/react-drager/src/utils/connection.ts":{"bytes":1831,"imports":[],"format":"esm"},"packages/react-drager/src/utils/utils.ts":{"bytes":626,"imports":[],"format":"esm"},"packages/react-drager/src/utils/connection-manager.ts":{"bytes":13202,"imports":[{"path":"packages/react-drager/src/utils/utils.ts","kind":"import-statement","original":"./utils"}],"format":"esm"},"packages/react-drager/src/utils/dom.ts":{"bytes":174,"imports":[],"format":"esm"},"packages/react-drager/src/utils/guideline-manager.ts":{"bytes":2491,"imports":[],"format":"esm"},"packages/react-drager/src/utils/snap.ts":{"bytes":1918,"imports":[],"format":"esm"},"packages/react-drager/src/utils/index.ts":{"bytes":171,"imports":[{"path":"packages/react-drager/src/utils/connection.ts","kind":"import-statement","original":"./connection"},{"path":"packages/react-drager/src/utils/connection-manager.ts","kind":"import-statement","original":"./connection-manager"},{"path":"packages/react-drager/src/utils/dom.ts","kind":"import-statement","original":"./dom"},{"path":"packages/react-drager/src/utils/guideline-manager.ts","kind":"import-statement","original":"./guideline-manager"},{"path":"packages/react-drager/src/utils/snap.ts","kind":"import-statement","original":"./snap"},{"path":"packages/react-drager/src/utils/utils.ts","kind":"import-statement","original":"./utils"}],"format":"esm"},"packages/react-drager/src/Drager.tsx":{"bytes":20417,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"packages/react-drager/src/components/anchor/index.tsx","kind":"import-statement","original":"./components/anchor"},{"path":"packages/react-drager/src/components/resize-handle/index.tsx","kind":"import-statement","original":"./components/resize-handle"},{"path":"packages/react-drager/src/icons/rotate.svg","kind":"import-statement","original":"./icons/rotate.svg"},{"path":"packages/react-drager/src/utils/index.ts","kind":"import-statement","original":"./utils"},{"path":"react/jsx-runtime","kind":"import-statement","external":true}],"format":"esm"},"packages/react-drager/src/index.ts":{"bytes":25,"imports":[{"path":"packages/react-drager/src/Drager.tsx","kind":"import-statement","original":"./Drager"}],"format":"esm"}},"outputs":{"packages/react-drager/dist/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":69031},"packages/react-drager/dist/index.mjs":{"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react/jsx-runtime","kind":"import-statement","external":true},{"path":"react/jsx-runtime","kind":"import-statement","external":true},{"path":"react/jsx-runtime","kind":"import-statement","external":true}],"exports":["Drager"],"entryPoint":"packages/react-drager/src/index.ts","cssBundle":"packages/react-drager/dist/index.css","inputs":{"packages/react-drager/src/Drager.tsx":{"bytesInOutput":8230},"packages/react-drager/src/components/anchor/index.tsx":{"bytesInOutput":956},"packages/react-drager/src/components/anchor/index.css":{"bytesInOutput":0},"packages/react-drager/src/components/resize-handle/index.css":{"bytesInOutput":0},"packages/react-drager/src/components/resize-handle/index.tsx":{"bytesInOutput":134},"packages/react-drager/src/icons/rotate.svg":{"bytesInOutput":296},"packages/react-drager/src/utils/connection.ts":{"bytesInOutput":388},"packages/react-drager/src/utils/index.ts":{"bytesInOutput":0},"packages/react-drager/src/utils/utils.ts":{"bytesInOutput":118},"packages/react-drager/src/utils/connection-manager.ts":{"bytesInOutput":6355},"packages/react-drager/src/utils/dom.ts":{"bytesInOutput":76},"packages/react-drager/src/utils/guideline-manager.ts":{"bytesInOutput":1328},"packages/react-drager/src/utils/snap.ts":{"bytesInOutput":617},"packages/react-drager/src/index.ts":{"bytesInOutput":0}},"bytes":18555},"packages/react-drager/dist/index.css.map":{"imports":[],"exports":[],"inputs":{},"bytes":2623},"packages/react-drager/dist/index.css":{"imports":[],"inputs":{"packages/react-drager/src/components/anchor/index.css":{"bytesInOutput":305},"packages/react-drager/src/components/resize-handle/index.css":{"bytesInOutput":769}},"bytes":1113}}}

meta.json

@@ -21,7 +21,6 @@
     "eslint": "^9.16.0",
     "open-cli": "^8.0.0",
     "prettier": "^3.2.5",
-    "rollup-plugin-visualizer": "^5.14.0",
     "turbo": "^2.3.3",
     "typescript": "5.5.4"
   },

package.json

@@ -1,12 +1,70 @@
 'use client'
 import type { ResizeHandleProps } from '../../types'
 import React from 'react'
-import './index.css'
+
+const styles = {
+  'resizeHandle': {
+    'position': 'absolute',
+    'width': '8px',
+    'height': '8px',
+    'background': 'white',
+    'border': '1px solid #3b82f6',
+    'borderRadius': '4px',
+    'transition': 'background-color 0.2s',
+    ':hover': {
+      background: '#3b82f6',
+    },
+  },
+  'right': {
+    right: '-4px',
+    top: '50%',
+    transform: 'translateY(-50%)',
+    cursor: 'e-resize',
+  },
+  'left': {
+    left: '-4px',
+    top: '50%',
+    transform: 'translateY(-50%)',
+    cursor: 'w-resize',
+  },
+  'top': {
+    top: '-4px',
+    left: '50%',
+    transform: 'translateX(-50%)',
+    cursor: 'n-resize',
+  },
+  'bottom': {
+    bottom: '-4px',
+    left: '50%',
+    transform: 'translateX(-50%)',
+    cursor: 's-resize',
+  },
+  'top-right': {
+    top: '-4px',
+    right: '-4px',
+    cursor: 'ne-resize',
+  },
+  'top-left': {
+    top: '-4px',
+    left: '-4px',
+    cursor: 'nw-resize',
+  },
+  'bottom-right': {
+    bottom: '-4px',
+    right: '-4px',
+    cursor: 'se-resize',
+  },
+  'bottom-left': {
+    bottom: '-4px',
+    left: '-4px',
+    cursor: 'sw-resize',
+  },
+} as const
 
 export const ResizeHandle: React.FC<ResizeHandleProps> = ({ position, onMouseDown }) => {
   return (
     <div
-      className={`resize-handle ${position}`}
+      style={{ ...styles.resizeHandle, ...styles[position] }}
       onMouseDown={onMouseDown}
     />
   )

packages/react-drager/src/components/resize-handle/index.css

@@ -0,0 +1,4 @@
+declare module '*.module.css' {
+  const classes: { [key: string]: string }
+  export default classes
+}

packages/react-drager/src/components/resize-handle/index.tsx

@@ -1,3 +1,4 @@
+import fs from 'node:fs'
 import { defineConfig } from 'tsup'
 
 export default defineConfig({
@@ -6,14 +7,22 @@ export default defineConfig({
   dts: true,
   splitting: false,
   sourcemap: true,
-  clean: true,
+  clean: false,
   treeshake: true,
   minify: true,
   external: ['react'],
   esbuildOptions(options) {
     options.loader = {
       ...options.loader,
-      '.svg': 'dataurl', // 处理 SVG 文件
+      '.svg': 'dataurl', // handle svg
     }
   },
+  onSuccess: async () => {
+    const files = ['dist/index.cjs.map', 'dist/index.js.map']
+    files.forEach((file) => {
+      if (fs.existsSync(file)) {
+        fs.unlinkSync(file)
+      }
+    })
+  },
 })