From 10bb1e6381e6a7545015ce9c450598bbc36143f5 Mon Sep 17 00:00:00 2001 From: luka onik Date: Mon, 3 Mar 2025 16:34:39 +0400 Subject: [PATCH 01/11] chore: remove unused --- projects/docs/src/app/app.component.ts | 2 +- projects/docs/src/app/app.routes.ts | 289 +----------------- .../api-description.component.css | 0 .../api-description.component.html | 3 - .../api-description.component.ts | 9 - .../blueprint/api-info/api-info.component.css | 0 .../api-info/api-info.component.html | 39 --- .../blueprint/api-info/api-info.component.ts | 25 -- .../api-inputs/api-inputs.component.css | 56 ---- .../api-inputs/api-inputs.component.html | 191 ------------ .../api-inputs/api-inputs.component.ts | 84 ----- .../blueprint-page.component.css | 5 - .../blueprint-page.component.html | 17 -- .../blueprint-page.component.ts | 41 --- .../command-installation.component.css | 0 .../command-installation.component.html | 6 - .../command-installation.component.ts | 13 - .../prerequisites/prerequisites.component.css | 0 .../prerequisites.component.html | 50 --- .../prerequisites/prerequisites.component.ts | 25 -- .../source-tree/source-tree-builder.ts | 115 ------- .../source-tree-select.component.css | 17 -- .../source-tree-select.component.html | 30 -- .../source-tree-select.component.ts | 73 ----- .../source-tree/source-tree.component.css | 5 - .../source-tree/source-tree.component.html | 22 -- .../source-tree/source-tree.component.ts | 71 ----- .../source-tree/source-tree.resolver.ts | 38 --- .../header/header.component.css | 0 .../header/header.component.html | 2 +- .../header/header.component.ts | 0 .../show-case/show-case.component.css | 0 .../show-case/show-case.component.html | 0 .../show-case/show-case.component.ts | 2 +- .../source-code/source-code.component.css | 0 .../source-code/source-code.component.html | 0 .../source-code/source-code.component.ts | 3 +- .../app/core/sidebar/sidebar.component.css | 33 ++ .../app/core/sidebar/sidebar.component.html | 19 ++ .../src/app/core/sidebar/sidebar.component.ts | 27 ++ .../show-case-accordion.component.css | 8 - .../show-case-accordion.component.html | 9 - .../show-case-accordion.component.ts | 37 --- .../show-case-alert.component.css | 5 - .../show-case-alert.component.html | 31 -- .../show-case-alert.component.ts | 12 - .../show-case-autocomplete.component.css | 0 .../show-case-autocomplete.component.html | 5 - .../show-case-autocomplete.component.ts | 22 -- .../show-case-badge.component.css | 7 - .../show-case-badge.component.html | 8 - .../show-case-badge.component.ts | 21 -- .../show-case-button.component.css | 17 -- .../show-case-button.component.html | 32 -- .../show-case-button.component.ts | 11 - .../show-case-card.component.css | 28 -- .../show-case-card.component.html | 41 --- .../show-case-card.component.ts | 16 - .../show-case-checkbox.component.css | 0 .../show-case-checkbox.component.html | 1 - .../show-case-checkbox.component.ts | 13 - .../show-case-context-menu.component.css | 0 .../show-case-context-menu.component.html | 10 - .../show-case-context-menu.component.ts | 44 --- .../show-case-dark-mode.component.css | 7 - .../show-case-dark-mode.component.html | 8 - .../show-case-dark-mode.component.ts | 16 - .../dialog-test/dialog-test.component.css | 4 - .../dialog-test/dialog-test.component.html | 17 -- .../dialog-test/dialog-test.component.ts | 21 -- .../show-case-dialog.component.css | 5 - .../show-case-dialog.component.html | 25 -- .../show-case-dialog.component.ts | 42 --- .../show-case-divider.component.css | 21 -- .../show-case-divider.component.html | 61 ---- .../show-case-divider.component.ts | 10 - .../show-case-drawer.component.css | 0 .../show-case-drawer.component.html | 1 - .../show-case-drawer.component.ts | 65 ---- .../show-case-form-field.component.css | 4 - .../show-case-form-field.component.html | 34 --- .../show-case-form-field.component.ts | 72 ----- .../show-case-icon.component.css | 34 --- .../show-case-icon.component.html | 23 -- .../show-case-icon.component.ts | 23 -- .../show-case-input.component.css | 17 -- .../show-case-input.component.html | 23 -- .../show-case-input.component.ts | 16 - .../show-case-loader.component.css | 21 -- .../show-case-loader.component.html | 19 -- .../show-case-loader.component.ts | 31 -- .../show-case-local-storage.component.css | 6 - .../show-case-local-storage.component.html | 20 -- .../show-case-local-storage.component.ts | 37 --- .../show-case-otp-input.component.css | 7 - .../show-case-otp-input.component.html | 6 - .../show-case-otp-input.component.ts | 32 -- .../show-case-pagination.component.css | 0 .../show-case-pagination.component.html | 5 - .../show-case-pagination.component.ts | 18 -- .../show-case-popover.component.css | 11 - .../show-case-popover.component.html | 36 --- .../show-case-popover.component.ts | 22 -- .../show-case-progress-bar.component.css | 5 - .../show-case-progress-bar.component.html | 10 - .../show-case-progress-bar.component.ts | 22 -- .../show-case-radio-button.component.css | 0 .../show-case-radio-button.component.html | 5 - .../show-case-radio-button.component.ts | 37 --- .../show-case-select.component.css | 0 .../show-case-select.component.html | 38 --- .../show-case-select.component.ts | 76 ----- .../show-case-session-storage.component.css | 6 - .../show-case-session-storage.component.html | 20 -- .../show-case-session-storage.component.ts | 37 --- .../show-case-skeleton.component.css | 5 - .../show-case-skeleton.component.html | 3 - .../show-case-skeleton.component.ts | 10 - .../show-case-switch.component.css | 0 .../show-case-switch.component.html | 1 - .../show-case-switch.component.ts | 18 -- .../tab/lazy-tab/lazy-tab.component.css | 0 .../tab/lazy-tab/lazy-tab.component.html | 1 - .../tab/lazy-tab/lazy-tab.component.ts | 11 - .../show-case-tab/show-case-tab.component.css | 5 - .../show-case-tab.component.html | 17 -- .../show-case-tab/show-case-tab.component.ts | 23 -- .../show-case-textarea.component.css | 9 - .../show-case-textarea.component.html | 17 -- .../show-case-textarea.component.ts | 15 - .../show-case-toast.component.css | 9 - .../show-case-toast.component.html | 25 -- .../show-case-toast.component.ts | 55 ---- .../show-case-tooltip.component.css | 12 - .../show-case-tooltip.component.html | 34 --- .../show-case-tooltip.component.ts | 12 - .../a11y-accordion-page.component.ts | 2 +- .../a11y-checkbox-page.component.ts | 2 +- .../a11y-tab-page/a11y-tab-page.component.ts | 2 +- .../accordion-page.component.css | 0 .../accordion-page.component.html | 16 - .../accordion-page.component.ts | 113 ------- .../pages/alert-page/alert-page.component.css | 0 .../alert-page/alert-page.component.html | 12 - .../pages/alert-page/alert-page.component.ts | 81 ----- .../autocomplete-page.component.css | 0 .../autocomplete-page.component.html | 11 - .../autocomplete-page.component.ts | 32 -- .../pages/badge-page/badge-page.component.css | 0 .../badge-page/badge-page.component.html | 12 - .../pages/badge-page/badge-page.component.ts | 73 ----- .../button-page/button-page.component.css | 0 .../button-page/button-page.component.html | 14 - .../button-page/button-page.component.ts | 96 ------ .../pages/card-page/card-page.component.css | 0 .../pages/card-page/card-page.component.html | 12 - .../pages/card-page/card-page.component.ts | 79 ----- .../checkbox-page/checkbox-page.component.css | 0 .../checkbox-page.component.html | 14 - .../checkbox-page/checkbox-page.component.ts | 85 ------ .../context-menu-page.component.css | 0 .../context-menu-page.component.html | 23 -- .../context-menu-page.component.ts | 71 ----- .../dark-mode-page.component.css | 0 .../dark-mode-page.component.html | 18 -- .../dark-mode-page.component.ts | 105 ------- .../dialog-page/dialog-page.component.css | 0 .../dialog-page/dialog-page.component.html | 19 -- .../dialog-page/dialog-page.component.ts | 250 --------------- .../divider-page/divider-page.component.css | 0 .../divider-page/divider-page.component.html | 12 - .../divider-page/divider-page.component.ts | 60 ---- .../doc-container-page.component.css | 5 - .../doc-container-page.component.html | 9 - .../doc-container-page.component.ts | 167 ---------- .../doc-sibling-navigations.component.css | 16 - .../doc-sibling-navigations.component.html | 34 --- .../doc-sibling-navigations.component.ts | 44 --- .../drawer-page/drawer-page.component.css | 0 .../drawer-page/drawer-page.component.html | 12 - .../drawer-page/drawer-page.component.ts | 150 --------- .../form-field-page.component.css | 0 .../form-field-page.component.html | 15 - .../form-field-page.component.ts | 141 --------- .../pages/home-page/home-page.component.css | 8 - .../pages/home-page/home-page.component.html | 49 --- .../pages/home-page/home-page.component.ts | 56 ---- .../pages/icon-page/icon-page.component.css | 0 .../pages/icon-page/icon-page.component.html | 18 -- .../pages/icon-page/icon-page.component.ts | 117 ------- .../pages/input-page/input-page.component.css | 0 .../input-page/input-page.component.html | 12 - .../pages/input-page/input-page.component.ts | 53 ---- .../installation-page.component.css | 0 .../installation-page.component.html | 47 --- .../installation-page.component.ts | 21 -- .../introduction-page.component.css | 0 .../introduction-page.component.html | 171 ----------- .../introduction-page.component.ts | 11 - .../loader-page/loader-page.component.css | 0 .../loader-page/loader-page.component.html | 13 - .../loader-page/loader-page.component.ts | 76 ----- .../local-storage-page.component.css | 0 .../local-storage-page.component.html | 26 -- .../local-storage-page.component.ts | 129 -------- .../otp-input-page.component.css | 0 .../otp-input-page.component.html | 20 -- .../otp-input-page.component.ts | 110 ------- .../outside-click-page.component.css | 0 .../outside-click-page.component.html | 9 - .../outside-click-page.component.ts | 22 -- .../pagination-page.component.css | 0 .../pagination-page.component.html | 20 -- .../pagination-page.component.ts | 87 ------ .../popover-page/popover-page.component.css | 0 .../popover-page/popover-page.component.html | 10 - .../popover-page/popover-page.component.ts | 144 --------- .../progress-bar-page.component.css | 0 .../progress-bar-page.component.html | 15 - .../progress-bar-page.component.ts | 58 ---- .../radio-button-page.component.css | 0 .../radio-button-page.component.html | 13 - .../radio-button-page.component.ts | 104 ------- .../schematics-usage-page.component.css | 0 .../schematics-usage-page.component.html | 267 ---------------- .../schematics-usage-page.component.ts | 20 -- .../select-page/select-page.component.css | 0 .../select-page/select-page.component.html | 18 -- .../select-page/select-page.component.ts | 140 --------- .../session-storage-page.component.css | 0 .../session-storage-page.component.html | 12 - .../session-storage-page.component.ts | 106 ------- .../skeleton-page/skeleton-page.component.css | 0 .../skeleton-page.component.html | 12 - .../skeleton-page/skeleton-page.component.ts | 51 ---- .../switch-page/switch-page.component.css | 0 .../switch-page/switch-page.component.html | 14 - .../switch-page/switch-page.component.ts | 71 ----- .../app/pages/tab-page/tab-page.component.css | 0 .../pages/tab-page/tab-page.component.html | 10 - .../app/pages/tab-page/tab-page.component.ts | 69 ----- .../textarea-page/textarea-page.component.css | 0 .../textarea-page.component.html | 12 - .../textarea-page/textarea-page.component.ts | 60 ---- .../theming-page/theming-page.component.css | 0 .../theming-page/theming-page.component.html | 88 ------ .../theming-page/theming-page.component.ts | 21 -- .../pages/toast-page/toast-page.component.css | 0 .../toast-page/toast-page.component.html | 13 - .../pages/toast-page/toast-page.component.ts | 117 ------- .../tooltip-page/tooltip-page.component.css | 0 .../tooltip-page/tooltip-page.component.html | 14 - .../tooltip-page/tooltip-page.component.ts | 89 ------ .../pages/usage-page/usage-page.component.css | 0 .../usage-page/usage-page.component.html | 46 --- .../pages/usage-page/usage-page.component.ts | 11 - .../docs/src/app/services/file.service.ts | 101 +----- 257 files changed, 88 insertions(+), 7548 deletions(-) delete mode 100644 projects/docs/src/app/blueprint/api-info/api-description/api-description.component.css delete mode 100644 projects/docs/src/app/blueprint/api-info/api-description/api-description.component.html delete mode 100644 projects/docs/src/app/blueprint/api-info/api-description/api-description.component.ts delete mode 100644 projects/docs/src/app/blueprint/api-info/api-info.component.css delete mode 100644 projects/docs/src/app/blueprint/api-info/api-info.component.html delete mode 100644 projects/docs/src/app/blueprint/api-info/api-info.component.ts delete mode 100644 projects/docs/src/app/blueprint/api-info/api-inputs/api-inputs.component.css delete mode 100644 projects/docs/src/app/blueprint/api-info/api-inputs/api-inputs.component.html delete mode 100644 projects/docs/src/app/blueprint/api-info/api-inputs/api-inputs.component.ts delete mode 100644 projects/docs/src/app/blueprint/blueprint-page/blueprint-page.component.css delete mode 100644 projects/docs/src/app/blueprint/blueprint-page/blueprint-page.component.html delete mode 100644 projects/docs/src/app/blueprint/blueprint-page/blueprint-page.component.ts delete mode 100644 projects/docs/src/app/blueprint/command-installation/command-installation.component.css delete mode 100644 projects/docs/src/app/blueprint/command-installation/command-installation.component.html delete mode 100644 projects/docs/src/app/blueprint/command-installation/command-installation.component.ts delete mode 100644 projects/docs/src/app/blueprint/prerequisites/prerequisites.component.css delete mode 100644 projects/docs/src/app/blueprint/prerequisites/prerequisites.component.html delete mode 100644 projects/docs/src/app/blueprint/prerequisites/prerequisites.component.ts delete mode 100644 projects/docs/src/app/blueprint/source-tree/source-tree-builder.ts delete mode 100644 projects/docs/src/app/blueprint/source-tree/source-tree-select/source-tree-select.component.css delete mode 100644 projects/docs/src/app/blueprint/source-tree/source-tree-select/source-tree-select.component.html delete mode 100644 projects/docs/src/app/blueprint/source-tree/source-tree-select/source-tree-select.component.ts delete mode 100644 projects/docs/src/app/blueprint/source-tree/source-tree.component.css delete mode 100644 projects/docs/src/app/blueprint/source-tree/source-tree.component.html delete mode 100644 projects/docs/src/app/blueprint/source-tree/source-tree.component.ts delete mode 100644 projects/docs/src/app/blueprint/source-tree/source-tree.resolver.ts rename projects/docs/src/app/{pages => core}/header/header.component.css (100%) rename projects/docs/src/app/{pages => core}/header/header.component.html (95%) rename projects/docs/src/app/{pages => core}/header/header.component.ts (100%) rename projects/docs/src/app/{blueprint => core/kit-page}/show-case/show-case.component.css (100%) rename projects/docs/src/app/{blueprint => core/kit-page}/show-case/show-case.component.html (100%) rename projects/docs/src/app/{blueprint => core/kit-page}/show-case/show-case.component.ts (95%) rename projects/docs/src/app/{blueprint => core/kit-page}/source-code/source-code.component.css (100%) rename projects/docs/src/app/{blueprint => core/kit-page}/source-code/source-code.component.html (100%) rename projects/docs/src/app/{blueprint => core/kit-page}/source-code/source-code.component.ts (93%) create mode 100644 projects/docs/src/app/core/sidebar/sidebar.component.css create mode 100644 projects/docs/src/app/core/sidebar/sidebar.component.html create mode 100644 projects/docs/src/app/core/sidebar/sidebar.component.ts delete mode 100644 projects/docs/src/app/examples/accordion/show-case-accordion/show-case-accordion.component.css delete mode 100644 projects/docs/src/app/examples/accordion/show-case-accordion/show-case-accordion.component.html delete mode 100644 projects/docs/src/app/examples/accordion/show-case-accordion/show-case-accordion.component.ts delete mode 100644 projects/docs/src/app/examples/alert/show-case-alert/show-case-alert.component.css delete mode 100644 projects/docs/src/app/examples/alert/show-case-alert/show-case-alert.component.html delete mode 100644 projects/docs/src/app/examples/alert/show-case-alert/show-case-alert.component.ts delete mode 100644 projects/docs/src/app/examples/autocomplete/show-case-autocomplete/show-case-autocomplete.component.css delete mode 100644 projects/docs/src/app/examples/autocomplete/show-case-autocomplete/show-case-autocomplete.component.html delete mode 100644 projects/docs/src/app/examples/autocomplete/show-case-autocomplete/show-case-autocomplete.component.ts delete mode 100644 projects/docs/src/app/examples/badge/show-case-badge/show-case-badge.component.css delete mode 100644 projects/docs/src/app/examples/badge/show-case-badge/show-case-badge.component.html delete mode 100644 projects/docs/src/app/examples/badge/show-case-badge/show-case-badge.component.ts delete mode 100644 projects/docs/src/app/examples/button/show-case-button/show-case-button.component.css delete mode 100644 projects/docs/src/app/examples/button/show-case-button/show-case-button.component.html delete mode 100644 projects/docs/src/app/examples/button/show-case-button/show-case-button.component.ts delete mode 100644 projects/docs/src/app/examples/card/show-case-card/show-case-card.component.css delete mode 100644 projects/docs/src/app/examples/card/show-case-card/show-case-card.component.html delete mode 100644 projects/docs/src/app/examples/card/show-case-card/show-case-card.component.ts delete mode 100644 projects/docs/src/app/examples/checkbox/show-case-checkbox/show-case-checkbox.component.css delete mode 100644 projects/docs/src/app/examples/checkbox/show-case-checkbox/show-case-checkbox.component.html delete mode 100644 projects/docs/src/app/examples/checkbox/show-case-checkbox/show-case-checkbox.component.ts delete mode 100644 projects/docs/src/app/examples/context-menu/show-case-context-menu/show-case-context-menu.component.css delete mode 100644 projects/docs/src/app/examples/context-menu/show-case-context-menu/show-case-context-menu.component.html delete mode 100644 projects/docs/src/app/examples/context-menu/show-case-context-menu/show-case-context-menu.component.ts delete mode 100644 projects/docs/src/app/examples/dark-mode/show-case-dark-mode/show-case-dark-mode.component.css delete mode 100644 projects/docs/src/app/examples/dark-mode/show-case-dark-mode/show-case-dark-mode.component.html delete mode 100644 projects/docs/src/app/examples/dark-mode/show-case-dark-mode/show-case-dark-mode.component.ts delete mode 100644 projects/docs/src/app/examples/dialog/dialog-test/dialog-test.component.css delete mode 100644 projects/docs/src/app/examples/dialog/dialog-test/dialog-test.component.html delete mode 100644 projects/docs/src/app/examples/dialog/dialog-test/dialog-test.component.ts delete mode 100644 projects/docs/src/app/examples/dialog/show-case-dialog/show-case-dialog.component.css delete mode 100644 projects/docs/src/app/examples/dialog/show-case-dialog/show-case-dialog.component.html delete mode 100644 projects/docs/src/app/examples/dialog/show-case-dialog/show-case-dialog.component.ts delete mode 100644 projects/docs/src/app/examples/divider/show-case-divider/show-case-divider.component.css delete mode 100644 projects/docs/src/app/examples/divider/show-case-divider/show-case-divider.component.html delete mode 100644 projects/docs/src/app/examples/divider/show-case-divider/show-case-divider.component.ts delete mode 100644 projects/docs/src/app/examples/drawer/show-case-drawer/show-case-drawer.component.css delete mode 100644 projects/docs/src/app/examples/drawer/show-case-drawer/show-case-drawer.component.html delete mode 100644 projects/docs/src/app/examples/drawer/show-case-drawer/show-case-drawer.component.ts delete mode 100644 projects/docs/src/app/examples/form-field/show-case-form-field/show-case-form-field.component.css delete mode 100644 projects/docs/src/app/examples/form-field/show-case-form-field/show-case-form-field.component.html delete mode 100644 projects/docs/src/app/examples/form-field/show-case-form-field/show-case-form-field.component.ts delete mode 100644 projects/docs/src/app/examples/icon/show-case-icon/show-case-icon.component.css delete mode 100644 projects/docs/src/app/examples/icon/show-case-icon/show-case-icon.component.html delete mode 100644 projects/docs/src/app/examples/icon/show-case-icon/show-case-icon.component.ts delete mode 100644 projects/docs/src/app/examples/input/show-case-input/show-case-input.component.css delete mode 100644 projects/docs/src/app/examples/input/show-case-input/show-case-input.component.html delete mode 100644 projects/docs/src/app/examples/input/show-case-input/show-case-input.component.ts delete mode 100644 projects/docs/src/app/examples/loader/show-case-loader/show-case-loader.component.css delete mode 100644 projects/docs/src/app/examples/loader/show-case-loader/show-case-loader.component.html delete mode 100644 projects/docs/src/app/examples/loader/show-case-loader/show-case-loader.component.ts delete mode 100644 projects/docs/src/app/examples/local-storage/show-case-local-storage/show-case-local-storage.component.css delete mode 100644 projects/docs/src/app/examples/local-storage/show-case-local-storage/show-case-local-storage.component.html delete mode 100644 projects/docs/src/app/examples/local-storage/show-case-local-storage/show-case-local-storage.component.ts delete mode 100644 projects/docs/src/app/examples/otp-input/show-case-otp-input/show-case-otp-input.component.css delete mode 100644 projects/docs/src/app/examples/otp-input/show-case-otp-input/show-case-otp-input.component.html delete mode 100644 projects/docs/src/app/examples/otp-input/show-case-otp-input/show-case-otp-input.component.ts delete mode 100644 projects/docs/src/app/examples/pagination/show-case-pagination/show-case-pagination.component.css delete mode 100644 projects/docs/src/app/examples/pagination/show-case-pagination/show-case-pagination.component.html delete mode 100644 projects/docs/src/app/examples/pagination/show-case-pagination/show-case-pagination.component.ts delete mode 100644 projects/docs/src/app/examples/popover/show-case-popover/show-case-popover.component.css delete mode 100644 projects/docs/src/app/examples/popover/show-case-popover/show-case-popover.component.html delete mode 100644 projects/docs/src/app/examples/popover/show-case-popover/show-case-popover.component.ts delete mode 100644 projects/docs/src/app/examples/progress-bar/show-case-progress-bar/show-case-progress-bar.component.css delete mode 100644 projects/docs/src/app/examples/progress-bar/show-case-progress-bar/show-case-progress-bar.component.html delete mode 100644 projects/docs/src/app/examples/progress-bar/show-case-progress-bar/show-case-progress-bar.component.ts delete mode 100644 projects/docs/src/app/examples/radio-button/show-case-radio-button/show-case-radio-button.component.css delete mode 100644 projects/docs/src/app/examples/radio-button/show-case-radio-button/show-case-radio-button.component.html delete mode 100644 projects/docs/src/app/examples/radio-button/show-case-radio-button/show-case-radio-button.component.ts delete mode 100644 projects/docs/src/app/examples/select/show-case-select/show-case-select.component.css delete mode 100644 projects/docs/src/app/examples/select/show-case-select/show-case-select.component.html delete mode 100644 projects/docs/src/app/examples/select/show-case-select/show-case-select.component.ts delete mode 100644 projects/docs/src/app/examples/session-storage/show-case-session-storage/show-case-session-storage.component.css delete mode 100644 projects/docs/src/app/examples/session-storage/show-case-session-storage/show-case-session-storage.component.html delete mode 100644 projects/docs/src/app/examples/session-storage/show-case-session-storage/show-case-session-storage.component.ts delete mode 100644 projects/docs/src/app/examples/skeleton/show-case-skeleton/show-case-skeleton.component.css delete mode 100644 projects/docs/src/app/examples/skeleton/show-case-skeleton/show-case-skeleton.component.html delete mode 100644 projects/docs/src/app/examples/skeleton/show-case-skeleton/show-case-skeleton.component.ts delete mode 100644 projects/docs/src/app/examples/switch/show-case-switch/show-case-switch.component.css delete mode 100644 projects/docs/src/app/examples/switch/show-case-switch/show-case-switch.component.html delete mode 100644 projects/docs/src/app/examples/switch/show-case-switch/show-case-switch.component.ts delete mode 100644 projects/docs/src/app/examples/tab/lazy-tab/lazy-tab.component.css delete mode 100644 projects/docs/src/app/examples/tab/lazy-tab/lazy-tab.component.html delete mode 100644 projects/docs/src/app/examples/tab/lazy-tab/lazy-tab.component.ts delete mode 100644 projects/docs/src/app/examples/tab/show-case-tab/show-case-tab.component.css delete mode 100644 projects/docs/src/app/examples/tab/show-case-tab/show-case-tab.component.html delete mode 100644 projects/docs/src/app/examples/tab/show-case-tab/show-case-tab.component.ts delete mode 100644 projects/docs/src/app/examples/textarea/show-case-textarea/show-case-textarea.component.css delete mode 100644 projects/docs/src/app/examples/textarea/show-case-textarea/show-case-textarea.component.html delete mode 100644 projects/docs/src/app/examples/textarea/show-case-textarea/show-case-textarea.component.ts delete mode 100644 projects/docs/src/app/examples/toast/show-case-toast/show-case-toast.component.css delete mode 100644 projects/docs/src/app/examples/toast/show-case-toast/show-case-toast.component.html delete mode 100644 projects/docs/src/app/examples/toast/show-case-toast/show-case-toast.component.ts delete mode 100644 projects/docs/src/app/examples/tooltip/show-case-tooltip/show-case-tooltip.component.css delete mode 100644 projects/docs/src/app/examples/tooltip/show-case-tooltip/show-case-tooltip.component.html delete mode 100644 projects/docs/src/app/examples/tooltip/show-case-tooltip/show-case-tooltip.component.ts delete mode 100644 projects/docs/src/app/pages/accordion-page/accordion-page.component.css delete mode 100644 projects/docs/src/app/pages/accordion-page/accordion-page.component.html delete mode 100644 projects/docs/src/app/pages/accordion-page/accordion-page.component.ts delete mode 100644 projects/docs/src/app/pages/alert-page/alert-page.component.css delete mode 100644 projects/docs/src/app/pages/alert-page/alert-page.component.html delete mode 100644 projects/docs/src/app/pages/alert-page/alert-page.component.ts delete mode 100644 projects/docs/src/app/pages/autocomplete-page/autocomplete-page.component.css delete mode 100644 projects/docs/src/app/pages/autocomplete-page/autocomplete-page.component.html delete mode 100644 projects/docs/src/app/pages/autocomplete-page/autocomplete-page.component.ts delete mode 100644 projects/docs/src/app/pages/badge-page/badge-page.component.css delete mode 100644 projects/docs/src/app/pages/badge-page/badge-page.component.html delete mode 100644 projects/docs/src/app/pages/badge-page/badge-page.component.ts delete mode 100644 projects/docs/src/app/pages/button-page/button-page.component.css delete mode 100644 projects/docs/src/app/pages/button-page/button-page.component.html delete mode 100644 projects/docs/src/app/pages/button-page/button-page.component.ts delete mode 100644 projects/docs/src/app/pages/card-page/card-page.component.css delete mode 100644 projects/docs/src/app/pages/card-page/card-page.component.html delete mode 100644 projects/docs/src/app/pages/card-page/card-page.component.ts delete mode 100644 projects/docs/src/app/pages/checkbox-page/checkbox-page.component.css delete mode 100644 projects/docs/src/app/pages/checkbox-page/checkbox-page.component.html delete mode 100644 projects/docs/src/app/pages/checkbox-page/checkbox-page.component.ts delete mode 100644 projects/docs/src/app/pages/context-menu-page/context-menu-page.component.css delete mode 100644 projects/docs/src/app/pages/context-menu-page/context-menu-page.component.html delete mode 100644 projects/docs/src/app/pages/context-menu-page/context-menu-page.component.ts delete mode 100644 projects/docs/src/app/pages/dark-mode-page/dark-mode-page.component.css delete mode 100644 projects/docs/src/app/pages/dark-mode-page/dark-mode-page.component.html delete mode 100644 projects/docs/src/app/pages/dark-mode-page/dark-mode-page.component.ts delete mode 100644 projects/docs/src/app/pages/dialog-page/dialog-page.component.css delete mode 100644 projects/docs/src/app/pages/dialog-page/dialog-page.component.html delete mode 100644 projects/docs/src/app/pages/dialog-page/dialog-page.component.ts delete mode 100644 projects/docs/src/app/pages/divider-page/divider-page.component.css delete mode 100644 projects/docs/src/app/pages/divider-page/divider-page.component.html delete mode 100644 projects/docs/src/app/pages/divider-page/divider-page.component.ts delete mode 100644 projects/docs/src/app/pages/doc-container-page/doc-container-page.component.css delete mode 100644 projects/docs/src/app/pages/doc-container-page/doc-container-page.component.html delete mode 100644 projects/docs/src/app/pages/doc-container-page/doc-container-page.component.ts delete mode 100644 projects/docs/src/app/pages/doc-sibling-navigations/doc-sibling-navigations.component.css delete mode 100644 projects/docs/src/app/pages/doc-sibling-navigations/doc-sibling-navigations.component.html delete mode 100644 projects/docs/src/app/pages/doc-sibling-navigations/doc-sibling-navigations.component.ts delete mode 100644 projects/docs/src/app/pages/drawer-page/drawer-page.component.css delete mode 100644 projects/docs/src/app/pages/drawer-page/drawer-page.component.html delete mode 100644 projects/docs/src/app/pages/drawer-page/drawer-page.component.ts delete mode 100644 projects/docs/src/app/pages/form-field-page/form-field-page.component.css delete mode 100644 projects/docs/src/app/pages/form-field-page/form-field-page.component.html delete mode 100644 projects/docs/src/app/pages/form-field-page/form-field-page.component.ts delete mode 100644 projects/docs/src/app/pages/home-page/home-page.component.css delete mode 100644 projects/docs/src/app/pages/home-page/home-page.component.html delete mode 100644 projects/docs/src/app/pages/home-page/home-page.component.ts delete mode 100644 projects/docs/src/app/pages/icon-page/icon-page.component.css delete mode 100644 projects/docs/src/app/pages/icon-page/icon-page.component.html delete mode 100644 projects/docs/src/app/pages/icon-page/icon-page.component.ts delete mode 100644 projects/docs/src/app/pages/input-page/input-page.component.css delete mode 100644 projects/docs/src/app/pages/input-page/input-page.component.html delete mode 100644 projects/docs/src/app/pages/input-page/input-page.component.ts delete mode 100644 projects/docs/src/app/pages/installation-page/installation-page.component.css delete mode 100644 projects/docs/src/app/pages/installation-page/installation-page.component.html delete mode 100644 projects/docs/src/app/pages/installation-page/installation-page.component.ts delete mode 100644 projects/docs/src/app/pages/introduction-page/introduction-page.component.css delete mode 100644 projects/docs/src/app/pages/introduction-page/introduction-page.component.html delete mode 100644 projects/docs/src/app/pages/introduction-page/introduction-page.component.ts delete mode 100644 projects/docs/src/app/pages/loader-page/loader-page.component.css delete mode 100644 projects/docs/src/app/pages/loader-page/loader-page.component.html delete mode 100644 projects/docs/src/app/pages/loader-page/loader-page.component.ts delete mode 100644 projects/docs/src/app/pages/local-storage-page/local-storage-page.component.css delete mode 100644 projects/docs/src/app/pages/local-storage-page/local-storage-page.component.html delete mode 100644 projects/docs/src/app/pages/local-storage-page/local-storage-page.component.ts delete mode 100644 projects/docs/src/app/pages/otp-input-page/otp-input-page.component.css delete mode 100644 projects/docs/src/app/pages/otp-input-page/otp-input-page.component.html delete mode 100644 projects/docs/src/app/pages/otp-input-page/otp-input-page.component.ts delete mode 100644 projects/docs/src/app/pages/outside-click-page/outside-click-page.component.css delete mode 100644 projects/docs/src/app/pages/outside-click-page/outside-click-page.component.html delete mode 100644 projects/docs/src/app/pages/outside-click-page/outside-click-page.component.ts delete mode 100644 projects/docs/src/app/pages/pagination-page/pagination-page.component.css delete mode 100644 projects/docs/src/app/pages/pagination-page/pagination-page.component.html delete mode 100644 projects/docs/src/app/pages/pagination-page/pagination-page.component.ts delete mode 100644 projects/docs/src/app/pages/popover-page/popover-page.component.css delete mode 100644 projects/docs/src/app/pages/popover-page/popover-page.component.html delete mode 100644 projects/docs/src/app/pages/popover-page/popover-page.component.ts delete mode 100644 projects/docs/src/app/pages/progress-bar-page/progress-bar-page.component.css delete mode 100644 projects/docs/src/app/pages/progress-bar-page/progress-bar-page.component.html delete mode 100644 projects/docs/src/app/pages/progress-bar-page/progress-bar-page.component.ts delete mode 100644 projects/docs/src/app/pages/radio-button-page/radio-button-page.component.css delete mode 100644 projects/docs/src/app/pages/radio-button-page/radio-button-page.component.html delete mode 100644 projects/docs/src/app/pages/radio-button-page/radio-button-page.component.ts delete mode 100644 projects/docs/src/app/pages/schematics-usage-page/schematics-usage-page.component.css delete mode 100644 projects/docs/src/app/pages/schematics-usage-page/schematics-usage-page.component.html delete mode 100644 projects/docs/src/app/pages/schematics-usage-page/schematics-usage-page.component.ts delete mode 100644 projects/docs/src/app/pages/select-page/select-page.component.css delete mode 100644 projects/docs/src/app/pages/select-page/select-page.component.html delete mode 100644 projects/docs/src/app/pages/select-page/select-page.component.ts delete mode 100644 projects/docs/src/app/pages/session-storage-page/session-storage-page.component.css delete mode 100644 projects/docs/src/app/pages/session-storage-page/session-storage-page.component.html delete mode 100644 projects/docs/src/app/pages/session-storage-page/session-storage-page.component.ts delete mode 100644 projects/docs/src/app/pages/skeleton-page/skeleton-page.component.css delete mode 100644 projects/docs/src/app/pages/skeleton-page/skeleton-page.component.html delete mode 100644 projects/docs/src/app/pages/skeleton-page/skeleton-page.component.ts delete mode 100644 projects/docs/src/app/pages/switch-page/switch-page.component.css delete mode 100644 projects/docs/src/app/pages/switch-page/switch-page.component.html delete mode 100644 projects/docs/src/app/pages/switch-page/switch-page.component.ts delete mode 100644 projects/docs/src/app/pages/tab-page/tab-page.component.css delete mode 100644 projects/docs/src/app/pages/tab-page/tab-page.component.html delete mode 100644 projects/docs/src/app/pages/tab-page/tab-page.component.ts delete mode 100644 projects/docs/src/app/pages/textarea-page/textarea-page.component.css delete mode 100644 projects/docs/src/app/pages/textarea-page/textarea-page.component.html delete mode 100644 projects/docs/src/app/pages/textarea-page/textarea-page.component.ts delete mode 100644 projects/docs/src/app/pages/theming-page/theming-page.component.css delete mode 100644 projects/docs/src/app/pages/theming-page/theming-page.component.html delete mode 100644 projects/docs/src/app/pages/theming-page/theming-page.component.ts delete mode 100644 projects/docs/src/app/pages/toast-page/toast-page.component.css delete mode 100644 projects/docs/src/app/pages/toast-page/toast-page.component.html delete mode 100644 projects/docs/src/app/pages/toast-page/toast-page.component.ts delete mode 100644 projects/docs/src/app/pages/tooltip-page/tooltip-page.component.css delete mode 100644 projects/docs/src/app/pages/tooltip-page/tooltip-page.component.html delete mode 100644 projects/docs/src/app/pages/tooltip-page/tooltip-page.component.ts delete mode 100644 projects/docs/src/app/pages/usage-page/usage-page.component.css delete mode 100644 projects/docs/src/app/pages/usage-page/usage-page.component.html delete mode 100644 projects/docs/src/app/pages/usage-page/usage-page.component.ts diff --git a/projects/docs/src/app/app.component.ts b/projects/docs/src/app/app.component.ts index a85f53b..e173ea4 100644 --- a/projects/docs/src/app/app.component.ts +++ b/projects/docs/src/app/app.component.ts @@ -1,7 +1,7 @@ import { IconRegistry } from '@/ui/icon/icon.registry'; import { Component, inject } from '@angular/core'; import { RouterOutlet } from '@angular/router'; -import { HeaderComponent } from './pages/header/header.component'; +import { HeaderComponent } from './core/header/header.component'; @Component({ selector: 'doc-root', diff --git a/projects/docs/src/app/app.routes.ts b/projects/docs/src/app/app.routes.ts index 98ad589..7121b32 100644 --- a/projects/docs/src/app/app.routes.ts +++ b/projects/docs/src/app/app.routes.ts @@ -2,7 +2,7 @@ import { Routes } from '@angular/router'; export const routes: Routes = [ { - path: 'kit', + path: 'docs', loadComponent: () => import('./pages/kit-container-page/kit-container-page.component').then( (k) => k.KitContainerPageComponent @@ -36,20 +36,6 @@ export const routes: Routes = [ (d) => d.A11yAlertPageComponent ), }, - { - path: 'session-storage', - loadComponent: () => - import( - './pages/session-storage-page/session-storage-page.component' - ).then((d) => d.SessionStoragePageComponent), - }, - { - path: 'local-storage', - loadComponent: () => - import( - './pages/local-storage-page/local-storage-page.component' - ).then((d) => d.LocalStoragePageComponent), - }, { path: '', redirectTo: 'a11y-accordion', @@ -57,277 +43,4 @@ export const routes: Routes = [ }, ], }, - { - path: 'doc', - loadComponent: () => - import('./pages/doc-container-page/doc-container-page.component').then( - (d) => d.DocContainerPageComponent - ), - children: [ - { - path: 'introduction', - loadComponent: () => - import('./pages/introduction-page/introduction-page.component').then( - (i) => i.IntroductionPageComponent - ), - }, - { - path: 'installation', - loadComponent: () => - import('./pages/installation-page/installation-page.component').then( - (i) => i.InstallationPageComponent - ), - }, - { - path: 'schematics-usage', - loadComponent: () => - import( - './pages/schematics-usage-page/schematics-usage-page.component' - ).then((i) => i.SchematicsUsagePageComponent), - }, - { - path: 'usage', - loadComponent: () => - import('./pages/usage-page/usage-page.component').then( - (u) => u.UsagePageComponent - ), - }, - { - path: 'theming', - loadComponent: () => - import('./pages/theming-page/theming-page.component').then( - (t) => t.ThemingPageComponent - ), - }, - { - path: 'accordion', - loadComponent: () => - import('./pages/accordion-page/accordion-page.component').then( - (b) => b.AccordionPageComponent - ), - }, - { - path: 'autocomplete', - loadComponent: () => - import('./pages/autocomplete-page/autocomplete-page.component').then( - (b) => b.AutocompletePageComponent - ), - }, - { - path: 'alert', - loadComponent: () => - import('./pages/alert-page/alert-page.component').then( - (b) => b.AlertPageComponent - ), - }, - { - path: 'badge', - loadComponent: () => - import('./pages/badge-page/badge-page.component').then( - (b) => b.BadgePageComponent - ), - }, - { - path: 'card', - loadComponent: () => - import('./pages/card-page/card-page.component').then( - (b) => b.CardPageComponent - ), - }, - { - path: 'divider', - loadComponent: () => - import('./pages/divider-page/divider-page.component').then( - (b) => b.DividerPageComponent - ), - }, - { - path: 'drawer', - loadComponent: () => - import('./pages/drawer-page/drawer-page.component').then( - (b) => b.DrawerPageComponent - ), - }, - { - path: 'otp-input', - loadComponent: () => - import('./pages/otp-input-page/otp-input-page.component').then( - (b) => b.OtpInputPageComponent - ), - }, - { - path: 'progress-bar', - loadComponent: () => - import('./pages/progress-bar-page/progress-bar-page.component').then( - (b) => b.ProgressBarPageComponent - ), - }, - { - path: 'tooltip', - loadComponent: () => - import('./pages/tooltip-page/tooltip-page.component').then( - (b) => b.TooltipPageComponent - ), - }, - { - path: 'toast', - loadComponent: () => - import('./pages/toast-page/toast-page.component').then( - (b) => b.ToastPageComponent - ), - }, - { - path: 'button', - loadComponent: () => - import('./pages/button-page/button-page.component').then( - (b) => b.ButtonPageComponent - ), - }, - { - path: 'outside-click', - loadComponent: () => - import( - './pages/outside-click-page/outside-click-page.component' - ).then((b) => b.OutsideClickPageComponent), - }, - { - path: 'checkbox', - loadComponent: () => - import('./pages/checkbox-page/checkbox-page.component').then( - (c) => c.CheckboxPageComponent - ), - }, - { - path: 'radio-button', - loadComponent: () => - import('./pages/radio-button-page/radio-button-page.component').then( - (c) => c.RadioButtonPageComponent - ), - }, - { - path: 'select', - loadComponent: () => - import('./pages/select-page/select-page.component').then( - (c) => c.SelectPageComponent - ), - }, - { - path: 'dialog', - loadComponent: () => - import('./pages/dialog-page/dialog-page.component').then( - (d) => d.DialogPageComponent - ), - }, - { - path: 'skeleton', - loadComponent: () => - import('./pages/skeleton-page/skeleton-page.component').then( - (d) => d.SkeletonPageComponent - ), - }, - { - path: 'switch', - loadComponent: () => - import('./pages/switch-page/switch-page.component').then( - (d) => d.SwitchPageComponent - ), - }, - { - path: 'tab', - loadComponent: () => - import('./pages/tab-page/tab-page.component').then( - (d) => d.TabPageComponent - ), - }, - { - path: 'textarea', - loadComponent: () => - import('./pages/textarea-page/textarea-page.component').then( - (d) => d.TextareaPageComponent - ), - }, - { - path: 'input', - loadComponent: () => - import('./pages/input-page/input-page.component').then( - (d) => d.InputPageComponent - ), - }, - { - path: 'form-field', - loadComponent: () => - import('./pages/form-field-page/form-field-page.component').then( - (d) => d.FormFieldPageComponent - ), - }, - { - path: 'icon', - loadComponent: () => - import('./pages/icon-page/icon-page.component').then( - (b) => b.IconPageComponent - ), - }, - { - path: 'popover', - loadComponent: () => - import('./pages/popover-page/popover-page.component').then( - (p) => p.PopoverPageComponent - ), - }, - { - path: 'pagination', - loadComponent: () => - import('./pages/pagination-page/pagination-page.component').then( - (b) => b.PaginationPageComponent - ), - }, - { - path: 'context-menu', - loadComponent: () => - import('./pages/context-menu-page/context-menu-page.component').then( - (p) => p.ContextMenuPageComponent - ), - }, - { - path: 'loader', - loadComponent: () => - import('./pages/loader-page/loader-page.component').then( - (p) => p.LoaderPageComponent - ), - }, - { - path: 'local-storage', - loadComponent: () => - import( - './pages/local-storage-page/local-storage-page.component' - ).then((p) => p.LocalStoragePageComponent), - }, - { - path: 'session-storage', - loadComponent: () => - import( - './pages/session-storage-page/session-storage-page.component' - ).then((p) => p.SessionStoragePageComponent), - }, - { - path: 'dark-mode', - loadComponent: () => - import('./pages/dark-mode-page/dark-mode-page.component').then( - (p) => p.DarkModePageComponent - ), - }, - { - path: '', - redirectTo: 'introduction', - pathMatch: 'full', - }, - ], - }, - { - path: '', - loadComponent: () => - import('./pages/home-page/home-page.component').then( - (h) => h.HomePageComponent - ), - }, ]; diff --git a/projects/docs/src/app/blueprint/api-info/api-description/api-description.component.css b/projects/docs/src/app/blueprint/api-info/api-description/api-description.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/projects/docs/src/app/blueprint/api-info/api-description/api-description.component.html b/projects/docs/src/app/blueprint/api-info/api-description/api-description.component.html deleted file mode 100644 index c1b46ee..0000000 --- a/projects/docs/src/app/blueprint/api-info/api-description/api-description.component.html +++ /dev/null @@ -1,3 +0,0 @@ -
- -
diff --git a/projects/docs/src/app/blueprint/api-info/api-description/api-description.component.ts b/projects/docs/src/app/blueprint/api-info/api-description/api-description.component.ts deleted file mode 100644 index 3d29819..0000000 --- a/projects/docs/src/app/blueprint/api-info/api-description/api-description.component.ts +++ /dev/null @@ -1,9 +0,0 @@ -import { Component } from '@angular/core'; - -@Component({ - selector: 'doc-api-description', - imports: [], - templateUrl: './api-description.component.html', - styleUrl: './api-description.component.css', -}) -export class ApiDescriptionComponent {} diff --git a/projects/docs/src/app/blueprint/api-info/api-info.component.css b/projects/docs/src/app/blueprint/api-info/api-info.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/projects/docs/src/app/blueprint/api-info/api-info.component.html b/projects/docs/src/app/blueprint/api-info/api-info.component.html deleted file mode 100644 index 70a3898..0000000 --- a/projects/docs/src/app/blueprint/api-info/api-info.component.html +++ /dev/null @@ -1,39 +0,0 @@ -@if (apiInfo().articleLink) { -

- Read the - Article - -

-} - -
API
- -@if (apiInfo(); as api) { - @if (api.ariaLink) { -

- The component adheres to - WAI-ARIA - standards for accessibility. -

- } - @if (api.ariaDescription) { -

WAI-ARIA: {{ api.ariaDescription }}

- } - @if (api.stylesInGlobal) { -

- The styles can be found in the - ngverse.css - file. -

- } - - - -

{{ api.description }}

- - -} diff --git a/projects/docs/src/app/blueprint/api-info/api-info.component.ts b/projects/docs/src/app/blueprint/api-info/api-info.component.ts deleted file mode 100644 index 62d0aae..0000000 --- a/projects/docs/src/app/blueprint/api-info/api-info.component.ts +++ /dev/null @@ -1,25 +0,0 @@ -import { DividerComponent } from '@/ui/divider/divider.component'; -import { IconComponent } from '@/ui/icon/icon.component'; -import { Component, input } from '@angular/core'; -import { RouterLink } from '@angular/router'; -import { - ApiEntity, - ApiInputsComponent, -} from './api-inputs/api-inputs.component'; -export interface ApiInfo { - articleLink?: string; - entities: ApiEntity[]; - description?: string; - ariaLink?: string; - ariaDescription?: string; - stylesInGlobal?: boolean; -} -@Component({ - selector: 'doc-api-info', - imports: [ApiInputsComponent, RouterLink, IconComponent, DividerComponent], - templateUrl: './api-info.component.html', - styleUrl: './api-info.component.css', -}) -export class ApiInfoComponent { - apiInfo = input.required(); -} diff --git a/projects/docs/src/app/blueprint/api-info/api-inputs/api-inputs.component.css b/projects/docs/src/app/blueprint/api-info/api-inputs/api-inputs.component.css deleted file mode 100644 index cb67f5b..0000000 --- a/projects/docs/src/app/blueprint/api-info/api-inputs/api-inputs.component.css +++ /dev/null @@ -1,56 +0,0 @@ -@reference "tailwindcss"; - -.api-inputs { - width: 100%; - overflow-x: auto; - .api-inputs-header { - display: flex; - gap: 12px; - width: 100%; - div { - width: 25%; - } - } - - .api-inputs-body { - width: 100%; - } - - .api-inputs-row { - display: flex; - gap: 12px; - - div { - width: 25%; - } - } -} - -.component { - @apply bg-cyan-600; -} - -.directive { - @apply bg-teal-600; -} - -.service { - @apply bg-sky-600; -} - -.table { - @apply w-full text-left text-sm text-slate-500 rtl:text-right dark:text-gray-200; - - td, - th { - border-bottom: 1px solid var(--color-gray-300); - } -} - -.head { - @apply bg-gray-50 text-xs text-slate-700 uppercase dark:bg-slate-700 dark:text-slate-200; -} - -.card { - @apply mb-10 block overflow-x-auto; -} diff --git a/projects/docs/src/app/blueprint/api-info/api-inputs/api-inputs.component.html b/projects/docs/src/app/blueprint/api-info/api-inputs/api-inputs.component.html deleted file mode 100644 index 3da5e5a..0000000 --- a/projects/docs/src/app/blueprint/api-info/api-inputs/api-inputs.component.html +++ /dev/null @@ -1,191 +0,0 @@ -@for (apiInput of apiInputs(); track $index) { -
-

- {{ apiInput.name }} -
- {{ apiInput.type }} - @if (apiInput.selector) { - {{ apiInput.selector }} - } - @if (apiInput.formBindable) { - Form Bindable - } -
-

- @if (apiInput.description) { -

- {{ apiInput.description }} -

- } - @if (apiInput.inputs?.length) { -

Inputs

- - - - - - - - - - - - - @for (apiInput of apiInput.inputs; track $index) { - - - - - - - - } - -
NameTypeDefaultDescription
- {{ apiInput.name }} - {{ apiInput.type }}{{ apiInput.default }} - {{ apiInput.description }} -
- - } - @if (apiInput.outputs?.length) { -

Outputs

- - - - - - - - - - - - @for (apiOutput of apiInput.outputs; track $index) { - - - - - - } - -
NameValueDescription
- {{ apiOutput.name }} - {{ apiOutput.value }} - {{ apiOutput.description }} -
- - } - @if (apiInput.properties?.length) { -

Properties

- - - - - - - - - - - - - @for (apiProp of apiInput.properties; track $index) { - - - - - - - } - -
NameReturn TypeProperty TypeDescription
- {{ apiProp.name }} - {{ apiProp.returnType }}{{ apiProp.propType }}{{ apiProp.description }}
- - } - @if (apiInput.methods?.length) { -

Methods

- - @for (method of apiInput.methods; track $index) { - - - {{ method.name }} - ({{ method.description }}) - - -

- Returns: {{ method.returnType }} - @if (method.returnDescription) { - - : {{ method.returnDescription }} - } -

- @if (method.params?.length) { -

Params:

-
    - @for (param of method.params; track $index) { -
  • -

    - {{ param.name }} - ({{ param.type }}) - @if (param.description) { - - : {{ param.description }} - } -

    - @if (param.fields?.length) { -
      - @for (field of param.fields; track $index) { -
    • - {{ field.name }} - ({{ field.type }}) - @if (field.description) { - - : {{ field.description }} - } - -
      • - } -
    - } -
    • - } -
- } - - - } - - } -
-} diff --git a/projects/docs/src/app/blueprint/api-info/api-inputs/api-inputs.component.ts b/projects/docs/src/app/blueprint/api-info/api-inputs/api-inputs.component.ts deleted file mode 100644 index 6457a23..0000000 --- a/projects/docs/src/app/blueprint/api-info/api-inputs/api-inputs.component.ts +++ /dev/null @@ -1,84 +0,0 @@ -import { AccordionBodyComponent } from '@/ui/accordion/accordion-body.component'; -import { AccordionHeaderComponent } from '@/ui/accordion/accordion-header.component'; -import { AccordionItemComponent } from '@/ui/accordion/accordion-item.component'; -import { AccordionComponent } from '@/ui/accordion/accordion.component'; -import { CardComponent } from '@/ui/card/card.component'; -import { NgClass } from '@angular/common'; -import { Component, input } from '@angular/core'; - -interface ApiInputType { - name: string; - type: string; - description: string; - default?: string; -} - -interface ApiMethodParam { - name: string; - type: string; - description?: string; - fields?: { - name: string; - type: string; - description: string; - default?: string; - }[]; -} - -interface ApiMethodType { - name: string; - returnType: string; - returnDescription?: string; - description?: string; - params?: ApiMethodParam[]; -} - -interface ApiOutputType { - name: string; - value: string; - description: string; -} - -interface ApiPropertyType { - name: string; - returnType: string; - description: string; - propType: 'get' | 'set' | 'get;set;'; -} - -export const VOID_API_RETURN_TYPE = 'void'; - -export const VOID_API_NO_PARAMS = '--'; - -export const EMPTY_API_INPUT_DEFAULT_VALUE = '--'; - -export const AUTO_GENERATED_API_DEFAULT_VALUE = 'Auto Generated'; - -export interface ApiEntity { - name: string; - inputs?: ApiInputType[]; - outputs?: ApiOutputType[]; - methods?: ApiMethodType[]; - properties?: ApiPropertyType[]; - description?: string; - type?: 'component' | 'directive' | 'service'; - selector?: string; - formBindable?: boolean; -} - -@Component({ - selector: 'doc-api-inputs', - imports: [ - NgClass, - AccordionComponent, - AccordionItemComponent, - AccordionBodyComponent, - AccordionHeaderComponent, - CardComponent, - ], - templateUrl: './api-inputs.component.html', - styleUrl: './api-inputs.component.css', -}) -export class ApiInputsComponent { - apiInputs = input.required(); -} diff --git a/projects/docs/src/app/blueprint/blueprint-page/blueprint-page.component.css b/projects/docs/src/app/blueprint/blueprint-page/blueprint-page.component.css deleted file mode 100644 index fa7d3fc..0000000 --- a/projects/docs/src/app/blueprint/blueprint-page/blueprint-page.component.css +++ /dev/null @@ -1,5 +0,0 @@ -.blueprint-page { - display: flex; - flex-direction: column; - gap: 40px; -} diff --git a/projects/docs/src/app/blueprint/blueprint-page/blueprint-page.component.html b/projects/docs/src/app/blueprint/blueprint-page/blueprint-page.component.html deleted file mode 100644 index e55f99a..0000000 --- a/projects/docs/src/app/blueprint/blueprint-page/blueprint-page.component.html +++ /dev/null @@ -1,17 +0,0 @@ -
-
-

- {{ label() }} -

- @if (subTitle()) { -

{{ subTitle() }}

- } -
- - - - - - - -
diff --git a/projects/docs/src/app/blueprint/blueprint-page/blueprint-page.component.ts b/projects/docs/src/app/blueprint/blueprint-page/blueprint-page.component.ts deleted file mode 100644 index 055b3e2..0000000 --- a/projects/docs/src/app/blueprint/blueprint-page/blueprint-page.component.ts +++ /dev/null @@ -1,41 +0,0 @@ -import { DOCUMENT } from '@angular/common'; -import { Component, effect, inject, input } from '@angular/core'; -import { Meta, Title } from '@angular/platform-browser'; - -@Component({ - selector: 'doc-blueprint-page', - templateUrl: './blueprint-page.component.html', - styleUrl: './blueprint-page.component.css', -}) -export class BlueprintPageComponent { - label = input.required(); - subTitle = input(); - title = inject(Title); - meta = inject(Meta); - document = inject(DOCUMENT); - - constructor() { - effect(() => { - const label = this.label(); - const subTitle = this.subTitle(); - this.title.setTitle(`${label} | ngverse`); - if (subTitle) { - this.meta.updateTag({ name: 'description', content: subTitle }); - } - this.meta.addTags([ - { property: 'og:title', content: this.label() }, - { - property: 'og:description', - content: this.subTitle() ?? this.label(), - }, - { - property: 'og:image', - content: 'https://www.ngverse.dev/logo.png', - }, - { property: 'og:image:alt', content: 'NgVerse logo' }, - { property: 'og:url', content: this.document.location.href }, - { property: 'og:type', content: 'website' }, - ]); - }); - } -} diff --git a/projects/docs/src/app/blueprint/command-installation/command-installation.component.css b/projects/docs/src/app/blueprint/command-installation/command-installation.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/projects/docs/src/app/blueprint/command-installation/command-installation.component.html b/projects/docs/src/app/blueprint/command-installation/command-installation.component.html deleted file mode 100644 index 7c72c29..0000000 --- a/projects/docs/src/app/blueprint/command-installation/command-installation.component.html +++ /dev/null @@ -1,6 +0,0 @@ -

Installation

- diff --git a/projects/docs/src/app/blueprint/command-installation/command-installation.component.ts b/projects/docs/src/app/blueprint/command-installation/command-installation.component.ts deleted file mode 100644 index 4b49e65..0000000 --- a/projects/docs/src/app/blueprint/command-installation/command-installation.component.ts +++ /dev/null @@ -1,13 +0,0 @@ -import { Component, computed, input } from '@angular/core'; -import { SourceCodeComponent } from '../source-code/source-code.component'; - -@Component({ - selector: 'doc-command-installation', - imports: [SourceCodeComponent], - templateUrl: './command-installation.component.html', - styleUrl: './command-installation.component.css', -}) -export class CommandInstallationComponent { - name = input.required(); - installation = computed(() => `ng g ngverse:element ${this.name()}`); -} diff --git a/projects/docs/src/app/blueprint/prerequisites/prerequisites.component.css b/projects/docs/src/app/blueprint/prerequisites/prerequisites.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/projects/docs/src/app/blueprint/prerequisites/prerequisites.component.html b/projects/docs/src/app/blueprint/prerequisites/prerequisites.component.html deleted file mode 100644 index d325b0c..0000000 --- a/projects/docs/src/app/blueprint/prerequisites/prerequisites.component.html +++ /dev/null @@ -1,50 +0,0 @@ -

Prerequisites

- -@if (preprsAuto(); as prepsAuto) { -

- {{ name() }} element uses - @for (item of prepsAuto; track $index) { - {{ - item.label - }} - @if ($index < prepsAuto.length - 1) { - and - } @else { - . - } - } - Ensure {{ prepsAuto.length === 1 ? 'it is ' : 'they are ' }} added to your - project if - {{ prepsAuto.length === 1 ? 'it is not ' : 'they are not' }} already. -
- Element folders must be in the same directory for imports to work correctly. -

- -
- @for (dep of preps(); track $index) { - - } -
-

-} @else { -

- -
- Element folders must be in the same directory for imports to work correctly. -

- -
- @for (dep of preps(); track $index) { - - } -
-

-} diff --git a/projects/docs/src/app/blueprint/prerequisites/prerequisites.component.ts b/projects/docs/src/app/blueprint/prerequisites/prerequisites.component.ts deleted file mode 100644 index b32e31a..0000000 --- a/projects/docs/src/app/blueprint/prerequisites/prerequisites.component.ts +++ /dev/null @@ -1,25 +0,0 @@ -import { ChangeDetectionStrategy, Component, input } from '@angular/core'; -import { RouterLink } from '@angular/router'; -import { SourceCodeComponent } from '../source-code/source-code.component'; -export interface Prerequisite { - name: string; - label?: string; -} -@Component({ - selector: 'doc-prerequisites', - imports: [SourceCodeComponent, RouterLink], - templateUrl: './prerequisites.component.html', - styleUrl: './prerequisites.component.css', - changeDetection: ChangeDetectionStrategy.OnPush, -}) -export class PrerequisitesComponent { - preps = input(); - name = input(); - - preprsAuto = input(); - - getCode(dep: Prerequisite) { - const name = dep.name; - return `ng g ngverse:element ${name}`; - } -} diff --git a/projects/docs/src/app/blueprint/source-tree/source-tree-builder.ts b/projects/docs/src/app/blueprint/source-tree/source-tree-builder.ts deleted file mode 100644 index e2093b5..0000000 --- a/projects/docs/src/app/blueprint/source-tree/source-tree-builder.ts +++ /dev/null @@ -1,115 +0,0 @@ -import { Injectable } from '@angular/core'; - -export type SOURCE_FILE_EXTENSION_TYPE = 'ts' | 'html' | 'css' | 'spec.ts'; - -export interface SourceTreeFolder { - name: string; - files: SourceTreeFile[]; - hideName?: boolean; -} - -export interface SourceTreeFile { - name: string; - path: string; - language: SOURCE_FILE_EXTENSION_TYPE; -} - -@Injectable({ - providedIn: 'root', -}) -export class SourceTreeBuilder { - sourceTree(root: string, folders: (root: string) => SourceTreeFolder[]) { - return folders(root); - } - - directive( - name: string, - root: string, - includeSpec?: boolean - ): SourceTreeFile[] { - const tsFile = { - name: `${name}.directive.ts`, - path: `ngverse/${root}/${name}.directive.ts`, - language: 'ts' as const, - }; - if (includeSpec) { - return [ - tsFile, - { - name: `${name}.directive.spec.ts`, - path: `ngverse/${root}/${name}.directive.spec.ts`, - language: 'ts', - }, - ]; - } - return [tsFile]; - } - - file( - name: string, - rootPath: string, - extension: SOURCE_FILE_EXTENSION_TYPE = 'ts' - ) { - return { - name: `${name}.${extension}`, - path: `ngverse/${rootPath}/${name}.${extension}`, - language: extension, - }; - } - - component( - name: string, - rootPath: string, - extension: SOURCE_FILE_EXTENSION_TYPE = 'ts' - ) { - return { - name: `${name}.component.${extension}`, - path: `ngverse/${rootPath}/${name}.component.${extension}`, - language: extension, - }; - } - - fullComponent(name: string, rootPath: string): SourceTreeFile[] { - return [ - this.component(name, rootPath, 'ts'), - this.component(name, rootPath, 'html'), - this.component(name, rootPath, 'css'), - this.component(name, rootPath, 'spec.ts'), - ]; - } - - service(name: string, rootPath: string) { - return [ - this.file(`${name}.service`, rootPath, 'ts'), - this.file(`${name}.service`, rootPath, 'spec.ts'), - ]; - } - - fullInlineComponent(name: string, rootPath: string): SourceTreeFile[] { - return [ - this.component(name, rootPath, 'ts'), - this.component(name, rootPath, 'spec.ts'), - ]; - } - - inlineComponent(name: string, rootPath: string): SourceTreeFile[] { - return [ - this.component(name, rootPath, 'ts'), - this.component(name, rootPath, 'css'), - this.component(name, rootPath, 'spec.ts'), - ]; - } - - folder( - name: string, - root: string, - files: (root: string) => SourceTreeFile[], - hideName?: boolean - ) { - return { - name: name, - files: files(root), - hideName, - }; - } -} diff --git a/projects/docs/src/app/blueprint/source-tree/source-tree-select/source-tree-select.component.css b/projects/docs/src/app/blueprint/source-tree/source-tree-select/source-tree-select.component.css deleted file mode 100644 index 7b0a00c..0000000 --- a/projects/docs/src/app/blueprint/source-tree/source-tree-select/source-tree-select.component.css +++ /dev/null @@ -1,17 +0,0 @@ -@reference "tailwindcss"; - -.select-option { - @apply my-2 block flex h-8 w-full cursor-pointer items-center gap-1 hover:bg-slate-100; - - &.selected { - @apply bg-gray-100; - } -} - -.opened { - transform: rotate(180deg); -} - -.tree-select { - width: 350px; -} diff --git a/projects/docs/src/app/blueprint/source-tree/source-tree-select/source-tree-select.component.html b/projects/docs/src/app/blueprint/source-tree/source-tree-select/source-tree-select.component.html deleted file mode 100644 index 1202b56..0000000 --- a/projects/docs/src/app/blueprint/source-tree/source-tree-select/source-tree-select.component.html +++ /dev/null @@ -1,30 +0,0 @@ - - @for (folder of sourceTree(); track $index) { - - - {{ - folder.hideName ? '/' : '/' + folder.name - }} - - - @for (file of folder.files; track $index) { - -
- - {{ file.name }} -
- - } - - } - diff --git a/projects/docs/src/app/blueprint/source-tree/source-tree-select/source-tree-select.component.ts b/projects/docs/src/app/blueprint/source-tree/source-tree-select/source-tree-select.component.ts deleted file mode 100644 index d756234..0000000 --- a/projects/docs/src/app/blueprint/source-tree/source-tree-select/source-tree-select.component.ts +++ /dev/null @@ -1,73 +0,0 @@ -import { OptionGroupLabelComponent } from '@/ui/select/option-group-label.component'; -import { OptionGroupComponent } from '@/ui/select/option-group.component'; -import { OptionComponent } from '@/ui/select/option.component'; -import { SelectComponent } from '@/ui/select/select.component'; -import { - Component, - computed, - effect, - input, - model, - output, - signal, -} from '@angular/core'; -import { FormsModule } from '@angular/forms'; -import { ChevronDown, Folder, LucideAngularModule } from 'lucide-angular'; -import { SourceTreeFile, SourceTreeFolder } from '../source-tree-builder'; - -@Component({ - selector: 'doc-source-tree-select', - imports: [ - LucideAngularModule, - SelectComponent, - OptionComponent, - FormsModule, - OptionGroupComponent, - OptionGroupLabelComponent, - ], - templateUrl: './source-tree-select.component.html', - styleUrl: './source-tree-select.component.css', -}) -export class SourceTreeSelectComponent { - isOpen = signal(true); - fileSelected = output(); - - selectedFile = model(undefined); - - sourceTree = input([]); - - allFiles = computed(() => this.sourceTree().flatMap((sour) => sour.files)); - - ChevronDown = ChevronDown; - Folder = Folder; - - constructor() { - effect(() => { - if (this.selectedFile()) { - return; - } - const sourceTree = this.sourceTree(); - if (sourceTree.length) { - const newFile = sourceTree[0].files[0]; - this.selectedFile.set(newFile); - this.fileSelect(); - } - }); - } - - close() { - this.isOpen.set(false); - } - - open() { - this.isOpen.set(true); - } - - fileSelect() { - const file = this.selectedFile(); - if (file) { - this.fileSelected.emit(file); - } - this.close(); - } -} diff --git a/projects/docs/src/app/blueprint/source-tree/source-tree.component.css b/projects/docs/src/app/blueprint/source-tree/source-tree.component.css deleted file mode 100644 index c88cee7..0000000 --- a/projects/docs/src/app/blueprint/source-tree/source-tree.component.css +++ /dev/null @@ -1,5 +0,0 @@ -@reference "tailwindcss"; - -.file-label { - @apply cursor-pointer border-0 border-b border-solid border-gray-200 p-3; -} diff --git a/projects/docs/src/app/blueprint/source-tree/source-tree.component.html b/projects/docs/src/app/blueprint/source-tree/source-tree.component.html deleted file mode 100644 index db052d3..0000000 --- a/projects/docs/src/app/blueprint/source-tree/source-tree.component.html +++ /dev/null @@ -1,22 +0,0 @@ -
-
Source code
-
- Include Tests - -
-
- -
- -
- diff --git a/projects/docs/src/app/blueprint/source-tree/source-tree.component.ts b/projects/docs/src/app/blueprint/source-tree/source-tree.component.ts deleted file mode 100644 index 98fd49c..0000000 --- a/projects/docs/src/app/blueprint/source-tree/source-tree.component.ts +++ /dev/null @@ -1,71 +0,0 @@ -import { ButtonComponent } from '@/ui/button/button.component'; -import { CheckboxComponent } from '@/ui/checkbox/checkbox.component'; -import { Component, inject, input, model, OnInit, signal } from '@angular/core'; -import { FormsModule } from '@angular/forms'; -import { FileService } from '../../services/file.service'; -import { SourceCodeComponent } from '../source-code/source-code.component'; -import { - SOURCE_FILE_EXTENSION_TYPE, - SourceTreeFile, - SourceTreeFolder, -} from './source-tree-builder'; -import { SourceTreeSelectComponent } from './source-tree-select/source-tree-select.component'; -import { SourceTreeResolver } from './source-tree.resolver'; - -@Component({ - selector: 'doc-source-tree', - imports: [ - SourceCodeComponent, - SourceTreeSelectComponent, - ButtonComponent, - CheckboxComponent, - FormsModule, - ], - templateUrl: './source-tree.component.html', - styleUrl: './source-tree.component.css', -}) -export class SourceTreeComponent implements OnInit { - fileService = inject(FileService); - private sourceTreeResolver = inject(SourceTreeResolver); - - files = ['html', 'css', 'js', 'spec']; - - code = signal(''); - - language = signal('ts'); - - /** - * Deprecated source tree should be resolved automatically - * by name - */ - sourceTree = model(); - - sourceTreeAlpha = signal([]); - - includeTests = model(); - - name = input.required(); - - ngOnInit(): void { - const dir = this.sourceTreeResolver.getSourceTree(this.name()); - if (dir) { - this.sourceTreeAlpha.set(dir); - } - } - - fileSelected(file: SourceTreeFile) { - this.language.set(file.language === 'spec.ts' ? 'ts' : file.language); - this.fileService.getFile(`ngverse/${file.path}`).subscribe((data) => { - this.code.set(data); - }); - } - - download() { - const sourceTree = this.sourceTreeAlpha(); - this.fileService.downloadSourceTree( - this.name(), - sourceTree, - !!this.includeTests() - ); - } -} diff --git a/projects/docs/src/app/blueprint/source-tree/source-tree.resolver.ts b/projects/docs/src/app/blueprint/source-tree/source-tree.resolver.ts deleted file mode 100644 index f427941..0000000 --- a/projects/docs/src/app/blueprint/source-tree/source-tree.resolver.ts +++ /dev/null @@ -1,38 +0,0 @@ -import { Injectable } from '@angular/core'; -import data from '../../../tree-structure.json'; -import { SourceTreeFile, SourceTreeFolder } from './source-tree-builder'; -@Injectable({ - providedIn: 'root', -}) -export class SourceTreeResolver { - getSourceTree(name: string) { - const foundDir = data.files.find((folder) => folder.name === name); - if (!foundDir || !foundDir.files) { - console.warn('Dir not found ', name); - return; - } - const flattenDirs: SourceTreeFolder[] = []; - - const rootFolder: SourceTreeFolder = { - name: '', - files: [], - hideName: false, - }; - flattenDirs.push(rootFolder); - - for (const dir of foundDir.files) { - //If it is folder - if (dir.files) { - flattenDirs.push({ - name: dir.name, - files: dir.files as SourceTreeFile[], - hideName: false, - }); - } else { - rootFolder.files.push(dir as unknown as SourceTreeFile); - } - } - - return flattenDirs; - } -} diff --git a/projects/docs/src/app/pages/header/header.component.css b/projects/docs/src/app/core/header/header.component.css similarity index 100% rename from projects/docs/src/app/pages/header/header.component.css rename to projects/docs/src/app/core/header/header.component.css diff --git a/projects/docs/src/app/pages/header/header.component.html b/projects/docs/src/app/core/header/header.component.html similarity index 95% rename from projects/docs/src/app/pages/header/header.component.html rename to projects/docs/src/app/core/header/header.component.html index 57c7579..660593c 100644 --- a/projects/docs/src/app/pages/header/header.component.html +++ b/projects/docs/src/app/core/header/header.component.html @@ -2,7 +2,7 @@ -
+
NgVerse diff --git a/projects/docs/src/app/pages/header/header.component.ts b/projects/docs/src/app/core/header/header.component.ts similarity index 100% rename from projects/docs/src/app/pages/header/header.component.ts rename to projects/docs/src/app/core/header/header.component.ts diff --git a/projects/docs/src/app/blueprint/show-case/show-case.component.css b/projects/docs/src/app/core/kit-page/show-case/show-case.component.css similarity index 100% rename from projects/docs/src/app/blueprint/show-case/show-case.component.css rename to projects/docs/src/app/core/kit-page/show-case/show-case.component.css diff --git a/projects/docs/src/app/blueprint/show-case/show-case.component.html b/projects/docs/src/app/core/kit-page/show-case/show-case.component.html similarity index 100% rename from projects/docs/src/app/blueprint/show-case/show-case.component.html rename to projects/docs/src/app/core/kit-page/show-case/show-case.component.html diff --git a/projects/docs/src/app/blueprint/show-case/show-case.component.ts b/projects/docs/src/app/core/kit-page/show-case/show-case.component.ts similarity index 95% rename from projects/docs/src/app/blueprint/show-case/show-case.component.ts rename to projects/docs/src/app/core/kit-page/show-case/show-case.component.ts index f5df653..104f0f4 100644 --- a/projects/docs/src/app/blueprint/show-case/show-case.component.ts +++ b/projects/docs/src/app/core/kit-page/show-case/show-case.component.ts @@ -3,7 +3,7 @@ import { TabGroupComponent } from '@/ui/tab/tab-group.component'; import { TabComponent } from '@/ui/tab/tab.component'; import { UpperCasePipe } from '@angular/common'; import { Component, inject, input, signal } from '@angular/core'; -import { FileService } from '../../services/file.service'; +import { FileService } from "../../../services/file.service"; import { SourceCodeComponent } from '../source-code/source-code.component'; @Component({ diff --git a/projects/docs/src/app/blueprint/source-code/source-code.component.css b/projects/docs/src/app/core/kit-page/source-code/source-code.component.css similarity index 100% rename from projects/docs/src/app/blueprint/source-code/source-code.component.css rename to projects/docs/src/app/core/kit-page/source-code/source-code.component.css diff --git a/projects/docs/src/app/blueprint/source-code/source-code.component.html b/projects/docs/src/app/core/kit-page/source-code/source-code.component.html similarity index 100% rename from projects/docs/src/app/blueprint/source-code/source-code.component.html rename to projects/docs/src/app/core/kit-page/source-code/source-code.component.html diff --git a/projects/docs/src/app/blueprint/source-code/source-code.component.ts b/projects/docs/src/app/core/kit-page/source-code/source-code.component.ts similarity index 93% rename from projects/docs/src/app/blueprint/source-code/source-code.component.ts rename to projects/docs/src/app/core/kit-page/source-code/source-code.component.ts index 29b2dd7..7c546d4 100644 --- a/projects/docs/src/app/blueprint/source-code/source-code.component.ts +++ b/projects/docs/src/app/core/kit-page/source-code/source-code.component.ts @@ -3,8 +3,7 @@ import { IconComponent } from '@/ui/icon/icon.component'; import { ClipboardModule } from '@angular/cdk/clipboard'; import { Component, computed, input, signal } from '@angular/core'; import { Highlight } from 'ngx-highlightjs'; -import { EMPTY_FILE_TOKEN } from '../../services/file.service'; - +import { EMPTY_FILE_TOKEN } from "../../../services/file.service"; @Component({ selector: 'doc-source-code', imports: [Highlight, ClipboardModule, IconComponent, CardComponent], diff --git a/projects/docs/src/app/core/sidebar/sidebar.component.css b/projects/docs/src/app/core/sidebar/sidebar.component.css new file mode 100644 index 0000000..cdffbd1 --- /dev/null +++ b/projects/docs/src/app/core/sidebar/sidebar.component.css @@ -0,0 +1,33 @@ +@reference "tailwindcss"; + +a { + text-decoration: none; +} + +.selected { + @apply bg-slate-100 font-medium; +} + +.sidebar { + border-right: 1px solid var(--color-border); + background: var(--color-background); + height: 100vh; + padding-bottom: 60px; + @variant lg { + height: calc(100vh - 56px); + @apply sticky top-[56px]; + } +} + +.in-progress { + @apply pointer-events-none text-gray-400; +} + +.sidebar-link { + &:hover, + &.selected { + @apply font-medium; + background: var(--color-accent); + color: var(--color-accent-foreground); + } +} diff --git a/projects/docs/src/app/core/sidebar/sidebar.component.html b/projects/docs/src/app/core/sidebar/sidebar.component.html new file mode 100644 index 0000000..1976f92 --- /dev/null +++ b/projects/docs/src/app/core/sidebar/sidebar.component.html @@ -0,0 +1,19 @@ +
+ +
diff --git a/projects/docs/src/app/core/sidebar/sidebar.component.ts b/projects/docs/src/app/core/sidebar/sidebar.component.ts new file mode 100644 index 0000000..c20de02 --- /dev/null +++ b/projects/docs/src/app/core/sidebar/sidebar.component.ts @@ -0,0 +1,27 @@ +import { Component, input } from '@angular/core'; +import { RouterLink, RouterLinkActive } from '@angular/router'; + +export interface SidebarGroup { + name: string; + children: SidebarLink[]; +} + +export interface SidebarLink { + name: string; + url: string; + done?: boolean; +} + +// export function getAllSidebarLinks() { +// return SIDEBAR_ROUTES.flatMap((group) => group.children); +// } + +@Component({ + selector: 'doc-sidebar', + imports: [RouterLink, RouterLinkActive], + templateUrl: './sidebar.component.html', + styleUrl: './sidebar.component.css', +}) +export class SidebarComponent { + routes = input.required(); +} diff --git a/projects/docs/src/app/examples/accordion/show-case-accordion/show-case-accordion.component.css b/projects/docs/src/app/examples/accordion/show-case-accordion/show-case-accordion.component.css deleted file mode 100644 index cf7c2ee..0000000 --- a/projects/docs/src/app/examples/accordion/show-case-accordion/show-case-accordion.component.css +++ /dev/null @@ -1,8 +0,0 @@ -.show-case { - display: flex; - gap: 8px; -} - -app-accordion { - width: 100%; -} diff --git a/projects/docs/src/app/examples/accordion/show-case-accordion/show-case-accordion.component.html b/projects/docs/src/app/examples/accordion/show-case-accordion/show-case-accordion.component.html deleted file mode 100644 index 2f8db97..0000000 --- a/projects/docs/src/app/examples/accordion/show-case-accordion/show-case-accordion.component.html +++ /dev/null @@ -1,9 +0,0 @@ -
- - @for (item of items; track $index) { - - {{ item.description }} - - } - -
diff --git a/projects/docs/src/app/examples/accordion/show-case-accordion/show-case-accordion.component.ts b/projects/docs/src/app/examples/accordion/show-case-accordion/show-case-accordion.component.ts deleted file mode 100644 index e37a52a..0000000 --- a/projects/docs/src/app/examples/accordion/show-case-accordion/show-case-accordion.component.ts +++ /dev/null @@ -1,37 +0,0 @@ -import { AccordionBodyComponent } from '@/ui/accordion/accordion-body.component'; -import { AccordionItemComponent } from '@/ui/accordion/accordion-item.component'; -import { AccordionComponent } from '@/ui/accordion/accordion.component'; -import { Component } from '@angular/core'; - -@Component({ - selector: 'doc-show-case-accordion', - imports: [AccordionComponent, AccordionItemComponent, AccordionBodyComponent], - templateUrl: './show-case-accordion.component.html', - styleUrl: './show-case-accordion.component.css', -}) -export class ShowCaseAccordionComponent { - items = [ - { - title: 'How to add ngverse to a project?', - description: 'run: ng add ngverse', - }, - { - title: 'How to add an element?', - description: 'run: ng g ngverse:element [name]', - }, - { - title: 'How to customize an element?', - description: 'The source code is yours. do whatever you want to', - }, - { - title: 'How to style an element', - description: - 'Elements come with default styles for a polished look right out of the box, but you can easily customize them within their SCSS files to suit your needs.', - }, - { - title: 'Why it is called element and not component?', - description: - 'The term element is used because ngverse is not limited to components. It includes directives, pipes, functions, and more, making element a broader and more inclusive term.', - }, - ]; -} diff --git a/projects/docs/src/app/examples/alert/show-case-alert/show-case-alert.component.css b/projects/docs/src/app/examples/alert/show-case-alert/show-case-alert.component.css deleted file mode 100644 index c1c61c5..0000000 --- a/projects/docs/src/app/examples/alert/show-case-alert/show-case-alert.component.css +++ /dev/null @@ -1,5 +0,0 @@ -.show-case { - display: flex; - gap: 8px; - flex-direction: column; -} diff --git a/projects/docs/src/app/examples/alert/show-case-alert/show-case-alert.component.html b/projects/docs/src/app/examples/alert/show-case-alert/show-case-alert.component.html deleted file mode 100644 index 113d63d..0000000 --- a/projects/docs/src/app/examples/alert/show-case-alert/show-case-alert.component.html +++ /dev/null @@ -1,31 +0,0 @@ -
- - Accessibility ! - We prioritize accessibility, ensuring that all elements adhere to - WAI-ARIA best practices - - - Isolation - Almost all elements are self-contained, meaning that all the necessary - files are located within the same directory. - - - Dependencies - only dependencies are angular/cdk and angular animations. they will be - added automatically with ng add ngverse command - - - Contribute - If you want to create a generic element or update an existing one with - general behavior, go for it and contribute to helping - others! - -
diff --git a/projects/docs/src/app/examples/alert/show-case-alert/show-case-alert.component.ts b/projects/docs/src/app/examples/alert/show-case-alert/show-case-alert.component.ts deleted file mode 100644 index 0b51792..0000000 --- a/projects/docs/src/app/examples/alert/show-case-alert/show-case-alert.component.ts +++ /dev/null @@ -1,12 +0,0 @@ -import { AlertBodyComponent } from '@/ui/alert/alert-body.component'; -import { AlertHeaderComponent } from '@/ui/alert/alert-header.component'; -import { AlertComponent } from '@/ui/alert/alert.component'; -import { Component } from '@angular/core'; - -@Component({ - selector: 'doc-show-case-alert', - imports: [AlertComponent, AlertHeaderComponent, AlertBodyComponent], - templateUrl: './show-case-alert.component.html', - styleUrl: './show-case-alert.component.css', -}) -export class ShowCaseAlertComponent {} diff --git a/projects/docs/src/app/examples/autocomplete/show-case-autocomplete/show-case-autocomplete.component.css b/projects/docs/src/app/examples/autocomplete/show-case-autocomplete/show-case-autocomplete.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/projects/docs/src/app/examples/autocomplete/show-case-autocomplete/show-case-autocomplete.component.html b/projects/docs/src/app/examples/autocomplete/show-case-autocomplete/show-case-autocomplete.component.html deleted file mode 100644 index 2bfd88a..0000000 --- a/projects/docs/src/app/examples/autocomplete/show-case-autocomplete/show-case-autocomplete.component.html +++ /dev/null @@ -1,5 +0,0 @@ - - @for (item of filteredItems(); track $index) { - {{ item }} - } - diff --git a/projects/docs/src/app/examples/autocomplete/show-case-autocomplete/show-case-autocomplete.component.ts b/projects/docs/src/app/examples/autocomplete/show-case-autocomplete/show-case-autocomplete.component.ts deleted file mode 100644 index dda0a32..0000000 --- a/projects/docs/src/app/examples/autocomplete/show-case-autocomplete/show-case-autocomplete.component.ts +++ /dev/null @@ -1,22 +0,0 @@ -import { AutocompleteItemComponent } from '@/ui/autocomplete/autocomplete-item/autocomplete-item.component'; -import { AutocompleteComponent } from '@/ui/autocomplete/autocomplete.component'; -import { Component, computed, model } from '@angular/core'; -import { FormsModule } from '@angular/forms'; - -@Component({ - selector: 'doc-show-case-autocomplete', - imports: [AutocompleteComponent, AutocompleteItemComponent, FormsModule], - templateUrl: './show-case-autocomplete.component.html', - styleUrl: './show-case-autocomplete.component.css', -}) -export class ShowCaseAutocompleteComponent { - readonly items = ['Angular', 'React', 'Vue', 'Svelte', 'Next.js']; - - currentFilter = model(''); - - filteredItems = computed(() => { - return this.items.filter((item) => - item.toLowerCase().includes(this.currentFilter().toLowerCase()) - ); - }); -} diff --git a/projects/docs/src/app/examples/badge/show-case-badge/show-case-badge.component.css b/projects/docs/src/app/examples/badge/show-case-badge/show-case-badge.component.css deleted file mode 100644 index 23866eb..0000000 --- a/projects/docs/src/app/examples/badge/show-case-badge/show-case-badge.component.css +++ /dev/null @@ -1,7 +0,0 @@ -.show-case { - display: flex; - flex-direction: column; - gap: 12px; - justify-content: start; - align-items: start; -} diff --git a/projects/docs/src/app/examples/badge/show-case-badge/show-case-badge.component.html b/projects/docs/src/app/examples/badge/show-case-badge/show-case-badge.component.html deleted file mode 100644 index b036ced..0000000 --- a/projects/docs/src/app/examples/badge/show-case-badge/show-case-badge.component.html +++ /dev/null @@ -1,8 +0,0 @@ -
-
- Notifications -
- -
diff --git a/projects/docs/src/app/examples/badge/show-case-badge/show-case-badge.component.ts b/projects/docs/src/app/examples/badge/show-case-badge/show-case-badge.component.ts deleted file mode 100644 index cb2fc0a..0000000 --- a/projects/docs/src/app/examples/badge/show-case-badge/show-case-badge.component.ts +++ /dev/null @@ -1,21 +0,0 @@ -import { BadgeComponent } from '@/ui/badge/badge.component'; -import { ButtonComponent } from '@/ui/button/button.component'; -import { Component, signal } from '@angular/core'; -import { FormsModule } from '@angular/forms'; - -@Component({ - selector: 'doc-show-case-badge', - imports: [FormsModule, ButtonComponent, BadgeComponent], - templateUrl: './show-case-badge.component.html', - styleUrl: './show-case-badge.component.css', -}) -export class ShowCaseBadgeComponent { - count = signal(8); - decreese() { - if (!this.count()) { - return; - } - - this.count.update((c) => c - 1); - } -} diff --git a/projects/docs/src/app/examples/button/show-case-button/show-case-button.component.css b/projects/docs/src/app/examples/button/show-case-button/show-case-button.component.css deleted file mode 100644 index 76abb0b..0000000 --- a/projects/docs/src/app/examples/button/show-case-button/show-case-button.component.css +++ /dev/null @@ -1,17 +0,0 @@ -.show-case { - display: flex; - flex-direction: column; - flex-wrap: wrap; - gap: 8px; -} - -.buttons-container { - display: flex; - gap: 8px; - flex-wrap: wrap; -} - -.buttons-label { - margin-top: 16px; - margin-bottom: 10px; -} diff --git a/projects/docs/src/app/examples/button/show-case-button/show-case-button.component.html b/projects/docs/src/app/examples/button/show-case-button/show-case-button.component.html deleted file mode 100644 index 8326f3f..0000000 --- a/projects/docs/src/app/examples/button/show-case-button/show-case-button.component.html +++ /dev/null @@ -1,32 +0,0 @@ -
-
-

Button

-
- - - - - - - - -
-
-
-

Icon Button

-
- - - - -
-
-
diff --git a/projects/docs/src/app/examples/button/show-case-button/show-case-button.component.ts b/projects/docs/src/app/examples/button/show-case-button/show-case-button.component.ts deleted file mode 100644 index e4c169a..0000000 --- a/projects/docs/src/app/examples/button/show-case-button/show-case-button.component.ts +++ /dev/null @@ -1,11 +0,0 @@ -import { ButtonComponent } from '@/ui/button/button.component'; -import { IconComponent } from '@/ui/icon/icon.component'; -import { Component } from '@angular/core'; - -@Component({ - selector: 'doc-show-case-button', - imports: [ButtonComponent, IconComponent], - templateUrl: './show-case-button.component.html', - styleUrl: './show-case-button.component.css', -}) -export class ShowCaseButtonComponent {} diff --git a/projects/docs/src/app/examples/card/show-case-card/show-case-card.component.css b/projects/docs/src/app/examples/card/show-case-card/show-case-card.component.css deleted file mode 100644 index ae53688..0000000 --- a/projects/docs/src/app/examples/card/show-case-card/show-case-card.component.css +++ /dev/null @@ -1,28 +0,0 @@ -.show-case { - display: flex; - flex-wrap: wrap; - align-items: center; - justify-content: center; - gap: 10px; -} - -.card { - max-width: 300px; -} - -.card-header { - margin-bottom: 12px; -} - -.card-footer { - display: flex; - justify-content: end; - gap: 10px; - margin-top: 12px; -} - -.card-content { - display: flex; - flex-direction: column; - gap: 10px; -} diff --git a/projects/docs/src/app/examples/card/show-case-card/show-case-card.component.html b/projects/docs/src/app/examples/card/show-case-card/show-case-card.component.html deleted file mode 100644 index b90bd6f..0000000 --- a/projects/docs/src/app/examples/card/show-case-card/show-case-card.component.html +++ /dev/null @@ -1,41 +0,0 @@ -
- -
With Outline
-
- - -
-
- - -
- - -
With Surface
-
- - -
-
- - -
- - -
With Shadow
-
- - -
-
- - -
- -
diff --git a/projects/docs/src/app/examples/card/show-case-card/show-case-card.component.ts b/projects/docs/src/app/examples/card/show-case-card/show-case-card.component.ts deleted file mode 100644 index fb59a2a..0000000 --- a/projects/docs/src/app/examples/card/show-case-card/show-case-card.component.ts +++ /dev/null @@ -1,16 +0,0 @@ -import { ButtonComponent } from '@/ui/button/button.component'; -import { CardComponent } from '@/ui/card/card.component'; -import { InputDirective } from '@/ui/input/input.directive'; -import { Component, model } from '@angular/core'; -import { FormsModule } from '@angular/forms'; - -@Component({ - selector: 'doc-show-case-card', - imports: [CardComponent, ButtonComponent, FormsModule, InputDirective], - templateUrl: './show-case-card.component.html', - styleUrl: './show-case-card.component.css', -}) -export class ShowCaseCardComponent { - username = model(''); - password = model(''); -} diff --git a/projects/docs/src/app/examples/checkbox/show-case-checkbox/show-case-checkbox.component.css b/projects/docs/src/app/examples/checkbox/show-case-checkbox/show-case-checkbox.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/projects/docs/src/app/examples/checkbox/show-case-checkbox/show-case-checkbox.component.html b/projects/docs/src/app/examples/checkbox/show-case-checkbox/show-case-checkbox.component.html deleted file mode 100644 index 10683db..0000000 --- a/projects/docs/src/app/examples/checkbox/show-case-checkbox/show-case-checkbox.component.html +++ /dev/null @@ -1 +0,0 @@ -I am kind checkbox diff --git a/projects/docs/src/app/examples/checkbox/show-case-checkbox/show-case-checkbox.component.ts b/projects/docs/src/app/examples/checkbox/show-case-checkbox/show-case-checkbox.component.ts deleted file mode 100644 index a0a204c..0000000 --- a/projects/docs/src/app/examples/checkbox/show-case-checkbox/show-case-checkbox.component.ts +++ /dev/null @@ -1,13 +0,0 @@ -import { CheckboxComponent } from '@/ui/checkbox/checkbox.component'; -import { Component } from '@angular/core'; -import { FormControl, FormsModule, ReactiveFormsModule } from '@angular/forms'; - -@Component({ - selector: 'doc-show-case-checkbox', - imports: [ReactiveFormsModule, CheckboxComponent, FormsModule], - templateUrl: './show-case-checkbox.component.html', - styleUrl: './show-case-checkbox.component.css', -}) -export class ShowCaseCheckboxComponent { - formControl = new FormControl(false); -} diff --git a/projects/docs/src/app/examples/context-menu/show-case-context-menu/show-case-context-menu.component.css b/projects/docs/src/app/examples/context-menu/show-case-context-menu/show-case-context-menu.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/projects/docs/src/app/examples/context-menu/show-case-context-menu/show-case-context-menu.component.html b/projects/docs/src/app/examples/context-menu/show-case-context-menu/show-case-context-menu.component.html deleted file mode 100644 index 67256a5..0000000 --- a/projects/docs/src/app/examples/context-menu/show-case-context-menu/show-case-context-menu.component.html +++ /dev/null @@ -1,10 +0,0 @@ -
-

Right click to open context menu

-
- - -
- - -
- diff --git a/projects/docs/src/app/examples/context-menu/show-case-context-menu/show-case-context-menu.component.ts b/projects/docs/src/app/examples/context-menu/show-case-context-menu/show-case-context-menu.component.ts deleted file mode 100644 index 0610ace..0000000 --- a/projects/docs/src/app/examples/context-menu/show-case-context-menu/show-case-context-menu.component.ts +++ /dev/null @@ -1,44 +0,0 @@ -import { ContextMenuItemDirective } from '@/ui/context-menu/context-menu-item.directive'; -import { ContextMenuTriggerDirective } from '@/ui/context-menu/context-menu-trigger.directive'; -import { ContextMenuDirective } from '@/ui/context-menu/context-menu.directive'; -import { ToastService } from '@/ui/toast/toast.service'; -import { - ChangeDetectionStrategy, - Component, - inject, - signal, -} from '@angular/core'; - -@Component({ - selector: 'doc-show-case-context-menu', - imports: [ - ContextMenuDirective, - ContextMenuTriggerDirective, - ContextMenuItemDirective, - ], - templateUrl: './show-case-context-menu.component.html', - styleUrl: './show-case-context-menu.component.css', - changeDetection: ChangeDetectionStrategy.OnPush, -}) -export class ShowCaseContextMenuComponent { - private toast = inject(ToastService); - - color = signal('inherit'); - - markRead() { - this.color.set('red'); - } - - copy(text?: string | null) { - if (!text) { - return; - } - navigator.clipboard.writeText(text).then(() => { - this.toast.open({ - message: 'Copied!', - showCloseIcon: false, - closeDelay: 1000, - }); - }); - } -} diff --git a/projects/docs/src/app/examples/dark-mode/show-case-dark-mode/show-case-dark-mode.component.css b/projects/docs/src/app/examples/dark-mode/show-case-dark-mode/show-case-dark-mode.component.css deleted file mode 100644 index 2b36239..0000000 --- a/projects/docs/src/app/examples/dark-mode/show-case-dark-mode/show-case-dark-mode.component.css +++ /dev/null @@ -1,7 +0,0 @@ -.dark-mode-info { - margin-top: 12px; -} - -.dark-mode-status { - font-weight: bold; -} diff --git a/projects/docs/src/app/examples/dark-mode/show-case-dark-mode/show-case-dark-mode.component.html b/projects/docs/src/app/examples/dark-mode/show-case-dark-mode/show-case-dark-mode.component.html deleted file mode 100644 index 9739ab7..0000000 --- a/projects/docs/src/app/examples/dark-mode/show-case-dark-mode/show-case-dark-mode.component.html +++ /dev/null @@ -1,8 +0,0 @@ - - -

- Dark mode is - {{ - isDarkMode() ? 'enabled' : 'disabled' - }} -

diff --git a/projects/docs/src/app/examples/dark-mode/show-case-dark-mode/show-case-dark-mode.component.ts b/projects/docs/src/app/examples/dark-mode/show-case-dark-mode/show-case-dark-mode.component.ts deleted file mode 100644 index ea34528..0000000 --- a/projects/docs/src/app/examples/dark-mode/show-case-dark-mode/show-case-dark-mode.component.ts +++ /dev/null @@ -1,16 +0,0 @@ -import { DarkModeToggleComponent } from '@/ui/dark-mode/dark-mode-toggle.component'; -import { DarkModeService } from '@/ui/dark-mode/dark-mode.service'; -import { ChangeDetectionStrategy, Component, inject } from '@angular/core'; - -@Component({ - selector: 'doc-show-case-dark-mode', - imports: [DarkModeToggleComponent], - templateUrl: './show-case-dark-mode.component.html', - styleUrl: './show-case-dark-mode.component.css', - changeDetection: ChangeDetectionStrategy.OnPush, -}) -export class ShowCaseDarkModeComponent { - private readonly darkModeService = inject(DarkModeService); - - isDarkMode = this.darkModeService.isEnabled; -} diff --git a/projects/docs/src/app/examples/dialog/dialog-test/dialog-test.component.css b/projects/docs/src/app/examples/dialog/dialog-test/dialog-test.component.css deleted file mode 100644 index ae5fa3e..0000000 --- a/projects/docs/src/app/examples/dialog/dialog-test/dialog-test.component.css +++ /dev/null @@ -1,4 +0,0 @@ -.dialog-test { - padding: 12px; - margin-top: 14px; -} diff --git a/projects/docs/src/app/examples/dialog/dialog-test/dialog-test.component.html b/projects/docs/src/app/examples/dialog/dialog-test/dialog-test.component.html deleted file mode 100644 index 521eb22..0000000 --- a/projects/docs/src/app/examples/dialog/dialog-test/dialog-test.component.html +++ /dev/null @@ -1,17 +0,0 @@ -
- - First Name - - - - Last Name - - - - Best Movie - - - -
diff --git a/projects/docs/src/app/examples/dialog/dialog-test/dialog-test.component.ts b/projects/docs/src/app/examples/dialog/dialog-test/dialog-test.component.ts deleted file mode 100644 index f9728fe..0000000 --- a/projects/docs/src/app/examples/dialog/dialog-test/dialog-test.component.ts +++ /dev/null @@ -1,21 +0,0 @@ -import { ButtonComponent } from '@/ui/button/button.component'; -import { DialogCloseDirective } from '@/ui/dialog/dialog-close.directive'; -import { FormFieldComponent } from '@/ui/form-field/form-field.component'; -import { LabelComponent } from '@/ui/form-field/label/label.component'; -import { InputDirective } from '@/ui/input/input.directive'; -import { ChangeDetectionStrategy, Component } from '@angular/core'; - -@Component({ - selector: 'doc-dialog-test', - imports: [ - FormFieldComponent, - InputDirective, - ButtonComponent, - DialogCloseDirective, - LabelComponent, - ], - templateUrl: './dialog-test.component.html', - styleUrl: './dialog-test.component.css', - changeDetection: ChangeDetectionStrategy.OnPush, -}) -export class DialogTestComponent {} diff --git a/projects/docs/src/app/examples/dialog/show-case-dialog/show-case-dialog.component.css b/projects/docs/src/app/examples/dialog/show-case-dialog/show-case-dialog.component.css deleted file mode 100644 index b7d7053..0000000 --- a/projects/docs/src/app/examples/dialog/show-case-dialog/show-case-dialog.component.css +++ /dev/null @@ -1,5 +0,0 @@ -.section { - display: flex; - align-items: center; - gap: 12px; -} diff --git a/projects/docs/src/app/examples/dialog/show-case-dialog/show-case-dialog.component.html b/projects/docs/src/app/examples/dialog/show-case-dialog/show-case-dialog.component.html deleted file mode 100644 index 07c5c83..0000000 --- a/projects/docs/src/app/examples/dialog/show-case-dialog/show-case-dialog.component.html +++ /dev/null @@ -1,25 +0,0 @@ -
- - - - - -
diff --git a/projects/docs/src/app/examples/dialog/show-case-dialog/show-case-dialog.component.ts b/projects/docs/src/app/examples/dialog/show-case-dialog/show-case-dialog.component.ts deleted file mode 100644 index dc24b96..0000000 --- a/projects/docs/src/app/examples/dialog/show-case-dialog/show-case-dialog.component.ts +++ /dev/null @@ -1,42 +0,0 @@ -import { ButtonComponent } from '@/ui/button/button.component'; -import { ConfirmDirective } from '@/ui/dialog/confirm.directive'; -import { DialogService } from '@/ui/dialog/dialog.service'; -import { Component, inject } from '@angular/core'; -import { DialogTestComponent } from '../dialog-test/dialog-test.component'; - -@Component({ - selector: 'doc-show-case-dialog', - imports: [ButtonComponent, ConfirmDirective], - templateUrl: './show-case-dialog.component.html', - styleUrl: './show-case-dialog.component.css', -}) -export class ShowCaseDialogComponent { - dialogService = inject(DialogService); - - showDialog() { - this.dialogService.dialog(DialogTestComponent, { - title: 'Fill the user data', - }); - } - - showConfirm() { - this.dialogService.confirm({ - title: 'Are you sure?', - description: 'It will delete user data', - }); - } - - showAlert() { - this.dialogService.alert({ - title: 'Immediate action', - description: 'Please review the document', - buttonLabel: 'OK', - }); - } - - deleteItem() { - setTimeout(() => { - alert('Delete item'); - }); - } -} diff --git a/projects/docs/src/app/examples/divider/show-case-divider/show-case-divider.component.css b/projects/docs/src/app/examples/divider/show-case-divider/show-case-divider.component.css deleted file mode 100644 index b526c35..0000000 --- a/projects/docs/src/app/examples/divider/show-case-divider/show-case-divider.component.css +++ /dev/null @@ -1,21 +0,0 @@ -.vertical { - display: grid; - grid-template-columns: repeat(3, 1fr); - grid-gap: 16px; - - li { - display: flex; - } - - .divider { - margin-left: 16px; - } -} - -p { - margin: 12px 0; -} - -.section-divider { - margin: 32px 0; -} diff --git a/projects/docs/src/app/examples/divider/show-case-divider/show-case-divider.component.html b/projects/docs/src/app/examples/divider/show-case-divider/show-case-divider.component.html deleted file mode 100644 index 80a843e..0000000 --- a/projects/docs/src/app/examples/divider/show-case-divider/show-case-divider.component.html +++ /dev/null @@ -1,61 +0,0 @@ -Horizontal divider -
    -
  • -

    - Lorem Ipsum is simply dummy text of the printing and typesetting industry. - Lorem Ipsum has been the industry's standard dummy text ever since the - 1500s, when an unknown printer took a galley of type and scrambled it to - make a type specimen book -

    - -
    • -
  • -

    - Lorem Ipsum is simply dummy text of the printing and typesetting industry. - Lorem Ipsum has been the industry's standard dummy text ever since the - 1500s, when an unknown printer took a galley of type and scrambled it to - make a type specimen book -

    - -
    • -
  • -

    - Lorem Ipsum is simply dummy text of the printing and typesetting industry. - Lorem Ipsum has been the industry's standard dummy text ever since the - 1500s, when an unknown printer took a galley of type and scrambled it to - make a type specimen book -

    -
    • -
- -
- Vertical divider -
    -
  • -

    - Lorem Ipsum is simply dummy text of the printing and typesetting - industry. Lorem Ipsum has been the industry's standard dummy text ever - since the 1500s, when an unknown printer took a galley of type and - scrambled it to make a type specimen book -

    - -
    • -
  • -

    - Lorem Ipsum is simply dummy text of the printing and typesetting - industry. Lorem Ipsum has been the industry's standard dummy text ever - since the 1500s, when an unknown printer took a galley of type and - scrambled it to make a type specimen book -

    - -
    • -
  • -

    - Lorem Ipsum is simply dummy text of the printing and typesetting - industry. Lorem Ipsum has been the industry's standard dummy text ever - since the 1500s, when an unknown printer took a galley of type and - scrambled it to make a type specimen book -

    -
    • -
-
diff --git a/projects/docs/src/app/examples/divider/show-case-divider/show-case-divider.component.ts b/projects/docs/src/app/examples/divider/show-case-divider/show-case-divider.component.ts deleted file mode 100644 index c9f60a9..0000000 --- a/projects/docs/src/app/examples/divider/show-case-divider/show-case-divider.component.ts +++ /dev/null @@ -1,10 +0,0 @@ -import { DividerComponent } from '@/ui/divider/divider.component'; -import { Component } from '@angular/core'; - -@Component({ - selector: 'doc-show-case-divider', - imports: [DividerComponent], - templateUrl: './show-case-divider.component.html', - styleUrl: './show-case-divider.component.css', -}) -export class ShowCaseDividerComponent {} diff --git a/projects/docs/src/app/examples/drawer/show-case-drawer/show-case-drawer.component.css b/projects/docs/src/app/examples/drawer/show-case-drawer/show-case-drawer.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/projects/docs/src/app/examples/drawer/show-case-drawer/show-case-drawer.component.html b/projects/docs/src/app/examples/drawer/show-case-drawer/show-case-drawer.component.html deleted file mode 100644 index 7d0a0cc..0000000 --- a/projects/docs/src/app/examples/drawer/show-case-drawer/show-case-drawer.component.html +++ /dev/null @@ -1 +0,0 @@ - diff --git a/projects/docs/src/app/examples/drawer/show-case-drawer/show-case-drawer.component.ts b/projects/docs/src/app/examples/drawer/show-case-drawer/show-case-drawer.component.ts deleted file mode 100644 index 27293e4..0000000 --- a/projects/docs/src/app/examples/drawer/show-case-drawer/show-case-drawer.component.ts +++ /dev/null @@ -1,65 +0,0 @@ -import { ButtonComponent } from '@/ui/button/button.component'; -import { CheckboxComponent } from '@/ui/checkbox/checkbox.component'; -import { DrawerCloseDirective } from '@/ui/drawer/drawer-close.directive'; -import { DRAWER_DATA } from '@/ui/drawer/drawer-ref'; -import { DrawerService } from '@/ui/drawer/drawer.service'; -import { ChangeDetectionStrategy, Component, inject } from '@angular/core'; -import { ReactiveFormsModule } from '@angular/forms'; - -@Component({ - selector: 'doc-show-case-drawer', - imports: [ButtonComponent], - templateUrl: './show-case-drawer.component.html', - styleUrl: './show-case-drawer.component.css', -}) -export class ShowCaseDrawerComponent { - drawerService = inject(DrawerService); - - open() { - this.drawerService.open(DrawerTestComponent, { - title: 'Edit Notification', - data: { - name: 'John Doe', - }, - }); - } -} - -@Component({ - selector: 'doc-drawer-test', - imports: [ - DrawerCloseDirective, - ButtonComponent, - ReactiveFormsModule, - CheckboxComponent, - ], - styles: ` - .footer { - display: flex; - justify-content: space-between; - margin-top: 12px; - } - - form { - display: flex; - flex-direction: column; - row-gap: 12px; - } - `, - template: `
-

Hello {{ data.name }}

- Receive newsletter - Allow data analytics - Enable push notifications -
- - -
-
`, - changeDetection: ChangeDetectionStrategy.OnPush, -}) -export class DrawerTestComponent { - data = inject<{ name: string }>(DRAWER_DATA); -} diff --git a/projects/docs/src/app/examples/form-field/show-case-form-field/show-case-form-field.component.css b/projects/docs/src/app/examples/form-field/show-case-form-field/show-case-form-field.component.css deleted file mode 100644 index 5d3da28..0000000 --- a/projects/docs/src/app/examples/form-field/show-case-form-field/show-case-form-field.component.css +++ /dev/null @@ -1,4 +0,0 @@ -.show-case { - margin: 0 auto; - width: 250px; -} diff --git a/projects/docs/src/app/examples/form-field/show-case-form-field/show-case-form-field.component.html b/projects/docs/src/app/examples/form-field/show-case-form-field/show-case-form-field.component.html deleted file mode 100644 index 0c031cd..0000000 --- a/projects/docs/src/app/examples/form-field/show-case-form-field/show-case-form-field.component.html +++ /dev/null @@ -1,34 +0,0 @@ -
- - First Name - - - - Last Name - - @if (group.controls.lastName.errors?.['required']) { - Lastname is important please fill - } - - - Email - - - - Age - - - - Country - - @for (country of countries; track $index) { - {{ country.name }} - } - - - -
diff --git a/projects/docs/src/app/examples/form-field/show-case-form-field/show-case-form-field.component.ts b/projects/docs/src/app/examples/form-field/show-case-form-field/show-case-form-field.component.ts deleted file mode 100644 index a766343..0000000 --- a/projects/docs/src/app/examples/form-field/show-case-form-field/show-case-form-field.component.ts +++ /dev/null @@ -1,72 +0,0 @@ -import { ButtonComponent } from '@/ui/button/button.component'; -import { DialogService } from '@/ui/dialog/dialog.service'; -import { ErrorComponent } from '@/ui/form-field/error/error.component'; -import { FormFieldErrorRegistry } from '@/ui/form-field/form-field-error.registry'; -import { FormFieldComponent } from '@/ui/form-field/form-field.component'; -import { LabelComponent } from '@/ui/form-field/label/label.component'; -import { InputDirective } from '@/ui/input/input.directive'; -import { OptionComponent } from '@/ui/select/option.component'; -import { SelectComponent } from '@/ui/select/select.component'; -import { Component, effect, inject } from '@angular/core'; -import { FormBuilder, ReactiveFormsModule, Validators } from '@angular/forms'; - -@Component({ - selector: 'doc-show-case-form-field', - imports: [ - FormFieldComponent, - LabelComponent, - InputDirective, - ReactiveFormsModule, - ButtonComponent, - ErrorComponent, - SelectComponent, - OptionComponent, - ], - templateUrl: './show-case-form-field.component.html', - styleUrl: './show-case-form-field.component.css', -}) -export class ShowCaseFormFieldComponent { - formBuilder = inject(FormBuilder); - dialog = inject(DialogService); - private formFieldErrorRegistry = inject(FormFieldErrorRegistry); - - group = this.formBuilder.group({ - firstName: ['', Validators.required], - lastName: ['', Validators.required], - email: ['', Validators.compose([Validators.required, Validators.email])], - age: ['', Validators.compose([Validators.required, Validators.min(10)])], - country: [undefined, Validators.required], - }); - - countries = [ - { code: 'KA', name: 'Georgia' }, - { code: 'CA', name: 'Canada' }, - { code: 'GB', name: 'United Kingdom' }, - { code: 'DE', name: 'Germany' }, - { code: 'FR', name: 'France' }, - { code: 'JP', name: 'Japan' }, - { code: 'AU', name: 'Australia' }, - { code: 'IT', name: 'Italy' }, - { code: 'ES', name: 'Spain' }, - { code: 'CN', name: 'China' }, - ]; - - constructor() { - this.formFieldErrorRegistry.addErrors({ - min: (error) => - `Min value is ${error.min}, but your value is ${error.actual}`, - }); - - effect(() => { - const cont = this.group.controls.lastName; - console.log(cont.errors?.['required']); - }); - } - - register() { - this.dialog.alert({ - title: 'Registration', - description: 'User registered successfully', - }); - } -} diff --git a/projects/docs/src/app/examples/icon/show-case-icon/show-case-icon.component.css b/projects/docs/src/app/examples/icon/show-case-icon/show-case-icon.component.css deleted file mode 100644 index f94669e..0000000 --- a/projects/docs/src/app/examples/icon/show-case-icon/show-case-icon.component.css +++ /dev/null @@ -1,34 +0,0 @@ -.show-case { - display: flex; - gap: 8px; - flex-direction: column; - - .header { - display: flex; - align-items: center; - gap: 10px; - } - - .body { - display: flex; - flex-wrap: wrap; - gap: 10px; - } -} - -.bird { -} - -.cat { -} - -.heart { -} -.paw { -} - -.squirrel { -} - -.volleyball { -} diff --git a/projects/docs/src/app/examples/icon/show-case-icon/show-case-icon.component.html b/projects/docs/src/app/examples/icon/show-case-icon/show-case-icon.component.html deleted file mode 100644 index b452a7c..0000000 --- a/projects/docs/src/app/examples/icon/show-case-icon/show-case-icon.component.html +++ /dev/null @@ -1,23 +0,0 @@ -
-
- - -
-
- @for (icon of icons; track $index) { - - } -
-
diff --git a/projects/docs/src/app/examples/icon/show-case-icon/show-case-icon.component.ts b/projects/docs/src/app/examples/icon/show-case-icon/show-case-icon.component.ts deleted file mode 100644 index f5df1cd..0000000 --- a/projects/docs/src/app/examples/icon/show-case-icon/show-case-icon.component.ts +++ /dev/null @@ -1,23 +0,0 @@ -import { IconComponent } from '@/ui/icon/icon.component'; -import { IconRegistry } from '@/ui/icon/icon.registry'; -import { Component, inject, model } from '@angular/core'; -import { FormsModule } from '@angular/forms'; - -@Component({ - selector: 'doc-show-case-icon', - imports: [IconComponent, FormsModule], - templateUrl: './show-case-icon.component.html', - styleUrl: './show-case-icon.component.css', -}) -export class ShowCaseIconComponent { - iconRegistry = inject(IconRegistry); - icons = ['bird', 'cat', 'heart', 'paw', 'squirrel', 'volleyball']; - size = model(20); - color = model('#00000'); - - constructor() { - for (const icon of this.icons) { - this.iconRegistry.addIcon(icon, `/show-case-icon/${icon}.svg`); - } - } -} diff --git a/projects/docs/src/app/examples/input/show-case-input/show-case-input.component.css b/projects/docs/src/app/examples/input/show-case-input/show-case-input.component.css deleted file mode 100644 index 47cee80..0000000 --- a/projects/docs/src/app/examples/input/show-case-input/show-case-input.component.css +++ /dev/null @@ -1,17 +0,0 @@ -.show-case { - display: flex; - flex-direction: column; - width: 250px; - margin: 0 auto; - gap: 20px; - - > * { - width: 100%; - } -} - -.age-container { - display: flex; - align-items: center; - gap: 6px; -} diff --git a/projects/docs/src/app/examples/input/show-case-input/show-case-input.component.html b/projects/docs/src/app/examples/input/show-case-input/show-case-input.component.html deleted file mode 100644 index a372acf..0000000 --- a/projects/docs/src/app/examples/input/show-case-input/show-case-input.component.html +++ /dev/null @@ -1,23 +0,0 @@ -
- - -
- Age - -
-
diff --git a/projects/docs/src/app/examples/input/show-case-input/show-case-input.component.ts b/projects/docs/src/app/examples/input/show-case-input/show-case-input.component.ts deleted file mode 100644 index a36e913..0000000 --- a/projects/docs/src/app/examples/input/show-case-input/show-case-input.component.ts +++ /dev/null @@ -1,16 +0,0 @@ -import { CheckboxComponent } from '@/ui/checkbox/checkbox.component'; -import { InputDirective } from '@/ui/input/input.directive'; -import { Component, model } from '@angular/core'; -import { FormsModule } from '@angular/forms'; - -@Component({ - selector: 'doc-show-case-input', - imports: [InputDirective, FormsModule, CheckboxComponent, FormsModule], - templateUrl: './show-case-input.component.html', - styleUrl: './show-case-input.component.css', -}) -export class ShowCaseInputComponent { - username = model(); - password = model(); - age = model(false); -} diff --git a/projects/docs/src/app/examples/loader/show-case-loader/show-case-loader.component.css b/projects/docs/src/app/examples/loader/show-case-loader/show-case-loader.component.css deleted file mode 100644 index 48f4c54..0000000 --- a/projects/docs/src/app/examples/loader/show-case-loader/show-case-loader.component.css +++ /dev/null @@ -1,21 +0,0 @@ -.show-case { - display: flex; - flex-wrap: wrap; - justify-content: center; - gap: 10px; -} - -.infinite-loader { - display: flex; - align-items: center; - justify-content: center; -} - -app-card { - width: 200px; -} - -input, -button { - width: 100%; -} diff --git a/projects/docs/src/app/examples/loader/show-case-loader/show-case-loader.component.html b/projects/docs/src/app/examples/loader/show-case-loader/show-case-loader.component.html deleted file mode 100644 index c8df3d3..0000000 --- a/projects/docs/src/app/examples/loader/show-case-loader/show-case-loader.component.html +++ /dev/null @@ -1,19 +0,0 @@ -
- - - - - - - - - - - - @if (showLoader()) { - - } - -
diff --git a/projects/docs/src/app/examples/loader/show-case-loader/show-case-loader.component.ts b/projects/docs/src/app/examples/loader/show-case-loader/show-case-loader.component.ts deleted file mode 100644 index 92b7820..0000000 --- a/projects/docs/src/app/examples/loader/show-case-loader/show-case-loader.component.ts +++ /dev/null @@ -1,31 +0,0 @@ -import { ButtonComponent } from '@/ui/button/button.component'; -import { CardComponent } from '@/ui/card/card.component'; -import { FormFieldComponent } from '@/ui/form-field/form-field.component'; -import { InputDirective } from '@/ui/input/input.directive'; -import { LoaderComponent } from '@/ui/loader/loader.component'; -import { ChangeDetectionStrategy, Component, signal } from '@angular/core'; - -@Component({ - selector: 'doc-show-case-loader', - imports: [ - LoaderComponent, - ButtonComponent, - FormFieldComponent, - InputDirective, - ButtonComponent, - CardComponent, - ], - templateUrl: './show-case-loader.component.html', - styleUrl: './show-case-loader.component.css', - changeDetection: ChangeDetectionStrategy.OnPush, -}) -export class ShowCaseLoaderComponent { - showLoader = signal(false); - - show() { - this.showLoader.set(true); - setTimeout(() => { - this.showLoader.set(false); - }, 3000); - } -} diff --git a/projects/docs/src/app/examples/local-storage/show-case-local-storage/show-case-local-storage.component.css b/projects/docs/src/app/examples/local-storage/show-case-local-storage/show-case-local-storage.component.css deleted file mode 100644 index f8fcd92..0000000 --- a/projects/docs/src/app/examples/local-storage/show-case-local-storage/show-case-local-storage.component.css +++ /dev/null @@ -1,6 +0,0 @@ -.buttons { - display: flex; - align-items: center; - gap: 10px; - margin-bottom: 12px; -} diff --git a/projects/docs/src/app/examples/local-storage/show-case-local-storage/show-case-local-storage.component.html b/projects/docs/src/app/examples/local-storage/show-case-local-storage/show-case-local-storage.component.html deleted file mode 100644 index bfac01a..0000000 --- a/projects/docs/src/app/examples/local-storage/show-case-local-storage/show-case-local-storage.component.html +++ /dev/null @@ -1,20 +0,0 @@ -
-
- - - -
-

- {{ dateValue() }} -

-
diff --git a/projects/docs/src/app/examples/local-storage/show-case-local-storage/show-case-local-storage.component.ts b/projects/docs/src/app/examples/local-storage/show-case-local-storage/show-case-local-storage.component.ts deleted file mode 100644 index 63169f9..0000000 --- a/projects/docs/src/app/examples/local-storage/show-case-local-storage/show-case-local-storage.component.ts +++ /dev/null @@ -1,37 +0,0 @@ -import { ButtonComponent } from '@/ui/button/button.component'; -import { - ChangeDetectionStrategy, - Component, - inject, - OnDestroy, - signal, -} from '@angular/core'; -import { LocalStorageService } from '@ngverse/kit'; -const STORAGE_KEY = 'current-date'; - -@Component({ - selector: 'doc-show-case-local-storage', - imports: [ButtonComponent], - templateUrl: './show-case-local-storage.component.html', - styleUrl: './show-case-local-storage.component.css', - changeDetection: ChangeDetectionStrategy.OnPush, -}) -export class ShowCaseLocalStorageComponent implements OnDestroy { - private localStorageService = inject(LocalStorageService); - dateValue = signal(undefined); - - store() { - this.localStorageService.setItem(STORAGE_KEY, new Date().toString()); - } - - read() { - const date = this.localStorageService.getItem(STORAGE_KEY); - if (date) { - this.dateValue.set(date); - } - } - - ngOnDestroy(): void { - this.localStorageService.removeItem(STORAGE_KEY); - } -} diff --git a/projects/docs/src/app/examples/otp-input/show-case-otp-input/show-case-otp-input.component.css b/projects/docs/src/app/examples/otp-input/show-case-otp-input/show-case-otp-input.component.css deleted file mode 100644 index b808185..0000000 --- a/projects/docs/src/app/examples/otp-input/show-case-otp-input/show-case-otp-input.component.css +++ /dev/null @@ -1,7 +0,0 @@ -.show-case { - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; - gap: 8px; -} diff --git a/projects/docs/src/app/examples/otp-input/show-case-otp-input/show-case-otp-input.component.html b/projects/docs/src/app/examples/otp-input/show-case-otp-input/show-case-otp-input.component.html deleted file mode 100644 index 56cc238..0000000 --- a/projects/docs/src/app/examples/otp-input/show-case-otp-input/show-case-otp-input.component.html +++ /dev/null @@ -1,6 +0,0 @@ -
- - -
diff --git a/projects/docs/src/app/examples/otp-input/show-case-otp-input/show-case-otp-input.component.ts b/projects/docs/src/app/examples/otp-input/show-case-otp-input/show-case-otp-input.component.ts deleted file mode 100644 index d191050..0000000 --- a/projects/docs/src/app/examples/otp-input/show-case-otp-input/show-case-otp-input.component.ts +++ /dev/null @@ -1,32 +0,0 @@ -import { ButtonComponent } from '@/ui/button/button.component'; -import { OtpInputComponent } from '@/ui/otp-input/otp-input.component'; -import { ToastService } from '@/ui/toast/toast.service'; -import { Component, inject, signal, viewChild } from '@angular/core'; - -@Component({ - selector: 'doc-show-case-otp-input', - imports: [OtpInputComponent, ButtonComponent], - templateUrl: './show-case-otp-input.component.html', - styleUrl: './show-case-otp-input.component.css', -}) -export class ShowCaseOtpInputComponent { - loading = signal(false); - otpInput = viewChild.required(OtpInputComponent); - toast = inject(ToastService); - - codeFilled(code: string) { - this.toast.open({ - message: `Code filled: ${code}`, - showCloseIcon: false, - }); - } - - recieveCode() { - this.loading.set(true); - - setTimeout(() => { - this.otpInput().fillFromText('1234'); - this.loading.set(false); - }, 1000); - } -} diff --git a/projects/docs/src/app/examples/pagination/show-case-pagination/show-case-pagination.component.css b/projects/docs/src/app/examples/pagination/show-case-pagination/show-case-pagination.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/projects/docs/src/app/examples/pagination/show-case-pagination/show-case-pagination.component.html b/projects/docs/src/app/examples/pagination/show-case-pagination/show-case-pagination.component.html deleted file mode 100644 index c43d82e..0000000 --- a/projects/docs/src/app/examples/pagination/show-case-pagination/show-case-pagination.component.html +++ /dev/null @@ -1,5 +0,0 @@ - diff --git a/projects/docs/src/app/examples/pagination/show-case-pagination/show-case-pagination.component.ts b/projects/docs/src/app/examples/pagination/show-case-pagination/show-case-pagination.component.ts deleted file mode 100644 index 962ff31..0000000 --- a/projects/docs/src/app/examples/pagination/show-case-pagination/show-case-pagination.component.ts +++ /dev/null @@ -1,18 +0,0 @@ -import { PaginationComponent } from '@/ui/pagination/pagination.component'; -import { ChangeDetectionStrategy, Component, signal } from '@angular/core'; - -@Component({ - selector: 'doc-show-case-pagination', - imports: [PaginationComponent], - templateUrl: './show-case-pagination.component.html', - styleUrl: './show-case-pagination.component.css', - changeDetection: ChangeDetectionStrategy.OnPush, -}) -export class ShowCasePaginationComponent { - currentPage = signal(1); - totalPages = signal(10); - - setPage(page: number) { - this.currentPage.set(page); - } -} diff --git a/projects/docs/src/app/examples/popover/show-case-popover/show-case-popover.component.css b/projects/docs/src/app/examples/popover/show-case-popover/show-case-popover.component.css deleted file mode 100644 index e35d9d2..0000000 --- a/projects/docs/src/app/examples/popover/show-case-popover/show-case-popover.component.css +++ /dev/null @@ -1,11 +0,0 @@ -.popover { - padding: 10px; - width: 200px; -} -.popover-actions { - margin-top: 10px; - display: flex; - gap: 6px; - align-items: center; - justify-content: end; -} diff --git a/projects/docs/src/app/examples/popover/show-case-popover/show-case-popover.component.html b/projects/docs/src/app/examples/popover/show-case-popover/show-case-popover.component.html deleted file mode 100644 index 8e2b24e..0000000 --- a/projects/docs/src/app/examples/popover/show-case-popover/show-case-popover.component.html +++ /dev/null @@ -1,36 +0,0 @@ - - - -
-

Are you sure you want to do this?

-
- - -
-
- - diff --git a/projects/docs/src/app/examples/popover/show-case-popover/show-case-popover.component.ts b/projects/docs/src/app/examples/popover/show-case-popover/show-case-popover.component.ts deleted file mode 100644 index 1d2a3f1..0000000 --- a/projects/docs/src/app/examples/popover/show-case-popover/show-case-popover.component.ts +++ /dev/null @@ -1,22 +0,0 @@ -import { ButtonComponent } from '@/ui/button/button.component'; -import { ChangeDetectionStrategy, Component, signal } from '@angular/core'; -import { PopoverComponent, PopoverOriginDirective } from '@ngverse/kit'; - -@Component({ - selector: 'doc-show-case-popover', - imports: [PopoverOriginDirective, ButtonComponent, PopoverComponent], - templateUrl: './show-case-popover.component.html', - styleUrl: './show-case-popover.component.css', - changeDetection: ChangeDetectionStrategy.OnPush, -}) -export class ShowCasePopoverComponent { - isOpen = signal(false); - toggle() { - this.isOpen.update((isOpen) => !isOpen); - } - - deleteUser() { - alert('User deleted'); - this.isOpen.set(false); - } -} diff --git a/projects/docs/src/app/examples/progress-bar/show-case-progress-bar/show-case-progress-bar.component.css b/projects/docs/src/app/examples/progress-bar/show-case-progress-bar/show-case-progress-bar.component.css deleted file mode 100644 index 64f8b56..0000000 --- a/projects/docs/src/app/examples/progress-bar/show-case-progress-bar/show-case-progress-bar.component.css +++ /dev/null @@ -1,5 +0,0 @@ -.show-case { - display: flex; - flex-direction: column; - gap: 12px; -} diff --git a/projects/docs/src/app/examples/progress-bar/show-case-progress-bar/show-case-progress-bar.component.html b/projects/docs/src/app/examples/progress-bar/show-case-progress-bar/show-case-progress-bar.component.html deleted file mode 100644 index 15236e1..0000000 --- a/projects/docs/src/app/examples/progress-bar/show-case-progress-bar/show-case-progress-bar.component.html +++ /dev/null @@ -1,10 +0,0 @@ -
-
-

Determinate

- -
-
-

Indeterminate

- -
-
diff --git a/projects/docs/src/app/examples/progress-bar/show-case-progress-bar/show-case-progress-bar.component.ts b/projects/docs/src/app/examples/progress-bar/show-case-progress-bar/show-case-progress-bar.component.ts deleted file mode 100644 index eca510b..0000000 --- a/projects/docs/src/app/examples/progress-bar/show-case-progress-bar/show-case-progress-bar.component.ts +++ /dev/null @@ -1,22 +0,0 @@ -import { ProgressBarComponent } from '@/ui/progress-bar/progress-bar.component'; -import { Platform } from '@angular/cdk/platform'; -import { afterNextRender, Component, inject, signal } from '@angular/core'; - -@Component({ - selector: 'doc-show-case-progress-bar', - imports: [ProgressBarComponent], - templateUrl: './show-case-progress-bar.component.html', - styleUrl: './show-case-progress-bar.component.css', -}) -export class ShowCaseProgressBarComponent { - value = signal(0); - platform = inject(Platform); - - constructor() { - afterNextRender(() => { - setInterval(() => { - this.value.update((val) => val + 10); - }, 1000); - }); - } -} diff --git a/projects/docs/src/app/examples/radio-button/show-case-radio-button/show-case-radio-button.component.css b/projects/docs/src/app/examples/radio-button/show-case-radio-button/show-case-radio-button.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/projects/docs/src/app/examples/radio-button/show-case-radio-button/show-case-radio-button.component.html b/projects/docs/src/app/examples/radio-button/show-case-radio-button/show-case-radio-button.component.html deleted file mode 100644 index 720ce39..0000000 --- a/projects/docs/src/app/examples/radio-button/show-case-radio-button/show-case-radio-button.component.html +++ /dev/null @@ -1,5 +0,0 @@ - - @for (item of values; track $index) { - {{ item.firstName }} - } - diff --git a/projects/docs/src/app/examples/radio-button/show-case-radio-button/show-case-radio-button.component.ts b/projects/docs/src/app/examples/radio-button/show-case-radio-button/show-case-radio-button.component.ts deleted file mode 100644 index c6afffb..0000000 --- a/projects/docs/src/app/examples/radio-button/show-case-radio-button/show-case-radio-button.component.ts +++ /dev/null @@ -1,37 +0,0 @@ -import { RadioButtonComponent } from '@/ui/radio-button/radio-button.component'; -import { RadioGroupComponent } from '@/ui/radio-button/radio-group.component'; -import { Component, model } from '@angular/core'; -import { FormsModule, ReactiveFormsModule } from '@angular/forms'; - -@Component({ - selector: 'doc-show-case-radio-button', - imports: [ - RadioButtonComponent, - RadioGroupComponent, - ReactiveFormsModule, - FormsModule, - ], - templateUrl: './show-case-radio-button.component.html', - styleUrl: './show-case-radio-button.component.css', -}) -export class ShowCaseRadioButtonComponent { - values = [ - { - firstName: 'Apple', - price: 30, - }, - { - firstName: 'Orange', - price: 70, - }, - { - firstName: 'Cherry', - price: 100, - }, - ]; - val = model(this.values[0]); - - compare(o1: { price: number }, o2: { price: number }) { - return o1?.price === o2.price; - } -} diff --git a/projects/docs/src/app/examples/select/show-case-select/show-case-select.component.css b/projects/docs/src/app/examples/select/show-case-select/show-case-select.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/projects/docs/src/app/examples/select/show-case-select/show-case-select.component.html b/projects/docs/src/app/examples/select/show-case-select/show-case-select.component.html deleted file mode 100644 index 30d10cb..0000000 --- a/projects/docs/src/app/examples/select/show-case-select/show-case-select.component.html +++ /dev/null @@ -1,38 +0,0 @@ -

Single select

- - @for (option of countries; track $index) { - {{ option.name }} - } - - -

Multiple select

- - @for (option of countries; track $index) { - {{ option.name }} - } - - -

Directories

- - @for (dir of directories; track $index) { - - {{ dir.name }} - @for (file of dir.files; track $index) { - {{ file.name }} - } - - } - diff --git a/projects/docs/src/app/examples/select/show-case-select/show-case-select.component.ts b/projects/docs/src/app/examples/select/show-case-select/show-case-select.component.ts deleted file mode 100644 index 74fd288..0000000 --- a/projects/docs/src/app/examples/select/show-case-select/show-case-select.component.ts +++ /dev/null @@ -1,76 +0,0 @@ -import { OptionGroupLabelComponent } from '@/ui/select/option-group-label.component'; -import { OptionGroupComponent } from '@/ui/select/option-group.component'; -import { OptionComponent } from '@/ui/select/option.component'; -import { SelectComponent } from '@/ui/select/select.component'; -import { Component } from '@angular/core'; -import { FormControl, ReactiveFormsModule, Validators } from '@angular/forms'; -const countries = [ - { code: 'KA', name: 'Georgia' }, - { code: 'US', name: 'United States' }, - { code: 'CA', name: 'Canada' }, - { code: 'GB', name: 'United Kingdom' }, - { code: 'DE', name: 'Germany' }, - { code: 'FR', name: 'France' }, - { code: 'JP', name: 'Japan' }, - { code: 'AU', name: 'Australia' }, - { code: 'IT', name: 'Italy' }, - { code: 'ES', name: 'Spain' }, - { code: 'CN', name: 'China' }, - { code: 'IN', name: 'India' }, - { code: 'BR', name: 'Brazil' }, - { code: 'ZA', name: 'South Africa' }, - { code: 'RU', name: 'Russia' }, - { code: 'MX', name: 'Mexico' }, - { code: 'KR', name: 'South Korea' }, - { code: 'AR', name: 'Argentina' }, - { code: 'SA', name: 'Saudi Arabia' }, - { code: 'NG', name: 'Nigeria' }, - { code: 'EG', name: 'Egypt' }, -]; - -const directories = [ - { - name: 'Documents', - files: [ - { - name: 'Profile Picture', - }, - { - name: 'Work File', - }, - ], - }, - { - name: 'Downloads', - files: [ - { - name: 'The Dark Knight', - }, - { - name: 'Joker', - }, - ], - }, -]; - -@Component({ - selector: 'doc-show-case-select', - imports: [ - SelectComponent, - ReactiveFormsModule, - OptionComponent, - OptionGroupComponent, - OptionGroupLabelComponent, - ], - templateUrl: './show-case-select.component.html', - styleUrl: './show-case-select.component.css', -}) -export class ShowCaseSelectComponent { - countries = countries; - directories = directories; - formControlSingle = new FormControl(null, Validators.required); - - formControlMulti = new FormControl(['US', 'CA'], Validators.required); - - dirFormControl = new FormControl(null); -} diff --git a/projects/docs/src/app/examples/session-storage/show-case-session-storage/show-case-session-storage.component.css b/projects/docs/src/app/examples/session-storage/show-case-session-storage/show-case-session-storage.component.css deleted file mode 100644 index f8fcd92..0000000 --- a/projects/docs/src/app/examples/session-storage/show-case-session-storage/show-case-session-storage.component.css +++ /dev/null @@ -1,6 +0,0 @@ -.buttons { - display: flex; - align-items: center; - gap: 10px; - margin-bottom: 12px; -} diff --git a/projects/docs/src/app/examples/session-storage/show-case-session-storage/show-case-session-storage.component.html b/projects/docs/src/app/examples/session-storage/show-case-session-storage/show-case-session-storage.component.html deleted file mode 100644 index bfac01a..0000000 --- a/projects/docs/src/app/examples/session-storage/show-case-session-storage/show-case-session-storage.component.html +++ /dev/null @@ -1,20 +0,0 @@ -
-
- - - -
-

- {{ dateValue() }} -

-
diff --git a/projects/docs/src/app/examples/session-storage/show-case-session-storage/show-case-session-storage.component.ts b/projects/docs/src/app/examples/session-storage/show-case-session-storage/show-case-session-storage.component.ts deleted file mode 100644 index f2b9fb7..0000000 --- a/projects/docs/src/app/examples/session-storage/show-case-session-storage/show-case-session-storage.component.ts +++ /dev/null @@ -1,37 +0,0 @@ -import { ButtonComponent } from '@/ui/button/button.component'; -import { - ChangeDetectionStrategy, - Component, - inject, - OnDestroy, - signal, -} from '@angular/core'; -import { SessionStorageService } from '@ngverse/kit'; -const STORAGE_KEY = 'current-date'; - -@Component({ - selector: 'doc-show-case-session-storage', - imports: [ButtonComponent], - templateUrl: './show-case-session-storage.component.html', - styleUrl: './show-case-session-storage.component.css', - changeDetection: ChangeDetectionStrategy.OnPush, -}) -export class ShowCaseSessionStorageComponent implements OnDestroy { - private sessionStorageService = inject(SessionStorageService); - dateValue = signal(undefined); - - store() { - this.sessionStorageService.setItem(STORAGE_KEY, new Date().toString()); - } - - read() { - const date = this.sessionStorageService.getItem(STORAGE_KEY); - if (date) { - this.dateValue.set(date); - } - } - - ngOnDestroy(): void { - this.sessionStorageService.removeItem(STORAGE_KEY); - } -} diff --git a/projects/docs/src/app/examples/skeleton/show-case-skeleton/show-case-skeleton.component.css b/projects/docs/src/app/examples/skeleton/show-case-skeleton/show-case-skeleton.component.css deleted file mode 100644 index ed67560..0000000 --- a/projects/docs/src/app/examples/skeleton/show-case-skeleton/show-case-skeleton.component.css +++ /dev/null @@ -1,5 +0,0 @@ -.profile-skeleton { - border-radius: 100%; - width: 60px; - height: 60px; -} diff --git a/projects/docs/src/app/examples/skeleton/show-case-skeleton/show-case-skeleton.component.html b/projects/docs/src/app/examples/skeleton/show-case-skeleton/show-case-skeleton.component.html deleted file mode 100644 index 6b652f4..0000000 --- a/projects/docs/src/app/examples/skeleton/show-case-skeleton/show-case-skeleton.component.html +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/projects/docs/src/app/examples/skeleton/show-case-skeleton/show-case-skeleton.component.ts b/projects/docs/src/app/examples/skeleton/show-case-skeleton/show-case-skeleton.component.ts deleted file mode 100644 index 034f84d..0000000 --- a/projects/docs/src/app/examples/skeleton/show-case-skeleton/show-case-skeleton.component.ts +++ /dev/null @@ -1,10 +0,0 @@ -import { SkeletonComponent } from '@/ui/skeleton/skeleton.component'; -import { Component } from '@angular/core'; - -@Component({ - selector: 'doc-show-case-skeleton', - imports: [SkeletonComponent], - templateUrl: './show-case-skeleton.component.html', - styleUrl: './show-case-skeleton.component.css', -}) -export class ShowCaseSkeletonComponent {} diff --git a/projects/docs/src/app/examples/switch/show-case-switch/show-case-switch.component.css b/projects/docs/src/app/examples/switch/show-case-switch/show-case-switch.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/projects/docs/src/app/examples/switch/show-case-switch/show-case-switch.component.html b/projects/docs/src/app/examples/switch/show-case-switch/show-case-switch.component.html deleted file mode 100644 index a160e1f..0000000 --- a/projects/docs/src/app/examples/switch/show-case-switch/show-case-switch.component.html +++ /dev/null @@ -1 +0,0 @@ - Turn On diff --git a/projects/docs/src/app/examples/switch/show-case-switch/show-case-switch.component.ts b/projects/docs/src/app/examples/switch/show-case-switch/show-case-switch.component.ts deleted file mode 100644 index 79f6af7..0000000 --- a/projects/docs/src/app/examples/switch/show-case-switch/show-case-switch.component.ts +++ /dev/null @@ -1,18 +0,0 @@ -import { SwitchComponent } from '@/ui/switch/switch.component'; -import { Component } from '@angular/core'; -import { - FormControl, - FormsModule, - ReactiveFormsModule, - Validators, -} from '@angular/forms'; - -@Component({ - selector: 'doc-show-case-switch', - imports: [SwitchComponent, ReactiveFormsModule, FormsModule], - templateUrl: './show-case-switch.component.html', - styleUrl: './show-case-switch.component.css', -}) -export class ShowCaseSwitchComponent { - formControl = new FormControl(null, Validators.requiredTrue); -} diff --git a/projects/docs/src/app/examples/tab/lazy-tab/lazy-tab.component.css b/projects/docs/src/app/examples/tab/lazy-tab/lazy-tab.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/projects/docs/src/app/examples/tab/lazy-tab/lazy-tab.component.html b/projects/docs/src/app/examples/tab/lazy-tab/lazy-tab.component.html deleted file mode 100644 index 1f289c2..0000000 --- a/projects/docs/src/app/examples/tab/lazy-tab/lazy-tab.component.html +++ /dev/null @@ -1 +0,0 @@ -

This body is rendered on demand, enjoy! current time : {{ time }}

diff --git a/projects/docs/src/app/examples/tab/lazy-tab/lazy-tab.component.ts b/projects/docs/src/app/examples/tab/lazy-tab/lazy-tab.component.ts deleted file mode 100644 index 68af900..0000000 --- a/projects/docs/src/app/examples/tab/lazy-tab/lazy-tab.component.ts +++ /dev/null @@ -1,11 +0,0 @@ -import { ChangeDetectionStrategy, Component } from '@angular/core'; - -@Component({ - selector: 'doc-lazy-tab', - templateUrl: './lazy-tab.component.html', - styleUrl: './lazy-tab.component.css', - changeDetection: ChangeDetectionStrategy.OnPush, -}) -export class LazyTabComponent { - time = new Date(); -} diff --git a/projects/docs/src/app/examples/tab/show-case-tab/show-case-tab.component.css b/projects/docs/src/app/examples/tab/show-case-tab/show-case-tab.component.css deleted file mode 100644 index 0a0a5c3..0000000 --- a/projects/docs/src/app/examples/tab/show-case-tab/show-case-tab.component.css +++ /dev/null @@ -1,5 +0,0 @@ -.custom-label { - display: flex; - align-items: center; - gap: 3px; -} diff --git a/projects/docs/src/app/examples/tab/show-case-tab/show-case-tab.component.html b/projects/docs/src/app/examples/tab/show-case-tab/show-case-tab.component.html deleted file mode 100644 index 7894481..0000000 --- a/projects/docs/src/app/examples/tab/show-case-tab/show-case-tab.component.html +++ /dev/null @@ -1,17 +0,0 @@ - - This is default tab enjoy! - - -
- Custom Label - -
- - This is Custom Label Tab enjoy! - - - - - - - diff --git a/projects/docs/src/app/examples/tab/show-case-tab/show-case-tab.component.ts b/projects/docs/src/app/examples/tab/show-case-tab/show-case-tab.component.ts deleted file mode 100644 index 2895513..0000000 --- a/projects/docs/src/app/examples/tab/show-case-tab/show-case-tab.component.ts +++ /dev/null @@ -1,23 +0,0 @@ -import { IconComponent } from '@/ui/icon/icon.component'; -import { TabBodyDirective } from '@/ui/tab/tab-body.directive'; -import { TabGroupComponent } from '@/ui/tab/tab-group.component'; -import { TabHeaderDirective } from '@/ui/tab/tab-header.directive'; -import { TabComponent } from '@/ui/tab/tab.component'; -import { ChangeDetectionStrategy, Component } from '@angular/core'; -import { LazyTabComponent } from '../lazy-tab/lazy-tab.component'; - -@Component({ - selector: 'doc-show-case-tab', - imports: [ - TabGroupComponent, - TabComponent, - TabBodyDirective, - TabHeaderDirective, - IconComponent, - LazyTabComponent, - ], - templateUrl: './show-case-tab.component.html', - styleUrl: './show-case-tab.component.css', - changeDetection: ChangeDetectionStrategy.OnPush, -}) -export class ShowCaseTabComponent {} diff --git a/projects/docs/src/app/examples/textarea/show-case-textarea/show-case-textarea.component.css b/projects/docs/src/app/examples/textarea/show-case-textarea/show-case-textarea.component.css deleted file mode 100644 index f4df628..0000000 --- a/projects/docs/src/app/examples/textarea/show-case-textarea/show-case-textarea.component.css +++ /dev/null @@ -1,9 +0,0 @@ -.show-case { - display: flex; - gap: 8px; - flex-direction: column; -} - -.resize-none { - resize: none; -} diff --git a/projects/docs/src/app/examples/textarea/show-case-textarea/show-case-textarea.component.html b/projects/docs/src/app/examples/textarea/show-case-textarea/show-case-textarea.component.html deleted file mode 100644 index be3df96..0000000 --- a/projects/docs/src/app/examples/textarea/show-case-textarea/show-case-textarea.component.html +++ /dev/null @@ -1,17 +0,0 @@ -
- - - -
diff --git a/projects/docs/src/app/examples/textarea/show-case-textarea/show-case-textarea.component.ts b/projects/docs/src/app/examples/textarea/show-case-textarea/show-case-textarea.component.ts deleted file mode 100644 index 21fc3fc..0000000 --- a/projects/docs/src/app/examples/textarea/show-case-textarea/show-case-textarea.component.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { TextareaDirective } from '@/ui/textarea/textarea.directive'; -import { Component, model } from '@angular/core'; -import { FormsModule } from '@angular/forms'; - -@Component({ - selector: 'doc-show-case-textarea', - imports: [TextareaDirective, FormsModule], - templateUrl: './show-case-textarea.component.html', - styleUrl: './show-case-textarea.component.css', -}) -export class ShowCaseTextareaComponent { - title = model(); - - description = model(); -} diff --git a/projects/docs/src/app/examples/toast/show-case-toast/show-case-toast.component.css b/projects/docs/src/app/examples/toast/show-case-toast/show-case-toast.component.css deleted file mode 100644 index 4c70555..0000000 --- a/projects/docs/src/app/examples/toast/show-case-toast/show-case-toast.component.css +++ /dev/null @@ -1,9 +0,0 @@ -.option { - width: 250px; -} - -.configuration { - flex-direction: column; - flex-wrap: wrap; - gap: 8px; -} diff --git a/projects/docs/src/app/examples/toast/show-case-toast/show-case-toast.component.html b/projects/docs/src/app/examples/toast/show-case-toast/show-case-toast.component.html deleted file mode 100644 index 7430014..0000000 --- a/projects/docs/src/app/examples/toast/show-case-toast/show-case-toast.component.html +++ /dev/null @@ -1,25 +0,0 @@ -
-
- - Position - - @for (position of positions; track $index) { - - {{ position.name }} - - } - - - - Type - - @for (type of types; track $index) { - - {{ type }} - - } - - -
- -
diff --git a/projects/docs/src/app/examples/toast/show-case-toast/show-case-toast.component.ts b/projects/docs/src/app/examples/toast/show-case-toast/show-case-toast.component.ts deleted file mode 100644 index 91c4cf6..0000000 --- a/projects/docs/src/app/examples/toast/show-case-toast/show-case-toast.component.ts +++ /dev/null @@ -1,55 +0,0 @@ -import { ButtonComponent } from '@/ui/button/button.component'; -import { FormFieldComponent } from '@/ui/form-field/form-field.component'; -import { LabelComponent } from '@/ui/form-field/label/label.component'; -import { OptionComponent } from '@/ui/select/option.component'; -import { SelectComponent } from '@/ui/select/select.component'; -import { - TOAST_POSITION, - TOAST_TYPE, - ToastService, -} from '@/ui/toast/toast.service'; -import { Component, inject, model } from '@angular/core'; -import { FormsModule } from '@angular/forms'; - -@Component({ - selector: 'doc-show-case-toast', - imports: [ - ButtonComponent, - SelectComponent, - OptionComponent, - FormsModule, - FormFieldComponent, - LabelComponent, - ], - templateUrl: './show-case-toast.component.html', - styleUrl: './show-case-toast.component.css', -}) -export class ShowCaseToastComponent { - toastService = inject(ToastService); - - position = model('bottom_center'); - - positions: { value: TOAST_POSITION; name: string }[] = [ - { value: 'top_left', name: 'Top Left' }, - { value: 'top_center', name: 'Top Center' }, - { value: 'top_right', name: 'Top Right' }, - { value: 'right_center', name: 'Right Center' }, - { value: 'bottom_left', name: 'Bottom Left' }, - { value: 'bottom_center', name: 'Bottom Center' }, - { value: 'left_center', name: 'Left Center' }, - { value: 'right_bottom', name: 'Right Bottom' }, - ]; - - types = ['default', 'success', 'warning', 'danger']; - - type = model('default'); - - showToast() { - this.toastService.open({ - position: this.position(), - type: this.type(), - message: 'Current time is: ' + new Date().toLocaleTimeString(), - closeDelay: 1000, - }); - } -} diff --git a/projects/docs/src/app/examples/tooltip/show-case-tooltip/show-case-tooltip.component.css b/projects/docs/src/app/examples/tooltip/show-case-tooltip/show-case-tooltip.component.css deleted file mode 100644 index e56343f..0000000 --- a/projects/docs/src/app/examples/tooltip/show-case-tooltip/show-case-tooltip.component.css +++ /dev/null @@ -1,12 +0,0 @@ -.tooltips { - display: flex; - align-items: center; - gap: 10px; - flex-wrap: wrap; -} - -.custom-tooltip-content { - display: flex; - align-items: center; - gap: 10px; -} diff --git a/projects/docs/src/app/examples/tooltip/show-case-tooltip/show-case-tooltip.component.html b/projects/docs/src/app/examples/tooltip/show-case-tooltip/show-case-tooltip.component.html deleted file mode 100644 index 38d1645..0000000 --- a/projects/docs/src/app/examples/tooltip/show-case-tooltip/show-case-tooltip.component.html +++ /dev/null @@ -1,34 +0,0 @@ -
- - - - - -
- thanos - I love NgVerse! -
- -
diff --git a/projects/docs/src/app/examples/tooltip/show-case-tooltip/show-case-tooltip.component.ts b/projects/docs/src/app/examples/tooltip/show-case-tooltip/show-case-tooltip.component.ts deleted file mode 100644 index aa01494..0000000 --- a/projects/docs/src/app/examples/tooltip/show-case-tooltip/show-case-tooltip.component.ts +++ /dev/null @@ -1,12 +0,0 @@ -import { ButtonComponent } from '@/ui/button/button.component'; -import { InputDirective } from '@/ui/input/input.directive'; -import { TooltipDirective } from '@/ui/tooltip/tooltip.directive'; -import { Component } from '@angular/core'; - -@Component({ - selector: 'doc-show-case-tooltip', - imports: [TooltipDirective, ButtonComponent, InputDirective], - templateUrl: './show-case-tooltip.component.html', - styleUrl: './show-case-tooltip.component.css', -}) -export class ShowCaseTooltipComponent {} diff --git a/projects/docs/src/app/pages/a11y-accordion-page/a11y-accordion-page.component.ts b/projects/docs/src/app/pages/a11y-accordion-page/a11y-accordion-page.component.ts index 4ac654c..436ac9c 100644 --- a/projects/docs/src/app/pages/a11y-accordion-page/a11y-accordion-page.component.ts +++ b/projects/docs/src/app/pages/a11y-accordion-page/a11y-accordion-page.component.ts @@ -1,10 +1,10 @@ import { ChangeDetectionStrategy, Component } from '@angular/core'; -import { ShowCaseComponent } from '../../blueprint/show-case/show-case.component'; import { ApiSectionComponent } from '../../core/kit-page/api-section/api-section.component'; import { KitPageComponent } from '../../core/kit-page/kit-page.component'; import { ApiSection } from '../../core/kit-page/kit-page.types'; import { OverviewSectionHeaderComponent } from '../../core/kit-page/overview-section/overview-section-header/overview-section-header.component'; import { OverviewSectionComponent } from '../../core/kit-page/overview-section/overview-section.component'; +import { ShowCaseComponent } from "../../core/kit-page/show-case/show-case.component"; import { ShowCaseA11yAccordionComponent } from '../../examples/a11y-accordion/show-case-a11y-accordion/show-case-a11y-accordion.component'; @Component({ diff --git a/projects/docs/src/app/pages/a11y-checkbox-page/a11y-checkbox-page.component.ts b/projects/docs/src/app/pages/a11y-checkbox-page/a11y-checkbox-page.component.ts index 386266f..86b1a45 100644 --- a/projects/docs/src/app/pages/a11y-checkbox-page/a11y-checkbox-page.component.ts +++ b/projects/docs/src/app/pages/a11y-checkbox-page/a11y-checkbox-page.component.ts @@ -1,10 +1,10 @@ import { ChangeDetectionStrategy, Component } from '@angular/core'; -import { ShowCaseComponent } from '../../blueprint/show-case/show-case.component'; import { ApiSectionComponent } from '../../core/kit-page/api-section/api-section.component'; import { KitPageComponent } from '../../core/kit-page/kit-page.component'; import { ApiSection } from '../../core/kit-page/kit-page.types'; import { OverviewSectionHeaderComponent } from '../../core/kit-page/overview-section/overview-section-header/overview-section-header.component'; import { OverviewSectionComponent } from '../../core/kit-page/overview-section/overview-section.component'; +import { ShowCaseComponent } from "../../core/kit-page/show-case/show-case.component"; import { ShowCaseA11yCheckboxComponent } from '../../examples/a11y-checkbox/show-case-a11y-checkbox/show-case-a11y-checkbox.component'; @Component({ diff --git a/projects/docs/src/app/pages/a11y-tab-page/a11y-tab-page.component.ts b/projects/docs/src/app/pages/a11y-tab-page/a11y-tab-page.component.ts index 1fdfa59..d8c7b7b 100644 --- a/projects/docs/src/app/pages/a11y-tab-page/a11y-tab-page.component.ts +++ b/projects/docs/src/app/pages/a11y-tab-page/a11y-tab-page.component.ts @@ -1,10 +1,10 @@ import { ChangeDetectionStrategy, Component } from '@angular/core'; -import { ShowCaseComponent } from '../../blueprint/show-case/show-case.component'; import { ApiSectionComponent } from '../../core/kit-page/api-section/api-section.component'; import { KitPageComponent } from '../../core/kit-page/kit-page.component'; import { ApiSection } from '../../core/kit-page/kit-page.types'; import { OverviewSectionHeaderComponent } from '../../core/kit-page/overview-section/overview-section-header/overview-section-header.component'; import { OverviewSectionComponent } from '../../core/kit-page/overview-section/overview-section.component'; +import { ShowCaseComponent } from "../../core/kit-page/show-case/show-case.component"; import { ShowCaseA11yTabComponent } from '../../examples/a11y-tab/show-case-a11y-tab/show-case-a11y-tab.component'; @Component({ diff --git a/projects/docs/src/app/pages/accordion-page/accordion-page.component.css b/projects/docs/src/app/pages/accordion-page/accordion-page.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/projects/docs/src/app/pages/accordion-page/accordion-page.component.html b/projects/docs/src/app/pages/accordion-page/accordion-page.component.html deleted file mode 100644 index 3a6e003..0000000 --- a/projects/docs/src/app/pages/accordion-page/accordion-page.component.html +++ /dev/null @@ -1,16 +0,0 @@ - - - - - - - - diff --git a/projects/docs/src/app/pages/accordion-page/accordion-page.component.ts b/projects/docs/src/app/pages/accordion-page/accordion-page.component.ts deleted file mode 100644 index db3fa73..0000000 --- a/projects/docs/src/app/pages/accordion-page/accordion-page.component.ts +++ /dev/null @@ -1,113 +0,0 @@ -import { Component, inject } from '@angular/core'; -import { - ApiInfo, - ApiInfoComponent, -} from '../../blueprint/api-info/api-info.component'; -import { EMPTY_API_INPUT_DEFAULT_VALUE } from '../../blueprint/api-info/api-inputs/api-inputs.component'; -import { BlueprintPageComponent } from '../../blueprint/blueprint-page/blueprint-page.component'; -import { CommandInstallationComponent } from '../../blueprint/command-installation/command-installation.component'; -import { ShowCaseComponent } from '../../blueprint/show-case/show-case.component'; -import { - SourceTreeBuilder, - SourceTreeFolder, -} from '../../blueprint/source-tree/source-tree-builder'; -import { SourceTreeComponent } from '../../blueprint/source-tree/source-tree.component'; -import { ShowCaseAccordionComponent } from '../../examples/accordion/show-case-accordion/show-case-accordion.component'; - -const ROOT = 'accordion'; - -@Component({ - selector: 'doc-accordion-page', - imports: [ - BlueprintPageComponent, - ShowCaseComponent, - ShowCaseComponent, - ApiInfoComponent, - SourceTreeComponent, - ShowCaseAccordionComponent, - CommandInstallationComponent, - ], - templateUrl: './accordion-page.component.html', - styleUrl: './accordion-page.component.css', -}) -export class AccordionPageComponent { - sourceTreeBuilder = inject(SourceTreeBuilder); - - sourceTree: SourceTreeFolder[] = [ - { - name: ROOT, - files: [ - ...this.sourceTreeBuilder.fullComponent('accordion', ROOT), - ...this.sourceTreeBuilder.fullComponent('accordion-item', ROOT), - this.sourceTreeBuilder.component('accordion-header', ROOT), - this.sourceTreeBuilder.component('accordion-body', ROOT), - this.sourceTreeBuilder.component('expand-icon', ROOT), - this.sourceTreeBuilder.file('accordion-animations', ROOT), - ], - hideName: true, - }, - ]; - - apiInfo: ApiInfo = { - ariaLink: 'https://www.w3.org/WAI/ARIA/apg/patterns/accordion/', - entities: [ - { - name: 'AccordionComponent', - selector: 'app-accordion', - type: 'component', - description: 'The main component, that includes accordion-items', - inputs: [ - { - name: 'multi', - type: 'boolean', - description: 'allows multiple panels to be open simultaneously', - default: 'false', - }, - ], - }, - { - name: 'AccordionItemComponent', - selector: 'app-accordion-item', - type: 'component', - description: - 'The component is used within an accordion to render an item.', - inputs: [ - { - name: 'label', - type: 'string', - description: 'label of the accordion-item', - default: EMPTY_API_INPUT_DEFAULT_VALUE, - }, - { - name: 'disabled', - type: 'boolean', - description: 'disables accordion-item', - default: 'false', - }, - { - name: 'expanded', - type: 'boolean', - description: 'opens the accordion-item', - default: 'false', - }, - ], - }, - { - name: 'AccordionBodyComponent', - selector: 'app-accordion-body', - type: 'component', - description: - 'The component is used within an accordion-item to render its ng-content.', - inputs: [], - }, - { - name: 'AccordionHeaderComponent', - selector: 'app-accordion-header', - type: 'component', - description: - 'The component can replace the label inside an accordion item and uses ng-content to render its content.', - inputs: [], - }, - ], - }; -} diff --git a/projects/docs/src/app/pages/alert-page/alert-page.component.css b/projects/docs/src/app/pages/alert-page/alert-page.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/projects/docs/src/app/pages/alert-page/alert-page.component.html b/projects/docs/src/app/pages/alert-page/alert-page.component.html deleted file mode 100644 index c620e30..0000000 --- a/projects/docs/src/app/pages/alert-page/alert-page.component.html +++ /dev/null @@ -1,12 +0,0 @@ - - - - - - - - - diff --git a/projects/docs/src/app/pages/alert-page/alert-page.component.ts b/projects/docs/src/app/pages/alert-page/alert-page.component.ts deleted file mode 100644 index f998038..0000000 --- a/projects/docs/src/app/pages/alert-page/alert-page.component.ts +++ /dev/null @@ -1,81 +0,0 @@ -import { Component, inject } from '@angular/core'; -import { - ApiInfo, - ApiInfoComponent, -} from '../../blueprint/api-info/api-info.component'; -import { BlueprintPageComponent } from '../../blueprint/blueprint-page/blueprint-page.component'; -import { CommandInstallationComponent } from '../../blueprint/command-installation/command-installation.component'; -import { ShowCaseComponent } from '../../blueprint/show-case/show-case.component'; -import { - SourceTreeBuilder, - SourceTreeFolder, -} from '../../blueprint/source-tree/source-tree-builder'; -import { SourceTreeComponent } from '../../blueprint/source-tree/source-tree.component'; -import { ShowCaseAlertComponent } from '../../examples/alert/show-case-alert/show-case-alert.component'; - -const ROOT = 'alert'; - -@Component({ - selector: 'doc-alert-page', - imports: [ - BlueprintPageComponent, - ShowCaseComponent, - ShowCaseAlertComponent, - CommandInstallationComponent, - SourceTreeComponent, - ApiInfoComponent, - ], - templateUrl: './alert-page.component.html', - styleUrl: './alert-page.component.css', -}) -export class AlertPageComponent { - sourceTreeBuilder = inject(SourceTreeBuilder); - sourceTree: SourceTreeFolder[] = [ - { - name: ROOT, - files: [ - ...this.sourceTreeBuilder.fullComponent('alert', ROOT), - ...this.sourceTreeBuilder.fullInlineComponent('alert-header', ROOT), - ...this.sourceTreeBuilder.fullInlineComponent('alert-body', ROOT), - ], - hideName: true, - }, - ]; - - apiInfo: ApiInfo = { - ariaLink: 'https://www.w3.org/WAI/ARIA/apg/patterns/alert/', - entities: [ - { - name: 'AlertComponent', - selector: 'app-alert', - type: 'component', - inputs: [ - { - name: 'type', - type: 'default | success | danger | warning', - default: 'default', - description: 'defines the type of alert', - }, - { - name: 'variant', - type: 'fill | outline', - default: 'fill', - description: 'defines the variant of alert', - }, - ], - }, - { - name: 'AlertHeaderComponent', - selector: 'app-alert-header', - type: 'component', - description: 'Renders the header of an alert component.', - }, - { - name: 'AlertBodyComponent', - selector: 'app-alert-body', - type: 'component', - description: 'Renders the body of an alert component.', - }, - ], - }; -} diff --git a/projects/docs/src/app/pages/autocomplete-page/autocomplete-page.component.css b/projects/docs/src/app/pages/autocomplete-page/autocomplete-page.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/projects/docs/src/app/pages/autocomplete-page/autocomplete-page.component.html b/projects/docs/src/app/pages/autocomplete-page/autocomplete-page.component.html deleted file mode 100644 index 2544269..0000000 --- a/projects/docs/src/app/pages/autocomplete-page/autocomplete-page.component.html +++ /dev/null @@ -1,11 +0,0 @@ - - - - - - - - diff --git a/projects/docs/src/app/pages/autocomplete-page/autocomplete-page.component.ts b/projects/docs/src/app/pages/autocomplete-page/autocomplete-page.component.ts deleted file mode 100644 index 1a59983..0000000 --- a/projects/docs/src/app/pages/autocomplete-page/autocomplete-page.component.ts +++ /dev/null @@ -1,32 +0,0 @@ -import { Component, inject } from '@angular/core'; -import { BlueprintPageComponent } from '../../blueprint/blueprint-page/blueprint-page.component'; -import { CommandInstallationComponent } from '../../blueprint/command-installation/command-installation.component'; -import { ShowCaseComponent } from '../../blueprint/show-case/show-case.component'; -import { SourceTreeBuilder } from '../../blueprint/source-tree/source-tree-builder'; -import { SourceTreeComponent } from '../../blueprint/source-tree/source-tree.component'; -import { ShowCaseAutocompleteComponent } from '../../examples/autocomplete/show-case-autocomplete/show-case-autocomplete.component'; - -@Component({ - selector: 'doc-autocomplete-page', - imports: [ - BlueprintPageComponent, - ShowCaseComponent, - ShowCaseComponent, - SourceTreeComponent, - CommandInstallationComponent, - ShowCaseAutocompleteComponent, - ], - templateUrl: './autocomplete-page.component.html', - styleUrl: './autocomplete-page.component.css', -}) -export class AutocompletePageComponent { - sourceTreeBuilder = inject(SourceTreeBuilder); - sourceTree = this.sourceTreeBuilder.sourceTree('autocomplete', (root) => [ - this.sourceTreeBuilder.folder( - root, - root, - () => this.sourceTreeBuilder.fullComponent('autocomplete', root), - true - ), - ]); -} diff --git a/projects/docs/src/app/pages/badge-page/badge-page.component.css b/projects/docs/src/app/pages/badge-page/badge-page.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/projects/docs/src/app/pages/badge-page/badge-page.component.html b/projects/docs/src/app/pages/badge-page/badge-page.component.html deleted file mode 100644 index 1bb221b..0000000 --- a/projects/docs/src/app/pages/badge-page/badge-page.component.html +++ /dev/null @@ -1,12 +0,0 @@ - - - - - - - - - diff --git a/projects/docs/src/app/pages/badge-page/badge-page.component.ts b/projects/docs/src/app/pages/badge-page/badge-page.component.ts deleted file mode 100644 index fc83cb7..0000000 --- a/projects/docs/src/app/pages/badge-page/badge-page.component.ts +++ /dev/null @@ -1,73 +0,0 @@ -import { Component, inject } from '@angular/core'; -import { - ApiInfo, - ApiInfoComponent, -} from '../../blueprint/api-info/api-info.component'; -import { EMPTY_API_INPUT_DEFAULT_VALUE } from '../../blueprint/api-info/api-inputs/api-inputs.component'; -import { BlueprintPageComponent } from '../../blueprint/blueprint-page/blueprint-page.component'; -import { CommandInstallationComponent } from '../../blueprint/command-installation/command-installation.component'; -import { ShowCaseComponent } from '../../blueprint/show-case/show-case.component'; -import { - SourceTreeBuilder, - SourceTreeFolder, -} from '../../blueprint/source-tree/source-tree-builder'; -import { SourceTreeComponent } from '../../blueprint/source-tree/source-tree.component'; -import { ShowCaseBadgeComponent } from '../../examples/badge/show-case-badge/show-case-badge.component'; -const ROOT = 'badge'; -@Component({ - selector: 'doc-badge-page', - imports: [ - BlueprintPageComponent, - ShowCaseComponent, - CommandInstallationComponent, - SourceTreeComponent, - ApiInfoComponent, - ShowCaseBadgeComponent, - ], - templateUrl: './badge-page.component.html', - styleUrl: './badge-page.component.css', -}) -export class BadgePageComponent { - sourceTreeBuilder = inject(SourceTreeBuilder); - - sourceTree: SourceTreeFolder[] = [ - { - name: 'badge', - files: [...this.sourceTreeBuilder.fullComponent(ROOT, ROOT)], - hideName: true, - }, - ]; - - apiInfo: ApiInfo = { - ariaLink: - 'https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/status_role', - entities: [ - { - name: 'BadgeComponent', - type: 'component', - selector: 'app-badge', - inputs: [ - { - name: 'value', - type: 'number | string | null | undefined', - description: 'text to display in badge', - default: EMPTY_API_INPUT_DEFAULT_VALUE, - }, - { - name: 'hide', - type: 'boolean', - description: 'hides the badge content', - default: 'false', - }, - { - name: 'useParent', - type: 'boolean', - description: - "If true, the parent element's style is automatically set to relative. If false, you must explicitly set it to either relative or absolute.", - default: 'true', - }, - ], - }, - ], - }; -} diff --git a/projects/docs/src/app/pages/button-page/button-page.component.css b/projects/docs/src/app/pages/button-page/button-page.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/projects/docs/src/app/pages/button-page/button-page.component.html b/projects/docs/src/app/pages/button-page/button-page.component.html deleted file mode 100644 index 159ba20..0000000 --- a/projects/docs/src/app/pages/button-page/button-page.component.html +++ /dev/null @@ -1,14 +0,0 @@ - - - - - - - - - diff --git a/projects/docs/src/app/pages/button-page/button-page.component.ts b/projects/docs/src/app/pages/button-page/button-page.component.ts deleted file mode 100644 index f23b1ac..0000000 --- a/projects/docs/src/app/pages/button-page/button-page.component.ts +++ /dev/null @@ -1,96 +0,0 @@ -import { Component, inject } from '@angular/core'; -import { - ApiInfo, - ApiInfoComponent, -} from '../../blueprint/api-info/api-info.component'; -import { BlueprintPageComponent } from '../../blueprint/blueprint-page/blueprint-page.component'; -import { CommandInstallationComponent } from '../../blueprint/command-installation/command-installation.component'; -import { ShowCaseComponent } from '../../blueprint/show-case/show-case.component'; -import { - SourceTreeBuilder, - SourceTreeFolder, -} from '../../blueprint/source-tree/source-tree-builder'; -import { SourceTreeComponent } from '../../blueprint/source-tree/source-tree.component'; -import { ShowCaseButtonComponent } from '../../examples/button/show-case-button/show-case-button.component'; -const ROOT = 'button'; -@Component({ - selector: 'doc-button-page', - imports: [ - BlueprintPageComponent, - ShowCaseComponent, - ShowCaseComponent, - ApiInfoComponent, - SourceTreeComponent, - CommandInstallationComponent, - ShowCaseButtonComponent, - ], - templateUrl: './button-page.component.html', - styleUrl: './button-page.component.css', -}) -export class ButtonPageComponent { - sourceTreeBuilder = inject(SourceTreeBuilder); - sourceTree: SourceTreeFolder[] = [ - { - name: ROOT, - files: [ - ...this.sourceTreeBuilder.fullComponent(ROOT, ROOT), - ...this.sourceTreeBuilder.fullComponent('icon-button', ROOT), - ...this.sourceTreeBuilder.fullInlineComponent('button-loader', ROOT), - ], - hideName: true, - }, - ]; - - apiInfo: ApiInfo = { - ariaDescription: - 'The Button component uses the native - -
diff --git a/projects/docs/src/app/pages/doc-sibling-navigations/doc-sibling-navigations.component.ts b/projects/docs/src/app/pages/doc-sibling-navigations/doc-sibling-navigations.component.ts deleted file mode 100644 index 6405271..0000000 --- a/projects/docs/src/app/pages/doc-sibling-navigations/doc-sibling-navigations.component.ts +++ /dev/null @@ -1,44 +0,0 @@ -import { ButtonComponent } from '@/ui/button/button.component'; -import { IconComponent } from '@/ui/icon/icon.component'; -import { Component, inject, signal } from '@angular/core'; -import { Router, RouterLink } from '@angular/router'; -import { ArrowLeft, ArrowRight, LucideAngularModule } from 'lucide-angular'; -import { SidebarLink } from '../sidebar/sidebar.component'; - -// const SIDEBAR_LINKS = []; -// getAllSidebarLinks(); - -@Component({ - selector: 'doc-doc-sibling-navigations', - imports: [RouterLink, LucideAngularModule, ButtonComponent, IconComponent], - templateUrl: './doc-sibling-navigations.component.html', - styleUrl: './doc-sibling-navigations.component.css', -}) -export class DocSiblingNavigationsComponent { - router = inject(Router); - prevRoute = signal(undefined); - nextRoute = signal(undefined); - ArrowLeft = ArrowLeft; - ArrowRight = ArrowRight; - - constructor() { - // this.router.events - // .pipe(filter((e) => e instanceof NavigationEnd)) - // .subscribe(() => { - // const currentPath = this.router.url; - // const foundRouteIndex = SIDEBAR_LINKS.findIndex( - // (r) => r.url === currentPath - // ); - // this.prevRoute.set(undefined); - // this.nextRoute.set(undefined); - // if (foundRouteIndex !== -1) { - // if (foundRouteIndex !== 0) { - // this.prevRoute.set(SIDEBAR_LINKS[foundRouteIndex - 1]); - // } - // if (foundRouteIndex !== SIDEBAR_LINKS.length - 1) { - // this.nextRoute.set(SIDEBAR_LINKS[foundRouteIndex + 1]); - // } - // } - // }); - } -} diff --git a/projects/docs/src/app/pages/drawer-page/drawer-page.component.css b/projects/docs/src/app/pages/drawer-page/drawer-page.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/projects/docs/src/app/pages/drawer-page/drawer-page.component.html b/projects/docs/src/app/pages/drawer-page/drawer-page.component.html deleted file mode 100644 index b4aec96..0000000 --- a/projects/docs/src/app/pages/drawer-page/drawer-page.component.html +++ /dev/null @@ -1,12 +0,0 @@ - - - - - - - - - diff --git a/projects/docs/src/app/pages/drawer-page/drawer-page.component.ts b/projects/docs/src/app/pages/drawer-page/drawer-page.component.ts deleted file mode 100644 index 91a10db..0000000 --- a/projects/docs/src/app/pages/drawer-page/drawer-page.component.ts +++ /dev/null @@ -1,150 +0,0 @@ -import { Component, inject } from '@angular/core'; -import { - ApiInfo, - ApiInfoComponent, -} from '../../blueprint/api-info/api-info.component'; -import { - EMPTY_API_INPUT_DEFAULT_VALUE, - VOID_API_RETURN_TYPE, -} from '../../blueprint/api-info/api-inputs/api-inputs.component'; -import { BlueprintPageComponent } from '../../blueprint/blueprint-page/blueprint-page.component'; -import { CommandInstallationComponent } from '../../blueprint/command-installation/command-installation.component'; -import { ShowCaseComponent } from '../../blueprint/show-case/show-case.component'; -import { - SourceTreeBuilder, - SourceTreeFolder, -} from '../../blueprint/source-tree/source-tree-builder'; -import { SourceTreeComponent } from '../../blueprint/source-tree/source-tree.component'; -import { ShowCaseDrawerComponent } from '../../examples/drawer/show-case-drawer/show-case-drawer.component'; - -const ROOT = 'drawer'; - -@Component({ - selector: 'doc-drawer-page', - imports: [ - BlueprintPageComponent, - ShowCaseComponent, - CommandInstallationComponent, - SourceTreeComponent, - ApiInfoComponent, - ShowCaseDrawerComponent, - ], - templateUrl: './drawer-page.component.html', - styleUrl: './drawer-page.component.css', -}) -export class DrawerPageComponent { - sourceTreeBuilder = inject(SourceTreeBuilder); - - sourceTree: SourceTreeFolder[] = [ - { - name: 'drawer', - files: [ - ...this.sourceTreeBuilder.fullComponent(ROOT, `${ROOT}`), - ...this.sourceTreeBuilder.directive('drawer-close', `${ROOT}`, true), - ...this.sourceTreeBuilder.service('drawer', `${ROOT}`), - this.sourceTreeBuilder.file('drawer-ref', `${ROOT}`, 'ts'), - this.sourceTreeBuilder.component('drawer-close-icon', `${ROOT}`), - ], - hideName: true, - }, - ]; - - apiInfo: ApiInfo = { - ariaLink: 'https://material.angular.io/cdk/dialog/overview#accessibility', - entities: [ - { - name: 'DrawerService', - type: 'service', - description: 'service that opens drawer component', - methods: [ - { - name: 'open', - description: 'opens the drawer', - returnType: 'DrawerRef', - params: [ - { - name: 'component', - type: 'ComponentType', - description: 'component to render inside the drawer.', - }, - { - name: 'options', - type: 'object', - fields: [ - { - name: 'data', - type: 'unknown', - description: 'data to pass to the component.', - }, - { - name: 'title', - type: 'string', - description: 'title of the drawer.', - }, - { - name: 'ariaDescribedBy', - type: 'string', - description: 'ID of the element that describes the Drawer', - default: EMPTY_API_INPUT_DEFAULT_VALUE, - }, - { - name: 'ariaLabel', - type: 'string', - description: 'Drawer label applied via aria-label', - default: EMPTY_API_INPUT_DEFAULT_VALUE, - }, - { - name: 'ariaLabelledBy', - type: 'string', - description: 'ID of the element that labels the Drawer.', - default: EMPTY_API_INPUT_DEFAULT_VALUE, - }, - { - name: 'autoFocus', - type: 'dialog | first-tabbable | first-heading | boolean', - description: 'Where the Drawer should focus on open.', - default: 'first-tabbable', - }, - ], - }, - ], - }, - ], - }, - { - name: 'DrawerRef', - type: 'service', - description: - 'DrawerRef is a class that represents a reference to a drawer component.', - methods: [ - { - name: 'close', - description: 'close the drawer', - returnType: VOID_API_RETURN_TYPE, - params: [], - }, - { - name: 'closed', - returnType: 'Observable>', - description: - 'observable that emits when the drawer is closed. it passes the value that was passed to the close method.', - }, - ], - }, - { - name: 'DrawerCloseDirective', - selector: '[appDrawerClose]', - type: 'directive', - description: - 'A directive used to close the drawer. It can be placed on any element inside the drawer.', - inputs: [ - { - name: 'appDrawerClose', - type: 'unknown', - description: 'value to pass to the close method', - }, - ], - }, - ], - }; -} diff --git a/projects/docs/src/app/pages/form-field-page/form-field-page.component.css b/projects/docs/src/app/pages/form-field-page/form-field-page.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/projects/docs/src/app/pages/form-field-page/form-field-page.component.html b/projects/docs/src/app/pages/form-field-page/form-field-page.component.html deleted file mode 100644 index a212017..0000000 --- a/projects/docs/src/app/pages/form-field-page/form-field-page.component.html +++ /dev/null @@ -1,15 +0,0 @@ - - - - - - - - - diff --git a/projects/docs/src/app/pages/form-field-page/form-field-page.component.ts b/projects/docs/src/app/pages/form-field-page/form-field-page.component.ts deleted file mode 100644 index 9faebd7..0000000 --- a/projects/docs/src/app/pages/form-field-page/form-field-page.component.ts +++ /dev/null @@ -1,141 +0,0 @@ -import { Component, inject } from '@angular/core'; -import { - ApiInfo, - ApiInfoComponent, -} from '../../blueprint/api-info/api-info.component'; -import { EMPTY_API_INPUT_DEFAULT_VALUE } from '../../blueprint/api-info/api-inputs/api-inputs.component'; -import { BlueprintPageComponent } from '../../blueprint/blueprint-page/blueprint-page.component'; -import { CommandInstallationComponent } from '../../blueprint/command-installation/command-installation.component'; -import { ShowCaseComponent } from '../../blueprint/show-case/show-case.component'; -import { - SourceTreeBuilder, - SourceTreeFolder, -} from '../../blueprint/source-tree/source-tree-builder'; -import { SourceTreeComponent } from '../../blueprint/source-tree/source-tree.component'; -import { ShowCaseFormFieldComponent } from '../../examples/form-field/show-case-form-field/show-case-form-field.component'; -const ROOT = 'form-field'; -@Component({ - selector: 'doc-form-field-page', - imports: [ - BlueprintPageComponent, - ShowCaseComponent, - SourceTreeComponent, - CommandInstallationComponent, - ShowCaseFormFieldComponent, - ApiInfoComponent, - ], - templateUrl: './form-field-page.component.html', - styleUrl: './form-field-page.component.css', -}) -export class FormFieldPageComponent { - sourceTreeBuilder = inject(SourceTreeBuilder); - sourceTree: SourceTreeFolder[] = [ - { - name: ROOT, - files: [ - ...this.sourceTreeBuilder.fullComponent(ROOT, ROOT), - this.sourceTreeBuilder.file('form-field-error.registry', ROOT), - this.sourceTreeBuilder.file( - 'form-field-error.registry', - ROOT, - 'spec.ts' - ), - ], - hideName: true, - }, - { - name: 'label', - files: this.sourceTreeBuilder.fullComponent('label', `${ROOT}/label`), - }, - { - name: 'error', - files: this.sourceTreeBuilder.fullComponent('error', `${ROOT}/error`), - }, - ]; - - apiInfo: ApiInfo = { - entities: [ - { - name: 'FormFieldComponent', - type: 'component', - selector: 'app-form-field', - description: 'A form field is a block element with field and label', - inputs: [ - { - name: 'showErrors', - type: 'boolean', - default: 'true', - description: - 'Whether to show auto generated errors, custom errors will be still shown, it has to be controlled manually.', - }, - { - name: 'silentErrors', - type: 'string[] | undefined', - default: EMPTY_API_INPUT_DEFAULT_VALUE, - description: - 'List of errors to ignore. This can be useful when you want to display most of the errors with error group, but handle specific errors with app-error and provide customized error messages', - }, - ], - }, - { - name: 'LabelComponent', - type: 'component', - selector: 'app-label', - description: 'Form Field label', - }, - { - name: 'ErrorComponent', - type: 'component', - selector: 'app-error', - description: 'app-error displays an error message', - }, - { - name: 'FormFieldErrorRegistry', - type: 'service', - description: 'Service for registering error messages', - methods: [ - { - name: 'addErrors', - returnType: 'void', - description: 'adds errors to the registry', - params: [ - { - name: 'errors', - type: 'Record string)>', - description: - 'message value can be string or function where error object will be passed', - }, - ], - }, - { - name: 'setErrors', - returnType: 'void', - description: - 'clears existing errors and sets new errors to the registry', - - params: [ - { - name: 'errors', - type: 'Record string)>', - description: - 'message value can be string or function where error object will be passed', - }, - ], - }, - { - name: 'getMessage', - returnType: 'string | undefined', - description: 'gets error message by code', - params: [ - { - name: 'code', - type: 'string', - description: 'error code', - }, - ], - }, - ], - }, - ], - }; -} diff --git a/projects/docs/src/app/pages/home-page/home-page.component.css b/projects/docs/src/app/pages/home-page/home-page.component.css deleted file mode 100644 index c99ffe6..0000000 --- a/projects/docs/src/app/pages/home-page/home-page.component.css +++ /dev/null @@ -1,8 +0,0 @@ -@reference "tailwindcss"; - -.home { - @apply dark:!bg-black dark:!bg-none; - - background: url(/home-bg.png); - background-size: cover; -} diff --git a/projects/docs/src/app/pages/home-page/home-page.component.html b/projects/docs/src/app/pages/home-page/home-page.component.html deleted file mode 100644 index 1d824c9..0000000 --- a/projects/docs/src/app/pages/home-page/home-page.component.html +++ /dev/null @@ -1,49 +0,0 @@ -
-
-
-
- - Announcement! - - Thank you all for your feedback! The huge stable release is - coming—stay tuned! - - -
-

- NgVerse -

-

-
Not Just Another
-
UI Library
-

-

-
Complete Zoneless Angular Components
-
- Just - - Copy - - - , Paste - - - - , and Fly - - -
-

-
- - - -
-
-
-
diff --git a/projects/docs/src/app/pages/home-page/home-page.component.ts b/projects/docs/src/app/pages/home-page/home-page.component.ts deleted file mode 100644 index 1345889..0000000 --- a/projects/docs/src/app/pages/home-page/home-page.component.ts +++ /dev/null @@ -1,56 +0,0 @@ -import { AlertBodyComponent } from '@/ui/alert/alert-body.component'; -import { AlertHeaderComponent } from '@/ui/alert/alert-header.component'; -import { AlertComponent } from '@/ui/alert/alert.component'; -import { ButtonComponent } from '@/ui/button/button.component'; -import { IconComponent } from '@/ui/icon/icon.component'; -import { DOCUMENT } from '@angular/common'; -import { Component, inject } from '@angular/core'; -import { Meta, Title } from '@angular/platform-browser'; -import { RouterLink } from '@angular/router'; -import { - Clipboard, - ClipboardPaste, - LucideAngularModule, - Rocket, -} from 'lucide-angular'; - -@Component({ - selector: 'doc-home-page', - imports: [ - RouterLink, - LucideAngularModule, - IconComponent, - ButtonComponent, - AlertComponent, - AlertHeaderComponent, - AlertBodyComponent, - ], - templateUrl: './home-page.component.html', - styleUrl: './home-page.component.css', -}) -export class HomePageComponent { - Clipboard = Clipboard; - ClipboardPaste = ClipboardPaste; - Rocket = Rocket; - title = inject(Title); - meta = inject(Meta); - document = inject(DOCUMENT); - constructor() { - this.title.setTitle('ngverse'); - - this.meta.addTags([ - { property: 'og:title', content: 'NgVerse' }, - { - property: 'og:description', - content: 'Collection of Angular components', - }, - { - property: 'og:image', - content: 'https://www.ngverse.dev/logo.png', - }, - { property: 'og:image:alt', content: 'NgVerse logo' }, - { property: 'og:url', content: this.document.location.href }, - { property: 'og:type', content: 'website' }, - ]); - } -} diff --git a/projects/docs/src/app/pages/icon-page/icon-page.component.css b/projects/docs/src/app/pages/icon-page/icon-page.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/projects/docs/src/app/pages/icon-page/icon-page.component.html b/projects/docs/src/app/pages/icon-page/icon-page.component.html deleted file mode 100644 index 54c6627..0000000 --- a/projects/docs/src/app/pages/icon-page/icon-page.component.html +++ /dev/null @@ -1,18 +0,0 @@ - - - - - - - - - - If you don't have SVG icons to work with, you can use - Lucide icons—we use them - as well. - - - diff --git a/projects/docs/src/app/pages/icon-page/icon-page.component.ts b/projects/docs/src/app/pages/icon-page/icon-page.component.ts deleted file mode 100644 index 1987937..0000000 --- a/projects/docs/src/app/pages/icon-page/icon-page.component.ts +++ /dev/null @@ -1,117 +0,0 @@ -import { Component, inject } from '@angular/core'; -import { ApiDescriptionComponent } from '../../blueprint/api-info/api-description/api-description.component'; -import { - ApiInfo, - ApiInfoComponent, -} from '../../blueprint/api-info/api-info.component'; -import { VOID_API_RETURN_TYPE } from '../../blueprint/api-info/api-inputs/api-inputs.component'; -import { BlueprintPageComponent } from '../../blueprint/blueprint-page/blueprint-page.component'; -import { CommandInstallationComponent } from '../../blueprint/command-installation/command-installation.component'; -import { ShowCaseComponent } from '../../blueprint/show-case/show-case.component'; -import { - SourceTreeBuilder, - SourceTreeFolder, -} from '../../blueprint/source-tree/source-tree-builder'; -import { SourceTreeComponent } from '../../blueprint/source-tree/source-tree.component'; -import { ShowCaseIconComponent } from '../../examples/icon/show-case-icon/show-case-icon.component'; - -const ROOT = 'icon'; - -@Component({ - selector: 'doc-icon-page', - imports: [ - BlueprintPageComponent, - ShowCaseIconComponent, - ShowCaseComponent, - SourceTreeComponent, - CommandInstallationComponent, - ApiInfoComponent, - ApiDescriptionComponent, - ], - templateUrl: './icon-page.component.html', - styleUrl: './icon-page.component.css', -}) -export class IconPageComponent { - sourceTreeBuilder = inject(SourceTreeBuilder); - sourceTree: SourceTreeFolder[] = [ - { - name: ROOT, - files: [ - ...this.sourceTreeBuilder.fullInlineComponent('icon', ROOT), - ...this.sourceTreeBuilder.service('icon-registry', ROOT), - ...this.sourceTreeBuilder.service('icon-loader', ROOT), - ], - hideName: true, - }, - ]; - apiInfo: ApiInfo = { - ariaLink: - 'https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/img_role', - entities: [ - { - name: 'IconComponent', - selector: 'app-icon', - type: 'component', - inputs: [ - { - name: 'name', - type: 'string', - description: 'The name of the icon to display.', - }, - { - name: 'width', - type: 'number | string', - description: - 'The width of the icon. it can be either px value like 16px or percentage like 50%.', - }, - { - name: 'height', - type: 'number | string', - description: - 'The height of the icon. it can be either px value like 16px or percentage like 50%.', - }, - { - name: 'stretch', - type: 'boolean', - description: 'Whether to stretch the icon to fit the container.', - }, - ], - }, - { - name: 'IconRegistry', - type: 'service', - methods: [ - { - name: 'addIcon', - description: 'add an icon to the registry', - returnType: VOID_API_RETURN_TYPE, - params: [ - { - name: 'name', - type: 'string', - description: 'The name of the icon to add.', - }, - { - name: 'url', - type: 'string', - description: 'The url of the icon to add.', - }, - ], - }, - { - name: 'getUrl', - description: 'get the url of an icon', - returnType: 'string | undefined', - params: [ - { - name: 'name', - type: 'string', - description: 'The icon name', - }, - ], - }, - ], - }, - ], - }; -} diff --git a/projects/docs/src/app/pages/input-page/input-page.component.css b/projects/docs/src/app/pages/input-page/input-page.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/projects/docs/src/app/pages/input-page/input-page.component.html b/projects/docs/src/app/pages/input-page/input-page.component.html deleted file mode 100644 index 9a2ec84..0000000 --- a/projects/docs/src/app/pages/input-page/input-page.component.html +++ /dev/null @@ -1,12 +0,0 @@ - - - - - - - - - diff --git a/projects/docs/src/app/pages/input-page/input-page.component.ts b/projects/docs/src/app/pages/input-page/input-page.component.ts deleted file mode 100644 index b21bceb..0000000 --- a/projects/docs/src/app/pages/input-page/input-page.component.ts +++ /dev/null @@ -1,53 +0,0 @@ -import { Component, inject } from '@angular/core'; -import { - ApiInfo, - ApiInfoComponent, -} from '../../blueprint/api-info/api-info.component'; -import { BlueprintPageComponent } from '../../blueprint/blueprint-page/blueprint-page.component'; -import { CommandInstallationComponent } from '../../blueprint/command-installation/command-installation.component'; -import { ShowCaseComponent } from '../../blueprint/show-case/show-case.component'; -import { - SourceTreeBuilder, - SourceTreeFolder, -} from '../../blueprint/source-tree/source-tree-builder'; -import { SourceTreeComponent } from '../../blueprint/source-tree/source-tree.component'; -import { ShowCaseInputComponent } from '../../examples/input/show-case-input/show-case-input.component'; - -const ROOT = 'input'; - -@Component({ - selector: 'doc-input-page', - imports: [ - BlueprintPageComponent, - ShowCaseComponent, - ShowCaseInputComponent, - CommandInstallationComponent, - SourceTreeComponent, - ApiInfoComponent, - ], - templateUrl: './input-page.component.html', - styleUrl: './input-page.component.css', -}) -export class InputPageComponent { - sourceTreeBuilder = inject(SourceTreeBuilder); - sourceTree: SourceTreeFolder[] = [ - { - name: ROOT, - files: [...this.sourceTreeBuilder.directive(ROOT, ROOT, true)], - hideName: true, - }, - ]; - - apiInfo: ApiInfo = { - stylesInGlobal: true, - ariaDescription: - 'The Input directive uses the native element as its host, making all accessibility features readily available.', - entities: [ - { - name: 'InputDirective', - type: 'directive', - selector: 'input[appInput]', - }, - ], - }; -} diff --git a/projects/docs/src/app/pages/installation-page/installation-page.component.css b/projects/docs/src/app/pages/installation-page/installation-page.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/projects/docs/src/app/pages/installation-page/installation-page.component.html b/projects/docs/src/app/pages/installation-page/installation-page.component.html deleted file mode 100644 index 1a9217f..0000000 --- a/projects/docs/src/app/pages/installation-page/installation-page.component.html +++ /dev/null @@ -1,47 +0,0 @@ - -

- The minimum required Angular version for installation is - >=19.0.2. -

-

Automatic Installation (Recommended)

-

To get started, run the following command:

- - -

Ready to Use

-

- Once the installation is complete, you can generate a component with the - following command: -

- -

- Note: We use the term element during - generation and not component because NgVerse contains not only - components but also directives, pipes, animations, and more. Therefore, - element is a more generic term. -

- -

Manual Installation

-

If you prefer manual setup, follow these steps:

-

Install angular/cdk

- -

Install NgVerse schematics

- -

Add Angular animations

- -

Add ngverse.css

-
    -
  • - Copy the content of - ngverse.css file. -
    • -
  • Add it into your project
    • -
  • Import it in your global styles.css file
    • -
-

You are now ready to start using NgVerse in your Angular project!

- diff --git a/projects/docs/src/app/pages/installation-page/installation-page.component.ts b/projects/docs/src/app/pages/installation-page/installation-page.component.ts deleted file mode 100644 index 2812817..0000000 --- a/projects/docs/src/app/pages/installation-page/installation-page.component.ts +++ /dev/null @@ -1,21 +0,0 @@ -import { Component } from '@angular/core'; -import { BlogPageComponent } from '../../blog/blog-page/blog-page.component'; -import { SourceCodeComponent } from '../../blueprint/source-code/source-code.component'; - -@Component({ - selector: 'doc-installation-page', - imports: [BlogPageComponent, SourceCodeComponent], - templateUrl: './installation-page.component.html', - styleUrl: './installation-page.component.css', -}) -export class InstallationPageComponent { - ngVersefile = 'ngverse/ngverse.css'; - - animationsCode = `import { provideAnimationsAsync } from '@angular/platform-browser/animations/async'; - -export const appConfig: ApplicationConfig = { - providers: [ - provideAnimationsAsync(), - ], -};`; -} diff --git a/projects/docs/src/app/pages/introduction-page/introduction-page.component.css b/projects/docs/src/app/pages/introduction-page/introduction-page.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/projects/docs/src/app/pages/introduction-page/introduction-page.component.html b/projects/docs/src/app/pages/introduction-page/introduction-page.component.html deleted file mode 100644 index f8f3bf1..0000000 --- a/projects/docs/src/app/pages/introduction-page/introduction-page.component.html +++ /dev/null @@ -1,171 +0,0 @@ - -

- NgVerse is a collection of feature-rich Angular components, directives, - pipes, and more. It has one key difference from other UI libraries: - you don’t install it as a dependency. Instead, you add the - source code of the elements directly into your project. -

- -

What does that mean?

- -

- Typically, when you use a UI library, you install the library as a - dependency and then import components from it. NgVerse is different. You - install the NgVerse schematics and selectively add the components you need. - The component's source code is injected into your project, making it - fully customizable. You can explore, update, or leave it as - is. -

- -

- For example, if you were using a traditional Angular UI library, the steps - would look like this: -

- - -

And to use a button component:

- - -

In the case of NgVerse, the process is different:

- -

1. Install NgVerse schematics:

- - -

2. Add the button component to your project:

- - -

- This command adds the full source code for the button component to your - project. It behaves just as if you had created it yourself. -

- -

Key Features

- -
    -
  • - Zoneless: We don't rely on zone.js. All - elements are zoneless, meaning they will work regardless of whether your - app includes zone.js or not. -
    • -
  • - Fully Customizable: The complete source code is yours, so - it is 100% customizable. -
    • -
  • - Accessibility: We prioritize accessibility, including - features like keyboard navigation and focus management. Generated - components have these behaviors by default. -
    • -
  • - Modular Approach: You only add what you need. No - unnecessary components or features are bundled into your project. -
    • -
- -

Why this approach?

- -

- If you’ve extensively used UI libraries, you might wonder why NgVerse took - this approach. The reasons are rooted in three major concerns: -

- -

1. Customization

- -

- UI libraries often have limited customization options. For example, if you - want a fully-featured select component with single/multi-selection, keyboard - navigation, and other advanced features, building it from scratch can be - time-consuming and error-prone. So, you might turn to a library like Angular - Material. -

- -

- However, you may soon realize that customizing Angular Material components - is - extremely difficult (you've probably faced this issue - already). You might switch to a different library that offers more control, - but let's say you want all your select components to include a clear icon - beside the placeholder. No library may provide this feature. They might - allow custom templates (ng-template), but now you have another - issue: -

- -
    -
  • - Either you must use ng-template everywhere you use the select - component. -
    • -
  • - Or you need to wrap the library’s select component in your own custom - component (app-select) and modify it there. -
    • -
- -

- This approach creates a wrapper component, which requires additional work to - handle delegation and communication between your component and the library’s - component. You also risk not achieving full functionality. -

- -

- In NgVerse, when you add a select component, the complete - source code is added to your project. By default, the component is already - fully featured, with options for overlays, keyboard navigation, - accessibility, single and multi-selection, and unit tests. If you want to - add a clear icon, you simply modify the source code directly within your - project. -

- -

2. Third-party Independence

- -

- NgVerse components evolve with your project. You don’t have to wait for a - third-party library to release an update to support a new Angular version, - make the library zoneless, or fix critical bugs. -

- -

- You are in control—you decide what to upgrade and when. Your project won't - be forced to upgrade just because a third-party library introduced new - features in a newer Angular version. -

- -

- For large enterprise apps, being in control of your - components is crucial. You can upgrade or maintain them as needed without - waiting for external libraries to catch up. -

- -

3. No Global Configuration Theming

- -

- Most UI libraries require you to modify global styles to update the theme. - Typically, you either: -

- -
    -
  • Read through a large theming file.
    • -
  • Inspect elements to find the correct selectors.
    • -
  • Write CSS overrides in your global styles.css file.
    • -
- -

- With NgVerse, each component comes with its own - component.css file. If you want to update the style, you simply - edit the component’s style file directly, keeping your components - encapsulated. -

-

- There is a lot more to say, but enough words—it’s time to fly! 🚀 Let’s get - started. -

- diff --git a/projects/docs/src/app/pages/introduction-page/introduction-page.component.ts b/projects/docs/src/app/pages/introduction-page/introduction-page.component.ts deleted file mode 100644 index 8633f38..0000000 --- a/projects/docs/src/app/pages/introduction-page/introduction-page.component.ts +++ /dev/null @@ -1,11 +0,0 @@ -import { Component } from '@angular/core'; -import { BlogPageComponent } from '../../blog/blog-page/blog-page.component'; -import { SourceCodeComponent } from '../../blueprint/source-code/source-code.component'; - -@Component({ - selector: 'doc-introduction-page', - imports: [BlogPageComponent, SourceCodeComponent], - templateUrl: './introduction-page.component.html', - styleUrl: './introduction-page.component.css', -}) -export class IntroductionPageComponent {} diff --git a/projects/docs/src/app/pages/loader-page/loader-page.component.css b/projects/docs/src/app/pages/loader-page/loader-page.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/projects/docs/src/app/pages/loader-page/loader-page.component.html b/projects/docs/src/app/pages/loader-page/loader-page.component.html deleted file mode 100644 index 073b44b..0000000 --- a/projects/docs/src/app/pages/loader-page/loader-page.component.html +++ /dev/null @@ -1,13 +0,0 @@ - - - - - - - - - - diff --git a/projects/docs/src/app/pages/loader-page/loader-page.component.ts b/projects/docs/src/app/pages/loader-page/loader-page.component.ts deleted file mode 100644 index a333ad9..0000000 --- a/projects/docs/src/app/pages/loader-page/loader-page.component.ts +++ /dev/null @@ -1,76 +0,0 @@ -import { ChangeDetectionStrategy, Component, inject } from '@angular/core'; -import { - ApiInfo, - ApiInfoComponent, -} from '../../blueprint/api-info/api-info.component'; -import { BlueprintPageComponent } from '../../blueprint/blueprint-page/blueprint-page.component'; -import { CommandInstallationComponent } from '../../blueprint/command-installation/command-installation.component'; -import { ShowCaseComponent } from '../../blueprint/show-case/show-case.component'; -import { - SourceTreeBuilder, - SourceTreeFolder, -} from '../../blueprint/source-tree/source-tree-builder'; -import { SourceTreeComponent } from '../../blueprint/source-tree/source-tree.component'; -import { ShowCaseLoaderComponent } from '../../examples/loader/show-case-loader/show-case-loader.component'; -const ROOT = 'loader'; -@Component({ - selector: 'doc-loader-page', - imports: [ - BlueprintPageComponent, - ShowCaseComponent, - ShowCaseLoaderComponent, - CommandInstallationComponent, - SourceTreeComponent, - ApiInfoComponent, - ], - templateUrl: './loader-page.component.html', - styleUrl: './loader-page.component.css', - changeDetection: ChangeDetectionStrategy.OnPush, -}) -export class LoaderPageComponent { - sourceTreeBuilder = inject(SourceTreeBuilder); - sourceTree: SourceTreeFolder[] = [ - { - name: ROOT, - files: this.sourceTreeBuilder.fullComponent(ROOT, ROOT), - hideName: true, - }, - ]; - apiInfo: ApiInfo = { - entities: [ - { - name: 'LoaderComponent', - type: 'component', - selector: 'app-loader', - inputs: [ - { - name: 'radius', - type: 'number', - default: '50', - description: 'The radius of the spinner.', - }, - { - name: 'overlay', - type: 'boolean', - default: 'false', - description: - 'If overlay is set to true, it adds a background overlay that stretches to the size of the parent element.', - }, - { - name: 'userParent', - type: 'boolean', - default: 'true', - description: - "If true, the parent element's style is automatically set to relative. If false, you must explicitly set it to either relative or absolute. this input is needed when overlay=[true]", - }, - { - name: 'transparency', - type: 'none | semi | full', - default: 'semi', - description: 'The transparency of the spinner background overlay', - }, - ], - }, - ], - }; -} diff --git a/projects/docs/src/app/pages/local-storage-page/local-storage-page.component.css b/projects/docs/src/app/pages/local-storage-page/local-storage-page.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/projects/docs/src/app/pages/local-storage-page/local-storage-page.component.html b/projects/docs/src/app/pages/local-storage-page/local-storage-page.component.html deleted file mode 100644 index b5471c0..0000000 --- a/projects/docs/src/app/pages/local-storage-page/local-storage-page.component.html +++ /dev/null @@ -1,26 +0,0 @@ - - - - - - - - - - LocalStorageService implements - Storage - Interface so all native methods are available. - - - diff --git a/projects/docs/src/app/pages/local-storage-page/local-storage-page.component.ts b/projects/docs/src/app/pages/local-storage-page/local-storage-page.component.ts deleted file mode 100644 index b1a010b..0000000 --- a/projects/docs/src/app/pages/local-storage-page/local-storage-page.component.ts +++ /dev/null @@ -1,129 +0,0 @@ -import { ChangeDetectionStrategy, Component, inject } from '@angular/core'; -import { ApiDescriptionComponent } from '../../blueprint/api-info/api-description/api-description.component'; -import { - ApiInfo, - ApiInfoComponent, -} from '../../blueprint/api-info/api-info.component'; -import { BlueprintPageComponent } from '../../blueprint/blueprint-page/blueprint-page.component'; -import { CommandInstallationComponent } from '../../blueprint/command-installation/command-installation.component'; -import { ShowCaseComponent } from '../../blueprint/show-case/show-case.component'; -import { - SourceTreeBuilder, - SourceTreeFolder, -} from '../../blueprint/source-tree/source-tree-builder'; -import { SourceTreeComponent } from '../../blueprint/source-tree/source-tree.component'; -import { ShowCaseLocalStorageComponent } from '../../examples/local-storage/show-case-local-storage/show-case-local-storage.component'; - -const ROOT = 'local-storage'; - -@Component({ - selector: 'doc-local-storage-page', - imports: [ - BlueprintPageComponent, - CommandInstallationComponent, - ShowCaseComponent, - SourceTreeComponent, - ApiInfoComponent, - ShowCaseLocalStorageComponent, - ApiDescriptionComponent, - ], - templateUrl: './local-storage-page.component.html', - styleUrl: './local-storage-page.component.css', - changeDetection: ChangeDetectionStrategy.OnPush, -}) -export class LocalStoragePageComponent { - sourceTreeBuilder = inject(SourceTreeBuilder); - sourceTree: SourceTreeFolder[] = [ - { - name: ROOT, - files: [...this.sourceTreeBuilder.service(ROOT, ROOT)], - hideName: true, - }, - ]; - - apiInfo: ApiInfo = { - articleLink: - 'https://medium.com/ngverse/make-localstorage-ssr-compatible-in-angular-431d7ce5714e', - entities: [ - { - name: 'LocalStorageService', - type: 'service', - methods: [ - { - name: 'getItem', - returnType: 'string | null', - description: 'Returns the value associated with the given key.', - params: [ - { - name: 'key', - type: 'string', - description: 'The key of the value to retrieve.', - }, - ], - }, - { - name: 'setItem', - returnType: 'void', - description: 'Associates a key with a given value.', - params: [ - { - name: 'key', - type: 'string', - description: 'The key of the value to set.', - }, - { - name: 'value', - type: 'string', - description: 'The value to set.', - }, - ], - }, - { - name: 'removeItem', - returnType: 'void', - description: 'Removes the value associated with the given key.', - params: [ - { - name: 'key', - type: 'string', - description: 'The key of the value to remove.', - }, - ], - }, - { - name: 'clear', - returnType: 'void', - description: 'Removes all values from the storage.', - }, - { - name: 'key', - returnType: 'string | null', - description: 'Returns the key of the item at the given index.', - params: [ - { - name: 'index', - type: 'number', - description: 'The index of the item.', - }, - ], - }, - ], - properties: [ - { - name: 'length', - propType: 'get', - returnType: 'number', - description: 'The number of items in the storage.', - }, - { - name: 'enabled', - propType: 'get', - returnType: 'boolean', - description: - 'Whether the local storage is enabled. if SSR the value is false.', - }, - ], - }, - ], - }; -} diff --git a/projects/docs/src/app/pages/otp-input-page/otp-input-page.component.css b/projects/docs/src/app/pages/otp-input-page/otp-input-page.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/projects/docs/src/app/pages/otp-input-page/otp-input-page.component.html b/projects/docs/src/app/pages/otp-input-page/otp-input-page.component.html deleted file mode 100644 index 4df82bb..0000000 --- a/projects/docs/src/app/pages/otp-input-page/otp-input-page.component.html +++ /dev/null @@ -1,20 +0,0 @@ - - - - - - OTP Input element uses - Input and - Listbox. Please - ensure they are added to your project if they aren't already. - - - - - - diff --git a/projects/docs/src/app/pages/otp-input-page/otp-input-page.component.ts b/projects/docs/src/app/pages/otp-input-page/otp-input-page.component.ts deleted file mode 100644 index 0bfa79a..0000000 --- a/projects/docs/src/app/pages/otp-input-page/otp-input-page.component.ts +++ /dev/null @@ -1,110 +0,0 @@ -import { Component, inject } from '@angular/core'; -import { RouterLink } from '@angular/router'; -import { - ApiInfo, - ApiInfoComponent, -} from '../../blueprint/api-info/api-info.component'; -import { BlueprintPageComponent } from '../../blueprint/blueprint-page/blueprint-page.component'; -import { CommandInstallationComponent } from '../../blueprint/command-installation/command-installation.component'; -import { - Prerequisite, - PrerequisitesComponent, -} from '../../blueprint/prerequisites/prerequisites.component'; -import { ShowCaseComponent } from '../../blueprint/show-case/show-case.component'; -import { - SourceTreeBuilder, - SourceTreeFolder, -} from '../../blueprint/source-tree/source-tree-builder'; -import { SourceTreeComponent } from '../../blueprint/source-tree/source-tree.component'; -import { ShowCaseOtpInputComponent } from '../../examples/otp-input/show-case-otp-input/show-case-otp-input.component'; -const ROOT = 'otp-input'; - -@Component({ - selector: 'doc-otp-input-page', - imports: [ - BlueprintPageComponent, - ShowCaseComponent, - ShowCaseOtpInputComponent, - SourceTreeComponent, - CommandInstallationComponent, - ApiInfoComponent, - PrerequisitesComponent, - RouterLink, - ], - templateUrl: './otp-input-page.component.html', - styleUrl: './otp-input-page.component.css', -}) -export class OtpInputPageComponent { - sourceTreeBuilder = inject(SourceTreeBuilder); - - preprs: Prerequisite[] = [ - { - name: 'input', - label: 'Input', - }, - ]; - - sourceTree: SourceTreeFolder[] = [ - { - name: ROOT, - files: [...this.sourceTreeBuilder.fullComponent(ROOT, ROOT)], - hideName: true, - }, - ]; - apiInfo: ApiInfo = { - ariaLink: - 'https://ej2.syncfusion.com/react/documentation/otp-input/accessibility', - entities: [ - { - name: 'OtpInputComponent', - selector: 'app-otp-input', - type: 'component', - inputs: [ - { - name: 'codeLength', - type: 'number', - default: '4', - description: 'The length of the OTP', - }, - { - name: 'inputMode', - type: 'string', - default: 'numeric', - description: 'The input mode of the OTP', - }, - ], - outputs: [ - { - name: 'filled', - description: 'Emits the value of OTP when the OTP is filled', - value: 'string', - }, - ], - methods: [ - { - name: 'focus', - returnType: 'void', - description: 'Focuses the first input', - }, - { - name: 'fillFromText', - returnType: 'void', - description: 'Fills the OTP from text', - params: [ - { - name: 'text', - type: 'string', - description: 'The text to fill the OTP', - }, - ], - }, - { - name: 'clear', - returnType: 'void', - description: 'Clears the OTP', - }, - ], - }, - ], - }; -} diff --git a/projects/docs/src/app/pages/outside-click-page/outside-click-page.component.css b/projects/docs/src/app/pages/outside-click-page/outside-click-page.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/projects/docs/src/app/pages/outside-click-page/outside-click-page.component.html b/projects/docs/src/app/pages/outside-click-page/outside-click-page.component.html deleted file mode 100644 index a81298b..0000000 --- a/projects/docs/src/app/pages/outside-click-page/outside-click-page.component.html +++ /dev/null @@ -1,9 +0,0 @@ - - - diff --git a/projects/docs/src/app/pages/outside-click-page/outside-click-page.component.ts b/projects/docs/src/app/pages/outside-click-page/outside-click-page.component.ts deleted file mode 100644 index 0069757..0000000 --- a/projects/docs/src/app/pages/outside-click-page/outside-click-page.component.ts +++ /dev/null @@ -1,22 +0,0 @@ -import { Component, inject } from '@angular/core'; -import { BlueprintPageComponent } from '../../blueprint/blueprint-page/blueprint-page.component'; -import { SourceTreeBuilder } from '../../blueprint/source-tree/source-tree-builder'; -import { SourceTreeComponent } from '../../blueprint/source-tree/source-tree.component'; - -@Component({ - selector: 'doc-outside-click-page', - imports: [BlueprintPageComponent, SourceTreeComponent], - templateUrl: './outside-click-page.component.html', - styleUrl: './outside-click-page.component.css', -}) -export class OutsideClickPageComponent { - sourceTreeBuilder = inject(SourceTreeBuilder); - sourceTree = this.sourceTreeBuilder.sourceTree('outside-click', (root) => [ - this.sourceTreeBuilder.folder( - root, - root, - () => [...this.sourceTreeBuilder.directive(root, root)], - true - ), - ]); -} diff --git a/projects/docs/src/app/pages/pagination-page/pagination-page.component.css b/projects/docs/src/app/pages/pagination-page/pagination-page.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/projects/docs/src/app/pages/pagination-page/pagination-page.component.html b/projects/docs/src/app/pages/pagination-page/pagination-page.component.html deleted file mode 100644 index 704bea9..0000000 --- a/projects/docs/src/app/pages/pagination-page/pagination-page.component.html +++ /dev/null @@ -1,20 +0,0 @@ - - - - - - Pagination element uses - Button. Please ensure - it is added to your project if it is not already. - - - - - - diff --git a/projects/docs/src/app/pages/pagination-page/pagination-page.component.ts b/projects/docs/src/app/pages/pagination-page/pagination-page.component.ts deleted file mode 100644 index 839dc57..0000000 --- a/projects/docs/src/app/pages/pagination-page/pagination-page.component.ts +++ /dev/null @@ -1,87 +0,0 @@ -import { Component, inject } from '@angular/core'; -import { RouterLink } from '@angular/router'; -import { - ApiInfo, - ApiInfoComponent, -} from '../../blueprint/api-info/api-info.component'; -import { EMPTY_API_INPUT_DEFAULT_VALUE } from '../../blueprint/api-info/api-inputs/api-inputs.component'; -import { BlueprintPageComponent } from '../../blueprint/blueprint-page/blueprint-page.component'; -import { CommandInstallationComponent } from '../../blueprint/command-installation/command-installation.component'; -import { - Prerequisite, - PrerequisitesComponent, -} from '../../blueprint/prerequisites/prerequisites.component'; -import { ShowCaseComponent } from '../../blueprint/show-case/show-case.component'; -import { - SourceTreeBuilder, - SourceTreeFolder, -} from '../../blueprint/source-tree/source-tree-builder'; -import { SourceTreeComponent } from '../../blueprint/source-tree/source-tree.component'; -import { ShowCasePaginationComponent } from '../../examples/pagination/show-case-pagination/show-case-pagination.component'; - -const ROOT = 'pagination'; -@Component({ - selector: 'doc-pagination-page', - imports: [ - BlueprintPageComponent, - ShowCaseComponent, - CommandInstallationComponent, - SourceTreeComponent, - ApiInfoComponent, - ShowCasePaginationComponent, - PrerequisitesComponent, - RouterLink, - ], - templateUrl: './pagination-page.component.html', - styleUrl: './pagination-page.component.css', -}) -export class PaginationPageComponent { - sourceTreeBuilder = inject(SourceTreeBuilder); - - preps: Prerequisite[] = [{ name: 'button' }]; - - sourceTree: SourceTreeFolder[] = [ - { - name: 'pagination', - files: [ - ...this.sourceTreeBuilder.inlineComponent(ROOT, ROOT), - this.sourceTreeBuilder.file('pagination-next-icon.component', ROOT), - this.sourceTreeBuilder.file('pagination-prev-icon.component', ROOT), - ], - hideName: true, - }, - ]; - - apiInfo: ApiInfo = { - ariaLink: 'https://www.a11ymatters.com/pattern/pagination', - entities: [ - { - name: 'PaginationComponent', - type: 'component', - selector: 'app-pagination', - inputs: [ - { - name: 'currentPage', - type: 'number', - description: 'Specifies the current page', - default: EMPTY_API_INPUT_DEFAULT_VALUE, - }, - { - name: 'totalPages', - type: 'number', - description: 'Specifies the total pages', - default: EMPTY_API_INPUT_DEFAULT_VALUE, - }, - ], - outputs: [ - { - name: 'pageChange', - description: - 'Emits when the page has been changed with the new page number', - value: 'number', - }, - ], - }, - ], - }; -} diff --git a/projects/docs/src/app/pages/popover-page/popover-page.component.css b/projects/docs/src/app/pages/popover-page/popover-page.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/projects/docs/src/app/pages/popover-page/popover-page.component.html b/projects/docs/src/app/pages/popover-page/popover-page.component.html deleted file mode 100644 index 25ee57d..0000000 --- a/projects/docs/src/app/pages/popover-page/popover-page.component.html +++ /dev/null @@ -1,10 +0,0 @@ - - - - - - - diff --git a/projects/docs/src/app/pages/popover-page/popover-page.component.ts b/projects/docs/src/app/pages/popover-page/popover-page.component.ts deleted file mode 100644 index 2c52cc3..0000000 --- a/projects/docs/src/app/pages/popover-page/popover-page.component.ts +++ /dev/null @@ -1,144 +0,0 @@ -import { ChangeDetectionStrategy, Component, inject } from '@angular/core'; -import { - ApiInfo, - ApiInfoComponent, -} from '../../blueprint/api-info/api-info.component'; -import { EMPTY_API_INPUT_DEFAULT_VALUE } from '../../blueprint/api-info/api-inputs/api-inputs.component'; -import { BlueprintPageComponent } from '../../blueprint/blueprint-page/blueprint-page.component'; -import { ShowCaseComponent } from '../../blueprint/show-case/show-case.component'; -import { - SourceTreeBuilder, - SourceTreeFolder, -} from '../../blueprint/source-tree/source-tree-builder'; -import { SourceTreeComponent } from '../../blueprint/source-tree/source-tree.component'; -import { ShowCasePopoverComponent } from '../../examples/popover/show-case-popover/show-case-popover.component'; -const ROOT = 'popover'; -@Component({ - selector: 'doc-popover-page', - imports: [ - ShowCasePopoverComponent, - BlueprintPageComponent, - ShowCaseComponent, - SourceTreeComponent, - ApiInfoComponent, - ], - templateUrl: './popover-page.component.html', - styleUrl: './popover-page.component.css', - changeDetection: ChangeDetectionStrategy.OnPush, -}) -export class PopoverPageComponent { - sourceTreeBuilder = inject(SourceTreeBuilder); - - apiInfo: ApiInfo = { - entities: [ - { - name: 'PopoverComponent', - type: 'component', - selector: 'kt-popover', - inputs: [ - { - name: 'isOpen', - type: 'model()', - description: 'Determines whether the popover is open or closed', - default: 'false', - }, - { - name: 'origin', - type: 'PopoverOriginDirective', - description: 'The element to which the popover should be attached', - default: EMPTY_API_INPUT_DEFAULT_VALUE, - }, - { - name: 'offsetX', - type: 'number', - description: - 'The horizontal offset of the popover relative to the origin', - default: '0', - }, - { - name: 'offsetY', - type: 'number', - description: - 'The vertical offset of the popover relative to the origin', - default: '0', - }, - { - name: 'styled', - type: 'boolean', - description: 'Applies default styles to the popover', - default: 'false', - }, - { - name: 'hasBackdrop', - type: 'boolean', - description: 'Displays a backdrop behind the popover', - default: 'false', - }, - { - name: 'blockScroll', - type: 'boolean', - description: 'Prevents scrolling of the page when popover is open', - default: 'false', - }, - { - name: 'outsideClose', - type: 'boolean', - description: - 'Closes the popover when the user clicks outside or presses the escape key', - default: 'false', - }, - { - name: 'stretchToOrigin', - type: 'boolean', - description: - 'Stretches the width of the popover to fit the origin element', - default: 'false', - }, - { - name: 'restoreFocus', - type: 'boolean', - description: - 'Restores focus to the origin element after the popover is closed', - default: 'false', - }, - { - name: 'positionY', - type: 'top | right | bottom | left', - description: - 'The vertical position of the popover relative to the origin', - default: 'bottom', - }, - ], - outputs: [ - { - name: 'opened', - description: 'Emits when the popover is opened', - value: 'void', - }, - { - name: 'closed', - description: 'Emits when the popover is closed', - value: 'void', - }, - ], - }, - { - name: 'PopoverOriginDirective', - type: 'directive', - selector: '[ktPopoverOrigin]', - description: 'The element to which the popover should be attached', - }, - ], - }; - - sourceTree: SourceTreeFolder[] = [ - { - name: 'popover', - files: [ - ...this.sourceTreeBuilder.fullComponent(ROOT, ROOT), - ...this.sourceTreeBuilder.directive('popover-origin', ROOT, true), - ], - hideName: true, - }, - ]; -} diff --git a/projects/docs/src/app/pages/progress-bar-page/progress-bar-page.component.css b/projects/docs/src/app/pages/progress-bar-page/progress-bar-page.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/projects/docs/src/app/pages/progress-bar-page/progress-bar-page.component.html b/projects/docs/src/app/pages/progress-bar-page/progress-bar-page.component.html deleted file mode 100644 index 9a43e87..0000000 --- a/projects/docs/src/app/pages/progress-bar-page/progress-bar-page.component.html +++ /dev/null @@ -1,15 +0,0 @@ - - - - - - - - - diff --git a/projects/docs/src/app/pages/progress-bar-page/progress-bar-page.component.ts b/projects/docs/src/app/pages/progress-bar-page/progress-bar-page.component.ts deleted file mode 100644 index b5e7efa..0000000 --- a/projects/docs/src/app/pages/progress-bar-page/progress-bar-page.component.ts +++ /dev/null @@ -1,58 +0,0 @@ -import { Component, inject } from '@angular/core'; -import { - ApiInfo, - ApiInfoComponent, -} from '../../blueprint/api-info/api-info.component'; -import { BlueprintPageComponent } from '../../blueprint/blueprint-page/blueprint-page.component'; -import { CommandInstallationComponent } from '../../blueprint/command-installation/command-installation.component'; -import { ShowCaseComponent } from '../../blueprint/show-case/show-case.component'; -import { - SourceTreeBuilder, - SourceTreeFolder, -} from '../../blueprint/source-tree/source-tree-builder'; -import { SourceTreeComponent } from '../../blueprint/source-tree/source-tree.component'; -import { ShowCaseProgressBarComponent } from '../../examples/progress-bar/show-case-progress-bar/show-case-progress-bar.component'; -const ROOT = 'progress-bar'; - -@Component({ - selector: 'doc-progress-bar-page', - imports: [ - BlueprintPageComponent, - ShowCaseComponent, - ShowCaseProgressBarComponent, - CommandInstallationComponent, - SourceTreeComponent, - ApiInfoComponent, - ], - templateUrl: './progress-bar-page.component.html', - styleUrl: './progress-bar-page.component.css', -}) -export class ProgressBarPageComponent { - sourceTreeBuilder = inject(SourceTreeBuilder); - - sourceTree: SourceTreeFolder[] = [ - { - name: ROOT, - files: this.sourceTreeBuilder.fullComponent(ROOT, ROOT), - hideName: true, - }, - ]; - - apiInfo: ApiInfo = { - entities: [ - { - name: 'ProgressBarComponent', - selector: 'app-progress-bar', - type: 'component', - inputs: [ - { - name: 'indeterminate', - type: 'boolean', - default: 'false', - description: 'show an indeterminate progress bar', - }, - ], - }, - ], - }; -} diff --git a/projects/docs/src/app/pages/radio-button-page/radio-button-page.component.css b/projects/docs/src/app/pages/radio-button-page/radio-button-page.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/projects/docs/src/app/pages/radio-button-page/radio-button-page.component.html b/projects/docs/src/app/pages/radio-button-page/radio-button-page.component.html deleted file mode 100644 index 722b850..0000000 --- a/projects/docs/src/app/pages/radio-button-page/radio-button-page.component.html +++ /dev/null @@ -1,13 +0,0 @@ - - - - - - - diff --git a/projects/docs/src/app/pages/radio-button-page/radio-button-page.component.ts b/projects/docs/src/app/pages/radio-button-page/radio-button-page.component.ts deleted file mode 100644 index 0be5025..0000000 --- a/projects/docs/src/app/pages/radio-button-page/radio-button-page.component.ts +++ /dev/null @@ -1,104 +0,0 @@ -import { Component, inject } from '@angular/core'; -import { ReactiveFormsModule } from '@angular/forms'; -import { - ApiInfo, - ApiInfoComponent, -} from '../../blueprint/api-info/api-info.component'; -import { - AUTO_GENERATED_API_DEFAULT_VALUE, - EMPTY_API_INPUT_DEFAULT_VALUE, -} from '../../blueprint/api-info/api-inputs/api-inputs.component'; -import { BlueprintPageComponent } from '../../blueprint/blueprint-page/blueprint-page.component'; -import { ShowCaseComponent } from '../../blueprint/show-case/show-case.component'; -import { - SourceTreeBuilder, - SourceTreeFolder, -} from '../../blueprint/source-tree/source-tree-builder'; -import { SourceTreeComponent } from '../../blueprint/source-tree/source-tree.component'; -import { ShowCaseRadioButtonComponent } from '../../examples/radio-button/show-case-radio-button/show-case-radio-button.component'; -const ROOT = 'radio-button'; -@Component({ - selector: 'doc-radio-button-page', - imports: [ - BlueprintPageComponent, - ShowCaseComponent, - ReactiveFormsModule, - ShowCaseRadioButtonComponent, - SourceTreeComponent, - ApiInfoComponent, - ], - templateUrl: './radio-button-page.component.html', - styleUrl: './radio-button-page.component.css', -}) -export class RadioButtonPageComponent { - sourceTreeBuilder = inject(SourceTreeBuilder); - sourceTree: SourceTreeFolder[] = [ - { - name: 'radio-button', - files: [ - ...this.sourceTreeBuilder.fullComponent(ROOT, ROOT), - this.sourceTreeBuilder.component('radio-button-icon', ROOT), - ...this.sourceTreeBuilder.fullComponent('radio-group', ROOT), - ], - hideName: true, - }, - ]; - - apiInfo: ApiInfo = { - entities: [ - { - name: 'radio-group', - selector: 'app-radio-group', - type: 'component', - formBindable: true, - inputs: [ - { - name: 'vertical', - type: 'boolean', - description: 'displays radio-buttons vertically', - default: 'false', - }, - { - name: 'name', - type: 'string', - description: - 'Sets name attribute of the all inner input[type="radio"]', - default: AUTO_GENERATED_API_DEFAULT_VALUE, - }, - { - name: 'compareWith', - type: '(o1: any, o2: any) => boolean', - description: - 'Function to compare the option values with the selected values. The first argument is a value from an option. The second is a value from the selection', - default: '(o1, o2) => o1 === o2', - }, - ], - }, - { - name: 'radio-button', - selector: 'app-radio-button', - type: 'component', - inputs: [ - { - name: 'disabled', - type: 'boolean', - description: 'Disables the radio-button', - default: 'false', - }, - { - name: 'id', - type: 'string', - description: 'Sets id attribute to the input[type="radio"]', - default: AUTO_GENERATED_API_DEFAULT_VALUE, - }, - { - name: 'value', - type: 'any', - description: 'Sets the value of radio-button', - default: EMPTY_API_INPUT_DEFAULT_VALUE, - }, - ], - }, - ], - }; -} diff --git a/projects/docs/src/app/pages/schematics-usage-page/schematics-usage-page.component.css b/projects/docs/src/app/pages/schematics-usage-page/schematics-usage-page.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/projects/docs/src/app/pages/schematics-usage-page/schematics-usage-page.component.html b/projects/docs/src/app/pages/schematics-usage-page/schematics-usage-page.component.html deleted file mode 100644 index 933ece2..0000000 --- a/projects/docs/src/app/pages/schematics-usage-page/schematics-usage-page.component.html +++ /dev/null @@ -1,267 +0,0 @@ - -

- NgVerse schematics make integrating NgVerse into your Angular project a - breeze. There are two primary commands you can run: -

-
    -
  • ng add ngverse
    • -
  • ng g ngverse:element (g is an alias for generate)
    • -
-

This page explains each command and its options in detail.

-

ng g ngverse:element [element-name]

-

- The ng g ngverse:element command adds a NgVerse element to your - project. Below are the available parameters: -

- -

1. name (Required)

-

The name of the element you want to add.

-
    -
  • - You can specify the name using either of the following: -
      -
    • --name=button
      • -
    • - By passing it as the first positional argument:
      - Example: ng g ngverse:element button -
      • -
    -
    • -
  • Both methods achieve the same result.
    • -
-

2. project (Optional)

-

The name of the Angular project where the element should be added.

-
    -
  • - If your workspace contains multiple projects, you can specify which one to - use by passing the project name. -
    • -
  • - By default, the element is added to the default project specified in - angular.json. -
    • -
  • - If your workspace has only one project, the element will be added - automatically without needing this parameter. -
    • -
-

3. replace (Optional, default: false)

-

Determines whether to replace existing files with the same name.

-
    -
  • - If a folder with the same name as the element already exists, the - schematic will throw an error to prevent accidental file deletions. -
    • -
  • - If you want to override the existing files, set replace=true. -
    • -
  • Example: ng g ngverse:element button --replace=true
    • -
-

- ⚠️ Use this option with caution to avoid overwriting important - files. -

-

4. includeTests (Optional, default: false)

-

Specifies whether to include test files for the element.

-
    -
  • - NgVerse elements come with a full suite of tests to help ensure - reliability. However, including tests is optional for the following - reasons: -
      -
    • - Code changes may break tests:
      - After modifying an element, tests may fail because the behavior has - changed. In this case, you would need to debug and update the test - files, which can take extra time and effort. -
      • -
    • - Test framework compatibility:
      - Our tests are written in Jasmine, so if you're using another framework - like Jest, the tests will not run at all.
      - Therefore, tests are disabled by default. -
      • -
    -
    • -
  • - If you want to include test files, use - includeTests=true.
    - Example: ng g ngverse:element button --includeTests=true -
    • -
-

- Keep in mind that we maintain and update our tests regularly. Tests are run - on every commit, merge, and release to ensure high quality. We take testing - seriously, so you don’t have to worry about test coverage! 🚀 -

-

5. path (Optional)

-

Specifies where to place the element folder.

-
    -
  • - By default, the element is added to the root folder - (/src/app). -
    • -
  • - You can specify a different location using the - --path parameter.
    - Example: ng g ngverse:element button --path=core
    - This will place the element in /src/app/core. -
    • -
  • - You can also change the destination by including the path in the element - name:
    - Example: ng g ngverse:element core/button
    - This will place the element in /src/app/core. -
    • -
-

- Most components are self-isolated, meaning all their dependencies are - located within the element folder. However, some components, like - select, depend on other elements (e.g., - popover and listbox). -

-

- In these cases, all related element folders must reside within the same - parent directory because the imports are relative and expect the same folder - structure. While you can manually update the imports if necessary, we - recommend keeping all elements in the same directory to avoid issues. -

-

Global Configuration

-

- You can set a global configuration for the - ng g ngverse:element schematics. -

-

- For example, if you want to place all elements inside the - core/ui folder by default, you can add the following - configuration in your angular.json file: -

- - - -

Once this is configured, running the command:

- - -

- will automatically place the element inside the core/ui folder, - without needing to specify the --path parameter every time. -

-

ng add ngverse

- -

- The ng add ngverse command configures your project to use the - NgVerse library. Let’s first explain what it does, and then describe the - parameters you can pass. The command performs the following actions: -

- -

1. Install @angular/cdk

-

- Angular CDK - is installed to support features like accessibility, keyboard navigation, - and floating panels. -

-
    -
  • - The Angular CDK provides powerful tools that make these features easier to - implement, reducing complexity and preventing bugs. -
    • -
  • - Without this library, creating such features from scratch would be a - hassle. -
    • -
- -

2. Install ngverse schematics

-

- NgVerse schematics are installed to automate adding elements to your - project. -

-
    -
  • - ⚠️ This step does not install the NgVerse component library itself. You - won’t be able to import components directly from - ngverse. You'll need to add them manually using the command: - ng g ngverse:element. -
    • -
- -

3. Add ngverse.css to your project

-

- The file ngverse.css is added and imported in your - styles.css file. -

-
    -
  • - This file contains predefined CSS variables to style NgVerse elements out - of the box, without requiring any additional CSS. -
    • -
  • - It also includes core CSS from @angular/cdk and the - normalize.css file for consistent browser styling.
    - (More details about it on the - theming page.) -
    • -
- -

4. Add animations to your project

-

- NgVerse elements rely on animations for smooth transitions and effects. To - ensure a good user experience, animation support is added to your app - configuration. -

-
    -
  • - The command adds either provideAnimationsAsync or - provideNoopAnimations in app.config, based on - your prompt choice (explained below). -
    • -
- -

After a successful run, NgVerse is ready to use!

- -

Parameters for ng add ngverse

-

The ng add ngverse command has a couple of parameters:

- -

1. project (Optional)

-

Specifies which Angular project to configure.

-
    -
  • - If no project is provided, the default project in your - angular.json file will be used. -
    • -
- -

2. Prompt choice (During installation)

-

- During installation, you will be prompted to choose how animations should be - handled: -

-
    -
  • - enable: Adds provideAnimationsAsync in - app.config.
    - This enables animations for NgVerse elements. -
    • -
  • - noop: Adds provideNoopAnimations() in - app.config.
    - This disables animations completely but ensures NgVerse elements won’t - produce runtime errors. -
    • -
  • - skip: Skips changes to app.config.
    - Choose this option if your project already uses animations. -
    • -
- diff --git a/projects/docs/src/app/pages/schematics-usage-page/schematics-usage-page.component.ts b/projects/docs/src/app/pages/schematics-usage-page/schematics-usage-page.component.ts deleted file mode 100644 index 18ab341..0000000 --- a/projects/docs/src/app/pages/schematics-usage-page/schematics-usage-page.component.ts +++ /dev/null @@ -1,20 +0,0 @@ -import { ChangeDetectionStrategy, Component } from '@angular/core'; -import { RouterLink } from '@angular/router'; -import { BlogPageComponent } from '../../blog/blog-page/blog-page.component'; -import { SourceCodeComponent } from '../../blueprint/source-code/source-code.component'; - -@Component({ - selector: 'doc-schematics-usage-page', - imports: [BlogPageComponent, SourceCodeComponent, RouterLink], - templateUrl: './schematics-usage-page.component.html', - styleUrl: './schematics-usage-page.component.css', - changeDetection: ChangeDetectionStrategy.OnPush, -}) -export class SchematicsUsagePageComponent { - configCode = ` "projectType": "application", - "schematics": { - "ngverse:element": { - "path": "core/ui" - } - }`; -} diff --git a/projects/docs/src/app/pages/select-page/select-page.component.css b/projects/docs/src/app/pages/select-page/select-page.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/projects/docs/src/app/pages/select-page/select-page.component.html b/projects/docs/src/app/pages/select-page/select-page.component.html deleted file mode 100644 index b533b96..0000000 --- a/projects/docs/src/app/pages/select-page/select-page.component.html +++ /dev/null @@ -1,18 +0,0 @@ - - - - - - - - - - - diff --git a/projects/docs/src/app/pages/select-page/select-page.component.ts b/projects/docs/src/app/pages/select-page/select-page.component.ts deleted file mode 100644 index 2a51be9..0000000 --- a/projects/docs/src/app/pages/select-page/select-page.component.ts +++ /dev/null @@ -1,140 +0,0 @@ -import { Component, inject } from '@angular/core'; -import { ReactiveFormsModule } from '@angular/forms'; -import { - ApiInfo, - ApiInfoComponent, -} from '../../blueprint/api-info/api-info.component'; -import { EMPTY_API_INPUT_DEFAULT_VALUE } from '../../blueprint/api-info/api-inputs/api-inputs.component'; -import { BlueprintPageComponent } from '../../blueprint/blueprint-page/blueprint-page.component'; -import { CommandInstallationComponent } from '../../blueprint/command-installation/command-installation.component'; -import { - Prerequisite, - PrerequisitesComponent, -} from '../../blueprint/prerequisites/prerequisites.component'; -import { ShowCaseComponent } from '../../blueprint/show-case/show-case.component'; -import { - SourceTreeBuilder, - SourceTreeFolder, -} from '../../blueprint/source-tree/source-tree-builder'; -import { SourceTreeComponent } from '../../blueprint/source-tree/source-tree.component'; -import { ShowCaseSelectComponent } from '../../examples/select/show-case-select/show-case-select.component'; -const ROOT = 'select'; -@Component({ - selector: 'doc-select-page', - imports: [ - BlueprintPageComponent, - ShowCaseComponent, - ReactiveFormsModule, - ShowCaseSelectComponent, - CommandInstallationComponent, - SourceTreeComponent, - ApiInfoComponent, - PrerequisitesComponent, - ], - templateUrl: './select-page.component.html', - styleUrl: './select-page.component.css', -}) -export class SelectPageComponent { - sourceTreeBuilder = inject(SourceTreeBuilder); - sourceTree: SourceTreeFolder[] = [ - { - name: ROOT, - files: [ - ...this.sourceTreeBuilder.fullComponent(ROOT, ROOT), - ...this.sourceTreeBuilder.fullComponent('option', ROOT), - this.sourceTreeBuilder.component('option-group', ROOT), - this.sourceTreeBuilder.component('option-group-label', ROOT), - this.sourceTreeBuilder.file('select-check-icon.component', ROOT), - this.sourceTreeBuilder.file('select-icon.component', ROOT), - ], - hideName: true, - }, - ]; - - prerequisites: Prerequisite[] = [ - { - name: 'popover', - label: 'Popover', - }, - ]; - - apiInfo: ApiInfo = { - ariaLink: 'https://www.w3.org/WAI/ARIA/apg/patterns/combobox/', - entities: [ - { - name: 'SelectComponent', - type: 'component', - selector: 'app-select', - formBindable: true, - inputs: [ - { - name: 'multiple', - type: 'boolean', - default: 'false', - description: - 'determines whether the select allows multiple selection', - }, - { - name: 'placeholder', - type: 'string', - default: EMPTY_API_INPUT_DEFAULT_VALUE, - description: 'determines the placeholder text', - }, - { - name: 'compareWith', - type: '(o1: unknown, o2: unknown) => o1 === o2', - default: 'o1 === o2', - description: 'determines the compare function', - }, - { - name: 'stretch', - type: 'boolean', - default: 'false', - description: - 'determines whether the select button should take the full width of the container', - }, - ], - }, - { - name: 'OptionComponent', - type: 'component', - selector: 'app-option', - inputs: [ - { - name: 'value', - type: 'unknown', - description: 'The value of the option', - default: EMPTY_API_INPUT_DEFAULT_VALUE, - }, - { - name: 'disabled', - type: 'boolean', - description: 'Determines whether the option is disabled', - default: 'false', - }, - ], - }, - { - name: 'OptionGroupComponent', - type: 'component', - selector: 'app-option-group', - description: 'Groups related options', - inputs: [ - { - name: 'label', - type: 'string', - description: 'The label of the option group', - default: EMPTY_API_INPUT_DEFAULT_VALUE, - }, - ], - }, - { - name: 'OptionGroupLabelComponent', - type: 'component', - selector: 'app-option-group-label', - description: - 'The label of the option group, you can use this component instead of label input, when you need more customization', - }, - ], - }; -} diff --git a/projects/docs/src/app/pages/session-storage-page/session-storage-page.component.css b/projects/docs/src/app/pages/session-storage-page/session-storage-page.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/projects/docs/src/app/pages/session-storage-page/session-storage-page.component.html b/projects/docs/src/app/pages/session-storage-page/session-storage-page.component.html deleted file mode 100644 index dc15b19..0000000 --- a/projects/docs/src/app/pages/session-storage-page/session-storage-page.component.html +++ /dev/null @@ -1,12 +0,0 @@ - - - - - -

Session storage is great

- - - diff --git a/projects/docs/src/app/pages/session-storage-page/session-storage-page.component.ts b/projects/docs/src/app/pages/session-storage-page/session-storage-page.component.ts deleted file mode 100644 index 42aa837..0000000 --- a/projects/docs/src/app/pages/session-storage-page/session-storage-page.component.ts +++ /dev/null @@ -1,106 +0,0 @@ -import { ChangeDetectionStrategy, Component } from '@angular/core'; -import { ShowCaseComponent } from '../../blueprint/show-case/show-case.component'; -import { ApiSectionComponent } from '../../core/kit-page/api-section/api-section.component'; -import { KitPageComponent } from '../../core/kit-page/kit-page.component'; -import { ApiSection } from '../../core/kit-page/kit-page.types'; -import { OverviewSectionComponent } from '../../core/kit-page/overview-section/overview-section.component'; -import { ShowCaseSessionStorageComponent } from '../../examples/session-storage/show-case-session-storage/show-case-session-storage.component'; - -@Component({ - selector: 'doc-session-storage-page', - imports: [ - ShowCaseComponent, - ShowCaseSessionStorageComponent, - KitPageComponent, - OverviewSectionComponent, - ApiSectionComponent, - ], - templateUrl: './session-storage-page.component.html', - styleUrl: './session-storage-page.component.css', - changeDetection: ChangeDetectionStrategy.OnPush, -}) -export class SessionStoragePageComponent { - api: ApiSection = { - services: [ - { - name: 'SessionStorageService', - description: '', - methods: [ - { - name: 'getItem', - returnType: 'string | null', - description: 'Returns the value associated with the given key.', - params: [ - { - name: 'key', - type: 'string', - description: 'The key of the value to retrieve.', - }, - ], - }, - { - name: 'setItem', - returnType: 'void', - description: 'Associates a key with a given value.', - params: [ - { - name: 'key', - type: 'string', - description: 'The key of the value to set.', - }, - { - name: 'value', - type: 'string', - description: 'The value to set.', - }, - ], - }, - { - name: 'removeItem', - returnType: 'void', - description: 'Removes the value associated with the given key.', - params: [ - { - name: 'key', - type: 'string', - description: 'The key of the value to remove.', - }, - ], - }, - { - name: 'clear', - returnType: 'void', - description: 'Removes all values from the storage.', - }, - { - name: 'key', - returnType: 'string | null', - description: 'Returns the key of the item at the given index.', - params: [ - { - name: 'index', - type: 'number', - description: 'The index of the item.', - }, - ], - }, - ], - properties: [ - { - name: 'length', - type: 'get', - returnType: 'number', - description: 'The number of items in the storage.', - }, - { - name: 'enabled', - type: 'get', - returnType: 'boolean', - description: - 'Whether the session storage is enabled. if SSR the value is false.', - }, - ], - }, - ], - }; -} diff --git a/projects/docs/src/app/pages/skeleton-page/skeleton-page.component.css b/projects/docs/src/app/pages/skeleton-page/skeleton-page.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/projects/docs/src/app/pages/skeleton-page/skeleton-page.component.html b/projects/docs/src/app/pages/skeleton-page/skeleton-page.component.html deleted file mode 100644 index 0705b24..0000000 --- a/projects/docs/src/app/pages/skeleton-page/skeleton-page.component.html +++ /dev/null @@ -1,12 +0,0 @@ - - - - - - - - - diff --git a/projects/docs/src/app/pages/skeleton-page/skeleton-page.component.ts b/projects/docs/src/app/pages/skeleton-page/skeleton-page.component.ts deleted file mode 100644 index 7cf9c15..0000000 --- a/projects/docs/src/app/pages/skeleton-page/skeleton-page.component.ts +++ /dev/null @@ -1,51 +0,0 @@ -import { Component, inject } from '@angular/core'; -import { - ApiInfo, - ApiInfoComponent, -} from '../../blueprint/api-info/api-info.component'; -import { BlueprintPageComponent } from '../../blueprint/blueprint-page/blueprint-page.component'; -import { CommandInstallationComponent } from '../../blueprint/command-installation/command-installation.component'; -import { ShowCaseComponent } from '../../blueprint/show-case/show-case.component'; -import { - SourceTreeBuilder, - SourceTreeFolder, -} from '../../blueprint/source-tree/source-tree-builder'; -import { SourceTreeComponent } from '../../blueprint/source-tree/source-tree.component'; -import { ShowCaseSkeletonComponent } from '../../examples/skeleton/show-case-skeleton/show-case-skeleton.component'; -const ROOT = 'skeleton'; -@Component({ - selector: 'doc-skeleton-page', - imports: [ - BlueprintPageComponent, - ShowCaseComponent, - CommandInstallationComponent, - ShowCaseSkeletonComponent, - SourceTreeComponent, - ApiInfoComponent, - ], - templateUrl: './skeleton-page.component.html', - styleUrl: './skeleton-page.component.css', -}) -export class SkeletonPageComponent { - sourceTreeBuilder = inject(SourceTreeBuilder); - - sourceTree: SourceTreeFolder[] = [ - { - name: 'skeleton', - files: [...this.sourceTreeBuilder.inlineComponent(ROOT, ROOT)], - hideName: true, - }, - ]; - - apiInfo: ApiInfo = { - entities: [ - { - name: 'SkeletonComponent', - type: 'component', - selector: 'app-skeleton', - description: `The Skeleton component is an placeholder used to indicate loading content. - It can be styled with CSS to customize its size, shape.`, - }, - ], - }; -} diff --git a/projects/docs/src/app/pages/switch-page/switch-page.component.css b/projects/docs/src/app/pages/switch-page/switch-page.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/projects/docs/src/app/pages/switch-page/switch-page.component.html b/projects/docs/src/app/pages/switch-page/switch-page.component.html deleted file mode 100644 index 96be75c..0000000 --- a/projects/docs/src/app/pages/switch-page/switch-page.component.html +++ /dev/null @@ -1,14 +0,0 @@ - - - - - - - - diff --git a/projects/docs/src/app/pages/switch-page/switch-page.component.ts b/projects/docs/src/app/pages/switch-page/switch-page.component.ts deleted file mode 100644 index 8a751cc..0000000 --- a/projects/docs/src/app/pages/switch-page/switch-page.component.ts +++ /dev/null @@ -1,71 +0,0 @@ -import { Component, inject } from '@angular/core'; -import { FormsModule } from '@angular/forms'; -import { - ApiInfo, - ApiInfoComponent, -} from '../../blueprint/api-info/api-info.component'; -import { BlueprintPageComponent } from '../../blueprint/blueprint-page/blueprint-page.component'; -import { CommandInstallationComponent } from '../../blueprint/command-installation/command-installation.component'; -import { ShowCaseComponent } from '../../blueprint/show-case/show-case.component'; -import { - SourceTreeBuilder, - SourceTreeFolder, -} from '../../blueprint/source-tree/source-tree-builder'; -import { SourceTreeComponent } from '../../blueprint/source-tree/source-tree.component'; -import { ShowCaseSwitchComponent } from '../../examples/switch/show-case-switch/show-case-switch.component'; -const ROOT = 'switch'; -@Component({ - selector: 'doc-switch-page', - imports: [ - BlueprintPageComponent, - ShowCaseComponent, - FormsModule, - ShowCaseSwitchComponent, - CommandInstallationComponent, - SourceTreeComponent, - ApiInfoComponent, - ], - templateUrl: './switch-page.component.html', - styleUrl: './switch-page.component.css', -}) -export class SwitchPageComponent { - sourceTreeBuilder = inject(SourceTreeBuilder); - sourceTree: SourceTreeFolder[] = [ - { - name: 'switch', - files: [...this.sourceTreeBuilder.fullComponent(ROOT, ROOT)], - hideName: true, - }, - ]; - apiInfo: ApiInfo = { - ariaLink: 'https://www.w3.org/WAI/ARIA/apg/patterns/switch/', - entities: [ - { - name: 'SwitchComponent', - selector: 'app-switch', - type: 'component', - formBindable: true, - inputs: [ - { - name: 'disabled', - type: 'boolean', - description: 'Disables the switch.', - default: 'false', - }, - { - name: 'required', - type: 'boolean', - description: 'Applies required validation to the switch.', - default: 'false', - }, - { - name: 'labelAlign', - type: 'start | end', - description: 'Specifies the alignment of the switch label.', - default: 'end', - }, - ], - }, - ], - }; -} diff --git a/projects/docs/src/app/pages/tab-page/tab-page.component.css b/projects/docs/src/app/pages/tab-page/tab-page.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/projects/docs/src/app/pages/tab-page/tab-page.component.html b/projects/docs/src/app/pages/tab-page/tab-page.component.html deleted file mode 100644 index eefacc4..0000000 --- a/projects/docs/src/app/pages/tab-page/tab-page.component.html +++ /dev/null @@ -1,10 +0,0 @@ - - - - - - - diff --git a/projects/docs/src/app/pages/tab-page/tab-page.component.ts b/projects/docs/src/app/pages/tab-page/tab-page.component.ts deleted file mode 100644 index a68590b..0000000 --- a/projects/docs/src/app/pages/tab-page/tab-page.component.ts +++ /dev/null @@ -1,69 +0,0 @@ -import { Component, inject, signal } from '@angular/core'; -import { - ApiInfo, - ApiInfoComponent, -} from '../../blueprint/api-info/api-info.component'; -import { BlueprintPageComponent } from '../../blueprint/blueprint-page/blueprint-page.component'; -import { ShowCaseComponent } from '../../blueprint/show-case/show-case.component'; -import { - SourceTreeBuilder, - SourceTreeFolder, -} from '../../blueprint/source-tree/source-tree-builder'; -import { SourceTreeComponent } from '../../blueprint/source-tree/source-tree.component'; -import { ShowCaseTabComponent } from '../../examples/tab/show-case-tab/show-case-tab.component'; -const ROOT = 'tab'; -@Component({ - selector: 'doc-tab-page', - imports: [ - BlueprintPageComponent, - ShowCaseComponent, - ShowCaseTabComponent, - SourceTreeComponent, - ApiInfoComponent, - ], - templateUrl: './tab-page.component.html', - styleUrl: './tab-page.component.css', -}) -export class TabPageComponent { - selectedIndex = signal(0); - sourceTreeBuilder = inject(SourceTreeBuilder); - - apiInfo: ApiInfo = { - entities: [ - { - name: 'TabGroupComponent', - type: 'component', - selector: 'app-tab-group', - }, - { - name: 'TabComponent', - type: 'component', - selector: 'app-tab', - }, - { - name: 'TabBodyDirective', - type: 'directive', - selector: '[appTabBody]', - }, - { - name: 'TabHeaderDirective', - type: 'directive', - selector: '[appTabHeader]', - }, - ], - }; - - sourceTree: SourceTreeFolder[] = [ - { - name: ROOT, - files: [ - ...this.sourceTreeBuilder.fullComponent(ROOT, ROOT), - ...this.sourceTreeBuilder.fullInlineComponent('tab-group-header', ROOT), - ...this.sourceTreeBuilder.fullComponent('tab-group', ROOT), - ...this.sourceTreeBuilder.directive('tab-body', ROOT), - ...this.sourceTreeBuilder.directive('tab-header', ROOT), - ], - hideName: true, - }, - ]; -} diff --git a/projects/docs/src/app/pages/textarea-page/textarea-page.component.css b/projects/docs/src/app/pages/textarea-page/textarea-page.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/projects/docs/src/app/pages/textarea-page/textarea-page.component.html b/projects/docs/src/app/pages/textarea-page/textarea-page.component.html deleted file mode 100644 index 2bcf9b5..0000000 --- a/projects/docs/src/app/pages/textarea-page/textarea-page.component.html +++ /dev/null @@ -1,12 +0,0 @@ - - - - - - - - - diff --git a/projects/docs/src/app/pages/textarea-page/textarea-page.component.ts b/projects/docs/src/app/pages/textarea-page/textarea-page.component.ts deleted file mode 100644 index 7da34fc..0000000 --- a/projects/docs/src/app/pages/textarea-page/textarea-page.component.ts +++ /dev/null @@ -1,60 +0,0 @@ -import { Component, inject } from '@angular/core'; -import { - ApiInfo, - ApiInfoComponent, -} from '../../blueprint/api-info/api-info.component'; -import { BlueprintPageComponent } from '../../blueprint/blueprint-page/blueprint-page.component'; -import { CommandInstallationComponent } from '../../blueprint/command-installation/command-installation.component'; -import { ShowCaseComponent } from '../../blueprint/show-case/show-case.component'; -import { - SourceTreeBuilder, - SourceTreeFolder, -} from '../../blueprint/source-tree/source-tree-builder'; -import { SourceTreeComponent } from '../../blueprint/source-tree/source-tree.component'; -import { ShowCaseTextareaComponent } from '../../examples/textarea/show-case-textarea/show-case-textarea.component'; -const ROOT = 'textarea'; -@Component({ - selector: 'doc-textarea-page', - imports: [ - BlueprintPageComponent, - ShowCaseComponent, - CommandInstallationComponent, - SourceTreeComponent, - ApiInfoComponent, - ShowCaseTextareaComponent, - ], - templateUrl: './textarea-page.component.html', - styleUrl: './textarea-page.component.css', -}) -export class TextareaPageComponent { - sourceTreeBuilder = inject(SourceTreeBuilder); - - sourceTree: SourceTreeFolder[] = [ - { - name: 'textarea', - files: [...this.sourceTreeBuilder.directive(ROOT, ROOT, true)], - hideName: true, - }, - ]; - - apiInfo: ApiInfo = { - ariaDescription: - 'The Textarea directive uses the native `, - changeDetection: ChangeDetectionStrategy.OnPush, -}) -class TextareaTestComponent { - resize = signal('none'); -} diff --git a/projects/ngverse/src/lib/textarea/textarea.directive.ts b/projects/ngverse/src/lib/textarea/textarea.directive.ts deleted file mode 100644 index 7e31a9d..0000000 --- a/projects/ngverse/src/lib/textarea/textarea.directive.ts +++ /dev/null @@ -1,20 +0,0 @@ -import { Directive, input } from '@angular/core'; - -export type TEXTAREA_RESIZE_TYPES = - | 'none' - | 'both' - | 'horizontal' - | 'vertical' - | 'block' - | 'inline'; - -@Directive({ - selector: 'textarea[appTextarea]', - host: { - '[style.resize]': 'resize()', - '[class.app-textarea]': 'true', - }, -}) -export class TextareaDirective { - resize = input('none'); -} diff --git a/projects/ngverse/src/lib/toast/toast-close.component.ts b/projects/ngverse/src/lib/toast/toast-close.component.ts deleted file mode 100644 index bd74633..0000000 --- a/projects/ngverse/src/lib/toast/toast-close.component.ts +++ /dev/null @@ -1,29 +0,0 @@ -import { ChangeDetectionStrategy, Component } from '@angular/core'; - -@Component({ - selector: 'app-toast-close-icon', - styles: [ - ` - :host { - display: flex; - } - `, - ], - template: ` - - - `, - changeDetection: ChangeDetectionStrategy.OnPush, -}) -export class ToastCloseIconComponent {} diff --git a/projects/ngverse/src/lib/toast/toast.component.css b/projects/ngverse/src/lib/toast/toast.component.css deleted file mode 100644 index e7c04ae..0000000 --- a/projects/ngverse/src/lib/toast/toast.component.css +++ /dev/null @@ -1,34 +0,0 @@ -:host { - display: block; - display: flex; - align-items: center; - justify-content: space-between; - background: var(--color-inverse); - color: var(--color-inverse-foreground); - border: var(--border); - border-radius: var(--border-radius); - padding: 12px 16px; - box-shadow: var(--color-shadow); - - &.success { - background: var(--color-success); - color: var(--color-success-foreground); - } - &.danger { - background: var(--color-danger); - color: var(--color-danger-foreground); - } - &.warning { - background: var(--color-warning); - color: var(--color-warning-foreground); - } -} - -.toast-close-button { - margin-left: auto; - display: flex; - background: transparent; - outline: none; - border: 0; - cursor: pointer; -} diff --git a/projects/ngverse/src/lib/toast/toast.component.html b/projects/ngverse/src/lib/toast/toast.component.html deleted file mode 100644 index 6fb3021..0000000 --- a/projects/ngverse/src/lib/toast/toast.component.html +++ /dev/null @@ -1,6 +0,0 @@ -
{{ message() }}
-@if (showCloseIcon()) { - -} diff --git a/projects/ngverse/src/lib/toast/toast.component.spec.ts b/projects/ngverse/src/lib/toast/toast.component.spec.ts deleted file mode 100644 index 6299925..0000000 --- a/projects/ngverse/src/lib/toast/toast.component.spec.ts +++ /dev/null @@ -1,59 +0,0 @@ -import { ComponentFixture, TestBed } from '@angular/core/testing'; - -import { provideExperimentalZonelessChangeDetection } from '@angular/core'; -import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; -import { ToastComponent } from './toast.component'; - -describe('ToastComponent', () => { - let component: ToastComponent; - let fixture: ComponentFixture; - - beforeEach(async () => { - await TestBed.configureTestingModule({ - providers: [provideExperimentalZonelessChangeDetection()], - imports: [ToastComponent, BrowserAnimationsModule], - }).compileComponents(); - - fixture = TestBed.createComponent(ToastComponent); - component = fixture.componentInstance; - }); - - it('should create', () => { - expect(component).toBeTruthy(); - }); - it("should display message 'Hello, World!'", async () => { - component.message.set('Hello, World!'); - await fixture.whenStable(); - expect(fixture.nativeElement.textContent).toContain('Hello, World!'); - }); - it('should apply action as class', async () => { - component.type.set('success'); - await fixture.whenStable(); - expect(fixture.nativeElement.classList.contains('success')).toBeTrue(); - }); - it("should show close icon when 'showCloseIcon' is true", async () => { - component.showCloseIcon.set(true); - await fixture.whenStable(); - - expect( - fixture.nativeElement.querySelector('.toast-close-icon') - ).toBeTruthy(); - }); - it("should hide close icon when 'showCloseIcon' is false", async () => { - component.showCloseIcon.set(false); - await fixture.whenStable(); - - expect( - fixture.nativeElement.querySelector('.toast-close-icon') - ).toBeFalsy(); - }); - it("should have role 'alert'", () => { - expect(fixture.nativeElement.getAttribute('role')).toBe('alert'); - }); - it("click close icon should emit 'close' event", async () => { - await fixture.whenStable(); - const spy = spyOn(component, 'exit'); - fixture.nativeElement.querySelector('.toast-close-icon').click(); - expect(spy).toHaveBeenCalled(); - }); -}); diff --git a/projects/ngverse/src/lib/toast/toast.component.ts b/projects/ngverse/src/lib/toast/toast.component.ts deleted file mode 100644 index b148824..0000000 --- a/projects/ngverse/src/lib/toast/toast.component.ts +++ /dev/null @@ -1,57 +0,0 @@ -import { - animate, - AnimationEvent, - style, - transition, - trigger, -} from '@angular/animations'; -import { ChangeDetectionStrategy, Component, signal } from '@angular/core'; -import { Subject } from 'rxjs'; -import { ToastCloseIconComponent } from './toast-close.component'; -import { TOAST_POSITION } from './toast.service'; - -@Component({ - selector: 'app-toast', - imports: [ToastCloseIconComponent], - templateUrl: './toast.component.html', - styleUrl: './toast.component.css', - changeDetection: ChangeDetectionStrategy.OnPush, - animations: [ - trigger('toggle', [ - transition('* => enter', [ - style({ transform: 'scale(0.8)', opacity: 0 }), - animate('150ms ease-out', style({ transform: 'scale(1)', opacity: 1 })), - ]), - transition('* => exit', [ - animate('150ms ease-in', style({ opacity: 0 })), - ]), - ]), - ], - host: { - role: 'alert', - '[class.toaster]': 'true', - '[class]': 'type()', - '[@toggle]': 'animationState()', - '(@toggle.done)': 'onDone($event)', - }, -}) -export class ToastComponent { - message = signal(''); - type = signal(''); - showCloseIcon = signal(true); - position = signal('right_bottom'); - animationState = signal<'enter' | 'exit'>('enter'); - private _onExit = new Subject(); - onExit = this._onExit.asObservable(); - - onDone($event: AnimationEvent) { - if ($event.toState === 'exit') { - this._onExit.next(); - this._onExit.complete(); - } - } - - exit() { - this.animationState.set('exit'); - } -} diff --git a/projects/ngverse/src/lib/toast/toast.service.spec.ts b/projects/ngverse/src/lib/toast/toast.service.spec.ts deleted file mode 100644 index 5bdcc81..0000000 --- a/projects/ngverse/src/lib/toast/toast.service.spec.ts +++ /dev/null @@ -1,128 +0,0 @@ -import { DOCUMENT } from '@angular/common'; -import { - ChangeDetectionStrategy, - Component, - DebugElement, - provideExperimentalZonelessChangeDetection, -} from '@angular/core'; -import { ComponentFixture, TestBed } from '@angular/core/testing'; -import { By } from '@angular/platform-browser'; -import { provideNoopAnimations } from '@angular/platform-browser/animations'; -import { ToastComponent } from './toast.component'; -import { ToastService } from './toast.service'; - -describe('ToastService', () => { - let service: ToastService; - let fixture: ComponentFixture; - let documentDebugElement: DebugElement; - - beforeEach(async () => { - await TestBed.configureTestingModule({ - imports: [ToastTestComponent], - providers: [ - provideNoopAnimations(), - provideExperimentalZonelessChangeDetection(), - ], - }).compileComponents(); - service = TestBed.inject(ToastService); - - fixture = TestBed.createComponent(ToastTestComponent); - // component = fixture.componentInstance; - const document: Document = TestBed.inject(DOCUMENT); - - // Wrap the document body in a DebugElement - documentDebugElement = new DebugElement(document.body); - }); - - function toastDebugElement() { - return documentDebugElement.query(By.directive(ToastComponent)); - } - - function toastCompInstance() { - return toastDebugElement().componentInstance as ToastComponent; - } - - it('should create', () => { - expect(service).toBeTruthy(); - }); - it('should pass message to toast', () => { - const message = 'Hello!'; - service.open({ - message, - }); - expect(toastCompInstance().message()).toBe(message); - }); - it('should close toast automatically after 10ms', async () => { - service.open({ - message: 'Hello, World!', - closeDelay: 10, - }); - expect(toastDebugElement()).toBeTruthy(); - toastDebugElement().triggerEventHandler('animationend', { - animationName: '_toast-exit', - }); - await new Promise((resolve) => setTimeout(resolve, 10)); - await fixture.whenStable(); - expect(toastDebugElement()).toBeNull(); - }); - it('should pass showCloseIcon to toast', async () => { - service.open({ - message: 'Hello, World!', - showCloseIcon: false, - }); - expect(toastCompInstance().showCloseIcon()).toBe(false); - }); - it('should pass action to toast', async () => { - service.open({ - message: 'Hello, World!', - type: 'success', - }); - expect(toastCompInstance().type()).toBe('success'); - }); - it('should pass position to toast', async () => { - service.open({ - message: 'Hello, World!', - position: 'top_left', - }); - expect(toastCompInstance().position()).toBe('top_left'); - }); - it('should not close toast if autoClose is false', async () => { - service.open({ - message: 'Hello, World!', - autoClose: false, - closeDelay: 10, - }); - expect(toastDebugElement()).toBeTruthy(); - await new Promise((resolve) => setTimeout(resolve, 10)); - await fixture.whenStable(); - expect(toastDebugElement()).toBeTruthy(); - }); - it('should close previous toast if a new one is opened', async () => { - service.open({ - message: 'Hello, World!', - }); - - expect(toastDebugElement()).toBeTruthy(); - service.open({ - message: 'Hello, World!', - }); - - expect(document.querySelectorAll('app-toast').length).toBe(1); - }); - it("should close toast if 'close' event is emitted", async () => { - service.open({ - message: 'Hello, World!', - }); - expect(toastDebugElement()).toBeTruthy(); - toastCompInstance().exit(); - await fixture.whenStable(); - expect(toastDebugElement()).toBeNull(); - }); -}); - -@Component({ - imports: [], - template: `

Test

`, - changeDetection: ChangeDetectionStrategy.OnPush, -}) -class ToastTestComponent {} diff --git a/projects/ngverse/src/lib/toast/toast.service.ts b/projects/ngverse/src/lib/toast/toast.service.ts deleted file mode 100644 index b8603c1..0000000 --- a/projects/ngverse/src/lib/toast/toast.service.ts +++ /dev/null @@ -1,107 +0,0 @@ -import { Overlay, OverlayRef } from '@angular/cdk/overlay'; -import { ComponentPortal } from '@angular/cdk/portal'; -import { inject, Injectable } from '@angular/core'; -import { Subject, take } from 'rxjs'; -import { ToastComponent } from './toast.component'; - -export type TOAST_POSITION = - | 'top_left' - | 'top_center' - | 'top_right' - | 'right_center' - | 'right_bottom' - | 'bottom_center' - | 'bottom_left' - | 'left_center'; - -export type TOAST_TYPE = 'success' | 'warning' | 'danger' | 'default'; - -interface ToastOptions { - closeDelay?: number; - autoClose?: boolean; - showCloseIcon?: boolean; - message: string; - type?: TOAST_TYPE; - position?: TOAST_POSITION; -} - -@Injectable({ - providedIn: 'root', -}) -export class ToastService { - private overlay = inject(Overlay); - private overlayRef: OverlayRef | undefined; - private timeoutId: unknown; - - private resolvePosition(position: TOAST_POSITION) { - const positionStrategy = this.overlay.position().global(); - const offset = '20px'; - switch (position) { - case 'top_left': - return positionStrategy.top(offset).left(offset); - case 'top_center': - return positionStrategy.top(offset).centerHorizontally(offset); - case 'top_right': - return positionStrategy.top(offset).right(offset); - case 'right_center': - return positionStrategy.right(offset).centerVertically(offset); - case 'right_bottom': - return positionStrategy.right(offset).bottom(offset); - case 'bottom_center': - return positionStrategy.bottom(offset).centerHorizontally(offset); - case 'bottom_left': - return positionStrategy.bottom(offset).left(offset); - case 'left_center': - return positionStrategy.left(offset).centerVertically(); - } - } - - private getOptions(options: ToastOptions): Required { - return { - closeDelay: options.closeDelay ?? 3000, - autoClose: options.autoClose ?? true, - showCloseIcon: options.showCloseIcon ?? true, - message: options.message, - type: options.type || 'default', - position: options.position ?? 'bottom_center', - }; - } - - open(options: ToastOptions) { - this.close(); - - const portal = new ComponentPortal(ToastComponent); - const genOptions = this.getOptions(options); - const position = this.resolvePosition(genOptions.position); - this.overlayRef = this.overlay.create({ - positionStrategy: position, - }); - const compRef = this.overlayRef.attach(portal); - const instance = compRef.instance; - instance.message.set(genOptions.message); - instance.type.set(genOptions.type); - instance.showCloseIcon.set(genOptions.showCloseIcon); - instance.position.set(genOptions.position); - if (genOptions.autoClose) { - this.timeoutId = setTimeout(() => { - instance.exit(); - }, genOptions.closeDelay); - } - - instance.onExit.subscribe(() => { - this.close(); - }); - const closed$ = new Subject(); - - return closed$.pipe(take(1)); - } - - private close() { - if (this.timeoutId) { - clearTimeout(this.timeoutId as number); - this.timeoutId = undefined; - } - this.overlayRef?.dispose(); - this.overlayRef = undefined; - } -} diff --git a/projects/ngverse/src/lib/tooltip/tooltip-container.component.css b/projects/ngverse/src/lib/tooltip/tooltip-container.component.css deleted file mode 100644 index aa437e6..0000000 --- a/projects/ngverse/src/lib/tooltip/tooltip-container.component.css +++ /dev/null @@ -1,49 +0,0 @@ -.tooltip { - background-color: var(--color-inverse); - color: var(--color-inverse-foreground); - padding: 8px; - border-radius: 4px; - font-size: 14px; - transition: opacity 0.3s ease; - position: relative; -} - -.tooltip::after { - content: ''; - position: absolute; - width: 0; - height: 0; - border-style: solid; -} - -.tooltip.top::after { - top: 100%; - left: 50%; - transform: translateX(-50%); - border-width: 6px 6px 0 6px; - border-color: var(--color-inverse) transparent transparent transparent; -} - -.tooltip.right::after { - top: 50%; - left: -6px; - transform: translateY(-50%); - border-width: 6px 6px 6px 0; - border-color: transparent var(--color-inverse) transparent transparent; -} - -.tooltip.bottom::after { - bottom: 100%; - left: 50%; - transform: translateX(-50%); - border-width: 0 6px 6px 6px; - border-color: transparent transparent var(--color-inverse) transparent; -} - -.tooltip.left::after { - top: 50%; - right: -6px; - transform: translateY(-50%); - border-width: 6px 0 6px 6px; - border-color: transparent transparent transparent var(--color-inverse); -} diff --git a/projects/ngverse/src/lib/tooltip/tooltip-container.component.html b/projects/ngverse/src/lib/tooltip/tooltip-container.component.html deleted file mode 100644 index 7c1a7fc..0000000 --- a/projects/ngverse/src/lib/tooltip/tooltip-container.component.html +++ /dev/null @@ -1,7 +0,0 @@ - diff --git a/projects/ngverse/src/lib/tooltip/tooltip-container.component.spec.ts b/projects/ngverse/src/lib/tooltip/tooltip-container.component.spec.ts deleted file mode 100644 index d44338f..0000000 --- a/projects/ngverse/src/lib/tooltip/tooltip-container.component.spec.ts +++ /dev/null @@ -1,70 +0,0 @@ -import { ComponentFixture, TestBed } from '@angular/core/testing'; - -import { - AfterViewInit, - ChangeDetectionStrategy, - Component, - provideExperimentalZonelessChangeDetection, - TemplateRef, - viewChild, -} from '@angular/core'; -import { TooltipContainerComponent } from './tooltip-container.component'; - -describe('TooltipContainerComponent', () => { - let component: TooltipContainerComponent; - let fixture: ComponentFixture; - - beforeEach(async () => { - await TestBed.configureTestingModule({ - imports: [TooltipContainerComponent, TooltipContainerTestComponent], - providers: [provideExperimentalZonelessChangeDetection()], - }).compileComponents(); - - fixture = TestBed.createComponent(TooltipContainerComponent); - component = fixture.componentInstance; - }); - - it('should create', () => { - expect(component).toBeTruthy(); - }); - - it('should add position class to the tooltip container', async () => { - component.position.set('bottom'); - await fixture.whenStable(); - const tooltipContainer = fixture.nativeElement.querySelector('.tooltip'); - expect(tooltipContainer.classList).toContain('bottom'); - }); - it('should display message in the tooltip container', async () => { - component.message.set('Hello World'); - await fixture.whenStable(); - const tooltipContainer = fixture.nativeElement.querySelector('.tooltip'); - expect(tooltipContainer.textContent).toContain('Hello World'); - }); - it('should display content in the tooltip container', async () => { - const fixture = TestBed.createComponent(TooltipContainerTestComponent); - await fixture.whenStable(); - - const tooltipContainer = fixture.nativeElement.querySelector('.tooltip'); - expect(tooltipContainer.textContent).toBe('I am tooltip'); - }); -}); - -@Component({ - imports: [TooltipContainerComponent], - template: ` - I am tooltip - - `, - changeDetection: ChangeDetectionStrategy.OnPush, -}) -class TooltipContainerTestComponent implements AfterViewInit { - temp = viewChild>('temp'); - tooltipContainer = viewChild(TooltipContainerComponent); - - ngAfterViewInit(): void { - const temp = this.temp(); - if (temp) { - this.tooltipContainer()?.content.set(temp); - } - } -} diff --git a/projects/ngverse/src/lib/tooltip/tooltip-container.component.ts b/projects/ngverse/src/lib/tooltip/tooltip-container.component.ts deleted file mode 100644 index 28c4559..0000000 --- a/projects/ngverse/src/lib/tooltip/tooltip-container.component.ts +++ /dev/null @@ -1,37 +0,0 @@ -import { CdkPortalOutlet, TemplatePortal } from '@angular/cdk/portal'; -import { NgClass } from '@angular/common'; -import { - ChangeDetectionStrategy, - Component, - computed, - inject, - signal, - TemplateRef, - ViewContainerRef, -} from '@angular/core'; - -@Component({ - selector: 'app-tooltip-container', - imports: [CdkPortalOutlet, NgClass], - templateUrl: './tooltip-container.component.html', - styleUrl: './tooltip-container.component.css', - changeDetection: ChangeDetectionStrategy.OnPush, -}) -export class TooltipContainerComponent { - message = signal(''); - - position = signal('top'); - - content = signal | undefined>(undefined); - vf = inject(ViewContainerRef); - - id = signal(''); - - contentPortal = computed(() => { - const content = this.content(); - if (content) { - return new TemplatePortal(content, this.vf); - } - return; - }); -} diff --git a/projects/ngverse/src/lib/tooltip/tooltip.directive.spec.ts b/projects/ngverse/src/lib/tooltip/tooltip.directive.spec.ts deleted file mode 100644 index 0cfc686..0000000 --- a/projects/ngverse/src/lib/tooltip/tooltip.directive.spec.ts +++ /dev/null @@ -1,157 +0,0 @@ -import { ComponentFixture, TestBed } from '@angular/core/testing'; - -import { - ChangeDetectionStrategy, - Component, - computed, - provideExperimentalZonelessChangeDetection, - signal, - TemplateRef, - viewChild, -} from '@angular/core'; -import { TOOLTIP_EVENT, TooltipDirective } from './tooltip.directive'; - -xdescribe('TooltipContainerComponent', () => { - let component: TooltipTestComponent; - let fixture: ComponentFixture; - - beforeEach(async () => { - await TestBed.configureTestingModule({ - imports: [TooltipTestComponent], - providers: [provideExperimentalZonelessChangeDetection()], - }).compileComponents(); - - fixture = TestBed.createComponent(TooltipTestComponent); - component = fixture.componentInstance; - }); - - it('should create', () => { - expect(component).toBeTruthy(); - }); - it('should display tooltip on hover', async () => { - const button = fixture.nativeElement.querySelector( - 'button' - ) as HTMLButtonElement; - button.dispatchEvent(new Event('mouseenter')); - await new Promise((resolve) => setTimeout(resolve, 0)); - await fixture.whenStable(); - const tooltip = document.querySelector('.tooltip'); - expect(tooltip?.textContent?.trim()).toBe('message'); - }); - it('should display tooltip on focus', async () => { - component.tooltipEvent.set('focus'); - await fixture.whenStable(); - const button = fixture.nativeElement.querySelector( - 'button' - ) as HTMLButtonElement; - button.dispatchEvent(new Event('focus')); - await new Promise((resolve) => setTimeout(resolve, 0)); - await fixture.whenStable(); - const tooltip = document.querySelector('.tooltip'); - expect(tooltip?.textContent?.trim()).toBe('message'); - }); - it("should not display tooltip if tooltipEvent is 'hover' and it's focused", async () => { - component.tooltipEvent.set('hover'); - const button = fixture.nativeElement.querySelector( - 'button' - ) as HTMLButtonElement; - button.dispatchEvent(new Event('focus')); - await new Promise((resolve) => setTimeout(resolve, 0)); - await fixture.whenStable(); - const tooltip = document.querySelector('.tooltip'); - expect(tooltip).toBeNull(); - }); - it("should not display tooltip if tooltipEvent is 'focus' and it's hovered", async () => { - component.tooltipEvent.set('focus'); - await fixture.whenStable(); - const button = fixture.nativeElement.querySelector( - 'button' - ) as HTMLButtonElement; - button.dispatchEvent(new Event('mouseenter')); - await new Promise((resolve) => setTimeout(resolve, 0)); - await fixture.whenStable(); - const tooltip = document.querySelector('.tooltip'); - expect(tooltip).toBeNull(); - }); - it('should display tooltip after tooltipDelay', async () => { - component.tooltipDelay.set(100); - await fixture.whenStable(); - const button = fixture.nativeElement.querySelector( - 'button' - ) as HTMLButtonElement; - button.dispatchEvent(new Event('mouseenter')); - - await new Promise((resolve) => setTimeout(resolve, 30)); - const tooltip = document.querySelector('.tooltip'); - expect(tooltip).toBeFalsy(); - await new Promise((resolve) => setTimeout(resolve, 100)); - await fixture.whenStable(); - expect(document.querySelector('.tooltip')).toBeTruthy(); // Tooltip should exist - }); - - it('should display only 1 tooltip even if mouseenter happens twice', async () => { - const button = fixture.nativeElement.querySelector( - 'button' - ) as HTMLButtonElement; - button.dispatchEvent(new Event('mouseenter')); - button.dispatchEvent(new Event('mouseenter')); - await fixture.whenStable(); - await new Promise((resolve) => setTimeout(resolve, 0)); - const tooltips = document.querySelectorAll('.tooltip'); - expect(tooltips.length).toBe(1); - }); - - it("should display custom content if it's provided", async () => { - component.showCustom.set(true); - await fixture.whenStable(); - const button = fixture.nativeElement.querySelector( - 'button' - ) as HTMLButtonElement; - button.dispatchEvent(new Event('mouseenter')); - await new Promise((resolve) => setTimeout(resolve, 0)); - await fixture.whenStable(); - const tooltip = document.querySelector('.tooltip'); - expect(tooltip?.textContent?.trim()).toBe('Custom content'); - }); - it('tooltip should close on escape', async () => { - const button = fixture.nativeElement.querySelector( - 'button' - ) as HTMLButtonElement; - button.dispatchEvent(new Event('mouseenter')); - await new Promise((resolve) => setTimeout(resolve, 0)); - await fixture.whenStable(); - const tooltip = document.querySelector('.tooltip'); - expect(tooltip?.textContent?.trim()).toBe('message'); - const escapeEvent = new KeyboardEvent('keydown', { key: 'Escape' }); - document.dispatchEvent(escapeEvent); - await fixture.whenStable(); - expect(document.querySelector('.tooltip')).toBeFalsy(); - }); -}); - -@Component({ - imports: [TooltipDirective], - template: ` - - -
Custom content
- - `, - changeDetection: ChangeDetectionStrategy.OnPush, -}) -class TooltipTestComponent { - tooltipEvent = signal('hover'); - tooltipDelay = signal(0); - template = viewChild>(TemplateRef); - showCustom = signal(false); - customContent = computed(() => - this.showCustom() ? this.template() : undefined - ); -} diff --git a/projects/ngverse/src/lib/tooltip/tooltip.directive.ts b/projects/ngverse/src/lib/tooltip/tooltip.directive.ts deleted file mode 100644 index 42b4401..0000000 --- a/projects/ngverse/src/lib/tooltip/tooltip.directive.ts +++ /dev/null @@ -1,134 +0,0 @@ -import { OverlayRef } from '@angular/cdk/overlay'; -import { ComponentPortal } from '@angular/cdk/portal'; -import { DOCUMENT } from '@angular/common'; -import { - Directive, - ElementRef, - inject, - input, - numberAttribute, - OnDestroy, - TemplateRef, -} from '@angular/core'; -import { POPOVER_POSITION, PopoverService } from '@ngverse/kit'; -import { fromEvent, Subscription } from 'rxjs'; -import { TooltipContainerComponent } from './tooltip-container.component'; -export type TOOLTIP_POSITIONS = 'top' | 'right' | 'bottom' | 'left'; - -export type TOOLTIP_EVENT = 'hover' | 'focus'; - -let tooltipId = 0; - -function getTooltipId() { - return `tooltip-${tooltipId++}`; -} - -@Directive({ - selector: '[appTooltip]', - host: { - '(focus)': 'onFocus()', - '(blur)': 'onBlur()', - '(mouseenter)': 'onMouseEnter()', - '(mouseleave)': 'onMouseLeave()', - '[attr.aria-describedby]': 'tooltipId', - }, -}) -export class TooltipDirective implements OnDestroy { - message = input.required({ alias: 'appTooltip' }); - tooltipPosition = input('top'); - tooltipEvent = input('hover'); - tooltipDelay = input(0, { transform: numberAttribute }); - tooltipContent = input>(); - tooltipId = getTooltipId(); - - private popoverService = inject(PopoverService); - - private el = inject>(ElementRef); - private document = inject(DOCUMENT); - - overlayRef: OverlayRef | undefined; - timeoutId: unknown | undefined; - escapeSub: Subscription | undefined; - - onFocus() { - if (this.tooltipEvent() === 'focus') { - this.show(); - } - } - - onBlur() { - if (this.tooltipEvent() === 'focus') { - this.hide(); - } - } - - onMouseEnter() { - if (this.tooltipEvent() === 'hover') { - this.show(); - } - } - - onMouseLeave() { - if (this.tooltipEvent() === 'hover') { - this.hide(); - } - } - - show() { - this.clearSchedule(); - this.timeoutId = setTimeout(() => { - const originElement = this.el.nativeElement; - const tooltipContent = this.tooltipContent(); - const portal = new ComponentPortal(TooltipContainerComponent); - - if (this.overlayRef) { - return; - } - - const { overlayRef, componentRef } = this.popoverService.connected({ - component: portal, - origin: originElement, - position: this.tooltipPosition(), - }); - this.overlayRef = overlayRef; - componentRef.instance.content.set(tooltipContent); - componentRef.instance.message.set(this.message()); - componentRef.instance.position.set(this.tooltipPosition()); - componentRef.instance.id.set(this.tooltipId); - this.listenToEscape(); - }, this.tooltipDelay()) as unknown; - } - - hide() { - this.escapeSub?.unsubscribe(); - this.clearSchedule(); - if (this.overlayRef?.hasAttached()) { - this.overlayRef.detach(); - this.overlayRef = undefined; - } - } - - private clearSchedule() { - if (this.timeoutId) { - clearTimeout(this.timeoutId as number); - this.timeoutId = undefined; - } - } - - private listenToEscape() { - this.escapeSub?.unsubscribe(); - this.escapeSub = fromEvent( - this.document, - 'keydown' - ).subscribe((event) => { - if (event.key === 'Escape') { - this.hide(); - } - }); - } - - ngOnDestroy(): void { - this.clearSchedule(); - this.escapeSub?.unsubscribe(); - } -} diff --git a/projects/ngverse/src/mock-export.ts b/projects/ngverse/src/mock-export.ts deleted file mode 100644 index a242507..0000000 --- a/projects/ngverse/src/mock-export.ts +++ /dev/null @@ -1 +0,0 @@ -export const test = 2; diff --git a/projects/ngverse/src/public-api.ts b/projects/ngverse/src/public-api.ts deleted file mode 100644 index 9c3b635..0000000 --- a/projects/ngverse/src/public-api.ts +++ /dev/null @@ -1,5 +0,0 @@ -/* - * Public API Surface of ngverse - */ - -export * from './mock-export'; diff --git a/projects/ngverse/tsconfig.lib.json b/projects/ngverse/tsconfig.lib.json deleted file mode 100644 index 5aa5e9d..0000000 --- a/projects/ngverse/tsconfig.lib.json +++ /dev/null @@ -1,13 +0,0 @@ -/* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */ -/* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */ -{ - "extends": "../../tsconfig.json", - "compilerOptions": { - "outDir": "../../out-tsc/lib", - "declaration": true, - "declarationMap": true, - "inlineSources": true, - "types": [] - }, - "exclude": ["**/*.spec.ts"] -} diff --git a/projects/ngverse/tsconfig.lib.prod.json b/projects/ngverse/tsconfig.lib.prod.json deleted file mode 100644 index 9215caa..0000000 --- a/projects/ngverse/tsconfig.lib.prod.json +++ /dev/null @@ -1,11 +0,0 @@ -/* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */ -/* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */ -{ - "extends": "./tsconfig.lib.json", - "compilerOptions": { - "declarationMap": false - }, - "angularCompilerOptions": { - "compilationMode": "partial" - } -} diff --git a/projects/ngverse/tsconfig.schematics.json b/projects/ngverse/tsconfig.schematics.json deleted file mode 100644 index cb64a0a..0000000 --- a/projects/ngverse/tsconfig.schematics.json +++ /dev/null @@ -1,25 +0,0 @@ -{ - "compilerOptions": { - "baseUrl": ".", - "lib": ["es2018", "dom"], - "declaration": true, - "module": "commonjs", - "moduleResolution": "node", - "noEmitOnError": true, - "noFallthroughCasesInSwitch": true, - "noImplicitAny": true, - "noImplicitThis": true, - "noUnusedParameters": true, - "noUnusedLocals": true, - "rootDir": "schematics", - "outDir": "../../dist/ngverse/schematics", - "skipDefaultLibCheck": true, - "skipLibCheck": true, - "sourceMap": true, - "strictNullChecks": true, - "target": "es6", - "types": ["jasmine", "node"] - }, - "include": ["schematics/**/*"], - "exclude": ["schematics/*/files/**/*"] -} diff --git a/projects/ngverse/tsconfig.spec.json b/projects/ngverse/tsconfig.spec.json deleted file mode 100644 index 2476803..0000000 --- a/projects/ngverse/tsconfig.spec.json +++ /dev/null @@ -1,10 +0,0 @@ -/* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */ -/* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */ -{ - "extends": "../../tsconfig.json", - "compilerOptions": { - "outDir": "../../out-tsc/spec", - "types": ["jasmine"] - }, - "include": ["**/*.spec.ts", "**/*.d.ts"] -} diff --git a/scripts/generate-sitemap.js b/scripts/generate-sitemap.js deleted file mode 100644 index cc88530..0000000 --- a/scripts/generate-sitemap.js +++ /dev/null @@ -1,63 +0,0 @@ -const { SitemapStream, streamToPromise } = require('sitemap'); -const { Readable } = require('stream'); -const fs = require('fs'); -const priority = 1; -const freq = 'daily'; - -// An array with your links -const links = [ - { url: '/doc/introduction/', changefreq: freq, priority: priority }, - { url: '/doc/installation/', changefreq: freq, priority: priority }, - { url: '/doc/schematics-usage/', changefreq: freq, priority: priority }, - { url: '/doc/usage/', changefreq: freq, priority: priority }, - { url: '/doc/theming/', changefreq: freq, priority: priority }, - { url: '/doc/accordion/', changefreq: freq, priority: priority }, - { url: '/doc/autocomplete/', changefreq: freq, priority: priority }, - { url: '/doc/alert/', changefreq: freq, priority: priority }, - { url: '/doc/badge/', changefreq: freq, priority: priority }, - { url: '/doc/card/', changefreq: freq, priority: priority }, - { url: '/doc/divider/', changefreq: freq, priority: priority }, - { url: '/doc/drawer/', changefreq: freq, priority: priority }, - { url: '/doc/otp-input/', changefreq: freq, priority: priority }, - { url: '/doc/progress-bar/', changefreq: freq, priority: priority }, - { url: '/doc/tooltip/', changefreq: freq, priority: priority }, - { url: '/doc/toast/', changefreq: freq, priority: priority }, - { url: '/doc/button/', changefreq: freq, priority: priority }, - { url: '/doc/outside-click/', changefreq: freq, priority: priority }, - { url: '/doc/checkbox/', changefreq: freq, priority: priority }, - { url: '/doc/radio-button/', changefreq: freq, priority: priority }, - { url: '/doc/select/', changefreq: freq, priority: priority }, - { url: '/doc/dialog/', changefreq: freq, priority: priority }, - { url: '/doc/skeleton/', changefreq: freq, priority: priority }, - { url: '/doc/switch/', changefreq: freq, priority: priority }, - { url: '/doc/tab/', changefreq: freq, priority: priority }, - { url: '/doc/textarea/', changefreq: freq, priority: priority }, - { url: '/doc/input/', changefreq: freq, priority: priority }, - { url: '/doc/form-field/', changefreq: freq, priority: priority }, - { url: '/doc/icon/', changefreq: freq, priority: priority }, - { url: '/doc/popover/', changefreq: freq, priority: priority }, - { url: '/doc/pagination/', changefreq: freq, priority: priority }, - { url: '/doc/context-menu/', changefreq: freq, priority: priority }, - { url: '/doc/loader/', changefreq: freq, priority: priority }, - { url: '/doc/local-storage/', changefreq: freq, priority: priority }, - { url: '/doc/session-storage/', changefreq: freq, priority: priority }, - { url: '/doc/dark-mode/', changefreq: freq, priority: priority }, - { url: '/', changefreq: freq, priority: priority }, -]; - -// Create a stream to write to -const stream = new SitemapStream({ hostname: 'https://www.ngverse.dev/' }); - -// Generate the sitemap and save to a file -streamToPromise(Readable.from(links).pipe(stream)) - .then((data) => { - const sitemapXML = data.toString(); - - // Write the XML to a file named 'sitemap.xml' - fs.writeFileSync('dist/docs/browser/sitemap.xml', sitemapXML); - - console.log('Sitemap saved as sitemap.xml'); - }) - .catch((error) => { - console.error('Error generating sitemap:', error); - }); diff --git a/scripts/generate-tree.js b/scripts/generate-tree.js deleted file mode 100644 index 9703345..0000000 --- a/scripts/generate-tree.js +++ /dev/null @@ -1,82 +0,0 @@ -const fs = require('fs'); -const path = require('path'); -const dirTree = require('directory-tree'); - -// Define your base directory -const baseDir = path.resolve('./projects/ngverse/src/lib'); - -// Custom function to modify paths in the tree -function cleanTreePaths(tree, baseDir) { - tree.path = path.relative(baseDir, tree.path); // Make path relative to base directory - - if (tree.children) { - tree.children = tree.children.map((child) => - cleanTreePaths(child, baseDir) - ); - } - - return tree; -} - -function normalizePathsRecursively(node) { - node.path = path.posix.normalize(node.path.split(path.sep).join('/')); - - if (node.children) { - node.children = node.children.map(normalizePathsRecursively); - } - - return node; -} - -// Custom function to add the `language` field -function addLanguageField(tree) { - if (tree.children === undefined) { - let language = 'ts'; - const name = tree.name; - if (name.includes('spec.ts')) { - language = 'spec.ts'; - } else if (name.includes('html')) { - language = 'html'; - } else if (name.includes('css')) { - language = 'css'; - } - tree.language = language; - } - - if (tree.children) { - tree.children = tree.children.map(addLanguageField); - } - - return tree; -} - -// Function to add the `language` field and rename `children` to `files` -function renameToFiles(node) { - if (!node.children || node.children.length === 0) { - return node; - } else { - // This is a directory node; recursively process children - node.files = node.children.map(renameToFiles); // Rename `children` to `files` - delete node.children; // Remove the `children` key - } - return node; -} - -// Generate the directory tree -let tree = dirTree(baseDir, { - extensions: /\.(ts|js|json|html|css|css)$/, // Optional: Filter by file types -}); - -// Clean up paths -tree = cleanTreePaths(tree, baseDir); - -tree = normalizePathsRecursively(tree); - -tree = addLanguageField(tree); - -tree = renameToFiles(tree); - -// Convert the tree to a JSON string -const jsonOutput = JSON.stringify(tree, null, 2) + '\n'; //Add extra line for prettier style - -fs.writeFileSync('projects/docs/src/tree-structure.json', jsonOutput, 'utf8'); From b71eb95ba2bbe87e2f604f23888e3e78d5089cbb Mon Sep 17 00:00:00 2001 From: luka onik Date: Mon, 3 Mar 2025 16:47:00 +0400 Subject: [PATCH 05/11] refactor: removed --- README.md | 31 +----------- angular.json | 50 ------------------- package.json | 5 +- .../app/blog/blog-page/blog-page.component.ts | 2 +- .../src/app/core/header/header.component.html | 2 +- 5 files changed, 4 insertions(+), 86 deletions(-) diff --git a/README.md b/README.md index da6d2fa..e2b288d 100644 --- a/README.md +++ b/README.md @@ -1,33 +1,4 @@ -# NgVerse - -NgVerse is a collection of feature-rich Angular components, directives, and pipes. Unlike traditional libraries, it requires no installation—just copy and paste what you need into your project and fly 🚀. - -For more info visit the [docs](https://www.ngverse.dev) - -# Announcement - -Thank you all for your feedback! The huge stable release is -coming—stay tuned! - -[![npm](https://img.shields.io/npm/v/ngverse?label=npm&logo=npm)](https://www.npmjs.com/package/ngverse) - -

- Logo -

- -## Usage - -### Installation - -```bash -ng add ngverse -``` - -### Generate Elements - -```bash -ng g ngverse:element button -``` +# @ngverse/kit ## Creators diff --git a/angular.json b/angular.json index 9ad54c5..3946059 100644 --- a/angular.json +++ b/angular.json @@ -39,11 +39,6 @@ "glob": "**/*", "input": "projects/docs/public" }, - { - "glob": "**/*", - "input": "projects/ngverse/src/lib", - "output": "ngverse" - }, { "glob": "**/*", "input": "projects/docs/src/app/examples", @@ -122,51 +117,6 @@ } } }, - "ngverse": { - "projectType": "library", - "schematics": { - "@schematics/angular:component": { - "style": "css", - "changeDetection": "OnPush" - } - }, - "root": "projects/ngverse", - "sourceRoot": "projects/ngverse/src", - "prefix": "app", - "architect": { - "build": { - "builder": "@angular-devkit/build-angular:ng-packagr", - "options": { - "project": "projects/ngverse/ng-package.json" - }, - "configurations": { - "production": { - "tsConfig": "projects/ngverse/tsconfig.lib.prod.json" - }, - "development": { - "tsConfig": "projects/ngverse/tsconfig.lib.json" - } - }, - "defaultConfiguration": "production" - }, - "test": { - "builder": "@angular-devkit/build-angular:karma", - "options": { - "tsConfig": "projects/ngverse/tsconfig.spec.json" - } - }, - "lint": { - "builder": "@angular-eslint/builder:lint", - "options": { - "lintFilePatterns": [ - "projects/ngverse/**/*.ts", - "projects/ngverse/**/*.html" - ], - "eslintConfig": "projects/ngverse/eslint.config.js" - } - } - } - }, "kit": { "projectType": "library", "root": "projects/kit", diff --git a/package.json b/package.json index 1a6470a..800ec1d 100644 --- a/package.json +++ b/package.json @@ -1,5 +1,5 @@ { - "name": "ngverse", + "name": "@ngverse/kit", "version": "2.0.0", "private": true, "repository": { @@ -18,11 +18,8 @@ "format:write": "prettier --write .", "semantic-release": "semantic-release", "serve:ssr:docs": "node dist/docs/server/server.mjs", - "schema:test-watch": "nodemon --watch dist/ngverse --ext js --exec 'jasmine dist/ngverse/**/*_spec.js'", - "build:ngverse": "ng build --project=ngverse && cd projects/ngverse && npm run build", "build:docs": "node scripts/generate-tree.js && ng build --project=docs && node scripts/generate-sitemap.js", "check:docs": "npm run build:docs && ng lint docs && npm run format:check", - "check:ngverse": "ng lint ngverse && npm run format:check && ng test --no-watch --no-progress --browsers=ChromeHeadless --project=ngverse && ng build --project=ngverse", "check:kit": "ng lint kit && npm run format:check && ng test --no-watch --no-progress --browsers=ChromeHeadless --project=kit && ng build --project=kit", "watch:kit": "ng build --project=kit --watch" }, diff --git a/projects/docs/src/app/blog/blog-page/blog-page.component.ts b/projects/docs/src/app/blog/blog-page/blog-page.component.ts index 75b3bf9..7e2b731 100644 --- a/projects/docs/src/app/blog/blog-page/blog-page.component.ts +++ b/projects/docs/src/app/blog/blog-page/blog-page.component.ts @@ -17,7 +17,7 @@ export class BlogPageComponent { constructor() { effect(() => { const label = this.label(); - this.title.setTitle(`${label} | ngverse`); + this.title.setTitle(`${label} | @ngverse/kit`); this.meta.addTags([ { property: 'og:title', content: this.label() }, { diff --git a/projects/docs/src/app/core/header/header.component.html b/projects/docs/src/app/core/header/header.component.html index 06c55fa..ff9a66d 100644 --- a/projects/docs/src/app/core/header/header.component.html +++ b/projects/docs/src/app/core/header/header.component.html @@ -5,7 +5,7 @@
- NgVerse + ngverse/kit
Doc From 42197ab758432244379b0640541ecff85c3a5fe6 Mon Sep 17 00:00:00 2001 From: luka onik Date: Mon, 3 Mar 2025 16:49:11 +0400 Subject: [PATCH 06/11] feat: update check --- .github/workflows/pr-check.yml | 7 ++-- .../show-case/show-case.component.html | 4 +-- .../doc-page/show-case/show-case.component.ts | 13 ++----- .../source-code/source-code.component.html | 9 ++--- .../source-code/source-code.component.ts | 6 ++-- .../accordion-page.component.ts | 6 ++-- projects/kit/src/public-api.ts | 34 ------------------- 7 files changed, 15 insertions(+), 64 deletions(-) diff --git a/.github/workflows/pr-check.yml b/.github/workflows/pr-check.yml index 463fbda..d2d48a7 100644 --- a/.github/workflows/pr-check.yml +++ b/.github/workflows/pr-check.yml @@ -26,8 +26,5 @@ jobs: - name: Run Prettier run: npm run format:check - - name: Check docs - run: npm run check:docs - - - name: Check ngverse - run: npm run check:ngverse + - name: Check kit + run: npm run check:kit diff --git a/projects/docs/src/app/core/doc-page/show-case/show-case.component.html b/projects/docs/src/app/core/doc-page/show-case/show-case.component.html index 1b4a5f7..da89a69 100644 --- a/projects/docs/src/app/core/doc-page/show-case/show-case.component.html +++ b/projects/docs/src/app/core/doc-page/show-case/show-case.component.html @@ -1,4 +1,4 @@ -
Showcase
+ diff --git a/projects/docs/src/app/core/doc-page/show-case/show-case.component.ts b/projects/docs/src/app/core/doc-page/show-case/show-case.component.ts index 104f0f4..978f4d7 100644 --- a/projects/docs/src/app/core/doc-page/show-case/show-case.component.ts +++ b/projects/docs/src/app/core/doc-page/show-case/show-case.component.ts @@ -1,20 +1,11 @@ -import { CardComponent } from '@/ui/card/card.component'; -import { TabGroupComponent } from '@/ui/tab/tab-group.component'; -import { TabComponent } from '@/ui/tab/tab.component'; import { UpperCasePipe } from '@angular/common'; import { Component, inject, input, signal } from '@angular/core'; -import { FileService } from "../../../services/file.service"; +import { FileService } from '../../../services/file.service'; import { SourceCodeComponent } from '../source-code/source-code.component'; @Component({ selector: 'doc-show-case', - imports: [ - SourceCodeComponent, - TabGroupComponent, - TabComponent, - UpperCasePipe, - CardComponent, - ], + imports: [SourceCodeComponent, UpperCasePipe], templateUrl: './show-case.component.html', styleUrl: './show-case.component.css', }) diff --git a/projects/docs/src/app/core/doc-page/source-code/source-code.component.html b/projects/docs/src/app/core/doc-page/source-code/source-code.component.html index 3b92318..8a4e068 100644 --- a/projects/docs/src/app/core/doc-page/source-code/source-code.component.html +++ b/projects/docs/src/app/core/doc-page/source-code/source-code.component.html @@ -5,13 +5,14 @@ class="copy-button" > @if (copied()) { - + } @else { - + } } - - + --> diff --git a/projects/docs/src/app/core/doc-page/source-code/source-code.component.ts b/projects/docs/src/app/core/doc-page/source-code/source-code.component.ts index 7c546d4..cbf2c0f 100644 --- a/projects/docs/src/app/core/doc-page/source-code/source-code.component.ts +++ b/projects/docs/src/app/core/doc-page/source-code/source-code.component.ts @@ -1,12 +1,10 @@ -import { CardComponent } from '@/ui/card/card.component'; -import { IconComponent } from '@/ui/icon/icon.component'; import { ClipboardModule } from '@angular/cdk/clipboard'; import { Component, computed, input, signal } from '@angular/core'; import { Highlight } from 'ngx-highlightjs'; -import { EMPTY_FILE_TOKEN } from "../../../services/file.service"; +import { EMPTY_FILE_TOKEN } from '../../../services/file.service'; @Component({ selector: 'doc-source-code', - imports: [Highlight, ClipboardModule, IconComponent, CardComponent], + imports: [Highlight, ClipboardModule], templateUrl: './source-code.component.html', styleUrl: './source-code.component.css', }) diff --git a/projects/docs/src/app/pages/accordion-page/accordion-page.component.ts b/projects/docs/src/app/pages/accordion-page/accordion-page.component.ts index 55dc140..49b3766 100644 --- a/projects/docs/src/app/pages/accordion-page/accordion-page.component.ts +++ b/projects/docs/src/app/pages/accordion-page/accordion-page.component.ts @@ -5,8 +5,6 @@ import { ChangeDetectionStrategy, Component } from '@angular/core'; imports: [], templateUrl: './accordion-page.component.html', styleUrl: './accordion-page.component.css', - changeDetection: ChangeDetectionStrategy.OnPush + changeDetection: ChangeDetectionStrategy.OnPush, }) -export class AccordionPageComponent { - -} +export class AccordionPageComponent {} diff --git a/projects/kit/src/public-api.ts b/projects/kit/src/public-api.ts index 6397a9b..d65456e 100644 --- a/projects/kit/src/public-api.ts +++ b/projects/kit/src/public-api.ts @@ -6,41 +6,7 @@ export * from './lib/accordion/accordion-header.directive'; export * from './lib/accordion/accordion-panel.directive'; export * from './lib/accordion/accordion-title.directive'; export * from './lib/accordion/accordion.directive'; - -export * from './lib/tab/tab-group.directive'; -export * from './lib/tab/tab-list.directive'; -export * from './lib/tab/tab-panel.directive'; -export * from './lib/tab/tab-stack'; -export * from './lib/tab/tab.directive'; - -export * from './lib/alert/alert.directive'; - -export * from './lib/select/option-group.directive'; -export * from './lib/select/option.directive'; -export * from './lib/select/select-stack'; -export * from './lib/select/select-trigger.directive'; -export * from './lib/select/select.directive'; - export * from './lib/value-models/dynamic-value-model'; export * from './lib/value-models/single-value-model'; export * from './lib/value-models/value-model.types'; -export * from './lib/popover/popover-origin.directive'; -export * from './lib/popover/popover-types'; -export * from './lib/popover/popover.component'; -export * from './lib/popover/popover.service'; - -export * from './lib/checkbox/checkbox.directive'; - -export * from './lib/icon/icon.directive'; - -export * from './lib/switch/switch.directive'; - -export * from './lib/progressbar/progressbar.directive'; - -export * from './lib/radio/radio-button.directive'; -export * from './lib/radio/radio-group.directive'; -export * from './lib/radio/radio-stack'; - -export * from './lib/local-storage/local-storage.service'; -export * from './lib/session-storage/session-storage.service'; From 786ff677b80c70ba9d127bc0023eb50c917a1231 Mon Sep 17 00:00:00 2001 From: luka onik Date: Mon, 3 Mar 2025 16:53:46 +0400 Subject: [PATCH 07/11] update: scripts --- .github/workflows/deployment.yml | 6 +- .github/workflows/release.yml | 8 +- angular.json | 3 + package-lock.json | 614 +++++++++++++++++++++++++++++-- package.json | 2 + projects/kit/package.json | 16 +- release.config.js | 6 +- 7 files changed, 614 insertions(+), 41 deletions(-) diff --git a/.github/workflows/deployment.yml b/.github/workflows/deployment.yml index 32d8f44..84b006f 100644 --- a/.github/workflows/deployment.yml +++ b/.github/workflows/deployment.yml @@ -8,7 +8,5 @@ jobs: name: Deployment runs-on: ubuntu-latest steps: - - name: Trigger Vercel deployment - env: - DEPLOY_HOOK: ${{ secrets.VERCEL_PATH }} - run: curl -X POST "$DEPLOY_HOOK" + - name: Trigger Deployment + run: npm run deploy diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml index c7f5796..9dfdc3e 100644 --- a/.github/workflows/release.yml +++ b/.github/workflows/release.yml @@ -29,8 +29,6 @@ jobs: NPM_TOKEN: ${{ secrets.NPM_TOKEN }} run: npm run semantic-release - - name: Trigger Vercel deployment - if: success() # Run this step only if the previous steps succeeded - env: - DEPLOY_HOOK: ${{ secrets.VERCEL_PATH }} - run: curl -X POST "$DEPLOY_HOOK" + - name: Trigger Deployment + if: success() + run: npm run deploy diff --git a/angular.json b/angular.json index 3946059..aa847a4 100644 --- a/angular.json +++ b/angular.json @@ -114,6 +114,9 @@ ], "eslintConfig": "projects/docs/eslint.config.js" } + }, + "deploy": { + "builder": "angular-cli-ghpages:deploy" } } }, diff --git a/package-lock.json b/package-lock.json index 577e408..1766170 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,11 +1,11 @@ { - "name": "ngverse", + "name": "@ngverse/kit", "version": "2.0.0", "lockfileVersion": 3, "requires": true, "packages": { "": { - "name": "ngverse", + "name": "@ngverse/kit", "version": "2.0.0", "dependencies": { "@angular/animations": "^19.0.6", @@ -42,7 +42,6 @@ "@angular/cli": "^19.0.7", "@angular/compiler-cli": "^19.0.6", "@commitlint/cli": "^19.6.1", - "@commitlint/config-angular": "^19.7.0", "@commitlint/config-conventional": "^19.7.1", "@semantic-release/changelog": "^6.0.3", "@semantic-release/exec": "^6.0.3", @@ -53,6 +52,7 @@ "@types/express": "^4.17.17", "@types/jasmine": "~5.1.0", "@types/node": "^18.18.0", + "angular-cli-ghpages": "^2.0.3", "angular-eslint": "19.0.2", "autoprefixer": "^10.4.20", "directory-tree": "^3.5.2", @@ -2782,29 +2782,6 @@ "node": ">=v18" } }, - "node_modules/@commitlint/config-angular": { - "version": "19.7.1", - "resolved": "https://registry.npmjs.org/@commitlint/config-angular/-/config-angular-19.7.1.tgz", - "integrity": "sha512-aDXjejXfk1kqGDZOFAGu4lJ251WloR4duODaCcSuo/U/Nfnhnzq0VrhtGPCcOlTfVrWknumurg+ZcGe6v3e5ZA==", - "dev": true, - "license": "MIT", - "dependencies": { - "@commitlint/config-angular-type-enum": "^19.5.0" - }, - "engines": { - "node": ">=v18" - } - }, - "node_modules/@commitlint/config-angular-type-enum": { - "version": "19.5.0", - "resolved": "https://registry.npmjs.org/@commitlint/config-angular-type-enum/-/config-angular-type-enum-19.5.0.tgz", - "integrity": "sha512-4/6xrkElCSBb7+6oZXlBJ/zytkxXgmTg5gk1Voj3GAWShTivtWrPtDYvHmF858WhA695YKgxMHEPNN74UFkK8w==", - "dev": true, - "license": "MIT", - "engines": { - "node": ">=v18" - } - }, "node_modules/@commitlint/config-conventional": { "version": "19.7.1", "resolved": "https://registry.npmjs.org/@commitlint/config-conventional/-/config-conventional-19.7.1.tgz", @@ -8185,6 +8162,239 @@ "node": ">= 14.0.0" } }, + "node_modules/angular-cli-ghpages": { + "version": "2.0.3", + "resolved": "https://registry.npmjs.org/angular-cli-ghpages/-/angular-cli-ghpages-2.0.3.tgz", + "integrity": "sha512-eVyyCgtoXtSXxsgI59fYow+wBrAOAxPZ6eMwIieSpQI+8Gunq2DtNalicEoDPqD69LHaPmNiI8jEwgkzZt0WTw==", + "dev": true, + "license": "MIT", + "dependencies": { + "@angular-devkit/architect": "~0.1800.0", + "@angular-devkit/core": "^18.0.0", + "@angular-devkit/schematics": "^18.0.0", + "commander": "^3.0.0-0", + "fs-extra": "^11.2.0", + "gh-pages": "^3.1.0" + }, + "bin": { + "angular-cli-ghpages": "angular-cli-ghpages", + "ngh": "angular-cli-ghpages" + } + }, + "node_modules/angular-cli-ghpages/node_modules/@angular-devkit/architect": { + "version": "0.1800.7", + "resolved": "https://registry.npmjs.org/@angular-devkit/architect/-/architect-0.1800.7.tgz", + "integrity": "sha512-ZYIjdngUOjY6G2XJGHtATLr+HhJWdo7Z3ATlzQTGI9D1a02kW3UFlELQBhFIn+1o78FU6W0STZgyfBH8M7wD2w==", + "dev": true, + "license": "MIT", + "dependencies": { + "@angular-devkit/core": "18.0.7", + "rxjs": "7.8.1" + }, + "engines": { + "node": "^18.19.1 || ^20.11.1 || >=22.0.0", + "npm": "^6.11.0 || ^7.5.6 || >=8.0.0", + "yarn": ">= 1.13.0" + } + }, + "node_modules/angular-cli-ghpages/node_modules/@angular-devkit/architect/node_modules/@angular-devkit/core": { + "version": "18.0.7", + "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-18.0.7.tgz", + "integrity": "sha512-pVmuE37DNuTe3S4Lh1jg6U4dyHljiZiqI99u3gtS7PF765P4AeGlugHIYE7ztC74fYd9gy04sWnbeV+RQuBTVw==", + "dev": true, + "license": "MIT", + "dependencies": { + "ajv": "8.13.0", + "ajv-formats": "3.0.1", + "jsonc-parser": "3.2.1", + "picomatch": "4.0.2", + "rxjs": "7.8.1", + "source-map": "0.7.4" + }, + "engines": { + "node": "^18.19.1 || ^20.11.1 || >=22.0.0", + "npm": "^6.11.0 || ^7.5.6 || >=8.0.0", + "yarn": ">= 1.13.0" + }, + "peerDependencies": { + "chokidar": "^3.5.2" + }, + "peerDependenciesMeta": { + "chokidar": { + "optional": true + } + } + }, + "node_modules/angular-cli-ghpages/node_modules/@angular-devkit/architect/node_modules/ajv": { + "version": "8.13.0", + "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.13.0.tgz", + "integrity": "sha512-PRA911Blj99jR5RMeTunVbNXMF6Lp4vZXnk5GQjcnUWUTsrXtekg/pnmFFI2u/I36Y/2bITGS30GZCXei6uNkA==", + "dev": true, + "license": "MIT", + "dependencies": { + "fast-deep-equal": "^3.1.3", + "json-schema-traverse": "^1.0.0", + "require-from-string": "^2.0.2", + "uri-js": "^4.4.1" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/epoberezkin" + } + }, + "node_modules/angular-cli-ghpages/node_modules/@angular-devkit/architect/node_modules/jsonc-parser": { + "version": "3.2.1", + "resolved": "https://registry.npmjs.org/jsonc-parser/-/jsonc-parser-3.2.1.tgz", + "integrity": "sha512-AilxAyFOAcK5wA1+LeaySVBrHsGQvUFCDWXKpZjzaL0PqW+xfBOttn8GNtWKFWqneyMZj41MWF9Kl6iPWLwgOA==", + "dev": true, + "license": "MIT" + }, + "node_modules/angular-cli-ghpages/node_modules/@angular-devkit/core": { + "version": "18.2.14", + "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-18.2.14.tgz", + "integrity": "sha512-UGIGOjXuOyCW+5S4tINu7e6LOu738CmTw3h7Ui1I8OzdTIYJcYJrei8sgrwDwOYADRal+p0MeMlnykH3TM5XBA==", + "dev": true, + "license": "MIT", + "dependencies": { + "ajv": "8.17.1", + "ajv-formats": "3.0.1", + "jsonc-parser": "3.3.1", + "picomatch": "4.0.2", + "rxjs": "7.8.1", + "source-map": "0.7.4" + }, + "engines": { + "node": "^18.19.1 || ^20.11.1 || >=22.0.0", + "npm": "^6.11.0 || ^7.5.6 || >=8.0.0", + "yarn": ">= 1.13.0" + }, + "peerDependencies": { + "chokidar": "^3.5.2" + }, + "peerDependenciesMeta": { + "chokidar": { + "optional": true + } + } + }, + "node_modules/angular-cli-ghpages/node_modules/@angular-devkit/schematics": { + "version": "18.2.14", + "resolved": "https://registry.npmjs.org/@angular-devkit/schematics/-/schematics-18.2.14.tgz", + "integrity": "sha512-mukjZIHHB7gWratq8fZwUq5WZ+1bF4feG/idXr1wgQ+/FqWjs2PP7HDesHVcPymmRulpTyCpB7TNB1O1fgnCpA==", + "dev": true, + "license": "MIT", + "dependencies": { + "@angular-devkit/core": "18.2.14", + "jsonc-parser": "3.3.1", + "magic-string": "0.30.11", + "ora": "5.4.1", + "rxjs": "7.8.1" + }, + "engines": { + "node": "^18.19.1 || ^20.11.1 || >=22.0.0", + "npm": "^6.11.0 || ^7.5.6 || >=8.0.0", + "yarn": ">= 1.13.0" + } + }, + "node_modules/angular-cli-ghpages/node_modules/chokidar": { + "version": "3.6.0", + "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.6.0.tgz", + "integrity": "sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==", + "dev": true, + "license": "MIT", + "optional": true, + "peer": true, + "dependencies": { + "anymatch": "~3.1.2", + "braces": "~3.0.2", + "glob-parent": "~5.1.2", + "is-binary-path": "~2.1.0", + "is-glob": "~4.0.1", + "normalize-path": "~3.0.0", + "readdirp": "~3.6.0" + }, + "engines": { + "node": ">= 8.10.0" + }, + "funding": { + "url": "https://paulmillr.com/funding/" + }, + "optionalDependencies": { + "fsevents": "~2.3.2" + } + }, + "node_modules/angular-cli-ghpages/node_modules/commander": { + "version": "3.0.2", + "resolved": "https://registry.npmjs.org/commander/-/commander-3.0.2.tgz", + "integrity": "sha512-Gar0ASD4BDyKC4hl4DwHqDrmvjoxWKZigVnAbn5H1owvm4CxCPdb0HQDehwNYMJpla5+M2tPmPARzhtYuwpHow==", + "dev": true, + "license": "MIT" + }, + "node_modules/angular-cli-ghpages/node_modules/glob-parent": { + "version": "5.1.2", + "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz", + "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==", + "dev": true, + "license": "ISC", + "optional": true, + "peer": true, + "dependencies": { + "is-glob": "^4.0.1" + }, + "engines": { + "node": ">= 6" + } + }, + "node_modules/angular-cli-ghpages/node_modules/magic-string": { + "version": "0.30.11", + "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.11.tgz", + "integrity": "sha512-+Wri9p0QHMy+545hKww7YAu5NyzF8iomPL/RQazugQ9+Ez4Ic3mERMd8ZTX5rfK944j+560ZJi8iAwgak1Ac7A==", + "dev": true, + "license": "MIT", + "dependencies": { + "@jridgewell/sourcemap-codec": "^1.5.0" + } + }, + "node_modules/angular-cli-ghpages/node_modules/readdirp": { + "version": "3.6.0", + "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz", + "integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==", + "dev": true, + "license": "MIT", + "optional": true, + "peer": true, + "dependencies": { + "picomatch": "^2.2.1" + }, + "engines": { + "node": ">=8.10.0" + } + }, + "node_modules/angular-cli-ghpages/node_modules/readdirp/node_modules/picomatch": { + "version": "2.3.1", + "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz", + "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==", + "dev": true, + "license": "MIT", + "optional": true, + "peer": true, + "engines": { + "node": ">=8.6" + }, + "funding": { + "url": "https://github.com/sponsors/jonschlinkert" + } + }, + "node_modules/angular-cli-ghpages/node_modules/rxjs": { + "version": "7.8.1", + "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-7.8.1.tgz", + "integrity": "sha512-AA3TVj+0A2iuIoQkWEK/tqFjBq2j+6PO6Y0zJcvzLAFhEFIO3HL0vls9hWLncZbAAbK0mar7oZ4V079I/qPMxg==", + "dev": true, + "license": "Apache-2.0", + "dependencies": { + "tslib": "^2.1.0" + } + }, "node_modules/angular-eslint": { "version": "19.0.2", "resolved": "https://registry.npmjs.org/angular-eslint/-/angular-eslint-19.0.2.tgz", @@ -8361,6 +8571,39 @@ "dev": true, "license": "MIT" }, + "node_modules/array-union": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/array-union/-/array-union-1.0.2.tgz", + "integrity": "sha512-Dxr6QJj/RdU/hCaBjOfxW+q6lyuVE6JFWIrAUpuOOhoJJoQ99cUn3igRaHVB5P9WrgFVN0FfArM3x0cueOU8ng==", + "dev": true, + "license": "MIT", + "dependencies": { + "array-uniq": "^1.0.1" + }, + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/array-uniq": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/array-uniq/-/array-uniq-1.0.3.tgz", + "integrity": "sha512-MNha4BWQ6JbwhFhj03YK552f7cb3AzoE8SzeljgChvL1dl3IcvggXVz1DilzySZkCja+CXuZbdW7yATchWn8/Q==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/async": { + "version": "2.6.4", + "resolved": "https://registry.npmjs.org/async/-/async-2.6.4.tgz", + "integrity": "sha512-mzo5dfJYwAn29PeiJ0zvwTo04zj8HDJj0Mn8TD7sno7q12prdbnasKJHhkm2c1LgrhlJ0teaea8860oxi51mGA==", + "dev": true, + "license": "MIT", + "dependencies": { + "lodash": "^4.17.14" + } + }, "node_modules/autoprefixer": { "version": "10.4.20", "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.20.tgz", @@ -10733,6 +10976,13 @@ "dev": true, "license": "ISC" }, + "node_modules/email-addresses": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/email-addresses/-/email-addresses-3.1.0.tgz", + "integrity": "sha512-k0/r7GrWVL32kZlGwfPNgB2Y/mMXVTq/decgLczm/j34whdaspNrZO8CnXPf1laaHxI6ptUlsnAxN+UAPw+fzg==", + "dev": true, + "license": "MIT" + }, "node_modules/emoji-regex": { "version": "10.4.0", "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-10.4.0.tgz", @@ -11879,6 +12129,34 @@ "integrity": "sha512-P9bmyZ3h/PRG+Nzga+rbdI4OEpNDzAVyy74uVO9ATgzLK6VtAsYybF/+TOCvrc0MO793d6+42lLyZTw7/ArVzA==", "license": "MIT" }, + "node_modules/filename-reserved-regex": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/filename-reserved-regex/-/filename-reserved-regex-2.0.0.tgz", + "integrity": "sha512-lc1bnsSr4L4Bdif8Xb/qrtokGbq5zlsms/CYH8PP+WtCkGNF65DPiQY8vG3SakEdRn8Dlnm+gW/qWKKjS5sZzQ==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=4" + } + }, + "node_modules/filenamify": { + "version": "4.3.0", + "resolved": "https://registry.npmjs.org/filenamify/-/filenamify-4.3.0.tgz", + "integrity": "sha512-hcFKyUG57yWGAzu1CMt/dPzYZuv+jAJUT85bL8mrXvNe6hWj6yEHEc4EdcgiA6Z3oi1/9wXJdZPXF2dZNgwgOg==", + "dev": true, + "license": "MIT", + "dependencies": { + "filename-reserved-regex": "^2.0.0", + "strip-outer": "^1.0.1", + "trim-repeated": "^1.0.0" + }, + "engines": { + "node": ">=8" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/fill-range": { "version": "7.1.1", "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.1.1.tgz", @@ -12268,6 +12546,221 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/gh-pages": { + "version": "3.2.3", + "resolved": "https://registry.npmjs.org/gh-pages/-/gh-pages-3.2.3.tgz", + "integrity": "sha512-jA1PbapQ1jqzacECfjUaO9gV8uBgU6XNMV0oXLtfCX3haGLe5Atq8BxlrADhbD6/UdG9j6tZLWAkAybndOXTJg==", + "dev": true, + "license": "MIT", + "dependencies": { + "async": "^2.6.1", + "commander": "^2.18.0", + "email-addresses": "^3.0.1", + "filenamify": "^4.3.0", + "find-cache-dir": "^3.3.1", + "fs-extra": "^8.1.0", + "globby": "^6.1.0" + }, + "bin": { + "gh-pages": "bin/gh-pages.js", + "gh-pages-clean": "bin/gh-pages-clean.js" + }, + "engines": { + "node": ">=10" + } + }, + "node_modules/gh-pages/node_modules/commander": { + "version": "2.20.3", + "resolved": "https://registry.npmjs.org/commander/-/commander-2.20.3.tgz", + "integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==", + "dev": true, + "license": "MIT" + }, + "node_modules/gh-pages/node_modules/find-cache-dir": { + "version": "3.3.2", + "resolved": "https://registry.npmjs.org/find-cache-dir/-/find-cache-dir-3.3.2.tgz", + "integrity": "sha512-wXZV5emFEjrridIgED11OoUKLxiYjAcqot/NJdAkOhlJ+vGzwhOAfcG5OX1jP+S0PcjEn8bdMJv+g2jwQ3Onig==", + "dev": true, + "license": "MIT", + "dependencies": { + "commondir": "^1.0.1", + "make-dir": "^3.0.2", + "pkg-dir": "^4.1.0" + }, + "engines": { + "node": ">=8" + }, + "funding": { + "url": "https://github.com/avajs/find-cache-dir?sponsor=1" + } + }, + "node_modules/gh-pages/node_modules/find-up": { + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/find-up/-/find-up-4.1.0.tgz", + "integrity": "sha512-PpOwAdQ/YlXQ2vj8a3h8IipDuYRi3wceVQQGYWxNINccq40Anw7BlsEXCMbt1Zt+OLA6Fq9suIpIWD0OsnISlw==", + "dev": true, + "license": "MIT", + "dependencies": { + "locate-path": "^5.0.0", + "path-exists": "^4.0.0" + }, + "engines": { + "node": ">=8" + } + }, + "node_modules/gh-pages/node_modules/fs-extra": { + "version": "8.1.0", + "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-8.1.0.tgz", + "integrity": "sha512-yhlQgA6mnOJUKOsRUFsgJdQCvkKhcz8tlZG5HBQfReYZy46OwLcY+Zia0mtdHsOo9y/hP+CxMN0TU9QxoOtG4g==", + "dev": true, + "license": "MIT", + "dependencies": { + "graceful-fs": "^4.2.0", + "jsonfile": "^4.0.0", + "universalify": "^0.1.0" + }, + "engines": { + "node": ">=6 <7 || >=8" + } + }, + "node_modules/gh-pages/node_modules/globby": { + "version": "6.1.0", + "resolved": "https://registry.npmjs.org/globby/-/globby-6.1.0.tgz", + "integrity": "sha512-KVbFv2TQtbzCoxAnfD6JcHZTYCzyliEaaeM/gH8qQdkKr5s0OP9scEgvdcngyk7AVdY6YVW/TJHd+lQ/Df3Daw==", + "dev": true, + "license": "MIT", + "dependencies": { + "array-union": "^1.0.1", + "glob": "^7.0.3", + "object-assign": "^4.0.1", + "pify": "^2.0.0", + "pinkie-promise": "^2.0.0" + }, + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/gh-pages/node_modules/jsonfile": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-4.0.0.tgz", + "integrity": "sha512-m6F1R3z8jjlf2imQHS2Qez5sjKWQzbuuhuJ/FKYFRZvPE3PuHcSMVZzfsLhGVOkfd20obL5SWEBew5ShlquNxg==", + "dev": true, + "license": "MIT", + "optionalDependencies": { + "graceful-fs": "^4.1.6" + } + }, + "node_modules/gh-pages/node_modules/locate-path": { + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-5.0.0.tgz", + "integrity": "sha512-t7hw9pI+WvuwNJXwk5zVHpyhIqzg2qTlklJOf0mVxGSbe3Fp2VieZcduNYjaLDoy6p9uGpQEGWG87WpMKlNq8g==", + "dev": true, + "license": "MIT", + "dependencies": { + "p-locate": "^4.1.0" + }, + "engines": { + "node": ">=8" + } + }, + "node_modules/gh-pages/node_modules/make-dir": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-3.1.0.tgz", + "integrity": "sha512-g3FeP20LNwhALb/6Cz6Dd4F2ngze0jz7tbzrD2wAV+o9FeNHe4rL+yK2md0J/fiSf1sa1ADhXqi5+oVwOM/eGw==", + "dev": true, + "license": "MIT", + "dependencies": { + "semver": "^6.0.0" + }, + "engines": { + "node": ">=8" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/gh-pages/node_modules/p-limit": { + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-2.3.0.tgz", + "integrity": "sha512-//88mFWSJx8lxCzwdAABTJL2MyWB12+eIY7MDL2SqLmAkeKU9qxRvWuSyTjm3FUmpBEMuFfckAIqEaVGUDxb6w==", + "dev": true, + "license": "MIT", + "dependencies": { + "p-try": "^2.0.0" + }, + "engines": { + "node": ">=6" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/gh-pages/node_modules/p-locate": { + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-4.1.0.tgz", + "integrity": "sha512-R79ZZ/0wAxKGu3oYMlz8jy/kbhsNrS7SKZ7PxEHBgJ5+F2mtFW2fK2cOtBh1cHYkQsbzFV7I+EoRKe6Yt0oK7A==", + "dev": true, + "license": "MIT", + "dependencies": { + "p-limit": "^2.2.0" + }, + "engines": { + "node": ">=8" + } + }, + "node_modules/gh-pages/node_modules/path-exists": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz", + "integrity": "sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=8" + } + }, + "node_modules/gh-pages/node_modules/pify": { + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz", + "integrity": "sha512-udgsAY+fTnvv7kI7aaxbqwWNb0AHiB0qBO89PZKPkoTmGOgdbrHDKD+0B2X4uTfJ/FT1R09r9gTsjUjNJotuog==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/gh-pages/node_modules/pkg-dir": { + "version": "4.2.0", + "resolved": "https://registry.npmjs.org/pkg-dir/-/pkg-dir-4.2.0.tgz", + "integrity": "sha512-HRDzbaKjC+AOWVXxAU/x54COGeIv9eb+6CkDSQoNTt4XyWoIJvuPsXizxu/Fr23EiekbtZwmh1IcIG/l/a10GQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "find-up": "^4.0.0" + }, + "engines": { + "node": ">=8" + } + }, + "node_modules/gh-pages/node_modules/semver": { + "version": "6.3.1", + "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz", + "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==", + "dev": true, + "license": "ISC", + "bin": { + "semver": "bin/semver.js" + } + }, + "node_modules/gh-pages/node_modules/universalify": { + "version": "0.1.2", + "resolved": "https://registry.npmjs.org/universalify/-/universalify-0.1.2.tgz", + "integrity": "sha512-rBJeI5CXAlmy1pV+617WB9J63U6XcazHHF2f2dbJix4XzpUF0RS3Zbj0FGIOCAva5P/d/GBOYaACQ1w+0azUkg==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">= 4.0.0" + } + }, "node_modules/git-log-parser": { "version": "1.2.1", "resolved": "https://registry.npmjs.org/git-log-parser/-/git-log-parser-1.2.1.tgz", @@ -19883,6 +20376,29 @@ "node": ">=4" } }, + "node_modules/pinkie": { + "version": "2.0.4", + "resolved": "https://registry.npmjs.org/pinkie/-/pinkie-2.0.4.tgz", + "integrity": "sha512-MnUuEycAemtSaeFSjXKW/aroV7akBbY+Sv+RkyqFjgAe73F+MR0TBWKBRDkmfWq/HiFmdavfZ1G7h4SPZXaCSg==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/pinkie-promise": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/pinkie-promise/-/pinkie-promise-2.0.1.tgz", + "integrity": "sha512-0Gni6D4UcLTbv9c57DfxDGdr41XfgUjqWZu492f0cIGr16zDU06BWP/RAEvOuo7CQ0CNjHaLlM59YJJFm3NWlw==", + "dev": true, + "license": "MIT", + "dependencies": { + "pinkie": "^2.0.0" + }, + "engines": { + "node": ">=0.10.0" + } + }, "node_modules/piscina": { "version": "4.8.0", "resolved": "https://registry.npmjs.org/piscina/-/piscina-4.8.0.tgz", @@ -22588,6 +23104,29 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/strip-outer": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/strip-outer/-/strip-outer-1.0.1.tgz", + "integrity": "sha512-k55yxKHwaXnpYGsOzg4Vl8+tDrWylxDEpknGjhTiZB8dFRU5rTo9CAzeycivxV3s+zlTKwrs6WxMxR95n26kwg==", + "dev": true, + "license": "MIT", + "dependencies": { + "escape-string-regexp": "^1.0.2" + }, + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/strip-outer/node_modules/escape-string-regexp": { + "version": "1.0.5", + "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz", + "integrity": "sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=0.8.0" + } + }, "node_modules/super-regex": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/super-regex/-/super-regex-1.0.0.tgz", @@ -23094,6 +23633,29 @@ "tree-kill": "cli.js" } }, + "node_modules/trim-repeated": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/trim-repeated/-/trim-repeated-1.0.0.tgz", + "integrity": "sha512-pkonvlKk8/ZuR0D5tLW8ljt5I8kmxp2XKymhepUeOdCEfKpZaktSArkLHZt76OB1ZvO9bssUsDty4SWhLvZpLg==", + "dev": true, + "license": "MIT", + "dependencies": { + "escape-string-regexp": "^1.0.2" + }, + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/trim-repeated/node_modules/escape-string-regexp": { + "version": "1.0.5", + "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz", + "integrity": "sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=0.8.0" + } + }, "node_modules/ts-api-utils": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/ts-api-utils/-/ts-api-utils-2.0.1.tgz", diff --git a/package.json b/package.json index 800ec1d..59cb81b 100644 --- a/package.json +++ b/package.json @@ -14,6 +14,7 @@ "test": "ng test --project=ngverse", "lint": "ng lint", "prepare": "husky", + "deploy": "ng deploy --base-href=/kit/", "format:check": "prettier --check .", "format:write": "prettier --write .", "semantic-release": "semantic-release", @@ -71,6 +72,7 @@ "@types/express": "^4.17.17", "@types/jasmine": "~5.1.0", "@types/node": "^18.18.0", + "angular-cli-ghpages": "^2.0.3", "angular-eslint": "19.0.2", "autoprefixer": "^10.4.20", "directory-tree": "^3.5.2", diff --git a/projects/kit/package.json b/projects/kit/package.json index 3ce9e61..953e14c 100644 --- a/projects/kit/package.json +++ b/projects/kit/package.json @@ -2,11 +2,21 @@ "name": "@ngverse/kit", "version": "0.0.1", "peerDependencies": { - "@angular/common": "^19.1.0", - "@angular/core": "^19.1.0" + "@angular/common": ">=19.1.0", + "@angular/core": ">=19.1.0" }, + "keywords": [ + "angular", + "angular-components", + "typescript", + "components" + ], "dependencies": { "tslib": "^2.3.0" }, - "sideEffects": false + "sideEffects": false, + "repository": { + "type": "git", + "url": "https://github.com/ngverse/kit" + } } diff --git a/release.config.js b/release.config.js index 9b0a97a..34312cb 100644 --- a/release.config.js +++ b/release.config.js @@ -1,6 +1,6 @@ module.exports = { branches: ['main'], - repositoryUrl: 'https://github.com/lukonik/ngverse', + repositoryUrl: 'https://github.com/ngverse/kit', preset: 'angular', releaseRules: [{ type: 'refactor', release: 'patch' }], plugins: [ @@ -9,13 +9,13 @@ module.exports = { [ '@semantic-release/npm', { - pkgRoot: 'dist/ngverse', + pkgRoot: 'dist/kit', }, ], [ '@semantic-release/git', { - assets: ['projects/ngverse/package.json'], + assets: ['projects/kit/package.json'], message: 'chore(release): update package.json [skip ci]', }, ], From 94fc3c30dc8c98266bfbbb6a4928192b784f7df4 Mon Sep 17 00:00:00 2001 From: luka onik Date: Mon, 3 Mar 2025 16:56:45 +0400 Subject: [PATCH 08/11] chore: update scripts --- release.config.js | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/release.config.js b/release.config.js index 34312cb..c719fec 100644 --- a/release.config.js +++ b/release.config.js @@ -1,8 +1,7 @@ module.exports = { branches: ['main'], repositoryUrl: 'https://github.com/ngverse/kit', - preset: 'angular', - releaseRules: [{ type: 'refactor', release: 'patch' }], + preset: 'conventionalcommits', plugins: [ '@semantic-release/commit-analyzer', '@semantic-release/release-notes-generator', From 7bb0b8dc649260c5742c8f4c9e13677ab5e0f4ee Mon Sep 17 00:00:00 2001 From: luka onik Date: Mon, 3 Mar 2025 16:58:55 +0400 Subject: [PATCH 09/11] chore: add docs as pr check --- .github/workflows/pr-check.yml | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/.github/workflows/pr-check.yml b/.github/workflows/pr-check.yml index d2d48a7..30cd4bd 100644 --- a/.github/workflows/pr-check.yml +++ b/.github/workflows/pr-check.yml @@ -23,8 +23,8 @@ jobs: - name: Install dependencies run: npm install - - name: Run Prettier - run: npm run format:check + - name: Check docs + run: npm run check:docs - name: Check kit run: npm run check:kit From 488bbb136a716b4ff7f680de6a8293f25bd011eb Mon Sep 17 00:00:00 2001 From: luka onik Date: Mon, 3 Mar 2025 16:59:42 +0400 Subject: [PATCH 10/11] chore: prettier fix --- projects/kit/src/public-api.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/projects/kit/src/public-api.ts b/projects/kit/src/public-api.ts index d65456e..db8133d 100644 --- a/projects/kit/src/public-api.ts +++ b/projects/kit/src/public-api.ts @@ -9,4 +9,3 @@ export * from './lib/accordion/accordion.directive'; export * from './lib/value-models/dynamic-value-model'; export * from './lib/value-models/single-value-model'; export * from './lib/value-models/value-model.types'; - From 1ec9012c6676edb5882c2a78761f6d6285bde5cf Mon Sep 17 00:00:00 2001 From: luka onik Date: Mon, 3 Mar 2025 17:01:53 +0400 Subject: [PATCH 11/11] chore: remove generate --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 59cb81b..a43603f 100644 --- a/package.json +++ b/package.json @@ -19,7 +19,7 @@ "format:write": "prettier --write .", "semantic-release": "semantic-release", "serve:ssr:docs": "node dist/docs/server/server.mjs", - "build:docs": "node scripts/generate-tree.js && ng build --project=docs && node scripts/generate-sitemap.js", + "build:docs": "ng build --project=docs", "check:docs": "npm run build:docs && ng lint docs && npm run format:check", "check:kit": "ng lint kit && npm run format:check && ng test --no-watch --no-progress --browsers=ChromeHeadless --project=kit && ng build --project=kit", "watch:kit": "ng build --project=kit --watch"