@meursyphus/flitter 0.0.1 → 0.0.2

package/README.md

@@ -0,0 +1,70 @@
+# Flitter
+
+Flitter is a framework that deals with SVG. Like React, it uses VDOM to manage state and optimize rendering. Since the library directly calculates the layout, it is much easier to visualize data than using D3. This provides a high level of control and flexibility for data visualization.
+
+FlutterJs is a library inspired by Flutter, a cross-platform framework commonly used for mobile app development.
+
+For more details, visit [here](https://flitter.pages.dev).
+
+## Getting Started
+
+Getting started with Flitter is straightforward. Follow these steps to install and use Flitter in your React or Svelte projects. (Or you can implement widget component manually to support Flitter.)
+
+### React
+```bash
+npm i @meursyphus/flitter @meursyphus/flitter-react
+```
+Example of using Flitter widgets in a React component:
+
+```javascript
+import { Container, Alignment, Text, TextStyle } from '@meursyphus/flitter';
+import Widget from '@meursyphus/flitter-react';
+
+const App = () => {
+  return (
+    <Widget
+      width="600px"
+      height="300px"
+      widget={Container({
+        alignment: Alignment.center,
+        color: 'lightblue',
+        child: Text("Hello, Flitter!", style: TextStyle({ fontSize: 30, weight: 'bold' }))
+      })}
+    />
+  );
+};
+```
+### Svelte
+
+```bash
+npm i @meursyphus/flitter @meursyphus/flitter-svelte
+```
+
+```svelte
+<script>
+  import { Container, Alignment, Text, TextStyle } from '@meursyphus/flitter';
+  import Widget from '@meursyphus/flitter-svelte';
+</script>
+
+<Widget
+  width="600px"
+  height="300px"
+  widget={Container({
+    alignment: Alignment.center,
+    color: 'lightblue',
+    child: Text("Hello, Flitter!", style: TextStyle({ fontSize: 30, weight: 'bold' }))
+  })}
+/>
+```
+
+## Features
+
+- Provides high-resolution, resolution-independent visualizations based on SVG
+- Simplifies SVG manipulation with a component-based approach
+- Allows for quick learning and development with a syntax similar to Flutter
+
+## License
+
+Flitter is open-source software freely available under the MIT license.
+
+For more information and documentation, refer to the [Flitter official documentation](https://flitter.pages.dev).

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@meursyphus/flitter",
-  "version": "0.0.1",
+  "version": "0.0.2",
   "description": "A declarative, widget-based library built on SVG for simplifying data visualization with a Flutter-like syntax.",
   "keywords": [
     "flitter",
@@ -13,7 +13,9 @@
   "homepage": "https://flitter.pages.dev",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
-    "build": "tsup && cp package.json dist/package.json && cd dist && npm run fix-package",
+    "build": "tsup && npm run copy-package && npm run copy-readme && cd dist && npm run fix-package",
+    "copy-package": "cp package.json dist/package.json",
+    "copy-readme": "cp README.md dist/README.md",
     "fix-package": "npm pkg set main=./index.cjs module=./index.js exports.default=./index.js exports.import=./index.js",
     "lint": "eslint src/**",
     "postbuild": "echo \"Build complete. Please run: \n\ncd dist\nnpm publish\n\""