link local dependencies: storybookjs/storybook#11255

.gitignore

@@ -8,3 +8,4 @@ lib
 *.bs.js
 .bsb.lock
 *.gen.tsx
+storybook-static

packages/harmoniously-react/example/index.tsx

@@ -1,12 +1,12 @@
-import 'react-app-polyfill/ie11';
 import * as React from 'react';
+import 'react-app-polyfill/ie11';
 import * as ReactDOM from 'react-dom';
-import { Thing } from '../.';
+import { Harmony } from '.././src/index';
 
 const App = () => {
   return (
     <div>
-      <Thing />
+      <Harmony />
     </div>
   );
 };

packages/harmoniously-react/package.json

@@ -34,16 +34,16 @@
   },
   "dependencies": {
     "canvas-confetti": "1.3.2",
-    "harmoniously": "*"
+    "harmoniously": "^0.1.0"
   },
   "devDependencies": {
     "@babel/core": "^7.12.10",
     "@size-limit/preset-small-lib": "^4.9.1",
-    "@storybook/addon-essentials": "^6.1.14",
+    "@storybook/addon-essentials": "^6.1.15",
     "@storybook/addon-info": "^5.3.21",
-    "@storybook/addon-links": "^6.1.14",
-    "@storybook/addons": "^6.1.14",
-    "@storybook/react": "^6.1.14",
+    "@storybook/addon-links": "^6.1.15",
+    "@storybook/addons": "^6.1.15",
+    "@storybook/react": "^6.1.15",
     "@types/canvas-confetti": "1.3.0",
     "@types/react": "^17.0.0",
     "@types/react-dom": "^17.0.0",

packages/harmoniously-react/src/index.tsx

@@ -1,20 +1,24 @@
 import confetti from 'canvas-confetti';
+import { Assignments, harmony } from 'harmoniously';
 import React, { FC, HTMLAttributes, ReactChild } from 'react';
-
 export interface Props extends HTMLAttributes<HTMLDivElement> {
   /** custom content, defaults to 'the snozzberries taste like snozzberries' */
   children?: ReactChild;
+  assignments?: Assignments;
 }
 
 // Please do not use types off of a default export module or else Storybook Docs will suffer.
 // see: https://github.com/storybookjs/storybook/issues/9556
 /**
  * A custom Thing component. Neat!
  */
-export const Thing: FC<Props> = ({ children }) => {
+export const Harmony: FC<Props> = ({ children, assignments }) => {
+  const res = assignments && harmony(assignments, undefined, undefined);
+  console.log(res);
+
   return (
     <>
-      <div>{children || `the snozzberries taste like snozzberries`}</div>
+      <div>{children}</div>
       <button
         onClick={() =>
           confetti({

packages/harmoniously-react/stories/Thing.stories.tsx → packages/harmoniously-react/stories/Harmony.stories.tsx

@@ -1,10 +1,10 @@
-import React from 'react';
 import { Meta, Story } from '@storybook/react';
-import { Thing, Props } from '../src';
+import React from 'react';
+import { Harmony, Props } from '../src';
 
 const meta: Meta = {
   title: 'Welcome',
-  component: Thing,
+  component: Harmony,
   argTypes: {
     children: {
       control: {
@@ -19,10 +19,10 @@ const meta: Meta = {
 
 export default meta;
 
-const Template: Story<Props> = args => <Thing {...args} />;
+const Template: Story<Props> = (args: Props) => <Harmony {...args} />;
 
 // By passing using the Args format for exported stories, you can control the props for a component for reuse in a test
 // https://storybook.js.org/docs/react/workflows/unit-testing
-export const Default = Template.bind({});
+export const Default = Template.bind({ children: 'Hi' });
 
 Default.args = {};

packages/harmoniously-react/test/blah.test.tsx

@@ -1,11 +1,11 @@
 import React from 'react';
 import * as ReactDOM from 'react-dom';
-import { Default as Thing } from '../stories/Thing.stories';
+import { Default as Harmony } from '../stories/Harmony.stories';
 
-describe('Thing', () => {
+describe('Harmony', () => {
   it('renders without crashing', () => {
     const div = document.createElement('div');
-    ReactDOM.render(<Thing />, div);
+    ReactDOM.render(<Harmony />, div);
     ReactDOM.unmountComponentAtNode(div);
   });
 });

packages/harmoniously-react/tsconfig.json

@@ -31,5 +31,10 @@
     "forceConsistentCasingInFileNames": true,
     // `tsdx build` ignores this option, but it is commonly used when type-checking separately with `tsc`
     "noEmit": true,
+    // Use to load local dependents
+    "baseUrl": ".",
+    "paths": {
+      "harmoniously": ["../harmoniously/dist"]
+    }
   }
 }

packages/harmoniously/package.json

@@ -29,6 +29,7 @@
   },
   "devDependencies": {
     "@size-limit/preset-small-lib": "^4.9.1",
+    "core-js": "3.8.3",
     "husky": "^4.3.7",
     "size-limit": "^4.9.1",
     "tsdx": "^0.14.1",