oc-template-preact-compiler 0.2.0 → 0.3.0-beta.1

package/dist/index.d.ts

@@ -0,0 +1,2 @@
+export * from './lib/compile';
+export * from 'oc-template-preact';

package/dist/index.js

@@ -0,0 +1,18 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./lib/compile"), exports);
+__exportStar(require("oc-template-preact"), exports);

package/dist/lib/compile.d.ts

@@ -0,0 +1,3 @@
+import { createCompile } from 'oc-generic-template-compiler';
+export type CompilerOptions = ReturnType<typeof createCompile>;
+export declare const compile: CompilerOptions;

package/dist/lib/compile.js

@@ -0,0 +1,36 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.compile = void 0;
+const oc_generic_template_compiler_1 = require("oc-generic-template-compiler");
+const oc_statics_compiler_1 = __importDefault(require("oc-statics-compiler"));
+const oc_template_preact_1 = require("oc-template-preact");
+const oc_vite_compiler_1 = require("oc-vite-compiler");
+const preset_vite_1 = require("@preact/preset-vite");
+const preactOCProviderTemplate_1 = __importDefault(require("./preactOCProviderTemplate"));
+const htmlTemplate_1 = __importDefault(require("./htmlTemplate"));
+exports.compile = (0, oc_generic_template_compiler_1.createCompile)({
+    compileView: (options, cb) => (0, oc_vite_compiler_1.viteView)({
+        ...options,
+        plugins: [(0, preset_vite_1.preact)()],
+        viewWrapper: ({ viewPath }) => (0, preactOCProviderTemplate_1.default)({ viewPath }),
+        htmlTemplate: htmlTemplate_1.default,
+        externals: (0, oc_template_preact_1.getInfo)().externals
+    }, cb),
+    compileServer: oc_vite_compiler_1.viteServer,
+    compileStatics: oc_statics_compiler_1.default,
+    getInfo: oc_template_preact_1.getInfo
+});
+// OPTIONS
+// =======
+// componentPath
+// componentPackage,
+// logger,
+// minify
+// ocPackage
+// publishPath
+// verbose,
+// watch,
+// production

package/dist/lib/htmlTemplate.d.ts

@@ -0,0 +1,6 @@
+export default function viewTemplate({ templateId, css, bundle, hash }: {
+    templateId: string;
+    css: string;
+    bundle: string;
+    hash: string;
+}): string;

package/{lib → dist/lib}/htmlTemplate.js

@@ -1,4 +1,11 @@
-const viewTemplate = ({ templateId, css, bundle, hash }) => `function(model){
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const cssesc_1 = __importDefault(require("cssesc"));
+function viewTemplate({ templateId, css, bundle, hash }) {
+    return `function(model){
   var modelHTML =  model.__html ? model.__html : '';
   var staticPath = model.preactComponent.props._staticPath;
   var props = JSON.stringify(model.preactComponent.props);
@@ -10,7 +17,7 @@ const viewTemplate = ({ templateId, css, bundle, hash }) => `function(model){
   var templateId = "${templateId}-" + count;
   window.oc.__typescriptReactTemplate.count++;
   return '<div id="' + templateId + '" class="${templateId}">' + modelHTML + '</div>' +
-    '${css ? '<style>' + css + '</style>' : ''}' +
+    '${css ? '<style>' + (0, cssesc_1.default)(css) + '</style>' : ''}' +
     '<script>' +
     'window.oc = window.oc || {};' +
     'oc.cmd = oc.cmd || [];' +
@@ -22,5 +29,5 @@ const viewTemplate = ({ templateId, css, bundle, hash }) => `function(model){
     '});' +
   '</script>'
 }`;
-
-module.exports = viewTemplate;
+}
+exports.default = viewTemplate;

package/dist/lib/preactOCProviderTemplate.d.ts

@@ -0,0 +1,3 @@
+export default function preactOCProviderTemplate({ viewPath }: {
+    viewPath: string;
+}): string;

package/{lib → dist/lib}/preactOCProviderTemplate.js

@@ -1,10 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
 const removeExtension = (path) => path.replace(/\.(t|j)sx?$/, '');
-
-const preactOCProviderTemplate = ({ viewPath }) => `
+function preactOCProviderTemplate({ viewPath }) {
+    return `
   import { render } from 'preact';
   import { useEffect } from 'preact/hooks';
   import View from '${removeExtension(viewPath)}';
-  import { DataProvider } from 'oc-template-preact-compiler/utils/useData'
+  import { DataProvider } from 'oc-template-preact-compiler/dist/utils/useData'
 
   function OCProvider(props: any): any {
     const { _staticPath, _baseUrl, _componentName, _componentVersion, ...rest } = props;
@@ -23,7 +25,7 @@ const preactOCProviderTemplate = ({ viewPath }) => `
         if (err) {
           return cb(err);
         }
-        cb(null, rest, data.preactComponent.props);
+        cb(null, rest, data.component.props);
       });
     }
 
@@ -53,5 +55,5 @@ const preactOCProviderTemplate = ({ viewPath }) => `
 
   export default renderer;
 `;
-
-module.exports = preactOCProviderTemplate;
+}
+exports.default = preactOCProviderTemplate;

package/dist/scaffold/src/src/App.d.ts

@@ -0,0 +1,2 @@
+declare const App: () => import("react/jsx-runtime").JSX.Element;
+export default App;

package/dist/scaffold/src/src/App.js

@@ -0,0 +1,30 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const hooks_1 = require("preact/hooks");
+const useData_1 = require("oc-template-preact-compiler/utils/useData");
+const styles_css_1 = __importDefault(require("./styles.css"));
+const App = () => {
+    const { firstName, lastName, userId, getData, getSetting } = (0, useData_1.useData)();
+    const staticPath = getSetting('staticPath');
+    const [additionalData, setAdditionalData] = (0, hooks_1.useState)(null);
+    const [error, setError] = (0, hooks_1.useState)('');
+    const fetchMoreData = async () => {
+        setError('');
+        try {
+            const data = await getData({ userId, getMoreData: true });
+            setAdditionalData(data);
+        }
+        catch (err) {
+            setError(String(err));
+        }
+    };
+    if (error) {
+        return (0, jsx_runtime_1.jsx)("div", { children: "Something wrong happened!" });
+    }
+    return ((0, jsx_runtime_1.jsxs)("div", { className: styles_css_1.default.container, children: [(0, jsx_runtime_1.jsx)("img", { width: "50", height: "50", src: `${staticPath}/public/logo.png`, alt: "Logo" }), (0, jsx_runtime_1.jsxs)("h1", { style: { margin: '0 0 20px 0' }, children: ["Hello, ", (0, jsx_runtime_1.jsx)("span", { style: { textDecoration: 'underline' }, children: firstName }), " ", lastName] }), additionalData && ((0, jsx_runtime_1.jsxs)("div", { className: styles_css_1.default.info, children: [(0, jsx_runtime_1.jsxs)("div", { className: styles_css_1.default.block, children: ["Age: ", additionalData.age] }), (0, jsx_runtime_1.jsxs)("div", { className: styles_css_1.default.block, children: ["Hobbies: ", additionalData.hobbies.map((x) => x.toLowerCase()).join(', ')] })] })), (0, jsx_runtime_1.jsx)("button", { className: styles_css_1.default.button, onClick: fetchMoreData, children: "Get extra information" })] }));
+};
+exports.default = App;

package/dist/scaffold/src/src/App.test.d.ts

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

package/dist/scaffold/src/src/App.test.js

@@ -0,0 +1,25 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const vitest_1 = require("vitest");
+const react_1 = require("@testing-library/react");
+const useData_1 = require("oc-template-preact-compiler/utils/useData");
+const App_1 = __importDefault(require("./App"));
+const getData = vitest_1.vi.fn();
+(0, vitest_1.describe)('App - Page', () => {
+    (0, vitest_1.beforeEach)(() => {
+        window.oc = { events: { on: vitest_1.vi.fn(), fire: vitest_1.vi.fn() } };
+    });
+    (0, vitest_1.afterEach)(() => {
+        vitest_1.vi.restoreAllMocks();
+    });
+    (0, vitest_1.it)('Gets more data when clicking the button', () => {
+        getData.mockImplementationOnce(() => Promise.resolve({}));
+        (0, react_1.render)((0, jsx_runtime_1.jsx)(useData_1.DataProvider, { value: { firstName: 'firstName', lastName: 'lastName', userId: 0, getData }, children: (0, jsx_runtime_1.jsx)(App_1.default, { firstName: "firstName", lastName: "lastName", userId: 0 }) }));
+        const extraInfoButton = react_1.screen.getByText(/Get extra information/i);
+        (0, vitest_1.expect)(extraInfoButton).toBeTruthy();
+    });
+});

package/dist/scaffold/src/src/server.d.ts

@@ -0,0 +1,3 @@
+import { Context } from 'oc-template-preact-compiler';
+import { AdditionalData, ClientProps, OcParameters } from './types';
+export declare function data(context: Context<OcParameters>, callback: (error: any, data: ClientProps | AdditionalData) => void): Promise<void>;

package/dist/scaffold/src/src/server.js

@@ -0,0 +1,28 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.data = void 0;
+const database = [
+    { name: 'John Doe', age: 34, hobbies: ['Swimming', 'Basketball'] },
+    { name: 'Jane Doe', age: 35, hobbies: ['Running', 'Rugby'] }
+];
+async function getUser(userId) {
+    return database[userId];
+}
+async function data(context, callback) {
+    const { userId } = context.params;
+    const user = await getUser(userId);
+    const shouldGetMoreData = context.params.getMoreData;
+    const [firstName, lastName] = user.name.split(/\s+/);
+    if (shouldGetMoreData) {
+        return callback(null, {
+            age: user.age,
+            hobbies: user.hobbies
+        });
+    }
+    return callback(null, {
+        userId,
+        firstName,
+        lastName
+    });
+}
+exports.data = data;

package/dist/scaffold/src/src/types.d.ts

@@ -0,0 +1,13 @@
+export interface OcParameters {
+    userId: number;
+    getMoreData?: boolean;
+}
+export interface AdditionalData {
+    hobbies: string[];
+    age: number;
+}
+export interface ClientProps extends Partial<AdditionalData> {
+    userId: number;
+    firstName: string;
+    lastName: string;
+}

package/dist/scaffold/src/src/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/scaffold/src/vite.config.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("vite").UserConfig & Promise<import("vite").UserConfig> & import("vite").UserConfigFnObject & import("vite").UserConfigExport;
+export default _default;

package/dist/scaffold/src/vite.config.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const vite_1 = require("vite");
+// https://vitejs.dev/config/
+exports.default = (0, vite_1.defineConfig)({
+    // Add your own plugins here for thinkgs like eslint or typecheckers
+    plugins: [],
+    // @ts-ignore Missing test property
+    test: {
+        environment: 'jsdom'
+    }
+});

package/dist/utils/useData.d.ts

@@ -0,0 +1,7 @@
+type PromiseData<T = any> = T & {
+    getData<O = any>(parameters?: Partial<T>): Promise<O>;
+    getSetting(setting: 'name' | 'version' | 'baseUrl' | 'staticPath'): string;
+};
+export declare const DataProvider: ({ children, ...props }: any) => import("react/jsx-runtime").JSX.Element;
+export declare function useData<T = any>(): PromiseData<T>;
+export {};

package/dist/utils/useData.js

@@ -0,0 +1,31 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useData = exports.DataProvider = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const preact_1 = require("preact");
+const hooks_1 = require("preact/hooks");
+const DataContext = (0, preact_1.createContext)({});
+const DataProvider = ({ children, ...props }) => {
+    // @ts-ignore children props
+    return (0, jsx_runtime_1.jsx)(DataContext.Provider, { value: props, children: children });
+};
+exports.DataProvider = DataProvider;
+function useData() {
+    const { value: { getData, ...rest } } = (0, hooks_1.useContext)(DataContext);
+    const asyncGetData = (0, hooks_1.useCallback)((data) => {
+        return new Promise((resolve, reject) => {
+            // @ts-ignore
+            getData({ ...rest, ...data }, (err, newData) => {
+                if (err) {
+                    reject(err);
+                }
+                else {
+                    resolve(newData);
+                }
+            });
+        });
+    }, []);
+    // @ts-ignore
+    return { getData: asyncGetData, ...rest };
+}
+exports.useData = useData;

package/package.json

@@ -1,16 +1,22 @@
 {
   "name": "oc-template-preact-compiler",
-  "version": "0.2.0",
+  "version": "0.3.0-beta.1",
   "description": "",
-  "main": "index.js",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "scripts": {
+    "build": "tsc",
+    "prepare": "npm run build",
+    "clean": "rm -rf .turbo && rm -rf node_modules && rm -rf dist"
+  },
   "repository": {
     "type": "git",
-    "url": "https://github.com/guestlinelabs/oc-template-preact.git"
+    "url": "https://github.com/opencomponents/vite-templates.git"
   },
   "bugs": {
-    "url": "https://github.com/guestlinelabs/oc-template-preact/issues"
+    "url": "https://github.com/opencomponents/vite-templates/issues"
   },
-  "homepage": "https://github.com/guestlinelabs/oc-template-preact#readme",
+  "homepage": "https://github.com/opencomponents/vite-templates#readme",
   "keywords": [
     "oc",
     "opencomponents",
@@ -22,15 +28,15 @@
     "email": "mkredz@gmail.com"
   },
   "license": "MIT",
-  "types": "./lib/oc-app.d.ts",
   "dependencies": {
     "@preact/preset-vite": "^2.5.0",
     "chalk": "^3.0.0",
+    "cssesc": "^3.0.0",
     "immer": "^9.0.6",
     "oc-generic-template-compiler": "2.1.0",
-    "oc-statics-compiler": "2.0.10",
-    "oc-template-preact": "0.0.2",
-    "oc-vite-compiler": "^2.1.0",
+    "oc-statics-compiler": "2.1.1",
+    "oc-template-preact": "*",
+    "oc-vite-compiler": "3.0.0-beta.2",
     "preact": "^10",
     "resolve": "^1.20.0"
   },
@@ -38,15 +44,11 @@
     "preact": "^10"
   },
   "files": [
-    "index.js",
-    "lib",
-    "utils",
-    "scaffold",
-    "README.md",
-    "LICENSE"
+    "dist/**",
+    "scaffold"
   ],
   "devDependencies": {
-    "fs-extra": "^10.0.0",
+    "@types/cssesc": "^3.0.2",
     "lodash": "^4.17.4",
     "prettier": "^2.3.2",
     "prettier-config-guestline": "2.0.0"

package/scaffold/src/package.json

@@ -33,7 +33,6 @@
     "@testing-library/react": "^14.0.0",
     "@testing-library/user-event": "^14.4.3",
     "jsdom": "^21.1.1",
-    "oc-template-preact": "0.0.2",
     "oc-template-preact-compiler": "0.2.0",
     "preact": "^10.13.2",
     "typescript": "5.0.2",

package/scaffold/src/src/App.test.tsx

@@ -1,6 +1,6 @@
 import { describe, it, afterEach, beforeEach, expect, vi } from 'vitest';
 import { render, screen } from '@testing-library/react';
-import { DataProvider } from 'oc-template-preact-compiler/utils/useData';
+import { DataProvider } from 'oc-template-preact-compiler/dist/utils/useData';
 
 import App from './App';
 

package/scaffold/src/src/App.tsx

@@ -1,5 +1,5 @@
 import { useState } from 'preact/hooks';
-import { useData } from 'oc-template-preact-compiler/utils/useData';
+import { useData } from 'oc-template-preact-compiler/dist/utils/useData';
 import styles from './styles.css';
 import type { AdditionalData, ClientProps } from './types';
 

package/scaffold/src/src/oc-app.d.ts

@@ -1,2 +1 @@
-/// <reference types="oc-template-preact" />
-/// <reference types="vite/client" />
+/// <reference types="oc-vite/client" />

package/index.js

@@ -1,11 +0,0 @@
-'use strict';
-
-const compile = require('./lib/compile');
-const template = require('oc-template-preact');
-
-module.exports = {
-  compile,
-  getCompiledTemplate: template.getCompiledTemplate,
-  getInfo: template.getInfo,
-  render: template.render
-};

package/lib/compile.js

@@ -1,55 +0,0 @@
-'use strict';
-
-const createCompile = require('oc-generic-template-compiler').createCompile;
-const compileStatics = require('oc-statics-compiler');
-const getInfo = require('oc-template-preact').getInfo;
-const { preact } = require('@preact/preset-vite');
-const { viteView, viteServer } = require('oc-vite-compiler');
-
-const verifyTypeScriptSetup = require('./verifyConfig');
-const higherOrderServerTemplate = require('./higherOrderServerTemplate');
-const preactOCProviderTemplate = require('./preactOCProviderTemplate');
-const htmlTemplate = require('./htmlTemplate');
-
-const compiler = createCompile({
-  compileView: (options, cb) =>
-    viteView(
-      {
-        ...options,
-        plugins: [preact()],
-        viewWrapper: ({ viewPath }) => preactOCProviderTemplate({ viewPath }),
-        htmlTemplate,
-        externals: getInfo().externals
-      },
-      cb
-    ),
-  compileServer: (options, cb) =>
-    viteServer({ ...options, serverWrapper: higherOrderServerTemplate }, cb),
-  compileStatics,
-  getInfo
-});
-
-const hasTsExtension = (file) => !!file.match(/\.tsx?$/);
-
-// OPTIONS
-// =======
-// componentPath
-// componentPackage,
-// logger,
-// minify
-// ocPackage
-// publishPath
-// verbose,
-// watch,
-// production
-module.exports = function compile(options, callback) {
-  const viewFileName = options.componentPackage.oc.files.template.src;
-  const serverFileName = options.componentPackage.oc.files.data;
-  const usingTypescript = hasTsExtension(viewFileName) || hasTsExtension(serverFileName);
-
-  if (usingTypescript) {
-    verifyTypeScriptSetup(options.componentPath);
-  }
-
-  return compiler(options, callback);
-};

package/lib/higherOrderServerTemplate.js

@@ -1,28 +0,0 @@
-const removeExtension = (path) => path.replace(/\.(j|t)sx?$/, '');
-
-const higherOrderServerTemplate = ({ serverPath, componentName, componentVersion }) => `
-import { data as dataProvider } from '${removeExtension(serverPath)}';
-
-export const data = (context : any, callback : (error: any, data?: any) => void) => {
-  dataProvider(context, (error: any, model: any) => {
-    if (error) {
-      return callback(error);
-    }
-    const props = Object.assign({}, model, {
-      _staticPath: context.staticPath,
-      _baseUrl: context.baseUrl,
-      _componentName: "${componentName}",
-      _componentVersion: "${componentVersion}"
-    });
-    const srcPathHasProtocol = context.staticPath.indexOf("http") === 0;
-    const srcPath = srcPathHasProtocol ? context.staticPath : ("https:" + context.staticPath);
-    return callback(null, Object.assign({}, {
-      preactComponent: {
-        props
-      }
-    }));
-  });
-}
-`;
-
-module.exports = higherOrderServerTemplate;

package/lib/oc-app.d.ts

@@ -1,72 +0,0 @@
-interface OC {
-  conf: {
-    templates: Array<{
-      type: string;
-      externals: string[];
-    }>;
-  };
-  cmd: {
-    push: (cb: (oc: OC) => void) => void;
-  };
-  events: {
-    on: (eventName: string, fn: (...data: any[]) => void) => void;
-    off: (eventName: string, fn?: (...data: any[]) => void) => void;
-    fire: (eventName: string, data?: any) => void;
-    reset: () => void;
-  };
-  renderNestedComponent: (ocElement: HTMLElement, cb: () => void) => void;
-}
-
-declare global {
-  interface Window {
-    oc: OC;
-  }
-
-  namespace JSX {
-    interface IntrinsicElements {
-      'oc-component': React.DetailedHTMLProps<
-        React.HTMLAttributes<HTMLElement> & { href: string },
-        HTMLElement
-      >;
-    }
-  }
-}
-
-export interface AcceptLanguage {
-  code: string;
-  script?: any;
-  region: string;
-  quality: number;
-}
-
-export interface Env {
-  name: string;
-}
-
-export interface Plugins {}
-
-export interface External {
-  global: string;
-  url: string;
-  name: string;
-}
-
-export interface Template {
-  type: string;
-  version: string;
-  externals: External[];
-}
-
-export interface Context<T = any, E = Env> {
-  acceptLanguage: AcceptLanguage[];
-  baseUrl: string;
-  env: E;
-  params: T;
-  plugins: Plugins;
-  requestHeaders: Record<string, string>;
-  requestIp: string;
-  setEmptyResponse: () => void;
-  setHeader: (header: string, value: string) => void;
-  staticPath: string;
-  templates: Template[];
-}

package/lib/verifyConfig.js

@@ -1,211 +0,0 @@
-const chalk = require('chalk');
-const fs = require('fs');
-const resolve = require('resolve');
-const path = require('path');
-const os = require('os');
-const immer = require('immer').produce;
-
-function writeJson(fileName, object) {
-  fs.writeFileSync(fileName, JSON.stringify(object, null, 2).replace(/\n/g, os.EOL) + os.EOL);
-}
-
-function verifyTypeScriptSetup(componentPath) {
-  const paths = {
-    appTsConfig: path.resolve(componentPath, 'tsconfig.json'),
-    yarnLockFile: path.resolve(componentPath, 'yarn.lock'),
-    appNodeModules: path.resolve(componentPath, 'node_modules'),
-    appTypeDeclarations: path.resolve(componentPath, 'src', 'oc-app.d.ts')
-  };
-  let firstTimeSetup = false;
-
-  if (!fs.existsSync(paths.appTsConfig)) {
-    writeJson(paths.appTsConfig, {});
-    firstTimeSetup = true;
-  }
-
-  const isYarn = fs.existsSync(paths.yarnLockFile);
-
-  // Ensure typescript is installed
-  let ts;
-  try {
-    ts = require(resolve.sync('typescript', {
-      basedir: paths.appNodeModules
-    }));
-  } catch (_) {
-    console.error(
-      chalk.bold.red(
-        `It looks like you're trying to use TypeScript but do not have ${chalk.bold(
-          'typescript'
-        )} installed.`
-      )
-    );
-    console.error(
-      chalk.bold(
-        'Please install',
-        chalk.cyan.bold('typescript'),
-        'by running',
-        chalk.cyan.bold(isYarn ? 'yarn add typescript' : 'npm install typescript') + '.'
-      )
-    );
-    console.error();
-    process.exit(1);
-  }
-
-  const compilerOptions = {
-    // These are suggested values and will be set when not present in the
-    // tsconfig.json
-    // 'parsedValue' matches the output value from ts.parseJsonConfigFileContent()
-    target: {
-      parsedValue: ts.ScriptTarget.ES5,
-      suggested: 'es5'
-    },
-    lib: { suggested: ['dom', 'dom.iterable', 'esnext'] },
-    allowJs: { suggested: true },
-    skipLibCheck: { suggested: true },
-    esModuleInterop: { suggested: true },
-    allowSyntheticDefaultImports: { suggested: true },
-    strict: { suggested: true },
-    forceConsistentCasingInFileNames: { suggested: true },
-    // TODO: Enable for v4.0 (#6936)
-    // noFallthroughCasesInSwitch: { suggested: true },
-
-    // These values are required and cannot be changed by the user
-    // Keep this in sync with the rollup config
-    module: {
-      parsedValue: ts.ModuleKind.ESNext,
-      value: 'esnext',
-      reason: 'for import() and import/export'
-    },
-    moduleResolution: {
-      parsedValue: ts.ModuleResolutionKind.NodeJs,
-      value: 'node',
-      reason: 'to match rollup resolution'
-    },
-    resolveJsonModule: { value: true, reason: 'to match rollup loader' },
-    isolatedModules: { value: true, reason: 'implementation limitation' },
-    jsx: {
-      parsedValue: ts.JsxEmit.ReactJSX,
-      suggested: 'react-jsx'
-    },
-    paths: { value: undefined, reason: 'aliased imports are not supported' }
-  };
-
-  const formatDiagnosticHost = {
-    getCanonicalFileName: (fileName) => fileName,
-    getCurrentDirectory: ts.sys.getCurrentDirectory,
-    getNewLine: () => os.EOL
-  };
-
-  const messages = [];
-  let appTsConfig;
-  let parsedTsConfig;
-  let parsedCompilerOptions;
-  try {
-    const { config: readTsConfig, error } = ts.readConfigFile(paths.appTsConfig, ts.sys.readFile);
-
-    if (error) {
-      throw new Error(ts.formatDiagnostic(error, formatDiagnosticHost));
-    }
-
-    appTsConfig = readTsConfig;
-
-    // Get TS to parse and resolve any "extends"
-    // Calling this function also mutates the tsconfig above,
-    // adding in "include" and "exclude", but the compilerOptions remain untouched
-    let result;
-    parsedTsConfig = immer(readTsConfig, (config) => {
-      result = ts.parseJsonConfigFileContent(config, ts.sys, path.dirname(paths.appTsConfig));
-    });
-
-    if (result.errors && result.errors.length) {
-      throw new Error(ts.formatDiagnostic(result.errors[0], formatDiagnosticHost));
-    }
-
-    parsedCompilerOptions = result.options;
-  } catch (e) {
-    if (e && e.name === 'SyntaxError') {
-      console.error(
-        chalk.red.bold(
-          'Could not parse',
-          chalk.cyan('tsconfig.json') + '.',
-          'Please make sure it contains syntactically correct JSON.'
-        )
-      );
-    }
-
-    console.log(e && e.message ? `${e.message}` : '');
-    process.exit(1);
-  }
-
-  if (appTsConfig.compilerOptions == null) {
-    appTsConfig.compilerOptions = {};
-    firstTimeSetup = true;
-  }
-
-  for (const option of Object.keys(compilerOptions)) {
-    const { parsedValue, value, suggested, reason } = compilerOptions[option];
-
-    const valueToCheck = parsedValue === undefined ? value : parsedValue;
-    const coloredOption = chalk.cyan('compilerOptions.' + option);
-
-    if (suggested != null) {
-      if (parsedCompilerOptions[option] === undefined) {
-        appTsConfig.compilerOptions[option] = suggested;
-        messages.push(
-          `${coloredOption} to be ${chalk.bold('suggested')} value: ${chalk.cyan.bold(
-            suggested
-          )} (this can be changed)`
-        );
-      }
-    } else if (parsedCompilerOptions[option] !== valueToCheck) {
-      appTsConfig.compilerOptions[option] = value;
-      messages.push(
-        `${coloredOption} ${chalk.bold(valueToCheck == null ? 'must not' : 'must')} be ${valueToCheck == null ? 'set' : chalk.cyan.bold(value)
-        }` + (reason != null ? ` (${reason})` : '')
-      );
-    }
-  }
-
-  // tsconfig will have the merged "include" and "exclude" by this point
-  if (parsedTsConfig.include == null) {
-    appTsConfig.include = ['src'];
-    messages.push(`${chalk.cyan('include')} should be ${chalk.cyan.bold('src')}`);
-  }
-
-  if (parsedTsConfig.exclude == null) {
-    appTsConfig.exclude = ['src/_package'];
-    messages.push(`${chalk.cyan('exclude')} should have ${chalk.cyan.bold('src/_package')}`);
-  }
-
-  if (messages.length > 0) {
-    if (firstTimeSetup) {
-      console.log(
-        chalk.bold('Your', chalk.cyan('tsconfig.json'), 'has been populated with default values.')
-      );
-      console.log();
-    } else {
-      console.warn(
-        chalk.bold(
-          'The following changes are being made to your',
-          chalk.cyan('tsconfig.json'),
-          'file:'
-        )
-      );
-      messages.forEach((message) => {
-        console.warn('  - ' + message);
-      });
-      console.warn();
-    }
-    writeJson(paths.appTsConfig, appTsConfig);
-  }
-
-  // Reference `oc-template-preact-compiler` types
-  if (!fs.existsSync(paths.appTypeDeclarations)) {
-    fs.writeFileSync(
-      paths.appTypeDeclarations,
-      `/// <reference types="oc-template-preact" />${os.EOL}`
-    );
-  }
-}
-
-module.exports = verifyTypeScriptSetup;

package/utils/.eslintrc.js

@@ -1,13 +0,0 @@
-module.exports = {
-  env: {
-    commonjs: false
-  },
-  parserOptions: {
-    ecmaVersion: 'latest',
-    sourceType: 'module',
-    ecmaFeatures: {
-      jsx: true
-    }
-  },
-  extends: '../../../.eslintrc.js'
-};

package/utils/useData.tsx

@@ -1,40 +0,0 @@
-import { createContext } from 'preact';
-import { useCallback, useContext } from 'preact/hooks';
-
-const DataContext = createContext<any>({});
-
-type Data<T = any> = T & {
-  getData(parameters: T, cb: (err: Error | null, data: any) => void): void;
-  getSetting(setting: 'name' | 'version' | 'baseUrl' | 'staticPath'): string;
-};
-
-type PromiseData<T = any> = T & {
-  getData<O = any>(parameters?: Partial<T>): Promise<O>;
-  getSetting(setting: 'name' | 'version' | 'baseUrl' | 'staticPath'): string;
-};
-
-export const DataProvider = ({ children, ...props }: any) => {
-  // @ts-ignore children props
-  return <DataContext.Provider value={props}>{children}</DataContext.Provider>;
-};
-
-export function useData<T = any>(): PromiseData<T> {
-  const {
-    value: { getData, ...rest }
-  }: { value: Data<T> } = useContext(DataContext);
-  const asyncGetData = useCallback(<O = any, I = any>(data: I) => {
-    return new Promise<O>((resolve, reject) => {
-      // @ts-ignore
-      getData({ ...rest, ...data }, (err, newData) => {
-        if (err) {
-          reject(err);
-        } else {
-          resolve(newData);
-        }
-      });
-    });
-  }, []);
-
-  // @ts-ignore
-  return { getData: asyncGetData, ...rest };
-}