feat($styled): make $styled work in every integration; tests; prepare…

… for v1-beta
Tahul · Oct 15, 2023 · 2cf97dd · 2cf97dd
1 parent 565dee2
commit 2cf97dd
Show file tree

Hide file tree

Showing 162 changed files with 3,452 additions and 1,524 deletions.
diff --git a/.gitignore b/.gitignore
@@ -90,3 +90,6 @@ packages/*/dist
 
 # vite-plugin-inspect
 .vite-inspect
+
+# vite
+vite.config.ts.timestamp-*
diff --git a/docs/.gitignore b/docs/.gitignore
@@ -0,0 +1,24 @@
+# Nuxt dev/build outputs
+.output
+.data
+.nuxt
+.nitro
+.cache
+dist
+
+# Node dependencies
+node_modules
+
+# Logs
+logs
+*.log
+
+# Misc
+.DS_Store
+.fleet
+.idea
+
+# Local env files
+.env
+.env.*
+!.env.example
diff --git a/docs/.npmrc b/docs/.npmrc
@@ -0,0 +1 @@
+shamefully-hoist=true
diff --git a/docs/README.md b/docs/README.md
@@ -0,0 +1,75 @@
+# Nuxt 3 Minimal Starter
+
+Look at the [Nuxt 3 documentation](https://nuxt.com/docs/getting-started/introduction) to learn more.
+
+## Setup
+
+Make sure to install the dependencies:
+
+```bash
+# npm
+npm install
+
+# pnpm
+pnpm install
+
+# yarn
+yarn install
+
+# bun
+bun install
+```
+
+## Development Server
+
+Start the development server on `http://localhost:3000`:
+
+```bash
+# npm
+npm run dev
+
+# pnpm
+pnpm run dev
+
+# yarn
+yarn dev
+
+# bun
+bun run dev
+```
+
+## Production
+
+Build the application for production:
+
+```bash
+# npm
+npm run build
+
+# pnpm
+pnpm run build
+
+# yarn
+yarn build
+
+# bun
+bun run build
+```
+
+Locally preview production build:
+
+```bash
+# npm
+npm run preview
+
+# pnpm
+pnpm run preview
+
+# yarn
+yarn preview
+
+# bun
+bun run preview
+```
+
+Check out the [deployment documentation](https://nuxt.com/docs/getting-started/deployment) for more information.
diff --git a/docs/app.vue b/docs/app.vue
@@ -0,0 +1,5 @@
+<template>
+  <div>
+    <NuxtWelcome />
+  </div>
+</template>
diff --git a/docs/nuxt.config.ts b/docs/nuxt.config.ts
@@ -1,9 +1,55 @@
+import { createResolver } from '@nuxt/kit'
 import { defineNuxtConfig } from 'nuxt/config'
 
+const resolve = (p: string) => createResolver(import.meta.url).resolve(p)
+
+// https://nuxt.com/docs/api/configuration/nuxt-config
 export default defineNuxtConfig({
-  css: [
-    '~/main.postcss',
+  app: {
+    head: {
+      link: [
+        {
+          rel: 'icon',
+          type: 'image/png',
+          href: '/favicon.png',
+        },
+        {
+          rel: 'icon',
+          type: 'image/svg+xml',
+          href: '/favicon.svg',
+        },
+      ],
+    },
+  },
+
+  devtools: { enabled: true },
+
+  typescript: {
+    includeWorkspace: false,
+  },
+
+  modules: [
+    '@nuxt/content',
+    '@pinceau/nuxt',
   ],
+
+  pinceau: {
+    debug: 2,
+    style: {
+      excludes: [
+        resolve('../../packages'),
+      ],
+    },
+    theme: {
+      buildDir: resolve('./node_modules/.pinceau'),
+      layers: [
+        {
+          path: resolve('../../packages/palette/'),
+        },
+      ],
+    },
+  },
+
   content: {
     highlight: {
       theme: {

diff --git a/docs/package.json b/docs/package.json
@@ -1,14 +1,23 @@
 {
   "name": "@pinceau/docs",
   "private": true,
-  "packageManager": "[email protected]",
+  "type": "module",
   "scripts": {
-    "dev": "nuxi dev",
-    "build": "nuxi generate",
-    "prepare": "nuxi prepare"
+    "build": "nuxt build",
+    "stub": "nuxt prepare",
+    "dev": "nuxt dev",
+    "generate": "nuxt generate",
+    "preview": "nuxt preview"
   },
   "devDependencies": {
+    "@nuxt/content": "^2.8.5",
+    "@nuxt/devtools": "latest",
     "@pinceau/nuxt": "workspace:*",
-    "@vueuse/motion": "^2.0.0"
+    "@pinceau/palette": "workspace:*",
+    "@vueuse/motion": "^2.0.0",
+    "nuxt": "^3.7.4",
+    "nuxt-icon": "^0.5.0",
+    "vue": "^3.3.4",
+    "vue-router": "^4.2.5"
   }
 }
diff --git a/docs/public/favicon.png b/docs/public/favicon.png
diff --git a/docs/public/favicon.svg b/docs/public/favicon.svg
diff --git a/docs/server/tsconfig.json b/docs/server/tsconfig.json
@@ -0,0 +1,3 @@
+{
+  "extends": "../.nuxt/tsconfig.server.json"
+}
diff --git a/docs/tsconfig.json b/docs/tsconfig.json
@@ -1,3 +1,4 @@
 {
+  // https://nuxt.com/docs/guide/concepts/typescript
   "extends": "./.nuxt/tsconfig.json"
 }
diff --git a/docs/.DS_Store → docs_old/.DS_Store b/docs/.DS_Store → docs_old/.DS_Store
diff --git a/docs/app.config.ts → docs_old/app.config.ts b/docs/app.config.ts → docs_old/app.config.ts
diff --git a/docs_old/app.vue b/docs_old/app.vue
diff --git a/...ontent/0.get-started/0.what-is-pinceau.md → ...ontent/0.get-started/0.what-is-pinceau.md b/...ontent/0.get-started/0.what-is-pinceau.md → ...ontent/0.get-started/0.what-is-pinceau.md
diff --git a/docs/content/0.get-started/1.installation.md → ...d/content/0.get-started/1.installation.md b/docs/content/0.get-started/1.installation.md → ...d/content/0.get-started/1.installation.md
diff --git a/...ntent/0.get-started/2.vscode-extension.md → ...ntent/0.get-started/2.vscode-extension.md b/...ntent/0.get-started/2.vscode-extension.md → ...ntent/0.get-started/2.vscode-extension.md
diff --git a/docs/content/0.get-started/_dir.yml → docs_old/content/0.get-started/_dir.yml b/docs/content/0.get-started/_dir.yml → docs_old/content/0.get-started/_dir.yml
diff --git a/docs/content/0.index.md → docs_old/content/0.index.md b/docs/content/0.index.md → docs_old/content/0.index.md
diff --git a/...ontent/1.configuration/0.tokens-config.md → ...ontent/1.configuration/0.tokens-config.md b/...ontent/1.configuration/0.tokens-config.md → ...ontent/1.configuration/0.tokens-config.md
diff --git a/...ontent/1.configuration/1.design-tokens.md → ...ontent/1.configuration/1.design-tokens.md b/...ontent/1.configuration/1.design-tokens.md → ...ontent/1.configuration/1.design-tokens.md
diff --git a/...ontent/1.configuration/2.media-queries.md → ...ontent/1.configuration/2.media-queries.md b/...ontent/1.configuration/2.media-queries.md → ...ontent/1.configuration/2.media-queries.md
diff --git a/...nt/1.configuration/3.responsive-tokens.md → ...nt/1.configuration/3.responsive-tokens.md b/...nt/1.configuration/3.responsive-tokens.md → ...nt/1.configuration/3.responsive-tokens.md
diff --git a/...ent/1.configuration/4.utils-properties.md → ...ent/1.configuration/4.utils-properties.md b/...ent/1.configuration/4.utils-properties.md → ...ent/1.configuration/4.utils-properties.md
diff --git a/docs/content/1.configuration/_dir.yml → docs_old/content/1.configuration/_dir.yml b/docs/content/1.configuration/_dir.yml → docs_old/content/1.configuration/_dir.yml
diff --git a/docs/content/1.playground.md → docs_old/content/1.playground.md b/docs/content/1.playground.md → docs_old/content/1.playground.md
diff --git a/...ntent/2.styling/0.your-first-component.md → ...ntent/2.styling/0.your-first-component.md b/...ntent/2.styling/0.your-first-component.md → ...ntent/2.styling/0.your-first-component.md
diff --git a/docs/content/2.styling/1.css-function.md → docs_old/content/2.styling/1.css-function.md b/docs/content/2.styling/1.css-function.md → docs_old/content/2.styling/1.css-function.md
diff --git a/docs/content/2.styling/2.tokens-helper.md → ..._old/content/2.styling/2.tokens-helper.md b/docs/content/2.styling/2.tokens-helper.md → ..._old/content/2.styling/2.tokens-helper.md
diff --git a/docs/content/2.styling/3.computed-styles.md → ...ld/content/2.styling/3.computed-styles.md b/docs/content/2.styling/3.computed-styles.md → ...ld/content/2.styling/3.computed-styles.md
diff --git a/docs/content/2.styling/4.variants.md → docs_old/content/2.styling/4.variants.md b/docs/content/2.styling/4.variants.md → docs_old/content/2.styling/4.variants.md
diff --git a/docs/content/2.styling/5.css-prop.md → docs_old/content/2.styling/5.css-prop.md b/docs/content/2.styling/5.css-prop.md → docs_old/content/2.styling/5.css-prop.md
diff --git a/docs/content/2.styling/_dir.yml → docs_old/content/2.styling/_dir.yml b/docs/content/2.styling/_dir.yml → docs_old/content/2.styling/_dir.yml
diff --git a/...ntent/3.advanced/0.vite-plugin-options.md → ...ntent/3.advanced/0.vite-plugin-options.md b/...ntent/3.advanced/0.vite-plugin-options.md → ...ntent/3.advanced/0.vite-plugin-options.md
diff --git a/docs/content/3.advanced/1.multi-layer.md → docs_old/content/3.advanced/1.multi-layer.md b/docs/content/3.advanced/1.multi-layer.md → docs_old/content/3.advanced/1.multi-layer.md
diff --git a/docs/content/3.advanced/_dir.yml → docs_old/content/3.advanced/_dir.yml b/docs/content/3.advanced/_dir.yml → docs_old/content/3.advanced/_dir.yml
diff --git a/docs/main.postcss → docs_old/main.postcss b/docs/main.postcss → docs_old/main.postcss
diff --git a/docs_old/nuxt.config.ts b/docs_old/nuxt.config.ts
@@ -0,0 +1,15 @@
+import { defineNuxtConfig } from 'nuxt/config'
+
+export default defineNuxtConfig({
+  css: [
+    '~/main.postcss',
+  ],
+  content: {
+    highlight: {
+      theme: {
+        default: 'github-light',
+        dark: 'github-dark',
+      },
+    },
+  },
+})
diff --git a/docs_old/package.json b/docs_old/package.json
@@ -0,0 +1,14 @@
+{
+  "name": "@pinceau/docs",
+  "private": true,
+  "packageManager": "[email protected]",
+  "scripts": {
+    "dev": "nuxi dev",
+    "build": "nuxi generate",
+    "prepare": "nuxi prepare"
+  },
+  "devDependencies": {
+    "@pinceau/nuxt": "workspace:*",
+    "@vueuse/motion": "^2.0.0"
+  }
+}
diff --git a/docs/public/.DS_Store → docs_old/public/.DS_Store b/docs/public/.DS_Store → docs_old/public/.DS_Store
diff --git a/docs/public/PaytoneOne-Regular.ttf → docs_old/public/PaytoneOne-Regular.ttf b/docs/public/PaytoneOne-Regular.ttf → docs_old/public/PaytoneOne-Regular.ttf
diff --git a/docs/public/android-chrome-192x192.png → docs_old/public/android-chrome-192x192.png b/docs/public/android-chrome-192x192.png → docs_old/public/android-chrome-192x192.png
diff --git a/docs/public/apple-touch-icon.png → docs_old/public/apple-touch-icon.png b/docs/public/apple-touch-icon.png → docs_old/public/apple-touch-icon.png
diff --git a/docs/public/background.png → docs_old/public/background.png b/docs/public/background.png → docs_old/public/background.png
diff --git a/docs/public/brush.svg → docs_old/public/brush.svg b/docs/public/brush.svg → docs_old/public/brush.svg
diff --git a/docs/public/cover.jpg → docs_old/public/cover.jpg b/docs/public/cover.jpg → docs_old/public/cover.jpg
diff --git a/docs/public/favicon-16x16.png → docs_old/public/favicon-16x16.png b/docs/public/favicon-16x16.png → docs_old/public/favicon-16x16.png
diff --git a/docs/public/favicon-32x32.png → docs_old/public/favicon-32x32.png b/docs/public/favicon-32x32.png → docs_old/public/favicon-32x32.png
diff --git a/docs/public/favicon.ico → docs_old/public/favicon.ico b/docs/public/favicon.ico → docs_old/public/favicon.ico
diff --git a/docs/public/head.svg → docs_old/public/head.svg b/docs/public/head.svg → docs_old/public/head.svg
diff --git a/docs/public/logo.png → docs_old/public/logo.png b/docs/public/logo.png → docs_old/public/logo.png
diff --git a/docs/public/logo.svg → docs_old/public/logo.svg b/docs/public/logo.svg → docs_old/public/logo.svg
diff --git a/docs/public/palette.svg → docs_old/public/palette.svg b/docs/public/palette.svg → docs_old/public/palette.svg
diff --git a/docs/public/site.webmanifest → docs_old/public/site.webmanifest b/docs/public/site.webmanifest → docs_old/public/site.webmanifest
diff --git a/docs/public/social.jpg → docs_old/public/social.jpg b/docs/public/social.jpg → docs_old/public/social.jpg
diff --git a/docs/tokens.config.ts → docs_old/tokens.config.ts b/docs/tokens.config.ts → docs_old/tokens.config.ts
diff --git a/docs_old/tsconfig.json b/docs_old/tsconfig.json
@@ -0,0 +1,3 @@
+{
+  "extends": "./.nuxt/tsconfig.json"
+}
diff --git a/examples/astro-svelte/package.json b/examples/astro-svelte/package.json
@@ -16,7 +16,7 @@
     "@pinceau/astro": "workspace:*",
     "@pinceau/configs": "workspace:*",
     "@pinceau/svelte": "workspace:*",
-    "astro": "^3.2.4"
+    "astro": "^3.3.0"
   },
   "stackblitz": {
     "installDependencies": false,

diff --git a/examples/astro-vue/package.json b/examples/astro-vue/package.json
@@ -16,7 +16,7 @@
     "@pinceau/astro": "workspace:*",
     "@pinceau/configs": "workspace:*",
     "@pinceau/vue": "workspace:*",
-    "astro": "^3.2.4"
+    "astro": "^3.3.0"
   },
   "stackblitz": {
     "installDependencies": false,

diff --git a/examples/astro/package.json b/examples/astro/package.json
@@ -10,7 +10,7 @@
   },
   "devDependencies": {
     "@pinceau/astro": "workspace:*",
-    "astro": "^3.2.4",
+    "astro": "^3.3.0",
     "canvas-confetti": "^1.9.0"
   },
   "stackblitz": {

diff --git a/examples/nuxt/nuxt.config.ts b/examples/nuxt/nuxt.config.ts
@@ -1,3 +1,4 @@
+import { defineNuxtConfig } from 'nuxt/config'
 import { createResolver } from '@nuxt/kit'
 
 const { resolve } = createResolver(import.meta.url)

diff --git a/examples/shared/package.json b/examples/shared/package.json
@@ -0,0 +1,7 @@
+{
+  "name": "@pinceau/examples-shared",
+  "private": "true",
+  "devDependencies": {
+    "@pinceau/configs": "workspace:*"
+  }
+}
diff --git a/examples/shared/tsconfig.json b/examples/shared/tsconfig.json
@@ -0,0 +1,3 @@
+{
+  "extends": "@pinceau/configs/tsconfig.base.json"
+}
diff --git a/examples/vite-react/package.json b/examples/vite-react/package.json
@@ -15,7 +15,7 @@
   "devDependencies": {
     "@pinceau/configs": "workspace:*",
     "@pinceau/react": "workspace:*",
-    "@types/node": "20.8.4",
+    "@types/node": "20.8.5",
     "@types/react": "latest",
     "@types/react-dom": "latest",
     "@vitejs/plugin-react": "^4.1.0",

diff --git a/examples/vite-svelte/src/App.svelte b/examples/vite-svelte/src/App.svelte
@@ -11,11 +11,32 @@
         padding: '2em',
         margin: '0 auto',
         minHeight: '100%',
+        color: '$color.red.1'
       },
     },
   })
 
   const main = styled({})
+
+  const TestComponent = $styled.a({ color: 'green'}).withVariants({
+    size: {
+      md: {
+        padding: '$space.32'
+      },
+      options: {
+        default: 'md'
+      }
+    }
+  })
+
+  console.log(TestComponent)
 </script>
 
+
+<div>
 <main class={main}>Hello world</main>
+
+<TestComponent color="blue">
+  hello
+</TestComponent>
+</div>
diff --git a/examples/vite-svelte/vite.config.ts b/examples/vite-svelte/vite.config.ts
@@ -19,7 +19,6 @@ export default defineConfig({
   },
   plugins: [
     Pinceau({
-      vue: false,
       debug: 2,
       style: {
         excludes: [