@ng-zen/cli 19.1.0-next.1 → 19.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -4,6 +4,6 @@ import { Markdown } from '@storybook/blocks';
4
4
 
5
5
  import { Meta } from '@storybook/blocks';
6
6
 
7
- <Meta title="Welcome" />
7
+ <Meta title="README" />
8
8
 
9
9
  <Markdown>{ReadMe}</Markdown>
@@ -4,6 +4,6 @@ import { Markdown } from '@storybook/blocks';
4
4
 
5
5
  import { Meta } from '@storybook/blocks';
6
6
 
7
- <Meta title="License - BSD-2-Clause" />
7
+ <Meta title="LICENSE - BSD-2-Clause" />
8
8
 
9
9
  <Markdown>{License}</Markdown>
@@ -0,0 +1,9 @@
1
+ import CHANGELOG from '../../../CHANGELOG.md?raw';
2
+
3
+ import { Markdown } from '@storybook/blocks';
4
+
5
+ import { Meta } from '@storybook/blocks';
6
+
7
+ <Meta title="CHANGELOG" />
8
+
9
+ <Markdown>{CHANGELOG}</Markdown>
package/CHANGELOG.md CHANGED
@@ -1,3 +1,31 @@
1
+ ## [19.1.0](https://github.com/kstepien3/ng-zen/compare/v19.0.0...v19.1.0) (2025-04-27)
2
+
3
+ ### 🚀 New Features
4
+
5
+ * **switch:** add missing css variables ([0481ac7](https://github.com/kstepien3/ng-zen/commit/0481ac7d735eba4ee47fbc6a69cdee643f5b9b4c))
6
+
7
+ ### 🏗️ Build Changes
8
+
9
+ * **deps-dev:** bump @angular-devkit/architect from 0.1902.6 to 0.1902.9 ([#160](https://github.com/kstepien3/ng-zen/issues/160)) ([e8fa092](https://github.com/kstepien3/ng-zen/commit/e8fa092e8aefcd15f4fb5755e150b2834d359fb4))
10
+ * **deps-dev:** bump angular-eslint from 19.0.2 to 19.3.0 ([#136](https://github.com/kstepien3/ng-zen/issues/136)) ([ccad1a9](https://github.com/kstepien3/ng-zen/commit/ccad1a903bbd8edf37571f764dded81ea5fe29aa))
11
+ * **deps-dev:** bump eslint-plugin-storybook from 0.11.6 to 0.12.0 ([#137](https://github.com/kstepien3/ng-zen/issues/137)) ([e8d63f3](https://github.com/kstepien3/ng-zen/commit/e8d63f3ec9d7f0af1a4cb7e2ceb3ff2843af43ad))
12
+ * **deps-dev:** bump typescript-eslint from 8.24.0 to 8.29.0 ([#135](https://github.com/kstepien3/ng-zen/issues/135)) ([89d371f](https://github.com/kstepien3/ng-zen/commit/89d371f73f711848c548c32e8c1d5201f80c3073))
13
+
14
+ ### 🧹 Chore
15
+
16
+ * add conventional-changelog-conventionalcommits dependency ([c6d2342](https://github.com/kstepien3/ng-zen/commit/c6d23422c5866645b520f55dc3c10700fc268d06))
17
+ * change version alpha -> next ([aa5482c](https://github.com/kstepien3/ng-zen/commit/aa5482cd504a89e60eae07f6a3ea343ca8886e57))
18
+ * change version to v19.0.0-next.0 [skip ci] ([7ee3dbd](https://github.com/kstepien3/ng-zen/commit/7ee3dbd6d22a3d24c85fba0978c127f28c9248d4))
19
+ * fix problems with release ([a54af7a](https://github.com/kstepien3/ng-zen/commit/a54af7aa33259bb904df707f8450b39a1f8e00c9))
20
+ * **release:** 19.1.0-next.1 [skip ci] ([7ca3b5c](https://github.com/kstepien3/ng-zen/commit/7ca3b5c989121b41c95c261236b5c89409c83210))
21
+
22
+ ### 📚 Documentation
23
+
24
+ * **readme.md:** update links in badges ([#146](https://github.com/kstepien3/ng-zen/issues/146)) ([667f71c](https://github.com/kstepien3/ng-zen/commit/667f71c3891764f12d7b025e4b0c7e9ea872d00b))
25
+ * **README:** improve documentation ([#149](https://github.com/kstepien3/ng-zen/issues/149)) ([bbbfd4e](https://github.com/kstepien3/ng-zen/commit/bbbfd4e592907c6c544e9004d104842df5475fab))
26
+ * **storybook:** load CHANGELOG.md ([#145](https://github.com/kstepien3/ng-zen/issues/145)) ([f7df739](https://github.com/kstepien3/ng-zen/commit/f7df739ba88d4ffc1a63dea6bdec2bb3112933d0))
27
+ * update development information ([#148](https://github.com/kstepien3/ng-zen/issues/148)) ([981a998](https://github.com/kstepien3/ng-zen/commit/981a9981385d22d763fe63bfcf075970bec4495d))
28
+
1
29
  ## [19.1.0-next.1](https://github.com/kstepien3/ng-zen/compare/v19.0.0...v19.1.0-next.1) (2025-04-06)
2
30
 
3
31
  ### 🚀 New Features
package/CONTRIBUTING.md CHANGED
@@ -1,27 +1,54 @@
1
1
  # Contributing to @ng-zen/cli
2
2
 
3
- Thank you for considering contributing to **@ng-zen/cli**! This project is maintained by Konrad Stępień and is open to contributions from the community.
4
-
5
- ## How to Contribute
6
-
7
- 1. **Fork the Repository**: Create a fork of the [ng-zen repository](https://github.com/Kordrad/ng-zen) on GitHub.
8
- 2. **Create a Feature Branch**: Create a new branch for your feature or bug fix. Use a descriptive name for the branch, such as `feature/new-component` or `fix/documentation`.
9
- 3. **Make Your Changes**: Implement your feature or fix. Ensure that your code adheres to the project's coding standards and best practices.
10
- 4. **Write Tests**: If applicable, add unit tests or integration tests to cover your changes.
11
- 5. **Submit a Pull Request**: Push your changes to your fork and submit a pull request to the main repository. Include a detailed description of your changes.
12
-
13
- ## Contribution Guidelines
14
-
15
- - **Code Quality**: Ensure that your code is well-formatted, readable, and follows Angular best practices.
16
- - **Documentation**: Update documentation if necessary. Use JSDoc for code comments and ensure that Storybook examples are updated.
17
- - **Testing**: Include tests for new functionality or bug fixes.
18
- - **Commit Messages**: Use meaningful commit messages that follow the conventional commit format.
3
+ Thank you for your interest in contributing! This document outlines the essential steps and requirements for submitting contributions.
4
+
5
+ **For detailed information on project setup, the full branching strategy, specific tool usage (Storybook, Verdaccio), and the reasoning behind our workflows, please refer to the [DEVELOPMENT.md](DEVELOPMENT.md) file.**
6
+
7
+ ## Key Requirements for Contributors
8
+
9
+ 1. **Conventional Commits (Mandatory):** All commit messages **must** adhere to the Conventional Commits specification (https://www.conventionalcommits.org/). This is critical for automated releases. Invalid messages will block commits. See [Commit Messages](DEVELOPMENT.md#commit-messages-crucial) for details on commit types and their impact.
10
+ 2. **Target Branch:** Pull Requests **must target the `develop` branch.** PRs targeting `master` or `next` directly will generally be closed unless specifically requested for hotfixes.
11
+ 3. **Automated Checks:**
12
+
13
+ - Code formatting and basic lint fixes are applied automatically on commit via `husky` and `nano-staged`.
14
+ - Full CI checks (linting, testing, building) run automatically on Pull Requests via GitHub Actions (`ci.yml`). **Your PR must pass all CI checks to be eligible for merging.**
15
+
16
+ ## Contribution Steps
17
+
18
+ 1. **Fork & Clone:** Fork the [ng-zen repository](https://github.com/kstepien3/ng-zen) and clone your fork locally. _(See [Prerequisites & Setup](DEVELOPMENT.md#prerequisites--setup) if needed)_.
19
+ 2. **Sync `develop`:** Ensure your local `develop` branch is up-to-date:
20
+ ```bash
21
+ git switch develop
22
+ git pull origin develop
23
+ ```
24
+ 3. **Create Branch:** Create your working branch **from `develop`**:
25
+ ```bash
26
+ # Use format: <type>/<short-description>
27
+ git switch -c feat/add-hover-effect develop
28
+ ```
29
+ 4. **Develop:** Implement your code changes. Remember to add or update relevant unit tests (`*.spec.ts`) and documentation/Storybook stories (`*.stories.ts`, etc.) as necessary. _(See [Working with Storybook](DEVELOPMENT.md#working-with-storybook) section for more details)_.
30
+ 5. **Commit:** Commit your work using **Conventional Commit** messages.
31
+ ```bash
32
+ git add .
33
+ git commit -m "feat(button): add configurable hover effect"
34
+ ```
35
+ 6. **Verify Locally:** Before pushing, ensure all local checks pass:
36
+ ```bash
37
+ pnpm run lint
38
+ pnpm run test
39
+ ```
40
+ _(See [Running Tests and Linting](DEVELOPMENT.md#running-tests-and-linting) for details on these commands)_.
41
+ 7. **Push:** Push your branch to your fork: `git push origin feat/add-hover-effect`
42
+ 8. **Create Pull Request:** Open a Pull Request on GitHub from **your branch** to the **`kstepien3/ng-zen:develop`** branch. Provide a clear title and description.
43
+
44
+ ## After Your PR is Submitted
45
+
46
+ - Wait for the automated CI checks to complete. Address any failures.
47
+ - Respond to code review comments and feedback from maintainers.
48
+ - Once approved and CI passes, a maintainer will merge your PR into `develop`. Your changes will then be included in future pre-releases (from `next`) and stable releases (from `master`).
19
49
 
20
50
  ## Communication
21
51
 
22
- - **Issues**: If you encounter any issues or have questions, feel free to open an issue on GitHub.
23
- - **Pull Request Reviews**: Be prepared to address feedback from maintainers during the review process.
24
-
25
- ## Acknowledgments
52
+ - Use [GitHub Issues](https://github.com/kstepien3/ng-zen/issues) for bug reports, feature proposals, or questions _before_ starting significant work.
26
53
 
27
- Your contributions are invaluable to the growth and success of **@ng-zen/cli**. Thank you for your time and effort!
54
+ Thank you for contributing to **@ng-zen/cli**
package/DEVELOPMENT.md CHANGED
@@ -1,80 +1,138 @@
1
1
  # Local Development Setup
2
2
 
3
- This guide will help you set up a local development environment for **@ng-zen/cli**.
3
+ This guide details setting up a local development environment for **@ng-zen/cli**. It covers the necessary tools, the project's branching strategy, and the automated workflows in place.
4
4
 
5
- ## Prerequisites
5
+ **For a step-by-step guide specifically for external contributors submitting Pull Requests, please refer to `CONTRIBUTING.md`.**
6
6
 
7
- - Node.js (preferably the latest LTS version)
8
- - pnpm
9
- - Angular CLI installed globally
10
- - verdaccio
7
+ **Key Technologies & Concepts:**
11
8
 
12
- ## Working with Storybook
9
+ - **pnpm:** The required package manager (version in `package.json`). Use Corepack (`corepack enable`).
10
+ - **Storybook:** For UI component development and visualization.
11
+ - **Conventional Commits:** **Mandatory format** for commit messages (https://www.conventionalcommits.org/). Crucial for automation.
12
+ - **Automated Formatting/Linting:** `husky` + `nano-staged` apply formatting and basic fixes on commit.
13
+ - **Automated CI:** GitHub Actions (`ci.yml`) validate Pull Requests.
14
+ - **Automated Releases:** `semantic-release` manages releases based on commits.
15
+ - **Branching Strategy:** Detailed below.
13
16
 
14
- **Storybook** is the primary tool for developing and testing UI components. To start Storybook, run:
17
+ ## Table of Contents
15
18
 
16
- ```bash
17
- pnpm run storybook
18
- ```
19
+ - [Prerequisites & Setup](#prerequisites--setup)
20
+ - [Branching Strategy & Workflow](#branching-strategy--workflow)
21
+ - [Commit Messages (Crucial!)](#commit-messages-crucial)
22
+ - [Branch Synchronization (Maintainer Task)](#branch-synchronization-maintainer-task)
23
+ - [Working with Storybook](#working-with-storybook)
24
+ - [Running Tests and Linting](#running-tests-and-linting)
25
+ - [Building the Library](#building-the-library)
26
+ - [Optional: Local Testing with Verdaccio](#optional-local-testing-with-verdaccio)
27
+
28
+ ## Prerequisites & Setup
29
+
30
+ 1. Ensure **Node.js** is installed (use a version compatible with the project's Angular version; check CI workflows for reference).
31
+ 2. Enable **Corepack**: `corepack enable`.
32
+ 3. Clone the repository.
33
+ 4. Install dependencies using **pnpm**: `pnpm install`.
34
+
35
+ ## Branching Strategy & Workflow
36
+
37
+ This project employs a branching model designed for stability and automated releases:
38
+
39
+ - **`master`**: Contains only **stable, production-ready** code. Receives merges only from `next` during official releases or for critical hotfixes. Automated stable releases (`vX.Y.Z`) are triggered from here. **Direct work is forbidden.**
40
+ - **`next`**: The **pre-release / release candidate** branch. Code merged here from `develop` should be stable enough for final testing. Merges trigger automated pre-releases (`vX.Y.Z-next.N`) published to NPM under the `next` dist-tag.
41
+ - **`develop`**: The main **integration branch**. All feature branches are merged here first. This branch collects changes intended for the _next_ release cycle. **Target Pull Requests here.**
42
+ - **Feature/Fix Branches (`feature/*`, `fix/*`, etc.)**: Used for individual tasks. Always branch **off `develop`**.
19
43
 
20
- This command will launch Storybook in your default browser, allowing you to interact with and test the components visually.
44
+ **General Flow:** `Feature/Fix Branch` -> **`develop`** -> `next` -> `master`
21
45
 
22
- ### Building Storybook
46
+ ## Commit Messages (Crucial!)
23
47
 
24
- To build a static version of Storybook for deployment, testing or release, use:
48
+ Strict adherence to the **Conventional Commits** specification (https://www.conventionalcommits.org/) is **required**.
49
+
50
+ - **Why?** Commit messages directly control automatic version bumping (`semantic-release`) and `CHANGELOG.md` generation.
51
+ - **Format:** `<type>(<scope>): <subject>` (e.g., `feat(button): add loading spinner`).
52
+ - **Key Types & Impact (on Stable Release):**
53
+ - `feat`: New feature -> `minor` version bump.
54
+ - `fix`: Bug fix -> `patch` version bump.
55
+ - `!` (e.g., `refactor(core)!:`) or `BREAKING CHANGE:` footer -> `major` version bump.
56
+ - Other types (`docs`, `chore`, `style`, `test`, `ci`, `build`, `refactor`, `perf`) document changes but don't trigger version bumps alone.
57
+ - **Validation:** `husky` + `commitlint` automatically check message format upon commit. Invalid messages will fail the commit.
58
+
59
+ _(See `CONTRIBUTING.md` for a concise summary focused on the commit action itself)._
60
+
61
+ ## Branch Synchronization (Maintainer Task)
62
+
63
+ Maintain consistency across `master`, `next`, and `develop` by merging release commits and hotfixes. **Performed by maintainers.**
64
+
65
+ **General Update Step:** Fetch latest remote state:
25
66
 
26
67
  ```bash
27
- pnpm run storybook:build
68
+ git fetch origin --prune
28
69
  ```
29
70
 
30
- ## Setting Up Verdaccio
71
+ ### 1. Sync `next` with `master` (After Stable Release or Hotfix)
72
+
73
+ This is the most comprehensive synchronization, ensuring all development branches are aligned with the latest production code.
74
+
75
+ - **Purpose:** Incorporate stable changes into the release candidate branch.
76
+ - **Flow:** `master` -> `next`.
31
77
 
32
- 1. **Install Verdaccio**:
33
- Follow the instructions on the [Verdaccio website](https://verdaccio.org/docs/installation#installing-the-cli) to install Verdaccio.
78
+ ```bash
79
+ # Update local 'next', merge 'origin/master', push 'next'
80
+ git switch next && git pull origin next && git merge origin/master && git push origin next
81
+ ```
82
+
83
+ _(Note: Merge conflicts might occur at either merge step and need manual resolution before continuing/pushing.)_
84
+
85
+ ### 2. Sync `develop` with `next` (After Pre-release on next OR after syncing next with master)
34
86
 
35
- 2. **Start Local Registry**:
36
- Run the following command to start the local registry:
87
+ - **Purpose:** Keep `develop` aligned with the latest pre-release state or the latest stable code propagated through next. Includes release commits (`chore(release): ...`).
88
+ - **Flow:** `next` -> `develop`.
37
89
 
38
- ```bash
39
- pnpm run verdaccio
40
- ```
90
+ ```bash
91
+ # Update local 'next', merge 'origin/master', push 'next'
92
+ git switch develop && git pull origin develop && git merge origin/next && git push origin develop
93
+ ```
41
94
 
42
- 3. **Configure npm to Use Local Registry**:
43
- Follow the prompts from Verdaccio to configure npm to use the local registry.
95
+ _(Note: Resolve conflicts before pushing.)_
44
96
 
45
- ## Publishing Locally
97
+ ---
46
98
 
47
- 1. **Publish Package Locally**:
48
- Use the following command to publish the package to your local registry:
49
- ```bash
50
- pnpm run publish:local
51
- ```
52
- 2. **Test in Angular Project**:
53
- Add the package to an Angular project using the local registry:
54
- ```bash
55
- ng add @ng-zen/cli --registry http://localhost:4873/
56
- ```
99
+ Contributors should regularly update their local `develop` branch (`git switch develop && git pull origin develop`).
57
100
 
58
- ## Running Tests
101
+ ## Working with Storybook
59
102
 
60
- - **Unit Tests**: Run unit tests using the command:
103
+ Develop and visualize components using Storybook.
104
+
105
+ - **Start Storybook:**
61
106
  ```bash
62
- pnpm run test
107
+ pnpm run storybook
63
108
  ```
64
- - **Linting**: Check code style and fix issues with:
109
+ - **Build Static Storybook:**
65
110
  ```bash
66
- pnpm run lint
67
- pnpm run lint:fix
111
+ pnpm run storybook:build
68
112
  ```
69
113
 
70
- ## Building and Packaging
114
+ ## Running Tests and Linting
115
+
116
+ `nano-staged` auto-formats/fixes on commit, but manual verification is recommended before creating a PR. The CI (`ci.yml`) runs these checks automatically on PRs.
117
+
118
+ - **Lint:** `pnpm run lint` (checks for errors not auto-fixed)
119
+ - **Test:** `pnpm run test` (runs unit tests)
120
+
121
+ ## Building the Library
71
122
 
72
- **Build** the project using:
123
+ Build the distributable library files:
73
124
 
74
125
  ```bash
75
126
  pnpm run build
76
127
  ```
77
128
 
78
- ---
129
+ Output artifacts are placed in the `dist/` directory
130
+
131
+ ## Optional: Local Testing with Verdaccio
132
+
133
+ Test your local build in a separate project before submitting a PR to develop.
79
134
 
80
- By following these steps, you should be able to set up a fully functional local development environment for **@ng-zen/cli**.
135
+ 1. Install & Run Verdaccio: `npm install -g verdaccio` (or `pnpm add -g`), then `verdaccio`.\
136
+ 2. Build Library: `pnpm run build`.
137
+ 3. Publish Locally: `pnpm run publish:verdaccio`.
138
+ 4. Install in Test Project: `ng add @ng-zen/cli --registry http://localhost:4873/` (or pnpm add ...).
package/README.md CHANGED
@@ -1,21 +1,24 @@
1
1
  # @ng-zen/cli
2
2
 
3
- Angular library that helps you build better applications faster 🚀 Built with modern best practices and full customization in mind 💡
4
-
5
- [![Build Status](https://img.shields.io/github/actions/workflow/status/kstepien3/ng-zen/ci.yml?branch=master)](https://github.com/kstepien3/ng-zen)
6
- [![License](https://img.shields.io/badge/License-BSD--2--Clause-f5c076)](https://github.com/kstepien3/ng-zen/blob/master/LICENSE)
7
- [![Version](https://img.shields.io/npm/v/@ng-zen/cli)](https://www.npmjs.com/package/@ng-zen/cli)
3
+ [![Build Status (master)](https://img.shields.io/github/actions/workflow/status/kstepien3/ng-zen/ci.yml?branch=master&label=build-master)](https://github.com/kstepien3/ng-zen/actions/workflows/ci.yml)
4
+ [![Build Status (next)](https://img.shields.io/github/actions/workflow/status/kstepien3/ng-zen/ci.yml?branch=next&label=build-next)](https://github.com/kstepien3/ng-zen/actions/workflows/ci.yml)
5
+ [![NPM Version (latest)](https://img.shields.io/npm/v/@ng-zen/cli/latest?label=npm%40latest)](https://www.npmjs.com/package/@ng-zen/cli)
6
+ [![NPM Version (next)](https://img.shields.io/npm/v/@ng-zen/cli/next?label=npm%40next)](https://www.npmjs.com/package/@ng-zen/cli)
7
+ [![License](https://img.shields.io/github/license/kstepien3/ng-zen)](https://github.com/kstepien3/ng-zen/blob/master/LICENSE)
8
8
 
9
9
  [![](https://img.shields.io/badge/-Repository-181818?style=flat&logo=github&logoColor=white)](https://github.com/kstepien3/ng-zen)
10
- [![](https://img.shields.io/badge/-NPM-CB3837?style=flat&logo=npm&logoColor=white)](https://github.com/kstepien3/ng-zen)
11
- [![](https://img.shields.io/badge/-Storybook-FF4785?style=flat&logo=storybook&logoColor=white)](https://www.npmjs.com/package/@ng-zen/cli)
10
+ [![](https://img.shields.io/badge/-Storybook%20Demo-FF4785?style=flat&logo=storybook&logoColor=white)](https://kstepien3.github.io/ng-zen/)
11
+
12
+ Generate modern, customizable Angular UI components and elements directly into your project 🚀
13
+
14
+ Built with best practices and developer experience in mind 💡
12
15
 
13
16
  ## Table of Contents
14
17
 
15
18
  1. [Features](#features)
16
19
  2. [Ideal for](#ideal-for)
17
20
  3. [Quick Start](#quick-start)
18
- 4. [Installation](#Installation)
21
+ 4. [Installation](#installation)
19
22
  5. [Usage](#usage)
20
23
  6. [Why @ng-zen/cli?](#why-ng-zencli)
21
24
  7. [Examples](#examples)
@@ -28,42 +31,55 @@ Angular library that helps you build better applications faster 🚀 Built with
28
31
 
29
32
  ## Features
30
33
 
31
- - 🧩 **Component Library** Beautifully designed, rigorously tested UI components
32
- - 🎨 **Fully Customizable** Easy to modify components with both SCSS and CSS variables
33
- - 📱 **Responsive Design** Components work seamlessly across all device sizes
34
- - 📚 **Comprehensive Documentation** Includes Storybook integration and detailed JSDoc
35
- - ✅ **Test Coverage** All components include unit tests
36
- - 🚀 **Modern Angular** Uses standalone components, OnPush change detection, signals, and other Angular best practices
34
+ - 🧩 **Component Schematics:** Generates ready-to-use UI component code (`.ts`, `.html`, `.scss`).
35
+ - 🎨 **Fully Customizable:** Easily theme and modify components via CSS variables and editable SCSS.
36
+ - 📱 **Responsive Design:** Components designed to adapt across various screen sizes.
37
+ - 📚 **Comprehensive Documentation:** Includes Storybook examples, JSDoc annotations, and `README.md` per component.
38
+ - ✅ **Test Coverage:** Generated components include unit tests (`.spec.ts`).
39
+ - 🚀 **Modern Angular:** Leverages standalone components, `OnPush` change detection, signals, and current best practices.
40
+ - 🛠 **Extensible:** Planned support for generating directives, pipes, services, and more.
37
41
 
38
42
  ## Ideal for
39
43
 
40
- - 🏢 **Large Enterprises** Perfect for companies planning to create their own UI kits, ensuring consistency across all projects.
41
- - 📈 **Individual Projects** Suitable for projects requiring custom components, allowing developers to focus on unique features.
42
- - 👩‍💻 **Developers** Accelerates application development by providing ready-to-use UI tools and speeding up the design process.
44
+ - 🏢 **Enterprise UI Kits:** A great starting point for building consistent, internal component libraries.
45
+ - 📈 **Custom Projects:** Accelerates development when custom UI elements are needed, avoiding vendor lock-in.
46
+ - 👩‍💻 **Developers:** Speeds up UI creation and ensures adherence to modern Angular patterns.
43
47
 
44
48
  ## Quick Start
45
49
 
46
- ### Installation
50
+ The easiest way to add `@ng-zen/cli` and its schematics to your project:
47
51
 
48
52
  ```bash
49
53
  ng add @ng-zen/cli
50
54
  ```
51
55
 
52
- This command will install the package and set up the necessary configurations in your Angular project 📦.
56
+ This command installs the package and performs initial setup.
57
+
58
+ ## Installation
59
+
60
+ Alternatively, you can install it manually:
61
+
62
+ ```bash
63
+ # For the latest stable version
64
+ pnpm add -D @ng-zen/cli
65
+
66
+ # For the latest pre-release version (includes newest features/fixes)
67
+ pnpm add -D @ng-zen/cli@next
68
+ ```
53
69
 
54
70
  ## Usage
55
71
 
56
72
  ### Generating Components
57
73
 
58
- Use the Angular CLI to generate components:
74
+ Use the Angular CLI schematic:
59
75
 
60
76
  ```bash
61
77
  ng generate @ng-zen/cli:component
62
78
  ```
63
79
 
64
- This interactive command will guide you through selecting and configuring components for your project 📊.
80
+ This interactive prompt guides you through selecting and configuring the desired component(s) 📊.
65
81
 
66
- For more information use
82
+ To see available options without running interactively:
67
83
 
68
84
  ```bash
69
85
  ng generate @ng-zen/cli:component --help
@@ -71,55 +87,54 @@ ng generate @ng-zen/cli:component --help
71
87
 
72
88
  ### Future Generators
73
89
 
74
- The library will soon include support for generating:
90
+ Support for generating other Angular building blocks is planned:
75
91
 
76
92
  - 📝 Directives
77
- - 📊 Pipes
93
+ - 💧 Pipes
78
94
  - 🛠 Services
79
- - And more...
95
+ - ... and more!
80
96
 
81
97
  ## Why @ng-zen/cli?
82
98
 
83
- Unlike other UI libraries, @ng-zen/cli:
99
+ Unlike pre-compiled UI libraries, `@ng-zen/cli`:
84
100
 
85
- - Generates actual code in your project that you can edit and customize 📝
86
- - Follows modern Angular best practices (_standalone components, OnPush, Signals, etc._) 🚀
87
- - Provides comprehensive documentation and testing support 📚
88
- - Makes customization straightforward with well-organized style variables 🎨
89
- - Focuses on developer experience and maintainability 💻
101
+ - **Generates Source Code:** You get actual, editable component code in your project, not opaque `<library-button>` tags.
102
+ - **Full Control:** Modify the generated code and styles freely to perfectly match your application's needs.
103
+ - **Modern Foundation:** Built on current Angular features (standalone, signals, etc.).
104
+ - **Transparency:** Understand exactly how components work and evolve them with your project.
105
+ - **Developer Experience:** Focuses on ease of use, customization, and maintainability.
90
106
 
91
107
  ## Examples
92
108
 
93
- Each generated code comes with:
109
+ Each generated component set includes:
94
110
 
95
111
  - Angular component code (`.ts`, `.html`, `.scss`)
96
112
  - Unit tests (`.spec.ts`)
97
- - Storybook stories (`.stories.ts`)
98
- - Export files via `index.ts`
99
- - Detailed documentation 📚
113
+ - Storybook stories (`.stories.ts`) for visual development and documentation.
114
+ - An `index.ts` for easy exporting.
115
+ - A component-specific `README.md` (generated from a template).
100
116
 
101
117
  ## Documentation
102
118
 
103
- Components are documented using:
104
-
105
- - Comprehensive JSDoc annotations 📝
106
- - README file
107
- - Storybook integration for visual examples 📊
108
- - Compodoc for full API documentation 📚
119
+ - **Storybook:** The primary source for visual examples and interactive demos: [View Storybook Demo](https://kstepien3.github.io/ng-zen/)
120
+ - **JSDoc:** Code includes documentation comments.
121
+ - **READMEs:** Project-level (`README.md`, `DEVELOPMENT.md`, `CONTRIBUTING.md`) and component-level READMEs.
122
+ - **Changelog:** Automatically generated history of changes: [CHANGELOG.md](https://github.com/kstepien3/ng-zen/blob/master/CHANGELOG.md)
109
123
 
110
124
  ## Project Status
111
125
 
112
- 🚧 **Under Development** 🚧
126
+ 🚧 **Actively Developed** 🚧
113
127
 
114
- This project is actively maintained and new features are being added regularly.
115
- Plans include support for generating directives, pipes, and services.
128
+ - The core schematics and existing components are functional but continuously improved.
129
+ - New generators (directives, pipes, etc.) are planned.
130
+ - The `master` branch represents the latest **stable** release.
131
+ - The `next` branch contains **pre-release** versions with the newest features and fixes – use `@ng-zen/cli@next` to try them out.
116
132
 
117
- You don't have to worry about the code, because you can use and edit the code as you want.
118
- Just the code I have created is still being developed with new functionalities.
133
+ Since the tool generates code directly into your project, you own and control that code. Updates to `@ng-zen/cli` itself primarily bring new generator features or improvements to the generation process, not breaking changes to already generated components.
119
134
 
120
135
  ## Contributing
121
136
 
122
- Contributions are welcome! Please feel free to submit a Pull Request 🤝.
137
+ Contributions are highly welcome! If you'd like to help improve `@ng-zen/cli`, please read our **[Contribution Guidelines (CONTRIBUTING.md)](https://github.com/kstepien3/ng-zen/blob/master/CONTRIBUTING.md)** for details on the workflow, commit message requirements, and setup. 🤝
123
138
 
124
139
  ## License
125
140
 
@@ -127,13 +142,14 @@ This project is licensed under the [BSD 2-Clause License](https://github.com/kst
127
142
 
128
143
  ## Author
129
144
 
130
- The Project is maintained by Konrad Stępień. Reach me here:
145
+ Maintained by Konrad Stępień.
131
146
 
132
- - Email: [kord.stp@gmail.com](mailto:kord.stp@gmail.com?subject=%5BNG-ZEN%5D%20Hello%21) 📨
147
+ - GitHub: [@kstepien3](https://github.com/kstepien3)
133
148
  - LinkedIn: [Konrad Stępień](https://www.linkedin.com/in/konradstepien/) 👥
149
+ - Email: [kord.stp@gmail.com](mailto:kord.stp@gmail.com?subject=%5BNG-ZEN%5D%20Query) 📨
134
150
 
135
151
  ## FAQ
136
152
 
137
153
  ### How do I customize a generated component?
138
154
 
139
- All generated components are fully editable and include SCSS/CSS variables for easy customization.
155
+ Generated components reside entirely within your project's source code. You can directly edit the `.ts`, `.html`, and `.scss` files. Components are structured to use CSS variables and SCSS for easier theming and modification.
package/angular.json CHANGED
@@ -22,7 +22,7 @@
22
22
  "build": {
23
23
  "builder": "./projects/schematic-builder:build",
24
24
  "options": {
25
- "files": ["src/**", "README.md", "package.json", "LICENSE"],
25
+ "files": ["src/**", "README.md", "package.json", "LICENSE", "CHANGELOG.md"],
26
26
  "tsConfig": "tsconfig.schematics.json"
27
27
  }
28
28
  },
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ng-zen/cli",
3
- "version": "19.1.0-next.1",
3
+ "version": "19.1.0",
4
4
  "description": "A CLI tool for generating customizable, modern Angular UI components using schematics.",
5
5
  "scripts": {
6
6
  "ng": "ng",
@@ -94,7 +94,7 @@
94
94
  "@storybook/blocks": "^8.5.3",
95
95
  "@storybook/test": "^8.5.5",
96
96
  "@types/jest": "29.5.14",
97
- "angular-eslint": "19.0.2",
97
+ "angular-eslint": "19.3.0",
98
98
  "conventional-changelog-conventionalcommits": "^8.0.0",
99
99
  "copyfiles": "^2.4.1",
100
100
  "cpy": "^11.1.0",
@@ -103,7 +103,7 @@
103
103
  "eslint-plugin-import": "^2.31.0",
104
104
  "eslint-plugin-prettier": "^5.2.3",
105
105
  "eslint-plugin-simple-import-sort": "^12.1.1",
106
- "eslint-plugin-storybook": "^0.11.4",
106
+ "eslint-plugin-storybook": "^0.12.0",
107
107
  "eslint-plugin-unicorn": "^57.0.0",
108
108
  "eslint-plugin-unused-imports": "^4.1.4",
109
109
  "execa": "^9.5.2",
@@ -121,7 +121,7 @@
121
121
  "stylelint": "^16.17.0",
122
122
  "stylelint-config-standard-scss": "^14.0.0",
123
123
  "typescript": "~5.7.3",
124
- "typescript-eslint": "8.24.0"
124
+ "typescript-eslint": "8.29.1"
125
125
  },
126
126
  "eslintConfig": {
127
127
  "extends": [