chore: move beeq Icons executor out of ./packages under ./tools

.gitignore

@@ -2,8 +2,8 @@
 
 # compiled output
 /dist
-/tmp
 /out-tsc
+/tmp/**
 
 # source files to ignore
 .angular
@@ -15,7 +15,6 @@ packages/beeq/src/components/icon/svg/**
 packages/beeq-angular/**/directives
 packages/beeq-react/src/react-component-lib
 packages/beeq-react/src/components.ts
-packages/beeq-icons/temp/**
 !.gitkeep
 
 # dependencies

nx.json

@@ -43,7 +43,7 @@
         "cacheableOperations": [
           "build",
           "e2e",
-          "generate-icons",
+          "icons",
           "lint",
           "storybook-build",
           "storybook-build-css",

package.json

@@ -23,7 +23,7 @@
     "test:spec": "npx nx run beeq:test --output-style=stream-without-prefixes",
     "test:e2e": "npx nx run beeq:e2e --output-style=stream-without-prefixes",
     "clean": "run-s clean:build clean:modules",
-    "clean:build": "rimraf dist tmp packages/beeq/.stencil",
+    "clean:build": "rimraf dist packages/beeq/.stencil",
     "clean:modules": "rimraf node_modules .cache packages/**/node_modules",
     "pre-commit": "lint-staged --verbose",
     "prepare": "husky install",

packages/beeq/.storybook/preview.ts

@@ -41,21 +41,6 @@ const preview: Preview = {
         height: '250px',
       },
     },
-    // html: {
-    //   removeComments: true,
-    //   removeEmptyComments: true,
-    //   highlighter: {
-    //     showLineNumbers: true,
-    //     wrapLines: true,
-    //   },
-    //   prettier: {
-    //     htmlWhitespaceSensitivity: 'ignore',
-    //     tabWidth: 2,
-    //     printWidth: 80,
-    //     useTabs: false,
-    //   },
-    //   root: '#root-inner',
-    // },
   },
 };
 

packages/beeq/project.json

@@ -61,7 +61,7 @@
       }
     },
     "build": {
-      "dependsOn": ["generate-icons"],
+      "dependsOn": ["icons"],
       "executor": "@nxext/stencil:build",
       "outputs": ["{options.outputPath}", "{projectRoot}/custom-elements.json"],
       "options": {
@@ -107,12 +107,12 @@
         "command": "npx tailwindcss -i packages/beeq/src/global/styles/tailwind.pcss -o packages/beeq/.storybook/assets/css/stories.css --postcss ./postcss.config.js --minify"
       }
     },
-    "generate-icons": {
-      "executor": "@bee-q/icons:generate",
+    "icons": {
+      "executor": "@bee-q/tools:icons",
       "outputs": ["{options.downloadPath}", "{options.extractToPath}", "{options.outputDir}"],
       "options": {
         "assetsFolder": "assets",
-        "downloadPath": "packages/beeq-icons/temp",
+        "downloadPath": "tmp",
         "extractToPath": "packages/beeq/src/components/icon/svg",
         "fileName": "main.zip",
         "helperFile": "icons-set.ts",

tools/.eslintrc.json

@@ -1,10 +1,25 @@
 {
-  "extends": "../../.eslintrc.json",
-  "parserOptions": {
-    "ecmaVersion": "latest"
-  },
-
-  "env": {
-    "es6": true
-  }
+  "extends": ["../.eslintrc.json"],
+  "ignorePatterns": ["!**/*"],
+  "overrides": [
+    {
+      "files": ["*.ts", "*.tsx", "*.js", "*.jsx"],
+      "rules": {}
+    },
+    {
+      "files": ["*.ts", "*.tsx"],
+      "rules": {}
+    },
+    {
+      "files": ["*.js", "*.jsx"],
+      "rules": {}
+    },
+    {
+      "files": ["*.json"],
+      "parser": "jsonc-eslint-parser",
+      "rules": {
+        "@nx/dependency-checks": "error"
+      }
+    }
+  ]
 }

packages/beeq-icons/README.md → tools/README.md

@@ -1,6 +1,6 @@
 # BEEQ Icons: Custom plugin for downloading the icon SVGs
 
-The `generate:icons` local executor will download the SVG files from the [Phosphor icons library](https://phosphoricons.com/) and place them into the Bee-Q assets.
+The `icons` local executor will download the SVG files from the [Phosphor icons library](https://phosphoricons.com/) and place them into the Bee-Q assets.
 
 ## Running the executor
 
@@ -45,11 +45,11 @@ The local executor needs certain options to work as expected, you can find all t
   svgFolder: string; // Name of the SVG folder inside of the .zip package
 ```
 
-These options are set in the `generate-icons` target inside the [beeq/project.json file](../beeq/project.json):
+These options are set in the `icons` target inside the [beeq/project.json file](../packages/beeq/project.json):
 
 ```json
-  "generate-icons": {
-    "executor": "@bee-q/icons:generate",
+  "icons": {
+    "executor": "@bee-q/tools:icons",
     "outputs": ["{options.downloadPath}", "{options.extractToPath}", "{options.outputDir}"],
     "options": {
       "assetsFolder": "assets",

tools/executors.json

@@ -0,0 +1,9 @@
+{
+  "executors": {
+    "icons": {
+      "implementation": "./src/executors/icons/executor",
+      "schema": "./src/executors/icons/schema.json",
+      "description": "icons executor"
+    }
+  }
+}

tools/package.json

@@ -0,0 +1,9 @@
+{
+  "name": "@bee-q/tools",
+  "private": true,
+  "version": "0.8.2",
+  "type": "commonjs",
+  "main": "./src/index.js",
+  "typings": "./src/index.d.ts",
+  "executors": "./executors.json"
+}

tools/project.json

@@ -0,0 +1,48 @@
+{
+  "name": "tools",
+  "$schema": "../../node_modules/nx/schemas/project-schema.json",
+  "sourceRoot": "packages/tools/src",
+  "projectType": "library",
+  "tags": ["internal", "nonpublisable", "tools"],
+  "targets": {
+    "build": {
+      "executor": "@nx/js:tsc",
+      "outputs": ["{options.outputPath}"],
+      "options": {
+        "outputPath": "dist/tools",
+        "main": "packages/tools/src/index.ts",
+        "tsConfig": "packages/tools/tsconfig.lib.json",
+        "assets": [
+          "packages/tools/*.md",
+          {
+            "input": "./packages/tools/src",
+            "glob": "**/!(*.ts)",
+            "output": "./src"
+          },
+          {
+            "input": "./packages/tools/src",
+            "glob": "**/*.d.ts",
+            "output": "./src"
+          },
+          {
+            "input": "./packages/tools",
+            "glob": "generators.json",
+            "output": "."
+          },
+          {
+            "input": "./packages/tools",
+            "glob": "executors.json",
+            "output": "."
+          }
+        ]
+      }
+    },
+    "lint": {
+      "executor": "@nx/linter:eslint",
+      "outputs": ["{options.outputFile}"],
+      "options": {
+        "lintFilePatterns": ["packages/tools/**/*.ts", "packages/tools/package.json"]
+      }
+    }
+  }
+}

packages/beeq-icons/src/executors/generate-icons/executor.ts → tools/src/executors/icons/executor.ts

@@ -1,9 +1,9 @@
 import { createSpinner } from 'nanospinner';
 import { createIconsSetFile, downloadIcons, extractIcons } from './helpers';
 
-import { IGenerateBeeQIcons } from './schema';
+import { IconsExecutorSchema } from './schema';
 
-export default async function generateBeeQIcons({
+export default async function runExecutor({
   assetsFolder,
   downloadPath,
   extractToPath,
@@ -13,7 +13,7 @@ export default async function generateBeeQIcons({
   sourceDir,
   sourceUrl,
   svgFolder,
-}: IGenerateBeeQIcons) {
+}: IconsExecutorSchema) {
   let success = true;
   const logSpinner = createSpinner('Download the Phosphor-icon library').start();
 

packages/beeq-icons/src/executors/generate-icons/schema.d.ts → tools/src/executors/icons/schema.d.ts

@@ -2,7 +2,7 @@
 /*                       BEEQ icons executor properties                       */
 /* -------------------------------------------------------------------------- */
 
-export interface IGenerateBeeQIcons {
+export interface IconsExecutorSchema {
   assetsFolder: string;
   downloadPath: string;
   extractToPath: string;

tools/src/executors/icons/schema.json

@@ -0,0 +1,9 @@
+{
+  "$schema": "http://json-schema.org/schema",
+  "version": 2,
+  "title": "Icons executor",
+  "description": "",
+  "type": "object",
+  "properties": {},
+  "required": []
+}

tools/generators/plop/component.hbs → tools/src/generators/plop/component.hbs

@@ -1,4 +1,4 @@
-import { h, Component } from '@stencil/core';
+import { Component, h } from '@stencil/core';
 
 @Component({
   tag: 'bq-{{kebabCase name}}',
@@ -54,8 +54,8 @@ export class Bq{{pascalCase name}} {
   render() {
     return (
 {{#if stylingVariables}}
-      <p class="m-[var(--bq-{{kebabCase name}}--margin)]">
-{{else}}        
+      <p class="m-[--bq-{{kebabCase name}}--margin]">
+{{else}}
       <p>
 {{/if}}
         My name is Stencil <slot />