chore: new documentation website (#2468)

* chore: base of new website documentation * Welcome UI Tokens & Styles (Markdown) (#2167) * Updated styles and tokens * Updated styles and tokens * Updated styles and tokens * Updated styles and tokens * Updated styles and tokens * Updated styles and tokens --------- Co-authored-by: Supernova Bot <[email protected]> * docs: change route for design * docs: remove wrong design folder * docs: add table of contents * docs: add sidebar navigation * docs: add static params generation * feat: change folder for docs * docs: format data to have the same between design and dev * docs: upgrade for nextjs 13 packages * docs: add theme * docs: add code mirror * ci: bring back yarn build:docs * docs: remove old design pages * Updated styles and tokens (#2269) Co-authored-by: Supernova Bot <[email protected]> * feat: add new pages overview and props on components * feat: remove old pages from design * fix: change path for components properties * Updated styles and tokens (#2308) Co-authored-by: Supernova Bot <[email protected]> * feat: rework imports * feat: add foundations page on static build * chore: upgrade nextjs * feat: add header * docs: rework documentation template * docs: add alerts * Updated styles and tokens (#2320) Co-authored-by: Supernova Bot <[email protected]> * fix: dont * feat: rework style of titles etc * feat: add Tokens * Updated styles and tokens (#2322) Co-authored-by: Supernova Bot <[email protected]> * feat: add sticky on navigations * feat: add pages from supernova components * feat: rework mdx components and add toc on props page * feat: add style on navigations * fix: wrong case imports * fix: navigation subpages * fix: props page * chore: fix depcheck * feat: add playground component * feat: change lerna config import to avoid alert in console * chore: remove old documentation and upgrade linters * fix: typescript on website * feat: upgrade to nextjs 14 * feat: rebase and upgrade to last nextjs version * feat: rework props page * feat: rework page design * feat: update properties * feat: rebase * feat: add installation block for components * feat: rework pages * fix: table of content and add prev next page on footer * fix: missing ts config on docs * feat: add strong mdx component * feat: add Alert page * feat: add StackBlitz * feat: responsive * feat: rework foundations pages * feat: button build with Ariakit * feat: add Footer and theming badic examples * feat: add new components docs * feat: add new components docs * feat: add new components docs * feat: add icons pages * feat: add new components docs * feat: add new components docs * chore: fix linters * feat: final touch for release new documentation * feat: add Field and fix some issue on preview * feat: add blog page * docs: add contributing --------- Co-authored-by: supernovaio[bot] <85947601+supernovaio[bot]@users.noreply.github.com> Co-authored-by: Supernova Bot <[email protected]>
WTTJ · Jul 12, 2024 · 275b209 · 275b209
1 parent 65bc6fd
commit 275b209
Show file tree

Hide file tree

Showing 678 changed files with 35,431 additions and 12,829 deletions.
diff --git a/.circleci/config.yml b/.circleci/config.yml
@@ -113,39 +113,39 @@ jobs:
             - packages/IconFont/fonts
 
   # current version build (common to previews & prod)
-  docs_build:
+  website_build:
     <<: *defaults
     steps:
       - attach_workspace:
           at: ~/welcome-ui
       - restore_cache:
           key: << pipeline.parameters.cache_version >>-welcome-ui-{{ .Environment.CIRCLE_SHA1 }}
-      - run: yarn docs:build
+      - run: yarn website:build
       - persist_to_workspace:
           root: ~/welcome-ui
           paths:
-            - docs/out
+            - website/out
 
   # current version deploy for previews
-  docs_deploy_preview:
+  website_deploy_preview:
     <<: *defaults
     steps:
       - attach_workspace:
           at: ~/welcome-ui
       - restore_cache:
           key: << pipeline.parameters.cache_version >>-welcome-ui-{{ .Environment.CIRCLE_SHA1 }}
-      - run: node_modules/.bin/netlify deploy --dir=docs/out --alias $CIRCLE_BRANCH
+      - run: node_modules/.bin/netlify deploy --dir=website/out --alias $CIRCLE_BRANCH
 
   # current version deploy for production
-  docs_deploy_prod:
+  website_deploy_prod:
     <<: *defaults
     steps:
       - attach_workspace:
           at: ~/welcome-ui
       - restore_cache:
           key: << pipeline.parameters.cache_version >>-welcome-ui-{{ .Environment.CIRCLE_SHA1 }}
       - aws-s3/sync:
-          from: docs/out
+          from: website/out
           to: s3://welcome-ui/docs_production
           arguments: |
             --metadata GitCommit=$CIRCLE_SHA1
@@ -155,7 +155,7 @@ jobs:
       - run: node_modules/.bin/netlify deploy --dir=docs_production --prod
 
   # previous versions build & deploy for production
-  previous_docs_versions_build_deploy_prod:
+  previous_website_versions_build_deploy_prod:
     <<: *defaults
     steps:
       - attach_workspace:
@@ -164,9 +164,9 @@ jobs:
           key: << pipeline.parameters.cache_version >>-welcome-ui-{{ .Environment.CIRCLE_SHA1 }}
       - run:
           name: build w/ prefix
-          command: VERSION=$CIRCLE_BRANCH yarn docs:build
+          command: VERSION=$CIRCLE_BRANCH yarn website:build
       - aws-s3/sync:
-          from: docs/out
+          from: website/out
           to: s3://welcome-ui/docs_production/$CIRCLE_BRANCH
           arguments: |
             --metadata GitCommit=$CIRCLE_SHA1 --delete
@@ -204,7 +204,6 @@ jobs:
           command: yarn lerna publish from-git --yes --no-verify-access --dist-tag next
 
 workflows:
-  version: 2
   btd:
     jobs:
       - checkout:
@@ -252,13 +251,13 @@ workflows:
           requires:
             - yarn_install
             - build
-      - docs_build:
+      - website_build:
           filters:
             tags:
               only: /.*/
           requires:
             - build
-      - docs_deploy_prod:
+      - website_deploy_prod:
           context:
             - aws
             - netlify
@@ -271,18 +270,18 @@ workflows:
           requires:
             - test
             - lint
-            - docs_build
+            - website_build
             - build_and_release_icon_font
-      - docs_deploy_preview:
+      - website_deploy_preview:
           context:
             - netlify
             - welcome-ui
           requires:
             - test
             - lint
-            - docs_build
+            - website_build
             - build_and_release_icon_font
-      - previous_docs_versions_build_deploy_prod:
+      - previous_website_versions_build_deploy_prod:
           context:
             - aws
             - netlify

diff --git a/.depcheckrc.json b/.depcheckrc.json
@@ -1,5 +1,4 @@
 {
-  "ignores": [
-    "@testing-library/*"
-  ]
-}
+  "ignores": ["@testing-library/*"],
+  "ignorePatterns": ["docs/*"]
+}
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -1,4 +1,3 @@
 module.exports = {
   extends: './node_modules/wttj-config/lib/eslint/eslintrc-typescript',
-  ignorePatterns: ['docs'],
 }
diff --git a/.github/ISSUE_TEMPLATE/update-request.yml b/.github/ISSUE_TEMPLATE/update-request.yml
@@ -102,7 +102,7 @@ body:
     attributes:
       label: '[Tech] Implementation'
       description: 'If possible, describe how this feature could be implemented.'
-      placeholder: 'See [CONTRIBUTING.mdx](https://github.com/WTTJ/welcome-ui/blob/main/CONTRIBUTING.mdx)'
+      placeholder: 'See [CONTRIBUTING.mdx](https://github.com/WTTJ/welcome-ui/tree/main/CONTRIBUTING.mdx)'
   - type: 'input'
     id: 'due-date'
     attributes:

diff --git a/.gitignore b/.gitignore
@@ -1,7 +1,7 @@
 .env
 dist/
-docs/out
-docs/.next
+website/out
+website/.next
 .cache/
 node_modules/
 .DS_Store

diff --git a/.husky/pre-push b/.husky/pre-push
@@ -1 +1 @@
-yarn icons:collect && yarn lint && yarn test && yarn check:deps
+yarn icons:collect && yarn lint && yarn lint:website && yarn test && yarn check:deps
diff --git a/.npmignore b/.npmignore
@@ -1,4 +1,4 @@
 /*
 !/dist/*.js
 *.test.js
-/docs
+/website
diff --git a/CONTRIBUTING.mdx b/CONTRIBUTING.mdx
@@ -31,12 +31,37 @@ Each component will consist of:
   - `src/index.tsx`: The React component
   - `src/styles.ts`: Any related `styled-components`
   - `src/utils.ts` : utils for this component
+  - `src/docs` : documentation for this component [See more](#documentation)
   - `tests/index.test.ts`: Jest / react-testing-library tests for this component
 
 ## Adding icons
 
-Check the [Icon README](https://github.com/WTTJ/welcome-ui/blob/main/icons/README.md)
+Check the [Icon README](https://github.com/WTTJ/welcome-ui/tree/main/icons/README.md)
 
 ## Reporting issues
 
 You can report issues on our [github project](https://github.com/WTTJ/welcome-ui/issues) 🐛
+
+## Documentation
+
+Our documentation is based on NextJS with mdx files and nodejs script.
+
+### For a Component
+
+All component documentation is now located in its repository's `docs` folder:
+
+- `index.mdx`:
+  - **Header**: Contains the following information:
+    - `ariakit`: Link (if used in this component, will be transformed into a button on the page header)
+    - `description`: From ChatGPT
+    - `name`
+    - `packageName`: Name of the npm package
+    - `usage`: If needed, for example, if the import is different from the component name
+- `/examples`:
+  - **overview.mdx**: The main example shown at the top of the component page
+  - Others: Your other examples
+- `properties.json`: Auto-generated with `yarn watch`. It includes the list of the component's properties.
+
+### For a foundation page
+
+Simply add your new page on it, it's magic!
diff --git a/README.md b/README.md
@@ -1,7 +1,5 @@
 # Welcome UI
 
-<img src="docs/public/illustration.png" width="300" />
-
 Welcome to the _Welcome UI library_ created by [Welcome to the jungle](https://www.welcometothejungle.com), a customizable design system with react • typescript • styled-components • styled-system and ariakit.
 
 Here you'll find all the core components you need to create a delightful webapp.
@@ -10,7 +8,7 @@ Here you'll find all the core components you need to create a delightful webapp.
 
 ---
 
-[![License](https://img.shields.io/npm/l/welcome-ui.svg)](https://github.com/WTTJ/welcome-ui/blob/main/LICENSE) ![Code formating](https://img.shields.io/badge/code%20formating-prettier-blue.svg) ![Code style](https://img.shields.io/badge/code%20style-styled--components-ff69b4.svg) [![PRs Welcome](https://img.shields.io/badge/PRs-welcome-mediumspringgreen.svg)](https://github.com/WTTJ/welcome-ui/blob/main/CONTRIBUTING.mdx) [![Conventional Commits](https://img.shields.io/badge/Conventional%20Commits-1.0.0-yellow.svg)](https://conventionalcommits.org)
+[![License](https://img.shields.io/npm/l/welcome-ui.svg)](https://github.com/WTTJ/welcome-ui/tree/main/LICENSE) ![Code formating](https://img.shields.io/badge/code%20formating-prettier-blue.svg) ![Code style](https://img.shields.io/badge/code%20style-styled--components-ff69b4.svg) [![PRs Welcome](https://img.shields.io/badge/PRs-welcome-mediumspringgreen.svg)](https://github.com/WTTJ/welcome-ui/tree/main/CONTRIBUTING.mdx) [![Conventional Commits](https://img.shields.io/badge/Conventional%20Commits-1.0.0-yellow.svg)](https://conventionalcommits.org)
 
 ---
 

diff --git a/docs/babel.config.js b/docs/babel.config.js
diff --git a/docs/components/App.js b/docs/components/App.js
diff --git a/docs/components/Colors.js b/docs/components/Colors.js
diff --git a/docs/components/ComponentsList/Link.js b/docs/components/ComponentsList/Link.js