refactor(architecture): add new modules (#19)

.ecrc

@@ -3,7 +3,6 @@
     "CHANGELOG.md",
     "config.yml",
     "CONTRIBUTING.md",
-    "css-rules.js",
     "PULL_REQUEST_TEMPLATE.md",
     "README.md"
   ]

README.md

@@ -1,138 +1,61 @@
-# Stylelint Config Archoleat SCSS
+# Stylelint Config Extended SCSS
 
 ![ESM Only](https://img.shields.io/badge/ESM-only-gray?labelColor=fe0)
+![NPM Version](https://img.shields.io/npm/v/%40archoleat%2Fstylelint-config-extended-scss)
+![Test](https://img.shields.io/github/actions/workflow/status/Archoleat/stylelint-config-extended-scss/mocha.yml?label=Test)
+![NPM Downloads](https://img.shields.io/npm/dm/%40archoleat%2Fstylelint-config-extended-scss)
 ![Commitlint](https://img.shields.io/github/actions/workflow/status/Archoleat/core/commitlint.yml?label=Commitlint)
 ![CodeQL](https://img.shields.io/github/actions/workflow/status/Archoleat/stylelint-config-extended-scss/codeql.yml?label=CodeQL)
-![Test](https://img.shields.io/github/actions/workflow/status/Archoleat/stylelint-config-extended-scss/mocha.yml?label=Test)
 ![Editorconfig](https://img.shields.io/github/actions/workflow/status/Archoleat/stylelint-config-extended-scss/editorconfig.yml?label=Editorconfig)
 ![Prettier](https://img.shields.io/github/actions/workflow/status/Archoleat/stylelint-config-extended-scss/prettier.yml?label=Prettier)
 ![Markdown](https://img.shields.io/github/actions/workflow/status/Archoleat/stylelint-config-extended-scss/markdown.yml?label=Markdown)
 ![ESLint](https://img.shields.io/github/actions/workflow/status/Archoleat/stylelint-config-extended-scss/eslint.yml?label=ESLint)
-![NPM Downloads](https://img.shields.io/npm/dm/%40archoleat%2Fstylelint-config-extended-scss)
-![NPM Version](https://img.shields.io/npm/v/%40archoleat%2Fstylelint-config-extended-scss)
-
-## Table of Contents
-
--   [Table of Contents](#table-of-contents)
-
--   [Features](#features)
-    -   [Extends](#extends)
-    -   [Plugins](#plugins)
-    -   [Pseudo Elements and Classes](#pseudo-elements-and-classes)
-    -   [Rules](#rules)
-    -   [Naming Pattern](#naming-pattern)
-    -   [Key Points](#key-points)
 
--   [Additions](#additions)
-    -   [Husky](#husky)
+> Extended Config for Stylelint With Property Sorting
 
--   [Authors](#authors)
-
--   [Contributors](#contributors)
-
--   [Contributing](#contributing)
-
--   [Versioning](#versioning)
+## Table of Contents
 
+-   [This Config](#this-config)
+-   [Installation](#installation)
+-   [Usage](#usage)
 -   [License](#license)
 
-## Extended Config for Stylelint With Property Sorting
-
-This project is built on [**Archoleat Repo Template**](https://github.com/Archoleat/archoleat-repo-template).
-
-> \[!TIP]
-> Nice addition for [**Archoleat**](https://github.com/Archoleat/archoleat)!
-
-## Features
-
-### Extends
-
--   **`stylelint-config-standard-scss`**: Provides a baseline for common CSS
-    best practices and SCSS consistency.
-
-### Plugins
+## This Config
 
--   **`stylelint-high-performance-animation`**: Optimizes animation performance
-    by identifying potential issues and suggesting best practices.
+-   Extends the [**`stylelint-config-standard-scss`** shared config](https://github.com/stylelint-scss/stylelint-config-standard-scss)
+    and configures its rules for **SCSS**.
 
--   **`stylelint-order`**: Enforces consistent property ordering within
-    declarations, sorting over 480+ rules to enhance readability
-    and maintainability.
+-   **BEM** naming convention likely enforced, encouraging modularity,
+    maintainability, and clarity in class naming.
 
-    > If a mixin or function has no nested code, it is located at the top,
-    > otherwise it will be at the bottom.
-
--   **`stylelint-plugin-defensive-css`**: Promotes robust CSS by identifying
-    potential vulnerabilities and cross-browser inconsistencies.
-
--   **`stylelint-plugin-logical-css`**: Encourages the use of logical
-    properties for improved accessibility and flexibility in
-    direction-aware layouts.
-
-    > In future major versions, all deprecated properties
-    > will be removed from sorting!
-
--   **`stylelint-prettier`**: Integrates **Prettier** for
-    consistent code formatting.
-
-### Pseudo Elements and Classes
-
--   Supports **20+** pseudo elements and **65+** pseudo classes
-    for diverse styling needs.
-
-    > Experimental and non-standard pseudo classes and
-    > elements are used in the config.
-
-### Naming Pattern
-
-**BEM** naming convention likely enforced, encouraging modularity,
-maintainability, and clarity in class naming.
-
-### Key Points
-
--   Comprehensive configuration addressing performance, maintainability,
-    accessibility, and best practices.
-
--   Leverages a solid foundation from **`stylelint-config-standard-scss`**
-    with valuable plugins.
-
--   Enforces consistent code style and naming conventions for better
-    readability and collaboration.
+-   Experimental and non-standard pseudo classes, pseudo elements and properties
+    are used in the config.
 
 -   Sorts **over 400 properties** using the **`stylelint-order`** plugin for
     enhanced clarity and maintainability.
 
-    > Experimental and non-standard properties are used in the config.
-
-## Additions
-
-### Husky
-
-This repository uses **.husky** as a submodule.
-**.husky** runs **`pre-commit`** hook and **`commit-msg`**.
-
-## Authors
-
-See also the list of [**Authors**](AUTHORS.md).
-
-## Contributors
+-   **`stylelint-plugin-logical-css`** replace some properties
+    with logical alternatives.
 
-If you want to improve something, you can write about it
-[**here**](https://github.com/Archoleat/stylelint-config-extended-scss/issues/new/choose).
+-   **`stylelint-high-performance-animation`** enhances your animations.
 
-You can also view a list of [**Contributors**](CONTRIBUTORS.md).
+-   **`stylelint-gamut`** throw warning if color goes out of **sRGB**
+    color space and is not wrapped in **`@media (color-gamut: p3) {}`**
+    or **`@media (color-gamut: rec2020) {}`**
 
-## Contributing
+## Installation
 
-Please read [**Contributing**](CONTRIBUTING.md)
-and [**Code of Conduct**](CODE_OF_CONDUCT.md) for details,
-and the process for submitting **Pull Request** to us.
+```bash
+npm i -D @archoleat/stylelint-config-extended-scss
+```
 
-## Versioning
+## Usage
 
-We use [**SemVer**](https://semver.org) for versioning.
-You can see the available versions
-[**here**](https://github.com/Archoleat/stylelint-config-extended-scss/tags).
+```js
+export default {
+  extends: '@archoleat/stylelint-config-extended-scss',
+};
+```
 
 ## License
 

index.js

@@ -1,14 +1,13 @@
-// Copyright (c) 2024 Archoleat
-
-import CSSRules from './utilities/css-rules.js';
-import SCSSRules from './utilities/scss-rules.js';
+import CSSRules from './utilities/rules/css.js';
+import SCSSRules from './utilities/rules/scss.js';
 
 import pluginsSettings from './utilities/plugins-settings.js';
-import propertiesOrder from './utilities/order.js';
+import propertiesOrder from './utilities/properties/order.js';
 
 export default {
   extends: ['stylelint-config-standard-scss'],
   plugins: [
+    'stylelint-gamut',
     'stylelint-high-performance-animation',
     'stylelint-order',
     'stylelint-plugin-defensive-css',

package.json

@@ -4,7 +4,7 @@
   "author": "Archoleat",
   "name": "@archoleat/stylelint-config-extended-scss",
   "description": "Extended config for Stylelint with property sorting",
-  "version": "1.1.1",
+  "version": "1.2.0",
   "license": "MIT",
   "keywords": [
     "archoleat-scss",
@@ -43,6 +43,7 @@
   "dependencies": {
     "stylelint": "*",
     "stylelint-config-standard-scss": "*",
+    "stylelint-gamut": "*",
     "stylelint-high-performance-animation": "*",
     "stylelint-order": "*",
     "stylelint-plugin-defensive-css": "*",
@@ -76,6 +77,7 @@
   "peerDependencies": {
     "stylelint": "*",
     "stylelint-config-standard-scss": "*",
+    "stylelint-gamut": "*",
     "stylelint-high-performance-animation": "*",
     "stylelint-order": "*",
     "stylelint-plugin-defensive-css": "*",

utilities/plugins-settings.js

@@ -1,6 +1,5 @@
-// Copyright (c) 2024 Archoleat
-
 const pluginsSettings = {
+  'gamut/color-no-out-gamut-range': true,
   'plugin/no-low-performance-animation-properties': true,
   'plugin/use-defensive-css': [
     true,

utilities/deprecated.js → utilities/properties/deprecated.js

@@ -1,5 +1,3 @@
-// Copyright (c) 2024 Archoleat
-
 const deprecated = {
   property: {
     float: 'float',

utilities/experimental.js → utilities/properties/experimental.js

@@ -1,5 +1,3 @@
-// Copyright (c) 2024 Archoleat
-
 const experimental = {
   pseudoElement: {
     grammarError: '&::grammar-error',

utilities/non-standard.js → utilities/properties/non-standard.js

@@ -1,5 +1,3 @@
-// Copyright (c) 2024 Archoleat
-
 const nonStandard = {
   pseudoElement: {
     webkit: {

utilities/order.js → utilities/properties/order.js

@@ -1,5 +1,3 @@
-// Copyright (c) 2024 Archoleat
-
 import deprecated from './deprecated.js';
 import experimental from './experimental.js';
 import nonStandard from './non-standard.js';

utilities/regexps.js

@@ -0,0 +1,8 @@
+const PATTERN = '[a-z0-9]';
+const REGEXP = {
+  BEM_BLOCK: `[a-z]${PATTERN}*(-${PATTERN}+)`,
+  BEM_ELEMENT: `(__${PATTERN}+(-${PATTERN}+)*)`,
+  BEM_MODIFIER: `(--${PATTERN}+(-${PATTERN}+)*)`,
+};
+
+export default REGEXP;

utilities/css-rules.js → utilities/rules/css.js

@@ -1,4 +1,4 @@
-// Copyright (c) 2024 Archoleat
+import REGEXP from '../regexps.js';
 
 const CSSRules = {
   'color-named': 'never',
@@ -16,7 +16,7 @@ const CSSRules = {
   'no-descending-specificity': null,
   'no-unknown-animations': true,
   'selector-class-pattern': [
-    '^[a-z][a-z0-9]*(-[a-z0-9]+)*(__[a-z0-9]+(-[a-z0-9]+)*)?(--[a-z0-9]+(-[a-z0-9]+)*)?$',
+    `^${REGEXP.BEM_BLOCK}*${REGEXP.BEM_ELEMENT}?${REGEXP.BEM_MODIFIER}?$`,
     {
       message: 'Expected class name to be bem',
     },

utilities/scss-rules.js → utilities/rules/scss.js

@@ -1,5 +1,3 @@
-// Copyright (c) 2024 Archoleat
-
 const SCSSRules = {
   'scss/at-each-key-value-single-line': true,
   'scss/at-function-named-arguments': 'never',