Merge branch 'main' into storybook-ci

Author: shairez

.all-contributorsrc

@@ -262,6 +262,26 @@
       "contributions": [
         "code"
       ]
+    },
+    {
+      "login": "naorpeled",
+      "name": "Naor Peled",
+      "avatar_url": "https://avatars.githubusercontent.com/u/6171622?v=4",
+      "profile": "https://naor.dev",
+      "contributions": [
+        "test",
+        "code"
+      ]
+    },
+    {
+      "login": "igalklebanov",
+      "name": "Igal Klebanov",
+      "avatar_url": "https://avatars.githubusercontent.com/u/14938291?v=4",
+      "profile": "https://github.com/igalklebanov",
+      "contributions": [
+        "test",
+        "code"
+      ]
     }
   ],
   "contributorsPerLine": 7,

.eslintrc.json

@@ -1,12 +1,12 @@
 {
   "root": true,
   "ignorePatterns": ["**/*"],
-  "plugins": ["@nrwl/nx"],
+  "plugins": ["@nx"],
   "overrides": [
     {
       "files": ["*.ts", "*.tsx", "*.js", "*.jsx"],
       "rules": {
-        "@nrwl/nx/enforce-module-boundaries": [
+        "@nx/enforce-module-boundaries": [
           "error",
           {
             "enforceBuildableLibDependency": true,
@@ -23,12 +23,12 @@
     },
     {
       "files": ["*.ts", "*.tsx"],
-      "extends": ["plugin:@nrwl/nx/typescript"],
+      "extends": ["plugin:@nx/typescript"],
       "rules": {}
     },
     {
       "files": ["*.js", "*.jsx"],
-      "extends": ["plugin:@nrwl/nx/javascript"],
+      "extends": ["plugin:@nx/javascript"],
       "rules": {}
     },
     {

.github/actions/test/action.yml

@@ -22,7 +22,7 @@ runs:
       shell: bash
       run: npx nx affected:lint --base=last-release --exclude=website
 
-    - name: Build Headless
+    - name: Build Headless Kit
       shell: bash
       run: npx nx build headless
 
@@ -39,9 +39,9 @@ runs:
         storybookBuildDir: dist/storybook/headless
         zip: true
 
-    # - name: Build Daisy Theme
+    # - name: Build Tailwind Theme
     #   shell: bash
-    #   run: npx nx build daisy
+    #   run: npx nx build tailwind
 
     # - name: Build
     #   shell: bash

.github/workflows/website.yml

@@ -0,0 +1,20 @@
+name: Website Deploy
+
+on:
+  - workflow_dispatch
+
+jobs:
+  deploy:
+    runs-on: ubuntu-latest
+
+    if: github.ref == 'refs/heads/main'
+
+    steps:
+      - uses: actions/checkout@v3
+      - name: Setup
+        uses: ./.github/actions/setup
+      - name: Deploy
+        env:
+          CLOUDFLARE_API_TOKEN: ${{ secrets.CLOUDFLARE_API_TOKEN }}
+        shell: bash
+        run: CLOUDFLARE_API_TOKEN=${{ secrets.CLOUDFLARE_API_TOKEN }} npx nx deploy website

.gitignore

@@ -63,4 +63,7 @@ testem.log
 
 # System Files
 .DS_Store
-Thumbs.db
+Thumbs.db
+
+# Storybook
+**/storybook-static/*

.vscode/settings.json

@@ -1,4 +1,4 @@
 {
   "git.pullTags": false,
-  "conventionalCommits.scopes": ["daisy"]
+  "conventionalCommits.scopes": ["tailwind"]
 }

CODING_STANDARDS.md

@@ -64,10 +64,10 @@ export type TooltipProps = QwikIntrinsicElements['div'] & {
 };
 ```
 
-For **Daisy, Material and other components variations**, you can define the new props in a new type, named with the component name and the variation as prefix. For example:
+For **Tailwind, Material and other components variations**, you can define the new props in a new type, named with the component name and the variation as prefix. For example:
 
 ```ts
-type DaisyTooltipProps = {
+type TailwindTooltipProps = {
   size?: 'sm' | 'md';
 };
 ```
@@ -77,7 +77,7 @@ The final exported type will extend from the headless props type. For example:
 ```ts
 import { TooltipProps as HeadlessTooltipProps } from '@qwik-ui/headless';
 
-export type TooltipProps = HeadlessTooltipProps & DaisyTooltipProps;
+export type TooltipProps = HeadlessTooltipProps & TailwindTooltipProps;
 ```
 
 - Use object destructuring in the component$ declaration on all the props you are going to use. For example:
@@ -104,15 +104,15 @@ return (
 - Use accessibility attributes whenever they are needed.
 - For simple primitive states use signals. For object state, use stores.
 
-## Example of headless button customisation with Daisy
+## Example of headless button customisation with Tailwind
 
 ```tsx
 import { component$, QwikIntrinsicElements, Slot } from '@builder.io/qwik';
 import { Button as HeadlessButton, ButtonProps as ButtonHeadlessProps } from '@qwik-ui/headless';
 import { clsq } from '@qwik-ui/shared';
 
-type DaisyButtonProps = { size?: 'sm' | 'md', ... };
-export type ButtonProps = ButtonHeadlessProps & DaisyButtonProps;
+type TailwindButtonProps = { size?: 'sm' | 'md', ... };
+export type ButtonProps = ButtonHeadlessProps & TailwindButtonProps;
 
 export const Button = component$(
   ({ size = 'md', class: classNames, ...rest }: ButtonProps) => {

CONTRIBUTING.md

@@ -64,7 +64,7 @@ git checkout -b my-fix-branch main
 
 - Visit the URL printed in the console and you'll have a page opened with the suite of widgets.
 
-- Once you made some changes in either package (`headless`, `daisy` or `material`), you will see them immediately reflected on the page.
+- Once you made some changes in either package (`headless`, `tailwind` or `material`), you will see them immediately reflected on the page.
 
 ### ▶ 5. Make sure you add / modify tests
 

README.md

@@ -26,7 +26,6 @@
 <details>
 <summary>Table of Contents</summary>
 
-- [⚠ This is not ready for production!](#-this-is-not-ready-for-production)
 - [Installation of the headless components](#installation-of-the-headless-components)
 - [Contributing](#contributing)
 - [Code Of Conduct](#code-of-conduct)
@@ -40,13 +39,16 @@
 
 This library is still in early stages and once we'll collect enough feedback from the community we'll release the first beta version.
 
-We still need to
+### ROADMAP
 
-- [x] Design a normal logo
-- [ ] Build a proper documentation website
-- [ ] Add tests
-- [ ] Fix bugs
-- [ ] more...
+- [ ] Deploy the documentation site
+  - [ ] Add "Readiness" statuses to the components
+  - [ ] Add a getting started video tutorial
+  - [ ] Make a public storybook url
+- [ ] Deploy the tailwind-kit package
+- [ ] Cover all of the components with storybook tests
+- [ ] Add testing coverage reports
+- [ ] Add a contribution tutorial video
 
 <br/>
 
@@ -117,6 +119,8 @@ Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/d
       <td align="center" valign="top" width="14.28%"><a href="https://github.com/PatrykGodlewski"><img src="https://avatars.githubusercontent.com/u/81991100?v=4?s=100" width="100px;" alt="Patryk Godlewski"/><br /><sub><b>Patryk Godlewski</b></sub></a><br /><a href="https://github.com/qwikifiers/qwik-ui/issues?q=author%3APatrykGodlewski" title="Bug reports">🐛</a> <a href="https://github.com/qwikifiers/qwik-ui/commits?author=PatrykGodlewski" title="Code">💻</a></td>
       <td align="center" valign="top" width="14.28%"><a href="https://github.com/pranit-yawalkar"><img src="https://avatars.githubusercontent.com/u/64571514?v=4?s=100" width="100px;" alt="Pranit Yawalkar"/><br /><sub><b>Pranit Yawalkar</b></sub></a><br /><a href="https://github.com/qwikifiers/qwik-ui/issues?q=author%3Apranit-yawalkar" title="Bug reports">🐛</a> <a href="https://github.com/qwikifiers/qwik-ui/commits?author=pranit-yawalkar" title="Code">💻</a></td>
       <td align="center" valign="top" width="14.28%"><a href="https://github.com/gederer"><img src="https://avatars.githubusercontent.com/u/705111?v=4?s=100" width="100px;" alt="Greg Ederer"/><br /><sub><b>Greg Ederer</b></sub></a><br /><a href="https://github.com/qwikifiers/qwik-ui/commits?author=gederer" title="Code">💻</a></td>
+      <td align="center" valign="top" width="14.28%"><a href="https://naor.dev"><img src="https://avatars.githubusercontent.com/u/6171622?v=4?s=100" width="100px;" alt="Naor Peled"/><br /><sub><b>Naor Peled</b></sub></a><br /><a href="https://github.com/qwikifiers/qwik-ui/commits?author=naorpeled" title="Tests">⚠️</a> <a href="https://github.com/qwikifiers/qwik-ui/commits?author=naorpeled" title="Code">💻</a></td>
+      <td align="center" valign="top" width="14.28%"><a href="https://github.com/igalklebanov"><img src="https://avatars.githubusercontent.com/u/14938291?v=4?s=100" width="100px;" alt="Igal Klebanov"/><br /><sub><b>Igal Klebanov</b></sub></a><br /><a href="https://github.com/qwikifiers/qwik-ui/commits?author=igalklebanov" title="Tests">⚠️</a> <a href="https://github.com/qwikifiers/qwik-ui/commits?author=igalklebanov" title="Code">💻</a></td>
     </tr>
   </tbody>
 </table>

apps/website-e2e/cypress.config.ts

@@ -1,5 +1,5 @@
 import { defineConfig } from 'cypress';
-import { nxE2EPreset } from '@nrwl/cypress/plugins/cypress-preset';
+import { nxE2EPreset } from '@nx/cypress/plugins/cypress-preset';
 
 export default defineConfig({
   e2e: nxE2EPreset(__dirname, {