@mozaic-ds/angular 0.21.0 → 0.22.0

package/CHANGELOG.md

@@ -0,0 +1,19 @@
+
+
+# 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,92 @@
+# <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. Run `npm install` to install the **Node.js** dependencies, including Storybook
+3. Run `npm run storybook` to launch **Storybook** and activate hot-reloads for development
+4. 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,113 @@
+{
+  "$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"
+        },
+        "test": {
+          "builder": "@angular-devkit/build-angular:karma",
+          "options": {
+            "main": "projects/kit/src/test.ts",
+            "tsConfig": "projects/kit/tsconfig.spec.json",
+            "karmaConfig": "projects/kit/karma.conf.js"
+          }
+        },
+        "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"
+  }
+}

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,31 +1,107 @@
 {
   "name": "@mozaic-ds/angular",
-  "version": "0.21.0",
-  "peerDependencies": {
-    "@angular/common": "~15.1.3",
-    "@angular/core": "~15.1.3"
+  "version": "0.22.0",
+  "description": "Mozaic-angular is the AngularJS Mozaic DS implementation",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/adeo/mozaic-angular.git"
   },
-  "dependencies": {
-    "tslib": "^2.3.0"
+  "scripts": {
+    "ng": "ng",
+    "start": "ng run kit:storybook",
+    "build": "MOZAIC_PRESET='' npm run copy-icons && ng build && npm run remove-icons",
+    "build:adeo": "MOZAIC_PRESET=adeo ng run kit:build-adeo",
+    "create-icons-folder": "mkdir -p projects/kit/assets/moz-icons",
+    "copy-icons": "npm run create-icons-folder && cp node_modules/@mozaic-ds/icons/svg/** projects/kit/assets/moz-icons && cp node_modules/@mozaic-ds/icons/svg-color/** projects/kit/assets/moz-icons",
+    "remove-icons": "rm -rf projects/kit/assets/moz-icons",
+    "watch": "ng build --watch --configuration development",
+    "test": "ng test",
+    "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 run build:adeo ",
+    "npm:publish": "npm publish --access public",
+    "npm:publishBeta": "npm publish --tag beta --access public",
+    "tokens:build": "mozaic-tokens-build"
   },
-  "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",
-  "exports": {
-    "./package.json": {
-      "default": "./package.json"
-    },
-    ".": {
-      "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"
-    }
+  "dependencies": {
+    "@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.62.0",
+    "@mozaic-ds/tokens": "^1.62.0",
+    "@mozaic-ds/web-fonts": "^1.22.0",
+    "rxjs": "~7.8.0",
+    "tslib": "^2.5.0",
+    "zone.js": "~0.11.8"
   },
-  "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.1.4",
+    "@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": "^5.1.1",
+    "@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/jasmine": "~4.3.1",
+    "@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",
+    "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",
+    "jasmine-core": "~4.5.0",
+    "karma": "~6.4.1",
+    "karma-chrome-launcher": "~3.1.1",
+    "karma-coverage": "~2.2.0",
+    "karma-jasmine": "~5.1.0",
+    "karma-jasmine-html-reporter": "~2.0.0",
+    "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": "^15.11.0",
+    "sass": "^1.63.4",
+    "sass-loader": "^13.3.2",
+    "storybook": "^7.0.18",
+    "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": {}
+    }
+  ]
+}