@epilot360/icons 1.7.1 → 1.8.0

package/generator/run.ts

@@ -1,102 +0,0 @@
-#!/usr/bin/env -S node -r ts-node/register
-import fs from 'fs';
-import path from 'path';
-
-import ejs from 'ejs';
-import YAML from 'js-yaml';
-
-const ROOT_DIR = path.join(__dirname, '..');
-const SRC_DIR = path.join(ROOT_DIR, 'src');
-const TEMPLATE_DIR = path.join(__dirname, 'templates');
-
-interface IconConfig {
-  [Icon: string]: {
-    name: string;
-    tags: string[];
-    aliases: string[];
-    svg_import: string;
-  };
-}
-
-const main = async () => {
-  const iconsConfig = YAML.load(fs.readFileSync(path.join(ROOT_DIR, 'icons.config.yaml')).toString()) as IconConfig;
-
-  const icons = Object.entries(iconsConfig).map(([Icon, icon]) => ({
-    Icon,
-    ...icon,
-    svg_import_fill: icon.svg_import?.replace(/.svg$/, '-fill.svg'),
-  }));
-
-  // copy svg files under src/svg/<Component>/icon.svg
-  for (const icon of icons) {
-    if (icon.svg_import) {
-      const svgFile = path.join(SRC_DIR, 'svg', icon.Icon, 'icon.svg');
-      const svgFileFill = path.join(SRC_DIR, 'svg', icon.Icon, 'icon-fill.svg');
-      fs.mkdirSync(path.dirname(svgFile), { recursive: true });
-
-      fs.copyFileSync(require.resolve(icon.svg_import), svgFile);
-      fs.copyFileSync(require.resolve(icon.svg_import_fill), svgFileFill);
-      console.warn('Copied', svgFile);
-      console.warn('Copied', svgFileFill);
-    }
-
-    // Generate SVG module
-    const svgModuleTemplates = fs.readdirSync(path.join(TEMPLATE_DIR, 'svg', 'module'));
-    for (const template of svgModuleTemplates) {
-      const templatePath = path.join(TEMPLATE_DIR, 'svg', 'module', template);
-      const templateContent = fs.readFileSync(templatePath).toString();
-
-      const outFile = path.join(SRC_DIR, 'svg', icon.Icon, template.replace('.ejs', ''));
-
-      fs.mkdirSync(path.dirname(outFile), { recursive: true });
-      fs.writeFileSync(outFile, ejs.render(templateContent, icon));
-      console.warn('Wrote', outFile);
-    }
-  }
-
-  // Generate SVGIcon.ts
-  const svgIconComponentTemplate = fs.readFileSync(path.join(TEMPLATE_DIR, 'svg', 'SVGIcon.ts.ejs')).toString();
-  const svgIconOutFile = path.join(SRC_DIR, 'svg', 'SVGIcon.ts');
-  fs.writeFileSync(svgIconOutFile, ejs.render(svgIconComponentTemplate, { icons }));
-  console.warn('Wrote', svgIconOutFile);
-
-  // Generate index.ts for svg
-  const svgIndexTemplate = fs.readFileSync(path.join(TEMPLATE_DIR, 'svg', 'index.ts.ejs')).toString();
-  const svgIndexOutFile = path.join(SRC_DIR, 'svg', 'index.ts');
-  fs.writeFileSync(svgIndexOutFile, ejs.render(svgIndexTemplate, { icons }));
-  console.warn('Wrote', svgIndexOutFile);
-
-  for (const icon of icons) {
-    // Generate react component
-    const reactComponentTemplates = fs.readdirSync(path.join(TEMPLATE_DIR, 'react', 'component'));
-
-    for (const template of reactComponentTemplates) {
-      const templatePath = path.join(TEMPLATE_DIR, 'react', 'component', template);
-      const templateContent = fs.readFileSync(templatePath).toString();
-
-      const outFile = path.join(SRC_DIR, 'react', icon.Icon, template.replace('.ejs', ''));
-
-      fs.mkdirSync(path.dirname(outFile), { recursive: true });
-      fs.writeFileSync(outFile, ejs.render(templateContent, icon));
-      console.warn('Wrote', outFile);
-    }
-  }
-
-  // Generate EpilotIcon.tsx for react
-  const epilotIconComponentTemplate = fs
-    .readFileSync(path.join(TEMPLATE_DIR, 'react', 'EpilotIcon.tsx.ejs'))
-    .toString();
-  const epilotIconOutFile = path.join(SRC_DIR, 'react', 'EpilotIcon.tsx');
-  fs.writeFileSync(epilotIconOutFile, ejs.render(epilotIconComponentTemplate, { icons }));
-  console.warn('Wrote', epilotIconOutFile);
-
-  // Generate index.ts for react
-  const reactIndexTemplate = fs.readFileSync(path.join(TEMPLATE_DIR, 'react', 'index.ts.ejs')).toString();
-  const reactIndexOutFile = path.join(SRC_DIR, 'react', 'index.ts');
-  fs.writeFileSync(reactIndexOutFile, ejs.render(reactIndexTemplate, { icons }));
-  console.warn('Wrote', reactIndexOutFile);
-};
-
-if (require.main === module) {
-  main();
-}

package/generator/templates/react/EpilotIcon.tsx.ejs

@@ -1,29 +0,0 @@
-/* eslint-disable import/order */
-import React from 'react';
-
-<% icons.forEach((icon) => { -%>
-import { <%= icon.Icon %> } from './<%= icon.Icon %>';
-<% }); %>
-
-import type { IconPropsReact } from './types';
-
-export const IconComponentsMap = {
-<% icons.forEach((icon) => { -%>
-  <%= icon.name %>: <%= icon.Icon %>,
-<% }); %>
-};
-
-export type IconName = keyof typeof IconComponentsMap;
-type Props = IconPropsReact & { name: IconName };
-
-export const EpilotIcon = (props: Props) => {
-  const { name, ...restProps } = props;
-
-  const iconComponent = IconComponentsMap[name];
-
-  if (!iconComponent) return null;
-
-  return React.createElement(iconComponent, restProps);
-};
-
-export default EpilotIcon;

package/generator/templates/react/component/index.tsx.ejs

@@ -1,23 +0,0 @@
-import React from 'react';
-
-import { ReactComponent as Filled } from '../../svg/<%= Icon %>/icon-fill.svg';
-import { ReactComponent as Outlined } from '../../svg/<%= Icon %>/icon.svg';
-import type { IconPropsReact } from '../types';
-import { defaultIconProps } from '../common';
-
-const name = '<%= name %>';
-
-
-export function <%= Icon %>(props: IconPropsReact) {
-  const { variant, ...restProps } = {
-    ...defaultIconProps,
-    ...props,
-  };
-  const IconComponent = variant === 'outlined' ? Outlined : Filled;
-
-  const overrides = props.size ? { width: props.size, height: props.size } : {};
-
-  return <IconComponent aria-label={name} {...restProps} {...overrides} />;
-}
-
-export default <%= Icon %>;

package/generator/templates/react/component/story.stories.tsx.ejs

@@ -1,13 +0,0 @@
-import { generateStory } from '../../stories/util';
-
-import { <%= Icon %> } from '.';
-
-const story = generateStory(<%= Icon %>);
-
-export default {
-  title: 'Icons/<%= Icon %>',
-  tags: ['autodocs'],
-  ...story.meta,
-};
-
-export const Icon = story.story;

package/generator/templates/react/index.ts.ejs

@@ -1,5 +0,0 @@
-<% icons.forEach((icon) => { -%>
-export * from './<%= icon.Icon %>';
-<% }); %>
-
-export * from './EpilotIcon';

package/generator/templates/svg/index.ts.ejs

@@ -1,5 +0,0 @@
-<% icons.forEach((icon) => { -%>
-export * from './<%= icon.Icon %>';
-<% }); %>
-
-export * from './svgIcon';

package/generator/templates/svg/module/index.ts.ejs

@@ -1,12 +0,0 @@
-import type { IconProps } from '../../types';
-
-import FilledSVG from './icon-fill.svg';
-import OutlinedSVG from './icon.svg';
-
-export const <%= Icon %>SVG = (opts?: IconProps): string => {
-  const variant = opts?.variant ?? 'filled';
-
-  return variant === 'outlined' ? OutlinedSVG : FilledSVG;
-};
-
-export default <%= Icon %>SVG;

package/generator/templates/svg/svgIcon.ts.ejs

@@ -1,61 +0,0 @@
-/* eslint-disable import/order */
-<% icons.forEach((icon) => { -%>
-import { <%= icon.Icon %>SVG } from './<%= icon.Icon %>';
-<% }); %>
-
-import type { IconProps } from '../types';
-
-export const svgMap = {
-<% icons.forEach((icon) => { -%>
-  <%= icon.name %>: <%= icon.Icon %>SVG,
-<% }); %>
-};
-
-export type IconSVGName = keyof typeof svgMap;
-type Opts = IconProps & {
-  name: IconSVGName;
-  xclass?: string;
-};
-
-const defaultOpts: Opts = {
-  name: 'epilot',
-  size: 24,
-  fill: 'currentColor',
-};
-
-export const svgIcon = (opts: Opts) => {
-  const {
-    name,
-    width,
-    height,
-    size,
-    fill,
-    xclass,
-    ...restOpts
-  } = {
-    ...defaultOpts,
-    ...opts,
-  };
-
-  const svg = svgMap[name];
-
-  if (!svg) return '';
-
-  const parser = new DOMParser();
-  const document = parser.parseFromString(svg(restOpts), 'image/svg+xml');
-
-  const svgElement = document.querySelector('svg');
-
-  if (fill) svgElement.setAttribute('fill', `${fill}`);
-  if (xclass) svgElement.setAttribute('class', `${xclass}`);
-
-  if (width !== undefined && width !== '') svgElement.setAttribute('width', `${width}`);
-  if (height !== undefined && height !== '') svgElement.setAttribute('height', `${height}`);
-
-  if (size) {
-    svgElement.setAttribute('width', `${size}`);
-    svgElement.setAttribute('height', `${size}`);
-  }
-
-  return document.documentElement.outerHTML;
-};

package/iac/.eslintrc.yml

@@ -1,27 +0,0 @@
-extends:
-  - "@epilot/eslint-config"
-ignorePatterns:
-  - node_modules
-  - dist
-rules:
-  "spaced-comment":
-    - error
-    - always
-    - line:
-        markers: ["/"]
-        exceptions: ["-", "+"]
-      block:
-        markers: ["!"]
-        exceptions: ["*"]
-        balanced: true
-  "prettier/prettier":
-    - error
-    - printWidth: 120 # https://hackernoon.com/does-column-width-of-80-make-sense-in-2018-50c161fbdcf6
-      trailingComma: all # better diffs, obviously
-      bracketSpacing: true # more space = pretty
-      semi: true # https://github.com/standard/semistandard
-      useTabs: false
-      tabWidth: 2
-      singleQuote: true
-      quoteProps: as-needed
-      proseWrap: never

package/iac/.gitignore

@@ -1,3 +0,0 @@
-*.js
-*.d.ts
-cdk.out

package/iac/cdk.json

@@ -1,42 +0,0 @@
-{
-  "app": "npx ts-node --prefer-ts-exts ./index.ts",
-  "watch": {
-    "include": [
-      "**"
-    ],
-    "exclude": [
-      "README.md",
-      "cdk*.json",
-      "**/*.d.ts",
-      "**/*.js",
-      "tsconfig.json",
-      "package*.json",
-      "yarn.lock",
-      "node_modules",
-      "test"
-    ]
-  },
-  "context": {
-    "@aws-cdk/aws-apigateway:usagePlanKeyOrderInsensitiveId": true,
-    "@aws-cdk/core:stackRelativeExports": true,
-    "@aws-cdk/aws-rds:lowercaseDbIdentifier": true,
-    "@aws-cdk/aws-lambda:recognizeVersionProps": true,
-    "@aws-cdk/aws-lambda:recognizeLayerVersion": true,
-    "@aws-cdk/aws-cloudfront:defaultSecurityPolicyTLSv1.2_2021": true,
-    "@aws-cdk-containers/ecs-service-extensions:enableDefaultLogDriver": true,
-    "@aws-cdk/aws-ec2:uniqueImdsv2TemplateName": true,
-    "@aws-cdk/core:checkSecretUsage": true,
-    "@aws-cdk/aws-iam:minimizePolicies": true,
-    "@aws-cdk/aws-ecs:arnFormatIncludesClusterName": true,
-    "@aws-cdk/core:validateSnapshotRemovalPolicy": true,
-    "@aws-cdk/aws-codepipeline:crossAccountKeyAliasStackSafeResourceName": true,
-    "@aws-cdk/aws-s3:createDefaultLoggingPolicy": true,
-    "@aws-cdk/aws-sns-subscriptions:restrictSqsDescryption": true,
-    "@aws-cdk/aws-apigateway:disableCloudWatchRole": true,
-    "@aws-cdk/core:enablePartitionLiterals": true,
-    "@aws-cdk/core:target-partitions": [
-      "aws",
-      "aws-cn"
-    ]
-  }
-}

package/iac/config.ts

@@ -1,46 +0,0 @@
-const serviceName = 'epilot360-icons';
-const projectName = 'epilot360-icons';
-
-const config = {
-  dev: {
-    serviceName: `${serviceName}-dev`,
-    projectName,
-    importBucket: 'epilot360-portal-dev-Bucket',
-    importDistributionDomainName: 'epilot360-portal-dev-DistributionDomainName',
-    importDistributionId: 'epilot360-portal-dev-DistributionId',
-  },
-  staging: {
-    serviceName: `${serviceName}-staging`,
-    projectName,
-    importBucket: 'epilot360-portal-staging-Bucket',
-    importDistributionDomainName: 'epilot360-portal-staging-DistributionDomainName',
-    importDistributionId: 'epilot360-portal-staging-DistributionId',
-  },
-  prod: {
-    serviceName: `${serviceName}-prod`,
-    projectName,
-    importBucket: 'epilot360-portal-prod-Bucket',
-    importDistributionDomainName: 'epilot360-portal-prod-DistributionDomainName',
-    importDistributionId: 'epilot360-portal-prod-DistributionId',
-  },
-};
-
-export type Stage = keyof typeof config;
-
-export const getStage = (): Stage => {
-  const stageEnv = process.env.STAGE as Stage;
-
-  if (Object.getOwnPropertyNames(config).includes(stageEnv)) {
-    return stageEnv;
-  }
-
-  return 'dev';
-};
-
-export const getConfig = () => {
-  const stage = getStage();
-
-  return {
-    ...config[stage],
-  };
-};

package/iac/index.ts

@@ -1,21 +0,0 @@
-#!/usr/bin/env node
-import 'source-map-support/register';
-import * as cdk from 'aws-cdk-lib';
-
-import { getConfig } from "./config";
-import { ServiceStack } from "./service-stack";
-
-const app = new cdk.App();
-
-const config = getConfig();
-const stackName = process.env.STACK_NAME || config.serviceName;
-
-const serviceStack = new ServiceStack(app, stackName, {
-  stackName,
-  env: {
-    account: process.env.CDK_DEFAULT_ACCOUNT,
-    region: process.env.CDK_DEFAULT_REGION || "eu-central-1",
-  },
-});
-
-serviceStack.tags.setTag("heritage", "cdk");

package/iac/package.json

@@ -1,25 +0,0 @@
-{
-  "name": "epilot360-icons-iac",
-  "description": "cdk",
-  "version": "0.1.0",
-  "scripts": {
-    "build": "tsc",
-    "watch": "tsc -w",
-    "cdk": "cdk",
-    "synth": "cdk synth",
-    "deploy": "cdk deploy"
-  },
-  "devDependencies": {
-    "@types/jest": "^27.5.2",
-    "@types/node": "10.17.27",
-    "@types/prettier": "2.6.0",
-    "aws-cdk": "2.42.0",
-    "ts-node": "^10.9.1",
-    "typescript": "4.7.4"
-  },
-  "dependencies": {
-    "aws-cdk-lib": "2.42.0",
-    "constructs": "^10.0.0",
-    "source-map-support": "^0.5.21"
-  }
-}

package/iac/service-stack.ts

@@ -1,33 +0,0 @@
-import * as fs from 'fs';
-
-import * as cdk from 'aws-cdk-lib';
-import * as s3 from 'aws-cdk-lib/aws-s3';
-import * as s3deploy from 'aws-cdk-lib/aws-s3-deployment';
-import { Construct } from 'constructs';
-
-import { getConfig } from './config';
-
-export class ServiceStack extends cdk.Stack {
-  constructor(scope: Construct, id: string, props?: cdk.StackProps) {
-    super(scope, id, props);
-
-    const config = getConfig();
-
-    // Content bucket
-    const siteBucket = s3.Bucket.fromBucketName(this, 'SiteBucket', cdk.Fn.importValue(config.importBucket));
-
-    const sources = [s3deploy.Source.asset('../dist')];
-    if (fs.existsSync('../storybook-static')) {
-      sources.push(s3deploy.Source.asset('../storybook-static'));
-    }
-
-    // Deploy site contents in S3 bucket
-    const _mfe = new s3deploy.BucketDeployment(this, 'DeployMFE', {
-      sources,
-      destinationBucket: siteBucket,
-      destinationKeyPrefix: `${config.projectName}/`,
-      prune: true,
-      include: [`${config.projectName}/*`],
-    });
-  }
-}

package/iac/tsconfig.json

@@ -1,31 +0,0 @@
-{
-  "compilerOptions": {
-    "target": "ES2018",
-    "module": "commonjs",
-    "lib": [
-      "es2018"
-    ],
-    "declaration": true,
-    "strict": true,
-    "noEmit": true,
-    "noImplicitAny": true,
-    "strictNullChecks": true,
-    "noImplicitThis": true,
-    "alwaysStrict": true,
-    "noUnusedLocals": false,
-    "noUnusedParameters": false,
-    "noImplicitReturns": true,
-    "noFallthroughCasesInSwitch": false,
-    "inlineSourceMap": true,
-    "inlineSources": true,
-    "experimentalDecorators": true,
-    "strictPropertyInitialization": false,
-    "typeRoots": [
-      "./node_modules/@types"
-    ]
-  },
-  "exclude": [
-    "node_modules",
-    "cdk.out"
-  ]
-}