@knapsack/renderer-react 4.72.0--canary.4920.be98a9b.0 → 4.72.0--canary.5313.51b7b5f.0

package/package.json

@@ -1,10 +1,8 @@
 {
   "name": "@knapsack/renderer-react",
   "description": "Render React",
-  "version": "4.72.0--canary.4920.be98a9b.0",
+  "version": "4.72.0--canary.5313.51b7b5f.0",
   "type": "commonjs",
-  "main": "dist/index.js",
-  "types": "dist/index.d.ts",
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
@@ -17,31 +15,30 @@
     "./package": "./package.json",
     "./package.json": "./package.json",
     "./prototype-template": {
-      "types": "./dist/prototype-template.d.ts",
-      "require": "./dist/prototype-template.js",
-      "import": "./dist/prototype-template.mjs",
-      "default": "./dist/prototype-template.mjs"
+      "types": "./prototype-template.d.mts",
+      "default": "./prototype-template.mjs"
     }
   },
-  "sideEffects": false,
+  "sideEffects": [
+    "./dist/client/init.mjs"
+  ],
   "scripts": {
-    "build": "tsup src/index.ts src/error-catcher.tsx src/demo-wrapper.tsx src/prototype-template.tsx src/client/init.tsx",
+    "build": "tsc",
     "clean": "rm -rf dist",
-    "lint": "eslint ./src ./tests --quiet",
-    "test": "npm run test:types && npm run test:unit",
-    "test:types": "tsc",
-    "test:unit": "ava"
+    "lint": "eslint ./src --quiet",
+    "test": "ava"
   },
   "author": "Knapsack",
   "dependencies": {
-    "@babel/preset-react": "^7.25.7",
-    "@knapsack/app": "4.72.0--canary.4920.be98a9b.0",
-    "@knapsack/creator-utils": "4.72.0--canary.4920.be98a9b.0",
-    "@knapsack/file-utils": "4.72.0--canary.4920.be98a9b.0",
-    "@knapsack/ks-file-utils": "4.72.0--canary.4920.be98a9b.0",
-    "@knapsack/renderer-webpack-base": "4.72.0--canary.4920.be98a9b.0",
-    "@knapsack/types": "4.72.0--canary.4920.be98a9b.0",
-    "@knapsack/utils": "4.72.0--canary.4920.be98a9b.0",
+    "@babel/preset-react": "^7.25.9",
+    "@knapsack/app": "4.72.0--canary.5313.51b7b5f.0",
+    "@knapsack/creator-utils": "4.72.0--canary.5313.51b7b5f.0",
+    "@knapsack/file-utils": "4.72.0--canary.5313.51b7b5f.0",
+    "@knapsack/ks-file-utils": "4.72.0--canary.5313.51b7b5f.0",
+    "@knapsack/renderer-react-components": "4.72.0--canary.5313.51b7b5f.0",
+    "@knapsack/renderer-webpack-base": "4.72.0--canary.5313.51b7b5f.0",
+    "@knapsack/types": "4.72.0--canary.5313.51b7b5f.0",
+    "@knapsack/utils": "4.72.0--canary.5313.51b7b5f.0",
     "react": "^18.3.1",
     "react-docgen": "^6.0.4",
     "react-docgen-typescript": "^2.2.2",
@@ -50,19 +47,18 @@
     "typescript": "^5.6.3"
   },
   "devDependencies": {
-    "@knapsack/eslint-config-starter": "4.72.0--canary.4920.be98a9b.0",
-    "@knapsack/sandbox-components": "4.72.0--canary.4920.be98a9b.0",
-    "@knapsack/test-ava": "4.72.0--canary.4920.be98a9b.0",
-    "@knapsack/typescript-config-starter": "4.72.0--canary.4920.be98a9b.0",
+    "@knapsack/eslint-config-starter": "4.72.0--canary.5313.51b7b5f.0",
+    "@knapsack/sandbox-components": "4.72.0--canary.5313.51b7b5f.0",
+    "@knapsack/test-ava": "4.72.0--canary.5313.51b7b5f.0",
+    "@knapsack/typescript-config-starter": "4.72.0--canary.5313.51b7b5f.0",
     "@mui/material": "^5.16.7",
     "@mui/x-data-grid": "^6.20.4",
-    "@types/node": "^20.17.2",
-    "@types/react": "^18.3.11",
-    "@types/react-dom": "^18.3.0",
+    "@types/node": "^20.17.8",
+    "@types/react": "^18.3.12",
+    "@types/react-dom": "^18.3.1",
     "ava": "^6.2.0",
     "eslint": "^8.57.0",
-    "prop-types": "^15.8.1",
-    "tsup": "^8.3.0"
+    "prop-types": "^15.8.1"
   },
   "publishConfig": {
     "access": "public"
@@ -72,5 +68,5 @@
     "directory": "apps/client/renderers/renderer-react",
     "type": "git"
   },
-  "gitHead": "be98a9b39ed70c97fd88e8359e5420250a582b6f"
+  "gitHead": "51b7b5f2b8e4a42f078030647178769053559d32"
 }

package/prototype-template.d.mts

@@ -0,0 +1,3 @@
+import PrototypeTemplate from '@knapsack/renderer-react-components/prototype-template';
+
+export default PrototypeTemplate;

package/prototype-template.mjs

@@ -0,0 +1,3 @@
+import PrototypeTemplate from '@knapsack/renderer-react-components/prototype-template';
+
+export default PrototypeTemplate;

package/test-fixtures/pkg-diff-types/button.js

@@ -0,0 +1,10 @@
+const jsx_runtime_1 = require('react/jsx-runtime');
+
+const Button = (props) => {
+  return (0, jsx_runtime_1.jsx)('button', {
+    type: 'button',
+    children: props.text,
+  });
+};
+
+module.exports = { Button };

package/test-fixtures/pkg-diff-types/package.json

@@ -0,0 +1,4 @@
+{
+  "module": "./button.js",
+  "types": "./types/button.d.ts"
+}

package/test-fixtures/pkg-diff-types/readme.md

@@ -0,0 +1 @@
+note that the dist does not have `x.js` & `x.d.ts` - instead the `types` key in `package.json` points to a different location - this is because of the `declarationDir` config in `tsconfig.json`

package/test-fixtures/pkg-diff-types/types/button.d.ts

@@ -0,0 +1,5 @@
+export declare const Button: (props: {
+  text: string;
+  size?: 'small' | 'medium' | 'large';
+  children: React.ReactNode;
+}) => import('react/jsx-runtime').JSX.Element;

package/tsconfig.json

@@ -1,8 +1,9 @@
 {
-  "extends": "@knapsack/typescript-config-starter/tsconfig.test-only.json",
-  "include": ["src/**/*", "*.*", "tests/**/*"],
+  "extends": "@knapsack/typescript-config-starter/tsconfig.build.json",
+  "include": ["src/**/*"],
   "exclude": ["**/dist"],
   "compilerOptions": {
+    "strictNullChecks": false,
     "noImplicitAny": false,
     "outDir": "./dist"
   }

package/dist/client/init.d.ts

@@ -1,2 +0,0 @@
-
-export {  }

package/dist/client/init.js

@@ -1,20 +0,0 @@
-'use strict';
-
-var E = require('react');
-var g = require('react-dom/client');
-var client = require('@knapsack/renderer-webpack-base/client');
-var jsxRuntime = require('react/jsx-runtime');
-
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var E__default = /*#__PURE__*/_interopDefault(E);
-var g__default = /*#__PURE__*/_interopDefault(g);
-
-var l=Object.defineProperty;var n=(r,e)=>l(r,"name",{value:e,configurable:!0});var h=(r,e)=>()=>(r&&(e=r(r=0)),e);var C=(r,e)=>()=>(e||r((e={exports:{}}).exports,e),e.exports);var a,m=h(()=>{a="ks-react-meta";});var I=C(()=>{m();async function x(){try{let{getNeededImports:r,getExtraImports:e,rendererMeta:{disableReactStrictMode:d,demoWrapperProps:s},rendererMethods:{getDemoApp:c}}=client.getKsRendererClientUtils({rendererMetaScriptTagId:a}),[i,{DemoWrapper:R,ErrorCatcher:y}]=await Promise.all([r(),e()]),o=document.getElementById("render-root");if(!o)throw new Error("No root element found");let M=c(i),p=jsxRuntime.jsx(y,{children:jsxRuntime.jsx(R,{...s,children:jsxRuntime.jsx(M,{})})});g__default.default.createRoot(o).render(d?p:jsxRuntime.jsx(E__default.default.StrictMode,{children:p}));}catch(r){console.error(r);let e=document.createElement("div");e.innerHTML=`
-    <h1>Error</h1>
-    <p>${r.message}</p>
-  `,document.body.appendChild(e);}}n(x,"init");x();});var init = I();
-
-module.exports = init;
-//# sourceMappingURL=init.js.map
-//# sourceMappingURL=init.js.map

package/dist/client/init.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/types.ts","../../src/client/init.tsx"],"names":["rendererMetaScriptTagId","init_types","__esmMin","require_init","__commonJSMin","init","getNeededImports","getExtraImports","disableReactStrictMode","demoWrapperProps","getDemoApp","getKsRendererClientUtils","neededImports","DemoWrapper","ErrorCatcher","root","DemoApp","app","jsx","ReactDOM","React","e","errorElement","__name"],"mappings":";;;;;;;;;;;;AAAA,IAAA,CAAA,CAAA,MAAA,CAAA,cAAA,CAAA,IAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,GAAA,CAAA,CAAA,CAAA,CAAA,MAAA,CAAA,CAAA,KAAA,CAAA,CAAA,CAAA,YAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,IAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,GAAA,KAAA,CAAA,GAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,IAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,GAAA,KAAA,CAAA,EAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,OAAA,CAAA,EAAA,CAAA,EAAA,OAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,OAAA,CAAA,CAAA,IAuBaA,CAvBbC,CAAAA,CAAAA,CAAAC,CAAA,CAAA,IAAA,CAuBaF,CAA0B,CAAA,gBAAA,CAAA,CAAA,CCvBvC,IAAAG,CAAAA,CAAAC,EAAA,IAIAH,CAAAA,CAAAA,EAAAA,CAQA,eAAeI,CAAAA,EAAO,CACpB,GAAI,CACF,GAAM,CACJ,gBAAAC,CAAAA,CAAAA,CACA,eAAAC,CAAAA,CAAAA,CACA,YAAc,CAAA,CAAE,sBAAAC,CAAAA,CAAAA,CAAwB,gBAAAC,CAAAA,CAAiB,CACzD,CAAA,eAAA,CAAiB,CAAE,UAAA,CAAAC,CAAW,CAChC,EAAIC,+BAKF,CAAA,CACA,uBAAAX,CAAAA,CACF,CAAC,CAAA,CACK,CAACY,CAAAA,CAAe,CAAE,WAAAC,CAAAA,CAAAA,CAAa,YAAAC,CAAAA,CAAa,CAAC,CAAA,CAAI,MAAM,OAAA,CAAQ,IAAI,CACvER,CAAAA,EACAC,CAAAA,CAAAA,EACF,CAAC,CACKQ,CAAAA,CAAAA,CAAO,QAAS,CAAA,cAAA,CAAe,aAAa,CAAA,CAClD,GAAI,CAACA,CACH,CAAA,MAAM,IAAI,KAAM,CAAA,uBAAuB,CAGzC,CAAA,IAAMC,CAAUN,CAAAA,CAAAA,CADOE,CACkB,CAAA,CACnCK,EACJC,cAACJ,CAAAA,CAAAA,CAAA,CACC,QAAA,CAAAI,cAACL,CAAAA,CAAAA,CAAA,CAAa,GAAGJ,EACf,QAAAS,CAAAA,cAAAA,CAACF,CAAA,CAAA,EAAQ,CACX,CAAA,CAAA,CACF,CAGFG,CAAAA,kBAAAA,CAAS,WAAWJ,CAAI,CAAA,CAAE,MACxBP,CAAAA,CAAAA,CAAyBS,CAAMC,CAAAA,cAAAA,CAACE,kBAAM,CAAA,UAAA,CAAN,CAAkB,QAAAH,CAAAA,CAAAA,CAAI,CACxD,EACF,CAASI,MAAAA,CAAAA,CAAG,CACV,OAAA,CAAQ,MAAMA,CAAC,CAAA,CAEf,IAAMC,CAAAA,CAAe,QAAS,CAAA,aAAA,CAAc,KAAK,CAAA,CACjDA,EAAa,SAAY,CAAA,CAAA;AAAA;AAAA,OAAA,EAEpBD,EAAE,OAAO,CAAA;AAAA,EAEd,CAAA,CAAA,QAAA,CAAS,IAAK,CAAA,WAAA,CAAYC,CAAY,EACxC,CACF,CA9CeC,CAAAA,CAAAlB,CAAA,CAAA,MAAA,CAAA,CAgDfA,CAAK,GAAA,CAAA,CAAA,CAAA,WAAA,CAAA,EAAA","file":"init.js","sourcesContent":["import type { Demo, Except } from '@knapsack/types';\nimport type { ComponentType } from 'react';\nimport type { RendererMetaBase } from '@knapsack/renderer-webpack-base/client';\n\nexport type Component = ComponentType<Record<string, unknown>>;\n\nexport type DemoWrapperProps = {\n  children: React.ReactNode;\n  demo: Demo;\n  patternId: string;\n  templateId: string;\n};\n\nexport type ExtraJsImportNames = 'DemoWrapper' | 'ErrorCatcher';\n/**\n * Found as JSON in HTML `#ks-react-meta`\n */\nexport type KsReactMeta = {\n  disableReactStrictMode: boolean;\n  demo: Demo;\n  demoWrapperProps: Except<DemoWrapperProps, 'children'>;\n} & RendererMetaBase;\n\nexport const rendererMetaScriptTagId = 'ks-react-meta';\n\nexport type RendererMethods = {\n  getDemoApp: (components: Record<string, Component>) => Component;\n};\n","/// <reference lib=\"dom\" />\nimport React from 'react';\nimport ReactDOM from 'react-dom/client';\nimport { getKsRendererClientUtils } from '@knapsack/renderer-webpack-base/client';\nimport {\n  rendererMetaScriptTagId,\n  type KsReactMeta,\n  type Component,\n  type RendererMethods,\n  ExtraJsImportNames,\n} from '../types';\n\nasync function init() {\n  try {\n    const {\n      getNeededImports,\n      getExtraImports,\n      rendererMeta: { disableReactStrictMode, demoWrapperProps },\n      rendererMethods: { getDemoApp },\n    } = getKsRendererClientUtils<\n      Component,\n      KsReactMeta,\n      RendererMethods,\n      ExtraJsImportNames\n    >({\n      rendererMetaScriptTagId,\n    });\n    const [neededImports, { DemoWrapper, ErrorCatcher }] = await Promise.all([\n      getNeededImports(),\n      getExtraImports(),\n    ]);\n    const root = document.getElementById('render-root');\n    if (!root) {\n      throw new Error('No root element found');\n    }\n    const demoComponents = neededImports;\n    const DemoApp = getDemoApp(demoComponents);\n    const app = (\n      <ErrorCatcher>\n        <DemoWrapper {...demoWrapperProps}>\n          <DemoApp />\n        </DemoWrapper>\n      </ErrorCatcher>\n    );\n\n    ReactDOM.createRoot(root).render(\n      disableReactStrictMode ? app : <React.StrictMode>{app}</React.StrictMode>,\n    );\n  } catch (e) {\n    console.error(e);\n    // create html element with error message\n    const errorElement = document.createElement('div');\n    errorElement.innerHTML = `\n    <h1>Error</h1>\n    <p>${e.message}</p>\n  `;\n    document.body.appendChild(errorElement);\n  }\n}\n\ninit();\n"]}

package/dist/demo-wrapper.d.mts

@@ -1,7 +0,0 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import { D as DemoWrapperProps } from './types-CivTHEEo.mjs';
-import '@knapsack/types';
-
-declare const DemoWrapper: ({ children }: DemoWrapperProps) => react_jsx_runtime.JSX.Element;
-
-export { DemoWrapper as default };

package/dist/demo-wrapper.d.ts

@@ -1,7 +0,0 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import { D as DemoWrapperProps } from './types-CivTHEEo.js';
-import '@knapsack/types';
-
-declare const DemoWrapper: ({ children }: DemoWrapperProps) => react_jsx_runtime.JSX.Element;
-
-export { DemoWrapper as default };

package/dist/demo-wrapper.js

@@ -1,9 +0,0 @@
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-
-var o=Object.defineProperty;var e=(p,r)=>o(p,"name",{value:r,configurable:!0});var a=e(({children:p})=>jsxRuntime.jsx("div",{className:"demo-wrapper",children:p}),"DemoWrapper"),d=a;
-
-module.exports = d;
-//# sourceMappingURL=demo-wrapper.js.map
-//# sourceMappingURL=demo-wrapper.js.map

package/dist/demo-wrapper.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/demo-wrapper.tsx"],"names":["DemoWrapper","__name","children","jsx","demo_wrapper_default"],"mappings":";;;;AAGE,IAAA,CAAA,CAAA,MAAA,CAAA,cAAA,CAAA,IAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,GAAA,CAAA,CAAA,CAAA,CAAA,MAAA,CAAA,CAAA,KAAA,CAAA,CAAA,CAAA,YAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CADF,IAAMA,EAAcC,CAAA,CAAA,CAAC,CAAE,QAAAC,CAAAA,CAAS,CAC9BC,GAAAA,cAAAA,CAAC,OAAI,SAAU,CAAA,cAAA,CAAgB,SAAAD,CAAS,CAAA,CAAA,CADtB,eAIbE,CAAQJ,CAAAA","file":"demo-wrapper.js","sourcesContent":["import type { DemoWrapperProps } from './types';\n\nconst DemoWrapper = ({ children }: DemoWrapperProps) => (\n  <div className=\"demo-wrapper\">{children}</div>\n);\n\nexport default DemoWrapper;\n"]}

package/dist/demo-wrapper.mjs

@@ -1,7 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-
-var o=Object.defineProperty;var e=(p,r)=>o(p,"name",{value:r,configurable:!0});var a=e(({children:p})=>jsx("div",{className:"demo-wrapper",children:p}),"DemoWrapper"),d=a;
-
-export { d as default };
-//# sourceMappingURL=demo-wrapper.mjs.map
-//# sourceMappingURL=demo-wrapper.mjs.map

package/dist/demo-wrapper.mjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/demo-wrapper.tsx"],"names":["DemoWrapper","__name","children","jsx","demo_wrapper_default"],"mappings":";;AAGE,IAAA,CAAA,CAAA,MAAA,CAAA,cAAA,CAAA,IAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,GAAA,CAAA,CAAA,CAAA,CAAA,MAAA,CAAA,CAAA,KAAA,CAAA,CAAA,CAAA,YAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CADF,IAAMA,EAAcC,CAAA,CAAA,CAAC,CAAE,QAAAC,CAAAA,CAAS,CAC9BC,GAAAA,GAAAA,CAAC,OAAI,SAAU,CAAA,cAAA,CAAgB,SAAAD,CAAS,CAAA,CAAA,CADtB,eAIbE,CAAQJ,CAAAA","file":"demo-wrapper.mjs","sourcesContent":["import type { DemoWrapperProps } from './types';\n\nconst DemoWrapper = ({ children }: DemoWrapperProps) => (\n  <div className=\"demo-wrapper\">{children}</div>\n);\n\nexport default DemoWrapper;\n"]}

package/dist/error-catcher.d.mts

@@ -1,20 +0,0 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import * as React from 'react';
-
-type State = {
-    hasError: boolean;
-    componentStack?: string;
-    error?: Error;
-};
-declare class ErrorCatcher extends React.Component<{
-    children: React.ReactNode;
-}, State> {
-    constructor(props: any);
-    static getDerivedStateFromError(error: Error): {
-        hasError: boolean;
-    };
-    componentDidCatch(error: Error, errorInfo: React.ErrorInfo): void;
-    render(): string | number | boolean | Iterable<React.ReactNode> | react_jsx_runtime.JSX.Element;
-}
-
-export { ErrorCatcher as default };

package/dist/error-catcher.d.ts

@@ -1,20 +0,0 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import * as React from 'react';
-
-type State = {
-    hasError: boolean;
-    componentStack?: string;
-    error?: Error;
-};
-declare class ErrorCatcher extends React.Component<{
-    children: React.ReactNode;
-}, State> {
-    constructor(props: any);
-    static getDerivedStateFromError(error: Error): {
-        hasError: boolean;
-    };
-    componentDidCatch(error: Error, errorInfo: React.ErrorInfo): void;
-    render(): string | number | boolean | Iterable<React.ReactNode> | react_jsx_runtime.JSX.Element;
-}
-
-export { ErrorCatcher as default };

package/dist/error-catcher.js

@@ -1,30 +0,0 @@
-'use strict';
-
-var n = require('react');
-var jsxRuntime = require('react/jsx-runtime');
-
-function _interopNamespace(e) {
-	if (e && e.__esModule) return e;
-	var n = Object.create(null);
-	if (e) {
-		Object.keys(e).forEach(function (k) {
-			if (k !== 'default') {
-				var d = Object.getOwnPropertyDescriptor(e, k);
-				Object.defineProperty(n, k, d.get ? d : {
-					enumerable: true,
-					get: function () { return e[k]; }
-				});
-			}
-		});
-	}
-	n.default = e;
-	return Object.freeze(n);
-}
-
-var n__namespace = /*#__PURE__*/_interopNamespace(n);
-
-var d=Object.defineProperty;var a=(s,t)=>d(s,"name",{value:t,configurable:!0});var o=class extends n__namespace.Component{static{a(this,"ErrorCatcher");}constructor(t){super(t),this.state={hasError:!1,componentStack:"",error:null};}static getDerivedStateFromError(t){return {hasError:!0}}componentDidCatch(t,h){let{componentStack:i}=h;this.setState({error:t,componentStack:i});}render(){return this.state.hasError?jsxRuntime.jsxs("div",{style:{padding:"5px"},children:[jsxRuntime.jsx("h5",{children:"Error caught in React Components"}),this.state.error?.name&&jsxRuntime.jsxs("h5",{children:["Error Name: ",jsxRuntime.jsx("code",{children:this.state.error?.name})]}),this.state.error?.message&&jsxRuntime.jsxs("h5",{children:["Message:",this.state.error?.message]}),this.state.componentStack&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("h6",{children:"Component Stack:"}),jsxRuntime.jsx("pre",{children:jsxRuntime.jsx("code",{children:this.state.componentStack})}),jsxRuntime.jsx("br",{})]}),this.state.error?.stack&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("h6",{children:"Error Stack:"}),jsxRuntime.jsx("pre",{children:jsxRuntime.jsx("code",{children:this.state.error?.stack})})]})]}):this.props.children}};
-
-module.exports = o;
-//# sourceMappingURL=error-catcher.js.map
-//# sourceMappingURL=error-catcher.js.map

package/dist/error-catcher.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/error-catcher.tsx"],"names":["ErrorCatcher","n","__name","props","error","errorInfo","componentStack","jsxs","jsx","Fragment"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA,IAAA,CAAA,CAAA,MAAA,CAAA,cAAA,CAAA,IAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,GAAA,CAAA,CAAA,CAAA,CAAA,MAAA,CAAA,CAAA,KAAA,CAAA,CAAA,CAAA,YAAA,CAAA,CAAA,CAAA,CAAA,CAAA,KAQqBA,CAArB,CAAA,cAAgDC,sBAG9C,CAXF,OAWEC,CAAA,CAAA,IAAA,CAAA,cAAA,EAAA,CACA,WAAYC,CAAAA,CAAAA,CAAO,CACjB,KAAMA,CAAAA,CAAK,CACX,CAAA,IAAA,CAAK,MAAQ,CACX,QAAA,CAAU,CACV,CAAA,CAAA,cAAA,CAAgB,GAChB,KAAO,CAAA,IACT,EACF,CAEA,OAAO,yBAAyBC,CAAc,CAAA,CAE5C,OAAO,CACL,SAAU,CACZ,CAAA,CACF,CAES,iBAAA,CAAkBA,EAAcC,CAAkC,CAAA,CACzE,GAAM,CAAE,eAAAC,CAAe,CAAA,CAAID,EAC3B,IAAK,CAAA,QAAA,CAAS,CACZ,KAAAD,CAAAA,CAAAA,CACA,cAAAE,CAAAA,CACF,CAAC,EACH,CAES,MAAS,EAAA,CAChB,OAAI,IAAK,CAAA,KAAA,CAAM,QAEXC,CAAAA,eAAAA,CAAC,OACC,KAAO,CAAA,CACL,QAAS,KACX,CAAA,CAEA,UAAAC,cAAC,CAAA,IAAA,CAAA,CAAG,QAAgC,CAAA,kCAAA,CAAA,CAAA,CACnC,KAAK,KAAM,CAAA,KAAA,EAAO,IACjBD,EAAAA,eAAAA,CAAC,MAAG,QACUC,CAAAA,CAAAA,cAAAA,CAAAA,cAAAA,CAAC,MAAM,CAAA,CAAA,QAAA,CAAA,IAAA,CAAK,MAAM,KAAO,EAAA,IAAA,CAAK,GAC5C,CAED,CAAA,IAAA,CAAK,MAAM,KAAO,EAAA,OAAA,EACjBD,eAAC,CAAA,IAAA,CAAA,CAAG,qBAED,IAAK,CAAA,KAAA,CAAM,KAAO,EAAA,OAAA,CAAA,CACrB,EAED,IAAK,CAAA,KAAA,CAAM,cACVA,EAAAA,eAAAA,CAAAE,oBAAA,CACE,QAAA,CAAA,CAAAD,eAAC,IAAG,CAAA,CAAA,QAAA,CAAA,kBAAA,CAAgB,EACpBA,cAAC,CAAA,KAAA,CAAA,CACC,QAAAA,CAAAA,cAAAA,CAAC,QAAM,QAAK,CAAA,IAAA,CAAA,KAAA,CAAM,cAAe,CAAA,CAAA,CACnC,EACAA,cAAC,CAAA,IAAA,CAAA,EAAG,CACN,CAAA,CAAA,CAAA,CAED,KAAK,KAAM,CAAA,KAAA,EAAO,OACjBD,eAAAE,CAAAA,mBAAAA,CAAA,CACE,QAAAD,CAAAA,CAAAA,cAAAA,CAAC,IAAG,CAAA,CAAA,QAAA,CAAA,cAAA,CAAY,EAChBA,cAAC,CAAA,KAAA,CAAA,CACC,QAAAA,CAAAA,cAAAA,CAAC,QAAM,QAAK,CAAA,IAAA,CAAA,KAAA,CAAM,KAAO,EAAA,KAAA,CAAM,EACjC,CACF,CAAA,CAAA,CAAA,CAAA,CAEJ,EAIG,IAAK,CAAA,KAAA,CAAM,QACpB,CACF","file":"error-catcher.js","sourcesContent":["import * as React from 'react';\n\ntype State = {\n  hasError: boolean;\n  componentStack?: string;\n  error?: Error;\n};\n\nexport default class ErrorCatcher extends React.Component<\n  { children: React.ReactNode },\n  State\n> {\n  constructor(props) {\n    super(props);\n    this.state = {\n      hasError: false,\n      componentStack: '',\n      error: null,\n    };\n  }\n\n  static getDerivedStateFromError(error: Error) {\n    // Update state so the next render will show the fallback UI.\n    return {\n      hasError: true,\n    };\n  }\n\n  override componentDidCatch(error: Error, errorInfo: React.ErrorInfo): void {\n    const { componentStack } = errorInfo;\n    this.setState({\n      error,\n      componentStack,\n    });\n  }\n\n  override render() {\n    if (this.state.hasError) {\n      return (\n        <div\n          style={{\n            padding: '5px',\n          }}\n        >\n          <h5>Error caught in React Components</h5>\n          {this.state.error?.name && (\n            <h5>\n              Error Name: <code>{this.state.error?.name}</code>\n            </h5>\n          )}\n          {this.state.error?.message && (\n            <h5>\n              Message:\n              {this.state.error?.message}\n            </h5>\n          )}\n          {this.state.componentStack && (\n            <>\n              <h6>Component Stack:</h6>\n              <pre>\n                <code>{this.state.componentStack}</code>\n              </pre>\n              <br />\n            </>\n          )}\n          {this.state.error?.stack && (\n            <>\n              <h6>Error Stack:</h6>\n              <pre>\n                <code>{this.state.error?.stack}</code>\n              </pre>\n            </>\n          )}\n        </div>\n      );\n    }\n\n    return this.props.children;\n  }\n}\n"]}

package/dist/error-catcher.mjs

@@ -1,8 +0,0 @@
-import * as n from 'react';
-import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
-
-var d=Object.defineProperty;var a=(s,t)=>d(s,"name",{value:t,configurable:!0});var o=class extends n.Component{static{a(this,"ErrorCatcher");}constructor(t){super(t),this.state={hasError:!1,componentStack:"",error:null};}static getDerivedStateFromError(t){return {hasError:!0}}componentDidCatch(t,h){let{componentStack:i}=h;this.setState({error:t,componentStack:i});}render(){return this.state.hasError?jsxs("div",{style:{padding:"5px"},children:[jsx("h5",{children:"Error caught in React Components"}),this.state.error?.name&&jsxs("h5",{children:["Error Name: ",jsx("code",{children:this.state.error?.name})]}),this.state.error?.message&&jsxs("h5",{children:["Message:",this.state.error?.message]}),this.state.componentStack&&jsxs(Fragment,{children:[jsx("h6",{children:"Component Stack:"}),jsx("pre",{children:jsx("code",{children:this.state.componentStack})}),jsx("br",{})]}),this.state.error?.stack&&jsxs(Fragment,{children:[jsx("h6",{children:"Error Stack:"}),jsx("pre",{children:jsx("code",{children:this.state.error?.stack})})]})]}):this.props.children}};
-
-export { o as default };
-//# sourceMappingURL=error-catcher.mjs.map
-//# sourceMappingURL=error-catcher.mjs.map

package/dist/error-catcher.mjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/error-catcher.tsx"],"names":["ErrorCatcher","__name","props","error","errorInfo","componentStack","jsxs","jsx","Fragment"],"mappings":";;;AAAA,IAAA,CAAA,CAAA,MAAA,CAAA,cAAA,CAAA,IAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,GAAA,CAAA,CAAA,CAAA,CAAA,MAAA,CAAA,CAAA,KAAA,CAAA,CAAA,CAAA,YAAA,CAAA,CAAA,CAAA,CAAA,CAAA,KAQqBA,CAArB,CAAA,cAAgD,WAG9C,CAXF,OAWEC,CAAA,CAAA,IAAA,CAAA,cAAA,EAAA,CACA,WAAYC,CAAAA,CAAAA,CAAO,CACjB,KAAMA,CAAAA,CAAK,CACX,CAAA,IAAA,CAAK,MAAQ,CACX,QAAA,CAAU,CACV,CAAA,CAAA,cAAA,CAAgB,GAChB,KAAO,CAAA,IACT,EACF,CAEA,OAAO,yBAAyBC,CAAc,CAAA,CAE5C,OAAO,CACL,SAAU,CACZ,CAAA,CACF,CAES,iBAAA,CAAkBA,EAAcC,CAAkC,CAAA,CACzE,GAAM,CAAE,eAAAC,CAAe,CAAA,CAAID,EAC3B,IAAK,CAAA,QAAA,CAAS,CACZ,KAAAD,CAAAA,CAAAA,CACA,cAAAE,CAAAA,CACF,CAAC,EACH,CAES,MAAS,EAAA,CAChB,OAAI,IAAK,CAAA,KAAA,CAAM,QAEXC,CAAAA,IAAAA,CAAC,OACC,KAAO,CAAA,CACL,QAAS,KACX,CAAA,CAEA,UAAAC,GAAC,CAAA,IAAA,CAAA,CAAG,QAAgC,CAAA,kCAAA,CAAA,CAAA,CACnC,KAAK,KAAM,CAAA,KAAA,EAAO,IACjBD,EAAAA,IAAAA,CAAC,MAAG,QACUC,CAAAA,CAAAA,cAAAA,CAAAA,GAAAA,CAAC,MAAM,CAAA,CAAA,QAAA,CAAA,IAAA,CAAK,MAAM,KAAO,EAAA,IAAA,CAAK,GAC5C,CAED,CAAA,IAAA,CAAK,MAAM,KAAO,EAAA,OAAA,EACjBD,IAAC,CAAA,IAAA,CAAA,CAAG,qBAED,IAAK,CAAA,KAAA,CAAM,KAAO,EAAA,OAAA,CAAA,CACrB,EAED,IAAK,CAAA,KAAA,CAAM,cACVA,EAAAA,IAAAA,CAAAE,SAAA,CACE,QAAA,CAAA,CAAAD,IAAC,IAAG,CAAA,CAAA,QAAA,CAAA,kBAAA,CAAgB,EACpBA,GAAC,CAAA,KAAA,CAAA,CACC,QAAAA,CAAAA,GAAAA,CAAC,QAAM,QAAK,CAAA,IAAA,CAAA,KAAA,CAAM,cAAe,CAAA,CAAA,CACnC,EACAA,GAAC,CAAA,IAAA,CAAA,EAAG,CACN,CAAA,CAAA,CAAA,CAED,KAAK,KAAM,CAAA,KAAA,EAAO,OACjBD,IAAAE,CAAAA,QAAAA,CAAA,CACE,QAAAD,CAAAA,CAAAA,GAAAA,CAAC,IAAG,CAAA,CAAA,QAAA,CAAA,cAAA,CAAY,EAChBA,GAAC,CAAA,KAAA,CAAA,CACC,QAAAA,CAAAA,GAAAA,CAAC,QAAM,QAAK,CAAA,IAAA,CAAA,KAAA,CAAM,KAAO,EAAA,KAAA,CAAM,EACjC,CACF,CAAA,CAAA,CAAA,CAAA,CAEJ,EAIG,IAAK,CAAA,KAAA,CAAM,QACpB,CACF","file":"error-catcher.mjs","sourcesContent":["import * as React from 'react';\n\ntype State = {\n  hasError: boolean;\n  componentStack?: string;\n  error?: Error;\n};\n\nexport default class ErrorCatcher extends React.Component<\n  { children: React.ReactNode },\n  State\n> {\n  constructor(props) {\n    super(props);\n    this.state = {\n      hasError: false,\n      componentStack: '',\n      error: null,\n    };\n  }\n\n  static getDerivedStateFromError(error: Error) {\n    // Update state so the next render will show the fallback UI.\n    return {\n      hasError: true,\n    };\n  }\n\n  override componentDidCatch(error: Error, errorInfo: React.ErrorInfo): void {\n    const { componentStack } = errorInfo;\n    this.setState({\n      error,\n      componentStack,\n    });\n  }\n\n  override render() {\n    if (this.state.hasError) {\n      return (\n        <div\n          style={{\n            padding: '5px',\n          }}\n        >\n          <h5>Error caught in React Components</h5>\n          {this.state.error?.name && (\n            <h5>\n              Error Name: <code>{this.state.error?.name}</code>\n            </h5>\n          )}\n          {this.state.error?.message && (\n            <h5>\n              Message:\n              {this.state.error?.message}\n            </h5>\n          )}\n          {this.state.componentStack && (\n            <>\n              <h6>Component Stack:</h6>\n              <pre>\n                <code>{this.state.componentStack}</code>\n              </pre>\n              <br />\n            </>\n          )}\n          {this.state.error?.stack && (\n            <>\n              <h6>Error Stack:</h6>\n              <pre>\n                <code>{this.state.error?.stack}</code>\n              </pre>\n            </>\n          )}\n        </div>\n      );\n    }\n\n    return this.props.children;\n  }\n}\n"]}

package/dist/index.mjs

@@ -1,47 +0,0 @@
-import ke from 'sleep-promise';
-import { RendererWebpackBase, convertImportMapToNeededImportsByCodeSrcId } from '@knapsack/renderer-webpack-base';
-import { makeShortId, pascalCase, isFirstLetterCapital, removeWrappingDoubleQuotes } from '@knapsack/utils';
-import { log, knapsackEvents } from '@knapsack/app';
-import { babelCodeForBrowser, createSlotOptionsHtmlTags } from '@knapsack/app/renderers';
-import { rendererIds, isNumberProp, isOptionsProp } from '@knapsack/types';
-import { findUpPkgJson, exists, formatCode, getJsExportNames, readFile, findUp, resolvePath, getModulePkgJson, copy } from '@knapsack/file-utils';
-import g, { join, parse, relative } from 'path';
-import { createCreator, tasks } from '@knapsack/creator-utils';
-import { readKsPatternConfigs, writeDemo, writeKsPatternConfig, readKsNavConfig, addKsNavItems } from '@knapsack/ks-file-utils';
-
-var Y=Object.defineProperty;var l=(s,t)=>Y(s,"name",{value:t,configurable:!0}),D=(s=>typeof require<"u"?require:typeof Proxy<"u"?new Proxy(s,{get:(t,e)=>(typeof require<"u"?require:t)[e]}):s)(function(s){if(typeof require<"u")return require.apply(this,arguments);throw Error('Dynamic require of "'+s+'" is not supported')});function se({templateName:s,attributes:t,children:e}){return `
-    <${s}
-      ${t}
-      ${e?`>
-        ${e}
-      </${s}>`:"/>"}
-  `}l(se,"renderUsageTemplate");var E="DemoApp";function ae({imports:s="",children:t}){return `${s}
-
-function ${E}() {
-  return (
-    ${t}
-  )
-}
-`}l(ae,"renderDemoAppTemplate");async function O(s){let t=Object.keys(s.props||{}).map(a=>{let o=s.props[a];return {key:a,value:o}}),{templateName:e,children:r,extraProps:n=[]}=s;if(!e)throw new Error('Cannot getUsage of a React Component when no "templateName" is provided.');let i=t.map(({key:a,value:o})=>{switch(typeof o){case"string":return o.startsWith("(")&&o.includes("=>")?`${a}={${o}}`:`${a}="${o}"`;case"boolean":return o?`${a}`:`${a}={${o}}`;default:return `${a}={${JSON.stringify(o)}}`}}),p=[],u={};n.forEach(({key:a,value:o})=>{u[a]=u[a]??[],u[a].push(o);}),Object.entries(u).forEach(([a,o])=>{let d=o.length===1?o[0]:`<>${o.join(`
-`)}</>`;p.push(`${a}={${d}}`);});let c=se({templateName:e,attributes:[...i,...p].join(" "),children:r});return s.format?formatCode({contents:c,path:"x.tsx"}).then(a=>a.trim()).catch(()=>c.trim()):c.trim()}l(O,"getUsage");async function v({children:s,imports:t,format:e}){let r=ae({children:s,imports:t});return e?formatCode({contents:r,path:"x.tsx"}):r}l(v,"getDemoAppUsage");async function J({src:s}){let t=await findUp("tsconfig.json",{cwd:g.dirname(s)}),e=await import('react-docgen-typescript'),r={shouldExtractLiteralValuesFromEnum:!0,savePropValueAsString:!0,skipChildrenPropWithoutDoc:!1,customComponentTypes:["VoidFunctionComponent","VFC"]};return {info:(t?e.withCustomConfig(t,r).parse:e.withDefaultConfig(r).parse)(s)}}l(J,"getTypeScriptInfoFromFile");function ne({info:s,exportName:t}){try{if(!s)return !1;let e={props:{$schema:"http://json-schema.org/draft-07/schema",type:"object",required:[],properties:{}},slots:{}},n=!t||t==="default"?s.pop():s.find(p=>p.displayName===t);if(!n)return !1;return Object.entries(n?.props||{}).forEach(([p,u])=>{let{name:c,description:a,defaultValue:o,required:d,type:f,parent:y}=u;switch(f?.name?.replace("| undefined","").replace(/<.*/g,"").trim()){case"string":e.props.properties[p]={type:"string"};break;case"number":e.props.properties[p]={type:"number"};break;case"boolean":case"bool":o&&"value"in o&&(o.value=o.value==="true"),e.props.properties[p]={type:"boolean"};break;case"enum":e.props.properties[p]={type:"string",enum:[...new Set(f.value.map(({value:h})=>removeWrappingDoubleQuotes(h?.trim())).filter(Boolean))]};break;case"ReactNode":case"React.ReactNode":case"React.ReactElement":case"ReactElement":e.slots[p]={title:p},a&&(e.slots[p]={...e.slots[p],description:a});break;case"VFC":case"FC":e.slots[p]={title:p,description:a||"A reference to a component",isTemplateReference:!0,allowOnlyOne:!0,disallowText:!0};break;default:if(f?.name?.startsWith("("))e.props.properties[p]={typeof:"function",tsType:u?.type?.name};else if(f?.name?.includes("|")){let h=f.name.split("|").map(R=>removeWrappingDoubleQuotes(R.trim())).filter(Boolean);h?.length&&(e.props.properties[p]={type:"string",enum:[...new Set(h)]});}else e.props.properties[p]={tsType:u?.type?.name};}e.props.properties[p]&&(d&&e.props.required.push(p),a&&!e.props.properties[p].description&&(e.props.properties[p].description=a),o&&"value"in o&&(isNumberProp(e.props.properties[p])?e.props.properties[p].default=parseFloat(o.value):e.props.properties[p].default=removeWrappingDoubleQuotes(o.value)));}),e}catch(e){return log.verbose("Could not infer spec from React TypeScript file",{exportName:t,error:e},"react renderer"),!1}}l(ne,"extractSpecFromTypeScriptInfo");async function oe({src:s}){let t=await import('react-docgen'),{builtinResolvers:e}=t,r=await readFile(s),{FindExportedDefinitionsResolver:n}=e;return {info:t.parse(r,{resolver:new n,handlers:null,filename:s})}}l(oe,"getPropTypesInfoFromFile");function ie({info:s,exportName:t}){try{let r=!t||t==="default"?s.pop():s.find(i=>i.displayName===t),n={isInferred:!0,props:{$schema:"http://json-schema.org/draft-07/schema",type:"object",required:[],properties:{}},slots:{}};return Object.entries(r?.props||{}).forEach(([i,p])=>{let{required:u,description:c,defaultValue:a}=p;switch(p?.type?.name){case"string":n.props.properties[i]={type:"string"};break;case"func":n.props.properties[i]={type:"string"};break;case"bool":n.props.properties[i]={type:"boolean"};break;case"node":n.slots[i]={title:i,description:c};}n.props.properties[i]&&(u&&n.props.required.push(i),c&&!n.props.properties[i].description&&(n.props.properties[i].description=c),a&&"value"in a&&(n.props.properties[i].default=typeof a.value=="string"?removeWrappingDoubleQuotes(a.value):a.value));}),n}catch(e){return log.verbose("Could not infer spec from React PropTypes",{exportName:t,error:e},"react renderer"),!1}}l(ie,"extractSpecFromPropTypesInfo");function pe({spec:s}){return s===!1||Object.entries(s?.props?.properties||{}).forEach(([t,e])=>{isOptionsProp(e)&&(e.enum.includes(e.default)||(e.default=void 0));}),s}l(pe,"cleanUpSpec");async function ce({src:s,resolveFromDir:t}){let e=await resolvePath({path:s,resolveFromDir:t,resolveType:"types"});if(e.exists){let i=await J({src:e.absolutePath});if(i)return {type:"typescript",info:i.info}}let r=await resolvePath({path:s,resolveFromDir:t});if(!r.exists)return {type:"unknown"};let{ext:n}=g.parse(r.absolutePath);switch(n){case".jsx":return {type:"propTypes",info:(await oe({src:r.absolutePath})).info};case".ts":case".tsx":return {type:"typescript",info:(await J({src:r.absolutePath})).info};default:return {type:"unknown"}}}l(ce,"getReactModuleInfoUncached");var S=new Map,q=l(()=>{log.info("Clearing React TypeScript inferSpec cache..."),S.clear();},"clearInferSpecCache");async function le(s){let t=JSON.stringify(s);return S.has(t)||S.set(t,ce(s)),S.get(t)}l(le,"getReactModuleInfo");async function de({src:s,exportName:t,resolveFromDir:e}){let r=await le({src:s,resolveFromDir:e});switch(r.type){case"typescript":return ne({info:r.info,exportName:t});case"propTypes":return ie({info:r.info,exportName:t});case"unknown":default:return !1}}l(de,"getReactSpec");async function B(s){return pe({spec:await de(s)})}l(B,"getReactDocs");async function _(s,t){try{let{version:e}=getModulePkgJson("react"),{version:r}=getModulePkgJson("react-dom"),n=g.dirname(D.resolve("react",{paths:[process.cwd()]})),i=g.dirname(D.resolve("react-dom",{paths:[process.cwd()]}));await Promise.all([copy(g.join(n,"umd/react.development.js"),g.join(s,`react.development.${e}.js`)),copy(g.join(n,"umd/react.production.min.js"),g.join(s,`react.production.min.${e}.js`)),copy(g.join(i,"umd/react-dom.production.min.js"),g.join(s,`react-dom.production.min.${r}.js`)),copy(g.join(i,"umd/react-dom.development.js"),g.join(s,`react-dom.development.${r}.js`))]);let p=process.env.NODE_ENV==="production"?"production.min":"development";return [g.join(t,`react.${p}.${e}.js`),g.join(t,`react-dom.${p}.${r}.js`)]}catch(e){log.warn('Error trying to copy "react" and "react-dom" JS files, are they installed? We want to use your exact versions.',e,"templateRenderer:react"),process.exit(1);}}l(_,"copyReactAssets");function Re(s){return s.toUpperCase()===s}l(Re,"isCapitalLetter");function be(s){return Re(s[0])}l(be,"startsWithCapitalLetter");function Te({importName:s,id:t,title:e=s,pkgPath:r,initialDemoId:n}){return {id:t,title:e,description:"",statuses:{main:"ready"},templates:[{id:"react",title:"react",path:r,alias:s,templateLanguageId:"react",spec:{isInferred:!0},demoIds:[n],blockIds:[]}],tabs:[{type:"template",id:"react"}],subPages:[]}}l(Te,"createPatternData");var N=createCreator({id:"react-patterns",title:"React Ks Patterns",description:"Adds React templates as Knapsack Patterns",getQuestions:l(async()=>({pkgPath:{type:"text",title:"Package path"},importPrefix:{type:"text",title:"Import Prefix to Remove"}}),"getQuestions"),getTasks:l(async({answers:{pkgPath:s,importPrefix:t=""},config:e})=>{let r=e.dest,i=(await readKsPatternConfigs({dataDir:r})).reduce((u,c)=>{let a=c.templates?.filter(o=>o.templateLanguageId==="react")??[];return u.push(...a.map(o=>o.alias)),u},[]),{exports:p}=await getJsExportNames({path:s});return [{title:"Pick Imports to add",task:l((u,c)=>tasks.runSubCreator({task:c,config:e,creator:createCreator({id:"react-pattern-import-names",getQuestions:l(async()=>({importNames:{type:"choices",choices:p.filter(a=>be(a)&&!i.includes(a)).map(a=>({value:a}))}}),"getQuestions"),getTasks:l(async({answers:{importNames:a}})=>{let o=a.map(d=>({importName:d,patternId:d.startsWith(t)?d.slice(t.length).toLowerCase():d.toLowerCase()}));return [...o.map(({importName:d,patternId:f})=>({title:`Add ${d} React Template`,task:l(async(y,b)=>{let h={type:"data",id:makeShortId(),title:"Main",patternId:f,templateId:"react",data:{props:{},slots:{}}},R=Te({id:f,importName:d,pkgPath:s,initialDemoId:h.id});await Promise.all([writeDemo({dataDir:r,demo:h}),writeKsPatternConfig({dataDir:r,patternId:f,data:R})]);},"task")})),{title:"Updating Nav",task:l(async(d,f)=>{let{byId:y}=await readKsNavConfig({dataDir:r}),b=Object.values(y).find(({path:h,name:R,id:X})=>h?!1:R.toLowerCase()==="patterns"||R.toLowerCase()==="components");await addKsNavItems({dataDir:r,navItems:o.map(({patternId:h})=>({navId:h,navPath:`/pattern/${h}`,navParent:b?.id||"root"}))});},"task")}]},"getTasks")})}),"task")}]},"getTasks")});var G="ks-react-meta";var{pkg:I}=findUpPkgJson(__dirname);log.setupUpdateNotifier({...I,name:I.name,version:I.version});var A=join(__dirname,"./error-catcher.mjs");if(!exists(A))throw new Error(`Could not find error catcher at: ${A}`);var H=class s extends RendererWebpackBase{static{l(this,"KnapsackReactRenderer");}assets;babelConfig;#e;#t;constructor({webpackConfig:t,demoWrapperPath:e=join(__dirname,"./demo-wrapper.mjs"),id:r=rendererIds.react,disableReactStrictMode:n}={}){super({id:r,language:"jsx",webpackConfig:t,extraScripts:["@knapsack/renderer-react/client"]}),this.language="jsx",this.assets=[],this.#e=e,this.#t=n,this.creators=[N];}setConfig=l(t=>{super.setConfig(t);let{absolutePath:e,exists:r,type:n}=this.resolvePathSync({path:this.#e,resolveFromDir:this.userConfigDir});if(!r)throw new Error(`Could not find demo wrapper at: "${this.#e}"
-Please adjust setting in "knapsack.config.js" or pass a different path when creating the React Renderer.`);this.registerExtraJsImports({DemoWrapper:{exportName:"DemoWrapper",isDefaultExport:!0,path:n==="package"?this.#e:e},ErrorCatcher:{exportName:"ErrorCatcher",isDefaultExport:!0,path:A}});},"setConfig");init=l(async()=>{this.assets=await _(this.outputDir,this.publicPath);},"init");hydrate=l(async t=>{await super.hydrate(t),await this.init({missingFileVerbosity:"silent"});},"hydrate");getMeta=l(()=>({id:this.id,title:"React",aliasUse:"optional",aliasTitle:"Named Export",aliasIsJsNamedExport:!0,aliasDescription:"If `export X` was used instead of `export default`, then provide X.",enableDataDemos:!0,enableTemplateDemos:!0,hasSlotsSupport:!0,hasSlotOptionsSupport:!0,version:I.version,hasInferSpecSupport:!0,syntaxHighlightingLanguage:"jsx",hasTemplateSuggestionsSupport:!0,prototypingTemplate:{path:"@knapsack/renderer-react/prototype-template",spec:{isInferred:!1,props:{type:"object",properties:{}},slots:{children:{title:"Children"}}}}}),"getMeta");changeCase=l(t=>pascalCase(t),"changeCase");createWebpackConfig=l(()=>{let t=super.createWebpackConfig();return t.externals={react:"React","react-dom":"ReactDOM"},t},"createWebpackConfig");async prepClientRenderResults({usage:t,demoApp:e,importMap:r,renderOptions:{demo:n,state:i,patternId:p,templateId:u}}){let c={demo:n,disableReactStrictMode:this.#t,neededImportsByCodeSrcId:convertImportMapToNeededImportsByCodeSrcId(r),demoWrapperProps:{patternId:p,templateId:u,demo:n}},a=`
-    window.knapsack = window.knapsack || {};
-    window.knapsack.getDemoApp = ({ ${[...r.keys()].join(", ")} }) => {
-      ${e}
-      return ${E}
-    }
-    `,o="";try{a=await babelCodeForBrowser({code:a});}catch(f){console.log(a),console.log("---original code before babel error ^---"),console.trace(f.message),a=`console.error(${JSON.stringify(f.message)});`,o=`<pre><code>${f.message}</code></pre>`;}let d=`
-    <script type="application/json" id="${G}">${JSON.stringify(c)}</script>
-    <script type="application/javascript">${a}</script>
-    <div id="render-root" class="knapsack-pattern-direct-parent" data-dev-note="Knapsack React Template Wrapper"></div>
-    ${this.assets.map(f=>`<script src="${f}"></script>`).join(`
-`)}
-    ${RendererWebpackBase.createHtmlTagsForAssetPaths({assets:this.getWebpackAssetPaths(),scriptTagsAreAsync:!1})}
-    ${o}
-    `;return {ok:!o,html:await formatCode({contents:d,path:"x.html"}),usage:t,templateLanguage:this.language}}render=l(async t=>{if(t.demo?.type==="template"){let e=[5,10,20,50,100,1e3,1e3],r,n=0;for(;;)try{let{absolutePath:o,exists:d}=await this.resolvePath(t.demo.templateInfo.path);if(!d)throw new Error(`Template demo file does not exist: ${o}`);r=o;break}catch(o){let d=e[n];if(!d)throw new Error(o);n+=1,await ke(d);}let[i,{usage:p,importMap:u}]=await Promise.all([readFile(r),this.getUsageAndImports({...t,importMap:new Map})]),c=await v({children:p});return await this.prepClientRenderResults({usage:i,demoApp:c,renderOptions:t,importMap:u})}if(t.demo?.type==="data"){let{usage:e,importMap:r}=await this.getUsageAndImports({...t,importMap:new Map}),n=RendererWebpackBase.createJsImportCodeBlock({importMap:r}),[i,p]=await Promise.all([v({children:e,imports:n,format:!0}),v({children:e})]);return this.prepClientRenderResults({demoApp:p,usage:i,renderOptions:t,importMap:r})}},"render");getUsageAndImports=l(async({patternId:t,templateId:e,demo:r,state:n,importMap:i})=>{if(!r)throw new Error(`No demo provided while rendering ${t} ${e}`);let p=n.patterns[t];if(!p)throw new Error(`Could not find pattern: ${t}`);if(r.type==="data"){let c=p.templates.find(R=>R.id===e);if(!c)throw new Error(`Could not find template: ${e}`);let{data:{props:a,slots:o,slotsOptionsComputed:d}}=r,{name:f}=await this.addUniqueValueToImportMap({importMap:i,path:c.path,alias:c.alias||"default"}),y=[],b=[];if(o){let R=Object.keys(o);(await Promise.all(R.map(async w=>{let T=o[w],j=await Promise.all(T.filter(m=>!(!m||m.type!=="text"&&(!m.patternId||!m.templateId||m.type==="template-demo"&&!m.demoId))).map(async m=>{if(m.type==="text")return T.length===1&&w!=="children"?`\`${m.text}\``:m.text;if(m.type==="template-reference"){let P=n.patterns[m.patternId]?.templates.find(z=>z.id===m.templateId);if(!P)throw new Error(`Could not find slotted template: ${m.patternId} ${m.templateId}`);return (await this.addUniqueValueToImportMap({importMap:i,path:P.path,alias:P.alias||"default"})).name}if(m.type==="template-demo"){let P=m.demo;if(!P)throw new Error(`Could not find slotted template demo ${JSON.stringify(m)}`);let{usage:K}=await this.getUsageAndImports({patternId:P.patternId,templateId:P.templateId,demo:P,state:n,importMap:i});return K}throw new Error(`Unknown slot item: ${JSON.stringify(m)}`)}));return {slotName:w,slotItemsUsages:j}}))).forEach(({slotName:w,slotItemsUsages:T})=>{let j=d?.[w],{openTag:m,closeTag:k}=createSlotOptionsHtmlTags({slotOptionsComputed:j,classAttributeName:"className",stylesValueType:"object"});m&&(w==="children"?y.push(m):b.push({key:w,value:m})),T.forEach(P=>{w==="children"?y.push(P):b.push({key:w,value:P});}),k&&(w==="children"?y.push(k):b.push({key:w,value:k}));});}return {usage:await O({templateName:f,props:a,children:y.join(`
-`),extraProps:b}),importMap:i}}if(r.type==="template"){let{templateInfo:c}=r,{name:a}=await this.addUniqueValueToImportMap({importMap:i,path:c.path,alias:c.alias||"default"});return {usage:await O({templateName:a}),importMap:i}}throw new Error(`Unhandled demo type for ${t}-${e}: ${JSON.stringify(r)}`)},"getUsageAndImports");inferSpec=l(async({template:t,templatePath:e})=>{let r=await B({src:t.path,exportName:t.alias||"default",resolveFromDir:this.config.data});if(r!==!1){let n=Object.keys(r?.props?.properties||{}).length,i=Object.keys(r?.slots||{}).length;if(n===0&&i===0)return !1}return r},"inferSpec");watch=l(async()=>{super.watch(),knapsackEvents.onPatternTemplateChanged(()=>{q();});},"watch");getTemplateMeta=l(async({pattern:t,template:e})=>{let r=[];if(e?.spec?.props){let n=JSON.parse(JSON.stringify(e.spec.props));e?.spec?.slots&&Object.entries(e.spec.slots).forEach(([p,u])=>{n.properties[p]={typeof:"function",tsType:"React.ReactNode",description:u.allowedPatternIds?`${u.description}. Only use: ${u.allowedPatternIds.join(", ")}`:u.description},n.required=n.required??[],u.isRequired&&n.required.push(p);});let i=await s.convertSchemaToTypeScriptDefs({schema:n,title:`${this.changeCase(t.id)}Props`,description:`[Knapsack Docs](http://localhost:3999/pattern/${t.id}/${e.id})`,patternId:t.id,templateId:e.id,postBanner:"import * as React from 'react';"});r.push({contents:i,encoding:"utf8",path:`${t.id}.${e.id}.spec.d.ts`}),r.push({contents:JSON.stringify(n,null,"  "),encoding:"utf8",path:`${t.id}.${e.id}.spec.json`});}return r},"getTemplateMeta");alterTemplateMetaFiles=l(async({files:t,metaDir:e})=>{let r=[],n=".spec.d.ts";return t.forEach(i=>{if(i.path.endsWith(n)){let{base:p}=parse(i.path),[u,c]=p.split("."),a=c===this.id,o=this.changeCase(`${u}Props`),d=this.changeCase(`${u}-${c}Props`);r.push(`export { ${a?o:`${o} as ${d}`} } from './${relative(e,i.path).replace(".d.ts","")}';`);}}),r.push(""),[...t,{contents:r.join(`
-`),encoding:"utf8",path:join(e,"react.d.ts")}]},"alterTemplateMetaFiles");getTemplateSuggestions=l(async({newPath:t,state:e})=>{let r=Object.values(e.patterns).reduce((c,{templateDemos:a,templates:o})=>(o.forEach(({path:d,alias:f,templateLanguageId:y})=>{y===this.id&&c.push({path:d,alias:f});}),a.forEach(({templateInfo:{path:d,alias:f},templateLanguageId:y})=>{y===this.id&&c.push({path:d,alias:f});}),c),[]),n=new Set(this.getCodeSrcs().map(({path:c})=>c)),i=[...new Set([t,...Object.keys(this.pkgPathAliases||{}),...n])];return {suggestions:(await Promise.all(i.map(async c=>{if(!c)return [];try{let{exports:a,errorMsg:o}=await getJsExportNames({path:c,resolveFromDir:this.dataDir,pkgPathAliases:this.pkgPathAliases});if(o)throw new Error(o);return a.filter(d=>d==="default"||isFirstLetterCapital(d)).map(d=>({alias:d,path:c}))}catch(a){return log.verbose(`Error getting import names for ${c}: ${a.message}`,null,this.logPrefix),[]}})).then(c=>c.flat())).filter(c=>!r.find(a=>a.alias===c.alias&&a.path===c.path))}},"getTemplateSuggestions")};
-
-export { H as KnapsackReactRenderer };
-//# sourceMappingURL=index.mjs.map
-//# sourceMappingURL=index.mjs.map