v3

darkroomengineering · Aug 19, 2024 · f59bb27 · f59bb27
2 parents c975532 + 9cbc584
commit f59bb27
Show file tree

Hide file tree

Showing 65 changed files with 3,795 additions and 1,719 deletions.
diff --git a/README.md b/README.md
@@ -13,7 +13,7 @@ A collection of Framer Plugins.
 
 Plugins in [Framer](https://www.framer.com/) are small apps that can interact with the Framer editor, enabling you to perform various actions such as inserting images, layers, and components or modifying anything on the canvas. This repository contains a selection of Plugins, capturing a wide range of use cases. The code for which can be found in the [/plugins](https://github.com/framer/plugins/tree/main/plugins) folder. Feel free to clone and build off the existing Plugins, or open a pull reqest with a contribution of your own.
 
-Check out [our documentation](https://developers.framer.wiki/docs/beta) to learn more.
+Check out [our documentation](https://developers.framer.wiki/plugins/docs/beta) to learn more.
 
 <br>
 

diff --git a/package-lock.json b/package-lock.json
diff --git a/plugins/color-extract/framer.json b/plugins/color-extract/framer.json
@@ -2,5 +2,5 @@
     "id": "CbX9_9",
     "name": "Color Extract",
     "icon": "/icon.png",
-    "modes": ["default"]
+    "modes": ["canvas"]
 }
diff --git a/plugins/color-extract/package.json b/plugins/color-extract/package.json
@@ -14,7 +14,7 @@
     "dependencies": {
         "extract-colors": "^4.0.2",
         "framer-motion": "^11.0.18",
-        "framer-plugin": "^0.2.0",
+        "framer-plugin": "^0.3.1",
         "react": "^18",
         "react-dom": "^18",
         "vite-plugin-framer": "^0.0.10",

diff --git a/plugins/concentric/framer.json b/plugins/concentric/framer.json
@@ -2,5 +2,5 @@
     "id": "pEvFy0",
     "name": "Concentric",
     "icon": "/icon.png",
-    "modes": ["default"]
+    "modes": ["canvas"]
 }
diff --git a/plugins/concentric/package.json b/plugins/concentric/package.json
@@ -14,7 +14,7 @@
     "dependencies": {
         "@radix-ui/react-slider": "^1.1.2",
         "framer-motion": "^11.0.8",
-        "framer-plugin": "^0.2.0",
+        "framer-plugin": "^0.3.1",
         "react": "^18",
         "react-dom": "^18",
         "react-slider": "^2.0.6",

diff --git a/plugins/dither/framer.json b/plugins/dither/framer.json
@@ -1,6 +1,6 @@
 {
     "id": "TQeWOY",
     "name": "Dither",
-    "modes": ["default", "editImage", "image"],
+    "modes": ["canvas", "editImage", "image"],
     "icon": "/dither.png"
 }
diff --git a/plugins/dither/package.json b/plugins/dither/package.json
@@ -14,7 +14,7 @@
     },
     "dependencies": {
         "comlink": "^4.4.1",
-        "framer-plugin": "^0.2.0",
+        "framer-plugin": "^0.3.1",
         "ogl": "^1.0.8",
         "react": "^18",
         "react-dom": "^18",

diff --git a/plugins/dither/src/App.tsx b/plugins/dither/src/App.tsx
@@ -183,7 +183,7 @@ function DitherImage({ image }: { image: ImageAsset }) {
         console.log("total duration", performance.now() - start)
     }, [render])
 
-    const [pixelSize, setPixelSize] = useState(1)
+    const [pixelSize, setPixelSize] = useState(2)
 
     useEffect(() => {
         program.pixelSize = pixelSize

diff --git a/plugins/doodles/.eslintrc.js b/plugins/doodles/.eslintrc.js
@@ -0,0 +1,9 @@
+export default {
+    parserOptions: {
+        project: "./tsconfig.json",
+        tsconfigRootDir: __dirname,
+    },
+    rules: {
+        "@typescript-eslint/no-explicit-any": "warn",
+    },
+}
diff --git a/plugins/doodles/.gitignore b/plugins/doodles/.gitignore
@@ -0,0 +1,33 @@
+# IMPORTANT: this .gitignore file is needed because this package is synced with
+# an external repository at this moment: https://github.com/framer/plugin
+
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+
+.pnp.*
+.yarn/*
+!.yarn/patches
+!.yarn/plugins
+!.yarn/releases
+!.yarn/sdks
+!.yarn/versions
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
diff --git a/plugins/doodles/framer.json b/plugins/doodles/framer.json
@@ -0,0 +1,6 @@
+{
+    "id": "rypq3O",
+    "name": "Doodles",
+    "modes": ["canvas"],
+    "icon": "/icon.png"
+}
diff --git a/plugins/doodles/index.html b/plugins/doodles/index.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/framer.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Doodles</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
+</html>
diff --git a/plugins/doodles/package.json b/plugins/doodles/package.json
@@ -0,0 +1,40 @@
+{
+  "name": "doodles",
+  "private": true,
+  "version": "1.0.0",
+  "type": "module",
+  "main": "src/api/index.ts",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build --base=${PREFIX_BASE_PATH:+/$npm_package_name}/",
+    "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "@radix-ui/react-slider": "^1.1.2",
+    "@uiw/react-color": "^2.1.1",
+    "@uiw/react-color-shade-slider": "^2.1.1",
+    "extract-colors": "^4.0.2",
+    "framer-motion": "^11.0.18",
+    "framer-plugin": "^0.3.1",
+    "react": "^18",
+    "react-color": "^2.19.3",
+    "react-dom": "^18",
+    "react-sketch-canvas": "^6.2.0",
+    "svgo": "^3.2.0",
+    "vite-plugin-framer": "^0.0.10",
+    "vite-plugin-mkcert": "^1"
+  },
+  "devDependencies": {
+    "@types/react": "^18",
+    "@types/react-dom": "^18",
+    "@typescript-eslint/eslint-plugin": "^6",
+    "@typescript-eslint/parser": "^6",
+    "@vitejs/plugin-react-swc": "^3",
+    "eslint": "^8",
+    "eslint-plugin-react-hooks": "^4",
+    "eslint-plugin-react-refresh": "^0",
+    "typescript": "^5.3.3",
+    "vite": "^5.2.10"
+  }
+}
diff --git a/plugins/doodles/public/framer.svg b/plugins/doodles/public/framer.svg
diff --git a/plugins/doodles/public/icon.png b/plugins/doodles/public/icon.png
diff --git a/plugins/doodles/readme.md b/plugins/doodles/readme.md
@@ -0,0 +1,5 @@
+# Doodles
+
+Draw anything, just like a Pencil tool.
+
+**By**: @benjamindenboer
-Original file line number
+Diff line change
@@ Expand Up / @@ -13,7 +13,7 @@ A collection of Framer Plugins. @@
     Plugins in [Framer](https://www.framer.com/) are small apps that can interact with the Framer editor, enabling you to perform various actions such as inserting images, layers, and components or modifying anything on the canvas. This repository contains a selection of Plugins, capturing a wide range of use cases. The code for which can be found in the [/plugins](https://github.com/framer/plugins/tree/main/plugins) folder. Feel free to clone and build off the existing Plugins, or open a pull reqest with a contribution of your own.
-    Check out [our documentation](https://developers.framer.wiki/docs/beta) to learn more.
+    Check out [our documentation](https://developers.framer.wiki/plugins/docs/beta) to learn more.
     <br>
@@ Expand Down @@