ArgsFromMeta utility and generic ArgsStoryFn RT

.eslintignore

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

.github/workflows/test.yml

@@ -0,0 +1,29 @@
+name: Test
+
+on: [push]
+
+jobs:
+  test:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v2
+
+      - name: Use Node.js 14.x
+        uses: actions/setup-node@v1
+        with:
+          node-version: 14.x
+
+      - name: Install dependencies
+        uses: bahmutov/npm-install@v1
+
+      - name: Check typescript
+        run: |
+          yarn run check
+
+      - name: Check linter
+        run: |
+          yarn lint
+
+      - name: Run tests
+        run: |
+          yarn test

package.json

@@ -24,10 +24,12 @@
     "*.d.ts"
   ],
   "main": "dist/index.js",
+  "module": "dist/index.mjs",
   "types": "dist/index.d.ts",
   "scripts": {
-    "build": "babel src --out-dir dist --extensions \".ts\" && tsc --emitDeclarationOnly",
-    "lint": "eslint src --ext .js,.ts",
+    "build": "tsup ./src/index.ts --format esm,cjs --dts",
+    "check": "tsc",
+    "lint": "eslint src --ext .ts",
     "test": "jest",
     "release": "yarn build && auto shipit"
   },
@@ -38,31 +40,31 @@
   },
   "prettier": "@storybook/linter-config/prettier.config",
   "jest": {
+    "preset": "ts-jest",
     "testEnvironment": "node",
     "roots": [
       "<rootDir>/src"
     ]
   },
   "dependencies": {
-    "lodash": "^4.17.15"
+    "lodash": "^4.17.15",
+    "type-fest": "^2.19.0"
   },
   "devDependencies": {
     "@auto-it/released": "^10.37.1",
-    "@babel/cli": "^7.8.4",
-    "@babel/core": "^7.9.0",
-    "@babel/preset-env": "^7.9.5",
-    "@babel/preset-typescript": "^7.9.0",
     "@storybook/eslint-config-storybook": "^2.1.0",
-    "@types/jest": "^24.0.23",
+    "@types/jest": "^29.2.0",
     "@types/lodash": "^4.14.149",
+    "@types/node": "^18.11.0",
+    "@typescript-eslint/parser": "^4.33.0",
     "auto": "^10.31.0",
-    "babel-core": "7.0.0-bridge.0",
-    "babel-jest": "^24.9.0",
     "common-tags": "^1.8.0",
     "eslint": "^6.7.1",
-    "jest": "^24.9.0",
+    "jest": "^29.2.0",
     "prettier": "^2.7.1",
-    "typescript": "^3.7.2"
+    "ts-jest": "^29.0.3",
+    "tsup": "^6.3.0",
+    "typescript": "^4.8.4"
   },
   "auto": {
     "plugins": [

src/includeConditionalArg.test.ts

@@ -1,5 +1,6 @@
 /* eslint-disable @typescript-eslint/ban-ts-ignore */
 import { includeConditionalArg, testValue } from './includeConditionalArg';
+import type { Conditional } from './story';
 
 describe('testValue', () => {
   describe('truthy', () => {
@@ -60,33 +61,27 @@ describe('testValue', () => {
 describe('includeConditionalArg', () => {
   describe('errors', () => {
     it('should throw if neither arg nor global is specified', () => {
-      expect(() => includeConditionalArg({ if: {} }, {}, {})).toThrowErrorMatchingInlineSnapshot(
-        `"Invalid conditional value {}"`
-      );
+      expect(() =>
+        includeConditionalArg({ if: {} as Conditional }, {}, {})
+      ).toThrowErrorMatchingInlineSnapshot(`"Invalid conditional value {}"`);
     });
     it('should throw if arg and global are both specified', () => {
       expect(() =>
         includeConditionalArg({ if: { arg: 'a', global: 'b' } }, {}, {})
-      ).toThrowErrorMatchingInlineSnapshot(
-        `"Invalid conditional value {\\"arg\\":\\"a\\",\\"global\\":\\"b\\"}"`
-      );
+      ).toThrowErrorMatchingInlineSnapshot(`"Invalid conditional value {"arg":"a","global":"b"}"`);
     });
     it('should throw if mulitiple exists / eq / neq are specified', () => {
       expect(() =>
         includeConditionalArg({ if: { arg: 'a', exists: true, eq: 1 } }, {}, {})
-      ).toThrowErrorMatchingInlineSnapshot(
-        `"Invalid conditional test {\\"exists\\":true,\\"eq\\":1}"`
-      );
+      ).toThrowErrorMatchingInlineSnapshot(`"Invalid conditional test {"exists":true,"eq":1}"`);
 
       expect(() =>
         includeConditionalArg({ if: { arg: 'a', exists: false, neq: 0 } }, {}, {})
-      ).toThrowErrorMatchingInlineSnapshot(
-        `"Invalid conditional test {\\"exists\\":false,\\"neq\\":0}"`
-      );
+      ).toThrowErrorMatchingInlineSnapshot(`"Invalid conditional test {"exists":false,"neq":0}"`);
 
       expect(() =>
         includeConditionalArg({ if: { arg: 'a', eq: 1, neq: 0 } }, {}, {})
-      ).toThrowErrorMatchingInlineSnapshot(`"Invalid conditional test {\\"eq\\":1,\\"neq\\":0}"`);
+      ).toThrowErrorMatchingInlineSnapshot(`"Invalid conditional test {"eq":1,"neq":0}"`);
     });
   });
 

src/includeConditionalArg.ts

@@ -1,7 +1,7 @@
 import isEqual from 'lodash/isEqual';
 import { Args, Globals, InputType, Conditional } from './story';
 
-const count = (vals: any[]) => vals.map(v => typeof v !== 'undefined').filter(Boolean).length;
+const count = (vals: any[]) => vals.map((v) => typeof v !== 'undefined').filter(Boolean).length;
 
 export const testValue = (cond: Omit<Conditional, 'arg' | 'global'>, value: any) => {
   const { exists, eq, neq, truthy } = cond as any;
@@ -35,5 +35,6 @@ export const includeConditionalArg = (argType: InputType, args: Args, globals: G
   }
 
   const value = arg ? args[arg] : globals[global];
+  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
   return testValue(argType.if!, value);
 };

src/index.ts

@@ -74,7 +74,7 @@ export interface SeparatorOptions {
  */
 export const parseKind = (kind: string, { rootSeparator, groupSeparator }: SeparatorOptions) => {
   const [root, remainder] = kind.split(rootSeparator, 2);
-  const groups = (remainder || kind).split(groupSeparator).filter(i => !!i);
+  const groups = (remainder || kind).split(groupSeparator).filter((i) => !!i);
 
   // when there's no remainder, it means the root wasn't found/split
   return {

src/story.ts

@@ -1,3 +1,5 @@
+/* global HTMLElement, AbortSignal */
+import { Simplify, UnionToIntersection } from 'type-fest';
 import { SBType, SBScalarType } from './SBType';
 
 export * from './SBType';
@@ -142,7 +144,7 @@ export type LegacyStoryFn<TFramework extends AnyFramework = AnyFramework, TArgs
 export type ArgsStoryFn<TFramework extends AnyFramework = AnyFramework, TArgs = Args> = (
   args: TArgs,
   context: StoryContext<TFramework, TArgs>
-) => TFramework['storyResult'];
+) => (TFramework & { T: TArgs })['storyResult'];
 
 // This is either type of user story function
 export type StoryFn<TFramework extends AnyFramework = AnyFramework, TArgs = Args> =
@@ -332,3 +334,19 @@ export type AnnotatedStoryFn<
 export type StoryAnnotationsOrFn<TFramework extends AnyFramework = AnyFramework, TArgs = Args> =
   | AnnotatedStoryFn<TFramework, TArgs>
   | StoryAnnotations<TFramework, TArgs>;
+
+export type ArgsFromMeta<TFramework extends AnyFramework, Meta> = Meta extends {
+  render?: ArgsStoryFn<TFramework, infer RArgs>;
+  loaders?: (infer Loaders)[];
+  decorators?: (infer Decorators)[];
+}
+  ? Simplify<RArgs & DecoratorsArgs<TFramework, Decorators> & LoaderArgs<TFramework, Loaders>>
+  : unknown;
+
+type DecoratorsArgs<TFramework extends AnyFramework, Decorators> = UnionToIntersection<
+  Decorators extends DecoratorFunction<TFramework, infer TArgs> ? TArgs : unknown
+>;
+
+type LoaderArgs<TFramework extends AnyFramework, Loaders> = UnionToIntersection<
+  Loaders extends LoaderFunction<TFramework, infer TArgs> ? TArgs : unknown
+>;

tsconfig.json

@@ -1,15 +1,16 @@
 {
   "compilerOptions": {
-    "target": "es5",
+    "target": "ES2022",
     "lib": ["es2015", "es2017", "dom"],
-    "module": "commonjs",
+    "moduleResolution": "Node",
+    "module": "ES2022",
     "declaration": true,
-    "removeComments": true,
     "strict": true,
-    "noImplicitAny": true,
     "esModuleInterop": true,
-    "outDir": "dist"
+    "outDir": "dist",
+    "skipLibCheck": true,
+    "noEmit": true
   },
   "include": ["src"],
-  "exclude": ["src/**/*.test.ts", "dist"]
+  "exclude": ["dist", "src/includeConditionalArg.test.ts"]
 }