Merge pull request #84 from SzymCode/dev

Dev

.github/workflows/node-dev.yml

@@ -16,13 +16,9 @@ jobs:
           node-version: '20'
       - name: Install Node.js Dependencies
         run: npm install
-      - name: Lint Resources with ESLint
+      - name: Lint
         run: npm run lint
-      - name: Lint Cypress with ESLint
-        run: npm run lint:cypress
-      - name: Prettier check Resources
+      - name: Prettier
         run: npm run check
-      - name: Prettier check Cypress
-        run: npm run check:cypress
       - name: Build Assets
         run: npm run build

.github/workflows/node-prod.yml

@@ -16,13 +16,9 @@ jobs:
           node-version: '20'
       - name: Install Node.js Dependencies
         run: npm install
-      - name: Lint Resources with ESLint
+      - name: Lint
         run: npm run lint
-      - name: Lint Cypress with ESLint
-        run: npm run lint:cypress
-      - name: Prettier check Resources
+      - name: Prettier
         run: npm run check
-      - name: Prettier check Cypress
-        run: npm run check:cypress
       - name: Build Assets
         run: npm run build

.prettierignore

@@ -1,4 +1,13 @@
-atomic/_old_structure
+main.ts
+preview.ts
+index.html
+
+package*.json
+tsconfig.json
+yarn.lock
+vite.config.ts
+dist/
 
+atomic/_old_structure
 atomic/bosons/styles/index.scss
 atomic/bosons/styles/variables

package.json

@@ -5,18 +5,32 @@
     "npm": "10.x"
   },
   "scripts": {
-    "build": "vite build",
-    "lint": "eslint \"atomic/**/*.{js,ts,vue}\"",
-    "lint --fix": "eslint \"atomic/**/*.{js,ts,vue}\"",
-    "lint:cypress": "eslint \"cypress/**/*.{ts,tsx}\"",
-    "lint:cypress --fix": "eslint \"cypress/**/*.{ts,tsx}\" --fix",
     "dev": "vite",
+    "open": "cypress open",
     "prepare": "husky install",
-    "check": "prettier --check atomic",
-    "write": "prettier --write atomic",
+
+    "build": "vite build & vite build storybook",
+    "build:storybook": "vite build storybook",
+
+    "lint": "npm run lint:atomic && npm run lint:cypress && npm run lint:storybook",
+    "lint:atomic": "eslint \"atomic/**/*.{js,ts,vue}\"",
+    "lint:cypress": "eslint \"cypress/**/*.{ts,tsx}\"",
+    "lint:storybook": "eslint \"storybook/**/*.{ts,tsx}\"",
+
+    "lint --fix": "npm run lint:atomic --fix && npm run lint:cypress --fix && npm run lint:storybook --fix",
+    "lint:atomic --fix": "eslint \"atomic/**/*.{js,ts,vue}\" --fix",
+    "lint:cypress --fix": "eslint \"cypress/**/*.{ts,tsx}\" --fix",
+    "lint:storybook --fix": "eslint \"storybook/**/*.{ts,tsx}\" --fix",
+
+    "check": "prettier --check atomic && prettier --check cypress && prettier --check storybook",
+    "check:atomic": "prettier --check atomic",
     "check:cypress": "prettier --check cypress",
+    "check:storybook": "prettier --check storybook/src",
+
+    "write": "prettier --write atomic && prettier --write cypress && prettier --write storybook",
+    "write:atomic": "prettier --write atomic",
     "write:cypress": "prettier --write cypress",
-    "open": "cypress open"
+    "write:storybook": "prettier --write storybook/src"
   },
   "dependencies": {
     "@shopify/draggable": "^1.1.3",

storybook/.storybook/main.js → storybook/.storybook/main.ts

@@ -1,15 +1,17 @@
-/** @type { import('@storybook/vue3-vite').StorybookConfig } */
-const config = {
+import { StorybookConfig } from '@storybook/vue3-vite'
+
+const config: StorybookConfig = {
   stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|ts|tsx)'],
   staticDirs: ['../public'],
   addons: [
     '@storybook/addon-links',
     '@storybook/addon-essentials',
-    '@storybook/addon-interactions'
+    '@storybook/addon-interactions',
   ],
   framework: {
     name: '@storybook/vue3-vite',
-    options: {}
-  }
+    options: {},
+  },
 }
+
 export default config

storybook/.storybook/preview.js → storybook/.storybook/preview.ts

@@ -8,22 +8,22 @@ export const app = createApp({})
  *  PrimeVue
  */
 import 'primevue/resources/themes/lara-light-green/theme.css'
-import 'primevue/resources/primevue.min.css';
-import 'primeicons/primeicons.css';
+import 'primevue/resources/primevue.min.css'
+import 'primeicons/primeicons.css'
 
-import PrimeVue from 'primevue/config';
+import PrimeVue from 'primevue/config'
 
-app.use(PrimeVue);
+app.use(PrimeVue)
 
 /**
  *  Load Primevue components
  */
-import { globalComponentsRegistry, PrimeVueComponents } from '@/utils';
+import { globalComponentsRegistry, PrimeVueComponents } from '@/utils'
 
 globalComponentsRegistry(PrimeVueComponents, app)
 
 export const parameters = {
-  actions: { argTypesRegex: "^on[A-Z].*" },
+  actions: { argTypesRegex: '^on[A-Z].*' },
   controls: {
     matchers: {
       color: /(background|color)$/i,
@@ -35,4 +35,4 @@ export const parameters = {
 /**
  *  Use DataManager's Sass styles
  */
-import '../../resources/sass/app.scss'
+import '../../atomic/bosons/styles/index.scss'

storybook/README.md

@@ -58,7 +58,7 @@ A quick look at the top-level files and directories included with this template.
     ├── LICENSE
     ├── yarn.lock
     ├── package.json
-    ├── vite.config.js
+    ├── vite.config.ts
     └── README.md
 
 1.  **`.storybook`**: This directory contains Storybook's [configuration](https://storybook.js.org/docs/react/configure/overview) files.
@@ -85,7 +85,7 @@ A quick look at the top-level files and directories included with this template.
 
 12. **`package.json`**: Standard manifest file for Node.js projects, which typically includes project specific metadata (such as the project's name, the author among other information). It's based on this file that npm will know which packages are necessary to the project.
 
-13. **`vite.config.js`**: This is the configuration file for [Vite](https://vitejs.dev/), a build tool that aims to provide a faster and leaner development experience for modern web projects.
+13. **`vite.config.ts`**: This is the configuration file for [Vite](https://vitejs.dev/), a build tool that aims to provide a faster and leaner development experience for modern web projects.
 
 14. **`README.md`**: A text file containing useful reference information about the project.