Feature/add chromatic pipeline

.gitignore

@@ -0,0 +1 @@
+node_modules

nve-ds/.github/workflows/chomatic.yml

@@ -0,0 +1,26 @@
+# .github/workflows/chromatic.yml
+
+# Workflow name
+name: 'Chromatic'
+
+# Event for the workflow
+on: push
+
+# List of jobs
+jobs:
+  chromatic-deployment:
+    # Operating System
+    runs-on: ubuntu-latest
+    # Job steps
+    steps:
+      - uses: actions/checkout@v1
+      - name: Install dependencies
+        # 👇 Install dependencies with the same package manager used in the project (replace it as needed), e.g. yarn, npm, pnpm
+        run: yarn
+        # 👇 Adds Chromatic as a step in the workflow
+      - name: Publish to Chromatic
+        uses: chromaui/action@v1
+        # Chromatic GitHub Action options
+        with:
+          # 👇 Chromatic projectToken, refer to the manage page to obtain it.
+          projectToken: ${{ secrets.CHROMATIC_PROJECT_TOKEN }}

nve-ds/.storybook/main.js

@@ -0,0 +1,20 @@
+/** @type { import('@storybook/web-components-vite').StorybookConfig } */
+import './preview.js'
+
+const config = {
+  stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|mjs|ts|tsx)'],
+  addons: ['@storybook/addon-links', '@storybook/addon-essentials'],
+    staticDirs: ['../www'],
+
+  framework: {
+    name: '@storybook/web-components-vite',
+    options: {},
+  },
+  docs: {
+    autodocs: 'tag',
+  },
+  parameters: {
+    controls: {expanded: true},
+  },
+};
+export default config;

nve-ds/.storybook/preview-head.html

@@ -0,0 +1,10 @@
+<link rel="stylesheet" href="/build/nve-ds.css" />
+<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@shoelace-style/shoelace@2.9.0/cdn/themes/light.css" />
+<script type="module"
+    src="https://cdn.jsdelivr.net/npm/@shoelace-style/shoelace@2.9.0/cdn/shoelace-autoloader.js"></script>
+
+<meta charset="utf-8" />
+<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=5.0" />
+<script type="module" src="/build/nve-ds.esm.js"></script>
+<script nomodule src="/build/nve-ds.js"></script>

nve-ds/.storybook/preview.js

@@ -0,0 +1,14 @@
+/** @type { import('@storybook/web-components').Preview } */
+const preview = {
+  parameters: {
+    actions: { argTypesRegex: '^on[A-Z].*' },
+    controls: {
+      matchers: {
+        color: /(background|color)$/i,
+        date: /Date$/i,
+      },
+    },
+  },
+};
+
+export default preview;