Merge pull request #57 from obewds/dev

0.16.0 - adding in vitest as a stack dep (and it's deps) and an initial test generator or few to do a trial run before adding in all test generators
obewds · Sep 13, 2023 · f6d532d · f6d532d
2 parents 9504f2f + 4962bc7
commit f6d532d
Show file tree

Hide file tree

Showing 58 changed files with 659 additions and 64 deletions.
diff --git a/README.md b/README.md
@@ -1,11 +1,12 @@
 # The VILT Design System
-The official repository for the VILT Design System for the Vue.js, Inertia.js, Laravel, and Tailwind CSS web app stack that is turbocharged with Typescript and VueVentus.
+The official repository for the VILT Design System for the Vue.js, Inertia.js, Laravel, and Tailwind CSS web app stack that is turbocharged with Typescript, Vitest and VueVentus.
 
 ![GitHub package.json version](https://img.shields.io/github/package-json/v/obewds/vilt-ds?label=Github&logo=github&style=for-the-badge) &nbsp; ![npm](https://img.shields.io/npm/v/@obewds/vilt-ds?color=%23cc3534&logo=npm&style=for-the-badge)
 
 
 
-![Vue.js](https://img.shields.io/badge/vue.js-%2335495e.svg?style=for-the-badge&logo=vuedotjs&logoColor=%234FC08D) &nbsp; ![Inertia.js](https://img.shields.io/badge/inertia.js-%239553E9.svg?style=for-the-badge&logo=inertia&logoColor=%23ffffff) &nbsp; ![Laravel](https://img.shields.io/badge/laravel-%23FF2D20.svg?style=for-the-badge&logo=laravel&logoColor=%23ffffff) &nbsp; ![TailwindCSS](https://img.shields.io/badge/tailwindcss-%2338B2AC.svg?style=for-the-badge&logo=tailwind-css&logoColor=white) &nbsp; ![VueVentus](https://img.shields.io/badge/vueventus-%2335495e.svg?style=for-the-badge&logo=vuedotjs&logoColor=%234FC08D) &nbsp; ![TypeScript](https://img.shields.io/badge/typescript-%23007ACC.svg?style=for-the-badge&logo=typescript&logoColor=white) &nbsp; ![NodeJS](https://img.shields.io/badge/node.js-6DA55F?style=for-the-badge&logo=node.js&logoColor=white) &nbsp; ![Dependabot](https://img.shields.io/badge/dependabot-025E8C?style=for-the-badge&logo=dependabot&logoColor=white)
+![Vue.js](https://img.shields.io/badge/vue.js-%2335495e.svg?style=for-the-badge&logo=vuedotjs&logoColor=%234FC08D) &nbsp; ![Inertia.js](https://img.shields.io/badge/inertia.js-%239553E9.svg?style=for-the-badge&logo=inertia&logoColor=%23ffffff) &nbsp; ![Laravel](https://img.shields.io/badge/laravel-%23FF2D20.svg?style=for-the-badge&logo=laravel&logoColor=%23ffffff) &nbsp; ![TailwindCSS](https://img.shields.io/badge/tailwindcss-%2338B2AC.svg?style=for-the-badge&logo=tailwind-css&logoColor=white) &nbsp; ![VueVentus](https://img.shields.io/badge/vueventus-%2335495e.svg?style=for-the-badge&logo=vuedotjs&logoColor=%234FC08D) &nbsp; ![Vitest](https://img.shields.io/badge/vitest-%2335495e.svg?style=for-the-badge&logo=vuedotjs&logoColor=%234FC08D) &nbsp; ![TypeScript](https://img.shields.io/badge/typescript-%23007ACC.svg?style=for-the-badge&logo=typescript&logoColor=white) &nbsp; ![NodeJS](https://img.shields.io/badge/node.js-6DA55F?style=for-the-badge&logo=node.js&logoColor=white) &nbsp; ![Dependabot](https://img.shields.io/badge/dependabot-025E8C?style=for-the-badge&logo=dependabot&logoColor=white)
+
 
 
 ## Installation Prep
@@ -56,6 +57,7 @@ npm run dev
 > NOTE: You may need to delete Jetstream's node_modules directory and reinstall node.js dependencies with a `npm install` command to get vite to play nicely with Jetstream defaults!
 
 
+
 ## Installing VILT DS
 
 With Laravel/Jetstream/Inertia installed, you can install VILT DS with the following command:
@@ -70,12 +72,190 @@ Once the VILT DS package is installed, you can access and run the VILT DS instal
 npx vilt-ds
 ```
 
+<!--
 After your base VILT DS files are installed, you'll need to run the following command:
 
 ```bash
 sail artisan ziggy:generate
 ```
+-->
+
+
+
+## A Note About ziggy.{jt}s Files
+
+After a typical VILT/Jetstream install, the `sail artisan ziggy:generate` command will generate a Javascript file with current routes in it. Typescript needs this information downstream, so we need to update this file when new routes are established.
+
+For now, we can simply switch the ziggy generated `./resources/js/ziggy.js` file from a Javascript `.js` extension to a Typescript `.ts` extension, and move on with our project.
+
+But moving forward, solutions are being explored to try to automate this for us all so we don't have to think about it much!
+
+
+
+## Updating Installed VILT DS Components
+
+VILT DS provides a handful of `npx` accessible commands to pull in updated versions of VILT DS components after initial installations.
+
+> PLEASE NOTE: Using any of these updater scripts will overwrite existing files. So it is exuberantly recommended to ensure you are using a versioning solution (like Git) whenever using these scripts IRL and on real projects.
+
+> It's also recommended to generally NOT edit VILT DS files directly, and instead opt to make components that import/use VILT DS components directly as child/dependency components. Isolation of VILT DS components ultimately allows these updater scripts to be used to keep VILT DS components current, while not breaking downstream components (depending on their architecture of course!).
+
+
+
+### Update VILT DS VueVentus Components
+
+```bash
+npx vilt-ds-vueventus
+```
+
+The `npx vilt-ds-vueventus` command will overwrite the following files in a Laravel Jetstream VILT app with VILT DS installed:
+
+**Root Path: `./resources/js/Components/vv/`**
+
+* anchors/VvAnchor.vue
+* anchors/VvInertiaLink.vue
+* buttons/VvButton.vue
+* buttons/VvColorModeButton.vue
+* buttons/VvScrollUp.vue
+* elements/VvEl.vue
+* forms/VvFormGroup.vue
+* forms/VvQuadFormGroup.vue
+* inputs/VvCheckbox.vue
+* inputs/VvInput.vue
+* inputs/VvRadio.vue
+* lists/VvListItem.vue
+* lists/VvList.vue
+* selects/VvListbox.vue
+* selects/VvSelect.vue
+* textareas/VvTextarea.vue
+
+
+
+### Update VILT DS Laravel Jetstream API Components
+
+```bash
+npx vilt-ds-jetstream-api
+```
+
+The `npx vilt-jetstream-api` command will overwrite the following files in a Laravel Jetstream VILT app with VILT DS installed:
+
+**Root Path: `./resources/js/Pages/`**
+
+* API/Partials/ApiTokenManager.vue
+* API/Index.vue
+
+
+
+### Update VILT DS Laravel Jetstream Auth Components
+
+```bash
+npx vilt-ds-jetstream-auth
+```
+
+The `npx vilt-jetstream-auth` command will overwrite the following files in a Laravel Jetstream VILT app with VILT DS installed:
+
+**Root Path: `./resources/js/Pages/Auth/`**
+
+* ConfirmPassword.vue
+* ForgotPassword.vue
+* Login.vue
+* Register.vue
+* ResetPassword.vue
+* TwoFactorChallenge.vue
+* VerifyEmail.vue
+
+
+
+### Update VILT DS Laravel Jetstream Base Components
+
+```bash
+npx vilt-ds-jetstream-base-components
+```
+
+The `npx vilt-base-components` command will overwrite the following files in a Laravel Jetstream VILT app with VILT DS installed:
+
+**Root Path: `./resources/js/Components/`**
+
+* ActionMessage.vue
+* ActionSection.vue
+* ApplicationLogo.vue
+* ApplicationMark.vue
+* AuthenticationCardLogo.vue
+* AuthenticationCard.vue
+* Banner.vue
+* Checkbox.vue
+* ConfirmationModal.vue
+* ConfirmsPassword.vue
+* DangerButton.vue
+* DialogModal.vue
+* DropdownLink.vue
+* Dropdown.vue
+* FormSection.vue
+* InputError.vue
+* InputLabel.vue
+* Modal.vue
+* NavLink.vue
+* PrimaryButton.vue
+* ResponsiveNavLink.vue
+* ScrollUpColorModeSection.vue
+* SecondaryButton.vue
+* SectionBorder.vue
+* SectionTitle.vue
+* TextInput.vue
+* Welcome.vue
+
+
+
+### Update VILT DS Laravel Jetstream Base Page Components
+
+```bash
+npx vilt-ds-jetstream-base-pages
+```
+
+The `npx vilt-ds-jetstream-base-pages` command will overwrite the following files in a Laravel Jetstream VILT app with VILT DS installed:
+
+**Root Path: `./resources/js/Pages/`**
+
+* Dashboard.vue
+* PrivacyPolicy.vue
+* TermsOfService.vue
+* VueVentus.vue
+* Welcome.vue
+
+
+
+### Update VILT DS Laravel Jetstream Profile Components
+
+```bash
+npx vilt-ds-jetstream-profile
+```
+
+The `npx vilt-ds-jetstream-profile` command will overwrite the following files in a Laravel Jetstream VILT app with VILT DS installed:
+
+**Root Path: `./resources/js/Pages/Profile/`**
+
+* Partials/DeleteUserForm.vue
+* Partials/LogoutOtherBrowserSessionsForm.vue
+* Partials/TwoFactorAuthenticationForm.vue
+* Partials/UpdatePasswordForm.vue
+* Partials/UpdateProfileInformationForm.vue
+* Show.vue
+
+
+
+### Update VILT DS Laravel Jetstream Teams Components
+
+```bash
+npx vilt-ds-jetstream-teams
+```
+
+The `npx vilt-ds-jetstream-teams` command will overwrite the following files in a Laravel Jetstream VILT app with VILT DS installed:
 
-The `sail artisan ziggy:generate` command will generate a Javascript file with current routes in it. Typescript needs this information downstream, so we need to update this file when new routes are established.
+**Root Path: `./resources/js/Pages/Teams/`**
 
-For now, we can simply switch the ziggy generated file from a Javascript `.js` extension to a Typescript `.ts` extension, and move on with our project.
+* Partials/CreateTeamForm.vue
+* Partials/DeleteTeamForm.vue
+* Partials/TeamMemberManager.vue
+* Partials/UpdateTeamNameForm.vue
+* Create.vue
+* Show.vue
diff --git a/dist/data/npm/vilt-ds-jetstream-deps.d.ts b/dist/data/npm/vilt-ds-jetstream-deps.d.ts
@@ -1,3 +1,3 @@
-export type ViltDsJetstreamDependency = 'typescript' | '@types/node' | '@inertiajs/progress' | '@types/ziggy-js' | 'ziggy-js' | '@obewds/vueventus' | '@headlessui/vue' | '@tailwindcss/aspect-ratio' | '@headlessui/tailwindcss' | 'tailwind-scrollbar' | 'gsap';
+export type ViltDsJetstreamDependency = 'typescript' | '@types/node' | '@inertiajs/progress' | '@types/ziggy-js' | 'ziggy-js' | '@obewds/vueventus' | '@headlessui/vue' | '@tailwindcss/aspect-ratio' | '@headlessui/tailwindcss' | 'tailwind-scrollbar' | 'gsap' | 'vitest' | 'happy-dom' | '@vue/test-utils' | '@vitest/coverage-v8' | '@types/jest';
 declare const _default: ViltDsJetstreamDependency[];
 export default _default;
diff --git a/dist/data/npm/vilt-ds-jetstream-deps.js b/dist/data/npm/vilt-ds-jetstream-deps.js
diff --git a/dist/data/npm/vilt-ds-jetstream-deps.js.map b/dist/data/npm/vilt-ds-jetstream-deps.js.map
diff --git a/dist/generators/jetstream/generate-vitest-config-ts.d.ts b/dist/generators/jetstream/generate-vitest-config-ts.d.ts
@@ -0,0 +1 @@
+export default function (): string;
diff --git a/dist/generators/jetstream/generate-vitest-config-ts.js b/dist/generators/jetstream/generate-vitest-config-ts.js
diff --git a/dist/generators/jetstream/generate-vitest-config-ts.js.map b/dist/generators/jetstream/generate-vitest-config-ts.js.map
diff --git a/dist/generators/jetstream/generate-vitest-head-mocked-vue.d.ts b/dist/generators/jetstream/generate-vitest-head-mocked-vue.d.ts
@@ -0,0 +1 @@
+export default function (): string;
diff --git a/dist/generators/jetstream/generate-vitest-head-mocked-vue.js b/dist/generators/jetstream/generate-vitest-head-mocked-vue.js
diff --git a/dist/generators/jetstream/generate-vitest-head-mocked-vue.js.map b/dist/generators/jetstream/generate-vitest-head-mocked-vue.js.map
diff --git a/dist/generators/jetstream/generate-vitest-setup-ts.d.ts b/dist/generators/jetstream/generate-vitest-setup-ts.d.ts
@@ -0,0 +1 @@
+export default function (): string;
diff --git a/dist/generators/jetstream/generate-vitest-setup-ts.js b/dist/generators/jetstream/generate-vitest-setup-ts.js
diff --git a/dist/generators/jetstream/generate-vitest-setup-ts.js.map b/dist/generators/jetstream/generate-vitest-setup-ts.js.map
diff --git a/dist/generators/jetstream/generate-vitest-ziggy-route-shim-d-ts.d.ts b/dist/generators/jetstream/generate-vitest-ziggy-route-shim-d-ts.d.ts
@@ -0,0 +1 @@
+export default function (): string;
diff --git a/dist/generators/jetstream/generate-vitest-ziggy-route-shim-d-ts.js b/dist/generators/jetstream/generate-vitest-ziggy-route-shim-d-ts.js
diff --git a/dist/generators/jetstream/generate-vitest-ziggy-route-shim-d-ts.js.map b/dist/generators/jetstream/generate-vitest-ziggy-route-shim-d-ts.js.map