feat: jest snapshots initial check-in

.vscode/launch.json

@@ -147,6 +147,22 @@
       "windows": {
         "program": "${workspaceFolder}/node_modules/jest/bin/jest",
       }
+    },
+    {
+      "type": "node",
+      "request": "launch",
+      "name": "jest jest-addon",
+      "program": "${workspaceFolder}/node_modules/.bin/jest",
+      "cwd": "${workspaceFolder}/plugins/jest-snapshots",
+      "args": [
+        "stories",
+      ],
+      "console": "integratedTerminal",
+      "internalConsoleOptions": "neverOpen",
+      "disableOptimisticBPs": true,
+      "windows": {
+        "program": "${workspaceFolder}/node_modules/jest/bin/jest",
+      }
     }
   ]
 }

core/config/package.json

@@ -31,7 +31,6 @@
   "license": "MIT",
   "dependencies": {
     "@component-controls/core": "^1.21.0",
-    "chalk": "^4.0.0",
     "glob": "^7.1.6",
     "glob-base": "^0.3.0",
     "micromatch": "^4.0.2",

core/core/src/configuration.ts

@@ -2,6 +2,17 @@ import { Configuration as WebpackConfiguration } from 'webpack';
 import { ActionItems } from '@component-controls/components';
 import { ComponentType, ReactNode } from 'react';
 import { StoryRenderFn } from './utility';
+import { ReactElement } from 'react';
+import { Store } from './document';
+
+/**
+ * render function by framework. By default 'react'
+ */
+export type FrameworkRenderFn = (
+  storyId: string,
+  store: Store,
+  options?: any,
+) => ReactElement;
 
 /**
  * story type pages can have multiple tabs with separate page configurations.
@@ -47,7 +58,7 @@ export interface PageLayoutProps {
    */
   fullPage?: boolean;
 }
-export type SideNavConfiguration = {
+export interface SideNavConfiguration {
   /**
    * if true, generate story-based paths. This is for documents with a navSidebar that would allow selection of specific stories.
    */
@@ -57,7 +68,7 @@ export type SideNavConfiguration = {
    * if a single story in the document, and storyPaths is true= will only generate a single menu item for the doc itself
    */
   collapseSingle?: boolean;
-};
+}
 export type PageConfiguration = {
   /**
    * base url path for the page
@@ -114,7 +125,7 @@ export type PagesOnlyRoutes = Record<
  * global configuration used at build time
  * stored in a file named main.js/main.ts
  */
-export type BuildConfiguration = {
+export interface BuildConfiguration {
   /**
    * wild card search string for the stories
    * internally using `glob` for the search: https://www.npmjs.com/package/glob
@@ -140,7 +151,7 @@ export type BuildConfiguration = {
    * instrumentation configuration
    */
   instrument?: any;
-};
+}
 
 export interface ToolbarConfig {
   /**
@@ -170,6 +181,10 @@ export interface ControlsConfig {
  * stored in a file named main.js/main.ts
  */
 export interface RunOnlyConfiguration {
+  /**
+   * framework-specific render function. By default react render
+   */
+  renderFn?: FrameworkRenderFn;
   /**
    * story decorator functions - used to wrap stories
    * example: [story => <ThemeProvider>{story()}</ThemeProvider>]

core/loader/package.json

@@ -38,7 +38,7 @@
     "@component-controls/config": "^1.21.0",
     "@component-controls/core": "^1.21.0",
     "@component-controls/instrument": "^1.21.0",
-    "chalk": "^4.0.0",
+    "@component-controls/logger": "^1.21.0",
     "js-string-escape": "^1.0.1",
     "loader-utils": "^1.2.3",
     "typescript": "^3.8.3",

core/loader/src/loader.ts

@@ -1,7 +1,7 @@
 import * as fs from 'fs';
-import * as chalk from 'chalk';
 import { getOptions } from 'loader-utils';
 import { loader } from 'webpack';
+import { log } from '@component-controls/logger';
 import { deepmerge } from '@component-controls/core';
 import {
   InstrumentOptions,
@@ -23,7 +23,7 @@ module.exports = async function() {
     options,
   );
   if (store?.doc) {
-    console.log(chalk.bgRgb(244, 147, 66)('@loaded: '), filePath);
+    log('loaded: ', filePath);
     if (store.stories && store.components && store.packages) {
       addStoriesDoc(options, filePath, context._compilation.records.hash, {
         stories: store.stories,

core/logger/.eslintignore

@@ -0,0 +1 @@
+dist

core/logger/LICENSE.md

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2020 Atanas Stoyanov
+
+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.

core/logger/README.md

@@ -0,0 +1,133 @@
+# Table of contents
+
+-   [Overview](#overview)
+-   [Installation](#installation)
+-   [API](#api)
+    -   [LogOptions](#logoptions)
+    -   [LogLevel](#loglevel)
+    -   [error](#error)
+    -   [log](#log)
+    -   [output](#output)
+    -   [setLogOptions](#setlogoptions)
+    -   [defaultOptions](#defaultoptions)
+    -   [logOptions](#logoptions-1)
+    -   [LogLevel](#loglevel-1)
+
+# Overview
+
+Logging utilities. Uses the [chalk](https://github.com/chalk/chalk#readme) package for logging utput
+
+# Installation
+
+This package is usually installed as part of the @component-controls package, but you can also install it standalone:
+
+```bash
+$ npm install @component-controls/logger --save-dev
+```
+
+# API
+
+<tsdoc-typescript entry="./src/index.ts" files="../specification/src/configuration.ts"/>
+
+<!-- START-TSDOC-TYPESCRIPT -->
+
+## LogOptions
+
+_defined in [@component-controls/logger/src/index.ts](https://github.com/ccontrols/component-controls/tree/master/core/logger/src/index.ts#L5)_
+
+
+
+### properties
+
+| Name       | Type                      | Description |
+| ---------- | ------------------------- | ----------- |
+| `colors*`  | \[number, number, number] |             |
+| `logLevel` | [LogLevel](#loglevel)     |             |
+
+## LogLevel
+
+_defined in [@component-controls/logger/src/index.ts](https://github.com/ccontrols/component-controls/tree/master/core/logger/src/index.ts#L3)_
+
+'all' | 'errors' | 'none'
+
+## error
+
+_defined in [@component-controls/logger/src/index.ts](https://github.com/ccontrols/component-controls/tree/master/core/logger/src/index.ts#L26)_
+
+**function** error(`heading`\*: string, `text`\*: string): void;
+
+### parameters
+
+| Name       | Type   | Description |
+| ---------- | ------ | ----------- |
+| `heading*` | string |             |
+| `text*`    | string |             |
+| `returns`  | void   |             |
+
+## log
+
+_defined in [@component-controls/logger/src/index.ts](https://github.com/ccontrols/component-controls/tree/master/core/logger/src/index.ts#L21)_
+
+**function** log(`heading`\*: string, `text`\*: string): void;
+
+### parameters
+
+| Name       | Type   | Description |
+| ---------- | ------ | ----------- |
+| `heading*` | string |             |
+| `text*`    | string |             |
+| `returns`  | void   |             |
+
+## output
+
+_defined in [@component-controls/logger/src/index.ts](https://github.com/ccontrols/component-controls/tree/master/core/logger/src/index.ts#L17)_
+
+**function** output(`heading`\*: string, `text`\*: string): void;
+
+### parameters
+
+| Name       | Type   | Description |
+| ---------- | ------ | ----------- |
+| `heading*` | string |             |
+| `text*`    | string |             |
+| `returns`  | void   |             |
+
+## setLogOptions
+
+_defined in [@component-controls/logger/src/index.ts](https://github.com/ccontrols/component-controls/tree/master/core/logger/src/index.ts#L32)_
+
+**function** setLogOptions(`options`\*: Partial&lt;[LogOptions](#logoptions)>): void;
+
+### parameters
+
+| Name       | Type                                  | Description |
+| ---------- | ------------------------------------- | ----------- |
+| `options*` | Partial&lt;[LogOptions](#logoptions)> |             |
+| `returns`  | void                                  |             |
+
+## defaultOptions
+
+_defined in [@component-controls/logger/src/index.ts](https://github.com/ccontrols/component-controls/tree/master/core/logger/src/index.ts#L10)_
+
+
+
+### properties
+
+| Name        | Type                      | Description |
+| ----------- | ------------------------- | ----------- |
+| `colors*`   | \[number, number, number] |             |
+| `logLevel*` | 'all'                     |             |
+
+## logOptions
+
+_defined in [@component-controls/logger/src/index.ts](https://github.com/ccontrols/component-controls/tree/master/core/logger/src/index.ts#L15)_
+
+
+
+## LogLevel
+
+_defined in [@component-controls/logger/src/index.ts](https://github.com/ccontrols/component-controls/tree/master/core/logger/src/index.ts#L3)_
+
+'all' | 'errors' | 'none'
+
+<!-- END-TSDOC-TYPESCRIPT -->

core/logger/package.json

@@ -0,0 +1,59 @@
+{
+  "name": "@component-controls/logger",
+  "version": "1.21.0",
+  "description": "compilation logging utilities",
+  "main": "dist/index.js",
+  "module": "dist/index.esm.js",
+  "typings": "dist/index.d.ts",
+  "files": [
+    "dist/",
+    "package.json",
+    "README.md"
+  ],
+  "scripts": {
+    "build": "yarn cross-env NODE_ENV=production rollup -c",
+    "dev": "yarn cross-env NODE_ENV=development rollup -cw",
+    "docs": "ts-md",
+    "fix": "yarn lint --fix",
+    "lint": "yarn eslint . --ext mdx,ts,tsx",
+    "prepare": "yarn build",
+    "test": "yarn jest --passWithNoTests"
+  },
+  "homepage": "https://github.com/ccontrols/component-controls",
+  "bugs": {
+    "url": "https://github.com/ccontrols/component-controls/issues"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/ccontrols/component-controls.git",
+    "directory": "core/logger"
+  },
+  "license": "MIT",
+  "dependencies": {
+    "chalk": "^4.0.0"
+  },
+  "devDependencies": {
+    "@component-controls/ts-markdown-docs": "^1.21.0",
+    "typescript": "^3.8.3",
+    "@types/jest": "^25.1.2",
+    "cross-env": "^5.2.1",
+    "eslint": "^6.5.1",
+    "jest": "^24.9.0"
+  },
+  "browser": {
+    "fs": false
+  },
+  "jest": {
+    "testEnvironment": "node",
+    "roots": [
+      "."
+    ]
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "authors": [
+    "Atanas Stoyanov"
+  ],
+  "gitHead": "c5145d66c6b8a355839e53c3bca97fd361ce9377"
+}

core/logger/rollup.config.js

@@ -0,0 +1,5 @@
+import { config } from '../../rollup-config';
+
+export default config({
+  input: './src/index.ts',
+});

core/logger/src/index.ts

@@ -0,0 +1,34 @@
+import chalk from 'chalk';
+
+export type LogLevel = 'all' | 'errors' | 'none';
+
+export interface LogOptions {
+  logLevel?: LogLevel;
+  colors: [number, number, number];
+}
+
+const defaultOptions: LogOptions = {
+  logLevel: 'all',
+  colors: [244, 147, 66],
+};
+
+let logOptions: LogOptions = { ...defaultOptions };
+
+const output = (heading: string, text: string) => {
+  console.log(chalk.bgRgb(...logOptions.colors)(`@${heading}`), text);
+};
+
+export const log = (heading: string, text: string) => {
+  if (logOptions.logLevel === 'all') {
+    output(heading, text);
+  }
+};
+export const error = (heading: string, text: string) => {
+  if (logOptions.logLevel !== 'none') {
+    output(heading, text);
+  }
+};
+
+export const setLogOptions = (options: Partial<LogOptions> = {}) => {
+  logOptions = { ...logOptions, ...options };
+};

core/logger/tsconfig.json

@@ -0,0 +1,13 @@
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "module": "esnext",
+    "outDir": "dist",
+    "rootDir": "src",
+    "declaration": true,
+    "types": ["node", "jest"],
+    "typeRoots": ["../../node_modules/@types", "node_modules/@types"]
+  },
+  "include": ["src/**/*", "test"],
+  "exclude": ["node_modules/**", "test/**"]
+}