@mozaic-ds/angular 0.23.0-beta.1 → 0.23.1

package/CHANGELOG.md

@@ -0,0 +1,51 @@
+
+
+## [0.23.1](https://github.com/adeo/mozaic-angular/compare/0.23.0...0.23.1) (2023-09-15)
+
+
+### Bug Fixes
+
+* **npm/script:** update prepublishOnly script ([915dcb3](https://github.com/adeo/mozaic-angular/commit/915dcb35d0596599a556a493b6dc4c04593a6c2f))
+
+# [0.23.0](https://github.com/adeo/mozaic-angular/compare/0.23.0-beta.0...0.23.0) (2023-09-15)
+
+
+### Features
+
+* **autocomplete:** Add autocomplete component ([#82](https://github.com/adeo/mozaic-angular/issues/82)) ([22eeb22](https://github.com/adeo/mozaic-angular/commit/22eeb22f14c43160e32e63f8ced64a9bfe16c820))
+* **datatable:** add empty body ([#73](https://github.com/adeo/mozaic-angular/issues/73)) ([ab0dc82](https://github.com/adeo/mozaic-angular/commit/ab0dc824b0c2cd9aeaf3683c61857bf8bfeb597e))
+* **datatable:** Add empty body button ([#77](https://github.com/adeo/mozaic-angular/issues/77)) ([d927ee3](https://github.com/adeo/mozaic-angular/commit/d927ee329244136a1cca5ffec229e6d7f8c1aabc))
+* **datatable:** Add manage columns ([#76](https://github.com/adeo/mozaic-angular/issues/76)) ([a9a3041](https://github.com/adeo/mozaic-angular/commit/a9a3041ada5bd0516948efa1dc40c0ded22caf52))
+* **datatable:** Add Selection feature ([#57](https://github.com/adeo/mozaic-angular/issues/57)) ([916b5b0](https://github.com/adeo/mozaic-angular/commit/916b5b035bae5eb454a1569579f37725ba6416a8))
+* **datatable:** Add sort feature ([#59](https://github.com/adeo/mozaic-angular/issues/59)) ([cca67e6](https://github.com/adeo/mozaic-angular/commit/cca67e69bf7fc79cf56561659bde3adef69146a8))
+* **datatable:** Add subrow expansion feature ([#69](https://github.com/adeo/mozaic-angular/issues/69)) ([7c524e8](https://github.com/adeo/mozaic-angular/commit/7c524e88bcb5ad8c14aafc139a194a62dde4b527))
+* **dropdown:** Add listbox and dropdown component ([#79](https://github.com/adeo/mozaic-angular/issues/79)) ([33f956d](https://github.com/adeo/mozaic-angular/commit/33f956dcd6f2996786474c13d7be40797e5dc3bf))
+* **segmented control:** add nowrap ([0d792f6](https://github.com/adeo/mozaic-angular/commit/0d792f61c62936dedfd6102e7dcf90c35d025d2c))
+* **segmented control:** add segmented control ([7b55a0f](https://github.com/adeo/mozaic-angular/commit/7b55a0f601d7b65e3522c5f2c3507e894e4b2c9a))
+* **segmented control:** return pr ([44b844a](https://github.com/adeo/mozaic-angular/commit/44b844aaed5552f38aaf07a85b76b10fefe0ea29))
+* **taglist:** Add taglist component ([#81](https://github.com/adeo/mozaic-angular/issues/81)) ([58d0edc](https://github.com/adeo/mozaic-angular/commit/58d0edcf8a95d378fbfd6896ceacc310e3a7b296))
+
+# [0.23.0-beta.0](https://github.com/adeo/mozaic-angular/compare/0.22.0...0.23.0-beta.0) (2023-08-02)
+
+
+### Features
+
+* **datatable:** WIP datatable ([5547619](https://github.com/adeo/mozaic-angular/commit/5547619d16eb96e28ed321549d40307cf4350869))
+
+# 0.22.0 (2023-06-28)
+
+
+### Bug Fixes
+
+* **lint:** clean lint issues ([656c2e6](https://github.com/adeo/mozaic-angular/commit/656c2e68455930fae97898ef8befbe4d60976f15))
+* **lint:** use better component name ([9ef5bb4](https://github.com/adeo/mozaic-angular/commit/9ef5bb4c0ec260867c7308a73996680cc8dbe197))
+
+
+### Features
+
+* **accordion:** fix class typo ([7ccf1a8](https://github.com/adeo/mozaic-angular/commit/7ccf1a82f54d97955a2ffa7a85649b10daf8fa4d))
+* **adeo:** add theme management ([efedf20](https://github.com/adeo/mozaic-angular/commit/efedf2036ea3385a0773011334e87bb381ba693e))
+* **flag:** add component files ([68496cf](https://github.com/adeo/mozaic-angular/commit/68496cf0e9c8e89d5e32a159cb3e98cc1f053d82))
+* **sb:** use decorator for icons ([b277f94](https://github.com/adeo/mozaic-angular/commit/b277f942bdaac4f661b1d95e286ec0f6a4572c57))
+* **theme:** use LM as default ([673bc12](https://github.com/adeo/mozaic-angular/commit/673bc123209b1fce5f18fad78810652df6873d26))
+* **tooltip:** refactor story ([9914466](https://github.com/adeo/mozaic-angular/commit/99144663dea7f793c9a2db4e9bd860a45ba9712c))

package/LICENSE

@@ -0,0 +1,22 @@
+The MIT License (MIT)
+
+Copyright (c) 2022 Adeo 
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+

package/README.md

@@ -0,0 +1,94 @@
+# <img style="vertical-align:middle" src="mozaic-angular.svg" alt="Mozaic angular logo" width="48px"> Mozaic Angular
+
+## Start storybook
+
+```
+npm run storybook
+```
+
+## [About our schematics](projects/schematics/README.md)
+
+
+<h3 align="center">Mozaic-Angular</h3>
+
+<p align="center">
+  Mozaic-Angular is the <a href="https://angularjs.org/">Angular</a> implementation of <a href="https://mozaic.adeo.cloud/">Mozaic Design System</a>.
+  <br>
+  <a href="adeo.github.io/mozaic-angular"><strong>Explore Mozaic-Angular Storybook »</strong></a>
+</p>
+
+<p align="center">
+  <a href="https://www.typescriptlang.org/">
+    <img src="https://img.shields.io/badge/TypeScript-007ACC?style=for-the-badge&logo=typescript&logoColor=white" alt="Using typescript" />
+  </a>
+  <a href="https://mozaic.adeo.cloud/Contributing/Principles/ContributionJourney/">
+    <img src="https://img.shields.io/badge/PRs-welcome-brightgreen.svg" alt="PRs welcome" />
+  </a>
+</p>
+
+## Table of contents
+
+-   [About Mozaic Design System](#about-mozaic-design-system)
+-   [This repository](#this-repository)
+    -   [Documentation](#documentation)
+    -   [Bugs and feature requests](#bugs-and-feature-requests)
+    -   [Contributing](#contributing)
+    -   [Stay in touch](#stay-in-touch)
+-   [Mozaic-angular's team](#Mozaic-angular-team)
+
+## About Mozaic Design System
+
+**Mozaic** is an inner-source design system built by [Adeo](https://www.adeo.com/), to reinforce team's delivery time, improve quality of deliverables and thus help set up a coherent customer experience within the digital interfaces of the group's brands.
+
+You can learn more about **Mozaic** vision and guidelines by visiting our documentation website [ here](https://mozaic.adeo.cloud/).
+
+## This repository
+
+This repository contains the following elements:
+
+-   In the `storybook` folder, all the configuration of our **Storybook** documentation
+-   In `projects`, the code, test and stories of the **Mozaic-Angular components** and the associated configuration
+
+### Documentation
+
+**Mozaic-angular**'s documentation, included in this repository is built with [Storybook](https://storybook.js.org/docs/vue/get-started/introduction) and publicly hosted on **GitHub Pages** at [Mozaic-Angular](https://adeo.github.io/mozaic-angular). The docs may also be run locally.
+
+#### Running documentation locally
+
+To run the documentation locally, you can do the following:
+
+1. Clone this repository
+2. install node v16.x.x
+3. Run `npm install` to install the **Node.js** dependencies, including Storybook
+4. Run `npm run build` to build the application
+5. Run `npm run storybook` to launch **Storybook** and activate hot-reloads for development
+6. Open [http://localhost:6006/](http://localhost:6006/) in your browser and start explore! :rocket:
+
+### Bugs and feature requests
+
+Have a bug or a feature request? Please let us know by [opening a new issue](https://github.com/adeo/mozaic-angular/issues/new/choose) and using the correct template associated with your request.
+
+However if you are ever able to contribute to help us fix bugs, build new features, or help us improve the project documentation, feel free to do it! _(more information below)_
+
+### Contributing
+
+Developers interested in contributing should read the [Code of Conduct](https://github.com/adeo/mozaic-design-system/blob/master/CODE_OF_CONDUCT.md) and the Contribution Guide (coming soon)
+
+### Stay in touch
+
+-   Join the [#mozaic-support](https://app.slack.com/client/T4R6RCZFA/CKQJZL7C4/) channel on **Slack**
+-   Join the [#mozaic-angular](https://adeo-tech-community.slack.com/archives/G01BB8911M4) channel on **Slack**
+-   Join our [Workplace group](https://adeo.workplace.com/groups/427492661454646/) **Mozaic Design System**
+
+## Mozaic-angular team
+
+### Author
+
+-   **[Иосиф Буравков](https://github.com/Iosif380)**
+
+### Owners x Maintainers
+
+-   **[Alif Fagundes](https://github.com/alif-fagundes)**
+-   **[Thiago Carvalheiro](https://github.com/carvalheiro)**
+-   **[Trésor Iloyi](https://github.com/tiloyi)**
+-   **[Mohamed Mokhtari](https://github.com/mohamedMok)**

package/angular.json

@@ -0,0 +1,106 @@
+{
+  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
+  "version": 1,
+  "newProjectRoot": "projects",
+  "projects": {
+    "kit": {
+      "projectType": "library",
+      "root": "projects/kit",
+      "sourceRoot": "projects/kit/src",
+      "prefix": "moz",
+      "schematics": {
+        "@schematics/angular:component": {
+          "style": "scss",
+          "changeDetection": "OnPush"
+        }
+      },
+      "architect": {
+        "storybook": {
+          "builder": "@storybook/angular:start-storybook",
+          "options": {
+            "configDir": ".storybook",
+            "browserTarget": "kit:build",
+            "port": 6006
+          }
+        },
+        "build-storybook": {
+          "builder": "@storybook/angular:build-storybook",
+          "options": {
+            "configDir": ".storybook",
+            "outputDir": "storybook-static/"
+          }
+        },
+        "build": {
+          "builder": "@angular-devkit/build-angular:ng-packagr",
+          "options": {
+            "project": "projects/kit/ng-package.json"
+          },
+          "configurations": {
+            "production": {
+              "tsConfig": "projects/kit/tsconfig.lib.prod.json"
+            },
+            "development": {
+              "tsConfig": "projects/kit/tsconfig.lib.json"
+            }
+          },
+          "defaultConfiguration": "production"
+        },
+        "build-adeo": {
+          "builder": "@angular-devkit/build-angular:ng-packagr",
+          "options": {
+            "project": "projects/kit/ng-package-adeo.json"
+          },
+          "configurations": {
+            "production": {
+              "tsConfig": "projects/kit/tsconfig.lib.prod.json"
+            },
+            "development": {
+              "tsConfig": "projects/kit/tsconfig.lib.json"
+            }
+          },
+          "defaultConfiguration": "production"
+        },
+        "lint": {
+          "builder": "@angular-eslint/builder:lint",
+          "options": {
+            "lintFilePatterns": ["projects/kit/**/*.ts", "projects/kit/**/*.html"]
+          }
+        }
+      }
+    },
+    "schematics": {
+      "projectType": "library",
+      "root": "projects/schematics",
+      "sourceRoot": "projects/schematics",
+      "prefix": "lib",
+      "architect": {
+        "build": {
+          "builder": "@angular-devkit/build-angular:ng-packagr",
+          "options": {
+            "project": "projects/schematics/ng-package.json"
+          },
+          "configurations": {
+            "production": {
+              "tsConfig": "projects/schematics/tsconfig.lib.prod.json"
+            },
+            "development": {
+              "tsConfig": "projects/schematics/tsconfig.lib.json"
+            }
+          },
+          "defaultConfiguration": "production"
+        },
+        "lint": {
+          "builder": "@angular-eslint/builder:lint",
+          "options": {
+            "lintFilePatterns": ["projects/schematics/**/*.ts", "projects/schematics/**/*.html"]
+          }
+        }
+      }
+    }
+  },
+  "defaultProject": "kit",
+  "cli": {
+    "defaultCollection": "@angular-eslint/schematics",
+    "analytics": false
+  }
+}

package/jest.config.js

@@ -0,0 +1,6 @@
+module.exports = {
+  preset: 'jest-preset-angular',
+  rootDir: 'projects/kit',
+  setupFilesAfterEnv: ['<rootDir>/setup-jest.ts'],
+  reporters: ['default'],
+};

package/mozaic-angular.svg

@@ -0,0 +1,9 @@
+<svg width="256" height="272"
+    xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid">
+
+    <g>
+        <path id="svg_1" fill="#E23237" d="m0.1,45.522l125.808,-44.825l129.196,44.028l-20.919,166.45l-108.277,59.966l-106.583,-59.169l-19.225,-166.45z"/>
+        <path id="svg_2" fill="#B52E31" d="m255.104,44.725l-129.196,-44.028l0,270.444l108.277,-59.866l20.919,-166.55z"/>
+        <path stroke="null" fill="#ffffff" id="svg_4" d="m183,76l0,120l-116,0l0,-120l116,0zm-60.67692,100.94769l-49.79077,0l0,13.32923l49.79077,0l0,-13.32923zm42.54523,-21.21231a13.81292,14.28923 0 0 0 -14.79446,11.68615a14.13415,14.62154 0 0 1 -22.30769,8.4l0,14.45538l49.70154,0l0,-20.82462a13.83077,14.30769 0 0 0 -12.59938,-13.71692zm12.59938,-16.87385l-49.70154,0l0,25.75385a8.49477,8.78769 0 0 0 8.53046,8.56615a8.28062,8.56615 0 0 0 8.42338,-7.10769a17.64985,18.25846 0 0 1 3.87262,-8.38154a19.50585,20.17846 0 0 1 28.87508,-1.45846l0,-17.37231zm-55.14462,19.05231l-49.79077,0l0,13.31077l49.79077,0l0,-13.31077zm0,-19.05231l-49.79077,0l0,13.34769l49.79077,0l0,-13.34769zm55.14462,-57.13846l-49.70154,0l0,51.50769l49.70154,0l0,-51.50769zm-11.04677,5.70462l-22.09354,40.00615l-5.51446,0l22.09354,-40.00615l5.51446,0zm-80.09354,8.56615l-5.51446,0l0,22.85538l5.51446,0l0,-12.92308a4.15815,4.30154 0 0 1 8.29846,0l0,12.92308l5.51446,0l0,-12.92308a4.14031,4.28308 0 0 1 8.28062,0l0,12.92308l5.53231,0l0,-12.92308a9.60123,9.93231 0 0 0 -5.53231,-8.99077a9.26215,9.58154 0 0 0 -8.28062,0a9.69046,10.02462 0 0 0 -2.80185,2.08615a9.61908,9.95077 0 0 0 -2.74831,-2.01231a9.29785,9.61846 0 0 0 -8.29846,0l0.03569,-1.01538z"/>
+    </g>
+</svg>

package/mozaic.config.js

@@ -0,0 +1,6 @@
+module.exports = {
+  preset: process.env.MOZAIC_PRESET,
+  tokens: {
+    localTokensExportPath:  process.env.MOZAIC_PRESET ? './projects/kit/assets/tokens/adeo/' : '',
+  },
+};

package/package.json

@@ -1,15 +1,11 @@
 {
   "name": "@mozaic-ds/angular",
-  "version": "0.23.0-beta.1",
+  "version": "0.23.1",
+  "description": "Mozaic-angular is the AngularJS Mozaic DS implementation",
+  "license": "MIT",
   "exports": {
     ".": {
-      "sass": "./_index.scss",
-      "types": "./index.d.ts",
-      "esm2020": "./esm2020/mozaic-ds-angular.mjs",
-      "es2020": "./fesm2020/mozaic-ds-angular.mjs",
-      "es2015": "./fesm2015/mozaic-ds-angular.mjs",
-      "node": "./fesm2015/mozaic-ds-angular.mjs",
-      "default": "./fesm2020/mozaic-ds-angular.mjs"
+      "sass": "./_index.scss"
     },
     "./adeo": {
       "types": "./adeo/index.d.ts",
@@ -18,23 +14,106 @@
       "es2015": "./adeo/fesm2015/mozaic-ds-angular.mjs",
       "node": "./adeo/fesm2015/mozaic-ds-angular.mjs",
       "default": "./adeo/fesm2020/mozaic-ds-angular.mjs"
-    },
-    "./package.json": {
-      "default": "./package.json"
     }
   },
-  "peerDependencies": {
-    "@angular/common": ">=15.1.3",
-    "@angular/core": ">=15.1.3"
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/adeo/mozaic-angular.git"
+  },
+  "scripts": {
+    "ng": "ng",
+    "start": "ng run kit:storybook",
+    "build": "cross-env MOZAIC_PRESET='' npm run copy-icons && ng build && npm run remove-icons",
+    "build:adeo": "cross-env MOZAIC_PRESET=adeo ng run kit:build-adeo",
+    "copy-icons": "npm run create-icons-folder && shx cp -R node_modules/@mozaic-ds/icons/svg/** projects/kit/assets/moz-icons && shx cp -R node_modules/@mozaic-ds/icons/svg-color/** projects/kit/assets/moz-icons",
+    "remove-icons": "shx rm -rf projects/kit/assets/moz-icons",
+    "create-icons-folder": "shx mkdir -p projects/kit/assets/moz-icons",
+    "watch": "ng build --watch --configuration development",
+    "test": "jest",
+    "prepare": "husky install",
+    "pre-commit": "lint-staged",
+    "lint": "ng lint",
+    "docs:json": "compodoc -p ./tsconfig.json -e json -d .",
+    "storybook": "npm run docs:json && ng run kit:storybook",
+    "build:storybook": "ng run kit:build-storybook",
+    "release": "release-it",
+    "release:beta": "release-it --preRelease=beta",
+    "prepublishOnly": "npm run build",
+    "npm:publish": "npm publish --access public",
+    "npm:publishBeta": "npm publish --tag beta --access public",
+    "tokens:build": "mozaic-tokens-build"
   },
   "dependencies": {
-    "tslib": "^2.3.0"
+    "@angular-devkit/architect": "0.1501.4",
+    "@angular-devkit/build-angular": "~15.2.8",
+    "@angular/animations": "~15.2.9",
+    "@angular/common": "~15.2.9",
+    "@angular/compiler": "~15.2.9",
+    "@angular/core": "~15.2.9",
+    "@angular/forms": "~15.2.9",
+    "@angular/platform-browser": "~15.2.9",
+    "@angular/platform-browser-dynamic": "~15.2.9",
+    "@angular/router": "~15.2.9",
+    "@mozaic-ds/css-dev-tools": "^1.50.0",
+    "@mozaic-ds/icons": "^1.52.0",
+    "@mozaic-ds/styles": "^1.65.0",
+    "@mozaic-ds/tokens": "^1.65.0",
+    "@mozaic-ds/web-fonts": "^1.22.0",
+    "rxjs": "~7.8.0",
+    "tslib": "^2.5.0",
+    "zone.js": "^0.13.1"
   },
-  "module": "fesm2015/mozaic-ds-angular.mjs",
-  "es2020": "fesm2020/mozaic-ds-angular.mjs",
-  "esm2020": "esm2020/mozaic-ds-angular.mjs",
-  "fesm2020": "fesm2020/mozaic-ds-angular.mjs",
-  "fesm2015": "fesm2015/mozaic-ds-angular.mjs",
-  "typings": "index.d.ts",
-  "sideEffects": false
-}
+  "devDependencies": {
+    "@angular-eslint/builder": "15.2.0",
+    "@angular-eslint/eslint-plugin": "15.2.0",
+    "@angular-eslint/eslint-plugin-template": "15.2.0",
+    "@angular-eslint/schematics": "15.2.0",
+    "@angular-eslint/template-parser": "15.2.0",
+    "@angular/cli": "^15.2.9",
+    "@angular/compiler-cli": "~15.2.9",
+    "@angular/elements": "^15.2.9",
+    "@babel/core": "^7.20.12",
+    "@compodoc/compodoc": "^1.1.19",
+    "@release-it/conventional-changelog": "^7.0.0",
+    "@storybook/addon-actions": "^7.0.18",
+    "@storybook/addon-essentials": "^7.0.18",
+    "@storybook/addon-links": "^7.0.18",
+    "@storybook/addon-styling": "^1.3.0",
+    "@storybook/angular": "^7.0.18",
+    "@storybook/cli": "7.1.0-alpha.32",
+    "@types/jest": "^29.5.2",
+    "@types/node": "^18.13.0",
+    "@typescript-eslint/eslint-plugin": "5.51.0",
+    "@typescript-eslint/parser": "5.51.0",
+    "@webcomponents/custom-elements": "^1.5.1",
+    "babel-loader": "^9.1.2",
+    "copyfiles": "^2.4.1",
+    "cross-env": "^7.0.3",
+    "css-loader": "^6.8.1",
+    "eslint": "^8.33.0",
+    "eslint-config-airbnb-base": "^15.0.0",
+    "eslint-config-prettier": "^8.6.0",
+    "eslint-plugin-import": "^2.27.5",
+    "eslint-plugin-prettier": "^4.2.1",
+    "eslint-plugin-rxjs": "^5.0.2",
+    "eslint-plugin-storybook": "^0.6.12",
+    "husky": "^8.0.3",
+    "jest": "^29.6.0",
+    "jest-preset-angular": "^13.1.1",
+    "lint-staged": "^13.1.1",
+    "ng-packagr": "^15.1.1",
+    "postcss": "^8.3.6",
+    "postcss-loader": "^4.3.0",
+    "postcss-scss": "^4.0.0",
+    "prettier": "^2.8.3",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "release-it": "^16.1.3",
+    "sass": "^1.63.4",
+    "sass-loader": "^13.3.2",
+    "shx": "^0.3.4",
+    "storybook": "^7.0.18",
+    "ts-jest": "^29.1.1",
+    "typescript": "~4.9.5"
+  }
+}

package/product-info.json

@@ -0,0 +1 @@
+{"tangram_id": "8a7b40e6-1bb8-4654-8de8-8163e7dabc1f"}

package/projects/kit/.browserslistrc

@@ -0,0 +1,16 @@
+# This file is used by the build system to adjust CSS and JS output to support the specified browsers below.
+# For additional information regarding the format and rule options, please see:
+# https://github.com/browserslist/browserslist#queries
+
+# For the full list of supported browsers by the Angular framework, please see:
+# https://angular.io/guide/browser-support
+
+# You can see what browsers were selected by your queries by running:
+#   npx browserslist
+
+last 1 Chrome version
+last 1 Firefox version
+last 2 Edge major versions
+last 2 Safari major versions
+last 2 iOS major versions
+Firefox ESR

package/projects/kit/.eslintrc.json

@@ -0,0 +1,35 @@
+{
+  "extends": "../../.eslintrc.json",
+  "ignorePatterns": ["!**/*"],
+  "overrides": [
+    {
+      "files": ["*.ts"],
+      "parserOptions": {
+        "project": ["projects/kit/tsconfig.lib.json", "projects/kit/tsconfig.spec.json"],
+        "createDefaultProgram": true
+      },
+      "rules": {
+        "@angular-eslint/directive-selector": [
+          "error",
+          {
+            "type": "attribute",
+            "prefix": "moz",
+            "style": "camelCase"
+          }
+        ],
+        "@angular-eslint/component-selector": [
+          "error",
+          {
+            "type": "element",
+            "prefix": "moz"
+          }
+        ],
+        "rxjs/no-sharereplay": ["warn"]
+      }
+    },
+    {
+      "files": ["*.html"],
+      "rules": {}
+    }
+  ]
+}

package/projects/kit/common/global-events/global-events.module.ts

@@ -0,0 +1,7 @@
+import { NgModule } from '@angular/core';
+import { GlobalEventsService } from './global-events.service';
+
+@NgModule({
+  providers: [GlobalEventsService, { provide: Window, useValue: window }],
+})
+export class GlobalEventsModule {}

package/projects/kit/common/global-events/global-events.service.ts

@@ -0,0 +1,27 @@
+import { Injectable } from '@angular/core';
+import { fromEvent, Observable, shareReplay } from 'rxjs';
+
+@Injectable({
+  providedIn: 'root',
+})
+export class GlobalEventsService {
+  private readonly eventHandlers = new Map<string, Observable<Event>>();
+
+  public get window() {
+    return this._window;
+  }
+
+  constructor(private readonly _window: Window) {}
+
+  public getWindowEvent<T extends Event>(eventName: string): Observable<T> {
+    const cachedHandler = this.eventHandlers.get(eventName);
+    if (cachedHandler) {
+      return cachedHandler as Observable<T>;
+    }
+    const eventHandler = fromEvent<T>(this.window, eventName).pipe(
+      shareReplay({ refCount: true, bufferSize: 1 })
+    );
+    this.eventHandlers.set(eventName, eventHandler);
+    return eventHandler;
+  }
+}

package/projects/kit/common/mocks/dummy.component.mock.ts

@@ -0,0 +1,4 @@
+import { Component } from '@angular/core';
+
+@Component({ template: '', standalone: true })
+export class DummyComponent {}

package/projects/kit/common/utils/boolean-property.ts

@@ -0,0 +1,3 @@
+export function castBooleanProperty(value: unknown): value is boolean {
+  return `${value}` !== 'false' && value != null;
+}

package/projects/kit/common/utils/generate-id.ts

@@ -0,0 +1,7 @@
+export const generateId = () => {
+  const generateParts = () =>
+    Math.floor((1 + Math.random()) * 0x10000)
+      .toString(16)
+      .substring(1);
+  return generateParts() + '-' + generateParts();
+};

package/projects/kit/common/utils/get-random-number.ts

@@ -0,0 +1,6 @@
+export const getRandomNumber = (min: number, max: number): number => {
+  const minN = Math.ceil(min);
+  const maxN = Math.floor(max);
+
+  return Math.floor(Math.random() * (maxN - minN)) + minN;
+};

package/projects/kit/common/utils/overwrite-style.ts

@@ -0,0 +1,10 @@
+import { ElementRef } from '@angular/core';
+
+export const overwriteStyle = (
+  { nativeElement }: ElementRef,
+  oldClassName: string,
+  newClassName: string
+): void => {
+  nativeElement.classList.remove(oldClassName);
+  nativeElement.classList.add(newClassName);
+};

package/projects/kit/components/accordion/accordion.component.html

@@ -0,0 +1,25 @@
+<div class="mc-accordion" [ngClass]="{ 'is-open': isOpen, 'mc-accordion--s': isSizeS, 'mc-accordion--no-padding': noPadding}">
+  <div class="mc-accordion__header">
+    <h2 class="mc-accordion__title">
+      <button
+        id="accordion"
+        class="mc-accordion__trigger"
+        aria-controls="content"
+        [attr.aria-expanded]="isOpen"
+        [disabled]="disabled"
+        (click)="changeState()"
+
+        >
+        <ng-content select="[label]"></ng-content>
+      </button>
+    </h2>
+  </div>
+  <div
+    id="content"
+    class="mc-accordion__content"
+    [attr.aria-hidden]="isHidden"
+    aria-labelledby="accordion"
+  >
+    <ng-content select="[content]"></ng-content>
+  </div>
+</div>

package/projects/kit/components/accordion/accordion.component.scss

@@ -0,0 +1,2 @@
+@import 'settings-tools/_all-settings';
+@import 'components/_c.accordion';

package/projects/kit/components/accordion/accordion.component.spec.ts

@@ -0,0 +1,24 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { AccordionComponent } from './accordion.component';
+
+describe('AccordionComponent', () => {
+  let component: AccordionComponent;
+  let fixture: ComponentFixture<AccordionComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [AccordionComponent],
+    }).compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(AccordionComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});