@teambit/harmony
TypeScript icon, indicating that this package has built-in type declarations

0.0.17 • Public • Published

Harmony

Plugin Module Extension

  • Feature Plugin Trait
  • Component (could be a composition of other components)

Plugability

  • Hook
  • Slot

Harmony is the engine that drives Bit extensibility and composability.
It's an abstract extension system you can use to make any software extendable and composable.

composition model

Harmony proposes a graph composition model. compoisiton model should allow:

  • full control over composition including dependency composition.
  • easy overrides mechanaism for configs.
  • full encapsulation of an extension.

bit.config.js

import FlowSchemaPlugin from '@bit/plugins.flow-schema';

export default () => {
  return [ // returns an array of PluginInstance
    [FlowScehmaPlugin, {

    }],
    [ReactSchemaPlugin, {
      eslintrc: './.eslintrc'
    }]
  ];
}

configured extensions in bit.json

{
  "extensions": {
    "bit.envs/eslint@0.0.4": {
      "eslintrc": "./.eslintrc"
    },
    "bit.envs/babel@0.0.1": {
      "babelrc": "./.babelrc",
      "strict": true,
      "__alias": "compile"
    },
    "bit.envs/webpack@0.0.1": {
      "config": "./webpack.config.js",
      "mode": "prod",
      "__alias": "bundle"
    },
    "bit.envs/mocha@0.0.1": {
      "reporter": "json",
      "mochaOptions": "./mocha.opts",
      "__alias": "test-mocha"
    }
  },
  "pipes": {
    "tag": [""]
  },
  "dist": {
    "target": "",
    "entry": ""
  }
}

Open questions

  • How do I install a Bit extensions? Where the component is configured?
  • Is the extension installed with Bit/NPM?
  • What's the impl. behind bit use <plugin/extension name>
  • maybe an composition model can co-exist as json and js? what are the tradeoffs?

extension registration

import { register } from 'harmony';
import { DocGen } from '@bit/bit.exts.docgen';

const extensions = register([DocGen]);

lifecycle event invocation

import { invoke } from 'harmony';

invoke('tag', ...data);

lifecycle event registration

import { Lifecycle } from 'harmony';

@Lifecycle(Tag);
function tag() {
  
}

state / schema management

@Lifecycle(Tag)
function tag(component: Component) {
  const docs = component.get('docs'); // returns `Maybe` type?
  const docs: Docs = docs.get();
}

function extension

export default function foo() {
  context.a
}

configuration

an extension can declaratively ask for configuration type. this can be reflected

  • extensions can be configured during instantiation.
  • configuration types can be built from multiple sources

context

  • standard context can be shared between all extensions in the same instance.

extension composition

  • hook invocation from an extension
  • extension dependencies? how can an extension declare a dependency as part of its execution?
  • contextual/namespaced hooks
  • config api

extension resolution

import { resolve } from 'harmony';

const extension = resolve('doc-gen');

Questions (?)

  • can extensions be added/configured during runtime? DI
  • is there a difference between extension composition to registration?
  • how to make autocomplete work for hooks?
  • how to avoid unintentional hook invocation (decorators?)
  • how to declare a new hook..
  • schema validator
  • dev expereience of an extension.
  • how do manage different runtime environments? should I? Why is that relavent?
  • runtime capsules?
  • how can one extension run from both server and client? how capsule is related?
  • in which process extensions will run from? also, what will happen from the backend?

Package Sidebar

Install

npm i @teambit/harmony@0.0.17

Version

0.0.17

License

MIT

Unpacked Size

56.3 kB

Total Files

86

Last publish

Collaborators

  • learn-bit
  • teambit-owner
  • shohamgilad
  • davidfirst
  • lalybar
  • ranm8
  • guysaar
  • itaymendel
  • erezbit
  • joshk2
  • redigma
  • yona007
  • jonisar