Rework documentation front (#46)

* docs: rework front

update routing

* style: edit eslint and prettier config

* test: fix test for components after update

* refactor: clean html template with prettier conf

* perf: remove unused dependencies

* fix: development/production config with nx start

* docs: add icons from figma

* docs: remove svg dark:hidden

* docs: make home page responsive for mobile

* docs: update home page responsive tablet

* docs: add responsive laptop screen

* docs: fix display block img

* docs: simplify css home page

* docs: clean imports and export library

* feat: upgrade to nx 19

* feat: upgrade to angular 18

* feat: migrate sidebar service to signal style

* fix: fix eslint comment

* feat: migrate alert to signal

* feat: migrate component to input style

* fix: update project.json to build

* refactor: component code

* fix: theme local storage

* feat: clean accordion component / signal service

* refactor: clean theme component's part

* refactor: add region to component's theme

* refactor: remove direct call to Flowbite varients

* feat: theme service implementation for components

* feat: add Combination type

* feat: switch from interface to type

* feat: using Combination

* feat: add [key: string]: string to component parameter types

* feat: update navbar and add navbar toggle

* refactor: clean input name and add link service

* feat: migrate input and directive to new style sys

* fix: rollback generateId in onInit

* fix: crypto is not defined

* feat: move to shiki and restyle input-field

* feat: add some documentation + update library components

* feat: add default tailwind conf for library

* refactor: new prettier and lint config

* feat: add CodeRabbit configuration

* feat: move common into shared

* refactor: update remove .tsx fils from eslint config

* feat: update badge documentation

* feat: update accordion documentation page

* feat: update alert documentation page

* feat: update breadcrumb documentation page

* feat: update button documentation page

* feat: update dropdown documentation page

* feat: update indicator documentation page

* feat: update modal documentation page

* fix(docs): clip display example

* refactor: auto close html tag

* feat(â�docs): use iframe

* feat(docs): add control panel on preview

* feat(docs): add dark mode to iframe

* feat: update breadcrumb documentation page

* feat: update button documentation page

* feat: update dropdown documentation page

* feat: update modal documentation page

* feat(docs): add size demo

* feat(docs): update frame display height

* feat(docs): get icons from flowbite-icon without size and color

* feat: update usage of icons

* feat: create IconComponent & single template file

* refactor: remove img sun

* refactor: format frame html code

* feat: update icons in frame display

* refactor: reorder class's member

* feat: use IconComponent in other components

* feat: many things after git crash lost commits :/

* docs(alert): complete alert documentation

* docs(alert): re-add dismissable alerts section

* docs: move github files to .github dir

* feat: move to structural directive for routable components

* feat: use RouterLink directive as HostDirective

* docs: add override-base-style page

* docs: fix w-full & add fragment anchor

* feat: move from aliases to colors

* feat: fix color call of config

* feat: from baseComponent to baseDirective

* feat: simplify theme files

* docs: fix customStyle

* feat: add dark and primary to colors of component

* fix: breadcrumb style

* fix: indicator offset

* feat: add sidebar-menu and add mobile support for docs

* fix(sidebar): fix autoclose on click

* fix: mobile display

* fix: mobile display

* fix(sidebar): scrollable if opened

* fix(sidebar): shrink-0

* feat(accordion): add isAlwaysOpen & clean classes

* refactor: make all inject public

* docs(accordion): add always open doc

* docs: simplify example setup

* docs(accordion): add color and flush accordion example

* feat: move baseComponent to directive

* feat: add init and verify function (see AccordionComponent)

* feat: move to inject component instead of themeServices

* docs: resize iframe for updated components

* docs: add shiki theme on components

* docs: add customStyle usage

* feat(sidebar): add RouterLinkActive to items (not binded yet on isActive in theme)

* feat(sidebar): add color and auto open if active

* feat: moe from input boolean | string to unknown

* feat: change default color to get parent's one

* feat(breadcrumb): add color support

* fix(indicator): display with text and default color

* fix: prerender error with assets not being found

* feat(navbar): add routerLinkActive like sidebar

* docs: make iframe full height

* refactor: change to anchor href for redirect

* feat(dropdown): update divider and finish doc

* feat: modal docs

* docs: added title on pages

* refactor: little fixes

* docs: add table of content

* feat: add flowbiterouterlink with href for external link

* feat(ui): Navbar layout, navbar icons and small styling changes (#50)

* feat(ui): update navbar layout

* feat(ui): add navbar icon buttons for resources

* feat(ui): change sidebar border-r colour to match figma

* feat(ui): address PR comments

* feat(ui): update ui component html

---------

Co-authored-by: MGREMY <[email protected]>

* feat(ui): add copy package input component (#51)

* feat(ui): update navbar layout

* feat(ui): add navbar icon buttons for resources

* feat(ui): change sidebar border-r colour to match figma

* feat(ui): address PR comments

* feat(ui): update ui component html

* feat(ui): add copy package input component

---------

Co-authored-by: MGREMY <[email protected]>

* docs: add sidebar documentation

* docs: add navbar documentation

* Move to new angular build executor (#52)

* fix: build

* feat: move to new application executor

* feat: config vercel

* feat: update nx

* fix: update vercel config

* fix: add env variable in vercel config

---------

Co-authored-by: GREMY Miguel <[email protected]>

* Move to npm package manager (#53)

* chore: move from yarn to npm

* fix: vercel npm install command

* fix: to npx command

* chore: add trigger to workflow

* fix: github ci

* fix: ci commands

* refactor: pretty files

* Full move to NgDoc library (#55)

* docs: move to ng-doc

* docs: add basic config and move landing page

* docs: full move to ng-doc

* docs: add all getting started

* docs: add customize section

* docs begin components doc

* chore: add lock file and move to npm ci

* chore: update commands & vercel config & ci config

* docs: add sidebar toggle for mobile

* docs: custom theme with custom primary color

* docs: add footer

* docs: add page processor for demo

* docs: add keyword to pages

* docs: custom ng-doc generation to fit flowbite recommendations

* docs: accordion docs moved to ng-doc

* docs: alert docs moved to ng-doc

* docs: badge docs moved to ng-doc

* docs: breadcrumb docs moved to ng-doc

* docs: button docs moved to ng-doc

* docs: dropdown docs moved to ng-doc

* docs: indicator docs moved to ng-doc

* docs: modal docs moved to ng-doc

* docs: navbar docs moved to ng-doc

* docs: sidebar docs moved to ng-doc

* docs: fix navigation bug

* docs: add subtitle on pages

* docs: clear file name when having demo component

* docs: from angular-{ts,html} to {typescript,html}

* docs: add custom header, add API page

* docs: update dependencies to fix angular keywords

* docs: update api generation

* docs: add search bar

* docs: add comments to fill the documentation

* docs: add comments in service section for the documentation

* docs: add documentation for pipes

* docs: add comments for directives and common

* fix(modal): close on route change #33 (#56)

* fix(modal): close on route change #33

* fix(modal): close on backdrop click

* fix(modal): use signal based viewChild instead of @ViewChild

* fix(modal): set z-index to 99

* fix(modal): update ModalClass to not apply any class on the host

* feat(angular): remove allowSignalWrite from component declaration

* fix(sidebar): inherit color from itemgroup/menu (it not provided) (#57)

* fix(sidebar): inherit color from itemgroup/menu (it not provided)

* fix(sidebar): remove unnecessary computed

* fix(sidebar): verify() revert back

* feat: multiple changes

BREAKING CHANGES: remove state service (except theme toggle) and switch from `input()` to `model()`

* refacto: move flowbite.theme.service and directive input/output

* refacto: remove auto call to flowbite directive and add it in template when necessary

* refacto: move every @host to host elements in @component decorator

* docs: remove padding x in landing page & add themeService for buttons in landing page

* refacto: split common types into multiple files

* chore: add public-api.ts file, preparing for segmentation with ng-packagr

* docs(navbar): add navbar example with brand, dropdown and toggle (#60)

* docs(navbar): add navbar example with brand and dropdown

inspired by flowbite-react

* docs(navbar): add example of responsive navbar

* docs(navbar): fix flowbite-navbar-brand placement

* docs(navbar): add description to responsive example

* docs(navbar): auto close if possible

* docs(docs): add base documentation

* docs(docs): update parameter table & links

* chore: remove BUILD-TOOLS.md

* fix(docs): revert `ul` and `ol` only outside of `flowbite-dropdown` #59 (#62)

fix(docs): revert `ul` and `ol` only outside of `flowbite-dropdown`

* docs(sidebar): add multi-level documentation

---------

Co-authored-by: MGREMY <[email protected]>
Co-authored-by: Ross <[email protected]>
Co-authored-by: Bence Lovász <[email protected]>

Author: 4 people

.coderabbit.yaml

@@ -0,0 +1,72 @@
+language: en-US
+tone_instructions: ''
+early_access: false
+enable_free_tier: true
+reviews:
+  profile: chill
+  request_changes_workflow: false
+  high_level_summary: true
+  high_level_summary_placeholder: '@coderabbitai summary'
+  auto_title_placeholder: '@coderabbitai'
+  poem: true
+  review_status: true
+  collapse_walkthrough: false
+  path_filters: []
+  path_instructions: []
+  abort_on_close: true
+  auto_review:
+    enabled: true
+    auto_incremental_review: true
+    ignore_title_keywords: []
+    labels: []
+    drafts: true
+    base_branches: []
+  tools:
+    shellcheck:
+      enabled: true
+    ruff:
+      enabled: true
+    markdownlint:
+      enabled: true
+    github-checks:
+      enabled: true
+      timeout_ms: 90000
+    languagetool:
+      enabled: true
+      disabled_rules:
+        - EN_UNPAIRED_BRACKETS
+        - EN_UNPAIRED_QUOTES
+      disabled_categories:
+        - TYPOS
+        - TYPOGRAPHY
+        - CASING
+      enabled_only: false
+      level: default
+    biome:
+      enabled: true
+    hadolint:
+      enabled: false
+    swiftlint:
+      enabled: false
+    phpstan:
+      enabled: false
+      level: default
+    golangci-lint:
+      enabled: false
+    yamllint:
+      enabled: true
+    gitleaks:
+      enabled: true
+    checkov:
+      enabled: true
+chat:
+  auto_reply: true
+knowledge_base:
+  learnings:
+    scope: auto
+  issues:
+    scope: auto
+  jira:
+    project_keys: []
+  linear:
+    team_keys: []

.editorconfig

@@ -1,43 +1,46 @@
 {
   "root": true,
-  "ignorePatterns": ["**/*"],
-  "plugins": ["@nx", "sort-imports-es6-autofix"],
+  "ignorePatterns": ["!**/*"],
+  "plugins": ["@nx", "@typescript-eslint"],
+  "extends": ["plugin:@angular-eslint/recommended", "plugin:@typescript-eslint/recommended-type-checked", "prettier"],
   "overrides": [
     {
-      "files": ["*.ts", "*.tsx", "*.js", "*.jsx"],
+      "files": ["*.ts"],
+      "plugins": [],
+      "extends": [],
       "rules": {
-        "sort-imports-es6-autofix/sort-imports-es6": [
-          2,
+        // eslint
+        "no-extra-semi": 0,
+        "comma-dangle": 0,
+        "no-empty-function": 0,
+        // typescript-eslint
+        "@typescript-eslint/comma-dangle": 0,
+        "@typescript-eslint/no-extra-semi": 2,
+        "@typescript-eslint/lines-around-comment": 1,
+        "@typescript-eslint/member-delimiter-style": 2,
+        "@typescript-eslint/member-ordering": [
+          1,
           {
-            "ignoreCase": false,
-            "ignoreMemberSort": false,
-            "memberSyntaxSortOrder": ["none", "all", "multiple", "single"]
+            "default": ["signature", "field", "constructor", "method"]
           }
         ],
-        "@nx/enforce-module-boundaries": [
-          "error",
-          {
-            "enforceBuildableLibDependency": true,
-            "allow": [],
-            "depConstraints": [
-              {
-                "sourceTag": "*",
-                "onlyDependOnLibsWithTags": ["*"]
-              }
-            ]
-          }
-        ]
+        "@typescript-eslint/no-empty-function": 1,
+        "@typescript-eslint/no-explicit-any": 1,
+        "@typescript-eslint/no-unnecessary-condition": 2,
+        "@typescript-eslint/no-unsafe-assignment": 0,
+        "@typescript-eslint/no-unsafe-call": 0,
+        "@typescript-eslint/no-unsafe-argument": 0,
+        "@typescript-eslint/no-unsafe-member-access": 0,
+        "@typescript-eslint/no-floating-promises": 0,
+        "@typescript-eslint/consistent-type-imports": 2,
+        "@typescript-eslint/consistent-type-exports": 2,
+        "@typescript-eslint/no-namespace": 0,
+        // angular-eslint
+        "@angular-eslint/no-host-metadata-property": "off",
+        // nx
+        "@nx/dependency-checks": 2,
+        "@nx/enforce-module-boundaries": 2
       }
-    },
-    {
-      "files": ["*.ts", "*.tsx"],
-      "extends": ["plugin:@nx/typescript"],
-      "rules": {}
-    },
-    {
-      "files": ["*.js", "*.jsx"],
-      "extends": ["plugin:@nx/javascript"],
-      "rules": {}
     }
   ]
 }

.eslintrc.json

@@ -38,4 +38,4 @@ Our Code of Conduct means that you are responsible for treating everyone on the
 
 ## Code of conduct
 
-For more information [check this file](CODE_OF_CONDUCT.md).
+For more information [check this file](CODE_OF_CONDUCT).

CODE_OF_CONDUCT.md renamed to .github/CODE_OF_CONDUCT

@@ -1,6 +1,7 @@
 name: CI Checks
 
 on:
+  workflow_dispatch:
   pull_request:
     branches:
       - main
@@ -28,21 +29,21 @@ jobs:
         uses: actions/cache@v3
         with:
           path: '**/node_modules'
-          key: ${{ runner.os }}-modules-${{ hashFiles('**/yarn.lock') }}
+          key: ${{ runner.os }}-modules-${{ hashFiles('**/package-lock.json') }}
           restore-keys: |
             ${{ runner.os }}-modules-
 
       - name: Install packages 🏭
-        run: yarn
+        run: npm ci
 
       - name: Lint the code 🕵
-        run: yarn lint
+        run: npm run all:lint
 
       - name: Run Prettier 💅
-        run: yarn prettier --base=HEAD
+        run: npm run prettier
 
       - name: Run unit tests 🔬
-        run: yarn test
+        run: npm run all:test
 
       - name: Build code 🛠
-        run: yarn build
+        run: npm run all:build

CONTRIBUTING.md renamed to .github/CONTRIBUTING

@@ -7,8 +7,7 @@
 
 # dependencies
 node_modules
-package-lock.json
-yarn.lock
+#package-lock.json
 
 # IDEs and editors
 /.idea
@@ -32,7 +31,6 @@ yarn.lock
 /coverage
 /libpeerconnection.log
 npm-debug.log
-yarn-error.log
 testem.log
 /typings
 
@@ -44,3 +42,7 @@ Thumbs.db
 
 .vercel
 .nx
+
+
+# NgDoc files
+/ng-doc

.github/workflows/ci-checks.yaml

@@ -1,4 +1,4 @@
 #!/usr/bin/env sh
 . "$(dirname -- "$0")/_/husky.sh"
 
-yarn lint-staged --concurrent false --relative
+npm run all:lint

.gitignore

@@ -5,4 +5,5 @@
 
 .angular
 
-/.nx/cache
+/.nx/cache
+/.nx/workspace-data

.husky/.gitignore

@@ -1,3 +1,20 @@
 {
-  "singleQuote": true
+  "endOfLine": "crlf",
+  "singleQuote": true,
+  "singleAttributePerLine": true,
+  "bracketSameLine": true,
+  "printWidth": 120,
+  "trailingComma": "all",
+  "plugins": ["prettier-plugin-packagejson", "@ianvs/prettier-plugin-sort-imports"],
+  "importOrderParserPlugins": ["typescript", "decorators-legacy"],
+  "importOrder": [
+    "^~/(.*)$",
+    "^[.]",
+    "",
+    "(flowbite-angular|shiki)",
+    "",
+    "<THIRD_PARTY_MODULES>",
+    "",
+    "<BUILTIN_MODULES>"
+  ]
 }

.husky/commit-msg

@@ -0,0 +1,7 @@
+{
+  "extends": "stylelint-config-standard",
+  "rules": {
+    "no-empty-source": null,
+    "at-rule-no-unknown": null
+  }
+}

.husky/pre-commit

@@ -0,0 +1,26 @@
+{
+  "editor.codeActionsOnSave": {
+    "source.fixAll.eslint": "explicit"
+  },
+  "editor.defaultFormatter": "esbenp.prettier-vscode",
+  "files.eol": "\r\n",
+  "editor.formatOnSave": true,
+  "tailwindCSS.classAttributes": ["class", "className", "ngClass", "customStyle"],
+  "tailwindCSS.experimental.classRegex": [
+    ["twMerge\\(([^)]*)\\)", "[\"'`]([^\"'`]*).*?[\"'`]"],
+    ["createTheme\\(([^)]*)\\)", "[\"'`]([^\"'`]*).*?[\"'`]"]
+  ],
+  "typescript.tsdk": "node_modules/typescript/lib",
+
+  "[markdown]": {
+    "editor.unicodeHighlight.ambiguousCharacters": false,
+    "editor.unicodeHighlight.invisibleCharacters": false,
+    "diffEditor.ignoreTrimWhitespace": false,
+    "editor.wordWrap": "on",
+    "editor.quickSuggestions": {
+      "comments": "off",
+      "strings": "off",
+      "other": "off"
+    }
+  }
+}

.prettierignore

@@ -0,0 +1,3 @@
+import { app } from '../dist/docs-static/server/server.mjs';
+
+export default app();

.prettierrc

@@ -1,9 +1,12 @@
 {
   "extends": ["plugin:cypress/recommended", "../../.eslintrc.json"],
   "ignorePatterns": ["!**/*"],
+  "parserOptions": {
+    "project": "./apps/docs-e2e/tsconfig(.*)?.json"
+  },
   "overrides": [
     {
-      "files": ["*.ts", "*.tsx", "*.js", "*.jsx"],
+      "files": ["*.ts", "*.js", "*.jsx"],
       "rules": {}
     },
     {

.stylelintrc.json

@@ -3,6 +3,8 @@
   "$schema": "../../node_modules/nx/schemas/project-schema.json",
   "sourceRoot": "apps/docs-e2e/src",
   "projectType": "application",
+  "tags": [],
+  "implicitDependencies": ["docs"],
   "targets": {
     "e2e": {
       "executor": "@nx/cypress:cypress",
@@ -17,10 +19,7 @@
       }
     },
     "lint": {
-      "executor": "@nx/eslint:lint",
-      "outputs": ["{options.outputFile}"]
+      "executor": "@nx/eslint:lint"
     }
-  },
-  "tags": [],
-  "implicitDependencies": ["docs"]
+  }
 }

.vscode/settings.json

@@ -8,7 +8,6 @@
 // https://on.cypress.io/custom-commands
 // ***********************************************
 
-// eslint-disable-next-line @typescript-eslint/no-namespace
 declare namespace Cypress {
   // eslint-disable-next-line @typescript-eslint/no-unused-vars
   interface Chainable<Subject> {

api/index.js

@@ -1,13 +1,12 @@
 {
   "extends": ["../../.eslintrc.json"],
   "ignorePatterns": ["!**/*"],
+  "parserOptions": {
+    "project": "./apps/docs/tsconfig(.*)?.json"
+  },
   "overrides": [
     {
       "files": ["*.ts"],
-      "extends": [
-        "plugin:@nx/angular",
-        "plugin:@angular-eslint/template/process-inline-templates"
-      ],
       "rules": {
         "@angular-eslint/directive-selector": [
           "error",
@@ -26,11 +25,6 @@
           }
         ]
       }
-    },
-    {
-      "files": ["*.html"],
-      "extends": ["plugin:@nx/angular-template"],
-      "rules": {}
     }
   ]
 }