doc updates

README.md

@@ -20,11 +20,18 @@
 &ndash; Production Ready<br />
 
 ## What is ivue?
-
-`ivue` is &ndash;<br />
+## `ivue` is
+<div style="padding-left:20px; font-size: 1.2rem; line-height: 2rem;">
 &ndash;&nbsp; Simple like Options API<br />
 &ndash;&nbsp; Flexible like Composition API<br />
-&ndash;&nbsp; Extensible like TypeScript Classes API<br />
+&ndash;&nbsp; Extensible like TypeScript Class API<br />
+&ndash;&nbsp; Feature Complete, yet Minimal, Opaque & Unobtrusive<br />
+&ndash;&nbsp; 100% Vue 3 Compatible<br />
+&ndash;&nbsp; 100% Test Covered<br />
+&ndash;&nbsp; 100% Type Safe<br />
+&ndash;&nbsp; Production Ready<br />
+&ndash;&nbsp; Just <code>1.1kb</code> gzipped!<br />
+</div>
 
 `ivue` is a powerful tool because it fully aligns itself with JavaScript / TypeScript Class API.
 

docs/docs/pages/api.md

@@ -39,7 +39,7 @@ This function unwraps the type of any composable return to the bare values witho
 ---
 
 `.init()` method is auto-run on `ivue()` initialization after `constructor()` is run.
-`init()` has access to the reactive state of the object via `this`.
+`.init()` has access to the reactive state of the object via `this`.
 
 :::warning NOTICE
 `.init()` method has no arguments and you should never need to run this method manually.
@@ -61,7 +61,7 @@ function toRefs(props?: (keyof InstanceType<T>)[]): IVueRefs<InstanceType<T>>;
 
 Converts an `ivue` object to a Vue 3 Composable with nested refs.
 
-:::tip You can pass the name of the properties to `toRefs(properties)`
+:::tip You can pass the name of the properties to `.toRefs(properties)`
 ```ts
 const { width, height } = ivue(Box).toRefs(['width', 'height']);
 ```

docs/docs/pages/guidelines.md

@@ -101,7 +101,7 @@ Arrow functions break full extensibility of classes because they carry their own
 
 #### Use `constructor()` to assign properties of the class and cast Refs to Unwrapped bare types. <br />
 
-#### Use `.init()` to declare reactive state functions like `watch`, `watchEffect`, and lifecycle hooks like `onMounted`, `onBeforeMount` etc, do assignments of reactive properties, since `init()` already has access to `reactive()` state through `this`.<br />
+#### Use `.init()` to declare reactive state functions like `watch`, `watchEffect`, and lifecycle hooks like `onMounted`, `onBeforeMount` etc, do assignments of reactive properties, since `.init()` already has access to `reactive()` state through `this`.<br />
 
 <hr />
 

docs/docs/pages/how-its-made.md

@@ -19,7 +19,7 @@ After many iterations where I created a whole inversion of control library for `
 
 In that sweep of clarity, I got rid of 95% of the code that was just extra stuff and not the essence and left only `3` core functions: `ivue()`, `.init()`, `.toRefs()` only which are necessary to do everything `ivue` is set out to do.
 
-Use Composition API composables inside `init()` function.
+Use Composition API composables inside `.init()` function.
 
 ## Minimalism
 

docs/docs/pages/introduction.md

@@ -17,7 +17,13 @@ See: [VueJs.org – Reactivity Transform](https://vuejs.org/guide/extras/rea
 <div style="padding-left:20px; font-size: 1.2rem; line-height: 2rem;">
 &ndash;&nbsp; Simple like Options API<br />
 &ndash;&nbsp; Flexible like Composition API<br />
-&ndash;&nbsp; Extensible like TypeScript Classes API<br />
+&ndash;&nbsp; Extensible like TypeScript Class API<br />
+&ndash;&nbsp; Feature Complete, yet Minimal, Opaque & Unobtrusive<br />
+&ndash;&nbsp; 100% Vue 3 Compatible<br />
+&ndash;&nbsp; 100% Test Covered<br />
+&ndash;&nbsp; 100% Type Safe<br />
+&ndash;&nbsp; Production Ready<br />
+&ndash;&nbsp; Just <code>1.1kb</code> gzipped!<br />
 </div>
 
 `ivue` is a powerful tool because it fully aligns itself with JavaScript / TypeScript Class API.

docs/docs/pages/usage.md

@@ -305,7 +305,7 @@ The result of this example is identical to the above.
 ## Using Watch
 
 To use `watch`, `watchEffect`, and other reactive functions, declare `.init()` method in the class.
-See the highlighted sections related to using `init()` below:
+See the highlighted sections related to using `.init()` below:
 
 ::: code-group
 <<< @/components/usage/CounterWatch.vue{6-13 vue:line-numbers}
@@ -329,11 +329,11 @@ See the highlighted sections related to using `init()` below:
 
 ## Using Lifecycle Hooks
 
-To use `onMounted`, `onBeforeMount` and other lifecycle, declare `.init()` method in the class.
-See the highlighted sections related to using `init()` below:
+To use `onMounted`, `onBeforeMount` and other lifecycle hooks, declare `.init()` method in the class.
+See the highlighted sections related to using `.init()` below:
 
 ::: tip NOTICE:
-`init()` method can be declared as `async` if needed.
+`.init()` method can be declared as `async` if needed.
 :::
 
 ::: code-group