ivue 1.5.2 → 1.5.4

package/docs/docs/components/usage/classes/CustomMouse.ts

@@ -1,23 +0,0 @@
-import { useMouse } from '@vueuse/core';
-import { iref, iuse, type Use } from 'ivue';
-
-type UseMouse = Use<typeof useMouse>;
-
-export class CustomMouse {
-  x: UseMouse['x'];
-  y: UseMouse['y'];
-
-  _sum = iref(0);
-
-  constructor(public requiredProp: number) {
-    ({ x: this.x, y: this.y } = iuse(useMouse));
-  }
-
-  sum() {
-    this._sum = this.x + this.y + this.requiredProp;
-  }
-
-  get total() {
-    return this._sum;
-  }
-}

package/docs/docs/components/usage/functions/useCustomMouse.ts

@@ -1,25 +0,0 @@
-import { computed, ref } from 'vue';
-import { useMouse } from '@vueuse/core';
-
-export function useCustomMouse(requiredProp: number) {
-  const { x, y } = useMouse();
-
-  const _sum = ref(0);
-
-  function sum() {
-    _sum.value = x.value + y.value + requiredProp;
-  }
-
-  const total = computed(() => {
-    // Returning without .value, not entirely correctly, but will still work in Vue template.
-    // This is to test the impressive IVue unwrapping capabilities of deeply nested and confusing Refs
-    return _sum;
-  });
-
-  return {
-    x,
-    y,
-    sum,
-    total,
-  };
-}

package/docs/docs/index.md

@@ -1,53 +0,0 @@
-<script setup lang="ts">
-import Button from './components/Button.vue'
-
-</script>
-# <span style="font-family: 'Public Sans'; ">ivue ∞ Infinite Vue</span> Documentation
-
-
-## About
-
-**<span style="font-family: 'Public Sans'; font-size: 125%;">ivue ∞ Infinite Vue</span>** is a class based composable architecture for Vue 3, that unlocks infinite scalability for Vue 3 based apps. It allows you to extend the regular Vue 3 in a simple and elegant Object Oriented way.
-
-## `ivue` is
-
-
-<div style="padding-left:20px; font-size: 20px; line-height: 32px;">
-∞&nbsp; Simple like Options API<br />
-∞&nbsp; Flexible like Composition API<br />
-∞&nbsp; Extensible like TypeScript Class API<br />
-∞&nbsp; Robust, Minimal, Opaque & Unobtrusive<br />
-∞&nbsp; 100% VSCode / Intellij IDE Autocomplete Intellisense<br />
-∞&nbsp; 100% Vue 3 Compatible<br />
-∞&nbsp; 100% Test Covered<br />
-∞&nbsp; 100% Type Safe<br />
-∞&nbsp; Production Ready<br />
-∞&nbsp; Just <code>1.1kb</code> gzipped!<br />
-</div>
-
-
-## Features
-<div style="padding-left:20px; font-size: 18px;line-height: 28px; ">
-&mdash;&nbsp; Extensible Classes using JavaScript / TypeScript native Class API<br />
-&mdash;&nbsp; Can be used as a Global Store and a ViewModel for Components<br />
-&mdash;&nbsp; Enhances Extensibility of Props Defaults, Props, Slots<br />
-&mdash;&nbsp; Improves DX by elegantly dealing with <code>.value</code><br />
-&mdash;&nbsp; Allows for Fully Extensible Component Architecture<br />
-&mdash;&nbsp; Extends Vue 3 TypeScript Capability<br />
-&mdash;&nbsp; Zero dependencies except Vue 3<br />
-</div>
-
-
-
-## Philosophy
-<center>
-Perfection is achieved, not when there is nothing more to add, <br />
-but when there is nothing left to take away.  
-
-<div style="padding-top: 5px; color:#888; font-size: 90%;">― Antoine de Saint-Exupéry</div>
-</center>
-
-## Next Step
-
-<Button href="/pages/getting-started.html" label="Geting Started" />  &nbsp; or &nbsp; <Button href="/pages/introduction.html" label="Read Introduction" />
-

package/docs/docs/pages/advanced-usage.md

@@ -1,12 +0,0 @@
-<script setup lang="ts">
-</script>
-## Extend Props
-### Typed Props
-### Runtime Props
-## Extend Props Defaults
-### Runtime Props
-## Extend Emits
-## Extend Slots
-## Extend Classes
-## Extend Components
-## Convert Legacy Classes to Reactive Classes with `ivue` {#legacy-to-reactive}

package/docs/docs/pages/api.md

@@ -1,129 +0,0 @@
-<script setup lang="ts">
-</script>
-
-# API
-
-## Core Functions
-
-### `ivue()`
-
----
-
-```ts
-export function ivue<T extends AnyClass>(
-  className: T,
-  ...args: InferredArgs<T>
-): IVue<T>;
-```
-
-Core `ivue(className, ...args)` initializer is able to infer and validate the constrcutor argument types of AnyClass and passes those arguments to the constructor of `AnyClass` internally.
-
-`ivue(className, arg1, arg2, arg3...)` allows you to pass any number of arguments into the class `constructor(arg1, arg2, arg3...)`
-
-`ivue()` initializer function returns an extended Vue 3 `reactive()` object in which getters and setters are internally converted to computeds and adds `.toRefs()` method to the created object. Computeds auto-unwrap themselves when they are accessed as a reactive object property, so the `.value` properties and computeds get flattened in the resulting object and do not require `.value` to be accessed.
-
-`ivue()` replicates native JavaScript / TypeScript class implementation by extending descriptors (getters and setters) up the whole prototype ancestors chain thus supporting classical inheritance.
-
-**Returns:** `<IVue<T>>` or `ivue` `reactive()` object of an `AnyClass` class with flattened (de-Refed) `Refs` and `ComputedRefs` as properties.
-
-### `iref()`
-
-Is simply an alias to Vue 3 `ref()` function but casts the type to the internal unreactive type, because properties auto-unwrap in `reactive()` object that is being created by `ivue` upon initialization.
-
-### `ishallowRef()`
-
-Is simply an alias Vue 3 `shallowRef()` function but casts the type to the internal unreactive type, because properties auto-unwrap in `reactive()` object that is being created by `ivue` upon initialization.
-
-### `iuse()`
-
-
-This function unwraps the type of any composable return to the bare values without `.value`, because properties auto-unwrap in `reactive()` object that is being created by `ivue` upon initialization.
-
-## Core Methods
-### `.constructor()`
-Native Class API `.constructor()` is mainly used to assign and cast Vue 3 Refs back to their original types. `.constructor()` should not be used to work with reactive state. Use `.init()` for reactive purposes.
-
-### `.init()`
-
----
-
-`.init()` method is auto-run on `ivue()` initialization after `.constructor()` is run.
-`.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.
-:::
-
-:::tip NEED ASYNC/AWAIT?
-Use `async init()` if you need `await` functionality.
-:::
-
-**Returns:** `void | Promise<void>`
-
-### `.toRefs()`
-
----
-
-```ts
-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)`
-```ts
-const { width, height } = ivue(Box).toRefs(['width', 'height']);
-```
-This improves performance if `box` has many other properties that we do not need.
-:::
-
-**Returns:** `IVueRefs<InstanceType<T>>`
-
-## Core Types
-
-### `IVue` {#IVue}
-
-### `Use` {#Use}
-
-
-## Utility Functions
-
-### `propsWithDefaults()`
-
----
-
-```ts
-export function propsWithDefaults<T extends VuePropsObject>(
-  defaults: Record<string, any>,
-  typedProps: T
-): VuePropsWithDefaults<T>;
-```
-
-Combines statically written defaults object with the runtime type definition of Vue 3 props.
-
-**Returns:** `VuePropsWithDefaults<T>`
-
-## Utility Types
-
----
-
-Extracts and unwraps (de-Refs) the real types of Vue 3 composable definition to make it compatible with `ivue`.
-
-### `ExtractPropDefaultTypes`
-
-Extracts types of the default types definition. This type can be used to validate against the actual defaults definition to make sure both definitions are in sync.
-
----
-
-### `ExtractEmitTypes`
-
----
-
-Extracts types of a runtime emits declaration.
-
-### `ExtendSlots`
-
----
-
-Allows you to extend slots of a given slot interface.
-

package/docs/docs/pages/browse-code.md

@@ -1,18 +0,0 @@
----
-aside: false
----
-# Source code
-Or [Browse the source code on GitHub](https://github.com/infinite-system/ivue/blob/main/lib/ivue.ts)
-
-## Install by Copying
-
-`ivue` is designed to be easily shareable and installable so if you are running TypeScript, you can just copy the
-`ivue.ts` into your repo and you are done:
-
-::: tip NOTE
-This installation path is recommended only if you quickly want to tinker with the internals of ivue, as you won't be getting the latest updates. Also note that this code comes from github `main` branch latest which might also be in beta and not fully published to `npm`.
-:::
-
-:::code-group
-<<< ../../../lib/ivue.ts{ts:line-numbers} [ivue.ts]
-:::

package/docs/docs/pages/getting-started.md

@@ -1,32 +0,0 @@
-# Getting Started
-
-## Install
-
-The only dependency for `ivue` is Vue 3, so it is easy to get started.
-
-In your terminal install `ivue` using:
-```bash
-# yarn
-yarn add ivue
-
-# npm
-npm i ivue
-
-# pnpm
-pnpm i ivue
-```
-
-## Install by Copying
-
-`ivue` is designed to be easily shareable and installable so if you are running TypeScript, you can just copy the
-`ivue.ts` into your repo and you are done:
-:::details Click to expand the latest `ivue` source code to copy
-
-:::code-group
-<<< ../../../lib/ivue.ts{ts:line-numbers} [ivue.ts]
-:::
-Or [Copy from GitHub](https://github.com/infinite-system/ivue/blob/main/lib/ivue.ts)
-
-::: tip NOTE
-This installation path is recommended only if you quickly want to tinker with the internals of ivue, as you won't be getting the latest updates. Also note that this code comes from github `main` branch latest which might also be in beta and not fully published to `npm`.
-:::

package/docs/docs/pages/guidelines.md

@@ -1,139 +0,0 @@
-<script setup lang="ts">
-  import CounterExternalRefsDetailed from '../components/guidelines/CounterExternalRefsDetailed.vue';
-</script>
-
-# Guidelines
-
-## Dos and Don'ts
-
-```ts
-type UseMouse = Use<typeof useMouse>;
-/**
- * Example of a properly defined ivue class.
- */
-class Counter {
-  /** ✓ Properly declared unwrapped composable. */
-  mouse: UseMouse;
-
-  /** 
-   * ✓ Properly declared DOM Ref. 
-   * ✓ Custom declared type of HTMLElement or null
-  */
-  spanElementRef = iref<HTMLElement | null>(null); 
-
-  constructor(public props: CounterProps, public emit: CounterEmit) {
-    /** ✓ Properly declared auto-unwrapped composable. */ 
-    this.mouse = iuse(useMouse); 
-  }
-
-  /** ✓ Properly declared init function. */
-  init() {
-    /** ✓ Properly set lifecycle hook. */
-    onMounted(() => {
-      this.count = 4;
-    });
-
-    /** ✓ Properly set watch function */
-    watch(() => this.count, (newCount) => {
-      if (newCount === 5) {
-        alert('You reached the count of ' + newCount + '!');
-      }
-    })
-  }
-
-  /**
-   * Use iref() for the property to be auto cast to number
-   * because refs auto-unwrap inside reactive().
-   */
-  count = iref(0); // ✓ Properly inferred type -> number
-
-  /**
-   * Use iref() for the property to be auto cast to number
-   * because refs auto-unwrap inside reactive().
-   */
-  timesClicked = iref(0); // ✓ Properly inferred type -> number
-
-  /** ✓ Properly declared function (not arrow function). */
-  increment() {
-    this.count++;
-  }
-
-  /** ✓ Properly declared function (not arrow function). */
-  click() {
-    this.increment();
-    this.timesClicked++;
-  }
-
-  /**
-   * Do NOT use arrow functions, arrow functions are not extensible.
-   */
-  increment = () => this.count++ ❌
-
-  /** ✓ Properly declared computed getter. */
-  get doubleCount() {
-    return this.count * 2;
-  }
-}
-
-/** ✓ Properly initialized IVUE class runner. */
-const counter = ivue(Counter, props, emit);
-```
-
-### Use ref() for properties
-
-`ivue` recommends all class properties to be defined as `ref()` to be able to interoperate with `defineExpose()`, if you simply pass reactive props which are not Refs through `defineExpose()`, they will lose reactivity. `ref()` refs just like computed refs get flattened into the `reactive()` object, so there is no need to worry about using `.value`. The `ref()` refs are necessary just internally for Vue 3 to know which refs to keep reactive.
-
-### Unwrap (de-Ref) the types
-
-Next, we convert the types back to their normal types as if they have no reactivity at all, so `Ref<number>` is `number` in `ivue`, so rather than going in the direction of complexifying the types, we are going in the opposite direction towards simplification.
-
-### Use standard declaration syntax for functions
-
-`ivue` recommends all class functions to be defined in plain full function style (not arrow functions), this allows all `ivue` classes to be extensible at any point. By using plain standard functions, it allows the developer to be able to override them at any time by simply extending the class.
-
-### Do not use arrow functions in class declarations
-
-:::warning
-Arrow functions break full extensibility of classes because they carry their own context at the point of declaration, so avoid using them inside of `ivue` classes.
-:::
-
-## `.constructor()` vs `.init()`
-
-#### 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 />
-
-<hr />
-
-Inside the `.constructor()` method you still have access to non-reactive state, because when `.constructor()` is initialized, it does NOT yet have access to the reactive properties of the class, since it was not yet converted to `reactive()` by `ivue`, so if you use the properties like Refs or ComputedRefs inside `.constructor()` you would have to use them with the `.value`.
-
-As a general rule, there is no need to manipulate the values in the `.constructor()`, use constructor only for assigning the properties and casting the types of those assigned properties to the unwrapped (de-Refed) final state of the resulting `reactive()` object.
-
-**Let's look at a `.constructor()` vs `.init()` example:**
-
-::: code-group
-<<< @/components/guidelines/CounterExternalRefsDetailed.vue{vue:line-numbers}
-:::
-:::details For this example we initialize the component like this:
-
-```vue
-<template>
-  <CounterExternalRefsDetailed />
-</template>
-```
-
-:::
-
-<div style="font-size: 18px; font-weight: 500;">Result</div>
-
-<CounterExternalRefsDetailed />
-
-## Unwrapping Refs
-
-The key to working with `ivue` is understanding correctly the way Vue 3 does automatic Unwrapping of Refs when they are passed into the `reactive()` object. In that regard we are not relying on some magic `ivue` behavior but rather the default behavior of `reactive()` Vue 3 function.
-
-To match that unwrapping behavior, our class needs to Unwrap (or de-Ref) the types of Composables, Refs, ComputedRefs, if they are being passed into the constructor, to get their raw basic types those Refs are pointing to, so that you can start operating in the `ivue` environment, where there is no need to worry about `.value`. This unwrapping should be mainly done inside the `.constructor()` method.
-
-## Naming Conventions
-
-To benefit from the full power of `ivue`, it is recommended to extract the classes into separate files. What has been an effective pattern is to name the classes and put them right beside components in the same folder that these classes are being used with. So if you have `CounterComponent.vue` component, it can have a class inside `CounterComponentClass.ts`, and you can store props, emits, and other runtime definitions inside `CounterComponentProps.ts`.

package/docs/docs/pages/how-it-works.md

@@ -1,65 +0,0 @@
-<script setup lang="ts">
-import CounterBasic from '../components/usage/CounterBasic.vue'
-</script>
-
-# How it works?
-
-```ts
-export function ivue<T extends AnyClass>(
-  className: T,
-  ...args: InferredArgs<T>
-): IVue<T>;
-```
-
-The main `ivue()` initializer function uses TypeScript to be able to infer and validate the constrcutor argument types of `AnyClass` and passes those arguments to the constructor of `AnyClass`.
-
-`ivue` allows you to pass any number of arguments into the class `constructor(arg1, arg2, arg3, ...etc)`
-
-`ivue()` initializer function returns an extended Vue 3 `reactive()` object in which getters and setters are internally converted to computeds and adds `.toRefs()` method to the created object. Computeds auto-unwrap themselves when they are accessed as a reactive object property, so the `.value` properties and computeds get flattened in the resulting object and do not require `.value` to be accessed.
-
-`ivue` replicates native JavaScript / TypeScript class implementation by extending descriptors (getters and setters) up the whole prototype ancestors chain thus supporting classical inheritance.
-
-`ivue` aims to be opaque and minimal, just doing the minimum to convert a class to a reactive object, leaving the rest to be implemented using Vue 3 Composition API inside an initializer function called `.init()`
-
-## Usage Recommendation
-
-`ivue` recommends all class properties to be defined as `ref()` to be able to interoperate with `defineExpose()`, if you simply pass reactive props which are not Refs through `defineExpose()`, they will lose reactivity. `ref()` refs just like computed refs get flattened into the `reactive()` object, so there is no need to worry about using `.value`. The `ref()` refs are necessary just internally for Vue 3 to know which refs to keep reactive, and we just convert the types back to their normal types as if they have no reactivity at all, so `Ref<number>` is `number` in `ivue`, so rather than going in the direction of complexifying the types, we are going in the opposite direction towards simplification.
-
-`ivue` recommends all class functions, getters and setters to be defined in plain full function style (not arrow functions), this allows all `ivue` classes to be extensible at any point. By using plain standard functions, getters and setters allows for any getter, setter, function or property to be overriden by extending this class. Arrow functions break full extensibility of classes, so avoid using them inside of classes.
-
-See: [More Guidelines](/pages/guidelines.html)
-
-## Minimal API Surface Area
-
-`ivue()` initializer function is the main core function to initialize the `ivue` reactive object<br />
-`iref()` ref initializer instantiates the Ref but Unwraps its type as the raw type of the Ref<br />
-`iuse()` function converts the type of composables to they Unwraped raw types<br />
-`.init()` method helps initialize the reactive state like `watch`, `onMount`, etc.<br />
-`.toRefs()` method allows to interoperate with Vue 3 Composables<br />
-Utility Types help to achieve the rest of `ivue` capabilities
-
-:::details Click to see the whole latest `ivue` source code from github main branch below:
-:::code-group
-<<< ../../../lib/ivue.ts{ts:line-numbers} [ivue.ts]
-:::
-Or [See on GitHub](https://github.com/infinite-system/ivue/blob/main/lib/ivue.ts)
-
-## 100% Vue 3 Compatible
-
-`.toRefs()` allows the object to be converted to Vue 3 native composable structure with full `.value`s, so it can interoperate with native composables if needed. `.toRefs()` is also often used to get refs for `v-bind()` in css styles.
-
-## 100% TypeScript Support
-
-`ivue` is on the cutting edge of TypeScript and owes its capabilities to the latest developments in TypeScript.
-
-`ivue` provides a set of utility types to make working with `Vue 3` even easier and more scalable.
-
-## 100% Unit Tested Architecture
-
-At the current stage all of the code that is used to build `ivue` is 100% tested with 100% coverage, and aims to keep being at 100% always.
-
-You can clone the project and run `yarn test` yourself and examine the tests.
-
-## Zero Dependencies
-
-`ivue` has zero dependencies except Vue 3.

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

@@ -1,32 +0,0 @@
-
-# How it's made
-
-## Original Inspiration
-
-The original inspiration for `ivue` comes from `MobX` React state management library, where something similar is attempted to create a class based reactive observable architecture.
-
-##  Epiphany
-
-After building several ports from `MobX` state management library to `VueJS` to reactivity system I realized that Vue itself is far superior in its design and performance and can solve the same problem without relying on second hand-library, but for that my evolution of understanding of how JavaScript getters and setters work needed to happen. 
-
-And one lucky and sunny day driving back from work in an eureka moment of light it occurred to me how to use Vue 3 computeds in place of getters in classes (Yes, apparently my brain does coding while driving a car).
-
-`ivue` relies on this very simple discovery of how to elegantly convert getters into Vue 3 computeds.
-
-## Simplicity
-
-After many iterations where I created a whole inversion of control library for `ivue`, using lots of different decorators and event Traits, I realized that simplicity is paramount to good architecture.
-
-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.
-
-## Minimalism
-
-Thus `ivue` has minimal surface area of the API making it very robust and easy to test.
-By default `ivue` does not rely on decorators, though you can use decorators if you wish to.
-
-## The Rest is Up To You
-`ivue` is like a small mustard seed core for the big tree trunk of Class Based Reactive applications to be built around it, that's why the path of utter simplicity was chosen.
-Everything else like an Inversion of Control (IOC) system, Traits, Mixins, Decorators can be built around the core `ivue` architecture and is up to the community of enthusiastic open source contributors, please share with us your vision of how you and all of can use `ivue` better.
-

package/docs/docs/pages/introduction.md

@@ -1,83 +0,0 @@
-<script setup lang="ts">
-import Button from '../components/Button.vue'
-</script>
-# What is <span style="font-family: 'Public Sans'; ">ivue ∞ Infinite Vue</span>?
-
-## The Problem
-
-With the development of React hooks and Vue following in its footsteps with introduction of Vue 3 Composition API, the ecosystem has moved away from Options API. 
-
-While providing greater flexibility and composability the Composition API has its own downsides, one of them is having to use `.value` to refer to the reactive variables which makes the development process more clunky when the App reaches a certain size. 
-
-As you may know, `reactvity-transform` macros were an attempt to mitigate those issues, which turned out to create even more issues, and was discontinued. 
-
-See: [VueJs.org &ndash; Reactivity Transform](https://vuejs.org/guide/extras/reactivity-transform.html)
-
-## `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 Class API<br />
-&ndash;&nbsp; Robust, 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 />
-&ndash;&nbsp; 100% VSCode / Intellij IDE Auto-complete Intellisence<br />
-</div>
-
-`ivue` is a powerful tool because it fully aligns itself with JavaScript / TypeScript Class API.
-
-`ivue` gives you a class based Composable capabilities with Inheritance and all the power of TypeScript Classes.
-
-`ivue` mitigates the downsides of both Composition API and Options API, uses only their strengths and brings back Object Oriented Programming to allow the development of complex and scalable apps.
-
-`ivue` is fully interoperable with Composition API and does not work against, but rather with it, so you can use all of ecosystems composables seamlessly.
-
-`ivue` also offers a set of functions and utility types to make extensible & exportable props defaults, extensible emits, extensible slots, etc. and much more possible.
-
-`ivue` aims to be opaque, by giving the developer the Class API reactivity system.
-
-`ivue` omits custom implementations of IOC Container, Decorators, Mixins, etc. by design.
-
-`ivue` enforces a sane default standard of operation to contain the ever flexible Class API.
-
-`ivue` uses Powerful Cutting Edge TypeScript to transform Vue 3 Refs to their base types, infer Class constructor arguments, infer Composable return types and function arguments and much more, making Object Oriented DX Experience with Vue 3 a breeze.
-
-## OOP and TypeScript Class API in the Ecosystem
-
-With failed implementations of classes in React and also failed implementations using class components in Vue 2 / 3, the ecosystem decided that classes are bad and moved to pure procedural designs. 
-
-While procedural programming has its strength, it also comes with its own weaknesses, like lack of inheritance, lack of `this` context, and thus lack of true composition.
-
-## `ivue` is different
-
-&mdash; &nbsp;`ivue` does NOT inherit from a base Class.<br />
-&mdash; &nbsp;`ivue` does NOT use Decorators to achieve its objectives.<br />
-&mdash; &nbsp;`ivue` does NOT alter Vue 3 underlying behavior, but rather relies on it.<br />
-&mdash; &nbsp;`ivue` is NOT Class Components (though you can build components with it).<br />
-
-
-::: tip IVUE IMPLEMENTS MINIMAL API ARCHITECTURE
-Things like IOC Container, Decorators, Traits, Mixins, etc. were omitted by design to slim down the surface area and scope of `ivue` core purpose, which was JavaScript / TypeScript Class API based reactivity. Any Traits, Decorators & IOC Container can be built around it using third-party libraries or roll your own systems. You are more than welcome to contribute in this area!
-:::
-
-
-
-## Infinite Vue Class Architecture
-
-`ivue` replicates native JavaScript / TypeScript class implementation by extending descriptors (getters and setters) up the whole prototype ancestors chain thus supporting classical inheritance.
-
-By using TypeScript we are able to infer the arguments of the main `ivue()` initializer function and pass the arguments to the constructor.
-
-`ivue()` initializer function returns a reactive object with getters converted to computeds and adds `.toRefs()` method to the object, `.toRefs()` allows the object to be converted to native composable structure, so it can interoperate as a composable if needed.
-
-`ivue` aims to be opaque and minimal, just doing the minimum to convert a class to a reactive object, leaving the rest to be implemented using Vue 3 Composition API inside an initializer function called `.init()` 
-
-You can read more about `ivue` internal architecture in <Button href="/pages/how-it-works" label="How it works?" /> page.
-
-## When to use Infinite Vue?
-
-When the complexity of your app or components becomes very high using `ivue` can become a natural choice to deal with that complexity. Because `.value` is abstracted away in `ivue`, everything is simply a reactive object of Refs.
-