feat: Add new ui package folder to test internal imports

.github/workflows/android-build.yml

@@ -59,6 +59,9 @@ jobs:
       - name: Install app dependencies
         run: pnpm install
 
+      - name: Build Submodules
+        run: pnpm run build-submodules
+
       - name: Build SolidJS app
         env:
           VITE_NETWORK: signet

.github/workflows/code-quality.yml

@@ -47,9 +47,12 @@ jobs:
       - name: Step One - Check Code Formatting
         run: pnpm run check-format
 
-      - name: Step Two - Check Lint Errors
+      - name: Step Two - Build Submodules
+        run: pnpm run build-submodules
+
+      - name: Step Three - Check Lint Errors
         run: pnpm run eslint
 
-      - name: Step Three - Check Type Check Errors
+      - name: Step Four - Check Type Check Errors
         run: pnpm run check-types
 

.github/workflows/playwright.yml

@@ -44,6 +44,9 @@ jobs:
       - name: Install app dependencies
         run: pnpm install
 
+      - name: Build Submodules
+        run: pnpm run build-submodules
+
       - run: npx playwright install --with-deps
         if: steps.playwright-cache.outputs.cache-hit != 'true'
       - run: npx playwright install-deps
@@ -67,4 +70,4 @@ jobs:
         with:
           name: playwright-report
           path: playwright-report/
-          retention-days: 30
+          retention-days: 30

.gitignore

@@ -22,6 +22,7 @@ dist-ssr
 *.njsproj
 *.sln
 *.sw?
+.turbo
 
 # PWA dev stuff
 dev-dist

package.json

@@ -6,7 +6,8 @@
     "scripts": {
         "dev": "solid-start dev",
         "host": "solid-start dev --host",
-        "build": "solid-start build && node insertHead.js",
+        "build-submodules": "turbo run build --filter='./packages/*'",
+        "build": "pnpm run build-submodules && solid-start build && node insertHead.js",
         "start": "solid-start start",
         "check-types": "tsc --noemit",
         "eslint": "eslint src",
@@ -48,6 +49,7 @@
         "@modular-forms/solid": "^0.18.1",
         "@mutinywallet/barcode-scanner": "5.0.0-beta.3",
         "@mutinywallet/mutiny-wasm": "0.4.12",
+        "@mutinywallet/ui": "workspace:*",
         "@mutinywallet/waila-wasm": "^0.2.1",
         "@solid-primitives/upload": "^0.0.111",
         "@thisbeyond/solid-select": "^0.14.0",
@@ -58,6 +60,7 @@
         "solid-js": "^1.7.8",
         "solid-qr-code": "^0.0.8",
         "solid-start": "^0.2.29",
+        "turbo": "^1.10.12",
         "undici": "^5.22.1"
     },
     "engines": {

packages/ui/.gitignore

@@ -0,0 +1,28 @@
+
+dist
+.solid
+.output
+.vercel
+.netlify
+netlify
+
+# Environment
+.env
+.env*.local
+
+# dependencies
+/node_modules
+
+# IDEs and editors
+/.idea
+.project
+.classpath
+*.launch
+.settings/
+
+# Temp
+gitignore
+
+# System Files
+.DS_Store
+Thumbs.db

packages/ui/.prettierrc

@@ -0,0 +1,9 @@
+{
+  "trailingComma": "none",
+  "tabWidth": 4,
+  "semi": true,
+  "singleQuote": false,
+  "arrowParens": "always",
+  "printWidth": 80,
+  "useTabs": false
+}

packages/ui/.storybook/main.ts

@@ -0,0 +1,19 @@
+import type { StorybookConfig } from "storybook-solidjs-vite";
+
+const config: StorybookConfig = {
+    stories: ["../src/**/*.mdx", "../src/**/*.stories.@(js|jsx|mjs|ts|tsx)"],
+    addons: [
+        "@storybook/addon-links",
+        "@storybook/addon-essentials",
+        "@storybook/addon-interactions",
+        "@storybook/addon-styling"
+    ],
+    framework: {
+        name: "storybook-solidjs-vite",
+        options: {}
+    },
+    docs: {
+        autodocs: "tag"
+    }
+};
+export default config;

packages/ui/.storybook/preview.ts

@@ -0,0 +1,29 @@
+import '../src/index.css'
+import { Preview } from "storybook-solidjs"
+
+const preview: Preview = {
+    parameters: {
+        backgrounds: {
+            default: 'dark',
+            values: [
+                {
+                    name: 'dark',
+                    value: '#171717',
+                },
+                {
+                    name: 'light',
+                    value: '#3b5998',
+                },
+            ],
+        },
+        actions: { argTypesRegex: "^on[A-Z].*" },
+        controls: {
+            matchers: {
+                color: /(background|color)$/i,
+                date: /Date$/
+            }
+        }
+    }
+};
+
+export default preview;

packages/ui/LICENSE

@@ -0,0 +1,22 @@
+MIT License
+
+Copyright (c) 2022-2023 Mutiny Wallet Inc.
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+

packages/ui/README.md

@@ -0,0 +1,38 @@
+# ui
+
+A solid-js ui component package and storybook for quick component development
+
+## Building
+
+Using npm:
+
+```bash
+$ pnpm run build
+```
+
+## Running Storybook
+
+```bash
+$ pnpm run storybook
+```
+
+## Importing styles
+
+### Root css
+
+```js
+// your-project/src/root.tsx
+import "@mutinywallet/ui/style.css"
+```
+
+### Tailwind config
+
+```js
+// your-project/src/tailwind.config.cjs
+/** @type {import('tailwindcss').Config} */
+module.exports = {
+    presets: [
+        require('@mutinywallet/ui/tailwind.config.cjs')
+    ]
+};
+```

packages/ui/package.json

@@ -0,0 +1,72 @@
+{
+  "name": "@mutinywallet/ui",
+  "version": "0.0.0",
+  "private": true,
+  "license": "MIT",
+  "scripts": {
+    "build": "rollup -c",
+    "check-types": "tsc --noemit",
+    "eslint": "eslint src",
+    "lint": "pnpm run eslint && pnpm run check-types",
+    "format": "npx prettier --write \"src/**/*.{ts,tsx,js,jsx,json,css,scss,md}\"",
+    "check-format": "npx prettier --check \"src/**/*.{ts,tsx,js,jsx,json,css,scss,md}\"",
+    "storybook": "storybook dev -p 6006",
+    "build-storybook": "storybook build"
+  },
+  "type": "module",
+  "files": [
+    "dist"
+  ],
+  "types": "./dist/types/index.d.ts",
+  "main": "./dist/esm/index.js",
+  "module": "./dist/esm/index.js",
+  "exports": {
+    ".": {
+      "solid": "./dist/source/index.jsx",
+      "default": "./dist/esm/index.js"
+    },
+    "./style.css": "./dist/esm/style.css",
+    "./tailwind.config.cjs": "./tailwind.config.cjs"
+  },
+  "devDependencies": {
+    "@storybook/addon-essentials": "^7.2.2",
+    "@storybook/addon-interactions": "^7.2.2",
+    "@storybook/addon-links": "^7.2.2",
+    "@storybook/addon-styling": "^1.3.6",
+    "@storybook/blocks": "^7.2.2",
+    "@storybook/testing-library": "^0.2.0",
+    "@typescript-eslint/eslint-plugin": "^6.2.0",
+    "@typescript-eslint/parser": "^6.2.0",
+    "autoprefixer": "^10.4.14",
+    "eslint": "^8.46.0",
+    "eslint-import-resolver-typescript": "2.7.1",
+    "eslint-plugin-import": "2.27.5",
+    "eslint-plugin-prettier": "4.2.1",
+    "eslint-plugin-solid": "0.11.0",
+    "postcss": "^8.4.26",
+    "prettier": "^2.8.8",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "solid-start-node": "^0.3.0",
+    "storybook": "^7.2.2",
+    "storybook-solidjs": "1.0.0-beta.2",
+    "storybook-solidjs-vite": "^1.0.0-beta.2",
+    "tailwindcss": "^3.3.3",
+    "typescript": "^4.9.5"
+  },
+  "dependencies": {
+    "@kobalte/core": "^0.9.8",
+    "@rollup/plugin-image": "^3.0.2",
+    "@solidjs/meta": "^0.28.5",
+    "@solidjs/router": "^0.8.2",
+    "@types/node": "^18.17.1",
+    "rollup": "^3.28.0",
+    "rollup-plugin-css-only": "^4.3.0",
+    "rollup-preset-solid": "^2.0.1",
+    "solid-js": "^1.7.9",
+    "solid-start": "^0.2.29"
+  },
+  "peerDependencies": {
+    "solid-js": "^1.7.9"
+  }
+}