solidjs-community · garth · Jul 21, 2023 · Jul 21, 2023 · Jul 22, 2023 · Jul 23, 2023
diff --git a/.prettierrc.json b/.prettierrc.json
@@ -0,0 +1,6 @@
+{
+  "semi": false,
+  "singleQuote": true,
+  "bracketSameLine": true,
+  "tabWidth": 2
+}
diff --git a/README.md b/README.md
@@ -1,4 +1,3 @@
-
 <h1 align="center">solid-spring</h1>
 <h3 align="center">A port of react-spring, for SolidJS</h3>
 
@@ -24,8 +23,8 @@ const styles = createSpring({
 The API is similar to what we have in react-spring, with small differences to make the library compatible with SolidJS
 
 ## Preview
-Click on the below gifs for exploring the code of each preview (ported from Poimandres examples).
 
+Click on the below gifs for exploring the code of each preview (ported from Poimandres examples).
 
 <p align="middle">
 <a href="https://codesandbox.io/s/spring-gestures-5xb9p8"><img src="https://i.imgur.com/qLKJod3.gif" width="400"/></a>
@@ -37,6 +36,7 @@ Click on the below gifs for exploring the code of each preview (ported from Poim
 ```shell
 npm install solid-spring
 ```
+
 ## Examples
 
 [Hello (opacity animation)](https://codesandbox.io/s/hello-qe3eq5?file=/index.tsx)
@@ -48,10 +48,11 @@ npm install solid-spring
 ## API
 
 ### `createSpring`
+
 > Turns values into animated-values.
 
 ```jsx
-import { createSpring, animated } from "solid-spring";
+import { createSpring, animated } from 'solid-spring'
 
 function ChainExample() {
   const styles = createSpring({
@@ -66,15 +67,19 @@ function ChainExample() {
   return <animated.div style={styles()}>I will fade in and out</animated.div>
 }
 ```
+
 `createSpring` also takes a function in case you want to pass a reactive value as a style!
+
 ```jsx
 const [disabled, setDisabled] = createSignal(false)
 
 const styles = createSpring(() => ({
   pause: disabled(),
 }))
 ```
+
 ### `createSprings`
+
 > Creates multiple springs, each with its own config. Use it for static lists, etc.
 
 Similar to `useSprings` in react-spring, It takes number or a function that returns a number (for reactivity) as the first argument, and a list of springs or a function that returns a spring as the second argument.

diff --git a/demo/.gitignore b/demo/.gitignore
@@ -1,2 +1,2 @@
 node_modules
-dist
+dist
diff --git a/demo/index.html b/demo/index.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
   <head>
     <meta charset="utf-8" />

diff --git a/demo/package.json b/demo/package.json
@@ -2,22 +2,22 @@
   "name": "vite-template-solid",
   "version": "0.0.0",
   "description": "",
+  "license": "MIT",
   "scripts": {
     "start": "vite",
-    "dev": "vite",
+    "dev": "vite --clearScreen=false",
     "build": "vite build",
-    "serve": "vite preview"
-  },
-  "license": "MIT",
-  "devDependencies": {
-    "typescript": "^4.6.3",
-    "vite": "^2.8.6",
-    "vite-plugin-solid": "^2.2.6"
+    "serve": "vite preview",
+    "prettier": "prettier --write \"src/**/*.{js,json,ts,tsx,css,scss,html}\""
   },
   "dependencies": {
-    "@react-spring/animated": "^9.4.4",
-    "@react-spring/core": "^9.4.4",
-    "solid-js": "^1.3.13",
-    "solid-spring": "workspace:^0.0.0"
+    "solid-js": "^1.7.8",
+    "solid-spring": "workspace:^"
+  },
+  "devDependencies": {
+    "prettier": "^3.0.0",
+    "typescript": "^5.1.6",
+    "vite": "^4.4.6",
+    "vite-plugin-solid": "^2.7.0"
   }
 }
diff --git a/demo/src/App.tsx b/demo/src/App.tsx
@@ -1,11 +1,8 @@
-import {
-  Component,
-  createSignal,
-} from "solid-js";
-import { createSpring, animated, config } from "solid-spring";
+import { Component, createSignal } from 'solid-js'
+import { createSpring, animated, config } from 'solid-spring'
 
 function ChainExample() {
-  const [flip, set] = createSignal(false);
+  const [flip, set] = createSignal(false)
 
   const styles = createSpring(() => {
     return {
@@ -16,16 +13,16 @@ function ChainExample() {
       delay: 200,
       config: config.molasses,
       onRest: () => {
-        set(!flip());
+        set(!flip())
       },
-    };
-  });
+    }
+  })
 
-  return <animated.h1 style={styles()}>hello</animated.h1>;
+  return <animated.h1 style={styles()}>hello</animated.h1>
 }
 
 const App: Component = () => {
-  return <ChainExample />;
-};
+  return <ChainExample />
+}
 
-export default App;
+export default App
diff --git a/demo/src/index.tsx b/demo/src/index.tsx
@@ -1,6 +1,6 @@
 /* @refresh reload */
-import { render } from 'solid-js/web';
+import { render } from 'solid-js/web'
 
-import App from './App';
+import App from './App'
 
-render(() => <App />, document.getElementById('root') as HTMLElement);
+render(() => <App />, document.getElementById('root') as HTMLElement)
diff --git a/demo/vite.config.ts b/demo/vite.config.ts
@@ -1,10 +1,12 @@
-import { defineConfig } from 'vite';
-import solidPlugin from 'vite-plugin-solid';
+import { defineConfig } from 'vite'
+import solidPlugin from 'vite-plugin-solid'
 
 export default defineConfig({
   plugins: [solidPlugin()],
+  server: {
+    port: 3000,
+  },
   build: {
     target: 'esnext',
-    polyfillDynamicImport: false,
   },
-});
+})
diff --git a/package.json b/package.json
@@ -1,33 +1,27 @@
 {
   "name": "@monorepo/solid-spring",
   "version": "0.0.0",
+  "description": "Like react-spring, but for SolidJS",
+  "info": "solid-spring is a spring-physics first animation library for SolidJS based on react-spring/core",
+  "license": "MIT",
+  "author": "M. Bagher Abiat",
+  "contributors": [],
+  "homepage": "https://github.com/aslemammad/solid-spring#readme",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/aslemammad/solid-spring.git"
   },
-  "license": "MIT",
   "bugs": {
     "url": "https://github.com/aslemammad/solid-spring/issues"
   },
-  "homepage": "https://github.com/aslemammad/solid-spring#readme",
-  "description": "Like react-spring, but for SolidJS",
-  "info": "solid-spring is a spring-physics first animation library for SolidJS based on react-spring/core",
-  "contributors": [],
-  "scripts": {},
   "keywords": [
     "best_ecosystem",
     "solidhack",
     "react-spring",
     "solid"
   ],
-  "author": "M. Bagher Abiat",
-  "license": "MIT",
+  "scripts": {},
   "devDependencies": {
-    "@rollup/plugin-alias": "^3.1.9",
-    "@rollup/plugin-commonjs": "^21.0.2",
-    "@rollup/plugin-json": "^4.1.0",
-    "@rollup/plugin-node-resolve": "^13.1.3",
-    "esbuild": "^0.14.27",
-    "rollup-plugin-esbuild": "^4.8.2"
+    "prettier": "^3.0.0"
   }
 }