chore: completely reorganize repo for simplicity

.eslintrc.json

@@ -0,0 +1,31 @@
+{
+  "env": {
+    "browser": true
+  },
+  "parser": "@typescript-eslint/parser",
+  "plugins": ["@typescript-eslint", "simple-import-sort"],
+  "extends": [
+    "eslint:recommended",
+    "plugin:@typescript-eslint/recommended",
+    "prettier"
+  ],
+  "rules": {
+    "no-console": "off",
+    "no-underscore-dangle": "off",
+    "default-case": "off",
+    "class-methods-use-this": "off",
+    "max-classes-per-file": "off",
+    "simple-import-sort/imports": "error",
+    "simple-import-sort/exports": "error",
+    "@typescript-eslint/no-explicit-any": "off",
+    "@typescript-eslint/explicit-module-boundary-types": "off",
+    "@typescript-eslint/no-unused-expressions": "off",
+    "@typescript-eslint/no-unused-vars": [
+      "error",
+      {
+        "varsIgnorePattern": "^(h|Fragment)$"
+      }
+    ]
+  },
+  "ignorePatterns": ["docs/**", "examples/**", "integrations/**"]
+}

.github/ARCHITECTURE.md

@@ -1,6 +1,6 @@
 # 🏗️ Architecture
 
-At the root of Vime we always have the [`vm-player`](../core/src/components/core/player/player.tsx)
+At the root of Vime we always have the [`vm-player`](../src/components/core/player/player.tsx)
 component, which maintains the current state of the player and keeps plugins, providers and UI components
 in sync. Properties are passed down from the player to update child components through a context
 provider (exactly like `React.ContextProvider`), and updates are sent to the player by dispatching
@@ -9,7 +9,7 @@ Any "special" properties that require calling a method on the provider are watch
 automatically. For example, updating the `currentTime` property will trigger a call to the provider's
 `setCurrentTime` method.
 
-It's important to note that changes don't happen immediately but rather asynchronously, 
+It's important to note that changes don't happen immediately but rather asynchronously,
 they are processed and queued to happen in the next render cycle.
 
 There are only "two" simple functions that matter when creating a new Vime component and interacting
@@ -18,12 +18,12 @@ with the player. Let's go through them briefly one at a time.
 The `withPlayerContext` (`withProviderContext` for providers) function simply behaves as
 `Context.Consumer` in React. It wraps the component class and enables properties to be passed down
 from the player directly to components, bypassing any parent components in the tree. You can refer
-to existing Vime components to see its usage. A separate context function is used for providers 
+to existing Vime components to see its usage. A separate context function is used for providers
 simply as a shorthand, because all providers require the same subset of player properties.
 
 The `createDispatcher` (`createProviderDispatcher` for providers) function creates an event dispatcher
 to send updates to the player through the `vmStateChange` (`vmProviderChange` for providers) event. The
 dispatcher is typed to simply take in a player property that can be written to, and its new value. You
 can refer to existing Vime components to see its usage. A separate event is used for providers
 because they have additional write privileges (`buffered`, `seeking` etc.), and it helps the
-player cache the state of the provider to know when an adapter call is required.
+player cache the state of the provider to know when an adapter call is required.

.github/CONTRIBUTING.md

@@ -72,31 +72,6 @@ $: git branch --set-upstream-to=upstream/master master
 $: git pull
 ```
 
-All your work will mainly take place in the [`core`](../core) package so we can simply 
-`cd` into it.
-
-```bash
-$: cd packages/core
-
-$: npm install
-```
-
-## 🖌️ Code Style
-
-### TypeScript + TSX
-
-This project relies on [ESLint](https://eslint.org) for formatting/styling TypeScript and TSX
-code. We use the [`eslint-config-airbnb-typescript`](https://www.npmjs.com/package/eslint-config-airbnb-typescript)
-preset which contains a pretty comprehensive set of linting rules, so you don't need to think about
-formatting your code, as long as your editor is setup to catch and auto-fix linting errors.
-
-Alternatively, you can run the `lint` script from the core package.
-
-### CSS
-
-There are no styling or formatting rules, simply refer to other files to maintain some
-consistency, and don't use any special naming conventions such as BEM. 
-
 ## 🏗️ Architecture
 
 For how Vime works in general see the [Architecture](./ARCHITECTURE.md) document.

.github/ISSUE_TEMPLATE/bug_report.md

@@ -15,6 +15,7 @@ assignees: ''
 # Bug Report
 
 **Vime version:**
+
 <!-- The current version of Vime you are using. -->
 
 **Provider:**
@@ -28,12 +29,15 @@ assignees: ''
 [] **Dailymotion**
 
 **Current behavior:**
+
 <!-- Describe how the bug manifests. -->
 
 **Expected behavior:**
+
 <!-- Describe what the behavior would be without the bug. -->
 
 **Steps to reproduce:**
+
 <!--  Please explain the steps required to duplicate the issue, especially if you are able to provide a sample application. -->
 
 **Related code:**

.github/ISSUE_TEMPLATE/documentation.md

@@ -9,7 +9,9 @@ assignees: ''
 # Documentation
 
 **Documentation page URL:**
+
 <!-- The URL to the page in question. -->
 
 **Reason:**
-<!-- The reason for this documentation change. -->
+
+<!-- The reason for this documentation change. -->

.github/ISSUE_TEMPLATE/feature_request.md

@@ -15,19 +15,25 @@ assignees: ''
 # Feature Request
 
 **Vime version:**
+
 <!-- The current version of Vime you are using. -->
 
 **Describe the Feature Request**
+
 <!-- A clear and concise description of what the feature request is. Please include if your feature request is related to a problem. -->
 
 **Describe Preferred Solution**
+
 <!-- A clear and concise description of what you want to happen. -->
 
 **Describe Alternatives**
+
 <!-- A clear and concise description of any alternative solutions or features you've considered. -->
 
 **Related Code**
+
 <!-- If you are able to illustrate the feature request with an example, please provide a sample application via an online code collaborator such as [GitHub](https://github.com). -->
 
 **Additional Context**
-<!-- List any other information that is relevant to your issue. Stack traces, related issues, suggestions on how to add, use case, Stack Overflow links, forum links, screenshots, OS if applicable, etc. -->
+
+<!-- List any other information that is relevant to your issue. Stack traces, related issues, suggestions on how to add, use case, Stack Overflow links, forum links, screenshots, OS if applicable, etc. -->

.github/ISSUE_TEMPLATE/support_question.md

@@ -8,5 +8,5 @@ assignees: ''
 
 # Support Question
 
-Please do not submit support requests or "How to" questions here. Instead, please use the community 
-Discord support channel: https://discord.gg/feZ6cAE 
+Please do not submit support requests or "How to" questions here. Instead, please use the community
+Discord support channel: https://discord.gg/feZ6cAE

.github/PROVIDERS.md

@@ -2,34 +2,28 @@
 
 Providers are responsible for loading players/media and controlling it. For example, the YouTube
 provider sets up the YouTube player embed and loads a video through it. All providers implement the
-[`MediaProvider`](../core/src/components/providers/MediaProvider.ts) interface.
+[`MediaProvider`](../src/components/providers/MediaProvider.ts) interface.
 
 Let's pretend we're creating a new provider for Twitch, the steps will generally go as follows:
 
-1. Make sure we're in the root of the [`core`](../core) package directory.
-2. Run the following script `npm run generate:provider` and pass in the name `Twitch`.
-3. Go to `src/components/providers/twitch`.
-4. Create interfaces for the parameters, commands, events and messages that the Twitch embed
+1. Run the following script `npm run generate:provider` and pass in the name `Twitch`.
+2. Go to `src/components/providers/twitch`.
+3. Create interfaces for the parameters, commands, events and messages that the Twitch embed
    takes and fires. Make sure everything is documented, most the time it's simply copy and pasting from
    the provider's documentation. Always refer to existing providers for some guidance.
-5. Setup the properties that we will expose on the component to set player parameters.
-6. The Twitch player is loaded in an `<iframe>` so we'll need to setup the `Embed` component.
+4. Setup the properties that we will expose on the component to set player parameters.
+5. The Twitch player is loaded in an `<iframe>` so we'll need to setup the `Embed` component.
 
 From here onwards it's best to refer to existing providers as a guide and slowly implement each
 method you see. Don't forget to emit the `vmLoadStart` event when new media is loading, and to
 finalize the `getAdapter` method.
 
-As we're building out our provider we'll want to see and test it in the browser. There's
-already a file setup to do this. Go to the [`playground`](../core/src/components/core/playground/index.html)
-component and add the provider just like the others have already been done so. You can serve the dev environment
-`npm run serve`, and select the file through the explorer to begin interacting with it in the browser.
-
 After we wrap up all our testing and we're satisfied, the final steps are:
 
-1. Create a `usage` directory inside the provider directory and add examples for the same 
-frameworks that are listed for all other providers.
+1. Create a `usage` directory inside the provider directory and add examples for the same
+   frameworks that are listed for all other providers.
 2. Run the build script `npm run build`.
 3. Add small description about the provider to the auto-generated [component documentation](../docs/docs/components/providers)
    (above the `<-- Auto Generated Below -->` comment). See other providers as an example.
-4. Commit your changes `git commit -m 'feat(core/providers): add twitch provider'`
-5. Create a PR!
+4. Commit your changes `git commit -m 'feat(providers): add twitch provider'`
+5. Create a PR!

.github/PULL_REQUEST_TEMPLATE.md

@@ -1,26 +1,27 @@
 ## Pull request type
 
-<!-- Please do not submit updates to dependencies unless it fixes an issue. --> 
+<!-- Please do not submit updates to dependencies unless it fixes an issue. -->
 
-<!-- Please try to limit your pull request to one type, submit multiple pull requests if needed. --> 
+<!-- Please try to limit your pull request to one type, submit multiple pull requests if needed. -->
 
 Please check the type of change your PR introduces:
+
 - [ ] Bugfix
 - [ ] Feature
 - [ ] Code style update (formatting, renaming)
 - [ ] Refactoring (no functional changes, no api changes)
 - [ ] Build related changes
 - [ ] Documentation content changes
-- [ ] Other (please describe): 
-
+- [ ] Other (please describe):
 
 ## What is the current behavior?
+
 <!-- Please describe the current behavior that you are modifying, or link to a relevant issue. -->
 
 Issue Number: N/A
 
-
 ## What is the new behavior?
+
 <!-- Please describe the behavior or changes that are being added by this PR. -->
 
 -
@@ -34,7 +35,6 @@ Issue Number: N/A
 
 <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. -->
 
-
 ## Other information
 
-<!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. -->
+<!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. -->

.github/UI.md

@@ -8,21 +8,21 @@ When creating new components you need to be aware of if it'll be displayed in an
 player. Hide/show and position it accordingly, and if it's inside a video player then be aware of
 the `z-index` and `pointer-events` css properties of any elements that are positioned absolutely,
 such as a container that stretches out the entire video player. We don't want to block other
-components and prevent them from being interacted with. Open the 
-[default theme](../core/src/themes/default.css), and go to the `Z-Index` section 
+components and prevent them from being interacted with. Open the
+[default theme](../src/themes/default.css), and go to the `Z-Index` section
 to see existing z-index levels.
 
 If you're creating any new CSS variables then make sure to document them (see existing components on
-how to do so), and set the values inside the [default theme](../core/src/themes/default.css)
+how to do so), and set the values inside the [default theme](../src/themes/default.css)
 CSS file. If the component also has a light theme, set the variable values inside the
-[light theme](../core/src/themes/light.css) CSS file.
+[light theme](../src/themes/light.css) CSS file.
 
 After we wrap up all our testing and we're satisfied, the final steps are:
 
-1. Create a `usage` directory inside the component directory and add examples for the same frameworks 
-that are listed for all other components.
+1. Create a `usage` directory inside the component directory and add examples for the same frameworks
+   that are listed for all other components.
 2. Run the build script `npm run build`.
 3. Add small description about the component to the auto-generated [component documentation](../docs/docs/components/ui)
    (above the `<-- Auto Generated Below -->` comment). See other components as an example.
 4. Commit your changes `git commit -m '{feat/fix}(core/ui): {message}'`
-5. Create a PR!
+5. Create a PR!

.github/workflows/release.yml

@@ -12,7 +12,7 @@ jobs:
     steps:
       - name: Checkout
         uses: actions/checkout@v2
-      
+
       - name: Setup Node.js
         uses: actions/setup-node@v2-beta
         with:
@@ -28,42 +28,35 @@ jobs:
       - name: Install Root Dependencies
         if: steps.rootDeps.outputs.cache-hit != 'true'
         run: npm install
-
-      - name: Cache Core Dependencies
-        id: coreDeps
-        uses: actions/cache@v2
-        with:
-          path: 'core/node_modules'
-          key: deps-${{ hashFiles('core/package-lock.json') }}
-
+
       - name: Cache Angular Dependencies
         id: angularDeps
         uses: actions/cache@v2
         with:
           path: 'integrations/angular/node_modules'
           key: deps-${{ hashFiles('integrations/angular/package-lock.json') }}
-      
+
       - name: Cache React Dependencies
         id: reactDeps
         uses: actions/cache@v2
         with:
           path: 'integrations/react/node_modules'
           key: deps-${{ hashFiles('integrations/react/package-lock.json') }}
-      
+
       - name: Cache Svelte Dependencies
         id: svelteDeps
         uses: actions/cache@v2
         with:
           path: 'integrations/svelte/node_modules'
           key: deps-${{ hashFiles('integrations/svelte/package-lock.json') }}
-      
+
       - name: Cache Vue Dependencies
         id: vueDeps
         uses: actions/cache@v2
         with:
           path: 'integrations/vue/node_modules'
           key: deps-${{ hashFiles('integrations/vue/package-lock.json') }}
-      
+
       - name: Cache VueNext Dependencies
         id: vueNextDeps
         uses: actions/cache@v2
@@ -78,9 +71,9 @@ jobs:
           git remote set-url origin https://x-access-token:${GITHUB_TOKEN}@github.com/$GITHUB_REPOSITORY
         env:
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-      
+
       - name: Prepare Packages
-        run: npm run release:prepare.ci
+        run: npm run release:prepare
         env:
           NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
           GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}