chore(packages): use temporary scope name

packages/background/README.md

@@ -1,10 +1,10 @@
-# @react-flow/background
+# @rctflw/background
 
 Background component for React Flow.
 
 ## Installation 
 
 ```sh 
-npm install @react-flow/background
+npm install @rctflw/background
 ```
 

packages/background/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "@react-flow/background",
+  "name": "@rctflw/background",
   "version": "11.0.0-next.0",
   "description": "Background component with different variants for React Flow",
   "keywords": [
@@ -13,9 +13,9 @@
   "files": [
     "dist"
   ],
-  "main": "dist/react-flow-background.cjs.js",
-  "module": "dist/react-flow-background.esm.js",
-  "types": "dist/react-flow-background.cjs.d.ts",
+  "main": "dist/rctflw-background.cjs.js",
+  "module": "dist/rctflw-background.esm.js",
+  "types": "dist/rctflw-background.cjs.d.ts",
   "sideEffects": false,
   "license": "MIT",
   "repository": {
@@ -25,7 +25,7 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.18.9",
-    "@react-flow/core": "workspace:*",
+    "@rctflw/core": "workspace:*",
     "classcat": "^5.0.3"
   },
   "peerDependencies": {

packages/background/src/Background.tsx

@@ -1,6 +1,6 @@
 import { memo, useRef, useId } from 'react';
 import cc from 'classcat';
-import { useStore, ReactFlowState } from '@react-flow/core';
+import { useStore, ReactFlowState } from '@rctflw/core';
 
 import { BackgroundProps, BackgroundVariant } from './types';
 import { DotPattern, LinePattern } from './Patterns';
@@ -39,15 +39,10 @@ function Background({
   const isDots = variant === BackgroundVariant.Dots;
   const isCross = variant === BackgroundVariant.Cross;
   const gapXY: [number, number] = Array.isArray(gap) ? gap : [gap, gap];
-  const scaledGap: [number, number] = [
-    gapXY[0] * tScale || 1,
-    gapXY[1] * tScale || 1,
-  ];
+  const scaledGap: [number, number] = [gapXY[0] * tScale || 1, gapXY[1] * tScale || 1];
   const scaledSize = patternSize * tScale;
 
-  const patternDimensions: [number, number] = isCross
-    ? [scaledSize, scaledSize]
-    : scaledGap;
+  const patternDimensions: [number, number] = isCross ? [scaledSize, scaledSize] : scaledGap;
 
   const patternOffset = isDots
     ? [scaledSize / 2, scaledSize / 2]
@@ -78,20 +73,10 @@ function Background({
         {isDots ? (
           <DotPattern color={patternColor} radius={scaledSize / 2} />
         ) : (
-          <LinePattern
-            dimensions={patternDimensions}
-            color={patternColor}
-            lineWidth={lineWidth}
-          />
+          <LinePattern dimensions={patternDimensions} color={patternColor} lineWidth={lineWidth} />
         )}
       </pattern>
-      <rect
-        x="0"
-        y="0"
-        width="100%"
-        height="100%"
-        fill={`url(#${patternId})`}
-      />
+      <rect x="0" y="0" width="100%" height="100%" fill={`url(#${patternId})`} />
     </svg>
   );
 }