@vueless/storybook 0.0.3 → 0.0.5

package/.eslintignore

@@ -0,0 +1,5 @@
+/node_modules
+/dist
+
+# allow to format hidden folders
+!/.storybook

package/.eslintrc.cjs

@@ -0,0 +1,34 @@
+module.exports = {
+  root: true,
+  env: {
+    node: true,
+    browser: true,
+    es2020: true,
+  },
+  extends: [
+    "eslint:recommended",
+    "plugin:prettier/recommended",
+  ],
+  rules: {
+    "no-console": "warn",
+    "no-debugger": "warn",
+    "arrow-parens": ["error", "always"],
+    curly: ["error", "multi-line"],
+    "padding-line-between-statements": [
+      "error",
+      { blankLine: "always", prev: ["const", "let", "var"], next: "*" },
+      { blankLine: "any", prev: ["const", "let", "var"], next: ["const", "let", "var"] },
+      { blankLine: "always", prev: "directive", next: "*" },
+      { blankLine: "any", prev: "directive", next: "directive" },
+      { blankLine: "always", prev: "block-like", next: "*" },
+      { blankLine: "always", prev: "*", next: "block-like" },
+      { blankLine: "always", prev: "*", next: "return" },
+    ],
+    "prettier/prettier": ["warn", { printWidth: 100, tabWidth: 2 }],
+  },
+  parserOptions: {
+    module: "esnext",
+    sourceType: "module",
+    ecmaVersion: "latest",
+  },
+};

package/.storybook/configs/main.config.js

@@ -1,5 +1,5 @@
 import vuelessDocsTheme from "../themes/vueless.docs.theme";
-import colors from "tailwindcss/colors";
+import colors from "tailwindcss/colors.js";
 
 export const docs = {
   theme: vuelessDocsTheme,

package/.storybook/decorators/vue3SourceDecorator.js

@@ -1,6 +1,6 @@
 import { addons, makeDecorator } from "@storybook/preview-api";
 import { h, onMounted, watch } from "vue";
-import { setBrandColor } from "vueless/service.ui";
+import { setBrandColor } from "vueless/src/service.ui";
 
 export const vue3SourceDecorator = makeDecorator({
   name: "vue3SourceDecorator",

package/.storybook/index.pcss

@@ -1,5 +1,3 @@
-/* Common global styles */
-
 @tailwind base;
 @tailwind components;
 @tailwind utilities;

package/.storybook/main.js

@@ -1,11 +1,6 @@
 /** @type { import('@storybook/vue3-vite').StorybookConfig } */
 export default {
-  stories: [
-    "../node_modules/vueless/**/*.stories.@(js|jsx|ts|tsx)",
-    "../node_modules/vueless/**/*.@(mdx)",
-    // TODO: Remove it later
-    "../.vueless/**/*.stories.@(js|jsx|ts|tsx)",
-    "../.vueless/**/*.@(mdx)"],
+  stories: ["../src/**/*.stories.@(js|jsx|ts|tsx)", "../src/**/*.@(mdx)"],
   addons: [
     "@storybook/addon-links",
     "@storybook/addon-essentials",

package/.storybook/preview.js

@@ -3,33 +3,25 @@ import { backgrounds, docs, layout } from "./configs/main.config";
 import { vue3SourceDecorator } from "./decorators/vue3SourceDecorator";
 
 // Vue plugins
-import { createStore } from "vuex"; // TODO: remove it later
-import { createRouter, createWebHistory } from "vue-router";
-import NotifyServiceDefault from "vueless/ui.notify/services"; // TODO: move to UI components
+import { createStore } from "vuex";
+import NotifyServiceDefault from "vueless/src/ui.notify/services";
 
 // Tailwind styles
 import "./index.pcss";
 
-// Common stores TODO: move to UI components
-import loader from "vueless/ui.loader-rendering/store";
-import loaderTop from "vueless/ui.loader-top/store";
-import breakpoint from "vueless/ui.viewport/store";
+// Common stores
+import loader from "vueless/src/ui.loader-rendering/store";
+import loaderTop from "vueless/src/ui.loader-top/store";
+import breakpoint from "vueless/src/ui.viewport/store";
 
 // Create store instance
 const store = createStore({
   modules: { loader, loaderTop, breakpoint },
 });
 
-// Create router instance
-const router = createRouter({
-  history: createWebHistory("/"),
-  routes: [{ path: "/:pathMatch(.*)*", component: () => import("vueless/ui.container-page") }],
-});
-
 // Create storybook app instance
 const storybookApp = (app) => {
   app.use(store);
-  app.use(router);
   app.use(new NotifyServiceDefault().notifyInstance);
 };
 

package/.storybook/themes/vueless.docs.theme.js

@@ -1,5 +1,5 @@
 import { create } from "@storybook/theming/create";
-import colors from "tailwindcss/colors";
+import colors from "tailwindcss/colors.js";
 
 export default create({
   base: "light",

package/.storybook/themes/vueless.theme.js

@@ -1,5 +1,5 @@
 import { create } from "@storybook/theming/create";
-import colors from "tailwindcss/colors";
+import colors from "tailwindcss/colors.js";
 
 export default create({
   base: "light",
@@ -9,7 +9,7 @@ export default create({
 
   brandTitle: "Vueless UI",
   brandUrl: "https://vueless.com",
-  brandImage: "/static/storybook/vueless-logo.png",
+  brandImage: "/images/logo.png",
   brandTarget: "_blank",
 
   // Main colors

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vueless/storybook",
-  "version": "0.0.3",
+  "version": "0.0.5",
   "description": "The package simplifies Storybook configuration for Vueless UI library.",
   "homepage": "https://vueless.com",
   "author": "Johnny Grid",
@@ -35,8 +35,12 @@
     "prettier2": "npm:prettier@2.8.8",
     "storybook": "^8.0.0"
   },
-  "peerDependencies": {
-    "tailwindcss": "^3.3.4",
-    "vueless": "^0.0.3"
+  "devDependencies": {
+    "eslint": "^8.57.0",
+    "eslint-config-prettier": "^9.1.0",
+    "eslint-plugin-node": "^11.1.0",
+    "eslint-plugin-prettier": "^5.1.3",
+    "prettier": "^3.2.5",
+    "prettier-eslint": "^16.3.0"
   }
 }