initial commit

.commitlintrc.json

@@ -0,0 +1,6 @@
+{
+  "extends": [
+    "@commitlint/config-conventional",
+    "@commitlint/config-lerna-scopes"
+  ]
+}

.editorconfig

@@ -0,0 +1,9 @@
+root = true
+
+[*]
+indent_style = space
+indent_size = 2
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true

.eslintignore

@@ -0,0 +1,2 @@
+dist
+node_modules

.gitignore

@@ -0,0 +1,5 @@
+node_modules/
+.eslintcache
+dist
+.cache
+.rpt2_cache

.huskyrc

@@ -0,0 +1,6 @@
+{
+  "hooks": {
+    "pre-commit": "lerna run precommit --parallel",
+    "commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
+  }
+}

.prettierrc

@@ -0,0 +1,11 @@
+{
+  "requirePragma": false,
+  "printWidth": 80,
+  "tabWidth": 2,
+  "useTabs": false,
+  "semi": false,
+  "singleQuote": true,
+  "trailingComma": "all",
+  "bracketSpacing": true,
+  "jsxBracketSameLine": false
+}

.vscode/settings.json

@@ -0,0 +1,13 @@
+{
+  "typescript.tsdk": "node_modules/typescript/lib",
+  "javascript.format.enable": false,
+  "eslint.validate": [
+    "javascript",
+    "javascriptreact",
+    "typescript",
+    "typescriptreact"
+  ],
+  "editor.codeActionsOnSave": {
+    "source.fixAll.eslint": true
+  }
+}

core/specification/.babelrc

@@ -0,0 +1,14 @@
+{
+  "plugins": ["lodash"],
+  "presets": [
+    "@babel/preset-typescript",
+    [
+      "@babel/preset-env",
+      {
+        "targets": {
+          "node": "current"
+        }
+      }
+    ]
+  ]
+}

core/specification/.eslintignore

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

core/specification/.eslintrc.js

@@ -0,0 +1,3 @@
+module.exports = {
+  extends: 'docz-ts',
+}

core/specification/package.json

@@ -0,0 +1,49 @@
+{
+  "name": "@component-controls/specification",
+  "version": "0.8.0",
+  "description": "Component controls specification and utility routines",
+  "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 yarn build -w",
+    "fix": "yarn lint --fix",
+    "lint": "yarn eslint . --ext mdx,ts,tsx",
+    "precommit": "lint-staged",
+    "prepare": "yarn build",
+    "test": "yarn jest"
+  },
+  "homepage": "https://github.com/atanasster/component-controls",
+  "bugs": {
+    "url": "https://github.com/atanasster/component-controls/issues"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/atanasster/component-controls.git",
+    "directory": "core/specification"
+  },
+  "license": "MIT",
+  "dependencies": {
+    "escape-html": "^1.0.3",
+    "typescript": "3.5.3"
+  },
+  "devDependencies": {
+    "cross-env": "^5.2.1",
+    "docz-rollup": "^2.1.0",
+    "eslint": "^6.5.1",
+    "eslint-config-docz-ts": "^2.1.0",
+    "jest": "^24.9.0"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "authors": [
+    "Atanas Stoyanov"
+  ]
+}

core/specification/rollup.config.js

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

core/specification/src/controls-utils.ts

@@ -0,0 +1,96 @@
+import escape from 'escape-html'
+
+import { ComponentControl, ComponentControls, ControlTypes } from '.'
+
+export type LoadedComponentControl = ComponentControl & { defaultValue: any }
+export interface LoadedComponentControls {
+  [name: string]: LoadedComponentControl
+}
+
+// save default value for 'reset'
+export const loadControls = (
+  controls: ComponentControls,
+): LoadedComponentControls =>
+  Object.keys(controls).reduce((v, key) => {
+    const prop = controls[key]
+    return { ...v, [key]: { ...prop, defaultValue: prop.value } }
+  }, {})
+
+const mergeValue = (control: ComponentControl, value: any): any => {
+  if (control && control.type === ControlTypes.OBJECT) {
+    return {
+      ...control,
+      value: mergeControlValues(
+        control.value as LoadedComponentControls,
+        undefined,
+        value,
+      ),
+    }
+  }
+  return { ...control, value }
+}
+
+export const mergeControlValues = (
+  controls: LoadedComponentControls,
+  controlName: string | undefined,
+  value: any,
+): LoadedComponentControls => {
+  return controlName
+    ? {
+        ...controls,
+        [controlName]: mergeValue(controls[controlName], value),
+      }
+    : Object.keys(controls).reduce(
+        (acc, key) => ({
+          ...acc,
+          [key]: mergeValue(
+            controls[key],
+            value[key] === undefined ? controls[key].value : value[key],
+          ),
+        }),
+        {},
+      )
+}
+
+export const resetControlValues = (
+  controls: LoadedComponentControls,
+  controlName?: string,
+) => {
+  return controlName
+    ? {
+        ...controls,
+        [controlName]: {
+          ...controls[controlName],
+          value: controls[controlName].defaultValue,
+        },
+      }
+    : Object.keys(controls).reduce(
+        (acc, key) => ({
+          ...acc,
+          [key]: { ...controls[key], value: controls[key].defaultValue },
+        }),
+        {},
+      )
+}
+
+export const getControlValues = (
+  controls: LoadedComponentControls,
+): { [name: string]: any } =>
+  Object.keys(controls).reduce((acc, key) => {
+    const control: ComponentControl = controls[key]
+    let { value } = control
+    if (control.type === ControlTypes.TEXT && control.escapeValue) {
+      if (typeof value === 'string') {
+        value = escape(value)
+      }
+    } else if (
+      control.type === ControlTypes.OBJECT &&
+      typeof value === 'object'
+    ) {
+      return {
+        ...acc,
+        [key]: getControlValues(value as LoadedComponentControls),
+      }
+    }
+    return { ...acc, [key]: value }
+  }, {})

core/specification/src/index.test.ts

@@ -0,0 +1,38 @@
+import { ControlTypes } from './story-controls'
+import {
+  mergeControlValues,
+  resetControlValues,
+  LoadedComponentControls,
+} from './index'
+
+describe('Controls utils', () => {
+  const controls: LoadedComponentControls = {
+    name: { type: ControlTypes.TEXT, value: 'hello', defaultValue: 'hello' },
+    age: { type: ControlTypes.NUMBER, value: 19, defaultValue: 19 },
+  }
+  const modifiedControls: LoadedComponentControls = {
+    name: { type: ControlTypes.TEXT, value: 'today', defaultValue: 'hello' },
+    age: { type: ControlTypes.NUMBER, value: 19, defaultValue: 19 },
+  }
+
+  it('Should merge property value', () => {
+    expect(mergeControlValues(controls, 'name', 'today')).toMatchObject(
+      modifiedControls,
+    )
+  })
+  it('Should merge property object', () => {
+    expect(
+      mergeControlValues(controls, undefined, {
+        name: modifiedControls.name.value,
+        age: modifiedControls.age.value,
+      }),
+    ).toMatchObject(modifiedControls)
+  })
+
+  it('Should reset property value', () => {
+    expect(resetControlValues(modifiedControls, 'name')).toMatchObject(controls)
+  })
+  it('Should reset property object', () => {
+    expect(resetControlValues(modifiedControls)).toMatchObject(controls)
+  })
+})

core/specification/src/index.ts

@@ -0,0 +1,15 @@
+export * from './story-controls'
+
+export * from './controls-utils'
+
+export type SetControlValueFn = (
+  storyId: string,
+  propertyName: string | undefined,
+  value: any,
+) => void
+export type ClickControlFn = (storyId: string, propertyName: string) => void
+
+export type ResetControlValueFn = (
+  storyId: string,
+  propertyName?: string,
+) => void